intergalactic 15.125.0 → 15.126.0-prerelease.1

package/utils/lib/use/useFocusLock.mjs

@@ -1,266 +1,146 @@
-import _typeof from "@babel/runtime/helpers/typeof";
-import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
-import canUseDOM from "../canUseDOM.mjs";
-import LocalReact from 'react';
-import { isFocusInside } from "../focus-lock/isFocusInside.mjs";
-import { setFocus } from "../focus-lock/setFocus.mjs";
-import { getFocusableIn } from "../focus-lock/getFocusableIn.mjs";
-import { addFocusBorders, removeFocusBorders } from "../focus-lock/focusBorders.mjs";
-export { isFocusInside, setFocus };
-var syntheticEvents = {
-  blur: 'focusout-intergalactic-focus-lock-synthetic',
-  keydown: 'keydown-intergalactic-focus-lock-synthetic'
-};
-/**
- * Synthetic event are special events that always bypass all propagation guards and reaches focus lock event listeners.
- * You should always prevent native event propagation in order to prevent focus enforcing double calls.
- */
-export var makeFocusLockSyntheticEvent = function makeFocusLockSyntheticEvent(baseEvent) {
-  var event = baseEvent;
-  var type = event.type;
-  if (!(type in syntheticEvents)) {
-    var supported = Object.keys(syntheticEvents).join(', ');
-    throw new Error("Unable to make synthetic event for ".concat(type, ", ").concat(supported, " are supported"));
+import g from "@babel/runtime/helpers/esm/typeof";
+import q from "@babel/runtime/helpers/esm/toConsumableArray";
+import C from "../canUseDOM.mjs";
+import B from "react";
+import { isFocusInside as M } from "../focus-lock/isFocusInside.mjs";
+import { setFocus as L } from "../focus-lock/setFocus.mjs";
+import { getFocusableIn as w } from "../focus-lock/getFocusableIn.mjs";
+import { addFocusBorders as F, removeFocusBorders as K } from "../focus-lock/focusBorders.mjs";
+var l = {
+  blur: "focusout-intergalactic-focus-lock-synthetic",
+  keydown: "keydown-intergalactic-focus-lock-synthetic"
+}, T = function(r) {
+  var e = r, u = e.type;
+  if (!(u in l)) {
+    var n = Object.keys(l).join(", ");
+    throw new Error("Unable to make synthetic event for ".concat(u, ", ").concat(n, " are supported"));
   }
-  var syntheticEvent = new Event(syntheticEvents[type], {
-    bubbles: true
-  });
-  Object.defineProperty(syntheticEvent, 'target', {
-    writable: false,
-    value: event.target
+  var o = new Event(l[u], {
+    bubbles: !0
   });
-  Object.defineProperty(syntheticEvent, 'relatedTarget', {
-    writable: false,
-    value: event.relatedTarget
-  });
-  return syntheticEvent;
-};
-var useFocusBorders = function useFocusBorders(React, disabled, trapRef) {
-  useUniqueIdHookMock(React);
-  React.useEffect(function () {
-    var trapNode = trapRef === null || trapRef === void 0 ? void 0 : trapRef.current;
-    if (trapNode && !disabled && getFocusableIn(trapNode).length > 0) {
-      addFocusBorders(trapNode);
-    }
-    return function () {
-      if (trapNode) {
-        removeFocusBorders(trapNode);
-      }
+  return Object.defineProperty(o, "target", {
+    writable: !1,
+    value: e.target
+  }), Object.defineProperty(o, "relatedTarget", {
+    writable: !1,
+    value: e.relatedTarget
+  }), o;
+}, N = function(r, e, u) {
+  S(r), r.useEffect(function() {
+    var n = u == null ? void 0 : u.current;
+    return n && !e && w(n).length > 0 && F(n), function() {
+      n && K(n);
     };
-  }, [disabled]);
-};
-var uniqueId = 0;
-var getUniqueId = function getUniqueId(prefix) {
-  return "".concat(prefix, "-").concat(Math.random().toString(36).slice(2), "-").concat(uniqueId++);
-};
-
-/**
- * # Focus lock hook merging
- * In some cases same page might contain different versions of components.
- * In such cases, we need to ensure that only one version of focus lock hook is used.
- * So, it's why we have `useFocusLockHook` function that is wrapped into `useFocusLock`.
- *
- * While evaluating this file code, we check if global focus lock hook is already defined.
- * If it's defined, we replace it ONLY if our version is higher and no components currently use it.
- * The last condition is very important because we are unable to replace React hook without reimplementing
- * React hooks lifecycle in some kind of wrapper.
- *
- * ## Versioning
- * Such versions merging requires us to keep hook api backward compatible.
- * When hook logic changes, the variable `focusLockVersion` should be incremented.
- *
- * Version update `1 -> 2`. Fixed call `safeMoveFocusInside` in `handleFocusIn` with correct second parameter (focusCameFrom instead of event.target)
- * Version update `2 -> 3`. Fixed React version isolation in nested hooks (`useFocusBorders`, `useUniqueId`).
- * Version update `3 -> 4`. Fixed lock for correct working with iframes in modal
- * Version update `4 -> 5`. Changed placements for border - now they wrap trap node
- *
- * Initially (for a several versions) key was `__intergalactic_focus_lock_hook_`.
- * Making it respect react version required to change key. So key was changed to `__intergalactic_focus_lock_hook_react_v_respectful`.
- *
- * ## React hooks order
- * When updating from version 2 to version 3 `useUniqueId` hook was removed.
- * Due to replacing useFocusLock hook in runtime, the order of hooks must be preserved.
- * So, useUniqueIdHookMock helps to preserve hooks order when hook is being replaced from version 2 to version 3.
- *
- * If new update requires to remove some hooks – add mocks instead of them.
- * If new update requires to add some hooks and no workaround with current hooks list is possible – probably focus lock hook key should be changed.
- */
-var focusLockVersion = 5;
-var globalFocusLockHookKey = '__intergalactic_focus_lock_hook_react_v_respectful';
-var focusLockAllTraps = new Set();
-var focusLockUsedInMountedComponents = new Set();
-/** Focus master is a special mode in which focus lock might work.
- * Normally, focus lock hook allows user focus to move freely between
- * all active focus traps. When component provides `focusMaster=true`
- * parameter, it says that it doesn't want to share focus with other traps.
- * It is very useful for a big components like modals or side-bars that
- * also have some visual backdrop.
- * The last element in focus masters stack is considered as a current focus master.
- */
-var focusMastersStack = [];
-var noop = function noop() {};
-var useUniqueIdHookMock = function useUniqueIdHookMock(React) {
-  React.useState(undefined);
-  var useEnhancedEffect = canUseDOM() ? React.useLayoutEffect : React.useEffect;
-  useEnhancedEffect(noop, []);
-};
-var useFocusLockHook = function useFocusLockHook(React, trapRef, autoFocus, returnFocusTo) {
-  var disabled = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : false;
-  var focusMaster = arguments.length > 5 && arguments[5] !== undefined ? arguments[5] : false;
-  var onFocusOut = arguments.length > 6 ? arguments[6] : undefined;
-  useFocusBorders(React, disabled, trapRef);
-  var autoTriggerRef = React.useRef(null);
-  var lastUserInteractionRef = React.useRef(undefined);
-  var handleFocusOut = React.useCallback(function (event) {
-    var focusCameFrom = event.target;
-    var focusMovedTo = event.relatedTarget;
-    setTimeout(function () {
-      if (!focusCameFrom) return;
-      if (autoTriggerRef.current) return;
-      autoTriggerRef.current = focusCameFrom;
-    }, 0);
-    if (lastUserInteractionRef.current === 'mouse') return;
-    Promise.resolve().then(function () {
-      if (!trapRef.current) return;
-      var currentFocusMaster = focusMastersStack[focusMastersStack.length - 1];
-      if (currentFocusMaster && currentFocusMaster !== trapRef.current) return;
-      var trapNodes = currentFocusMaster ? [trapRef.current] : [trapRef.current].concat(_toConsumableArray(focusLockAllTraps));
-      if (isFocusInside(trapNodes, focusMovedTo)) return;
-      if (_typeof(returnFocusTo) === 'object' && returnFocusTo !== null && returnFocusTo !== void 0 && returnFocusTo.current && isFocusInside(returnFocusTo.current)) return;
-      if (focusCameFrom && focusMovedTo) {
-        setFocus(trapRef.current, focusCameFrom, focusMovedTo);
+  }, [e]);
+}, P = 0, x = function(r) {
+  return "".concat(r, "-").concat(Math.random().toString(36).slice(2), "-").concat(P++);
+}, O = 5, h = "__intergalactic_focus_lock_hook_react_v_respectful", p = /* @__PURE__ */ new Set(), _ = /* @__PURE__ */ new Set(), c = [], G = function() {
+}, S = function(r) {
+  r.useState(void 0);
+  var e = C() ? r.useLayoutEffect : r.useEffect;
+  e(G, []);
+}, U = function(r, e, u, n) {
+  var o = arguments.length > 4 && arguments[4] !== void 0 ? arguments[4] : !1, f = arguments.length > 5 && arguments[5] !== void 0 ? arguments[5] : !1, d = arguments.length > 6 ? arguments[6] : void 0;
+  N(r, o, e);
+  var a = r.useRef(null), v = r.useRef(void 0), k = r.useCallback(function(t) {
+    var i = t.target, m = t.relatedTarget;
+    setTimeout(function() {
+      i && (a.current || (a.current = i));
+    }, 0), v.current !== "mouse" && Promise.resolve().then(function() {
+      if (e.current) {
+        var b = c[c.length - 1];
+        if (!(b && b !== e.current)) {
+          var A = b ? [e.current] : [e.current].concat(q(p));
+          M(A, m) || g(n) === "object" && n !== null && n !== void 0 && n.current && M(n.current) || (i && m && L(e.current, i, m), d == null || d(t));
+        }
       }
-      onFocusOut === null || onFocusOut === void 0 ? void 0 : onFocusOut(event);
     });
-  }, [onFocusOut]);
-  var handleMouseEvent = React.useCallback(function () {
-    lastUserInteractionRef.current = 'mouse';
-  }, []);
-  var handleKeyboardEvent = React.useCallback(function () {
-    lastUserInteractionRef.current = 'keyboard';
-  }, []);
-  var returnFocus = React.useCallback(function () {
-    var trapNode = trapRef.current;
-    if (trapNode && !isFocusInside(trapNode)) return;
-    var focusMastersStackCount = focusMastersStack.length;
-    if (_typeof(returnFocusTo) === 'object' && returnFocusTo !== null && returnFocusTo !== void 0 && returnFocusTo.current) {
-      var returnFocusNode = returnFocusTo === null || returnFocusTo === void 0 ? void 0 : returnFocusTo.current;
-      setTimeout(function () {
-        if (focusMastersStackCount !== focusMastersStack.length) {
-          setFocus(returnFocusNode, trapNode);
-        }
-      }, 0);
+  }, [d]), y = r.useCallback(function() {
+    v.current = "mouse";
+  }, []), E = r.useCallback(function() {
+    v.current = "keyboard";
+  }, []), j = r.useCallback(function() {
+    var t = e.current;
+    if (!(t && !M(t))) {
+      var i = c.length;
+      if (g(n) === "object" && n !== null && n !== void 0 && n.current) {
+        var m = n == null ? void 0 : n.current;
+        setTimeout(function() {
+          i !== c.length && L(m, t);
+        }, 0);
+      }
+      if (n === "auto" && a.current) {
+        var b = a.current;
+        setTimeout(function() {
+          i !== c.length && L(b, t);
+        }, 0);
+      }
     }
-    if (returnFocusTo === 'auto' && autoTriggerRef.current) {
-      var autoTrigger = autoTriggerRef.current;
-      setTimeout(function () {
-        if (focusMastersStackCount !== focusMastersStack.length) {
-          setFocus(autoTrigger, trapNode);
-        }
-      }, 0);
+  }, [n]);
+  r.useEffect(function() {
+    if (!(g(e) !== "object" || e === null)) {
+      var t = e.current;
+      if (t)
+        return p.add(t), function() {
+          t && p.delete(t);
+        };
     }
-  }, [returnFocusTo]);
-  React.useEffect(function () {
-    if (_typeof(trapRef) !== 'object' || trapRef === null) return;
-    var node = trapRef.current;
-    if (!node) return;
-    focusLockAllTraps.add(node);
-    return function () {
-      if (!node) return;
-      focusLockAllTraps["delete"](node);
-    };
-  }, [disabled]);
-  React.useEffect(function () {
-    if (disabled) return;
-    if (!canUseDOM()) return;
-    if (!trapRef.current) return;
-    var focusableChildren = Array.from(trapRef.current.children).flatMap(function (node) {
-      return getFocusableIn(node);
-    });
-    if (focusableChildren.length === 0 && autoFocus !== 'enforced') return;
-    document.body.addEventListener('focusout', handleFocusOut);
-    document.body.addEventListener(syntheticEvents.blur, handleFocusOut);
-    document.body.addEventListener('mousedown', handleMouseEvent);
-    document.body.addEventListener('touchstart', handleMouseEvent);
-    document.body.addEventListener('keydown', handleKeyboardEvent);
-    document.body.addEventListener(syntheticEvents.keydown, handleKeyboardEvent);
-    if (autoFocus) {
-      setTimeout(function () {
-        setFocus(trapRef.current, _typeof(returnFocusTo) === 'object' ? returnFocusTo === null || returnFocusTo === void 0 ? void 0 : returnFocusTo.current : document.body);
-      }, 0);
+  }, [o]), r.useEffect(function() {
+    if (!o && C() && e.current) {
+      var t = Array.from(e.current.children).flatMap(function(i) {
+        return w(i);
+      });
+      if (!(t.length === 0 && u !== "enforced"))
+        return document.body.addEventListener("focusout", k), document.body.addEventListener(l.blur, k), document.body.addEventListener("mousedown", y), document.body.addEventListener("touchstart", y), document.body.addEventListener("keydown", E), document.body.addEventListener(l.keydown, E), u && setTimeout(function() {
+          L(e.current, g(n) === "object" ? n == null ? void 0 : n.current : document.body);
+        }, 0), function() {
+          document.body.removeEventListener("focusout", k), document.body.removeEventListener(l.blur, k), document.body.removeEventListener("mousedown", y), document.body.removeEventListener("touchstart", y), document.body.removeEventListener("keydown", E), document.body.removeEventListener(l.keydown, E), j(), a.current = null;
+        };
     }
-    return function () {
-      document.body.removeEventListener('focusout', handleFocusOut);
-      document.body.removeEventListener(syntheticEvents.blur, handleFocusOut);
-      document.body.removeEventListener('mousedown', handleMouseEvent);
-      document.body.removeEventListener('touchstart', handleMouseEvent);
-      document.body.removeEventListener('keydown', handleKeyboardEvent);
-      document.body.removeEventListener(syntheticEvents.keydown, handleKeyboardEvent);
-      returnFocus();
-      autoTriggerRef.current = null;
-    };
-  }, [disabled, autoFocus, returnFocusTo, returnFocus]);
-  React.useEffect(function () {
-    if (_typeof(trapRef) !== 'object' || trapRef === null) return;
-    if (disabled) return;
-    if (!canUseDOM()) return;
-    if (!trapRef.current) return;
-    var focusableChildren = Array.from(trapRef.current.children).flatMap(function (node) {
-      return getFocusableIn(node);
-    });
-    if (focusableChildren.length === 0) return;
-    if (focusMaster) {
-      focusMastersStack.push(trapRef.current);
+  }, [o, u, n, j]), r.useEffect(function() {
+    if (!(g(e) !== "object" || e === null) && !o && C() && e.current) {
+      var t = Array.from(e.current.children).flatMap(function(i) {
+        return w(i);
+      });
+      if (t.length !== 0)
+        return f && c.push(e.current), function() {
+          f && (c[c.length - 1] === e.current ? c.pop() : c.splice(c.indexOf(e.current), 1));
+        };
     }
-    return function () {
-      if (!focusMaster) return;
-      if (focusMastersStack[focusMastersStack.length - 1] === trapRef.current) {
-        focusMastersStack.pop();
-      } else {
-        focusMastersStack.splice(focusMastersStack.indexOf(trapRef.current), 1);
-      }
-    };
-  }, [disabled, focusMaster]);
-  useUniqueIdHookMock(React);
-  React.useEffect(function () {
-    var id = getUniqueId('focus-lock-consumer');
-    if (disabled) return;
-    focusLockUsedInMountedComponents.add(id);
-    return function () {
-      focusLockUsedInMountedComponents["delete"](id);
-    };
-  }, [disabled]);
-};
-var establishHookAsGlobal = function establishHookAsGlobal() {
-  globalThis[globalFocusLockHookKey] = {
-    hook: useFocusLockHook,
-    version: focusLockVersion,
-    usedInComponents: focusLockUsedInMountedComponents
+  }, [o, f]), S(r), r.useEffect(function() {
+    var t = x("focus-lock-consumer");
+    if (!o)
+      return _.add(t), function() {
+        _.delete(t);
+      };
+  }, [o]);
+}, I = function() {
+  globalThis[h] = {
+    hook: U,
+    version: O,
+    usedInComponents: _
   };
 };
-if (!globalThis[globalFocusLockHookKey]) {
-  establishHookAsGlobal();
-} else if (typeof globalThis[globalFocusLockHookKey].version !== 'number') {
-  establishHookAsGlobal();
-} else {
-  var _globalFocusLockHookK = globalThis[globalFocusLockHookKey],
-    theirVersion = _globalFocusLockHookK.version,
-    usedInComponents = _globalFocusLockHookK.usedInComponents;
-  if (focusLockVersion > theirVersion && usedInComponents.size === 0) {
-    establishHookAsGlobal();
-  }
+if (!globalThis[h])
+  I();
+else if (typeof globalThis[h].version != "number")
+  I();
+else {
+  var H = globalThis[h], z = H.version, D = H.usedInComponents;
+  O > z && D.size === 0 && I();
 }
-export var useFocusLock = function useFocusLock(trapRef, autoFocus, returnFocusTo) {
-  var _globalFocusLockHookK2, _globalFocusLockHookK3;
-  var disabled = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : false;
-  var focusMaster = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : false;
-  var onFocusOut = arguments.length > 5 ? arguments[5] : undefined;
-  var hook = (_globalFocusLockHookK2 = (_globalFocusLockHookK3 = globalThis[globalFocusLockHookKey]) === null || _globalFocusLockHookK3 === void 0 ? void 0 : _globalFocusLockHookK3.hook) !== null && _globalFocusLockHookK2 !== void 0 ? _globalFocusLockHookK2 : useFocusLockHook;
-  return hook(LocalReact, trapRef, autoFocus, returnFocusTo, disabled, focusMaster, onFocusOut);
-};
-export var hasFocusableIn = function hasFocusableIn(element) {
-  return Array.from(element.children).flatMap(function (node) {
-    return getFocusableIn(node);
+var R = function(r, e, u) {
+  var n, o, f = arguments.length > 3 && arguments[3] !== void 0 ? arguments[3] : !1, d = arguments.length > 4 && arguments[4] !== void 0 ? arguments[4] : !1, a = arguments.length > 5 ? arguments[5] : void 0, v = (n = (o = globalThis[h]) === null || o === void 0 ? void 0 : o.hook) !== null && n !== void 0 ? n : U;
+  return v(B, r, e, u, f, d, a);
+}, ee = function(r) {
+  return Array.from(r.children).flatMap(function(e) {
+    return w(e);
   }).length > 0;
 };
-//# sourceMappingURL=useFocusLock.mjs.map
+export {
+  ee as hasFocusableIn,
+  M as isFocusInside,
+  T as makeFocusLockSyntheticEvent,
+  L as setFocus,
+  R as useFocusLock
+};

package/utils/lib/use/usePreventScroll.mjs

@@ -1,70 +1,43 @@
-import React from 'react';
-import canUseDOM from "../canUseDOM.mjs";
-import { useUID } from "../uniqueID.mjs";
-export function getScrollbarWidth() {
-  var _outer$parentNode;
-  if (!canUseDOM()) return 0;
-  var outer = document.createElement('div');
-  outer.style.visibility = 'hidden';
-  outer.style.width = '100px';
-  // @ts-expect-error
-  outer.style.msOverflowStyle = 'scrollbar'; // needed for WinJS apps
-  document.body.appendChild(outer);
-  var widthNoScroll = outer.offsetWidth;
-  outer.style.overflow = 'scroll';
-  var inner = document.createElement('div');
-  inner.style.width = '100%';
-  outer.appendChild(inner);
-  var widthWithScroll = inner.offsetWidth;
-  (_outer$parentNode = outer.parentNode) === null || _outer$parentNode === void 0 ? void 0 : _outer$parentNode.removeChild(outer);
-  return widthNoScroll - widthWithScroll;
+import u from "react";
+import a from "../canUseDOM.mjs";
+import { useUID as b } from "../uniqueID.mjs";
+function g() {
+  var t;
+  if (!a()) return 0;
+  var e = document.createElement("div");
+  e.style.visibility = "hidden", e.style.width = "100px", e.style.msOverflowStyle = "scrollbar", document.body.appendChild(e);
+  var n = e.offsetWidth;
+  e.style.overflow = "scroll";
+  var r = document.createElement("div");
+  r.style.width = "100%", e.appendChild(r);
+  var i = r.offsetWidth;
+  return (t = e.parentNode) === null || t === void 0 || t.removeChild(e), n - i;
 }
-function getIntValueFromCss(value) {
-  return !Number.isNaN(Number(value)) ? Number(value) : Number.parseInt(value, 10);
+function f(t) {
+  return Number.isNaN(Number(t)) ? Number.parseInt(t, 10) : Number(t);
 }
-var scrollPreventers = new Set();
-var lockedBodyStyles = {
+var d = /* @__PURE__ */ new Set(), o = {
   paddingRight: null,
   overflow: null,
   boxSizing: null
 };
-export default function usePreventScroll() {
-  var visible = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : true;
-  var disabled = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
-  var scrollbarWidth = React.useMemo(getScrollbarWidth, [getScrollbarWidth]);
-  var id = useUID('scroll-preventer-');
-  React.useEffect(function () {
-    if (disabled) return;
-    if (!canUseDOM() || !visible) return;
-    scrollPreventers.add(id);
-    if (scrollPreventers.size > 1) return;
-    var _window$getComputedSt = window.getComputedStyle(document.body),
-      overflow = _window$getComputedSt.overflow,
-      paddingRight = _window$getComputedSt.paddingRight,
-      boxSizing = _window$getComputedSt.boxSizing;
-    lockedBodyStyles.paddingRight = paddingRight;
-    lockedBodyStyles.overflow = overflow;
-    lockedBodyStyles.boxSizing = boxSizing;
-    var intPaddingRight = getIntValueFromCss(paddingRight);
-    var intPaddingRightFromStyle = getIntValueFromCss(document.body.style.paddingRight);
-    // Detected own style for window inside window
-    if (intPaddingRightFromStyle !== scrollbarWidth) {
-      intPaddingRightFromStyle = 0;
+function w() {
+  var t = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : !0, e = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : !1, n = u.useMemo(g, [g]), r = b("scroll-preventer-");
+  u.useEffect(function() {
+    if (!e && !(!a() || !t) && (d.add(r), !(d.size > 1))) {
+      var i = window.getComputedStyle(document.body), m = i.overflow, s = i.paddingRight, c = i.boxSizing;
+      o.paddingRight = s, o.overflow = m, o.boxSizing = c;
+      var v = f(s), l = f(document.body.style.paddingRight);
+      l !== n && (l = 0), document.body.style.overflow = "hidden", document.body.style.paddingRight = n + (v - l) + "px", document.body.style.boxSizing = "border-box";
     }
-    document.body.style.overflow = 'hidden';
-    document.body.style.paddingRight = scrollbarWidth + (intPaddingRight - intPaddingRightFromStyle) + 'px';
-    document.body.style.boxSizing = 'border-box';
-  }, [visible, id, disabled]);
-  React.useEffect(function () {
-    if (disabled) return;
-    if (!canUseDOM() || !visible) return;
-    return function () {
-      scrollPreventers["delete"](id);
-      if (scrollPreventers.size !== 0) return;
-      document.body.style.overflow = lockedBodyStyles.overflow;
-      document.body.style.paddingRight = lockedBodyStyles.paddingRight;
-      document.body.style.boxSizing = lockedBodyStyles.boxSizing;
-    };
-  }, [visible, id, disabled]);
+  }, [t, r, e]), u.useEffect(function() {
+    if (!e && !(!a() || !t))
+      return function() {
+        d.delete(r), d.size === 0 && (document.body.style.overflow = o.overflow, document.body.style.paddingRight = o.paddingRight, document.body.style.boxSizing = o.boxSizing);
+      };
+  }, [t, r, e]);
 }
-//# sourceMappingURL=usePreventScroll.mjs.map
+export {
+  w as default,
+  g as getScrollbarWidth
+};

package/utils/lib/useCssVariable.mjs

@@ -1,46 +1,33 @@
-import _defineProperty from "@babel/runtime/helpers/defineProperty";
-import _objectSpread from "@babel/runtime/helpers/objectSpread2";
-import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
-import React from 'react';
-import canUseDOM from "./canUseDOM.mjs";
-import { useForkRef } from "./ref.mjs";
-import { useContextTokens } from "./ThemeProvider.mjs";
-export var useCssVariable = function useCssVariable(name, fallbackValue, ref) {
-  var contextTheme = useContextTokens();
-  var getValue = React.useCallback(function () {
-    var _ref$current;
-    if (contextTheme !== null && contextTheme !== void 0 && contextTheme[name]) return contextTheme[name];
-    if (!canUseDOM()) return fallbackValue;
-    var element = (_ref$current = ref === null || ref === void 0 ? void 0 : ref.current) !== null && _ref$current !== void 0 ? _ref$current : document.documentElement;
-    var computedStyles = getComputedStyle(element);
-    return computedStyles.getPropertyValue(name) || fallbackValue;
-  }, [name, ref, fallbackValue, contextTheme]);
-  var initialValue = React.useMemo(getValue, [getValue]);
-  var _React$useState = React.useState(initialValue),
-    _React$useState2 = _slicedToArray(_React$useState, 2),
-    value = _React$useState2[0],
-    setValue = _React$useState2[1];
-  React.useEffect(function () {
-    return setValue(getValue);
-  }, [getValue]);
-  return value;
-};
-export var cssVariableEnhance = function cssVariableEnhance(_ref) {
-  var variable = _ref.variable,
-    fallback = _ref.fallback,
-    prop = _ref.prop,
-    map = _ref.map;
-  return function (props) {
-    var _ref2 = props,
-      ref = _ref2.ref;
-    var nodeRef = React.useRef();
-    var variableValue = useCssVariable(variable, fallback, nodeRef);
-    var mappedValue = React.useMemo(function () {
-      return map ? map(variableValue) : variableValue;
-    }, [map, variableValue]);
-    return _objectSpread(_objectSpread({}, props), {}, _defineProperty({
-      ref: useForkRef(ref, nodeRef)
-    }, prop, props[prop] === undefined ? mappedValue : props[prop]));
+import b from "@babel/runtime/helpers/esm/defineProperty";
+import s from "@babel/runtime/helpers/esm/objectSpread2";
+import V from "@babel/runtime/helpers/esm/slicedToArray";
+import u from "react";
+import R from "./canUseDOM.mjs";
+import { useForkRef as S } from "./ref.mjs";
+import { useContextTokens as y } from "./ThemeProvider.mjs";
+var C = function(e, n, a) {
+  var r = y(), t = u.useCallback(function() {
+    var l;
+    if (r != null && r[e]) return r[e];
+    if (!R()) return n;
+    var p = (l = a == null ? void 0 : a.current) !== null && l !== void 0 ? l : document.documentElement, d = getComputedStyle(p);
+    return d.getPropertyValue(e) || n;
+  }, [e, a, n, r]), o = u.useMemo(t, [t]), v = u.useState(o), c = V(v, 2), m = c[0], i = c[1];
+  return u.useEffect(function() {
+    return i(t);
+  }, [t]), m;
+}, T = function(e) {
+  var n = e.variable, a = e.fallback, r = e.prop, t = e.map;
+  return function(o) {
+    var v = o, c = v.ref, m = u.useRef(), i = C(n, a, m), l = u.useMemo(function() {
+      return t ? t(i) : i;
+    }, [t, i]);
+    return s(s({}, o), {}, b({
+      ref: S(c, m)
+    }, r, o[r] === void 0 ? l : o[r]));
   };
 };
-//# sourceMappingURL=useCssVariable.mjs.map
+export {
+  T as cssVariableEnhance,
+  C as useCssVariable
+};