@ariakit/react-components 0.1.0

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

@@ -0,0 +1,49 @@
+import { t as DialogStore } from "./dialog-store-Cjt12T_Y.js";
+import { n as HeadingOptions } from "./heading-zY9g_9K-.js";
+import { Props } from "@ariakit/react-utils";
+import { ElementType } from "react";
+
+//#region src/dialog/dialog-heading.d.ts
+declare const TagName = "h1";
+type TagName = typeof TagName;
+/**
+ * Returns props to create a `DialogHeading` component. This hook must be used
+ * in a component that's wrapped with `Dialog` so the `aria-labelledby` prop is
+ * properly set on the dialog element.
+ * @see https://ariakit.com/components/dialog
+ * @example
+ * ```jsx
+ * // This component must be wrapped with Dialog
+ * const props = useDialogHeading();
+ * <Role {...props}>Heading</Role>
+ * ```
+ */
+declare const useDialogHeading: import("@ariakit/react-utils").Hook<"h1", DialogHeadingOptions<"h1">>;
+/**
+ * Renders a heading in a dialog. This component must be wrapped with
+ * [`Dialog`](https://ariakit.com/reference/dialog) so the `aria-labelledby`
+ * prop is properly set on the dialog element.
+ * @see https://ariakit.com/components/dialog
+ * @example
+ * ```jsx {4}
+ * const [open, setOpen] = useState(false);
+ *
+ * <Dialog open={open} onClose={() => setOpen(false)}>
+ *   <DialogHeading>Heading</DialogHeading>
+ * </Dialog>
+ * ```
+ */
+declare const DialogHeading: (props: DialogHeadingProps) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>;
+interface DialogHeadingOptions<T extends ElementType = TagName> extends HeadingOptions<T> {
+  /**
+   * Object returned by the
+   * [`useDialogStore`](https://ariakit.com/reference/use-dialog-store) hook. If
+   * not provided, the closest [`Dialog`](https://ariakit.com/reference/dialog)
+   * component's context will be used.
+   */
+  store?: DialogStore;
+}
+type DialogHeadingProps<T extends ElementType = TagName> = Props<T, DialogHeadingOptions<T>>;
+//#endregion
+export { useDialogHeading as i, DialogHeadingOptions as n, DialogHeadingProps as r, DialogHeading as t };
+//# sourceMappingURL=dialog-heading-DQvnOfZH.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"dialog-heading-DQvnOfZH.d.ts","names":["Props","ElementType","HeadingOptions","DialogStore","TagName","useDialogHeading","DialogHeadingOptions","Hook","DialogHeading","DialogHeadingProps","props","ReactElement","JSXElementConstructor","T","store"],"sources":["../src/dialog/dialog-heading.d.ts"],"mappings":";;;;;;cAIcI,OAAAA;AAAAA,KACTA,OAAAA,UAAiBA,OAAO;AAFwB;;;;AAChC;AAAA;;;;AACQ;AAa7B;;AAfqD,cAehCC,gBAAAA,iCAAiDE,IAAAA,OAAWD,oBAAoB;;AAAA;AAerG;;;;;;;;;AAAmJ;AACnJ;;cADqBE,aAAAA,GAAgBE,KAAAA,EAAOD,kBAAkB,qBAAqBE,YAAAA,+BAA2CC,qBAAAA;AAAAA,UAC7GN,oBAAAA,WAA+BL,WAAAA,GAAcG,OAAAA,UAAiBF,cAAAA,CAAeW,CAAAA;EAAhCT;;;;;;EAO1DU,KAAAA,GAAQX,WAAAA;AAAAA;AAAAA,KAEAM,kBAAAA,WAA6BR,WAAAA,GAAcG,OAAAA,IAAWJ,KAAAA,CAAMa,CAAAA,EAAGP,oBAAAA,CAAqBO,CAAAA"}

package/dist/dialog-store-Cjt12T_Y.d.ts

@@ -0,0 +1,29 @@
+import { a as DisclosureStoreState, n as DisclosureStoreFunctions, r as DisclosureStoreOptions, t as DisclosureStore } from "./disclosure-store-BsaBaRKv.js";
+import { Store } from "@ariakit/react-store";
+import * as Core from "@ariakit/components/dialog/dialog-store";
+
+//#region src/dialog/dialog-store.d.ts
+declare function useDialogStoreProps<T extends Core.DialogStore>(store: T, update: () => void, props: DialogStoreProps): T & {
+  disclosure: DisclosureStore | null | undefined;
+};
+/**
+ * Creates a dialog store to control the state of
+ * [Dialog](https://ariakit.com/components/dialog) components.
+ * @see https://ariakit.com/components/dialog
+ * @example
+ * ```jsx
+ * const dialog = useDialogStore();
+ *
+ * <button onClick={dialog.toggle}>Open dialog</button>
+ * <Dialog store={dialog}>Content</Dialog>
+ * ```
+ */
+declare function useDialogStore(props?: DialogStoreProps): DialogStore;
+interface DialogStoreState extends Core.DialogStoreState, DisclosureStoreState {}
+interface DialogStoreFunctions extends Omit<Core.DialogStoreFunctions, "disclosure">, DisclosureStoreFunctions {}
+interface DialogStoreOptions extends Omit<Core.DialogStoreOptions, "disclosure">, DisclosureStoreOptions {}
+interface DialogStoreProps extends DialogStoreOptions, Omit<Core.DialogStoreProps, "disclosure"> {}
+interface DialogStore extends DialogStoreFunctions, Omit<Store<Core.DialogStore>, "disclosure"> {}
+//#endregion
+export { DialogStoreState as a, DialogStoreProps as i, DialogStoreFunctions as n, useDialogStore as o, DialogStoreOptions as r, useDialogStoreProps as s, DialogStore as t };
+//# sourceMappingURL=dialog-store-Cjt12T_Y.d.ts.map

package/dist/dialog-store-Cjt12T_Y.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"dialog-store-Cjt12T_Y.d.ts","names":["Core","Store","DisclosureStoreFunctions","DisclosureStoreOptions","DisclosureStoreState","useDialogStoreProps","T","DialogStore","DialogStoreProps","_$___disclosure_disclosure_store_ts0","DisclosureStore","store","update","props","disclosure","useDialogStore","DialogStoreState","DialogStoreFunctions","Omit","DialogStoreOptions"],"sources":["../src/dialog/dialog-store.d.ts"],"mappings":";;;;;iBAGwBK,mBAAAA,WAA8BL,IAAAA,CAAKO,WAAAA,CAAAA,CAAaI,KAAAA,EAAOL,CAAAA,EAAGM,MAAAA,cAAoBC,KAAAA,EAAOL,gBAAAA,GAAmBF,CAAAA;EAC5HQ,UAAAA,EAD6HL,eAAAA;AAAAA;;;;;;;;;;;;;iBAezGM,cAAAA,CAAeF,KAAAA,GAAQL,gBAAAA,GAAmBD,WAAW;AAAA,UAC5DS,gBAAAA,SAAyBhB,IAAAA,CAAKgB,gBAAAA,EAAkBZ,oBAAoB;AAAA,UAEpEa,oBAAAA,SAA6BC,IAAAA,CAAKlB,IAAAA,CAAKiB,oBAAAA,iBAAqCf,wBAAAA;AAAAA,UAE5EiB,kBAAAA,SAA2BD,IAAAA,CAAKlB,IAAAA,CAAKmB,kBAAAA,iBAAmChB,sBAAAA;AAAAA,UAExEK,gBAAAA,SAAyBW,kBAAAA,EAAoBD,IAAAA,CAAKlB,IAAAA,CAAKQ,gBAAAA;AAAAA,UAEvDD,WAAAA,SAAoBU,oBAAAA,EAAsBC,IAAAA,CAAKjB,KAAAA,CAAMD,IAAAA,CAAKO,WAAAA"}

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

@@ -0,0 +1,2 @@
+import { a as useDisclosureContent, i as isHidden, n as DisclosureContentOptions, r as DisclosureContentProps, t as DisclosureContent } from "../disclosure-content-BbPkZgAc.js";
+export { DisclosureContent, DisclosureContentOptions, DisclosureContentProps, isHidden, useDisclosureContent };

package/dist/disclosure/disclosure-content.js

@@ -0,0 +1,171 @@
+"use client";
+import { useDisclosureProviderContext } from "./disclosure-context.js";
+import { DialogScopedContextProvider } from "../dialog/dialog-context.js";
+import { createElement, createHook, forwardRef, useId, useMergeRefs, useSafeLayoutEffect, useWrapElement } from "@ariakit/react-utils";
+import { invariant, removeUndefinedValues } from "@ariakit/utils";
+import { useMemo, useRef, useState } from "react";
+import { jsx } from "react/jsx-runtime";
+import { useStoreState } from "@ariakit/react-store";
+import { flushSync } from "react-dom";
+//#region src/disclosure/disclosure-content.tsx
+const TagName = "div";
+function afterTimeout(timeoutMs, cb) {
+	const timeoutId = setTimeout(cb, timeoutMs);
+	return () => clearTimeout(timeoutId);
+}
+function afterPaint(cb) {
+	let raf = requestAnimationFrame(() => {
+		raf = requestAnimationFrame(cb);
+	});
+	return () => cancelAnimationFrame(raf);
+}
+function parseCSSTime(...times) {
+	return times.join(", ").split(", ").reduce((longestTime, currentTimeString) => {
+		const multiplier = currentTimeString.endsWith("ms") ? 1 : 1e3;
+		const currentTime = Number.parseFloat(currentTimeString || "0s") * multiplier;
+		if (currentTime > longestTime) return currentTime;
+		return longestTime;
+	}, 0);
+}
+function isHidden(mounted, hidden, alwaysVisible) {
+	return !alwaysVisible && hidden !== false && (!mounted || !!hidden);
+}
+/**
+* Returns props to create a `DislosureContent` component.
+* @see https://ariakit.com/components/disclosure
+* @example
+* ```jsx
+* const store = useDisclosureStore();
+* const props = useDisclosureContent({ store });
+* <Disclosure store={store}>Disclosure</Disclosure>
+* <Role {...props}>Content</Role>
+* ```
+*/
+const useDisclosureContent = createHook(function useDisclosureContent({ store, alwaysVisible, ...props }) {
+	const context = useDisclosureProviderContext();
+	store = store || context;
+	invariant(store, "DisclosureContent must receive a `store` prop or be wrapped in a DisclosureProvider component.");
+	const ref = useRef(null);
+	const id = useId(props.id);
+	const [transition, setTransition] = useState(null);
+	const open = useStoreState(store, "open");
+	const mounted = useStoreState(store, "mounted");
+	const animated = useStoreState(store, "animated");
+	const contentElement = useStoreState(store, "contentElement");
+	const otherElement = useStoreState(store.disclosure, "contentElement");
+	const hasClosedRef = useRef(false);
+	useSafeLayoutEffect(() => {
+		if (!ref.current) return;
+		store?.setContentElement(ref.current);
+	}, [store]);
+	useSafeLayoutEffect(() => {
+		let previousAnimated;
+		store?.setState("animated", (animated) => {
+			previousAnimated = animated;
+			return true;
+		});
+		return () => {
+			if (previousAnimated === void 0) return;
+			store?.setState("animated", previousAnimated);
+		};
+	}, [store]);
+	useSafeLayoutEffect(() => {
+		if (!animated) {
+			if (!open) {
+				hasClosedRef.current = true;
+				setTransition(null);
+			} else if (hasClosedRef.current) {
+				hasClosedRef.current = false;
+				setTransition("enter");
+			}
+			return;
+		}
+		if (!contentElement?.isConnected) {
+			setTransition(null);
+			return;
+		}
+		return afterPaint(() => {
+			setTransition(open ? "enter" : mounted ? "leave" : null);
+		});
+	}, [
+		animated,
+		contentElement,
+		open,
+		mounted
+	]);
+	useSafeLayoutEffect(() => {
+		if (!store) return;
+		if (!animated) return;
+		if (!transition) return;
+		if (!contentElement) return;
+		const stopAnimation = () => store?.setState("animating", false);
+		const stopAnimationSync = () => flushSync(stopAnimation);
+		if (transition === "leave" && open) return;
+		if (transition === "enter" && !open) return;
+		if (typeof animated === "number") return afterTimeout(animated, stopAnimationSync);
+		const { transitionDuration, animationDuration, transitionDelay, animationDelay } = getComputedStyle(contentElement);
+		const { transitionDuration: transitionDuration2 = "0", animationDuration: animationDuration2 = "0", transitionDelay: transitionDelay2 = "0", animationDelay: animationDelay2 = "0" } = otherElement ? getComputedStyle(otherElement) : {};
+		const timeout = parseCSSTime(transitionDelay, animationDelay, transitionDelay2, animationDelay2) + parseCSSTime(transitionDuration, animationDuration, transitionDuration2, animationDuration2);
+		if (!timeout) {
+			if (transition === "enter") store.setState("animated", false);
+			stopAnimation();
+			return;
+		}
+		return afterTimeout(Math.max(timeout - 1e3 / 60, 0), stopAnimationSync);
+	}, [
+		store,
+		animated,
+		contentElement,
+		otherElement,
+		open,
+		transition
+	]);
+	props = useWrapElement(props, (element) => /* @__PURE__ */ jsx(DialogScopedContextProvider, {
+		value: store,
+		children: element
+	}), [store]);
+	const hidden = isHidden(mounted, props.hidden, alwaysVisible);
+	const styleProp = props.style;
+	const style = useMemo(() => {
+		if (hidden) return {
+			...styleProp,
+			display: "none"
+		};
+		return styleProp;
+	}, [hidden, styleProp]);
+	props = {
+		"data-open": open || void 0,
+		"data-enter": transition === "enter" || void 0,
+		"data-leave": transition === "leave" || void 0,
+		hidden,
+		...props,
+		id,
+		ref: useMergeRefs(id ? store.setContentElement : null, ref, props.ref),
+		style
+	};
+	return removeUndefinedValues(props);
+});
+const DisclosureContentImpl = forwardRef(function DisclosureContentImpl(props) {
+	return createElement(TagName, useDisclosureContent(props));
+});
+/**
+* Renders an element that can be shown or hidden by a
+* [`Disclosure`](https://ariakit.com/components/disclosure) component.
+* @see https://ariakit.com/components/disclosure
+* @example
+* ```jsx {3}
+* <DisclosureProvider>
+*   <Disclosure>Disclosure</Disclosure>
+*   <DisclosureContent>Content</DisclosureContent>
+* </DisclosureProvider>
+* ```
+*/
+const DisclosureContent = forwardRef(function DisclosureContent({ unmountOnHide, ...props }) {
+	const context = useDisclosureProviderContext();
+	if (useStoreState(props.store || context, (state) => !unmountOnHide || state?.mounted) === false) return null;
+	return /* @__PURE__ */ jsx(DisclosureContentImpl, { ...props });
+});
+//#endregion
+export { DisclosureContent, isHidden, useDisclosureContent };
+
+//# sourceMappingURL=disclosure-content.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"disclosure-content.js","names":["timeout"],"sources":["../../src/disclosure/disclosure-content.tsx"],"sourcesContent":["import { useStoreState } from \"@ariakit/react-store\";\nimport {\n  useId,\n  useMergeRefs,\n  useSafeLayoutEffect,\n  useWrapElement,\n  createElement,\n  createHook,\n  forwardRef,\n} from \"@ariakit/react-utils\";\nimport type { Options, Props } from \"@ariakit/react-utils\";\nimport { invariant, removeUndefinedValues } from \"@ariakit/utils\";\nimport type { ElementType } from \"react\";\nimport { useMemo, useRef, useState } from \"react\";\nimport { flushSync } from \"react-dom\";\nimport { DialogScopedContextProvider } from \"../dialog/dialog-context.tsx\";\nimport { useDisclosureProviderContext } from \"./disclosure-context.tsx\";\nimport type { DisclosureStore } from \"./disclosure-store.ts\";\n\nconst TagName = \"div\" satisfies ElementType;\ntype TagName = typeof TagName;\ntype HTMLType = HTMLElementTagNameMap[TagName];\ntype TransitionState = \"enter\" | \"leave\" | null;\n\nfunction afterTimeout(timeoutMs: number, cb: () => void) {\n  const timeoutId = setTimeout(cb, timeoutMs);\n  return () => clearTimeout(timeoutId);\n}\n\nfunction afterPaint(cb: () => void) {\n  let raf = requestAnimationFrame(() => {\n    raf = requestAnimationFrame(cb);\n  });\n  return () => cancelAnimationFrame(raf);\n}\n\nfunction parseCSSTime(...times: string[]) {\n  return times\n    .join(\", \")\n    .split(\", \")\n    .reduce((longestTime, currentTimeString) => {\n      const multiplier = currentTimeString.endsWith(\"ms\") ? 1 : 1000;\n      const currentTime =\n        Number.parseFloat(currentTimeString || \"0s\") * multiplier;\n      // When multiple times are specified, we want to use the longest one so we\n      // wait until the longest transition has finished.\n      if (currentTime > longestTime) return currentTime;\n      return longestTime;\n    }, 0);\n}\n\nexport function isHidden(\n  mounted: boolean,\n  hidden?: boolean | null,\n  alwaysVisible?: boolean | null,\n) {\n  return !alwaysVisible && hidden !== false && (!mounted || !!hidden);\n}\n\n/**\n * Returns props to create a `DislosureContent` component.\n * @see https://ariakit.com/components/disclosure\n * @example\n * ```jsx\n * const store = useDisclosureStore();\n * const props = useDisclosureContent({ store });\n * <Disclosure store={store}>Disclosure</Disclosure>\n * <Role {...props}>Content</Role>\n * ```\n */\nexport const useDisclosureContent = createHook<\n  TagName,\n  DisclosureContentOptions\n>(function useDisclosureContent({ store, alwaysVisible, ...props }) {\n  const context = useDisclosureProviderContext();\n  store = store || context;\n\n  invariant(\n    store,\n    process.env.NODE_ENV !== \"production\" &&\n      \"DisclosureContent must receive a `store` prop or be wrapped in a DisclosureProvider component.\",\n  );\n\n  const ref = useRef<HTMLType>(null);\n  const id = useId(props.id);\n  const [transition, setTransition] = useState<TransitionState>(null);\n  const open = useStoreState(store, \"open\");\n  const mounted = useStoreState(store, \"mounted\");\n  const animated = useStoreState(store, \"animated\");\n  const contentElement = useStoreState(store, \"contentElement\");\n  const otherElement = useStoreState(store.disclosure, \"contentElement\");\n  const hasClosedRef = useRef(false);\n\n  // This is a workaround to avoid the content element from being reset to null\n  // on fast refresh.\n  useSafeLayoutEffect(() => {\n    if (!ref.current) return;\n    store?.setContentElement(ref.current);\n  }, [store]);\n\n  // When the disclosure content element is rendered, we automatically set the\n  // animated state to true. If there's no enter animation, the animated state\n  // will be set to false later on.\n  useSafeLayoutEffect(() => {\n    let previousAnimated: boolean | number | undefined;\n    store?.setState(\"animated\", (animated) => {\n      previousAnimated = animated;\n      return true;\n    });\n    return () => {\n      if (previousAnimated === undefined) return;\n      store?.setState(\"animated\", previousAnimated);\n    };\n  }, [store]);\n\n  useSafeLayoutEffect(() => {\n    if (!animated) {\n      // When animation detection has disabled animations (e.g., no CSS\n      // transition was detected on the content element), manage data-enter\n      // so wrapper elements using :has([data-enter]) work correctly even\n      // when the content element itself has no transitions.\n      if (!open) {\n        hasClosedRef.current = true;\n        setTransition(null);\n      } else if (hasClosedRef.current) {\n        // On reopen after animation detection disabled animations, restore\n        // data-enter so enter styles are re-applied.\n        hasClosedRef.current = false;\n        setTransition(\"enter\");\n      }\n      return;\n    }\n    // When the disclosure content element is rendered in a portal, we need to\n    // wait for the portal to be mounted and connected to the DOM before we\n    // can start the animation.\n    if (!contentElement?.isConnected) {\n      setTransition(null);\n      return;\n    }\n    // Double requestAnimationFrame is necessary here to avoid potential bugs\n    // when the data attribute is added before the element is fully rendered\n    // in the DOM, which wouldn't trigger the animation.\n    return afterPaint(() => {\n      setTransition(open ? \"enter\" : mounted ? \"leave\" : null);\n    });\n  }, [animated, contentElement, open, mounted]);\n\n  useSafeLayoutEffect(() => {\n    if (!store) return;\n    if (!animated) return;\n    if (!transition) return;\n    if (!contentElement) return;\n    const stopAnimation = () => store?.setState(\"animating\", false);\n    const stopAnimationSync = () => flushSync(stopAnimation);\n    // Ignore transition states that don't match the current open state. This\n    // may happen because transitions are updated asynchronously using\n    // requestAnimationFrame.\n    if (transition === \"leave\" && open) return;\n    if (transition === \"enter\" && !open) return;\n    // When the animated state is a number, the user has manually set the\n    // animation timeout, so we just respect it.\n    if (typeof animated === \"number\") {\n      const timeout = animated;\n      return afterTimeout(timeout, stopAnimationSync);\n    }\n    // We need to parse the CSS transition/animation duration and delay to know\n    // when the animation ends. This is safer than relying on the\n    // transitionend/animationend events because it's not guaranteed that these\n    // events will fire. For example, if the element is removed from the DOM\n    // before the animation ends or if the animation wasn't triggered in the\n    // first place, the events won't fire. Besides, there may be multiple\n    // transitions or animations with different durations and delays, and we\n    // need to consider the longest one.\n    const {\n      transitionDuration,\n      animationDuration,\n      transitionDelay,\n      animationDelay,\n    } = getComputedStyle(contentElement);\n    // If we're rendering a dialog backdrop, otherElement will be the dialog\n    // element itself. We need to consider both the backdrop and the dialog\n    // animation/transition durations and delays because the dialog may be\n    // animated while the backdrop is not.\n    const {\n      transitionDuration: transitionDuration2 = \"0\",\n      animationDuration: animationDuration2 = \"0\",\n      transitionDelay: transitionDelay2 = \"0\",\n      animationDelay: animationDelay2 = \"0\",\n    } = otherElement ? getComputedStyle(otherElement) : {};\n    const delay = parseCSSTime(\n      transitionDelay,\n      animationDelay,\n      transitionDelay2,\n      animationDelay2,\n    );\n    const duration = parseCSSTime(\n      transitionDuration,\n      animationDuration,\n      transitionDuration2,\n      animationDuration2,\n    );\n    const timeout = delay + duration;\n    // If the timeout is zero, there's no animation or transition, either\n    // because they weren't defined in the CSS or the duration was explicitly\n    // set to zero. In this scenario, we can halt the animation right away\n    // and, if we're entering, we can set the animated state to false so\n    // the element unmounts immediately on close without waiting for a\n    // leave animation.\n    if (!timeout) {\n      if (transition === \"enter\") {\n        store.setState(\"animated\", false);\n      }\n      stopAnimation();\n      return;\n    }\n    // Since setTimeout may be delayed by a few milliseconds, we need to\n    // subtract a frame duration from the timeout to make sure the animation is\n    // stopped right after it ends, preventing flickering.\n    const frameRate = 1000 / 60;\n    const maxTimeout = Math.max(timeout - frameRate, 0);\n    return afterTimeout(maxTimeout, stopAnimationSync);\n  }, [store, animated, contentElement, otherElement, open, transition]);\n\n  props = useWrapElement(\n    props,\n    (element) => (\n      <DialogScopedContextProvider value={store}>\n        {element}\n      </DialogScopedContextProvider>\n    ),\n    [store],\n  );\n\n  const hidden = isHidden(mounted, props.hidden, alwaysVisible);\n  const styleProp = props.style;\n  const style = useMemo(() => {\n    if (hidden) {\n      return { ...styleProp, display: \"none\" };\n    }\n    return styleProp;\n  }, [hidden, styleProp]);\n\n  props = {\n    \"data-open\": open || undefined,\n    \"data-enter\": transition === \"enter\" || undefined,\n    \"data-leave\": transition === \"leave\" || undefined,\n    hidden,\n    ...props,\n    id,\n    ref: useMergeRefs(id ? store.setContentElement : null, ref, props.ref),\n    style,\n  };\n\n  return removeUndefinedValues(props);\n});\n\nconst DisclosureContentImpl = forwardRef(function DisclosureContentImpl(\n  props: DisclosureContentProps,\n) {\n  const htmlProps = useDisclosureContent(props);\n  return createElement(TagName, htmlProps);\n});\n\n/**\n * Renders an element that can be shown or hidden by a\n * [`Disclosure`](https://ariakit.com/components/disclosure) component.\n * @see https://ariakit.com/components/disclosure\n * @example\n * ```jsx {3}\n * <DisclosureProvider>\n *   <Disclosure>Disclosure</Disclosure>\n *   <DisclosureContent>Content</DisclosureContent>\n * </DisclosureProvider>\n * ```\n */\nexport const DisclosureContent = forwardRef(function DisclosureContent({\n  unmountOnHide,\n  ...props\n}: DisclosureContentProps) {\n  const context = useDisclosureProviderContext();\n  const store = props.store || context;\n  const mounted = useStoreState(\n    store,\n    (state) => !unmountOnHide || state?.mounted,\n  );\n  if (mounted === false) return null;\n  return <DisclosureContentImpl {...props} />;\n});\n\nexport interface DisclosureContentOptions<\n  _T extends ElementType = TagName,\n> extends Options {\n  /**\n   * Object returned by the\n   * [`useDisclosureStore`](https://ariakit.com/reference/use-disclosure-store)\n   * hook. If not provided, the closest\n   * [`DisclosureProvider`](https://ariakit.com/reference/disclosure-provider)\n   * component's context will be used.\n   */\n  store?: DisclosureStore;\n  /**\n   * Determines whether the content element should remain visible even when the\n   * [`open`](https://ariakit.com/reference/disclosure-provider#open) state is\n   * `false`. If this prop is set to `true`, the `hidden` prop and the `display:\n   * none` style will not be applied, unless explicitly set otherwise.\n   *\n   * This prop is particularly useful when using third-party animation libraries\n   * such as Motion or React Spring, where the element needs to be\n   * visible for exit animations to work.\n   *\n   * Live examples:\n   * - [Dialog with\n   *   Motion](https://ariakit.com/examples/dialog-framer-motion)\n   * - [Menu with\n   *   Motion](https://ariakit.com/examples/menu-framer-motion)\n   * - [Tooltip with\n   *   Motion](https://ariakit.com/examples/tooltip-framer-motion)\n   * - [Dialog with details &\n   *   summary](https://ariakit.com/examples/dialog-details)\n   * @default false\n   */\n  alwaysVisible?: boolean;\n  /**\n   * When set to `true`, the content element will be unmounted and removed from\n   * the DOM when it's hidden.\n   *\n   * Live examples:\n   * - [Navigation Menubar](https://ariakit.com/examples/menubar-navigation)\n   * - [Combobox with integrated\n   *   filter](https://ariakit.com/examples/combobox-filtering-integrated)\n   * - [Textarea with inline\n   *   Combobox](https://ariakit.com/examples/combobox-textarea)\n   * - [Standalone Popover](https://ariakit.com/examples/popover-standalone)\n   * - [Animated Select](https://ariakit.com/examples/select-animated)\n   * - [Multi-Select](https://ariakit.com/examples/select-multiple)\n   * @default false\n   */\n  unmountOnHide?: boolean;\n}\n\nexport type DisclosureContentProps<T extends ElementType = TagName> = Props<\n  T,\n  DisclosureContentOptions<T>\n>;\n"],"mappings":"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"}

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

@@ -0,0 +1,24 @@
+import { t as DisclosureStore } from "../disclosure-store-BsaBaRKv.js";
+
+//#region src/disclosure/disclosure-context.d.ts
+/**
+ * Returns the disclosure store from the nearest disclosure container.
+ * @example
+ * function Disclosure() {
+ *   const store = useDisclosureContext();
+ *
+ *   if (!store) {
+ *     throw new Error("Disclosure must be wrapped in DisclosureProvider");
+ *   }
+ *
+ *   // Use the store...
+ * }
+ */
+declare const useDisclosureContext: () => DisclosureStore | undefined;
+declare const useDisclosureScopedContext: (onlyScoped?: boolean) => DisclosureStore | undefined;
+declare const useDisclosureProviderContext: () => DisclosureStore | undefined;
+declare const DisclosureContextProvider: (props: import("react").ProviderProps<DisclosureStore | undefined>) => import("react/jsx-runtime").JSX.Element;
+declare const DisclosureScopedContextProvider: (props: import("react").ProviderProps<DisclosureStore | undefined>) => import("react/jsx-runtime").JSX.Element;
+//#endregion
+export { DisclosureContextProvider, DisclosureScopedContextProvider, useDisclosureContext, useDisclosureProviderContext, useDisclosureScopedContext };
+//# sourceMappingURL=disclosure-context.d.ts.map

package/dist/disclosure/disclosure-context.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"disclosure-context.d.ts","names":["DisclosureStore","useDisclosureContext","useDisclosureScopedContext","onlyScoped","useDisclosureProviderContext","DisclosureContextProvider","ProviderProps","props","JSX","Element","DisclosureScopedContextProvider"],"sources":["../../src/disclosure/disclosure-context.d.ts"],"mappings":";;;;;AAcA;;;;AAAgE;AAChE;;;;AAA0F;AAC1F;cAFqBC,oBAAAA,QAA4BD,eAAe;AAAA,cAC3CE,0BAAAA,GAA6BC,UAAAA,eAAyBH,eAAe;AAAA,cACrEI,4BAAAA,QAAoCJ,eAAe;AAAA,cACnDK,yBAAAA,GAA4BE,KAAAA,kBAAuBD,aAAAA,CAAcN,eAAe,8CAA8CQ,GAAAA,CAAIC,OAAAA;AAAAA,cAClIC,+BAAAA,GAAkCH,KAAAA,kBAAuBD,aAAAA,CAAcN,eAAe,8CAA8CQ,GAAAA,CAAIC,OAAAA"}

package/dist/disclosure/disclosure-context.js

@@ -0,0 +1,26 @@
+"use client";
+import { createStoreContext } from "@ariakit/react-utils";
+//#region src/disclosure/disclosure-context.tsx
+const ctx = createStoreContext();
+/**
+* Returns the disclosure store from the nearest disclosure container.
+* @example
+* function Disclosure() {
+*   const store = useDisclosureContext();
+*
+*   if (!store) {
+*     throw new Error("Disclosure must be wrapped in DisclosureProvider");
+*   }
+*
+*   // Use the store...
+* }
+*/
+const useDisclosureContext = ctx.useContext;
+const useDisclosureScopedContext = ctx.useScopedContext;
+const useDisclosureProviderContext = ctx.useProviderContext;
+const DisclosureContextProvider = ctx.ContextProvider;
+const DisclosureScopedContextProvider = ctx.ScopedContextProvider;
+//#endregion
+export { DisclosureContextProvider, DisclosureScopedContextProvider, useDisclosureContext, useDisclosureProviderContext, useDisclosureScopedContext };
+
+//# sourceMappingURL=disclosure-context.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"disclosure-context.js","names":[],"sources":["../../src/disclosure/disclosure-context.tsx"],"sourcesContent":["import { createStoreContext } from \"@ariakit/react-utils\";\nimport type { DisclosureStore } from \"./disclosure-store.ts\";\n\nconst ctx = createStoreContext<DisclosureStore>();\n\n/**\n * Returns the disclosure store from the nearest disclosure container.\n * @example\n * function Disclosure() {\n *   const store = useDisclosureContext();\n *\n *   if (!store) {\n *     throw new Error(\"Disclosure must be wrapped in DisclosureProvider\");\n *   }\n *\n *   // Use the store...\n * }\n */\nexport const useDisclosureContext = ctx.useContext;\n\nexport const useDisclosureScopedContext = ctx.useScopedContext;\n\nexport const useDisclosureProviderContext = ctx.useProviderContext;\n\nexport const DisclosureContextProvider = ctx.ContextProvider;\n\nexport const DisclosureScopedContextProvider = ctx.ScopedContextProvider;\n"],"mappings":";;;;;;;;;;;;;;;;;AAoBA,MAAa,uBAAA,IAAA;AAEb,MAAa,6BAAA,IAA+B;AAE5C,MAAa,+BAA4B,IAAI;AAE7C,MAAa,4BAAA,IAAA"}

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

@@ -0,0 +1,23 @@
+import { i as DisclosureStoreProps } from "../disclosure-store-BsaBaRKv.js";
+import { ReactNode } from "react";
+
+//#region src/disclosure/disclosure-provider.d.ts
+/**
+ * Provides a disclosure store to
+ * [Disclosure](https://ariakit.com/components/disclosure) components.
+ * @see https://ariakit.com/components/disclosure
+ * @example
+ * ```jsx
+ * <DisclosureProvider>
+ *   <Disclosure />
+ *   <DisclosureContent />
+ * </DisclosureProvider>
+ * ```
+ */
+declare function DisclosureProvider(props?: DisclosureProviderProps): import("react/jsx-runtime").JSX.Element;
+interface DisclosureProviderProps extends DisclosureStoreProps {
+  children?: ReactNode;
+}
+//#endregion
+export { DisclosureProvider, DisclosureProviderProps };
+//# sourceMappingURL=disclosure-provider.d.ts.map

package/dist/disclosure/disclosure-provider.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"disclosure-provider.d.ts","names":["ReactNode","DisclosureStoreProps","DisclosureProvider","DisclosureProviderProps","props","JSX","Element","children"],"sources":["../../src/disclosure/disclosure-provider.d.ts"],"mappings":";;;;;;AAcA;;;;;;;;;AAAoH;iBAA5FE,kBAAAA,CAAmBE,KAAAA,GAAQD,uBAAuB,+BAA+BE,GAAAA,CAAIC,OAAAA;AAAAA,UAC5FH,uBAAAA,SAAgCF,oBAAoB;EACjEM,QAAAA,GAAWP,SAAAA;AAAAA"}

package/dist/disclosure/disclosure-provider.js

@@ -0,0 +1,27 @@
+"use client";
+import { DisclosureContextProvider } from "./disclosure-context.js";
+import { useDisclosureStore } from "./disclosure-store.js";
+import { jsx } from "react/jsx-runtime";
+//#region src/disclosure/disclosure-provider.tsx
+/**
+* Provides a disclosure store to
+* [Disclosure](https://ariakit.com/components/disclosure) components.
+* @see https://ariakit.com/components/disclosure
+* @example
+* ```jsx
+* <DisclosureProvider>
+*   <Disclosure />
+*   <DisclosureContent />
+* </DisclosureProvider>
+* ```
+*/
+function DisclosureProvider(props = {}) {
+	return /* @__PURE__ */ jsx(DisclosureContextProvider, {
+		value: useDisclosureStore(props),
+		children: props.children
+	});
+}
+//#endregion
+export { DisclosureProvider };
+
+//# sourceMappingURL=disclosure-provider.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"disclosure-provider.js","names":[],"sources":["../../src/disclosure/disclosure-provider.tsx"],"sourcesContent":["import type { ReactNode } from \"react\";\nimport { DisclosureContextProvider } from \"./disclosure-context.tsx\";\nimport type { DisclosureStoreProps } from \"./disclosure-store.ts\";\nimport { useDisclosureStore } from \"./disclosure-store.ts\";\n\n/**\n * Provides a disclosure store to\n * [Disclosure](https://ariakit.com/components/disclosure) components.\n * @see https://ariakit.com/components/disclosure\n * @example\n * ```jsx\n * <DisclosureProvider>\n *   <Disclosure />\n *   <DisclosureContent />\n * </DisclosureProvider>\n * ```\n */\nexport function DisclosureProvider(props: DisclosureProviderProps = {}) {\n  const store = useDisclosureStore(props);\n  return (\n    <DisclosureContextProvider value={store}>\n      {props.children}\n    </DisclosureContextProvider>\n  );\n}\n\nexport interface DisclosureProviderProps extends DisclosureStoreProps {\n  children?: ReactNode;\n}\n"],"mappings":";;;;;;;;;;;;;;;;;SAoBI,mBAAC,QAAA,CAAA,GAAA;QAFW,oBAAmB,2BAEO;4BAC7B,KAAA;EACkB,UAAA,MAAA;CAE/B,CAAA"}

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

@@ -0,0 +1,2 @@
+import { a as DisclosureStoreState, i as DisclosureStoreProps, n as DisclosureStoreFunctions, o as useDisclosureStore, r as DisclosureStoreOptions, s as useDisclosureStoreProps, t as DisclosureStore } from "../disclosure-store-BsaBaRKv.js";
+export { DisclosureStore, DisclosureStoreFunctions, DisclosureStoreOptions, DisclosureStoreProps, DisclosureStoreState, useDisclosureStore, useDisclosureStoreProps };

package/dist/disclosure/disclosure-store.js

@@ -0,0 +1,32 @@
+"use client";
+import { useUpdateEffect } from "@ariakit/react-utils";
+import { useStore, useStoreProps } from "@ariakit/react-store";
+import * as Core from "@ariakit/components/disclosure/disclosure-store";
+//#region src/disclosure/disclosure-store.ts
+function useDisclosureStoreProps(store, update, props) {
+	useUpdateEffect(update, [props.store, props.disclosure]);
+	useStoreProps(store, props, "open", "setOpen");
+	useStoreProps(store, props, "mounted", "setMounted");
+	useStoreProps(store, props, "animated");
+	return Object.assign(store, { disclosure: props.disclosure });
+}
+/**
+* Creates a disclosure store to control the state of
+* [Disclosure](https://ariakit.com/components/disclosure) components.
+* @see https://ariakit.com/components/disclosure
+* @example
+* ```jsx
+* const disclosure = useDisclosureStore();
+*
+* <Disclosure store={disclosure}>Disclosure</Disclosure>
+* <DisclosureContent store={disclosure}>Content</DisclosureContent>
+* ```
+*/
+function useDisclosureStore(props = {}) {
+	const [store, update] = useStore(Core.createDisclosureStore, props);
+	return useDisclosureStoreProps(store, update, props);
+}
+//#endregion
+export { useDisclosureStore, useDisclosureStoreProps };
+
+//# sourceMappingURL=disclosure-store.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"disclosure-store.js","names":[],"sources":["../../src/disclosure/disclosure-store.ts"],"sourcesContent":["import * as Core from \"@ariakit/components/disclosure/disclosure-store\";\nimport { useStore, useStoreProps } from \"@ariakit/react-store\";\nimport type { Store } from \"@ariakit/react-store\";\nimport { useUpdateEffect } from \"@ariakit/react-utils\";\n\nexport function useDisclosureStoreProps<T extends Core.DisclosureStore>(\n  store: T,\n  update: () => void,\n  props: DisclosureStoreProps,\n) {\n  useUpdateEffect(update, [props.store, props.disclosure]);\n  useStoreProps(store, props, \"open\", \"setOpen\");\n  useStoreProps(store, props, \"mounted\", \"setMounted\");\n  useStoreProps(store, props, \"animated\");\n\n  return Object.assign(store, { disclosure: props.disclosure });\n}\n\n/**\n * Creates a disclosure store to control the state of\n * [Disclosure](https://ariakit.com/components/disclosure) components.\n * @see https://ariakit.com/components/disclosure\n * @example\n * ```jsx\n * const disclosure = useDisclosureStore();\n *\n * <Disclosure store={disclosure}>Disclosure</Disclosure>\n * <DisclosureContent store={disclosure}>Content</DisclosureContent>\n * ```\n */\nexport function useDisclosureStore(\n  props: DisclosureStoreProps = {},\n): DisclosureStore {\n  const [store, update] = useStore(Core.createDisclosureStore, props);\n  return useDisclosureStoreProps(store, update, props);\n}\n\nexport interface DisclosureStoreState extends Core.DisclosureStoreState {}\n\nexport interface DisclosureStoreFunctions\n  extends\n    Pick<DisclosureStoreOptions, \"disclosure\">,\n    Omit<Core.DisclosureStoreFunctions, \"disclosure\"> {}\n\nexport interface DisclosureStoreOptions extends Core.DisclosureStoreOptions {\n  /**\n   * A callback that gets called when the\n   * [`open`](https://ariakit.com/reference/disclosure-provider#open) state\n   * changes.\n   * @example\n   * const [open, setOpen] = useState(false);\n   * const disclosure = useDisclosureStore({ open, setOpen });\n   */\n  setOpen?: (open: DisclosureStoreState[\"open\"]) => void;\n  /**\n   * A callback that gets called when the `mounted` state changes.\n   * @example\n   * const [mounted, setMounted] = useState(false);\n   * const disclosure = useDisclosureStore({ setMounted });\n   */\n  setMounted?: (mounted: DisclosureStoreState[\"mounted\"]) => void;\n  /**\n   * A reference to another disclosure store that controls another disclosure\n   * component to keep them in sync. Element states like `contentElement` and\n   * `disclosureElement` won't be synced. For that, use the\n   * [`store`](https://ariakit.com/reference/disclosure-provider#store) prop\n   * instead.\n   *\n   * Live examples:\n   * - [Command Menu](https://ariakit.com/examples/dialog-combobox-command-menu)\n   * - [Command Menu with\n   *   Tabs](https://ariakit.com/examples/dialog-combobox-tab-command-menu)\n   */\n  disclosure?: DisclosureStore | null;\n}\n\nexport interface DisclosureStoreProps\n  extends\n    DisclosureStoreOptions,\n    Omit<Core.DisclosureStoreProps, \"disclosure\"> {}\n\nexport interface DisclosureStore\n  extends\n    DisclosureStoreFunctions,\n    Omit<Store<Core.DisclosureStore>, \"disclosure\"> {}\n"],"mappings":";;;;;SAUE,wBAA+B,OAAO,QAAM,OAAU;CACtD,gBAAc,QAAO,CAAA,MAAO,OAAQ,MAAA,UAAS,CAAA;CAC7C,cAAc,OAAO,OAAO,QAAA,SAAW;CACvC,cAAc,OAAO,OAAO,WAAU,YAAA;CAEtC,cAAc,OAAO,OAAO,UAAE;CAChC,OAAA,OAAA,OAAA,OAAA,EAAA,YAAA,MAAA,WAAA,CAAA;;;;;;;;;;;;;;SAiBS,mBAAiB,QAAS,CAAA,GAAK;CACtC,MAAA,CAAO,OAAA,UAAA,SAAwB,KAAO,uBAAa,KAAA;CACrD,OAAA,wBAAA,OAAA,QAAA,KAAA"}

package/dist/disclosure/disclosure.d.ts

@@ -0,0 +1,2 @@
+import { i as useDisclosure, n as DisclosureOptions, r as DisclosureProps, t as Disclosure } from "../disclosure-CQ37hPVP.js";
+export { Disclosure, DisclosureOptions, DisclosureProps, useDisclosure };

package/dist/disclosure/disclosure.js

@@ -0,0 +1,83 @@
+"use client";
+import { useButton } from "../button/button.js";
+import { useDisclosureProviderContext } from "./disclosure-context.js";
+import { createElement, createHook, forwardRef, useBooleanEvent, useEvent, useMergeRefs, useMetadataProps } from "@ariakit/react-utils";
+import { invariant } from "@ariakit/utils";
+import { useEffect, useRef, useState } from "react";
+import { useStoreState } from "@ariakit/react-store";
+//#region src/disclosure/disclosure.tsx
+const TagName = "button";
+const symbol = Symbol("disclosure");
+/**
+* Returns props to create a `Disclosure` component.
+* @see https://ariakit.com/components/disclosure
+* @example
+* ```jsx
+* const store = useDisclosureStore();
+* const props = useDisclosure({ store });
+* <Role {...props}>Disclosure</Role>
+* <DisclosureContent store={store}>Content</DisclosureContent>
+* ```
+*/
+const useDisclosure = createHook(function useDisclosure({ store, toggleOnClick = true, ...props }) {
+	const context = useDisclosureProviderContext();
+	store = store || context;
+	invariant(store, "Disclosure must receive a `store` prop or be wrapped in a DisclosureProvider component.");
+	const ref = useRef(null);
+	const [expanded, setExpanded] = useState(false);
+	const disclosureElement = useStoreState(store, "disclosureElement");
+	const open = useStoreState(store, "open");
+	useEffect(() => {
+		let isCurrentDisclosure = disclosureElement === ref.current;
+		if (!disclosureElement?.isConnected) {
+			store?.setDisclosureElement(ref.current);
+			isCurrentDisclosure = true;
+		}
+		setExpanded(open && isCurrentDisclosure);
+	}, [
+		disclosureElement,
+		store,
+		open
+	]);
+	const onClickProp = props.onClick;
+	const toggleOnClickProp = useBooleanEvent(toggleOnClick);
+	const [isDuplicate, metadataProps] = useMetadataProps(props, symbol, true);
+	const onClick = useEvent((event) => {
+		onClickProp?.(event);
+		if (event.defaultPrevented) return;
+		if (isDuplicate) return;
+		if (!toggleOnClickProp(event)) return;
+		store?.setDisclosureElement(event.currentTarget);
+		store?.toggle();
+	});
+	props = {
+		"aria-expanded": expanded,
+		"aria-controls": useStoreState(store, "contentElement")?.id,
+		...metadataProps,
+		...props,
+		ref: useMergeRefs(ref, props.ref),
+		onClick
+	};
+	props = useButton(props);
+	return props;
+});
+/**
+* Renders an element that controls the visibility of a
+* [`DisclosureContent`](https://ariakit.com/reference/disclosure-content)
+* element.
+* @see https://ariakit.com/components/disclosure
+* @example
+* ```jsx {2}
+* <DisclosureProvider>
+*   <Disclosure>Disclosure</Disclosure>
+*   <DisclosureContent>Content</DisclosureContent>
+* </DisclosureProvider>
+* ```
+*/
+const Disclosure = forwardRef(function Disclosure(props) {
+	return createElement(TagName, useDisclosure(props));
+});
+//#endregion
+export { Disclosure, useDisclosure };
+
+//# sourceMappingURL=disclosure.js.map

package/dist/disclosure/disclosure.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"disclosure.js","names":[],"sources":["../../src/disclosure/disclosure.tsx"],"sourcesContent":["import { useStoreState } from \"@ariakit/react-store\";\nimport {\n  useBooleanEvent,\n  useEvent,\n  useMergeRefs,\n  useMetadataProps,\n  createElement,\n  createHook,\n  forwardRef,\n} from \"@ariakit/react-utils\";\nimport type { Props } from \"@ariakit/react-utils\";\nimport { invariant } from \"@ariakit/utils\";\nimport type { BooleanOrCallback } from \"@ariakit/utils\";\nimport type { ElementType, MouseEvent } from \"react\";\nimport { useEffect, useRef, useState } from \"react\";\nimport type { ButtonOptions } from \"../button/button.tsx\";\nimport { useButton } from \"../button/button.tsx\";\nimport { useDisclosureProviderContext } from \"./disclosure-context.tsx\";\nimport type { DisclosureStore } from \"./disclosure-store.ts\";\n\nconst TagName = \"button\" satisfies ElementType;\ntype TagName = typeof TagName;\ntype HTMLType = HTMLElementTagNameMap[TagName];\n\nconst symbol = Symbol(\"disclosure\");\n\n/**\n * Returns props to create a `Disclosure` component.\n * @see https://ariakit.com/components/disclosure\n * @example\n * ```jsx\n * const store = useDisclosureStore();\n * const props = useDisclosure({ store });\n * <Role {...props}>Disclosure</Role>\n * <DisclosureContent store={store}>Content</DisclosureContent>\n * ```\n */\nexport const useDisclosure = createHook<TagName, DisclosureOptions>(\n  function useDisclosure({ store, toggleOnClick = true, ...props }) {\n    const context = useDisclosureProviderContext();\n    store = store || context;\n\n    invariant(\n      store,\n      process.env.NODE_ENV !== \"production\" &&\n        \"Disclosure must receive a `store` prop or be wrapped in a DisclosureProvider component.\",\n    );\n\n    const ref = useRef<HTMLType>(null);\n    const [expanded, setExpanded] = useState(false);\n    const disclosureElement = useStoreState(store, \"disclosureElement\");\n    const open = useStoreState(store, \"open\");\n\n    // Assigns the disclosure element whenever it's undefined or disconnected\n    // from the DOM. If the current element is the disclosure element, it will\n    // get the `aria-expanded` attribute set to `true` when the disclosure\n    // content is open.\n    useEffect(() => {\n      let isCurrentDisclosure = disclosureElement === ref.current;\n      if (!disclosureElement?.isConnected) {\n        store?.setDisclosureElement(ref.current);\n        isCurrentDisclosure = true;\n      }\n      setExpanded(open && isCurrentDisclosure);\n    }, [disclosureElement, store, open]);\n\n    const onClickProp = props.onClick;\n    const toggleOnClickProp = useBooleanEvent(toggleOnClick);\n    const [isDuplicate, metadataProps] = useMetadataProps(props, symbol, true);\n\n    const onClick = useEvent((event: MouseEvent<HTMLType>) => {\n      onClickProp?.(event);\n      if (event.defaultPrevented) return;\n      if (isDuplicate) return;\n      if (!toggleOnClickProp(event)) return;\n      store?.setDisclosureElement(event.currentTarget);\n      store?.toggle();\n    });\n\n    const contentElement = useStoreState(store, \"contentElement\");\n\n    props = {\n      \"aria-expanded\": expanded,\n      \"aria-controls\": contentElement?.id,\n      ...metadataProps,\n      ...props,\n      ref: useMergeRefs(ref, props.ref),\n      onClick,\n    };\n\n    props = useButton(props);\n\n    return props;\n  },\n);\n\n/**\n * Renders an element that controls the visibility of a\n * [`DisclosureContent`](https://ariakit.com/reference/disclosure-content)\n * element.\n * @see https://ariakit.com/components/disclosure\n * @example\n * ```jsx {2}\n * <DisclosureProvider>\n *   <Disclosure>Disclosure</Disclosure>\n *   <DisclosureContent>Content</DisclosureContent>\n * </DisclosureProvider>\n * ```\n */\nexport const Disclosure = forwardRef(function Disclosure(\n  props: DisclosureProps,\n) {\n  const htmlProps = useDisclosure(props);\n  return createElement(TagName, htmlProps);\n});\n\nexport interface DisclosureOptions<\n  T extends ElementType = TagName,\n> extends ButtonOptions<T> {\n  /**\n   * Object returned by the\n   * [`useDisclosureStore`](https://ariakit.com/reference/use-disclosure-store)\n   * hook. If not provided, the closest\n   * [`DisclosureProvider`](https://ariakit.com/reference/disclosure-provider)\n   * component's context will be used.\n   */\n  store?: DisclosureStore;\n  /**\n   * Determines whether\n   * [`toggle`](https://ariakit.com/reference/use-disclosure-store#toggle) will\n   * be called on click. This is useful if you want to handle the toggle logic\n   * yourself.\n   *\n   * Live examples:\n   * - [Navigation Menubar](https://ariakit.com/examples/menubar-navigation)\n   * @default true\n   */\n  toggleOnClick?: BooleanOrCallback<MouseEvent<HTMLElement>>;\n}\n\nexport type DisclosureProps<T extends ElementType = TagName> = Props<\n  T,\n  DisclosureOptions<T>\n>;\n"],"mappings":";;;;;;;;AAwBA,MAAM,UAAS;;;;;;;;;;;;;MAeX,gBAAgB,WAAA,SAAA,cAA6B,EAAA,OAAA,gBAAA,MAAA,GAAA,SAAA;CAC7C,MAAA,UAAQ,6BAAS;CAEjB,QAAA,SAGI;CAGJ,UAAM,OAAM,yFAAqB;CACjC,MAAM,MAAC,OAAU,IAAA;CACjB,MAAM,CAAA,UAAA,eAAoB,SAAc,KAAA;CACxC,MAAM,oBAAO,cAA2B,OAAA,mBAAA;CAMxC,MAAA,OAAA,cAAgB,OAAA,MAAA;iBACV;EACJ,IAAI,sBAAoB,sBAAa,IAAA;MACnC,CAAA,mBAAO,aAAyB;GAChC,OAAA,qBAAsB,IAAA,OAAA;GACxB,sBAAA;EACA;EACF,YAAG,QAAA,mBAAA;IAAC;EAAmB;EAAO;EAAK;CAEnC,CAAA;CACA,MAAM,cAAA,MAAoB;CAC1B,MAAM,oBAAc,gBAAiB,aAAiB;CAEtD,MAAM,CAAA,aAAU,iBAA0C,iBAAA,OAAA,QAAA,IAAA;OACxD,UAAc,UAAK,UAAA;EACnB,cAAU,KAAA;EACV,IAAI,MAAA,kBAAa;EACjB,IAAI,aAAC;EACL,IAAA,CAAA,kBAAO,KAAqB,GAAA;EAC5B,OAAO,qBAAO,MAAA,aAAA;EACf,OAAA,OAAA;CAID,CAAA;SACE;EACA,iBAJqB;EAKrB,iBAAG,cAAA,OAAA,gBAAA,GAAA;EACH,GAAG;EACH,GAAA;EACA,KAAA,aAAA,KAAA,MAAA,GAAA;EACF;CAEA;CAEA,QAAO,UAAA,KAAA;CAEX,OAAA;;;;;;;;;;;;;;;MAmBE,aAAO,WAAc,SADH,WACoB,OAAC;CACxC,OAAA,cAAA,SAAA,cAAA,KAAA,CAAA"}

package/dist/disclosure-CQ37hPVP.d.ts

@@ -0,0 +1,60 @@
+import { n as ButtonOptions } from "./button-Cp853csH.js";
+import { t as DisclosureStore } from "./disclosure-store-BsaBaRKv.js";
+import { Props } from "@ariakit/react-utils";
+import { ElementType, MouseEvent } from "react";
+import { BooleanOrCallback } from "@ariakit/utils";
+
+//#region src/disclosure/disclosure.d.ts
+declare const TagName = "button";
+type TagName = typeof TagName;
+/**
+ * Returns props to create a `Disclosure` component.
+ * @see https://ariakit.com/components/disclosure
+ * @example
+ * ```jsx
+ * const store = useDisclosureStore();
+ * const props = useDisclosure({ store });
+ * <Role {...props}>Disclosure</Role>
+ * <DisclosureContent store={store}>Content</DisclosureContent>
+ * ```
+ */
+declare const useDisclosure: import("@ariakit/react-utils").Hook<"button", DisclosureOptions<"button">>;
+/**
+ * Renders an element that controls the visibility of a
+ * [`DisclosureContent`](https://ariakit.com/reference/disclosure-content)
+ * element.
+ * @see https://ariakit.com/components/disclosure
+ * @example
+ * ```jsx {2}
+ * <DisclosureProvider>
+ *   <Disclosure>Disclosure</Disclosure>
+ *   <DisclosureContent>Content</DisclosureContent>
+ * </DisclosureProvider>
+ * ```
+ */
+declare const Disclosure: (props: DisclosureProps) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>;
+interface DisclosureOptions<T extends ElementType = TagName> extends ButtonOptions<T> {
+  /**
+   * Object returned by the
+   * [`useDisclosureStore`](https://ariakit.com/reference/use-disclosure-store)
+   * hook. If not provided, the closest
+   * [`DisclosureProvider`](https://ariakit.com/reference/disclosure-provider)
+   * component's context will be used.
+   */
+  store?: DisclosureStore;
+  /**
+   * Determines whether
+   * [`toggle`](https://ariakit.com/reference/use-disclosure-store#toggle) will
+   * be called on click. This is useful if you want to handle the toggle logic
+   * yourself.
+   *
+   * Live examples:
+   * - [Navigation Menubar](https://ariakit.com/examples/menubar-navigation)
+   * @default true
+   */
+  toggleOnClick?: BooleanOrCallback<MouseEvent<HTMLElement>>;
+}
+type DisclosureProps<T extends ElementType = TagName> = Props<T, DisclosureOptions<T>>;
+//#endregion
+export { useDisclosure as i, DisclosureOptions as n, DisclosureProps as r, Disclosure as t };
+//# sourceMappingURL=disclosure-CQ37hPVP.d.ts.map