@ariakit/core 0.3.8 → 0.3.9

package/CHANGELOG.md

@@ -1,5 +1,10 @@
 # @ariakit/core
 
+## 0.3.9
+
+- Fixed `Maximum update depth exceeded` warning when rendering multiple collection items on the page.
+- Improved JSDocs.
+
 ## 0.3.8
 
 - Fixed [`CollectionItem`](https://ariakit.org/reference/collection-item) elements getting out of order when composing stores.

package/cjs/__chunks/{QAZ4PF7S.cjs → JNFZSNOI.cjs}

@@ -1,7 +1,7 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true});"use client";
 
 
-var _ZQTYFYRScjs = require('./ZQTYFYRS.cjs');
+var _UCLKUBNPcjs = require('./UCLKUBNP.cjs');
 
 
 
@@ -124,7 +124,7 @@ function verticalizeItems(items) {
 function createCompositeStore(props = {}) {
   var _a;
   const syncState = (_a = props.store) == null ? void 0 : _a.getState();
-  const collection = _ZQTYFYRScjs.createCollectionStore.call(void 0, props);
+  const collection = _UCLKUBNPcjs.createCollectionStore.call(void 0, props);
   const activeId = _3UT5FE6Kcjs.defaultValue.call(void 0, 
     props.activeId,
     syncState == null ? void 0 : syncState.activeId,

package/cjs/__chunks/{ZQTYFYRS.cjs → UCLKUBNP.cjs}

@@ -88,34 +88,35 @@ function createCollectionStore(props = {}) {
     syncPrivateStore
   );
   const collection = _2UK5WUJXcjs.createStore.call(void 0, initialState, props.store);
-  const sortItems = () => {
-    const state = privateStore.getState();
-    const renderedItems = sortBasedOnDOMPosition(state.renderedItems);
-    privateStore.setState("renderedItems", renderedItems);
-    collection.setState("renderedItems", renderedItems);
-  };
   _2UK5WUJXcjs.setup.call(void 0, collection, () => _2UK5WUJXcjs.init.call(void 0, privateStore));
   _2UK5WUJXcjs.setup.call(void 0, privateStore, () => {
     return _2UK5WUJXcjs.batch.call(void 0, privateStore, ["renderedItems"], (state) => {
       let firstRun = true;
-      let raf = requestAnimationFrame(sortItems);
-      if (typeof IntersectionObserver !== "function")
-        return;
-      const callback = () => {
+      const raf = requestAnimationFrame(() => {
+        const { renderedItems } = collection.getState();
+        if (state.renderedItems === renderedItems)
+          return;
+        const sortedItems = sortBasedOnDOMPosition(state.renderedItems);
+        privateStore.setState("renderedItems", sortedItems);
+        collection.setState("renderedItems", sortedItems);
+      });
+      if (typeof IntersectionObserver !== "function") {
+        return () => cancelAnimationFrame(raf);
+      }
+      const ioCallback = () => {
         if (firstRun) {
           firstRun = false;
           return;
         }
-        cancelAnimationFrame(raf);
-        raf = requestAnimationFrame(sortItems);
+        privateStore.setState("renderedItems", [...state.renderedItems]);
       };
       const root = getCommonParent(state.renderedItems);
-      const observer = new IntersectionObserver(callback, { root });
-      state.renderedItems.forEach((item) => {
+      const observer = new IntersectionObserver(ioCallback, { root });
+      for (const item of state.renderedItems) {
         if (!item.element)
-          return;
+          continue;
         observer.observe(item.element);
-      });
+      }
       return () => {
         cancelAnimationFrame(raf);
         observer.disconnect();

package/cjs/__chunks/{3J44Z7YH.cjs → UTICNXST.cjs}

@@ -1,7 +1,7 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true});"use client";
 
 
-var _QAZ4PF7Scjs = require('./QAZ4PF7S.cjs');
+var _JNFZSNOIcjs = require('./JNFZSNOI.cjs');
 
 
 var _2UK5WUJXcjs = require('./2UK5WUJX.cjs');
@@ -17,7 +17,7 @@ var _AV6KTKLEcjs = require('./AV6KTKLE.cjs');
 function createMenubarStore(props = {}) {
   var _a;
   const syncState = (_a = props.store) == null ? void 0 : _a.getState();
-  const composite = _QAZ4PF7Scjs.createCompositeStore.call(void 0, _AV6KTKLEcjs.__spreadProps.call(void 0, _AV6KTKLEcjs.__spreadValues.call(void 0, {}, props), {
+  const composite = _JNFZSNOIcjs.createCompositeStore.call(void 0, _AV6KTKLEcjs.__spreadProps.call(void 0, _AV6KTKLEcjs.__spreadValues.call(void 0, {}, props), {
     orientation: _3UT5FE6Kcjs.defaultValue.call(void 0, 
       props.orientation,
       syncState == null ? void 0 : syncState.orientation,

package/cjs/collection/collection-store.cjs

@@ -1,11 +1,11 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true});"use client";
 
 
-var _ZQTYFYRScjs = require('../__chunks/ZQTYFYRS.cjs');
+var _UCLKUBNPcjs = require('../__chunks/UCLKUBNP.cjs');
 require('../__chunks/2UK5WUJX.cjs');
 require('../__chunks/3UT5FE6K.cjs');
 require('../__chunks/5F4DVUNS.cjs');
 require('../__chunks/AV6KTKLE.cjs');
 
 
-exports.createCollectionStore = _ZQTYFYRScjs.createCollectionStore;
+exports.createCollectionStore = _UCLKUBNPcjs.createCollectionStore;

package/cjs/combobox/combobox-store.cjs

@@ -6,8 +6,8 @@ require('../__chunks/2LS4JJ4S.cjs');
 require('../__chunks/GJFZ5ZPP.cjs');
 
 
-var _QAZ4PF7Scjs = require('../__chunks/QAZ4PF7S.cjs');
-require('../__chunks/ZQTYFYRS.cjs');
+var _JNFZSNOIcjs = require('../__chunks/JNFZSNOI.cjs');
+require('../__chunks/UCLKUBNP.cjs');
 
 
 
@@ -41,7 +41,7 @@ function createComboboxStore(props = {}) {
     props.defaultActiveId,
     null
   );
-  const composite = _QAZ4PF7Scjs.createCompositeStore.call(void 0, _AV6KTKLEcjs.__spreadProps.call(void 0, _AV6KTKLEcjs.__spreadValues.call(void 0, {}, props), {
+  const composite = _JNFZSNOIcjs.createCompositeStore.call(void 0, _AV6KTKLEcjs.__spreadProps.call(void 0, _AV6KTKLEcjs.__spreadValues.call(void 0, {}, props), {
     activeId,
     includesBaseElement: _3UT5FE6Kcjs.defaultValue.call(void 0, 
       props.includesBaseElement,

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

@@ -59,6 +59,8 @@ export interface ComboboxStoreState<T extends ComboboxStoreSelectedValue = Combo
      *   Combobox](https://ariakit.org/examples/combobox-multiple)
      * - [Menu with Combobox](https://ariakit.org/examples/menu-combobox)
      * - [Select with Combobox](https://ariakit.org/examples/select-combobox)
+     * - [Submenu with
+     *   Combobox](https://ariakit.org/examples/menu-nested-combobox)
      */
     resetValueOnHide: boolean;
     /**

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

@@ -59,6 +59,8 @@ export interface ComboboxStoreState<T extends ComboboxStoreSelectedValue = Combo
      *   Combobox](https://ariakit.org/examples/combobox-multiple)
      * - [Menu with Combobox](https://ariakit.org/examples/menu-combobox)
      * - [Select with Combobox](https://ariakit.org/examples/select-combobox)
+     * - [Submenu with
+     *   Combobox](https://ariakit.org/examples/menu-nested-combobox)
      */
     resetValueOnHide: boolean;
     /**

package/cjs/composite/composite-store.cjs

@@ -1,8 +1,8 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true});"use client";
 
 
-var _QAZ4PF7Scjs = require('../__chunks/QAZ4PF7S.cjs');
-require('../__chunks/ZQTYFYRS.cjs');
+var _JNFZSNOIcjs = require('../__chunks/JNFZSNOI.cjs');
+require('../__chunks/UCLKUBNP.cjs');
 require('../__chunks/2UK5WUJX.cjs');
 require('../__chunks/3UT5FE6K.cjs');
 require('../__chunks/5F4DVUNS.cjs');
@@ -10,4 +10,4 @@ require('../__chunks/ULSPM3Y3.cjs');
 require('../__chunks/AV6KTKLE.cjs');
 
 
-exports.createCompositeStore = _QAZ4PF7Scjs.createCompositeStore;
+exports.createCompositeStore = _JNFZSNOIcjs.createCompositeStore;

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

@@ -111,8 +111,15 @@ export interface CompositeStoreState<T extends CompositeStoreItem = CompositeSto
      */
     moves: number;
     /**
-     * Indicates whether the composite element should be included in the focus
-     * order.
+     * Indicates if the composite element (such as `menu`, `combobox`, `listbox`,
+     * `toolbar`, etc.) should be part of the focus order. In other words, moving
+     * to the previous element when the first item is in focus will focus on the
+     * composite element itself. The same applies to the last item when moving to
+     * the next element.
+     *
+     * Live examples:
+     * - [Submenu with
+     *   Combobox](https://ariakit.org/examples/menu-nested-combobox)
      * @default false
      */
     includesBaseElement: boolean;

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

@@ -111,8 +111,15 @@ export interface CompositeStoreState<T extends CompositeStoreItem = CompositeSto
      */
     moves: number;
     /**
-     * Indicates whether the composite element should be included in the focus
-     * order.
+     * Indicates if the composite element (such as `menu`, `combobox`, `listbox`,
+     * `toolbar`, etc.) should be part of the focus order. In other words, moving
+     * to the previous element when the first item is in focus will focus on the
+     * composite element itself. The same applies to the last item when moving to
+     * the next element.
+     *
+     * Live examples:
+     * - [Submenu with
+     *   Combobox](https://ariakit.org/examples/menu-nested-combobox)
      * @default false
      */
     includesBaseElement: boolean;

package/cjs/form/form-store.cjs

@@ -1,7 +1,7 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true});"use client";
 
 
-var _ZQTYFYRScjs = require('../__chunks/ZQTYFYRS.cjs');
+var _UCLKUBNPcjs = require('../__chunks/UCLKUBNP.cjs');
 
 
 
@@ -116,7 +116,7 @@ function createFormStore(props = {}) {
   var _a;
   _2UK5WUJXcjs.throwOnConflictingProps.call(void 0, props, props.store);
   const syncState = (_a = props.store) == null ? void 0 : _a.getState();
-  const collection = _ZQTYFYRScjs.createCollectionStore.call(void 0, props);
+  const collection = _UCLKUBNPcjs.createCollectionStore.call(void 0, props);
   const values = _3UT5FE6Kcjs.defaultValue.call(void 0, 
     props.values,
     syncState == null ? void 0 : syncState.values,

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

@@ -19,15 +19,19 @@ export interface HovercardStoreState extends PopoverStoreState {
     timeout: number;
     /**
      * The amount of time in milliseconds to wait before **showing** the popover.
-     * It defaults to the value passed to `timeout`.
+     * It defaults to the value passed to
+     * [`timeout`](https://ariakit.org/reference/hovercard-provider#timeout).
      *
      * Live examples:
      * - [Navigation Menubar](https://ariakit.org/examples/menubar-navigation)
+     * - [Submenu with
+     *   Combobox](https://ariakit.org/examples/menu-nested-combobox)
      */
     showTimeout?: number;
     /**
      * The amount of time in milliseconds to wait before **hiding** the popover.
-     * It defaults to the value passed to `timeout`.
+     * It defaults to the value passed to
+     * [`timeout`](https://ariakit.org/reference/hovercard-provider#timeout).
      *
      * Live examples:
      * - [Navigation Menubar](https://ariakit.org/examples/menubar-navigation)

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

@@ -19,15 +19,19 @@ export interface HovercardStoreState extends PopoverStoreState {
     timeout: number;
     /**
      * The amount of time in milliseconds to wait before **showing** the popover.
-     * It defaults to the value passed to `timeout`.
+     * It defaults to the value passed to
+     * [`timeout`](https://ariakit.org/reference/hovercard-provider#timeout).
      *
      * Live examples:
      * - [Navigation Menubar](https://ariakit.org/examples/menubar-navigation)
+     * - [Submenu with
+     *   Combobox](https://ariakit.org/examples/menu-nested-combobox)
      */
     showTimeout?: number;
     /**
      * The amount of time in milliseconds to wait before **hiding** the popover.
-     * It defaults to the value passed to `timeout`.
+     * It defaults to the value passed to
+     * [`timeout`](https://ariakit.org/reference/hovercard-provider#timeout).
      *
      * Live examples:
      * - [Navigation Menubar](https://ariakit.org/examples/menubar-navigation)

package/cjs/menu/menu-bar-store.cjs

@@ -1,9 +1,9 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true});"use client";
 
 
-var _3J44Z7YHcjs = require('../__chunks/3J44Z7YH.cjs');
-require('../__chunks/QAZ4PF7S.cjs');
-require('../__chunks/ZQTYFYRS.cjs');
+var _UTICNXSTcjs = require('../__chunks/UTICNXST.cjs');
+require('../__chunks/JNFZSNOI.cjs');
+require('../__chunks/UCLKUBNP.cjs');
 require('../__chunks/2UK5WUJX.cjs');
 require('../__chunks/3UT5FE6K.cjs');
 require('../__chunks/5F4DVUNS.cjs');
@@ -12,7 +12,7 @@ require('../__chunks/AV6KTKLE.cjs');
 
 // src/menu/menu-bar-store.ts
 function createMenuBarStore(props = {}) {
-  return _3J44Z7YHcjs.createMenubarStore.call(void 0, props);
+  return _UTICNXSTcjs.createMenubarStore.call(void 0, props);
 }
 
 

package/cjs/menu/menu-store.cjs

@@ -7,8 +7,8 @@ require('../__chunks/2LS4JJ4S.cjs');
 require('../__chunks/GJFZ5ZPP.cjs');
 
 
-var _QAZ4PF7Scjs = require('../__chunks/QAZ4PF7S.cjs');
-require('../__chunks/ZQTYFYRS.cjs');
+var _JNFZSNOIcjs = require('../__chunks/JNFZSNOI.cjs');
+require('../__chunks/UCLKUBNP.cjs');
 
 
 
@@ -55,7 +55,7 @@ function createMenuStore(_a = {}) {
   );
   _2UK5WUJXcjs.throwOnConflictingProps.call(void 0, props, store);
   const syncState = store.getState();
-  const composite = _QAZ4PF7Scjs.createCompositeStore.call(void 0, _AV6KTKLEcjs.__spreadProps.call(void 0, _AV6KTKLEcjs.__spreadValues.call(void 0, {}, props), {
+  const composite = _JNFZSNOIcjs.createCompositeStore.call(void 0, _AV6KTKLEcjs.__spreadProps.call(void 0, _AV6KTKLEcjs.__spreadValues.call(void 0, {}, props), {
     store,
     orientation: _3UT5FE6Kcjs.defaultValue.call(void 0, 
       props.orientation,

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

@@ -15,6 +15,10 @@ export interface MenuStoreState<T extends MenuStoreValues = MenuStoreValues> ext
     /**
      * A map of names and values that will be used by the `MenuItemCheckbox` and
      * `MenuItemRadio` components.
+     *
+     * Live examples:
+     * - [Submenu with
+     *   Combobox](https://ariakit.org/examples/menu-nested-combobox)
      */
     values: T;
     /** @default "vertical" */
@@ -27,6 +31,10 @@ export interface MenuStoreState<T extends MenuStoreValues = MenuStoreValues> ext
 export interface MenuStoreFunctions<T extends MenuStoreValues = MenuStoreValues> extends CompositeStoreFunctions, HovercardStoreFunctions, Pick<MenuStoreOptions, "combobox" | "parent" | "menubar"> {
     /**
      * Hides the menu and all its parent menus.
+     *
+     * Live examples:
+     * - [Submenu with
+     *   Combobox](https://ariakit.org/examples/menu-nested-combobox)
      */
     hideAll: () => void;
     /**
@@ -42,8 +50,10 @@ export interface MenuStoreFunctions<T extends MenuStoreValues = MenuStoreValues>
     setValues: SetState<MenuStoreState<T>["values"]>;
     /**
      * Sets a specific menu value.
-     * @param name The name.
-     * @param value The value.
+     *
+     * Live examples:
+     * - [Submenu with
+     *   Combobox](https://ariakit.org/examples/menu-nested-combobox)
      * @example
      * store.setValue("watching", ["issues"]);
      * store.setValue("watching", (value) => [...value, "issues"]);

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

@@ -15,6 +15,10 @@ export interface MenuStoreState<T extends MenuStoreValues = MenuStoreValues> ext
     /**
      * A map of names and values that will be used by the `MenuItemCheckbox` and
      * `MenuItemRadio` components.
+     *
+     * Live examples:
+     * - [Submenu with
+     *   Combobox](https://ariakit.org/examples/menu-nested-combobox)
      */
     values: T;
     /** @default "vertical" */
@@ -27,6 +31,10 @@ export interface MenuStoreState<T extends MenuStoreValues = MenuStoreValues> ext
 export interface MenuStoreFunctions<T extends MenuStoreValues = MenuStoreValues> extends CompositeStoreFunctions, HovercardStoreFunctions, Pick<MenuStoreOptions, "combobox" | "parent" | "menubar"> {
     /**
      * Hides the menu and all its parent menus.
+     *
+     * Live examples:
+     * - [Submenu with
+     *   Combobox](https://ariakit.org/examples/menu-nested-combobox)
      */
     hideAll: () => void;
     /**
@@ -42,8 +50,10 @@ export interface MenuStoreFunctions<T extends MenuStoreValues = MenuStoreValues>
     setValues: SetState<MenuStoreState<T>["values"]>;
     /**
      * Sets a specific menu value.
-     * @param name The name.
-     * @param value The value.
+     *
+     * Live examples:
+     * - [Submenu with
+     *   Combobox](https://ariakit.org/examples/menu-nested-combobox)
      * @example
      * store.setValue("watching", ["issues"]);
      * store.setValue("watching", (value) => [...value, "issues"]);

package/cjs/menubar/menubar-store.cjs

@@ -1,9 +1,9 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true});"use client";
 
 
-var _3J44Z7YHcjs = require('../__chunks/3J44Z7YH.cjs');
-require('../__chunks/QAZ4PF7S.cjs');
-require('../__chunks/ZQTYFYRS.cjs');
+var _UTICNXSTcjs = require('../__chunks/UTICNXST.cjs');
+require('../__chunks/JNFZSNOI.cjs');
+require('../__chunks/UCLKUBNP.cjs');
 require('../__chunks/2UK5WUJX.cjs');
 require('../__chunks/3UT5FE6K.cjs');
 require('../__chunks/5F4DVUNS.cjs');
@@ -11,4 +11,4 @@ require('../__chunks/ULSPM3Y3.cjs');
 require('../__chunks/AV6KTKLE.cjs');
 
 
-exports.createMenubarStore = _3J44Z7YHcjs.createMenubarStore;
+exports.createMenubarStore = _UTICNXSTcjs.createMenubarStore;

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

@@ -31,6 +31,8 @@ export interface PopoverStoreState extends DialogStoreState {
      *
      * Live examples:
      * - [Navigation Menubar](https://ariakit.org/examples/menubar-navigation)
+     * - [Submenu with
+     *   Combobox](https://ariakit.org/examples/menu-nested-combobox)
      * @default "bottom"
      */
     placement: Placement;

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

@@ -31,6 +31,8 @@ export interface PopoverStoreState extends DialogStoreState {
      *
      * Live examples:
      * - [Navigation Menubar](https://ariakit.org/examples/menubar-navigation)
+     * - [Submenu with
+     *   Combobox](https://ariakit.org/examples/menu-nested-combobox)
      * @default "bottom"
      */
     placement: Placement;

package/cjs/radio/radio-store.cjs

@@ -1,8 +1,8 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true});"use client";
 
 
-var _QAZ4PF7Scjs = require('../__chunks/QAZ4PF7S.cjs');
-require('../__chunks/ZQTYFYRS.cjs');
+var _JNFZSNOIcjs = require('../__chunks/JNFZSNOI.cjs');
+require('../__chunks/UCLKUBNP.cjs');
 
 
 var _2UK5WUJXcjs = require('../__chunks/2UK5WUJX.cjs');
@@ -22,7 +22,7 @@ function createRadioStore(_a = {}) {
   var props = _AV6KTKLEcjs.__objRest.call(void 0, _a, []);
   var _a2;
   const syncState = (_a2 = props.store) == null ? void 0 : _a2.getState();
-  const composite = _QAZ4PF7Scjs.createCompositeStore.call(void 0, _AV6KTKLEcjs.__spreadProps.call(void 0, _AV6KTKLEcjs.__spreadValues.call(void 0, {}, props), {
+  const composite = _JNFZSNOIcjs.createCompositeStore.call(void 0, _AV6KTKLEcjs.__spreadProps.call(void 0, _AV6KTKLEcjs.__spreadValues.call(void 0, {}, props), {
     focusLoop: _3UT5FE6Kcjs.defaultValue.call(void 0, props.focusLoop, syncState == null ? void 0 : syncState.focusLoop, true)
   }));
   const initialState = _AV6KTKLEcjs.__spreadProps.call(void 0, _AV6KTKLEcjs.__spreadValues.call(void 0, {}, composite.getState()), {

package/cjs/select/select-store.cjs

@@ -6,8 +6,8 @@ require('../__chunks/2LS4JJ4S.cjs');
 require('../__chunks/GJFZ5ZPP.cjs');
 
 
-var _QAZ4PF7Scjs = require('../__chunks/QAZ4PF7S.cjs');
-require('../__chunks/ZQTYFYRS.cjs');
+var _JNFZSNOIcjs = require('../__chunks/JNFZSNOI.cjs');
+require('../__chunks/UCLKUBNP.cjs');
 
 
 
@@ -53,7 +53,7 @@ function createSelectStore(_a = {}) {
   );
   _2UK5WUJXcjs.throwOnConflictingProps.call(void 0, props, store);
   const syncState = store.getState();
-  const composite = _QAZ4PF7Scjs.createCompositeStore.call(void 0, _AV6KTKLEcjs.__spreadProps.call(void 0, _AV6KTKLEcjs.__spreadValues.call(void 0, {}, props), {
+  const composite = _JNFZSNOIcjs.createCompositeStore.call(void 0, _AV6KTKLEcjs.__spreadProps.call(void 0, _AV6KTKLEcjs.__spreadValues.call(void 0, {}, props), {
     store,
     virtualFocus: _3UT5FE6Kcjs.defaultValue.call(void 0, 
       props.virtualFocus,

package/cjs/tab/tab-store.cjs

@@ -1,10 +1,10 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true});"use client";
 
 
-var _QAZ4PF7Scjs = require('../__chunks/QAZ4PF7S.cjs');
+var _JNFZSNOIcjs = require('../__chunks/JNFZSNOI.cjs');
 
 
-var _ZQTYFYRScjs = require('../__chunks/ZQTYFYRS.cjs');
+var _UCLKUBNPcjs = require('../__chunks/UCLKUBNP.cjs');
 
 
 
@@ -25,7 +25,7 @@ var _AV6KTKLEcjs = require('../__chunks/AV6KTKLE.cjs');
 function createTabStore(props = {}) {
   var _a;
   const syncState = (_a = props.store) == null ? void 0 : _a.getState();
-  const composite = _QAZ4PF7Scjs.createCompositeStore.call(void 0, _AV6KTKLEcjs.__spreadProps.call(void 0, _AV6KTKLEcjs.__spreadValues.call(void 0, {}, props), {
+  const composite = _JNFZSNOIcjs.createCompositeStore.call(void 0, _AV6KTKLEcjs.__spreadProps.call(void 0, _AV6KTKLEcjs.__spreadValues.call(void 0, {}, props), {
     orientation: _3UT5FE6Kcjs.defaultValue.call(void 0, 
       props.orientation,
       syncState == null ? void 0 : syncState.orientation,
@@ -33,7 +33,7 @@ function createTabStore(props = {}) {
     ),
     focusLoop: _3UT5FE6Kcjs.defaultValue.call(void 0, props.focusLoop, syncState == null ? void 0 : syncState.focusLoop, true)
   }));
-  const panels = _ZQTYFYRScjs.createCollectionStore.call(void 0, );
+  const panels = _UCLKUBNPcjs.createCollectionStore.call(void 0, );
   const initialState = _AV6KTKLEcjs.__spreadProps.call(void 0, _AV6KTKLEcjs.__spreadValues.call(void 0, {}, composite.getState()), {
     selectedId: _3UT5FE6Kcjs.defaultValue.call(void 0, 
       props.selectedId,

package/cjs/toolbar/toolbar-store.cjs

@@ -1,8 +1,8 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true});"use client";
 
 
-var _QAZ4PF7Scjs = require('../__chunks/QAZ4PF7S.cjs');
-require('../__chunks/ZQTYFYRS.cjs');
+var _JNFZSNOIcjs = require('../__chunks/JNFZSNOI.cjs');
+require('../__chunks/UCLKUBNP.cjs');
 require('../__chunks/2UK5WUJX.cjs');
 
 
@@ -18,7 +18,7 @@ var _AV6KTKLEcjs = require('../__chunks/AV6KTKLE.cjs');
 function createToolbarStore(props = {}) {
   var _a;
   const syncState = (_a = props.store) == null ? void 0 : _a.getState();
-  return _QAZ4PF7Scjs.createCompositeStore.call(void 0, _AV6KTKLEcjs.__spreadProps.call(void 0, _AV6KTKLEcjs.__spreadValues.call(void 0, {}, props), {
+  return _JNFZSNOIcjs.createCompositeStore.call(void 0, _AV6KTKLEcjs.__spreadProps.call(void 0, _AV6KTKLEcjs.__spreadValues.call(void 0, {}, props), {
     orientation: _3UT5FE6Kcjs.defaultValue.call(void 0, 
       props.orientation,
       syncState == null ? void 0 : syncState.orientation,

package/esm/__chunks/{CTZ2GQIZ.js → DLX2AS6C.js}

@@ -1,7 +1,7 @@
 "use client";
 import {
   createCollectionStore
-} from "./HMQYEBKF.js";
+} from "./TLN4ALYH.js";
 import {
   createStore,
   setup,

package/esm/__chunks/{A2AGSVJO.js → EZ2TTBAQ.js}

@@ -1,7 +1,7 @@
 "use client";
 import {
   createCompositeStore
-} from "./CTZ2GQIZ.js";
+} from "./DLX2AS6C.js";
 import {
   createStore
 } from "./A2J4XZ5T.js";

package/esm/__chunks/{HMQYEBKF.js → TLN4ALYH.js}

@@ -88,34 +88,35 @@ function createCollectionStore(props = {}) {
     syncPrivateStore
   );
   const collection = createStore(initialState, props.store);
-  const sortItems = () => {
-    const state = privateStore.getState();
-    const renderedItems = sortBasedOnDOMPosition(state.renderedItems);
-    privateStore.setState("renderedItems", renderedItems);
-    collection.setState("renderedItems", renderedItems);
-  };
   setup(collection, () => init(privateStore));
   setup(privateStore, () => {
     return batch(privateStore, ["renderedItems"], (state) => {
       let firstRun = true;
-      let raf = requestAnimationFrame(sortItems);
-      if (typeof IntersectionObserver !== "function")
-        return;
-      const callback = () => {
+      const raf = requestAnimationFrame(() => {
+        const { renderedItems } = collection.getState();
+        if (state.renderedItems === renderedItems)
+          return;
+        const sortedItems = sortBasedOnDOMPosition(state.renderedItems);
+        privateStore.setState("renderedItems", sortedItems);
+        collection.setState("renderedItems", sortedItems);
+      });
+      if (typeof IntersectionObserver !== "function") {
+        return () => cancelAnimationFrame(raf);
+      }
+      const ioCallback = () => {
         if (firstRun) {
           firstRun = false;
           return;
         }
-        cancelAnimationFrame(raf);
-        raf = requestAnimationFrame(sortItems);
+        privateStore.setState("renderedItems", [...state.renderedItems]);
       };
       const root = getCommonParent(state.renderedItems);
-      const observer = new IntersectionObserver(callback, { root });
-      state.renderedItems.forEach((item) => {
+      const observer = new IntersectionObserver(ioCallback, { root });
+      for (const item of state.renderedItems) {
         if (!item.element)
-          return;
+          continue;
         observer.observe(item.element);
-      });
+      }
       return () => {
         cancelAnimationFrame(raf);
         observer.disconnect();

package/esm/collection/collection-store.js

@@ -1,7 +1,7 @@
 "use client";
 import {
   createCollectionStore
-} from "../__chunks/HMQYEBKF.js";
+} from "../__chunks/TLN4ALYH.js";
 import "../__chunks/A2J4XZ5T.js";
 import "../__chunks/I2VQ3XGR.js";
 import "../__chunks/DLOEKDPY.js";

package/esm/combobox/combobox-store.d.ts

@@ -59,6 +59,8 @@ export interface ComboboxStoreState<T extends ComboboxStoreSelectedValue = Combo
      *   Combobox](https://ariakit.org/examples/combobox-multiple)
      * - [Menu with Combobox](https://ariakit.org/examples/menu-combobox)
      * - [Select with Combobox](https://ariakit.org/examples/select-combobox)
+     * - [Submenu with
+     *   Combobox](https://ariakit.org/examples/menu-nested-combobox)
      */
     resetValueOnHide: boolean;
     /**

package/esm/combobox/combobox-store.js

@@ -6,8 +6,8 @@ import "../__chunks/LT2OYWRD.js";
 import "../__chunks/NKLTHWCR.js";
 import {
   createCompositeStore
-} from "../__chunks/CTZ2GQIZ.js";
-import "../__chunks/HMQYEBKF.js";
+} from "../__chunks/DLX2AS6C.js";
+import "../__chunks/TLN4ALYH.js";
 import {
   batch,
   createStore,

package/esm/composite/composite-store.d.ts

@@ -111,8 +111,15 @@ export interface CompositeStoreState<T extends CompositeStoreItem = CompositeSto
      */
     moves: number;
     /**
-     * Indicates whether the composite element should be included in the focus
-     * order.
+     * Indicates if the composite element (such as `menu`, `combobox`, `listbox`,
+     * `toolbar`, etc.) should be part of the focus order. In other words, moving
+     * to the previous element when the first item is in focus will focus on the
+     * composite element itself. The same applies to the last item when moving to
+     * the next element.
+     *
+     * Live examples:
+     * - [Submenu with
+     *   Combobox](https://ariakit.org/examples/menu-nested-combobox)
      * @default false
      */
     includesBaseElement: boolean;

package/esm/composite/composite-store.js

@@ -1,8 +1,8 @@
 "use client";
 import {
   createCompositeStore
-} from "../__chunks/CTZ2GQIZ.js";
-import "../__chunks/HMQYEBKF.js";
+} from "../__chunks/DLX2AS6C.js";
+import "../__chunks/TLN4ALYH.js";
 import "../__chunks/A2J4XZ5T.js";
 import "../__chunks/I2VQ3XGR.js";
 import "../__chunks/DLOEKDPY.js";

package/esm/form/form-store.js

@@ -1,7 +1,7 @@
 "use client";
 import {
   createCollectionStore
-} from "../__chunks/HMQYEBKF.js";
+} from "../__chunks/TLN4ALYH.js";
 import {
   createStore,
   init,

package/esm/hovercard/hovercard-store.d.ts

@@ -19,15 +19,19 @@ export interface HovercardStoreState extends PopoverStoreState {
     timeout: number;
     /**
      * The amount of time in milliseconds to wait before **showing** the popover.
-     * It defaults to the value passed to `timeout`.
+     * It defaults to the value passed to
+     * [`timeout`](https://ariakit.org/reference/hovercard-provider#timeout).
      *
      * Live examples:
      * - [Navigation Menubar](https://ariakit.org/examples/menubar-navigation)
+     * - [Submenu with
+     *   Combobox](https://ariakit.org/examples/menu-nested-combobox)
      */
     showTimeout?: number;
     /**
      * The amount of time in milliseconds to wait before **hiding** the popover.
-     * It defaults to the value passed to `timeout`.
+     * It defaults to the value passed to
+     * [`timeout`](https://ariakit.org/reference/hovercard-provider#timeout).
      *
      * Live examples:
      * - [Navigation Menubar](https://ariakit.org/examples/menubar-navigation)

package/esm/menu/menu-bar-store.js

@@ -1,9 +1,9 @@
 "use client";
 import {
   createMenubarStore
-} from "../__chunks/A2AGSVJO.js";
-import "../__chunks/CTZ2GQIZ.js";
-import "../__chunks/HMQYEBKF.js";
+} from "../__chunks/EZ2TTBAQ.js";
+import "../__chunks/DLX2AS6C.js";
+import "../__chunks/TLN4ALYH.js";
 import "../__chunks/A2J4XZ5T.js";
 import "../__chunks/I2VQ3XGR.js";
 import "../__chunks/DLOEKDPY.js";

package/esm/menu/menu-store.d.ts

@@ -15,6 +15,10 @@ export interface MenuStoreState<T extends MenuStoreValues = MenuStoreValues> ext
     /**
      * A map of names and values that will be used by the `MenuItemCheckbox` and
      * `MenuItemRadio` components.
+     *
+     * Live examples:
+     * - [Submenu with
+     *   Combobox](https://ariakit.org/examples/menu-nested-combobox)
      */
     values: T;
     /** @default "vertical" */
@@ -27,6 +31,10 @@ export interface MenuStoreState<T extends MenuStoreValues = MenuStoreValues> ext
 export interface MenuStoreFunctions<T extends MenuStoreValues = MenuStoreValues> extends CompositeStoreFunctions, HovercardStoreFunctions, Pick<MenuStoreOptions, "combobox" | "parent" | "menubar"> {
     /**
      * Hides the menu and all its parent menus.
+     *
+     * Live examples:
+     * - [Submenu with
+     *   Combobox](https://ariakit.org/examples/menu-nested-combobox)
      */
     hideAll: () => void;
     /**
@@ -42,8 +50,10 @@ export interface MenuStoreFunctions<T extends MenuStoreValues = MenuStoreValues>
     setValues: SetState<MenuStoreState<T>["values"]>;
     /**
      * Sets a specific menu value.
-     * @param name The name.
-     * @param value The value.
+     *
+     * Live examples:
+     * - [Submenu with
+     *   Combobox](https://ariakit.org/examples/menu-nested-combobox)
      * @example
      * store.setValue("watching", ["issues"]);
      * store.setValue("watching", (value) => [...value, "issues"]);

package/esm/menu/menu-store.js

@@ -7,8 +7,8 @@ import "../__chunks/LT2OYWRD.js";
 import "../__chunks/NKLTHWCR.js";
 import {
   createCompositeStore
-} from "../__chunks/CTZ2GQIZ.js";
-import "../__chunks/HMQYEBKF.js";
+} from "../__chunks/DLX2AS6C.js";
+import "../__chunks/TLN4ALYH.js";
 import {
   createStore,
   mergeStore,

package/esm/menubar/menubar-store.js

@@ -1,9 +1,9 @@
 "use client";
 import {
   createMenubarStore
-} from "../__chunks/A2AGSVJO.js";
-import "../__chunks/CTZ2GQIZ.js";
-import "../__chunks/HMQYEBKF.js";
+} from "../__chunks/EZ2TTBAQ.js";
+import "../__chunks/DLX2AS6C.js";
+import "../__chunks/TLN4ALYH.js";
 import "../__chunks/A2J4XZ5T.js";
 import "../__chunks/I2VQ3XGR.js";
 import "../__chunks/DLOEKDPY.js";

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

@@ -31,6 +31,8 @@ export interface PopoverStoreState extends DialogStoreState {
      *
      * Live examples:
      * - [Navigation Menubar](https://ariakit.org/examples/menubar-navigation)
+     * - [Submenu with
+     *   Combobox](https://ariakit.org/examples/menu-nested-combobox)
      * @default "bottom"
      */
     placement: Placement;

package/esm/radio/radio-store.js

@@ -1,8 +1,8 @@
 "use client";
 import {
   createCompositeStore
-} from "../__chunks/CTZ2GQIZ.js";
-import "../__chunks/HMQYEBKF.js";
+} from "../__chunks/DLX2AS6C.js";
+import "../__chunks/TLN4ALYH.js";
 import {
   createStore
 } from "../__chunks/A2J4XZ5T.js";

package/esm/select/select-store.js

@@ -6,8 +6,8 @@ import "../__chunks/LT2OYWRD.js";
 import "../__chunks/NKLTHWCR.js";
 import {
   createCompositeStore
-} from "../__chunks/CTZ2GQIZ.js";
-import "../__chunks/HMQYEBKF.js";
+} from "../__chunks/DLX2AS6C.js";
+import "../__chunks/TLN4ALYH.js";
 import {
   batch,
   createStore,

package/esm/tab/tab-store.js

@@ -1,10 +1,10 @@
 "use client";
 import {
   createCompositeStore
-} from "../__chunks/CTZ2GQIZ.js";
+} from "../__chunks/DLX2AS6C.js";
 import {
   createCollectionStore
-} from "../__chunks/HMQYEBKF.js";
+} from "../__chunks/TLN4ALYH.js";
 import {
   batch,
   createStore,

package/esm/toolbar/toolbar-store.js

@@ -1,8 +1,8 @@
 "use client";
 import {
   createCompositeStore
-} from "../__chunks/CTZ2GQIZ.js";
-import "../__chunks/HMQYEBKF.js";
+} from "../__chunks/DLX2AS6C.js";
+import "../__chunks/TLN4ALYH.js";
 import "../__chunks/A2J4XZ5T.js";
 import {
   defaultValue

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ariakit/core",
-  "version": "0.3.8",
+  "version": "0.3.9",
   "description": "Ariakit core",
   "sideEffects": false,
   "license": "MIT",