Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More →
Socket
Sign inDemoInstall
Socket
Sign inDemoInstall

@headlessui/vue

Package Overview
Dependencies
Maintainers
0
Versions
681
Alerts
File Explorer

Advanced tools

License
Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@headlessui/vue - npm Package Compare versions

Comparing version 0.0.0-insiders.1ee4cfd to 0.0.0-insiders.1f1e290

2

dist/components/combobox/combobox.js

@@ -1,1 +0,1 @@

import{useVirtualizer as re}from"@tanstack/vue-virtual";import{Fragment as de,cloneVNode as se,computed as b,defineComponent as j,h as z,inject as ee,nextTick as H,onMounted as X,onUnmounted as fe,provide as te,reactive as ve,ref as A,toRaw as L,watch as q,watchEffect as Y}from"vue";import{useControllable as pe}from'../../hooks/use-controllable.js';import{useFrameDebounce as be}from'../../hooks/use-frame-debounce.js';import{useId as J}from'../../hooks/use-id.js';import{useOutsideClick as ce}from'../../hooks/use-outside-click.js';import{useResolveButtonType as me}from'../../hooks/use-resolve-button-type.js';import{useTrackedPointer as xe}from'../../hooks/use-tracked-pointer.js';import{useTreeWalker as ge}from'../../hooks/use-tree-walker.js';import{Hidden as Se,Features as Oe}from'../../internal/hidden.js';import{State as G,useOpenClosed as Ce,useOpenClosedProvider as Re}from'../../internal/open-closed.js';import{Keys as k}from'../../keyboard.js';import{MouseButton as ye}from'../../mouse.js';import{history as oe}from'../../utils/active-element-history.js';import{Focus as w,calculateActiveIndex as le}from'../../utils/calculate-active-index.js';import{disposables as ae}from'../../utils/disposables.js';import{dom as x}from'../../utils/dom.js';import{sortByDomNode as Te}from'../../utils/focus-management.js';import{objectToFormEntries as Ie}from'../../utils/form.js';import{match as $}from'../../utils/match.js';import{getOwnerDocument as he}from'../../utils/owner.js';import{isMobile as Pe}from'../../utils/platform.js';import{Features as Q,compact as we,omit as Z,render as _}from'../../utils/render.js';function De(a,I){return a===I}var Ee=(u=>(u[u.Open=0]="Open",u[u.Closed=1]="Closed",u))(Ee||{}),Ve=(u=>(u[u.Single=0]="Single",u[u.Multi=1]="Multi",u))(Ve||{}),Ae=(O=>(O[O.Pointer=0]="Pointer",O[O.Focus=1]="Focus",O[O.Other=2]="Other",O))(Ae||{});let ne=Symbol("ComboboxContext");function N(a){let I=ee(ne,null);if(I===null){let u=new Error(`<${a} /> is missing a parent <Combobox /> component.`);throw Error.captureStackTrace&&Error.captureStackTrace(u,N),u}return I}let ie=Symbol("VirtualContext"),Fe=j({name:"VirtualProvider",setup(a,{slots:I}){let u=N("VirtualProvider"),O=b(()=>{let r=x(u.optionsRef);if(!r)return{start:0,end:0};let f=window.getComputedStyle(r);return{start:parseFloat(f.paddingBlockStart||f.paddingTop),end:parseFloat(f.paddingBlockEnd||f.paddingBottom)}}),t=re(b(()=>({scrollPaddingStart:O.value.start,scrollPaddingEnd:O.value.end,count:u.virtual.value.options.length,estimateSize(){return 40},getScrollElement(){return x(u.optionsRef)},overscan:12}))),e=b(()=>{var r;return(r=u.virtual.value)==null?void 0:r.options}),C=A(0);return q([e],()=>{C.value+=1}),te(ie,u.virtual.value?t:null),()=>[z("div",{style:{position:"relative",width:"100%",height:`${t.value.getTotalSize()}px`},ref:r=>{if(r){if(typeof process!="undefined"&&process.env.JEST_WORKER_ID!==void 0||u.activationTrigger.value===0)return;u.activeOptionIndex.value!==null&&u.virtual.value.options.length>u.activeOptionIndex.value&&t.value.scrollToIndex(u.activeOptionIndex.value)}}},t.value.getVirtualItems().map(r=>se(I.default({option:u.virtual.value.options[r.index],open:u.comboboxState.value===0})[0],{key:`${C.value}-${r.index}`,"data-index":r.index,"aria-setsize":u.virtual.value.options.length,"aria-posinset":r.index+1,style:{position:"absolute",top:0,left:0,transform:`translateY(${r.start}px)`,overflowAnchor:"none"}})))]}}),lt=j({name:"Combobox",emits:{"update:modelValue":a=>!0},props:{as:{type:[Object,String],default:"template"},disabled:{type:[Boolean],default:!1},by:{type:[String,Function],nullable:!0,default:null},modelValue:{type:[Object,String,Number,Boolean],default:void 0},defaultValue:{type:[Object,String,Number,Boolean],default:void 0},form:{type:String,optional:!0},name:{type:String,optional:!0},nullable:{type:Boolean,default:!1},multiple:{type:[Boolean],default:!1},immediate:{type:[Boolean],default:!1},virtual:{type:Object,default:null}},inheritAttrs:!1,setup(a,{slots:I,attrs:u,emit:O}){let t=A(1),e=A(null),C=A(null),r=A(null),f=A(null),p=A({static:!1,hold:!1}),m=A([]),g=A(null),P=A(2),D=A(!1);function V(l=i=>i){let i=g.value!==null?m.value[g.value]:null,s=l(m.value.slice()),v=s.length>0&&s[0].dataRef.order.value!==null?s.sort((y,F)=>y.dataRef.order.value-F.dataRef.order.value):Te(s,y=>x(y.dataRef.domRef)),R=i?v.indexOf(i):null;return R===-1&&(R=null),{options:v,activeOptionIndex:R}}let M=b(()=>a.multiple?1:0),K=b(()=>a.nullable),[B,d]=pe(b(()=>a.modelValue),l=>O("update:modelValue",l),b(()=>a.defaultValue)),o=b(()=>B.value===void 0?$(M.value,{[1]:[],[0]:void 0}):B.value),c=null,S=null;function h(l){return $(M.value,{[0](){return d==null?void 0:d(l)},[1]:()=>{let i=L(n.value.value).slice(),s=L(l),v=i.findIndex(R=>n.compare(s,L(R)));return v===-1?i.push(s):i.splice(v,1),d==null?void 0:d(i)}})}let T=b(()=>{var l;return(l=a.virtual)==null?void 0:l.options});q([T],([l],[i])=>{if(n.virtual.value&&l&&i&&g.value!==null){let s=l.indexOf(i[g.value]);s!==-1?g.value=s:g.value=null}});let n={comboboxState:t,value:o,mode:M,compare(l,i){if(typeof a.by=="string"){let s=a.by;return(l==null?void 0:l[s])===(i==null?void 0:i[s])}return a.by===null?De(l,i):a.by(l,i)},calculateIndex(l){return n.virtual.value?a.by===null?n.virtual.value.options.indexOf(l):n.virtual.value.options.findIndex(i=>n.compare(i,l)):m.value.findIndex(i=>n.compare(i.dataRef.value,l))},defaultValue:b(()=>a.defaultValue),nullable:K,immediate:b(()=>a.immediate),virtual:b(()=>{var l;return a.virtual?{options:a.virtual.options,disabled:(l=a.virtual.disabled)!=null?l:()=>!1}:null}),inputRef:C,labelRef:e,buttonRef:r,optionsRef:f,disabled:b(()=>a.disabled),options:m,change(l){d(l)},activeOptionIndex:b(()=>{if(D.value&&g.value===null&&(n.virtual.value?n.virtual.value.options.length>0:m.value.length>0)){if(n.virtual.value){let i=n.virtual.value.options.findIndex(s=>{var v;return!((v=n.virtual.value)!=null&&v.disabled(s))});if(i!==-1)return i}let l=m.value.findIndex(i=>!i.dataRef.disabled);if(l!==-1)return l}return g.value}),activationTrigger:P,optionsPropsRef:p,closeCombobox(){D.value=!1,!a.disabled&&t.value!==1&&(t.value=1,g.value=null)},openCombobox(){if(D.value=!0,!a.disabled&&t.value!==0){if(n.value.value){let l=n.calculateIndex(n.value.value);l!==-1&&(g.value=l)}t.value=0}},setActivationTrigger(l){P.value=l},goToOption(l,i,s){D.value=!1,c!==null&&cancelAnimationFrame(c),c=requestAnimationFrame(()=>{if(a.disabled||f.value&&!p.value.static&&t.value===1)return;if(n.virtual.value){g.value=l===w.Specific?i:le({focus:l},{resolveItems:()=>n.virtual.value.options,resolveActiveIndex:()=>{var y,F;return(F=(y=n.activeOptionIndex.value)!=null?y:n.virtual.value.options.findIndex(W=>{var U;return!((U=n.virtual.value)!=null&&U.disabled(W))}))!=null?F:null},resolveDisabled:y=>n.virtual.value.disabled(y),resolveId(){throw new Error("Function not implemented.")}}),P.value=s!=null?s:2;return}let v=V();if(v.activeOptionIndex===null){let y=v.options.findIndex(F=>!F.dataRef.disabled);y!==-1&&(v.activeOptionIndex=y)}let R=l===w.Specific?i:le({focus:l},{resolveItems:()=>v.options,resolveActiveIndex:()=>v.activeOptionIndex,resolveId:y=>y.id,resolveDisabled:y=>y.dataRef.disabled});g.value=R,P.value=s!=null?s:2,m.value=v.options})},selectOption(l){let i=m.value.find(v=>v.id===l);if(!i)return;let{dataRef:s}=i;h(s.value)},selectActiveOption(){if(n.activeOptionIndex.value!==null){if(n.virtual.value)h(n.virtual.value.options[n.activeOptionIndex.value]);else{let{dataRef:l}=m.value[n.activeOptionIndex.value];h(l.value)}n.goToOption(w.Specific,n.activeOptionIndex.value)}},registerOption(l,i){let s=ve({id:l,dataRef:i});if(n.virtual.value){m.value.push(s);return}S&&cancelAnimationFrame(S);let v=V(R=>(R.push(s),R));g.value===null&&n.isSelected(i.value.value)&&(v.activeOptionIndex=v.options.indexOf(s)),m.value=v.options,g.value=v.activeOptionIndex,P.value=2,v.options.some(R=>!x(R.dataRef.domRef))&&(S=requestAnimationFrame(()=>{let R=V();m.value=R.options,g.value=R.activeOptionIndex}))},unregisterOption(l,i){if(c!==null&&cancelAnimationFrame(c),i&&(D.value=!0),n.virtual.value){m.value=m.value.filter(v=>v.id!==l);return}let s=V(v=>{let R=v.findIndex(y=>y.id===l);return R!==-1&&v.splice(R,1),v});m.value=s.options,g.value=s.activeOptionIndex,P.value=2},isSelected(l){return $(M.value,{[0]:()=>n.compare(L(n.value.value),L(l)),[1]:()=>L(n.value.value).some(i=>n.compare(L(i),L(l)))})},isActive(l){return g.value===n.calculateIndex(l)}};ce([C,r,f],()=>n.closeCombobox(),b(()=>t.value===0)),te(ne,n),Re(b(()=>$(t.value,{[0]:G.Open,[1]:G.Closed})));let E=b(()=>{var l;return(l=x(C))==null?void 0:l.closest("form")});return X(()=>{q([E],()=>{if(!E.value||a.defaultValue===void 0)return;function l(){n.change(a.defaultValue)}return E.value.addEventListener("reset",l),()=>{var i;(i=E.value)==null||i.removeEventListener("reset",l)}},{immediate:!0})}),()=>{var y,F,W;let{name:l,disabled:i,form:s,...v}=a,R={open:t.value===0,disabled:i,activeIndex:n.activeOptionIndex.value,activeOption:n.activeOptionIndex.value===null?null:n.virtual.value?n.virtual.value.options[(y=n.activeOptionIndex.value)!=null?y:0]:(W=(F=n.options.value[n.activeOptionIndex.value])==null?void 0:F.dataRef.value)!=null?W:null,value:o.value};return z(de,[...l!=null&&o.value!=null?Ie({[l]:o.value}).map(([U,ue])=>z(Se,we({features:Oe.Hidden,key:U,as:"input",type:"hidden",hidden:!0,readOnly:!0,form:s,disabled:i,name:U,value:ue}))):[],_({theirProps:{...u,...Z(v,["by","defaultValue","immediate","modelValue","multiple","nullable","onUpdate:modelValue","virtual"])},ourProps:{},slot:R,slots:I,attrs:u,name:"Combobox"})])}}}),at=j({name:"ComboboxLabel",props:{as:{type:[Object,String],default:"label"},id:{type:String,default:()=>`headlessui-combobox-label-${J()}`}},setup(a,{attrs:I,slots:u}){let O=N("ComboboxLabel");function t(){var e;(e=x(O.inputRef))==null||e.focus({preventScroll:!0})}return()=>{let e={open:O.comboboxState.value===0,disabled:O.disabled.value},{id:C,...r}=a,f={id:C,ref:O.labelRef,onClick:t};return _({ourProps:f,theirProps:r,slot:e,attrs:I,slots:u,name:"ComboboxLabel"})}}}),nt=j({name:"ComboboxButton",props:{as:{type:[Object,String],default:"button"},id:{type:String,default:()=>`headlessui-combobox-button-${J()}`}},setup(a,{attrs:I,slots:u,expose:O}){let t=N("ComboboxButton");O({el:t.buttonRef,$el:t.buttonRef});function e(f){t.disabled.value||(t.comboboxState.value===0?t.closeCombobox():(f.preventDefault(),t.openCombobox()),H(()=>{var p;return(p=x(t.inputRef))==null?void 0:p.focus({preventScroll:!0})}))}function C(f){switch(f.key){case k.ArrowDown:f.preventDefault(),f.stopPropagation(),t.comboboxState.value===1&&t.openCombobox(),H(()=>{var p;return(p=t.inputRef.value)==null?void 0:p.focus({preventScroll:!0})});return;case k.ArrowUp:f.preventDefault(),f.stopPropagation(),t.comboboxState.value===1&&(t.openCombobox(),H(()=>{t.value.value||t.goToOption(w.Last)})),H(()=>{var p;return(p=t.inputRef.value)==null?void 0:p.focus({preventScroll:!0})});return;case k.Escape:if(t.comboboxState.value!==0)return;f.preventDefault(),t.optionsRef.value&&!t.optionsPropsRef.value.static&&f.stopPropagation(),t.closeCombobox(),H(()=>{var p;return(p=t.inputRef.value)==null?void 0:p.focus({preventScroll:!0})});return}}let r=me(b(()=>({as:a.as,type:I.type})),t.buttonRef);return()=>{var P,D;let f={open:t.comboboxState.value===0,disabled:t.disabled.value,value:t.value.value},{id:p,...m}=a,g={ref:t.buttonRef,id:p,type:r.value,tabindex:"-1","aria-haspopup":"listbox","aria-controls":(P=x(t.optionsRef))==null?void 0:P.id,"aria-expanded":t.comboboxState.value===0,"aria-labelledby":t.labelRef.value?[(D=x(t.labelRef))==null?void 0:D.id,p].join(" "):void 0,disabled:t.disabled.value===!0?!0:void 0,onKeydown:C,onClick:e};return _({ourProps:g,theirProps:m,slot:f,attrs:I,slots:u,name:"ComboboxButton"})}}}),it=j({name:"ComboboxInput",props:{as:{type:[Object,String],default:"input"},static:{type:Boolean,default:!1},unmount:{type:Boolean,default:!0},displayValue:{type:Function},defaultValue:{type:String,default:void 0},id:{type:String,default:()=>`headlessui-combobox-input-${J()}`}},emits:{change:a=>!0},setup(a,{emit:I,attrs:u,slots:O,expose:t}){let e=N("ComboboxInput"),C=b(()=>he(x(e.inputRef))),r={value:!1};t({el:e.inputRef,$el:e.inputRef});function f(){e.change(null);let o=x(e.optionsRef);o&&(o.scrollTop=0),e.goToOption(w.Nothing)}let p=b(()=>{var c;let o=e.value.value;return x(e.inputRef)?typeof a.displayValue!="undefined"&&o!==void 0?(c=a.displayValue(o))!=null?c:"":typeof o=="string"?o:"":""});X(()=>{q([p,e.comboboxState,C],([o,c],[S,h])=>{if(r.value)return;let T=x(e.inputRef);T&&((h===0&&c===1||o!==S)&&(T.value=o),requestAnimationFrame(()=>{var l;if(r.value||!T||((l=C.value)==null?void 0:l.activeElement)!==T)return;let{selectionStart:n,selectionEnd:E}=T;Math.abs((E!=null?E:0)-(n!=null?n:0))===0&&n===0&&T.setSelectionRange(T.value.length,T.value.length)}))},{immediate:!0}),q([e.comboboxState],([o],[c])=>{if(o===0&&c===1){if(r.value)return;let S=x(e.inputRef);if(!S)return;let h=S.value,{selectionStart:T,selectionEnd:n,selectionDirection:E}=S;S.value="",S.value=h,E!==null?S.setSelectionRange(T,n,E):S.setSelectionRange(T,n)}})});let m=A(!1);function g(){m.value=!0}function P(){ae().nextFrame(()=>{m.value=!1})}let D=be();function V(o){switch(r.value=!0,D(()=>{r.value=!1}),o.key){case k.Enter:if(r.value=!1,e.comboboxState.value!==0||m.value)return;if(o.preventDefault(),o.stopPropagation(),e.activeOptionIndex.value===null){e.closeCombobox();return}e.selectActiveOption(),e.mode.value===0&&e.closeCombobox();break;case k.ArrowDown:return r.value=!1,o.preventDefault(),o.stopPropagation(),$(e.comboboxState.value,{[0]:()=>e.goToOption(w.Next),[1]:()=>e.openCombobox()});case k.ArrowUp:return r.value=!1,o.preventDefault(),o.stopPropagation(),$(e.comboboxState.value,{[0]:()=>e.goToOption(w.Previous),[1]:()=>{e.openCombobox(),H(()=>{e.value.value||e.goToOption(w.Last)})}});case k.Home:if(o.shiftKey)break;return r.value=!1,o.preventDefault(),o.stopPropagation(),e.goToOption(w.First);case k.PageUp:return r.value=!1,o.preventDefault(),o.stopPropagation(),e.goToOption(w.First);case k.End:if(o.shiftKey)break;return r.value=!1,o.preventDefault(),o.stopPropagation(),e.goToOption(w.Last);case k.PageDown:return r.value=!1,o.preventDefault(),o.stopPropagation(),e.goToOption(w.Last);case k.Escape:if(r.value=!1,e.comboboxState.value!==0)return;o.preventDefault(),e.optionsRef.value&&!e.optionsPropsRef.value.static&&o.stopPropagation(),e.nullable.value&&e.mode.value===0&&e.value.value===null&&f(),e.closeCombobox();break;case k.Tab:if(r.value=!1,e.comboboxState.value!==0)return;e.mode.value===0&&e.activationTrigger.value!==1&&e.selectActiveOption(),e.closeCombobox();break}}function M(o){I("change",o),e.nullable.value&&e.mode.value===0&&o.target.value===""&&f(),e.openCombobox()}function K(o){var S,h,T;let c=(S=o.relatedTarget)!=null?S:oe.find(n=>n!==o.currentTarget);if(r.value=!1,!((h=x(e.optionsRef))!=null&&h.contains(c))&&!((T=x(e.buttonRef))!=null&&T.contains(c))&&e.comboboxState.value===0)return o.preventDefault(),e.mode.value===0&&(e.nullable.value&&e.value.value===null?f():e.activationTrigger.value!==1&&e.selectActiveOption()),e.closeCombobox()}function B(o){var S,h,T;let c=(S=o.relatedTarget)!=null?S:oe.find(n=>n!==o.currentTarget);(h=x(e.buttonRef))!=null&&h.contains(c)||(T=x(e.optionsRef))!=null&&T.contains(c)||e.disabled.value||e.immediate.value&&e.comboboxState.value!==0&&(e.openCombobox(),ae().nextFrame(()=>{e.setActivationTrigger(1)}))}let d=b(()=>{var o,c,S,h;return(h=(S=(c=a.defaultValue)!=null?c:e.defaultValue.value!==void 0?(o=a.displayValue)==null?void 0:o.call(a,e.defaultValue.value):null)!=null?S:e.defaultValue.value)!=null?h:""});return()=>{var E,l,i,s,v,R,y;let o={open:e.comboboxState.value===0},{id:c,displayValue:S,onChange:h,...T}=a,n={"aria-controls":(E=e.optionsRef.value)==null?void 0:E.id,"aria-expanded":e.comboboxState.value===0,"aria-activedescendant":e.activeOptionIndex.value===null?void 0:e.virtual.value?(l=e.options.value.find(F=>!e.virtual.value.disabled(F.dataRef.value)&&e.compare(F.dataRef.value,e.virtual.value.options[e.activeOptionIndex.value])))==null?void 0:l.id:(i=e.options.value[e.activeOptionIndex.value])==null?void 0:i.id,"aria-labelledby":(R=(s=x(e.labelRef))==null?void 0:s.id)!=null?R:(v=x(e.buttonRef))==null?void 0:v.id,"aria-autocomplete":"list",id:c,onCompositionstart:g,onCompositionend:P,onKeydown:V,onInput:M,onFocus:B,onBlur:K,role:"combobox",type:(y=u.type)!=null?y:"text",tabIndex:0,ref:e.inputRef,defaultValue:d.value,disabled:e.disabled.value===!0?!0:void 0};return _({ourProps:n,theirProps:T,slot:o,attrs:u,slots:O,features:Q.RenderStrategy|Q.Static,name:"ComboboxInput"})}}}),ut=j({name:"ComboboxOptions",props:{as:{type:[Object,String],default:"ul"},static:{type:Boolean,default:!1},unmount:{type:Boolean,default:!0},hold:{type:[Boolean],default:!1}},setup(a,{attrs:I,slots:u,expose:O}){let t=N("ComboboxOptions"),e=`headlessui-combobox-options-${J()}`;O({el:t.optionsRef,$el:t.optionsRef}),Y(()=>{t.optionsPropsRef.value.static=a.static}),Y(()=>{t.optionsPropsRef.value.hold=a.hold});let C=Ce(),r=b(()=>C!==null?(C.value&G.Open)===G.Open:t.comboboxState.value===0);ge({container:b(()=>x(t.optionsRef)),enabled:b(()=>t.comboboxState.value===0),accept(p){return p.getAttribute("role")==="option"?NodeFilter.FILTER_REJECT:p.hasAttribute("role")?NodeFilter.FILTER_SKIP:NodeFilter.FILTER_ACCEPT},walk(p){p.setAttribute("role","none")}});function f(p){p.preventDefault()}return()=>{var P,D,V;let p={open:t.comboboxState.value===0},m={"aria-labelledby":(V=(P=x(t.labelRef))==null?void 0:P.id)!=null?V:(D=x(t.buttonRef))==null?void 0:D.id,id:e,ref:t.optionsRef,role:"listbox","aria-multiselectable":t.mode.value===1?!0:void 0,onMousedown:f},g=Z(a,["hold"]);return _({ourProps:m,theirProps:g,slot:p,attrs:I,slots:t.virtual.value&&t.comboboxState.value===0?{...u,default:()=>[z(Fe,{},u.default)]}:u,features:Q.RenderStrategy|Q.Static,visible:r.value,name:"ComboboxOptions"})}}}),rt=j({name:"ComboboxOption",props:{as:{type:[Object,String],default:"li"},value:{type:[Object,String,Number,Boolean]},disabled:{type:Boolean,default:!1},order:{type:[Number],default:null}},setup(a,{slots:I,attrs:u,expose:O}){let t=N("ComboboxOption"),e=`headlessui-combobox-option-${J()}`,C=A(null),r=b(()=>{var d;return a.disabled||((d=t.virtual.value)==null?void 0:d.disabled(a.value))});O({el:C,$el:C});let f=b(()=>{var d;return t.virtual.value?t.activeOptionIndex.value===t.calculateIndex(a.value):t.activeOptionIndex.value===null?!1:((d=t.options.value[t.activeOptionIndex.value])==null?void 0:d.id)===e}),p=b(()=>t.isSelected(a.value)),m=ee(ie,null),g=b(()=>({disabled:a.disabled,value:a.value,domRef:C,order:b(()=>a.order)}));X(()=>t.registerOption(e,g)),fe(()=>t.unregisterOption(e,f.value)),Y(()=>{let d=x(C);d&&(m==null||m.value.measureElement(d))}),Y(()=>{t.comboboxState.value===0&&f.value&&(t.virtual.value||t.activationTrigger.value!==0&&H(()=>{var d,o;return(o=(d=x(C))==null?void 0:d.scrollIntoView)==null?void 0:o.call(d,{block:"nearest"})}))});function P(d){d.preventDefault(),d.button===ye.Left&&(r.value||(t.selectOption(e),Pe()||requestAnimationFrame(()=>{var o;return(o=x(t.inputRef))==null?void 0:o.focus({preventScroll:!0})}),t.mode.value===0&&t.closeCombobox()))}function D(){var o;if(a.disabled||(o=t.virtual.value)!=null&&o.disabled(a.value))return t.goToOption(w.Nothing);let d=t.calculateIndex(a.value);t.goToOption(w.Specific,d)}let V=xe();function M(d){V.update(d)}function K(d){var c;if(!V.wasMoved(d)||a.disabled||(c=t.virtual.value)!=null&&c.disabled(a.value)||f.value)return;let o=t.calculateIndex(a.value);t.goToOption(w.Specific,o,0)}function B(d){var o;V.wasMoved(d)&&(a.disabled||(o=t.virtual.value)!=null&&o.disabled(a.value)||f.value&&(t.optionsPropsRef.value.hold||t.goToOption(w.Nothing)))}return()=>{let{disabled:d}=a,o={active:f.value,selected:p.value,disabled:d},c={id:e,ref:C,role:"option",tabIndex:d===!0?void 0:-1,"aria-disabled":d===!0?!0:void 0,"aria-selected":p.value,disabled:void 0,onMousedown:P,onFocus:D,onPointerenter:M,onMouseenter:M,onPointermove:K,onMousemove:K,onPointerleave:B,onMouseleave:B},S=Z(a,["order","value"]);return _({ourProps:c,theirProps:S,slot:o,attrs:u,slots:I,name:"ComboboxOption"})}}});export{lt as Combobox,nt as ComboboxButton,it as ComboboxInput,at as ComboboxLabel,rt as ComboboxOption,ut as ComboboxOptions};
import{useVirtualizer as re}from"@tanstack/vue-virtual";import{Fragment as de,cloneVNode as se,computed as b,defineComponent as j,h as z,inject as ee,nextTick as H,onMounted as X,onUnmounted as fe,provide as te,reactive as ve,ref as A,toRaw as L,watch as q,watchEffect as Y}from"vue";import{useControllable as pe}from'../../hooks/use-controllable.js';import{useFrameDebounce as be}from'../../hooks/use-frame-debounce.js';import{useId as J}from'../../hooks/use-id.js';import{useOutsideClick as ce}from'../../hooks/use-outside-click.js';import{useResolveButtonType as me}from'../../hooks/use-resolve-button-type.js';import{useTrackedPointer as xe}from'../../hooks/use-tracked-pointer.js';import{useTreeWalker as ge}from'../../hooks/use-tree-walker.js';import{Hidden as Se,Features as Oe}from'../../internal/hidden.js';import{State as G,useOpenClosed as Ce,useOpenClosedProvider as Re}from'../../internal/open-closed.js';import{Keys as k}from'../../keyboard.js';import{MouseButton as ye}from'../../mouse.js';import{history as oe}from'../../utils/active-element-history.js';import{Focus as w,calculateActiveIndex as le}from'../../utils/calculate-active-index.js';import{disposables as ae}from'../../utils/disposables.js';import{dom as x}from'../../utils/dom.js';import{sortByDomNode as Te}from'../../utils/focus-management.js';import{objectToFormEntries as Ie}from'../../utils/form.js';import{match as $}from'../../utils/match.js';import{getOwnerDocument as he}from'../../utils/owner.js';import{isMobile as Pe}from'../../utils/platform.js';import{Features as Q,compact as we,omit as Z,render as _}from'../../utils/render.js';function De(a,I){return a===I}var Ee=(u=>(u[u.Open=0]="Open",u[u.Closed=1]="Closed",u))(Ee||{}),Ve=(u=>(u[u.Single=0]="Single",u[u.Multi=1]="Multi",u))(Ve||{}),Ae=(O=>(O[O.Pointer=0]="Pointer",O[O.Focus=1]="Focus",O[O.Other=2]="Other",O))(Ae||{});let ne=Symbol("ComboboxContext");function N(a){let I=ee(ne,null);if(I===null){let u=new Error(`<${a} /> is missing a parent <Combobox /> component.`);throw Error.captureStackTrace&&Error.captureStackTrace(u,N),u}return I}let ie=Symbol("VirtualContext"),Fe=j({name:"VirtualProvider",setup(a,{slots:I}){let u=N("VirtualProvider"),O=b(()=>{let r=x(u.optionsRef);if(!r)return{start:0,end:0};let f=window.getComputedStyle(r);return{start:parseFloat(f.paddingBlockStart||f.paddingTop),end:parseFloat(f.paddingBlockEnd||f.paddingBottom)}}),t=re(b(()=>({scrollPaddingStart:O.value.start,scrollPaddingEnd:O.value.end,count:u.virtual.value.options.length,estimateSize(){return 40},getScrollElement(){return x(u.optionsRef)},overscan:12}))),e=b(()=>{var r;return(r=u.virtual.value)==null?void 0:r.options}),C=A(0);return q([e],()=>{C.value+=1}),te(ie,u.virtual.value?t:null),()=>[z("div",{style:{position:"relative",width:"100%",height:`${t.value.getTotalSize()}px`},ref:r=>{if(r){if(typeof process!="undefined"&&process.env.JEST_WORKER_ID!==void 0||u.activationTrigger.value===0)return;u.activeOptionIndex.value!==null&&u.virtual.value.options.length>u.activeOptionIndex.value&&t.value.scrollToIndex(u.activeOptionIndex.value)}}},t.value.getVirtualItems().map(r=>se(I.default({option:u.virtual.value.options[r.index],open:u.comboboxState.value===0})[0],{key:`${C.value}-${r.index}`,"data-index":r.index,"aria-setsize":u.virtual.value.options.length,"aria-posinset":r.index+1,style:{position:"absolute",top:0,left:0,transform:`translateY(${r.start}px)`,overflowAnchor:"none"}})))]}}),lt=j({name:"Combobox",emits:{"update:modelValue":a=>!0},props:{as:{type:[Object,String],default:"template"},disabled:{type:[Boolean],default:!1},by:{type:[String,Function],nullable:!0,default:null},modelValue:{type:[Object,String,Number,Boolean],default:void 0},defaultValue:{type:[Object,String,Number,Boolean],default:void 0},form:{type:String,optional:!0},name:{type:String,optional:!0},nullable:{type:Boolean,default:!1},multiple:{type:[Boolean],default:!1},immediate:{type:[Boolean],default:!1},virtual:{type:Object,default:null}},inheritAttrs:!1,setup(a,{slots:I,attrs:u,emit:O}){let t=A(1),e=A(null),C=A(null),r=A(null),f=A(null),p=A({static:!1,hold:!1}),c=A([]),g=A(null),P=A(2),D=A(!1);function V(l=i=>i){let i=g.value!==null?c.value[g.value]:null,s=l(c.value.slice()),v=s.length>0&&s[0].dataRef.order.value!==null?s.sort((y,F)=>y.dataRef.order.value-F.dataRef.order.value):Te(s,y=>x(y.dataRef.domRef)),R=i?v.indexOf(i):null;return R===-1&&(R=null),{options:v,activeOptionIndex:R}}let M=b(()=>a.multiple?1:0),K=b(()=>a.nullable),[B,d]=pe(b(()=>a.modelValue),l=>O("update:modelValue",l),b(()=>a.defaultValue)),o=b(()=>B.value===void 0?$(M.value,{[1]:[],[0]:void 0}):B.value),m=null,S=null;function h(l){return $(M.value,{[0](){return d==null?void 0:d(l)},[1]:()=>{let i=L(n.value.value).slice(),s=L(l),v=i.findIndex(R=>n.compare(s,L(R)));return v===-1?i.push(s):i.splice(v,1),d==null?void 0:d(i)}})}let T=b(()=>{var l;return(l=a.virtual)==null?void 0:l.options});q([T],([l],[i])=>{if(n.virtual.value&&l&&i&&g.value!==null){let s=l.indexOf(i[g.value]);s!==-1?g.value=s:g.value=null}});let n={comboboxState:t,value:o,mode:M,compare(l,i){if(typeof a.by=="string"){let s=a.by;return(l==null?void 0:l[s])===(i==null?void 0:i[s])}return a.by===null?De(l,i):a.by(l,i)},calculateIndex(l){return n.virtual.value?a.by===null?n.virtual.value.options.indexOf(l):n.virtual.value.options.findIndex(i=>n.compare(i,l)):c.value.findIndex(i=>n.compare(i.dataRef.value,l))},defaultValue:b(()=>a.defaultValue),nullable:K,immediate:b(()=>a.immediate),virtual:b(()=>{var l;return a.virtual?{options:a.virtual.options,disabled:(l=a.virtual.disabled)!=null?l:()=>!1}:null}),inputRef:C,labelRef:e,buttonRef:r,optionsRef:f,disabled:b(()=>a.disabled),options:c,change(l){d(l)},activeOptionIndex:b(()=>{if(D.value&&g.value===null&&(n.virtual.value?n.virtual.value.options.length>0:c.value.length>0)){if(n.virtual.value){let i=n.virtual.value.options.findIndex(s=>{var v;return!((v=n.virtual.value)!=null&&v.disabled(s))});if(i!==-1)return i}let l=c.value.findIndex(i=>!i.dataRef.disabled);if(l!==-1)return l}return g.value}),activationTrigger:P,optionsPropsRef:p,closeCombobox(){D.value=!1,!a.disabled&&t.value!==1&&(t.value=1,g.value=null)},openCombobox(){if(D.value=!0,!a.disabled&&t.value!==0){if(n.value.value){let l=n.calculateIndex(n.value.value);l!==-1&&(g.value=l)}t.value=0}},setActivationTrigger(l){P.value=l},goToOption(l,i,s){D.value=!1,m!==null&&cancelAnimationFrame(m),m=requestAnimationFrame(()=>{if(a.disabled||f.value&&!p.value.static&&t.value===1)return;if(n.virtual.value){g.value=l===w.Specific?i:le({focus:l},{resolveItems:()=>n.virtual.value.options,resolveActiveIndex:()=>{var y,F;return(F=(y=n.activeOptionIndex.value)!=null?y:n.virtual.value.options.findIndex(W=>{var U;return!((U=n.virtual.value)!=null&&U.disabled(W))}))!=null?F:null},resolveDisabled:y=>n.virtual.value.disabled(y),resolveId(){throw new Error("Function not implemented.")}}),P.value=s!=null?s:2;return}let v=V();if(v.activeOptionIndex===null){let y=v.options.findIndex(F=>!F.dataRef.disabled);y!==-1&&(v.activeOptionIndex=y)}let R=l===w.Specific?i:le({focus:l},{resolveItems:()=>v.options,resolveActiveIndex:()=>v.activeOptionIndex,resolveId:y=>y.id,resolveDisabled:y=>y.dataRef.disabled});g.value=R,P.value=s!=null?s:2,c.value=v.options})},selectOption(l){let i=c.value.find(v=>v.id===l);if(!i)return;let{dataRef:s}=i;h(s.value)},selectActiveOption(){if(n.activeOptionIndex.value!==null){if(n.virtual.value)h(n.virtual.value.options[n.activeOptionIndex.value]);else{let{dataRef:l}=c.value[n.activeOptionIndex.value];h(l.value)}n.goToOption(w.Specific,n.activeOptionIndex.value)}},registerOption(l,i){let s=ve({id:l,dataRef:i});if(n.virtual.value){c.value.push(s);return}S&&cancelAnimationFrame(S);let v=V(R=>(R.push(s),R));g.value===null&&n.isSelected(i.value.value)&&(v.activeOptionIndex=v.options.indexOf(s)),c.value=v.options,g.value=v.activeOptionIndex,P.value=2,v.options.some(R=>!x(R.dataRef.domRef))&&(S=requestAnimationFrame(()=>{let R=V();c.value=R.options,g.value=R.activeOptionIndex}))},unregisterOption(l,i){if(m!==null&&cancelAnimationFrame(m),i&&(D.value=!0),n.virtual.value){c.value=c.value.filter(v=>v.id!==l);return}let s=V(v=>{let R=v.findIndex(y=>y.id===l);return R!==-1&&v.splice(R,1),v});c.value=s.options,g.value=s.activeOptionIndex,P.value=2},isSelected(l){return $(M.value,{[0]:()=>n.compare(L(n.value.value),L(l)),[1]:()=>L(n.value.value).some(i=>n.compare(L(i),L(l)))})},isActive(l){return g.value===n.calculateIndex(l)}};ce([C,r,f],()=>n.closeCombobox(),b(()=>t.value===0)),te(ne,n),Re(b(()=>$(t.value,{[0]:G.Open,[1]:G.Closed})));let E=b(()=>{var l;return(l=x(C))==null?void 0:l.closest("form")});return X(()=>{q([E],()=>{if(!E.value||a.defaultValue===void 0)return;function l(){n.change(a.defaultValue)}return E.value.addEventListener("reset",l),()=>{var i;(i=E.value)==null||i.removeEventListener("reset",l)}},{immediate:!0})}),()=>{var y,F,W;let{name:l,disabled:i,form:s,...v}=a,R={open:t.value===0,disabled:i,activeIndex:n.activeOptionIndex.value,activeOption:n.activeOptionIndex.value===null?null:n.virtual.value?n.virtual.value.options[(y=n.activeOptionIndex.value)!=null?y:0]:(W=(F=n.options.value[n.activeOptionIndex.value])==null?void 0:F.dataRef.value)!=null?W:null,value:o.value};return z(de,[...l!=null&&o.value!=null?Ie({[l]:o.value}).map(([U,ue])=>z(Se,we({features:Oe.Hidden,key:U,as:"input",type:"hidden",hidden:!0,readOnly:!0,form:s,disabled:i,name:U,value:ue}))):[],_({theirProps:{...u,...Z(v,["by","defaultValue","immediate","modelValue","multiple","nullable","onUpdate:modelValue","virtual"])},ourProps:{},slot:R,slots:I,attrs:u,name:"Combobox"})])}}}),at=j({name:"ComboboxLabel",props:{as:{type:[Object,String],default:"label"},id:{type:String,default:()=>`headlessui-combobox-label-${J()}`}},setup(a,{attrs:I,slots:u}){let O=N("ComboboxLabel");function t(){var e;(e=x(O.inputRef))==null||e.focus({preventScroll:!0})}return()=>{let e={open:O.comboboxState.value===0,disabled:O.disabled.value},{id:C,...r}=a,f={id:C,ref:O.labelRef,onClick:t};return _({ourProps:f,theirProps:r,slot:e,attrs:I,slots:u,name:"ComboboxLabel"})}}}),nt=j({name:"ComboboxButton",props:{as:{type:[Object,String],default:"button"},id:{type:String,default:()=>`headlessui-combobox-button-${J()}`}},setup(a,{attrs:I,slots:u,expose:O}){let t=N("ComboboxButton");O({el:t.buttonRef,$el:t.buttonRef});function e(f){t.disabled.value||(t.comboboxState.value===0?t.closeCombobox():(f.preventDefault(),t.openCombobox()),H(()=>{var p;return(p=x(t.inputRef))==null?void 0:p.focus({preventScroll:!0})}))}function C(f){switch(f.key){case k.ArrowDown:f.preventDefault(),f.stopPropagation(),t.comboboxState.value===1&&t.openCombobox(),H(()=>{var p;return(p=t.inputRef.value)==null?void 0:p.focus({preventScroll:!0})});return;case k.ArrowUp:f.preventDefault(),f.stopPropagation(),t.comboboxState.value===1&&(t.openCombobox(),H(()=>{t.value.value||t.goToOption(w.Last)})),H(()=>{var p;return(p=t.inputRef.value)==null?void 0:p.focus({preventScroll:!0})});return;case k.Escape:if(t.comboboxState.value!==0)return;f.preventDefault(),t.optionsRef.value&&!t.optionsPropsRef.value.static&&f.stopPropagation(),t.closeCombobox(),H(()=>{var p;return(p=t.inputRef.value)==null?void 0:p.focus({preventScroll:!0})});return}}let r=me(b(()=>({as:a.as,type:I.type})),t.buttonRef);return()=>{var P,D;let f={open:t.comboboxState.value===0,disabled:t.disabled.value,value:t.value.value},{id:p,...c}=a,g={ref:t.buttonRef,id:p,type:r.value,tabindex:"-1","aria-haspopup":"listbox","aria-controls":(P=x(t.optionsRef))==null?void 0:P.id,"aria-expanded":t.comboboxState.value===0,"aria-labelledby":t.labelRef.value?[(D=x(t.labelRef))==null?void 0:D.id,p].join(" "):void 0,disabled:t.disabled.value===!0?!0:void 0,onKeydown:C,onClick:e};return _({ourProps:g,theirProps:c,slot:f,attrs:I,slots:u,name:"ComboboxButton"})}}}),it=j({name:"ComboboxInput",props:{as:{type:[Object,String],default:"input"},static:{type:Boolean,default:!1},unmount:{type:Boolean,default:!0},displayValue:{type:Function},defaultValue:{type:String,default:void 0},id:{type:String,default:()=>`headlessui-combobox-input-${J()}`}},emits:{change:a=>!0},setup(a,{emit:I,attrs:u,slots:O,expose:t}){let e=N("ComboboxInput"),C=b(()=>he(x(e.inputRef))),r={value:!1};t({el:e.inputRef,$el:e.inputRef});function f(){e.change(null);let o=x(e.optionsRef);o&&(o.scrollTop=0),e.goToOption(w.Nothing)}let p=b(()=>{var m;let o=e.value.value;return x(e.inputRef)?typeof a.displayValue!="undefined"&&o!==void 0?(m=a.displayValue(o))!=null?m:"":typeof o=="string"?o:"":""});X(()=>{q([p,e.comboboxState,C],([o,m],[S,h])=>{if(r.value)return;let T=x(e.inputRef);T&&((h===0&&m===1||o!==S)&&(T.value=o),requestAnimationFrame(()=>{var l;if(r.value||!T||((l=C.value)==null?void 0:l.activeElement)!==T)return;let{selectionStart:n,selectionEnd:E}=T;Math.abs((E!=null?E:0)-(n!=null?n:0))===0&&n===0&&T.setSelectionRange(T.value.length,T.value.length)}))},{immediate:!0}),q([e.comboboxState],([o],[m])=>{if(o===0&&m===1){if(r.value)return;let S=x(e.inputRef);if(!S)return;let h=S.value,{selectionStart:T,selectionEnd:n,selectionDirection:E}=S;S.value="",S.value=h,E!==null?S.setSelectionRange(T,n,E):S.setSelectionRange(T,n)}})});let c=A(!1);function g(){c.value=!0}function P(){ae().nextFrame(()=>{c.value=!1})}let D=be();function V(o){switch(r.value=!0,D(()=>{c.value||(r.value=!1)}),o.key){case k.Enter:if(r.value=!1,e.comboboxState.value!==0||c.value)return;if(o.preventDefault(),o.stopPropagation(),e.activeOptionIndex.value===null){e.closeCombobox();return}e.selectActiveOption(),e.mode.value===0&&e.closeCombobox();break;case k.ArrowDown:return r.value=!1,o.preventDefault(),o.stopPropagation(),$(e.comboboxState.value,{[0]:()=>e.goToOption(w.Next),[1]:()=>e.openCombobox()});case k.ArrowUp:return r.value=!1,o.preventDefault(),o.stopPropagation(),$(e.comboboxState.value,{[0]:()=>e.goToOption(w.Previous),[1]:()=>{e.openCombobox(),H(()=>{e.value.value||e.goToOption(w.Last)})}});case k.Home:if(o.shiftKey)break;return r.value=!1,o.preventDefault(),o.stopPropagation(),e.goToOption(w.First);case k.PageUp:return r.value=!1,o.preventDefault(),o.stopPropagation(),e.goToOption(w.First);case k.End:if(o.shiftKey)break;return r.value=!1,o.preventDefault(),o.stopPropagation(),e.goToOption(w.Last);case k.PageDown:return r.value=!1,o.preventDefault(),o.stopPropagation(),e.goToOption(w.Last);case k.Escape:if(r.value=!1,e.comboboxState.value!==0)return;o.preventDefault(),e.optionsRef.value&&!e.optionsPropsRef.value.static&&o.stopPropagation(),e.nullable.value&&e.mode.value===0&&e.value.value===null&&f(),e.closeCombobox();break;case k.Tab:if(r.value=!1,e.comboboxState.value!==0)return;e.mode.value===0&&e.activationTrigger.value!==1&&e.selectActiveOption(),e.closeCombobox();break}}function M(o){I("change",o),e.nullable.value&&e.mode.value===0&&o.target.value===""&&f(),e.openCombobox()}function K(o){var S,h,T;let m=(S=o.relatedTarget)!=null?S:oe.find(n=>n!==o.currentTarget);if(r.value=!1,!((h=x(e.optionsRef))!=null&&h.contains(m))&&!((T=x(e.buttonRef))!=null&&T.contains(m))&&e.comboboxState.value===0)return o.preventDefault(),e.mode.value===0&&(e.nullable.value&&e.value.value===null?f():e.activationTrigger.value!==1&&e.selectActiveOption()),e.closeCombobox()}function B(o){var S,h,T;let m=(S=o.relatedTarget)!=null?S:oe.find(n=>n!==o.currentTarget);(h=x(e.buttonRef))!=null&&h.contains(m)||(T=x(e.optionsRef))!=null&&T.contains(m)||e.disabled.value||e.immediate.value&&e.comboboxState.value!==0&&(e.openCombobox(),ae().nextFrame(()=>{e.setActivationTrigger(1)}))}let d=b(()=>{var o,m,S,h;return(h=(S=(m=a.defaultValue)!=null?m:e.defaultValue.value!==void 0?(o=a.displayValue)==null?void 0:o.call(a,e.defaultValue.value):null)!=null?S:e.defaultValue.value)!=null?h:""});return()=>{var E,l,i,s,v,R,y;let o={open:e.comboboxState.value===0},{id:m,displayValue:S,onChange:h,...T}=a,n={"aria-controls":(E=e.optionsRef.value)==null?void 0:E.id,"aria-expanded":e.comboboxState.value===0,"aria-activedescendant":e.activeOptionIndex.value===null?void 0:e.virtual.value?(l=e.options.value.find(F=>!e.virtual.value.disabled(F.dataRef.value)&&e.compare(F.dataRef.value,e.virtual.value.options[e.activeOptionIndex.value])))==null?void 0:l.id:(i=e.options.value[e.activeOptionIndex.value])==null?void 0:i.id,"aria-labelledby":(R=(s=x(e.labelRef))==null?void 0:s.id)!=null?R:(v=x(e.buttonRef))==null?void 0:v.id,"aria-autocomplete":"list",id:m,onCompositionstart:g,onCompositionend:P,onKeydown:V,onInput:M,onFocus:B,onBlur:K,role:"combobox",type:(y=u.type)!=null?y:"text",tabIndex:0,ref:e.inputRef,defaultValue:d.value,disabled:e.disabled.value===!0?!0:void 0};return _({ourProps:n,theirProps:T,slot:o,attrs:u,slots:O,features:Q.RenderStrategy|Q.Static,name:"ComboboxInput"})}}}),ut=j({name:"ComboboxOptions",props:{as:{type:[Object,String],default:"ul"},static:{type:Boolean,default:!1},unmount:{type:Boolean,default:!0},hold:{type:[Boolean],default:!1}},setup(a,{attrs:I,slots:u,expose:O}){let t=N("ComboboxOptions"),e=`headlessui-combobox-options-${J()}`;O({el:t.optionsRef,$el:t.optionsRef}),Y(()=>{t.optionsPropsRef.value.static=a.static}),Y(()=>{t.optionsPropsRef.value.hold=a.hold});let C=Ce(),r=b(()=>C!==null?(C.value&G.Open)===G.Open:t.comboboxState.value===0);ge({container:b(()=>x(t.optionsRef)),enabled:b(()=>t.comboboxState.value===0),accept(p){return p.getAttribute("role")==="option"?NodeFilter.FILTER_REJECT:p.hasAttribute("role")?NodeFilter.FILTER_SKIP:NodeFilter.FILTER_ACCEPT},walk(p){p.setAttribute("role","none")}});function f(p){p.preventDefault()}return()=>{var P,D,V;let p={open:t.comboboxState.value===0},c={"aria-labelledby":(V=(P=x(t.labelRef))==null?void 0:P.id)!=null?V:(D=x(t.buttonRef))==null?void 0:D.id,id:e,ref:t.optionsRef,role:"listbox","aria-multiselectable":t.mode.value===1?!0:void 0,onMousedown:f},g=Z(a,["hold"]);return _({ourProps:c,theirProps:g,slot:p,attrs:I,slots:t.virtual.value&&t.comboboxState.value===0?{...u,default:()=>[z(Fe,{},u.default)]}:u,features:Q.RenderStrategy|Q.Static,visible:r.value,name:"ComboboxOptions"})}}}),rt=j({name:"ComboboxOption",props:{as:{type:[Object,String],default:"li"},value:{type:[Object,String,Number,Boolean]},disabled:{type:Boolean,default:!1},order:{type:[Number],default:null}},setup(a,{slots:I,attrs:u,expose:O}){let t=N("ComboboxOption"),e=`headlessui-combobox-option-${J()}`,C=A(null),r=b(()=>{var d;return a.disabled||((d=t.virtual.value)==null?void 0:d.disabled(a.value))});O({el:C,$el:C});let f=b(()=>{var d;return t.virtual.value?t.activeOptionIndex.value===t.calculateIndex(a.value):t.activeOptionIndex.value===null?!1:((d=t.options.value[t.activeOptionIndex.value])==null?void 0:d.id)===e}),p=b(()=>t.isSelected(a.value)),c=ee(ie,null),g=b(()=>({disabled:a.disabled,value:a.value,domRef:C,order:b(()=>a.order)}));X(()=>t.registerOption(e,g)),fe(()=>t.unregisterOption(e,f.value)),Y(()=>{let d=x(C);d&&(c==null||c.value.measureElement(d))}),Y(()=>{t.comboboxState.value===0&&f.value&&(t.virtual.value||t.activationTrigger.value!==0&&H(()=>{var d,o;return(o=(d=x(C))==null?void 0:d.scrollIntoView)==null?void 0:o.call(d,{block:"nearest"})}))});function P(d){d.preventDefault(),d.button===ye.Left&&(r.value||(t.selectOption(e),Pe()||requestAnimationFrame(()=>{var o;return(o=x(t.inputRef))==null?void 0:o.focus({preventScroll:!0})}),t.mode.value===0&&t.closeCombobox()))}function D(){var o;if(a.disabled||(o=t.virtual.value)!=null&&o.disabled(a.value))return t.goToOption(w.Nothing);let d=t.calculateIndex(a.value);t.goToOption(w.Specific,d)}let V=xe();function M(d){V.update(d)}function K(d){var m;if(!V.wasMoved(d)||a.disabled||(m=t.virtual.value)!=null&&m.disabled(a.value)||f.value)return;let o=t.calculateIndex(a.value);t.goToOption(w.Specific,o,0)}function B(d){var o;V.wasMoved(d)&&(a.disabled||(o=t.virtual.value)!=null&&o.disabled(a.value)||f.value&&(t.optionsPropsRef.value.hold||t.goToOption(w.Nothing)))}return()=>{let{disabled:d}=a,o={active:f.value,selected:p.value,disabled:d},m={id:e,ref:C,role:"option",tabIndex:d===!0?void 0:-1,"aria-disabled":d===!0?!0:void 0,"aria-selected":p.value,disabled:void 0,onMousedown:P,onFocus:D,onPointerenter:M,onMouseenter:M,onPointermove:K,onMousemove:K,onPointerleave:B,onMouseleave:B},S=Z(a,["order","value"]);return _({ourProps:m,theirProps:S,slot:o,attrs:u,slots:I,name:"ComboboxOption"})}}});export{lt as Combobox,nt as ComboboxButton,it as ComboboxInput,at as ComboboxLabel,rt as ComboboxOption,ut as ComboboxOptions};

3

dist/hooks/use-document-event.d.ts

@@ -1,1 +0,2 @@

export declare function useDocumentEvent<TType extends keyof DocumentEventMap>(type: TType, listener: (this: Document, ev: DocumentEventMap[TType]) => any, options?: boolean | AddEventListenerOptions): void;
import { type Ref } from 'vue';
export declare function useDocumentEvent<TType extends keyof DocumentEventMap>(enabled: Ref<boolean>, type: TType, listener: (this: Document, ev: DocumentEventMap[TType]) => any, options?: boolean | AddEventListenerOptions): void;

2

dist/hooks/use-document-event.js

@@ -1,1 +0,1 @@

import{watchEffect as r}from"vue";import{env as m}from'../utils/env.js';function u(e,t,n){m.isServer||r(o=>{document.addEventListener(e,t,n),o(()=>document.removeEventListener(e,t,n))})}export{u as useDocumentEvent};
import{watchEffect as m}from"vue";import{env as u}from'../utils/env.js';function c(o,e,t,n){u.isServer||m(r=>{o.value&&(document.addEventListener(e,t,n),r(()=>document.removeEventListener(e,t,n)))})}export{c as useDocumentEvent};

2

dist/hooks/use-outside-click.js

@@ -1,1 +0,1 @@

import{computed as s,ref as E}from"vue";import{dom as p}from'../utils/dom.js';import{FocusableMode as d,isFocusableElement as C}from'../utils/focus-management.js';import{isMobile as T}from'../utils/platform.js';import{useDocumentEvent as i}from'./use-document-event.js';import{useWindowEvent as M}from'./use-window-event.js';function w(f,m,l=s(()=>!0)){function a(e,r){if(!l.value||e.defaultPrevented)return;let t=r(e);if(t===null||!t.getRootNode().contains(t))return;let c=function o(n){return typeof n=="function"?o(n()):Array.isArray(n)||n instanceof Set?n:[n]}(f);for(let o of c){if(o===null)continue;let n=o instanceof HTMLElement?o:p(o);if(n!=null&&n.contains(t)||e.composed&&e.composedPath().includes(n))return}return!C(t,d.Loose)&&t.tabIndex!==-1&&e.preventDefault(),m(e,t)}let u=E(null);i("pointerdown",e=>{var r,t;l.value&&(u.value=((t=(r=e.composedPath)==null?void 0:r.call(e))==null?void 0:t[0])||e.target)},!0),i("mousedown",e=>{var r,t;l.value&&(u.value=((t=(r=e.composedPath)==null?void 0:r.call(e))==null?void 0:t[0])||e.target)},!0),i("click",e=>{T()||u.value&&(a(e,()=>u.value),u.value=null)},!0),i("touchend",e=>a(e,()=>e.target instanceof HTMLElement?e.target:null),!0),M("blur",e=>a(e,()=>window.document.activeElement instanceof HTMLIFrameElement?window.document.activeElement:null),!0)}export{w as useOutsideClick};
import{computed as p,ref as d}from"vue";import{dom as C}from'../utils/dom.js';import{FocusableMode as h,isFocusableElement as T}from'../utils/focus-management.js';import{isMobile as M}from'../utils/platform.js';import{useDocumentEvent as l}from'./use-document-event.js';import{useWindowEvent as y}from'./use-window-event.js';const f=30;function R(s,m,r=p(()=>!0)){function c(t,o){if(t.defaultPrevented)return;let e=o(t);if(e===null||!e.getRootNode().contains(e))return;let E=function u(n){return typeof n=="function"?u(n()):Array.isArray(n)||n instanceof Set?n:[n]}(s);for(let u of E){if(u===null)continue;let n=u instanceof HTMLElement?u:C(u);if(n!=null&&n.contains(e)||t.composed&&t.composedPath().includes(n))return}return!T(e,h.Loose)&&e.tabIndex!==-1&&t.preventDefault(),m(t,e)}let i=d(null);l(r,"pointerdown",t=>{var o,e;i.value=((e=(o=t.composedPath)==null?void 0:o.call(t))==null?void 0:e[0])||t.target},!0),l(r,"mousedown",t=>{var o,e;i.value=((e=(o=t.composedPath)==null?void 0:o.call(t))==null?void 0:e[0])||t.target},!0),l(r,"click",t=>{M()||i.value&&(c(t,()=>i.value),i.value=null)},!0);let a={x:0,y:0};l(r,"touchstart",t=>{a.x=t.touches[0].clientX,a.y=t.touches[0].clientY},!0),l(r,"touchend",t=>{let o={x:t.changedTouches[0].clientX,y:t.changedTouches[0].clientY};if(!(Math.abs(o.x-a.x)>=f||Math.abs(o.y-a.y)>=f))return c(t,()=>t.target instanceof HTMLElement?t.target:null)},!0),y(r,"blur",t=>c(t,()=>window.document.activeElement instanceof HTMLIFrameElement?window.document.activeElement:null),!0)}export{R as useOutsideClick};

2

dist/hooks/use-tab-direction.js

@@ -1,1 +0,1 @@

import{ref as a}from"vue";import{useWindowEvent as t}from'./use-window-event.js';var d=(r=>(r[r.Forwards=0]="Forwards",r[r.Backwards=1]="Backwards",r))(d||{});function n(){let o=a(0);return t("keydown",e=>{e.key==="Tab"&&(o.value=e.shiftKey?1:0)}),o}export{d as Direction,n as useTabDirection};
import{ref as o}from"vue";import{useWindowEvent as t}from'./use-window-event.js';var d=(r=>(r[r.Forwards=0]="Forwards",r[r.Backwards=1]="Backwards",r))(d||{});function s(){let e=o(0),a=o(!0);return t(a,"keydown",r=>{r.key==="Tab"&&(e.value=r.shiftKey?1:0)}),e}export{d as Direction,s as useTabDirection};

3

dist/hooks/use-window-event.d.ts

@@ -1,1 +0,2 @@

export declare function useWindowEvent<TType extends keyof WindowEventMap>(type: TType, listener: (this: Window, ev: WindowEventMap[TType]) => any, options?: boolean | AddEventListenerOptions): void;
import { type Ref } from 'vue';
export declare function useWindowEvent<TType extends keyof WindowEventMap>(enabled: Ref<boolean>, type: TType, listener: (this: Window, ev: WindowEventMap[TType]) => any, options?: boolean | AddEventListenerOptions): void;

2

dist/hooks/use-window-event.js

@@ -1,1 +0,1 @@

import{watchEffect as i}from"vue";import{env as r}from'../utils/env.js';function w(e,n,t){r.isServer||i(o=>{window.addEventListener(e,n,t),o(()=>window.removeEventListener(e,n,t))})}export{w as useWindowEvent};
import{watchEffect as r}from"vue";import{env as d}from'../utils/env.js';function w(o,e,n,t){d.isServer||r(i=>{o.value&&(window.addEventListener(e,n,t),i(()=>window.removeEventListener(e,n,t)))})}export{w as useWindowEvent};

2

package.json
{
"name": "@headlessui/vue",
"version": "0.0.0-insiders.1ee4cfd",
"version": "0.0.0-insiders.1f1e290",
"description": "A set of completely unstyled, fully accessible UI components for Vue 3, designed to integrate beautifully with Tailwind CSS.",

@@ -5,0 +5,0 @@ "main": "dist/index.cjs",

dist/headlessui.dev.cjs

Sorry, the diff of this file is not supported yet

dist/headlessui.prod.cjs

Sorry, the diff of this file is not supported yet

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

About

Packages

npm

Go

Maven

PyPI

Rubygems

Stay in touch

Get open source security insights delivered straight into your inbox.

  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc