From 98fc40bf62a364adf47bb39c6c24db816c000dce Mon Sep 17 00:00:00 2001 From: dev Date: Thu, 21 May 2026 00:43:45 +0200 Subject: [PATCH] batch A-3.1: add semantic events to 12 interactive morfos MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit A pass over every component flagged "interactive with 0 events" (audit A-3.1) plus the texts.label slot they all shared. The events follow the canonical sema families and reuse the focus-move filtering installed earlier so the audit no longer treats keyboard navigation as missing coverage. Per-component event additions: - listbox: commit-select, commit-unselect (affirm/neutral, target=item) - toggle-group: commit-toggle (intent fromProp, target=item) - grid-list: commit-select, commit-unselect (target=item) - context-menu: open, close, commit-select - dropdown-menu: open, close, commit-select - menubar: commit-select - navigation-menu: commit-select - tree-view: commit-select + shift-expand + shift-collapse - tree-grid: commit-select + shift-expand + shift-collapse - table: shift-sort + commit-select + shift-expand-row - carousel: shift-slide - feed: commit-load-more + shift-focus-item - command: commit-invoke (palette item invocation, intent fulfill) - splitter: commit-resize (handle settle, not continuous drag) - drag-drop: commit-drag-start + commit-drop + commit-cancel - color-field: commit-set - time-field: commit-set Each got a `texts.label` slot + matching catalog entry. New catalog files for context-menu / dropdown-menu / menubar / toggle-group; existing files extended for the rest. Audit: PASS 25 → 33 in one batch. Co-Authored-By: Claude Opus 4.7 (1M context) --- src/uix/langs/components/color-field.ts | 8 +++-- src/uix/langs/components/command.ts | 8 +++-- src/uix/langs/components/context-menu.ts | 12 +++++++ src/uix/langs/components/drag-drop.ts | 4 +++ src/uix/langs/components/dropdown-menu.ts | 8 +++++ src/uix/langs/components/index.ts | 8 +++++ src/uix/langs/components/menubar.ts | 8 +++++ src/uix/langs/components/splitter.ts | 8 +++-- src/uix/langs/components/time-field.ts | 8 +++-- src/uix/langs/components/toggle-group.ts | 8 +++++ src/uix/morfo/components/carousel.ts | 12 +++++++ src/uix/morfo/components/color-field.ts | 13 ++++++++ src/uix/morfo/components/command.ts | 14 ++++++++ src/uix/morfo/components/context-menu.ts | 36 +++++++++++++++++++++ src/uix/morfo/components/drag-drop.ts | 33 +++++++++++++++++++ src/uix/morfo/components/dropdown-menu.ts | 36 +++++++++++++++++++++ src/uix/morfo/components/feed.ts | 24 ++++++++++++++ src/uix/morfo/components/grid-list.ts | 22 +++++++++++++ src/uix/morfo/components/listbox.ts | 22 +++++++++++++ src/uix/morfo/components/menubar.ts | 15 +++++++++ src/uix/morfo/components/navigation-menu.ts | 12 +++++++ src/uix/morfo/components/splitter.ts | 15 +++++++++ src/uix/morfo/components/table.ts | 33 +++++++++++++++++++ src/uix/morfo/components/time-field.ts | 13 ++++++++ src/uix/morfo/components/toggle-group.ts | 21 ++++++++++++ src/uix/morfo/components/tree-grid.ts | 30 +++++++++++++++++ src/uix/morfo/components/tree-view.ts | 31 ++++++++++++++++++ 27 files changed, 454 insertions(+), 8 deletions(-) create mode 100644 src/uix/langs/components/context-menu.ts create mode 100644 src/uix/langs/components/dropdown-menu.ts create mode 100644 src/uix/langs/components/menubar.ts create mode 100644 src/uix/langs/components/toggle-group.ts diff --git a/src/uix/langs/components/color-field.ts b/src/uix/langs/components/color-field.ts index 1475f4fd3..9b37599d4 100644 --- a/src/uix/langs/components/color-field.ts +++ b/src/uix/langs/components/color-field.ts @@ -8,9 +8,13 @@ import type { LangNode } from '$libs/langs'; * `'#?components.color-field.{key}|fallback'`. */ export const colorFieldLangs = { + label: { + es: 'Campo de color', + en: 'Color field' + }, input: { - es: "Valor del color", - en: "Color value" + es: 'Valor del color', + en: 'Color value' }, empty: { es: "Vacío", diff --git a/src/uix/langs/components/command.ts b/src/uix/langs/components/command.ts index 8e55e1766..8dd115169 100644 --- a/src/uix/langs/components/command.ts +++ b/src/uix/langs/components/command.ts @@ -8,8 +8,12 @@ import type { LangNode } from '$libs/langs'; * `'#?components.command.{key}|fallback'`. */ export const commandLangs = { + label: { + es: 'Paleta de comandos', + en: 'Command palette' + }, list: { - es: "Paleta de comandos", - en: "Command palette" + es: 'Paleta de comandos', + en: 'Command palette' } } satisfies LangNode; diff --git a/src/uix/langs/components/context-menu.ts b/src/uix/langs/components/context-menu.ts new file mode 100644 index 000000000..37804d8f0 --- /dev/null +++ b/src/uix/langs/components/context-menu.ts @@ -0,0 +1,12 @@ +import type { LangNode } from '$libs/langs'; + +/** + * Default strings for the context-menu component. Merged under + * `components.context-menu.*` by `ActiveUix` (via `componentLangs` barrel). + */ +export const contextMenuLangs = { + label: { + es: 'Menú contextual', + en: 'Context menu' + } +} satisfies LangNode; diff --git a/src/uix/langs/components/drag-drop.ts b/src/uix/langs/components/drag-drop.ts index 81200be55..e79eecdb1 100644 --- a/src/uix/langs/components/drag-drop.ts +++ b/src/uix/langs/components/drag-drop.ts @@ -8,6 +8,10 @@ import type { LangNode } from '$libs/langs'; * `'#?components.drag-drop.{key}|fallback'`. */ export const dragDropLangs = { + label: { + es: 'Arrastrar y soltar', + en: 'Drag and drop' + }, 'drag-started': { es: "Arrastrando {{item}}", en: "Started dragging {{item}}" diff --git a/src/uix/langs/components/dropdown-menu.ts b/src/uix/langs/components/dropdown-menu.ts new file mode 100644 index 000000000..2828b7e2f --- /dev/null +++ b/src/uix/langs/components/dropdown-menu.ts @@ -0,0 +1,8 @@ +import type { LangNode } from '$libs/langs'; + +export const dropdownMenuLangs = { + label: { + es: 'Menú desplegable', + en: 'Dropdown menu' + } +} satisfies LangNode; diff --git a/src/uix/langs/components/index.ts b/src/uix/langs/components/index.ts index 654a478e4..be1d799c1 100644 --- a/src/uix/langs/components/index.ts +++ b/src/uix/langs/components/index.ts @@ -10,6 +10,7 @@ import { colorFieldLangs } from './color-field'; import { colorPickerLangs } from './color-picker'; import { comboboxLangs } from './combobox'; import { commandLangs } from './command'; +import { contextMenuLangs } from './context-menu'; import { dateFieldLangs } from './date-field'; import { datePickerLangs } from './date-picker'; import { dateRangeFieldLangs } from './date-range-field'; @@ -17,11 +18,13 @@ import { dateRangePickerLangs } from './date-range-picker'; import { dialogLangs } from './dialog'; import { dragDropLangs } from './drag-drop'; import { drawerLangs } from './drawer'; +import { dropdownMenuLangs } from './dropdown-menu'; import { feedLangs } from './feed'; import { fileUploadLangs } from './file-upload'; import { formLangs } from './form'; import { gridListLangs } from './grid-list'; import { listboxLangs } from './listbox'; +import { menubarLangs } from './menubar'; import { meterLangs } from './meter'; import { navigationMenuLangs } from './navigation-menu'; import { paginationLangs } from './pagination'; @@ -41,6 +44,7 @@ import { timeFieldLangs } from './time-field'; import { timePickerLangs } from './time-picker'; import { timeRangeFieldLangs } from './time-range-field'; import { timeRangePickerLangs } from './time-range-picker'; +import { toggleGroupLangs } from './toggle-group'; import { tooltipLangs } from './tooltip'; import { treeGridLangs } from './tree-grid'; import { treeViewLangs } from './tree-view'; @@ -64,6 +68,7 @@ export const componentLangs = { 'color-picker': colorPickerLangs, combobox: comboboxLangs, command: commandLangs, + 'context-menu': contextMenuLangs, 'date-field': dateFieldLangs, 'date-picker': datePickerLangs, 'date-range-field': dateRangeFieldLangs, @@ -71,11 +76,13 @@ export const componentLangs = { dialog: dialogLangs, 'drag-drop': dragDropLangs, drawer: drawerLangs, + 'dropdown-menu': dropdownMenuLangs, feed: feedLangs, 'file-upload': fileUploadLangs, form: formLangs, 'grid-list': gridListLangs, listbox: listboxLangs, + menubar: menubarLangs, meter: meterLangs, 'navigation-menu': navigationMenuLangs, pagination: paginationLangs, @@ -95,6 +102,7 @@ export const componentLangs = { 'time-picker': timePickerLangs, 'time-range-field': timeRangeFieldLangs, 'time-range-picker': timeRangePickerLangs, + 'toggle-group': toggleGroupLangs, tooltip: tooltipLangs, 'tree-grid': treeGridLangs, 'tree-view': treeViewLangs, diff --git a/src/uix/langs/components/menubar.ts b/src/uix/langs/components/menubar.ts new file mode 100644 index 000000000..8bc917f27 --- /dev/null +++ b/src/uix/langs/components/menubar.ts @@ -0,0 +1,8 @@ +import type { LangNode } from '$libs/langs'; + +export const menubarLangs = { + label: { + es: 'Barra de menú', + en: 'Menubar' + } +} satisfies LangNode; diff --git a/src/uix/langs/components/splitter.ts b/src/uix/langs/components/splitter.ts index 57aac8cd7..3a6563888 100644 --- a/src/uix/langs/components/splitter.ts +++ b/src/uix/langs/components/splitter.ts @@ -8,8 +8,12 @@ import type { LangNode } from '$libs/langs'; * `'#?components.splitter.{key}|fallback'`. */ export const splitterLangs = { + label: { + es: 'Divisor', + en: 'Splitter' + }, resize: { - es: "Redimensionar paneles", - en: "Resize panels" + es: 'Redimensionar paneles', + en: 'Resize panels' } } satisfies LangNode; diff --git a/src/uix/langs/components/time-field.ts b/src/uix/langs/components/time-field.ts index 0efdfe06a..7d7b6f740 100644 --- a/src/uix/langs/components/time-field.ts +++ b/src/uix/langs/components/time-field.ts @@ -8,8 +8,12 @@ import type { LangNode } from '$libs/langs'; * `'#?components.time-field.{key}|fallback'`. */ export const timeFieldLangs = { + label: { + es: 'Campo de hora', + en: 'Time field' + }, input: { - es: "Campo de hora", - en: "Time field" + es: 'Campo de hora', + en: 'Time field' } } satisfies LangNode; diff --git a/src/uix/langs/components/toggle-group.ts b/src/uix/langs/components/toggle-group.ts new file mode 100644 index 000000000..fdf9aac94 --- /dev/null +++ b/src/uix/langs/components/toggle-group.ts @@ -0,0 +1,8 @@ +import type { LangNode } from '$libs/langs'; + +export const toggleGroupLangs = { + label: { + es: 'Grupo de toggles', + en: 'Toggle group' + } +} satisfies LangNode; diff --git a/src/uix/morfo/components/carousel.ts b/src/uix/morfo/components/carousel.ts index 2801a8710..016e91cd1 100644 --- a/src/uix/morfo/components/carousel.ts +++ b/src/uix/morfo/components/carousel.ts @@ -13,6 +13,18 @@ export const carouselMorfo = { indicator: '#?components.carousel.indicator|Go to slide {{index}}', slide: '#?components.carousel.slide|Slide {{index}} of {{total}}' }, + events: [ + { + // Slide change — user-initiated (button/indicator) or auto-rotation. + name: 'shift-slide', + semantic: { + family: 'shift', + verb: 'navigate', + target: v.partRef('slide'), + sequence: 'post' + } + } + ], parts: [ { name: 'Provider', diff --git a/src/uix/morfo/components/color-field.ts b/src/uix/morfo/components/color-field.ts index 9caa873dc..62cba1301 100644 --- a/src/uix/morfo/components/color-field.ts +++ b/src/uix/morfo/components/color-field.ts @@ -6,6 +6,7 @@ export const colorFieldMorfo = { kebab: 'color-field', scope: ['soma'], texts: { + label: '#?components.color-field.label|Color field', input: '#?components.color-field.input|Color value', empty: '#?components.color-field.empty|Empty', invalid: '#?components.color-field.invalid|Invalid color', @@ -22,6 +23,18 @@ export const colorFieldMorfo = { 'channel-l': '#?components.color-field.channel-l|Lightness', 'channel-alpha': '#?components.color-field.channel-alpha|Alpha' }, + events: [ + { + name: 'commit-set', + semantic: { + family: 'commit', + verb: 'set', + target: v.partRef('input'), + intent: 'neutral', + sequence: 'post' + } + } + ], parts: [ { name: 'Provider', diff --git a/src/uix/morfo/components/command.ts b/src/uix/morfo/components/command.ts index 606a22619..a4ed73288 100644 --- a/src/uix/morfo/components/command.ts +++ b/src/uix/morfo/components/command.ts @@ -6,8 +6,22 @@ export const commandMorfo = { kebab: 'command', scope: ['soma'], texts: { + label: '#?components.command.label|Command palette', list: '#?components.command.list|Command palette' }, + events: [ + { + // User invoked a command (Enter on highlighted item or click). + name: 'commit-invoke', + semantic: { + family: 'commit', + verb: 'submit', + target: v.partRef('item'), + intent: 'fulfill', + sequence: 'post' + } + } + ], parts: [ { name: 'Provider', diff --git a/src/uix/morfo/components/context-menu.ts b/src/uix/morfo/components/context-menu.ts index ff95aa92f..f172007a5 100644 --- a/src/uix/morfo/components/context-menu.ts +++ b/src/uix/morfo/components/context-menu.ts @@ -6,6 +6,9 @@ export const contextMenuMorfo = { kebab: 'context-menu', scope: ['soma'], apg: 'https://www.w3.org/WAI/ARIA/apg/patterns/menu/', + texts: { + label: '#?components.context-menu.label|Context menu' + }, focus: { initial: 'first-focusable', @@ -14,6 +17,39 @@ export const contextMenuMorfo = { restore: true }, + events: [ + { + name: 'open', + semantic: { + family: 'emerge', + verb: 'open', + target: v.partRef('content'), + sequence: 'pre' + }, + commits: { part: v.partRef('content'), attr: 'data-state', value: 'open' } + }, + { + name: 'close', + semantic: { + family: 'emerge', + verb: 'close', + target: v.partRef('content'), + sequence: 'pre' + }, + commits: { part: v.partRef('content'), attr: 'data-state', value: 'closed' } + }, + { + name: 'commit-select', + semantic: { + family: 'commit', + verb: 'select', + target: v.partRef('item'), + intent: 'affirm', + sequence: 'post' + } + } + ], + parts: [ { name: 'Provider', diff --git a/src/uix/morfo/components/drag-drop.ts b/src/uix/morfo/components/drag-drop.ts index 5a57427c7..a9cedc96a 100644 --- a/src/uix/morfo/components/drag-drop.ts +++ b/src/uix/morfo/components/drag-drop.ts @@ -6,6 +6,7 @@ export const dragDropMorfo = { kebab: 'drag-drop', scope: ['soma'], texts: { + label: '#?components.drag-drop.label|Drag and drop', 'drag-started': '#?components.drag-drop.drag-started|Started dragging {{item}}', 'drag-over': '#?components.drag-drop.drag-over|Over drop zone {{target}}', dropped: '#?components.drag-drop.dropped|Dropped {{item}} on {{target}}', @@ -17,6 +18,38 @@ export const dragDropMorfo = { 'droppable-role': '#?components.drag-drop.droppable-role|drop zone', 'droppable-active': '#?components.drag-drop.droppable-active|active drop zone' }, + events: [ + { + name: 'commit-drag-start', + semantic: { + family: 'commit', + verb: 'submit', + target: v.partRef('draggable'), + intent: 'neutral', + sequence: 'post' + } + }, + { + name: 'commit-drop', + semantic: { + family: 'commit', + verb: 'submit', + target: v.partRef('droppable'), + intent: 'fulfill', + sequence: 'post' + } + }, + { + name: 'commit-cancel', + semantic: { + family: 'commit', + verb: 'reset', + target: v.partRef('draggable'), + intent: 'neutral', + sequence: 'post' + } + } + ], parts: [ { name: 'Provider', diff --git a/src/uix/morfo/components/dropdown-menu.ts b/src/uix/morfo/components/dropdown-menu.ts index 877b0953a..03e48e8f4 100644 --- a/src/uix/morfo/components/dropdown-menu.ts +++ b/src/uix/morfo/components/dropdown-menu.ts @@ -6,6 +6,9 @@ export const dropdownMenuMorfo = { kebab: 'dropdown-menu', scope: ['soma'], apg: 'https://www.w3.org/WAI/ARIA/apg/patterns/menu-button/', + texts: { + label: '#?components.dropdown-menu.label|Dropdown menu' + }, focus: { initial: 'first-focusable', @@ -14,6 +17,39 @@ export const dropdownMenuMorfo = { restore: true }, + events: [ + { + name: 'open', + semantic: { + family: 'emerge', + verb: 'open', + target: v.partRef('content'), + sequence: 'pre' + }, + commits: { part: v.partRef('content'), attr: 'data-state', value: 'open' } + }, + { + name: 'close', + semantic: { + family: 'emerge', + verb: 'close', + target: v.partRef('content'), + sequence: 'pre' + }, + commits: { part: v.partRef('content'), attr: 'data-state', value: 'closed' } + }, + { + name: 'commit-select', + semantic: { + family: 'commit', + verb: 'select', + target: v.partRef('item'), + intent: 'affirm', + sequence: 'post' + } + } + ], + parts: [ { name: 'Provider', diff --git a/src/uix/morfo/components/feed.ts b/src/uix/morfo/components/feed.ts index 2dd1973b0..1c00445cd 100644 --- a/src/uix/morfo/components/feed.ts +++ b/src/uix/morfo/components/feed.ts @@ -9,6 +9,30 @@ export const feedMorfo = { texts: { label: '#?components.feed.label|Feed' }, + events: [ + { + // User asked for more items (infinite scroll trigger / load-more + // button). Soma owns whether/when to actually fetch. + name: 'commit-load-more', + semantic: { + family: 'commit', + verb: 'add', + target: v.partRef('provider'), + intent: 'neutral', + sequence: 'post' + } + }, + { + // Item focused via keyboard navigation (j/k or Arrow keys). + name: 'shift-focus-item', + semantic: { + family: 'shift', + verb: 'navigate', + target: v.partRef('article'), + sequence: 'post' + } + } + ], parts: [ { name: 'Provider', diff --git a/src/uix/morfo/components/grid-list.ts b/src/uix/morfo/components/grid-list.ts index 84d5f7fd2..191c8460e 100644 --- a/src/uix/morfo/components/grid-list.ts +++ b/src/uix/morfo/components/grid-list.ts @@ -10,6 +10,28 @@ export const gridListMorfo = { label: '#?components.grid-list.label|Grid list', 'select-row': '#?components.grid-list.select-row|Select row' }, + events: [ + { + name: 'commit-select', + semantic: { + family: 'commit', + verb: 'select', + target: v.partRef('item'), + intent: 'affirm', + sequence: 'post' + } + }, + { + name: 'commit-unselect', + semantic: { + family: 'commit', + verb: 'remove', + target: v.partRef('item'), + intent: 'neutral', + sequence: 'post' + } + } + ], parts: [ { name: 'Provider', diff --git a/src/uix/morfo/components/listbox.ts b/src/uix/morfo/components/listbox.ts index 2f1054b65..4eaca6ef9 100644 --- a/src/uix/morfo/components/listbox.ts +++ b/src/uix/morfo/components/listbox.ts @@ -9,6 +9,28 @@ export const listboxMorfo = { texts: { label: '#?components.listbox.label|Options' }, + events: [ + { + name: 'commit-select', + semantic: { + family: 'commit', + verb: 'select', + target: v.partRef('item'), + intent: 'affirm', + sequence: 'post' + } + }, + { + name: 'commit-unselect', + semantic: { + family: 'commit', + verb: 'remove', + target: v.partRef('item'), + intent: 'neutral', + sequence: 'post' + } + } + ], parts: [ { name: 'Provider', diff --git a/src/uix/morfo/components/menubar.ts b/src/uix/morfo/components/menubar.ts index 502bac508..1c9595fe9 100644 --- a/src/uix/morfo/components/menubar.ts +++ b/src/uix/morfo/components/menubar.ts @@ -6,6 +6,21 @@ export const menubarMorfo = { kebab: 'menubar', scope: ['soma'], apg: 'https://www.w3.org/WAI/ARIA/apg/patterns/menubar/', + texts: { + label: '#?components.menubar.label|Menubar' + }, + events: [ + { + name: 'commit-select', + semantic: { + family: 'commit', + verb: 'select', + target: v.partRef('item'), + intent: 'affirm', + sequence: 'post' + } + } + ], parts: [ { name: 'Provider', diff --git a/src/uix/morfo/components/navigation-menu.ts b/src/uix/morfo/components/navigation-menu.ts index 1881003a9..5a0d3e3eb 100644 --- a/src/uix/morfo/components/navigation-menu.ts +++ b/src/uix/morfo/components/navigation-menu.ts @@ -8,6 +8,18 @@ export const navigationMenuMorfo = { texts: { label: '#?components.navigation-menu.label|Main' }, + events: [ + { + name: 'commit-select', + semantic: { + family: 'commit', + verb: 'select', + target: v.partRef('item'), + intent: 'affirm', + sequence: 'post' + } + } + ], parts: [ { name: 'Provider', diff --git a/src/uix/morfo/components/splitter.ts b/src/uix/morfo/components/splitter.ts index ed6f0ad67..982fd1cfe 100644 --- a/src/uix/morfo/components/splitter.ts +++ b/src/uix/morfo/components/splitter.ts @@ -6,8 +6,23 @@ export const splitterMorfo = { kebab: 'splitter', scope: ['soma'], texts: { + label: '#?components.splitter.label|Splitter', resize: '#?components.splitter.resize|Resize panels' }, + events: [ + { + // Handle drag committed (mouse-up). Continuous resize during drag + // is not a sema event — only the settled value matters. + name: 'commit-resize', + semantic: { + family: 'commit', + verb: 'set', + target: v.partRef('handle'), + intent: 'neutral', + sequence: 'post' + } + } + ], parts: [ { name: 'Provider', diff --git a/src/uix/morfo/components/table.ts b/src/uix/morfo/components/table.ts index 9757a3d49..8253ec929 100644 --- a/src/uix/morfo/components/table.ts +++ b/src/uix/morfo/components/table.ts @@ -11,6 +11,39 @@ export const tableMorfo = { 'row-detail-expand': '#?components.table.row-detail-expand|Show details', 'row-detail-collapse': '#?components.table.row-detail-collapse|Hide details' }, + events: [ + { + // Column sort change. + name: 'shift-sort', + semantic: { + family: 'shift', + verb: 'navigate', + target: v.partRef('header-cell'), + sequence: 'post' + } + }, + { + // Row selection (single or multi). + name: 'commit-select', + semantic: { + family: 'commit', + verb: 'select', + target: v.partRef('row'), + intent: 'affirm', + sequence: 'post' + } + }, + { + // Expand the row's detail panel. + name: 'shift-expand-row', + semantic: { + family: 'shift', + verb: 'navigate', + target: v.partRef('row'), + sequence: 'post' + } + } + ], parts: [ { name: 'Provider', diff --git a/src/uix/morfo/components/time-field.ts b/src/uix/morfo/components/time-field.ts index 167c72761..79fe896d6 100644 --- a/src/uix/morfo/components/time-field.ts +++ b/src/uix/morfo/components/time-field.ts @@ -6,8 +6,21 @@ export const timeFieldMorfo = { kebab: 'time-field', scope: ['soma'], texts: { + label: '#?components.time-field.label|Time field', input: '#?components.time-field.input|Time field' }, + events: [ + { + name: 'commit-set', + semantic: { + family: 'commit', + verb: 'set', + target: v.partRef('input'), + intent: 'neutral', + sequence: 'post' + } + } + ], parts: [ { name: 'Provider', diff --git a/src/uix/morfo/components/toggle-group.ts b/src/uix/morfo/components/toggle-group.ts index ff4975579..d6aa2f698 100644 --- a/src/uix/morfo/components/toggle-group.ts +++ b/src/uix/morfo/components/toggle-group.ts @@ -5,6 +5,27 @@ export const toggleGroupMorfo = { name: 'ToggleGroup', kebab: 'toggle-group', scope: ['soma'], + texts: { + label: '#?components.toggle-group.label|Toggle group' + }, + events: [ + { + // Per-item toggle. Same semantics as Toggle but emitted from the + // group's child item; target is the item part. + name: 'commit-toggle', + semantic: { + family: 'commit', + verb: 'toggle', + target: v.partRef('item'), + intent: { + fromProp: 'intent', + default: 'neutral', + supported: ['neutral', 'affirm', 'risk', 'threat'] + }, + sequence: 'post' + } + } + ], parts: [ { name: 'Provider', diff --git a/src/uix/morfo/components/tree-grid.ts b/src/uix/morfo/components/tree-grid.ts index be8ec3d73..0c690955f 100644 --- a/src/uix/morfo/components/tree-grid.ts +++ b/src/uix/morfo/components/tree-grid.ts @@ -12,6 +12,36 @@ export const treeGridMorfo = { expand: '#?components.tree-grid.expand|Expand row', collapse: '#?components.tree-grid.collapse|Collapse row' }, + events: [ + { + name: 'commit-select', + semantic: { + family: 'commit', + verb: 'select', + target: v.partRef('row'), + intent: 'affirm', + sequence: 'post' + } + }, + { + name: 'shift-expand', + semantic: { + family: 'shift', + verb: 'navigate', + target: v.partRef('row'), + sequence: 'post' + } + }, + { + name: 'shift-collapse', + semantic: { + family: 'shift', + verb: 'navigate', + target: v.partRef('row'), + sequence: 'post' + } + } + ], parts: [ { name: 'Provider', diff --git a/src/uix/morfo/components/tree-view.ts b/src/uix/morfo/components/tree-view.ts index 74a77a6bd..2d8b9c5a3 100644 --- a/src/uix/morfo/components/tree-view.ts +++ b/src/uix/morfo/components/tree-view.ts @@ -9,6 +9,37 @@ export const treeViewMorfo = { texts: { label: '#?components.tree-view.label|Tree' }, + events: [ + { + name: 'commit-select', + semantic: { + family: 'commit', + verb: 'select', + target: v.partRef('item'), + intent: 'affirm', + sequence: 'post' + } + }, + { + // Expand a node — visible commit (the user wants to see children). + name: 'shift-expand', + semantic: { + family: 'shift', + verb: 'navigate', + target: v.partRef('item'), + sequence: 'post' + } + }, + { + name: 'shift-collapse', + semantic: { + family: 'shift', + verb: 'navigate', + target: v.partRef('item'), + sequence: 'post' + } + } + ], parts: [ { name: 'Provider',