@ariakit/react-core 0.4.24 → 0.4.25

package/esm/__chunks/{C7ZLNJMM.js → GR523XJ6.js}

@@ -6,28 +6,22 @@ import {
   createElement,
   createHook,
   forwardRef
-} from "./ZNLX6YSC.js";
+} from "./TVXRYIJB.js";
 import {
   useEvent,
   useMergeRefs,
+  useMetadataProps,
   useTagName
-} from "./G47ZC7SD.js";
+} from "./CEM7J6TT.js";
 
 // src/focusable/focusable.tsx
-import { isButton } from "@ariakit/core/utils/dom";
 import {
   addGlobalEventListener,
   isFocusEventOutside,
-  isPortalEvent,
   isSelfTarget,
   queueBeforeEvent
 } from "@ariakit/core/utils/events";
-import {
-  focusIfNeeded,
-  getClosestFocusable,
-  hasFocus,
-  isFocusable
-} from "@ariakit/core/utils/focus";
+import { hasFocus, isFocusable } from "@ariakit/core/utils/focus";
 import {
   disabledFromProps,
   removeUndefinedValues
@@ -35,6 +29,7 @@ import {
 import { isSafari } from "@ariakit/core/utils/platform";
 import { useContext, useEffect, useMemo, useRef, useState } from "react";
 var TagName = "div";
+var accessibleWhenDisabledSymbol = /* @__PURE__ */ Symbol("accessibleWhenDisabled");
 var isSafariBrowser = isSafari();
 var alwaysFocusVisibleInputTypes = [
   "text",
@@ -51,15 +46,6 @@ var alwaysFocusVisibleInputTypes = [
   "datetime",
   "datetime-local"
 ];
-var safariFocusAncestorSymbol = /* @__PURE__ */ Symbol("safariFocusAncestor");
-function isSafariFocusAncestor(element) {
-  if (!element) return false;
-  return !!element[safariFocusAncestorSymbol];
-}
-function markSafariFocusAncestor(element, value) {
-  if (!element) return;
-  element[safariFocusAncestorSymbol] = value;
-}
 function isAlwaysFocusVisible(element) {
   const { tagName, readOnly, type } = element;
   if (tagName === "TEXTAREA" && !readOnly) return true;
@@ -74,19 +60,6 @@ function isAlwaysFocusVisible(element) {
   }
   return false;
 }
-function getLabels(element) {
-  if ("labels" in element) {
-    return element.labels;
-  }
-  return null;
-}
-function isNativeCheckboxOrRadio(element) {
-  const tagName = element.tagName.toLowerCase();
-  if (tagName === "input" && element.type) {
-    return element.type === "radio" || element.type === "checkbox";
-  }
-  return false;
-}
 function isNativeTabbable(tagName) {
   if (!tagName) return true;
   return tagName === "button" || tagName === "summary" || tagName === "input" || tagName === "select" || tagName === "textarea" || tagName === "a";
@@ -95,10 +68,31 @@ function supportsDisabledAttribute(tagName) {
   if (!tagName) return true;
   return tagName === "button" || tagName === "input" || tagName === "select" || tagName === "textarea";
 }
-function getTabIndex(focusable, trulyDisabled, nativeTabbable, supportsDisabled, tabIndexProp) {
-  if (!focusable) {
-    return tabIndexProp;
+var buttonInputTypes = [
+  "button",
+  "color",
+  "file",
+  "image",
+  "reset",
+  "submit"
+];
+function needsSafariTabIndex(tagName, inputType) {
+  if (tagName === "button") return true;
+  if (tagName === "input" && inputType) {
+    if (inputType === "checkbox" || inputType === "radio") return true;
+    return buttonInputTypes.includes(inputType);
   }
+  return false;
+}
+function getTabIndex({
+  focusable,
+  trulyDisabled,
+  nativeTabbable,
+  supportsDisabled,
+  safariTabIndex,
+  tabIndexProp
+}) {
+  if (!focusable) return tabIndexProp;
   if (trulyDisabled) {
     if (nativeTabbable && !supportsDisabled) {
       return -1;
@@ -106,9 +100,12 @@ function getTabIndex(focusable, trulyDisabled, nativeTabbable, supportsDisabled,
     return;
   }
   if (nativeTabbable) {
+    if (safariTabIndex && tabIndexProp == null) {
+      return 0;
+    }
     return tabIndexProp;
   }
-  return tabIndexProp || 0;
+  return tabIndexProp != null ? tabIndexProp : 0;
 }
 function useDisableEvent(onEvent, disabled) {
   return useEvent((event) => {
@@ -145,6 +142,12 @@ var useFocusable = createHook(
     ...props
   }) {
     const ref = useRef(null);
+    const [parentAccessibleWhenDisabled, metadataProps] = useMetadataProps(
+      props,
+      accessibleWhenDisabledSymbol,
+      accessibleWhenDisabled
+    );
+    accessibleWhenDisabled != null ? accessibleWhenDisabled : accessibleWhenDisabled = parentAccessibleWhenDisabled;
     useEffect(() => {
       if (!focusable) return;
       if (hasInstalledGlobalEventListeners) return;
@@ -152,25 +155,6 @@ var useFocusable = createHook(
       addGlobalEventListener("keydown", onGlobalKeyDown, true);
       hasInstalledGlobalEventListeners = true;
     }, [focusable]);
-    if (isSafariBrowser) {
-      useEffect(() => {
-        if (!focusable) return;
-        const element = ref.current;
-        if (!element) return;
-        if (!isNativeCheckboxOrRadio(element)) return;
-        const labels = getLabels(element);
-        if (!labels) return;
-        const onMouseUp = () => queueMicrotask(() => element.focus());
-        for (const label of labels) {
-          label.addEventListener("mouseup", onMouseUp);
-        }
-        return () => {
-          for (const label of labels) {
-            label.removeEventListener("mouseup", onMouseUp);
-          }
-        };
-      }, [focusable]);
-    }
     const disabled = focusable && disabledFromProps(props);
     const trulyDisabled = !!disabled && !accessibleWhenDisabled;
     const [focusVisible, setFocusVisible] = useState(false);
@@ -203,30 +187,6 @@ var useFocusable = createHook(
       disabled
     );
     const onClickCapture = useDisableEvent(props.onClickCapture, disabled);
-    const onMouseDownProp = props.onMouseDown;
-    const onMouseDown = useEvent((event) => {
-      onMouseDownProp == null ? void 0 : onMouseDownProp(event);
-      if (event.defaultPrevented) return;
-      if (!focusable) return;
-      const element = event.currentTarget;
-      if (!isSafariBrowser) return;
-      if (isPortalEvent(event)) return;
-      if (!isButton(element) && !isNativeCheckboxOrRadio(element)) return;
-      let receivedFocus = false;
-      const onFocus = () => {
-        receivedFocus = true;
-      };
-      const options = { capture: true, once: true };
-      element.addEventListener("focusin", onFocus, options);
-      const focusableContainer = getClosestFocusable(element.parentElement);
-      markSafariFocusAncestor(focusableContainer, true);
-      queueBeforeEvent(element, "mouseup", () => {
-        element.removeEventListener("focusin", onFocus, true);
-        markSafariFocusAncestor(focusableContainer, false);
-        if (receivedFocus) return;
-        focusIfNeeded(element);
-      });
-    });
     const handleFocusVisible = (event, currentTarget) => {
       if (currentTarget) {
         event.currentTarget = currentTarget;
@@ -294,6 +254,17 @@ var useFocusable = createHook(
     const tagName = useTagName(ref);
     const nativeTabbable = focusable && isNativeTabbable(tagName);
     const supportsDisabled = focusable && supportsDisabledAttribute(tagName);
+    const [safariTabIndex, setSafariTabIndex] = useState(false);
+    if (isSafariBrowser) {
+      useEffect(() => {
+        if (!focusable) return;
+        const element = ref.current;
+        if (!element) return;
+        const tag = element.tagName.toLowerCase();
+        const type = element.type;
+        setSafariTabIndex(needsSafariTabIndex(tag, type));
+      }, [focusable]);
+    }
     const styleProp = props.style;
     const style = useMemo(() => {
       if (trulyDisabled) {
@@ -306,22 +277,23 @@ var useFocusable = createHook(
       "data-autofocus": autoFocus || void 0,
       "aria-disabled": disabled || void 0,
       ...props,
+      ...metadataProps,
       ref: useMergeRefs(ref, autoFocusRef, props.ref),
       style,
-      tabIndex: getTabIndex(
+      tabIndex: getTabIndex({
         focusable,
         trulyDisabled,
         nativeTabbable,
         supportsDisabled,
-        props.tabIndex
-      ),
+        safariTabIndex,
+        tabIndexProp: props.tabIndex
+      }),
       disabled: supportsDisabled && trulyDisabled ? true : void 0,
       // TODO: Test Focusable contentEditable.
       contentEditable: disabled ? void 0 : props.contentEditable,
       onKeyPressCapture,
       onClickCapture,
       onMouseDownCapture,
-      onMouseDown,
       onKeyDownCapture,
       onFocusCapture,
       onBlur
@@ -335,7 +307,6 @@ var Focusable = forwardRef(function Focusable2(props) {
 });
 
 export {
-  isSafariFocusAncestor,
   useFocusable,
   Focusable
 };

package/esm/__chunks/{YXOTZ32N.js → H55QERR5.js}

@@ -2,14 +2,14 @@
 import {
   PopoverContextProvider,
   PopoverScopedContextProvider
-} from "./E5E7U2B6.js";
+} from "./E4DZA6YM.js";
 import {
   CompositeContextProvider,
   CompositeScopedContextProvider
-} from "./57GJCRRF.js";
+} from "./55FNNNML.js";
 import {
   createStoreContext
-} from "./ZNLX6YSC.js";
+} from "./TVXRYIJB.js";
 
 // src/combobox/combobox-context.tsx
 import { createContext } from "react";

package/esm/__chunks/{2UJVL4WQ.js → HOV66IHV.js}

@@ -4,15 +4,15 @@ import {
 } from "./7NJRHOSP.js";
 import {
   useCompositeContext
-} from "./57GJCRRF.js";
+} from "./55FNNNML.js";
 import {
   createElement,
   createHook,
   forwardRef
-} from "./ZNLX6YSC.js";
+} from "./TVXRYIJB.js";
 import {
   useEvent
-} from "./G47ZC7SD.js";
+} from "./CEM7J6TT.js";
 
 // src/composite/composite-typeahead.tsx
 import {

package/esm/__chunks/{L7IQNEVE.js → HPFXM3JB.js}

@@ -1,23 +1,23 @@
 "use client";
 import {
   usePopoverAnchor
-} from "./Q62CGBNE.js";
+} from "./BLCLYOQG.js";
 import {
   useDialogDisclosure
-} from "./M5D2PAJU.js";
+} from "./TXH4Y74N.js";
 import {
   PopoverScopedContextProvider,
   usePopoverProviderContext
-} from "./E5E7U2B6.js";
+} from "./E4DZA6YM.js";
 import {
   createElement,
   createHook,
   forwardRef
-} from "./ZNLX6YSC.js";
+} from "./TVXRYIJB.js";
 import {
   useEvent,
   useWrapElement
-} from "./G47ZC7SD.js";
+} from "./CEM7J6TT.js";
 
 // src/popover/popover-disclosure.tsx
 import { invariant } from "@ariakit/core/utils/misc";

package/esm/__chunks/{PKM3NWHS.js → I5KTQKBD.js}

@@ -1,18 +1,18 @@
 "use client";
 import {
   useSeparator
-} from "./TWDUFIV2.js";
+} from "./KQPI347I.js";
 import {
   useCompositeContext
-} from "./57GJCRRF.js";
+} from "./55FNNNML.js";
 import {
   useStoreState
-} from "./XYGGOF6W.js";
+} from "./YAS7X7HB.js";
 import {
   createElement,
   createHook,
   forwardRef
-} from "./ZNLX6YSC.js";
+} from "./TVXRYIJB.js";
 
 // src/composite/composite-separator.tsx
 import { invariant } from "@ariakit/core/utils/misc";

package/esm/__chunks/{HFFZYOO5.js → IKWLDXMV.js}

@@ -1,16 +1,16 @@
 "use client";
 import {
   useCollectionContext
-} from "./4ODJH2Y5.js";
+} from "./FQHJBBMI.js";
 import {
   createElement,
   createHook,
   forwardRef
-} from "./ZNLX6YSC.js";
+} from "./TVXRYIJB.js";
 import {
   useId,
   useMergeRefs
-} from "./G47ZC7SD.js";
+} from "./CEM7J6TT.js";
 
 // src/collection/collection-item.tsx
 import { identity, removeUndefinedValues } from "@ariakit/core/utils/misc";

package/esm/__chunks/{6WVG3SIW.js → IO2WX73N.js}

@@ -2,10 +2,10 @@
 import {
   useStore,
   useStoreProps
-} from "./XYGGOF6W.js";
+} from "./YAS7X7HB.js";
 import {
   useUpdateEffect
-} from "./G47ZC7SD.js";
+} from "./CEM7J6TT.js";
 
 // src/checkbox/checkbox-store.ts
 import * as Core from "@ariakit/core/checkbox/checkbox-store";

package/esm/__chunks/{US3QBMU2.js → ITP6SX6R.js}

@@ -4,19 +4,19 @@ import {
 } from "./7NJRHOSP.js";
 import {
   useCompositeContext
-} from "./57GJCRRF.js";
+} from "./55FNNNML.js";
 import {
   useStoreState
-} from "./XYGGOF6W.js";
+} from "./YAS7X7HB.js";
 import {
   createElement,
   createHook,
   forwardRef
-} from "./ZNLX6YSC.js";
+} from "./TVXRYIJB.js";
 import {
   useEvent,
   useMergeRefs
-} from "./G47ZC7SD.js";
+} from "./CEM7J6TT.js";
 
 // src/composite/composite-container.tsx
 import { isButton, isTextField } from "@ariakit/core/utils/dom";

package/esm/__chunks/{2VQLORIE.js → J3UXHN5K.js}

@@ -1,26 +1,26 @@
 "use client";
 import {
   useMenuContext
-} from "./Q35TXJTU.js";
+} from "./KTCTUSE6.js";
 import {
   useMenubarContext
-} from "./EK7GBBE3.js";
+} from "./B7YOUFP2.js";
 import {
   useHovercardStoreProps
-} from "./LNZKURLD.js";
+} from "./NV5OUTYH.js";
 import {
   useCompositeStoreProps
-} from "./AFNZIDBX.js";
+} from "./ZJG6VNPS.js";
 import {
   useComboboxProviderContext
-} from "./YXOTZ32N.js";
+} from "./H55QERR5.js";
 import {
   useStore,
   useStoreProps
-} from "./XYGGOF6W.js";
+} from "./YAS7X7HB.js";
 import {
   useUpdateEffect
-} from "./G47ZC7SD.js";
+} from "./CEM7J6TT.js";
 
 // src/menu/menu-store.ts
 import * as Core from "@ariakit/core/menu/menu-store";

package/esm/__chunks/{6M5YGSDS.js → JLUH2Q3W.js}

@@ -2,20 +2,20 @@
 import {
   getCollectionRendererItemId,
   useCollectionRenderer
-} from "./66TYCCEM.js";
+} from "./YVLKMAG2.js";
 import {
   useCompositeContext
-} from "./57GJCRRF.js";
+} from "./55FNNNML.js";
 import {
   useStoreState
-} from "./XYGGOF6W.js";
+} from "./YAS7X7HB.js";
 import {
   createElement,
   forwardRef
-} from "./ZNLX6YSC.js";
+} from "./TVXRYIJB.js";
 import {
   useId
-} from "./G47ZC7SD.js";
+} from "./CEM7J6TT.js";
 
 // src/composite/composite-renderer.tsx
 import { useMemo } from "react";

package/esm/__chunks/{E2GXNEWF.js → JQAYMPOA.js}

@@ -1,28 +1,28 @@
 "use client";
 import {
   useCommand
-} from "./GROIW2U2.js";
+} from "./GHQLK2M5.js";
 import {
   CheckboxCheckedContext
 } from "./EYKMH5G5.js";
 import {
   useCheckboxContext
-} from "./YAFFSPLV.js";
+} from "./GOWR535L.js";
 import {
   useStoreState
-} from "./XYGGOF6W.js";
+} from "./YAS7X7HB.js";
 import {
   createElement,
   createHook,
   forwardRef
-} from "./ZNLX6YSC.js";
+} from "./TVXRYIJB.js";
 import {
   useEvent,
   useForceUpdate,
   useMergeRefs,
   useTagName,
   useWrapElement
-} from "./G47ZC7SD.js";
+} from "./CEM7J6TT.js";
 
 // src/checkbox/checkbox.tsx
 import {

package/esm/__chunks/{4IWMRS2E.js → JVH3F2PI.js}

@@ -2,25 +2,25 @@
 import {
   createDialogComponent,
   useDialog
-} from "./GKPFMPRM.js";
+} from "./7WPPMYFR.js";
 import {
   PopoverScopedContextProvider,
   usePopoverProviderContext
-} from "./E5E7U2B6.js";
+} from "./E4DZA6YM.js";
 import {
   useStoreState
-} from "./XYGGOF6W.js";
+} from "./YAS7X7HB.js";
 import {
   createElement,
   createHook,
   forwardRef
-} from "./ZNLX6YSC.js";
+} from "./TVXRYIJB.js";
 import {
   useEvent,
   usePortalRef,
   useSafeLayoutEffect,
   useWrapElement
-} from "./G47ZC7SD.js";
+} from "./CEM7J6TT.js";
 
 // src/popover/popover.tsx
 import { invariant } from "@ariakit/core/utils/misc";

package/esm/__chunks/{TWDUFIV2.js → KQPI347I.js}

@@ -3,7 +3,7 @@ import {
   createElement,
   createHook,
   forwardRef
-} from "./ZNLX6YSC.js";
+} from "./TVXRYIJB.js";
 
 // src/separator/separator.tsx
 var TagName = "hr";

package/esm/__chunks/{6T5FLGQD.js → KQS2CH22.js}

@@ -1,21 +1,21 @@
 "use client";
 import {
   useTagContext
-} from "./3X3QYQCU.js";
+} from "./KR5NJL64.js";
 import {
   usePopoverStoreProps
-} from "./6AOPHM6J.js";
+} from "./RPKQBJCW.js";
 import {
   useCompositeStoreOptions,
   useCompositeStoreProps
-} from "./AFNZIDBX.js";
+} from "./ZJG6VNPS.js";
 import {
   useStore,
   useStoreProps
-} from "./XYGGOF6W.js";
+} from "./YAS7X7HB.js";
 import {
   useUpdateEffect
-} from "./G47ZC7SD.js";
+} from "./CEM7J6TT.js";
 
 // src/combobox/combobox-store.ts
 import * as Core from "@ariakit/core/combobox/combobox-store";

package/esm/__chunks/{3X3QYQCU.js → KR5NJL64.js}

@@ -2,10 +2,10 @@
 import {
   CompositeContextProvider,
   CompositeScopedContextProvider
-} from "./57GJCRRF.js";
+} from "./55FNNNML.js";
 import {
   createStoreContext
-} from "./ZNLX6YSC.js";
+} from "./TVXRYIJB.js";
 
 // src/tag/tag-context.tsx
 import { createContext } from "react";

package/esm/__chunks/{Q35TXJTU.js → KTCTUSE6.js}

@@ -5,18 +5,18 @@ import {
   useMenubarContext,
   useMenubarProviderContext,
   useMenubarScopedContext
-} from "./EK7GBBE3.js";
+} from "./B7YOUFP2.js";
 import {
   HovercardContextProvider,
   HovercardScopedContextProvider
-} from "./VI2TRTYW.js";
+} from "./GLWQDZNX.js";
 import {
   CompositeContextProvider,
   CompositeScopedContextProvider
-} from "./57GJCRRF.js";
+} from "./55FNNNML.js";
 import {
   createStoreContext
-} from "./ZNLX6YSC.js";
+} from "./TVXRYIJB.js";
 
 // src/menu/menu-context.tsx
 import { createContext } from "react";

package/esm/__chunks/{626PMZMH.js → LAI6ES6V.js}

@@ -1,29 +1,29 @@
 "use client";
 import {
   useMenuScopedContext
-} from "./Q35TXJTU.js";
+} from "./KTCTUSE6.js";
 import {
   useMenubarScopedContext
-} from "./EK7GBBE3.js";
+} from "./B7YOUFP2.js";
 import {
   useCompositeHover
-} from "./L3FYE3QX.js";
+} from "./CI3WD73H.js";
 import {
   useCompositeItem
-} from "./7CGHQ3Z6.js";
+} from "./ZCYMVQGT.js";
 import {
   useStoreState
-} from "./XYGGOF6W.js";
+} from "./YAS7X7HB.js";
 import {
   createElement,
   createHook,
   forwardRef,
   memo
-} from "./ZNLX6YSC.js";
+} from "./TVXRYIJB.js";
 import {
   useBooleanEvent,
   useEvent
-} from "./G47ZC7SD.js";
+} from "./CEM7J6TT.js";
 
 // src/menu/menu-item.tsx
 import { getDocument, getPopupItemRole } from "@ariakit/core/utils/dom";