diff --git a/src/uix/eidos/components/words/words-drawer.svelte b/src/uix/eidos/components/words/words-drawer.svelte index 3db89467b..383a11d46 100644 --- a/src/uix/eidos/components/words/words-drawer.svelte +++ b/src/uix/eidos/components/words/words-drawer.svelte @@ -39,7 +39,9 @@ DrawerSnippetProps, DrawerProps, ProviderSnippetProps, - WordsDrawerMode + WordsDrawerMode, + WordsCommandName, + WordsMark } from '$soma/components/words'; import { SvelteMap } from 'svelte/reactivity'; @@ -159,6 +161,45 @@ const found = marks.find((m) => m.startsWith(`${prefix}:`)); return found ? found.slice(prefix.length + 1) : ''; } + + // Typed catalogs for drawer action buttons. `as const` narrows + // `id` to its literal type so it satisfies the canonical unions + // (WordsMark for inline marks; WordsCommandName for runCommand). + // Without this, an inline array literal infers `id: string` and + // runCommand / activeMarks.includes reject the call. + const FORMAT_MARKS = [ + { id: 'bold', label: 'B', title: 'Bold' }, + { id: 'italic', label: 'I', title: 'Italic' }, + { id: 'underline', label: 'U', title: 'Underline' }, + { id: 'strike', label: 'S', title: 'Strikethrough' }, + { id: 'code', label: '<>', title: 'Inline code' } + ] as const satisfies readonly { id: WordsMark & WordsCommandName; label: string; title: string }[]; + + const TEXT_ALIGN_ACTIONS = [ + { id: 'align-left', label: '⫷', title: 'Left' }, + { id: 'align-center', label: '☰', title: 'Center' }, + { id: 'align-right', label: '⫸', title: 'Right' }, + { id: 'align-justify', label: '☷', title: 'Justify' } + ] as const satisfies readonly { id: WordsCommandName; label: string; title: string }[]; + + const CELL_TONE_ACTIONS = [ + { id: 'table-cell-tone-default', label: 'Plain' }, + { id: 'table-cell-tone-muted', label: 'Muted' }, + { id: 'table-cell-tone-accent', label: 'Accent' } + ] as const satisfies readonly { id: WordsCommandName; label: string }[]; + + const CELL_VERTICAL_ACTIONS = [ + { id: 'table-cell-vertical-top', label: '⬆ Top' }, + { id: 'table-cell-vertical-middle', label: '◆ Mid' }, + { id: 'table-cell-vertical-bottom', label: '⬇ Bot' } + ] as const satisfies readonly { id: WordsCommandName; label: string }[]; + + const CELL_TEXT_ALIGN_ACTIONS = [ + { id: 'align-left', label: '⫷' }, + { id: 'align-center', label: '☰' }, + { id: 'align-right', label: '⫸' }, + { id: 'align-justify', label: '☷' } + ] as const satisfies readonly { id: WordsCommandName; label: string }[]; @@ -356,13 +397,7 @@ {#snippet formatPanel(s: ProviderSnippetProps)}
- {#each [ - { id: 'bold', label: 'B', title: 'Bold' }, - { id: 'italic', label: 'I', title: 'Italic' }, - { id: 'underline', label: 'U', title: 'Underline' }, - { id: 'strike', label: 'S', title: 'Strikethrough' }, - { id: 'code', label: '<>', title: 'Inline code' } - ] as mark (mark.id)} + {#each FORMAT_MARKS as mark (mark.id)}
- {#each [ - { id: 'align-left', label: '⫷', title: 'Left' }, - { id: 'align-center', label: '☰', title: 'Center' }, - { id: 'align-right', label: '⫸', title: 'Right' }, - { id: 'align-justify', label: '☷', title: 'Justify' } - ] as a (a.id)} + {#each TEXT_ALIGN_ACTIONS as a (a.id)}
- {#each [ - { id: 'table-cell-tone-default', label: 'Plain' }, - { id: 'table-cell-tone-muted', label: 'Muted' }, - { id: 'table-cell-tone-accent', label: 'Accent' } - ] as t (t.id)} + {#each CELL_TONE_ACTIONS as t (t.id)}