vexip-ui
Version:
A Vue 3 UI library, Highly customizability, full TypeScript, performance pretty good
1 lines • 6.13 kB
Source Map (JSON)
{"version":3,"file":"icon.mjs","sources":["../../../components/icon/icon.tsx"],"sourcesContent":["import { computed, defineComponent, h, renderSlot } from 'vue'\n\nimport { useNameHelper, useProps } from '@vexip-ui/config'\nimport { toNumber } from '@vexip-ui/utils'\nimport { iconProps } from './props'\n\nimport type { CSSProperties } from 'vue'\nimport type { IconPresetEffect } from './symbol'\n\nconst internalEffects = Object.freeze<IconPresetEffect[]>([\n 'spin-in',\n 'spin-out',\n 'pulse-in',\n 'pulse-out',\n])\n\nconst angleRE = /(^\\s*[+-]?\\d*\\.?\\d+\\s*)(deg|grad|turn|rad)?\\s*/i\n\nexport default defineComponent({\n name: 'Icon',\n props: iconProps,\n setup(_props, { attrs, slots }) {\n const props = useProps('icon', _props, {\n icon: {\n isFunc: true,\n default: null,\n static: true,\n },\n scale: 1,\n title: null,\n label: null,\n flip: {\n default: null,\n validator: value => ['horizontal', 'vertical', 'both'].includes(value),\n },\n effect: null,\n size: null,\n color: null,\n rotate: null,\n renderer: {\n default: null,\n isFunc: true,\n },\n })\n\n const nh = useNameHelper('icon')\n\n const className = computed(() => {\n let effectCls = ''\n\n if (props.effect) {\n effectCls = internalEffects.includes(props.effect as IconPresetEffect)\n ? nh.bm(props.effect)\n : props.effect\n }\n\n return {\n [nh.b()]: true,\n [nh.bm(`flip-${props.flip}`)]: props.flip,\n [effectCls]: effectCls,\n }\n })\n const computedScale = computed(() => toNumber(props.scale) || 1)\n const rotate = computed(() => {\n if (typeof props.rotate === 'number') {\n return `${(props.rotate % 4) / 4}turn`\n }\n\n const matched = props.rotate?.match(angleRE)\n\n if (!matched) return null\n\n const number = toNumber(matched[1])\n\n if (!matched[2]) {\n return `${(number % 4) / 4}turn`\n }\n\n return number ? `${number}${matched[2]}` : null\n })\n const style = computed(() => {\n const style: CSSProperties = {\n color: props.color,\n }\n\n if (props.size) {\n style.fontSize = props.size\n } else if (computedScale.value !== 1) {\n style.fontSize = `${computedScale.value}em`\n }\n\n if (rotate.value) {\n style[nh.cv('rotate')] = rotate.value\n }\n\n return style\n })\n\n function renderDefault() {\n const iAttrs = {\n class: className.value,\n style: style.value,\n title: props.title,\n role: (attrs.role as string) || (props.label || props.title ? 'img' : undefined),\n 'aria-label': props.label,\n 'aria-hidden': !(props.label || props.title),\n }\n\n if (slots.default) {\n return (\n <i {...iAttrs}>\n <g>{renderSlot(slots, 'default')}</g>\n </i>\n )\n }\n\n if (props.icon) {\n return (\n <i {...iAttrs}>\n <g>{h(props.icon)}</g>\n </i>\n )\n }\n\n return <i {...iAttrs}></i>\n }\n\n return () => {\n if (typeof props.renderer === 'function') {\n return props.renderer(props as any, attrs, renderDefault)\n }\n\n return renderDefault()\n }\n },\n})\n"],"names":["internalEffects","Object","freeze","angleRE","defineComponent","name","props","iconProps","setup","_props","attrs","slots","useProps","icon","isFunc","default","static","scale","title","label","flip","validator","value","includes","effect","size","color","rotate","renderer","nh","useNameHelper","className","computed","effectCls","bm","b","computedScale","toNumber","matched","match","number","style","fontSize","cv","renderDefault","iAttrs","class","role","undefined","_createVNode","renderSlot","h"],"mappings":"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"}