@rowsncolumns/spreadsheet 10.3.1 → 10.4.0

package/dist/cjs/components/context-menu/total-row-functions.js

@@ -1,25 +1,30 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.getTotalRowFunctionFromFormula = exports.getTotalRowFunctionFormula = exports.escapeStructuredColumnName = exports.TOTAL_ROW_FUNCTIONS = void 0;
+exports.withTotalRowFunction = exports.getTotalRowFunctionFormula = exports.getTotalRowFunctionFromFormula = exports.escapeStructuredColumnName = exports.MORE_FUNCTIONS_INITIAL_VALUE = exports.TOTAL_ROW_FUNCTIONS = void 0;
+var tslib_1 = require("tslib");
+var utils_1 = require("@rowsncolumns/utils");
+Object.defineProperty(exports, "escapeStructuredColumnName", { enumerable: true, get: function () { return utils_1.escapeStructuredColumnName; } });
+Object.defineProperty(exports, "getTotalRowFunctionFromFormula", { enumerable: true, get: function () { return utils_1.getTotalsRowFunctionFromFormula; } });
 exports.TOTAL_ROW_FUNCTIONS = [
-    { id: "none", label: "None" },
-    { id: "average", label: "Average", subtotal: 101 },
-    { id: "count", label: "Count", subtotal: 103 },
-    { id: "countNumbers", label: "Count Numbers", subtotal: 102 },
-    { id: "max", label: "Max", subtotal: 104 },
-    { id: "min", label: "Min", subtotal: 105 },
-    { id: "sum", label: "Sum", subtotal: 109 },
-    { id: "stdDev", label: "StdDev", subtotal: 107 },
-    { id: "var", label: "Var", subtotal: 110 },
-];
-/**
- * Escape a column name for use inside a structured reference: `[`, `]`, `#`
- * and `'` are prefixed with `'`, as Excel does.
- */
-var escapeStructuredColumnName = function (name) {
-    return name.replace(/(['\[\]#])/g, "'$1");
-};
-exports.escapeStructuredColumnName = escapeStructuredColumnName;
+    ["none", "None"],
+    ["average", "Average"],
+    ["count", "Count"],
+    ["countNums", "Count Numbers"],
+    ["max", "Max"],
+    ["min", "Min"],
+    ["sum", "Sum"],
+    ["stdDev", "StdDev"],
+    ["var", "Var"],
+].map(function (_a) {
+    var _b = tslib_1.__read(_a, 2), id = _b[0], label = _b[1];
+    return ({
+        id: id,
+        label: label,
+        subtotal: utils_1.TOTALS_ROW_FUNCTION_SUBTOTAL[id],
+    });
+});
+/** What "More Functions…" pre-fills in the cell editor for a custom totals formula. */
+exports.MORE_FUNCTIONS_INITIAL_VALUE = "=SUBTOTAL(";
 /**
  * Formula for a totals-row cell, e.g. `=SUBTOTAL(109,Table1[Amount])`.
  * Qualified with the table name so it evaluates from any engine and matches
@@ -31,32 +36,27 @@ var getTotalRowFunctionFormula = function (fn, table, columnIndex) {
     if (fn === "none") {
         return "";
     }
-    var option = exports.TOTAL_ROW_FUNCTIONS.find(function (item) { return item.id === fn; });
     var columnName = (_b = (_a = table.columns) === null || _a === void 0 ? void 0 : _a[columnIndex - table.range.startColumnIndex]) === null || _b === void 0 ? void 0 : _b.name;
-    if (!(option === null || option === void 0 ? void 0 : option.subtotal) || !columnName || !table.title) {
+    if (!columnName || !table.title) {
         return undefined;
     }
-    return "=SUBTOTAL(".concat(option.subtotal, ",").concat(table.title, "[").concat((0, exports.escapeStructuredColumnName)(columnName), "])");
+    return (0, utils_1.getTotalsRowFormula)(fn, table.title, columnName);
 };
 exports.getTotalRowFunctionFormula = getTotalRowFunctionFormula;
 /**
- * Recognise the aggregation a totals-row formula uses, so the picker can show
- * the active choice. Both the hidden-row-aware (1xx) and plain (1–11)
- * `SUBTOTAL` numbers map to the same option; anything else is "none".
+ * The table's columns with `columnIndex`'s `totalsRowFunction` set to `fn` —
+ * the shape `onUpdateTable` persists so the choice survives toggling the totals
+ * row off and on. `undefined` when the column list does not cover the cell.
  */
-var getTotalRowFunctionFromFormula = function (formula) {
-    var _a, _b;
-    if (!formula) {
-        return "none";
-    }
-    var match = /^\s*=\s*SUBTOTAL\s*\(\s*(\d{1,3})\s*,/i.exec(formula);
-    if (!match) {
-        return "none";
+var withTotalRowFunction = function (table, columnIndex, fn) {
+    var _a;
+    var index = columnIndex - table.range.startColumnIndex;
+    var column = (_a = table.columns) === null || _a === void 0 ? void 0 : _a[index];
+    if (!column) {
+        return undefined;
     }
-    var number = Number(match[1]);
-    var normalized = number > 100 ? number - 100 : number;
-    return ((_b = (_a = exports.TOTAL_ROW_FUNCTIONS.find(function (item) {
-        return item.subtotal !== undefined && item.subtotal - 100 === normalized;
-    })) === null || _a === void 0 ? void 0 : _a.id) !== null && _b !== void 0 ? _b : "none");
+    return table.columns.map(function (item, i) {
+        return i === index ? tslib_1.__assign(tslib_1.__assign({}, item), { totalsRowFunction: fn }) : item;
+    });
 };
-exports.getTotalRowFunctionFromFormula = getTotalRowFunctionFromFormula;
+exports.withTotalRowFunction = withTotalRowFunction;

package/dist/cjs/components/embeds/chart-component.d.ts

@@ -11,6 +11,23 @@ export type ChartComponentProps = {
     isSelected: boolean;
     readonly?: boolean;
     onDeleteChart: CanvasGridProps["onDeleteChart"];
+    /**
+     * Persist an edited chart (the grid's `onUpdateChart`). Renderers use it
+     * for in-place operations such as Switch Row/Column.
+     */
+    onUpdateChart?: CanvasGridProps["onUpdateChart"];
+    /** Chart clipboard (Ctrl+C / Ctrl+X / Ctrl+V / Ctrl+D) — for a chart context menu. */
+    onCopyChart?: (chartId: EmbeddedChart["chartId"]) => boolean;
+    onCutChart?: (chartId: EmbeddedChart["chartId"]) => boolean;
+    onPasteChart?: () => boolean;
+    onDuplicateChart?: (chartId: EmbeddedChart["chartId"]) => EmbeddedChart | undefined;
+    /**
+     * Excel's PivotChart field buttons, drawn over the chart frame. The host
+     * composes them (`PivotChartFieldButtons` from `@rowsncolumns/pivot`
+     * with its pivot tables and sort / filter actions) because the renderer
+     * knows nothing about pivots; renderers place the node inside the frame.
+     */
+    fieldButtons?: React.ReactNode;
 };
 export declare const ChartComponent: React.MemoExoticComponent<({ backgroundColor }: ChartComponentProps) => React.JSX.Element>;
 //# sourceMappingURL=chart-component.d.ts.map

package/dist/cjs/components/embeds/chart-component.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"chart-component.d.ts","sourceRoot":"","sources":["../../../../components/embeds/chart-component.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAe,MAAM,OAAO,CAAC;AAEpC,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,aAAa,CAAC;AACjD,OAAO,KAAK,EAAE,eAAe,EAAE,gBAAgB,EAAE,MAAM,wBAAwB,CAAC;AAEhF,MAAM,MAAM,mBAAmB,GAAG;IAChC,OAAO,EAAE,MAAM,CAAC;IAChB,KAAK,EAAE,aAAa,CAAC;IACrB,KAAK,EAAE,gBAAgB,CAAC;IACxB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;IACf,UAAU,EAAE,OAAO,CAAC;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,aAAa,EAAE,eAAe,CAAC,eAAe,CAAC,CAAC;CACjD,CAAC;AAEF,eAAO,MAAM,cAAc,kDACH,mBAAmB,uBAY1C,CAAC"}
+{"version":3,"file":"chart-component.d.ts","sourceRoot":"","sources":["../../../../components/embeds/chart-component.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAe,MAAM,OAAO,CAAC;AAEpC,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,aAAa,CAAC;AACjD,OAAO,KAAK,EAAE,eAAe,EAAE,gBAAgB,EAAE,MAAM,wBAAwB,CAAC;AAEhF,MAAM,MAAM,mBAAmB,GAAG;IAChC,OAAO,EAAE,MAAM,CAAC;IAChB,KAAK,EAAE,aAAa,CAAC;IACrB,KAAK,EAAE,gBAAgB,CAAC;IACxB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;IACf,UAAU,EAAE,OAAO,CAAC;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,aAAa,EAAE,eAAe,CAAC,eAAe,CAAC,CAAC;IAChD;;;OAGG;IACH,aAAa,CAAC,EAAE,eAAe,CAAC,eAAe,CAAC,CAAC;IACjD,sFAAsF;IACtF,WAAW,CAAC,EAAE,CAAC,OAAO,EAAE,aAAa,CAAC,SAAS,CAAC,KAAK,OAAO,CAAC;IAC7D,UAAU,CAAC,EAAE,CAAC,OAAO,EAAE,aAAa,CAAC,SAAS,CAAC,KAAK,OAAO,CAAC;IAC5D,YAAY,CAAC,EAAE,MAAM,OAAO,CAAC;IAC7B,gBAAgB,CAAC,EAAE,CACjB,OAAO,EAAE,aAAa,CAAC,SAAS,CAAC,KAC9B,aAAa,GAAG,SAAS,CAAC;IAC/B;;;;;OAKG;IACH,YAAY,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAChC,CAAC;AAEF,eAAO,MAAM,cAAc,kDACH,mBAAmB,uBAY1C,CAAC"}

package/dist/cjs/components/embeds/embed-draggable.d.ts

@@ -1,26 +1,46 @@
 import type { CellInterface } from "@rowsncolumns/grid";
 import React from "react";
 import type { DraggableBounds } from "react-draggable";
-type EmbedDraggableProps = Omit<React.HTMLAttributes<HTMLDivElement>, "id" | "onResize" | "children"> & {
+type EmbedDraggableProps = Omit<React.HTMLAttributes<HTMLDivElement>, "id" | "onResize" | "children" | "onCopy" | "onCut" | "onPaste" | "onDoubleClick"> & {
     id: string | number;
     height: number;
     width: number;
     offsetXPixels: number;
     offsetYPixels: number;
+    /**
+     * Second anchor of a "Move and size with cells" object: the cell its
+     * bottom-right corner sits in plus the pixel offsets into it. When set the
+     * frame spans the two anchors, so a column / row resize between them
+     * stretches it; `width` / `height` are the fallback size.
+     */
+    toCell?: CellInterface;
+    toOffsetXPixels?: number;
+    toOffsetYPixels?: number;
     isSelected: boolean;
     borderColor?: string;
     lockAspectRatio?: boolean;
+    /**
+     * Stacking rank among the sheet's floating objects (1 = back-most); the
+     * selected object is lifted above every unselected one.
+     */
+    zIndex?: number;
+    /**
+     * Rectangle (grid pixel space) the object must stay inside — the sheet
+     * body. Drags, nudges and resizes are clamped so no edge leaves it.
+     */
     bounds?: DraggableBounds;
     scale?: number;
     resizable?: boolean;
     draggable?: boolean;
     rotatable?: boolean;
     /**
-     * Callback when user moves an embed
+     * Callback when user moves an embed. `width` / `height` are the frame's
+     * on-screen size (grid pixel space), so the host can re-anchor its
+     * bottom-right corner too.
      * @param top
      * @param left
      */
-    onMove?(id: string | number, x: number, y: number): void;
+    onMove?(id: string | number, x: number, y: number, width: number, height: number): void;
     /**
      * Callback when user resizes
      * @param width
@@ -32,12 +52,49 @@ type EmbedDraggableProps = Omit<React.HTMLAttributes<HTMLDivElement>, "id" | "on
      * @param id
      */
     onDelete?(id: string | number): void;
+    /**
+     * Ctrl/Cmd + D while the embed has focus
+     * @param id
+     */
+    onDuplicate?(id: string | number): void;
+    /**
+     * Clipboard events while the embed has focus (the grid's cell editor
+     * never sees them — the focused embed is their target)
+     */
+    onCopy?(id: string | number, e: React.ClipboardEvent<HTMLDivElement>): void;
+    onCut?(id: string | number, e: React.ClipboardEvent<HTMLDivElement>): void;
+    onPaste?(id: string | number, e: React.ClipboardEvent<HTMLDivElement>): void;
+    /**
+     * Escape: drop the selection and hand focus back to the grid
+     * @param id
+     */
+    onDeselect?(id: string | number): void;
+    /**
+     * Double-click on the object (Excel opens the format pane; the chart
+     * editor here)
+     * @param id
+     */
+    onDoubleClick?(id: string | number): void;
+    /**
+     * Snap a point (grid pixel space) to the nearest cell corner. Alt-drag / Alt-resize
+     * snap through this; without it the modifier is inert.
+     */
+    snapToGrid?(x: number, y: number): {
+        x: number;
+        y: number;
+    } | undefined;
+    /**
+     * Right-click, Shift+F10 or the ContextMenu key on the object. Receives
+     * the viewport point the menu should open at and the object's element, so
+     * the host can return focus to it once the menu closes.
+     */
+    onRequestContextMenu?(id: string | number, clientX: number, clientY: number, element: HTMLDivElement): void;
     /**
      * Anchor cell
      */
     anchorCell: CellInterface;
     children: (width: number, height: number) => React.ReactNode;
 };
-export declare const EmbedDraggable: ({ id, scale, height, width, offsetXPixels, offsetYPixels, isSelected, borderColor, lockAspectRatio, resizable, draggable, children, onMove, onResize, onDelete, onMouseMove, onPointerDown, bounds, anchorCell, }: EmbedDraggableProps) => React.JSX.Element;
+export declare const EmbedDraggable: ({ id, scale, height, width, offsetXPixels, offsetYPixels, isSelected, borderColor, lockAspectRatio, zIndex, resizable, draggable, children, onMove, onResize, onDelete, onDuplicate, onCopy, onCut, onPaste, onDeselect, onDoubleClick, snapToGrid, onRequestContextMenu, onMouseMove, onPointerDown, bounds, anchorCell, toCell, toOffsetXPixels, toOffsetYPixels, }: EmbedDraggableProps) => React.JSX.Element;
 export {};
 //# sourceMappingURL=embed-draggable.d.ts.map

package/dist/cjs/components/embeds/embed-draggable.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"embed-draggable.d.ts","sourceRoot":"","sources":["../../../../components/embeds/embed-draggable.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,oBAAoB,CAAC;AAGxD,OAAO,KAAwC,MAAM,OAAO,CAAC;AAC7D,OAAO,KAAK,EACV,eAAe,EAGhB,MAAM,iBAAiB,CAAC;AAOzB,KAAK,mBAAmB,GAAG,IAAI,CAC7B,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,EACpC,IAAI,GAAG,UAAU,GAAG,UAAU,CAC/B,GAAG;IACF,EAAE,EAAE,MAAM,GAAG,MAAM,CAAC;IACpB,MAAM,EAAE,MAAM,CAAC;IACf,KAAK,EAAE,MAAM,CAAC;IACd,aAAa,EAAE,MAAM,CAAC;IACtB,aAAa,EAAE,MAAM,CAAC;IACtB,UAAU,EAAE,OAAO,CAAC;IACpB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,MAAM,CAAC,EAAE,eAAe,CAAC;IACzB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;;;OAIG;IACH,MAAM,CAAC,CAAC,EAAE,EAAE,MAAM,GAAG,MAAM,EAAE,CAAC,EAAE,MAAM,EAAE,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACzD;;;;OAIG;IACH,QAAQ,CAAC,CACP,EAAE,EAAE,MAAM,GAAG,MAAM,EACnB,CAAC,EAAE,MAAM,EACT,CAAC,EAAE,MAAM,EACT,KAAK,EAAE,MAAM,EACb,MAAM,EAAE,MAAM,GACb,IAAI,CAAC;IACR;;;OAGG;IACH,QAAQ,CAAC,CAAC,EAAE,EAAE,MAAM,GAAG,MAAM,GAAG,IAAI,CAAC;IACrC;;OAEG;IACH,UAAU,EAAE,aAAa,CAAC;IAC1B,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,KAAK,KAAK,CAAC,SAAS,CAAC;CAC9D,CAAC;AAoBF,eAAO,MAAM,cAAc,GAAI,mNAoB5B,mBAAmB,sBA6KrB,CAAC"}
+{"version":3,"file":"embed-draggable.d.ts","sourceRoot":"","sources":["../../../../components/embeds/embed-draggable.tsx"],"names":[],"mappings":"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"}

package/dist/cjs/components/embeds/embed-draggable.js

@@ -5,9 +5,34 @@ var tslib_1 = require("tslib");
 var grid_1 = require("@rowsncolumns/grid");
 var ui_1 = require("@rowsncolumns/ui");
 var react_1 = tslib_1.__importStar(require("react"));
-var react_draggable_1 = tslib_1.__importDefault(require("react-draggable"));
+var react_draggable_1 = require("react-draggable");
 var react_resizable_1 = require("react-resizable");
 var use_isomorphic_layout_effect_1 = require("../../hooks/use-isomorphic-layout-effect");
+/** Lifts the selected object over every unselected one (ranks count from 1 per object). */
+var SELECTED_Z_INDEX_LIFT = 100000;
+var ARROW_KEY_DELTAS = {
+    ArrowLeft: [-1, 0],
+    ArrowRight: [1, 0],
+    ArrowUp: [0, -1],
+    ArrowDown: [0, 1],
+};
+/** Excel nudges a selected object 1px per arrow press; Shift makes it a coarse step. */
+var NUDGE_STEP = 1;
+var NUDGE_STEP_SHIFT = 10;
+/** Corner handles are two letters ("ne"); edge handles one ("n"). */
+var isCornerHandle = function (handle) { return handle.length === 2; };
+/** Top-left corner that keeps a `width` × `height` object inside `bounds`; the top-left edges win when it does not fit. */
+var clampToBounds = function (x, y, width, height, bounds) {
+    var _a, _b, _c, _d;
+    return ({
+        x: Math.max((_a = bounds === null || bounds === void 0 ? void 0 : bounds.left) !== null && _a !== void 0 ? _a : -Infinity, Math.min(((_b = bounds === null || bounds === void 0 ? void 0 : bounds.right) !== null && _b !== void 0 ? _b : Infinity) - width, x)),
+        y: Math.max((_c = bounds === null || bounds === void 0 ? void 0 : bounds.top) !== null && _c !== void 0 ? _c : -Infinity, Math.min(((_d = bounds === null || bounds === void 0 ? void 0 : bounds.bottom) !== null && _d !== void 0 ? _d : Infinity) - height, y)),
+    });
+};
+/** Clamp one edge of a resize into `[min, max]`. */
+var clampEdge = function (value, min, max) {
+    return Math.min(max !== null && max !== void 0 ? max : Infinity, Math.max(min !== null && min !== void 0 ? min : -Infinity, value));
+};
 var resizeHandles = [
     "se",
     "n",
@@ -20,20 +45,39 @@ var resizeHandles = [
 ];
 var EmbedDraggable = function (_a) {
     var _b, _c;
-    var id = _a.id, _d = _a.scale, scale = _d === void 0 ? 1 : _d, height = _a.height, width = _a.width, offsetXPixels = _a.offsetXPixels, offsetYPixels = _a.offsetYPixels, isSelected = _a.isSelected, borderColor = _a.borderColor, lockAspectRatio = _a.lockAspectRatio, _e = _a.resizable, resizable = _e === void 0 ? true : _e, _f = _a.draggable, draggable = _f === void 0 ? true : _f, children = _a.children, onMove = _a.onMove, onResize = _a.onResize, onDelete = _a.onDelete, onMouseMove = _a.onMouseMove, onPointerDown = _a.onPointerDown, bounds = _a.bounds, anchorCell = _a.anchorCell;
+    var id = _a.id, _d = _a.scale, scale = _d === void 0 ? 1 : _d, height = _a.height, width = _a.width, offsetXPixels = _a.offsetXPixels, offsetYPixels = _a.offsetYPixels, isSelected = _a.isSelected, borderColor = _a.borderColor, lockAspectRatio = _a.lockAspectRatio, zIndex = _a.zIndex, _e = _a.resizable, resizable = _e === void 0 ? true : _e, _f = _a.draggable, draggable = _f === void 0 ? true : _f, children = _a.children, onMove = _a.onMove, onResize = _a.onResize, onDelete = _a.onDelete, onDuplicate = _a.onDuplicate, onCopy = _a.onCopy, onCut = _a.onCut, onPaste = _a.onPaste, onDeselect = _a.onDeselect, onDoubleClick = _a.onDoubleClick, snapToGrid = _a.snapToGrid, onRequestContextMenu = _a.onRequestContextMenu, onMouseMove = _a.onMouseMove, onPointerDown = _a.onPointerDown, bounds = _a.bounds, anchorCell = _a.anchorCell, toCell = _a.toCell, _g = _a.toOffsetXPixels, toOffsetXPixels = _g === void 0 ? 0 : _g, _h = _a.toOffsetYPixels, toOffsetYPixels = _h === void 0 ? 0 : _h;
     var getCellOffsetFromCoords = (0, grid_1.useGridContext)().getCellOffsetFromCoords;
     var position = getCellOffsetFromCoords === null || getCellOffsetFromCoords === void 0 ? void 0 : getCellOffsetFromCoords(anchorCell);
     var x = ((_b = position === null || position === void 0 ? void 0 : position.x) !== null && _b !== void 0 ? _b : 0) + offsetXPixels;
     var y = ((_c = position === null || position === void 0 ? void 0 : position.y) !== null && _c !== void 0 ? _c : 0) + offsetYPixels;
-    var _g = tslib_1.__read((0, react_1.useState)(function () { return ({
+    // Two anchors: the frame is whatever lies between them (a collapsed span
+    // after a delete draws nothing rather than a negative box)
+    var toPosition = toCell ? getCellOffsetFromCoords === null || getCellOffsetFromCoords === void 0 ? void 0 : getCellOffsetFromCoords(toCell) : undefined;
+    if (toPosition) {
+        width = Math.max(0, toPosition.x + toOffsetXPixels - x);
+        height = Math.max(0, toPosition.y + toOffsetYPixels - y);
+    }
+    var _j = tslib_1.__read((0, react_1.useState)(function () { return ({
         internalWidth: width,
         internalHeight: height,
         internalX: x,
         internalY: y,
-    }); }), 2), dimensions = _g[0], setDimensions = _g[1];
+    }); }), 2), dimensions = _j[0], setDimensions = _j[1];
     var internalWidth = dimensions.internalWidth, internalHeight = dimensions.internalHeight, internalX = dimensions.internalX, internalY = dimensions.internalY;
     var incomingDimensionRef = (0, react_1.useRef)(undefined);
     var nodeRef = (0, react_1.useRef)(null);
+    // Geometry currently on screen — what the end-of-gesture callbacks report, independent of
+    // whether the last `setDimensions` has rendered yet.
+    var appliedRef = (0, react_1.useRef)(dimensions);
+    // Where the pointer would have put the object with no snapping. The displayed geometry is
+    // derived from it on every event, so a snap never feeds back into the next pointer delta.
+    var gestureRef = (0, react_1.useRef)(dimensions);
+    // Shift on a corner handle keeps the aspect ratio for the rest of the gesture
+    var _k = tslib_1.__read((0, react_1.useState)(false), 2), shiftLocksAspectRatio = _k[0], setShiftLocksAspectRatio = _k[1];
+    var commit = (0, react_1.useCallback)(function (next) {
+        appliedRef.current = next;
+        setDimensions(next);
+    }, []);
     // Focus if selected index changes
     (0, use_isomorphic_layout_effect_1.useIsomorphicLayoutEffect)(function () {
         var _a, _b;
@@ -42,46 +86,139 @@ var EmbedDraggable = function (_a) {
             (_b = nodeRef.current) === null || _b === void 0 ? void 0 : _b.focus({ preventScroll: true });
         }
     }, [isSelected]);
-    // Handle move. Update internal state
-    var handleMove = (0, react_1.useCallback)(function (e, data) {
-        setDimensions(function (prev) { return (tslib_1.__assign(tslib_1.__assign({}, prev), { internalX: data.x, internalY: data.y })); });
+    // Starts moving
+    var handleMoveStart = (0, react_1.useCallback)(function (e) {
+        gestureRef.current = tslib_1.__assign({}, appliedRef.current);
+        if (e.altKey) {
+            // Alt+mousedown must not start a native selection / focus change
+            e.preventDefault();
+        }
     }, []);
+    // Handle move. Update internal state; Alt snaps the top-left corner to the cell grid
+    var handleMove = (0, react_1.useCallback)(function (e, data) {
+        var raw = gestureRef.current;
+        raw.internalX += data.deltaX;
+        raw.internalY += data.deltaY;
+        var _a = appliedRef.current, internalWidth = _a.internalWidth, internalHeight = _a.internalHeight;
+        var next = clampToBounds(raw.internalX, raw.internalY, internalWidth, internalHeight, bounds);
+        if (e.altKey && snapToGrid) {
+            var snapped = snapToGrid(next.x, next.y);
+            if (snapped) {
+                next = clampToBounds(snapped.x, snapped.y, internalWidth, internalHeight, bounds);
+            }
+        }
+        commit(tslib_1.__assign(tslib_1.__assign({}, appliedRef.current), { internalX: next.x, internalY: next.y }));
+    }, [bounds, snapToGrid, commit]);
     // Ends moving
-    var handleMoveEnd = (0, react_1.useCallback)(function (e, data) {
+    var handleMoveEnd = (0, react_1.useCallback)(function () {
         var _a, _b;
-        if (((_a = incomingDimensionRef.current) === null || _a === void 0 ? void 0 : _a.x) === data.x &&
-            ((_b = incomingDimensionRef.current) === null || _b === void 0 ? void 0 : _b.y) === data.y) {
+        var _c = appliedRef.current, internalX = _c.internalX, internalY = _c.internalY, internalWidth = _c.internalWidth, internalHeight = _c.internalHeight;
+        if (((_a = incomingDimensionRef.current) === null || _a === void 0 ? void 0 : _a.x) === internalX &&
+            ((_b = incomingDimensionRef.current) === null || _b === void 0 ? void 0 : _b.y) === internalY) {
             return;
         }
-        onMove === null || onMove === void 0 ? void 0 : onMove(id, data.x, data.y);
+        onMove === null || onMove === void 0 ? void 0 : onMove(id, internalX, internalY, internalWidth, internalHeight);
     }, [onMove, id]);
-    // Resizing: Update internal state
+    // Arrow keys nudge the object by whole pixels, clamped like a drag is
+    var handleNudge = (0, react_1.useCallback)(function (dx, dy) {
+        var _a = clampToBounds(internalX + dx, internalY + dy, internalWidth, internalHeight, bounds), nextX = _a.x, nextY = _a.y;
+        if (nextX === internalX && nextY === internalY) {
+            return;
+        }
+        commit(tslib_1.__assign(tslib_1.__assign({}, appliedRef.current), { internalX: nextX, internalY: nextY }));
+        onMove === null || onMove === void 0 ? void 0 : onMove(id, nextX, nextY, internalWidth, internalHeight);
+    }, [
+        bounds,
+        internalX,
+        internalY,
+        internalWidth,
+        internalHeight,
+        onMove,
+        id,
+        commit,
+    ]);
+    // Starts resizing
+    var handleResizeStart = (0, react_1.useCallback)(function (e, _a) {
+        var handle = _a.handle;
+        gestureRef.current = tslib_1.__assign({}, appliedRef.current);
+        setShiftLocksAspectRatio(isCornerHandle(handle) && Boolean(e.shiftKey));
+    }, []);
+    // Resizing: Update internal state; Alt snaps the dragged edges to the cell grid
     var handleResize = (0, react_1.useCallback)(function (e, _a) {
+        var _b, _c, _d, _e;
         var size = _a.size, handle = _a.handle;
-        setDimensions(function (prev) {
-            var internalY = prev.internalY;
-            var internalX = prev.internalX;
-            var deltaHeight = size.height - prev.internalHeight;
-            var deltaWidth = size.width - prev.internalWidth;
-            if (handle[0] === "n") {
-                internalY -= deltaHeight;
+        var _f = e, altKey = _f.altKey, shiftKey = _f.shiftKey;
+        setShiftLocksAspectRatio(isCornerHandle(handle) && Boolean(shiftKey));
+        // `size` is the rendered size (`dimensions`) plus this event's pointer delta
+        var deltaHeight = size.height - dimensions.internalHeight;
+        var deltaWidth = size.width - dimensions.internalWidth;
+        var raw = gestureRef.current;
+        var movesTop = handle[0] === "n";
+        var movesLeft = handle[handle.length - 1] === "w";
+        raw.internalWidth += deltaWidth;
+        raw.internalHeight += deltaHeight;
+        if (movesTop) {
+            raw.internalY -= deltaHeight;
+        }
+        if (movesLeft) {
+            raw.internalX -= deltaWidth;
+        }
+        var movesRight = handle[handle.length - 1] === "e";
+        var movesBottom = handle[0] === "s";
+        // The dragged edges stop at the sheet body; the opposite edges never move
+        var rawRight = raw.internalX + raw.internalWidth;
+        var rawBottom = raw.internalY + raw.internalHeight;
+        var left = movesLeft
+            ? clampEdge(raw.internalX, bounds === null || bounds === void 0 ? void 0 : bounds.left, undefined)
+            : raw.internalX;
+        var top = movesTop
+            ? clampEdge(raw.internalY, bounds === null || bounds === void 0 ? void 0 : bounds.top, undefined)
+            : raw.internalY;
+        var right = movesRight
+            ? clampEdge(rawRight, undefined, bounds === null || bounds === void 0 ? void 0 : bounds.right)
+            : rawRight;
+        var bottom = movesBottom
+            ? clampEdge(rawBottom, undefined, bounds === null || bounds === void 0 ? void 0 : bounds.bottom)
+            : rawBottom;
+        if (altKey && snapToGrid) {
+            var snappedLeft = movesLeft ? (_b = snapToGrid(left, top)) === null || _b === void 0 ? void 0 : _b.x : undefined;
+            var snappedRight = movesRight ? (_c = snapToGrid(right, top)) === null || _c === void 0 ? void 0 : _c.x : undefined;
+            var snappedTop = movesTop ? (_d = snapToGrid(left, top)) === null || _d === void 0 ? void 0 : _d.y : undefined;
+            var snappedBottom = movesBottom
+                ? (_e = snapToGrid(left, bottom)) === null || _e === void 0 ? void 0 : _e.y
+                : undefined;
+            // A snap that would collapse the object keeps the unsnapped edge
+            if (snappedLeft !== undefined && snappedLeft < right) {
+                left = snappedLeft;
+            }
+            if (snappedRight !== undefined && snappedRight > left) {
+                right = snappedRight;
+            }
+            if (snappedTop !== undefined && snappedTop < bottom) {
+                top = snappedTop;
             }
-            if (handle[handle.length - 1] === "w") {
-                internalX -= deltaWidth;
+            if (snappedBottom !== undefined && snappedBottom > top) {
+                bottom = snappedBottom;
             }
-            return tslib_1.__assign(tslib_1.__assign({}, prev), { internalX: internalX, internalY: internalY, internalHeight: size.height, internalWidth: size.width });
+        }
+        commit({
+            internalX: left,
+            internalY: top,
+            internalWidth: right - left,
+            internalHeight: bottom - top,
         });
-    }, []);
+    }, [dimensions, snapToGrid, commit]);
     // Resize ends
-    var handleResizeEnd = (0, react_1.useCallback)(function (e, _a) {
-        var _b, _c;
-        var size = _a.size;
-        if (((_b = incomingDimensionRef.current) === null || _b === void 0 ? void 0 : _b.width) === size.width &&
-            ((_c = incomingDimensionRef.current) === null || _c === void 0 ? void 0 : _c.height) === size.height) {
+    var handleResizeEnd = (0, react_1.useCallback)(function () {
+        var _a, _b;
+        setShiftLocksAspectRatio(false);
+        var _c = appliedRef.current, internalX = _c.internalX, internalY = _c.internalY, internalWidth = _c.internalWidth, internalHeight = _c.internalHeight;
+        if (((_a = incomingDimensionRef.current) === null || _a === void 0 ? void 0 : _a.width) === internalWidth &&
+            ((_b = incomingDimensionRef.current) === null || _b === void 0 ? void 0 : _b.height) === internalHeight) {
             return;
         }
-        onResize === null || onResize === void 0 ? void 0 : onResize(id, dimensions.internalX, dimensions.internalY, size.width / scale, size.height / scale);
-    }, [onResize, id, scale, dimensions]);
+        onResize === null || onResize === void 0 ? void 0 : onResize(id, internalX, internalY, internalWidth / scale, internalHeight / scale);
+    }, [onResize, id, scale]);
     // When state is saved, update internal state
     (0, use_isomorphic_layout_effect_1.useIsomorphicLayoutEffect)(function () {
         incomingDimensionRef.current = {
@@ -90,29 +227,67 @@ var EmbedDraggable = function (_a) {
             width: width,
             height: height,
         };
-        setDimensions({
+        commit({
             internalX: x,
             internalY: y,
             internalHeight: height,
             internalWidth: width,
         });
-    }, [width, height, x, y]);
-    return (react_1.default.createElement(react_draggable_1.default, { nodeRef: nodeRef, position: {
-            x: internalX,
-            y: internalY,
-        }, bounds: bounds, onDrag: handleMove, onStop: handleMoveEnd, cancel: ".react-resizable-handle, .rnc-draggable-ignore, .plot-container .draglayer", scale: 1, disabled: !draggable },
-        react_1.default.createElement(react_resizable_1.Resizable, { width: internalWidth, height: internalHeight, onResize: handleResize, onResizeStop: handleResizeEnd, lockAspectRatio: lockAspectRatio, resizeHandles: resizable ? resizeHandles : [] },
+    }, [width, height, x, y, commit]);
+    return (react_1.default.createElement(react_draggable_1.DraggableCore, { nodeRef: nodeRef, onStart: handleMoveStart, onDrag: handleMove, onStop: handleMoveEnd, cancel: ".react-resizable-handle, .rnc-draggable-ignore", scale: 1, disabled: !draggable },
+        react_1.default.createElement(react_resizable_1.Resizable, { width: internalWidth, height: internalHeight, onResizeStart: handleResizeStart, onResize: handleResize, onResizeStop: handleResizeEnd, lockAspectRatio: lockAspectRatio || shiftLocksAspectRatio, resizeHandles: resizable ? resizeHandles : [] },
             react_1.default.createElement("div", { className: (0, ui_1.cn)("text-rnc-foreground text-sm pointer-events-auto border border-solid border-transparent flex select-none box-content absolute rnc-embed-component outline-none", isSelected ? "[&_.react-resizable-handle]:bg-[#1a73e8]" : undefined, isSelected ? "rnc-embed-active" : undefined), style: {
                     width: internalWidth,
                     height: internalHeight,
+                    transform: "translate(".concat(internalX, "px, ").concat(internalY, "px)"),
                     borderColor: borderColor,
-                    zIndex: isSelected ? 1 : undefined,
+                    zIndex: isSelected
+                        ? (zIndex !== null && zIndex !== void 0 ? zIndex : 0) + SELECTED_Z_INDEX_LIFT
+                        : zIndex,
                 }, tabIndex: 0, onKeyDown: function (e) {
                     if (e.key === "Backspace" || e.key === "Delete") {
                         onDelete === null || onDelete === void 0 ? void 0 : onDelete(id);
+                        return;
                     }
-                }, ref: nodeRef, onMouseMove: onMouseMove, onPointerDown: onPointerDown, onContextMenu: function (e) {
+                    if ((e.metaKey || e.ctrlKey) &&
+                        !e.altKey &&
+                        !e.shiftKey &&
+                        e.key.toLowerCase() === "d" &&
+                        onDuplicate) {
+                        e.preventDefault();
+                        onDuplicate(id);
+                        return;
+                    }
+                    if (e.key === "Escape") {
+                        e.preventDefault();
+                        onDeselect === null || onDeselect === void 0 ? void 0 : onDeselect(id);
+                        return;
+                    }
+                    if (e.key === "Alt") {
+                        // Alt is a snap modifier here; keep it from opening the browser menu bar
+                        e.preventDefault();
+                        return;
+                    }
+                    var delta = ARROW_KEY_DELTAS[e.key];
+                    if (delta && draggable) {
+                        // The grid must not scroll while the object is being nudged
+                        e.preventDefault();
+                        var step = e.shiftKey ? NUDGE_STEP_SHIFT : NUDGE_STEP;
+                        handleNudge(delta[0] * step, delta[1] * step);
+                        return;
+                    }
+                    if (e.key === "ContextMenu" || (e.key === "F10" && e.shiftKey)) {
+                        e.preventDefault();
+                        var rect = e.currentTarget.getBoundingClientRect();
+                        onRequestContextMenu === null || onRequestContextMenu === void 0 ? void 0 : onRequestContextMenu(id, rect.left, rect.top, e.currentTarget);
+                    }
+                }, onCopy: onCopy ? function (e) { return onCopy(id, e); } : undefined, onCut: onCut ? function (e) { return onCut(id, e); } : undefined, onPaste: onPaste ? function (e) { return onPaste(id, e); } : undefined, ref: nodeRef, onMouseMove: onMouseMove, onPointerDown: onPointerDown, onDoubleClick: onDoubleClick ? function () { return onDoubleClick(id); } : undefined, onContextMenu: function (e) {
                     e.stopPropagation();
+                    if (!onRequestContextMenu) {
+                        return;
+                    }
+                    e.preventDefault();
+                    onRequestContextMenu(id, e.clientX, e.clientY, e.currentTarget);
                 } }, children(internalWidth, internalHeight)))));
 };
 exports.EmbedDraggable = EmbedDraggable;

package/dist/cjs/components/filter-box/date-tree.d.ts

@@ -0,0 +1,28 @@
+/**
+ * Excel groups a date column's AutoFilter checklist into a Year → Month → Day
+ * tree with tri-state parents. The checklist only knows each cell's DISPLAYED
+ * text, so a value is treated as a date when it parses as one AND looks like
+ * one — digits separated by `/ - .` or a month name — which keeps plain
+ * numbers ("2026") and text out. The tree is built only when every non-blank
+ * value in the column is such a date (a mixed column stays a flat list, as a
+ * text column would). Newest first at every level, matching Excel.
+ */
+export type DateTreeNode = {
+    /** Stable key: `y:2026`, `m:2026-09`, `d:2026-09-29`. */
+    key: string;
+    label: string;
+    /** Every checklist value (display text) under this node. */
+    values: string[];
+    children?: DateTreeNode[];
+};
+/** The calendar date a checklist value displays, or `undefined` when it is not a date. */
+export declare const parseFilterDateValue: (value: string) => Date | undefined;
+/**
+ * Year → Month → Day nodes for `values`, or `undefined` when the column is
+ * not a date column. `blankLabel` (the "(Blanks)" entry) is skipped; callers
+ * render it beside the tree.
+ */
+export declare const buildDateTree: (values: readonly string[], blankLabel: string) => DateTreeNode[] | undefined;
+/** `true` all checked, `false` none, `"mixed"` some — the tri-state of a node or the whole list. */
+export declare const triState: (values: readonly string[], isVisible: (value: string) => boolean) => boolean | "mixed";
+//# sourceMappingURL=date-tree.d.ts.map

package/dist/cjs/components/filter-box/date-tree.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"date-tree.d.ts","sourceRoot":"","sources":["../../../../components/filter-box/date-tree.ts"],"names":[],"mappings":"AAAA;;;;;;;;GAQG;AAEH,MAAM,MAAM,YAAY,GAAG;IACzB,yDAAyD;IACzD,GAAG,EAAE,MAAM,CAAC;IACZ,KAAK,EAAE,MAAM,CAAC;IACd,4DAA4D;IAC5D,MAAM,EAAE,MAAM,EAAE,CAAC;IACjB,QAAQ,CAAC,EAAE,YAAY,EAAE,CAAC;CAC3B,CAAC;AAqBF,0FAA0F;AAC1F,eAAO,MAAM,oBAAoB,GAAI,OAAO,MAAM,KAAG,IAAI,GAAG,SAS3D,CAAC;AAEF;;;;GAIG;AACH,eAAO,MAAM,aAAa,GACxB,QAAQ,SAAS,MAAM,EAAE,EACzB,YAAY,MAAM,KACjB,YAAY,EAAE,GAAG,SAgDnB,CAAC;AAEF,oGAAoG;AACpG,eAAO,MAAM,QAAQ,GACnB,QAAQ,SAAS,MAAM,EAAE,EACzB,WAAW,CAAC,KAAK,EAAE,MAAM,KAAK,OAAO,KACpC,OAAO,GAAG,OAOZ,CAAC"}