@ariakit/react-core 0.3.4 → 0.3.6

package/esm/__chunks/BTTOLUHC.js

@@ -0,0 +1,82 @@
+"use client";
+import {
+  MenubarScopedContextProvider,
+  useMenubarProviderContext
+} from "./KA4GX64Z.js";
+import {
+  useMenubarStore
+} from "./LNLZDJD4.js";
+import {
+  useComposite
+} from "./FHDXHZLB.js";
+import {
+  createComponent,
+  createElement,
+  createHook
+} from "./3ORBWXWF.js";
+import {
+  useWrapElement
+} from "./6O5OEQGF.js";
+import {
+  __objRest,
+  __spreadValues
+} from "./4R3V3JGP.js";
+
+// src/menubar/menubar.tsx
+import { jsx } from "react/jsx-runtime";
+var useMenubar = createHook(
+  (_a) => {
+    var _b = _a, {
+      store: storeProp,
+      composite = true,
+      orientation: orientationProp,
+      virtualFocus,
+      focusLoop,
+      rtl
+    } = _b, props = __objRest(_b, [
+      "store",
+      "composite",
+      "orientation",
+      "virtualFocus",
+      "focusLoop",
+      "rtl"
+    ]);
+    const context = useMenubarProviderContext();
+    storeProp = storeProp || context;
+    const store = useMenubarStore({
+      store: storeProp,
+      orientation: orientationProp,
+      virtualFocus,
+      focusLoop,
+      rtl
+    });
+    const orientation = store.useState(
+      (state) => !composite || state.orientation === "both" ? void 0 : state.orientation
+    );
+    props = useWrapElement(
+      props,
+      (element) => /* @__PURE__ */ jsx(MenubarScopedContextProvider, { value: store, children: element }),
+      [store]
+    );
+    if (composite) {
+      props = __spreadValues({
+        role: "menubar",
+        "aria-orientation": orientation
+      }, props);
+    }
+    props = useComposite(__spreadValues({ store, composite }, props));
+    return props;
+  }
+);
+var Menubar = createComponent((props) => {
+  const htmlProps = useMenubar(props);
+  return createElement("div", htmlProps);
+});
+if (process.env.NODE_ENV !== "production") {
+  Menubar.displayName = "Menubar";
+}
+
+export {
+  useMenubar,
+  Menubar
+};

package/esm/__chunks/{7VWXICM7.js → BULCTPRV.js}

@@ -1,12 +1,13 @@
+"use client";
 import {
   isBackdrop
-} from "./IXXFVVA2.js";
+} from "./MKDDWKFK.js";
 import {
   walkTreeOutside
-} from "./VRCYQ6JX.js";
+} from "./72E5EPFF.js";
 import {
   setAttribute
-} from "./FW6QFGFT.js";
+} from "./X6WIMZJE.js";
 
 // src/dialog/utils/disable-accessibility-tree-outside.ts
 function hideElementFromAccessibilityTree(element) {

package/esm/__chunks/{2FIUKXIM.js → CDFXNOHN.js}

@@ -1,13 +1,14 @@
+"use client";
 import {
   useCollectionContext
-} from "./74KKBFVP.js";
+} from "./4UUKJZ4V.js";
 import {
   createElement,
   forwardRef
-} from "./CFEUKV6C.js";
+} from "./3ORBWXWF.js";
 import {
   useStoreState
-} from "./WHAB4XD6.js";
+} from "./XF5ITC6P.js";
 import {
   useBooleanEvent,
   useEvent,
@@ -15,12 +16,12 @@ import {
   useId,
   useMergeRefs,
   useWrapElement
-} from "./J7Q2EO23.js";
+} from "./6O5OEQGF.js";
 import {
   __objRest,
   __spreadProps,
   __spreadValues
-} from "./PNRLI7OV.js";
+} from "./4R3V3JGP.js";
 
 // src/collection/collection-renderer.tsx
 import {

package/esm/__chunks/{QW4PFVNF.js → CHKJ74UC.js}

@@ -1,15 +1,16 @@
+"use client";
 import {
   useVisuallyHidden
-} from "./6XXSNRNX.js";
+} from "./BG6HZDS7.js";
 import {
   createComponent,
   createElement,
   createHook
-} from "./CFEUKV6C.js";
+} from "./3ORBWXWF.js";
 import {
   __spreadProps,
   __spreadValues
-} from "./PNRLI7OV.js";
+} from "./4R3V3JGP.js";
 
 // src/focus-trap/focus-trap.ts
 var useFocusTrap = createHook((props) => {

package/esm/__chunks/{EGOOWJGN.js → CLF4PQ7T.js}

@@ -1,20 +1,21 @@
+"use client";
 import {
   hideElementFromAccessibilityTree
-} from "./7VWXICM7.js";
-import {
-  supportsInert
-} from "./KOVUJERF.js";
+} from "./BULCTPRV.js";
 import {
   isBackdrop
-} from "./IXXFVVA2.js";
+} from "./MKDDWKFK.js";
+import {
+  supportsInert
+} from "./677M2CI3.js";
 import {
   walkTreeOutside
-} from "./VRCYQ6JX.js";
+} from "./72E5EPFF.js";
 import {
   assignStyle,
   setAttribute,
   setProperty
-} from "./FW6QFGFT.js";
+} from "./X6WIMZJE.js";
 
 // src/dialog/utils/disable-tree.ts
 import { contains } from "@ariakit/core/utils/dom";

package/esm/__chunks/{DCODCZJS.js → CRADASSQ.js}

@@ -1,25 +1,26 @@
+"use client";
 import {
   getCollectionRendererItemId,
   useCollectionRenderer
-} from "./2FIUKXIM.js";
+} from "./CDFXNOHN.js";
 import {
   useCompositeContext
-} from "./5C7J4IAS.js";
+} from "./IB7YUKH5.js";
 import {
   createElement,
   forwardRef
-} from "./CFEUKV6C.js";
+} from "./3ORBWXWF.js";
 import {
   useStoreState
-} from "./WHAB4XD6.js";
+} from "./XF5ITC6P.js";
 import {
   useId
-} from "./J7Q2EO23.js";
+} from "./6O5OEQGF.js";
 import {
   __objRest,
   __spreadProps,
   __spreadValues
-} from "./PNRLI7OV.js";
+} from "./4R3V3JGP.js";
 
 // src/composite/composite-renderer.tsx
 import { useMemo } from "react";

package/esm/__chunks/{CJI67A3R.js → CS347UVZ.js}

@@ -1,6 +1,7 @@
+"use client";
 import {
   useForceUpdate
-} from "./J7Q2EO23.js";
+} from "./6O5OEQGF.js";
 
 // src/dialog/utils/use-root-dialog.ts
 import { useCallback, useEffect } from "react";

package/esm/__chunks/{OD3JT64N.js → CVWFS4PP.js}

@@ -1,10 +1,11 @@
+"use client";
 import {
   useStore,
   useStoreProps
-} from "./WHAB4XD6.js";
+} from "./XF5ITC6P.js";
 import {
   useUpdateEffect
-} from "./J7Q2EO23.js";
+} from "./6O5OEQGF.js";
 
 // src/disclosure/disclosure-store.ts
 import * as Core from "@ariakit/core/disclosure/disclosure-store";

package/esm/__chunks/{J2AZPLFF.js → D42GAV4S.js}

@@ -1,34 +1,37 @@
+"use client";
 import {
   useCheckboxContext
-} from "./ICL2YIES.js";
+} from "./VPR2WHQV.js";
 import {
   CheckboxCheckedContext
-} from "./M5KYRTQG.js";
+} from "./6XBVQI3K.js";
 import {
   useCommand
-} from "./CAIAWNDV.js";
+} from "./NWCBQ4CV.js";
 import {
   createComponent,
   createElement,
   createHook
-} from "./CFEUKV6C.js";
+} from "./3ORBWXWF.js";
 import {
   useStoreState
-} from "./WHAB4XD6.js";
+} from "./XF5ITC6P.js";
 import {
   useEvent,
+  useForceUpdate,
   useMergeRefs,
   useTagName,
   useWrapElement
-} from "./J7Q2EO23.js";
+} from "./6O5OEQGF.js";
 import {
   __objRest,
   __spreadProps,
   __spreadValues
-} from "./PNRLI7OV.js";
+} from "./4R3V3JGP.js";
 
 // src/checkbox/checkbox.tsx
 import { useEffect, useRef, useState } from "react";
+import { disabledFromProps } from "@ariakit/core/utils/misc";
 import { jsx } from "react/jsx-runtime";
 function setMixed(element, mixed) {
   if (mixed) {
@@ -40,7 +43,7 @@ function setMixed(element, mixed) {
 function isNativeCheckbox(tagName, type) {
   return tagName === "input" && (!type || type === "checkbox");
 }
-function getNonArrayValue(value) {
+function getPrimitiveValue(value) {
   if (Array.isArray(value)) {
     return value.toString();
   }
@@ -50,11 +53,13 @@ var useCheckbox = createHook(
   (_a) => {
     var _b = _a, {
       store,
+      name,
       value: valueProp,
       checked: checkedProp,
       defaultChecked
     } = _b, props = __objRest(_b, [
       "store",
+      "name",
       "value",
       "checked",
       "defaultChecked"
@@ -69,8 +74,8 @@ var useCheckbox = createHook(
         return _checked;
       if (valueProp != null) {
         if (Array.isArray(state.value)) {
-          const nonArrayValue = getNonArrayValue(valueProp);
-          return state.value.includes(nonArrayValue);
+          const primitiveValue = getPrimitiveValue(valueProp);
+          return state.value.includes(primitiveValue);
         }
         return state.value === valueProp;
       }
@@ -85,16 +90,26 @@ var useCheckbox = createHook(
     const nativeCheckbox = isNativeCheckbox(tagName, props.type);
     const mixed = checked ? checked === "mixed" : void 0;
     const isChecked = checked === "mixed" ? false : checked;
+    const disabled = disabledFromProps(props);
+    const [propertyUpdated, schedulePropertyUpdate] = useForceUpdate();
     useEffect(() => {
       const element = ref.current;
       if (!element)
         return;
       setMixed(element, mixed);
+      if (nativeCheckbox)
+        return;
       element.checked = isChecked;
-    }, [mixed, isChecked]);
+      if (name !== void 0) {
+        element.name = name;
+      }
+      if (valueProp !== void 0) {
+        element.value = `${valueProp}`;
+      }
+    }, [propertyUpdated, mixed, nativeCheckbox, isChecked, name, valueProp]);
     const onChangeProp = props.onChange;
     const onChange = useEvent((event) => {
-      if (props.disabled) {
+      if (disabled) {
         event.stopPropagation();
         event.preventDefault();
         return;
@@ -102,6 +117,7 @@ var useCheckbox = createHook(
       setMixed(event.currentTarget, mixed);
       if (!nativeCheckbox) {
         event.currentTarget.checked = !event.currentTarget.checked;
+        schedulePropertyUpdate();
       }
       onChangeProp == null ? void 0 : onChangeProp(event);
       if (event.defaultPrevented)
@@ -111,13 +127,17 @@ var useCheckbox = createHook(
       store == null ? void 0 : store.setValue((prevValue) => {
         if (valueProp == null)
           return elementChecked;
-        const nonArrayValue = getNonArrayValue(valueProp);
+        const primitiveValue = getPrimitiveValue(valueProp);
         if (!Array.isArray(prevValue)) {
-          return prevValue === nonArrayValue ? false : nonArrayValue;
+          return prevValue === primitiveValue ? false : primitiveValue;
+        }
+        if (elementChecked) {
+          if (prevValue.includes(primitiveValue)) {
+            return prevValue;
+          }
+          return [...prevValue, primitiveValue];
         }
-        if (elementChecked)
-          return [...prevValue, nonArrayValue];
-        return prevValue.filter((v) => v !== nonArrayValue);
+        return prevValue.filter((v) => v !== primitiveValue);
       });
     });
     const onClickProp = props.onClick;
@@ -145,6 +165,7 @@ var useCheckbox = createHook(
     });
     props = useCommand(__spreadValues({ clickOnEnter: !nativeCheckbox }, props));
     return __spreadValues({
+      name: nativeCheckbox ? name : void 0,
       value: nativeCheckbox ? valueProp : void 0,
       checked: isChecked
     }, props);

package/esm/__chunks/{PTJJY26M.js → DIP7XAI7.js}

@@ -1,19 +1,20 @@
+"use client";
 import {
   DialogDescriptionContext
-} from "./5YYGDU4E.js";
+} from "./G6BJYYBK.js";
 import {
   createComponent,
   createElement,
   createHook
-} from "./CFEUKV6C.js";
+} from "./3ORBWXWF.js";
 import {
   useId,
   useSafeLayoutEffect
-} from "./J7Q2EO23.js";
+} from "./6O5OEQGF.js";
 import {
   __objRest,
   __spreadValues
-} from "./PNRLI7OV.js";
+} from "./4R3V3JGP.js";
 
 // src/dialog/dialog-description.ts
 import { useContext } from "react";

package/esm/__chunks/{IDYHJHXJ.js → E3XM3D67.js}

@@ -1,27 +1,28 @@
+"use client";
 import {
   FocusTrap
-} from "./QW4PFVNF.js";
+} from "./CHKJ74UC.js";
 import {
   PortalContext
-} from "./LDDPB3PY.js";
+} from "./7452U3HH.js";
 import {
   createComponent,
   createElement,
   createHook
-} from "./CFEUKV6C.js";
+} from "./3ORBWXWF.js";
 import {
   useMergeRefs,
   useSafeLayoutEffect,
   useWrapElement
-} from "./J7Q2EO23.js";
+} from "./6O5OEQGF.js";
 import {
   setRef
-} from "./CP3U4HPL.js";
+} from "./XM66DUTO.js";
 import {
   __objRest,
   __spreadProps,
   __spreadValues
-} from "./PNRLI7OV.js";
+} from "./4R3V3JGP.js";
 
 // src/portal/portal.tsx
 import { useContext, useEffect, useRef, useState } from "react";
@@ -57,11 +58,24 @@ function queueFocus(element) {
 }
 var usePortal = createHook(
   (_a) => {
-    var _b = _a, { preserveTabOrder, portalElement, portalRef, portal = true } = _b, props = __objRest(_b, ["preserveTabOrder", "portalElement", "portalRef", "portal"]);
+    var _b = _a, {
+      preserveTabOrder,
+      preserveTabOrderAnchor,
+      portalElement,
+      portalRef,
+      portal = true
+    } = _b, props = __objRest(_b, [
+      "preserveTabOrder",
+      "preserveTabOrderAnchor",
+      "portalElement",
+      "portalRef",
+      "portal"
+    ]);
     const ref = useRef(null);
     const refProp = useMergeRefs(ref, props.ref);
     const context = useContext(PortalContext);
     const [portalNode, setPortalNode] = useState(null);
+    const [anchorPortalNode, setAnchorPortalNode] = useState(null);
     const outerBeforeRef = useRef(null);
     const innerBeforeRef = useRef(null);
     const innerAfterRef = useRef(null);
@@ -94,6 +108,21 @@ var usePortal = createHook(
         setRef(portalRef, null);
       };
     }, [portal, portalElement, context, portalRef]);
+    useSafeLayoutEffect(() => {
+      if (!preserveTabOrder)
+        return;
+      if (!preserveTabOrderAnchor)
+        return;
+      const doc = getDocument(preserveTabOrderAnchor);
+      const element = doc.createElement("span");
+      element.style.position = "fixed";
+      preserveTabOrderAnchor.insertAdjacentElement("afterend", element);
+      setAnchorPortalNode(element);
+      return () => {
+        element.remove();
+        setAnchorPortalNode(null);
+      };
+    }, [preserveTabOrder, preserveTabOrderAnchor]);
     useEffect(() => {
       if (!portalNode)
         return;
@@ -172,7 +201,7 @@ var usePortal = createHook(
         if (portalNode) {
           element = createPortal(element, portalNode);
         }
-        element = /* @__PURE__ */ jsxs(Fragment, { children: [
+        let preserveTabOrderElement = /* @__PURE__ */ jsxs(Fragment, { children: [
           preserveTabOrder && portalNode && /* @__PURE__ */ jsx(
             FocusTrap,
             {
@@ -191,7 +220,6 @@ var usePortal = createHook(
           preserveTabOrder && // We're using position: fixed here so that the browser doesn't
           // add margin to the element when setting gap on a parent element.
           /* @__PURE__ */ jsx("span", { "aria-owns": portalNode == null ? void 0 : portalNode.id, style: { position: "fixed" } }),
-          element,
           preserveTabOrder && portalNode && /* @__PURE__ */ jsx(
             FocusTrap,
             {
@@ -215,9 +243,25 @@ var usePortal = createHook(
             }
           )
         ] });
-        return element;
+        if (anchorPortalNode && preserveTabOrder) {
+          preserveTabOrderElement = createPortal(
+            preserveTabOrderElement,
+            anchorPortalNode
+          );
+        }
+        return /* @__PURE__ */ jsxs(Fragment, { children: [
+          preserveTabOrderElement,
+          element
+        ] });
       },
-      [portalNode, context, portal, props.id, preserveTabOrder]
+      [
+        portalNode,
+        context,
+        portal,
+        props.id,
+        preserveTabOrder,
+        anchorPortalNode
+      ]
     );
     props = __spreadProps(__spreadValues({}, props), {
       ref: refProp

package/esm/__chunks/{WRZGD4DH.js → ELWRSPQ7.js}

@@ -1,10 +1,11 @@
+"use client";
 import {
   useCollectionStoreProps
-} from "./YS46MLTR.js";
+} from "./5A2VZUUV.js";
 import {
   useStore,
   useStoreProps
-} from "./WHAB4XD6.js";
+} from "./XF5ITC6P.js";
 
 // src/composite/composite-store.ts
 import * as Core from "@ariakit/core/composite/composite-store";

package/esm/__chunks/{JM3KBRED.js → ENRQQ6LK.js}

@@ -1,19 +1,20 @@
+"use client";
 import {
   useSeparator
-} from "./J5LOLGUC.js";
+} from "./YZEJGRDQ.js";
 import {
   useCompositeContext
-} from "./5C7J4IAS.js";
+} from "./IB7YUKH5.js";
 import {
   createComponent,
   createElement,
   createHook
-} from "./CFEUKV6C.js";
+} from "./3ORBWXWF.js";
 import {
   __objRest,
   __spreadProps,
   __spreadValues
-} from "./PNRLI7OV.js";
+} from "./4R3V3JGP.js";
 
 // src/composite/composite-separator.ts
 import { invariant } from "@ariakit/core/utils/misc";

package/esm/__chunks/{WNHMGHG5.js → F6PRXTDU.js}

@@ -1,18 +1,19 @@
+"use client";
 import {
   useDialogDismiss
-} from "./3KBWC7LF.js";
+} from "./NKXUN25E.js";
 import {
   usePopoverScopedContext
-} from "./547DFODS.js";
+} from "./7H5KSHHF.js";
 import {
   createComponent,
   createElement,
   createHook
-} from "./CFEUKV6C.js";
+} from "./3ORBWXWF.js";
 import {
   __objRest,
   __spreadValues
-} from "./PNRLI7OV.js";
+} from "./4R3V3JGP.js";
 
 // src/popover/popover-dismiss.ts
 var usePopoverDismiss = createHook(

package/esm/__chunks/{OQUFN5QO.js → FGMA3QUS.js}

@@ -1,18 +1,19 @@
+"use client";
 import {
   usePopoverDismiss
-} from "./WNHMGHG5.js";
+} from "./F6PRXTDU.js";
 import {
   useHovercardScopedContext
-} from "./5DA3HK6G.js";
+} from "./TI7CMBHW.js";
 import {
   createComponent,
   createElement,
   createHook
-} from "./CFEUKV6C.js";
+} from "./3ORBWXWF.js";
 import {
   __objRest,
   __spreadValues
-} from "./PNRLI7OV.js";
+} from "./4R3V3JGP.js";
 
 // src/hovercard/hovercard-dismiss.ts
 var useHovercardDismiss = createHook(

package/esm/__chunks/{56TAEBRJ.js → FHDXHZLB.js}

@@ -1,34 +1,35 @@
+"use client";
 import {
   findFirstEnabledItem,
   getEnabledItem,
   groupItemsByRows,
   isItem,
   silentlyFocused
-} from "./OXPV2NBK.js";
+} from "./6QXBPV75.js";
 import {
   CompositeContextProvider,
   useCompositeProviderContext
-} from "./5C7J4IAS.js";
+} from "./IB7YUKH5.js";
 import {
   useFocusable
-} from "./YTHH33BK.js";
+} from "./KK7H3W2B.js";
 import {
   createComponent,
   createElement,
   createHook
-} from "./CFEUKV6C.js";
+} from "./3ORBWXWF.js";
 import {
   useBooleanEvent,
   useEvent,
   useMergeRefs,
   useSafeLayoutEffect,
   useWrapElement
-} from "./J7Q2EO23.js";
+} from "./6O5OEQGF.js";
 import {
   __objRest,
   __spreadProps,
   __spreadValues
-} from "./PNRLI7OV.js";
+} from "./4R3V3JGP.js";
 
 // src/composite/composite.tsx
 import { useCallback, useEffect, useRef, useState } from "react";