Skip to content

Commit 5a82a6c

Browse files
authored
docs: add ru readme (#527)
1 parent 0d74a7c commit 5a82a6c

File tree

2 files changed

+94
-8
lines changed

2 files changed

+94
-8
lines changed

README-ru.md

Lines changed: 86 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,86 @@
1+
![Markdown Editor](https://github.com/user-attachments/assets/0b4e5f65-54cf-475f-9c68-557a4e9edb46)
2+
3+
# @gravity-ui/markdown-editor · [![npm package](https://img.shields.io/npm/v/@gravity-ui/markdown-editor)](https://www.npmjs.com/package/@gravity-ui/markdown-editor) [![CI](https://img.shields.io/github/actions/workflow/status/gravity-ui/markdown-editor/ci.yml?branch=main&label=CI)](https://github.com/gravity-ui/markdown-editor/actions/workflows/ci.yml?query=branch:main) [![Release](https://img.shields.io/github/actions/workflow/status/gravity-ui/markdown-editor/release.yml?branch=main&label=Release)](https://github.com/gravity-ui/markdown-editor/actions/workflows/release.yml?query=branch:main) [![storybook](https://img.shields.io/badge/Storybook-deployed-ff4685)](https://preview.gravity-ui.com/md-editor/)
4+
5+
## Редактор Markdown с поддержкой режимов WYSIWYG и Markup
6+
7+
`MarkdownEditor` — эффективный инструмент для работы с Markdown, сочетающий режимы WYSIWYG и Markup. Он позволяет создавать и редактировать контент в удобном визуальном режиме с полным контролем над разметкой.
8+
9+
### 🔧 Основные характеристики
10+
11+
- Поддержка базового синтаксиса Markdown и [YFM](https://ydocs.tech).
12+
- Расширяемость за счет использования движков ProseMirror и CodeMirror.
13+
- Возможность работы в режимах WYSIWYG и Markup для максимальной гибкости.
14+
15+
## Установка
16+
17+
```shell
18+
npm install @gravity-ui/markdown-editor
19+
```
20+
21+
### Необходимые зависимости
22+
23+
Для начала работы с пакетом в проекте необходимо предварительно установить следующие зависимости: `@diplodoc/transform`, `react`, `react-dom` и др. Подробную информацию можно найти в разделе `peerDependencies` файла `package.json`.
24+
25+
## Начало работы
26+
27+
`MarkdownEditor` поставляется в виде React-хука для создания экземпляра редактора и компонента для рендеринга представления.
28+
Для настройки стиля и темы см. [документацию UIKit](https://github.com/gravity-ui/uikit?tab=readme-ov-file#styles).
29+
30+
```tsx
31+
import React from 'react';
32+
import {useMarkdownEditor, MarkdownEditorView} from '@gravity-ui/markdown-editor';
33+
import {toaster} from '@gravity-ui/uikit/toaster-singleton-react-18';
34+
35+
function Editor({onSubmit}) {
36+
const editor = useMarkdownEditor({allowHTML: false});
37+
38+
React.useEffect(() => {
39+
function submitHandler() {
40+
// Serialize current content to markdown markup
41+
const value = editor.getValue();
42+
onSubmit(value);
43+
}
44+
45+
editor.on('submit', submitHandler);
46+
return () => {
47+
editor.off('submit', submitHandler);
48+
};
49+
}, [onSubmit]);
50+
51+
return <MarkdownEditorView stickyToolbar autofocus toaster={toaster} editor={editor} />;
52+
}
53+
```
54+
Полезные ссылки:
55+
- [Как подключить редактор в Create React App](https://preview.gravity-ui.com/md-editor/?path=/docs/docs-install-create-react-app--docs)
56+
- [Как добавить предварительный просмотр для режима разметки](https://preview.gravity-ui.com/md-editor/?path=/docs/docs-develop-preview--docs)
57+
- [Как добавить расширение HTML](https://preview.gravity-ui.com/md-editor/?path=/docs/docs-connect-html-block--docs)
58+
- [Как добавить расширение Latex](https://preview.gravity-ui.com/md-editor/?path=/docs/docs-connect-latex-extension--docs)
59+
- [Как добавить расширение Mermaid](https://preview.gravity-ui.com/md-editor/?path=/docs/docs-connect-mermaid-extension--docs)
60+
- [Как создать собственное расширение](https://preview.gravity-ui.com/md-editor/?path=/docs/docs-develop-extension-creation--docs)
61+
- [Как добавить расширение GPT](https://preview.gravity-ui.com/md-editor/?path=/docs/docs-connect-gpt--docs)
62+
- [Как добавить расширение привязки текста в Markdown](https://preview.gravity-ui.com/md-editor/?path=/docs/docs-develop-extension-with-popup--docs)
63+
64+
65+
66+
### i18n
67+
68+
Для настройки интернационализации используйте `configure`:
69+
70+
```typescript
71+
import {configure} from '@gravity-ui/markdown-editor';
72+
73+
configure({
74+
lang: 'ru',
75+
});
76+
```
77+
78+
Обязательно сделайте вызов `configure()` из [UIKit](https://github.com/gravity-ui/uikit?tab=readme-ov-file#i18n) и других UI-библиотек.
79+
80+
## Разработка
81+
82+
Для запуска Storybook в режиме разработки выполните следующую команду:
83+
84+
```shell
85+
npm start
86+
```

README.md

Lines changed: 8 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -52,14 +52,14 @@ function Editor({onSubmit}) {
5252
}
5353
```
5454
Read more:
55-
- [How to connect the editor in the Create React App](https://github.com/gravity-ui/markdown-editor/blob/main/docs/how-to-add-editor-with-create-react-app.md)
56-
- [How to add preview for markup mode](https://github.com/gravity-ui/markdown-editor/blob/main/docs/how-to-add-preview.md)
57-
- [How to add HTML extension](https://github.com/gravity-ui/markdown-editor/blob/main/docs/how-to-connect-html-extension.md)
58-
- [How to add Latex extension](https://github.com/gravity-ui/markdown-editor/blob/main/docs/how-to-connect-latex-extension.md)
59-
- [How to add Mermaid extension](https://github.com/gravity-ui/markdown-editor/blob/main/docs/how-to-connect-mermaid-extension.md)
60-
- [How to write extension](https://github.com/gravity-ui/markdown-editor/blob/main/docs/how-to-create-extension.md)
61-
- [How to add GPT extension](https://github.com/gravity-ui/markdown-editor/blob/main/docs/how-to-connect-gpt-extensions.md)
62-
- [How to add text binding extension in markdown](https://github.com/gravity-ui/markdown-editor/blob/main/docs/how-to-add-text-binding-extension-in-markdown.md)
55+
- [How to connect the editor in the Create React App](https://preview.gravity-ui.com/md-editor/?path=/docs/docs-install-create-react-app--docs)
56+
- [How to add preview for markup mode](https://preview.gravity-ui.com/md-editor/?path=/docs/docs-develop-preview--docs)
57+
- [How to add HTML extension](https://preview.gravity-ui.com/md-editor/?path=/docs/docs-connect-html-block--docs)
58+
- [How to add Latex extension](https://preview.gravity-ui.com/md-editor/?path=/docs/docs-connect-latex-extension--docs)
59+
- [How to add Mermaid extension](https://preview.gravity-ui.com/md-editor/?path=/docs/docs-connect-mermaid-extension--docs)
60+
- [How to write extension](https://preview.gravity-ui.com/md-editor/?path=/docs/docs-develop-extension-creation--docs)
61+
- [How to add GPT extension](https://preview.gravity-ui.com/md-editor/?path=/docs/docs-connect-gpt--docs)
62+
- [How to add text binding extension in markdown](https://preview.gravity-ui.com/md-editor/?path=/docs/docs-develop-extension-with-popup--docs)
6363

6464

6565

0 commit comments

Comments
 (0)