UNPKG

@volverjs/ui-vue

Version:

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

2 lines (1 loc) 9.86 kB
import{computed as e,isRef as a,defineComponent as l,h as t,inject as i,toRef as o,toRefs as n,useId as r,unref as u,useSlots as d,ref as s,createElementBlock as v,openBlock as f,normalizeClass as b,withDirectives as p,renderSlot as y,createVNode as c,createElementVNode as g,vModelRadio as h,createTextVNode as m,toDisplayString as S,createSlots as L,withCtx as O,normalizeProps as $,guardReactiveProps as V,provide as k,createCommentVNode as A,Fragment as B,renderList as N,createBlock as _,mergeProps as j}from"vue";import{useVModel as x}from"@vueuse/core";import{getProperty as G}from"dot-prop";var I=/* @__PURE__ */(e=>(e.local="local",e.session="session",e))(I||{}),R=/* @__PURE__ */(e=>(e.left="left",e.right="right",e.top="top",e.bottom="bottom",e))(R||{}),q=/* @__PURE__ */(e=>(e.before="before",e.after="after",e))(q||{}),H=/* @__PURE__ */(e=>(e.button="button",e.submit="submit",e.reset="reset",e))(H||{}),K=/* @__PURE__ */(e=>(e.nuxtLink="nuxt-link",e.routerLink="router-link",e.a="a",e.button="button",e))(K||{});const D=Symbol.for("volver"),E=Symbol.for("radioGroup"),F={valid:{type:Boolean,default:!1},validLabel:{type:[String,Array],default:void 0}},w={invalid:{type:Boolean,default:!1},invalidLabel:{type:[String,Array],default:void 0}},C={loading:{type:Boolean,default:!1},loadingLabel:{type:String,default:"Loading..."}},J={disabled:{type:Boolean,default:!1}},T={required:{type:Boolean,default:!1}},z={label:{type:[String,Number],default:void 0}},P={readonly:{type:Boolean,default:!1}},U={modifiers:{type:[String,Array],default:void 0}},M={hintLabel:{type:String,default:""}},Q={options:{type:Array,default:()=>[]},labelKey:{type:[String,Function],default:"label"},valueKey:{type:[String,Function],default:"value"},disabledKey:{type:[String,Function],default:"disabled"}};q.before;const W={tabindex:{type:[String,Number],default:0}},X={id:[String,Number]};R.bottom;const Y={...{...X,name:{type:String,required:!0}},...W,...F,...w,...M,...J,...P,...U,...z,...C,value:{type:[String,Number,Boolean],default:void 0},modelValue:{type:[Object,Number,Boolean,String],default:void 0}},Z={...F,...w,...Q,...M,...J,...P,...U,...z,...C,...T,modelValue:{type:[String,Array,Boolean,Number,Symbol],default:void 0},name:{type:String,required:!0},vertical:{type:Boolean,default:!1}};H.button,K.button,I.local;const ee=Z;function ae(e,a,l){return le(e,a)}function le(e,a){if(e===a)return!0;if(e&&a&&"object"==typeof e&&"object"==typeof a){const l=Array.isArray(e),t=Array.isArray(a);let i,o,n;if(l&&t){if(o=e.length,o!==a.length)return!1;for(i=o;0!==i--;)if(!le(e[i],a[i]))return!1;return!0}if(l!==t)return!1;const r=e instanceof Date,u=a instanceof Date;if(r!==u)return!1;if(r&&u)return e.getTime()===a.getTime();const d=e instanceof RegExp,s=a instanceof RegExp;if(d!==s)return!1;if(d&&s)return e.toString()===a.toString();const v=Object.keys(e);if(o=v.length,o!==Object.keys(a).length)return!1;for(i=o;0!==i--;)if(!Object.prototype.hasOwnProperty.call(a,v[i]))return!1;for(i=o;0!==i--;)if(n=v[i],!le(e[n],a[n]))return!1;return!0}return Number.isNaN(e)&&Number.isNaN(a)}function te(e){return Array.isArray(e)?e.filter(e=>"string"==typeof e).join(" "):e}function ie(i,o){const n=e(()=>a(i)?i.value:i),r=e(()=>te(n.value.invalidLabel)),u=e(()=>te(n.value.validLabel)),d=e(()=>n.value.loadingLabel),s=e(()=>n.value.hintLabel),v=e(()=>Boolean(n.value.loading&&(o.loading||d.value))),f=e(()=>!v.value&&Boolean(n.value.invalid&&(o.invalid||r.value))),b=e(()=>!v.value&&!f.value&&Boolean(n.value.valid&&(o.valid||u.value))),p=e(()=>!v.value&&!f.value&&!b.value&&Boolean(o.hint||s.value)),y=e(()=>f.value||b.value||v.value||p.value),c=e(()=>({modelValue:n.value.modelValue,valid:n.value.valid,invalid:n.value.invalid,loading:n.value.loading})),g=l({name:"HintSlot",props:{tag:{type:String,default:"small"}},setup:()=>({isVisible:y,invalidLabel:r,validLabel:u,loadingLabel:d,hintLabel:s,hasInvalidLabelOrSlot:f,hasValidLabelOrSlot:b,hasLoadingLabelOrSlot:v,hasHintLabelOrSlot:p}),render(){if(this.isVisible){let e;return this.hasInvalidLabelOrSlot&&(e="alert"),this.hasValidLabelOrSlot&&(e="status"),this.hasLoadingLabelOrSlot?t(this.tag,{role:e},this.$slots.loading?.()??this.loadingLabel):this.hasInvalidLabelOrSlot?t(this.tag,{role:e},this.$slots.invalid?.()??this.$slots.invalid??this.invalidLabel):this.hasValidLabelOrSlot?t(this.tag,{role:e},this.$slots.valid?.()??this.validLabel):t(this.tag,{role:e},this.$slots.hint?.()??this.$slots.hint??this.hintLabel)}return null}});return{hasInvalidLabelOrSlot:f,hasHintLabelOrSlot:p,hasValidLabelOrSlot:b,hasLoadingLabelOrSlot:v,hintSlotScope:c,HintSlot:g}}const oe=Y;function ne(a,l){const{id:t}=n(a),{group:r,isInGroup:u,getGroupOrLocalRef:d}=function(a){const l=i(a,void 0),t=e(()=>void 0!==l);return{group:l,isInGroup:t,getGroupOrLocalRef:function(a,t,i){const n=l?.[a];if(n)return e({get:()=>n.value,set(e){n.value=e}});const r=o(t,a);return e({get:()=>r.value,set(e){i&&i(`update:${a}`,e)}})}}}(E),s=d("modelValue",a,l),v=d("valid",a),f=d("invalid",a),b=e(()=>Boolean(a.readonly||r?.readonly.value)),p=e(()=>Boolean(a.disabled||r?.disabled.value));return{id:t,group:r,isInGroup:u,modelValue:s,valid:v,invalid:f,readonly:b,disabled:p}}function re(a,l,t){const o=i(D,void 0),n=e(()=>{if(o&&o.defaults.value?.[a])return o.defaults.value[a]});return e(()=>{if(void 0===n.value)return t;const e=n.value,a=l,i=t;return Object.keys(a).reduce((l,t)=>{const o=i[t];if(l[t]=o,t in e){if(Array.isArray(a[t])){const i=a[t];if(i.length){i[0]===o&&(l[t]=e[t])}}if("function"==typeof a[t]){(0,a[t])()===o&&(l[t]=e[t])}if("object"==typeof a[t]){let i=a[t].default;"function"==typeof i&&(i=i()),"object"==typeof i?JSON.stringify(i)===JSON.stringify(o)&&(l[t]=e[t]):i===o&&(l[t]=e[t])}}return l},{})})}function ue(a,l,t){return e(()=>{const e={[a]:!0},i="string"==typeof l?.value?l.value.split(" "):l?.value;return i&&Array.isArray(i)&&i.forEach(l=>{l&&(e[`${a}--${l}`]=!0)}),t&&Object.keys(t.value).forEach(l=>{e[`${a}--${l}`]=u(t.value[l])}),e})}const de=["for"],se=["id","name","disabled","value","tabindex","aria-invalid","aria-describedby","aria-errormessage"],ve=/* @__PURE__ */l({name:"VvRadio",props:oe,emits:["click","update:modelValue","change","blur"],setup(l,{emit:t}){const i=l,o=t,k=d(),A=re("VvRadio",oe,i),{id:B,disabled:N,readonly:_,modelValue:j,valid:x,invalid:G}=ne(i,o),I=function(a){return e(()=>String(a?.value||r()))}(B),R=e(()=>`${I.value}-hint`),q=e(()=>K.value?-1:i.tabindex),H=s(),K=e(()=>N.value||_.value),D=e(()=>!0===G.value||!0!==x.value&&void 0),E=e(()=>Array.isArray(j.value)?function(e,a){if(null!=e&&a&&a.length)for(const l of a)if(ae(e,l))return!0;return!1}(i.value,j.value):ae(i.value,j.value)),F=e(()=>!["string","number","boolean"].includes(typeof i.value)||i.value),w=e({get:()=>E.value?F.value:null,set(e){Array.isArray(j.value)?j.value=[i.value]:j.value=i.value,o("change",e)}}),{modifiers:C}=n(i),J=ue("vv-radio",C,e(()=>({valid:x.value,invalid:G.value,disabled:N.value,readonly:_.value}))),{HintSlot:T,hasHintLabelOrSlot:z,hasInvalidLabelOrSlot:P,hintSlotScope:U}=ie(A,k);return(e,l)=>(f(),v("label",{class:b(u(J)),for:u(I)},[p(g("input",{id:u(I),ref_key:"input",ref:H,"onUpdate:modelValue":l[0]||(l[0]=e=>a(w)?w.value=e:null),type:"radio",class:"vv-radio__input",name:e.name,disabled:u(K),value:u(F),tabindex:u(q),"aria-invalid":u(D),"aria-describedby":u(z)?u(R):void 0,"aria-errormessage":u(P)?u(R):void 0},null,8,se),[[h,u(w)]]),y(e.$slots,"default",{value:u(j)},()=>[m(S(e.label),1)]),c(u(T),{id:u(R),class:"vv-radio__hint"},L({_:2},[e.$slots.hint?{name:"hint",fn:O(()=>[y(e.$slots,"hint",$(V(u(U))))]),key:"0"}:void 0,e.$slots.loading?{name:"loading",fn:O(()=>[y(e.$slots,"loading",$(V(u(U))))]),key:"1"}:void 0,e.$slots.valid?{name:"valid",fn:O(()=>[y(e.$slots,"valid",$(V(u(U))))]),key:"2"}:void 0,e.$slots.invalid?{name:"invalid",fn:O(()=>[y(e.$slots,"invalid",$(V(u(U))))]),key:"3"}:void 0]),1032,["id"])],10,de))}});const fe=["textContent"],be={class:"vv-radio-group__wrapper"},pe=/* @__PURE__ */l({name:"VvRadioGroup",props:ee,emits:["update:modelValue","change"],setup(a,{emit:l}){const t=a,i=l,o=d(),r=re("VvRadioGroup",ee,t),s=x(t,"modelValue",i),{disabled:p,readonly:h,vertical:m,valid:I,invalid:R,modifiers:q}=n(t);k(E,{modelValue:s,disabled:p,readonly:h,valid:I,invalid:R});const{getOptionLabel:H,getOptionValue:K,isOptionDisabled:D}=function(e){const{options:a,labelKey:l,valueKey:t,disabledKey:i}=n(e);return{options:a,getOptionLabel:e=>"string"==typeof e?e:"function"==typeof l.value?l.value(e):String(l.value?G(e,l.value):e),getOptionValue:e=>"string"==typeof e?e:"function"==typeof t.value?t.value(e):t.value?G(e,t.value):e,isOptionDisabled:e=>"string"!=typeof e&&("function"==typeof i.value?i.value(e):!!i.value&&Boolean(G(e,i.value))),getOptionGrouped:e=>"string"==typeof e?[]:"object"==typeof e&&e&&"options"in e?e.options:[]}}(t),F=ue("vv-radio-group",q,e(()=>({disabled:p.value,readonly:h.value,required:t.required,horizontal:!m.value,valid:I.value,invalid:R.value})));const{HintSlot:w,hintSlotScope:C}=ie(r,o);return(e,a)=>(f(),v("fieldset",{class:b(u(F))},[e.label?(f(),v("legend",{key:0,textContent:S(e.label)},null,8,fe)):A("v-if",!0),g("div",be,[e.options.length>0?(f(!0),v(B,{key:0},N(e.options,(e,a)=>(f(),_(ve,j({key:a},{ref_for:!0},function(e,a){return{id:`${t.name}_opt${a}`,name:t.name,label:H(e),value:K(e),required:t.required,disabled:D(e)}}(e,a)),null,16))),128)):y(e.$slots,"default",{key:1})]),c(u(w),{class:"vv-radio-group__hint"},L({_:2},[e.$slots.hint?{name:"hint",fn:O(()=>[y(e.$slots,"hint",$(V(u(C))))]),key:"0"}:void 0,e.$slots.loading?{name:"loading",fn:O(()=>[y(e.$slots,"loading",$(V(u(C))))]),key:"1"}:void 0,e.$slots.valid?{name:"valid",fn:O(()=>[y(e.$slots,"valid",$(V(u(C))))]),key:"2"}:void 0,e.$slots.invalid?{name:"invalid",fn:O(()=>[y(e.$slots,"invalid",$(V(u(C))))]),key:"3"}:void 0]),1024)],2))}});export{pe as default};