@skdx/react 0.28.0 → 0.29.0

package/dist/combobox/Combobox.d.ts

@@ -1,19 +1,13 @@
 import * as React from 'react';
-import type { ComboboxContextValue, ComboboxProps } from './types.js';
+import type { ComboboxContextValue, ComboboxHandle, ComboboxProps } from './types.js';
 export declare const OPTION_SELECTOR = "[role=\"option\"]:not([data-disabled])";
 /** Default `getResultCountLabel`: `"1 result available"` / `"3 results available"`. */
 export declare function defaultGetResultCountLabel(count: number): string;
-export declare const ComboboxProvider: {
-    (props: ComboboxContextValue & {
-        children: React.ReactNode;
-    }): React.JSX.Element;
-    displayName: string;
-}, useComboboxContext: (consumerName: string) => ComboboxContextValue;
+export declare const ComboboxProvider: React.FC<ComboboxContextValue & {
+    children: React.ReactNode;
+}>, useComboboxContext: (consumerName: string) => ComboboxContextValue;
 /**
- * WAI-ARIA 1.2 "combobox with list autocomplete": real DOM focus stays on the input,
- * highlighted option is virtual focus via aria-activedescendant. Filtering is
- * consumer-driven by default or moves inside with a `filter` predicate.
- * Works controlled or uncontrolled.
+ * WAI-ARIA 1.2 "combobox with list autocomplete": DOM focus stays on the input, and the highlighted option is virtual focus via `aria-activedescendant`.
  *
  * @example
  * ```tsx
@@ -26,48 +20,10 @@ export declare const ComboboxProvider: {
  *   </ComboboxPortal>
  * </Combobox>
  * ```
- *
- * @example Consumer-side (default) filtering:
- * ```tsx
- * function FruitCombobox() {
- *   const [inputValue, setInputValue] = React.useState('');
- *   const filtered = FRUITS.filter((f) => f.toLowerCase().includes(inputValue.toLowerCase()));
- *
- *   return (
- *     <Combobox inputValue={inputValue} onInputValueChange={setInputValue}>
- *       <ComboboxInput placeholder="Search a fruit…" />
- *       <ComboboxPortal>
- *         <ComboboxContent>
- *           {filtered.length === 0 ? (
- *             <ComboboxEmpty>No results</ComboboxEmpty>
- *           ) : (
- *             filtered.map((fruit) => (
- *               <ComboboxItem value={fruit} key={fruit}>{fruit}</ComboboxItem>
- *             ))
- *           )}
- *         </ComboboxContent>
- *       </ComboboxPortal>
- *     </Combobox>
- *   );
- * }
- * ```
- *
- * @example Built-in filtering, multi-select, creatable:
- * ```tsx
- * <Combobox
- *   multiple
- *   allowCustomValue
- *   autoHighlight
- *   filter={(text, input) => text.toLowerCase().includes(input.toLowerCase())}
- * >
- *   <ComboboxInput placeholder="Search a fruit…" />
- *   <ComboboxPortal>
- *     <ComboboxContent>
- *       {FRUITS.map((fruit) => <ComboboxItem value={fruit} key={fruit}>{fruit}</ComboboxItem>)}
- *       <ComboboxEmpty>No results</ComboboxEmpty>
- *     </ComboboxContent>
- *   </ComboboxPortal>
- * </Combobox>
- * ```
  */
-export declare const Combobox: React.ForwardRefExoticComponent<ComboboxProps & React.RefAttributes<import("../index.js").FormValidityHandle>>;
+export declare const Combobox: {
+    ({ children, value: valueProp, defaultValue, onValueChange, multiple, allowCustomValue, filter: filterProp, autoHighlight, loop, openOn, onHighlightChange, loading, inputValue: inputValueProp, defaultInputValue, onInputValueChange, open: openProp, defaultOpen, onOpenChange, onOpenChangeComplete, invalid, readOnly, disabled, getResultCountLabel, name, form, required, options, renderOption, placeholder, "aria-label": ariaLabel, shape, size, ref: forwardedRef, ...rest }: Omit<ComboboxProps, "ref"> & {
+        ref?: React.Ref<ComboboxHandle> | undefined;
+    }): React.ReactNode;
+    displayName: string;
+};

package/dist/combobox/Combobox.js

@@ -1 +1,2 @@
-import*as n from"react";import{createSafeContext as Vo}from"../utils/createContext.js";import{formValidityHandle as Go,useFormReset as So}from"../utils/formControl.js";import{MirroredValues as Ao}from"../utils/hiddenInput.js";import{announce as No}from"../utils/liveAnnouncer.js";import{PopperRoot as Fo}from"../utils/popper.js";import{filterKeeps as Bo,rankByScore as qo,sortByOrder as Ko}from"../utils/scoredFilter.js";import{useControllableState as Ie}from"../utils/useControllableState.js";import{useOpenChangeComplete as Wo}from"../utils/useOpenChangeComplete.js";import{useSelection as Uo}from"../utils/useSelection.js";import*as fe from"react";import{useComposedRefs as to}from"../utils/composeRefs.js";import{skdxPart as no}from"../utils/part.js";import{PopperContent as ro}from"../utils/popper.js";import{composeEventHandlers as ao}from"../utils/primitive.js";import{useDismiss as io}from"../utils/useDismiss.js";import{jsx as lo}from"react/jsx-runtime";var _=fe.forwardRef(({forceMount:t,side:a="bottom",align:e="start",sideOffset:l=4,onEscapeKeyDown:b,onPointerDownOutside:s,onFocusOutside:p,onInteractOutside:x,...o},u)=>{let m=f("ComboboxContent"),h=to(u,m.contentRef);return io({enabled:m.open,onEscapeKeyDown:c=>{b?.(c),c.defaultPrevented||m.onOpenChange(!1)},onInteractOutside:x,onPointerDownOutside:c=>{s?.(c),c.defaultPrevented||m.onOpenChange(!1)},onFocusOutside:c=>{p?.(c),c.defaultPrevented||m.onOpenChange(!1)}},[m.contentRef,m.inputRef,m.triggerRef]),t||m.open?lo(ro,{component:"combobox",role:"listbox",id:m.contentId,"aria-multiselectable":m.multiple?!0:void 0,"aria-busy":m.loading?!0:void 0,"data-state":m.open?"open":"closed","data-loading":m.loading?"":void 0,"data-multiple":m.multiple?"":void 0,side:a,align:e,sideOffset:l,...o,...no("combobox","content",o.className),ref:h,onMouseDown:ao(o.onMouseDown,c=>c.preventDefault())}):null});_.displayName="ComboboxContent";import*as de from"react";import{skdxPart as so}from"../utils/part.js";import{Primitive as mo}from"../utils/primitive.js";import{jsx as uo}from"react/jsx-runtime";var $=de.forwardRef((t,a)=>f("ComboboxEmpty").itemCount===0?uo(mo.div,{role:"presentation",...t,...so("combobox","empty",t.className),ref:a}):null);$.displayName="ComboboxEmpty";import*as N from"react";import{createSafeContext as co}from"../utils/createContext.js";import{skdxPart as bo}from"../utils/part.js";import{Primitive as po}from"../utils/primitive.js";import{jsx as xe}from"react/jsx-runtime";var[fo,Ce]=co("ComboboxGroup"),z=N.forwardRef((t,a)=>{let e=N.useId();return xe(fo,{labelId:e,children:xe(po.div,{role:"group","aria-labelledby":e,...t,...bo("combobox","group",t.className),ref:a})})});z.displayName="ComboboxGroup";import*as ge from"react";import{skdxPart as xo}from"../utils/part.js";import{Primitive as Co}from"../utils/primitive.js";import{jsx as go}from"react/jsx-runtime";var Y=ge.forwardRef((t,a)=>{let e=Ce("ComboboxGroupLabel");return go(Co.div,{id:e.labelId,...t,...xo("combobox","label",t.className),ref:a})});Y.displayName="ComboboxGroupLabel";import*as he from"react";import{useComposedRefs as Ro}from"../utils/composeRefs.js";import{skdxPart as ho}from"../utils/part.js";import{PopperAnchor as yo}from"../utils/popper.js";import{composeEventHandlers as L,Primitive as vo}from"../utils/primitive.js";import{sortByOrder as Io}from"../utils/scoredFilter.js";import{jsx as Re}from"react/jsx-runtime";var Oo=new Set(["Home","End","PageUp","PageDown"]),J=he.forwardRef((t,a)=>{let e=f("ComboboxInput"),l=Ro(a,e.inputRef),b=o=>{o&&(e.setActiveId(o.id,"keyboard"),o.scrollIntoView?.({block:"nearest"}))},s=()=>{let o=e.contentRef.current;return o?Io(Array.from(o.querySelectorAll(Q)),e.itemOrder):[]},p=o=>{let u=s();if(u.length===0)return;let m=u.findIndex(k=>k.id===e.activeId),h=m===-1?o===1?-1:0:m,c=e.loop?(h+o+u.length)%u.length:Math.min(u.length-1,Math.max(0,h+o));b(u[c])},x=()=>{if(!e.activeId)return;let o=e.getItem(e.activeId);o&&e.selectItem(o.value,o.text||o.value,"keyboard")};return Re(yo,{asChild:!0,children:Re(vo.input,{type:"text",role:"combobox","aria-expanded":e.open,"aria-controls":e.contentId,"aria-autocomplete":"list","aria-activedescendant":e.activeId??void 0,autoComplete:"off",readOnly:e.readOnly,disabled:e.disabled,"data-disabled":e.disabled?"":void 0,"aria-invalid":e.invalid?!0:void 0,"aria-required":e.required?!0:void 0,"aria-readonly":e.readOnly?!0:void 0,"aria-busy":e.loading?!0:void 0,"data-invalid":e.invalid?"":void 0,"data-readonly":e.readOnly?"":void 0,"data-loading":e.loading?"":void 0,"data-multiple":e.multiple?"":void 0,...t,...ho("combobox","input",t.className),ref:l,value:e.inputValue,onChange:L(t.onChange,o=>{e.onInputValueChange(o.target.value),e.open||e.onOpenChange(!0)}),onClick:L(t.onClick,()=>{e.openOn==="type"||e.readOnly||e.open||e.onOpenChange(!0)}),onFocus:L(t.onFocus,()=>{e.openOn!=="focus"||e.readOnly||e.open||e.onOpenChange(!0)}),onBlur:L(t.onBlur,o=>{let u=o.relatedTarget;u&&(u===o.currentTarget||e.contentRef.current?.contains(u))||e.reconcileDraftText()}),onKeyDown:L(t.onKeyDown,o=>{if(o.altKey&&o.key==="ArrowDown")o.preventDefault(),e.open||e.onOpenChange(!0);else if(o.altKey&&o.key==="ArrowUp")o.preventDefault(),e.activeId&&x(),e.open&&e.onOpenChange(!1);else if(o.key==="ArrowDown")o.preventDefault(),e.open?p(1):e.openWithHighlight("first");else if(o.key==="ArrowUp")o.preventDefault(),e.open?p(-1):e.openWithHighlight("last");else if(Oo.has(o.key)&&e.open){o.preventDefault();let u=s(),m=o.key==="Home"||o.key==="PageUp";b(m?u[0]:u[u.length-1])}else o.key==="Enter"?e.activeId?(o.preventDefault(),x()):e.allowCustomValue&&e.inputValue!==""?(o.preventDefault(),e.selectItem(e.inputValue,e.inputValue,"keyboard")):e.open&&e.onOpenChange(!1):o.key==="Escape"&&e.open&&!e.contentRef.current&&(o.preventDefault(),e.onOpenChange(!1))})})})});J.displayName="ComboboxInput";import*as P from"react";import{useComposedRefs as Po}from"../utils/composeRefs.js";import{skdxPart as ko}from"../utils/part.js";import{composeEventHandlers as ye,Primitive as Eo}from"../utils/primitive.js";import{useOptionEntry as wo}from"../utils/useOptionCollection.js";import{jsx as To}from"react/jsx-runtime";var X=P.forwardRef(({value:t,disabled:a,textValue:e,...l},b)=>{let s=f("ComboboxItem"),p=P.useId(),x=P.useRef(null),o=Po(b,x),u=s.isSelected(t),m=s.activeId===p,h=s.itemOrder?.get(p),{text:c,visible:k}=wo({id:p,value:t,textValue:e,itemRef:x,matchesFilter:s.matchesFilter,registerItem:s.registerItem,unregisterItem:s.unregisterItem}),G=()=>{a||(s.selectItem(t,c??t,"pointer"),s.inputRef.current?.focus())};return k?To(Eo.div,{role:"option",id:p,"data-value":t,"aria-selected":u,"data-state":u?"checked":"unchecked","data-highlighted":m?"":void 0,"aria-disabled":a||void 0,"data-disabled":a?"":void 0,...l,...ko("combobox","item",l.className),ref:o,onClick:ye(l.onClick,G),onPointerEnter:ye(l.onPointerEnter,()=>{a||s.setActiveId(p,"pointer")}),style:h!==void 0?{order:h,...l.style}:l.style}):null});X.displayName="ComboboxItem";import{Portal as Ho}from"../utils/portal.js";import{jsx as Do}from"react/jsx-runtime";var Z=({forceMount:t,children:a,...e})=>{let l=f("ComboboxPortal");return t||l.open?Do(Ho,{...e,children:a}):null};Z.displayName="ComboboxPortal";import{Fragment as Lo,jsx as V,jsxs as j}from"react/jsx-runtime";var Mo=t=>"options"in t;function ee(t,a){return t.toLowerCase().includes(a.trim().toLowerCase())}var ve=({options:t,renderOption:a,placeholder:e,ariaLabel:l,passThrough:b})=>{let s=f("Combobox"),p=l??e,x=o=>V(X,{value:o.value,disabled:o.disabled,textValue:o.label,children:a?a(o,{selected:s.isSelected(o.value)}):o.label??o.value},o.value);return j(Lo,{children:[V(J,{...b,"aria-label":p,placeholder:e}),V(Z,{children:j(_,{"aria-label":p,children:[t.map(o=>Mo(o)?j(z,{children:[V(Y,{children:o.label}),o.options.map(x)]},o.label):x(o)),V($,{children:"No results"})]})})]})};import{jsx as oe,jsxs as Jo}from"react/jsx-runtime";var Q='[role="option"]:not([data-disabled])';function _o(t,a){let e=t.querySelector('[data-part="viewport"]')??t;if(e===a||!e.contains(a))return;let l=e.getBoundingClientRect(),b=a.getBoundingClientRect();e.scrollTop+=b.top-l.top-(l.height-b.height)/2}function $o(t){return`${t} result${t===1?"":"s"} available`}var[zo,f]=Vo("Combobox"),Yo=n.forwardRef(function({children:a,value:e,defaultValue:l,onValueChange:b,multiple:s=!1,allowCustomValue:p=!1,filter:x,autoHighlight:o=!1,loop:u=!0,openOn:m="type",onHighlightChange:h,loading:c=!1,inputValue:k,defaultInputValue:G="",onInputValueChange:we,open:Te,defaultOpen:He=!1,onOpenChange:De,onOpenChangeComplete:Me,invalid:Le=!1,readOnly:Ve=!1,disabled:te=!1,getResultCountLabel:ne=$o,name:Ge,form:Se,required:re=!1,options:ae,renderOption:Ae,placeholder:Ne,"aria-label":Fe,...Be},qe){let O=x??(ae?ee:"manual"),ie=n.useRef(null),Ke=n.useRef(null),le=n.useRef(null),E=n.useRef(null),[v,w]=n.useState(null),[y,se]=n.useState(()=>new Map),F=n.useRef(null),B=n.useRef("programmatic"),q=n.useRef(null),{selectedValues:C,isSelected:We,selectItem:me,setSelection:ue}=Uo({value:e,defaultValue:l,onValueChange:r=>b?.({value:r.value,previousValue:q.current,reason:B.current,selectedValue:r.selectedValue}),multiple:s,label:"Combobox"}),ce=n.useCallback((r,i)=>{q.current=C.length===0?null:C,B.current=i,me(r)},[me,C]),K=n.useCallback((r,i)=>{q.current=C.length===0?null:C,B.current=i,ue(r)},[ue,C]),[T="",R]=Ie({prop:k,defaultProp:G,onChange:we}),[g=!1,H]=Ie({prop:Te,defaultProp:He,onChange:De});Wo(g,E,Me);let[Ue,_e]=n.useState(g);g!==Ue&&(_e(g),g||w(null));let W=n.useMemo(()=>O==="manual"?null:qo([...y.keys()],r=>{let i=y.get(r);if(!i)return null;let d=O(i.text,T);return typeof d=="number"?d:null}),[O,T,y]),D=n.useCallback(r=>Ko(Array.from(r?.querySelectorAll(Q)??[]),W),[W]);n.useEffect(()=>{if(!g)return;let r=requestAnimationFrame(()=>{let i=F.current;if(F.current=null,!i)return;let d=E.current,I=D(d);if(!d||I.length===0)return;let M=i==="last"?I[I.length-1]:I[0];w(oo=>oo??M.id),_o(d,M)});return()=>cancelAnimationFrame(r)},[g,D]);let S=y.size,be=n.useRef("auto"),pe=n.useRef(null),$e=n.useCallback((r,i="auto")=>{be.current=i,w(r)},[]),A=v?y.get(v)?.value??null:null;n.useEffect(()=>{let r=pe.current;A!==r&&(pe.current=A,h?.({value:A,previousValue:r,reason:be.current}))},[A,h]),n.useLayoutEffect(()=>{if(v===null)return;let r=D(E.current);r.some(i=>i.id===v)||w(r[0]?.id??null)}),n.useEffect(()=>{if(!o||!g||v!==null)return;let r=requestAnimationFrame(()=>{let i=D(E.current)[0];i&&w(i.id)});return()=>cancelAnimationFrame(r)},[o,g,v,S,D]),n.useEffect(()=>{!g||c||No(ne(S))},[g,c,S,ne]);let ze=n.useCallback(r=>{F.current=r,H(!0)},[H]),Ye=n.useCallback((r,i)=>{se(d=>{let I=d.get(r);if(I?.value===i.value&&I.text===i.text)return d;let M=new Map(d);return M.set(r,i),M})},[]),Je=n.useCallback(r=>{se(i=>{if(!i.has(r))return i;let d=new Map(i);return d.delete(r),d})},[]),Qe=n.useCallback(r=>y.get(r),[y]),Xe=n.useCallback(r=>O==="manual"||Bo(O(r,T)),[O,T]),U=n.useRef(null),Ze=n.useCallback((r,i,d)=>{if(ce(r,d),!s){U.current=i,R(i),H(!1);return}R("")},[ce,s,R,H]),je=n.useCallback(()=>{C.length>0&&K([],"pointer"),U.current=null,R("")},[C.length,K,R]),eo=n.useCallback(()=>{if(p)return;let r=s?void 0:C[0];if(r===void 0){R("");return}for(let i of y.values())if(i.value===r){R(i.text||i.value);return}R(U.current??r)},[p,s,C,y,R]);return n.useImperativeHandle(qe,()=>Go(le),[]),So(ie,()=>{l!==void 0&&K(l,"programmatic"),R(G)}),oe(Fo,{children:Jo(zo,{inputRef:ie,triggerRef:Ke,contentRef:E,contentId:n.useId(),multiple:s,selectedValues:C,isSelected:We,selectItem:Ze,clear:je,inputValue:T,onInputValueChange:R,open:g,onOpenChange:H,activeId:v,itemOrder:W,setActiveId:$e,openWithHighlight:ze,loop:u,openOn:m,reconcileDraftText:eo,itemCount:S,registerItem:Ye,unregisterItem:Je,getItem:Qe,matchesFilter:Xe,invalid:Le,readOnly:Ve,disabled:te,loading:c,allowCustomValue:p,required:re,children:[a??oe(ve,{options:ae??[],renderOption:Ae,placeholder:Ne,ariaLabel:Fe,passThrough:Be}),oe(Ao,{name:Ge,values:C,required:re,disabled:te,form:Se,singleValued:!s,controlRef:le})]})})});Yo.displayName="Combobox";import*as Pe from"react";import{useComposedRefs as Qo}from"../utils/composeRefs.js";import{skdxPart as Xo}from"../utils/part.js";import{composeEventHandlers as Oe,Primitive as Zo}from"../utils/primitive.js";import{jsx as et}from"react/jsx-runtime";var jo=Pe.forwardRef((t,a)=>{let e=f("ComboboxTrigger"),l=Qo(a,e.triggerRef);return et(Zo.button,{type:"button",tabIndex:-1,"aria-expanded":e.open,"aria-controls":e.open?e.contentId:void 0,disabled:e.disabled,"data-disabled":e.disabled?"":void 0,"data-readonly":e.readOnly?"":void 0,"data-state":e.open?"open":"closed",...t,...Xo("combobox","trigger",t.className),ref:l,onMouseDown:Oe(t.onMouseDown,b=>b.preventDefault()),onClick:Oe(t.onClick,()=>{e.readOnly||(e.onOpenChange(!e.open),e.inputRef.current?.focus())})})});jo.displayName="ComboboxTrigger";import*as Ee from"react";import{skdxPart as ot}from"../utils/part.js";import{composeEventHandlers as ke,Primitive as tt}from"../utils/primitive.js";import{jsx as rt}from"react/jsx-runtime";var nt=Ee.forwardRef((t,a)=>{let e=f("ComboboxClear"),l=e.selectedValues.length===0&&e.inputValue==="";return rt(tt.button,{type:"button",tabIndex:-1,disabled:e.disabled||e.readOnly||l,"data-disabled":e.disabled?"":void 0,"data-readonly":e.readOnly?"":void 0,...t,...ot("combobox","clear",t.className),ref:a,onMouseDown:ke(t.onMouseDown,b=>b.preventDefault()),onClick:ke(t.onClick,()=>{e.clear(),e.inputRef.current?.focus()})})});nt.displayName="ComboboxClear";export{Yo as Combobox,ve as ComboboxAnatomy,nt as ComboboxClear,_ as ComboboxContent,$ as ComboboxEmpty,z as ComboboxGroup,Y as ComboboxGroupLabel,fo as ComboboxGroupProvider,J as ComboboxInput,X as ComboboxItem,Z as ComboboxPortal,zo as ComboboxProvider,jo as ComboboxTrigger,Q as OPTION_SELECTOR,$o as defaultGetResultCountLabel,ee as defaultOptionsFilter,f as useComboboxContext,Ce as useComboboxGroupContext};
+'use client';
+import*as l from"react";import{createSafeContext as go}from"../utils/createContext.js";import{formValidityHandle as Ro,useFormReset as ho}from"../utils/formControl.js";import{MirroredValues as yo}from"../utils/hiddenInput.js";import{announce as Po}from"../utils/liveAnnouncer.js";import{PopperRoot as Io}from"../utils/popper.js";import{recipeAxis as fe}from"../utils/recipeAxis.js";import{filterKeeps as Oo,rankByScore as vo,sortByOrder as Eo}from"../utils/scoredFilter.js";import{useControllableState as de}from"../utils/useControllableState.js";import{useOpenChangeComplete as ko}from"../utils/useOpenChangeComplete.js";import{useSelection as Ho}from"../utils/useSelection.js";import{useComposedRefs as Fe}from"../utils/composeRefs.js";import{skdxPart as Ke}from"../utils/part.js";import{PopperContent as qe}from"../utils/popper.js";import{composeEventHandlers as Be}from"../utils/primitive.js";import{useDismiss as We}from"../utils/useDismiss.js";import{jsx as ze}from"react/jsx-runtime";var W=({forceMount:r,side:t="bottom",align:o="start",sideOffset:s=4,onEscapeKeyDown:e,onPointerDownOutside:a,onFocusOutside:m,onInteractOutside:u,ref:p,...c})=>{let i=C("ComboboxContent"),x=Fe(p,i.contentRef);return We({enabled:i.open,onEscapeKeyDown:b=>{e?.(b),b.defaultPrevented||i.onOpenChange(!1)},onInteractOutside:u,onPointerDownOutside:b=>{a?.(b),b.defaultPrevented||i.onOpenChange(!1)},onFocusOutside:b=>{m?.(b),b.defaultPrevented||i.onOpenChange(!1)}},[i.contentRef,i.inputRef,i.triggerRef]),r||i.open?ze(qe,{component:"combobox",role:"listbox",id:i.contentId,"aria-multiselectable":i.multiple?!0:void 0,"aria-busy":i.loading?!0:void 0,"data-state":i.open?"open":"closed","data-loading":i.loading?"":void 0,"data-multiple":i.multiple?"":void 0,side:t,align:o,sideOffset:s,...c,...Ke("combobox","content",c.className),ref:x,onMouseDown:Be(c.onMouseDown,b=>b.preventDefault())}):null};W.displayName="ComboboxContent";import{skdxPart as Ue}from"../utils/part.js";import{Primitive as Je}from"../utils/primitive.js";import{jsx as Xe}from"react/jsx-runtime";var z=({ref:r,...t})=>C("ComboboxEmpty").itemCount===0?Xe(Je.div,{role:"presentation",...t,...Ue("combobox","empty",t.className),ref:r}):null;z.displayName="ComboboxEmpty";import*as me from"react";import{createSafeContext as _e}from"../utils/createContext.js";import{skdxPart as $e}from"../utils/part.js";import{Primitive as Ye}from"../utils/primitive.js";import{jsx as se}from"react/jsx-runtime";var[Qe,ue]=_e("ComboboxGroup"),U=({ref:r,...t})=>{let o=me.useId();return se(Qe,{labelId:o,children:se(Ye.div,{role:"group","aria-labelledby":o,...t,...$e("combobox","group",t.className),ref:r})})};U.displayName="ComboboxGroup";import{skdxPart as Ze}from"../utils/part.js";import{Primitive as je}from"../utils/primitive.js";import{jsx as eo}from"react/jsx-runtime";var J=({ref:r,...t})=>{let o=ue("ComboboxGroupLabel");return eo(je.div,{id:o.labelId,...t,...Ze("combobox","label",t.className),ref:r})};J.displayName="ComboboxGroupLabel";import{appearanceAttrs as oo}from"../utils/appearance.js";import{useComposedRefs as to}from"../utils/composeRefs.js";import{skdxPart as no}from"../utils/part.js";import{PopperAnchor as ro}from"../utils/popper.js";import{composeEventHandlers as V,Primitive as ao}from"../utils/primitive.js";import{sortByOrder as io}from"../utils/scoredFilter.js";import{jsx as ce}from"react/jsx-runtime";var lo=new Set(["Home","End","PageUp","PageDown"]),X=({ref:r,shape:t,size:o,...s})=>{let e=C("ComboboxInput"),a=to(r,e.inputRef),m=n=>{n&&(e.setActiveId(n.id,"keyboard"),n.scrollIntoView?.({block:"nearest"}))},u=()=>{let n=e.contentRef.current;return n?io(Array.from(n.querySelectorAll(_)),e.itemOrder):[]},p=n=>{let f=u();if(f.length===0)return;let P=f.findIndex(I=>I.id===e.activeId),d=P;P===-1&&(d=n===1?-1:0);let g=e.loop?(d+n+f.length)%f.length:Math.min(f.length-1,Math.max(0,d+n));m(f[g])},c=()=>{if(!e.activeId)return;let n=e.getItem(e.activeId);n&&e.selectItem(n.value,n.text||n.value,"keyboard")},i=n=>n.altKey&&n.key==="ArrowDown"?(n.preventDefault(),e.open||e.onOpenChange(!0),!0):n.altKey&&n.key==="ArrowUp"?(n.preventDefault(),e.activeId&&c(),e.open&&e.onOpenChange(!1),!0):!1,x=n=>{if(n.key==="ArrowDown")return n.preventDefault(),e.open?p(1):e.openWithHighlight("first"),!0;if(n.key==="ArrowUp")return n.preventDefault(),e.open?p(-1):e.openWithHighlight("last"),!0;if(lo.has(n.key)&&e.open){n.preventDefault();let f=u(),P=n.key==="Home"||n.key==="PageUp";return m(P?f[0]:f[f.length-1]),!0}return!1},b=n=>{n.key==="Enter"?e.activeId?(n.preventDefault(),c()):e.allowCustomValue&&e.inputValue!==""?(n.preventDefault(),e.selectItem(e.inputValue,e.inputValue,"keyboard")):e.open&&e.onOpenChange(!1):n.key==="Escape"&&e.open&&!e.contentRef.current&&(n.preventDefault(),e.onOpenChange(!1))};return ce(ro,{asChild:!0,children:ce(ao.input,{type:"text",role:"combobox","aria-expanded":e.open,"aria-controls":e.contentId,"aria-autocomplete":"list","aria-activedescendant":e.activeId??void 0,autoComplete:"off",readOnly:e.readOnly,disabled:e.disabled,"data-disabled":e.disabled?"":void 0,"aria-invalid":e.invalid?!0:void 0,"aria-required":e.required?!0:void 0,"aria-readonly":e.readOnly?!0:void 0,"aria-busy":e.loading?!0:void 0,"data-invalid":e.invalid?"":void 0,"data-readonly":e.readOnly?"":void 0,"data-loading":e.loading?"":void 0,"data-multiple":e.multiple?"":void 0,...s,...oo({shape:t,size:o},s),...no("combobox","input",s.className),ref:a,value:e.inputValue,onChange:V(s.onChange,n=>{e.onInputValueChange(n.target.value),e.open||e.onOpenChange(!0)}),onClick:V(s.onClick,()=>{e.openOn==="type"||e.readOnly||e.open||e.onOpenChange(!0)}),onFocus:V(s.onFocus,()=>{e.openOn!=="focus"||e.readOnly||e.open||e.onOpenChange(!0)}),onBlur:V(s.onBlur,n=>{let f=n.relatedTarget;f&&(f===n.currentTarget||e.contentRef.current?.contains(f))||e.reconcileDraftText()}),onKeyDown:V(s.onKeyDown,n=>{i(n)||x(n)||b(n)})})})};X.displayName="ComboboxInput";import*as L from"react";import{useComposedRefs as so}from"../utils/composeRefs.js";import{skdxPart as mo}from"../utils/part.js";import{composeEventHandlers as be,Primitive as uo}from"../utils/primitive.js";import{useOptionEntry as co}from"../utils/useOptionCollection.js";import{jsx as bo}from"react/jsx-runtime";var $=({value:r,disabled:t,textValue:o,ref:s,...e})=>{let a=C("ComboboxItem"),m=L.useId(),u=L.useRef(null),p=so(s,u),c=a.isSelected(r),i=a.activeId===m,x=a.itemOrder?.get(m),{text:b,visible:n}=co({id:m,value:r,textValue:o,itemRef:u,matchesFilter:a.matchesFilter,registerItem:a.registerItem,unregisterItem:a.unregisterItem}),f=()=>{t||(a.selectItem(r,b??r,"pointer"),a.inputRef.current?.focus())};return n?bo(uo.div,{role:"option",id:m,"data-value":r,"aria-selected":c,"data-state":c?"checked":"unchecked","data-highlighted":i?"":void 0,"aria-disabled":t||void 0,"data-disabled":t?"":void 0,...e,...mo("combobox","item",e.className),ref:p,onClick:be(e.onClick,f),onPointerEnter:be(e.onPointerEnter,()=>{t||a.setActiveId(m,"pointer")}),style:x!==void 0?{order:x,...e.style}:e.style}):null};$.displayName="ComboboxItem";import{Portal as po}from"../utils/portal.js";import{jsx as fo}from"react/jsx-runtime";var Y=({forceMount:r,children:t,...o})=>{let s=C("ComboboxPortal");return r||s.open?fo(po,{...o,children:t}):null};Y.displayName="ComboboxPortal";import{Fragment as xo,jsx as T,jsxs as Q}from"react/jsx-runtime";var Co=r=>"options"in r;function Z(r,t){return r.toLowerCase().includes(t.trim().toLowerCase())}var pe=({shape:r,size:t,options:o,renderOption:s,placeholder:e,ariaLabel:a,passThrough:m})=>{let u=C("Combobox"),p=a??e,c=i=>T($,{value:i.value,disabled:i.disabled,textValue:i.label,children:s?s(i,{selected:u.isSelected(i.value)}):i.label??i.value},i.value);return Q(xo,{children:[T(X,{...m,shape:r,size:t,"aria-label":p,placeholder:e}),T(Y,{children:Q(W,{"aria-label":p,children:[o.map(i=>Co(i)?Q(U,{children:[T(J,{children:i.label}),i.options.map(c)]},i.label):c(i)),T(z,{children:"No results"})]})})]})};import{jsx as j,jsxs as Ko}from"react/jsx-runtime";var _='[role="option"]:not([data-disabled])';function Vo(r,t){let o=r.querySelector('[data-part="viewport"]')??r;if(o===t||!o.contains(t))return;let s=o.getBoundingClientRect(),e=t.getBoundingClientRect();o.scrollTop+=e.top-s.top-(s.height-e.height)/2}function To(r){return`${r} result${r===1?"":"s"} available`}var[wo,C]=go("Combobox");function Do(r,t){return r??(t?Z:"manual")}function Mo(){let[r,t]=l.useState(()=>new Map),o=l.useCallback((a,m)=>{t(u=>{let p=u.get(a);if(p?.value===m.value&&p.text===m.text)return u;let c=new Map(u);return c.set(a,m),c})},[]),s=l.useCallback(a=>{t(m=>{if(!m.has(a))return m;let u=new Map(m);return u.delete(a),u})},[]),e=l.useCallback(a=>r.get(a),[r]);return{items:r,itemCount:r.size,registerItem:o,unregisterItem:s,getItem:e}}function So({value:r,defaultValue:t,onValueChange:o,multiple:s}){let e=l.useRef("programmatic"),a=l.useRef([]),{selectedValues:m,isSelected:u,selectItem:p,setSelection:c}=Ho({value:r,defaultValue:t,onValueChange:b=>o?.({value:b.value,previousValue:a.current,reason:e.current,selectedValue:b.selectedValue}),multiple:s,label:"Combobox"}),i=l.useCallback((b,n)=>{a.current=m,e.current=n,p(b)},[p,m]),x=l.useCallback((b,n)=>{a.current=m,e.current=n,c(b)},[c,m]);return{selectedValues:m,isSelected:u,commitSelection:i,setSelection:x}}function Lo({inputValue:r,defaultInputValue:t="",onInputValueChange:o,inputRef:s,defaultValue:e,setSelection:a}){let[m="",u]=de({prop:r,defaultProp:t,onChange:o});return ho(s,()=>{e!==void 0&&a(e,"programmatic"),u(t)}),[m,u]}function No({open:r,defaultOpen:t=!1,onOpenChange:o,setActiveId:s}){let[e=!1,a]=de({prop:r,defaultProp:t,onChange:o}),[m,u]=l.useState(e);return e!==m&&(u(e),e||s(null)),[e,a]}function Go({open:r,setOpen:t,autoHighlight:o,itemCount:s,items:e,contentRef:a,orderedOptions:m,onHighlightChange:u,activeId:p,setActiveId:c}){let i=l.useRef(null);l.useEffect(()=>{if(!r)return;let d=requestAnimationFrame(()=>{let g=i.current;if(i.current=null,!g)return;let I=a.current,O=m(I);if(!I||O.length===0)return;let w=g==="last"?O[O.length-1]:O[0];c(N=>N??w.id),Vo(I,w)});return()=>cancelAnimationFrame(d)},[r,m,a,c]);let x=l.useRef("auto"),b=l.useRef(null),n=l.useCallback((d,g="auto")=>{x.current=g,c(d)},[c]),f=p?e.get(p)?.value??null:null;l.useEffect(()=>{let d=b.current;f!==d&&(b.current=f,u?.({value:f,previousValue:d,reason:x.current}))},[f,u]),l.useLayoutEffect(()=>{if(p===null)return;let d=m(a.current);d.some(g=>g.id===p)||c(d[0]?.id??null)}),l.useEffect(()=>{if(!o||!r||p!==null)return;let d=requestAnimationFrame(()=>{let g=m(a.current)[0];g&&c(g.id)});return()=>cancelAnimationFrame(d)},[o,r,p,s,m,a,c]);let P=l.useCallback(d=>{i.current=d,t(!0)},[t]);return{setActiveIdWithReason:n,openWithHighlight:P}}function Ao(r,t,o,s){l.useEffect(()=>{!r||t||Po(s(o))},[r,t,o,s])}var Fo=function({children:t,value:o,defaultValue:s,onValueChange:e,multiple:a=!1,allowCustomValue:m=!1,filter:u,autoHighlight:p=!1,loop:c=!0,openOn:i="type",onHighlightChange:x,loading:b=!1,inputValue:n,defaultInputValue:f,onInputValueChange:P,open:d,defaultOpen:g,onOpenChange:I,onOpenChangeComplete:O,invalid:w=!1,readOnly:N=!1,disabled:ee=!1,getResultCountLabel:ge=To,name:Re,form:he,required:oe=!1,options:te,renderOption:ye,placeholder:Pe,"aria-label":Ie,shape:Oe,size:ve,ref:Ee,...G}){let v=Do(u,te),ne=l.useRef(null),ke=l.useRef(null),re=l.useRef(null),A=l.useRef(null),[ae,ie]=l.useState(null),{items:E,itemCount:F,registerItem:He,unregisterItem:Ve,getItem:Te}=Mo(),{selectedValues:k,isSelected:we,commitSelection:le,setSelection:K}=So({value:o,defaultValue:s,onValueChange:e,multiple:a}),[H,h]=Lo({inputValue:n,defaultInputValue:f,onInputValueChange:P,inputRef:ne,defaultValue:s,setSelection:K}),[D,M]=No({open:d,defaultOpen:g,onOpenChange:I,setActiveId:ie});ko(D,A,O);let q=l.useMemo(()=>v==="manual"?null:vo([...E.keys()],R=>{let y=E.get(R);if(!y)return null;let S=v(y.text,H);return typeof S=="number"?S:null}),[v,H,E]),De=l.useCallback(R=>Eo(Array.from(R?.querySelectorAll(_)??[]),q),[q]),{setActiveIdWithReason:Me,openWithHighlight:Se}=Go({open:D,setOpen:M,autoHighlight:p,itemCount:F,items:E,contentRef:A,orderedOptions:De,onHighlightChange:x,activeId:ae,setActiveId:ie});Ao(D,b,F,ge);let Le=l.useCallback(R=>v==="manual"||Oo(v(R,H)),[v,H]),B=l.useRef(null),Ne=l.useCallback((R,y,S)=>{if(le(R,S),!a){B.current=y,h(y),M(!1);return}h("")},[le,a,h,M]),Ge=l.useCallback(()=>{k.length>0&&K([],"pointer"),B.current=null,h("")},[k.length,K,h]),Ae=l.useCallback(()=>{if(m)return;let R=a?void 0:k[0];if(R===void 0){h("");return}for(let y of E.values())if(y.value===R){h(y.text||y.value);return}h(B.current??R)},[m,a,k,E,h]);return l.useImperativeHandle(Ee,()=>Ro(re),[]),j(Io,{children:Ko(wo,{inputRef:ne,triggerRef:ke,contentRef:A,contentId:l.useId(),multiple:a,selectedValues:k,isSelected:we,selectItem:Ne,clear:Ge,inputValue:H,onInputValueChange:h,open:D,onOpenChange:M,activeId:ae,itemOrder:q,setActiveId:Me,openWithHighlight:Se,loop:c,openOn:i,reconcileDraftText:Ae,itemCount:F,registerItem:He,unregisterItem:Ve,getItem:Te,matchesFilter:Le,invalid:w,readOnly:N,disabled:ee,loading:b,allowCustomValue:m,required:oe,children:[t??j(pe,{shape:fe(Oe,G,"data-shape"),size:fe(ve,G,"data-size"),options:te??[],renderOption:ye,placeholder:Pe,ariaLabel:Ie,passThrough:G}),j(yo,{name:Re,values:k,required:oe,disabled:ee,form:he,singleValued:!a,controlRef:re})]})})};Fo.displayName="Combobox";import{useComposedRefs as qo}from"../utils/composeRefs.js";import{skdxPart as Bo}from"../utils/part.js";import{composeEventHandlers as Ce,Primitive as Wo}from"../utils/primitive.js";import{jsx as Uo}from"react/jsx-runtime";var zo=({ref:r,...t})=>{let o=C("ComboboxTrigger"),s=qo(r,o.triggerRef);return Uo(Wo.button,{type:"button",tabIndex:-1,"aria-expanded":o.open,"aria-controls":o.open?o.contentId:void 0,disabled:o.disabled,"data-disabled":o.disabled?"":void 0,"data-readonly":o.readOnly?"":void 0,"data-state":o.open?"open":"closed",...t,...Bo("combobox","trigger",t.className),ref:s,onMouseDown:Ce(t.onMouseDown,e=>e.preventDefault()),onClick:Ce(t.onClick,()=>{o.readOnly||(o.onOpenChange(!o.open),o.inputRef.current?.focus())})})};zo.displayName="ComboboxTrigger";import{skdxPart as Jo}from"../utils/part.js";import{composeEventHandlers as xe,Primitive as Xo}from"../utils/primitive.js";import{jsx as $o}from"react/jsx-runtime";var _o=({ref:r,...t})=>{let o=C("ComboboxClear"),s=o.selectedValues.length===0&&o.inputValue==="";return $o(Xo.button,{type:"button",tabIndex:-1,disabled:o.disabled||o.readOnly||s,"data-disabled":o.disabled?"":void 0,"data-readonly":o.readOnly?"":void 0,...t,...Jo("combobox","clear",t.className),ref:r,onMouseDown:xe(t.onMouseDown,e=>e.preventDefault()),onClick:xe(t.onClick,()=>{o.clear(),o.inputRef.current?.focus()})})};_o.displayName="ComboboxClear";export{Fo as Combobox,pe as ComboboxAnatomy,_o as ComboboxClear,W as ComboboxContent,z as ComboboxEmpty,U as ComboboxGroup,J as ComboboxGroupLabel,Qe as ComboboxGroupProvider,X as ComboboxInput,$ as ComboboxItem,Y as ComboboxPortal,wo as ComboboxProvider,zo as ComboboxTrigger,_ as OPTION_SELECTOR,To as defaultGetResultCountLabel,Z as defaultOptionsFilter,C as useComboboxContext,ue as useComboboxGroupContext};

package/dist/combobox/ComboboxAnatomy.d.cts

@@ -1,18 +1,20 @@
 import type * as React from 'react';
 import type { PassThroughProps } from '../utils/passThrough.cjs';
-import type { ComboboxOption, ComboboxOptionOrGroup } from './types.cjs';
+import type { ComboboxInputProps, ComboboxOption, ComboboxOptionOrGroup } from './types.cjs';
 /** Case-insensitive substring match — the default filter for a derived `options` combobox or autocomplete. */
 export declare function defaultOptionsFilter(text: string, inputValue: string): boolean;
 /**
  * Renders Combobox anatomy from `options`: input, portal, and listbox.
  * @internal
  */
-export declare const ComboboxAnatomy: ({ options, renderOption, placeholder, ariaLabel, passThrough, }: {
+export declare const ComboboxAnatomy: ({ shape, size, options, renderOption, placeholder, ariaLabel, passThrough, }: {
+    shape?: ComboboxInputProps["shape"] | undefined;
+    size?: ComboboxInputProps["size"] | undefined;
     options: ComboboxOptionOrGroup[];
-    renderOption?: (option: ComboboxOption, state: {
+    renderOption?: ((option: ComboboxOption, state: {
         selected: boolean;
-    }) => React.ReactNode;
-    placeholder?: string;
-    ariaLabel?: string;
-    passThrough?: PassThroughProps;
+    }) => React.ReactNode) | undefined;
+    placeholder?: string | undefined;
+    ariaLabel?: string | undefined;
+    passThrough?: PassThroughProps | undefined;
 }) => React.JSX.Element;

package/dist/combobox/ComboboxAnatomy.d.ts

@@ -1,18 +1,20 @@
 import type * as React from 'react';
 import type { PassThroughProps } from '../utils/passThrough.js';
-import type { ComboboxOption, ComboboxOptionOrGroup } from './types.js';
+import type { ComboboxInputProps, ComboboxOption, ComboboxOptionOrGroup } from './types.js';
 /** Case-insensitive substring match — the default filter for a derived `options` combobox or autocomplete. */
 export declare function defaultOptionsFilter(text: string, inputValue: string): boolean;
 /**
  * Renders Combobox anatomy from `options`: input, portal, and listbox.
  * @internal
  */
-export declare const ComboboxAnatomy: ({ options, renderOption, placeholder, ariaLabel, passThrough, }: {
+export declare const ComboboxAnatomy: ({ shape, size, options, renderOption, placeholder, ariaLabel, passThrough, }: {
+    shape?: ComboboxInputProps["shape"] | undefined;
+    size?: ComboboxInputProps["size"] | undefined;
     options: ComboboxOptionOrGroup[];
-    renderOption?: (option: ComboboxOption, state: {
+    renderOption?: ((option: ComboboxOption, state: {
         selected: boolean;
-    }) => React.ReactNode;
-    placeholder?: string;
-    ariaLabel?: string;
-    passThrough?: PassThroughProps;
+    }) => React.ReactNode) | undefined;
+    placeholder?: string | undefined;
+    ariaLabel?: string | undefined;
+    passThrough?: PassThroughProps | undefined;
 }) => React.JSX.Element;

package/dist/combobox/ComboboxClear.d.cts

@@ -1,13 +1,14 @@
-import * as React from 'react';
+import type * as React from 'react';
 import type { ComboboxClearProps } from './types.cjs';
 /**
- * Clears selection and draft text. Disabled when empty or root is `disabled`
- * / `readOnly`. `tabIndex={-1}` keeps focus on input for whole interaction.
- * Requires `aria-label`.
+ * Clears selection and draft text; disabled when empty or the root is `disabled`/`readOnly`.
  *
  * @example
  * ```tsx
  * <ComboboxClear aria-label="Clear selection">✕</ComboboxClear>
  * ```
  */
-export declare const ComboboxClear: React.ForwardRefExoticComponent<Omit<ComboboxClearProps, "ref"> & React.RefAttributes<HTMLButtonElement>>;
+export declare const ComboboxClear: {
+    ({ ref: forwardedRef, ...props }: ComboboxClearProps): React.ReactNode;
+    displayName: string;
+};

package/dist/combobox/ComboboxClear.d.ts

@@ -1,13 +1,14 @@
-import * as React from 'react';
+import type * as React from 'react';
 import type { ComboboxClearProps } from './types.js';
 /**
- * Clears selection and draft text. Disabled when empty or root is `disabled`
- * / `readOnly`. `tabIndex={-1}` keeps focus on input for whole interaction.
- * Requires `aria-label`.
+ * Clears selection and draft text; disabled when empty or the root is `disabled`/`readOnly`.
  *
  * @example
  * ```tsx
  * <ComboboxClear aria-label="Clear selection">✕</ComboboxClear>
  * ```
  */
-export declare const ComboboxClear: React.ForwardRefExoticComponent<Omit<ComboboxClearProps, "ref"> & React.RefAttributes<HTMLButtonElement>>;
+export declare const ComboboxClear: {
+    ({ ref: forwardedRef, ...props }: ComboboxClearProps): React.ReactNode;
+    displayName: string;
+};

package/dist/combobox/ComboboxContent.d.cts

@@ -1,21 +1,7 @@
-import * as React from 'react';
+import type * as React from 'react';
 import type { ComboboxContentProps } from './types.cjs';
 /**
- * The listbox popup for a {@link Combobox}, positioned relative to the input
- * via floating-ui (see {@link ComboboxContentProps}). Renders a
- * `<div role="listbox">` with `data-state` and `data-side`/`data-align` from
- * the popper, plus `aria-multiselectable="true"` while the root is `multiple`
- * and `aria-busy`/`data-loading` while it is `loading`. Prevents `mousedown`
- * from stealing focus off the input (real DOM focus must never leave
- * `ComboboxInput`). Unmounts when closed unless `forceMount` is set.
- *
- * Closes on Escape (leaving focus on the input, which never lost it) or on an
- * outside interaction — pointer-down outside or focus moving outside, each
- * reported to `onPointerDownOutside`/`onFocusOutside` and, just before them and
- * with the same event, to `onInteractOutside`. Any of those (or
- * `onEscapeKeyDown`) calling `event.preventDefault()` keeps it open. The input
- * counts as inside: clicking or tabbing back into it is not an outside
- * interaction.
+ * The listbox popup for a {@link Combobox}, positioned relative to the input via floating-ui. Renders a `<div role="listbox">`, unmounting when closed unless `forceMount` is set.
  *
  * @example
  * ```tsx
@@ -24,4 +10,7 @@ import type { ComboboxContentProps } from './types.cjs';
  * </ComboboxContent>
  * ```
  */
-export declare const ComboboxContent: React.ForwardRefExoticComponent<Omit<ComboboxContentProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export declare const ComboboxContent: {
+    ({ forceMount, side, align, sideOffset, onEscapeKeyDown, onPointerDownOutside, onFocusOutside, onInteractOutside, ref: forwardedRef, ...props }: ComboboxContentProps): React.ReactNode;
+    displayName: string;
+};

package/dist/combobox/ComboboxContent.d.ts

@@ -1,21 +1,7 @@
-import * as React from 'react';
+import type * as React from 'react';
 import type { ComboboxContentProps } from './types.js';
 /**
- * The listbox popup for a {@link Combobox}, positioned relative to the input
- * via floating-ui (see {@link ComboboxContentProps}). Renders a
- * `<div role="listbox">` with `data-state` and `data-side`/`data-align` from
- * the popper, plus `aria-multiselectable="true"` while the root is `multiple`
- * and `aria-busy`/`data-loading` while it is `loading`. Prevents `mousedown`
- * from stealing focus off the input (real DOM focus must never leave
- * `ComboboxInput`). Unmounts when closed unless `forceMount` is set.
- *
- * Closes on Escape (leaving focus on the input, which never lost it) or on an
- * outside interaction — pointer-down outside or focus moving outside, each
- * reported to `onPointerDownOutside`/`onFocusOutside` and, just before them and
- * with the same event, to `onInteractOutside`. Any of those (or
- * `onEscapeKeyDown`) calling `event.preventDefault()` keeps it open. The input
- * counts as inside: clicking or tabbing back into it is not an outside
- * interaction.
+ * The listbox popup for a {@link Combobox}, positioned relative to the input via floating-ui. Renders a `<div role="listbox">`, unmounting when closed unless `forceMount` is set.
  *
  * @example
  * ```tsx
@@ -24,4 +10,7 @@ import type { ComboboxContentProps } from './types.js';
  * </ComboboxContent>
  * ```
  */
-export declare const ComboboxContent: React.ForwardRefExoticComponent<Omit<ComboboxContentProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export declare const ComboboxContent: {
+    ({ forceMount, side, align, sideOffset, onEscapeKeyDown, onPointerDownOutside, onFocusOutside, onInteractOutside, ref: forwardedRef, ...props }: ComboboxContentProps): React.ReactNode;
+    displayName: string;
+};

package/dist/combobox/ComboboxEmpty.d.cts

@@ -1,4 +1,4 @@
-import * as React from 'react';
+import type * as React from 'react';
 import type { ComboboxEmptyProps } from './types.cjs';
 /**
  * Fallback shown when no ComboboxItems are registered. Renders nothing while items exist.
@@ -14,4 +14,7 @@ import type { ComboboxEmptyProps } from './types.cjs';
  * </ComboboxContent>
  * ```
  */
-export declare const ComboboxEmpty: React.ForwardRefExoticComponent<Omit<ComboboxEmptyProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export declare const ComboboxEmpty: {
+    ({ ref: forwardedRef, ...props }: ComboboxEmptyProps): React.ReactNode;
+    displayName: string;
+};

package/dist/combobox/ComboboxEmpty.d.ts

@@ -1,4 +1,4 @@
-import * as React from 'react';
+import type * as React from 'react';
 import type { ComboboxEmptyProps } from './types.js';
 /**
  * Fallback shown when no ComboboxItems are registered. Renders nothing while items exist.
@@ -14,4 +14,7 @@ import type { ComboboxEmptyProps } from './types.js';
  * </ComboboxContent>
  * ```
  */
-export declare const ComboboxEmpty: React.ForwardRefExoticComponent<Omit<ComboboxEmptyProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export declare const ComboboxEmpty: {
+    ({ ref: forwardedRef, ...props }: ComboboxEmptyProps): React.ReactNode;
+    displayName: string;
+};

package/dist/combobox/ComboboxGroup.d.cts

@@ -1,15 +1,10 @@
 import * as React from 'react';
 import type { ComboboxGroupContextValue, ComboboxGroupProps } from './types.cjs';
-export declare const ComboboxGroupProvider: {
-    (props: ComboboxGroupContextValue & {
-        children: React.ReactNode;
-    }): React.JSX.Element;
-    displayName: string;
-}, useComboboxGroupContext: (consumerName: string) => ComboboxGroupContextValue;
+export declare const ComboboxGroupProvider: React.FC<ComboboxGroupContextValue & {
+    children: React.ReactNode;
+}>, useComboboxGroupContext: (consumerName: string) => ComboboxGroupContextValue;
 /**
- * Groups related {@link ComboboxItem}s under `ComboboxGroupLabel` — automatic wiring with `aria-labelledby`.
- *
- * Critical for filtering listboxes where groups reorder/empty on every keystroke — named group is the only structure screen readers can hold on to.
+ * Groups related {@link ComboboxItem}s under a `ComboboxGroupLabel`, wired automatically with `aria-labelledby`.
  *
  * @example
  * ```tsx
@@ -19,4 +14,7 @@ export declare const ComboboxGroupProvider: {
  * </ComboboxGroup>
  * ```
  */
-export declare const ComboboxGroup: React.ForwardRefExoticComponent<Omit<ComboboxGroupProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export declare const ComboboxGroup: {
+    ({ ref: forwardedRef, ...props }: ComboboxGroupProps): React.ReactNode;
+    displayName: string;
+};

package/dist/combobox/ComboboxGroup.d.ts

@@ -1,15 +1,10 @@
 import * as React from 'react';
 import type { ComboboxGroupContextValue, ComboboxGroupProps } from './types.js';
-export declare const ComboboxGroupProvider: {
-    (props: ComboboxGroupContextValue & {
-        children: React.ReactNode;
-    }): React.JSX.Element;
-    displayName: string;
-}, useComboboxGroupContext: (consumerName: string) => ComboboxGroupContextValue;
+export declare const ComboboxGroupProvider: React.FC<ComboboxGroupContextValue & {
+    children: React.ReactNode;
+}>, useComboboxGroupContext: (consumerName: string) => ComboboxGroupContextValue;
 /**
- * Groups related {@link ComboboxItem}s under `ComboboxGroupLabel` — automatic wiring with `aria-labelledby`.
- *
- * Critical for filtering listboxes where groups reorder/empty on every keystroke — named group is the only structure screen readers can hold on to.
+ * Groups related {@link ComboboxItem}s under a `ComboboxGroupLabel`, wired automatically with `aria-labelledby`.
  *
  * @example
  * ```tsx
@@ -19,4 +14,7 @@ export declare const ComboboxGroupProvider: {
  * </ComboboxGroup>
  * ```
  */
-export declare const ComboboxGroup: React.ForwardRefExoticComponent<Omit<ComboboxGroupProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export declare const ComboboxGroup: {
+    ({ ref: forwardedRef, ...props }: ComboboxGroupProps): React.ReactNode;
+    displayName: string;
+};

package/dist/combobox/ComboboxGroupLabel.d.cts

@@ -1,8 +1,7 @@
-import * as React from 'react';
+import type * as React from 'react';
 import type { ComboboxGroupLabelProps } from './types.cjs';
 /**
- * Heading for a ComboboxGroup. Provides the id the group's `aria-labelledby` points to.
- * Must be rendered inside a ComboboxGroup.
+ * Heading for a `ComboboxGroup`, providing the id its `aria-labelledby` points to.
  *
  * @example
  * ```tsx
@@ -12,4 +11,7 @@ import type { ComboboxGroupLabelProps } from './types.cjs';
  * </ComboboxGroup>
  * ```
  */
-export declare const ComboboxGroupLabel: React.ForwardRefExoticComponent<Omit<ComboboxGroupLabelProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export declare const ComboboxGroupLabel: {
+    ({ ref: forwardedRef, ...props }: ComboboxGroupLabelProps): React.ReactNode;
+    displayName: string;
+};

package/dist/combobox/ComboboxGroupLabel.d.ts

@@ -1,8 +1,7 @@
-import * as React from 'react';
+import type * as React from 'react';
 import type { ComboboxGroupLabelProps } from './types.js';
 /**
- * Heading for a ComboboxGroup. Provides the id the group's `aria-labelledby` points to.
- * Must be rendered inside a ComboboxGroup.
+ * Heading for a `ComboboxGroup`, providing the id its `aria-labelledby` points to.
  *
  * @example
  * ```tsx
@@ -12,4 +11,7 @@ import type { ComboboxGroupLabelProps } from './types.js';
  * </ComboboxGroup>
  * ```
  */
-export declare const ComboboxGroupLabel: React.ForwardRefExoticComponent<Omit<ComboboxGroupLabelProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export declare const ComboboxGroupLabel: {
+    ({ ref: forwardedRef, ...props }: ComboboxGroupLabelProps): React.ReactNode;
+    displayName: string;
+};

package/dist/combobox/ComboboxInput.d.cts

@@ -1,10 +1,9 @@
-import * as React from 'react';
+import type * as React from 'react';
 import type { ComboboxInputProps } from './types.cjs';
 /**
- * Text field with real DOM focus and keyboard navigation. Renders input
- * with role="combobox" and required ARIA attributes.
- *
- * Must be given an accessible name via `<label>`, `aria-label`, or
- * `aria-labelledby` — role="combobox" takes no name from content.
+ * Text field with real DOM focus and keyboard navigation, rendering `<input role="combobox">` with the required ARIA attributes.
  */
-export declare const ComboboxInput: React.ForwardRefExoticComponent<Omit<ComboboxInputProps, "ref"> & React.RefAttributes<HTMLInputElement>>;
+export declare const ComboboxInput: {
+    ({ ref: forwardedRef, shape, size, ...props }: ComboboxInputProps): React.ReactNode;
+    displayName: string;
+};

package/dist/combobox/ComboboxInput.d.ts

@@ -1,10 +1,9 @@
-import * as React from 'react';
+import type * as React from 'react';
 import type { ComboboxInputProps } from './types.js';
 /**
- * Text field with real DOM focus and keyboard navigation. Renders input
- * with role="combobox" and required ARIA attributes.
- *
- * Must be given an accessible name via `<label>`, `aria-label`, or
- * `aria-labelledby` — role="combobox" takes no name from content.
+ * Text field with real DOM focus and keyboard navigation, rendering `<input role="combobox">` with the required ARIA attributes.
  */
-export declare const ComboboxInput: React.ForwardRefExoticComponent<Omit<ComboboxInputProps, "ref"> & React.RefAttributes<HTMLInputElement>>;
+export declare const ComboboxInput: {
+    ({ ref: forwardedRef, shape, size, ...props }: ComboboxInputProps): React.ReactNode;
+    displayName: string;
+};

package/dist/combobox/ComboboxItem.d.cts

@@ -1,26 +1,17 @@
 import * as React from 'react';
 import type { ComboboxItemProps } from './types.cjs';
 /**
- * A single selectable option within {@link ComboboxContent}. Renders a
- * `<div role="option">` with `data-value`, `aria-selected`, `data-state`
- * (`"checked"` | `"unchecked"`), `data-highlighted` (virtual focus, mirrored
- * by the input's `aria-activedescendant`), and `aria-disabled`/
- * `data-disabled`. Registers
- * itself — and its text — with the root, so `ComboboxEmpty` knows when the
- * list is empty and Enter can commit the highlighted option. Click selects the
- * item, updates the input's draft text to its text, closes the listbox, and
- * refocuses the input — or, while the root is `multiple`, toggles it, clears
- * the draft text, and leaves the listbox open. Pointer hover moves the virtual
- * highlight onto it.
+ * A single selectable option within {@link ComboboxContent}, rendering a `<div role="option">` with `data-value`, `aria-selected`, `data-state`, and `data-highlighted`.
  *
- * When the root has a `filter` predicate, an item the predicate rejects
- * renders nothing at all and unregisters itself, so it is absent from the DOM
- * rather than hidden — a hidden option would still be reachable through
- * `aria-activedescendant` and would still be counted as a result.
+ * When the root has a `filter` predicate, an item the predicate rejects renders
+ * nothing and unregisters itself, rather than staying reachable while hidden.
  *
  * @example
  * ```tsx
  * <ComboboxItem value="Apple">Apple</ComboboxItem>
  * ```
  */
-export declare const ComboboxItem: React.ForwardRefExoticComponent<Omit<ComboboxItemProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export declare const ComboboxItem: {
+    ({ value, disabled, textValue, ref: forwardedRef, ...props }: ComboboxItemProps): React.ReactNode;
+    displayName: string;
+};

package/dist/combobox/ComboboxItem.d.ts

@@ -1,26 +1,17 @@
 import * as React from 'react';
 import type { ComboboxItemProps } from './types.js';
 /**
- * A single selectable option within {@link ComboboxContent}. Renders a
- * `<div role="option">` with `data-value`, `aria-selected`, `data-state`
- * (`"checked"` | `"unchecked"`), `data-highlighted` (virtual focus, mirrored
- * by the input's `aria-activedescendant`), and `aria-disabled`/
- * `data-disabled`. Registers
- * itself — and its text — with the root, so `ComboboxEmpty` knows when the
- * list is empty and Enter can commit the highlighted option. Click selects the
- * item, updates the input's draft text to its text, closes the listbox, and
- * refocuses the input — or, while the root is `multiple`, toggles it, clears
- * the draft text, and leaves the listbox open. Pointer hover moves the virtual
- * highlight onto it.
+ * A single selectable option within {@link ComboboxContent}, rendering a `<div role="option">` with `data-value`, `aria-selected`, `data-state`, and `data-highlighted`.
  *
- * When the root has a `filter` predicate, an item the predicate rejects
- * renders nothing at all and unregisters itself, so it is absent from the DOM
- * rather than hidden — a hidden option would still be reachable through
- * `aria-activedescendant` and would still be counted as a result.
+ * When the root has a `filter` predicate, an item the predicate rejects renders
+ * nothing and unregisters itself, rather than staying reachable while hidden.
  *
  * @example
  * ```tsx
  * <ComboboxItem value="Apple">Apple</ComboboxItem>
  * ```
  */
-export declare const ComboboxItem: React.ForwardRefExoticComponent<Omit<ComboboxItemProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export declare const ComboboxItem: {
+    ({ value, disabled, textValue, ref: forwardedRef, ...props }: ComboboxItemProps): React.ReactNode;
+    displayName: string;
+};

package/dist/combobox/ComboboxPortal.d.cts

@@ -1,3 +1,4 @@
+import type { JSX } from 'react';
 import type { ComboboxPortalProps } from './types.cjs';
 /**
  * Teleports its children to `document.body` or `container`, escaping
@@ -13,6 +14,6 @@ import type { ComboboxPortalProps } from './types.cjs';
  * ```
  */
 export declare const ComboboxPortal: {
-    ({ forceMount, children, ...props }: ComboboxPortalProps): import("react").JSX.Element | null;
+    ({ forceMount, children, ...props }: ComboboxPortalProps): JSX.Element | null;
     displayName: string;
 };

package/dist/combobox/ComboboxPortal.d.ts

@@ -1,3 +1,4 @@
+import type { JSX } from 'react';
 import type { ComboboxPortalProps } from './types.js';
 /**
  * Teleports its children to `document.body` or `container`, escaping
@@ -13,6 +14,6 @@ import type { ComboboxPortalProps } from './types.js';
  * ```
  */
 export declare const ComboboxPortal: {
-    ({ forceMount, children, ...props }: ComboboxPortalProps): import("react").JSX.Element | null;
+    ({ forceMount, children, ...props }: ComboboxPortalProps): JSX.Element | null;
     displayName: string;
 };

package/dist/combobox/ComboboxTrigger.d.cts

@@ -1,4 +1,4 @@
-import * as React from 'react';
+import type * as React from 'react';
 import type { ComboboxTriggerProps } from './types.cjs';
 /**
  * Optional toggle button for the listbox ("▾" affordance). Not a Tab stop
@@ -10,4 +10,7 @@ import type { ComboboxTriggerProps } from './types.cjs';
  * <ComboboxTrigger aria-label="Show options">▾</ComboboxTrigger>
  * ```
  */
-export declare const ComboboxTrigger: React.ForwardRefExoticComponent<Omit<ComboboxTriggerProps, "ref"> & React.RefAttributes<HTMLButtonElement>>;
+export declare const ComboboxTrigger: {
+    ({ ref: forwardedRef, ...props }: ComboboxTriggerProps): React.ReactNode;
+    displayName: string;
+};

package/dist/combobox/ComboboxTrigger.d.ts

@@ -1,4 +1,4 @@
-import * as React from 'react';
+import type * as React from 'react';
 import type { ComboboxTriggerProps } from './types.js';
 /**
  * Optional toggle button for the listbox ("▾" affordance). Not a Tab stop
@@ -10,4 +10,7 @@ import type { ComboboxTriggerProps } from './types.js';
  * <ComboboxTrigger aria-label="Show options">▾</ComboboxTrigger>
  * ```
  */
-export declare const ComboboxTrigger: React.ForwardRefExoticComponent<Omit<ComboboxTriggerProps, "ref"> & React.RefAttributes<HTMLButtonElement>>;
+export declare const ComboboxTrigger: {
+    ({ ref: forwardedRef, ...props }: ComboboxTriggerProps): React.ReactNode;
+    displayName: string;
+};