@rowsncolumns/spreadsheet 10.2.68

package/dist/cjs/hooks/use-selection-interceptors.js

@@ -0,0 +1,131 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useSelectionInterceptors = void 0;
+var tslib_1 = require("tslib");
+var grid_1 = require("@rowsncolumns/grid");
+var react_1 = require("react");
+var useSelectionInterceptors = function (_a) {
+    var sheetId = _a.sheetId, rowCount = _a.rowCount, columnCount = _a.columnCount, frozenRows = _a.frozenRows, frozenColumns = _a.frozenColumns, selectionLeftBound = _a.selectionLeftBound, selectionTopBound = _a.selectionTopBound, isHiddenColumn = _a.isHiddenColumn, isHiddenRow = _a.isHiddenRow, isRowHeader = _a.isRowHeader, isColumnHeader = _a.isColumnHeader, isMergedCell = _a.isMergedCell, getViewPort = _a.getViewPort, scrollToCell = _a.scrollToCell, onChangeActiveCell = _a.onChangeActiveCell;
+    var onMouseMoveInterceptor = (0, react_1.useCallback)(function (e, coords, selectionStart, selectionEnd, modifySelection) {
+        var _a, _b, _c, _d;
+        var isRowHeader = ((_a = selectionStart.current) === null || _a === void 0 ? void 0 : _a.rowIndex) === selectionTopBound &&
+            ((_b = selectionEnd.current) === null || _b === void 0 ? void 0 : _b.rowIndex) === rowCount;
+        var isColumnHeader = ((_c = selectionStart.current) === null || _c === void 0 ? void 0 : _c.columnIndex) === selectionLeftBound &&
+            ((_d = selectionEnd.current) === null || _d === void 0 ? void 0 : _d.columnIndex) === columnCount;
+        if (isRowHeader && isColumnHeader)
+            return false;
+        if (isRowHeader || isColumnHeader) {
+            var end = isRowHeader
+                ? tslib_1.__assign(tslib_1.__assign({}, coords), { rowIndex: rowCount }) : tslib_1.__assign(tslib_1.__assign({}, coords), { columnIndex: columnCount });
+            modifySelection(end);
+            scrollToCell({
+                rowIndex: isRowHeader ? undefined : coords.rowIndex,
+                columnIndex: isColumnHeader ? undefined : coords.columnIndex,
+            });
+            return false;
+        }
+    }, [
+        selectionTopBound,
+        selectionLeftBound,
+        rowCount,
+        columnCount,
+        scrollToCell,
+    ]);
+    var onMouseDownInterceptor = (0, react_1.useCallback)(function (e, coords, selectionStart, selectionEnd, modifySelection, appendSelection, clearSelections, selectAll) {
+        var isShiftKey = e.shiftKey;
+        var isMetaKey = e.metaKey || e.ctrlKey;
+        // const isContextMenu = e.button === MouseButtonCodes.right || e.ctrlKey;
+        var rowHeader = isRowHeader(coords.rowIndex);
+        var colHeader = isColumnHeader(coords.columnIndex);
+        // Intersection top left cell
+        if (rowHeader && colHeader) {
+            selectAll();
+            // Scroll to cell
+            return false;
+        }
+        if (rowHeader || colHeader) {
+            var actualFrozenRows = frozenRows - 1;
+            var actualFrozenColumns = frozenColumns - 1;
+            var normalizedCoords = {
+                rowIndex: Math.max(selectionTopBound, coords.rowIndex),
+                columnIndex: Math.max(selectionLeftBound, coords.columnIndex),
+            };
+            var start = normalizedCoords;
+            var end = colHeader
+                ? tslib_1.__assign(tslib_1.__assign({}, normalizedCoords), { columnIndex: columnCount }) : tslib_1.__assign(tslib_1.__assign({}, normalizedCoords), { rowIndex: rowCount });
+            var _a = getViewPort(), visibleRowStartIndex = _a.visibleRowStartIndex, visibleColumnStartIndex = _a.visibleColumnStartIndex;
+            var activeCell_1 = colHeader
+                ? tslib_1.__assign(tslib_1.__assign({}, normalizedCoords), { columnIndex: actualFrozenColumns >= selectionLeftBound
+                        ? selectionLeftBound
+                        : (0, grid_1.clampIndex)(visibleColumnStartIndex, isHiddenColumn, grid_1.Direction.Right) }) : tslib_1.__assign(tslib_1.__assign({}, normalizedCoords), { rowIndex: actualFrozenRows >= selectionTopBound
+                    ? selectionTopBound
+                    : (0, grid_1.clampIndex)(visibleRowStartIndex, isHiddenRow, grid_1.Direction.Down) });
+            // Skip merged cells when setting active cell (like Excel)
+            if (isMergedCell === null || isMergedCell === void 0 ? void 0 : isMergedCell(activeCell_1)) {
+                if (colHeader) {
+                    // Selecting entire row - find next non-merged column
+                    var isHiddenOrMerged = function (col) {
+                        return (isHiddenColumn === null || isHiddenColumn === void 0 ? void 0 : isHiddenColumn(col)) ||
+                            isMergedCell({ rowIndex: activeCell_1.rowIndex, columnIndex: col });
+                    };
+                    var nextCol = (0, grid_1.clampIndex)(activeCell_1.columnIndex + 1, isHiddenOrMerged, grid_1.Direction.Right);
+                    if (nextCol <= columnCount) {
+                        activeCell_1 = tslib_1.__assign(tslib_1.__assign({}, activeCell_1), { columnIndex: nextCol });
+                    }
+                }
+                else {
+                    // Selecting entire column - find next non-merged row
+                    var isHiddenOrMerged = function (row) {
+                        return (isHiddenRow === null || isHiddenRow === void 0 ? void 0 : isHiddenRow(row)) ||
+                            isMergedCell({
+                                rowIndex: row,
+                                columnIndex: activeCell_1.columnIndex,
+                            });
+                    };
+                    var nextRow = (0, grid_1.clampIndex)(activeCell_1.rowIndex + 1, isHiddenOrMerged, grid_1.Direction.Down);
+                    if (nextRow <= rowCount) {
+                        activeCell_1 = tslib_1.__assign(tslib_1.__assign({}, activeCell_1), { rowIndex: nextRow });
+                    }
+                }
+            }
+            // Prevent bug where cell can be out of view
+            scrollToCell(activeCell_1);
+            if (isShiftKey) {
+                modifySelection(end);
+            }
+            else if (isMetaKey) {
+                appendSelection(start, end);
+                onChangeActiveCell === null || onChangeActiveCell === void 0 ? void 0 : onChangeActiveCell(sheetId, activeCell_1);
+            }
+            else {
+                /* Clear all selections */
+                clearSelections();
+                selectionStart.current = start;
+                selectionEnd.current = end;
+                modifySelection(end);
+                onChangeActiveCell === null || onChangeActiveCell === void 0 ? void 0 : onChangeActiveCell(sheetId, activeCell_1);
+            }
+            return false;
+        }
+    }, [
+        sheetId,
+        rowCount,
+        columnCount,
+        frozenColumns,
+        frozenRows,
+        selectionLeftBound,
+        selectionTopBound,
+        isHiddenColumn,
+        isHiddenRow,
+        isRowHeader,
+        isColumnHeader,
+        isMergedCell,
+        onChangeActiveCell,
+        getViewPort,
+    ]);
+    return (0, react_1.useMemo)(function () { return ({
+        onMouseMoveInterceptor: onMouseMoveInterceptor,
+        onMouseDownInterceptor: onMouseDownInterceptor,
+    }); }, [onMouseDownInterceptor, onMouseMoveInterceptor]);
+};
+exports.useSelectionInterceptors = useSelectionInterceptors;

package/dist/cjs/hooks/use-selection-move.d.ts

@@ -0,0 +1,31 @@
+import type { Align, CellInterface, OptionalCellInterface } from "@rowsncolumns/grid";
+import type React from "react";
+import type { useCreateFormulaTokenizer } from "./use-create-formula-tokenizer";
+type UseSelectionMoveProps = {
+    tokenizer: ReturnType<typeof useCreateFormulaTokenizer>;
+    /**
+     * Get cell coords from x and y position
+     * @param x
+     * @param y
+     * @param includeFrozen
+     */
+    getCellCoordsFromOffset(x: number, y: number, includeFrozen?: boolean | undefined): CellInterface | null | undefined;
+    /**
+     * Scroll to a cell
+     * @param cell
+     * @param align
+     */
+    scrollToCell(cell: OptionalCellInterface, align?: Align | undefined): void | undefined;
+};
+/**
+ * Lets the user drag a formula reference (via selection border covers)
+ * to move it to a new range while in formula mode.
+ * Counterpart of useSelectionResize, which resizes references
+ * via the corner resize handles.
+ */
+export declare const useSelectionMove: ({ tokenizer, getCellCoordsFromOffset, scrollToCell, }: UseSelectionMoveProps) => {
+    onMouseDownMoveSelection: (e: React.PointerEvent<HTMLDivElement>) => void;
+    isDragging: boolean;
+};
+export {};
+//# sourceMappingURL=use-selection-move.d.ts.map

package/dist/cjs/hooks/use-selection-move.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-selection-move.d.ts","sourceRoot":"","sources":["../../../hooks/use-selection-move.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EACV,KAAK,EACL,aAAa,EAEb,qBAAqB,EACtB,MAAM,oBAAoB,CAAC;AAE5B,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAS/B,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,gCAAgC,CAAC;AAGhF,KAAK,qBAAqB,GAAG;IAC3B,SAAS,EAAE,UAAU,CAAC,OAAO,yBAAyB,CAAC,CAAC;IACxD;;;;;OAKG;IACH,uBAAuB,CACrB,CAAC,EAAE,MAAM,EACT,CAAC,EAAE,MAAM,EACT,aAAa,CAAC,EAAE,OAAO,GAAG,SAAS,GAClC,aAAa,GAAG,IAAI,GAAG,SAAS,CAAC;IACpC;;;;OAIG;IACH,YAAY,CACV,IAAI,EAAE,qBAAqB,EAC3B,KAAK,CAAC,EAAE,KAAK,GAAG,SAAS,GACxB,IAAI,GAAG,SAAS,CAAC;CACrB,CAAC;AAEF;;;;;GAKG;AACH,eAAO,MAAM,gBAAgB,GAAI,uDAI9B,qBAAqB;kCA2HhB,KAAK,CAAC,YAAY,CAAC,cAAc,CAAC;;CAyCzC,CAAC"}

package/dist/cjs/hooks/use-selection-move.js

@@ -0,0 +1,155 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useSelectionMove = void 0;
+var tslib_1 = require("tslib");
+var isNil_1 = tslib_1.__importDefault(require("lodash/isNil"));
+var react_1 = require("react");
+var atoms_1 = require("../atoms");
+var use_selection_resize_1 = require("./use-selection-resize");
+/**
+ * Lets the user drag a formula reference (via selection border covers)
+ * to move it to a new range while in formula mode.
+ * Counterpart of useSelectionResize, which resizes references
+ * via the corner resize handles.
+ */
+var useSelectionMove = function (_a) {
+    var tokenizer = _a.tokenizer, getCellCoordsFromOffset = _a.getCellCoordsFromOffset, scrollToCell = _a.scrollToCell;
+    var selectionIndexRef = (0, react_1.useRef)(undefined);
+    var isDraggingRef = (0, react_1.useRef)(false);
+    var startCell = (0, react_1.useRef)(undefined);
+    var initialRange = (0, react_1.useRef)(undefined);
+    var activeEditor = (0, atoms_1.useActiveEditor)();
+    var getSelectionToAddress = (0, atoms_1.useGetAddressFromSelection)();
+    var getSelectionsFromFormula = (0, atoms_1.useGetSelectionsFromFormula)();
+    var editingCellCoordinate = (0, atoms_1.useEditingCellCoordinate)();
+    // Mousemove
+    var onMouseMove = (0, react_1.useCallback)(function (e) {
+        var e_1, _a;
+        var _b;
+        // User is not dragging yet
+        if (!isDraggingRef.current || !startCell.current) {
+            return;
+        }
+        // Get cell coords
+        var coords = getCellCoordsFromOffset(e.clientX, e.clientY, false);
+        if (!coords) {
+            return;
+        }
+        // Scroll to cell
+        scrollToCell(coords);
+        var value = (_b = activeEditor === null || activeEditor === void 0 ? void 0 : activeEditor.getValue()) !== null && _b !== void 0 ? _b : "";
+        var tokens = tokenizer(value);
+        try {
+            for (var tokens_1 = tslib_1.__values(tokens), tokens_1_1 = tokens_1.next(); !tokens_1_1.done; tokens_1_1 = tokens_1.next()) {
+                var token = tokens_1_1.value;
+                if ((token.selection || token.structured || token.isNamedRange) &&
+                    token.index === selectionIndexRef.current) {
+                    var selections = getSelectionsFromFormula === null || getSelectionsFromFormula === void 0 ? void 0 : getSelectionsFromFormula(token.image, editingCellCoordinate !== null && editingCellCoordinate !== void 0 ? editingCellCoordinate : coords);
+                    if (!selections) {
+                        continue;
+                    }
+                    // Get the last selection
+                    var selection = selections[(selections === null || selections === void 0 ? void 0 : selections.length) - 1];
+                    if (!selection) {
+                        continue;
+                    }
+                    if (!initialRange.current) {
+                        initialRange.current = tslib_1.__assign({}, selection.range);
+                    }
+                    var range = initialRange.current;
+                    // Clamp so the moved range stays within the grid
+                    var deltaRows = Math.max(coords.rowIndex - startCell.current.rowIndex, 1 - range.startRowIndex);
+                    var deltaColumns = Math.max(coords.columnIndex - startCell.current.columnIndex, 1 - range.startColumnIndex);
+                    // Shift the entire range, keeping its dimensions
+                    selection.range = {
+                        startRowIndex: range.startRowIndex + deltaRows,
+                        endRowIndex: range.endRowIndex + deltaRows,
+                        startColumnIndex: range.startColumnIndex + deltaColumns,
+                        endColumnIndex: range.endColumnIndex + deltaColumns,
+                    };
+                    // Create address
+                    var address = getSelectionToAddress === null || getSelectionToAddress === void 0 ? void 0 : getSelectionToAddress(selection, token.sheetName);
+                    if (address) {
+                        token.image = address;
+                    }
+                }
+            }
+        }
+        catch (e_1_1) { e_1 = { error: e_1_1 }; }
+        finally {
+            try {
+                if (tokens_1_1 && !tokens_1_1.done && (_a = tokens_1.return)) _a.call(tokens_1);
+            }
+            finally { if (e_1) throw e_1.error; }
+        }
+        // Create new formula
+        var newValue = (0, use_selection_resize_1.detokenize)(tokens);
+        // Update editor value
+        activeEditor === null || activeEditor === void 0 ? void 0 : activeEditor.setValue(newValue);
+        // Keep the cursor at the end of the moved reference while
+        // dragging — the reference can sit anywhere in the formula
+        activeEditor === null || activeEditor === void 0 ? void 0 : activeEditor.moveCursorToTokenEnd(selectionIndexRef.current);
+    }, [
+        getCellCoordsFromOffset,
+        tokenizer,
+        activeEditor,
+        getSelectionToAddress,
+        getSelectionsFromFormula,
+        scrollToCell,
+        editingCellCoordinate,
+    ]);
+    // Rendered dragging state: drives the border cover's grabbing cursor
+    // (cursor: isDragging ? "grabbing" : "grab" in the Selection component)
+    var _b = tslib_1.__read((0, react_1.useState)(false), 2), isDragging = _b[0], setIsDragging = _b[1];
+    // Mouseup
+    var onMouseUp = (0, react_1.useCallback)(function () {
+        // Land the cursor at the end of the moved reference,
+        // not the end of the formula
+        activeEditor === null || activeEditor === void 0 ? void 0 : activeEditor.moveCursorToTokenEnd(selectionIndexRef.current);
+        // Focus (view focus preserves the selection set above)
+        activeEditor === null || activeEditor === void 0 ? void 0 : activeEditor.focus();
+        isDraggingRef.current = false;
+        startCell.current = undefined;
+        initialRange.current = undefined;
+        setIsDragging(false);
+        document.removeEventListener("pointermove", onMouseMove);
+        document.removeEventListener("pointerup", onMouseUp);
+    }, [activeEditor, onMouseMove]);
+    // Mousedown
+    var onMouseDownMoveSelection = (0, react_1.useCallback)(function (e) {
+        var _a, _b;
+        var index = Number(e.currentTarget.dataset.index);
+        if ((0, isNil_1.default)(index) || Number.isNaN(index)) {
+            return;
+        }
+        // Prevent onblur being fired
+        e.preventDefault();
+        // Set dragging ref
+        isDraggingRef.current = true;
+        selectionIndexRef.current = index;
+        initialRange.current = undefined;
+        // Get cell coords
+        var coords = getCellCoordsFromOffset(e.clientX, e.clientY, false);
+        // Validate cell
+        if (coords) {
+            startCell.current = coords;
+            // Capture the pointer so the cover keeps showing its (React
+            // rendered) cursor for the whole drag, even when the pointer
+            // leaves the 5px cover. Captured events still bubble to the
+            // document listeners below.
+            try {
+                (_b = (_a = e.currentTarget).setPointerCapture) === null || _b === void 0 ? void 0 : _b.call(_a, e.pointerId);
+            }
+            catch (_c) {
+                // jsdom / older browsers without pointer capture
+            }
+            setIsDragging(true);
+            document.addEventListener("pointermove", onMouseMove);
+            document.addEventListener("pointerup", onMouseUp);
+        }
+        // Focus
+        activeEditor === null || activeEditor === void 0 ? void 0 : activeEditor.focus();
+    }, [activeEditor, onMouseMove, onMouseUp, getCellCoordsFromOffset]);
+    return { onMouseDownMoveSelection: onMouseDownMoveSelection, isDragging: isDragging };
+};
+exports.useSelectionMove = useSelectionMove;

package/dist/cjs/hooks/use-selection-renderer.d.ts

@@ -0,0 +1,46 @@
+import { type CellInterface, type SelectionArea, type SelectionProps } from "@rowsncolumns/grid";
+import React from "react";
+import type { CanvasGridProps, SelectionAttributes } from "../components/canvas-grid/typings";
+import type { SelectionNewProps } from "../components/selection/types";
+import type { SheetRange } from "../types";
+import type { useFlash } from "./use-flash";
+export type UseSelectionRendererProps = {
+    selectionCount: number;
+    fillHandleSize?: number;
+    showFillHandle?: boolean;
+    sheetId: number;
+    selectionBackgroundColor: string;
+    selectionBorderColor: string;
+    scale?: number;
+    getSheetName?(sheetId: number): string | undefined;
+    onChangeActiveCell: CanvasGridProps["onChangeActiveCell"];
+    onChangeSelections: CanvasGridProps["onChangeSelections"];
+    onSelectionMouseDown?(e: React.MouseEvent<HTMLDivElement, MouseEvent>, cell: CellInterface | undefined, selection: SelectionArea | undefined, index: number | undefined, shouldClamp?: boolean | undefined): void;
+    SelectionTitleComponent: React.ElementType;
+    showSelectionResizeHandles?: boolean;
+    isResizingTable: boolean;
+    resizeHandleBorderColor?: string;
+    resizeHandleSize?: number;
+    onRequestEditTable: CanvasGridProps["onRequestEditTable"];
+    onRequestEditPivotTable: CanvasGridProps["onRequestEditPivotTable"];
+    onMouseDownResizeHandle: SelectionNewProps["onMouseDownResizeHandle"];
+    onMouseDownMoveSelection: SelectionNewProps["onMouseDownMoveHandle"];
+    /** Formula reference drag in progress (drives the grabbing cursor) */
+    isDraggingMoveSelection?: boolean;
+    onFlashEnd: ReturnType<typeof useFlash>["onFlashEnd"];
+    enableMagicFill?: CanvasGridProps["enableMagicFill"];
+    MagicFillComponent?: CanvasGridProps["MagicFillComponent"];
+    MagicFillContent?: CanvasGridProps["MagicFillContent"];
+    QuickEdit?: CanvasGridProps["QuickEdit"];
+    PasteMenu?: CanvasGridProps["PasteMenu"];
+    SuggestionAction?: CanvasGridProps["SuggestionAction"];
+    readonly?: boolean;
+    showPasteMenu?: boolean;
+    onSplitTextToColumns: CanvasGridProps["onSplitTextToColumns"];
+    hoveredCell?: CellInterface | null;
+    onRemoveQuickEdit(range: SheetRange): void;
+    onAddQuickEdit(range: SheetRange): void;
+    cachedHoveredSelectionIds: Set<string | number>;
+};
+export declare const useSelectionRenderer: ({ sheetId, selectionCount, selectionBackgroundColor, selectionBorderColor, onSelectionMouseDown, onChangeActiveCell, onChangeSelections, onRequestEditTable, onRequestEditPivotTable, onMouseDownResizeHandle, onMouseDownMoveSelection, isDraggingMoveSelection, onFlashEnd, getSheetName, resizeHandleSize, showSelectionResizeHandles, resizeHandleBorderColor, SelectionTitleComponent, isResizingTable, fillHandleSize, showFillHandle, enableMagicFill, MagicFillComponent, MagicFillContent, readonly, showPasteMenu, hoveredCell, onSplitTextToColumns, onRemoveQuickEdit, onAddQuickEdit, QuickEdit, PasteMenu, SuggestionAction, cachedHoveredSelectionIds, }: UseSelectionRendererProps) => (props: SelectionProps<SelectionAttributes>) => React.JSX.Element | null;
+//# sourceMappingURL=use-selection-renderer.d.ts.map

package/dist/cjs/hooks/use-selection-renderer.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-selection-renderer.d.ts","sourceRoot":"","sources":["../../../hooks/use-selection-renderer.tsx"],"names":[],"mappings":"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"}

package/dist/cjs/hooks/use-selection-renderer.js

@@ -0,0 +1,145 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useSelectionRenderer = void 0;
+var tslib_1 = require("tslib");
+var grid_1 = require("@rowsncolumns/grid");
+var react_1 = tslib_1.__importStar(require("react"));
+var selections_1 = require("../api/selections");
+var atoms_1 = require("../atoms");
+var formula_mode_atom_1 = require("../atoms/formula-mode.atom");
+var config_1 = require("../config");
+var selection_1 = require("./../components/selection");
+var useSelectionRenderer = function (_a) {
+    var sheetId = _a.sheetId, selectionCount = _a.selectionCount, selectionBackgroundColor = _a.selectionBackgroundColor, selectionBorderColor = _a.selectionBorderColor, onSelectionMouseDown = _a.onSelectionMouseDown, onChangeActiveCell = _a.onChangeActiveCell, onChangeSelections = _a.onChangeSelections, onRequestEditTable = _a.onRequestEditTable, onRequestEditPivotTable = _a.onRequestEditPivotTable, onMouseDownResizeHandle = _a.onMouseDownResizeHandle, onMouseDownMoveSelection = _a.onMouseDownMoveSelection, isDraggingMoveSelection = _a.isDraggingMoveSelection, onFlashEnd = _a.onFlashEnd, getSheetName = _a.getSheetName, _b = _a.resizeHandleSize, resizeHandleSize = _b === void 0 ? 6 : _b, showSelectionResizeHandles = _a.showSelectionResizeHandles, resizeHandleBorderColor = _a.resizeHandleBorderColor, SelectionTitleComponent = _a.SelectionTitleComponent, isResizingTable = _a.isResizingTable, fillHandleSize = _a.fillHandleSize, showFillHandle = _a.showFillHandle, enableMagicFill = _a.enableMagicFill, MagicFillComponent = _a.MagicFillComponent, MagicFillContent = _a.MagicFillContent, readonly = _a.readonly, showPasteMenu = _a.showPasteMenu, hoveredCell = _a.hoveredCell, onSplitTextToColumns = _a.onSplitTextToColumns, onRemoveQuickEdit = _a.onRemoveQuickEdit, onAddQuickEdit = _a.onAddQuickEdit, QuickEdit = _a.QuickEdit, PasteMenu = _a.PasteMenu, SuggestionAction = _a.SuggestionAction, cachedHoveredSelectionIds = _a.cachedHoveredSelectionIds;
+    var formulaMode = (0, formula_mode_atom_1.useFormulaModeValue)();
+    var selectionIndex = (0, atoms_1.useFormulaSelectionIndex)();
+    var hoveredCellRef = (0, react_1.useRef)(hoveredCell);
+    // Keep in sync
+    hoveredCellRef.current = hoveredCell;
+    return (0, react_1.useCallback)(function (props) {
+        var activeCell = props.activeCell, selection = props.selection, index = props.index, range = props.range, type = props.type, inProgress = props.inProgress, _a = props.draggable, draggable = _a === void 0 ? true : _a, duration = props.duration;
+        var isFill = type === "fill";
+        var isActiveCell = type === "activeCell";
+        var isSelection = type === "selection";
+        var isBorder = !isActiveCell && !isSelection && !isFill;
+        var isEmptySelections = selectionCount === 0;
+        var showResizeHandles = showSelectionResizeHandles
+            ? formulaMode && isSelection
+            : false;
+        var isActiveIndex = formulaMode && isSelection ? selectionIndex === index : false;
+        var sheetName = getSheetName === null || getSheetName === void 0 ? void 0 : getSheetName(sheetId);
+        var hoveredCell = hoveredCellRef.current;
+        var isHovered = hoveredCell
+            ? isSelection
+                ? (0, grid_1.isCellWithinBounds)(hoveredCell, selection === null || selection === void 0 ? void 0 : selection.range)
+                : isActiveCell
+                    ? (0, grid_1.isEqualCells)(hoveredCell, activeCell)
+                    : false
+            : false;
+        /**
+         * When in formulaMode,
+         * only display selections that references current
+         * sheet name
+         */
+        if (formulaMode && isSelection && (selection === null || selection === void 0 ? void 0 : selection.sheetName) !== sheetName) {
+            return null;
+        }
+        var strokeStyle = isBorder
+            ? props.strokeStyle
+            : (0, selections_1.getSelectionStrokeStyle)(formulaMode, isFill, isActiveCell, isEmptySelections);
+        var strokeWidth = isBorder
+            ? props.strokeWidth
+            : (0, selections_1.getSelectionStrokeWidth)(formulaMode, isFill, isActiveCell, isResizingTable);
+        var fillOpacity = isBorder
+            ? props.fillOpacity
+            : (0, selections_1.getSelectionFillOpacity)(formulaMode, isFill);
+        var stroke = isBorder
+            ? props.stroke
+            : (0, selections_1.getSelectionStroke)(formulaMode, isFill, isActiveCell, isEmptySelections, inProgress, selectionBorderColor, index);
+        var fill = isBorder
+            ? props.fill
+            : (0, selections_1.getSelectionFill)(formulaMode, isFill, isActiveCell, selectionBackgroundColor, index, isActiveIndex, isResizingTable);
+        return (react_1.default.createElement(selection_1.Selection, tslib_1.__assign({}, props, { key: index, 
+            // Overwrite draggable
+            draggable: isResizingTable ? false : draggable, 
+            // Formula reference drag: same React-driven cursor as regular
+            // selection drags (cursor: isDragging ? "grabbing" : "grab")
+            isDragging: props.isDragging ||
+                (showResizeHandles ? isDraggingMoveSelection : false), onMouseDown: function (e) {
+                onSelectionMouseDown === null || onSelectionMouseDown === void 0 ? void 0 : onSelectionMouseDown(e, activeCell, selection, index);
+            }, showResizeHandles: showResizeHandles, 
+            // Allow dragging formula references via border covers,
+            // same condition as the resize handles
+            onMouseDownMoveHandle: showResizeHandles ? onMouseDownMoveSelection : undefined, resizeHandleBorderColor: resizeHandleBorderColor, strokeStyle: strokeStyle, strokeWidth: strokeWidth, fillOpacity: fillOpacity, stroke: stroke, fill: fill, onMouseDownResizeHandle: onMouseDownResizeHandle, resizeHandleSize: resizeHandleSize, selectionCount: selectionCount, onMouseDownTitle: function (e) {
+                if (range) {
+                    var newActiveCell = {
+                        rowIndex: range.startRowIndex,
+                        columnIndex: range.startColumnIndex,
+                    };
+                    var newSelection = { range: range };
+                    /* Create new active Cell */
+                    onChangeActiveCell === null || onChangeActiveCell === void 0 ? void 0 : onChangeActiveCell(sheetId, newActiveCell);
+                    /* Update selection area */
+                    onChangeSelections === null || onChangeSelections === void 0 ? void 0 : onChangeSelections(sheetId, [newSelection]);
+                    /* Pass it on to selection move */
+                    /**
+                     * When user mousedowns on title, selections are updated to only select the
+                     * current range
+                     * So selection key becomes 0
+                     */
+                    if (draggable) {
+                        onSelectionMouseDown === null || onSelectionMouseDown === void 0 ? void 0 : onSelectionMouseDown(e, activeCell, newSelection, 0);
+                    }
+                }
+            }, isHovered: isHovered, TitleComponent: SelectionTitleComponent, onRequestEditTable: onRequestEditTable, onRequestEditPivotTable: onRequestEditPivotTable, fillHandleSize: fillHandleSize, showFillHandle: showFillHandle, onFlashEnd: onFlashEnd, duration: duration, enableMagicFill: formulaMode ? false : enableMagicFill, MagicFillComponent: MagicFillComponent, readonly: readonly, showPasteMenu: showPasteMenu, sheetId: sheetId, MagicFillContent: MagicFillContent, QuickEdit: QuickEdit, PasteMenu: PasteMenu, SuggestionAction: SuggestionAction, onSplitTextToColumns: function (delimiter) {
+                // Active cell
+                var newActiveCell = range
+                    ? {
+                        rowIndex: range.startRowIndex,
+                        columnIndex: range.startColumnIndex,
+                    }
+                    : activeCell !== null && activeCell !== void 0 ? activeCell : config_1.DEFAULT_ACTIVE_CELL;
+                var newSelection = props.selection
+                    ? [props.selection]
+                    : [];
+                onSplitTextToColumns === null || onSplitTextToColumns === void 0 ? void 0 : onSplitTextToColumns(sheetId, newActiveCell, newSelection, delimiter);
+            }, onRemoveQuickEdit: onRemoveQuickEdit, onAddQuickEdit: onAddQuickEdit })));
+    }, [
+        sheetId,
+        fillHandleSize,
+        enableMagicFill,
+        showFillHandle,
+        onSelectionMouseDown,
+        onChangeActiveCell,
+        onChangeSelections,
+        onRequestEditTable,
+        onRequestEditPivotTable,
+        onMouseDownResizeHandle,
+        onMouseDownMoveSelection,
+        isDraggingMoveSelection,
+        onFlashEnd,
+        getSheetName,
+        SelectionTitleComponent,
+        formulaMode,
+        selectionCount,
+        selectionBackgroundColor,
+        selectionBorderColor,
+        selectionIndex,
+        isResizingTable,
+        resizeHandleBorderColor,
+        showSelectionResizeHandles,
+        resizeHandleSize,
+        MagicFillComponent,
+        readonly,
+        showPasteMenu,
+        onSplitTextToColumns,
+        MagicFillContent,
+        QuickEdit,
+        PasteMenu,
+        SuggestionAction,
+        onRemoveQuickEdit,
+        onAddQuickEdit,
+        cachedHoveredSelectionIds,
+    ]);
+};
+exports.useSelectionRenderer = useSelectionRenderer;

package/dist/cjs/hooks/use-selection-resize.d.ts

@@ -0,0 +1,30 @@
+import type { Align, CellInterface, GridRange, OptionalCellInterface } from "@rowsncolumns/grid";
+import type React from "react";
+import type { ParsedToken } from "../types";
+import type { useCreateFormulaTokenizer } from "./use-create-formula-tokenizer";
+type UseSelectionResizeProps = {
+    resizeHandleSize?: number;
+    tokenizer: ReturnType<typeof useCreateFormulaTokenizer>;
+    /**
+     * Get cell coords from x and y position
+     * @param x
+     * @param y
+     * @param includeFrozen
+     */
+    getCellCoordsFromOffset(x: number, y: number, includeFrozen?: boolean | undefined): CellInterface | null | undefined;
+    getCellBounds(cell: CellInterface): GridRange;
+    /**
+     * Scroll to a cell
+     * @param cell
+     * @param align
+     */
+    scrollToCell(cell: OptionalCellInterface, align?: Align | undefined): void | undefined;
+};
+/**
+ * Converts tokens to string
+ * @param tokens
+ */
+export declare const detokenize: (tokens: ParsedToken[]) => string;
+export declare const useSelectionResize: ({ resizeHandleSize, tokenizer, getCellCoordsFromOffset, getCellBounds, scrollToCell, }: UseSelectionResizeProps) => (e: React.PointerEvent<HTMLDivElement>) => void;
+export {};
+//# sourceMappingURL=use-selection-resize.d.ts.map

package/dist/cjs/hooks/use-selection-resize.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-selection-resize.d.ts","sourceRoot":"","sources":["../../../hooks/use-selection-resize.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EACV,KAAK,EACL,aAAa,EACb,SAAS,EACT,qBAAqB,EACtB,MAAM,oBAAoB,CAAC;AAG5B,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAS/B,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,UAAU,CAAC;AAC5C,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,gCAAgC,CAAC;AAIhF,KAAK,uBAAuB,GAAG;IAC7B,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,SAAS,EAAE,UAAU,CAAC,OAAO,yBAAyB,CAAC,CAAC;IACxD;;;;;OAKG;IACH,uBAAuB,CACrB,CAAC,EAAE,MAAM,EACT,CAAC,EAAE,MAAM,EACT,aAAa,CAAC,EAAE,OAAO,GAAG,SAAS,GAClC,aAAa,GAAG,IAAI,GAAG,SAAS,CAAC;IACpC,aAAa,CAAC,IAAI,EAAE,aAAa,GAAG,SAAS,CAAC;IAC9C;;;;OAIG;IACH,YAAY,CACV,IAAI,EAAE,qBAAqB,EAC3B,KAAK,CAAC,EAAE,KAAK,GAAG,SAAS,GACxB,IAAI,GAAG,SAAS,CAAC;CACrB,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,UAAU,GAAI,QAAQ,WAAW,EAAE,WAU/C,CAAC;AAEF,eAAO,MAAM,kBAAkB,GAAI,wFAMhC,uBAAuB,SA+HlB,KAAK,CAAC,YAAY,CAAC,cAAc,CAAC,SAiDzC,CAAC"}