@gravity-ui/markdown-editor 13.17.1 → 13.18.1

package/build/esm/extensions/yfm/GPT/gptExtension/view.js

@@ -0,0 +1,163 @@
+import React, { useCallback } from 'react';
+import { Popup } from '@gravity-ui/uikit';
+import { Slice } from 'prosemirror-model';
+import { TextSelection } from 'prosemirror-state';
+import { useMount } from 'react-use';
+import { cn } from '../../../../classname';
+import { getReactRendererFromState } from '../../../behavior';
+import { GptDialog } from '../GptDialog/GptDialog';
+import { WIDGET_DECO_CLASS_NAME, WIDGET_DECO_SPEC_FLAG, gptPopupPlacement } from '../constants';
+import { pluginKey } from '../plugin';
+import './view.css';
+export const cnGptPopup = cn('gpt-popup');
+export class GptWidgetDecoView {
+    constructor(view, params) {
+        this._decoElem = null;
+        this._onConfirmCancel = () => {
+            this._confirmOpen = false;
+            this._renderer.rerender();
+        };
+        this._onConfirmOk = () => {
+            this._onClose();
+        };
+        this._onGptAnswerUpdate = (answer) => {
+            var _a, _b;
+            (_b = (_a = this._params).onUpdate) === null || _b === void 0 ? void 0 : _b.call(_a, answer);
+        };
+        this._onSubmit = (answer) => {
+            var _a, _b;
+            const deco = this._getCurrentDecoration();
+            if (!deco)
+                return;
+            const { from, to } = deco;
+            const answerNode = this._parser.parse(answer);
+            const tr = this._view.state.tr;
+            const meta = { action: 'hide' };
+            tr.setMeta(pluginKey, meta);
+            tr.replace(from, to, new Slice(answerNode.content, 1, 1));
+            tr.setSelection(TextSelection.create(tr.doc, tr.mapping.map(to)));
+            this._view.dispatch(tr);
+            setTimeout(() => {
+                this._view.focus();
+            }, 0);
+            (_b = (_a = this._params).onApplyResult) === null || _b === void 0 ? void 0 : _b.call(_a, answer);
+            this._resetState();
+        };
+        this._onClose = () => {
+            var _a, _b;
+            const deco = this._getCurrentDecoration();
+            if (!deco) {
+                return;
+            }
+            const tr = this._view.state.tr;
+            const meta = { action: 'hide' };
+            tr.setSelection(TextSelection.create(tr.doc, deco.from, deco.to));
+            tr.setMeta(pluginKey, meta);
+            this._view.dispatch(tr);
+            setTimeout(() => {
+                this._view.focus();
+            }, 0);
+            (_b = (_a = this._params).onClose) === null || _b === void 0 ? void 0 : _b.call(_a);
+            this._resetState();
+        };
+        this._view = view;
+        this._params = params;
+        this._serializer = params.serializer;
+        this._parser = params.parser;
+        this._confirmOpen = false;
+        this._renderer = getReactRendererFromState(view.state).createItem('gpt-widget-view', this._render.bind(this));
+    }
+    update(view, prevState) {
+        var _a;
+        const { state, dispatch } = view;
+        if (this._decoElem && !state.selection.eq(prevState.selection)) {
+            const transaction = state.tr;
+            const meta = { action: 'hide' };
+            dispatch(transaction.setMeta(pluginKey, meta));
+            this._view.focus();
+            return;
+        }
+        const decoElements = Array.from(view.dom.querySelectorAll(`.${WIDGET_DECO_CLASS_NAME}`));
+        this._decoElem = (_a = decoElements.at(-1)) !== null && _a !== void 0 ? _a : null;
+        this._renderer.rerender();
+    }
+    destroy() {
+        this._resetState();
+        this._renderer.remove();
+    }
+    _resetState() {
+        this._decoElem = null;
+        this._confirmOpen = false;
+    }
+    _render() {
+        if (!this._decoElem)
+            return null;
+        const markup = this._getContentOfDecoration();
+        if (markup === undefined) {
+            return null;
+        }
+        return (React.createElement(Widget, { markup: markup, anchorRef: { current: this._decoElem }, answerRender: this._params.answerRender, promptPresets: this._params.promptPresets, disablePromptPresets: this._params.disablePromptPresets, customPromptPlaceholder: this._params.customPromptPlaceholder, disabledPromptPlaceholder: this._params.disabledPromptPlaceholder, gptAlertProps: this._params.gptAlertProps, 
+            /* eslint-disable-next-line react/jsx-handler-names */
+            onApplyResult: this._onSubmit, 
+            /* eslint-disable-next-line react/jsx-handler-names */
+            onCustomPromptApply: this._params.onCustomPromptApply, 
+            /* eslint-disable-next-line react/jsx-handler-names */
+            onPromptPresetClick: this._params.onPromptPresetClick, 
+            /* eslint-disable-next-line react/jsx-handler-names */
+            onTryAgain: this._params.onTryAgain, 
+            /* eslint-disable-next-line react/jsx-handler-names */
+            onLike: this._params.onLike, 
+            /* eslint-disable-next-line react/jsx-handler-names */
+            onDislike: this._params.onDislike, 
+            /* eslint-disable-next-line react/jsx-handler-names */
+            onClose: this._onClose, 
+            /* eslint-disable-next-line react/jsx-handler-names */
+            onUpdate: this._onGptAnswerUpdate, 
+            /* eslint-disable-next-line react/jsx-handler-names */
+            confirmOpen: this._confirmOpen, 
+            /* eslint-disable-next-line react/jsx-handler-names */
+            onConfirmOk: this._onConfirmOk, 
+            /* eslint-disable-next-line react/jsx-handler-names */
+            onConfirmCancel: this._onConfirmCancel, container: this._params.gptPopupContainer }));
+    }
+    _getContentOfDecoration() {
+        const deco = this._getCurrentDecoration();
+        if (!deco)
+            return undefined;
+        const { from, to } = deco;
+        try {
+            const fragment = this._view.state.doc.slice(from, to, true).content;
+            const yfmMarkup = this._serializer.serialize(fragment);
+            return yfmMarkup;
+        }
+        catch (error) {
+            console.error(error);
+            return this._view.state.doc.textBetween(from, to, '\n', '');
+        }
+    }
+    _getCurrentDecoration() {
+        var _a;
+        return (_a = this._getPluginState()) === null || _a === void 0 ? void 0 : _a.find(undefined, undefined, 
+        // eslint-disable-next-line @typescript-eslint/no-unsafe-member-access, @typescript-eslint/no-unsafe-return
+        (spec) => spec[WIDGET_DECO_SPEC_FLAG])[0];
+    }
+    _getPluginState() {
+        return pluginKey.getState(this._view.state);
+    }
+}
+function Widget({ markup, anchorRef, answerRender, promptPresets, disablePromptPresets, customPromptPlaceholder, disabledPromptPlaceholder, onCustomPromptApply, onApplyResult, onPromptPresetClick, onTryAgain, onLike, onDislike, onClose, onUpdate, container, gptAlertProps, }) {
+    useMount(() => {
+        if ((anchorRef === null || anchorRef === void 0 ? void 0 : anchorRef.current) && 'scrollIntoView' in anchorRef.current) {
+            anchorRef.current.scrollIntoView({
+                behavior: 'smooth',
+                block: 'center',
+            });
+        }
+    });
+    const handleUpdate = useCallback((result) => {
+        onUpdate === null || onUpdate === void 0 ? void 0 : onUpdate(result);
+    }, [onUpdate]);
+    return (React.createElement(React.Fragment, null,
+        React.createElement(Popup, { className: cnGptPopup(), contentClassName: cnGptPopup('content'), open: true, anchorRef: anchorRef, placement: gptPopupPlacement, onOutsideClick: onClose, focusTrap: true, autoFocus: !onCustomPromptApply && true, strategy: "absolute", container: container, onEscapeKeyDown: onClose },
+            React.createElement(GptDialog, { markup: markup, answerRender: answerRender, promptPresets: promptPresets, disablePromptPresets: disablePromptPresets, customPromptPlaceholder: customPromptPlaceholder, disabledPromptPlaceholder: disabledPromptPlaceholder, onApplyResult: onApplyResult, onCustomPromptApply: onCustomPromptApply, onPromptPresetClick: onPromptPresetClick, onTryAgain: onTryAgain, onLike: onLike, onDislike: onDislike, onClose: onClose, onUpdate: handleUpdate, gptAlertProps: gptAlertProps }))));
+}

package/build/esm/extensions/yfm/GPT/hooks/useGpt.d.ts

@@ -0,0 +1,27 @@
+import type { CommonAnswer, GptRequestData } from '../ErrorScreen/types';
+import type { GptDialogProps } from '../GptDialog/GptDialog';
+declare type UseGptProps<AnswerData extends CommonAnswer = CommonAnswer, PromptData extends unknown = unknown> = Pick<GptDialogProps<AnswerData, PromptData>, 'markup' | 'promptPresets' | 'onCustomPromptApply' | 'onPromptPresetClick' | 'onTryAgain' | 'onLike' | 'onDislike' | 'onApplyResult' | 'onUpdate'>;
+export declare const useGpt: <AnswerData extends CommonAnswer = CommonAnswer, PromptData extends unknown = unknown>({ markup, promptPresets, onCustomPromptApply, onPromptPresetClick, onTryAgain, onLike, onDislike, onApplyResult, onUpdate, }: UseGptProps<AnswerData, PromptData>) => {
+    answer: AnswerData | undefined;
+    customPrompt: string;
+    lastRequestData: GptRequestData<PromptData> | undefined;
+    loading: boolean;
+    error: boolean;
+    mode: "custom-and-presets" | "only-custom" | "only-presets";
+    feedbackType: "dislike" | "like" | undefined;
+    feedbackTypeLoading: "dislike" | "like" | undefined;
+    handleLike: () => Promise<void>;
+    handleDislike: () => Promise<void>;
+    handleCustomPromptUpdate: import("react").Dispatch<import("react").SetStateAction<string>>;
+    handleCustomPromptKeyPress: import("react").KeyboardEventHandler<HTMLInputElement>;
+    handleCustomPromptApply: () => Promise<void>;
+    handlePresetClick: (data: PromptData) => void;
+    handleTryAgain: () => Promise<void>;
+    handleFreshStart: () => void;
+    handleApplyResult: () => void;
+    showTryAgainButton: boolean;
+    showAnswer: boolean;
+    showError: boolean;
+    showAnswerActions: boolean | undefined;
+};
+export {};

package/build/esm/extensions/yfm/GPT/hooks/useGpt.js

@@ -0,0 +1,151 @@
+import { useCallback, useState } from 'react';
+import { isEnter } from '../utils';
+export const useGpt = ({ markup, promptPresets, onCustomPromptApply, onPromptPresetClick, onTryAgain, onLike, onDislike, onApplyResult, onUpdate, }) => {
+    const [answer, setAnswer] = useState();
+    const [lastRequestData, setLastRequestData] = useState();
+    const [customPrompt, setCustomPrompt] = useState('');
+    const [loading, setLoading] = useState(false);
+    const [error, setError] = useState(false);
+    const [feedbackType, setFeedbackType] = useState(undefined);
+    const [feedbackTypeLoading, setFeedbackTypeLoading] = useState(undefined);
+    const makeRequest = useCallback(async (requestFunction, data) => {
+        if (!requestFunction) {
+            return;
+        }
+        let result;
+        try {
+            setLoading(true);
+            setError(false);
+            setLastRequestData(data);
+            result = await requestFunction(data);
+            if (result) {
+                setAnswer(result);
+                setFeedbackType(undefined);
+            }
+        }
+        catch (error) {
+            console.error(error);
+            setError(true);
+        }
+        finally {
+            setLoading(false);
+            setTimeout(() => {
+                // hack for popup rerender
+                // When a lot of text is entered into the GPT popup,
+                // it expands and goes beyond the boundaries. However,
+                // the popup does not handle height changes.
+                window.dispatchEvent(new CustomEvent('scroll'));
+            });
+            onUpdate === null || onUpdate === void 0 ? void 0 : onUpdate(result);
+        }
+    }, [onUpdate]);
+    const handleLike = useCallback(async () => {
+        if (!onLike || !lastRequestData) {
+            return;
+        }
+        try {
+            setFeedbackType(undefined);
+            setFeedbackTypeLoading('like');
+            await onLike(lastRequestData);
+            setFeedbackType('like');
+        }
+        catch (error) {
+            console.error(error);
+        }
+        finally {
+            setFeedbackTypeLoading(undefined);
+        }
+    }, [lastRequestData, onLike]);
+    const handleDislike = useCallback(async () => {
+        if (!onDislike || !lastRequestData) {
+            return;
+        }
+        try {
+            setFeedbackType(undefined);
+            setFeedbackTypeLoading('dislike');
+            await onDislike(lastRequestData);
+            setFeedbackType('dislike');
+        }
+        catch (error) {
+            console.error(error);
+        }
+        finally {
+            setFeedbackTypeLoading(undefined);
+        }
+    }, [lastRequestData, onDislike]);
+    const handleCustomPromptApply = useCallback(async () => {
+        if (!customPrompt) {
+            return;
+        }
+        const gptRequestData = {
+            markup,
+            customPrompt,
+        };
+        await makeRequest(onCustomPromptApply, gptRequestData);
+    }, [customPrompt, makeRequest, markup, onCustomPromptApply]);
+    const handleCustomPromptKeyPress = useCallback(async (event) => {
+        if (!isEnter(event)) {
+            return;
+        }
+        await handleCustomPromptApply();
+    }, [handleCustomPromptApply]);
+    const handlePresetClick = useCallback(async (data) => {
+        const gptRequestData = {
+            markup,
+            promptData: data,
+        };
+        await makeRequest(onPromptPresetClick, gptRequestData);
+    }, [makeRequest, markup, onPromptPresetClick]);
+    const handleTryAgain = useCallback(async () => {
+        if (!lastRequestData) {
+            return;
+        }
+        await makeRequest(onTryAgain, lastRequestData);
+    }, [lastRequestData, makeRequest, onTryAgain]);
+    const handleApplyResult = useCallback(() => {
+        var _a;
+        onApplyResult((_a = answer === null || answer === void 0 ? void 0 : answer.rawText) !== null && _a !== void 0 ? _a : '');
+    }, [answer === null || answer === void 0 ? void 0 : answer.rawText, onApplyResult]);
+    const handleFreshStart = useCallback(() => {
+        setError(false);
+        setLastRequestData(undefined);
+        setAnswer(undefined);
+        setCustomPrompt('');
+        setFeedbackType(undefined);
+        onUpdate === null || onUpdate === void 0 ? void 0 : onUpdate(undefined);
+    }, [onUpdate]);
+    const showTryAgainButton = Boolean(lastRequestData && onTryAgain && !loading);
+    const showAnswer = Boolean(answer && !loading && !error);
+    const showError = error && !loading;
+    const showAnswerActions = (onLike || onDislike) && showAnswer;
+    let mode = 'custom-and-presets';
+    if (onCustomPromptApply && !(promptPresets === null || promptPresets === void 0 ? void 0 : promptPresets.length)) {
+        mode = 'only-custom';
+    }
+    else if (!onCustomPromptApply && (promptPresets === null || promptPresets === void 0 ? void 0 : promptPresets.length)) {
+        mode = 'only-presets';
+    }
+    return {
+        answer,
+        customPrompt,
+        lastRequestData,
+        loading,
+        error,
+        mode,
+        feedbackType,
+        feedbackTypeLoading,
+        handleLike,
+        handleDislike,
+        handleCustomPromptUpdate: setCustomPrompt,
+        handleCustomPromptKeyPress,
+        handleCustomPromptApply,
+        handlePresetClick,
+        handleTryAgain,
+        handleFreshStart,
+        handleApplyResult,
+        showTryAgainButton,
+        showAnswer,
+        showError,
+        showAnswerActions,
+    };
+};

package/build/esm/extensions/yfm/GPT/hooks/useGptHotKeys.d.ts

@@ -0,0 +1,2 @@
+import type { Options } from 'react-hotkeys-hook';
+export declare function useGptHotKeys(key: string, callback: () => void, options?: Options, dependencies?: unknown[]): void;

package/build/esm/extensions/yfm/GPT/hooks/useGptHotKeys.js

@@ -0,0 +1,4 @@
+import { useHotkeys } from 'react-hotkeys-hook';
+export function useGptHotKeys(key, callback, options = {}, dependencies) {
+    useHotkeys(key, callback, Object.assign({ preventDefault: true }, options), dependencies);
+}

package/build/esm/extensions/yfm/GPT/hooks/useOverflowingHorizontalItems.d.ts

@@ -0,0 +1,13 @@
+import type { RefObject } from 'react';
+export declare type UseOverflowingContainerListItemsProps<ItemType extends unknown> = {
+    containerRef: RefObject<HTMLElement>;
+    items?: ItemType[];
+    itemSelector: string;
+    moreButtonSelector: string;
+    marginBetweenItems?: number;
+};
+export declare function useOverflowingHorizontalItems<ItemType>({ containerRef, items, itemSelector, moreButtonSelector, marginBetweenItems, }: UseOverflowingContainerListItemsProps<ItemType>): {
+    visibleItems: ItemType[];
+    hiddenItems: ItemType[];
+    measured: boolean;
+};

package/build/esm/extensions/yfm/GPT/hooks/useOverflowingHorizontalItems.js

@@ -0,0 +1,65 @@
+import { useLayoutEffect, useMemo, useState } from 'react';
+import debounceFn from 'lodash/debounce';
+export function useOverflowingHorizontalItems({ containerRef, items, itemSelector, moreButtonSelector, marginBetweenItems = 0, }) {
+    const [containerWidth, setContainerWidth] = useState(0);
+    const [itemWidths, setItemWidths] = useState([]);
+    const [moreButtonWidth, setMoreButtonWidth] = useState(0);
+    useLayoutEffect(() => {
+        const measureItemSizes = () => {
+            var _a, _b, _c;
+            const itemElements = Array.from((_b = (_a = containerRef.current) === null || _a === void 0 ? void 0 : _a.querySelectorAll(itemSelector)) !== null && _b !== void 0 ? _b : []);
+            const moreButton = (_c = containerRef.current) === null || _c === void 0 ? void 0 : _c.querySelector(moreButtonSelector);
+            setItemWidths(itemElements.map((item) => item.clientWidth));
+            if (moreButton) {
+                setMoreButtonWidth(moreButton.clientWidth);
+            }
+        };
+        requestAnimationFrame(measureItemSizes);
+    }, [containerRef, itemSelector, moreButtonSelector]);
+    useLayoutEffect(() => {
+        const container = containerRef.current;
+        if (!container) {
+            return;
+        }
+        const updateContainerSize = (entries) => {
+            if (entries.length > 0) {
+                setContainerWidth(entries[0].contentRect.width);
+            }
+        };
+        const updateContainerSizeDebounced = debounceFn(updateContainerSize, 100);
+        const containerResizeObserver = new ResizeObserver(updateContainerSizeDebounced);
+        containerResizeObserver.observe(container);
+        return () => containerResizeObserver.unobserve(container);
+    }, [containerRef]);
+    const isMeasured = itemWidths.length > 0;
+    const { visibleItems, hiddenItems } = useMemo(() => {
+        var _a, _b;
+        if (!isMeasured) {
+            return {
+                visibleItems: items !== null && items !== void 0 ? items : [],
+                hiddenItems: [],
+            };
+        }
+        const itemsCount = itemWidths.length;
+        let visibleItemsCount = 0;
+        const spaceForMoreButton = moreButtonWidth + marginBetweenItems;
+        let remainingContainerWidth = containerWidth;
+        for (const width of itemWidths) {
+            const itemWidthWithMargin = width + marginBetweenItems;
+            remainingContainerWidth -= itemWidthWithMargin;
+            if (remainingContainerWidth < spaceForMoreButton) {
+                const isMoreThanOneItemLeft = itemsCount !== visibleItemsCount + 1;
+                const hasNoSpaceForTheLastItem = remainingContainerWidth < 0;
+                if (isMoreThanOneItemLeft || hasNoSpaceForTheLastItem) {
+                    break;
+                }
+            }
+            visibleItemsCount++;
+        }
+        return {
+            visibleItems: (_a = items === null || items === void 0 ? void 0 : items.slice(0, visibleItemsCount)) !== null && _a !== void 0 ? _a : [],
+            hiddenItems: (_b = items === null || items === void 0 ? void 0 : items.slice(visibleItemsCount)) !== null && _b !== void 0 ? _b : [],
+        };
+    }, [containerWidth, isMeasured, itemWidths, items, marginBetweenItems, moreButtonWidth]);
+    return { visibleItems, hiddenItems, measured: isMeasured };
+}

package/build/esm/extensions/yfm/GPT/hooks/usePresetList.d.ts

@@ -0,0 +1,14 @@
+import type { DropdownMenuItem } from '@gravity-ui/uikit';
+import type { GptDialogProps } from '../GptDialog/GptDialog';
+import type { PresetListProps } from '../PresetList/PresetList';
+declare type UsePresetListProps = Pick<GptDialogProps, 'promptPresets'> & {
+    onPresetClick: PresetListProps['onPresetClick'];
+};
+export declare const usePresetList: ({ promptPresets, onPresetClick }: UsePresetListProps) => {
+    measured: boolean;
+    showMoreButton: boolean;
+    presetsContainerRef: import("react").RefObject<HTMLDivElement>;
+    visiblePresets: import("../ErrorScreen/types").PromptPreset<unknown>[];
+    hiddenPresets: DropdownMenuItem<unknown>[];
+};
+export {};

package/build/esm/extensions/yfm/GPT/hooks/usePresetList.js

@@ -0,0 +1,32 @@
+import { useMemo, useRef } from 'react';
+import { cnGptDialogPresetList } from '../PresetList/PresetList';
+import { useOverflowingHorizontalItems } from './useOverflowingHorizontalItems';
+export const usePresetList = ({ promptPresets, onPresetClick }) => {
+    const presetsContainerRef = useRef(null);
+    const { visibleItems, hiddenItems, measured } = useOverflowingHorizontalItems({
+        containerRef: presetsContainerRef,
+        items: promptPresets,
+        itemSelector: `.${cnGptDialogPresetList('preset')}`,
+        moreButtonSelector: `.${cnGptDialogPresetList('more-button-wrapper')}`,
+        marginBetweenItems: 8,
+    });
+    const hiddenPresets = useMemo(() => {
+        const items = [];
+        for (const item of hiddenItems) {
+            items.push({
+                text: item.display,
+                action: () => onPresetClick(item.data),
+                items: [],
+            });
+        }
+        return items;
+    }, [onPresetClick, hiddenItems]);
+    const showMoreButton = !measured || hiddenPresets.length > 0;
+    return {
+        measured,
+        showMoreButton,
+        presetsContainerRef,
+        visiblePresets: visibleItems,
+        hiddenPresets,
+    };
+};

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

@@ -0,0 +1,2 @@
+export * from './toolbar';
+export * from './gptExtension/gptExtension';

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

@@ -0,0 +1,2 @@
+export * from './toolbar';
+export * from './gptExtension/gptExtension';

package/build/esm/extensions/yfm/GPT/plugin.d.ts

@@ -0,0 +1,13 @@
+import { Plugin, PluginKey } from 'prosemirror-state';
+import { DecorationSet } from 'prosemirror-view';
+import type { GptWidgetDecoViewParams } from './gptExtension/view';
+export declare type GptWidgetMeta = {
+    action: 'show';
+    from: number;
+    to: number;
+} | {
+    action: 'hide';
+};
+declare const key: PluginKey<DecorationSet>;
+export { key as pluginKey };
+export declare const gptWidgetPlugin: (params: GptWidgetDecoViewParams) => Plugin;

package/build/esm/extensions/yfm/GPT/plugin.js

@@ -0,0 +1,43 @@
+import { Plugin, PluginKey } from 'prosemirror-state';
+import { Decoration, DecorationSet } from 'prosemirror-view';
+import { WIDGET_DECO_CLASS_NAME, WIDGET_DECO_SPEC_FLAG } from './constants';
+import { GptWidgetDecoView } from './gptExtension/view';
+const key = new PluginKey('gpt-widget');
+export { key as pluginKey };
+export const gptWidgetPlugin = (params) => {
+    return new Plugin({
+        key,
+        state: {
+            init: () => DecorationSet.empty,
+            apply: (tr, decos) => {
+                const meta = tr.getMeta(key);
+                const paramsGpt = params;
+                if ((meta === null || meta === void 0 ? void 0 : meta.action) === 'show') {
+                    if (meta.to === meta.from) {
+                        const spanElem = document.createElement('span');
+                        spanElem.className = WIDGET_DECO_CLASS_NAME;
+                        spanElem.textContent = ' ';
+                        paramsGpt.disablePromptPresets = true;
+                        return DecorationSet.create(tr.doc, [
+                            Decoration.widget(meta.from, spanElem, {
+                                [WIDGET_DECO_SPEC_FLAG]: true,
+                            }),
+                        ]);
+                    }
+                    return DecorationSet.create(tr.doc, [
+                        Decoration.inline(meta.from, meta.to, { nodeName: 'span', class: WIDGET_DECO_CLASS_NAME }, { [WIDGET_DECO_SPEC_FLAG]: true }),
+                    ]);
+                }
+                if ((meta === null || meta === void 0 ? void 0 : meta.action) === 'hide') {
+                    paramsGpt.disablePromptPresets = false;
+                    return DecorationSet.empty;
+                }
+                return decos.map(tr.mapping, tr.doc);
+            },
+        },
+        props: {
+            decorations: (state) => key.getState(state),
+        },
+        view: (view) => new GptWidgetDecoView(view, params),
+    });
+};

package/build/esm/extensions/yfm/GPT/toolbar.d.ts

@@ -0,0 +1,3 @@
+import { type WToolbarSingleItemData } from '../../../toolbar';
+export declare const cnGptButton: import("@bem-react/classname").ClassNameFormatter;
+export declare const wGptToolbarItem: WToolbarSingleItemData;

package/build/esm/extensions/yfm/GPT/toolbar.js

@@ -0,0 +1,18 @@
+import { cn } from '@bem-react/classname';
+import { i18n } from '../../../i18n/gpt/extension';
+import gptIcon from '../../../icons/GPT';
+import { ToolbarDataType } from '../../../toolbar';
+import { gptHotKeys } from './constants';
+export const cnGptButton = cn('gpt-button');
+export const wGptToolbarItem = {
+    type: ToolbarDataType.SingleButton,
+    id: 'gpt',
+    title: () => `${i18n('help-with-text')}`,
+    hotkey: gptHotKeys.openGptKeyTooltip,
+    icon: { data: gptIcon },
+    disabledPopoverVisible: false,
+    exec: (actionsStorage) => actionsStorage.actions.addGptWidget.run({}),
+    isActive: (actionsStorage) => actionsStorage.actions.addGptWidget.isActive(),
+    isEnable: (actionsStorage) => actionsStorage.actions.addGptWidget.isEnable(),
+    className: cnGptButton(),
+};

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

@@ -0,0 +1,13 @@
+import type React from 'react';
+import { GptDialogProps } from './GptDialog/GptDialog';
+declare type CombinedKeyboardEvent = KeyboardEvent | React.KeyboardEvent;
+export declare function getAlertGptInfo(gptAlert: GptDialogProps['gptAlertProps']): {
+    alertMessage: string;
+    alertTheme: import("@gravity-ui/uikit/build/esm/components/Alert/types").AlertTheme;
+    alertClassName: string | undefined;
+};
+export declare function getDisableReplaceButtonText(disablePromptPresets?: boolean): string;
+export declare function getInputPlaceHolder(disablePromptPresets?: boolean, disabledPromptPlaceholder?: string, customPromptPlaceholder?: string): string | undefined;
+export declare const isEnter: (event: CombinedKeyboardEvent) => boolean;
+export declare function focusWithoutScroll(element?: HTMLElement | null): void;
+export {};

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

@@ -0,0 +1,23 @@
+import { i18n } from '../../../i18n/gpt/dialog';
+export function getAlertGptInfo(gptAlert) {
+    return {
+        alertMessage: (gptAlert === null || gptAlert === void 0 ? void 0 : gptAlert.message) || i18n('alert-gpt-presets-info'),
+        alertTheme: (gptAlert === null || gptAlert === void 0 ? void 0 : gptAlert.theme) || 'info',
+        alertClassName: gptAlert === null || gptAlert === void 0 ? void 0 : gptAlert.className,
+    };
+}
+export function getDisableReplaceButtonText(disablePromptPresets) {
+    return disablePromptPresets ? i18n(`replace-disabled`) : i18n(`replace`);
+}
+export function getInputPlaceHolder(disablePromptPresets, disabledPromptPlaceholder, customPromptPlaceholder) {
+    return disablePromptPresets ? disabledPromptPlaceholder : customPromptPlaceholder;
+}
+export const isEnter = (event) => event.code === 'Enter' || event.code === 'NumpadEnter';
+export function focusWithoutScroll(element) {
+    const x = window.scrollX;
+    const y = window.scrollY;
+    element === null || element === void 0 ? void 0 : element.focus({
+        preventScroll: true,
+    });
+    window.scrollTo(x, y);
+}

package/build/esm/extensions/yfm/YfmTable/plugins/YfmTableControls/actions.d.ts

@@ -1 +1 @@
-export declare const controlActions: Record<"deleteTable" | "addRow" | "deleteRow" | "addColumn" | "deleteColumn" | "appendColumn" | "appendRow", import("../../../../../core").ActionSpec>;
+export declare const controlActions: Record<"deleteTable" | "deleteRow" | "deleteColumn" | "appendColumn" | "appendRow", import("../../../../../core").ActionSpec>;

package/build/esm/extensions/yfm/YfmTable/plugins/YfmTableControls/actions.js

@@ -1,4 +1,4 @@
-import { addColumnAfter, addRowAfter, appendColumn, appendRow, removeColumn, removeRow, } from '../../../../../table-utils';
+import { appendColumn, appendRow, removeColumn, removeRow } from '../../../../../table-utils';
 import { defineActions } from '../../../../../utils/actions';
 import { removeNode } from '../../../../../utils/remove-node';
 import { tableControlsPluginKey } from './buttons';
@@ -20,18 +20,10 @@ const removeYfmTable = (state, dispatch, _, attrs) => {
     return true;
 };
 export const controlActions = defineActions({
-    addRow: {
-        isEnable: addRowAfter,
-        run: addRowAfter,
-    },
     deleteRow: {
         isEnable: removeRow,
         run: removeRow,
     },
-    addColumn: {
-        isEnable: addColumnAfter,
-        run: addColumnAfter,
-    },
     deleteColumn: {
         isEnable: removeColumn,
         run: removeColumn,

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

@@ -11,3 +11,4 @@ export * from './YfmHeading';
 export * from './YfmNote';
 export * from './YfmTable';
 export * from './YfmTabs';
+export * from './GPT';

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

@@ -11,3 +11,4 @@ export * from './YfmHeading';
 export * from './YfmNote';
 export * from './YfmTable';
 export * from './YfmTabs';
+export * from './GPT';