@gravity-ui/markdown-editor 15.25.0 → 15.26.1

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

@@ -18,9 +18,8 @@ const offsetByType = {
     row: { alignmentAxis: -10 },
     column: { alignmentAxis: -10 },
 };
-const FloatingPlusButton = function YfmTableFloatingPlusButton({ anchor, type, ...btnProps }) {
+exports.FloatingPlusButton = (0, react_1.forwardRef)(function YfmTableFloatingPlusButton({ anchor, type, floatingStyles, ...btnProps }, ref) {
     const [hovered, setHovered] = (0, react_1.useState)(false);
-    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(FloatingPopup_1.FloatingPopup, { open: true, anchorElement: anchor, placement: placementByType[type], offset: offsetByType[type], style: styles, children: (0, jsx_runtime_1.jsx)(PlusButton_1.PlusButton, { ...btnProps, onHoverChange: setHovered, qa: `g-md-yfm-table-plus-${type}` }) }), hovered && (0, jsx_runtime_1.jsx)(InsertCursor_1.InsertCursor, { anchor: anchor, type: type })] }));
-};
-exports.FloatingPlusButton = FloatingPlusButton;
+    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(FloatingPopup_1.FloatingPopup, { open: true, ref: ref, anchorElement: anchor, floatingStyles: floatingStyles, placement: placementByType[type], offset: offsetByType[type], style: styles, children: (0, jsx_runtime_1.jsx)(PlusButton_1.PlusButton, { ...btnProps, onHoverChange: setHovered, qa: `g-md-yfm-table-plus-${type}` }) }), hovered && (0, jsx_runtime_1.jsx)(InsertCursor_1.InsertCursor, { anchor: anchor, type: type })] }));
+});
 //# sourceMappingURL=FloatingPlusButton.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"FloatingPlusButton.js","sourceRoot":"../../../../../../../../../src","sources":["extensions/yfm/YfmTable/plugins/YfmTableControls/components/FloatingPlusButton/FloatingPlusButton.tsx"],"names":[],"mappings":";;;;AAAA,iCAA+B;AAE/B,6DAAwE;AAExE,oDAAoE;AACpE,gDAA8D;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;AAKK,MAAM,kBAAkB,GAC3B,SAAS,0BAA0B,CAAC,EAAC,MAAM,EAAE,IAAI,EAAE,GAAG,QAAQ,EAAC;IAC3D,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,IAAA,gBAAQ,EAAC,KAAK,CAAC,CAAC;IAE9C,OAAO,CACH,6DACI,uBAAC,6BAAa,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,uBAAC,uBAAU,OACH,QAAQ,EACZ,aAAa,EAAE,UAAU,EACzB,EAAE,EAAE,uBAAuB,IAAI,EAAE,GACnC,GACU,EACf,OAAO,IAAI,uBAAC,2BAAY,IAAC,MAAM,EAAE,MAAM,EAAE,IAAI,EAAE,IAAI,GAAI,IACzD,CACN,CAAC;AACN,CAAC,CAAC;AAtBO,QAAA,kBAAkB,sBAsBzB","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"]}
+{"version":3,"file":"FloatingPlusButton.js","sourceRoot":"../../../../../../../../../src","sources":["extensions/yfm/YfmTable/plugins/YfmTableControls/components/FloatingPlusButton/FloatingPlusButton.tsx"],"names":[],"mappings":";;;;AAAA,iCAA2C;AAE3C,6DAA+F;AAE/F,oDAAoE;AACpE,gDAA8D;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;AAQW,QAAA,kBAAkB,GAAG,IAAA,kBAAU,EACxC,SAAS,0BAA0B,CAAC,EAAC,MAAM,EAAE,IAAI,EAAE,cAAc,EAAE,GAAG,QAAQ,EAAC,EAAE,GAAG;IAChF,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,IAAA,gBAAQ,EAAC,KAAK,CAAC,CAAC;IAE9C,OAAO,CACH,6DACI,uBAAC,6BAAa,IACV,IAAI,QACJ,GAAG,EAAE,GAAG,EACR,aAAa,EAAE,MAAM,EACrB,cAAc,EAAE,cAAc,EAC9B,SAAS,EAAE,eAAe,CAAC,IAAI,CAAC,EAChC,MAAM,EAAE,YAAY,CAAC,IAAI,CAAC,EAC1B,KAAK,EAAE,MAAM,YAEb,uBAAC,uBAAU,OACH,QAAQ,EACZ,aAAa,EAAE,UAAU,EACzB,EAAE,EAAE,uBAAuB,IAAI,EAAE,GACnC,GACU,EACf,OAAO,IAAI,uBAAC,2BAAY,IAAC,MAAM,EAAE,MAAM,EAAE,IAAI,EAAE,IAAI,GAAI,IACzD,CACN,CAAC;AACN,CAAC,CACJ,CAAC","sourcesContent":["import {forwardRef, useState} from 'react';\n\nimport {FloatingPopup, type FloatingPopupProps, type FloatingPopupRef} 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 FloatingPlusButtonRef = FloatingPopupRef & {};\n\nexport type FloatingPlusButtonProps = Pick<FloatingPopupProps, 'floatingStyles'> &\n    Pick<PlusButtonProps, 'onClick'> &\n    Pick<InsertCursorProps, 'type' | 'anchor'>;\n\nexport const FloatingPlusButton = forwardRef<FloatingPlusButtonRef, FloatingPlusButtonProps>(\n    function YfmTableFloatingPlusButton({anchor, type, floatingStyles, ...btnProps}, ref) {\n        const [hovered, setHovered] = useState(false);\n\n        return (\n            <>\n                <FloatingPopup\n                    open\n                    ref={ref}\n                    anchorElement={anchor}\n                    floatingStyles={floatingStyles}\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);\n"]}

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

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

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

@@ -3,6 +3,8 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.FloatingPlusControl = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
 const react_1 = require("react");
+const react_use_1 = require("react-use");
+const use_raf_throttle_1 = require("../../hooks/use-raf-throttle.js");
 const FloatingPlusButton_1 = require("../FloatingPlusButton/index.js");
 exports.FloatingPlusControl = (0, react_1.memo)(function YfmTableRowFloatingPlusControl({ type, index, cellElem, tableElem, onClick }) {
     const anchor = (0, react_1.useMemo)(() => ({
@@ -33,6 +35,39 @@ exports.FloatingPlusControl = (0, react_1.memo)(function YfmTableRowFloatingPlus
                 };
         },
     }), [cellElem, tableElem, type]);
-    return (0, jsx_runtime_1.jsx)(FloatingPlusButton_1.FloatingPlusButton, { anchor: anchor, type: type, onClick: () => onClick(index) });
+    const [visible, setVisible] = (0, react_1.useState)(() => shouldBeVisible(type, cellElem, tableElem));
+    const buttonRef = (0, react_1.useRef)(null);
+    const updateVisibility = () => {
+        const newVisible = shouldBeVisible(type, cellElem, tableElem);
+        if (visible !== newVisible)
+            setVisible(newVisible);
+    };
+    const onChange = (0, use_raf_throttle_1.useRafThrottle)(() => {
+        buttonRef.current?.forceUpdate();
+        updateVisibility();
+    });
+    // Update after first render
+    (0, react_use_1.useEffectOnce)(updateVisibility);
+    (0, react_1.useEffect)(() => {
+        if (type !== 'column')
+            return undefined;
+        const observer = new ResizeObserver(onChange);
+        observer.observe(tableElem);
+        tableElem.addEventListener('scroll', onChange);
+        return () => {
+            observer.unobserve(tableElem);
+            tableElem.removeEventListener('scroll', onChange);
+        };
+    }, [tableElem, onChange, type]);
+    return ((0, jsx_runtime_1.jsx)(FloatingPlusButton_1.FloatingPlusButton, { ref: buttonRef, anchor: anchor, type: type, onClick: () => onClick(index), floatingStyles: visible ? undefined : { display: 'none' } }));
 });
+function shouldBeVisible(type, cellElem, tableElem) {
+    if (type !== 'column')
+        return true;
+    const THRESHOLD = 4; // px
+    const cellRect = cellElem.getBoundingClientRect();
+    const tableRect = tableElem.getBoundingClientRect();
+    return (tableRect.left - cellRect.right <= THRESHOLD &&
+        cellRect.right - tableRect.right <= THRESHOLD);
+}
 //# sourceMappingURL=FloatingPlusControl.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"FloatingPlusControl.js","sourceRoot":"../../../../../../../../../src","sources":["extensions/yfm/YfmTable/plugins/YfmTableControls/components/FloatingPlusControl/FloatingPlusControl.tsx"],"names":[],"mappings":";;;;AAAA,iCAAoC;AAKpC,uEAAuF;AAU1E,QAAA,mBAAmB,GAAG,IAAA,YAAI,EACnC,SAAS,8BAA8B,CAAC,EAAC,IAAI,EAAE,KAAK,EAAE,QAAQ,EAAE,SAAS,EAAE,OAAO,EAAC;IAC/E,MAAM,MAAM,GAAG,IAAA,eAAO,EAClB,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,uBAAC,uCAAkB,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"]}
+{"version":3,"file":"FloatingPlusControl.js","sourceRoot":"../../../../../../../../../src","sources":["extensions/yfm/YfmTable/plugins/YfmTableControls/components/FloatingPlusControl/FloatingPlusControl.tsx"],"names":[],"mappings":"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","sourcesContent":["import {memo, useEffect, useMemo, useRef, useState} from 'react';\n\n// eslint-disable-next-line import/no-extraneous-dependencies\nimport type {VirtualElement} from '@floating-ui/dom';\nimport {useEffectOnce} from 'react-use';\n\nimport {useRafThrottle} from '../../hooks/use-raf-throttle';\nimport {\n    FloatingPlusButton,\n    type FloatingPlusButtonProps,\n    type FloatingPlusButtonRef,\n} from '../FloatingPlusButton';\n\ntype ControlType = FloatingPlusButtonProps['type'];\n\nexport type FloatingPlusControlProps = {\n    type: ControlType;\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        const [visible, setVisible] = useState(() => shouldBeVisible(type, cellElem, tableElem));\n        const buttonRef = useRef<FloatingPlusButtonRef>(null);\n\n        const updateVisibility = () => {\n            const newVisible = shouldBeVisible(type, cellElem, tableElem);\n            if (visible !== newVisible) setVisible(newVisible);\n        };\n\n        const onChange = useRafThrottle(() => {\n            buttonRef.current?.forceUpdate();\n            updateVisibility();\n        });\n\n        // Update after first render\n        useEffectOnce(updateVisibility);\n\n        useEffect(() => {\n            if (type !== 'column') return undefined;\n\n            const observer = new ResizeObserver(onChange);\n            observer.observe(tableElem);\n            tableElem.addEventListener('scroll', onChange);\n\n            return () => {\n                observer.unobserve(tableElem);\n                tableElem.removeEventListener('scroll', onChange);\n            };\n        }, [tableElem, onChange, type]);\n\n        return (\n            <FloatingPlusButton\n                ref={buttonRef}\n                anchor={anchor}\n                type={type}\n                onClick={() => onClick(index)}\n                floatingStyles={visible ? undefined : {display: 'none'}}\n            />\n        );\n    },\n);\n\nfunction shouldBeVisible(type: ControlType, cellElem: Element, tableElem: Element): boolean {\n    if (type !== 'column') return true;\n\n    const THRESHOLD = 4; // px\n\n    const cellRect = cellElem.getBoundingClientRect();\n    const tableRect = tableElem.getBoundingClientRect();\n\n    return (\n        tableRect.left - cellRect.right <= THRESHOLD &&\n        cellRect.right - tableRect.right <= THRESHOLD\n    );\n}\n"]}

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

@@ -1,6 +1,10 @@
 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 { ReferenceType };
+export type FloatingPopupRef = {
+    forceUpdate: () => void;
+};
 export type FloatingPopupProps = QAProps & DOMProps & {
     open?: boolean;
     zIndex?: number;
@@ -10,4 +14,12 @@ export type FloatingPopupProps = QAProps & DOMProps & {
     children: React.ReactNode;
     floatingStyles?: React.CSSProperties;
 };
-export declare const FloatingPopup: React.FC<FloatingPopupProps>;
+export declare const FloatingPopup: import("react").ForwardRefExoticComponent<QAProps & DOMProps & {
+    open?: boolean;
+    zIndex?: number;
+    placement: Placement;
+    offset?: OffsetOptions;
+    anchorElement: ReferenceType | undefined | null;
+    children: React.ReactNode;
+    floatingStyles?: React.CSSProperties;
+} & import("react").RefAttributes<FloatingPopupRef>>;

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

@@ -13,29 +13,27 @@ const uikit_1 = require("@gravity-ui/uikit");
 const classname_1 = require("../../../../../../../classname.js");
 require("./FloatingPopup.css");
 const b = (0, classname_1.cn)('yfm-table-floating-popup');
-const FloatingPopup = function YfmTableFloatingPopup(props) {
+exports.FloatingPopup = (0, react_1.forwardRef)(function YfmTableFloatingPopup(props, ref) {
     const { anchorElement, zIndex = 1000, style, className, qa, children, floatingStyles: floatingStylesFromProps, } = props;
     const nodeId = (0, react_2.useFloatingNodeId)();
     const parentId = (0, react_2.useFloatingParentNodeId)();
     const middleware = (0, react_1.useMemo)(() => [(0, react_2.offset)(props.offset)], [props.offset]);
-    const { refs, elements, floatingStyles, placement, context: { open }, update, } = (0, react_2.useFloating)({
+    const { refs, floatingStyles, placement, context: { open }, update, } = (0, react_2.useFloating)({
         nodeId,
         open: props.open,
         placement: props.placement,
         middleware,
+        whileElementsMounted: react_2.autoUpdate,
     });
+    (0, react_1.useImperativeHandle)(ref, () => ({
+        forceUpdate: update,
+    }), [update]);
     const { getFloatingProps } = (0, react_2.useInteractions)();
     (0, react_1.useEffect)(() => {
         if (anchorElement !== undefined && anchorElement !== refs.reference.current) {
             refs.setReference(anchorElement);
         }
     }, [anchorElement, refs]);
-    (0, react_1.useEffect)(() => {
-        if (elements.reference && elements.floating) {
-            return (0, react_2.autoUpdate)(elements.reference, elements.floating, update);
-        }
-        return undefined;
-    }, [elements, update]);
     function wrapper(node) {
         if (parentId === null) {
             return (0, jsx_runtime_1.jsx)(react_2.FloatingTree, { children: node });
@@ -53,6 +51,5 @@ const FloatingPopup = function YfmTableFloatingPopup(props) {
                     ...floatingStylesFromProps,
                     ...floatingStyles,
                 }, "data-floating-ui-placement": placement, ...getFloatingProps(), children: (0, jsx_runtime_1.jsx)("div", { className: b(null, className), style: style, "data-qa": qa, children: children }) }) })) : null }));
-};
-exports.FloatingPopup = FloatingPopup;
+});
 //# sourceMappingURL=FloatingPopup.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"FloatingPopup.js","sourceRoot":"../../../../../../../../../src","sources":["extensions/yfm/YfmTable/plugins/YfmTableControls/components/FloatingPopup/FloatingPopup.tsx"],"names":[],"mappings":";;;;AAAA,GAAG;AACH,kDAAkD;AAClD,iDAAiD;AACjD,GAAG;AAEH,iCAAyC;AAEzC,6DAA6D;AAC7D,8CAY4B;AAC5B,6CAAsE;AAEtE,iEAAiC;AAEjC,+BAA8B;AAE9B,MAAM,CAAC,GAAG,IAAA,cAAE,EAAC,0BAA0B,CAAC,CAAC;AAalC,MAAM,aAAa,GAAiC,SAAS,qBAAqB,CACrF,KAAyB;IAEzB,MAAM,EACF,aAAa,EACb,MAAM,GAAG,IAAI,EACb,KAAK,EACL,SAAS,EACT,EAAE,EACF,QAAQ,EACR,cAAc,EAAE,uBAAuB,GAC1C,GAAG,KAAK,CAAC;IAEV,MAAM,MAAM,GAAG,IAAA,yBAAiB,GAAE,CAAC;IACnC,MAAM,QAAQ,GAAG,IAAA,+BAAuB,GAAE,CAAC;IAE3C,MAAM,UAAU,GAAG,IAAA,eAAO,EAAC,GAAG,EAAE,CAAC,CAAC,IAAA,cAAgB,EAAC,KAAK,CAAC,MAAM,CAAC,CAAC,EAAE,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC;IAEnF,MAAM,EACF,IAAI,EACJ,QAAQ,EACR,cAAc,EACd,SAAS,EACT,OAAO,EAAE,EAAC,IAAI,EAAC,EACf,MAAM,GACT,GAAG,IAAA,mBAAW,EAAC;QACZ,MAAM;QACN,IAAI,EAAE,KAAK,CAAC,IAAI;QAChB,SAAS,EAAE,KAAK,CAAC,SAAS;QAC1B,UAAU;KACb,CAAC,CAAC;IAEH,MAAM,EAAC,gBAAgB,EAAC,GAAG,IAAA,uBAAe,GAAE,CAAC;IAE7C,IAAA,iBAAS,EAAC,GAAG,EAAE;QACX,IAAI,aAAa,KAAK,SAAS,IAAI,aAAa,KAAK,IAAI,CAAC,SAAS,CAAC,OAAO,EAAE,CAAC;YAC1E,IAAI,CAAC,YAAY,CAAC,aAAa,CAAC,CAAC;QACrC,CAAC;IACL,CAAC,EAAE,CAAC,aAAa,EAAE,IAAI,CAAC,CAAC,CAAC;IAE1B,IAAA,iBAAS,EAAC,GAAG,EAAE;QACX,IAAI,QAAQ,CAAC,SAAS,IAAI,QAAQ,CAAC,QAAQ,EAAE,CAAC;YAC1C,OAAO,IAAA,kBAAU,EAAC,QAAQ,CAAC,SAAS,EAAE,QAAQ,CAAC,QAAQ,EAAE,MAAM,CAAC,CAAC;QACrE,CAAC;QACD,OAAO,SAAS,CAAC;IACrB,CAAC,EAAE,CAAC,QAAQ,EAAE,MAAM,CAAC,CAAC,CAAC;IAEvB,SAAS,OAAO,CAAC,IAAiB;QAC9B,IAAI,QAAQ,KAAK,IAAI,EAAE,CAAC;YACpB,OAAO,uBAAC,oBAAY,cAAE,IAAI,GAAgB,CAAC;QAC/C,CAAC;QAED,OAAO,IAAI,CAAC;IAChB,CAAC;IAED,OAAO,OAAO,CACV,uBAAC,oBAAY,IAAC,EAAE,EAAE,MAAM,YACnB,IAAI,CAAC,CAAC,CAAC,CACJ,uBAAC,cAAM,cACH,gCACI,GAAG,EAAE,IAAI,CAAC,WAAW,EACrB,KAAK,EAAE;oBACH,QAAQ,EAAE,UAAU;oBACpB,GAAG,EAAE,CAAC;oBACN,IAAI,EAAE,CAAC;oBACP,MAAM;oBACN,KAAK,EAAE,aAAa;oBACpB,aAAa,EAAE,MAAM;oBACrB,OAAO,EAAE,MAAM;oBACf,GAAG,uBAAuB;oBAC1B,GAAG,cAAc;iBACpB,gCAC2B,SAAS,KACjC,gBAAgB,EAAE,YAEtB,gCAAK,SAAS,EAAE,CAAC,CAAC,IAAI,EAAE,SAAS,CAAC,EAAE,KAAK,EAAE,KAAK,aAAW,EAAE,YACxD,QAAQ,GACP,GACJ,GACD,CACZ,CAAC,CAAC,CAAC,IAAI,GACG,CAClB,CAAC;AACN,CAAC,CAAC;AAnFW,QAAA,aAAa,iBAmFxB","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"]}
+{"version":3,"file":"FloatingPopup.js","sourceRoot":"../../../../../../../../../src","sources":["extensions/yfm/YfmTable/plugins/YfmTableControls/components/FloatingPopup/FloatingPopup.tsx"],"names":[],"mappings":";;;;AAAA,GAAG;AACH,kDAAkD;AAClD,iDAAiD;AACjD,GAAG;AAEH,iCAA0E;AAE1E,6DAA6D;AAC7D,8CAY4B;AAC5B,6CAAsE;AAEtE,iEAAiC;AAEjC,+BAA8B;AAE9B,MAAM,CAAC,GAAG,IAAA,cAAE,EAAC,0BAA0B,CAAC,CAAC;AAmB5B,QAAA,aAAa,GAAG,IAAA,kBAAU,EACnC,SAAS,qBAAqB,CAAC,KAAK,EAAE,GAAG;IACrC,MAAM,EACF,aAAa,EACb,MAAM,GAAG,IAAI,EACb,KAAK,EACL,SAAS,EACT,EAAE,EACF,QAAQ,EACR,cAAc,EAAE,uBAAuB,GAC1C,GAAG,KAAK,CAAC;IAEV,MAAM,MAAM,GAAG,IAAA,yBAAiB,GAAE,CAAC;IACnC,MAAM,QAAQ,GAAG,IAAA,+BAAuB,GAAE,CAAC;IAE3C,MAAM,UAAU,GAAG,IAAA,eAAO,EAAC,GAAG,EAAE,CAAC,CAAC,IAAA,cAAgB,EAAC,KAAK,CAAC,MAAM,CAAC,CAAC,EAAE,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC;IAEnF,MAAM,EACF,IAAI,EACJ,cAAc,EACd,SAAS,EACT,OAAO,EAAE,EAAC,IAAI,EAAC,EACf,MAAM,GACT,GAAG,IAAA,mBAAW,EAAC;QACZ,MAAM;QACN,IAAI,EAAE,KAAK,CAAC,IAAI;QAChB,SAAS,EAAE,KAAK,CAAC,SAAS;QAC1B,UAAU;QACV,oBAAoB,EAAE,kBAAU;KACnC,CAAC,CAAC;IAEH,IAAA,2BAAmB,EACf,GAAG,EACH,GAAG,EAAE,CAAC,CAAC;QACH,WAAW,EAAE,MAAM;KACtB,CAAC,EACF,CAAC,MAAM,CAAC,CACX,CAAC;IAEF,MAAM,EAAC,gBAAgB,EAAC,GAAG,IAAA,uBAAe,GAAE,CAAC;IAE7C,IAAA,iBAAS,EAAC,GAAG,EAAE;QACX,IAAI,aAAa,KAAK,SAAS,IAAI,aAAa,KAAK,IAAI,CAAC,SAAS,CAAC,OAAO,EAAE,CAAC;YAC1E,IAAI,CAAC,YAAY,CAAC,aAAa,CAAC,CAAC;QACrC,CAAC;IACL,CAAC,EAAE,CAAC,aAAa,EAAE,IAAI,CAAC,CAAC,CAAC;IAE1B,SAAS,OAAO,CAAC,IAAiB;QAC9B,IAAI,QAAQ,KAAK,IAAI,EAAE,CAAC;YACpB,OAAO,uBAAC,oBAAY,cAAE,IAAI,GAAgB,CAAC;QAC/C,CAAC;QAED,OAAO,IAAI,CAAC;IAChB,CAAC;IAED,OAAO,OAAO,CACV,uBAAC,oBAAY,IAAC,EAAE,EAAE,MAAM,YACnB,IAAI,CAAC,CAAC,CAAC,CACJ,uBAAC,cAAM,cACH,gCACI,GAAG,EAAE,IAAI,CAAC,WAAW,EACrB,KAAK,EAAE;oBACH,QAAQ,EAAE,UAAU;oBACpB,GAAG,EAAE,CAAC;oBACN,IAAI,EAAE,CAAC;oBACP,MAAM;oBACN,KAAK,EAAE,aAAa;oBACpB,aAAa,EAAE,MAAM;oBACrB,OAAO,EAAE,MAAM;oBACf,GAAG,uBAAuB;oBAC1B,GAAG,cAAc;iBACpB,gCAC2B,SAAS,KACjC,gBAAgB,EAAE,YAEtB,gCAAK,SAAS,EAAE,CAAC,CAAC,IAAI,EAAE,SAAS,CAAC,EAAE,KAAK,EAAE,KAAK,aAAW,EAAE,YACxD,QAAQ,GACP,GACJ,GACD,CACZ,CAAC,CAAC,CAAC,IAAI,GACG,CAClB,CAAC;AACN,CAAC,CACJ,CAAC","sourcesContent":["///\n/// Fork of Popup component from @gravity-ui/uikit\n/// This fork does not use floating focus manager\n///\n\nimport {forwardRef, useEffect, useImperativeHandle, 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 {ReferenceType};\n\nexport type FloatingPopupRef = {\n    forceUpdate: () => void;\n};\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 = forwardRef<FloatingPopupRef, FloatingPopupProps>(\n    function YfmTableFloatingPopup(props, ref) {\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            floatingStyles,\n            placement,\n            context: {open},\n            update,\n        } = useFloating({\n            nodeId,\n            open: props.open,\n            placement: props.placement,\n            middleware,\n            whileElementsMounted: autoUpdate,\n        });\n\n        useImperativeHandle<FloatingPopupRef, FloatingPopupRef>(\n            ref,\n            () => ({\n                forceUpdate: update,\n            }),\n            [update],\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        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);\n"]}

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

@@ -30,6 +30,9 @@ export declare class DropCursor {
         isBlock: boolean;
     }): void;
 }
+export declare class TableRowDropCursor extends DropCursor {
+    update(): void;
+}
 export declare class TableColumnDropCursor extends DropCursor {
     update(): void;
 }

package/build/cjs/extensions/yfm/YfmTable/plugins/YfmTableControls/dnd/dnd-drop-cursor.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.TableColumnDropCursor = exports.DropCursor = void 0;
+exports.TableColumnDropCursor = exports.TableRowDropCursor = exports.DropCursor = void 0;
 const utils_1 = require("../../../../../../pm/utils.js");
 const table_utils_1 = require("../../../../../../table-utils/index.js");
 class DropCursor {
@@ -103,6 +103,44 @@ class DropCursor {
     }
 }
 exports.DropCursor = DropCursor;
+class TableRowDropCursor extends DropCursor {
+    update() {
+        const cursorPos = this.getPos();
+        if (cursorPos === null)
+            return;
+        const $cursorPos = this.editorView.state.doc.resolve(cursorPos);
+        const parentTable = (0, utils_1.findParentNodeClosestToPos)($cursorPos, table_utils_1.isTableNode);
+        if (!parentTable)
+            return;
+        let side;
+        let trowPos;
+        if ($cursorPos.nodeAfter && (0, table_utils_1.isTableRowNode)($cursorPos.nodeAfter)) {
+            side = 'top';
+            trowPos = cursorPos;
+        }
+        else if ($cursorPos.nodeBefore && (0, table_utils_1.isTableRowNode)($cursorPos.nodeBefore)) {
+            side = 'bottom';
+            trowPos = cursorPos - $cursorPos.nodeBefore.nodeSize;
+        }
+        else {
+            this.cursorElem?.remove();
+            this.cursorElem = null;
+            return;
+        }
+        const trElem = this.editorView.nodeDOM(trowPos);
+        const tableElem = this.editorView.nodeDOM(parentTable.pos);
+        const trRect = trElem.getBoundingClientRect();
+        const tableRect = tableElem.getBoundingClientRect();
+        const rect = {
+            top: trRect[side] - this.width / 2,
+            bottom: trRect[side] + this.width / 2,
+            left: tableRect.left,
+            right: tableRect.right,
+        };
+        this.render(rect, { isBlock: true });
+    }
+}
+exports.TableRowDropCursor = TableRowDropCursor;
 class TableColumnDropCursor extends DropCursor {
     update() {
         const cursorPos = this.getPos();

package/build/cjs/extensions/yfm/YfmTable/plugins/YfmTableControls/dnd/dnd-drop-cursor.js.map

@@ -1 +1 @@
-{"version":3,"file":"dnd-drop-cursor.js","sourceRoot":"../../../../../../../../src","sources":["extensions/yfm/YfmTable/plugins/YfmTableControls/dnd/dnd-drop-cursor.ts"],"names":[],"mappings":";;;AAAA,yDAAqD;AAErD,wEAA6D;AAqB7D,MAAa,UAAU;IACA,UAAU,CAAa;IAEvB,KAAK,CAAS;IACd,KAAK,CAAqB;IAC1B,KAAK,CAAqB;IAEnC,UAAU,GAAuB,IAAI,CAAC;IACxC,SAAS,GAAkB,IAAI,CAAC;IAExC,YAAY,UAAsB,EAAE,SAA2B,EAAE;QAC7D,IAAI,CAAC,UAAU,GAAG,UAAU,CAAC;QAC7B,IAAI,CAAC,KAAK,GAAG,MAAM,CAAC,KAAK,IAAI,CAAC,CAAC;QAC/B,IAAI,CAAC,KAAK,GAAG,MAAM,CAAC,KAAK,KAAK,KAAK,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,IAAI,OAAO,CAAC;QAC1E,IAAI,CAAC,KAAK,GAAG,MAAM,CAAC,KAAK,CAAC;IAC9B,CAAC;IAED,MAAM;QACF,OAAO,IAAI,CAAC,SAAS,CAAC;IAC1B,CAAC;IAED,MAAM,CAAC,GAAW;QACd,IAAI,OAAO,GAAG,KAAK,QAAQ,IAAI,KAAK,CAAC,GAAG,CAAC;YAAE,MAAM,IAAI,KAAK,CAAC,uBAAuB,CAAC,CAAC;QACpF,IAAI,IAAI,CAAC,SAAS,KAAK,GAAG;YAAE,OAAO;QACnC,IAAI,CAAC,SAAS,GAAG,GAAG,CAAC;QACrB,IAAI,CAAC,MAAM,EAAE,CAAC;IAClB,CAAC;IAED,KAAK;QACD,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC;QACtB,IAAI,CAAC,UAAU,EAAE,MAAM,EAAE,CAAC;QAC1B,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC;IAC3B,CAAC;IAED,MAAM;QACF,MAAM,EAAC,SAAS,EAAC,GAAG,IAAI,CAAC;QACzB,IAAI,SAAS,KAAK,IAAI;YAAE,OAAO;QAE/B,MAAM,IAAI,GAAG,IAAI,CAAC,UAAU,CAAC,KAAK,CAAC,GAAG,CAAC,OAAO,CAAC,SAAS,CAAC,CAAC;QAC1D,MAAM,OAAO,GAAG,CAAC,IAAI,CAAC,MAAM,CAAC,aAAa,CAAC;QAC3C,IAAI,IAAsB,CAAC;QAC3B,IAAI,OAAO,EAAE,CAAC;YACV,MAAM,MAAM,GAAG,IAAI,CAAC,UAAU,EAC1B,KAAK,GAAG,IAAI,CAAC,SAAS,CAAC;YAC3B,IAAI,MAAM,IAAI,KAAK,EAAE,CAAC;gBAClB,MAAM,IAAI,GAAG,IAAI,CAAC,UAAU,CAAC,OAAO,CAAC,SAAS,GAAG,CAAC,MAAM,CAAC,CAAC,CAAC,MAAM,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;gBACjF,IAAI,IAAI,EAAE,CAAC;oBACP,MAAM,QAAQ,GAAI,IAAoB,CAAC,qBAAqB,EAAE,CAAC;oBAC/D,IAAI,GAAG,GAAG,MAAM,CAAC,CAAC,CAAC,QAAQ,CAAC,MAAM,CAAC,CAAC,CAAC,QAAQ,CAAC,GAAG,CAAC;oBAClD,IAAI,MAAM,IAAI,KAAK;wBACf,GAAG;4BACC,CAAC,GAAG;gCAEI,IAAI,CAAC,UAAU,CAAC,OAAO,CAAC,SAAS,CACpC,CAAC,qBAAqB,EAAE,CAAC,GAAG,CAAC;gCAClC,CAAC,CAAC;oBACV,IAAI,GAAG;wBACH,IAAI,EAAE,QAAQ,CAAC,IAAI;wBACnB,KAAK,EAAE,QAAQ,CAAC,KAAK;wBACrB,GAAG,EAAE,GAAG,GAAG,IAAI,CAAC,KAAK,GAAG,CAAC;wBACzB,MAAM,EAAE,GAAG,GAAG,IAAI,CAAC,KAAK,GAAG,CAAC;qBAC/B,CAAC;gBACN,CAAC;YACL,CAAC;QACL,CAAC;QACD,IAAI,CAAC,IAAI,EAAE,CAAC;YACR,MAAM,MAAM,GAAG,IAAI,CAAC,UAAU,CAAC,WAAW,CAAC,SAAS,CAAC,CAAC;YACtD,IAAI,GAAG;gBACH,IAAI,EAAE,MAAM,CAAC,IAAI,GAAG,IAAI,CAAC,KAAK,GAAG,CAAC;gBAClC,KAAK,EAAE,MAAM,CAAC,IAAI,GAAG,IAAI,CAAC,KAAK,GAAG,CAAC;gBACnC,GAAG,EAAE,MAAM,CAAC,GAAG;gBACf,MAAM,EAAE,MAAM,CAAC,MAAM;aACxB,CAAC;QACN,CAAC;QAED,IAAI,CAAC,MAAM,CAAC,IAAI,EAAE,EAAC,OAAO,EAAC,CAAC,CAAC;IACjC,CAAC;IAES,MAAM,CAAC,IAAU,EAAE,EAAC,OAAO,EAAqB;QACtD,MAAM,MAAM,GAAG,IAAI,CAAC,UAAU,CAAC,GAAG,CAAC,YAAa,CAAC;QACjD,IAAI,CAAC,IAAI,CAAC,UAAU,EAAE,CAAC;YACnB,IAAI,CAAC,UAAU,GAAG,MAAM,CAAC,WAAW,CAAC,QAAQ,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC,CAAC;YACpE,IAAI,IAAI,CAAC,KAAK;gBAAE,IAAI,CAAC,UAAU,CAAC,SAAS,GAAG,IAAI,CAAC,KAAK,CAAC;YACvD,IAAI,CAAC,UAAU,CAAC,KAAK,CAAC,OAAO;gBACzB,wDAAwD,CAAC;YAC7D,IAAI,IAAI,CAAC,KAAK,EAAE,CAAC;gBACb,IAAI,CAAC,UAAU,CAAC,KAAK,CAAC,eAAe,GAAG,IAAI,CAAC,KAAK,CAAC;YACvD,CAAC;QACL,CAAC;QACD,IAAI,CAAC,UAAU,CAAC,SAAS,CAAC,MAAM,CAAC,8BAA8B,EAAE,OAAO,CAAC,CAAC;QAC1E,IAAI,CAAC,UAAU,CAAC,SAAS,CAAC,MAAM,CAAC,+BAA+B,EAAE,CAAC,OAAO,CAAC,CAAC;QAC5E,IAAI,UAAU,EAAE,SAAS,CAAC;QAC1B,IACI,CAAC,MAAM;YACP,CAAC,MAAM,KAAK,QAAQ,CAAC,IAAI,IAAI,gBAAgB,CAAC,MAAM,CAAC,CAAC,QAAQ,KAAK,QAAQ,CAAC,EAC9E,CAAC;YACC,UAAU,GAAG,CAAC,WAAW,CAAC;YAC1B,SAAS,GAAG,CAAC,WAAW,CAAC;QAC7B,CAAC;aAAM,CAAC;YACJ,MAAM,IAAI,GAAG,MAAM,CAAC,qBAAqB,EAAE,CAAC;YAC5C,UAAU,GAAG,IAAI,CAAC,IAAI,GAAG,MAAM,CAAC,UAAU,CAAC;YAC3C,SAAS,GAAG,IAAI,CAAC,GAAG,GAAG,MAAM,CAAC,SAAS,CAAC;QAC5C,CAAC;QACD,IAAI,CAAC,UAAU,CAAC,KAAK,CAAC,IAAI,GAAG,IAAI,CAAC,IAAI,GAAG,UAAU,GAAG,IAAI,CAAC;QAC3D,IAAI,CAAC,UAAU,CAAC,KAAK,CAAC,GAAG,GAAG,IAAI,CAAC,GAAG,GAAG,SAAS,GAAG,IAAI,CAAC;QACxD,IAAI,CAAC,UAAU,CAAC,KAAK,CAAC,KAAK,GAAG,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC;QAC5D,IAAI,CAAC,UAAU,CAAC,KAAK,CAAC,MAAM,GAAG,IAAI,CAAC,MAAM,GAAG,IAAI,CAAC,GAAG,GAAG,IAAI,CAAC;IACjE,CAAC;CACJ;AA5GD,gCA4GC;AAED,MAAa,qBAAsB,SAAQ,UAAU;IACjD,MAAM;QACF,MAAM,SAAS,GAAG,IAAI,CAAC,MAAM,EAAE,CAAC;QAChC,IAAI,SAAS,KAAK,IAAI;YAAE,OAAO;QAE/B,MAAM,UAAU,GAAG,IAAI,CAAC,UAAU,CAAC,KAAK,CAAC,GAAG,CAAC,OAAO,CAAC,SAAS,CAAC,CAAC;QAChE,MAAM,WAAW,GAAG,IAAA,kCAA0B,EAAC,UAAU,EAAE,yBAAW,CAAC,CAAC;QACxE,IAAI,CAAC,WAAW;YAAE,OAAO;QAEzB,IAAI,IAAsB,CAAC;QAC3B,IAAI,QAAgB,CAAC;QACrB,IAAI,UAAU,CAAC,SAAS,IAAI,IAAA,6BAAe,EAAC,UAAU,CAAC,SAAS,CAAC,EAAE,CAAC;YAChE,IAAI,GAAG,MAAM,CAAC;YACd,QAAQ,GAAG,SAAS,CAAC;QACzB,CAAC;aAAM,IAAI,UAAU,CAAC,UAAU,IAAI,IAAA,6BAAe,EAAC,UAAU,CAAC,UAAU,CAAC,EAAE,CAAC;YACzE,IAAI,GAAG,OAAO,CAAC;YACf,QAAQ,GAAG,SAAS,GAAG,UAAU,CAAC,UAAU,CAAC,QAAQ,CAAC;QAC1D,CAAC;aAAM,CAAC;YACJ,IAAI,CAAC,UAAU,EAAE,MAAM,EAAE,CAAC;YAC1B,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC;YACvB,OAAO;QACX,CAAC;QAED,MAAM,MAAM,GAAG,IAAI,CAAC,UAAU,CAAC,OAAO,CAAC,QAAQ,CAAC,CAAC;QACjD,MAAM,SAAS,GAAG,IAAI,CAAC,UAAU,CAAC,OAAO,CAAC,WAAW,CAAC,GAAG,CAAC,CAAC;QAE3D,MAAM,MAAM,GAAI,MAAsB,CAAC,qBAAqB,EAAE,CAAC;QAC/D,MAAM,SAAS,GAAI,SAAyB,CAAC,qBAAqB,EAAE,CAAC;QAErE,MAAM,IAAI,GAAS;YACf,IAAI,EAAE,MAAM,CAAC,IAAI,CAAC,GAAG,IAAI,CAAC,KAAK,GAAG,CAAC;YACnC,KAAK,EAAE,MAAM,CAAC,IAAI,CAAC,GAAG,IAAI,CAAC,KAAK,GAAG,CAAC;YACpC,GAAG,EAAE,SAAS,CAAC,GAAG;YAClB,MAAM,EAAE,SAAS,CAAC,MAAM;SAC3B,CAAC;QACF,IAAI,CAAC,MAAM,CAAC,IAAI,EAAE,EAAC,OAAO,EAAE,IAAI,EAAC,CAAC,CAAC;IACvC,CAAC;CACJ;AArCD,sDAqCC","sourcesContent":["import {findParentNodeClosestToPos} from '#pm/utils';\nimport type {EditorView} from '#pm/view';\nimport {isTableCellNode, isTableNode} from 'src/table-utils';\n\n/** Same as `DropCursorOptions` from _prosemirror-dropcursor_ package */\nexport type DropCursorParams = {\n    /** The color of the cursor. Defaults to `black`. Use `false` to apply no color and rely only on class. */\n    color?: string | false;\n\n    /** The precise width of the cursor in pixels. Defaults to 1. */\n    width?: number;\n\n    /** A CSS class name to add to the cursor element. */\n    class?: string;\n};\n\ntype Rect = {\n    left: number;\n    right: number;\n    top: number;\n    bottom: number;\n};\n\nexport class DropCursor {\n    protected readonly editorView: EditorView;\n\n    protected readonly width: number;\n    protected readonly color: string | undefined;\n    protected readonly class: string | undefined;\n\n    protected cursorElem: HTMLElement | null = null;\n    private cursorPos: number | null = null;\n\n    constructor(editorView: EditorView, params: DropCursorParams = {}) {\n        this.editorView = editorView;\n        this.width = params.width ?? 1;\n        this.color = params.color === false ? undefined : params.color || 'black';\n        this.class = params.class;\n    }\n\n    getPos(): number | null {\n        return this.cursorPos;\n    }\n\n    setPos(val: number) {\n        if (typeof val !== 'number' || isNaN(val)) throw new Error('\"val\" is not a number');\n        if (this.cursorPos === val) return;\n        this.cursorPos = val;\n        this.update();\n    }\n\n    clear() {\n        this.cursorPos = null;\n        this.cursorElem?.remove();\n        this.cursorElem = null;\n    }\n\n    update() {\n        const {cursorPos} = this;\n        if (cursorPos === null) return;\n\n        const $pos = this.editorView.state.doc.resolve(cursorPos);\n        const isBlock = !$pos.parent.inlineContent;\n        let rect: Rect | undefined;\n        if (isBlock) {\n            const before = $pos.nodeBefore,\n                after = $pos.nodeAfter;\n            if (before || after) {\n                const node = this.editorView.nodeDOM(cursorPos - (before ? before.nodeSize : 0));\n                if (node) {\n                    const nodeRect = (node as HTMLElement).getBoundingClientRect();\n                    let top = before ? nodeRect.bottom : nodeRect.top;\n                    if (before && after)\n                        top =\n                            (top +\n                                (\n                                    this.editorView.nodeDOM(cursorPos) as HTMLElement\n                                ).getBoundingClientRect().top) /\n                            2;\n                    rect = {\n                        left: nodeRect.left,\n                        right: nodeRect.right,\n                        top: top - this.width / 2,\n                        bottom: top + this.width / 2,\n                    };\n                }\n            }\n        }\n        if (!rect) {\n            const coords = this.editorView.coordsAtPos(cursorPos);\n            rect = {\n                left: coords.left - this.width / 2,\n                right: coords.left + this.width / 2,\n                top: coords.top,\n                bottom: coords.bottom,\n            };\n        }\n\n        this.render(rect, {isBlock});\n    }\n\n    protected render(rect: Rect, {isBlock}: {isBlock: boolean}) {\n        const parent = this.editorView.dom.offsetParent!;\n        if (!this.cursorElem) {\n            this.cursorElem = parent.appendChild(document.createElement('div'));\n            if (this.class) this.cursorElem.className = this.class;\n            this.cursorElem.style.cssText =\n                'position: absolute; z-index: 50; pointer-events: none;';\n            if (this.color) {\n                this.cursorElem.style.backgroundColor = this.color;\n            }\n        }\n        this.cursorElem.classList.toggle('prosemirror-dropcursor-block', isBlock);\n        this.cursorElem.classList.toggle('prosemirror-dropcursor-inline', !isBlock);\n        let parentLeft, parentTop;\n        if (\n            !parent ||\n            (parent === document.body && getComputedStyle(parent).position === 'static')\n        ) {\n            parentLeft = -pageXOffset;\n            parentTop = -pageYOffset;\n        } else {\n            const rect = parent.getBoundingClientRect();\n            parentLeft = rect.left - parent.scrollLeft;\n            parentTop = rect.top - parent.scrollTop;\n        }\n        this.cursorElem.style.left = rect.left - parentLeft + 'px';\n        this.cursorElem.style.top = rect.top - parentTop + 'px';\n        this.cursorElem.style.width = rect.right - rect.left + 'px';\n        this.cursorElem.style.height = rect.bottom - rect.top + 'px';\n    }\n}\n\nexport class TableColumnDropCursor extends DropCursor {\n    update() {\n        const cursorPos = this.getPos();\n        if (cursorPos === null) return;\n\n        const $cursorPos = this.editorView.state.doc.resolve(cursorPos);\n        const parentTable = findParentNodeClosestToPos($cursorPos, isTableNode);\n        if (!parentTable) return;\n\n        let side: 'left' | 'right';\n        let tcellPos: number;\n        if ($cursorPos.nodeAfter && isTableCellNode($cursorPos.nodeAfter)) {\n            side = 'left';\n            tcellPos = cursorPos;\n        } else if ($cursorPos.nodeBefore && isTableCellNode($cursorPos.nodeBefore)) {\n            side = 'right';\n            tcellPos = cursorPos - $cursorPos.nodeBefore.nodeSize;\n        } else {\n            this.cursorElem?.remove();\n            this.cursorElem = null;\n            return;\n        }\n\n        const tdElem = this.editorView.nodeDOM(tcellPos);\n        const tableElem = this.editorView.nodeDOM(parentTable.pos);\n\n        const tdRect = (tdElem as HTMLElement).getBoundingClientRect();\n        const tableRect = (tableElem as HTMLElement).getBoundingClientRect();\n\n        const rect: Rect = {\n            left: tdRect[side] - this.width / 2,\n            right: tdRect[side] + this.width / 2,\n            top: tableRect.top,\n            bottom: tableRect.bottom,\n        };\n        this.render(rect, {isBlock: true});\n    }\n}\n"]}
+{"version":3,"file":"dnd-drop-cursor.js","sourceRoot":"../../../../../../../../src","sources":["extensions/yfm/YfmTable/plugins/YfmTableControls/dnd/dnd-drop-cursor.ts"],"names":[],"mappings":"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","sourcesContent":["import {findParentNodeClosestToPos} from '#pm/utils';\nimport type {EditorView} from '#pm/view';\nimport {isTableCellNode, isTableNode, isTableRowNode} from 'src/table-utils';\n\n/** Same as `DropCursorOptions` from _prosemirror-dropcursor_ package */\nexport type DropCursorParams = {\n    /** The color of the cursor. Defaults to `black`. Use `false` to apply no color and rely only on class. */\n    color?: string | false;\n\n    /** The precise width of the cursor in pixels. Defaults to 1. */\n    width?: number;\n\n    /** A CSS class name to add to the cursor element. */\n    class?: string;\n};\n\ntype Rect = {\n    left: number;\n    right: number;\n    top: number;\n    bottom: number;\n};\n\nexport class DropCursor {\n    protected readonly editorView: EditorView;\n\n    protected readonly width: number;\n    protected readonly color: string | undefined;\n    protected readonly class: string | undefined;\n\n    protected cursorElem: HTMLElement | null = null;\n    private cursorPos: number | null = null;\n\n    constructor(editorView: EditorView, params: DropCursorParams = {}) {\n        this.editorView = editorView;\n        this.width = params.width ?? 1;\n        this.color = params.color === false ? undefined : params.color || 'black';\n        this.class = params.class;\n    }\n\n    getPos(): number | null {\n        return this.cursorPos;\n    }\n\n    setPos(val: number) {\n        if (typeof val !== 'number' || isNaN(val)) throw new Error('\"val\" is not a number');\n        if (this.cursorPos === val) return;\n        this.cursorPos = val;\n        this.update();\n    }\n\n    clear() {\n        this.cursorPos = null;\n        this.cursorElem?.remove();\n        this.cursorElem = null;\n    }\n\n    update() {\n        const {cursorPos} = this;\n        if (cursorPos === null) return;\n\n        const $pos = this.editorView.state.doc.resolve(cursorPos);\n        const isBlock = !$pos.parent.inlineContent;\n        let rect: Rect | undefined;\n        if (isBlock) {\n            const before = $pos.nodeBefore,\n                after = $pos.nodeAfter;\n            if (before || after) {\n                const node = this.editorView.nodeDOM(cursorPos - (before ? before.nodeSize : 0));\n                if (node) {\n                    const nodeRect = (node as HTMLElement).getBoundingClientRect();\n                    let top = before ? nodeRect.bottom : nodeRect.top;\n                    if (before && after)\n                        top =\n                            (top +\n                                (\n                                    this.editorView.nodeDOM(cursorPos) as HTMLElement\n                                ).getBoundingClientRect().top) /\n                            2;\n                    rect = {\n                        left: nodeRect.left,\n                        right: nodeRect.right,\n                        top: top - this.width / 2,\n                        bottom: top + this.width / 2,\n                    };\n                }\n            }\n        }\n        if (!rect) {\n            const coords = this.editorView.coordsAtPos(cursorPos);\n            rect = {\n                left: coords.left - this.width / 2,\n                right: coords.left + this.width / 2,\n                top: coords.top,\n                bottom: coords.bottom,\n            };\n        }\n\n        this.render(rect, {isBlock});\n    }\n\n    protected render(rect: Rect, {isBlock}: {isBlock: boolean}) {\n        const parent = this.editorView.dom.offsetParent!;\n        if (!this.cursorElem) {\n            this.cursorElem = parent.appendChild(document.createElement('div'));\n            if (this.class) this.cursorElem.className = this.class;\n            this.cursorElem.style.cssText =\n                'position: absolute; z-index: 50; pointer-events: none;';\n            if (this.color) {\n                this.cursorElem.style.backgroundColor = this.color;\n            }\n        }\n        this.cursorElem.classList.toggle('prosemirror-dropcursor-block', isBlock);\n        this.cursorElem.classList.toggle('prosemirror-dropcursor-inline', !isBlock);\n        let parentLeft, parentTop;\n        if (\n            !parent ||\n            (parent === document.body && getComputedStyle(parent).position === 'static')\n        ) {\n            parentLeft = -pageXOffset;\n            parentTop = -pageYOffset;\n        } else {\n            const rect = parent.getBoundingClientRect();\n            parentLeft = rect.left - parent.scrollLeft;\n            parentTop = rect.top - parent.scrollTop;\n        }\n        this.cursorElem.style.left = rect.left - parentLeft + 'px';\n        this.cursorElem.style.top = rect.top - parentTop + 'px';\n        this.cursorElem.style.width = rect.right - rect.left + 'px';\n        this.cursorElem.style.height = rect.bottom - rect.top + 'px';\n    }\n}\n\nexport class TableRowDropCursor extends DropCursor {\n    update() {\n        const cursorPos = this.getPos();\n        if (cursorPos === null) return;\n\n        const $cursorPos = this.editorView.state.doc.resolve(cursorPos);\n        const parentTable = findParentNodeClosestToPos($cursorPos, isTableNode);\n        if (!parentTable) return;\n\n        let side: 'top' | 'bottom';\n        let trowPos: number;\n        if ($cursorPos.nodeAfter && isTableRowNode($cursorPos.nodeAfter)) {\n            side = 'top';\n            trowPos = cursorPos;\n        } else if ($cursorPos.nodeBefore && isTableRowNode($cursorPos.nodeBefore)) {\n            side = 'bottom';\n            trowPos = cursorPos - $cursorPos.nodeBefore.nodeSize;\n        } else {\n            this.cursorElem?.remove();\n            this.cursorElem = null;\n            return;\n        }\n\n        const trElem = this.editorView.nodeDOM(trowPos);\n        const tableElem = this.editorView.nodeDOM(parentTable.pos);\n\n        const trRect = (trElem as HTMLElement).getBoundingClientRect();\n        const tableRect = (tableElem as HTMLElement).getBoundingClientRect();\n\n        const rect: Rect = {\n            top: trRect[side] - this.width / 2,\n            bottom: trRect[side] + this.width / 2,\n            left: tableRect.left,\n            right: tableRect.right,\n        };\n        this.render(rect, {isBlock: true});\n    }\n}\n\nexport class TableColumnDropCursor extends DropCursor {\n    update() {\n        const cursorPos = this.getPos();\n        if (cursorPos === null) return;\n\n        const $cursorPos = this.editorView.state.doc.resolve(cursorPos);\n        const parentTable = findParentNodeClosestToPos($cursorPos, isTableNode);\n        if (!parentTable) return;\n\n        let side: 'left' | 'right';\n        let tcellPos: number;\n        if ($cursorPos.nodeAfter && isTableCellNode($cursorPos.nodeAfter)) {\n            side = 'left';\n            tcellPos = cursorPos;\n        } else if ($cursorPos.nodeBefore && isTableCellNode($cursorPos.nodeBefore)) {\n            side = 'right';\n            tcellPos = cursorPos - $cursorPos.nodeBefore.nodeSize;\n        } else {\n            this.cursorElem?.remove();\n            this.cursorElem = null;\n            return;\n        }\n\n        const tdElem = this.editorView.nodeDOM(tcellPos);\n        const tableElem = this.editorView.nodeDOM(parentTable.pos);\n\n        const tdRect = (tdElem as HTMLElement).getBoundingClientRect();\n        const tableRect = (tableElem as HTMLElement).getBoundingClientRect();\n\n        const rect: Rect = {\n            left: tdRect[side] - this.width / 2,\n            right: tdRect[side] + this.width / 2,\n            top: tableRect.top,\n            bottom: tableRect.bottom,\n        };\n        this.render(rect, {isBlock: true});\n    }\n}\n"]}

package/build/cjs/extensions/yfm/YfmTable/plugins/YfmTableControls/dnd/dnd-ghost.js

@@ -76,15 +76,17 @@ class YfmTableDnDGhost {
     _buildRowGhost(view, { tableDesc, rangeIdx }) {
         let shiftX = 0;
         let shiftY = 0;
+        let isHorizontallyScrolled = false;
         const document = view.dom.ownerDocument;
         const container = this._buildGhostContainer(view);
         const table = container.appendChild(document.createElement('table'));
         const tbody = table.appendChild(document.createElement('tbody'));
         {
-            const tablePos = tableDesc.pos;
-            const tableNode = view.domAtPos(tablePos + 1).node;
-            const rect = tableNode.getBoundingClientRect();
-            table.style.width = rect.width + 'px';
+            const tableNode = view.domAtPos(tableDesc.pos + 1).node;
+            isHorizontallyScrolled = tableNode.scrollLeft > 0;
+            const tbodyNode = view.domAtPos(tableDesc.bodyPos + 1).node;
+            const tbodyRect = tbodyNode.getBoundingClientRect();
+            tbody.style.width = tbodyRect.width + 'px';
         }
         const range = tableDesc.base.getRowRanges()[rangeIdx];
         for (let rowIdx = range.startIdx; rowIdx <= range.endIdx; rowIdx++) {
@@ -104,6 +106,9 @@ class YfmTableDnDGhost {
                 }
             }
         }
+        if (isHorizontallyScrolled) {
+            shiftX = 0;
+        }
         removeIdAttributes(table);
         return { domElement: container, shiftX, shiftY };
     }

package/build/cjs/extensions/yfm/YfmTable/plugins/YfmTableControls/dnd/dnd-ghost.js.map

@@ -1 +1 @@
-{"version":3,"file":"dnd-ghost.js","sourceRoot":"../../../../../../../../src","sources":["extensions/yfm/YfmTable/plugins/YfmTableControls/dnd/dnd-ghost.ts"],"names":[],"mappings":"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","sourcesContent":["import type {EditorView} from '#pm/view';\nimport type {TableDescBinded} from 'src/table-utils/table-desc';\n\ntype Event = Pick<MouseEvent, 'clientX' | 'clientY' | 'target'>;\n\ntype BuildGhostResult = {\n    domElement: HTMLElement;\n    shiftX: number;\n    shiftY: number;\n};\n\nexport type YfmTableDnDGhostParams = {\n    initial: Event;\n    type: 'row' | 'column';\n    rangeIdx: number;\n    tableDesc: TableDescBinded;\n};\n\nexport class YfmTableDnDGhost {\n    private _x: number;\n    private _y: number;\n\n    private readonly _dndBackgroundElem: HTMLElement;\n    private readonly _ghostTable: HTMLElement;\n    private readonly _ghostButton: HTMLElement | null = null;\n\n    private readonly _tblShiftX: number;\n    private readonly _tblShiftY: number;\n\n    private readonly _btnShiftX: number = 0;\n    private readonly _btnShiftY: number = 0;\n\n    private _rafId: number;\n\n    constructor(view: EditorView, params: YfmTableDnDGhostParams) {\n        this._x = params.initial.clientX;\n        this._y = params.initial.clientY;\n\n        const document = view.dom.ownerDocument;\n\n        this._dndBackgroundElem = document.createElement('div');\n        this._dndBackgroundElem.classList.add('g-md-yfm-table-dnd-cursor-background');\n\n        {\n            const res = this._buildGhostButton(params);\n            if (res) {\n                this._ghostButton = res.domElement;\n                this._btnShiftX = res.shiftX;\n                this._btnShiftY = res.shiftY;\n                this._dndBackgroundElem.appendChild(this._ghostButton);\n            }\n        }\n\n        {\n            const {domElement, shiftX, shiftY} =\n                params.type === 'row'\n                    ? this._buildRowGhost(view, params)\n                    : this._buildColumnGhost(view, params);\n\n            this._ghostTable = domElement;\n            this._tblShiftX = shiftX;\n            this._tblShiftY = shiftY;\n            this._dndBackgroundElem.appendChild(this._ghostTable);\n        }\n\n        this._updatePositions();\n\n        this._rafId = requestAnimationFrame(() => {\n            document.body.append(this._dndBackgroundElem);\n            this._startAnimation();\n        });\n    }\n\n    move(event: Event) {\n        this._x = event.clientX;\n        this._y = event.clientY;\n    }\n\n    destroy() {\n        cancelAnimationFrame(this._rafId);\n        this._dndBackgroundElem.remove();\n    }\n\n    private _startAnimation() {\n        const self = this;\n        let last = {x: self._x, y: self._y};\n\n        self._rafId = requestAnimationFrame(function update() {\n            if (self._x !== last.x || self._y !== last.y) {\n                last = {x: self._x, y: self._y};\n                self._updatePositions();\n            }\n            self._rafId = requestAnimationFrame(update);\n        });\n    }\n\n    private _updatePositions() {\n        {\n            const tx = this._x + this._tblShiftX;\n            const ty = this._y + this._tblShiftY;\n            this._ghostTable.style.transform = `translate(${tx}px, ${ty}px)`;\n        }\n\n        if (this._ghostButton) {\n            const tx = this._x + this._btnShiftX;\n            const ty = this._y + this._btnShiftY;\n            this._ghostButton.style.transform = `translate(${tx}px, ${ty}px)`;\n        }\n    }\n\n    private _buildRowGhost(\n        view: EditorView,\n        {tableDesc, rangeIdx}: YfmTableDnDGhostParams,\n    ): BuildGhostResult {\n        let shiftX = 0;\n        let shiftY = 0;\n\n        const document = view.dom.ownerDocument;\n        const container = this._buildGhostContainer(view);\n\n        const table = container.appendChild(document.createElement('table'));\n        const tbody = table.appendChild(document.createElement('tbody'));\n\n        {\n            const tablePos = tableDesc.pos;\n            const tableNode = view.domAtPos(tablePos + 1).node;\n            const rect = (tableNode as Element).getBoundingClientRect();\n            table.style.width = rect.width + 'px';\n        }\n\n        const range = tableDesc.base.getRowRanges()[rangeIdx];\n        for (let rowIdx = range.startIdx; rowIdx <= range.endIdx; rowIdx++) {\n            const tr = tbody.appendChild(document.createElement('tr'));\n\n            for (let colIdx = 0; colIdx < tableDesc.cols; colIdx++) {\n                const cellPos = tableDesc.getPosForCell(rowIdx, colIdx);\n                if (cellPos.type === 'real') {\n                    const origNode = view.domAtPos(cellPos.from + 1).node as HTMLElement;\n                    const cloned = tr.appendChild(origNode.cloneNode(true));\n\n                    const rect = origNode.getBoundingClientRect();\n                    (cloned as HTMLElement).style.width = rect.width + 'px';\n                    (cloned as HTMLElement).style.height = rect.height + 'px';\n\n                    if (rowIdx === range.startIdx && colIdx === 0) {\n                        shiftX = rect.left - this._x;\n                        shiftY = rect.top - this._y;\n                    }\n                }\n            }\n        }\n\n        removeIdAttributes(table);\n\n        return {domElement: container, shiftX, shiftY};\n    }\n\n    private _buildColumnGhost(\n        view: EditorView,\n        {tableDesc, rangeIdx}: YfmTableDnDGhostParams,\n    ): BuildGhostResult {\n        let shiftX = 0;\n        let shiftY = 0;\n\n        const document = view.dom.ownerDocument;\n        const container = this._buildGhostContainer(view);\n\n        {\n            const tablePos = tableDesc.pos;\n            const table = view.domAtPos(tablePos + 1).node;\n            const rect = (table as Element).getBoundingClientRect();\n            container.style.height = rect.height + 'px';\n        }\n\n        const table = container.appendChild(document.createElement('table'));\n        const tbody = table.appendChild(document.createElement('tbody'));\n\n        const range = tableDesc.base.getColumnRanges()[rangeIdx];\n        for (let rowIdx = 0; rowIdx < tableDesc.rows; rowIdx++) {\n            const tr = tbody.appendChild(document.createElement('tr'));\n\n            for (let colIdx = range.startIdx; colIdx <= range.endIdx; colIdx++) {\n                const cellPos = tableDesc.getPosForCell(rowIdx, colIdx);\n                if (cellPos.type === 'real') {\n                    const origNode = view.domAtPos(cellPos.from + 1).node as HTMLElement;\n                    const cloned = tr.appendChild(origNode.cloneNode(true));\n\n                    const rect = origNode.getBoundingClientRect();\n                    (cloned as HTMLElement).style.width = rect.width + 'px';\n                    (cloned as HTMLElement).style.height = rect.height + 'px';\n\n                    if (rowIdx === 0 && colIdx === range.startIdx) {\n                        container.style.minWidth = rect.width + 'px';\n\n                        shiftX = rect.left - this._x;\n                        shiftY = rect.top - this._y;\n                    }\n                }\n            }\n        }\n\n        removeIdAttributes(table);\n\n        return {domElement: container, shiftX, shiftY};\n    }\n\n    private _buildGhostButton({\n        initial: {target},\n    }: YfmTableDnDGhostParams): BuildGhostResult | null {\n        if (!(target instanceof Element)) return null;\n\n        const button = target.closest('.g-button');\n        if (!button) return null;\n\n        const container = button.ownerDocument.createElement('div');\n        container.classList.add('g-md-yfm-table-dnd-ghost-button');\n\n        const rect = button.getBoundingClientRect();\n        const cloned = container.appendChild(button.cloneNode(true) as HTMLElement);\n\n        removeIdAttributes(cloned);\n        cloned.style.cursor = '';\n        cloned.style.pointerEvents = 'none';\n\n        return {\n            domElement: container,\n            shiftX: rect.left - this._x,\n            shiftY: rect.top - this._y,\n        };\n    }\n\n    private _buildGhostContainer(view: EditorView): HTMLElement {\n        const container = view.dom.ownerDocument.createElement('div');\n        container.setAttribute('aria-hidden', 'true');\n\n        const yfmClasses = Array.from(view.dom.classList).filter((val) => val.startsWith('yfm_'));\n        container.classList.add('g-md-yfm-table-dnd-ghost', 'yfm', ...yfmClasses);\n\n        return container;\n    }\n}\n\nfunction removeIdAttributes(elem: HTMLElement) {\n    elem.removeAttribute('id');\n    elem.querySelectorAll('[id]').forEach((el) => el.removeAttribute('id'));\n}\n"]}
+{"version":3,"file":"dnd-ghost.js","sourceRoot":"../../../../../../../../src","sources":["extensions/yfm/YfmTable/plugins/YfmTableControls/dnd/dnd-ghost.ts"],"names":[],"mappings":";;;AAkBA,MAAa,gBAAgB;IACjB,EAAE,CAAS;IACX,EAAE,CAAS;IAEF,kBAAkB,CAAc;IAChC,WAAW,CAAc;IACzB,YAAY,GAAuB,IAAI,CAAC;IAExC,UAAU,CAAS;IACnB,UAAU,CAAS;IAEnB,UAAU,GAAW,CAAC,CAAC;IACvB,UAAU,GAAW,CAAC,CAAC;IAEhC,MAAM,CAAS;IAEvB,YAAY,IAAgB,EAAE,MAA8B;QACxD,IAAI,CAAC,EAAE,GAAG,MAAM,CAAC,OAAO,CAAC,OAAO,CAAC;QACjC,IAAI,CAAC,EAAE,GAAG,MAAM,CAAC,OAAO,CAAC,OAAO,CAAC;QAEjC,MAAM,QAAQ,GAAG,IAAI,CAAC,GAAG,CAAC,aAAa,CAAC;QAExC,IAAI,CAAC,kBAAkB,GAAG,QAAQ,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;QACxD,IAAI,CAAC,kBAAkB,CAAC,SAAS,CAAC,GAAG,CAAC,sCAAsC,CAAC,CAAC;QAE9E,CAAC;YACG,MAAM,GAAG,GAAG,IAAI,CAAC,iBAAiB,CAAC,MAAM,CAAC,CAAC;YAC3C,IAAI,GAAG,EAAE,CAAC;gBACN,IAAI,CAAC,YAAY,GAAG,GAAG,CAAC,UAAU,CAAC;gBACnC,IAAI,CAAC,UAAU,GAAG,GAAG,CAAC,MAAM,CAAC;gBAC7B,IAAI,CAAC,UAAU,GAAG,GAAG,CAAC,MAAM,CAAC;gBAC7B,IAAI,CAAC,kBAAkB,CAAC,WAAW,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC;YAC3D,CAAC;QACL,CAAC;QAED,CAAC;YACG,MAAM,EAAC,UAAU,EAAE,MAAM,EAAE,MAAM,EAAC,GAC9B,MAAM,CAAC,IAAI,KAAK,KAAK;gBACjB,CAAC,CAAC,IAAI,CAAC,cAAc,CAAC,IAAI,EAAE,MAAM,CAAC;gBACnC,CAAC,CAAC,IAAI,CAAC,iBAAiB,CAAC,IAAI,EAAE,MAAM,CAAC,CAAC;YAE/C,IAAI,CAAC,WAAW,GAAG,UAAU,CAAC;YAC9B,IAAI,CAAC,UAAU,GAAG,MAAM,CAAC;YACzB,IAAI,CAAC,UAAU,GAAG,MAAM,CAAC;YACzB,IAAI,CAAC,kBAAkB,CAAC,WAAW,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC;QAC1D,CAAC;QAED,IAAI,CAAC,gBAAgB,EAAE,CAAC;QAExB,IAAI,CAAC,MAAM,GAAG,qBAAqB,CAAC,GAAG,EAAE;YACrC,QAAQ,CAAC,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,kBAAkB,CAAC,CAAC;YAC9C,IAAI,CAAC,eAAe,EAAE,CAAC;QAC3B,CAAC,CAAC,CAAC;IACP,CAAC;IAED,IAAI,CAAC,KAAY;QACb,IAAI,CAAC,EAAE,GAAG,KAAK,CAAC,OAAO,CAAC;QACxB,IAAI,CAAC,EAAE,GAAG,KAAK,CAAC,OAAO,CAAC;IAC5B,CAAC;IAED,OAAO;QACH,oBAAoB,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;QAClC,IAAI,CAAC,kBAAkB,CAAC,MAAM,EAAE,CAAC;IACrC,CAAC;IAEO,eAAe;QACnB,MAAM,IAAI,GAAG,IAAI,CAAC;QAClB,IAAI,IAAI,GAAG,EAAC,CAAC,EAAE,IAAI,CAAC,EAAE,EAAE,CAAC,EAAE,IAAI,CAAC,EAAE,EAAC,CAAC;QAEpC,IAAI,CAAC,MAAM,GAAG,qBAAqB,CAAC,SAAS,MAAM;YAC/C,IAAI,IAAI,CAAC,EAAE,KAAK,IAAI,CAAC,CAAC,IAAI,IAAI,CAAC,EAAE,KAAK,IAAI,CAAC,CAAC,EAAE,CAAC;gBAC3C,IAAI,GAAG,EAAC,CAAC,EAAE,IAAI,CAAC,EAAE,EAAE,CAAC,EAAE,IAAI,CAAC,EAAE,EAAC,CAAC;gBAChC,IAAI,CAAC,gBAAgB,EAAE,CAAC;YAC5B,CAAC;YACD,IAAI,CAAC,MAAM,GAAG,qBAAqB,CAAC,MAAM,CAAC,CAAC;QAChD,CAAC,CAAC,CAAC;IACP,CAAC;IAEO,gBAAgB;QACpB,CAAC;YACG,MAAM,EAAE,GAAG,IAAI,CAAC,EAAE,GAAG,IAAI,CAAC,UAAU,CAAC;YACrC,MAAM,EAAE,GAAG,IAAI,CAAC,EAAE,GAAG,IAAI,CAAC,UAAU,CAAC;YACrC,IAAI,CAAC,WAAW,CAAC,KAAK,CAAC,SAAS,GAAG,aAAa,EAAE,OAAO,EAAE,KAAK,CAAC;QACrE,CAAC;QAED,IAAI,IAAI,CAAC,YAAY,EAAE,CAAC;YACpB,MAAM,EAAE,GAAG,IAAI,CAAC,EAAE,GAAG,IAAI,CAAC,UAAU,CAAC;YACrC,MAAM,EAAE,GAAG,IAAI,CAAC,EAAE,GAAG,IAAI,CAAC,UAAU,CAAC;YACrC,IAAI,CAAC,YAAY,CAAC,KAAK,CAAC,SAAS,GAAG,aAAa,EAAE,OAAO,EAAE,KAAK,CAAC;QACtE,CAAC;IACL,CAAC;IAEO,cAAc,CAClB,IAAgB,EAChB,EAAC,SAAS,EAAE,QAAQ,EAAyB;QAE7C,IAAI,MAAM,GAAG,CAAC,CAAC;QACf,IAAI,MAAM,GAAG,CAAC,CAAC;QACf,IAAI,sBAAsB,GAAG,KAAK,CAAC;QAEnC,MAAM,QAAQ,GAAG,IAAI,CAAC,GAAG,CAAC,aAAa,CAAC;QACxC,MAAM,SAAS,GAAG,IAAI,CAAC,oBAAoB,CAAC,IAAI,CAAC,CAAC;QAElD,MAAM,KAAK,GAAG,SAAS,CAAC,WAAW,CAAC,QAAQ,CAAC,aAAa,CAAC,OAAO,CAAC,CAAC,CAAC;QACrE,MAAM,KAAK,GAAG,KAAK,CAAC,WAAW,CAAC,QAAQ,CAAC,aAAa,CAAC,OAAO,CAAC,CAAC,CAAC;QAEjE,CAAC;YACG,MAAM,SAAS,GAAG,IAAI,CAAC,QAAQ,CAAC,SAAS,CAAC,GAAG,GAAG,CAAC,CAAC,CAAC,IAAI,CAAC;YACxD,sBAAsB,GAAI,SAAqB,CAAC,UAAU,GAAG,CAAC,CAAC;YAE/D,MAAM,SAAS,GAAG,IAAI,CAAC,QAAQ,CAAC,SAAS,CAAC,OAAO,GAAG,CAAC,CAAC,CAAC,IAAI,CAAC;YAC5D,MAAM,SAAS,GAAI,SAAqB,CAAC,qBAAqB,EAAE,CAAC;YACjE,KAAK,CAAC,KAAK,CAAC,KAAK,GAAG,SAAS,CAAC,KAAK,GAAG,IAAI,CAAC;QAC/C,CAAC;QAED,MAAM,KAAK,GAAG,SAAS,CAAC,IAAI,CAAC,YAAY,EAAE,CAAC,QAAQ,CAAC,CAAC;QACtD,KAAK,IAAI,MAAM,GAAG,KAAK,CAAC,QAAQ,EAAE,MAAM,IAAI,KAAK,CAAC,MAAM,EAAE,MAAM,EAAE,EAAE,CAAC;YACjE,MAAM,EAAE,GAAG,KAAK,CAAC,WAAW,CAAC,QAAQ,CAAC,aAAa,CAAC,IAAI,CAAC,CAAC,CAAC;YAE3D,KAAK,IAAI,MAAM,GAAG,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC,IAAI,EAAE,MAAM,EAAE,EAAE,CAAC;gBACrD,MAAM,OAAO,GAAG,SAAS,CAAC,aAAa,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;gBACxD,IAAI,OAAO,CAAC,IAAI,KAAK,MAAM,EAAE,CAAC;oBAC1B,MAAM,QAAQ,GAAG,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,IAAI,GAAG,CAAC,CAAC,CAAC,IAAmB,CAAC;oBACrE,MAAM,MAAM,GAAG,EAAE,CAAC,WAAW,CAAC,QAAQ,CAAC,SAAS,CAAC,IAAI,CAAC,CAAC,CAAC;oBAExD,MAAM,IAAI,GAAG,QAAQ,CAAC,qBAAqB,EAAE,CAAC;oBAC7C,MAAsB,CAAC,KAAK,CAAC,KAAK,GAAG,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC;oBACvD,MAAsB,CAAC,KAAK,CAAC,MAAM,GAAG,IAAI,CAAC,MAAM,GAAG,IAAI,CAAC;oBAE1D,IAAI,MAAM,KAAK,KAAK,CAAC,QAAQ,IAAI,MAAM,KAAK,CAAC,EAAE,CAAC;wBAC5C,MAAM,GAAG,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC,EAAE,CAAC;wBAC7B,MAAM,GAAG,IAAI,CAAC,GAAG,GAAG,IAAI,CAAC,EAAE,CAAC;oBAChC,CAAC;gBACL,CAAC;YACL,CAAC;QACL,CAAC;QAED,IAAI,sBAAsB,EAAE,CAAC;YACzB,MAAM,GAAG,CAAC,CAAC;QACf,CAAC;QAED,kBAAkB,CAAC,KAAK,CAAC,CAAC;QAE1B,OAAO,EAAC,UAAU,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,EAAC,CAAC;IACnD,CAAC;IAEO,iBAAiB,CACrB,IAAgB,EAChB,EAAC,SAAS,EAAE,QAAQ,EAAyB;QAE7C,IAAI,MAAM,GAAG,CAAC,CAAC;QACf,IAAI,MAAM,GAAG,CAAC,CAAC;QAEf,MAAM,QAAQ,GAAG,IAAI,CAAC,GAAG,CAAC,aAAa,CAAC;QACxC,MAAM,SAAS,GAAG,IAAI,CAAC,oBAAoB,CAAC,IAAI,CAAC,CAAC;QAElD,CAAC;YACG,MAAM,QAAQ,GAAG,SAAS,CAAC,GAAG,CAAC;YAC/B,MAAM,KAAK,GAAG,IAAI,CAAC,QAAQ,CAAC,QAAQ,GAAG,CAAC,CAAC,CAAC,IAAI,CAAC;YAC/C,MAAM,IAAI,GAAI,KAAiB,CAAC,qBAAqB,EAAE,CAAC;YACxD,SAAS,CAAC,KAAK,CAAC,MAAM,GAAG,IAAI,CAAC,MAAM,GAAG,IAAI,CAAC;QAChD,CAAC;QAED,MAAM,KAAK,GAAG,SAAS,CAAC,WAAW,CAAC,QAAQ,CAAC,aAAa,CAAC,OAAO,CAAC,CAAC,CAAC;QACrE,MAAM,KAAK,GAAG,KAAK,CAAC,WAAW,CAAC,QAAQ,CAAC,aAAa,CAAC,OAAO,CAAC,CAAC,CAAC;QAEjE,MAAM,KAAK,GAAG,SAAS,CAAC,IAAI,CAAC,eAAe,EAAE,CAAC,QAAQ,CAAC,CAAC;QACzD,KAAK,IAAI,MAAM,GAAG,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC,IAAI,EAAE,MAAM,EAAE,EAAE,CAAC;YACrD,MAAM,EAAE,GAAG,KAAK,CAAC,WAAW,CAAC,QAAQ,CAAC,aAAa,CAAC,IAAI,CAAC,CAAC,CAAC;YAE3D,KAAK,IAAI,MAAM,GAAG,KAAK,CAAC,QAAQ,EAAE,MAAM,IAAI,KAAK,CAAC,MAAM,EAAE,MAAM,EAAE,EAAE,CAAC;gBACjE,MAAM,OAAO,GAAG,SAAS,CAAC,aAAa,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;gBACxD,IAAI,OAAO,CAAC,IAAI,KAAK,MAAM,EAAE,CAAC;oBAC1B,MAAM,QAAQ,GAAG,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,IAAI,GAAG,CAAC,CAAC,CAAC,IAAmB,CAAC;oBACrE,MAAM,MAAM,GAAG,EAAE,CAAC,WAAW,CAAC,QAAQ,CAAC,SAAS,CAAC,IAAI,CAAC,CAAC,CAAC;oBAExD,MAAM,IAAI,GAAG,QAAQ,CAAC,qBAAqB,EAAE,CAAC;oBAC7C,MAAsB,CAAC,KAAK,CAAC,KAAK,GAAG,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC;oBACvD,MAAsB,CAAC,KAAK,CAAC,MAAM,GAAG,IAAI,CAAC,MAAM,GAAG,IAAI,CAAC;oBAE1D,IAAI,MAAM,KAAK,CAAC,IAAI,MAAM,KAAK,KAAK,CAAC,QAAQ,EAAE,CAAC;wBAC5C,SAAS,CAAC,KAAK,CAAC,QAAQ,GAAG,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC;wBAE7C,MAAM,GAAG,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC,EAAE,CAAC;wBAC7B,MAAM,GAAG,IAAI,CAAC,GAAG,GAAG,IAAI,CAAC,EAAE,CAAC;oBAChC,CAAC;gBACL,CAAC;YACL,CAAC;QACL,CAAC;QAED,kBAAkB,CAAC,KAAK,CAAC,CAAC;QAE1B,OAAO,EAAC,UAAU,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,EAAC,CAAC;IACnD,CAAC;IAEO,iBAAiB,CAAC,EACtB,OAAO,EAAE,EAAC,MAAM,EAAC,GACI;QACrB,IAAI,CAAC,CAAC,MAAM,YAAY,OAAO,CAAC;YAAE,OAAO,IAAI,CAAC;QAE9C,MAAM,MAAM,GAAG,MAAM,CAAC,OAAO,CAAC,WAAW,CAAC,CAAC;QAC3C,IAAI,CAAC,MAAM;YAAE,OAAO,IAAI,CAAC;QAEzB,MAAM,SAAS,GAAG,MAAM,CAAC,aAAa,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;QAC5D,SAAS,CAAC,SAAS,CAAC,GAAG,CAAC,iCAAiC,CAAC,CAAC;QAE3D,MAAM,IAAI,GAAG,MAAM,CAAC,qBAAqB,EAAE,CAAC;QAC5C,MAAM,MAAM,GAAG,SAAS,CAAC,WAAW,CAAC,MAAM,CAAC,SAAS,CAAC,IAAI,CAAgB,CAAC,CAAC;QAE5E,kBAAkB,CAAC,MAAM,CAAC,CAAC;QAC3B,MAAM,CAAC,KAAK,CAAC,MAAM,GAAG,EAAE,CAAC;QACzB,MAAM,CAAC,KAAK,CAAC,aAAa,GAAG,MAAM,CAAC;QAEpC,OAAO;YACH,UAAU,EAAE,SAAS;YACrB,MAAM,EAAE,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC,EAAE;YAC3B,MAAM,EAAE,IAAI,CAAC,GAAG,GAAG,IAAI,CAAC,EAAE;SAC7B,CAAC;IACN,CAAC;IAEO,oBAAoB,CAAC,IAAgB;QACzC,MAAM,SAAS,GAAG,IAAI,CAAC,GAAG,CAAC,aAAa,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;QAC9D,SAAS,CAAC,YAAY,CAAC,aAAa,EAAE,MAAM,CAAC,CAAC;QAE9C,MAAM,UAAU,GAAG,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,GAAG,CAAC,SAAS,CAAC,CAAC,MAAM,CAAC,CAAC,GAAG,EAAE,EAAE,CAAC,GAAG,CAAC,UAAU,CAAC,MAAM,CAAC,CAAC,CAAC;QAC1F,SAAS,CAAC,SAAS,CAAC,GAAG,CAAC,0BAA0B,EAAE,KAAK,EAAE,GAAG,UAAU,CAAC,CAAC;QAE1E,OAAO,SAAS,CAAC;IACrB,CAAC;CACJ;AArOD,4CAqOC;AAED,SAAS,kBAAkB,CAAC,IAAiB;IACzC,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,CAAC;IAC3B,IAAI,CAAC,gBAAgB,CAAC,MAAM,CAAC,CAAC,OAAO,CAAC,CAAC,EAAE,EAAE,EAAE,CAAC,EAAE,CAAC,eAAe,CAAC,IAAI,CAAC,CAAC,CAAC;AAC5E,CAAC","sourcesContent":["import type {EditorView} from '#pm/view';\nimport type {TableDescBinded} from 'src/table-utils/table-desc';\n\ntype Event = Pick<MouseEvent, 'clientX' | 'clientY' | 'target'>;\n\ntype BuildGhostResult = {\n    domElement: HTMLElement;\n    shiftX: number;\n    shiftY: number;\n};\n\nexport type YfmTableDnDGhostParams = {\n    initial: Event;\n    type: 'row' | 'column';\n    rangeIdx: number;\n    tableDesc: TableDescBinded;\n};\n\nexport class YfmTableDnDGhost {\n    private _x: number;\n    private _y: number;\n\n    private readonly _dndBackgroundElem: HTMLElement;\n    private readonly _ghostTable: HTMLElement;\n    private readonly _ghostButton: HTMLElement | null = null;\n\n    private readonly _tblShiftX: number;\n    private readonly _tblShiftY: number;\n\n    private readonly _btnShiftX: number = 0;\n    private readonly _btnShiftY: number = 0;\n\n    private _rafId: number;\n\n    constructor(view: EditorView, params: YfmTableDnDGhostParams) {\n        this._x = params.initial.clientX;\n        this._y = params.initial.clientY;\n\n        const document = view.dom.ownerDocument;\n\n        this._dndBackgroundElem = document.createElement('div');\n        this._dndBackgroundElem.classList.add('g-md-yfm-table-dnd-cursor-background');\n\n        {\n            const res = this._buildGhostButton(params);\n            if (res) {\n                this._ghostButton = res.domElement;\n                this._btnShiftX = res.shiftX;\n                this._btnShiftY = res.shiftY;\n                this._dndBackgroundElem.appendChild(this._ghostButton);\n            }\n        }\n\n        {\n            const {domElement, shiftX, shiftY} =\n                params.type === 'row'\n                    ? this._buildRowGhost(view, params)\n                    : this._buildColumnGhost(view, params);\n\n            this._ghostTable = domElement;\n            this._tblShiftX = shiftX;\n            this._tblShiftY = shiftY;\n            this._dndBackgroundElem.appendChild(this._ghostTable);\n        }\n\n        this._updatePositions();\n\n        this._rafId = requestAnimationFrame(() => {\n            document.body.append(this._dndBackgroundElem);\n            this._startAnimation();\n        });\n    }\n\n    move(event: Event) {\n        this._x = event.clientX;\n        this._y = event.clientY;\n    }\n\n    destroy() {\n        cancelAnimationFrame(this._rafId);\n        this._dndBackgroundElem.remove();\n    }\n\n    private _startAnimation() {\n        const self = this;\n        let last = {x: self._x, y: self._y};\n\n        self._rafId = requestAnimationFrame(function update() {\n            if (self._x !== last.x || self._y !== last.y) {\n                last = {x: self._x, y: self._y};\n                self._updatePositions();\n            }\n            self._rafId = requestAnimationFrame(update);\n        });\n    }\n\n    private _updatePositions() {\n        {\n            const tx = this._x + this._tblShiftX;\n            const ty = this._y + this._tblShiftY;\n            this._ghostTable.style.transform = `translate(${tx}px, ${ty}px)`;\n        }\n\n        if (this._ghostButton) {\n            const tx = this._x + this._btnShiftX;\n            const ty = this._y + this._btnShiftY;\n            this._ghostButton.style.transform = `translate(${tx}px, ${ty}px)`;\n        }\n    }\n\n    private _buildRowGhost(\n        view: EditorView,\n        {tableDesc, rangeIdx}: YfmTableDnDGhostParams,\n    ): BuildGhostResult {\n        let shiftX = 0;\n        let shiftY = 0;\n        let isHorizontallyScrolled = false;\n\n        const document = view.dom.ownerDocument;\n        const container = this._buildGhostContainer(view);\n\n        const table = container.appendChild(document.createElement('table'));\n        const tbody = table.appendChild(document.createElement('tbody'));\n\n        {\n            const tableNode = view.domAtPos(tableDesc.pos + 1).node;\n            isHorizontallyScrolled = (tableNode as Element).scrollLeft > 0;\n\n            const tbodyNode = view.domAtPos(tableDesc.bodyPos + 1).node;\n            const tbodyRect = (tbodyNode as Element).getBoundingClientRect();\n            tbody.style.width = tbodyRect.width + 'px';\n        }\n\n        const range = tableDesc.base.getRowRanges()[rangeIdx];\n        for (let rowIdx = range.startIdx; rowIdx <= range.endIdx; rowIdx++) {\n            const tr = tbody.appendChild(document.createElement('tr'));\n\n            for (let colIdx = 0; colIdx < tableDesc.cols; colIdx++) {\n                const cellPos = tableDesc.getPosForCell(rowIdx, colIdx);\n                if (cellPos.type === 'real') {\n                    const origNode = view.domAtPos(cellPos.from + 1).node as HTMLElement;\n                    const cloned = tr.appendChild(origNode.cloneNode(true));\n\n                    const rect = origNode.getBoundingClientRect();\n                    (cloned as HTMLElement).style.width = rect.width + 'px';\n                    (cloned as HTMLElement).style.height = rect.height + 'px';\n\n                    if (rowIdx === range.startIdx && colIdx === 0) {\n                        shiftX = rect.left - this._x;\n                        shiftY = rect.top - this._y;\n                    }\n                }\n            }\n        }\n\n        if (isHorizontallyScrolled) {\n            shiftX = 0;\n        }\n\n        removeIdAttributes(table);\n\n        return {domElement: container, shiftX, shiftY};\n    }\n\n    private _buildColumnGhost(\n        view: EditorView,\n        {tableDesc, rangeIdx}: YfmTableDnDGhostParams,\n    ): BuildGhostResult {\n        let shiftX = 0;\n        let shiftY = 0;\n\n        const document = view.dom.ownerDocument;\n        const container = this._buildGhostContainer(view);\n\n        {\n            const tablePos = tableDesc.pos;\n            const table = view.domAtPos(tablePos + 1).node;\n            const rect = (table as Element).getBoundingClientRect();\n            container.style.height = rect.height + 'px';\n        }\n\n        const table = container.appendChild(document.createElement('table'));\n        const tbody = table.appendChild(document.createElement('tbody'));\n\n        const range = tableDesc.base.getColumnRanges()[rangeIdx];\n        for (let rowIdx = 0; rowIdx < tableDesc.rows; rowIdx++) {\n            const tr = tbody.appendChild(document.createElement('tr'));\n\n            for (let colIdx = range.startIdx; colIdx <= range.endIdx; colIdx++) {\n                const cellPos = tableDesc.getPosForCell(rowIdx, colIdx);\n                if (cellPos.type === 'real') {\n                    const origNode = view.domAtPos(cellPos.from + 1).node as HTMLElement;\n                    const cloned = tr.appendChild(origNode.cloneNode(true));\n\n                    const rect = origNode.getBoundingClientRect();\n                    (cloned as HTMLElement).style.width = rect.width + 'px';\n                    (cloned as HTMLElement).style.height = rect.height + 'px';\n\n                    if (rowIdx === 0 && colIdx === range.startIdx) {\n                        container.style.minWidth = rect.width + 'px';\n\n                        shiftX = rect.left - this._x;\n                        shiftY = rect.top - this._y;\n                    }\n                }\n            }\n        }\n\n        removeIdAttributes(table);\n\n        return {domElement: container, shiftX, shiftY};\n    }\n\n    private _buildGhostButton({\n        initial: {target},\n    }: YfmTableDnDGhostParams): BuildGhostResult | null {\n        if (!(target instanceof Element)) return null;\n\n        const button = target.closest('.g-button');\n        if (!button) return null;\n\n        const container = button.ownerDocument.createElement('div');\n        container.classList.add('g-md-yfm-table-dnd-ghost-button');\n\n        const rect = button.getBoundingClientRect();\n        const cloned = container.appendChild(button.cloneNode(true) as HTMLElement);\n\n        removeIdAttributes(cloned);\n        cloned.style.cursor = '';\n        cloned.style.pointerEvents = 'none';\n\n        return {\n            domElement: container,\n            shiftX: rect.left - this._x,\n            shiftY: rect.top - this._y,\n        };\n    }\n\n    private _buildGhostContainer(view: EditorView): HTMLElement {\n        const container = view.dom.ownerDocument.createElement('div');\n        container.setAttribute('aria-hidden', 'true');\n\n        const yfmClasses = Array.from(view.dom.classList).filter((val) => val.startsWith('yfm_'));\n        container.classList.add('g-md-yfm-table-dnd-ghost', 'yfm', ...yfmClasses);\n\n        return container;\n    }\n}\n\nfunction removeIdAttributes(elem: HTMLElement) {\n    elem.removeAttribute('id');\n    elem.querySelectorAll('[id]').forEach((el) => el.removeAttribute('id'));\n}\n"]}

package/build/cjs/extensions/yfm/YfmTable/plugins/YfmTableControls/dnd/dnd.js

@@ -124,7 +124,7 @@ class YfmTableRowDnDHandler extends YfmTableDnDAbstractHandler {
         super(view, {
             ...params,
             logger: params.logger.nested({ component: 'row-dnd-handler' }),
-            dropCursor: new dnd_drop_cursor_1.DropCursor(view, params.dropCursor),
+            dropCursor: new dnd_drop_cursor_1.TableRowDropCursor(view, params.dropCursor),
         });
     }
     canDrag() {