@volverjs/ui-vue
Version:
@volverjs/ui-vue is a lightweight Vue 3 component library to accompany @volverjs/style.
2 lines (1 loc) • 8.13 kB
JavaScript
import{inject as e,computed as a,toRef as l,toRefs as t,isRef as i,defineComponent as n,h as o,useId as r,unref as u,useSlots as s,ref as d,watchEffect as v,watch as f,onMounted as c,createElementBlock as b,openBlock as h,normalizeClass as y,withDirectives as g,renderSlot as p,createVNode as m,createElementVNode as S,vModelCheckbox as L,createTextVNode as k,toDisplayString as O,createSlots as A,withCtx as V,normalizeProps as $,guardReactiveProps as x}from"vue";var B=/* @__PURE__ */(e=>(e.local="local",e.session="session",e))(B||{}),N=/* @__PURE__ */(e=>(e.left="left",e.right="right",e.top="top",e.bottom="bottom",e))(N||{}),j=/* @__PURE__ */(e=>(e.before="before",e.after="after",e))(j||{}),I=/* @__PURE__ */(e=>(e.button="button",e.submit="submit",e.reset="reset",e))(I||{}),w=/* @__PURE__ */(e=>(e.nuxtLink="nuxt-link",e.routerLink="router-link",e.a="a",e.button="button",e))(w||{});const G=Symbol.for("volver"),H=Symbol.for("checkGroup"),_={valid:{type:Boolean,default:!1},validLabel:{type:[String,Array],default:void 0}},E={invalid:{type:Boolean,default:!1},invalidLabel:{type:[String,Array],default:void 0}},R={loading:{type:Boolean,default:!1},loadingLabel:{type:String,default:"Loading..."}},C={disabled:{type:Boolean,default:!1}},T={label:{type:[String,Number],default:void 0}},D={readonly:{type:Boolean,default:!1}},J={modifiers:{type:[String,Array],default:void 0}},q={hintLabel:{type:String,default:""}};j.before;const P={tabindex:{type:[String,Number],default:0}},U={id:[String,Number]};N.bottom;const z={...{...U,name:{type:String,required:!0}},...P,..._,...E,...q,...C,...D,...J,...T,...R,value:{type:[String,Number,Boolean],default:void 0},modelValue:{type:[Object,Number,Boolean,String],default:void 0}};I.button,w.button,B.local;const F={...z,...J,indeterminate:Boolean,uncheckedValue:[String,Number,Boolean],switch:Boolean};function K(i,n){const{group:o,isInGroup:r,getGroupOrLocalRef:u}=function(t){const i=e(t,void 0),n=a(()=>void 0!==i);return{group:i,isInGroup:n,getGroupOrLocalRef:function(e,t,n){const o=i?.[e];if(o)return a({get:()=>o.value,set(e){o.value=e}});const r=l(t,e);return a({get:()=>r.value,set(a){n&&n(`update:${e}`,a)}})}}}(H),{id:s,switch:d,indeterminate:v}=t(i),f=u("modelValue",i,n),c=u("valid",i),b=u("invalid",i),h=a(()=>Boolean(i.readonly||o?.readonly.value)),y=a(()=>Boolean(i.disabled||o?.disabled.value));return{id:s,propsSwitch:d,indeterminate:v,group:o,isInGroup:r,modelValue:f,valid:c,invalid:b,readonly:h,disabled:y}}function M(e,a,l){return Q(e,a)}function Q(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,n,o;if(l&&t){if(n=e.length,n!==a.length)return!1;for(i=n;0!==i--;)if(!Q(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 s=e instanceof RegExp,d=a instanceof RegExp;if(s!==d)return!1;if(s&&d)return e.toString()===a.toString();const v=Object.keys(e);if(n=v.length,n!==Object.keys(a).length)return!1;for(i=n;0!==i--;)if(!Object.prototype.hasOwnProperty.call(a,v[i]))return!1;for(i=n;0!==i--;)if(o=v[i],!Q(e[o],a[o]))return!1;return!0}return Number.isNaN(e)&&Number.isNaN(a)}function W(e){return Array.isArray(e)?e.filter(e=>"string"==typeof e).join(" "):e}function X(l,t,i){const n=e(G,void 0),o=a(()=>{if(n&&n.defaults.value?.[l])return n.defaults.value[l]});return a(()=>{if(void 0===o.value)return i;const e=o.value,a=t,l=i;return Object.keys(a).reduce((t,i)=>{const n=l[i];if(t[i]=n,i in e){if(Array.isArray(a[i])){const l=a[i];if(l.length){l[0]===n&&(t[i]=e[i])}}if("function"==typeof a[i]){(0,a[i])()===n&&(t[i]=e[i])}if("object"==typeof a[i]){let l=a[i].default;"function"==typeof l&&(l=l()),"object"==typeof l?JSON.stringify(l)===JSON.stringify(n)&&(t[i]=e[i]):l===n&&(t[i]=e[i])}}return t},{})})}const Y=["for"],Z=["id","name","disabled","value","tabindex","aria-invalid","aria-describedby","aria-errormessage"],ee=/* @__PURE__ */n({name:"VvCheckbox",props:F,emits:["click","update:modelValue","change","blur"],setup(e,{emit:l}){const B=e,N=l,j=s(),I=X("VvCheckbox",F,B),{id:w,disabled:G,readonly:H,valid:_,invalid:E,propsSwitch:R,modelValue:C,indeterminate:T,isInGroup:D}=K(B,N),J=function(e){return a(()=>String(e?.value||r()))}(w),q=a(()=>`${J.value}-hint`),P=a(()=>Q.value?-1:B.tabindex),U=d(),z=a(()=>void 0!==B.uncheckedValue&&!D.value),Q=a(()=>G.value||H.value),ee=a(()=>!0===E.value||!0!==_.value&&void 0),ae=a(()=>z.value?C.value===B.value:Array.isArray(C.value)?function(e,a){if(null!=e&&a&&a.length)for(const l of a)if(M(e,l))return!0;return!1}(B.value,C.value):M(B.value,C.value)),le=a(()=>!!T.value||!(ae.value||!z.value||B.uncheckedValue===C.value)),te=a(()=>{if(!z.value)return!["string","number","boolean"].includes(typeof B.value)||B.value}),ie=a({get:()=>ae.value,set(e){if(z.value)C.value=e?B.value:B.uncheckedValue;else if(Array.isArray(C.value)||D.value){const a=C.value??[],l=new Set(Array.isArray(a)?a:[a]);e?l.add(B.value):l.delete(B.value),C.value=[...l]}else C.value=e?B.value:void 0;N("change",e)}}),{modifiers:ne}=t(B),oe=function(e,l,t){return a(()=>{const a={[e]:!0},i="string"==typeof l?.value?l.value.split(" "):l?.value;return i&&Array.isArray(i)&&i.forEach(l=>{l&&(a[`${e}--${l}`]=!0)}),t&&Object.keys(t.value).forEach(l=>{a[`${e}--${l}`]=u(t.value[l])}),a})}("vv-checkbox",ne,a(()=>({switch:R.value,valid:_.value,invalid:E.value,disabled:G.value,readonly:H.value,indeterminate:T.value})));v(()=>{z.value&&Array.isArray(C.value)&&console.warn("[VvCheckbox] The model value is an array but the component is in binary mode.")}),f(()=>le.value,e=>{U.value.indeterminate=!!e}),c(()=>{le.value&&(U.value.indeterminate=!0)});const{HintSlot:re,hasHintLabelOrSlot:ue,hasInvalidLabelOrSlot:se,hintSlotScope:de}=function(e,l){const t=a(()=>i(e)?e.value:e),r=a(()=>W(t.value.invalidLabel)),u=a(()=>W(t.value.validLabel)),s=a(()=>t.value.loadingLabel),d=a(()=>t.value.hintLabel),v=a(()=>Boolean(t.value.loading&&(l.loading||s.value))),f=a(()=>!v.value&&Boolean(t.value.invalid&&(l.invalid||r.value))),c=a(()=>!v.value&&!f.value&&Boolean(t.value.valid&&(l.valid||u.value))),b=a(()=>!v.value&&!f.value&&!c.value&&Boolean(l.hint||d.value)),h=a(()=>f.value||c.value||v.value||b.value),y=a(()=>({modelValue:t.value.modelValue,valid:t.value.valid,invalid:t.value.invalid,loading:t.value.loading})),g=n({name:"HintSlot",props:{tag:{type:String,default:"small"}},setup:()=>({isVisible:h,invalidLabel:r,validLabel:u,loadingLabel:s,hintLabel:d,hasInvalidLabelOrSlot:f,hasValidLabelOrSlot:c,hasLoadingLabelOrSlot:v,hasHintLabelOrSlot:b}),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:f,hasHintLabelOrSlot:b,hasValidLabelOrSlot:c,hasLoadingLabelOrSlot:v,hintSlotScope:y,HintSlot:g}}(I,j);return(e,a)=>(h(),b("label",{class:y(u(oe)),for:u(J)},[g(S("input",{id:u(J),ref_key:"input",ref:U,"onUpdate:modelValue":a[0]||(a[0]=e=>i(ie)?ie.value=e:null),type:"checkbox",class:"vv-checkbox__input",name:e.name,disabled:u(Q),value:u(te),tabindex:u(P),"aria-invalid":u(ee),"aria-describedby":u(ue)?u(q):void 0,"aria-errormessage":u(se)?u(q):void 0},null,8,Z),[[L,u(ie)]]),p(e.$slots,"default",{value:u(C)},()=>[k(O(e.label),1)]),m(u(re),{id:u(q),class:"vv-checkbox__hint"},A({_:2},[e.$slots.hint?{name:"hint",fn:V(()=>[p(e.$slots,"hint",$(x(u(de))))]),key:"0"}:void 0,e.$slots.loading?{name:"loading",fn:V(()=>[p(e.$slots,"loading",$(x(u(de))))]),key:"1"}:void 0,e.$slots.valid?{name:"valid",fn:V(()=>[p(e.$slots,"valid",$(x(u(de))))]),key:"2"}:void 0,e.$slots.invalid?{name:"invalid",fn:V(()=>[p(e.$slots,"invalid",$(x(u(de))))]),key:"3"}:void 0]),1032,["id"])],10,Y))}});export{ee as default};