@fusion.dev/helix 0.203.0 → 0.204.1

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@fusion.dev/helix",
   "description": "Styled component tier. Extends the headless tier with token-driven presentation.",
-  "version": "0.203.0",
+  "version": "0.204.1",
   "license": "MIT",
   "author": "Ross Sheppard <ross.sheppard@fusion.dev>",
   "repository": {
@@ -60,14 +60,14 @@
   },
   "bugs": "https://github.com/project-fusion/fusion/issues",
   "dependencies": {
-    "@fusion.dev/helix-core": "0.203.0",
-    "@fusion.dev/helix-headless": "0.203.0",
-    "@fusion.dev/helix-styles": "0.203.0",
+    "@fusion.dev/helix-core": "0.204.1",
+    "@fusion.dev/helix-headless": "0.204.1",
+    "@fusion.dev/helix-styles": "0.204.1",
     "tslib": "^2.8.1"
   },
   "devDependencies": {
-    "@fusion.dev/helix-cem": "0.203.0",
-    "@fusion.dev/helix-testing": "0.203.0",
+    "@fusion.dev/helix-cem": "0.204.1",
+    "@fusion.dev/helix-testing": "0.204.1",
     "@fusion.dev/scripts": "0.0.0-dev",
     "@happy-dom/global-registrator": "^20.14.5",
     "@lit-labs/ssr": "^4.1.0",

package/skills/helix/SKILL.md

@@ -2,12 +2,12 @@
 name: helix
 description: Writes and checks pages built with Helix, the web components in @fusion.dev/helix. Use when building or reviewing any user interface in a project that installs @fusion.dev/helix, and when code has helix- elements, Helix tokens, or the helix command line.
 metadata:
-  version: "0.203.0"
+  version: "0.204.1"
 ---
 
 # Helix
 
-This guide is for @fusion.dev/helix 0.203.0, the version installed beside it.
+This guide is for @fusion.dev/helix 0.204.1, the version installed beside it.
 
 ## Using Helix with an agent
 

package/types/jsx.d.ts

@@ -22510,6 +22510,12 @@ export type HelixLogHelixExpandElementEvent =
   HelixLogElementEvent<HelixExpandEvent>;
 /** `helix-pin` event type */
 export type HelixLogHelixPinElementEvent = HelixLogElementEvent<HelixPinEvent>;
+/** `helix-select` event type */
+export type HelixLogHelixSelectElementEvent =
+  HelixLogElementEvent<HelixSelectEvent>;
+/** `helix-selected` event type */
+export type HelixLogHelixSelectedElementEvent =
+  HelixLogElementEvent<HelixSelectedEvent>;
 
 export type HelixLogProps = {
   /** The text shown and announced when there are no rows and none are loading. */
@@ -22555,6 +22561,11 @@ many arrived together and `{text}` is the first of them. */
   "fallback-label"?: (HelixLog["fallbackLabel"]) | undefined;
   /** The log's name, read by screen readers, where `label` is empty. */
   fallbackLabel?: (HelixLog["fallbackLabel"]) | undefined;
+  /** The format written text is in, read with a parser Helix ships:
+`github-actions` reads a GitHub Actions log's workflow commands into steps
+and levels, and `vercel` a Vercel build log's phases and warnings. Absent
+reads none. `parse` wins over it. */
+  format?: (HelixLog["format"]) | undefined;
   /** What a screen reader hears when a step finishes or fails. `{heading}` is
 the step's heading and `{status}` is `done` or `failed`. */
   "group-label"?: (HelixLog["groupLabel"]) | undefined;
@@ -22603,6 +22614,16 @@ true would write the attribute on upgrade. */
   "resume-label"?: (HelixLog["resumeLabel"]) | undefined;
   /** The words on the button that returns to the newest line, where `resume` is empty. */
   resumeLabel?: (HelixLog["resumeLabel"]) | undefined;
+  /** Whether pressing a line's number selects the line, and pressing another
+with Shift selects every line between them. Each number is then a
+button, or a link with `line-href`, and the arrow keys move between them. */
+  selectable?: (HelixLog["selectable"]) | undefined;
+  /** The lines selected, as a number or a range such as `12-20`. Empty selects
+none. A reader's press asks first: `helix-select` is cancelable. */
+  "selected-lines"?: (HelixLog["selectedLines"]) | undefined;
+  /** The lines selected, as a number or a range such as `12-20`. Empty selects
+none. A reader's press asks first: `helix-select` is cancelable. */
+  selectedLines?: (HelixLog["selectedLines"]) | undefined;
   /** How near the newest line still counts as being at it, in pixels. */
   threshold?: (HelixLog["threshold"]) | undefined;
   /** How each line shows its `at`: `absolute` on the clock, `relative` as the
@@ -22623,8 +22644,8 @@ Replaced rather than mutated: setting it starts the log over with these
 lines, and `write` adds to them. Set it or write children, not both. */
   lines?: (HelixLog["lines"]) | undefined;
   /** Reads each finished line of written text: return the fields to set, such
-as `level` or `group`, or `null` to drop the line. Lines in `lines` are
-taken as they are. */
+as `level`, `open` or `close` to start or end a step, or `null` to drop
+the line. Lines in `lines` are taken as they are. Wins over `format`. */
   parse?: (HelixLog["parse"]) | undefined;
   /** Text to read as it arrives, to the end: a `ReadableStream` of text or
 bytes, such as a `fetch` response's body, or an async iterable. Bytes are
@@ -22634,10 +22655,14 @@ reading the last one. */
 
   /** Fired when the reader leaves the newest line by scrolling, or comes back to it. Cancelable. */
   "onhelix-before-pin"?: ((e: HelixLogHelixBeforePinElementEvent) => void) | undefined;
-  /** Fired after a reader opens or closes a group drawn from `groups`, with the `id` of every open group in `detail.value`, separated by commas. */
+  /** Fired after a reader opens or closes a step drawn from `groups` or opened by a parser, with the `id` of every open group in `detail.value`, separated by commas. */
   "onhelix-expand"?: ((e: HelixLogHelixExpandElementEvent) => void) | undefined;
   /** Fired after the log follows the newest line or lets go of it, with `true` or `false` in `detail.value`. */
   "onhelix-pin"?: ((e: HelixLogHelixPinElementEvent) => void) | undefined;
+  /** Fired when a reader presses a number to change the selection, with the lines asked for in `detail.value`. Cancelable. */
+  "onhelix-select"?: ((e: HelixLogHelixSelectElementEvent) => void) | undefined;
+  /** Fired after the selection changes, with the lines now selected in `detail.value`, such as `12-20`. */
+  "onhelix-selected"?: ((e: HelixLogHelixSelectedElementEvent) => void) | undefined;
 };
 
 export type HelixLogSolidJsProps = {
@@ -22684,6 +22709,11 @@ many arrived together and `{text}` is the first of them. */
   "attr:fallback-label"?: (HelixLog["fallbackLabel"]) | undefined;
   /** The log's name, read by screen readers, where `label` is empty. */
   "prop:fallbackLabel"?: (HelixLog["fallbackLabel"]) | undefined;
+  /** The format written text is in, read with a parser Helix ships:
+`github-actions` reads a GitHub Actions log's workflow commands into steps
+and levels, and `vercel` a Vercel build log's phases and warnings. Absent
+reads none. `parse` wins over it. */
+  "prop:format"?: (HelixLog["format"]) | undefined;
   /** What a screen reader hears when a step finishes or fails. `{heading}` is
 the step's heading and `{status}` is `done` or `failed`. */
   "attr:group-label"?: (HelixLog["groupLabel"]) | undefined;
@@ -22732,6 +22762,16 @@ true would write the attribute on upgrade. */
   "attr:resume-label"?: (HelixLog["resumeLabel"]) | undefined;
   /** The words on the button that returns to the newest line, where `resume` is empty. */
   "prop:resumeLabel"?: (HelixLog["resumeLabel"]) | undefined;
+  /** Whether pressing a line's number selects the line, and pressing another
+with Shift selects every line between them. Each number is then a
+button, or a link with `line-href`, and the arrow keys move between them. */
+  "prop:selectable"?: (HelixLog["selectable"]) | undefined;
+  /** The lines selected, as a number or a range such as `12-20`. Empty selects
+none. A reader's press asks first: `helix-select` is cancelable. */
+  "attr:selected-lines"?: (HelixLog["selectedLines"]) | undefined;
+  /** The lines selected, as a number or a range such as `12-20`. Empty selects
+none. A reader's press asks first: `helix-select` is cancelable. */
+  "prop:selectedLines"?: (HelixLog["selectedLines"]) | undefined;
   /** How near the newest line still counts as being at it, in pixels. */
   "prop:threshold"?: (HelixLog["threshold"]) | undefined;
   /** How each line shows its `at`: `absolute` on the clock, `relative` as the
@@ -22752,8 +22792,8 @@ Replaced rather than mutated: setting it starts the log over with these
 lines, and `write` adds to them. Set it or write children, not both. */
   "prop:lines"?: (HelixLog["lines"]) | undefined;
   /** Reads each finished line of written text: return the fields to set, such
-as `level` or `group`, or `null` to drop the line. Lines in `lines` are
-taken as they are. */
+as `level`, `open` or `close` to start or end a step, or `null` to drop
+the line. Lines in `lines` are taken as they are. Wins over `format`. */
   "prop:parse"?: (HelixLog["parse"]) | undefined;
   /** Text to read as it arrives, to the end: a `ReadableStream` of text or
 bytes, such as a `fetch` response's body, or an async iterable. Bytes are
@@ -22762,10 +22802,14 @@ reading the last one. */
   "prop:source"?: (HelixLog["source"]) | undefined;
   /** Fired when the reader leaves the newest line by scrolling, or comes back to it. Cancelable. */
   "on:helix-before-pin"?: ((e: HelixLogHelixBeforePinElementEvent) => void) | undefined;
-  /** Fired after a reader opens or closes a group drawn from `groups`, with the `id` of every open group in `detail.value`, separated by commas. */
+  /** Fired after a reader opens or closes a step drawn from `groups` or opened by a parser, with the `id` of every open group in `detail.value`, separated by commas. */
   "on:helix-expand"?: ((e: HelixLogHelixExpandElementEvent) => void) | undefined;
   /** Fired after the log follows the newest line or lets go of it, with `true` or `false` in `detail.value`. */
   "on:helix-pin"?: ((e: HelixLogHelixPinElementEvent) => void) | undefined;
+  /** Fired when a reader presses a number to change the selection, with the lines asked for in `detail.value`. Cancelable. */
+  "on:helix-select"?: ((e: HelixLogHelixSelectElementEvent) => void) | undefined;
+  /** Fired after the selection changes, with the lines now selected in `detail.value`, such as `12-20`. */
+  "on:helix-selected"?: ((e: HelixLogHelixSelectedElementEvent) => void) | undefined;
 
   /** Set the innerHTML of the element */
   innerHTML?: (string) | undefined;
@@ -59773,6 +59817,7 @@ export type CustomElements = {
    * - `--log-error-color`: The color of a line at `error`, and of the band behind it. Defaults to the danger color.
    * - `--log-mark-background-color`: The band behind a line `mark-lines` names.
    * - `--log-match-background-color`: The fill behind text that matches the log's `query`.
+   * - `--log-selected-background-color`: The band behind a selected line, on a `selectable` log.
    * - `--log-warn-color`: The color of a line at `warn`, and of the band behind it. Defaults to the warning color.
    * - `--log-run-background-color`: Written on a `run` with a background, in the same form as `--log-run-color`.
    * - `--log-run-color`: Written on a `run` with a text color: one of the sixteen `--log-ansi-*` colors the log publishes, or the color itself.
@@ -59785,9 +59830,10 @@ export type CustomElements = {
    * - `line-debug`: The row of a line at `debug`.
    * - `line-error`: The row of a line at `error`.
    * - `line-marked`: The row of a line `mark-lines` names on the log.
+   * - `line-selected`: The row of a line in the log's selection.
    * - `line-warn`: The row of a line at `warn`.
    * - `match`: Text that matches the log's `query`, in a line the log draws from data.
-   * - `number`: The line's number, shown with `line-numbers`, and a link with `line-href`.
+   * - `number`: The line's number, shown with `line-numbers`: a link with `line-href`, and a button on a `selectable` log.
    * - `run`: A stretch of text drawn in an ANSI style, in a line the log draws from data. Its color is `--log-run-color` and its background `--log-run-background-color`.
    * - `run-bold`: A run drawn bold.
    * - `run-dim`: A run drawn faint.
@@ -59844,6 +59890,10 @@ export type CustomElements = {
    * - `error-label`/`errorLabel`: What a screen reader hears when lines at `error` arrive. `{count}` is how
    * many arrived together and `{text}` is the first of them.
    * - `fallback-label`/`fallbackLabel`: The log's name, read by screen readers, where `label` is empty.
+   * - `format`: The format written text is in, read with a parser Helix ships:
+   * `github-actions` reads a GitHub Actions log's workflow commands into steps
+   * and levels, and `vercel` a Vercel build log's phases and warnings. Absent
+   * reads none. `parse` wins over it.
    * - `group-label`/`groupLabel`: What a screen reader hears when a step finishes or fails. `{heading}` is
    * the step's heading and `{status}` is `done` or `failed`.
    * - `label`: The log's name, read by screen readers.
@@ -59864,6 +59914,11 @@ export type CustomElements = {
    * true would write the attribute on upgrade.
    * - `query`: Text a line has to hold to be shown, ignoring case. Empty shows every line.
    * - `resume-label`/`resumeLabel`: The words on the button that returns to the newest line, where `resume` is empty.
+   * - `selectable`: Whether pressing a line's number selects the line, and pressing another
+   * with Shift selects every line between them. Each number is then a
+   * button, or a link with `line-href`, and the arrow keys move between them.
+   * - `selected-lines`/`selectedLines`: The lines selected, as a number or a range such as `12-20`. Empty selects
+   * none. A reader's press asks first: `helix-select` is cancelable.
    * - `threshold`: How near the newest line still counts as being at it, in pixels.
    * - `timestamps`: How each line shows its `at`: `absolute` on the clock, `relative` as the
    * time since the first line. Absent shows no time.
@@ -59879,8 +59934,8 @@ export type CustomElements = {
    * Replaced rather than mutated: setting it starts the log over with these
    * lines, and `write` adds to them. Set it or write children, not both. (property only)
    * - `parse`: Reads each finished line of written text: return the fields to set, such
-   * as `level` or `group`, or `null` to drop the line. Lines in `lines` are
-   * taken as they are. (property only)
+   * as `level`, `open` or `close` to start or end a step, or `null` to drop
+   * the line. Lines in `lines` are taken as they are. Wins over `format`. (property only)
    * - `source`: Text to read as it arrives, to the end: a `ReadableStream` of text or
    * bytes, such as a `fetch` response's body, or an async iterable. Bytes are
    * read as UTF-8. The log sets `done` when it ends, and a new source stops
@@ -59913,8 +59968,10 @@ export type CustomElements = {
    * Events that will be emitted by the component.
    *
    * - `helix-before-pin`: Fired when the reader leaves the newest line by scrolling, or comes back to it. Cancelable.
-   * - `helix-expand`: Fired after a reader opens or closes a group drawn from `groups`, with the `id` of every open group in `detail.value`, separated by commas.
+   * - `helix-expand`: Fired after a reader opens or closes a step drawn from `groups` or opened by a parser, with the `id` of every open group in `detail.value`, separated by commas.
    * - `helix-pin`: Fired after the log follows the newest line or lets go of it, with `true` or `false` in `detail.value`.
+   * - `helix-select`: Fired when a reader presses a number to change the selection, with the lines asked for in `detail.value`. Cancelable.
+   * - `helix-selected`: Fired after the selection changes, with the lines now selected in `detail.value`, such as `12-20`.
    *
    * ## Slots
    *
@@ -60004,6 +60061,7 @@ export type CustomElements = {
    * - `line-run-italic`: A run drawn italic.
    * - `line-run-strike`: A run drawn struck through.
    * - `line-run-underline`: A run drawn underlined.
+   * - `line-selected`: The row of a line drawn from data that is selected.
    * - `line-text`: The text of a line drawn from data.
    * - `line-time`: The time of a line drawn from data.
    * - `line-warn`: The row of a line drawn from data at `warn`.
@@ -68462,7 +68520,7 @@ export type CustomElements = {
    *
    * CSS variables available for styling the component.
    *
-   * - `--spatial-bar-chart-block-size`: How tall the plot is.
+   * - `--spatial-bar-chart-block-size`: How tall the plot is. By default, three quarters of its width and 22em at most.
    * - `--spatial-bar-chart-shade`: How far a bar's face turns from the light, from 0 for its top. The component writes it on each face, and the stylesheet that shades the face reads it.
    *
    * ## CSS Parts
@@ -69093,7 +69151,7 @@ export type CustomElements = {
    *
    * CSS variables available for styling the component.
    *
-   * - `--spatial-ribbon-chart-block-size`: How tall the plot is.
+   * - `--spatial-ribbon-chart-block-size`: How tall the plot is. By default, three quarters of its width and 22em at most.
    * - `--spatial-ribbon-chart-shade`: How far a ribbon's face turns from the light, from 0 for a level top. The component writes it on each face, and the stylesheet that shades the face reads it.
    *
    * ## CSS Parts
@@ -69348,7 +69406,7 @@ export type CustomElements = {
    *
    * CSS variables available for styling the component.
    *
-   * - `--spatial-scatter-chart-block-size`: How tall the plot is.
+   * - `--spatial-scatter-chart-block-size`: How tall the plot is. By default, three quarters of its width and 22em at most.
    *
    * ## CSS Parts
    *
@@ -69610,7 +69668,7 @@ export type CustomElements = {
    *
    * CSS variables available for styling the component.
    *
-   * - `--spatial-surface-chart-block-size`: How tall the plot is.
+   * - `--spatial-surface-chart-block-size`: How tall the plot is. By default, three quarters of its width and 22em at most.
    * - `--spatial-surface-chart-high`: The color of the highest reading, which the renderer reads too.
    * - `--spatial-surface-chart-low`: The color of the lowest reading, which the renderer reads too.
    * - `--spatial-surface-chart-level`: How high a face of the surface stands between the lowest reading and the highest, from 0 to 1: its corners' average. The component writes it on each face, and the stylesheet that colors the face along the ramp reads it.
@@ -69867,7 +69925,7 @@ export type CustomElements = {
    *
    * CSS variables available for styling the component.
    *
-   * - `--spatial-treemap-block-size`: How tall the plot is.
+   * - `--spatial-treemap-block-size`: How tall the plot is. By default, three quarters of its width and 22em at most.
    * - `--spatial-treemap-shade`: How far a block's face turns from the light, from 0 for its top. The component writes it on each face, and the stylesheet that shades the face reads it.
    *
    * ## CSS Parts
@@ -91925,6 +91983,7 @@ export type CustomElementsSolidJs = {
    * - `--log-error-color`: The color of a line at `error`, and of the band behind it. Defaults to the danger color.
    * - `--log-mark-background-color`: The band behind a line `mark-lines` names.
    * - `--log-match-background-color`: The fill behind text that matches the log's `query`.
+   * - `--log-selected-background-color`: The band behind a selected line, on a `selectable` log.
    * - `--log-warn-color`: The color of a line at `warn`, and of the band behind it. Defaults to the warning color.
    * - `--log-run-background-color`: Written on a `run` with a background, in the same form as `--log-run-color`.
    * - `--log-run-color`: Written on a `run` with a text color: one of the sixteen `--log-ansi-*` colors the log publishes, or the color itself.
@@ -91937,9 +91996,10 @@ export type CustomElementsSolidJs = {
    * - `line-debug`: The row of a line at `debug`.
    * - `line-error`: The row of a line at `error`.
    * - `line-marked`: The row of a line `mark-lines` names on the log.
+   * - `line-selected`: The row of a line in the log's selection.
    * - `line-warn`: The row of a line at `warn`.
    * - `match`: Text that matches the log's `query`, in a line the log draws from data.
-   * - `number`: The line's number, shown with `line-numbers`, and a link with `line-href`.
+   * - `number`: The line's number, shown with `line-numbers`: a link with `line-href`, and a button on a `selectable` log.
    * - `run`: A stretch of text drawn in an ANSI style, in a line the log draws from data. Its color is `--log-run-color` and its background `--log-run-background-color`.
    * - `run-bold`: A run drawn bold.
    * - `run-dim`: A run drawn faint.
@@ -91999,6 +92059,10 @@ export type CustomElementsSolidJs = {
    * - `error-label`/`errorLabel`: What a screen reader hears when lines at `error` arrive. `{count}` is how
    * many arrived together and `{text}` is the first of them.
    * - `fallback-label`/`fallbackLabel`: The log's name, read by screen readers, where `label` is empty.
+   * - `format`: The format written text is in, read with a parser Helix ships:
+   * `github-actions` reads a GitHub Actions log's workflow commands into steps
+   * and levels, and `vercel` a Vercel build log's phases and warnings. Absent
+   * reads none. `parse` wins over it.
    * - `group-label`/`groupLabel`: What a screen reader hears when a step finishes or fails. `{heading}` is
    * the step's heading and `{status}` is `done` or `failed`.
    * - `label`: The log's name, read by screen readers.
@@ -92019,6 +92083,11 @@ export type CustomElementsSolidJs = {
    * true would write the attribute on upgrade.
    * - `query`: Text a line has to hold to be shown, ignoring case. Empty shows every line.
    * - `resume-label`/`resumeLabel`: The words on the button that returns to the newest line, where `resume` is empty.
+   * - `selectable`: Whether pressing a line's number selects the line, and pressing another
+   * with Shift selects every line between them. Each number is then a
+   * button, or a link with `line-href`, and the arrow keys move between them.
+   * - `selected-lines`/`selectedLines`: The lines selected, as a number or a range such as `12-20`. Empty selects
+   * none. A reader's press asks first: `helix-select` is cancelable.
    * - `threshold`: How near the newest line still counts as being at it, in pixels.
    * - `timestamps`: How each line shows its `at`: `absolute` on the clock, `relative` as the
    * time since the first line. Absent shows no time.
@@ -92034,8 +92103,8 @@ export type CustomElementsSolidJs = {
    * Replaced rather than mutated: setting it starts the log over with these
    * lines, and `write` adds to them. Set it or write children, not both. (property only)
    * - `parse`: Reads each finished line of written text: return the fields to set, such
-   * as `level` or `group`, or `null` to drop the line. Lines in `lines` are
-   * taken as they are. (property only)
+   * as `level`, `open` or `close` to start or end a step, or `null` to drop
+   * the line. Lines in `lines` are taken as they are. Wins over `format`. (property only)
    * - `source`: Text to read as it arrives, to the end: a `ReadableStream` of text or
    * bytes, such as a `fetch` response's body, or an async iterable. Bytes are
    * read as UTF-8. The log sets `done` when it ends, and a new source stops
@@ -92068,8 +92137,10 @@ export type CustomElementsSolidJs = {
    * Events that will be emitted by the component.
    *
    * - `helix-before-pin`: Fired when the reader leaves the newest line by scrolling, or comes back to it. Cancelable.
-   * - `helix-expand`: Fired after a reader opens or closes a group drawn from `groups`, with the `id` of every open group in `detail.value`, separated by commas.
+   * - `helix-expand`: Fired after a reader opens or closes a step drawn from `groups` or opened by a parser, with the `id` of every open group in `detail.value`, separated by commas.
    * - `helix-pin`: Fired after the log follows the newest line or lets go of it, with `true` or `false` in `detail.value`.
+   * - `helix-select`: Fired when a reader presses a number to change the selection, with the lines asked for in `detail.value`. Cancelable.
+   * - `helix-selected`: Fired after the selection changes, with the lines now selected in `detail.value`, such as `12-20`.
    *
    * ## Slots
    *
@@ -92159,6 +92230,7 @@ export type CustomElementsSolidJs = {
    * - `line-run-italic`: A run drawn italic.
    * - `line-run-strike`: A run drawn struck through.
    * - `line-run-underline`: A run drawn underlined.
+   * - `line-selected`: The row of a line drawn from data that is selected.
    * - `line-text`: The text of a line drawn from data.
    * - `line-time`: The time of a line drawn from data.
    * - `line-warn`: The row of a line drawn from data at `warn`.
@@ -100778,7 +100850,7 @@ export type CustomElementsSolidJs = {
    *
    * CSS variables available for styling the component.
    *
-   * - `--spatial-bar-chart-block-size`: How tall the plot is.
+   * - `--spatial-bar-chart-block-size`: How tall the plot is. By default, three quarters of its width and 22em at most.
    * - `--spatial-bar-chart-shade`: How far a bar's face turns from the light, from 0 for its top. The component writes it on each face, and the stylesheet that shades the face reads it.
    *
    * ## CSS Parts
@@ -101415,7 +101487,7 @@ export type CustomElementsSolidJs = {
    *
    * CSS variables available for styling the component.
    *
-   * - `--spatial-ribbon-chart-block-size`: How tall the plot is.
+   * - `--spatial-ribbon-chart-block-size`: How tall the plot is. By default, three quarters of its width and 22em at most.
    * - `--spatial-ribbon-chart-shade`: How far a ribbon's face turns from the light, from 0 for a level top. The component writes it on each face, and the stylesheet that shades the face reads it.
    *
    * ## CSS Parts
@@ -101671,7 +101743,7 @@ export type CustomElementsSolidJs = {
    *
    * CSS variables available for styling the component.
    *
-   * - `--spatial-scatter-chart-block-size`: How tall the plot is.
+   * - `--spatial-scatter-chart-block-size`: How tall the plot is. By default, three quarters of its width and 22em at most.
    *
    * ## CSS Parts
    *
@@ -101934,7 +102006,7 @@ export type CustomElementsSolidJs = {
    *
    * CSS variables available for styling the component.
    *
-   * - `--spatial-surface-chart-block-size`: How tall the plot is.
+   * - `--spatial-surface-chart-block-size`: How tall the plot is. By default, three quarters of its width and 22em at most.
    * - `--spatial-surface-chart-high`: The color of the highest reading, which the renderer reads too.
    * - `--spatial-surface-chart-low`: The color of the lowest reading, which the renderer reads too.
    * - `--spatial-surface-chart-level`: How high a face of the surface stands between the lowest reading and the highest, from 0 to 1: its corners' average. The component writes it on each face, and the stylesheet that colors the face along the ramp reads it.
@@ -102192,7 +102264,7 @@ export type CustomElementsSolidJs = {
    *
    * CSS variables available for styling the component.
    *
-   * - `--spatial-treemap-block-size`: How tall the plot is.
+   * - `--spatial-treemap-block-size`: How tall the plot is. By default, three quarters of its width and 22em at most.
    * - `--spatial-treemap-shade`: How far a block's face turns from the light, from 0 for its top. The component writes it on each face, and the stylesheet that shades the face reads it.
    *
    * ## CSS Parts
@@ -110627,6 +110699,8 @@ export type CustomCssProperties = {
   "--log-mark-background-color"?: (string) | undefined;
   /** The fill behind text that matches the log's `query`. */
   "--log-match-background-color"?: (string) | undefined;
+  /** The band behind a selected line, on a `selectable` log. */
+  "--log-selected-background-color"?: (string) | undefined;
   /** The color of a line at `warn`, and of the band behind it. Defaults to the warning color. */
   "--log-warn-color"?: (string) | undefined;
   /** Written on a `run` with a background, in the same form as `--log-run-color`. */
@@ -111413,7 +111487,7 @@ export type CustomCssProperties = {
   "--sparkline-readout-font-size"?: (string) | undefined;
   /** Thickness of the line, overriding `weight`. */
   "--sparkline-width"?: (string) | undefined;
-  /** How tall the plot is. */
+  /** How tall the plot is. By default, three quarters of its width and 22em at most. */
   "--spatial-bar-chart-block-size"?: (string) | undefined;
   /** How far a bar's face turns from the light, from 0 for its top. The component writes it on each face, and the stylesheet that shades the face reads it. */
   "--spatial-bar-chart-shade"?: (string) | undefined;
@@ -111431,13 +111505,13 @@ export type CustomCssProperties = {
   "--spatial-heatmap-label-y"?: (string) | undefined;
   /** How many cells the drawing spans across: its columns and its rows together. The component writes it on the strip, and a stylesheet that caps the cell size reads it. */
   "--spatial-heatmap-span"?: (string) | undefined;
-  /** How tall the plot is. */
+  /** How tall the plot is. By default, three quarters of its width and 22em at most. */
   "--spatial-ribbon-chart-block-size"?: (string) | undefined;
   /** How far a ribbon's face turns from the light, from 0 for a level top. The component writes it on each face, and the stylesheet that shades the face reads it. */
   "--spatial-ribbon-chart-shade"?: (string) | undefined;
-  /** How tall the plot is. */
+  /** How tall the plot is. By default, three quarters of its width and 22em at most. */
   "--spatial-scatter-chart-block-size"?: (string) | undefined;
-  /** How tall the plot is. */
+  /** How tall the plot is. By default, three quarters of its width and 22em at most. */
   "--spatial-surface-chart-block-size"?: (string) | undefined;
   /** The color of the highest reading, which the renderer reads too. */
   "--spatial-surface-chart-high"?: (string) | undefined;
@@ -111447,7 +111521,7 @@ export type CustomCssProperties = {
   "--spatial-surface-chart-level"?: (string) | undefined;
   /** How far a face of the surface turns from the light, as a share of lightness to take from its color, from 0 facing it to about 0.3. The component writes it on each face, and the stylesheet that shades the face reads it. */
   "--spatial-surface-chart-shade"?: (string) | undefined;
-  /** How tall the plot is. */
+  /** How tall the plot is. By default, three quarters of its width and 22em at most. */
   "--spatial-treemap-block-size"?: (string) | undefined;
   /** How far a block's face turns from the light, from 0 for its top. The component writes it on each face, and the stylesheet that shades the face reads it. */
   "--spatial-treemap-shade"?: (string) | undefined;

package/types/vue.d.ts

@@ -11532,6 +11532,12 @@ export type HelixLogHelixExpandElementEvent =
   HelixLogElementEvent<HelixExpandEvent>;
 /** `helix-pin` event type */
 export type HelixLogHelixPinElementEvent = HelixLogElementEvent<HelixPinEvent>;
+/** `helix-select` event type */
+export type HelixLogHelixSelectElementEvent =
+  HelixLogElementEvent<HelixSelectEvent>;
+/** `helix-selected` event type */
+export type HelixLogHelixSelectedElementEvent =
+  HelixLogElementEvent<HelixSelectedEvent>;
 
 export type HelixLogVueProps = {
   /** The text shown and announced when there are no rows and none are loading. */
@@ -11577,6 +11583,11 @@ many arrived together and `{text}` is the first of them. */
   "fallback-label"?: (HelixLog["fallbackLabel"]) | undefined;
   /** The log's name, read by screen readers, where `label` is empty. */
   fallbackLabel?: (HelixLog["fallbackLabel"]) | undefined;
+  /** The format written text is in, read with a parser Helix ships:
+`github-actions` reads a GitHub Actions log's workflow commands into steps
+and levels, and `vercel` a Vercel build log's phases and warnings. Absent
+reads none. `parse` wins over it. */
+  format?: (HelixLog["format"]) | undefined;
   /** What a screen reader hears when a step finishes or fails. `{heading}` is
 the step's heading and `{status}` is `done` or `failed`. */
   "group-label"?: (HelixLog["groupLabel"]) | undefined;
@@ -11625,6 +11636,16 @@ true would write the attribute on upgrade. */
   "resume-label"?: (HelixLog["resumeLabel"]) | undefined;
   /** The words on the button that returns to the newest line, where `resume` is empty. */
   resumeLabel?: (HelixLog["resumeLabel"]) | undefined;
+  /** Whether pressing a line's number selects the line, and pressing another
+with Shift selects every line between them. Each number is then a
+button, or a link with `line-href`, and the arrow keys move between them. */
+  selectable?: (HelixLog["selectable"]) | undefined;
+  /** The lines selected, as a number or a range such as `12-20`. Empty selects
+none. A reader's press asks first: `helix-select` is cancelable. */
+  "selected-lines"?: (HelixLog["selectedLines"]) | undefined;
+  /** The lines selected, as a number or a range such as `12-20`. Empty selects
+none. A reader's press asks first: `helix-select` is cancelable. */
+  selectedLines?: (HelixLog["selectedLines"]) | undefined;
   /** How near the newest line still counts as being at it, in pixels. */
   threshold?: (HelixLog["threshold"]) | undefined;
   /** How each line shows its `at`: `absolute` on the clock, `relative` as the
@@ -11645,8 +11666,8 @@ Replaced rather than mutated: setting it starts the log over with these
 lines, and `write` adds to them. Set it or write children, not both. */
   lines?: (HelixLog["lines"]) | undefined;
   /** Reads each finished line of written text: return the fields to set, such
-as `level` or `group`, or `null` to drop the line. Lines in `lines` are
-taken as they are. */
+as `level`, `open` or `close` to start or end a step, or `null` to drop
+the line. Lines in `lines` are taken as they are. Wins over `format`. */
   parse?: (HelixLog["parse"]) | undefined;
   /** Text to read as it arrives, to the end: a `ReadableStream` of text or
 bytes, such as a `fetch` response's body, or an async iterable. Bytes are
@@ -11658,10 +11679,14 @@ reading the last one. */
 export type HelixLogVueEvents = {
   /** Fired when the reader leaves the newest line by scrolling, or comes back to it. Cancelable. */
   "helix-before-pin": HelixLogHelixBeforePinElementEvent;
-  /** Fired after a reader opens or closes a group drawn from `groups`, with the `id` of every open group in `detail.value`, separated by commas. */
+  /** Fired after a reader opens or closes a step drawn from `groups` or opened by a parser, with the `id` of every open group in `detail.value`, separated by commas. */
   "helix-expand": HelixLogHelixExpandElementEvent;
   /** Fired after the log follows the newest line or lets go of it, with `true` or `false` in `detail.value`. */
   "helix-pin": HelixLogHelixPinElementEvent;
+  /** Fired when a reader presses a number to change the selection, with the lines asked for in `detail.value`. Cancelable. */
+  "helix-select": HelixLogHelixSelectElementEvent;
+  /** Fired after the selection changes, with the lines now selected in `detail.value`, such as `12-20`. */
+  "helix-selected": HelixLogHelixSelectedElementEvent;
 };
 
 /** `HelixMapArea` component event */
@@ -24281,6 +24306,8 @@ export type CustomCssProperties = {
   "--log-mark-background-color"?: (string) | undefined;
   /** The fill behind text that matches the log's `query`. */
   "--log-match-background-color"?: (string) | undefined;
+  /** The band behind a selected line, on a `selectable` log. */
+  "--log-selected-background-color"?: (string) | undefined;
   /** The color of a line at `warn`, and of the band behind it. Defaults to the warning color. */
   "--log-warn-color"?: (string) | undefined;
   /** Written on a `run` with a background, in the same form as `--log-run-color`. */
@@ -25067,7 +25094,7 @@ export type CustomCssProperties = {
   "--sparkline-readout-font-size"?: (string) | undefined;
   /** Thickness of the line, overriding `weight`. */
   "--sparkline-width"?: (string) | undefined;
-  /** How tall the plot is. */
+  /** How tall the plot is. By default, three quarters of its width and 22em at most. */
   "--spatial-bar-chart-block-size"?: (string) | undefined;
   /** How far a bar's face turns from the light, from 0 for its top. The component writes it on each face, and the stylesheet that shades the face reads it. */
   "--spatial-bar-chart-shade"?: (string) | undefined;
@@ -25085,13 +25112,13 @@ export type CustomCssProperties = {
   "--spatial-heatmap-label-y"?: (string) | undefined;
   /** How many cells the drawing spans across: its columns and its rows together. The component writes it on the strip, and a stylesheet that caps the cell size reads it. */
   "--spatial-heatmap-span"?: (string) | undefined;
-  /** How tall the plot is. */
+  /** How tall the plot is. By default, three quarters of its width and 22em at most. */
   "--spatial-ribbon-chart-block-size"?: (string) | undefined;
   /** How far a ribbon's face turns from the light, from 0 for a level top. The component writes it on each face, and the stylesheet that shades the face reads it. */
   "--spatial-ribbon-chart-shade"?: (string) | undefined;
-  /** How tall the plot is. */
+  /** How tall the plot is. By default, three quarters of its width and 22em at most. */
   "--spatial-scatter-chart-block-size"?: (string) | undefined;
-  /** How tall the plot is. */
+  /** How tall the plot is. By default, three quarters of its width and 22em at most. */
   "--spatial-surface-chart-block-size"?: (string) | undefined;
   /** The color of the highest reading, which the renderer reads too. */
   "--spatial-surface-chart-high"?: (string) | undefined;
@@ -25101,7 +25128,7 @@ export type CustomCssProperties = {
   "--spatial-surface-chart-level"?: (string) | undefined;
   /** How far a face of the surface turns from the light, as a share of lightness to take from its color, from 0 facing it to about 0.3. The component writes it on each face, and the stylesheet that shades the face reads it. */
   "--spatial-surface-chart-shade"?: (string) | undefined;
-  /** How tall the plot is. */
+  /** How tall the plot is. By default, three quarters of its width and 22em at most. */
   "--spatial-treemap-block-size"?: (string) | undefined;
   /** How far a block's face turns from the light, from 0 for its top. The component writes it on each face, and the stylesheet that shades the face reads it. */
   "--spatial-treemap-shade"?: (string) | undefined;