UNPKG

@volverjs/ui-vue

Version:

@volverjs/ui-vue is a lightweight Vue 3 component library to accompany @volverjs/style.

5 lines (4 loc) 32.8 kB
import{unref as e,computed as t,isRef as a,defineComponent as l,h as o,useId as i,Fragment as n,provide as r,ref as u,toRefs as s,useAttrs as d,onMounted as v,watch as c,createElementBlock as p,openBlock as f,createVNode as m,withCtx as b,renderSlot as h,normalizeProps as g,guardReactiveProps as y,Transition as S,mergeProps as w,toHandlers as E,withDirectives as $,createElementVNode as x,normalizeClass as L,normalizeStyle as T,createCommentVNode as D,vShow as k,nextTick as O,inject as A,createBlock as _,createTextVNode as I,toDisplayString as M,mergeDefaults as N,useSlots as H,withModifiers as C,createSlots as B,renderList as P}from"vue";import{useIMask as V}from"vue-imask";import{autoPlacement as R,flip as j,shift as U,size as F,offset as Y,arrow as W,useFloating as z,autoUpdate as q}from"@floating-ui/vue";import{useMutationObserver as K,useVModel as X,onClickOutside as J,useFocusWithin as Z,useElementHover as G,onKeyStroke as Q,useFocus as ee,useStorage as te,useElementVisibility as ae}from"@vueuse/core";import le from"mitt";import{iconLoaded as oe,Icon as ie,addIcon as ne}from"@iconify/vue";const re=e=>e.toString().padStart(2,"0");function ue(e){if("string"!=typeof e)return!1;if(!/^\d{4}-\d{2}-\d{2}T\d{2}:\d{2}:\d{2}(?:\.\d{1,3})?(?:Z|[+-]\d{2}:?\d{2})?$/.test(e))return!1;const t=new Date(e);return!Number.isNaN(t.getTime())&&t.toISOString()===e}function se(e,t="date",a){if("string"==typeof e&&!ue(e))return"";const l=new Date(e);if(Number.isNaN(l.getTime()))return"";let o=`${l.getFullYear()}-${re(l.getMonth()+1)}`;if("month"===t)return o;if(o+=`-${re(l.getDate())}`,"date"===t)return o;const i=a?`${re(l.getHours())}:${re(l.getMinutes())}:${re(l.getSeconds())}`:`${re(l.getHours())}:${re(l.getMinutes())}`;return"time"===t?i:`${o}T${i}`}function de(t){return null==(a=e(t))||""===a||Array.isArray(a)&&0===a.length||!(a instanceof Date)&&"object"==typeof a&&0===Object.keys(a).length;var a}function ve(e){return Array.isArray(e)?e.filter(e=>"string"==typeof e).join(" "):e}var ce=/* @__PURE__ */(e=>(e.local="local",e.session="session",e))(ce||{}),pe=/* @__PURE__ */(e=>(e.absolute="absolute",e.fixed="fixed",e))(pe||{}),fe=/* @__PURE__ */(e=>(e.left="left",e.right="right",e.top="top",e.bottom="bottom",e))(fe||{}),me=/* @__PURE__ */(e=>(e.topStart="top-start",e.topEnd="top-end",e.bottomStart="bottom-start",e.bottomEnd="bottom-end",e.leftStart="left-start",e.leftEnd="left-end",e.rightStart="right-start",e.rightEnd="right-end",e))(me||{}),be=/* @__PURE__ */(e=>(e.before="before",e.after="after",e))(be||{}),he=/* @__PURE__ */(e=>(e.button="button",e.submit="submit",e.reset="reset",e))(he||{}),ge=/* @__PURE__ */(e=>(e.nuxtLink="nuxt-link",e.routerLink="router-link",e.a="a",e.button="button",e))(ge||{}),ye=/* @__PURE__ */(e=>(e.button="button",e.link="link",e.menuitem="menuitem",e))(ye||{}),Se=/* @__PURE__ */(e=>(e.listbox="listbox",e.menu="menu",e))(Se||{}),we=/* @__PURE__ */(e=>(e.option="option",e.presentation="presentation",e))(we||{});const Ee=Symbol.for("volver"),$e=Symbol.for("dropdownTrigger"),xe=Symbol.for("dropdownItem"),Le=Symbol.for("dropdownAction"),Te="eye-on",De="eye-off",ke="calendar",Oe="time",Ae="color",_e="close",Ie="trash",Me={prefix:"normal"},Ne={valid:{type:Boolean,default:!1},validLabel:{type:[String,Array],default:void 0}},He={invalid:{type:Boolean,default:!1},invalidLabel:{type:[String,Array],default:void 0}},Ce={loading:{type:Boolean,default:!1},loadingLabel:{type:String,default:"Loading..."}},Be={disabled:{type:Boolean,default:!1}},Pe={required:{type:Boolean,default:!1}},Ve={selected:{type:Boolean,default:!1}},Re={label:{type:[String,Number],default:void 0}},je={readonly:{type:Boolean,default:!1}},Ue={modifiers:{type:[String,Array],default:void 0}},Fe={hintLabel:{type:String,default:""}},Ye={count:{type:[Boolean,String],default:!1,validator:e=>[!0,!1,"limit","countdown"].includes(e)}},We={debounce:{type:[Number,String],default:void 0}},ze={icon:{type:[String,Object],default:void 0},iconPosition:{type:String,default:be.before,validation:e=>Object.values(be).includes(e)}},qe={tabindex:{type:[String,Number],default:0}},Ke={floating:{type:Boolean,default:!1}},Xe={unselectable:{type:Boolean,default:!0}},Je={id:[String,Number]},Ze={placement:{type:String,default:fe.bottom,validator:e=>Object.values(fe).includes(e)||Object.values(me).includes(e)},strategy:{type:String,default:void 0,validator:e=>Object.values(pe).includes(e)},transitionName:{type:String,default:void 0},offset:{type:[Number,String,Object],default:0},shift:{type:[Boolean,Object],default:!1},flip:{type:[Boolean,Object],default:!0},size:{type:[Boolean,Object],default:()=>({padding:10})},autoPlacement:{type:[Boolean,Object],default:!1},arrow:{type:Boolean,default:!1},keepOpen:{type:Boolean,default:!1},autofocusFirst:{type:Boolean,default:!0},triggerWidth:{type:Boolean,default:!1}},Ge={...{...Je,name:{type:String,required:!0}},...{autofocus:{type:Boolean,default:!1}},...{autocomplete:{type:String,default:"off"}},...qe,...Be,...je,...Ne,...He,...Fe,...Ce,...Ue,...Ye,...We,...ze,...Ke,...Re,minlength:{type:[String,Number],default:void 0},maxlength:{type:[String,Number],default:void 0},placeholder:{type:String,default:void 0},...Pe};he.button,ge.button;const Qe={storageType:{type:String,default:ce.local,validator:e=>Object.values(ce).includes(e)},storageKey:String},et={...Je,...Ze,...Ue,modelValue:{type:Boolean,default:void 0},reference:{type:Object,default:null},role:{type:String,default:Se.menu,validator:e=>Object.values(Se).includes(e)}},tt={focusOnHover:{type:Boolean,default:!1}},at={...Be,...Ve,...Xe,...Ue,deselectHintLabel:{type:String},selectHintLabel:{type:String},selectedHintLabel:{type:String},focusOnHover:{type:Boolean,default:!1}};function lt(e){return t(()=>String(e?.value||i()))}function ot(a,l,o){return t(()=>{const t={[a]:!0},i="string"==typeof l?.value?l.value.split(" "):l?.value;return i&&Array.isArray(i)&&i.forEach(e=>{e&&(t[`${a}--${e}`]=!0)}),o&&Object.keys(o.value).forEach(l=>{t[`${a}--${l}`]=e(o.value[l])}),t})}const it=["id","tabindex","role","aria-labelledby"],nt=/* @__PURE__ */l({name:"VvDropdown",inheritAttrs:!1,props:et,emits:["update:modelValue","beforeEnter","afterLeave","beforeExpand","beforeCollapse","afterExpand","afterCollapse","before-enter","after-leave","enter","afterEnter","enterCancelled","beforeLeave","leave","leaveCancelled"],setup(a,{expose:i,emit:A}){const _=a,I=A,{id:M}=s(_),N=lt(M),H=d(),C=u("auto"),B=u("auto"),P=u(),V=u(),ee=u(),te=u(),ae=t({get:()=>_.reference??P.value,set:e=>{P.value=e}}),oe=u(!1);v(()=>{K(V.value,()=>{oe.value="true"===window.getComputedStyle(V.value).getPropertyValue("--dropdown-custom-position")?.trim()},{attributeFilter:["style"],window:window})});const ie=t(()=>{const e=[];if(_.autoPlacement?"boolean"==typeof _.autoPlacement?e.push(R()):e.push(R(_.autoPlacement)):_.flip&&("boolean"==typeof _.flip?e.push(j({fallbackStrategy:"initialPlacement"})):e.push(j(_.flip))),_.shift&&("boolean"==typeof _.shift?e.push(U()):e.push(U(_.shift))),_.size){const t=({availableWidth:e,availableHeight:t})=>{C.value=`${e}px`,B.value=`${t}px`};"boolean"==typeof _.size?e.push(F({apply:t})):e.push(F({..._.size,apply:t}))}return _.offset&&(e.push(Y(Number(_.offset))),["string","number"].includes(typeof _.offset)?e.push(Y(Number(_.offset))):e.push(Y(_.offset))),_.arrow&&e.push(W({element:ee})),e}),{x:ne,y:re,middlewareData:ue,placement:se,strategy:de}=z(ae,V,{whileElementsMounted:(...e)=>q(...e,{animationFrame:_.strategy===pe.fixed}),placement:t(()=>_.placement),strategy:t(()=>_.strategy),middleware:ie}),ve=t(()=>{if(oe.value)return;const e=_.triggerWidth&&ae.value?`${ae.value?.offsetWidth}px`:void 0;return{position:de.value,top:`${re.value??0}px`,left:`${ne.value??0}px`,maxWidth:e?void 0:C.value,maxHeight:B.value,width:e}}),ce=t(()=>se.value.split("-")[0]),me=t(()=>{if(oe.value)return;const e={[fe.top]:fe.bottom,[fe.right]:fe.left,[fe.bottom]:fe.top,[fe.left]:fe.right}[ce.value];return{left:void 0!==ue.value.arrow?.x?`${ue.value.arrow?.x}px`:void 0,top:void 0!==ue.value.arrow?.y?`${ue.value.arrow?.y}px`:void 0,[e]:-(ee.value?.offsetWidth??0)/2+"px"}}),be=X(_,"modelValue",I),he=u(!1),ge=t({get:()=>be.value??he.value,set:e=>{void 0!==be.value?be.value=e:he.value=e}});function ye(){ge.value=!0}function Ee(){ge.value=!1}function Le(){ge.value=!ge.value}function Te(e){ae.value=e}J(V,()=>{!_.keepOpen&&ge.value&&(ge.value=!1)},{ignore:[ae]});const De=t(()=>ae.value?.getAttribute?.("id")??void 0),ke=t(()=>({"aria-controls":N.value,"aria-haspopup":!0,"aria-expanded":ge.value})),{component:Oe,bus:Ae}=function({reference:e,id:t,expanded:a,aria:i}){const u=le(),s=l({name:"VvDropdownTriggerProvider",setup(){r($e,{reference:e,id:t,expanded:a,aria:i,bus:u})},render(){return o(n,{},this.$slots.default?.())}});return{bus:u,component:s}}({reference:ae,id:N,expanded:ge,aria:ke});Ae.on("click",Le);const{role:_e,modifiers:Ie}=s(_),Me=ot("vv-dropdown",Ie,t(()=>({arrow:_.arrow}))),{focused:Ne}=Z(V);function He(e){return e?[...e.querySelectorAll('a[href], button, input, textarea, select, details, [tabindex]:not([tabindex="-1"])')].filter(e=>!e.hasAttribute("disabled")&&!e.getAttribute("aria-hidden")):[]}function Ce(){O(()=>{const e=He(V.value);e.length>0&&e[0].focus({preventScroll:!0})})}function Be(){O(()=>{if(Ne.value){const e=He(V.value);if(0===e.length||!document.activeElement)return;const t=e.indexOf(document.activeElement);t<e.length-1?e[t+1].focus({preventScroll:!0}):e[0].focus({preventScroll:!0})}})}function Pe(){O(()=>{if(Ne.value){const e=He(V.value);if(0===e.length||!document.activeElement)return;const t=e.indexOf(document.activeElement);t>0?e[t-1].focus({preventScroll:!0}):e[e.length-1].focus({preventScroll:!0})}})}c(ge,e=>{e&&_.autofocusFirst&&Ce()}),i({toggle:Le,show:ye,hide:Ee,init:Te,focusFirst:Ce,focusFirstListElement:function(){O(()=>{const e=He(te.value);e.length>0&&e[0].focus({preventScroll:!0})})},focusNext:Be,focusPrev:Pe,customPosition:oe});const Ve=G(V),{itemRole:Re}=function({role:e,...a}){const l=t(()=>e.value===Se.listbox?we.option:we.presentation);return r(xe,{role:l,...a}),{itemRole:l}}({role:_e,expanded:ge,focused:Ne,hovered:Ve});Q("Escape",e=>{ge.value&&(e.preventDefault(),Ee())}),Q("ArrowDown",e=>{ge.value&&Ne.value&&(e.preventDefault(),Be())}),Q("ArrowUp",e=>{ge.value&&Ne.value&&(e.preventDefault(),Pe())}),Q([" ","Enter"],e=>{const t=e.target;ge.value&&Ne.value&&t&&t?.click()});const je={"before-enter":()=>{I(ge.value?"beforeExpand":"beforeCollapse"),I("beforeEnter")},"after-leave":()=>{I(ge.value?"afterExpand":"afterCollapse"),I("afterLeave")},enter:()=>{I("enter")},"after-enter":()=>{I("afterEnter")},"enter-cancelled":()=>{I("enterCancelled")},"before-leave":()=>{I("beforeLeave")},leave:()=>{I("leave")},"leave-cancelled":()=>{I("leaveCancelled")}};return(t,a)=>(f(),p(n,null,[m(e(Oe),null,{default:b(()=>[h(t.$slots,"default",g(y({init:Te,show:ye,hide:Ee,toggle:Le,expanded:e(ge),aria:e(ke)})))]),_:3}),m(S,w({name:t.transitionName},E(je),{persisted:""}),{default:b(()=>[$(x("div",{ref_key:"floatingEl",ref:V,style:T(e(ve)),class:L(e(Me))},[_.arrow?(f(),p("div",{key:0,ref_key:"arrowEl",ref:ee,style:T(e(me)),class:"vv-dropdown__arrow"},null,4)):D("v-if",!0),h(t.$slots,"before",g(y({expanded:e(ge)}))),x("div",w(e(H),{id:e(N),ref_key:"listEl",ref:te,tabindex:e(ge)?void 0:-1,role:e(_e),"aria-labelledby":e(De),class:"vv-dropdown__list"}),[h(t.$slots,"items",g(y({role:e(Re)})))],16,it),h(t.$slots,"after",g(y({expanded:e(ge)})))],6),[[k,e(ge)]])]),_:3},16,["name"])],64))}});const rt=/* @__PURE__ */l({name:"VvDropdownItem",props:tt,setup(t){const a=t,{role:l,expanded:o}=A(xe,{}),i=u(null);!function({expanded:e}){r(Le,{role:u(ye.menuitem),expanded:e})}({expanded:o});const n=G(i),{focused:s}=ee(i),{focused:d}=Z(i);return c(n,e=>{e&&a.focusOnHover&&(s.value=!0)}),(t,a)=>(f(),p("div",w({role:e(l)},{ref_key:"element",ref:i,class:["vv-dropdown__item",{"focus-visible":e(s)||e(d)}]}),[h(t.$slots,"default")],16))}}),ut=["title"],st=/* @__PURE__ */l({name:"VvDropdownOption",props:at,setup(a){const l=a,{modifiers:o}=s(l),i=ot("vv-dropdown-option",o,t(()=>({disabled:l.disabled,selected:l.selected,unselectable:l.unselectable&&l.selected}))),n=t(()=>l.selected?l.unselectable?l.deselectHintLabel:l.selectedHintLabel:l.disabled?"":l.selectHintLabel);return(t,a)=>(f(),_(rt,{class:L(e(i)),tabindex:t.disabled?-1:0,"aria-selected":t.selected,"aria-disabled":t.disabled,"focus-on-hover":t.focusOnHover},{default:b(()=>[h(t.$slots,"default"),x("span",{class:"vv-dropdown-option__hint",title:e(n)},[h(t.$slots,"hint",g(y({disabled:t.disabled,selected:t.selected,unselectable:t.unselectable})),()=>[I(M(e(n)),1)])],8,ut)]),_:3},8,["class","tabindex","aria-selected","aria-disabled","focus-on-hover"]))}});function dt(){return A(Ee,void 0)}const vt=/* @__PURE__ */l({name:"VvIcon",props:/* @__PURE__ */N({name:{},color:{},width:{},height:{},provider:{},prefix:{},src:{},horizontalFlip:{type:Boolean},verticalFlip:{type:Boolean},flip:{},mode:{},inline:{type:Boolean},rotate:{},onLoad:{type:Function},svg:{},modifiers:{}},Me),setup(a){const l=a,o=t(()=>"string"==typeof l.rotate?Number.parseFloat(l.rotate):l.rotate),i=u(!0),n=dt(),{modifiers:r}=s(l),d=ot("vv-icon",r),v=t(()=>l.provider||n?.iconsProvider),c=t(()=>{const e=l.name??"",t=`@${v.value}:${l.prefix}:${e}`;if(oe(t))return t;const a=n?.iconsCollections.find(t=>{const a=`@${v.value}:${t.prefix}:${e}`;return oe(a)});return a?`@${v.value}:${a.prefix}:${e}`:e});function p(e){const t=function(e){let t;if("undefined"==typeof window){const{JSDOM:e}=require("jsdom");t=(new e).window}return(t?new t.DOMParser:new window.DOMParser).parseFromString(e,"text/html").querySelector("svg")}(e),a=t?.innerHTML.trim()||"";t&&a&&ne(`@${v.value}:${l.prefix}:${l.name}`,{body:a,height:t.viewBox.baseVal.height,width:t.viewBox.baseVal.width})}return n&&l.src&&!oe(`@${v.value}:${l.prefix}:${l.name}`)&&(i.value=!1,n.fetchIcon(l.src).then(e=>{e&&(p(e),i.value=!0)}).catch(e=>{throw new Error(`Error during fetch icon: ${e?.message}`)})),l.svg&&p(l.svg),(t,l)=>e(i)?(f(),_(e(ie),w({key:0,class:e(d)},{inline:a.inline,width:a.width,height:a.height,horizontalFlip:a.horizontalFlip,verticalFlip:a.verticalFlip,flip:a.flip,rotate:e(o),color:a.color,icon:e(c)},{onLoad:a.onLoad}),null,16,["class","onLoad"])):D("v-if",!0)}}),ct={TEXT:"text",PASSWORD:"password",NUMBER:"number",EMAIL:"email",TEL:"tel",URL:"url",COLOR:"color",SEARCH:"search",DATE:"date",TIME:"time",DATETIME_LOCAL:"datetime-local",MONTH:"month",WEEK:"week"},pt={...Ge,...Qe,modelValue:[String,Number,Date],type:{type:String,default:ct.TEXT,validator:e=>Object.values(ct).includes(e)},min:[Number,Date,String],max:[Number,Date,String],step:{type:[String,Number],default:1},pattern:String,multiple:Boolean,iconShowPassword:{type:[String,Object],default:Te},iconHidePassword:{type:[String,Object],default:De},iconClear:{type:[String,Object],default:_e},iconRemoveSuggestion:{type:[String,Object],default:Ie},labelStepUp:{type:String,default:"Increase value"},labelStepDown:{type:String,default:"Decrease value"},labelShowPassword:{type:String,default:"Show password"},labelHidePassword:{type:String,default:"Hide password"},labelClear:{type:String,default:"Clear"},labelRemoveSuggestion:{type:String,default:"Remove suggestion"},iMask:{type:Object,default:void 0},masked:{type:String,default:void 0},autoWidth:{type:Boolean,default:!1},hideActions:{type:Boolean,default:!1},unit:{type:String},selectOnFocus:{type:Boolean,default:!1},maxSuggestions:{type:Number,default:5},inputMode:{type:String,default:"text"}};function ft(e,a){const l=t(()=>"string"==typeof e?.value?{name:e?.value}:e?.value),o=t(()=>a?.value===be.before?l.value:void 0),i=t(()=>a?.value===be.after?l.value:void 0),n=t(()=>a?.value===fe.left?l.value:void 0),r=t(()=>a?.value===fe.right?l.value:void 0),u=t(()=>a?.value===fe.top?l.value:void 0),s=t(()=>a?.value===fe.bottom?l.value:void 0);return{hasIcon:l,hasIconLeft:n,hasIconRight:r,hasIconTop:u,hasIconBottom:s,hasIconBefore:o,hasIconAfter:i}}const mt=l({components:{VvIcon:vt},props:{inputType:{type:String,default:"input-text"},disabled:{type:Boolean,default:!1},label:{type:String,default:"Clear"},icon:{type:[String,Object],default:"close"}},emits:["clear"],setup(e,{emit:a}){const{hasIcon:l}=ft(t(()=>e.icon));return{hasIcon:l,onClick:function(t){t?.stopPropagation(),e.disabled||a("clear")}}},render(){const e=this.hasIcon?o(vt,{...this.hasIcon,class:`vv-${this.inputType}__icon`}):void 0;return o("button",{disabled:this.disabled,class:`vv-${this.inputType}__action`,ariaLabel:this.label,type:"button",onClick:this.onClick},e)}}),bt=l({components:{VvIcon:vt},props:{inputType:{type:String,default:"input-text"},disabled:{type:Boolean,default:!1},labelShow:{type:String,default:"Show password"},labelHide:{type:String,default:"Hide password"},iconShow:{type:[String,Object],default:Te},iconHide:{type:[String,Object],default:De}},emits:["toggle-password"],setup(e,{emit:a}){const l=u(!1),o=t(()=>l.value?e.iconHide:e.iconShow),{hasIcon:i}=ft(o);return{active:l,activeIcon:o,hasIcon:i,onClick:function(t){t?.stopPropagation(),e.disabled||(l.value=!l.value,a("toggle-password",l.value))}}},render(){const e=this.hasIcon?o(vt,{...this.hasIcon,class:`vv-${this.inputType}__icon`}):void 0;return o("button",{disabled:this.disabled,class:`vv-${this.inputType}__action`,ariaLabel:this.active?this.labelHide:this.labelShow,type:"button",onClick:this.onClick},e)}}),ht=l({components:{VvIcon:vt},props:{inputType:{type:String,default:"input-text"},disabled:{type:Boolean,default:!1},label:{type:String},mode:{type:String,validator:e=>["up","down"].includes(e),default:"up"}},emits:["step-up","step-down"],setup(e,{emit:a}){const l=t(()=>"up"===e.mode);return{isUp:l,onClick:t=>{t?.stopPropagation(),e.disabled||a(l.value?"step-up":"step-down")}}},render(){return o("button",{class:[`vv-${this.inputType}__action`,`vv-${this.inputType}__action-chevron`,this.isUp?`vv-${this.inputType}__action-chevron-up`:void 0],disabled:this.disabled,ariaLabel:this.label,type:"button",onClick:this.onClick})}});function gt(e,a,l){return{name:"VvInputTextActions",components:{VvIcon:vt,VvInputPasswordAction:bt,VvInputStepAction:ht,VvInputClearAction:mt},setup(){const e=t(()=>a.disabled||a.readonly);return{isDirty:l,isDisabled:e,labelStepUp:a.labelStepUp,labelStepDown:a.labelStepDown,labelShowPassword:a.labelShowPassword,labelHidePassword:a.labelHidePassword,labelClear:a.labelClear,iconShowPassword:a.iconShowPassword,iconHidePassword:a.iconHidePassword}},render(){let t=null;switch(e){case ct.SEARCH:{const{onClear:e}=this.$attrs;t=[o(mt,{disabled:this.isDisabled||!this.isDirty,label:this.labelClear,onClear:e})];break}case ct.PASSWORD:{const{onTogglePassword:e}=this.$attrs;t=[o(bt,{disabled:this.isDisabled,onTogglePassword:e,labelShow:this.labelShowPassword,labelHide:this.labelHidePassword,iconShow:this.iconShowPassword,iconHide:this.iconHidePassword})];break}case ct.NUMBER:{const{onStepUp:e,onStepDown:l}=this.$attrs;t=[o(ht,{mode:"up",disabled:this.isDisabled||void 0!==a.max&&a.modelValue===a.max,label:this.labelStepUp,onStepUp:e,onStepDown:l}),o(ht,{mode:"down",disabled:this.isDisabled||void 0!==a.min&&a.modelValue===a.min,label:this.labelStepDown,onStepUp:e,onStepDown:l})];break}}return Array.isArray(t)?o("div",{class:"vv-input-text__actions-group"},t):t}}}const yt=["for"],St={key:0,class:"vv-input-text__input-before"},wt=["id"],Et={key:1,class:"vv-input-text__unit"},$t={key:5,class:"vv-input-text__input-after"},xt={key:6,class:"vv-input-text__limit"},Lt={class:"flex-1"},Tt=["title","onClick"],Dt=/* @__PURE__ */l({name:"VvInputText",props:pt,emits:["update:modelValue","update:masked","accept","accept:typed","accept:masked","accept:unmasked","complete","complete:typed","complete:masked","complete:unmasked","suggestion:selected","suggestion:removed","focus","blur","keyup","keydown","keypress","clear"],setup(i,{expose:r,emit:d}){const S=i,E=d,$=H(),T=dt(),k=function(e,a,l){const o=dt(),i=t(()=>{if(o&&o.defaults.value?.[e])return o.defaults.value[e]});return t(()=>{if(void 0===i.value)return l;const e=i.value,t=a,o=l;return Object.keys(t).reduce((a,l)=>{const i=o[l];if(a[l]=i,l in e){if(Array.isArray(t[l])){const o=t[l];o.length&&o[0]===i&&(a[l]=e[l])}if("function"==typeof t[l]&&(0,t[l])()===i&&(a[l]=e[l]),"object"==typeof t[l]){let o=t[l].default;"function"==typeof o&&(o=o()),"object"==typeof o?JSON.stringify(o)===JSON.stringify(i)&&(a[l]=e[l]):o===i&&(a[l]=e[l])}}return a},{})})}("VvInputText",pt,S),{count:O,debounce:A,icon:N,iconPosition:R,iconRemoveSuggestion:j,id:U,invalid:F,label:Y,loading:W,maxlength:z,minlength:q,modelValue:K,step:X,storageType:J,type:Z,valid:G}=s(S),Q=lt(U),le=t(()=>`${Q.value}-hint`),oe=t(()=>S.floating&&de(S.placeholder)?" ":S.placeholder),ie=function(e,a,l=0,{getter:o=e=>e,setter:i=e=>e}={}){let n;return"string"==typeof l&&(l=Number.parseInt(l)),t({get:()=>o(e?.value),set:e=>{n&&clearTimeout(n),n=setTimeout(()=>{a("update:modelValue",i(e))},l)}})}(K,E,A?.value??0),ne=t(()=>{const e="number"==typeof X.value?X.value:Number.parseInt(X.value);return!Number.isNaN(e)&&e%60!=0}),pe=/^-0?[.,]?[0*]?$/,fe=u(!1),me=u(),be=u(),{el:he,mask:ge,typed:ye,masked:Se,unmasked:we}=V(t(()=>{if(!S.iMask)return{mask:/./};if(S.iMask.mask===Number){const e={...S.iMask};return S.min&&(e.min=Number(S.min)),S.max&&(e.max=Number(S.max)),e}return S.iMask}),{emit:E,onAccept:()=>{if(fe.value){if(E("update:masked",Se.value),Z.value===ct.NUMBER){if(/^-$|^$/.test(we.value)){if(null===ie.value||void 0===ie.value)return;return void(ie.value=void 0)}return pe.test(we.value)?void(ie.value=0):"number"!=typeof ye.value?void(ie.value=Number(ye.value)):void(ie.value=ye.value)}if(Z.value===ct.DATETIME_LOCAL||Z.value===ct.DATE||Z.value===ct.TIME||Z.value===ct.MONTH){if(!ye.value){if(!ie.value)return;return me.value?void(ie.value=void 0):void(ie.value="")}if(!(ye.value instanceof Date||me.value||be.value))return void(ie.value=ye.value);let e=ye.value;if(e instanceof Date||(e=function(e,t="date"){if(!e?.trim())return null;const a=/* @__PURE__ */new Date,l=a.getFullYear(),o=a.getMonth(),i=a.getDate();if("date"===t){if(!/^\d{4}-\d{2}-\d{2}$/.test(e))throw new Error("Invalid date format. Expected: YYYY-MM-DD");/* @__PURE__ */ return new Date(`${e}T00:00:00`)}if("month"===t){if(!/^\d{4}-\d{2}$/.test(e))throw new Error("Invalid month format. Expected: YYYY-MM");/* @__PURE__ */ return new Date(`${e}-01T00:00:00`)}if("time"===t){if(!/^(?:[01]\d|2[0-3]):[0-5]\d(?::[0-5]\d)?$/.test(e))throw new Error("Invalid time format. Expected: HH:mm or HH:mm:ss");return 8===e.length?/* @__PURE__ */new Date(`${l}-${re(o+1)}-${re(i)}T${e}`):/* @__PURE__ */new Date(`${l}-${re(o+1)}-${re(i)}T${e}:00`)}if(!/^\d{4}-\d{2}-\d{2}T\d{2}:\d{2}(?::\d{2})?$/.test(e))throw new Error("Invalid datetime format. Expected: YYYY-MM-DDThh:mm or YYYY-MM-DDThh:mm:ss");return 16===e.length?/* @__PURE__ */new Date(`${e}:00`):/* @__PURE__ */new Date(`${e}`)}(ye.value,Z.value)),me.value||be.value){const t=new Date(me.value||be.value);if(Z.value!==ct.DATETIME_LOCAL&&Z.value!==ct.DATE&&Z.value!==ct.MONTH||(t.setFullYear(e.getFullYear()),t.setMonth(e.getMonth())),Z.value!==ct.DATETIME_LOCAL&&Z.value!==ct.DATE||t.setDate(e.getDate()),Z.value!==ct.DATETIME_LOCAL&&Z.value!==ct.TIME||(t.setHours(e.getHours()),t.setMinutes(e.getMinutes()),t.setSeconds(e.getSeconds())),me.value instanceof Date){if(ie.value?.getTime()===t.getTime())return;return void(ie.value=t)}return void(ie.value=t.toISOString())}return void(ie.value=se(e,Z.value,ne.value))}(ie.value||we.value)&&(ie.value=we.value)}}});function Ee(e){if(null==e)return ye.value="",void(we.value="");if(S.iMask?.mask!==Date){if(Z.value!==ct.NUMBER||!pe.test(we.value)||0!==e){if(Z.value===ct.DATE||Z.value===ct.MONTH||Z.value===ct.DATETIME_LOCAL||Z.value===ct.TIME){if(e instanceof Date||ue(e)){e instanceof Date?(me.value=e,be.value=void 0):(be.value=e,me.value=void 0);const t=new Date(e);return ye.value=se(t,Z.value,ne.value),void(we.value=ye.value)}me.value=void 0,be.value=void 0}ye.value=e,we.value=`${ye.value}`}}else ye.value=e instanceof Date?e:new Date(e)}v(()=>{ge.value&&(fe.value=!0,Ee(S.modelValue))}),c(()=>S.modelValue,e=>{ge.value&&Ee(e)}),c(()=>S.masked,e=>{Se.value=e??""});const $e=he,xe=u(),Le=u(),Te=u();r({$inner:xe});const{focused:De}=function(t,a){const{focused:l}=ee(t);return c(l,l=>{a(l?"focus":"blur",e(t))}),{focused:l}}($e,E),_e=t(()=>De.value&&!S.disabled&&!S.readonly);c(_e,e=>{if(e&&k.value.selectOnFocus&&$e.value&&$e.value.select(),e&&Ge.value?.size)Te.value?.show();else if(Xe.value&&Ge.value){const e=S.maxSuggestions;Ge.value.size>=e&&!Ge.value.has(ie.value)&&(Ge.value=new Set([...Ge.value].slice(Ge.value.size-e+1))),Ge.value.add(ie.value)}});const Ie=ae($e);c(Ie,e=>{e&&S.autofocus&&!S.disabled&&!S.readonly&&(De.value=!0)});const Me=u(!1),Ne=t(()=>S.type===ct.PASSWORD);function He(){Me.value=!Me.value}const Ce=t(()=>S.type===ct.TIME||S.type===ct.DATETIME_LOCAL||S.type===ct.DATE||S.type===ct.WEEK||S.type===ct.MONTH),Be=t(()=>S.type===ct.NUMBER);function Pe(){if(!qe.value){if(S.iMask)return void(ye.value=Number(ye.value)+Number(X?.value??1));$e.value.stepUp(),ie.value=Number(e($e).value)}}function Ve(){if(!qe.value){if(S.iMask)return void(ye.value=Number(ye.value)-Number(X?.value??1));$e.value.stepDown(),ie.value=Number(e($e).value)}}const Re=t(()=>S.type===ct.SEARCH);function je(){ie.value="",E("clear")}const{hasIconBefore:Ue,hasIconAfter:Fe}=ft(N,R),Ye=t(()=>{if(void 0!==Fe.value)return Fe.value;switch(S.type){case ct.COLOR:return{name:Ae};case ct.DATE:case ct.DATETIME_LOCAL:case ct.WEEK:case ct.MONTH:return{name:ke};case ct.TIME:return{name:Oe}}}),{hasIcon:We}=ft(j),{formatted:ze}=function(a,l){const o=t(()=>(e(a)??"").length),i=t(()=>void 0!==l?.lowerLimit&&o.value<l?.lowerLimit?o.value-l.lowerLimit:void 0!==l?.upperLimit&&o.value<l?.upperLimit?l.upperLimit-o.value:0),n=t(()=>{if(!1===l?.mode)return"";if("limit"===l?.mode&&l?.upperLimit)return`${o.value} / ${l.lowerLimit?`${l.lowerLimit}-`:""}${l.upperLimit}`;if("countdown"===l?.mode){if(0===i.value)return;return i}return o.value});return{length:o,gap:i,formatted:n}}(ie,{mode:O.value,upperLimit:Number(z?.value),lowerLimit:Number(q?.value)}),qe=t(()=>S.disabled||S.readonly),Ke=t(()=>qe.value?-1:S.tabindex),Xe=t(()=>!de(K)),Je=t(()=>!0===F.value||!0!==G.value&&void 0),Ze=t(()=>S.storageKey??(T?.experimentalFeatures.forceInputSuggestions?S.name:void 0)),Ge=function(t,l=ce.local,o){const i=u();let n;return o&&(i.value=o),v(()=>{t&&c(t,(t,a)=>{const o=e(l)===ce.session?sessionStorage:localStorage;if(a&&a!==t&&o.removeItem(a),t)return n=te(t,n?.value??i.value,o),void(n.value&&(i.value=n.value));n=void 0},{immediate:!0}),a(l)&&c(l,(e,a)=>{if(t?.value){if(e){const a=e===ce.session?sessionStorage:localStorage;n=te(t.value,n?.value??i.value,a)}a&&a!==e&&(a===ce.session?sessionStorage:localStorage).removeItem(t.value)}})}),c(i,e=>{n&&(n.value=e)},{deep:!0,immediate:!0}),i}(Ze,J, /* @__PURE__ */new Set),Qe=t(()=>Ge.value?[...Ge.value].filter(e=>de(ie.value)||`${e}`.toLowerCase().includes(`${ie.value}`.toLowerCase())&&e!==ie.value).reverse():[]),et=t(()=>Ze?.value&&Ge.value&&Ge.value.size>0);const{modifiers:tt}=s(S),at=ot("vv-input-text",tt,t(()=>({valid:G.value,invalid:F.value,loading:W.value,disabled:S.disabled,required:S.required,readonly:S.readonly,"icon-before":!!Ue.value,"icon-after":!!Ye.value,floating:S.floating&&!de(S.label),dirty:Xe.value,focus:_e.value&&!qe.value,"auto-width":S.autoWidth}))),it=t(()=>{const e=Ne.value&&Me.value?ct.TEXT:!Ce.value||Xe.value||De.value?S.iMask?ct.TEXT:S.type:ct.TEXT,t={type:e,name:S.name,tabindex:Ke.value,disabled:S.disabled,readonly:S.readonly,required:S.required,autocomplete:S.autocomplete,"aria-invalid":Je.value,"aria-describedby":mt.value?le.value:void 0,"aria-errormessage":bt.value?le.value:void 0,inputMode:S.inputMode};if(e===ct.DATE||e===ct.MONTH||e===ct.WEEK||e===ct.TIME||e===ct.DATETIME_LOCAL||e===ct.NUMBER){let a=S.max;e!==ct.DATE||a||(a="9999-12-31"),t.step=S.step,t.max=void 0!==a?String(a):void 0,t.min=void 0!==S.min?String(S.min):void 0}return e!==ct.TEXT&&e!==ct.SEARCH&&e!==ct.URL&&e!==ct.TEL&&e!==ct.EMAIL&&e!==ct.PASSWORD&&e!==ct.NUMBER||(t.placeholder=oe.value),e!==ct.TEXT&&e!==ct.SEARCH&&e!==ct.URL&&e!==ct.TEL&&e!==ct.EMAIL&&e!==ct.PASSWORD||(t.minlength=S.minlength,t.maxlength=S.maxlength,t.pattern=S.pattern),e===ct.EMAIL&&(t.multiple=S.multiple),t}),rt=t(()=>({valid:S.valid,invalid:S.invalid,modelValue:S.modelValue,togglePassword:He,stepUp:Pe,stepDown:Ve,clear:je})),{HintSlot:ut,hasHintLabelOrSlot:mt,hasInvalidLabelOrSlot:bt,hintSlotScope:ht}=function(e,i){const n=t(()=>a(e)?e.value:e),r=t(()=>ve(n.value.invalidLabel)),u=t(()=>ve(n.value.validLabel)),s=t(()=>n.value.loadingLabel),d=t(()=>n.value.hintLabel),v=t(()=>Boolean(n.value.loading&&(i.loading||s.value))),c=t(()=>!v.value&&Boolean(n.value.invalid&&(i.invalid||r.value))),p=t(()=>!v.value&&!c.value&&Boolean(n.value.valid&&(i.valid||u.value))),f=t(()=>!v.value&&!c.value&&!p.value&&Boolean(i.hint||d.value)),m=t(()=>c.value||p.value||v.value||f.value),b=t(()=>({modelValue:n.value.modelValue,valid:n.value.valid,invalid:n.value.invalid,loading:n.value.loading})),h=l({name:"HintSlot",props:{tag:{type:String,default:"small"}},setup:()=>({isVisible:m,invalidLabel:r,validLabel:u,loadingLabel:s,hintLabel:d,hasInvalidLabelOrSlot:c,hasValidLabelOrSlot:p,hasLoadingLabelOrSlot:v,hasHintLabelOrSlot:f}),render(){if(this.isVisible){let e;return this.hasInvalidLabelOrSlot&&(e="alert"),this.hasValidLabelOrSlot&&(e="status"),this.hasLoadingLabelOrSlot?o(this.tag,{role:e},this.$slots.loading?.()??this.loadingLabel):this.hasInvalidLabelOrSlot?o(this.tag,{role:e},this.$slots.invalid?.()??this.$slots.invalid??this.invalidLabel):this.hasValidLabelOrSlot?o(this.tag,{role:e},this.$slots.valid?.()??this.validLabel):o(this.tag,{role:e},this.$slots.hint?.()??this.$slots.hint??this.hintLabel)}return null}});return{hasInvalidLabelOrSlot:c,hasHintLabelOrSlot:f,hasValidLabelOrSlot:p,hasLoadingLabelOrSlot:v,hintSlotScope:b,HintSlot:h}}(k,$),Dt=gt(ct.PASSWORD,S,Xe),kt=gt(ct.NUMBER,S,Xe),Ot=gt(ct.SEARCH,S,Xe);function At(){qe.value||(De.value=!0)}const _t=t(()=>{if(S.autoWidth)return{width:void 0!==ie.value?`${String(ie.value).length+1}ch`:void 0}});function It(e){switch(e.code){case"ArrowUp":Be.value&&(Pe(),e.preventDefault());break;case"ArrowDown":Be.value&&(Ve(),e.preventDefault())}E("keydown",e)}return(t,a)=>(f(),p("div",{class:L(e(at))},[e(Y)?(f(),p("label",{key:0,for:e(Q),class:"vv-input-text__label"},M(e(Y)),9,yt)):D("v-if",!0),x("div",{ref_key:"wrapperEl",ref:Le,class:"vv-input-text__wrapper"},[t.$slots.before?(f(),p("div",St,[h(t.$slots,"before",g(y(e(rt))))])):D("v-if",!0),x("div",{ref_key:"innerEl",ref:xe,class:"vv-input-text__inner",onClick:C(At,["stop"])},[e(Ue)?(f(),_(vt,w({key:0},e(Ue),{class:"vv-input-text__icon"}),null,16)):D("v-if",!0),x("input",w({id:e(Q),ref_key:"inputEl",ref:$e},e(it),{style:e(_t),onKeyup:a[0]||(a[0]=e=>E("keyup",e)),onKeydown:It,onKeypress:a[1]||(a[1]=e=>E("keypress",e))}),null,16,wt),(t.unit||t.$slots.unit)&&e(Xe)?(f(),p("div",Et,[h(t.$slots,"unit",g(y(e(rt))),()=>[I(M(t.unit),1)])])):D("v-if",!0)],512),e(Ye)?(f(),_(vt,w({key:1},e(Ye),{class:"vv-input-text__icon vv-input-text__icon-after"}),null,16)):!e(Ne)||t.hideActions||e(qe)?!e(Be)||t.hideActions||e(qe)?!e(Re)||t.hideActions||e(qe)?D("v-if",!0):(f(),_(e(Ot),{key:4,onClear:je})):(f(),_(e(kt),{key:3,onStepUp:Pe,onStepDown:Ve})):(f(),_(e(Dt),{key:2,onTogglePassword:He})),t.$slots.after?(f(),p("div",$t,[h(t.$slots,"after",g(y(e(rt))))])):D("v-if",!0),e(O)?(f(),p("span",xt,[h(t.$slots,"count",g(y(e(rt))),()=>[I(M(e(ze)),1)])])):D("v-if",!0)],512),m(e(ut),{id:e(le),class:"vv-input-text__hint"},B({_:2},[t.$slots.hint?{name:"hint",fn:b(()=>[h(t.$slots,"hint",g(y(e(ht))))]),key:"0"}:void 0,t.$slots.loading?{name:"loading",fn:b(()=>[h(t.$slots,"loading",g(y(e(ht))))]),key:"1"}:void 0,t.$slots.valid?{name:"valid",fn:b(()=>[h(t.$slots,"valid",g(y(e(ht))))]),key:"2"}:void 0,t.$slots.invalid?{name:"invalid",fn:b(()=>[h(t.$slots,"invalid",g(y(e(ht))))]),key:"3"}:void 0]),1032,["id"]),e(et)?(f(),_(nt,{key:1,ref_key:"suggestionsDropdownEl",ref:Te,reference:e(Le),"autofocus-first":!1,"trigger-width":!0},{items:b(()=>[(f(!0),p(n,null,P(e(Qe),a=>(f(),_(st,{key:a,onClick:C(e=>{return t=a,ie.value=t,Te.value?.hide(),void E("suggestion:selected",t);var t},["stop"])},{default:b(()=>[x("div",Lt,[h(t.$slots,"suggestion",w({ref_for:!0},{value:a}),()=>[I(M(a),1)])]),e(Ge)&&e(We)?(f(),p("button",{key:0,type:"button",tabindex:"-1",class:"cursor-pointer",title:t.labelRemoveSuggestion,onClick:C(e=>{return t=a,Ge.value?.delete(t),void E("suggestion:removed",t);var t},["stop"])},[m(vt,w({ref_for:!0},e(We)),null,16)],8,Tt)):D("v-if",!0)]),_:2},1032,["onClick"]))),128))]),_:3},8,["reference"])):D("v-if",!0)],2))}});export{Dt as default};