@rowsncolumns/spreadsheet 10.3.0 → 10.3.1

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

@@ -118,24 +118,36 @@ var useSelection = function (_a) {
      * release always fires `contextmenu`; neither may reach the grid's cell
      * context menu while the user is dragging the fill handle.
      */
+    /**
+     * Documents the in-flight gestures listen on. The grid may render into a
+     * popout window, whose document is not the bundle's global `document`; a
+     * gesture binds its move/up listeners to the document of the element it
+     * started on and unbinds from that same document.
+     */
+    var selectionDocumentRef = (0, react_1.useRef)(null);
+    var fillDocumentRef = (0, react_1.useRef)(null);
+    var dragSelectionDocumentRef = (0, react_1.useRef)(null);
+    var tapDocumentRef = (0, react_1.useRef)(null);
     var contextMenuSuppressorRef = (0, react_1.useRef)(null);
     var releaseContextMenuSuppressor = (0, react_1.useCallback)(function () {
-        var handler = contextMenuSuppressorRef.current;
-        if (!handler)
+        var suppressor = contextMenuSuppressorRef.current;
+        if (!suppressor)
             return;
         contextMenuSuppressorRef.current = null;
-        document.removeEventListener("contextmenu", handler, true);
+        suppressor.ownerDocument.removeEventListener("contextmenu", suppressor.handler, true);
     }, []);
     var suppressNextContextMenu = (0, react_1.useCallback)(function () {
+        var _a;
         if (contextMenuSuppressorRef.current)
             return;
+        var ownerDocument = (_a = fillDocumentRef.current) !== null && _a !== void 0 ? _a : document;
         var handler = function (e) {
             e.preventDefault();
             e.stopPropagation();
             releaseContextMenuSuppressor();
         };
-        contextMenuSuppressorRef.current = handler;
-        document.addEventListener("contextmenu", handler, true);
+        contextMenuSuppressorRef.current = { handler: handler, ownerDocument: ownerDocument };
+        ownerDocument.addEventListener("contextmenu", handler, true);
     }, [releaseContextMenuSuppressor]);
     var selectionsRef = (0, react_1.useRef)([]);
     var fillSelectionRef = (0, react_1.useRef)(undefined);
@@ -358,11 +370,14 @@ var useSelection = function (_a) {
      * Mouse up handler
      */
     var handleMouseUp = (0, react_1.useCallback)(function () {
+        var _a;
         /* Reset selection mode */
         isSelecting.current = false;
-        /* Remove listener */
-        document.removeEventListener("mousemove", handleMouseMove);
-        document.removeEventListener("mouseup", handleMouseUp);
+        /* Remove listener from the document the gesture started on */
+        var ownerDocument = (_a = selectionDocumentRef.current) !== null && _a !== void 0 ? _a : document;
+        selectionDocumentRef.current = null;
+        ownerDocument.removeEventListener("mousemove", handleMouseMove);
+        ownerDocument.removeEventListener("mouseup", handleMouseUp);
         /* Update last selection */
         var curSelections = selectionsRef.current;
         var len = curSelections.length;
@@ -844,6 +859,7 @@ var useSelection = function (_a) {
      * Triggers a new selection start
      */
     var handleMouseDown = (0, react_1.useCallback)(function (e) {
+        var _a, _b;
         var coords = getCellCoordsFromOffset(e.clientX, e.clientY, true);
         if (!coords)
             return;
@@ -865,8 +881,10 @@ var useSelection = function (_a) {
         var hasSelections = selectionsRef.current.length > 0;
         var isDeselecting = isMetaKey && allowDeselect;
         if (!isContextMenuClick && selectionPolicy !== "single") {
-            document.addEventListener("mouseup", handleMouseUp);
-            document.addEventListener("mousemove", handleMouseMove);
+            var ownerDocument = (_b = (0, grid_3.getOwnerDocument)((_a = e.currentTarget) !== null && _a !== void 0 ? _a : e.target)) !== null && _b !== void 0 ? _b : document;
+            selectionDocumentRef.current = ownerDocument;
+            ownerDocument.addEventListener("mouseup", handleMouseUp);
+            ownerDocument.addEventListener("mousemove", handleMouseMove);
         }
         /* Activate selection mode */
         // Disable flag for context menu
@@ -1215,13 +1233,14 @@ var useSelection = function (_a) {
      * comes from the mouseup event, not the mousedown.
      */
     var handleFillMouseUp = (0, react_1.useCallback)(function (e) {
-        var _a;
+        var _a, _b;
         isFilling.current = false;
         var toggle = isFillToggleModifier(e);
         var button = fillButtonRef.current;
-        /* Remove listener */
-        document.removeEventListener("mousemove", handleFillMouseMove);
-        document.removeEventListener("mouseup", handleFillMouseUp);
+        /* Remove listener from the document the gesture started on */
+        var ownerDocument = (_a = fillDocumentRef.current) !== null && _a !== void 0 ? _a : document;
+        ownerDocument.removeEventListener("mousemove", handleFillMouseMove);
+        ownerDocument.removeEventListener("mouseup", handleFillMouseUp);
         // The right-button (or macOS Ctrl+click) `contextmenu` event follows this
         // mouseup; keep swallowing it for one tick, then drop the suppressor so a
         // later, unrelated right-click still opens the cell context menu.
@@ -1234,7 +1253,7 @@ var useSelection = function (_a) {
         var fillSelection = fillSelectionRef.current;
         var shrink = fillShrinkRef.current;
         // Modifier for a drag-back shrink: the last move's state, else the release's.
-        var gestureOptions = (_a = fillModifierRef.current) !== null && _a !== void 0 ? _a : (toggle ? { modifier: "toggle" } : undefined);
+        var gestureOptions = (_b = fillModifierRef.current) !== null && _b !== void 0 ? _b : (toggle ? { modifier: "toggle" } : undefined);
         fillModifierRef.current = undefined;
         /* Update last selection */
         setFillSelection(undefined);
@@ -1312,8 +1331,11 @@ var useSelection = function (_a) {
         sheetId,
     ]);
     var handleFillMouseDown = (0, react_1.useCallback)(function (e) {
+        var _a;
         e.stopPropagation();
         e.preventDefault();
+        var ownerDocument = (_a = (0, grid_3.getOwnerDocument)(e.currentTarget)) !== null && _a !== void 0 ? _a : document;
+        fillDocumentRef.current = ownerDocument;
         var isRightButton = e.button === grid_4.MouseButtonCodes.right;
         fillButtonRef.current = isRightButton ? "right" : "left";
         // Ctrl+drag on the handle must never become the macOS Ctrl+click
@@ -1323,8 +1345,8 @@ var useSelection = function (_a) {
             suppressNextContextMenu();
         }
         isFilling.current = true;
-        document.addEventListener("mousemove", handleFillMouseMove);
-        document.addEventListener("mouseup", handleFillMouseUp);
+        ownerDocument.addEventListener("mousemove", handleFillMouseMove);
+        ownerDocument.addEventListener("mouseup", handleFillMouseUp);
     }, [handleFillMouseMove, handleFillMouseUp, suppressNextContextMenu]);
     /**
      * Remove the last selection from state
@@ -1378,6 +1400,7 @@ var useSelection = function (_a) {
      * When drag/drop is complete
      */
     var handleSelectionMouseUp = (0, react_1.useCallback)(function (e) {
+        var _a;
         var fromSelection = initialDraggedSelection.current;
         var toSelection = draggedSelection.current;
         // Excel reads the modifier at RELEASE: Shift → insert between existing cells (I-beam),
@@ -1456,9 +1479,11 @@ var useSelection = function (_a) {
         draggedSelection.current = void 0;
         draggedSelectionIndex.current = void 0;
         hasUserMovedSelection.current = false;
-        /* Remove event handlers */
-        document.removeEventListener("mouseup", handleSelectionMouseUp);
-        document.removeEventListener("mousemove", handleSelectionMouseMove);
+        /* Remove event handlers from the document the gesture started on */
+        var ownerDocument = (_a = dragSelectionDocumentRef.current) !== null && _a !== void 0 ? _a : document;
+        dragSelectionDocumentRef.current = null;
+        ownerDocument.removeEventListener("mouseup", handleSelectionMouseUp);
+        ownerDocument.removeEventListener("mousemove", handleSelectionMouseMove);
         /* Force render */
         forceRender();
     }, [
@@ -1476,6 +1501,7 @@ var useSelection = function (_a) {
      * When user mouse downs on selection
      */
     var handleSelectionMouseDown = (0, react_1.useCallback)(function (e, activeCell, selection, index, shouldClamp) {
+        var _a;
         if (shouldClamp === void 0) { shouldClamp = true; }
         if (e.isDefaultPrevented()) {
             return;
@@ -1507,9 +1533,11 @@ var useSelection = function (_a) {
         }
         /* Set dragging flag */
         isDragging.current = true;
-        /* Listen to mousemove and mousedown events */
-        document.addEventListener("mouseup", handleSelectionMouseUp);
-        document.addEventListener("mousemove", handleSelectionMouseMove);
+        /* Listen on the document the gesture started on */
+        var ownerDocument = (_a = (0, grid_3.getOwnerDocument)(e.currentTarget)) !== null && _a !== void 0 ? _a : document;
+        dragSelectionDocumentRef.current = ownerDocument;
+        ownerDocument.addEventListener("mouseup", handleSelectionMouseUp);
+        ownerDocument.addEventListener("mousemove", handleSelectionMouseMove);
         /* Force a re-render */
         forceRender();
     }, [
@@ -1581,6 +1609,7 @@ var useSelection = function (_a) {
     var startTimeRef = (0, react_1.useRef)(0);
     var startPosRef = (0, react_1.useRef)({ x: 0, y: 0 });
     var onPointerUp = (0, react_1.useCallback)(function (event) {
+        var _a;
         var endTime = Date.now();
         var maxDuration = 200;
         var maxDistance = 10;
@@ -1592,12 +1621,17 @@ var useSelection = function (_a) {
             handleMouseDown(event);
             handleMouseUp();
         }
-        document.removeEventListener("pointerup", onPointerUp);
+        var ownerDocument = (_a = tapDocumentRef.current) !== null && _a !== void 0 ? _a : document;
+        tapDocumentRef.current = null;
+        ownerDocument.removeEventListener("pointerup", onPointerUp);
     }, [handleMouseDown, handleMouseUp]);
     var onPointerDown = (0, react_1.useCallback)(function (event) {
+        var _a;
         startTimeRef.current = Date.now();
         startPosRef.current = { x: event.clientX, y: event.clientY };
-        document.addEventListener("pointerup", onPointerUp);
+        var ownerDocument = (_a = (0, grid_3.getOwnerDocument)(event.currentTarget)) !== null && _a !== void 0 ? _a : document;
+        tapDocumentRef.current = ownerDocument;
+        ownerDocument.addEventListener("pointerup", onPointerUp);
     }, [onPointerUp]);
     // Add a ref. makeEditable renders way too often
     var handleKeyDownRef = (0, use_callback_ref_1.useCallbackRef)(handleKeyDown);

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

@@ -1 +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"}
+{"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;;;CA+HtB,CAAC;AAYF,eAAO,MAAM,kBAAkB,wKAa7B,CAAC"}

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

@@ -25,6 +25,7 @@ var useTableResizer = function (_a) {
         }
     }, [getCellCoordsFromOffset, modifySelection, scrollToCell]);
     var onMouseUp = (0, react_1.useCallback)(function (event) {
+        var _a;
         // Callback
         var endCell = getCellCoordsFromOffset(event.clientX, event.clientY, false);
         //End
@@ -38,9 +39,11 @@ var useTableResizer = function (_a) {
         }
         // Switch focus to sheet
         focusSheet();
-        // Unbind
-        document.removeEventListener("pointermove", onMouseMove);
-        document.removeEventListener("pointerup", onMouseUp);
+        // Unbind from the document the gesture started on
+        var ownerDocument = (_a = gestureDocumentRef.current) !== null && _a !== void 0 ? _a : document;
+        gestureDocumentRef.current = null;
+        ownerDocument.removeEventListener("pointermove", onMouseMove);
+        ownerDocument.removeEventListener("pointerup", onMouseUp);
     }, [
         onMouseMove,
         onResizeTable,
@@ -49,7 +52,10 @@ var useTableResizer = function (_a) {
         getCellCoordsFromOffset,
         sheetId,
     ]);
-    var onMouseDown = (0, react_1.useCallback)(function (table) {
+    /** Document the in-flight gesture listens on (the grid may live in a popout window) */
+    var gestureDocumentRef = (0, react_1.useRef)(null);
+    var onMouseDown = (0, react_1.useCallback)(function (table, e) {
+        var _a;
         var range = table.range;
         // Create a new selection
         var start = {
@@ -68,9 +74,11 @@ var useTableResizer = function (_a) {
         modifySelection(end);
         // Setter
         setIsResizingTable(true);
-        // Bind
-        document.addEventListener("pointermove", onMouseMove);
-        document.addEventListener("pointerup", onMouseUp);
+        // Bind on the document the gesture started on
+        var ownerDocument = (_a = (0, grid_1.getOwnerDocument)(e === null || e === void 0 ? void 0 : e.currentTarget)) !== null && _a !== void 0 ? _a : document;
+        gestureDocumentRef.current = ownerDocument;
+        ownerDocument.addEventListener("pointermove", onMouseMove);
+        ownerDocument.addEventListener("pointerup", onMouseUp);
     }, [newSelection, modifySelection, onMouseMove, onMouseUp]);
     // Resizer components
     var tableResizers = (0, react_1.useMemo)(function () {
@@ -80,7 +88,7 @@ var useTableResizer = function (_a) {
                 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 }));
+            return (react_1.default.createElement(TableResizer, { key: table.id, cornerCell: cornerCell, onPointerDown: function (e) { return onMouseDown(table, e); }, backgroundColor: theme.themeColors.accent1 }));
         });
     }, [tables, sheetId, theme, onMouseDown]);
     return {

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

@@ -1 +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"}
+{"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;0BA0KJ,KAAK,CAAC,UAAU,CAAC,cAAc,CAAC;iCA5J/B,cAAc,KAAK,IAAI;qDA6CJ,YAAY;sCAQ3B,MAAM,GAAG,SAAS,aAAa,MAAM,GAAG,SAAS;CA2MjE,CAAC"}

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

@@ -32,6 +32,8 @@ var useTouch = function (_a) {
     var scrollTo = _a.scrollTo, _b = _a.scale, scale = _b === void 0 ? 1 : _b, onChangeScale = _a.onChangeScale, _c = _a.minScale, minScale = _c === void 0 ? 0.25 : _c, _d = _a.maxScale, maxScale = _d === void 0 ? 4 : _d;
     var scrollerRef = (0, react_1.useRef)(null);
     var isImmediateRef = (0, react_1.useRef)(false);
+    /** Document the in-flight gesture listens on (the grid may live in a popout window) */
+    var gestureDocumentRef = (0, react_1.useRef)(null);
     var scaleRef = (0, react_1.useRef)(scale);
     var prevScaleRef = (0, react_1.useRef)(scale);
     var pinchStartDistanceRef = (0, react_1.useRef)(null);
@@ -154,20 +156,22 @@ var useTouch = function (_a) {
         scroller.doTouchMove(e.touches, e.timeStamp, pinchScale);
     }, [getScroller]);
     var onTouchEnd = (0, react_1.useCallback)(function (e) {
-        var _a;
+        var _a, _b;
         (_a = getScroller()) === null || _a === void 0 ? void 0 : _a.doTouchEnd(e.timeStamp);
         pinchStartDistanceRef.current = null;
         pinchWarmupDistanceRef.current = null;
         pinchActivatedRef.current = false;
         pinchCenterRef.current = null;
         // Remove listeners
-        document.removeEventListener("touchmove", onTouchMove, false);
-        document.removeEventListener("touchend", onTouchEnd, false);
-        document.removeEventListener("touchcancel", onTouchEnd, false);
+        var ownerDocument = (_b = gestureDocumentRef.current) !== null && _b !== void 0 ? _b : document;
+        gestureDocumentRef.current = null;
+        ownerDocument.removeEventListener("touchmove", onTouchMove, false);
+        ownerDocument.removeEventListener("touchend", onTouchEnd, false);
+        ownerDocument.removeEventListener("touchcancel", onTouchEnd, false);
     }, [getScroller, onTouchMove]);
     // Touch start
     var onTouchStart = (0, react_1.useCallback)(function (event) {
-        var _a, _b;
+        var _a, _b, _c;
         // Fail early
         if (!helpers_1.isTouchDevice || (0, utils_1.isFocusable)(event.target)) {
             return;
@@ -189,9 +193,13 @@ var useTouch = function (_a) {
             (_a = scroller.__zoomLevel) !== null && _a !== void 0 ? _a : scaleRef.current;
         (_b = getScroller()) === null || _b === void 0 ? void 0 : _b.doTouchStart(event.touches, event.timeStamp);
         // event.preventDefault();
-        document.addEventListener("touchmove", onTouchMove, { passive: false });
-        document.addEventListener("touchend", onTouchEnd, false);
-        document.addEventListener("touchcancel", onTouchEnd, false);
+        var ownerDocument = (_c = (0, grid_2.getOwnerDocument)(event.currentTarget)) !== null && _c !== void 0 ? _c : document;
+        gestureDocumentRef.current = ownerDocument;
+        ownerDocument.addEventListener("touchmove", onTouchMove, {
+            passive: false,
+        });
+        ownerDocument.addEventListener("touchend", onTouchEnd, false);
+        ownerDocument.addEventListener("touchcancel", onTouchEnd, false);
     }, [getScroller, onTouchMove, onTouchEnd]);
     // Callback when grid dimensions change
     var onDimensionsChange = (0, react_1.useCallback)(function (_a) {

package/dist/cjs/release-date.js

@@ -4,4 +4,4 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.releaseDate = void 0;
 exports.releaseDate = 
 // @ts-ignore
-(_a = new Date("2026-09-17")) !== null && _a !== void 0 ? _a : new Date("2025-06-18");
+(_a = new Date("2026-09-22")) !== null && _a !== void 0 ? _a : new Date("2025-06-18");

package/dist/esm/components/canvas-grid/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../components/canvas-grid/index.tsx"],"names":[],"mappings":"AA+CA,OAAO,KASN,MAAM,OAAO,CAAC;AAuMf,OAAO,KAAK,EAGV,QAAQ,EAUT,MAAM,aAAa,CAAC;AAcrB,OAAO,KAAK,EACV,wBAAwB,EACxB,iBAAiB,EACjB,eAAe,EAEhB,MAAM,WAAW,CAAC;AAk1KnB,eAAO,MAAM,UAAU,EAA4C,CACjE,CAAC,SAAS,QAAQ,CAAC,GAAG,CAAC,EAEvB,KAAK,EAAE,eAAe,CAAC,CAAC,CAAC,GACvB,wBAAwB,GAAG;IAAE,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,iBAAiB,CAAC,CAAA;CAAE,KAChE,KAAK,CAAC,GAAG,CAAC,OAAO,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../components/canvas-grid/index.tsx"],"names":[],"mappings":"AA+CA,OAAO,KASN,MAAM,OAAO,CAAC;AAuMf,OAAO,KAAK,EAGV,QAAQ,EAUT,MAAM,aAAa,CAAC;AAcrB,OAAO,KAAK,EACV,wBAAwB,EACxB,iBAAiB,EACjB,eAAe,EAEhB,MAAM,WAAW,CAAC;AAy1KnB,eAAO,MAAM,UAAU,EAA4C,CACjE,CAAC,SAAS,QAAQ,CAAC,GAAG,CAAC,EAEvB,KAAK,EAAE,eAAe,CAAC,CAAC,CAAC,GACvB,wBAAwB,GAAG;IAAE,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,iBAAiB,CAAC,CAAA;CAAE,KAChE,KAAK,CAAC,GAAG,CAAC,OAAO,CAAC"}

package/dist/esm/components/canvas-grid/index.js

@@ -1,6 +1,6 @@
 import { tokenize as defaultFormulaTokenizer } from "@rowsncolumns/calculator";
 import { cellToArea, Direction, isAreasEqual } from "@rowsncolumns/grid";
-import { canUseDOM } from "@rowsncolumns/grid";
+import { canUseDOM, getOwnerDocument } from "@rowsncolumns/grid";
 import { getBoundedCells, MouseButtonCodes } from "@rowsncolumns/grid";
 import { isCellWithinBounds } from "@rowsncolumns/grid";
 import { cellIdentifier, Grid as BaseGrid, isEqualCells, } from "@rowsncolumns/grid";
@@ -660,10 +660,13 @@ function CanvasGridComponent(props, forwardedRef) {
         // user gesture on the grid focuses the tabIndex=0 container first, so
         // this only suppresses render-driven refocus; a null container ref
         // (mid mount/unmount) falls through to the original focus behavior.
-        const activeElement = canUseDOM ? document.activeElement : null;
+        // The grid may render into a popout window: read focus from its own
+        // document, never from the bundle's global one.
+        const ownerDocument = getOwnerDocument(gridContainerRef.current);
+        const activeElement = ownerDocument?.activeElement ?? null;
         const gridContainer = gridContainerRef.current;
         if (activeElement &&
-            activeElement !== document.body &&
+            activeElement !== ownerDocument?.body &&
             gridContainer &&
             !gridContainer.contains(activeElement)) {
             return;
@@ -1834,7 +1837,13 @@ function CanvasGridComponent(props, forwardedRef) {
         sheetId,
     ]);
     /* Check if sheet is focused */
-    const isSheetFocused = useCallback(() => canUseDOM ? document.activeElement === cellEditorInstance?.el() : false, [cellEditorInstance]);
+    const isSheetFocused = useCallback(() => {
+        const editorElement = cellEditorInstance?.el();
+        if (!editorElement) {
+            return false;
+        }
+        return getOwnerDocument(editorElement)?.activeElement === editorElement;
+    }, [cellEditorInstance]);
     /**
      * Get Cell Editor
      */
@@ -3692,7 +3701,7 @@ function CanvasGridComponent(props, forwardedRef) {
                 // Keep focus back on sheet
                 // Check if user is focused on the context menu
                 if (canUseDOM &&
-                    document.activeElement?.getAttribute("role") !== "menu") {
+                    getOwnerDocument(gridContainerRef.current)?.activeElement?.getAttribute("role") !== "menu") {
                     focusSheet();
                 }
             }

package/dist/esm/components/embeds/embed-draggable.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"embed-draggable.d.ts","sourceRoot":"","sources":["../../../../components/embeds/embed-draggable.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,oBAAoB,CAAC;AAGxD,OAAO,KAAwC,MAAM,OAAO,CAAC;AAC7D,OAAO,KAAK,EACV,eAAe,EAGhB,MAAM,iBAAiB,CAAC;AAOzB,KAAK,mBAAmB,GAAG,IAAI,CAC7B,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,EACpC,IAAI,GAAG,UAAU,GAAG,UAAU,CAC/B,GAAG;IACF,EAAE,EAAE,MAAM,GAAG,MAAM,CAAC;IACpB,MAAM,EAAE,MAAM,CAAC;IACf,KAAK,EAAE,MAAM,CAAC;IACd,aAAa,EAAE,MAAM,CAAC;IACtB,aAAa,EAAE,MAAM,CAAC;IACtB,UAAU,EAAE,OAAO,CAAC;IACpB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,MAAM,CAAC,EAAE,eAAe,CAAC;IACzB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;;;OAIG;IACH,MAAM,CAAC,CAAC,EAAE,EAAE,MAAM,GAAG,MAAM,EAAE,CAAC,EAAE,MAAM,EAAE,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACzD;;;;OAIG;IACH,QAAQ,CAAC,CACP,EAAE,EAAE,MAAM,GAAG,MAAM,EACnB,CAAC,EAAE,MAAM,EACT,CAAC,EAAE,MAAM,EACT,KAAK,EAAE,MAAM,EACb,MAAM,EAAE,MAAM,GACb,IAAI,CAAC;IACR;;;OAGG;IACH,QAAQ,CAAC,CAAC,EAAE,EAAE,MAAM,GAAG,MAAM,GAAG,IAAI,CAAC;IACrC;;OAEG;IACH,UAAU,EAAE,aAAa,CAAC;IAC1B,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,KAAK,KAAK,CAAC,SAAS,CAAC;CAC9D,CAAC;AAoBF,eAAO,MAAM,cAAc,GAAI,mNAoB5B,mBAAmB,sBA0KrB,CAAC"}
+{"version":3,"file":"embed-draggable.d.ts","sourceRoot":"","sources":["../../../../components/embeds/embed-draggable.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,oBAAoB,CAAC;AAGxD,OAAO,KAAwC,MAAM,OAAO,CAAC;AAC7D,OAAO,KAAK,EACV,eAAe,EAGhB,MAAM,iBAAiB,CAAC;AAOzB,KAAK,mBAAmB,GAAG,IAAI,CAC7B,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,EACpC,IAAI,GAAG,UAAU,GAAG,UAAU,CAC/B,GAAG;IACF,EAAE,EAAE,MAAM,GAAG,MAAM,CAAC;IACpB,MAAM,EAAE,MAAM,CAAC;IACf,KAAK,EAAE,MAAM,CAAC;IACd,aAAa,EAAE,MAAM,CAAC;IACtB,aAAa,EAAE,MAAM,CAAC;IACtB,UAAU,EAAE,OAAO,CAAC;IACpB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,MAAM,CAAC,EAAE,eAAe,CAAC;IACzB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;;;OAIG;IACH,MAAM,CAAC,CAAC,EAAE,EAAE,MAAM,GAAG,MAAM,EAAE,CAAC,EAAE,MAAM,EAAE,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACzD;;;;OAIG;IACH,QAAQ,CAAC,CACP,EAAE,EAAE,MAAM,GAAG,MAAM,EACnB,CAAC,EAAE,MAAM,EACT,CAAC,EAAE,MAAM,EACT,KAAK,EAAE,MAAM,EACb,MAAM,EAAE,MAAM,GACb,IAAI,CAAC;IACR;;;OAGG;IACH,QAAQ,CAAC,CAAC,EAAE,EAAE,MAAM,GAAG,MAAM,GAAG,IAAI,CAAC;IACrC;;OAEG;IACH,UAAU,EAAE,aAAa,CAAC;IAC1B,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,KAAK,KAAK,CAAC,SAAS,CAAC;CAC9D,CAAC;AAoBF,eAAO,MAAM,cAAc,GAAI,mNAoB5B,mBAAmB,sBA6KrB,CAAC"}

package/dist/esm/components/embeds/embed-draggable.js

@@ -1,4 +1,4 @@
-import { useGridContext } from "@rowsncolumns/grid";
+import { getOwnerDocument, useGridContext } from "@rowsncolumns/grid";
 import { cn } from "@rowsncolumns/ui";
 import React, { useCallback, useRef, useState } from "react";
 import Draggable from "react-draggable";
@@ -30,7 +30,8 @@ export const EmbedDraggable = ({ id, scale = 1, height, width, offsetXPixels, of
     const nodeRef = useRef(null);
     // Focus if selected index changes
     useIsomorphicLayoutEffect(() => {
-        if (isSelected && document.activeElement !== nodeRef.current) {
+        if (isSelected &&
+            getOwnerDocument(nodeRef.current)?.activeElement !== nodeRef.current) {
             nodeRef.current?.focus({ preventScroll: true });
         }
     }, [isSelected]);

package/dist/esm/components/resizer/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../components/resizer/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA8B,MAAM,OAAO,CAAC;AAEnD,KAAK,YAAY,GAAG;IAClB,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC,KAAK,EAAE,MAAM,CAAC;IACd,GAAG,CAAC,EAAE,MAAM,CAAC;CACd,CAAC;AAIF,eAAO,MAAM,OAAO,GAAI,0BAA8B,YAAY,sBAoDjE,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../components/resizer/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAA8B,MAAM,OAAO,CAAC;AAEnD,KAAK,YAAY,GAAG;IAClB,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC,KAAK,EAAE,MAAM,CAAC;IACd,GAAG,CAAC,EAAE,MAAM,CAAC;CACd,CAAC;AAIF,eAAO,MAAM,OAAO,GAAI,0BAA8B,YAAY,sBAuDjE,CAAC"}

package/dist/esm/components/resizer/index.js

@@ -1,3 +1,4 @@
+import { getOwnerDocument } from "@rowsncolumns/grid";
 import React, { useCallback, useRef } from "react";
 const RESIZER_HEIGHT = 4;
 export const Resizer = ({ onChange, value, min = 0 }) => {
@@ -14,15 +15,18 @@ export const Resizer = ({ onChange, value, min = 0 }) => {
     }, [min, onChange]);
     const handleMouseUp = useCallback(() => {
         dragging.current = false;
-        document.removeEventListener("mousemove", handleMouseMove);
-        document.removeEventListener("mouseup", handleMouseUp);
+        // The resizer may live in a popout window: unbind from its own document
+        const ownerDocument = getOwnerDocument(el.current) ?? document;
+        ownerDocument.removeEventListener("mousemove", handleMouseMove);
+        ownerDocument.removeEventListener("mouseup", handleMouseUp);
     }, [handleMouseMove]);
     const handleMouseDown = useCallback((e) => {
         dragging.current = true;
         const top = el.current?.style.top ? parseInt(el.current?.style.top) : 0;
         startY.current = e.pageY - top;
-        document.addEventListener("mousemove", handleMouseMove);
-        document.addEventListener("mouseup", handleMouseUp);
+        const ownerDocument = getOwnerDocument(el.current) ?? document;
+        ownerDocument.addEventListener("mousemove", handleMouseMove);
+        ownerDocument.addEventListener("mouseup", handleMouseUp);
     }, [handleMouseMove, handleMouseUp]);
     return (React.createElement("div", { onMouseDown: handleMouseDown, ref: el, style: {
             userSelect: "none",

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../components/sheet-search/index.tsx"],"names":[],"mappings":"AAQA,OAAO,KAA2B,MAAM,OAAO,CAAC;AAKhD;;;;GAIG;AACH,MAAM,MAAM,kBAAkB,GAAG;IAC/B,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB,CAAC;AAEF,MAAM,MAAM,gBAAgB,GAAG;IAC7B,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,QAAQ,CAAC,KAAK,EAAE,MAAM,EAAE,OAAO,CAAC,EAAE,kBAAkB,GAAG,IAAI,CAAC;IAC5D,OAAO,IAAI,IAAI,CAAC;IAChB,MAAM,IAAI,IAAI,CAAC;IACf,UAAU,IAAI,IAAI,CAAC;IACnB,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB;;;OAGG;IACH,oBAAoB,CAAC,EAAE,OAAO,CAAC;IAC/B;;;OAGG;IACH,SAAS,CAAC,CAAC,WAAW,EAAE,MAAM,GAAG,IAAI,CAAC;IACtC;;OAEG;IACH,YAAY,CAAC,CAAC,WAAW,EAAE,MAAM,GAAG,IAAI,CAAC;IACzC,kBAAkB,CAAC,EAAE,MAAM,CAAC;CAC7B,CAAC;AAEF,eAAO,MAAM,WAAW,GAAI,8MAgBzB,gBAAgB,6BAmNlB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../components/sheet-search/index.tsx"],"names":[],"mappings":"AASA,OAAO,KAA2B,MAAM,OAAO,CAAC;AAKhD;;;;GAIG;AACH,MAAM,MAAM,kBAAkB,GAAG;IAC/B,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB,CAAC;AAEF,MAAM,MAAM,gBAAgB,GAAG;IAC7B,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,QAAQ,CAAC,KAAK,EAAE,MAAM,EAAE,OAAO,CAAC,EAAE,kBAAkB,GAAG,IAAI,CAAC;IAC5D,OAAO,IAAI,IAAI,CAAC;IAChB,MAAM,IAAI,IAAI,CAAC;IACf,UAAU,IAAI,IAAI,CAAC;IACnB,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB;;;OAGG;IACH,oBAAoB,CAAC,EAAE,OAAO,CAAC;IAC/B;;;OAGG;IACH,SAAS,CAAC,CAAC,WAAW,EAAE,MAAM,GAAG,IAAI,CAAC;IACtC;;OAEG;IACH,YAAY,CAAC,CAAC,WAAW,EAAE,MAAM,GAAG,IAAI,CAAC;IACzC,kBAAkB,CAAC,EAAE,MAAM,CAAC;CAC7B,CAAC;AAEF,eAAO,MAAM,WAAW,GAAI,8MAgBzB,gBAAgB,6BAqNlB,CAAC"}

package/dist/esm/components/sheet-search/index.js

@@ -1,6 +1,7 @@
 import { ChevronDownIcon, ChevronUpIcon, Cross2Icon, } from "@rowsncolumns/icons";
 import { Button, IconButton, Input } from "@rowsncolumns/ui";
 import { cn } from "@rowsncolumns/ui";
+import { getOwnerDocument } from "@rowsncolumns/grid";
 import { canUseDOM } from "@rowsncolumns/utils";
 import React, { useRef, useState } from "react";
 import { useSpreadsheet } from "../../atoms";
@@ -51,9 +52,11 @@ export const SheetSearch = ({ onSubmit, onReset, onNext, onPrevious, searchQuery
                     onResetSearch();
                 }
             };
-            document.addEventListener("keydown", handler);
+            // The search box may live in a popout window: listen on its document
+            const ownerDocument = getOwnerDocument(inputRef.current) ?? document;
+            ownerDocument.addEventListener("keydown", handler);
             return () => {
-                document.removeEventListener("keydown", handler);
+                ownerDocument.removeEventListener("keydown", handler);
             };
         }
     }, [isActive]);

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

@@ -1 +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;AAYvE,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,2FAA2F;AAC3F,MAAM,MAAM,qBAAqB,GAAG,KAAK,GAAG,UAAU,GAAG,UAAU,GAAG,QAAQ,CAAC;AAE/E;;;;;;;;GAQG;AACH,MAAM,MAAM,mBAAmB,GAAG;IAChC,KAAK,CAAC,EAAE,KAAK,GAAG,QAAQ,GAAG,UAAU,GAAG,SAAS,CAAC;IAClD,SAAS,CAAC,EAAE,qBAAqB,CAAC;IAClC,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB,CAAC;AAEF,wFAAwF;AACxF,MAAM,MAAM,mBAAmB,GAAG,gBAAgB,GAAG,mBAAmB,CAAC;AAEzE,eAAO,MAAM,eAAe,GAAI,0EAQ7B,oBAAoB;;;;2BAmSG,mBAAmB;;IA4DzC,wEAAwE;;IAExE,kDAAkD;;;;wBA1O9C,cAAc;yBAwDd,cAAc;uBAvBd,cAAc;CAiNrB,CAAC"}
+{"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;AAYvE,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,2FAA2F;AAC3F,MAAM,MAAM,qBAAqB,GAAG,KAAK,GAAG,UAAU,GAAG,UAAU,GAAG,QAAQ,CAAC;AAE/E;;;;;;;;GAQG;AACH,MAAM,MAAM,mBAAmB,GAAG;IAChC,KAAK,CAAC,EAAE,KAAK,GAAG,QAAQ,GAAG,UAAU,GAAG,SAAS,CAAC;IAClD,SAAS,CAAC,EAAE,qBAAqB,CAAC;IAClC,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB,CAAC;AAEF,wFAAwF;AACxF,MAAM,MAAM,mBAAmB,GAAG,gBAAgB,GAAG,mBAAmB,CAAC;AAEzE,eAAO,MAAM,eAAe,GAAI,0EAQ7B,oBAAoB;;;;2BAsSG,mBAAmB;;IA4DzC,wEAAwE;;IAExE,kDAAkD;;;;wBA1O9C,cAAc;yBAwDd,cAAc;uBAvBd,cAAc;CAiNrB,CAAC"}

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

@@ -1,4 +1,4 @@
-import { canUseDOM } from "@rowsncolumns/grid";
+import { canUseDOM, getOwnerDocument } from "@rowsncolumns/grid";
 import { getHotkeyKey } from "@rowsncolumns/utils";
 import { useCallback, useRef, useState } from "react";
 import { createSelectionFromCell } from "../api/copy-paste";
@@ -62,6 +62,8 @@ export const useCopyPasteCut = ({ selections, activeCell, sheetId, onPaste, onCo
         if (!canUseDOM) {
             return;
         }
+        // The cell editor lives in the grid's document, which may be a popout window
+        const ownerDocument = getOwnerDocument(cellEditorInstance?.el()) ?? document;
         const handleKeyDown = (e) => {
             if (!e.key || getHotkeyKey(e) !== "v") {
                 return;
@@ -76,9 +78,9 @@ export const useCopyPasteCut = ({ selections, activeCell, sheetId, onPaste, onCo
                 time: Date.now(),
             };
         };
-        document.addEventListener("keydown", handleKeyDown);
-        return () => document.removeEventListener("keydown", handleKeyDown);
-    }, []);
+        ownerDocument.addEventListener("keydown", handleKeyDown);
+        return () => ownerDocument.removeEventListener("keydown", handleKeyDown);
+    }, [cellEditorInstance]);
     // Clear selections in clipboard
     const clearCopiedSelections = useCallback(() => {
         // User has not copied any selections yet

package/dist/esm/hooks/use-header-actions.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"use-header-actions.d.ts","sourceRoot":"","sources":["../../../hooks/use-header-actions.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EACV,aAAa,EACb,YAAY,EACZ,aAAa,EACb,YAAY,EACZ,aAAa,EACd,MAAM,oBAAoB,CAAC;AAC5B,OAAO,KAAiD,MAAM,OAAO,CAAC;AAGtE,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,mCAAmC,CAAC;AAGzE,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,UAAU,CAAC;AAErC,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAEpD,KAAK,gBAAgB,GAAG;IACtB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,UAAU,CAAC,EAAE,aAAa,GAAG,IAAI,CAAC;IAClC,iBAAiB,EAAE,MAAM,YAAY,GAAG,SAAS,CAAC;IAClD,uBAAuB,EAAE,CAAC,IAAI,EAAE,aAAa,KAAK,YAAY,GAAG,SAAS,CAAC;IAC3E,6BAA6B,EAAE,CAC7B,CAAC,EAAE,MAAM,EACT,CAAC,EAAE,MAAM,KACN,aAAa,GAAG,IAAI,GAAG,SAAS,CAAC;IACtC;;OAEG;IACH,QAAQ,CAAC,EAAE,eAAe,CAAC,UAAU,CAAC,CAAC;IACvC;;OAEG;IACH,UAAU,CAAC,IAAI,IAAI,CAAC;IACpB;;OAEG;IACH,SAAS,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,IAAI,EAAE,IAAI,KAAK,IAAI,CAAC;IAChD,WAAW,CAAC,WAAW,EAAE,MAAM,GAAG,OAAO,CAAC;IAC1C,cAAc,CAAC,QAAQ,EAAE,MAAM,GAAG,OAAO,CAAC;IAC1C;;;;;OAKG;IACH,eAAe,CAAC,IAAI,EAAE,aAAa,EAAE,CAAC,EAAE,MAAM,EAAE,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACjE,YAAY,CAAC,WAAW,EAAE,MAAM,GAAG,IAAI,CAAC;IACxC;;;;OAIG;IACH,aAAa,EAAE,UAAU,CAAC,OAAO,YAAY,CAAC,CAAC,eAAe,CAAC,CAAC;IAChE,WAAW,IAAI,aAAa,CAAC;IAC7B,cAAc,EAAE,CAAC,WAAW,EAAE,MAAM,KAAK,OAAO,CAAC;IACjD,oBAAoB,CAAC,EAAE,OAAO,CAAC;IAC/B,UAAU,EAAE,MAAM,CAAC;IACnB,aAAa,EAAE,MAAM,CAAC;IACtB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,iBAAiB,EAAE,MAAM,CAAC;IAC1B,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,cAAc,EAAE,MAAM,CAAC;IACvB,eAAe,EAAE,MAAM,CAAC;IACxB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,EAAE,MAAM,CAAC;IAChB,qBAAqB,EAAE,MAAM,EAAE,CAAC;IAChC,wBAAwB,EAAE,MAAM,EAAE,CAAC;IACnC,qBAAqB,CAAC,EAAE,OAAO,CAAC;CACjC,CAAC;AAEF;;;;GAIG;AACH,eAAO,MAAM,gBAAgB,GAAI,ufA+B9B,gBAAgB;;;;;CA8VlB,CAAC"}
+{"version":3,"file":"use-header-actions.d.ts","sourceRoot":"","sources":["../../../hooks/use-header-actions.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EACV,aAAa,EACb,YAAY,EACZ,aAAa,EACb,YAAY,EACZ,aAAa,EACd,MAAM,oBAAoB,CAAC;AAE5B,OAAO,KAAiD,MAAM,OAAO,CAAC;AAGtE,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,mCAAmC,CAAC;AAGzE,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,UAAU,CAAC;AAErC,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAEpD,KAAK,gBAAgB,GAAG;IACtB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,UAAU,CAAC,EAAE,aAAa,GAAG,IAAI,CAAC;IAClC,iBAAiB,EAAE,MAAM,YAAY,GAAG,SAAS,CAAC;IAClD,uBAAuB,EAAE,CAAC,IAAI,EAAE,aAAa,KAAK,YAAY,GAAG,SAAS,CAAC;IAC3E,6BAA6B,EAAE,CAC7B,CAAC,EAAE,MAAM,EACT,CAAC,EAAE,MAAM,KACN,aAAa,GAAG,IAAI,GAAG,SAAS,CAAC;IACtC;;OAEG;IACH,QAAQ,CAAC,EAAE,eAAe,CAAC,UAAU,CAAC,CAAC;IACvC;;OAEG;IACH,UAAU,CAAC,IAAI,IAAI,CAAC;IACpB;;OAEG;IACH,SAAS,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,IAAI,EAAE,IAAI,KAAK,IAAI,CAAC;IAChD,WAAW,CAAC,WAAW,EAAE,MAAM,GAAG,OAAO,CAAC;IAC1C,cAAc,CAAC,QAAQ,EAAE,MAAM,GAAG,OAAO,CAAC;IAC1C;;;;;OAKG;IACH,eAAe,CAAC,IAAI,EAAE,aAAa,EAAE,CAAC,EAAE,MAAM,EAAE,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACjE,YAAY,CAAC,WAAW,EAAE,MAAM,GAAG,IAAI,CAAC;IACxC;;;;OAIG;IACH,aAAa,EAAE,UAAU,CAAC,OAAO,YAAY,CAAC,CAAC,eAAe,CAAC,CAAC;IAChE,WAAW,IAAI,aAAa,CAAC;IAC7B,cAAc,EAAE,CAAC,WAAW,EAAE,MAAM,KAAK,OAAO,CAAC;IACjD,oBAAoB,CAAC,EAAE,OAAO,CAAC;IAC/B,UAAU,EAAE,MAAM,CAAC;IACnB,aAAa,EAAE,MAAM,CAAC;IACtB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,iBAAiB,EAAE,MAAM,CAAC;IAC1B,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,cAAc,EAAE,MAAM,CAAC;IACvB,eAAe,EAAE,MAAM,CAAC;IACxB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,EAAE,MAAM,CAAC;IAChB,qBAAqB,EAAE,MAAM,EAAE,CAAC;IAChC,wBAAwB,EAAE,MAAM,EAAE,CAAC;IACnC,qBAAqB,CAAC,EAAE,OAAO,CAAC;CACjC,CAAC;AAEF;;;;GAIG;AACH,eAAO,MAAM,gBAAgB,GAAI,ufA+B9B,gBAAgB;;;;;CAoWlB,CAAC"}

package/dist/esm/hooks/use-header-actions.js

@@ -1,3 +1,4 @@
+import { getOwnerDocument } from "@rowsncolumns/grid";
 import React, { useCallback, useMemo, useRef, useState } from "react";
 import { scheduleLowPriorityCallback } from "../api/scheduler";
 import { Headermenu } from "../components/header-menu";
@@ -12,6 +13,8 @@ export const useHeaderActions = ({ activeCell, getScrollPosition, getCellOffsetF
     const [dimension, setDimension] = useState(0);
     const [isDragging, setIsDragging] = useState(false);
     const dragStartPos = useRef(0);
+    /** Document the in-flight gesture listens on (the grid may live in a popout window) */
+    const gestureDocumentRef = useRef(null);
     const activeCellRef = useRef(undefined);
     const axisRef = useRef(undefined);
     const dimensionRef = useRef(0);
@@ -129,8 +132,10 @@ export const useHeaderActions = ({ activeCell, getScrollPosition, getCellOffsetF
      * Called when user finishes dragging the component
      */
     const handleMouseUp = useCallback(() => {
-        document.removeEventListener("mousemove", handleMouseMove);
-        document.removeEventListener("mouseup", handleMouseUp);
+        const ownerDocument = gestureDocumentRef.current ?? document;
+        gestureDocumentRef.current = null;
+        ownerDocument.removeEventListener("mousemove", handleMouseMove);
+        ownerDocument.removeEventListener("mouseup", handleMouseUp);
         // Header resizer does not update otherwise.. @Vinay TODO Fix this later
         scheduleLowPriorityCallback(() => {
             setDimension(0);
@@ -172,8 +177,10 @@ export const useHeaderActions = ({ activeCell, getScrollPosition, getCellOffsetF
         dragStartPos.current =
             axisRef.current === "x" ? relativePosition.y : relativePosition.x;
         initialDimensionRef.current = axisRef.current === "x" ? height : width;
-        document.addEventListener("mousemove", handleMouseMove);
-        document.addEventListener("mouseup", handleMouseUp);
+        const ownerDocument = getOwnerDocument(e.currentTarget) ?? document;
+        gestureDocumentRef.current = ownerDocument;
+        ownerDocument.addEventListener("mousemove", handleMouseMove);
+        ownerDocument.addEventListener("mouseup", handleMouseUp);
     }, [
         activeCell,
         handleMouseMove,

package/dist/esm/hooks/use-move-columns-rows.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"use-move-columns-rows.d.ts","sourceRoot":"","sources":["../../../hooks/use-move-columns-rows.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EACV,aAAa,EACb,YAAY,EACZ,qBAAqB,EACrB,aAAa,EACb,YAAY,EACb,MAAM,oBAAoB,CAAC;AAQ5B,OAAO,KAAiD,MAAM,OAAO,CAAC;AAEtE,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,mCAAmC,CAAC;AACzE,OAAO,EACL,KAAK,kBAAkB,EAExB,MAAM,2BAA2B,CAAC;AAKnC,MAAM,MAAM,oBAAoB,GAAG;IACjC;;;OAGG;IACH,uBAAuB,CAAC,IAAI,EAAE,aAAa,GAAG,YAAY,GAAG,SAAS,CAAC;IACvE,uBAAuB,CACrB,CAAC,EAAE,MAAM,EACT,CAAC,EAAE,MAAM,EACT,aAAa,CAAC,EAAE,OAAO,GACtB,aAAa,GAAG,IAAI,GAAG,SAAS,CAAC;IACpC,6BAA6B,EAAE,CAC7B,CAAC,EAAE,MAAM,EACT,CAAC,EAAE,MAAM,KACN,aAAa,GAAG,IAAI,GAAG,SAAS,CAAC;IACtC,YAAY,EAAE,CAAC,IAAI,EAAE,qBAAqB,KAAK,IAAI,GAAG,SAAS,CAAC;IAChE,UAAU,EAAE,MAAM,IAAI,CAAC;IACvB,OAAO,CAAC,EAAE,MAAM,EAAE,CAAC;IACnB,IAAI,CAAC,EAAE,MAAM,EAAE,CAAC;IAChB,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,cAAc,EAAE,MAAM,CAAC;IACvB,eAAe,EAAE,MAAM,CAAC;IACxB,aAAa,EAAE,eAAe,CAAC,eAAe,CAAC,CAAC;IAChD,UAAU,EAAE,eAAe,CAAC,YAAY,CAAC,CAAC;IAC1C;;OAEG;IACH,iBAAiB,EAAE,MAAM,YAAY,GAAG,SAAS,CAAC;IAClD,WAAW,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,UAAU,CAAC,cAAc,CAAC,KAAK,IAAI,CAAC;IAChE,kBAAkB,EAAE,eAAe,CAAC,oBAAoB,CAAC,CAAC;IAC1D,kBAAkB,EAAE,eAAe,CAAC,oBAAoB,CAAC,CAAC;IAC1D,QAAQ,EAAE,MAAM,CAAC;IACjB,WAAW,EAAE,MAAM,CAAC;IACpB,OAAO,EAAE,MAAM,CAAC;IAChB,QAAQ,EAAE,OAAO,CAAC;IAClB,UAAU,EAAE,aAAa,CAAC;IAC1B,uBAAuB,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC,kBAAkB,CAAC,CAAC;CACnE,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,qBAAqB,GAAI,8YAwBnC,oBAAoB;;;;CA6ZtB,CAAC"}
+{"version":3,"file":"use-move-columns-rows.d.ts","sourceRoot":"","sources":["../../../hooks/use-move-columns-rows.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EACV,aAAa,EACb,YAAY,EACZ,qBAAqB,EACrB,aAAa,EACb,YAAY,EACb,MAAM,oBAAoB,CAAC;AAQ5B,OAAO,KAAiD,MAAM,OAAO,CAAC;AAEtE,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,mCAAmC,CAAC;AACzE,OAAO,EACL,KAAK,kBAAkB,EAExB,MAAM,2BAA2B,CAAC;AAKnC,MAAM,MAAM,oBAAoB,GAAG;IACjC;;;OAGG;IACH,uBAAuB,CAAC,IAAI,EAAE,aAAa,GAAG,YAAY,GAAG,SAAS,CAAC;IACvE,uBAAuB,CACrB,CAAC,EAAE,MAAM,EACT,CAAC,EAAE,MAAM,EACT,aAAa,CAAC,EAAE,OAAO,GACtB,aAAa,GAAG,IAAI,GAAG,SAAS,CAAC;IACpC,6BAA6B,EAAE,CAC7B,CAAC,EAAE,MAAM,EACT,CAAC,EAAE,MAAM,KACN,aAAa,GAAG,IAAI,GAAG,SAAS,CAAC;IACtC,YAAY,EAAE,CAAC,IAAI,EAAE,qBAAqB,KAAK,IAAI,GAAG,SAAS,CAAC;IAChE,UAAU,EAAE,MAAM,IAAI,CAAC;IACvB,OAAO,CAAC,EAAE,MAAM,EAAE,CAAC;IACnB,IAAI,CAAC,EAAE,MAAM,EAAE,CAAC;IAChB,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,cAAc,EAAE,MAAM,CAAC;IACvB,eAAe,EAAE,MAAM,CAAC;IACxB,aAAa,EAAE,eAAe,CAAC,eAAe,CAAC,CAAC;IAChD,UAAU,EAAE,eAAe,CAAC,YAAY,CAAC,CAAC;IAC1C;;OAEG;IACH,iBAAiB,EAAE,MAAM,YAAY,GAAG,SAAS,CAAC;IAClD,WAAW,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,UAAU,CAAC,cAAc,CAAC,KAAK,IAAI,CAAC;IAChE,kBAAkB,EAAE,eAAe,CAAC,oBAAoB,CAAC,CAAC;IAC1D,kBAAkB,EAAE,eAAe,CAAC,oBAAoB,CAAC,CAAC;IAC1D,QAAQ,EAAE,MAAM,CAAC;IACjB,WAAW,EAAE,MAAM,CAAC;IACpB,OAAO,EAAE,MAAM,CAAC;IAChB,QAAQ,EAAE,OAAO,CAAC;IAClB,UAAU,EAAE,aAAa,CAAC;IAC1B,uBAAuB,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC,kBAAkB,CAAC,CAAC;CACnE,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,qBAAqB,GAAI,8YAwBnC,oBAAoB;;;;CAmatB,CAAC"}