@ariakit/react-components 0.1.0

package/dist/popover/popover-disclosure-arrow.js

@@ -0,0 +1,81 @@
+"use client";
+import { usePopoverContext } from "./popover-context.js";
+import { createElement, createHook, forwardRef } from "@ariakit/react-utils";
+import { invariant, removeUndefinedValues } from "@ariakit/utils";
+import { useMemo } from "react";
+import { jsx } from "react/jsx-runtime";
+import { useStoreState } from "@ariakit/react-store";
+//#region src/popover/popover-disclosure-arrow.tsx
+const TagName = "span";
+const pointsMap = {
+	top: "4,10 8,6 12,10",
+	right: "6,4 10,8 6,12",
+	bottom: "4,6 8,10 12,6",
+	left: "10,4 6,8 10,12"
+};
+/**
+* Returns props to create a `PopoverDisclosureArrow` component.
+* @see https://ariakit.com/components/popover
+* @example
+* ```jsx
+* const store = usePopoverStore();
+* const props = usePopoverDisclosureArrow({ store });
+* <PopoverDisclosure store={store}>
+*   Disclosure
+*   <Role {...props} />
+* </PopoverDisclosure>
+* ```
+*/
+const usePopoverDisclosureArrow = createHook(function usePopoverDisclosureArrow({ store, placement, ...props }) {
+	const context = usePopoverContext();
+	store = store || context;
+	invariant(store, "PopoverDisclosureArrow must be wrapped in a PopoverDisclosure component.");
+	const points = pointsMap[useStoreState(store, (state) => placement || state.placement).split("-")[0]];
+	props = {
+		children: useMemo(() => /* @__PURE__ */ jsx("svg", {
+			display: "block",
+			fill: "none",
+			stroke: "currentColor",
+			strokeLinecap: "round",
+			strokeLinejoin: "round",
+			strokeWidth: 1.5,
+			viewBox: "0 0 16 16",
+			height: "1em",
+			width: "1em",
+			children: /* @__PURE__ */ jsx("polyline", { points })
+		}), [points]),
+		"aria-hidden": true,
+		...props,
+		style: {
+			width: "1em",
+			height: "1em",
+			pointerEvents: "none",
+			...props.style
+		}
+	};
+	return removeUndefinedValues(props);
+});
+/**
+* Renders an arrow pointing to the popover position. It's usually rendered
+* inside the
+* [`PopoverDisclosure`](https://ariakit.com/reference/popover-disclosure)
+* component.
+* @see https://ariakit.com/components/popover
+* @example
+* ```jsx {4}
+* <PopoverProvider>
+*   <PopoverDisclosure>
+*     Disclosure
+*     <PopoverDisclosureArrow />
+*   </PopoverDisclosure>
+*   <Popover>Popover</Popover>
+* </PopoverProvider>
+* ```
+*/
+const PopoverDisclosureArrow = forwardRef(function PopoverDisclosureArrow(props) {
+	return createElement(TagName, usePopoverDisclosureArrow(props));
+});
+//#endregion
+export { PopoverDisclosureArrow, usePopoverDisclosureArrow };
+
+//# sourceMappingURL=popover-disclosure-arrow.js.map

package/dist/popover/popover-disclosure-arrow.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"popover-disclosure-arrow.js","names":[],"sources":["../../src/popover/popover-disclosure-arrow.tsx"],"sourcesContent":["import { useStoreState } from \"@ariakit/react-store\";\nimport { createElement, createHook, forwardRef } 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 } from \"react\";\nimport { usePopoverContext } from \"./popover-context.tsx\";\nimport type { PopoverStore, PopoverStoreState } from \"./popover-store.ts\";\n\nconst TagName = \"span\" satisfies ElementType;\ntype TagName = typeof TagName;\ntype BasePlacement = \"top\" | \"bottom\" | \"left\" | \"right\";\n\nconst pointsMap = {\n  top: \"4,10 8,6 12,10\",\n  right: \"6,4 10,8 6,12\",\n  bottom: \"4,6 8,10 12,6\",\n  left: \"10,4 6,8 10,12\",\n};\n\n/**\n * Returns props to create a `PopoverDisclosureArrow` component.\n * @see https://ariakit.com/components/popover\n * @example\n * ```jsx\n * const store = usePopoverStore();\n * const props = usePopoverDisclosureArrow({ store });\n * <PopoverDisclosure store={store}>\n *   Disclosure\n *   <Role {...props} />\n * </PopoverDisclosure>\n * ```\n */\nexport const usePopoverDisclosureArrow = createHook<\n  TagName,\n  PopoverDisclosureArrowOptions\n>(function usePopoverDisclosureArrow({ store, placement, ...props }) {\n  const context = usePopoverContext();\n  store = store || context;\n\n  invariant(\n    store,\n    process.env.NODE_ENV !== \"production\" &&\n      \"PopoverDisclosureArrow must be wrapped in a PopoverDisclosure component.\",\n  );\n\n  const position = useStoreState(\n    store,\n    (state) => placement || state.placement,\n  );\n  const dir = position.split(\"-\")[0] as BasePlacement;\n  const points = pointsMap[dir];\n\n  const children = useMemo(\n    () => (\n      <svg\n        display=\"block\"\n        fill=\"none\"\n        stroke=\"currentColor\"\n        strokeLinecap=\"round\"\n        strokeLinejoin=\"round\"\n        strokeWidth={1.5}\n        viewBox=\"0 0 16 16\"\n        height=\"1em\"\n        width=\"1em\"\n      >\n        <polyline points={points} />\n      </svg>\n    ),\n    [points],\n  );\n\n  props = {\n    children,\n    \"aria-hidden\": true,\n    ...props,\n    style: {\n      width: \"1em\",\n      height: \"1em\",\n      pointerEvents: \"none\",\n      ...props.style,\n    },\n  };\n\n  return removeUndefinedValues(props);\n});\n\n/**\n * Renders an arrow pointing to the popover position. It's usually rendered\n * inside the\n * [`PopoverDisclosure`](https://ariakit.com/reference/popover-disclosure)\n * component.\n * @see https://ariakit.com/components/popover\n * @example\n * ```jsx {4}\n * <PopoverProvider>\n *   <PopoverDisclosure>\n *     Disclosure\n *     <PopoverDisclosureArrow />\n *   </PopoverDisclosure>\n *   <Popover>Popover</Popover>\n * </PopoverProvider>\n * ```\n */\nexport const PopoverDisclosureArrow = forwardRef(\n  function PopoverDisclosureArrow(props: PopoverDisclosureArrowProps) {\n    const htmlProps = usePopoverDisclosureArrow(props);\n    return createElement(TagName, htmlProps);\n  },\n);\n\nexport interface PopoverDisclosureArrowOptions<\n  _T extends ElementType = TagName,\n> extends Options {\n  /**\n   * Object returned by the\n   * [`usePopoverStore`](https://ariakit.com/reference/use-popover-store) hook.\n   * If not provided, the closest\n   * [`PopoverDisclosure`](https://ariakit.com/reference/popover-disclosure) or\n   * [`PopoverProvider`](https://ariakit.com/reference/popover-provider)\n   * components' context will be used.\n   */\n  store?: PopoverStore;\n  /**\n   * Arrow's placement direction. If not provided, it will be inferred from the\n   * context.\n   *\n   * Live examples:\n   * - [Sliding Menu](https://ariakit.com/examples/menu-slide)\n   */\n  placement?: PopoverStoreState[\"placement\"];\n}\n\nexport type PopoverDisclosureArrowProps<T extends ElementType = TagName> =\n  Props<T, PopoverDisclosureArrowOptions<T>>;\n"],"mappings":";;;;;;;;AAaA,MAAM,UAAA;MACC,YAAA;CACL,KAAA;CACA,OAAA;CACA,QAAM;CACR,MAAA;;;;;;;;;;;;;;;MAmBE,4BAAgB,WAAkB,SAAA,0BAAA,EAAA,OAAA,WAAA,GAAA,SAAA;CAClC,MAAA,UAAQ,kBAAS;CAEjB,QAAA,SAGI;CAQJ,UAAM,OAAS,0EADM;CAsBrB,MAAA,SAAQ,UAAA,cAAA,QAAA,UAAA,aAAA,MAAA,SAAA,EAAA,MAAA,GAAA,EAAA;SACN;YAjBY,cAAA,oBAAA,OAAA;GACR,SAAK;GACL,MAAA;GACA,QAAA;GACA,eAAA;GACA,gBAAa;GACb,aAAQ;GACR,SAAO;GACP,QAAM;;GAGH,UAMA,oBAAA,YAAA,EAAA,OAAA,CAAA;EACP,CAAA,GAAA,CAAA,MAAA,CAAA;EACA,eAAG;EACH,GAAA;SACE;GACA,OAAA;GACA,QAAA;GACA,eAAS;GACX,GAAA,MAAA;EACF;CAEA;CACD,OAAA,sBAAA,KAAA;;;;;;;;;;;;;;;;;;;MAsBG,yBADkB,WAAA,SAAA,uBACqB,OAAA;CAE3C,OAAA,cAAA,SAAA,0BAAA,KAAA,CAAA"}

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

@@ -0,0 +1,38 @@
+import { n as DialogDisclosureOptions } from "../dialog-disclosure-DLD10zlb.js";
+import { n as PopoverAnchorOptions } from "../popover-anchor-PgfeXyzs.js";
+import { Props } from "@ariakit/react-utils";
+import { ElementType } from "react";
+
+//#region src/popover/popover-disclosure.d.ts
+declare const TagName = "button";
+type TagName = typeof TagName;
+/**
+ * Returns props to create a `PopoverDisclosure` component.
+ * @see https://ariakit.com/components/popover
+ * @example
+ * ```jsx
+ * const store = usePopoverStore();
+ * const props = usePopoverDisclosure({ store });
+ * <Role {...props}>Disclosure</Role>
+ * <Popover store={store}>Popover</Popover>
+ * ```
+ */
+declare const usePopoverDisclosure: import("@ariakit/react-utils").Hook<"button", PopoverDisclosureOptions<"button">>;
+/**
+ * Renders a button that controls the visibility of the
+ * [`Popover`](https://ariakit.com/reference/popover) component when clicked.
+ * @see https://ariakit.com/components/popover
+ * @example
+ * ```jsx {2}
+ * <PopoverProvider>
+ *   <PopoverDisclosure>Disclosure</PopoverDisclosure>
+ *   <Popover>Popover</Popover>
+ * </PopoverProvider>
+ * ```
+ */
+declare const PopoverDisclosure: (props: PopoverDisclosureProps) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>;
+interface PopoverDisclosureOptions<T extends ElementType = TagName> extends PopoverAnchorOptions<T>, Omit<DialogDisclosureOptions<T>, "store"> {}
+type PopoverDisclosureProps<T extends ElementType = TagName> = Props<T, PopoverDisclosureOptions<T>>;
+//#endregion
+export { PopoverDisclosure, PopoverDisclosureOptions, PopoverDisclosureProps, usePopoverDisclosure };
+//# sourceMappingURL=popover-disclosure.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"popover-disclosure.d.ts","names":["Props","ElementType","DialogDisclosureOptions","PopoverAnchorOptions","TagName","usePopoverDisclosure","PopoverDisclosureOptions","Hook","PopoverDisclosure","PopoverDisclosureProps","props","ReactElement","JSXElementConstructor","T","Omit"],"sources":["../../src/popover/popover-disclosure.d.ts"],"mappings":";;;;;;cAIcI,OAAAA;AAAAA,KACTA,OAAAA,UAAiBA,OAAO;AAFoC;;;;AAC5C;AAAA;;;;AACQ;AAY7B;AAdiE,cAc5CC,oBAAAA,iCAAqDE,IAAAA,WAAeD,wBAAwB;;;AAAA;AAajH;;;;;;;;;cAAqBE,iBAAAA,GAAoBE,KAAAA,EAAOD,sBAAsB,qBAAqBE,YAAAA,+BAA2CC,qBAAAA;AAAAA,UACrHN,wBAAAA,WAAmCL,WAAAA,GAAcG,OAAAA,UAAiBD,oBAAAA,CAAqBU,CAAAA,GAAIC,IAAAA,CAAKZ,uBAAAA,CAAwBW,CAAAA;AAAAA,KAE7HJ,sBAAAA,WAAiCR,WAAAA,GAAcG,OAAAA,IAAWJ,KAAAA,CAAMa,CAAAA,EAAGP,wBAAAA,CAAyBO,CAAAA"}

package/dist/popover/popover-disclosure.js

@@ -0,0 +1,66 @@
+"use client";
+import { PopoverScopedContextProvider, usePopoverProviderContext } from "./popover-context.js";
+import { useDialogDisclosure } from "../dialog/dialog-disclosure.js";
+import { usePopoverAnchor } from "./popover-anchor.js";
+import { createElement, createHook, forwardRef, useEvent, useWrapElement } from "@ariakit/react-utils";
+import { invariant } from "@ariakit/utils";
+import { jsx } from "react/jsx-runtime";
+//#region src/popover/popover-disclosure.tsx
+const TagName = "button";
+/**
+* Returns props to create a `PopoverDisclosure` component.
+* @see https://ariakit.com/components/popover
+* @example
+* ```jsx
+* const store = usePopoverStore();
+* const props = usePopoverDisclosure({ store });
+* <Role {...props}>Disclosure</Role>
+* <Popover store={store}>Popover</Popover>
+* ```
+*/
+const usePopoverDisclosure = createHook(function usePopoverDisclosure({ store, ...props }) {
+	const context = usePopoverProviderContext();
+	store = store || context;
+	invariant(store, "PopoverDisclosure must receive a `store` prop or be wrapped in a PopoverProvider component.");
+	const onClickProp = props.onClick;
+	const onClick = useEvent((event) => {
+		store?.setAnchorElement(event.currentTarget);
+		onClickProp?.(event);
+	});
+	props = useWrapElement(props, (element) => /* @__PURE__ */ jsx(PopoverScopedContextProvider, {
+		value: store,
+		children: element
+	}), [store]);
+	props = {
+		...props,
+		onClick
+	};
+	props = usePopoverAnchor({
+		store,
+		...props
+	});
+	props = useDialogDisclosure({
+		store,
+		...props
+	});
+	return props;
+});
+/**
+* Renders a button that controls the visibility of the
+* [`Popover`](https://ariakit.com/reference/popover) component when clicked.
+* @see https://ariakit.com/components/popover
+* @example
+* ```jsx {2}
+* <PopoverProvider>
+*   <PopoverDisclosure>Disclosure</PopoverDisclosure>
+*   <Popover>Popover</Popover>
+* </PopoverProvider>
+* ```
+*/
+const PopoverDisclosure = forwardRef(function PopoverDisclosure(props) {
+	return createElement(TagName, usePopoverDisclosure(props));
+});
+//#endregion
+export { PopoverDisclosure, usePopoverDisclosure };
+
+//# sourceMappingURL=popover-disclosure.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"popover-disclosure.js","names":[],"sources":["../../src/popover/popover-disclosure.tsx"],"sourcesContent":["import {\n  useEvent,\n  useWrapElement,\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 { ElementType, MouseEvent } from \"react\";\nimport type { DialogDisclosureOptions } from \"../dialog/dialog-disclosure.tsx\";\nimport { useDialogDisclosure } from \"../dialog/dialog-disclosure.tsx\";\nimport type { PopoverAnchorOptions } from \"./popover-anchor.tsx\";\nimport { usePopoverAnchor } from \"./popover-anchor.tsx\";\nimport {\n  PopoverScopedContextProvider,\n  usePopoverProviderContext,\n} from \"./popover-context.tsx\";\n\nconst TagName = \"button\" satisfies ElementType;\ntype TagName = typeof TagName;\ntype HTMLType = HTMLElementTagNameMap[TagName];\n\n/**\n * Returns props to create a `PopoverDisclosure` component.\n * @see https://ariakit.com/components/popover\n * @example\n * ```jsx\n * const store = usePopoverStore();\n * const props = usePopoverDisclosure({ store });\n * <Role {...props}>Disclosure</Role>\n * <Popover store={store}>Popover</Popover>\n * ```\n */\nexport const usePopoverDisclosure = createHook<\n  TagName,\n  PopoverDisclosureOptions\n>(function usePopoverDisclosure({ store, ...props }) {\n  const context = usePopoverProviderContext();\n  store = store || context;\n\n  invariant(\n    store,\n    process.env.NODE_ENV !== \"production\" &&\n      \"PopoverDisclosure must receive a `store` prop or be wrapped in a PopoverProvider component.\",\n  );\n\n  const onClickProp = props.onClick;\n\n  const onClick = useEvent((event: MouseEvent<HTMLType>) => {\n    store?.setAnchorElement(event.currentTarget);\n    onClickProp?.(event);\n  });\n\n  props = useWrapElement(\n    props,\n    (element) => (\n      <PopoverScopedContextProvider value={store}>\n        {element}\n      </PopoverScopedContextProvider>\n    ),\n    [store],\n  );\n\n  props = {\n    ...props,\n    onClick,\n  };\n\n  props = usePopoverAnchor<TagName>({ store, ...props });\n  props = useDialogDisclosure({ store, ...props });\n\n  return props;\n});\n\n/**\n * Renders a button that controls the visibility of the\n * [`Popover`](https://ariakit.com/reference/popover) component when clicked.\n * @see https://ariakit.com/components/popover\n * @example\n * ```jsx {2}\n * <PopoverProvider>\n *   <PopoverDisclosure>Disclosure</PopoverDisclosure>\n *   <Popover>Popover</Popover>\n * </PopoverProvider>\n * ```\n */\nexport const PopoverDisclosure = forwardRef(function PopoverDisclosure(\n  props: PopoverDisclosureProps,\n) {\n  const htmlProps = usePopoverDisclosure(props);\n  return createElement(TagName, htmlProps);\n});\n\nexport interface PopoverDisclosureOptions<T extends ElementType = TagName>\n  extends PopoverAnchorOptions<T>, Omit<DialogDisclosureOptions<T>, \"store\"> {}\n\nexport type PopoverDisclosureProps<T extends ElementType = TagName> = Props<\n  T,\n  PopoverDisclosureOptions<T>\n>;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;MAsCE,uBAAgB,WAAA,SAA0B,qBAAA,EAAA,OAAA,GAAA,SAAA;CAC1C,MAAA,UAAQ,0BAAS;CAEjB,QAAA,SAGI;CAGJ,UAAM,OAAA,6FAAoB;CAE1B,MAAM,cAAU,MAAU;OACxB,UAAO,UAAiB,UAAM;EAC9B,OAAA,iBAAmB,MAAA,aAAA;EACpB,cAAA,KAAA;CAED,CAAA;SAGyC,eAAA,QAAA,YAAA,oBAAA,8BAAA;;EAEP,UAGlC;CAEA,CAAA,GAAA,CAAA,KAAQ,CAAA;SACH;EACH,GAAA;EACF;CAEA;SAAoC,iBAAA;EAAO;EAAU,GAAA;CACrD,CAAA;SAA8B,oBAAA;EAAO;EAAU,GAAA;CAE/C,CAAA;CACD,OAAA;;;;;;;;;;;;;;MAkBC,oBAAqB,WADH,SAAA,kBACqB,OAAA;CACxC,OAAA,cAAA,SAAA,qBAAA,KAAA,CAAA"}

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

@@ -0,0 +1,2 @@
+import { i as usePopoverDismiss, n as PopoverDismissOptions, r as PopoverDismissProps, t as PopoverDismiss } from "../popover-dismiss-DPeI6Zse.js";
+export { PopoverDismiss, PopoverDismissOptions, PopoverDismissProps, usePopoverDismiss };

package/dist/popover/popover-dismiss.js

@@ -0,0 +1,47 @@
+"use client";
+import { usePopoverScopedContext } from "./popover-context.js";
+import { useDialogDismiss } from "../dialog/dialog-dismiss.js";
+import { createElement, createHook, forwardRef } from "@ariakit/react-utils";
+//#region src/popover/popover-dismiss.tsx
+const TagName = "button";
+/**
+* Returns props to create a `PopoverDismiss` component.
+* @see https://ariakit.com/components/popover
+* @example
+* ```jsx
+* const store = usePopoverStore();
+* const props = usePopoverDismiss({ store });
+* <Popover store={store}>
+*   <Role {...props} />
+* </Popover>
+* ```
+*/
+const usePopoverDismiss = createHook(function usePopoverDismiss({ store, ...props }) {
+	const context = usePopoverScopedContext();
+	store = store || context;
+	props = useDialogDismiss({
+		store,
+		...props
+	});
+	return props;
+});
+/**
+* Renders a button that hides a
+* [`Popover`](https://ariakit.com/reference/popover) component when clicked.
+* @see https://ariakit.com/components/popover
+* @example
+* ```jsx {3}
+* <PopoverProvider>
+*   <Popover>
+*     <PopoverDismiss />
+*   </Popover>
+* </PopoverProvider>
+* ```
+*/
+const PopoverDismiss = forwardRef(function PopoverDismiss(props) {
+	return createElement(TagName, usePopoverDismiss(props));
+});
+//#endregion
+export { PopoverDismiss, usePopoverDismiss };
+
+//# sourceMappingURL=popover-dismiss.js.map

package/dist/popover/popover-dismiss.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"popover-dismiss.js","names":[],"sources":["../../src/popover/popover-dismiss.tsx"],"sourcesContent":["import { createElement, createHook, forwardRef } from \"@ariakit/react-utils\";\nimport type { Props } from \"@ariakit/react-utils\";\nimport type { ElementType } from \"react\";\nimport type { DialogDismissOptions } from \"../dialog/dialog-dismiss.tsx\";\nimport { useDialogDismiss } from \"../dialog/dialog-dismiss.tsx\";\nimport { usePopoverScopedContext } from \"./popover-context.tsx\";\nimport type { PopoverStore } from \"./popover-store.ts\";\n\nconst TagName = \"button\" satisfies ElementType;\ntype TagName = typeof TagName;\n\n/**\n * Returns props to create a `PopoverDismiss` component.\n * @see https://ariakit.com/components/popover\n * @example\n * ```jsx\n * const store = usePopoverStore();\n * const props = usePopoverDismiss({ store });\n * <Popover store={store}>\n *   <Role {...props} />\n * </Popover>\n * ```\n */\nexport const usePopoverDismiss = createHook<TagName, PopoverDismissOptions>(\n  function usePopoverDismiss({ store, ...props }) {\n    const context = usePopoverScopedContext();\n    store = store || context;\n    props = useDialogDismiss({ store, ...props });\n    return props;\n  },\n);\n\n/**\n * Renders a button that hides a\n * [`Popover`](https://ariakit.com/reference/popover) component when clicked.\n * @see https://ariakit.com/components/popover\n * @example\n * ```jsx {3}\n * <PopoverProvider>\n *   <Popover>\n *     <PopoverDismiss />\n *   </Popover>\n * </PopoverProvider>\n * ```\n */\nexport const PopoverDismiss = forwardRef(function PopoverDismiss(\n  props: PopoverDismissProps,\n) {\n  const htmlProps = usePopoverDismiss(props);\n  return createElement(TagName, htmlProps);\n});\n\nexport interface PopoverDismissOptions<\n  T extends ElementType = TagName,\n> extends DialogDismissOptions<T> {\n  /**\n   * Object returned by the\n   * [`usePopoverStore`](https://ariakit.com/reference/use-popover-store) hook.\n   * If not provided, the closest\n   * [`Popover`](https://ariakit.com/reference/popover) or\n   * [`PopoverProvider`](https://ariakit.com/reference/popover-provider)\n   * components' context will be used.\n   */\n  store?: PopoverStore;\n}\n\nexport type PopoverDismissProps<T extends ElementType = TagName> = Props<\n  T,\n  PopoverDismissOptions<T>\n>;\n"],"mappings":";;;;;;;;;;;;;;;;;;MAyBI,oBAAgB,WAAA,SAAwB,kBAAA,EAAA,OAAA,GAAA,SAAA;CACxC,MAAA,UAAQ,wBAAS;CACjB,QAAQ,SAAA;SAAmB,iBAAA;EAAO;EAAU,GAAA;CAC5C,CAAA;CAEJ,OAAA;;;;;;;;;;;;;;;MAmBE,iBAAqB,WADH,SAAA,eACqB,OAAA;CACxC,OAAA,cAAA,SAAA,kBAAA,KAAA,CAAA"}

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

@@ -0,0 +1,2 @@
+import { i as usePopoverHeading, n as PopoverHeadingOptions, r as PopoverHeadingProps, t as PopoverHeading } from "../popover-heading-DGsr6D5W.js";
+export { PopoverHeading, PopoverHeadingOptions, PopoverHeadingProps, usePopoverHeading };

package/dist/popover/popover-heading.js

@@ -0,0 +1,42 @@
+"use client";
+import { useDialogHeading } from "../dialog/dialog-heading.js";
+import { createElement, createHook, forwardRef } from "@ariakit/react-utils";
+//#region src/popover/popover-heading.tsx
+const TagName = "h1";
+/**
+* Returns props to create a `PopoverHeading` component. This hook must be used
+* in a component that's wrapped with `Popover` so the `aria-labelledby` prop is
+* properly set on the popover element.
+* @see https://ariakit.com/components/popover
+* @example
+* ```jsx
+* // This component must be wrapped with Popover
+* const props = usePopoverHeading();
+* <Role {...props}>Heading</Role>
+* ```
+*/
+const usePopoverHeading = createHook(function usePopoverHeading(props) {
+	props = useDialogHeading(props);
+	return props;
+});
+/**
+* Renders a heading in a popover. This component must be wrapped with
+* [`Popover`](https://ariakit.com/reference/popover) so the `aria-labelledby`
+* prop is properly set on the popover element.
+* @see https://ariakit.com/components/popover
+* @example
+* ```jsx {3}
+* <PopoverProvider>
+*   <Popover>
+*     <PopoverHeading>Heading</PopoverHeading>
+*   </Popover>
+* </PopoverProvider>
+* ```
+*/
+const PopoverHeading = forwardRef(function PopoverHeading(props) {
+	return createElement(TagName, usePopoverHeading(props));
+});
+//#endregion
+export { PopoverHeading, usePopoverHeading };
+
+//# sourceMappingURL=popover-heading.js.map

package/dist/popover/popover-heading.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"popover-heading.js","names":[],"sources":["../../src/popover/popover-heading.tsx"],"sourcesContent":["import { createElement, createHook, forwardRef } from \"@ariakit/react-utils\";\nimport type { Props } from \"@ariakit/react-utils\";\nimport type { ElementType } from \"react\";\nimport type { DialogHeadingOptions } from \"../dialog/dialog-heading.tsx\";\nimport { useDialogHeading } from \"../dialog/dialog-heading.tsx\";\nimport type { PopoverStore } from \"./popover-store.ts\";\n\nconst TagName = \"h1\" satisfies ElementType;\ntype TagName = typeof TagName;\n\n/**\n * Returns props to create a `PopoverHeading` component. This hook must be used\n * in a component that's wrapped with `Popover` so the `aria-labelledby` prop is\n * properly set on the popover element.\n * @see https://ariakit.com/components/popover\n * @example\n * ```jsx\n * // This component must be wrapped with Popover\n * const props = usePopoverHeading();\n * <Role {...props}>Heading</Role>\n * ```\n */\nexport const usePopoverHeading = createHook<TagName, PopoverHeadingOptions>(\n  function usePopoverHeading(props) {\n    props = useDialogHeading(props);\n    return props;\n  },\n);\n\n/**\n * Renders a heading in a popover. This component must be wrapped with\n * [`Popover`](https://ariakit.com/reference/popover) so the `aria-labelledby`\n * prop is properly set on the popover element.\n * @see https://ariakit.com/components/popover\n * @example\n * ```jsx {3}\n * <PopoverProvider>\n *   <Popover>\n *     <PopoverHeading>Heading</PopoverHeading>\n *   </Popover>\n * </PopoverProvider>\n * ```\n */\nexport const PopoverHeading = forwardRef(function PopoverHeading(\n  props: PopoverHeadingProps,\n) {\n  const htmlProps = usePopoverHeading(props);\n  return createElement(TagName, htmlProps);\n});\n\nexport interface PopoverHeadingOptions<\n  T extends ElementType = TagName,\n> extends DialogHeadingOptions<T> {\n  /**\n   * Object returned by the\n   * [`usePopoverStore`](https://ariakit.com/reference/use-popover-store) hook.\n   * If not provided, the closest\n   * [`Popover`](https://ariakit.com/reference/popover) or\n   * [`PopoverProvider`](https://ariakit.com/reference/popover-provider)\n   * components' context will be used.\n   */\n  store?: PopoverStore;\n}\n\nexport type PopoverHeadingProps<T extends ElementType = TagName> = Props<\n  T,\n  PopoverHeadingOptions<T>\n>;\n"],"mappings":";;;;;;;;;;;;;;;;;MAwBI,oBAAyB,WAAK,SAAA,kBAAA,OAAA;CAC9B,QAAO,iBAAA,KAAA;CAEX,OAAA;;;;;;;;;;;;;;;;MAoBE,iBAAqB,WADH,SAAA,eACqB,OAAA;CACxC,OAAA,cAAA,SAAA,kBAAA,KAAA,CAAA"}

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

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

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

@@ -0,0 +1 @@
+{"version":3,"file":"popover-provider.d.ts","names":["ReactNode","PopoverStoreProps","PopoverProvider","PopoverProviderProps","props","JSX","Element","children"],"sources":["../../src/popover/popover-provider.d.ts"],"mappings":";;;;;;AAcA;;;;;;;;;AAA8G;iBAAtFE,eAAAA,CAAgBE,KAAAA,GAAQD,oBAAoB,+BAA+BE,GAAAA,CAAIC,OAAAA;AAAAA,UACtFH,oBAAAA,SAA6BF,iBAAiB;EAC3DM,QAAAA,GAAWP,SAAAA;AAAAA"}

package/dist/popover/popover-provider.js

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

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

@@ -0,0 +1 @@
+{"version":3,"file":"popover-provider.js","names":[],"sources":["../../src/popover/popover-provider.tsx"],"sourcesContent":["import type { ReactNode } from \"react\";\nimport { PopoverContextProvider } from \"./popover-context.tsx\";\nimport type { PopoverStoreProps } from \"./popover-store.ts\";\nimport { usePopoverStore } from \"./popover-store.ts\";\n\n/**\n * Provides a popover store to [Popover](https://ariakit.com/components/popover)\n * components.\n * @see https://ariakit.com/components/popover\n * @example\n * ```jsx\n * <PopoverProvider>\n *   <PopoverDisclosure />\n *   <Popover />\n * </PopoverProvider>\n * ```\n */\nexport function PopoverProvider(props: PopoverProviderProps = {}) {\n  const store = usePopoverStore(props);\n  return (\n    <PopoverContextProvider value={store}>\n      {props.children}\n    </PopoverContextProvider>\n  );\n}\n\nexport interface PopoverProviderProps extends PopoverStoreProps {\n  children?: ReactNode;\n}\n"],"mappings":";;;;;;;;;;;;;;;;;SAoBI,gBAAA,QAAC,CAAA,GAAA;QAFW,oBAAgB,wBAEO;yBAC1B,KAAA;EACe,UAAA,MAAA;CAE5B,CAAA"}

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

@@ -0,0 +1,2 @@
+import { a as PopoverStoreState, i as PopoverStoreProps, n as PopoverStoreFunctions, o as usePopoverStore, r as PopoverStoreOptions, s as usePopoverStoreProps, t as PopoverStore } from "../popover-store-Bc-l5VVO.js";
+export { PopoverStore, PopoverStoreFunctions, PopoverStoreOptions, PopoverStoreProps, PopoverStoreState, usePopoverStore, usePopoverStoreProps };

package/dist/popover/popover-store.js

@@ -0,0 +1,30 @@
+"use client";
+import { useDialogStoreProps } from "../dialog/dialog-store.js";
+import { useUpdateEffect } from "@ariakit/react-utils";
+import { useStore, useStoreProps } from "@ariakit/react-store";
+import * as Core from "@ariakit/components/popover/popover-store";
+//#region src/popover/popover-store.ts
+function usePopoverStoreProps(store, update, props) {
+	useUpdateEffect(update, [props.popover]);
+	useStoreProps(store, props, "placement");
+	return useDialogStoreProps(store, update, props);
+}
+/**
+* Creates a popover store to control the state of
+* [Popover](https://ariakit.com/components/popover) components.
+* @see https://ariakit.com/components/popover
+* @example
+* ```jsx
+* const popover = usePopoverStore();
+* <PopoverDisclosure store={popover}>Disclosure</PopoverDisclosure>
+* <Popover store={popover}>Popover</Popover>
+* ```
+*/
+function usePopoverStore(props = {}) {
+	const [store, update] = useStore(Core.createPopoverStore, props);
+	return usePopoverStoreProps(store, update, props);
+}
+//#endregion
+export { usePopoverStore, usePopoverStoreProps };
+
+//# sourceMappingURL=popover-store.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"popover-store.js","names":[],"sources":["../../src/popover/popover-store.ts"],"sourcesContent":["import * as Core from \"@ariakit/components/popover/popover-store\";\nimport { useStore, useStoreProps } from \"@ariakit/react-store\";\nimport type { Store } from \"@ariakit/react-store\";\nimport { useUpdateEffect } from \"@ariakit/react-utils\";\nimport type {\n  DialogStoreFunctions,\n  DialogStoreOptions,\n  DialogStoreState,\n} from \"../dialog/dialog-store.ts\";\nimport { useDialogStoreProps } from \"../dialog/dialog-store.ts\";\n\nexport function usePopoverStoreProps<T extends Core.PopoverStore>(\n  store: T,\n  update: () => void,\n  props: PopoverStoreProps,\n) {\n  useUpdateEffect(update, [props.popover]);\n  useStoreProps(store, props, \"placement\");\n  return useDialogStoreProps(store, update, props);\n}\n\n/**\n * Creates a popover store to control the state of\n * [Popover](https://ariakit.com/components/popover) components.\n * @see https://ariakit.com/components/popover\n * @example\n * ```jsx\n * const popover = usePopoverStore();\n * <PopoverDisclosure store={popover}>Disclosure</PopoverDisclosure>\n * <Popover store={popover}>Popover</Popover>\n * ```\n */\nexport function usePopoverStore(props: PopoverStoreProps = {}): PopoverStore {\n  const [store, update] = useStore(Core.createPopoverStore, props);\n  return usePopoverStoreProps(store, update, props);\n}\n\nexport interface PopoverStoreState\n  extends Core.PopoverStoreState, DialogStoreState {}\n\nexport interface PopoverStoreFunctions\n  extends\n    Omit<Core.PopoverStoreFunctions, \"disclosure\">,\n    DialogStoreFunctions {}\n\nexport interface PopoverStoreOptions\n  extends Omit<Core.PopoverStoreOptions, \"disclosure\">, DialogStoreOptions {}\n\nexport interface PopoverStoreProps\n  extends PopoverStoreOptions, Omit<Core.PopoverStoreProps, \"disclosure\"> {}\n\nexport interface PopoverStore\n  extends PopoverStoreFunctions, Omit<Store<Core.PopoverStore>, \"disclosure\"> {}\n"],"mappings":";;;;;;SAgBE,qBAAyB,OAAM,QAAQ,OAAA;CACvC,gBAAc,QAAO,CAAA,MAAO,OAAA,CAAW;CACvC,cAAO,OAAA,OAAoB,WAAO;CACpC,OAAA,oBAAA,OAAA,QAAA,KAAA;;;;;;;;;;;;;SAcS,gBAAiB,QAAA,CAAS,GAAA;CACjC,MAAA,CAAO,OAAA,UAAA,SAAqB,KAAO,oBAAa,KAAA;CAClD,OAAA,qBAAA,OAAA,QAAA,KAAA"}

package/dist/popover/popover.d.ts

@@ -0,0 +1,2 @@
+import { i as usePopover, n as PopoverOptions, r as PopoverProps, t as Popover } from "../popover-CCqiRKqg.js";
+export { Popover, PopoverOptions, PopoverProps, usePopover };