chore: initialize
This commit is contained in:
36
src/components/SvgIcon.vue
Normal file
36
src/components/SvgIcon.vue
Normal file
@@ -0,0 +1,36 @@
|
||||
<script setup lang='ts'>
|
||||
import { computed, useAttrs } from 'vue'
|
||||
import { Icon } from '@iconify/vue'
|
||||
|
||||
interface Props {
|
||||
icon?: string
|
||||
localIcon?: string
|
||||
}
|
||||
|
||||
const props = defineProps<Props>()
|
||||
|
||||
const attrs = useAttrs()
|
||||
|
||||
const bindAttrs = computed<{ class: string; style: string }>(() => ({
|
||||
class: (attrs.class as string) || '',
|
||||
style: (attrs.style as string) || '',
|
||||
}))
|
||||
|
||||
const symbolId = computed(() => {
|
||||
const icon = props.localIcon || 'no-icon'
|
||||
return `#icon-local-${icon}`
|
||||
})
|
||||
|
||||
const renderLocalIcon = computed(() => props.localIcon || !props.icon)
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<template v-if="renderLocalIcon">
|
||||
<svg aria-hidden="true" width="1em" height="1em" v-bind="bindAttrs">
|
||||
<use :xlink:href="symbolId" fill="currentColor" />
|
||||
</svg>
|
||||
</template>
|
||||
<template v-else>
|
||||
<Icon v-if="icon" :icon="icon" v-bind="bindAttrs" />
|
||||
</template>
|
||||
</template>
|
||||
Reference in New Issue
Block a user