@gravity-ui/markdown-editor 13.18.2 → 13.20.0

package/README.md

@@ -1,4 +1,4 @@
-![Markdown Editor](https://github.com/user-attachments/assets/40be2902-a683-4167-bd8d-ffd8bff26e69)
+![Markdown Editor](https://github.com/user-attachments/assets/0b4e5f65-54cf-475f-9c68-557a4e9edb46)
 
 # @gravity-ui/markdown-editor · [![npm package](https://img.shields.io/npm/v/@gravity-ui/markdown-editor)](https://www.npmjs.com/package/@gravity-ui/markdown-editor) [![CI](https://img.shields.io/github/actions/workflow/status/gravity-ui/markdown-editor/ci.yml?branch=main&label=CI)](https://github.com/gravity-ui/markdown-editor/actions/workflows/ci.yml?query=branch:main) [![Release](https://img.shields.io/github/actions/workflow/status/gravity-ui/markdown-editor/release.yml?branch=main&label=Release)](https://github.com/gravity-ui/markdown-editor/actions/workflows/release.yml?query=branch:main) [![storybook](https://img.shields.io/badge/Storybook-deployed-ff4685)](https://preview.gravity-ui.com/md-editor/)
 

package/build/cjs/bundle/Editor.d.ts

@@ -57,6 +57,8 @@ export declare type MarkupConfig = {
     disabledExtensions?: CreateCodemirrorParams['disabledExtensions'];
     /** Additional keymaps for codemirror instance */
     keymaps?: CreateCodemirrorParams['keymaps'];
+    /** Overrides the default placeholder content. */
+    placeholder?: CreateCodemirrorParams['placeholder'];
     /**
      * Additional language data for markdown language in codemirror.
      * Can be used to configure additional autocompletions and others.

package/build/cjs/bundle/Editor.js

@@ -150,10 +150,11 @@ class EditorImpl extends event_emitter_1.SafeEventEmitter {
         return tslib_1.__classPrivateFieldGet(this, _EditorImpl_wysiwygEditor, "f");
     }
     get markupEditor() {
+        var _a;
         if (!tslib_1.__classPrivateFieldGet(this, _EditorImpl_markupEditor, "f")) {
             tslib_1.__classPrivateFieldSet(this, _EditorImpl_markupEditor, new editor_1.Editor((0, codemirror_1.createCodemirror)({
                 doc: tslib_1.__classPrivateFieldGet(this, _EditorImpl_markup, "f"),
-                placeholderText: (0, bundle_1.i18n)('markup_placeholder'),
+                placeholder: (_a = tslib_1.__classPrivateFieldGet(this, _EditorImpl_markupConfig, "f").placeholder) !== null && _a !== void 0 ? _a : (0, bundle_1.i18n)('markup_placeholder'),
                 onCancel: () => this.emit('cancel', null),
                 onSubmit: () => this.emit('submit', null),
                 onChange: () => this.emit('rerender-toolbar', null),

package/build/cjs/core/markdown/MarkdownSerializer.js

@@ -195,15 +195,19 @@ class MarkdownSerializerState {
         let trailing = '';
         const progress = (node, _, index) => {
             let marks = node ? node.marks : [];
-            // Remove marks from breaks (hard_break or soft_break) that are the last node inside
+            // Remove marks from breaks (hard_break or soft_break) that are the edge node inside
             // that mark to prevent parser edge cases with new lines just
-            // before closing marks.
+            // before closing or after opening marks.
             if (node && node.type.spec.isBreak) {
                 marks = marks.filter(m => {
+                    if (index === 0)
+                        return false;
                     if (index + 1 == parent.childCount)
                         return false;
+                    const prev = parent.child(index - 1);
                     const next = parent.child(index + 1);
-                    return m.isInSet(next.marks) && (!next.isText || /\S/.test(next.text));
+                    return ((m.isInSet(prev.marks) && (!prev.isText || /\S/.test(prev.text))) &&
+                        (m.isInSet(next.marks) && (!next.isText || /\S/.test(next.text))));
                 });
             }
             let leading = trailing;

package/build/cjs/extensions/yfm/YfmTable/YfmTableSpecs/serializer.js

@@ -67,10 +67,23 @@ exports.serializerTokens = {
             state.ensureNewLine();
         });
     },
-    [const_1.YfmTableNode.Row]: (_state, node) => {
-        throw new Error(`Should not serialize ${node.type.name} node via serialize-token`);
+    [const_1.YfmTableNode.Row]: (state, node) => {
+        console.warn(`Should not serialize ${node.type.name} node via serialize-token`);
+        state.write('||');
+        state.ensureNewLine();
+        state.write('\n');
+        state.renderContent(node);
+        state.write('||');
+        state.ensureNewLine();
     },
-    [const_1.YfmTableNode.Cell]: (_state, node) => {
-        throw new Error(`Should not serialize ${node.type.name} node via serialize-token`);
+    [const_1.YfmTableNode.Cell]: (state, node, parent) => {
+        console.warn(`Should not serialize ${node.type.name} node via serialize-token`);
+        state.renderContent(node);
+        const isLastCellInRow = parent.lastChild === node;
+        if (!isLastCellInRow) {
+            state.write('|');
+            state.ensureNewLine();
+            state.write('\n');
+        }
     },
 };

package/build/cjs/extensions/yfm/YfmTabs/YfmTabsSpecs/const.d.ts

@@ -1,8 +1,12 @@
 export declare enum TabsNode {
+    TabPanel = "yfm_tab_panel",
     Tab = "yfm_tab",
     TabsList = "yfm_tabs_list",
-    TabPanel = "yfm_tab_panel",
-    Tabs = "yfm_tabs"
+    Tabs = "yfm_tabs",
+    RadioTabs = "yfm_radio_tabs",
+    RadioTab = "yfm_radio_tab",
+    RadioTabInput = "yfm_radio_tab_input",
+    RadioTabLabel = "yfm_radio_tab_label"
 }
 export declare enum TabsAttrs {
     class = "class",
@@ -21,7 +25,8 @@ export declare enum TabAttrs {
     tabindex = "tabindex",
     dataDiplodocKey = "data-diplodoc-key",
     dataDiplodocid = "data-diplodoc-id",
-    dataDiplodocIsActive = "data-diplodoc-is-active"
+    dataDiplodocIsActive = "data-diplodoc-is-active",
+    dataDiplodocVerticalTab = "data-diplodoc-vertical-tab"
 }
 export declare enum TabPanelAttrs {
     id = "id",

package/build/cjs/extensions/yfm/YfmTabs/YfmTabsSpecs/const.js

@@ -3,10 +3,15 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.TabPanelAttrs = exports.TabAttrs = exports.TabsListAttrs = exports.TabsAttrs = exports.TabsNode = void 0;
 var TabsNode;
 (function (TabsNode) {
+    // tabs panel is common for tabs and radio tabs
+    TabsNode["TabPanel"] = "yfm_tab_panel";
     TabsNode["Tab"] = "yfm_tab";
     TabsNode["TabsList"] = "yfm_tabs_list";
-    TabsNode["TabPanel"] = "yfm_tab_panel";
     TabsNode["Tabs"] = "yfm_tabs";
+    TabsNode["RadioTabs"] = "yfm_radio_tabs";
+    TabsNode["RadioTab"] = "yfm_radio_tab";
+    TabsNode["RadioTabInput"] = "yfm_radio_tab_input";
+    TabsNode["RadioTabLabel"] = "yfm_radio_tab_label";
 })(TabsNode = exports.TabsNode || (exports.TabsNode = {}));
 var TabsAttrs;
 (function (TabsAttrs) {
@@ -29,6 +34,7 @@ var TabAttrs;
     TabAttrs["dataDiplodocKey"] = "data-diplodoc-key";
     TabAttrs["dataDiplodocid"] = "data-diplodoc-id";
     TabAttrs["dataDiplodocIsActive"] = "data-diplodoc-is-active";
+    TabAttrs["dataDiplodocVerticalTab"] = "data-diplodoc-vertical-tab";
 })(TabAttrs = exports.TabAttrs || (exports.TabAttrs = {}));
 var TabPanelAttrs;
 (function (TabPanelAttrs) {

package/build/cjs/extensions/yfm/YfmTabs/YfmTabsSpecs/index.d.ts

@@ -14,5 +14,7 @@ export declare type YfmTabsSpecsOptions = {
     tabsListView?: ExtensionNodeSpec['view'];
     tabPanelView?: ExtensionNodeSpec['view'];
     tabsView?: ExtensionNodeSpec['view'];
+    vtabView?: ExtensionNodeSpec['view'];
+    vtabInputView?: ExtensionNodeSpec['view'];
 };
 export declare const YfmTabsSpecs: ExtensionAuto<YfmTabsSpecsOptions>;

package/build/cjs/extensions/yfm/YfmTabs/YfmTabsSpecs/index.js

@@ -6,6 +6,7 @@ const log_1 = tslib_1.__importDefault(require("@diplodoc/transform/lib/log"));
 const tabs_1 = tslib_1.__importDefault(require("@diplodoc/transform/lib/plugins/tabs"));
 const schema_1 = require("../../../../utils/schema");
 const const_1 = require("./const");
+const md_plugin_1 = require("./md-plugin");
 const parser_1 = require("./parser");
 const schema_2 = require("./schema");
 const serializer_1 = require("./serializer");
@@ -18,7 +19,7 @@ exports.tabsListType = (0, schema_1.nodeTypeFactory)(const_1.TabsNode.TabsList);
 const YfmTabsSpecs = (builder, opts) => {
     const schemaSpecs = (0, schema_2.getSchemaSpecs)(opts);
     builder
-        .configureMd((md) => md.use(tabs_1.default, { log: log_1.default }))
+        .configureMd((md) => md.use(tabs_1.default, { log: log_1.default }).use(md_plugin_1.tabsPostPlugin))
         .addNode(const_1.TabsNode.Tab, () => ({
         spec: schemaSpecs[const_1.TabsNode.Tab],
         toMd: serializer_1.serializerTokens[const_1.TabsNode.Tab],
@@ -55,5 +56,40 @@ const YfmTabsSpecs = (builder, opts) => {
         },
         view: opts.tabsView,
     }));
+    builder
+        .addNode(const_1.TabsNode.RadioTabs, () => ({
+        spec: schemaSpecs[const_1.TabsNode.RadioTabs],
+        toMd: serializer_1.serializerTokens[const_1.TabsNode.RadioTabs],
+        fromMd: {
+            tokenSpec: parser_1.parserTokens[const_1.TabsNode.RadioTabs],
+            tokenName: 'r-tabs',
+        },
+    }))
+        .addNode(const_1.TabsNode.RadioTab, () => ({
+        spec: schemaSpecs[const_1.TabsNode.RadioTab],
+        toMd: serializer_1.serializerTokens[const_1.TabsNode.RadioTab],
+        fromMd: {
+            tokenSpec: parser_1.parserTokens[const_1.TabsNode.RadioTab],
+            tokenName: 'r-tab',
+        },
+        view: opts.vtabView,
+    }))
+        .addNode(const_1.TabsNode.RadioTabInput, () => ({
+        spec: schemaSpecs[const_1.TabsNode.RadioTabInput],
+        toMd: serializer_1.serializerTokens[const_1.TabsNode.RadioTabInput],
+        fromMd: {
+            tokenSpec: parser_1.parserTokens[const_1.TabsNode.RadioTabInput],
+            tokenName: 'r-tab-input',
+        },
+        view: opts.vtabInputView,
+    }))
+        .addNode(const_1.TabsNode.RadioTabLabel, () => ({
+        spec: schemaSpecs[const_1.TabsNode.RadioTabLabel],
+        toMd: serializer_1.serializerTokens[const_1.TabsNode.RadioTabLabel],
+        fromMd: {
+            tokenSpec: parser_1.parserTokens[const_1.TabsNode.RadioTabLabel],
+            tokenName: 'r-tab-label',
+        },
+    }));
 };
 exports.YfmTabsSpecs = YfmTabsSpecs;

package/build/cjs/extensions/yfm/YfmTabs/YfmTabsSpecs/md-plugin.d.ts

@@ -0,0 +1,2 @@
+import type MarkdownIt from 'markdown-it';
+export declare const tabsPostPlugin: MarkdownIt.PluginSimple;

package/build/cjs/extensions/yfm/YfmTabs/YfmTabsSpecs/md-plugin.js

@@ -0,0 +1,79 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.tabsPostPlugin = void 0;
+const prefix = 'r-';
+// prefix is added to token types of radio tabs tokens in order to use other nodes in prosemirror
+const tabsPostPlugin = (md) => {
+    md.core.ruler.push('me_tabs_after', (state) => {
+        var _a;
+        const stack = [];
+        const tabCloseIndexes = [];
+        for (const token of state.tokens) {
+            switch (token.type) {
+                case 'tabs_open': {
+                    const vertical = (_a = token.attrGet('class')) === null || _a === void 0 ? void 0 : _a.includes('yfm-tabs-vertical');
+                    stack.push({ vertical });
+                    if (vertical)
+                        token.type = prefix + token.type;
+                    break;
+                }
+                case 'tabs_close': {
+                    const item = stack.pop();
+                    if (item === null || item === void 0 ? void 0 : item.vertical)
+                        token.type = prefix + token.type;
+                    break;
+                }
+                case 'tab_open': {
+                    const item = stack.at(-1);
+                    if (item === null || item === void 0 ? void 0 : item.vertical) {
+                        // --> TODO: remove after updating to tabs-extension v^3.4.0
+                        const isInput = token.tag === 'input';
+                        if (isInput)
+                            token.type = 'tab-input';
+                        // <--
+                        token.type = prefix + token.type;
+                    }
+                    break;
+                }
+                case 'tab_close': {
+                    const item = stack.at(-1);
+                    if (item === null || item === void 0 ? void 0 : item.vertical) {
+                        token.type = prefix + token.type;
+                        // --> TODO: remove after updating to tabs-extension v^3.4.0
+                        tabCloseIndexes.push(state.tokens.indexOf(token));
+                        // <--
+                    }
+                    break;
+                }
+                case 'tab-input':
+                case 'tab-label_open':
+                case 'tab-label_close': {
+                    const item = stack.at(-1);
+                    if (item === null || item === void 0 ? void 0 : item.vertical) {
+                        token.type = prefix + token.type;
+                    }
+                    break;
+                }
+                // --> TODO: remove after updating to tabs-extension v^3.4.0
+                case 'label_open': {
+                    const tokenIndex = state.tokens.indexOf(token);
+                    const prevToken = tokenIndex > 0 && state.tokens.at(tokenIndex - 1);
+                    if (prevToken && prevToken.type === 'r-tab-input') {
+                        token.type = prefix + 'tab-' + token.type;
+                    }
+                    break;
+                }
+                // <--
+            }
+        }
+        // --> TODO: remove after updating to tabs-extension v^3.4.0
+        for (const index of tabCloseIndexes.reverse()) {
+            if (index === -1)
+                continue;
+            const labelCloseToken = new state.Token(prefix + 'tab-label_close', 'label', -1);
+            state.tokens.splice(index, 0, labelCloseToken);
+        }
+        // <--
+    });
+};
+exports.tabsPostPlugin = tabsPostPlugin;

package/build/cjs/extensions/yfm/YfmTabs/YfmTabsSpecs/parser.js

@@ -4,13 +4,13 @@ exports.parserTokens = void 0;
 const const_1 = require("./const");
 const attrsFromEntries = (token) => (token.attrs ? Object.fromEntries(token.attrs) : {});
 exports.parserTokens = {
-    [const_1.TabsNode.Tab]: {
-        name: const_1.TabsNode.Tab,
+    [const_1.TabsNode.TabPanel]: {
+        name: const_1.TabsNode.TabPanel,
         type: 'block',
         getAttrs: attrsFromEntries,
     },
-    [const_1.TabsNode.TabPanel]: {
-        name: const_1.TabsNode.TabPanel,
+    [const_1.TabsNode.Tab]: {
+        name: const_1.TabsNode.Tab,
         type: 'block',
         getAttrs: attrsFromEntries,
     },
@@ -24,4 +24,24 @@ exports.parserTokens = {
         type: 'block',
         getAttrs: attrsFromEntries,
     },
+    [const_1.TabsNode.RadioTabs]: {
+        name: const_1.TabsNode.RadioTabs,
+        type: 'block',
+        getAttrs: attrsFromEntries,
+    },
+    [const_1.TabsNode.RadioTab]: {
+        name: const_1.TabsNode.RadioTab,
+        type: 'block',
+        getAttrs: attrsFromEntries,
+    },
+    [const_1.TabsNode.RadioTabInput]: {
+        name: const_1.TabsNode.RadioTabInput,
+        type: 'node',
+        getAttrs: attrsFromEntries,
+    },
+    [const_1.TabsNode.RadioTabLabel]: {
+        name: const_1.TabsNode.RadioTabLabel,
+        type: 'block',
+        getAttrs: attrsFromEntries,
+    },
 };

package/build/cjs/extensions/yfm/YfmTabs/YfmTabsSpecs/schema.js

@@ -4,9 +4,10 @@ exports.getSchemaSpecs = void 0;
 const const_1 = require("./const");
 const DEFAULT_PLACEHOLDERS = {
     TabTitle: 'Tab title',
+    RadioTabLabelTitle: 'Radio title',
 };
 const getSchemaSpecs = (opts, placeholder) => {
-    var _a, _b;
+    var _a, _b, _c;
     return ({
         [const_1.TabsNode.Tab]: {
             attrs: {
@@ -82,6 +83,70 @@ const getSchemaSpecs = (opts, placeholder) => {
             allowSelection: false,
             complex: 'inner',
         },
+        [const_1.TabsNode.RadioTabs]: {
+            attrs: {
+                [const_1.TabsAttrs.class]: { default: 'yfm-tabs yfm-tabs-vertical' },
+                [const_1.TabsAttrs.dataDiplodocGroup]: { default: 'unknown' },
+            },
+            content: `(${const_1.TabsNode.RadioTab} ${const_1.TabsNode.TabPanel})+`,
+            group: 'block',
+            toDOM(node) {
+                return ['div', node.attrs, 0];
+            },
+            complex: 'root',
+        },
+        [const_1.TabsNode.RadioTab]: {
+            attrs: {
+                [const_1.TabAttrs.id]: { default: null },
+                [const_1.TabAttrs.class]: { default: 'yfm-tab yfm-vertical-tab' },
+                [const_1.TabAttrs.role]: { default: 'unknown' },
+                [const_1.TabAttrs.ariaControls]: { default: 'unknown' },
+                [const_1.TabAttrs.ariaSelected]: { default: 'unknown' },
+                [const_1.TabAttrs.tabindex]: { default: 'unknown' },
+                [const_1.TabAttrs.dataDiplodocKey]: { default: 'unknown' },
+                [const_1.TabAttrs.dataDiplodocid]: { default: 'unknown' },
+                [const_1.TabAttrs.dataDiplodocIsActive]: { default: 'false' },
+                [const_1.TabAttrs.dataDiplodocVerticalTab]: { default: 'true' },
+            },
+            content: `${const_1.TabsNode.RadioTabInput} ${const_1.TabsNode.RadioTabLabel}`,
+            group: 'block',
+            toDOM(node) {
+                return ['div', node.attrs, 0];
+            },
+            selectable: false,
+            allowSelection: false,
+            complex: 'inner',
+        },
+        [const_1.TabsNode.RadioTabInput]: {
+            attrs: {
+                [const_1.TabAttrs.class]: { default: 'radio' },
+                type: { default: 'radio' },
+                checked: { default: null },
+            },
+            group: 'block',
+            toDOM(node) {
+                return ['input', node.attrs];
+            },
+            selectable: false,
+            allowSelection: false,
+            complex: 'leaf',
+        },
+        [const_1.TabsNode.RadioTabLabel]: {
+            attrs: {},
+            marks: '',
+            content: 'text*',
+            group: 'block',
+            toDOM(node) {
+                return ['label', node.attrs, 0];
+            },
+            placeholder: {
+                content: (_c = placeholder === null || placeholder === void 0 ? void 0 : placeholder[const_1.TabsNode.RadioTab]) !== null && _c !== void 0 ? _c : DEFAULT_PLACEHOLDERS.RadioTabLabelTitle,
+                alwaysVisible: true,
+            },
+            selectable: false,
+            allowSelection: false,
+            complex: 'leaf',
+        },
     });
 };
 exports.getSchemaSpecs = getSchemaSpecs;

package/build/cjs/extensions/yfm/YfmTabs/YfmTabsSpecs/serializer.js

@@ -1,6 +1,7 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.serializerTokens = void 0;
+const nodes_1 = require("../../../../utils/nodes");
 const placeholder_1 = require("../../../../utils/placeholder");
 const const_1 = require("./const");
 exports.serializerTokens = {
@@ -32,4 +33,31 @@ exports.serializerTokens = {
     [const_1.TabsNode.TabsList]: (state, node) => {
         state.renderList(node, '  ', () => (node.attrs.bullet || '-') + ' ');
     },
+    [const_1.TabsNode.RadioTabs]: (state, node) => {
+        state.write('{% list tabs radio %}');
+        state.write('\n');
+        state.write('\n');
+        const children = (0, nodes_1.getChildrenOfNode)(node);
+        for (let i = 0; i < children.length; i++) {
+            const child = children[i];
+            if (child.node.type.name !== const_1.TabsNode.RadioTab)
+                continue;
+            state.write('- ' + (child.node.textContent || (0, placeholder_1.getPlaceholderContent)(child.node.lastChild)));
+            state.write('\n');
+            state.write('\n');
+            const nextChild = children[i + 1];
+            if (nextChild.node.type.name !== const_1.TabsNode.TabPanel)
+                continue;
+            state.renderList(nextChild.node, '  ', () => '  ');
+        }
+        state.write('{% endlist %}');
+        state.closeBlock(node);
+    },
+    [const_1.TabsNode.RadioTab]: (state, node) => {
+        state.renderInline(node);
+    },
+    [const_1.TabsNode.RadioTabInput]: () => { },
+    [const_1.TabsNode.RadioTabLabel]: (state, node) => {
+        state.renderInline(node);
+    },
 };

package/build/cjs/extensions/yfm/YfmTabs/index.js

@@ -17,6 +17,8 @@ const YfmTabs = (builder) => {
     builder.use(YfmTabsSpecs_1.YfmTabsSpecs, {
         tabView: () => views_1.tabView,
         tabPanelView: () => views_1.tabPanelView,
+        vtabView: () => views_1.vtabView,
+        vtabInputView: () => views_1.vtabInputView,
     });
     builder.addKeymap(() => ({
         Backspace: (0, prosemirror_commands_1.chainCommands)(plugins_1.removeTabWhenCursorAtTheStartOfTab, plugins_1.joinBackwardToOpenTab),

package/build/cjs/extensions/yfm/YfmTabs/views.d.ts

@@ -1,3 +1,5 @@
 import { NodeViewConstructor } from 'prosemirror-view';
 export declare const tabView: NodeViewConstructor;
 export declare const tabPanelView: NodeViewConstructor;
+export declare const vtabView: NodeViewConstructor;
+export declare const vtabInputView: NodeViewConstructor;

package/build/cjs/extensions/yfm/YfmTabs/views.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.tabPanelView = exports.tabView = void 0;
+exports.vtabInputView = exports.vtabView = exports.tabPanelView = exports.tabView = void 0;
 const prosemirror_utils_1 = require("prosemirror-utils");
 const classname_1 = require("../../../classname");
 const icons_1 = require("./icons");
@@ -12,7 +12,7 @@ const ignoreMutation = (node, view, getPos) => (mutation) => {
         mutation.type === 'attributes' &&
         mutation.attributeName) {
         const newAttr = mutation.target.getAttribute(mutation.attributeName);
-        view.dispatch(view.state.tr.setNodeMarkup(getPos(), null, Object.assign(Object.assign({}, node.attrs), { [mutation.attributeName]: String(newAttr) })));
+        view.dispatch(view.state.tr.setNodeMarkup(getPos(), null, Object.assign(Object.assign({}, node.attrs), { [mutation.attributeName]: newAttr })));
         return true;
     }
     return false;
@@ -74,7 +74,19 @@ const tabView = (node, view, getPos) => {
 exports.tabView = tabView;
 // @ts-expect-error
 const tabPanelView = (node, view, getPos) => ({
-    // FIX: ignore mutation and don't rerender node when yfm.js switch tab
+    // FIXME: ignore mutation and don't rerender node when yfm.js switch tab
     ignoreMutation: ignoreMutation(node, view, getPos),
 });
 exports.tabPanelView = tabPanelView;
+// @ts-expect-error
+const vtabView = (node, view, getPos) => ({
+    // FIXME: ignore mutation and don't rerender node when yfm.js switch tab
+    ignoreMutation: ignoreMutation(node, view, getPos),
+});
+exports.vtabView = vtabView;
+// @ts-expect-error
+const vtabInputView = (node, view, getPos) => ({
+    // FIXME: ignore mutation and don't rerender node when yfm.js switch tab
+    ignoreMutation: ignoreMutation(node, view, getPos),
+});
+exports.vtabInputView = vtabInputView;

package/build/cjs/markup/codemirror/create.d.ts

@@ -1,6 +1,6 @@
 import { autocompletion } from '@codemirror/autocomplete';
 import type { Extension, StateCommand } from '@codemirror/state';
-import { EditorView, EditorViewConfig, KeyBinding } from '@codemirror/view';
+import { EditorView, EditorViewConfig, KeyBinding, placeholder } from '@codemirror/view';
 import { EventMap } from '../../bundle/Editor';
 import { ReactRenderStorage } from '../../extensions';
 import { Receiver } from '../../utils';
@@ -10,7 +10,7 @@ export type { YfmLangOptions };
 declare type Autocompletion = Parameters<typeof autocompletion>[0];
 export declare type CreateCodemirrorParams = {
     doc: EditorViewConfig['doc'];
-    placeholderText: string;
+    placeholder: Parameters<typeof placeholder>[0];
     onCancel: () => void;
     onSubmit: () => void;
     onChange: () => void;

package/build/cjs/markup/codemirror/create.js

@@ -16,8 +16,8 @@ const react_facet_1 = require("./react-facet");
 const plugin_1 = require("./search-plugin/plugin");
 const yfm_1 = require("./yfm");
 function createCodemirror(params) {
-    const { doc, placeholderText, reactRenderer, onCancel, onScroll, onSubmit, onChange, onDocChange, extensions: extraExtensions, disabledExtensions = {}, keymaps = [], receiver, yfmLangOptions, autocompletion: autocompletionConfig, } = params;
-    const extensions = [gravity_1.gravityTheme, (0, view_1.placeholder)(placeholderText)];
+    const { doc, reactRenderer, onCancel, onScroll, onSubmit, onChange, onDocChange, disabledExtensions = {}, keymaps = [], receiver, yfmLangOptions, extensions: extraExtensions, placeholder: placeholderContent, autocompletion: autocompletionConfig, } = params;
+    const extensions = [gravity_1.gravityTheme, (0, view_1.placeholder)(placeholderContent)];
     if (!disabledExtensions.history) {
         extensions.push((0, commands_1.history)());
     }

package/build/cjs/version.js

@@ -2,4 +2,4 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.VERSION = void 0;
 /** During build process, the current version will be injected here */
-exports.VERSION = typeof '13.18.2' !== 'undefined' ? '13.18.2' : 'unknown';
+exports.VERSION = typeof '13.20.0' !== 'undefined' ? '13.20.0' : 'unknown';

package/build/esm/bundle/Editor.d.ts

@@ -57,6 +57,8 @@ export declare type MarkupConfig = {
     disabledExtensions?: CreateCodemirrorParams['disabledExtensions'];
     /** Additional keymaps for codemirror instance */
     keymaps?: CreateCodemirrorParams['keymaps'];
+    /** Overrides the default placeholder content. */
+    placeholder?: CreateCodemirrorParams['placeholder'];
     /**
      * Additional language data for markdown language in codemirror.
      * Can be used to configure additional autocompletions and others.

package/build/esm/bundle/Editor.js

@@ -147,10 +147,11 @@ export class EditorImpl extends SafeEventEmitter {
         return __classPrivateFieldGet(this, _EditorImpl_wysiwygEditor, "f");
     }
     get markupEditor() {
+        var _a;
         if (!__classPrivateFieldGet(this, _EditorImpl_markupEditor, "f")) {
             __classPrivateFieldSet(this, _EditorImpl_markupEditor, new MarkupEditor(createCodemirror({
                 doc: __classPrivateFieldGet(this, _EditorImpl_markup, "f"),
-                placeholderText: i18n('markup_placeholder'),
+                placeholder: (_a = __classPrivateFieldGet(this, _EditorImpl_markupConfig, "f").placeholder) !== null && _a !== void 0 ? _a : i18n('markup_placeholder'),
                 onCancel: () => this.emit('cancel', null),
                 onSubmit: () => this.emit('submit', null),
                 onChange: () => this.emit('rerender-toolbar', null),

package/build/esm/core/markdown/MarkdownSerializer.js

@@ -191,15 +191,19 @@ export class MarkdownSerializerState {
         let trailing = '';
         const progress = (node, _, index) => {
             let marks = node ? node.marks : [];
-            // Remove marks from breaks (hard_break or soft_break) that are the last node inside
+            // Remove marks from breaks (hard_break or soft_break) that are the edge node inside
             // that mark to prevent parser edge cases with new lines just
-            // before closing marks.
+            // before closing or after opening marks.
             if (node && node.type.spec.isBreak) {
                 marks = marks.filter(m => {
+                    if (index === 0)
+                        return false;
                     if (index + 1 == parent.childCount)
                         return false;
+                    const prev = parent.child(index - 1);
                     const next = parent.child(index + 1);
-                    return m.isInSet(next.marks) && (!next.isText || /\S/.test(next.text));
+                    return ((m.isInSet(prev.marks) && (!prev.isText || /\S/.test(prev.text))) &&
+                        (m.isInSet(next.marks) && (!next.isText || /\S/.test(next.text))));
                 });
             }
             let leading = trailing;

package/build/esm/extensions/yfm/YfmTable/YfmTableSpecs/serializer.js

@@ -63,10 +63,23 @@ export const serializerTokens = {
             state.ensureNewLine();
         });
     },
-    [YfmTableNode.Row]: (_state, node) => {
-        throw new Error(`Should not serialize ${node.type.name} node via serialize-token`);
+    [YfmTableNode.Row]: (state, node) => {
+        console.warn(`Should not serialize ${node.type.name} node via serialize-token`);
+        state.write('||');
+        state.ensureNewLine();
+        state.write('\n');
+        state.renderContent(node);
+        state.write('||');
+        state.ensureNewLine();
     },
-    [YfmTableNode.Cell]: (_state, node) => {
-        throw new Error(`Should not serialize ${node.type.name} node via serialize-token`);
+    [YfmTableNode.Cell]: (state, node, parent) => {
+        console.warn(`Should not serialize ${node.type.name} node via serialize-token`);
+        state.renderContent(node);
+        const isLastCellInRow = parent.lastChild === node;
+        if (!isLastCellInRow) {
+            state.write('|');
+            state.ensureNewLine();
+            state.write('\n');
+        }
     },
 };

package/build/esm/extensions/yfm/YfmTabs/YfmTabsSpecs/const.d.ts

@@ -1,8 +1,12 @@
 export declare enum TabsNode {
+    TabPanel = "yfm_tab_panel",
     Tab = "yfm_tab",
     TabsList = "yfm_tabs_list",
-    TabPanel = "yfm_tab_panel",
-    Tabs = "yfm_tabs"
+    Tabs = "yfm_tabs",
+    RadioTabs = "yfm_radio_tabs",
+    RadioTab = "yfm_radio_tab",
+    RadioTabInput = "yfm_radio_tab_input",
+    RadioTabLabel = "yfm_radio_tab_label"
 }
 export declare enum TabsAttrs {
     class = "class",
@@ -21,7 +25,8 @@ export declare enum TabAttrs {
     tabindex = "tabindex",
     dataDiplodocKey = "data-diplodoc-key",
     dataDiplodocid = "data-diplodoc-id",
-    dataDiplodocIsActive = "data-diplodoc-is-active"
+    dataDiplodocIsActive = "data-diplodoc-is-active",
+    dataDiplodocVerticalTab = "data-diplodoc-vertical-tab"
 }
 export declare enum TabPanelAttrs {
     id = "id",

package/build/esm/extensions/yfm/YfmTabs/YfmTabsSpecs/const.js

@@ -1,9 +1,14 @@
 export var TabsNode;
 (function (TabsNode) {
+    // tabs panel is common for tabs and radio tabs
+    TabsNode["TabPanel"] = "yfm_tab_panel";
     TabsNode["Tab"] = "yfm_tab";
     TabsNode["TabsList"] = "yfm_tabs_list";
-    TabsNode["TabPanel"] = "yfm_tab_panel";
     TabsNode["Tabs"] = "yfm_tabs";
+    TabsNode["RadioTabs"] = "yfm_radio_tabs";
+    TabsNode["RadioTab"] = "yfm_radio_tab";
+    TabsNode["RadioTabInput"] = "yfm_radio_tab_input";
+    TabsNode["RadioTabLabel"] = "yfm_radio_tab_label";
 })(TabsNode || (TabsNode = {}));
 export var TabsAttrs;
 (function (TabsAttrs) {
@@ -26,6 +31,7 @@ export var TabAttrs;
     TabAttrs["dataDiplodocKey"] = "data-diplodoc-key";
     TabAttrs["dataDiplodocid"] = "data-diplodoc-id";
     TabAttrs["dataDiplodocIsActive"] = "data-diplodoc-is-active";
+    TabAttrs["dataDiplodocVerticalTab"] = "data-diplodoc-vertical-tab";
 })(TabAttrs || (TabAttrs = {}));
 export var TabPanelAttrs;
 (function (TabPanelAttrs) {

package/build/esm/extensions/yfm/YfmTabs/YfmTabsSpecs/index.d.ts

@@ -14,5 +14,7 @@ export declare type YfmTabsSpecsOptions = {
     tabsListView?: ExtensionNodeSpec['view'];
     tabPanelView?: ExtensionNodeSpec['view'];
     tabsView?: ExtensionNodeSpec['view'];
+    vtabView?: ExtensionNodeSpec['view'];
+    vtabInputView?: ExtensionNodeSpec['view'];
 };
 export declare const YfmTabsSpecs: ExtensionAuto<YfmTabsSpecsOptions>;

package/build/esm/extensions/yfm/YfmTabs/YfmTabsSpecs/index.js

@@ -2,6 +2,7 @@ import log from '@diplodoc/transform/lib/log';
 import yfmPlugin from '@diplodoc/transform/lib/plugins/tabs';
 import { nodeTypeFactory } from '../../../../utils/schema';
 import { TabsNode } from './const';
+import { tabsPostPlugin } from './md-plugin';
 import { parserTokens } from './parser';
 import { getSchemaSpecs } from './schema';
 import { serializerTokens } from './serializer';
@@ -13,7 +14,7 @@ export const tabsListType = nodeTypeFactory(TabsNode.TabsList);
 export const YfmTabsSpecs = (builder, opts) => {
     const schemaSpecs = getSchemaSpecs(opts);
     builder
-        .configureMd((md) => md.use(yfmPlugin, { log }))
+        .configureMd((md) => md.use(yfmPlugin, { log }).use(tabsPostPlugin))
         .addNode(TabsNode.Tab, () => ({
         spec: schemaSpecs[TabsNode.Tab],
         toMd: serializerTokens[TabsNode.Tab],
@@ -50,4 +51,39 @@ export const YfmTabsSpecs = (builder, opts) => {
         },
         view: opts.tabsView,
     }));
+    builder
+        .addNode(TabsNode.RadioTabs, () => ({
+        spec: schemaSpecs[TabsNode.RadioTabs],
+        toMd: serializerTokens[TabsNode.RadioTabs],
+        fromMd: {
+            tokenSpec: parserTokens[TabsNode.RadioTabs],
+            tokenName: 'r-tabs',
+        },
+    }))
+        .addNode(TabsNode.RadioTab, () => ({
+        spec: schemaSpecs[TabsNode.RadioTab],
+        toMd: serializerTokens[TabsNode.RadioTab],
+        fromMd: {
+            tokenSpec: parserTokens[TabsNode.RadioTab],
+            tokenName: 'r-tab',
+        },
+        view: opts.vtabView,
+    }))
+        .addNode(TabsNode.RadioTabInput, () => ({
+        spec: schemaSpecs[TabsNode.RadioTabInput],
+        toMd: serializerTokens[TabsNode.RadioTabInput],
+        fromMd: {
+            tokenSpec: parserTokens[TabsNode.RadioTabInput],
+            tokenName: 'r-tab-input',
+        },
+        view: opts.vtabInputView,
+    }))
+        .addNode(TabsNode.RadioTabLabel, () => ({
+        spec: schemaSpecs[TabsNode.RadioTabLabel],
+        toMd: serializerTokens[TabsNode.RadioTabLabel],
+        fromMd: {
+            tokenSpec: parserTokens[TabsNode.RadioTabLabel],
+            tokenName: 'r-tab-label',
+        },
+    }));
 };

package/build/esm/extensions/yfm/YfmTabs/YfmTabsSpecs/md-plugin.d.ts

@@ -0,0 +1,2 @@
+import type MarkdownIt from 'markdown-it';
+export declare const tabsPostPlugin: MarkdownIt.PluginSimple;

package/build/esm/extensions/yfm/YfmTabs/YfmTabsSpecs/md-plugin.js

@@ -0,0 +1,75 @@
+const prefix = 'r-';
+// prefix is added to token types of radio tabs tokens in order to use other nodes in prosemirror
+export const tabsPostPlugin = (md) => {
+    md.core.ruler.push('me_tabs_after', (state) => {
+        var _a;
+        const stack = [];
+        const tabCloseIndexes = [];
+        for (const token of state.tokens) {
+            switch (token.type) {
+                case 'tabs_open': {
+                    const vertical = (_a = token.attrGet('class')) === null || _a === void 0 ? void 0 : _a.includes('yfm-tabs-vertical');
+                    stack.push({ vertical });
+                    if (vertical)
+                        token.type = prefix + token.type;
+                    break;
+                }
+                case 'tabs_close': {
+                    const item = stack.pop();
+                    if (item === null || item === void 0 ? void 0 : item.vertical)
+                        token.type = prefix + token.type;
+                    break;
+                }
+                case 'tab_open': {
+                    const item = stack.at(-1);
+                    if (item === null || item === void 0 ? void 0 : item.vertical) {
+                        // --> TODO: remove after updating to tabs-extension v^3.4.0
+                        const isInput = token.tag === 'input';
+                        if (isInput)
+                            token.type = 'tab-input';
+                        // <--
+                        token.type = prefix + token.type;
+                    }
+                    break;
+                }
+                case 'tab_close': {
+                    const item = stack.at(-1);
+                    if (item === null || item === void 0 ? void 0 : item.vertical) {
+                        token.type = prefix + token.type;
+                        // --> TODO: remove after updating to tabs-extension v^3.4.0
+                        tabCloseIndexes.push(state.tokens.indexOf(token));
+                        // <--
+                    }
+                    break;
+                }
+                case 'tab-input':
+                case 'tab-label_open':
+                case 'tab-label_close': {
+                    const item = stack.at(-1);
+                    if (item === null || item === void 0 ? void 0 : item.vertical) {
+                        token.type = prefix + token.type;
+                    }
+                    break;
+                }
+                // --> TODO: remove after updating to tabs-extension v^3.4.0
+                case 'label_open': {
+                    const tokenIndex = state.tokens.indexOf(token);
+                    const prevToken = tokenIndex > 0 && state.tokens.at(tokenIndex - 1);
+                    if (prevToken && prevToken.type === 'r-tab-input') {
+                        token.type = prefix + 'tab-' + token.type;
+                    }
+                    break;
+                }
+                // <--
+            }
+        }
+        // --> TODO: remove after updating to tabs-extension v^3.4.0
+        for (const index of tabCloseIndexes.reverse()) {
+            if (index === -1)
+                continue;
+            const labelCloseToken = new state.Token(prefix + 'tab-label_close', 'label', -1);
+            state.tokens.splice(index, 0, labelCloseToken);
+        }
+        // <--
+    });
+};

package/build/esm/extensions/yfm/YfmTabs/YfmTabsSpecs/parser.js

@@ -1,13 +1,13 @@
 import { TabsNode } from './const';
 const attrsFromEntries = (token) => (token.attrs ? Object.fromEntries(token.attrs) : {});
 export const parserTokens = {
-    [TabsNode.Tab]: {
-        name: TabsNode.Tab,
+    [TabsNode.TabPanel]: {
+        name: TabsNode.TabPanel,
         type: 'block',
         getAttrs: attrsFromEntries,
     },
-    [TabsNode.TabPanel]: {
-        name: TabsNode.TabPanel,
+    [TabsNode.Tab]: {
+        name: TabsNode.Tab,
         type: 'block',
         getAttrs: attrsFromEntries,
     },
@@ -21,4 +21,24 @@ export const parserTokens = {
         type: 'block',
         getAttrs: attrsFromEntries,
     },
+    [TabsNode.RadioTabs]: {
+        name: TabsNode.RadioTabs,
+        type: 'block',
+        getAttrs: attrsFromEntries,
+    },
+    [TabsNode.RadioTab]: {
+        name: TabsNode.RadioTab,
+        type: 'block',
+        getAttrs: attrsFromEntries,
+    },
+    [TabsNode.RadioTabInput]: {
+        name: TabsNode.RadioTabInput,
+        type: 'node',
+        getAttrs: attrsFromEntries,
+    },
+    [TabsNode.RadioTabLabel]: {
+        name: TabsNode.RadioTabLabel,
+        type: 'block',
+        getAttrs: attrsFromEntries,
+    },
 };

package/build/esm/extensions/yfm/YfmTabs/YfmTabsSpecs/schema.js

@@ -1,9 +1,10 @@
 import { TabAttrs, TabPanelAttrs, TabsAttrs, TabsListAttrs, TabsNode } from './const';
 const DEFAULT_PLACEHOLDERS = {
     TabTitle: 'Tab title',
+    RadioTabLabelTitle: 'Radio title',
 };
 export const getSchemaSpecs = (opts, placeholder) => {
-    var _a, _b;
+    var _a, _b, _c;
     return ({
         [TabsNode.Tab]: {
             attrs: {
@@ -79,5 +80,69 @@ export const getSchemaSpecs = (opts, placeholder) => {
             allowSelection: false,
             complex: 'inner',
         },
+        [TabsNode.RadioTabs]: {
+            attrs: {
+                [TabsAttrs.class]: { default: 'yfm-tabs yfm-tabs-vertical' },
+                [TabsAttrs.dataDiplodocGroup]: { default: 'unknown' },
+            },
+            content: `(${TabsNode.RadioTab} ${TabsNode.TabPanel})+`,
+            group: 'block',
+            toDOM(node) {
+                return ['div', node.attrs, 0];
+            },
+            complex: 'root',
+        },
+        [TabsNode.RadioTab]: {
+            attrs: {
+                [TabAttrs.id]: { default: null },
+                [TabAttrs.class]: { default: 'yfm-tab yfm-vertical-tab' },
+                [TabAttrs.role]: { default: 'unknown' },
+                [TabAttrs.ariaControls]: { default: 'unknown' },
+                [TabAttrs.ariaSelected]: { default: 'unknown' },
+                [TabAttrs.tabindex]: { default: 'unknown' },
+                [TabAttrs.dataDiplodocKey]: { default: 'unknown' },
+                [TabAttrs.dataDiplodocid]: { default: 'unknown' },
+                [TabAttrs.dataDiplodocIsActive]: { default: 'false' },
+                [TabAttrs.dataDiplodocVerticalTab]: { default: 'true' },
+            },
+            content: `${TabsNode.RadioTabInput} ${TabsNode.RadioTabLabel}`,
+            group: 'block',
+            toDOM(node) {
+                return ['div', node.attrs, 0];
+            },
+            selectable: false,
+            allowSelection: false,
+            complex: 'inner',
+        },
+        [TabsNode.RadioTabInput]: {
+            attrs: {
+                [TabAttrs.class]: { default: 'radio' },
+                type: { default: 'radio' },
+                checked: { default: null },
+            },
+            group: 'block',
+            toDOM(node) {
+                return ['input', node.attrs];
+            },
+            selectable: false,
+            allowSelection: false,
+            complex: 'leaf',
+        },
+        [TabsNode.RadioTabLabel]: {
+            attrs: {},
+            marks: '',
+            content: 'text*',
+            group: 'block',
+            toDOM(node) {
+                return ['label', node.attrs, 0];
+            },
+            placeholder: {
+                content: (_c = placeholder === null || placeholder === void 0 ? void 0 : placeholder[TabsNode.RadioTab]) !== null && _c !== void 0 ? _c : DEFAULT_PLACEHOLDERS.RadioTabLabelTitle,
+                alwaysVisible: true,
+            },
+            selectable: false,
+            allowSelection: false,
+            complex: 'leaf',
+        },
     });
 };

package/build/esm/extensions/yfm/YfmTabs/YfmTabsSpecs/serializer.js

@@ -1,3 +1,4 @@
+import { getChildrenOfNode } from '../../../../utils/nodes';
 import { getPlaceholderContent } from '../../../../utils/placeholder';
 import { TabsNode } from './const';
 export const serializerTokens = {
@@ -29,4 +30,31 @@ export const serializerTokens = {
     [TabsNode.TabsList]: (state, node) => {
         state.renderList(node, '  ', () => (node.attrs.bullet || '-') + ' ');
     },
+    [TabsNode.RadioTabs]: (state, node) => {
+        state.write('{% list tabs radio %}');
+        state.write('\n');
+        state.write('\n');
+        const children = getChildrenOfNode(node);
+        for (let i = 0; i < children.length; i++) {
+            const child = children[i];
+            if (child.node.type.name !== TabsNode.RadioTab)
+                continue;
+            state.write('- ' + (child.node.textContent || getPlaceholderContent(child.node.lastChild)));
+            state.write('\n');
+            state.write('\n');
+            const nextChild = children[i + 1];
+            if (nextChild.node.type.name !== TabsNode.TabPanel)
+                continue;
+            state.renderList(nextChild.node, '  ', () => '  ');
+        }
+        state.write('{% endlist %}');
+        state.closeBlock(node);
+    },
+    [TabsNode.RadioTab]: (state, node) => {
+        state.renderInline(node);
+    },
+    [TabsNode.RadioTabInput]: () => { },
+    [TabsNode.RadioTabLabel]: (state, node) => {
+        state.renderInline(node);
+    },
 };

package/build/esm/extensions/yfm/YfmTabs/index.js

@@ -2,13 +2,15 @@ import { chainCommands } from 'prosemirror-commands';
 import { YfmTabsSpecs } from './YfmTabsSpecs';
 import { createYfmTabs } from './actions';
 import { dragAutoSwitch, joinBackwardToOpenTab, liftEmptyBlockFromTabPanel, removeTabWhenCursorAtTheStartOfTab, tabEnter, tabPanelArrowDown, } from './plugins';
-import { tabPanelView, tabView } from './views';
+import { tabPanelView, tabView, vtabInputView, vtabView } from './views';
 export { TabsNode, tabType, tabsType, tabsListType, tabPanelType } from './YfmTabsSpecs';
 const actionName = 'toYfmTabs';
 export const YfmTabs = (builder) => {
     builder.use(YfmTabsSpecs, {
         tabView: () => tabView,
         tabPanelView: () => tabPanelView,
+        vtabView: () => vtabView,
+        vtabInputView: () => vtabInputView,
     });
     builder.addKeymap(() => ({
         Backspace: chainCommands(removeTabWhenCursorAtTheStartOfTab, joinBackwardToOpenTab),

package/build/esm/extensions/yfm/YfmTabs/views.d.ts

@@ -2,3 +2,5 @@ import { NodeViewConstructor } from 'prosemirror-view';
 import './index.css';
 export declare const tabView: NodeViewConstructor;
 export declare const tabPanelView: NodeViewConstructor;
+export declare const vtabView: NodeViewConstructor;
+export declare const vtabInputView: NodeViewConstructor;

package/build/esm/extensions/yfm/YfmTabs/views.js

@@ -10,7 +10,7 @@ const ignoreMutation = (node, view, getPos) => (mutation) => {
         mutation.type === 'attributes' &&
         mutation.attributeName) {
         const newAttr = mutation.target.getAttribute(mutation.attributeName);
-        view.dispatch(view.state.tr.setNodeMarkup(getPos(), null, Object.assign(Object.assign({}, node.attrs), { [mutation.attributeName]: String(newAttr) })));
+        view.dispatch(view.state.tr.setNodeMarkup(getPos(), null, Object.assign(Object.assign({}, node.attrs), { [mutation.attributeName]: newAttr })));
         return true;
     }
     return false;
@@ -71,6 +71,16 @@ export const tabView = (node, view, getPos) => {
 };
 // @ts-expect-error
 export const tabPanelView = (node, view, getPos) => ({
-    // FIX: ignore mutation and don't rerender node when yfm.js switch tab
+    // FIXME: ignore mutation and don't rerender node when yfm.js switch tab
+    ignoreMutation: ignoreMutation(node, view, getPos),
+});
+// @ts-expect-error
+export const vtabView = (node, view, getPos) => ({
+    // FIXME: ignore mutation and don't rerender node when yfm.js switch tab
+    ignoreMutation: ignoreMutation(node, view, getPos),
+});
+// @ts-expect-error
+export const vtabInputView = (node, view, getPos) => ({
+    // FIXME: ignore mutation and don't rerender node when yfm.js switch tab
     ignoreMutation: ignoreMutation(node, view, getPos),
 });

package/build/esm/markup/codemirror/create.d.ts

@@ -1,6 +1,6 @@
 import { autocompletion } from '@codemirror/autocomplete';
 import type { Extension, StateCommand } from '@codemirror/state';
-import { EditorView, EditorViewConfig, KeyBinding } from '@codemirror/view';
+import { EditorView, EditorViewConfig, KeyBinding, placeholder } from '@codemirror/view';
 import { EventMap } from '../../bundle/Editor';
 import { ReactRenderStorage } from '../../extensions';
 import { Receiver } from '../../utils';
@@ -10,7 +10,7 @@ export type { YfmLangOptions };
 declare type Autocompletion = Parameters<typeof autocompletion>[0];
 export declare type CreateCodemirrorParams = {
     doc: EditorViewConfig['doc'];
-    placeholderText: string;
+    placeholder: Parameters<typeof placeholder>[0];
     onCancel: () => void;
     onSubmit: () => void;
     onChange: () => void;

package/build/esm/markup/codemirror/create.js

@@ -13,8 +13,8 @@ import { ReactRendererFacet } from './react-facet';
 import { SearchPanelPlugin } from './search-plugin/plugin';
 import { yfmLang } from './yfm';
 export function createCodemirror(params) {
-    const { doc, placeholderText, reactRenderer, onCancel, onScroll, onSubmit, onChange, onDocChange, extensions: extraExtensions, disabledExtensions = {}, keymaps = [], receiver, yfmLangOptions, autocompletion: autocompletionConfig, } = params;
-    const extensions = [gravityTheme, placeholder(placeholderText)];
+    const { doc, reactRenderer, onCancel, onScroll, onSubmit, onChange, onDocChange, disabledExtensions = {}, keymaps = [], receiver, yfmLangOptions, extensions: extraExtensions, placeholder: placeholderContent, autocompletion: autocompletionConfig, } = params;
+    const extensions = [gravityTheme, placeholder(placeholderContent)];
     if (!disabledExtensions.history) {
         extensions.push(history());
     }

package/build/esm/version.js

@@ -1,2 +1,2 @@
 /** During build process, the current version will be injected here */
-export const VERSION = typeof '13.18.2' !== 'undefined' ? '13.18.2' : 'unknown';
+export const VERSION = typeof '13.20.0' !== 'undefined' ? '13.20.0' : 'unknown';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@gravity-ui/markdown-editor",
-  "version": "13.18.2",
+  "version": "13.20.0",
   "description": "Markdown wysiwyg and markup editor",
   "license": "MIT",
   "repository": {