@aotearoan/neon/dist/components/user-input/search/NeonSearch.vue.cjs.js

Neon is a lightweight design library of Vue 3 components with minimal dependencies.

"use strict";const d=require("./NeonSearch.cjs.js"),o=require("vue"),c=require("../../../_virtual/_plugin-vue_export-helper.cjs.js"),p={class:"neon-search__wrapper"},u={class:"no-style neon-search__options"},m=["id","onMouseover","onClickCapture","onSpaceCapture","onEnterCapture"],h={class:"neon-search__option-container"},b={class:"neon-search__option-label"};function k(e,l,C,V,w,y){const a=o.resolveComponent("neon-icon"),s=o.resolveComponent("neon-chip"),t=o.resolveComponent("neon-input"),i=o.resolveComponent("neon-dropdown");return o.openBlock(),o.createElementBlock("div",p,[o.createVNode(i,o.mergeProps({ref:"dropdown",modelValue:e.open,"onUpdate:modelValue":l[3]||(l[3]=n=>e.open=n),"aria-activedescendant":e.activeDescendant,"aria-multiselectable":e.multiple,class:[[`neon-search--${e.color}`,{"neon-search--multiple":e.multiple,"neon-search--disabled":e.disabled,"neon-search--empty":e.computedOptions.length===0}],"neon-search"],color:e.color,disabled:e.disabled,placement:e.dropdownPlacement,size:e.size,role:"listbox"},e.sanitizedAttributes,{onDropdownPlacement:e.onPlacement}),{"dropdown-button":o.withCtx(()=>[o.createElementVNode("div",{ref:"dropdownButton",class:o.normalizeClass([[`neon-search__container--${e.size}`,`neon-search__container--${e.color}`,{"neon-search__container--disabled":e.disabled}],"neon-search__container"])},[o.createVNode(a,{disabled:e.disabled,class:"neon-search__search-icon",color:"low-contrast",name:"search"},null,8,["disabled"]),e.multiple&&Array.isArray(e.modelValue)?(o.openBlock(!0),o.createElementBlock(o.Fragment,{key:0},o.renderList(e.modelValue,(n,r)=>(o.openBlock(),o.createBlock(s,{id:n.key,key:n.key,class:o.normalizeClass({"neon-chip--last-chip":r===e.modelValue.length-1}),color:n.chipColor,disabled:e.disabled,label:n.label,size:e.size,action:"remove","aria-selected":"true",role:"option",onClose:g=>e.removeSelected(n)},null,8,["id","class","color","disabled","label","size","onClose"]))),128)):o.createCommentVNode("",!0),o.createVNode(t,o.mergeProps({ref:"searchInput",autocomplete:e.autocomplete,color:e.color,disabled:e.disabled,"model-Value":e.filter,placeholder:e.placeholder,size:e.size,class:"neon-search__input"},e.sanitizedAttributes,{onFocus:l[0]||(l[0]=n=>e.showOptions()),onKeydownCapture:l[1]||(l[1]=o.withKeys(o.withModifiers(()=>{},["prevent","stop"]),["enter"])),"onUpdate:modelValue":e.onFilterChange,onIconClick:l[2]||(l[2]=n=>e.onFilterChange(""))}),null,16,["autocomplete","color","disabled","model-Value","placeholder","size","onUpdate:modelValue"])],2)]),default:o.withCtx(()=>[o.createElementVNode("ul",u,[(o.openBlock(!0),o.createElementBlock(o.Fragment,null,o.renderList(e.computedOptions,n=>(o.openBlock(),o.createElementBlock("li",{id:n.key,key:n.key,class:o.normalizeClass([[{"neon-search__option--separator-before":n.separatorBefore,"neon-search__option--highlighted":n.key===e.highlightedKey},`neon-search__option--${e.size}`],"neon-search__option"]),"aria-selected":"false",role:"option",tabindex:"0",onMouseover:r=>e.changeHighlighted(n.key),onClickCapture:o.withModifiers(r=>e.clickOption(n),["stop","prevent"]),onSpaceCapture:o.withModifiers(r=>e.clickOption(n),["stop","prevent"]),onEnterCapture:o.withModifiers(r=>e.clickOption(n),["stop","prevent"])},[o.createElementVNode("div",h,[o.renderSlot(e.$slots,"option",{option:n},()=>[n.icon?(o.openBlock(),o.createBlock(a,{key:0,name:n.icon,class:"neon-search__option-icon"},null,8,["name"])):o.createCommentVNode("",!0),o.createElementVNode("span",b,o.toDisplayString(n.label),1)])])],42,m))),128))])]),_:3},16,["modelValue","aria-activedescendant","aria-multiselectable","class","color","disabled","placement","size","onDropdownPlacement"])])}const v=c(d,[["render",k]]);module.exports=v;
//# sourceMappingURL=NeonSearch.vue.cjs.js.map