44 lines
991 B
Vue
44 lines
991 B
Vue
<script setup lang="ts">
|
|
import { computed } from 'vue'
|
|
import { isLinkHttp } from 'vuepress/shared'
|
|
import { withBase } from 'vuepress/client'
|
|
|
|
const props = defineProps<{
|
|
name: string | { svg: string }
|
|
}>()
|
|
|
|
const isLink = computed(() =>
|
|
typeof props.name === 'string' && (isLinkHttp(props.name) || props.name[0] === '/'),
|
|
)
|
|
const isSvg = computed(() => typeof props.name === 'object' && !!props.name.svg)
|
|
|
|
const svg = computed(() => {
|
|
if (isSvg.value)
|
|
return (props.name as { svg: string }).svg
|
|
|
|
return ''
|
|
})
|
|
const link = computed(() => {
|
|
if (isLink.value) {
|
|
const link = props.name as string
|
|
return isLinkHttp(link) ? link : withBase(link)
|
|
}
|
|
return ''
|
|
})
|
|
</script>
|
|
|
|
<template>
|
|
<img v-if="isLink" class="vp__img" :src="link" alt="">
|
|
<span v-else-if="isSvg" class="vp-iconify" v-html="svg" />
|
|
<Icon v-else :name="name" />
|
|
</template>
|
|
|
|
<style scoped>
|
|
.vp__img {
|
|
display: inline-block;
|
|
height: 1em;
|
|
margin: 0 0.3em;
|
|
vertical-align: middle;
|
|
}
|
|
</style>
|