@gravity-ui/markdown-editor 15.19.1 → 15.20.0

package/build/esm/extensions/yfm/YfmTable/plugins/YfmTableControls/components/FloatingMenuControl/FloatingMenuControl.js

@@ -0,0 +1,63 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useMemo } from 'react';
+import { ArrowDown, ArrowLeft, ArrowRight, ArrowUp, BroomMotion as ClearCells, TrashBin, Xmark, } from '@gravity-ui/icons';
+import { Icon } from '@gravity-ui/uikit';
+import { i18n } from "../../../../../../../i18n/yfm-table/index.js";
+import { FloatingMenu } from "../FloatingMenu/FloatingMenu.js";
+export const FloatingMenuControl = function YfmTableFloatingMenuControl({ type, multiple, dndHandler, acnhorElement, onMenuOpenToggle, onClearCellsClick, onInsertBeforeClick, onInsertAfterClick, onRemoveRangeClick, onRemoveTableClick, }) {
+    const dropdownItems = useMemo(() => [
+        [
+            {
+                text: i18n(`${type}.add.before`),
+                qa: `g-md-yfm-table-action-add-${type}-before`,
+                action: onInsertBeforeClick,
+                iconStart: _jsx(Icon, { data: type === 'row' ? ArrowUp : ArrowLeft }),
+            },
+            {
+                text: i18n(`${type}.add.after`),
+                qa: `g-md-yfm-table-action-add-${type}-after`,
+                action: onInsertAfterClick,
+                iconStart: _jsx(Icon, { data: type === 'row' ? ArrowDown : ArrowRight }),
+            },
+        ],
+        [
+            {
+                text: i18n('cells.clear'),
+                qa: `g-md-yfm-table-${type}-clear-cells`,
+                action: onClearCellsClick,
+                iconStart: _jsx(Icon, { data: ClearCells }),
+            },
+        ],
+        [
+            {
+                text: i18n(`${type}.remove${multiple ? '.multiple' : ''}`),
+                qa: `g-md-yfm-table-action-remove-${type}`,
+                action: onRemoveRangeClick,
+                iconStart: _jsx(Icon, { data: Xmark }),
+            },
+            {
+                theme: 'danger',
+                text: i18n('table.remove'),
+                qa: 'g-md-yfm-table-action-remove-table',
+                action: onRemoveTableClick,
+                iconStart: _jsx(Icon, { data: TrashBin }),
+            },
+        ],
+    ], [
+        type,
+        multiple,
+        onClearCellsClick,
+        onInsertAfterClick,
+        onInsertBeforeClick,
+        onRemoveRangeClick,
+        onRemoveTableClick,
+    ]);
+    return (_jsx(FloatingMenu, { dirtype: type, canDrag: dndHandler ? dndHandler.canDrag() : false, onOpenToggle: onMenuOpenToggle, anchorElement: acnhorElement, switcherMouseProps: dndHandler
+            ? {
+                onMouseDown: dndHandler.control_handleMouseDown,
+                onMouseMove: dndHandler.control_handleMouseMove,
+                onMouseUp: dndHandler.control_handleMouseUp,
+            }
+            : undefined, dropdownItems: dropdownItems }));
+};
+//# sourceMappingURL=FloatingMenuControl.js.map

package/build/esm/extensions/yfm/YfmTable/plugins/YfmTableControls/components/FloatingMenuControl/FloatingMenuControl.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FloatingMenuControl.js","sourceRoot":"../../../../../../../../../src","sources":["extensions/yfm/YfmTable/plugins/YfmTableControls/components/FloatingMenuControl/FloatingMenuControl.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAC,OAAO,EAAC,MAAM,OAAO,CAAC;AAE9B,OAAO,EACH,SAAS,EACT,SAAS,EACT,UAAU,EACV,OAAO,EACP,WAAW,IAAI,UAAU,EACzB,QAAQ,EACR,KAAK,GACR,MAAM,mBAAmB,CAAC;AAC3B,OAAO,EAAC,IAAI,EAAC,MAAM,mBAAmB,CAAC;AAEvC,OAAO,EAAC,IAAI,EAAC,qDAA2B;AAGxC,OAAO,EAAC,YAAY,EAAyB,wCAAqC;AAelF,MAAM,CAAC,MAAM,mBAAmB,GAC5B,SAAS,2BAA2B,CAAC,EACjC,IAAI,EACJ,QAAQ,EACR,UAAU,EACV,aAAa,EACb,gBAAgB,EAChB,iBAAiB,EACjB,mBAAmB,EACnB,kBAAkB,EAClB,kBAAkB,EAClB,kBAAkB,GACrB;IACG,MAAM,aAAa,GAAG,OAAO,CACzB,GAAG,EAAE,CACD;QACI;YACI;gBACI,IAAI,EAAE,IAAI,CAAC,GAAG,IAAI,aAAa,CAAC;gBAChC,EAAE,EAAE,6BAA6B,IAAI,SAAS;gBAC9C,MAAM,EAAE,mBAAmB;gBAC3B,SAAS,EAAE,KAAC,IAAI,IAAC,IAAI,EAAE,IAAI,KAAK,KAAK,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,SAAS,GAAI;aAClE;YACD;gBACI,IAAI,EAAE,IAAI,CAAC,GAAG,IAAI,YAAY,CAAC;gBAC/B,EAAE,EAAE,6BAA6B,IAAI,QAAQ;gBAC7C,MAAM,EAAE,kBAAkB;gBAC1B,SAAS,EAAE,KAAC,IAAI,IAAC,IAAI,EAAE,IAAI,KAAK,KAAK,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,UAAU,GAAI;aACrE;SACJ;QACD;YACI;gBACI,IAAI,EAAE,IAAI,CAAC,aAAa,CAAC;gBACzB,EAAE,EAAE,kBAAkB,IAAI,cAAc;gBACxC,MAAM,EAAE,iBAAiB;gBACzB,SAAS,EAAE,KAAC,IAAI,IAAC,IAAI,EAAE,UAAU,GAAI;aACxC;SACJ;QACD;YACI;gBACI,IAAI,EAAE,IAAI,CAAC,GAAG,IAAI,UAAU,QAAQ,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC;gBAC1D,EAAE,EAAE,gCAAgC,IAAI,EAAE;gBAC1C,MAAM,EAAE,kBAAkB;gBAC1B,SAAS,EAAE,KAAC,IAAI,IAAC,IAAI,EAAE,KAAK,GAAI;aACnC;YACD;gBACI,KAAK,EAAE,QAAQ;gBACf,IAAI,EAAE,IAAI,CAAC,cAAc,CAAC;gBAC1B,EAAE,EAAE,oCAAoC;gBACxC,MAAM,EAAE,kBAAkB;gBAC1B,SAAS,EAAE,KAAC,IAAI,IAAC,IAAI,EAAE,QAAQ,GAAI;aACtC;SACJ;KACyC,EAClD;QACI,IAAI;QACJ,QAAQ;QACR,iBAAiB;QACjB,kBAAkB;QAClB,mBAAmB;QACnB,kBAAkB;QAClB,kBAAkB;KACrB,CACJ,CAAC;IAEF,OAAO,CACH,KAAC,YAAY,IACT,OAAO,EAAE,IAAI,EACb,OAAO,EAAE,UAAU,CAAC,CAAC,CAAC,UAAU,CAAC,OAAO,EAAE,CAAC,CAAC,CAAC,KAAK,EAClD,YAAY,EAAE,gBAAgB,EAC9B,aAAa,EAAE,aAAa,EAC5B,kBAAkB,EACd,UAAU;YACN,CAAC,CAAC;gBACI,WAAW,EAAE,UAAU,CAAC,uBAAuB;gBAC/C,WAAW,EAAE,UAAU,CAAC,uBAAuB;gBAC/C,SAAS,EAAE,UAAU,CAAC,qBAAqB;aAC9C;YACH,CAAC,CAAC,SAAS,EAEnB,aAAa,EAAE,aAAa,GAC9B,CACL,CAAC;AACN,CAAC,CAAC","sourcesContent":["import {useMemo} from 'react';\n\nimport {\n    ArrowDown,\n    ArrowLeft,\n    ArrowRight,\n    ArrowUp,\n    BroomMotion as ClearCells,\n    TrashBin,\n    Xmark,\n} from '@gravity-ui/icons';\nimport {Icon} from '@gravity-ui/uikit';\n\nimport {i18n} from 'src/i18n/yfm-table';\n\nimport type {DnDControlHandler} from '../../dnd/dnd';\nimport {FloatingMenu, type FloatingMenuProps} from '../FloatingMenu/FloatingMenu';\n\nexport type FloatingMenuControlProps = {\n    acnhorElement: Element;\n    multiple: boolean;\n    type: FloatingMenuProps['dirtype'];\n    dndHandler?: DnDControlHandler;\n    onMenuOpenToggle: FloatingMenuProps['onOpenToggle'];\n    onClearCellsClick: () => void;\n    onInsertBeforeClick: () => void;\n    onInsertAfterClick: () => void;\n    onRemoveRangeClick: () => void;\n    onRemoveTableClick: () => void;\n};\n\nexport const FloatingMenuControl: React.FC<FloatingMenuControlProps> =\n    function YfmTableFloatingMenuControl({\n        type,\n        multiple,\n        dndHandler,\n        acnhorElement,\n        onMenuOpenToggle,\n        onClearCellsClick,\n        onInsertBeforeClick,\n        onInsertAfterClick,\n        onRemoveRangeClick,\n        onRemoveTableClick,\n    }) {\n        const dropdownItems = useMemo<FloatingMenuProps['dropdownItems']>(\n            () =>\n                [\n                    [\n                        {\n                            text: i18n(`${type}.add.before`),\n                            qa: `g-md-yfm-table-action-add-${type}-before`,\n                            action: onInsertBeforeClick,\n                            iconStart: <Icon data={type === 'row' ? ArrowUp : ArrowLeft} />,\n                        },\n                        {\n                            text: i18n(`${type}.add.after`),\n                            qa: `g-md-yfm-table-action-add-${type}-after`,\n                            action: onInsertAfterClick,\n                            iconStart: <Icon data={type === 'row' ? ArrowDown : ArrowRight} />,\n                        },\n                    ],\n                    [\n                        {\n                            text: i18n('cells.clear'),\n                            qa: `g-md-yfm-table-${type}-clear-cells`,\n                            action: onClearCellsClick,\n                            iconStart: <Icon data={ClearCells} />,\n                        },\n                    ],\n                    [\n                        {\n                            text: i18n(`${type}.remove${multiple ? '.multiple' : ''}`),\n                            qa: `g-md-yfm-table-action-remove-${type}`,\n                            action: onRemoveRangeClick,\n                            iconStart: <Icon data={Xmark} />,\n                        },\n                        {\n                            theme: 'danger',\n                            text: i18n('table.remove'),\n                            qa: 'g-md-yfm-table-action-remove-table',\n                            action: onRemoveTableClick,\n                            iconStart: <Icon data={TrashBin} />,\n                        },\n                    ],\n                ] satisfies FloatingMenuProps['dropdownItems'],\n            [\n                type,\n                multiple,\n                onClearCellsClick,\n                onInsertAfterClick,\n                onInsertBeforeClick,\n                onRemoveRangeClick,\n                onRemoveTableClick,\n            ],\n        );\n\n        return (\n            <FloatingMenu\n                dirtype={type}\n                canDrag={dndHandler ? dndHandler.canDrag() : false}\n                onOpenToggle={onMenuOpenToggle}\n                anchorElement={acnhorElement}\n                switcherMouseProps={\n                    dndHandler\n                        ? {\n                              onMouseDown: dndHandler.control_handleMouseDown,\n                              onMouseMove: dndHandler.control_handleMouseMove,\n                              onMouseUp: dndHandler.control_handleMouseUp,\n                          }\n                        : undefined\n                }\n                dropdownItems={dropdownItems}\n            />\n        );\n    };\n"]}

package/build/esm/extensions/yfm/YfmTable/plugins/YfmTableControls/components/FloatingMenuControl/index.d.ts

@@ -0,0 +1 @@
+export * from "./FloatingMenuControl.js";

package/build/esm/extensions/yfm/YfmTable/plugins/YfmTableControls/components/FloatingMenuControl/index.js

@@ -0,0 +1,2 @@
+export * from "./FloatingMenuControl.js";
+//# sourceMappingURL=index.js.map

package/build/esm/extensions/yfm/YfmTable/plugins/YfmTableControls/components/FloatingMenuControl/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"../../../../../../../../../src","sources":["extensions/yfm/YfmTable/plugins/YfmTableControls/components/FloatingMenuControl/index.ts"],"names":[],"mappings":"AAAA,yCAAsC","sourcesContent":["export * from './FloatingMenuControl';\n"]}

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

@@ -0,0 +1,4 @@
+import { type InsertCursorProps } from "./InsertCursor.js";
+import { type PlusButtonProps } from "./PlusButton.js";
+export type FloatingPlusButtonProps = Pick<PlusButtonProps, 'onClick'> & Pick<InsertCursorProps, 'type' | 'anchor'>;
+export declare const FloatingPlusButton: React.FC<FloatingPlusButtonProps>;

package/build/esm/extensions/yfm/YfmTable/plugins/YfmTableControls/components/FloatingPlusButton/FloatingPlusButton.js

@@ -0,0 +1,22 @@
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState } from 'react';
+import { FloatingPopup } from "../FloatingPopup/index.js";
+import { InsertCursor } from "./InsertCursor.js";
+import { PlusButton } from "./PlusButton.js";
+const styles = {
+    borderRadius: '100px', // button circle border radius
+    background: 'transparent',
+};
+const placementByType = {
+    row: 'left-end',
+    column: 'top-end',
+};
+const offsetByType = {
+    row: { alignmentAxis: -10 },
+    column: { alignmentAxis: -10 },
+};
+export const FloatingPlusButton = function YfmTableFloatingPlusButton({ anchor, type, ...btnProps }) {
+    const [hovered, setHovered] = useState(false);
+    return (_jsxs(_Fragment, { children: [_jsx(FloatingPopup, { open: true, anchorElement: anchor, placement: placementByType[type], offset: offsetByType[type], style: styles, children: _jsx(PlusButton, { ...btnProps, onHoverChange: setHovered, qa: `g-md-yfm-table-plus-${type}` }) }), hovered && _jsx(InsertCursor, { anchor: anchor, type: type })] }));
+};
+//# sourceMappingURL=FloatingPlusButton.js.map

package/build/esm/extensions/yfm/YfmTable/plugins/YfmTableControls/components/FloatingPlusButton/FloatingPlusButton.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FloatingPlusButton.js","sourceRoot":"../../../../../../../../../src","sources":["extensions/yfm/YfmTable/plugins/YfmTableControls/components/FloatingPlusButton/FloatingPlusButton.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAC,QAAQ,EAAC,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAC,aAAa,EAA0B,kCAAyB;AAExE,OAAO,EAAC,YAAY,EAAyB,0BAAuB;AACpE,OAAO,EAAC,UAAU,EAAuB,wBAAqB;AAE9D,MAAM,MAAM,GAAwB;IAChC,YAAY,EAAE,OAAO,EAAE,8BAA8B;IACrD,UAAU,EAAE,aAAa;CAC5B,CAAC;AACF,MAAM,eAAe,GAAuE;IACxF,GAAG,EAAE,UAAU;IACf,MAAM,EAAE,SAAS;CACpB,CAAC;AACF,MAAM,YAAY,GAAoE;IAClF,GAAG,EAAE,EAAC,aAAa,EAAE,CAAC,EAAE,EAAC;IACzB,MAAM,EAAE,EAAC,aAAa,EAAE,CAAC,EAAE,EAAC;CAC/B,CAAC;AAKF,MAAM,CAAC,MAAM,kBAAkB,GAC3B,SAAS,0BAA0B,CAAC,EAAC,MAAM,EAAE,IAAI,EAAE,GAAG,QAAQ,EAAC;IAC3D,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAE9C,OAAO,CACH,8BACI,KAAC,aAAa,IACV,IAAI,QACJ,aAAa,EAAE,MAAM,EACrB,SAAS,EAAE,eAAe,CAAC,IAAI,CAAC,EAChC,MAAM,EAAE,YAAY,CAAC,IAAI,CAAC,EAC1B,KAAK,EAAE,MAAM,YAEb,KAAC,UAAU,OACH,QAAQ,EACZ,aAAa,EAAE,UAAU,EACzB,EAAE,EAAE,uBAAuB,IAAI,EAAE,GACnC,GACU,EACf,OAAO,IAAI,KAAC,YAAY,IAAC,MAAM,EAAE,MAAM,EAAE,IAAI,EAAE,IAAI,GAAI,IACzD,CACN,CAAC;AACN,CAAC,CAAC","sourcesContent":["import {useState} from 'react';\n\nimport {FloatingPopup, type FloatingPopupProps} from '../FloatingPopup';\n\nimport {InsertCursor, type InsertCursorProps} from './InsertCursor';\nimport {PlusButton, type PlusButtonProps} from './PlusButton';\n\nconst styles: React.CSSProperties = {\n    borderRadius: '100px', // button circle border radius\n    background: 'transparent',\n};\nconst placementByType: Record<InsertCursorProps['type'], FloatingPopupProps['placement']> = {\n    row: 'left-end',\n    column: 'top-end',\n};\nconst offsetByType: Record<InsertCursorProps['type'], FloatingPopupProps['offset']> = {\n    row: {alignmentAxis: -10},\n    column: {alignmentAxis: -10},\n};\n\nexport type FloatingPlusButtonProps = Pick<PlusButtonProps, 'onClick'> &\n    Pick<InsertCursorProps, 'type' | 'anchor'>;\n\nexport const FloatingPlusButton: React.FC<FloatingPlusButtonProps> =\n    function YfmTableFloatingPlusButton({anchor, type, ...btnProps}) {\n        const [hovered, setHovered] = useState(false);\n\n        return (\n            <>\n                <FloatingPopup\n                    open\n                    anchorElement={anchor}\n                    placement={placementByType[type]}\n                    offset={offsetByType[type]}\n                    style={styles}\n                >\n                    <PlusButton\n                        {...btnProps}\n                        onHoverChange={setHovered}\n                        qa={`g-md-yfm-table-plus-${type}`}\n                    />\n                </FloatingPopup>\n                {hovered && <InsertCursor anchor={anchor} type={type} />}\n            </>\n        );\n    };\n"]}

package/build/esm/extensions/yfm/YfmTable/plugins/YfmTableControls/components/FloatingPlusButton/InsertCursor.d.ts

@@ -0,0 +1,6 @@
+import { type ReferenceElement } from '@floating-ui/dom';
+export type InsertCursorProps = {
+    anchor: ReferenceElement;
+    type: 'row' | 'column';
+};
+export declare const InsertCursor: React.FC<InsertCursorProps>;

package/build/esm/extensions/yfm/YfmTable/plugins/YfmTableControls/components/FloatingPlusButton/InsertCursor.js

@@ -0,0 +1,64 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useCallback, useEffect, useState } from 'react';
+// eslint-disable-next-line import/no-extraneous-dependencies
+import { autoUpdate, computePosition } from '@floating-ui/dom';
+import { Portal } from '@gravity-ui/uikit';
+import { useLatest } from 'react-use';
+import { useElementState } from "../../../../../../../react-utils/index.js";
+const placementByType = {
+    row: 'bottom-start',
+    column: 'right-start',
+};
+export const InsertCursor = function YfmTableInsertCursor({ type, anchor: referenceEl, }) {
+    const [floatingEl, setFloatingEl] = useElementState();
+    const { width, height, updateRect } = useSize(type, () => referenceEl.getBoundingClientRect());
+    const widhtRef = useLatest(width);
+    const [floatingStyles, setFloatingStyles] = useState({ top: -9999, left: -9999 });
+    useEffect(() => {
+        if (referenceEl && floatingEl) {
+            return autoUpdate(referenceEl, floatingEl, () => {
+                updateRect(referenceEl.getBoundingClientRect());
+                computePosition(referenceEl, floatingEl, {
+                    placement: placementByType[type],
+                }).then(({ x, y }) => {
+                    if (type === 'row')
+                        setFloatingStyles({ left: x, top: y - 1 });
+                    else
+                        setFloatingStyles({ left: x - 1, top: y });
+                });
+            });
+        }
+        return undefined;
+    }, [referenceEl, floatingEl, widhtRef, type, updateRect]);
+    return (_jsx(Portal, { children: _jsx("div", { ref: setFloatingEl, style: {
+                position: 'absolute',
+                zIndex: 1005,
+                width,
+                height,
+                pointerEvents: 'auto',
+                outline: 'none',
+                backgroundColor: 'var(--g-color-line-brand)',
+                ...floatingStyles,
+            } }) }));
+};
+function useSize(type, getRect) {
+    const [size, setSize] = useState(() => getSize(type, getRect()));
+    const sizeRef = useLatest(size);
+    return {
+        width: size.width,
+        height: size.height,
+        updateRect: useCallback((rect) => {
+            const newSize = getSize(type, rect);
+            if (type === 'row' && newSize.width !== sizeRef.current.width)
+                setSize(newSize);
+            if (type === 'column' && newSize.height !== sizeRef.current.height)
+                setSize(newSize);
+        }, [sizeRef, type]),
+    };
+}
+function getSize(type, rect) {
+    if (type === 'row')
+        return { height: 2, width: rect.width };
+    return { width: 2, height: rect.height };
+}
+//# sourceMappingURL=InsertCursor.js.map

package/build/esm/extensions/yfm/YfmTable/plugins/YfmTableControls/components/FloatingPlusButton/InsertCursor.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"InsertCursor.js","sourceRoot":"../../../../../../../../../src","sources":["extensions/yfm/YfmTable/plugins/YfmTableControls/components/FloatingPlusButton/InsertCursor.tsx"],"names":[],"mappings":"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","sourcesContent":["import {useCallback, useEffect, useState} from 'react';\n\n// eslint-disable-next-line import/no-extraneous-dependencies\nimport {type Placement, type ReferenceElement, autoUpdate, computePosition} from '@floating-ui/dom';\nimport {Portal} from '@gravity-ui/uikit';\nimport {useLatest} from 'react-use';\n\nimport {useElementState} from 'src/react-utils';\n\nconst placementByType: Record<InsertCursorProps['type'], Placement> = {\n    row: 'bottom-start',\n    column: 'right-start',\n};\n\nexport type InsertCursorProps = {\n    anchor: ReferenceElement;\n    type: 'row' | 'column';\n};\n\nexport const InsertCursor: React.FC<InsertCursorProps> = function YfmTableInsertCursor({\n    type,\n    anchor: referenceEl,\n}) {\n    const [floatingEl, setFloatingEl] = useElementState();\n    const {width, height, updateRect} = useSize(type, () => referenceEl.getBoundingClientRect());\n    const widhtRef = useLatest(width);\n    const [floatingStyles, setFloatingStyles] = useState({top: -9999, left: -9999});\n\n    useEffect(() => {\n        if (referenceEl && floatingEl) {\n            return autoUpdate(referenceEl, floatingEl, () => {\n                updateRect(referenceEl.getBoundingClientRect());\n\n                computePosition(referenceEl, floatingEl, {\n                    placement: placementByType[type],\n                }).then(({x, y}) => {\n                    if (type === 'row') setFloatingStyles({left: x, top: y - 1});\n                    else setFloatingStyles({left: x - 1, top: y});\n                });\n            });\n        }\n        return undefined;\n    }, [referenceEl, floatingEl, widhtRef, type, updateRect]);\n\n    return (\n        <Portal>\n            <div\n                ref={setFloatingEl}\n                style={{\n                    position: 'absolute',\n                    zIndex: 1005,\n                    width,\n                    height,\n                    pointerEvents: 'auto',\n                    outline: 'none',\n                    backgroundColor: 'var(--g-color-line-brand)',\n                    ...floatingStyles,\n                }}\n            />\n        </Portal>\n    );\n};\n\ntype Size = {\n    width: number;\n    height: number;\n};\n\nfunction useSize(type: InsertCursorProps['type'], getRect: () => Size) {\n    const [size, setSize] = useState<Size>(() => getSize(type, getRect()));\n    const sizeRef = useLatest(size);\n\n    return {\n        width: size.width,\n        height: size.height,\n        updateRect: useCallback(\n            (rect: Size) => {\n                const newSize = getSize(type, rect);\n                if (type === 'row' && newSize.width !== sizeRef.current.width) setSize(newSize);\n                if (type === 'column' && newSize.height !== sizeRef.current.height)\n                    setSize(newSize);\n            },\n            [sizeRef, type],\n        ),\n    };\n}\n\nfunction getSize(type: InsertCursorProps['type'], rect: Size): Size {\n    if (type === 'row') return {height: 2, width: rect.width};\n    return {width: 2, height: rect.height};\n}\n"]}

package/build/esm/extensions/yfm/YfmTable/plugins/YfmTableControls/components/FloatingPlusButton/PlusButton.d.ts

@@ -0,0 +1,6 @@
+import { type QAProps } from '@gravity-ui/uikit';
+export type PlusButtonProps = QAProps & {
+    onClick: () => void;
+    onHoverChange: (hover: boolean) => void;
+};
+export declare const PlusButton: React.FC<PlusButtonProps>;

package/build/esm/extensions/yfm/YfmTable/plugins/YfmTableControls/components/FloatingPlusButton/PlusButton.js

@@ -0,0 +1,22 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useEffect } from 'react';
+import { Plus as PlusIcon } from '@gravity-ui/icons';
+import { Button, Flex, Icon } from '@gravity-ui/uikit';
+import { useBooleanState } from "../../../../../../../react-utils/index.js";
+export const PlusButton = function YfmTablePlusButton({ qa, onClick, onHoverChange, }) {
+    const [hovered, setHovered, unsetHovered] = useBooleanState(false);
+    useEffect(() => {
+        onHoverChange(hovered);
+    }, [hovered, onHoverChange]);
+    return (_jsx(Flex, { centerContent: true, width: 20, height: 20, onMouseEnter: setHovered, onMouseLeave: unsetHovered, style: {
+            borderRadius: '100px', // button circle border radius
+            backgroundColor: hovered ? 'var(--g-color-base-background)' : undefined,
+        }, children: _jsx(Button, { qa: qa, size: "xs", pin: "circle-circle", view: hovered ? 'outlined-action' : 'normal', onClick: onClick, style: {
+                '--g-button-height': hovered ? undefined : '4px',
+                '--_--background-color-hover': hovered
+                    ? 'var(--g-color-base-background)'
+                    : undefined,
+                color: hovered ? undefined : 'var(--g-color-base-generic)',
+            }, children: _jsx(Icon, { data: PlusIcon }) }) }));
+};
+//# sourceMappingURL=PlusButton.js.map

package/build/esm/extensions/yfm/YfmTable/plugins/YfmTableControls/components/FloatingPlusButton/PlusButton.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PlusButton.js","sourceRoot":"../../../../../../../../../src","sources":["extensions/yfm/YfmTable/plugins/YfmTableControls/components/FloatingPlusButton/PlusButton.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAC,SAAS,EAAC,MAAM,OAAO,CAAC;AAEhC,OAAO,EAAC,IAAI,IAAI,QAAQ,EAAC,MAAM,mBAAmB,CAAC;AACnD,OAAO,EAAC,MAAM,EAAE,IAAI,EAAE,IAAI,EAAe,MAAM,mBAAmB,CAAC;AAEnE,OAAO,EAAC,eAAe,EAAC,kDAAwB;AAOhD,MAAM,CAAC,MAAM,UAAU,GAA8B,SAAS,kBAAkB,CAAC,EAC7E,EAAE,EACF,OAAO,EACP,aAAa,GAChB;IACG,MAAM,CAAC,OAAO,EAAE,UAAU,EAAE,YAAY,CAAC,GAAG,eAAe,CAAC,KAAK,CAAC,CAAC;IACnE,SAAS,CAAC,GAAG,EAAE;QACX,aAAa,CAAC,OAAO,CAAC,CAAC;IAC3B,CAAC,EAAE,CAAC,OAAO,EAAE,aAAa,CAAC,CAAC,CAAC;IAE7B,OAAO,CACH,KAAC,IAAI,IACD,aAAa,QACb,KAAK,EAAE,EAAE,EACT,MAAM,EAAE,EAAE,EACV,YAAY,EAAE,UAAU,EACxB,YAAY,EAAE,YAAY,EAC1B,KAAK,EAAE;YACH,YAAY,EAAE,OAAO,EAAE,8BAA8B;YACrD,eAAe,EAAE,OAAO,CAAC,CAAC,CAAC,gCAAgC,CAAC,CAAC,CAAC,SAAS;SAC1E,YAED,KAAC,MAAM,IACH,EAAE,EAAE,EAAE,EACN,IAAI,EAAC,IAAI,EACT,GAAG,EAAC,eAAe,EACnB,IAAI,EAAE,OAAO,CAAC,CAAC,CAAC,iBAAiB,CAAC,CAAC,CAAC,QAAQ,EAC5C,OAAO,EAAE,OAAO,EAChB,KAAK,EAAE;gBACH,mBAAmB,EAAE,OAAO,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,KAAK;gBAChD,6BAA6B,EAAE,OAAO;oBAClC,CAAC,CAAC,gCAAgC;oBAClC,CAAC,CAAC,SAAS;gBACf,KAAK,EAAE,OAAO,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,6BAA6B;aAC7D,YAED,KAAC,IAAI,IAAC,IAAI,EAAE,QAAQ,GAAI,GACnB,GACN,CACV,CAAC;AACN,CAAC,CAAC","sourcesContent":["import {useEffect} from 'react';\n\nimport {Plus as PlusIcon} from '@gravity-ui/icons';\nimport {Button, Flex, Icon, type QAProps} from '@gravity-ui/uikit';\n\nimport {useBooleanState} from 'src/react-utils';\n\nexport type PlusButtonProps = QAProps & {\n    onClick: () => void;\n    onHoverChange: (hover: boolean) => void;\n};\n\nexport const PlusButton: React.FC<PlusButtonProps> = function YfmTablePlusButton({\n    qa,\n    onClick,\n    onHoverChange,\n}) {\n    const [hovered, setHovered, unsetHovered] = useBooleanState(false);\n    useEffect(() => {\n        onHoverChange(hovered);\n    }, [hovered, onHoverChange]);\n\n    return (\n        <Flex\n            centerContent\n            width={20} // xs button\n            height={20} // xs button\n            onMouseEnter={setHovered}\n            onMouseLeave={unsetHovered}\n            style={{\n                borderRadius: '100px', // button circle border radius\n                backgroundColor: hovered ? 'var(--g-color-base-background)' : undefined,\n            }}\n        >\n            <Button\n                qa={qa}\n                size=\"xs\"\n                pin=\"circle-circle\"\n                view={hovered ? 'outlined-action' : 'normal'}\n                onClick={onClick}\n                style={{\n                    '--g-button-height': hovered ? undefined : '4px',\n                    '--_--background-color-hover': hovered\n                        ? 'var(--g-color-base-background)'\n                        : undefined,\n                    color: hovered ? undefined : 'var(--g-color-base-generic)',\n                }}\n            >\n                <Icon data={PlusIcon} />\n            </Button>\n        </Flex>\n    );\n};\n"]}

package/build/esm/extensions/yfm/YfmTable/plugins/YfmTableControls/components/FloatingPlusButton/index.d.ts

@@ -0,0 +1 @@
+export * from "./FloatingPlusButton.js";

package/build/esm/extensions/yfm/YfmTable/plugins/YfmTableControls/components/FloatingPlusButton/index.js

@@ -0,0 +1,2 @@
+export * from "./FloatingPlusButton.js";
+//# sourceMappingURL=index.js.map

package/build/esm/extensions/yfm/YfmTable/plugins/YfmTableControls/components/FloatingPlusButton/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"../../../../../../../../../src","sources":["extensions/yfm/YfmTable/plugins/YfmTableControls/components/FloatingPlusButton/index.ts"],"names":[],"mappings":"AAAA,wCAAqC","sourcesContent":["export * from './FloatingPlusButton';\n"]}

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

@@ -0,0 +1,9 @@
+import { type FloatingPlusButtonProps } from "../FloatingPlusButton/index.js";
+export type FloatingPlusControlProps = {
+    type: FloatingPlusButtonProps['type'];
+    index: number;
+    cellElem: Element;
+    tableElem: Element;
+    onClick: (rowIdx: number) => void;
+};
+export declare const FloatingPlusControl: import("react").NamedExoticComponent<FloatingPlusControlProps>;

package/build/esm/extensions/yfm/YfmTable/plugins/YfmTableControls/components/FloatingPlusControl/FloatingPlusControl.js

@@ -0,0 +1,35 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { memo, useMemo } from 'react';
+import { FloatingPlusButton } from "../FloatingPlusButton/index.js";
+export const FloatingPlusControl = memo(function YfmTableRowFloatingPlusControl({ type, index, cellElem, tableElem, onClick }) {
+    const anchor = useMemo(() => ({
+        contextElement: tableElem,
+        getBoundingClientRect() {
+            const cellRect = cellElem.getBoundingClientRect();
+            const tableRect = tableElem.getBoundingClientRect();
+            return type === 'row'
+                ? {
+                    x: tableRect.x,
+                    y: cellRect.y,
+                    width: tableRect.width,
+                    height: cellRect.height,
+                    top: cellRect.top,
+                    left: tableRect.left,
+                    right: tableRect.right,
+                    bottom: cellRect.top,
+                }
+                : {
+                    x: cellRect.x,
+                    y: tableRect.y,
+                    width: cellRect.width,
+                    height: tableRect.height,
+                    top: tableRect.top,
+                    left: cellRect.left,
+                    right: cellRect.right,
+                    bottom: tableRect.top,
+                };
+        },
+    }), [cellElem, tableElem, type]);
+    return _jsx(FloatingPlusButton, { anchor: anchor, type: type, onClick: () => onClick(index) });
+});
+//# sourceMappingURL=FloatingPlusControl.js.map

package/build/esm/extensions/yfm/YfmTable/plugins/YfmTableControls/components/FloatingPlusControl/FloatingPlusControl.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FloatingPlusControl.js","sourceRoot":"../../../../../../../../../src","sources":["extensions/yfm/YfmTable/plugins/YfmTableControls/components/FloatingPlusControl/FloatingPlusControl.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAC,IAAI,EAAE,OAAO,EAAC,MAAM,OAAO,CAAC;AAKpC,OAAO,EAAC,kBAAkB,EAA+B,uCAA8B;AAUvF,MAAM,CAAC,MAAM,mBAAmB,GAAG,IAAI,CACnC,SAAS,8BAA8B,CAAC,EAAC,IAAI,EAAE,KAAK,EAAE,QAAQ,EAAE,SAAS,EAAE,OAAO,EAAC;IAC/E,MAAM,MAAM,GAAG,OAAO,CAClB,GAAG,EAAE,CAAC,CAAC;QACH,cAAc,EAAE,SAAS;QACzB,qBAAqB;YACjB,MAAM,QAAQ,GAAG,QAAQ,CAAC,qBAAqB,EAAE,CAAC;YAClD,MAAM,SAAS,GAAG,SAAS,CAAC,qBAAqB,EAAE,CAAC;YAEpD,OAAO,IAAI,KAAK,KAAK;gBACjB,CAAC,CAAC;oBACI,CAAC,EAAE,SAAS,CAAC,CAAC;oBACd,CAAC,EAAE,QAAQ,CAAC,CAAC;oBACb,KAAK,EAAE,SAAS,CAAC,KAAK;oBACtB,MAAM,EAAE,QAAQ,CAAC,MAAM;oBACvB,GAAG,EAAE,QAAQ,CAAC,GAAG;oBACjB,IAAI,EAAE,SAAS,CAAC,IAAI;oBACpB,KAAK,EAAE,SAAS,CAAC,KAAK;oBACtB,MAAM,EAAE,QAAQ,CAAC,GAAG;iBACvB;gBACH,CAAC,CAAC;oBACI,CAAC,EAAE,QAAQ,CAAC,CAAC;oBACb,CAAC,EAAE,SAAS,CAAC,CAAC;oBACd,KAAK,EAAE,QAAQ,CAAC,KAAK;oBACrB,MAAM,EAAE,SAAS,CAAC,MAAM;oBACxB,GAAG,EAAE,SAAS,CAAC,GAAG;oBAClB,IAAI,EAAE,QAAQ,CAAC,IAAI;oBACnB,KAAK,EAAE,QAAQ,CAAC,KAAK;oBACrB,MAAM,EAAE,SAAS,CAAC,GAAG;iBACxB,CAAC;QACZ,CAAC;KACJ,CAAC,EACF,CAAC,QAAQ,EAAE,SAAS,EAAE,IAAI,CAAC,CAC9B,CAAC;IAEF,OAAO,KAAC,kBAAkB,IAAC,MAAM,EAAE,MAAM,EAAE,IAAI,EAAE,IAAI,EAAE,OAAO,EAAE,GAAG,EAAE,CAAC,OAAO,CAAC,KAAK,CAAC,GAAI,CAAC;AAC7F,CAAC,CACJ,CAAC","sourcesContent":["import {memo, useMemo} from 'react';\n\n// eslint-disable-next-line import/no-extraneous-dependencies\nimport type {VirtualElement} from '@floating-ui/dom';\n\nimport {FloatingPlusButton, type FloatingPlusButtonProps} from '../FloatingPlusButton';\n\nexport type FloatingPlusControlProps = {\n    type: FloatingPlusButtonProps['type'];\n    index: number;\n    cellElem: Element;\n    tableElem: Element;\n    onClick: (rowIdx: number) => void;\n};\n\nexport const FloatingPlusControl = memo<FloatingPlusControlProps>(\n    function YfmTableRowFloatingPlusControl({type, index, cellElem, tableElem, onClick}) {\n        const anchor = useMemo<VirtualElement>(\n            () => ({\n                contextElement: tableElem,\n                getBoundingClientRect() {\n                    const cellRect = cellElem.getBoundingClientRect();\n                    const tableRect = tableElem.getBoundingClientRect();\n\n                    return type === 'row'\n                        ? {\n                              x: tableRect.x,\n                              y: cellRect.y,\n                              width: tableRect.width,\n                              height: cellRect.height,\n                              top: cellRect.top,\n                              left: tableRect.left,\n                              right: tableRect.right,\n                              bottom: cellRect.top,\n                          }\n                        : {\n                              x: cellRect.x,\n                              y: tableRect.y,\n                              width: cellRect.width,\n                              height: tableRect.height,\n                              top: tableRect.top,\n                              left: cellRect.left,\n                              right: cellRect.right,\n                              bottom: tableRect.top,\n                          };\n                },\n            }),\n            [cellElem, tableElem, type],\n        );\n\n        return <FloatingPlusButton anchor={anchor} type={type} onClick={() => onClick(index)} />;\n    },\n);\n"]}

package/build/esm/extensions/yfm/YfmTable/plugins/YfmTableControls/components/FloatingPlusControl/index.d.ts

@@ -0,0 +1 @@
+export * from "./FloatingPlusControl.js";

package/build/esm/extensions/yfm/YfmTable/plugins/YfmTableControls/components/FloatingPlusControl/index.js

@@ -0,0 +1,2 @@
+export * from "./FloatingPlusControl.js";
+//# sourceMappingURL=index.js.map

package/build/esm/extensions/yfm/YfmTable/plugins/YfmTableControls/components/FloatingPlusControl/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"../../../../../../../../../src","sources":["extensions/yfm/YfmTable/plugins/YfmTableControls/components/FloatingPlusControl/index.ts"],"names":[],"mappings":"AAAA,yCAAsC","sourcesContent":["export * from './FloatingPlusControl';\n"]}

package/build/esm/extensions/yfm/YfmTable/plugins/YfmTableControls/components/FloatingPopup/FloatingPopup.css

@@ -0,0 +1,14 @@
+.g-md-yfm-table-floating-popup {
+  position: relative;
+  border-radius: var(--g-border-radius-xs);
+  outline: none;
+  background-color: var(--g-color-base-float);
+}
+.g-md-yfm-table-floating-popup > :first-child {
+  border-start-start-radius: inherit;
+  border-start-end-radius: inherit;
+}
+.g-md-yfm-table-floating-popup > :last-child {
+  border-end-end-radius: inherit;
+  border-end-start-radius: inherit;
+}

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

@@ -0,0 +1,13 @@
+import { type OffsetOptions, type Placement, type ReferenceType } from '@floating-ui/react';
+import { type DOMProps, type QAProps } from '@gravity-ui/uikit';
+import "./FloatingPopup.css";
+export type FloatingPopupProps = QAProps & DOMProps & {
+    open?: boolean;
+    zIndex?: number;
+    placement: Placement;
+    offset?: OffsetOptions;
+    anchorElement: ReferenceType | undefined | null;
+    children: React.ReactNode;
+    floatingStyles?: React.CSSProperties;
+};
+export declare const FloatingPopup: React.FC<FloatingPopupProps>;

package/build/esm/extensions/yfm/YfmTable/plugins/YfmTableControls/components/FloatingPopup/FloatingPopup.js

@@ -0,0 +1,54 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+///
+/// Fork of Popup component from @gravity-ui/uikit
+/// This fork does not use floating focus manager
+///
+import { useEffect, useMemo } from 'react';
+// eslint-disable-next-line import/no-extraneous-dependencies
+import { FloatingNode, FloatingTree, autoUpdate, offset as offsetMiddleware, useFloating, useFloatingNodeId, useFloatingParentNodeId, useInteractions, } from '@floating-ui/react';
+import { Portal } from '@gravity-ui/uikit';
+import { cn } from "../../../../../../../classname.js";
+import "./FloatingPopup.css";
+const b = cn('yfm-table-floating-popup');
+export const FloatingPopup = function YfmTableFloatingPopup(props) {
+    const { anchorElement, zIndex = 1000, style, className, qa, children, floatingStyles: floatingStylesFromProps, } = props;
+    const nodeId = useFloatingNodeId();
+    const parentId = useFloatingParentNodeId();
+    const middleware = useMemo(() => [offsetMiddleware(props.offset)], [props.offset]);
+    const { refs, elements, floatingStyles, placement, context: { open }, update, } = useFloating({
+        nodeId,
+        open: props.open,
+        placement: props.placement,
+        middleware,
+    });
+    const { getFloatingProps } = useInteractions();
+    useEffect(() => {
+        if (anchorElement !== undefined && anchorElement !== refs.reference.current) {
+            refs.setReference(anchorElement);
+        }
+    }, [anchorElement, refs]);
+    useEffect(() => {
+        if (elements.reference && elements.floating) {
+            return autoUpdate(elements.reference, elements.floating, update);
+        }
+        return undefined;
+    }, [elements, update]);
+    function wrapper(node) {
+        if (parentId === null) {
+            return _jsx(FloatingTree, { children: node });
+        }
+        return node;
+    }
+    return wrapper(_jsx(FloatingNode, { id: nodeId, children: open ? (_jsx(Portal, { children: _jsx("div", { ref: refs.setFloating, style: {
+                    position: 'absolute',
+                    top: 0,
+                    left: 0,
+                    zIndex,
+                    width: 'max-content',
+                    pointerEvents: 'auto',
+                    outline: 'none',
+                    ...floatingStylesFromProps,
+                    ...floatingStyles,
+                }, "data-floating-ui-placement": placement, ...getFloatingProps(), children: _jsx("div", { className: b(null, className), style: style, "data-qa": qa, children: children }) }) })) : null }));
+};
+//# sourceMappingURL=FloatingPopup.js.map

package/build/esm/extensions/yfm/YfmTable/plugins/YfmTableControls/components/FloatingPopup/FloatingPopup.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FloatingPopup.js","sourceRoot":"../../../../../../../../../src","sources":["extensions/yfm/YfmTable/plugins/YfmTableControls/components/FloatingPopup/FloatingPopup.tsx"],"names":[],"mappings":"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","sourcesContent":["///\n/// Fork of Popup component from @gravity-ui/uikit\n/// This fork does not use floating focus manager\n///\n\nimport {useEffect, useMemo} from 'react';\n\n// eslint-disable-next-line import/no-extraneous-dependencies\nimport {\n    FloatingNode,\n    FloatingTree,\n    type OffsetOptions,\n    type Placement,\n    type ReferenceType,\n    autoUpdate,\n    offset as offsetMiddleware,\n    useFloating,\n    useFloatingNodeId,\n    useFloatingParentNodeId,\n    useInteractions,\n} from '@floating-ui/react';\nimport {type DOMProps, Portal, type QAProps} from '@gravity-ui/uikit';\n\nimport {cn} from 'src/classname';\n\nimport './FloatingPopup.scss';\n\nconst b = cn('yfm-table-floating-popup');\n\nexport type FloatingPopupProps = QAProps &\n    DOMProps & {\n        open?: boolean;\n        zIndex?: number;\n        placement: Placement;\n        offset?: OffsetOptions;\n        anchorElement: ReferenceType | undefined | null;\n        children: React.ReactNode;\n        floatingStyles?: React.CSSProperties;\n    };\n\nexport const FloatingPopup: React.FC<FloatingPopupProps> = function YfmTableFloatingPopup(\n    props: FloatingPopupProps,\n) {\n    const {\n        anchorElement,\n        zIndex = 1000,\n        style,\n        className,\n        qa,\n        children,\n        floatingStyles: floatingStylesFromProps,\n    } = props;\n\n    const nodeId = useFloatingNodeId();\n    const parentId = useFloatingParentNodeId();\n\n    const middleware = useMemo(() => [offsetMiddleware(props.offset)], [props.offset]);\n\n    const {\n        refs,\n        elements,\n        floatingStyles,\n        placement,\n        context: {open},\n        update,\n    } = useFloating({\n        nodeId,\n        open: props.open,\n        placement: props.placement,\n        middleware,\n    });\n\n    const {getFloatingProps} = useInteractions();\n\n    useEffect(() => {\n        if (anchorElement !== undefined && anchorElement !== refs.reference.current) {\n            refs.setReference(anchorElement);\n        }\n    }, [anchorElement, refs]);\n\n    useEffect(() => {\n        if (elements.reference && elements.floating) {\n            return autoUpdate(elements.reference, elements.floating, update);\n        }\n        return undefined;\n    }, [elements, update]);\n\n    function wrapper(node: JSX.Element) {\n        if (parentId === null) {\n            return <FloatingTree>{node}</FloatingTree>;\n        }\n\n        return node;\n    }\n\n    return wrapper(\n        <FloatingNode id={nodeId}>\n            {open ? (\n                <Portal>\n                    <div\n                        ref={refs.setFloating}\n                        style={{\n                            position: 'absolute',\n                            top: 0,\n                            left: 0,\n                            zIndex,\n                            width: 'max-content',\n                            pointerEvents: 'auto',\n                            outline: 'none',\n                            ...floatingStylesFromProps,\n                            ...floatingStyles,\n                        }}\n                        data-floating-ui-placement={placement}\n                        {...getFloatingProps()}\n                    >\n                        <div className={b(null, className)} style={style} data-qa={qa}>\n                            {children}\n                        </div>\n                    </div>\n                </Portal>\n            ) : null}\n        </FloatingNode>,\n    );\n};\n"]}

package/build/esm/extensions/yfm/YfmTable/plugins/YfmTableControls/components/FloatingPopup/index.d.ts

@@ -0,0 +1 @@
+export * from "./FloatingPopup.js";

package/build/esm/extensions/yfm/YfmTable/plugins/YfmTableControls/components/FloatingPopup/index.js

@@ -0,0 +1,2 @@
+export * from "./FloatingPopup.js";
+//# sourceMappingURL=index.js.map

package/build/esm/extensions/yfm/YfmTable/plugins/YfmTableControls/components/FloatingPopup/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"../../../../../../../../../src","sources":["extensions/yfm/YfmTable/plugins/YfmTableControls/components/FloatingPopup/index.ts"],"names":[],"mappings":"AAAA,mCAAgC","sourcesContent":["export * from './FloatingPopup';\n"]}

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

@@ -0,0 +1,13 @@
+export declare const YfmTableDecorationTypeKey = "__yfm-table-deco-type";
+export declare const YfmTableDecorationUniqKey = "__yfm-table-deco-uniq-key";
+export declare enum YfmTableDecorationType {
+    FocusTable = "table--focus",
+    ShowRowControl = "cell--show-row-control",// to show the row control in the cell
+    ShowColumnControl = "cell--show-column-control",// to show the column control in the cell
+    OpenRowMenu = "cell--open-row-menu",// sign of opening the row menu in the cell
+    OpenColumnMenu = "cell--open-column-menu",// sign of opening the column menu in the cell
+    ActivateRow = "row--active",
+    ActivateColumnCells = "cell--active-column",
+    ActivateDangerRow = "row--danger",
+    ActivateDangerColumnCells = "cell--danger-column"
+}

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

@@ -0,0 +1,15 @@
+export const YfmTableDecorationTypeKey = '__yfm-table-deco-type';
+export const YfmTableDecorationUniqKey = '__yfm-table-deco-uniq-key';
+export var YfmTableDecorationType;
+(function (YfmTableDecorationType) {
+    YfmTableDecorationType["FocusTable"] = "table--focus";
+    YfmTableDecorationType["ShowRowControl"] = "cell--show-row-control";
+    YfmTableDecorationType["ShowColumnControl"] = "cell--show-column-control";
+    YfmTableDecorationType["OpenRowMenu"] = "cell--open-row-menu";
+    YfmTableDecorationType["OpenColumnMenu"] = "cell--open-column-menu";
+    YfmTableDecorationType["ActivateRow"] = "row--active";
+    YfmTableDecorationType["ActivateColumnCells"] = "cell--active-column";
+    YfmTableDecorationType["ActivateDangerRow"] = "row--danger";
+    YfmTableDecorationType["ActivateDangerColumnCells"] = "cell--danger-column";
+})(YfmTableDecorationType || (YfmTableDecorationType = {}));
+//# sourceMappingURL=const.js.map

package/build/esm/extensions/yfm/YfmTable/plugins/YfmTableControls/const.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"const.js","sourceRoot":"../../../../../../../src","sources":["extensions/yfm/YfmTable/plugins/YfmTableControls/const.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,yBAAyB,GAAG,uBAAuB,CAAC;AACjE,MAAM,CAAC,MAAM,yBAAyB,GAAG,2BAA2B,CAAC;AAErE,MAAM,CAAN,IAAY,sBAcX;AAdD,WAAY,sBAAsB;IAC9B,qDAA2B,CAAA;IAE3B,mEAAyC,CAAA;IACzC,yEAA+C,CAAA;IAE/C,6DAAmC,CAAA;IACnC,mEAAyC,CAAA;IAEzC,qDAA2B,CAAA;IAC3B,qEAA2C,CAAA;IAE3C,2DAAiC,CAAA;IACjC,2EAAiD,CAAA;AACrD,CAAC,EAdW,sBAAsB,KAAtB,sBAAsB,QAcjC","sourcesContent":["export const YfmTableDecorationTypeKey = '__yfm-table-deco-type';\nexport const YfmTableDecorationUniqKey = '__yfm-table-deco-uniq-key';\n\nexport enum YfmTableDecorationType {\n    FocusTable = 'table--focus',\n\n    ShowRowControl = 'cell--show-row-control', // to show the row control in the cell\n    ShowColumnControl = 'cell--show-column-control', // to show the column control in the cell\n\n    OpenRowMenu = 'cell--open-row-menu', // sign of opening the row menu in the cell\n    OpenColumnMenu = 'cell--open-column-menu', // sign of opening the column menu in the cell\n\n    ActivateRow = 'row--active',\n    ActivateColumnCells = 'cell--active-column',\n\n    ActivateDangerRow = 'row--danger',\n    ActivateDangerColumnCells = 'cell--danger-column',\n}\n"]}

package/build/esm/extensions/yfm/YfmTable/plugins/YfmTableControls/dnd/dnd-drop-cursor.d.ts

@@ -0,0 +1,36 @@
+import type { EditorView } from "../../../../../../pm/view.js";
+/** Same as `DropCursorOptions` from _prosemirror-dropcursor_ package */
+export type DropCursorParams = {
+    /** The color of the cursor. Defaults to `black`. Use `false` to apply no color and rely only on class. */
+    color?: string | false;
+    /** The precise width of the cursor in pixels. Defaults to 1. */
+    width?: number;
+    /** A CSS class name to add to the cursor element. */
+    class?: string;
+};
+type Rect = {
+    left: number;
+    right: number;
+    top: number;
+    bottom: number;
+};
+export declare class DropCursor {
+    protected readonly editorView: EditorView;
+    protected readonly width: number;
+    protected readonly color: string | undefined;
+    protected readonly class: string | undefined;
+    protected cursorElem: HTMLElement | null;
+    private cursorPos;
+    constructor(editorView: EditorView, params?: DropCursorParams);
+    getPos(): number | null;
+    setPos(val: number): void;
+    clear(): void;
+    update(): void;
+    protected render(rect: Rect, { isBlock }: {
+        isBlock: boolean;
+    }): void;
+}
+export declare class TableColumnDropCursor extends DropCursor {
+    update(): void;
+}
+export {};