@rowsncolumns/spreadsheet 10.4.1 → 10.4.4

package/dist/cjs/components/sort-range-dialog/index.js

@@ -1,11 +1,18 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.SortRangeDialogHost = exports.SortRangeDialog = void 0;
+exports.SortRangeDialogHost = exports.SortRangeDialog = exports.sortColumnLabel = void 0;
 var tslib_1 = require("tslib");
 var icons_1 = require("@rowsncolumns/icons");
 var ui_1 = require("@rowsncolumns/ui");
 var react_1 = tslib_1.__importStar(require("react"));
 var sort_dialog_atom_1 = require("../../atoms/sort-dialog.atom");
+/** The label a sort level shows for a column: its header while the data has headers, else its letter. */
+var sortColumnLabel = function (column, hasHeader) {
+    var _a;
+    var header = (_a = column.header) === null || _a === void 0 ? void 0 : _a.trim();
+    return hasHeader && header ? header : column.label;
+};
+exports.sortColumnLabel = sortColumnLabel;
 var CUSTOM_LIST_PREFIX = "custom:";
 var ColorSwatch = function (_a) {
     var color = _a.color;
@@ -53,19 +60,23 @@ var specToLevel = function (spec, customLists) {
  * routes through its existing sort callbacks.
  */
 exports.SortRangeDialog = (0, react_1.memo)(function (_a) {
-    var open = _a.open, onOpenChange = _a.onOpenChange, columns = _a.columns, customLists = _a.customLists, initialSpecs = _a.initialSpecs, onApply = _a.onApply;
+    var open = _a.open, onOpenChange = _a.onOpenChange, columns = _a.columns, customLists = _a.customLists, initialSpecs = _a.initialSpecs, initialHasHeader = _a.initialHasHeader, onApply = _a.onApply;
     var lists = (0, react_1.useMemo)(function () { return customLists !== null && customLists !== void 0 ? customLists : []; }, [customLists]);
     var _b = tslib_1.__read((0, react_1.useState)(function () {
         return (initialSpecs === null || initialSpecs === void 0 ? void 0 : initialSpecs.length)
             ? initialSpecs.map(function (spec) { return specToLevel(spec, lists); })
             : [makeDefaultLevel(columns)];
     }), 2), levels = _b[0], setLevels = _b[1];
+    var showHeaderToggle = initialHasHeader !== undefined ||
+        columns.some(function (column) { return column.header !== undefined; });
+    var _c = tslib_1.__read((0, react_1.useState)(initialHasHeader !== null && initialHasHeader !== void 0 ? initialHasHeader : false), 2), hasHeader = _c[0], setHasHeader = _c[1];
     // Re-seed when reopened with different columns / specs.
     (0, react_1.useEffect)(function () {
         if (open) {
             setLevels((initialSpecs === null || initialSpecs === void 0 ? void 0 : initialSpecs.length)
                 ? initialSpecs.map(function (spec) { return specToLevel(spec, lists); })
                 : [makeDefaultLevel(columns)]);
+            setHasHeader(initialHasHeader !== null && initialHasHeader !== void 0 ? initialHasHeader : false);
         }
         // Only reset on open transitions.
         // eslint-disable-next-line react-hooks/exhaustive-deps
@@ -133,15 +144,18 @@ exports.SortRangeDialog = (0, react_1.memo)(function (_a) {
             }
             return spec;
         });
-        onApply(specs);
+        onApply(specs, { hasHeader: hasHeader });
         onOpenChange(false);
-    }, [levels, lists, onApply, onOpenChange]);
+    }, [levels, lists, hasHeader, onApply, onOpenChange]);
     return (react_1.default.createElement(ui_1.Dialog, { open: open, onOpenChange: onOpenChange },
         react_1.default.createElement(ui_1.DialogContent, { className: "w-[640px] max-w-[92vw] pointer-events-auto" },
             react_1.default.createElement(ui_1.DialogTitle, null, "Sort"),
             react_1.default.createElement(ui_1.DialogCloseButton, { onClick: function () { return onOpenChange(false); } },
                 react_1.default.createElement(icons_1.Cross1Icon, null)),
             react_1.default.createElement(ui_1.DialogBody, { className: "flex flex-col gap-3" },
+                showHeaderToggle ? (react_1.default.createElement("label", { className: "font-system text-sm flex items-center gap-1" },
+                    react_1.default.createElement("input", { type: "checkbox", name: "hasHeader", checked: hasHeader, onChange: function (e) { return setHasHeader(e.target.checked); } }),
+                    "My data has headers")) : null,
                 react_1.default.createElement("div", { className: "flex flex-col gap-2" }, levels.map(function (lvl, rowIndex) {
                     var _a, _b, _c, _d;
                     var col = columnByIndex.get(lvl.dimensionIndex);
@@ -162,7 +176,7 @@ exports.SortRangeDialog = (0, react_1.memo)(function (_a) {
                             react_1.default.createElement(ui_1.SelectTrigger, { className: "w-[160px]" },
                                 react_1.default.createElement(ui_1.SelectValue, { placeholder: "Column" })),
                             react_1.default.createElement(ui_1.SelectPortal, null,
-                                react_1.default.createElement(ui_1.SelectContent, null, columns.map(function (c) { return (react_1.default.createElement(ui_1.SelectItem, { key: c.dimensionIndex, value: String(c.dimensionIndex) }, c.label)); })))),
+                                react_1.default.createElement(ui_1.SelectContent, null, columns.map(function (c) { return (react_1.default.createElement(ui_1.SelectItem, { key: c.dimensionIndex, value: String(c.dimensionIndex) }, (0, exports.sortColumnLabel)(c, hasHeader))); })))),
                         react_1.default.createElement(ui_1.Select, { value: lvl.customListIndex != null && lvl.sortBy === "value"
                                 ? "".concat(CUSTOM_LIST_PREFIX).concat(lvl.customListIndex)
                                 : lvl.sortBy, onValueChange: function (v) {
@@ -254,7 +268,7 @@ var SortRangeDialogHost = function () {
     return (react_1.default.createElement(exports.SortRangeDialog, { open: request != null, onOpenChange: function (open) {
             if (!open)
                 close();
-        }, columns: (_a = request === null || request === void 0 ? void 0 : request.columns) !== null && _a !== void 0 ? _a : [], customLists: request === null || request === void 0 ? void 0 : request.customLists, initialSpecs: request === null || request === void 0 ? void 0 : request.initialSpecs, onApply: function (specs) { return request === null || request === void 0 ? void 0 : request.onApply(specs); } }));
+        }, columns: (_a = request === null || request === void 0 ? void 0 : request.columns) !== null && _a !== void 0 ? _a : [], customLists: request === null || request === void 0 ? void 0 : request.customLists, initialSpecs: request === null || request === void 0 ? void 0 : request.initialSpecs, initialHasHeader: request === null || request === void 0 ? void 0 : request.initialHasHeader, onApply: function (specs, options) { return request === null || request === void 0 ? void 0 : request.onApply(specs, options); } }));
 };
 exports.SortRangeDialogHost = SortRangeDialogHost;
 exports.SortRangeDialogHost.displayName = "SortRangeDialogHost";

package/dist/cjs/components/toolbar/cell-style-selector.d.ts

@@ -33,6 +33,15 @@ export declare const getGalleryNamedCellStyles: (namedCellStyles: NamedCellStyle
 /** CSS preview of a named style's format for the gallery swatch. */
 export declare const getNamedCellStylePreview: (format: CellFormat | undefined, theme: SpreadsheetTheme) => React.CSSProperties;
 export declare const getCellStyles: (theme: SpreadsheetTheme, currencySymbol?: string) => Map<string, StyleList[]>;
+/**
+ * Excel's built-in "Comma Style" / "Comma [0]" (numFmtId 43 / 41): accounting
+ * layout without a currency symbol — negatives in parentheses, zero as `-`,
+ * `_(`/`_)` padding so digits align. `-15` shows `(15.00)` in the cell's own
+ * colour; the `[Red]` parenthesised variants are separate built-ins (38/40)
+ * that the Format Cells dialog offers under Custom, not the toolbar style.
+ */
+export declare const PATTERN_COMMA_STYLE = "_(* #,##0.00_);_(* (#,##0.00);_(* \"-\"??_);_(@_)";
+export declare const PATTERN_COMMA_STYLE_ROUNDED = "_(* #,##0_);_(* (#,##0);_(* \"-\"??_);_(@_)";
 export declare const CellStyleSelector: React.MemoExoticComponent<({ currency, locale, theme, selectedFormat, namedCellStyles, canAddCustomStyle, onChangeFormatting, onClearFormatting, }: CellStyleSelectorProps) => React.JSX.Element>;
 export {};
 //# sourceMappingURL=cell-style-selector.d.ts.map

package/dist/cjs/components/toolbar/cell-style-selector.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"cell-style-selector.d.ts","sourceRoot":"","sources":["../../../../components/toolbar/cell-style-selector.tsx"],"names":[],"mappings":"AAYA,OAAO,KAAgC,MAAM,OAAO,CAAC;AAMrD,OAAO,KAAK,EACV,UAAU,EAEV,cAAc,EAEf,MAAM,aAAa,CAAC;AACrB,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,wBAAwB,CAAC;AAE/D,KAAK,cAAc,GAAG,CAAC,KAAK,EAAE,UAAU,KAAK,IAAI,CAAC;AAClD,KAAK,aAAa,CAAC,CAAC,SAAS,MAAM,UAAU,IAAI,CAC/C,IAAI,EAAE,CAAC,EACP,KAAK,EAAE,UAAU,CAAC,CAAC,CAAC,KACjB,IAAI,CAAC;AAEV,MAAM,MAAM,sBAAsB,GAAG;IACnC,QAAQ,EAAE,MAAM,CAAC;IACjB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,KAAK,EAAE,gBAAgB,CAAC;IACxB,iBAAiB,CAAC,EAAE,CAAC,MAAM,EAAE,UAAU,CAAC,EAAE,CAAC;IAC3C;;;;;OAKG;IACH,eAAe,CAAC,EAAE,cAAc,EAAE,GAAG,IAAI,CAAC;IAC1C,cAAc,CAAC,EAAE,UAAU,GAAG,IAAI,CAAC;IACnC,qBAAqB,CAAC,CAAC,IAAI,EAAE,MAAM,GAAG,IAAI,CAAC;IAC3C,kBAAkB,EAAE,CAClB,GAAG,IAAI,EAAE,UAAU,CAAC,cAAc,GAAG,aAAa,CAAC,MAAM,UAAU,CAAC,CAAC,KAClE,IAAI,CAAC;IACV,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,iBAAiB,EAAE,MAAM,IAAI,CAAC;CAC/B,CAAC;AAEF,KAAK,SAAS,GAAG;IACf,QAAQ,EAAE,MAAM;IAChB,MAAM,EAAE,UAAU;IAClB,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa;CAC5B,CAAC;AAEF,8EAA8E;AAC9E,eAAO,MAAM,yBAAyB,GACpC,iBAAiB,cAAc,EAAE,GAAG,IAAI,GAAG,SAAS,KACnD,KAAK,CAAC,cAAc,GAAG;IAAE,MAAM,EAAE,UAAU,CAAA;CAAE,CAQ7C,CAAC;AAcJ,oEAAoE;AACpE,eAAO,MAAM,wBAAwB,GACnC,QAAQ,UAAU,GAAG,SAAS,EAC9B,OAAO,gBAAgB,KACtB,KAAK,CAAC,aAqBR,CAAC;AAEF,eAAO,MAAM,aAAa,GACxB,OAAO,gBAAgB,EACvB,iBAAiB,MAAM,6BAgYxB,CAAC;AAEF,eAAO,MAAM,iBAAiB,sJAUzB,sBAAsB,uBAsO1B,CAAC"}
+{"version":3,"file":"cell-style-selector.d.ts","sourceRoot":"","sources":["../../../../components/toolbar/cell-style-selector.tsx"],"names":[],"mappings":"AAYA,OAAO,KAAgC,MAAM,OAAO,CAAC;AAMrD,OAAO,KAAK,EACV,UAAU,EAEV,cAAc,EAEf,MAAM,aAAa,CAAC;AACrB,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,wBAAwB,CAAC;AAE/D,KAAK,cAAc,GAAG,CAAC,KAAK,EAAE,UAAU,KAAK,IAAI,CAAC;AAClD,KAAK,aAAa,CAAC,CAAC,SAAS,MAAM,UAAU,IAAI,CAC/C,IAAI,EAAE,CAAC,EACP,KAAK,EAAE,UAAU,CAAC,CAAC,CAAC,KACjB,IAAI,CAAC;AAEV,MAAM,MAAM,sBAAsB,GAAG;IACnC,QAAQ,EAAE,MAAM,CAAC;IACjB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,KAAK,EAAE,gBAAgB,CAAC;IACxB,iBAAiB,CAAC,EAAE,CAAC,MAAM,EAAE,UAAU,CAAC,EAAE,CAAC;IAC3C;;;;;OAKG;IACH,eAAe,CAAC,EAAE,cAAc,EAAE,GAAG,IAAI,CAAC;IAC1C,cAAc,CAAC,EAAE,UAAU,GAAG,IAAI,CAAC;IACnC,qBAAqB,CAAC,CAAC,IAAI,EAAE,MAAM,GAAG,IAAI,CAAC;IAC3C,kBAAkB,EAAE,CAClB,GAAG,IAAI,EAAE,UAAU,CAAC,cAAc,GAAG,aAAa,CAAC,MAAM,UAAU,CAAC,CAAC,KAClE,IAAI,CAAC;IACV,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,iBAAiB,EAAE,MAAM,IAAI,CAAC;CAC/B,CAAC;AAEF,KAAK,SAAS,GAAG;IACf,QAAQ,EAAE,MAAM;IAChB,MAAM,EAAE,UAAU;IAClB,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa;CAC5B,CAAC;AAEF,8EAA8E;AAC9E,eAAO,MAAM,yBAAyB,GACpC,iBAAiB,cAAc,EAAE,GAAG,IAAI,GAAG,SAAS,KACnD,KAAK,CAAC,cAAc,GAAG;IAAE,MAAM,EAAE,UAAU,CAAA;CAAE,CAQ7C,CAAC;AAcJ,oEAAoE;AACpE,eAAO,MAAM,wBAAwB,GACnC,QAAQ,UAAU,GAAG,SAAS,EAC9B,OAAO,gBAAgB,KACtB,KAAK,CAAC,aAqBR,CAAC;AAEF,eAAO,MAAM,aAAa,GACxB,OAAO,gBAAgB,EACvB,iBAAiB,MAAM,6BAgYxB,CAAC;AAEF;;;;;;GAMG;AACH,eAAO,MAAM,mBAAmB,sDAAoD,CAAC;AACrF,eAAO,MAAM,2BAA2B,gDAA8C,CAAC;AAEvF,eAAO,MAAM,iBAAiB,sJAUzB,sBAAsB,uBAsO1B,CAAC"}

package/dist/cjs/components/toolbar/cell-style-selector.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.CellStyleSelector = exports.getCellStyles = exports.getNamedCellStylePreview = exports.getGalleryNamedCellStyles = void 0;
+exports.CellStyleSelector = exports.PATTERN_COMMA_STYLE_ROUNDED = exports.PATTERN_COMMA_STYLE = exports.getCellStyles = exports.getNamedCellStylePreview = exports.getGalleryNamedCellStyles = void 0;
 var tslib_1 = require("tslib");
 var icons_1 = require("@rowsncolumns/icons");
 var icons_2 = require("@rowsncolumns/icons");
@@ -436,6 +436,15 @@ var getCellStyles = function (theme, currencySymbol) {
     ]);
 };
 exports.getCellStyles = getCellStyles;
+/**
+ * Excel's built-in "Comma Style" / "Comma [0]" (numFmtId 43 / 41): accounting
+ * layout without a currency symbol — negatives in parentheses, zero as `-`,
+ * `_(`/`_)` padding so digits align. `-15` shows `(15.00)` in the cell's own
+ * colour; the `[Red]` parenthesised variants are separate built-ins (38/40)
+ * that the Format Cells dialog offers under Custom, not the toolbar style.
+ */
+exports.PATTERN_COMMA_STYLE = '_(* #,##0.00_);_(* (#,##0.00);_(* "-"??_);_(@_)';
+exports.PATTERN_COMMA_STYLE_ROUNDED = '_(* #,##0_);_(* (#,##0);_(* "-"??_);_(@_)';
 exports.CellStyleSelector = (0, react_1.memo)(function (_a) {
     var currency = _a.currency, locale = _a.locale, theme = _a.theme, selectedFormat = _a.selectedFormat, namedCellStyles = _a.namedCellStyles, _b = _a.canAddCustomStyle, canAddCustomStyle = _b === void 0 ? false : _b, onChangeFormatting = _a.onChangeFormatting, onClearFormatting = _a.onClearFormatting;
     var colorIndexes = [4, 5, 6, 7, 8, 9];
@@ -451,14 +460,14 @@ exports.CellStyleSelector = (0, react_1.memo)(function (_a) {
             "Comma",
             {
                 type: "NUMBER",
-                pattern: "#,##0.00",
+                pattern: exports.PATTERN_COMMA_STYLE,
             },
         ],
         [
             "Comma[0]",
             {
                 type: "NUMBER",
-                pattern: "#,##0",
+                pattern: exports.PATTERN_COMMA_STYLE_ROUNDED,
             },
         ],
         [

package/dist/cjs/components/toolbar/merge-cells-selector.d.ts

@@ -1,5 +1,6 @@
 import type { CellInterface, GridRange, SelectionArea } from "@rowsncolumns/grid";
 import { Direction } from "@rowsncolumns/grid";
+import type { Maybe } from "@rowsncolumns/utils";
 import React from "react";
 import type { TableView } from "../../types";
 import type { SelectionAttributes } from "../canvas-grid/typings";
@@ -12,7 +13,32 @@ type MergeCellsSelectorProps = {
     merges?: GridRange[] | null;
     /** Tables of the workbook — a selection touching one on `sheetId` cannot be merged (Excel). */
     tables?: TableView[] | null;
+    /**
+     * Cell value reader behind Excel's "Merging cells only keeps the upper-left value" warning.
+     * Defaults to the reader the grid publishes; the warning is skipped when neither is available.
+     */
+    getFormattedValue?: (sheetId: number, rowIndex: number, columnIndex: number) => Maybe<string>;
 };
-export declare const MergeCellsSelector: ({ activeCell, selections, sheetId, merges, tables, onMerge, onUnMerge, }: MergeCellsSelectorProps) => React.JSX.Element;
+/** Excel's wording for a merge that would drop cell values. */
+export declare const MERGE_DISCARDS_VALUES_TITLE = "Merge cells";
+export declare const MERGE_DISCARDS_VALUES_MESSAGE = "Merging cells only keeps the upper-left value and discards other values.";
+/**
+ * The regions `onMergeCells` merges for a toolbar request: each row (merge
+ * horizontally), each column (merge vertically), every area of a multi-area
+ * selection, or the last selection as one block — the store action's own rules.
+ */
+export declare const mergeRegionsForSelection: (selections: SelectionArea[], direction?: Direction) => GridRange[];
+/**
+ * Would this merge discard values? Excel warns when more than one cell of a
+ * merged block holds a value (the merge keeps only the upper-left one). A
+ * headless / programmatic merge never asks — this gate lives in the toolbar.
+ */
+export declare const mergeDiscardsValues: ({ sheetId, selections, direction, getFormattedValue, }: {
+    sheetId: number;
+    selections: SelectionArea[];
+    direction?: Direction;
+    getFormattedValue: (sheetId: number, rowIndex: number, columnIndex: number) => Maybe<string>;
+}) => boolean;
+export declare const MergeCellsSelector: ({ activeCell, selections, sheetId, merges, tables, onMerge, onUnMerge, getFormattedValue: getFormattedValueProp, }: MergeCellsSelectorProps) => React.JSX.Element;
 export {};
 //# sourceMappingURL=merge-cells-selector.d.ts.map

package/dist/cjs/components/toolbar/merge-cells-selector.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"merge-cells-selector.d.ts","sourceRoot":"","sources":["../../../../components/toolbar/merge-cells-selector.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EACV,aAAa,EACb,SAAS,EACT,aAAa,EACd,MAAM,oBAAoB,CAAC;AAC5B,OAAO,EAAkB,SAAS,EAAgB,MAAM,oBAAoB,CAAC;AAY7E,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AAC7C,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,wBAAwB,CAAC;AAElE,KAAK,uBAAuB,GAAG;IAC7B,UAAU,EAAE,aAAa,CAAC;IAC1B,UAAU,EAAE,aAAa,EAAE,CAAC;IAC5B,OAAO,EAAE,MAAM,CAAC;IAChB,OAAO,CACL,OAAO,EAAE,MAAM,EACf,UAAU,EAAE,aAAa,EACzB,UAAU,EAAE,aAAa,CAAC,mBAAmB,CAAC,EAAE,EAChD,SAAS,CAAC,EAAE,SAAS,GACpB,IAAI,CAAC;IACR,SAAS,CACP,OAAO,EAAE,MAAM,EACf,UAAU,EAAE,aAAa,EACzB,UAAU,EAAE,aAAa,CAAC,mBAAmB,CAAC,EAAE,GAC/C,IAAI,CAAC;IACR,MAAM,CAAC,EAAE,SAAS,EAAE,GAAG,IAAI,CAAC;IAC5B,+FAA+F;IAC/F,MAAM,CAAC,EAAE,SAAS,EAAE,GAAG,IAAI,CAAC;CAC7B,CAAC;AAEF,eAAO,MAAM,kBAAkB,GAAI,0EAQhC,uBAAuB,sBAgGzB,CAAC"}
+{"version":3,"file":"merge-cells-selector.d.ts","sourceRoot":"","sources":["../../../../components/toolbar/merge-cells-selector.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EACV,aAAa,EACb,SAAS,EACT,aAAa,EACd,MAAM,oBAAoB,CAAC;AAC5B,OAAO,EAAkB,SAAS,EAAgB,MAAM,oBAAoB,CAAC;AAyB7E,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,qBAAqB,CAAC;AACjD,OAAO,KAAmB,MAAM,OAAO,CAAC;AAIxC,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AAC7C,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,wBAAwB,CAAC;AAElE,KAAK,uBAAuB,GAAG;IAC7B,UAAU,EAAE,aAAa,CAAC;IAC1B,UAAU,EAAE,aAAa,EAAE,CAAC;IAC5B,OAAO,EAAE,MAAM,CAAC;IAChB,OAAO,CACL,OAAO,EAAE,MAAM,EACf,UAAU,EAAE,aAAa,EACzB,UAAU,EAAE,aAAa,CAAC,mBAAmB,CAAC,EAAE,EAChD,SAAS,CAAC,EAAE,SAAS,GACpB,IAAI,CAAC;IACR,SAAS,CACP,OAAO,EAAE,MAAM,EACf,UAAU,EAAE,aAAa,EACzB,UAAU,EAAE,aAAa,CAAC,mBAAmB,CAAC,EAAE,GAC/C,IAAI,CAAC;IACR,MAAM,CAAC,EAAE,SAAS,EAAE,GAAG,IAAI,CAAC;IAC5B,+FAA+F;IAC/F,MAAM,CAAC,EAAE,SAAS,EAAE,GAAG,IAAI,CAAC;IAC5B;;;OAGG;IACH,iBAAiB,CAAC,EAAE,CAClB,OAAO,EAAE,MAAM,EACf,QAAQ,EAAE,MAAM,EAChB,WAAW,EAAE,MAAM,KAChB,KAAK,CAAC,MAAM,CAAC,CAAC;CACpB,CAAC;AAEF,+DAA+D;AAC/D,eAAO,MAAM,2BAA2B,gBAAgB,CAAC;AACzD,eAAO,MAAM,6BAA6B,6EACkC,CAAC;AAE7E;;;;GAIG;AACH,eAAO,MAAM,wBAAwB,GACnC,YAAY,aAAa,EAAE,EAC3B,YAAY,SAAS,KACpB,SAAS,EAmBX,CAAC;AAEF;;;;GAIG;AACH,eAAO,MAAM,mBAAmB,GAAI,wDAKjC;IACD,OAAO,EAAE,MAAM,CAAC;IAChB,UAAU,EAAE,aAAa,EAAE,CAAC;IAC5B,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,iBAAiB,EAAE,CACjB,OAAO,EAAE,MAAM,EACf,QAAQ,EAAE,MAAM,EAChB,WAAW,EAAE,MAAM,KAChB,KAAK,CAAC,MAAM,CAAC,CAAC;CACpB,KAAG,OAcH,CAAC;AAIF,eAAO,MAAM,kBAAkB,GAAI,oHAShC,uBAAuB,sBA8IzB,CAAC"}

package/dist/cjs/components/toolbar/merge-cells-selector.js

@@ -1,17 +1,101 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.MergeCellsSelector = void 0;
+exports.MergeCellsSelector = exports.mergeDiscardsValues = exports.mergeRegionsForSelection = exports.MERGE_DISCARDS_VALUES_MESSAGE = exports.MERGE_DISCARDS_VALUES_TITLE = void 0;
 var tslib_1 = require("tslib");
 var grid_1 = require("@rowsncolumns/grid");
 var icons_1 = require("@rowsncolumns/icons");
 var ui_1 = require("@rowsncolumns/ui");
 var ui_2 = require("@rowsncolumns/ui");
-var react_1 = tslib_1.__importDefault(require("react"));
+var react_1 = tslib_1.__importStar(require("react"));
 var atoms_1 = require("../../atoms");
 var config_1 = require("../../config");
+/** Excel's wording for a merge that would drop cell values. */
+exports.MERGE_DISCARDS_VALUES_TITLE = "Merge cells";
+exports.MERGE_DISCARDS_VALUES_MESSAGE = "Merging cells only keeps the upper-left value and discards other values.";
+/**
+ * The regions `onMergeCells` merges for a toolbar request: each row (merge
+ * horizontally), each column (merge vertically), every area of a multi-area
+ * selection, or the last selection as one block — the store action's own rules.
+ */
+var mergeRegionsForSelection = function (selections, direction) {
+    if (!selections.length)
+        return [];
+    var range = selections[selections.length - 1].range;
+    if (direction === grid_1.Direction.Right) {
+        var rows = [];
+        for (var r = range.startRowIndex; r <= range.endRowIndex; r++) {
+            rows.push(tslib_1.__assign(tslib_1.__assign({}, range), { startRowIndex: r, endRowIndex: r }));
+        }
+        return rows;
+    }
+    if (direction === grid_1.Direction.Down) {
+        var cols = [];
+        for (var c = range.startColumnIndex; c <= range.endColumnIndex; c++) {
+            cols.push(tslib_1.__assign(tslib_1.__assign({}, range), { startColumnIndex: c, endColumnIndex: c }));
+        }
+        return cols;
+    }
+    if (selections.length > 1)
+        return selections.map(function (sel) { return sel.range; });
+    return [range];
+};
+exports.mergeRegionsForSelection = mergeRegionsForSelection;
+/**
+ * Would this merge discard values? Excel warns when more than one cell of a
+ * merged block holds a value (the merge keeps only the upper-left one). A
+ * headless / programmatic merge never asks — this gate lives in the toolbar.
+ */
+var mergeDiscardsValues = function (_a) {
+    var e_1, _b;
+    var sheetId = _a.sheetId, selections = _a.selections, direction = _a.direction, getFormattedValue = _a.getFormattedValue;
+    try {
+        for (var _c = tslib_1.__values((0, exports.mergeRegionsForSelection)(selections, direction)), _d = _c.next(); !_d.done; _d = _c.next()) {
+            var region = _d.value;
+            var filled = 0;
+            for (var r = region.startRowIndex; r <= region.endRowIndex; r++) {
+                for (var c = region.startColumnIndex; c <= region.endColumnIndex; c++) {
+                    var value = getFormattedValue(sheetId, r, c);
+                    if (value !== null && value !== undefined && value !== "") {
+                        filled++;
+                        if (filled > 1)
+                            return true;
+                    }
+                }
+            }
+        }
+    }
+    catch (e_1_1) { e_1 = { error: e_1_1 }; }
+    finally {
+        try {
+            if (_d && !_d.done && (_b = _c.return)) _b.call(_c);
+        }
+        finally { if (e_1) throw e_1.error; }
+    }
+    return false;
+};
+exports.mergeDiscardsValues = mergeDiscardsValues;
 var MergeCellsSelector = function (_a) {
-    var activeCell = _a.activeCell, _b = _a.selections, selections = _b === void 0 ? config_1.DEFAULT_ARRAY : _b, sheetId = _a.sheetId, merges = _a.merges, tables = _a.tables, onMerge = _a.onMerge, onUnMerge = _a.onUnMerge;
+    var activeCell = _a.activeCell, _b = _a.selections, selections = _b === void 0 ? config_1.DEFAULT_ARRAY : _b, sheetId = _a.sheetId, merges = _a.merges, tables = _a.tables, onMerge = _a.onMerge, onUnMerge = _a.onUnMerge, getFormattedValueProp = _a.getFormattedValue;
     var focusSheet = (0, atoms_1.useFocusSheet)();
+    var gridGetFormattedValue = (0, atoms_1.useGetFormattedValue)();
+    var getFormattedValue = getFormattedValueProp !== null && getFormattedValueProp !== void 0 ? getFormattedValueProp : gridGetFormattedValue;
+    // A merge waiting on the "discards other values" confirmation.
+    var _c = tslib_1.__read((0, react_1.useState)(null), 2), pendingMerge = _c[0], setPendingMerge = _c[1];
+    var requestMerge = function (direction) {
+        if (getFormattedValue &&
+            (0, exports.mergeDiscardsValues)({ sheetId: sheetId, selections: selections, direction: direction, getFormattedValue: getFormattedValue })) {
+            setPendingMerge({ direction: direction });
+            return;
+        }
+        onMerge(sheetId, activeCell, selections, direction);
+    };
+    var confirmPendingMerge = function () {
+        if (pendingMerge) {
+            onMerge(sheetId, activeCell, selections, pendingMerge.direction);
+        }
+        setPendingMerge(null);
+        focusSheet === null || focusSheet === void 0 ? void 0 : focusSheet();
+    };
     var isMerged = !!(merges === null || merges === void 0 ? void 0 : merges.find(function (merge) {
         return (0, grid_1.isEqualCells)({ rowIndex: merge.startRowIndex, columnIndex: merge.startColumnIndex }, activeCell);
     }));
@@ -32,7 +116,7 @@ var MergeCellsSelector = function (_a) {
                     onUnMerge(sheetId, activeCell, selections);
                 }
                 else {
-                    onMerge(sheetId, activeCell, selections);
+                    requestMerge();
                 }
             }, isActive: isMerged, tooltip: isMerged ? "Unmerge All" : "Merge all", disabled: disableMenu },
             react_1.default.createElement(icons_1.AiOutlineMergeCells, null)),
@@ -43,20 +127,34 @@ var MergeCellsSelector = function (_a) {
             react_1.default.createElement(ui_1.DropdownMenuPortal, null,
                 react_1.default.createElement(ui_2.DropdownMenuContent, { align: "end" },
                     react_1.default.createElement(ui_2.DropdownMenuItem, { disabled: isMerged || selectionTouchesTable, onClick: function () {
-                            onMerge(sheetId, activeCell, selections);
+                            requestMerge();
                             focusSheet === null || focusSheet === void 0 ? void 0 : focusSheet();
                         } }, "Merge all"),
                     react_1.default.createElement(ui_2.DropdownMenuItem, { disabled: isMerged || selectionTouchesTable || !canMergeVertically, onClick: function () {
-                            onMerge(sheetId, activeCell, selections, grid_1.Direction.Down);
+                            requestMerge(grid_1.Direction.Down);
                             focusSheet === null || focusSheet === void 0 ? void 0 : focusSheet();
                         } }, "Merge vertically"),
                     react_1.default.createElement(ui_2.DropdownMenuItem, { onClick: function () {
-                            onMerge(sheetId, activeCell, selections, grid_1.Direction.Right);
+                            requestMerge(grid_1.Direction.Right);
                             focusSheet === null || focusSheet === void 0 ? void 0 : focusSheet();
                         }, disabled: isMerged || selectionTouchesTable || !canMergeHorizontally }, "Merge horizontally"),
                     react_1.default.createElement(ui_2.DropdownMenuItem, { disabled: !isMerged, onClick: function () {
                             onUnMerge(sheetId, activeCell, selections);
                             focusSheet === null || focusSheet === void 0 ? void 0 : focusSheet();
-                        } }, "Unmerge"))))));
+                        } }, "Unmerge")))),
+        react_1.default.createElement(ui_1.Dialog, { modal: true, open: pendingMerge !== null, onOpenChange: function (open) {
+                if (!open)
+                    setPendingMerge(null);
+            } },
+            react_1.default.createElement(ui_1.DialogContent, null,
+                react_1.default.createElement(ui_1.DialogTitle, null, exports.MERGE_DISCARDS_VALUES_TITLE),
+                react_1.default.createElement(ui_1.DialogDescription, null, exports.MERGE_DISCARDS_VALUES_MESSAGE),
+                react_1.default.createElement(ui_1.DialogBody, null,
+                    react_1.default.createElement(ui_1.Stack, { className: "gap-2" },
+                        react_1.default.createElement(ui_1.Button, { variant: "primary", onClick: confirmPendingMerge }, "Continue"),
+                        react_1.default.createElement(ui_1.Button, { onClick: function () { return setPendingMerge(null); } }, "Cancel"))),
+                react_1.default.createElement(ui_1.DialogClose, { asChild: true },
+                    react_1.default.createElement(ui_1.DialogCloseButton, null,
+                        react_1.default.createElement(icons_1.Cross2Icon, null)))))));
 };
 exports.MergeCellsSelector = MergeCellsSelector;

package/dist/cjs/components/toolbar/table-style-editor.d.ts

@@ -0,0 +1,85 @@
+import React from "react";
+import type { BandingProperties, CustomTableStyle, Maybe } from "../../types";
+import type { SpreadsheetTheme } from "../canvas-grid/typings";
+/**
+ * The style elements a custom table style can colour — the `rowProperties` fields the grid's
+ * banding resolves (`api/banded-ranges.ts`), in the order of Excel's New Table Style dialog.
+ * The first three are what the gallery swatches show and what every created style carries; the
+ * rest are only written when the user picks a colour for them.
+ */
+export declare const TABLE_STYLE_ELEMENTS: readonly [{
+    readonly key: "header";
+    readonly label: "Header row";
+    readonly property: "headerColor";
+}, {
+    readonly key: "firstBand";
+    readonly label: "First row stripe";
+    readonly property: "firstBandColor";
+}, {
+    readonly key: "secondBand";
+    readonly label: "Second row stripe";
+    readonly property: "secondBandColor";
+}, {
+    readonly key: "firstColumn";
+    readonly label: "First column";
+    readonly property: "firstColumnColor";
+}, {
+    readonly key: "lastColumn";
+    readonly label: "Last column";
+    readonly property: "lastColumnColor";
+}, {
+    readonly key: "totalRow";
+    readonly label: "Total row";
+    readonly property: "totalRowColor";
+}];
+export type TableStyleElementKey = (typeof TABLE_STYLE_ELEMENTS)[number]["key"];
+/** The colour picked for each element; `undefined` leaves the element unpainted. */
+export type TableStyleColors = Partial<Record<TableStyleElementKey, string>>;
+/** The colours a fresh style starts from (the default palette's accent 1 and its light tint). */
+export declare const DEFAULT_TABLE_STYLE_COLORS: TableStyleColors;
+/**
+ * The banding a custom table style paints from its element colours. Header and the two stripes
+ * are always present (unset ones stay unpainted); the optional elements are written only when
+ * coloured, so a style that only picks the first three keeps its historical shape.
+ */
+export declare const buildCustomTableStyle: (name: string, colors: TableStyleColors) => CustomTableStyle;
+/** The element colours of an existing custom style (theme colours resolved to hex). */
+export declare const getTableStyleColors: (style: CustomTableStyle, theme: SpreadsheetTheme) => TableStyleColors;
+/**
+ * Why a style name cannot be used, or `undefined` when it can: empty, a built-in style's name
+ * (the gallery tells the two apart by name), or another custom style's name (case-insensitive,
+ * like Excel). `currentName` is the style being edited, which may keep its own name.
+ */
+export declare const getTableStyleNameError: (name: string, existingNames: readonly string[], currentName?: string) => string | undefined;
+export type TableStyleEditorProps = {
+    /** The custom style being modified; omit to create a new one. */
+    style?: CustomTableStyle;
+    /** The name a new style starts with (ignored when `style` is given). */
+    defaultName?: string;
+    theme: SpreadsheetTheme;
+    /** Names of the workbook's custom styles, for the duplicate-name check. */
+    existingNames?: readonly string[];
+    /** Create (or, when `style` is given, save) — receives the style the picks produce. */
+    onSubmit(style: CustomTableStyle): void;
+    onCancel(): void;
+    /** Offered as "Delete style" while editing; the footer omits it when absent. */
+    onDelete?(style: CustomTableStyle): void;
+    className?: string;
+};
+/**
+ * Excel's New Table Style / Modify Table Style dialog, laid out for the Format as Table gallery:
+ * name row, the table elements with a colour button each (the toolbar's colour popover), a live
+ * preview of the table the picks produce, and an Excel-ordered footer.
+ */
+export declare const TableStyleEditor: ({ style, defaultName, theme, existingNames, onSubmit, onCancel, onDelete, className, }: TableStyleEditorProps) => React.JSX.Element;
+/**
+ * The table a style paints: a header row over four banded rows, with the first / last column and
+ * total row emphasis when the style colours them. Uses the grid's banding rules
+ * (`api/banded-ranges.ts`): the first body row is the first stripe, the last body row is the
+ * total row, and an edge column's colour outranks the stripe under it.
+ */
+export declare const TableStylePreviewCard: ({ rowProperties, theme, }: {
+    rowProperties: Maybe<BandingProperties>;
+    theme: SpreadsheetTheme;
+}) => React.JSX.Element;
+//# sourceMappingURL=table-style-editor.d.ts.map

package/dist/cjs/components/toolbar/table-style-editor.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"table-style-editor.d.ts","sourceRoot":"","sources":["../../../../components/toolbar/table-style-editor.tsx"],"names":[],"mappings":"AAWA,OAAO,KAAmC,MAAM,OAAO,CAAC;AAIxD,OAAO,KAAK,EACV,iBAAiB,EAEjB,gBAAgB,EAChB,KAAK,EACN,MAAM,aAAa,CAAC;AACrB,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,wBAAwB,CAAC;AAG/D;;;;;GAKG;AACH,eAAO,MAAM,oBAAoB;;;;;;;;;;;;;;;;;;;;;;;;EAW/B,CAAC;AAEH,MAAM,MAAM,oBAAoB,GAAG,CAAC,OAAO,oBAAoB,CAAC,CAAC,MAAM,CAAC,CAAC,KAAK,CAAC,CAAC;AAEhF,oFAAoF;AACpF,MAAM,MAAM,gBAAgB,GAAG,OAAO,CAAC,MAAM,CAAC,oBAAoB,EAAE,MAAM,CAAC,CAAC,CAAC;AAE7E,iGAAiG;AACjG,eAAO,MAAM,0BAA0B,EAAE,gBAIxC,CAAC;AAEF;;;;GAIG;AACH,eAAO,MAAM,qBAAqB,GAChC,MAAM,MAAM,EACZ,QAAQ,gBAAgB,KACvB,gBAUF,CAAC;AAEF,uFAAuF;AACvF,eAAO,MAAM,mBAAmB,GAC9B,OAAO,gBAAgB,EACvB,OAAO,gBAAgB,KACtB,gBAWF,CAAC;AAIF;;;;GAIG;AACH,eAAO,MAAM,sBAAsB,GACjC,MAAM,MAAM,EACZ,eAAe,SAAS,MAAM,EAAE,EAChC,cAAc,MAAM,KACnB,MAAM,GAAG,SAaX,CAAC;AAEF,MAAM,MAAM,qBAAqB,GAAG;IAClC,iEAAiE;IACjE,KAAK,CAAC,EAAE,gBAAgB,CAAC;IACzB,wEAAwE;IACxE,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,KAAK,EAAE,gBAAgB,CAAC;IACxB,2EAA2E;IAC3E,aAAa,CAAC,EAAE,SAAS,MAAM,EAAE,CAAC;IAClC,uFAAuF;IACvF,QAAQ,CAAC,KAAK,EAAE,gBAAgB,GAAG,IAAI,CAAC;IACxC,QAAQ,IAAI,IAAI,CAAC;IACjB,gFAAgF;IAChF,QAAQ,CAAC,CAAC,KAAK,EAAE,gBAAgB,GAAG,IAAI,CAAC;IACzC,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AAEF;;;;GAIG;AACH,eAAO,MAAM,gBAAgB,GAAI,wFAS9B,qBAAqB,sBAuIvB,CAAC;AAkEF;;;;;GAKG;AACH,eAAO,MAAM,qBAAqB,GAAI,2BAGnC;IACD,aAAa,EAAE,KAAK,CAAC,iBAAiB,CAAC,CAAC;IACxC,KAAK,EAAE,gBAAgB,CAAC;CACzB,sBA2EA,CAAC"}