38 lines
829 B
Vue
38 lines
829 B
Vue
|
<script lang="ts" setup>
|
||
|
import { sharedState } from '@slidev/client/state/shared'
|
||
|
import { computed } from '@vue/reactivity'
|
||
|
import { watch } from 'vue';
|
||
|
|
||
|
const props = defineProps({
|
||
|
item: String,
|
||
|
prefix: String,
|
||
|
})
|
||
|
|
||
|
const position = computed<number>(() => {
|
||
|
if (!sharedState.sources) {
|
||
|
sharedState.sources = new Set()
|
||
|
}
|
||
|
return [...sharedState.sources].findIndex(i => props.item === i)
|
||
|
})
|
||
|
|
||
|
watch(
|
||
|
() => props.item,
|
||
|
() => {
|
||
|
if (!sharedState.sources) {
|
||
|
sharedState.sources = new Set()
|
||
|
}
|
||
|
if(!props.item) {
|
||
|
return
|
||
|
}
|
||
|
sharedState.sources.add(props.item)
|
||
|
},
|
||
|
{ immediate: true }
|
||
|
)
|
||
|
</script>
|
||
|
<template>
|
||
|
<span class="text-gray-400 text-sm align-text-top">
|
||
|
{{ prefix }}
|
||
|
[{{ position }}]
|
||
|
</span>
|
||
|
</template>
|