@gravity-ui/markdown-editor 15.19.1 → 15.21.0

package/build/cjs/extensions/yfm/YfmTable/plugins/YfmTableControls/nodeviews/yfm-table-cell-view.js

@@ -0,0 +1,288 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.yfmTableCellView = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const _core_1 = require("../../../../../../core/index.js");
+const utils_1 = require("../../../../../../pm/utils.js");
+const ReactRenderer_1 = require("../../../../../behavior/ReactRenderer/index.js");
+const lodash_1 = require("../../../../../../lodash.js");
+const ErrorBoundary_1 = require("../../../../../../react-utils/ErrorBoundary.js");
+const table_utils_1 = require("../../../../../../table-utils/index.js");
+const table_desc_1 = require("../../../../../../table-utils/table-desc.js");
+const const_1 = require("../../../const.js");
+const actions_1 = require("../actions.js");
+const clear_cells_1 = require("../commands/clear-cells.js");
+const insert_empty_column_1 = require("../commands/insert-empty-column.js");
+const insert_empty_row_1 = require("../commands/insert-empty-row.js");
+const remove_column_range_1 = require("../commands/remove-column-range.js");
+const remove_row_range_1 = require("../commands/remove-row-range.js");
+const FloatingMenuControl_1 = require("../components/FloatingMenuControl/index.js");
+const const_2 = require("../const.js");
+const dnd_1 = require("../dnd/dnd.js");
+const dnd_plugin_1 = require("../plugins/dnd-plugin.js");
+const dropCursorParams = {
+    color: 'var(--g-color-line-brand)',
+    width: 2,
+};
+const yfmTableCellView = (opts) => (node, view, getPos, decorations) => {
+    return new YfmTableCellView(node, view, getPos, decorations, opts);
+};
+exports.yfmTableCellView = yfmTableCellView;
+class YfmTableCellView {
+    dom;
+    contentDOM;
+    _node;
+    _view;
+    _getPos;
+    _renderer;
+    _logger;
+    _dndEnabled;
+    _decoRowUniqKey = null;
+    _decoColumnUniqKey = null;
+    _cellInfo;
+    _dndHandler;
+    constructor(node, view, getPos, decorations, opts) {
+        this._node = node;
+        this._view = view;
+        this._getPos = getPos;
+        this._logger = (0, _core_1.getLoggerFromState)(view.state).nested({
+            node: 'yfm-table',
+        });
+        this._dndEnabled = opts.dndEnabled;
+        this.dom = document.createElement('td');
+        this._updateDom();
+        this.contentDOM = this.dom;
+        this._cellInfo = null;
+        this._dndHandler = null;
+        this._renderer = (0, ReactRenderer_1.getReactRendererFromState)(view.state).createItem('yfm-table-cell-view', () => {
+            if (!this._cellInfo)
+                return null;
+            const { showRowControl, showColumnControl, rowRange, columnRange } = this._cellInfo;
+            return ((0, jsx_runtime_1.jsxs)(ErrorBoundary_1.ErrorLoggerBoundary, { children: [showRowControl && ((0, jsx_runtime_1.jsx)(FloatingMenuControl_1.FloatingMenuControl, { type: "row", acnhorElement: this.dom, dndHandler: this._dndHandler?.row, multiple: rowRange.rowsCount > 1, onMenuOpenToggle: this._onRowControlOpenToggle, onClearCellsClick: this._onRowClearCellsClick, onInsertBeforeClick: this._onRowInsertBeforeClick, onInsertAfterClick: this._onRowInsertAfterClick, onRemoveRangeClick: this._onRowRemoveRangeClick, onRemoveTableClick: this._onRemoveTableClick })), showColumnControl && ((0, jsx_runtime_1.jsx)(FloatingMenuControl_1.FloatingMenuControl, { type: "column", acnhorElement: this.dom, dndHandler: this._dndHandler?.column, multiple: columnRange.columnsCount > 1, onMenuOpenToggle: this._onColumnControlOpenToggle, onClearCellsClick: this._onColumnClearCellsClick, onInsertBeforeClick: this._onColumnInsertBeforeClick, onInsertAfterClick: this._onColumnInsertAfterClick, onRemoveRangeClick: this._onColumnRemoveRangeClick, onRemoveTableClick: this._onRemoveTableClick }))] }));
+        });
+        this.update(node, decorations);
+    }
+    update(node, decorations) {
+        {
+            const prev = this._node;
+            this._node = node;
+            this._updateDom(prev);
+        }
+        const cellInfo = this._getCellInfo();
+        if (cellInfo && (cellInfo.cell.row === 0 || cellInfo.cell.column === 0)) {
+            const info = (this._cellInfo = {
+                rowIndex: cellInfo.cell.row,
+                columnIndex: cellInfo.cell.column,
+                showRowControl: false,
+                showColumnControl: false,
+                rowRange: cellInfo.tableDesc.base.getRowRangeByRowIdx(cellInfo.cell.row),
+                columnRange: cellInfo.tableDesc.base.getColumnRangeByColumnIdx(cellInfo.cell.column),
+            });
+            for (const deco of decorations) {
+                const type = deco.spec[const_2.YfmTableDecorationTypeKey];
+                info.showRowControl ||= type === const_2.YfmTableDecorationType.ShowRowControl;
+                info.showRowControl ||= type === const_2.YfmTableDecorationType.OpenRowMenu;
+                info.showColumnControl ||= type === const_2.YfmTableDecorationType.ShowColumnControl;
+                info.showColumnControl ||= type === const_2.YfmTableDecorationType.OpenColumnMenu;
+            }
+            if (this._dndEnabled && !this._dndHandler)
+                this._dndHandler = new dnd_1.YfmTableDnDHandler(this._view, {
+                    cellNode: node,
+                    cellGetPos: this._getPos,
+                    logger: this._logger,
+                    dropCursor: dropCursorParams,
+                });
+            this._dndHandler?.update(node);
+        }
+        else {
+            this._cellInfo = null;
+            this._dndHandler?.destroy();
+            this._dndHandler = null;
+        }
+        this._renderer.rerender();
+        return true;
+    }
+    destroy() {
+        this._dndHandler?.destroy();
+        this._dndHandler = null;
+        this._renderer.remove();
+        this._onRowControlOpenToggle(false);
+        this._onColumnControlOpenToggle(false);
+    }
+    _updateDom(prev) {
+        if (prev?.attrs[const_1.YfmTableAttr.CellAlign]) {
+            this.dom.classList.remove(prev.attrs[const_1.YfmTableAttr.CellAlign]);
+        }
+        if (this._node.attrs[const_1.YfmTableAttr.Colspan])
+            this.dom.setAttribute('colspan', this._node.attrs[const_1.YfmTableAttr.Colspan]);
+        else
+            this.dom.removeAttribute('colspan');
+        if (this._node.attrs[const_1.YfmTableAttr.Rowspan])
+            this.dom.setAttribute('rowspan', this._node.attrs[const_1.YfmTableAttr.Rowspan]);
+        else
+            this.dom.removeAttribute('rowspan');
+        if (this._node.attrs[const_1.YfmTableAttr.CellAlign]) {
+            this.dom.classList.add(this._node.attrs[const_1.YfmTableAttr.CellAlign]);
+            this.dom.setAttribute(const_1.YfmTableAttr.CellAlign, this._node.attrs[const_1.YfmTableAttr.Rowspan]);
+        }
+        else {
+            this.dom.removeAttribute(const_1.YfmTableAttr.CellAlign);
+        }
+    }
+    _onRowControlOpenToggle = (open) => {
+        if (open === false) {
+            if (this._decoRowUniqKey) {
+                this._view.dispatch((0, dnd_plugin_1.deactivateRow)(this._view.state.tr, this._decoRowUniqKey));
+                this._decoRowUniqKey = null;
+            }
+            return;
+        }
+        this._logger.event({ event: 'open-row-menu' });
+        const info = this._getCellInfo();
+        if (!info)
+            return;
+        this._decoRowUniqKey = Date.now();
+        const rowRange = info.tableDesc.base.getRowRangeByRowIdx(info.cell.row);
+        const tr = (0, dnd_plugin_1.activateRows)(this._view.state.tr, {
+            controlCell: { from: info.pos, to: info.pos + this._node.nodeSize },
+            rows: (0, lodash_1.range)(rowRange.startIdx, rowRange.endIdx + 1).map((rowIdx) => info.tableDesc.getPosForRow(rowIdx)),
+            uniqKey: this._decoRowUniqKey,
+        });
+        this._view.dispatch(tr);
+    };
+    _onColumnControlOpenToggle = (open) => {
+        if (open === false) {
+            if (this._decoColumnUniqKey) {
+                this._view.dispatch((0, dnd_plugin_1.deactivateColumn)(this._view.state.tr, this._decoColumnUniqKey));
+                this._decoColumnUniqKey = null;
+            }
+            return;
+        }
+        this._logger.event({ event: 'open-column-menu' });
+        const info = this._getCellInfo();
+        if (!info)
+            return;
+        this._decoColumnUniqKey = Date.now();
+        const currColumnRange = info.tableDesc.base.getColumnRangeByColumnIdx(info.cell.column);
+        const cells = [];
+        for (const i of (0, lodash_1.range)(currColumnRange.startIdx, currColumnRange.endIdx + 1)) {
+            cells.push(...info.tableDesc.getPosForColumn(i));
+        }
+        const tr = (0, dnd_plugin_1.activateColumns)(this._view.state.tr, {
+            controlCell: { from: info.pos, to: info.pos + this._node.nodeSize },
+            cells: cells.filter((pos) => pos.type === 'real'),
+            uniqKey: this._decoColumnUniqKey,
+        });
+        this._view.dispatch(tr);
+    };
+    _onRowClearCellsClick = () => {
+        this._logger.event({ event: 'row-clear-cells', source: 'row-menu' });
+        const info = this._getCellInfo();
+        if (info) {
+            const rowRange = info.tableDesc.base.getRowRangeByRowIdx(info.cell.row);
+            (0, clear_cells_1.clearCells)({
+                tablePos: info.table.pos,
+                rows: (0, lodash_1.range)(rowRange.startIdx, rowRange.endIdx + 1),
+            })(this._view.state, this._view.dispatch);
+        }
+        this._view.focus();
+    };
+    _onColumnClearCellsClick = () => {
+        this._logger.event({ event: 'column-clear-cells', source: 'column-menu' });
+        const info = this._getCellInfo();
+        if (info) {
+            const colRange = info.tableDesc.base.getColumnRangeByColumnIdx(info.cell.column);
+            (0, clear_cells_1.clearCells)({
+                tablePos: info.table.pos,
+                cols: (0, lodash_1.range)(colRange.startIdx, colRange.endIdx + 1),
+            })(this._view.state, this._view.dispatch);
+        }
+        this._view.focus();
+    };
+    _onRowInsertBeforeClick = () => {
+        this._logger.event({ event: 'row-insert-before', source: 'row-menu' });
+        const info = this._getCellInfo();
+        if (info) {
+            const rowRange = info.tableDesc.base.getRowRangeByRowIdx(info.cell.row);
+            this._insertRow(info.tableDesc, rowRange.startIdx);
+        }
+        this._view.focus();
+    };
+    _onRowInsertAfterClick = () => {
+        this._logger.event({ event: 'row-insert-after', source: 'column-menu' });
+        const info = this._getCellInfo();
+        if (info) {
+            const rowRange = info.tableDesc.base.getRowRangeByRowIdx(info.cell.row);
+            this._insertRow(info.tableDesc, rowRange.endIdx + 1);
+        }
+        this._view.focus();
+    };
+    _insertRow(tableDesc, rowIndex) {
+        (0, insert_empty_row_1.insertEmptyRow)({ tablePos: tableDesc.pos, rowIndex })(this._view.state, this._view.dispatch, this._view);
+    }
+    _onColumnInsertBeforeClick = () => {
+        this._logger.event({ event: 'column-insert-before', source: 'column-menu' });
+        const info = this._getCellInfo();
+        if (info) {
+            const colRange = info.tableDesc.base.getColumnRangeByColumnIdx(info.cell.column);
+            this._insertColumn(info.tableDesc, colRange.startIdx);
+        }
+        this._view.focus();
+    };
+    _onColumnInsertAfterClick = () => {
+        this._logger.event({ event: 'column-insert-after', source: 'column-menu' });
+        const info = this._getCellInfo();
+        if (info) {
+            const colRange = info.tableDesc.base.getColumnRangeByColumnIdx(info.cell.column);
+            this._insertColumn(info.tableDesc, colRange.endIdx + 1);
+        }
+        this._view.focus();
+    };
+    _insertColumn(tableDesc, colIndex) {
+        (0, insert_empty_column_1.insertEmptyColumn)({ tablePos: tableDesc.pos, colIndex })(this._view.state, this._view.dispatch, this._view);
+    }
+    _onRowRemoveRangeClick = () => {
+        this._logger.event({ event: 'row-remove', source: 'row-menu' });
+        const info = this._getCellInfo();
+        if (info) {
+            const rangeIdx = info.tableDesc.base.getRowRangeIdxByRowIdx(info.cell.row);
+            (0, remove_row_range_1.removeRowRange)({ tablePos: info.tableDesc.pos, rangeIdx })(this._view.state, this._view.dispatch, this._view);
+        }
+        this._view.focus();
+    };
+    _onColumnRemoveRangeClick = () => {
+        this._logger.event({ event: 'column-remove', source: 'column-menu' });
+        const info = this._getCellInfo();
+        if (info) {
+            const rangeIdx = info.tableDesc.base.getColumnRangeIdxByColumnIdx(info.cell.column);
+            (0, remove_column_range_1.removeColumnRange)({ tablePos: info.tableDesc.pos, rangeIdx })(this._view.state, this._view.dispatch, this._view);
+        }
+        this._view.focus();
+    };
+    _onRemoveTableClick = () => {
+        this._logger.event({ event: 'table-remove' });
+        const info = this._getCellInfo();
+        if (info) {
+            (0, actions_1.removeYfmTable)(this._view.state, this._view.dispatch, this._view, {
+                tablePos: info.table.pos,
+                tableNode: info.table.node,
+            });
+        }
+        this._view.focus();
+    };
+    _getCellInfo() {
+        const table = this._getParentTable();
+        const tableDesc = table ? table_desc_1.TableDesc.create(table.node)?.bind(table.pos) : undefined;
+        const cellInfo = tableDesc?.base.getCellInfo(this._node);
+        return cellInfo
+            ? { pos: this._getPos(), table: table, tableDesc: tableDesc, cell: cellInfo }
+            : undefined;
+    }
+    _getParentTable = () => {
+        const pos = this._getPos();
+        return pos !== undefined
+            ? (0, utils_1.findParentNodeClosestToPos)(this._view.state.doc.resolve(pos), table_utils_1.isTableNode)
+            : undefined;
+    };
+}
+//# sourceMappingURL=yfm-table-cell-view.js.map

package/build/cjs/extensions/yfm/YfmTable/plugins/YfmTableControls/nodeviews/yfm-table-cell-view.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"yfm-table-cell-view.js","sourceRoot":"../../../../../../../../src","sources":["extensions/yfm/YfmTable/plugins/YfmTableControls/nodeviews/yfm-table-cell-view.tsx"],"names":[],"mappings":";;;;AAAA,2DAAyC;AAEzC,yDAAqD;AAErD,kFAAgF;AAChF,wDAA4C;AAE5C,kFAAkE;AAClE,wEAA4C;AAC5C,4EAMoC;AAEpC,6CAA4C;AAC5C,2CAA0C;AAC1C,4DAAmD;AACnD,4EAAkE;AAClE,sEAA4D;AAC5D,4EAAkE;AAClE,sEAA4D;AAC5D,oFAAsE;AACtE,uCAGkB;AAClB,uCAA8C;AAE9C,yDAK+B;AAE/B,MAAM,gBAAgB,GAAqB;IACvC,KAAK,EAAE,2BAA2B;IAClC,KAAK,EAAE,CAAC;CACX,CAAC;AAOK,MAAM,gBAAgB,GACzB,CAAC,IAA6B,EAAuB,EAAE,CACvD,CAAC,IAAI,EAAE,IAAI,EAAE,MAAM,EAAE,WAAW,EAAY,EAAE;IAC1C,OAAO,IAAI,gBAAgB,CAAC,IAAI,EAAE,IAAI,EAAE,MAAM,EAAE,WAAW,EAAE,IAAI,CAAC,CAAC;AACvE,CAAC,CAAC;AAJO,QAAA,gBAAgB,oBAIvB;AAEN,MAAM,gBAAgB;IAClB,GAAG,CAAc;IACjB,UAAU,CAAc;IAEhB,KAAK,CAAO;IACH,KAAK,CAAa;IAClB,OAAO,CAAS;IAChB,SAAS,CAAC;IACV,OAAO,CAAkB;IACzB,WAAW,CAAU;IAE9B,eAAe,GAAkB,IAAI,CAAC;IACtC,kBAAkB,GAAkB,IAAI,CAAC;IACzC,SAAS,CAOf;IACM,WAAW,CAA4B;IAE/C,YACI,IAAU,EACV,IAAgB,EAChB,MAAc,EACd,WAAkC,EAClC,IAA6B;QAE7B,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC;QAClB,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC;QAClB,IAAI,CAAC,OAAO,GAAG,MAAM,CAAC;QAEtB,IAAI,CAAC,OAAO,GAAG,IAAA,0BAAkB,EAAC,IAAI,CAAC,KAAK,CAAC,CAAC,MAAM,CAAC;YACjD,IAAI,EAAE,WAAW;SACpB,CAAC,CAAC;QACH,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC,UAAU,CAAC;QAEnC,IAAI,CAAC,GAAG,GAAG,QAAQ,CAAC,aAAa,CAAC,IAAI,CAAC,CAAC;QACxC,IAAI,CAAC,UAAU,EAAE,CAAC;QAElB,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC,GAAG,CAAC;QAE3B,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC;QACtB,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC;QACxB,IAAI,CAAC,SAAS,GAAG,IAAA,yCAAyB,EAAC,IAAI,CAAC,KAAK,CAAC,CAAC,UAAU,CAC7D,qBAAqB,EACrB,GAAG,EAAE;YACD,IAAI,CAAC,IAAI,CAAC,SAAS;gBAAE,OAAO,IAAI,CAAC;YAEjC,MAAM,EAAC,cAAc,EAAE,iBAAiB,EAAE,QAAQ,EAAE,WAAW,EAAC,GAAG,IAAI,CAAC,SAAS,CAAC;YAElF,OAAO,CACH,wBAAC,mCAAmB,eACf,cAAc,IAAI,CACf,uBAAC,yCAAmB,IAChB,IAAI,EAAC,KAAK,EACV,aAAa,EAAE,IAAI,CAAC,GAAG,EACvB,UAAU,EAAE,IAAI,CAAC,WAAW,EAAE,GAAG,EACjC,QAAQ,EAAE,QAAQ,CAAC,SAAS,GAAG,CAAC,EAChC,gBAAgB,EAAE,IAAI,CAAC,uBAAuB,EAC9C,iBAAiB,EAAE,IAAI,CAAC,qBAAqB,EAC7C,mBAAmB,EAAE,IAAI,CAAC,uBAAuB,EACjD,kBAAkB,EAAE,IAAI,CAAC,sBAAsB,EAC/C,kBAAkB,EAAE,IAAI,CAAC,sBAAsB,EAC/C,kBAAkB,EAAE,IAAI,CAAC,mBAAmB,GAC9C,CACL,EACA,iBAAiB,IAAI,CAClB,uBAAC,yCAAmB,IAChB,IAAI,EAAC,QAAQ,EACb,aAAa,EAAE,IAAI,CAAC,GAAG,EACvB,UAAU,EAAE,IAAI,CAAC,WAAW,EAAE,MAAM,EACpC,QAAQ,EAAE,WAAW,CAAC,YAAY,GAAG,CAAC,EACtC,gBAAgB,EAAE,IAAI,CAAC,0BAA0B,EACjD,iBAAiB,EAAE,IAAI,CAAC,wBAAwB,EAChD,mBAAmB,EAAE,IAAI,CAAC,0BAA0B,EACpD,kBAAkB,EAAE,IAAI,CAAC,yBAAyB,EAClD,kBAAkB,EAAE,IAAI,CAAC,yBAAyB,EAClD,kBAAkB,EAAE,IAAI,CAAC,mBAAmB,GAC9C,CACL,IACiB,CACzB,CAAC;QACN,CAAC,CACJ,CAAC;QAEF,IAAI,CAAC,MAAM,CAAC,IAAI,EAAE,WAAW,CAAC,CAAC;IACnC,CAAC;IAED,MAAM,CAAC,IAAU,EAAE,WAAkC;QACjD,CAAC;YACG,MAAM,IAAI,GAAG,IAAI,CAAC,KAAK,CAAC;YACxB,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC;YAClB,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,CAAC;QAC1B,CAAC;QAED,MAAM,QAAQ,GAAG,IAAI,CAAC,YAAY,EAAE,CAAC;QAErC,IAAI,QAAQ,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,GAAG,KAAK,CAAC,IAAI,QAAQ,CAAC,IAAI,CAAC,MAAM,KAAK,CAAC,CAAC,EAAE,CAAC;YACtE,MAAM,IAAI,GAAG,CAAC,IAAI,CAAC,SAAS,GAAG;gBAC3B,QAAQ,EAAE,QAAQ,CAAC,IAAI,CAAC,GAAG;gBAC3B,WAAW,EAAE,QAAQ,CAAC,IAAI,CAAC,MAAM;gBACjC,cAAc,EAAE,KAAgB;gBAChC,iBAAiB,EAAE,KAAgB;gBACnC,QAAQ,EAAE,QAAQ,CAAC,SAAS,CAAC,IAAI,CAAC,mBAAmB,CAAC,QAAQ,CAAC,IAAI,CAAC,GAAG,CAAC;gBACxE,WAAW,EAAE,QAAQ,CAAC,SAAS,CAAC,IAAI,CAAC,yBAAyB,CAC1D,QAAQ,CAAC,IAAI,CAAC,MAAM,CACvB;aACJ,CAAC,CAAC;YAEH,KAAK,MAAM,IAAI,IAAI,WAAW,EAAE,CAAC;gBAC7B,MAAM,IAAI,GAAG,IAAI,CAAC,IAAI,CAAC,iCAAW,CAAC,CAAC;gBAEpC,IAAI,CAAC,cAAc,KAAK,IAAI,KAAK,8BAAQ,CAAC,cAAc,CAAC;gBACzD,IAAI,CAAC,cAAc,KAAK,IAAI,KAAK,8BAAQ,CAAC,WAAW,CAAC;gBAEtD,IAAI,CAAC,iBAAiB,KAAK,IAAI,KAAK,8BAAQ,CAAC,iBAAiB,CAAC;gBAC/D,IAAI,CAAC,iBAAiB,KAAK,IAAI,KAAK,8BAAQ,CAAC,cAAc,CAAC;YAChE,CAAC;YAED,IAAI,IAAI,CAAC,WAAW,IAAI,CAAC,IAAI,CAAC,WAAW;gBACrC,IAAI,CAAC,WAAW,GAAG,IAAI,wBAAkB,CAAC,IAAI,CAAC,KAAK,EAAE;oBAClD,QAAQ,EAAE,IAAI;oBACd,UAAU,EAAE,IAAI,CAAC,OAAO;oBACxB,MAAM,EAAE,IAAI,CAAC,OAAO;oBACpB,UAAU,EAAE,gBAAgB;iBAC/B,CAAC,CAAC;YACP,IAAI,CAAC,WAAW,EAAE,MAAM,CAAC,IAAI,CAAC,CAAC;QACnC,CAAC;aAAM,CAAC;YACJ,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC;YACtB,IAAI,CAAC,WAAW,EAAE,OAAO,EAAE,CAAC;YAC5B,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC;QAC5B,CAAC;QAED,IAAI,CAAC,SAAS,CAAC,QAAQ,EAAE,CAAC;QAE1B,OAAO,IAAI,CAAC;IAChB,CAAC;IAED,OAAO;QACH,IAAI,CAAC,WAAW,EAAE,OAAO,EAAE,CAAC;QAC5B,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC;QACxB,IAAI,CAAC,SAAS,CAAC,MAAM,EAAE,CAAC;QAExB,IAAI,CAAC,uBAAuB,CAAC,KAAK,CAAC,CAAC;QACpC,IAAI,CAAC,0BAA0B,CAAC,KAAK,CAAC,CAAC;IAC3C,CAAC;IAEO,UAAU,CAAC,IAAW;QAC1B,IAAI,IAAI,EAAE,KAAK,CAAC,oBAAY,CAAC,SAAS,CAAC,EAAE,CAAC;YACtC,IAAI,CAAC,GAAG,CAAC,SAAS,CAAC,MAAM,CAAC,IAAI,CAAC,KAAK,CAAC,oBAAY,CAAC,SAAS,CAAC,CAAC,CAAC;QAClE,CAAC;QAED,IAAI,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,oBAAY,CAAC,OAAO,CAAC;YACtC,IAAI,CAAC,GAAG,CAAC,YAAY,CAAC,SAAS,EAAE,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,oBAAY,CAAC,OAAO,CAAC,CAAC,CAAC;;YACxE,IAAI,CAAC,GAAG,CAAC,eAAe,CAAC,SAAS,CAAC,CAAC;QAEzC,IAAI,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,oBAAY,CAAC,OAAO,CAAC;YACtC,IAAI,CAAC,GAAG,CAAC,YAAY,CAAC,SAAS,EAAE,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,oBAAY,CAAC,OAAO,CAAC,CAAC,CAAC;;YACxE,IAAI,CAAC,GAAG,CAAC,eAAe,CAAC,SAAS,CAAC,CAAC;QAEzC,IAAI,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,oBAAY,CAAC,SAAS,CAAC,EAAE,CAAC;YAC3C,IAAI,CAAC,GAAG,CAAC,SAAS,CAAC,GAAG,CAAC,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,oBAAY,CAAC,SAAS,CAAC,CAAC,CAAC;YACjE,IAAI,CAAC,GAAG,CAAC,YAAY,CAAC,oBAAY,CAAC,SAAS,EAAE,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,oBAAY,CAAC,OAAO,CAAC,CAAC,CAAC;QAC1F,CAAC;aAAM,CAAC;YACJ,IAAI,CAAC,GAAG,CAAC,eAAe,CAAC,oBAAY,CAAC,SAAS,CAAC,CAAC;QACrD,CAAC;IACL,CAAC;IAEO,uBAAuB,GAAG,CAAC,IAAa,EAAE,EAAE;QAChD,IAAI,IAAI,KAAK,KAAK,EAAE,CAAC;YACjB,IAAI,IAAI,CAAC,eAAe,EAAE,CAAC;gBACvB,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC,IAAA,0BAAa,EAAC,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,EAAE,EAAE,IAAI,CAAC,eAAe,CAAC,CAAC,CAAC;gBAC9E,IAAI,CAAC,eAAe,GAAG,IAAI,CAAC;YAChC,CAAC;YACD,OAAO;QACX,CAAC;QAED,IAAI,CAAC,OAAO,CAAC,KAAK,CAAC,EAAC,KAAK,EAAE,eAAe,EAAC,CAAC,CAAC;QAE7C,MAAM,IAAI,GAAG,IAAI,CAAC,YAAY,EAAE,CAAC;QACjC,IAAI,CAAC,IAAI;YAAE,OAAO;QAElB,IAAI,CAAC,eAAe,GAAG,IAAI,CAAC,GAAG,EAAE,CAAC;QAClC,MAAM,QAAQ,GAAG,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,mBAAmB,CAAC,IAAI,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;QACxE,MAAM,EAAE,GAAG,IAAA,yBAAY,EAAC,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,EAAE,EAAE;YACzC,WAAW,EAAE,EAAC,IAAI,EAAE,IAAI,CAAC,GAAG,EAAE,EAAE,EAAE,IAAI,CAAC,GAAG,GAAG,IAAI,CAAC,KAAK,CAAC,QAAQ,EAAC;YACjE,IAAI,EAAE,IAAA,cAAO,EAAC,QAAQ,CAAC,QAAQ,EAAE,QAAQ,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,MAAM,EAAE,EAAE,CACjE,IAAI,CAAC,SAAS,CAAC,YAAY,CAAC,MAAM,CAAC,CACtC;YACD,OAAO,EAAE,IAAI,CAAC,eAAe;SAChC,CAAC,CAAC;QACH,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC;IAC5B,CAAC,CAAC;IAEM,0BAA0B,GAAG,CAAC,IAAa,EAAE,EAAE;QACnD,IAAI,IAAI,KAAK,KAAK,EAAE,CAAC;YACjB,IAAI,IAAI,CAAC,kBAAkB,EAAE,CAAC;gBAC1B,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC,IAAA,6BAAgB,EAAC,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,EAAE,EAAE,IAAI,CAAC,kBAAkB,CAAC,CAAC,CAAC;gBACpF,IAAI,CAAC,kBAAkB,GAAG,IAAI,CAAC;YACnC,CAAC;YACD,OAAO;QACX,CAAC;QAED,IAAI,CAAC,OAAO,CAAC,KAAK,CAAC,EAAC,KAAK,EAAE,kBAAkB,EAAC,CAAC,CAAC;QAEhD,MAAM,IAAI,GAAG,IAAI,CAAC,YAAY,EAAE,CAAC;QACjC,IAAI,CAAC,IAAI;YAAE,OAAO;QAElB,IAAI,CAAC,kBAAkB,GAAG,IAAI,CAAC,GAAG,EAAE,CAAC;QACrC,MAAM,eAAe,GAAG,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,yBAAyB,CAAC,IAAI,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;QACxF,MAAM,KAAK,GAAc,EAAE,CAAC;QAC5B,KAAK,MAAM,CAAC,IAAI,IAAA,cAAO,EAAC,eAAe,CAAC,QAAQ,EAAE,eAAe,CAAC,MAAM,GAAG,CAAC,CAAC,EAAE,CAAC;YAC5E,KAAK,CAAC,IAAI,CAAC,GAAG,IAAI,CAAC,SAAS,CAAC,eAAe,CAAC,CAAC,CAAC,CAAC,CAAC;QACrD,CAAC;QACD,MAAM,EAAE,GAAG,IAAA,4BAAe,EAAC,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,EAAE,EAAE;YAC5C,WAAW,EAAE,EAAC,IAAI,EAAE,IAAI,CAAC,GAAG,EAAE,EAAE,EAAE,IAAI,CAAC,GAAG,GAAG,IAAI,CAAC,KAAK,CAAC,QAAQ,EAAC;YACjE,KAAK,EAAE,KAAK,CAAC,MAAM,CAAC,CAAC,GAAG,EAAE,EAAE,CAAC,GAAG,CAAC,IAAI,KAAK,MAAM,CAAC;YACjD,OAAO,EAAE,IAAI,CAAC,kBAAkB;SACnC,CAAC,CAAC;QACH,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC;IAC5B,CAAC,CAAC;IAEM,qBAAqB,GAAG,GAAG,EAAE;QACjC,IAAI,CAAC,OAAO,CAAC,KAAK,CAAC,EAAC,KAAK,EAAE,iBAAiB,EAAE,MAAM,EAAE,UAAU,EAAC,CAAC,CAAC;QAEnE,MAAM,IAAI,GAAG,IAAI,CAAC,YAAY,EAAE,CAAC;QACjC,IAAI,IAAI,EAAE,CAAC;YACP,MAAM,QAAQ,GAAG,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,mBAAmB,CAAC,IAAI,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;YACxE,IAAA,wBAAU,EAAC;gBACP,QAAQ,EAAE,IAAI,CAAC,KAAK,CAAC,GAAG;gBACxB,IAAI,EAAE,IAAA,cAAO,EAAC,QAAQ,CAAC,QAAQ,EAAE,QAAQ,CAAC,MAAM,GAAG,CAAC,CAAC;aACxD,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC;QAC9C,CAAC;QAED,IAAI,CAAC,KAAK,CAAC,KAAK,EAAE,CAAC;IACvB,CAAC,CAAC;IAEM,wBAAwB,GAAG,GAAG,EAAE;QACpC,IAAI,CAAC,OAAO,CAAC,KAAK,CAAC,EAAC,KAAK,EAAE,oBAAoB,EAAE,MAAM,EAAE,aAAa,EAAC,CAAC,CAAC;QAEzE,MAAM,IAAI,GAAG,IAAI,CAAC,YAAY,EAAE,CAAC;QACjC,IAAI,IAAI,EAAE,CAAC;YACP,MAAM,QAAQ,GAAG,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,yBAAyB,CAAC,IAAI,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;YACjF,IAAA,wBAAU,EAAC;gBACP,QAAQ,EAAE,IAAI,CAAC,KAAK,CAAC,GAAG;gBACxB,IAAI,EAAE,IAAA,cAAO,EAAC,QAAQ,CAAC,QAAQ,EAAE,QAAQ,CAAC,MAAM,GAAG,CAAC,CAAC;aACxD,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC;QAC9C,CAAC;QAED,IAAI,CAAC,KAAK,CAAC,KAAK,EAAE,CAAC;IACvB,CAAC,CAAC;IAEM,uBAAuB,GAAG,GAAG,EAAE;QACnC,IAAI,CAAC,OAAO,CAAC,KAAK,CAAC,EAAC,KAAK,EAAE,mBAAmB,EAAE,MAAM,EAAE,UAAU,EAAC,CAAC,CAAC;QAErE,MAAM,IAAI,GAAG,IAAI,CAAC,YAAY,EAAE,CAAC;QACjC,IAAI,IAAI,EAAE,CAAC;YACP,MAAM,QAAQ,GAAG,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,mBAAmB,CAAC,IAAI,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;YACxE,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,SAAS,EAAE,QAAQ,CAAC,QAAQ,CAAC,CAAC;QACvD,CAAC;QAED,IAAI,CAAC,KAAK,CAAC,KAAK,EAAE,CAAC;IACvB,CAAC,CAAC;IAEM,sBAAsB,GAAG,GAAG,EAAE;QAClC,IAAI,CAAC,OAAO,CAAC,KAAK,CAAC,EAAC,KAAK,EAAE,kBAAkB,EAAE,MAAM,EAAE,aAAa,EAAC,CAAC,CAAC;QAEvE,MAAM,IAAI,GAAG,IAAI,CAAC,YAAY,EAAE,CAAC;QACjC,IAAI,IAAI,EAAE,CAAC;YACP,MAAM,QAAQ,GAAG,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,mBAAmB,CAAC,IAAI,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;YACxE,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,SAAS,EAAE,QAAQ,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC;QACzD,CAAC;QAED,IAAI,CAAC,KAAK,CAAC,KAAK,EAAE,CAAC;IACvB,CAAC,CAAC;IAEM,UAAU,CAAC,SAA0B,EAAE,QAAgB;QAC3D,IAAA,iCAAc,EAAC,EAAC,QAAQ,EAAE,SAAS,CAAC,GAAG,EAAE,QAAQ,EAAC,CAAC,CAC/C,IAAI,CAAC,KAAK,CAAC,KAAK,EAChB,IAAI,CAAC,KAAK,CAAC,QAAQ,EACnB,IAAI,CAAC,KAAK,CACb,CAAC;IACN,CAAC;IAEO,0BAA0B,GAAG,GAAG,EAAE;QACtC,IAAI,CAAC,OAAO,CAAC,KAAK,CAAC,EAAC,KAAK,EAAE,sBAAsB,EAAE,MAAM,EAAE,aAAa,EAAC,CAAC,CAAC;QAE3E,MAAM,IAAI,GAAG,IAAI,CAAC,YAAY,EAAE,CAAC;QACjC,IAAI,IAAI,EAAE,CAAC;YACP,MAAM,QAAQ,GAAG,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,yBAAyB,CAAC,IAAI,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;YACjF,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,SAAS,EAAE,QAAQ,CAAC,QAAQ,CAAC,CAAC;QAC1D,CAAC;QAED,IAAI,CAAC,KAAK,CAAC,KAAK,EAAE,CAAC;IACvB,CAAC,CAAC;IAEM,yBAAyB,GAAG,GAAG,EAAE;QACrC,IAAI,CAAC,OAAO,CAAC,KAAK,CAAC,EAAC,KAAK,EAAE,qBAAqB,EAAE,MAAM,EAAE,aAAa,EAAC,CAAC,CAAC;QAE1E,MAAM,IAAI,GAAG,IAAI,CAAC,YAAY,EAAE,CAAC;QACjC,IAAI,IAAI,EAAE,CAAC;YACP,MAAM,QAAQ,GAAG,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,yBAAyB,CAAC,IAAI,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;YACjF,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,SAAS,EAAE,QAAQ,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC;QAC5D,CAAC;QAED,IAAI,CAAC,KAAK,CAAC,KAAK,EAAE,CAAC;IACvB,CAAC,CAAC;IAEM,aAAa,CAAC,SAA0B,EAAE,QAAgB;QAC9D,IAAA,uCAAiB,EAAC,EAAC,QAAQ,EAAE,SAAS,CAAC,GAAG,EAAE,QAAQ,EAAC,CAAC,CAClD,IAAI,CAAC,KAAK,CAAC,KAAK,EAChB,IAAI,CAAC,KAAK,CAAC,QAAQ,EACnB,IAAI,CAAC,KAAK,CACb,CAAC;IACN,CAAC;IAEO,sBAAsB,GAAG,GAAG,EAAE;QAClC,IAAI,CAAC,OAAO,CAAC,KAAK,CAAC,EAAC,KAAK,EAAE,YAAY,EAAE,MAAM,EAAE,UAAU,EAAC,CAAC,CAAC;QAE9D,MAAM,IAAI,GAAG,IAAI,CAAC,YAAY,EAAE,CAAC;QACjC,IAAI,IAAI,EAAE,CAAC;YACP,MAAM,QAAQ,GAAG,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,sBAAsB,CAAC,IAAI,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;YAC3E,IAAA,iCAAc,EAAC,EAAC,QAAQ,EAAE,IAAI,CAAC,SAAS,CAAC,GAAG,EAAE,QAAQ,EAAC,CAAC,CACpD,IAAI,CAAC,KAAK,CAAC,KAAK,EAChB,IAAI,CAAC,KAAK,CAAC,QAAQ,EACnB,IAAI,CAAC,KAAK,CACb,CAAC;QACN,CAAC;QAED,IAAI,CAAC,KAAK,CAAC,KAAK,EAAE,CAAC;IACvB,CAAC,CAAC;IAEM,yBAAyB,GAAG,GAAG,EAAE;QACrC,IAAI,CAAC,OAAO,CAAC,KAAK,CAAC,EAAC,KAAK,EAAE,eAAe,EAAE,MAAM,EAAE,aAAa,EAAC,CAAC,CAAC;QAEpE,MAAM,IAAI,GAAG,IAAI,CAAC,YAAY,EAAE,CAAC;QACjC,IAAI,IAAI,EAAE,CAAC;YACP,MAAM,QAAQ,GAAG,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,4BAA4B,CAAC,IAAI,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;YACpF,IAAA,uCAAiB,EAAC,EAAC,QAAQ,EAAE,IAAI,CAAC,SAAS,CAAC,GAAG,EAAE,QAAQ,EAAC,CAAC,CACvD,IAAI,CAAC,KAAK,CAAC,KAAK,EAChB,IAAI,CAAC,KAAK,CAAC,QAAQ,EACnB,IAAI,CAAC,KAAK,CACb,CAAC;QACN,CAAC;QAED,IAAI,CAAC,KAAK,CAAC,KAAK,EAAE,CAAC;IACvB,CAAC,CAAC;IAEM,mBAAmB,GAAG,GAAG,EAAE;QAC/B,IAAI,CAAC,OAAO,CAAC,KAAK,CAAC,EAAC,KAAK,EAAE,cAAc,EAAC,CAAC,CAAC;QAE5C,MAAM,IAAI,GAAG,IAAI,CAAC,YAAY,EAAE,CAAC;QACjC,IAAI,IAAI,EAAE,CAAC;YACP,IAAA,wBAAc,EAAC,IAAI,CAAC,KAAK,CAAC,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,QAAQ,EAAE,IAAI,CAAC,KAAK,EAAE;gBAC9D,QAAQ,EAAE,IAAI,CAAC,KAAK,CAAC,GAAG;gBACxB,SAAS,EAAE,IAAI,CAAC,KAAK,CAAC,IAAI;aAC7B,CAAC,CAAC;QACP,CAAC;QAED,IAAI,CAAC,KAAK,CAAC,KAAK,EAAE,CAAC;IACvB,CAAC,CAAC;IAEM,YAAY;QAChB,MAAM,KAAK,GAAG,IAAI,CAAC,eAAe,EAAE,CAAC;QACrC,MAAM,SAAS,GAAG,KAAK,CAAC,CAAC,CAAC,sBAAS,CAAC,MAAM,CAAC,KAAK,CAAC,IAAI,CAAC,EAAE,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC;QACpF,MAAM,QAAQ,GAAG,SAAS,EAAE,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;QACzD,OAAO,QAAQ;YACX,CAAC,CAAC,EAAC,GAAG,EAAE,IAAI,CAAC,OAAO,EAAG,EAAE,KAAK,EAAE,KAAM,EAAE,SAAS,EAAE,SAAU,EAAE,IAAI,EAAE,QAAQ,EAAC;YAC9E,CAAC,CAAC,SAAS,CAAC;IACpB,CAAC;IAEO,eAAe,GAAG,GAAG,EAAE;QAC3B,MAAM,GAAG,GAAG,IAAI,CAAC,OAAO,EAAE,CAAC;QAC3B,OAAO,GAAG,KAAK,SAAS;YACpB,CAAC,CAAC,IAAA,kCAA0B,EAAC,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC,OAAO,CAAC,GAAG,CAAC,EAAE,yBAAW,CAAC;YAC5E,CAAC,CAAC,SAAS,CAAC;IACpB,CAAC,CAAC;CACL","sourcesContent":["import {getLoggerFromState} from '#core';\nimport type {Node} from '#pm/model';\nimport {findParentNodeClosestToPos} from '#pm/utils';\nimport type {Decoration, EditorView, NodeView, NodeViewConstructor} from '#pm/view';\nimport {getReactRendererFromState} from 'src/extensions/behavior/ReactRenderer';\nimport {range as iterate} from 'src/lodash';\nimport type {Logger2} from 'src/logger';\nimport {ErrorLoggerBoundary} from 'src/react-utils/ErrorBoundary';\nimport {isTableNode} from 'src/table-utils';\nimport {\n    type CellPos,\n    type TableColumnRange,\n    TableDesc,\n    type TableDescBinded,\n    type TableRowRange,\n} from 'src/table-utils/table-desc';\n\nimport {YfmTableAttr} from '../../../const';\nimport {removeYfmTable} from '../actions';\nimport {clearCells} from '../commands/clear-cells';\nimport {insertEmptyColumn} from '../commands/insert-empty-column';\nimport {insertEmptyRow} from '../commands/insert-empty-row';\nimport {removeColumnRange} from '../commands/remove-column-range';\nimport {removeRowRange} from '../commands/remove-row-range';\nimport {FloatingMenuControl} from '../components/FloatingMenuControl';\nimport {\n    YfmTableDecorationType as DecoType,\n    YfmTableDecorationTypeKey as decoTypeKey,\n} from '../const';\nimport {YfmTableDnDHandler} from '../dnd/dnd';\nimport type {DropCursorParams} from '../dnd/dnd-drop-cursor';\nimport {\n    activateColumns,\n    activateRows,\n    deactivateColumn,\n    deactivateRow,\n} from '../plugins/dnd-plugin';\n\nconst dropCursorParams: DropCursorParams = {\n    color: 'var(--g-color-line-brand)',\n    width: 2,\n};\n\ntype GetPos = () => number | undefined;\ntype YfmTableCellViewOptions = {\n    dndEnabled: boolean;\n};\n\nexport const yfmTableCellView =\n    (opts: YfmTableCellViewOptions): NodeViewConstructor =>\n    (node, view, getPos, decorations): NodeView => {\n        return new YfmTableCellView(node, view, getPos, decorations, opts);\n    };\n\nclass YfmTableCellView implements NodeView {\n    dom: HTMLElement;\n    contentDOM: HTMLElement;\n\n    private _node: Node;\n    private readonly _view: EditorView;\n    private readonly _getPos: GetPos;\n    private readonly _renderer;\n    private readonly _logger: Logger2.ILogger;\n    private readonly _dndEnabled: boolean;\n\n    private _decoRowUniqKey: number | null = null;\n    private _decoColumnUniqKey: number | null = null;\n    private _cellInfo: null | {\n        rowIndex: number;\n        columnIndex: number;\n        rowRange: Readonly<TableRowRange>;\n        columnRange: Readonly<TableColumnRange>;\n        showRowControl: boolean;\n        showColumnControl: boolean;\n    };\n    private _dndHandler: YfmTableDnDHandler | null;\n\n    constructor(\n        node: Node,\n        view: EditorView,\n        getPos: GetPos,\n        decorations: readonly Decoration[],\n        opts: YfmTableCellViewOptions,\n    ) {\n        this._node = node;\n        this._view = view;\n        this._getPos = getPos;\n\n        this._logger = getLoggerFromState(view.state).nested({\n            node: 'yfm-table',\n        });\n        this._dndEnabled = opts.dndEnabled;\n\n        this.dom = document.createElement('td');\n        this._updateDom();\n\n        this.contentDOM = this.dom;\n\n        this._cellInfo = null;\n        this._dndHandler = null;\n        this._renderer = getReactRendererFromState(view.state).createItem(\n            'yfm-table-cell-view',\n            () => {\n                if (!this._cellInfo) return null;\n\n                const {showRowControl, showColumnControl, rowRange, columnRange} = this._cellInfo;\n\n                return (\n                    <ErrorLoggerBoundary>\n                        {showRowControl && (\n                            <FloatingMenuControl\n                                type=\"row\"\n                                acnhorElement={this.dom}\n                                dndHandler={this._dndHandler?.row}\n                                multiple={rowRange.rowsCount > 1}\n                                onMenuOpenToggle={this._onRowControlOpenToggle}\n                                onClearCellsClick={this._onRowClearCellsClick}\n                                onInsertBeforeClick={this._onRowInsertBeforeClick}\n                                onInsertAfterClick={this._onRowInsertAfterClick}\n                                onRemoveRangeClick={this._onRowRemoveRangeClick}\n                                onRemoveTableClick={this._onRemoveTableClick}\n                            />\n                        )}\n                        {showColumnControl && (\n                            <FloatingMenuControl\n                                type=\"column\"\n                                acnhorElement={this.dom}\n                                dndHandler={this._dndHandler?.column}\n                                multiple={columnRange.columnsCount > 1}\n                                onMenuOpenToggle={this._onColumnControlOpenToggle}\n                                onClearCellsClick={this._onColumnClearCellsClick}\n                                onInsertBeforeClick={this._onColumnInsertBeforeClick}\n                                onInsertAfterClick={this._onColumnInsertAfterClick}\n                                onRemoveRangeClick={this._onColumnRemoveRangeClick}\n                                onRemoveTableClick={this._onRemoveTableClick}\n                            />\n                        )}\n                    </ErrorLoggerBoundary>\n                );\n            },\n        );\n\n        this.update(node, decorations);\n    }\n\n    update(node: Node, decorations: readonly Decoration[]): boolean {\n        {\n            const prev = this._node;\n            this._node = node;\n            this._updateDom(prev);\n        }\n\n        const cellInfo = this._getCellInfo();\n\n        if (cellInfo && (cellInfo.cell.row === 0 || cellInfo.cell.column === 0)) {\n            const info = (this._cellInfo = {\n                rowIndex: cellInfo.cell.row,\n                columnIndex: cellInfo.cell.column,\n                showRowControl: false as boolean,\n                showColumnControl: false as boolean,\n                rowRange: cellInfo.tableDesc.base.getRowRangeByRowIdx(cellInfo.cell.row),\n                columnRange: cellInfo.tableDesc.base.getColumnRangeByColumnIdx(\n                    cellInfo.cell.column,\n                ),\n            });\n\n            for (const deco of decorations) {\n                const type = deco.spec[decoTypeKey];\n\n                info.showRowControl ||= type === DecoType.ShowRowControl;\n                info.showRowControl ||= type === DecoType.OpenRowMenu;\n\n                info.showColumnControl ||= type === DecoType.ShowColumnControl;\n                info.showColumnControl ||= type === DecoType.OpenColumnMenu;\n            }\n\n            if (this._dndEnabled && !this._dndHandler)\n                this._dndHandler = new YfmTableDnDHandler(this._view, {\n                    cellNode: node,\n                    cellGetPos: this._getPos,\n                    logger: this._logger,\n                    dropCursor: dropCursorParams,\n                });\n            this._dndHandler?.update(node);\n        } else {\n            this._cellInfo = null;\n            this._dndHandler?.destroy();\n            this._dndHandler = null;\n        }\n\n        this._renderer.rerender();\n\n        return true;\n    }\n\n    destroy() {\n        this._dndHandler?.destroy();\n        this._dndHandler = null;\n        this._renderer.remove();\n\n        this._onRowControlOpenToggle(false);\n        this._onColumnControlOpenToggle(false);\n    }\n\n    private _updateDom(prev?: Node) {\n        if (prev?.attrs[YfmTableAttr.CellAlign]) {\n            this.dom.classList.remove(prev.attrs[YfmTableAttr.CellAlign]);\n        }\n\n        if (this._node.attrs[YfmTableAttr.Colspan])\n            this.dom.setAttribute('colspan', this._node.attrs[YfmTableAttr.Colspan]);\n        else this.dom.removeAttribute('colspan');\n\n        if (this._node.attrs[YfmTableAttr.Rowspan])\n            this.dom.setAttribute('rowspan', this._node.attrs[YfmTableAttr.Rowspan]);\n        else this.dom.removeAttribute('rowspan');\n\n        if (this._node.attrs[YfmTableAttr.CellAlign]) {\n            this.dom.classList.add(this._node.attrs[YfmTableAttr.CellAlign]);\n            this.dom.setAttribute(YfmTableAttr.CellAlign, this._node.attrs[YfmTableAttr.Rowspan]);\n        } else {\n            this.dom.removeAttribute(YfmTableAttr.CellAlign);\n        }\n    }\n\n    private _onRowControlOpenToggle = (open: boolean) => {\n        if (open === false) {\n            if (this._decoRowUniqKey) {\n                this._view.dispatch(deactivateRow(this._view.state.tr, this._decoRowUniqKey));\n                this._decoRowUniqKey = null;\n            }\n            return;\n        }\n\n        this._logger.event({event: 'open-row-menu'});\n\n        const info = this._getCellInfo();\n        if (!info) return;\n\n        this._decoRowUniqKey = Date.now();\n        const rowRange = info.tableDesc.base.getRowRangeByRowIdx(info.cell.row);\n        const tr = activateRows(this._view.state.tr, {\n            controlCell: {from: info.pos, to: info.pos + this._node.nodeSize},\n            rows: iterate(rowRange.startIdx, rowRange.endIdx + 1).map((rowIdx) =>\n                info.tableDesc.getPosForRow(rowIdx),\n            ),\n            uniqKey: this._decoRowUniqKey,\n        });\n        this._view.dispatch(tr);\n    };\n\n    private _onColumnControlOpenToggle = (open: boolean) => {\n        if (open === false) {\n            if (this._decoColumnUniqKey) {\n                this._view.dispatch(deactivateColumn(this._view.state.tr, this._decoColumnUniqKey));\n                this._decoColumnUniqKey = null;\n            }\n            return;\n        }\n\n        this._logger.event({event: 'open-column-menu'});\n\n        const info = this._getCellInfo();\n        if (!info) return;\n\n        this._decoColumnUniqKey = Date.now();\n        const currColumnRange = info.tableDesc.base.getColumnRangeByColumnIdx(info.cell.column);\n        const cells: CellPos[] = [];\n        for (const i of iterate(currColumnRange.startIdx, currColumnRange.endIdx + 1)) {\n            cells.push(...info.tableDesc.getPosForColumn(i));\n        }\n        const tr = activateColumns(this._view.state.tr, {\n            controlCell: {from: info.pos, to: info.pos + this._node.nodeSize},\n            cells: cells.filter((pos) => pos.type === 'real'),\n            uniqKey: this._decoColumnUniqKey,\n        });\n        this._view.dispatch(tr);\n    };\n\n    private _onRowClearCellsClick = () => {\n        this._logger.event({event: 'row-clear-cells', source: 'row-menu'});\n\n        const info = this._getCellInfo();\n        if (info) {\n            const rowRange = info.tableDesc.base.getRowRangeByRowIdx(info.cell.row);\n            clearCells({\n                tablePos: info.table.pos,\n                rows: iterate(rowRange.startIdx, rowRange.endIdx + 1),\n            })(this._view.state, this._view.dispatch);\n        }\n\n        this._view.focus();\n    };\n\n    private _onColumnClearCellsClick = () => {\n        this._logger.event({event: 'column-clear-cells', source: 'column-menu'});\n\n        const info = this._getCellInfo();\n        if (info) {\n            const colRange = info.tableDesc.base.getColumnRangeByColumnIdx(info.cell.column);\n            clearCells({\n                tablePos: info.table.pos,\n                cols: iterate(colRange.startIdx, colRange.endIdx + 1),\n            })(this._view.state, this._view.dispatch);\n        }\n\n        this._view.focus();\n    };\n\n    private _onRowInsertBeforeClick = () => {\n        this._logger.event({event: 'row-insert-before', source: 'row-menu'});\n\n        const info = this._getCellInfo();\n        if (info) {\n            const rowRange = info.tableDesc.base.getRowRangeByRowIdx(info.cell.row);\n            this._insertRow(info.tableDesc, rowRange.startIdx);\n        }\n\n        this._view.focus();\n    };\n\n    private _onRowInsertAfterClick = () => {\n        this._logger.event({event: 'row-insert-after', source: 'column-menu'});\n\n        const info = this._getCellInfo();\n        if (info) {\n            const rowRange = info.tableDesc.base.getRowRangeByRowIdx(info.cell.row);\n            this._insertRow(info.tableDesc, rowRange.endIdx + 1);\n        }\n\n        this._view.focus();\n    };\n\n    private _insertRow(tableDesc: TableDescBinded, rowIndex: number) {\n        insertEmptyRow({tablePos: tableDesc.pos, rowIndex})(\n            this._view.state,\n            this._view.dispatch,\n            this._view,\n        );\n    }\n\n    private _onColumnInsertBeforeClick = () => {\n        this._logger.event({event: 'column-insert-before', source: 'column-menu'});\n\n        const info = this._getCellInfo();\n        if (info) {\n            const colRange = info.tableDesc.base.getColumnRangeByColumnIdx(info.cell.column);\n            this._insertColumn(info.tableDesc, colRange.startIdx);\n        }\n\n        this._view.focus();\n    };\n\n    private _onColumnInsertAfterClick = () => {\n        this._logger.event({event: 'column-insert-after', source: 'column-menu'});\n\n        const info = this._getCellInfo();\n        if (info) {\n            const colRange = info.tableDesc.base.getColumnRangeByColumnIdx(info.cell.column);\n            this._insertColumn(info.tableDesc, colRange.endIdx + 1);\n        }\n\n        this._view.focus();\n    };\n\n    private _insertColumn(tableDesc: TableDescBinded, colIndex: number) {\n        insertEmptyColumn({tablePos: tableDesc.pos, colIndex})(\n            this._view.state,\n            this._view.dispatch,\n            this._view,\n        );\n    }\n\n    private _onRowRemoveRangeClick = () => {\n        this._logger.event({event: 'row-remove', source: 'row-menu'});\n\n        const info = this._getCellInfo();\n        if (info) {\n            const rangeIdx = info.tableDesc.base.getRowRangeIdxByRowIdx(info.cell.row);\n            removeRowRange({tablePos: info.tableDesc.pos, rangeIdx})(\n                this._view.state,\n                this._view.dispatch,\n                this._view,\n            );\n        }\n\n        this._view.focus();\n    };\n\n    private _onColumnRemoveRangeClick = () => {\n        this._logger.event({event: 'column-remove', source: 'column-menu'});\n\n        const info = this._getCellInfo();\n        if (info) {\n            const rangeIdx = info.tableDesc.base.getColumnRangeIdxByColumnIdx(info.cell.column);\n            removeColumnRange({tablePos: info.tableDesc.pos, rangeIdx})(\n                this._view.state,\n                this._view.dispatch,\n                this._view,\n            );\n        }\n\n        this._view.focus();\n    };\n\n    private _onRemoveTableClick = () => {\n        this._logger.event({event: 'table-remove'});\n\n        const info = this._getCellInfo();\n        if (info) {\n            removeYfmTable(this._view.state, this._view.dispatch, this._view, {\n                tablePos: info.table.pos,\n                tableNode: info.table.node,\n            });\n        }\n\n        this._view.focus();\n    };\n\n    private _getCellInfo() {\n        const table = this._getParentTable();\n        const tableDesc = table ? TableDesc.create(table.node)?.bind(table.pos) : undefined;\n        const cellInfo = tableDesc?.base.getCellInfo(this._node);\n        return cellInfo\n            ? {pos: this._getPos()!, table: table!, tableDesc: tableDesc!, cell: cellInfo}\n            : undefined;\n    }\n\n    private _getParentTable = () => {\n        const pos = this._getPos();\n        return pos !== undefined\n            ? findParentNodeClosestToPos(this._view.state.doc.resolve(pos), isTableNode)\n            : undefined;\n    };\n}\n"]}

package/build/cjs/extensions/yfm/YfmTable/plugins/YfmTableControls/nodeviews/yfm-table-view.css

@@ -0,0 +1,4 @@
+.yfm table.g-md-yfm-table-view {
+  --yfm-color-border: var(--g-color-line-generic);
+  background: var(--g-color-base-background);
+}

package/build/cjs/extensions/yfm/YfmTable/plugins/YfmTableControls/nodeviews/yfm-table-view.d.ts

@@ -0,0 +1,3 @@
+import type { NodeViewConstructor } from "../../../../../../pm/view.js";
+import "./yfm-table-view.css";
+export declare const yfmTableView: NodeViewConstructor;

package/build/cjs/extensions/yfm/YfmTable/plugins/YfmTableControls/nodeviews/yfm-table-view.js

@@ -0,0 +1,100 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.yfmTableView = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const _core_1 = require("../../../../../../core/index.js");
+const ReactRenderer_1 = require("../../../../../behavior/ReactRenderer/index.js");
+const lodash_1 = require("../../../../../../lodash.js");
+const react_utils_1 = require("../../../../../../react-utils/index.js");
+const table_desc_1 = require("../../../../../../table-utils/table-desc.js");
+const insert_empty_column_1 = require("../commands/insert-empty-column.js");
+const insert_empty_row_1 = require("../commands/insert-empty-row.js");
+const FloatingPlusControl_1 = require("../components/FloatingPlusControl/index.js");
+const const_1 = require("../const.js");
+require("./yfm-table-view.css");
+const yfmTableView = (node, view, getPos, decorations) => {
+    return new YfmTableNewView(node, view, getPos, decorations);
+};
+exports.yfmTableView = yfmTableView;
+class YfmTableNewView {
+    dom;
+    contentDOM;
+    _node;
+    _view;
+    _getPos;
+    _renderer;
+    _logger;
+    _isFocused = false;
+    constructor(node, view, getPos, decorations) {
+        this._node = node;
+        this._view = view;
+        this._getPos = getPos;
+        this._logger = (0, _core_1.getLoggerFromState)(view.state).nested({
+            node: 'yfm-table',
+        });
+        this.dom = this.contentDOM = view.dom.ownerDocument.createElement('table');
+        this.dom.classList.add('g-md-yfm-table-view');
+        this._updateFocusedState(decorations);
+        this._renderer = (0, ReactRenderer_1.getReactRendererFromState)(view.state).createItem('yfm-table-view', () => {
+            if (!this._isFocused)
+                return null;
+            const tableDesc = this._getTableDesc();
+            if (!tableDesc)
+                return null;
+            const tableElem = this._view.domAtPos(tableDesc.pos + 1).node;
+            const children = [];
+            for (let rowIdx = 0; rowIdx < tableDesc.rows; rowIdx++) {
+                const colIdx = tableDesc.base.rowsDesc[rowIdx].cells.findIndex((cell) => cell.type === 'real');
+                if (colIdx >= 0) {
+                    const cellPos = tableDesc.getPosForCell(rowIdx, colIdx);
+                    const cellElem = this._view.domAtPos(cellPos.from + 1).node;
+                    children.push((0, jsx_runtime_1.jsx)(FloatingPlusControl_1.FloatingPlusControl, { type: "row", index: rowIdx, cellElem: cellElem, tableElem: tableElem, onClick: this._onRowPlusClick }, `row-${rowIdx}-${colIdx}`));
+                }
+            }
+            for (let colIdx = 0; colIdx < tableDesc.cols; colIdx++) {
+                const rowIdx = (0, lodash_1.range)(0, tableDesc.rows).findIndex((rowIdx) => tableDesc.base.rowsDesc[rowIdx].cells[colIdx].type === 'real');
+                if (rowIdx >= 0) {
+                    const cellPos = tableDesc.getPosForCell(rowIdx, colIdx);
+                    const cellElem = this._view.domAtPos(cellPos.from + 1).node;
+                    children.push((0, jsx_runtime_1.jsx)(FloatingPlusControl_1.FloatingPlusControl, { type: "column", index: colIdx, cellElem: cellElem, tableElem: tableElem, onClick: this._onColumnPlusClick }, `col-${rowIdx}-${colIdx}`));
+                }
+            }
+            return (0, jsx_runtime_1.jsx)(react_utils_1.ErrorLoggerBoundary, { children: children });
+        });
+    }
+    update(node, decorations) {
+        this._node = node;
+        this._updateFocusedState(decorations);
+        this._renderer.rerender();
+        return true;
+    }
+    destroy() {
+        this._renderer.remove();
+    }
+    _updateFocusedState(decorations) {
+        this._isFocused = decorations.some((deco) => deco.spec?.[const_1.YfmTableDecorationTypeKey] === const_1.YfmTableDecorationType.FocusTable);
+    }
+    _getTableDesc() {
+        const pos = this._getPos();
+        if (typeof pos !== 'number')
+            return null;
+        return table_desc_1.TableDesc.create(this._node)?.bind(pos);
+    }
+    _onRowPlusClick = (rowIdx) => {
+        this._logger.event({ event: 'row-insert', source: 'floating-plus-button' });
+        const tableDesc = this._getTableDesc();
+        if (!tableDesc)
+            return;
+        (0, insert_empty_row_1.insertEmptyRow)({ tablePos: tableDesc.pos, rowIndex: rowIdx + 1 })(this._view.state, this._view.dispatch);
+        this._view.focus();
+    };
+    _onColumnPlusClick = (colIdx) => {
+        this._logger.event({ event: 'column-insert', source: 'floating-plus-button' });
+        const tableDesc = this._getTableDesc();
+        if (!tableDesc)
+            return;
+        (0, insert_empty_column_1.insertEmptyColumn)({ tablePos: tableDesc.pos, colIndex: colIdx + 1 })(this._view.state, this._view.dispatch);
+        this._view.focus();
+    };
+}
+//# sourceMappingURL=yfm-table-view.js.map

package/build/cjs/extensions/yfm/YfmTable/plugins/YfmTableControls/nodeviews/yfm-table-view.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"yfm-table-view.js","sourceRoot":"../../../../../../../../src","sources":["extensions/yfm/YfmTable/plugins/YfmTableControls/nodeviews/yfm-table-view.tsx"],"names":[],"mappings":"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","sourcesContent":["import {getLoggerFromState} from '#core';\nimport type {Node} from '#pm/model';\nimport type {Decoration, EditorView, NodeView, NodeViewConstructor} from '#pm/view';\nimport {getReactRendererFromState} from 'src/extensions/behavior/ReactRenderer';\nimport {range} from 'src/lodash';\nimport type {Logger2} from 'src/logger';\nimport {ErrorLoggerBoundary} from 'src/react-utils';\nimport {type RealCellPos, TableDesc} from 'src/table-utils/table-desc';\n\nimport {insertEmptyColumn} from '../commands/insert-empty-column';\nimport {insertEmptyRow} from '../commands/insert-empty-row';\nimport {FloatingPlusControl} from '../components/FloatingPlusControl';\nimport {YfmTableDecorationType, YfmTableDecorationTypeKey} from '../const';\n\nimport './yfm-table-view.scss';\n\ntype GetPos = () => number | undefined;\n\nexport const yfmTableView: NodeViewConstructor = (node, view, getPos, decorations): NodeView => {\n    return new YfmTableNewView(node, view, getPos, decorations);\n};\n\nclass YfmTableNewView implements NodeView {\n    dom: HTMLElement;\n    contentDOM: HTMLElement;\n\n    private _node: Node;\n    private readonly _view: EditorView;\n    private readonly _getPos: GetPos;\n    private readonly _renderer;\n    private readonly _logger: Logger2.ILogger;\n\n    private _isFocused = false;\n\n    constructor(node: Node, view: EditorView, getPos: GetPos, decorations: readonly Decoration[]) {\n        this._node = node;\n        this._view = view;\n        this._getPos = getPos;\n\n        this._logger = getLoggerFromState(view.state).nested({\n            node: 'yfm-table',\n        });\n\n        this.dom = this.contentDOM = view.dom.ownerDocument.createElement('table');\n        this.dom.classList.add('g-md-yfm-table-view');\n\n        this._updateFocusedState(decorations);\n        this._renderer = getReactRendererFromState(view.state).createItem('yfm-table-view', () => {\n            if (!this._isFocused) return null;\n            const tableDesc = this._getTableDesc();\n            if (!tableDesc) return null;\n\n            const tableElem = this._view.domAtPos(tableDesc.pos + 1).node as Element;\n            const children: React.ReactNode[] = [];\n\n            for (let rowIdx = 0; rowIdx < tableDesc.rows; rowIdx++) {\n                const colIdx = tableDesc.base.rowsDesc[rowIdx].cells.findIndex(\n                    (cell) => cell.type === 'real',\n                );\n                if (colIdx >= 0) {\n                    const cellPos = tableDesc.getPosForCell(rowIdx, colIdx) as RealCellPos;\n                    const cellElem = this._view.domAtPos(cellPos.from + 1).node as Element;\n                    children.push(\n                        <FloatingPlusControl\n                            key={`row-${rowIdx}-${colIdx}`}\n                            type=\"row\"\n                            index={rowIdx}\n                            cellElem={cellElem}\n                            tableElem={tableElem}\n                            onClick={this._onRowPlusClick}\n                        />,\n                    );\n                }\n            }\n\n            for (let colIdx = 0; colIdx < tableDesc.cols; colIdx++) {\n                const rowIdx = range(0, tableDesc.rows).findIndex(\n                    (rowIdx) => tableDesc.base.rowsDesc[rowIdx].cells[colIdx].type === 'real',\n                );\n                if (rowIdx >= 0) {\n                    const cellPos = tableDesc.getPosForCell(rowIdx, colIdx) as RealCellPos;\n                    const cellElem = this._view.domAtPos(cellPos.from + 1).node as Element;\n                    children.push(\n                        <FloatingPlusControl\n                            key={`col-${rowIdx}-${colIdx}`}\n                            type=\"column\"\n                            index={colIdx}\n                            cellElem={cellElem}\n                            tableElem={tableElem}\n                            onClick={this._onColumnPlusClick}\n                        />,\n                    );\n                }\n            }\n\n            return <ErrorLoggerBoundary>{children}</ErrorLoggerBoundary>;\n        });\n    }\n\n    update(node: Node, decorations: readonly Decoration[]): boolean {\n        this._node = node;\n        this._updateFocusedState(decorations);\n        this._renderer.rerender();\n\n        return true;\n    }\n\n    destroy(): void {\n        this._renderer.remove();\n    }\n\n    private _updateFocusedState(decorations: readonly Decoration[]) {\n        this._isFocused = decorations.some(\n            (deco) => deco.spec?.[YfmTableDecorationTypeKey] === YfmTableDecorationType.FocusTable,\n        );\n    }\n\n    private _getTableDesc() {\n        const pos = this._getPos();\n        if (typeof pos !== 'number') return null;\n        return TableDesc.create(this._node)?.bind(pos);\n    }\n\n    private _onRowPlusClick = (rowIdx: number) => {\n        this._logger.event({event: 'row-insert', source: 'floating-plus-button'});\n\n        const tableDesc = this._getTableDesc();\n        if (!tableDesc) return;\n\n        insertEmptyRow({tablePos: tableDesc.pos, rowIndex: rowIdx + 1})(\n            this._view.state,\n            this._view.dispatch,\n        );\n\n        this._view.focus();\n    };\n\n    private _onColumnPlusClick = (colIdx: number) => {\n        this._logger.event({event: 'column-insert', source: 'floating-plus-button'});\n\n        const tableDesc = this._getTableDesc();\n        if (!tableDesc) return;\n\n        insertEmptyColumn({tablePos: tableDesc.pos, colIndex: colIdx + 1})(\n            this._view.state,\n            this._view.dispatch,\n        );\n\n        this._view.focus();\n    };\n}\n"]}

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

@@ -0,0 +1,23 @@
+import { Plugin, type Transaction } from "../../../../../../pm/state.js";
+import { DecorationSet } from "../../../../../../pm/view.js";
+type FromTo = {
+    from: number;
+    to: number;
+};
+export declare function activateRows(tr: Transaction, params: {
+    controlCell: FromTo;
+    rows: FromTo[];
+    uniqKey: number;
+}): Transaction;
+export declare function deactivateRow(tr: Transaction, uniqKey: number): Transaction;
+export declare function activateColumns(tr: Transaction, params: {
+    controlCell: FromTo;
+    cells: FromTo[];
+    uniqKey: number;
+}): Transaction;
+export declare function deactivateColumn(tr: Transaction, uniqKey: number): Transaction;
+export declare function selectDraggedRow(tr: Transaction, rows: FromTo[]): Transaction;
+export declare function selectDraggedColumn(tr: Transaction, cells: FromTo[]): Transaction;
+export declare function clearAllSelections(tr: Transaction): Transaction;
+export declare const yfmTableDndPlugin: () => Plugin<DecorationSet>;
+export {};

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

@@ -0,0 +1,119 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.yfmTableDndPlugin = void 0;
+exports.activateRows = activateRows;
+exports.deactivateRow = deactivateRow;
+exports.activateColumns = activateColumns;
+exports.deactivateColumn = deactivateColumn;
+exports.selectDraggedRow = selectDraggedRow;
+exports.selectDraggedColumn = selectDraggedColumn;
+exports.clearAllSelections = clearAllSelections;
+const state_1 = require("../../../../../../pm/state.js");
+const view_1 = require("../../../../../../pm/view.js");
+const const_1 = require("../const.js");
+const key = new state_1.PluginKey('yfm-table-dnd-decos');
+function activateRows(tr, params) {
+    const meta = { action: 'row-control-active', ...params };
+    tr.setMeta(key, meta);
+    return tr;
+}
+function deactivateRow(tr, uniqKey) {
+    const meta = { action: 'row-control-non-active', uniqKey };
+    tr.setMeta(key, meta);
+    return tr;
+}
+function activateColumns(tr, params) {
+    const meta = { action: 'column-control-active', ...params };
+    tr.setMeta(key, meta);
+    return tr;
+}
+function deactivateColumn(tr, uniqKey) {
+    const meta = { action: 'column-control-non-active', uniqKey };
+    tr.setMeta(key, meta);
+    return tr;
+}
+function selectDraggedRow(tr, rows) {
+    const meta = { action: 'drag-rows', rows };
+    tr.setMeta(key, meta);
+    return tr;
+}
+function selectDraggedColumn(tr, cells) {
+    const meta = { action: 'drag-columns', cells };
+    tr.setMeta(key, meta);
+    return tr;
+}
+function clearAllSelections(tr) {
+    const meta = { action: 'hide' };
+    tr.setMeta(key, meta);
+    return tr;
+}
+const yfmTableDndPlugin = () => {
+    return new state_1.Plugin({
+        key,
+        state: {
+            init() {
+                return view_1.DecorationSet.empty;
+            },
+            apply(tr, value) {
+                const meta = tr.getMeta(key);
+                if (meta?.action === 'hide') {
+                    return view_1.DecorationSet.empty;
+                }
+                if (meta?.action === 'row-control-active') {
+                    const { controlCell, rows, uniqKey } = meta;
+                    return view_1.DecorationSet.create(tr.doc, [
+                        view_1.Decoration.node(controlCell.from, controlCell.to, {}, {
+                            [const_1.YfmTableDecorationUniqKey]: uniqKey,
+                            [const_1.YfmTableDecorationTypeKey]: const_1.YfmTableDecorationType.OpenRowMenu,
+                        }),
+                        ...rows.map((row) => view_1.Decoration.node(row.from, row.to, { class: 'g-md-yfm-table-active-row' }, {
+                            [const_1.YfmTableDecorationUniqKey]: uniqKey,
+                            [const_1.YfmTableDecorationTypeKey]: const_1.YfmTableDecorationType.ActivateRow,
+                        })),
+                    ]);
+                }
+                if (meta?.action === 'row-control-non-active') {
+                    const { uniqKey } = meta;
+                    const decos = value.find(undefined, undefined, (spec) => spec[const_1.YfmTableDecorationUniqKey] === uniqKey);
+                    return value.remove(decos).map(tr.mapping, tr.doc);
+                }
+                if (meta?.action === 'column-control-active') {
+                    const { controlCell, cells, uniqKey } = meta;
+                    return view_1.DecorationSet.create(tr.doc, [
+                        view_1.Decoration.node(controlCell.from, controlCell.to, {}, {
+                            [const_1.YfmTableDecorationUniqKey]: uniqKey,
+                            [const_1.YfmTableDecorationTypeKey]: const_1.YfmTableDecorationType.OpenColumnMenu,
+                        }),
+                        ...cells.map((pos) => view_1.Decoration.node(pos.from, pos.to, { class: 'g-md-yfm-table-active-column-cell' }, {
+                            [const_1.YfmTableDecorationUniqKey]: uniqKey,
+                            [const_1.YfmTableDecorationTypeKey]: const_1.YfmTableDecorationType.ActivateColumnCells,
+                        })),
+                    ]);
+                }
+                if (meta?.action === 'column-control-non-active') {
+                    const { uniqKey } = meta;
+                    const decos = value.find(undefined, undefined, (spec) => spec[const_1.YfmTableDecorationUniqKey] === uniqKey);
+                    return value.remove(decos).map(tr.mapping, tr.doc);
+                }
+                if (meta?.action === 'drag-rows') {
+                    return view_1.DecorationSet.create(tr.doc, meta.rows.map((row) => view_1.Decoration.node(row.from, row.to, {
+                        class: 'g-md-yfm-table-dnd-dragged-row',
+                    })));
+                }
+                if (meta?.action === 'drag-columns') {
+                    return view_1.DecorationSet.create(tr.doc, meta.cells.map((cell) => view_1.Decoration.node(cell.from, cell.to, {
+                        class: 'g-md-yfm-table-dnd-dragged-column-cell',
+                    })));
+                }
+                return value.map(tr.mapping, tr.doc);
+            },
+        },
+        props: {
+            decorations(state) {
+                return this.getState(state);
+            },
+        },
+    });
+};
+exports.yfmTableDndPlugin = yfmTableDndPlugin;
+//# sourceMappingURL=dnd-plugin.js.map