@gravity-ui/markdown-editor 14.12.3 → 15.0.0

package/build/cjs/extensions/additional/Math/view-and-edit.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"view-and-edit.js","sourceRoot":"../../../../../src","sources":["extensions/additional/Math/view-and-edit.ts"],"names":[],"mappings":"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","sourcesContent":["import {keydownHandler} from 'prosemirror-keymap';\nimport type {Node} from 'prosemirror-model';\nimport {Plugin} from 'prosemirror-state';\nimport {Decoration, DecorationSet, type NodeView, type ViewMutationRecord} from 'prosemirror-view';\n\nimport {isTextSelection} from '../../../utils/selection';\nimport type {ReactRenderer, RendererItem} from '../../behavior/ReactRenderer';\n\nimport {moveCursorLeftOfMathInline, moveCursorRightOfMathInline} from './commands';\nimport {CLASSNAMES, MathNode} from './const';\nimport {b, renderMathHint} from './hint';\nimport type {KatexOptions, RunOptions} from './types';\n\nimport './view-and-edit.scss';\n\nconst MATH_ACTIVE_DECO = 'math_active_decoration';\n\nexport type MathNodeViewOptions = Pick<RunOptions, 'sanitize'> & {\n    katexOptions?: KatexOptions;\n    loadRuntimeScript: () => void;\n    reactRenderer: ReactRenderer;\n};\n\nexport abstract class MathNodeView implements NodeView {\n    dom: HTMLElement;\n    contentDOM: HTMLElement;\n\n    protected node: Node;\n    protected texContent: string;\n    protected mathViewDOM: HTMLElement;\n    protected mathHintContainerDOM: HTMLElement;\n\n    protected hintRendererItem: RendererItem;\n    protected readonly reactRenderer: ReactRenderer;\n    protected readonly loadRuntimeScript: () => void;\n    protected readonly katexRunOptions: RunOptions;\n\n    protected hasActiveDeco = false;\n\n    abstract createDOM(): Record<\n        'dom' | 'contentDOM' | 'mathViewDOM' | 'mathHintContainerDOM',\n        HTMLElement\n    > & {hintRendererItem: RendererItem};\n    abstract isDisplayMode(): boolean;\n\n    constructor(node: Node, opts: MathNodeViewOptions) {\n        this.node = node;\n        this.texContent = this.getTexContent();\n        this.katexRunOptions = {\n            ...opts.katexOptions,\n            sanitize: opts.sanitize,\n        };\n\n        this.reactRenderer = opts.reactRenderer;\n        this.loadRuntimeScript = opts.loadRuntimeScript;\n\n        const elems = this.createDOM();\n        this.dom = elems.dom;\n        this.contentDOM = elems.contentDOM;\n        this.mathViewDOM = elems.mathViewDOM;\n        this.mathHintContainerDOM = elems.mathHintContainerDOM;\n        this.hintRendererItem = elems.hintRendererItem;\n\n        window.latexJsonp ??= [];\n        this.loadRuntimeScript();\n        this.renderKatex();\n    }\n\n    update(node: Node, decos: readonly Decoration[]): boolean {\n        if (this.node.type !== node.type) return false;\n        this.node = node;\n\n        const isActive = decos.some((deco) => deco.spec[MATH_ACTIVE_DECO]);\n        if (isActive === this.hasActiveDeco) return true;\n\n        if (!isActive) {\n            const newTexContent = this.getTexContent();\n            if (this.texContent !== newTexContent) {\n                this.texContent = newTexContent;\n                this.renderKatex();\n            }\n        }\n\n        this.hasActiveDeco = isActive;\n\n        return true;\n    }\n\n    ignoreMutation(mutation: ViewMutationRecord): boolean {\n        if (mutation.type === 'selection' || mutation.type === 'attributes') return true;\n\n        return (\n            mutation.type === 'childList' &&\n            (mutation.target === this.mathHintContainerDOM ||\n                this.mathHintContainerDOM.contains(mutation.target) ||\n                this.mathViewDOM.contains(mutation.target))\n        );\n    }\n\n    destroy() {\n        this.hintRendererItem.remove();\n    }\n\n    protected renderKatex() {\n        const displayMode = this.isDisplayMode();\n        const runOptions: RunOptions = {displayMode};\n\n        const econtent = encodeURIComponent(this.texContent);\n        const eoptions = encodeURIComponent(JSON.stringify(runOptions));\n\n        const elem = document.createElement(displayMode ? 'p' : 'span');\n        elem.classList.add('yfm-latex');\n        elem.setAttribute('data-content', econtent);\n        elem.setAttribute('data-options', eoptions);\n        this.mathViewDOM.replaceChildren(elem);\n\n        this.toggleErrorView(false);\n\n        window.latexJsonp.push(async (api) => {\n            try {\n                await api.run({\n                    ...this.katexRunOptions,\n                    ...runOptions,\n                    nodes: [elem],\n                    throwOnError: true,\n                });\n            } catch (err) {\n                const errorElem = document.createElement('span');\n                errorElem.classList.add('math-error');\n                errorElem.innerText = `(error) ${this.texContent}`;\n                errorElem.title = String(err);\n                this.mathViewDOM.replaceChildren(errorElem);\n                this.toggleErrorView(true);\n            }\n        });\n    }\n\n    protected toggleErrorView(isError: boolean) {\n        this.dom.classList.toggle('math-container-error', isError);\n        this.mathViewDOM.classList.toggle('math-view-error', isError);\n    }\n\n    protected getTexContent() {\n        return this.node.textContent;\n    }\n}\n\nexport class MathInlineNodeView extends MathNodeView {\n    destroy() {\n        this.hintRendererItem?.remove();\n    }\n\n    isDisplayMode(): boolean {\n        return false;\n    }\n\n    createDOM() {\n        const dom = document.createElement('span');\n        dom.classList.add('math-container', 'math-inline-container');\n\n        const mathViewDOM = document.createElement('span');\n        mathViewDOM.classList.add('math-view', 'math-inline-view');\n        mathViewDOM.contentEditable = 'false';\n\n        const mathInlineDOM = this.createMathInlineDOM();\n\n        const mathHintContainerDOM = document.createElement('div');\n        mathHintContainerDOM.contentEditable = 'false';\n        mathHintContainerDOM.classList.add(...b({view: 'inline'}).split(' '));\n\n        dom.appendChild(mathViewDOM);\n        dom.appendChild(mathInlineDOM.container);\n        dom.appendChild(mathHintContainerDOM);\n\n        const hintRendererItem = this.reactRenderer.createItem('math-inline-hint', () =>\n            renderMathHint({}, mathHintContainerDOM),\n        );\n\n        return {\n            dom,\n            contentDOM: mathInlineDOM.content,\n            mathViewDOM,\n            mathHintContainerDOM,\n            hintRendererItem,\n        };\n    }\n\n    // same as math-inline spec toDOM()\n    protected createMathInlineDOM() {\n        const container = document.createElement('span');\n        container.classList.add(CLASSNAMES.Inline.Container);\n\n        const sharpBefore = document.createElement('span');\n        sharpBefore.classList.add(CLASSNAMES.Inline.Sharp);\n        sharpBefore.contentEditable = 'false';\n        sharpBefore.textContent = '$';\n\n        const sharpAfter = sharpBefore.cloneNode(true);\n\n        const content = document.createElement('span');\n        content.classList.add(CLASSNAMES.Inline.Content);\n\n        container.replaceChildren(sharpBefore, content, sharpAfter);\n\n        return {container, content};\n    }\n}\n\nexport class MathBlockNodeView extends MathNodeView {\n    isDisplayMode(): boolean {\n        return true;\n    }\n\n    createDOM() {\n        const dom = document.createElement('div');\n        dom.classList.add('math-container', 'math-block-container');\n\n        const mathViewDOM = document.createElement('div');\n        mathViewDOM.classList.add('math-view', 'math-block-view');\n        mathViewDOM.contentEditable = 'false';\n\n        const contentDOM = document.createElement('div');\n        contentDOM.classList.add('math-block');\n\n        const mathHintContainerDOM = document.createElement('div');\n        mathHintContainerDOM.contentEditable = 'false';\n        mathHintContainerDOM.classList.add(...b({view: 'block'}).split(' '));\n\n        dom.appendChild(mathHintContainerDOM);\n        dom.appendChild(mathViewDOM);\n        dom.appendChild(contentDOM);\n\n        const hintRendererItem = this.reactRenderer.createItem('math-block-hint', () =>\n            renderMathHint({}, mathHintContainerDOM),\n        );\n\n        return {dom, contentDOM, mathViewDOM, mathHintContainerDOM, hintRendererItem};\n    }\n}\n\nexport type MathViewAndEditPluginOptions = MathNodeViewOptions;\n\nexport const mathViewAndEditPlugin = (options: MathViewAndEditPluginOptions) =>\n    new Plugin({\n        props: {\n            handleKeyDown: keydownHandler({\n                ArrowRight: moveCursorRightOfMathInline,\n                ArrowLeft: moveCursorLeftOfMathInline,\n            }),\n            nodeViews: {\n                [MathNode.Block]: (node) => new MathBlockNodeView(node, options),\n                [MathNode.Inline]: (node) => new MathInlineNodeView(node, options),\n            },\n            decorations: (state) => {\n                const {selection} = state;\n                if (isTextSelection(selection)) {\n                    const decorations: Decoration[] = [];\n                    state.doc.nodesBetween(selection.from, selection.to, (node, pos) => {\n                        const typeName = node.type.name;\n                        if (typeName === MathNode.Inline || typeName === MathNode.Block) {\n                            decorations.push(\n                                Decoration.node(\n                                    pos,\n                                    pos + node.nodeSize,\n                                    {\n                                        class: 'math-active',\n                                    },\n                                    {[MATH_ACTIVE_DECO]: true},\n                                ),\n                            );\n                        }\n                    });\n                    if (decorations.length) {\n                        return DecorationSet.create(state.doc, decorations);\n                    }\n                }\n                return DecorationSet.empty;\n            },\n        },\n    });\n"]}

package/build/cjs/extensions/additional/Mermaid/MermaidNodeView/MermaidView.d.ts

@@ -1,10 +1,10 @@
-import React from 'react';
-import type { Mermaid } from 'mermaid';
-import { Node } from 'prosemirror-model';
-import { EditorView } from 'prosemirror-view';
-import { MermaidConsts } from '../MermaidSpecs/const';
+import type { Mermaid } from 'mermaid' with { 'resolution-mode': 'import' };
+import type { Node } from 'prosemirror-model';
+import type { EditorView } from 'prosemirror-view';
+import { MermaidConsts } from "../MermaidSpecs/const.js";
 export declare const cnMermaid: import("@bem-react/classname").ClassNameFormatter;
-export declare const cnDiagramHelper: import("@bem-react/classname").ClassNameFormatter;
+export declare const STOP_EVENT_CLASSNAME = "prosemirror-stop-event";
+import "./Mermaid.css";
 export declare const MermaidView: React.FC<{
     view: EditorView;
     onChange: (attrs: {

package/build/cjs/extensions/additional/Mermaid/MermaidNodeView/MermaidView.js

@@ -1,18 +1,19 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.MermaidView = exports.cnDiagramHelper = exports.cnMermaid = void 0;
-const tslib_1 = require("tslib");
-const react_1 = tslib_1.__importStar(require("react"));
+exports.MermaidView = exports.STOP_EVENT_CLASSNAME = exports.cnMermaid = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
 const icons_1 = require("@gravity-ui/icons");
 const uikit_1 = require("@gravity-ui/uikit");
-const classname_1 = require("../../../../classname");
-const TextInput_1 = require("../../../../forms/TextInput");
-const common_1 = require("../../../../i18n/common");
-const react_utils_1 = require("../../../../react-utils");
-const utils_1 = require("../../../../utils");
-const const_1 = require("../MermaidSpecs/const");
+const classname_1 = require("../../../../classname.js");
+const TextInput_1 = require("../../../../forms/TextInput.js");
+const common_1 = require("../../../../i18n/common/index.js");
+const react_utils_1 = require("../../../../react-utils/index.js");
+const utils_1 = require("../../../../utils/index.js");
+const const_1 = require("../MermaidSpecs/const.js");
 exports.cnMermaid = (0, classname_1.cn)('Mermaid');
-exports.cnDiagramHelper = (0, classname_1.cn)('MermaidHelper');
+exports.STOP_EVENT_CLASSNAME = 'prosemirror-stop-event';
+require("./Mermaid.css");
 const b = exports.cnMermaid;
 const MermaidPreview = ({ mermaidInstance, text = '', }) => {
     const [svg, setSvg] = (0, react_1.useState)();
@@ -35,33 +36,23 @@ const MermaidPreview = ({ mermaidInstance, text = '', }) => {
         p();
     }, [mermaidInstance, text]);
     if (error) {
-        return react_1.default.createElement("div", { className: b('Error') }, error && react_1.default.createElement("div", null, error));
+        return (0, jsx_runtime_1.jsx)("div", { className: b('Error'), children: error && (0, jsx_runtime_1.jsx)("div", { children: error }) });
     }
-    return (react_1.default.createElement("div", { className: b('Preview') }, svg ? react_1.default.createElement("div", { className: "mermaid", dangerouslySetInnerHTML: { __html: svg } }) : react_1.default.createElement(uikit_1.Loader, null)));
+    return ((0, jsx_runtime_1.jsx)("div", { className: b('Preview'), children: svg ? (0, jsx_runtime_1.jsx)("div", { className: "mermaid", dangerouslySetInnerHTML: { __html: svg } }) : (0, jsx_runtime_1.jsx)(uikit_1.Loader, {}) }));
 };
 const DiagramEditMode = ({ initialText, onSave, onCancel, mermaidInstance }) => {
     const [text, setText] = (0, react_1.useState)(initialText || '');
-    return (react_1.default.createElement("div", { className: b() },
-        react_1.default.createElement(MermaidPreview, { mermaidInstance: mermaidInstance, text: text }),
-        react_1.default.createElement("div", { className: b('Editor') },
-            react_1.default.createElement("div", null,
-                react_1.default.createElement(TextInput_1.TextAreaFixed, { controlProps: {
-                        className: (0, exports.cnDiagramHelper)({ 'prosemirror-stop-event': true }),
-                    }, value: text, onUpdate: (v) => {
-                        setText(v);
-                    }, autoFocus: true })),
-            react_1.default.createElement("div", { className: b('Controls') },
-                react_1.default.createElement("div", null,
-                    react_1.default.createElement(uikit_1.Button, { onClick: onCancel, view: 'flat' },
-                        react_1.default.createElement("span", { className: (0, exports.cnDiagramHelper)({ 'prosemirror-stop-event': true }) }, (0, common_1.i18n)('cancel'))),
-                    react_1.default.createElement(uikit_1.Button, { onClick: () => onSave(text), view: 'action' },
-                        react_1.default.createElement("span", { className: (0, exports.cnDiagramHelper)({ 'prosemirror-stop-event': true }) }, (0, common_1.i18n)('save'))))))));
+    return ((0, jsx_runtime_1.jsxs)("div", { className: b(), children: [(0, jsx_runtime_1.jsx)(MermaidPreview, { mermaidInstance: mermaidInstance, text: text }), (0, jsx_runtime_1.jsxs)("div", { className: b('Editor'), children: [(0, jsx_runtime_1.jsx)("div", { children: (0, jsx_runtime_1.jsx)(TextInput_1.TextAreaFixed, { controlProps: {
+                                className: exports.STOP_EVENT_CLASSNAME,
+                            }, value: text, onUpdate: (v) => {
+                                setText(v);
+                            }, autoFocus: true }) }), (0, jsx_runtime_1.jsx)("div", { className: b('Controls'), children: (0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)(uikit_1.Button, { onClick: onCancel, view: 'flat', children: (0, jsx_runtime_1.jsx)("span", { className: exports.STOP_EVENT_CLASSNAME, children: (0, common_1.i18n)('cancel') }) }), (0, jsx_runtime_1.jsx)(uikit_1.Button, { onClick: () => onSave(text), view: 'action', children: (0, jsx_runtime_1.jsx)("span", { className: exports.STOP_EVENT_CLASSNAME, children: (0, common_1.i18n)('save') }) })] }) })] })] }));
 };
 const MermaidView = ({ onChange, node, getPos, view, getMermaidInstance }) => {
     const [mermaidInstance, setMermaidInstance] = (0, react_1.useState)(null);
     const [editing, setEditing, unsetEditing, toggleEditing] = (0, react_utils_1.useBooleanState)(Boolean(node.attrs[const_1.MermaidConsts.NodeAttrs.newCreated]));
-    const [menuOpen, , , toggleMenuOpen] = (0, react_utils_1.useBooleanState)(false);
-    const buttonRef = (0, react_1.useRef)(null);
+    const [menuOpen, , closeMenu, toggleMenuOpen] = (0, react_utils_1.useBooleanState)(false);
+    const [anchorElement, setAnchorElement] = (0, react_utils_1.useElementState)();
     (0, react_1.useEffect)(() => {
         const waitForMermaid = () => setTimeout(() => {
             const instance = getMermaidInstance();
@@ -74,32 +65,25 @@ const MermaidView = ({ onChange, node, getPos, view, getMermaidInstance }) => {
         waitForMermaid();
     }, []);
     if (editing) {
-        return (react_1.default.createElement(DiagramEditMode, { initialText: node.attrs[const_1.MermaidConsts.NodeAttrs.content], mermaidInstance: mermaidInstance, onCancel: unsetEditing, onSave: (v) => {
+        return ((0, jsx_runtime_1.jsx)(DiagramEditMode, { initialText: node.attrs[const_1.MermaidConsts.NodeAttrs.content], mermaidInstance: mermaidInstance, onCancel: unsetEditing, onSave: (v) => {
                 onChange({ [const_1.MermaidConsts.NodeAttrs.content]: v });
                 unsetEditing();
             } }));
     }
-    return (react_1.default.createElement("div", { className: b(), onDoubleClick: setEditing },
-        react_1.default.createElement(MermaidPreview, { mermaidInstance: mermaidInstance, text: node.attrs[const_1.MermaidConsts.NodeAttrs.content] }),
-        react_1.default.createElement("div", null,
-            react_1.default.createElement(uikit_1.Button, { onClick: toggleMenuOpen, ref: buttonRef, size: 's', className: (0, exports.cnDiagramHelper)({ 'prosemirror-stop-event': true }) },
-                react_1.default.createElement(uikit_1.Icon, { data: icons_1.Ellipsis, className: (0, exports.cnDiagramHelper)({ 'prosemirror-stop-event': true }) })),
-            react_1.default.createElement(uikit_1.Popup, { anchorRef: buttonRef, open: menuOpen, onClose: toggleMenuOpen, placement: ['bottom-end'] },
-                react_1.default.createElement(uikit_1.Menu, null,
-                    react_1.default.createElement(uikit_1.Menu.Item, { onClick: () => {
-                            toggleEditing();
-                            toggleMenuOpen();
-                        } }, (0, common_1.i18n)('edit')),
-                    react_1.default.createElement(uikit_1.Menu.Item, { onClick: () => {
-                            const pos = getPos();
-                            if (pos === undefined)
-                                return;
-                            (0, utils_1.removeNode)({
-                                node,
-                                pos,
-                                tr: view.state.tr,
-                                dispatch: view.dispatch,
-                            });
-                        } }, (0, common_1.i18n)('remove')))))));
+    return ((0, jsx_runtime_1.jsxs)("div", { className: b(), onDoubleClick: setEditing, children: [(0, jsx_runtime_1.jsx)(MermaidPreview, { mermaidInstance: mermaidInstance, text: node.attrs[const_1.MermaidConsts.NodeAttrs.content] }), (0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)(uikit_1.Button, { onClick: toggleMenuOpen, ref: setAnchorElement, size: 's', className: exports.STOP_EVENT_CLASSNAME, children: (0, jsx_runtime_1.jsx)(uikit_1.Icon, { data: icons_1.Ellipsis, className: exports.STOP_EVENT_CLASSNAME }) }), (0, jsx_runtime_1.jsx)(uikit_1.Popup, { open: menuOpen, anchorElement: anchorElement, onOpenChange: closeMenu, placement: "bottom-end", children: (0, jsx_runtime_1.jsxs)(uikit_1.Menu, { children: [(0, jsx_runtime_1.jsx)(uikit_1.Menu.Item, { onClick: () => {
+                                        toggleEditing();
+                                        closeMenu();
+                                    }, children: (0, common_1.i18n)('edit') }), (0, jsx_runtime_1.jsx)(uikit_1.Menu.Item, { onClick: () => {
+                                        const pos = getPos();
+                                        if (pos === undefined)
+                                            return;
+                                        (0, utils_1.removeNode)({
+                                            node,
+                                            pos,
+                                            tr: view.state.tr,
+                                            dispatch: view.dispatch,
+                                        });
+                                    }, children: (0, common_1.i18n)('remove') })] }) })] })] }));
 };
 exports.MermaidView = MermaidView;
+//# sourceMappingURL=MermaidView.js.map

package/build/cjs/extensions/additional/Mermaid/MermaidNodeView/MermaidView.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MermaidView.js","sourceRoot":"../../../../../../src","sources":["extensions/additional/Mermaid/MermaidNodeView/MermaidView.tsx"],"names":[],"mappings":"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","sourcesContent":["import {useEffect, useState} from 'react';\n\nimport {Ellipsis as DotsIcon} from '@gravity-ui/icons';\nimport {Button, Icon, Loader, Menu, Popup} from '@gravity-ui/uikit';\nimport type {Mermaid} from 'mermaid' with {'resolution-mode': 'import'};\nimport type {Node} from 'prosemirror-model';\nimport type {EditorView} from 'prosemirror-view';\n\nimport {cn} from '../../../../classname';\nimport {TextAreaFixed as TextArea} from '../../../../forms/TextInput';\nimport {i18n} from '../../../../i18n/common';\nimport {useBooleanState, useElementState} from '../../../../react-utils';\nimport {removeNode} from '../../../../utils';\nimport {MermaidConsts} from '../MermaidSpecs/const';\nexport const cnMermaid = cn('Mermaid');\n\nexport const STOP_EVENT_CLASSNAME = 'prosemirror-stop-event';\n\nimport './Mermaid.scss';\n\nconst b = cnMermaid;\n\nconst MermaidPreview: React.FC<{mermaidInstance: Mermaid | null; text: string}> = ({\n    mermaidInstance,\n    text = '',\n}) => {\n    const [svg, setSvg] = useState<string>();\n    const [error, setError] = useState<string | null>(null);\n\n    useEffect(() => {\n        const p = async () => {\n            if (mermaidInstance) {\n                try {\n                    // Validates syntax and throws error if text is invalid\n                    await mermaidInstance.parse(text);\n\n                    const {svg: S} = await mermaidInstance.render(`mermaid-${Date.now()}`, text);\n\n                    setSvg(S);\n                    setError(null);\n                } catch (e) {\n                    setError((e as Error).message);\n                }\n            }\n        };\n\n        p();\n    }, [mermaidInstance, text]);\n\n    if (error) {\n        return <div className={b('Error')}>{error && <div>{error}</div>}</div>;\n    }\n\n    return (\n        <div className={b('Preview')}>\n            {svg ? <div className=\"mermaid\" dangerouslySetInnerHTML={{__html: svg}} /> : <Loader />}\n        </div>\n    );\n};\n\nconst DiagramEditMode: React.FC<{\n    initialText: string;\n    mermaidInstance: Mermaid | null;\n    onSave: (v: string) => void;\n    onCancel: () => void;\n}> = ({initialText, onSave, onCancel, mermaidInstance}) => {\n    const [text, setText] = useState(initialText || '');\n\n    return (\n        <div className={b()}>\n            <MermaidPreview mermaidInstance={mermaidInstance} text={text} />\n            <div className={b('Editor')}>\n                <div>\n                    <TextArea\n                        controlProps={{\n                            className: STOP_EVENT_CLASSNAME,\n                        }}\n                        value={text}\n                        onUpdate={(v) => {\n                            setText(v);\n                        }}\n                        autoFocus\n                    />\n                </div>\n                <div className={b('Controls')}>\n                    <div>\n                        <Button onClick={onCancel} view={'flat'}>\n                            <span className={STOP_EVENT_CLASSNAME}>{i18n('cancel')}</span>\n                        </Button>\n                        <Button onClick={() => onSave(text)} view={'action'}>\n                            <span className={STOP_EVENT_CLASSNAME}>{i18n('save')}</span>\n                        </Button>\n                    </div>\n                </div>\n            </div>\n        </div>\n    );\n};\n\nexport const MermaidView: React.FC<{\n    view: EditorView;\n    onChange: (attrs: {[MermaidConsts.NodeAttrs.content]: string}) => void;\n    getMermaidInstance: () => Mermaid;\n    node: Node;\n    getPos: () => number | undefined;\n}> = ({onChange, node, getPos, view, getMermaidInstance}) => {\n    const [mermaidInstance, setMermaidInstance] = useState<Mermaid | null>(null);\n    const [editing, setEditing, unsetEditing, toggleEditing] = useBooleanState(\n        Boolean(node.attrs[MermaidConsts.NodeAttrs.newCreated]),\n    );\n    const [menuOpen, , closeMenu, toggleMenuOpen] = useBooleanState(false);\n    const [anchorElement, setAnchorElement] = useElementState();\n\n    useEffect(() => {\n        const waitForMermaid = () =>\n            setTimeout(() => {\n                const instance = getMermaidInstance();\n                if (instance) {\n                    setMermaidInstance(instance);\n\n                    return;\n                }\n\n                waitForMermaid();\n            }, 100);\n\n        waitForMermaid();\n    }, []);\n\n    if (editing) {\n        return (\n            <DiagramEditMode\n                initialText={node.attrs[MermaidConsts.NodeAttrs.content]}\n                mermaidInstance={mermaidInstance}\n                onCancel={unsetEditing}\n                onSave={(v) => {\n                    onChange({[MermaidConsts.NodeAttrs.content]: v});\n                    unsetEditing();\n                }}\n            />\n        );\n    }\n\n    return (\n        <div className={b()} onDoubleClick={setEditing}>\n            <MermaidPreview\n                mermaidInstance={mermaidInstance}\n                text={node.attrs[MermaidConsts.NodeAttrs.content]}\n            />\n            <div>\n                <Button\n                    onClick={toggleMenuOpen}\n                    ref={setAnchorElement}\n                    size={'s'}\n                    className={STOP_EVENT_CLASSNAME}\n                >\n                    <Icon data={DotsIcon} className={STOP_EVENT_CLASSNAME} />\n                </Button>\n                <Popup\n                    open={menuOpen}\n                    anchorElement={anchorElement}\n                    onOpenChange={closeMenu}\n                    placement=\"bottom-end\"\n                >\n                    <Menu>\n                        <Menu.Item\n                            onClick={() => {\n                                toggleEditing();\n                                closeMenu();\n                            }}\n                        >\n                            {i18n('edit')}\n                        </Menu.Item>\n                        <Menu.Item\n                            onClick={() => {\n                                const pos = getPos();\n                                if (pos === undefined) return;\n                                removeNode({\n                                    node,\n                                    pos,\n                                    tr: view.state.tr,\n                                    dispatch: view.dispatch,\n                                });\n                            }}\n                        >\n                            {i18n('remove')}\n                        </Menu.Item>\n                    </Menu>\n                </Popup>\n            </div>\n        </div>\n    );\n};\n"]}

package/build/cjs/extensions/additional/Mermaid/MermaidNodeView/NodeView.d.ts

@@ -1,6 +1,6 @@
-import { Node } from 'prosemirror-model';
-import { EditorView, NodeView } from 'prosemirror-view';
-import type { MermaidOptions } from '..';
+import type { Node } from 'prosemirror-model';
+import type { EditorView, NodeView } from 'prosemirror-view';
+import type { MermaidOptions } from "../index.js";
 export declare class WMermaidNodeView implements NodeView {
     readonly dom: HTMLElement;
     private node;

package/build/cjs/extensions/additional/Mermaid/MermaidNodeView/NodeView.js

@@ -1,16 +1,19 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.WMermaidNodeView = void 0;
-const tslib_1 = require("tslib");
-const react_1 = tslib_1.__importDefault(require("react"));
-const react_dom_1 = require("react-dom");
-const behavior_1 = require("../../../behavior");
-const const_1 = require("../MermaidSpecs/const");
-const MermaidView_1 = require("./MermaidView");
+const jsx_runtime_1 = require("react/jsx-runtime");
+const uikit_1 = require("@gravity-ui/uikit");
+const behavior_1 = require("../../../behavior/index.js");
+const MermaidView_1 = require("./MermaidView.js");
 let mermaidInstance;
 class WMermaidNodeView {
+    dom;
+    node;
+    view;
+    getPos;
+    renderItem;
+    loadRuntimeScript;
     constructor(node, view, getPos, opts) {
-        this.getMermaidInstance = () => mermaidInstance;
         const { loadRuntimeScript } = opts;
         this.node = node;
         this.dom = document.createElement('div');
@@ -45,21 +48,22 @@ class WMermaidNodeView {
     }
     stopEvent(e) {
         const target = e.target;
-        if (typeof target.className === 'string' &&
-            target.className.includes('prosemirror-stop-event')) {
-            return true;
-        }
-        return false;
+        return target.classList.contains(MermaidView_1.STOP_EVENT_CLASSNAME);
     }
     onChange(attrs) {
         const pos = this.getPos();
         if (pos === undefined)
             return;
-        const tr = this.view.state.tr.setNodeMarkup(pos, undefined, Object.assign(Object.assign({}, this.node.attrs), attrs), []);
+        const tr = this.view.state.tr.setNodeMarkup(pos, undefined, {
+            ...this.node.attrs,
+            ...attrs,
+        }, []);
         this.view.dispatch(tr);
     }
+    getMermaidInstance = () => mermaidInstance;
     renderMermaid() {
-        return (0, react_dom_1.createPortal)(react_1.default.createElement(MermaidView_1.MermaidView, { view: this.view, onChange: this.onChange.bind(this), node: this.node, getMermaidInstance: this.getMermaidInstance, getPos: this.getPos }), this.dom);
+        return ((0, jsx_runtime_1.jsx)(uikit_1.Portal, { container: this.dom, children: (0, jsx_runtime_1.jsx)(MermaidView_1.MermaidView, { view: this.view, onChange: this.onChange.bind(this), node: this.node, getMermaidInstance: this.getMermaidInstance, getPos: this.getPos }) }));
     }
 }
 exports.WMermaidNodeView = WMermaidNodeView;
+//# sourceMappingURL=NodeView.js.map

package/build/cjs/extensions/additional/Mermaid/MermaidNodeView/NodeView.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"NodeView.js","sourceRoot":"../../../../../../src","sources":["extensions/additional/Mermaid/MermaidNodeView/NodeView.tsx"],"names":[],"mappings":"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","sourcesContent":["import {Portal} from '@gravity-ui/uikit';\nimport type {Mermaid} from 'mermaid' with {'resolution-mode': 'import'};\nimport type {Node} from 'prosemirror-model';\nimport type {EditorView, NodeView} from 'prosemirror-view';\n\nimport type {MermaidOptions} from '..';\nimport {getReactRendererFromState} from '../../../behavior';\nimport type {MermaidConsts} from '../MermaidSpecs/const';\n\nimport {MermaidView, STOP_EVENT_CLASSNAME} from './MermaidView';\n\nlet mermaidInstance: Mermaid;\n\nexport class WMermaidNodeView implements NodeView {\n    readonly dom: HTMLElement;\n    private node: Node;\n    private readonly view;\n    private readonly getPos;\n    private readonly renderItem;\n    private readonly loadRuntimeScript: () => void;\n\n    constructor(\n        node: Node,\n        view: EditorView,\n        getPos: () => number | undefined,\n        opts: MermaidOptions,\n    ) {\n        const {loadRuntimeScript} = opts;\n        this.node = node;\n        this.dom = document.createElement('div');\n        this.dom.classList.add('mermaid-container');\n        this.dom.contentEditable = 'false';\n        this.view = view;\n        this.getPos = getPos;\n        this.loadRuntimeScript = loadRuntimeScript;\n        this.initializeMermaid();\n        this.renderItem = getReactRendererFromState(view.state).createItem(\n            'mermaid-view',\n            this.renderMermaid.bind(this),\n        );\n    }\n\n    initializeMermaid() {\n        // https://github.com/diplodoc-platform/mermaid-extension/tree/master#prepared-mermaid-runtime\n        window.mermaidJsonp = window.mermaidJsonp || [];\n        window.mermaidJsonp.push((mermaid: Mermaid) => {\n            mermaidInstance = mermaid;\n        });\n\n        this.loadRuntimeScript();\n    }\n\n    update(node: Node) {\n        if (node.type !== this.node.type) return false;\n        this.node = node;\n        this.renderItem.rerender();\n        return true;\n    }\n\n    destroy() {\n        this.renderItem.remove();\n    }\n\n    ignoreMutation() {\n        return true;\n    }\n\n    stopEvent(e: Event) {\n        const target = e.target as Element;\n        return target.classList.contains(STOP_EVENT_CLASSNAME);\n    }\n\n    private onChange(attrs: {[MermaidConsts.NodeAttrs.content]: string}) {\n        const pos = this.getPos();\n        if (pos === undefined) return;\n\n        const tr = this.view.state.tr.setNodeMarkup(\n            pos,\n            undefined,\n            {\n                ...this.node.attrs,\n                ...attrs,\n            },\n            [],\n        );\n\n        this.view.dispatch(tr);\n    }\n\n    private getMermaidInstance = () => mermaidInstance;\n\n    private renderMermaid() {\n        return (\n            <Portal container={this.dom}>\n                <MermaidView\n                    view={this.view}\n                    onChange={this.onChange.bind(this)}\n                    node={this.node}\n                    getMermaidInstance={this.getMermaidInstance}\n                    getPos={this.getPos}\n                />\n            </Portal>\n        );\n    }\n}\n"]}

package/build/cjs/extensions/additional/Mermaid/MermaidNodeView/index.d.ts

@@ -1 +1 @@
-export * from './NodeView';
+export * from "./NodeView.js";

package/build/cjs/extensions/additional/Mermaid/MermaidNodeView/index.js

@@ -1,4 +1,5 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 const tslib_1 = require("tslib");
-tslib_1.__exportStar(require("./NodeView"), exports);
+tslib_1.__exportStar(require("./NodeView.js"), exports);
+//# sourceMappingURL=index.js.map

package/build/cjs/extensions/additional/Mermaid/MermaidNodeView/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"../../../../../../src","sources":["extensions/additional/Mermaid/MermaidNodeView/index.ts"],"names":[],"mappings":";;;AAAA,wDAA2B","sourcesContent":["export * from './NodeView';\n"]}

package/build/cjs/extensions/additional/Mermaid/MermaidSpecs/const.d.ts

@@ -4,10 +4,10 @@ export declare enum MermaidAttrs {
     newCreated = "newCreated"
 }
 export declare const mermaidNodeName = "mermaid";
-export declare const mermaidNodeType: (schema: import("prosemirror-model").Schema<any, any>) => import("prosemirror-model").NodeType;
+export declare const mermaidNodeType: (schema: import("prosemirror-model").Schema) => import("prosemirror-model").NodeType;
 export declare const MermaidAction = "createMermaid";
 export declare const MermaidConsts: {
     readonly NodeName: "mermaid";
     readonly NodeAttrs: typeof MermaidAttrs;
-    readonly nodeType: (schema: import("prosemirror-model").Schema<any, any>) => import("prosemirror-model").NodeType;
+    readonly nodeType: (schema: import("prosemirror-model").Schema) => import("prosemirror-model").NodeType;
 };

package/build/cjs/extensions/additional/Mermaid/MermaidSpecs/const.js

@@ -1,13 +1,13 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.MermaidConsts = exports.MermaidAction = exports.mermaidNodeType = exports.mermaidNodeName = exports.MermaidAttrs = void 0;
-const schema_1 = require("../../../../utils/schema");
+const schema_1 = require("../../../../utils/schema.js");
 var MermaidAttrs;
 (function (MermaidAttrs) {
     MermaidAttrs["content"] = "content";
     MermaidAttrs["class"] = "class";
     MermaidAttrs["newCreated"] = "newCreated";
-})(MermaidAttrs = exports.MermaidAttrs || (exports.MermaidAttrs = {}));
+})(MermaidAttrs || (exports.MermaidAttrs = MermaidAttrs = {}));
 exports.mermaidNodeName = 'mermaid';
 exports.mermaidNodeType = (0, schema_1.nodeTypeFactory)(exports.mermaidNodeName);
 exports.MermaidAction = 'createMermaid';
@@ -16,3 +16,4 @@ exports.MermaidConsts = {
     NodeAttrs: MermaidAttrs,
     nodeType: exports.mermaidNodeType,
 };
+//# sourceMappingURL=const.js.map

package/build/cjs/extensions/additional/Mermaid/MermaidSpecs/const.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"const.js","sourceRoot":"../../../../../../src","sources":["extensions/additional/Mermaid/MermaidSpecs/const.ts"],"names":[],"mappings":";;;AAAA,wDAAyD;AAEzD,IAAY,YAIX;AAJD,WAAY,YAAY;IACpB,mCAAmB,CAAA;IACnB,+BAAe,CAAA;IACf,yCAAyB,CAAA;AAC7B,CAAC,EAJW,YAAY,4BAAZ,YAAY,QAIvB;AAEY,QAAA,eAAe,GAAG,SAAS,CAAC;AAC5B,QAAA,eAAe,GAAG,IAAA,wBAAe,EAAC,uBAAe,CAAC,CAAC;AAEnD,QAAA,aAAa,GAAG,eAAe,CAAC;AAEhC,QAAA,aAAa,GAAG;IACzB,QAAQ,EAAE,uBAAe;IACzB,SAAS,EAAE,YAAY;IACvB,QAAQ,EAAE,uBAAe;CACnB,CAAC","sourcesContent":["import {nodeTypeFactory} from '../../../../utils/schema';\n\nexport enum MermaidAttrs {\n    content = 'content',\n    class = 'class',\n    newCreated = 'newCreated',\n}\n\nexport const mermaidNodeName = 'mermaid';\nexport const mermaidNodeType = nodeTypeFactory(mermaidNodeName);\n\nexport const MermaidAction = 'createMermaid';\n\nexport const MermaidConsts = {\n    NodeName: mermaidNodeName,\n    NodeAttrs: MermaidAttrs,\n    nodeType: mermaidNodeType,\n} as const;\n"]}

package/build/cjs/extensions/additional/Mermaid/MermaidSpecs/index.d.ts

@@ -1,10 +1,10 @@
-import type { ExtensionNodeSpec } from '../../../../core';
-export { mermaidNodeName } from './const';
-export declare type MermaidSpecsOptions = {
+import type { ExtensionNodeSpec } from "../../../../core/index.js";
+export { mermaidNodeName } from "./const.js";
+export type MermaidSpecsOptions = {
     nodeView?: ExtensionNodeSpec['view'];
 };
-export declare const MermaidSpecs: import("../../../../core").ExtensionWithOptions<MermaidSpecsOptions> & {
+export declare const MermaidSpecs: import("../../../../core/index.js").ExtensionWithOptions<MermaidSpecsOptions> & {
     readonly NodeName: "mermaid";
-    readonly NodeAttrs: typeof import("./const").MermaidAttrs;
-    readonly nodeType: (schema: import("prosemirror-model").Schema<any, any>) => import("prosemirror-model").NodeType;
+    readonly NodeAttrs: typeof import("./const.js").MermaidAttrs;
+    readonly nodeType: (schema: import("prosemirror-model").Schema) => import("prosemirror-model").NodeType;
 };

package/build/cjs/extensions/additional/Mermaid/MermaidSpecs/index.js

@@ -3,8 +3,8 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.MermaidSpecs = exports.mermaidNodeName = void 0;
 // eslint-disable-next-line import/no-extraneous-dependencies
 const mermaid_extension_1 = require("@diplodoc/mermaid-extension");
-const const_1 = require("./const");
-var const_2 = require("./const");
+const const_1 = require("./const.js");
+var const_2 = require("./const.js");
 Object.defineProperty(exports, "mermaidNodeName", { enumerable: true, get: function () { return const_2.mermaidNodeName; } });
 const MermaidSpecsExtension = (builder, { nodeView }) => {
     builder
@@ -45,3 +45,4 @@ const MermaidSpecsExtension = (builder, { nodeView }) => {
     }));
 };
 exports.MermaidSpecs = Object.assign(MermaidSpecsExtension, const_1.MermaidConsts);
+//# sourceMappingURL=index.js.map

package/build/cjs/extensions/additional/Mermaid/MermaidSpecs/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"../../../../../../src","sources":["extensions/additional/Mermaid/MermaidSpecs/index.tsx"],"names":[],"mappings":";;;AAAA,6DAA6D;AAC7D,mEAAsD;AAItD,sCAAuD;AACvD,oCAAwC;AAAhC,wGAAA,eAAe,OAAA;AAMvB,MAAM,qBAAqB,GAAuC,CAAC,OAAO,EAAE,EAAC,QAAQ,EAAC,EAAE,EAAE;IACtF,OAAO;SACF,WAAW,CAAC,CAAC,EAAE,EAAE,EAAE,CAAC,EAAE,CAAC,GAAG,CAAC,IAAA,6BAAS,EAAC,EAAC,OAAO,EAAE,SAAS,EAAE,MAAM,EAAE,KAAK,EAAC,CAAC,EAAE,EAAE,CAAC,CAAC;SAC/E,OAAO,CAAC,uBAAe,EAAE,GAAG,EAAE,CAAC,CAAC;QAC7B,MAAM,EAAE;YACJ,SAAS,EAAE;gBACP,IAAI,EAAE,uBAAe;gBACrB,IAAI,EAAE,MAAM;gBACZ,QAAQ,EAAE,CAAC,EAAC,OAAO,EAAC,EAAE,EAAE,CAAC,CAAC,EAAC,OAAO,EAAC,CAAC;aACvC;SACJ;QACD,IAAI,EAAE;YACF,UAAU,EAAE,IAAI;YAChB,IAAI,EAAE,IAAI;YACV,KAAK,EAAE,OAAO;YACd,KAAK,EAAE;gBACH,CAAC,qBAAa,CAAC,SAAS,CAAC,OAAO,CAAC,EAAE,EAAC,OAAO,EAAE,EAAE,EAAC;gBAChD,CAAC,qBAAa,CAAC,SAAS,CAAC,KAAK,CAAC,EAAE,EAAC,OAAO,EAAE,SAAS,EAAC;gBACrD,CAAC,qBAAa,CAAC,SAAS,CAAC,UAAU,CAAC,EAAE,EAAC,OAAO,EAAE,IAAI,EAAC;aACxD;YACD,QAAQ,EAAE,EAAE;YACZ,KAAK,CAAC,IAAI;gBACN,OAAO,CAAC,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,CAAC;YAC/B,CAAC;YACD,GAAG,EAAE,EAAC,KAAK,EAAE,EAAC,MAAM,EAAE,CAAC,CAAC,EAAE,CAAC,CAAC,EAAC,EAAC;SACjC;QACD,IAAI,EAAE,CAAC,KAAK,EAAE,IAAI,EAAE,EAAE;YAClB,MAAM,OAAO,GAAW,IAAI,CAAC,KAAK,CAAC,qBAAa,CAAC,SAAS,CAAC,OAAO,CAAC,IAAI,EAAE,CAAC;YAE1E,KAAK,CAAC,KAAK,CAAC,YAAY,CAAC,CAAC;YAC1B,KAAK,CAAC,aAAa,EAAE,CAAC;YACtB,KAAK,CAAC,IAAI,CAAC,OAAO,CAAC,IAAI,EAAE,EAAE,KAAK,CAAC,CAAC;YAClC,KAAK,CAAC,aAAa,EAAE,CAAC;YACtB,KAAK,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC;YACnB,KAAK,CAAC,aAAa,EAAE,CAAC;QAC1B,CAAC;QACD,IAAI,EAAE,QAAQ;KACjB,CAAC,CAAC,CAAC;AACZ,CAAC,CAAC;AAEW,QAAA,YAAY,GAAG,MAAM,CAAC,MAAM,CAAC,qBAAqB,EAAE,qBAAa,CAAC,CAAC","sourcesContent":["// eslint-disable-next-line import/no-extraneous-dependencies\nimport {transform} from '@diplodoc/mermaid-extension';\n\nimport type {ExtensionAuto, ExtensionNodeSpec} from '../../../../core';\n\nimport {MermaidConsts, mermaidNodeName} from './const';\nexport {mermaidNodeName} from './const';\n\nexport type MermaidSpecsOptions = {\n    nodeView?: ExtensionNodeSpec['view'];\n};\n\nconst MermaidSpecsExtension: ExtensionAuto<MermaidSpecsOptions> = (builder, {nodeView}) => {\n    builder\n        .configureMd((md) => md.use(transform({runtime: 'mermaid', bundle: false}), {}))\n        .addNode(mermaidNodeName, () => ({\n            fromMd: {\n                tokenSpec: {\n                    name: mermaidNodeName,\n                    type: 'node',\n                    getAttrs: ({content}) => ({content}),\n                },\n            },\n            spec: {\n                selectable: true,\n                atom: true,\n                group: 'block',\n                attrs: {\n                    [MermaidConsts.NodeAttrs.content]: {default: ''},\n                    [MermaidConsts.NodeAttrs.class]: {default: 'mermaid'},\n                    [MermaidConsts.NodeAttrs.newCreated]: {default: null},\n                },\n                parseDOM: [],\n                toDOM(node) {\n                    return ['div', node.attrs];\n                },\n                dnd: {props: {offset: [8, 1]}},\n            },\n            toMd: (state, node) => {\n                const content: string = node.attrs[MermaidConsts.NodeAttrs.content] || '';\n\n                state.write('```mermaid');\n                state.ensureNewLine();\n                state.text(content.trim(), false);\n                state.ensureNewLine();\n                state.write('```');\n                state.ensureNewLine();\n            },\n            view: nodeView,\n        }));\n};\n\nexport const MermaidSpecs = Object.assign(MermaidSpecsExtension, MermaidConsts);\n"]}

package/build/cjs/extensions/additional/Mermaid/actions.d.ts

@@ -1,2 +1,2 @@
-import { ActionSpec } from '../../../core';
+import type { ActionSpec } from "../../../core/index.js";
 export declare const addMermaid: ActionSpec;

package/build/cjs/extensions/additional/Mermaid/actions.js

@@ -1,7 +1,7 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.addMermaid = void 0;
-const const_1 = require("./MermaidSpecs/const");
+const const_1 = require("./MermaidSpecs/const.js");
 exports.addMermaid = {
     isEnable(state) {
         return state.selection.empty;
@@ -17,3 +17,4 @@ exports.addMermaid = {
         })));
     },
 };
+//# sourceMappingURL=actions.js.map

package/build/cjs/extensions/additional/Mermaid/actions.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"actions.js","sourceRoot":"../../../../../src","sources":["extensions/additional/Mermaid/actions.ts"],"names":[],"mappings":";;;AAEA,mDAAqD;AAExC,QAAA,UAAU,GAAe;IAClC,QAAQ,CAAC,KAAK;QACV,OAAO,KAAK,CAAC,SAAS,CAAC,KAAK,CAAC;IACjC,CAAC;IACD,GAAG,CAAC,KAAK,EAAE,QAAQ,EAAE,KAAK;QACtB,QAAQ,CACJ,KAAK,CAAC,EAAE,CAAC,MAAM,CACX,KAAK,CAAC,SAAS,CAAC,IAAI,EACpB,IAAA,uBAAe,EAAC,KAAK,CAAC,MAAM,CAAC,CAAC,MAAM,CAAC;YACjC,OAAO,EAAE;gBACL,iBAAiB;gBACjB,uBAAuB;gBACvB,yBAAyB;aAC5B,CAAC,IAAI,CAAC,IAAI,CAAC;YACZ,UAAU,EAAE,IAAI;SACnB,CAAC,CACL,CACJ,CAAC;IACN,CAAC;CACJ,CAAC","sourcesContent":["import type {ActionSpec} from '../../../core';\n\nimport {mermaidNodeType} from './MermaidSpecs/const';\n\nexport const addMermaid: ActionSpec = {\n    isEnable(state) {\n        return state.selection.empty;\n    },\n    run(state, dispatch, _view) {\n        dispatch(\n            state.tr.insert(\n                state.selection.from,\n                mermaidNodeType(state.schema).create({\n                    content: [\n                        'sequenceDiagram',\n                        '\\tAlice->>Bob: Hi Bob',\n                        '\\tBob->>Alice: Hi Alice',\n                    ].join('\\n'),\n                    newCreated: true,\n                }),\n            ),\n        );\n    },\n};\n"]}

package/build/cjs/extensions/additional/Mermaid/const.d.ts

@@ -1,2 +1,2 @@
-export * from './MermaidSpecs/const';
+export * from "./MermaidSpecs/const.js";
 export declare const MermaidAction = "createMermaid";

package/build/cjs/extensions/additional/Mermaid/const.js

@@ -2,5 +2,6 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.MermaidAction = void 0;
 const tslib_1 = require("tslib");
-tslib_1.__exportStar(require("./MermaidSpecs/const"), exports);
+tslib_1.__exportStar(require("./MermaidSpecs/const.js"), exports);
 exports.MermaidAction = 'createMermaid';
+//# sourceMappingURL=const.js.map

package/build/cjs/extensions/additional/Mermaid/const.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"const.js","sourceRoot":"../../../../../src","sources":["extensions/additional/Mermaid/const.ts"],"names":[],"mappings":";;;;AAAA,kEAAqC;AACxB,QAAA,aAAa,GAAG,eAAe,CAAC","sourcesContent":["export * from './MermaidSpecs/const';\nexport const MermaidAction = 'createMermaid';\n"]}

package/build/cjs/extensions/additional/Mermaid/index.d.ts

@@ -1,6 +1,6 @@
-import { Action, ExtensionAuto } from '../../../core';
-import { MermaidAction } from './MermaidSpecs/const';
-export declare type MermaidOptions = {
+import type { Action, ExtensionAuto } from "../../../core/index.js";
+import { MermaidAction } from "./MermaidSpecs/const.js";
+export type MermaidOptions = {
     loadRuntimeScript: () => void;
 };
 export declare const Mermaid: ExtensionAuto<MermaidOptions>;

package/build/cjs/extensions/additional/Mermaid/index.js

@@ -1,10 +1,10 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.Mermaid = void 0;
-const MermaidNodeView_1 = require("./MermaidNodeView");
-const MermaidSpecs_1 = require("./MermaidSpecs");
-const const_1 = require("./MermaidSpecs/const");
-const actions_1 = require("./actions");
+const MermaidNodeView_1 = require("./MermaidNodeView/index.js");
+const MermaidSpecs_1 = require("./MermaidSpecs/index.js");
+const const_1 = require("./MermaidSpecs/const.js");
+const actions_1 = require("./actions.js");
 const Mermaid = (builder, { loadRuntimeScript }) => {
     builder.use(MermaidSpecs_1.MermaidSpecs, {
         nodeView: MermaidNodeViewFactory({ loadRuntimeScript }),
@@ -15,3 +15,4 @@ exports.Mermaid = Mermaid;
 const MermaidNodeViewFactory = ({ loadRuntimeScript }) => () => (node, view, getPos) => {
     return new MermaidNodeView_1.WMermaidNodeView(node, view, getPos, { loadRuntimeScript });
 };
+//# sourceMappingURL=index.js.map

package/build/cjs/extensions/additional/Mermaid/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"../../../../../src","sources":["extensions/additional/Mermaid/index.ts"],"names":[],"mappings":";;;AAEA,gEAAmD;AACnD,0DAA4C;AAC5C,mDAAmD;AACnD,0CAAqC;AAI9B,MAAM,OAAO,GAAkC,CAAC,OAAO,EAAE,EAAC,iBAAiB,EAAC,EAAE,EAAE;IACnF,OAAO,CAAC,GAAG,CAAC,2BAAY,EAAE;QACtB,QAAQ,EAAE,sBAAsB,CAAC,EAAC,iBAAiB,EAAC,CAAC;KACxD,CAAC,CAAC;IAEH,OAAO,CAAC,SAAS,CAAC,qBAAa,EAAE,GAAG,EAAE,CAAC,oBAAU,CAAC,CAAC;AACvD,CAAC,CAAC;AANW,QAAA,OAAO,WAMlB;AAEF,MAAM,sBAAsB,GAGxB,CAAC,EAAC,iBAAiB,EAAC,EAAE,EAAE,CACxB,GAAG,EAAE,CACL,CAAC,IAAI,EAAE,IAAI,EAAE,MAAM,EAAE,EAAE;IACnB,OAAO,IAAI,kCAAgB,CAAC,IAAI,EAAE,IAAI,EAAE,MAAM,EAAE,EAAC,iBAAiB,EAAC,CAAC,CAAC;AACzE,CAAC,CAAC","sourcesContent":["import type {Action, ExtensionAuto, ExtensionDeps, NodeViewConstructor} from '../../../core';\n\nimport {WMermaidNodeView} from './MermaidNodeView';\nimport {MermaidSpecs} from './MermaidSpecs';\nimport {MermaidAction} from './MermaidSpecs/const';\nimport {addMermaid} from './actions';\n\nexport type MermaidOptions = {loadRuntimeScript: () => void};\n\nexport const Mermaid: ExtensionAuto<MermaidOptions> = (builder, {loadRuntimeScript}) => {\n    builder.use(MermaidSpecs, {\n        nodeView: MermaidNodeViewFactory({loadRuntimeScript}),\n    });\n\n    builder.addAction(MermaidAction, () => addMermaid);\n};\n\nconst MermaidNodeViewFactory: (\n    opts: MermaidOptions,\n) => (deps: ExtensionDeps) => NodeViewConstructor =\n    ({loadRuntimeScript}) =>\n    () =>\n    (node, view, getPos) => {\n        return new WMermaidNodeView(node, view, getPos, {loadRuntimeScript});\n    };\n\ndeclare global {\n    namespace WysiwygEditor {\n        interface Actions {\n            [MermaidAction]: Action;\n        }\n    }\n    interface Window {\n        mermaidJsonp: Function[];\n    }\n}\n"]}

package/build/cjs/extensions/additional/YfmHtmlBlock/YfmHtmlBlockNodeView/NodeView.d.ts

@@ -1,6 +1,6 @@
-import { Node } from 'prosemirror-model';
-import { EditorView, NodeView } from 'prosemirror-view';
-import { YfmHtmlBlockOptions } from '../index';
+import type { Node } from 'prosemirror-model';
+import type { EditorView, NodeView } from 'prosemirror-view';
+import type { YfmHtmlBlockOptions } from "../index.js";
 export declare class WYfmHtmlBlockNodeView implements NodeView {
     readonly dom: HTMLElement;
     private node;

package/build/cjs/extensions/additional/YfmHtmlBlock/YfmHtmlBlockNodeView/NodeView.js

@@ -1,15 +1,19 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.WYfmHtmlBlockNodeView = void 0;
-const tslib_1 = require("tslib");
-const react_1 = tslib_1.__importDefault(require("react"));
-const react_dom_1 = require("react-dom");
-const behavior_1 = require("../../../behavior");
-const const_1 = require("../YfmHtmlBlockSpecs/const");
-const YfmHtmlBlockView_1 = require("./YfmHtmlBlockView");
+const jsx_runtime_1 = require("react/jsx-runtime");
+const uikit_1 = require("@gravity-ui/uikit");
+const behavior_1 = require("../../../behavior/index.js");
+const const_1 = require("../YfmHtmlBlockSpecs/const.js");
+const YfmHtmlBlockView_1 = require("./YfmHtmlBlockView.js");
 class WYfmHtmlBlockNodeView {
+    dom;
+    node;
+    view;
+    getPos;
+    options = {};
+    renderItem;
     constructor({ node, view, getPos, options, }) {
-        this.options = {};
         this.node = node;
         this.dom = document.createElement('div');
         this.dom.classList.add('yfm-html-block-container');
@@ -37,21 +41,21 @@ class WYfmHtmlBlockNodeView {
     }
     stopEvent(e) {
         const target = e.target;
-        if (typeof target.className === 'string' &&
-            target.className.includes('prosemirror-stop-event')) {
-            return true;
-        }
-        return false;
+        return target.classList.contains(YfmHtmlBlockView_1.STOP_EVENT_CLASSNAME);
     }
     onChange(attrs) {
         const pos = this.getPos();
         if (pos === undefined)
             return;
-        const tr = this.view.state.tr.setNodeMarkup(pos, undefined, Object.assign(Object.assign({}, this.node.attrs), attrs), []);
+        const tr = this.view.state.tr.setNodeMarkup(pos, undefined, {
+            ...this.node.attrs,
+            ...attrs,
+        }, []);
         this.view.dispatch(tr);
     }
     renderYfmHtmlBlock() {
-        return (0, react_dom_1.createPortal)(react_1.default.createElement(YfmHtmlBlockView_1.YfmHtmlBlockView, { getPos: this.getPos, node: this.node, onChange: this.onChange.bind(this), options: this.options, view: this.view }), this.dom);
+        return ((0, jsx_runtime_1.jsx)(uikit_1.Portal, { container: this.dom, children: (0, jsx_runtime_1.jsx)(YfmHtmlBlockView_1.YfmHtmlBlockView, { getPos: this.getPos, node: this.node, onChange: this.onChange.bind(this), options: this.options, view: this.view }) }));
     }
 }
 exports.WYfmHtmlBlockNodeView = WYfmHtmlBlockNodeView;
+//# sourceMappingURL=NodeView.js.map

package/build/cjs/extensions/additional/YfmHtmlBlock/YfmHtmlBlockNodeView/NodeView.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"NodeView.js","sourceRoot":"../../../../../../src","sources":["extensions/additional/YfmHtmlBlock/YfmHtmlBlockNodeView/NodeView.tsx"],"names":[],"mappings":";;;;AAAA,6CAAyC;AAIzC,yDAA4D;AAC5D,yDAA8D;AAG9D,4DAA0E;AAE1E,MAAa,qBAAqB;IACrB,GAAG,CAAc;IAClB,IAAI,CAAO;IACF,IAAI,CAAC;IACL,MAAM,CAAC;IACP,OAAO,GAAwB,EAAE,CAAC;IAClC,UAAU,CAAC;IAE5B,YAAY,EACR,IAAI,EACJ,IAAI,EACJ,MAAM,EACN,OAAO,GAMV;QACG,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC;QACjB,IAAI,CAAC,GAAG,GAAG,QAAQ,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;QACzC,IAAI,CAAC,GAAG,CAAC,SAAS,CAAC,GAAG,CAAC,0BAA0B,CAAC,CAAC;QACnD,IAAI,CAAC,GAAG,CAAC,eAAe,GAAG,OAAO,CAAC;QACnC,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC;QACjB,IAAI,CAAC,MAAM,GAAG,MAAM,CAAC;QACrB,IAAI,CAAC,OAAO,GAAG,OAAO,CAAC;QAEvB,IAAI,CAAC,UAAU,GAAG,IAAA,oCAAyB,EAAC,IAAI,CAAC,KAAK,CAAC,CAAC,UAAU,CAC9D,mBAAmB,EACnB,IAAI,CAAC,kBAAkB,CAAC,IAAI,CAAC,IAAI,CAAC,CACrC,CAAC;IACN,CAAC;IAED,MAAM,CAAC,IAAU;QACb,IAAI,IAAI,CAAC,IAAI,KAAK,IAAI,CAAC,IAAI,CAAC,IAAI;YAAE,OAAO,KAAK,CAAC;QAC/C,IACI,IAAI,CAAC,KAAK,CAAC,0BAAkB,CAAC,SAAS,CAAC,UAAU,CAAC;YACnD,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,0BAAkB,CAAC,SAAS,CAAC,UAAU,CAAC;YAExD,OAAO,KAAK,CAAC;QACjB,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC;QACjB,IAAI,CAAC,UAAU,CAAC,QAAQ,EAAE,CAAC;QAC3B,OAAO,IAAI,CAAC;IAChB,CAAC;IAED,OAAO;QACH,IAAI,CAAC,UAAU,CAAC,MAAM,EAAE,CAAC;IAC7B,CAAC;IAED,cAAc;QACV,OAAO,IAAI,CAAC;IAChB,CAAC;IAED,SAAS,CAAC,CAAQ;QACd,MAAM,MAAM,GAAG,CAAC,CAAC,MAAiB,CAAC;QACnC,OAAO,MAAM,CAAC,SAAS,CAAC,QAAQ,CAAC,uCAAoB,CAAC,CAAC;IAC3D,CAAC;IAEO,QAAQ,CAAC,KAAsD;QACnE,MAAM,GAAG,GAAG,IAAI,CAAC,MAAM,EAAE,CAAC;QAC1B,IAAI,GAAG,KAAK,SAAS;YAAE,OAAO;QAE9B,MAAM,EAAE,GAAG,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,EAAE,CAAC,aAAa,CACvC,GAAG,EACH,SAAS,EACT;YACI,GAAG,IAAI,CAAC,IAAI,CAAC,KAAK;YAClB,GAAG,KAAK;SACX,EACD,EAAE,CACL,CAAC;QAEF,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC;IAC3B,CAAC;IAEO,kBAAkB;QACtB,OAAO,CACH,uBAAC,cAAM,IAAC,SAAS,EAAE,IAAI,CAAC,GAAG,YACvB,uBAAC,mCAAgB,IACb,MAAM,EAAE,IAAI,CAAC,MAAM,EACnB,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,QAAQ,EAAE,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,IAAI,CAAC,EAClC,OAAO,EAAE,IAAI,CAAC,OAAO,EACrB,IAAI,EAAE,IAAI,CAAC,IAAI,GACjB,GACG,CACZ,CAAC;IACN,CAAC;CACJ;AAxFD,sDAwFC","sourcesContent":["import {Portal} from '@gravity-ui/uikit';\nimport type {Node} from 'prosemirror-model';\nimport type {EditorView, NodeView} from 'prosemirror-view';\n\nimport {getReactRendererFromState} from '../../../behavior';\nimport {YfmHtmlBlockConsts} from '../YfmHtmlBlockSpecs/const';\nimport type {YfmHtmlBlockOptions} from '../index';\n\nimport {STOP_EVENT_CLASSNAME, YfmHtmlBlockView} from './YfmHtmlBlockView';\n\nexport class WYfmHtmlBlockNodeView implements NodeView {\n    readonly dom: HTMLElement;\n    private node: Node;\n    private readonly view;\n    private readonly getPos;\n    private readonly options: YfmHtmlBlockOptions = {};\n    private readonly renderItem;\n\n    constructor({\n        node,\n        view,\n        getPos,\n        options,\n    }: {\n        node: Node;\n        view: EditorView;\n        getPos: () => number | undefined;\n        options: YfmHtmlBlockOptions;\n    }) {\n        this.node = node;\n        this.dom = document.createElement('div');\n        this.dom.classList.add('yfm-html-block-container');\n        this.dom.contentEditable = 'false';\n        this.view = view;\n        this.getPos = getPos;\n        this.options = options;\n\n        this.renderItem = getReactRendererFromState(view.state).createItem(\n            'yfmHtmlBlock-view',\n            this.renderYfmHtmlBlock.bind(this),\n        );\n    }\n\n    update(node: Node) {\n        if (node.type !== this.node.type) return false;\n        if (\n            node.attrs[YfmHtmlBlockConsts.NodeAttrs.newCreated] !==\n            this.node.attrs[YfmHtmlBlockConsts.NodeAttrs.newCreated]\n        )\n            return false;\n        this.node = node;\n        this.renderItem.rerender();\n        return true;\n    }\n\n    destroy() {\n        this.renderItem.remove();\n    }\n\n    ignoreMutation() {\n        return true;\n    }\n\n    stopEvent(e: Event) {\n        const target = e.target as Element;\n        return target.classList.contains(STOP_EVENT_CLASSNAME);\n    }\n\n    private onChange(attrs: {[YfmHtmlBlockConsts.NodeAttrs.srcdoc]: string}) {\n        const pos = this.getPos();\n        if (pos === undefined) return;\n\n        const tr = this.view.state.tr.setNodeMarkup(\n            pos,\n            undefined,\n            {\n                ...this.node.attrs,\n                ...attrs,\n            },\n            [],\n        );\n\n        this.view.dispatch(tr);\n    }\n\n    private renderYfmHtmlBlock() {\n        return (\n            <Portal container={this.dom}>\n                <YfmHtmlBlockView\n                    getPos={this.getPos}\n                    node={this.node}\n                    onChange={this.onChange.bind(this)}\n                    options={this.options}\n                    view={this.view}\n                />\n            </Portal>\n        );\n    }\n}\n"]}

package/build/cjs/extensions/additional/YfmHtmlBlock/YfmHtmlBlockNodeView/YfmHtmlBlockView.d.ts

@@ -1,10 +1,10 @@
-import React from 'react';
-import { Node } from 'prosemirror-model';
-import { EditorView } from 'prosemirror-view';
-import { YfmHtmlBlockConsts } from '../YfmHtmlBlockSpecs/const';
-import { YfmHtmlBlockOptions } from '../index';
+import type { Node } from 'prosemirror-model';
+import type { EditorView } from 'prosemirror-view';
+import { YfmHtmlBlockConsts } from "../YfmHtmlBlockSpecs/const.js";
+import type { YfmHtmlBlockOptions } from "../index.js";
+import "./YfmHtmlBlock.css";
 export declare const cnYfmHtmlBlock: import("@bem-react/classname").ClassNameFormatter;
-export declare const cnHelper: import("@bem-react/classname").ClassNameFormatter;
+export declare const STOP_EVENT_CLASSNAME = "prosemirror-stop-event";
 export declare function generateID(): string;
 export declare const YfmHtmlBlockView: React.FC<{
     getPos: () => number | undefined;