@ariakit/react-core 0.1.5 → 0.1.7

package/esm/__chunks/{PU22SOKH.js → 62DFK33R.js}

@@ -6,15 +6,17 @@ function prependHiddenDismiss(container, onClick) {
   button.type = "button";
   button.tabIndex = -1;
   button.textContent = "Dismiss popup";
-  button.style.border = "0px";
-  button.style.clip = "rect(0 0 0 0)";
-  button.style.height = "1px";
-  button.style.margin = "-1px";
-  button.style.overflow = "hidden";
-  button.style.padding = "0px";
-  button.style.position = "absolute";
-  button.style.whiteSpace = "nowrap";
-  button.style.width = "1px";
+  Object.assign(button.style, {
+    border: "0px",
+    clip: "rect(0 0 0 0)",
+    height: "1px",
+    margin: "-1px",
+    overflow: "hidden",
+    padding: "0px",
+    position: "absolute",
+    whiteSpace: "nowrap",
+    width: "1px"
+  });
   button.addEventListener("click", onClick);
   container.prepend(button);
   const removeHiddenDismiss = () => {

package/esm/__chunks/{2WA5HZXQ.js → 65MJJ4BW.js}

@@ -1,23 +1,29 @@
 import {
   useFocusable
-} from "./5TGAWEHD.js";
+} from "./AGWM73EZ.js";
 import {
   createComponent,
   createElement,
   createHook
-} from "./JE5NWDDX.js";
+} from "./5ETIGB6O.js";
 import {
   useBooleanEvent,
   useEvent,
   useForkRef,
   useIsMouseMoving
-} from "./B7MIN7YT.js";
+} from "./ASYR66PQ.js";
+import {
+  __objRest,
+  __spreadProps,
+  __spreadValues
+} from "./4BKCJXBM.js";
 
 // src/hovercard/hovercard-anchor.ts
 import { useEffect, useRef } from "react";
 import { addGlobalEventListener } from "@ariakit/core/utils/events";
 var useHovercardAnchor = createHook(
-  ({ store, showOnHover = true, ...props }) => {
+  (_a) => {
+    var _b = _a, { store, showOnHover = true } = _b, props = __objRest(_b, ["store", "showOnHover"]);
     const disabled = props.disabled || props["aria-disabled"] === true || props["aria-disabled"] === "true";
     const showTimeoutRef = useRef(0);
     useEffect(() => () => window.clearTimeout(showTimeoutRef.current), []);
@@ -39,7 +45,7 @@ var useHovercardAnchor = createHook(
     const onMouseMove = useEvent(
       (event) => {
         store.setAnchorElement(event.currentTarget);
-        onMouseMoveProp?.(event);
+        onMouseMoveProp == null ? void 0 : onMouseMoveProp(event);
         if (disabled)
           return;
         if (event.defaultPrevented)
@@ -59,11 +65,10 @@ var useHovercardAnchor = createHook(
         }, showTimeout);
       }
     );
-    props = {
-      ...props,
+    props = __spreadProps(__spreadValues({}, props), {
       ref: useForkRef(store.setAnchorElement, props.ref),
       onMouseMove
-    };
+    });
     props = useFocusable(props);
     return props;
   }

package/esm/__chunks/{FFRIGW5T.js → 6AJCHLAV.js}

@@ -2,12 +2,17 @@ import {
   createComponent,
   createElement,
   createHook
-} from "./JE5NWDDX.js";
+} from "./5ETIGB6O.js";
 import {
   useForkRef,
   useId,
   useSafeLayoutEffect
-} from "./B7MIN7YT.js";
+} from "./ASYR66PQ.js";
+import {
+  __objRest,
+  __spreadProps,
+  __spreadValues
+} from "./4BKCJXBM.js";
 
 // src/disclosure/disclosure-content.ts
 import { useState } from "react";
@@ -30,7 +35,8 @@ function parseCSSTime(...times) {
   }, 0);
 }
 var useDisclosureContent = createHook(
-  ({ store, ...props }) => {
+  (_a) => {
+    var _b = _a, { store } = _b, props = __objRest(_b, ["store"]);
     const id = useId(props.id);
     const [transition, setTransition] = useState(null);
     const open = store.useState("open");
@@ -40,7 +46,7 @@ var useDisclosureContent = createHook(
     useSafeLayoutEffect(() => {
       if (!animated)
         return;
-      if (!contentElement?.isConnected) {
+      if (!(contentElement == null ? void 0 : contentElement.isConnected)) {
         setTransition(null);
         return;
       }
@@ -78,17 +84,17 @@ var useDisclosureContent = createHook(
     }, [animated, contentElement, open, transition]);
     const style = (
       // TODO: props.hidden !== true see combobox-textarea example
-      mounted && props.hidden !== true || props.hidden === false ? props.style : { ...props.style, display: "none" }
+      mounted && props.hidden !== true || props.hidden === false ? props.style : __spreadProps(__spreadValues({}, props.style), { display: "none" })
     );
-    props = {
+    props = __spreadProps(__spreadValues({
       id,
       "data-enter": transition === "enter" ? "" : void 0,
       "data-leave": transition === "leave" ? "" : void 0,
-      hidden: !mounted,
-      ...props,
+      hidden: !mounted
+    }, props), {
       ref: useForkRef(id ? store.setContentElement : null, props.ref),
       style
-    };
+    });
     return props;
   }
 );

package/esm/__chunks/{CDHQAO3X.js → 6M5FZNI5.js}

@@ -3,18 +3,23 @@ import {
 } from "./P3I4MECH.js";
 import {
   useCollectionItem
-} from "./ON2AV7GH.js";
+} from "./X7UZWWYG.js";
 import {
   createElement,
   createHook,
   createMemoComponent
-} from "./JE5NWDDX.js";
+} from "./5ETIGB6O.js";
 import {
   useBooleanEvent,
   useEvent,
   useForkRef,
   useId
-} from "./B7MIN7YT.js";
+} from "./ASYR66PQ.js";
+import {
+  __objRest,
+  __spreadProps,
+  __spreadValues
+} from "./4BKCJXBM.js";
 
 // src/form/form-field.ts
 import { useCallback, useContext, useRef } from "react";
@@ -38,13 +43,18 @@ function useItem(store, name, type) {
   );
 }
 var useFormField = createHook(
-  ({
-    store,
-    name: nameProp,
-    getItem: getItemProp,
-    touchOnBlur = true,
-    ...props
-  }) => {
+  (_a) => {
+    var _b = _a, {
+      store,
+      name: nameProp,
+      getItem: getItemProp,
+      touchOnBlur = true
+    } = _b, props = __objRest(_b, [
+      "store",
+      "name",
+      "getItem",
+      "touchOnBlur"
+    ]);
     const context = useContext(FormContext);
     store = store || context;
     invariant(
@@ -60,12 +70,12 @@ var useFormField = createHook(
         return;
       await Promise.resolve();
       if ("validity" in element && !element.validity.valid) {
-        store?.setError(name, element.validationMessage);
+        store == null ? void 0 : store.setError(name, element.validationMessage);
       }
     });
     const getItem = useCallback(
       (item) => {
-        const nextItem = { ...item, id: id || item.id, name, type: "field" };
+        const nextItem = __spreadProps(__spreadValues({}, item), { id: id || item.id, name, type: "field" });
         if (getItemProp) {
           return getItemProp(nextItem);
         }
@@ -76,34 +86,34 @@ var useFormField = createHook(
     const onBlurProp = props.onBlur;
     const touchOnBlurProp = useBooleanEvent(touchOnBlur);
     const onBlur = useEvent((event) => {
-      onBlurProp?.(event);
+      onBlurProp == null ? void 0 : onBlurProp(event);
       if (event.defaultPrevented)
         return;
       if (!touchOnBlurProp(event))
         return;
-      store?.setFieldTouched(name, true);
+      store == null ? void 0 : store.setFieldTouched(name, true);
     });
     const label = useItem(store, name, "label");
     const error = useItem(store, name, "error");
     const description = useItem(store, name, "description");
     const describedBy = cx(
-      error?.id,
-      description?.id,
+      error == null ? void 0 : error.id,
+      description == null ? void 0 : description.id,
       props["aria-describedby"]
     );
     const invalid = store.useState(
-      () => !!store?.getError(name) && store.getFieldTouched(name)
+      () => !!(store == null ? void 0 : store.getError(name)) && store.getFieldTouched(name)
     );
-    props = {
+    props = __spreadProps(__spreadValues({
       id,
-      "aria-labelledby": label?.id,
-      "aria-invalid": invalid,
-      ...props,
+      "aria-labelledby": label == null ? void 0 : label.id,
+      "aria-invalid": invalid
+    }, props), {
       "aria-describedby": describedBy || void 0,
       ref: useForkRef(ref, props.ref),
       onBlur
-    };
-    props = useCollectionItem({ store, ...props, name, getItem });
+    });
+    props = useCollectionItem(__spreadProps(__spreadValues({ store }, props), { name, getItem }));
     return props;
   }
 );

package/esm/__chunks/{JKSMOXA4.js → 6O3TZMB4.js}

@@ -1,42 +1,47 @@
 import {
   useDialogDisclosure
-} from "./NRA7DRSD.js";
+} from "./LSTZ5Q72.js";
 import {
   PopoverContext
 } from "./6GS36SYX.js";
 import {
   usePopoverAnchor
-} from "./RNWB46DZ.js";
+} from "./D6NPK2DL.js";
 import {
   createComponent,
   createElement,
   createHook
-} from "./JE5NWDDX.js";
+} from "./5ETIGB6O.js";
 import {
   useEvent,
   useWrapElement
-} from "./B7MIN7YT.js";
+} from "./ASYR66PQ.js";
+import {
+  __objRest,
+  __spreadProps,
+  __spreadValues
+} from "./4BKCJXBM.js";
 
 // src/popover/popover-disclosure.tsx
 import { jsx } from "react/jsx-runtime";
 var usePopoverDisclosure = createHook(
-  ({ store, ...props }) => {
+  (_a) => {
+    var _b = _a, { store } = _b, props = __objRest(_b, ["store"]);
     const onClickProp = props.onClick;
     const onClick = useEvent((event) => {
       store.setAnchorElement(event.currentTarget);
-      onClickProp?.(event);
+      onClickProp == null ? void 0 : onClickProp(event);
     });
     props = useWrapElement(
       props,
       (element) => /* @__PURE__ */ jsx(PopoverContext.Provider, { value: store, children: element }),
       [store]
     );
-    props = {
-      ...props,
+    props = __spreadProps(__spreadValues({}, props), {
       onClick
-    };
-    props = usePopoverAnchor({ store, ...props });
-    props = useDialogDisclosure({ store, ...props });
+    });
+    props = usePopoverAnchor(__spreadValues({ store }, props));
+    props = useDialogDisclosure(__spreadValues({ store }, props));
     return props;
   }
 );

package/esm/__chunks/6WVG5KFF.js

@@ -0,0 +1,42 @@
+import {
+  FocusableContext
+} from "./BMLNRUFQ.js";
+import {
+  createComponent,
+  createElement,
+  createHook
+} from "./5ETIGB6O.js";
+import {
+  useWrapElement
+} from "./ASYR66PQ.js";
+import {
+  __objRest
+} from "./4BKCJXBM.js";
+
+// src/focusable/focusable-container.tsx
+import { jsx } from "react/jsx-runtime";
+var useFocusableContainer = createHook(
+  (_a) => {
+    var _b = _a, { autoFocusOnShow = true } = _b, props = __objRest(_b, ["autoFocusOnShow"]);
+    props = useWrapElement(
+      props,
+      (element) => /* @__PURE__ */ jsx(FocusableContext.Provider, { value: autoFocusOnShow, children: element }),
+      [autoFocusOnShow]
+    );
+    return props;
+  }
+);
+var FocusableContainer = createComponent(
+  (props) => {
+    const htmlProps = useFocusableContainer(props);
+    return createElement("div", htmlProps);
+  }
+);
+if (process.env.NODE_ENV !== "production") {
+  FocusableContainer.displayName = "FocusableContainer";
+}
+
+export {
+  useFocusableContainer,
+  FocusableContainer
+};

package/esm/__chunks/7A3SODQV.js

@@ -0,0 +1,26 @@
+import {
+  setAttribute
+} from "./DJESYNLE.js";
+import {
+  walkTreeOutside
+} from "./ISPCL6N4.js";
+
+// src/dialog/utils/disable-accessibility-tree-outside.ts
+function hideElementFromAccessibilityTree(element) {
+  return setAttribute(element, "aria-hidden", "true");
+}
+function disableAccessibilityTreeOutside(...elements) {
+  const cleanups = [];
+  walkTreeOutside(elements, (element) => {
+    cleanups.unshift(hideElementFromAccessibilityTree(element));
+  });
+  const restoreAccessibilityTree = () => {
+    cleanups.forEach((fn) => fn());
+  };
+  return restoreAccessibilityTree;
+}
+
+export {
+  hideElementFromAccessibilityTree,
+  disableAccessibilityTreeOutside
+};

package/esm/__chunks/{5TGAWEHD.js → AGWM73EZ.js}

@@ -1,16 +1,24 @@
+import {
+  FocusableContext
+} from "./BMLNRUFQ.js";
 import {
   createComponent,
   createElement,
   createHook
-} from "./JE5NWDDX.js";
+} from "./5ETIGB6O.js";
 import {
   useEvent,
   useForkRef,
   useTagName
-} from "./B7MIN7YT.js";
+} from "./ASYR66PQ.js";
+import {
+  __objRest,
+  __spreadProps,
+  __spreadValues
+} from "./4BKCJXBM.js";
 
 // src/focusable/focusable.ts
-import { useEffect, useRef, useState } from "react";
+import { useContext, useEffect, useRef, useState } from "react";
 import { isButton } from "@ariakit/core/utils/dom";
 import {
   addGlobalEventListener,
@@ -100,7 +108,7 @@ function getTabIndex(focusable, trulyDisabled, nativeTabbable, supportsDisabled,
 }
 function useDisableEvent(onEvent, disabled) {
   return useEvent((event) => {
-    onEvent?.(event);
+    onEvent == null ? void 0 : onEvent(event);
     if (event.defaultPrevented)
       return;
     if (disabled) {
@@ -126,13 +134,18 @@ function onGlobalKeyDown(event) {
   isKeyboardModality = true;
 }
 var useFocusable = createHook(
-  ({
-    focusable = true,
-    accessibleWhenDisabled,
-    autoFocus,
-    onFocusVisible,
-    ...props
-  }) => {
+  (_a) => {
+    var _b = _a, {
+      focusable = true,
+      accessibleWhenDisabled,
+      autoFocus,
+      onFocusVisible
+    } = _b, props = __objRest(_b, [
+      "focusable",
+      "accessibleWhenDisabled",
+      "autoFocus",
+      "onFocusVisible"
+    ]);
     const ref = useRef(null);
     useEffect(() => {
       if (!focusable)
@@ -200,7 +213,7 @@ var useFocusable = createHook(
     const onClickCapture = useDisableEvent(props.onClickCapture, disabled);
     const onMouseDownProp = props.onMouseDown;
     const onMouseDown = useEvent((event) => {
-      onMouseDownProp?.(event);
+      onMouseDownProp == null ? void 0 : onMouseDownProp(event);
       if (event.defaultPrevented)
         return;
       if (!focusable)
@@ -229,7 +242,7 @@ var useFocusable = createHook(
       if (currentTarget) {
         event.currentTarget = currentTarget;
       }
-      onFocusVisible?.(event);
+      onFocusVisible == null ? void 0 : onFocusVisible(event);
       if (event.defaultPrevented)
         return;
       if (!focusable)
@@ -244,7 +257,7 @@ var useFocusable = createHook(
     const onKeyDownCaptureProp = props.onKeyDownCapture;
     const onKeyDownCapture = useEvent(
       (event) => {
-        onKeyDownCaptureProp?.(event);
+        onKeyDownCaptureProp == null ? void 0 : onKeyDownCaptureProp(event);
         if (event.defaultPrevented)
           return;
         if (!focusable)
@@ -265,7 +278,7 @@ var useFocusable = createHook(
     );
     const onFocusCaptureProp = props.onFocusCapture;
     const onFocusCapture = useEvent((event) => {
-      onFocusCaptureProp?.(event);
+      onFocusCaptureProp == null ? void 0 : onFocusCaptureProp(event);
       if (event.defaultPrevented)
         return;
       if (!focusable)
@@ -286,13 +299,14 @@ var useFocusable = createHook(
     });
     const onBlurProp = props.onBlur;
     const onBlur = useEvent((event) => {
-      onBlurProp?.(event);
+      onBlurProp == null ? void 0 : onBlurProp(event);
       if (!focusable)
         return;
       if (isFocusEventOutside(event)) {
         setFocusVisible(false);
       }
     });
+    const autoFocusOnShow = useContext(FocusableContext);
     const autoFocusRef = useEvent((element) => {
       if (!focusable)
         return;
@@ -300,6 +314,8 @@ var useFocusable = createHook(
         return;
       if (!element)
         return;
+      if (!autoFocusOnShow)
+        return;
       queueMicrotask(() => {
         if (hasFocus(element))
           return;
@@ -311,12 +327,12 @@ var useFocusable = createHook(
     const tagName = useTagName(ref, props.as);
     const nativeTabbable = focusable && isNativeTabbable(tagName);
     const supportsDisabled = focusable && supportsDisabledAttribute(tagName);
-    const style = trulyDisabled ? { pointerEvents: "none", ...props.style } : props.style;
-    props = {
+    const style = trulyDisabled ? __spreadValues({ pointerEvents: "none" }, props.style) : props.style;
+    props = __spreadProps(__spreadValues({
       "data-focus-visible": focusable && focusVisible ? "" : void 0,
       "data-autofocus": autoFocus ? true : void 0,
-      "aria-disabled": disabled ? true : void 0,
-      ...props,
+      "aria-disabled": disabled ? true : void 0
+    }, props), {
       ref: useForkRef(ref, autoFocusRef, props.ref),
       style,
       tabIndex: getTabIndex(
@@ -336,7 +352,7 @@ var useFocusable = createHook(
       onKeyDownCapture,
       onFocusCapture,
       onBlur
-    };
+    });
     return props;
   }
 );

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

@@ -1,6 +1,10 @@
 import {
   setRef
 } from "./SXC6BPOF.js";
+import {
+  __spreadProps,
+  __spreadValues
+} from "./4BKCJXBM.js";
 
 // src/utils/hooks.ts
 import {
@@ -16,7 +20,7 @@ import * as React from "react";
 import { canUseDOM } from "@ariakit/core/utils/dom";
 import { addGlobalEventListener } from "@ariakit/core/utils/events";
 import { applyState } from "@ariakit/core/utils/misc";
-var _React = { ...React };
+var _React = __spreadValues({}, React);
 var useReactId = _React.useId;
 var useReactDeferredValue = _React.useDeferredValue;
 var useReactInsertionEffect = _React.useInsertionEffect;
@@ -57,7 +61,10 @@ function useEvent(callback) {
   } else {
     ref.current = callback;
   }
-  return useCallback((...args) => ref.current?.(...args), []);
+  return useCallback((...args) => {
+    var _a;
+    return (_a = ref.current) == null ? void 0 : _a.call(ref, ...args);
+  }, []);
 }
 function useForkRef(...refs) {
   return useMemo(() => {
@@ -73,7 +80,8 @@ function useForkRef(...refs) {
 function useRefId(ref, deps) {
   const [id, setId] = useState(void 0);
   useSafeLayoutEffect(() => {
-    setId(ref?.current?.id);
+    var _a;
+    setId((_a = ref == null ? void 0 : ref.current) == null ? void 0 : _a.id);
   }, deps);
   return id;
 }
@@ -113,7 +121,7 @@ function useTagName(refOrElement, type) {
   const [tagName, setTagName] = useState(() => stringOrUndefined(type));
   useSafeLayoutEffect(() => {
     const element = refOrElement && "current" in refOrElement ? refOrElement.current : refOrElement;
-    setTagName(element?.tagName.toLowerCase() || stringOrUndefined(type));
+    setTagName((element == null ? void 0 : element.tagName.toLowerCase()) || stringOrUndefined(type));
   }, [refOrElement, type]);
   return tagName;
 }
@@ -198,7 +206,7 @@ function useWrapElement(props, callback, deps = []) {
     },
     [...deps, props.wrapElement]
   );
-  return { ...props, wrapElement };
+  return __spreadProps(__spreadValues({}, props), { wrapElement });
 }
 function usePortalRef(portalProp = false, portalRefProp) {
   const [portalNode, setPortalNode] = useState(null);

package/esm/__chunks/{LTH56VDS.js → AV5WE37O.js}

@@ -3,7 +3,11 @@ import {
   useLiveRef,
   useSafeLayoutEffect,
   useUpdateLayoutEffect
-} from "./B7MIN7YT.js";
+} from "./ASYR66PQ.js";
+import {
+  __spreadProps,
+  __spreadValues
+} from "./4BKCJXBM.js";
 
 // src/utils/store.tsx
 import { useCallback, useMemo } from "react";
@@ -27,7 +31,7 @@ function useStoreState(store, keyOrSelector = identity) {
     return state[key];
   };
   return useSyncExternalStore(
-    store?.subscribe || noopSubscribe,
+    (store == null ? void 0 : store.subscribe) || noopSubscribe,
     getSnapshot,
     getSnapshot
   );
@@ -42,16 +46,25 @@ function useStoreProps(store, props, key, setKey) {
     return store.sync(
       (state, prev) => {
         const { value: value2, setValue } = propsRef.current;
-        if (value2 !== void 0) {
-          store.setState(key, value2);
-        }
-        if (setValue && state[key] !== prev[key] && state[key] !== value2) {
-          setValue(state[key]);
-        }
+        if (!setValue)
+          return;
+        if (state[key] === prev[key])
+          return;
+        if (state[key] === value2)
+          return;
+        setValue(state[key]);
       },
       [key]
     );
   }, [store, key]);
+  useSafeLayoutEffect(() => {
+    return store.sync(() => {
+      const { value: value2 } = propsRef.current;
+      if (value2 === void 0)
+        return;
+      store.setState(key, value2);
+    }, [key]);
+  }, [store, key]);
   useUpdateLayoutEffect(() => {
     if (value === void 0)
       return;
@@ -65,7 +78,7 @@ function useStore(createStore) {
     (keyOrSelector) => useStoreState(store, keyOrSelector),
     [store]
   );
-  return useMemo(() => ({ ...store, useState }), [store, useState]);
+  return useMemo(() => __spreadProps(__spreadValues({}, store), { useState }), [store, useState]);
 }
 
 export {

package/esm/__chunks/{KO6UUYKG.js → AWLCMCCK.js}

@@ -1,15 +1,19 @@
 import {
   useGroup
-} from "./SG5D3YRB.js";
+} from "./ECY3BFPU.js";
 import {
   createComponent,
   createElement,
   createHook
-} from "./JE5NWDDX.js";
+} from "./5ETIGB6O.js";
+import {
+  __objRest
+} from "./4BKCJXBM.js";
 
 // src/form/form-group.ts
 var useFormGroup = createHook(
-  ({ store, ...props }) => {
+  (_a) => {
+    var _b = _a, { store } = _b, props = __objRest(_b, ["store"]);
     props = useGroup(props);
     return props;
   }