@fusion.dev/helix 0.197.1 → 0.199.0

package/types/jsx.d.ts

@@ -141,6 +141,7 @@ import type {
   HelixMenuItem,
   HelixMenuSection,
   HelixMeter,
+  HelixMotionToggle,
   HelixMoveEvent,
   HelixNavigateEvent,
   HelixNavigation,
@@ -208,9 +209,12 @@ import type {
   HelixSortEvent,
   HelixSortedEvent,
   HelixSparkline,
+  HelixSpatialBarChart,
   HelixSpatialHeatmap,
+  HelixSpatialRibbonChart,
   HelixSpatialScatterChart,
   HelixSpatialSurfaceChart,
+  HelixSpatialTreemap,
   HelixSpeedDial,
   HelixSpeedDialGroup,
   HelixSpeedDialItem,
@@ -5774,7 +5778,13 @@ share the row and split it, dots to the start and arrows to the end,
 arrived at by two defaults rather than by a rule about the pair, so moving
 one leaves the other alone. */
   indicatorPlacement?: (HelixCarousel["indicatorPlacement"]) | undefined;
-  /** Whether the carousel advances on its own. */
+  /** Whether the carousel advances on its own.
+
+**Not where the reader asked for less motion**, or where the page has
+paused its motion, through `pauseMotion` or `Motion Toggle`: the carousel
+starts still, and its rotation control starts it. A page that pauses its
+motion later stops the rotation, and one that lets it run again starts it
+again, unless the reader stopped it. */
   autoplay?: (HelixCarousel["autoplay"]) | undefined;
   /** Whether the previous and next controls are shown.
 
@@ -6226,7 +6236,13 @@ share the row and split it, dots to the start and arrows to the end,
 arrived at by two defaults rather than by a rule about the pair, so moving
 one leaves the other alone. */
   "prop:indicatorPlacement"?: (HelixCarousel["indicatorPlacement"]) | undefined;
-  /** Whether the carousel advances on its own. */
+  /** Whether the carousel advances on its own.
+
+**Not where the reader asked for less motion**, or where the page has
+paused its motion, through `pauseMotion` or `Motion Toggle`: the carousel
+starts still, and its rotation control starts it. A page that pauses its
+motion later stops the rotation, and one that lets it run again starts it
+again, unless the reader stopped it. */
   "prop:autoplay"?: (HelixCarousel["autoplay"]) | undefined;
   /** Whether the previous and next controls are shown.
 
@@ -17400,6 +17416,16 @@ the list then holds, written with `count-label`. */
 the drawing, with `{note}` for its name and `{count}` for how many notes
 the list then holds, written with `count-label`. */
   selectionLabel?: (HelixGraph["selectionLabel"]) | undefined;
+  /** What the `settling` part says while a layout runs unseen, where the reader
+asked for less motion or the page paused its motion. */
+  "settling-label"?: (HelixGraph["settlingLabel"]) | undefined;
+  /** What the `settling` part says while a layout runs unseen, where the reader
+asked for less motion or the page paused its motion. */
+  settlingLabel?: (HelixGraph["settlingLabel"]) | undefined;
+  /** What the button that stops a long layout says. */
+  "stop-layout-label"?: (HelixGraph["stopLayoutLabel"]) | undefined;
+  /** What the button that stops a long layout says. */
+  stopLayoutLabel?: (HelixGraph["stopLayoutLabel"]) | undefined;
   /** The hint shown when one finger swipes over the graph with `gestures="cooperative"`. */
   "two-finger-hint-label"?: (HelixGraph["twoFingerHintLabel"]) | undefined;
   /** The hint shown when one finger swipes over the graph with `gestures="cooperative"`. */
@@ -17745,6 +17771,16 @@ the list then holds, written with `count-label`. */
 the drawing, with `{note}` for its name and `{count}` for how many notes
 the list then holds, written with `count-label`. */
   "prop:selectionLabel"?: (HelixGraph["selectionLabel"]) | undefined;
+  /** What the `settling` part says while a layout runs unseen, where the reader
+asked for less motion or the page paused its motion. */
+  "attr:settling-label"?: (HelixGraph["settlingLabel"]) | undefined;
+  /** What the `settling` part says while a layout runs unseen, where the reader
+asked for less motion or the page paused its motion. */
+  "prop:settlingLabel"?: (HelixGraph["settlingLabel"]) | undefined;
+  /** What the button that stops a long layout says. */
+  "attr:stop-layout-label"?: (HelixGraph["stopLayoutLabel"]) | undefined;
+  /** What the button that stops a long layout says. */
+  "prop:stopLayoutLabel"?: (HelixGraph["stopLayoutLabel"]) | undefined;
   /** The hint shown when one finger swipes over the graph with `gestures="cooperative"`. */
   "attr:two-finger-hint-label"?: (HelixGraph["twoFingerHintLabel"]) | undefined;
   /** The hint shown when one finger swipes over the graph with `gestures="cooperative"`. */
@@ -18013,6 +18049,21 @@ export type HelixHeatmapHelixResizeElementEvent =
   HelixHeatmapElementEvent<HelixResizeEvent>;
 
 export type HelixHeatmapProps = {
+  /** How strongly the cells are drawn, as on every chart.
+
+`outlined` is a cell as its edge in its tone over a fill faded toward the
+page, and `subtle` a faint wash of the tone under the same edge. Absent is
+the filled cell, per the rule that a reflected property takes no default,
+and `solid` writes it out.
+
+It composes with `material`: emphasis decides what is drawn, and material
+how much of it comes through. The ring on the cell the keys rest on keeps
+its own ink. */
+  emphasis?: (HelixHeatmap["emphasis"]) | undefined;
+  /** How much of each mark comes through, as on every chart: `glass` admits the
+most of what is behind it, `frosted` less, and absent is opaque. The
+strength is the theme's, scaled by `--helix-material-opacity`. */
+  material?: (HelixHeatmap["material"]) | undefined;
   /** The words shown in place of the drawing when the table has no readings,
 and the fallback of the `empty` slot. */
   "empty-text"?: (HelixHeatmap["emptyText"]) | undefined;
@@ -18241,6 +18292,21 @@ does not look inside the one it has. */
 };
 
 export type HelixHeatmapSolidJsProps = {
+  /** How strongly the cells are drawn, as on every chart.
+
+`outlined` is a cell as its edge in its tone over a fill faded toward the
+page, and `subtle` a faint wash of the tone under the same edge. Absent is
+the filled cell, per the rule that a reflected property takes no default,
+and `solid` writes it out.
+
+It composes with `material`: emphasis decides what is drawn, and material
+how much of it comes through. The ring on the cell the keys rest on keeps
+its own ink. */
+  "prop:emphasis"?: (HelixHeatmap["emphasis"]) | undefined;
+  /** How much of each mark comes through, as on every chart: `glass` admits the
+most of what is behind it, `frosted` less, and absent is opaque. The
+strength is the theme's, scaled by `--helix-material-opacity`. */
+  "prop:material"?: (HelixHeatmap["material"]) | undefined;
   /** The words shown in place of the drawing when the table has no readings,
 and the fallback of the `empty` slot. */
   "attr:empty-text"?: (HelixHeatmap["emptyText"]) | undefined;
@@ -24948,6 +25014,32 @@ fair summary of a task and a poor one of a quantity. */
   textContent?: (string | number) | undefined;
 };
 
+/** `HelixMotionToggle` component event */
+export type HelixMotionToggleElementEvent<E = Event> = TypedEvent<
+  HelixMotionToggle,
+  E
+>;
+
+export type HelixMotionToggleProps = {
+  /** The button's name, which stays the same whichever way it stands. */
+  label?: (HelixMotionToggle["label"]) | undefined;
+
+  /** Fired after a press pauses the page's motion or lets it run. */
+  onchange?: ((e: HelixMotionToggleElementEvent) => void) | undefined;
+};
+
+export type HelixMotionToggleSolidJsProps = {
+  /** The button's name, which stays the same whichever way it stands. */
+  "prop:label"?: (HelixMotionToggle["label"]) | undefined;
+  /** Fired after a press pauses the page's motion or lets it run. */
+  "on:change"?: ((e: HelixMotionToggleElementEvent) => void) | undefined;
+
+  /** Set the innerHTML of the element */
+  innerHTML?: (string) | undefined;
+  /** Set the textContent of the element */
+  textContent?: (string | number) | undefined;
+};
+
 export type HelixNavigationProps = {
   /** Whether the arrow keys move focus between the destinations.
 
@@ -32766,6 +32858,312 @@ not. */
   textContent?: (string | number) | undefined;
 };
 
+/** `HelixSpatialBarChart` component event */
+export type HelixSpatialBarChartElementEvent<E = Event> = TypedEvent<
+  HelixSpatialBarChart,
+  E
+>;
+/** `helix-plot-change` event type */
+export type HelixSpatialBarChartHelixPlotChangeElementEvent =
+  HelixSpatialBarChartElementEvent<HelixPlotChangeEvent>;
+/** `helix-plot-turn` event type */
+export type HelixSpatialBarChartHelixPlotTurnElementEvent =
+  HelixSpatialBarChartElementEvent<HelixPlotTurnEvent>;
+/** `helix-reading-change` event type */
+export type HelixSpatialBarChartHelixReadingChangeElementEvent =
+  HelixSpatialBarChartElementEvent<HelixReadingChangeEvent>;
+/** `helix-reading-press` event type */
+export type HelixSpatialBarChartHelixReadingPressElementEvent =
+  HelixSpatialBarChartElementEvent<HelixReadingPressEvent>;
+
+export type HelixSpatialBarChartProps = {
+  /** How strongly the bars are drawn, as on every chart.
+
+`outlined` is a bar as its edges in its series' color over faces faded
+toward the page, and `subtle` the same edges over a faint wash, which
+shows the bars behind it. Absent is the filled bar, per the rule that a
+reflected property takes no default, and `solid` writes it out. A
+renderer draws the bars the same way.
+
+It composes with `material`: emphasis decides what is drawn, and material
+how much of it comes through. The outline on the bar the keys rest on
+keeps its own ink. */
+  emphasis?: (HelixSpatialBarChart["emphasis"]) | undefined;
+  /** How much of each mark comes through, as on every chart: `glass` admits the
+most of what is behind it, `frosted` less, and absent is opaque. The
+strength is the theme's, scaled by `--helix-material-opacity`. */
+  material?: (HelixSpatialBarChart["material"]) | undefined;
+  /** The words shown in place of the drawing when the table has no readings,
+and the fallback of the `empty` slot. */
+  "empty-text"?: (HelixSpatialBarChart["emptyText"]) | undefined;
+  /** The words shown in place of the drawing when the table has no readings,
+and the fallback of the `empty` slot. */
+  emptyText?: (HelixSpatialBarChart["emptyText"]) | undefined;
+  /** Whether the readings are still on their way. The chart shows
+`loading-text` in place of an empty drawing until it has readings.
+
+Reflected, so a stylesheet can treat the chart while it waits. A chart
+that already has readings keeps drawing them, so a refresh does not
+blank it. */
+  loading?: (HelixSpatialBarChart["loading"]) | undefined;
+  /** The words shown in place of the drawing while `loading` is set and
+there are no readings yet, and the fallback of the `loading` slot. */
+  "loading-text"?: (HelixSpatialBarChart["loadingText"]) | undefined;
+  /** The words shown in place of the drawing while `loading` is set and
+there are no readings yet, and the fallback of the `loading` slot. */
+  loadingText?: (HelixSpatialBarChart["loadingText"]) | undefined;
+  /** The id of the table to read.
+
+Names a table in the same tree, so a chart inside another component's
+shadow root reads a table in that root rather than one in the document. A
+`<table>` or anything built from grid roles, including `helix-table`.
+
+**In React this arrives as a property and not as an attribute**, the way
+`Tooltip.for` does, so it does not reflect and nothing styles on it. */
+  for?: (HelixSpatialBarChart["for"]) | undefined;
+  /** The chart's name, which starts the chart's text summary.
+
+Absent falls back to the table's own caption, which is usually the right
+words and is already written. */
+  label?: (HelixSpatialBarChart["label"]) | undefined;
+  /** The locale the chart's own numbers are written in: its axis, its
+percentages and its totals, such as `de` for `1.240` and `32 %`.
+
+Absent reads the nearest `lang`, then the runtime's own. The table's
+cells are shown as the table writes them, whatever this says. */
+  locale?: (HelixSpatialBarChart["locale"]) | undefined;
+  /** Where a reading the keys moved to stands among the readings, said after
+it. `{position}` and `{count}` are replaced with the numbers, written in
+`locale`.
+
+Set it to the words of the page's language, such as `{position} von
+{count}`, or to nothing to say no position. A slice or a series a
+legend hid is not counted. */
+  "position-label"?: (HelixSpatialBarChart["positionLabel"]) | undefined;
+  /** Where a reading the keys moved to stands among the readings, said after
+it. `{position}` and `{count}` are replaced with the numbers, written in
+`locale`.
+
+Set it to the words of the page's language, such as `{position} von
+{count}`, or to nothing to say no position. A slice or a series a
+legend hid is not counted. */
+  positionLabel?: (HelixSpatialBarChart["positionLabel"]) | undefined;
+  /** Draws no box: no edges, grid, numbers, or names, so the readings stand
+alone and fill the plot, as a picture on a product's own page does. The
+table, the summary, the tooltip, and the keys still carry every value,
+and a renderer draws no box either. */
+  "no-box"?: (HelixSpatialBarChart["noBox"]) | undefined;
+  /** Draws no box: no edges, grid, numbers, or names, so the readings stand
+alone and fill the plot, as a picture on a product's own page does. The
+table, the summary, the tooltip, and the keys still carry every value,
+and a renderer draws no box either. */
+  noBox?: (HelixSpatialBarChart["noBox"]) | undefined;
+  /** What the readout says for a place with no value. `{category}` and
+`{series}` name the place. */
+  "open-label"?: (HelixSpatialBarChart["openLabel"]) | undefined;
+  /** What the readout says for a place with no value. `{category}` and
+`{series}` name the place. */
+  openLabel?: (HelixSpatialBarChart["openLabel"]) | undefined;
+  /** The plot's name where the chart has none: no `aria-label`, `label`, or table caption. */
+  "plot-label"?: (HelixSpatialBarChart["plotLabel"]) | undefined;
+  /** The plot's name where the chart has none: no `aria-label`, `label`, or table caption. */
+  plotLabel?: (HelixSpatialBarChart["plotLabel"]) | undefined;
+  /** The `summary` part's sentence. `{count}`, `{series}`, and `{categories}`
+are the number of bars, series, and categories, written in the locale,
+and `{low}` and `{high}` the lowest and the highest value. */
+  "summary-label"?: (HelixSpatialBarChart["summaryLabel"]) | undefined;
+  /** The `summary` part's sentence. `{count}`, `{series}`, and `{categories}`
+are the number of bars, series, and categories, written in the locale,
+and `{low}` and `{high}` the lowest and the highest value. */
+  summaryLabel?: (HelixSpatialBarChart["summaryLabel"]) | undefined;
+  /** The readings as data, in the shape of a table, where the page has no
+table to point `for` at. `for` wins where both are set.
+
+```js
+chart.data = {
+  caption: 'Sessions by channel',
+  columns: ['Month', 'Direct', 'Referral'],
+  rows: [['Jan', 10, 4], ['Feb', 20, 8]],
+}
+```
+
+The first column holds each row's label and every column after it a
+series, as in a table. A cell is a number, words, `null` for a blank,
+or `{ value, text }` for a number shown as words, such as `$128k`. A
+number is shown in `locale`.
+
+**A table is still the better source where the page can show one**:
+it reads with no script and before hydration, and a reader can sort and
+copy it. Data is drawn on the client only, so a server serves the
+frame, and the summary, the keys and the readout are then the whole of
+what a screen reader is given. Set a new object to redraw: the chart
+does not look inside the one it has. */
+  data?: (HelixSpatialBarChart["data"]) | undefined;
+
+  /** The bars or the bar the keys rest on changed, which the renderer is told. It stays on the chart. */
+  "onhelix-plot-change"?: ((
+    e: HelixSpatialBarChartHelixPlotChangeElementEvent,
+  ) => void) | undefined;
+  /** Shift with an arrow asked the view to turn, by a step across or up. */
+  "onhelix-plot-turn"?: ((
+    e: HelixSpatialBarChartHelixPlotTurnElementEvent,
+  ) => void) | undefined;
+  /** The reading moved, or was put away: `index` is the row, or `-1` for none, with its `label` and the `pointerType` that moved it. */
+  "onhelix-reading-change"?: ((
+    e: HelixSpatialBarChartHelixReadingChangeElementEvent,
+  ) => void) | undefined;
+  /** A bar was clicked or pressed with Enter or Space, with the same detail as `helix-reading-change`. */
+  "onhelix-reading-press"?: ((
+    e: HelixSpatialBarChartHelixReadingPressElementEvent,
+  ) => void) | undefined;
+};
+
+export type HelixSpatialBarChartSolidJsProps = {
+  /** How strongly the bars are drawn, as on every chart.
+
+`outlined` is a bar as its edges in its series' color over faces faded
+toward the page, and `subtle` the same edges over a faint wash, which
+shows the bars behind it. Absent is the filled bar, per the rule that a
+reflected property takes no default, and `solid` writes it out. A
+renderer draws the bars the same way.
+
+It composes with `material`: emphasis decides what is drawn, and material
+how much of it comes through. The outline on the bar the keys rest on
+keeps its own ink. */
+  "prop:emphasis"?: (HelixSpatialBarChart["emphasis"]) | undefined;
+  /** How much of each mark comes through, as on every chart: `glass` admits the
+most of what is behind it, `frosted` less, and absent is opaque. The
+strength is the theme's, scaled by `--helix-material-opacity`. */
+  "prop:material"?: (HelixSpatialBarChart["material"]) | undefined;
+  /** The words shown in place of the drawing when the table has no readings,
+and the fallback of the `empty` slot. */
+  "attr:empty-text"?: (HelixSpatialBarChart["emptyText"]) | undefined;
+  /** The words shown in place of the drawing when the table has no readings,
+and the fallback of the `empty` slot. */
+  "prop:emptyText"?: (HelixSpatialBarChart["emptyText"]) | undefined;
+  /** Whether the readings are still on their way. The chart shows
+`loading-text` in place of an empty drawing until it has readings.
+
+Reflected, so a stylesheet can treat the chart while it waits. A chart
+that already has readings keeps drawing them, so a refresh does not
+blank it. */
+  "prop:loading"?: (HelixSpatialBarChart["loading"]) | undefined;
+  /** The words shown in place of the drawing while `loading` is set and
+there are no readings yet, and the fallback of the `loading` slot. */
+  "attr:loading-text"?: (HelixSpatialBarChart["loadingText"]) | undefined;
+  /** The words shown in place of the drawing while `loading` is set and
+there are no readings yet, and the fallback of the `loading` slot. */
+  "prop:loadingText"?: (HelixSpatialBarChart["loadingText"]) | undefined;
+  /** The id of the table to read.
+
+Names a table in the same tree, so a chart inside another component's
+shadow root reads a table in that root rather than one in the document. A
+`<table>` or anything built from grid roles, including `helix-table`.
+
+**In React this arrives as a property and not as an attribute**, the way
+`Tooltip.for` does, so it does not reflect and nothing styles on it. */
+  "prop:for"?: (HelixSpatialBarChart["for"]) | undefined;
+  /** The chart's name, which starts the chart's text summary.
+
+Absent falls back to the table's own caption, which is usually the right
+words and is already written. */
+  "prop:label"?: (HelixSpatialBarChart["label"]) | undefined;
+  /** The locale the chart's own numbers are written in: its axis, its
+percentages and its totals, such as `de` for `1.240` and `32 %`.
+
+Absent reads the nearest `lang`, then the runtime's own. The table's
+cells are shown as the table writes them, whatever this says. */
+  "prop:locale"?: (HelixSpatialBarChart["locale"]) | undefined;
+  /** Where a reading the keys moved to stands among the readings, said after
+it. `{position}` and `{count}` are replaced with the numbers, written in
+`locale`.
+
+Set it to the words of the page's language, such as `{position} von
+{count}`, or to nothing to say no position. A slice or a series a
+legend hid is not counted. */
+  "attr:position-label"?: (HelixSpatialBarChart["positionLabel"]) | undefined;
+  /** Where a reading the keys moved to stands among the readings, said after
+it. `{position}` and `{count}` are replaced with the numbers, written in
+`locale`.
+
+Set it to the words of the page's language, such as `{position} von
+{count}`, or to nothing to say no position. A slice or a series a
+legend hid is not counted. */
+  "prop:positionLabel"?: (HelixSpatialBarChart["positionLabel"]) | undefined;
+  /** Draws no box: no edges, grid, numbers, or names, so the readings stand
+alone and fill the plot, as a picture on a product's own page does. The
+table, the summary, the tooltip, and the keys still carry every value,
+and a renderer draws no box either. */
+  "bool:no-box"?: (HelixSpatialBarChart["noBox"]) | undefined;
+  /** Draws no box: no edges, grid, numbers, or names, so the readings stand
+alone and fill the plot, as a picture on a product's own page does. The
+table, the summary, the tooltip, and the keys still carry every value,
+and a renderer draws no box either. */
+  "prop:noBox"?: (HelixSpatialBarChart["noBox"]) | undefined;
+  /** What the readout says for a place with no value. `{category}` and
+`{series}` name the place. */
+  "attr:open-label"?: (HelixSpatialBarChart["openLabel"]) | undefined;
+  /** What the readout says for a place with no value. `{category}` and
+`{series}` name the place. */
+  "prop:openLabel"?: (HelixSpatialBarChart["openLabel"]) | undefined;
+  /** The plot's name where the chart has none: no `aria-label`, `label`, or table caption. */
+  "attr:plot-label"?: (HelixSpatialBarChart["plotLabel"]) | undefined;
+  /** The plot's name where the chart has none: no `aria-label`, `label`, or table caption. */
+  "prop:plotLabel"?: (HelixSpatialBarChart["plotLabel"]) | undefined;
+  /** The `summary` part's sentence. `{count}`, `{series}`, and `{categories}`
+are the number of bars, series, and categories, written in the locale,
+and `{low}` and `{high}` the lowest and the highest value. */
+  "attr:summary-label"?: (HelixSpatialBarChart["summaryLabel"]) | undefined;
+  /** The `summary` part's sentence. `{count}`, `{series}`, and `{categories}`
+are the number of bars, series, and categories, written in the locale,
+and `{low}` and `{high}` the lowest and the highest value. */
+  "prop:summaryLabel"?: (HelixSpatialBarChart["summaryLabel"]) | undefined;
+  /** The readings as data, in the shape of a table, where the page has no
+table to point `for` at. `for` wins where both are set.
+
+```js
+chart.data = {
+  caption: 'Sessions by channel',
+  columns: ['Month', 'Direct', 'Referral'],
+  rows: [['Jan', 10, 4], ['Feb', 20, 8]],
+}
+```
+
+The first column holds each row's label and every column after it a
+series, as in a table. A cell is a number, words, `null` for a blank,
+or `{ value, text }` for a number shown as words, such as `$128k`. A
+number is shown in `locale`.
+
+**A table is still the better source where the page can show one**:
+it reads with no script and before hydration, and a reader can sort and
+copy it. Data is drawn on the client only, so a server serves the
+frame, and the summary, the keys and the readout are then the whole of
+what a screen reader is given. Set a new object to redraw: the chart
+does not look inside the one it has. */
+  "prop:data"?: (HelixSpatialBarChart["data"]) | undefined;
+  /** The bars or the bar the keys rest on changed, which the renderer is told. It stays on the chart. */
+  "on:helix-plot-change"?: ((
+    e: HelixSpatialBarChartHelixPlotChangeElementEvent,
+  ) => void) | undefined;
+  /** Shift with an arrow asked the view to turn, by a step across or up. */
+  "on:helix-plot-turn"?: ((
+    e: HelixSpatialBarChartHelixPlotTurnElementEvent,
+  ) => void) | undefined;
+  /** The reading moved, or was put away: `index` is the row, or `-1` for none, with its `label` and the `pointerType` that moved it. */
+  "on:helix-reading-change"?: ((
+    e: HelixSpatialBarChartHelixReadingChangeElementEvent,
+  ) => void) | undefined;
+  /** A bar was clicked or pressed with Enter or Space, with the same detail as `helix-reading-change`. */
+  "on:helix-reading-press"?: ((
+    e: HelixSpatialBarChartHelixReadingPressElementEvent,
+  ) => void) | undefined;
+
+  /** Set the innerHTML of the element */
+  innerHTML?: (string) | undefined;
+  /** Set the textContent of the element */
+  textContent?: (string | number) | undefined;
+};
+
 /** `HelixSpatialHeatmap` component event */
 export type HelixSpatialHeatmapElementEvent<E = Event> = TypedEvent<
   HelixSpatialHeatmap,
@@ -32791,6 +33189,22 @@ export type HelixSpatialHeatmapHelixResizeElementEvent =
   HelixSpatialHeatmapElementEvent<HelixResizeEvent>;
 
 export type HelixSpatialHeatmapProps = {
+  /** How strongly the prisms are drawn, as on every chart.
+
+`outlined` is a prism as its edges in its tone over faces faded toward the
+page, and `subtle` a faint wash of the tone under the same edges, which
+shows the prisms behind it. Absent is the filled prism, per the rule that
+a reflected property takes no default, and `solid` writes it out. A
+renderer draws the prisms the same way.
+
+It composes with `material`: emphasis decides what is drawn, and material
+how much of it comes through. The ring on the prism the keys rest on keeps
+its own ink. */
+  emphasis?: (HelixSpatialHeatmap["emphasis"]) | undefined;
+  /** How much of each mark comes through, as on every chart: `glass` admits the
+most of what is behind it, `frosted` less, and absent is opaque. The
+strength is the theme's, scaled by `--helix-material-opacity`. */
+  material?: (HelixSpatialHeatmap["material"]) | undefined;
   /** Draws every prism at no height, so the tones lie on a plane. */
   flat?: (HelixSpatialHeatmap["flat"]) | undefined;
   /** How tall the highest reading stands, in cells. Every other reading stands
@@ -33032,6 +33446,22 @@ does not look inside the one it has. */
 };
 
 export type HelixSpatialHeatmapSolidJsProps = {
+  /** How strongly the prisms are drawn, as on every chart.
+
+`outlined` is a prism as its edges in its tone over faces faded toward the
+page, and `subtle` a faint wash of the tone under the same edges, which
+shows the prisms behind it. Absent is the filled prism, per the rule that
+a reflected property takes no default, and `solid` writes it out. A
+renderer draws the prisms the same way.
+
+It composes with `material`: emphasis decides what is drawn, and material
+how much of it comes through. The ring on the prism the keys rest on keeps
+its own ink. */
+  "prop:emphasis"?: (HelixSpatialHeatmap["emphasis"]) | undefined;
+  /** How much of each mark comes through, as on every chart: `glass` admits the
+most of what is behind it, `frosted` less, and absent is opaque. The
+strength is the theme's, scaled by `--helix-material-opacity`. */
+  "prop:material"?: (HelixSpatialHeatmap["material"]) | undefined;
   /** Draws every prism at no height, so the tones lie on a plane. */
   "prop:flat"?: (HelixSpatialHeatmap["flat"]) | undefined;
   /** How tall the highest reading stands, in cells. Every other reading stands
@@ -33276,44 +33706,202 @@ does not look inside the one it has. */
   textContent?: (string | number) | undefined;
 };
 
-/** `HelixSpatialScatterChart` component event */
-export type HelixSpatialScatterChartElementEvent<E = Event> = TypedEvent<
-  HelixSpatialScatterChart,
+/** `HelixSpatialRibbonChart` component event */
+export type HelixSpatialRibbonChartElementEvent<E = Event> = TypedEvent<
+  HelixSpatialRibbonChart,
   E
 >;
 /** `helix-plot-change` event type */
-export type HelixSpatialScatterChartHelixPlotChangeElementEvent =
-  HelixSpatialScatterChartElementEvent<HelixPlotChangeEvent>;
+export type HelixSpatialRibbonChartHelixPlotChangeElementEvent =
+  HelixSpatialRibbonChartElementEvent<HelixPlotChangeEvent>;
 /** `helix-plot-turn` event type */
-export type HelixSpatialScatterChartHelixPlotTurnElementEvent =
-  HelixSpatialScatterChartElementEvent<HelixPlotTurnEvent>;
+export type HelixSpatialRibbonChartHelixPlotTurnElementEvent =
+  HelixSpatialRibbonChartElementEvent<HelixPlotTurnEvent>;
 /** `helix-reading-change` event type */
-export type HelixSpatialScatterChartHelixReadingChangeElementEvent =
-  HelixSpatialScatterChartElementEvent<HelixReadingChangeEvent>;
+export type HelixSpatialRibbonChartHelixReadingChangeElementEvent =
+  HelixSpatialRibbonChartElementEvent<HelixReadingChangeEvent>;
 /** `helix-reading-press` event type */
-export type HelixSpatialScatterChartHelixReadingPressElementEvent =
-  HelixSpatialScatterChartElementEvent<HelixReadingPressEvent>;
+export type HelixSpatialRibbonChartHelixReadingPressElementEvent =
+  HelixSpatialRibbonChartElementEvent<HelixReadingPressEvent>;
+
+export type HelixSpatialRibbonChartProps = {
+  /** How strongly the ribbons are drawn, as on every chart.
+
+`outlined` is a ribbon as its edges in its series' color over faces
+faded toward the page, and `subtle` the same edges over a faint wash,
+which shows the ribbons behind it. Absent is the filled ribbon, per the
+rule that a reflected property takes no default, and `solid` writes it
+out. A renderer draws the ribbons the same way.
+
+It composes with `material`: emphasis decides what is drawn, and material
+how much of it comes through. The ring on the reading the keys rest on
+keeps its own ink. */
+  emphasis?: (HelixSpatialRibbonChart["emphasis"]) | undefined;
+  /** How much of each mark comes through, as on every chart: `glass` admits the
+most of what is behind it, `frosted` less, and absent is opaque. The
+strength is the theme's, scaled by `--helix-material-opacity`. */
+  material?: (HelixSpatialRibbonChart["material"]) | undefined;
+  /** The words shown in place of the drawing when the table has no readings,
+and the fallback of the `empty` slot. */
+  "empty-text"?: (HelixSpatialRibbonChart["emptyText"]) | undefined;
+  /** The words shown in place of the drawing when the table has no readings,
+and the fallback of the `empty` slot. */
+  emptyText?: (HelixSpatialRibbonChart["emptyText"]) | undefined;
+  /** Whether the readings are still on their way. The chart shows
+`loading-text` in place of an empty drawing until it has readings.
 
-export type HelixSpatialScatterChartProps = {
+Reflected, so a stylesheet can treat the chart while it waits. A chart
+that already has readings keeps drawing them, so a refresh does not
+blank it. */
+  loading?: (HelixSpatialRibbonChart["loading"]) | undefined;
+  /** The words shown in place of the drawing while `loading` is set and
+there are no readings yet, and the fallback of the `loading` slot. */
+  "loading-text"?: (HelixSpatialRibbonChart["loadingText"]) | undefined;
+  /** The words shown in place of the drawing while `loading` is set and
+there are no readings yet, and the fallback of the `loading` slot. */
+  loadingText?: (HelixSpatialRibbonChart["loadingText"]) | undefined;
+  /** The id of the table to read.
+
+Names a table in the same tree, so a chart inside another component's
+shadow root reads a table in that root rather than one in the document. A
+`<table>` or anything built from grid roles, including `helix-table`.
+
+**In React this arrives as a property and not as an attribute**, the way
+`Tooltip.for` does, so it does not reflect and nothing styles on it. */
+  for?: (HelixSpatialRibbonChart["for"]) | undefined;
+  /** The chart's name, which starts the chart's text summary.
+
+Absent falls back to the table's own caption, which is usually the right
+words and is already written. */
+  label?: (HelixSpatialRibbonChart["label"]) | undefined;
+  /** The locale the chart's own numbers are written in: its axis, its
+percentages and its totals, such as `de` for `1.240` and `32 %`.
+
+Absent reads the nearest `lang`, then the runtime's own. The table's
+cells are shown as the table writes them, whatever this says. */
+  locale?: (HelixSpatialRibbonChart["locale"]) | undefined;
+  /** Where a reading the keys moved to stands among the readings, said after
+it. `{position}` and `{count}` are replaced with the numbers, written in
+`locale`.
+
+Set it to the words of the page's language, such as `{position} von
+{count}`, or to nothing to say no position. A slice or a series a
+legend hid is not counted. */
+  "position-label"?: (HelixSpatialRibbonChart["positionLabel"]) | undefined;
+  /** Where a reading the keys moved to stands among the readings, said after
+it. `{position}` and `{count}` are replaced with the numbers, written in
+`locale`.
+
+Set it to the words of the page's language, such as `{position} von
+{count}`, or to nothing to say no position. A slice or a series a
+legend hid is not counted. */
+  positionLabel?: (HelixSpatialRibbonChart["positionLabel"]) | undefined;
+  /** Draws no box: no edges, grid, numbers, or names, so the readings stand
+alone and fill the plot, as a picture on a product's own page does. The
+table, the summary, the tooltip, and the keys still carry every value,
+and a renderer draws no box either. */
+  "no-box"?: (HelixSpatialRibbonChart["noBox"]) | undefined;
+  /** Draws no box: no edges, grid, numbers, or names, so the readings stand
+alone and fill the plot, as a picture on a product's own page does. The
+table, the summary, the tooltip, and the keys still carry every value,
+and a renderer draws no box either. */
+  noBox?: (HelixSpatialRibbonChart["noBox"]) | undefined;
+  /** What the readout says for a reading the table has no value for.
+`{place}` and `{series}` name it. */
+  "open-label"?: (HelixSpatialRibbonChart["openLabel"]) | undefined;
+  /** What the readout says for a reading the table has no value for.
+`{place}` and `{series}` name it. */
+  openLabel?: (HelixSpatialRibbonChart["openLabel"]) | undefined;
+  /** The plot's name where the chart has none: no `aria-label`, `label`, or table caption. */
+  "plot-label"?: (HelixSpatialRibbonChart["plotLabel"]) | undefined;
+  /** The plot's name where the chart has none: no `aria-label`, `label`, or table caption. */
+  plotLabel?: (HelixSpatialRibbonChart["plotLabel"]) | undefined;
+  /** The `summary` part's sentence. `{count}`, `{series}`, and `{places}` are
+the number of readings, series, and places, written in the locale,
+and `{low}` and `{high}` the lowest and the highest value. */
+  "summary-label"?: (HelixSpatialRibbonChart["summaryLabel"]) | undefined;
+  /** The `summary` part's sentence. `{count}`, `{series}`, and `{places}` are
+the number of readings, series, and places, written in the locale,
+and `{low}` and `{high}` the lowest and the highest value. */
+  summaryLabel?: (HelixSpatialRibbonChart["summaryLabel"]) | undefined;
+  /** The readings as data, in the shape of a table, where the page has no
+table to point `for` at. `for` wins where both are set.
+
+```js
+chart.data = {
+  caption: 'Sessions by channel',
+  columns: ['Month', 'Direct', 'Referral'],
+  rows: [['Jan', 10, 4], ['Feb', 20, 8]],
+}
+```
+
+The first column holds each row's label and every column after it a
+series, as in a table. A cell is a number, words, `null` for a blank,
+or `{ value, text }` for a number shown as words, such as `$128k`. A
+number is shown in `locale`.
+
+**A table is still the better source where the page can show one**:
+it reads with no script and before hydration, and a reader can sort and
+copy it. Data is drawn on the client only, so a server serves the
+frame, and the summary, the keys and the readout are then the whole of
+what a screen reader is given. Set a new object to redraw: the chart
+does not look inside the one it has. */
+  data?: (HelixSpatialRibbonChart["data"]) | undefined;
+
+  /** The readings or the reading the keys rest on changed, which the renderer is told. It stays on the chart. */
+  "onhelix-plot-change"?: ((
+    e: HelixSpatialRibbonChartHelixPlotChangeElementEvent,
+  ) => void) | undefined;
+  /** Shift with an arrow asked the view to turn, by a step across or up. */
+  "onhelix-plot-turn"?: ((
+    e: HelixSpatialRibbonChartHelixPlotTurnElementEvent,
+  ) => void) | undefined;
+  /** The reading moved, or was put away: `index` is the row, or `-1` for none, with its `label` and the `pointerType` that moved it. */
+  "onhelix-reading-change"?: ((
+    e: HelixSpatialRibbonChartHelixReadingChangeElementEvent,
+  ) => void) | undefined;
+  /** A reading was clicked or pressed with Enter or Space, with the same detail as `helix-reading-change`. */
+  "onhelix-reading-press"?: ((
+    e: HelixSpatialRibbonChartHelixReadingPressElementEvent,
+  ) => void) | undefined;
+};
+
+export type HelixSpatialRibbonChartSolidJsProps = {
+  /** How strongly the ribbons are drawn, as on every chart.
+
+`outlined` is a ribbon as its edges in its series' color over faces
+faded toward the page, and `subtle` the same edges over a faint wash,
+which shows the ribbons behind it. Absent is the filled ribbon, per the
+rule that a reflected property takes no default, and `solid` writes it
+out. A renderer draws the ribbons the same way.
+
+It composes with `material`: emphasis decides what is drawn, and material
+how much of it comes through. The ring on the reading the keys rest on
+keeps its own ink. */
+  "prop:emphasis"?: (HelixSpatialRibbonChart["emphasis"]) | undefined;
+  /** How much of each mark comes through, as on every chart: `glass` admits the
+most of what is behind it, `frosted` less, and absent is opaque. The
+strength is the theme's, scaled by `--helix-material-opacity`. */
+  "prop:material"?: (HelixSpatialRibbonChart["material"]) | undefined;
   /** The words shown in place of the drawing when the table has no readings,
 and the fallback of the `empty` slot. */
-  "empty-text"?: (HelixSpatialScatterChart["emptyText"]) | undefined;
+  "attr:empty-text"?: (HelixSpatialRibbonChart["emptyText"]) | undefined;
   /** The words shown in place of the drawing when the table has no readings,
 and the fallback of the `empty` slot. */
-  emptyText?: (HelixSpatialScatterChart["emptyText"]) | undefined;
+  "prop:emptyText"?: (HelixSpatialRibbonChart["emptyText"]) | undefined;
   /** Whether the readings are still on their way. The chart shows
 `loading-text` in place of an empty drawing until it has readings.
 
 Reflected, so a stylesheet can treat the chart while it waits. A chart
 that already has readings keeps drawing them, so a refresh does not
 blank it. */
-  loading?: (HelixSpatialScatterChart["loading"]) | undefined;
+  "prop:loading"?: (HelixSpatialRibbonChart["loading"]) | undefined;
   /** The words shown in place of the drawing while `loading` is set and
 there are no readings yet, and the fallback of the `loading` slot. */
-  "loading-text"?: (HelixSpatialScatterChart["loadingText"]) | undefined;
+  "attr:loading-text"?: (HelixSpatialRibbonChart["loadingText"]) | undefined;
   /** The words shown in place of the drawing while `loading` is set and
 there are no readings yet, and the fallback of the `loading` slot. */
-  loadingText?: (HelixSpatialScatterChart["loadingText"]) | undefined;
+  "prop:loadingText"?: (HelixSpatialRibbonChart["loadingText"]) | undefined;
   /** The id of the table to read.
 
 Names a table in the same tree, so a chart inside another component's
@@ -33322,18 +33910,18 @@ shadow root reads a table in that root rather than one in the document. A
 
 **In React this arrives as a property and not as an attribute**, the way
 `Tooltip.for` does, so it does not reflect and nothing styles on it. */
-  for?: (HelixSpatialScatterChart["for"]) | undefined;
+  "prop:for"?: (HelixSpatialRibbonChart["for"]) | undefined;
   /** The chart's name, which starts the chart's text summary.
 
 Absent falls back to the table's own caption, which is usually the right
 words and is already written. */
-  label?: (HelixSpatialScatterChart["label"]) | undefined;
+  "prop:label"?: (HelixSpatialRibbonChart["label"]) | undefined;
   /** The locale the chart's own numbers are written in: its axis, its
 percentages and its totals, such as `de` for `1.240` and `32 %`.
 
 Absent reads the nearest `lang`, then the runtime's own. The table's
 cells are shown as the table writes them, whatever this says. */
-  locale?: (HelixSpatialScatterChart["locale"]) | undefined;
+  "prop:locale"?: (HelixSpatialRibbonChart["locale"]) | undefined;
   /** Where a reading the keys moved to stands among the readings, said after
 it. `{position}` and `{count}` are replaced with the numbers, written in
 `locale`.
@@ -33341,7 +33929,7 @@ it. `{position}` and `{count}` are replaced with the numbers, written in
 Set it to the words of the page's language, such as `{position} von
 {count}`, or to nothing to say no position. A slice or a series a
 legend hid is not counted. */
-  "position-label"?: (HelixSpatialScatterChart["positionLabel"]) | undefined;
+  "attr:position-label"?: (HelixSpatialRibbonChart["positionLabel"]) | undefined;
   /** Where a reading the keys moved to stands among the readings, said after
 it. `{position}` and `{count}` are replaced with the numbers, written in
 `locale`.
@@ -33349,21 +33937,202 @@ it. `{position}` and `{count}` are replaced with the numbers, written in
 Set it to the words of the page's language, such as `{position} von
 {count}`, or to nothing to say no position. A slice or a series a
 legend hid is not counted. */
-  positionLabel?: (HelixSpatialScatterChart["positionLabel"]) | undefined;
-  /** The column of text that puts each point in a group, by its heading. None by default. */
-  "group-by"?: (HelixSpatialScatterChart["groupBy"]) | undefined;
-  /** The column of text that puts each point in a group, by its heading. None by default. */
-  groupBy?: (HelixSpatialScatterChart["groupBy"]) | undefined;
+  "prop:positionLabel"?: (HelixSpatialRibbonChart["positionLabel"]) | undefined;
+  /** Draws no box: no edges, grid, numbers, or names, so the readings stand
+alone and fill the plot, as a picture on a product's own page does. The
+table, the summary, the tooltip, and the keys still carry every value,
+and a renderer draws no box either. */
+  "bool:no-box"?: (HelixSpatialRibbonChart["noBox"]) | undefined;
+  /** Draws no box: no edges, grid, numbers, or names, so the readings stand
+alone and fill the plot, as a picture on a product's own page does. The
+table, the summary, the tooltip, and the keys still carry every value,
+and a renderer draws no box either. */
+  "prop:noBox"?: (HelixSpatialRibbonChart["noBox"]) | undefined;
+  /** What the readout says for a reading the table has no value for.
+`{place}` and `{series}` name it. */
+  "attr:open-label"?: (HelixSpatialRibbonChart["openLabel"]) | undefined;
+  /** What the readout says for a reading the table has no value for.
+`{place}` and `{series}` name it. */
+  "prop:openLabel"?: (HelixSpatialRibbonChart["openLabel"]) | undefined;
   /** The plot's name where the chart has none: no `aria-label`, `label`, or table caption. */
-  "plot-label"?: (HelixSpatialScatterChart["plotLabel"]) | undefined;
+  "attr:plot-label"?: (HelixSpatialRibbonChart["plotLabel"]) | undefined;
   /** The plot's name where the chart has none: no `aria-label`, `label`, or table caption. */
-  plotLabel?: (HelixSpatialScatterChart["plotLabel"]) | undefined;
-  /** The `summary` part's sentence. `{count}` is the number of points, written
-in the locale, and `{x}`, `{y}`, and `{z}` are the three measures' names. */
-  "summary-label"?: (HelixSpatialScatterChart["summaryLabel"]) | undefined;
-  /** The `summary` part's sentence. `{count}` is the number of points, written
-in the locale, and `{x}`, `{y}`, and `{z}` are the three measures' names. */
-  summaryLabel?: (HelixSpatialScatterChart["summaryLabel"]) | undefined;
+  "prop:plotLabel"?: (HelixSpatialRibbonChart["plotLabel"]) | undefined;
+  /** The `summary` part's sentence. `{count}`, `{series}`, and `{places}` are
+the number of readings, series, and places, written in the locale,
+and `{low}` and `{high}` the lowest and the highest value. */
+  "attr:summary-label"?: (HelixSpatialRibbonChart["summaryLabel"]) | undefined;
+  /** The `summary` part's sentence. `{count}`, `{series}`, and `{places}` are
+the number of readings, series, and places, written in the locale,
+and `{low}` and `{high}` the lowest and the highest value. */
+  "prop:summaryLabel"?: (HelixSpatialRibbonChart["summaryLabel"]) | undefined;
+  /** The readings as data, in the shape of a table, where the page has no
+table to point `for` at. `for` wins where both are set.
+
+```js
+chart.data = {
+  caption: 'Sessions by channel',
+  columns: ['Month', 'Direct', 'Referral'],
+  rows: [['Jan', 10, 4], ['Feb', 20, 8]],
+}
+```
+
+The first column holds each row's label and every column after it a
+series, as in a table. A cell is a number, words, `null` for a blank,
+or `{ value, text }` for a number shown as words, such as `$128k`. A
+number is shown in `locale`.
+
+**A table is still the better source where the page can show one**:
+it reads with no script and before hydration, and a reader can sort and
+copy it. Data is drawn on the client only, so a server serves the
+frame, and the summary, the keys and the readout are then the whole of
+what a screen reader is given. Set a new object to redraw: the chart
+does not look inside the one it has. */
+  "prop:data"?: (HelixSpatialRibbonChart["data"]) | undefined;
+  /** The readings or the reading the keys rest on changed, which the renderer is told. It stays on the chart. */
+  "on:helix-plot-change"?: ((
+    e: HelixSpatialRibbonChartHelixPlotChangeElementEvent,
+  ) => void) | undefined;
+  /** Shift with an arrow asked the view to turn, by a step across or up. */
+  "on:helix-plot-turn"?: ((
+    e: HelixSpatialRibbonChartHelixPlotTurnElementEvent,
+  ) => void) | undefined;
+  /** The reading moved, or was put away: `index` is the row, or `-1` for none, with its `label` and the `pointerType` that moved it. */
+  "on:helix-reading-change"?: ((
+    e: HelixSpatialRibbonChartHelixReadingChangeElementEvent,
+  ) => void) | undefined;
+  /** A reading was clicked or pressed with Enter or Space, with the same detail as `helix-reading-change`. */
+  "on:helix-reading-press"?: ((
+    e: HelixSpatialRibbonChartHelixReadingPressElementEvent,
+  ) => void) | undefined;
+
+  /** Set the innerHTML of the element */
+  innerHTML?: (string) | undefined;
+  /** Set the textContent of the element */
+  textContent?: (string | number) | undefined;
+};
+
+/** `HelixSpatialScatterChart` component event */
+export type HelixSpatialScatterChartElementEvent<E = Event> = TypedEvent<
+  HelixSpatialScatterChart,
+  E
+>;
+/** `helix-plot-change` event type */
+export type HelixSpatialScatterChartHelixPlotChangeElementEvent =
+  HelixSpatialScatterChartElementEvent<HelixPlotChangeEvent>;
+/** `helix-plot-turn` event type */
+export type HelixSpatialScatterChartHelixPlotTurnElementEvent =
+  HelixSpatialScatterChartElementEvent<HelixPlotTurnEvent>;
+/** `helix-reading-change` event type */
+export type HelixSpatialScatterChartHelixReadingChangeElementEvent =
+  HelixSpatialScatterChartElementEvent<HelixReadingChangeEvent>;
+/** `helix-reading-press` event type */
+export type HelixSpatialScatterChartHelixReadingPressElementEvent =
+  HelixSpatialScatterChartElementEvent<HelixReadingPressEvent>;
+
+export type HelixSpatialScatterChartProps = {
+  /** How strongly the points are drawn, as on every chart.
+
+`outlined` is a point as a ring in its group's color over a dot faded
+toward the page, and `subtle` the same ring over a faint dot. Absent is
+the filled dot, per the rule that a reflected property takes no default,
+and `solid` writes it out. A renderer draws the points the same way.
+
+It composes with `material`: emphasis decides what is drawn, and material
+how much of it comes through. The ring on the point the keys rest on keeps
+its own ink. */
+  emphasis?: (HelixSpatialScatterChart["emphasis"]) | undefined;
+  /** How much of each mark comes through, as on every chart: `glass` admits the
+most of what is behind it, `frosted` less, and absent is opaque. The
+strength is the theme's, scaled by `--helix-material-opacity`. */
+  material?: (HelixSpatialScatterChart["material"]) | undefined;
+  /** The words shown in place of the drawing when the table has no readings,
+and the fallback of the `empty` slot. */
+  "empty-text"?: (HelixSpatialScatterChart["emptyText"]) | undefined;
+  /** The words shown in place of the drawing when the table has no readings,
+and the fallback of the `empty` slot. */
+  emptyText?: (HelixSpatialScatterChart["emptyText"]) | undefined;
+  /** Whether the readings are still on their way. The chart shows
+`loading-text` in place of an empty drawing until it has readings.
+
+Reflected, so a stylesheet can treat the chart while it waits. A chart
+that already has readings keeps drawing them, so a refresh does not
+blank it. */
+  loading?: (HelixSpatialScatterChart["loading"]) | undefined;
+  /** The words shown in place of the drawing while `loading` is set and
+there are no readings yet, and the fallback of the `loading` slot. */
+  "loading-text"?: (HelixSpatialScatterChart["loadingText"]) | undefined;
+  /** The words shown in place of the drawing while `loading` is set and
+there are no readings yet, and the fallback of the `loading` slot. */
+  loadingText?: (HelixSpatialScatterChart["loadingText"]) | undefined;
+  /** The id of the table to read.
+
+Names a table in the same tree, so a chart inside another component's
+shadow root reads a table in that root rather than one in the document. A
+`<table>` or anything built from grid roles, including `helix-table`.
+
+**In React this arrives as a property and not as an attribute**, the way
+`Tooltip.for` does, so it does not reflect and nothing styles on it. */
+  for?: (HelixSpatialScatterChart["for"]) | undefined;
+  /** The chart's name, which starts the chart's text summary.
+
+Absent falls back to the table's own caption, which is usually the right
+words and is already written. */
+  label?: (HelixSpatialScatterChart["label"]) | undefined;
+  /** The locale the chart's own numbers are written in: its axis, its
+percentages and its totals, such as `de` for `1.240` and `32 %`.
+
+Absent reads the nearest `lang`, then the runtime's own. The table's
+cells are shown as the table writes them, whatever this says. */
+  locale?: (HelixSpatialScatterChart["locale"]) | undefined;
+  /** Where a reading the keys moved to stands among the readings, said after
+it. `{position}` and `{count}` are replaced with the numbers, written in
+`locale`.
+
+Set it to the words of the page's language, such as `{position} von
+{count}`, or to nothing to say no position. A slice or a series a
+legend hid is not counted. */
+  "position-label"?: (HelixSpatialScatterChart["positionLabel"]) | undefined;
+  /** Where a reading the keys moved to stands among the readings, said after
+it. `{position}` and `{count}` are replaced with the numbers, written in
+`locale`.
+
+Set it to the words of the page's language, such as `{position} von
+{count}`, or to nothing to say no position. A slice or a series a
+legend hid is not counted. */
+  positionLabel?: (HelixSpatialScatterChart["positionLabel"]) | undefined;
+  /** Draws a line from each point straight down to the floor of the box, in
+its group's color, so where a point stands across and in depth reads off
+the floor's grid. A renderer draws them too. */
+  "drop-lines"?: (HelixSpatialScatterChart["dropLines"]) | undefined;
+  /** Draws a line from each point straight down to the floor of the box, in
+its group's color, so where a point stands across and in depth reads off
+the floor's grid. A renderer draws them too. */
+  dropLines?: (HelixSpatialScatterChart["dropLines"]) | undefined;
+  /** The column of text that puts each point in a group, by its heading. None by default. */
+  "group-by"?: (HelixSpatialScatterChart["groupBy"]) | undefined;
+  /** The column of text that puts each point in a group, by its heading. None by default. */
+  groupBy?: (HelixSpatialScatterChart["groupBy"]) | undefined;
+  /** Draws no box: no edges, grid, numbers, or names, so the readings stand
+alone and fill the plot, as a picture on a product's own page does. The
+table, the summary, the tooltip, and the keys still carry every value,
+and a renderer draws no box either. */
+  "no-box"?: (HelixSpatialScatterChart["noBox"]) | undefined;
+  /** Draws no box: no edges, grid, numbers, or names, so the readings stand
+alone and fill the plot, as a picture on a product's own page does. The
+table, the summary, the tooltip, and the keys still carry every value,
+and a renderer draws no box either. */
+  noBox?: (HelixSpatialScatterChart["noBox"]) | undefined;
+  /** The plot's name where the chart has none: no `aria-label`, `label`, or table caption. */
+  "plot-label"?: (HelixSpatialScatterChart["plotLabel"]) | undefined;
+  /** The plot's name where the chart has none: no `aria-label`, `label`, or table caption. */
+  plotLabel?: (HelixSpatialScatterChart["plotLabel"]) | undefined;
+  /** The `summary` part's sentence. `{count}` is the number of points, written
+in the locale, and `{x}`, `{y}`, and `{z}` are the three measures' names. */
+  "summary-label"?: (HelixSpatialScatterChart["summaryLabel"]) | undefined;
+  /** The `summary` part's sentence. `{count}` is the number of points, written
+in the locale, and `{x}`, `{y}`, and `{z}` are the three measures' names. */
+  summaryLabel?: (HelixSpatialScatterChart["summaryLabel"]) | undefined;
   /** The readings as data, in the shape of a table, where the page has no
 table to point `for` at. `for` wins where both are set.
 
@@ -33407,6 +34176,21 @@ does not look inside the one it has. */
 };
 
 export type HelixSpatialScatterChartSolidJsProps = {
+  /** How strongly the points are drawn, as on every chart.
+
+`outlined` is a point as a ring in its group's color over a dot faded
+toward the page, and `subtle` the same ring over a faint dot. Absent is
+the filled dot, per the rule that a reflected property takes no default,
+and `solid` writes it out. A renderer draws the points the same way.
+
+It composes with `material`: emphasis decides what is drawn, and material
+how much of it comes through. The ring on the point the keys rest on keeps
+its own ink. */
+  "prop:emphasis"?: (HelixSpatialScatterChart["emphasis"]) | undefined;
+  /** How much of each mark comes through, as on every chart: `glass` admits the
+most of what is behind it, `frosted` less, and absent is opaque. The
+strength is the theme's, scaled by `--helix-material-opacity`. */
+  "prop:material"?: (HelixSpatialScatterChart["material"]) | undefined;
   /** The words shown in place of the drawing when the table has no readings,
 and the fallback of the `empty` slot. */
   "attr:empty-text"?: (HelixSpatialScatterChart["emptyText"]) | undefined;
@@ -33462,10 +34246,28 @@ Set it to the words of the page's language, such as `{position} von
 {count}`, or to nothing to say no position. A slice or a series a
 legend hid is not counted. */
   "prop:positionLabel"?: (HelixSpatialScatterChart["positionLabel"]) | undefined;
+  /** Draws a line from each point straight down to the floor of the box, in
+its group's color, so where a point stands across and in depth reads off
+the floor's grid. A renderer draws them too. */
+  "bool:drop-lines"?: (HelixSpatialScatterChart["dropLines"]) | undefined;
+  /** Draws a line from each point straight down to the floor of the box, in
+its group's color, so where a point stands across and in depth reads off
+the floor's grid. A renderer draws them too. */
+  "prop:dropLines"?: (HelixSpatialScatterChart["dropLines"]) | undefined;
   /** The column of text that puts each point in a group, by its heading. None by default. */
   "attr:group-by"?: (HelixSpatialScatterChart["groupBy"]) | undefined;
   /** The column of text that puts each point in a group, by its heading. None by default. */
   "prop:groupBy"?: (HelixSpatialScatterChart["groupBy"]) | undefined;
+  /** Draws no box: no edges, grid, numbers, or names, so the readings stand
+alone and fill the plot, as a picture on a product's own page does. The
+table, the summary, the tooltip, and the keys still carry every value,
+and a renderer draws no box either. */
+  "bool:no-box"?: (HelixSpatialScatterChart["noBox"]) | undefined;
+  /** Draws no box: no edges, grid, numbers, or names, so the readings stand
+alone and fill the plot, as a picture on a product's own page does. The
+table, the summary, the tooltip, and the keys still carry every value,
+and a renderer draws no box either. */
+  "prop:noBox"?: (HelixSpatialScatterChart["noBox"]) | undefined;
   /** The plot's name where the chart has none: no `aria-label`, `label`, or table caption. */
   "attr:plot-label"?: (HelixSpatialScatterChart["plotLabel"]) | undefined;
   /** The plot's name where the chart has none: no `aria-label`, `label`, or table caption. */
@@ -33541,6 +34343,23 @@ export type HelixSpatialSurfaceChartHelixReadingPressElementEvent =
   HelixSpatialSurfaceChartElementEvent<HelixReadingPressEvent>;
 
 export type HelixSpatialSurfaceChartProps = {
+  /** How strongly the surface is drawn, as on every chart.
+
+`outlined` is a wireframe in the ramp's colors over a surface faded toward
+the page, and `subtle` the same wireframe over a faint surface that the
+grid behind shows through, so a reading the surface hid from this side can
+be seen. Absent is the filled surface, per the rule that a reflected
+property takes no default, and `solid` writes it out. A renderer draws the
+surface the same way.
+
+It composes with `material`: emphasis decides what is drawn, and material
+how much of it comes through. The ring on the reading the keys rest on
+keeps its own ink. */
+  emphasis?: (HelixSpatialSurfaceChart["emphasis"]) | undefined;
+  /** How much of each mark comes through, as on every chart: `glass` admits the
+most of what is behind it, `frosted` less, and absent is opaque. The
+strength is the theme's, scaled by `--helix-material-opacity`. */
+  material?: (HelixSpatialSurfaceChart["material"]) | undefined;
   /** The words shown in place of the drawing when the table has no readings,
 and the fallback of the `empty` slot. */
   "empty-text"?: (HelixSpatialSurfaceChart["emptyText"]) | undefined;
@@ -33596,6 +34415,20 @@ Set it to the words of the page's language, such as `{position} von
 {count}`, or to nothing to say no position. A slice or a series a
 legend hid is not counted. */
   positionLabel?: (HelixSpatialSurfaceChart["positionLabel"]) | undefined;
+  /** Draws the surface's contour lines on it, at each tick of its height, in
+the ramp's colors, so its shape reads as on a map and two places at the
+same height read as such. A renderer draws them too. */
+  contours?: (HelixSpatialSurfaceChart["contours"]) | undefined;
+  /** Draws no box: no edges, grid, numbers, or names, so the readings stand
+alone and fill the plot, as a picture on a product's own page does. The
+table, the summary, the tooltip, and the keys still carry every value,
+and a renderer draws no box either. */
+  "no-box"?: (HelixSpatialSurfaceChart["noBox"]) | undefined;
+  /** Draws no box: no edges, grid, numbers, or names, so the readings stand
+alone and fill the plot, as a picture on a product's own page does. The
+table, the summary, the tooltip, and the keys still carry every value,
+and a renderer draws no box either. */
+  noBox?: (HelixSpatialSurfaceChart["noBox"]) | undefined;
   /** What the readout says for a place with no reading. `{x}` and `{z}` are
 the place's numbers across and in depth, and `{across}` and `{depth}`
 the two measures' names. */
@@ -33661,6 +34494,23 @@ does not look inside the one it has. */
 };
 
 export type HelixSpatialSurfaceChartSolidJsProps = {
+  /** How strongly the surface is drawn, as on every chart.
+
+`outlined` is a wireframe in the ramp's colors over a surface faded toward
+the page, and `subtle` the same wireframe over a faint surface that the
+grid behind shows through, so a reading the surface hid from this side can
+be seen. Absent is the filled surface, per the rule that a reflected
+property takes no default, and `solid` writes it out. A renderer draws the
+surface the same way.
+
+It composes with `material`: emphasis decides what is drawn, and material
+how much of it comes through. The ring on the reading the keys rest on
+keeps its own ink. */
+  "prop:emphasis"?: (HelixSpatialSurfaceChart["emphasis"]) | undefined;
+  /** How much of each mark comes through, as on every chart: `glass` admits the
+most of what is behind it, `frosted` less, and absent is opaque. The
+strength is the theme's, scaled by `--helix-material-opacity`. */
+  "prop:material"?: (HelixSpatialSurfaceChart["material"]) | undefined;
   /** The words shown in place of the drawing when the table has no readings,
 and the fallback of the `empty` slot. */
   "attr:empty-text"?: (HelixSpatialSurfaceChart["emptyText"]) | undefined;
@@ -33716,6 +34566,20 @@ Set it to the words of the page's language, such as `{position} von
 {count}`, or to nothing to say no position. A slice or a series a
 legend hid is not counted. */
   "prop:positionLabel"?: (HelixSpatialSurfaceChart["positionLabel"]) | undefined;
+  /** Draws the surface's contour lines on it, at each tick of its height, in
+the ramp's colors, so its shape reads as on a map and two places at the
+same height read as such. A renderer draws them too. */
+  "prop:contours"?: (HelixSpatialSurfaceChart["contours"]) | undefined;
+  /** Draws no box: no edges, grid, numbers, or names, so the readings stand
+alone and fill the plot, as a picture on a product's own page does. The
+table, the summary, the tooltip, and the keys still carry every value,
+and a renderer draws no box either. */
+  "bool:no-box"?: (HelixSpatialSurfaceChart["noBox"]) | undefined;
+  /** Draws no box: no edges, grid, numbers, or names, so the readings stand
+alone and fill the plot, as a picture on a product's own page does. The
+table, the summary, the tooltip, and the keys still carry every value,
+and a renderer draws no box either. */
+  "prop:noBox"?: (HelixSpatialSurfaceChart["noBox"]) | undefined;
   /** What the readout says for a place with no reading. `{x}` and `{z}` are
 the place's numbers across and in depth, and `{across}` and `{depth}`
 the two measures' names. */
@@ -33784,6 +34648,308 @@ does not look inside the one it has. */
   textContent?: (string | number) | undefined;
 };
 
+/** `HelixSpatialTreemap` component event */
+export type HelixSpatialTreemapElementEvent<E = Event> = TypedEvent<
+  HelixSpatialTreemap,
+  E
+>;
+/** `helix-plot-change` event type */
+export type HelixSpatialTreemapHelixPlotChangeElementEvent =
+  HelixSpatialTreemapElementEvent<HelixPlotChangeEvent>;
+/** `helix-plot-turn` event type */
+export type HelixSpatialTreemapHelixPlotTurnElementEvent =
+  HelixSpatialTreemapElementEvent<HelixPlotTurnEvent>;
+/** `helix-reading-change` event type */
+export type HelixSpatialTreemapHelixReadingChangeElementEvent =
+  HelixSpatialTreemapElementEvent<HelixReadingChangeEvent>;
+/** `helix-reading-press` event type */
+export type HelixSpatialTreemapHelixReadingPressElementEvent =
+  HelixSpatialTreemapElementEvent<HelixReadingPressEvent>;
+
+export type HelixSpatialTreemapProps = {
+  /** How strongly the blocks are drawn, as on every chart.
+
+`outlined` is a block as its edges in its group's color over faces faded
+toward the page, and `subtle` the same edges over a faint wash, which
+shows the blocks behind it. Absent is the filled block, per the rule that a
+reflected property takes no default, and `solid` writes it out. A
+renderer draws the blocks the same way.
+
+It composes with `material`: emphasis decides what is drawn, and material
+how much of it comes through. The outline on the block the keys rest on
+keeps its own ink. */
+  emphasis?: (HelixSpatialTreemap["emphasis"]) | undefined;
+  /** How much of each mark comes through, as on every chart: `glass` admits the
+most of what is behind it, `frosted` less, and absent is opaque. The
+strength is the theme's, scaled by `--helix-material-opacity`. */
+  material?: (HelixSpatialTreemap["material"]) | undefined;
+  /** The words shown in place of the drawing when the table has no readings,
+and the fallback of the `empty` slot. */
+  "empty-text"?: (HelixSpatialTreemap["emptyText"]) | undefined;
+  /** The words shown in place of the drawing when the table has no readings,
+and the fallback of the `empty` slot. */
+  emptyText?: (HelixSpatialTreemap["emptyText"]) | undefined;
+  /** Whether the readings are still on their way. The chart shows
+`loading-text` in place of an empty drawing until it has readings.
+
+Reflected, so a stylesheet can treat the chart while it waits. A chart
+that already has readings keeps drawing them, so a refresh does not
+blank it. */
+  loading?: (HelixSpatialTreemap["loading"]) | undefined;
+  /** The words shown in place of the drawing while `loading` is set and
+there are no readings yet, and the fallback of the `loading` slot. */
+  "loading-text"?: (HelixSpatialTreemap["loadingText"]) | undefined;
+  /** The words shown in place of the drawing while `loading` is set and
+there are no readings yet, and the fallback of the `loading` slot. */
+  loadingText?: (HelixSpatialTreemap["loadingText"]) | undefined;
+  /** The id of the table to read.
+
+Names a table in the same tree, so a chart inside another component's
+shadow root reads a table in that root rather than one in the document. A
+`<table>` or anything built from grid roles, including `helix-table`.
+
+**In React this arrives as a property and not as an attribute**, the way
+`Tooltip.for` does, so it does not reflect and nothing styles on it. */
+  for?: (HelixSpatialTreemap["for"]) | undefined;
+  /** The chart's name, which starts the chart's text summary.
+
+Absent falls back to the table's own caption, which is usually the right
+words and is already written. */
+  label?: (HelixSpatialTreemap["label"]) | undefined;
+  /** The locale the chart's own numbers are written in: its axis, its
+percentages and its totals, such as `de` for `1.240` and `32 %`.
+
+Absent reads the nearest `lang`, then the runtime's own. The table's
+cells are shown as the table writes them, whatever this says. */
+  locale?: (HelixSpatialTreemap["locale"]) | undefined;
+  /** Where a reading the keys moved to stands among the readings, said after
+it. `{position}` and `{count}` are replaced with the numbers, written in
+`locale`.
+
+Set it to the words of the page's language, such as `{position} von
+{count}`, or to nothing to say no position. A slice or a series a
+legend hid is not counted. */
+  "position-label"?: (HelixSpatialTreemap["positionLabel"]) | undefined;
+  /** Where a reading the keys moved to stands among the readings, said after
+it. `{position}` and `{count}` are replaced with the numbers, written in
+`locale`.
+
+Set it to the words of the page's language, such as `{position} von
+{count}`, or to nothing to say no position. A slice or a series a
+legend hid is not counted. */
+  positionLabel?: (HelixSpatialTreemap["positionLabel"]) | undefined;
+  /** The column of text that gathers the rows into groups, by its heading. None by default. */
+  "group-by"?: (HelixSpatialTreemap["groupBy"]) | undefined;
+  /** The column of text that gathers the rows into groups, by its heading. None by default. */
+  groupBy?: (HelixSpatialTreemap["groupBy"]) | undefined;
+  /** Draws no box: no edges, grid, numbers, or names, so the readings stand
+alone and fill the plot, as a picture on a product's own page does. The
+table, the summary, the tooltip, and the keys still carry every value,
+and a renderer draws no box either. */
+  "no-box"?: (HelixSpatialTreemap["noBox"]) | undefined;
+  /** Draws no box: no edges, grid, numbers, or names, so the readings stand
+alone and fill the plot, as a picture on a product's own page does. The
+table, the summary, the tooltip, and the keys still carry every value,
+and a renderer draws no box either. */
+  noBox?: (HelixSpatialTreemap["noBox"]) | undefined;
+  /** The plot's name where the chart has none: no `aria-label`, `label`, or table caption. */
+  "plot-label"?: (HelixSpatialTreemap["plotLabel"]) | undefined;
+  /** The plot's name where the chart has none: no `aria-label`, `label`, or table caption. */
+  plotLabel?: (HelixSpatialTreemap["plotLabel"]) | undefined;
+  /** The `summary` part's sentence. `{count}` and `{groups}` are the number
+of items and groups, written in the locale, and `{low}` and `{high}` the
+smallest and the largest size. */
+  "summary-label"?: (HelixSpatialTreemap["summaryLabel"]) | undefined;
+  /** The `summary` part's sentence. `{count}` and `{groups}` are the number
+of items and groups, written in the locale, and `{low}` and `{high}` the
+smallest and the largest size. */
+  summaryLabel?: (HelixSpatialTreemap["summaryLabel"]) | undefined;
+  /** The readings as data, in the shape of a table, where the page has no
+table to point `for` at. `for` wins where both are set.
+
+```js
+chart.data = {
+  caption: 'Sessions by channel',
+  columns: ['Month', 'Direct', 'Referral'],
+  rows: [['Jan', 10, 4], ['Feb', 20, 8]],
+}
+```
+
+The first column holds each row's label and every column after it a
+series, as in a table. A cell is a number, words, `null` for a blank,
+or `{ value, text }` for a number shown as words, such as `$128k`. A
+number is shown in `locale`.
+
+**A table is still the better source where the page can show one**:
+it reads with no script and before hydration, and a reader can sort and
+copy it. Data is drawn on the client only, so a server serves the
+frame, and the summary, the keys and the readout are then the whole of
+what a screen reader is given. Set a new object to redraw: the chart
+does not look inside the one it has. */
+  data?: (HelixSpatialTreemap["data"]) | undefined;
+
+  /** The blocks or the block the keys rest on changed, which the renderer is told. It stays on the chart. */
+  "onhelix-plot-change"?: ((
+    e: HelixSpatialTreemapHelixPlotChangeElementEvent,
+  ) => void) | undefined;
+  /** Shift with an arrow asked the view to turn, by a step across or up. */
+  "onhelix-plot-turn"?: ((
+    e: HelixSpatialTreemapHelixPlotTurnElementEvent,
+  ) => void) | undefined;
+  /** The reading moved, or was put away: `index` is the row, or `-1` for none, with its `label` and the `pointerType` that moved it. */
+  "onhelix-reading-change"?: ((
+    e: HelixSpatialTreemapHelixReadingChangeElementEvent,
+  ) => void) | undefined;
+  /** A block was clicked or pressed with Enter or Space, with the same detail as `helix-reading-change`. */
+  "onhelix-reading-press"?: ((
+    e: HelixSpatialTreemapHelixReadingPressElementEvent,
+  ) => void) | undefined;
+};
+
+export type HelixSpatialTreemapSolidJsProps = {
+  /** How strongly the blocks are drawn, as on every chart.
+
+`outlined` is a block as its edges in its group's color over faces faded
+toward the page, and `subtle` the same edges over a faint wash, which
+shows the blocks behind it. Absent is the filled block, per the rule that a
+reflected property takes no default, and `solid` writes it out. A
+renderer draws the blocks the same way.
+
+It composes with `material`: emphasis decides what is drawn, and material
+how much of it comes through. The outline on the block the keys rest on
+keeps its own ink. */
+  "prop:emphasis"?: (HelixSpatialTreemap["emphasis"]) | undefined;
+  /** How much of each mark comes through, as on every chart: `glass` admits the
+most of what is behind it, `frosted` less, and absent is opaque. The
+strength is the theme's, scaled by `--helix-material-opacity`. */
+  "prop:material"?: (HelixSpatialTreemap["material"]) | undefined;
+  /** The words shown in place of the drawing when the table has no readings,
+and the fallback of the `empty` slot. */
+  "attr:empty-text"?: (HelixSpatialTreemap["emptyText"]) | undefined;
+  /** The words shown in place of the drawing when the table has no readings,
+and the fallback of the `empty` slot. */
+  "prop:emptyText"?: (HelixSpatialTreemap["emptyText"]) | undefined;
+  /** Whether the readings are still on their way. The chart shows
+`loading-text` in place of an empty drawing until it has readings.
+
+Reflected, so a stylesheet can treat the chart while it waits. A chart
+that already has readings keeps drawing them, so a refresh does not
+blank it. */
+  "prop:loading"?: (HelixSpatialTreemap["loading"]) | undefined;
+  /** The words shown in place of the drawing while `loading` is set and
+there are no readings yet, and the fallback of the `loading` slot. */
+  "attr:loading-text"?: (HelixSpatialTreemap["loadingText"]) | undefined;
+  /** The words shown in place of the drawing while `loading` is set and
+there are no readings yet, and the fallback of the `loading` slot. */
+  "prop:loadingText"?: (HelixSpatialTreemap["loadingText"]) | undefined;
+  /** The id of the table to read.
+
+Names a table in the same tree, so a chart inside another component's
+shadow root reads a table in that root rather than one in the document. A
+`<table>` or anything built from grid roles, including `helix-table`.
+
+**In React this arrives as a property and not as an attribute**, the way
+`Tooltip.for` does, so it does not reflect and nothing styles on it. */
+  "prop:for"?: (HelixSpatialTreemap["for"]) | undefined;
+  /** The chart's name, which starts the chart's text summary.
+
+Absent falls back to the table's own caption, which is usually the right
+words and is already written. */
+  "prop:label"?: (HelixSpatialTreemap["label"]) | undefined;
+  /** The locale the chart's own numbers are written in: its axis, its
+percentages and its totals, such as `de` for `1.240` and `32 %`.
+
+Absent reads the nearest `lang`, then the runtime's own. The table's
+cells are shown as the table writes them, whatever this says. */
+  "prop:locale"?: (HelixSpatialTreemap["locale"]) | undefined;
+  /** Where a reading the keys moved to stands among the readings, said after
+it. `{position}` and `{count}` are replaced with the numbers, written in
+`locale`.
+
+Set it to the words of the page's language, such as `{position} von
+{count}`, or to nothing to say no position. A slice or a series a
+legend hid is not counted. */
+  "attr:position-label"?: (HelixSpatialTreemap["positionLabel"]) | undefined;
+  /** Where a reading the keys moved to stands among the readings, said after
+it. `{position}` and `{count}` are replaced with the numbers, written in
+`locale`.
+
+Set it to the words of the page's language, such as `{position} von
+{count}`, or to nothing to say no position. A slice or a series a
+legend hid is not counted. */
+  "prop:positionLabel"?: (HelixSpatialTreemap["positionLabel"]) | undefined;
+  /** The column of text that gathers the rows into groups, by its heading. None by default. */
+  "attr:group-by"?: (HelixSpatialTreemap["groupBy"]) | undefined;
+  /** The column of text that gathers the rows into groups, by its heading. None by default. */
+  "prop:groupBy"?: (HelixSpatialTreemap["groupBy"]) | undefined;
+  /** Draws no box: no edges, grid, numbers, or names, so the readings stand
+alone and fill the plot, as a picture on a product's own page does. The
+table, the summary, the tooltip, and the keys still carry every value,
+and a renderer draws no box either. */
+  "bool:no-box"?: (HelixSpatialTreemap["noBox"]) | undefined;
+  /** Draws no box: no edges, grid, numbers, or names, so the readings stand
+alone and fill the plot, as a picture on a product's own page does. The
+table, the summary, the tooltip, and the keys still carry every value,
+and a renderer draws no box either. */
+  "prop:noBox"?: (HelixSpatialTreemap["noBox"]) | undefined;
+  /** The plot's name where the chart has none: no `aria-label`, `label`, or table caption. */
+  "attr:plot-label"?: (HelixSpatialTreemap["plotLabel"]) | undefined;
+  /** The plot's name where the chart has none: no `aria-label`, `label`, or table caption. */
+  "prop:plotLabel"?: (HelixSpatialTreemap["plotLabel"]) | undefined;
+  /** The `summary` part's sentence. `{count}` and `{groups}` are the number
+of items and groups, written in the locale, and `{low}` and `{high}` the
+smallest and the largest size. */
+  "attr:summary-label"?: (HelixSpatialTreemap["summaryLabel"]) | undefined;
+  /** The `summary` part's sentence. `{count}` and `{groups}` are the number
+of items and groups, written in the locale, and `{low}` and `{high}` the
+smallest and the largest size. */
+  "prop:summaryLabel"?: (HelixSpatialTreemap["summaryLabel"]) | undefined;
+  /** The readings as data, in the shape of a table, where the page has no
+table to point `for` at. `for` wins where both are set.
+
+```js
+chart.data = {
+  caption: 'Sessions by channel',
+  columns: ['Month', 'Direct', 'Referral'],
+  rows: [['Jan', 10, 4], ['Feb', 20, 8]],
+}
+```
+
+The first column holds each row's label and every column after it a
+series, as in a table. A cell is a number, words, `null` for a blank,
+or `{ value, text }` for a number shown as words, such as `$128k`. A
+number is shown in `locale`.
+
+**A table is still the better source where the page can show one**:
+it reads with no script and before hydration, and a reader can sort and
+copy it. Data is drawn on the client only, so a server serves the
+frame, and the summary, the keys and the readout are then the whole of
+what a screen reader is given. Set a new object to redraw: the chart
+does not look inside the one it has. */
+  "prop:data"?: (HelixSpatialTreemap["data"]) | undefined;
+  /** The blocks or the block the keys rest on changed, which the renderer is told. It stays on the chart. */
+  "on:helix-plot-change"?: ((
+    e: HelixSpatialTreemapHelixPlotChangeElementEvent,
+  ) => void) | undefined;
+  /** Shift with an arrow asked the view to turn, by a step across or up. */
+  "on:helix-plot-turn"?: ((
+    e: HelixSpatialTreemapHelixPlotTurnElementEvent,
+  ) => void) | undefined;
+  /** The reading moved, or was put away: `index` is the row, or `-1` for none, with its `label` and the `pointerType` that moved it. */
+  "on:helix-reading-change"?: ((
+    e: HelixSpatialTreemapHelixReadingChangeElementEvent,
+  ) => void) | undefined;
+  /** A block was clicked or pressed with Enter or Space, with the same detail as `helix-reading-change`. */
+  "on:helix-reading-press"?: ((
+    e: HelixSpatialTreemapHelixReadingPressElementEvent,
+  ) => void) | undefined;
+
+  /** Set the innerHTML of the element */
+  innerHTML?: (string) | undefined;
+  /** Set the textContent of the element */
+  textContent?: (string | number) | undefined;
+};
+
 export type HelixSpeedDialGroupProps = {
   /** The group's name, drawn above its actions and read by screen readers. */
   label?: (HelixSpeedDialGroup["label"]) | undefined;
@@ -42079,7 +43245,13 @@ it is muted.
 Forwarded to the video, which decides. Whether an unprompted play is
 permitted is the browser's policy, and what follows a refused autoplay is a
 paused player showing its start control, which is the correct thing to be
-looking at. */
+looking at.
+
+**Not where the reader asked for less motion**, or while the page has
+paused its motion, through `pauseMotion` or `Motion Toggle`: the player
+waits on its start control. A page that pauses its motion pauses a video
+that started itself, and one that lets it run again plays it again. A
+video the reader started is theirs, and neither touches it. */
   autoplay?: (HelixVideo["autoplay"]) | undefined;
   /** What the live region says when `c` turns captions off. */
   "captions-hidden-label"?: (HelixVideo["captionsHiddenLabel"]) | undefined;
@@ -42576,7 +43748,13 @@ it is muted.
 Forwarded to the video, which decides. Whether an unprompted play is
 permitted is the browser's policy, and what follows a refused autoplay is a
 paused player showing its start control, which is the correct thing to be
-looking at. */
+looking at.
+
+**Not where the reader asked for less motion**, or while the page has
+paused its motion, through `pauseMotion` or `Motion Toggle`: the player
+waits on its start control. A page that pauses its motion pauses a video
+that started itself, and one that lets it run again plays it again. A
+video the reader started is theirs, and neither touches it. */
   "prop:autoplay"?: (HelixVideo["autoplay"]) | undefined;
   /** What the live region says when `c` turns captions off. */
   "attr:captions-hidden-label"?: (HelixVideo["captionsHiddenLabel"]) | undefined;
@@ -47171,6 +48349,12 @@ export type CustomElements = {
    * arrived at by two defaults rather than by a rule about the pair, so moving
    * one leaves the other alone.
    * - `autoplay`: Whether the carousel advances on its own.
+   *
+   * **Not where the reader asked for less motion**, or where the page has
+   * paused its motion, through `pauseMotion` or `Motion Toggle`: the carousel
+   * starts still, and its rotation control starts it. A page that pauses its
+   * motion later stops the rotation, and one that lets it run again starts it
+   * again, unless the reader stopped it.
    * - `controls`: Whether the previous and next controls are shown.
    *
    * `auto`, which is the resting behavior and what an absent attribute means,
@@ -54636,6 +55820,9 @@ export type CustomElements = {
    * - `selection-label`/`selectionLabel`: What screen readers hear after a reader selects a note, in the list or in
    * the drawing, with `{note}` for its name and `{count}` for how many notes
    * the list then holds, written with `count-label`.
+   * - `settling-label`/`settlingLabel`: What the `settling` part says while a layout runs unseen, where the reader
+   * asked for less motion or the page paused its motion.
+   * - `stop-layout-label`/`stopLayoutLabel`: What the button that stops a long layout says.
    * - `two-finger-hint-label`/`twoFingerHintLabel`: The hint shown when one finger swipes over the graph with `gestures="cooperative"`.
    * - `using-label`/`usingLabel`: The line shown while the graph, with `gestures="activate"`, has the gestures.
    * - `walk-label`/`walkLabel`: What screen readers hear when a walk along the links moves to a note:
@@ -54737,6 +55924,15 @@ export type CustomElements = {
    * `helix-graph-layout` for the page to keep. Called by `connectGraph` once
    * its layout has settled; a page laying out its own graph calls it the same
    * way.
+   * - `settling(stop?: () => void, unseen = false) => void`: Says a layout is running, with what ends it where the notes stand, or
+   * with nothing, that it has ended. Called by `connectGraph`.
+   *
+   * **A layout that runs past five seconds offers a button that stops it**,
+   * the `stop-layout` part, as WCAG 2.2.2 asks of motion that starts by itself
+   * and runs that long. **`unseen` hides the drawing while the notes move**,
+   * which the connector asks for where the reader asked for less motion or
+   * the page paused its motion: the `settling` part says the notes are being
+   * placed, and the drawing shows them where they settle.
    * - `signal(from: string, to: string, options: { tone?: GraphSignalDetail['tone'] } = {}) => void`: Shows something passing from one note to another, such as a message, a
    * request or a payment, drawn traveling along the drawing and arriving with
    * a pulse. `tone` says what it means and colors it. Call it as often as
@@ -54812,7 +56008,9 @@ export type CustomElements = {
    * - `region`: The frame: the drawing, its controls and the list.
    * - `search`: The bar holding the icon, the search field and the count.
    * - `search-field`: The field that finds a note by its name.
+   * - `settling`: What is said while a layout runs unseen, where the reader asked for less motion or the page paused its motion, over the hidden drawing.
    * - `stage`: The drawing and its controls.
+   * - `stop-layout`: The button that stops a layout that has run past five seconds, where the notes stand.
    * - `viewport`: The box the renderer draws in.
    * - `zoom-in`: The zoom in button.
    * - `zoom-out`: The zoom out button.
@@ -54830,6 +56028,8 @@ export type CustomElements = {
    * - `ready`: The graph has been drawn whole, after `helix-graph-ready`.
    * - `searching`: The search field holds words, and the list holds only the notes they find.
    * - `selected`: A note is selected, in the list or in the drawing.
+   * - `settling`: A layout is running.
+   * - `settling-unseen`: A layout is running with the drawing hidden, where the reader asked for less motion or the page paused its motion.
    * - `sharing`: The page keeps the plain wheel and one finger, with `gestures="cooperative"` or while a graph with `gestures="activate"` waits to be pressed.
    * - `using`: A graph with `gestures="activate"` has been pressed and has the gestures.
    * - `settled`: Set one frame after the first render. Transitions wait for it, so an element does not animate its own arrival.
@@ -54961,6 +56161,19 @@ export type CustomElements = {
    *
    * Component attributes and properties that can be applied to the element or by using JavaScript.
    *
+   * - `emphasis`: How strongly the cells are drawn, as on every chart.
+   *
+   * `outlined` is a cell as its edge in its tone over a fill faded toward the
+   * page, and `subtle` a faint wash of the tone under the same edge. Absent is
+   * the filled cell, per the rule that a reflected property takes no default,
+   * and `solid` writes it out.
+   *
+   * It composes with `material`: emphasis decides what is drawn, and material
+   * how much of it comes through. The ring on the cell the keys rest on keeps
+   * its own ink.
+   * - `material`: How much of each mark comes through, as on every chart: `glass` admits the
+   * most of what is behind it, `frosted` less, and absent is opaque. The
+   * strength is the theme's, scaled by `--helix-material-opacity`.
    * - `empty-text`/`emptyText`: The words shown in place of the drawing when the table has no readings,
    * and the fallback of the `empty` slot.
    * - `loading`: Whether the readings are still on their way. The chart shows
@@ -59897,6 +61110,74 @@ export type CustomElements = {
    */
   "helix-meter": Partial<HelixMeterProps & BaseProps<HelixMeter> & BaseEvents<HelixMeter>>;
 
+  /**
+   * A quiet square button, as the controls over a map are, with the pause icon
+   * while motion runs and the play icon while it is paused. Text slotted into
+   * it stands beside the icon.
+   *
+   * ## Attributes & Properties
+   *
+   * Component attributes and properties that can be applied to the element or by using JavaScript.
+   *
+   * - `label`: The button's name, which stays the same whichever way it stands.
+   * - `whenSettled`: Resolves a frame after the first update, when transitions are switched on.
+   *
+   * **Named `whenSettled` because `settled` is taken four times over**, by
+   * Image, Splitter and both color controls, none of them about transitions. A
+   * base class takes the name every subclass then cannot use.
+   *
+   * **The state it reports cannot be watched, which is why this exists.** A
+   * custom state is deliberately not in the DOM, so there is no
+   * `MutationObserver` equivalent for `ElementInternals.states`. Await this
+   * instead.
+   *
+   * Separate from `updateComplete`, which resolves in the microtask checkpoint
+   * the suppression is still active in. That is the distinction `readyToMove`
+   * in `@fusion.dev/helix-testing` is written around.
+   *
+   * It never resolves where `requestAnimationFrame` never fires, which is a
+   * server, a hidden tab, and happy-dom. Callers that must not hang there race
+   * it against a timeout, as the happy-dom harness's `readyToMove` does. The
+   * browser harness's awaits it alone: a browser always runs the frame, and a
+   * timer beside it was a bet on how long one takes, which a busy run lost. (property only) (readonly)
+   *
+   * ## Events
+   *
+   * Events that will be emitted by the component.
+   *
+   * - `change`: Fired after a press pauses the page's motion or lets it run.
+   *
+   * ## Slots
+   *
+   * Areas where markup can be added to the component.
+   *
+   * - `(default)`: The button's text, where it shows more than its icon. Defaults to nothing, the icon alone, named by `label`.
+   * - `icon`: Replaces the icon, which is pause while motion runs and play while it is paused.
+   *
+   * ## CSS Custom Properties
+   *
+   * CSS variables available for styling the component.
+   *
+   * - `--motion-toggle-background-color`: The button's fill. Defaults to the floating overlay surface.
+   *
+   * ## CSS Parts
+   *
+   * Custom selectors for styling elements within the component.
+   *
+   * - `button`: The toggle button, with `aria-pressed` while the page's motion is paused.
+   * - `icon`: The icon inside the button.
+   *
+   * ## CSS States
+   *
+   * These can be used to apply styling when a component is in a given state.
+   *
+   * - `paused`: The page's motion is paused.
+   * - `settled`: Set one frame after the first render. Transitions wait for it, so an element does not animate its own arrival.
+   */
+  "helix-motion-toggle": Partial<
+    HelixMotionToggleProps & BaseProps<HelixMotionToggle> & BaseEvents<HelixMotionToggle>
+  >;
+
   /**
    * One marker moves to the current destination. A moving marker is easier to
    * follow than a background that switches from one item to another, and the
@@ -66145,6 +67426,260 @@ export type CustomElements = {
     HelixSparklineProps & BaseProps<HelixSparkline> & BaseEvents<HelixSparkline>
   >;
 
+  /**
+   * Each series takes a series color from the theme, as every chart's series
+   * does, and each face of a bar is that color darkened by how far it turns
+   * from the light. The chart draws the bars in 3D in SVG, and
+   * `@fusion.dev/helix-plot` can draw them with three.js.
+   *
+   * ## Attributes & Properties
+   *
+   * Component attributes and properties that can be applied to the element or by using JavaScript.
+   *
+   * - `emphasis`: How strongly the bars are drawn, as on every chart.
+   *
+   * `outlined` is a bar as its edges in its series' color over faces faded
+   * toward the page, and `subtle` the same edges over a faint wash, which
+   * shows the bars behind it. Absent is the filled bar, per the rule that a
+   * reflected property takes no default, and `solid` writes it out. A
+   * renderer draws the bars the same way.
+   *
+   * It composes with `material`: emphasis decides what is drawn, and material
+   * how much of it comes through. The outline on the bar the keys rest on
+   * keeps its own ink.
+   * - `material`: How much of each mark comes through, as on every chart: `glass` admits the
+   * most of what is behind it, `frosted` less, and absent is opaque. The
+   * strength is the theme's, scaled by `--helix-material-opacity`.
+   * - `empty-text`/`emptyText`: The words shown in place of the drawing when the table has no readings,
+   * and the fallback of the `empty` slot.
+   * - `loading`: Whether the readings are still on their way. The chart shows
+   * `loading-text` in place of an empty drawing until it has readings.
+   *
+   * Reflected, so a stylesheet can treat the chart while it waits. A chart
+   * that already has readings keeps drawing them, so a refresh does not
+   * blank it.
+   * - `loading-text`/`loadingText`: The words shown in place of the drawing while `loading` is set and
+   * there are no readings yet, and the fallback of the `loading` slot.
+   * - `for`: The id of the table to read.
+   *
+   * Names a table in the same tree, so a chart inside another component's
+   * shadow root reads a table in that root rather than one in the document. A
+   * `<table>` or anything built from grid roles, including `helix-table`.
+   *
+   * **In React this arrives as a property and not as an attribute**, the way
+   * `Tooltip.for` does, so it does not reflect and nothing styles on it.
+   * - `label`: The chart's name, which starts the chart's text summary.
+   *
+   * Absent falls back to the table's own caption, which is usually the right
+   * words and is already written.
+   * - `locale`: The locale the chart's own numbers are written in: its axis, its
+   * percentages and its totals, such as `de` for `1.240` and `32 %`.
+   *
+   * Absent reads the nearest `lang`, then the runtime's own. The table's
+   * cells are shown as the table writes them, whatever this says.
+   * - `position-label`/`positionLabel`: Where a reading the keys moved to stands among the readings, said after
+   * it. `{position}` and `{count}` are replaced with the numbers, written in
+   * `locale`.
+   *
+   * Set it to the words of the page's language, such as `{position} von
+   * {count}`, or to nothing to say no position. A slice or a series a
+   * legend hid is not counted.
+   * - `no-box`/`noBox`: Draws no box: no edges, grid, numbers, or names, so the readings stand
+   * alone and fill the plot, as a picture on a product's own page does. The
+   * table, the summary, the tooltip, and the keys still carry every value,
+   * and a renderer draws no box either.
+   * - `open-label`/`openLabel`: What the readout says for a place with no value. `{category}` and
+   * `{series}` name the place.
+   * - `plot-label`/`plotLabel`: The plot's name where the chart has none: no `aria-label`, `label`, or table caption.
+   * - `summary-label`/`summaryLabel`: The `summary` part's sentence. `{count}`, `{series}`, and `{categories}`
+   * are the number of bars, series, and categories, written in the locale,
+   * and `{low}` and `{high}` the lowest and the highest value.
+   * - `data`: The readings as data, in the shape of a table, where the page has no
+   * table to point `for` at. `for` wins where both are set.
+   *
+   * ```js
+   * chart.data = {
+   *   caption: 'Sessions by channel',
+   *   columns: ['Month', 'Direct', 'Referral'],
+   *   rows: [['Jan', 10, 4], ['Feb', 20, 8]],
+   * }
+   * ```
+   *
+   * The first column holds each row's label and every column after it a
+   * series, as in a table. A cell is a number, words, `null` for a blank,
+   * or `{ value, text }` for a number shown as words, such as `$128k`. A
+   * number is shown in `locale`.
+   *
+   * **A table is still the better source where the page can show one**:
+   * it reads with no script and before hydration, and a reader can sort and
+   * copy it. Data is drawn on the client only, so a server serves the
+   * frame, and the summary, the keys and the readout are then the whole of
+   * what a screen reader is given. Set a new object to redraw: the chart
+   * does not look inside the one it has. (property only)
+   * - `series`: The table's columns, one series each. Empty when there is no table.
+   *
+   * Held by the controller between edits, so a render reading this five
+   * times parses the table once. See `SourceController.series`. (property only) (readonly)
+   * - `named`: The chart's name: an `aria-label` written on the chart, then `label`,
+   * then the table's caption.
+   *
+   * The fallback is the reason this is shared rather than copied: a caption is
+   * already written, already the right words, and already the thing a reader
+   * of the table sees. A chart that made the consumer say it twice would be
+   * asking for the second one to drift.
+   *
+   * **An `aria-label` on the chart comes first**, because it is how a page
+   * names an element, and the chart is a generic around its plot: written
+   * on the host, the name reached nobody. The plot takes it, as Heatmap's
+   * strip always did. (property only) (readonly)
+   * - `plottedColumns`: The positions of the cells in a row that hold numbers, in table order.
+   *
+   * The same test `readSeries` applies when it drops a column of notes: a
+   * column is a series where any row parses, so a series survives one blank
+   * cell and a column of words is never one. (property only) (readonly)
+   * - `readings`: The number of readings, which the pointer position maps onto. (property only) (readonly)
+   * - `field`: The table read as bars. **Each row is a category, and each numeric
+   * column a series.** A renderer reads it. (property only) (readonly)
+   * - `active`: The bar the keys or the pointer rest on, as its place in `field.cells`, or `-1`. (property only) (readonly)
+   * - `whenSettled`: Resolves a frame after the first update, when transitions are switched on.
+   *
+   * **Named `whenSettled` because `settled` is taken four times over**, by
+   * Image, Splitter and both color controls, none of them about transitions. A
+   * base class takes the name every subclass then cannot use.
+   *
+   * **The state it reports cannot be watched, which is why this exists.** A
+   * custom state is deliberately not in the DOM, so there is no
+   * `MutationObserver` equivalent for `ElementInternals.states`. Await this
+   * instead.
+   *
+   * Separate from `updateComplete`, which resolves in the microtask checkpoint
+   * the suppression is still active in. That is the distinction `readyToMove`
+   * in `@fusion.dev/helix-testing` is written around.
+   *
+   * It never resolves where `requestAnimationFrame` never fires, which is a
+   * server, a hidden tab, and happy-dom. Callers that must not hang there race
+   * it against a timeout, as the happy-dom harness's `readyToMove` does. The
+   * browser harness's awaits it alone: a browser always runs the frame, and a
+   * timer beside it was a bet on how long one takes, which a busy run lost. (property only) (readonly)
+   *
+   * ## Events
+   *
+   * Events that will be emitted by the component.
+   *
+   * - `helix-plot-change`: The bars or the bar the keys rest on changed, which the renderer is told. It stays on the chart.
+   * - `helix-plot-turn`: Shift with an arrow asked the view to turn, by a step across or up.
+   * - `helix-reading-change`: The reading moved, or was put away: `index` is the row, or `-1` for none, with its `label` and the `pointerType` that moved it.
+   * - `helix-reading-press`: A bar was clicked or pressed with Enter or Space, with the same detail as `helix-reading-change`.
+   *
+   * ## Slots
+   *
+   * Areas where markup can be added to the component.
+   *
+   * - `(default)`: The renderer's box, which the 3D drawing is made in.
+   * - `empty`: Content shown when the table has no readings. Falls back to `empty-text`.
+   * - `loading`: Content shown while `loading` is set and there are no readings yet. Falls back to `loading-text`.
+   *
+   * ## Methods
+   *
+   * Methods that can be called to access component functionality.
+   *
+   * - `seriesOf(cell: number) => number | undefined`: The palette slot for the cell at this position in a row.
+   *
+   * **A cell's place in its row is not its series' depth, and the tooltip
+   * spent a while assuming it was.** `readSeries` drops a column nothing
+   * parses and `readRows` keeps it, so one column of notes among the figures
+   * moves every column after it one color along in the bubble: a row reading
+   * `Referral 1,080` wearing series three's green beside a legend that says
+   * series three is something else, which is the one failure the dot exists
+   * to prevent.
+   *
+   * Overridden where a chart reads the table some other way. `ScatterChart`
+   * splits the first plotted column off as the measure across, so its first
+   * *plotted* series is this table's second numeric column.
+   * - `showsSeries(name: string) => boolean`: Whether the series of this name is drawn, which it is unless a legend
+   * reading the same table hid it.
+   *
+   * Asked of the table rather than of a legend, the table being the one
+   * thing the two share: see `SourceController.hide`. A series keeps its
+   * palette slot while it is hidden, so the colors of the others do not move.
+   * For a ring the names are its rows, the slices being the rows.
+   * - `showsColumn(cell: number) => boolean`: Whether the series read from the cell at this place in a row is drawn,
+   * by its column's heading. The keys and the readout pass over one a
+   * legend hid.
+   *
+   * A column's heading is the cell's name in every row, so the first row
+   * answers for the column.
+   * - `columnName(cell: number) => string`: The heading of the column at this place in a row: a cell's name is its
+   * column's heading, read from the first row that has a cell there, so a
+   * short first row does not lose the heading. `''` where no row has one.
+   * - `rendererDrawn(on = true) => void`: Says whether a renderer has drawn the bars, which hides the chart's own
+   * drawing or shows it again. Called by the connector.
+   * - `requestActive(index: number, kind: 'mouse' | 'pen' | 'touch' = 'mouse') => void`: Puts the reading on the bar at `index`, or lets it go with `-1`, as a
+   * pointer resting on it in the renderer's drawing or a press there does.
+   * A touch keeps it until a tap lands elsewhere, and a mouse leaving a
+   * reading the keys moved to leaves it. Called by the connector.
+   * - `placeReading(at: { x: number; y: number } | undefined) => void`: Says where the renderer draws the reading, as fractions of the plot from
+   * its top left, or `undefined` while it draws none. The tooltip points
+   * there. Called by the connector.
+   *
+   * ## CSS Custom Properties
+   *
+   * CSS variables available for styling the component.
+   *
+   * - `--spatial-bar-chart-block-size`: How tall the plot is.
+   * - `--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
+   *
+   * Custom selectors for styling elements within the component.
+   *
+   * - `axis-name`: A measure's name, along its edge of the box, in the chart's own drawing.
+   * - `bar`: One bar, its faces in its series' color.
+   * - `bar-active`: The bar the pointer or the keys rest on. Set alongside `bar`.
+   * - `drawing`: The chart's own drawing in SVG: the box, its grid and names, and the bars.
+   * - `empty`: The words when the table has no readings: the `empty` slot, falling back to `empty-text`.
+   * - `face`: One face of a bar the view shows, shaded by which way it faces.
+   * - `fallback`: The box the chart's own drawing fills, shown until a renderer has drawn and where none is connected. Hidden from screen readers.
+   * - `grid`: The box's edges and its grid, in the chart's own drawing.
+   * - `live`: The readout: a polite live region that says the bar the keys moved to. Hide it visually.
+   * - `loading`: The words while `loading` is set and there are no readings.
+   * - `mark`: The invisible point the tooltip is anchored to, where the renderer draws the reading.
+   * - `plot`: The box the drawing fills, which takes focus to be read by key. It is named by the host's `aria-labelledby` or `aria-label`, then by `label`, then by the caption of the table.
+   * - `ring`: The outline around the bar the pointer or the keys rest on, painted after it, so the bars in front of it cover it.
+   * - `summary`: The number of bars, series, and categories, and the range of values, written as a sentence for screen readers, which describes the plot. Hide it visually.
+   * - `table`: The readings as a table, for a screen reader, rendered only where they were drawn from `data`. Hide it visually.
+   * - `tick`: A category's or a series' name, or a value at a tick, along its edge of the box, in the chart's own drawing.
+   * - `tooltip`: The bubble, forwarded from `Tooltip`.
+   * - `tooltip-anchor`: The `Tooltip` element itself.
+   * - `tooltip-arrow`: The bubble's point, forwarded from `Tooltip`.
+   * - `tooltip-arrow-bottom`: The point while the bubble is below the reading, on its top edge. Set alongside `tooltip-arrow`.
+   * - `tooltip-arrow-left`: The point while the bubble is left of the reading, on its right edge. Set alongside `tooltip-arrow`.
+   * - `tooltip-arrow-right`: The point while the bubble is right of the reading, on its left edge. Set alongside `tooltip-arrow`.
+   * - `tooltip-arrow-top`: The point while the bubble is above the reading, on its bottom edge. Set alongside `tooltip-arrow`.
+   * - `tooltip-bottom`: The bubble while it is below the reading. Set alongside `tooltip`.
+   * - `tooltip-cell`: One column's name and value inside the tooltip.
+   * - `tooltip-cell-current`: The cell a chart's series keys rest on, which every chart's tooltip can mark. This chart marks none, since its readout says the measure. Set alongside `tooltip-cell`.
+   * - `tooltip-label`: The row's own name inside the tooltip.
+   * - `tooltip-left`: The bubble while it is left of the reading. Set alongside `tooltip`.
+   * - `tooltip-name`: A column's name inside the tooltip.
+   * - `tooltip-right`: The bubble while it is right of the reading. Set alongside `tooltip`.
+   * - `tooltip-top`: The bubble while it is above the reading. Set alongside `tooltip`.
+   * - `tooltip-value`: A column's value inside the tooltip.
+   *
+   * ## CSS States
+   *
+   * These can be used to apply styling when a component is in a given state.
+   *
+   * - `active`: While a bar is shown, under the pointer or the keys.
+   * - `drawn`: While a renderer has drawn the bars, and the chart's own drawing is hidden.
+   * - `empty`: While the `empty` part stands in place of the readings.
+   * - `loading`: While the `loading` part stands in place of the readings.
+   * - `settled`: Set one frame after the first render. Transitions wait for it, so an element does not animate its own arrival.
+   */
+  "helix-spatial-bar-chart": Partial<
+    HelixSpatialBarChartProps & BaseProps<HelixSpatialBarChart> & BaseEvents<HelixSpatialBarChart>
+  >;
+
   /**
    * Each reading is a prism. The top face takes the cell's tone, and the two
    * sides are the same tone, shaded darker, so the whole relief follows your
@@ -66159,6 +67694,20 @@ export type CustomElements = {
    *
    * Component attributes and properties that can be applied to the element or by using JavaScript.
    *
+   * - `emphasis`: How strongly the prisms are drawn, as on every chart.
+   *
+   * `outlined` is a prism as its edges in its tone over faces faded toward the
+   * page, and `subtle` a faint wash of the tone under the same edges, which
+   * shows the prisms behind it. Absent is the filled prism, per the rule that
+   * a reflected property takes no default, and `solid` writes it out. A
+   * renderer draws the prisms the same way.
+   *
+   * It composes with `material`: emphasis decides what is drawn, and material
+   * how much of it comes through. The ring on the prism the keys rest on keeps
+   * its own ink.
+   * - `material`: How much of each mark comes through, as on every chart: `glass` admits the
+   * most of what is behind it, `frosted` less, and absent is opaque. The
+   * strength is the theme's, scaled by `--helix-material-opacity`.
    * - `flat`: Draws every prism at no height, so the tones lie on a plane.
    * - `relief`: How tall the highest reading stands, in cells. Every other reading stands
    * at its share of it.
@@ -66508,14 +68057,29 @@ export type CustomElements = {
   >;
 
   /**
-   * The chart draws the points in 3D in SVG, and `@fusion.dev/helix-plot` can
-   * draw them with three.js. Each group takes a series color from the theme, as
-   * every chart's series does, in both drawings.
+   * Each series takes a series color from the theme, as every chart's series
+   * does, and each face of a ribbon is that color darkened by how far it turns
+   * from the light. The chart draws the ribbons in 3D in SVG, and
+   * `@fusion.dev/helix-plot` can draw them with three.js.
    *
    * ## Attributes & Properties
    *
    * Component attributes and properties that can be applied to the element or by using JavaScript.
    *
+   * - `emphasis`: How strongly the ribbons are drawn, as on every chart.
+   *
+   * `outlined` is a ribbon as its edges in its series' color over faces
+   * faded toward the page, and `subtle` the same edges over a faint wash,
+   * which shows the ribbons behind it. Absent is the filled ribbon, per the
+   * rule that a reflected property takes no default, and `solid` writes it
+   * out. A renderer draws the ribbons the same way.
+   *
+   * It composes with `material`: emphasis decides what is drawn, and material
+   * how much of it comes through. The ring on the reading the keys rest on
+   * keeps its own ink.
+   * - `material`: How much of each mark comes through, as on every chart: `glass` admits the
+   * most of what is behind it, `frosted` less, and absent is opaque. The
+   * strength is the theme's, scaled by `--helix-material-opacity`.
    * - `empty-text`/`emptyText`: The words shown in place of the drawing when the table has no readings,
    * and the fallback of the `empty` slot.
    * - `loading`: Whether the readings are still on their way. The chart shows
@@ -66550,10 +68114,16 @@ export type CustomElements = {
    * Set it to the words of the page's language, such as `{position} von
    * {count}`, or to nothing to say no position. A slice or a series a
    * legend hid is not counted.
-   * - `group-by`/`groupBy`: The column of text that puts each point in a group, by its heading. None by default.
+   * - `no-box`/`noBox`: Draws no box: no edges, grid, numbers, or names, so the readings stand
+   * alone and fill the plot, as a picture on a product's own page does. The
+   * table, the summary, the tooltip, and the keys still carry every value,
+   * and a renderer draws no box either.
+   * - `open-label`/`openLabel`: What the readout says for a reading the table has no value for.
+   * `{place}` and `{series}` name it.
    * - `plot-label`/`plotLabel`: The plot's name where the chart has none: no `aria-label`, `label`, or table caption.
-   * - `summary-label`/`summaryLabel`: The `summary` part's sentence. `{count}` is the number of points, written
-   * in the locale, and `{x}`, `{y}`, and `{z}` are the three measures' names.
+   * - `summary-label`/`summaryLabel`: The `summary` part's sentence. `{count}`, `{series}`, and `{places}` are
+   * the number of readings, series, and places, written in the locale,
+   * and `{low}` and `{high}` the lowest and the highest value.
    * - `data`: The readings as data, in the shape of a table, where the page has no
    * table to point `for` at. `for` wins where both are set.
    *
@@ -66598,10 +68168,9 @@ export type CustomElements = {
    * column is a series where any row parses, so a series survives one blank
    * cell and a column of words is never one. (property only) (readonly)
    * - `readings`: The number of readings, which the pointer position maps onto. (property only) (readonly)
-   * - `field`: The table read as points, axes, and groups. **The first three numeric
-   * columns are across, up, and in depth**, and a row lacking any of them is
-   * left out. A renderer reads it. (property only) (readonly)
-   * - `active`: The point the keys or the pointer rest on, as its place in `field.points`, or `-1`. (property only) (readonly)
+   * - `field`: The table read as ribbons. **Each row is a place across, and each
+   * numeric column a series.** A renderer reads it. (property only) (readonly)
+   * - `active`: The reading the keys or the pointer rest on, as its place in `field.cells`, or `-1`. (property only) (readonly)
    * - `whenSettled`: Resolves a frame after the first update, when transitions are switched on.
    *
    * **Named `whenSettled` because `settled` is taken four times over**, by
@@ -66627,18 +68196,18 @@ export type CustomElements = {
    *
    * Events that will be emitted by the component.
    *
-   * - `helix-plot-change`: The points or the point the keys rest on changed, which the renderer is told. It stays on the chart.
+   * - `helix-plot-change`: The readings or the reading the keys rest on changed, which the renderer is told. It stays on the chart.
    * - `helix-plot-turn`: Shift with an arrow asked the view to turn, by a step across or up.
    * - `helix-reading-change`: The reading moved, or was put away: `index` is the row, or `-1` for none, with its `label` and the `pointerType` that moved it.
-   * - `helix-reading-press`: A point was clicked, tapped, or pressed with Enter or Space, with the same detail as `helix-reading-change`.
+   * - `helix-reading-press`: A reading was clicked or pressed with Enter or Space, with the same detail as `helix-reading-change`.
    *
    * ## Slots
    *
    * Areas where markup can be added to the component.
    *
    * - `(default)`: The renderer's box, which the 3D drawing is made in.
-   * - `empty`: Content shown when the table has no points. Falls back to `empty-text`.
-   * - `loading`: Content shown while `loading` is set and there are no points yet. Falls back to `loading-text`.
+   * - `empty`: Content shown when the table has no readings. Falls back to `empty-text`.
+   * - `loading`: Content shown while `loading` is set and there are no readings yet. Falls back to `loading-text`.
    *
    * ## Methods
    *
@@ -66673,9 +68242,9 @@ export type CustomElements = {
    * - `columnName(cell: number) => string`: The heading of the column at this place in a row: a cell's name is its
    * column's heading, read from the first row that has a cell there, so a
    * short first row does not lose the heading. `''` where no row has one.
-   * - `rendererDrawn(on = true) => void`: Says whether a renderer has drawn the points, which hides the chart's
-   * own drawing or shows it again. Called by the connector.
-   * - `requestActive(index: number, kind: 'mouse' | 'pen' | 'touch' = 'mouse') => void`: Puts the reading on the point at `index`, or lets it go with `-1`, as a
+   * - `rendererDrawn(on = true) => void`: Says whether a renderer has drawn the ribbons, which hides the chart's own
+   * drawing or shows it again. Called by the connector.
+   * - `requestActive(index: number, kind: 'mouse' | 'pen' | 'touch' = 'mouse') => void`: Puts the reading on the one at `index`, or lets it go with `-1`, as a
    * pointer resting on it in the renderer's drawing or a press there does.
    * A touch keeps it until a tap lands elsewhere, and a mouse leaving a
    * reading the keys moved to leaves it. Called by the connector.
@@ -66687,27 +68256,28 @@ export type CustomElements = {
    *
    * CSS variables available for styling the component.
    *
-   * - `--spatial-scatter-chart-block-size`: How tall the plot is.
+   * - `--spatial-ribbon-chart-block-size`: How tall the plot is.
+   * - `--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
    *
    * Custom selectors for styling elements within the component.
    *
    * - `axis-name`: A measure's name, along its edge of the box, in the chart's own drawing.
-   * - `drawing`: The chart's own drawing in SVG: the box, its grid and numbers, and the points.
-   * - `empty`: The words when the table has no points: the `empty` slot, falling back to `empty-text`.
+   * - `drawing`: The chart's own drawing in SVG: the box, its grid and names, and the ribbons.
+   * - `empty`: The words when the table has no readings: the `empty` slot, falling back to `empty-text`.
+   * - `face`: One face of a ribbon the view shows: a piece of its top, an end, or its side, shaded by how far it turns from the light.
    * - `fallback`: The box the chart's own drawing fills, shown until a renderer has drawn and where none is connected. Hidden from screen readers.
-   * - `grid`: The box's edges and its grid at the ticks, in the chart's own drawing.
-   * - `live`: The readout: a polite live region that says the point the keys moved to. Hide it visually.
-   * - `loading`: The words while `loading` is set and there are no points.
+   * - `grid`: The box's edges and its grid, in the chart's own drawing.
+   * - `live`: The readout: a polite live region that says the reading the keys moved to. Hide it visually.
+   * - `loading`: The words while `loading` is set and there are no readings.
    * - `mark`: The invisible point the tooltip is anchored to, where the renderer draws the reading.
    * - `plot`: The box the drawing fills, which takes focus to be read by key. It is named by the host's `aria-labelledby` or `aria-label`, then by `label`, then by the caption of the table.
-   * - `point`: One point of the chart's own drawing.
-   * - `point-active`: The point the pointer or the keys rest on, in the chart's own drawing. Set alongside `point`.
-   * - `ring`: The ring around the point the pointer or the keys rest on, drawn over every point.
-   * - `summary`: The three measures and the number of points, written as a sentence for screen readers, which describes the plot. Hide it visually.
+   * - `ribbon`: One ribbon, its faces in its series' color.
+   * - `ring`: The ring around the reading the pointer or the keys rest on, drawn over the ribbons.
+   * - `summary`: The number of readings, series, and places, and the range of values, written as a sentence for screen readers, which describes the plot. Hide it visually.
    * - `table`: The readings as a table, for a screen reader, rendered only where they were drawn from `data`. Hide it visually.
-   * - `tick`: A number at a tick, along its edge of the box, in the chart's own drawing.
+   * - `tick`: A place's or a series' name, or a value at a tick, along its edge of the box, in the chart's own drawing.
    * - `tooltip`: The bubble, forwarded from `Tooltip`.
    * - `tooltip-anchor`: The `Tooltip` element itself.
    * - `tooltip-arrow`: The bubble's point, forwarded from `Tooltip`.
@@ -66729,28 +68299,40 @@ export type CustomElements = {
    *
    * These can be used to apply styling when a component is in a given state.
    *
-   * - `active`: While a point is shown, under the pointer or the keys.
-   * - `drawn`: While a renderer has drawn the points, and the chart's own drawing is hidden.
-   * - `empty`: While the `empty` part stands in place of the points.
-   * - `loading`: While the `loading` part stands in place of the points.
+   * - `active`: While a reading is shown, under the pointer or the keys.
+   * - `drawn`: While a renderer has drawn the ribbons, and the chart's own drawing is hidden.
+   * - `empty`: While the `empty` part stands in place of the readings.
+   * - `loading`: While the `loading` part stands in place of the readings.
    * - `settled`: Set one frame after the first render. Transitions wait for it, so an element does not animate its own arrival.
    */
-  "helix-spatial-scatter-chart": Partial<
-    HelixSpatialScatterChartProps &
-      BaseProps<HelixSpatialScatterChart> &
-      BaseEvents<HelixSpatialScatterChart>
+  "helix-spatial-ribbon-chart": Partial<
+    HelixSpatialRibbonChartProps &
+      BaseProps<HelixSpatialRibbonChart> &
+      BaseEvents<HelixSpatialRibbonChart>
   >;
 
   /**
-   * The chart draws the surface in 3D in SVG, and `@fusion.dev/helix-plot` can
-   * draw it with three.js. Every height is shaded along one
-   * ramp from the theme's primary color, quiet where it is low and strong where
-   * it is high, so the two drawings agree.
+   * The chart draws the points in 3D in SVG, and `@fusion.dev/helix-plot` can
+   * draw them with three.js. Each group takes a series color from the theme, as
+   * every chart's series does, in both drawings.
    *
    * ## Attributes & Properties
    *
    * Component attributes and properties that can be applied to the element or by using JavaScript.
    *
+   * - `emphasis`: How strongly the points are drawn, as on every chart.
+   *
+   * `outlined` is a point as a ring in its group's color over a dot faded
+   * toward the page, and `subtle` the same ring over a faint dot. Absent is
+   * the filled dot, per the rule that a reflected property takes no default,
+   * and `solid` writes it out. A renderer draws the points the same way.
+   *
+   * It composes with `material`: emphasis decides what is drawn, and material
+   * how much of it comes through. The ring on the point the keys rest on keeps
+   * its own ink.
+   * - `material`: How much of each mark comes through, as on every chart: `glass` admits the
+   * most of what is behind it, `frosted` less, and absent is opaque. The
+   * strength is the theme's, scaled by `--helix-material-opacity`.
    * - `empty-text`/`emptyText`: The words shown in place of the drawing when the table has no readings,
    * and the fallback of the `empty` slot.
    * - `loading`: Whether the readings are still on their way. The chart shows
@@ -66785,14 +68367,17 @@ export type CustomElements = {
    * Set it to the words of the page's language, such as `{position} von
    * {count}`, or to nothing to say no position. A slice or a series a
    * legend hid is not counted.
-   * - `open-label`/`openLabel`: What the readout says for a place with no reading. `{x}` and `{z}` are
-   * the place's numbers across and in depth, and `{across}` and `{depth}`
-   * the two measures' names.
+   * - `drop-lines`/`dropLines`: Draws a line from each point straight down to the floor of the box, in
+   * its group's color, so where a point stands across and in depth reads off
+   * the floor's grid. A renderer draws them too.
+   * - `group-by`/`groupBy`: The column of text that puts each point in a group, by its heading. None by default.
+   * - `no-box`/`noBox`: Draws no box: no edges, grid, numbers, or names, so the readings stand
+   * alone and fill the plot, as a picture on a product's own page does. The
+   * table, the summary, the tooltip, and the keys still carry every value,
+   * and a renderer draws no box either.
    * - `plot-label`/`plotLabel`: The plot's name where the chart has none: no `aria-label`, `label`, or table caption.
-   * - `summary-label`/`summaryLabel`: The `summary` part's sentence. `{count}` is the number of readings,
-   * written in the locale, `{x}`, `{z}`, and `{y}` are the measures across,
-   * in depth, and up, and `{low}` and `{high}` the lowest and the highest
-   * reading.
+   * - `summary-label`/`summaryLabel`: The `summary` part's sentence. `{count}` is the number of points, written
+   * in the locale, and `{x}`, `{y}`, and `{z}` are the three measures' names.
    * - `data`: The readings as data, in the shape of a table, where the page has no
    * table to point `for` at. `for` wins where both are set.
    *
@@ -66837,10 +68422,10 @@ export type CustomElements = {
    * column is a series where any row parses, so a series survives one blank
    * cell and a column of words is never one. (property only) (readonly)
    * - `readings`: The number of readings, which the pointer position maps onto. (property only) (readonly)
-   * - `field`: The table read as a grid of heights. **The first numeric column is
-   * across, the second is in depth, and the third is the height.** A
-   * renderer reads it. (property only) (readonly)
-   * - `active`: The place the keys or the pointer rest on, as its place in `field.cells`, or `-1`. (property only) (readonly)
+   * - `field`: The table read as points, axes, and groups. **The first three numeric
+   * columns are across, up, and in depth**, and a row lacking any of them is
+   * left out. A renderer reads it. (property only) (readonly)
+   * - `active`: The point the keys or the pointer rest on, as its place in `field.points`, or `-1`. (property only) (readonly)
    * - `whenSettled`: Resolves a frame after the first update, when transitions are switched on.
    *
    * **Named `whenSettled` because `settled` is taken four times over**, by
@@ -66866,18 +68451,18 @@ export type CustomElements = {
    *
    * Events that will be emitted by the component.
    *
-   * - `helix-plot-change`: The readings or the place the keys rest on changed, which the renderer is told. It stays on the chart.
+   * - `helix-plot-change`: The points or the point the keys rest on changed, which the renderer is told. It stays on the chart.
    * - `helix-plot-turn`: Shift with an arrow asked the view to turn, by a step across or up.
-   * - `helix-reading-change`: The reading moved, or was put away: `index` is the row, or `-1` for none or a place with no reading, with its `label` and the `pointerType` that moved it.
-   * - `helix-reading-press`: A place was clicked or pressed with Enter or Space, with the same detail as `helix-reading-change`.
+   * - `helix-reading-change`: The reading moved, or was put away: `index` is the row, or `-1` for none, with its `label` and the `pointerType` that moved it.
+   * - `helix-reading-press`: A point was clicked, tapped, or pressed with Enter or Space, with the same detail as `helix-reading-change`.
    *
    * ## Slots
    *
    * Areas where markup can be added to the component.
    *
    * - `(default)`: The renderer's box, which the 3D drawing is made in.
-   * - `empty`: Content shown when the table has no readings. Falls back to `empty-text`.
-   * - `loading`: Content shown while `loading` is set and there are no readings yet. Falls back to `loading-text`.
+   * - `empty`: Content shown when the table has no points. Falls back to `empty-text`.
+   * - `loading`: Content shown while `loading` is set and there are no points yet. Falls back to `loading-text`.
    *
    * ## Methods
    *
@@ -66912,9 +68497,9 @@ export type CustomElements = {
    * - `columnName(cell: number) => string`: The heading of the column at this place in a row: a cell's name is its
    * column's heading, read from the first row that has a cell there, so a
    * short first row does not lose the heading. `''` where no row has one.
-   * - `rendererDrawn(on = true) => void`: Says whether a renderer has drawn the surface, which hides the chart's
+   * - `rendererDrawn(on = true) => void`: Says whether a renderer has drawn the points, which hides the chart's
    * own drawing or shows it again. Called by the connector.
-   * - `requestActive(index: number, kind: 'mouse' | 'pen' | 'touch' = 'mouse') => void`: Puts the reading on the place at `index`, or lets it go with `-1`, as a
+   * - `requestActive(index: number, kind: 'mouse' | 'pen' | 'touch' = 'mouse') => void`: Puts the reading on the point at `index`, or lets it go with `-1`, as a
    * pointer resting on it in the renderer's drawing or a press there does.
    * A touch keeps it until a tap lands elsewhere, and a mouse leaving a
    * reading the keys moved to leaves it. Called by the connector.
@@ -66926,28 +68511,26 @@ export type CustomElements = {
    *
    * CSS variables available for styling the component.
    *
-   * - `--spatial-surface-chart-block-size`: How tall the plot is.
-   * - `--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.
-   * - `--spatial-surface-chart-shade`: 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-scatter-chart-block-size`: How tall the plot is.
    *
    * ## CSS Parts
    *
    * Custom selectors for styling elements within the component.
    *
    * - `axis-name`: A measure's name, along its edge of the box, in the chart's own drawing.
-   * - `drawing`: The chart's own drawing in SVG: the box, its grid and numbers, and the surface.
-   * - `empty`: The words when the table has no readings: the `empty` slot, falling back to `empty-text`.
-   * - `face`: One square of the surface between four readings, or a triangle where one is missing, shaded by its height and by which way it faces.
+   * - `drawing`: The chart's own drawing in SVG: the box, its grid and numbers, and the points.
+   * - `drop-line`: The line from a point straight down to the floor of the box, drawn under `drop-lines`, in its group's color.
+   * - `empty`: The words when the table has no points: the `empty` slot, falling back to `empty-text`.
    * - `fallback`: The box the chart's own drawing fills, shown until a renderer has drawn and where none is connected. Hidden from screen readers.
    * - `grid`: The box's edges and its grid at the ticks, in the chart's own drawing.
-   * - `live`: The readout: a polite live region that says the place the keys moved to. Hide it visually.
-   * - `loading`: The words while `loading` is set and there are no readings.
+   * - `live`: The readout: a polite live region that says the point the keys moved to. Hide it visually.
+   * - `loading`: The words while `loading` is set and there are no points.
    * - `mark`: The invisible point the tooltip is anchored to, where the renderer draws the reading.
    * - `plot`: The box the drawing fills, which takes focus to be read by key. It is named by the host's `aria-labelledby` or `aria-label`, then by `label`, then by the caption of the table.
-   * - `ring`: The ring around the reading the pointer or the keys rest on, drawn over the surface.
-   * - `summary`: The measures, the number of readings, and the range of heights, written as a sentence for screen readers, which describes the plot. Hide it visually.
+   * - `point`: One point of the chart's own drawing.
+   * - `point-active`: The point the pointer or the keys rest on, in the chart's own drawing. Set alongside `point`.
+   * - `ring`: The ring around the point the pointer or the keys rest on, drawn over every point.
+   * - `summary`: The three measures and the number of points, written as a sentence for screen readers, which describes the plot. Hide it visually.
    * - `table`: The readings as a table, for a screen reader, rendered only where they were drawn from `data`. Hide it visually.
    * - `tick`: A number at a tick, along its edge of the box, in the chart's own drawing.
    * - `tooltip`: The bubble, forwarded from `Tooltip`.
@@ -66971,106 +68554,624 @@ export type CustomElements = {
    *
    * These can be used to apply styling when a component is in a given state.
    *
-   * - `active`: While a place is shown, under the pointer or the keys.
-   * - `drawn`: While a renderer has drawn the surface, and the chart's own drawing is hidden.
-   * - `empty`: While the `empty` part stands in place of the readings.
-   * - `loading`: While the `loading` part stands in place of the readings.
+   * - `active`: While a point is shown, under the pointer or the keys.
+   * - `drawn`: While a renderer has drawn the points, and the chart's own drawing is hidden.
+   * - `empty`: While the `empty` part stands in place of the points.
+   * - `loading`: While the `loading` part stands in place of the points.
    * - `settled`: Set one frame after the first render. Transitions wait for it, so an element does not animate its own arrival.
    */
-  "helix-spatial-surface-chart": Partial<
-    HelixSpatialSurfaceChartProps &
-      BaseProps<HelixSpatialSurfaceChart> &
-      BaseEvents<HelixSpatialSurfaceChart>
+  "helix-spatial-scatter-chart": Partial<
+    HelixSpatialScatterChartProps &
+      BaseProps<HelixSpatialScatterChart> &
+      BaseEvents<HelixSpatialScatterChart>
   >;
 
   /**
-   * A column of actions with its name above them, in the small muted words a
-   * menu heads its sections with, lined up on the side the trigger is on. The
-   * space between two groups is the space between two actions.
+   * The chart draws the surface in 3D in SVG, and `@fusion.dev/helix-plot` can
+   * draw it with three.js. Every height is shaded along one
+   * ramp from the theme's primary color, quiet where it is low and strong where
+   * it is high, so the two drawings agree.
    *
    * ## Attributes & Properties
    *
    * Component attributes and properties that can be applied to the element or by using JavaScript.
    *
-   * - `label`: The group's name, drawn above its actions and read by screen readers.
-   * - `whenSettled`: Resolves a frame after the first update, when transitions are switched on.
-   *
-   * **Named `whenSettled` because `settled` is taken four times over**, by
-   * Image, Splitter and both color controls, none of them about transitions. A
-   * base class takes the name every subclass then cannot use.
-   *
-   * **The state it reports cannot be watched, which is why this exists.** A
-   * custom state is deliberately not in the DOM, so there is no
-   * `MutationObserver` equivalent for `ElementInternals.states`. Await this
-   * instead.
-   *
-   * Separate from `updateComplete`, which resolves in the microtask checkpoint
-   * the suppression is still active in. That is the distinction `readyToMove`
-   * in `@fusion.dev/helix-testing` is written around.
-   *
-   * It never resolves where `requestAnimationFrame` never fires, which is a
-   * server, a hidden tab, and happy-dom. Callers that must not hang there race
-   * it against a timeout, as the happy-dom harness's `readyToMove` does. The
-   * browser harness's awaits it alone: a browser always runs the frame, and a
-   * timer beside it was a bet on how long one takes, which a busy run lost. (property only) (readonly)
-   *
-   * ## Slots
-   *
-   * Areas where markup can be added to the component.
-   *
-   * - `(default)`: The group's actions.
-   * - `label`: The group's name, for content richer than the `label` text.
+   * - `emphasis`: How strongly the surface is drawn, as on every chart.
+   *
+   * `outlined` is a wireframe in the ramp's colors over a surface faded toward
+   * the page, and `subtle` the same wireframe over a faint surface that the
+   * grid behind shows through, so a reading the surface hid from this side can
+   * be seen. Absent is the filled surface, per the rule that a reflected
+   * property takes no default, and `solid` writes it out. A renderer draws the
+   * surface the same way.
+   *
+   * It composes with `material`: emphasis decides what is drawn, and material
+   * how much of it comes through. The ring on the reading the keys rest on
+   * keeps its own ink.
+   * - `material`: How much of each mark comes through, as on every chart: `glass` admits the
+   * most of what is behind it, `frosted` less, and absent is opaque. The
+   * strength is the theme's, scaled by `--helix-material-opacity`.
+   * - `empty-text`/`emptyText`: The words shown in place of the drawing when the table has no readings,
+   * and the fallback of the `empty` slot.
+   * - `loading`: Whether the readings are still on their way. The chart shows
+   * `loading-text` in place of an empty drawing until it has readings.
    *
-   * ## CSS Custom Properties
+   * Reflected, so a stylesheet can treat the chart while it waits. A chart
+   * that already has readings keeps drawing them, so a refresh does not
+   * blank it.
+   * - `loading-text`/`loadingText`: The words shown in place of the drawing while `loading` is set and
+   * there are no readings yet, and the fallback of the `loading` slot.
+   * - `for`: The id of the table to read.
    *
-   * CSS variables available for styling the component.
+   * Names a table in the same tree, so a chart inside another component's
+   * shadow root reads a table in that root rather than one in the document. A
+   * `<table>` or anything built from grid roles, including `helix-table`.
    *
-   * - `--speed-dial-group-label-color`: Color of the group's name.
-   * - `--speed-dial-group-label-font-size`: Size of the group's name.
+   * **In React this arrives as a property and not as an attribute**, the way
+   * `Tooltip.for` does, so it does not reflect and nothing styles on it.
+   * - `label`: The chart's name, which starts the chart's text summary.
    *
-   * ## CSS Parts
+   * Absent falls back to the table's own caption, which is usually the right
+   * words and is already written.
+   * - `locale`: The locale the chart's own numbers are written in: its axis, its
+   * percentages and its totals, such as `de` for `1.240` and `32 %`.
    *
-   * Custom selectors for styling elements within the component.
+   * Absent reads the nearest `lang`, then the runtime's own. The table's
+   * cells are shown as the table writes them, whatever this says.
+   * - `position-label`/`positionLabel`: Where a reading the keys moved to stands among the readings, said after
+   * it. `{position}` and `{count}` are replaced with the numbers, written in
+   * `locale`.
    *
-   * - `group`: The set, which carries the `group` role.
-   * - `label`: The group's name, drawn above its actions while there is one.
+   * Set it to the words of the page's language, such as `{position} von
+   * {count}`, or to nothing to say no position. A slice or a series a
+   * legend hid is not counted.
+   * - `contours`: Draws the surface's contour lines on it, at each tick of its height, in
+   * the ramp's colors, so its shape reads as on a map and two places at the
+   * same height read as such. A renderer draws them too.
+   * - `no-box`/`noBox`: Draws no box: no edges, grid, numbers, or names, so the readings stand
+   * alone and fill the plot, as a picture on a product's own page does. The
+   * table, the summary, the tooltip, and the keys still carry every value,
+   * and a renderer draws no box either.
+   * - `open-label`/`openLabel`: What the readout says for a place with no reading. `{x}` and `{z}` are
+   * the place's numbers across and in depth, and `{across}` and `{depth}`
+   * the two measures' names.
+   * - `plot-label`/`plotLabel`: The plot's name where the chart has none: no `aria-label`, `label`, or table caption.
+   * - `summary-label`/`summaryLabel`: The `summary` part's sentence. `{count}` is the number of readings,
+   * written in the locale, `{x}`, `{z}`, and `{y}` are the measures across,
+   * in depth, and up, and `{low}` and `{high}` the lowest and the highest
+   * reading.
+   * - `data`: The readings as data, in the shape of a table, where the page has no
+   * table to point `for` at. `for` wins where both are set.
    *
-   * ## CSS States
+   * ```js
+   * chart.data = {
+   *   caption: 'Sessions by channel',
+   *   columns: ['Month', 'Direct', 'Referral'],
+   *   rows: [['Jan', 10, 4], ['Feb', 20, 8]],
+   * }
+   * ```
    *
-   * These can be used to apply styling when a component is in a given state.
+   * The first column holds each row's label and every column after it a
+   * series, as in a table. A cell is a number, words, `null` for a blank,
+   * or `{ value, text }` for a number shown as words, such as `$128k`. A
+   * number is shown in `locale`.
    *
-   * - `settled`: Set one frame after the first render. Transitions wait for it, so an element does not animate its own arrival.
-   */
-  "helix-speed-dial-group": Partial<
-    HelixSpeedDialGroupProps & BaseProps<HelixSpeedDialGroup> & BaseEvents<HelixSpeedDialGroup>
-  >;
-
-  /**
-   * Presentation only: a round mark the size of a small control, with the name on
-   * a chip beside it so it stays readable over whatever the dial floats over. The
-   * base class handles its behavior.
+   * **A table is still the better source where the page can show one**:
+   * it reads with no script and before hydration, and a reader can sort and
+   * copy it. Data is drawn on the client only, so a server serves the
+   * frame, and the summary, the keys and the readout are then the whole of
+   * what a screen reader is given. Set a new object to redraw: the chart
+   * does not look inside the one it has. (property only)
+   * - `series`: The table's columns, one series each. Empty when there is no table.
    *
-   * ## Attributes & Properties
+   * Held by the controller between edits, so a render reading this five
+   * times parses the table once. See `SourceController.series`. (property only) (readonly)
+   * - `named`: The chart's name: an `aria-label` written on the chart, then `label`,
+   * then the table's caption.
    *
-   * Component attributes and properties that can be applied to the element or by using JavaScript.
+   * The fallback is the reason this is shared rather than copied: a caption is
+   * already written, already the right words, and already the thing a reader
+   * of the table sees. A chart that made the consumer say it twice would be
+   * asking for the second one to drift.
    *
-   * - `disabled`: Whether the action is disabled, so it cannot be chosen.
-   * - `download`: Whether the link downloads the file when the action is chosen. Only
-   * meaningful beside an `href`, and only for a file served from the page's
-   * origin.
-   * - `href`: The URL the action links to. Setting it draws the action as a link.
-   * - `rel`: The link's `rel`. Set it whenever you set `target="_blank"`.
-   * - `shortcut`: The action's keyboard shortcut as a chord, such as `mod+s`, carried as
-   * `aria-keyshortcuts` and drawn after the name. `mod` is Command on an Apple
-   * keyboard and Control elsewhere. Showing a shortcut does not bind it.
-   * - `target`: Where the link opens, such as `_blank` for a new tab.
-   * - `value`: The action's value, sent in `helix-select` when the action is chosen.
-   * - `active`: Whether the action has focus, which makes it the action the keyboard is on.
+   * **An `aria-label` on the chart comes first**, because it is how a page
+   * names an element, and the chart is a generic around its plot: written
+   * on the host, the name reached nobody. The plot takes it, as Heatmap's
+   * strip always did. (property only) (readonly)
+   * - `plottedColumns`: The positions of the cells in a row that hold numbers, in table order.
    *
-   * `Option` calls the same thing `active`. The focused node is found through
-   * every shadow root, as `Menu.Item` does, so a dial inside another
-   * component's shadow root still knows its current action. (property only) (readonly)
-   * - `selected`: Whether the action has focus, the same as `active`. (property only) (readonly)
+   * The same test `readSeries` applies when it drops a column of notes: a
+   * column is a series where any row parses, so a series survives one blank
+   * cell and a column of words is never one. (property only) (readonly)
+   * - `readings`: The number of readings, which the pointer position maps onto. (property only) (readonly)
+   * - `field`: The table read as a grid of heights. **The first numeric column is
+   * across, the second is in depth, and the third is the height.** A
+   * renderer reads it. (property only) (readonly)
+   * - `active`: The place the keys or the pointer rest on, as its place in `field.cells`, or `-1`. (property only) (readonly)
+   * - `whenSettled`: Resolves a frame after the first update, when transitions are switched on.
+   *
+   * **Named `whenSettled` because `settled` is taken four times over**, by
+   * Image, Splitter and both color controls, none of them about transitions. A
+   * base class takes the name every subclass then cannot use.
+   *
+   * **The state it reports cannot be watched, which is why this exists.** A
+   * custom state is deliberately not in the DOM, so there is no
+   * `MutationObserver` equivalent for `ElementInternals.states`. Await this
+   * instead.
+   *
+   * Separate from `updateComplete`, which resolves in the microtask checkpoint
+   * the suppression is still active in. That is the distinction `readyToMove`
+   * in `@fusion.dev/helix-testing` is written around.
+   *
+   * It never resolves where `requestAnimationFrame` never fires, which is a
+   * server, a hidden tab, and happy-dom. Callers that must not hang there race
+   * it against a timeout, as the happy-dom harness's `readyToMove` does. The
+   * browser harness's awaits it alone: a browser always runs the frame, and a
+   * timer beside it was a bet on how long one takes, which a busy run lost. (property only) (readonly)
+   *
+   * ## Events
+   *
+   * Events that will be emitted by the component.
+   *
+   * - `helix-plot-change`: The readings or the place the keys rest on changed, which the renderer is told. It stays on the chart.
+   * - `helix-plot-turn`: Shift with an arrow asked the view to turn, by a step across or up.
+   * - `helix-reading-change`: The reading moved, or was put away: `index` is the row, or `-1` for none or a place with no reading, with its `label` and the `pointerType` that moved it.
+   * - `helix-reading-press`: A place was clicked or pressed with Enter or Space, with the same detail as `helix-reading-change`.
+   *
+   * ## Slots
+   *
+   * Areas where markup can be added to the component.
+   *
+   * - `(default)`: The renderer's box, which the 3D drawing is made in.
+   * - `empty`: Content shown when the table has no readings. Falls back to `empty-text`.
+   * - `loading`: Content shown while `loading` is set and there are no readings yet. Falls back to `loading-text`.
+   *
+   * ## Methods
+   *
+   * Methods that can be called to access component functionality.
+   *
+   * - `seriesOf(cell: number) => number | undefined`: The palette slot for the cell at this position in a row.
+   *
+   * **A cell's place in its row is not its series' depth, and the tooltip
+   * spent a while assuming it was.** `readSeries` drops a column nothing
+   * parses and `readRows` keeps it, so one column of notes among the figures
+   * moves every column after it one color along in the bubble: a row reading
+   * `Referral 1,080` wearing series three's green beside a legend that says
+   * series three is something else, which is the one failure the dot exists
+   * to prevent.
+   *
+   * Overridden where a chart reads the table some other way. `ScatterChart`
+   * splits the first plotted column off as the measure across, so its first
+   * *plotted* series is this table's second numeric column.
+   * - `showsSeries(name: string) => boolean`: Whether the series of this name is drawn, which it is unless a legend
+   * reading the same table hid it.
+   *
+   * Asked of the table rather than of a legend, the table being the one
+   * thing the two share: see `SourceController.hide`. A series keeps its
+   * palette slot while it is hidden, so the colors of the others do not move.
+   * For a ring the names are its rows, the slices being the rows.
+   * - `showsColumn(cell: number) => boolean`: Whether the series read from the cell at this place in a row is drawn,
+   * by its column's heading. The keys and the readout pass over one a
+   * legend hid.
+   *
+   * A column's heading is the cell's name in every row, so the first row
+   * answers for the column.
+   * - `columnName(cell: number) => string`: The heading of the column at this place in a row: a cell's name is its
+   * column's heading, read from the first row that has a cell there, so a
+   * short first row does not lose the heading. `''` where no row has one.
+   * - `rendererDrawn(on = true) => void`: Says whether a renderer has drawn the surface, which hides the chart's
+   * own drawing or shows it again. Called by the connector.
+   * - `requestActive(index: number, kind: 'mouse' | 'pen' | 'touch' = 'mouse') => void`: Puts the reading on the place at `index`, or lets it go with `-1`, as a
+   * pointer resting on it in the renderer's drawing or a press there does.
+   * A touch keeps it until a tap lands elsewhere, and a mouse leaving a
+   * reading the keys moved to leaves it. Called by the connector.
+   * - `placeReading(at: { x: number; y: number } | undefined) => void`: Says where the renderer draws the reading, as fractions of the plot from
+   * its top left, or `undefined` while it draws none. The tooltip points
+   * there. Called by the connector.
+   *
+   * ## CSS Custom Properties
+   *
+   * CSS variables available for styling the component.
+   *
+   * - `--spatial-surface-chart-block-size`: How tall the plot is.
+   * - `--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.
+   * - `--spatial-surface-chart-shade`: 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.
+   *
+   * ## CSS Parts
+   *
+   * Custom selectors for styling elements within the component.
+   *
+   * - `axis-name`: A measure's name, along its edge of the box, in the chart's own drawing.
+   * - `contour`: The pieces of one contour line that cross one square of the surface, drawn under `contours` at their height, colored along the ramp by it.
+   * - `drawing`: The chart's own drawing in SVG: the box, its grid and numbers, and the surface.
+   * - `empty`: The words when the table has no readings: the `empty` slot, falling back to `empty-text`.
+   * - `face`: One square of the surface between four readings, or a triangle where one is missing, shaded by its height and by which way it faces.
+   * - `fallback`: The box the chart's own drawing fills, shown until a renderer has drawn and where none is connected. Hidden from screen readers.
+   * - `grid`: The box's edges and its grid at the ticks, in the chart's own drawing.
+   * - `live`: The readout: a polite live region that says the place the keys moved to. Hide it visually.
+   * - `loading`: The words while `loading` is set and there are no readings.
+   * - `mark`: The invisible point the tooltip is anchored to, where the renderer draws the reading.
+   * - `plot`: The box the drawing fills, which takes focus to be read by key. It is named by the host's `aria-labelledby` or `aria-label`, then by `label`, then by the caption of the table.
+   * - `ring`: The ring around the reading the pointer or the keys rest on, drawn over the surface.
+   * - `summary`: The measures, the number of readings, and the range of heights, written as a sentence for screen readers, which describes the plot. Hide it visually.
+   * - `table`: The readings as a table, for a screen reader, rendered only where they were drawn from `data`. Hide it visually.
+   * - `tick`: A number at a tick, along its edge of the box, in the chart's own drawing.
+   * - `tooltip`: The bubble, forwarded from `Tooltip`.
+   * - `tooltip-anchor`: The `Tooltip` element itself.
+   * - `tooltip-arrow`: The bubble's point, forwarded from `Tooltip`.
+   * - `tooltip-arrow-bottom`: The point while the bubble is below the reading, on its top edge. Set alongside `tooltip-arrow`.
+   * - `tooltip-arrow-left`: The point while the bubble is left of the reading, on its right edge. Set alongside `tooltip-arrow`.
+   * - `tooltip-arrow-right`: The point while the bubble is right of the reading, on its left edge. Set alongside `tooltip-arrow`.
+   * - `tooltip-arrow-top`: The point while the bubble is above the reading, on its bottom edge. Set alongside `tooltip-arrow`.
+   * - `tooltip-bottom`: The bubble while it is below the reading. Set alongside `tooltip`.
+   * - `tooltip-cell`: One column's name and value inside the tooltip.
+   * - `tooltip-cell-current`: The cell a chart's series keys rest on, which every chart's tooltip can mark. This chart marks none, since its readout says the measure. Set alongside `tooltip-cell`.
+   * - `tooltip-label`: The row's own name inside the tooltip.
+   * - `tooltip-left`: The bubble while it is left of the reading. Set alongside `tooltip`.
+   * - `tooltip-name`: A column's name inside the tooltip.
+   * - `tooltip-right`: The bubble while it is right of the reading. Set alongside `tooltip`.
+   * - `tooltip-top`: The bubble while it is above the reading. Set alongside `tooltip`.
+   * - `tooltip-value`: A column's value inside the tooltip.
+   *
+   * ## CSS States
+   *
+   * These can be used to apply styling when a component is in a given state.
+   *
+   * - `active`: While a place is shown, under the pointer or the keys.
+   * - `drawn`: While a renderer has drawn the surface, and the chart's own drawing is hidden.
+   * - `empty`: While the `empty` part stands in place of the readings.
+   * - `loading`: While the `loading` part stands in place of the readings.
+   * - `settled`: Set one frame after the first render. Transitions wait for it, so an element does not animate its own arrival.
+   */
+  "helix-spatial-surface-chart": Partial<
+    HelixSpatialSurfaceChartProps &
+      BaseProps<HelixSpatialSurfaceChart> &
+      BaseEvents<HelixSpatialSurfaceChart>
+  >;
+
+  /**
+   * Each group takes a series color from the theme, as every chart's series
+   * does, and each face of a block is that color darkened by how far it turns
+   * from the light. The chart draws the blocks in 3D in SVG, and
+   * `@fusion.dev/helix-plot` can draw them with three.js.
+   *
+   * ## Attributes & Properties
+   *
+   * Component attributes and properties that can be applied to the element or by using JavaScript.
+   *
+   * - `emphasis`: How strongly the blocks are drawn, as on every chart.
+   *
+   * `outlined` is a block as its edges in its group's color over faces faded
+   * toward the page, and `subtle` the same edges over a faint wash, which
+   * shows the blocks behind it. Absent is the filled block, per the rule that a
+   * reflected property takes no default, and `solid` writes it out. A
+   * renderer draws the blocks the same way.
+   *
+   * It composes with `material`: emphasis decides what is drawn, and material
+   * how much of it comes through. The outline on the block the keys rest on
+   * keeps its own ink.
+   * - `material`: How much of each mark comes through, as on every chart: `glass` admits the
+   * most of what is behind it, `frosted` less, and absent is opaque. The
+   * strength is the theme's, scaled by `--helix-material-opacity`.
+   * - `empty-text`/`emptyText`: The words shown in place of the drawing when the table has no readings,
+   * and the fallback of the `empty` slot.
+   * - `loading`: Whether the readings are still on their way. The chart shows
+   * `loading-text` in place of an empty drawing until it has readings.
+   *
+   * Reflected, so a stylesheet can treat the chart while it waits. A chart
+   * that already has readings keeps drawing them, so a refresh does not
+   * blank it.
+   * - `loading-text`/`loadingText`: The words shown in place of the drawing while `loading` is set and
+   * there are no readings yet, and the fallback of the `loading` slot.
+   * - `for`: The id of the table to read.
+   *
+   * Names a table in the same tree, so a chart inside another component's
+   * shadow root reads a table in that root rather than one in the document. A
+   * `<table>` or anything built from grid roles, including `helix-table`.
+   *
+   * **In React this arrives as a property and not as an attribute**, the way
+   * `Tooltip.for` does, so it does not reflect and nothing styles on it.
+   * - `label`: The chart's name, which starts the chart's text summary.
+   *
+   * Absent falls back to the table's own caption, which is usually the right
+   * words and is already written.
+   * - `locale`: The locale the chart's own numbers are written in: its axis, its
+   * percentages and its totals, such as `de` for `1.240` and `32 %`.
+   *
+   * Absent reads the nearest `lang`, then the runtime's own. The table's
+   * cells are shown as the table writes them, whatever this says.
+   * - `position-label`/`positionLabel`: Where a reading the keys moved to stands among the readings, said after
+   * it. `{position}` and `{count}` are replaced with the numbers, written in
+   * `locale`.
+   *
+   * Set it to the words of the page's language, such as `{position} von
+   * {count}`, or to nothing to say no position. A slice or a series a
+   * legend hid is not counted.
+   * - `group-by`/`groupBy`: The column of text that gathers the rows into groups, by its heading. None by default.
+   * - `no-box`/`noBox`: Draws no box: no edges, grid, numbers, or names, so the readings stand
+   * alone and fill the plot, as a picture on a product's own page does. The
+   * table, the summary, the tooltip, and the keys still carry every value,
+   * and a renderer draws no box either.
+   * - `plot-label`/`plotLabel`: The plot's name where the chart has none: no `aria-label`, `label`, or table caption.
+   * - `summary-label`/`summaryLabel`: The `summary` part's sentence. `{count}` and `{groups}` are the number
+   * of items and groups, written in the locale, and `{low}` and `{high}` the
+   * smallest and the largest size.
+   * - `data`: The readings as data, in the shape of a table, where the page has no
+   * table to point `for` at. `for` wins where both are set.
+   *
+   * ```js
+   * chart.data = {
+   *   caption: 'Sessions by channel',
+   *   columns: ['Month', 'Direct', 'Referral'],
+   *   rows: [['Jan', 10, 4], ['Feb', 20, 8]],
+   * }
+   * ```
+   *
+   * The first column holds each row's label and every column after it a
+   * series, as in a table. A cell is a number, words, `null` for a blank,
+   * or `{ value, text }` for a number shown as words, such as `$128k`. A
+   * number is shown in `locale`.
+   *
+   * **A table is still the better source where the page can show one**:
+   * it reads with no script and before hydration, and a reader can sort and
+   * copy it. Data is drawn on the client only, so a server serves the
+   * frame, and the summary, the keys and the readout are then the whole of
+   * what a screen reader is given. Set a new object to redraw: the chart
+   * does not look inside the one it has. (property only)
+   * - `series`: The table's columns, one series each. Empty when there is no table.
+   *
+   * Held by the controller between edits, so a render reading this five
+   * times parses the table once. See `SourceController.series`. (property only) (readonly)
+   * - `named`: The chart's name: an `aria-label` written on the chart, then `label`,
+   * then the table's caption.
+   *
+   * The fallback is the reason this is shared rather than copied: a caption is
+   * already written, already the right words, and already the thing a reader
+   * of the table sees. A chart that made the consumer say it twice would be
+   * asking for the second one to drift.
+   *
+   * **An `aria-label` on the chart comes first**, because it is how a page
+   * names an element, and the chart is a generic around its plot: written
+   * on the host, the name reached nobody. The plot takes it, as Heatmap's
+   * strip always did. (property only) (readonly)
+   * - `plottedColumns`: The positions of the cells in a row that hold numbers, in table order.
+   *
+   * The same test `readSeries` applies when it drops a column of notes: a
+   * column is a series where any row parses, so a series survives one blank
+   * cell and a column of words is never one. (property only) (readonly)
+   * - `readings`: The number of readings, which the pointer position maps onto. (property only) (readonly)
+   * - `field`: The table read as blocks. **The first numeric column is each block's
+   * size, and the second its height.** A renderer reads it. (property only) (readonly)
+   * - `active`: The block the keys or the pointer rest on, as its place in `field.blocks`, or `-1`. (property only) (readonly)
+   * - `whenSettled`: Resolves a frame after the first update, when transitions are switched on.
+   *
+   * **Named `whenSettled` because `settled` is taken four times over**, by
+   * Image, Splitter and both color controls, none of them about transitions. A
+   * base class takes the name every subclass then cannot use.
+   *
+   * **The state it reports cannot be watched, which is why this exists.** A
+   * custom state is deliberately not in the DOM, so there is no
+   * `MutationObserver` equivalent for `ElementInternals.states`. Await this
+   * instead.
+   *
+   * Separate from `updateComplete`, which resolves in the microtask checkpoint
+   * the suppression is still active in. That is the distinction `readyToMove`
+   * in `@fusion.dev/helix-testing` is written around.
+   *
+   * It never resolves where `requestAnimationFrame` never fires, which is a
+   * server, a hidden tab, and happy-dom. Callers that must not hang there race
+   * it against a timeout, as the happy-dom harness's `readyToMove` does. The
+   * browser harness's awaits it alone: a browser always runs the frame, and a
+   * timer beside it was a bet on how long one takes, which a busy run lost. (property only) (readonly)
+   *
+   * ## Events
+   *
+   * Events that will be emitted by the component.
+   *
+   * - `helix-plot-change`: The blocks or the block the keys rest on changed, which the renderer is told. It stays on the chart.
+   * - `helix-plot-turn`: Shift with an arrow asked the view to turn, by a step across or up.
+   * - `helix-reading-change`: The reading moved, or was put away: `index` is the row, or `-1` for none, with its `label` and the `pointerType` that moved it.
+   * - `helix-reading-press`: A block was clicked or pressed with Enter or Space, with the same detail as `helix-reading-change`.
+   *
+   * ## Slots
+   *
+   * Areas where markup can be added to the component.
+   *
+   * - `(default)`: The renderer's box, which the 3D drawing is made in.
+   * - `empty`: Content shown when the table has no readings. Falls back to `empty-text`.
+   * - `loading`: Content shown while `loading` is set and there are no readings yet. Falls back to `loading-text`.
+   *
+   * ## Methods
+   *
+   * Methods that can be called to access component functionality.
+   *
+   * - `seriesOf(cell: number) => number | undefined`: The palette slot for the cell at this position in a row.
+   *
+   * **A cell's place in its row is not its series' depth, and the tooltip
+   * spent a while assuming it was.** `readSeries` drops a column nothing
+   * parses and `readRows` keeps it, so one column of notes among the figures
+   * moves every column after it one color along in the bubble: a row reading
+   * `Referral 1,080` wearing series three's green beside a legend that says
+   * series three is something else, which is the one failure the dot exists
+   * to prevent.
+   *
+   * Overridden where a chart reads the table some other way. `ScatterChart`
+   * splits the first plotted column off as the measure across, so its first
+   * *plotted* series is this table's second numeric column.
+   * - `showsSeries(name: string) => boolean`: Whether the series of this name is drawn, which it is unless a legend
+   * reading the same table hid it.
+   *
+   * Asked of the table rather than of a legend, the table being the one
+   * thing the two share: see `SourceController.hide`. A series keeps its
+   * palette slot while it is hidden, so the colors of the others do not move.
+   * For a ring the names are its rows, the slices being the rows.
+   * - `showsColumn(cell: number) => boolean`: Whether the series read from the cell at this place in a row is drawn,
+   * by its column's heading. The keys and the readout pass over one a
+   * legend hid.
+   *
+   * A column's heading is the cell's name in every row, so the first row
+   * answers for the column.
+   * - `columnName(cell: number) => string`: The heading of the column at this place in a row: a cell's name is its
+   * column's heading, read from the first row that has a cell there, so a
+   * short first row does not lose the heading. `''` where no row has one.
+   * - `rendererDrawn(on = true) => void`: Says whether a renderer has drawn the blocks, which hides the chart's own
+   * drawing or shows it again. Called by the connector.
+   * - `requestActive(index: number, kind: 'mouse' | 'pen' | 'touch' = 'mouse') => void`: Puts the reading on the block at `index`, or lets it go with `-1`, as a
+   * pointer resting on it in the renderer's drawing or a press there does.
+   * A touch keeps it until a tap lands elsewhere, and a mouse leaving a
+   * reading the keys moved to leaves it. Called by the connector.
+   * - `placeReading(at: { x: number; y: number } | undefined) => void`: Says where the renderer draws the reading, as fractions of the plot from
+   * its top left, or `undefined` while it draws none. The tooltip points
+   * there. Called by the connector.
+   *
+   * ## CSS Custom Properties
+   *
+   * CSS variables available for styling the component.
+   *
+   * - `--spatial-treemap-block-size`: How tall the plot is.
+   * - `--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
+   *
+   * Custom selectors for styling elements within the component.
+   *
+   * - `axis-name`: The height's name, along its edge of the box, in the chart's own drawing.
+   * - `block`: One block, its faces in its group's color.
+   * - `block-active`: The block the pointer or the keys rest on. Set alongside `block`.
+   * - `drawing`: The chart's own drawing in SVG: the box, its grid and numbers, and the blocks.
+   * - `empty`: The words when the table has no readings: the `empty` slot, falling back to `empty-text`.
+   * - `face`: One face of a block the view shows, shaded by which way it faces.
+   * - `fallback`: The box the chart's own drawing fills, shown until a renderer has drawn and where none is connected. Hidden from screen readers.
+   * - `grid`: The box's edges and its grid, in the chart's own drawing.
+   * - `live`: The readout: a polite live region that says the item the keys moved to. Hide it visually.
+   * - `loading`: The words while `loading` is set and there are no readings.
+   * - `mark`: The invisible point the tooltip is anchored to, where the renderer draws the reading.
+   * - `plot`: The box the drawing fills, which takes focus to be read by key. It is named by the host's `aria-labelledby` or `aria-label`, then by `label`, then by the caption of the table.
+   * - `ring`: The outline around the block the pointer or the keys rest on, painted after it, so the blocks in front of it cover it.
+   * - `summary`: The number of items and groups and the range of their sizes, written as a sentence for screen readers, which describes the plot. Hide it visually.
+   * - `table`: The readings as a table, for a screen reader, rendered only where they were drawn from `data`. Hide it visually.
+   * - `tick`: A height at a tick, along its edge of the box, in the chart's own drawing.
+   * - `tooltip`: The bubble, forwarded from `Tooltip`.
+   * - `tooltip-anchor`: The `Tooltip` element itself.
+   * - `tooltip-arrow`: The bubble's point, forwarded from `Tooltip`.
+   * - `tooltip-arrow-bottom`: The point while the bubble is below the reading, on its top edge. Set alongside `tooltip-arrow`.
+   * - `tooltip-arrow-left`: The point while the bubble is left of the reading, on its right edge. Set alongside `tooltip-arrow`.
+   * - `tooltip-arrow-right`: The point while the bubble is right of the reading, on its left edge. Set alongside `tooltip-arrow`.
+   * - `tooltip-arrow-top`: The point while the bubble is above the reading, on its bottom edge. Set alongside `tooltip-arrow`.
+   * - `tooltip-bottom`: The bubble while it is below the reading. Set alongside `tooltip`.
+   * - `tooltip-cell`: One column's name and value inside the tooltip.
+   * - `tooltip-cell-current`: The cell a chart's series keys rest on, which every chart's tooltip can mark. This chart marks none, since its readout says the measure. Set alongside `tooltip-cell`.
+   * - `tooltip-label`: The row's own name inside the tooltip.
+   * - `tooltip-left`: The bubble while it is left of the reading. Set alongside `tooltip`.
+   * - `tooltip-name`: A column's name inside the tooltip.
+   * - `tooltip-right`: The bubble while it is right of the reading. Set alongside `tooltip`.
+   * - `tooltip-top`: The bubble while it is above the reading. Set alongside `tooltip`.
+   * - `tooltip-value`: A column's value inside the tooltip.
+   *
+   * ## CSS States
+   *
+   * These can be used to apply styling when a component is in a given state.
+   *
+   * - `active`: While a block is shown, under the pointer or the keys.
+   * - `drawn`: While a renderer has drawn the blocks, and the chart's own drawing is hidden.
+   * - `empty`: While the `empty` part stands in place of the readings.
+   * - `loading`: While the `loading` part stands in place of the readings.
+   * - `settled`: Set one frame after the first render. Transitions wait for it, so an element does not animate its own arrival.
+   */
+  "helix-spatial-treemap": Partial<
+    HelixSpatialTreemapProps & BaseProps<HelixSpatialTreemap> & BaseEvents<HelixSpatialTreemap>
+  >;
+
+  /**
+   * A column of actions with its name above them, in the small muted words a
+   * menu heads its sections with, lined up on the side the trigger is on. The
+   * space between two groups is the space between two actions.
+   *
+   * ## Attributes & Properties
+   *
+   * Component attributes and properties that can be applied to the element or by using JavaScript.
+   *
+   * - `label`: The group's name, drawn above its actions and read by screen readers.
+   * - `whenSettled`: Resolves a frame after the first update, when transitions are switched on.
+   *
+   * **Named `whenSettled` because `settled` is taken four times over**, by
+   * Image, Splitter and both color controls, none of them about transitions. A
+   * base class takes the name every subclass then cannot use.
+   *
+   * **The state it reports cannot be watched, which is why this exists.** A
+   * custom state is deliberately not in the DOM, so there is no
+   * `MutationObserver` equivalent for `ElementInternals.states`. Await this
+   * instead.
+   *
+   * Separate from `updateComplete`, which resolves in the microtask checkpoint
+   * the suppression is still active in. That is the distinction `readyToMove`
+   * in `@fusion.dev/helix-testing` is written around.
+   *
+   * It never resolves where `requestAnimationFrame` never fires, which is a
+   * server, a hidden tab, and happy-dom. Callers that must not hang there race
+   * it against a timeout, as the happy-dom harness's `readyToMove` does. The
+   * browser harness's awaits it alone: a browser always runs the frame, and a
+   * timer beside it was a bet on how long one takes, which a busy run lost. (property only) (readonly)
+   *
+   * ## Slots
+   *
+   * Areas where markup can be added to the component.
+   *
+   * - `(default)`: The group's actions.
+   * - `label`: The group's name, for content richer than the `label` text.
+   *
+   * ## CSS Custom Properties
+   *
+   * CSS variables available for styling the component.
+   *
+   * - `--speed-dial-group-label-color`: Color of the group's name.
+   * - `--speed-dial-group-label-font-size`: Size of the group's name.
+   *
+   * ## CSS Parts
+   *
+   * Custom selectors for styling elements within the component.
+   *
+   * - `group`: The set, which carries the `group` role.
+   * - `label`: The group's name, drawn above its actions while there is one.
+   *
+   * ## CSS States
+   *
+   * These can be used to apply styling when a component is in a given state.
+   *
+   * - `settled`: Set one frame after the first render. Transitions wait for it, so an element does not animate its own arrival.
+   */
+  "helix-speed-dial-group": Partial<
+    HelixSpeedDialGroupProps & BaseProps<HelixSpeedDialGroup> & BaseEvents<HelixSpeedDialGroup>
+  >;
+
+  /**
+   * Presentation only: a round mark the size of a small control, with the name on
+   * a chip beside it so it stays readable over whatever the dial floats over. The
+   * base class handles its behavior.
+   *
+   * ## Attributes & Properties
+   *
+   * Component attributes and properties that can be applied to the element or by using JavaScript.
+   *
+   * - `disabled`: Whether the action is disabled, so it cannot be chosen.
+   * - `download`: Whether the link downloads the file when the action is chosen. Only
+   * meaningful beside an `href`, and only for a file served from the page's
+   * origin.
+   * - `href`: The URL the action links to. Setting it draws the action as a link.
+   * - `rel`: The link's `rel`. Set it whenever you set `target="_blank"`.
+   * - `shortcut`: The action's keyboard shortcut as a chord, such as `mod+s`, carried as
+   * `aria-keyshortcuts` and drawn after the name. `mod` is Command on an Apple
+   * keyboard and Control elsewhere. Showing a shortcut does not bind it.
+   * - `target`: Where the link opens, such as `_blank` for a new tab.
+   * - `value`: The action's value, sent in `helix-select` when the action is chosen.
+   * - `active`: Whether the action has focus, which makes it the action the keyboard is on.
+   *
+   * `Option` calls the same thing `active`. The focused node is found through
+   * every shadow root, as `Menu.Item` does, so a dial inside another
+   * component's shadow root still knows its current action. (property only) (readonly)
+   * - `selected`: Whether the action has focus, the same as `active`. (property only) (readonly)
    * - `whenSettled`: Resolves a frame after the first update, when transitions are switched on.
    *
    * **Named `whenSettled` because `settled` is taken four times over**, by
@@ -73407,6 +75508,12 @@ export type CustomElements = {
    * permitted is the browser's policy, and what follows a refused autoplay is a
    * paused player showing its start control, which is the correct thing to be
    * looking at.
+   *
+   * **Not where the reader asked for less motion**, or while the page has
+   * paused its motion, through `pauseMotion` or `Motion Toggle`: the player
+   * waits on its start control. A page that pauses its motion pauses a video
+   * that started itself, and one that lets it run again plays it again. A
+   * video the reader started is theirs, and neither touches it.
    * - `captions-hidden-label`/`captionsHiddenLabel`: What the live region says when `c` turns captions off.
    * - `captions-label`/`captionsLabel`: The name of the captions control when the video has one track. The control
    * turns that track on and off.
@@ -77822,6 +79929,12 @@ export type CustomElementsSolidJs = {
    * arrived at by two defaults rather than by a rule about the pair, so moving
    * one leaves the other alone.
    * - `autoplay`: Whether the carousel advances on its own.
+   *
+   * **Not where the reader asked for less motion**, or where the page has
+   * paused its motion, through `pauseMotion` or `Motion Toggle`: the carousel
+   * starts still, and its rotation control starts it. A page that pauses its
+   * motion later stops the rotation, and one that lets it run again starts it
+   * again, unless the reader stopped it.
    * - `controls`: Whether the previous and next controls are shown.
    *
    * `auto`, which is the resting behavior and what an absent attribute means,
@@ -85383,6 +87496,9 @@ export type CustomElementsSolidJs = {
    * - `selection-label`/`selectionLabel`: What screen readers hear after a reader selects a note, in the list or in
    * the drawing, with `{note}` for its name and `{count}` for how many notes
    * the list then holds, written with `count-label`.
+   * - `settling-label`/`settlingLabel`: What the `settling` part says while a layout runs unseen, where the reader
+   * asked for less motion or the page paused its motion.
+   * - `stop-layout-label`/`stopLayoutLabel`: What the button that stops a long layout says.
    * - `two-finger-hint-label`/`twoFingerHintLabel`: The hint shown when one finger swipes over the graph with `gestures="cooperative"`.
    * - `using-label`/`usingLabel`: The line shown while the graph, with `gestures="activate"`, has the gestures.
    * - `walk-label`/`walkLabel`: What screen readers hear when a walk along the links moves to a note:
@@ -85484,6 +87600,15 @@ export type CustomElementsSolidJs = {
    * `helix-graph-layout` for the page to keep. Called by `connectGraph` once
    * its layout has settled; a page laying out its own graph calls it the same
    * way.
+   * - `settling(stop?: () => void, unseen = false) => void`: Says a layout is running, with what ends it where the notes stand, or
+   * with nothing, that it has ended. Called by `connectGraph`.
+   *
+   * **A layout that runs past five seconds offers a button that stops it**,
+   * the `stop-layout` part, as WCAG 2.2.2 asks of motion that starts by itself
+   * and runs that long. **`unseen` hides the drawing while the notes move**,
+   * which the connector asks for where the reader asked for less motion or
+   * the page paused its motion: the `settling` part says the notes are being
+   * placed, and the drawing shows them where they settle.
    * - `signal(from: string, to: string, options: { tone?: GraphSignalDetail['tone'] } = {}) => void`: Shows something passing from one note to another, such as a message, a
    * request or a payment, drawn traveling along the drawing and arriving with
    * a pulse. `tone` says what it means and colors it. Call it as often as
@@ -85559,7 +87684,9 @@ export type CustomElementsSolidJs = {
    * - `region`: The frame: the drawing, its controls and the list.
    * - `search`: The bar holding the icon, the search field and the count.
    * - `search-field`: The field that finds a note by its name.
+   * - `settling`: What is said while a layout runs unseen, where the reader asked for less motion or the page paused its motion, over the hidden drawing.
    * - `stage`: The drawing and its controls.
+   * - `stop-layout`: The button that stops a layout that has run past five seconds, where the notes stand.
    * - `viewport`: The box the renderer draws in.
    * - `zoom-in`: The zoom in button.
    * - `zoom-out`: The zoom out button.
@@ -85577,6 +87704,8 @@ export type CustomElementsSolidJs = {
    * - `ready`: The graph has been drawn whole, after `helix-graph-ready`.
    * - `searching`: The search field holds words, and the list holds only the notes they find.
    * - `selected`: A note is selected, in the list or in the drawing.
+   * - `settling`: A layout is running.
+   * - `settling-unseen`: A layout is running with the drawing hidden, where the reader asked for less motion or the page paused its motion.
    * - `sharing`: The page keeps the plain wheel and one finger, with `gestures="cooperative"` or while a graph with `gestures="activate"` waits to be pressed.
    * - `using`: A graph with `gestures="activate"` has been pressed and has the gestures.
    * - `settled`: Set one frame after the first render. Transitions wait for it, so an element does not animate its own arrival.
@@ -85715,6 +87844,19 @@ export type CustomElementsSolidJs = {
    *
    * Component attributes and properties that can be applied to the element or by using JavaScript.
    *
+   * - `emphasis`: How strongly the cells are drawn, as on every chart.
+   *
+   * `outlined` is a cell as its edge in its tone over a fill faded toward the
+   * page, and `subtle` a faint wash of the tone under the same edge. Absent is
+   * the filled cell, per the rule that a reflected property takes no default,
+   * and `solid` writes it out.
+   *
+   * It composes with `material`: emphasis decides what is drawn, and material
+   * how much of it comes through. The ring on the cell the keys rest on keeps
+   * its own ink.
+   * - `material`: How much of each mark comes through, as on every chart: `glass` admits the
+   * most of what is behind it, `frosted` less, and absent is opaque. The
+   * strength is the theme's, scaled by `--helix-material-opacity`.
    * - `empty-text`/`emptyText`: The words shown in place of the drawing when the table has no readings,
    * and the fallback of the `empty` slot.
    * - `loading`: Whether the readings are still on their way. The chart shows
@@ -90742,6 +92884,77 @@ export type CustomElementsSolidJs = {
       BaseEvents<HelixMeter>
   >;
 
+  /**
+   * A quiet square button, as the controls over a map are, with the pause icon
+   * while motion runs and the play icon while it is paused. Text slotted into
+   * it stands beside the icon.
+   *
+   * ## Attributes & Properties
+   *
+   * Component attributes and properties that can be applied to the element or by using JavaScript.
+   *
+   * - `label`: The button's name, which stays the same whichever way it stands.
+   * - `whenSettled`: Resolves a frame after the first update, when transitions are switched on.
+   *
+   * **Named `whenSettled` because `settled` is taken four times over**, by
+   * Image, Splitter and both color controls, none of them about transitions. A
+   * base class takes the name every subclass then cannot use.
+   *
+   * **The state it reports cannot be watched, which is why this exists.** A
+   * custom state is deliberately not in the DOM, so there is no
+   * `MutationObserver` equivalent for `ElementInternals.states`. Await this
+   * instead.
+   *
+   * Separate from `updateComplete`, which resolves in the microtask checkpoint
+   * the suppression is still active in. That is the distinction `readyToMove`
+   * in `@fusion.dev/helix-testing` is written around.
+   *
+   * It never resolves where `requestAnimationFrame` never fires, which is a
+   * server, a hidden tab, and happy-dom. Callers that must not hang there race
+   * it against a timeout, as the happy-dom harness's `readyToMove` does. The
+   * browser harness's awaits it alone: a browser always runs the frame, and a
+   * timer beside it was a bet on how long one takes, which a busy run lost. (property only) (readonly)
+   *
+   * ## Events
+   *
+   * Events that will be emitted by the component.
+   *
+   * - `change`: Fired after a press pauses the page's motion or lets it run.
+   *
+   * ## Slots
+   *
+   * Areas where markup can be added to the component.
+   *
+   * - `(default)`: The button's text, where it shows more than its icon. Defaults to nothing, the icon alone, named by `label`.
+   * - `icon`: Replaces the icon, which is pause while motion runs and play while it is paused.
+   *
+   * ## CSS Custom Properties
+   *
+   * CSS variables available for styling the component.
+   *
+   * - `--motion-toggle-background-color`: The button's fill. Defaults to the floating overlay surface.
+   *
+   * ## CSS Parts
+   *
+   * Custom selectors for styling elements within the component.
+   *
+   * - `button`: The toggle button, with `aria-pressed` while the page's motion is paused.
+   * - `icon`: The icon inside the button.
+   *
+   * ## CSS States
+   *
+   * These can be used to apply styling when a component is in a given state.
+   *
+   * - `paused`: The page's motion is paused.
+   * - `settled`: Set one frame after the first render. Transitions wait for it, so an element does not animate its own arrival.
+   */
+  "helix-motion-toggle": Partial<
+    HelixMotionToggleProps &
+      HelixMotionToggleSolidJsProps &
+      BaseProps<HelixMotionToggle> &
+      BaseEvents<HelixMotionToggle>
+  >;
+
   /**
    * One marker moves to the current destination. A moving marker is easier to
    * follow than a background that switches from one item to another, and the
@@ -97098,6 +99311,263 @@ export type CustomElementsSolidJs = {
       BaseEvents<HelixSparkline>
   >;
 
+  /**
+   * Each series takes a series color from the theme, as every chart's series
+   * does, and each face of a bar is that color darkened by how far it turns
+   * from the light. The chart draws the bars in 3D in SVG, and
+   * `@fusion.dev/helix-plot` can draw them with three.js.
+   *
+   * ## Attributes & Properties
+   *
+   * Component attributes and properties that can be applied to the element or by using JavaScript.
+   *
+   * - `emphasis`: How strongly the bars are drawn, as on every chart.
+   *
+   * `outlined` is a bar as its edges in its series' color over faces faded
+   * toward the page, and `subtle` the same edges over a faint wash, which
+   * shows the bars behind it. Absent is the filled bar, per the rule that a
+   * reflected property takes no default, and `solid` writes it out. A
+   * renderer draws the bars the same way.
+   *
+   * It composes with `material`: emphasis decides what is drawn, and material
+   * how much of it comes through. The outline on the bar the keys rest on
+   * keeps its own ink.
+   * - `material`: How much of each mark comes through, as on every chart: `glass` admits the
+   * most of what is behind it, `frosted` less, and absent is opaque. The
+   * strength is the theme's, scaled by `--helix-material-opacity`.
+   * - `empty-text`/`emptyText`: The words shown in place of the drawing when the table has no readings,
+   * and the fallback of the `empty` slot.
+   * - `loading`: Whether the readings are still on their way. The chart shows
+   * `loading-text` in place of an empty drawing until it has readings.
+   *
+   * Reflected, so a stylesheet can treat the chart while it waits. A chart
+   * that already has readings keeps drawing them, so a refresh does not
+   * blank it.
+   * - `loading-text`/`loadingText`: The words shown in place of the drawing while `loading` is set and
+   * there are no readings yet, and the fallback of the `loading` slot.
+   * - `for`: The id of the table to read.
+   *
+   * Names a table in the same tree, so a chart inside another component's
+   * shadow root reads a table in that root rather than one in the document. A
+   * `<table>` or anything built from grid roles, including `helix-table`.
+   *
+   * **In React this arrives as a property and not as an attribute**, the way
+   * `Tooltip.for` does, so it does not reflect and nothing styles on it.
+   * - `label`: The chart's name, which starts the chart's text summary.
+   *
+   * Absent falls back to the table's own caption, which is usually the right
+   * words and is already written.
+   * - `locale`: The locale the chart's own numbers are written in: its axis, its
+   * percentages and its totals, such as `de` for `1.240` and `32 %`.
+   *
+   * Absent reads the nearest `lang`, then the runtime's own. The table's
+   * cells are shown as the table writes them, whatever this says.
+   * - `position-label`/`positionLabel`: Where a reading the keys moved to stands among the readings, said after
+   * it. `{position}` and `{count}` are replaced with the numbers, written in
+   * `locale`.
+   *
+   * Set it to the words of the page's language, such as `{position} von
+   * {count}`, or to nothing to say no position. A slice or a series a
+   * legend hid is not counted.
+   * - `no-box`/`noBox`: Draws no box: no edges, grid, numbers, or names, so the readings stand
+   * alone and fill the plot, as a picture on a product's own page does. The
+   * table, the summary, the tooltip, and the keys still carry every value,
+   * and a renderer draws no box either.
+   * - `open-label`/`openLabel`: What the readout says for a place with no value. `{category}` and
+   * `{series}` name the place.
+   * - `plot-label`/`plotLabel`: The plot's name where the chart has none: no `aria-label`, `label`, or table caption.
+   * - `summary-label`/`summaryLabel`: The `summary` part's sentence. `{count}`, `{series}`, and `{categories}`
+   * are the number of bars, series, and categories, written in the locale,
+   * and `{low}` and `{high}` the lowest and the highest value.
+   * - `data`: The readings as data, in the shape of a table, where the page has no
+   * table to point `for` at. `for` wins where both are set.
+   *
+   * ```js
+   * chart.data = {
+   *   caption: 'Sessions by channel',
+   *   columns: ['Month', 'Direct', 'Referral'],
+   *   rows: [['Jan', 10, 4], ['Feb', 20, 8]],
+   * }
+   * ```
+   *
+   * The first column holds each row's label and every column after it a
+   * series, as in a table. A cell is a number, words, `null` for a blank,
+   * or `{ value, text }` for a number shown as words, such as `$128k`. A
+   * number is shown in `locale`.
+   *
+   * **A table is still the better source where the page can show one**:
+   * it reads with no script and before hydration, and a reader can sort and
+   * copy it. Data is drawn on the client only, so a server serves the
+   * frame, and the summary, the keys and the readout are then the whole of
+   * what a screen reader is given. Set a new object to redraw: the chart
+   * does not look inside the one it has. (property only)
+   * - `series`: The table's columns, one series each. Empty when there is no table.
+   *
+   * Held by the controller between edits, so a render reading this five
+   * times parses the table once. See `SourceController.series`. (property only) (readonly)
+   * - `named`: The chart's name: an `aria-label` written on the chart, then `label`,
+   * then the table's caption.
+   *
+   * The fallback is the reason this is shared rather than copied: a caption is
+   * already written, already the right words, and already the thing a reader
+   * of the table sees. A chart that made the consumer say it twice would be
+   * asking for the second one to drift.
+   *
+   * **An `aria-label` on the chart comes first**, because it is how a page
+   * names an element, and the chart is a generic around its plot: written
+   * on the host, the name reached nobody. The plot takes it, as Heatmap's
+   * strip always did. (property only) (readonly)
+   * - `plottedColumns`: The positions of the cells in a row that hold numbers, in table order.
+   *
+   * The same test `readSeries` applies when it drops a column of notes: a
+   * column is a series where any row parses, so a series survives one blank
+   * cell and a column of words is never one. (property only) (readonly)
+   * - `readings`: The number of readings, which the pointer position maps onto. (property only) (readonly)
+   * - `field`: The table read as bars. **Each row is a category, and each numeric
+   * column a series.** A renderer reads it. (property only) (readonly)
+   * - `active`: The bar the keys or the pointer rest on, as its place in `field.cells`, or `-1`. (property only) (readonly)
+   * - `whenSettled`: Resolves a frame after the first update, when transitions are switched on.
+   *
+   * **Named `whenSettled` because `settled` is taken four times over**, by
+   * Image, Splitter and both color controls, none of them about transitions. A
+   * base class takes the name every subclass then cannot use.
+   *
+   * **The state it reports cannot be watched, which is why this exists.** A
+   * custom state is deliberately not in the DOM, so there is no
+   * `MutationObserver` equivalent for `ElementInternals.states`. Await this
+   * instead.
+   *
+   * Separate from `updateComplete`, which resolves in the microtask checkpoint
+   * the suppression is still active in. That is the distinction `readyToMove`
+   * in `@fusion.dev/helix-testing` is written around.
+   *
+   * It never resolves where `requestAnimationFrame` never fires, which is a
+   * server, a hidden tab, and happy-dom. Callers that must not hang there race
+   * it against a timeout, as the happy-dom harness's `readyToMove` does. The
+   * browser harness's awaits it alone: a browser always runs the frame, and a
+   * timer beside it was a bet on how long one takes, which a busy run lost. (property only) (readonly)
+   *
+   * ## Events
+   *
+   * Events that will be emitted by the component.
+   *
+   * - `helix-plot-change`: The bars or the bar the keys rest on changed, which the renderer is told. It stays on the chart.
+   * - `helix-plot-turn`: Shift with an arrow asked the view to turn, by a step across or up.
+   * - `helix-reading-change`: The reading moved, or was put away: `index` is the row, or `-1` for none, with its `label` and the `pointerType` that moved it.
+   * - `helix-reading-press`: A bar was clicked or pressed with Enter or Space, with the same detail as `helix-reading-change`.
+   *
+   * ## Slots
+   *
+   * Areas where markup can be added to the component.
+   *
+   * - `(default)`: The renderer's box, which the 3D drawing is made in.
+   * - `empty`: Content shown when the table has no readings. Falls back to `empty-text`.
+   * - `loading`: Content shown while `loading` is set and there are no readings yet. Falls back to `loading-text`.
+   *
+   * ## Methods
+   *
+   * Methods that can be called to access component functionality.
+   *
+   * - `seriesOf(cell: number) => number | undefined`: The palette slot for the cell at this position in a row.
+   *
+   * **A cell's place in its row is not its series' depth, and the tooltip
+   * spent a while assuming it was.** `readSeries` drops a column nothing
+   * parses and `readRows` keeps it, so one column of notes among the figures
+   * moves every column after it one color along in the bubble: a row reading
+   * `Referral 1,080` wearing series three's green beside a legend that says
+   * series three is something else, which is the one failure the dot exists
+   * to prevent.
+   *
+   * Overridden where a chart reads the table some other way. `ScatterChart`
+   * splits the first plotted column off as the measure across, so its first
+   * *plotted* series is this table's second numeric column.
+   * - `showsSeries(name: string) => boolean`: Whether the series of this name is drawn, which it is unless a legend
+   * reading the same table hid it.
+   *
+   * Asked of the table rather than of a legend, the table being the one
+   * thing the two share: see `SourceController.hide`. A series keeps its
+   * palette slot while it is hidden, so the colors of the others do not move.
+   * For a ring the names are its rows, the slices being the rows.
+   * - `showsColumn(cell: number) => boolean`: Whether the series read from the cell at this place in a row is drawn,
+   * by its column's heading. The keys and the readout pass over one a
+   * legend hid.
+   *
+   * A column's heading is the cell's name in every row, so the first row
+   * answers for the column.
+   * - `columnName(cell: number) => string`: The heading of the column at this place in a row: a cell's name is its
+   * column's heading, read from the first row that has a cell there, so a
+   * short first row does not lose the heading. `''` where no row has one.
+   * - `rendererDrawn(on = true) => void`: Says whether a renderer has drawn the bars, which hides the chart's own
+   * drawing or shows it again. Called by the connector.
+   * - `requestActive(index: number, kind: 'mouse' | 'pen' | 'touch' = 'mouse') => void`: Puts the reading on the bar at `index`, or lets it go with `-1`, as a
+   * pointer resting on it in the renderer's drawing or a press there does.
+   * A touch keeps it until a tap lands elsewhere, and a mouse leaving a
+   * reading the keys moved to leaves it. Called by the connector.
+   * - `placeReading(at: { x: number; y: number } | undefined) => void`: Says where the renderer draws the reading, as fractions of the plot from
+   * its top left, or `undefined` while it draws none. The tooltip points
+   * there. Called by the connector.
+   *
+   * ## CSS Custom Properties
+   *
+   * CSS variables available for styling the component.
+   *
+   * - `--spatial-bar-chart-block-size`: How tall the plot is.
+   * - `--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
+   *
+   * Custom selectors for styling elements within the component.
+   *
+   * - `axis-name`: A measure's name, along its edge of the box, in the chart's own drawing.
+   * - `bar`: One bar, its faces in its series' color.
+   * - `bar-active`: The bar the pointer or the keys rest on. Set alongside `bar`.
+   * - `drawing`: The chart's own drawing in SVG: the box, its grid and names, and the bars.
+   * - `empty`: The words when the table has no readings: the `empty` slot, falling back to `empty-text`.
+   * - `face`: One face of a bar the view shows, shaded by which way it faces.
+   * - `fallback`: The box the chart's own drawing fills, shown until a renderer has drawn and where none is connected. Hidden from screen readers.
+   * - `grid`: The box's edges and its grid, in the chart's own drawing.
+   * - `live`: The readout: a polite live region that says the bar the keys moved to. Hide it visually.
+   * - `loading`: The words while `loading` is set and there are no readings.
+   * - `mark`: The invisible point the tooltip is anchored to, where the renderer draws the reading.
+   * - `plot`: The box the drawing fills, which takes focus to be read by key. It is named by the host's `aria-labelledby` or `aria-label`, then by `label`, then by the caption of the table.
+   * - `ring`: The outline around the bar the pointer or the keys rest on, painted after it, so the bars in front of it cover it.
+   * - `summary`: The number of bars, series, and categories, and the range of values, written as a sentence for screen readers, which describes the plot. Hide it visually.
+   * - `table`: The readings as a table, for a screen reader, rendered only where they were drawn from `data`. Hide it visually.
+   * - `tick`: A category's or a series' name, or a value at a tick, along its edge of the box, in the chart's own drawing.
+   * - `tooltip`: The bubble, forwarded from `Tooltip`.
+   * - `tooltip-anchor`: The `Tooltip` element itself.
+   * - `tooltip-arrow`: The bubble's point, forwarded from `Tooltip`.
+   * - `tooltip-arrow-bottom`: The point while the bubble is below the reading, on its top edge. Set alongside `tooltip-arrow`.
+   * - `tooltip-arrow-left`: The point while the bubble is left of the reading, on its right edge. Set alongside `tooltip-arrow`.
+   * - `tooltip-arrow-right`: The point while the bubble is right of the reading, on its left edge. Set alongside `tooltip-arrow`.
+   * - `tooltip-arrow-top`: The point while the bubble is above the reading, on its bottom edge. Set alongside `tooltip-arrow`.
+   * - `tooltip-bottom`: The bubble while it is below the reading. Set alongside `tooltip`.
+   * - `tooltip-cell`: One column's name and value inside the tooltip.
+   * - `tooltip-cell-current`: The cell a chart's series keys rest on, which every chart's tooltip can mark. This chart marks none, since its readout says the measure. Set alongside `tooltip-cell`.
+   * - `tooltip-label`: The row's own name inside the tooltip.
+   * - `tooltip-left`: The bubble while it is left of the reading. Set alongside `tooltip`.
+   * - `tooltip-name`: A column's name inside the tooltip.
+   * - `tooltip-right`: The bubble while it is right of the reading. Set alongside `tooltip`.
+   * - `tooltip-top`: The bubble while it is above the reading. Set alongside `tooltip`.
+   * - `tooltip-value`: A column's value inside the tooltip.
+   *
+   * ## CSS States
+   *
+   * These can be used to apply styling when a component is in a given state.
+   *
+   * - `active`: While a bar is shown, under the pointer or the keys.
+   * - `drawn`: While a renderer has drawn the bars, and the chart's own drawing is hidden.
+   * - `empty`: While the `empty` part stands in place of the readings.
+   * - `loading`: While the `loading` part stands in place of the readings.
+   * - `settled`: Set one frame after the first render. Transitions wait for it, so an element does not animate its own arrival.
+   */
+  "helix-spatial-bar-chart": Partial<
+    HelixSpatialBarChartProps &
+      HelixSpatialBarChartSolidJsProps &
+      BaseProps<HelixSpatialBarChart> &
+      BaseEvents<HelixSpatialBarChart>
+  >;
+
   /**
    * Each reading is a prism. The top face takes the cell's tone, and the two
    * sides are the same tone, shaded darker, so the whole relief follows your
@@ -97112,6 +99582,20 @@ export type CustomElementsSolidJs = {
    *
    * Component attributes and properties that can be applied to the element or by using JavaScript.
    *
+   * - `emphasis`: How strongly the prisms are drawn, as on every chart.
+   *
+   * `outlined` is a prism as its edges in its tone over faces faded toward the
+   * page, and `subtle` a faint wash of the tone under the same edges, which
+   * shows the prisms behind it. Absent is the filled prism, per the rule that
+   * a reflected property takes no default, and `solid` writes it out. A
+   * renderer draws the prisms the same way.
+   *
+   * It composes with `material`: emphasis decides what is drawn, and material
+   * how much of it comes through. The ring on the prism the keys rest on keeps
+   * its own ink.
+   * - `material`: How much of each mark comes through, as on every chart: `glass` admits the
+   * most of what is behind it, `frosted` less, and absent is opaque. The
+   * strength is the theme's, scaled by `--helix-material-opacity`.
    * - `flat`: Draws every prism at no height, so the tones lie on a plane.
    * - `relief`: How tall the highest reading stands, in cells. Every other reading stands
    * at its share of it.
@@ -97463,6 +99947,262 @@ export type CustomElementsSolidJs = {
       BaseEvents<HelixSpatialHeatmap>
   >;
 
+  /**
+   * Each series takes a series color from the theme, as every chart's series
+   * does, and each face of a ribbon is that color darkened by how far it turns
+   * from the light. The chart draws the ribbons in 3D in SVG, and
+   * `@fusion.dev/helix-plot` can draw them with three.js.
+   *
+   * ## Attributes & Properties
+   *
+   * Component attributes and properties that can be applied to the element or by using JavaScript.
+   *
+   * - `emphasis`: How strongly the ribbons are drawn, as on every chart.
+   *
+   * `outlined` is a ribbon as its edges in its series' color over faces
+   * faded toward the page, and `subtle` the same edges over a faint wash,
+   * which shows the ribbons behind it. Absent is the filled ribbon, per the
+   * rule that a reflected property takes no default, and `solid` writes it
+   * out. A renderer draws the ribbons the same way.
+   *
+   * It composes with `material`: emphasis decides what is drawn, and material
+   * how much of it comes through. The ring on the reading the keys rest on
+   * keeps its own ink.
+   * - `material`: How much of each mark comes through, as on every chart: `glass` admits the
+   * most of what is behind it, `frosted` less, and absent is opaque. The
+   * strength is the theme's, scaled by `--helix-material-opacity`.
+   * - `empty-text`/`emptyText`: The words shown in place of the drawing when the table has no readings,
+   * and the fallback of the `empty` slot.
+   * - `loading`: Whether the readings are still on their way. The chart shows
+   * `loading-text` in place of an empty drawing until it has readings.
+   *
+   * Reflected, so a stylesheet can treat the chart while it waits. A chart
+   * that already has readings keeps drawing them, so a refresh does not
+   * blank it.
+   * - `loading-text`/`loadingText`: The words shown in place of the drawing while `loading` is set and
+   * there are no readings yet, and the fallback of the `loading` slot.
+   * - `for`: The id of the table to read.
+   *
+   * Names a table in the same tree, so a chart inside another component's
+   * shadow root reads a table in that root rather than one in the document. A
+   * `<table>` or anything built from grid roles, including `helix-table`.
+   *
+   * **In React this arrives as a property and not as an attribute**, the way
+   * `Tooltip.for` does, so it does not reflect and nothing styles on it.
+   * - `label`: The chart's name, which starts the chart's text summary.
+   *
+   * Absent falls back to the table's own caption, which is usually the right
+   * words and is already written.
+   * - `locale`: The locale the chart's own numbers are written in: its axis, its
+   * percentages and its totals, such as `de` for `1.240` and `32 %`.
+   *
+   * Absent reads the nearest `lang`, then the runtime's own. The table's
+   * cells are shown as the table writes them, whatever this says.
+   * - `position-label`/`positionLabel`: Where a reading the keys moved to stands among the readings, said after
+   * it. `{position}` and `{count}` are replaced with the numbers, written in
+   * `locale`.
+   *
+   * Set it to the words of the page's language, such as `{position} von
+   * {count}`, or to nothing to say no position. A slice or a series a
+   * legend hid is not counted.
+   * - `no-box`/`noBox`: Draws no box: no edges, grid, numbers, or names, so the readings stand
+   * alone and fill the plot, as a picture on a product's own page does. The
+   * table, the summary, the tooltip, and the keys still carry every value,
+   * and a renderer draws no box either.
+   * - `open-label`/`openLabel`: What the readout says for a reading the table has no value for.
+   * `{place}` and `{series}` name it.
+   * - `plot-label`/`plotLabel`: The plot's name where the chart has none: no `aria-label`, `label`, or table caption.
+   * - `summary-label`/`summaryLabel`: The `summary` part's sentence. `{count}`, `{series}`, and `{places}` are
+   * the number of readings, series, and places, written in the locale,
+   * and `{low}` and `{high}` the lowest and the highest value.
+   * - `data`: The readings as data, in the shape of a table, where the page has no
+   * table to point `for` at. `for` wins where both are set.
+   *
+   * ```js
+   * chart.data = {
+   *   caption: 'Sessions by channel',
+   *   columns: ['Month', 'Direct', 'Referral'],
+   *   rows: [['Jan', 10, 4], ['Feb', 20, 8]],
+   * }
+   * ```
+   *
+   * The first column holds each row's label and every column after it a
+   * series, as in a table. A cell is a number, words, `null` for a blank,
+   * or `{ value, text }` for a number shown as words, such as `$128k`. A
+   * number is shown in `locale`.
+   *
+   * **A table is still the better source where the page can show one**:
+   * it reads with no script and before hydration, and a reader can sort and
+   * copy it. Data is drawn on the client only, so a server serves the
+   * frame, and the summary, the keys and the readout are then the whole of
+   * what a screen reader is given. Set a new object to redraw: the chart
+   * does not look inside the one it has. (property only)
+   * - `series`: The table's columns, one series each. Empty when there is no table.
+   *
+   * Held by the controller between edits, so a render reading this five
+   * times parses the table once. See `SourceController.series`. (property only) (readonly)
+   * - `named`: The chart's name: an `aria-label` written on the chart, then `label`,
+   * then the table's caption.
+   *
+   * The fallback is the reason this is shared rather than copied: a caption is
+   * already written, already the right words, and already the thing a reader
+   * of the table sees. A chart that made the consumer say it twice would be
+   * asking for the second one to drift.
+   *
+   * **An `aria-label` on the chart comes first**, because it is how a page
+   * names an element, and the chart is a generic around its plot: written
+   * on the host, the name reached nobody. The plot takes it, as Heatmap's
+   * strip always did. (property only) (readonly)
+   * - `plottedColumns`: The positions of the cells in a row that hold numbers, in table order.
+   *
+   * The same test `readSeries` applies when it drops a column of notes: a
+   * column is a series where any row parses, so a series survives one blank
+   * cell and a column of words is never one. (property only) (readonly)
+   * - `readings`: The number of readings, which the pointer position maps onto. (property only) (readonly)
+   * - `field`: The table read as ribbons. **Each row is a place across, and each
+   * numeric column a series.** A renderer reads it. (property only) (readonly)
+   * - `active`: The reading the keys or the pointer rest on, as its place in `field.cells`, or `-1`. (property only) (readonly)
+   * - `whenSettled`: Resolves a frame after the first update, when transitions are switched on.
+   *
+   * **Named `whenSettled` because `settled` is taken four times over**, by
+   * Image, Splitter and both color controls, none of them about transitions. A
+   * base class takes the name every subclass then cannot use.
+   *
+   * **The state it reports cannot be watched, which is why this exists.** A
+   * custom state is deliberately not in the DOM, so there is no
+   * `MutationObserver` equivalent for `ElementInternals.states`. Await this
+   * instead.
+   *
+   * Separate from `updateComplete`, which resolves in the microtask checkpoint
+   * the suppression is still active in. That is the distinction `readyToMove`
+   * in `@fusion.dev/helix-testing` is written around.
+   *
+   * It never resolves where `requestAnimationFrame` never fires, which is a
+   * server, a hidden tab, and happy-dom. Callers that must not hang there race
+   * it against a timeout, as the happy-dom harness's `readyToMove` does. The
+   * browser harness's awaits it alone: a browser always runs the frame, and a
+   * timer beside it was a bet on how long one takes, which a busy run lost. (property only) (readonly)
+   *
+   * ## Events
+   *
+   * Events that will be emitted by the component.
+   *
+   * - `helix-plot-change`: The readings or the reading the keys rest on changed, which the renderer is told. It stays on the chart.
+   * - `helix-plot-turn`: Shift with an arrow asked the view to turn, by a step across or up.
+   * - `helix-reading-change`: The reading moved, or was put away: `index` is the row, or `-1` for none, with its `label` and the `pointerType` that moved it.
+   * - `helix-reading-press`: A reading was clicked or pressed with Enter or Space, with the same detail as `helix-reading-change`.
+   *
+   * ## Slots
+   *
+   * Areas where markup can be added to the component.
+   *
+   * - `(default)`: The renderer's box, which the 3D drawing is made in.
+   * - `empty`: Content shown when the table has no readings. Falls back to `empty-text`.
+   * - `loading`: Content shown while `loading` is set and there are no readings yet. Falls back to `loading-text`.
+   *
+   * ## Methods
+   *
+   * Methods that can be called to access component functionality.
+   *
+   * - `seriesOf(cell: number) => number | undefined`: The palette slot for the cell at this position in a row.
+   *
+   * **A cell's place in its row is not its series' depth, and the tooltip
+   * spent a while assuming it was.** `readSeries` drops a column nothing
+   * parses and `readRows` keeps it, so one column of notes among the figures
+   * moves every column after it one color along in the bubble: a row reading
+   * `Referral 1,080` wearing series three's green beside a legend that says
+   * series three is something else, which is the one failure the dot exists
+   * to prevent.
+   *
+   * Overridden where a chart reads the table some other way. `ScatterChart`
+   * splits the first plotted column off as the measure across, so its first
+   * *plotted* series is this table's second numeric column.
+   * - `showsSeries(name: string) => boolean`: Whether the series of this name is drawn, which it is unless a legend
+   * reading the same table hid it.
+   *
+   * Asked of the table rather than of a legend, the table being the one
+   * thing the two share: see `SourceController.hide`. A series keeps its
+   * palette slot while it is hidden, so the colors of the others do not move.
+   * For a ring the names are its rows, the slices being the rows.
+   * - `showsColumn(cell: number) => boolean`: Whether the series read from the cell at this place in a row is drawn,
+   * by its column's heading. The keys and the readout pass over one a
+   * legend hid.
+   *
+   * A column's heading is the cell's name in every row, so the first row
+   * answers for the column.
+   * - `columnName(cell: number) => string`: The heading of the column at this place in a row: a cell's name is its
+   * column's heading, read from the first row that has a cell there, so a
+   * short first row does not lose the heading. `''` where no row has one.
+   * - `rendererDrawn(on = true) => void`: Says whether a renderer has drawn the ribbons, which hides the chart's own
+   * drawing or shows it again. Called by the connector.
+   * - `requestActive(index: number, kind: 'mouse' | 'pen' | 'touch' = 'mouse') => void`: Puts the reading on the one at `index`, or lets it go with `-1`, as a
+   * pointer resting on it in the renderer's drawing or a press there does.
+   * A touch keeps it until a tap lands elsewhere, and a mouse leaving a
+   * reading the keys moved to leaves it. Called by the connector.
+   * - `placeReading(at: { x: number; y: number } | undefined) => void`: Says where the renderer draws the reading, as fractions of the plot from
+   * its top left, or `undefined` while it draws none. The tooltip points
+   * there. Called by the connector.
+   *
+   * ## CSS Custom Properties
+   *
+   * CSS variables available for styling the component.
+   *
+   * - `--spatial-ribbon-chart-block-size`: How tall the plot is.
+   * - `--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
+   *
+   * Custom selectors for styling elements within the component.
+   *
+   * - `axis-name`: A measure's name, along its edge of the box, in the chart's own drawing.
+   * - `drawing`: The chart's own drawing in SVG: the box, its grid and names, and the ribbons.
+   * - `empty`: The words when the table has no readings: the `empty` slot, falling back to `empty-text`.
+   * - `face`: One face of a ribbon the view shows: a piece of its top, an end, or its side, shaded by how far it turns from the light.
+   * - `fallback`: The box the chart's own drawing fills, shown until a renderer has drawn and where none is connected. Hidden from screen readers.
+   * - `grid`: The box's edges and its grid, in the chart's own drawing.
+   * - `live`: The readout: a polite live region that says the reading the keys moved to. Hide it visually.
+   * - `loading`: The words while `loading` is set and there are no readings.
+   * - `mark`: The invisible point the tooltip is anchored to, where the renderer draws the reading.
+   * - `plot`: The box the drawing fills, which takes focus to be read by key. It is named by the host's `aria-labelledby` or `aria-label`, then by `label`, then by the caption of the table.
+   * - `ribbon`: One ribbon, its faces in its series' color.
+   * - `ring`: The ring around the reading the pointer or the keys rest on, drawn over the ribbons.
+   * - `summary`: The number of readings, series, and places, and the range of values, written as a sentence for screen readers, which describes the plot. Hide it visually.
+   * - `table`: The readings as a table, for a screen reader, rendered only where they were drawn from `data`. Hide it visually.
+   * - `tick`: A place's or a series' name, or a value at a tick, along its edge of the box, in the chart's own drawing.
+   * - `tooltip`: The bubble, forwarded from `Tooltip`.
+   * - `tooltip-anchor`: The `Tooltip` element itself.
+   * - `tooltip-arrow`: The bubble's point, forwarded from `Tooltip`.
+   * - `tooltip-arrow-bottom`: The point while the bubble is below the reading, on its top edge. Set alongside `tooltip-arrow`.
+   * - `tooltip-arrow-left`: The point while the bubble is left of the reading, on its right edge. Set alongside `tooltip-arrow`.
+   * - `tooltip-arrow-right`: The point while the bubble is right of the reading, on its left edge. Set alongside `tooltip-arrow`.
+   * - `tooltip-arrow-top`: The point while the bubble is above the reading, on its bottom edge. Set alongside `tooltip-arrow`.
+   * - `tooltip-bottom`: The bubble while it is below the reading. Set alongside `tooltip`.
+   * - `tooltip-cell`: One column's name and value inside the tooltip.
+   * - `tooltip-cell-current`: The cell a chart's series keys rest on, which every chart's tooltip can mark. This chart marks none, since its readout says the measure. Set alongside `tooltip-cell`.
+   * - `tooltip-label`: The row's own name inside the tooltip.
+   * - `tooltip-left`: The bubble while it is left of the reading. Set alongside `tooltip`.
+   * - `tooltip-name`: A column's name inside the tooltip.
+   * - `tooltip-right`: The bubble while it is right of the reading. Set alongside `tooltip`.
+   * - `tooltip-top`: The bubble while it is above the reading. Set alongside `tooltip`.
+   * - `tooltip-value`: A column's value inside the tooltip.
+   *
+   * ## CSS States
+   *
+   * These can be used to apply styling when a component is in a given state.
+   *
+   * - `active`: While a reading is shown, under the pointer or the keys.
+   * - `drawn`: While a renderer has drawn the ribbons, and the chart's own drawing is hidden.
+   * - `empty`: While the `empty` part stands in place of the readings.
+   * - `loading`: While the `loading` part stands in place of the readings.
+   * - `settled`: Set one frame after the first render. Transitions wait for it, so an element does not animate its own arrival.
+   */
+  "helix-spatial-ribbon-chart": Partial<
+    HelixSpatialRibbonChartProps &
+      HelixSpatialRibbonChartSolidJsProps &
+      BaseProps<HelixSpatialRibbonChart> &
+      BaseEvents<HelixSpatialRibbonChart>
+  >;
+
   /**
    * The chart draws the points in 3D in SVG, and `@fusion.dev/helix-plot` can
    * draw them with three.js. Each group takes a series color from the theme, as
@@ -97472,6 +100212,19 @@ export type CustomElementsSolidJs = {
    *
    * Component attributes and properties that can be applied to the element or by using JavaScript.
    *
+   * - `emphasis`: How strongly the points are drawn, as on every chart.
+   *
+   * `outlined` is a point as a ring in its group's color over a dot faded
+   * toward the page, and `subtle` the same ring over a faint dot. Absent is
+   * the filled dot, per the rule that a reflected property takes no default,
+   * and `solid` writes it out. A renderer draws the points the same way.
+   *
+   * It composes with `material`: emphasis decides what is drawn, and material
+   * how much of it comes through. The ring on the point the keys rest on keeps
+   * its own ink.
+   * - `material`: How much of each mark comes through, as on every chart: `glass` admits the
+   * most of what is behind it, `frosted` less, and absent is opaque. The
+   * strength is the theme's, scaled by `--helix-material-opacity`.
    * - `empty-text`/`emptyText`: The words shown in place of the drawing when the table has no readings,
    * and the fallback of the `empty` slot.
    * - `loading`: Whether the readings are still on their way. The chart shows
@@ -97506,7 +100259,14 @@ export type CustomElementsSolidJs = {
    * Set it to the words of the page's language, such as `{position} von
    * {count}`, or to nothing to say no position. A slice or a series a
    * legend hid is not counted.
+   * - `drop-lines`/`dropLines`: Draws a line from each point straight down to the floor of the box, in
+   * its group's color, so where a point stands across and in depth reads off
+   * the floor's grid. A renderer draws them too.
    * - `group-by`/`groupBy`: The column of text that puts each point in a group, by its heading. None by default.
+   * - `no-box`/`noBox`: Draws no box: no edges, grid, numbers, or names, so the readings stand
+   * alone and fill the plot, as a picture on a product's own page does. The
+   * table, the summary, the tooltip, and the keys still carry every value,
+   * and a renderer draws no box either.
    * - `plot-label`/`plotLabel`: The plot's name where the chart has none: no `aria-label`, `label`, or table caption.
    * - `summary-label`/`summaryLabel`: The `summary` part's sentence. `{count}` is the number of points, written
    * in the locale, and `{x}`, `{y}`, and `{z}` are the three measures' names.
@@ -97583,250 +100343,531 @@ export type CustomElementsSolidJs = {
    *
    * Events that will be emitted by the component.
    *
-   * - `helix-plot-change`: The points or the point the keys rest on changed, which the renderer is told. It stays on the chart.
+   * - `helix-plot-change`: The points or the point the keys rest on changed, which the renderer is told. It stays on the chart.
+   * - `helix-plot-turn`: Shift with an arrow asked the view to turn, by a step across or up.
+   * - `helix-reading-change`: The reading moved, or was put away: `index` is the row, or `-1` for none, with its `label` and the `pointerType` that moved it.
+   * - `helix-reading-press`: A point was clicked, tapped, or pressed with Enter or Space, with the same detail as `helix-reading-change`.
+   *
+   * ## Slots
+   *
+   * Areas where markup can be added to the component.
+   *
+   * - `(default)`: The renderer's box, which the 3D drawing is made in.
+   * - `empty`: Content shown when the table has no points. Falls back to `empty-text`.
+   * - `loading`: Content shown while `loading` is set and there are no points yet. Falls back to `loading-text`.
+   *
+   * ## Methods
+   *
+   * Methods that can be called to access component functionality.
+   *
+   * - `seriesOf(cell: number) => number | undefined`: The palette slot for the cell at this position in a row.
+   *
+   * **A cell's place in its row is not its series' depth, and the tooltip
+   * spent a while assuming it was.** `readSeries` drops a column nothing
+   * parses and `readRows` keeps it, so one column of notes among the figures
+   * moves every column after it one color along in the bubble: a row reading
+   * `Referral 1,080` wearing series three's green beside a legend that says
+   * series three is something else, which is the one failure the dot exists
+   * to prevent.
+   *
+   * Overridden where a chart reads the table some other way. `ScatterChart`
+   * splits the first plotted column off as the measure across, so its first
+   * *plotted* series is this table's second numeric column.
+   * - `showsSeries(name: string) => boolean`: Whether the series of this name is drawn, which it is unless a legend
+   * reading the same table hid it.
+   *
+   * Asked of the table rather than of a legend, the table being the one
+   * thing the two share: see `SourceController.hide`. A series keeps its
+   * palette slot while it is hidden, so the colors of the others do not move.
+   * For a ring the names are its rows, the slices being the rows.
+   * - `showsColumn(cell: number) => boolean`: Whether the series read from the cell at this place in a row is drawn,
+   * by its column's heading. The keys and the readout pass over one a
+   * legend hid.
+   *
+   * A column's heading is the cell's name in every row, so the first row
+   * answers for the column.
+   * - `columnName(cell: number) => string`: The heading of the column at this place in a row: a cell's name is its
+   * column's heading, read from the first row that has a cell there, so a
+   * short first row does not lose the heading. `''` where no row has one.
+   * - `rendererDrawn(on = true) => void`: Says whether a renderer has drawn the points, which hides the chart's
+   * own drawing or shows it again. Called by the connector.
+   * - `requestActive(index: number, kind: 'mouse' | 'pen' | 'touch' = 'mouse') => void`: Puts the reading on the point at `index`, or lets it go with `-1`, as a
+   * pointer resting on it in the renderer's drawing or a press there does.
+   * A touch keeps it until a tap lands elsewhere, and a mouse leaving a
+   * reading the keys moved to leaves it. Called by the connector.
+   * - `placeReading(at: { x: number; y: number } | undefined) => void`: Says where the renderer draws the reading, as fractions of the plot from
+   * its top left, or `undefined` while it draws none. The tooltip points
+   * there. Called by the connector.
+   *
+   * ## CSS Custom Properties
+   *
+   * CSS variables available for styling the component.
+   *
+   * - `--spatial-scatter-chart-block-size`: How tall the plot is.
+   *
+   * ## CSS Parts
+   *
+   * Custom selectors for styling elements within the component.
+   *
+   * - `axis-name`: A measure's name, along its edge of the box, in the chart's own drawing.
+   * - `drawing`: The chart's own drawing in SVG: the box, its grid and numbers, and the points.
+   * - `drop-line`: The line from a point straight down to the floor of the box, drawn under `drop-lines`, in its group's color.
+   * - `empty`: The words when the table has no points: the `empty` slot, falling back to `empty-text`.
+   * - `fallback`: The box the chart's own drawing fills, shown until a renderer has drawn and where none is connected. Hidden from screen readers.
+   * - `grid`: The box's edges and its grid at the ticks, in the chart's own drawing.
+   * - `live`: The readout: a polite live region that says the point the keys moved to. Hide it visually.
+   * - `loading`: The words while `loading` is set and there are no points.
+   * - `mark`: The invisible point the tooltip is anchored to, where the renderer draws the reading.
+   * - `plot`: The box the drawing fills, which takes focus to be read by key. It is named by the host's `aria-labelledby` or `aria-label`, then by `label`, then by the caption of the table.
+   * - `point`: One point of the chart's own drawing.
+   * - `point-active`: The point the pointer or the keys rest on, in the chart's own drawing. Set alongside `point`.
+   * - `ring`: The ring around the point the pointer or the keys rest on, drawn over every point.
+   * - `summary`: The three measures and the number of points, written as a sentence for screen readers, which describes the plot. Hide it visually.
+   * - `table`: The readings as a table, for a screen reader, rendered only where they were drawn from `data`. Hide it visually.
+   * - `tick`: A number at a tick, along its edge of the box, in the chart's own drawing.
+   * - `tooltip`: The bubble, forwarded from `Tooltip`.
+   * - `tooltip-anchor`: The `Tooltip` element itself.
+   * - `tooltip-arrow`: The bubble's point, forwarded from `Tooltip`.
+   * - `tooltip-arrow-bottom`: The point while the bubble is below the reading, on its top edge. Set alongside `tooltip-arrow`.
+   * - `tooltip-arrow-left`: The point while the bubble is left of the reading, on its right edge. Set alongside `tooltip-arrow`.
+   * - `tooltip-arrow-right`: The point while the bubble is right of the reading, on its left edge. Set alongside `tooltip-arrow`.
+   * - `tooltip-arrow-top`: The point while the bubble is above the reading, on its bottom edge. Set alongside `tooltip-arrow`.
+   * - `tooltip-bottom`: The bubble while it is below the reading. Set alongside `tooltip`.
+   * - `tooltip-cell`: One column's name and value inside the tooltip.
+   * - `tooltip-cell-current`: The cell a chart's series keys rest on, which every chart's tooltip can mark. This chart marks none, since its readout says the measure. Set alongside `tooltip-cell`.
+   * - `tooltip-label`: The row's own name inside the tooltip.
+   * - `tooltip-left`: The bubble while it is left of the reading. Set alongside `tooltip`.
+   * - `tooltip-name`: A column's name inside the tooltip.
+   * - `tooltip-right`: The bubble while it is right of the reading. Set alongside `tooltip`.
+   * - `tooltip-top`: The bubble while it is above the reading. Set alongside `tooltip`.
+   * - `tooltip-value`: A column's value inside the tooltip.
+   *
+   * ## CSS States
+   *
+   * These can be used to apply styling when a component is in a given state.
+   *
+   * - `active`: While a point is shown, under the pointer or the keys.
+   * - `drawn`: While a renderer has drawn the points, and the chart's own drawing is hidden.
+   * - `empty`: While the `empty` part stands in place of the points.
+   * - `loading`: While the `loading` part stands in place of the points.
+   * - `settled`: Set one frame after the first render. Transitions wait for it, so an element does not animate its own arrival.
+   */
+  "helix-spatial-scatter-chart": Partial<
+    HelixSpatialScatterChartProps &
+      HelixSpatialScatterChartSolidJsProps &
+      BaseProps<HelixSpatialScatterChart> &
+      BaseEvents<HelixSpatialScatterChart>
+  >;
+
+  /**
+   * The chart draws the surface in 3D in SVG, and `@fusion.dev/helix-plot` can
+   * draw it with three.js. Every height is shaded along one
+   * ramp from the theme's primary color, quiet where it is low and strong where
+   * it is high, so the two drawings agree.
+   *
+   * ## Attributes & Properties
+   *
+   * Component attributes and properties that can be applied to the element or by using JavaScript.
+   *
+   * - `emphasis`: How strongly the surface is drawn, as on every chart.
+   *
+   * `outlined` is a wireframe in the ramp's colors over a surface faded toward
+   * the page, and `subtle` the same wireframe over a faint surface that the
+   * grid behind shows through, so a reading the surface hid from this side can
+   * be seen. Absent is the filled surface, per the rule that a reflected
+   * property takes no default, and `solid` writes it out. A renderer draws the
+   * surface the same way.
+   *
+   * It composes with `material`: emphasis decides what is drawn, and material
+   * how much of it comes through. The ring on the reading the keys rest on
+   * keeps its own ink.
+   * - `material`: How much of each mark comes through, as on every chart: `glass` admits the
+   * most of what is behind it, `frosted` less, and absent is opaque. The
+   * strength is the theme's, scaled by `--helix-material-opacity`.
+   * - `empty-text`/`emptyText`: The words shown in place of the drawing when the table has no readings,
+   * and the fallback of the `empty` slot.
+   * - `loading`: Whether the readings are still on their way. The chart shows
+   * `loading-text` in place of an empty drawing until it has readings.
+   *
+   * Reflected, so a stylesheet can treat the chart while it waits. A chart
+   * that already has readings keeps drawing them, so a refresh does not
+   * blank it.
+   * - `loading-text`/`loadingText`: The words shown in place of the drawing while `loading` is set and
+   * there are no readings yet, and the fallback of the `loading` slot.
+   * - `for`: The id of the table to read.
+   *
+   * Names a table in the same tree, so a chart inside another component's
+   * shadow root reads a table in that root rather than one in the document. A
+   * `<table>` or anything built from grid roles, including `helix-table`.
+   *
+   * **In React this arrives as a property and not as an attribute**, the way
+   * `Tooltip.for` does, so it does not reflect and nothing styles on it.
+   * - `label`: The chart's name, which starts the chart's text summary.
+   *
+   * Absent falls back to the table's own caption, which is usually the right
+   * words and is already written.
+   * - `locale`: The locale the chart's own numbers are written in: its axis, its
+   * percentages and its totals, such as `de` for `1.240` and `32 %`.
+   *
+   * Absent reads the nearest `lang`, then the runtime's own. The table's
+   * cells are shown as the table writes them, whatever this says.
+   * - `position-label`/`positionLabel`: Where a reading the keys moved to stands among the readings, said after
+   * it. `{position}` and `{count}` are replaced with the numbers, written in
+   * `locale`.
+   *
+   * Set it to the words of the page's language, such as `{position} von
+   * {count}`, or to nothing to say no position. A slice or a series a
+   * legend hid is not counted.
+   * - `contours`: Draws the surface's contour lines on it, at each tick of its height, in
+   * the ramp's colors, so its shape reads as on a map and two places at the
+   * same height read as such. A renderer draws them too.
+   * - `no-box`/`noBox`: Draws no box: no edges, grid, numbers, or names, so the readings stand
+   * alone and fill the plot, as a picture on a product's own page does. The
+   * table, the summary, the tooltip, and the keys still carry every value,
+   * and a renderer draws no box either.
+   * - `open-label`/`openLabel`: What the readout says for a place with no reading. `{x}` and `{z}` are
+   * the place's numbers across and in depth, and `{across}` and `{depth}`
+   * the two measures' names.
+   * - `plot-label`/`plotLabel`: The plot's name where the chart has none: no `aria-label`, `label`, or table caption.
+   * - `summary-label`/`summaryLabel`: The `summary` part's sentence. `{count}` is the number of readings,
+   * written in the locale, `{x}`, `{z}`, and `{y}` are the measures across,
+   * in depth, and up, and `{low}` and `{high}` the lowest and the highest
+   * reading.
+   * - `data`: The readings as data, in the shape of a table, where the page has no
+   * table to point `for` at. `for` wins where both are set.
+   *
+   * ```js
+   * chart.data = {
+   *   caption: 'Sessions by channel',
+   *   columns: ['Month', 'Direct', 'Referral'],
+   *   rows: [['Jan', 10, 4], ['Feb', 20, 8]],
+   * }
+   * ```
+   *
+   * The first column holds each row's label and every column after it a
+   * series, as in a table. A cell is a number, words, `null` for a blank,
+   * or `{ value, text }` for a number shown as words, such as `$128k`. A
+   * number is shown in `locale`.
+   *
+   * **A table is still the better source where the page can show one**:
+   * it reads with no script and before hydration, and a reader can sort and
+   * copy it. Data is drawn on the client only, so a server serves the
+   * frame, and the summary, the keys and the readout are then the whole of
+   * what a screen reader is given. Set a new object to redraw: the chart
+   * does not look inside the one it has. (property only)
+   * - `series`: The table's columns, one series each. Empty when there is no table.
+   *
+   * Held by the controller between edits, so a render reading this five
+   * times parses the table once. See `SourceController.series`. (property only) (readonly)
+   * - `named`: The chart's name: an `aria-label` written on the chart, then `label`,
+   * then the table's caption.
+   *
+   * The fallback is the reason this is shared rather than copied: a caption is
+   * already written, already the right words, and already the thing a reader
+   * of the table sees. A chart that made the consumer say it twice would be
+   * asking for the second one to drift.
+   *
+   * **An `aria-label` on the chart comes first**, because it is how a page
+   * names an element, and the chart is a generic around its plot: written
+   * on the host, the name reached nobody. The plot takes it, as Heatmap's
+   * strip always did. (property only) (readonly)
+   * - `plottedColumns`: The positions of the cells in a row that hold numbers, in table order.
+   *
+   * The same test `readSeries` applies when it drops a column of notes: a
+   * column is a series where any row parses, so a series survives one blank
+   * cell and a column of words is never one. (property only) (readonly)
+   * - `readings`: The number of readings, which the pointer position maps onto. (property only) (readonly)
+   * - `field`: The table read as a grid of heights. **The first numeric column is
+   * across, the second is in depth, and the third is the height.** A
+   * renderer reads it. (property only) (readonly)
+   * - `active`: The place the keys or the pointer rest on, as its place in `field.cells`, or `-1`. (property only) (readonly)
+   * - `whenSettled`: Resolves a frame after the first update, when transitions are switched on.
+   *
+   * **Named `whenSettled` because `settled` is taken four times over**, by
+   * Image, Splitter and both color controls, none of them about transitions. A
+   * base class takes the name every subclass then cannot use.
+   *
+   * **The state it reports cannot be watched, which is why this exists.** A
+   * custom state is deliberately not in the DOM, so there is no
+   * `MutationObserver` equivalent for `ElementInternals.states`. Await this
+   * instead.
+   *
+   * Separate from `updateComplete`, which resolves in the microtask checkpoint
+   * the suppression is still active in. That is the distinction `readyToMove`
+   * in `@fusion.dev/helix-testing` is written around.
+   *
+   * It never resolves where `requestAnimationFrame` never fires, which is a
+   * server, a hidden tab, and happy-dom. Callers that must not hang there race
+   * it against a timeout, as the happy-dom harness's `readyToMove` does. The
+   * browser harness's awaits it alone: a browser always runs the frame, and a
+   * timer beside it was a bet on how long one takes, which a busy run lost. (property only) (readonly)
+   *
+   * ## Events
+   *
+   * Events that will be emitted by the component.
+   *
+   * - `helix-plot-change`: The readings or the place the keys rest on changed, which the renderer is told. It stays on the chart.
+   * - `helix-plot-turn`: Shift with an arrow asked the view to turn, by a step across or up.
+   * - `helix-reading-change`: The reading moved, or was put away: `index` is the row, or `-1` for none or a place with no reading, with its `label` and the `pointerType` that moved it.
+   * - `helix-reading-press`: A place was clicked or pressed with Enter or Space, with the same detail as `helix-reading-change`.
+   *
+   * ## Slots
+   *
+   * Areas where markup can be added to the component.
+   *
+   * - `(default)`: The renderer's box, which the 3D drawing is made in.
+   * - `empty`: Content shown when the table has no readings. Falls back to `empty-text`.
+   * - `loading`: Content shown while `loading` is set and there are no readings yet. Falls back to `loading-text`.
+   *
+   * ## Methods
+   *
+   * Methods that can be called to access component functionality.
+   *
+   * - `seriesOf(cell: number) => number | undefined`: The palette slot for the cell at this position in a row.
+   *
+   * **A cell's place in its row is not its series' depth, and the tooltip
+   * spent a while assuming it was.** `readSeries` drops a column nothing
+   * parses and `readRows` keeps it, so one column of notes among the figures
+   * moves every column after it one color along in the bubble: a row reading
+   * `Referral 1,080` wearing series three's green beside a legend that says
+   * series three is something else, which is the one failure the dot exists
+   * to prevent.
+   *
+   * Overridden where a chart reads the table some other way. `ScatterChart`
+   * splits the first plotted column off as the measure across, so its first
+   * *plotted* series is this table's second numeric column.
+   * - `showsSeries(name: string) => boolean`: Whether the series of this name is drawn, which it is unless a legend
+   * reading the same table hid it.
+   *
+   * Asked of the table rather than of a legend, the table being the one
+   * thing the two share: see `SourceController.hide`. A series keeps its
+   * palette slot while it is hidden, so the colors of the others do not move.
+   * For a ring the names are its rows, the slices being the rows.
+   * - `showsColumn(cell: number) => boolean`: Whether the series read from the cell at this place in a row is drawn,
+   * by its column's heading. The keys and the readout pass over one a
+   * legend hid.
+   *
+   * A column's heading is the cell's name in every row, so the first row
+   * answers for the column.
+   * - `columnName(cell: number) => string`: The heading of the column at this place in a row: a cell's name is its
+   * column's heading, read from the first row that has a cell there, so a
+   * short first row does not lose the heading. `''` where no row has one.
+   * - `rendererDrawn(on = true) => void`: Says whether a renderer has drawn the surface, which hides the chart's
+   * own drawing or shows it again. Called by the connector.
+   * - `requestActive(index: number, kind: 'mouse' | 'pen' | 'touch' = 'mouse') => void`: Puts the reading on the place at `index`, or lets it go with `-1`, as a
+   * pointer resting on it in the renderer's drawing or a press there does.
+   * A touch keeps it until a tap lands elsewhere, and a mouse leaving a
+   * reading the keys moved to leaves it. Called by the connector.
+   * - `placeReading(at: { x: number; y: number } | undefined) => void`: Says where the renderer draws the reading, as fractions of the plot from
+   * its top left, or `undefined` while it draws none. The tooltip points
+   * there. Called by the connector.
+   *
+   * ## CSS Custom Properties
+   *
+   * CSS variables available for styling the component.
+   *
+   * - `--spatial-surface-chart-block-size`: How tall the plot is.
+   * - `--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.
+   * - `--spatial-surface-chart-shade`: 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.
+   *
+   * ## CSS Parts
+   *
+   * Custom selectors for styling elements within the component.
+   *
+   * - `axis-name`: A measure's name, along its edge of the box, in the chart's own drawing.
+   * - `contour`: The pieces of one contour line that cross one square of the surface, drawn under `contours` at their height, colored along the ramp by it.
+   * - `drawing`: The chart's own drawing in SVG: the box, its grid and numbers, and the surface.
+   * - `empty`: The words when the table has no readings: the `empty` slot, falling back to `empty-text`.
+   * - `face`: One square of the surface between four readings, or a triangle where one is missing, shaded by its height and by which way it faces.
+   * - `fallback`: The box the chart's own drawing fills, shown until a renderer has drawn and where none is connected. Hidden from screen readers.
+   * - `grid`: The box's edges and its grid at the ticks, in the chart's own drawing.
+   * - `live`: The readout: a polite live region that says the place the keys moved to. Hide it visually.
+   * - `loading`: The words while `loading` is set and there are no readings.
+   * - `mark`: The invisible point the tooltip is anchored to, where the renderer draws the reading.
+   * - `plot`: The box the drawing fills, which takes focus to be read by key. It is named by the host's `aria-labelledby` or `aria-label`, then by `label`, then by the caption of the table.
+   * - `ring`: The ring around the reading the pointer or the keys rest on, drawn over the surface.
+   * - `summary`: The measures, the number of readings, and the range of heights, written as a sentence for screen readers, which describes the plot. Hide it visually.
+   * - `table`: The readings as a table, for a screen reader, rendered only where they were drawn from `data`. Hide it visually.
+   * - `tick`: A number at a tick, along its edge of the box, in the chart's own drawing.
+   * - `tooltip`: The bubble, forwarded from `Tooltip`.
+   * - `tooltip-anchor`: The `Tooltip` element itself.
+   * - `tooltip-arrow`: The bubble's point, forwarded from `Tooltip`.
+   * - `tooltip-arrow-bottom`: The point while the bubble is below the reading, on its top edge. Set alongside `tooltip-arrow`.
+   * - `tooltip-arrow-left`: The point while the bubble is left of the reading, on its right edge. Set alongside `tooltip-arrow`.
+   * - `tooltip-arrow-right`: The point while the bubble is right of the reading, on its left edge. Set alongside `tooltip-arrow`.
+   * - `tooltip-arrow-top`: The point while the bubble is above the reading, on its bottom edge. Set alongside `tooltip-arrow`.
+   * - `tooltip-bottom`: The bubble while it is below the reading. Set alongside `tooltip`.
+   * - `tooltip-cell`: One column's name and value inside the tooltip.
+   * - `tooltip-cell-current`: The cell a chart's series keys rest on, which every chart's tooltip can mark. This chart marks none, since its readout says the measure. Set alongside `tooltip-cell`.
+   * - `tooltip-label`: The row's own name inside the tooltip.
+   * - `tooltip-left`: The bubble while it is left of the reading. Set alongside `tooltip`.
+   * - `tooltip-name`: A column's name inside the tooltip.
+   * - `tooltip-right`: The bubble while it is right of the reading. Set alongside `tooltip`.
+   * - `tooltip-top`: The bubble while it is above the reading. Set alongside `tooltip`.
+   * - `tooltip-value`: A column's value inside the tooltip.
+   *
+   * ## CSS States
+   *
+   * These can be used to apply styling when a component is in a given state.
+   *
+   * - `active`: While a place is shown, under the pointer or the keys.
+   * - `drawn`: While a renderer has drawn the surface, and the chart's own drawing is hidden.
+   * - `empty`: While the `empty` part stands in place of the readings.
+   * - `loading`: While the `loading` part stands in place of the readings.
+   * - `settled`: Set one frame after the first render. Transitions wait for it, so an element does not animate its own arrival.
+   */
+  "helix-spatial-surface-chart": Partial<
+    HelixSpatialSurfaceChartProps &
+      HelixSpatialSurfaceChartSolidJsProps &
+      BaseProps<HelixSpatialSurfaceChart> &
+      BaseEvents<HelixSpatialSurfaceChart>
+  >;
+
+  /**
+   * Each group takes a series color from the theme, as every chart's series
+   * does, and each face of a block is that color darkened by how far it turns
+   * from the light. The chart draws the blocks in 3D in SVG, and
+   * `@fusion.dev/helix-plot` can draw them with three.js.
+   *
+   * ## Attributes & Properties
+   *
+   * Component attributes and properties that can be applied to the element or by using JavaScript.
+   *
+   * - `emphasis`: How strongly the blocks are drawn, as on every chart.
+   *
+   * `outlined` is a block as its edges in its group's color over faces faded
+   * toward the page, and `subtle` the same edges over a faint wash, which
+   * shows the blocks behind it. Absent is the filled block, per the rule that a
+   * reflected property takes no default, and `solid` writes it out. A
+   * renderer draws the blocks the same way.
+   *
+   * It composes with `material`: emphasis decides what is drawn, and material
+   * how much of it comes through. The outline on the block the keys rest on
+   * keeps its own ink.
+   * - `material`: How much of each mark comes through, as on every chart: `glass` admits the
+   * most of what is behind it, `frosted` less, and absent is opaque. The
+   * strength is the theme's, scaled by `--helix-material-opacity`.
+   * - `empty-text`/`emptyText`: The words shown in place of the drawing when the table has no readings,
+   * and the fallback of the `empty` slot.
+   * - `loading`: Whether the readings are still on their way. The chart shows
+   * `loading-text` in place of an empty drawing until it has readings.
+   *
+   * Reflected, so a stylesheet can treat the chart while it waits. A chart
+   * that already has readings keeps drawing them, so a refresh does not
+   * blank it.
+   * - `loading-text`/`loadingText`: The words shown in place of the drawing while `loading` is set and
+   * there are no readings yet, and the fallback of the `loading` slot.
+   * - `for`: The id of the table to read.
+   *
+   * Names a table in the same tree, so a chart inside another component's
+   * shadow root reads a table in that root rather than one in the document. A
+   * `<table>` or anything built from grid roles, including `helix-table`.
+   *
+   * **In React this arrives as a property and not as an attribute**, the way
+   * `Tooltip.for` does, so it does not reflect and nothing styles on it.
+   * - `label`: The chart's name, which starts the chart's text summary.
+   *
+   * Absent falls back to the table's own caption, which is usually the right
+   * words and is already written.
+   * - `locale`: The locale the chart's own numbers are written in: its axis, its
+   * percentages and its totals, such as `de` for `1.240` and `32 %`.
+   *
+   * Absent reads the nearest `lang`, then the runtime's own. The table's
+   * cells are shown as the table writes them, whatever this says.
+   * - `position-label`/`positionLabel`: Where a reading the keys moved to stands among the readings, said after
+   * it. `{position}` and `{count}` are replaced with the numbers, written in
+   * `locale`.
+   *
+   * Set it to the words of the page's language, such as `{position} von
+   * {count}`, or to nothing to say no position. A slice or a series a
+   * legend hid is not counted.
+   * - `group-by`/`groupBy`: The column of text that gathers the rows into groups, by its heading. None by default.
+   * - `no-box`/`noBox`: Draws no box: no edges, grid, numbers, or names, so the readings stand
+   * alone and fill the plot, as a picture on a product's own page does. The
+   * table, the summary, the tooltip, and the keys still carry every value,
+   * and a renderer draws no box either.
+   * - `plot-label`/`plotLabel`: The plot's name where the chart has none: no `aria-label`, `label`, or table caption.
+   * - `summary-label`/`summaryLabel`: The `summary` part's sentence. `{count}` and `{groups}` are the number
+   * of items and groups, written in the locale, and `{low}` and `{high}` the
+   * smallest and the largest size.
+   * - `data`: The readings as data, in the shape of a table, where the page has no
+   * table to point `for` at. `for` wins where both are set.
+   *
+   * ```js
+   * chart.data = {
+   *   caption: 'Sessions by channel',
+   *   columns: ['Month', 'Direct', 'Referral'],
+   *   rows: [['Jan', 10, 4], ['Feb', 20, 8]],
+   * }
+   * ```
+   *
+   * The first column holds each row's label and every column after it a
+   * series, as in a table. A cell is a number, words, `null` for a blank,
+   * or `{ value, text }` for a number shown as words, such as `$128k`. A
+   * number is shown in `locale`.
+   *
+   * **A table is still the better source where the page can show one**:
+   * it reads with no script and before hydration, and a reader can sort and
+   * copy it. Data is drawn on the client only, so a server serves the
+   * frame, and the summary, the keys and the readout are then the whole of
+   * what a screen reader is given. Set a new object to redraw: the chart
+   * does not look inside the one it has. (property only)
+   * - `series`: The table's columns, one series each. Empty when there is no table.
+   *
+   * Held by the controller between edits, so a render reading this five
+   * times parses the table once. See `SourceController.series`. (property only) (readonly)
+   * - `named`: The chart's name: an `aria-label` written on the chart, then `label`,
+   * then the table's caption.
+   *
+   * The fallback is the reason this is shared rather than copied: a caption is
+   * already written, already the right words, and already the thing a reader
+   * of the table sees. A chart that made the consumer say it twice would be
+   * asking for the second one to drift.
+   *
+   * **An `aria-label` on the chart comes first**, because it is how a page
+   * names an element, and the chart is a generic around its plot: written
+   * on the host, the name reached nobody. The plot takes it, as Heatmap's
+   * strip always did. (property only) (readonly)
+   * - `plottedColumns`: The positions of the cells in a row that hold numbers, in table order.
+   *
+   * The same test `readSeries` applies when it drops a column of notes: a
+   * column is a series where any row parses, so a series survives one blank
+   * cell and a column of words is never one. (property only) (readonly)
+   * - `readings`: The number of readings, which the pointer position maps onto. (property only) (readonly)
+   * - `field`: The table read as blocks. **The first numeric column is each block's
+   * size, and the second its height.** A renderer reads it. (property only) (readonly)
+   * - `active`: The block the keys or the pointer rest on, as its place in `field.blocks`, or `-1`. (property only) (readonly)
+   * - `whenSettled`: Resolves a frame after the first update, when transitions are switched on.
+   *
+   * **Named `whenSettled` because `settled` is taken four times over**, by
+   * Image, Splitter and both color controls, none of them about transitions. A
+   * base class takes the name every subclass then cannot use.
+   *
+   * **The state it reports cannot be watched, which is why this exists.** A
+   * custom state is deliberately not in the DOM, so there is no
+   * `MutationObserver` equivalent for `ElementInternals.states`. Await this
+   * instead.
+   *
+   * Separate from `updateComplete`, which resolves in the microtask checkpoint
+   * the suppression is still active in. That is the distinction `readyToMove`
+   * in `@fusion.dev/helix-testing` is written around.
+   *
+   * It never resolves where `requestAnimationFrame` never fires, which is a
+   * server, a hidden tab, and happy-dom. Callers that must not hang there race
+   * it against a timeout, as the happy-dom harness's `readyToMove` does. The
+   * browser harness's awaits it alone: a browser always runs the frame, and a
+   * timer beside it was a bet on how long one takes, which a busy run lost. (property only) (readonly)
+   *
+   * ## Events
+   *
+   * Events that will be emitted by the component.
+   *
+   * - `helix-plot-change`: The blocks or the block the keys rest on changed, which the renderer is told. It stays on the chart.
    * - `helix-plot-turn`: Shift with an arrow asked the view to turn, by a step across or up.
    * - `helix-reading-change`: The reading moved, or was put away: `index` is the row, or `-1` for none, with its `label` and the `pointerType` that moved it.
-   * - `helix-reading-press`: A point was clicked, tapped, or pressed with Enter or Space, with the same detail as `helix-reading-change`.
-   *
-   * ## Slots
-   *
-   * Areas where markup can be added to the component.
-   *
-   * - `(default)`: The renderer's box, which the 3D drawing is made in.
-   * - `empty`: Content shown when the table has no points. Falls back to `empty-text`.
-   * - `loading`: Content shown while `loading` is set and there are no points yet. Falls back to `loading-text`.
-   *
-   * ## Methods
-   *
-   * Methods that can be called to access component functionality.
-   *
-   * - `seriesOf(cell: number) => number | undefined`: The palette slot for the cell at this position in a row.
-   *
-   * **A cell's place in its row is not its series' depth, and the tooltip
-   * spent a while assuming it was.** `readSeries` drops a column nothing
-   * parses and `readRows` keeps it, so one column of notes among the figures
-   * moves every column after it one color along in the bubble: a row reading
-   * `Referral 1,080` wearing series three's green beside a legend that says
-   * series three is something else, which is the one failure the dot exists
-   * to prevent.
-   *
-   * Overridden where a chart reads the table some other way. `ScatterChart`
-   * splits the first plotted column off as the measure across, so its first
-   * *plotted* series is this table's second numeric column.
-   * - `showsSeries(name: string) => boolean`: Whether the series of this name is drawn, which it is unless a legend
-   * reading the same table hid it.
-   *
-   * Asked of the table rather than of a legend, the table being the one
-   * thing the two share: see `SourceController.hide`. A series keeps its
-   * palette slot while it is hidden, so the colors of the others do not move.
-   * For a ring the names are its rows, the slices being the rows.
-   * - `showsColumn(cell: number) => boolean`: Whether the series read from the cell at this place in a row is drawn,
-   * by its column's heading. The keys and the readout pass over one a
-   * legend hid.
-   *
-   * A column's heading is the cell's name in every row, so the first row
-   * answers for the column.
-   * - `columnName(cell: number) => string`: The heading of the column at this place in a row: a cell's name is its
-   * column's heading, read from the first row that has a cell there, so a
-   * short first row does not lose the heading. `''` where no row has one.
-   * - `rendererDrawn(on = true) => void`: Says whether a renderer has drawn the points, which hides the chart's
-   * own drawing or shows it again. Called by the connector.
-   * - `requestActive(index: number, kind: 'mouse' | 'pen' | 'touch' = 'mouse') => void`: Puts the reading on the point at `index`, or lets it go with `-1`, as a
-   * pointer resting on it in the renderer's drawing or a press there does.
-   * A touch keeps it until a tap lands elsewhere, and a mouse leaving a
-   * reading the keys moved to leaves it. Called by the connector.
-   * - `placeReading(at: { x: number; y: number } | undefined) => void`: Says where the renderer draws the reading, as fractions of the plot from
-   * its top left, or `undefined` while it draws none. The tooltip points
-   * there. Called by the connector.
-   *
-   * ## CSS Custom Properties
-   *
-   * CSS variables available for styling the component.
-   *
-   * - `--spatial-scatter-chart-block-size`: How tall the plot is.
-   *
-   * ## CSS Parts
-   *
-   * Custom selectors for styling elements within the component.
-   *
-   * - `axis-name`: A measure's name, along its edge of the box, in the chart's own drawing.
-   * - `drawing`: The chart's own drawing in SVG: the box, its grid and numbers, and the points.
-   * - `empty`: The words when the table has no points: the `empty` slot, falling back to `empty-text`.
-   * - `fallback`: The box the chart's own drawing fills, shown until a renderer has drawn and where none is connected. Hidden from screen readers.
-   * - `grid`: The box's edges and its grid at the ticks, in the chart's own drawing.
-   * - `live`: The readout: a polite live region that says the point the keys moved to. Hide it visually.
-   * - `loading`: The words while `loading` is set and there are no points.
-   * - `mark`: The invisible point the tooltip is anchored to, where the renderer draws the reading.
-   * - `plot`: The box the drawing fills, which takes focus to be read by key. It is named by the host's `aria-labelledby` or `aria-label`, then by `label`, then by the caption of the table.
-   * - `point`: One point of the chart's own drawing.
-   * - `point-active`: The point the pointer or the keys rest on, in the chart's own drawing. Set alongside `point`.
-   * - `ring`: The ring around the point the pointer or the keys rest on, drawn over every point.
-   * - `summary`: The three measures and the number of points, written as a sentence for screen readers, which describes the plot. Hide it visually.
-   * - `table`: The readings as a table, for a screen reader, rendered only where they were drawn from `data`. Hide it visually.
-   * - `tick`: A number at a tick, along its edge of the box, in the chart's own drawing.
-   * - `tooltip`: The bubble, forwarded from `Tooltip`.
-   * - `tooltip-anchor`: The `Tooltip` element itself.
-   * - `tooltip-arrow`: The bubble's point, forwarded from `Tooltip`.
-   * - `tooltip-arrow-bottom`: The point while the bubble is below the reading, on its top edge. Set alongside `tooltip-arrow`.
-   * - `tooltip-arrow-left`: The point while the bubble is left of the reading, on its right edge. Set alongside `tooltip-arrow`.
-   * - `tooltip-arrow-right`: The point while the bubble is right of the reading, on its left edge. Set alongside `tooltip-arrow`.
-   * - `tooltip-arrow-top`: The point while the bubble is above the reading, on its bottom edge. Set alongside `tooltip-arrow`.
-   * - `tooltip-bottom`: The bubble while it is below the reading. Set alongside `tooltip`.
-   * - `tooltip-cell`: One column's name and value inside the tooltip.
-   * - `tooltip-cell-current`: The cell a chart's series keys rest on, which every chart's tooltip can mark. This chart marks none, since its readout says the measure. Set alongside `tooltip-cell`.
-   * - `tooltip-label`: The row's own name inside the tooltip.
-   * - `tooltip-left`: The bubble while it is left of the reading. Set alongside `tooltip`.
-   * - `tooltip-name`: A column's name inside the tooltip.
-   * - `tooltip-right`: The bubble while it is right of the reading. Set alongside `tooltip`.
-   * - `tooltip-top`: The bubble while it is above the reading. Set alongside `tooltip`.
-   * - `tooltip-value`: A column's value inside the tooltip.
-   *
-   * ## CSS States
-   *
-   * These can be used to apply styling when a component is in a given state.
-   *
-   * - `active`: While a point is shown, under the pointer or the keys.
-   * - `drawn`: While a renderer has drawn the points, and the chart's own drawing is hidden.
-   * - `empty`: While the `empty` part stands in place of the points.
-   * - `loading`: While the `loading` part stands in place of the points.
-   * - `settled`: Set one frame after the first render. Transitions wait for it, so an element does not animate its own arrival.
-   */
-  "helix-spatial-scatter-chart": Partial<
-    HelixSpatialScatterChartProps &
-      HelixSpatialScatterChartSolidJsProps &
-      BaseProps<HelixSpatialScatterChart> &
-      BaseEvents<HelixSpatialScatterChart>
-  >;
-
-  /**
-   * The chart draws the surface in 3D in SVG, and `@fusion.dev/helix-plot` can
-   * draw it with three.js. Every height is shaded along one
-   * ramp from the theme's primary color, quiet where it is low and strong where
-   * it is high, so the two drawings agree.
-   *
-   * ## Attributes & Properties
-   *
-   * Component attributes and properties that can be applied to the element or by using JavaScript.
-   *
-   * - `empty-text`/`emptyText`: The words shown in place of the drawing when the table has no readings,
-   * and the fallback of the `empty` slot.
-   * - `loading`: Whether the readings are still on their way. The chart shows
-   * `loading-text` in place of an empty drawing until it has readings.
-   *
-   * Reflected, so a stylesheet can treat the chart while it waits. A chart
-   * that already has readings keeps drawing them, so a refresh does not
-   * blank it.
-   * - `loading-text`/`loadingText`: The words shown in place of the drawing while `loading` is set and
-   * there are no readings yet, and the fallback of the `loading` slot.
-   * - `for`: The id of the table to read.
-   *
-   * Names a table in the same tree, so a chart inside another component's
-   * shadow root reads a table in that root rather than one in the document. A
-   * `<table>` or anything built from grid roles, including `helix-table`.
-   *
-   * **In React this arrives as a property and not as an attribute**, the way
-   * `Tooltip.for` does, so it does not reflect and nothing styles on it.
-   * - `label`: The chart's name, which starts the chart's text summary.
-   *
-   * Absent falls back to the table's own caption, which is usually the right
-   * words and is already written.
-   * - `locale`: The locale the chart's own numbers are written in: its axis, its
-   * percentages and its totals, such as `de` for `1.240` and `32 %`.
-   *
-   * Absent reads the nearest `lang`, then the runtime's own. The table's
-   * cells are shown as the table writes them, whatever this says.
-   * - `position-label`/`positionLabel`: Where a reading the keys moved to stands among the readings, said after
-   * it. `{position}` and `{count}` are replaced with the numbers, written in
-   * `locale`.
-   *
-   * Set it to the words of the page's language, such as `{position} von
-   * {count}`, or to nothing to say no position. A slice or a series a
-   * legend hid is not counted.
-   * - `open-label`/`openLabel`: What the readout says for a place with no reading. `{x}` and `{z}` are
-   * the place's numbers across and in depth, and `{across}` and `{depth}`
-   * the two measures' names.
-   * - `plot-label`/`plotLabel`: The plot's name where the chart has none: no `aria-label`, `label`, or table caption.
-   * - `summary-label`/`summaryLabel`: The `summary` part's sentence. `{count}` is the number of readings,
-   * written in the locale, `{x}`, `{z}`, and `{y}` are the measures across,
-   * in depth, and up, and `{low}` and `{high}` the lowest and the highest
-   * reading.
-   * - `data`: The readings as data, in the shape of a table, where the page has no
-   * table to point `for` at. `for` wins where both are set.
-   *
-   * ```js
-   * chart.data = {
-   *   caption: 'Sessions by channel',
-   *   columns: ['Month', 'Direct', 'Referral'],
-   *   rows: [['Jan', 10, 4], ['Feb', 20, 8]],
-   * }
-   * ```
-   *
-   * The first column holds each row's label and every column after it a
-   * series, as in a table. A cell is a number, words, `null` for a blank,
-   * or `{ value, text }` for a number shown as words, such as `$128k`. A
-   * number is shown in `locale`.
-   *
-   * **A table is still the better source where the page can show one**:
-   * it reads with no script and before hydration, and a reader can sort and
-   * copy it. Data is drawn on the client only, so a server serves the
-   * frame, and the summary, the keys and the readout are then the whole of
-   * what a screen reader is given. Set a new object to redraw: the chart
-   * does not look inside the one it has. (property only)
-   * - `series`: The table's columns, one series each. Empty when there is no table.
-   *
-   * Held by the controller between edits, so a render reading this five
-   * times parses the table once. See `SourceController.series`. (property only) (readonly)
-   * - `named`: The chart's name: an `aria-label` written on the chart, then `label`,
-   * then the table's caption.
-   *
-   * The fallback is the reason this is shared rather than copied: a caption is
-   * already written, already the right words, and already the thing a reader
-   * of the table sees. A chart that made the consumer say it twice would be
-   * asking for the second one to drift.
-   *
-   * **An `aria-label` on the chart comes first**, because it is how a page
-   * names an element, and the chart is a generic around its plot: written
-   * on the host, the name reached nobody. The plot takes it, as Heatmap's
-   * strip always did. (property only) (readonly)
-   * - `plottedColumns`: The positions of the cells in a row that hold numbers, in table order.
-   *
-   * The same test `readSeries` applies when it drops a column of notes: a
-   * column is a series where any row parses, so a series survives one blank
-   * cell and a column of words is never one. (property only) (readonly)
-   * - `readings`: The number of readings, which the pointer position maps onto. (property only) (readonly)
-   * - `field`: The table read as a grid of heights. **The first numeric column is
-   * across, the second is in depth, and the third is the height.** A
-   * renderer reads it. (property only) (readonly)
-   * - `active`: The place the keys or the pointer rest on, as its place in `field.cells`, or `-1`. (property only) (readonly)
-   * - `whenSettled`: Resolves a frame after the first update, when transitions are switched on.
-   *
-   * **Named `whenSettled` because `settled` is taken four times over**, by
-   * Image, Splitter and both color controls, none of them about transitions. A
-   * base class takes the name every subclass then cannot use.
-   *
-   * **The state it reports cannot be watched, which is why this exists.** A
-   * custom state is deliberately not in the DOM, so there is no
-   * `MutationObserver` equivalent for `ElementInternals.states`. Await this
-   * instead.
-   *
-   * Separate from `updateComplete`, which resolves in the microtask checkpoint
-   * the suppression is still active in. That is the distinction `readyToMove`
-   * in `@fusion.dev/helix-testing` is written around.
-   *
-   * It never resolves where `requestAnimationFrame` never fires, which is a
-   * server, a hidden tab, and happy-dom. Callers that must not hang there race
-   * it against a timeout, as the happy-dom harness's `readyToMove` does. The
-   * browser harness's awaits it alone: a browser always runs the frame, and a
-   * timer beside it was a bet on how long one takes, which a busy run lost. (property only) (readonly)
-   *
-   * ## Events
-   *
-   * Events that will be emitted by the component.
-   *
-   * - `helix-plot-change`: The readings or the place the keys rest on changed, which the renderer is told. It stays on the chart.
-   * - `helix-plot-turn`: Shift with an arrow asked the view to turn, by a step across or up.
-   * - `helix-reading-change`: The reading moved, or was put away: `index` is the row, or `-1` for none or a place with no reading, with its `label` and the `pointerType` that moved it.
-   * - `helix-reading-press`: A place was clicked or pressed with Enter or Space, with the same detail as `helix-reading-change`.
+   * - `helix-reading-press`: A block was clicked or pressed with Enter or Space, with the same detail as `helix-reading-change`.
    *
    * ## Slots
    *
@@ -97869,9 +100910,9 @@ export type CustomElementsSolidJs = {
    * - `columnName(cell: number) => string`: The heading of the column at this place in a row: a cell's name is its
    * column's heading, read from the first row that has a cell there, so a
    * short first row does not lose the heading. `''` where no row has one.
-   * - `rendererDrawn(on = true) => void`: Says whether a renderer has drawn the surface, which hides the chart's
-   * own drawing or shows it again. Called by the connector.
-   * - `requestActive(index: number, kind: 'mouse' | 'pen' | 'touch' = 'mouse') => void`: Puts the reading on the place at `index`, or lets it go with `-1`, as a
+   * - `rendererDrawn(on = true) => void`: Says whether a renderer has drawn the blocks, which hides the chart's own
+   * drawing or shows it again. Called by the connector.
+   * - `requestActive(index: number, kind: 'mouse' | 'pen' | 'touch' = 'mouse') => void`: Puts the reading on the block at `index`, or lets it go with `-1`, as a
    * pointer resting on it in the renderer's drawing or a press there does.
    * A touch keeps it until a tap lands elsewhere, and a mouse leaving a
    * reading the keys moved to leaves it. Called by the connector.
@@ -97883,30 +100924,29 @@ export type CustomElementsSolidJs = {
    *
    * CSS variables available for styling the component.
    *
-   * - `--spatial-surface-chart-block-size`: How tall the plot is.
-   * - `--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.
-   * - `--spatial-surface-chart-shade`: 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-treemap-block-size`: How tall the plot is.
+   * - `--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
    *
    * Custom selectors for styling elements within the component.
    *
-   * - `axis-name`: A measure's name, along its edge of the box, in the chart's own drawing.
-   * - `drawing`: The chart's own drawing in SVG: the box, its grid and numbers, and the surface.
+   * - `axis-name`: The height's name, along its edge of the box, in the chart's own drawing.
+   * - `block`: One block, its faces in its group's color.
+   * - `block-active`: The block the pointer or the keys rest on. Set alongside `block`.
+   * - `drawing`: The chart's own drawing in SVG: the box, its grid and numbers, and the blocks.
    * - `empty`: The words when the table has no readings: the `empty` slot, falling back to `empty-text`.
-   * - `face`: One square of the surface between four readings, or a triangle where one is missing, shaded by its height and by which way it faces.
+   * - `face`: One face of a block the view shows, shaded by which way it faces.
    * - `fallback`: The box the chart's own drawing fills, shown until a renderer has drawn and where none is connected. Hidden from screen readers.
-   * - `grid`: The box's edges and its grid at the ticks, in the chart's own drawing.
-   * - `live`: The readout: a polite live region that says the place the keys moved to. Hide it visually.
+   * - `grid`: The box's edges and its grid, in the chart's own drawing.
+   * - `live`: The readout: a polite live region that says the item the keys moved to. Hide it visually.
    * - `loading`: The words while `loading` is set and there are no readings.
    * - `mark`: The invisible point the tooltip is anchored to, where the renderer draws the reading.
    * - `plot`: The box the drawing fills, which takes focus to be read by key. It is named by the host's `aria-labelledby` or `aria-label`, then by `label`, then by the caption of the table.
-   * - `ring`: The ring around the reading the pointer or the keys rest on, drawn over the surface.
-   * - `summary`: The measures, the number of readings, and the range of heights, written as a sentence for screen readers, which describes the plot. Hide it visually.
+   * - `ring`: The outline around the block the pointer or the keys rest on, painted after it, so the blocks in front of it cover it.
+   * - `summary`: The number of items and groups and the range of their sizes, written as a sentence for screen readers, which describes the plot. Hide it visually.
    * - `table`: The readings as a table, for a screen reader, rendered only where they were drawn from `data`. Hide it visually.
-   * - `tick`: A number at a tick, along its edge of the box, in the chart's own drawing.
+   * - `tick`: A height at a tick, along its edge of the box, in the chart's own drawing.
    * - `tooltip`: The bubble, forwarded from `Tooltip`.
    * - `tooltip-anchor`: The `Tooltip` element itself.
    * - `tooltip-arrow`: The bubble's point, forwarded from `Tooltip`.
@@ -97928,17 +100968,17 @@ export type CustomElementsSolidJs = {
    *
    * These can be used to apply styling when a component is in a given state.
    *
-   * - `active`: While a place is shown, under the pointer or the keys.
-   * - `drawn`: While a renderer has drawn the surface, and the chart's own drawing is hidden.
+   * - `active`: While a block is shown, under the pointer or the keys.
+   * - `drawn`: While a renderer has drawn the blocks, and the chart's own drawing is hidden.
    * - `empty`: While the `empty` part stands in place of the readings.
    * - `loading`: While the `loading` part stands in place of the readings.
    * - `settled`: Set one frame after the first render. Transitions wait for it, so an element does not animate its own arrival.
    */
-  "helix-spatial-surface-chart": Partial<
-    HelixSpatialSurfaceChartProps &
-      HelixSpatialSurfaceChartSolidJsProps &
-      BaseProps<HelixSpatialSurfaceChart> &
-      BaseEvents<HelixSpatialSurfaceChart>
+  "helix-spatial-treemap": Partial<
+    HelixSpatialTreemapProps &
+      HelixSpatialTreemapSolidJsProps &
+      BaseProps<HelixSpatialTreemap> &
+      BaseEvents<HelixSpatialTreemap>
   >;
 
   /**
@@ -104488,6 +107528,12 @@ export type CustomElementsSolidJs = {
    * permitted is the browser's policy, and what follows a refused autoplay is a
    * paused player showing its start control, which is the correct thing to be
    * looking at.
+   *
+   * **Not where the reader asked for less motion**, or while the page has
+   * paused its motion, through `pauseMotion` or `Motion Toggle`: the player
+   * waits on its start control. A page that pauses its motion pauses a video
+   * that started itself, and one that lets it run again plays it again. A
+   * video the reader started is theirs, and neither touches it.
    * - `captions-hidden-label`/`captionsHiddenLabel`: What the live region says when `c` turns captions off.
    * - `captions-label`/`captionsLabel`: The name of the captions control when the video has one track. The control
    * turns that track on and off.
@@ -106486,6 +109532,8 @@ export type CustomCssProperties = {
   "--meter-fraction"?: (string) | undefined;
   /** How much of the circle the arc covers, as a path length. */
   "--meter-sweep"?: (string) | undefined;
+  /** The button's fill. Defaults to the floating overlay surface. */
+  "--motion-toggle-background-color"?: (string) | undefined;
   /** Height of the bar in a row. Each destination fills it. */
   "--navigation-block-size"?: (string) | undefined;
   /** Space between destinations. */
@@ -107024,6 +110072,10 @@ export type CustomCssProperties = {
   "--sparkline-readout-font-size"?: (string) | undefined;
   /** Thickness of the line, overriding `weight`. */
   "--sparkline-width"?: (string) | undefined;
+  /** How tall the plot is. */
+  "--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;
   /** The largest a cell grows, along its edge. The strip is never wider than its box, and draws smaller cells to fit. */
   "--spatial-heatmap-cell-size"?: (string) | undefined;
   /** How much less light the left face is than the top, as a step of OKLCH lightness from 0 to 1. 0.07 by default. */
@@ -107039,6 +110091,10 @@ export type CustomCssProperties = {
   /** 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. */
+  "--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. */
   "--spatial-scatter-chart-block-size"?: (string) | undefined;
   /** How tall the plot is. */
   "--spatial-surface-chart-block-size"?: (string) | undefined;
@@ -107050,6 +110106,10 @@ 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. */
+  "--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;
   /** Color of the group's name. */
   "--speed-dial-group-label-color"?: (string) | undefined;
   /** Size of the group's name. */