PronounsPage/app/components/Pronunciation.vue
2025-09-17 11:21:06 +02:00

36 lines
883 B
Vue

<script setup lang="ts">
import type { VoiceKey } from '#shared/pronunciation/voices.ts';
import useConfig from '~/composables/useConfig.ts';
withDefaults(defineProps<{
pronunciation: string;
text?: boolean;
voices?: VoiceKey[];
}>(), {
voices: () => {
const config = useConfig();
if (!config.pronunciation?.enabled) {
return [];
}
return config.pronunciation.voices;
},
});
</script>
<template>
<span class="text-nowrap">
<span v-if="text" class="text-secondary-emphasis fw-normal">
{{ pronunciation }}
</span>
<PronunciationSpeaker
v-for="voice in voices"
:key="voice"
:pronunciation
:voice
:show-voice-label="voices.length > 1"
class="btn btn-sm btn-link px-1 py-0"
/>
</span>
</template>