- Markdown - редактор
- MarkdownViewer - вьювер MD текста
Компоненты работают на основе библиотеки react-ui.
В peerDependencies указана совместимая версия пакета @skbkontur/react-ui.
Тема Textarea берется из ThemeContext из react-ui.
Стилизация Markdown через MarkdownThemeProvider.
| prop | type | default | description |
|---|---|---|---|
| api? | MarkdownApi | undefined | Методы апи для загрузки/скачивания файлов и меншена |
| fileApiUrl? | string | undefined | Url апи для файлов |
| profileUrl? | string | undefined | Url для профиля сотрудника |
| markdownViewer? | (value: string) => ReactNode | undefined | Превьювер мардауна, по умолчанию используется MarkdownViewer |
| panelHorizontalPadding? | number | undefined | Padding markdownActions (кнопки помощи форматирования текста), включает режим panel |
| renderFilesValidation? | (horizontalPadding: HorizontalPaddings, onReset: () => void) => ReactNode | undefined | Render валидации файла, если она нужна, максимальный размер файла = 10mb |
| hideActionsOptions | object (HideActionsOptions) | undefined | Скрыть отдельные кнопки на панели действий |
| showActionHints | boolean | true | Показывать подсказки к действиям |
| showShortKeys | boolean | true | Показывать сочетания клавиш для действия в хинте |
| onChangeViewMode? | (mode: ViewMode) => void | true | Callback изменения режима редактирования или просмотра |
| prop | type | default | description |
|---|---|---|---|
| fileDownloadApi? | (id: string) => Promise | undefined | Метод для загрузки файла |
| fileUploadApi? | (file: File) => Promise | undefined | Метод для скачивания файла |
| getUsersApi? | (query: string) => Promise<User[]> | undefined | Метод для получения списка пользователей |
| prop | type | default |
|---|---|---|
| fullscreenPadding? | number | undefined |
| panelPadding? | number | undefined |
| prop | type | description |
|---|---|---|
| colors | ColorScheme | Цветовая схема |
| elementsFontSize | string | font-size переменных темы react-ui: tabFontSize, btnFontSizeSmall, hintFontSize, checkboxBoxSize, menuItemFontSize |
| elementsLineHeight | string | line-height переменных темы react-ui: tabLineHeight |
| themeMode | string | Темный/светлый режим темы |
| droppablePlaceholderBgImage | string | Значение background-image для DroppablePlaceholder, если нужна пунктирная обводка в состоянии onDrag |
| reactUiTheme | string | Тема react-ui |
| prop | type | description |
|---|---|---|
| brand | string | Цвет сервиса |
| disabledButton | string | Цвет текста кнопки для переменной btnDisabledTextColor |
| grayDefault | string | Основной серый цвет, используется в кнопках, чекбоксах, иконках и т.д. |
| link | string | Цвет ссылок |
| panelBg | string | Цвет панели, в режиме panel |
| text | string | Цвет текста |
| textInverse | string | Инвертированный цвет текста (text: black --> inverseText: white) |
| emojiPickerBackgroundRGBColor | string | Цвет фона emoji-picker (RGB) |