vue-amazing-ui
Version:
An Amazing Vue3 UI Components Library, Using TypeScript.
5 lines (4 loc) • 4.61 kB
JavaScript
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("vue"),f=require("../utils/index.cjs"),E=["onClick"],S={class:"radio-label"},$=["onClick"],w={class:"radio-label"},V={key:0,class:"radio-label"},z={class:"radio-label"},N=e.defineComponent({__name:"Radio",props:{options:{default:()=>[]},disabled:{type:Boolean,default:!1},vertical:{type:Boolean,default:!1},checked:{type:Boolean,default:!1},gap:{default:8},button:{type:Boolean,default:!1},buttonStyle:{default:"outline"},buttonSize:{default:"middle"},value:{type:[String,Number,Boolean],default:void 0}},emits:["update:checked","update:value","change"],setup(p,{emit:y}){const t=p,n=e.ref(!1),r=e.ref(),o=e.ref(!1),{colorPalettes:v}=f.useInject("Radio"),i=y,B=f.useSlotsExist(["default"]),g=e.computed(()=>t.options.length),C=e.computed(()=>t.button?0:!t.vertical&&Array.isArray(t.gap)?`${t.gap[1]}px ${t.gap[0]}px`:`${t.gap}px`);e.watchEffect(()=>{n.value=t.checked}),e.watchEffect(()=>{r.value=t.value});function s(a){return a===void 0?t.disabled:a}function m(a){a!==r.value&&(k(),r.value=a,i("update:value",a),i("change",a))}function b(){n.value||(k(),n.value=!0,i("update:checked",!0),i("change",!0))}function k(){o.value?(o.value=!1,e.nextTick(()=>{o.value=!0})):o.value=!0}function u(){o.value=!1}return(a,c)=>g.value?(e.openBlock(),e.createElementBlock("div",e.mergeProps({key:0,class:["m-radio",{"radio-vertical":!a.button&&a.vertical}],style:`
--radio-gap: ${C.value};
--radio-primary-color: ${e.unref(v)[5]};
`},a.$attrs),[a.button?(e.openBlock(!0),e.createElementBlock(e.Fragment,{key:1},e.renderList(a.options,(l,d)=>(e.openBlock(),e.createElementBlock("div",{tabindex:"0",class:e.normalizeClass(["radio-button-wrap",{"radio-button-checked":r.value===l.value,"radio-button-disabled":s(l.disabled),"radio-button-solid":a.buttonStyle==="solid","radio-button-small":a.buttonSize==="small","radio-button-large":a.buttonSize==="large"}]),key:d,onClick:h=>s(l.disabled)?()=>!1:m(l.value)},[e.createElementVNode("span",w,[e.renderSlot(a.$slots,"default",{option:l,label:l.label,index:d},()=>[e.createTextVNode(e.toDisplayString(l.label),1)],!0)]),s(l.disabled)?e.createCommentVNode("",!0):(e.openBlock(),e.createElementBlock("span",{key:0,class:e.normalizeClass(["radio-wave",{"wave-active":o.value&&r.value===l.value}]),onAnimationend:u},null,34))],10,$))),128)):(e.openBlock(!0),e.createElementBlock(e.Fragment,{key:0},e.renderList(a.options,(l,d)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(["radio-wrap",{"radio-disabled":s(l.disabled)}]),key:d,onClick:h=>s(l.disabled)?()=>!1:m(l.value)},[e.createElementVNode("span",{class:e.normalizeClass(["radio-handle",{"radio-checked":r.value===l.value}])},[s(l.disabled)?e.createCommentVNode("",!0):(e.openBlock(),e.createElementBlock("span",{key:0,class:e.normalizeClass(["radio-wave",{"wave-active":o.value&&r.value===l.value}]),onAnimationend:u},null,34))],2),e.createElementVNode("span",S,[e.renderSlot(a.$slots,"default",{option:l,label:l.label,index:d},()=>[e.createTextVNode(e.toDisplayString(l.label),1)],!0)])],10,E))),128))],16)):(e.openBlock(),e.createElementBlock(e.Fragment,{key:1},[a.button?(e.openBlock(),e.createElementBlock("div",e.mergeProps({key:1,tabindex:"0",class:["radio-button-wrap radio-button-single",{"radio-button-checked":n.value,"radio-button-disabled":a.disabled,"radio-button-solid":a.buttonStyle==="solid","radio-button-small":a.buttonSize==="small","radio-button-large":a.buttonSize==="large"}],style:`--radio-primary-color: ${e.unref(v)[5]};`,onClick:c[1]||(c[1]=l=>a.disabled?()=>!1:b())},a.$attrs),[e.createElementVNode("span",z,[e.renderSlot(a.$slots,"default",{},void 0,!0)]),a.disabled?e.createCommentVNode("",!0):(e.openBlock(),e.createElementBlock("span",{key:0,class:e.normalizeClass(["radio-wave",{"wave-active":o.value&&n.value}]),onAnimationend:u},null,34))],16)):(e.openBlock(),e.createElementBlock("div",e.mergeProps({key:0,class:["radio-wrap",{"radio-disabled":a.disabled}],style:`--radio-primary-color: ${e.unref(v)[5]};`,onClick:c[0]||(c[0]=l=>a.disabled?()=>!1:b())},a.$attrs),[e.createElementVNode("span",{class:e.normalizeClass(["radio-handle",{"radio-checked":n.value}])},[a.disabled?e.createCommentVNode("",!0):(e.openBlock(),e.createElementBlock("span",{key:0,class:e.normalizeClass(["radio-wave",{"wave-active":o.value&&n.value}]),onAnimationend:u},null,34))],2),e.unref(B).default?(e.openBlock(),e.createElementBlock("span",V,[e.renderSlot(a.$slots,"default",{},void 0,!0)])):e.createCommentVNode("",!0)],16))],64))}});exports.default=N;