vexip-ui/lib/components/icon/icon.cjs

A Vue 3 UI library, Highly customizability, full TypeScript, performance pretty good

"use strict";const r=require("vue"),f=require("@vexip-ui/config"),d=require("@vexip-ui/utils"),v=require("./props.cjs"),N=Object.freeze(["spin-in","spin-out","pulse-in","pulse-out"]),g=/(^\s*[+-]?\d*\.?\d+\s*)(deg|grad|turn|rad)?\s*/i,h=r.defineComponent({name:"Icon",props:v.iconProps,setup(p,{attrs:u,slots:o}){const e=f.useProps("icon",p,{icon:{isFunc:!0,default:null,static:!0},scale:1,title:null,label:null,flip:{default:null,validator:t=>["horizontal","vertical","both"].includes(t)},effect:null,size:null,color:null,rotate:null,renderer:{default:null,isFunc:!0}}),n=f.useNameHelper("icon"),m=r.computed(()=>{let t="";return e.effect&&(t=N.includes(e.effect)?n.bm(e.effect):e.effect),{[n.b()]:!0,[n.bm(`flip-${e.flip}`)]:e.flip,[t]:t}}),c=r.computed(()=>d.toNumber(e.scale)||1),i=r.computed(()=>{var a;if(typeof e.rotate=="number")return`${e.rotate%4/4}turn`;const t=(a=e.rotate)==null?void 0:a.match(g);if(!t)return null;const l=d.toNumber(t[1]);return t[2]?l?`${l}${t[2]}`:null:`${l%4/4}turn`}),b=r.computed(()=>{const t={color:e.color};return e.size?t.fontSize=e.size:c.value!==1&&(t.fontSize=`${c.value}em`),i.value&&(t[n.cv("rotate")]=i.value),t});function s(){const t={class:m.value,style:b.value,title:e.title,role:u.role||(e.label||e.title?"img":void 0),"aria-label":e.label,"aria-hidden":!(e.label||e.title)};return o.default?r.createVNode("i",t,[r.createVNode("g",null,[r.renderSlot(o,"default")])]):e.icon?r.createVNode("i",t,[r.createVNode("g",null,[r.h(e.icon)])]):r.createVNode("i",t,null)}return()=>typeof e.renderer=="function"?e.renderer(e,u,s):s()}});module.exports=h;
//# sourceMappingURL=icon.cjs.map