@rowsncolumns/spreadsheet 10.6.4 → 10.7.0

package/dist/esm/components/cell-structured/sparkline.js

@@ -1,7 +1,7 @@
 import React from "react";
 import { useCallback } from "react";
 import { Shape } from "react-konva";
-import { clampToExtents, resolveSparklineSeries, resolveSparklineExtents, } from "./sparkline-math";
+import { clampToExtents, OFFICE_DEFAULT_SPARKLINE_COLORS, resolveSparklineSeries, resolveSparklineExtents, } from "./sparkline-math";
 // Draw a diamond marker at the specified position
 const drawDiamond = (ctx, x, y, size, fillColor) => {
     ctx.beginPath();
@@ -13,7 +13,7 @@ const drawDiamond = (ctx, x, y, size, fillColor) => {
     ctx.fillStyle = fillColor;
     ctx.fill();
 };
-export const Sparkline = ({ x, y, width, height, data, options, color, sparklineGroupAxis, }) => {
+export const Sparkline = ({ x, y, width, height, data, options, sparklineGroupAxis, sparklineDefaultColors: defaultColors = OFFICE_DEFAULT_SPARKLINE_COLORS, }) => {
     const sparkLineFunction = useCallback((ctx, shape) => {
         // Guard against undefined data (formula not yet evaluated)
         if (!data || !Array.isArray(data)) {
@@ -21,8 +21,9 @@ export const Sparkline = ({ x, y, width, height, data, options, color, sparkline
         }
         const padding = 4;
         const paddingTop = 4;
-        const lineColor = options?.color ?? color ?? "#000000";
-        const fillColor = options?.color ?? color ?? "#000000";
+        // Excel paints the series in the group's colour, Style 1's when it has none — never the cell's.
+        const lineColor = options?.color ?? defaultColors.series;
+        const fillColor = lineColor;
         const lineWidth = typeof options?.lineweight === "number" && options.lineweight > 0
             ? options.lineweight
             : 1;
@@ -68,35 +69,27 @@ export const Sparkline = ({ x, y, width, height, data, options, color, sparkline
         const lastDataIndex = slots.reduce((m, slot) => (slot.dataIndex > m ? slot.dataIndex : m), -1);
         // Store points for markers
         const points = [];
-        // Per-column color resolution for "column" sparklines. Excel
-        // highlights individual columns when `high`/`low`/`first`/`last`/
-        // `negative` flags are on, painting the relevant column with its
-        // dedicated color override. We compute the fill per column rather
-        // than batching every rect into one fill so each column can have
-        // its own color.
-        const pickColumnColor = (value, slotIndex, dataIndex) => {
-            const isHigh = slotIndex === maxSlotIndex;
-            const isLow = slotIndex === minSlotIndex;
-            const isFirst = dataIndex === 0;
-            const isLast = dataIndex >= 0 && dataIndex === lastDataIndex;
-            const isNegative = value < 0;
-            if (options?.negative && isNegative) {
-                return options.colorNegative ?? "#FF0000";
+        // Excel's point highlights: each of Negative / High / Low / First / Last Points colours its
+        // point (a column, a bar or a line marker) only while it is checked — none is by default.
+        const pointHighlight = (value, slotIndex, dataIndex) => {
+            if (options?.negative && value < 0) {
+                return options.colorNegative ?? defaultColors.negative;
             }
-            if (options?.high && isHigh) {
-                return options.colorHigh ?? "#00B050";
+            if (options?.high && slotIndex === maxSlotIndex) {
+                return options.colorHigh ?? defaultColors.high;
             }
-            if (options?.low && isLow) {
-                return options.colorLow ?? "#FF0000";
+            if (options?.low && slotIndex === minSlotIndex) {
+                return options.colorLow ?? defaultColors.low;
             }
-            if (options?.first && isFirst) {
-                return options.colorFirst ?? fillColor;
+            if (options?.first && dataIndex === 0) {
+                return options.colorFirst ?? defaultColors.first;
             }
-            if (options?.last && isLast) {
-                return options.colorLast ?? fillColor;
+            if (options?.last && dataIndex >= 0 && dataIndex === lastDataIndex) {
+                return options.colorLast ?? defaultColors.last;
             }
-            return fillColor;
+            return undefined;
         };
+        const pickColumnColor = (value, slotIndex, dataIndex) => pointHighlight(value, slotIndex, dataIndex) ?? fillColor;
         // Draw the horizontal (zero) axis when requested via the `axis`
         // (displayXAxis) option. Only meaningful when zero falls inside
         // the vertical extents; winloss already anchors bars on zeroY.
@@ -169,21 +162,10 @@ export const Sparkline = ({ x, y, width, height, data, options, color, sparkline
                 const columnX = pointX + (xScale - columnWidth) / 2;
                 const barHeight = Math.abs(clamped) * yScale;
                 const barY = clamped >= 0 ? zeroY - barHeight : zeroY;
-                // Use different colors for positive/negative
-                ctx.fillStyle =
-                    value >= 0
-                        ? options?.color ?? "#00B050"
-                        : options?.colorNegative ?? "#FF0000";
+                // Wins and losses both paint in the series colour; Negative Points (and the other
+                // point toggles) recolour their bars, as on a column sparkline.
+                ctx.fillStyle = pickColumnColor(value, index, slot.dataIndex);
                 ctx.fillRect(columnX, barY, columnWidth, Math.max(barHeight, 2));
-                // Store points for diamond markers
-                const markerY = clamped >= 0 ? zeroY - barHeight : zeroY + barHeight;
-                points.push({
-                    x: pointX + xScale / 2,
-                    y: markerY,
-                    value,
-                    slotIndex: index,
-                    dataIndex: slot.dataIndex,
-                });
             }
         });
         // Stroke the line for 'line' type. Column sparklines are filled
@@ -191,56 +173,20 @@ export const Sparkline = ({ x, y, width, height, data, options, color, sparkline
         if (type === "line") {
             ctx.stroke();
         }
-        // Draw markers - enabled by default for line sparklines, always for winloss
-        // Can be disabled with markers: false
-        const showMarkers = options?.markers !== false && (type === "line" || isWinLoss);
-        if (showMarkers && points.length > 0) {
-            const markerSize = isWinLoss ? 4 : 3;
+        // Excel's markers are a line sparkline's: every point gets one only with "Markers" checked,
+        // and a checked point toggle marks its own point in its colour. Nothing by default.
+        if (type === "line") {
+            const markerSize = 3;
             points.forEach((point) => {
-                let markerColor;
-                // Determine marker color based on value and position.
-                // First/last follow the data order (dataIndex), so under
-                // `rtl` the "first" marker paints at the right edge.
-                const isFirst = point.dataIndex === 0;
-                const isLast = point.dataIndex >= 0 && point.dataIndex === lastDataIndex;
-                const isHigh = point.slotIndex === maxSlotIndex;
-                const isLow = point.slotIndex === minSlotIndex;
-                const isNegative = point.value < 0;
-                if (isWinLoss) {
-                    // Win/loss: green for positive, red for negative
-                    markerColor = isNegative
-                        ? options?.colorNegative ?? "#FF0000"
-                        : options?.colorHigh ?? options?.color ?? "#00B050";
-                }
-                else {
-                    // Line sparkline: use high/low colors for min/max points
-                    if (isHigh && isLow) {
-                        // Same point is both high and low (single point or all same)
-                        markerColor = options?.colorHigh ?? options?.color ?? lineColor;
-                    }
-                    else if (isHigh) {
-                        markerColor = options?.colorHigh ?? "#00B050";
-                    }
-                    else if (isLow) {
-                        markerColor = options?.colorLow ?? "#FF0000";
-                    }
-                    else if (isFirst && options?.colorFirst) {
-                        markerColor = options.colorFirst;
-                    }
-                    else if (isLast && options?.colorLast) {
-                        markerColor = options.colorLast;
-                    }
-                    else if (isNegative) {
-                        markerColor = options?.colorNegative ?? "#FF0000";
-                    }
-                    else {
-                        markerColor =
-                            options?.colorMarkers ?? options?.color ?? lineColor;
-                    }
+                const markerColor = pointHighlight(point.value, point.slotIndex, point.dataIndex) ??
+                    (options?.markers
+                        ? options.colorMarkers ?? defaultColors.markers
+                        : undefined);
+                if (markerColor) {
+                    drawDiamond(ctx, point.x, point.y, markerSize, markerColor);
                 }
-                drawDiamond(ctx, point.x, point.y, markerSize, markerColor);
             });
         }
-    }, [data, options, color, sparklineGroupAxis]);
+    }, [data, options, sparklineGroupAxis, defaultColors]);
     return (React.createElement(Shape, { x: x, y: y, width: width, height: height, sceneFunc: sparkLineFunction, listening: false }));
 };

package/dist/esm/components/cell-structured/types.d.ts

@@ -1,11 +1,17 @@
 import type { StructuredResult } from "@rowsncolumns/common-types";
 import type { CellProps } from "../cell/typings";
+import type { SparklineDefaultColors } from "./sparkline-math";
 export type StructuredResultProps<S extends StructuredResult = StructuredResult> = Pick<CellProps<S>, "structuredValue" | "sparklineGroupAxis"> & {
     x: number;
     y: number;
     width: number;
     height: number;
     color?: string;
+    /**
+     * The colours a sparkline paints where its formula sets none: Excel's Style 1 through the
+     * workbook theme. Without it, Style 1 under the Office 2013–2022 theme.
+     */
+    sparklineDefaultColors?: SparklineDefaultColors;
     textX?: number;
     textY?: number;
     textWidth?: number;

package/dist/esm/components/cell-structured/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../components/cell-structured/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,4BAA4B,CAAC;AAEnE,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,iBAAiB,CAAC;AAEjD,MAAM,MAAM,qBAAqB,CAC/B,CAAC,SAAS,gBAAgB,GAAG,gBAAgB,IAC3C,IAAI,CAAC,SAAS,CAAC,CAAC,CAAC,EAAE,iBAAiB,GAAG,oBAAoB,CAAC,GAAG;IACjE,CAAC,EAAE,MAAM,CAAC;IACV,CAAC,EAAE,MAAM,CAAC;IACV,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;IAEf,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,cAAc,CAAC,EAAE,MAAM,CAAC;CACzB,CAAC"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../components/cell-structured/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,4BAA4B,CAAC;AAEnE,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,iBAAiB,CAAC;AACjD,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,kBAAkB,CAAC;AAE/D,MAAM,MAAM,qBAAqB,CAC/B,CAAC,SAAS,gBAAgB,GAAG,gBAAgB,IAC3C,IAAI,CAAC,SAAS,CAAC,CAAC,CAAC,EAAE,iBAAiB,GAAG,oBAAoB,CAAC,GAAG;IACjE,CAAC,EAAE,MAAM,CAAC;IACV,CAAC,EAAE,MAAM,CAAC;IACV,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;;OAGG;IACH,sBAAsB,CAAC,EAAE,sBAAsB,CAAC;IAEhD,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,cAAc,CAAC,EAAE,MAAM,CAAC;CACzB,CAAC"}

package/dist/esm/components/data-table-dialog/index.d.ts

@@ -0,0 +1,22 @@
+import React from "react";
+/** Excel's refusal for an empty dialog or a reference that is not one cell. */
+export declare const DATA_TABLE_INPUT_MESSAGE = "Input cell reference is not valid.";
+export type DataTableDialogProps = {
+    /** Controls visibility. */
+    open: boolean;
+    onOpenChange(open: boolean): void;
+    /**
+     * Creates the table over the current selection (formula row / column and
+     * input values included) with the given A1 input cells, either of which may
+     * be empty. Resolves to Excel's refusal message when the engine refused
+     * (e.g. "Cannot change part of a data table."), `undefined` on success.
+     */
+    onApply(rowInputCell: string | undefined, columnInputCell: string | undefined): Promise<string | undefined> | string | undefined;
+};
+/**
+ * Excel's Data ▸ What-If Analysis ▸ Data Table… dialog: Row input cell /
+ * Column input cell. One of them makes a one-variable table, both a
+ * two-variable table.
+ */
+export declare const DataTableDialog: React.MemoExoticComponent<({ open, onOpenChange, onApply }: DataTableDialogProps) => React.JSX.Element>;
+//# sourceMappingURL=index.d.ts.map

package/dist/esm/components/data-table-dialog/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../components/data-table-dialog/index.tsx"],"names":[],"mappings":"AAaA,OAAO,KAAiD,MAAM,OAAO,CAAC;AAEtE,+EAA+E;AAC/E,eAAO,MAAM,wBAAwB,uCAAuC,CAAC;AAE7E,MAAM,MAAM,oBAAoB,GAAG;IACjC,2BAA2B;IAC3B,IAAI,EAAE,OAAO,CAAC;IACd,YAAY,CAAC,IAAI,EAAE,OAAO,GAAG,IAAI,CAAC;IAClC;;;;;OAKG;IACH,OAAO,CACL,YAAY,EAAE,MAAM,GAAG,SAAS,EAChC,eAAe,EAAE,MAAM,GAAG,SAAS,GAClC,OAAO,CAAC,MAAM,GAAG,SAAS,CAAC,GAAG,MAAM,GAAG,SAAS,CAAC;CACrD,CAAC;AAKF;;;;GAIG;AACH,eAAO,MAAM,eAAe,8DAA0C,oBAAoB,uBAoGxF,CAAC"}

package/dist/esm/components/data-table-dialog/index.js

@@ -0,0 +1,75 @@
+import { Cross1Icon } from "@rowsncolumns/icons";
+import { Button, Dialog, DialogBody, DialogCloseButton, DialogContent, DialogDescription, DialogTitle, Input, Separator, } from "@rowsncolumns/ui";
+import { addressToCell } from "@rowsncolumns/utils";
+import React, { memo, useCallback, useEffect, useState } from "react";
+/** Excel's refusal for an empty dialog or a reference that is not one cell. */
+export const DATA_TABLE_INPUT_MESSAGE = "Input cell reference is not valid.";
+const isCellReference = (text) => /^\$?[A-Za-z]{1,3}\$?\d+$/.test(text.trim()) && addressToCell(text.trim()) != null;
+/**
+ * Excel's Data ▸ What-If Analysis ▸ Data Table… dialog: Row input cell /
+ * Column input cell. One of them makes a one-variable table, both a
+ * two-variable table.
+ */
+export const DataTableDialog = memo(({ open, onOpenChange, onApply }) => {
+    const [rowInput, setRowInput] = useState("");
+    const [columnInput, setColumnInput] = useState("");
+    const [error, setError] = useState(undefined);
+    const [busy, setBusy] = useState(false);
+    useEffect(() => {
+        if (open) {
+            setRowInput("");
+            setColumnInput("");
+            setError(undefined);
+            setBusy(false);
+        }
+    }, [open]);
+    const submit = useCallback(async (event) => {
+        event.preventDefault();
+        const row = rowInput.trim();
+        const column = columnInput.trim();
+        if ((row === "" && column === "") ||
+            (row !== "" && !isCellReference(row)) ||
+            (column !== "" && !isCellReference(column))) {
+            setError(DATA_TABLE_INPUT_MESSAGE);
+            return;
+        }
+        setBusy(true);
+        try {
+            const refusal = await onApply(row === "" ? undefined : row.replace(/\$/g, "").toUpperCase(), column === "" ? undefined : column.replace(/\$/g, "").toUpperCase());
+            if (refusal) {
+                setError(refusal);
+                return;
+            }
+            onOpenChange(false);
+        }
+        finally {
+            setBusy(false);
+        }
+    }, [rowInput, columnInput, onApply, onOpenChange]);
+    return (React.createElement(Dialog, { open: open, onOpenChange: onOpenChange },
+        React.createElement(DialogContent, { className: "w-[320px] max-w-[92vw] pointer-events-auto" },
+            React.createElement(DialogTitle, null, "Data Table"),
+            React.createElement(DialogDescription, null, "Substitute each value of the selection's first row and column into the input cells."),
+            React.createElement(DialogCloseButton, { onClick: () => onOpenChange(false) },
+                React.createElement(Cross1Icon, null)),
+            React.createElement(DialogBody, { className: "flex flex-col gap-3 font-system text-sm" },
+                React.createElement("form", { className: "flex flex-col gap-3", onSubmit: submit },
+                    React.createElement("label", { className: "flex flex-col gap-1 text-xs font-medium" },
+                        "Row input cell:",
+                        React.createElement(Input, { autoFocus: true, value: rowInput, "aria-label": "Row input cell", onChange: (e) => {
+                                setRowInput(e.target.value);
+                                setError(undefined);
+                            } })),
+                    React.createElement("label", { className: "flex flex-col gap-1 text-xs font-medium" },
+                        "Column input cell:",
+                        React.createElement(Input, { value: columnInput, "aria-label": "Column input cell", onChange: (e) => {
+                                setColumnInput(e.target.value);
+                                setError(undefined);
+                            } })),
+                    error ? (React.createElement("div", { role: "alert", className: "text-xs text-rnc-destructive" }, error)) : null,
+                    React.createElement(Separator, null),
+                    React.createElement("div", { className: "flex justify-end gap-2" },
+                        React.createElement(Button, { type: "button", variant: "outline", size: "sm", onClick: () => onOpenChange(false) }, "Cancel"),
+                        React.createElement(Button, { type: "submit", size: "sm", disabled: busy }, "OK")))))));
+});
+DataTableDialog.displayName = "DataTableDialog";

package/dist/esm/components/error-check-smart-tag/index.d.ts

@@ -0,0 +1,27 @@
+import React from "react";
+import { type ErrorCheckKind, type ErrorCheckOption } from "../../api/error-checking";
+export type ErrorCheckSmartTagProps = {
+    /** The active cell's rectangle; the button sits beside it (left, or right in column A). */
+    x: number;
+    y: number;
+    width: number;
+    height: number;
+    kind: ErrorCheckKind;
+    /** The error value's name (`#VALUE!`) for a formula error. */
+    errorName?: string;
+    open: boolean;
+    onOpenChange(open: boolean): void;
+    onChooseOption(option: ErrorCheckOption): void;
+};
+/**
+ * Excel's error-checking smart tag: beside the active cell when that cell carries the green ◤.
+ * The menu names the error, then offers Convert to Number (numbers stored as text), Help on this
+ * Error, Ignore Error, Edit in Formula Bar and Error Checking Options. Alt+Shift+F10 opens it
+ * ("Alt+Shift+F10: displays the menu or message for an Error Checking button" —
+ * https://support.microsoft.com/en-us/office/keyboard-shortcuts-in-excel-1798d9d5-842a-42b8-9c99-9b7213f0040f).
+ */
+export declare const ErrorCheckSmartTag: {
+    ({ x, y, width, kind, errorName, open, onOpenChange, onChooseOption, }: ErrorCheckSmartTagProps): React.JSX.Element;
+    displayName: string;
+};
+//# sourceMappingURL=index.d.ts.map

package/dist/esm/components/error-check-smart-tag/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../components/error-check-smart-tag/index.tsx"],"names":[],"mappings":"AAUA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EACL,KAAK,cAAc,EACnB,KAAK,gBAAgB,EAEtB,MAAM,0BAA0B,CAAC;AAElC,MAAM,MAAM,uBAAuB,GAAG;IACpC,2FAA2F;IAC3F,CAAC,EAAE,MAAM,CAAC;IACV,CAAC,EAAE,MAAM,CAAC;IACV,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;IACf,IAAI,EAAE,cAAc,CAAC;IACrB,8DAA8D;IAC9D,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,IAAI,EAAE,OAAO,CAAC;IACd,YAAY,CAAC,IAAI,EAAE,OAAO,GAAG,IAAI,CAAC;IAClC,cAAc,CAAC,MAAM,EAAE,gBAAgB,GAAG,IAAI,CAAC;CAChD,CAAC;AAYF;;;;;;GAMG;AACH,eAAO,MAAM,kBAAkB;4EAS5B,uBAAuB;;CAgDzB,CAAC"}

package/dist/esm/components/error-check-smart-tag/index.js

@@ -0,0 +1,33 @@
+import { DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuSeparator, DropdownMenuTrigger, IconButton, } from "@rowsncolumns/ui";
+import React from "react";
+import { getErrorCheckTitle, } from "../../api/error-checking";
+const BUTTON_SIZE = 22;
+/** Excel's error-checking button: a yellow diamond with an exclamation mark. */
+const WarningIcon = () => (React.createElement("svg", { width: "14", height: "14", viewBox: "0 0 24 24", "aria-hidden": "true" },
+    React.createElement("path", { d: "M12 1.5 22.5 12 12 22.5 1.5 12z", fill: "#F2C811", stroke: "#8A6D00", strokeWidth: "1" }),
+    React.createElement("path", { d: "M11 6.5h2v8h-2zM11 16.5h2v2h-2z", fill: "#1F1F1F" })));
+/**
+ * Excel's error-checking smart tag: beside the active cell when that cell carries the green ◤.
+ * The menu names the error, then offers Convert to Number (numbers stored as text), Help on this
+ * Error, Ignore Error, Edit in Formula Bar and Error Checking Options. Alt+Shift+F10 opens it
+ * ("Alt+Shift+F10: displays the menu or message for an Error Checking button" —
+ * https://support.microsoft.com/en-us/office/keyboard-shortcuts-in-excel-1798d9d5-842a-42b8-9c99-9b7213f0040f).
+ */
+export const ErrorCheckSmartTag = ({ x, y, width, kind, errorName, open, onOpenChange, onChooseOption, }) => {
+    const left = x >= BUTTON_SIZE + 2 ? x - BUTTON_SIZE - 2 : x + width + 2;
+    return (React.createElement("div", { className: "absolute pointer-events-auto flex items-start justify-start", style: { left, top: y }, onMouseDown: (e) => e.stopPropagation(), "data-testid": "error-check-smart-tag" },
+        React.createElement(DropdownMenu, { modal: false, open: open, onOpenChange: onOpenChange },
+            React.createElement(DropdownMenuTrigger, { asChild: true },
+                React.createElement(IconButton, { tooltip: "Error Checking", "aria-label": "Error Checking", className: "shadow-sm bg-rnc-background border-rnc-border border border-solid rounded-md" },
+                    React.createElement(WarningIcon, null))),
+            React.createElement(DropdownMenuPortal, null,
+                React.createElement(DropdownMenuContent, { align: "start", onCloseAutoFocus: (event) => event.preventDefault() },
+                    React.createElement(DropdownMenuLabel, null, getErrorCheckTitle(kind, errorName)),
+                    kind === "numberStoredAsText" ? (React.createElement(DropdownMenuItem, { onSelect: () => onChooseOption("convertToNumber") }, "Convert to Number")) : null,
+                    React.createElement(DropdownMenuItem, { onSelect: () => onChooseOption("help") }, "Help on this Error"),
+                    React.createElement(DropdownMenuItem, { onSelect: () => onChooseOption("ignore") }, "Ignore Error"),
+                    React.createElement(DropdownMenuItem, { onSelect: () => onChooseOption("editInFormulaBar") }, "Edit in Formula Bar"),
+                    React.createElement(DropdownMenuSeparator, null),
+                    React.createElement(DropdownMenuItem, { onSelect: () => onChooseOption("options") }, "Error Checking Options\u2026"))))));
+};
+ErrorCheckSmartTag.displayName = "ErrorCheckSmartTag";

package/dist/esm/components/forecast-sheet-dialog/index.d.ts

@@ -0,0 +1,26 @@
+import React from "react";
+/** What the dialog asks for (the `create-forecast-sheet` command's options). */
+export type ForecastSheetOptions = {
+    chartType: "line" | "column";
+    /** Forecast End as typed (a number or a date the host parses). */
+    forecastEnd?: string;
+    /** Fraction, e.g. 0.95; 0 = no confidence bounds. */
+    confidenceInterval: number;
+    /** `undefined` = detect automatically. */
+    seasonality?: number;
+};
+export type ForecastSheetDialogProps = {
+    open: boolean;
+    onOpenChange(open: boolean): void;
+    /** Default Forecast End shown in the field (the host's suggestion), optional. */
+    initialForecastEnd?: string;
+    /** Creates the sheet; resolves to Excel's refusal message, or `undefined` once done. */
+    onCreate(options: ForecastSheetOptions): Promise<string | undefined> | string | undefined;
+};
+/**
+ * Excel's Create Forecast Worksheet dialog: Line or Column chart, Forecast
+ * End, and the Options — Confidence Interval and Seasonality (automatic or
+ * set manually). The timeline and values are the host's selection.
+ */
+export declare const ForecastSheetDialog: React.MemoExoticComponent<({ open, onOpenChange, initialForecastEnd, onCreate }: ForecastSheetDialogProps) => React.JSX.Element>;
+//# sourceMappingURL=index.d.ts.map

package/dist/esm/components/forecast-sheet-dialog/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../components/forecast-sheet-dialog/index.tsx"],"names":[],"mappings":"AAYA,OAAO,KAAiD,MAAM,OAAO,CAAC;AAEtE,gFAAgF;AAChF,MAAM,MAAM,oBAAoB,GAAG;IACjC,SAAS,EAAE,MAAM,GAAG,QAAQ,CAAC;IAC7B,kEAAkE;IAClE,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,qDAAqD;IACrD,kBAAkB,EAAE,MAAM,CAAC;IAC3B,0CAA0C;IAC1C,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB,CAAC;AAEF,MAAM,MAAM,wBAAwB,GAAG;IACrC,IAAI,EAAE,OAAO,CAAC;IACd,YAAY,CAAC,IAAI,EAAE,OAAO,GAAG,IAAI,CAAC;IAClC,iFAAiF;IACjF,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,wFAAwF;IACxF,QAAQ,CAAC,OAAO,EAAE,oBAAoB,GAAG,OAAO,CAAC,MAAM,GAAG,SAAS,CAAC,GAAG,MAAM,GAAG,SAAS,CAAC;CAC3F,CAAC;AAEF;;;;GAIG;AACH,eAAO,MAAM,mBAAmB,mFACyB,wBAAwB,uBA6HhF,CAAC"}

package/dist/esm/components/forecast-sheet-dialog/index.js

@@ -0,0 +1,83 @@
+import { Cross1Icon } from "@rowsncolumns/icons";
+import { Button, Dialog, DialogBody, DialogCloseButton, DialogContent, DialogDescription, DialogTitle, Input, Separator, } from "@rowsncolumns/ui";
+import React, { memo, useCallback, useEffect, useState } from "react";
+/**
+ * Excel's Create Forecast Worksheet dialog: Line or Column chart, Forecast
+ * End, and the Options — Confidence Interval and Seasonality (automatic or
+ * set manually). The timeline and values are the host's selection.
+ */
+export const ForecastSheetDialog = memo(({ open, onOpenChange, initialForecastEnd, onCreate }) => {
+    const [chartType, setChartType] = useState("line");
+    const [end, setEnd] = useState(initialForecastEnd ?? "");
+    const [withInterval, setWithInterval] = useState(true);
+    const [interval, setInterval] = useState("95");
+    const [autoSeason, setAutoSeason] = useState(true);
+    const [season, setSeason] = useState("");
+    const [error, setError] = useState(undefined);
+    useEffect(() => {
+        if (open) {
+            setEnd(initialForecastEnd ?? "");
+            setError(undefined);
+        }
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, [open]);
+    const submit = useCallback(async (event) => {
+        event.preventDefault();
+        const percent = Number(interval);
+        if (withInterval && !(percent > 0 && percent < 100)) {
+            setError("Confidence Interval must be between 0% and 100%.");
+            return;
+        }
+        const length = Number(season);
+        if (!autoSeason && !(Number.isInteger(length) && length >= 0)) {
+            setError("Seasonality must be a whole number.");
+            return;
+        }
+        const refusal = await onCreate({
+            chartType,
+            ...(end.trim() !== "" ? { forecastEnd: end.trim() } : {}),
+            confidenceInterval: withInterval ? percent / 100 : 0,
+            ...(autoSeason ? {} : { seasonality: length }),
+        });
+        if (refusal) {
+            setError(refusal);
+            return;
+        }
+        onOpenChange(false);
+    }, [interval, withInterval, season, autoSeason, chartType, end, onCreate, onOpenChange]);
+    return (React.createElement(Dialog, { open: open, onOpenChange: onOpenChange },
+        React.createElement(DialogContent, { className: "w-[380px] max-w-[92vw] pointer-events-auto" },
+            React.createElement(DialogTitle, null, "Create Forecast Worksheet"),
+            React.createElement(DialogDescription, null, "Forecast the selected timeline and values on a new sheet with a chart."),
+            React.createElement(DialogCloseButton, { onClick: () => onOpenChange(false) },
+                React.createElement(Cross1Icon, null)),
+            React.createElement(DialogBody, { className: "flex flex-col gap-3 font-system text-sm" },
+                React.createElement("form", { className: "flex flex-col gap-3", onSubmit: submit },
+                    React.createElement("div", { className: "flex items-center gap-3 text-xs" }, ["line", "column"].map((t) => (React.createElement("label", { key: t, className: "flex items-center gap-1" },
+                        React.createElement("input", { type: "radio", checked: chartType === t, onChange: () => setChartType(t) }),
+                        t === "line" ? "Line chart" : "Column chart")))),
+                    React.createElement("label", { className: "flex flex-col gap-1 text-xs font-medium" },
+                        "Forecast End:",
+                        React.createElement(Input, { autoFocus: true, "aria-label": "Forecast End", value: end, onChange: (e) => setEnd(e.target.value) })),
+                    React.createElement("div", { className: "flex items-center gap-2 text-xs" },
+                        React.createElement("label", { className: "flex items-center gap-2" },
+                            React.createElement("input", { type: "checkbox", checked: withInterval, onChange: (e) => setWithInterval(e.target.checked) }),
+                            "Confidence Interval"),
+                        React.createElement(Input, { className: "w-16", "aria-label": "Confidence Interval (%)", value: interval, disabled: !withInterval, onChange: (e) => setInterval(e.target.value) }),
+                        "%"),
+                    React.createElement("div", { className: "flex flex-col gap-1 text-xs" },
+                        "Seasonality",
+                        React.createElement("label", { className: "flex items-center gap-2" },
+                            React.createElement("input", { type: "radio", checked: autoSeason, onChange: () => setAutoSeason(true) }),
+                            "Detect Automatically"),
+                        React.createElement("label", { className: "flex items-center gap-2" },
+                            React.createElement("input", { type: "radio", checked: !autoSeason, onChange: () => setAutoSeason(false) }),
+                            "Set Manually",
+                            React.createElement(Input, { className: "w-16", "aria-label": "Season length", value: season, disabled: autoSeason, onChange: (e) => setSeason(e.target.value) }))),
+                    error ? (React.createElement("div", { role: "alert", className: "text-xs text-rnc-destructive" }, error)) : null,
+                    React.createElement(Separator, null),
+                    React.createElement("div", { className: "flex justify-end gap-2" },
+                        React.createElement(Button, { type: "button", variant: "outline", size: "sm", onClick: () => onOpenChange(false) }, "Cancel"),
+                        React.createElement(Button, { type: "submit", size: "sm" }, "Create")))))));
+});
+ForecastSheetDialog.displayName = "ForecastSheetDialog";

package/dist/esm/components/paste-special-dialog/index.d.ts

@@ -11,9 +11,9 @@ export type PasteSpecialDialogProps = {
     onApply(options: PasteSpecialOptions): void;
 };
 /**
- * Excel's Paste Special dialog: what to paste (all / formulas / values /
- * formats), an arithmetic operation against the destination, skip blanks and
- * transpose. Every choice composes into one `PasteSpecialOptions` request.
+ * Excel's Paste Special dialog: what to paste (Excel's twelve Paste choices),
+ * an arithmetic operation against the destination, skip blanks, transpose and
+ * Paste Link. Every choice composes into one `PasteSpecialOptions` request.
  */
 export declare const PasteSpecialDialog: React.MemoExoticComponent<({ open, onOpenChange, onApply }: PasteSpecialDialogProps) => React.JSX.Element>;
 /**

package/dist/esm/components/paste-special-dialog/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../components/paste-special-dialog/index.tsx"],"names":[],"mappings":"AASA,OAAO,KAAsC,MAAM,OAAO,CAAC;AAM3D,OAAO,KAAK,EAEV,mBAAmB,EACpB,MAAM,gCAAgC,CAAC;AAoBxC,MAAM,MAAM,uBAAuB,GAAG;IACpC,2BAA2B;IAC3B,IAAI,EAAE,OAAO,CAAC;IACd,YAAY,CAAC,IAAI,EAAE,OAAO,GAAG,IAAI,CAAC;IAClC;;;OAGG;IACH,OAAO,CAAC,OAAO,EAAE,mBAAmB,GAAG,IAAI,CAAC;CAC7C,CAAC;AAyCF;;;;GAIG;AACH,eAAO,MAAM,kBAAkB,8DACK,uBAAuB,uBA2F1D,CAAC;AAIF;;;;;GAKG;AACH,eAAO,MAAM,sBAAsB;;;CAclC,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../components/paste-special-dialog/index.tsx"],"names":[],"mappings":"AASA,OAAO,KAAsC,MAAM,OAAO,CAAC;AAM3D,OAAO,KAAK,EAGV,mBAAmB,EACpB,MAAM,gCAAgC,CAAC;AA+CxC,MAAM,MAAM,uBAAuB,GAAG;IACpC,2BAA2B;IAC3B,IAAI,EAAE,OAAO,CAAC;IACd,YAAY,CAAC,IAAI,EAAE,OAAO,GAAG,IAAI,CAAC;IAClC;;;OAGG;IACH,OAAO,CAAC,OAAO,EAAE,mBAAmB,GAAG,IAAI,CAAC;CAC7C,CAAC;AAoEF;;;;GAIG;AACH,eAAO,MAAM,kBAAkB,8DACK,uBAAuB,uBAsG1D,CAAC;AAIF;;;;;GAKG;AACH,eAAO,MAAM,sBAAsB;;;CAclC,CAAC"}