@skdx/react 0.28.0 → 0.30.0

package/dist/combobox/types.d.ts

@@ -13,12 +13,12 @@ export interface ComboboxOption {
      * Text shown for option; matched by filter, written back on selection.
      * @default undefined
      */
-    label?: string;
+    label?: string | undefined;
     /**
      * Excludes option from selection and pointer highlight.
      * @default false
      */
-    disabled?: boolean;
+    disabled?: boolean | undefined;
 }
 /** Labeled group of options for ComboboxProps.options. */
 export interface ComboboxOptionGroup {
@@ -29,36 +29,26 @@ export interface ComboboxOptionGroup {
 }
 /** One entry of {@link ComboboxProps.options}: a flat option, or a labeled group of them. */
 export type ComboboxOptionOrGroup = ComboboxOption | ComboboxOptionGroup;
-/**
- * Filtering strategy: 'manual' for consumer control or predicate for component filtering; numbers rank.
- */
+/** Filtering strategy: 'manual' for consumer control or predicate for component filtering; numbers rank. */
 export type ComboboxFilter = 'manual' | ((itemText: string, inputValue: string) => boolean | number);
 /** What drove a {@link Combobox} value change — the shared three-value vocabulary from `@skdx/shared`'s `change-reason` contract. */
 export type ComboboxValueChangeReason = 'keyboard' | 'pointer' | 'programmatic';
-/**
- * Payload for `onValueChange` event.
- */
+/** Payload for the `onValueChange` event. */
 export interface ComboboxValueChangeDetail {
     /** New selection (always array). */
     value: string[];
-    /** Previous selection, or null if none. */
-    previousValue: string[] | null;
+    /** Previous selection, empty when there was none. */
+    previousValue: string[];
     /** What drove the change. */
     reason: ComboboxValueChangeReason;
     /** First selected value, or null when nothing is. */
     selectedValue: string | null;
 }
-/**
- * Gesture to open listbox: 'type', 'click', or 'focus'.
- */
+/** Gesture to open listbox: 'type', 'click', or 'focus'. */
 export type ComboboxOpenOn = 'type' | 'click' | 'focus';
-/**
- * What moved highlight: 'keyboard', 'pointer', or 'auto'.
- */
+/** What moved highlight: 'keyboard', 'pointer', or 'auto'. */
 export type ComboboxHighlightReason = 'keyboard' | 'pointer' | 'auto';
-/**
- * Payload for `onHighlightChange` event.
- */
+/** Payload for the `onHighlightChange` event. */
 export interface ComboboxHighlightChangeDetail {
     /** Option value now highlighted, or null if none. */
     value: string | null;
@@ -74,7 +64,7 @@ export interface ComboboxItemEntry {
     /** The item's `textValue`, or its rendered text — matched by `filter` and written back into the input. */
     text: string;
 }
-/** @internal Shared state distributed from {@link Combobox} to its parts via context. Not part of the public API. */
+/** @internal Shared state distributed from {@link Combobox} to its parts via context. */
 export interface ComboboxContextValue {
     inputRef: React.RefObject<HTMLInputElement | null>;
     /** Optional trigger button ref for dismissal layer. */
@@ -122,9 +112,7 @@ export interface ComboboxContextValue {
     allowCustomValue: boolean;
     required: boolean;
 }
-/**
- * Forwarded ref for constraint-validation methods.
- */
+/** Forwarded ref for constraint-validation methods. */
 export type ComboboxHandle = FormValidityHandle;
 /**
  * Props for the {@link Combobox} root. Standard attributes ({@link
@@ -135,157 +123,177 @@ export interface ComboboxProps extends PassThroughProps {
      * The `ComboboxInput` and `ComboboxPortal` parts children to render.
      * @default undefined
      */
-    children?: React.ReactNode;
+    children?: React.ReactNode | undefined;
     /**
      * Selected value for controlled usage; pair with `onValueChange`.
      * @default undefined
      */
-    value?: string | string[];
+    value?: string | string[] | undefined;
     /**
      * Initially selected value for uncontrolled usage.
      * @default undefined
      */
-    defaultValue?: string | string[];
+    defaultValue?: string | string[] | undefined;
     /**
      * Fires when the selected value changes in the combobox.
      * @default undefined
      */
-    onValueChange?: (detail: ComboboxValueChangeDetail) => void;
+    onValueChange?: ((detail: ComboboxValueChangeDetail) => void) | undefined;
     /**
      * Allows multiple options selected; toggles instead of replacing.
      * @default false
      */
-    multiple?: boolean;
+    multiple?: boolean | undefined;
     /**
      * Lets Enter commit unmatched draft text as a value ("creatable").
      * @default false
      */
-    allowCustomValue?: boolean;
+    allowCustomValue?: boolean | undefined;
     /**
      * How items are filtered; 'manual' filters nothing, predicate filters and ranks.
      * @default 'manual'
      */
-    filter?: ComboboxFilter;
+    filter?: ComboboxFilter | undefined;
     /**
      * Keeps first option highlighted when list changes while open.
      * @default false
      */
-    autoHighlight?: boolean;
+    autoHighlight?: boolean | undefined;
     /**
      * Wraps arrow navigation around list ends.
      * @default true
      */
-    loop?: boolean;
+    loop?: boolean | undefined;
     /**
      * Fires when virtual focus changes; read-only, no controlled counterpart.
      * @default undefined
      */
-    onHighlightChange?: (detail: ComboboxHighlightChangeDetail) => void;
+    onHighlightChange?: ((detail: ComboboxHighlightChangeDetail) => void) | undefined;
     /**
      * Which pointer/focus gesture opens listbox on top of keyboard ones.
      * @default 'type'
      */
-    openOn?: ComboboxOpenOn;
+    openOn?: ComboboxOpenOn | undefined;
     /**
      * Marks results as in flight: aria-busy and data-loading.
      * @default false
      */
-    loading?: boolean;
+    loading?: boolean | undefined;
     /**
      * Draft text for controlled usage; pair with `onInputValueChange`.
      * @default undefined
      */
-    inputValue?: string;
+    inputValue?: string | undefined;
     /**
      * Initial draft text for uncontrolled usage.
      * @default ''
      */
-    defaultInputValue?: string;
+    defaultInputValue?: string | undefined;
     /**
      * Fires with new draft text on keystroke or when selection updates it.
      * @default undefined
      */
-    onInputValueChange?: (value: string) => void;
+    onInputValueChange?: ((value: string) => void) | undefined;
     /**
      * Whether listbox is open for controlled usage; pair with `onOpenChange`.
      * @default undefined
      */
-    open?: boolean;
+    open?: boolean | undefined;
     /**
      * Initial open state for uncontrolled usage.
      * @default false
      */
-    defaultOpen?: boolean;
+    defaultOpen?: boolean | undefined;
     /**
      * Fires with the new open state when it changes.
      * @default undefined
      */
-    onOpenChange?: (open: boolean) => void;
+    onOpenChange?: ((open: boolean) => void) | undefined;
     /**
      * Fires once the open/close animation completes.
      * @default undefined
      */
-    onOpenChangeComplete?: (open: boolean) => void;
+    onOpenChangeComplete?: ((open: boolean) => void) | undefined;
     /**
      * Marks combobox invalid: aria-invalid and data-invalid.
      * @default false
      */
-    invalid?: boolean;
+    invalid?: boolean | undefined;
     /**
      * Makes input read-only: aria-readonly and data-readonly.
      * @default false
      */
-    readOnly?: boolean;
+    readOnly?: boolean | undefined;
     /**
      * Disables combobox: disabled attribute and data-disabled.
      * @default false
      */
-    disabled?: boolean;
+    disabled?: boolean | undefined;
     /**
      * Formats the match count announcement for screen readers.
      * @default defaultGetResultCountLabel
      */
-    getResultCountLabel?: (count: number) => string;
+    getResultCountLabel?: ((count: number) => string) | undefined;
     /**
      * Form field name; mirrors selected value for form submission.
      * @default undefined
      */
-    name?: string;
+    name?: string | undefined;
     /**
      * Id of the form this combobox submits into.
      * @default undefined
      */
-    form?: string;
+    form?: string | undefined;
     /**
      * Marks combobox required; valueMissing when nothing selected.
      * @default false
      */
-    required?: boolean;
+    required?: boolean | undefined;
     /**
      * Option data (flat or grouped) to render automatically.
      * @default undefined
      */
-    options?: ComboboxOptionOrGroup[];
+    options?: ComboboxOptionOrGroup[] | undefined;
     /**
      * Custom rendering function for each option in the options list.
      * @default undefined
      */
-    renderOption?: (option: ComboboxOption, state: {
+    renderOption?: ((option: ComboboxOption, state: {
         selected: boolean;
-    }) => React.ReactNode;
+    }) => React.ReactNode) | undefined;
     /**
      * Placeholder text shown in the input when no value is selected.
      * @default undefined
      */
-    placeholder?: string;
+    placeholder?: string | undefined;
     /**
      * Accessible name for derived input and listbox.
      * @default undefined
      */
-    'aria-label'?: string;
+    'aria-label'?: string | undefined;
+    /**
+     * Corner rung the skin rounds the field by, fed to the derived `ComboboxInput`.
+     * @default undefined — the skin's own default corner.
+     */
+    shape?: 'rounded' | 'square' | (string & {}) | undefined;
+    /**
+     * Size rung the skin scales the field by, fed to the derived `ComboboxInput`.
+     * @default undefined — the skin's own default size.
+     */
+    size?: 'md' | 'sm' | 'lg' | (string & {}) | undefined;
 }
 /** Props for {@link ComboboxInput}, the text field with real DOM focus. */
-export interface ComboboxInputProps extends Omit<PrimitivePropsWithRef<'input'>, 'value' | 'defaultValue'> {
+export interface ComboboxInputProps extends Omit<PrimitivePropsWithRef<'input'>, 'value' | 'defaultValue' | 'size'> {
+    /**
+     * Corner rung the skin rounds the input by, mirrored to `data-shape`.
+     * @default undefined — the skin's own default corner.
+     */
+    shape?: 'rounded' | 'square' | (string & {}) | undefined;
+    /**
+     * Size rung the skin scales the input by, mirrored to `data-size`.
+     * @default undefined — the skin's own default size.
+     */
+    size?: 'md' | 'sm' | 'lg' | (string & {}) | undefined;
 }
 /** Props for ComboboxPortal, which teleports content to document.body. */
 export interface ComboboxPortalProps extends PortalProps {
@@ -293,37 +301,35 @@ export interface ComboboxPortalProps extends PortalProps {
      * Mounts listbox content to the DOM even when closed, enabling exit animations.
      * @default false
      */
-    forceMount?: boolean;
+    forceMount?: boolean | undefined;
 }
-/**
- * Props for ComboboxContent listbox popup.
- */
+/** Props for the ComboboxContent listbox popup. */
 export interface ComboboxContentProps extends PopperContentProps {
     /**
      * Mounts the listbox DOM even when closed, enabling exit animations.
      * @default false
      */
-    forceMount?: boolean;
+    forceMount?: boolean | undefined;
     /**
      * Fires when the Escape key is pressed while the listbox is open.
      * @default undefined
      */
-    onEscapeKeyDown?: (event: KeyboardEvent) => void;
+    onEscapeKeyDown?: ((event: KeyboardEvent) => void) | undefined;
     /**
      * Fires on pointer-down outside listbox and input.
      * @default undefined
      */
-    onPointerDownOutside?: (event: PointerEvent) => void;
+    onPointerDownOutside?: ((event: PointerEvent) => void) | undefined;
     /**
      * Fires when focus moves outside listbox and input.
      * @default undefined
      */
-    onFocusOutside?: (event: FocusOutsideEvent) => void;
+    onFocusOutside?: ((event: FocusOutsideEvent) => void) | undefined;
     /**
      * Fires when any interaction occurs outside the listbox and input.
      * @default undefined
      */
-    onInteractOutside?: (event: InteractOutsideEvent) => void;
+    onInteractOutside?: ((event: InteractOutsideEvent) => void) | undefined;
 }
 /** Props for single ComboboxItem option. */
 export interface ComboboxItemProps extends PrimitivePropsWithRef<'div'> {
@@ -333,12 +339,12 @@ export interface ComboboxItemProps extends PrimitivePropsWithRef<'div'> {
      * Excludes option from selection and pointer highlight.
      * @default false
      */
-    disabled?: boolean;
+    disabled?: boolean | undefined;
     /**
      * Text for filter matching and selection write-back to input.
      * @default undefined
      */
-    textValue?: string;
+    textValue?: string | undefined;
 }
 /** Props for ComboboxEmpty, shown when no items are rendered. */
 export interface ComboboxEmptyProps extends PrimitivePropsWithRef<'div'> {

package/dist/command/Command.cjs

@@ -1 +1,2 @@
-"use strict";var $e=Object.create;var B=Object.defineProperty;var Ue=Object.getOwnPropertyDescriptor;var Je=Object.getOwnPropertyNames;var Qe=Object.getPrototypeOf,We=Object.prototype.hasOwnProperty;var Xe=(e,o)=>{for(var t in o)B(e,t,{get:o[t],enumerable:!0})},ae=(e,o,t,i)=>{if(o&&typeof o=="object"||typeof o=="function")for(let d of Je(o))!We.call(e,d)&&d!==t&&B(e,d,{get:()=>o[d],enumerable:!(i=Ue(o,d))||i.enumerable});return e};var g=(e,o,t)=>(t=e!=null?$e(Qe(e)):{},ae(o||!e||!e.__esModule?B(t,"default",{value:e,enumerable:!0}):t,e)),Ye=e=>ae(B({},"__esModule",{value:!0}),e);var Ze={};Xe(Ze,{Command:()=>Z,CommandEmpty:()=>V,CommandGroup:()=>K,CommandInput:()=>z,CommandItem:()=>_,CommandList:()=>$,CommandLoading:()=>U,CommandProvider:()=>Te,CommandSeparator:()=>Oe,OPTION_SELECTOR:()=>D,defaultCommandFilter:()=>H,useCommandContext:()=>u});module.exports=Ye(Ze);var l=g(require("react"),1),Me=require("../utils/createContext.cjs"),we=require("../utils/part.cjs"),De=require("../utils/primitive.cjs"),P=require("../utils/scoredFilter.cjs"),Y=require("../utils/useControllableState.cjs");var me=g(require("react"),1),ie=require("../utils/part.cjs"),se=require("../utils/primitive.cjs");var de=require("react/jsx-runtime"),V=me.forwardRef((e,o)=>{let t=u("CommandEmpty");return t.loading||t.itemCount>0?null:(0,de.jsx)(se.Primitive.div,{role:"presentation",...e,...(0,ie.skdxPart)("command","empty",e.className),ref:o})});V.displayName="CommandEmpty";var F=g(require("react"),1),le=require("../utils/part.cjs"),ce=require("../utils/primitive.cjs"),x=require("react/jsx-runtime"),K=F.forwardRef(({heading:e,children:o,...t},i)=>{let d=F.useId(),r=e!=null;return(0,x.jsx)(ce.Primitive.div,{role:"group","aria-labelledby":r?d:void 0,...t,...(0,le.skdxPart)("command","group",t.className),ref:i,children:r?(0,x.jsxs)(x.Fragment,{children:[(0,x.jsx)("div",{role:"presentation",id:d,children:e}),o]}):o})});K.displayName="CommandGroup";var fe=g(require("react"),1),ue=require("../utils/part.cjs"),w=require("../utils/primitive.cjs"),pe=require("../utils/scoredFilter.cjs");var Ce=require("react/jsx-runtime"),z=fe.forwardRef((e,o)=>{let t=u("CommandInput"),i=()=>{let r=t.listRef.current;return r?(0,pe.sortByOrder)(Array.from(r.querySelectorAll(D)),t.itemOrder):[]},d=r=>{let s=i();if(s.length===0)return;let n=s.findIndex(y=>y.id===t.activeId),f=n===-1?r===1?-1:0:n,h=t.loop?(f+r+s.length)%s.length:Math.min(s.length-1,Math.max(0,f+r)),R=s[h];t.setActiveId(R.id),R.scrollIntoView?.({block:"nearest"})};return(0,Ce.jsx)(w.Primitive.input,{type:"text","aria-controls":t.listId,"aria-activedescendant":t.activeId??void 0,autoComplete:"off",...e,...(0,ue.skdxPart)("command","input",e.className),ref:o,onChange:(0,w.composeEventHandlers)(e.onChange,r=>{t.setSearch(r.target.value)}),onKeyDown:(0,w.composeEventHandlers)(e.onKeyDown,r=>{if(r.key==="ArrowDown")r.preventDefault(),d(1);else if(r.key==="ArrowUp")r.preventDefault(),d(-1);else if(r.key==="Home"||r.key==="End"){let s=i();if(s.length===0)return;r.preventDefault();let n=r.key==="Home"?s[0]:s[s.length-1];t.setActiveId(n.id),n.scrollIntoView?.({block:"nearest"})}else if(r.key==="Enter"){if(!t.activeId)return;let s=t.itemMetaRef.current.get(t.activeId);s&&!s.disabled&&(r.preventDefault(),s.onSelect?.(s.value))}})})});z.displayName="CommandInput";var S=g(require("react"),1),ye=require("../utils/part.cjs"),T=require("../utils/primitive.cjs");var ge=require("react/jsx-runtime"),_=S.forwardRef(({value:e,disabled:o,onSelect:t,keywords:i,forceMount:d=!1,...r},s)=>{let n=u("CommandItem"),f=S.useId(),h=n.activeId===f,R=n.itemOrder?.get(f),y=d||n.matches(e,i);y&&n.itemMetaRef.current.set(f,{value:e,disabled:o,onSelect:t,keywords:i});let{registerItem:N,unregisterItem:E,itemMetaRef:A}=n;if(S.useEffect(()=>{if(!y)return;let O=A.current;return N(f),()=>{E(f),O.delete(f)}},[f,y,N,E,A]),!y)return null;let Q=()=>{o||(n.setActiveId(f),t?.(e))};return(0,ge.jsx)(T.Primitive.div,{role:"option",id:f,"data-value":e,"aria-selected":h,"data-highlighted":h?"":void 0,"aria-disabled":o||void 0,"data-disabled":o?"":void 0,...r,...(0,ye.skdxPart)("command","item",r.className),ref:s,onClick:(0,T.composeEventHandlers)(r.onClick,Q),onPointerEnter:(0,T.composeEventHandlers)(r.onPointerEnter,()=>{!o&&!n.disablePointerSelection&&n.setActiveId(f)}),style:R!==void 0?{order:R,...r.style}:r.style})});_.displayName="CommandItem";var Re=g(require("react"),1),Ie=require("../utils/composeRefs.cjs"),ve=require("../utils/part.cjs"),xe=require("../utils/primitive.cjs");var Pe=require("react/jsx-runtime"),$=Re.forwardRef((e,o)=>{let t=u("CommandList"),i=(0,Ie.useComposedRefs)(o,t.listRef);return(0,Pe.jsx)(xe.Primitive.div,{role:"listbox",id:t.listId,"aria-busy":t.loading||void 0,"data-loading":t.loading?"":void 0,...e,...(0,ve.skdxPart)("command","list",e.className),ref:i})});$.displayName="CommandList";var he=g(require("react"),1),Ee=require("../utils/part.cjs"),Le=require("../utils/primitive.cjs");var be=require("react/jsx-runtime"),U=he.forwardRef((e,o)=>u("CommandLoading").loading?(0,be.jsx)(Le.Primitive.div,{role:"status",...e,...(0,Ee.skdxPart)("command","loading",e.className),ref:o}):null);U.displayName="CommandLoading";var p=require("react/jsx-runtime"),Se=({groups:e=[],placeholder:o,emptyMessage:t,loadingMessage:i,onSelect:d,renderItem:r})=>{let s=n=>{let f=n.value??n.label;return(0,p.jsx)(_,{value:f,keywords:n.keywords,disabled:n.disabled,onSelect:()=>{n.onSelect?.(),d?.(n)},children:r?r(n):n.label},f)};return(0,p.jsxs)(p.Fragment,{children:[(0,p.jsx)(z,{placeholder:o}),(0,p.jsx)($,{"aria-label":o,children:e.map(n=>n.label?(0,p.jsx)(K,{heading:n.label,children:n.items.map(s)},n.label):n.items.map(s))}),i?(0,p.jsx)(U,{children:i}):null,t?(0,p.jsx)(V,{children:t}):null]})};var J=require("react/jsx-runtime"),D='[role="option"]:not([data-disabled])';function ke(e,o){if(!e.contains(o))return;let t=e.getBoundingClientRect(),i=o.getBoundingClientRect(),d=i.top-t.top,r=i.bottom-t.bottom;d<0?e.scrollTop+=d:r>0&&(e.scrollTop+=r)}function H(e,o,t){let i=o.toLowerCase();return e.toLowerCase().includes(i)?!0:t?.some(d=>d.toLowerCase().includes(i))??!1}var[Te,u]=(0,Me.createSafeContext)("Command"),Z=l.forwardRef(({children:e,groups:o,placeholder:t,emptyMessage:i,loadingMessage:d,onSelect:r,renderItem:s,value:n,defaultValue:f,onValueChange:h,search:R,defaultSearch:y="",onSearchChange:N,filter:E,loop:A=!1,disablePointerSelection:Q=!1,loading:O=!1,...j},qe)=>{let G=l.useRef(null),k=l.useRef(new Map),[I,W]=l.useState(null),[M,ee]=l.useState(()=>new Set),[v="",te]=(0,Y.useControllableState)({prop:n,defaultProp:f??"",onChange:h}),[C="",Be]=(0,Y.useControllableState)({prop:R,defaultProp:y,onChange:N}),q=l.useRef(E);q.current=E;let L=E==="manual",Ve=l.useCallback((a,m)=>{if(L||C==="")return!0;let c=q.current;return(0,P.filterKeeps)((typeof c=="function"?c:H)(a,C,m))},[L,C]),Fe=l.useMemo(()=>L||C===""?null:(0,P.rankByScore)([...M],a=>{let m=k.current.get(a);if(!m)return null;let c=q.current,b=(typeof c=="function"?c:H)(m.value,C,m.keywords);return typeof b=="number"?b:null}),[L,C,M]),oe=l.useCallback(()=>{if(L||C==="")return null;let a=G.current;if(!a)return null;let m=Array.from(a.querySelectorAll(D),c=>c.id);return(0,P.rankByScore)(m,c=>{let b=k.current.get(c);if(!b)return null;let re=q.current,ne=(typeof re=="function"?re:H)(b.value,C,b.keywords);return typeof ne=="number"?ne:null})},[L,C]),X=l.useCallback(a=>{W(a),te(a?k.current.get(a)?.value??"":"")},[te]);l.useEffect(()=>{if(I&&M.has(I))return;let a=G.current;if(v&&a?.querySelector(`[role="option"][data-value="${CSS.escape(v)}"]`))return;let m=a?Array.from(a.querySelectorAll(D)):[],c=(0,P.sortByOrder)(m,oe())[0];X(c?.id??null),a&&c&&ke(a,c)},[M,I,X,v,oe]),l.useEffect(()=>{if(!v||I&&k.current.get(I)?.value===v)return;let a=G.current,m=a?.querySelector(`[role="option"][data-value="${CSS.escape(v)}"]`);m&&(W(m.id),a&&ke(a,m))},[v,I]);let Ke=l.useCallback(a=>{ee(m=>{if(m.has(a))return m;let c=new Set(m);return c.add(a),c})},[]),ze=l.useCallback(a=>{ee(m=>{if(!m.has(a))return m;let c=new Set(m);return c.delete(a),c}),W(m=>m===a?null:m)},[]),_e=l.useId();return(0,J.jsx)(Te,{listRef:G,listId:_e,activeId:I,itemOrder:Fe,setActiveId:X,itemMetaRef:k,registerItem:Ke,unregisterItem:ze,itemCount:M.size,search:C,setSearch:Be,matches:Ve,loop:A,disablePointerSelection:Q,loading:O,children:(0,J.jsx)(De.Primitive.div,{"data-loading":O?"":void 0,...j,...(0,we.skdxPart)("command","root",j.className),ref:qe,children:e??(0,J.jsx)(Se,{groups:o,placeholder:t,emptyMessage:i,loadingMessage:d,onSelect:r,renderItem:s})})})});Z.displayName="Command";var He=g(require("react"),1),Ne=require("../utils/part.cjs"),Ae=require("../utils/primitive.cjs"),Ge=require("react/jsx-runtime"),Oe=He.forwardRef((e,o)=>(0,Ge.jsx)(Ae.Primitive.div,{role:"separator","aria-orientation":"horizontal",...e,...(0,Ne.skdxPart)("command","separator",e.className),ref:o}));Oe.displayName="CommandSeparator";0&&(module.exports={Command,CommandEmpty,CommandGroup,CommandInput,CommandItem,CommandList,CommandLoading,CommandProvider,CommandSeparator,OPTION_SELECTOR,defaultCommandFilter,useCommandContext});
+'use client';
+"use strict";var Ve=Object.create;var H=Object.defineProperty;var Fe=Object.getOwnPropertyDescriptor;var ze=Object.getOwnPropertyNames;var Ke=Object.getPrototypeOf,_e=Object.prototype.hasOwnProperty;var $e=(o,e)=>{for(var t in e)H(o,t,{get:e[t],enumerable:!0})},ne=(o,e,t,i)=>{if(e&&typeof e=="object"||typeof e=="function")for(let d of ze(e))!_e.call(o,d)&&d!==t&&H(o,d,{get:()=>e[d],enumerable:!(i=Fe(e,d))||i.enumerable});return o};var X=(o,e,t)=>(t=o!=null?Ve(Ke(o)):{},ne(e||!o||!o.__esModule?H(t,"default",{value:o,enumerable:!0}):t,o)),Je=o=>ne(H({},"__esModule",{value:!0}),o);var Ue={};$e(Ue,{Command:()=>Z,CommandEmpty:()=>G,CommandGroup:()=>q,CommandInput:()=>B,CommandItem:()=>F,CommandList:()=>z,CommandLoading:()=>K,CommandProvider:()=>Le,CommandSeparator:()=>Me,OPTION_SELECTOR:()=>N,defaultCommandFilter:()=>Y,useCommandContext:()=>u});module.exports=Je(Ue);var c=X(require("react"),1),be=require("../utils/createContext.cjs"),Se=require("../utils/part.cjs"),ke=require("../utils/primitive.cjs"),P=require("../utils/scoredFilter.cjs"),Ee=require("../utils/useCallbackRef.cjs"),W=require("../utils/useControllableState.cjs");var ae=require("../utils/part.cjs"),me=require("../utils/primitive.cjs");var ie=require("react/jsx-runtime"),G=({ref:o,...e})=>{let t=u("CommandEmpty");return t.loading||t.itemMeta.size>0?null:(0,ie.jsx)(me.Primitive.div,{role:"presentation",...e,...(0,ae.skdxPart)("command","empty",e.className),ref:o})};G.displayName="CommandEmpty";var se=X(require("react"),1),Q=require("../utils/part.cjs"),de=require("../utils/primitive.cjs"),x=require("react/jsx-runtime"),q=({heading:o,children:e,ref:t,...i})=>{let d=se.useId(),n=o!==void 0;return(0,x.jsx)(de.Primitive.div,{role:"group","aria-labelledby":n?d:void 0,...i,...(0,Q.skdxPart)("command","group",i.className),ref:t,children:n?(0,x.jsxs)(x.Fragment,{children:[(0,x.jsx)("div",{role:"presentation",id:d,...(0,Q.skdxPart)("command","group-label"),children:o}),e]}):e})};q.displayName="CommandGroup";var le=require("../utils/part.cjs"),L=require("../utils/primitive.cjs"),ce=require("../utils/scoredFilter.cjs");var fe=require("react/jsx-runtime"),B=({ref:o,...e})=>{let t=u("CommandInput"),i=()=>{let n=t.listRef.current;return n?(0,ce.sortByOrder)(Array.from(n.querySelectorAll(N)),t.itemOrder):[]},d=n=>{let a=i();if(a.length===0)return;let l=a.findIndex(R=>R.id===t.activeId),r=l;l===-1&&(r=n===1?-1:0);let y=t.loop?(r+n+a.length)%a.length:Math.min(a.length-1,Math.max(0,r+n)),p=a[y];t.setActiveId(p.id),p.scrollIntoView?.({block:"nearest"})};return(0,fe.jsx)(L.Primitive.input,{type:"text","aria-controls":t.listId,"aria-activedescendant":t.activeId??void 0,autoComplete:"off",...e,...(0,le.skdxPart)("command","input",e.className),ref:o,value:t.search,onChange:(0,L.composeEventHandlers)(e.onChange,n=>{t.setSearch(n.target.value)}),onKeyDown:(0,L.composeEventHandlers)(e.onKeyDown,n=>{if(n.key==="ArrowDown")n.preventDefault(),d(1);else if(n.key==="ArrowUp")n.preventDefault(),d(-1);else if(n.key==="Home"||n.key==="End"){let a=i();if(a.length===0)return;n.preventDefault();let l=n.key==="Home"?a[0]:a[a.length-1];t.setActiveId(l.id),l.scrollIntoView?.({block:"nearest"})}else if(n.key==="Enter"){if(!t.activeId)return;let a=t.itemMeta.get(t.activeId);a&&!a.disabled&&(n.preventDefault(),a.onSelect?.(a.value))}})})};B.displayName="CommandInput";var V=X(require("react"),1),ue=require("../utils/part.cjs"),w=require("../utils/primitive.cjs");var pe=require("react/jsx-runtime"),F=({value:o,disabled:e,onSelect:t,keywords:i,forceMount:d=!1,ref:n,...a})=>{let l=u("CommandItem"),r=V.useId(),y=l.activeId===r,p=l.itemOrder?.get(r),R=d||l.matches(o,i);R?l.itemMeta.set(r,{value:o,disabled:e,onSelect:t,keywords:i}):l.itemMeta.delete(r);let{registerItem:M,unregisterItem:b,itemMeta:A}=l;if(V.useEffect(()=>{if(R)return M(r),()=>{b(r),A.delete(r)}},[r,R,M,b,A]),!R)return null;let $=()=>{e||(l.setActiveId(r),t?.(o))};return(0,pe.jsx)(w.Primitive.div,{role:"option",id:r,"data-value":o,"aria-selected":y,"data-highlighted":y?"":void 0,"aria-disabled":e||void 0,"data-disabled":e?"":void 0,...a,...(0,ue.skdxPart)("command","item",a.className),ref:n,onClick:(0,w.composeEventHandlers)(a.onClick,$),onPointerEnter:(0,w.composeEventHandlers)(a.onPointerEnter,()=>{!e&&!l.disablePointerSelection&&l.setActiveId(r)}),style:p!==void 0?{order:p,...a.style}:a.style})};F.displayName="CommandItem";var Ce=require("../utils/composeRefs.cjs"),ye=require("../utils/part.cjs"),ge=require("../utils/primitive.cjs");var Ie=require("react/jsx-runtime"),z=({ref:o,...e})=>{let t=u("CommandList"),i=(0,Ce.useComposedRefs)(o,t.listRef);return(0,Ie.jsx)(ge.Primitive.div,{role:"listbox",id:t.listId,"aria-busy":t.loading||void 0,"data-loading":t.loading?"":void 0,...e,...(0,ye.skdxPart)("command","list",e.className),ref:i})};z.displayName="CommandList";var Re=require("../utils/part.cjs"),ve=require("../utils/primitive.cjs");var he=require("react/jsx-runtime"),K=({ref:o,...e})=>u("CommandLoading").loading?(0,he.jsx)(ve.Primitive.div,{role:"status",...e,...(0,Re.skdxPart)("command","loading",e.className),ref:o}):null;K.displayName="CommandLoading";var C=require("react/jsx-runtime"),xe=({groups:o=[],placeholder:e,emptyMessage:t,loadingMessage:i,onSelect:d,renderItem:n})=>{let a=u("CommandAnatomy"),l=r=>{let y=r.value??r.label;return(0,C.jsx)(F,{value:y,keywords:r.keywords,disabled:r.disabled,onSelect:()=>{r.onSelect?.(),d?.(r)},children:n?n(r):r.label},y)};return(0,C.jsxs)(C.Fragment,{children:[(0,C.jsx)(B,{placeholder:e}),(0,C.jsx)(z,{"aria-label":e,children:o.map(r=>r.label!==void 0&&r.items.some(p=>a.matches(p.value??p.label,p.keywords))?(0,C.jsx)(q,{heading:r.label,children:r.items.map(l)},r.label):r.items.map(l))}),i?(0,C.jsx)(K,{children:i}):null,t?(0,C.jsx)(G,{children:t}):null]})};var _=require("react/jsx-runtime"),N='[role="option"]:not([data-disabled])';function Pe(o,e){if(!o.contains(e))return;let t=o.getBoundingClientRect(),i=e.getBoundingClientRect(),d=i.top-t.top,n=i.bottom-t.bottom;d<0?o.scrollTop+=d:n>0&&(o.scrollTop+=n)}function Y(o,e,t){let i=e.toLowerCase();return o.toLowerCase().includes(i)?!0:t?.some(d=>d.toLowerCase().includes(i))??!1}var[Le,u]=(0,be.createSafeContext)("Command"),Z=({children:o,groups:e,placeholder:t,emptyMessage:i,loadingMessage:d,onSelect:n,renderItem:a,value:l,defaultValue:r,onValueChange:y,search:p,defaultSearch:R="",onSearchChange:M,filter:b,loop:A=!1,disablePointerSelection:$=!1,loading:j=!1,ref:De,...ee})=>{let D=c.useRef(null),[I]=c.useState(()=>new Map),[v,O]=c.useState(null),[E,T]=c.useState(()=>new Set),[h="",te]=(0,W.useControllableState)({prop:l,defaultProp:r??"",onChange:y}),[g="",Oe]=(0,W.useControllableState)({prop:p,defaultProp:R,onChange:M}),S=(0,Ee.useCallbackRef)(typeof b=="function"?b:Y),k=b==="manual",Te=c.useCallback((m,s)=>k||g===""?!0:(0,P.filterKeeps)(S(m,g,s)),[k,g,S]),He=c.useMemo(()=>k||g===""?null:(0,P.rankByScore)([...E],m=>{let s=I.get(m);if(!s)return null;let f=S(s.value,g,s.keywords);return typeof f=="number"?f:null}),[k,g,E,S,I]),oe=c.useCallback(()=>{if(k||g==="")return null;let m=D.current;if(!m)return null;let s=Array.from(m.querySelectorAll(N),f=>f.id);return(0,P.rankByScore)(s,f=>{let U=I.get(f);if(!U)return null;let re=S(U.value,g,U.keywords);return typeof re=="number"?re:null})},[k,g,S,I]),J=c.useCallback(m=>{O(m),te(m?I.get(m)?.value??"":"")},[te,I]);c.useEffect(()=>{if(v&&E.has(v))return;let m=D.current;if(h&&m?.querySelector(`[role="option"][data-value="${CSS.escape(h)}"]`))return;let s=m?Array.from(m.querySelectorAll(N)):[],f=(0,P.sortByOrder)(s,oe())[0];J(f?.id??null),m&&f&&Pe(m,f)},[E,v,J,h,oe]),c.useEffect(()=>{if(!h||v&&I.get(v)?.value===h)return;let m=D.current,s=m?.querySelector(`[role="option"][data-value="${CSS.escape(h)}"]`);s&&(O(s.id),m&&Pe(m,s))},[h,v,I]);let Ge=c.useCallback(m=>{T(s=>{if(s.has(m))return s;let f=new Set(s);return f.add(m),f})},[T]),qe=c.useCallback(m=>{T(s=>{if(!s.has(m))return s;let f=new Set(s);return f.delete(m),f}),O(s=>s===m?null:s)},[T,O]),Be=c.useId();return(0,_.jsx)(Le,{listRef:D,listId:Be,activeId:v,itemOrder:He,setActiveId:J,itemMeta:I,registerItem:Ge,unregisterItem:qe,itemCount:E.size,search:g,setSearch:Oe,matches:Te,loop:A,disablePointerSelection:$,loading:j,children:(0,_.jsx)(ke.Primitive.div,{"data-loading":j?"":void 0,...ee,...(0,Se.skdxPart)("command","root",ee.className),ref:De,children:o??(0,_.jsx)(xe,{groups:e,placeholder:t,emptyMessage:i,loadingMessage:d,onSelect:n,renderItem:a})})})};Z.displayName="Command";var Ne=require("../utils/part.cjs"),we=require("../utils/primitive.cjs"),Ae=require("react/jsx-runtime"),Me=({ref:o,...e})=>(0,Ae.jsx)(we.Primitive.div,{role:"separator","aria-orientation":"horizontal",...e,...(0,Ne.skdxPart)("command","separator",e.className),ref:o});Me.displayName="CommandSeparator";0&&(module.exports={Command,CommandEmpty,CommandGroup,CommandInput,CommandItem,CommandList,CommandLoading,CommandProvider,CommandSeparator,OPTION_SELECTOR,defaultCommandFilter,useCommandContext});

package/dist/command/Command.d.cts

@@ -1,58 +1,18 @@
 import * as React from 'react';
 import type { CommandContextValue, CommandProps } from './types.cjs';
-/**
- * Command palette: not Popper-anchored, meant for a Dialog or standalone.
- * Owns search text, filters items, handles virtual focus via aria-activedescendant
- * and keyboard nav. Real focus stays on CommandInput.
- * onSelect callbacks are per-item closures kept in a mutable ref map.
- */
 export declare const OPTION_SELECTOR = "[role=\"option\"]:not([data-disabled])";
-/**
- * The built-in matcher: case-insensitive substring on the item's `value`, or on
- * any of its `keywords`.
- *
- * The keywords arm is what makes "Toggle theme" findable by typing "dark mode".
- * Matched with the same rule as the value rather than a stricter one — an alias
- * the author wrote down is a stronger signal of intent than the label, not a
- * weaker one.
- */
+/** The built-in matcher: case-insensitive substring on the item's `value`, or on any of its `keywords`. */
 export declare function defaultCommandFilter(itemValue: string, search: string, keywords?: readonly string[]): boolean;
 /**
- * Reads the palette state a {@link Command} root publishes to its
- * parts: the search string and the `matches` filter derived from it, the active
- * item id that `CommandInput` points `aria-activedescendant` at, the list
- * element and its id, the item registry behind `itemCount`, and `loading`.
- *
- * `CommandList`, `CommandItem`, `CommandInput`, `CommandEmpty` and
- * `CommandLoading` each read it under their own name, which is the name the
- * hook puts in the error it throws when one of them is rendered outside a
- * `Command` — an unfiltered, unregistered item is worse than a hard failure.
- * Not part of the public API.
+ * Reads the palette state a {@link Command} root publishes to its parts.
  *
  * @internal
  */
-export declare const CommandProvider: {
-    (props: CommandContextValue & {
-        children: React.ReactNode;
-    }): React.JSX.Element;
-    displayName: string;
-}, useCommandContext: (consumerName: string) => CommandContextValue;
+export declare const CommandProvider: React.FC<CommandContextValue & {
+    children: React.ReactNode;
+}>, useCommandContext: (consumerName: string) => CommandContextValue;
 /**
- * Root of a cmdk-style command palette: owns virtual focus
- * (`aria-activedescendant`-based, so real DOM focus always stays on
- * `CommandInput`) and item bookkeeping, and hands both down to
- * `CommandInput` / `CommandList` / `CommandEmpty` / `CommandGroup` /
- * `CommandItem` / `CommandSeparator` via context. Renders a plain `<div>`.
- *
- * Not popper-anchored — mount it inside a `Dialog` for a classic ⌘K palette,
- * or render it standalone.
- *
- * `CommandInput` writes what the user types into the root's `search`, and the
- * root filters its own items with a case-insensitive substring match on each
- * item's `value`. Pass `filter` to replace the matcher, or `filter="manual"`
- * to go back to mounting only the matching items yourself. `value` names the
- * highlighted item and is controllable, and `loading` mounts `CommandLoading`
- * while keeping `CommandEmpty` hidden.
+ * Root of a cmdk-style command palette: owns virtual focus (`aria-activedescendant`-based, so real DOM focus stays on `CommandInput`) and item bookkeeping, renders a plain `<div>`.
  *
  * @example
  * ```tsx
@@ -76,4 +36,7 @@ export declare const CommandProvider: {
  * }
  * ```
  */
-export declare const Command: React.ForwardRefExoticComponent<Omit<CommandProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export declare const Command: {
+    ({ children, groups, placeholder, emptyMessage, loadingMessage, onSelect, renderItem, value: valueProp, defaultValue, onValueChange, search: searchProp, defaultSearch, onSearchChange, filter, loop, disablePointerSelection, loading, ref: forwardedRef, ...props }: CommandProps): React.ReactNode;
+    displayName: string;
+};

package/dist/command/Command.d.ts

@@ -1,58 +1,18 @@
 import * as React from 'react';
 import type { CommandContextValue, CommandProps } from './types.js';
-/**
- * Command palette: not Popper-anchored, meant for a Dialog or standalone.
- * Owns search text, filters items, handles virtual focus via aria-activedescendant
- * and keyboard nav. Real focus stays on CommandInput.
- * onSelect callbacks are per-item closures kept in a mutable ref map.
- */
 export declare const OPTION_SELECTOR = "[role=\"option\"]:not([data-disabled])";
-/**
- * The built-in matcher: case-insensitive substring on the item's `value`, or on
- * any of its `keywords`.
- *
- * The keywords arm is what makes "Toggle theme" findable by typing "dark mode".
- * Matched with the same rule as the value rather than a stricter one — an alias
- * the author wrote down is a stronger signal of intent than the label, not a
- * weaker one.
- */
+/** The built-in matcher: case-insensitive substring on the item's `value`, or on any of its `keywords`. */
 export declare function defaultCommandFilter(itemValue: string, search: string, keywords?: readonly string[]): boolean;
 /**
- * Reads the palette state a {@link Command} root publishes to its
- * parts: the search string and the `matches` filter derived from it, the active
- * item id that `CommandInput` points `aria-activedescendant` at, the list
- * element and its id, the item registry behind `itemCount`, and `loading`.
- *
- * `CommandList`, `CommandItem`, `CommandInput`, `CommandEmpty` and
- * `CommandLoading` each read it under their own name, which is the name the
- * hook puts in the error it throws when one of them is rendered outside a
- * `Command` — an unfiltered, unregistered item is worse than a hard failure.
- * Not part of the public API.
+ * Reads the palette state a {@link Command} root publishes to its parts.
  *
  * @internal
  */
-export declare const CommandProvider: {
-    (props: CommandContextValue & {
-        children: React.ReactNode;
-    }): React.JSX.Element;
-    displayName: string;
-}, useCommandContext: (consumerName: string) => CommandContextValue;
+export declare const CommandProvider: React.FC<CommandContextValue & {
+    children: React.ReactNode;
+}>, useCommandContext: (consumerName: string) => CommandContextValue;
 /**
- * Root of a cmdk-style command palette: owns virtual focus
- * (`aria-activedescendant`-based, so real DOM focus always stays on
- * `CommandInput`) and item bookkeeping, and hands both down to
- * `CommandInput` / `CommandList` / `CommandEmpty` / `CommandGroup` /
- * `CommandItem` / `CommandSeparator` via context. Renders a plain `<div>`.
- *
- * Not popper-anchored — mount it inside a `Dialog` for a classic ⌘K palette,
- * or render it standalone.
- *
- * `CommandInput` writes what the user types into the root's `search`, and the
- * root filters its own items with a case-insensitive substring match on each
- * item's `value`. Pass `filter` to replace the matcher, or `filter="manual"`
- * to go back to mounting only the matching items yourself. `value` names the
- * highlighted item and is controllable, and `loading` mounts `CommandLoading`
- * while keeping `CommandEmpty` hidden.
+ * Root of a cmdk-style command palette: owns virtual focus (`aria-activedescendant`-based, so real DOM focus stays on `CommandInput`) and item bookkeeping, renders a plain `<div>`.
  *
  * @example
  * ```tsx
@@ -76,4 +36,7 @@ export declare const CommandProvider: {
  * }
  * ```
  */
-export declare const Command: React.ForwardRefExoticComponent<Omit<CommandProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export declare const Command: {
+    ({ children, groups, placeholder, emptyMessage, loadingMessage, onSelect, renderItem, value: valueProp, defaultValue, onValueChange, search: searchProp, defaultSearch, onSearchChange, filter, loop, disablePointerSelection, loading, ref: forwardedRef, ...props }: CommandProps): React.ReactNode;
+    displayName: string;
+};

package/dist/command/Command.js

@@ -1 +1,2 @@
-import*as s from"react";import{createSafeContext as Ve}from"../utils/createContext.js";import{skdxPart as Fe}from"../utils/part.js";import{Primitive as Ke}from"../utils/primitive.js";import{filterKeeps as ze,rankByScore as ae,sortByOrder as _e}from"../utils/scoredFilter.js";import{useControllableState as me}from"../utils/useControllableState.js";import*as Y from"react";import{skdxPart as ge}from"../utils/part.js";import{Primitive as Re}from"../utils/primitive.js";import{jsx as Ie}from"react/jsx-runtime";var q=Y.forwardRef((o,n)=>{let e=p("CommandEmpty");return e.loading||e.itemCount>0?null:Ie(Re.div,{role:"presentation",...o,...ge("command","empty",o.className),ref:n})});q.displayName="CommandEmpty";import*as T from"react";import{skdxPart as ve}from"../utils/part.js";import{Primitive as xe}from"../utils/primitive.js";import{Fragment as Pe,jsx as Z,jsxs as he}from"react/jsx-runtime";var B=T.forwardRef(({heading:o,children:n,...e},d)=>{let f=T.useId(),t=o!=null;return Z(xe.div,{role:"group","aria-labelledby":t?f:void 0,...e,...ve("command","group",e.className),ref:d,children:t?he(Pe,{children:[Z("div",{role:"presentation",id:f,children:o}),n]}):n})});B.displayName="CommandGroup";import*as ee from"react";import{skdxPart as Ee}from"../utils/part.js";import{composeEventHandlers as j,Primitive as Le}from"../utils/primitive.js";import{sortByOrder as be}from"../utils/scoredFilter.js";import{jsx as Se}from"react/jsx-runtime";var V=ee.forwardRef((o,n)=>{let e=p("CommandInput"),d=()=>{let t=e.listRef.current;return t?be(Array.from(t.querySelectorAll(H)),e.itemOrder):[]},f=t=>{let i=d();if(i.length===0)return;let r=i.findIndex(C=>C.id===e.activeId),c=r===-1?t===1?-1:0:r,I=e.loop?(c+t+i.length)%i.length:Math.min(i.length-1,Math.max(0,c+t)),y=i[I];e.setActiveId(y.id),y.scrollIntoView?.({block:"nearest"})};return Se(Le.input,{type:"text","aria-controls":e.listId,"aria-activedescendant":e.activeId??void 0,autoComplete:"off",...o,...Ee("command","input",o.className),ref:n,onChange:j(o.onChange,t=>{e.setSearch(t.target.value)}),onKeyDown:j(o.onKeyDown,t=>{if(t.key==="ArrowDown")t.preventDefault(),f(1);else if(t.key==="ArrowUp")t.preventDefault(),f(-1);else if(t.key==="Home"||t.key==="End"){let i=d();if(i.length===0)return;t.preventDefault();let r=t.key==="Home"?i[0]:i[i.length-1];e.setActiveId(r.id),r.scrollIntoView?.({block:"nearest"})}else if(t.key==="Enter"){if(!e.activeId)return;let i=e.itemMetaRef.current.get(e.activeId);i&&!i.disabled&&(t.preventDefault(),i.onSelect?.(i.value))}})})});V.displayName="CommandInput";import*as h from"react";import{skdxPart as ke}from"../utils/part.js";import{composeEventHandlers as te,Primitive as Me}from"../utils/primitive.js";import{jsx as we}from"react/jsx-runtime";var F=h.forwardRef(({value:o,disabled:n,onSelect:e,keywords:d,forceMount:f=!1,...t},i)=>{let r=p("CommandItem"),c=h.useId(),I=r.activeId===c,y=r.itemOrder?.get(c),C=f||r.matches(o,d);C&&r.itemMetaRef.current.set(c,{value:o,disabled:n,onSelect:e,keywords:d});let{registerItem:S,unregisterItem:v,itemMetaRef:k}=r;if(h.useEffect(()=>{if(!C)return;let M=k.current;return S(c),()=>{v(c),M.delete(c)}},[c,C,S,v,k]),!C)return null;let A=()=>{n||(r.setActiveId(c),e?.(o))};return we(Me.div,{role:"option",id:c,"data-value":o,"aria-selected":I,"data-highlighted":I?"":void 0,"aria-disabled":n||void 0,"data-disabled":n?"":void 0,...t,...ke("command","item",t.className),ref:i,onClick:te(t.onClick,A),onPointerEnter:te(t.onPointerEnter,()=>{!n&&!r.disablePointerSelection&&r.setActiveId(c)}),style:y!==void 0?{order:y,...t.style}:t.style})});F.displayName="CommandItem";import*as oe from"react";import{useComposedRefs as De}from"../utils/composeRefs.js";import{skdxPart as Te}from"../utils/part.js";import{Primitive as He}from"../utils/primitive.js";import{jsx as Ne}from"react/jsx-runtime";var K=oe.forwardRef((o,n)=>{let e=p("CommandList"),d=De(n,e.listRef);return Ne(He.div,{role:"listbox",id:e.listId,"aria-busy":e.loading||void 0,"data-loading":e.loading?"":void 0,...o,...Te("command","list",o.className),ref:d})});K.displayName="CommandList";import*as re from"react";import{skdxPart as Ae}from"../utils/part.js";import{Primitive as Oe}from"../utils/primitive.js";import{jsx as Ge}from"react/jsx-runtime";var z=re.forwardRef((o,n)=>p("CommandLoading").loading?Ge(Oe.div,{role:"status",...o,...Ae("command","loading",o.className),ref:n}):null);z.displayName="CommandLoading";import{Fragment as qe,jsx as E,jsxs as Be}from"react/jsx-runtime";var ne=({groups:o=[],placeholder:n,emptyMessage:e,loadingMessage:d,onSelect:f,renderItem:t})=>{let i=r=>{let c=r.value??r.label;return E(F,{value:c,keywords:r.keywords,disabled:r.disabled,onSelect:()=>{r.onSelect?.(),f?.(r)},children:t?t(r):r.label},c)};return Be(qe,{children:[E(V,{placeholder:n}),E(K,{"aria-label":n,children:o.map(r=>r.label?E(B,{heading:r.label,children:r.items.map(i)},r.label):r.items.map(i))}),d?E(z,{children:d}):null,e?E(q,{children:e}):null]})};import{jsx as _}from"react/jsx-runtime";var H='[role="option"]:not([data-disabled])';function ie(o,n){if(!o.contains(n))return;let e=o.getBoundingClientRect(),d=n.getBoundingClientRect(),f=d.top-e.top,t=d.bottom-e.bottom;f<0?o.scrollTop+=f:t>0&&(o.scrollTop+=t)}function N(o,n,e){let d=n.toLowerCase();return o.toLowerCase().includes(d)?!0:e?.some(f=>f.toLowerCase().includes(d))??!1}var[$e,p]=Ve("Command"),se=s.forwardRef(({children:o,groups:n,placeholder:e,emptyMessage:d,loadingMessage:f,onSelect:t,renderItem:i,value:r,defaultValue:c,onValueChange:I,search:y,defaultSearch:C="",onSearchChange:S,filter:v,loop:k=!1,disablePointerSelection:A=!1,loading:M=!1,...$},le)=>{let w=s.useRef(null),L=s.useRef(new Map),[g,O]=s.useState(null),[b,U]=s.useState(()=>new Set),[R="",J]=me({prop:r,defaultProp:c??"",onChange:I}),[u="",ce]=me({prop:y,defaultProp:C,onChange:S}),D=s.useRef(v);D.current=v;let x=v==="manual",fe=s.useCallback((a,m)=>{if(x||u==="")return!0;let l=D.current;return ze((typeof l=="function"?l:N)(a,u,m))},[x,u]),ue=s.useMemo(()=>x||u===""?null:ae([...b],a=>{let m=L.current.get(a);if(!m)return null;let l=D.current,P=(typeof l=="function"?l:N)(m.value,u,m.keywords);return typeof P=="number"?P:null}),[x,u,b]),Q=s.useCallback(()=>{if(x||u==="")return null;let a=w.current;if(!a)return null;let m=Array.from(a.querySelectorAll(H),l=>l.id);return ae(m,l=>{let P=L.current.get(l);if(!P)return null;let W=D.current,X=(typeof W=="function"?W:N)(P.value,u,P.keywords);return typeof X=="number"?X:null})},[x,u]),G=s.useCallback(a=>{O(a),J(a?L.current.get(a)?.value??"":"")},[J]);s.useEffect(()=>{if(g&&b.has(g))return;let a=w.current;if(R&&a?.querySelector(`[role="option"][data-value="${CSS.escape(R)}"]`))return;let m=a?Array.from(a.querySelectorAll(H)):[],l=_e(m,Q())[0];G(l?.id??null),a&&l&&ie(a,l)},[b,g,G,R,Q]),s.useEffect(()=>{if(!R||g&&L.current.get(g)?.value===R)return;let a=w.current,m=a?.querySelector(`[role="option"][data-value="${CSS.escape(R)}"]`);m&&(O(m.id),a&&ie(a,m))},[R,g]);let pe=s.useCallback(a=>{U(m=>{if(m.has(a))return m;let l=new Set(m);return l.add(a),l})},[]),Ce=s.useCallback(a=>{U(m=>{if(!m.has(a))return m;let l=new Set(m);return l.delete(a),l}),O(m=>m===a?null:m)},[]),ye=s.useId();return _($e,{listRef:w,listId:ye,activeId:g,itemOrder:ue,setActiveId:G,itemMetaRef:L,registerItem:pe,unregisterItem:Ce,itemCount:b.size,search:u,setSearch:ce,matches:fe,loop:k,disablePointerSelection:A,loading:M,children:_(Ke.div,{"data-loading":M?"":void 0,...$,...Fe("command","root",$.className),ref:le,children:o??_(ne,{groups:n,placeholder:e,emptyMessage:d,loadingMessage:f,onSelect:t,renderItem:i})})})});se.displayName="Command";import*as de from"react";import{skdxPart as Ue}from"../utils/part.js";import{Primitive as Je}from"../utils/primitive.js";import{jsx as We}from"react/jsx-runtime";var Qe=de.forwardRef((o,n)=>We(Je.div,{role:"separator","aria-orientation":"horizontal",...o,...Ue("command","separator",o.className),ref:n}));Qe.displayName="CommandSeparator";export{se as Command,q as CommandEmpty,B as CommandGroup,V as CommandInput,F as CommandItem,K as CommandList,z as CommandLoading,$e as CommandProvider,Qe as CommandSeparator,H as OPTION_SELECTOR,N as defaultCommandFilter,p as useCommandContext};
+'use client';
+import*as l from"react";import{createSafeContext as Oe}from"../utils/createContext.js";import{skdxPart as Te}from"../utils/part.js";import{Primitive as He}from"../utils/primitive.js";import{filterKeeps as Ge,rankByScore as ee,sortByOrder as qe}from"../utils/scoredFilter.js";import{useCallbackRef as Be}from"../utils/useCallbackRef.js";import{useControllableState as te}from"../utils/useControllableState.js";import{skdxPart as fe}from"../utils/part.js";import{Primitive as ue}from"../utils/primitive.js";import{jsx as pe}from"react/jsx-runtime";var H=({ref:n,...t})=>{let e=u("CommandEmpty");return e.loading||e.itemMeta.size>0?null:pe(ue.div,{role:"presentation",...t,...fe("command","empty",t.className),ref:n})};H.displayName="CommandEmpty";import*as W from"react";import{skdxPart as X}from"../utils/part.js";import{Primitive as Ce}from"../utils/primitive.js";import{Fragment as ye,jsx as Q,jsxs as ge}from"react/jsx-runtime";var G=({heading:n,children:t,ref:e,...s})=>{let c=W.useId(),r=n!==void 0;return Q(Ce.div,{role:"group","aria-labelledby":r?c:void 0,...s,...X("command","group",s.className),ref:e,children:r?ge(ye,{children:[Q("div",{role:"presentation",id:c,...X("command","group-label"),children:n}),t]}):t})};G.displayName="CommandGroup";import{skdxPart as Ie}from"../utils/part.js";import{composeEventHandlers as Y,Primitive as Re}from"../utils/primitive.js";import{sortByOrder as ve}from"../utils/scoredFilter.js";import{jsx as he}from"react/jsx-runtime";var q=({ref:n,...t})=>{let e=u("CommandInput"),s=()=>{let r=e.listRef.current;return r?ve(Array.from(r.querySelectorAll(M)),e.itemOrder):[]},c=r=>{let a=s();if(a.length===0)return;let d=a.findIndex(I=>I.id===e.activeId),o=d;d===-1&&(o=r===1?-1:0);let C=e.loop?(o+r+a.length)%a.length:Math.min(a.length-1,Math.max(0,o+r)),p=a[C];e.setActiveId(p.id),p.scrollIntoView?.({block:"nearest"})};return he(Re.input,{type:"text","aria-controls":e.listId,"aria-activedescendant":e.activeId??void 0,autoComplete:"off",...t,...Ie("command","input",t.className),ref:n,value:e.search,onChange:Y(t.onChange,r=>{e.setSearch(r.target.value)}),onKeyDown:Y(t.onKeyDown,r=>{if(r.key==="ArrowDown")r.preventDefault(),c(1);else if(r.key==="ArrowUp")r.preventDefault(),c(-1);else if(r.key==="Home"||r.key==="End"){let a=s();if(a.length===0)return;r.preventDefault();let d=r.key==="Home"?a[0]:a[a.length-1];e.setActiveId(d.id),d.scrollIntoView?.({block:"nearest"})}else if(r.key==="Enter"){if(!e.activeId)return;let a=e.itemMeta.get(e.activeId);a&&!a.disabled&&(r.preventDefault(),a.onSelect?.(a.value))}})})};q.displayName="CommandInput";import*as A from"react";import{skdxPart as xe}from"../utils/part.js";import{composeEventHandlers as Z,Primitive as Pe}from"../utils/primitive.js";import{jsx as be}from"react/jsx-runtime";var B=({value:n,disabled:t,onSelect:e,keywords:s,forceMount:c=!1,ref:r,...a})=>{let d=u("CommandItem"),o=A.useId(),C=d.activeId===o,p=d.itemOrder?.get(o),I=c||d.matches(n,s);I?d.itemMeta.set(o,{value:n,disabled:t,onSelect:e,keywords:s}):d.itemMeta.delete(o);let{registerItem:k,unregisterItem:h,itemMeta:E}=d;if(A.useEffect(()=>{if(I)return k(o),()=>{h(o),E.delete(o)}},[o,I,k,h,E]),!I)return null;let D=()=>{t||(d.setActiveId(o),e?.(n))};return be(Pe.div,{role:"option",id:o,"data-value":n,"aria-selected":C,"data-highlighted":C?"":void 0,"aria-disabled":t||void 0,"data-disabled":t?"":void 0,...a,...xe("command","item",a.className),ref:r,onClick:Z(a.onClick,D),onPointerEnter:Z(a.onPointerEnter,()=>{!t&&!d.disablePointerSelection&&d.setActiveId(o)}),style:p!==void 0?{order:p,...a.style}:a.style})};B.displayName="CommandItem";import{useComposedRefs as Se}from"../utils/composeRefs.js";import{skdxPart as ke}from"../utils/part.js";import{Primitive as Ee}from"../utils/primitive.js";import{jsx as Le}from"react/jsx-runtime";var V=({ref:n,...t})=>{let e=u("CommandList"),s=Se(n,e.listRef);return Le(Ee.div,{role:"listbox",id:e.listId,"aria-busy":e.loading||void 0,"data-loading":e.loading?"":void 0,...t,...ke("command","list",t.className),ref:s})};V.displayName="CommandList";import{skdxPart as Ne}from"../utils/part.js";import{Primitive as we}from"../utils/primitive.js";import{jsx as Me}from"react/jsx-runtime";var F=({ref:n,...t})=>u("CommandLoading").loading?Me(we.div,{role:"status",...t,...Ne("command","loading",t.className),ref:n}):null;F.displayName="CommandLoading";import{Fragment as Ae,jsx as b,jsxs as De}from"react/jsx-runtime";var j=({groups:n=[],placeholder:t,emptyMessage:e,loadingMessage:s,onSelect:c,renderItem:r})=>{let a=u("CommandAnatomy"),d=o=>{let C=o.value??o.label;return b(B,{value:C,keywords:o.keywords,disabled:o.disabled,onSelect:()=>{o.onSelect?.(),c?.(o)},children:r?r(o):o.label},C)};return De(Ae,{children:[b(q,{placeholder:t}),b(V,{"aria-label":t,children:n.map(o=>o.label!==void 0&&o.items.some(p=>a.matches(p.value??p.label,p.keywords))?b(G,{heading:o.label,children:o.items.map(d)},o.label):o.items.map(d))}),s?b(F,{children:s}):null,e?b(H,{children:e}):null]})};import{jsx as z}from"react/jsx-runtime";var M='[role="option"]:not([data-disabled])';function oe(n,t){if(!n.contains(t))return;let e=n.getBoundingClientRect(),s=t.getBoundingClientRect(),c=s.top-e.top,r=s.bottom-e.bottom;c<0?n.scrollTop+=c:r>0&&(n.scrollTop+=r)}function re(n,t,e){let s=t.toLowerCase();return n.toLowerCase().includes(s)?!0:e?.some(c=>c.toLowerCase().includes(s))??!1}var[Ve,u]=Oe("Command"),ne=({children:n,groups:t,placeholder:e,emptyMessage:s,loadingMessage:c,onSelect:r,renderItem:a,value:d,defaultValue:o,onValueChange:C,search:p,defaultSearch:I="",onSearchChange:k,filter:h,loop:E=!1,disablePointerSelection:D=!1,loading:K=!1,ref:ae,..._})=>{let L=l.useRef(null),[g]=l.useState(()=>new Map),[R,N]=l.useState(null),[S,w]=l.useState(()=>new Set),[v="",$]=te({prop:d,defaultProp:o??"",onChange:C}),[y="",me]=te({prop:p,defaultProp:I,onChange:k}),x=Be(typeof h=="function"?h:re),P=h==="manual",ie=l.useCallback((m,i)=>P||y===""?!0:Ge(x(m,y,i)),[P,y,x]),se=l.useMemo(()=>P||y===""?null:ee([...S],m=>{let i=g.get(m);if(!i)return null;let f=x(i.value,y,i.keywords);return typeof f=="number"?f:null}),[P,y,S,x,g]),J=l.useCallback(()=>{if(P||y==="")return null;let m=L.current;if(!m)return null;let i=Array.from(m.querySelectorAll(M),f=>f.id);return ee(i,f=>{let T=g.get(f);if(!T)return null;let U=x(T.value,y,T.keywords);return typeof U=="number"?U:null})},[P,y,x,g]),O=l.useCallback(m=>{N(m),$(m?g.get(m)?.value??"":"")},[$,g]);l.useEffect(()=>{if(R&&S.has(R))return;let m=L.current;if(v&&m?.querySelector(`[role="option"][data-value="${CSS.escape(v)}"]`))return;let i=m?Array.from(m.querySelectorAll(M)):[],f=qe(i,J())[0];O(f?.id??null),m&&f&&oe(m,f)},[S,R,O,v,J]),l.useEffect(()=>{if(!v||R&&g.get(R)?.value===v)return;let m=L.current,i=m?.querySelector(`[role="option"][data-value="${CSS.escape(v)}"]`);i&&(N(i.id),m&&oe(m,i))},[v,R,g]);let de=l.useCallback(m=>{w(i=>{if(i.has(m))return i;let f=new Set(i);return f.add(m),f})},[w]),le=l.useCallback(m=>{w(i=>{if(!i.has(m))return i;let f=new Set(i);return f.delete(m),f}),N(i=>i===m?null:i)},[w,N]),ce=l.useId();return z(Ve,{listRef:L,listId:ce,activeId:R,itemOrder:se,setActiveId:O,itemMeta:g,registerItem:de,unregisterItem:le,itemCount:S.size,search:y,setSearch:me,matches:ie,loop:E,disablePointerSelection:D,loading:K,children:z(He.div,{"data-loading":K?"":void 0,..._,...Te("command","root",_.className),ref:ae,children:n??z(j,{groups:t,placeholder:e,emptyMessage:s,loadingMessage:c,onSelect:r,renderItem:a})})})};ne.displayName="Command";import{skdxPart as Fe}from"../utils/part.js";import{Primitive as ze}from"../utils/primitive.js";import{jsx as _e}from"react/jsx-runtime";var Ke=({ref:n,...t})=>_e(ze.div,{role:"separator","aria-orientation":"horizontal",...t,...Fe("command","separator",t.className),ref:n});Ke.displayName="CommandSeparator";export{ne as Command,H as CommandEmpty,G as CommandGroup,q as CommandInput,B as CommandItem,V as CommandList,F as CommandLoading,Ve as CommandProvider,Ke as CommandSeparator,M as OPTION_SELECTOR,re as defaultCommandFilter,u as useCommandContext};

package/dist/command/CommandAnatomy.d.cts

@@ -1,17 +1,11 @@
 import type * as React from 'react';
 import type { CommandGroup as CommandGroupData, CommandItem as CommandItemData } from './types.cjs';
-/**
- * The anatomy a {@link Command} draws from `groups`: the search input, the list
- * holding one `CommandItem` per command wrapped in a `CommandGroup` wherever a group carries
- * a label, and the loading and empty states beside it.
- *
- * @internal
- */
+/** @internal The anatomy a {@link Command} draws from `groups`. */
 export declare const CommandAnatomy: ({ groups, placeholder, emptyMessage, loadingMessage, onSelect, renderItem, }: {
-    groups?: CommandGroupData[];
-    placeholder?: string;
-    emptyMessage?: string;
-    loadingMessage?: string;
-    onSelect?: (item: CommandItemData) => void;
-    renderItem?: (item: CommandItemData) => React.ReactNode;
+    groups?: CommandGroupData[] | undefined;
+    placeholder?: string | undefined;
+    emptyMessage?: string | undefined;
+    loadingMessage?: string | undefined;
+    onSelect?: ((item: CommandItemData) => void) | undefined;
+    renderItem?: ((item: CommandItemData) => React.ReactNode) | undefined;
 }) => React.JSX.Element;

package/dist/command/CommandAnatomy.d.ts

@@ -1,17 +1,11 @@
 import type * as React from 'react';
 import type { CommandGroup as CommandGroupData, CommandItem as CommandItemData } from './types.js';
-/**
- * The anatomy a {@link Command} draws from `groups`: the search input, the list
- * holding one `CommandItem` per command wrapped in a `CommandGroup` wherever a group carries
- * a label, and the loading and empty states beside it.
- *
- * @internal
- */
+/** @internal The anatomy a {@link Command} draws from `groups`. */
 export declare const CommandAnatomy: ({ groups, placeholder, emptyMessage, loadingMessage, onSelect, renderItem, }: {
-    groups?: CommandGroupData[];
-    placeholder?: string;
-    emptyMessage?: string;
-    loadingMessage?: string;
-    onSelect?: (item: CommandItemData) => void;
-    renderItem?: (item: CommandItemData) => React.ReactNode;
+    groups?: CommandGroupData[] | undefined;
+    placeholder?: string | undefined;
+    emptyMessage?: string | undefined;
+    loadingMessage?: string | undefined;
+    onSelect?: ((item: CommandItemData) => void) | undefined;
+    renderItem?: ((item: CommandItemData) => React.ReactNode) | undefined;
 }) => React.JSX.Element;