@fusion.dev/helix-headless 0.208.0 → 0.209.0

package/types/svelte.d.ts

@@ -167,6 +167,7 @@ declare module 'svelte/elements' {
     'helix-headless-tab': Helix<'helix-headless-tab'>
     'helix-headless-tag-group': Helix<'helix-headless-tag-group'>
     'helix-headless-tag': Helix<'helix-headless-tag'>
+    'helix-headless-terminal': Helix<'helix-headless-terminal'>
     'helix-headless-textarea': Helix<'helix-headless-textarea'>
     'helix-headless-time-input': Helix<'helix-headless-time-input'>
     'helix-headless-time-picker': Helix<'helix-headless-time-picker'>

package/types/vue.d.ts

@@ -177,6 +177,7 @@ import type {
   HelixHeadlessTabs,
   HelixHeadlessTag,
   HelixHeadlessTagGroup,
+  HelixHeadlessTerminal,
   HelixHeadlessTextarea,
   HelixHeadlessTimeInput,
   HelixHeadlessTimePicker,
@@ -240,6 +241,12 @@ import type {
   HelixShortcutEvent,
   HelixSortEvent,
   HelixSortedEvent,
+  HelixTerminalBellEvent,
+  HelixTerminalInputEvent,
+  HelixTerminalLinkEvent,
+  HelixTerminalResizeEvent,
+  HelixTerminalRestartEvent,
+  HelixTerminalTitleEvent,
   HelixToggleEvent,
   HelixTourAskEvent,
   HelixTourStatusEvent,
@@ -17293,6 +17300,164 @@ export type HelixHeadlessTagVueEvents = {
   "helix-dismiss": HelixHeadlessTagHelixDismissElementEvent;
 };
 
+/** `HelixHeadlessTerminal` component event */
+export type HelixHeadlessTerminalElementEvent<E = Event> = TypedEvent<
+  HelixHeadlessTerminal,
+  E
+>;
+/** `helix-copy` event type */
+export type HelixHeadlessTerminalHelixCopyElementEvent =
+  HelixHeadlessTerminalElementEvent<HelixCopyEvent>;
+/** `helix-terminal-bell` event type */
+export type HelixHeadlessTerminalHelixTerminalBellElementEvent =
+  HelixHeadlessTerminalElementEvent<HelixTerminalBellEvent>;
+/** `helix-terminal-input` event type */
+export type HelixHeadlessTerminalHelixTerminalInputElementEvent =
+  HelixHeadlessTerminalElementEvent<HelixTerminalInputEvent>;
+/** `helix-terminal-link` event type */
+export type HelixHeadlessTerminalHelixTerminalLinkElementEvent =
+  HelixHeadlessTerminalElementEvent<HelixTerminalLinkEvent>;
+/** `helix-terminal-resize` event type */
+export type HelixHeadlessTerminalHelixTerminalResizeElementEvent =
+  HelixHeadlessTerminalElementEvent<HelixTerminalResizeEvent>;
+/** `helix-terminal-restart` event type */
+export type HelixHeadlessTerminalHelixTerminalRestartElementEvent =
+  HelixHeadlessTerminalElementEvent<HelixTerminalRestartEvent>;
+/** `helix-terminal-title` event type */
+export type HelixHeadlessTerminalHelixTerminalTitleElementEvent =
+  HelixHeadlessTerminalElementEvent<HelixTerminalTitleEvent>;
+
+export type HelixHeadlessTerminalVueProps = {
+  /** The clear button's label. */
+  "clear-label"?: (HelixHeadlessTerminal["clearLabel"]) | undefined;
+  /** The clear button's label. */
+  clearLabel?: (HelixHeadlessTerminal["clearLabel"]) | undefined;
+  /** The grid's width in character cells. Set it with `rows` to fix the grid's size; unset, the grid fills the frame. */
+  columns?: (HelixHeadlessTerminal["columns"]) | undefined;
+  /** Which built-in controls the header shows, as a list of `find`, `copy`,
+`clear`, and `fullscreen`, or `none`. Absent is `find clear`. */
+  controls?: (HelixHeadlessTerminal["controls"]) | undefined;
+  /** The name of the row of controls, read by screen readers. */
+  "controls-label"?: (HelixHeadlessTerminal["controlsLabel"]) | undefined;
+  /** The name of the row of controls, read by screen readers. */
+  controlsLabel?: (HelixHeadlessTerminal["controlsLabel"]) | undefined;
+  /** What screen readers hear after a copy. */
+  "copied-label"?: (HelixHeadlessTerminal["copiedLabel"]) | undefined;
+  /** What screen readers hear after a copy. */
+  copiedLabel?: (HelixHeadlessTerminal["copiedLabel"]) | undefined;
+  /** The copy button's label. */
+  "copy-label"?: (HelixHeadlessTerminal["copyLabel"]) | undefined;
+  /** The copy button's label. */
+  copyLabel?: (HelixHeadlessTerminal["copyLabel"]) | undefined;
+  /** How the process exited, which the page sets when it does. While it is set,
+the status line says it, the frame sends no input, and Restart is shown.
+Clear it when a new process starts. */
+  "exit-code"?: (HelixHeadlessTerminal["exitCode"] | `${number}`) | undefined;
+  /** How the process exited, which the page sets when it does. While it is set,
+the status line says it, the frame sends no input, and Restart is shown.
+Clear it when a new process starts. */
+  exitCode?: (HelixHeadlessTerminal["exitCode"]) | undefined;
+  /** What the status line says once the process has exited. `{code}` is its
+exit code, written as the process gave it, and code `0` is a clean exit. */
+  "exited-label"?: (HelixHeadlessTerminal["exitedLabel"]) | undefined;
+  /** What the status line says once the process has exited. `{code}` is its
+exit code, written as the process gave it, and code `0` is a clean exit. */
+  exitedLabel?: (HelixHeadlessTerminal["exitedLabel"]) | undefined;
+  /** The terminal's name where `label` is empty and the host has no `aria-label`. */
+  "fallback-label"?: (HelixHeadlessTerminal["fallbackLabel"]) | undefined;
+  /** The terminal's name where `label` is empty and the host has no `aria-label`. */
+  fallbackLabel?: (HelixHeadlessTerminal["fallbackLabel"]) | undefined;
+  /** The label of the button that closes the find bar. */
+  "find-close-label"?: (HelixHeadlessTerminal["findCloseLabel"]) | undefined;
+  /** The label of the button that closes the find bar. */
+  findCloseLabel?: (HelixHeadlessTerminal["findCloseLabel"]) | undefined;
+  /** The name of the find bar's row of buttons, read by screen readers. */
+  "find-controls-label"?: (HelixHeadlessTerminal["findControlsLabel"]) | undefined;
+  /** The name of the find bar's row of buttons, read by screen readers. */
+  findControlsLabel?: (HelixHeadlessTerminal["findControlsLabel"]) | undefined;
+  /** The find button's label, and the find field's name and placeholder. */
+  "find-label"?: (HelixHeadlessTerminal["findLabel"]) | undefined;
+  /** The find button's label, and the find field's name and placeholder. */
+  findLabel?: (HelixHeadlessTerminal["findLabel"]) | undefined;
+  /** The next match button's label. */
+  "find-next-label"?: (HelixHeadlessTerminal["findNextLabel"]) | undefined;
+  /** The next match button's label. */
+  findNextLabel?: (HelixHeadlessTerminal["findNextLabel"]) | undefined;
+  /** The previous match button's label. */
+  "find-previous-label"?: (HelixHeadlessTerminal["findPreviousLabel"]) | undefined;
+  /** The previous match button's label. */
+  findPreviousLabel?: (HelixHeadlessTerminal["findPreviousLabel"]) | undefined;
+  /** The fullscreen button's label. */
+  "fullscreen-label"?: (HelixHeadlessTerminal["fullscreenLabel"]) | undefined;
+  /** The fullscreen button's label. */
+  fullscreenLabel?: (HelixHeadlessTerminal["fullscreenLabel"]) | undefined;
+  /** The name of the element the reader types into, which the renderer draws. */
+  "input-label"?: (HelixHeadlessTerminal["inputLabel"]) | undefined;
+  /** The name of the element the reader types into, which the renderer draws. */
+  inputLabel?: (HelixHeadlessTerminal["inputLabel"]) | undefined;
+  /** The terminal's name, in the header and for screen readers, such as the
+shell or the folder it runs in. Several terminals on a page need names
+that tell them apart. */
+  label?: (HelixHeadlessTerminal["label"]) | undefined;
+  /** What the find bar says of its matches. `{index}` is the current match,
+counting from 1, and `{count}` how many there are. */
+  "matches-label"?: (HelixHeadlessTerminal["matchesLabel"]) | undefined;
+  /** What the find bar says of its matches. `{index}` is the current match,
+counting from 1, and `{count}` how many there are. */
+  matchesLabel?: (HelixHeadlessTerminal["matchesLabel"]) | undefined;
+  /** Draws the output and sends no input, with no cursor, for a transcript or
+a command an agent ran. The attribute is `readonly`, the platform's
+spelling. */
+  readonly?: (HelixHeadlessTerminal["readOnly"]) | undefined;
+  /** Draws the output and sends no input, with no cursor, for a transcript or
+a command an agent ran. The attribute is `readonly`, the platform's
+spelling. */
+  readOnly?: (HelixHeadlessTerminal["readOnly"]) | undefined;
+  /** The Restart button's label. */
+  "restart-label"?: (HelixHeadlessTerminal["restartLabel"]) | undefined;
+  /** The Restart button's label. */
+  restartLabel?: (HelixHeadlessTerminal["restartLabel"]) | undefined;
+  /** The grid's height in lines. Set it with `columns` to fix the grid's size; unset, the grid fills the frame. */
+  rows?: (HelixHeadlessTerminal["rows"]) | undefined;
+  /** Keeps the grid as lines a screen reader moves through, and says new
+output as it arrives. Off by default, since it costs time on every
+write. Connect it to a setting your reader can turn on. */
+  "screen-reader-mode"?: (HelixHeadlessTerminal["screenReaderMode"]) | undefined;
+  /** Keeps the grid as lines a screen reader moves through, and says new
+output as it arrives. Off by default, since it costs time on every
+write. Connect it to a setting your reader can turn on. */
+  screenReaderMode?: (HelixHeadlessTerminal["screenReaderMode"]) | undefined;
+  /** What the terminal's input describes to a screen reader. `{key}` is the key that switches Tab. */
+  "tab-hint-label"?: (HelixHeadlessTerminal["tabHintLabel"]) | undefined;
+  /** What the terminal's input describes to a screen reader. `{key}` is the key that switches Tab. */
+  tabHintLabel?: (HelixHeadlessTerminal["tabHintLabel"]) | undefined;
+  /** What the status line says while Tab moves focus. `{key}` is the key that switches it back. */
+  "tab-moves-focus-label"?: (HelixHeadlessTerminal["tabMovesFocusLabel"]) | undefined;
+  /** What the status line says while Tab moves focus. `{key}` is the key that switches it back. */
+  tabMovesFocusLabel?: (HelixHeadlessTerminal["tabMovesFocusLabel"]) | undefined;
+  /** What screen readers hear when Tab goes back to typing in the terminal. */
+  "tab-types-label"?: (HelixHeadlessTerminal["tabTypesLabel"]) | undefined;
+  /** What screen readers hear when Tab goes back to typing in the terminal. */
+  tabTypesLabel?: (HelixHeadlessTerminal["tabTypesLabel"]) | undefined;
+};
+
+export type HelixHeadlessTerminalVueEvents = {
+  /** The copy control or its key put the selection on the clipboard. */
+  "helix-copy": HelixHeadlessTerminalHelixCopyElementEvent;
+  /** The program rang the bell. The frame flashes once. */
+  "helix-terminal-bell": HelixHeadlessTerminalHelixTerminalBellElementEvent;
+  /** The reader typed or pasted, with `data` encoded for the program. Write it to the process. Not sent while `readonly`, or once `exit-code` is set. */
+  "helix-terminal-input": HelixHeadlessTerminalHelixTerminalInputElementEvent;
+  /** A link in the output was activated, with its `href`. Cancelable: cancel it to open the link yourself. Left alone, a web address opens in a new tab. */
+  "helix-terminal-link": HelixHeadlessTerminalHelixTerminalLinkElementEvent;
+  /** The grid changed size, with `columns`, `rows`, `width`, and `height`. Resize the process's pseudo-terminal to match. */
+  "helix-terminal-resize": HelixHeadlessTerminalHelixTerminalResizeElementEvent;
+  /** The Restart button was pressed after the process exited. Start a new process and clear `exit-code`. */
+  "helix-terminal-restart": HelixHeadlessTerminalHelixTerminalRestartElementEvent;
+  /** The program set its title, with `title`. The frame keeps its own `label`. */
+  "helix-terminal-title": HelixHeadlessTerminalHelixTerminalTitleElementEvent;
+};
+
 /** `HelixHeadlessTextarea` component event */
 export type HelixHeadlessTextareaElementEvent<E = Event> = TypedEvent<
   HelixHeadlessTextarea,
@@ -20606,6 +20771,54 @@ export type CustomCssProperties = {
   "--table-template"?: (string) | undefined;
   /** Written by the row on its `expand` cell: how deep the row sits, from 1. Do not set it. */
   "--table-row-level"?: (string) | undefined;
+  /** The ground of the current match of a search. */
+  "--terminal-active-match-background-color"?: (string) | undefined;
+  /** The edge of the current match of a search. */
+  "--terminal-active-match-border-color"?: (string) | undefined;
+  /** ANSI black, which codes `30` and `40` draw. */
+  "--terminal-ansi-black"?: (string) | undefined;
+  /** ANSI blue, which codes `34` and `44` draw. */
+  "--terminal-ansi-blue"?: (string) | undefined;
+  /** ANSI bright black, which codes `90` and `100` draw. */
+  "--terminal-ansi-bright-black"?: (string) | undefined;
+  /** ANSI bright blue, which codes `94` and `104` draw. */
+  "--terminal-ansi-bright-blue"?: (string) | undefined;
+  /** ANSI bright cyan, which codes `96` and `106` draw. */
+  "--terminal-ansi-bright-cyan"?: (string) | undefined;
+  /** ANSI bright green, which codes `92` and `102` draw. */
+  "--terminal-ansi-bright-green"?: (string) | undefined;
+  /** ANSI bright magenta, which codes `95` and `105` draw. */
+  "--terminal-ansi-bright-magenta"?: (string) | undefined;
+  /** ANSI bright red, which codes `91` and `101` draw. */
+  "--terminal-ansi-bright-red"?: (string) | undefined;
+  /** ANSI bright white, which codes `97` and `107` draw. */
+  "--terminal-ansi-bright-white"?: (string) | undefined;
+  /** ANSI bright yellow, which codes `93` and `103` draw. */
+  "--terminal-ansi-bright-yellow"?: (string) | undefined;
+  /** ANSI cyan, which codes `36` and `46` draw. */
+  "--terminal-ansi-cyan"?: (string) | undefined;
+  /** ANSI green, which codes `32` and `42` draw. */
+  "--terminal-ansi-green"?: (string) | undefined;
+  /** ANSI magenta, which codes `35` and `45` draw. */
+  "--terminal-ansi-magenta"?: (string) | undefined;
+  /** ANSI red, which codes `31` and `41` draw. */
+  "--terminal-ansi-red"?: (string) | undefined;
+  /** ANSI white, which codes `37` and `47` draw. */
+  "--terminal-ansi-white"?: (string) | undefined;
+  /** ANSI yellow, which codes `33` and `43` draw. */
+  "--terminal-ansi-yellow"?: (string) | undefined;
+  /** The ground of the grid. */
+  "--terminal-background-color"?: (string) | undefined;
+  /** The text of the grid where the program sets no color. */
+  "--terminal-color"?: (string) | undefined;
+  /** The cursor. */
+  "--terminal-cursor-color"?: (string) | undefined;
+  /** The ground of every match of a search but the current one. */
+  "--terminal-match-background-color"?: (string) | undefined;
+  /** The grid's scrollbar. */
+  "--terminal-scrollbar-thumb-color"?: (string) | undefined;
+  /** The ground of selected text. See-through, so the text keeps its color. */
+  "--terminal-selection-background-color"?: (string) | undefined;
   /** How long this message stays, in milliseconds, for a progress hint. */
   "--toast-duration"?: (string) | undefined;
   /** How far a swipe has moved the message across, in pixels, toward the right. */
@@ -21462,6 +21675,12 @@ export interface WcToolkitVueGlobalComponents {
     HelixHeadlessTagVueProps,
     HelixHeadlessTagVueEvents
   >;
+  /** Wraps a terminal drawn by xterm.js or another emulator. The frame adds a header with the terminal's name and its controls, a find bar, and a status line. 'connectTerminal' in '@fusion.dev/helix-terminal' connects it to the emulator and draws the terminal in the colors the '--terminal-*' properties set, which the styled tier sets from your theme. Helix does not start a process: you connect the stream. Write the program's output with 'write()', send what the reader types to the process from 'helix-terminal-input', and resize the process's pseudo-terminal from 'helix-terminal-resize'.  Output written before a renderer is connected is held and written first, so the process can start before the emulator loads. 'write()' resolves once the renderer has parsed the output, which is how a page pauses a process that writes faster than the terminal draws.  The controls are a row in the header, and 'controls' names which ones: 'find', 'copy', 'clear', and 'fullscreen'. 'find clear' by default. A control the renderer cannot answer is left out once it is connected. Set 'exit-code' when the process exits: the frame says how it exited, stops sending input, and shows a Restart button that sends 'helix-terminal-restart'.  **Keyboard.** Every key goes to the program, Tab, Shift+Tab, and Escape included, except these:  - Control+Shift+F, or Command+F on a Mac, opens the find bar. Enter and   Shift+Enter move between the matches, and Escape closes the bar and   returns focus to the terminal. - Control+Shift+C copies the selection. On a Mac, Command+C does. - Control+M, or Control+Shift+M on a Mac, switches Tab between typing in the   terminal and moving focus out of it. The status line says when Tab moves   focus, and the terminal's input describes the key to a screen reader.  **Screen readers.** A terminal draws its grid as a picture of text, so a screen reader reads nothing in it by default. Set 'screen-reader-mode' to have the renderer keep the grid as lines a screen reader can move through and announce new output as it arrives, which xterm.js calls screen reader mode. It costs time on every write, so it is off by default: connect it to a setting your reader can turn on. */
+  "helix-headless-terminal": DefineCustomElement<
+    HelixHeadlessTerminal,
+    HelixHeadlessTerminalVueProps,
+    HelixHeadlessTerminalVueEvents
+  >;
   /** Renders a '<textarea>', so the caret, selection, spellcheck, resize handle, and phone keyboard come from the platform. It is in the server markup, so the field works before any script loads.  It is a separate element from 'Input' because Enter inserts a line break here. In a single-line field, Enter submits the form.  'rows' sets the starting height, and 'auto-grow' makes the field grow with its content. You can use both: 'rows' sets where an empty field begins. 'max-rows' stops the growth at that many lines, and the field scrolls past them.  'clearable' draws a button that empties the field while it holds text, and sends 'helix-clear', as 'Input' does. 'validate' adds your own rule, run on every change once the browser finds nothing wrong, as React Aria's TextField 'validate' does.  **Keyboard.** The field's own keys are the platform's, and Enter starts a new line. The clear button under 'clearable' is a tab stop of its own after the field.  The inner textarea is named by 'label', or by a host 'aria-label', 'aria-labelledby' or '<label for>', and is described by the hint and the message, with 'aria-invalid' while a message shows. The clear button is named 'clear-label'. */
   "helix-headless-textarea": DefineCustomElement<
     HelixHeadlessTextarea,
@@ -21522,7 +21741,7 @@ export interface WcToolkitVueGlobalComponents {
     HelixHeadlessToggleVueProps,
     HelixHeadlessToggleVueEvents
   >;
-  /** A toolbar holds a mix of controls, such as buttons, toggles, and menus. A button group holds one kind, so the two are separate components.  The toolbar is one tab stop, and the arrow keys move between its controls, so three toolbars take three presses of Tab to pass. Any element the browser can focus counts as a control, including your own elements. A child that takes no focus, such as a divider, is skipped. A menu is reached at its trigger.  A Divider in the toolbar is a separator across the toolbar's axis, as React Aria's is: vertical in a horizontal toolbar and horizontal in a vertical one, without an 'orientation' of its own.  Controls inside a plain wrapper, such as a 'Button Group', are each a stop of the toolbar's own, as React Aria's toolbar flattens a group: the arrows walk through the group's buttons and on past it, and the group takes no tab stop of its own.  The arrows wrap from the last control to the first. Set 'stop-at-ends' to keep them at the ends, as Radix's 'loop' set to false does.  **Keyboard.** Tab enters the toolbar on the control that last had focus, the first control at the start, and the next Tab leaves it.  | Key | What it does | |---|---| | Right | Moves to the next control in a horizontal toolbar, from the last back to the first. | | Left | Moves to the control before in a horizontal toolbar, from the first round to the last. | | Down, Up | The same in a vertical toolbar. | | Home, End | Moves to the first or the last control. |  Left and Right swap on a right-to-left page, where the first control is on the right. The arrows across the toolbar's axis are left to the control that has focus, so a radio-style toggle group or a select answers them itself. The toolbar is 'role="toolbar"' with 'aria-orientation', named by 'label'.  The stop moves through a control's own 'focusable' property where it has one, as Button, Select and Toggle Group do. A control without one has 'tabindex' written on the element that takes focus: a native element itself, or the control inside a custom element's open shadow root, so the host keeps the markup you rendered. Only a custom element whose shadow root is closed takes it on the host.  A toggle group of pressed buttons, 'selection-mode="multiple"', is walked through the same way, each toggle a stop on the toolbar's axis, as React Aria's toolbar walks its toggle buttons. Another nested composite, such as a radio-style toggle group, is one stop on the toolbar's axis: the toolbar's arrows move past it, and the arrows across the toolbar move inside it. A composite with a 'focusable' property, as Toggle Group has, gives up its own tab stop while the toolbar's is elsewhere, so Tab stops once in the toolbar. A composite without one keeps its own tab stop.  A toolbar inside another toolbar, a Helix one or the page's own 'role="toolbar"', is a 'group' of the outer one, as React Aria's is: the outer toolbar's arrows walk through its controls and on past them, and it takes no keys and no tab stop of its own. A server renders it as a toolbar, having no parent to read, until it upgrades. */
+  /** A toolbar holds a mix of controls, such as buttons, toggles, and menus. A button group holds one kind, so the two are separate components.  The toolbar is one tab stop, and the arrow keys move between its controls, so three toolbars take three presses of Tab to pass. Any element the browser can focus counts as a control, including your own elements. A child that takes no focus, such as a divider, is skipped. A menu is reached at its trigger.  A Divider in the toolbar is a separator across the toolbar's axis, as React Aria's is: vertical in a horizontal toolbar and horizontal in a vertical one, without an 'orientation' of its own.  Controls inside a plain wrapper, such as a 'Button Group', are each a stop of the toolbar's own, as React Aria's toolbar flattens a group: the arrows walk through the group's buttons and on past it, and the group takes no tab stop of its own.  The arrows wrap from the last control to the first. Set 'stop-at-ends' to keep them at the ends, as Radix's 'loop' set to false does.  **Keyboard.** Tab enters the toolbar on the control that last had focus, the first control at the start, and the next Tab leaves it.  | Key | What it does | |---|---| | Right | Moves to the next control in a horizontal toolbar, from the last back to the first. | | Left | Moves to the control before in a horizontal toolbar, from the first round to the last. | | Down, Up | The same in a vertical toolbar. | | Home, End | Moves to the first or the last control. |  Left and Right swap on a right-to-left page, where the first control is on the right. The arrows across the toolbar's axis are left to the control that has focus, so a radio-style toggle group or a select answers them itself. The toolbar is 'role="toolbar"' with 'aria-orientation', named by 'label'.  The stop moves through a control's own 'focusable' property where it has one, as Button, Select and Toggle Group do. A control without one has 'tabindex' written on the element that takes focus: a native element itself, or the control inside a custom element's open shadow root, so the host keeps the markup you rendered. Only a custom element whose shadow root is closed takes it on the host.  A toggle group of pressed buttons, 'selection-mode="multiple"', is walked through the same way, each toggle a stop on the toolbar's axis, as React Aria's toolbar walks its toggle buttons. Another nested composite, such as a radio-style toggle group, is one stop on the toolbar's axis: the toolbar's arrows move past it, and the arrows across the toolbar move inside it. A composite with a 'focusable' property, as Toggle Group has, gives up its own tab stop while the toolbar's is elsewhere, so Tab stops once in the toolbar. A composite without one keeps its own tab stop.  A '<slot>' in the toolbar counts as the controls assigned to it, for a toolbar a component draws in its own shadow root with your controls passed into it: they share its tab stop and its arrows with the component's own.  A toolbar inside another toolbar, a Helix one or the page's own 'role="toolbar"', is a 'group' of the outer one, as React Aria's is: the outer toolbar's arrows walk through its controls and on past them, and it takes no keys and no tab stop of its own. A server renders it as a toolbar, having no parent to read, until it upgrades. */
   "helix-headless-toolbar": DefineCustomElement<
     HelixHeadlessToolbar,
     HelixHeadlessToolbarVueProps,

package/types/words.d.ts

@@ -3885,6 +3885,118 @@ declare module '@fusion.dev/helix-core' {
        */
       emptyLabel: Message
     }
+    'helix-terminal': {
+      /**
+       * The clear button's label.
+       *
+       * English: `Clear`
+       */
+      clearLabel: Message
+      /**
+       * The name of the row of controls, read by screen readers.
+       *
+       * English: `Terminal controls`
+       */
+      controlsLabel: Message
+      /**
+       * What screen readers hear after a copy.
+       *
+       * English: `Copied`
+       */
+      copiedLabel: Message
+      /**
+       * The copy button's label.
+       *
+       * English: `Copy`
+       */
+      copyLabel: Message
+      /**
+       * What the status line says once the process has exited. `{code}` is its
+       * exit code, written as the process gave it, and code `0` is a clean exit.
+       *
+       * English: `{code, select, 0 {The process exited.} other {The process exited with code {code}.}}`
+       */
+      exitedLabel: Message
+      /**
+       * The terminal's name where `label` is empty and the host has no `aria-label`.
+       *
+       * English: `Terminal`
+       */
+      fallbackLabel: Message
+      /**
+       * The label of the button that closes the find bar.
+       *
+       * English: `Close find`
+       */
+      findCloseLabel: Message
+      /**
+       * The name of the find bar's row of buttons, read by screen readers.
+       *
+       * English: `Find controls`
+       */
+      findControlsLabel: Message
+      /**
+       * The find button's label, and the find field's name and placeholder.
+       *
+       * English: `Find`
+       */
+      findLabel: Message
+      /**
+       * The next match button's label.
+       *
+       * English: `Next match`
+       */
+      findNextLabel: Message
+      /**
+       * The previous match button's label.
+       *
+       * English: `Previous match`
+       */
+      findPreviousLabel: Message
+      /**
+       * The fullscreen button's label.
+       *
+       * English: `Fill the screen`
+       */
+      fullscreenLabel: Message
+      /**
+       * The name of the element the reader types into, which the renderer draws.
+       *
+       * English: `Terminal input`
+       */
+      inputLabel: Message
+      /**
+       * What the find bar says of its matches. `{index}` is the current match,
+       * counting from 1, and `{count}` how many there are.
+       *
+       * English: `{count, plural, =0 {No matches} one {{index} of # match} other {{index} of # matches}}`
+       */
+      matchesLabel: Message
+      /**
+       * The Restart button's label.
+       *
+       * English: `Restart`
+       */
+      restartLabel: Message
+      /**
+       * What the terminal's input describes to a screen reader. `{key}` is the key that switches Tab.
+       *
+       * English: `Press {key} to move focus with Tab.`
+       */
+      tabHintLabel: Message
+      /**
+       * What the status line says while Tab moves focus. `{key}` is the key that switches it back.
+       *
+       * English: `Tab moves focus. Press {key} to type Tab in the terminal.`
+       */
+      tabMovesFocusLabel: Message
+      /**
+       * What screen readers hear when Tab goes back to typing in the terminal.
+       *
+       * English: `Tab types in the terminal.`
+       */
+      tabTypesLabel: Message
+    }
     'helix-textarea': {
       /**
        * The accessible name of the clear button, which shows only an icon.