@ariakit/react-core 0.4.16 → 0.4.18

package/esm/__chunks/{27ARMZNT.js → NLAT5IRT.js}

@@ -4,20 +4,21 @@ import {
 } from "./2SM3RB2N.js";
 import {
   usePopoverContext
-} from "./MTZPJQMC.js";
+} from "./Y67KZUMI.js";
 import {
   useStoreState
-} from "./YV4JVR4I.js";
+} from "./RTNCFSKZ.js";
 import {
   createElement,
   createHook,
   forwardRef,
   memo
-} from "./LMDWO4NN.js";
+} from "./VOQWLFSQ.js";
 import {
+  useId,
   useMergeRefs,
   useSafeLayoutEffect
-} from "./ABQUS43J.js";
+} from "./5GGHRIN3.js";
 import {
   __objRest,
   __spreadProps,
@@ -27,7 +28,7 @@ import {
 // src/popover/popover-arrow.tsx
 import { getWindow } from "@ariakit/core/utils/dom";
 import { invariant, removeUndefinedValues } from "@ariakit/core/utils/misc";
-import { useId, useMemo, useState } from "react";
+import { useMemo, useState } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 var TagName = "div";
 var defaultSize = 30;
@@ -56,6 +57,17 @@ function getRingWidth(style) {
   const ringWidth = (_a = boxShadow.match(/0px 0px 0px ([^0]+px)/)) == null ? void 0 : _a[1];
   return ringWidth;
 }
+function getBorderColor(dir, style) {
+  if (!style) return;
+  const borderColor = style.getPropertyValue(`border-${dir}-color`);
+  if (borderColor) return borderColor;
+  const boxShadow = style.getPropertyValue("box-shadow");
+  const match = boxShadow.match(/0px 0px 0px [^,]+/);
+  if (!match) return;
+  const segment = match[0];
+  const ringColor = segment.replace(/^0px 0px 0px\s+[^\s,]+/, "").trim();
+  return ringColor || void 0;
+}
 var usePopoverArrow = createHook(
   function usePopoverArrow2(_a) {
     var _b = _a, {
@@ -79,21 +91,33 @@ var usePopoverArrow = createHook(
     );
     const maskId = useId();
     const style = useComputedStyle(store);
+    const stroke = getBorderColor(dir, style) || "none";
     const fill = (style == null ? void 0 : style.getPropertyValue("background-color")) || "none";
-    const stroke = (style == null ? void 0 : style.getPropertyValue(`border-${dir}-color`)) || "none";
-    const borderWidth = useMemo(() => {
-      if (borderWidthProp != null) return borderWidthProp;
-      if (!style) return 0;
+    const [borderWidth, isRing] = useMemo(() => {
+      if (borderWidthProp != null) return [borderWidthProp, false];
+      if (!style) return [0, false];
       const ringWidth = getRingWidth(style);
-      if (ringWidth) return Number.parseInt(ringWidth);
+      if (ringWidth) return [Number.parseInt(ringWidth), true];
       const borderWidth2 = style.getPropertyValue(`border-${dir}-width`);
-      if (borderWidth2) return Number.parseInt(borderWidth2);
-      return 0;
+      if (borderWidth2) return [Number.parseInt(borderWidth2), false];
+      return [0, false];
     }, [borderWidthProp, style, dir]);
     const strokeWidth = borderWidth * 2 * (defaultSize / size);
     const transform = rotateMap[dir];
     const children = useMemo(
       () => /* @__PURE__ */ jsx("svg", { display: "block", viewBox: "0 0 30 30", children: /* @__PURE__ */ jsxs("g", { transform, children: [
+        !isRing && // When using the CSS border property, set the fill color to match
+        // the background behind the stroke so transparent strokes match
+        // the appearance of borders on HTML elements.
+        /* @__PURE__ */ jsx(
+          "path",
+          {
+            fill: "none",
+            stroke: `var(--ak-layer, ${fill})`,
+            d: POPOVER_ARROW_PATH,
+            mask: `url(#${maskId})`
+          }
+        ),
         /* @__PURE__ */ jsx("path", { fill: "none", d: POPOVER_ARROW_PATH, mask: `url(#${maskId})` }),
         /* @__PURE__ */ jsx("path", { stroke: "none", d: POPOVER_ARROW_PATH }),
         /* @__PURE__ */ jsx("mask", { id: maskId, maskUnits: "userSpaceOnUse", children: /* @__PURE__ */ jsx(
@@ -108,7 +132,7 @@ var usePopoverArrow = createHook(
           }
         ) })
       ] }) }),
-      [transform, maskId]
+      [transform, isRing, fill, maskId]
     );
     props = __spreadProps(__spreadValues({
       children,

package/esm/__chunks/{F5MUBM3I.js → NMGNQVTG.js}

@@ -1,21 +1,21 @@
 "use client";
 import {
   useDisclosureProviderContext
-} from "./S6EF7IVO.js";
+} from "./ABN76PSX.js";
 import {
   useButton
-} from "./PCKO3OQ5.js";
+} from "./XCKGTAUF.js";
 import {
   createElement,
   createHook,
   forwardRef
-} from "./LMDWO4NN.js";
+} from "./VOQWLFSQ.js";
 import {
   useBooleanEvent,
   useEvent,
   useMergeRefs,
   useMetadataProps
-} from "./ABQUS43J.js";
+} from "./5GGHRIN3.js";
 import {
   __objRest,
   __spreadProps,

package/esm/__chunks/{5JTVDSTH.js → NSTBQJLB.js}

@@ -9,15 +9,15 @@ import {
 import {
   CompositeContextProvider,
   useCompositeProviderContext
-} from "./P7GR5CS5.js";
+} from "./APTFW6PT.js";
 import {
   useFocusable
-} from "./PFRGBC2K.js";
+} from "./OE2EFRVA.js";
 import {
   createElement,
   createHook,
   forwardRef
-} from "./LMDWO4NN.js";
+} from "./VOQWLFSQ.js";
 import {
   useBooleanEvent,
   useEvent,
@@ -25,7 +25,7 @@ import {
   useSafeLayoutEffect,
   useTransactionState,
   useWrapElement
-} from "./ABQUS43J.js";
+} from "./5GGHRIN3.js";
 import {
   __objRest,
   __spreadProps,

package/esm/__chunks/{BKQBQI36.js → NXIITQH7.js}

@@ -1,10 +1,10 @@
 "use client";
 import {
   useCompositeStoreProps
-} from "./4CMBR7SL.js";
+} from "./B7UTNDHN.js";
 import {
   useStore
-} from "./YV4JVR4I.js";
+} from "./RTNCFSKZ.js";
 
 // src/menubar/menubar-store.ts
 import * as Core from "@ariakit/core/menubar/menubar-store";

package/esm/__chunks/{PFRGBC2K.js → OE2EFRVA.js}

@@ -6,12 +6,12 @@ import {
   createElement,
   createHook,
   forwardRef
-} from "./LMDWO4NN.js";
+} from "./VOQWLFSQ.js";
 import {
   useEvent,
   useMergeRefs,
   useTagName
-} from "./ABQUS43J.js";
+} from "./5GGHRIN3.js";
 import {
   __objRest,
   __spreadProps,
@@ -125,6 +125,7 @@ function useDisableEvent(onEvent, disabled) {
     }
   });
 }
+var hasInstalledGlobalEventListeners = false;
 var isKeyboardModality = true;
 function onGlobalMouseDown(event) {
   const target = event.target;
@@ -156,8 +157,10 @@ var useFocusable = createHook(
     const ref = useRef(null);
     useEffect(() => {
       if (!focusable) return;
+      if (hasInstalledGlobalEventListeners) return;
       addGlobalEventListener("mousedown", onGlobalMouseDown, true);
       addGlobalEventListener("keydown", onGlobalKeyDown, true);
+      hasInstalledGlobalEventListeners = true;
     }, [focusable]);
     if (isSafariBrowser) {
       useEffect(() => {

package/esm/__chunks/{S43UC3DV.js → OLVWQA7U.js}

@@ -2,14 +2,14 @@
 import {
   PopoverContextProvider,
   PopoverScopedContextProvider
-} from "./MTZPJQMC.js";
+} from "./Y67KZUMI.js";
 import {
   CompositeContextProvider,
   CompositeScopedContextProvider
-} from "./P7GR5CS5.js";
+} from "./APTFW6PT.js";
 import {
   createStoreContext
-} from "./LMDWO4NN.js";
+} from "./VOQWLFSQ.js";
 
 // src/combobox/combobox-context.tsx
 import { createContext } from "react";

package/esm/__chunks/{3NAWWYOJ.js → OQDUQELZ.js}

@@ -1,18 +1,18 @@
 "use client";
 import {
   Role
-} from "./XL7CSKGW.js";
+} from "./QJ4LGO2N.js";
 import {
   CollectionItem
-} from "./RZ4GPYOB.js";
+} from "./Y62RTBST.js";
 import {
   forwardRef
-} from "./LMDWO4NN.js";
+} from "./VOQWLFSQ.js";
 import {
   useForceUpdate,
   useId,
   useMergeRefs
-} from "./ABQUS43J.js";
+} from "./5GGHRIN3.js";
 import {
   __objRest,
   __spreadProps,

package/esm/__chunks/{T7VMP3TM.js → OYOFZOGB.js}

@@ -4,15 +4,15 @@ import {
 } from "./5VQZOHHZ.js";
 import {
   useCompositeContext
-} from "./P7GR5CS5.js";
+} from "./APTFW6PT.js";
 import {
   createElement,
   createHook,
   forwardRef
-} from "./LMDWO4NN.js";
+} from "./VOQWLFSQ.js";
 import {
   useEvent
-} from "./ABQUS43J.js";
+} from "./5GGHRIN3.js";
 import {
   __objRest,
   __spreadProps,

package/esm/__chunks/{TOU75OXH.js → PVECYOSC.js}

@@ -1,7 +1,7 @@
 "use client";
 import {
   useSafeLayoutEffect
-} from "./ABQUS43J.js";
+} from "./5GGHRIN3.js";
 
 // src/dialog/utils/use-nested-dialogs.tsx
 import { chain } from "@ariakit/core/utils/misc";

package/esm/__chunks/{UYGDZTLQ.js → QGC5LOGZ.js}

@@ -2,10 +2,10 @@
 import {
   CompositeContextProvider,
   CompositeScopedContextProvider
-} from "./P7GR5CS5.js";
+} from "./APTFW6PT.js";
 import {
   createStoreContext
-} from "./LMDWO4NN.js";
+} from "./VOQWLFSQ.js";
 
 // src/tab/tab-context.tsx
 var ctx = createStoreContext(

package/esm/__chunks/{IWEFDH56.js → QHZCZ35Y.js}

@@ -1,16 +1,16 @@
 "use client";
 import {
   useToolbarContext
-} from "./A3WPL2ZJ.js";
+} from "./RRHVJAMQ.js";
 import {
   useCompositeItem
-} from "./6VRAQV3D.js";
+} from "./SBSPVDDI.js";
 import {
   createElement,
   createHook,
   forwardRef,
   memo
-} from "./LMDWO4NN.js";
+} from "./VOQWLFSQ.js";
 import {
   __objRest,
   __spreadValues

package/esm/__chunks/{XL7CSKGW.js → QJ4LGO2N.js}

@@ -3,7 +3,7 @@ import {
   createElement,
   createHook,
   forwardRef
-} from "./LMDWO4NN.js";
+} from "./VOQWLFSQ.js";
 
 // src/role/role.tsx
 var TagName = "div";

package/esm/__chunks/{343LYRPB.js → QQJWVL6H.js}

@@ -1,12 +1,12 @@
 "use client";
 import {
   useDialogDescription
-} from "./GNXFPHGE.js";
+} from "./6VDKWZGI.js";
 import {
   createElement,
   createHook,
   forwardRef
-} from "./LMDWO4NN.js";
+} from "./VOQWLFSQ.js";
 
 // src/popover/popover-description.tsx
 var TagName = "p";

package/esm/__chunks/{6DEDXFNU.js → QZPX4M57.js}

@@ -1,12 +1,12 @@
 "use client";
 import {
   useDialogHeading
-} from "./TIW3GMFC.js";
+} from "./JXSEFJ7Y.js";
 import {
   createElement,
   createHook,
   forwardRef
-} from "./LMDWO4NN.js";
+} from "./VOQWLFSQ.js";
 
 // src/popover/popover-heading.tsx
 var TagName = "h1";

package/esm/__chunks/{6MFI6SZM.js → R34JYYUC.js}

@@ -1,12 +1,12 @@
 "use client";
 import {
   usePopoverHeading
-} from "./6DEDXFNU.js";
+} from "./QZPX4M57.js";
 import {
   createElement,
   createHook,
   forwardRef
-} from "./LMDWO4NN.js";
+} from "./VOQWLFSQ.js";
 
 // src/hovercard/hovercard-heading.tsx
 var TagName = "h1";

package/esm/__chunks/{A3WPL2ZJ.js → RRHVJAMQ.js}

@@ -2,10 +2,10 @@
 import {
   CompositeContextProvider,
   CompositeScopedContextProvider
-} from "./P7GR5CS5.js";
+} from "./APTFW6PT.js";
 import {
   createStoreContext
-} from "./LMDWO4NN.js";
+} from "./VOQWLFSQ.js";
 
 // src/toolbar/toolbar-context.tsx
 var ctx = createStoreContext(

package/esm/__chunks/{YV4JVR4I.js → RTNCFSKZ.js}

@@ -3,7 +3,7 @@ import {
   useEvent,
   useLiveRef,
   useSafeLayoutEffect
-} from "./ABQUS43J.js";
+} from "./5GGHRIN3.js";
 import {
   __spreadProps,
   __spreadValues

package/esm/__chunks/{O2PQ2652.js → RUY5BUJG.js}

@@ -1,14 +1,14 @@
 "use client";
 import {
   useDialogStoreProps
-} from "./BM6PGYQY.js";
+} from "./Y2U4BRIM.js";
 import {
   useStore,
   useStoreProps
-} from "./YV4JVR4I.js";
+} from "./RTNCFSKZ.js";
 import {
   useUpdateEffect
-} from "./ABQUS43J.js";
+} from "./5GGHRIN3.js";
 
 // src/popover/popover-store.ts
 import * as Core from "@ariakit/core/popover/popover-store";

package/esm/__chunks/{W3VI7GFU.js → S2F2XXEH.js}

@@ -1,12 +1,12 @@
 "use client";
 import {
   useVisuallyHidden
-} from "./XX67R432.js";
+} from "./DXGKYUAD.js";
 import {
   createElement,
   createHook,
   forwardRef
-} from "./LMDWO4NN.js";
+} from "./VOQWLFSQ.js";
 import {
   __spreadProps,
   __spreadValues

package/esm/__chunks/{6VRAQV3D.js → SBSPVDDI.js}

@@ -7,31 +7,31 @@ import {
 } from "./5VQZOHHZ.js";
 import {
   useCollectionItem
-} from "./RZ4GPYOB.js";
+} from "./Y62RTBST.js";
 import {
   CompositeItemContext,
   CompositeRowContext,
   useCompositeContext
-} from "./P7GR5CS5.js";
+} from "./APTFW6PT.js";
 import {
   useCommand
-} from "./2RSXSRCN.js";
+} from "./2W3RN7C5.js";
 import {
   useStoreStateObject
-} from "./YV4JVR4I.js";
+} from "./RTNCFSKZ.js";
 import {
   createElement,
   createHook,
   forwardRef,
   memo
-} from "./LMDWO4NN.js";
+} from "./VOQWLFSQ.js";
 import {
   useBooleanEvent,
   useEvent,
   useId,
   useMergeRefs,
   useWrapElement
-} from "./ABQUS43J.js";
+} from "./5GGHRIN3.js";
 import {
   __objRest,
   __spreadProps,
@@ -44,8 +44,8 @@ import {
   getTextboxSelection,
   getTextboxValue,
   isButton,
-  isTextField,
-  isTextbox
+  isTextbox,
+  isTextField
 } from "@ariakit/core/utils/dom";
 import { isPortalEvent, isSelfTarget } from "@ariakit/core/utils/events";
 import {

package/esm/__chunks/{BGQ3KQ5M.js → SOMPWLIQ.js}

@@ -1,7 +1,7 @@
 "use client";
 import {
   useRootDialog
-} from "./YKJECYU7.js";
+} from "./W6WVJJEY.js";
 import {
   assignStyle,
   setCSSProperty

package/esm/__chunks/{CYMKTFW2.js → SQMW2KTG.js}

@@ -1,14 +1,14 @@
 "use client";
 import {
   useCollectionStoreProps
-} from "./C3IKGW5T.js";
+} from "./AMMIPFT4.js";
 import {
   useStore,
   useStoreProps
-} from "./YV4JVR4I.js";
+} from "./RTNCFSKZ.js";
 import {
   useEvent
-} from "./ABQUS43J.js";
+} from "./5GGHRIN3.js";
 import {
   __spreadProps,
   __spreadValues

package/esm/__chunks/{AVVE7UTR.js → SQZLCNLX.js}

@@ -1,26 +1,26 @@
 "use client";
 import {
   useRadioContext
-} from "./UVUMR3WP.js";
+} from "./BGBYET7R.js";
 import {
   useCompositeItem
-} from "./6VRAQV3D.js";
+} from "./SBSPVDDI.js";
 import {
   useStoreState
-} from "./YV4JVR4I.js";
+} from "./RTNCFSKZ.js";
 import {
   createElement,
   createHook,
   forwardRef,
   memo
-} from "./LMDWO4NN.js";
+} from "./VOQWLFSQ.js";
 import {
   useEvent,
   useForceUpdate,
   useId,
   useMergeRefs,
   useTagName
-} from "./ABQUS43J.js";
+} from "./5GGHRIN3.js";
 import {
   __objRest,
   __spreadProps,

package/esm/__chunks/{WYCIER3C.js → T22PY7TE.js}

@@ -2,10 +2,10 @@
 import {
   useStore,
   useStoreProps
-} from "./YV4JVR4I.js";
+} from "./RTNCFSKZ.js";
 import {
   useUpdateEffect
-} from "./ABQUS43J.js";
+} from "./5GGHRIN3.js";
 
 // src/disclosure/disclosure-store.ts
 import * as Core from "@ariakit/core/disclosure/disclosure-store";

package/esm/__chunks/{RS7LB2H4.js → T2AZQXQU.js}

@@ -2,10 +2,10 @@
 import {
   DisclosureContextProvider,
   DisclosureScopedContextProvider
-} from "./S6EF7IVO.js";
+} from "./ABN76PSX.js";
 import {
   createStoreContext
-} from "./LMDWO4NN.js";
+} from "./VOQWLFSQ.js";
 
 // src/dialog/dialog-context.tsx
 import { createContext } from "react";

package/esm/__chunks/{YORGHBM4.js → T4WMOWCD.js}

@@ -1,12 +1,12 @@
 "use client";
 import {
   useGroup
-} from "./36LIF33V.js";
+} from "./WXI7YN3P.js";
 import {
   createElement,
   createHook,
   forwardRef
-} from "./LMDWO4NN.js";
+} from "./VOQWLFSQ.js";
 import {
   __objRest
 } from "./3YLGPPWQ.js";

package/esm/__chunks/{MR26YJYP.js → TRDK6LYC.js}

@@ -1,21 +1,21 @@
 "use client";
 import {
   useHovercardProviderContext
-} from "./EM5CXX6A.js";
+} from "./7Z7JH52O.js";
 import {
   useFocusable
-} from "./PFRGBC2K.js";
+} from "./OE2EFRVA.js";
 import {
   createElement,
   createHook,
   forwardRef
-} from "./LMDWO4NN.js";
+} from "./VOQWLFSQ.js";
 import {
   useBooleanEvent,
   useEvent,
   useIsMouseMoving,
   useMergeRefs
-} from "./ABQUS43J.js";
+} from "./5GGHRIN3.js";
 import {
   __objRest,
   __spreadProps,

package/esm/__chunks/{3XAVFTCA.js → VJQU3YUE.js}

@@ -2,10 +2,10 @@
 import {
   CompositeContextProvider,
   CompositeScopedContextProvider
-} from "./P7GR5CS5.js";
+} from "./APTFW6PT.js";
 import {
   createStoreContext
-} from "./LMDWO4NN.js";
+} from "./VOQWLFSQ.js";
 
 // src/tag/tag-context.tsx
 import { createContext } from "react";

package/esm/__chunks/{LMDWO4NN.js → VOQWLFSQ.js}

@@ -1,7 +1,7 @@
 "use client";
 import {
   useMergeRefs
-} from "./ABQUS43J.js";
+} from "./5GGHRIN3.js";
 import {
   getRefProperty,
   mergeProps

package/esm/__chunks/{7M5THDKH.js → W2VQMCQN.js}

@@ -1,10 +1,10 @@
 "use client";
 import {
   useCompositeStoreProps
-} from "./4CMBR7SL.js";
+} from "./B7UTNDHN.js";
 import {
   useStore
-} from "./YV4JVR4I.js";
+} from "./RTNCFSKZ.js";
 
 // src/toolbar/toolbar-store.ts
 import * as Core from "@ariakit/core/toolbar/toolbar-store";