@ariakit/react-core 0.3.9 → 0.3.11

package/CHANGELOG.md

@@ -1,5 +1,72 @@
 # @ariakit/react-core
 
+## 0.3.11
+
+### Modal Combobox
+
+The [Combobox](https://ariakit.org/component/combobox) components now support the [`modal`](https://ariakit.org/reference/combobox-popover#modal) prop on [`ComboboxPopover`](https://ariakit.org/reference/combobox-popover).
+
+When a modal combobox is expanded, users can interact with and tab through all the combobox controls, including [`Combobox`](https://ariakit.org/reference/combobox), [`ComboboxDisclosure`](https://ariakit.org/reference/combobox-disclosure), and [`ComboboxCancel`](https://ariakit.org/reference/combobox-cancel), even if they're rendered outside the popover. The rest of the page will be inert.
+
+### Controlling the auto-select functionality of Combobox
+
+The [`Combobox`](https://ariakit.org/reference/combobox) component now includes a new [`getAutoSelectId`](https://ariakit.org/reference/combobox#getautoselectid) prop. This allows you to specify the [`ComboboxItem`](https://ariakit.org/reference/combobox-item) that should be auto-selected if the [`autoSelect`](https://ariakit.org/reference/combobox#autoselect) prop is `true`.
+
+By default, the first _enabled_ item is auto-selected. Now you can customize this behavior by returning the id of another item from [`getAutoSelectId`](https://ariakit.org/reference/combobox#getautoselectid):
+
+```jsx
+<Combobox
+  autoSelect
+  getAutoSelectId={(items) => {
+    // Auto select the first enabled item with a value
+    const item = items.find((item) => {
+      if (item.disabled) return false;
+      if (!item.value) return false;
+      return true;
+    });
+    return item?.id;
+  }}
+/>
+```
+
+### Styling Combobox without an active descendant
+
+The [`Combobox`](https://ariakit.org/reference/combobox) component now includes a [`data-active-item`](https://ariakit.org/guide/styling#data-active-item) attribute when it's the only active item in the composite widget. In other words, when no [`ComboboxItem`](https://ariakit.org/reference/combobox-item) is active and the focus is solely on the combobox input.
+
+You can use this as a CSS selector to style the combobox differently, providing additional affordance to users who pressed <kbd>↑</kbd> on the first item or <kbd>↓</kbd> on the last item. This action would place both virtual and actual DOM focus on the combobox input.
+
+```css
+.combobox[data-active-item] {
+  outline-width: 2px;
+}
+```
+
+### Other updates
+
+- Fixed [`useTabStore`](https://ariakit.org/reference/use-tab-store) return value not updating its own reference.
+- Fixed keyboard navigation on [Combobox](https://ariakit.org/components/combobox) when the content element is a grid.
+- Fixed [`ComboboxDisclosure`](https://ariakit.org/reference/combobox-disclosure) to update its `aria-expanded` attribute when the combobox expands.
+- Fixed `Maximum update depth exceeded` warning when rendering multiple collection items on the page.
+- Improved JSDocs.
+- Updated dependencies: `@ariakit/core@0.3.9`
+
+## 0.3.10
+
+### Overwriting `aria-selected` value on `ComboboxItem`
+
+It's now possible to pass a custom `aria-selected` value to the [`ComboboxItem`](https://ariakit.org/reference/combobox-item) component, overwriting the internal behavior.
+
+### Limiting `slide` on popovers
+
+When components like [Popover](https://ariakit.org/components/popover) and [Menu](https://ariakit.org/components/menu) with the [`slide`](https://ariakit.org/reference/popover#slide) prop are positioned to the right or left of the anchor element, they will now cease to slide across the screen, disengaged from the anchor element, upon reaching the edge of said element.
+
+### Other updates
+
+- Fixed [`blurOnHoverEnd`](https://ariakit.org/reference/menu-item#bluronhoverend) set to `false` not keeping submenus open.
+- Fixed scroll jump on Safari when selecting a [`CompositeItem`](https://ariakit.org/reference/composite-item).
+- Fixed [`preserveTabOrderAnchor`](https://ariakit.org/reference/menu#preservetaborderanchor) on nested menus.
+- Fixed focus behavior when using the [`preserveTabOrder`](https://ariakit.org/reference/portal#preservetaborder) prop.
+
 ## 0.3.9
 
 ### Automatic role on ComboboxGroup

package/cjs/__chunks/{WK7AZPHS.cjs → 2GETDAIQ.cjs}

@@ -6,10 +6,10 @@
 var _KXQOQQ5Bcjs = require('./KXQOQQ5B.cjs');
 
 
-var _WABPFCL3cjs = require('./WABPFCL3.cjs');
+var _NVHGMKAEcjs = require('./NVHGMKAE.cjs');
 
 
-var _OT6DC3MLcjs = require('./OT6DC3ML.cjs');
+var _36QK2QLEcjs = require('./36QK2QLE.cjs');
 
 
 
@@ -283,7 +283,7 @@ var useHovercard = _RNZNGEL4cjs.createHook.call(void 0,
     const autoFocusOnShow = store.useState(
       (state) => modal || state.autoFocusOnShow
     );
-    props = _WABPFCL3cjs.usePopover.call(void 0, _AV6KTKLEcjs.__spreadProps.call(void 0, _AV6KTKLEcjs.__spreadValues.call(void 0, {
+    props = _NVHGMKAEcjs.usePopover.call(void 0, _AV6KTKLEcjs.__spreadProps.call(void 0, _AV6KTKLEcjs.__spreadValues.call(void 0, {
       store,
       modal,
       portal,
@@ -304,7 +304,7 @@ var useHovercard = _RNZNGEL4cjs.createHook.call(void 0,
     return props;
   }
 );
-var Hovercard = _OT6DC3MLcjs.createDialogComponent.call(void 0, 
+var Hovercard = _36QK2QLEcjs.createDialogComponent.call(void 0, 
   _RNZNGEL4cjs.createComponent.call(void 0, (props) => {
     const htmlProps = useHovercard(props);
     return _RNZNGEL4cjs.createElement.call(void 0, "div", htmlProps);

package/cjs/__chunks/{OT6DC3ML.cjs → 36QK2QLE.cjs}

@@ -33,7 +33,7 @@ var _7566TIRWcjs = require('./7566TIRW.cjs');
 var _J3OG6T3Bcjs = require('./J3OG6T3B.cjs');
 
 
-var _S6WUBPBBcjs = require('./S6WUBPBB.cjs');
+var _65LGW5LYcjs = require('./65LGW5LY.cjs');
 
 
 
@@ -504,7 +504,7 @@ var useDialog = _RNZNGEL4cjs.createHook.call(void 0,
     }));
     props = _TD5MOASJcjs.useDisclosureContent.call(void 0, _AV6KTKLEcjs.__spreadValues.call(void 0, { store }, props));
     props = _Z3GCTNW4cjs.useFocusable.call(void 0, _AV6KTKLEcjs.__spreadProps.call(void 0, _AV6KTKLEcjs.__spreadValues.call(void 0, {}, props), { focusable }));
-    props = _S6WUBPBBcjs.usePortal.call(void 0, _AV6KTKLEcjs.__spreadProps.call(void 0, _AV6KTKLEcjs.__spreadValues.call(void 0, { portal }, props), { portalRef, preserveTabOrder }));
+    props = _65LGW5LYcjs.usePortal.call(void 0, _AV6KTKLEcjs.__spreadProps.call(void 0, _AV6KTKLEcjs.__spreadValues.call(void 0, { portal }, props), { portalRef, preserveTabOrder }));
     return props;
   }
 );

package/cjs/__chunks/{PFQ3IPWT.cjs → 3RUODFRU.cjs}

@@ -220,7 +220,7 @@ var useCompositeItem = _RNZNGEL4cjs.createHook.call(void 0,
         return;
       if (isEditableElement(event.currentTarget))
         return;
-      if (!baseElement2)
+      if (!(baseElement2 == null ? void 0 : baseElement2.isConnected))
         return;
       hasFocusedComposite.current = true;
       const fromComposite = event.relatedTarget === baseElement2 || _RV3PHHWMcjs.isItem.call(void 0, store, event.relatedTarget);
@@ -259,18 +259,33 @@ var useCompositeItem = _RNZNGEL4cjs.createHook.call(void 0,
       const isGrid = !!(item == null ? void 0 : item.rowId);
       const isVertical = state.orientation !== "horizontal";
       const isHorizontal = state.orientation !== "vertical";
+      const canHomeEnd = () => {
+        if (isGrid)
+          return true;
+        if (isHorizontal)
+          return true;
+        if (!state.baseElement)
+          return true;
+        if (!_dom.isTextField.call(void 0, state.baseElement))
+          return true;
+        return false;
+      };
       const keyMap = {
         ArrowUp: (isGrid || isVertical) && store.up,
         ArrowRight: (isGrid || isHorizontal) && store.next,
         ArrowDown: (isGrid || isVertical) && store.down,
         ArrowLeft: (isGrid || isHorizontal) && store.previous,
         Home: () => {
+          if (!canHomeEnd())
+            return;
           if (!isGrid || event.ctrlKey) {
             return store == null ? void 0 : store.first();
           }
           return store == null ? void 0 : store.previous(-1);
         },
         End: () => {
+          if (!canHomeEnd())
+            return;
           if (!isGrid || event.ctrlKey) {
             return store == null ? void 0 : store.last();
           }

package/cjs/__chunks/{UBME4GBY.cjs → 63WKH5OP.cjs}

@@ -8,7 +8,7 @@ var _NGEKJJDHcjs = require('./NGEKJJDH.cjs');
 var _FQZOOWMHcjs = require('./FQZOOWMH.cjs');
 
 
-var _CZOBQEIOcjs = require('./CZOBQEIO.cjs');
+var _RM2WCNSUcjs = require('./RM2WCNSU.cjs');
 
 
 var _TD5MOASJcjs = require('./TD5MOASJ.cjs');
@@ -159,7 +159,7 @@ var useMenuList = _RNZNGEL4cjs.createHook.call(void 0,
         "aria-orientation": orientation
       }, props);
     }
-    props = _CZOBQEIOcjs.useComposite.call(void 0, _AV6KTKLEcjs.__spreadValues.call(void 0, { store, composite }, props));
+    props = _RM2WCNSUcjs.useComposite.call(void 0, _AV6KTKLEcjs.__spreadValues.call(void 0, { store, composite }, props));
     props = _FQZOOWMHcjs.useCompositeTypeahead.call(void 0, _AV6KTKLEcjs.__spreadValues.call(void 0, { store, typeahead: !hasCombobox }, props));
     return props;
   }

package/cjs/__chunks/{S6WUBPBB.cjs → 65LGW5LY.cjs}

@@ -133,9 +133,10 @@ var usePortal = _RNZNGEL4cjs.createHook.call(void 0,
         if (!_events.isFocusEventOutside.call(void 0, event))
           return;
         const focusing = event.type === "focusin";
-        if (focusing)
-          return _focus.restoreFocusIn.call(void 0, portalNode);
         cancelAnimationFrame(raf);
+        if (focusing) {
+          return _focus.restoreFocusIn.call(void 0, portalNode);
+        }
         raf = requestAnimationFrame(() => {
           _focus.disableFocusIn.call(void 0, portalNode, true);
         });
@@ -143,6 +144,7 @@ var usePortal = _RNZNGEL4cjs.createHook.call(void 0,
       portalNode.addEventListener("focusin", onFocus, true);
       portalNode.addEventListener("focusout", onFocus, true);
       return () => {
+        cancelAnimationFrame(raf);
         portalNode.removeEventListener("focusin", onFocus, true);
         portalNode.removeEventListener("focusout", onFocus, true);
       };

package/cjs/__chunks/{KIGOGBFU.cjs → 7EEAHTIW.cjs}

@@ -1,7 +1,7 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true});"use client";
 
 
-var _PFQ3IPWTcjs = require('./PFQ3IPWT.cjs');
+var _3RUODFRUcjs = require('./3RUODFRU.cjs');
 
 
 var _LYIGAIJFcjs = require('./LYIGAIJF.cjs');
@@ -21,7 +21,7 @@ var useToolbarItem = _RNZNGEL4cjs.createHook.call(void 0,
     var _b = _a, { store } = _b, props = _AV6KTKLEcjs.__objRest.call(void 0, _b, ["store"]);
     const context = _LYIGAIJFcjs.useToolbarContext.call(void 0, );
     store = store || context;
-    props = _PFQ3IPWTcjs.useCompositeItem.call(void 0, _AV6KTKLEcjs.__spreadValues.call(void 0, { store }, props));
+    props = _3RUODFRUcjs.useCompositeItem.call(void 0, _AV6KTKLEcjs.__spreadValues.call(void 0, { store }, props));
     return props;
   }
 );

package/cjs/__chunks/{3KZQJDTV.cjs → APFV5PTX.cjs}

@@ -8,7 +8,7 @@ var _7LBZXSLYcjs = require('./7LBZXSLY.cjs');
 var _7KFYPSJOcjs = require('./7KFYPSJO.cjs');
 
 
-var _CZOBQEIOcjs = require('./CZOBQEIO.cjs');
+var _RM2WCNSUcjs = require('./RM2WCNSU.cjs');
 
 
 
@@ -64,7 +64,7 @@ var useMenubar = _RNZNGEL4cjs.createHook.call(void 0,
         "aria-orientation": orientation
       }, props);
     }
-    props = _CZOBQEIOcjs.useComposite.call(void 0, _AV6KTKLEcjs.__spreadValues.call(void 0, { store, composite }, props));
+    props = _RM2WCNSUcjs.useComposite.call(void 0, _AV6KTKLEcjs.__spreadValues.call(void 0, { store, composite }, props));
     return props;
   }
 );

package/cjs/__chunks/{VIETWH5C.cjs → BKU5STIE.cjs}

@@ -10,7 +10,7 @@ var _7LBZXSLYcjs = require('./7LBZXSLY.cjs');
 var _IPYAEPOTcjs = require('./IPYAEPOT.cjs');
 
 
-var _PFQ3IPWTcjs = require('./PFQ3IPWT.cjs');
+var _3RUODFRUcjs = require('./3RUODFRU.cjs');
 
 
 
@@ -110,7 +110,7 @@ var useMenuItem = _RNZNGEL4cjs.createHook.call(void 0,
     }, props), {
       onClick
     });
-    props = _PFQ3IPWTcjs.useCompositeItem.call(void 0, _AV6KTKLEcjs.__spreadValues.call(void 0, { store, preventScrollOnKeyDown }, props));
+    props = _3RUODFRUcjs.useCompositeItem.call(void 0, _AV6KTKLEcjs.__spreadValues.call(void 0, { store, preventScrollOnKeyDown }, props));
     props = _IPYAEPOTcjs.useCompositeHover.call(void 0, _AV6KTKLEcjs.__spreadProps.call(void 0, _AV6KTKLEcjs.__spreadValues.call(void 0, {
       store
     }, props), {

package/cjs/__chunks/{HHZJ6KYW.cjs → IAYTETYN.cjs}

@@ -4,7 +4,7 @@
 var _HEEQY4DZcjs = require('./HEEQY4DZ.cjs');
 
 
-var _PFQ3IPWTcjs = require('./PFQ3IPWT.cjs');
+var _3RUODFRUcjs = require('./3RUODFRU.cjs');
 
 
 
@@ -133,7 +133,7 @@ var useRadio = _RNZNGEL4cjs.createHook.call(void 0,
       onClick,
       onFocus
     });
-    props = _PFQ3IPWTcjs.useCompositeItem.call(void 0, _AV6KTKLEcjs.__spreadValues.call(void 0, { store, clickOnEnter: !nativeRadio }, props));
+    props = _3RUODFRUcjs.useCompositeItem.call(void 0, _AV6KTKLEcjs.__spreadValues.call(void 0, { store, clickOnEnter: !nativeRadio }, props));
     return _AV6KTKLEcjs.__spreadValues.call(void 0, {
       name: nativeRadio ? name : void 0,
       value: nativeRadio ? value : void 0,

package/cjs/__chunks/{WABPFCL3.cjs → NVHGMKAE.cjs}

@@ -2,7 +2,7 @@
 
 
 
-var _OT6DC3MLcjs = require('./OT6DC3ML.cjs');
+var _36QK2QLEcjs = require('./36QK2QLE.cjs');
 
 
 
@@ -35,6 +35,7 @@ var _misc = require('@ariakit/core/utils/misc');
 
 
 
+
 var _dom = require('@floating-ui/dom');
 var _jsxruntime = require('react/jsx-runtime');
 function createDOMRect(x = 0, y = 0, width = 0, height = 0) {
@@ -112,7 +113,8 @@ function getShiftMiddleware(props) {
   return _dom.shift.call(void 0, {
     mainAxis: props.slide,
     crossAxis: props.overlap,
-    padding: props.overflowPadding
+    padding: props.overflowPadding,
+    limiter: _dom.limitShift.call(void 0, )
   });
 }
 function getSizeMiddleware(props) {
@@ -227,7 +229,7 @@ var usePopover = _RNZNGEL4cjs.createHook.call(void 0,
         const middleware = [
           getOffsetMiddleware(arrowElement, { gutter, shift: shift2 }),
           getFlipMiddleware({ flip: flip2, overflowPadding }),
-          getShiftMiddleware({ slide, overlap, overflowPadding }),
+          getShiftMiddleware({ slide, shift: shift2, overlap, overflowPadding }),
           getArrowMiddleware(arrowElement, { arrowPadding }),
           getSizeMiddleware({
             sameWidth,
@@ -354,7 +356,7 @@ var usePopover = _RNZNGEL4cjs.createHook.call(void 0,
         position: "relative"
       }, props.style)
     });
-    props = _OT6DC3MLcjs.useDialog.call(void 0, _AV6KTKLEcjs.__spreadProps.call(void 0, _AV6KTKLEcjs.__spreadValues.call(void 0, {
+    props = _36QK2QLEcjs.useDialog.call(void 0, _AV6KTKLEcjs.__spreadProps.call(void 0, _AV6KTKLEcjs.__spreadValues.call(void 0, {
       store,
       modal,
       portal,
@@ -367,7 +369,7 @@ var usePopover = _RNZNGEL4cjs.createHook.call(void 0,
     return props;
   }
 );
-var Popover = _OT6DC3MLcjs.createDialogComponent.call(void 0, 
+var Popover = _36QK2QLEcjs.createDialogComponent.call(void 0, 
   _RNZNGEL4cjs.createComponent.call(void 0, (props) => {
     const htmlProps = usePopover(props);
     return _RNZNGEL4cjs.createElement.call(void 0, "div", htmlProps);

package/cjs/__chunks/{CZOBQEIO.cjs → RM2WCNSU.cjs}

@@ -48,43 +48,32 @@ function isGrid(items) {
   return items.some((item) => !!item.rowId);
 }
 function isPrintableKey(event) {
+  const target = event.target;
+  if (target && !_dom.isTextField.call(void 0, target))
+    return false;
   return event.key.length === 1 && !event.ctrlKey && !event.metaKey;
 }
 function isModifierKey(event) {
   return event.key === "Shift" || event.key === "Control" || event.key === "Alt" || event.key === "Meta";
 }
-function canProxyKeyboardEvent(event, state) {
-  if (!_events.isSelfTarget.call(void 0, event))
-    return false;
-  if (isModifierKey(event))
-    return false;
-  const target = event.target;
-  if (!target)
-    return true;
-  if (_dom.isTextField.call(void 0, target)) {
-    if (isPrintableKey(event))
-      return false;
-    const grid = isGrid(state.renderedItems);
-    const focusingInputOnly = state.activeId === null;
-    const allowHorizontalNavigationOnItems = grid && !focusingInputOnly;
-    const isHomeOrEnd = event.key === "Home" || event.key === "End";
-    if (!allowHorizontalNavigationOnItems && isHomeOrEnd)
-      return false;
-  }
-  return !event.isPropagationStopped();
-}
 function useKeyboardEventProxy(store, onKeyboardEvent, previousElementRef) {
   return _EO6LS72Hcjs.useEvent.call(void 0, (event) => {
     var _a;
     onKeyboardEvent == null ? void 0 : onKeyboardEvent(event);
     if (event.defaultPrevented)
       return;
+    if (event.isPropagationStopped())
+      return;
+    if (!_events.isSelfTarget.call(void 0, event))
+      return;
+    if (isModifierKey(event))
+      return;
+    if (isPrintableKey(event))
+      return;
     const state = store.getState();
     const activeElement = (_a = _RV3PHHWMcjs.getEnabledItem.call(void 0, store, state.activeId)) == null ? void 0 : _a.element;
     if (!activeElement)
       return;
-    if (!canProxyKeyboardEvent(event, state))
-      return;
     const _b = event, { view } = _b, eventInit = _AV6KTKLEcjs.__objRest.call(void 0, _b, ["view"]);
     const previousElement = previousElementRef == null ? void 0 : previousElementRef.current;
     if (activeElement !== previousElement) {
@@ -269,6 +258,8 @@ var useComposite = _RNZNGEL4cjs.createHook.call(void 0,
           }
         } else if (activeElement) {
           _events.fireBlurEvent.call(void 0, activeElement, event);
+        } else if (previousElement) {
+          _events.fireBlurEvent.call(void 0, previousElement, event);
         }
         event.stopPropagation();
       } else {
@@ -296,6 +287,9 @@ var useComposite = _RNZNGEL4cjs.createHook.call(void 0,
       const isVertical = orientation !== "horizontal";
       const isHorizontal = orientation !== "vertical";
       const grid = isGrid(renderedItems);
+      const isHorizontalKey = event.key === "ArrowLeft" || event.key === "ArrowRight" || event.key === "Home" || event.key === "End";
+      if (isHorizontalKey && _dom.isTextField.call(void 0, event.currentTarget))
+        return;
       const up = () => {
         if (grid) {
           const item = items && findFirstEnabledItemInTheLastRow(items);

package/cjs/__chunks/{GF6NWLKX.cjs → WWU35JDJ.cjs}

@@ -8,6 +8,9 @@ var _N6CR2VNNcjs = require('./N6CR2VNN.cjs');
 var _B233QVZEcjs = require('./B233QVZE.cjs');
 
 
+var _EO6LS72Hcjs = require('./EO6LS72H.cjs');
+
+
 
 var _AV6KTKLEcjs = require('./AV6KTKLE.cjs');
 
@@ -18,8 +21,9 @@ function useTabStoreProps(store, update, props) {
   store = _N6CR2VNNcjs.useCompositeStoreProps.call(void 0, store, update, props);
   _B233QVZEcjs.useStoreProps.call(void 0, store, props, "selectedId", "setSelectedId");
   _B233QVZEcjs.useStoreProps.call(void 0, store, props, "selectOnMove");
-  const [panels] = _B233QVZEcjs.useStore.call(void 0, () => store.panels, {});
-  return _react.useMemo.call(void 0, () => _AV6KTKLEcjs.__spreadProps.call(void 0, _AV6KTKLEcjs.__spreadValues.call(void 0, {}, store), { panels }), []);
+  const [panels, updatePanels] = _B233QVZEcjs.useStore.call(void 0, () => store.panels, {});
+  _EO6LS72Hcjs.useUpdateEffect.call(void 0, updatePanels, [store, updatePanels]);
+  return _react.useMemo.call(void 0, () => _AV6KTKLEcjs.__spreadProps.call(void 0, _AV6KTKLEcjs.__spreadValues.call(void 0, {}, store), { panels }), [store, panels]);
 }
 function useTabStore(props = {}) {
   const [store, update] = _B233QVZEcjs.useStore.call(void 0, Core.createTabStore, props);

package/cjs/__chunks/{UUTXBBHD.cjs → XAYQLYTN.cjs}

@@ -8,7 +8,7 @@ var _FQZOOWMHcjs = require('./FQZOOWMH.cjs');
 var _2WCJJQSKcjs = require('./2WCJJQSK.cjs');
 
 
-var _CZOBQEIOcjs = require('./CZOBQEIO.cjs');
+var _RM2WCNSUcjs = require('./RM2WCNSU.cjs');
 
 
 var _TD5MOASJcjs = require('./TD5MOASJ.cjs');
@@ -117,7 +117,7 @@ var useSelectList = _RNZNGEL4cjs.createHook.call(void 0,
       style,
       onKeyDown
     });
-    props = _CZOBQEIOcjs.useComposite.call(void 0, _AV6KTKLEcjs.__spreadProps.call(void 0, _AV6KTKLEcjs.__spreadValues.call(void 0, { store }, props), { composite }));
+    props = _RM2WCNSUcjs.useComposite.call(void 0, _AV6KTKLEcjs.__spreadProps.call(void 0, _AV6KTKLEcjs.__spreadValues.call(void 0, { store }, props), { composite }));
     props = _FQZOOWMHcjs.useCompositeTypeahead.call(void 0, _AV6KTKLEcjs.__spreadValues.call(void 0, { store, typeahead: !hasCombobox }, props));
     return props;
   }

package/cjs/checkbox/checkbox-check.d.cts

@@ -28,9 +28,12 @@ export interface CheckboxCheckOptions<T extends As = "span"> extends Options<T>
      */
     store?: CheckboxStore;
     /**
-     * Whether the check mark should be shown. This value is automatically
-     * inferred from the `store` prop or the parent `Checkbox` component. Manually
-     * setting this prop will override the inferred value.
+     * Determines if the check mark should be displayed. This value is
+     * automatically derived from the
+     * [`store`](https://ariakit.org/reference/checkbox-check#store) prop or the
+     * parent [`Checkbox`](https://ariakit.org/reference/checkbox) component.
+     *
+     * Manually setting this prop will supersede the derived value.
      */
     checked?: boolean;
 }

package/cjs/checkbox/checkbox-check.d.ts

@@ -28,9 +28,12 @@ export interface CheckboxCheckOptions<T extends As = "span"> extends Options<T>
      */
     store?: CheckboxStore;
     /**
-     * Whether the check mark should be shown. This value is automatically
-     * inferred from the `store` prop or the parent `Checkbox` component. Manually
-     * setting this prop will override the inferred value.
+     * Determines if the check mark should be displayed. This value is
+     * automatically derived from the
+     * [`store`](https://ariakit.org/reference/checkbox-check#store) prop or the
+     * parent [`Checkbox`](https://ariakit.org/reference/checkbox) component.
+     *
+     * Manually setting this prop will supersede the derived value.
      */
     checked?: boolean;
 }

package/cjs/collection/collection-renderer.d.cts

@@ -62,7 +62,6 @@ export declare function useCollectionRenderer<T extends Item = any>({ store, ite
     id?: string | undefined;
     lang?: string | undefined;
     nonce?: string | undefined;
-    placeholder?: string | undefined;
     slot?: string | undefined;
     spellCheck?: (boolean | "false" | "true") | undefined;
     style?: CSSProperties | undefined;

package/cjs/collection/collection-renderer.d.ts

@@ -62,7 +62,6 @@ export declare function useCollectionRenderer<T extends Item = any>({ store, ite
     id?: string | undefined;
     lang?: string | undefined;
     nonce?: string | undefined;
-    placeholder?: string | undefined;
     slot?: string | undefined;
     spellCheck?: (boolean | "false" | "true") | undefined;
     style?: CSSProperties | undefined;

package/cjs/combobox/combobox-disclosure.cjs

@@ -75,13 +75,12 @@ var useComboboxDisclosure = _RNZNGEL4cjs.createHook.call(void 0,
       const { baseElement } = store.getState();
       store.setDisclosureElement(baseElement);
     });
-    const label = store.useState(
-      (state) => state.open ? "Hide popup" : "Show popup"
-    );
+    const open = store.useState("open");
     props = _AV6KTKLEcjs.__spreadProps.call(void 0, _AV6KTKLEcjs.__spreadValues.call(void 0, {
       children,
       tabIndex: -1,
-      "aria-label": label
+      "aria-label": open ? "Hide popup" : "Show popup",
+      "aria-expanded": open
     }, props), {
       onMouseDown,
       onClick

package/cjs/combobox/combobox-item.cjs

@@ -9,7 +9,7 @@ var _IPYAEPOTcjs = require('../__chunks/IPYAEPOT.cjs');
 var _3WCBE6SUcjs = require('../__chunks/3WCBE6SU.cjs');
 
 
-var _PFQ3IPWTcjs = require('../__chunks/PFQ3IPWT.cjs');
+var _3RUODFRUcjs = require('../__chunks/3RUODFRU.cjs');
 require('../__chunks/DAJUUBUI.cjs');
 require('../__chunks/R5A2WTWB.cjs');
 require('../__chunks/RV3PHHWM.cjs');
@@ -151,7 +151,9 @@ var useComboboxItem = _RNZNGEL4cjs.createHook.call(void 0,
       (state) => isSelected(state.selectedValue, value)
     );
     if (multiSelectable && selected != null) {
-      props["aria-selected"] = selected;
+      props = _AV6KTKLEcjs.__spreadValues.call(void 0, {
+        "aria-selected": selected
+      }, props);
     }
     props = _EO6LS72Hcjs.useWrapElement.call(void 0, 
       props,
@@ -167,7 +169,7 @@ var useComboboxItem = _RNZNGEL4cjs.createHook.call(void 0,
       onKeyDown
     });
     const moveOnKeyPressProp = _EO6LS72Hcjs.useBooleanEvent.call(void 0, moveOnKeyPress);
-    props = _PFQ3IPWTcjs.useCompositeItem.call(void 0, _AV6KTKLEcjs.__spreadProps.call(void 0, _AV6KTKLEcjs.__spreadValues.call(void 0, {
+    props = _3RUODFRUcjs.useCompositeItem.call(void 0, _AV6KTKLEcjs.__spreadProps.call(void 0, _AV6KTKLEcjs.__spreadValues.call(void 0, {
       store
     }, props), {
       getItem,

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

@@ -56,6 +56,11 @@ export interface ComboboxItemOptions<T extends As = "div"> extends CompositeItem
      *   [`setValueOnClick`](https://ariakit.org/reference/combobox-item#setvalueonclick)
      *   is set to `true`, this will be the value of the combobox input when the
      *   user clicks on this item.
+     * - If
+     *   [`selectValueOnClick`](https://ariakit.org/reference/combobox-item#selectvalueonclick)
+     *   is set to `true`, this will be the value of the
+     *   [`selectedValue`](https://ariakit.org/reference/combobox-provider#selectedvalue)
+     *   state.
      * - If the
      *   [`autoComplete`](https://ariakit.org/reference/combobox#autocomplete)
      *   prop on the [`Combobox`](https://ariakit.org/reference/combobox)
@@ -88,7 +93,12 @@ export interface ComboboxItemOptions<T extends As = "div"> extends CompositeItem
      * [`selectedValue`](https://ariakit.org/reference/combobox-provider#selectedvalue)
      * state using this item's
      * [`value`](https://ariakit.org/reference/combobox-item#value) when the item
-     * is clicked.
+     * is clicked. If a callback is provided, it will only be invoked if the item
+     * has a value.
+     *
+     * Live examples:
+     * - [Submenu with
+     *   Combobox](https://ariakit.org/examples/menu-nested-combobox)
      * @default true
      */
     selectValueOnClick?: BooleanOrCallback<MouseEvent<HTMLElement>>;
@@ -102,6 +112,8 @@ export interface ComboboxItemOptions<T extends As = "div"> extends CompositeItem
      *
      * Live examples:
      * - [Menu with Combobox](https://ariakit.org/examples/menu-combobox)
+     * - [Submenu with
+     *   Combobox](https://ariakit.org/examples/menu-nested-combobox)
      */
     setValueOnClick?: BooleanOrCallback<MouseEvent<HTMLElement>>;
     /**

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

@@ -56,6 +56,11 @@ export interface ComboboxItemOptions<T extends As = "div"> extends CompositeItem
      *   [`setValueOnClick`](https://ariakit.org/reference/combobox-item#setvalueonclick)
      *   is set to `true`, this will be the value of the combobox input when the
      *   user clicks on this item.
+     * - If
+     *   [`selectValueOnClick`](https://ariakit.org/reference/combobox-item#selectvalueonclick)
+     *   is set to `true`, this will be the value of the
+     *   [`selectedValue`](https://ariakit.org/reference/combobox-provider#selectedvalue)
+     *   state.
      * - If the
      *   [`autoComplete`](https://ariakit.org/reference/combobox#autocomplete)
      *   prop on the [`Combobox`](https://ariakit.org/reference/combobox)
@@ -88,7 +93,12 @@ export interface ComboboxItemOptions<T extends As = "div"> extends CompositeItem
      * [`selectedValue`](https://ariakit.org/reference/combobox-provider#selectedvalue)
      * state using this item's
      * [`value`](https://ariakit.org/reference/combobox-item#value) when the item
-     * is clicked.
+     * is clicked. If a callback is provided, it will only be invoked if the item
+     * has a value.
+     *
+     * Live examples:
+     * - [Submenu with
+     *   Combobox](https://ariakit.org/examples/menu-nested-combobox)
      * @default true
      */
     selectValueOnClick?: BooleanOrCallback<MouseEvent<HTMLElement>>;
@@ -102,6 +112,8 @@ export interface ComboboxItemOptions<T extends As = "div"> extends CompositeItem
      *
      * Live examples:
      * - [Menu with Combobox](https://ariakit.org/examples/menu-combobox)
+     * - [Submenu with
+     *   Combobox](https://ariakit.org/examples/menu-nested-combobox)
      */
     setValueOnClick?: BooleanOrCallback<MouseEvent<HTMLElement>>;
     /**