@rowsncolumns/spreadsheet 10.2.68

package/dist/cjs/hooks/use-context-menu.d.ts

@@ -0,0 +1,52 @@
+import type { CellInterface, Grid } from "@rowsncolumns/grid";
+import type { ElementType } from "react";
+import React from "react";
+import type { ContextMenuProps } from "../components/context-menu";
+export type UseContexMenuProps = {
+    ContextMenuWrapper?: ElementType<ContextMenuWrapperProps>;
+    /**
+     * Get cell coords from x and y position
+     * @param x
+     * @param y
+     * @param includeFrozen
+     */
+    getCellCoordsFromOffset(x: number, y: number, includeFrozen?: boolean | undefined): CellInterface | null | undefined;
+    /**
+     * Get position relative to the sheet
+     * @param x
+     * @param y
+     */
+    getRelativePositionFromOffset: React.ComponentRef<typeof Grid>["getRelativePositionFromOffset"];
+    /**
+     * Row header function
+     * @param columnIndex
+     */
+    isRowHeader(columnIndex: number): boolean;
+    /**
+     * Column header function
+     * @param rowIndex
+     */
+    isColumnHeader(rowIndex: number): boolean;
+    /**
+     * Get context menu component
+     * @param cell
+     */
+    getContextMenu(activeCell: CellInterface): React.ReactElement<ContextMenuProps> | null;
+    getScrollPosition: React.ComponentRef<typeof Grid>["getScrollPosition"];
+    getCellOffsetFromCoords: React.ComponentRef<typeof Grid>["getCellOffsetFromCoords"];
+};
+export declare const useContextMenu: ({ getCellCoordsFromOffset, getRelativePositionFromOffset, getCellOffsetFromCoords, getScrollPosition, isRowHeader, isColumnHeader, getContextMenu, ContextMenuWrapper, }: UseContexMenuProps) => {
+    onContextMenu: (e: React.MouseEvent) => void;
+    contextMenuComponent: React.JSX.Element;
+    onRequestClose: () => void;
+    showContextMenu: (cell: CellInterface, x?: number, y?: number) => void;
+};
+export type ContextMenuWrapperProps = {
+    isOpen?: boolean;
+    left: number;
+    top: number;
+    onOpenChange(isOpen: boolean): void;
+    children?: React.ReactNode;
+};
+export declare const DefaultContextMenuWrapper: ({ left, top, isOpen, onOpenChange, children, }: ContextMenuWrapperProps) => React.JSX.Element;
+//# sourceMappingURL=use-context-menu.d.ts.map

package/dist/cjs/hooks/use-context-menu.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-context-menu.d.ts","sourceRoot":"","sources":["../../../hooks/use-context-menu.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,IAAI,EAAiB,MAAM,oBAAoB,CAAC;AAE7E,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,OAAO,CAAC;AACzC,OAAO,KAAiD,MAAM,OAAO,CAAC;AAEtE,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,4BAA4B,CAAC;AAInE,MAAM,MAAM,kBAAkB,GAAG;IAC/B,kBAAkB,CAAC,EAAE,WAAW,CAAC,uBAAuB,CAAC,CAAC;IAC1D;;;;;OAKG;IACH,uBAAuB,CACrB,CAAC,EAAE,MAAM,EACT,CAAC,EAAE,MAAM,EACT,aAAa,CAAC,EAAE,OAAO,GAAG,SAAS,GAClC,aAAa,GAAG,IAAI,GAAG,SAAS,CAAC;IACpC;;;;OAIG;IACH,6BAA6B,EAAE,KAAK,CAAC,YAAY,CAC/C,OAAO,IAAI,CACZ,CAAC,+BAA+B,CAAC,CAAC;IACnC;;;OAGG;IACH,WAAW,CAAC,WAAW,EAAE,MAAM,GAAG,OAAO,CAAC;IAC1C;;;OAGG;IACH,cAAc,CAAC,QAAQ,EAAE,MAAM,GAAG,OAAO,CAAC;IAC1C;;;OAGG;IACH,cAAc,CACZ,UAAU,EAAE,aAAa,GACxB,KAAK,CAAC,YAAY,CAAC,gBAAgB,CAAC,GAAG,IAAI,CAAC;IAC/C,iBAAiB,EAAE,KAAK,CAAC,YAAY,CAAC,OAAO,IAAI,CAAC,CAAC,mBAAmB,CAAC,CAAC;IACxE,uBAAuB,EAAE,KAAK,CAAC,YAAY,CACzC,OAAO,IAAI,CACZ,CAAC,yBAAyB,CAAC,CAAC;CAC9B,CAAC;AAEF,eAAO,MAAM,cAAc,GAAI,0KAS5B,kBAAkB;uBAmDb,KAAK,CAAC,UAAU;;;4BAxCb,aAAa,MAAM,MAAM,MAAM,MAAM;CAqF/C,CAAC;AAEF,MAAM,MAAM,uBAAuB,GAAG;IACpC,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,IAAI,EAAE,MAAM,CAAC;IACb,GAAG,EAAE,MAAM,CAAC;IACZ,YAAY,CAAC,MAAM,EAAE,OAAO,GAAG,IAAI,CAAC;IACpC,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B,CAAC;AAEF,eAAO,MAAM,yBAAyB,GAAI,gDAMvC,uBAAuB,sBAYzB,CAAC"}

package/dist/cjs/hooks/use-context-menu.js

@@ -0,0 +1,83 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DefaultContextMenuWrapper = exports.useContextMenu = void 0;
+var tslib_1 = require("tslib");
+var utils_1 = require("@rowsncolumns/utils");
+var react_1 = tslib_1.__importStar(require("react"));
+var menu_1 = require("../components/context-menu/menu");
+var style_1 = require("../components/context-menu/style");
+var useContextMenu = function (_a) {
+    var getCellCoordsFromOffset = _a.getCellCoordsFromOffset, getRelativePositionFromOffset = _a.getRelativePositionFromOffset, getCellOffsetFromCoords = _a.getCellOffsetFromCoords, getScrollPosition = _a.getScrollPosition, isRowHeader = _a.isRowHeader, isColumnHeader = _a.isColumnHeader, getContextMenu = _a.getContextMenu, _b = _a.ContextMenuWrapper, ContextMenuWrapper = _b === void 0 ? exports.DefaultContextMenuWrapper : _b;
+    var _c = tslib_1.__read((0, react_1.useState)({ left: 0, top: 0 }), 2), menuPosition = _c[0], setMenuPosition = _c[1];
+    var _d = tslib_1.__read((0, react_1.useState)(false), 2), isOpen = _d[0], setIsOpen = _d[1];
+    var activeCellRef = (0, react_1.useRef)(undefined);
+    var showMenu = (0, react_1.useCallback)(function () { return setIsOpen(true); }, []);
+    var closeMenu = (0, react_1.useCallback)(function () { return setIsOpen(false); }, []);
+    /**
+     * Programmatically Display a context menu at a cell
+     */
+    var showContextMenu = (0, react_1.useCallback)(function (cell, x, y) {
+        // Set active cell
+        activeCellRef.current = cell;
+        var position;
+        if ((0, utils_1.isNil)(x) || (0, utils_1.isNil)(y)) {
+            // cell pos
+            var cellPosition = getCellOffsetFromCoords(cell);
+            var scrollPosition = getScrollPosition();
+            if (!(0, utils_1.isNil)(cellPosition)) {
+                position = {
+                    x: cellPosition.x - scrollPosition.scrollLeft + cellPosition.width,
+                    y: cellPosition.y - scrollPosition.scrollTop + cellPosition.height,
+                };
+            }
+        }
+        else {
+            position = getRelativePositionFromOffset(x, y);
+        }
+        if ((0, utils_1.isNil)(position)) {
+            return;
+        }
+        // Set menu position
+        setMenuPosition({ left: position.x, top: position.y });
+        // Show menu
+        showMenu();
+    }, [
+        getRelativePositionFromOffset,
+        getCellOffsetFromCoords,
+        getScrollPosition,
+        showMenu,
+    ]);
+    // Called when user right-clicks on the sheet
+    var handleContextMenu = (0, react_1.useCallback)(function (e) {
+        var _a = e.nativeEvent, clientX = _a.clientX, clientY = _a.clientY;
+        var cell = getCellCoordsFromOffset(clientX, clientY);
+        if ((0, utils_1.isNil)(cell) ||
+            (isRowHeader(cell === null || cell === void 0 ? void 0 : cell.columnIndex) && isColumnHeader(cell === null || cell === void 0 ? void 0 : cell.rowIndex))) {
+            return;
+        }
+        showContextMenu(cell, clientX, clientY);
+        // Hide default context menu
+        e.preventDefault();
+    }, [getCellCoordsFromOffset, showContextMenu, isRowHeader, isColumnHeader]);
+    var contextMenuComponent = (0, react_1.useMemo)(function () {
+        var ContextMenu = isOpen && activeCellRef.current
+            ? getContextMenu(activeCellRef.current)
+            : null;
+        return (react_1.default.createElement(ContextMenuWrapper, { left: menuPosition.left, top: menuPosition.top, isOpen: isOpen, onOpenChange: setIsOpen }, ContextMenu));
+    }, [getContextMenu, ContextMenuWrapper, isOpen, menuPosition, setIsOpen]);
+    return (0, react_1.useMemo)(function () { return ({
+        onContextMenu: handleContextMenu,
+        contextMenuComponent: contextMenuComponent,
+        onRequestClose: closeMenu,
+        showContextMenu: showContextMenu,
+    }); }, [handleContextMenu, contextMenuComponent, closeMenu, showContextMenu]);
+};
+exports.useContextMenu = useContextMenu;
+var DefaultContextMenuWrapper = function (_a) {
+    var left = _a.left, top = _a.top, isOpen = _a.isOpen, onOpenChange = _a.onOpenChange, children = _a.children;
+    return (react_1.default.createElement(style_1.StyledContextMenuWrapper, { style: {
+            transform: "translate3d(".concat(left, "px, ").concat(top, "px, 0)"),
+        } },
+        react_1.default.createElement(menu_1.ContextMenuDropdown, { isOpen: isOpen, onOpenChange: onOpenChange }, children)));
+};
+exports.DefaultContextMenuWrapper = DefaultContextMenuWrapper;

package/dist/cjs/hooks/use-context-setter.d.ts

@@ -0,0 +1,3 @@
+import type { CanvasGridMethods } from "../components/canvas-grid/typings";
+export declare const useContextSetter: (forwardedRef: React.ForwardedRef<CanvasGridMethods>, contextValue: CanvasGridMethods) => void;
+//# sourceMappingURL=use-context-setter.d.ts.map

package/dist/cjs/hooks/use-context-setter.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-context-setter.d.ts","sourceRoot":"","sources":["../../../hooks/use-context-setter.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,mCAAmC,CAAC;AAG3E,eAAO,MAAM,gBAAgB,GAC3B,cAAc,KAAK,CAAC,YAAY,CAAC,iBAAiB,CAAC,EACnD,cAAc,iBAAiB,SA2LhC,CAAC"}

package/dist/cjs/hooks/use-context-setter.js

@@ -0,0 +1,132 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useContextSetter = void 0;
+var react_1 = require("react");
+var sheet_context_atom_1 = require("../atoms/sheet-context.atom");
+var use_isomorphic_layout_effect_1 = require("./use-isomorphic-layout-effect");
+var useContextSetter = function (forwardedRef, contextValue) {
+    var setSpreadsheetContext = (0, sheet_context_atom_1.useSetSpreadsheetContext)();
+    var submitEditor = contextValue.submitEditor, cancelEditor = contextValue.cancelEditor, commit = contextValue.commit, makeEditable = contextValue.makeEditable, editCell = contextValue.editCell, getNextFocusableCell = contextValue.getNextFocusableCell, onEditorKeyDown = contextValue.onEditorKeyDown, scrollToCell = contextValue.scrollToCell, scrollToBottom = contextValue.scrollToBottom, focusSheet = contextValue.focusSheet, canEditCell = contextValue.canEditCell, isSheetProtected = contextValue.isSheetProtected, isWorkbookProtected = contextValue.isWorkbookProtected, getSheetProtection = contextValue.getSheetProtection, getSelectionsFromFormula = contextValue.getSelectionsFromFormula, getAddressFromSelection = contextValue.getAddressFromSelection, getR1C1AddressFromSelection = contextValue.getR1C1AddressFromSelection, tokenizer = contextValue.tokenizer, setEditorValue = contextValue.setEditorValue, getCellBounds = contextValue.getCellBounds, getTableNames = contextValue.getTableNames, getStructuredProperties = contextValue.getStructuredProperties, getNamedRanges = contextValue.getNamedRanges, getTableColumnNames = contextValue.getTableColumnNames, updateSelectionStartEndReference = contextValue.updateSelectionStartEndReference, getCellDimensions = contextValue.getCellDimensions, getRowHeight = contextValue.getRowHeight, getContentfulGridRangeAroundCell = contextValue.getContentfulGridRangeAroundCell, getCellCoordsFromOffset = contextValue.getCellCoordsFromOffset, getCellOffsetFromCoords = contextValue.getCellOffsetFromCoords, getEffectiveValuesFromRange = contextValue.getEffectiveValuesFromRange, getSheetDimensions = contextValue.getSheetDimensions, getFinalRowHeight = contextValue.getFinalRowHeight, getColumnWidth = contextValue.getColumnWidth, getSheetId = contextValue.getSheetId, getSheetName = contextValue.getSheetName, onInsertNote = contextValue.onInsertNote, onPinToolTip = contextValue.onPinToolTip, onUnpinTooltip = contextValue.onUnpinTooltip, showCellPopover = contextValue.showCellPopover, redrawGrid = contextValue.redrawGrid, flash = contextValue.flash, navigateToSheetRange = contextValue.navigateToSheetRange, mark = contextValue.mark, unmark = contextValue.unmark, exportRange = contextValue.exportRange, getViewPort = contextValue.getViewPort, setActiveCell = contextValue.setActiveCell, getGridRef = contextValue.getGridRef, getMentions = contextValue.getMentions, dispatchEvent = contextValue.dispatchEvent, splitTextToColumns = contextValue.splitTextToColumns, copy = contextValue.copy, cut = contextValue.cut, paste = contextValue.paste;
+    // Expose grid methods in context and ref
+    var imperativeHandleRefs = (0, react_1.useMemo)(function () { return ({
+        submitEditor: submitEditor,
+        cancelEditor: cancelEditor,
+        commit: commit,
+        makeEditable: makeEditable,
+        editCell: editCell,
+        getNextFocusableCell: getNextFocusableCell,
+        onEditorKeyDown: onEditorKeyDown,
+        scrollToCell: scrollToCell,
+        scrollToBottom: scrollToBottom,
+        focusSheet: focusSheet,
+        canEditCell: canEditCell,
+        isSheetProtected: isSheetProtected,
+        isWorkbookProtected: isWorkbookProtected,
+        getSheetProtection: getSheetProtection,
+        getSelectionsFromFormula: getSelectionsFromFormula,
+        getAddressFromSelection: getAddressFromSelection,
+        getR1C1AddressFromSelection: getR1C1AddressFromSelection,
+        tokenizer: tokenizer,
+        setEditorValue: setEditorValue,
+        getCellBounds: getCellBounds,
+        getTableNames: getTableNames,
+        getStructuredProperties: getStructuredProperties,
+        getNamedRanges: getNamedRanges,
+        getTableColumnNames: getTableColumnNames,
+        updateSelectionStartEndReference: updateSelectionStartEndReference,
+        getCellDimensions: getCellDimensions,
+        getRowHeight: getRowHeight,
+        getContentfulGridRangeAroundCell: getContentfulGridRangeAroundCell,
+        getCellCoordsFromOffset: getCellCoordsFromOffset,
+        getCellOffsetFromCoords: getCellOffsetFromCoords,
+        getEffectiveValuesFromRange: getEffectiveValuesFromRange,
+        getSheetDimensions: getSheetDimensions,
+        getFinalRowHeight: getFinalRowHeight,
+        getColumnWidth: getColumnWidth,
+        getSheetId: getSheetId,
+        getSheetName: getSheetName,
+        onInsertNote: onInsertNote,
+        onPinToolTip: onPinToolTip,
+        onUnpinTooltip: onUnpinTooltip,
+        showCellPopover: showCellPopover,
+        redrawGrid: redrawGrid,
+        flash: flash,
+        navigateToSheetRange: navigateToSheetRange,
+        mark: mark,
+        unmark: unmark,
+        exportRange: exportRange,
+        getViewPort: getViewPort,
+        setActiveCell: setActiveCell,
+        getGridRef: getGridRef,
+        getMentions: getMentions,
+        dispatchEvent: dispatchEvent,
+        splitTextToColumns: splitTextToColumns,
+        copy: copy,
+        cut: cut,
+        paste: paste,
+    }); }, [
+        submitEditor,
+        cancelEditor,
+        commit,
+        makeEditable,
+        editCell,
+        getNextFocusableCell,
+        onEditorKeyDown,
+        scrollToCell,
+        scrollToBottom,
+        focusSheet,
+        canEditCell,
+        isSheetProtected,
+        isWorkbookProtected,
+        getSheetProtection,
+        getSelectionsFromFormula,
+        getAddressFromSelection,
+        getR1C1AddressFromSelection,
+        tokenizer,
+        setEditorValue,
+        getCellBounds,
+        getTableNames,
+        getNamedRanges,
+        getStructuredProperties,
+        getTableColumnNames,
+        updateSelectionStartEndReference,
+        getCellDimensions,
+        getRowHeight,
+        getContentfulGridRangeAroundCell,
+        getCellCoordsFromOffset,
+        getCellOffsetFromCoords,
+        getEffectiveValuesFromRange,
+        getSheetDimensions,
+        getFinalRowHeight,
+        getColumnWidth,
+        getSheetId,
+        getSheetName,
+        onInsertNote,
+        onPinToolTip,
+        onUnpinTooltip,
+        showCellPopover,
+        redrawGrid,
+        flash,
+        navigateToSheetRange,
+        mark,
+        unmark,
+        exportRange,
+        getViewPort,
+        setActiveCell,
+        getGridRef,
+        getMentions,
+        dispatchEvent,
+        splitTextToColumns,
+        copy,
+        cut,
+        paste,
+    ]);
+    // Update sheet context
+    (0, use_isomorphic_layout_effect_1.useIsomorphicLayoutEffect)(function () {
+        setSpreadsheetContext(imperativeHandleRefs);
+    }, [imperativeHandleRefs]);
+    (0, react_1.useImperativeHandle)(forwardedRef, function () { return imperativeHandleRefs; }, [
+        imperativeHandleRefs,
+    ]);
+};
+exports.useContextSetter = useContextSetter;

package/dist/cjs/hooks/use-copy-paste-cut.d.ts

@@ -0,0 +1,45 @@
+import type { CellInterface, SelectionArea } from "@rowsncolumns/grid";
+import type { CanvasGridProps } from "../components/canvas-grid/typings";
+export type UseCopyPasteCutProps = {
+    /**
+     * Active sheet Id
+     */
+    sheetId: number;
+    /**
+     * Current activeCell
+     */
+    activeCell: CellInterface;
+    /**
+     * Current sheet selection
+     */
+    selections: SelectionArea[];
+    /**
+     * Programmatically focus the sheet
+     */
+    focusSheet(): void;
+    /**
+     * Callback when user pastes a selection or cell
+     */
+    onPaste: CanvasGridProps["onPaste"];
+    /**
+     * Callback when user copies a selection or cell
+     */
+    onCopy: CanvasGridProps["onCopy"];
+    /**
+     * Callback when user cuts a selection or cell
+     */
+    onCut: CanvasGridProps["onCut"];
+};
+export type PasteSpecialType = "Transposed" | "Formatting" | "Value" | "Formula" | "Link";
+export declare const useCopyPasteCut: ({ selections, activeCell, sheetId, onPaste, onCopy, onCut, focusSheet, }: UseCopyPasteCutProps) => {
+    selections: SelectionArea[];
+    copy: () => void;
+    cut: () => void;
+    paste: (pasteSpecialType?: PasteSpecialType) => Promise<void>;
+    copiedSelections: any[];
+    clearCopiedSelections: () => void;
+    onInternalCopy: (e: ClipboardEvent) => void;
+    onInternalPaste: (e: ClipboardEvent) => void;
+    onInternalCut: (e: ClipboardEvent) => void;
+};
+//# sourceMappingURL=use-copy-paste-cut.d.ts.map

package/dist/cjs/hooks/use-copy-paste-cut.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-copy-paste-cut.d.ts","sourceRoot":"","sources":["../../../hooks/use-copy-paste-cut.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,aAAa,EAAE,MAAM,oBAAoB,CAAC;AAWvE,OAAO,KAAK,EACV,eAAe,EAEhB,MAAM,mCAAmC,CAAC;AAK3C,MAAM,MAAM,oBAAoB,GAAG;IACjC;;OAEG;IACH,OAAO,EAAE,MAAM,CAAC;IAChB;;OAEG;IACH,UAAU,EAAE,aAAa,CAAC;IAC1B;;OAEG;IACH,UAAU,EAAE,aAAa,EAAE,CAAC;IAC5B;;OAEG;IACH,UAAU,IAAI,IAAI,CAAC;IACnB;;OAEG;IACH,OAAO,EAAE,eAAe,CAAC,SAAS,CAAC,CAAC;IACpC;;OAEG;IACH,MAAM,EAAE,eAAe,CAAC,QAAQ,CAAC,CAAC;IAClC;;OAEG;IACH,KAAK,EAAE,eAAe,CAAC,OAAO,CAAC,CAAC;CACjC,CAAC;AAEF,MAAM,MAAM,gBAAgB,GACxB,YAAY,GACZ,YAAY,GACZ,OAAO,GACP,SAAS,GACT,MAAM,CAAC;AAEX,eAAO,MAAM,eAAe,GAAI,0EAQ7B,oBAAoB;;;;+BA6QO,gBAAgB;;;wBArKtC,cAAc;yBAkDd,cAAc;uBAvBd,cAAc;CAoMrB,CAAC"}

package/dist/cjs/hooks/use-copy-paste-cut.js

@@ -0,0 +1,329 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useCopyPasteCut = void 0;
+var tslib_1 = require("tslib");
+var grid_1 = require("@rowsncolumns/grid");
+var react_1 = require("react");
+var copy_paste_1 = require("../api/copy-paste");
+var selections_1 = require("../api/selections");
+var atoms_1 = require("../atoms");
+var config_1 = require("../config");
+var use_callback_ref_1 = require("./use-callback-ref");
+var use_isomorphic_layout_effect_1 = require("./use-isomorphic-layout-effect");
+var useCopyPasteCut = function (_a) {
+    var selections = _a.selections, activeCell = _a.activeCell, sheetId = _a.sheetId, onPaste = _a.onPaste, onCopy = _a.onCopy, onCut = _a.onCut, focusSheet = _a.focusSheet;
+    var cellEditorInstance = (0, atoms_1.useCellEditorInstance)();
+    var getCellBounds = (0, atoms_1.useGetCellBounds)();
+    var _b = tslib_1.__read((0, react_1.useState)(config_1.DEFAULT_ARRAY), 2), copiedSelections = _b[0], setCopiedSelections = _b[1];
+    // SheetId of the copied selection
+    var copiedSheetIdRef = (0, react_1.useRef)(undefined);
+    var getActiveSheetId = (0, use_callback_ref_1.useCallbackRef)(function () { return sheetId; });
+    // Create a flag, so that we can delete cut selections after a paste
+    var isCutOperation = (0, react_1.useRef)(false);
+    // Saved copied selection state to show dashed borders. Cleared everytime user does `Paste`
+    var copiedSelectionRef = (0, react_1.useRef)(undefined);
+    // Saves copied selection, Only clears when user does `Cut/Paste`
+    var initialCopiedSelectionRef = (0, react_1.useRef)(undefined);
+    var onCopyRef = (0, use_callback_ref_1.useCallbackRef)(onCopy);
+    var onCutRef = (0, use_callback_ref_1.useCallbackRef)(onCut);
+    var onPasteRef = (0, use_callback_ref_1.useCallbackRef)(onPaste);
+    var activeCellRef = (0, react_1.useRef)(undefined);
+    var selectionsRef = (0, react_1.useRef)(undefined);
+    var lastPasteModifiersRef = (0, react_1.useRef)(null);
+    // Set paste menu
+    var setShowPasteMenu = (0, atoms_1.useSetShowPasteMenu)();
+    var getSelectionsFromCells = (0, react_1.useCallback)(function (activeCell, selections) {
+        var lastSelection = selections[selections.length - 1];
+        if (!lastSelection) {
+            var range = getCellBounds === null || getCellBounds === void 0 ? void 0 : getCellBounds(activeCell);
+            if (range) {
+                return [{ range: range }];
+            }
+        }
+        return [lastSelection];
+    }, [getCellBounds]);
+    // Get selections from activecell and selections
+    var getSelections = (0, use_callback_ref_1.useCallbackRef)((0, react_1.useCallback)(function () {
+        return getSelectionsFromCells(activeCell, selections);
+    }, [activeCell, selections, getSelectionsFromCells]));
+    //* Keep a ref to avoid closures
+    (0, use_isomorphic_layout_effect_1.useIsomorphicLayoutEffect)(function () {
+        copiedSelectionRef.current = copiedSelections;
+    }, [copiedSelections]);
+    //* Keep a ref to avoid closures
+    (0, use_isomorphic_layout_effect_1.useIsomorphicLayoutEffect)(function () {
+        activeCellRef.current = activeCell;
+    }, [activeCell]);
+    //* Keep a ref to avoid closures
+    (0, use_isomorphic_layout_effect_1.useIsomorphicLayoutEffect)(function () {
+        selectionsRef.current = selections;
+    }, [selections]);
+    (0, use_isomorphic_layout_effect_1.useIsomorphicLayoutEffect)(function () {
+        if (!grid_1.canUseDOM) {
+            return;
+        }
+        var handleKeyDown = function (e) {
+            if (!e.key || e.key.toLowerCase() !== "v") {
+                return;
+            }
+            if (!e.metaKey && !e.ctrlKey) {
+                return;
+            }
+            lastPasteModifiersRef.current = {
+                shiftKey: e.shiftKey,
+                metaKey: e.metaKey,
+                ctrlKey: e.ctrlKey,
+                time: Date.now(),
+            };
+        };
+        document.addEventListener("keydown", handleKeyDown);
+        return function () { return document.removeEventListener("keydown", handleKeyDown); };
+    }, []);
+    // Clear selections in clipboard
+    var clearCopiedSelections = (0, react_1.useCallback)(function () {
+        var _a;
+        // User has not copied any selections yet
+        if (!((_a = copiedSelectionRef.current) === null || _a === void 0 ? void 0 : _a.length)) {
+            return;
+        }
+        setCopiedSelections(config_1.DEFAULT_ARRAY);
+    }, []);
+    // Copy current selection
+    var handleCopy = (0, react_1.useCallback)(function (e) {
+        // Prevent the default behavior.
+        e.preventDefault();
+        // Get current selections
+        var currentSelections = getSelections();
+        if (currentSelections) {
+            // Set copied sheetId
+            copiedSheetIdRef.current = getActiveSheetId();
+            // Update state, so we can highlight it in the grid
+            setCopiedSelections(currentSelections);
+            // Set initial copied selections
+            // So users can paste selection multiple times
+            initialCopiedSelectionRef.current = currentSelections;
+            // Callback
+            onCopyRef === null || onCopyRef === void 0 ? void 0 : onCopyRef(e, sheetId, currentSelections);
+        }
+    }, [onCopyRef, getSelections, getActiveSheetId, sheetId]);
+    // Cut operation
+    var handleCut = (0, react_1.useCallback)(function (e) {
+        // Prevent the default behavior.
+        e.preventDefault();
+        isCutOperation.current = true;
+        // Copy the selections
+        handleCopy(e);
+        // Oncut
+        onCutRef === null || onCutRef === void 0 ? void 0 : onCutRef(e, sheetId);
+    }, [handleCopy, onCutRef, sheetId]);
+    /**
+     * Paste handler
+     * 1. If user has made any selections
+     *  => Paste should only copy cells this selection and ignore original selection
+     * 2. If user only have activeCell and no selections
+     *  => Move original selection to activeCell
+     */
+    var handlePaste = (0, react_1.useCallback)(function (e) {
+        // Prevent the default behavior.
+        e.preventDefault();
+        if (activeCellRef.current) {
+            /* Get current selections */
+            var currentSelections = selectionsRef.current;
+            var selectables = (currentSelections === null || currentSelections === void 0 ? void 0 : currentSelections.length)
+                ? currentSelections
+                : (0, copy_paste_1.createSelectionFromCell)(activeCellRef.current, initialCopiedSelectionRef.current);
+            var finalSelections = (0, selections_1.isSelectionACell)(selectables)
+                ? undefined
+                : selectables;
+            // Active sheet id
+            var sourceSheetId = copiedSheetIdRef.current;
+            var destinationSheetId = sheetId;
+            /* Callback */
+            var recentModifiers = lastPasteModifiersRef.current;
+            var withinWindow = recentModifiers && Date.now() - recentModifiers.time < 1000;
+            var shouldForcePlainText = Boolean(withinWindow &&
+                (recentModifiers === null || recentModifiers === void 0 ? void 0 : recentModifiers.shiftKey) &&
+                ((recentModifiers === null || recentModifiers === void 0 ? void 0 : recentModifiers.metaKey) || (recentModifiers === null || recentModifiers === void 0 ? void 0 : recentModifiers.ctrlKey)));
+            lastPasteModifiersRef.current = null;
+            if (shouldForcePlainText) {
+                e.__forcePlainText =
+                    true;
+            }
+            onPasteRef === null || onPasteRef === void 0 ? void 0 : onPasteRef(e, sourceSheetId, destinationSheetId, initialCopiedSelectionRef.current, activeCellRef.current, currentSelections, finalSelections, isCutOperation.current);
+            // Show paste menu
+            setShowPasteMenu(true);
+            /* Clear copied selections */
+            clearCopiedSelections();
+            /* Remove all clipboard data */
+            if (isCutOperation.current) {
+                // Remove copied selections
+                initialCopiedSelectionRef.current = undefined;
+            }
+        }
+        /* Reset delete flag */
+        isCutOperation.current = false;
+    }, [
+        isCutOperation,
+        clearCopiedSelections,
+        onPasteRef,
+        sheetId,
+        setShowPasteMenu,
+    ]);
+    // From contextmenu
+    var copy = (0, react_1.useCallback)(function () {
+        var _a;
+        var editorEl = (_a = cellEditorInstance === null || cellEditorInstance === void 0 ? void 0 : cellEditorInstance.el) === null || _a === void 0 ? void 0 : _a.call(cellEditorInstance);
+        if (editorEl && grid_1.canUseDOM) {
+            // @todo Vinay
+            // Find a cross browser solution without using execCommand
+            document.execCommand("copy");
+            // editorEl.dispatchEvent(
+            //   new ClipboardEvent("copy", {
+            //     bubbles: true,
+            //     cancelable: true,
+            //     clipboardData: new DataTransfer(),
+            //   })
+            // );
+        }
+        // Focus sheet
+        focusSheet();
+    }, [cellEditorInstance, focusSheet]);
+    // From contextmenu
+    var cut = (0, react_1.useCallback)(function () {
+        var _a;
+        var editorEl = (_a = cellEditorInstance === null || cellEditorInstance === void 0 ? void 0 : cellEditorInstance.el) === null || _a === void 0 ? void 0 : _a.call(cellEditorInstance);
+        if (editorEl && grid_1.canUseDOM) {
+            // @todo Vinay
+            // Find a cross browser solution without using execCommand
+            document.execCommand("cut");
+            // editorEl.dispatchEvent(
+            //   new ClipboardEvent("cut", {
+            //     bubbles: true,
+            //     cancelable: true,
+            //     clipboardData: new DataTransfer(),
+            //   })
+            // );
+        }
+        // Focus sheet
+        focusSheet();
+    }, [cellEditorInstance, focusSheet]);
+    // From contextmenu
+    var paste = (0, react_1.useCallback)(function (pasteSpecialType) { return tslib_1.__awaiter(void 0, void 0, void 0, function () {
+        function getClipboardContents() {
+            return tslib_1.__awaiter(this, void 0, void 0, function () {
+                var editorEl, dataTransfer, evt, clipboardItems, clipboardItems_1, clipboardItems_1_1, clipboardItem, _a, _b, type, blob, text, e_1_1, e_2_1, err_1;
+                var e_2, _c, e_1, _d;
+                var _e, _f, _g;
+                return tslib_1.__generator(this, function (_h) {
+                    switch (_h.label) {
+                        case 0:
+                            _h.trys.push([0, 17, , 18]);
+                            editorEl = (_e = cellEditorInstance === null || cellEditorInstance === void 0 ? void 0 : cellEditorInstance.el) === null || _e === void 0 ? void 0 : _e.call(cellEditorInstance);
+                            // Focus editor
+                            cellEditorInstance === null || cellEditorInstance === void 0 ? void 0 : cellEditorInstance.focus();
+                            dataTransfer = new DataTransfer();
+                            evt = new ClipboardEvent("paste", {
+                                clipboardData: dataTransfer,
+                                bubbles: true,
+                                cancelable: true,
+                            });
+                            return [4 /*yield*/, navigator.clipboard.read()];
+                        case 1:
+                            clipboardItems = _h.sent();
+                            _h.label = 2;
+                        case 2:
+                            _h.trys.push([2, 14, 15, 16]);
+                            clipboardItems_1 = tslib_1.__values(clipboardItems), clipboardItems_1_1 = clipboardItems_1.next();
+                            _h.label = 3;
+                        case 3:
+                            if (!!clipboardItems_1_1.done) return [3 /*break*/, 13];
+                            clipboardItem = clipboardItems_1_1.value;
+                            _h.label = 4;
+                        case 4:
+                            _h.trys.push([4, 10, 11, 12]);
+                            _a = (e_1 = void 0, tslib_1.__values(clipboardItem.types)), _b = _a.next();
+                            _h.label = 5;
+                        case 5:
+                            if (!!_b.done) return [3 /*break*/, 9];
+                            type = _b.value;
+                            return [4 /*yield*/, clipboardItem.getType(type)];
+                        case 6:
+                            blob = _h.sent();
+                            return [4 /*yield*/, blob.text()];
+                        case 7:
+                            text = _h.sent();
+                            (_f = evt.clipboardData) === null || _f === void 0 ? void 0 : _f.setData(type, text);
+                            _h.label = 8;
+                        case 8:
+                            _b = _a.next();
+                            return [3 /*break*/, 5];
+                        case 9: return [3 /*break*/, 12];
+                        case 10:
+                            e_1_1 = _h.sent();
+                            e_1 = { error: e_1_1 };
+                            return [3 /*break*/, 12];
+                        case 11:
+                            try {
+                                if (_b && !_b.done && (_d = _a.return)) _d.call(_a);
+                            }
+                            finally { if (e_1) throw e_1.error; }
+                            return [7 /*endfinally*/];
+                        case 12:
+                            clipboardItems_1_1 = clipboardItems_1.next();
+                            return [3 /*break*/, 3];
+                        case 13: return [3 /*break*/, 16];
+                        case 14:
+                            e_2_1 = _h.sent();
+                            e_2 = { error: e_2_1 };
+                            return [3 /*break*/, 16];
+                        case 15:
+                            try {
+                                if (clipboardItems_1_1 && !clipboardItems_1_1.done && (_c = clipboardItems_1.return)) _c.call(clipboardItems_1);
+                            }
+                            finally { if (e_2) throw e_2.error; }
+                            return [7 /*endfinally*/];
+                        case 16:
+                            if (pasteSpecialType) {
+                                (_g = evt.clipboardData) === null || _g === void 0 ? void 0 : _g.setData("pasteSpecialType", pasteSpecialType);
+                            }
+                            if (editorEl) {
+                                editorEl.dispatchEvent(evt);
+                            }
+                            return [3 /*break*/, 18];
+                        case 17:
+                            err_1 = _h.sent();
+                            console.error(err_1);
+                            return [3 /*break*/, 18];
+                        case 18: return [2 /*return*/];
+                    }
+                });
+            });
+        }
+        return tslib_1.__generator(this, function (_a) {
+            switch (_a.label) {
+                case 0:
+                    if (!grid_1.canUseDOM) return [3 /*break*/, 2];
+                    return [4 /*yield*/, getClipboardContents()];
+                case 1:
+                    _a.sent();
+                    _a.label = 2;
+                case 2:
+                    // Focus sheet
+                    focusSheet();
+                    return [2 /*return*/];
+            }
+        });
+    }); }, [cellEditorInstance, focusSheet]);
+    return {
+        selections: selections,
+        copy: copy,
+        cut: cut,
+        paste: paste,
+        copiedSelections: copiedSheetIdRef.current === sheetId ? copiedSelections : config_1.DEFAULT_ARRAY,
+        clearCopiedSelections: clearCopiedSelections,
+        onInternalCopy: handleCopy,
+        onInternalPaste: handlePaste,
+        onInternalCut: handleCut,
+    };
+};
+exports.useCopyPasteCut = useCopyPasteCut;