UNPKG

@wikimedia/codex

Version:

Codex Design System for Wikimedia

2 lines (1 loc) 2.69 kB
"use strict";const t=require("vue"),f=require("./CdxLabel.cjs"),m=require("./useLabelChecker.js"),b=require("./useModelWrapper.cjs"),w=require("./useSplitAttributes.cjs"),y=require("./useFieldData.cjs"),k=require("./_plugin-vue_export-helper.js"),C=t.defineComponent({name:"CdxToggleSwitch",components:{CdxLabel:f},inheritAttrs:!1,props:{modelValue:{type:[Boolean,Array],default:!1},inputValue:{type:[String,Number,Boolean],default:!1},alignSwitch:{type:Boolean,default:!1},hideLabel:{type:Boolean,default:!1},disabled:{type:Boolean,default:!1}},emits:["update:modelValue"],setup(e,{emit:s,slots:o,attrs:i}){var a;m.useLabelChecker((a=o.default)==null?void 0:a.call(o),i,"CdxToggleSwitch");const d=t.ref(),r=t.useId(),n=t.useId(),l=t.computed(()=>({"cdx-toggle-switch--align-switch":e.alignSwitch})),{rootClasses:p,rootStyle:u,otherAttrs:c}=w(i,l),{computedDisabled:h}=y(t.toRef(e,"disabled")),g=b(t.toRef(e,"modelValue"),s);return{input:d,inputId:r,descriptionId:n,rootClasses:p,rootStyle:u,otherAttrs:c,computedDisabled:h,wrappedModel:g,clickInput:()=>{d.value.click()}}}}),v=["id","aria-describedby","value","disabled"];function $(e,s,o,i,d,r){const n=t.resolveComponent("cdx-label");return t.openBlock(),t.createElementBlock("span",{class:t.normalizeClass(["cdx-toggle-switch",e.rootClasses]),style:t.normalizeStyle(e.rootStyle)},[t.withDirectives(t.createElementVNode("input",t.mergeProps({id:e.inputId,ref:"input","onUpdate:modelValue":s[0]||(s[0]=l=>e.wrappedModel=l),class:"cdx-toggle-switch__input",type:"checkbox",role:"switch","aria-describedby":e.$slots.description&&e.$slots.description().length>0?e.descriptionId:void 0,value:e.inputValue,disabled:e.computedDisabled},e.otherAttrs,{onKeydown:s[1]||(s[1]=t.withKeys(t.withModifiers((...l)=>e.clickInput&&e.clickInput(...l),["prevent"]),["enter"]))}),null,16,v),[[t.vModelCheckbox,e.wrappedModel]]),s[2]||(s[2]=t.createElementVNode("span",{class:"cdx-toggle-switch__switch"},[t.createElementVNode("span",{class:"cdx-toggle-switch__switch__grip"})],-1)),e.$slots.default&&e.$slots.default().length?(t.openBlock(),t.createBlock(n,{key:0,class:"cdx-toggle-switch__label","input-id":e.inputId,"description-id":e.$slots.description&&e.$slots.description().length>0?e.descriptionId:void 0,"visually-hidden":e.hideLabel,disabled:e.computedDisabled},t.createSlots({default:t.withCtx(()=>[t.renderSlot(e.$slots,"default")]),_:2},[e.$slots.description&&e.$slots.description().length>0?{name:"description",fn:t.withCtx(()=>[t.renderSlot(e.$slots,"description")]),key:"0"}:void 0]),1032,["input-id","description-id","visually-hidden","disabled"])):t.createCommentVNode("v-if",!0)],6)}const S=k._export_sfc(C,[["render",$]]);module.exports=S;