@rowsncolumns/spreadsheet 10.2.74 → 10.2.76

package/dist/cjs/components/toolbar/fill-selectors.d.ts

@@ -0,0 +1,49 @@
+import React from "react";
+import type { CellFormat, FillPattern, GradientFill } from "../../types";
+import type { SpreadsheetTheme } from "../canvas-grid/typings";
+/** The fill-related slice of a cell format the fill popover authors. */
+export type CellFill = Pick<CellFormat, "backgroundColor" | "fillPattern" | "foregroundColor" | "gradient">;
+/** Excel's Format Cells → Fill → Pattern Style menu, in Excel's order. */
+export declare const FILL_PATTERN_OPTIONS: ReadonlyArray<{
+    pattern: FillPattern;
+    label: string;
+}>;
+/**
+ * Excel's Fill Effects → Shading styles. `degree` follows OOXML
+ * `<gradientFill degree>`: 0 runs left → right, 90 top → bottom.
+ */
+export declare const GRADIENT_PRESETS: ReadonlyArray<{
+    label: string;
+    gradient: Omit<GradientFill, "stops">;
+}>;
+/** Two-stop gradient from a preset and two colours. */
+export declare const buildGradientFill: (preset: Omit<GradientFill, "stops">, color1: string, color2: string) => GradientFill;
+/**
+ * CSS preview of a gradient fill. OOXML measures the linear angle from the
+ * left→right axis; CSS from the bottom→top axis, so CSS = degree + 90.
+ */
+export declare const gradientToCss: (gradient: GradientFill) => string;
+export type PatternFillPickerProps = {
+    fill?: CellFill | null;
+    theme: SpreadsheetTheme;
+    onChangeFill(fill: CellFill): void;
+};
+/**
+ * Pattern fill authoring (Excel: Format Cells → Fill → Pattern Color /
+ * Pattern Style). The pattern paints in `foregroundColor` over the solid
+ * `backgroundColor`; a gradient on the cell is cleared, as Excel treats the
+ * two as exclusive.
+ */
+export declare const PatternFillPicker: ({ fill, theme, onChangeFill, }: PatternFillPickerProps) => React.JSX.Element;
+export type GradientFillPickerProps = {
+    fill?: CellFill | null;
+    theme: SpreadsheetTheme;
+    onChangeFill(fill: CellFill): void;
+};
+/**
+ * Gradient fill authoring (Excel: Fill Effects → Gradient, two colours +
+ * shading style). Picking a style applies immediately with the two colours;
+ * changing a colour re-applies when the cell already has a gradient.
+ */
+export declare const GradientFillPicker: ({ fill, theme, onChangeFill, }: GradientFillPickerProps) => React.JSX.Element;
+//# sourceMappingURL=fill-selectors.d.ts.map

package/dist/cjs/components/toolbar/fill-selectors.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"fill-selectors.d.ts","sourceRoot":"","sources":["../../../../components/toolbar/fill-selectors.tsx"],"names":[],"mappings":"AACA,OAAO,KAA4B,MAAM,OAAO,CAAC;AAIjD,OAAO,KAAK,EAAE,UAAU,EAAE,WAAW,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AACzE,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,wBAAwB,CAAC;AAE/D,wEAAwE;AACxE,MAAM,MAAM,QAAQ,GAAG,IAAI,CACzB,UAAU,EACV,iBAAiB,GAAG,aAAa,GAAG,iBAAiB,GAAG,UAAU,CACnE,CAAC;AAEF,0EAA0E;AAC1E,eAAO,MAAM,oBAAoB,EAAE,aAAa,CAAC;IAC/C,OAAO,EAAE,WAAW,CAAC;IACrB,KAAK,EAAE,MAAM,CAAC;CACf,CAkBA,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,gBAAgB,EAAE,aAAa,CAAC;IAC3C,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,IAAI,CAAC,YAAY,EAAE,OAAO,CAAC,CAAC;CACvC,CASA,CAAC;AAEF,uDAAuD;AACvD,eAAO,MAAM,iBAAiB,GAC5B,QAAQ,IAAI,CAAC,YAAY,EAAE,OAAO,CAAC,EACnC,QAAQ,MAAM,EACd,QAAQ,MAAM,KACb,YAMD,CAAC;AAEH;;;GAGG;AACH,eAAO,MAAM,aAAa,GAAI,UAAU,YAAY,KAAG,MAUtD,CAAC;AAqCF,MAAM,MAAM,sBAAsB,GAAG;IACnC,IAAI,CAAC,EAAE,QAAQ,GAAG,IAAI,CAAC;IACvB,KAAK,EAAE,gBAAgB,CAAC;IACxB,YAAY,CAAC,IAAI,EAAE,QAAQ,GAAG,IAAI,CAAC;CACpC,CAAC;AAEF;;;;;GAKG;AACH,eAAO,MAAM,iBAAiB,GAAI,gCAI/B,sBAAsB,sBA+ExB,CAAC;AAEF,MAAM,MAAM,uBAAuB,GAAG;IACpC,IAAI,CAAC,EAAE,QAAQ,GAAG,IAAI,CAAC;IACvB,KAAK,EAAE,gBAAgB,CAAC;IACxB,YAAY,CAAC,IAAI,EAAE,QAAQ,GAAG,IAAI,CAAC;CACpC,CAAC;AAEF;;;;GAIG;AACH,eAAO,MAAM,kBAAkB,GAAI,gCAIhC,uBAAuB,sBA8FzB,CAAC"}

package/dist/cjs/components/toolbar/fill-selectors.js

@@ -0,0 +1,196 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.GradientFillPicker = exports.PatternFillPicker = exports.gradientToCss = exports.buildGradientFill = exports.GRADIENT_PRESETS = exports.FILL_PATTERN_OPTIONS = void 0;
+var tslib_1 = require("tslib");
+var ui_1 = require("@rowsncolumns/ui");
+var react_1 = tslib_1.__importStar(require("react"));
+var fill_patterns_1 = require("../../api/fill-patterns");
+var themes_1 = require("../../themes");
+/** Excel's Format Cells → Fill → Pattern Style menu, in Excel's order. */
+exports.FILL_PATTERN_OPTIONS = [
+    { pattern: "gray0625", label: "6.25% Gray" },
+    { pattern: "gray125", label: "12.5% Gray" },
+    { pattern: "lightGray", label: "25% Gray" },
+    { pattern: "mediumGray", label: "50% Gray" },
+    { pattern: "darkGray", label: "75% Gray" },
+    { pattern: "darkHorizontal", label: "Horizontal Stripe" },
+    { pattern: "darkVertical", label: "Vertical Stripe" },
+    { pattern: "darkDown", label: "Reverse Diagonal Stripe" },
+    { pattern: "darkUp", label: "Diagonal Stripe" },
+    { pattern: "darkGrid", label: "Diagonal Crosshatch" },
+    { pattern: "darkTrellis", label: "Thick Diagonal Crosshatch" },
+    { pattern: "lightHorizontal", label: "Thin Horizontal Stripe" },
+    { pattern: "lightVertical", label: "Thin Vertical Stripe" },
+    { pattern: "lightDown", label: "Thin Reverse Diagonal Stripe" },
+    { pattern: "lightUp", label: "Thin Diagonal Stripe" },
+    { pattern: "lightGrid", label: "Thin Horizontal Crosshatch" },
+    { pattern: "lightTrellis", label: "Thin Diagonal Crosshatch" },
+];
+/**
+ * Excel's Fill Effects → Shading styles. `degree` follows OOXML
+ * `<gradientFill degree>`: 0 runs left → right, 90 top → bottom.
+ */
+exports.GRADIENT_PRESETS = [
+    { label: "Horizontal", gradient: { type: "linear", degree: 90 } },
+    { label: "Vertical", gradient: { type: "linear", degree: 0 } },
+    { label: "Diagonal up", gradient: { type: "linear", degree: 45 } },
+    { label: "Diagonal down", gradient: { type: "linear", degree: 135 } },
+    {
+        label: "From center",
+        gradient: { type: "path", left: 0.5, right: 0.5, top: 0.5, bottom: 0.5 },
+    },
+];
+/** Two-stop gradient from a preset and two colours. */
+var buildGradientFill = function (preset, color1, color2) { return (tslib_1.__assign(tslib_1.__assign({}, preset), { stops: [
+        { position: 0, color: color1 },
+        { position: 1, color: color2 },
+    ] })); };
+exports.buildGradientFill = buildGradientFill;
+/**
+ * CSS preview of a gradient fill. OOXML measures the linear angle from the
+ * left→right axis; CSS from the bottom→top axis, so CSS = degree + 90.
+ */
+var gradientToCss = function (gradient) {
+    var _a;
+    var stops = gradient.stops
+        .slice()
+        .sort(function (a, b) { return a.position - b.position; })
+        .map(function (stop) { return "".concat(stop.color, " ").concat(Math.round(stop.position * 100), "%"); })
+        .join(", ");
+    if (gradient.type === "path") {
+        return "radial-gradient(circle, ".concat(stops, ")");
+    }
+    return "linear-gradient(".concat((((_a = gradient.degree) !== null && _a !== void 0 ? _a : 0) + 90) % 360, "deg, ").concat(stops, ")");
+};
+exports.gradientToCss = gradientToCss;
+var DEFAULT_PATTERN_COLOR = "#000000";
+var PatternSwatch = function (_a) {
+    var pattern = _a.pattern, foregroundColor = _a.foregroundColor, backgroundColor = _a.backgroundColor, label = _a.label;
+    var url = (0, react_1.useMemo)(function () {
+        var _a;
+        var canvas = (0, fill_patterns_1.getPatternCanvas)(pattern, foregroundColor, backgroundColor);
+        try {
+            return (_a = canvas === null || canvas === void 0 ? void 0 : canvas.toDataURL()) !== null && _a !== void 0 ? _a : undefined;
+        }
+        catch (_b) {
+            return undefined;
+        }
+    }, [pattern, foregroundColor, backgroundColor]);
+    return (react_1.default.createElement("span", { "aria-hidden": "true", className: "block w-full h-full border border-solid border-rnc-border", style: url
+            ? { backgroundImage: "url(".concat(url, ")"), backgroundRepeat: "repeat" }
+            : { backgroundColor: backgroundColor }, title: label }));
+};
+/**
+ * Pattern fill authoring (Excel: Format Cells → Fill → Pattern Color /
+ * Pattern Style). The pattern paints in `foregroundColor` over the solid
+ * `backgroundColor`; a gradient on the cell is cleared, as Excel treats the
+ * two as exclusive.
+ */
+var PatternFillPicker = function (_a) {
+    var fill = _a.fill, theme = _a.theme, onChangeFill = _a.onChangeFill;
+    var background = (fill === null || fill === void 0 ? void 0 : fill.backgroundColor)
+        ? (0, themes_1.getStringifiedColor)(fill.backgroundColor, theme)
+        : undefined;
+    var patternColor = (fill === null || fill === void 0 ? void 0 : fill.foregroundColor)
+        ? (0, themes_1.getStringifiedColor)(fill.foregroundColor, theme)
+        : DEFAULT_PATTERN_COLOR;
+    var activePattern = (fill === null || fill === void 0 ? void 0 : fill.fillPattern) &&
+        fill.fillPattern !== "none" &&
+        fill.fillPattern !== "solid"
+        ? fill.fillPattern
+        : undefined;
+    var apply = function (pattern, foregroundColor) {
+        var _a;
+        return onChangeFill({
+            backgroundColor: (_a = fill === null || fill === void 0 ? void 0 : fill.backgroundColor) !== null && _a !== void 0 ? _a : undefined,
+            fillPattern: pattern,
+            foregroundColor: pattern ? foregroundColor : undefined,
+            gradient: undefined,
+        });
+    };
+    return (react_1.default.createElement(ui_1.Stack, { direction: "vertical", className: "gap-1" },
+        react_1.default.createElement(ui_1.Button, { variant: "outline", size: "xs", tabIndex: -1, className: "justify-center py-1", onClick: function () { return apply(undefined, undefined); } }, "No pattern"),
+        react_1.default.createElement("div", { className: "pt-2 text-xs text-left" }, "Pattern style"),
+        react_1.default.createElement("div", { role: "group", "aria-label": "Pattern style", className: "grid grid-cols-6 gap-1" }, exports.FILL_PATTERN_OPTIONS.map(function (_a) {
+            var pattern = _a.pattern, label = _a.label;
+            return (react_1.default.createElement("button", { type: "button", key: pattern, "aria-label": label, "aria-pressed": activePattern === pattern, className: "w-6 h-6 p-0 border-2 border-solid rounded-sm bg-transparent cursor-pointer ".concat(activePattern === pattern
+                    ? "border-rnc-primary"
+                    : "border-transparent"), onClick: function () {
+                    return apply(pattern, (fill === null || fill === void 0 ? void 0 : fill.foregroundColor) ? patternColor : undefined);
+                } },
+                react_1.default.createElement(PatternSwatch, { pattern: pattern, foregroundColor: patternColor, backgroundColor: background, label: label })));
+        })),
+        react_1.default.createElement("div", { className: "pt-2 text-xs text-left" }, "Pattern color"),
+        react_1.default.createElement(ui_1.ColorPicker, { value: patternColor, colors: themes_1.STANDARD_COLORS, onChange: function (color) { return apply(activePattern !== null && activePattern !== void 0 ? activePattern : "darkGray", color); }, className: "gap-1" }),
+        react_1.default.createElement("div", { className: "flex items-center gap-1" },
+            react_1.default.createElement(ui_1.HexColorPicker, { value: patternColor, onChange: function (color) { return apply(activePattern !== null && activePattern !== void 0 ? activePattern : "darkGray", color); } }))));
+};
+exports.PatternFillPicker = PatternFillPicker;
+/**
+ * Gradient fill authoring (Excel: Fill Effects → Gradient, two colours +
+ * shading style). Picking a style applies immediately with the two colours;
+ * changing a colour re-applies when the cell already has a gradient.
+ */
+var GradientFillPicker = function (_a) {
+    var _b;
+    var fill = _a.fill, theme = _a.theme, onChangeFill = _a.onChangeFill;
+    var existing = (_b = fill === null || fill === void 0 ? void 0 : fill.gradient) !== null && _b !== void 0 ? _b : undefined;
+    var _c = tslib_1.__read((0, react_1.useState)(function () {
+        var _a, _b, _c;
+        return (_c = (_b = (_a = existing === null || existing === void 0 ? void 0 : existing.stops) === null || _a === void 0 ? void 0 : _a[0]) === null || _b === void 0 ? void 0 : _b.color) !== null && _c !== void 0 ? _c : ((fill === null || fill === void 0 ? void 0 : fill.backgroundColor)
+            ? (0, themes_1.getStringifiedColor)(fill.backgroundColor, theme)
+            : "#FFFFFF");
+    }), 2), color1 = _c[0], setColor1 = _c[1];
+    var _d = tslib_1.__read((0, react_1.useState)(function () { var _a, _b, _c; return (_c = (_b = (_a = existing === null || existing === void 0 ? void 0 : existing.stops) === null || _a === void 0 ? void 0 : _a[existing.stops.length - 1]) === null || _b === void 0 ? void 0 : _b.color) !== null && _c !== void 0 ? _c : "#4472C4"; }), 2), color2 = _d[0], setColor2 = _d[1];
+    var apply = function (preset, c1, c2) {
+        if (c1 === void 0) { c1 = color1; }
+        if (c2 === void 0) { c2 = color2; }
+        return onChangeFill({
+            backgroundColor: undefined,
+            fillPattern: undefined,
+            foregroundColor: undefined,
+            gradient: (0, exports.buildGradientFill)(preset, c1, c2),
+        });
+    };
+    var reapply = function (c1, c2) {
+        if (!existing)
+            return;
+        var _stops = existing.stops, preset = tslib_1.__rest(existing, ["stops"]);
+        apply(preset, c1, c2);
+    };
+    var isActive = function (preset) {
+        var _a, _b;
+        return !!existing &&
+            existing.type === preset.type &&
+            (preset.type === "path" || ((_a = existing.degree) !== null && _a !== void 0 ? _a : 0) === ((_b = preset.degree) !== null && _b !== void 0 ? _b : 0));
+    };
+    return (react_1.default.createElement(ui_1.Stack, { direction: "vertical", className: "gap-1" },
+        react_1.default.createElement(ui_1.Button, { variant: "outline", size: "xs", tabIndex: -1, className: "justify-center py-1", onClick: function () {
+                var _a, _b, _c;
+                return onChangeFill({
+                    backgroundColor: (_a = fill === null || fill === void 0 ? void 0 : fill.backgroundColor) !== null && _a !== void 0 ? _a : undefined,
+                    fillPattern: (_b = fill === null || fill === void 0 ? void 0 : fill.fillPattern) !== null && _b !== void 0 ? _b : undefined,
+                    foregroundColor: (_c = fill === null || fill === void 0 ? void 0 : fill.foregroundColor) !== null && _c !== void 0 ? _c : undefined,
+                    gradient: undefined,
+                });
+            } }, "No gradient"),
+        react_1.default.createElement("div", { className: "grid grid-cols-[auto_1fr] items-center gap-2 pt-2 text-xs" },
+            react_1.default.createElement("span", null, "Color 1"),
+            react_1.default.createElement(ui_1.HexColorPicker, { value: color1, onChange: function (color) {
+                    setColor1(color);
+                    reapply(color, color2);
+                } }),
+            react_1.default.createElement("span", null, "Color 2"),
+            react_1.default.createElement(ui_1.HexColorPicker, { value: color2, onChange: function (color) {
+                    setColor2(color);
+                    reapply(color1, color);
+                } })),
+        react_1.default.createElement("div", { className: "pt-2 text-xs text-left" }, "Shading style"),
+        react_1.default.createElement("div", { role: "group", "aria-label": "Shading style", className: "grid grid-cols-5 gap-1" }, exports.GRADIENT_PRESETS.map(function (_a) {
+            var label = _a.label, gradient = _a.gradient;
+            return (react_1.default.createElement("button", { type: "button", key: label, "aria-label": label, "aria-pressed": isActive(gradient), className: "w-8 h-6 p-0 border-2 border-solid rounded-sm cursor-pointer ".concat(isActive(gradient) ? "border-rnc-primary" : "border-rnc-border"), style: {
+                    backgroundImage: (0, exports.gradientToCss)((0, exports.buildGradientFill)(gradient, color1, color2)),
+                }, onClick: function () { return apply(gradient); } }));
+        }))));
+};
+exports.GradientFillPicker = GradientFillPicker;

package/dist/cjs/components/toolbar/index.d.ts

@@ -4,6 +4,7 @@ export * from "./scale-selector";
 export * from "./font-size-selector";
 export * from "./text-color-selector";
 export * from "./background-color-selector";
+export * from "./fill-selectors";
 export * from "./merge-cells-selector";
 export * from "./border-selector";
 export * from "./font-family-selector";

package/dist/cjs/components/toolbar/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../components/toolbar/index.tsx"],"names":[],"mappings":"AAAA,cAAc,WAAW,CAAC;AAC1B,cAAc,WAAW,CAAC;AAC1B,cAAc,kBAAkB,CAAC;AACjC,cAAc,sBAAsB,CAAC;AACrC,cAAc,uBAAuB,CAAC;AACtC,cAAc,6BAA6B,CAAC;AAC5C,cAAc,wBAAwB,CAAC;AACvC,cAAc,mBAAmB,CAAC;AAClC,cAAc,wBAAwB,CAAC;AACvC,cAAc,kCAAkC,CAAC;AACjD,cAAc,gCAAgC,CAAC;AAC/C,cAAc,sBAAsB,CAAC;AACrC,cAAc,0BAA0B,CAAC;AACzC,cAAc,wBAAwB,CAAC;AACvC,cAAc,kBAAkB,CAAC;AACjC,cAAc,iBAAiB,CAAC;AAChC,cAAc,uBAAuB,CAAC;AACtC,cAAc,wBAAwB,CAAC;AACvC,cAAc,yBAAyB,CAAC;AACxC,cAAc,kBAAkB,CAAC;AACjC,cAAc,6BAA6B,CAAC;AAC5C,cAAc,2BAA2B,CAAC;AAC1C,cAAc,eAAe,CAAC;AAC9B,cAAc,aAAa,CAAC;AAC5B,cAAc,SAAS,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../components/toolbar/index.tsx"],"names":[],"mappings":"AAAA,cAAc,WAAW,CAAC;AAC1B,cAAc,WAAW,CAAC;AAC1B,cAAc,kBAAkB,CAAC;AACjC,cAAc,sBAAsB,CAAC;AACrC,cAAc,uBAAuB,CAAC;AACtC,cAAc,6BAA6B,CAAC;AAC5C,cAAc,kBAAkB,CAAC;AACjC,cAAc,wBAAwB,CAAC;AACvC,cAAc,mBAAmB,CAAC;AAClC,cAAc,wBAAwB,CAAC;AACvC,cAAc,kCAAkC,CAAC;AACjD,cAAc,gCAAgC,CAAC;AAC/C,cAAc,sBAAsB,CAAC;AACrC,cAAc,0BAA0B,CAAC;AACzC,cAAc,wBAAwB,CAAC;AACvC,cAAc,kBAAkB,CAAC;AACjC,cAAc,iBAAiB,CAAC;AAChC,cAAc,uBAAuB,CAAC;AACtC,cAAc,wBAAwB,CAAC;AACvC,cAAc,yBAAyB,CAAC;AACxC,cAAc,kBAAkB,CAAC;AACjC,cAAc,6BAA6B,CAAC;AAC5C,cAAc,2BAA2B,CAAC;AAC1C,cAAc,eAAe,CAAC;AAC9B,cAAc,aAAa,CAAC;AAC5B,cAAc,SAAS,CAAC"}

package/dist/cjs/components/toolbar/index.js

@@ -7,6 +7,7 @@ tslib_1.__exportStar(require("./scale-selector"), exports);
 tslib_1.__exportStar(require("./font-size-selector"), exports);
 tslib_1.__exportStar(require("./text-color-selector"), exports);
 tslib_1.__exportStar(require("./background-color-selector"), exports);
+tslib_1.__exportStar(require("./fill-selectors"), exports);
 tslib_1.__exportStar(require("./merge-cells-selector"), exports);
 tslib_1.__exportStar(require("./border-selector"), exports);
 tslib_1.__exportStar(require("./font-family-selector"), exports);

package/dist/cjs/components/toolbar/text-format-selector.d.ts

@@ -1,5 +1,14 @@
 import React from "react";
 import type { CellFormat } from "../../types";
+/**
+ * What the toolbar's "General" item writes to the cell. "General" must be an
+ * EXPLICIT format, not the absence of one: a `=DATE()` cell with no
+ * `numberFormat` derives a date format at paint time in both engines, so
+ * emitting `undefined` here left the cell showing `2/29/1900` after the user
+ * chose General (rowsncolumns/spreadsheet#642 B-05). Excel stamps numFmtId 0
+ * and shows the serial.
+ */
+export declare const GENERAL_NUMBER_FORMAT: NonNullable<CellFormat["numberFormat"]>;
 export type TextFormatSelectorProps = {
     /**
      * Current cell format

package/dist/cjs/components/toolbar/text-format-selector.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"text-format-selector.d.ts","sourceRoot":"","sources":["../../../../components/toolbar/text-format-selector.tsx"],"names":[],"mappings":"AAyBA,OAAO,KAAe,MAAM,OAAO,CAAC;AAIpC,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AAE9C,MAAM,MAAM,uBAAuB,GAAG;IACpC;;OAEG;IACH,UAAU,CAAC,EAAE,UAAU,GAAG,IAAI,CAAC;IAC/B;;;OAGG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB;;;;OAIG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,kBAAkB,EAAE,CAAC,CAAC,SAAS,MAAM,UAAU,EAC7C,IAAI,EAAE,CAAC,EACP,KAAK,EAAE,UAAU,CAAC,CAAC,CAAC,KACjB,IAAI,CAAC;IACV,oBAAoB,CAAC,IAAI,IAAI,CAAC;CAC/B,CAAC;AAEF,eAAO,MAAM,kBAAkB,0GAO1B,uBAAuB,uBAqY3B,CAAC"}
+{"version":3,"file":"text-format-selector.d.ts","sourceRoot":"","sources":["../../../../components/toolbar/text-format-selector.tsx"],"names":[],"mappings":"AAyBA,OAAO,KAAe,MAAM,OAAO,CAAC;AAIpC,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AAE9C;;;;;;;GAOG;AACH,eAAO,MAAM,qBAAqB,EAAE,WAAW,CAAC,UAAU,CAAC,cAAc,CAAC,CAIvE,CAAC;AAEJ,MAAM,MAAM,uBAAuB,GAAG;IACpC;;OAEG;IACH,UAAU,CAAC,EAAE,UAAU,GAAG,IAAI,CAAC;IAC/B;;;OAGG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB;;;;OAIG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,kBAAkB,EAAE,CAAC,CAAC,SAAS,MAAM,UAAU,EAC7C,IAAI,EAAE,CAAC,EACP,KAAK,EAAE,UAAU,CAAC,CAAC,CAAC,KACjB,IAAI,CAAC;IACV,oBAAoB,CAAC,IAAI,IAAI,CAAC;CAC/B,CAAC;AAEF,eAAO,MAAM,kBAAkB,0GAO1B,uBAAuB,uBAqY3B,CAAC"}

package/dist/cjs/components/toolbar/text-format-selector.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.TextFormatSelector = void 0;
+exports.TextFormatSelector = exports.GENERAL_NUMBER_FORMAT = void 0;
 var tslib_1 = require("tslib");
 var icons_1 = require("@rowsncolumns/icons");
 var ui_1 = require("@rowsncolumns/ui");
@@ -8,6 +8,18 @@ var utils_1 = require("@rowsncolumns/utils");
 var react_1 = tslib_1.__importStar(require("react"));
 var atoms_1 = require("../../atoms");
 var helpers_1 = require("../../helpers");
+/**
+ * What the toolbar's "General" item writes to the cell. "General" must be an
+ * EXPLICIT format, not the absence of one: a `=DATE()` cell with no
+ * `numberFormat` derives a date format at paint time in both engines, so
+ * emitting `undefined` here left the cell showing `2/29/1900` after the user
+ * chose General (rowsncolumns/spreadsheet#642 B-05). Excel stamps numFmtId 0
+ * and shows the serial.
+ */
+exports.GENERAL_NUMBER_FORMAT = {
+    type: "GENERAL",
+    pattern: "General",
+};
 exports.TextFormatSelector = (0, react_1.memo)(function (_a) {
     var _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s;
     var _t = _a.locale, locale = _t === void 0 ? "en-US" : _t, _u = _a.currency, currency = _u === void 0 ? "USD" : _u, cellFormat = _a.cellFormat, onChangeFormatting = _a.onChangeFormatting, onRequestFormatCells = _a.onRequestFormatCells;
@@ -42,14 +54,14 @@ exports.TextFormatSelector = (0, react_1.memo)(function (_a) {
     var isCurrencyRounded = ((_k = cellFormat === null || cellFormat === void 0 ? void 0 : cellFormat.numberFormat) === null || _k === void 0 ? void 0 : _k.pattern) === currencyRoundedPattern;
     return (react_1.default.createElement(ui_1.DropdownMenu, { modal: false },
         react_1.default.createElement(ui_1.DropdownMenuTrigger, { asChild: true },
-            react_1.default.createElement(ui_1.IconButton, { tooltip: "More formats" },
+            react_1.default.createElement(ui_1.IconButton, { tooltip: "More formats", "aria-label": "More formats" },
                 react_1.default.createElement("div", { className: "text-xs" }, "123"),
                 react_1.default.createElement(icons_1.MdOutlineArrowDropDown, null))),
         react_1.default.createElement(ui_1.DropdownMenuPortal, null,
             react_1.default.createElement(ui_1.DropdownMenuContent, { align: "start" },
                 react_1.default.createElement(ui_1.DropdownMenuCheckboxItem, { checked: !((_l = cellFormat === null || cellFormat === void 0 ? void 0 : cellFormat.numberFormat) === null || _l === void 0 ? void 0 : _l.type) ||
                         ((_m = cellFormat === null || cellFormat === void 0 ? void 0 : cellFormat.numberFormat) === null || _m === void 0 ? void 0 : _m.type) === "GENERAL", onCheckedChange: function () {
-                        onChangeFormatting("numberFormat", undefined);
+                        onChangeFormatting("numberFormat", exports.GENERAL_NUMBER_FORMAT);
                         focusSheet === null || focusSheet === void 0 ? void 0 : focusSheet();
                     } },
                     react_1.default.createElement(ui_1.DropdownMenuItemIndicator, null,

package/dist/cjs/components/toolbar/text-horizontal-align-selector.d.ts

@@ -5,6 +5,14 @@ type TextHorizontalAlignSelectorProps = {
     value: HorizontalAlign | undefined | null;
     onChange(value: HorizontalAlign): void;
 };
+/**
+ * Excel's remaining Format Cells → Alignment → Horizontal entries. They have
+ * no toolbar glyph, so they render as labelled buttons under the icon row.
+ */
+export declare const EXTENDED_HORIZONTAL_ALIGNMENTS: ReadonlyArray<{
+    value: HorizontalAlign;
+    label: string;
+}>;
 export declare const TextHorizontalAlignSelector: ({ value, onChange, disabled, }: TextHorizontalAlignSelectorProps) => React.JSX.Element;
 export {};
 //# sourceMappingURL=text-horizontal-align-selector.d.ts.map

package/dist/cjs/components/toolbar/text-horizontal-align-selector.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"text-horizontal-align-selector.d.ts","sourceRoot":"","sources":["../../../../components/toolbar/text-horizontal-align-selector.tsx"],"names":[],"mappings":"AASA,OAAO,KAAmB,MAAM,OAAO,CAAC;AAGxC,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,aAAa,CAAC;AAEnD,KAAK,gCAAgC,GAAG;IACtC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,KAAK,EAAE,eAAe,GAAG,SAAS,GAAG,IAAI,CAAC;IAC1C,QAAQ,CAAC,KAAK,EAAE,eAAe,GAAG,IAAI,CAAC;CACxC,CAAC;AAEF,eAAO,MAAM,2BAA2B,GAAI,gCAIzC,gCAAgC,sBA0DlC,CAAC"}
+{"version":3,"file":"text-horizontal-align-selector.d.ts","sourceRoot":"","sources":["../../../../components/toolbar/text-horizontal-align-selector.tsx"],"names":[],"mappings":"AAUA,OAAO,KAAmB,MAAM,OAAO,CAAC;AAGxC,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,aAAa,CAAC;AAEnD,KAAK,gCAAgC,GAAG;IACtC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,KAAK,EAAE,eAAe,GAAG,SAAS,GAAG,IAAI,CAAC;IAC1C,QAAQ,CAAC,KAAK,EAAE,eAAe,GAAG,IAAI,CAAC;CACxC,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,8BAA8B,EAAE,aAAa,CAAC;IACzD,KAAK,EAAE,eAAe,CAAC;IACvB,KAAK,EAAE,MAAM,CAAC;CACf,CAGA,CAAC;AAEF,eAAO,MAAM,2BAA2B,GAAI,gCAIzC,gCAAgC,sBA6FlC,CAAC"}

package/dist/cjs/components/toolbar/text-horizontal-align-selector.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.TextHorizontalAlignSelector = void 0;
+exports.TextHorizontalAlignSelector = exports.EXTENDED_HORIZONTAL_ALIGNMENTS = void 0;
 var tslib_1 = require("tslib");
 var icons_1 = require("@rowsncolumns/icons");
 var ui_1 = require("@rowsncolumns/ui");
@@ -8,15 +8,28 @@ var ui_2 = require("@rowsncolumns/ui");
 var ui_3 = require("@rowsncolumns/ui");
 var react_1 = tslib_1.__importStar(require("react"));
 var atoms_1 = require("../../atoms");
+/**
+ * Excel's remaining Format Cells → Alignment → Horizontal entries. They have
+ * no toolbar glyph, so they render as labelled buttons under the icon row.
+ */
+exports.EXTENDED_HORIZONTAL_ALIGNMENTS = [
+    { value: "distributed", label: "Distributed" },
+    { value: "fill", label: "Fill" },
+];
 var TextHorizontalAlignSelector = function (_a) {
     var _b = _a.value, value = _b === void 0 ? "left" : _b, onChange = _a.onChange, disabled = _a.disabled;
     var focusSheet = (0, atoms_1.useFocusSheet)();
     var _c = tslib_1.__read((0, react_1.useState)(false), 2), isOpen = _c[0], onOpenChange = _c[1];
     var close = function () { return onOpenChange(false); };
+    var select = function (next) {
+        onChange(next);
+        focusSheet === null || focusSheet === void 0 ? void 0 : focusSheet();
+        close();
+    };
     return (react_1.default.createElement(ui_2.Popover, { open: isOpen, onOpenChange: onOpenChange },
         react_1.default.createElement(ui_2.PopoverTrigger, { asChild: true },
-            react_1.default.createElement(ui_1.IconButton, { size: "lg", tooltip: "Horizontal align", disabled: disabled },
-                value === "right" ? (react_1.default.createElement(icons_1.MdFormatAlignRight, null)) : value === "center" ? (react_1.default.createElement(icons_1.MdFormatAlignCenter, null)) : (react_1.default.createElement(icons_1.MdFormatAlignLeft, null)),
+            react_1.default.createElement(ui_1.IconButton, { size: "lg", tooltip: "Horizontal align", "aria-label": "Horizontal align", disabled: disabled },
+                value === "right" ? (react_1.default.createElement(icons_1.MdFormatAlignRight, null)) : value === "center" || value === "centerContinuous" ? (react_1.default.createElement(icons_1.MdFormatAlignCenter, null)) : value === "justify" || value === "distributed" ? (react_1.default.createElement(icons_1.MdFormatAlignJustify, null)) : (react_1.default.createElement(icons_1.MdFormatAlignLeft, null)),
                 react_1.default.createElement(icons_1.MdOutlineArrowDropDown, null))),
         react_1.default.createElement(ui_2.PopoverContent, { align: "start" },
             react_1.default.createElement(ui_3.Stack, { direction: "horizontal", className: "gap-1 max-w-[140px] flex-wrap" },
@@ -37,6 +50,12 @@ var TextHorizontalAlignSelector = function (_a) {
                         focusSheet === null || focusSheet === void 0 ? void 0 : focusSheet();
                         close();
                     } },
-                    react_1.default.createElement(icons_1.MdFormatAlignRight, null))))));
+                    react_1.default.createElement(icons_1.MdFormatAlignRight, null)),
+                react_1.default.createElement(ui_1.IconButton, { size: "lg", tooltip: "Justify", "aria-label": "Justify", isActive: value === "justify", onClick: function () { return select("justify"); } },
+                    react_1.default.createElement(icons_1.MdFormatAlignJustify, null))),
+            react_1.default.createElement(ui_3.Stack, { direction: "horizontal", className: "gap-1 pt-1 max-w-[140px]" }, exports.EXTENDED_HORIZONTAL_ALIGNMENTS.map(function (_a) {
+                var option = _a.value, label = _a.label;
+                return (react_1.default.createElement(ui_1.Button, { key: option, type: "button", variant: value === option ? "secondary" : "ghost", size: "xs", "aria-pressed": value === option, onClick: function () { return select(option); } }, label));
+            })))));
 };
 exports.TextHorizontalAlignSelector = TextHorizontalAlignSelector;

package/dist/cjs/components/watch-window/index.d.ts

@@ -0,0 +1,25 @@
+import React from "react";
+import { type WatchWindowContext, type WatchWindowEntry } from "../../atoms/watch-window.atom";
+import type { SheetCoordinate } from "../../types";
+export type WatchWindowProps = {
+    entries: WatchWindowEntry[];
+    context: WatchWindowContext | null;
+    onRemove(cell: SheetCoordinate): void;
+    onClose(): void;
+};
+/**
+ * Excel's Watch Window: a floating list of cells with their sheet, address,
+ * current value and formula, refreshed with the grid. Double-click a row to
+ * jump to the cell. Presentational; {@link WatchWindowHost} wires the atoms.
+ */
+export declare const WatchWindow: React.MemoExoticComponent<({ entries, context, onRemove, onClose }: WatchWindowProps) => React.JSX.Element>;
+/**
+ * Host-mounted, atom-driven Watch Window. Mount once alongside the other
+ * dialogs; the grid's context menu offers "Add to Watch Window" while a
+ * host is mounted and republishes live getters on each render.
+ */
+export declare const WatchWindowHost: {
+    (): React.JSX.Element | null;
+    displayName: string;
+};
+//# sourceMappingURL=index.d.ts.map

package/dist/cjs/components/watch-window/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../components/watch-window/index.tsx"],"names":[],"mappings":"AAGA,OAAO,KAA4B,MAAM,OAAO,CAAC;AAEjD,OAAO,EAML,KAAK,kBAAkB,EACvB,KAAK,gBAAgB,EACtB,MAAM,+BAA+B,CAAC;AACvC,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,aAAa,CAAC;AAEnD,MAAM,MAAM,gBAAgB,GAAG;IAC7B,OAAO,EAAE,gBAAgB,EAAE,CAAC;IAC5B,OAAO,EAAE,kBAAkB,GAAG,IAAI,CAAC;IACnC,QAAQ,CAAC,IAAI,EAAE,eAAe,GAAG,IAAI,CAAC;IACtC,OAAO,IAAI,IAAI,CAAC;CACjB,CAAC;AAEF;;;;GAIG;AACH,eAAO,MAAM,WAAW,sEACoB,gBAAgB,uBA6E3D,CAAC;AAIF;;;;GAIG;AACH,eAAO,MAAM,eAAe;;;CAgB3B,CAAC"}

package/dist/cjs/components/watch-window/index.js

@@ -0,0 +1,63 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.WatchWindowHost = exports.WatchWindow = void 0;
+var tslib_1 = require("tslib");
+var ui_1 = require("@rowsncolumns/ui");
+var icons_1 = require("@rowsncolumns/icons");
+var utils_1 = require("@rowsncolumns/utils");
+var react_1 = tslib_1.__importStar(require("react"));
+var watch_window_atom_1 = require("../../atoms/watch-window.atom");
+/**
+ * Excel's Watch Window: a floating list of cells with their sheet, address,
+ * current value and formula, refreshed with the grid. Double-click a row to
+ * jump to the cell. Presentational; {@link WatchWindowHost} wires the atoms.
+ */
+exports.WatchWindow = (0, react_1.memo)(function (_a) {
+    var entries = _a.entries, context = _a.context, onRemove = _a.onRemove, onClose = _a.onClose;
+    return (react_1.default.createElement("div", { role: "dialog", "aria-label": "Watch Window", className: "fixed bottom-4 right-4 z-50 w-[420px] max-w-[92vw] rounded-md border border-rnc-border bg-rnc-background text-rnc-foreground shadow-lg pointer-events-auto" },
+        react_1.default.createElement("div", { className: "flex items-center justify-between px-3 py-2 border-b border-rnc-border" },
+            react_1.default.createElement("span", { className: "text-sm font-medium" }, "Watch Window"),
+            react_1.default.createElement(ui_1.IconButton, { "aria-label": "Close Watch Window", onClick: onClose },
+                react_1.default.createElement(icons_1.Cross1Icon, null))),
+        entries.length === 0 ? (react_1.default.createElement("div", { className: "px-3 py-4 text-xs text-rnc-foreground/60" }, "No cells are being watched. Right-click a cell \u2192 Add to Watch Window.")) : (react_1.default.createElement("table", { className: "w-full text-xs border-collapse" },
+            react_1.default.createElement("thead", null,
+                react_1.default.createElement("tr", { className: "text-left text-rnc-foreground/70" },
+                    react_1.default.createElement("th", { className: "px-3 py-1 font-medium" }, "Sheet"),
+                    react_1.default.createElement("th", { className: "px-2 py-1 font-medium" }, "Cell"),
+                    react_1.default.createElement("th", { className: "px-2 py-1 font-medium" }, "Value"),
+                    react_1.default.createElement("th", { className: "px-2 py-1 font-medium" }, "Formula"),
+                    react_1.default.createElement("th", { className: "px-2 py-1" }))),
+            react_1.default.createElement("tbody", null, entries.map(function (entry) {
+                var _a, _b, _c;
+                var address = (_a = (0, utils_1.cellToAddress)(entry)) !== null && _a !== void 0 ? _a : "";
+                var sheetName = (_c = (_b = context === null || context === void 0 ? void 0 : context.getSheetName) === null || _b === void 0 ? void 0 : _b.call(context, entry.sheetId)) !== null && _c !== void 0 ? _c : String(entry.sheetId);
+                var value = context === null || context === void 0 ? void 0 : context.getFormattedValue(entry.sheetId, entry.rowIndex, entry.columnIndex);
+                var formula = context === null || context === void 0 ? void 0 : context.getFormula(entry.sheetId, entry.rowIndex, entry.columnIndex);
+                return (react_1.default.createElement("tr", { key: "".concat(entry.sheetId, ":").concat(entry.rowIndex, ":").concat(entry.columnIndex), className: "cursor-default hover:bg-rnc-accent", onDoubleClick: function () { return context === null || context === void 0 ? void 0 : context.onNavigate(entry); }, "data-testid": "watch-row" },
+                    react_1.default.createElement("td", { className: "px-3 py-1 truncate max-w-[110px]" }, sheetName),
+                    react_1.default.createElement("td", { className: "px-2 py-1 font-mono" }, address),
+                    react_1.default.createElement("td", { className: "px-2 py-1 truncate max-w-[120px]" }, value !== null && value !== void 0 ? value : ""),
+                    react_1.default.createElement("td", { className: "px-2 py-1 font-mono truncate max-w-[140px]" }, formula !== null && formula !== void 0 ? formula : ""),
+                    react_1.default.createElement("td", { className: "px-2 py-1 text-right" },
+                        react_1.default.createElement(ui_1.Button, { variant: "ghost", size: "xs", "aria-label": "Remove watch ".concat(sheetName, "!").concat(address), onClick: function () { return onRemove(entry); } }, "Delete"))));
+            }))))));
+});
+exports.WatchWindow.displayName = "WatchWindow";
+/**
+ * Host-mounted, atom-driven Watch Window. Mount once alongside the other
+ * dialogs; the grid's context menu offers "Add to Watch Window" while a
+ * host is mounted and republishes live getters on each render.
+ */
+var WatchWindowHost = function () {
+    (0, watch_window_atom_1.useRegisterWatchWindowHost)();
+    var _a = tslib_1.__read((0, watch_window_atom_1.useWatchWindowEntries)(), 1), entries = _a[0];
+    var _b = tslib_1.__read((0, watch_window_atom_1.useWatchWindowOpen)(), 2), open = _b[0], setOpen = _b[1];
+    var context = (0, watch_window_atom_1.useWatchWindowContext)();
+    var removeWatch = (0, watch_window_atom_1.useRemoveWatch)();
+    var close = (0, react_1.useCallback)(function () { return setOpen(false); }, [setOpen]);
+    if (!open)
+        return null;
+    return (react_1.default.createElement(exports.WatchWindow, { entries: entries, context: context, onRemove: removeWatch, onClose: close }));
+};
+exports.WatchWindowHost = WatchWindowHost;
+exports.WatchWindowHost.displayName = "WatchWindowHost";

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

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

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

@@ -7,6 +7,7 @@ var utils_1 = require("@rowsncolumns/utils");
 var react_1 = tslib_1.__importStar(require("react"));
 var colors_1 = require("../api/colors");
 var validation_1 = require("../api/validation");
+var alignment_1 = require("../components/cell/alignment");
 var cell_background_1 = require("../components/cell/cell-background");
 var cell_diff_1 = require("../components/cell-diff");
 var cell_overlay_1 = require("../components/cell-overlay");
@@ -56,10 +57,17 @@ var useCellRenderer = function (_a) {
         // Calculated column
         var isCalculatedColumn = isTableHeader(rowIndex, columnIndex) &&
             isCalculatedColumnHeader(rowIndex, columnIndex);
-        // Cell overflow
+        // Cell overflow. Excel's justify / distributed alignments wrap inside
+        // the cell's own width even without `wrapStrategy: "wrap"`, and fill
+        // repeats the text to the cell edge — none of them ever spill into
+        // the neighbouring cells.
         var wrapStrategy = effectiveCellFormat === null || effectiveCellFormat === void 0 ? void 0 : effectiveCellFormat.wrapStrategy;
-        var shouldWrap = wrapStrategy === "wrap";
-        var isWrapEnabled = (wrapStrategy !== null && wrapStrategy !== void 0 ? wrapStrategy : "overflow") === "overflow";
+        var wrapsByAlignment = (0, alignment_1.alignmentImpliesWrap)(horizontalAlignment);
+        var fillsCell = (0, alignment_1.isFillAlignment)(horizontalAlignment);
+        var shouldWrap = wrapStrategy === "wrap" || wrapsByAlignment;
+        var isWrapEnabled = (wrapStrategy !== null && wrapStrategy !== void 0 ? wrapStrategy : "overflow") === "overflow" &&
+            !wrapsByAlignment &&
+            !fillsCell;
         // Normalize display value for both rendering and overflow calculation
         var displayFormattedValue = (0, helpers_1.normalizeDisplayText)(formattedValue, shouldWrap);
         var shouldRecalcTextWidth = isWrapEnabled || wrapStrategy === "clip";
@@ -111,9 +119,12 @@ var useCellRenderer = function (_a) {
         }
         // shrinkToFit needs the natural text width to compare against the
         // cell's available width; rotated text uses it to size the (unrotated)
-        // text box that gets pivoted around the cell edge. Without this, the
-        // Konva Text renders with width 0 and the text disappears.
-        var textWidth = (overflowRight && shouldRecalcTextWidth) || containsTextInside
+        // text box that gets pivoted around the cell edge; fill alignment
+        // repeats the text `floor(cell / natural)` times. Without this, the
+        // Konva Text renders with width 0 (rotation) or a single unfilled copy.
+        var textWidth = (overflowRight && shouldRecalcTextWidth) ||
+            containsTextInside ||
+            fillsCell
             ? getTextDimension(sheetId, rowIndex, columnIndex, displayFormattedValue).width
             : 0;
         var enableOverflow = shouldOverflow && cellWidth > props.width;

package/dist/cjs/hooks/use-editable.d.ts

@@ -33,6 +33,13 @@ export type EditorSubmitOptions = {
      * there would undo the switch they just made.
      */
     preserveActiveSheet?: boolean;
+    /**
+     * Ctrl+Enter (Excel): commit the entry into EVERY cell of the current
+     * selection — relative references shift per cell, as a copy-fill would —
+     * and keep both the active cell and the selection where they are. On a
+     * single cell this is a plain in-place commit (no move down).
+     */
+    fillSelection?: boolean;
 };
 export type UseEditableOptions<T extends CellData> = {
     /**
@@ -260,9 +267,11 @@ export type SharedEditorProps = {
      */
     onChange?: (value: string, textFormatRuns: TextFormatRun[] | undefined, editingSheetId: number, activeCell: CellInterface) => void;
     /**
-     * Callback to submit the value back to data store
+     * Callback to submit the value back to data store. `shouldFocusGrid`
+     * defaults to true; `options` carries commit intent the editor derived from
+     * the keystroke (e.g. Ctrl+Enter → `fillSelection`).
      */
-    onSubmit?: (value: string, textFormatRuns: TextFormatRun[] | undefined, editingSheetId: number, activeCell: CellInterface, nextActiveCell?: CellInterface | null) => void;
+    onSubmit?: (value: string, textFormatRuns: TextFormatRun[] | undefined, editingSheetId: number, activeCell: CellInterface, nextActiveCell?: CellInterface | null, shouldFocusGrid?: boolean, options?: EditorSubmitOptions) => void;
     /**
      * On Cancel callbacks. Hides the editor
      */