@gravity-ui/markdown-editor 15.7.0 → 15.8.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/build/cjs/bundle/MarkdownEditorView.d.ts +7 -28
- package/build/cjs/bundle/MarkdownEditorView.js +49 -49
- package/build/cjs/bundle/MarkdownEditorView.js.map +1 -1
- package/build/cjs/bundle/toolbar/custom/ToolbarImagePopup.d.ts +1 -1
- package/build/cjs/bundle/toolbar/custom/ToolbarImagePopup.js +2 -2
- package/build/cjs/bundle/toolbar/custom/ToolbarImagePopup.js.map +1 -1
- package/build/cjs/bundle/toolbar/markup/MToolbarImagePopup.js +8 -1
- package/build/cjs/bundle/toolbar/markup/MToolbarImagePopup.js.map +1 -1
- package/build/cjs/extensions/additional/QuoteLink/index.css +1 -2
- package/build/cjs/forms/ImageForm.d.ts +1 -0
- package/build/cjs/forms/ImageForm.js +2 -2
- package/build/cjs/forms/ImageForm.js.map +1 -1
- package/build/cjs/markup/codemirror/create.js +16 -11
- package/build/cjs/markup/codemirror/create.js.map +1 -1
- package/build/cjs/version.js +1 -1
- package/build/cjs/version.js.map +1 -1
- package/build/esm/bundle/MarkdownEditorView.d.ts +7 -28
- package/build/esm/bundle/MarkdownEditorView.js +49 -49
- package/build/esm/bundle/MarkdownEditorView.js.map +1 -1
- package/build/esm/bundle/toolbar/custom/ToolbarImagePopup.d.ts +1 -1
- package/build/esm/bundle/toolbar/custom/ToolbarImagePopup.js +2 -2
- package/build/esm/bundle/toolbar/custom/ToolbarImagePopup.js.map +1 -1
- package/build/esm/bundle/toolbar/markup/MToolbarImagePopup.js +8 -1
- package/build/esm/bundle/toolbar/markup/MToolbarImagePopup.js.map +1 -1
- package/build/esm/extensions/additional/QuoteLink/index.css +1 -2
- package/build/esm/forms/ImageForm.d.ts +1 -0
- package/build/esm/forms/ImageForm.js +2 -2
- package/build/esm/forms/ImageForm.js.map +1 -1
- package/build/esm/markup/codemirror/create.js +16 -11
- package/build/esm/markup/codemirror/create.js.map +1 -1
- package/build/esm/version.js +1 -1
- package/build/esm/version.js.map +1 -1
- package/build/styles.css +1 -2
- package/package.json +2 -2
|
@@ -6,10 +6,7 @@ import type { MToolbarData, MToolbarItemData, WToolbarData, WToolbarItemData } f
|
|
|
6
6
|
import "../styles/styles.css";
|
|
7
7
|
import "./MarkdownEditorView.css";
|
|
8
8
|
export declare const cnEditorComponent: import("@bem-react/classname").ClassNameFormatter;
|
|
9
|
-
|
|
10
|
-
editor?: Editor;
|
|
11
|
-
autofocus?: boolean;
|
|
12
|
-
toolbarsPreset?: ToolbarsPreset;
|
|
9
|
+
type ToolbarConfigs = {
|
|
13
10
|
/**
|
|
14
11
|
* @deprecated use `toolbarsPreset` instead
|
|
15
12
|
*/
|
|
@@ -26,35 +23,17 @@ export type MarkdownEditorViewProps = ClassNameProps & QAProps & {
|
|
|
26
23
|
* @deprecated use `toolbarsPreset` instead
|
|
27
24
|
*/
|
|
28
25
|
wysiwygHiddenActionsConfig?: WToolbarItemData[];
|
|
29
|
-
/** @default true */
|
|
30
|
-
settingsVisible?: boolean;
|
|
31
|
-
stickyToolbar: boolean;
|
|
32
|
-
enableSubmitInPreview?: boolean;
|
|
33
|
-
hidePreviewAfterSubmit?: boolean;
|
|
34
26
|
};
|
|
35
|
-
|
|
27
|
+
type ViewProps = {
|
|
36
28
|
editor?: Editor;
|
|
37
29
|
autofocus?: boolean;
|
|
38
|
-
toolbarsPreset?: ToolbarsPreset;
|
|
39
|
-
/**
|
|
40
|
-
* @deprecated use `toolbarsPreset` instead
|
|
41
|
-
*/
|
|
42
|
-
markupToolbarConfig?: MToolbarData;
|
|
43
|
-
/**
|
|
44
|
-
* @deprecated use `toolbarsPreset` instead
|
|
45
|
-
*/
|
|
46
|
-
wysiwygToolbarConfig?: WToolbarData;
|
|
47
|
-
/**
|
|
48
|
-
* @deprecated use `toolbarsPreset` instead
|
|
49
|
-
*/
|
|
50
|
-
markupHiddenActionsConfig?: MToolbarItemData[];
|
|
51
|
-
/**
|
|
52
|
-
* @deprecated use `toolbarsPreset` instead
|
|
53
|
-
*/
|
|
54
|
-
wysiwygHiddenActionsConfig?: WToolbarItemData[];
|
|
55
30
|
/** @default true */
|
|
56
31
|
settingsVisible?: boolean;
|
|
32
|
+
toolbarsPreset?: ToolbarsPreset;
|
|
57
33
|
stickyToolbar: boolean;
|
|
58
34
|
enableSubmitInPreview?: boolean;
|
|
59
35
|
hidePreviewAfterSubmit?: boolean;
|
|
60
|
-
}
|
|
36
|
+
};
|
|
37
|
+
export type MarkdownEditorViewProps = ClassNameProps & ToolbarConfigs & ViewProps & QAProps & {};
|
|
38
|
+
export declare const MarkdownEditorView: import("react").ForwardRefExoticComponent<ClassNameProps & ToolbarConfigs & ViewProps & QAProps & import("react").RefAttributes<HTMLDivElement>>;
|
|
39
|
+
export {};
|
|
@@ -23,18 +23,7 @@ require("../styles/styles.css");
|
|
|
23
23
|
require("./MarkdownEditorView.css"); // eslint-disable-line import/order
|
|
24
24
|
exports.cnEditorComponent = (0, classname_1.cn)('editor-component');
|
|
25
25
|
const b = exports.cnEditorComponent;
|
|
26
|
-
|
|
27
|
-
const divRef = (0, react_use_1.useEnsuredForwardedRef)(ref);
|
|
28
|
-
const [isMounted, setIsMounted] = (0, react_1.useState)(false);
|
|
29
|
-
(0, react_1.useEffect)(() => {
|
|
30
|
-
setIsMounted(true);
|
|
31
|
-
}, []);
|
|
32
|
-
const [showPreview, , unsetShowPreview, toggleShowPreview] = (0, react_utils_1.useBooleanState)(false);
|
|
33
|
-
const context = (0, context_1.useMarkdownEditorContext)();
|
|
34
|
-
const editor = (props.editor ?? context);
|
|
35
|
-
if (!editor)
|
|
36
|
-
throw new Error('[MarkdownEditorView]: an instance of the editor must be passed through the props or context');
|
|
37
|
-
const { qa, autofocus, className, settingsVisible = true, toolbarsPreset, stickyToolbar, wysiwygToolbarConfig: initialWysiwygToolbarConfig, markupToolbarConfig: initialMarkupToolbarConfig, wysiwygHiddenActionsConfig: initialWysiwygHiddenActionsConfig, markupHiddenActionsConfig: initialMarkupHiddenActionsConfig, enableSubmitInPreview = true, hidePreviewAfterSubmit = false, } = props;
|
|
26
|
+
const EditorWrapper = (0, react_1.forwardRef)(({ autofocus, editor, editorMode, enableSubmitInPreview, hidePreviewAfterSubmit, isFocused, markupHiddenActionsConfig: initialMarkupHiddenActionsConfig, markupToolbarConfig: initialMarkupToolbarConfig, qa, settingsVisible, showPreview, stickyToolbar, toggleShowPreview, toolbarsPreset, unsetShowPreview, wysiwygHiddenActionsConfig: initialWysiwygHiddenActionsConfig, wysiwygToolbarConfig: initialWysiwygToolbarConfig, }, ref) => {
|
|
38
27
|
const { wysiwygToolbarConfig, markupToolbarConfig, wysiwygHiddenActionsConfig, markupHiddenActionsConfig, } = (0, react_1.useMemo)(() => (0, toolbarsConfigs_1.getToolbarsConfigs)({
|
|
39
28
|
toolbarsPreset,
|
|
40
29
|
props: {
|
|
@@ -52,13 +41,6 @@ exports.MarkdownEditorView = (0, react_1.forwardRef)((props, ref) => {
|
|
|
52
41
|
initialMarkupHiddenActionsConfig,
|
|
53
42
|
editor.preset,
|
|
54
43
|
]);
|
|
55
|
-
const rerender = (0, react_use_1.useUpdate)();
|
|
56
|
-
(0, react_1.useLayoutEffect)(() => {
|
|
57
|
-
editor.on('rerender', rerender);
|
|
58
|
-
return () => {
|
|
59
|
-
editor.off('rerender', rerender);
|
|
60
|
-
};
|
|
61
|
-
}, [editor, rerender]);
|
|
62
44
|
const onModeChange = (0, react_1.useCallback)((type) => {
|
|
63
45
|
editor.changeEditorMode({ mode: type, reason: 'settings' });
|
|
64
46
|
unsetShowPreview();
|
|
@@ -75,44 +57,67 @@ exports.MarkdownEditorView = (0, react_1.forwardRef)((props, ref) => {
|
|
|
75
57
|
if (showPreviewValue !== showPreview)
|
|
76
58
|
toggleShowPreview();
|
|
77
59
|
}, [editor, showPreview, toggleShowPreview]);
|
|
78
|
-
const editorMode = editor.currentMode;
|
|
79
|
-
const markupSplitMode = editor.splitModeEnabled && editor.splitMode && editorMode === 'markup';
|
|
80
60
|
const canRenderPreview = Boolean(editor.renderPreview && editorMode === 'markup' && !editor.splitModeEnabled);
|
|
81
61
|
(0, react_use_1.useKey)((e) => canRenderPreview && isPreviewKeyDown(e), (e) => {
|
|
82
62
|
e.preventDefault();
|
|
83
63
|
onShowPreviewChange(!showPreview);
|
|
84
64
|
}, { event: 'keydown' }, [showPreview, editorMode, onShowPreviewChange, canRenderPreview]);
|
|
85
|
-
|
|
86
|
-
const splitModeViewWrapperRef = (0, react_1.useRef)(null);
|
|
87
|
-
(0, react_1.useEffect)(() => {
|
|
88
|
-
if (showPreview) {
|
|
89
|
-
divRef.current.focus();
|
|
90
|
-
}
|
|
91
|
-
}, [divRef, showPreview]);
|
|
92
|
-
(0, react_use_1.useKey)((e) => enableSubmitInPreview &&
|
|
93
|
-
showPreview &&
|
|
94
|
-
isWrapperFocused(divRef) &&
|
|
95
|
-
isSubmitKeyDown(e), () => {
|
|
65
|
+
(0, react_use_1.useKey)((e) => Boolean(enableSubmitInPreview && showPreview && isFocused && isSubmitKeyDown(e)), () => {
|
|
96
66
|
editor.emit('submit', null);
|
|
97
67
|
if (hidePreviewAfterSubmit) {
|
|
98
68
|
onShowPreviewChange(false);
|
|
99
69
|
}
|
|
100
70
|
}, { event: 'keydown' }, [hidePreviewAfterSubmit, enableSubmitInPreview, showPreview, showPreview]);
|
|
101
|
-
const
|
|
102
|
-
editorMode,
|
|
103
|
-
settingsVisible,
|
|
104
|
-
editor.toolbarVisible,
|
|
105
|
-
editor.splitModeEnabled,
|
|
106
|
-
editor.splitMode,
|
|
71
|
+
const settingsProps = {
|
|
72
|
+
mode: editorMode,
|
|
107
73
|
onModeChange,
|
|
108
|
-
|
|
109
|
-
onToolbarVisibilityChange,
|
|
74
|
+
onShowPreviewChange,
|
|
110
75
|
onSplitModeChange,
|
|
76
|
+
onToolbarVisibilityChange,
|
|
77
|
+
renderPreviewButton: canRenderPreview,
|
|
78
|
+
showPreview,
|
|
79
|
+
splitMode: editor.splitMode,
|
|
80
|
+
splitModeEnabled: editor.splitModeEnabled,
|
|
111
81
|
stickyToolbar,
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
82
|
+
toolbarVisibility: editor.toolbarVisible && !showPreview,
|
|
83
|
+
};
|
|
84
|
+
return ((0, jsx_runtime_1.jsx)("div", { className: b('editor-wrapper'), ref: ref, "data-qa": qa, "data-mode": editor.currentMode, children: showPreview ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("div", { className: b('preview-wrapper'), children: editor.renderPreview?.({
|
|
85
|
+
getValue: editor.getValue,
|
|
86
|
+
mode: 'preview',
|
|
87
|
+
md: editor.mdOptions,
|
|
88
|
+
directiveSyntax: editor.directiveSyntax,
|
|
89
|
+
}) }), (0, jsx_runtime_1.jsx)(Settings, { ...settingsProps, settingsVisible: settingsVisible })] })) : ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [editorMode === 'wysiwyg' && ((0, jsx_runtime_1.jsx)(WysiwygEditorView_1.WysiwygEditorView, { editor: editor, autofocus: autofocus, settingsVisible: settingsVisible, toolbarConfig: wysiwygToolbarConfig, toolbarVisible: editor.toolbarVisible, hiddenActionsConfig: wysiwygHiddenActionsConfig, className: b('editor', { mode: editorMode }), toolbarClassName: b('toolbar'), stickyToolbar: stickyToolbar, children: (0, jsx_runtime_1.jsx)(Settings, { ...settingsProps, settingsVisible: settingsVisible && editor.toolbarVisible }) })), editorMode === 'markup' && ((0, jsx_runtime_1.jsx)(MarkupEditorView_1.MarkupEditorView, { editor: editor, autofocus: autofocus, settingsVisible: settingsVisible, toolbarConfig: markupToolbarConfig, toolbarVisible: editor.toolbarVisible, splitMode: editor.splitMode, splitModeEnabled: editor.splitModeEnabled, hiddenActionsConfig: markupHiddenActionsConfig, className: b('editor', { mode: editorMode }), toolbarClassName: b('toolbar'), stickyToolbar: stickyToolbar, children: (0, jsx_runtime_1.jsx)(Settings, { ...settingsProps, settingsVisible: settingsVisible && editor.toolbarVisible }) })), (0, jsx_runtime_1.jsx)(Settings, { ...settingsProps, settingsVisible: !editor.toolbarVisible && settingsVisible, renderPreviewButton: !editor.toolbarVisible && editorMode === 'markup' })] })) }));
|
|
90
|
+
});
|
|
91
|
+
EditorWrapper.displayName = 'EditorWrapper';
|
|
92
|
+
exports.MarkdownEditorView = (0, react_1.forwardRef)((props, ref) => {
|
|
93
|
+
const divRef = (0, react_use_1.useEnsuredForwardedRef)(ref);
|
|
94
|
+
const editorWrapperRef = (0, react_1.useRef)(null);
|
|
95
|
+
const [showPreview, , unsetShowPreview, toggleShowPreview] = (0, react_utils_1.useBooleanState)(false);
|
|
96
|
+
const [isMounted, setIsMounted] = (0, react_1.useState)(false);
|
|
97
|
+
(0, react_1.useEffect)(() => {
|
|
98
|
+
setIsMounted(true);
|
|
99
|
+
}, []);
|
|
100
|
+
const context = (0, context_1.useMarkdownEditorContext)();
|
|
101
|
+
const editor = (props.editor ?? context);
|
|
102
|
+
if (!editor)
|
|
103
|
+
throw new Error('[MarkdownEditorView]: an instance of the editor must be passed through the props or context');
|
|
104
|
+
const { autofocus, className, enableSubmitInPreview = true, hidePreviewAfterSubmit = false, markupHiddenActionsConfig, markupToolbarConfig, qa, settingsVisible = true, stickyToolbar, toolbarsPreset, wysiwygHiddenActionsConfig, wysiwygToolbarConfig, } = props;
|
|
105
|
+
const rerender = (0, react_use_1.useUpdate)();
|
|
106
|
+
(0, react_1.useLayoutEffect)(() => {
|
|
107
|
+
editor.on('rerender', rerender);
|
|
108
|
+
return () => {
|
|
109
|
+
editor.off('rerender', rerender);
|
|
110
|
+
};
|
|
111
|
+
}, [editor, rerender]);
|
|
112
|
+
const editorMode = editor.currentMode;
|
|
113
|
+
const markupSplitMode = editor.splitModeEnabled && editor.splitMode && editorMode === 'markup';
|
|
114
|
+
const splitModeViewWrapperRef = (0, react_1.useRef)(null);
|
|
115
115
|
const toaster = (0, uikit_1.useToaster)();
|
|
116
|
+
(0, react_1.useEffect)(() => {
|
|
117
|
+
if (showPreview) {
|
|
118
|
+
divRef.current.focus();
|
|
119
|
+
}
|
|
120
|
+
}, [divRef, showPreview]);
|
|
116
121
|
return ((0, jsx_runtime_1.jsx)(react_error_boundary_1.ErrorBoundary, { onError: (e) => {
|
|
117
122
|
logger_1.globalLogger.error(e);
|
|
118
123
|
editor.logger.error(e);
|
|
@@ -135,12 +140,7 @@ exports.MarkdownEditorView = (0, react_1.forwardRef)((props, ref) => {
|
|
|
135
140
|
}, children: (0, jsx_runtime_1.jsxs)("div", { ref: divRef, "data-qa": qa, className: b({
|
|
136
141
|
settings: settingsVisible,
|
|
137
142
|
split: markupSplitMode && editor.splitMode,
|
|
138
|
-
}, [className]), role: "button", tabIndex: 0, children: [(0, jsx_runtime_1.jsx)(
|
|
139
|
-
getValue: editor.getValue,
|
|
140
|
-
mode: 'preview',
|
|
141
|
-
md: editor.mdOptions,
|
|
142
|
-
directiveSyntax: editor.directiveSyntax,
|
|
143
|
-
}) }), settings] })) : ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [editorMode === 'wysiwyg' && ((0, jsx_runtime_1.jsx)(WysiwygEditorView_1.WysiwygEditorView, { editor: editor, autofocus: autofocus, settingsVisible: settingsVisible, toolbarConfig: wysiwygToolbarConfig, toolbarVisible: editor.toolbarVisible, hiddenActionsConfig: wysiwygHiddenActionsConfig, className: b('editor', { mode: editorMode }), toolbarClassName: b('toolbar'), stickyToolbar: stickyToolbar, children: editor.toolbarVisible && settingsVisible && settings })), editorMode === 'markup' && ((0, jsx_runtime_1.jsx)(MarkupEditorView_1.MarkupEditorView, { editor: editor, autofocus: autofocus, settingsVisible: settingsVisible, toolbarConfig: markupToolbarConfig, toolbarVisible: editor.toolbarVisible, splitMode: editor.splitMode, splitModeEnabled: editor.splitModeEnabled, hiddenActionsConfig: markupHiddenActionsConfig, className: b('editor', { mode: editorMode }), toolbarClassName: b('toolbar'), stickyToolbar: stickyToolbar, children: editor.toolbarVisible && settings })), !editor.toolbarVisible && settings] })) }), markupSplitMode && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [editor.splitMode === 'horizontal' ? ((0, jsx_runtime_1.jsx)(HorizontalDrag_1.HorizontalDrag, { editor: editor, isMounted: isMounted, leftElRef: editorWrapperRef, rightElRef: splitModeViewWrapperRef, wrapperRef: divRef })) : ((0, jsx_runtime_1.jsx)("div", { className: b('resizer') })), (0, jsx_runtime_1.jsx)(SplitModeView_1.SplitModeView, { editor: editor, ref: splitModeViewWrapperRef })] }))] }) }));
|
|
143
|
+
}, [className]), role: "button", tabIndex: 0, children: [(0, jsx_runtime_1.jsx)(EditorWrapper, { autofocus: autofocus, editor: editor, editorMode: editorMode, enableSubmitInPreview: enableSubmitInPreview, hidePreviewAfterSubmit: hidePreviewAfterSubmit, isFocused: isWrapperFocused(divRef), markupHiddenActionsConfig: markupHiddenActionsConfig, markupToolbarConfig: markupToolbarConfig, qa: "g-md-editor-mode", ref: editorWrapperRef, settingsVisible: settingsVisible, showPreview: showPreview, stickyToolbar: stickyToolbar, toggleShowPreview: toggleShowPreview, toolbarsPreset: toolbarsPreset, unsetShowPreview: unsetShowPreview, wysiwygHiddenActionsConfig: wysiwygHiddenActionsConfig, wysiwygToolbarConfig: wysiwygToolbarConfig }), markupSplitMode && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [editor.splitMode === 'horizontal' ? ((0, jsx_runtime_1.jsx)(HorizontalDrag_1.HorizontalDrag, { editor: editor, isMounted: isMounted, leftElRef: editorWrapperRef, rightElRef: splitModeViewWrapperRef, wrapperRef: divRef })) : ((0, jsx_runtime_1.jsx)("div", { className: b('resizer') })), (0, jsx_runtime_1.jsx)(SplitModeView_1.SplitModeView, { editor: editor, ref: splitModeViewWrapperRef })] }))] }) }));
|
|
144
144
|
});
|
|
145
145
|
exports.MarkdownEditorView.displayName = 'MarkdownEditorView';
|
|
146
146
|
const MarkupSearchAnchor = ({ mode }) => ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: mode === 'markup' && (0, jsx_runtime_1.jsx)("div", { className: "g-md-search-anchor" }) }));
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MarkdownEditorView.js","sourceRoot":"../../../src","sources":["bundle/MarkdownEditorView.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n forwardRef,\n useCallback,\n useEffect,\n useLayoutEffect,\n useMemo,\n useRef,\n useState,\n} from 'react';\n\nimport {type QAProps, useToaster} from '@gravity-ui/uikit';\nimport {ErrorBoundary} from 'react-error-boundary';\nimport {useEnsuredForwardedRef, useKey, useUpdate} from 'react-use';\n\nimport {type ClassNameProps, cn} from '../classname';\nimport {i18n} from '../i18n/bundle';\nimport {globalLogger} from '../logger';\nimport type {ToolbarsPreset} from '../modules/toolbars/types';\nimport {useBooleanState, useSticky} from '../react-utils';\nimport {isMac} from '../utils';\n\nimport type {Editor, EditorInt} from './Editor';\nimport {HorizontalDrag} from './HorizontalDrag';\nimport {MarkupEditorView} from './MarkupEditorView';\nimport {SplitModeView} from './SplitModeView';\nimport {WysiwygEditorView} from './WysiwygEditorView';\nimport {useMarkdownEditorContext} from './context';\nimport {EditorSettings, type EditorSettingsProps} from './settings';\nimport {stickyCn} from './sticky';\nimport type {MToolbarData, MToolbarItemData, WToolbarData, WToolbarItemData} from './toolbar/types';\nimport {getToolbarsConfigs} from './toolbar/utils/toolbarsConfigs';\nimport type {MarkdownEditorMode} from './types';\n\nimport '../styles/styles.scss';\nimport './MarkdownEditorView.scss'; // eslint-disable-line import/order\n\nexport const cnEditorComponent = cn('editor-component');\nconst b = cnEditorComponent;\n\nexport type MarkdownEditorViewProps = ClassNameProps &\n QAProps & {\n editor?: Editor;\n autofocus?: boolean;\n toolbarsPreset?: ToolbarsPreset;\n /**\n * @deprecated use `toolbarsPreset` instead\n */\n markupToolbarConfig?: MToolbarData;\n /**\n * @deprecated use `toolbarsPreset` instead\n */\n wysiwygToolbarConfig?: WToolbarData;\n /**\n * @deprecated use `toolbarsPreset` instead\n */\n markupHiddenActionsConfig?: MToolbarItemData[];\n /**\n * @deprecated use `toolbarsPreset` instead\n */\n wysiwygHiddenActionsConfig?: WToolbarItemData[];\n /** @default true */\n settingsVisible?: boolean;\n stickyToolbar: boolean;\n enableSubmitInPreview?: boolean;\n hidePreviewAfterSubmit?: boolean;\n };\n\nexport const MarkdownEditorView = forwardRef<HTMLDivElement, MarkdownEditorViewProps>(\n (props, ref) => {\n const divRef = useEnsuredForwardedRef(ref as React.MutableRefObject<HTMLDivElement>);\n\n const [isMounted, setIsMounted] = useState(false);\n useEffect(() => {\n setIsMounted(true);\n }, []);\n\n const [showPreview, , unsetShowPreview, toggleShowPreview] = useBooleanState(false);\n\n const context = useMarkdownEditorContext();\n const editor = (props.editor ?? context) as EditorInt;\n if (!editor)\n throw new Error(\n '[MarkdownEditorView]: an instance of the editor must be passed through the props or context',\n );\n\n const {\n qa,\n autofocus,\n className,\n settingsVisible = true,\n toolbarsPreset,\n stickyToolbar,\n wysiwygToolbarConfig: initialWysiwygToolbarConfig,\n markupToolbarConfig: initialMarkupToolbarConfig,\n wysiwygHiddenActionsConfig: initialWysiwygHiddenActionsConfig,\n markupHiddenActionsConfig: initialMarkupHiddenActionsConfig,\n enableSubmitInPreview = true,\n hidePreviewAfterSubmit = false,\n } = props;\n\n const {\n wysiwygToolbarConfig,\n markupToolbarConfig,\n wysiwygHiddenActionsConfig,\n markupHiddenActionsConfig,\n } = useMemo(\n () =>\n getToolbarsConfigs({\n toolbarsPreset,\n props: {\n wysiwygToolbarConfig: initialWysiwygToolbarConfig,\n markupToolbarConfig: initialMarkupToolbarConfig,\n wysiwygHiddenActionsConfig: initialWysiwygHiddenActionsConfig,\n markupHiddenActionsConfig: initialMarkupHiddenActionsConfig,\n },\n preset: editor.preset,\n }),\n [\n toolbarsPreset,\n initialWysiwygToolbarConfig,\n initialMarkupToolbarConfig,\n initialWysiwygHiddenActionsConfig,\n initialMarkupHiddenActionsConfig,\n editor.preset,\n ],\n );\n\n const rerender = useUpdate();\n useLayoutEffect(() => {\n editor.on('rerender', rerender);\n return () => {\n editor.off('rerender', rerender);\n };\n }, [editor, rerender]);\n\n const onModeChange = useCallback(\n (type: MarkdownEditorMode) => {\n editor.changeEditorMode({mode: type, reason: 'settings'});\n unsetShowPreview();\n },\n [editor, unsetShowPreview],\n );\n const onToolbarVisibilityChange = useCallback(\n (visible: boolean) => {\n editor.changeToolbarVisibility({visible});\n },\n [editor],\n );\n const onSplitModeChange = useCallback(\n (splitModeEnabled: boolean) => {\n unsetShowPreview();\n editor.changeSplitModeEnabled({splitModeEnabled});\n },\n [editor, unsetShowPreview],\n );\n\n const onShowPreviewChange = useCallback(\n (showPreviewValue: boolean) => {\n editor.changeSplitModeEnabled({splitModeEnabled: false});\n if (showPreviewValue !== showPreview) toggleShowPreview();\n },\n [editor, showPreview, toggleShowPreview],\n );\n\n const editorMode = editor.currentMode;\n const markupSplitMode =\n editor.splitModeEnabled && editor.splitMode && editorMode === 'markup';\n const canRenderPreview = Boolean(\n editor.renderPreview && editorMode === 'markup' && !editor.splitModeEnabled,\n );\n\n useKey(\n (e) => canRenderPreview && isPreviewKeyDown(e),\n (e) => {\n e.preventDefault();\n onShowPreviewChange(!showPreview);\n },\n {event: 'keydown'},\n [showPreview, editorMode, onShowPreviewChange, canRenderPreview],\n );\n\n const editorWrapperRef = useRef(null);\n const splitModeViewWrapperRef = useRef(null);\n\n useEffect(() => {\n if (showPreview) {\n divRef.current.focus();\n }\n }, [divRef, showPreview]);\n\n useKey(\n (e) =>\n enableSubmitInPreview &&\n showPreview &&\n isWrapperFocused(divRef) &&\n isSubmitKeyDown(e),\n () => {\n editor.emit('submit', null);\n\n if (hidePreviewAfterSubmit) {\n onShowPreviewChange(false);\n }\n },\n {event: 'keydown'},\n [hidePreviewAfterSubmit, enableSubmitInPreview, showPreview, showPreview],\n );\n\n const settings = useMemo(\n () => (\n <Settings\n mode={editorMode}\n settingsVisible={settingsVisible}\n onModeChange={onModeChange}\n toolbarVisibility={editor.toolbarVisible && !showPreview}\n onToolbarVisibilityChange={onToolbarVisibilityChange}\n onSplitModeChange={onSplitModeChange}\n splitModeEnabled={editor.splitModeEnabled}\n splitMode={editor.splitMode}\n stickyToolbar={stickyToolbar}\n onShowPreviewChange={onShowPreviewChange}\n showPreview={showPreview}\n renderPreviewButton={canRenderPreview}\n />\n ),\n [\n editorMode,\n settingsVisible,\n editor.toolbarVisible,\n editor.splitModeEnabled,\n editor.splitMode,\n onModeChange,\n showPreview,\n onToolbarVisibilityChange,\n onSplitModeChange,\n stickyToolbar,\n onShowPreviewChange,\n canRenderPreview,\n ],\n );\n\n const toaster = useToaster();\n\n return (\n <ErrorBoundary\n onError={(e) => {\n globalLogger.error(e);\n editor.logger.error(e);\n }}\n fallbackRender={({error, resetErrorBoundary}) => {\n toaster.add({\n theme: 'danger',\n name: 'g-md-editor-error',\n title: i18n('error-title'),\n content: error.message,\n });\n setTimeout(() => {\n resetErrorBoundary();\n editor.changeEditorMode({\n mode: 'markup',\n reason: 'error-boundary',\n emit: false,\n });\n });\n return null;\n }}\n >\n <div\n ref={divRef}\n data-qa={qa}\n className={b(\n {\n settings: settingsVisible,\n split: markupSplitMode && editor.splitMode,\n },\n [className],\n )}\n role=\"button\"\n tabIndex={0}\n >\n <div\n className={b('editor-wrapper')}\n ref={editorWrapperRef}\n data-qa=\"g-md-editor-mode\"\n data-mode={editor.currentMode}\n >\n {showPreview ? (\n <>\n <div className={b('preview-wrapper')}>\n {editor.renderPreview?.({\n getValue: editor.getValue,\n mode: 'preview',\n md: editor.mdOptions,\n directiveSyntax: editor.directiveSyntax,\n })}\n </div>\n {settings}\n </>\n ) : (\n <>\n {editorMode === 'wysiwyg' && (\n <WysiwygEditorView\n editor={editor}\n autofocus={autofocus}\n settingsVisible={settingsVisible}\n toolbarConfig={wysiwygToolbarConfig}\n toolbarVisible={editor.toolbarVisible}\n hiddenActionsConfig={wysiwygHiddenActionsConfig}\n className={b('editor', {mode: editorMode})}\n toolbarClassName={b('toolbar')}\n stickyToolbar={stickyToolbar}\n >\n {editor.toolbarVisible && settingsVisible && settings}\n </WysiwygEditorView>\n )}\n {editorMode === 'markup' && (\n <MarkupEditorView\n editor={editor}\n autofocus={autofocus}\n settingsVisible={settingsVisible}\n toolbarConfig={markupToolbarConfig}\n toolbarVisible={editor.toolbarVisible}\n splitMode={editor.splitMode}\n splitModeEnabled={editor.splitModeEnabled}\n hiddenActionsConfig={markupHiddenActionsConfig}\n className={b('editor', {mode: editorMode})}\n toolbarClassName={b('toolbar')}\n stickyToolbar={stickyToolbar}\n >\n {editor.toolbarVisible && settings}\n </MarkupEditorView>\n )}\n {!editor.toolbarVisible && settings}\n </>\n )}\n </div>\n\n {markupSplitMode && (\n <>\n {editor.splitMode === 'horizontal' ? (\n <HorizontalDrag\n editor={editor}\n isMounted={isMounted}\n leftElRef={editorWrapperRef}\n rightElRef={splitModeViewWrapperRef}\n wrapperRef={divRef}\n />\n ) : (\n <div className={b('resizer')} />\n )}\n <SplitModeView editor={editor} ref={splitModeViewWrapperRef} />\n </>\n )}\n </div>\n </ErrorBoundary>\n );\n },\n);\nMarkdownEditorView.displayName = 'MarkdownEditorView';\n\ninterface MarkupSearchAnchorProps extends Pick<EditorSettingsProps, 'mode'> {}\n\nconst MarkupSearchAnchor: React.FC<MarkupSearchAnchorProps> = ({mode}) => (\n <>{mode === 'markup' && <div className=\"g-md-search-anchor\"></div>}</>\n);\n\nfunction Settings(props: EditorSettingsProps & {stickyToolbar: boolean}) {\n const wrapperRef = useRef<HTMLDivElement>(null);\n const isSticky = useSticky(wrapperRef) && props.toolbarVisibility && props.stickyToolbar;\n\n return (\n <>\n {(props.renderPreviewButton || props.settingsVisible) && (\n <div className={b('settings-wrapper')}>\n <div\n ref={wrapperRef}\n className={stickyCn.settings({\n withToolbar: props.toolbarVisibility,\n stickyActive: isSticky,\n })}\n >\n <EditorSettings {...props} />\n <MarkupSearchAnchor {...props} />\n </div>\n </div>\n )}\n </>\n );\n}\n\nfunction isPreviewKeyDown(e: KeyboardEvent) {\n const modKey = isMac() ? e.metaKey : e.ctrlKey;\n return modKey && e.shiftKey && e.code === 'KeyP';\n}\n\nfunction isWrapperFocused(divRef: React.RefObject<HTMLDivElement>) {\n return document.activeElement === divRef.current;\n}\n\nfunction isSubmitKeyDown(e: KeyboardEvent) {\n const modKey = isMac() ? e.metaKey : e.ctrlKey;\n return modKey && e.code === 'Enter';\n}\n"]}
|
|
1
|
+
{"version":3,"file":"MarkdownEditorView.js","sourceRoot":"../../../src","sources":["bundle/MarkdownEditorView.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n forwardRef,\n useCallback,\n useEffect,\n useLayoutEffect,\n useMemo,\n useRef,\n useState,\n} from 'react';\n\nimport {type QAProps, useToaster} from '@gravity-ui/uikit';\nimport {ErrorBoundary} from 'react-error-boundary';\nimport {useEnsuredForwardedRef, useKey, useUpdate} from 'react-use';\n\nimport {type ClassNameProps, cn} from '../classname';\nimport {i18n} from '../i18n/bundle';\nimport {globalLogger} from '../logger';\nimport type {ToolbarsPreset} from '../modules/toolbars/types';\nimport {useBooleanState, useSticky} from '../react-utils';\nimport {isMac} from '../utils';\n\nimport type {Editor, EditorInt} from './Editor';\nimport {HorizontalDrag} from './HorizontalDrag';\nimport {MarkupEditorView} from './MarkupEditorView';\nimport {SplitModeView} from './SplitModeView';\nimport {WysiwygEditorView} from './WysiwygEditorView';\nimport {useMarkdownEditorContext} from './context';\nimport {EditorSettings, type EditorSettingsProps} from './settings';\nimport {stickyCn} from './sticky';\nimport type {MToolbarData, MToolbarItemData, WToolbarData, WToolbarItemData} from './toolbar/types';\nimport {getToolbarsConfigs} from './toolbar/utils/toolbarsConfigs';\nimport type {MarkdownEditorMode} from './types';\n\nimport '../styles/styles.scss';\nimport './MarkdownEditorView.scss'; // eslint-disable-line import/order\n\nexport const cnEditorComponent = cn('editor-component');\nconst b = cnEditorComponent;\n\ninterface EditorWrapperProps extends QAProps, ToolbarConfigs, Omit<ViewProps, 'editor'> {\n editor: EditorInt;\n editorMode: MarkdownEditorMode;\n isFocused: boolean;\n showPreview: boolean;\n toggleShowPreview: () => void;\n unsetShowPreview: () => void;\n}\nconst EditorWrapper = forwardRef<HTMLDivElement, EditorWrapperProps>(\n (\n {\n autofocus,\n editor,\n editorMode,\n enableSubmitInPreview,\n hidePreviewAfterSubmit,\n isFocused,\n markupHiddenActionsConfig: initialMarkupHiddenActionsConfig,\n markupToolbarConfig: initialMarkupToolbarConfig,\n qa,\n settingsVisible,\n showPreview,\n stickyToolbar,\n toggleShowPreview,\n toolbarsPreset,\n unsetShowPreview,\n wysiwygHiddenActionsConfig: initialWysiwygHiddenActionsConfig,\n wysiwygToolbarConfig: initialWysiwygToolbarConfig,\n },\n ref,\n ) => {\n const {\n wysiwygToolbarConfig,\n markupToolbarConfig,\n wysiwygHiddenActionsConfig,\n markupHiddenActionsConfig,\n } = useMemo(\n () =>\n getToolbarsConfigs({\n toolbarsPreset,\n props: {\n wysiwygToolbarConfig: initialWysiwygToolbarConfig,\n markupToolbarConfig: initialMarkupToolbarConfig,\n wysiwygHiddenActionsConfig: initialWysiwygHiddenActionsConfig,\n markupHiddenActionsConfig: initialMarkupHiddenActionsConfig,\n },\n preset: editor.preset,\n }),\n [\n toolbarsPreset,\n initialWysiwygToolbarConfig,\n initialMarkupToolbarConfig,\n initialWysiwygHiddenActionsConfig,\n initialMarkupHiddenActionsConfig,\n editor.preset,\n ],\n );\n const onModeChange = useCallback(\n (type: MarkdownEditorMode) => {\n editor.changeEditorMode({mode: type, reason: 'settings'});\n unsetShowPreview();\n },\n [editor, unsetShowPreview],\n );\n const onToolbarVisibilityChange = useCallback(\n (visible: boolean) => {\n editor.changeToolbarVisibility({visible});\n },\n [editor],\n );\n const onSplitModeChange = useCallback(\n (splitModeEnabled: boolean) => {\n unsetShowPreview();\n editor.changeSplitModeEnabled({splitModeEnabled});\n },\n [editor, unsetShowPreview],\n );\n const onShowPreviewChange = useCallback(\n (showPreviewValue: boolean) => {\n editor.changeSplitModeEnabled({splitModeEnabled: false});\n if (showPreviewValue !== showPreview) toggleShowPreview();\n },\n [editor, showPreview, toggleShowPreview],\n );\n const canRenderPreview = Boolean(\n editor.renderPreview && editorMode === 'markup' && !editor.splitModeEnabled,\n );\n\n useKey(\n (e) => canRenderPreview && isPreviewKeyDown(e),\n (e) => {\n e.preventDefault();\n onShowPreviewChange(!showPreview);\n },\n {event: 'keydown'},\n [showPreview, editorMode, onShowPreviewChange, canRenderPreview],\n );\n\n useKey(\n (e) => Boolean(enableSubmitInPreview && showPreview && isFocused && isSubmitKeyDown(e)),\n () => {\n editor.emit('submit', null);\n\n if (hidePreviewAfterSubmit) {\n onShowPreviewChange(false);\n }\n },\n {event: 'keydown'},\n [hidePreviewAfterSubmit, enableSubmitInPreview, showPreview, showPreview],\n );\n\n const settingsProps = {\n mode: editorMode,\n onModeChange,\n onShowPreviewChange,\n onSplitModeChange,\n onToolbarVisibilityChange,\n renderPreviewButton: canRenderPreview,\n showPreview,\n splitMode: editor.splitMode,\n splitModeEnabled: editor.splitModeEnabled,\n stickyToolbar,\n toolbarVisibility: editor.toolbarVisible && !showPreview,\n };\n\n return (\n <div\n className={b('editor-wrapper')}\n ref={ref}\n data-qa={qa}\n data-mode={editor.currentMode}\n >\n {showPreview ? (\n <>\n <div className={b('preview-wrapper')}>\n {editor.renderPreview?.({\n getValue: editor.getValue,\n mode: 'preview',\n md: editor.mdOptions,\n directiveSyntax: editor.directiveSyntax,\n })}\n </div>\n <Settings {...settingsProps} settingsVisible={settingsVisible} />\n </>\n ) : (\n <>\n {editorMode === 'wysiwyg' && (\n <WysiwygEditorView\n editor={editor}\n autofocus={autofocus}\n settingsVisible={settingsVisible}\n toolbarConfig={wysiwygToolbarConfig}\n toolbarVisible={editor.toolbarVisible}\n hiddenActionsConfig={wysiwygHiddenActionsConfig}\n className={b('editor', {mode: editorMode})}\n toolbarClassName={b('toolbar')}\n stickyToolbar={stickyToolbar}\n >\n <Settings\n {...settingsProps}\n settingsVisible={settingsVisible && editor.toolbarVisible}\n />\n </WysiwygEditorView>\n )}\n {editorMode === 'markup' && (\n <MarkupEditorView\n editor={editor}\n autofocus={autofocus}\n settingsVisible={settingsVisible}\n toolbarConfig={markupToolbarConfig}\n toolbarVisible={editor.toolbarVisible}\n splitMode={editor.splitMode}\n splitModeEnabled={editor.splitModeEnabled}\n hiddenActionsConfig={markupHiddenActionsConfig}\n className={b('editor', {mode: editorMode})}\n toolbarClassName={b('toolbar')}\n stickyToolbar={stickyToolbar}\n >\n <Settings\n {...settingsProps}\n settingsVisible={settingsVisible && editor.toolbarVisible}\n />\n </MarkupEditorView>\n )}\n <Settings\n {...settingsProps}\n settingsVisible={!editor.toolbarVisible && settingsVisible}\n renderPreviewButton={!editor.toolbarVisible && editorMode === 'markup'}\n />\n </>\n )}\n </div>\n );\n },\n);\n\nEditorWrapper.displayName = 'EditorWrapper';\n\ntype ToolbarConfigs = {\n /**\n * @deprecated use `toolbarsPreset` instead\n */\n markupToolbarConfig?: MToolbarData;\n /**\n * @deprecated use `toolbarsPreset` instead\n */\n wysiwygToolbarConfig?: WToolbarData;\n /**\n * @deprecated use `toolbarsPreset` instead\n */\n markupHiddenActionsConfig?: MToolbarItemData[];\n /**\n * @deprecated use `toolbarsPreset` instead\n */\n wysiwygHiddenActionsConfig?: WToolbarItemData[];\n};\n\ntype ViewProps = {\n editor?: Editor;\n autofocus?: boolean;\n /** @default true */\n settingsVisible?: boolean;\n toolbarsPreset?: ToolbarsPreset;\n stickyToolbar: boolean;\n enableSubmitInPreview?: boolean;\n hidePreviewAfterSubmit?: boolean;\n};\n\nexport type MarkdownEditorViewProps = ClassNameProps & ToolbarConfigs & ViewProps & QAProps & {};\n\nexport const MarkdownEditorView = forwardRef<HTMLDivElement, MarkdownEditorViewProps>(\n (props, ref) => {\n const divRef = useEnsuredForwardedRef(ref as React.MutableRefObject<HTMLDivElement>);\n const editorWrapperRef = useRef(null);\n const [showPreview, , unsetShowPreview, toggleShowPreview] = useBooleanState(false);\n\n const [isMounted, setIsMounted] = useState(false);\n useEffect(() => {\n setIsMounted(true);\n }, []);\n\n const context = useMarkdownEditorContext();\n const editor = (props.editor ?? context) as EditorInt;\n if (!editor)\n throw new Error(\n '[MarkdownEditorView]: an instance of the editor must be passed through the props or context',\n );\n\n const {\n autofocus,\n className,\n enableSubmitInPreview = true,\n hidePreviewAfterSubmit = false,\n markupHiddenActionsConfig,\n markupToolbarConfig,\n qa,\n settingsVisible = true,\n stickyToolbar,\n toolbarsPreset,\n wysiwygHiddenActionsConfig,\n wysiwygToolbarConfig,\n } = props;\n\n const rerender = useUpdate();\n useLayoutEffect(() => {\n editor.on('rerender', rerender);\n return () => {\n editor.off('rerender', rerender);\n };\n }, [editor, rerender]);\n\n const editorMode = editor.currentMode;\n const markupSplitMode =\n editor.splitModeEnabled && editor.splitMode && editorMode === 'markup';\n\n const splitModeViewWrapperRef = useRef(null);\n\n const toaster = useToaster();\n\n useEffect(() => {\n if (showPreview) {\n divRef.current.focus();\n }\n }, [divRef, showPreview]);\n\n return (\n <ErrorBoundary\n onError={(e) => {\n globalLogger.error(e);\n editor.logger.error(e);\n }}\n fallbackRender={({error, resetErrorBoundary}) => {\n toaster.add({\n theme: 'danger',\n name: 'g-md-editor-error',\n title: i18n('error-title'),\n content: error.message,\n });\n setTimeout(() => {\n resetErrorBoundary();\n editor.changeEditorMode({\n mode: 'markup',\n reason: 'error-boundary',\n emit: false,\n });\n });\n return null;\n }}\n >\n <div\n ref={divRef}\n data-qa={qa}\n className={b(\n {\n settings: settingsVisible,\n split: markupSplitMode && editor.splitMode,\n },\n [className],\n )}\n role=\"button\"\n tabIndex={0}\n >\n <EditorWrapper\n autofocus={autofocus}\n editor={editor}\n editorMode={editorMode}\n enableSubmitInPreview={enableSubmitInPreview}\n hidePreviewAfterSubmit={hidePreviewAfterSubmit}\n isFocused={isWrapperFocused(divRef)}\n markupHiddenActionsConfig={markupHiddenActionsConfig}\n markupToolbarConfig={markupToolbarConfig}\n qa=\"g-md-editor-mode\"\n ref={editorWrapperRef}\n settingsVisible={settingsVisible}\n showPreview={showPreview}\n stickyToolbar={stickyToolbar}\n toggleShowPreview={toggleShowPreview}\n toolbarsPreset={toolbarsPreset}\n unsetShowPreview={unsetShowPreview}\n wysiwygHiddenActionsConfig={wysiwygHiddenActionsConfig}\n wysiwygToolbarConfig={wysiwygToolbarConfig}\n />\n\n {markupSplitMode && (\n <>\n {editor.splitMode === 'horizontal' ? (\n <HorizontalDrag\n editor={editor}\n isMounted={isMounted}\n leftElRef={editorWrapperRef}\n rightElRef={splitModeViewWrapperRef}\n wrapperRef={divRef}\n />\n ) : (\n <div className={b('resizer')} />\n )}\n <SplitModeView editor={editor} ref={splitModeViewWrapperRef} />\n </>\n )}\n </div>\n </ErrorBoundary>\n );\n },\n);\nMarkdownEditorView.displayName = 'MarkdownEditorView';\n\ninterface MarkupSearchAnchorProps extends Pick<EditorSettingsProps, 'mode'> {}\n\nconst MarkupSearchAnchor: React.FC<MarkupSearchAnchorProps> = ({mode}) => (\n <>{mode === 'markup' && <div className=\"g-md-search-anchor\"></div>}</>\n);\n\nfunction Settings(props: EditorSettingsProps & {stickyToolbar: boolean}) {\n const wrapperRef = useRef<HTMLDivElement>(null);\n const isSticky = useSticky(wrapperRef) && props.toolbarVisibility && props.stickyToolbar;\n\n return (\n <>\n {(props.renderPreviewButton || props.settingsVisible) && (\n <div className={b('settings-wrapper')}>\n <div\n ref={wrapperRef}\n className={stickyCn.settings({\n withToolbar: props.toolbarVisibility,\n stickyActive: isSticky,\n })}\n >\n <EditorSettings {...props} />\n <MarkupSearchAnchor {...props} />\n </div>\n </div>\n )}\n </>\n );\n}\n\nfunction isPreviewKeyDown(e: KeyboardEvent) {\n const modKey = isMac() ? e.metaKey : e.ctrlKey;\n return modKey && e.shiftKey && e.code === 'KeyP';\n}\n\nfunction isWrapperFocused(divRef: React.RefObject<HTMLDivElement>) {\n return document.activeElement === divRef.current;\n}\n\nfunction isSubmitKeyDown(e: KeyboardEvent) {\n const modKey = isMac() ? e.metaKey : e.ctrlKey;\n return modKey && e.code === 'Enter';\n}\n"]}
|
|
@@ -6,5 +6,5 @@ export type ToolbarImagePopuProps = Omit<ToolbarBaseProps<never>, 'editor'> & {
|
|
|
6
6
|
onSuccessUpload?: (res: BatchUploadResult) => void;
|
|
7
7
|
hide: () => void;
|
|
8
8
|
anchorElement: HTMLElement | null;
|
|
9
|
-
} & Pick<ImageFormProps, 'onSubmit'>;
|
|
9
|
+
} & Pick<ImageFormProps, 'onSubmit' | 'imageTitle'>;
|
|
10
10
|
export declare const ToolbarImagePopup: React.FC<ToolbarImagePopuProps>;
|
|
@@ -9,7 +9,7 @@ const forms_1 = require("../../../i18n/forms/index.js");
|
|
|
9
9
|
const hooks_1 = require("../../../react-utils/hooks.js");
|
|
10
10
|
const upload_1 = require("../../../utils/upload.js");
|
|
11
11
|
const placement = ['bottom-start', 'top-start', 'bottom-end', 'top-end'];
|
|
12
|
-
const ToolbarImagePopup = ({ className, anchorElement, hide, onSubmit, focus, onClick, uploadImages, onSuccessUpload, }) => {
|
|
12
|
+
const ToolbarImagePopup = ({ className, anchorElement, hide, onSubmit, focus, onClick, uploadImages, onSuccessUpload, imageTitle, }) => {
|
|
13
13
|
const toaster = (0, uikit_1.useToaster)();
|
|
14
14
|
const [loading, showLoading, hideLoading] = (0, hooks_1.useBooleanState)(false);
|
|
15
15
|
const handleCancel = (0, react_1.useCallback)(() => {
|
|
@@ -37,7 +37,7 @@ const ToolbarImagePopup = ({ className, anchorElement, hide, onSubmit, focus, on
|
|
|
37
37
|
focus();
|
|
38
38
|
onSubmit(data);
|
|
39
39
|
onClick?.('addImage');
|
|
40
|
-
}, loading: loading }) }));
|
|
40
|
+
}, loading: loading, imageTitle: imageTitle }) }));
|
|
41
41
|
};
|
|
42
42
|
exports.ToolbarImagePopup = ToolbarImagePopup;
|
|
43
43
|
//# sourceMappingURL=ToolbarImagePopup.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ToolbarImagePopup.js","sourceRoot":"../../../../../src","sources":["bundle/toolbar/custom/ToolbarImagePopup.tsx"],"names":[],"mappings":";;;;AAAA,iCAAkC;AAElC,6CAAyE;AAEzE,2DAAwE;AACxE,wDAAyC;AACzC,yDAA2D;AAE3D,qDAI+B;AAE/B,MAAM,SAAS,GAAmB,CAAC,cAAc,EAAE,WAAW,EAAE,YAAY,EAAE,SAAS,CAAC,CAAC;AASlF,MAAM,iBAAiB,GAAoC,CAAC,EAC/D,SAAS,EACT,aAAa,EACb,IAAI,EACJ,QAAQ,EACR,KAAK,EACL,OAAO,EACP,YAAY,EACZ,eAAe,
|
|
1
|
+
{"version":3,"file":"ToolbarImagePopup.js","sourceRoot":"../../../../../src","sources":["bundle/toolbar/custom/ToolbarImagePopup.tsx"],"names":[],"mappings":";;;;AAAA,iCAAkC;AAElC,6CAAyE;AAEzE,2DAAwE;AACxE,wDAAyC;AACzC,yDAA2D;AAE3D,qDAI+B;AAE/B,MAAM,SAAS,GAAmB,CAAC,cAAc,EAAE,WAAW,EAAE,YAAY,EAAE,SAAS,CAAC,CAAC;AASlF,MAAM,iBAAiB,GAAoC,CAAC,EAC/D,SAAS,EACT,aAAa,EACb,IAAI,EACJ,QAAQ,EACR,KAAK,EACL,OAAO,EACP,YAAY,EACZ,eAAe,EACf,UAAU,GACb,EAAE,EAAE;IACD,MAAM,OAAO,GAAG,IAAA,kBAAU,GAAE,CAAC;IAC7B,MAAM,CAAC,OAAO,EAAE,WAAW,EAAE,WAAW,CAAC,GAAG,IAAA,uBAAe,EAAC,KAAK,CAAC,CAAC;IAEnE,MAAM,YAAY,GAAG,IAAA,mBAAW,EAAC,GAAG,EAAE;QAClC,IAAI,EAAE,CAAC;QACP,KAAK,EAAE,CAAC;IACZ,CAAC,EAAE,CAAC,KAAK,EAAE,IAAI,CAAC,CAAC,CAAC;IAElB,OAAO,CACH,uBAAC,aAAK,IACF,IAAI,QACJ,aAAa,EAAE,aAAa,EAC5B,YAAY,EAAE,YAAY,EAC1B,SAAS,EAAE,SAAS,EACpB,SAAS,EAAE,SAAS,YAEpB,uBAAC,qBAAS,IACN,SAAS,QACT,QAAQ,EACJ,YAAY;gBACZ,CAAC,CAAC,KAAK,EAAE,EAAE;oBACP,WAAW,EAAE,CAAC;oBACd,IAAA,yBAAgB,EAAC,KAAK,EAAE,YAAY,CAAC,CAAC,IAAI,CACtC,CAAC,GAAG,EAAE,EAAE;wBACJ,WAAW,EAAE,CAAC;wBACd,IAAI,EAAE,CAAC;wBACP,eAAe,EAAE,CAAC,GAAG,CAAC,CAAC;oBAC3B,CAAC,EACD,CAAC,GAAG,EAAE,EAAE;wBACJ,WAAW,EAAE,CAAC;wBACd,OAAO,CAAC,GAAG,CAAC;4BACR,KAAK,EAAE,QAAQ;4BACf,IAAI,EAAE,sBAAsB;4BAC5B,KAAK,EAAE,IAAA,YAAI,EAAC,qBAAqB,CAAC;4BAClC,OAAO,EAAE,MAAM,CAAC,GAAG,CAAC;yBACvB,CAAC,CAAC;oBACP,CAAC,CACJ,CAAC;gBACN,CAAC,CAAC,EAEN,QAAQ,EAAE,YAAY,EACtB,QAAQ,EAAE,CAAC,IAAI,EAAE,EAAE;gBACf,IAAI,EAAE,CAAC;gBACP,KAAK,EAAE,CAAC;gBACR,QAAQ,CAAC,IAAI,CAAC,CAAC;gBACf,OAAO,EAAE,CAAC,UAAU,CAAC,CAAC;YAC1B,CAAC,EACD,OAAO,EAAE,OAAO,EAChB,UAAU,EAAE,UAAU,GACxB,GACE,CACX,CAAC;AACN,CAAC,CAAC;AA/DW,QAAA,iBAAiB,qBA+D5B","sourcesContent":["import {useCallback} from 'react';\n\nimport {Popup, type PopupPlacement, useToaster} from '@gravity-ui/uikit';\n\nimport {ImageForm, type ImageFormProps} from '../../../forms/ImageForm';\nimport {i18n} from '../../../i18n/forms';\nimport {useBooleanState} from '../../../react-utils/hooks';\nimport type {ToolbarBaseProps} from '../../../toolbar';\nimport {\n type BatchUploadResult,\n type FileUploadHandler,\n batchUploadFiles,\n} from '../../../utils/upload';\n\nconst placement: PopupPlacement = ['bottom-start', 'top-start', 'bottom-end', 'top-end'];\n\nexport type ToolbarImagePopuProps = Omit<ToolbarBaseProps<never>, 'editor'> & {\n uploadImages?: FileUploadHandler;\n onSuccessUpload?: (res: BatchUploadResult) => void;\n hide: () => void;\n anchorElement: HTMLElement | null;\n} & Pick<ImageFormProps, 'onSubmit' | 'imageTitle'>;\n\nexport const ToolbarImagePopup: React.FC<ToolbarImagePopuProps> = ({\n className,\n anchorElement,\n hide,\n onSubmit,\n focus,\n onClick,\n uploadImages,\n onSuccessUpload,\n imageTitle,\n}) => {\n const toaster = useToaster();\n const [loading, showLoading, hideLoading] = useBooleanState(false);\n\n const handleCancel = useCallback(() => {\n hide();\n focus();\n }, [focus, hide]);\n\n return (\n <Popup\n open\n anchorElement={anchorElement}\n onOpenChange={handleCancel}\n placement={placement}\n className={className}\n >\n <ImageForm\n autoFocus\n onAttach={\n uploadImages &&\n ((files) => {\n showLoading();\n batchUploadFiles(files, uploadImages).then(\n (res) => {\n hideLoading();\n hide();\n onSuccessUpload?.(res);\n },\n (err) => {\n hideLoading();\n toaster.add({\n theme: 'danger',\n name: 'toolbar_image_upload',\n title: i18n('image_upload_failed'),\n content: String(err),\n });\n },\n );\n })\n }\n onCancel={handleCancel}\n onSubmit={(data) => {\n hide();\n focus();\n onSubmit(data);\n onClick?.('addImage');\n }}\n loading={loading}\n imageTitle={imageTitle}\n />\n </Popup>\n );\n};\n"]}
|
|
@@ -3,6 +3,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
|
|
|
3
3
|
exports.MToolbarImagePopup = void 0;
|
|
4
4
|
const tslib_1 = require("tslib");
|
|
5
5
|
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
6
|
+
const react_1 = require("react");
|
|
6
7
|
const is_number_1 = tslib_1.__importDefault(require("is-number"));
|
|
7
8
|
const markup_1 = require("../../../markup/index.js");
|
|
8
9
|
const ToolbarImagePopup_1 = require("../custom/ToolbarImagePopup.js");
|
|
@@ -12,7 +13,13 @@ const noop = (err) => {
|
|
|
12
13
|
};
|
|
13
14
|
const MToolbarImagePopup = ({ focus, onClick, hide, anchorElement, editor, className, }) => {
|
|
14
15
|
const { uploadHandler, needToSetDimensionsForUploadedImages } = (0, context_1.useMarkupToolbarContext)();
|
|
15
|
-
|
|
16
|
+
const selectedString = (0, react_1.useMemo)(() => {
|
|
17
|
+
const { from, to } = editor.cm.state.selection.main;
|
|
18
|
+
return editor.cm.state.doc.sliceString(from, to);
|
|
19
|
+
// we need to calculate the selection only once
|
|
20
|
+
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
21
|
+
}, []);
|
|
22
|
+
return ((0, jsx_runtime_1.jsx)(ToolbarImagePopup_1.ToolbarImagePopup, { imageTitle: selectedString, hide: hide, anchorElement: anchorElement, focus: focus, onClick: onClick, className: className, onSubmit: ({ url, name, alt, width, height }) => {
|
|
16
23
|
(0, markup_1.insertImages)([
|
|
17
24
|
{
|
|
18
25
|
url,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MToolbarImagePopup.js","sourceRoot":"../../../../../src","sources":["bundle/toolbar/markup/MToolbarImagePopup.tsx"],"names":[],"mappings":";;;;;AAAA,kEAAiC;AAEjC,qDAAiG;AAEjG,sEAA0F;AAG1F,0CAAkD;AAElD,MAAM,IAAI,GAAG,CAAC,GAAY,EAAE,EAAE;IAC1B,OAAO,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC;AACvB,CAAC,CAAC;AAOK,MAAM,kBAAkB,GAAsC,CAAC,EAClE,KAAK,EACL,OAAO,EACP,IAAI,EACJ,aAAa,EACb,MAAM,EACN,SAAS,GACZ,EAAE,EAAE;IACD,MAAM,EAAC,aAAa,EAAE,oCAAoC,EAAC,GAAG,IAAA,iCAAuB,GAAE,CAAC;IAExF,OAAO,CACH,uBAAC,qCAAiB,IACd,IAAI,EAAE,IAAI,EACV,aAAa,EAAE,aAAa,EAC5B,KAAK,EAAE,KAAK,EACZ,OAAO,EAAE,OAAO,EAChB,SAAS,EAAE,SAAS,EACpB,QAAQ,EAAE,CAAC,EAAC,GAAG,EAAE,IAAI,EAAE,GAAG,EAAE,KAAK,EAAE,MAAM,EAAC,EAAE,EAAE;YAC1C,IAAA,qBAAY,EAAC;gBACT;oBACI,GAAG;oBACH,GAAG;oBACH,KAAK,EAAE,IAAI;oBACX,KAAK,EAAE,IAAA,mBAAQ,EAAC,KAAK,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,EAAE;oBAC3C,MAAM,EAAE,IAAA,mBAAQ,EAAC,MAAM,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,EAAE;iBACjD;aACJ,CAAC,CAAC,MAAM,CAAC,EAAE,CAAC,CAAC;QAClB,CAAC,EACD,YAAY,EAAE,aAAa,EAC3B,eAAe,EAAE,KAAK,EAAE,GAAG,EAAE,EAAE;YAC3B,MAAM,MAAM,GAAG,MAAM,YAAY,CAC7B,GAAG,CAAC,OAAO,EACX,OAAO,CAAC,oCAAoC,CAAC,CAChD,CAAC;YACF,IAAA,qBAAY,EAAC,MAAM,CAAC,CAAC,MAAM,CAAC,EAAE,CAAC,CAAC;QACpC,CAAC,GACH,CACL,CAAC;AACN,CAAC,CAAC;
|
|
1
|
+
{"version":3,"file":"MToolbarImagePopup.js","sourceRoot":"../../../../../src","sources":["bundle/toolbar/markup/MToolbarImagePopup.tsx"],"names":[],"mappings":"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","sourcesContent":["import {useMemo} from 'react';\n\nimport isNumber from 'is-number';\n\nimport {IMG_MAX_HEIGHT, type ImageItem, getImageDimensions, insertImages} from '../../../markup';\nimport type {UploadSuccessItem} from '../../../utils';\nimport {type ToolbarImagePopuProps, ToolbarImagePopup} from '../custom/ToolbarImagePopup';\nimport type {MToolbarBaseProps} from '../types';\n\nimport {useMarkupToolbarContext} from './context';\n\nconst noop = (err: unknown) => {\n console.error(err);\n};\n\nexport type MToolbarImagePopupProps = MToolbarBaseProps &\n Pick<ToolbarImagePopuProps, 'anchorElement'> & {\n hide: () => void;\n };\n\nexport const MToolbarImagePopup: React.FC<MToolbarImagePopupProps> = ({\n focus,\n onClick,\n hide,\n anchorElement,\n editor,\n className,\n}) => {\n const {uploadHandler, needToSetDimensionsForUploadedImages} = useMarkupToolbarContext();\n\n const selectedString = useMemo(() => {\n const {from, to} = editor.cm.state.selection.main;\n return editor.cm.state.doc.sliceString(from, to);\n // we need to calculate the selection only once\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, []);\n\n return (\n <ToolbarImagePopup\n imageTitle={selectedString}\n hide={hide}\n anchorElement={anchorElement}\n focus={focus}\n onClick={onClick}\n className={className}\n onSubmit={({url, name, alt, width, height}) => {\n insertImages([\n {\n url,\n alt,\n title: name,\n width: isNumber(width) ? String(width) : '',\n height: isNumber(height) ? String(height) : '',\n },\n ])(editor.cm);\n }}\n uploadImages={uploadHandler}\n onSuccessUpload={async (res) => {\n const images = await toImageItems(\n res.success,\n Boolean(needToSetDimensionsForUploadedImages),\n );\n insertImages(images)(editor.cm);\n }}\n />\n );\n};\n\nasync function toImageItems(\n items: readonly UploadSuccessItem[],\n withDimensions: boolean,\n): Promise<ImageItem[]> {\n const imgItems: ImageItem[] = [];\n\n await Promise.all(\n items.map<Promise<void>>(({result, file}) => {\n const imgItem: ImageItem = {url: result.url, alt: result.name ?? file.name};\n imgItems.push(imgItem);\n\n if (withDimensions) {\n return getImageDimensions(file).then(({height}) => {\n imgItem.height = String(Math.min(height, IMG_MAX_HEIGHT));\n }, noop);\n }\n return Promise.resolve();\n }),\n );\n\n return imgItems;\n}\n"]}
|
|
@@ -19,8 +19,7 @@
|
|
|
19
19
|
.yfm-editor .yfm-quote-link {
|
|
20
20
|
background-color: var(--yfm-quote-link-background);
|
|
21
21
|
}
|
|
22
|
-
.yfm-editor .yfm-quote-link .g-md-img-settings-button
|
|
23
|
-
.yfm-editor .yfm-quote-link .yfm-clipboard-button {
|
|
22
|
+
.yfm-editor .yfm-quote-link .g-md-img-settings-button {
|
|
24
23
|
position: absolute;
|
|
25
24
|
z-index: 2;
|
|
26
25
|
}
|
|
@@ -20,10 +20,10 @@ var ImageTabId;
|
|
|
20
20
|
ImageTabId["Attach"] = "attach";
|
|
21
21
|
ImageTabId["Link"] = "link";
|
|
22
22
|
})(ImageTabId || (ImageTabId = {}));
|
|
23
|
-
const ImageForm = ({ className, autoFocus, onCancel, onSubmit, onAttach, loading, }) => {
|
|
23
|
+
const ImageForm = ({ className, autoFocus, onCancel, onSubmit, onAttach, loading, imageTitle: providedName, }) => {
|
|
24
24
|
const [tabId, setTabId] = (0, react_1.useState)(() => (0, lodash_1.isFunction)(onAttach) ? ImageTabId.Attach : ImageTabId.Link);
|
|
25
25
|
const [url, setUrl] = (0, react_1.useState)('');
|
|
26
|
-
const [name, setName] = (0, react_1.useState)('');
|
|
26
|
+
const [name, setName] = (0, react_1.useState)(providedName ?? '');
|
|
27
27
|
const [alt, setAlt] = (0, react_1.useState)('');
|
|
28
28
|
const [width, setWidth] = (0, react_1.useState)();
|
|
29
29
|
const [height, setHeight] = (0, react_1.useState)();
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ImageForm.js","sourceRoot":"../../../src","sources":["forms/ImageForm.tsx"],"names":[],"mappings":"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","sourcesContent":["import {useLayoutEffect, useState} from 'react';\n\nimport {TextInput, type TextInputProps} from '@gravity-ui/uikit';\nimport {Tabs} from '@gravity-ui/uikit/legacy';\n\nimport {type ClassNameProps, cn} from '../classname';\nimport {i18n} from '../i18n/forms';\nimport {isFunction} from '../lodash';\nimport {enterKeyHandler} from '../utils/handlers';\n\nimport {TextInputFixed} from './TextInput';\nimport Form from './base';\nimport {ButtonAttach, NumberInput} from './components';\n\nimport './ImageForm.scss';\n\nconst b = cn('image-form');\n\nconst enum ImageTabId {\n Attach = 'attach',\n Link = 'link',\n}\n\nexport type ImageFormSubmitParams = {\n url: string;\n name: string;\n alt: string;\n width?: number;\n height?: number;\n};\n\nexport type ImageFormProps = ClassNameProps & {\n autoFocus?: boolean;\n onSubmit(params: ImageFormSubmitParams): void;\n onCancel(): void;\n onAttach?: (files: File[]) => void;\n loading?: boolean;\n};\n\nexport const ImageForm: React.FC<ImageFormProps> = ({\n className,\n autoFocus,\n onCancel,\n onSubmit,\n onAttach,\n loading,\n}) => {\n const [tabId, setTabId] = useState<string>(() =>\n isFunction(onAttach) ? ImageTabId.Attach : ImageTabId.Link,\n );\n const [url, setUrl] = useState('');\n const [name, setName] = useState('');\n const [alt, setAlt] = useState('');\n const [width, setWidth] = useState<number | undefined>();\n const [height, setHeight] = useState<number | undefined>();\n\n const shouldRenderTabs = isFunction(onAttach);\n useLayoutEffect(() => {\n if (!shouldRenderTabs && tabId === ImageTabId.Attach) {\n setTabId(ImageTabId.Link);\n }\n }, [shouldRenderTabs, tabId]);\n\n const handleSubmit = () => {\n const data: ImageFormSubmitParams = {\n url: url.trim(),\n name: name.trim(),\n alt: alt.trim(),\n };\n if (typeof width === 'number' && width >= 0) data.width = width;\n if (typeof height === 'number' && height >= 0) data.height = height;\n onSubmit(data);\n };\n const inputEnterKeyHandler: TextInputProps['onKeyDown'] = enterKeyHandler(handleSubmit);\n\n return (\n <Form.Form className={b(null, [className])}>\n {shouldRenderTabs && (\n <Tabs\n activeTab={tabId}\n onSelectTab={setTabId}\n items={[\n {id: ImageTabId.Attach, title: i18n('common_tab_attach')},\n {id: ImageTabId.Link, title: i18n('common_tab_link')},\n ]}\n />\n )}\n {tabId === ImageTabId.Attach && onAttach && (\n <>\n <Form.Layout>{i18n('image_upload_help')}</Form.Layout>\n <Form.Footer onCancel={onCancel}>\n <ButtonAttach\n multiple\n accept=\"image/*\"\n onUpdate={onAttach}\n buttonProps={{size: 's', view: 'action', loading}}\n >\n {i18n('common_action_upload')}\n </ButtonAttach>\n </Form.Footer>\n </>\n )}\n {tabId === ImageTabId.Link && (\n <>\n <Form.Layout>\n <Form.Row\n label={i18n('common_link')}\n control={\n <TextInputFixed\n size=\"s\"\n view=\"normal\"\n value={url}\n onUpdate={setUrl}\n placeholder=\"https://\"\n autoFocus={autoFocus}\n className={b('input', {type: 'link'})}\n onKeyPress={inputEnterKeyHandler}\n />\n }\n />\n <Form.Row\n label={i18n('image_name')}\n control={\n <TextInput\n size=\"s\"\n view=\"normal\"\n value={name}\n onUpdate={setName}\n className={b('input', {type: 'name'})}\n onKeyPress={inputEnterKeyHandler}\n />\n }\n />\n <Form.Row\n label={i18n('image_alt')}\n help={i18n('image_alt_help')}\n control={\n <TextInput\n size=\"s\"\n view=\"normal\"\n value={alt}\n onUpdate={setAlt}\n className={b('input', {type: 'alt'})}\n onKeyPress={inputEnterKeyHandler}\n />\n }\n />\n <Form.Row\n label={i18n('common_sizes')}\n control={\n <div className={b('size-controls')}>\n <NumberInput\n min={0}\n size=\"s\"\n view=\"normal\"\n value={width}\n onUpdate={setWidth}\n placeholder={i18n('image_size_width')}\n className={b('input', {type: 'width'})}\n onKeyDown={inputEnterKeyHandler}\n />\n x\n <NumberInput\n min={0}\n size=\"s\"\n view=\"normal\"\n value={height}\n onUpdate={setHeight}\n placeholder={i18n('image_size_height')}\n className={b('input', {type: 'height'})}\n onKeyDown={inputEnterKeyHandler}\n />\n </div>\n }\n />\n </Form.Layout>\n <Form.Footer onCancel={onCancel} onSubmit={handleSubmit} />\n </>\n )}\n </Form.Form>\n );\n};\n"]}
|
|
1
|
+
{"version":3,"file":"ImageForm.js","sourceRoot":"../../../src","sources":["forms/ImageForm.tsx"],"names":[],"mappings":"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","sourcesContent":["import {useLayoutEffect, useState} from 'react';\n\nimport {TextInput, type TextInputProps} from '@gravity-ui/uikit';\nimport {Tabs} from '@gravity-ui/uikit/legacy';\n\nimport {type ClassNameProps, cn} from '../classname';\nimport {i18n} from '../i18n/forms';\nimport {isFunction} from '../lodash';\nimport {enterKeyHandler} from '../utils/handlers';\n\nimport {TextInputFixed} from './TextInput';\nimport Form from './base';\nimport {ButtonAttach, NumberInput} from './components';\n\nimport './ImageForm.scss';\n\nconst b = cn('image-form');\n\nconst enum ImageTabId {\n Attach = 'attach',\n Link = 'link',\n}\n\nexport type ImageFormSubmitParams = {\n url: string;\n name: string;\n alt: string;\n width?: number;\n height?: number;\n};\n\nexport type ImageFormProps = ClassNameProps & {\n autoFocus?: boolean;\n onSubmit(params: ImageFormSubmitParams): void;\n onCancel(): void;\n onAttach?: (files: File[]) => void;\n loading?: boolean;\n imageTitle?: string;\n};\n\nexport const ImageForm: React.FC<ImageFormProps> = ({\n className,\n autoFocus,\n onCancel,\n onSubmit,\n onAttach,\n loading,\n imageTitle: providedName,\n}) => {\n const [tabId, setTabId] = useState<string>(() =>\n isFunction(onAttach) ? ImageTabId.Attach : ImageTabId.Link,\n );\n const [url, setUrl] = useState('');\n const [name, setName] = useState(providedName ?? '');\n const [alt, setAlt] = useState('');\n const [width, setWidth] = useState<number | undefined>();\n const [height, setHeight] = useState<number | undefined>();\n\n const shouldRenderTabs = isFunction(onAttach);\n useLayoutEffect(() => {\n if (!shouldRenderTabs && tabId === ImageTabId.Attach) {\n setTabId(ImageTabId.Link);\n }\n }, [shouldRenderTabs, tabId]);\n\n const handleSubmit = () => {\n const data: ImageFormSubmitParams = {\n url: url.trim(),\n name: name.trim(),\n alt: alt.trim(),\n };\n if (typeof width === 'number' && width >= 0) data.width = width;\n if (typeof height === 'number' && height >= 0) data.height = height;\n onSubmit(data);\n };\n const inputEnterKeyHandler: TextInputProps['onKeyDown'] = enterKeyHandler(handleSubmit);\n\n return (\n <Form.Form className={b(null, [className])}>\n {shouldRenderTabs && (\n <Tabs\n activeTab={tabId}\n onSelectTab={setTabId}\n items={[\n {id: ImageTabId.Attach, title: i18n('common_tab_attach')},\n {id: ImageTabId.Link, title: i18n('common_tab_link')},\n ]}\n />\n )}\n {tabId === ImageTabId.Attach && onAttach && (\n <>\n <Form.Layout>{i18n('image_upload_help')}</Form.Layout>\n <Form.Footer onCancel={onCancel}>\n <ButtonAttach\n multiple\n accept=\"image/*\"\n onUpdate={onAttach}\n buttonProps={{size: 's', view: 'action', loading}}\n >\n {i18n('common_action_upload')}\n </ButtonAttach>\n </Form.Footer>\n </>\n )}\n {tabId === ImageTabId.Link && (\n <>\n <Form.Layout>\n <Form.Row\n label={i18n('common_link')}\n control={\n <TextInputFixed\n size=\"s\"\n view=\"normal\"\n value={url}\n onUpdate={setUrl}\n placeholder=\"https://\"\n autoFocus={autoFocus}\n className={b('input', {type: 'link'})}\n onKeyPress={inputEnterKeyHandler}\n />\n }\n />\n <Form.Row\n label={i18n('image_name')}\n control={\n <TextInput\n size=\"s\"\n view=\"normal\"\n value={name}\n onUpdate={setName}\n className={b('input', {type: 'name'})}\n onKeyPress={inputEnterKeyHandler}\n />\n }\n />\n <Form.Row\n label={i18n('image_alt')}\n help={i18n('image_alt_help')}\n control={\n <TextInput\n size=\"s\"\n view=\"normal\"\n value={alt}\n onUpdate={setAlt}\n className={b('input', {type: 'alt'})}\n onKeyPress={inputEnterKeyHandler}\n />\n }\n />\n <Form.Row\n label={i18n('common_sizes')}\n control={\n <div className={b('size-controls')}>\n <NumberInput\n min={0}\n size=\"s\"\n view=\"normal\"\n value={width}\n onUpdate={setWidth}\n placeholder={i18n('image_size_width')}\n className={b('input', {type: 'width'})}\n onKeyDown={inputEnterKeyHandler}\n />\n x\n <NumberInput\n min={0}\n size=\"s\"\n view=\"normal\"\n value={height}\n onUpdate={setHeight}\n placeholder={i18n('image_size_height')}\n className={b('input', {type: 'height'})}\n onKeyDown={inputEnterKeyHandler}\n />\n </div>\n }\n />\n </Form.Layout>\n <Form.Footer onCancel={onCancel} onSubmit={handleSubmit} />\n </>\n )}\n </Form.Form>\n );\n};\n"]}
|
|
@@ -21,6 +21,7 @@ const react_facet_1 = require("./react-facet.js");
|
|
|
21
21
|
const plugin_1 = require("./search-plugin/plugin.js");
|
|
22
22
|
const smart_reindent_1 = require("./smart-reindent/index.js");
|
|
23
23
|
const yfm_1 = require("./yfm.js");
|
|
24
|
+
const linkRegex = /\[[\s\S]*?]\([\s\S]*?\)/g;
|
|
24
25
|
function createCodemirror(params) {
|
|
25
26
|
const { logger, doc, reactRenderer, onCancel, onScroll, onSubmit, onChange, onDocChange, disabledExtensions = {}, keymaps = [], receiver, yfmLangOptions, extensions: extraExtensions, placeholder: placeholderContent, autocompletion: autocompletionConfig, parseHtmlOnPaste, parseInsertedUrlAsImage, directiveSyntax, preserveEmptyRows, } = params;
|
|
26
27
|
const extensions = [gravity_1.gravityTheme, (0, view_1.placeholder)(placeholderContent)];
|
|
@@ -122,17 +123,21 @@ function createCodemirror(params) {
|
|
|
122
123
|
}
|
|
123
124
|
}
|
|
124
125
|
if (parseInsertedUrlAsImage) {
|
|
125
|
-
const
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
(
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
126
|
+
const linkMatches = currentLine.matchAll(linkRegex);
|
|
127
|
+
const isInsertedInsideLink = linkMatches.some((item) => from >= item.index && from <= item.index + (item[0]?.length ?? 0));
|
|
128
|
+
if (!isInsertedInsideLink) {
|
|
129
|
+
const { imageUrl, title } = parseInsertedUrlAsImage(event.clipboardData.getData(clipboard_1.DataTransferType.Text) ?? '') || {};
|
|
130
|
+
if (imageUrl) {
|
|
131
|
+
event.preventDefault();
|
|
132
|
+
logger.event({ event: 'paste-url-as-image' });
|
|
133
|
+
(0, commands_2.insertImages)([
|
|
134
|
+
{
|
|
135
|
+
url: imageUrl,
|
|
136
|
+
alt: title,
|
|
137
|
+
title,
|
|
138
|
+
},
|
|
139
|
+
])(editor);
|
|
140
|
+
}
|
|
136
141
|
}
|
|
137
142
|
}
|
|
138
143
|
// Reindenting pasted plain text
|