@data-slot/combobox 0.2.123 → 0.2.124

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.cjs CHANGED
@@ -1 +1 @@
1
- Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});let e=require(`@data-slot/core`);const t=[`top`,`bottom`],n=[`start`,`center`,`end`];function r(r,a={}){let o=(0,e.getPart)(r,`combobox-input`),s=(0,e.getPart)(r,`combobox-content`),c=(0,e.getPart)(r,`combobox-list`)??(0,e.getPart)(s??r,`combobox-list`),l=(0,e.getPart)(r,`combobox-trigger`),u=(0,e.getPart)(r,`combobox-clear`),d=(0,e.getPart)(r,`combobox-value`),f=(0,e.getPart)(c??s??r,`combobox-empty`),p=(0,e.getPart)(r,`combobox-positioner`),m=p&&s&&p.contains(s)?p:null,h=(0,e.getPart)(r,`combobox-portal`),ee=h&&m&&h.contains(m)?h:null;if(!o||!s)throw Error(`Combobox requires combobox-input and combobox-content slots`);let g=s.contains(o),te=d?.textContent?.trim()??``,ne=a.defaultValue??(0,e.getDataString)(r,`defaultValue`)??null,re=a.defaultOpen??(0,e.getDataBool)(r,`defaultOpen`)??!1,_=a.placeholder??(0,e.getDataString)(r,`placeholder`)??``,v=a.disabled??(0,e.getDataBool)(r,`disabled`)??!1,ie=a.required??(0,e.getDataBool)(r,`required`)??!1,ae=a.name??(0,e.getDataString)(r,`name`)??null,oe=a.openOnFocus??(0,e.getDataBool)(r,`openOnFocus`)??!0,y=a.autoHighlight??(0,e.getDataBool)(r,`autoHighlight`)??!1,se=a.filter??null,ce=a.onValueChange,le=a.onOpenChange,ue=a.onInputValueChange,b=a.itemToStringValue??null,de=(t,n)=>(0,e.getDataEnum)(s,t,n)??(m?(0,e.getDataEnum)(m,t,n):void 0)??(0,e.getDataEnum)(r,t,n),x=t=>(0,e.getDataNumber)(s,t)??(m?(0,e.getDataNumber)(m,t):void 0)??(0,e.getDataNumber)(r,t),fe=t=>(0,e.getDataBool)(s,t)??(m?(0,e.getDataBool)(m,t):void 0)??(0,e.getDataBool)(r,t),pe=a.side??de(`side`,t)??`bottom`,me=a.align??de(`align`,n)??`start`,S=a.sideOffset??x(`sideOffset`)??4,he=a.alignOffset??x(`alignOffset`)??0,ge=a.avoidCollisions??fe(`avoidCollisions`)??!0,C=a.collisionPadding??x(`collisionPadding`)??8,w=!1,T=ne,E=-1,D=!1,O=null,k=[],A=r.ownerDocument??document,j=A.defaultView??window,_e=r,ve=-1/0,M=!1,N=!1,P=[],ye=[],F=[],I=new Map,L=null,R=(0,e.createPortalLifecycle)({content:s,root:r,wrapperSlot:m?void 0:`combobox-positioner`,container:m??void 0,mountTarget:m?ee??m:void 0}),be=!1,z=e=>typeof j.matchMedia==`function`?j.matchMedia(e).matches:!1,B=(()=>{let e=typeof j.navigator.maxTouchPoints==`number`?j.navigator.maxTouchPoints:0,t=z(`(pointer: coarse)`),n=z(`(hover: none)`);return t||e>0&&n})(),V=e=>e.hasAttribute(`disabled`)||e.hasAttribute(`data-disabled`)||e.getAttribute(`aria-disabled`)===`true`,H=e=>{if(e.dataset.label)return e.dataset.label;let t=``;for(let n of e.childNodes)n.nodeType===Node.TEXT_NODE&&(t+=n.textContent);return t.trim()||(e.textContent?.trim()??``)},U=e=>e.hasAttribute(`data-value`)?e.getAttribute(`data-value`):void 0,xe=t=>t===null?null:(0,e.getParts)(c??s,`combobox-item`).find(e=>U(e)===t)??null,W=e=>{let t=xe(e);return b?b(t,e):t?H(t):``},Se=(0,e.ensureId)(o,`combobox-input`),G=c??s,Ce=(0,e.ensureId)(G,`combobox-list`);o.setAttribute(`role`,`combobox`),o.setAttribute(`aria-autocomplete`,`list`),o.setAttribute(`autocomplete`,`off`),o.setAttribute(`aria-controls`,Ce),c?c.setAttribute(`role`,`listbox`):s.setAttribute(`role`,`listbox`),l&&(l.hasAttribute(`type`)||l.setAttribute(`type`,`button`),l.hasAttribute(`tabindex`)||(l.tabIndex=-1),l.setAttribute(`aria-label`,`Toggle`)),u instanceof HTMLButtonElement&&!u.hasAttribute(`type`)&&u.setAttribute(`type`,`button`),u&&!u.hasAttribute(`tabindex`)&&(u.tabIndex=-1);let we=document.querySelector(`label[for="${CSS.escape(Se)}"]`);if(we){let t=(0,e.ensureId)(we,`combobox-label`),n=o.getAttribute(`aria-labelledby`);o.setAttribute(`aria-labelledby`,n?`${n} ${t}`:t),G.setAttribute(`aria-labelledby`,t)}v&&(o.setAttribute(`aria-disabled`,`true`),o.disabled=!0,l&&(l.setAttribute(`aria-disabled`,`true`),l.setAttribute(`data-disabled`,``))),ie&&(o.setAttribute(`aria-required`,`true`),o.required=!0);let Te=()=>{ie&&o.setCustomValidity(T===null?`Please select a value`:``)};_&&(o.placeholder=_),d&&(d.textContent=te||_,d.textContent.trim().length>0&&(d.setAttribute(`data-placeholder`,``),l?.setAttribute(`data-placeholder`,``))),ae&&(o.name&&o.removeAttribute(`name`),L=document.createElement(`input`),L.type=`hidden`,L.name=ae,L.value=T??``,r.appendChild(L));let Ee=se??((e,t,n)=>n.toLowerCase().includes(e.toLowerCase())),De=(t,n)=>{(0,e.setAria)(t,`selected`,n),n?t.setAttribute(`data-selected`,``):t.removeAttribute(`data-selected`);let r=(0,e.getParts)(t,`combobox-item-indicator`);for(let e of r)e.hidden=!n},Oe=()=>{let t=c??s;P=(0,e.getParts)(t,`combobox-item`);for(let t of P)t.setAttribute(`role`,`option`),(0,e.ensureId)(t,`combobox-item`),V(t)?t.setAttribute(`aria-disabled`,`true`):t.removeAttribute(`aria-disabled`),De(t,U(t)===T);let n=(0,e.getParts)(t,`combobox-group`);for(let t of n){t.setAttribute(`role`,`group`);let n=(0,e.getPart)(t,`combobox-label`);if(n){let r=(0,e.ensureId)(n,`combobox-label`);t.setAttribute(`aria-labelledby`,r)}}ke()},ke=()=>{ye=P.filter(e=>!e.hidden),F=ye.filter(e=>!V(e)),I=new Map(F.map((e,t)=>[e,t]))},Ae=t=>{let n=(0,e.getParts)(t,`combobox-separator`);for(let e of n)e.hidden=!0;let r=Array.from(t.children).filter(e=>e instanceof HTMLElement);for(let e=0;e<r.length;e++){let t=r[e];if(t.dataset.slot===`combobox-separator`||t.hidden)continue;let n=e+1,i=null;for(;n<r.length;){let e=r[n];if(e.dataset.slot===`combobox-separator`){i??=e,n+=1;continue}if(e.hidden){n+=1;continue}i&&(i.hidden=!1);break}}},K=t=>{let n=c??s,r=t.trim(),i=0;for(let e of P){let t=U(e)??``,n=H(e),a=r===``||Ee(r,t,n);e.hidden=!a,a&&i++}let a=(0,e.getParts)(n,`combobox-group`);for(let t of a)t.hidden=!(0,e.getParts)(t,`combobox-item`).some(e=>!e.hidden);Ae(n),f&&(f.hidden=i>0),i===0?s.setAttribute(`data-empty`,``):s.removeAttribute(`data-empty`),ke()},je=(e,t,n)=>{let r=j.visualViewport,i=r?.offsetTop??0,a=r?.width??j.innerWidth,o=r?.height??j.innerHeight,c=Math.max(0,a-C*2),l=n===`top`?Math.max(0,t.top-i-C-S):Math.max(0,i+o-t.bottom-C-S),u=j.devicePixelRatio||1,d=(Math.round((t.x+t.width)*u)-Math.round(t.x*u))/u,f=(Math.round((t.y+t.height)*u)-Math.round(t.y*u))/u,p=e=>{e.style.setProperty(`--available-width`,`${c}px`),e.style.setProperty(`--available-height`,`${l}px`),e.style.setProperty(`--anchor-width`,`${d}px`),e.style.setProperty(`--anchor-height`,`${f}px`)};p(s),e!==s&&p(e)},Me=()=>{let n=R.container,r=B?`bottom`:O??pe,i=B?!1:ge,a=_e.getBoundingClientRect();s.style.minWidth=`${a.width}px`;let o=(0,e.computeFloatingPosition)({anchorRect:a,contentRect:(0,e.measurePopupContentRect)(s),side:r,align:me,sideOffset:S,alignOffset:he,avoidCollisions:i,collisionPadding:C,allowedSides:t}),c=(0,e.computeFloatingTransformOrigin)({side:o.side,align:o.align,anchorRect:a,popupX:o.x,popupY:o.y});n.style.position=`absolute`,n.style.top=`0px`,n.style.left=`0px`,n.style.transform=`translate3d(${o.x+j.scrollX}px, ${o.y+j.scrollY}px, 0)`,n.style.setProperty(`--transform-origin`,c),n.style.willChange=`transform`,n.style.margin=`0`,je(n,a,o.side),!B&&i&&(O=o.side),s.setAttribute(`data-side`,o.side),s.setAttribute(`data-align`,o.align),n!==s&&(n.setAttribute(`data-side`,o.side),n.setAttribute(`data-align`,o.align))},q=(0,e.createPositionSync)({observedElements:[r,s],isActive:()=>w,ancestorScroll:!0,onUpdate:Me,ignoreScrollTarget:e=>e instanceof Node&&s.contains(e)}),Ne=e=>c&&c.contains(e)&&c.scrollHeight>c.clientHeight?c:s,J=t=>{for(let e of P)e.removeAttribute(`data-highlighted`);let n=F[t];if(!n){E=-1,o.removeAttribute(`aria-activedescendant`);return}n.setAttribute(`data-highlighted`,``),o.setAttribute(`aria-activedescendant`,n.id),(0,e.ensureItemVisibleInContainer)(n,Ne(n)),E=t},Y=()=>{for(let e of P)e.removeAttribute(`data-highlighted`);E=-1,o.removeAttribute(`aria-activedescendant`)},X=e=>{r.setAttribute(`data-state`,e),s.setAttribute(`data-state`,e),l&&l.setAttribute(`data-state`,e),e===`open`?(r.setAttribute(`data-open`,``),s.setAttribute(`data-open`,``),l&&l.setAttribute(`data-open`,``),r.removeAttribute(`data-closed`),s.removeAttribute(`data-closed`),l&&l.removeAttribute(`data-closed`)):(r.setAttribute(`data-closed`,``),s.setAttribute(`data-closed`,``),l&&l.setAttribute(`data-closed`,``),r.removeAttribute(`data-open`),s.removeAttribute(`data-open`),l&&l.removeAttribute(`data-open`))},Z=(0,e.createPresenceLifecycle)({element:s,onExitComplete:()=>{be||(R.restore(),s.hidden=!0)}}),Q=(t,n=!1)=>{if(w!==t&&!(v&&t)){if(t){w=!0,O=null,(0,e.setAria)(o,`expanded`,!0),R.mount(),s.hidden=!1,X(`open`),Z.enter(),Oe(),D=!1,g&&(o.value=``),K(o.value);let t=F.findIndex(e=>U(e)===T);t>=0?J(t):Y(),q.start(),Me(),q.update(),requestAnimationFrame(()=>{w&&q.update()})}else w=!1,O=null,(0,e.setAria)(o,`expanded`,!1),X(`closed`),Y(),D=!1,q.stop(),Z.exit(),g?o.value=``:o.value=W(T);(0,e.emit)(r,`combobox:open-change`,{open:w}),le?.(w)}},$=(t,n=!1)=>{if(T===t&&!n)return;let i=T;T=t,Te(),L&&(L.value=t??``),t===null?r.removeAttribute(`data-value`):r.setAttribute(`data-value`,t);let a=c??s,u=P.length>0?P:(0,e.getParts)(a,`combobox-item`);for(let e of u)De(e,U(e)===t);let f=W(t);g||(o.value=f),d?t===null?(d.textContent=te||_,(d.textContent??``).trim().length>0?(d.setAttribute(`data-placeholder`,``),l?.setAttribute(`data-placeholder`,``)):(d.removeAttribute(`data-placeholder`),l?.removeAttribute(`data-placeholder`))):(d.textContent=f,d.removeAttribute(`data-placeholder`),l?.removeAttribute(`data-placeholder`)):l&&(t===null?l.setAttribute(`data-placeholder`,``):l.removeAttribute(`data-placeholder`)),!n&&i!==t&&((0,e.emit)(r,`combobox:change`,{value:t}),ce?.(t))},Pe=e=>{if(V(e))return;let t=U(e);t!==void 0&&($(t),Q(!1))},Fe=()=>{if(v||o.readOnly||u&&(u.hasAttribute(`disabled`)||u.getAttribute(`aria-disabled`)===`true`))return;$(null),o.value=``,Y(),w&&(K(o.value),q.update());let e=A.activeElement!==o;N=e,o.focus(),e||(N=!1)};return(0,e.setAria)(o,`expanded`,!1),s.hidden=!0,X(`closed`),$(T,!0),k.push((0,e.on)(A,`keydown`,e=>{e.key===`Tab`&&(ve=Date.now())},{capture:!0}),(0,e.on)(o,`pointerdown`,()=>{M=!0}),(0,e.on)(o,`input`,()=>{let t=o.value,n=t.trim()!==``;(0,e.emit)(r,`combobox:input-change`,{inputValue:t}),ue?.(t),w?(K(t),y&&n&&F.length>0?J(0):Y(),q.update()):(Q(!0),y&&n&&F.length>0?J(0):E!==-1&&Y())}),(0,e.on)(o,`keydown`,e=>{if(!v)switch(e.key){case`ArrowDown`:{if(e.preventDefault(),!w){Q(!0),y&&F.length>0&&J(0);return}D=!0;let t=F.length;if(t===0)return;J(E===-1?0:(E+1)%t);break}case`ArrowUp`:{if(e.preventDefault(),!w){Q(!0),y&&F.length>0&&J(F.length-1);return}D=!0;let t=F.length;if(t===0)return;J(E===-1?t-1:(E-1+t)%t);break}case`Home`:if(!w)return;e.preventDefault(),D=!0,F.length>0&&J(0);break;case`End`:if(!w)return;e.preventDefault(),D=!0,F.length>0&&J(F.length-1);break;case`Enter`:if(!w)return;e.preventDefault(),E>=0&&E<F.length&&Pe(F[E]);break;case`Escape`:w?(e.preventDefault(),Q(!1)):T!==null&&(e.preventDefault(),$(null));break;case`Tab`:w&&Q(!1,!0);break}}),(0,e.on)(o,`focus`,()=>{if(v)return;if(N){N=!1,M=!1;return}B||o.select();let e=M||Date.now()-ve<=750;M=!1,oe&&!w&&e&&Q(!0)})),l&&k.push((0,e.on)(l,`click`,()=>{v||(w?Q(!1):(Q(!0),o.focus()))})),u&&k.push((0,e.on)(u,`mousedown`,e=>{e.preventDefault()}),(0,e.on)(u,`click`,()=>{Fe()})),k.push((0,e.on)(s,`click`,e=>{let t=e.target.closest?.(`[data-slot="combobox-item"]`);t&&!t.hidden&&Pe(t)}),(0,e.on)(s,`pointermove`,e=>{let t=e.target.closest?.(`[data-slot="combobox-item"]`);if(!(D&&(D=!1,t&&I.get(t)===E)))if(t&&!V(t)&&!t.hidden){let e=I.get(t);e!==void 0&&e!==E&&J(e)}else Y()}),(0,e.on)(s,`pointerleave`,()=>{D||Y()}),(0,e.on)(s,`mousedown`,e=>{e.preventDefault()})),k.push((0,e.createDismissLayer)({root:r,isOpen:()=>w,onDismiss:()=>Q(!1),closeOnClickOutside:!B,closeOnEscape:!1})),B&&k.push((0,e.on)(A,`click`,t=>{if(!w)return;let n=t.target;(0,e.containsWithPortals)(r,n)||Q(!1)},{capture:!0})),k.push((0,e.on)(r,`combobox:set`,e=>{let t=e.detail;t?.value!==void 0&&$(t.value),t?.open!==void 0&&Q(t.open),t?.inputValue!==void 0&&(o.value=t.inputValue),t?.itemToStringValue!==void 0&&(b=t.itemToStringValue,$(T,!0))})),re&&Q(!0),{get value(){return T},get inputValue(){return o.value},get isOpen(){return w},select:e=>$(e),clear:()=>$(null),open:()=>Q(!0),close:()=>Q(!1),setItemToStringValue:e=>{b=e,$(T,!0)},destroy:()=>{be=!0,q.stop(),Z.cleanup(),R.cleanup(),k.forEach(e=>e()),k.length=0,L&&L.parentNode&&L.parentNode.removeChild(L),i.delete(r)}}}const i=new WeakSet;function a(t=document){let n=[];for(let a of(0,e.getRoots)(t,`combobox`))i.has(a)||(i.add(a),n.push(r(a)));return n}exports.create=a,exports.createCombobox=r;
1
+ Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});let e=require(`@data-slot/core`);const t=[`top`,`bottom`],n=[`start`,`center`,`end`],r=`@data-slot/combobox`;function i(i,a={}){let o=(0,e.reuseRootBinding)(i,r,`[@data-slot/combobox] createCombobox() called more than once for the same root. Returning the existing controller. Destroy it before rebinding with new options.`);if(o)return o;let s=(0,e.getPart)(i,`combobox-input`),c=(0,e.getPart)(i,`combobox-content`),l=(0,e.getPart)(i,`combobox-list`)??(0,e.getPart)(c??i,`combobox-list`),u=(0,e.getPart)(i,`combobox-trigger`),d=(0,e.getPart)(i,`combobox-clear`),f=(0,e.getPart)(i,`combobox-value`),p=(0,e.getPart)(l??c??i,`combobox-empty`),m=(0,e.getPart)(i,`combobox-positioner`),h=m&&c&&m.contains(c)?m:null,g=(0,e.getPart)(i,`combobox-portal`),ee=g&&h&&g.contains(h)?g:null;if(!s||!c)throw Error(`Combobox requires combobox-input and combobox-content slots`);let _=c.contains(s),te=f?.textContent?.trim()??``,ne=a.defaultValue??(0,e.getDataString)(i,`defaultValue`)??null,re=a.defaultOpen??(0,e.getDataBool)(i,`defaultOpen`)??!1,v=a.placeholder??(0,e.getDataString)(i,`placeholder`)??``,y=a.disabled??(0,e.getDataBool)(i,`disabled`)??!1,ie=a.required??(0,e.getDataBool)(i,`required`)??!1,ae=a.name??(0,e.getDataString)(i,`name`)??null,oe=a.openOnFocus??(0,e.getDataBool)(i,`openOnFocus`)??!0,b=a.autoHighlight??(0,e.getDataBool)(i,`autoHighlight`)??!1,se=a.filter??null,ce=a.onValueChange,le=a.onOpenChange,ue=a.onInputValueChange,x=a.itemToStringValue??null,de=(t,n)=>(0,e.getDataEnum)(c,t,n)??(h?(0,e.getDataEnum)(h,t,n):void 0)??(0,e.getDataEnum)(i,t,n),S=t=>(0,e.getDataNumber)(c,t)??(h?(0,e.getDataNumber)(h,t):void 0)??(0,e.getDataNumber)(i,t),fe=t=>(0,e.getDataBool)(c,t)??(h?(0,e.getDataBool)(h,t):void 0)??(0,e.getDataBool)(i,t),pe=a.side??de(`side`,t)??`bottom`,me=a.align??de(`align`,n)??`start`,C=a.sideOffset??S(`sideOffset`)??4,he=a.alignOffset??S(`alignOffset`)??0,ge=a.avoidCollisions??fe(`avoidCollisions`)??!0,w=a.collisionPadding??S(`collisionPadding`)??8,T=!1,E=ne,D=-1,O=!1,k=null,A=[],j=i.ownerDocument??document,M=j.defaultView??window,_e=i,ve=-1/0,N=!1,P=!1,F=[],ye=[],I=[],L=new Map,R=null,z=(0,e.createPortalLifecycle)({content:c,root:i,wrapperSlot:h?void 0:`combobox-positioner`,container:h??void 0,mountTarget:h?ee??h:void 0}),be=!1,xe=e=>typeof M.matchMedia==`function`?M.matchMedia(e).matches:!1,B=(()=>{let e=typeof M.navigator.maxTouchPoints==`number`?M.navigator.maxTouchPoints:0,t=xe(`(pointer: coarse)`),n=xe(`(hover: none)`);return t||e>0&&n})(),V=e=>e.hasAttribute(`disabled`)||e.hasAttribute(`data-disabled`)||e.getAttribute(`aria-disabled`)===`true`,Se=e=>{if(e.dataset.label)return e.dataset.label;let t=``;for(let n of e.childNodes)n.nodeType===Node.TEXT_NODE&&(t+=n.textContent);return t.trim()||(e.textContent?.trim()??``)},H=e=>e.hasAttribute(`data-value`)?e.getAttribute(`data-value`):void 0,Ce=t=>t===null?null:(0,e.getParts)(l??c,`combobox-item`).find(e=>H(e)===t)??null,U=e=>{let t=Ce(e);return x?x(t,e):t?Se(t):``},we=(0,e.ensureId)(s,`combobox-input`),Te=l??c,Ee=(0,e.ensureId)(Te,`combobox-list`);s.setAttribute(`role`,`combobox`),s.setAttribute(`aria-autocomplete`,`list`),s.setAttribute(`autocomplete`,`off`),s.setAttribute(`aria-controls`,Ee),l?l.setAttribute(`role`,`listbox`):c.setAttribute(`role`,`listbox`),u&&(u.hasAttribute(`type`)||u.setAttribute(`type`,`button`),u.hasAttribute(`tabindex`)||(u.tabIndex=-1),u.setAttribute(`aria-label`,`Toggle`)),d instanceof HTMLButtonElement&&!d.hasAttribute(`type`)&&d.setAttribute(`type`,`button`),d&&!d.hasAttribute(`tabindex`)&&(d.tabIndex=-1);let De=document.querySelector(`label[for="${CSS.escape(we)}"]`);if(De){let t=(0,e.ensureId)(De,`combobox-label`),n=s.getAttribute(`aria-labelledby`);s.setAttribute(`aria-labelledby`,n?`${n} ${t}`:t),Te.setAttribute(`aria-labelledby`,t)}y&&(s.setAttribute(`aria-disabled`,`true`),s.disabled=!0,u&&(u.setAttribute(`aria-disabled`,`true`),u.setAttribute(`data-disabled`,``))),ie&&(s.setAttribute(`aria-required`,`true`),s.required=!0);let Oe=()=>{ie&&s.setCustomValidity(E===null?`Please select a value`:``)};v&&(s.placeholder=v),f&&(f.textContent=te||v,f.textContent.trim().length>0&&(f.setAttribute(`data-placeholder`,``),u?.setAttribute(`data-placeholder`,``))),ae&&(s.name&&s.removeAttribute(`name`),R=document.createElement(`input`),R.type=`hidden`,R.name=ae,R.value=E??``,i.appendChild(R));let ke=se??((e,t,n)=>n.toLowerCase().includes(e.toLowerCase())),Ae=(t,n)=>{(0,e.setAria)(t,`selected`,n),n?t.setAttribute(`data-selected`,``):t.removeAttribute(`data-selected`);let r=(0,e.getParts)(t,`combobox-item-indicator`);for(let e of r)e.hidden=!n},je=()=>{let t=l??c;F=(0,e.getParts)(t,`combobox-item`);for(let t of F)t.setAttribute(`role`,`option`),(0,e.ensureId)(t,`combobox-item`),V(t)?t.setAttribute(`aria-disabled`,`true`):t.removeAttribute(`aria-disabled`),Ae(t,H(t)===E);let n=(0,e.getParts)(t,`combobox-group`);for(let t of n){t.setAttribute(`role`,`group`);let n=(0,e.getPart)(t,`combobox-label`);if(n){let r=(0,e.ensureId)(n,`combobox-label`);t.setAttribute(`aria-labelledby`,r)}}Me()},Me=()=>{ye=F.filter(e=>!e.hidden),I=ye.filter(e=>!V(e)),L=new Map(I.map((e,t)=>[e,t]))},Ne=t=>{let n=(0,e.getParts)(t,`combobox-separator`);for(let e of n)e.hidden=!0;let r=Array.from(t.children).filter(e=>e instanceof HTMLElement);for(let e=0;e<r.length;e++){let t=r[e];if(t.dataset.slot===`combobox-separator`||t.hidden)continue;let n=e+1,i=null;for(;n<r.length;){let e=r[n];if(e.dataset.slot===`combobox-separator`){i??=e,n+=1;continue}if(e.hidden){n+=1;continue}i&&(i.hidden=!1);break}}},W=t=>{let n=l??c,r=t.trim(),i=0;for(let e of F){let t=H(e)??``,n=Se(e),a=r===``||ke(r,t,n);e.hidden=!a,a&&i++}let a=(0,e.getParts)(n,`combobox-group`);for(let t of a)t.hidden=!(0,e.getParts)(t,`combobox-item`).some(e=>!e.hidden);Ne(n),p&&(p.hidden=i>0),i===0?c.setAttribute(`data-empty`,``):c.removeAttribute(`data-empty`),Me()},Pe=(e,t,n)=>{let r=M.visualViewport,i=r?.offsetTop??0,a=r?.width??M.innerWidth,o=r?.height??M.innerHeight,s=Math.max(0,a-w*2),l=n===`top`?Math.max(0,t.top-i-w-C):Math.max(0,i+o-t.bottom-w-C),u=M.devicePixelRatio||1,d=(Math.round((t.x+t.width)*u)-Math.round(t.x*u))/u,f=(Math.round((t.y+t.height)*u)-Math.round(t.y*u))/u,p=e=>{e.style.setProperty(`--available-width`,`${s}px`),e.style.setProperty(`--available-height`,`${l}px`),e.style.setProperty(`--anchor-width`,`${d}px`),e.style.setProperty(`--anchor-height`,`${f}px`)};p(c),e!==c&&p(e)},Fe=()=>{let n=z.container,r=B?`bottom`:k??pe,i=B?!1:ge,a=_e.getBoundingClientRect();c.style.minWidth=`${a.width}px`;let o=(0,e.computeFloatingPosition)({anchorRect:a,contentRect:(0,e.measurePopupContentRect)(c),side:r,align:me,sideOffset:C,alignOffset:he,avoidCollisions:i,collisionPadding:w,allowedSides:t}),s=(0,e.computeFloatingTransformOrigin)({side:o.side,align:o.align,anchorRect:a,popupX:o.x,popupY:o.y});n.style.position=`absolute`,n.style.top=`0px`,n.style.left=`0px`,n.style.transform=`translate3d(${o.x+M.scrollX}px, ${o.y+M.scrollY}px, 0)`,n.style.setProperty(`--transform-origin`,s),n.style.willChange=`transform`,n.style.margin=`0`,Pe(n,a,o.side),!B&&i&&(k=o.side),c.setAttribute(`data-side`,o.side),c.setAttribute(`data-align`,o.align),n!==c&&(n.setAttribute(`data-side`,o.side),n.setAttribute(`data-align`,o.align))},G=(0,e.createPositionSync)({observedElements:[i,c],isActive:()=>T,ancestorScroll:!0,onUpdate:Fe,ignoreScrollTarget:e=>e instanceof Node&&c.contains(e)}),Ie=e=>l&&l.contains(e)&&l.scrollHeight>l.clientHeight?l:c,K=t=>{for(let e of F)e.removeAttribute(`data-highlighted`);let n=I[t];if(!n){D=-1,s.removeAttribute(`aria-activedescendant`);return}n.setAttribute(`data-highlighted`,``),s.setAttribute(`aria-activedescendant`,n.id),(0,e.ensureItemVisibleInContainer)(n,Ie(n)),D=t},q=()=>{for(let e of F)e.removeAttribute(`data-highlighted`);D=-1,s.removeAttribute(`aria-activedescendant`)},J=e=>{i.setAttribute(`data-state`,e),c.setAttribute(`data-state`,e),u&&u.setAttribute(`data-state`,e),e===`open`?(i.setAttribute(`data-open`,``),c.setAttribute(`data-open`,``),u&&u.setAttribute(`data-open`,``),i.removeAttribute(`data-closed`),c.removeAttribute(`data-closed`),u&&u.removeAttribute(`data-closed`)):(i.setAttribute(`data-closed`,``),c.setAttribute(`data-closed`,``),u&&u.setAttribute(`data-closed`,``),i.removeAttribute(`data-open`),c.removeAttribute(`data-open`),u&&u.removeAttribute(`data-open`))},Y=(0,e.createPresenceLifecycle)({element:c,onExitComplete:()=>{be||(z.restore(),c.hidden=!0)}}),X=(t,n=!1)=>{if(T!==t&&!(y&&t)){if(t){T=!0,k=null,(0,e.setAria)(s,`expanded`,!0),z.mount(),c.hidden=!1,J(`open`),Y.enter(),je(),O=!1,_&&(s.value=``),W(s.value);let t=I.findIndex(e=>H(e)===E);t>=0?K(t):q(),G.start(),Fe(),G.update(),requestAnimationFrame(()=>{T&&G.update()})}else T=!1,k=null,(0,e.setAria)(s,`expanded`,!1),J(`closed`),q(),O=!1,G.stop(),Y.exit(),_?s.value=``:s.value=U(E);(0,e.emit)(i,`combobox:open-change`,{open:T}),le?.(T)}},Z=(t,n=!1)=>{if(E===t&&!n)return;let r=E;E=t,Oe(),R&&(R.value=t??``),t===null?i.removeAttribute(`data-value`):i.setAttribute(`data-value`,t);let a=l??c,o=F.length>0?F:(0,e.getParts)(a,`combobox-item`);for(let e of o)Ae(e,H(e)===t);let d=U(t);_||(s.value=d),f?t===null?(f.textContent=te||v,(f.textContent??``).trim().length>0?(f.setAttribute(`data-placeholder`,``),u?.setAttribute(`data-placeholder`,``)):(f.removeAttribute(`data-placeholder`),u?.removeAttribute(`data-placeholder`))):(f.textContent=d,f.removeAttribute(`data-placeholder`),u?.removeAttribute(`data-placeholder`)):u&&(t===null?u.setAttribute(`data-placeholder`,``):u.removeAttribute(`data-placeholder`)),!n&&r!==t&&((0,e.emit)(i,`combobox:change`,{value:t}),ce?.(t))},Q=e=>{if(V(e))return;let t=H(e);t!==void 0&&(Z(t),X(!1))},Le=()=>{if(y||s.readOnly||d&&(d.hasAttribute(`disabled`)||d.getAttribute(`aria-disabled`)===`true`))return;Z(null),s.value=``,q(),T&&(W(s.value),G.update());let e=j.activeElement!==s;P=e,s.focus(),e||(P=!1)};(0,e.setAria)(s,`expanded`,!1),c.hidden=!0,J(`closed`),Z(E,!0),A.push((0,e.on)(j,`keydown`,e=>{e.key===`Tab`&&(ve=Date.now())},{capture:!0}),(0,e.on)(s,`pointerdown`,()=>{N=!0}),(0,e.on)(s,`input`,()=>{let t=s.value,n=t.trim()!==``;(0,e.emit)(i,`combobox:input-change`,{inputValue:t}),ue?.(t),T?(W(t),b&&n&&I.length>0?K(0):q(),G.update()):(X(!0),b&&n&&I.length>0?K(0):D!==-1&&q())}),(0,e.on)(s,`keydown`,e=>{if(!y)switch(e.key){case`ArrowDown`:{if(e.preventDefault(),!T){X(!0),b&&I.length>0&&K(0);return}O=!0;let t=I.length;if(t===0)return;K(D===-1?0:(D+1)%t);break}case`ArrowUp`:{if(e.preventDefault(),!T){X(!0),b&&I.length>0&&K(I.length-1);return}O=!0;let t=I.length;if(t===0)return;K(D===-1?t-1:(D-1+t)%t);break}case`Home`:if(!T)return;e.preventDefault(),O=!0,I.length>0&&K(0);break;case`End`:if(!T)return;e.preventDefault(),O=!0,I.length>0&&K(I.length-1);break;case`Enter`:if(!T)return;e.preventDefault(),D>=0&&D<I.length&&Q(I[D]);break;case`Escape`:T?(e.preventDefault(),X(!1)):E!==null&&(e.preventDefault(),Z(null));break;case`Tab`:T&&X(!1,!0);break}}),(0,e.on)(s,`focus`,()=>{if(y)return;if(P){P=!1,N=!1;return}B||s.select();let e=N||Date.now()-ve<=750;N=!1,oe&&!T&&e&&X(!0)})),u&&A.push((0,e.on)(u,`click`,()=>{y||(T?X(!1):(X(!0),s.focus()))})),d&&A.push((0,e.on)(d,`mousedown`,e=>{e.preventDefault()}),(0,e.on)(d,`click`,()=>{Le()})),A.push((0,e.on)(c,`click`,e=>{let t=e.target.closest?.(`[data-slot="combobox-item"]`);t&&!t.hidden&&Q(t)}),(0,e.on)(c,`pointermove`,e=>{let t=e.target.closest?.(`[data-slot="combobox-item"]`);if(!(O&&(O=!1,t&&L.get(t)===D)))if(t&&!V(t)&&!t.hidden){let e=L.get(t);e!==void 0&&e!==D&&K(e)}else q()}),(0,e.on)(c,`pointerleave`,()=>{O||q()}),(0,e.on)(c,`mousedown`,e=>{e.preventDefault()})),A.push((0,e.createDismissLayer)({root:i,isOpen:()=>T,onDismiss:()=>X(!1),closeOnClickOutside:!B,closeOnEscape:!1})),B&&A.push((0,e.on)(j,`click`,t=>{if(!T)return;let n=t.target;(0,e.containsWithPortals)(i,n)||X(!1)},{capture:!0})),A.push((0,e.on)(i,`combobox:set`,e=>{let t=e.detail;t?.value!==void 0&&Z(t.value),t?.open!==void 0&&X(t.open),t?.inputValue!==void 0&&(s.value=t.inputValue),t?.itemToStringValue!==void 0&&(x=t.itemToStringValue,Z(E,!0))}));let $={get value(){return E},get inputValue(){return s.value},get isOpen(){return T},select:e=>Z(e),clear:()=>Z(null),open:()=>X(!0),close:()=>X(!1),setItemToStringValue:e=>{x=e,Z(E,!0)},destroy:()=>{be=!0,G.stop(),Y.cleanup(),z.cleanup(),A.forEach(e=>e()),A.length=0,R&&R.parentNode&&R.parentNode.removeChild(R),(0,e.clearRootBinding)(i,r,$)}};return(0,e.setRootBinding)(i,r,$),re&&X(!0),$}function a(t=document){let n=[];for(let a of(0,e.getRoots)(t,`combobox`))(0,e.hasRootBinding)(a,r)||n.push(i(a));return n}exports.create=a,exports.createCombobox=i;
package/dist/index.js CHANGED
@@ -1 +1 @@
1
- import{computeFloatingPosition as e,computeFloatingTransformOrigin as t,containsWithPortals as n,createDismissLayer as r,createPortalLifecycle as i,createPositionSync as a,createPresenceLifecycle as o,emit as s,ensureId as c,ensureItemVisibleInContainer as l,getDataBool as u,getDataEnum as d,getDataNumber as f,getDataString as ee,getPart as p,getParts as m,getRoots as h,measurePopupContentRect as te,on as g,setAria as _}from"@data-slot/core";const ne=[`top`,`bottom`],re=[`start`,`center`,`end`];function v(h,v={}){let y=p(h,`combobox-input`),b=p(h,`combobox-content`),x=p(h,`combobox-list`)??p(b??h,`combobox-list`),S=p(h,`combobox-trigger`),C=p(h,`combobox-clear`),w=p(h,`combobox-value`),ae=p(x??b??h,`combobox-empty`),oe=p(h,`combobox-positioner`),T=oe&&b&&oe.contains(b)?oe:null,se=p(h,`combobox-portal`),ce=se&&T&&se.contains(T)?se:null;if(!y||!b)throw Error(`Combobox requires combobox-input and combobox-content slots`);let le=b.contains(y),ue=w?.textContent?.trim()??``,de=v.defaultValue??ee(h,`defaultValue`)??null,fe=v.defaultOpen??u(h,`defaultOpen`)??!1,E=v.placeholder??ee(h,`placeholder`)??``,D=v.disabled??u(h,`disabled`)??!1,pe=v.required??u(h,`required`)??!1,me=v.name??ee(h,`name`)??null,he=v.openOnFocus??u(h,`openOnFocus`)??!0,O=v.autoHighlight??u(h,`autoHighlight`)??!1,ge=v.filter??null,_e=v.onValueChange,ve=v.onOpenChange,ye=v.onInputValueChange,k=v.itemToStringValue??null,be=(e,t)=>d(b,e,t)??(T?d(T,e,t):void 0)??d(h,e,t),xe=e=>f(b,e)??(T?f(T,e):void 0)??f(h,e),Se=e=>u(b,e)??(T?u(T,e):void 0)??u(h,e),Ce=v.side??be(`side`,ne)??`bottom`,we=v.align??be(`align`,re)??`start`,Te=v.sideOffset??xe(`sideOffset`)??4,Ee=v.alignOffset??xe(`alignOffset`)??0,De=v.avoidCollisions??Se(`avoidCollisions`)??!0,A=v.collisionPadding??xe(`collisionPadding`)??8,j=!1,M=de,N=-1,P=!1,F=null,I=[],L=h.ownerDocument??document,R=L.defaultView??window,Oe=h,ke=-1/0,z=!1,B=!1,V=[],Ae=[],H=[],je=new Map,U=null,W=i({content:b,root:h,wrapperSlot:T?void 0:`combobox-positioner`,container:T??void 0,mountTarget:T?ce??T:void 0}),Me=!1,Ne=e=>typeof R.matchMedia==`function`?R.matchMedia(e).matches:!1,G=(()=>{let e=typeof R.navigator.maxTouchPoints==`number`?R.navigator.maxTouchPoints:0,t=Ne(`(pointer: coarse)`),n=Ne(`(hover: none)`);return t||e>0&&n})(),K=e=>e.hasAttribute(`disabled`)||e.hasAttribute(`data-disabled`)||e.getAttribute(`aria-disabled`)===`true`,Pe=e=>{if(e.dataset.label)return e.dataset.label;let t=``;for(let n of e.childNodes)n.nodeType===Node.TEXT_NODE&&(t+=n.textContent);return t.trim()||(e.textContent?.trim()??``)},q=e=>e.hasAttribute(`data-value`)?e.getAttribute(`data-value`):void 0,Fe=e=>e===null?null:m(x??b,`combobox-item`).find(t=>q(t)===e)??null,Ie=e=>{let t=Fe(e);return k?k(t,e):t?Pe(t):``},Le=c(y,`combobox-input`),Re=x??b,ze=c(Re,`combobox-list`);y.setAttribute(`role`,`combobox`),y.setAttribute(`aria-autocomplete`,`list`),y.setAttribute(`autocomplete`,`off`),y.setAttribute(`aria-controls`,ze),x?x.setAttribute(`role`,`listbox`):b.setAttribute(`role`,`listbox`),S&&(S.hasAttribute(`type`)||S.setAttribute(`type`,`button`),S.hasAttribute(`tabindex`)||(S.tabIndex=-1),S.setAttribute(`aria-label`,`Toggle`)),C instanceof HTMLButtonElement&&!C.hasAttribute(`type`)&&C.setAttribute(`type`,`button`),C&&!C.hasAttribute(`tabindex`)&&(C.tabIndex=-1);let Be=document.querySelector(`label[for="${CSS.escape(Le)}"]`);if(Be){let e=c(Be,`combobox-label`),t=y.getAttribute(`aria-labelledby`);y.setAttribute(`aria-labelledby`,t?`${t} ${e}`:e),Re.setAttribute(`aria-labelledby`,e)}D&&(y.setAttribute(`aria-disabled`,`true`),y.disabled=!0,S&&(S.setAttribute(`aria-disabled`,`true`),S.setAttribute(`data-disabled`,``))),pe&&(y.setAttribute(`aria-required`,`true`),y.required=!0);let Ve=()=>{pe&&y.setCustomValidity(M===null?`Please select a value`:``)};E&&(y.placeholder=E),w&&(w.textContent=ue||E,w.textContent.trim().length>0&&(w.setAttribute(`data-placeholder`,``),S?.setAttribute(`data-placeholder`,``))),me&&(y.name&&y.removeAttribute(`name`),U=document.createElement(`input`),U.type=`hidden`,U.name=me,U.value=M??``,h.appendChild(U));let He=ge??((e,t,n)=>n.toLowerCase().includes(e.toLowerCase())),Ue=(e,t)=>{_(e,`selected`,t),t?e.setAttribute(`data-selected`,``):e.removeAttribute(`data-selected`);let n=m(e,`combobox-item-indicator`);for(let e of n)e.hidden=!t},We=()=>{let e=x??b;V=m(e,`combobox-item`);for(let e of V)e.setAttribute(`role`,`option`),c(e,`combobox-item`),K(e)?e.setAttribute(`aria-disabled`,`true`):e.removeAttribute(`aria-disabled`),Ue(e,q(e)===M);let t=m(e,`combobox-group`);for(let e of t){e.setAttribute(`role`,`group`);let t=p(e,`combobox-label`);if(t){let n=c(t,`combobox-label`);e.setAttribute(`aria-labelledby`,n)}}Ge()},Ge=()=>{Ae=V.filter(e=>!e.hidden),H=Ae.filter(e=>!K(e)),je=new Map(H.map((e,t)=>[e,t]))},Ke=e=>{let t=m(e,`combobox-separator`);for(let e of t)e.hidden=!0;let n=Array.from(e.children).filter(e=>e instanceof HTMLElement);for(let e=0;e<n.length;e++){let t=n[e];if(t.dataset.slot===`combobox-separator`||t.hidden)continue;let r=e+1,i=null;for(;r<n.length;){let e=n[r];if(e.dataset.slot===`combobox-separator`){i??=e,r+=1;continue}if(e.hidden){r+=1;continue}i&&(i.hidden=!1);break}}},J=e=>{let t=x??b,n=e.trim(),r=0;for(let e of V){let t=q(e)??``,i=Pe(e),a=n===``||He(n,t,i);e.hidden=!a,a&&r++}let i=m(t,`combobox-group`);for(let e of i)e.hidden=!m(e,`combobox-item`).some(e=>!e.hidden);Ke(t),ae&&(ae.hidden=r>0),r===0?b.setAttribute(`data-empty`,``):b.removeAttribute(`data-empty`),Ge()},qe=(e,t,n)=>{let r=R.visualViewport,i=r?.offsetTop??0,a=r?.width??R.innerWidth,o=r?.height??R.innerHeight,s=Math.max(0,a-A*2),c=n===`top`?Math.max(0,t.top-i-A-Te):Math.max(0,i+o-t.bottom-A-Te),l=R.devicePixelRatio||1,u=(Math.round((t.x+t.width)*l)-Math.round(t.x*l))/l,d=(Math.round((t.y+t.height)*l)-Math.round(t.y*l))/l,f=e=>{e.style.setProperty(`--available-width`,`${s}px`),e.style.setProperty(`--available-height`,`${c}px`),e.style.setProperty(`--anchor-width`,`${u}px`),e.style.setProperty(`--anchor-height`,`${d}px`)};f(b),e!==b&&f(e)},Je=()=>{let n=W.container,r=G?`bottom`:F??Ce,i=G?!1:De,a=Oe.getBoundingClientRect();b.style.minWidth=`${a.width}px`;let o=e({anchorRect:a,contentRect:te(b),side:r,align:we,sideOffset:Te,alignOffset:Ee,avoidCollisions:i,collisionPadding:A,allowedSides:ne}),s=t({side:o.side,align:o.align,anchorRect:a,popupX:o.x,popupY:o.y});n.style.position=`absolute`,n.style.top=`0px`,n.style.left=`0px`,n.style.transform=`translate3d(${o.x+R.scrollX}px, ${o.y+R.scrollY}px, 0)`,n.style.setProperty(`--transform-origin`,s),n.style.willChange=`transform`,n.style.margin=`0`,qe(n,a,o.side),!G&&i&&(F=o.side),b.setAttribute(`data-side`,o.side),b.setAttribute(`data-align`,o.align),n!==b&&(n.setAttribute(`data-side`,o.side),n.setAttribute(`data-align`,o.align))},Y=a({observedElements:[h,b],isActive:()=>j,ancestorScroll:!0,onUpdate:Je,ignoreScrollTarget:e=>e instanceof Node&&b.contains(e)}),Ye=e=>x&&x.contains(e)&&x.scrollHeight>x.clientHeight?x:b,X=e=>{for(let e of V)e.removeAttribute(`data-highlighted`);let t=H[e];if(!t){N=-1,y.removeAttribute(`aria-activedescendant`);return}t.setAttribute(`data-highlighted`,``),y.setAttribute(`aria-activedescendant`,t.id),l(t,Ye(t)),N=e},Z=()=>{for(let e of V)e.removeAttribute(`data-highlighted`);N=-1,y.removeAttribute(`aria-activedescendant`)},Xe=e=>{h.setAttribute(`data-state`,e),b.setAttribute(`data-state`,e),S&&S.setAttribute(`data-state`,e),e===`open`?(h.setAttribute(`data-open`,``),b.setAttribute(`data-open`,``),S&&S.setAttribute(`data-open`,``),h.removeAttribute(`data-closed`),b.removeAttribute(`data-closed`),S&&S.removeAttribute(`data-closed`)):(h.setAttribute(`data-closed`,``),b.setAttribute(`data-closed`,``),S&&S.setAttribute(`data-closed`,``),h.removeAttribute(`data-open`),b.removeAttribute(`data-open`),S&&S.removeAttribute(`data-open`))},Ze=o({element:b,onExitComplete:()=>{Me||(W.restore(),b.hidden=!0)}}),Q=(e,t=!1)=>{if(j!==e&&!(D&&e)){if(e){j=!0,F=null,_(y,`expanded`,!0),W.mount(),b.hidden=!1,Xe(`open`),Ze.enter(),We(),P=!1,le&&(y.value=``),J(y.value);let e=H.findIndex(e=>q(e)===M);e>=0?X(e):Z(),Y.start(),Je(),Y.update(),requestAnimationFrame(()=>{j&&Y.update()})}else j=!1,F=null,_(y,`expanded`,!1),Xe(`closed`),Z(),P=!1,Y.stop(),Ze.exit(),le?y.value=``:y.value=Ie(M);s(h,`combobox:open-change`,{open:j}),ve?.(j)}},$=(e,t=!1)=>{if(M===e&&!t)return;let n=M;M=e,Ve(),U&&(U.value=e??``),e===null?h.removeAttribute(`data-value`):h.setAttribute(`data-value`,e);let r=x??b,i=V.length>0?V:m(r,`combobox-item`);for(let t of i)Ue(t,q(t)===e);let a=Ie(e);le||(y.value=a),w?e===null?(w.textContent=ue||E,(w.textContent??``).trim().length>0?(w.setAttribute(`data-placeholder`,``),S?.setAttribute(`data-placeholder`,``)):(w.removeAttribute(`data-placeholder`),S?.removeAttribute(`data-placeholder`))):(w.textContent=a,w.removeAttribute(`data-placeholder`),S?.removeAttribute(`data-placeholder`)):S&&(e===null?S.setAttribute(`data-placeholder`,``):S.removeAttribute(`data-placeholder`)),!t&&n!==e&&(s(h,`combobox:change`,{value:e}),_e?.(e))},Qe=e=>{if(K(e))return;let t=q(e);t!==void 0&&($(t),Q(!1))},$e=()=>{if(D||y.readOnly||C&&(C.hasAttribute(`disabled`)||C.getAttribute(`aria-disabled`)===`true`))return;$(null),y.value=``,Z(),j&&(J(y.value),Y.update());let e=L.activeElement!==y;B=e,y.focus(),e||(B=!1)};return _(y,`expanded`,!1),b.hidden=!0,Xe(`closed`),$(M,!0),I.push(g(L,`keydown`,e=>{e.key===`Tab`&&(ke=Date.now())},{capture:!0}),g(y,`pointerdown`,()=>{z=!0}),g(y,`input`,()=>{let e=y.value,t=e.trim()!==``;s(h,`combobox:input-change`,{inputValue:e}),ye?.(e),j?(J(e),O&&t&&H.length>0?X(0):Z(),Y.update()):(Q(!0),O&&t&&H.length>0?X(0):N!==-1&&Z())}),g(y,`keydown`,e=>{if(!D)switch(e.key){case`ArrowDown`:{if(e.preventDefault(),!j){Q(!0),O&&H.length>0&&X(0);return}P=!0;let t=H.length;if(t===0)return;X(N===-1?0:(N+1)%t);break}case`ArrowUp`:{if(e.preventDefault(),!j){Q(!0),O&&H.length>0&&X(H.length-1);return}P=!0;let t=H.length;if(t===0)return;X(N===-1?t-1:(N-1+t)%t);break}case`Home`:if(!j)return;e.preventDefault(),P=!0,H.length>0&&X(0);break;case`End`:if(!j)return;e.preventDefault(),P=!0,H.length>0&&X(H.length-1);break;case`Enter`:if(!j)return;e.preventDefault(),N>=0&&N<H.length&&Qe(H[N]);break;case`Escape`:j?(e.preventDefault(),Q(!1)):M!==null&&(e.preventDefault(),$(null));break;case`Tab`:j&&Q(!1,!0);break}}),g(y,`focus`,()=>{if(D)return;if(B){B=!1,z=!1;return}G||y.select();let e=z||Date.now()-ke<=750;z=!1,he&&!j&&e&&Q(!0)})),S&&I.push(g(S,`click`,()=>{D||(j?Q(!1):(Q(!0),y.focus()))})),C&&I.push(g(C,`mousedown`,e=>{e.preventDefault()}),g(C,`click`,()=>{$e()})),I.push(g(b,`click`,e=>{let t=e.target.closest?.(`[data-slot="combobox-item"]`);t&&!t.hidden&&Qe(t)}),g(b,`pointermove`,e=>{let t=e.target.closest?.(`[data-slot="combobox-item"]`);if(!(P&&(P=!1,t&&je.get(t)===N)))if(t&&!K(t)&&!t.hidden){let e=je.get(t);e!==void 0&&e!==N&&X(e)}else Z()}),g(b,`pointerleave`,()=>{P||Z()}),g(b,`mousedown`,e=>{e.preventDefault()})),I.push(r({root:h,isOpen:()=>j,onDismiss:()=>Q(!1),closeOnClickOutside:!G,closeOnEscape:!1})),G&&I.push(g(L,`click`,e=>{if(!j)return;let t=e.target;n(h,t)||Q(!1)},{capture:!0})),I.push(g(h,`combobox:set`,e=>{let t=e.detail;t?.value!==void 0&&$(t.value),t?.open!==void 0&&Q(t.open),t?.inputValue!==void 0&&(y.value=t.inputValue),t?.itemToStringValue!==void 0&&(k=t.itemToStringValue,$(M,!0))})),fe&&Q(!0),{get value(){return M},get inputValue(){return y.value},get isOpen(){return j},select:e=>$(e),clear:()=>$(null),open:()=>Q(!0),close:()=>Q(!1),setItemToStringValue:e=>{k=e,$(M,!0)},destroy:()=>{Me=!0,Y.stop(),Ze.cleanup(),W.cleanup(),I.forEach(e=>e()),I.length=0,U&&U.parentNode&&U.parentNode.removeChild(U),ie.delete(h)}}}const ie=new WeakSet;function y(e=document){let t=[];for(let n of h(e,`combobox`))ie.has(n)||(ie.add(n),t.push(v(n)));return t}export{y as create,v as createCombobox};
1
+ import{clearRootBinding as e,computeFloatingPosition as t,computeFloatingTransformOrigin as n,containsWithPortals as r,createDismissLayer as i,createPortalLifecycle as a,createPositionSync as o,createPresenceLifecycle as ee,emit as s,ensureId as c,ensureItemVisibleInContainer as te,getDataBool as l,getDataEnum as u,getDataNumber as ne,getDataString as re,getPart as d,getParts as f,getRoots as p,hasRootBinding as m,measurePopupContentRect as ie,on as h,reuseRootBinding as ae,setAria as g,setRootBinding as oe}from"@data-slot/core";const se=[`top`,`bottom`],ce=[`start`,`center`,`end`],_=`@data-slot/combobox`;function v(p,m={}){let v=ae(p,_,`[@data-slot/combobox] createCombobox() called more than once for the same root. Returning the existing controller. Destroy it before rebinding with new options.`);if(v)return v;let y=d(p,`combobox-input`),b=d(p,`combobox-content`),x=d(p,`combobox-list`)??d(b??p,`combobox-list`),S=d(p,`combobox-trigger`),C=d(p,`combobox-clear`),w=d(p,`combobox-value`),le=d(x??b??p,`combobox-empty`),T=d(p,`combobox-positioner`),E=T&&b&&T.contains(b)?T:null,ue=d(p,`combobox-portal`),de=ue&&E&&ue.contains(E)?ue:null;if(!y||!b)throw Error(`Combobox requires combobox-input and combobox-content slots`);let fe=b.contains(y),pe=w?.textContent?.trim()??``,me=m.defaultValue??re(p,`defaultValue`)??null,he=m.defaultOpen??l(p,`defaultOpen`)??!1,D=m.placeholder??re(p,`placeholder`)??``,O=m.disabled??l(p,`disabled`)??!1,ge=m.required??l(p,`required`)??!1,_e=m.name??re(p,`name`)??null,ve=m.openOnFocus??l(p,`openOnFocus`)??!0,k=m.autoHighlight??l(p,`autoHighlight`)??!1,ye=m.filter??null,be=m.onValueChange,xe=m.onOpenChange,Se=m.onInputValueChange,A=m.itemToStringValue??null,Ce=(e,t)=>u(b,e,t)??(E?u(E,e,t):void 0)??u(p,e,t),we=e=>ne(b,e)??(E?ne(E,e):void 0)??ne(p,e),Te=e=>l(b,e)??(E?l(E,e):void 0)??l(p,e),Ee=m.side??Ce(`side`,se)??`bottom`,De=m.align??Ce(`align`,ce)??`start`,Oe=m.sideOffset??we(`sideOffset`)??4,ke=m.alignOffset??we(`alignOffset`)??0,Ae=m.avoidCollisions??Te(`avoidCollisions`)??!0,j=m.collisionPadding??we(`collisionPadding`)??8,M=!1,N=me,P=-1,F=!1,I=null,L=[],R=p.ownerDocument??document,z=R.defaultView??window,je=p,Me=-1/0,B=!1,V=!1,H=[],Ne=[],U=[],Pe=new Map,W=null,G=a({content:b,root:p,wrapperSlot:E?void 0:`combobox-positioner`,container:E??void 0,mountTarget:E?de??E:void 0}),Fe=!1,Ie=e=>typeof z.matchMedia==`function`?z.matchMedia(e).matches:!1,K=(()=>{let e=typeof z.navigator.maxTouchPoints==`number`?z.navigator.maxTouchPoints:0,t=Ie(`(pointer: coarse)`),n=Ie(`(hover: none)`);return t||e>0&&n})(),q=e=>e.hasAttribute(`disabled`)||e.hasAttribute(`data-disabled`)||e.getAttribute(`aria-disabled`)===`true`,Le=e=>{if(e.dataset.label)return e.dataset.label;let t=``;for(let n of e.childNodes)n.nodeType===Node.TEXT_NODE&&(t+=n.textContent);return t.trim()||(e.textContent?.trim()??``)},J=e=>e.hasAttribute(`data-value`)?e.getAttribute(`data-value`):void 0,Re=e=>e===null?null:f(x??b,`combobox-item`).find(t=>J(t)===e)??null,ze=e=>{let t=Re(e);return A?A(t,e):t?Le(t):``},Be=c(y,`combobox-input`),Ve=x??b,He=c(Ve,`combobox-list`);y.setAttribute(`role`,`combobox`),y.setAttribute(`aria-autocomplete`,`list`),y.setAttribute(`autocomplete`,`off`),y.setAttribute(`aria-controls`,He),x?x.setAttribute(`role`,`listbox`):b.setAttribute(`role`,`listbox`),S&&(S.hasAttribute(`type`)||S.setAttribute(`type`,`button`),S.hasAttribute(`tabindex`)||(S.tabIndex=-1),S.setAttribute(`aria-label`,`Toggle`)),C instanceof HTMLButtonElement&&!C.hasAttribute(`type`)&&C.setAttribute(`type`,`button`),C&&!C.hasAttribute(`tabindex`)&&(C.tabIndex=-1);let Ue=document.querySelector(`label[for="${CSS.escape(Be)}"]`);if(Ue){let e=c(Ue,`combobox-label`),t=y.getAttribute(`aria-labelledby`);y.setAttribute(`aria-labelledby`,t?`${t} ${e}`:e),Ve.setAttribute(`aria-labelledby`,e)}O&&(y.setAttribute(`aria-disabled`,`true`),y.disabled=!0,S&&(S.setAttribute(`aria-disabled`,`true`),S.setAttribute(`data-disabled`,``))),ge&&(y.setAttribute(`aria-required`,`true`),y.required=!0);let We=()=>{ge&&y.setCustomValidity(N===null?`Please select a value`:``)};D&&(y.placeholder=D),w&&(w.textContent=pe||D,w.textContent.trim().length>0&&(w.setAttribute(`data-placeholder`,``),S?.setAttribute(`data-placeholder`,``))),_e&&(y.name&&y.removeAttribute(`name`),W=document.createElement(`input`),W.type=`hidden`,W.name=_e,W.value=N??``,p.appendChild(W));let Ge=ye??((e,t,n)=>n.toLowerCase().includes(e.toLowerCase())),Ke=(e,t)=>{g(e,`selected`,t),t?e.setAttribute(`data-selected`,``):e.removeAttribute(`data-selected`);let n=f(e,`combobox-item-indicator`);for(let e of n)e.hidden=!t},qe=()=>{let e=x??b;H=f(e,`combobox-item`);for(let e of H)e.setAttribute(`role`,`option`),c(e,`combobox-item`),q(e)?e.setAttribute(`aria-disabled`,`true`):e.removeAttribute(`aria-disabled`),Ke(e,J(e)===N);let t=f(e,`combobox-group`);for(let e of t){e.setAttribute(`role`,`group`);let t=d(e,`combobox-label`);if(t){let n=c(t,`combobox-label`);e.setAttribute(`aria-labelledby`,n)}}Je()},Je=()=>{Ne=H.filter(e=>!e.hidden),U=Ne.filter(e=>!q(e)),Pe=new Map(U.map((e,t)=>[e,t]))},Ye=e=>{let t=f(e,`combobox-separator`);for(let e of t)e.hidden=!0;let n=Array.from(e.children).filter(e=>e instanceof HTMLElement);for(let e=0;e<n.length;e++){let t=n[e];if(t.dataset.slot===`combobox-separator`||t.hidden)continue;let r=e+1,i=null;for(;r<n.length;){let e=n[r];if(e.dataset.slot===`combobox-separator`){i??=e,r+=1;continue}if(e.hidden){r+=1;continue}i&&(i.hidden=!1);break}}},Xe=e=>{let t=x??b,n=e.trim(),r=0;for(let e of H){let t=J(e)??``,i=Le(e),a=n===``||Ge(n,t,i);e.hidden=!a,a&&r++}let i=f(t,`combobox-group`);for(let e of i)e.hidden=!f(e,`combobox-item`).some(e=>!e.hidden);Ye(t),le&&(le.hidden=r>0),r===0?b.setAttribute(`data-empty`,``):b.removeAttribute(`data-empty`),Je()},Ze=(e,t,n)=>{let r=z.visualViewport,i=r?.offsetTop??0,a=r?.width??z.innerWidth,o=r?.height??z.innerHeight,ee=Math.max(0,a-j*2),s=n===`top`?Math.max(0,t.top-i-j-Oe):Math.max(0,i+o-t.bottom-j-Oe),c=z.devicePixelRatio||1,te=(Math.round((t.x+t.width)*c)-Math.round(t.x*c))/c,l=(Math.round((t.y+t.height)*c)-Math.round(t.y*c))/c,u=e=>{e.style.setProperty(`--available-width`,`${ee}px`),e.style.setProperty(`--available-height`,`${s}px`),e.style.setProperty(`--anchor-width`,`${te}px`),e.style.setProperty(`--anchor-height`,`${l}px`)};u(b),e!==b&&u(e)},Qe=()=>{let e=G.container,r=K?`bottom`:I??Ee,i=K?!1:Ae,a=je.getBoundingClientRect();b.style.minWidth=`${a.width}px`;let o=t({anchorRect:a,contentRect:ie(b),side:r,align:De,sideOffset:Oe,alignOffset:ke,avoidCollisions:i,collisionPadding:j,allowedSides:se}),ee=n({side:o.side,align:o.align,anchorRect:a,popupX:o.x,popupY:o.y});e.style.position=`absolute`,e.style.top=`0px`,e.style.left=`0px`,e.style.transform=`translate3d(${o.x+z.scrollX}px, ${o.y+z.scrollY}px, 0)`,e.style.setProperty(`--transform-origin`,ee),e.style.willChange=`transform`,e.style.margin=`0`,Ze(e,a,o.side),!K&&i&&(I=o.side),b.setAttribute(`data-side`,o.side),b.setAttribute(`data-align`,o.align),e!==b&&(e.setAttribute(`data-side`,o.side),e.setAttribute(`data-align`,o.align))},Y=o({observedElements:[p,b],isActive:()=>M,ancestorScroll:!0,onUpdate:Qe,ignoreScrollTarget:e=>e instanceof Node&&b.contains(e)}),$e=e=>x&&x.contains(e)&&x.scrollHeight>x.clientHeight?x:b,X=e=>{for(let e of H)e.removeAttribute(`data-highlighted`);let t=U[e];if(!t){P=-1,y.removeAttribute(`aria-activedescendant`);return}t.setAttribute(`data-highlighted`,``),y.setAttribute(`aria-activedescendant`,t.id),te(t,$e(t)),P=e},Z=()=>{for(let e of H)e.removeAttribute(`data-highlighted`);P=-1,y.removeAttribute(`aria-activedescendant`)},et=e=>{p.setAttribute(`data-state`,e),b.setAttribute(`data-state`,e),S&&S.setAttribute(`data-state`,e),e===`open`?(p.setAttribute(`data-open`,``),b.setAttribute(`data-open`,``),S&&S.setAttribute(`data-open`,``),p.removeAttribute(`data-closed`),b.removeAttribute(`data-closed`),S&&S.removeAttribute(`data-closed`)):(p.setAttribute(`data-closed`,``),b.setAttribute(`data-closed`,``),S&&S.setAttribute(`data-closed`,``),p.removeAttribute(`data-open`),b.removeAttribute(`data-open`),S&&S.removeAttribute(`data-open`))},tt=ee({element:b,onExitComplete:()=>{Fe||(G.restore(),b.hidden=!0)}}),Q=(e,t=!1)=>{if(M!==e&&!(O&&e)){if(e){M=!0,I=null,g(y,`expanded`,!0),G.mount(),b.hidden=!1,et(`open`),tt.enter(),qe(),F=!1,fe&&(y.value=``),Xe(y.value);let e=U.findIndex(e=>J(e)===N);e>=0?X(e):Z(),Y.start(),Qe(),Y.update(),requestAnimationFrame(()=>{M&&Y.update()})}else M=!1,I=null,g(y,`expanded`,!1),et(`closed`),Z(),F=!1,Y.stop(),tt.exit(),fe?y.value=``:y.value=ze(N);s(p,`combobox:open-change`,{open:M}),xe?.(M)}},$=(e,t=!1)=>{if(N===e&&!t)return;let n=N;N=e,We(),W&&(W.value=e??``),e===null?p.removeAttribute(`data-value`):p.setAttribute(`data-value`,e);let r=x??b,i=H.length>0?H:f(r,`combobox-item`);for(let t of i)Ke(t,J(t)===e);let a=ze(e);fe||(y.value=a),w?e===null?(w.textContent=pe||D,(w.textContent??``).trim().length>0?(w.setAttribute(`data-placeholder`,``),S?.setAttribute(`data-placeholder`,``)):(w.removeAttribute(`data-placeholder`),S?.removeAttribute(`data-placeholder`))):(w.textContent=a,w.removeAttribute(`data-placeholder`),S?.removeAttribute(`data-placeholder`)):S&&(e===null?S.setAttribute(`data-placeholder`,``):S.removeAttribute(`data-placeholder`)),!t&&n!==e&&(s(p,`combobox:change`,{value:e}),be?.(e))},nt=e=>{if(q(e))return;let t=J(e);t!==void 0&&($(t),Q(!1))},rt=()=>{if(O||y.readOnly||C&&(C.hasAttribute(`disabled`)||C.getAttribute(`aria-disabled`)===`true`))return;$(null),y.value=``,Z(),M&&(Xe(y.value),Y.update());let e=R.activeElement!==y;V=e,y.focus(),e||(V=!1)};g(y,`expanded`,!1),b.hidden=!0,et(`closed`),$(N,!0),L.push(h(R,`keydown`,e=>{e.key===`Tab`&&(Me=Date.now())},{capture:!0}),h(y,`pointerdown`,()=>{B=!0}),h(y,`input`,()=>{let e=y.value,t=e.trim()!==``;s(p,`combobox:input-change`,{inputValue:e}),Se?.(e),M?(Xe(e),k&&t&&U.length>0?X(0):Z(),Y.update()):(Q(!0),k&&t&&U.length>0?X(0):P!==-1&&Z())}),h(y,`keydown`,e=>{if(!O)switch(e.key){case`ArrowDown`:{if(e.preventDefault(),!M){Q(!0),k&&U.length>0&&X(0);return}F=!0;let t=U.length;if(t===0)return;X(P===-1?0:(P+1)%t);break}case`ArrowUp`:{if(e.preventDefault(),!M){Q(!0),k&&U.length>0&&X(U.length-1);return}F=!0;let t=U.length;if(t===0)return;X(P===-1?t-1:(P-1+t)%t);break}case`Home`:if(!M)return;e.preventDefault(),F=!0,U.length>0&&X(0);break;case`End`:if(!M)return;e.preventDefault(),F=!0,U.length>0&&X(U.length-1);break;case`Enter`:if(!M)return;e.preventDefault(),P>=0&&P<U.length&&nt(U[P]);break;case`Escape`:M?(e.preventDefault(),Q(!1)):N!==null&&(e.preventDefault(),$(null));break;case`Tab`:M&&Q(!1,!0);break}}),h(y,`focus`,()=>{if(O)return;if(V){V=!1,B=!1;return}K||y.select();let e=B||Date.now()-Me<=750;B=!1,ve&&!M&&e&&Q(!0)})),S&&L.push(h(S,`click`,()=>{O||(M?Q(!1):(Q(!0),y.focus()))})),C&&L.push(h(C,`mousedown`,e=>{e.preventDefault()}),h(C,`click`,()=>{rt()})),L.push(h(b,`click`,e=>{let t=e.target.closest?.(`[data-slot="combobox-item"]`);t&&!t.hidden&&nt(t)}),h(b,`pointermove`,e=>{let t=e.target.closest?.(`[data-slot="combobox-item"]`);if(!(F&&(F=!1,t&&Pe.get(t)===P)))if(t&&!q(t)&&!t.hidden){let e=Pe.get(t);e!==void 0&&e!==P&&X(e)}else Z()}),h(b,`pointerleave`,()=>{F||Z()}),h(b,`mousedown`,e=>{e.preventDefault()})),L.push(i({root:p,isOpen:()=>M,onDismiss:()=>Q(!1),closeOnClickOutside:!K,closeOnEscape:!1})),K&&L.push(h(R,`click`,e=>{if(!M)return;let t=e.target;r(p,t)||Q(!1)},{capture:!0})),L.push(h(p,`combobox:set`,e=>{let t=e.detail;t?.value!==void 0&&$(t.value),t?.open!==void 0&&Q(t.open),t?.inputValue!==void 0&&(y.value=t.inputValue),t?.itemToStringValue!==void 0&&(A=t.itemToStringValue,$(N,!0))}));let it={get value(){return N},get inputValue(){return y.value},get isOpen(){return M},select:e=>$(e),clear:()=>$(null),open:()=>Q(!0),close:()=>Q(!1),setItemToStringValue:e=>{A=e,$(N,!0)},destroy:()=>{Fe=!0,Y.stop(),tt.cleanup(),G.cleanup(),L.forEach(e=>e()),L.length=0,W&&W.parentNode&&W.parentNode.removeChild(W),e(p,_,it)}};return oe(p,_,it),he&&Q(!0),it}function y(e=document){let t=[];for(let n of p(e,`combobox`))m(n,_)||t.push(v(n));return t}export{y as create,v as createCombobox};
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@data-slot/combobox",
3
- "version": "0.2.123",
3
+ "version": "0.2.124",
4
4
  "type": "module",
5
5
  "sideEffects": false,
6
6
  "main": "./dist/index.cjs",
@@ -36,6 +36,6 @@
36
36
  ],
37
37
  "license": "MIT",
38
38
  "dependencies": {
39
- "@data-slot/core": "0.2.123"
39
+ "@data-slot/core": "0.2.124"
40
40
  }
41
41
  }