@gravity-ui/markdown-editor 13.0.0

package/build/esm/extensions/yfm/YfmFile/YfmFileWidget/widget.js

@@ -0,0 +1,93 @@
+import React from 'react';
+import { ReactWidgetDescriptor, removeDecoration } from '../../../behavior/WidgetDecoration';
+import { normalizeUrlFactory } from '../../../markdown';
+import { YfmFilesUploadProcessBase } from '../YfmFilePaste/upload';
+import { fileType } from '../YfmFileSpecs';
+import { FilePlaceholder } from './view';
+export const addWidget = (tr, deps, uploadFiles) => {
+    return new FileWidgetDescriptor(tr.selection.from, deps, uploadFiles).applyTo(tr);
+};
+export const removeWidget = removeDecoration;
+class FileWidgetDescriptor extends ReactWidgetDescriptor {
+    constructor(initPos, deps, uploadFiles) {
+        super(initPos, 'file_placeholder');
+        this.widgetHandler = null;
+        this.uploadFiles = uploadFiles;
+        this.domElem = document.createElement('span');
+        this.deps = deps;
+    }
+    getWidgetHandler(view, getPos) {
+        if (!this.widgetHandler) {
+            this.widgetHandler = new FileWidgetHandler({
+                view,
+                getPos,
+                decoId: this.id,
+                uploadFiles: this.uploadFiles,
+            }, this.deps);
+        }
+        return this.widgetHandler;
+    }
+    getDomElem() {
+        return this.domElem;
+    }
+    renderReactElement(view, getPos) {
+        return this.getWidgetHandler(view, getPos).renderWidgetView(view, getPos);
+    }
+    remove() {
+        super.remove();
+        this.widgetHandler = null;
+    }
+}
+class FileWidgetHandler {
+    constructor({ decoId, view, getPos, uploadFiles }, deps) {
+        this.onCancel = () => {
+            this.view.dispatch(removeDecoration(this.view.state.tr, this.decoId));
+            this.view.focus();
+        };
+        this.onSubmit = (params) => {
+            var _a;
+            if (!params.src || !params.name)
+                return;
+            const href = (_a = this.normalizeUrl(params.src)) === null || _a === void 0 ? void 0 : _a.url;
+            const download = params.name;
+            if (!href)
+                return;
+            const node = fileType(this.view.state.schema).create({ href, download });
+            this.insertNodes([node]);
+        };
+        this.onAttach = async (files) => {
+            if (!this.uploadFiles)
+                return;
+            const { view } = this;
+            new YfmFileWidgetUploadProcess(view, files, this.uploadFiles, this.getPos()).run();
+            view.dispatch(removeWidget(view.state.tr, this.decoId));
+            view.focus();
+        };
+        this.decoId = decoId;
+        this.view = view;
+        this.getPos = getPos;
+        this.uploadFiles = uploadFiles;
+        this.normalizeUrl = normalizeUrlFactory(deps);
+    }
+    renderWidgetView(view, getPos) {
+        this.view = view;
+        this.getPos = getPos;
+        return (React.createElement(FilePlaceholder, { onCancel: this.onCancel, onSubmit: this.onSubmit, onAttach: this.uploadFiles && this.onAttach }));
+    }
+    insertNodes(fileNodes) {
+        let tr = this.view.state.tr;
+        tr = tr.insert(tr.mapping.map(this.getPos()), fileNodes);
+        tr = removeWidget(tr, this.decoId);
+        this.view.dispatch(tr);
+        this.view.focus();
+    }
+}
+class YfmFileWidgetUploadProcess extends YfmFilesUploadProcessBase {
+    constructor(view, files, uploadHandler, position) {
+        super(view, files, uploadHandler);
+        this.skeletonInitPos = position;
+    }
+    getSkeletonInitPos() {
+        return this.skeletonInitPos;
+    }
+}

package/build/esm/extensions/yfm/YfmFile/index.css

@@ -0,0 +1,3 @@
+.yfm-editor .yfm-file {
+  pointer-events: none;
+}

package/build/esm/extensions/yfm/YfmFile/index.d.ts

@@ -0,0 +1,8 @@
+import { ExtensionAuto } from '../../../core';
+import { FileUploadHandler } from '../../../utils/upload';
+import './index.css';
+export declare type YfmFileOptions = {
+    fileUploadHandler?: FileUploadHandler;
+    needToSetDimensionsForUploadedImages?: boolean;
+};
+export declare const YfmFile: ExtensionAuto<YfmFileOptions>;

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

@@ -0,0 +1,14 @@
+import { YfmFilePaste } from './YfmFilePaste';
+import { YfmFileSpecs } from './YfmFileSpecs';
+import { YfmFileWidget } from './YfmFileWidget';
+import './index.css';
+export const YfmFile = (builder, opts = {}) => {
+    builder.use(YfmFileSpecs, opts);
+    builder.use(YfmFileWidget, opts);
+    if (opts.fileUploadHandler) {
+        builder.use(YfmFilePaste, {
+            fileUploadHandler: opts.fileUploadHandler,
+            needToSetDimensionsForUploadedImages: Boolean(opts.needToSetDimensionsForUploadedImages),
+        });
+    }
+};

package/build/esm/extensions/yfm/YfmFile/utils.d.ts

@@ -0,0 +1,3 @@
+import { NodeType } from 'prosemirror-model';
+import { UploadSuccessItem } from '../../../utils/upload';
+export declare const createFileNode: (fileType: NodeType) => ({ result, file }: UploadSuccessItem) => import("prosemirror-model").Node;

package/build/esm/extensions/yfm/YfmFile/utils.js

@@ -0,0 +1,8 @@
+export const createFileNode = (fileType) => ({ result, file }) => {
+    var _a, _b;
+    return fileType.create({
+        href: result.url,
+        download: (_a = result.name) !== null && _a !== void 0 ? _a : file.name,
+        type: (_b = result.type) !== null && _b !== void 0 ? _b : file.type,
+    });
+};

package/build/esm/extensions/yfm/YfmHeading/YfmHeadingSpecs/const.d.ts

@@ -0,0 +1,7 @@
+export type { HeadingLevel } from '../../../markdown/Heading/const';
+export { headingLevelAttr, headingNodeName } from '../../../markdown/Heading/HeadingSpecs';
+export declare const YfmHeadingAttr: {
+    readonly Level: "level";
+    readonly Id: "id";
+    readonly DataLine: "data-line";
+};

package/build/esm/extensions/yfm/YfmHeading/YfmHeadingSpecs/const.js

@@ -0,0 +1,7 @@
+import { headingLevelAttr } from '../../../markdown/Heading/HeadingSpecs';
+export { headingLevelAttr, headingNodeName } from '../../../markdown/Heading/HeadingSpecs';
+export const YfmHeadingAttr = {
+    Level: headingLevelAttr,
+    Id: 'id',
+    DataLine: 'data-line',
+};

package/build/esm/extensions/yfm/YfmHeading/YfmHeadingSpecs/index.d.ts

@@ -0,0 +1,11 @@
+import type { NodeSpec } from 'prosemirror-model';
+import type { ExtensionAuto } from '../../../../core';
+export { YfmHeadingAttr } from './const';
+export declare type YfmHeadingSpecsOptions = {
+    /**
+     * @deprecated: use placeholder option in BehaviorPreset instead.
+     */
+    headingPlaceholder?: NonNullable<NodeSpec['placeholder']>['content'];
+};
+/** YfmHeading extension needs markdown-it-attrs plugin */
+export declare const YfmHeadingSpecs: ExtensionAuto<YfmHeadingSpecsOptions>;

package/build/esm/extensions/yfm/YfmHeading/YfmHeadingSpecs/index.js

@@ -0,0 +1,84 @@
+import { YfmHeadingAttr, headingNodeName } from './const';
+import { getNodeAttrs } from './utils';
+const DEFAULT_PLACEHOLDER = (node) => 'Heading ' + node.attrs[YfmHeadingAttr.Level];
+export { YfmHeadingAttr } from './const';
+/** YfmHeading extension needs markdown-it-attrs plugin */
+export const YfmHeadingSpecs = (builder, opts) => {
+    builder.addNode(headingNodeName, () => {
+        var _a, _b, _c;
+        return ({
+            spec: {
+                attrs: {
+                    [YfmHeadingAttr.Id]: { default: '' },
+                    [YfmHeadingAttr.Level]: { default: 1 },
+                    [YfmHeadingAttr.DataLine]: { default: null },
+                },
+                content: '(text | inline)*',
+                group: 'block',
+                defining: true,
+                selectable: true,
+                parseDOM: [
+                    { tag: 'h1', getAttrs: getNodeAttrs(1) },
+                    { tag: 'h2', getAttrs: getNodeAttrs(2) },
+                    { tag: 'h3', getAttrs: getNodeAttrs(3) },
+                    { tag: 'h4', getAttrs: getNodeAttrs(4) },
+                    { tag: 'h5', getAttrs: getNodeAttrs(5) },
+                    { tag: 'h6', getAttrs: getNodeAttrs(6) },
+                ],
+                toDOM(node) {
+                    const id = node.attrs[YfmHeadingAttr.Id];
+                    const lineNumber = node.attrs[YfmHeadingAttr.DataLine];
+                    return [
+                        'h' + node.attrs[YfmHeadingAttr.Level],
+                        {
+                            id: id || null,
+                            [YfmHeadingAttr.DataLine]: lineNumber,
+                        },
+                        0,
+                        // [
+                        //     'a',
+                        //     {
+                        //         href: `#${node.attrs[YfmHeadingAttr.Id]}`,
+                        //         class: 'yfm-anchor',
+                        //         'aria-hidden': 'true',
+                        //         contenteditable: 'false',
+                        //     },
+                        // ],
+                        // ['span', 0],
+                    ];
+                },
+                placeholder: {
+                    content: (_c = (_b = (_a = builder.context.get('placeholder')) === null || _a === void 0 ? void 0 : _a.heading) !== null && _b !== void 0 ? _b : opts.headingPlaceholder) !== null && _c !== void 0 ? _c : DEFAULT_PLACEHOLDER,
+                    alwaysVisible: true,
+                },
+            },
+            fromMd: {
+                tokenSpec: {
+                    name: headingNodeName,
+                    type: 'block',
+                    getAttrs: (token) => {
+                        if (token.type.endsWith('_close'))
+                            return {};
+                        const attrs = Object.fromEntries(token.attrs || []);
+                        // if (!attrs[YfmHeadingAttr.Id]) {
+                        //     // calculate id if it was not specified
+                        //     // tokens[index + 1] is child inline token
+                        //     attrs[YfmHeadingAttr.Id] = slugify(tokens[index + 1].content);
+                        // }
+                        // attrs have id only if it explicitly specified manually
+                        return Object.assign({ [YfmHeadingAttr.Level]: Number(token.tag.slice(1)) }, attrs);
+                    },
+                },
+            },
+            toMd: (state, node) => {
+                state.write(state.repeat('#', node.attrs[YfmHeadingAttr.Level]) + ' ');
+                state.renderInline(node);
+                const anchor = node.attrs[YfmHeadingAttr.Id];
+                if (anchor /*&& anchor !== node.firstChild?.textContent*/) {
+                    state.write(` {#${anchor}}`);
+                }
+                state.closeBlock(node);
+            },
+        });
+    });
+};

package/build/esm/extensions/yfm/YfmHeading/YfmHeadingSpecs/utils.d.ts

@@ -0,0 +1,4 @@
+import type { ParseRule } from 'prosemirror-model';
+import { HeadingLevel } from '../const';
+export { hType, hasParentHeading, headingRule } from '../../../markdown/Heading/utils';
+export declare const getNodeAttrs: (level: HeadingLevel) => ParseRule['getAttrs'];

package/build/esm/extensions/yfm/YfmHeading/YfmHeadingSpecs/utils.js

@@ -0,0 +1,14 @@
+import { YfmHeadingAttr } from '../const';
+export { hType, hasParentHeading, headingRule } from '../../../markdown/Heading/utils';
+// const slug = require('slugify');
+export const getNodeAttrs = (level) => (node) => ({
+    [YfmHeadingAttr.Level]: level,
+    [YfmHeadingAttr.Id]: node.getAttribute('id') || '',
+});
+// export const slugify = (str: string) =>
+//     // same config as in yfm-transform
+//     // https://github.com/yandex-cloud/yfm-transform/blob/master/lib/plugins/anchors/index.js#L97-L100
+//     slug(str, {
+//         lower: true,
+//         remove: /[*+~.()'"!:@]/g,
+//     });

package/build/esm/extensions/yfm/YfmHeading/actions.d.ts

@@ -0,0 +1,3 @@
+import type { ActionSpec } from '../../../core';
+import { HeadingLevel } from './const';
+export declare const headingAction: (level: HeadingLevel) => ActionSpec;

package/build/esm/extensions/yfm/YfmHeading/actions.js

@@ -0,0 +1,10 @@
+import { hasParentHeading } from './YfmHeadingSpecs/utils';
+import { toHeading } from './commands';
+export const headingAction = (level) => {
+    const cmd = toHeading(level);
+    return {
+        isActive: hasParentHeading(level),
+        isEnable: cmd,
+        run: cmd,
+    };
+};

package/build/esm/extensions/yfm/YfmHeading/commands.d.ts

@@ -0,0 +1,4 @@
+import type { Command } from 'prosemirror-state';
+import { HeadingLevel } from './const';
+export { resetHeading } from '../../markdown/Heading/commands';
+export declare const toHeading: (level: HeadingLevel) => Command;

package/build/esm/extensions/yfm/YfmHeading/commands.js

@@ -0,0 +1,18 @@
+import { setBlockType } from 'prosemirror-commands';
+import { findParentNodeOfType } from 'prosemirror-utils';
+import { toParagraph } from '../../../extensions/base';
+import { hType } from './YfmHeadingSpecs/utils';
+import { YfmHeadingAttr, headingLevelAttr } from './const';
+export { resetHeading } from '../../markdown/Heading/commands';
+export const toHeading = (level) => (state, dispatch, view) => {
+    const parentHeading = findParentNodeOfType(hType(state.schema))(state.selection);
+    if (parentHeading && parentHeading.node.attrs[headingLevelAttr] === level) {
+        return toParagraph(state, dispatch, view);
+    }
+    // const text = state.selection.$head.parent.textContent;
+    const attrs = {
+        // [YfmHeadingAttr.Id]: slugify(text),
+        [YfmHeadingAttr.Level]: level,
+    };
+    return setBlockType(hType(state.schema), attrs)(state, dispatch);
+};

package/build/esm/extensions/yfm/YfmHeading/const.d.ts

@@ -0,0 +1,2 @@
+export * from './YfmHeadingSpecs/const';
+export { HeadingAction } from '../../markdown/Heading/const';

package/build/esm/extensions/yfm/YfmHeading/const.js

@@ -0,0 +1,2 @@
+export * from './YfmHeadingSpecs/const';
+export { HeadingAction } from '../../markdown/Heading/const';

package/build/esm/extensions/yfm/YfmHeading/index.d.ts

@@ -0,0 +1,26 @@
+import type { Action, ExtensionAuto } from '../../../core';
+import { YfmHeadingSpecsOptions } from './YfmHeadingSpecs';
+import { HeadingAction } from './const';
+export { YfmHeadingAttr } from './const';
+export declare type YfmHeadingOptions = YfmHeadingSpecsOptions & {
+    h1Key?: string | null;
+    h2Key?: string | null;
+    h3Key?: string | null;
+    h4Key?: string | null;
+    h5Key?: string | null;
+    h6Key?: string | null;
+};
+/** YfmHeading extension needs markdown-it-attrs plugin */
+export declare const YfmHeading: ExtensionAuto<YfmHeadingOptions>;
+declare global {
+    namespace WysiwygEditor {
+        interface Actions {
+            [HeadingAction.ToH1]: Action;
+            [HeadingAction.ToH2]: Action;
+            [HeadingAction.ToH3]: Action;
+            [HeadingAction.ToH4]: Action;
+            [HeadingAction.ToH5]: Action;
+            [HeadingAction.ToH6]: Action;
+        }
+    }
+}

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

@@ -0,0 +1,37 @@
+import { withLogAction } from '../../../utils/keymap';
+import { YfmHeadingSpecs } from './YfmHeadingSpecs';
+import { hType, headingRule } from './YfmHeadingSpecs/utils';
+import { headingAction } from './actions';
+import { resetHeading, toHeading } from './commands';
+import { HeadingAction } from './const';
+export { YfmHeadingAttr } from './const';
+/** YfmHeading extension needs markdown-it-attrs plugin */
+export const YfmHeading = (builder, opts) => {
+    builder.use(YfmHeadingSpecs, opts);
+    builder
+        .addKeymap(() => {
+        const { h1Key, h2Key, h3Key, h4Key, h5Key, h6Key } = opts !== null && opts !== void 0 ? opts : {};
+        const bindings = { Backspace: resetHeading };
+        if (h1Key)
+            bindings[h1Key] = withLogAction('heading1', toHeading(1));
+        if (h2Key)
+            bindings[h2Key] = withLogAction('heading2', toHeading(2));
+        if (h3Key)
+            bindings[h3Key] = withLogAction('heading3', toHeading(3));
+        if (h4Key)
+            bindings[h4Key] = withLogAction('heading4', toHeading(4));
+        if (h5Key)
+            bindings[h5Key] = withLogAction('heading5', toHeading(5));
+        if (h6Key)
+            bindings[h6Key] = withLogAction('heading6', toHeading(6));
+        return bindings;
+    })
+        .addInputRules(({ schema }) => ({ rules: [headingRule(hType(schema), 6)] }));
+    builder
+        .addAction(HeadingAction.ToH1, () => headingAction(1))
+        .addAction(HeadingAction.ToH2, () => headingAction(2))
+        .addAction(HeadingAction.ToH3, () => headingAction(3))
+        .addAction(HeadingAction.ToH4, () => headingAction(4))
+        .addAction(HeadingAction.ToH5, () => headingAction(5))
+        .addAction(HeadingAction.ToH6, () => headingAction(6));
+};

package/build/esm/extensions/yfm/YfmNote/YfmNoteSpecs/const.d.ts

@@ -0,0 +1,9 @@
+export declare enum NoteNode {
+    Note = "yfm_note",
+    NoteTitle = "yfm_note_title",
+    NoteContent = "yfm_note_content"
+}
+export declare enum NoteAttrs {
+    Class = "class",
+    Type = "note-type"
+}

package/build/esm/extensions/yfm/YfmNote/YfmNoteSpecs/const.js

@@ -0,0 +1,11 @@
+export var NoteNode;
+(function (NoteNode) {
+    NoteNode["Note"] = "yfm_note";
+    NoteNode["NoteTitle"] = "yfm_note_title";
+    NoteNode["NoteContent"] = "yfm_note_content";
+})(NoteNode || (NoteNode = {}));
+export var NoteAttrs;
+(function (NoteAttrs) {
+    NoteAttrs["Class"] = "class";
+    NoteAttrs["Type"] = "note-type";
+})(NoteAttrs || (NoteAttrs = {}));

package/build/esm/extensions/yfm/YfmNote/YfmNoteSpecs/index.d.ts

@@ -0,0 +1,11 @@
+import type { NodeSpec } from 'prosemirror-model';
+import type { ExtensionAuto } from '../../../../core';
+export { NoteNode as YfmNoteNode } from './const';
+export { noteType, noteTitleType } from './utils';
+export declare type YfmNoteSpecsOptions = {
+    /**
+     * @deprecated: use placeholder option in BehaviorPreset instead.
+     */
+    yfmNoteTitlePlaceholder?: NonNullable<NodeSpec['placeholder']>['content'];
+};
+export declare const YfmNoteSpecs: ExtensionAuto<YfmNoteSpecsOptions>;

package/build/esm/extensions/yfm/YfmNote/YfmNoteSpecs/index.js

@@ -0,0 +1,34 @@
+import log from '@diplodoc/transform/lib/log';
+import yfmPlugin from '@diplodoc/transform/lib/plugins/notes';
+import { NoteNode } from './const';
+import { parserTokens } from './parser';
+import { getSchemaSpecs } from './schema';
+import { serializerTokens } from './serializer';
+export { NoteNode as YfmNoteNode } from './const';
+export { noteType, noteTitleType } from './utils';
+export const YfmNoteSpecs = (builder, opts) => {
+    const schemaSpecs = getSchemaSpecs(opts, builder.context.get('placeholder'));
+    builder
+        .configureMd((md) => md.use(yfmPlugin, { log }))
+        .addNode(NoteNode.Note, () => ({
+        spec: schemaSpecs[NoteNode.Note],
+        toMd: serializerTokens[NoteNode.Note],
+        fromMd: {
+            tokenSpec: parserTokens[NoteNode.Note],
+        },
+    }))
+        .addNode(NoteNode.NoteTitle, () => ({
+        spec: schemaSpecs[NoteNode.NoteTitle],
+        toMd: serializerTokens[NoteNode.NoteTitle],
+        fromMd: {
+            tokenSpec: parserTokens[NoteNode.NoteTitle],
+        },
+    }))
+        .addNode(NoteNode.NoteContent, () => ({
+        spec: schemaSpecs[NoteNode.NoteContent],
+        toMd: serializerTokens[NoteNode.NoteContent],
+        fromMd: {
+            tokenSpec: parserTokens[NoteNode.NoteContent],
+        },
+    }));
+};

package/build/esm/extensions/yfm/YfmNote/YfmNoteSpecs/parser.d.ts

@@ -0,0 +1,3 @@
+import type { ParserToken } from '../../../../core';
+import { NoteNode } from './const';
+export declare const parserTokens: Record<NoteNode, ParserToken>;

package/build/esm/extensions/yfm/YfmNote/YfmNoteSpecs/parser.js

@@ -0,0 +1,10 @@
+import { NoteNode } from './const';
+export const parserTokens = {
+    [NoteNode.Note]: {
+        name: NoteNode.Note,
+        type: 'block',
+        getAttrs: (token) => (token.attrs ? Object.fromEntries(token.attrs) : {}),
+    },
+    [NoteNode.NoteTitle]: { name: NoteNode.NoteTitle, type: 'block' },
+    [NoteNode.NoteContent]: { name: NoteNode.NoteContent, type: 'block' },
+};

package/build/esm/extensions/yfm/YfmNote/YfmNoteSpecs/schema.d.ts

@@ -0,0 +1,5 @@
+import type { NodeSpec } from 'prosemirror-model';
+import { PlaceholderOptions } from '../../../../utils/placeholder';
+import { NoteNode } from './const';
+import { YfmNoteSpecsOptions } from './index';
+export declare const getSchemaSpecs: (opts?: YfmNoteSpecsOptions, placeholder?: PlaceholderOptions) => Record<NoteNode, NodeSpec>;

package/build/esm/extensions/yfm/YfmNote/YfmNoteSpecs/schema.js

@@ -0,0 +1,72 @@
+import { NoteAttrs, NoteNode } from './const';
+const DEFAULT_TITLE_PLACEHOLDER = 'Note';
+const DEFAULT_CONTENT_PLACEHOLDER = 'Note content';
+export const getSchemaSpecs = (opts, placeholder) => {
+    var _a, _b, _c;
+    return ({
+        [NoteNode.Note]: {
+            attrs: {
+                [NoteAttrs.Class]: { default: 'yfm-note yfm-accent-info' },
+                [NoteAttrs.Type]: { default: 'info' },
+            },
+            content: `${NoteNode.NoteTitle} ${NoteNode.NoteContent}`,
+            group: 'block yfm-note',
+            parseDOM: [
+                {
+                    tag: 'div.yfm-note',
+                    priority: 100,
+                    getAttrs: (node) => ({
+                        [NoteAttrs.Class]: node.getAttribute(NoteAttrs.Class) || '',
+                        [NoteAttrs.Type]: node.getAttribute(NoteAttrs.Type) || 'info',
+                    }),
+                },
+            ],
+            toDOM(node) {
+                return ['div', node.attrs, 0];
+            },
+            selectable: true,
+            allowSelection: true,
+            complex: 'root',
+        },
+        [NoteNode.NoteTitle]: {
+            content: 'inline*',
+            group: 'block yfm-note',
+            parseDOM: [
+                {
+                    tag: 'p.yfm-note-title',
+                    priority: 100,
+                },
+            ],
+            toDOM() {
+                return ['p', { class: 'yfm-note-title' }, 0];
+            },
+            selectable: false,
+            allowSelection: false,
+            placeholder: {
+                content: (_b = (_a = placeholder === null || placeholder === void 0 ? void 0 : placeholder[NoteNode.NoteTitle]) !== null && _a !== void 0 ? _a : opts === null || opts === void 0 ? void 0 : opts.yfmNoteTitlePlaceholder) !== null && _b !== void 0 ? _b : DEFAULT_TITLE_PLACEHOLDER,
+                alwaysVisible: true,
+            },
+            complex: 'leaf',
+        },
+        [NoteNode.NoteContent]: {
+            content: '(block | paragraph)+',
+            group: 'block yfm-note',
+            parseDOM: [
+                {
+                    tag: 'div.yfm-note-content',
+                    priority: 100,
+                },
+            ],
+            toDOM() {
+                return ['div', { class: 'yfm-note-content' }, 0];
+            },
+            selectable: false,
+            allowSelection: false,
+            placeholder: {
+                content: (_c = placeholder === null || placeholder === void 0 ? void 0 : placeholder[NoteNode.NoteContent]) !== null && _c !== void 0 ? _c : DEFAULT_CONTENT_PLACEHOLDER,
+                alwaysVisible: true,
+            },
+            complex: 'leaf',
+        },
+    });
+};

package/build/esm/extensions/yfm/YfmNote/YfmNoteSpecs/serializer.d.ts

@@ -0,0 +1,3 @@
+import type { SerializerNodeToken } from '../../../../core';
+import { NoteNode } from './const';
+export declare const serializerTokens: Record<NoteNode, SerializerNodeToken>;

package/build/esm/extensions/yfm/YfmNote/YfmNoteSpecs/serializer.js

@@ -0,0 +1,32 @@
+import { isNodeEmpty } from '../../../../utils/nodes';
+import { getPlaceholderContent } from '../../../../utils/placeholder';
+import { NoteAttrs, NoteNode } from './const';
+export const serializerTokens = {
+    [NoteNode.Note]: (state, node) => {
+        state.renderContent(node);
+        state.write('{% endnote %}');
+        state.closeBlock(node);
+    },
+    [NoteNode.NoteTitle]: (state, node, parent) => {
+        state.write(`{% note ${parent.attrs[NoteAttrs.Type]} `);
+        if (node.nodeSize > 2) {
+            state.write('"');
+            state.renderInline(node);
+            state.write('"');
+        }
+        else {
+            const placeholder = getPlaceholderContent(node);
+            if (placeholder)
+                state.write(`"${placeholder}"`);
+        }
+        state.write(' %}\n');
+        state.write('\n');
+        state.closeBlock();
+    },
+    [NoteNode.NoteContent]: (state, node) => {
+        if (!isNodeEmpty(node))
+            state.renderInline(node);
+        else
+            state.write(getPlaceholderContent(node) + '\n\n');
+    },
+};

package/build/esm/extensions/yfm/YfmNote/YfmNoteSpecs/utils.d.ts

@@ -0,0 +1,3 @@
+export declare const noteType: (schema: import("prosemirror-model").Schema<any, any>) => import("prosemirror-model").NodeType;
+export declare const noteTitleType: (schema: import("prosemirror-model").Schema<any, any>) => import("prosemirror-model").NodeType;
+export declare const noteContentType: (schema: import("prosemirror-model").Schema<any, any>) => import("prosemirror-model").NodeType;

package/build/esm/extensions/yfm/YfmNote/YfmNoteSpecs/utils.js

@@ -0,0 +1,5 @@
+import { nodeTypeFactory } from '../../../../utils/schema';
+import { NoteNode } from './const';
+export const noteType = nodeTypeFactory(NoteNode.Note);
+export const noteTitleType = nodeTypeFactory(NoteNode.NoteTitle);
+export const noteContentType = nodeTypeFactory(NoteNode.NoteContent);

package/build/esm/extensions/yfm/YfmNote/actions/toYfmNote.d.ts

@@ -0,0 +1,6 @@
+import { Command, EditorState } from 'prosemirror-state';
+import type { ActionSpec } from '../../../../core';
+export declare function isInsideYfmNote(state: EditorState): boolean;
+export declare type YfmNoteType = 'info' | 'tip' | 'alert' | 'warning';
+export declare const createYfmNote: Command;
+export declare const toYfmNote: ActionSpec;

package/build/esm/extensions/yfm/YfmNote/actions/toYfmNote.js

@@ -0,0 +1,32 @@
+import { findParentNodeOfType, hasParentNodeOfType } from 'prosemirror-utils';
+import { NoteAttrs } from '../const';
+import { noteContentType, noteTitleType, noteType } from '../utils';
+export function isInsideYfmNote(state) {
+    return hasParentNodeOfType(noteType(state.schema))(state.selection);
+}
+const createYfmNoteNode = (schema) => (type, content) => {
+    return noteType(schema).create({
+        [NoteAttrs.Class]: `yfm-note yfm-accent-${type}`,
+        [NoteAttrs.Type]: type,
+    }, [
+        noteTitleType(schema).createAndFill(),
+        noteContentType(schema).createAndFill({}, content),
+    ]);
+};
+export const createYfmNote = (state, dispatch) => {
+    const parent = findParentNodeOfType(state.schema.nodes.paragraph)(state.selection);
+    if (parent) {
+        const yfmNote = createYfmNoteNode(state.schema)('info', parent.node);
+        dispatch === null || dispatch === void 0 ? void 0 : dispatch(state.tr.replaceWith(parent.pos, parent.pos + parent.node.nodeSize, yfmNote));
+        return true;
+    }
+    return false;
+};
+export const toYfmNote = {
+    isEnable(state) {
+        return createYfmNote(state);
+    },
+    run(state, dispatch) {
+        createYfmNote(state, dispatch);
+    },
+};