index.min.js

{let e=(e,t={},n={})=>{let o=document.createElement(e);for(let[i,s]of Object.entries(t))if(void 0!==s){if("data"===i)for(let[a,l]of Object.entries(s))o.dataset[a]=l;else i.startsWith("aria")?o.setAttribute(i,String(s)):("className"!==i||void 0!==s)&&(o[i]=s)}for(let[d,r]of Object.entries(n))o.addEventListener(d,r);return o};e.append=(e,t)=>{for(let n of t)if(void 0!==n){if("string"==typeof n)e.textContent+=n;else if(n instanceof HTMLElement)e.appendChild(n);else{let o=n();o instanceof HTMLElement?e.appendChild(o):e.textContent+=o}}return e};let t=()=>{};function n(n,o){let i={},s="string"==typeof o.data[0]?.options[0]?.label;i=s?{label:(e,t)=>`${e.label}${t.isSelected?" ✅":""}`,isVisible:(e,t)=>e.label.toLowerCase().includes(t)}:{label:(e,t)=>`${e}${t.isSelected?" ✅":""}`,isVisible:(e,t)=>e.toLowerCase().includes(t)};let{data:a,enableSearch:l=!0,isDisabled:d,isMultiple:r,hook:p={},content:c={},className:u={}}=o,{onChange:f=t,onOpenChange:b=t}=p,{optionItem:O={},triggerButton:h=r?e=>`${e.size} selected`:e=>i.label(e,{}),placeholder:y="Select an option...",helpText:v,searchPlaceholder:C="Search...",deselectButton:m="\xd7",noResult:x="No results found"}=c,{label:I=i.label,isVisible:_=i.isVisible,isDisabled:g=()=>!1}=O,w=a.flatMap(e=>e.options),$=Math.random().toString(36).slice(2,8),k={selectedOption:null,selectedOptions:new Set,filteredOptions:a,filteredOptionsFlat:w,isOpen:!1,isDisabled:d,activeIndex:-1},N=e=>{let t="function"==typeof e?e(w):e;if(k.selectedOption!==t){let n;if(null!==t){loop:for(let o of a)for(let i of o.options)if(i===t){n=i;break loop}}n?V(n):S()}},V=e=>{k.selectedOption=e,B(),f(k.selectedOption),k.isOpen&&j()},D=e=>{k.selectedOptions.has(e)?k.selectedOptions.delete(e):k.selectedOptions.add(e),B(),k.isOpen&&setTimeout(()=>{j()},1),f(k.selectedOptions)},L=e=>{let t="function"==typeof e?e(w):e;k.selectedOptions.clear(),t.forEach(e=>{w.includes(e)&&k.selectedOptions.add(e)}),B(),f(k.selectedOptions)},S=()=>{r?(k.selectedOptions.clear(),B(),f(k.selectedOptions)):(k.selectedOption=null,B(),f(null)),k.isOpen&&j()},F=e=>{k.isDisabled=e,P.root.dataset.disabled=String(k.isDisabled)},E=()=>{if(k.isDisabled||k.isOpen)return;k.isOpen=!0,b(!0),P.dropdown.style.removeProperty("display"),P.root.dataset.open="true",P.buttonContainer.dataset.open="true",P.button.setAttribute("aria-expanded","true"),H("");let e=null;r?k.selectedOptions.size&&(e=P.optionsContainer.querySelector('[data-selected="1"]')):(k.activeIndex=k.filteredOptionsFlat.findIndex(e=>e===k.selectedOption),k.selectedOption&&(e=P.optionsContainer.querySelector('[data-selected="1"]'))),e?e.scrollIntoView({block:"center"}):P.optionsContainer.scrollTop=0,l&&P.searchInput.focus()},A=()=>{k.isOpen&&(k.isOpen=!1,b(!1),k.activeIndex=-1,P.dropdown.style.display="none",P.root.dataset.open="false",P.buttonContainer.dataset.open="false",P.button.setAttribute("aria-expanded","false"),P.searchInput.value="",P.optionsContainer.innerHTML="")},T=()=>{k.isOpen?A():E()},B=()=>{let t=t=>{t?(P.deselectButton.style.removeProperty("display"),P.buttonContainer.dataset.hasValue="true",P.dropdown.dataset.hasValue="true"):(e.append(P.button,[y]),P.deselectButton.style.display="none",P.buttonContainer.dataset.hasValue="false",P.dropdown.dataset.hasValue="false")};P.button.innerHTML="",r?0===k.selectedOptions.size?t(0):(e.append(P.button,[h(k.selectedOptions)]),t(1)):null===k.selectedOption?t(0):(e.append(P.button,[h(k.selectedOption)]),t(1))},H=(e="")=>{let t=e.toLowerCase();k.filteredOptionsFlat=[],k.filteredOptions=a.reduce((e,n)=>{let o=n.options.filter(e=>_(e,t));return o.length&&(e.push({groupName:n.groupName,options:o}),k.filteredOptionsFlat.push(...o)),e},[]),k.activeIndex=-1,j()},M=e=>{"ArrowDown"===e.key?(e.preventDefault(),q(1)):"ArrowUp"===e.key?(e.preventDefault(),q(-1)):"Enter"===e.key&&k.activeIndex>-1?(e.preventDefault(),r?D(k.filteredOptionsFlat[k.activeIndex]):(V(k.filteredOptionsFlat[k.activeIndex]),A(),P.button.focus())):("Escape"===e.key||"Tab"===e.key)&&(e.preventDefault(),A(),P.button.focus())},q=e=>{let t=k.activeIndex+e;for(;t>=0&&t<k.filteredOptionsFlat.length&&g(k.filteredOptionsFlat[t],k.selectedOption);)t+=e;t>=0&&t<k.filteredOptionsFlat.length&&(k.activeIndex=t,z())},z=()=>{let e=P.optionsContainer.querySelectorAll("[role=option]");e.forEach((e,t)=>{e.className=[u.optionItem,k.filteredOptionsFlat[t]===k.selectedOption&&u.optionSelected,t===k.activeIndex&&u.optionHighlighted,].filter(Boolean).join(" "),t===k.activeIndex?(e.setAttribute("aria-selected","true"),e.scrollIntoView({block:"nearest"}),P.searchInput.setAttribute("aria-activedescendant",e.id)):e.setAttribute("aria-selected","false")})},j=()=>{if(P.optionsContainer.innerHTML="",0===k.filteredOptionsFlat.length){e.append(P.optionsContainer,[e.append(e("li",{className:u.noResult}),[x]),]);return}k.filteredOptions.forEach((t,n)=>{e.append(P.optionsContainer,[e("li",{textContent:t.groupName,className:u.optionGroup}),]),t.options.forEach((t,o)=>{let i=r?k.selectedOptions.has(t):t===k.selectedOption,s=g(t,k.selectedOption),a=e("li",{role:"option","aria-selected":"false","aria-disabled":s?"true":void 0,id:`option-${$}--${n}.${o}`,className:[u.optionItem,i&&u.optionSelected].filter(Boolean).join(" ")},{click(){s||(r?D(t):(V(t),A(),P.button.focus()))}});i&&(a.dataset.selected="1"),e.append(P.optionsContainer,[e.append(a,[I(t,{isSelected:i,isDisabled:s})]),])})})},P={root:document.querySelector(n),buttonContainer:e("div",{className:u.buttonContainer,data:{open:!1,hasValue:!1}}),button:e("button",{className:u.triggerButton,type:"button","aria-haspopup":"listbox","aria-expanded":"false","aria-controls":"custom-select-options"},l?{click:T}:{click:T,keydown(e){k.isOpen&&M(e)}}),deselectButton:e("button",{className:u.deselectButton,type:"button",style:"display: none","aria-label":"Deselect option"},{click(){k.isDisabled||(S(),P.button.focus())}}),dropdown:e("div",{className:u.dropdownContainer,style:"display: none",data:{hasValue:!1}}),searchInput:e("input",{className:u.searchInput,type:"text",placeholder:C,role:"textbox","aria-autocomplete":"list","aria-controls":"custom-select-options",spellcheck:!1},{input:e=>H(e.target.value),keydown:e=>M(e)}),optionsContainer:e("ul",{className:u.optionsContainer,role:"listbox"})},G=(u.container||"").split(" ").filter(Boolean);function R(e){P.button.contains(e.target)||P.dropdown.contains(e.target)||A()}return G.length&&P.root.classList.add(...G),P.root.dataset.open="false",P.root.dataset.disabled=String(d),l||(P.searchInput.style.display="none"),e.append(P.root,[e.append(P.buttonContainer,[e.append(P.button,[y]),e.append(P.deselectButton,[m]),]),e.append(P.dropdown,[v?e.append(e("div",{className:u.helpText}),[v]):void 0,P.searchInput,P.optionsContainer,]),]),document.addEventListener("click",R),{open:E,close:A,toggle:T,getValue:r?()=>k.selectedOptions:()=>k.selectedOption,setValue:r?L:N,resetValue:S,setIsDisabled:F,element:P,destroy(){document.removeEventListener("click",R),P.optionsContainer.innerHTML="",P.root.innerHTML="",P=void 0,k=void 0}}}window.customSelect=n}