From 7a04fd6956d91f514c90c9b2b8f6552fda3c3e0b Mon Sep 17 00:00:00 2001 From: Makito Date: Tue, 8 Jul 2025 04:57:44 +0900 Subject: [PATCH] fix(stage-ui): grapheme splitter in poppin'text --- .../src/components/Widgets/PoppinText/PoppinText.web.vue | 8 +++++++- 1 file changed, 7 insertions(+), 1 deletion(-) diff --git a/packages/stage-ui/src/components/Widgets/PoppinText/PoppinText.web.vue b/packages/stage-ui/src/components/Widgets/PoppinText/PoppinText.web.vue index 78c4ecb12..445ea8ee0 100644 --- a/packages/stage-ui/src/components/Widgets/PoppinText/PoppinText.web.vue +++ b/packages/stage-ui/src/components/Widgets/PoppinText/PoppinText.web.vue @@ -10,7 +10,13 @@ const props = defineProps<{ animator?: Animator }>() -const graphemeClusters = computed(() => [...props.text]) // Safely split text into grapheme clusters with UTF-8 awareness +// Safely split text (some effort) into grapheme clusters with UTF-8 awareness +const graphemeClusters = computed(() => { + const segmenter = new Intl.Segmenter('en-US', { granularity: 'grapheme' }) + const segments = segmenter.segment(props.text) + return Array.from(segments).map(s => s.segment) +}) + const elements = ref([]) const animatorCleanupFn = shallowRef<() => void>()