@ariakit/react-components 0.1.0

package/dist/select/select-popover.js

@@ -0,0 +1,59 @@
+"use client";
+import { createDialogComponent } from "../dialog/dialog.js";
+import { usePopover } from "../popover/popover.js";
+import { useSelectProviderContext } from "./select-context.js";
+import { useSelectList } from "./select-list.js";
+import { createElement, createHook, forwardRef } from "@ariakit/react-utils";
+//#region src/select/select-popover.tsx
+const TagName = "div";
+/**
+* Returns props to create a `SelectPopover` component.
+* @see https://ariakit.com/components/select
+* @example
+* ```jsx
+* const store = useSelectStore();
+* const props = useSelectPopover({ store });
+* <Role {...props}>
+*   <SelectItem value="Apple" />
+*   <SelectItem value="Orange" />
+* </Role>
+* ```
+*/
+const useSelectPopover = createHook(function useSelectPopover({ store, alwaysVisible, ...props }) {
+	const context = useSelectProviderContext();
+	store = store || context;
+	props = useSelectList({
+		store,
+		alwaysVisible,
+		...props
+	});
+	props = usePopover({
+		store,
+		alwaysVisible,
+		...props
+	});
+	return props;
+});
+/**
+* Renders a select popover. The `role` attribute is set to `listbox` by
+* default, but can be overriden by any other valid select popup role
+* (`listbox`, `menu`, `tree`, `grid` or `dialog`).
+* @see https://ariakit.com/components/select
+* @example
+* ```jsx {3-6}
+* <SelectProvider>
+*   <Select />
+*   <SelectPopover>
+*     <SelectItem value="Apple" />
+*     <SelectItem value="Orange" />
+*   </SelectPopover>
+* </SelectProvider>
+* ```
+*/
+const SelectPopover = createDialogComponent(forwardRef(function SelectPopover(props) {
+	return createElement(TagName, useSelectPopover(props));
+}), useSelectProviderContext);
+//#endregion
+export { SelectPopover, useSelectPopover };
+
+//# sourceMappingURL=select-popover.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"select-popover.js","names":[],"sources":["../../src/select/select-popover.tsx"],"sourcesContent":["import { createElement, createHook, forwardRef } from \"@ariakit/react-utils\";\nimport type { Props } from \"@ariakit/react-utils\";\nimport type { ElementType } from \"react\";\nimport { createDialogComponent } from \"../dialog/dialog.tsx\";\nimport type { PopoverOptions } from \"../popover/popover.tsx\";\nimport { usePopover } from \"../popover/popover.tsx\";\nimport { useSelectProviderContext } from \"./select-context.tsx\";\nimport type { SelectListOptions } from \"./select-list.tsx\";\nimport { useSelectList } from \"./select-list.tsx\";\n\nconst TagName = \"div\" satisfies ElementType;\ntype TagName = typeof TagName;\n\n/**\n * Returns props to create a `SelectPopover` component.\n * @see https://ariakit.com/components/select\n * @example\n * ```jsx\n * const store = useSelectStore();\n * const props = useSelectPopover({ store });\n * <Role {...props}>\n *   <SelectItem value=\"Apple\" />\n *   <SelectItem value=\"Orange\" />\n * </Role>\n * ```\n */\nexport const useSelectPopover = createHook<TagName, SelectPopoverOptions>(\n  function useSelectPopover({ store, alwaysVisible, ...props }) {\n    const context = useSelectProviderContext();\n    store = store || context;\n    props = useSelectList({ store, alwaysVisible, ...props });\n    props = usePopover({ store, alwaysVisible, ...props });\n    return props;\n  },\n);\n\n/**\n * Renders a select popover. The `role` attribute is set to `listbox` by\n * default, but can be overriden by any other valid select popup role\n * (`listbox`, `menu`, `tree`, `grid` or `dialog`).\n * @see https://ariakit.com/components/select\n * @example\n * ```jsx {3-6}\n * <SelectProvider>\n *   <Select />\n *   <SelectPopover>\n *     <SelectItem value=\"Apple\" />\n *     <SelectItem value=\"Orange\" />\n *   </SelectPopover>\n * </SelectProvider>\n * ```\n */\nexport const SelectPopover = createDialogComponent(\n  forwardRef(function SelectPopover(props: SelectPopoverProps) {\n    const htmlProps = useSelectPopover(props);\n    return createElement(TagName, htmlProps);\n  }),\n  useSelectProviderContext,\n);\n\nexport interface SelectPopoverOptions<T extends ElementType = TagName>\n  extends SelectListOptions<T>, Omit<PopoverOptions<T>, \"store\"> {}\n\nexport type SelectPopoverProps<T extends ElementType = TagName> = Props<\n  T,\n  SelectPopoverOptions<T>\n>;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;MA4BI,mBAAgB,WAAA,SAAyB,iBAAA,EAAA,OAAA,eAAA,GAAA,SAAA;CACzC,MAAA,UAAQ,yBAAS;CACjB,QAAQ,SAAA;SAAgB,cAAA;EAAO;EAAe;EAAU,GAAA;CACxD,CAAA;SAAqB,WAAA;EAAO;EAAe;EAAU,GAAA;CACrD,CAAA;CAEJ,OAAA;;;;;;;;;;;;;;;;;;MAqBI,gBAAqB,sBADH,WACqB,SAAA,cAAA,OAAA;CACxC,OACD,cAAA,SACF,iBAAA,KAAA,CAAA"}

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

@@ -0,0 +1,30 @@
+import { a as SelectStoreProps, s as SelectStoreValue } from "../select-store-BsLTAyKh.js";
+import { ReactElement, ReactNode } from "react";
+import { PickRequired } from "@ariakit/utils";
+
+//#region src/select/select-provider.d.ts
+type Value = SelectStoreValue;
+/**
+ * Provides a select store to [Select](https://ariakit.com/components/select)
+ * components.
+ * @see https://ariakit.com/components/select
+ * @example
+ * ```jsx
+ * <SelectProvider defaultValue="Apple">
+ *   <Select />
+ *   <SelectPopover>
+ *     <SelectItem value="Apple" />
+ *     <SelectItem value="Banana" />
+ *     <SelectItem value="Orange" />
+ *   </SelectPopover>
+ * </SelectProvider>
+ * ```
+ */
+declare function SelectProvider<T extends Value = Value>(props: PickRequired<SelectProviderProps<T>, "value" | "defaultValue">): ReactElement;
+declare function SelectProvider(props?: SelectProviderProps): ReactElement;
+interface SelectProviderProps<T extends Value = Value> extends SelectStoreProps<T> {
+  children?: ReactNode;
+}
+//#endregion
+export { SelectProvider, SelectProviderProps };
+//# sourceMappingURL=select-provider.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"select-provider.d.ts","names":["PickRequired","ReactElement","ReactNode","SelectStoreProps","SelectStoreValue","Value","SelectProvider","T","SelectProviderProps","props","children"],"sources":["../../src/select/select-provider.d.ts"],"mappings":";;;;;KAGKK,KAAAA,GAAQD,gBAAgB;;AAD+C;;;;AAC/C;AAiB7B;;;;;;;;;;iBAAwBE,cAAAA,WAAyBD,KAAAA,GAAQA,KAAAA,CAAAA,CAAOI,KAAAA,EAAOT,YAAAA,CAAaQ,mBAAAA,CAAoBD,CAAAA,+BAAgCN,YAAAA;AAAAA,iBAChHK,cAAAA,CAAeG,KAAAA,GAAQD,mBAAAA,GAAsBP,YAAY;AAAA,UAChEO,mBAAAA,WAA8BH,KAAAA,GAAQA,KAAAA,UAAeF,gBAAAA,CAAiBI,CAAAA;EACnFG,QAAAA,GAAWR,SAAAA;AAAAA"}

package/dist/select/select-provider.js

@@ -0,0 +1,15 @@
+"use client";
+import { SelectContextProvider } from "./select-context.js";
+import { useSelectStore } from "./select-store.js";
+import { jsx } from "react/jsx-runtime";
+//#region src/select/select-provider.tsx
+function SelectProvider(props = {}) {
+	return /* @__PURE__ */ jsx(SelectContextProvider, {
+		value: useSelectStore(props),
+		children: props.children
+	});
+}
+//#endregion
+export { SelectProvider };
+
+//# sourceMappingURL=select-provider.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"select-provider.js","names":[],"sources":["../../src/select/select-provider.tsx"],"sourcesContent":["import type { PickRequired } from \"@ariakit/utils\";\nimport type { ReactElement, ReactNode } from \"react\";\nimport { SelectContextProvider } from \"./select-context.tsx\";\nimport type { SelectStoreProps, SelectStoreValue } from \"./select-store.ts\";\nimport { useSelectStore } from \"./select-store.ts\";\n\ntype Value = SelectStoreValue;\n\n/**\n * Provides a select store to [Select](https://ariakit.com/components/select)\n * components.\n * @see https://ariakit.com/components/select\n * @example\n * ```jsx\n * <SelectProvider defaultValue=\"Apple\">\n *   <Select />\n *   <SelectPopover>\n *     <SelectItem value=\"Apple\" />\n *     <SelectItem value=\"Banana\" />\n *     <SelectItem value=\"Orange\" />\n *   </SelectPopover>\n * </SelectProvider>\n * ```\n */\n\nexport function SelectProvider<T extends Value = Value>(\n  props: PickRequired<SelectProviderProps<T>, \"value\" | \"defaultValue\">,\n): ReactElement;\n\nexport function SelectProvider(props?: SelectProviderProps): ReactElement;\n\nexport function SelectProvider(props: SelectProviderProps = {}) {\n  const store = useSelectStore(props);\n  return (\n    <SelectContextProvider value={store}>\n      {props.children}\n    </SelectContextProvider>\n  );\n}\n\nexport interface SelectProviderProps<\n  T extends Value = Value,\n> extends SelectStoreProps<T> {\n  children?: ReactNode;\n}\n"],"mappings":";;;;;SAkCI,eAAA,QAAC,CAAA,GAAA;QAF0B,oBAAA,uBAEO;wBACzB,KAAA;EACc,UAAA,MAAA;CAE3B,CAAA"}

package/dist/select/select-renderer.d.ts

@@ -0,0 +1,44 @@
+import { c as getCollectionRendererItem, l as getCollectionRendererItemId } from "../collection-renderer-DsPD9ksD.js";
+import { CompositeRendererBaseItemProps, CompositeRendererItem, CompositeRendererItemObject, CompositeRendererItemProps, CompositeRendererOptions } from "../composite/composite-renderer.js";
+import { s as SelectStoreValue, t as SelectStore } from "../select-store-BsLTAyKh.js";
+import { Props } from "@ariakit/react-utils";
+
+//#region src/select/select-renderer.d.ts
+declare const TagName = "div";
+type TagName = typeof TagName;
+interface ItemObject extends CompositeRendererItemObject {
+  value?: string;
+}
+type Item = ItemObject | CompositeRendererItem;
+type BaseItemProps = CompositeRendererBaseItemProps;
+type ItemProps<T extends Item, P extends BaseItemProps = BaseItemProps> = CompositeRendererItemProps<T, P>;
+declare const SelectRenderer: <T extends Item = any>(props: SelectRendererProps<T>) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>;
+type SelectRendererItemObject = ItemObject;
+type SelectRendererItem = Item;
+type SelectRendererBaseItemProps = BaseItemProps;
+type SelectRendererItemProps<T extends Item, P extends BaseItemProps = BaseItemProps> = ItemProps<T, P>;
+interface SelectRendererOptions<T extends Item = any> extends Omit<CompositeRendererOptions<T>, "store"> {
+  /**
+   * Object returned by the
+   * [`useSelectStore`](https://ariakit.com/reference/use-select-store) hook. If
+   * not provided, the closest [Select](https://ariakit.com/components/select)
+   * component's context will be used.
+   *
+   * The store [`items`](https://ariakit.com/reference/use-select-store#items)
+   * state will be used to render the items if the
+   * [`items`](https://ariakit.com/reference/select-items#items) prop is not
+   * provided.
+   */
+  store?: SelectStore;
+  /**
+   * The current value of the select. This will ensure the item with the given
+   * value is rendered even if it's not in the viewport, so it can be
+   * automatically focused when the select popover is opened. If not provided,
+   * the value will be read from the store.
+   */
+  value?: SelectStoreValue;
+}
+interface SelectRendererProps<T extends Item = any> extends Props<TagName, SelectRendererOptions<T>> {}
+//#endregion
+export { SelectRenderer, SelectRendererBaseItemProps, SelectRendererItem, SelectRendererItemObject, SelectRendererItemProps, SelectRendererOptions, SelectRendererProps, getCollectionRendererItem as getSelectRendererItem, getCollectionRendererItemId as getSelectRendererItemId };
+//# sourceMappingURL=select-renderer.d.ts.map

package/dist/select/select-renderer.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"select-renderer.d.ts","names":["Props","CompositeRendererBaseItemProps","CompositeRendererItem","CompositeRendererItemObject","CompositeRendererItemProps","CompositeRendererOptions","getCompositeRendererItem","getCompositeRendererItemId","SelectStore","SelectStoreValue","TagName","ItemObject","value","Item","BaseItemProps","ItemProps","T","P","SelectRenderer","SelectRendererProps","props","ReactElement","JSXElementConstructor","getSelectRendererItem","getSelectRendererItemId","SelectRendererItemObject","SelectRendererItem","SelectRendererBaseItemProps","SelectRendererItemProps","SelectRendererOptions","Omit","store"],"sources":["../../src/select/select-renderer.d.ts"],"mappings":";;;;;;cAIcU,OAAAA;AAAAA,KACTA,OAAAA,UAAiBA,OAAO;AAAA,UACnBC,UAAAA,SAAmBR,2BAA2B;EACpDS,KAAK;AAAA;AAAA,KAEJC,IAAAA,GAAOF,UAAAA,GAAaT,qBAAqB;AAAA,KACzCY,aAAAA,GAAgBb,8BAA8B;AAAA,KAC9Cc,SAAAA,WAAoBF,IAAAA,YAAgBC,aAAAA,GAAgBA,aAAAA,IAAiBV,0BAAAA,CAA2BY,CAAAA,EAAGC,CAAAA;AAAAA,cACnFC,cAAAA,aAA2BL,IAAAA,QAAYO,KAAAA,EAAOD,mBAAAA,CAAoBH,CAAAA,sBAAuBK,YAAAA,+BAA2CC,qBAAAA;AAAAA,KAE7IG,wBAAAA,GAA2Bd,UAAU;AAAA,KACrCe,kBAAAA,GAAqBb,IAAI;AAAA,KACzBc,2BAAAA,GAA8Bb,aAAa;AAAA,KAC3Cc,uBAAAA,WAAkCf,IAAAA,YAAgBC,aAAAA,GAAgBA,aAAAA,IAAiBC,SAAAA,CAAUC,CAAAA,EAAGC,CAAAA;AAAAA,UAC3FY,qBAAAA,WAAgChB,IAAAA,gBAAoBiB,IAAAA,CAAKzB,wBAAAA,CAAyBW,CAAAA;EAZtEb;AACpB;AAAA;;;;AAEqC;AAAA;;;;EAqB1C4B,KAAAA,GAAQvB,WAAAA;EAnBPO;;;;;;EA0BDH,KAAAA,GAAQH,gBAAAA;AAAAA;AAAAA,UAEKU,mBAAAA,WAA8BN,IAAAA,gBAAoBb,KAAAA,CAAMU,OAAAA,EAASmB,qBAAAA,CAAsBb,CAAAA"}

package/dist/select/select-renderer.js

@@ -0,0 +1,61 @@
+"use client";
+import { getCollectionRendererItem, getCollectionRendererItemId } from "../collection/collection-renderer.js";
+import { useCompositeRenderer } from "../composite/composite-renderer.js";
+import { useSelectContext } from "./select-context.js";
+import { createElement, forwardRef } from "@ariakit/react-utils";
+import { toArray } from "@ariakit/utils";
+import { useMemo } from "react";
+import { useStoreState } from "@ariakit/react-store";
+//#region src/select/select-renderer.tsx
+const TagName = "div";
+function getItemObject(item) {
+	if (!item || typeof item !== "object") return { value: `${item}` };
+	return item;
+}
+function findIndicesByValue(items, value) {
+	const values = toArray(value);
+	const indices = [];
+	for (const [index, item] of items.entries()) {
+		if (indices.length === values.length) break;
+		const object = getItemObject(item);
+		if (object.value != null && values.includes(object.value)) indices.push(index);
+		else if (object.items?.length) {
+			if (findIndicesByValue(object.items, value).length) indices.push(index);
+		}
+	}
+	return indices;
+}
+function useSelectRenderer({ store, orientation: orientationProp, persistentIndices: persistentIndicesProp, items: itemsProp, value: valueProp, ...props }) {
+	const context = useSelectContext();
+	store = store || context;
+	const items = useStoreState(store, (state) => {
+		if (!state) return itemsProp;
+		if (!state.mounted) return 0;
+		return itemsProp ?? state.items;
+	});
+	const value = useStoreState(store, (state) => valueProp ?? state?.value);
+	const valueIndices = useMemo(() => {
+		if (!items) return [];
+		if (value == null) return [];
+		if (typeof items === "number") return [];
+		if (!items.length) return [];
+		return findIndicesByValue(items, value);
+	}, [items, value]);
+	const persistentIndices = useMemo(() => {
+		if (persistentIndicesProp) return [...persistentIndicesProp, ...valueIndices];
+		return valueIndices;
+	}, [valueIndices, persistentIndicesProp]);
+	return useCompositeRenderer({
+		store,
+		items,
+		persistentIndices,
+		...props
+	});
+}
+const SelectRenderer = forwardRef(function SelectRenderer(props) {
+	return createElement(TagName, useSelectRenderer(props));
+});
+//#endregion
+export { SelectRenderer, getCollectionRendererItem as getSelectRendererItem, getCollectionRendererItemId as getSelectRendererItemId };
+
+//# sourceMappingURL=select-renderer.js.map

package/dist/select/select-renderer.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"select-renderer.js","names":[],"sources":["../../src/select/select-renderer.tsx"],"sourcesContent":["import { useStoreState } from \"@ariakit/react-store\";\nimport { createElement, forwardRef } from \"@ariakit/react-utils\";\nimport type { Props } from \"@ariakit/react-utils\";\nimport { toArray } from \"@ariakit/utils\";\nimport type { ElementType } from \"react\";\nimport { useMemo } from \"react\";\nimport type {\n  CompositeRendererBaseItemProps,\n  CompositeRendererItem,\n  CompositeRendererItemObject,\n  CompositeRendererItemProps,\n  CompositeRendererOptions,\n} from \"../composite/composite-renderer.tsx\";\nimport {\n  getCompositeRendererItem,\n  getCompositeRendererItemId,\n  useCompositeRenderer,\n} from \"../composite/composite-renderer.tsx\";\nimport { useSelectContext } from \"./select-context.tsx\";\nimport type { SelectStore, SelectStoreValue } from \"./select-store.ts\";\n\nconst TagName = \"div\" satisfies ElementType;\ntype TagName = typeof TagName;\n\ninterface ItemObject extends CompositeRendererItemObject {\n  value?: string;\n}\n\ntype Item = ItemObject | CompositeRendererItem;\n\ntype BaseItemProps = CompositeRendererBaseItemProps;\n\ntype ItemProps<\n  T extends Item,\n  P extends BaseItemProps = BaseItemProps,\n> = CompositeRendererItemProps<T, P>;\n\nfunction getItemObject(item: Item): ItemObject {\n  if (!item || typeof item !== \"object\") {\n    return { value: `${item}` };\n  }\n  return item;\n}\n\nfunction findIndicesByValue(\n  items: readonly Item[],\n  value: SelectStoreValue,\n): number[] {\n  const values = toArray(value);\n  const indices: number[] = [];\n\n  for (const [index, item] of items.entries()) {\n    if (indices.length === values.length) break;\n\n    const object = getItemObject(item);\n\n    if (object.value != null && values.includes(object.value)) {\n      indices.push(index);\n    } else if (object.items?.length) {\n      const childIndices = findIndicesByValue(object.items, value);\n      if (childIndices.length) {\n        indices.push(index);\n      }\n    }\n  }\n\n  return indices;\n}\n\nfunction useSelectRenderer<T extends Item = any>({\n  store,\n  orientation: orientationProp,\n  persistentIndices: persistentIndicesProp,\n  items: itemsProp,\n  value: valueProp,\n  ...props\n}: SelectRendererProps<T>) {\n  const context = useSelectContext();\n  store = store || context;\n\n  const items = useStoreState(store, (state) => {\n    if (!state) return itemsProp;\n    if (!state.mounted) return 0;\n    return itemsProp ?? (state.items as T[]);\n  });\n\n  const value = useStoreState(store, (state) => valueProp ?? state?.value);\n\n  const valueIndices = useMemo(() => {\n    if (!items) return [];\n    if (value == null) return [];\n    if (typeof items === \"number\") return [];\n    if (!items.length) return [];\n    return findIndicesByValue(items, value);\n  }, [items, value]);\n\n  const persistentIndices = useMemo(() => {\n    if (persistentIndicesProp) {\n      return [...persistentIndicesProp, ...valueIndices];\n    }\n    return valueIndices;\n  }, [valueIndices, persistentIndicesProp]);\n\n  return useCompositeRenderer({\n    store: store as CompositeRendererOptions[\"store\"],\n    items,\n    persistentIndices,\n    ...props,\n  });\n}\n\nexport const SelectRenderer = forwardRef(function SelectRenderer<\n  T extends Item = any,\n>(props: SelectRendererProps<T>) {\n  const htmlProps = useSelectRenderer(props);\n  return createElement(TagName, htmlProps);\n});\n\nexport {\n  getCompositeRendererItem as getSelectRendererItem,\n  getCompositeRendererItemId as getSelectRendererItemId,\n};\n\nexport type SelectRendererItemObject = ItemObject;\nexport type SelectRendererItem = Item;\nexport type SelectRendererBaseItemProps = BaseItemProps;\nexport type SelectRendererItemProps<\n  T extends Item,\n  P extends BaseItemProps = BaseItemProps,\n> = ItemProps<T, P>;\n\nexport interface SelectRendererOptions<T extends Item = any> extends Omit<\n  CompositeRendererOptions<T>,\n  \"store\"\n> {\n  /**\n   * Object returned by the\n   * [`useSelectStore`](https://ariakit.com/reference/use-select-store) hook. If\n   * not provided, the closest [Select](https://ariakit.com/components/select)\n   * component's context will be used.\n   *\n   * The store [`items`](https://ariakit.com/reference/use-select-store#items)\n   * state will be used to render the items if the\n   * [`items`](https://ariakit.com/reference/select-items#items) prop is not\n   * provided.\n   */\n  store?: SelectStore;\n  /**\n   * The current value of the select. This will ensure the item with the given\n   * value is rendered even if it's not in the viewport, so it can be\n   * automatically focused when the select popover is opened. If not provided,\n   * the value will be read from the store.\n   */\n  value?: SelectStoreValue;\n}\n\nexport interface SelectRendererProps<T extends Item = any> extends Props<\n  TagName,\n  SelectRendererOptions<T>\n> {}\n"],"mappings":";;;;;;;;;AAqCA,MAAA,UAAS;SACF,cAAe,MAAA;CAGpB,IAAA,CAAA,QAAO,OAAA,SAAA,UAAA,OAAA,EAAA,OAAA,GAAA,OAAA;CACT,OAAA;AAEA;SAIQ,mBAAiB,OAAK,OAAA;CAC5B,MAAM,SAAA,QAAqB,KAAA;CAE3B,MAAK,UAAO,CAAA;MACN,MAAA,CAAA,OAAQ,SAAW,MAAO,QAAQ,GAAA;EAEtC,IAAA,QAAM,WAAS,OAAc,QAAI;EAEjC,MAAI,SAAO,cAAiB,IAAA;aAEjB,SAAO,QAAO,OAEvB,SAAA,OAAA,KAAA,GAAA,QAAA,KAAA,KAAA;OADqB,IAAA,OAAA,OAAA,QAGrB;OAAA,mBAAA,OAAA,OAAA,KAAA,EAAA,QAAA,QAAA,KAAA,KAAA;EAAA;CAIJ;CACF,OAAA;AAEA;SAQQ,kBAAU,EAAA,OAAiB,aAAA,iBAAA,mBAAA,uBAAA,OAAA,WAAA,OAAA,WAAA,GAAA,SAAA;CACjC,MAAA,UAAQ,iBAAS;CAEjB,QAAM,SAAQ;OACP,QAAO,cAAO,QAAA,UAAA;EACnB,IAAI,CAAC,OAAM,OAAA;EACX,IAAA,CAAA,MAAO,SAAc,OAAM;EAC5B,OAAA,aAAA,MAAA;CAED,CAAA;CAEA,MAAM,QAAA,cAAe,QAAc,UAAA,aAAA,OAAA,KAAA;OAC5B,eAAe,cAAA;EACpB,IAAI,CAAA,OAAA,OAAe,CAAA;EACnB,IAAI,SAAO,MAAA,OAAU,CAAA;EACrB,IAAI,OAAO,UAAQ,UAAQ,OAAA,CAAA;EAC3B,IAAA,CAAA,MAAO,QAAA,OAAmB,CAAA;EAC5B,OAAI,mBAAa,OAAA,KAAA;CAEjB,GAAA,CAAA,OAAM,KAAA,CAAA;OACA,oBAAA,cACS;EAEb,IAAA,uBAAO,OAAA,CAAA,GAAA,uBAAA,GAAA,YAAA;EACT,OAAI;CAEJ,GAAA,CAAA,cAAO,qBAAqB,CAAA;QACnB,qBAAA;EACP;EACA;EACA;EACD,GAAA;CACH,CAAA;AAEA;MAIE,iBAAqB,WADH,SAAA,eACqB,OAAA;CACxC,OAAA,cAAA,SAAA,kBAAA,KAAA,CAAA"}

package/dist/select/select-row.d.ts

@@ -0,0 +1,63 @@
+import { CompositeRowOptions } from "../composite/composite-row.js";
+import { t as SelectStore } from "../select-store-BsLTAyKh.js";
+import { Props } from "@ariakit/react-utils";
+import { ElementType } from "react";
+
+//#region src/select/select-row.d.ts
+declare const TagName = "div";
+type TagName = typeof TagName;
+/**
+ * Returns props to create a `SelectRow` component.
+ * @see https://ariakit.com/components/select
+ * @example
+ * ```jsx
+ * const store = useSelectStore();
+ * const props = useSelectRow({ store });
+ * <SelectPopover store={store}>
+ *   <Role {...props}>
+ *     <SelectItem value="Apple" />
+ *     <SelectItem value="Orange" />
+ *   </Role>
+ * </SelectPopover>
+ * ```
+ */
+declare const useSelectRow: import("@ariakit/react-utils").Hook<"div", SelectRowOptions<"div">>;
+/**
+ * Renders a select row that allows two-dimensional arrow key navigation.
+ * [`SelectItem`](https://ariakit.com/reference/select-item) elements wrapped
+ * within this component will automatically receive a
+ * [`rowId`](https://ariakit.com/reference/select-item#rowid) prop.
+ * @see https://ariakit.com/components/select
+ * @example
+ * ```jsx {4-11}
+ * <SelectProvider>
+ *   <Select />
+ *   <SelectPopover>
+ *     <SelectRow>
+ *       <SelectItem value="Apple" />
+ *       <SelectItem value="Orange" />
+ *     </SelectRow>
+ *     <SelectRow>
+ *       <SelectItem value="Banana" />
+ *       <SelectItem value="Grape" />
+ *     </SelectRow>
+ *   </SelectPopover>
+ * </SelectProvider>
+ * ```
+ */
+declare const SelectRow: (props: SelectRowProps) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>;
+interface SelectRowOptions<T extends ElementType = TagName> extends CompositeRowOptions<T> {
+  /**
+   * Object returned by the
+   * [`useSelectStore`](https://ariakit.com/reference/use-select-store) hook. If
+   * not provided, the parent
+   * [`SelectList`](https://ariakit.com/reference/select-list) or
+   * [`SelectPopover`](https://ariakit.com/reference/select-popover) components'
+   * context will be used.
+   */
+  store?: SelectStore;
+}
+type SelectRowProps<T extends ElementType = TagName> = Props<T, SelectRowOptions<T>>;
+//#endregion
+export { SelectRow, SelectRowOptions, SelectRowProps, useSelectRow };
+//# sourceMappingURL=select-row.d.ts.map

package/dist/select/select-row.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"select-row.d.ts","names":["Props","ElementType","CompositeRowOptions","SelectStore","TagName","useSelectRow","SelectRowOptions","Hook","SelectRow","SelectRowProps","props","ReactElement","JSXElementConstructor","T","store"],"sources":["../../src/select/select-row.d.ts"],"mappings":";;;;;;cAIcI,OAAAA;AAAAA,KACTA,OAAAA,UAAiBA,OAAO;AAFwB;;;;AAChC;AAAA;;;;AACQ;AAgB7B;;;;AAA8F;AAlBzC,cAkBhCC,YAAAA,iCAA6CE,IAAAA,QAAYD,gBAAgB;;;;;;;;;AAwB6C;AAC3I;;;;;;;;;;;;;;cADqBE,SAAAA,GAAYE,KAAAA,EAAOD,cAAc,qBAAqBE,YAAAA,+BAA2CC,qBAAAA;AAAAA,UACrGN,gBAAAA,WAA2BL,WAAAA,GAAcG,OAAAA,UAAiBF,mBAAAA,CAAoBW,CAAAA;EASnFV;;AAAW;AAEvB;;;;;EAFIW,KAAAA,GAAQX,WAAAA;AAAAA;AAAAA,KAEAM,cAAAA,WAAyBR,WAAAA,GAAcG,OAAAA,IAAWJ,KAAAA,CAAMa,CAAAA,EAAGP,gBAAAA,CAAiBO,CAAAA"}

package/dist/select/select-row.js

@@ -0,0 +1,67 @@
+"use client";
+import { useCompositeRow } from "../composite/composite-row.js";
+import { useSelectContext } from "./select-context.js";
+import { createElement, createHook, forwardRef } from "@ariakit/react-utils";
+import { getPopupRole, invariant } from "@ariakit/utils";
+import { useStoreState } from "@ariakit/react-store";
+//#region src/select/select-row.tsx
+const TagName = "div";
+/**
+* Returns props to create a `SelectRow` component.
+* @see https://ariakit.com/components/select
+* @example
+* ```jsx
+* const store = useSelectStore();
+* const props = useSelectRow({ store });
+* <SelectPopover store={store}>
+*   <Role {...props}>
+*     <SelectItem value="Apple" />
+*     <SelectItem value="Orange" />
+*   </Role>
+* </SelectPopover>
+* ```
+*/
+const useSelectRow = createHook(function useSelectRow({ store, ...props }) {
+	const context = useSelectContext();
+	store = store || context;
+	invariant(store, "SelectRow must be wrapped in a SelectList or SelectPopover component");
+	props = {
+		role: getPopupRole(useStoreState(store, "listElement")) === "grid" ? "row" : "presentation",
+		...props
+	};
+	props = useCompositeRow({
+		store,
+		...props
+	});
+	return props;
+});
+/**
+* Renders a select row that allows two-dimensional arrow key navigation.
+* [`SelectItem`](https://ariakit.com/reference/select-item) elements wrapped
+* within this component will automatically receive a
+* [`rowId`](https://ariakit.com/reference/select-item#rowid) prop.
+* @see https://ariakit.com/components/select
+* @example
+* ```jsx {4-11}
+* <SelectProvider>
+*   <Select />
+*   <SelectPopover>
+*     <SelectRow>
+*       <SelectItem value="Apple" />
+*       <SelectItem value="Orange" />
+*     </SelectRow>
+*     <SelectRow>
+*       <SelectItem value="Banana" />
+*       <SelectItem value="Grape" />
+*     </SelectRow>
+*   </SelectPopover>
+* </SelectProvider>
+* ```
+*/
+const SelectRow = forwardRef(function SelectRow(props) {
+	return createElement(TagName, useSelectRow(props));
+});
+//#endregion
+export { SelectRow, useSelectRow };
+
+//# sourceMappingURL=select-row.js.map

package/dist/select/select-row.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"select-row.js","names":[],"sources":["../../src/select/select-row.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 { CompositeRowOptions } from \"../composite/composite-row.tsx\";\nimport { useCompositeRow } from \"../composite/composite-row.tsx\";\nimport { useSelectContext } from \"./select-context.tsx\";\nimport type { SelectStore } from \"./select-store.ts\";\n\nconst TagName = \"div\" satisfies ElementType;\ntype TagName = typeof TagName;\n\n/**\n * Returns props to create a `SelectRow` component.\n * @see https://ariakit.com/components/select\n * @example\n * ```jsx\n * const store = useSelectStore();\n * const props = useSelectRow({ store });\n * <SelectPopover store={store}>\n *   <Role {...props}>\n *     <SelectItem value=\"Apple\" />\n *     <SelectItem value=\"Orange\" />\n *   </Role>\n * </SelectPopover>\n * ```\n */\nexport const useSelectRow = createHook<TagName, SelectRowOptions>(\n  function useSelectRow({ store, ...props }) {\n    const context = useSelectContext();\n    store = store || context;\n\n    invariant(\n      store,\n      process.env.NODE_ENV !== \"production\" &&\n        \"SelectRow must be wrapped in a SelectList or SelectPopover component\",\n    );\n\n    const listElement = useStoreState(store, \"listElement\");\n    const popupRole = getPopupRole(listElement);\n    const role = popupRole === \"grid\" ? \"row\" : \"presentation\";\n\n    props = { role, ...props };\n\n    props = useCompositeRow({ store, ...props });\n\n    return props;\n  },\n);\n\n/**\n * Renders a select row that allows two-dimensional arrow key navigation.\n * [`SelectItem`](https://ariakit.com/reference/select-item) elements wrapped\n * within this component will automatically receive a\n * [`rowId`](https://ariakit.com/reference/select-item#rowid) prop.\n * @see https://ariakit.com/components/select\n * @example\n * ```jsx {4-11}\n * <SelectProvider>\n *   <Select />\n *   <SelectPopover>\n *     <SelectRow>\n *       <SelectItem value=\"Apple\" />\n *       <SelectItem value=\"Orange\" />\n *     </SelectRow>\n *     <SelectRow>\n *       <SelectItem value=\"Banana\" />\n *       <SelectItem value=\"Grape\" />\n *     </SelectRow>\n *   </SelectPopover>\n * </SelectProvider>\n * ```\n */\nexport const SelectRow = forwardRef(function SelectRow(props: SelectRowProps) {\n  const htmlProps = useSelectRow(props);\n  return createElement(TagName, htmlProps);\n});\n\nexport interface SelectRowOptions<\n  T extends ElementType = TagName,\n> extends CompositeRowOptions<T> {\n  /**\n   * Object returned by the\n   * [`useSelectStore`](https://ariakit.com/reference/use-select-store) hook. If\n   * not provided, the parent\n   * [`SelectList`](https://ariakit.com/reference/select-list) or\n   * [`SelectPopover`](https://ariakit.com/reference/select-popover) components'\n   * context will be used.\n   */\n  store?: SelectStore;\n}\n\nexport type SelectRowProps<T extends ElementType = TagName> = Props<\n  T,\n  SelectRowOptions<T>\n>;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;MA8BI,eAAgB,WAAA,SAAiB,aAAA,EAAA,OAAA,GAAA,SAAA;CACjC,MAAA,UAAQ,iBAAS;CAEjB,QAAA,SAGI;CAOJ,UAAQ,OAAA,sEAAA;SAHU;EAGF,MAAG,aAAA,cAAA,OAAA,aAAA,CAAA,MAAA,SAAA,QAAA;EAAM,GAAA;CAEzB;SAA0B,gBAAA;EAAO;EAAU,GAAA;CAE3C,CAAA;CAEJ,OAAA;;;;;;;;;;;;;;;;;;;;;;;;;MA2BE,YAAO,WAAc,SADH,UAAa,OACQ;CACxC,OAAA,cAAA,SAAA,aAAA,KAAA,CAAA"}

package/dist/select/select-separator.d.ts

@@ -0,0 +1,60 @@
+import { CompositeSeparatorOptions } from "../composite/composite-separator.js";
+import { t as SelectStore } from "../select-store-BsLTAyKh.js";
+import { Props } from "@ariakit/react-utils";
+import { ElementType } from "react";
+
+//#region src/select/select-separator.d.ts
+declare const TagName = "hr";
+type TagName = typeof TagName;
+/**
+ * Returns props to create a `SelectSeparator` component.
+ * @deprecated Use `useSelectGroup` with CSS borders instead.
+ * @see https://ariakit.com/components/select
+ * @example
+ * ```jsx
+ * const store = useSelectStore();
+ * const props = useSelectSeparator({ store });
+ * <SelectPopover store={store}>
+ *   <SelectItem value="Item 1" />
+ *   <Role {...props} />
+ *   <SelectItem value="Item 2" />
+ *   <SelectItem value="Item 3" />
+ * </SelectPopover>
+ * ```
+ */
+declare const useSelectSeparator: import("@ariakit/react-utils").Hook<"hr", SelectSeparatorOptions<"hr">>;
+/**
+ * Renders a divider between
+ * [`SelectItem`](https://ariakit.com/reference/select-item) elements.
+ * @deprecated Use [`SelectGroup`](https://ariakit.com/reference/select-group)
+ * with CSS borders instead.
+ * @see https://ariakit.com/components/select
+ * @example
+ * ```jsx {5}
+ * <SelectProvider>
+ *   <Select />
+ *   <SelectPopover>
+ *     <SelectItem value="Item 1" />
+ *     <SelectSeparator />
+ *     <SelectItem value="Item 2" />
+ *     <SelectItem value="Item 3" />
+ *   </SelectPopover>
+ * </SelectProvider>
+ * ```
+ */
+declare const SelectSeparator: (props: SelectSeparatorProps) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>;
+interface SelectSeparatorOptions<T extends ElementType = TagName> extends CompositeSeparatorOptions<T> {
+  /**
+   * Object returned by the
+   * [`useSelectStore`](https://ariakit.com/reference/use-select-store) hook. If
+   * not provided, the parent
+   * [`SelectList`](https://ariakit.com/reference/select-list) or
+   * [`SelectPopover`](https://ariakit.com/reference/select-popover) components'
+   * context will be used.
+   */
+  store?: SelectStore;
+}
+type SelectSeparatorProps<T extends ElementType = TagName> = Props<T, SelectSeparatorOptions<T>>;
+//#endregion
+export { SelectSeparator, SelectSeparatorOptions, SelectSeparatorProps, useSelectSeparator };
+//# sourceMappingURL=select-separator.d.ts.map

package/dist/select/select-separator.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"select-separator.d.ts","names":["Props","ElementType","CompositeSeparatorOptions","SelectStore","TagName","useSelectSeparator","SelectSeparatorOptions","Hook","SelectSeparator","SelectSeparatorProps","props","ReactElement","JSXElementConstructor","T","store"],"sources":["../../src/select/select-separator.d.ts"],"mappings":";;;;;;cAIcI,OAAAA;AAAAA,KACTA,OAAAA,UAAiBA,OAAO;AAFwB;;;;AAChC;AAAA;;;;AACQ;AAiB7B;;;;AAAyG;AAoBzG;AAvCqD,cAmBhCC,kBAAAA,iCAAmDE,IAAAA,OAAWD,sBAAsB;;;;;;;;AAoB8C;AACvJ;;;;;;;;;;;cADqBE,eAAAA,GAAkBE,KAAAA,EAAOD,oBAAoB,qBAAqBE,YAAAA,+BAA2CC,qBAAAA;AAAAA,UACjHN,sBAAAA,WAAiCL,WAAAA,GAAcG,OAAAA,UAAiBF,yBAAAA,CAA0BW,CAAAA;EAA1BX;;;;;AAS1D;AAEvB;;EAFIY,KAAAA,GAAQX,WAAAA;AAAAA;AAAAA,KAEAM,oBAAAA,WAA+BR,WAAAA,GAAcG,OAAAA,IAAWJ,KAAAA,CAAMa,CAAAA,EAAGP,sBAAAA,CAAuBO,CAAAA"}

package/dist/select/select-separator.js

@@ -0,0 +1,57 @@
+"use client";
+import { useCompositeSeparator } from "../composite/composite-separator.js";
+import { useSelectContext } from "./select-context.js";
+import { createElement, createHook, forwardRef } from "@ariakit/react-utils";
+//#region src/select/select-separator.tsx
+const TagName = "hr";
+/**
+* Returns props to create a `SelectSeparator` component.
+* @deprecated Use `useSelectGroup` with CSS borders instead.
+* @see https://ariakit.com/components/select
+* @example
+* ```jsx
+* const store = useSelectStore();
+* const props = useSelectSeparator({ store });
+* <SelectPopover store={store}>
+*   <SelectItem value="Item 1" />
+*   <Role {...props} />
+*   <SelectItem value="Item 2" />
+*   <SelectItem value="Item 3" />
+* </SelectPopover>
+* ```
+*/
+const useSelectSeparator = createHook(function useSelectSeparator({ store, ...props }) {
+	const context = useSelectContext();
+	store = store || context;
+	props = useCompositeSeparator({
+		store,
+		...props
+	});
+	return props;
+});
+/**
+* Renders a divider between
+* [`SelectItem`](https://ariakit.com/reference/select-item) elements.
+* @deprecated Use [`SelectGroup`](https://ariakit.com/reference/select-group)
+* with CSS borders instead.
+* @see https://ariakit.com/components/select
+* @example
+* ```jsx {5}
+* <SelectProvider>
+*   <Select />
+*   <SelectPopover>
+*     <SelectItem value="Item 1" />
+*     <SelectSeparator />
+*     <SelectItem value="Item 2" />
+*     <SelectItem value="Item 3" />
+*   </SelectPopover>
+* </SelectProvider>
+* ```
+*/
+const SelectSeparator = forwardRef(function SelectSeparator(props) {
+	return createElement(TagName, useSelectSeparator(props));
+});
+//#endregion
+export { SelectSeparator, useSelectSeparator };
+
+//# sourceMappingURL=select-separator.js.map

package/dist/select/select-separator.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"select-separator.js","names":[],"sources":["../../src/select/select-separator.tsx"],"sourcesContent":["import { createElement, createHook, forwardRef } from \"@ariakit/react-utils\";\nimport type { Props } from \"@ariakit/react-utils\";\nimport type { ElementType } from \"react\";\nimport type { CompositeSeparatorOptions } from \"../composite/composite-separator.tsx\";\nimport { useCompositeSeparator } from \"../composite/composite-separator.tsx\";\nimport { useSelectContext } from \"./select-context.tsx\";\nimport type { SelectStore } from \"./select-store.ts\";\n\nconst TagName = \"hr\" satisfies ElementType;\ntype TagName = typeof TagName;\n\n/**\n * Returns props to create a `SelectSeparator` component.\n * @deprecated Use `useSelectGroup` with CSS borders instead.\n * @see https://ariakit.com/components/select\n * @example\n * ```jsx\n * const store = useSelectStore();\n * const props = useSelectSeparator({ store });\n * <SelectPopover store={store}>\n *   <SelectItem value=\"Item 1\" />\n *   <Role {...props} />\n *   <SelectItem value=\"Item 2\" />\n *   <SelectItem value=\"Item 3\" />\n * </SelectPopover>\n * ```\n */\nexport const useSelectSeparator = createHook<TagName, SelectSeparatorOptions>(\n  function useSelectSeparator({ store, ...props }) {\n    const context = useSelectContext();\n    store = store || context;\n    props = useCompositeSeparator({ store, ...props });\n    return props;\n  },\n);\n\n/**\n * Renders a divider between\n * [`SelectItem`](https://ariakit.com/reference/select-item) elements.\n * @deprecated Use [`SelectGroup`](https://ariakit.com/reference/select-group)\n * with CSS borders instead.\n * @see https://ariakit.com/components/select\n * @example\n * ```jsx {5}\n * <SelectProvider>\n *   <Select />\n *   <SelectPopover>\n *     <SelectItem value=\"Item 1\" />\n *     <SelectSeparator />\n *     <SelectItem value=\"Item 2\" />\n *     <SelectItem value=\"Item 3\" />\n *   </SelectPopover>\n * </SelectProvider>\n * ```\n */\nexport const SelectSeparator = forwardRef(function SelectSeparator(\n  props: SelectSeparatorProps,\n) {\n  const htmlProps = useSelectSeparator(props);\n  return createElement(TagName, htmlProps);\n});\n\nexport interface SelectSeparatorOptions<\n  T extends ElementType = TagName,\n> extends CompositeSeparatorOptions<T> {\n  /**\n   * Object returned by the\n   * [`useSelectStore`](https://ariakit.com/reference/use-select-store) hook. If\n   * not provided, the parent\n   * [`SelectList`](https://ariakit.com/reference/select-list) or\n   * [`SelectPopover`](https://ariakit.com/reference/select-popover) components'\n   * context will be used.\n   */\n  store?: SelectStore;\n}\n\nexport type SelectSeparatorProps<T extends ElementType = TagName> = Props<\n  T,\n  SelectSeparatorOptions<T>\n>;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;MA6BI,qBAAgB,WAAiB,SAAA,mBAAA,EAAA,OAAA,GAAA,SAAA;CACjC,MAAA,UAAQ,iBAAS;CACjB,QAAQ,SAAA;SAAwB,sBAAA;EAAO;EAAU,GAAA;CACjD,CAAA;CAEJ,OAAA;;;;;;;;;;;;;;;;;;;;;MAyBE,kBAAqB,WADH,SAAA,gBACqB,OAAA;CACxC,OAAA,cAAA,SAAA,mBAAA,KAAA,CAAA"}

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

@@ -0,0 +1,2 @@
+import { a as SelectStoreProps, c as useSelectStore, i as SelectStoreOptions, l as useSelectStoreOptions, n as SelectStoreFunctions, o as SelectStoreState, r as SelectStoreItem, s as SelectStoreValue, t as SelectStore, u as useSelectStoreProps } from "../select-store-BsLTAyKh.js";
+export { SelectStore, SelectStoreFunctions, SelectStoreItem, SelectStoreOptions, SelectStoreProps, SelectStoreState, SelectStoreValue, useSelectStore, useSelectStoreOptions, useSelectStoreProps };

package/dist/select/select-store.js

@@ -0,0 +1,31 @@
+"use client";
+import { useComboboxProviderContext } from "../combobox/combobox-context.js";
+import { useCompositeStoreOptions, useCompositeStoreProps } from "../composite/composite-store.js";
+import { usePopoverStoreProps } from "../popover/popover-store.js";
+import { useUpdateEffect } from "@ariakit/react-utils";
+import { useStore, useStoreProps } from "@ariakit/react-store";
+import * as Core from "@ariakit/components/select/select-store";
+//#region src/select/select-store.ts
+function useSelectStoreOptions(props) {
+	const combobox = useComboboxProviderContext();
+	props = {
+		...props,
+		combobox: props.combobox !== void 0 ? props.combobox : combobox
+	};
+	return useCompositeStoreOptions(props);
+}
+function useSelectStoreProps(store, update, props) {
+	useUpdateEffect(update, [props.combobox]);
+	useStoreProps(store, props, "value", "setValue");
+	useStoreProps(store, props, "setValueOnMove");
+	return Object.assign(usePopoverStoreProps(useCompositeStoreProps(store, update, props), update, props), { combobox: props.combobox });
+}
+function useSelectStore(props = {}) {
+	props = useSelectStoreOptions(props);
+	const [store, update] = useStore(Core.createSelectStore, props);
+	return useSelectStoreProps(store, update, props);
+}
+//#endregion
+export { useSelectStore, useSelectStoreOptions, useSelectStoreProps };
+
+//# sourceMappingURL=select-store.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"select-store.js","names":[],"sources":["../../src/select/select-store.ts"],"sourcesContent":["import * as Core from \"@ariakit/components/select/select-store\";\nimport { useStore, useStoreProps } from \"@ariakit/react-store\";\nimport type { Store } from \"@ariakit/react-store\";\nimport { useUpdateEffect } from \"@ariakit/react-utils\";\nimport type { BivariantCallback, PickRequired } from \"@ariakit/utils\";\nimport { useComboboxProviderContext } from \"../combobox/combobox-context.tsx\";\nimport type { ComboboxStore } from \"../combobox/combobox-store.ts\";\nimport type {\n  CompositeStoreFunctions,\n  CompositeStoreOptions,\n  CompositeStoreState,\n} from \"../composite/composite-store.ts\";\nimport {\n  useCompositeStoreOptions,\n  useCompositeStoreProps,\n} from \"../composite/composite-store.ts\";\nimport type {\n  PopoverStoreFunctions,\n  PopoverStoreOptions,\n  PopoverStoreState,\n} from \"../popover/popover-store.ts\";\nimport { usePopoverStoreProps } from \"../popover/popover-store.ts\";\n\nexport function useSelectStoreOptions<T extends Core.SelectStoreOptions>(\n  props: T,\n) {\n  const combobox = useComboboxProviderContext();\n  props = {\n    ...props,\n    combobox: props.combobox !== undefined ? props.combobox : combobox,\n  };\n  return useCompositeStoreOptions(props);\n}\n\nexport function useSelectStoreProps<T extends Core.SelectStore>(\n  store: T,\n  update: () => void,\n  props: SelectStoreProps,\n) {\n  useUpdateEffect(update, [props.combobox]);\n  useStoreProps(store, props, \"value\", \"setValue\");\n  useStoreProps(store, props, \"setValueOnMove\");\n  return Object.assign(\n    usePopoverStoreProps(\n      useCompositeStoreProps(store, update, props),\n      update,\n      props,\n    ),\n    { combobox: props.combobox },\n  );\n}\n\n/**\n * Creates a select store to control the state of\n * [Select](https://ariakit.com/components/select) components.\n * @see https://ariakit.com/components/select\n * @example\n * ```jsx\n * const select = useSelectStore({ defaultValue: \"Apple\" });\n *\n * <Select store={select} />\n * <SelectPopover store={select}>\n *   <SelectItem value=\"Apple\" />\n *   <SelectItem value=\"Orange\" />\n * </SelectPopover>\n * ```\n */\nexport function useSelectStore<T extends SelectStoreValue = SelectStoreValue>(\n  props: PickRequired<SelectStoreProps<T>, \"value\" | \"defaultValue\">,\n): SelectStore<T>;\n\nexport function useSelectStore(props?: SelectStoreProps): SelectStore;\n\nexport function useSelectStore(props: SelectStoreProps = {}): SelectStore {\n  props = useSelectStoreOptions(props);\n  const [store, update] = useStore(Core.createSelectStore, props);\n  return useSelectStoreProps(store, update, props);\n}\n\nexport type SelectStoreValue = Core.SelectStoreValue;\n\nexport interface SelectStoreItem extends Core.SelectStoreItem {}\n\nexport interface SelectStoreState<T extends SelectStoreValue = SelectStoreValue>\n  extends\n    Core.SelectStoreState<T>,\n    CompositeStoreState<SelectStoreItem>,\n    PopoverStoreState {}\n\nexport interface SelectStoreFunctions<\n  T extends SelectStoreValue = SelectStoreValue,\n>\n  extends\n    Pick<SelectStoreOptions<T>, \"combobox\" | \"disclosure\">,\n    Omit<Core.SelectStoreFunctions<T>, \"combobox\" | \"disclosure\">,\n    CompositeStoreFunctions<SelectStoreItem>,\n    PopoverStoreFunctions {}\n\nexport interface SelectStoreOptions<\n  T extends SelectStoreValue = SelectStoreValue,\n>\n  extends\n    Omit<Core.SelectStoreOptions<T>, \"combobox\" | \"disclosure\">,\n    CompositeStoreOptions<SelectStoreItem>,\n    PopoverStoreOptions {\n  /**\n   * Function that will be called when the\n   * [`value`](https://ariakit.com/reference/select-provider#value) state\n   * changes.\n   *\n   * Live examples:\n   * - [Form with Select](https://ariakit.com/examples/form-select)\n   * - [Select Grid](https://ariakit.com/examples/select-grid)\n   * - [Select with custom\n   *   items](https://ariakit.com/examples/select-item-custom)\n   * - [Multi-Select](https://ariakit.com/examples/select-multiple)\n   * - [Toolbar with Select](https://ariakit.com/examples/toolbar-select)\n   * - [Select with Next.js App\n   *   Router](https://ariakit.com/examples/select-next-router)\n   */\n  setValue?: BivariantCallback<(value: SelectStoreState<T>[\"value\"]) => void>;\n  /**\n   * A reference to a [combobox\n   * store](https://ariakit.com/reference/use-combobox-store). It's\n   * automatically set when composing [Select with\n   * Combobox](https://ariakit.com/examples/select-combobox).\n   */\n  combobox?: ComboboxStore | null;\n}\n\nexport interface SelectStoreProps<T extends SelectStoreValue = SelectStoreValue>\n  extends\n    SelectStoreOptions<T>,\n    Omit<Core.SelectStoreProps<T>, \"combobox\" | \"disclosure\"> {}\n\nexport interface SelectStore<T extends SelectStoreValue = SelectStoreValue>\n  extends\n    SelectStoreFunctions<T>,\n    Omit<Store<Core.SelectStore<T>>, \"combobox\" | \"disclosure\"> {}\n"],"mappings":";;;;;;;;SA0BQ,sBAAW,OAAA;CACjB,MAAA,WAAQ,2BAAA;SACH;EACH,GAAA;EACF,UAAA,MAAA,aAAA,KAAA,IAAA,MAAA,WAAA;CACA;CACF,OAAA,yBAAA,KAAA;AAEA;SAKE,oBAAyB,OAAM,QAAS,OAAA;CACxC,gBAAc,QAAO,CAAA,MAAO,QAAS,CAAA;CACrC,cAAc,OAAO,OAAO,SAAA,UAAgB;CAC5C,cAAc,OACZ,OAAA,gBACE;CAMN,OAAA,OAAA,OAAA,qBAAA,uBAAA,OAAA,QAAA,KAAA,GAAA,QAAA,KAAA,GAAA,EAAA,UAAA,MAAA,SAAA,CAAA;AAuBA;SACU,eAAA,QAAsB,CAAA,GAAK;CACnC,QAAO,sBAAiB,KAAS;CACjC,MAAA,CAAO,OAAA,UAAA,SAAoB,KAAO,mBAAa,KAAA;CACjD,OAAA,oBAAA,OAAA,QAAA,KAAA"}