@gravity-ui/markdown-editor 13.0.0

package/build/cjs/logger.js

@@ -0,0 +1,50 @@
+"use strict";
+var _Logger_logger;
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.logger = void 0;
+const tslib_1 = require("tslib");
+const noop = () => { };
+class Logger {
+    constructor() {
+        _Logger_logger.set(this, this.createLogger({}));
+    }
+    get log() {
+        return tslib_1.__classPrivateFieldGet(this, _Logger_logger, "f").log;
+    }
+    get info() {
+        return tslib_1.__classPrivateFieldGet(this, _Logger_logger, "f").info;
+    }
+    get error() {
+        return tslib_1.__classPrivateFieldGet(this, _Logger_logger, "f").error;
+    }
+    get warn() {
+        return tslib_1.__classPrivateFieldGet(this, _Logger_logger, "f").warn;
+    }
+    get metrics() {
+        return tslib_1.__classPrivateFieldGet(this, _Logger_logger, "f").metrics;
+    }
+    get action() {
+        return tslib_1.__classPrivateFieldGet(this, _Logger_logger, "f").action;
+    }
+    setLogger(settings = {}) {
+        tslib_1.__classPrivateFieldSet(this, _Logger_logger, this.createLogger(settings), "f");
+    }
+    /**
+     * @inner
+     *
+     * To override the default logger, use setLogger
+     */
+    createLogger(settings) {
+        var _a, _b, _c, _d, _e, _f;
+        return {
+            log: (_a = settings.log) !== null && _a !== void 0 ? _a : noop,
+            info: (_b = settings.info) !== null && _b !== void 0 ? _b : noop,
+            warn: (_c = settings.warn) !== null && _c !== void 0 ? _c : noop,
+            error: (_d = settings.error) !== null && _d !== void 0 ? _d : noop,
+            metrics: (_e = settings.metrics) !== null && _e !== void 0 ? _e : noop,
+            action: (_f = settings.action) !== null && _f !== void 0 ? _f : noop,
+        };
+    }
+}
+_Logger_logger = new WeakMap();
+exports.logger = new Logger();

package/build/cjs/markdown-it/color.d.ts

@@ -0,0 +1,2 @@
+import color from 'markdown-it-color';
+export default color;

package/build/cjs/markdown-it/color.js

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const tslib_1 = require("tslib");
+const markdown_it_color_1 = tslib_1.__importDefault(require("markdown-it-color"));
+exports.default = markdown_it_color_1.default;

package/build/cjs/markdown-it/emoji.d.ts

@@ -0,0 +1,5 @@
+import emoji from 'markdown-it-emoji';
+import bare from 'markdown-it-emoji/bare';
+import light from 'markdown-it-emoji/light';
+export default emoji;
+export { bare, light };

package/build/cjs/markdown-it/emoji.js

@@ -0,0 +1,10 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.light = exports.bare = void 0;
+const tslib_1 = require("tslib");
+const markdown_it_emoji_1 = tslib_1.__importDefault(require("markdown-it-emoji"));
+const bare_1 = tslib_1.__importDefault(require("markdown-it-emoji/bare"));
+exports.bare = bare_1.default;
+const light_1 = tslib_1.__importDefault(require("markdown-it-emoji/light"));
+exports.light = light_1.default;
+exports.default = markdown_it_emoji_1.default;

package/build/cjs/markdown-it/ins.d.ts

@@ -0,0 +1,2 @@
+import ins from 'markdown-it-ins';
+export default ins;

package/build/cjs/markdown-it/ins.js

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const tslib_1 = require("tslib");
+const markdown_it_ins_1 = tslib_1.__importDefault(require("markdown-it-ins"));
+exports.default = markdown_it_ins_1.default;

package/build/cjs/markdown-it/mark.d.ts

@@ -0,0 +1,2 @@
+import mark from 'markdown-it-mark';
+export default mark;

package/build/cjs/markdown-it/mark.js

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const tslib_1 = require("tslib");
+const markdown_it_mark_1 = tslib_1.__importDefault(require("markdown-it-mark"));
+exports.default = markdown_it_mark_1.default;

package/build/cjs/markdown-it/sub.d.ts

@@ -0,0 +1,2 @@
+import sub from 'markdown-it-sub';
+export default sub;

package/build/cjs/markdown-it/sub.js

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const tslib_1 = require("tslib");
+const markdown_it_sub_1 = tslib_1.__importDefault(require("markdown-it-sub"));
+exports.default = markdown_it_sub_1.default;

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

@@ -0,0 +1,18 @@
+import type { StateCommand } from '@codemirror/state';
+import { EditorView, EditorViewConfig } from '@codemirror/view';
+import { ReactRenderStorage } from '../../extensions';
+import { FileUploadHandler } from './files-upload-facet';
+export declare type CreateCodemirrorParams = {
+    doc: EditorViewConfig['doc'];
+    placeholderText: string;
+    onCancel: () => void;
+    onSubmit: () => void;
+    onChange: () => void;
+    onDocChange: () => void;
+    onScroll: (event: Event) => void;
+    reactRenderer: ReactRenderStorage;
+    uploadHandler?: FileUploadHandler;
+    needImgDimms?: boolean;
+};
+export declare function createCodemirror(params: CreateCodemirrorParams): EditorView;
+export declare function withLogger(action: string, command: StateCommand): StateCommand;

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

@@ -0,0 +1,97 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.withLogger = exports.createCodemirror = void 0;
+const autocomplete_1 = require("@codemirror/autocomplete");
+const commands_1 = require("@codemirror/commands");
+const language_1 = require("@codemirror/language");
+const view_1 = require("@codemirror/view");
+const action_names_1 = require("../../bundle/config/action-names");
+const logger_1 = require("../../logger");
+const shortcuts_1 = require("../../shortcuts");
+const commands_2 = require("../commands");
+const files_upload_facet_1 = require("./files-upload-facet");
+const gravity_1 = require("./gravity");
+const pairing_chars_1 = require("./pairing-chars");
+const react_facet_1 = require("./react-facet");
+const yfm_1 = require("./yfm");
+function createCodemirror(params) {
+    const { doc, placeholderText, reactRenderer, onCancel, onScroll, onSubmit, onChange, onDocChange, } = params;
+    const extensions = [
+        gravity_1.gravityTheme,
+        (0, view_1.placeholder)(placeholderText),
+        (0, commands_1.history)(),
+        (0, language_1.syntaxHighlighting)(gravity_1.gravityHighlightStyle),
+        view_1.keymap.of([
+            { key: shortcuts_1.formatter.toCM(shortcuts_1.Action.Bold), run: withLogger(action_names_1.ActionName.bold, commands_2.toggleBold) },
+            { key: shortcuts_1.formatter.toCM(shortcuts_1.Action.Italic), run: withLogger(action_names_1.ActionName.italic, commands_2.toggleItalic) },
+            { key: shortcuts_1.formatter.toCM(shortcuts_1.Action.Strike), run: withLogger(action_names_1.ActionName.strike, commands_2.toggleStrikethrough) },
+            { key: shortcuts_1.formatter.toCM(shortcuts_1.Action.Underline), run: withLogger(action_names_1.ActionName.underline, commands_2.toggleUnderline) },
+            { key: shortcuts_1.formatter.toCM(shortcuts_1.Action.Link), run: withLogger(action_names_1.ActionName.link, commands_2.insertLink) },
+            { key: shortcuts_1.formatter.toCM(shortcuts_1.Action.Heading1), run: withLogger(action_names_1.ActionName.heading1, commands_2.toH1) },
+            { key: shortcuts_1.formatter.toCM(shortcuts_1.Action.Heading2), run: withLogger(action_names_1.ActionName.heading2, commands_2.toH2) },
+            { key: shortcuts_1.formatter.toCM(shortcuts_1.Action.Heading3), run: withLogger(action_names_1.ActionName.heading3, commands_2.toH3) },
+            { key: shortcuts_1.formatter.toCM(shortcuts_1.Action.Heading4), run: withLogger(action_names_1.ActionName.heading4, commands_2.toH4) },
+            { key: shortcuts_1.formatter.toCM(shortcuts_1.Action.Heading5), run: withLogger(action_names_1.ActionName.heading5, commands_2.toH5) },
+            { key: shortcuts_1.formatter.toCM(shortcuts_1.Action.Heading6), run: withLogger(action_names_1.ActionName.heading6, commands_2.toH6) },
+            { key: shortcuts_1.formatter.toCM(shortcuts_1.Action.Code), run: withLogger(action_names_1.ActionName.code_inline, commands_2.wrapToInlineCode) },
+            { key: shortcuts_1.formatter.toCM(shortcuts_1.Action.CodeBlock), run: withLogger(action_names_1.ActionName.code_block, commands_2.wrapToCodeBlock) },
+            { key: shortcuts_1.formatter.toCM(shortcuts_1.Action.Cut), run: withLogger(action_names_1.ActionName.yfm_cut, commands_2.wrapToYfmCut) },
+            { key: shortcuts_1.formatter.toCM(shortcuts_1.Action.Note), run: withLogger(action_names_1.ActionName.yfm_note, commands_2.wrapToYfmNote) },
+            {
+                key: shortcuts_1.formatter.toCM(shortcuts_1.Action.Cancel),
+                preventDefault: true,
+                run: () => {
+                    onCancel();
+                    return true;
+                },
+            },
+            {
+                key: shortcuts_1.formatter.toCM(shortcuts_1.Action.Submit),
+                preventDefault: true,
+                run: () => {
+                    onSubmit();
+                    return true;
+                },
+            },
+            commands_1.indentWithTab,
+            ...commands_1.defaultKeymap,
+            ...commands_1.historyKeymap,
+        ]),
+        (0, autocomplete_1.autocompletion)(),
+        (0, yfm_1.yfmLang)(),
+        react_facet_1.ReactRendererFacet.of(reactRenderer),
+        pairing_chars_1.PairingCharactersExtension,
+        view_1.EditorView.lineWrapping,
+        view_1.EditorView.contentAttributes.of({ spellcheck: 'true' }),
+        view_1.EditorView.domEventHandlers({
+            scroll(event) {
+                onScroll(event);
+            },
+        }),
+    ];
+    if (params.uploadHandler) {
+        extensions.push(files_upload_facet_1.FileUploadHandlerFacet.of({
+            fn: params.uploadHandler,
+            imgWithDimms: params.needImgDimms,
+        }));
+    }
+    return new view_1.EditorView({
+        doc,
+        extensions,
+        dispatchTransactions: (trs, view) => {
+            view.update(trs);
+            onChange();
+            if (trs.some((tr) => tr.docChanged)) {
+                onDocChange();
+            }
+        },
+    });
+}
+exports.createCodemirror = createCodemirror;
+function withLogger(action, command) {
+    return (...args) => {
+        logger_1.logger.action({ mode: 'markup', source: 'keymap', action });
+        return command(...args);
+    };
+}
+exports.withLogger = withLogger;

package/build/cjs/markup/codemirror/files-upload-facet.d.ts

@@ -0,0 +1,10 @@
+import { Facet } from '@codemirror/state';
+import type { FileUploadHandler } from '../../utils/upload';
+export type { FileUploadHandler };
+export declare const FileUploadHandlerFacet: Facet<{
+    fn: FileUploadHandler;
+    imgWithDimms?: boolean | undefined;
+}, {
+    fn: FileUploadHandler;
+    imgWithDimms?: boolean | undefined;
+}>;

package/build/cjs/markup/codemirror/files-upload-facet.js

@@ -0,0 +1,10 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.FileUploadHandlerFacet = void 0;
+const state_1 = require("@codemirror/state");
+const files_upload_plugin_1 = require("./files-upload-plugin");
+exports.FileUploadHandlerFacet = state_1.Facet.define({
+    enables: files_upload_plugin_1.FilesUploadPlugin.extension,
+    combine: (value) => value[0],
+    static: true,
+});

package/build/cjs/markup/codemirror/files-upload-plugin/const.d.ts

@@ -0,0 +1,2 @@
+export declare const IMG_MAX_HEIGHT = 600;
+export declare const SUCCESS_UPLOAD_REMOVE_TIMEOUT = 1000;

package/build/cjs/markup/codemirror/files-upload-plugin/const.js

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.SUCCESS_UPLOAD_REMOVE_TIMEOUT = exports.IMG_MAX_HEIGHT = void 0;
+exports.IMG_MAX_HEIGHT = 600; // px
+exports.SUCCESS_UPLOAD_REMOVE_TIMEOUT = 1000; // 1 sec

package/build/cjs/markup/codemirror/files-upload-plugin/effects.d.ts

@@ -0,0 +1,8 @@
+export declare const AddUploadWidgetEffect: import("@codemirror/state").StateEffectType<{
+    files: ArrayLike<File>;
+    pos: number;
+}>;
+export declare const RemoveUploadWidgetEffect: import("@codemirror/state").StateEffectType<{
+    id: string;
+    markup?: string | undefined;
+}>;

package/build/cjs/markup/codemirror/files-upload-plugin/effects.js

@@ -0,0 +1,6 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.RemoveUploadWidgetEffect = exports.AddUploadWidgetEffect = void 0;
+const state_1 = require("@codemirror/state");
+exports.AddUploadWidgetEffect = state_1.StateEffect.define();
+exports.RemoveUploadWidgetEffect = state_1.StateEffect.define();

package/build/cjs/markup/codemirror/files-upload-plugin/index.d.ts

@@ -0,0 +1,3 @@
+export { FilesUploadPlugin } from './plugin';
+export { getImageDimensions } from './utils';
+export { IMG_MAX_HEIGHT } from './const';

package/build/cjs/markup/codemirror/files-upload-plugin/index.js

@@ -0,0 +1,9 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.IMG_MAX_HEIGHT = exports.getImageDimensions = exports.FilesUploadPlugin = void 0;
+var plugin_1 = require("./plugin");
+Object.defineProperty(exports, "FilesUploadPlugin", { enumerable: true, get: function () { return plugin_1.FilesUploadPlugin; } });
+var utils_1 = require("./utils");
+Object.defineProperty(exports, "getImageDimensions", { enumerable: true, get: function () { return utils_1.getImageDimensions; } });
+var const_1 = require("./const");
+Object.defineProperty(exports, "IMG_MAX_HEIGHT", { enumerable: true, get: function () { return const_1.IMG_MAX_HEIGHT; } });

package/build/cjs/markup/codemirror/files-upload-plugin/plugin.d.ts

@@ -0,0 +1,6 @@
+import { DecorationSet, EditorView, ViewPlugin, ViewUpdate } from '@codemirror/view';
+export declare const FilesUploadPlugin: ViewPlugin<{
+    decos: DecorationSet;
+    readonly view: EditorView;
+    update(update: ViewUpdate): void;
+}>;

package/build/cjs/markup/codemirror/files-upload-plugin/plugin.js

@@ -0,0 +1,221 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.FilesUploadPlugin = void 0;
+const view_1 = require("@codemirror/view");
+const files_upload_facet_1 = require("../files-upload-facet");
+const react_facet_1 = require("../react-facet");
+const const_1 = require("./const");
+const effects_1 = require("./effects");
+const utils_1 = require("./utils");
+const widget_1 = require("./widget");
+class FileUploadWidget extends view_1.WidgetType {
+    constructor(id) {
+        super();
+        this.renderer = null;
+        this.props = {};
+        this.selfId = id;
+    }
+    toDOM(view) {
+        var _a;
+        const dom = document.createElement('div');
+        dom.className = 'cm-file-upload-widget';
+        dom.style.display = 'inline-block';
+        (_a = this.renderer) === null || _a === void 0 ? void 0 : _a.remove();
+        this.createRenderItem(dom, view);
+        return dom;
+    }
+    updateDOM(dom, view) {
+        var _a;
+        (_a = this.renderer) === null || _a === void 0 ? void 0 : _a.remove();
+        this.createRenderItem(dom, view);
+        return true;
+    }
+    destroy(dom) {
+        var _a, _b;
+        super.destroy(dom);
+        (_a = this.renderer) === null || _a === void 0 ? void 0 : _a.remove();
+        (_b = this.presenter) === null || _b === void 0 ? void 0 : _b.cancel();
+        this.presenter = undefined;
+    }
+    setPresenter(presenter) {
+        this.presenter = presenter;
+    }
+    render(props) {
+        var _a;
+        Object.assign(this.props, props);
+        (_a = this.renderer) === null || _a === void 0 ? void 0 : _a.rerender();
+    }
+    createRenderItem(dom, view) {
+        this.renderer = view.state
+            .facet(react_facet_1.ReactRendererFacet)
+            .createItem('cm-file-upload-widget', () => (0, widget_1.renderWidget)(dom, Object.assign({}, this.props)));
+    }
+}
+class FileUploadPresenter {
+    constructor(params) {
+        this.state = 'initial';
+        this.onUploadSuccess = (res) => {
+            if (this.state === 'canceled')
+                return;
+            this.state = 'success';
+            this.widget.render({
+                status: 'success',
+                fileName: this.file.name,
+                fileType: (0, utils_1.isImageFile)(this.file) ? 'image' : 'file',
+            });
+            setTimeout(async () => {
+                const markup = await this.formatFileMarkup(res);
+                if (this.state === 'canceled')
+                    return;
+                this.view.dispatch({
+                    effects: effects_1.RemoveUploadWidgetEffect.of({
+                        id: this.widget.selfId,
+                        markup,
+                    }),
+                });
+            }, const_1.SUCCESS_UPLOAD_REMOVE_TIMEOUT);
+        };
+        this.onUploadError = (err) => {
+            if (this.state === 'canceled')
+                return;
+            this.state = 'error';
+            this.widget.render({
+                status: 'error',
+                fileName: this.file.name,
+                fileType: (0, utils_1.isImageFile)(this.file) ? 'image' : 'file',
+                errorText: String(err),
+                onReUploadClick: () => {
+                    if (this.state === 'error')
+                        this.run();
+                },
+            });
+        };
+        this.file = params.file;
+        this.view = params.view;
+        this.widget = params.widget;
+        this.uploader = params.uploader;
+        this.needDimmensionsForImages = params.needDimmensionsForImages;
+        this.widget.setPresenter(this);
+        this.run();
+    }
+    cancel() {
+        this.state = 'canceled';
+    }
+    run() {
+        this.state = 'uploading';
+        this.widget.render({
+            status: 'uploading',
+            fileName: this.file.name,
+            fileType: (0, utils_1.isImageFile)(this.file) ? 'image' : 'file',
+        });
+        this.uploader(this.file).then(this.onUploadSuccess, this.onUploadError);
+    }
+    async formatFileMarkup(res) {
+        var _a, _b;
+        const fileName = (_b = (_a = res.name) !== null && _a !== void 0 ? _a : this.file.name) !== null && _b !== void 0 ? _b : '';
+        let markup;
+        if ((0, utils_1.isImageFile)(this.file)) {
+            if (this.needDimmensionsForImages) {
+                try {
+                    let { height } = await (0, utils_1.getImageDimensions)(this.file);
+                    height = Math.min(height, const_1.IMG_MAX_HEIGHT);
+                    markup = `![${fileName}](${res.url} =x${height})`;
+                }
+                catch (err) {
+                    markup = `![${fileName}](${res.url})`;
+                }
+            }
+            else {
+                markup = `![${fileName}](${res.url})`;
+            }
+        }
+        else {
+            markup = `{% file src="${res.url}" name="${fileName.replace('"', '')}" %}`;
+        }
+        return markup;
+    }
+}
+exports.FilesUploadPlugin = view_1.ViewPlugin.fromClass(class {
+    constructor(view) {
+        this.decos = view_1.Decoration.none;
+        this.view = view;
+    }
+    update(update) {
+        this.decos = this.decos.map(update.changes);
+        const uploadFacet = this.view.state.facet(files_upload_facet_1.FileUploadHandlerFacet);
+        const changes = [];
+        for (const tr of update.transactions) {
+            for (const eff of tr.effects) {
+                if (eff.is(effects_1.AddUploadWidgetEffect)) {
+                    this.decos = this.decos.update({
+                        add: Array.from(eff.value.files).map((file, index) => {
+                            const { widget } = new FileUploadPresenter({
+                                file,
+                                view: this.view,
+                                uploader: uploadFacet.fn,
+                                needDimmensionsForImages: Boolean(uploadFacet.imgWithDimms),
+                                widget: new FileUploadWidget((0, utils_1.uniqueId)('__file_widget_id')),
+                            });
+                            return view_1.Decoration.widget({
+                                widget,
+                                side: 1,
+                                __file_widget_id: widget.selfId,
+                            }).range(eff.value.pos + index);
+                        }),
+                    });
+                }
+                if (eff.is(effects_1.RemoveUploadWidgetEffect)) {
+                    this.decos = this.decos.update({
+                        filter: (from, to, deco) => {
+                            if (deco.spec.__file_widget_id !== eff.value.id)
+                                return true;
+                            if (eff.value.markup) {
+                                changes.push({ from, to, insert: eff.value.markup });
+                            }
+                            return false;
+                        },
+                    });
+                }
+            }
+        }
+        if (changes.length) {
+            setTimeout(() => {
+                this.view.dispatch({ changes });
+            });
+        }
+    }
+}, {
+    decorations: (v) => v.decos,
+    eventHandlers: {
+        paste(event, view) {
+            if (!event.clipboardData)
+                return false;
+            const files = (0, utils_1.getTransferFiles)(event.clipboardData);
+            if (!files)
+                return false;
+            const { from, to } = view.state.selection.main;
+            view.dispatch({
+                selection: { anchor: from },
+                effects: effects_1.AddUploadWidgetEffect.of({ files, pos: from }),
+                changes: { from, to, insert: ' '.repeat(files.length) },
+            });
+            event.preventDefault();
+            return true;
+        },
+        drop(event, view) {
+            if (!event.dataTransfer)
+                return false;
+            const files = (0, utils_1.getTransferFiles)(event.dataTransfer);
+            if (!files)
+                return false;
+            const pos = this.view.posAtCoords(event, false);
+            view.dispatch({
+                selection: { anchor: pos },
+                effects: effects_1.AddUploadWidgetEffect.of({ files, pos }),
+                changes: { from: pos, insert: ' '.repeat(files.length) },
+            });
+            event.preventDefault();
+            return true;
+        },
+    },
+});

package/build/cjs/markup/codemirror/files-upload-plugin/utils.d.ts

@@ -0,0 +1,8 @@
+export { uniqueId } from '../../../lodash';
+export { isImageFile } from '../../../utils/clipboard';
+export declare function getImageDimensions(imgFile: File): Promise<{
+    width: number;
+    height: number;
+}>;
+export declare function loadImage(imgFile: File): Promise<HTMLImageElement>;
+export declare function getTransferFiles(data: DataTransfer | null): File[] | null;

package/build/cjs/markup/codemirror/files-upload-plugin/utils.js

@@ -0,0 +1,33 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getTransferFiles = exports.loadImage = exports.getImageDimensions = exports.isImageFile = exports.uniqueId = void 0;
+const clipboard_1 = require("../../../utils/clipboard");
+var lodash_1 = require("../../../lodash");
+Object.defineProperty(exports, "uniqueId", { enumerable: true, get: function () { return lodash_1.uniqueId; } });
+var clipboard_2 = require("../../../utils/clipboard");
+Object.defineProperty(exports, "isImageFile", { enumerable: true, get: function () { return clipboard_2.isImageFile; } });
+async function getImageDimensions(imgFile) {
+    const img = await loadImage(imgFile);
+    return { width: img.naturalWidth, height: img.naturalHeight };
+}
+exports.getImageDimensions = getImageDimensions;
+async function loadImage(imgFile) {
+    return new Promise((resolve, reject) => {
+        const img = document.createElement('img');
+        img.src = URL.createObjectURL(imgFile);
+        img.onload = () => {
+            URL.revokeObjectURL(img.src);
+            resolve(img);
+        };
+        img.onerror = (_e, _s, _l, _c, error) => reject(error);
+    });
+}
+exports.loadImage = loadImage;
+function getTransferFiles(data) {
+    if (!data)
+        return null;
+    if (!(0, clipboard_1.isFilesOnly)(data) && !(0, clipboard_1.isFilesFromHtml)(data))
+        return null;
+    return Array.from(data.files);
+}
+exports.getTransferFiles = getTransferFiles;

package/build/cjs/markup/codemirror/files-upload-plugin/widget.css

@@ -0,0 +1,16 @@
+.g-md-upload-label__content {
+  display: flex;
+  align-items: center;
+  column-gap: 4px;
+}
+.g-md-upload-label__filename {
+  display: inline-block;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  max-width: 128px;
+}
+
+.cm-file-upload-widget + .cm-file-upload-widget {
+  margin-left: 2px;
+}

package/build/cjs/markup/codemirror/files-upload-plugin/widget.d.ts

@@ -0,0 +1,12 @@
+/// <reference types="react" />
+export declare function renderWidget(container: HTMLElement, props: UploadLabelProps): JSX.Element;
+export declare type UploadedFile = {
+    fileName: string;
+    fileType: 'image' | 'file';
+    status: 'uploading' | 'success' | 'error';
+    errorText?: string;
+};
+export declare type UploadLabelProps = UploadedFile & {
+    onReUploadClick: () => void;
+};
+export declare function UploadLabel({ fileName, fileType, status, errorText, onReUploadClick, }: UploadLabelProps): JSX.Element | null;

package/build/cjs/markup/codemirror/files-upload-plugin/widget.js

@@ -0,0 +1,38 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.UploadLabel = exports.renderWidget = void 0;
+const tslib_1 = require("tslib");
+const react_1 = tslib_1.__importDefault(require("react"));
+const icons_1 = require("@gravity-ui/icons");
+const uikit_1 = require("@gravity-ui/uikit");
+const icons_2 = require("../../../bundle/config/icons");
+const classname_1 = require("../../../classname");
+function renderWidget(container, props) {
+    return (react_1.default.createElement(uikit_1.Portal, { container: container },
+        react_1.default.createElement(UploadLabel, Object.assign({}, props))));
+}
+exports.renderWidget = renderWidget;
+const cnLabel = (0, classname_1.cn)('upload-label');
+function UploadLabel({ fileName, fileType, status, errorText, onReUploadClick, }) {
+    const icon = fileType === 'image' ? icons_2.icons.image : icons_2.icons.file;
+    if (status === 'uploading') {
+        return (react_1.default.createElement(uikit_1.Label, { size: "xs", theme: "info", icon: react_1.default.createElement(uikit_1.Icon, Object.assign({}, icon)), className: cnLabel({ status }) },
+            react_1.default.createElement("div", { className: cnLabel('content') },
+                react_1.default.createElement("span", { title: fileName, className: cnLabel('filename') }, fileName),
+                react_1.default.createElement(uikit_1.Spin, { size: "xs" }))));
+    }
+    if (status === 'success') {
+        return (react_1.default.createElement(uikit_1.Label, { size: "xs", theme: "success", icon: react_1.default.createElement(uikit_1.Icon, Object.assign({}, icon)), className: cnLabel({ status }) },
+            react_1.default.createElement("div", { className: cnLabel('content') },
+                react_1.default.createElement("span", { title: fileName, className: cnLabel('filename') }, fileName))));
+    }
+    if (status === 'error') {
+        return (react_1.default.createElement(uikit_1.Tooltip, { content: errorText },
+            react_1.default.createElement(uikit_1.Label, { size: "xs", interactive: true, theme: "danger", icon: react_1.default.createElement(uikit_1.Icon, Object.assign({}, icon)), onClick: onReUploadClick, className: cnLabel({ status }) },
+                react_1.default.createElement("div", { className: cnLabel('content') },
+                    react_1.default.createElement("span", { className: cnLabel('filename') }, fileName),
+                    react_1.default.createElement(uikit_1.Icon, { data: icons_1.ArrowsRotateRight, size: 16 })))));
+    }
+    return null;
+}
+exports.UploadLabel = UploadLabel;

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

@@ -0,0 +1,3 @@
+import { HighlightStyle } from '@codemirror/language';
+export declare const gravityHighlightStyle: HighlightStyle;
+export declare const gravityTheme: import("@codemirror/state").Extension;