@ariakit/react-components 0.1.1 → 0.1.2

package/dist/composite/composite.js.map

@@ -1 +1 @@
-{"version":3,"file":"composite.js","names":[],"sources":["../../src/composite/composite.tsx"],"sourcesContent":["import { useStoreState } from \"@ariakit/react-store\";\nimport {\n  useBooleanEvent,\n  useEvent,\n  useMergeRefs,\n  useSafeLayoutEffect,\n  useTransactionState,\n  useWrapElement,\n  createElement,\n  createHook,\n  forwardRef,\n} from \"@ariakit/react-utils\";\nimport type { Props } from \"@ariakit/react-utils\";\nimport {\n  flatten2DArray,\n  reverseArray,\n  getActiveElement,\n  isTextField,\n  fireBlurEvent,\n  fireKeyboardEvent,\n  isSelfTarget,\n  focusIntoView,\n  hasFocus,\n  invariant,\n} from \"@ariakit/utils\";\nimport type { BooleanOrCallback } from \"@ariakit/utils\";\nimport type {\n  ElementType,\n  FocusEvent,\n  KeyboardEventHandler,\n  KeyboardEvent as ReactKeyboardEvent,\n  RefObject,\n} from \"react\";\nimport { useCallback, useEffect, useRef, useState } from \"react\";\nimport type { FocusableOptions } from \"../focusable/focusable.tsx\";\nimport { useFocusable } from \"../focusable/focusable.tsx\";\nimport {\n  CompositeContextProvider,\n  useCompositeProviderContext,\n} from \"./composite-context.tsx\";\nimport type { CompositeStore, CompositeStoreItem } from \"./composite-store.ts\";\nimport {\n  findFirstEnabledItem,\n  getEnabledItem,\n  groupItemsByRows,\n  isItem,\n  silentlyFocused,\n} from \"./utils.ts\";\n\nconst TagName = \"div\" satisfies ElementType;\ntype TagName = typeof TagName;\ntype HTMLType = HTMLElementTagNameMap[TagName];\n\nfunction isGrid(items: CompositeStoreItem[]) {\n  return items.some((item) => !!item.rowId);\n}\n\nfunction isPrintableKey(event: KeyboardEvent | ReactKeyboardEvent): boolean {\n  const target = event.target as Element | null;\n  if (target && !isTextField(target)) return false;\n  return event.key.length === 1 && !event.ctrlKey && !event.metaKey;\n}\n\nfunction isModifierKey(event: KeyboardEvent | ReactKeyboardEvent) {\n  return (\n    event.key === \"Shift\" ||\n    event.key === \"Control\" ||\n    event.key === \"Alt\" ||\n    event.key === \"Meta\"\n  );\n}\n\nfunction useKeyboardEventProxy(\n  store: CompositeStore,\n  onKeyboardEvent?: KeyboardEventHandler,\n  previousElementRef?: RefObject<HTMLElement | null>,\n) {\n  return useEvent((event: ReactKeyboardEvent) => {\n    onKeyboardEvent?.(event);\n    if (event.defaultPrevented) return;\n    if (event.isPropagationStopped()) return;\n    if (!isSelfTarget(event)) return;\n    if (isModifierKey(event)) return;\n    if (isPrintableKey(event)) return;\n    const state = store.getState();\n    const activeElement = getEnabledItem(store, state.activeId)?.element;\n    if (!activeElement) return;\n    const { view, ...eventInit } = event;\n    const previousElement = previousElementRef?.current;\n    // If the active item element is not the previous element, this means that\n    // it hasn't been focused (for example, when using composite hover). So we\n    // focus on it before firing the keyboard event.\n    if (activeElement !== previousElement) {\n      activeElement.focus();\n    }\n    if (!fireKeyboardEvent(activeElement, event.type, eventInit)) {\n      event.preventDefault();\n    }\n    // The event will be triggered on the composite item and then propagated up\n    // to this composite element again, so we can pretend that it wasn't called\n    // on this component in the first place.\n    if (event.currentTarget.contains(activeElement)) {\n      event.stopPropagation();\n    }\n  });\n}\n\nfunction findFirstEnabledItemInTheLastRow(items: CompositeStoreItem[]) {\n  return findFirstEnabledItem(\n    flatten2DArray(reverseArray(groupItemsByRows(items))),\n  );\n}\n\n// When virtual focus briefly moves DOM focus from a text input to an\n// item and back, browsers reset the input's internal scroll position\n// (e.g., scrollLeft). This helper preserves and restores scroll across\n// such focus transitions. Only applies to text field base elements to\n// avoid undoing intentional scrollIntoView on scrollable containers.\nfunction withBaseScrollPreserved(store: CompositeStore, callback: () => void) {\n  const { virtualFocus, baseElement } = store.getState();\n  if (!virtualFocus || !baseElement || !isTextField(baseElement)) {\n    callback();\n    return;\n  }\n  const savedScrollLeft = baseElement.scrollLeft;\n  const savedScrollTop = baseElement.scrollTop;\n  callback();\n  baseElement.scrollLeft = savedScrollLeft;\n  baseElement.scrollTop = savedScrollTop;\n}\n\nfunction useScheduleFocus(store: CompositeStore) {\n  const [scheduled, setScheduled] = useState(false);\n  const schedule = useCallback(() => setScheduled(true), []);\n  const activeItem = useStoreState(store, (state) =>\n    getEnabledItem(store, state.activeId),\n  );\n  useEffect(() => {\n    const activeElement = activeItem?.element;\n    if (!scheduled) return;\n    if (!activeElement) return;\n    setScheduled(false);\n    withBaseScrollPreserved(store, () => {\n      activeElement.focus({ preventScroll: true });\n    });\n  }, [store, activeItem, scheduled]);\n  return schedule;\n}\n\n/**\n * Returns props to create a `Composite` component.\n * @see https://ariakit.com/components/composite\n * @example\n * ```jsx\n * const store = useCompositeStore();\n * const props = useComposite({ store });\n * <Role {...props}>\n *   <CompositeItem>Item 1</CompositeItem>\n *   <CompositeItem>Item 2</CompositeItem>\n * </Role>\n * ```\n */\nexport const useComposite = createHook<TagName, CompositeOptions>(\n  function useComposite({\n    store,\n    composite = true,\n    focusOnMove = composite,\n    moveOnKeyPress = true,\n    ...props\n  }) {\n    const context = useCompositeProviderContext();\n    store = store || context;\n\n    invariant(\n      store,\n      process.env.NODE_ENV !== \"production\" &&\n        \"Composite must receive a `store` prop or be wrapped in a CompositeProvider component.\",\n    );\n\n    const ref = useRef<HTMLType>(null);\n    const previousElementRef = useRef<HTMLElement | null>(null);\n    const scheduleFocus = useScheduleFocus(store);\n    const moves = useStoreState(store, \"moves\");\n\n    const [, setBaseElement] = useTransactionState(\n      composite ? store.setBaseElement : null,\n    );\n\n    // Focus on the active item element.\n    useEffect(() => {\n      if (!store) return;\n      if (!moves) return;\n      if (!composite) return;\n      if (!focusOnMove) return;\n      const { activeId } = store.getState();\n      const itemElement = getEnabledItem(store, activeId)?.element;\n      if (!itemElement) return;\n      withBaseScrollPreserved(store, () => focusIntoView(itemElement));\n    }, [store, moves, composite, focusOnMove]);\n\n    // If composite.move(null) has been called, the composite container (this\n    // element) should receive focus.\n    useSafeLayoutEffect(() => {\n      if (!store) return;\n      if (!moves) return;\n      if (!composite) return;\n      const { baseElement, activeId } = store.getState();\n      const isSelfAcive = activeId === null;\n      if (!isSelfAcive) return;\n      if (!baseElement) return;\n      const previousElement = previousElementRef.current;\n      // We have to clean up the previous element ref so an additional blur\n      // event is not fired on it, for example, when looping through items while\n      // includesBaseElement is true.\n      previousElementRef.current = null;\n      if (previousElement) {\n        // We fire a blur event on the previous active item before moving focus\n        // to the composite element so the events are dispatched in the right\n        // order (blur, then focus).\n        fireBlurEvent(previousElement, { relatedTarget: baseElement });\n      }\n      if (!hasFocus(baseElement)) {\n        baseElement.focus();\n      }\n    }, [store, moves, composite]);\n\n    const activeId = useStoreState(store, \"activeId\");\n    const virtualFocus = useStoreState(store, \"virtualFocus\");\n\n    // At this point, if the activeId has changed and we still have a\n    // previousElement, this means that the previousElement hasn't been blurred,\n    // so we do it here. This will be the scenario when moving through items, in\n    // which case the onFocusCapture below event will stop propagation.\n    useSafeLayoutEffect(() => {\n      if (!store) return;\n      if (!composite) return;\n      if (!virtualFocus) return;\n      const previousElement = previousElementRef.current;\n      previousElementRef.current = null;\n      if (!previousElement) return;\n      const activeElement = getEnabledItem(store, activeId)?.element;\n      const relatedTarget = activeElement || getActiveElement(previousElement);\n      if (relatedTarget === previousElement) return;\n      fireBlurEvent(previousElement, { relatedTarget });\n    }, [store, activeId, virtualFocus, composite]);\n\n    const onKeyDownCapture = useKeyboardEventProxy(\n      store,\n      props.onKeyDownCapture,\n      previousElementRef,\n    );\n\n    const onKeyUpCapture = useKeyboardEventProxy(\n      store,\n      props.onKeyUpCapture,\n      previousElementRef,\n    );\n\n    const onFocusCaptureProp = props.onFocusCapture;\n\n    const onFocusCapture = useEvent((event: FocusEvent<HTMLType>) => {\n      onFocusCaptureProp?.(event);\n      if (event.defaultPrevented) return;\n      if (!store) return;\n      const { virtualFocus } = store.getState();\n      if (!virtualFocus) return;\n      const previousActiveElement = event.relatedTarget as HTMLElement | null;\n      const isSilentlyFocused = silentlyFocused(event.currentTarget);\n      if (isSelfTarget(event) && isSilentlyFocused) {\n        // Composite has been focused as a result of an item receiving focus.\n        // The composite item will move focus back to the composite container.\n        // In this case, we don't want to propagate this additional event nor\n        // call the onFocus handler passed to <Composite onFocus={...} />.\n        event.stopPropagation();\n        // We keep track of the previous active item element so we can manually\n        // fire a blur event on it later when the focus is moved to another item\n        // on the onBlurCapture event below.\n        previousElementRef.current = previousActiveElement;\n      }\n    });\n\n    const onFocusProp = props.onFocus;\n\n    const onFocus = useEvent((event: FocusEvent<HTMLType>) => {\n      onFocusProp?.(event);\n      if (event.defaultPrevented) return;\n      if (!composite) return;\n      if (!store) return;\n      const { relatedTarget } = event;\n      const { virtualFocus } = store.getState();\n      if (virtualFocus) {\n        // This means that the composite element has been focused while the\n        // composite item has not. For example, by clicking on the composite\n        // element without touching any item, or by tabbing into the composite\n        // element. In this case, we want to trigger focus on the item, just\n        // like it would happen with roving tabindex. When it receives focus,\n        // the composite item will move focus back to the composite element.\n        if (isSelfTarget(event) && !isItem(store, relatedTarget)) {\n          // By queueing a microtask, we ensure the scheduleFocus effect will be\n          // triggered after all the other effects that might have changed the\n          // active item. This also accounts for when the composite container is\n          // focused right after it gets mounted (for example, in a dialog), in\n          // which case state.items will not be populated yet.\n          queueMicrotask(scheduleFocus);\n        }\n      } else if (isSelfTarget(event)) {\n        // When the roving tabindex composite gets intentionally focused (for\n        // example, by clicking directly on it, and not on an item), we make\n        // sure to set the activeId to null (which means the composite element\n        // itself has focus).\n        store.setActiveId(null);\n      }\n    });\n\n    const onBlurCaptureProp = props.onBlurCapture;\n\n    const onBlurCapture = useEvent((event: FocusEvent<HTMLType>) => {\n      onBlurCaptureProp?.(event);\n      if (event.defaultPrevented) return;\n      if (!store) return;\n      const { virtualFocus, activeId } = store.getState();\n      if (!virtualFocus) return;\n      // When virtualFocus is set to true, we move focus from the composite\n      // container (this element) to the composite item that is being selected.\n      // Then we move focus back to the composite container. This is so we can\n      // provide the same API as the roving tabindex method, which means people\n      // can attach onFocus/onBlur handlers on the CompositeItem component\n      // regardless of whether virtualFocus is set to true or false. This\n      // sequence of blurring and focusing on items and on the composite element\n      // may be confusing, so we ignore intermediate focus and blur events by\n      // stopping their propagation.\n      const activeElement = getEnabledItem(store, activeId)?.element;\n      const nextActiveElement = event.relatedTarget;\n      const nextActiveElementIsItem = isItem(store, nextActiveElement);\n      const previousElement = previousElementRef.current;\n      previousElementRef.current = null;\n      // This is an intermediate blur event: blurring the composite container\n      // to focus on an item (nextActiveElement).\n      if (isSelfTarget(event) && nextActiveElementIsItem) {\n        // The next active element will be the same as the active item in the\n        // store in these two scenarios:\n        // - Moving focus with keyboard: the state is updated before the blur\n        //   event is triggered, so here the active item is already pointing to\n        //   the next active element.\n        // - Clicking on the active item with a pointer: this will trigger blur\n        //   on the composite element and then the next active element will be\n        //   the same as the active item. Clicking on an item other than the\n        //   active one doesn't end up here as the activeItem state will be\n        //   updated only after that.\n        if (nextActiveElement === activeElement) {\n          // If there's a previous active item and it's not a click action, then\n          // we fire a blur event on it so it will work just like if it had DOM\n          // focus before (like when using roving tabindex).\n          if (previousElement && previousElement !== nextActiveElement) {\n            fireBlurEvent(previousElement, event);\n          }\n        }\n\n        // This will be true when the next active element is not the active\n        // element, but there's an active item. This will only happen when\n        // clicking with a pointer on a different item, when there's already an\n        // item selected, in which case activeElement is the item that is\n        // getting blurred, and nextActiveElement is the item that is being\n        // clicked.\n        else if (activeElement) {\n          fireBlurEvent(activeElement, event);\n        }\n\n        // Finally, if we still have a previousElement, this means that the\n        // store is being composed with another composite store and we're moving\n        // with keyboard. In this case, the state won't be updated before the\n        // blur event. TODO: Test this.\n        else if (previousElement) {\n          fireBlurEvent(previousElement, event);\n        }\n        // We want to ignore intermediate blur events, so we stop the\n        // propagation of this event.\n        event.stopPropagation();\n      } else {\n        const targetIsItem = isItem(store, event.target);\n        // If target is not a composite item, it may be the composite element\n        // itself (isSelfTarget) or a tabbable element inside the composite\n        // element. This may be triggered by clicking outside of the composite\n        // element or by tabbing out of it. In either cases, we want to fire a\n        // blur event on the active item.\n        if (!targetIsItem && activeElement) {\n          fireBlurEvent(activeElement, event);\n        }\n      }\n    });\n\n    const onKeyDownProp = props.onKeyDown;\n    const moveOnKeyPressProp = useBooleanEvent(moveOnKeyPress);\n\n    const onKeyDown = useEvent((event: ReactKeyboardEvent<HTMLType>) => {\n      onKeyDownProp?.(event);\n      // https://github.com/ariakit/ariakit/issues/4388\n      if (event.nativeEvent.isComposing) return;\n      if (event.defaultPrevented) return;\n      if (!store) return;\n      if (!isSelfTarget(event)) return;\n      const { orientation, renderedItems, activeId } = store.getState();\n      const activeItem = getEnabledItem(store, activeId);\n      if (activeItem?.element?.isConnected) return;\n      const isVertical = orientation !== \"horizontal\";\n      const isHorizontal = orientation !== \"vertical\";\n      const grid = isGrid(renderedItems);\n      // If the event is coming from a text field and no item is selected,\n      // horizontal keys should perform their default action on the text field\n      // instead of moving focus to an item.\n      const isHorizontalKey =\n        event.key === \"ArrowLeft\" ||\n        event.key === \"ArrowRight\" ||\n        event.key === \"Home\" ||\n        event.key === \"End\";\n      if (isHorizontalKey && isTextField(event.currentTarget)) return;\n      const up = () => {\n        if (grid) {\n          const item = findFirstEnabledItemInTheLastRow(renderedItems);\n          return item?.id;\n        }\n        return store?.last();\n      };\n      const keyMap = {\n        ArrowUp: (grid || isVertical) && up,\n        ArrowRight: (grid || isHorizontal) && store.first,\n        ArrowDown: (grid || isVertical) && store.first,\n        ArrowLeft: (grid || isHorizontal) && store.last,\n        Home: store.first,\n        End: store.last,\n        PageUp: store.first,\n        PageDown: store.last,\n      };\n      const action = keyMap[event.key as keyof typeof keyMap];\n      if (action) {\n        const id = action();\n        if (id !== undefined) {\n          if (!moveOnKeyPressProp(event)) return;\n          event.preventDefault();\n          store.move(id);\n        }\n      }\n    });\n\n    props = useWrapElement(\n      props,\n      (element) => (\n        <CompositeContextProvider value={store}>\n          {element}\n        </CompositeContextProvider>\n      ),\n      [store],\n    );\n\n    const activeDescendant = useStoreState(store, (state) => {\n      if (!store) return;\n      if (!composite) return;\n      if (!state.virtualFocus) return;\n      return getEnabledItem(store, state.activeId)?.id;\n    });\n\n    props = {\n      \"aria-activedescendant\": activeDescendant,\n      ...props,\n      ref: useMergeRefs(ref, setBaseElement, props.ref),\n      onKeyDownCapture,\n      onKeyUpCapture,\n      onFocusCapture,\n      onFocus,\n      onBlurCapture,\n      onKeyDown,\n    };\n\n    const focusable = useStoreState(\n      store,\n      (state) => composite && (state.virtualFocus || state.activeId === null),\n    );\n\n    props = useFocusable({ focusable, ...props });\n\n    return props;\n  },\n);\n\n/**\n * Renders a composite widget.\n * @see https://ariakit.com/components/composite\n * @example\n * ```jsx\n * const composite = useCompositeStore();\n * <Composite store={composite}>\n *   <CompositeItem>Item 1</CompositeItem>\n *   <CompositeItem>Item 2</CompositeItem>\n * </Composite>\n * ```\n */\nexport const Composite = forwardRef(function Composite(props: CompositeProps) {\n  const htmlProps = useComposite(props);\n  return createElement(TagName, htmlProps);\n});\n\nexport interface CompositeOptions<\n  T extends ElementType = TagName,\n> extends FocusableOptions<T> {\n  /**\n   * Object returned by the\n   * [`useCompositeStore`](https://ariakit.com/reference/use-composite-store)\n   * hook. If not provided, the closest\n   * [`CompositeProvider`](https://ariakit.com/reference/composite-provider)\n   * component's context will be used.\n   */\n  store?: CompositeStore;\n  /**\n   * Determines if the component should act as a composite widget. This prop\n   * needs to be set to `false` when merging various composite widgets where\n   * only one should function in that manner.\n   *\n   * If disabled, this component will stop managing focus and keyboard\n   * navigation for its items and itself. Additionally, composite ARIA\n   * attributes won't be applied. These responsibilities should be taken over by\n   * another composite component.\n   *\n   * **Note**: In most cases, this prop doesn't need to be set manually. For\n   * example, when composing [Menu with\n   * Combobox](https://ariakit.com/examples/menu-combobox) or [Select with\n   * Combobox](https://ariakit.com/examples/select-combobox), this prop will be\n   * set to `false` automatically on the\n   * [`Menu`](https://ariakit.com/reference/menu) and\n   * [`SelectPopover`](https://ariakit.com/reference/select-popover) components\n   * so the [`Combobox`](https://ariakit.com/reference/combobox) component can\n   * take over the composite widget responsibilities.\n   *\n   * Live examples:\n   * - [Menu with Combobox](https://ariakit.com/examples/menu-combobox)\n   * - [Select with Combobox](https://ariakit.com/examples/select-combobox)\n   * @default true\n   */\n  composite?: boolean;\n  /**\n   * Determines whether the composite widget should move focus to an item when\n   * arrow keys are pressed, given that the composite element is focused and\n   * there's no active item.\n   *\n   * **Note**: To entirely disable focus moving within a composite widget, you\n   * can use the\n   * [`focusOnMove`](https://ariakit.com/reference/composite#focusonmove) prop\n   * instead. If you want to control the behavior _only when arrow keys are\n   * pressed_, where\n   * [`focusOnMove`](https://ariakit.com/reference/composite#focusonmove) may\n   * not be applicable, this prop must be set on composite items as well.\n   * @default true\n   * @example\n   * ```jsx\n   * <Composite moveOnKeyPress={false}>\n   *   <CompositeItem moveOnKeyPress={false} />\n   *   <CompositeItem moveOnKeyPress={false} />\n   * </Composite>\n   * ```\n   */\n  moveOnKeyPress?: BooleanOrCallback<ReactKeyboardEvent<HTMLElement>>;\n  /**\n   * Determines if the active composite item should receive focus (or virtual\n   * focus if the\n   * [`virtualFocus`](https://ariakit.com/reference/composite-provider#virtualfocus)\n   * option is enabled) when moving through items. This typically happens when\n   * navigating through items with arrow keys, but it can also happen when\n   * calling the\n   * [`move`](https://ariakit.com/reference/use-composite-store#move) method\n   * directly.\n   *\n   * Unlike the\n   * [`composite`](https://ariakit.com/reference/composite#composite-1) prop,\n   * this option doesn't disable the entire composite widget behavior. It only\n   * stops this component from managing focus when navigating through items.\n   *\n   * **Note**: If you want to control the behavior only _when arrow keys are\n   * pressed_, use the\n   * [`moveOnKeyPress`](https://ariakit.com/reference/composite#moveonkeypress)\n   * prop instead.\n   * @default true\n   */\n  focusOnMove?: boolean;\n  /**\n   * @see https://ariakit.com/reference/focusable\n   */\n  focusable?: FocusableOptions<T>[\"focusable\"];\n}\n\nexport type CompositeProps<T extends ElementType = TagName> = Props<\n  T,\n  CompositeOptions<T>\n>;\n"],"mappings":"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"}
+{"version":3,"file":"composite.js","names":[],"sources":["../../src/composite/composite.tsx"],"sourcesContent":["import { useStoreState } from \"@ariakit/react-store\";\nimport {\n  useBooleanEvent,\n  useEvent,\n  useMergeRefs,\n  useSafeLayoutEffect,\n  useTransactionState,\n  useWrapElement,\n  createElement,\n  createHook,\n  forwardRef,\n} from \"@ariakit/react-utils\";\nimport type { Props } from \"@ariakit/react-utils\";\nimport {\n  flatten2DArray,\n  reverseArray,\n  getActiveElement,\n  isTextField,\n  fireBlurEvent,\n  fireKeyboardEvent,\n  isSelfTarget,\n  focusIntoView,\n  hasFocus,\n  invariant,\n} from \"@ariakit/utils\";\nimport type { BooleanOrCallback } from \"@ariakit/utils\";\nimport type {\n  ElementType,\n  FocusEvent,\n  KeyboardEventHandler,\n  KeyboardEvent as ReactKeyboardEvent,\n  RefObject,\n} from \"react\";\nimport { useCallback, useEffect, useRef, useState } from \"react\";\nimport type { FocusableOptions } from \"../focusable/focusable.tsx\";\nimport { useFocusable } from \"../focusable/focusable.tsx\";\nimport {\n  CompositeScopedContextProvider,\n  useCompositeProviderContext,\n} from \"./composite-context.tsx\";\nimport type { CompositeStore, CompositeStoreItem } from \"./composite-store.ts\";\nimport {\n  findFirstEnabledItem,\n  getEnabledItem,\n  groupItemsByRows,\n  isItem,\n  silentlyFocused,\n} from \"./utils.ts\";\n\nconst TagName = \"div\" satisfies ElementType;\ntype TagName = typeof TagName;\ntype HTMLType = HTMLElementTagNameMap[TagName];\n\nfunction isGrid(items: CompositeStoreItem[]) {\n  return items.some((item) => !!item.rowId);\n}\n\nfunction isPrintableKey(event: KeyboardEvent | ReactKeyboardEvent): boolean {\n  const target = event.target as Element | null;\n  if (target && !isTextField(target)) return false;\n  return event.key.length === 1 && !event.ctrlKey && !event.metaKey;\n}\n\nfunction isModifierKey(event: KeyboardEvent | ReactKeyboardEvent) {\n  return (\n    event.key === \"Shift\" ||\n    event.key === \"Control\" ||\n    event.key === \"Alt\" ||\n    event.key === \"Meta\"\n  );\n}\n\nfunction useKeyboardEventProxy(\n  store: CompositeStore,\n  onKeyboardEvent?: KeyboardEventHandler,\n  previousElementRef?: RefObject<HTMLElement | null>,\n) {\n  return useEvent((event: ReactKeyboardEvent) => {\n    onKeyboardEvent?.(event);\n    if (event.defaultPrevented) return;\n    if (event.isPropagationStopped()) return;\n    if (!isSelfTarget(event)) return;\n    if (isModifierKey(event)) return;\n    if (isPrintableKey(event)) return;\n    const state = store.getState();\n    const activeElement = getEnabledItem(store, state.activeId)?.element;\n    if (!activeElement) return;\n    const { view, ...eventInit } = event;\n    const previousElement = previousElementRef?.current;\n    // If the active item element is not the previous element, this means that\n    // it hasn't been focused (for example, when using composite hover). So we\n    // focus on it before firing the keyboard event.\n    if (activeElement !== previousElement) {\n      activeElement.focus();\n    }\n    if (!fireKeyboardEvent(activeElement, event.type, eventInit)) {\n      event.preventDefault();\n    }\n    // The event will be triggered on the composite item and then propagated up\n    // to this composite element again, so we can pretend that it wasn't called\n    // on this component in the first place.\n    if (event.currentTarget.contains(activeElement)) {\n      event.stopPropagation();\n    }\n  });\n}\n\nfunction findFirstEnabledItemInTheLastRow(items: CompositeStoreItem[]) {\n  return findFirstEnabledItem(\n    flatten2DArray(reverseArray(groupItemsByRows(items))),\n  );\n}\n\n// When virtual focus briefly moves DOM focus from a text input to an\n// item and back, browsers reset the input's internal scroll position\n// (e.g., scrollLeft). This helper preserves and restores scroll across\n// such focus transitions. Only applies to text field base elements to\n// avoid undoing intentional scrollIntoView on scrollable containers.\nfunction withBaseScrollPreserved(store: CompositeStore, callback: () => void) {\n  const { virtualFocus, baseElement } = store.getState();\n  if (!virtualFocus || !baseElement || !isTextField(baseElement)) {\n    callback();\n    return;\n  }\n  const savedScrollLeft = baseElement.scrollLeft;\n  const savedScrollTop = baseElement.scrollTop;\n  callback();\n  baseElement.scrollLeft = savedScrollLeft;\n  baseElement.scrollTop = savedScrollTop;\n}\n\nfunction useScheduleFocus(store: CompositeStore) {\n  const [scheduled, setScheduled] = useState(false);\n  const schedule = useCallback(() => setScheduled(true), []);\n  const activeItem = useStoreState(store, (state) =>\n    getEnabledItem(store, state.activeId),\n  );\n  useEffect(() => {\n    const activeElement = activeItem?.element;\n    if (!scheduled) return;\n    if (!activeElement) return;\n    setScheduled(false);\n    withBaseScrollPreserved(store, () => {\n      activeElement.focus({ preventScroll: true });\n    });\n  }, [store, activeItem, scheduled]);\n  return schedule;\n}\n\n/**\n * Returns props to create a `Composite` component.\n * @see https://ariakit.com/components/composite\n * @example\n * ```jsx\n * const store = useCompositeStore();\n * const props = useComposite({ store });\n * <Role {...props}>\n *   <CompositeItem>Item 1</CompositeItem>\n *   <CompositeItem>Item 2</CompositeItem>\n * </Role>\n * ```\n */\nexport const useComposite = createHook<TagName, CompositeOptions>(\n  function useComposite({\n    store,\n    composite = true,\n    focusOnMove = composite,\n    moveOnKeyPress = true,\n    ...props\n  }) {\n    const context = useCompositeProviderContext();\n    store = store || context;\n\n    invariant(\n      store,\n      process.env.NODE_ENV !== \"production\" &&\n        \"Composite must receive a `store` prop or be wrapped in a CompositeProvider component.\",\n    );\n\n    const ref = useRef<HTMLType>(null);\n    const previousElementRef = useRef<HTMLElement | null>(null);\n    const scheduleFocus = useScheduleFocus(store);\n    const moves = useStoreState(store, \"moves\");\n\n    const [, setBaseElement] = useTransactionState(\n      composite ? store.setBaseElement : null,\n    );\n\n    // Focus on the active item element.\n    useEffect(() => {\n      if (!store) return;\n      if (!moves) return;\n      if (!composite) return;\n      if (!focusOnMove) return;\n      const { activeId } = store.getState();\n      const itemElement = getEnabledItem(store, activeId)?.element;\n      if (!itemElement) return;\n      withBaseScrollPreserved(store, () => focusIntoView(itemElement));\n    }, [store, moves, composite, focusOnMove]);\n\n    // If composite.move(null) has been called, the composite container (this\n    // element) should receive focus.\n    useSafeLayoutEffect(() => {\n      if (!store) return;\n      if (!moves) return;\n      if (!composite) return;\n      const { baseElement, activeId } = store.getState();\n      const isSelfAcive = activeId === null;\n      if (!isSelfAcive) return;\n      if (!baseElement) return;\n      const previousElement = previousElementRef.current;\n      // We have to clean up the previous element ref so an additional blur\n      // event is not fired on it, for example, when looping through items while\n      // includesBaseElement is true.\n      previousElementRef.current = null;\n      if (previousElement) {\n        // We fire a blur event on the previous active item before moving focus\n        // to the composite element so the events are dispatched in the right\n        // order (blur, then focus).\n        fireBlurEvent(previousElement, { relatedTarget: baseElement });\n      }\n      if (!hasFocus(baseElement)) {\n        baseElement.focus();\n      }\n    }, [store, moves, composite]);\n\n    const activeId = useStoreState(store, \"activeId\");\n    const virtualFocus = useStoreState(store, \"virtualFocus\");\n\n    // At this point, if the activeId has changed and we still have a\n    // previousElement, this means that the previousElement hasn't been blurred,\n    // so we do it here. This will be the scenario when moving through items, in\n    // which case the onFocusCapture below event will stop propagation.\n    useSafeLayoutEffect(() => {\n      if (!store) return;\n      if (!composite) return;\n      if (!virtualFocus) return;\n      const previousElement = previousElementRef.current;\n      previousElementRef.current = null;\n      if (!previousElement) return;\n      const activeElement = getEnabledItem(store, activeId)?.element;\n      const relatedTarget = activeElement || getActiveElement(previousElement);\n      if (relatedTarget === previousElement) return;\n      fireBlurEvent(previousElement, { relatedTarget });\n    }, [store, activeId, virtualFocus, composite]);\n\n    const onKeyDownCapture = useKeyboardEventProxy(\n      store,\n      props.onKeyDownCapture,\n      previousElementRef,\n    );\n\n    const onKeyUpCapture = useKeyboardEventProxy(\n      store,\n      props.onKeyUpCapture,\n      previousElementRef,\n    );\n\n    const onFocusCaptureProp = props.onFocusCapture;\n\n    const onFocusCapture = useEvent((event: FocusEvent<HTMLType>) => {\n      onFocusCaptureProp?.(event);\n      if (event.defaultPrevented) return;\n      if (!store) return;\n      const { virtualFocus } = store.getState();\n      if (!virtualFocus) return;\n      const previousActiveElement = event.relatedTarget as HTMLElement | null;\n      const isSilentlyFocused = silentlyFocused(event.currentTarget);\n      if (isSelfTarget(event) && isSilentlyFocused) {\n        // Composite has been focused as a result of an item receiving focus.\n        // The composite item will move focus back to the composite container.\n        // In this case, we don't want to propagate this additional event nor\n        // call the onFocus handler passed to <Composite onFocus={...} />.\n        event.stopPropagation();\n        // We keep track of the previous active item element so we can manually\n        // fire a blur event on it later when the focus is moved to another item\n        // on the onBlurCapture event below.\n        previousElementRef.current = previousActiveElement;\n      }\n    });\n\n    const onFocusProp = props.onFocus;\n\n    const onFocus = useEvent((event: FocusEvent<HTMLType>) => {\n      onFocusProp?.(event);\n      if (event.defaultPrevented) return;\n      if (!composite) return;\n      if (!store) return;\n      const { relatedTarget } = event;\n      const { virtualFocus } = store.getState();\n      if (virtualFocus) {\n        // This means that the composite element has been focused while the\n        // composite item has not. For example, by clicking on the composite\n        // element without touching any item, or by tabbing into the composite\n        // element. In this case, we want to trigger focus on the item, just\n        // like it would happen with roving tabindex. When it receives focus,\n        // the composite item will move focus back to the composite element.\n        if (isSelfTarget(event) && !isItem(store, relatedTarget)) {\n          // By queueing a microtask, we ensure the scheduleFocus effect will be\n          // triggered after all the other effects that might have changed the\n          // active item. This also accounts for when the composite container is\n          // focused right after it gets mounted (for example, in a dialog), in\n          // which case state.items will not be populated yet.\n          queueMicrotask(scheduleFocus);\n        }\n      } else if (isSelfTarget(event)) {\n        // When the roving tabindex composite gets intentionally focused (for\n        // example, by clicking directly on it, and not on an item), we make\n        // sure to set the activeId to null (which means the composite element\n        // itself has focus).\n        store.setActiveId(null);\n      }\n    });\n\n    const onBlurCaptureProp = props.onBlurCapture;\n\n    const onBlurCapture = useEvent((event: FocusEvent<HTMLType>) => {\n      onBlurCaptureProp?.(event);\n      if (event.defaultPrevented) return;\n      if (!store) return;\n      const { virtualFocus, activeId } = store.getState();\n      if (!virtualFocus) return;\n      // When virtualFocus is set to true, we move focus from the composite\n      // container (this element) to the composite item that is being selected.\n      // Then we move focus back to the composite container. This is so we can\n      // provide the same API as the roving tabindex method, which means people\n      // can attach onFocus/onBlur handlers on the CompositeItem component\n      // regardless of whether virtualFocus is set to true or false. This\n      // sequence of blurring and focusing on items and on the composite element\n      // may be confusing, so we ignore intermediate focus and blur events by\n      // stopping their propagation.\n      const activeElement = getEnabledItem(store, activeId)?.element;\n      const nextActiveElement = event.relatedTarget;\n      const nextActiveElementIsItem = isItem(store, nextActiveElement);\n      const previousElement = previousElementRef.current;\n      previousElementRef.current = null;\n      // This is an intermediate blur event: blurring the composite container\n      // to focus on an item (nextActiveElement).\n      if (isSelfTarget(event) && nextActiveElementIsItem) {\n        // The next active element will be the same as the active item in the\n        // store in these two scenarios:\n        // - Moving focus with keyboard: the state is updated before the blur\n        //   event is triggered, so here the active item is already pointing to\n        //   the next active element.\n        // - Clicking on the active item with a pointer: this will trigger blur\n        //   on the composite element and then the next active element will be\n        //   the same as the active item. Clicking on an item other than the\n        //   active one doesn't end up here as the activeItem state will be\n        //   updated only after that.\n        if (nextActiveElement === activeElement) {\n          // If there's a previous active item and it's not a click action, then\n          // we fire a blur event on it so it will work just like if it had DOM\n          // focus before (like when using roving tabindex).\n          if (previousElement && previousElement !== nextActiveElement) {\n            fireBlurEvent(previousElement, event);\n          }\n        }\n\n        // This will be true when the next active element is not the active\n        // element, but there's an active item. This will only happen when\n        // clicking with a pointer on a different item, when there's already an\n        // item selected, in which case activeElement is the item that is\n        // getting blurred, and nextActiveElement is the item that is being\n        // clicked.\n        else if (activeElement) {\n          fireBlurEvent(activeElement, event);\n        }\n\n        // Finally, if we still have a previousElement, this means that the\n        // store is being composed with another composite store and we're moving\n        // with keyboard. In this case, the state won't be updated before the\n        // blur event. TODO: Test this.\n        else if (previousElement) {\n          fireBlurEvent(previousElement, event);\n        }\n        // We want to ignore intermediate blur events, so we stop the\n        // propagation of this event.\n        event.stopPropagation();\n      } else {\n        const targetIsItem = isItem(store, event.target);\n        // If target is not a composite item, it may be the composite element\n        // itself (isSelfTarget) or a tabbable element inside the composite\n        // element. This may be triggered by clicking outside of the composite\n        // element or by tabbing out of it. In either cases, we want to fire a\n        // blur event on the active item.\n        if (!targetIsItem && activeElement) {\n          fireBlurEvent(activeElement, event);\n        }\n      }\n    });\n\n    const onKeyDownProp = props.onKeyDown;\n    const moveOnKeyPressProp = useBooleanEvent(moveOnKeyPress);\n\n    const onKeyDown = useEvent((event: ReactKeyboardEvent<HTMLType>) => {\n      onKeyDownProp?.(event);\n      // https://github.com/ariakit/ariakit/issues/4388\n      if (event.nativeEvent.isComposing) return;\n      if (event.defaultPrevented) return;\n      if (!store) return;\n      if (!isSelfTarget(event)) return;\n      const { orientation, renderedItems, activeId } = store.getState();\n      const activeItem = getEnabledItem(store, activeId);\n      if (activeItem?.element?.isConnected) return;\n      const isVertical = orientation !== \"horizontal\";\n      const isHorizontal = orientation !== \"vertical\";\n      const grid = isGrid(renderedItems);\n      // If the event is coming from a text field and no item is selected,\n      // horizontal keys should perform their default action on the text field\n      // instead of moving focus to an item.\n      const isHorizontalKey =\n        event.key === \"ArrowLeft\" ||\n        event.key === \"ArrowRight\" ||\n        event.key === \"Home\" ||\n        event.key === \"End\";\n      if (isHorizontalKey && isTextField(event.currentTarget)) return;\n      const up = () => {\n        if (grid) {\n          const item = findFirstEnabledItemInTheLastRow(renderedItems);\n          return item?.id;\n        }\n        return store?.last();\n      };\n      const keyMap = {\n        ArrowUp: (grid || isVertical) && up,\n        ArrowRight: (grid || isHorizontal) && store.first,\n        ArrowDown: (grid || isVertical) && store.first,\n        ArrowLeft: (grid || isHorizontal) && store.last,\n        Home: store.first,\n        End: store.last,\n        PageUp: store.first,\n        PageDown: store.last,\n      };\n      const action = keyMap[event.key as keyof typeof keyMap];\n      if (action) {\n        const id = action();\n        if (id !== undefined) {\n          if (!moveOnKeyPressProp(event)) return;\n          event.preventDefault();\n          store.move(id);\n        }\n      }\n    });\n\n    props = useWrapElement(\n      props,\n      (element) => (\n        <CompositeScopedContextProvider value={store}>\n          {element}\n        </CompositeScopedContextProvider>\n      ),\n      [store],\n    );\n\n    const activeDescendant = useStoreState(store, (state) => {\n      if (!store) return;\n      if (!composite) return;\n      if (!state.virtualFocus) return;\n      return getEnabledItem(store, state.activeId)?.id;\n    });\n\n    props = {\n      \"aria-activedescendant\": activeDescendant,\n      ...props,\n      ref: useMergeRefs(ref, setBaseElement, props.ref),\n      onKeyDownCapture,\n      onKeyUpCapture,\n      onFocusCapture,\n      onFocus,\n      onBlurCapture,\n      onKeyDown,\n    };\n\n    const focusable = useStoreState(\n      store,\n      (state) => composite && (state.virtualFocus || state.activeId === null),\n    );\n\n    props = useFocusable({ focusable, ...props });\n\n    return props;\n  },\n);\n\n/**\n * Renders a composite widget.\n * @see https://ariakit.com/components/composite\n * @example\n * ```jsx\n * const composite = useCompositeStore();\n * <Composite store={composite}>\n *   <CompositeItem>Item 1</CompositeItem>\n *   <CompositeItem>Item 2</CompositeItem>\n * </Composite>\n * ```\n */\nexport const Composite = forwardRef(function Composite(props: CompositeProps) {\n  const htmlProps = useComposite(props);\n  return createElement(TagName, htmlProps);\n});\n\nexport interface CompositeOptions<\n  T extends ElementType = TagName,\n> extends FocusableOptions<T> {\n  /**\n   * Object returned by the\n   * [`useCompositeStore`](https://ariakit.com/reference/use-composite-store)\n   * hook. If not provided, the closest\n   * [`CompositeProvider`](https://ariakit.com/reference/composite-provider)\n   * component's context will be used.\n   */\n  store?: CompositeStore;\n  /**\n   * Determines if the component should act as a composite widget. This prop\n   * needs to be set to `false` when merging various composite widgets where\n   * only one should function in that manner.\n   *\n   * If disabled, this component will stop managing focus and keyboard\n   * navigation for its items and itself. Additionally, composite ARIA\n   * attributes won't be applied. These responsibilities should be taken over by\n   * another composite component.\n   *\n   * **Note**: In most cases, this prop doesn't need to be set manually. For\n   * example, when composing [Menu with\n   * Combobox](https://ariakit.com/examples/menu-combobox) or [Select with\n   * Combobox](https://ariakit.com/examples/select-combobox), this prop will be\n   * set to `false` automatically on the\n   * [`Menu`](https://ariakit.com/reference/menu) and\n   * [`SelectPopover`](https://ariakit.com/reference/select-popover) components\n   * so the [`Combobox`](https://ariakit.com/reference/combobox) component can\n   * take over the composite widget responsibilities.\n   *\n   * Live examples:\n   * - [Menu with Combobox](https://ariakit.com/examples/menu-combobox)\n   * - [Select with Combobox](https://ariakit.com/examples/select-combobox)\n   * @default true\n   */\n  composite?: boolean;\n  /**\n   * Determines whether the composite widget should move focus to an item when\n   * arrow keys are pressed, given that the composite element is focused and\n   * there's no active item.\n   *\n   * **Note**: To entirely disable focus moving within a composite widget, you\n   * can use the\n   * [`focusOnMove`](https://ariakit.com/reference/composite#focusonmove) prop\n   * instead. If you want to control the behavior _only when arrow keys are\n   * pressed_, where\n   * [`focusOnMove`](https://ariakit.com/reference/composite#focusonmove) may\n   * not be applicable, this prop must be set on composite items as well.\n   * @default true\n   * @example\n   * ```jsx\n   * <Composite moveOnKeyPress={false}>\n   *   <CompositeItem moveOnKeyPress={false} />\n   *   <CompositeItem moveOnKeyPress={false} />\n   * </Composite>\n   * ```\n   */\n  moveOnKeyPress?: BooleanOrCallback<ReactKeyboardEvent<HTMLElement>>;\n  /**\n   * Determines if the active composite item should receive focus (or virtual\n   * focus if the\n   * [`virtualFocus`](https://ariakit.com/reference/composite-provider#virtualfocus)\n   * option is enabled) when moving through items. This typically happens when\n   * navigating through items with arrow keys, but it can also happen when\n   * calling the\n   * [`move`](https://ariakit.com/reference/use-composite-store#move) method\n   * directly.\n   *\n   * Unlike the\n   * [`composite`](https://ariakit.com/reference/composite#composite-1) prop,\n   * this option doesn't disable the entire composite widget behavior. It only\n   * stops this component from managing focus when navigating through items.\n   *\n   * **Note**: If you want to control the behavior only _when arrow keys are\n   * pressed_, use the\n   * [`moveOnKeyPress`](https://ariakit.com/reference/composite#moveonkeypress)\n   * prop instead.\n   * @default true\n   */\n  focusOnMove?: boolean;\n  /**\n   * @see https://ariakit.com/reference/focusable\n   */\n  focusable?: FocusableOptions<T>[\"focusable\"];\n}\n\nexport type CompositeProps<T extends ElementType = TagName> = Props<\n  T,\n  CompositeOptions<T>\n>;\n"],"mappings":"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"}

package/dist/{composite-DLvyFHMq.d.ts → composite-KBhCGLEy.d.ts}

@@ -1,4 +1,4 @@
-import { n as FocusableOptions } from "./focusable-B00tOxtB.js";
+import { n as FocusableOptions } from "./focusable-dBZH13-T.js";
 import { t as CompositeStore } from "./composite-store-DyJc-XRA.js";
 import { Props } from "@ariakit/react-utils";
 import { ElementType, KeyboardEvent } from "react";
@@ -33,7 +33,7 @@ declare const useComposite: import("@ariakit/react-utils").Hook<"div", Composite
  * </Composite>
  * ```
  */
-declare const Composite: (props: CompositeProps) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>;
+declare const Composite: (props: CompositeProps) => import("react").ReactElement<unknown, string | import("react").JSXElementConstructor<any>>;
 interface CompositeOptions<T extends ElementType = TagName> extends FocusableOptions<T> {
   /**
    * Object returned by the
@@ -121,4 +121,4 @@ interface CompositeOptions<T extends ElementType = TagName> extends FocusableOpt
 type CompositeProps<T extends ElementType = TagName> = Props<T, CompositeOptions<T>>;
 //#endregion
 export { useComposite as i, CompositeOptions as n, CompositeProps as r, Composite as t };
-//# sourceMappingURL=composite-DLvyFHMq.d.ts.map
+//# sourceMappingURL=composite-KBhCGLEy.d.ts.map

package/dist/{composite-DLvyFHMq.d.ts.map → composite-KBhCGLEy.d.ts.map}

@@ -1 +1 @@
-{"version":3,"file":"composite-DLvyFHMq.d.ts","names":["Props","BooleanOrCallback","ElementType","KeyboardEvent","ReactKeyboardEvent","FocusableOptions","CompositeStore","TagName","useComposite","CompositeOptions","Hook","Composite","CompositeProps","props","ReactElement","JSXElementConstructor","T","HTMLElement","store","composite","moveOnKeyPress","focusOnMove","focusable"],"sources":["../src/composite/composite.d.ts"],"mappings":";;;;;;;cAKcO,OAAAA;AAAAA,KACTA,OAAAA,UAAiBA,OAAO;AAF8B;;;;AACtC;AAAA;;;;AACQ;AAc7B;;;AAhB2D,cAgBtCC,YAAAA,iCAA6CE,IAAAA,QAAYD,gBAAgB;AAAA;AAa9F;;;;;;;;;AAA2I;AAC3I;AAd8F,cAazEE,SAAAA,GAAYE,KAAAA,EAAOD,cAAc,qBAAqBE,YAAAA,+BAA2CC,qBAAAA;AAAAA,UACrGN,gBAAAA,WAA2BP,WAAAA,GAAcK,OAAAA,UAAiBF,gBAAAA,CAAiBW,CAAAA;EAAhDd;;;;;;;EAQxCgB,KAAAA,GAAQZ,cAAAA;EA0EID;;;;;;;;;;;;;;;;;;;;;AAAkB;AAElC;;;EAlDIc,SAAAA;EAkD+CZ;;;;;;;;;;;;;;;AAAsC;;;;;;EA5BrFa,cAAAA,GAAiBnB,iBAAAA,CAAkBG,aAAAA,CAAmBa,WAAAA;;;;;;;;;;;;;;;;;;;;;;EAsBtDI,WAAAA;;;;EAIAC,SAAAA,GAAYjB,gBAAAA,CAAiBW,CAAAA;AAAAA;AAAAA,KAErBJ,cAAAA,WAAyBV,WAAAA,GAAcK,OAAAA,IAAWP,KAAAA,CAAMgB,CAAAA,EAAGP,gBAAAA,CAAiBO,CAAAA"}
+{"version":3,"file":"composite-KBhCGLEy.d.ts","names":["Props","BooleanOrCallback","ElementType","KeyboardEvent","ReactKeyboardEvent","FocusableOptions","CompositeStore","TagName","useComposite","CompositeOptions","Hook","Composite","CompositeProps","props","ReactElement","JSXElementConstructor","T","HTMLElement","store","composite","moveOnKeyPress","focusOnMove","focusable"],"sources":["../src/composite/composite.d.ts"],"mappings":";;;;;;;cAKcO,OAAAA;AAAAA,KACTA,OAAAA,UAAiBA,OAAO;AAF8B;;;;AACtC;AAAA;;;;AACQ;AAc7B;;;AAhB2D,cAgBtCC,YAAAA,iCAA6CE,IAAAA,QAAYD,gBAAgB;AAAA;AAa9F;;;;;;;;;AAA+I;AAC/I;AAd8F,cAazEE,SAAAA,GAAYE,KAAAA,EAAOD,cAAc,qBAAqBE,YAAAA,mCAA+CC,qBAAAA;AAAAA,UACzGN,gBAAAA,WAA2BP,WAAAA,GAAcK,OAAAA,UAAiBF,gBAAAA,CAAiBW,CAAAA;EAAhDd;;;;;;;EAQxCgB,KAAAA,GAAQZ,cAAAA;EA0EID;;;;;;;;;;;;;;;;;;;;;AAAkB;AAElC;;;EAlDIc,SAAAA;EAkD+CZ;;;;;;;;;;;;;;;AAAsC;;;;;;EA5BrFa,cAAAA,GAAiBnB,iBAAAA,CAAkBG,aAAAA,CAAmBa,WAAAA;;;;;;;;;;;;;;;;;;;;;;EAsBtDI,WAAAA;;;;EAIAC,SAAAA,GAAYjB,gBAAAA,CAAiBW,CAAAA;AAAAA;AAAAA,KAErBJ,cAAAA,WAAyBV,WAAAA,GAAcK,OAAAA,IAAWP,KAAAA,CAAMgB,CAAAA,EAAGP,gBAAAA,CAAiBO,CAAAA"}

package/dist/{composite-hover-C7ul163w.d.ts → composite-hover-BpXq3T8J.d.ts}

@@ -44,7 +44,7 @@ declare const useCompositeHover: import("@ariakit/react-utils").Hook<"div", Comp
  * </CompositeProvider>
  * ```
  */
-declare const CompositeHover: (props: CompositeHoverProps) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>;
+declare const CompositeHover: (props: CompositeHoverProps) => import("react").ReactElement<unknown, string | import("react").JSXElementConstructor<any>>;
 interface CompositeHoverOptions<_T extends ElementType = TagName> extends Options {
   /**
    * Object returned by the
@@ -100,4 +100,4 @@ interface CompositeHoverOptions<_T extends ElementType = TagName> extends Option
 type CompositeHoverProps<T extends ElementType = TagName> = Props<T, CompositeHoverOptions<T>>;
 //#endregion
 export { useCompositeHover as i, CompositeHoverOptions as n, CompositeHoverProps as r, CompositeHover as t };
-//# sourceMappingURL=composite-hover-C7ul163w.d.ts.map
+//# sourceMappingURL=composite-hover-BpXq3T8J.d.ts.map

package/dist/{composite-hover-C7ul163w.d.ts.map → composite-hover-BpXq3T8J.d.ts.map}

@@ -1 +1 @@
-{"version":3,"file":"composite-hover-C7ul163w.d.ts","names":["Options","Props","BooleanOrCallback","ElementType","MouseEvent","ReactMouseEvent","CompositeStore","TagName","useCompositeHover","CompositeHoverOptions","Hook","CompositeHover","CompositeHoverProps","props","ReactElement","JSXElementConstructor","_T","HTMLElement","store","focusOnHover","blurOnHoverEnd","T"],"sources":["../src/composite/composite-hover.d.ts"],"mappings":";;;;;;cAIcO,OAAAA;AAAAA,KACTA,OAAAA,UAAiBA,OAAO;AAF8B;;;;AACtC;AAAA;;;;AACQ;AAe7B;;;;AAjB2D,cAiBtCC,iBAAAA,iCAAkDE,IAAAA,QAAYD,qBAAqB;AAwBxG;;;;;;;;;AAAqJ;AACrJ;;;;;;;;;;;;;AADA,cAAqBE,cAAAA,GAAiBE,KAAAA,EAAOD,mBAAmB,qBAAqBE,YAAAA,+BAA2CC,qBAAAA;AAAAA,UAC/GN,qBAAAA,YAAiCN,WAAAA,GAAcI,OAAAA,UAAiBP,OAAAA;EAA1CgB;;;;;;;;EASnCE,KAAAA,GAAQZ,cAAAA;EAsByCW;;;;;;AAmBa;AAElE;;;;;;;;;;;;;;EArBIE,YAAAA,GAAejB,iBAAAA,CAAkBG,UAAAA,CAAgBY,WAAAA;EAqBoBI;;;;AAA0B;;;;;;;;;;;;;;EAF/FD,cAAAA,GAAiBlB,iBAAAA,CAAkBG,UAAAA,CAAgBY,WAAAA;AAAAA;AAAAA,KAE3CL,mBAAAA,WAA8BT,WAAAA,GAAcI,OAAAA,IAAWN,KAAAA,CAAMoB,CAAAA,EAAGZ,qBAAAA,CAAsBY,CAAAA"}
+{"version":3,"file":"composite-hover-BpXq3T8J.d.ts","names":["Options","Props","BooleanOrCallback","ElementType","MouseEvent","ReactMouseEvent","CompositeStore","TagName","useCompositeHover","CompositeHoverOptions","Hook","CompositeHover","CompositeHoverProps","props","ReactElement","JSXElementConstructor","_T","HTMLElement","store","focusOnHover","blurOnHoverEnd","T"],"sources":["../src/composite/composite-hover.d.ts"],"mappings":";;;;;;cAIcO,OAAAA;AAAAA,KACTA,OAAAA,UAAiBA,OAAO;AAF8B;;;;AACtC;AAAA;;;;AACQ;AAe7B;;;;AAjB2D,cAiBtCC,iBAAAA,iCAAkDE,IAAAA,QAAYD,qBAAqB;AAwBxG;;;;;;;;;AAAyJ;AACzJ;;;;;;;;;;;;;AADA,cAAqBE,cAAAA,GAAiBE,KAAAA,EAAOD,mBAAmB,qBAAqBE,YAAAA,mCAA+CC,qBAAAA;AAAAA,UACnHN,qBAAAA,YAAiCN,WAAAA,GAAcI,OAAAA,UAAiBP,OAAAA;EAA1CgB;;;;;;;;EASnCE,KAAAA,GAAQZ,cAAAA;EAsByCW;;;;;;AAmBa;AAElE;;;;;;;;;;;;;;EArBIE,YAAAA,GAAejB,iBAAAA,CAAkBG,UAAAA,CAAgBY,WAAAA;EAqBoBI;;;;AAA0B;;;;;;;;;;;;;;EAF/FD,cAAAA,GAAiBlB,iBAAAA,CAAkBG,UAAAA,CAAgBY,WAAAA;AAAAA;AAAAA,KAE3CL,mBAAAA,WAA8BT,WAAAA,GAAcI,OAAAA,IAAWN,KAAAA,CAAMoB,CAAAA,EAAGZ,qBAAAA,CAAsBY,CAAAA"}

package/dist/{composite-item-B4WTelVz.d.ts → composite-item-d4UXaZ84.d.ts}

@@ -1,5 +1,5 @@
-import { n as CommandOptions } from "./command-DckndCUK.js";
-import { n as CollectionItemOptions } from "./collection-item-C-g2BwVF.js";
+import { n as CommandOptions } from "./command-B9C8p3_S.js";
+import { n as CollectionItemOptions } from "./collection-item-pvEWNoNs.js";
 import { t as CompositeStore } from "./composite-store-DyJc-XRA.js";
 import { Props } from "@ariakit/react-utils";
 import { ElementType, KeyboardEvent } from "react";
@@ -43,7 +43,7 @@ declare const useCompositeItem: import("@ariakit/react-utils").Hook<"button", Co
  * </CompositeProvider>
  * ```
  */
-declare const CompositeItem: (props: CompositeItemProps) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>;
+declare const CompositeItem: (props: CompositeItemProps) => import("react").ReactElement<unknown, string | import("react").JSXElementConstructor<any>>;
 interface CompositeItemOptions<T extends ElementType = TagName> extends CommandOptions<T>, CollectionItemOptions<T> {
   /**
    * Object returned by the
@@ -138,4 +138,4 @@ interface CompositeItemOptions<T extends ElementType = TagName> extends CommandO
 type CompositeItemProps<T extends ElementType = TagName> = Props<T, CompositeItemOptions<T>>;
 //#endregion
 export { useCompositeItem as i, CompositeItemOptions as n, CompositeItemProps as r, CompositeItem as t };
-//# sourceMappingURL=composite-item-B4WTelVz.d.ts.map
+//# sourceMappingURL=composite-item-d4UXaZ84.d.ts.map

package/dist/{composite-item-B4WTelVz.d.ts.map → composite-item-d4UXaZ84.d.ts.map}

@@ -1 +1 @@
-{"version":3,"file":"composite-item-B4WTelVz.d.ts","names":["Props","BooleanOrCallback","ElementType","KeyboardEvent","CollectionItemOptions","CommandOptions","CompositeStore","TagName","useCompositeItem","CompositeItemOptions","Hook","CompositeItem","CompositeItemProps","props","ReactElement","JSXElementConstructor","T","HTMLElement","store","shouldRegisterItem","rowId","preventScrollOnKeyDown","moveOnKeyPress","tabbable"],"sources":["../src/composite/composite-item.d.ts"],"mappings":";;;;;;;;cAMcO,OAAAA;AAAAA,KACTA,OAAAA,UAAiBA,OAAO;AAF8B;;;;AACtC;AAAA;;;;AACQ;AAF8B,cAatCC,gBAAAA,iCAAiDE,IAAAA,WAAeD,oBAAoB;;;;AAAA;AAyBzG;;;;;;;;;AAAmJ;AACnJ;;;;;;;;;;cADqBE,aAAAA,GAAgBE,KAAAA,EAAOD,kBAAkB,qBAAqBE,YAAAA,+BAA2CC,qBAAAA;AAAAA,UAC7GN,oBAAAA,WAA+BP,WAAAA,GAAcK,OAAAA,UAAiBF,cAAAA,CAAeW,CAAAA,GAAIZ,qBAAAA,CAAsBY,CAAAA;EAkC3Ff;;;;;;;;EAzBzBiB,KAAAA,GAAQZ,cAAAA;EAToCJ;;;;EAc5CiB,kBAAAA,GAAqBf,qBAAAA,CAAsBY,CAAAA;EAdyEA;;;;;;;;;;EAyBpHI,KAAAA;EAgCAE;;;;;;AAgCQ;AAEZ;EAzDID,sBAAAA,GAAyBpB,iBAAAA,CAAkBE,aAAAA,CAAcc,WAAAA;EAyD/BD;;;;;;;;;;;;;;;;;AAAmE;;;;;EAlC7FM,cAAAA,GAAiBrB,iBAAAA,CAAkBE,aAAAA,CAAcc,WAAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAgCjDM,QAAAA;AAAAA;AAAAA,KAEQX,kBAAAA,WAA6BV,WAAAA,GAAcK,OAAAA,IAAWP,KAAAA,CAAMgB,CAAAA,EAAGP,oBAAAA,CAAqBO,CAAAA"}
+{"version":3,"file":"composite-item-d4UXaZ84.d.ts","names":["Props","BooleanOrCallback","ElementType","KeyboardEvent","CollectionItemOptions","CommandOptions","CompositeStore","TagName","useCompositeItem","CompositeItemOptions","Hook","CompositeItem","CompositeItemProps","props","ReactElement","JSXElementConstructor","T","HTMLElement","store","shouldRegisterItem","rowId","preventScrollOnKeyDown","moveOnKeyPress","tabbable"],"sources":["../src/composite/composite-item.d.ts"],"mappings":";;;;;;;;cAMcO,OAAAA;AAAAA,KACTA,OAAAA,UAAiBA,OAAO;AAF8B;;;;AACtC;AAAA;;;;AACQ;AAF8B,cAatCC,gBAAAA,iCAAiDE,IAAAA,WAAeD,oBAAoB;;;;AAAA;AAyBzG;;;;;;;;;AAAuJ;AACvJ;;;;;;;;;;cADqBE,aAAAA,GAAgBE,KAAAA,EAAOD,kBAAkB,qBAAqBE,YAAAA,mCAA+CC,qBAAAA;AAAAA,UACjHN,oBAAAA,WAA+BP,WAAAA,GAAcK,OAAAA,UAAiBF,cAAAA,CAAeW,CAAAA,GAAIZ,qBAAAA,CAAsBY,CAAAA;EAkC3Ff;;;;;;;;EAzBzBiB,KAAAA,GAAQZ,cAAAA;EAToCJ;;;;EAc5CiB,kBAAAA,GAAqBf,qBAAAA,CAAsBY,CAAAA;EAdyEA;;;;;;;;;;EAyBpHI,KAAAA;EAgCAE;;;;;;AAgCQ;AAEZ;EAzDID,sBAAAA,GAAyBpB,iBAAAA,CAAkBE,aAAAA,CAAcc,WAAAA;EAyD/BD;;;;;;;;;;;;;;;;;AAAmE;;;;;EAlC7FM,cAAAA,GAAiBrB,iBAAAA,CAAkBE,aAAAA,CAAcc,WAAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAgCjDM,QAAAA;AAAAA;AAAAA,KAEQX,kBAAAA,WAA6BV,WAAAA,GAAcK,OAAAA,IAAWP,KAAAA,CAAMgB,CAAAA,EAAGP,oBAAAA,CAAqBO,CAAAA"}

package/dist/{composite-typeahead-DDhpyKqm.d.ts → composite-typeahead-0euW43GU.d.ts}

@@ -39,7 +39,7 @@ declare const useCompositeTypeahead: import("@ariakit/react-utils").Hook<"div",
  * </CompositeProvider>
  * ```
  */
-declare const CompositeTypeahead: (props: CompositeTypeaheadProps) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>;
+declare const CompositeTypeahead: (props: CompositeTypeaheadProps) => import("react").ReactElement<unknown, string | import("react").JSXElementConstructor<any>>;
 interface CompositeTypeaheadOptions<_T extends ElementType = TagName> extends Options {
   /**
    * Object returned by the
@@ -60,4 +60,4 @@ interface CompositeTypeaheadOptions<_T extends ElementType = TagName> extends Op
 type CompositeTypeaheadProps<T extends ElementType = TagName> = Props<T, CompositeTypeaheadOptions<T>>;
 //#endregion
 export { useCompositeTypeahead as i, CompositeTypeaheadOptions as n, CompositeTypeaheadProps as r, CompositeTypeahead as t };
-//# sourceMappingURL=composite-typeahead-DDhpyKqm.d.ts.map
+//# sourceMappingURL=composite-typeahead-0euW43GU.d.ts.map

package/dist/{composite-typeahead-DDhpyKqm.d.ts.map → composite-typeahead-0euW43GU.d.ts.map}

@@ -1 +1 @@
-{"version":3,"file":"composite-typeahead-DDhpyKqm.d.ts","names":["Options","Props","ElementType","CompositeStore","TagName","useCompositeTypeahead","CompositeTypeaheadOptions","Hook","CompositeTypeahead","CompositeTypeaheadProps","props","ReactElement","JSXElementConstructor","_T","store","typeahead","T"],"sources":["../src/composite/composite-typeahead.d.ts"],"mappings":";;;;;cAGcI,OAAAA;AAAAA,KACTA,OAAAA,UAAiBA,OAAO;AAF8B;;;;AACtC;AAAA;;;;AACQ;AAc7B;;;AAhB2D,cAgBtCC,qBAAAA,iCAAsDE,IAAAA,QAAYD,yBAAyB;AAAA;AAqBhH;;;;;;;;;AAA6J;AAC7J;;;;;;;;;AAtBgH,cAqB3FE,kBAAAA,GAAqBE,KAAAA,EAAOD,uBAAuB,qBAAqBE,YAAAA,+BAA2CC,qBAAAA;AAAAA,UACvHN,yBAAAA,YAAqCJ,WAAAA,GAAcE,OAAAA,UAAiBJ,OAAAA;EAAjBI;;;;;;AAevD;AAEb;EARIU,KAAAA,GAAQX,cAAAA;EAQuBa;;;;;EAF/BD,SAAAA;AAAAA;AAAAA,KAEQN,uBAAAA,WAAkCP,WAAAA,GAAcE,OAAAA,IAAWH,KAAAA,CAAMe,CAAAA,EAAGV,yBAAAA,CAA0BU,CAAAA"}
+{"version":3,"file":"composite-typeahead-0euW43GU.d.ts","names":["Options","Props","ElementType","CompositeStore","TagName","useCompositeTypeahead","CompositeTypeaheadOptions","Hook","CompositeTypeahead","CompositeTypeaheadProps","props","ReactElement","JSXElementConstructor","_T","store","typeahead","T"],"sources":["../src/composite/composite-typeahead.d.ts"],"mappings":";;;;;cAGcI,OAAAA;AAAAA,KACTA,OAAAA,UAAiBA,OAAO;AAF8B;;;;AACtC;AAAA;;;;AACQ;AAc7B;;;AAhB2D,cAgBtCC,qBAAAA,iCAAsDE,IAAAA,QAAYD,yBAAyB;AAAA;AAqBhH;;;;;;;;;AAAiK;AACjK;;;;;;;;;AAtBgH,cAqB3FE,kBAAAA,GAAqBE,KAAAA,EAAOD,uBAAuB,qBAAqBE,YAAAA,mCAA+CC,qBAAAA;AAAAA,UAC3HN,yBAAAA,YAAqCJ,WAAAA,GAAcE,OAAAA,UAAiBJ,OAAAA;EAAjBI;;;;;;AAevD;AAEb;EARIU,KAAAA,GAAQX,cAAAA;EAQuBa;;;;;EAF/BD,SAAAA;AAAAA;AAAAA,KAEQN,uBAAAA,WAAkCP,WAAAA,GAAcE,OAAAA,IAAWH,KAAAA,CAAMe,CAAAA,EAAGV,yBAAAA,CAA0BU,CAAAA"}

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

@@ -1,5 +1,5 @@
 import { t as DialogStore } from "../dialog-store-Cjt12T_Y.js";
-import { r as DialogProps } from "../dialog-C__C-zX2.js";
+import { r as DialogProps } from "../dialog-D23r2ZWj.js";
 
 //#region src/dialog/dialog-backdrop.d.ts
 interface DialogBackdropProps extends Pick<DialogProps, "backdrop" | "alwaysVisible" | "hidden"> {

package/dist/dialog/dialog-description.d.ts

@@ -1,2 +1,2 @@
-import { i as useDialogDescription, n as DialogDescriptionOptions, r as DialogDescriptionProps, t as DialogDescription } from "../dialog-description-BCZJ1Kyd.js";
+import { i as useDialogDescription, n as DialogDescriptionOptions, r as DialogDescriptionProps, t as DialogDescription } from "../dialog-description-CJGxnEvk.js";
 export { DialogDescription, DialogDescriptionOptions, DialogDescriptionProps, useDialogDescription };

package/dist/dialog/dialog-disclosure.d.ts

@@ -1,2 +1,2 @@
-import { i as useDialogDisclosure, n as DialogDisclosureOptions, r as DialogDisclosureProps, t as DialogDisclosure } from "../dialog-disclosure-DLD10zlb.js";
+import { i as useDialogDisclosure, n as DialogDisclosureOptions, r as DialogDisclosureProps, t as DialogDisclosure } from "../dialog-disclosure-DSESk5pv.js";
 export { DialogDisclosure, DialogDisclosureOptions, DialogDisclosureProps, useDialogDisclosure };

package/dist/dialog/dialog-disclosure.js

@@ -20,7 +20,7 @@ const TagName = "button";
 const useDialogDisclosure = createHook(function useDialogDisclosure({ store, ...props }) {
 	const context = useDialogProviderContext();
 	store = store || context;
-	invariant(store, "DialogDisclosure must receive a `store` prop or be wrapped in a DialogProvider component.");
+	invariant(store, process.env.NODE_ENV !== "production" && "DialogDisclosure must receive a `store` prop or be wrapped in a DialogProvider component.");
 	props = {
 		"aria-haspopup": getPopupRole(useStoreState(store, "contentElement"), "dialog"),
 		...props

package/dist/dialog/dialog-disclosure.js.map

@@ -1 +1 @@
-{"version":3,"file":"dialog-disclosure.js","names":[],"sources":["../../src/dialog/dialog-disclosure.tsx"],"sourcesContent":["import { useStoreState } from \"@ariakit/react-store\";\nimport { createElement, createHook, forwardRef } from \"@ariakit/react-utils\";\nimport type { Props } from \"@ariakit/react-utils\";\nimport { getPopupRole, invariant } from \"@ariakit/utils\";\nimport type { ElementType } from \"react\";\nimport type { DisclosureOptions } from \"../disclosure/disclosure.tsx\";\nimport { useDisclosure } from \"../disclosure/disclosure.tsx\";\nimport { useDialogProviderContext } from \"./dialog-context.tsx\";\nimport type { DialogStore } from \"./dialog-store.ts\";\n\nconst TagName = \"button\" satisfies ElementType;\ntype TagName = typeof TagName;\n\n/**\n * Returns props to create a `DialogDisclosure` component.\n * @see https://ariakit.com/components/dialog\n * @example\n * ```jsx\n * const store = useDialogStore();\n * const props = useDialogDisclosure({ store });\n * <Role {...props}>Disclosure</Role>\n * <Dialog store={store}>Content</Dialog>\n * ```\n */\nexport const useDialogDisclosure = createHook<TagName, DialogDisclosureOptions>(\n  function useDialogDisclosure({ store, ...props }) {\n    const context = useDialogProviderContext();\n    store = store || context;\n\n    invariant(\n      store,\n      process.env.NODE_ENV !== \"production\" &&\n        \"DialogDisclosure must receive a `store` prop or be wrapped in a DialogProvider component.\",\n    );\n\n    const contentElement = useStoreState(store, \"contentElement\");\n\n    props = {\n      \"aria-haspopup\": getPopupRole(contentElement, \"dialog\"),\n      ...props,\n    };\n\n    props = useDisclosure({ store, ...props });\n\n    return props;\n  },\n);\n\n/**\n * Renders a button that toggles the visibility of a\n * [`Dialog`](https://ariakit.com/reference/dialog) component when clicked.\n * @see https://ariakit.com/components/dialog\n * @example\n * ```jsx {2}\n * <DialogProvider>\n *   <DialogDisclosure>Disclosure</DialogDisclosure>\n *   <Dialog>Content</Dialog>\n * </DialogProvider>\n * ```\n */\nexport const DialogDisclosure = forwardRef(function DialogDisclosure(\n  props: DialogDisclosureProps,\n) {\n  const htmlProps = useDialogDisclosure(props);\n  return createElement(TagName, htmlProps);\n});\n\nexport interface DialogDisclosureOptions<\n  T extends ElementType = TagName,\n> extends DisclosureOptions<T> {\n  /**\n   * Object returned by the\n   * [`useDialogStore`](https://ariakit.com/reference/use-dialog-store) hook. If\n   * not provided, the closest\n   * [`DialogProvider`](https://ariakit.com/reference/dialog-provider)\n   * component's context will be used.\n   */\n  store?: DialogStore;\n}\n\nexport type DialogDisclosureProps<T extends ElementType = TagName> = Props<\n  T,\n  DialogDisclosureOptions<T>\n>;\n"],"mappings":";;;;;;;;;;;;;;;;;;;MA0BI,sBAAgB,WAAA,SAAyB,oBAAA,EAAA,OAAA,GAAA,SAAA;CACzC,MAAA,UAAQ,yBAAS;CAEjB,QAAA,SAGI;CAKJ,UAAQ,OAAA,2FAAA;SACN;EACA,iBAAG,aAAA,cAAA,OAAA,gBAAA,GAAA,QAAA;EACL,GAAA;CAEA;SAAwB,cAAA;EAAO;EAAU,GAAA;CAEzC,CAAA;CAEJ,OAAA;;;;;;;;;;;;;;MAkBE,mBAAqB,WADH,SAAA,iBACqB,OAAA;CACxC,OAAA,cAAA,SAAA,oBAAA,KAAA,CAAA"}
+{"version":3,"file":"dialog-disclosure.js","names":[],"sources":["../../src/dialog/dialog-disclosure.tsx"],"sourcesContent":["import { useStoreState } from \"@ariakit/react-store\";\nimport { createElement, createHook, forwardRef } from \"@ariakit/react-utils\";\nimport type { Props } from \"@ariakit/react-utils\";\nimport { getPopupRole, invariant } from \"@ariakit/utils\";\nimport type { ElementType } from \"react\";\nimport type { DisclosureOptions } from \"../disclosure/disclosure.tsx\";\nimport { useDisclosure } from \"../disclosure/disclosure.tsx\";\nimport { useDialogProviderContext } from \"./dialog-context.tsx\";\nimport type { DialogStore } from \"./dialog-store.ts\";\n\nconst TagName = \"button\" satisfies ElementType;\ntype TagName = typeof TagName;\n\n/**\n * Returns props to create a `DialogDisclosure` component.\n * @see https://ariakit.com/components/dialog\n * @example\n * ```jsx\n * const store = useDialogStore();\n * const props = useDialogDisclosure({ store });\n * <Role {...props}>Disclosure</Role>\n * <Dialog store={store}>Content</Dialog>\n * ```\n */\nexport const useDialogDisclosure = createHook<TagName, DialogDisclosureOptions>(\n  function useDialogDisclosure({ store, ...props }) {\n    const context = useDialogProviderContext();\n    store = store || context;\n\n    invariant(\n      store,\n      process.env.NODE_ENV !== \"production\" &&\n        \"DialogDisclosure must receive a `store` prop or be wrapped in a DialogProvider component.\",\n    );\n\n    const contentElement = useStoreState(store, \"contentElement\");\n\n    props = {\n      \"aria-haspopup\": getPopupRole(contentElement, \"dialog\"),\n      ...props,\n    };\n\n    props = useDisclosure({ store, ...props });\n\n    return props;\n  },\n);\n\n/**\n * Renders a button that toggles the visibility of a\n * [`Dialog`](https://ariakit.com/reference/dialog) component when clicked.\n * @see https://ariakit.com/components/dialog\n * @example\n * ```jsx {2}\n * <DialogProvider>\n *   <DialogDisclosure>Disclosure</DialogDisclosure>\n *   <Dialog>Content</Dialog>\n * </DialogProvider>\n * ```\n */\nexport const DialogDisclosure = forwardRef(function DialogDisclosure(\n  props: DialogDisclosureProps,\n) {\n  const htmlProps = useDialogDisclosure(props);\n  return createElement(TagName, htmlProps);\n});\n\nexport interface DialogDisclosureOptions<\n  T extends ElementType = TagName,\n> extends DisclosureOptions<T> {\n  /**\n   * Object returned by the\n   * [`useDialogStore`](https://ariakit.com/reference/use-dialog-store) hook. If\n   * not provided, the closest\n   * [`DialogProvider`](https://ariakit.com/reference/dialog-provider)\n   * component's context will be used.\n   */\n  store?: DialogStore;\n}\n\nexport type DialogDisclosureProps<T extends ElementType = TagName> = Props<\n  T,\n  DialogDisclosureOptions<T>\n>;\n"],"mappings":";;;;;;;;;;;;;;;;;;;MA0BI,sBAAgB,WAAA,SAAyB,oBAAA,EAAA,OAAA,GAAA,SAAA;CACzC,MAAA,UAAQ,yBAAS;CAEjB,QAAA,SAEE;CAMF,UAAQ,OAAA,QAAA,IAAA,aAAA,gBAAA,2FAAA;SACN;EACA,iBAAG,aAAA,cAAA,OAAA,gBAAA,GAAA,QAAA;EACL,GAAA;CAEA;SAAwB,cAAA;EAAO;EAAU,GAAA;CAEzC,CAAA;CAEJ,OAAA;;;;;;;;;;;;;;MAkBE,mBAAqB,WADH,SAAA,iBACqB,OAAA;CACxC,OAAA,cAAA,SAAA,oBAAA,KAAA,CAAA"}

package/dist/dialog/dialog-dismiss.d.ts

@@ -1,2 +1,2 @@
-import { i as useDialogDismiss, n as DialogDismissOptions, r as DialogDismissProps, t as DialogDismiss } from "../dialog-dismiss-CnwEbzc6.js";
+import { i as useDialogDismiss, n as DialogDismissOptions, r as DialogDismissProps, t as DialogDismiss } from "../dialog-dismiss-DW3XQYvp.js";
 export { DialogDismiss, DialogDismissOptions, DialogDismissProps, useDialogDismiss };

package/dist/dialog/dialog-heading.d.ts

@@ -1,2 +1,2 @@
-import { i as useDialogHeading, n as DialogHeadingOptions, r as DialogHeadingProps, t as DialogHeading } from "../dialog-heading-DQvnOfZH.js";
+import { i as useDialogHeading, n as DialogHeadingOptions, r as DialogHeadingProps, t as DialogHeading } from "../dialog-heading-DGA5d8VH.js";
 export { DialogHeading, DialogHeadingOptions, DialogHeadingProps, useDialogHeading };

package/dist/dialog/dialog.d.ts

@@ -1,2 +1,2 @@
-import { a as useDialog, i as createDialogComponent, n as DialogOptions, r as DialogProps, t as Dialog } from "../dialog-C__C-zX2.js";
+import { a as useDialog, i as createDialogComponent, n as DialogOptions, r as DialogProps, t as Dialog } from "../dialog-D23r2ZWj.js";
 export { Dialog, DialogOptions, DialogProps, createDialogComponent, useDialog };

package/dist/dialog/dialog.js

@@ -16,7 +16,7 @@ import { useHideOnInteractOutside } from "./utils/use-hide-on-interact-outside.j
 import { useNestedDialogs } from "./utils/use-nested-dialogs.js";
 import { usePreventBodyScroll } from "./utils/use-prevent-body-scroll.js";
 import { createElement, createHook, forwardRef, useBooleanEvent, useEvent, useId, useMergeRefs, usePortalRef, useSafeLayoutEffect, useWrapElement } from "@ariakit/react-utils";
-import { addGlobalEventListener, chain, contains, getActiveElement, getDocument, getFirstTabbableIn, getWindow, isFocusable, isSafari } from "@ariakit/utils";
+import { addGlobalEventListener, chain, contains, getActiveElement, getDocument, getFirstTabbableIn, getWindow, isElement, isFocusable, isNode, isSafari } from "@ariakit/utils";
 import { useCallback, useEffect, useRef, useState } from "react";
 import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
 import { useStoreState } from "@ariakit/react-store";
@@ -310,10 +310,10 @@ const useDialog = createHook(function useDialog({ store: storeProp, open: openPr
 			if (!dialog) return;
 			if (isElementMarked(dialog)) return;
 			const target = event.target;
-			if (!target) return;
+			if (!isNode(target)) return;
 			const { disclosureElement } = store.getState();
 			const isValidTarget = () => {
-				if (target.tagName === "BODY") return true;
+				if (isElement(target) && target.tagName === "BODY") return true;
 				if (contains(dialog, target)) return true;
 				if (!disclosureElement) return true;
 				if (contains(disclosureElement, target)) return true;
@@ -400,6 +400,16 @@ function createDialogComponent(Component, useProviderContext = useDialogProvider
 		return /* @__PURE__ */ jsx(Component, { ...props });
 	});
 }
+const DialogWithStore = createDialogComponent(forwardRef(function DialogImpl(props) {
+	return createElement(TagName, useDialog(props));
+}), useDialogProviderContext);
+const DialogWithInternalStore = forwardRef(function DialogWithInternalStore(props) {
+	const store = useDialogStore({ open: props.open });
+	return /* @__PURE__ */ jsx(DialogWithStore, {
+		...props,
+		store
+	});
+});
 /**
 * Renders a dialog similar to the native `dialog` element that's rendered in a
 * [`portal`](https://ariakit.com/reference/dialog#portal) by default.
@@ -420,9 +430,11 @@ function createDialogComponent(Component, useProviderContext = useDialogProvider
 * </Dialog>
 * ```
 */
-const Dialog = createDialogComponent(forwardRef(function Dialog(props) {
-	return createElement(TagName, useDialog(props));
-}), useDialogProviderContext);
+const Dialog = forwardRef(function Dialog(props) {
+	const context = useDialogProviderContext();
+	if (props.store || context || !props.unmountOnHide) return /* @__PURE__ */ jsx(DialogWithStore, { ...props });
+	return /* @__PURE__ */ jsx(DialogWithInternalStore, { ...props });
+});
 //#endregion
 export { Dialog, createDialogComponent, useDialog };