@ariakit/core 0.3.3 → 0.3.4

package/cjs/popover/popover-store.d.cts

@@ -0,0 +1,69 @@
+import type { DialogStoreFunctions, DialogStoreOptions, DialogStoreState } from "../dialog/dialog-store.js";
+import type { Store, StoreOptions, StoreProps } from "../utils/store.js";
+import type { SetState } from "../utils/types.js";
+type BasePlacement = "top" | "bottom" | "left" | "right";
+type Placement = BasePlacement | `${BasePlacement}-start` | `${BasePlacement}-end`;
+/**
+ * Creates a popover store.
+ */
+export declare function createPopoverStore({ popover: otherPopover, ...props }?: PopoverStoreProps): PopoverStore;
+export interface PopoverStoreState extends DialogStoreState {
+    /**
+     * The anchor element.
+     */
+    anchorElement: HTMLElement | null;
+    /**
+     * The popover element that will render the placement attributes.
+     */
+    popoverElement: HTMLElement | null;
+    /**
+     * The arrow element.
+     */
+    arrowElement: HTMLElement | null;
+    /**
+     * The current temporary placement state of the popover. This may be different
+     * from the the `placement` state if the popover has needed to update its
+     * position on the fly.
+     */
+    currentPlacement: Placement;
+    /**
+     * The placement of the popover.
+     * @default "bottom"
+     */
+    placement: Placement;
+    /**
+     * A symbol that's used to recompute the popover position when the `render`
+     * method is called.
+     */
+    rendered: symbol;
+}
+export interface PopoverStoreFunctions extends DialogStoreFunctions {
+    /**
+     * Sets the anchor element.
+     */
+    setAnchorElement: SetState<PopoverStoreState["anchorElement"]>;
+    /**
+     * Sets the popover element.
+     */
+    setPopoverElement: SetState<PopoverStoreState["popoverElement"]>;
+    /**
+     * Sets the arrow element.
+     */
+    setArrowElement: SetState<PopoverStoreState["arrowElement"]>;
+    /**
+     * A function that can be used to recompute the popover position. This is
+     * useful when the popover anchor changes in a way that affects the popover
+     * position.
+     */
+    render: () => void;
+}
+export interface PopoverStoreOptions extends StoreOptions<PopoverStoreState, "placement">, DialogStoreOptions {
+    /**
+     * A reference to another popover store that's controlling another popover to
+     * keep them in sync.
+     */
+    popover?: PopoverStore | null;
+}
+export type PopoverStoreProps = PopoverStoreOptions & StoreProps<PopoverStoreState>;
+export type PopoverStore = PopoverStoreFunctions & Store<PopoverStoreState>;
+export {};

package/cjs/radio/radio-store.cjs

@@ -1,39 +1,40 @@
-"use strict";Object.defineProperty(exports, "__esModule", {value: true});
+"use strict";Object.defineProperty(exports, "__esModule", {value: true});"use client";
 
-var _TTWS4MDCcjs = require('../__chunks/TTWS4MDC.cjs');
-require('../__chunks/W5IQT6Z2.cjs');
 
+var _M44E4T5Acjs = require('../__chunks/M44E4T5A.cjs');
+require('../__chunks/25WWT2VO.cjs');
 
-var _A4GDJCZBcjs = require('../__chunks/A4GDJCZB.cjs');
 
+var _OASSVCYRcjs = require('../__chunks/OASSVCYR.cjs');
 
-var _RCYVACJOcjs = require('../__chunks/RCYVACJO.cjs');
-require('../__chunks/EXM2AW52.cjs');
-require('../__chunks/GDZQUFNP.cjs');
 
+var _LMT335NJcjs = require('../__chunks/LMT335NJ.cjs');
+require('../__chunks/FTB5CXVB.cjs');
+require('../__chunks/ULSPM3Y3.cjs');
 
 
 
-var _72I2GWXFcjs = require('../__chunks/72I2GWXF.cjs');
+
+var _WYXAWBLEcjs = require('../__chunks/WYXAWBLE.cjs');
 
 // src/radio/radio-store.ts
 function createRadioStore(_a = {}) {
-  var props = _72I2GWXFcjs.__objRest.call(void 0, _a, []);
+  var props = _WYXAWBLEcjs.__objRest.call(void 0, _a, []);
   var _a2;
   const syncState = (_a2 = props.store) == null ? void 0 : _a2.getState();
-  const composite = _TTWS4MDCcjs.createCompositeStore.call(void 0, _72I2GWXFcjs.__spreadProps.call(void 0, _72I2GWXFcjs.__spreadValues.call(void 0, {}, props), {
-    focusLoop: _RCYVACJOcjs.defaultValue.call(void 0, props.focusLoop, syncState == null ? void 0 : syncState.focusLoop, true)
+  const composite = _M44E4T5Acjs.createCompositeStore.call(void 0, _WYXAWBLEcjs.__spreadProps.call(void 0, _WYXAWBLEcjs.__spreadValues.call(void 0, {}, props), {
+    focusLoop: _LMT335NJcjs.defaultValue.call(void 0, props.focusLoop, syncState == null ? void 0 : syncState.focusLoop, true)
   }));
-  const initialState = _72I2GWXFcjs.__spreadProps.call(void 0, _72I2GWXFcjs.__spreadValues.call(void 0, {}, composite.getState()), {
-    value: _RCYVACJOcjs.defaultValue.call(void 0, 
+  const initialState = _WYXAWBLEcjs.__spreadProps.call(void 0, _WYXAWBLEcjs.__spreadValues.call(void 0, {}, composite.getState()), {
+    value: _LMT335NJcjs.defaultValue.call(void 0, 
       props.value,
       syncState == null ? void 0 : syncState.value,
       props.defaultValue,
       null
     )
   });
-  const radio = _A4GDJCZBcjs.createStore.call(void 0, initialState, composite, props.store);
-  return _72I2GWXFcjs.__spreadProps.call(void 0, _72I2GWXFcjs.__spreadValues.call(void 0, _72I2GWXFcjs.__spreadValues.call(void 0, {}, composite), radio), {
+  const radio = _OASSVCYRcjs.createStore.call(void 0, initialState, composite, props.store);
+  return _WYXAWBLEcjs.__spreadProps.call(void 0, _WYXAWBLEcjs.__spreadValues.call(void 0, _WYXAWBLEcjs.__spreadValues.call(void 0, {}, composite), radio), {
     setValue: (value) => radio.setState("value", value)
   });
 }

package/cjs/radio/radio-store.d.cts

@@ -0,0 +1,36 @@
+import type { CompositeStoreFunctions, CompositeStoreOptions, CompositeStoreState } from "../composite/composite-store.js";
+import type { Store, StoreOptions, StoreProps } from "../utils/store.js";
+import type { SetState } from "../utils/types.js";
+/**
+ * Creates a radio store.
+ */
+export declare function createRadioStore({ ...props }?: RadioStoreProps): RadioStore;
+export interface RadioStoreState extends CompositeStoreState {
+    /**
+     * @default true
+     */
+    focusLoop: CompositeStoreState["focusLoop"];
+    /**
+     * The value of the radio group.
+     * @default null
+     */
+    value: string | number | null;
+}
+export interface RadioStoreFunctions extends CompositeStoreFunctions {
+    /**
+     * Sets the `value` state.
+     * @example
+     * store.setValue("apple");
+     * store.setValue((value) => value === "apple" ? "orange" : "apple");
+     */
+    setValue: SetState<RadioStoreState["value"]>;
+}
+export interface RadioStoreOptions extends StoreOptions<RadioStoreState, "focusLoop" | "value">, CompositeStoreOptions {
+    /**
+     * The default value of the radio group.
+     * @default null
+     */
+    defaultValue?: RadioStoreState["value"];
+}
+export type RadioStoreProps = RadioStoreOptions & StoreProps<RadioStoreState>;
+export type RadioStore = RadioStoreFunctions & Store<RadioStoreState>;

package/cjs/select/select-store.cjs

@@ -1,13 +1,13 @@
-"use strict";Object.defineProperty(exports, "__esModule", {value: true});
+"use strict";Object.defineProperty(exports, "__esModule", {value: true});"use client";
 
-var _ZYIEFAMBcjs = require('../__chunks/ZYIEFAMB.cjs');
-require('../__chunks/DFFIYGBS.cjs');
-require('../__chunks/A7K3KZJL.cjs');
 
+var _ROX3MRGOcjs = require('../__chunks/ROX3MRGO.cjs');
+require('../__chunks/MLPOXRDT.cjs');
+require('../__chunks/YXSGST3H.cjs');
 
-var _TTWS4MDCcjs = require('../__chunks/TTWS4MDC.cjs');
-require('../__chunks/W5IQT6Z2.cjs');
 
+var _M44E4T5Acjs = require('../__chunks/M44E4T5A.cjs');
+require('../__chunks/25WWT2VO.cjs');
 
 
 
@@ -15,30 +15,31 @@ require('../__chunks/W5IQT6Z2.cjs');
 
 
 
-var _A4GDJCZBcjs = require('../__chunks/A4GDJCZB.cjs');
 
+var _OASSVCYRcjs = require('../__chunks/OASSVCYR.cjs');
 
-var _RCYVACJOcjs = require('../__chunks/RCYVACJO.cjs');
-require('../__chunks/EXM2AW52.cjs');
 
+var _LMT335NJcjs = require('../__chunks/LMT335NJ.cjs');
+require('../__chunks/FTB5CXVB.cjs');
 
-var _GDZQUFNPcjs = require('../__chunks/GDZQUFNP.cjs');
 
+var _ULSPM3Y3cjs = require('../__chunks/ULSPM3Y3.cjs');
 
 
 
-var _72I2GWXFcjs = require('../__chunks/72I2GWXF.cjs');
+
+var _WYXAWBLEcjs = require('../__chunks/WYXAWBLE.cjs');
 
 // src/select/select-store.ts
 function createSelectStore(_a = {}) {
   var _b = _a, {
     combobox
-  } = _b, props = _72I2GWXFcjs.__objRest.call(void 0, _b, [
+  } = _b, props = _WYXAWBLEcjs.__objRest.call(void 0, _b, [
     "combobox"
   ]);
-  const store = _A4GDJCZBcjs.mergeStore.call(void 0, 
+  const store = _OASSVCYRcjs.mergeStore.call(void 0, 
     props.store,
-    _A4GDJCZBcjs.omit.call(void 0, combobox, [
+    _OASSVCYRcjs.omit.call(void 0, combobox, [
       "value",
       "items",
       "renderedItems",
@@ -50,60 +51,60 @@ function createSelectStore(_a = {}) {
       "disclosureElement"
     ])
   );
-  _A4GDJCZBcjs.throwOnConflictingProps.call(void 0, props, store);
+  _OASSVCYRcjs.throwOnConflictingProps.call(void 0, props, store);
   const syncState = store.getState();
-  const composite = _TTWS4MDCcjs.createCompositeStore.call(void 0, _72I2GWXFcjs.__spreadProps.call(void 0, _72I2GWXFcjs.__spreadValues.call(void 0, {}, props), {
+  const composite = _M44E4T5Acjs.createCompositeStore.call(void 0, _WYXAWBLEcjs.__spreadProps.call(void 0, _WYXAWBLEcjs.__spreadValues.call(void 0, {}, props), {
     store,
-    virtualFocus: _RCYVACJOcjs.defaultValue.call(void 0, 
+    virtualFocus: _LMT335NJcjs.defaultValue.call(void 0, 
       props.virtualFocus,
       syncState.virtualFocus,
       true
     ),
-    includesBaseElement: _RCYVACJOcjs.defaultValue.call(void 0, 
+    includesBaseElement: _LMT335NJcjs.defaultValue.call(void 0, 
       props.includesBaseElement,
       syncState.includesBaseElement,
       false
     ),
-    activeId: _RCYVACJOcjs.defaultValue.call(void 0, 
+    activeId: _LMT335NJcjs.defaultValue.call(void 0, 
       props.activeId,
       syncState.activeId,
       props.defaultActiveId,
       null
     ),
-    orientation: _RCYVACJOcjs.defaultValue.call(void 0, 
+    orientation: _LMT335NJcjs.defaultValue.call(void 0, 
       props.orientation,
       syncState.orientation,
       "vertical"
     )
   }));
-  const popover = _ZYIEFAMBcjs.createPopoverStore.call(void 0, _72I2GWXFcjs.__spreadProps.call(void 0, _72I2GWXFcjs.__spreadValues.call(void 0, {}, props), {
+  const popover = _ROX3MRGOcjs.createPopoverStore.call(void 0, _WYXAWBLEcjs.__spreadProps.call(void 0, _WYXAWBLEcjs.__spreadValues.call(void 0, {}, props), {
     store,
-    placement: _RCYVACJOcjs.defaultValue.call(void 0, 
+    placement: _LMT335NJcjs.defaultValue.call(void 0, 
       props.placement,
       syncState.placement,
       "bottom-start"
     )
   }));
   const initialValue = new String("");
-  const initialState = _72I2GWXFcjs.__spreadProps.call(void 0, _72I2GWXFcjs.__spreadValues.call(void 0, _72I2GWXFcjs.__spreadValues.call(void 0, {}, composite.getState()), popover.getState()), {
-    value: _RCYVACJOcjs.defaultValue.call(void 0, 
+  const initialState = _WYXAWBLEcjs.__spreadProps.call(void 0, _WYXAWBLEcjs.__spreadValues.call(void 0, _WYXAWBLEcjs.__spreadValues.call(void 0, {}, composite.getState()), popover.getState()), {
+    value: _LMT335NJcjs.defaultValue.call(void 0, 
       props.value,
       syncState.value,
       props.defaultValue,
       initialValue
     ),
-    setValueOnMove: _RCYVACJOcjs.defaultValue.call(void 0, 
+    setValueOnMove: _LMT335NJcjs.defaultValue.call(void 0, 
       props.setValueOnMove,
       syncState.setValueOnMove,
       false
     ),
-    selectElement: _RCYVACJOcjs.defaultValue.call(void 0, syncState.selectElement, null),
-    labelElement: _RCYVACJOcjs.defaultValue.call(void 0, syncState.labelElement, null)
+    selectElement: _LMT335NJcjs.defaultValue.call(void 0, syncState.selectElement, null),
+    labelElement: _LMT335NJcjs.defaultValue.call(void 0, syncState.labelElement, null)
   });
-  const select = _A4GDJCZBcjs.createStore.call(void 0, initialState, composite, popover, store);
-  _A4GDJCZBcjs.setup.call(void 0, 
+  const select = _OASSVCYRcjs.createStore.call(void 0, initialState, composite, popover, store);
+  _OASSVCYRcjs.setup.call(void 0, 
     select,
-    () => _A4GDJCZBcjs.sync.call(void 0, select, ["value", "items"], (state) => {
+    () => _OASSVCYRcjs.sync.call(void 0, select, ["value", "items"], (state) => {
       if (state.value !== initialValue)
         return;
       if (!state.items.length)
@@ -116,14 +117,14 @@ function createSelectStore(_a = {}) {
       select.setState("value", item.value);
     })
   );
-  _A4GDJCZBcjs.setup.call(void 0, 
+  _OASSVCYRcjs.setup.call(void 0, 
     select,
-    () => _A4GDJCZBcjs.sync.call(void 0, select, ["mounted", "items", "value"], (state) => {
+    () => _OASSVCYRcjs.sync.call(void 0, select, ["mounted", "items", "value"], (state) => {
       if (combobox)
         return;
       if (state.mounted)
         return;
-      const values = _GDZQUFNPcjs.toArray.call(void 0, state.value);
+      const values = _ULSPM3Y3cjs.toArray.call(void 0, state.value);
       const lastValue = values[values.length - 1];
       if (lastValue == null)
         return;
@@ -135,9 +136,9 @@ function createSelectStore(_a = {}) {
       select.setState("activeId", item.id);
     })
   );
-  _A4GDJCZBcjs.setup.call(void 0, 
+  _OASSVCYRcjs.setup.call(void 0, 
     select,
-    () => _A4GDJCZBcjs.batch.call(void 0, select, ["setValueOnMove", "moves"], (state) => {
+    () => _OASSVCYRcjs.batch.call(void 0, select, ["setValueOnMove", "moves"], (state) => {
       const { mounted, value, activeId } = select.getState();
       if (!state.setValueOnMove && mounted)
         return;
@@ -153,7 +154,7 @@ function createSelectStore(_a = {}) {
       select.setState("value", item.value);
     })
   );
-  return _72I2GWXFcjs.__spreadProps.call(void 0, _72I2GWXFcjs.__spreadValues.call(void 0, _72I2GWXFcjs.__spreadValues.call(void 0, _72I2GWXFcjs.__spreadValues.call(void 0, {}, composite), popover), select), {
+  return _WYXAWBLEcjs.__spreadProps.call(void 0, _WYXAWBLEcjs.__spreadValues.call(void 0, _WYXAWBLEcjs.__spreadValues.call(void 0, _WYXAWBLEcjs.__spreadValues.call(void 0, {}, composite), popover), select), {
     combobox,
     setValue: (value) => select.setState("value", value),
     setSelectElement: (element) => select.setState("selectElement", element),

package/cjs/select/select-store.d.cts

@@ -0,0 +1,93 @@
+import type { ComboboxStore } from "../combobox/combobox-store.js";
+import type { CompositeStoreFunctions, CompositeStoreItem, CompositeStoreOptions, CompositeStoreState } from "../composite/composite-store.js";
+import type { PopoverStoreFunctions, PopoverStoreOptions, PopoverStoreState } from "../popover/popover-store.js";
+import type { Store, StoreOptions, StoreProps } from "../utils/store.js";
+import type { PickRequired, SetState } from "../utils/types.js";
+type Value = string | string[];
+type MutableValue<T extends Value = Value> = T extends string ? string : T;
+type Item = CompositeStoreItem & {
+    value?: string;
+};
+export declare function createSelectStore<T extends Value = Value>(props: PickRequired<SelectStoreProps<T>, "value" | "defaultValue">): SelectStore<T>;
+export declare function createSelectStore(props?: SelectStoreProps): SelectStore;
+export type SelectStoreItem = Item;
+export type SelectStoreValue = Value;
+export interface SelectStoreState<T extends Value = Value> extends CompositeStoreState<Item>, PopoverStoreState {
+    /** @default true */
+    virtualFocus: CompositeStoreState<Item>["virtualFocus"];
+    /** @default false */
+    includesBaseElement: CompositeStoreState<Item>["includesBaseElement"];
+    /** @default null */
+    activeId: CompositeStoreState<Item>["activeId"];
+    /** @default "vertical" */
+    orientation: CompositeStoreState<Item>["orientation"];
+    /** @default "bottom-start" */
+    placement: PopoverStoreState["placement"];
+    /**
+     * The select value.
+     *
+     * Live examples:
+     * - [Multi-selectable
+     *   Combobox](https://ariakit.org/examples/combobox-multiple)
+     */
+    value: MutableValue<T>;
+    /**
+     * Whether the select value should be set when the active item changes by
+     * moving (which usually happens when moving to an item using the keyboard).
+     * @default false
+     */
+    setValueOnMove: boolean;
+    /**
+     * The select button element.
+     */
+    selectElement: HTMLElement | null;
+    /**
+     * The select label element.
+     */
+    labelElement: HTMLElement | null;
+}
+export interface SelectStoreFunctions<T extends Value = Value> extends Pick<SelectStoreOptions<T>, "combobox">, CompositeStoreFunctions<Item>, PopoverStoreFunctions {
+    /**
+     * Sets the `value` state.
+     *
+     * Live examples:
+     * - [Multi-selectable
+     *   Combobox](https://ariakit.org/examples/combobox-multiple)
+     * @example
+     * store.setValue("Apple");
+     * store.setValue(["Apple", "Banana"]);
+     * store.setValue((value) => value === "Apple" ? "Banana" : "Apple"));
+     */
+    setValue: SetState<SelectStoreState<T>["value"]>;
+    /**
+     * Sets the `selectElement` state.
+     */
+    setSelectElement: SetState<SelectStoreState<T>["selectElement"]>;
+    /**
+     * Sets the `labelElement` state.
+     */
+    setLabelElement: SetState<SelectStoreState<T>["labelElement"]>;
+}
+export interface SelectStoreOptions<T extends Value = Value> extends StoreOptions<SelectStoreState<T>, "virtualFocus" | "includesBaseElement" | "activeId" | "orientation" | "placement" | "value" | "setValueOnMove">, CompositeStoreOptions<Item>, PopoverStoreOptions {
+    /**
+     * A reference to a combobox store. This is used when combining the combobox
+     * with a select (e.g., select with a search input). The stores will share the
+     * same state.
+     *
+     * Live examples:
+     * - [Multi-selectable
+     *   Combobox](https://ariakit.org/examples/combobox-multiple)
+     */
+    combobox?: ComboboxStore | null;
+    /**
+     * The default value. If not set, the first non-disabled item will be used.
+     *
+     * Live examples:
+     * - [Multi-selectable
+     *   Combobox](https://ariakit.org/examples/combobox-multiple)
+     */
+    defaultValue?: SelectStoreState<T>["value"];
+}
+export type SelectStoreProps<T extends Value = Value> = SelectStoreOptions<T> & StoreProps<SelectStoreState<T>>;
+export type SelectStore<T extends Value = Value> = SelectStoreFunctions<T> & Store<SelectStoreState<T>>;
+export {};

package/cjs/tab/tab-store.cjs

@@ -1,55 +1,56 @@
-"use strict";Object.defineProperty(exports, "__esModule", {value: true});
+"use strict";Object.defineProperty(exports, "__esModule", {value: true});"use client";
 
-var _TTWS4MDCcjs = require('../__chunks/TTWS4MDC.cjs');
 
+var _M44E4T5Acjs = require('../__chunks/M44E4T5A.cjs');
 
-var _W5IQT6Z2cjs = require('../__chunks/W5IQT6Z2.cjs');
 
+var _25WWT2VOcjs = require('../__chunks/25WWT2VO.cjs');
 
 
 
 
-var _A4GDJCZBcjs = require('../__chunks/A4GDJCZB.cjs');
 
+var _OASSVCYRcjs = require('../__chunks/OASSVCYR.cjs');
 
-var _RCYVACJOcjs = require('../__chunks/RCYVACJO.cjs');
-require('../__chunks/EXM2AW52.cjs');
-require('../__chunks/GDZQUFNP.cjs');
 
+var _LMT335NJcjs = require('../__chunks/LMT335NJ.cjs');
+require('../__chunks/FTB5CXVB.cjs');
+require('../__chunks/ULSPM3Y3.cjs');
 
 
-var _72I2GWXFcjs = require('../__chunks/72I2GWXF.cjs');
+
+var _WYXAWBLEcjs = require('../__chunks/WYXAWBLE.cjs');
 
 // src/tab/tab-store.ts
 function createTabStore(props = {}) {
   var _a;
   const syncState = (_a = props.store) == null ? void 0 : _a.getState();
-  const composite = _TTWS4MDCcjs.createCompositeStore.call(void 0, _72I2GWXFcjs.__spreadProps.call(void 0, _72I2GWXFcjs.__spreadValues.call(void 0, {}, props), {
-    orientation: _RCYVACJOcjs.defaultValue.call(void 0, 
+  const composite = _M44E4T5Acjs.createCompositeStore.call(void 0, _WYXAWBLEcjs.__spreadProps.call(void 0, _WYXAWBLEcjs.__spreadValues.call(void 0, {}, props), {
+    orientation: _LMT335NJcjs.defaultValue.call(void 0, 
       props.orientation,
       syncState == null ? void 0 : syncState.orientation,
       "horizontal"
     ),
-    focusLoop: _RCYVACJOcjs.defaultValue.call(void 0, props.focusLoop, syncState == null ? void 0 : syncState.focusLoop, true)
+    focusLoop: _LMT335NJcjs.defaultValue.call(void 0, props.focusLoop, syncState == null ? void 0 : syncState.focusLoop, true)
   }));
-  const panels = _W5IQT6Z2cjs.createCollectionStore.call(void 0, );
-  const initialState = _72I2GWXFcjs.__spreadProps.call(void 0, _72I2GWXFcjs.__spreadValues.call(void 0, {}, composite.getState()), {
-    selectedId: _RCYVACJOcjs.defaultValue.call(void 0, 
+  const panels = _25WWT2VOcjs.createCollectionStore.call(void 0, );
+  const initialState = _WYXAWBLEcjs.__spreadProps.call(void 0, _WYXAWBLEcjs.__spreadValues.call(void 0, {}, composite.getState()), {
+    selectedId: _LMT335NJcjs.defaultValue.call(void 0, 
       props.selectedId,
       syncState == null ? void 0 : syncState.selectedId,
       props.defaultSelectedId,
       void 0
     ),
-    selectOnMove: _RCYVACJOcjs.defaultValue.call(void 0, 
+    selectOnMove: _LMT335NJcjs.defaultValue.call(void 0, 
       props.selectOnMove,
       syncState == null ? void 0 : syncState.selectOnMove,
       true
     )
   });
-  const tab = _A4GDJCZBcjs.createStore.call(void 0, initialState, composite, props.store);
-  _A4GDJCZBcjs.setup.call(void 0, 
+  const tab = _OASSVCYRcjs.createStore.call(void 0, initialState, composite, props.store);
+  _OASSVCYRcjs.setup.call(void 0, 
     tab,
-    () => _A4GDJCZBcjs.sync.call(void 0, tab, ["moves"], () => {
+    () => _OASSVCYRcjs.sync.call(void 0, tab, ["moves"], () => {
       const { activeId, selectOnMove } = tab.getState();
       if (!selectOnMove)
         return;
@@ -65,17 +66,17 @@ function createTabStore(props = {}) {
       tab.setState("selectedId", tabItem.id);
     })
   );
-  _A4GDJCZBcjs.setup.call(void 0, 
+  _OASSVCYRcjs.setup.call(void 0, 
     tab,
-    () => _A4GDJCZBcjs.batch.call(void 0, 
+    () => _OASSVCYRcjs.batch.call(void 0, 
       tab,
       ["selectedId"],
       (state) => tab.setState("activeId", state.selectedId)
     )
   );
-  _A4GDJCZBcjs.setup.call(void 0, 
+  _OASSVCYRcjs.setup.call(void 0, 
     tab,
-    () => _A4GDJCZBcjs.sync.call(void 0, tab, ["selectedId", "renderedItems"], (state) => {
+    () => _OASSVCYRcjs.sync.call(void 0, tab, ["selectedId", "renderedItems"], (state) => {
       if (state.selectedId !== void 0)
         return;
       const { activeId, renderedItems } = tab.getState();
@@ -90,13 +91,13 @@ function createTabStore(props = {}) {
       }
     })
   );
-  _A4GDJCZBcjs.setup.call(void 0, 
+  _OASSVCYRcjs.setup.call(void 0, 
     tab,
-    () => _A4GDJCZBcjs.sync.call(void 0, tab, ["renderedItems"], (state) => {
+    () => _OASSVCYRcjs.sync.call(void 0, tab, ["renderedItems"], (state) => {
       const tabs = state.renderedItems;
       if (!tabs.length)
         return;
-      return _A4GDJCZBcjs.sync.call(void 0, panels, ["renderedItems"], (state2) => {
+      return _OASSVCYRcjs.sync.call(void 0, panels, ["renderedItems"], (state2) => {
         const items = state2.renderedItems;
         const hasOrphanPanels = items.some((panel) => !panel.tabId);
         if (!hasOrphanPanels)
@@ -107,12 +108,12 @@ function createTabStore(props = {}) {
           const tabItem = tabs[i];
           if (!tabItem)
             return;
-          panels.renderItem(_72I2GWXFcjs.__spreadProps.call(void 0, _72I2GWXFcjs.__spreadValues.call(void 0, {}, panel), { tabId: tabItem.id }));
+          panels.renderItem(_WYXAWBLEcjs.__spreadProps.call(void 0, _WYXAWBLEcjs.__spreadValues.call(void 0, {}, panel), { tabId: tabItem.id }));
         });
       });
     })
   );
-  return _72I2GWXFcjs.__spreadProps.call(void 0, _72I2GWXFcjs.__spreadValues.call(void 0, _72I2GWXFcjs.__spreadValues.call(void 0, {}, composite), tab), {
+  return _WYXAWBLEcjs.__spreadProps.call(void 0, _WYXAWBLEcjs.__spreadValues.call(void 0, _WYXAWBLEcjs.__spreadValues.call(void 0, {}, composite), tab), {
     panels,
     setSelectedId: (id) => tab.setState("selectedId", id),
     select: (id) => {

package/cjs/tab/tab-store.d.cts

@@ -0,0 +1,87 @@
+import type { CollectionStore, CollectionStoreItem } from "../collection/collection-store.js";
+import type { CompositeStoreFunctions, CompositeStoreItem, CompositeStoreOptions, CompositeStoreState } from "../composite/composite-store.js";
+import type { Store, StoreOptions, StoreProps } from "../utils/store.js";
+import type { SetState } from "../utils/types.js";
+type Item = CompositeStoreItem & {
+    dimmed?: boolean;
+};
+type Panel = CollectionStoreItem & {
+    tabId?: string | null;
+};
+export declare function createTabStore(props?: TabStoreProps): TabStore;
+export type TabStoreItem = Item;
+export type TabStorePanel = Panel;
+export interface TabStoreState extends CompositeStoreState<Item> {
+    /**
+     * @default "horizontal"
+     */
+    orientation: CompositeStoreState<Item>["orientation"];
+    /**
+     * @default true
+     */
+    focusLoop: CompositeStoreState<Item>["focusLoop"];
+    /**
+     * The id of the tab whose panel is currently visible. If it's `undefined`, it
+     * will be automatically set to the first enabled tab.
+     *
+     * Live examples:
+     * - [Tab with React Router](https://ariakit.org/examples/tab-react-router)
+     */
+    selectedId: TabStoreState["activeId"];
+    /**
+     * Whether the tab should be selected when it receives focus. If it's set to
+     * `false`, the tab will be selected only when it's clicked.
+     *
+     * Live examples:
+     * - [Tab with React Router](https://ariakit.org/examples/tab-react-router)
+     * @default true
+     */
+    selectOnMove?: boolean;
+}
+export interface TabStoreFunctions extends CompositeStoreFunctions<Item> {
+    /**
+     * Sets the `selectedId` state without moving focus. If you want to move focus,
+     * use the `select` function instead.
+     *
+     * Live examples:
+     * - [Tab with React Router](https://ariakit.org/examples/tab-react-router)
+     * @example
+     * // Selects the tab with id "tab-1"
+     * store.setSelectedId("tab-1");
+     * // Toggles between "tab-1" and "tab-2"
+     * store.setSelectedId((id) => id === "tab-1" ? "tab-2" : "tab-1"));
+     * // Selects the first tab
+     * store.setSelectedId(store.first());
+     * // Selects the next tab
+     * store.setSelectedId(store.next());
+     */
+    setSelectedId: SetState<TabStoreState["selectedId"]>;
+    /**
+     * A collection store containing the tab panels.
+     */
+    panels: CollectionStore<Panel>;
+    /**
+     * Selects the tab for the given id and moves focus to it. If you want to set
+     * the `selectedId` state without moving focus, use the `setSelectedId`
+     * function instead.
+     * @param id The id of the tab to select.
+     * @example
+     * // Selects the tab with id "tab-1"
+     * store.select("tab-1");
+     * // Selects the first tab
+     * store.select(store.first());
+     * // Selects the next tab
+     * store.select(store.next());
+     */
+    select: TabStore["move"];
+}
+export interface TabStoreOptions extends StoreOptions<TabStoreState, "orientation" | "focusLoop" | "selectedId" | "selectOnMove">, CompositeStoreOptions<Item> {
+    /**
+     * The id of the tab whose panel is currently visible. If it's `undefined`, it
+     * will be automatically set to the first enabled tab.
+     */
+    defaultSelectedId?: TabStoreState["selectedId"];
+}
+export type TabStoreProps = TabStoreOptions & StoreProps<TabStoreState>;
+export type TabStore = TabStoreFunctions & Store<TabStoreState>;
+export {};