UNPKG

@farris/ui-vue

Version:

Farris Vue, a Farris Design based Vue3 component library.

2 lines (1 loc) 2.71 kB
(function(l,e){typeof exports=="object"&&typeof module<"u"?e(exports,require("vue"),require("../common/index.umd.js")):typeof define=="function"&&define.amd?define(["exports","vue","../common/index.umd.js"],e):(l=typeof globalThis<"u"?globalThis:l||self,e(l.switch={},l.Vue,l.common))})(this,function(l,e,w){"use strict";const m={modelValue:{type:[String,Number,Boolean],default:!1},disabled:{type:Boolean,default:!1},readonly:{type:Boolean,default:!1},onBackground:{type:String},offBackground:{type:String},onColor:{type:String},offColor:{type:String},onLabel:{type:String},offLabel:{type:String},size:{type:String,default:"medium"},onModelValueChanged:{type:Function,default:()=>{}},focusOnCreated:{type:Boolean,default:!1},trueValue:{type:[String,Number,Boolean],default:!0},falseValue:{type:[String,Number,Boolean],default:!1}},h=e.defineComponent({name:"FSwitch",props:m,emits:["update:modelValue","modelValueChanged"],setup(n,d){const{disabled:p,size:r,onLabel:a,offLabel:u,onBackground:V,offBackground:k,onColor:C,offColor:B,readonly:g}=e.toRefs(n),o=e.ref(n.modelValue),i=e.ref(),f=e.ref(""),s=e.computed(()=>n.trueValue!=null?o.value===n.trueValue:!!o.value),b=e.computed(()=>({switch:!0,"f-cmp-switch":!0,checked:s.value,disabled:g.value||p.value,"switch-large":r.value==="large","switch-medium":r.value==="medium","switch-small":r.value==="small"})),N=e.computed(()=>s.value?{outline:"none",background:V.value}:{outline:"none",backgroundColor:k.value}),T=e.computed(()=>s.value?{background:C.value}:{backgroundColor:B.value}),v=e.computed(()=>(a==null?void 0:a.value)||(u==null?void 0:u.value));function y(){!v.value||i.value||e.nextTick(()=>{const t=o.value,c=i.value.querySelector(t?".switch-label-checked":".switch-label-unchecked");c&&c.scrollWidth>c.clientWidth?f.value=t?a==null?void 0:a.value:u==null?void 0:u.value:f.value=""})}function j(){g.value||p.value||(o.value=s.value?n.falseValue:n.trueValue,d.emit("update:modelValue",o.value),y())}return e.watch(o,(t,c)=>{t!==c&&d.emit("modelValueChanged",t)}),e.watch(()=>n.modelValue,(t,c)=>{t!==c&&(o.value=t)}),e.onMounted(()=>{var t;n.focusOnCreated&&((t=i.value)==null||t.focus()),y()}),()=>e.createVNode("span",{ref:i,tabindex:"0",role:"button",class:b.value,style:N.value,onClick:j,title:f.value},[v.value&&e.createVNode("span",{class:"switch-pane"},[e.createVNode("span",{class:"switch-label-checked"},[a==null?void 0:a.value]),e.createVNode("span",{class:"switch-label-unchecked"},[u==null?void 0:u.value])]),e.createVNode("small",{style:T.value},[d.slots.default&&d.slots.default()])])}}),S=w.withInstall(h);l.FSwitch=h,l.default=S,l.switchProps=m,Object.defineProperties(l,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})});