@ai-matrx/design-system 0.48.6 → 0.48.8

package/dist/data-table/spreadsheet.js

@@ -638,6 +638,7 @@ function camePastAPortalIntoTheContainer(target) {
   if (!element) return false;
   return element.closest('[data-matrx-table-spreadsheet="true"]') === null;
 }
+var LAYERS_THE_GRID_OPENS = '[data-radix-popper-content-wrapper], [data-radix-portal], [role="menu"], [role="listbox"], [role="dialog"], [role="alertdialog"], [data-sonner-toaster]';
 var NOTHING = [];
 var READ_ONLY_REASON = "This table is view-only \u2014 you can select and copy, but not change cells.";
 function useSpreadsheetGrid(options) {
@@ -893,6 +894,23 @@ function useSpreadsheetGrid(options) {
     },
     [endEdit, focusIsLost]
   );
+  const holdsARange = range !== null;
+  useEffect(() => {
+    if (!holdsARange || typeof document === "undefined") return;
+    const onPointerDown = (event) => {
+      const target = event.target instanceof Element ? event.target : null;
+      const container = catcherRef.current?.closest('[data-matrx-table-spreadsheet="true"]');
+      if (!target || !container || !container.isConnected) return;
+      const table = container.closest("[data-matrx-table]") ?? container;
+      if (table.contains(target) || target.closest(LAYERS_THE_GRID_OPENS)) return;
+      setRange(null);
+      setFillTarget(null);
+      const active = document.activeElement;
+      if (active instanceof HTMLElement && container.contains(active)) active.blur();
+    };
+    document.addEventListener("pointerdown", onPointerDown, true);
+    return () => document.removeEventListener("pointerdown", onPointerDown, true);
+  }, [holdsARange]);
   const controller = useMemo(() => ({ endEdit, select, focusGrid }), [endEdit, select, focusGrid]);
   const onKeyDown = useCallback(
     (event) => {