@ariakit/react-core 0.2.17 → 0.3.0

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

@@ -1,56 +1,28 @@
 import * as Core from "@ariakit/core/select/select-store";
 import type { BivariantCallback, PickRequired } from "@ariakit/core/utils/types";
+import type { ComboboxStore } from "../combobox/combobox-store.js";
 import type { CompositeStoreFunctions, CompositeStoreOptions, CompositeStoreState } from "../composite/composite-store.js";
 import type { PopoverStoreFunctions, PopoverStoreOptions, PopoverStoreState } from "../popover/popover-store.js";
 import type { Store } from "../utils/store.js";
 type Item = Core.SelectStoreItem;
 type Value = Core.SelectStoreValue;
-export declare function useSelectStoreOptions<T extends Value = Value>(props: SelectStoreProps<T>): {
-    setOpen?: ((open: boolean) => void) | undefined;
-    defaultOpen?: boolean | undefined;
-    disclosure?: import("@ariakit/core/disclosure/disclosure-store").DisclosureStore | undefined;
-    open?: boolean | undefined;
-    animated?: number | boolean | undefined;
-    setItems?: BivariantCallback<(items: ({
-        id: string;
-        element?: HTMLElement | null | undefined;
-    } & {
-        rowId?: string | undefined;
-        disabled?: boolean | undefined;
-        children?: string | undefined;
-    } & {
-        value?: string | undefined;
-    })[]) => void> | undefined;
-    defaultItems?: ({
-        id: string;
-        element?: HTMLElement | null | undefined;
-    } & {
-        rowId?: string | undefined;
-        disabled?: boolean | undefined;
-        children?: string | undefined;
-    } & {
-        value?: string | undefined;
-    })[] | undefined;
-    items?: ({
-        id: string;
-        element?: HTMLElement | null | undefined;
-    } & {
-        rowId?: string | undefined;
-        disabled?: boolean | undefined;
-        children?: string | undefined;
-    } & {
-        value?: string | undefined;
-    })[] | undefined;
+export declare function useSelectStoreProps<T extends Core.SelectStore>(store: T, update: () => void, props: SelectStoreProps): T & {
+    combobox: (import("../combobox/combobox-store.js").ComboboxStoreFunctions & import("@ariakit/core/combobox/combobox-store").ComboboxStoreFunctions & import("@ariakit/core/utils/store").Store<import("@ariakit/core/combobox/combobox-store").ComboboxStoreState> & {
+        useState: {
+            (): import("@ariakit/core/combobox/combobox-store").ComboboxStoreState;
+            <K extends keyof import("@ariakit/core/combobox/combobox-store").ComboboxStoreState>(key: K): import("@ariakit/core/combobox/combobox-store").ComboboxStoreState[K];
+            <V>(selector: (state: import("@ariakit/core/combobox/combobox-store").ComboboxStoreState) => V): V;
+        };
+    }) | undefined;
 };
-export declare function useSelectStoreProps<T extends SelectStore>(store: T, props: SelectStoreProps): T;
 /**
  * Creates a select store.
  * @see https://ariakit.org/components/select
  * @example
  * ```jsx
- * const select = useSelectState({ defaultValue: "Apple" });
- * <Select state={select} />
- * <SelectPopover state={select}>
+ * const select = useSelectStore({ defaultValue: "Apple" });
+ * <Select store={select} />
+ * <SelectPopover store={select}>
  *   <SelectItem value="Apple" />
  *   <SelectItem value="Orange" />
  * </SelectPopover>
@@ -62,7 +34,7 @@ export type SelectStoreItem = Item;
 export type SelectStoreValue = Value;
 export interface SelectStoreState<T extends Value = Value> extends Core.SelectStoreState<T>, CompositeStoreState<Item>, PopoverStoreState {
 }
-export interface SelectStoreFunctions<T extends Value = Value> extends Core.SelectStoreFunctions<T>, CompositeStoreFunctions<Item>, PopoverStoreFunctions {
+export interface SelectStoreFunctions<T extends Value = Value> extends Pick<SelectStoreOptions<T>, "combobox">, Omit<Core.SelectStoreFunctions<T>, "combobox">, CompositeStoreFunctions<Item>, PopoverStoreFunctions {
 }
 export interface SelectStoreOptions<T extends Value = Value> extends Core.SelectStoreOptions<T>, CompositeStoreOptions<Item>, PopoverStoreOptions {
     /**
@@ -74,6 +46,16 @@ export interface SelectStoreOptions<T extends Value = Value> extends Core.Select
      * }
      */
     setValue?: BivariantCallback<(value: SelectStoreState<T>["value"]) => void>;
+    /**
+     * 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;
 }
 export type SelectStoreProps<T extends Value = Value> = SelectStoreOptions<T> & Core.SelectStoreProps<T>;
 export type SelectStore<T extends Value = Value> = SelectStoreFunctions<T> & Store<Core.SelectStore<T>>;

package/cjs/select/select.cjs

@@ -1,31 +1,35 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true});
 
-var _UVTMAR7Ncjs = require('../__chunks/UVTMAR7N.cjs');
-require('../__chunks/YMZPP75I.cjs');
-require('../__chunks/PHGHRT2Q.cjs');
-require('../__chunks/NXDHPYNQ.cjs');
-require('../__chunks/6MKUVCEN.cjs');
+var _2VQBXUAIcjs = require('../__chunks/2VQBXUAI.cjs');
+require('../__chunks/LCKU3TYW.cjs');
+require('../__chunks/JNVNPB37.cjs');
+require('../__chunks/XH2CZ7VF.cjs');
+require('../__chunks/ZQTMT453.cjs');
 
 
-var _ZECYRUVHcjs = require('../__chunks/ZECYRUVH.cjs');
-require('../__chunks/BNTTY6EA.cjs');
+var _FTX6TAJCcjs = require('../__chunks/FTX6TAJC.cjs');
+require('../__chunks/VIPX6GSM.cjs');
 
 
-var _Q5EWS32Zcjs = require('../__chunks/Q5EWS32Z.cjs');
+var _DC66R2NYcjs = require('../__chunks/DC66R2NY.cjs');
 
 
-var _RCGSDYWJcjs = require('../__chunks/RCGSDYWJ.cjs');
-require('../__chunks/OSQTQ6OF.cjs');
+
+var _I2EPCLS6cjs = require('../__chunks/I2EPCLS6.cjs');
+require('../__chunks/NPDPNCSD.cjs');
 require('../__chunks/KLZID3QO.cjs');
-require('../__chunks/5VOPA6D3.cjs');
-require('../__chunks/W5PBA4D6.cjs');
-require('../__chunks/I4JDDV3V.cjs');
+require('../__chunks/H7R5D2FR.cjs');
+require('../__chunks/NHZBX2RS.cjs');
+require('../__chunks/AKOG5S2T.cjs');
+require('../__chunks/W6ZRSMO5.cjs');
+require('../__chunks/A2NMYLCG.cjs');
+require('../__chunks/BFLDQF3L.cjs');
 require('../__chunks/LHHW5ZQP.cjs');
 
 
 
 
-var _CWY2PHPRcjs = require('../__chunks/CWY2PHPR.cjs');
+var _Z5PUIG6Acjs = require('../__chunks/Z5PUIG6A.cjs');
 
 
 
@@ -43,6 +47,7 @@ var _72I2GWXFcjs = require('../__chunks/72I2GWXF.cjs');
 var _react = require('react');
 var _dom = require('@ariakit/core/utils/dom');
 var _events = require('@ariakit/core/utils/events');
+var _misc = require('@ariakit/core/utils/misc');
 var _jsxruntime = require('react/jsx-runtime');
 function getSelectedValues(select) {
   return Array.from(select.selectedOptions).map((option) => option.value);
@@ -66,7 +71,7 @@ function nextWithValue(store, next) {
     return nextItem == null ? void 0 : nextItem.id;
   };
 }
-var useSelect = _CWY2PHPRcjs.createHook.call(void 0, 
+var useSelect = _Z5PUIG6Acjs.createHook.call(void 0, 
   (_a) => {
     var _b = _a, {
       store,
@@ -87,6 +92,12 @@ var useSelect = _CWY2PHPRcjs.createHook.call(void 0,
       "toggleOnClick",
       "toggleOnPress"
     ]);
+    const context = _I2EPCLS6cjs.useSelectProviderContext.call(void 0, );
+    store = store || context;
+    _misc.invariant.call(void 0, 
+      store,
+      process.env.NODE_ENV !== "production" && "Select must receive a `store` prop or be wrapped in a SelectProvider component."
+    );
     toggleOnPress = toggleOnClick ? false : toggleOnPress;
     const onKeyDownProp = props.onKeyDown;
     const showOnKeyDownProp = _5WLTMVVQcjs.useBooleanEvent.call(void 0, showOnKeyDown);
@@ -101,6 +112,8 @@ var useSelect = _CWY2PHPRcjs.createHook.call(void 0,
       onKeyDownProp == null ? void 0 : onKeyDownProp(event);
       if (event.defaultPrevented)
         return;
+      if (!store)
+        return;
       const { orientation, items: items2, activeId } = store.getState();
       if (event.key === " " || event.key === "Enter") {
         if (toggleOnPressProp(event)) {
@@ -153,13 +166,13 @@ var useSelect = _CWY2PHPRcjs.createHook.call(void 0,
         return;
       const element = event.currentTarget;
       _events.queueBeforeEvent.call(void 0, element, "focusin", () => {
-        store.setDisclosureElement(element);
-        store.toggle();
+        store == null ? void 0 : store.setDisclosureElement(element);
+        store == null ? void 0 : store.toggle();
       });
     });
     props = _5WLTMVVQcjs.useWrapElement.call(void 0, 
       props,
-      (element) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _RCGSDYWJcjs.SelectContext.Provider, { value: store, children: element }),
+      (element) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _I2EPCLS6cjs.SelectScopedContextProvider, { value: store, children: element }),
       [store]
     );
     const [autofill, setAutofill] = _react.useState.call(void 0, false);
@@ -214,12 +227,12 @@ var useSelect = _CWY2PHPRcjs.createHook.call(void 0,
               multiple: multiSelectable,
               onFocus: () => {
                 var _a2;
-                return (_a2 = store.getState().selectElement) == null ? void 0 : _a2.focus();
+                return (_a2 = store == null ? void 0 : store.getState().selectElement) == null ? void 0 : _a2.focus();
               },
               onChange: (event) => {
                 nativeSelectChangedRef.current = true;
                 setAutofill(true);
-                store.setValue(
+                store == null ? void 0 : store.setValue(
                   multiSelectable ? getSelectedValues(event.target) : event.target.value
                 );
               },
@@ -243,7 +256,7 @@ var useSelect = _CWY2PHPRcjs.createHook.call(void 0,
     );
     const children = /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _jsxruntime.Fragment, { children: [
       value,
-      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _ZECYRUVHcjs.SelectArrow, {})
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _FTX6TAJCcjs.SelectArrow, {})
     ] });
     const contentElement = store.useState("contentElement");
     props = _72I2GWXFcjs.__spreadProps.call(void 0, _72I2GWXFcjs.__spreadValues.call(void 0, {
@@ -259,14 +272,14 @@ var useSelect = _CWY2PHPRcjs.createHook.call(void 0,
       onKeyDown,
       onMouseDown
     });
-    props = _UVTMAR7Ncjs.usePopoverDisclosure.call(void 0, _72I2GWXFcjs.__spreadValues.call(void 0, { store, toggleOnClick }, props));
-    props = _Q5EWS32Zcjs.useCompositeTypeahead.call(void 0, _72I2GWXFcjs.__spreadValues.call(void 0, { store }, props));
+    props = _2VQBXUAIcjs.usePopoverDisclosure.call(void 0, _72I2GWXFcjs.__spreadValues.call(void 0, { store, toggleOnClick }, props));
+    props = _DC66R2NYcjs.useCompositeTypeahead.call(void 0, _72I2GWXFcjs.__spreadValues.call(void 0, { store }, props));
     return props;
   }
 );
-var Select = _CWY2PHPRcjs.createComponent.call(void 0, (props) => {
+var Select = _Z5PUIG6Acjs.createComponent.call(void 0, (props) => {
   const htmlProps = useSelect(props);
-  return _CWY2PHPRcjs.createElement.call(void 0, "button", htmlProps);
+  return _Z5PUIG6Acjs.createElement.call(void 0, "button", htmlProps);
 });
 if (process.env.NODE_ENV !== "production") {
   Select.displayName = "Select";

package/cjs/select/select.d.ts

@@ -33,7 +33,7 @@ export interface SelectOptions<T extends As = "button"> extends PopoverDisclosur
     /**
      * Object returned by the `useSelectStore` hook.
      */
-    store: SelectStore;
+    store?: SelectStore;
     /**
      * Determines whether the select list will be shown when the user presses
      * arrow keys while the select element is focused.

package/cjs/separator/separator.cjs

@@ -1,12 +1,12 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true});
 
 
-var _BQZLBPPTcjs = require('../__chunks/BQZLBPPT.cjs');
-require('../__chunks/CWY2PHPR.cjs');
+var _CYI34MDDcjs = require('../__chunks/CYI34MDD.cjs');
+require('../__chunks/Z5PUIG6A.cjs');
 require('../__chunks/5WLTMVVQ.cjs');
 require('../__chunks/7WUTS26Y.cjs');
 require('../__chunks/72I2GWXF.cjs');
 
 
 
-exports.Separator = _BQZLBPPTcjs.Separator; exports.useSeparator = _BQZLBPPTcjs.useSeparator;
+exports.Separator = _CYI34MDDcjs.Separator; exports.useSeparator = _CYI34MDDcjs.useSeparator;

package/cjs/tab/tab-context.cjs

@@ -1,7 +1,20 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true});
 
-var _HRWXWXMEcjs = require('../__chunks/HRWXWXME.cjs');
+
+
+
+
+var _HBZJ2UC5cjs = require('../__chunks/HBZJ2UC5.cjs');
+require('../__chunks/H7R5D2FR.cjs');
+require('../__chunks/NHZBX2RS.cjs');
+require('../__chunks/Z5PUIG6A.cjs');
+require('../__chunks/5WLTMVVQ.cjs');
+require('../__chunks/7WUTS26Y.cjs');
 require('../__chunks/72I2GWXF.cjs');
 
 
-exports.TabContext = _HRWXWXMEcjs.TabContext;
+
+
+
+
+exports.TabContextProvider = _HBZJ2UC5cjs.TabContextProvider; exports.TabScopedContextProvider = _HBZJ2UC5cjs.TabScopedContextProvider; exports.useTabContext = _HBZJ2UC5cjs.useTabContext; exports.useTabProviderContext = _HBZJ2UC5cjs.useTabProviderContext; exports.useTabScopedContext = _HBZJ2UC5cjs.useTabScopedContext;

package/cjs/tab/tab-context.d.ts

@@ -1,2 +1,19 @@
 import type { TabStore } from "./tab-store.js";
-export declare const TabContext: import("react").Context<TabStore | undefined>;
+/**
+ * Returns the tab store from the nearest tab container.
+ * @example
+ * function Tab() {
+ *   const store = useTabContext();
+ *
+ *   if (!store) {
+ *     throw new Error("Tab must be wrapped in TabProvider");
+ *   }
+ *
+ *   // Use the store...
+ * }
+ */
+export declare const useTabContext: () => TabStore | undefined;
+export declare const useTabScopedContext: (onlyScoped?: boolean) => TabStore | undefined;
+export declare const useTabProviderContext: () => TabStore | undefined;
+export declare const TabContextProvider: (props: import("react").ProviderProps<TabStore | undefined>) => import("react/jsx-runtime").JSX.Element;
+export declare const TabScopedContextProvider: (props: import("react").ProviderProps<TabStore | undefined>) => import("react/jsx-runtime").JSX.Element;

package/cjs/tab/tab-list.cjs

@@ -1,18 +1,20 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true});
 
-var _HRWXWXMEcjs = require('../__chunks/HRWXWXME.cjs');
 
+var _HBZJ2UC5cjs = require('../__chunks/HBZJ2UC5.cjs');
 
-var _A764D2YKcjs = require('../__chunks/A764D2YK.cjs');
+
+var _6G5GJF5Qcjs = require('../__chunks/6G5GJF5Q.cjs');
 require('../__chunks/KLZID3QO.cjs');
-require('../__chunks/5VOPA6D3.cjs');
-require('../__chunks/I4JDDV3V.cjs');
+require('../__chunks/H7R5D2FR.cjs');
+require('../__chunks/NHZBX2RS.cjs');
+require('../__chunks/BFLDQF3L.cjs');
 require('../__chunks/LHHW5ZQP.cjs');
 
 
 
 
-var _CWY2PHPRcjs = require('../__chunks/CWY2PHPR.cjs');
+var _Z5PUIG6Acjs = require('../__chunks/Z5PUIG6A.cjs');
 
 
 var _5WLTMVVQcjs = require('../__chunks/5WLTMVVQ.cjs');
@@ -23,27 +25,34 @@ require('../__chunks/7WUTS26Y.cjs');
 var _72I2GWXFcjs = require('../__chunks/72I2GWXF.cjs');
 
 // src/tab/tab-list.tsx
+var _misc = require('@ariakit/core/utils/misc');
 var _jsxruntime = require('react/jsx-runtime');
-var useTabList = _CWY2PHPRcjs.createHook.call(void 0, (_a) => {
+var useTabList = _Z5PUIG6Acjs.createHook.call(void 0, (_a) => {
   var _b = _a, { store } = _b, props = _72I2GWXFcjs.__objRest.call(void 0, _b, ["store"]);
+  const context = _HBZJ2UC5cjs.useTabProviderContext.call(void 0, );
+  store = store || context;
+  _misc.invariant.call(void 0, 
+    store,
+    process.env.NODE_ENV !== "production" && "TabList must receive a `store` prop or be wrapped in a TabProvider component."
+  );
   const orientation = store.useState(
     (state) => state.orientation === "both" ? void 0 : state.orientation
   );
   props = _5WLTMVVQcjs.useWrapElement.call(void 0, 
     props,
-    (element) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _HRWXWXMEcjs.TabContext.Provider, { value: store, children: element }),
+    (element) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _HBZJ2UC5cjs.TabScopedContextProvider, { value: store, children: element }),
     [store]
   );
   props = _72I2GWXFcjs.__spreadValues.call(void 0, {
     role: "tablist",
     "aria-orientation": orientation
   }, props);
-  props = _A764D2YKcjs.useComposite.call(void 0, _72I2GWXFcjs.__spreadValues.call(void 0, { store }, props));
+  props = _6G5GJF5Qcjs.useComposite.call(void 0, _72I2GWXFcjs.__spreadValues.call(void 0, { store }, props));
   return props;
 });
-var TabList = _CWY2PHPRcjs.createComponent.call(void 0, (props) => {
+var TabList = _Z5PUIG6Acjs.createComponent.call(void 0, (props) => {
   const htmlProps = useTabList(props);
-  return _CWY2PHPRcjs.createElement.call(void 0, "div", htmlProps);
+  return _Z5PUIG6Acjs.createElement.call(void 0, "div", htmlProps);
 });
 if (process.env.NODE_ENV !== "production") {
   TabList.displayName = "TabList";

package/cjs/tab/tab-list.d.ts

@@ -36,6 +36,6 @@ export interface TabListOptions<T extends As = "div"> extends CompositeOptions<T
     /**
      * Object returned by the `useTabStore` hook.
      */
-    store: TabStore;
+    store?: TabStore;
 }
 export type TabListProps<T extends As = "div"> = Props<TabListOptions<T>>;

package/cjs/tab/tab-panel.cjs

@@ -1,23 +1,31 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true});
 
-var _ETK4FMZHcjs = require('../__chunks/ETK4FMZH.cjs');
-require('../__chunks/ZQAFJQIS.cjs');
+var _FMI5QF7Ncjs = require('../__chunks/FMI5QF7N.cjs');
 
 
-var _SZTCN3SGcjs = require('../__chunks/SZTCN3SG.cjs');
 
+var _HBZJ2UC5cjs = require('../__chunks/HBZJ2UC5.cjs');
+require('../__chunks/H7R5D2FR.cjs');
+require('../__chunks/NHZBX2RS.cjs');
 
-var _I4JDDV3Vcjs = require('../__chunks/I4JDDV3V.cjs');
+
+var _5E5FKYEOcjs = require('../__chunks/5E5FKYEO.cjs');
+require('../__chunks/W6ZRSMO5.cjs');
+require('../__chunks/A2NMYLCG.cjs');
+
+
+var _BFLDQF3Lcjs = require('../__chunks/BFLDQF3L.cjs');
 require('../__chunks/LHHW5ZQP.cjs');
 
 
 
 
-var _CWY2PHPRcjs = require('../__chunks/CWY2PHPR.cjs');
+var _Z5PUIG6Acjs = require('../__chunks/Z5PUIG6A.cjs');
 
 
-var _OVOYNBFCcjs = require('../__chunks/OVOYNBFC.cjs');
-require('../__chunks/MPGRRS75.cjs');
+var _DEXAWU62cjs = require('../__chunks/DEXAWU62.cjs');
+require('../__chunks/42FA4OOB.cjs');
+
 
 
 
@@ -29,12 +37,20 @@ require('../__chunks/7WUTS26Y.cjs');
 
 var _72I2GWXFcjs = require('../__chunks/72I2GWXF.cjs');
 
-// src/tab/tab-panel.ts
+// src/tab/tab-panel.tsx
 var _react = require('react');
 var _focus = require('@ariakit/core/utils/focus');
-var useTabPanel = _CWY2PHPRcjs.createHook.call(void 0, 
+var _misc = require('@ariakit/core/utils/misc');
+var _jsxruntime = require('react/jsx-runtime');
+var useTabPanel = _Z5PUIG6Acjs.createHook.call(void 0, 
   (_a) => {
     var _b = _a, { store, tabId: tabIdProp, getItem: getItemProp } = _b, props = _72I2GWXFcjs.__objRest.call(void 0, _b, ["store", "tabId", "getItem"]);
+    const context = _HBZJ2UC5cjs.useTabProviderContext.call(void 0, );
+    store = store || context;
+    _misc.invariant.call(void 0, 
+      store,
+      process.env.NODE_ENV !== "production" && "TabPanel must receive a `store` prop or be wrapped in a TabProvider component."
+    );
     const ref = _react.useRef.call(void 0, null);
     const id = _5WLTMVVQcjs.useId.call(void 0, props.id);
     const [hasTabbableChildren, setHasTabbableChildren] = _react.useState.call(void 0, false);
@@ -55,10 +71,15 @@ var useTabPanel = _CWY2PHPRcjs.createHook.call(void 0,
       },
       [id, tabIdProp, getItemProp]
     );
+    props = _5WLTMVVQcjs.useWrapElement.call(void 0, 
+      props,
+      (element) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _HBZJ2UC5cjs.TabScopedContextProvider, { value: store, children: element }),
+      [store]
+    );
     const tabId = store.panels.useState(
       () => {
         var _a2;
-        return tabIdProp || ((_a2 = store.panels.item(id)) == null ? void 0 : _a2.tabId);
+        return tabIdProp || ((_a2 = store == null ? void 0 : store.panels.item(id)) == null ? void 0 : _a2.tabId);
       }
     );
     const open = store.useState(
@@ -71,16 +92,16 @@ var useTabPanel = _CWY2PHPRcjs.createHook.call(void 0,
     }, props), {
       ref: _5WLTMVVQcjs.useMergeRefs.call(void 0, ref, props.ref)
     });
-    const disclosure = _OVOYNBFCcjs.useDisclosureStore.call(void 0, { open });
-    props = _I4JDDV3Vcjs.useFocusable.call(void 0, _72I2GWXFcjs.__spreadValues.call(void 0, { focusable: !hasTabbableChildren }, props));
-    props = _SZTCN3SGcjs.useDisclosureContent.call(void 0, _72I2GWXFcjs.__spreadValues.call(void 0, { store: disclosure }, props));
-    props = _ETK4FMZHcjs.useCollectionItem.call(void 0, _72I2GWXFcjs.__spreadProps.call(void 0, _72I2GWXFcjs.__spreadValues.call(void 0, { store: store.panels }, props), { getItem }));
+    const disclosure = _DEXAWU62cjs.useDisclosureStore.call(void 0, { open });
+    props = _BFLDQF3Lcjs.useFocusable.call(void 0, _72I2GWXFcjs.__spreadValues.call(void 0, { focusable: !hasTabbableChildren }, props));
+    props = _5E5FKYEOcjs.useDisclosureContent.call(void 0, _72I2GWXFcjs.__spreadValues.call(void 0, { store: disclosure }, props));
+    props = _FMI5QF7Ncjs.useCollectionItem.call(void 0, _72I2GWXFcjs.__spreadProps.call(void 0, _72I2GWXFcjs.__spreadValues.call(void 0, { store: store.panels }, props), { getItem }));
     return props;
   }
 );
-var TabPanel = _CWY2PHPRcjs.createComponent.call(void 0, (props) => {
+var TabPanel = _Z5PUIG6Acjs.createComponent.call(void 0, (props) => {
   const htmlProps = useTabPanel(props);
-  return _CWY2PHPRcjs.createElement.call(void 0, "div", htmlProps);
+  return _Z5PUIG6Acjs.createElement.call(void 0, "div", htmlProps);
 });
 if (process.env.NODE_ENV !== "production") {
   TabPanel.displayName = "TabPanel";

package/cjs/tab/tab-panel.d.ts

@@ -1,5 +1,5 @@
 import type { CollectionItemOptions } from "../collection/collection-item.js";
-import type { DisclosureContentOptions } from "../disclosure/disclosure-content.js";
+import type { DisclosureContentOptions } from "../disclosure/disclosure-content.jsx";
 import type { FocusableOptions } from "../focusable/focusable.js";
 import type { As, Props } from "../utils/types.js";
 import type { TabStore } from "./tab-store.js";
@@ -36,7 +36,7 @@ export interface TabPanelOptions<T extends As = "div"> extends FocusableOptions<
     /**
      * Object returned by the `useTabStore` hook.
      */
-    store: TabStore;
+    store?: TabStore;
     /**
      * The id of the tab that controls this panel. By default, this value will
      * be inferred based on the order of the tabs and the panels.

package/cjs/tab/tab-provider.cjs

@@ -0,0 +1,25 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true});
+
+var _4BQNJE73cjs = require('../__chunks/4BQNJE73.cjs');
+
+
+var _HBZJ2UC5cjs = require('../__chunks/HBZJ2UC5.cjs');
+require('../__chunks/RE3KB52D.cjs');
+require('../__chunks/KAZTJBAF.cjs');
+require('../__chunks/H7R5D2FR.cjs');
+require('../__chunks/NHZBX2RS.cjs');
+require('../__chunks/Z5PUIG6A.cjs');
+require('../__chunks/42FA4OOB.cjs');
+require('../__chunks/5WLTMVVQ.cjs');
+require('../__chunks/7WUTS26Y.cjs');
+require('../__chunks/72I2GWXF.cjs');
+
+// src/tab/tab-provider.tsx
+var _jsxruntime = require('react/jsx-runtime');
+function TabProvider(props = {}) {
+  const store = _4BQNJE73cjs.useTabStore.call(void 0, props);
+  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _HBZJ2UC5cjs.TabContextProvider, { value: store, children: props.children });
+}
+
+
+exports.TabProvider = TabProvider;

package/cjs/tab/tab-provider.d.ts

@@ -0,0 +1,21 @@
+import type { ReactNode } from "react";
+import type { TabStoreProps } from "./tab-store.js";
+/**
+ * Provides a tab store to Tab components.
+ * @see https://ariakit.org/components/tab
+ * @example
+ * ```jsx
+ * <TabProvider>
+ *   <TabList>
+ *     <Tab>For You</Tab>
+ *     <Tab>Following</Tab>
+ *   </TabList>
+ *   <TabPanel>For You</TabPanel>
+ *   <TabPanel>Following</TabPanel>
+ * </TabProvider>
+ * ```
+ */
+export declare function TabProvider(props?: TabProviderProps): import("react/jsx-runtime").JSX.Element;
+export interface TabProviderProps extends TabStoreProps {
+    children?: ReactNode;
+}

package/cjs/tab/tab-store.cjs

@@ -1,39 +1,14 @@
-"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { newObj[key] = obj[key]; } } } newObj.default = obj; return newObj; } }
+"use strict";Object.defineProperty(exports, "__esModule", {value: true});
 
 
-var _CRKIULULcjs = require('../__chunks/CRKIULUL.cjs');
-require('../__chunks/ATSMFQCO.cjs');
-
-
-
-var _MPGRRS75cjs = require('../__chunks/MPGRRS75.cjs');
+var _4BQNJE73cjs = require('../__chunks/4BQNJE73.cjs');
+require('../__chunks/RE3KB52D.cjs');
+require('../__chunks/KAZTJBAF.cjs');
+require('../__chunks/42FA4OOB.cjs');
 require('../__chunks/5WLTMVVQ.cjs');
 require('../__chunks/7WUTS26Y.cjs');
+require('../__chunks/72I2GWXF.cjs');
 
 
 
-var _72I2GWXFcjs = require('../__chunks/72I2GWXF.cjs');
-
-// src/tab/tab-store.ts
-var _react = require('react');
-var _tabstore = require('@ariakit/core/tab/tab-store'); var Core = _interopRequireWildcard(_tabstore);
-function useTabStoreOptions(props) {
-  return _CRKIULULcjs.useCompositeStoreOptions.call(void 0, props);
-}
-function useTabStoreProps(store, props) {
-  store = _CRKIULULcjs.useCompositeStoreProps.call(void 0, store, props);
-  _MPGRRS75cjs.useStoreProps.call(void 0, store, props, "selectedId", "setSelectedId");
-  _MPGRRS75cjs.useStoreProps.call(void 0, store, props, "selectOnMove");
-  const panels = _MPGRRS75cjs.useStore.call(void 0, () => store.panels);
-  return _react.useMemo.call(void 0, () => _72I2GWXFcjs.__spreadProps.call(void 0, _72I2GWXFcjs.__spreadValues.call(void 0, {}, store), { panels }), []);
-}
-function useTabStore(props = {}) {
-  const options = useTabStoreOptions(props);
-  const store = _MPGRRS75cjs.useStore.call(void 0, () => Core.createTabStore(_72I2GWXFcjs.__spreadValues.call(void 0, _72I2GWXFcjs.__spreadValues.call(void 0, {}, props), options)));
-  return useTabStoreProps(store, props);
-}
-
-
-
-
-exports.useTabStore = useTabStore; exports.useTabStoreOptions = useTabStoreOptions; exports.useTabStoreProps = useTabStoreProps;
+exports.useTabStore = _4BQNJE73cjs.useTabStore; exports.useTabStoreProps = _4BQNJE73cjs.useTabStoreProps;