@ariakit/react-core 0.1.7 → 0.1.8

package/esm/__chunks/{TCX5FQUL.js → EMZ4NQG4.js}

@@ -1,6 +1,12 @@
 import {
   DialogBackdrop
-} from "./JXNLCNWG.js";
+} from "./ZFMAA4DD.js";
+import {
+  disableTreeOutside
+} from "./4H6H5RRM.js";
+import {
+  disableAccessibilityTreeOutside
+} from "./7A3SODQV.js";
 import {
   usePreventBodyScroll
 } from "./RBUEJWRA.js";
@@ -16,12 +22,6 @@ import {
 import {
   markTreeOutside
 } from "./BH4YAZB2.js";
-import {
-  disableTreeOutside
-} from "./4H6H5RRM.js";
-import {
-  disableAccessibilityTreeOutside
-} from "./7A3SODQV.js";
 import {
   useFocusableContainer
 } from "./6WVG5KFF.js";
@@ -84,20 +84,12 @@ import { chain } from "@ariakit/core/utils/misc";
 import { isSafari } from "@ariakit/core/utils/platform";
 import { jsx } from "react/jsx-runtime";
 var isSafariBrowser = isSafari();
-function isBackdrop(dialog, element) {
-  const id = dialog.id;
-  if (!id)
-    return;
-  return element.getAttribute("data-backdrop") === id;
-}
 function isAlreadyFocusingAnotherElement(dialog) {
   const activeElement = getActiveElement();
   if (!activeElement)
     return false;
   if (contains(dialog, activeElement))
     return false;
-  if (isBackdrop(dialog, activeElement))
-    return false;
   if (activeElement.hasAttribute("data-dialog"))
     return false;
   if (isFocusable(activeElement))
@@ -164,7 +156,7 @@ var useDialog = createHook(
     useHideOnInteractOutside(store, hideOnInteractOutside);
     const { wrapElement, nestedDialogs } = useNestedDialogs(store);
     props = useWrapElement(props, wrapElement, [wrapElement]);
-    useEffect(() => {
+    useSafeLayoutEffect(() => {
       if (!open)
         return;
       const dialog = ref.current;
@@ -285,7 +277,8 @@ var useDialog = createHook(
       // receives focus.
       getFirstTabbableIn(contentElement, true, portal && preserveTabOrder) || // Finally, we fallback to the dialog element itself.
       contentElement;
-      if (!autoFocusOnShowProp(element))
+      const isElementFocusable = isFocusable(element);
+      if (!autoFocusOnShowProp(isElementFocusable ? element : null))
         return;
       setAutoFocusEnabled(true);
       element.focus();
@@ -321,9 +314,7 @@ var useDialog = createHook(
           return;
         const { disclosureElement } = store.getState();
         let element = getElementFromProp(finalFocus) || disclosureElement;
-        if (!element)
-          return;
-        if (element.id) {
+        if (element == null ? void 0 : element.id) {
           const doc = getDocument(element);
           const selector = `[aria-activedescendant="${element.id}"]`;
           const composite = doc.querySelector(selector);
@@ -331,7 +322,7 @@ var useDialog = createHook(
             element = composite;
           }
         }
-        if (!isFocusable(element)) {
+        if (element && !isFocusable(element)) {
           const maybeParentDialog = closest(element, "[data-dialog]");
           if (maybeParentDialog && maybeParentDialog.id) {
             const doc = getDocument(maybeParentDialog);
@@ -342,15 +333,16 @@ var useDialog = createHook(
             }
           }
         }
-        if (!isFocusable(element)) {
-          if (!retry)
-            return;
+        const isElementFocusable = element && isFocusable(element);
+        if (!isElementFocusable && retry) {
           requestAnimationFrame(() => focusOnHide(false));
           return;
         }
-        if (!autoFocusOnHideProp(element))
+        if (!autoFocusOnHideProp(isElementFocusable ? element : null))
+          return;
+        if (!isElementFocusable)
           return;
-        element.focus();
+        element == null ? void 0 : element.focus();
       };
       if (!open) {
         return focusOnHide();
@@ -411,8 +403,6 @@ var useDialog = createHook(
               store,
               backdrop,
               backdropProps,
-              hideOnInteractOutside,
-              hideOnEscape,
               hidden: hiddenProp,
               children: element
             }
@@ -420,14 +410,7 @@ var useDialog = createHook(
         }
         return element;
       },
-      [
-        store,
-        backdrop,
-        backdropProps,
-        hideOnInteractOutside,
-        hideOnEscape,
-        hiddenProp
-      ]
+      [store, backdrop, backdropProps, hiddenProp]
     );
     const [headingId, setHeadingId] = useState();
     const [descriptionId, setDescriptionId] = useState();

package/esm/__chunks/{RVIGSXKO.js → JJHXFKMC.js}

@@ -1,6 +1,6 @@
 import {
   useDialog
-} from "./TCX5FQUL.js";
+} from "./EMZ4NQG4.js";
 import {
   PopoverContext
 } from "./6GS36SYX.js";

package/esm/__chunks/{JXNLCNWG.js → ZFMAA4DD.js}

@@ -1,12 +1,10 @@
 import {
-  usePreviousMouseDownRef
-} from "./7JNF6I52.js";
+  markAncestor
+} from "./BH4YAZB2.js";
 import {
   useDisclosureContent
 } from "./6AJCHLAV.js";
 import {
-  useBooleanEvent,
-  useEvent,
   useForkRef,
   useSafeLayoutEffect
 } from "./ASYR66PQ.js";
@@ -17,15 +15,12 @@ import {
 
 // src/dialog/dialog-backdrop.tsx
 import { useMemo, useRef } from "react";
-import { isSelfTarget } from "@ariakit/core/utils/events";
 import { noop } from "@ariakit/core/utils/misc";
 import { jsx } from "react/jsx-runtime";
 function DialogBackdrop({
   store,
   backdrop,
   backdropProps,
-  hideOnInteractOutside = true,
-  hideOnEscape = true,
   hidden,
   children
 }) {
@@ -48,47 +43,22 @@ function DialogBackdrop({
       return;
     backdrop2.style.zIndex = getComputedStyle(dialog).zIndex;
   }, [contentElement]);
-  const onClickProp = backdropProps == null ? void 0 : backdropProps.onClick;
-  const hideOnInteractOutsideProp = useBooleanEvent(hideOnInteractOutside);
-  const mounted = store.useState("mounted");
-  const previousMouseDownRef = usePreviousMouseDownRef(mounted);
-  const onClick = useEvent((event) => {
-    onClickProp == null ? void 0 : onClickProp(event);
-    if (event.defaultPrevented)
-      return;
-    if (!isSelfTarget(event))
-      return;
-    if (previousMouseDownRef.current !== event.currentTarget)
-      return;
-    if (!hideOnInteractOutsideProp(event))
-      return;
-    event.stopPropagation();
-    store.hide();
-  });
-  const onKeyDownProp = backdropProps == null ? void 0 : backdropProps.onKeyDown;
-  const hideOnEscapeProp = useBooleanEvent(hideOnEscape);
-  const onKeyDown = useEvent((event) => {
-    onKeyDownProp == null ? void 0 : onKeyDownProp(event);
-    if (event.defaultPrevented)
-      return;
-    if (event.key !== "Escape")
-      return;
-    if (!isSelfTarget(event))
+  useSafeLayoutEffect(() => {
+    const id = contentElement == null ? void 0 : contentElement.id;
+    if (!id)
       return;
-    if (!hideOnEscapeProp(event))
+    const backdrop2 = ref.current;
+    if (!backdrop2)
       return;
-    store.hide();
-  });
+    return markAncestor(backdrop2, id);
+  }, [contentElement]);
   const props = useDisclosureContent(__spreadProps(__spreadValues({
     store,
     id: void 0,
     role: "presentation",
-    tabIndex: -1,
     hidden
   }, backdropProps), {
     ref: useForkRef(backdropProps == null ? void 0 : backdropProps.ref, ref),
-    onClick,
-    onKeyDown,
     style: __spreadValues({
       position: "fixed",
       top: 0,
@@ -98,7 +68,7 @@ function DialogBackdrop({
     }, backdropProps == null ? void 0 : backdropProps.style)
   }));
   const Component = typeof backdrop !== "boolean" ? backdrop || "div" : "div";
-  return /* @__PURE__ */ jsx(Component, __spreadProps(__spreadValues({}, props), { "data-backdrop": contentElement == null ? void 0 : contentElement.id, children }));
+  return /* @__PURE__ */ jsx(Component, __spreadProps(__spreadValues({}, props), { "data-backdrop": (contentElement == null ? void 0 : contentElement.id) || "", children }));
 }
 
 export {

package/esm/combobox/combobox-popover.js

@@ -4,17 +4,17 @@ import {
 import "../__chunks/5VGBBGF5.js";
 import {
   usePopover
-} from "../__chunks/RVIGSXKO.js";
-import "../__chunks/TCX5FQUL.js";
-import "../__chunks/JXNLCNWG.js";
+} from "../__chunks/JJHXFKMC.js";
+import "../__chunks/EMZ4NQG4.js";
+import "../__chunks/ZFMAA4DD.js";
+import "../__chunks/4H6H5RRM.js";
+import "../__chunks/7A3SODQV.js";
 import "../__chunks/RBUEJWRA.js";
 import "../__chunks/T3WBUAHU.js";
 import "../__chunks/KUXENZYT.js";
+import "../__chunks/KOVUJERF.js";
 import "../__chunks/62DFK33R.js";
 import "../__chunks/BH4YAZB2.js";
-import "../__chunks/4H6H5RRM.js";
-import "../__chunks/7A3SODQV.js";
-import "../__chunks/KOVUJERF.js";
 import "../__chunks/DJESYNLE.js";
 import "../__chunks/6WVG5KFF.js";
 import "../__chunks/ISPCL6N4.js";

package/esm/composite/composite-overflow.js

@@ -1,16 +1,16 @@
 import {
   usePopover
-} from "../__chunks/RVIGSXKO.js";
-import "../__chunks/TCX5FQUL.js";
-import "../__chunks/JXNLCNWG.js";
+} from "../__chunks/JJHXFKMC.js";
+import "../__chunks/EMZ4NQG4.js";
+import "../__chunks/ZFMAA4DD.js";
+import "../__chunks/4H6H5RRM.js";
+import "../__chunks/7A3SODQV.js";
 import "../__chunks/RBUEJWRA.js";
 import "../__chunks/T3WBUAHU.js";
 import "../__chunks/KUXENZYT.js";
+import "../__chunks/KOVUJERF.js";
 import "../__chunks/62DFK33R.js";
 import "../__chunks/BH4YAZB2.js";
-import "../__chunks/4H6H5RRM.js";
-import "../__chunks/7A3SODQV.js";
-import "../__chunks/KOVUJERF.js";
 import "../__chunks/DJESYNLE.js";
 import "../__chunks/6WVG5KFF.js";
 import "../__chunks/ISPCL6N4.js";

package/esm/dialog/dialog-backdrop.d.ts

@@ -1,7 +1,7 @@
 import type { ReactNode } from "react";
 import type { DialogProps } from "./dialog.js";
-type DialogBackdropProps = Pick<DialogProps, "store" | "backdrop" | "backdropProps" | "hideOnInteractOutside" | "hideOnEscape" | "hidden"> & {
+type DialogBackdropProps = Pick<DialogProps, "store" | "backdrop" | "backdropProps" | "hidden"> & {
     children?: ReactNode;
 };
-export declare function DialogBackdrop({ store, backdrop, backdropProps, hideOnInteractOutside, hideOnEscape, hidden, children, }: DialogBackdropProps): JSX.Element;
+export declare function DialogBackdrop({ store, backdrop, backdropProps, hidden, children, }: DialogBackdropProps): import("react/jsx-runtime").JSX.Element;
 export {};

package/esm/dialog/dialog-backdrop.js

@@ -1,7 +1,9 @@
 import {
   DialogBackdrop
-} from "../__chunks/JXNLCNWG.js";
-import "../__chunks/7JNF6I52.js";
+} from "../__chunks/ZFMAA4DD.js";
+import "../__chunks/BH4YAZB2.js";
+import "../__chunks/DJESYNLE.js";
+import "../__chunks/ISPCL6N4.js";
 import "../__chunks/6AJCHLAV.js";
 import "../__chunks/5ETIGB6O.js";
 import "../__chunks/ASYR66PQ.js";

package/esm/dialog/dialog.d.ts

@@ -96,7 +96,7 @@ export interface DialogOptions<T extends As = "div"> extends FocusableOptions<T>
      * a different element to receive focus.
      * @default true
      */
-    autoFocusOnShow?: BooleanOrCallback<HTMLElement>;
+    autoFocusOnShow?: BooleanOrCallback<HTMLElement | null>;
     /**
      * Determines whether an element outside of the dialog will be focused when
      * the dialog is hidden if another element hasn't been focused in the action
@@ -106,7 +106,7 @@ export interface DialogOptions<T extends As = "div"> extends FocusableOptions<T>
      * element to be focused.
      * @default true
      */
-    autoFocusOnHide?: BooleanOrCallback<HTMLElement>;
+    autoFocusOnHide?: BooleanOrCallback<HTMLElement | null>;
     /**
      * Specifies the element that will receive focus when the dialog is first
      * opened. It can be an `HTMLElement` or a `React.RefObject` with an

package/esm/dialog/dialog.js

@@ -1,16 +1,16 @@
 import {
   Dialog,
   useDialog
-} from "../__chunks/TCX5FQUL.js";
-import "../__chunks/JXNLCNWG.js";
+} from "../__chunks/EMZ4NQG4.js";
+import "../__chunks/ZFMAA4DD.js";
+import "../__chunks/4H6H5RRM.js";
+import "../__chunks/7A3SODQV.js";
 import "../__chunks/RBUEJWRA.js";
 import "../__chunks/T3WBUAHU.js";
 import "../__chunks/KUXENZYT.js";
+import "../__chunks/KOVUJERF.js";
 import "../__chunks/62DFK33R.js";
 import "../__chunks/BH4YAZB2.js";
-import "../__chunks/4H6H5RRM.js";
-import "../__chunks/7A3SODQV.js";
-import "../__chunks/KOVUJERF.js";
 import "../__chunks/DJESYNLE.js";
 import "../__chunks/6WVG5KFF.js";
 import "../__chunks/ISPCL6N4.js";

package/esm/dialog/utils/is-backdrop.d.ts

@@ -0,0 +1 @@
+export declare function isBackdrop(element?: Element | null, dialog?: HTMLElement | null): boolean;

package/esm/dialog/utils/is-backdrop.js

@@ -0,0 +1,21 @@
+import "../../__chunks/4BKCJXBM.js";
+
+// src/dialog/utils/is-backdrop.ts
+function isBackdrop(element, dialog) {
+  if (!element)
+    return false;
+  const backdrop = element.getAttribute("data-backdrop");
+  if (backdrop == null)
+    return false;
+  if (backdrop === "")
+    return true;
+  if (backdrop === "true")
+    return true;
+  const id = dialog == null ? void 0 : dialog.id;
+  if (!id)
+    return false;
+  return backdrop === id;
+}
+export {
+  isBackdrop
+};

package/esm/heading/heading-level.d.ts

@@ -14,7 +14,7 @@ import type { HeadingLevels } from "./utils.js";
  * </HeadingLevel>
  * ```
  */
-export declare function HeadingLevel({ level, children }: HeadingLevelProps): JSX.Element;
+export declare function HeadingLevel({ level, children }: HeadingLevelProps): import("react/jsx-runtime").JSX.Element;
 export type HeadingLevelProps = {
     /**
      * The heading level. By default, it'll increase the level by 1 based on the

package/esm/hovercard/hovercard.js

@@ -1,19 +1,19 @@
 import {
   Hovercard,
   useHovercard
-} from "../__chunks/3L2YBPR3.js";
+} from "../__chunks/CXDKC5CW.js";
 import "../__chunks/X7FKJQME.js";
-import "../__chunks/RVIGSXKO.js";
-import "../__chunks/TCX5FQUL.js";
-import "../__chunks/JXNLCNWG.js";
+import "../__chunks/JJHXFKMC.js";
+import "../__chunks/EMZ4NQG4.js";
+import "../__chunks/ZFMAA4DD.js";
+import "../__chunks/4H6H5RRM.js";
+import "../__chunks/7A3SODQV.js";
 import "../__chunks/RBUEJWRA.js";
 import "../__chunks/T3WBUAHU.js";
 import "../__chunks/KUXENZYT.js";
+import "../__chunks/KOVUJERF.js";
 import "../__chunks/62DFK33R.js";
 import "../__chunks/BH4YAZB2.js";
-import "../__chunks/4H6H5RRM.js";
-import "../__chunks/7A3SODQV.js";
-import "../__chunks/KOVUJERF.js";
 import "../__chunks/DJESYNLE.js";
 import "../__chunks/6WVG5KFF.js";
 import "../__chunks/ISPCL6N4.js";

package/esm/menu/menu.js

@@ -1,6 +1,6 @@
 import {
   useHovercard
-} from "../__chunks/3L2YBPR3.js";
+} from "../__chunks/CXDKC5CW.js";
 import "../__chunks/X7FKJQME.js";
 import {
   useMenuList
@@ -9,17 +9,17 @@ import {
   MenuBarContext,
   MenuContext
 } from "../__chunks/HVBRRKV4.js";
-import "../__chunks/RVIGSXKO.js";
-import "../__chunks/TCX5FQUL.js";
-import "../__chunks/JXNLCNWG.js";
+import "../__chunks/JJHXFKMC.js";
+import "../__chunks/EMZ4NQG4.js";
+import "../__chunks/ZFMAA4DD.js";
+import "../__chunks/4H6H5RRM.js";
+import "../__chunks/7A3SODQV.js";
 import "../__chunks/RBUEJWRA.js";
 import "../__chunks/T3WBUAHU.js";
 import "../__chunks/KUXENZYT.js";
+import "../__chunks/KOVUJERF.js";
 import "../__chunks/62DFK33R.js";
 import "../__chunks/BH4YAZB2.js";
-import "../__chunks/4H6H5RRM.js";
-import "../__chunks/7A3SODQV.js";
-import "../__chunks/KOVUJERF.js";
 import "../__chunks/DJESYNLE.js";
 import "../__chunks/6WVG5KFF.js";
 import "../__chunks/ISPCL6N4.js";

package/esm/popover/popover.js

@@ -1,17 +1,17 @@
 import {
   Popover,
   usePopover
-} from "../__chunks/RVIGSXKO.js";
-import "../__chunks/TCX5FQUL.js";
-import "../__chunks/JXNLCNWG.js";
+} from "../__chunks/JJHXFKMC.js";
+import "../__chunks/EMZ4NQG4.js";
+import "../__chunks/ZFMAA4DD.js";
+import "../__chunks/4H6H5RRM.js";
+import "../__chunks/7A3SODQV.js";
 import "../__chunks/RBUEJWRA.js";
 import "../__chunks/T3WBUAHU.js";
 import "../__chunks/KUXENZYT.js";
+import "../__chunks/KOVUJERF.js";
 import "../__chunks/62DFK33R.js";
 import "../__chunks/BH4YAZB2.js";
-import "../__chunks/4H6H5RRM.js";
-import "../__chunks/7A3SODQV.js";
-import "../__chunks/KOVUJERF.js";
 import "../__chunks/DJESYNLE.js";
 import "../__chunks/6WVG5KFF.js";
 import "../__chunks/ISPCL6N4.js";

package/esm/select/select-popover.js

@@ -1,16 +1,16 @@
 import {
   usePopover
-} from "../__chunks/RVIGSXKO.js";
-import "../__chunks/TCX5FQUL.js";
-import "../__chunks/JXNLCNWG.js";
+} from "../__chunks/JJHXFKMC.js";
+import "../__chunks/EMZ4NQG4.js";
+import "../__chunks/ZFMAA4DD.js";
+import "../__chunks/4H6H5RRM.js";
+import "../__chunks/7A3SODQV.js";
 import "../__chunks/RBUEJWRA.js";
 import "../__chunks/T3WBUAHU.js";
 import "../__chunks/KUXENZYT.js";
+import "../__chunks/KOVUJERF.js";
 import "../__chunks/62DFK33R.js";
 import "../__chunks/BH4YAZB2.js";
-import "../__chunks/4H6H5RRM.js";
-import "../__chunks/7A3SODQV.js";
-import "../__chunks/KOVUJERF.js";
 import "../__chunks/DJESYNLE.js";
 import "../__chunks/6WVG5KFF.js";
 import "../__chunks/ISPCL6N4.js";