@spark-ui/combobox - npm Package Compare versions

Comparing version 0.3.3 to 0.3.4

CHANGELOG.md

@@ -6,2 +6,6 @@ # Change Log
 
+## [0.3.4](https://github.com/adevinta/spark/compare/@spark-ui/combobox@0.3.3...@spark-ui/combobox@0.3.4) (2024-03-06)
+
+**Note:** Version bump only for package @spark-ui/combobox
+
 ## [0.3.3](https://github.com/adevinta/spark/compare/@spark-ui/combobox@0.3.2...@spark-ui/combobox@0.3.3) (2024-03-01)
@@ -8,0 +12,0 @@

dist/index.js

@@ -1,1 +0,1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react"),k=require("@radix-ui/react-id"),Ue=require("@spark-ui/form-field"),_=require("@spark-ui/popover"),y=require("downshift"),R=require("@spark-ui/icon"),xe=require("@spark-ui/visually-hidden"),b=require("class-variance-authority"),We=({allowCustomValue:t,updateInputValue:n,selectedItems:s,removeSelectedItem:a,addSelectedItem:r})=>(l,{changes:o,type:i})=>{switch(i){case y.useCombobox.stateChangeTypes.InputChange:return n(o.inputValue),o;case y.useCombobox.stateChangeTypes.InputBlur:return t?o:(n(""),{...o,inputValue:""});case y.useCombobox.stateChangeTypes.InputKeyDownEnter:case y.useCombobox.stateChangeTypes.ItemClick:return o.selectedItem!=null&&(n(""),s.some(c=>c.value===o.selectedItem?.value)?a(o.selectedItem):r(o.selectedItem)),{...o,isOpen:!0,highlightedIndex:l.highlightedIndex};default:return o}},Je=({itemsMap:t,updateInputValue:n,allowCustomValue:s})=>(a,{changes:r,type:l})=>{const o=[...t.values()].find(c=>c.text.toLowerCase()===a.inputValue.toLowerCase()),i=a.selectedItem?.text||"";switch(l){case y.useCombobox.stateChangeTypes.InputChange:return n(r.inputValue),r;case y.useCombobox.stateChangeTypes.InputKeyDownEnter:case y.useCombobox.stateChangeTypes.ItemClick:return r.selectedItem&&n(r.inputValue),r;case y.useCombobox.stateChangeTypes.InputBlur:return s?r:a.inputValue===""?{...r,selectedItem:null}:o?(n(o.text),{...r,selectedItem:o,inputValue:o.text}):(n(i),{...r,inputValue:i});default:return r}},Qe=(t,n)=>{const s=((a,r)=>{let l=0;for(const o of a.keys()){if(l===r)return o;l++}})(t,n);return s!==void 0?t.get(s):void 0},K=t=>t?t.type.displayName:"",ye=(t,n=[])=>(e.Children.forEach(t,s=>{if(e.isValidElement(s)){if(K(s)==="Combobox.Item"){const a=s.props;n.push({value:a.value,disabled:!!a.disabled,text:G(a.children)})}s.props.children&&ye(s.props.children,n)}}),n),G=(t,n="")=>typeof t=="string"?t:(e.Children.forEach(t,s=>{e.isValidElement(s)&&(K(s)==="Combobox.ItemText"&&(n=s.props.children),s.props.children&&G(s.props.children,n))}),n),pe=t=>{const n=new Map;return ye(t).forEach(s=>{n.set(s.value,s)}),n},Ie=(t,n)=>e.Children.toArray(t).some(s=>!!e.isValidElement(s)&&(K(s)===n||!!s.props.children&&Ie(s.props.children,n))),Ce=e.createContext(null),fe=(t,n)=>n?new Map(Array.from(t).filter(([s,{text:a}])=>a.toLowerCase().includes(n.toLowerCase()))):t,Ee=({autoFilter:t=!0,children:n,defaultValue:s,value:a,onValueChange:r,open:l,onOpenChange:o,defaultOpen:i,multiple:c=!1,disabled:m=!1,readOnly:u=!1,allowCustomValue:h=!1,state:g})=>{const p=Ue.useFormFieldControl(),[f,v]=e.useState(""),[S,O]=e.useState(),[x,w]=e.useState(!1),P=p.state||g,Me=k.useId(p.id),ke=k.useId(p.labelId),Re=p.disabled??m,Le=p.readOnly??u,[I,_e]=e.useState(pe(n)),[oe,De]=e.useState(t?fe(I,f):I),[ie,je]=e.useState(Ie(n,"Combobox.Popover")),[Be,qe]=e.useState("mouse");e.useEffect(()=>{De(t?fe(I,f):I)},[f,I]);const le=(({itemsMap:C,defaultValue:V,value:N,onValueChange:T,open:M,onOpenChange:B,defaultOpen:q,inputValue:ce,filteredItems:He,setInputValue:Ke,multiple:de,id:Ge,labelId:$e,onInputValueChange:ue,allowCustomValue:be})=>{const F=[...C.values()],z=y.useMultipleSelection({onSelectedItemsChange:({selectedItems:d})=>{const A=d.map(ge=>ge.value);T?.(A)},initialSelectedItems:V?F.filter(d=>V.includes(d.value)):void 0,selectedItems:N?F.filter(d=>N.includes(d.value)):void 0});z.selectedItems,z.removeSelectedItem,z.addSelectedItem;const me=d=>{ue?d!=null&&ue(d):Ke(d)};return{...y.useCombobox({items:F,itemToString:d=>d?.text??"",onSelectedItemChange:({selectedItem:d})=>{d?.value&&!de&&T?.(d?.value)},stateReducer:de?We({updateInputValue:me,allowCustomValue:be,selectedItems:z.selectedItems,removeSelectedItem:z.removeSelectedItem,addSelectedItem:z.addSelectedItem}):Je({itemsMap:C,updateInputValue:me,allowCustomValue:be}),isItemDisabled:d=>{const A=!!ce&&![...He].some(([ge,Ze])=>d.value===Ze.value);return d.disabled||A},initialSelectedItem:V?C.get(V):void 0,initialIsOpen:q??!1,onIsOpenChange:({isOpen:d})=>{d!=null&&B?.(d)},isOpen:M,selectedItem:N?C.get(N):void 0,inputValue:ce,id:Ge,labelId:$e}),...z}})({itemsMap:I,defaultValue:s,value:a,onValueChange:r,open:l,onOpenChange:o,defaultOpen:i,multiple:c,id:Me,labelId:ke,inputValue:f,allowCustomValue:h,setInputValue:C=>{x||v(C)},onInputValueChange:S,filteredItems:oe});e.useEffect(()=>{const C=pe(n),V=[...I.values()],N=[...C.values()];(V.length!==N.length||V.some((T,M)=>{const B=T.value!==N[M]?.value,q=T.text!==N[M]?.text;return B||q}))&&_e(C)},[n]);const[Fe,Ae]=ie?[_.Popover,{open:!0}]:[e.Fragment,{}];return e.createElement(Ce.Provider,{value:{multiple:c,disabled:Re,readOnly:Le,...le,itemsMap:I,filteredItemsMap:oe,highlightedItem:Qe(I,le.highlightedIndex),hasPopover:ie,setHasPopover:je,state:P,lastInteractionType:Be,setLastInteractionType:qe,setIsInputControlled:w,setInputValue:v,setOnInputValueChange:O}},e.createElement(Fe,{...Ae},n))},E=()=>{const t=e.useContext(Ce);if(!t)throw Error("useComboboxContext must be used within a Combobox provider");return t},we=({children:t,...n})=>e.createElement(Ee,{...n},t);function L(){return L=Object.assign?Object.assign.bind():function(t){for(var n=1;n<arguments.length;n++){var s=arguments[n];for(var a in s)Object.prototype.hasOwnProperty.call(s,a)&&(t[a]=s[a])}return t},L.apply(this,arguments)}function Xe(...t){return n=>t.forEach(s=>function(a,r){typeof a=="function"?a(r):a!=null&&(a.current=r)}(s,n))}we.displayName="Combobox";const Ne=e.forwardRef((t,n)=>{const{children:s,...a}=t,r=e.Children.toArray(s),l=r.find(et);if(l){const o=l.props.children,i=r.map(c=>c===l?e.Children.count(o)>1?e.Children.only(null):e.isValidElement(o)?o.props.children:null:c);return e.createElement(H,L({},a,{ref:n}),e.isValidElement(o)?e.cloneElement(o,void 0,i):null)}return e.createElement(H,L({},a,{ref:n}),s)});Ne.displayName="Slot";const H=e.forwardRef((t,n)=>{const{children:s,...a}=t;return e.isValidElement(s)?e.cloneElement(s,{...tt(a,s.props),ref:n?Xe(n,s.ref):s.ref}):e.Children.count(s)>1?e.Children.only(null):null});H.displayName="SlotClone";const Ye=({children:t})=>e.createElement(e.Fragment,null,t);function et(t){return e.isValidElement(t)&&t.type===Ye}function tt(t,n){const s={...n};for(const a in n){const r=t[a],l=n[a];/^on[A-Z]/.test(a)?r&&l?s[a]=(...o)=>{l(...o),r(...o)}:r&&(s[a]=r):a==="style"?s[a]={...r,...l}:a==="className"&&(s[a]=[r,l].filter(Boolean).join(" "))}return{...t,...s}}const nt=e.forwardRef((t,n)=>e.createElement(Ne,{ref:n,...t}));Object.freeze(Object.defineProperty({__proto__:null},Symbol.toStringTag,{value:"Module"})),Object.freeze(Object.defineProperty({__proto__:null,designs:["filled","outlined","tinted","ghost","contrast","dashed"],intents:["current","main","support","success","error","info","alert","danger","neutral","surface","accent","basic"],shapes:["rounded","square","pill"],sizes:["current","sm","md","lg","xl"]},Symbol.toStringTag,{value:"Module"}));const st=b.cva(["inline-block","border-solid","rounded-full","border-md","animate-spin"],{variants:{size:{current:["u-current-font-size"],sm:["w-sz-20","h-sz-20"],md:["w-sz-28","h-sz-28"],full:["w-full","h-full"]},intent:{current:["border-current"],main:["border-main"],support:["border-support"],accent:["border-accent"],basic:["border-basic"],success:["border-success"],alert:["border-alert"],error:["border-error"],info:["border-info"],neutral:["border-neutral"]},isBackgroundVisible:{true:["border-b-neutral-container","border-l-neutral-container"],false:["border-b-transparent","border-l-transparent"]}},defaultVariants:{intent:"current",size:"current",isBackgroundVisible:!1}}),ve=e.forwardRef(({className:t,size:n="current",intent:s="current",label:a,isBackgroundVisible:r,...l},o)=>e.createElement("div",{role:"status","data-spark-component":"spinner",ref:o,className:st({className:t,size:n,intent:s,isBackgroundVisible:r}),...l},a&&e.createElement(xe.VisuallyHidden,null,a))),at=[{intent:"main",design:"filled",class:["bg-main","text-on-main","hover:bg-main-hovered","enabled:active:bg-main-pressed","focus-visible:bg-main-focused"]},{intent:"support",design:"filled",class:["bg-support","text-on-support","hover:bg-support-hovered","enabled:active:bg-support-pressed","focus-visible:bg-support-focused"]},{intent:"accent",design:"filled",class:["bg-accent","text-on-accent","hover:bg-accent-hovered","enabled:active:bg-accent-pressed","focus-visible:bg-accent-focused"]},{intent:"basic",design:"filled",class:["bg-basic","text-on-basic","hover:bg-basic-hovered","enabled:active:bg-basic-pressed","focus-visible:bg-basic-focused"]},{intent:"success",design:"filled",class:["bg-success","text-on-success","hover:bg-success-hovered","enabled:active:bg-success-pressed","focus-visible:bg-success-focused"]},{intent:"alert",design:"filled",class:["bg-alert","text-on-alert","hover:bg-alert-hovered","enabled:active:bg-alert-pressed","focus-visible:bg-alert-focused"]},{intent:"danger",design:"filled",class:["text-on-error bg-error","hover:bg-error-hovered enabled:active:bg-error-pressed","focus-visible:bg-error-focused"]},{intent:"info",design:"filled",class:["text-on-error bg-info","hover:bg-info-hovered enabled:active:bg-info-pressed","focus-visible:bg-info-focused"]},{intent:"neutral",design:"filled",class:["bg-neutral","text-on-neutral","hover:bg-neutral-hovered","enabled:active:bg-neutral-pressed","focus-visible:bg-neutral-focused"]},{intent:"surface",design:"filled",class:["bg-surface","text-on-surface","hover:bg-surface-hovered","enabled:active:bg-surface-pressed","focus-visible:bg-surface-focused"]}],rt=[{intent:"main",design:"ghost",class:["text-main","hover:bg-main/dim-5","enabled:active:bg-main/dim-5","focus-visible:bg-main/dim-5"]},{intent:"support",design:"ghost",class:["text-support","hover:bg-support/dim-5","enabled:active:bg-support/dim-5","focus-visible:bg-support/dim-5"]},{intent:"accent",design:"ghost",class:["text-accent","hover:bg-accent/dim-5","enabled:active:bg-accent/dim-5","focus-visible:bg-accent/dim-5"]},{intent:"basic",design:"ghost",class:["text-basic","hover:bg-basic/dim-5","enabled:active:bg-basic/dim-5","focus-visible:bg-basic/dim-5"]},{intent:"success",design:"ghost",class:["text-success","hover:bg-success/dim-5","enabled:active:bg-success/dim-5","focus-visible:bg-success/dim-5"]},{intent:"alert",design:"ghost",class:["text-alert","hover:bg-alert/dim-5","enabled:active:bg-alert/dim-5","focus-visible:bg-alert/dim-5"]},{intent:"danger",design:"ghost",class:["text-error","hover:bg-error/dim-5","enabled:active:bg-error/dim-5","focus-visible:bg-error/dim-5"]},{intent:"info",design:"ghost",class:["text-info","hover:bg-info/dim-5","enabled:active:bg-info/dim-5","focus-visible:bg-info/dim-5"]},{intent:"neutral",design:"ghost",class:["text-neutral","hover:bg-neutral/dim-5","enabled:active:bg-neutral/dim-5","focus-visible:bg-neutral/dim-5"]},{intent:"surface",design:"ghost",class:["text-surface","hover:bg-surface/dim-5","enabled:active:bg-surface/dim-5","focus-visible:bg-surface/dim-5"]}],ot=[{intent:"main",design:"outlined",class:["hover:bg-main/dim-5","enabled:active:bg-main/dim-5","focus-visible:bg-main/dim-5","text-main"]},{intent:"support",design:"outlined",class:["hover:bg-support/dim-5","enabled:active:bg-support/dim-5","focus-visible:bg-support/dim-5","text-support"]},{intent:"accent",design:"outlined",class:["hover:bg-accent/dim-5","enabled:active:bg-accent/dim-5","focus-visible:bg-accent/dim-5","text-accent"]},{intent:"basic",design:"outlined",class:["hover:bg-basic/dim-5","enabled:active:bg-basic/dim-5","focus-visible:bg-basic/dim-5","text-basic"]},{intent:"success",design:"outlined",class:["hover:bg-success/dim-5","enabled:active:bg-success/dim-5","focus-visible:bg-success/dim-5","text-success"]},{intent:"alert",design:"outlined",class:["hover:bg-alert/dim-5","enabled:active:bg-alert/dim-5","focus-visible:bg-alert/dim-5","text-alert"]},{intent:"danger",design:"outlined",class:["hover:bg-error/dim-5","enabled:active:bg-error/dim-5","focus-visible:bg-error/dim-5","text-error"]},{intent:"info",design:"outlined",class:["hover:bg-info/dim-5","enabled:active:bg-info/dim-5","focus-visible:bg-info/dim-5","text-info"]},{intent:"neutral",design:"outlined",class:["hover:bg-neutral/dim-5","enabled:active:bg-neutral/dim-5","focus-visible:bg-neutral/dim-5","text-neutral"]},{intent:"surface",design:"outlined",class:["hover:bg-surface/dim-5","enabled:active:bg-surface/dim-5","focus-visible:bg-surface/dim-5","text-surface"]}],it=[{intent:"main",design:"tinted",class:["bg-main-container","text-on-main-container","hover:bg-main-container-hovered","enabled:active:bg-main-container-pressed","focus-visible:bg-main-container-focused"]},{intent:"support",design:"tinted",class:["bg-support-container","text-on-support-container","hover:bg-support-container-hovered","enabled:active:bg-support-container-pressed","focus-visible:bg-support-container-focused"]},{intent:"accent",design:"tinted",class:["bg-accent-container","text-on-accent-container","hover:bg-accent-container-hovered","enabled:active:bg-accent-container-pressed","focus-visible:bg-accent-container-focused"]},{intent:"basic",design:"tinted",class:["bg-basic-container","text-on-basic-container","hover:bg-basic-container-hovered","enabled:active:bg-basic-container-pressed","focus-visible:bg-basic-container-focused"]},{intent:"success",design:"tinted",class:["bg-success-container","text-on-success-container","hover:bg-success-container-hovered","enabled:active:bg-success-container-pressed","focus-visible:bg-success-container-focused"]},{intent:"alert",design:"tinted",class:["bg-alert-container","text-on-alert-container","hover:bg-alert-container-hovered","enabled:active:bg-alert-container-pressed","focus-visible:bg-alert-container-focused"]},{intent:"danger",design:"tinted",class:["bg-error-container","text-on-error-container","hover:bg-error-container-hovered","enabled:active:bg-error-container-pressed","focus-visible:bg-error-container-focused"]},{intent:"info",design:"tinted",class:["bg-info-container","text-on-info-container","hover:bg-info-container-hovered","enabled:active:bg-info-container-pressed","focus-visible:bg-info-container-focused"]},{intent:"neutral",design:"tinted",class:["bg-neutral-container","text-on-neutral-container","hover:bg-neutral-container-hovered","enabled:active:bg-neutral-container-pressed","focus-visible:bg-neutral-container-focused"]},{intent:"surface",design:"tinted",class:["bg-surface","text-on-surface","hover:bg-surface-hovered","enabled:active:bg-surface-pressed","focus-visible:bg-surface-focused"]}],lt=[{intent:"main",design:"contrast",class:["text-main","hover:bg-main-container-hovered","enabled:active:bg-main-container-pressed","focus-visible:bg-main-container-focused"]},{intent:"support",design:"contrast",class:["text-support","hover:bg-support-container-hovered","enabled:active:bg-support-container-pressed","focus-visible:bg-support-container-focused"]},{intent:"accent",design:"contrast",class:["text-accent","hover:bg-accent-container-hovered","enabled:active:bg-accent-container-pressed","focus-visible:bg-accent-container-focused"]},{intent:"basic",design:"contrast",class:["text-basic","hover:bg-basic-container-hovered","enabled:active:bg-basic-container-pressed","focus-visible:bg-basic-container-focused"]},{intent:"success",design:"contrast",class:["text-success","hover:bg-success-container-hovered","enabled:active:bg-success-container-pressed","focus-visible:bg-success-container-focused"]},{intent:"alert",design:"contrast",class:["text-alert","hover:bg-alert-container-hovered","enabled:active:bg-alert-container-pressed","focus-visible:bg-alert-container-focused"]},{intent:"danger",design:"contrast",class:["text-error","hover:bg-error-container-hovered","enabled:active:bg-error-container-pressed","focus-visible:bg-error-container-focused"]},{intent:"info",design:"contrast",class:["text-info","hover:bg-info-container-hovered","enabled:active:bg-info-container-pressed","focus-visible:bg-info-container-focused"]},{intent:"neutral",design:"contrast",class:["text-neutral","hover:bg-neutral-container-hovered","enabled:active:bg-neutral-container-pressed","focus-visible:bg-neutral-container-focused"]},{intent:"surface",design:"contrast",class:["text-on-surface","hover:bg-surface-hovered","enabled:active:bg-surface-pressed","focus-visible:bg-surface-focused"]}],ct=b.cva(["u-shadow-border-transition","box-border inline-flex items-center justify-center gap-md whitespace-nowrap","px-lg","text-body-1 font-bold","focus-visible:outline-none focus-visible:u-ring [&:not(:focus-visible)]:ring-inset"],{variants:{design:{filled:[],outlined:["bg-transparent","border-sm","border-current"],tinted:[],ghost:[],contrast:["bg-surface"]},intent:{main:[],support:[],accent:[],basic:[],success:[],alert:[],danger:[],info:[],neutral:[],surface:[]},size:{sm:["min-w-sz-32","h-sz-32"],md:["min-w-sz-44","h-sz-44"],lg:["min-w-sz-56","h-sz-56"]},shape:{rounded:["rounded-lg"],square:["rounded-none"],pill:["rounded-full"]},disabled:{true:["cursor-not-allowed","opacity-dim-3"]}},compoundVariants:[...at,...ot,...it,...rt,...lt],defaultVariants:{design:"filled",intent:"main",size:"md",shape:"rounded"}}),dt=["onClick","onMouseDown","onMouseUp","onMouseEnter","onMouseLeave","onMouseOver","onMouseOut","onKeyDown","onKeyPress","onKeyUp","onSubmit"],Ve=e.forwardRef(({children:t,design:n="filled",disabled:s=!1,intent:a="main",isLoading:r=!1,loadingLabel:l,loadingText:o,shape:i="rounded",size:c="md",spinnerPlacement:m="left",asChild:u,className:h,...g},p)=>{const f=u?nt:"button",v=!!s||r,S=e.useMemo(()=>{const x={};return v&&dt.forEach(w=>x[w]=void 0),x},[v]),O={size:"current",className:o?"inline-block":"absolute",...l&&{"aria-label":l}};return e.createElement(f,{"data-spark-component":"button",ref:p,className:ct({className:h,design:n,disabled:v,intent:a,shape:i,size:c}),disabled:!!s,"aria-busy":r,"aria-live":r?"assertive":"off",...g,...S},((x,w,P)=>x?e.isValidElement(w)?e.cloneElement(w,void 0,P(w.props.children)):null:P(w))(u,t,x=>r?e.createElement(e.Fragment,null,m==="left"&&e.createElement(ve,{...O}),o&&o,m==="right"&&e.createElement(ve,{...O}),e.createElement("div",{"aria-hidden":!0,className:b.cx("inline-flex gap-md",o?"hidden":"opacity-0")},x)):x))});Ve.displayName="Button",Object.freeze(Object.defineProperty({__proto__:null},Symbol.toStringTag,{value:"Module"})),Object.freeze(Object.defineProperty({__proto__:null,designs:["filled","outlined","tinted","ghost","contrast","dashed"],intents:["current","main","support","success","error","info","alert","danger","neutral","surface","accent","basic"],shapes:["rounded","square","pill"],sizes:["current","sm","md","lg","xl"]},Symbol.toStringTag,{value:"Module"}));const ut=b.cva(["px-none"],{variants:{size:{sm:["text-body-1"],md:["text-body-1"],lg:["text-display-3"]}}}),ze=e.forwardRef(({design:t="filled",disabled:n=!1,intent:s="main",shape:a="rounded",size:r="md",className:l,...o},i)=>e.createElement(Ve,{ref:i,className:ut({size:r,className:l}),design:t,disabled:n,intent:s,shape:a,size:r,...o}));ze.displayName="IconButton";const $=e.forwardRef(({title:t,fill:n="currentColor",stroke:s="none",...a},r)=>e.createElement("svg",{ref:r,viewBox:"0 0 24 24",xmlns:"http://www.w3.org/2000/svg","data-title":"ArrowHorizontalDown",...t&&{"data-title":t},fill:n,stroke:s,...a,dangerouslySetInnerHTML:{__html:(t===void 0?"":`<title>${t}</title>`)+'<path fill-rule="evenodd" d="m2.33,7.3c.43-.4,1.14-.4,1.57,0l8.1,7.48,8.1-7.48c.43-.4,1.14-.4,1.57,0,.43.4.43,1.06,0,1.47l-8.34,7.7c-.17.17-.37.3-.6.39-.23.09-.48.14-.73.14s-.5-.05-.73-.14c-.23-.09-.43-.22-.6-.39L2.33,8.77c-.43-.4-.43-1.06,0-1.47Z"/>'}}));function bt(...t){return n=>{t.forEach(s=>function(a,r){if(a!=null)if(typeof a!="function")try{a.current=r}catch{throw new Error(`Cannot assign value '${r}' to ref '${a}'`)}else a(r)}(s,n))}}function D(...t){return e.useMemo(()=>bt(...t),t)}$.displayName="ArrowHorizontalDown";const Z=e.forwardRef(({className:t,closedLabel:n,openedLabel:s,intent:a="neutral",design:r="ghost",size:l="sm",...o},i)=>{const{getToggleButtonProps:c}=E(),{ref:m,...u}=c(),h=u["aria-expanded"],g=D(i,m);return e.createElement(ze,{ref:g,className:t,intent:a,design:r,size:l,...u,...o,"aria-label":h?s:n},e.createElement(R.Icon,null,e.createElement(R.Icon,{className:"shrink-0",size:"sm"},e.createElement($,null))))});Z.displayName="Combobox.Disclosure";const U=e.forwardRef(({className:t},n)=>e.createElement("div",{ref:n,className:b.cx("my-md border-b-sm border-outline",t)}));U.displayName="Combobox.Divider";const W=e.forwardRef(({className:t,children:n},s)=>{const{filteredItemsMap:a}=E();return a.size===0?e.createElement("div",{ref:s,className:t},n):null});W.displayName="Combobox.Empty";const Oe=e.createContext(null),mt=({children:t})=>{const n=k.useId();return e.createElement(Oe.Provider,{value:{labelId:n}},t)},Se=()=>{const t=e.useContext(Oe);if(!t)throw Error("useComboboxGroupContext must be used within a ComboboxGroup provider");return t},J=e.forwardRef(({children:t,...n},s)=>e.createElement(mt,null,e.createElement(gt,{ref:s,...n},t))),gt=e.forwardRef(({children:t,className:n},s)=>{const{labelId:a}=Se();return e.createElement("div",{ref:s,role:"group","aria-labelledby":a,className:b.cx(n)},t)});J.displayName="Combobox.Group";const Q=e.forwardRef(({"aria-label":t,className:n,value:s,placeholder:a,onValueChange:r,...l},o)=>{const i=E(),c=s!=null,m=i.multiple&&i.selectedItems.length?i.selectedItems.map(v=>v.text).join(", "):a;e.useEffect(()=>{i.setIsInputControlled(c),c&&i.setInputValue(s)},[c,s]),e.useEffect(()=>{r&&i.setOnInputValueChange(()=>r),i.multiple||!i.selectedItem||c||i.setInputValue(i.selectedItem.text)},[]);const[u,h]=i.hasPopover?[_.Popover.Trigger,{asChild:!0,type:void 0}]:[e.Fragment,{}],{ref:g,...p}=i.getInputProps({...i.getDropdownProps(),onKeyDown:()=>{i.setLastInteractionType("keyboard")}}),f=D(o,g);return e.createElement(e.Fragment,null,t&&e.createElement(xe.VisuallyHidden,null,e.createElement("label",{...i.getLabelProps()},t)),e.createElement(u,{...h},e.createElement("input",{"data-spark-component":"combobox-input",ref:f,type:"text",placeholder:m,disabled:i.disabled||i.readOnly,className:b.cx("text-ellipsis",n),...l,...p,value:i.inputValue})))});Q.displayName="Combobox.Input";const Te=e.createContext(null),pt=({value:t,disabled:n=!1,children:s})=>{const{multiple:a,itemsMap:r,selectedItem:l,selectedItems:o}=E(),[i,c]=e.useState(void 0),m=function(g,p){let f=0;for(const[v]of g.entries()){if(v===p)return f;f++}return-1}(r,t),u={disabled:n,value:t,text:G(s)},h=a?o.some(g=>g.value===t):l?.value===t;return e.createElement(Te.Provider,{value:{textId:i,setTextId:c,isSelected:h,itemData:u,index:m,disabled:n}},s)},X=()=>{const t=e.useContext(Te);if(!t)throw Error("useComboboxItemContext must be used within a ComboboxItem provider");return t},Y=e.forwardRef(({children:t,...n},s)=>{const{value:a,disabled:r}=n;return e.createElement(pt,{value:a,disabled:r},e.createElement(vt,{ref:s,...n},t))}),ft=b.cva("px-lg py-md text-body-1",{variants:{selected:{true:"font-bold"},disabled:{true:"opacity-dim-3 cursor-not-allowed",false:"cursor-pointer"},highlighted:{true:""},interactionType:{mouse:"",keyboard:""}},compoundVariants:[{highlighted:!0,interactionType:"mouse",class:"bg-surface-hovered"},{highlighted:!0,interactionType:"keyboard",class:"u-ring"}]}),vt=e.forwardRef(({className:t,disabled:n=!1,value:s,children:a},r)=>{const{getItemProps:l,highlightedItem:o,lastInteractionType:i,filteredItemsMap:c}=E(),{textId:m,index:u,itemData:h,isSelected:g}=X(),p=o?.value===s,f=Array.from(c).some(([x])=>x===s),{ref:v,...S}=l({item:h,index:u}),O=D(r,v);return f?e.createElement("li",{ref:O,className:b.cx(ft({selected:g,disabled:n,highlighted:p,interactionType:i,className:t})),key:s,...S,"aria-selected":g,"aria-labelledby":m},a):null});Y.displayName="Combobox.Item";const Pe=e.forwardRef(({title:t,fill:n="currentColor",stroke:s="none",...a},r)=>e.createElement("svg",{ref:r,viewBox:"0 0 24 24",xmlns:"http://www.w3.org/2000/svg","data-title":"Check",...t&&{"data-title":t},fill:n,stroke:s,...a,dangerouslySetInnerHTML:{__html:(t===void 0?"":`<title>${t}</title>`)+'<path d="m8.92,19.08c-.18,0-.36-.03-.53-.1s-.33-.17-.47-.31l-5.49-5.34c-.28-.28-.42-.61-.42-1s.14-.73.42-1c.28-.28.62-.41,1.02-.41s.74.14,1.05.41l4.43,4.3,10.62-10.29c.28-.28.62-.42,1.02-.43.39,0,.73.13,1.02.43.28.28.42.61.42,1s-.14.73-.42,1l-11.65,11.32c-.14.14-.3.24-.47.31-.17.07-.35.1-.53.1Z"/>'}}));Pe.displayName="Check";const ee=e.forwardRef(({className:t,children:n,label:s},a)=>{const{disabled:r,isSelected:l}=X(),o=n||e.createElement(R.Icon,{size:"sm"},e.createElement(Pe,{"aria-label":s}));return e.createElement("span",{ref:a,className:b.cx("flex min-h-sz-16 min-w-sz-16",r&&"opacity-dim-3",t)},l&&o)});ee.displayName="Combobox.ItemIndicator";const te=e.forwardRef(({children:t,className:n,...s},a)=>{const{isOpen:r,getMenuProps:l,hasPopover:o,setLastInteractionType:i}=E(),{ref:c,...m}=l({onMouseMove:()=>{i("mouse")}}),u=D(a,c);return e.createElement("ul",{ref:u,className:b.cx(n,"flex flex-col",r?"block":"pointer-events-none opacity-0",o&&"p-lg"),...s,...m,"data-spark-component":"combobox-items"},t)});te.displayName="Combobox.Items";const ne=e.forwardRef(({children:t},n)=>{const s=k.useId(),{setTextId:a}=X();return e.useEffect(()=>(a(s),()=>a(void 0))),e.createElement("span",{id:s,className:b.cx("inline"),ref:n},t)});ne.displayName="Combobox.ItemText";const se=e.forwardRef(({children:t,className:n},s)=>{const{labelId:a}=Se();return e.createElement("div",{ref:s,id:a,className:b.cx("px-md py-sm text-body-2 italic text-neutral",n)},t)});se.displayName="Combobox.Label";const j=({children:t})=>e.createElement(R.Icon,{size:"sm",className:"shrink-0"},t);j.displayName="Combobox.LeadingIcon";const ae=e.forwardRef(({children:t,matchTriggerWidth:n=!0,sideOffset:s=4,className:a,...r},l)=>{const{isOpen:o,setHasPopover:i}=E();return e.useEffect(()=>(i(!0),()=>i(!1)),[]),e.createElement(_.Popover.Content,{ref:l,inset:!0,asChild:!0,matchTriggerWidth:n,className:b.cx("!z-dropdown",!o&&"hidden",a),sideOffset:s,onOpenAutoFocus:c=>{c.preventDefault()},...r,"data-spark-component":"combobox-popover"},t)});ae.displayName="Combobox.Popover";const ht=b.cva(["flex w-full items-center justify-between","min-h-sz-44 rounded-lg bg-surface text-on-surface px-lg","ring-1 outline-none ring-inset focus:ring-2"],{variants:{state:{undefined:"ring-outline focus:ring-outline-high",error:"ring-error",alert:"ring-alert",success:"ring-success"},disabled:{true:"disabled:bg-on-surface/dim-5 cursor-not-allowed text-on-surface/dim-3"},readOnly:{true:"disabled:bg-on-surface/dim-5 cursor-not-allowed text-on-surface/dim-3"}},compoundVariants:[{disabled:!1,state:void 0,class:"hover:ring-outline-high"}]}),re=e.forwardRef(({className:t,children:n},s)=>{const{hasPopover:a,disabled:r,readOnly:l,state:o}=E(),[i,c]=a?[_.Popover.Anchor,{asChild:!0,type:void 0}]:[e.Fragment,{}];return e.createElement(e.Fragment,null,e.createElement(i,{...c},e.createElement("div",{ref:s,className:ht({className:t,state:o,disabled:r,readOnly:l})},e.createElement(j,null,e.createElement($,null)),e.createElement("p",null,"[selected items chips (v2)]"),n,e.createElement("p",null,"[clear]"))))});re.displayName="Combobox.Trigger";const he=Object.assign(we,{Group:J,Item:Y,Items:te,ItemText:ne,ItemIndicator:ee,Label:se,Popover:ae,Divider:U,Trigger:re,LeadingIcon:j,Empty:W,Input:Q,Disclosure:Z});he.displayName="Combobox",J.displayName="Combobox.Group",te.displayName="Combobox.Items",Y.displayName="Combobox.Item",ne.displayName="Combobox.ItemText",ee.displayName="Combobox.ItemIndicator",se.displayName="Combobox.Label",ae.displayName="Combobox.Popover",U.displayName="Combobox.Divider",re.displayName="Combobox.Trigger",j.displayName="Combobox.LeadingIcon",W.displayName="Combobox.Empty",Q.displayName="Combobox.Input",Z.displayName="Combobox.Disclosure",exports.Combobox=he,exports.ComboboxProvider=Ee,exports.useComboboxContext=E;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react"),k=require("@radix-ui/react-id"),Ue=require("@spark-ui/form-field"),_=require("@spark-ui/popover"),y=require("downshift"),R=require("@spark-ui/icon"),xe=require("@spark-ui/visually-hidden"),b=require("class-variance-authority"),We=({allowCustomValue:t,updateInputValue:n,selectedItems:s,removeSelectedItem:a,addSelectedItem:r})=>(l,{changes:o,type:i})=>{switch(i){case y.useCombobox.stateChangeTypes.InputChange:return n(o.inputValue),o;case y.useCombobox.stateChangeTypes.InputBlur:return t?o:(n(""),{...o,inputValue:""});case y.useCombobox.stateChangeTypes.InputKeyDownEnter:case y.useCombobox.stateChangeTypes.ItemClick:return o.selectedItem!=null&&(n(""),s.some(c=>c.value===o.selectedItem?.value)?a(o.selectedItem):r(o.selectedItem)),{...o,isOpen:!0,highlightedIndex:l.highlightedIndex};default:return o}},Je=({itemsMap:t,updateInputValue:n,allowCustomValue:s})=>(a,{changes:r,type:l})=>{const o=[...t.values()].find(c=>c.text.toLowerCase()===a.inputValue.toLowerCase()),i=a.selectedItem?.text||"";switch(l){case y.useCombobox.stateChangeTypes.InputChange:return n(r.inputValue),r;case y.useCombobox.stateChangeTypes.InputKeyDownEnter:case y.useCombobox.stateChangeTypes.ItemClick:return r.selectedItem&&n(r.inputValue),r;case y.useCombobox.stateChangeTypes.InputBlur:return s?r:a.inputValue===""?{...r,selectedItem:null}:o?(n(o.text),{...r,selectedItem:o,inputValue:o.text}):(n(i),{...r,inputValue:i});default:return r}},Qe=(t,n)=>{const s=((a,r)=>{let l=0;for(const o of a.keys()){if(l===r)return o;l++}})(t,n);return s!==void 0?t.get(s):void 0},K=t=>t?t.type.displayName:"",ye=(t,n=[])=>(e.Children.forEach(t,s=>{if(e.isValidElement(s)){if(K(s)==="Combobox.Item"){const a=s.props;n.push({value:a.value,disabled:!!a.disabled,text:G(a.children)})}s.props.children&&ye(s.props.children,n)}}),n),G=(t,n="")=>typeof t=="string"?t:(e.Children.forEach(t,s=>{e.isValidElement(s)&&(K(s)==="Combobox.ItemText"&&(n=s.props.children),s.props.children&&G(s.props.children,n))}),n),pe=t=>{const n=new Map;return ye(t).forEach(s=>{n.set(s.value,s)}),n},Ie=(t,n)=>e.Children.toArray(t).some(s=>!!e.isValidElement(s)&&(K(s)===n||!!s.props.children&&Ie(s.props.children,n))),Ce=e.createContext(null),fe=(t,n)=>n?new Map(Array.from(t).filter(([s,{text:a}])=>a.toLowerCase().includes(n.toLowerCase()))):t,Ee=({autoFilter:t=!0,children:n,defaultValue:s,value:a,onValueChange:r,open:l,onOpenChange:o,defaultOpen:i,multiple:c=!1,disabled:m=!1,readOnly:u=!1,allowCustomValue:h=!1,state:g})=>{const f=Ue.useFormFieldControl(),[p,v]=e.useState(""),[S,O]=e.useState(),[x,w]=e.useState(!1),P=f.state||g,Me=k.useId(f.id),ke=k.useId(f.labelId),Re=f.disabled??m,Le=f.readOnly??u,[I,_e]=e.useState(pe(n)),[oe,De]=e.useState(t?fe(I,p):I),[ie,je]=e.useState(Ie(n,"Combobox.Popover")),[Be,qe]=e.useState("mouse");e.useEffect(()=>{De(t?fe(I,p):I)},[p,I]);const le=(({itemsMap:C,defaultValue:V,value:N,onValueChange:T,open:M,onOpenChange:B,defaultOpen:q,inputValue:ce,filteredItems:He,setInputValue:Ke,multiple:de,id:Ge,labelId:$e,onInputValueChange:ue,allowCustomValue:be})=>{const F=[...C.values()],z=y.useMultipleSelection({onSelectedItemsChange:({selectedItems:d})=>{const A=d.map(ge=>ge.value);T?.(A)},initialSelectedItems:V?F.filter(d=>V.includes(d.value)):void 0,selectedItems:N?F.filter(d=>N.includes(d.value)):void 0});z.selectedItems,z.removeSelectedItem,z.addSelectedItem;const me=d=>{ue?d!=null&&ue(d):Ke(d)};return{...y.useCombobox({items:F,itemToString:d=>d?.text??"",onSelectedItemChange:({selectedItem:d})=>{d?.value&&!de&&T?.(d?.value)},stateReducer:de?We({updateInputValue:me,allowCustomValue:be,selectedItems:z.selectedItems,removeSelectedItem:z.removeSelectedItem,addSelectedItem:z.addSelectedItem}):Je({itemsMap:C,updateInputValue:me,allowCustomValue:be}),isItemDisabled:d=>{const A=!!ce&&![...He].some(([ge,Ze])=>d.value===Ze.value);return d.disabled||A},initialSelectedItem:V?C.get(V):void 0,initialIsOpen:q??!1,onIsOpenChange:({isOpen:d})=>{d!=null&&B?.(d)},isOpen:M,selectedItem:N?C.get(N):void 0,inputValue:ce,id:Ge,labelId:$e}),...z}})({itemsMap:I,defaultValue:s,value:a,onValueChange:r,open:l,onOpenChange:o,defaultOpen:i,multiple:c,id:Me,labelId:ke,inputValue:p,allowCustomValue:h,setInputValue:C=>{x||v(C)},onInputValueChange:S,filteredItems:oe});e.useEffect(()=>{const C=pe(n),V=[...I.values()],N=[...C.values()];(V.length!==N.length||V.some((T,M)=>{const B=T.value!==N[M]?.value,q=T.text!==N[M]?.text;return B||q}))&&_e(C)},[n]);const[Fe,Ae]=ie?[_.Popover,{open:!0}]:[e.Fragment,{}];return e.createElement(Ce.Provider,{value:{multiple:c,disabled:Re,readOnly:Le,...le,itemsMap:I,filteredItemsMap:oe,highlightedItem:Qe(I,le.highlightedIndex),hasPopover:ie,setHasPopover:je,state:P,lastInteractionType:Be,setLastInteractionType:qe,setIsInputControlled:w,setInputValue:v,setOnInputValueChange:O}},e.createElement(Fe,{...Ae},n))},E=()=>{const t=e.useContext(Ce);if(!t)throw Error("useComboboxContext must be used within a Combobox provider");return t},we=({children:t,...n})=>e.createElement(Ee,{...n},t);function L(){return L=Object.assign?Object.assign.bind():function(t){for(var n=1;n<arguments.length;n++){var s=arguments[n];for(var a in s)Object.prototype.hasOwnProperty.call(s,a)&&(t[a]=s[a])}return t},L.apply(this,arguments)}function Xe(...t){return n=>t.forEach(s=>function(a,r){typeof a=="function"?a(r):a!=null&&(a.current=r)}(s,n))}we.displayName="Combobox";const Ne=e.forwardRef((t,n)=>{const{children:s,...a}=t,r=e.Children.toArray(s),l=r.find(et);if(l){const o=l.props.children,i=r.map(c=>c===l?e.Children.count(o)>1?e.Children.only(null):e.isValidElement(o)?o.props.children:null:c);return e.createElement(H,L({},a,{ref:n}),e.isValidElement(o)?e.cloneElement(o,void 0,i):null)}return e.createElement(H,L({},a,{ref:n}),s)});Ne.displayName="Slot";const H=e.forwardRef((t,n)=>{const{children:s,...a}=t;return e.isValidElement(s)?e.cloneElement(s,{...tt(a,s.props),ref:n?Xe(n,s.ref):s.ref}):e.Children.count(s)>1?e.Children.only(null):null});H.displayName="SlotClone";const Ye=({children:t})=>e.createElement(e.Fragment,null,t);function et(t){return e.isValidElement(t)&&t.type===Ye}function tt(t,n){const s={...n};for(const a in n){const r=t[a],l=n[a];/^on[A-Z]/.test(a)?r&&l?s[a]=(...o)=>{l(...o),r(...o)}:r&&(s[a]=r):a==="style"?s[a]={...r,...l}:a==="className"&&(s[a]=[r,l].filter(Boolean).join(" "))}return{...t,...s}}const nt=e.forwardRef((t,n)=>e.createElement(Ne,{ref:n,...t}));Object.freeze(Object.defineProperty({__proto__:null},Symbol.toStringTag,{value:"Module"})),Object.freeze(Object.defineProperty({__proto__:null,designs:["filled","outlined","tinted","ghost","contrast","dashed"],intents:["current","main","support","success","error","info","alert","danger","neutral","surface","accent","basic"],shapes:["rounded","square","pill"],sizes:["current","sm","md","lg","xl"]},Symbol.toStringTag,{value:"Module"}));const st=b.cva(["inline-block","border-solid","rounded-full","border-md","animate-spin"],{variants:{size:{current:["u-current-font-size"],sm:["w-sz-20","h-sz-20"],md:["w-sz-28","h-sz-28"],full:["w-full","h-full"]},intent:{current:["border-current"],main:["border-main"],support:["border-support"],accent:["border-accent"],basic:["border-basic"],success:["border-success"],alert:["border-alert"],error:["border-error"],info:["border-info"],neutral:["border-neutral"]},isBackgroundVisible:{true:["border-b-neutral-container","border-l-neutral-container"],false:["border-b-transparent","border-l-transparent"]}},defaultVariants:{intent:"current",size:"current",isBackgroundVisible:!1}}),ve=e.forwardRef(({className:t,size:n="current",intent:s="current",label:a,isBackgroundVisible:r,...l},o)=>e.createElement("div",{role:"status","data-spark-component":"spinner",ref:o,className:st({className:t,size:n,intent:s,isBackgroundVisible:r}),...l},a&&e.createElement(xe.VisuallyHidden,null,a))),at=[{intent:"main",design:"filled",class:["bg-main","text-on-main","hover:bg-main-hovered","enabled:active:bg-main-pressed","focus-visible:bg-main-focused"]},{intent:"support",design:"filled",class:["bg-support","text-on-support","hover:bg-support-hovered","enabled:active:bg-support-pressed","focus-visible:bg-support-focused"]},{intent:"accent",design:"filled",class:["bg-accent","text-on-accent","hover:bg-accent-hovered","enabled:active:bg-accent-pressed","focus-visible:bg-accent-focused"]},{intent:"basic",design:"filled",class:["bg-basic","text-on-basic","hover:bg-basic-hovered","enabled:active:bg-basic-pressed","focus-visible:bg-basic-focused"]},{intent:"success",design:"filled",class:["bg-success","text-on-success","hover:bg-success-hovered","enabled:active:bg-success-pressed","focus-visible:bg-success-focused"]},{intent:"alert",design:"filled",class:["bg-alert","text-on-alert","hover:bg-alert-hovered","enabled:active:bg-alert-pressed","focus-visible:bg-alert-focused"]},{intent:"danger",design:"filled",class:["text-on-error bg-error","hover:bg-error-hovered enabled:active:bg-error-pressed","focus-visible:bg-error-focused"]},{intent:"info",design:"filled",class:["text-on-error bg-info","hover:bg-info-hovered enabled:active:bg-info-pressed","focus-visible:bg-info-focused"]},{intent:"neutral",design:"filled",class:["bg-neutral","text-on-neutral","hover:bg-neutral-hovered","enabled:active:bg-neutral-pressed","focus-visible:bg-neutral-focused"]},{intent:"surface",design:"filled",class:["bg-surface","text-on-surface","hover:bg-surface-hovered","enabled:active:bg-surface-pressed","focus-visible:bg-surface-focused"]}],rt=[{intent:"main",design:"ghost",class:["text-main","hover:bg-main/dim-5","enabled:active:bg-main/dim-5","focus-visible:bg-main/dim-5"]},{intent:"support",design:"ghost",class:["text-support","hover:bg-support/dim-5","enabled:active:bg-support/dim-5","focus-visible:bg-support/dim-5"]},{intent:"accent",design:"ghost",class:["text-accent","hover:bg-accent/dim-5","enabled:active:bg-accent/dim-5","focus-visible:bg-accent/dim-5"]},{intent:"basic",design:"ghost",class:["text-basic","hover:bg-basic/dim-5","enabled:active:bg-basic/dim-5","focus-visible:bg-basic/dim-5"]},{intent:"success",design:"ghost",class:["text-success","hover:bg-success/dim-5","enabled:active:bg-success/dim-5","focus-visible:bg-success/dim-5"]},{intent:"alert",design:"ghost",class:["text-alert","hover:bg-alert/dim-5","enabled:active:bg-alert/dim-5","focus-visible:bg-alert/dim-5"]},{intent:"danger",design:"ghost",class:["text-error","hover:bg-error/dim-5","enabled:active:bg-error/dim-5","focus-visible:bg-error/dim-5"]},{intent:"info",design:"ghost",class:["text-info","hover:bg-info/dim-5","enabled:active:bg-info/dim-5","focus-visible:bg-info/dim-5"]},{intent:"neutral",design:"ghost",class:["text-neutral","hover:bg-neutral/dim-5","enabled:active:bg-neutral/dim-5","focus-visible:bg-neutral/dim-5"]},{intent:"surface",design:"ghost",class:["text-surface","hover:bg-surface/dim-5","enabled:active:bg-surface/dim-5","focus-visible:bg-surface/dim-5"]}],ot=[{intent:"main",design:"outlined",class:["hover:bg-main/dim-5","enabled:active:bg-main/dim-5","focus-visible:bg-main/dim-5","text-main"]},{intent:"support",design:"outlined",class:["hover:bg-support/dim-5","enabled:active:bg-support/dim-5","focus-visible:bg-support/dim-5","text-support"]},{intent:"accent",design:"outlined",class:["hover:bg-accent/dim-5","enabled:active:bg-accent/dim-5","focus-visible:bg-accent/dim-5","text-accent"]},{intent:"basic",design:"outlined",class:["hover:bg-basic/dim-5","enabled:active:bg-basic/dim-5","focus-visible:bg-basic/dim-5","text-basic"]},{intent:"success",design:"outlined",class:["hover:bg-success/dim-5","enabled:active:bg-success/dim-5","focus-visible:bg-success/dim-5","text-success"]},{intent:"alert",design:"outlined",class:["hover:bg-alert/dim-5","enabled:active:bg-alert/dim-5","focus-visible:bg-alert/dim-5","text-alert"]},{intent:"danger",design:"outlined",class:["hover:bg-error/dim-5","enabled:active:bg-error/dim-5","focus-visible:bg-error/dim-5","text-error"]},{intent:"info",design:"outlined",class:["hover:bg-info/dim-5","enabled:active:bg-info/dim-5","focus-visible:bg-info/dim-5","text-info"]},{intent:"neutral",design:"outlined",class:["hover:bg-neutral/dim-5","enabled:active:bg-neutral/dim-5","focus-visible:bg-neutral/dim-5","text-neutral"]},{intent:"surface",design:"outlined",class:["hover:bg-surface/dim-5","enabled:active:bg-surface/dim-5","focus-visible:bg-surface/dim-5","text-surface"]}],it=[{intent:"main",design:"tinted",class:["bg-main-container","text-on-main-container","hover:bg-main-container-hovered","enabled:active:bg-main-container-pressed","focus-visible:bg-main-container-focused"]},{intent:"support",design:"tinted",class:["bg-support-container","text-on-support-container","hover:bg-support-container-hovered","enabled:active:bg-support-container-pressed","focus-visible:bg-support-container-focused"]},{intent:"accent",design:"tinted",class:["bg-accent-container","text-on-accent-container","hover:bg-accent-container-hovered","enabled:active:bg-accent-container-pressed","focus-visible:bg-accent-container-focused"]},{intent:"basic",design:"tinted",class:["bg-basic-container","text-on-basic-container","hover:bg-basic-container-hovered","enabled:active:bg-basic-container-pressed","focus-visible:bg-basic-container-focused"]},{intent:"success",design:"tinted",class:["bg-success-container","text-on-success-container","hover:bg-success-container-hovered","enabled:active:bg-success-container-pressed","focus-visible:bg-success-container-focused"]},{intent:"alert",design:"tinted",class:["bg-alert-container","text-on-alert-container","hover:bg-alert-container-hovered","enabled:active:bg-alert-container-pressed","focus-visible:bg-alert-container-focused"]},{intent:"danger",design:"tinted",class:["bg-error-container","text-on-error-container","hover:bg-error-container-hovered","enabled:active:bg-error-container-pressed","focus-visible:bg-error-container-focused"]},{intent:"info",design:"tinted",class:["bg-info-container","text-on-info-container","hover:bg-info-container-hovered","enabled:active:bg-info-container-pressed","focus-visible:bg-info-container-focused"]},{intent:"neutral",design:"tinted",class:["bg-neutral-container","text-on-neutral-container","hover:bg-neutral-container-hovered","enabled:active:bg-neutral-container-pressed","focus-visible:bg-neutral-container-focused"]},{intent:"surface",design:"tinted",class:["bg-surface","text-on-surface","hover:bg-surface-hovered","enabled:active:bg-surface-pressed","focus-visible:bg-surface-focused"]}],lt=[{intent:"main",design:"contrast",class:["text-main","hover:bg-main-container-hovered","enabled:active:bg-main-container-pressed","focus-visible:bg-main-container-focused"]},{intent:"support",design:"contrast",class:["text-support","hover:bg-support-container-hovered","enabled:active:bg-support-container-pressed","focus-visible:bg-support-container-focused"]},{intent:"accent",design:"contrast",class:["text-accent","hover:bg-accent-container-hovered","enabled:active:bg-accent-container-pressed","focus-visible:bg-accent-container-focused"]},{intent:"basic",design:"contrast",class:["text-basic","hover:bg-basic-container-hovered","enabled:active:bg-basic-container-pressed","focus-visible:bg-basic-container-focused"]},{intent:"success",design:"contrast",class:["text-success","hover:bg-success-container-hovered","enabled:active:bg-success-container-pressed","focus-visible:bg-success-container-focused"]},{intent:"alert",design:"contrast",class:["text-alert","hover:bg-alert-container-hovered","enabled:active:bg-alert-container-pressed","focus-visible:bg-alert-container-focused"]},{intent:"danger",design:"contrast",class:["text-error","hover:bg-error-container-hovered","enabled:active:bg-error-container-pressed","focus-visible:bg-error-container-focused"]},{intent:"info",design:"contrast",class:["text-info","hover:bg-info-container-hovered","enabled:active:bg-info-container-pressed","focus-visible:bg-info-container-focused"]},{intent:"neutral",design:"contrast",class:["text-neutral","hover:bg-neutral-container-hovered","enabled:active:bg-neutral-container-pressed","focus-visible:bg-neutral-container-focused"]},{intent:"surface",design:"contrast",class:["text-on-surface","hover:bg-surface-hovered","enabled:active:bg-surface-pressed","focus-visible:bg-surface-focused"]}],ct=b.cva(["u-shadow-border-transition","box-border inline-flex items-center justify-center gap-md whitespace-nowrap","px-lg","text-body-1 font-bold","focus-visible:outline-none focus-visible:u-ring [&:not(:focus-visible)]:ring-inset"],{variants:{design:{filled:[],outlined:["bg-transparent","border-sm","border-current"],tinted:[],ghost:[],contrast:["bg-surface"]},intent:{main:[],support:[],accent:[],basic:[],success:[],alert:[],danger:[],info:[],neutral:[],surface:[]},size:{sm:["min-w-sz-32","h-sz-32"],md:["min-w-sz-44","h-sz-44"],lg:["min-w-sz-56","h-sz-56"]},shape:{rounded:["rounded-lg"],square:["rounded-none"],pill:["rounded-full"]},disabled:{true:["cursor-not-allowed","opacity-dim-3"]}},compoundVariants:[...at,...ot,...it,...rt,...lt],defaultVariants:{design:"filled",intent:"main",size:"md",shape:"rounded"}}),dt=["onClick","onMouseDown","onMouseUp","onMouseEnter","onMouseLeave","onMouseOver","onMouseOut","onKeyDown","onKeyPress","onKeyUp","onSubmit"],Ve=e.forwardRef(({children:t,design:n="filled",disabled:s=!1,intent:a="main",isLoading:r=!1,loadingLabel:l,loadingText:o,shape:i="rounded",size:c="md",spinnerPlacement:m="left",asChild:u,className:h,...g},f)=>{const p=u?nt:"button",v=!!s||r,S=e.useMemo(()=>{const x={};return v&&dt.forEach(w=>x[w]=void 0),x},[v]),O={size:"current",className:o?"inline-block":"absolute",...l&&{"aria-label":l}};return e.createElement(p,{"data-spark-component":"button",...p==="button"&&{type:"button"},ref:f,className:ct({className:h,design:n,disabled:v,intent:a,shape:i,size:c}),disabled:!!s,"aria-busy":r,"aria-live":r?"assertive":"off",...g,...S},((x,w,P)=>x?e.isValidElement(w)?e.cloneElement(w,void 0,P(w.props.children)):null:P(w))(u,t,x=>r?e.createElement(e.Fragment,null,m==="left"&&e.createElement(ve,{...O}),o&&o,m==="right"&&e.createElement(ve,{...O}),e.createElement("div",{"aria-hidden":!0,className:b.cx("inline-flex gap-md",o?"hidden":"opacity-0")},x)):x))});Ve.displayName="Button",Object.freeze(Object.defineProperty({__proto__:null},Symbol.toStringTag,{value:"Module"})),Object.freeze(Object.defineProperty({__proto__:null,designs:["filled","outlined","tinted","ghost","contrast","dashed"],intents:["current","main","support","success","error","info","alert","danger","neutral","surface","accent","basic"],shapes:["rounded","square","pill"],sizes:["current","sm","md","lg","xl"]},Symbol.toStringTag,{value:"Module"}));const ut=b.cva(["px-none"],{variants:{size:{sm:["text-body-1"],md:["text-body-1"],lg:["text-display-3"]}}}),ze=e.forwardRef(({design:t="filled",disabled:n=!1,intent:s="main",shape:a="rounded",size:r="md",className:l,...o},i)=>e.createElement(Ve,{ref:i,className:ut({size:r,className:l}),design:t,disabled:n,intent:s,shape:a,size:r,...o}));ze.displayName="IconButton";const $=e.forwardRef(({title:t,fill:n="currentColor",stroke:s="none",...a},r)=>e.createElement("svg",{ref:r,viewBox:"0 0 24 24",xmlns:"http://www.w3.org/2000/svg","data-title":"ArrowHorizontalDown",...t&&{"data-title":t},fill:n,stroke:s,...a,dangerouslySetInnerHTML:{__html:(t===void 0?"":`<title>${t}</title>`)+'<path fill-rule="evenodd" d="m2.33,7.3c.43-.4,1.14-.4,1.57,0l8.1,7.48,8.1-7.48c.43-.4,1.14-.4,1.57,0,.43.4.43,1.06,0,1.47l-8.34,7.7c-.17.17-.37.3-.6.39-.23.09-.48.14-.73.14s-.5-.05-.73-.14c-.23-.09-.43-.22-.6-.39L2.33,8.77c-.43-.4-.43-1.06,0-1.47Z"/>'}}));function bt(...t){return n=>{t.forEach(s=>function(a,r){if(a!=null)if(typeof a!="function")try{a.current=r}catch{throw new Error(`Cannot assign value '${r}' to ref '${a}'`)}else a(r)}(s,n))}}function D(...t){return e.useMemo(()=>bt(...t),t)}$.displayName="ArrowHorizontalDown";const Z=e.forwardRef(({className:t,closedLabel:n,openedLabel:s,intent:a="neutral",design:r="ghost",size:l="sm",...o},i)=>{const{getToggleButtonProps:c}=E(),{ref:m,...u}=c(),h=u["aria-expanded"],g=D(i,m);return e.createElement(ze,{ref:g,className:t,intent:a,design:r,size:l,...u,...o,"aria-label":h?s:n},e.createElement(R.Icon,null,e.createElement(R.Icon,{className:"shrink-0",size:"sm"},e.createElement($,null))))});Z.displayName="Combobox.Disclosure";const U=e.forwardRef(({className:t},n)=>e.createElement("div",{ref:n,className:b.cx("my-md border-b-sm border-outline",t)}));U.displayName="Combobox.Divider";const W=e.forwardRef(({className:t,children:n},s)=>{const{filteredItemsMap:a}=E();return a.size===0?e.createElement("div",{ref:s,className:t},n):null});W.displayName="Combobox.Empty";const Oe=e.createContext(null),mt=({children:t})=>{const n=k.useId();return e.createElement(Oe.Provider,{value:{labelId:n}},t)},Se=()=>{const t=e.useContext(Oe);if(!t)throw Error("useComboboxGroupContext must be used within a ComboboxGroup provider");return t},J=e.forwardRef(({children:t,...n},s)=>e.createElement(mt,null,e.createElement(gt,{ref:s,...n},t))),gt=e.forwardRef(({children:t,className:n},s)=>{const{labelId:a}=Se();return e.createElement("div",{ref:s,role:"group","aria-labelledby":a,className:b.cx(n)},t)});J.displayName="Combobox.Group";const Q=e.forwardRef(({"aria-label":t,className:n,value:s,placeholder:a,onValueChange:r,...l},o)=>{const i=E(),c=s!=null,m=i.multiple&&i.selectedItems.length?i.selectedItems.map(v=>v.text).join(", "):a;e.useEffect(()=>{i.setIsInputControlled(c),c&&i.setInputValue(s)},[c,s]),e.useEffect(()=>{r&&i.setOnInputValueChange(()=>r),i.multiple||!i.selectedItem||c||i.setInputValue(i.selectedItem.text)},[]);const[u,h]=i.hasPopover?[_.Popover.Trigger,{asChild:!0,type:void 0}]:[e.Fragment,{}],{ref:g,...f}=i.getInputProps({...i.getDropdownProps(),onKeyDown:()=>{i.setLastInteractionType("keyboard")}}),p=D(o,g);return e.createElement(e.Fragment,null,t&&e.createElement(xe.VisuallyHidden,null,e.createElement("label",{...i.getLabelProps()},t)),e.createElement(u,{...h},e.createElement("input",{"data-spark-component":"combobox-input",ref:p,type:"text",placeholder:m,disabled:i.disabled||i.readOnly,className:b.cx("text-ellipsis",n),...l,...f,value:i.inputValue})))});Q.displayName="Combobox.Input";const Te=e.createContext(null),pt=({value:t,disabled:n=!1,children:s})=>{const{multiple:a,itemsMap:r,selectedItem:l,selectedItems:o}=E(),[i,c]=e.useState(void 0),m=function(g,f){let p=0;for(const[v]of g.entries()){if(v===f)return p;p++}return-1}(r,t),u={disabled:n,value:t,text:G(s)},h=a?o.some(g=>g.value===t):l?.value===t;return e.createElement(Te.Provider,{value:{textId:i,setTextId:c,isSelected:h,itemData:u,index:m,disabled:n}},s)},X=()=>{const t=e.useContext(Te);if(!t)throw Error("useComboboxItemContext must be used within a ComboboxItem provider");return t},Y=e.forwardRef(({children:t,...n},s)=>{const{value:a,disabled:r}=n;return e.createElement(pt,{value:a,disabled:r},e.createElement(vt,{ref:s,...n},t))}),ft=b.cva("px-lg py-md text-body-1",{variants:{selected:{true:"font-bold"},disabled:{true:"opacity-dim-3 cursor-not-allowed",false:"cursor-pointer"},highlighted:{true:""},interactionType:{mouse:"",keyboard:""}},compoundVariants:[{highlighted:!0,interactionType:"mouse",class:"bg-surface-hovered"},{highlighted:!0,interactionType:"keyboard",class:"u-ring"}]}),vt=e.forwardRef(({className:t,disabled:n=!1,value:s,children:a},r)=>{const{getItemProps:l,highlightedItem:o,lastInteractionType:i,filteredItemsMap:c}=E(),{textId:m,index:u,itemData:h,isSelected:g}=X(),f=o?.value===s,p=Array.from(c).some(([x])=>x===s),{ref:v,...S}=l({item:h,index:u}),O=D(r,v);return p?e.createElement("li",{ref:O,className:b.cx(ft({selected:g,disabled:n,highlighted:f,interactionType:i,className:t})),key:s,...S,"aria-selected":g,"aria-labelledby":m},a):null});Y.displayName="Combobox.Item";const Pe=e.forwardRef(({title:t,fill:n="currentColor",stroke:s="none",...a},r)=>e.createElement("svg",{ref:r,viewBox:"0 0 24 24",xmlns:"http://www.w3.org/2000/svg","data-title":"Check",...t&&{"data-title":t},fill:n,stroke:s,...a,dangerouslySetInnerHTML:{__html:(t===void 0?"":`<title>${t}</title>`)+'<path d="m8.92,19.08c-.18,0-.36-.03-.53-.1s-.33-.17-.47-.31l-5.49-5.34c-.28-.28-.42-.61-.42-1s.14-.73.42-1c.28-.28.62-.41,1.02-.41s.74.14,1.05.41l4.43,4.3,10.62-10.29c.28-.28.62-.42,1.02-.43.39,0,.73.13,1.02.43.28.28.42.61.42,1s-.14.73-.42,1l-11.65,11.32c-.14.14-.3.24-.47.31-.17.07-.35.1-.53.1Z"/>'}}));Pe.displayName="Check";const ee=e.forwardRef(({className:t,children:n,label:s},a)=>{const{disabled:r,isSelected:l}=X(),o=n||e.createElement(R.Icon,{size:"sm"},e.createElement(Pe,{"aria-label":s}));return e.createElement("span",{ref:a,className:b.cx("flex min-h-sz-16 min-w-sz-16",r&&"opacity-dim-3",t)},l&&o)});ee.displayName="Combobox.ItemIndicator";const te=e.forwardRef(({children:t,className:n,...s},a)=>{const{isOpen:r,getMenuProps:l,hasPopover:o,setLastInteractionType:i}=E(),{ref:c,...m}=l({onMouseMove:()=>{i("mouse")}}),u=D(a,c);return e.createElement("ul",{ref:u,className:b.cx(n,"flex flex-col",r?"block":"pointer-events-none opacity-0",o&&"p-lg"),...s,...m,"data-spark-component":"combobox-items"},t)});te.displayName="Combobox.Items";const ne=e.forwardRef(({children:t},n)=>{const s=k.useId(),{setTextId:a}=X();return e.useEffect(()=>(a(s),()=>a(void 0))),e.createElement("span",{id:s,className:b.cx("inline"),ref:n},t)});ne.displayName="Combobox.ItemText";const se=e.forwardRef(({children:t,className:n},s)=>{const{labelId:a}=Se();return e.createElement("div",{ref:s,id:a,className:b.cx("px-md py-sm text-body-2 italic text-neutral",n)},t)});se.displayName="Combobox.Label";const j=({children:t})=>e.createElement(R.Icon,{size:"sm",className:"shrink-0"},t);j.displayName="Combobox.LeadingIcon";const ae=e.forwardRef(({children:t,matchTriggerWidth:n=!0,sideOffset:s=4,className:a,...r},l)=>{const{isOpen:o,setHasPopover:i}=E();return e.useEffect(()=>(i(!0),()=>i(!1)),[]),e.createElement(_.Popover.Content,{ref:l,inset:!0,asChild:!0,matchTriggerWidth:n,className:b.cx("!z-dropdown",!o&&"hidden",a),sideOffset:s,onOpenAutoFocus:c=>{c.preventDefault()},...r,"data-spark-component":"combobox-popover"},t)});ae.displayName="Combobox.Popover";const ht=b.cva(["flex w-full items-center justify-between","min-h-sz-44 rounded-lg bg-surface text-on-surface px-lg","ring-1 outline-none ring-inset focus:ring-2"],{variants:{state:{undefined:"ring-outline focus:ring-outline-high",error:"ring-error",alert:"ring-alert",success:"ring-success"},disabled:{true:"disabled:bg-on-surface/dim-5 cursor-not-allowed text-on-surface/dim-3"},readOnly:{true:"disabled:bg-on-surface/dim-5 cursor-not-allowed text-on-surface/dim-3"}},compoundVariants:[{disabled:!1,state:void 0,class:"hover:ring-outline-high"}]}),re=e.forwardRef(({className:t,children:n},s)=>{const{hasPopover:a,disabled:r,readOnly:l,state:o}=E(),[i,c]=a?[_.Popover.Anchor,{asChild:!0,type:void 0}]:[e.Fragment,{}];return e.createElement(e.Fragment,null,e.createElement(i,{...c},e.createElement("div",{ref:s,className:ht({className:t,state:o,disabled:r,readOnly:l})},e.createElement(j,null,e.createElement($,null)),e.createElement("p",null,"[selected items chips (v2)]"),n,e.createElement("p",null,"[clear]"))))});re.displayName="Combobox.Trigger";const he=Object.assign(we,{Group:J,Item:Y,Items:te,ItemText:ne,ItemIndicator:ee,Label:se,Popover:ae,Divider:U,Trigger:re,LeadingIcon:j,Empty:W,Input:Q,Disclosure:Z});he.displayName="Combobox",J.displayName="Combobox.Group",te.displayName="Combobox.Items",Y.displayName="Combobox.Item",ne.displayName="Combobox.ItemText",ee.displayName="Combobox.ItemIndicator",se.displayName="Combobox.Label",ae.displayName="Combobox.Popover",U.displayName="Combobox.Divider",re.displayName="Combobox.Trigger",j.displayName="Combobox.LeadingIcon",W.displayName="Combobox.Empty",Q.displayName="Combobox.Input",Z.displayName="Combobox.Disclosure",exports.Combobox=he,exports.ComboboxProvider=Ee,exports.useComboboxContext=E;

package.json

 {
   "name": "@spark-ui/combobox",
-  "version": "0.3.3",
+  "version": "0.3.4",
   "description": "An input that behaves similarly to a select, with the addition of a free text input to filter options.",
@@ -35,3 +35,3 @@ "publishConfig": {
     "@spark-ui/icons": "^1.21.6",
-    "@spark-ui/popover": "^1.5.2",
+    "@spark-ui/popover": "^1.5.4",
     "@spark-ui/visually-hidden": "^1.2.0",
@@ -55,3 +55,3 @@ "class-variance-authority": "0.7.0",
   "license": "MIT",
-  "gitHead": "eae4a7f5e656a4bd71e0add1b4c2d5595af2f02b"
+  "gitHead": "d95b0c2a02ea5776930c5e1d0459497800e5b2bf"
 }

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

377092

increased by0.07%

Dependency changes

• Updated@spark-ui/popover@^1.5.4