@rowsncolumns/spreadsheet 10.2.68

package/dist/cjs/hooks/use-spreadsheet-theme.js

@@ -0,0 +1,55 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useSpreadsheetTheme = void 0;
+var react_1 = require("react");
+var config_1 = require("../config");
+var use_isomorphic_layout_effect_1 = require("./use-isomorphic-layout-effect");
+/**
+ * Spreadsheet theme extended with color mode
+ * @param spreadsheetTheme
+ * @returns
+ */
+var useSpreadsheetTheme = function (_a) {
+    var colorMode = _a.colorMode, _b = _a.theme, theme = _b === void 0 ? config_1.defaultSpreadsheetTheme : _b, _c = _a.darkThemeClassName, darkThemeClassName = _c === void 0 ? "rnc-dark" : _c;
+    var isDarkMode = colorMode === "dark";
+    // Persist color mode
+    (0, use_isomorphic_layout_effect_1.useIsomorphicLayoutEffect)(function () {
+        // Update classname
+        document.documentElement.classList.toggle(darkThemeClassName, colorMode === "dark");
+    }, [colorMode, darkThemeClassName]);
+    return (0, react_1.useMemo)(function () { return ({
+        gridLineColor: isDarkMode ? config_1.GRIDLINE_COLOR_DARK : config_1.GRIDLINE_COLOR,
+        cellBackgroundColor: isDarkMode
+            ? config_1.DEFAULT_CELL_BACKGROUND_COLOR_DARK
+            : config_1.DEFAULT_CELL_BACKGROUND_COLOR,
+        headerBackgroundColor: isDarkMode
+            ? config_1.DEFAULT_HEADER_BG_DARK
+            : config_1.DEFAULT_HEADER_BG,
+        headerColor: isDarkMode
+            ? config_1.DEFAULT_HEADER_COLOR_DARK
+            : config_1.DEFAULT_HEADER_COLOR,
+        headerBorderColor: isDarkMode
+            ? config_1.DEFAULT_HEADER_BORDER_COLOR_DARK
+            : config_1.DEFAULT_HEADER_BORDER_COLOR,
+        headerActiveBackgroundColor: isDarkMode
+            ? config_1.DEFAULT_HEADER_ACTIVE_BG_DARK
+            : config_1.DEFAULT_HEADER_ACTIVE_BG,
+        headerTableBackgroundColor: isDarkMode
+            ? config_1.DEFAULT_HEADER_TABLE_BG_DARK
+            : config_1.DEFAULT_HEADER_TABLE_BG,
+        headerTableActiveBackgroundColor: isDarkMode
+            ? config_1.DEFAULT_HEADER_ACTIVE_TABLE_BG_DARK
+            : config_1.DEFAULT_HEADER_ACTIVE_TABLE_BG,
+        chipBackgroundColor: isDarkMode ? config_1.CHIP_COLOR_DARK : config_1.CHIP_COLOR,
+        selectionBorderColor: isDarkMode ? "#008000" : config_1.SELECTION_BORDER,
+        selectionBackgroundColor: isDarkMode
+            ? "rgba(0, 255, 0, 0.1)"
+            : config_1.SELECTION_BG,
+        selectionDragBorderColor: isDarkMode ? "#008000" : config_1.SELECTION_BORDER,
+        tableBorderColor: theme.themeColors.accent1,
+        filterIconColor: theme.themeColors.accent1,
+        cellColor: { theme: 1, tint: isDarkMode ? 1 : 0 },
+        isDarkMode: isDarkMode,
+    }); }, [isDarkMode, theme]);
+};
+exports.useSpreadsheetTheme = useSpreadsheetTheme;

package/dist/cjs/hooks/use-stable-ref.d.ts

@@ -0,0 +1,2 @@
+export declare const useStableRef: <T>(value: T) => import("react").RefObject<T | undefined>;
+//# sourceMappingURL=use-stable-ref.d.ts.map

package/dist/cjs/hooks/use-stable-ref.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-stable-ref.d.ts","sourceRoot":"","sources":["../../../hooks/use-stable-ref.ts"],"names":[],"mappings":"AAIA,eAAO,MAAM,YAAY,GAAI,CAAC,EAAE,OAAO,CAAC,6CAQvC,CAAC"}

package/dist/cjs/hooks/use-stable-ref.js

@@ -0,0 +1,14 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useStableRef = void 0;
+var react_1 = require("react");
+var use_isomorphic_layout_effect_1 = require("./use-isomorphic-layout-effect");
+var useStableRef = function (value) {
+    var ref = (0, react_1.useRef)(undefined);
+    // Escape from closures
+    (0, use_isomorphic_layout_effect_1.useIsomorphicLayoutEffect)(function () {
+        ref.current = value;
+    }, [value]);
+    return ref;
+};
+exports.useStableRef = useStableRef;

package/dist/cjs/hooks/use-structured-reference-selection.d.ts

@@ -0,0 +1,23 @@
+import type { ParsedToken } from "@rowsncolumns/calculator";
+import type { CellInterface } from "@rowsncolumns/grid";
+import type { CanvasGridProps } from "../components/canvas-grid/typings";
+import type { TableView } from "./../types";
+export declare const useOnStructuredReferenceSelection: ({ tables, getSheetName, }: {
+    tables: TableView[] | undefined | null;
+    getSheetName: CanvasGridProps["getSheetName"];
+}) => (sheetId: number, cell: CellInterface | undefined, tableName: string | undefined, columnNames: string[] | undefined, thisRow: boolean | undefined, specialItem?: ParsedToken["specialItem"]) => {
+    range: {
+        startColumnIndex: number;
+        endColumnIndex: number;
+        startRowIndex: number;
+        endRowIndex: number;
+        sheetId: number;
+    } | {
+        startColumnIndex: number;
+        endColumnIndex: number;
+        startRowIndex: number;
+        endRowIndex: number;
+    };
+    sheetName: string | undefined;
+} | undefined;
+//# sourceMappingURL=use-structured-reference-selection.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"use-structured-reference-selection.d.ts","sourceRoot":"","sources":["../../../hooks/use-structured-reference-selection.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAC;AAC5D,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,oBAAoB,CAAC;AAMxD,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,mCAAmC,CAAC;AAEzE,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,YAAY,CAAC;AAE5C,eAAO,MAAM,iCAAiC,GAAI,2BAG/C;IACD,MAAM,EAAE,SAAS,EAAE,GAAG,SAAS,GAAG,IAAI,CAAC;IACvC,YAAY,EAAE,eAAe,CAAC,cAAc,CAAC,CAAC;CAC/C,eAGc,MAAM,QACT,aAAa,GAAG,SAAS,aACpB,MAAM,GAAG,SAAS,eAChB,MAAM,EAAE,GAAG,SAAS,WACxB,OAAO,GAAG,SAAS,gBACd,WAAW,CAAC,aAAa,CAAC;;;;;;;;;;;;;;aA6H7C,CAAC"}

package/dist/cjs/hooks/use-structured-reference-selection.js

@@ -0,0 +1,103 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useOnStructuredReferenceSelection = void 0;
+var tslib_1 = require("tslib");
+var grid_1 = require("@rowsncolumns/grid");
+var utils_1 = require("@rowsncolumns/utils");
+var react_1 = require("react");
+var selections_1 = require("../api/selections");
+var config_1 = require("../config");
+var useOnStructuredReferenceSelection = function (_a) {
+    var tables = _a.tables, getSheetName = _a.getSheetName;
+    return (0, react_1.useCallback)(function (sheetId, cell, tableName, columnNames, thisRow, specialItem) {
+        var _a, _b;
+        if (specialItem === "#This Row") {
+            thisRow = true;
+        }
+        // If there is no tablename, we need to find table based
+        // on cell
+        var table = tables === null || tables === void 0 ? void 0 : tables.find(function (table) {
+            if (tableName) {
+                return table.title === tableName;
+            }
+            return cell
+                ? (0, grid_1.isCellWithinBounds)(cell, table.range) && table.sheetId === sheetId
+                : true;
+        });
+        // Current row
+        var rowIndex = (cell !== null && cell !== void 0 ? cell : config_1.DEFAULT_ACTIVE_CELL).rowIndex;
+        if (table) {
+            var range = table.range;
+            var headerRow = (_a = table.headerRow) !== null && _a !== void 0 ? _a : true;
+            var totalRow = (_b = table.totalRow) !== null && _b !== void 0 ? _b : false;
+            var headerRowOffset = headerRow ? 1 : 0;
+            var totalRowOffset = totalRow ? 1 : 0;
+            var sheetName = getSheetName === null || getSheetName === void 0 ? void 0 : getSheetName(table.sheetId);
+            var _c = tslib_1.__read(columnNames !== null && columnNames !== void 0 ? columnNames : [], 2), from = _c[0], to = _c[1];
+            var startColIndex = (0, selections_1.getColumnIndexFromColumnName)(table, from);
+            var endColIndex = (0, selections_1.getColumnIndexFromColumnName)(table, to);
+            var startColumnIndex = (0, utils_1.isNil)(startColIndex)
+                ? range.startColumnIndex
+                : startColIndex;
+            var endColumnIndex = (0, utils_1.isNil)(endColIndex) && (0, utils_1.isNil)(startColIndex)
+                ? range.endColumnIndex
+                : (0, utils_1.isNil)(endColIndex)
+                    ? startColumnIndex
+                    : endColIndex;
+            // Headers only
+            if (specialItem === "#Headers") {
+                return {
+                    range: tslib_1.__assign(tslib_1.__assign({}, range), { startColumnIndex: startColumnIndex, endColumnIndex: endColumnIndex, startRowIndex: range.startRowIndex, endRowIndex: range.startRowIndex }),
+                    sheetName: sheetName,
+                };
+            }
+            // All
+            if (specialItem === "#All") {
+                return {
+                    range: tslib_1.__assign(tslib_1.__assign({}, range), { startColumnIndex: startColumnIndex, endColumnIndex: endColumnIndex }),
+                    sheetName: sheetName,
+                };
+            }
+            // All
+            if (specialItem === "#Data") {
+                return {
+                    range: tslib_1.__assign(tslib_1.__assign({}, range), { startColumnIndex: startColumnIndex, endColumnIndex: endColumnIndex, startRowIndex: range.startRowIndex + headerRowOffset, endRowIndex: range.endRowIndex - totalRowOffset }),
+                    sheetName: sheetName,
+                };
+            }
+            if (!from && !to) {
+                return {
+                    range: {
+                        startRowIndex: thisRow
+                            ? rowIndex
+                            : range.startRowIndex + headerRowOffset,
+                        endRowIndex: thisRow
+                            ? rowIndex
+                            : range.endRowIndex - totalRowOffset,
+                        startColumnIndex: startColumnIndex,
+                        endColumnIndex: endColumnIndex,
+                    },
+                    sheetName: sheetName,
+                };
+            }
+            // If column is not found, lets not select anything
+            if (startColIndex === -1 || (0, utils_1.isNil)(startColIndex)) {
+                return undefined;
+            }
+            // Check if thisrow is active and current cell is in bounds
+            if (thisRow &&
+                (rowIndex < range.startRowIndex || rowIndex > range.endRowIndex)) {
+                return undefined;
+            }
+            return {
+                range: tslib_1.__assign(tslib_1.__assign({}, range), { startRowIndex: thisRow
+                        ? rowIndex
+                        : range.startRowIndex + headerRowOffset, endRowIndex: thisRow
+                        ? rowIndex
+                        : range.endRowIndex - totalRowOffset, startColumnIndex: startColumnIndex, endColumnIndex: endColumnIndex }),
+                sheetName: getSheetName === null || getSheetName === void 0 ? void 0 : getSheetName(table.sheetId),
+            };
+        }
+    }, [tables, getSheetName]);
+};
+exports.useOnStructuredReferenceSelection = useOnStructuredReferenceSelection;

package/dist/cjs/hooks/use-table-resizer.d.ts

@@ -0,0 +1,23 @@
+import type { Align, CellInterface, OptionalCellInterface } from "@rowsncolumns/grid";
+import React from "react";
+import type { CanvasGridProps, SpreadsheetTheme } from "../components/canvas-grid/typings";
+import type { TableView } from "../types";
+type UseTableResizerProps = {
+    sheetId: number;
+    tables?: TableView[];
+    theme: SpreadsheetTheme;
+    newSelection: (start: CellInterface, end?: CellInterface) => void;
+    modifySelection: (coords: CellInterface, setInProgress?: boolean | undefined) => void;
+    clearSelections(): void;
+    getCellCoordsFromOffset: (x: number, y: number, includeFrozen?: boolean) => CellInterface | undefined;
+    onResizeTable?: CanvasGridProps["onResizeTable"];
+    scrollToCell: (cell: OptionalCellInterface, align?: Align | undefined) => void | undefined;
+    focusSheet(): void;
+};
+export declare const useTableResizer: ({ sheetId, tables, theme, newSelection, modifySelection, clearSelections, onResizeTable, getCellCoordsFromOffset, scrollToCell, focusSheet, }: UseTableResizerProps) => {
+    tableResizers: React.JSX.Element[] | undefined;
+    isResizingTable: boolean;
+};
+export declare const StyledResizeButton: React.ForwardRefExoticComponent<Omit<import("@rowsncolumns/ui").ButtonProps & React.RefAttributes<HTMLButtonElement>, "ref"> & React.RefAttributes<HTMLButtonElement>>;
+export {};
+//# sourceMappingURL=use-table-resizer.d.ts.map

package/dist/cjs/hooks/use-table-resizer.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-table-resizer.d.ts","sourceRoot":"","sources":["../../../hooks/use-table-resizer.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EACV,KAAK,EACL,aAAa,EACb,qBAAqB,EACtB,MAAM,oBAAoB,CAAC;AAK5B,OAAO,KAAiD,MAAM,OAAO,CAAC;AAEtE,OAAO,KAAK,EACV,eAAe,EACf,gBAAgB,EACjB,MAAM,mCAAmC,CAAC;AAC3C,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,UAAU,CAAC;AAE1C,KAAK,oBAAoB,GAAG;IAC1B,OAAO,EAAE,MAAM,CAAC;IAChB,MAAM,CAAC,EAAE,SAAS,EAAE,CAAC;IACrB,KAAK,EAAE,gBAAgB,CAAC;IACxB,YAAY,EAAE,CAAC,KAAK,EAAE,aAAa,EAAE,GAAG,CAAC,EAAE,aAAa,KAAK,IAAI,CAAC;IAClE,eAAe,EAAE,CACf,MAAM,EAAE,aAAa,EACrB,aAAa,CAAC,EAAE,OAAO,GAAG,SAAS,KAChC,IAAI,CAAC;IACV,eAAe,IAAI,IAAI,CAAC;IACxB,uBAAuB,EAAE,CACvB,CAAC,EAAE,MAAM,EACT,CAAC,EAAE,MAAM,EACT,aAAa,CAAC,EAAE,OAAO,KACpB,aAAa,GAAG,SAAS,CAAC;IAC/B,aAAa,CAAC,EAAE,eAAe,CAAC,eAAe,CAAC,CAAC;IACjD,YAAY,EAAE,CACZ,IAAI,EAAE,qBAAqB,EAC3B,KAAK,CAAC,EAAE,KAAK,GAAG,SAAS,KACtB,IAAI,GAAG,SAAS,CAAC;IACtB,UAAU,IAAI,IAAI,CAAC;CACpB,CAAC;AAEF,eAAO,MAAM,eAAe,GAAI,+IAW7B,oBAAoB;;;CAyHtB,CAAC;AAYF,eAAO,MAAM,kBAAkB,wKAa7B,CAAC"}

package/dist/cjs/hooks/use-table-resizer.js

@@ -0,0 +1,112 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.StyledResizeButton = exports.useTableResizer = void 0;
+var tslib_1 = require("tslib");
+var grid_1 = require("@rowsncolumns/grid");
+var ui_1 = require("@rowsncolumns/ui");
+var utils_1 = require("@rowsncolumns/utils");
+var react_1 = tslib_1.__importStar(require("react"));
+var useTableResizer = function (_a) {
+    var sheetId = _a.sheetId, tables = _a.tables, theme = _a.theme, newSelection = _a.newSelection, modifySelection = _a.modifySelection, clearSelections = _a.clearSelections, onResizeTable = _a.onResizeTable, getCellCoordsFromOffset = _a.getCellCoordsFromOffset, scrollToCell = _a.scrollToCell, focusSheet = _a.focusSheet;
+    var _b = tslib_1.__read((0, react_1.useState)(false), 2), isResizingTable = _b[0], setIsResizingTable = _b[1];
+    var tableRef = (0, react_1.useRef)(undefined);
+    var onMouseMove = (0, react_1.useCallback)(function (event) {
+        var cell = getCellCoordsFromOffset(event.clientX, event.clientY, false);
+        if (cell && tableRef.current) {
+            // Restrict cell to table range
+            var showHeader = tableRef.current.headerRow;
+            var minRowIndex = tableRef.current.range.startRowIndex + (showHeader ? 1 : 0);
+            var minColumnIndex = tableRef.current.range.startColumnIndex;
+            cell.rowIndex = Math.max(cell.rowIndex, minRowIndex);
+            cell.columnIndex = Math.max(cell.columnIndex, minColumnIndex);
+            modifySelection(cell);
+            // Scroll to active cell
+            scrollToCell(cell);
+        }
+    }, [getCellCoordsFromOffset, modifySelection, scrollToCell]);
+    var onMouseUp = (0, react_1.useCallback)(function (event) {
+        // Callback
+        var endCell = getCellCoordsFromOffset(event.clientX, event.clientY, false);
+        //End
+        setIsResizingTable(false);
+        // Clear selections
+        clearSelections();
+        if (tableRef.current && endCell) {
+            var tableRange = tslib_1.__assign(tslib_1.__assign({}, tableRef.current.range), { endColumnIndex: endCell.columnIndex, endRowIndex: endCell.rowIndex });
+            // Callback
+            onResizeTable === null || onResizeTable === void 0 ? void 0 : onResizeTable(sheetId, tableRef.current, tableRange);
+        }
+        // Switch focus to sheet
+        focusSheet();
+        // Unbind
+        document.removeEventListener("pointermove", onMouseMove);
+        document.removeEventListener("pointerup", onMouseUp);
+    }, [
+        onMouseMove,
+        onResizeTable,
+        clearSelections,
+        focusSheet,
+        getCellCoordsFromOffset,
+        sheetId,
+    ]);
+    var onMouseDown = (0, react_1.useCallback)(function (table) {
+        var range = table.range;
+        // Create a new selection
+        var start = {
+            rowIndex: range.startRowIndex,
+            columnIndex: range.startColumnIndex,
+        };
+        var end = {
+            rowIndex: range.endRowIndex,
+            columnIndex: range.endColumnIndex,
+        };
+        // Set selected range
+        tableRef.current = table;
+        // Set new selection
+        newSelection(start, end);
+        // Modify immediately
+        modifySelection(end);
+        // Setter
+        setIsResizingTable(true);
+        // Bind
+        document.addEventListener("pointermove", onMouseMove);
+        document.addEventListener("pointerup", onMouseUp);
+    }, [newSelection, modifySelection, onMouseMove, onMouseUp]);
+    // Resizer components
+    var tableResizers = (0, react_1.useMemo)(function () {
+        return tables === null || tables === void 0 ? void 0 : tables.filter(function (table) { return table.sheetId === sheetId; }).map(function (table) {
+            var range = table.range;
+            var cornerCell = {
+                rowIndex: range.endRowIndex,
+                columnIndex: range.endColumnIndex,
+            };
+            return (react_1.default.createElement(TableResizer, { key: table.id, cornerCell: cornerCell, onPointerDown: function () { return onMouseDown(table); }, backgroundColor: theme.themeColors.accent1 }));
+        });
+    }, [tables, sheetId, theme, onMouseDown]);
+    return {
+        tableResizers: tableResizers,
+        isResizingTable: isResizingTable,
+    };
+};
+exports.useTableResizer = useTableResizer;
+var CORNER_CELL_DIM = 6;
+exports.StyledResizeButton = react_1.default.forwardRef(function (_a, ref) {
+    var className = _a.className, props = tslib_1.__rest(_a, ["className"]);
+    return (react_1.default.createElement(ui_1.Button, tslib_1.__assign({ ref: ref, className: (0, ui_1.cn)("absolute rounded-none border-t-0 border-l-0 min-w-0 min-h-0 p-0 pointer-events-auto touch-manipulation cursor-nwse-resize print:hidden", "border-r-[3px] border-b-[3px] border-solid border-neutral-700", className) }, props)));
+});
+exports.StyledResizeButton.displayName = "StyledResizeButton";
+var TableResizer = function (_a) {
+    var cornerCell = _a.cornerCell, backgroundColor = _a.backgroundColor, rest = tslib_1.__rest(_a, ["cornerCell", "backgroundColor"]);
+    var getCellOffsetFromCoords = (0, grid_1.useGridContext)().getCellOffsetFromCoords;
+    var cellPosition = getCellOffsetFromCoords(cornerCell);
+    if ((0, utils_1.isNil)(cellPosition)) {
+        return null;
+    }
+    return (react_1.default.createElement(exports.StyledResizeButton, tslib_1.__assign({ style: {
+            top: cellPosition.y + cellPosition.height - CORNER_CELL_DIM,
+            left: cellPosition.x + cellPosition.width - CORNER_CELL_DIM,
+            borderColor: backgroundColor,
+            width: CORNER_CELL_DIM,
+            height: CORNER_CELL_DIM,
+        }, title: "Resize table" }, rest)));
+};

package/dist/cjs/hooks/use-text-dimensions.d.ts

@@ -0,0 +1,16 @@
+interface UseTextDimensionProps {
+    value?: string;
+    fontSize?: number | null;
+    fontFamily?: string | null;
+    bold?: boolean | null;
+    italic?: boolean | null;
+    height?: number;
+    width?: number;
+    scale?: number;
+    borderWidth?: number;
+    paddingHorizontal?: number;
+    paddingVertical?: number;
+}
+export declare const useTextDimension: ({ value, fontSize, fontFamily, bold, italic, width, height, scale, paddingHorizontal, paddingVertical, borderWidth, }: UseTextDimensionProps) => number[];
+export {};
+//# sourceMappingURL=use-text-dimensions.d.ts.map

package/dist/cjs/hooks/use-text-dimensions.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-text-dimensions.d.ts","sourceRoot":"","sources":["../../../hooks/use-text-dimensions.ts"],"names":[],"mappings":"AAIA,UAAU,qBAAqB;IAC7B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACzB,UAAU,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAC3B,IAAI,CAAC,EAAE,OAAO,GAAG,IAAI,CAAC;IACtB,MAAM,CAAC,EAAE,OAAO,GAAG,IAAI,CAAC;IACxB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,eAAe,CAAC,EAAE,MAAM,CAAC;CAC1B;AACD,eAAO,MAAM,gBAAgB,GAAI,uHAY9B,qBAAqB,aAyCvB,CAAC"}

package/dist/cjs/hooks/use-text-dimensions.js

@@ -0,0 +1,40 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useTextDimension = void 0;
+var grid_1 = require("@rowsncolumns/grid");
+var utils_1 = require("@rowsncolumns/utils");
+var react_1 = require("react");
+var useTextDimension = function (_a) {
+    var value = _a.value, fontSize = _a.fontSize, fontFamily = _a.fontFamily, bold = _a.bold, italic = _a.italic, _b = _a.width, width = _b === void 0 ? 0 : _b, _c = _a.height, height = _c === void 0 ? 0 : _c, _d = _a.scale, scale = _d === void 0 ? 1 : _d, _e = _a.paddingHorizontal, paddingHorizontal = _e === void 0 ? 0 : _e, _f = _a.paddingVertical, paddingVertical = _f === void 0 ? 0 : _f, _g = _a.borderWidth, borderWidth = _g === void 0 ? 0 : _g;
+    return (0, react_1.useMemo)(function () {
+        if ((0, utils_1.isNil)(value))
+            return [0, 0];
+        if (width === 0 && height === 0)
+            return [0, 0];
+        /* Update fonts */
+        grid_1.autoSizerCanvas.setFont({
+            fontSize: fontSize,
+            fontFamily: fontFamily,
+            fontWeight: bold ? "bold" : "",
+            fontStyle: italic ? "italic" : "",
+            scale: scale,
+        });
+        var _a = grid_1.autoSizerCanvas.measureText(value), measuredWidth = _a.width, measuredHeight = _a.height;
+        var finalWidth = Math.max(measuredWidth + paddingHorizontal, width + borderWidth / 2);
+        var finalHeight = Math.max(measuredHeight + paddingVertical, height + borderWidth / 2);
+        return [finalWidth, finalHeight];
+    }, [
+        value,
+        width,
+        height,
+        fontSize,
+        fontFamily,
+        bold,
+        scale,
+        borderWidth,
+        italic,
+        paddingHorizontal,
+        paddingVertical,
+    ]);
+};
+exports.useTextDimension = useTextDimension;

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

@@ -0,0 +1,70 @@
+import type { CellInterface, CellPosition, ScrollCoords } from "@rowsncolumns/grid";
+import type React from "react";
+import type { CanvasGridProps } from "../components/canvas-grid/typings";
+import type { CellTooltipProps } from "../components/cell-tooltip";
+export type TooltipOptions = {
+    sheetId: number;
+    /**
+     * Tooltip component
+     */
+    getTooltip(props: CellTooltipProps): React.ReactElement | null;
+    /**
+     * Grid references
+     */
+    getCellOffsetFromCoords(cell: CellInterface): CellPosition | undefined;
+    /**
+     * Hovered cell
+     */
+    activeCell?: CellInterface | null;
+    /**
+     * Get current scroll position
+     */
+    getScrollPosition: () => ScrollCoords | undefined;
+    /**
+     * Is frozen row
+     * @param rowIndex
+     */
+    isFrozenRow(rowIndex: number): boolean;
+    /**
+     * Is frozen column
+     * @param columnIndex
+     */
+    isFrozenColumn(columnIndex: number): boolean;
+    /**
+     * User is updating a note
+     * @param sheetId
+     * @param cell
+     * @param note
+     */
+    onUpdateNote?(sheetId: number, cell: CellInterface, note: string | undefined): void;
+    /**
+     * Close tooltip from inside tooltip component
+     */
+    onRequestClose?(): void;
+    /**
+     * Remove hyperlink
+     */
+    onRemoveLink: CanvasGridProps["onRemoveLink"];
+    /**
+     * Select hyperlink
+     */
+    onSelectLink: CanvasGridProps["onSelectLink"];
+};
+export type DefaultTooltipProps = {
+    /**
+     * Tooltip x position
+     */
+    x: number;
+    /**
+     * Tooltip y position
+     */
+    y: number;
+    width: number;
+    height: number;
+    scrollLeft: number;
+    scrollTop: number;
+};
+export declare const useTooltip: ({ getCellOffsetFromCoords, sheetId, activeCell, getScrollPosition, getTooltip, isFrozenColumn, isFrozenRow, onUpdateNote, onRequestClose, onRemoveLink, onSelectLink, }: TooltipOptions) => {
+    tooltipComponent: React.ReactElement<unknown, string | React.JSXElementConstructor<any>> | null;
+};
+//# sourceMappingURL=use-tooltip.d.ts.map

package/dist/cjs/hooks/use-tooltip.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-tooltip.d.ts","sourceRoot":"","sources":["../../../hooks/use-tooltip.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EACV,aAAa,EACb,YAAY,EACZ,YAAY,EACb,MAAM,oBAAoB,CAAC;AAE5B,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,mCAAmC,CAAC;AACzE,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,4BAA4B,CAAC;AAEnE,MAAM,MAAM,cAAc,GAAG;IAC3B,OAAO,EAAE,MAAM,CAAC;IAChB;;OAEG;IACH,UAAU,CAAC,KAAK,EAAE,gBAAgB,GAAG,KAAK,CAAC,YAAY,GAAG,IAAI,CAAC;IAC/D;;OAEG;IACH,uBAAuB,CAAC,IAAI,EAAE,aAAa,GAAG,YAAY,GAAG,SAAS,CAAC;IACvE;;OAEG;IACH,UAAU,CAAC,EAAE,aAAa,GAAG,IAAI,CAAC;IAClC;;OAEG;IACH,iBAAiB,EAAE,MAAM,YAAY,GAAG,SAAS,CAAC;IAClD;;;OAGG;IACH,WAAW,CAAC,QAAQ,EAAE,MAAM,GAAG,OAAO,CAAC;IACvC;;;OAGG;IACH,cAAc,CAAC,WAAW,EAAE,MAAM,GAAG,OAAO,CAAC;IAC7C;;;;;OAKG;IACH,YAAY,CAAC,CACX,OAAO,EAAE,MAAM,EACf,IAAI,EAAE,aAAa,EACnB,IAAI,EAAE,MAAM,GAAG,SAAS,GACvB,IAAI,CAAC;IACR;;OAEG;IACH,cAAc,CAAC,IAAI,IAAI,CAAC;IACxB;;OAEG;IACH,YAAY,EAAE,eAAe,CAAC,cAAc,CAAC,CAAC;IAC9C;;OAEG;IACH,YAAY,EAAE,eAAe,CAAC,cAAc,CAAC,CAAC;CAC/C,CAAC;AAEF,MAAM,MAAM,mBAAmB,GAAG;IAChC;;OAEG;IACH,CAAC,EAAE,MAAM,CAAC;IACV;;OAEG;IACH,CAAC,EAAE,MAAM,CAAC;IACV,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;IACf,UAAU,EAAE,MAAM,CAAC;IACnB,SAAS,EAAE,MAAM,CAAC;CACnB,CAAC;AAEF,eAAO,MAAM,UAAU,GAAI,yKAYxB,cAAc;;CAoGhB,CAAC"}

package/dist/cjs/hooks/use-tooltip.js

@@ -0,0 +1,79 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useTooltip = void 0;
+var tslib_1 = require("tslib");
+var grid_1 = require("@rowsncolumns/grid");
+var react_1 = require("react");
+var atoms_1 = require("../atoms");
+var useTooltip = function (_a) {
+    var _b;
+    var getCellOffsetFromCoords = _a.getCellOffsetFromCoords, sheetId = _a.sheetId, activeCell = _a.activeCell, getScrollPosition = _a.getScrollPosition, getTooltip = _a.getTooltip, isFrozenColumn = _a.isFrozenColumn, isFrozenRow = _a.isFrozenRow, onUpdateNote = _a.onUpdateNote, onRequestClose = _a.onRequestClose, onRemoveLink = _a.onRemoveLink, onSelectLink = _a.onSelectLink;
+    var _c = tslib_1.__read((0, atoms_1.useNoteEditorCell)(), 2), noteEditorCell = _c[0], setNoteEditorCell = _c[1];
+    var _d = tslib_1.__read((0, atoms_1.usePinnedTooltip)(), 2), pinnedTooltipCell = _d[0], setPinnedTooltipCell = _d[1];
+    var hoveredCell = (_b = pinnedTooltipCell !== null && pinnedTooltipCell !== void 0 ? pinnedTooltipCell : noteEditorCell) !== null && _b !== void 0 ? _b : activeCell;
+    // Tooltip position
+    var getTooltipPositon = (0, react_1.useCallback)(function (cell) {
+        var _a, _b, _c, _d, _e, _f;
+        var scrollPosition = getScrollPosition();
+        var cellOffset = getCellOffsetFromCoords(cell);
+        return {
+            x: (_a = cellOffset === null || cellOffset === void 0 ? void 0 : cellOffset.x) !== null && _a !== void 0 ? _a : 0,
+            y: (_b = cellOffset === null || cellOffset === void 0 ? void 0 : cellOffset.y) !== null && _b !== void 0 ? _b : 0,
+            width: (_c = cellOffset === null || cellOffset === void 0 ? void 0 : cellOffset.width) !== null && _c !== void 0 ? _c : 0,
+            height: (_d = cellOffset === null || cellOffset === void 0 ? void 0 : cellOffset.height) !== null && _d !== void 0 ? _d : 0,
+            scrollLeft: isFrozenColumn(cell.columnIndex)
+                ? 0
+                : (_e = scrollPosition === null || scrollPosition === void 0 ? void 0 : scrollPosition.scrollLeft) !== null && _e !== void 0 ? _e : 0,
+            scrollTop: isFrozenRow(cell.rowIndex)
+                ? 0
+                : (_f = scrollPosition === null || scrollPosition === void 0 ? void 0 : scrollPosition.scrollTop) !== null && _f !== void 0 ? _f : 0,
+        };
+    }, [getScrollPosition, getCellOffsetFromCoords, isFrozenColumn, isFrozenRow]);
+    var onRequestShowNote = (0, react_1.useCallback)(function (cell) {
+        if ((0, grid_1.isEqualCells)(cell, noteEditorCell)) {
+            return;
+        }
+        if (cell) {
+            setNoteEditorCell(tslib_1.__assign({ sheetId: sheetId }, cell));
+        }
+        else {
+            setNoteEditorCell(undefined);
+        }
+    }, [sheetId, setNoteEditorCell, noteEditorCell]);
+    // Pin tooltip
+    var onRequestPinTooltip = (0, react_1.useCallback)(function (cell) {
+        if ((0, grid_1.isEqualCells)(cell, pinnedTooltipCell)) {
+            return;
+        }
+        if (cell) {
+            setPinnedTooltipCell(tslib_1.__assign({ sheetId: sheetId }, cell));
+        }
+        else {
+            setPinnedTooltipCell(undefined);
+        }
+    }, [sheetId, setPinnedTooltipCell, pinnedTooltipCell]);
+    // Unpin tooltip
+    var onRequestUnpinTooltip = (0, react_1.useCallback)(function () {
+        setPinnedTooltipCell(undefined);
+    }, [setPinnedTooltipCell]);
+    var onRequestUpdateNote = (0, react_1.useCallback)(function (value, previousValue) {
+        var noteCell = noteEditorCell;
+        if (noteCell && value !== previousValue) {
+            onUpdateNote === null || onUpdateNote === void 0 ? void 0 : onUpdateNote(sheetId, noteCell, value);
+        }
+        // Close notes
+        onRequestShowNote(undefined);
+    }, [onUpdateNote, onRequestShowNote, sheetId, noteEditorCell]);
+    var onRequestCloseNote = (0, react_1.useCallback)(function () {
+        // Close notes
+        onRequestShowNote(undefined);
+        onRequestClose === null || onRequestClose === void 0 ? void 0 : onRequestClose();
+    }, [onRequestClose, onRequestShowNote]);
+    var tooltipComponent = hoveredCell
+        ? getTooltip(tslib_1.__assign(tslib_1.__assign({}, getTooltipPositon(hoveredCell)), { sheetId: sheetId, cell: hoveredCell, noteEditorCell: noteEditorCell, onRequestShowNote: onRequestShowNote, onRequestUpdateNote: onRequestUpdateNote, onRequestCloseNote: onRequestCloseNote, onRemoveLink: onRemoveLink, onSelectLink: onSelectLink, onRequestUnpinTooltip: onRequestUnpinTooltip, onRequestPinTooltip: onRequestPinTooltip }))
+        : null;
+    return {
+        tooltipComponent: tooltipComponent,
+    };
+};
+exports.useTooltip = useTooltip;

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

@@ -0,0 +1,16 @@
+import type { GridDimensions, ScrollCoords } from "@rowsncolumns/grid";
+type UseTouchProps = {
+    scrollTo: (coords: ScrollCoords, immediate?: boolean) => void;
+    scale?: number;
+    onChangeScale?: (scale: number) => void;
+    minScale?: number;
+    maxScale?: number;
+};
+export declare const useTouch: ({ scrollTo, scale, onChangeScale, minScale, maxScale, }: UseTouchProps) => {
+    onTouchStart: (event: React.TouchEvent<HTMLDivElement>) => void;
+    onDimensionsChange: ((props: GridDimensions) => void) | undefined;
+    scrollToTouchDevice: ({ scrollLeft, scrollTop }: ScrollCoords) => void;
+    onAfterScrollToCell: (scrollLeft: number | undefined, scrollTop: number | undefined) => void;
+};
+export {};
+//# sourceMappingURL=use-touch.d.ts.map

package/dist/cjs/hooks/use-touch.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-touch.d.ts","sourceRoot":"","sources":["../../../hooks/use-touch.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,YAAY,EAAE,MAAM,oBAAoB,CAAC;AAUvE,KAAK,aAAa,GAAG;IACnB,QAAQ,EAAE,CAAC,MAAM,EAAE,YAAY,EAAE,SAAS,CAAC,EAAE,OAAO,KAAK,IAAI,CAAC;IAC9D,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACxC,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB,CAAC;AAoCF,eAAO,MAAM,QAAQ,GAAI,yDAMtB,aAAa;0BAsKJ,KAAK,CAAC,UAAU,CAAC,cAAc,CAAC;iCA1J/B,cAAc,KAAK,IAAI;qDA6CJ,YAAY;sCAQ3B,MAAM,GAAG,SAAS,aAAa,MAAM,GAAG,SAAS;CAqMjE,CAAC"}