@ariakit/react-core 0.2.2 → 0.2.4

package/esm/__chunks/{BMIMIX2N.js → HIZJQGB5.js}

@@ -5,7 +5,7 @@ import {
 } from "./X7FKJQME.js";
 import {
   usePopover
-} from "./K4BVBSSF.js";
+} from "./ZWS67PVZ.js";
 import {
   createComponent,
   createElement,
@@ -19,7 +19,7 @@ import {
   usePortalRef,
   useSafeLayoutEffect,
   useWrapElement
-} from "./ASYR66PQ.js";
+} from "./JSNCZ2E2.js";
 import {
   __objRest,
   __spreadProps,
@@ -38,7 +38,7 @@ import {
 import { contains } from "@ariakit/core/utils/dom";
 import { addGlobalEventListener } from "@ariakit/core/utils/events";
 import { hasFocusWithin } from "@ariakit/core/utils/focus";
-import { chain } from "@ariakit/core/utils/misc";
+import { chain, isFalsyBooleanCallback } from "@ariakit/core/utils/misc";
 import { jsx } from "react/jsx-runtime";
 function isMovingOnHovercard(target, card, anchor, nested) {
   if (hasFocusWithin(card))
@@ -118,7 +118,6 @@ var useHovercard = createHook(
       modal = false,
       portal = !!modal,
       hideOnEscape = true,
-      hideOnControl = false,
       hideOnHoverOutside = true,
       disablePointerEventsOnApproach = !!hideOnHoverOutside
     } = _b, props = __objRest(_b, [
@@ -126,7 +125,6 @@ var useHovercard = createHook(
       "modal",
       "portal",
       "hideOnEscape",
-      "hideOnControl",
       "hideOnHoverOutside",
       "disablePointerEventsOnApproach"
     ]);
@@ -135,22 +133,6 @@ var useHovercard = createHook(
     const hideTimeoutRef = useRef(0);
     const enterPointRef = useRef(null);
     const { portalRef, domReady } = usePortalRef(portal, props.portalRef);
-    const hideOnEscapeProp = useBooleanEvent(hideOnEscape);
-    const hideOnControlProp = useBooleanEvent(hideOnControl);
-    const open = store.useState("open");
-    useEffect(() => {
-      if (!open)
-        return;
-      return addGlobalEventListener("keydown", (event) => {
-        if (event.defaultPrevented)
-          return;
-        const isEscape = event.key === "Escape" && hideOnEscapeProp(event);
-        const isControl = event.key === "Control" && hideOnControlProp(event);
-        if (isEscape || isControl) {
-          requestAnimationFrame(store.hide);
-        }
-      });
-    }, [store, open, hideOnEscapeProp, hideOnControlProp]);
     const mayHideOnHoverOutside = !!hideOnHoverOutside;
     const hideOnHoverOutsideProp = useBooleanEvent(hideOnHoverOutside);
     const mayDisablePointerEvents = !!disablePointerEventsOnApproach;
@@ -283,12 +265,17 @@ var useHovercard = createHook(
     props = useAutoFocusOnHide(__spreadValues({ store }, props));
     props = useAutoFocusOnShow(__spreadValues({ store, modal }, props));
     props = usePopover(__spreadProps(__spreadValues({
-      hideOnEscape,
       store,
       modal,
       portal
     }, props), {
-      portalRef
+      portalRef,
+      hideOnEscape(event) {
+        if (isFalsyBooleanCallback(hideOnEscape, event))
+          return false;
+        requestAnimationFrame(() => requestAnimationFrame(store.hide));
+        return true;
+      }
     }));
     return props;
   }

package/esm/__chunks/{GQ73PJK4.js → HWYCCPYU.js}

@@ -9,7 +9,7 @@ import {
 import {
   useId,
   useSafeLayoutEffect
-} from "./ASYR66PQ.js";
+} from "./JSNCZ2E2.js";
 import {
   __objRest,
   __spreadValues

package/esm/__chunks/{K4QQOEEY.js → IMP6LK4U.js}

@@ -10,7 +10,7 @@ import {
   useEvent,
   useForkRef,
   useTagName
-} from "./ASYR66PQ.js";
+} from "./JSNCZ2E2.js";
 import {
   __objRest,
   __spreadProps,
@@ -131,6 +131,8 @@ function onGlobalKeyDown(event) {
     return;
   if (event.ctrlKey)
     return;
+  if (event.altKey)
+    return;
   isKeyboardModality = true;
 }
 var useFocusable = createHook(
@@ -302,9 +304,9 @@ var useFocusable = createHook(
       onBlurProp == null ? void 0 : onBlurProp(event);
       if (!focusable)
         return;
-      if (isFocusEventOutside(event)) {
-        setFocusVisible(false);
-      }
+      if (!isFocusEventOutside(event))
+        return;
+      setFocusVisible(false);
     });
     const autoFocusOnShow = useContext(FocusableContext);
     const autoFocusRef = useEvent((element) => {

package/esm/__chunks/{ASYR66PQ.js → JSNCZ2E2.js}

@@ -125,6 +125,17 @@ function useTagName(refOrElement, type) {
   }, [refOrElement, type]);
   return tagName;
 }
+function useAttribute(refOrElement, attributeName, defaultValue) {
+  const [attribute, setAttribute] = useState(defaultValue);
+  useSafeLayoutEffect(() => {
+    const element = refOrElement && "current" in refOrElement ? refOrElement.current : refOrElement;
+    const value = element == null ? void 0 : element.getAttribute(attributeName);
+    if (value == null)
+      return;
+    setAttribute(value);
+  }, [refOrElement, attributeName]);
+  return attribute;
+}
 function useUpdateEffect(effect, deps) {
   const mounted = useRef(false);
   useEffect(() => {
@@ -256,6 +267,7 @@ export {
   useId,
   useDeferredValue,
   useTagName,
+  useAttribute,
   useUpdateEffect,
   useUpdateLayoutEffect,
   useControlledState,

package/esm/__chunks/{HN4VMOUI.js → JX7L6AQW.js}

@@ -1,7 +1,7 @@
 import {
   useStore,
   useStoreProps
-} from "./AV5WE37O.js";
+} from "./FY2SXATP.js";
 import {
   __spreadValues
 } from "./4BKCJXBM.js";

package/esm/__chunks/{K4JNSIDS.js → KXTECTTC.js}

@@ -12,7 +12,7 @@ import {
 import {
   useForkRef,
   useSafeLayoutEffect
-} from "./ASYR66PQ.js";
+} from "./JSNCZ2E2.js";
 import {
   __objRest,
   __spreadProps,

package/esm/__chunks/{RBUEJWRA.js → LMWFU6EQ.js}

@@ -4,7 +4,7 @@ import {
 } from "./DJESYNLE.js";
 import {
   useSafeLayoutEffect
-} from "./ASYR66PQ.js";
+} from "./JSNCZ2E2.js";
 
 // src/dialog/utils/use-prevent-body-scroll.ts
 import { getDocument, getWindow } from "@ariakit/core/utils/dom";

package/esm/__chunks/{VLR7PUBG.js → N5KAEM7B.js}

@@ -1,6 +1,6 @@
 import {
   usePopoverDescription
-} from "./YD5EOSG3.js";
+} from "./EZKI7X4G.js";
 import {
   createComponent,
   createElement,

package/esm/__chunks/{7DPLTL4U.js → NMKK3GWP.js}

@@ -10,7 +10,7 @@ import {
 import {
   useId,
   useWrapElement
-} from "./ASYR66PQ.js";
+} from "./JSNCZ2E2.js";
 import {
   __objRest,
   __spreadValues

package/esm/__chunks/{T3WBUAHU.js → NOIOBRWH.js}

@@ -1,6 +1,6 @@
 import {
   useSafeLayoutEffect
-} from "./ASYR66PQ.js";
+} from "./JSNCZ2E2.js";
 
 // src/dialog/utils/use-nested-dialogs.tsx
 import {

package/esm/__chunks/{MEYEPL2D.js → NVLKN7BK.js}

@@ -1,7 +1,7 @@
 import {
   useStore,
   useStoreProps
-} from "./AV5WE37O.js";
+} from "./FY2SXATP.js";
 import {
   __spreadValues
 } from "./4BKCJXBM.js";

package/esm/__chunks/{X4UE5ZYC.js → OTKCW3PM.js}

@@ -1,9 +1,9 @@
 import {
   useCommand
-} from "./5KLYDORO.js";
+} from "./GKEHNDOU.js";
 import {
   useCollectionItem
-} from "./2VSLIXPB.js";
+} from "./CWGC7RDD.js";
 import {
   focusSilently,
   getEnabledItem,
@@ -21,7 +21,7 @@ import {
 } from "./U2LXZPCY.js";
 import {
   useStoreState
-} from "./AV5WE37O.js";
+} from "./FY2SXATP.js";
 import {
   useBooleanEvent,
   useEvent,
@@ -29,7 +29,7 @@ import {
   useId,
   useSafeLayoutEffect,
   useWrapElement
-} from "./ASYR66PQ.js";
+} from "./JSNCZ2E2.js";
 import {
   __objRest,
   __spreadProps,

package/esm/__chunks/{QRJCFBOI.js → PXJHIBDO.js}

@@ -1,11 +1,11 @@
 import {
   usePopoverStoreOptions,
   usePopoverStoreProps
-} from "./5PIH3SMS.js";
+} from "./T4YP7E6T.js";
 import {
   useStore,
   useStoreProps
-} from "./AV5WE37O.js";
+} from "./FY2SXATP.js";
 import {
   __spreadValues
 } from "./4BKCJXBM.js";

package/esm/__chunks/{TTOXS6BI.js → QDEVTSDD.js}

@@ -1,6 +1,6 @@
 import {
   useButton
-} from "./Q4TAYJGL.js";
+} from "./WPWRDZX3.js";
 import {
   DialogContext
 } from "./LNHZLQEK.js";
@@ -11,7 +11,7 @@ import {
 } from "./U2LXZPCY.js";
 import {
   useEvent
-} from "./ASYR66PQ.js";
+} from "./JSNCZ2E2.js";
 import {
   __objRest,
   __spreadProps,

package/esm/__chunks/{7SVOWQTM.js → SPQB36IP.js}

@@ -1,6 +1,6 @@
 import {
   useGroupLabel
-} from "./RGAE7WHK.js";
+} from "./XO22PNQJ.js";
 import {
   createComponent,
   createElement,

package/esm/__chunks/{T3IC7FMC.js → SUXGXJIC.js}

@@ -1,6 +1,6 @@
 import {
   useGroup
-} from "./PPIHKGNC.js";
+} from "./34WFGKVL.js";
 import {
   createComponent,
   createElement,

package/esm/__chunks/{K35D42HN.js → T2QG6N7V.js}

@@ -3,7 +3,10 @@ import {
 } from "./5VGBBGF5.js";
 import {
   isHidden
-} from "./NRBO7PPT.js";
+} from "./YJZ2FEUT.js";
+import {
+  useFocusable
+} from "./IMP6LK4U.js";
 import {
   createComponent,
   createElement,
@@ -14,7 +17,7 @@ import {
   useForkRef,
   useId,
   useWrapElement
-} from "./ASYR66PQ.js";
+} from "./JSNCZ2E2.js";
 import {
   __objRest,
   __spreadProps,
@@ -23,10 +26,11 @@ import {
 
 // src/combobox/combobox-list.tsx
 import { useRef } from "react";
+import { isFocusEventOutside } from "@ariakit/core/utils/events";
 import { jsx } from "react/jsx-runtime";
 var useComboboxList = createHook(
   (_a) => {
-    var _b = _a, { store, alwaysVisible } = _b, props = __objRest(_b, ["store", "alwaysVisible"]);
+    var _b = _a, { store, focusable = true, alwaysVisible } = _b, props = __objRest(_b, ["store", "focusable", "alwaysVisible"]);
     const ref = useRef(null);
     const id = useId(props.id);
     const onKeyDownProp = props.onKeyDown;
@@ -38,6 +42,35 @@ var useComboboxList = createHook(
         store.move(null);
       }
     });
+    const restoreVirtualFocus = useRef(false);
+    const onFocusVisibleProp = props.onFocusVisible;
+    const onFocusVisible = useEvent((event) => {
+      onFocusVisibleProp == null ? void 0 : onFocusVisibleProp(event);
+      if (event.defaultPrevented)
+        return;
+      if (event.type !== "focus")
+        return;
+      const { virtualFocus } = store.getState();
+      if (!virtualFocus)
+        return;
+      const { relatedTarget, currentTarget } = event;
+      if (relatedTarget && currentTarget.contains(relatedTarget))
+        return;
+      restoreVirtualFocus.current = true;
+      store.setState("virtualFocus", false);
+    });
+    const onBlurProp = props.onBlur;
+    const onBlur = useEvent((event) => {
+      onBlurProp == null ? void 0 : onBlurProp(event);
+      if (event.defaultPrevented)
+        return;
+      if (!restoreVirtualFocus.current)
+        return;
+      if (!isFocusEventOutside(event))
+        return;
+      restoreVirtualFocus.current = false;
+      store.setState("virtualFocus", true);
+    });
     props = useWrapElement(
       props,
       (element) => /* @__PURE__ */ jsx(ComboboxContext.Provider, { value: store, children: element }),
@@ -48,13 +81,17 @@ var useComboboxList = createHook(
     const style = hidden ? __spreadProps(__spreadValues({}, props.style), { display: "none" }) : props.style;
     props = __spreadProps(__spreadValues({
       id,
+      hidden,
       role: "listbox",
-      hidden
+      tabIndex: focusable ? -1 : void 0
     }, props), {
       ref: useForkRef(id ? store.setContentElement : null, ref, props.ref),
       style,
-      onKeyDown
+      onKeyDown,
+      onFocusVisible,
+      onBlur
     });
+    props = useFocusable(__spreadValues({ focusable }, props));
     return props;
   }
 );

package/esm/__chunks/{5PIH3SMS.js → T4YP7E6T.js}

@@ -1,11 +1,11 @@
 import {
   useDialogStoreOptions,
   useDialogStoreProps
-} from "./OBNQHP6V.js";
+} from "./5KT3GDTM.js";
 import {
   useStore,
   useStoreProps
-} from "./AV5WE37O.js";
+} from "./FY2SXATP.js";
 import {
   __spreadValues
 } from "./4BKCJXBM.js";

package/esm/__chunks/{FYVEOR7R.js → URYSNCDU.js}

@@ -8,7 +8,7 @@ import {
 } from "./U2LXZPCY.js";
 import {
   useWrapElement
-} from "./ASYR66PQ.js";
+} from "./JSNCZ2E2.js";
 import {
   __objRest
 } from "./4BKCJXBM.js";

package/esm/__chunks/{NBC642OI.js → UYBDYDBM.js}

@@ -5,7 +5,7 @@ import {
 } from "./U2LXZPCY.js";
 import {
   useForkRef
-} from "./ASYR66PQ.js";
+} from "./JSNCZ2E2.js";
 import {
   __objRest,
   __spreadProps,

package/esm/__chunks/{IMFOFYLN.js → UZWTAYHH.js}

@@ -3,7 +3,7 @@ import {
 } from "./P3I4MECH.js";
 import {
   useCollectionItem
-} from "./2VSLIXPB.js";
+} from "./CWGC7RDD.js";
 import {
   createElement,
   createHook,
@@ -14,7 +14,7 @@ import {
   useEvent,
   useForkRef,
   useId
-} from "./ASYR66PQ.js";
+} from "./JSNCZ2E2.js";
 import {
   __objRest,
   __spreadProps,

package/esm/__chunks/{YRBSOIWS.js → VQPGNVAE.js}

@@ -1,6 +1,6 @@
 import {
   usePopoverDismiss
-} from "./V47YM6O6.js";
+} from "./BBUDEDX6.js";
 import {
   createComponent,
   createElement,

package/esm/__chunks/{Y2V2DFHD.js → WNWUDBP3.js}

@@ -10,7 +10,7 @@ import {
   useBooleanEvent,
   useEvent,
   useIsMouseMoving
-} from "./ASYR66PQ.js";
+} from "./JSNCZ2E2.js";
 import {
   __objRest,
   __spreadProps,
@@ -20,7 +20,7 @@ import {
 // src/composite/composite-hover.ts
 import { useContext } from "react";
 import { closest, contains } from "@ariakit/core/utils/dom";
-import { hasFocusWithin } from "@ariakit/core/utils/focus";
+import { hasFocus, hasFocusWithin } from "@ariakit/core/utils/focus";
 import { invariant } from "@ariakit/core/utils/misc";
 function getMouseDestination(event) {
   const relatedTarget = event.relatedTarget;
@@ -55,7 +55,6 @@ var useCompositeHover = createHook(
     const onMouseMoveProp = props.onMouseMove;
     const focusOnHoverProp = useBooleanEvent(focusOnHover);
     const onMouseMove = useEvent((event) => {
-      var _a2;
       onMouseMoveProp == null ? void 0 : onMouseMoveProp(event);
       if (event.defaultPrevented)
         return;
@@ -64,7 +63,10 @@ var useCompositeHover = createHook(
       if (!focusOnHoverProp(event))
         return;
       if (!hasFocusWithin(event.currentTarget)) {
-        (_a2 = store == null ? void 0 : store.getState().baseElement) == null ? void 0 : _a2.focus();
+        const baseElement = store == null ? void 0 : store.getState().baseElement;
+        if (baseElement && !hasFocus(baseElement)) {
+          baseElement.focus();
+        }
       }
       store == null ? void 0 : store.setActiveId(event.currentTarget.id);
     });

package/esm/__chunks/{Q4TAYJGL.js → WPWRDZX3.js}

@@ -1,6 +1,6 @@
 import {
   useCommand
-} from "./5KLYDORO.js";
+} from "./GKEHNDOU.js";
 import {
   createComponent,
   createElement,
@@ -9,7 +9,7 @@ import {
 import {
   useForkRef,
   useTagName
-} from "./ASYR66PQ.js";
+} from "./JSNCZ2E2.js";
 import {
   __spreadProps,
   __spreadValues

package/esm/__chunks/{JTWJOAF2.js → WVBEOY53.js}

@@ -3,7 +3,7 @@ import {
 } from "./6I2PARRP.js";
 import {
   useCompositeItem
-} from "./X4UE5ZYC.js";
+} from "./OTKCW3PM.js";
 import {
   createElement,
   createHook,
@@ -11,13 +11,13 @@ import {
 } from "./U2LXZPCY.js";
 import {
   useStoreState
-} from "./AV5WE37O.js";
+} from "./FY2SXATP.js";
 import {
   useEvent,
   useForkRef,
   useId,
   useTagName
-} from "./ASYR66PQ.js";
+} from "./JSNCZ2E2.js";
 import {
   __objRest,
   __spreadProps,

package/esm/__chunks/{GHFGDKVL.js → XIW77V4E.js}

@@ -1,6 +1,6 @@
 import {
   usePopoverHeading
-} from "./THRMCR5V.js";
+} from "./A5P4XOHC.js";
 import {
   createComponent,
   createElement,

package/esm/__chunks/{CUXAE5EP.js → XMEKWVLK.js}

@@ -1,9 +1,9 @@
 import {
   useDialogDisclosure
-} from "./PI5KZQST.js";
+} from "./76X52BLD.js";
 import {
   usePopoverAnchor
-} from "./NBC642OI.js";
+} from "./UYBDYDBM.js";
 import {
   PopoverContext
 } from "./6GS36SYX.js";
@@ -15,7 +15,7 @@ import {
 import {
   useEvent,
   useWrapElement
-} from "./ASYR66PQ.js";
+} from "./JSNCZ2E2.js";
 import {
   __objRest,
   __spreadProps,

package/esm/__chunks/{RGAE7WHK.js → XO22PNQJ.js}

@@ -9,7 +9,7 @@ import {
 import {
   useId,
   useSafeLayoutEffect
-} from "./ASYR66PQ.js";
+} from "./JSNCZ2E2.js";
 import {
   __spreadValues
 } from "./4BKCJXBM.js";

package/esm/__chunks/{KNDB2OYV.js → XURV7VPV.js}

@@ -8,7 +8,7 @@ import {
 } from "./U2LXZPCY.js";
 import {
   useEvent
-} from "./ASYR66PQ.js";
+} from "./JSNCZ2E2.js";
 import {
   __objRest,
   __spreadProps,

package/esm/__chunks/{GRNO2YNE.js → XXMIY262.js}

@@ -11,7 +11,7 @@ import {
 } from "./U2LXZPCY.js";
 import {
   useEvent
-} from "./ASYR66PQ.js";
+} from "./JSNCZ2E2.js";
 import {
   __objRest,
   __spreadProps,
@@ -52,7 +52,7 @@ function itemTextStartsWith(item, text) {
   const itemText = ((_a = item.element) == null ? void 0 : _a.textContent) || item.children;
   if (!itemText)
     return false;
-  return normalizeString(itemText).toLowerCase().startsWith(text.toLowerCase());
+  return normalizeString(itemText).trim().toLowerCase().startsWith(text.toLowerCase());
 }
 function getSameInitialItems(items, char, activeId) {
   if (!activeId)

package/esm/__chunks/{JM74EEHT.js → YBDXDAKQ.js}

@@ -10,7 +10,7 @@ import {
 } from "./Z3X3QN6P.js";
 import {
   useFocusable
-} from "./K4QQOEEY.js";
+} from "./IMP6LK4U.js";
 import {
   createComponent,
   createElement,
@@ -22,7 +22,7 @@ import {
   useForkRef,
   useSafeLayoutEffect,
   useWrapElement
-} from "./ASYR66PQ.js";
+} from "./JSNCZ2E2.js";
 import {
   __objRest,
   __spreadProps,
@@ -308,7 +308,7 @@ var useComposite = createHook(
     const activeDescendant = store.useState(
       (state) => {
         var _a2;
-        return state.virtualFocus ? (_a2 = getEnabledItem(store, state.activeId)) == null ? void 0 : _a2.id : void 0;
+        return composite && state.virtualFocus ? (_a2 = getEnabledItem(store, state.activeId)) == null ? void 0 : _a2.id : void 0;
       }
     );
     props = __spreadProps(__spreadValues({