@fusion.dev/helix-headless 0.198.0 → 0.199.1

package/types/jsx.d.ts

@@ -121,6 +121,7 @@ import type {
   HelixHeadlessMenuItem,
   HelixHeadlessMenuSection,
   HelixHeadlessMeter,
+  HelixHeadlessMotionToggle,
   HelixHeadlessNavigation,
   HelixHeadlessNotification,
   HelixHeadlessNotificationGroup,
@@ -149,9 +150,12 @@ import type {
   HelixHeadlessSkipLink,
   HelixHeadlessSlider,
   HelixHeadlessSparkline,
+  HelixHeadlessSpatialBarChart,
   HelixHeadlessSpatialHeatmap,
+  HelixHeadlessSpatialRibbonChart,
   HelixHeadlessSpatialScatterChart,
   HelixHeadlessSpatialSurfaceChart,
+  HelixHeadlessSpatialTreemap,
   HelixHeadlessSpeedDial,
   HelixHeadlessSpeedDialGroup,
   HelixHeadlessSpeedDialItem,
@@ -4449,7 +4453,13 @@ export type HelixHeadlessCarouselHelixSelectElementEvent =
   HelixHeadlessCarouselElementEvent<HelixSelectEvent>;
 
 export type HelixHeadlessCarouselProps = {
-  /** 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?: (HelixHeadlessCarousel["autoplay"]) | undefined;
   /** Whether the previous and next controls are shown.
 
@@ -4711,7 +4721,13 @@ position from the first, and at the last. */
 };
 
 export type HelixHeadlessCarouselSolidJsProps = {
-  /** 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"?: (HelixHeadlessCarousel["autoplay"]) | undefined;
   /** Whether the previous and next controls are shown.
 
@@ -15116,6 +15132,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?: (HelixHeadlessGraph["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"?: (HelixHeadlessGraph["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?: (HelixHeadlessGraph["settlingLabel"]) | undefined;
+  /** What the button that stops a long layout says. */
+  "stop-layout-label"?: (HelixHeadlessGraph["stopLayoutLabel"]) | undefined;
+  /** What the button that stops a long layout says. */
+  stopLayoutLabel?: (HelixHeadlessGraph["stopLayoutLabel"]) | undefined;
   /** The hint shown when one finger swipes over the graph with `gestures="cooperative"`. */
   "two-finger-hint-label"?: (HelixHeadlessGraph["twoFingerHintLabel"]) | undefined;
   /** The hint shown when one finger swipes over the graph with `gestures="cooperative"`. */
@@ -15473,6 +15499,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"?: (HelixHeadlessGraph["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"?: (HelixHeadlessGraph["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"?: (HelixHeadlessGraph["settlingLabel"]) | undefined;
+  /** What the button that stops a long layout says. */
+  "attr:stop-layout-label"?: (HelixHeadlessGraph["stopLayoutLabel"]) | undefined;
+  /** What the button that stops a long layout says. */
+  "prop:stopLayoutLabel"?: (HelixHeadlessGraph["stopLayoutLabel"]) | undefined;
   /** The hint shown when one finger swipes over the graph with `gestures="cooperative"`. */
   "attr:two-finger-hint-label"?: (HelixHeadlessGraph["twoFingerHintLabel"]) | undefined;
   /** The hint shown when one finger swipes over the graph with `gestures="cooperative"`. */
@@ -22180,6 +22216,32 @@ fair summary of a task and a poor one of a quantity. */
   textContent?: (string | number) | undefined;
 };
 
+/** `HelixHeadlessMotionToggle` component event */
+export type HelixHeadlessMotionToggleElementEvent<E = Event> = TypedEvent<
+  HelixHeadlessMotionToggle,
+  E
+>;
+
+export type HelixHeadlessMotionToggleProps = {
+  /** The button's name, which stays the same whichever way it stands. */
+  label?: (HelixHeadlessMotionToggle["label"]) | undefined;
+
+  /** Fired after a press pauses the page's motion or lets it run. */
+  onchange?: ((e: HelixHeadlessMotionToggleElementEvent) => void) | undefined;
+};
+
+export type HelixHeadlessMotionToggleSolidJsProps = {
+  /** The button's name, which stays the same whichever way it stands. */
+  "prop:label"?: (HelixHeadlessMotionToggle["label"]) | undefined;
+  /** Fired after a press pauses the page's motion or lets it run. */
+  "on:change"?: ((e: HelixHeadlessMotionToggleElementEvent) => void) | undefined;
+
+  /** Set the innerHTML of the element */
+  innerHTML?: (string) | undefined;
+  /** Set the textContent of the element */
+  textContent?: (string | number) | undefined;
+};
+
 export type HelixHeadlessNavigationProps = {
   /** Whether the arrow keys move focus between the destinations.
 
@@ -28380,6 +28442,280 @@ not. */
   textContent?: (string | number) | undefined;
 };
 
+/** `HelixHeadlessSpatialBarChart` component event */
+export type HelixHeadlessSpatialBarChartElementEvent<E = Event> = TypedEvent<
+  HelixHeadlessSpatialBarChart,
+  E
+>;
+/** `helix-plot-change` event type */
+export type HelixHeadlessSpatialBarChartHelixPlotChangeElementEvent =
+  HelixHeadlessSpatialBarChartElementEvent<HelixPlotChangeEvent>;
+/** `helix-plot-turn` event type */
+export type HelixHeadlessSpatialBarChartHelixPlotTurnElementEvent =
+  HelixHeadlessSpatialBarChartElementEvent<HelixPlotTurnEvent>;
+/** `helix-reading-change` event type */
+export type HelixHeadlessSpatialBarChartHelixReadingChangeElementEvent =
+  HelixHeadlessSpatialBarChartElementEvent<HelixReadingChangeEvent>;
+/** `helix-reading-press` event type */
+export type HelixHeadlessSpatialBarChartHelixReadingPressElementEvent =
+  HelixHeadlessSpatialBarChartElementEvent<HelixReadingPressEvent>;
+
+export type HelixHeadlessSpatialBarChartProps = {
+  /** 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"?: (HelixHeadlessSpatialBarChart["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?: (HelixHeadlessSpatialBarChart["noBox"]) | undefined;
+  /** What the readout says for a place with no value. `{category}` and
+`{series}` name the place. */
+  "open-label"?: (HelixHeadlessSpatialBarChart["openLabel"]) | undefined;
+  /** What the readout says for a place with no value. `{category}` and
+`{series}` name the place. */
+  openLabel?: (HelixHeadlessSpatialBarChart["openLabel"]) | undefined;
+  /** The plot's name where the chart has none: no `aria-label`, `label`, or table caption. */
+  "plot-label"?: (HelixHeadlessSpatialBarChart["plotLabel"]) | undefined;
+  /** The plot's name where the chart has none: no `aria-label`, `label`, or table caption. */
+  plotLabel?: (HelixHeadlessSpatialBarChart["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"?: (HelixHeadlessSpatialBarChart["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?: (HelixHeadlessSpatialBarChart["summaryLabel"]) | undefined;
+  /** The words shown in place of the drawing when the table has no readings,
+and the fallback of the `empty` slot. */
+  "empty-text"?: (HelixHeadlessSpatialBarChart["emptyText"]) | undefined;
+  /** The words shown in place of the drawing when the table has no readings,
+and the fallback of the `empty` slot. */
+  emptyText?: (HelixHeadlessSpatialBarChart["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?: (HelixHeadlessSpatialBarChart["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"?: (HelixHeadlessSpatialBarChart["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?: (HelixHeadlessSpatialBarChart["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?: (HelixHeadlessSpatialBarChart["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?: (HelixHeadlessSpatialBarChart["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?: (HelixHeadlessSpatialBarChart["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"?: (HelixHeadlessSpatialBarChart["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?: (HelixHeadlessSpatialBarChart["positionLabel"]) | 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?: (HelixHeadlessSpatialBarChart["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: HelixHeadlessSpatialBarChartHelixPlotChangeElementEvent,
+  ) => void) | undefined;
+  /** Shift with an arrow asked the view to turn, by a step across or up. */
+  "onhelix-plot-turn"?: ((
+    e: HelixHeadlessSpatialBarChartHelixPlotTurnElementEvent,
+  ) => 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: HelixHeadlessSpatialBarChartHelixReadingChangeElementEvent,
+  ) => void) | undefined;
+  /** A bar was clicked or pressed with Enter or Space, with the same detail as `helix-reading-change`. */
+  "onhelix-reading-press"?: ((
+    e: HelixHeadlessSpatialBarChartHelixReadingPressElementEvent,
+  ) => void) | undefined;
+};
+
+export type HelixHeadlessSpatialBarChartSolidJsProps = {
+  /** 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"?: (HelixHeadlessSpatialBarChart["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"?: (HelixHeadlessSpatialBarChart["noBox"]) | undefined;
+  /** What the readout says for a place with no value. `{category}` and
+`{series}` name the place. */
+  "attr:open-label"?: (HelixHeadlessSpatialBarChart["openLabel"]) | undefined;
+  /** What the readout says for a place with no value. `{category}` and
+`{series}` name the place. */
+  "prop:openLabel"?: (HelixHeadlessSpatialBarChart["openLabel"]) | undefined;
+  /** The plot's name where the chart has none: no `aria-label`, `label`, or table caption. */
+  "attr:plot-label"?: (HelixHeadlessSpatialBarChart["plotLabel"]) | undefined;
+  /** The plot's name where the chart has none: no `aria-label`, `label`, or table caption. */
+  "prop:plotLabel"?: (HelixHeadlessSpatialBarChart["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"?: (HelixHeadlessSpatialBarChart["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"?: (HelixHeadlessSpatialBarChart["summaryLabel"]) | 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"?: (HelixHeadlessSpatialBarChart["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"?: (HelixHeadlessSpatialBarChart["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"?: (HelixHeadlessSpatialBarChart["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"?: (HelixHeadlessSpatialBarChart["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"?: (HelixHeadlessSpatialBarChart["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"?: (HelixHeadlessSpatialBarChart["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"?: (HelixHeadlessSpatialBarChart["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"?: (HelixHeadlessSpatialBarChart["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"?: (HelixHeadlessSpatialBarChart["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"?: (HelixHeadlessSpatialBarChart["positionLabel"]) | 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"?: (HelixHeadlessSpatialBarChart["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: HelixHeadlessSpatialBarChartHelixPlotChangeElementEvent,
+  ) => void) | undefined;
+  /** Shift with an arrow asked the view to turn, by a step across or up. */
+  "on:helix-plot-turn"?: ((
+    e: HelixHeadlessSpatialBarChartHelixPlotTurnElementEvent,
+  ) => 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: HelixHeadlessSpatialBarChartHelixReadingChangeElementEvent,
+  ) => 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: HelixHeadlessSpatialBarChartHelixReadingPressElementEvent,
+  ) => void) | undefined;
+
+  /** Set the innerHTML of the element */
+  innerHTML?: (string) | undefined;
+  /** Set the textContent of the element */
+  textContent?: (string | number) | undefined;
+};
+
 /** `HelixHeadlessSpatialHeatmap` component event */
 export type HelixHeadlessSpatialHeatmapElementEvent<E = Event> = TypedEvent<
   HelixHeadlessSpatialHeatmap,
@@ -28894,56 +29230,198 @@ does not look inside the one it has. */
   textContent?: (string | number) | undefined;
 };
 
-/** `HelixHeadlessSpatialScatterChart` component event */
-export type HelixHeadlessSpatialScatterChartElementEvent<E = Event> =
-  TypedEvent<HelixHeadlessSpatialScatterChart, E>;
+/** `HelixHeadlessSpatialRibbonChart` component event */
+export type HelixHeadlessSpatialRibbonChartElementEvent<E = Event> = TypedEvent<
+  HelixHeadlessSpatialRibbonChart,
+  E
+>;
 /** `helix-plot-change` event type */
-export type HelixHeadlessSpatialScatterChartHelixPlotChangeElementEvent =
-  HelixHeadlessSpatialScatterChartElementEvent<HelixPlotChangeEvent>;
+export type HelixHeadlessSpatialRibbonChartHelixPlotChangeElementEvent =
+  HelixHeadlessSpatialRibbonChartElementEvent<HelixPlotChangeEvent>;
 /** `helix-plot-turn` event type */
-export type HelixHeadlessSpatialScatterChartHelixPlotTurnElementEvent =
-  HelixHeadlessSpatialScatterChartElementEvent<HelixPlotTurnEvent>;
+export type HelixHeadlessSpatialRibbonChartHelixPlotTurnElementEvent =
+  HelixHeadlessSpatialRibbonChartElementEvent<HelixPlotTurnEvent>;
 /** `helix-reading-change` event type */
-export type HelixHeadlessSpatialScatterChartHelixReadingChangeElementEvent =
-  HelixHeadlessSpatialScatterChartElementEvent<HelixReadingChangeEvent>;
+export type HelixHeadlessSpatialRibbonChartHelixReadingChangeElementEvent =
+  HelixHeadlessSpatialRibbonChartElementEvent<HelixReadingChangeEvent>;
 /** `helix-reading-press` event type */
-export type HelixHeadlessSpatialScatterChartHelixReadingPressElementEvent =
-  HelixHeadlessSpatialScatterChartElementEvent<HelixReadingPressEvent>;
+export type HelixHeadlessSpatialRibbonChartHelixReadingPressElementEvent =
+  HelixHeadlessSpatialRibbonChartElementEvent<HelixReadingPressEvent>;
+
+export type HelixHeadlessSpatialRibbonChartProps = {
+  /** 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"?: (HelixHeadlessSpatialRibbonChart["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?: (HelixHeadlessSpatialRibbonChart["noBox"]) | undefined;
+  /** What the readout says for a reading the table has no value for.
+`{place}` and `{series}` name it. */
+  "open-label"?: (HelixHeadlessSpatialRibbonChart["openLabel"]) | undefined;
+  /** What the readout says for a reading the table has no value for.
+`{place}` and `{series}` name it. */
+  openLabel?: (HelixHeadlessSpatialRibbonChart["openLabel"]) | undefined;
+  /** The plot's name where the chart has none: no `aria-label`, `label`, or table caption. */
+  "plot-label"?: (HelixHeadlessSpatialRibbonChart["plotLabel"]) | undefined;
+  /** The plot's name where the chart has none: no `aria-label`, `label`, or table caption. */
+  plotLabel?: (HelixHeadlessSpatialRibbonChart["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"?: (HelixHeadlessSpatialRibbonChart["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?: (HelixHeadlessSpatialRibbonChart["summaryLabel"]) | undefined;
+  /** The words shown in place of the drawing when the table has no readings,
+and the fallback of the `empty` slot. */
+  "empty-text"?: (HelixHeadlessSpatialRibbonChart["emptyText"]) | undefined;
+  /** The words shown in place of the drawing when the table has no readings,
+and the fallback of the `empty` slot. */
+  emptyText?: (HelixHeadlessSpatialRibbonChart["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 HelixHeadlessSpatialScatterChartProps = {
-  /** The column of text that puts each point in a group, by its heading. None by default. */
-  "group-by"?: (HelixHeadlessSpatialScatterChart["groupBy"]) | undefined;
-  /** The column of text that puts each point in a group, by its heading. None by default. */
-  groupBy?: (HelixHeadlessSpatialScatterChart["groupBy"]) | undefined;
+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?: (HelixHeadlessSpatialRibbonChart["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"?: (HelixHeadlessSpatialRibbonChart["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?: (HelixHeadlessSpatialRibbonChart["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?: (HelixHeadlessSpatialRibbonChart["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?: (HelixHeadlessSpatialRibbonChart["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?: (HelixHeadlessSpatialRibbonChart["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"?: (HelixHeadlessSpatialRibbonChart["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?: (HelixHeadlessSpatialRibbonChart["positionLabel"]) | 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?: (HelixHeadlessSpatialRibbonChart["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: HelixHeadlessSpatialRibbonChartHelixPlotChangeElementEvent,
+  ) => void) | undefined;
+  /** Shift with an arrow asked the view to turn, by a step across or up. */
+  "onhelix-plot-turn"?: ((
+    e: HelixHeadlessSpatialRibbonChartHelixPlotTurnElementEvent,
+  ) => 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: HelixHeadlessSpatialRibbonChartHelixReadingChangeElementEvent,
+  ) => void) | undefined;
+  /** A reading was clicked or pressed with Enter or Space, with the same detail as `helix-reading-change`. */
+  "onhelix-reading-press"?: ((
+    e: HelixHeadlessSpatialRibbonChartHelixReadingPressElementEvent,
+  ) => void) | undefined;
+};
+
+export type HelixHeadlessSpatialRibbonChartSolidJsProps = {
+  /** 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"?: (HelixHeadlessSpatialRibbonChart["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"?: (HelixHeadlessSpatialRibbonChart["noBox"]) | undefined;
+  /** What the readout says for a reading the table has no value for.
+`{place}` and `{series}` name it. */
+  "attr:open-label"?: (HelixHeadlessSpatialRibbonChart["openLabel"]) | undefined;
+  /** What the readout says for a reading the table has no value for.
+`{place}` and `{series}` name it. */
+  "prop:openLabel"?: (HelixHeadlessSpatialRibbonChart["openLabel"]) | undefined;
   /** The plot's name where the chart has none: no `aria-label`, `label`, or table caption. */
-  "plot-label"?: (HelixHeadlessSpatialScatterChart["plotLabel"]) | undefined;
+  "attr:plot-label"?: (HelixHeadlessSpatialRibbonChart["plotLabel"]) | undefined;
   /** The plot's name where the chart has none: no `aria-label`, `label`, or table caption. */
-  plotLabel?: (HelixHeadlessSpatialScatterChart["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"?: (HelixHeadlessSpatialScatterChart["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?: (HelixHeadlessSpatialScatterChart["summaryLabel"]) | undefined;
+  "prop:plotLabel"?: (HelixHeadlessSpatialRibbonChart["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"?: (HelixHeadlessSpatialRibbonChart["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"?: (HelixHeadlessSpatialRibbonChart["summaryLabel"]) | undefined;
   /** The words shown in place of the drawing when the table has no readings,
 and the fallback of the `empty` slot. */
-  "empty-text"?: (HelixHeadlessSpatialScatterChart["emptyText"]) | undefined;
+  "attr:empty-text"?: (HelixHeadlessSpatialRibbonChart["emptyText"]) | undefined;
   /** The words shown in place of the drawing when the table has no readings,
 and the fallback of the `empty` slot. */
-  emptyText?: (HelixHeadlessSpatialScatterChart["emptyText"]) | undefined;
+  "prop:emptyText"?: (HelixHeadlessSpatialRibbonChart["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?: (HelixHeadlessSpatialScatterChart["loading"]) | undefined;
+  "prop:loading"?: (HelixHeadlessSpatialRibbonChart["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"?: (HelixHeadlessSpatialScatterChart["loadingText"]) | undefined;
+  "attr:loading-text"?: (HelixHeadlessSpatialRibbonChart["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?: (HelixHeadlessSpatialScatterChart["loadingText"]) | undefined;
+  "prop:loadingText"?: (HelixHeadlessSpatialRibbonChart["loadingText"]) | undefined;
   /** The id of the table to read.
 
 Names a table in the same tree, so a chart inside another component's
@@ -28952,18 +29430,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?: (HelixHeadlessSpatialScatterChart["for"]) | undefined;
+  "prop:for"?: (HelixHeadlessSpatialRibbonChart["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?: (HelixHeadlessSpatialScatterChart["label"]) | undefined;
+  "prop:label"?: (HelixHeadlessSpatialRibbonChart["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?: (HelixHeadlessSpatialScatterChart["locale"]) | undefined;
+  "prop:locale"?: (HelixHeadlessSpatialRibbonChart["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`.
@@ -28971,7 +29449,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"?: (HelixHeadlessSpatialScatterChart["positionLabel"]) | undefined;
+  "attr:position-label"?: (HelixHeadlessSpatialRibbonChart["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`.
@@ -28979,7 +29457,157 @@ 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?: (HelixHeadlessSpatialScatterChart["positionLabel"]) | undefined;
+  "prop:positionLabel"?: (HelixHeadlessSpatialRibbonChart["positionLabel"]) | 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"?: (HelixHeadlessSpatialRibbonChart["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: HelixHeadlessSpatialRibbonChartHelixPlotChangeElementEvent,
+  ) => void) | undefined;
+  /** Shift with an arrow asked the view to turn, by a step across or up. */
+  "on:helix-plot-turn"?: ((
+    e: HelixHeadlessSpatialRibbonChartHelixPlotTurnElementEvent,
+  ) => 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: HelixHeadlessSpatialRibbonChartHelixReadingChangeElementEvent,
+  ) => 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: HelixHeadlessSpatialRibbonChartHelixReadingPressElementEvent,
+  ) => void) | undefined;
+
+  /** Set the innerHTML of the element */
+  innerHTML?: (string) | undefined;
+  /** Set the textContent of the element */
+  textContent?: (string | number) | undefined;
+};
+
+/** `HelixHeadlessSpatialScatterChart` component event */
+export type HelixHeadlessSpatialScatterChartElementEvent<E = Event> =
+  TypedEvent<HelixHeadlessSpatialScatterChart, E>;
+/** `helix-plot-change` event type */
+export type HelixHeadlessSpatialScatterChartHelixPlotChangeElementEvent =
+  HelixHeadlessSpatialScatterChartElementEvent<HelixPlotChangeEvent>;
+/** `helix-plot-turn` event type */
+export type HelixHeadlessSpatialScatterChartHelixPlotTurnElementEvent =
+  HelixHeadlessSpatialScatterChartElementEvent<HelixPlotTurnEvent>;
+/** `helix-reading-change` event type */
+export type HelixHeadlessSpatialScatterChartHelixReadingChangeElementEvent =
+  HelixHeadlessSpatialScatterChartElementEvent<HelixReadingChangeEvent>;
+/** `helix-reading-press` event type */
+export type HelixHeadlessSpatialScatterChartHelixReadingPressElementEvent =
+  HelixHeadlessSpatialScatterChartElementEvent<HelixReadingPressEvent>;
+
+export type HelixHeadlessSpatialScatterChartProps = {
+  /** 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"?: (HelixHeadlessSpatialScatterChart["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?: (HelixHeadlessSpatialScatterChart["dropLines"]) | undefined;
+  /** The column of text that puts each point in a group, by its heading. None by default. */
+  "group-by"?: (HelixHeadlessSpatialScatterChart["groupBy"]) | undefined;
+  /** The column of text that puts each point in a group, by its heading. None by default. */
+  groupBy?: (HelixHeadlessSpatialScatterChart["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"?: (HelixHeadlessSpatialScatterChart["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?: (HelixHeadlessSpatialScatterChart["noBox"]) | undefined;
+  /** The plot's name where the chart has none: no `aria-label`, `label`, or table caption. */
+  "plot-label"?: (HelixHeadlessSpatialScatterChart["plotLabel"]) | undefined;
+  /** The plot's name where the chart has none: no `aria-label`, `label`, or table caption. */
+  plotLabel?: (HelixHeadlessSpatialScatterChart["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"?: (HelixHeadlessSpatialScatterChart["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?: (HelixHeadlessSpatialScatterChart["summaryLabel"]) | undefined;
+  /** The words shown in place of the drawing when the table has no readings,
+and the fallback of the `empty` slot. */
+  "empty-text"?: (HelixHeadlessSpatialScatterChart["emptyText"]) | undefined;
+  /** The words shown in place of the drawing when the table has no readings,
+and the fallback of the `empty` slot. */
+  emptyText?: (HelixHeadlessSpatialScatterChart["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?: (HelixHeadlessSpatialScatterChart["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"?: (HelixHeadlessSpatialScatterChart["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?: (HelixHeadlessSpatialScatterChart["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?: (HelixHeadlessSpatialScatterChart["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?: (HelixHeadlessSpatialScatterChart["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?: (HelixHeadlessSpatialScatterChart["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"?: (HelixHeadlessSpatialScatterChart["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?: (HelixHeadlessSpatialScatterChart["positionLabel"]) | 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.
 
@@ -29023,10 +29651,28 @@ does not look inside the one it has. */
 };
 
 export type HelixHeadlessSpatialScatterChartSolidJsProps = {
+  /** 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"?: (HelixHeadlessSpatialScatterChart["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"?: (HelixHeadlessSpatialScatterChart["dropLines"]) | undefined;
   /** The column of text that puts each point in a group, by its heading. None by default. */
   "attr:group-by"?: (HelixHeadlessSpatialScatterChart["groupBy"]) | undefined;
   /** The column of text that puts each point in a group, by its heading. None by default. */
   "prop:groupBy"?: (HelixHeadlessSpatialScatterChart["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"?: (HelixHeadlessSpatialScatterChart["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"?: (HelixHeadlessSpatialScatterChart["noBox"]) | undefined;
   /** The plot's name where the chart has none: no `aria-label`, `label`, or table caption. */
   "attr:plot-label"?: (HelixHeadlessSpatialScatterChart["plotLabel"]) | undefined;
   /** The plot's name where the chart has none: no `aria-label`, `label`, or table caption. */
@@ -29155,6 +29801,20 @@ export type HelixHeadlessSpatialSurfaceChartHelixReadingPressElementEvent =
   HelixHeadlessSpatialSurfaceChartElementEvent<HelixReadingPressEvent>;
 
 export type HelixHeadlessSpatialSurfaceChartProps = {
+  /** 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?: (HelixHeadlessSpatialSurfaceChart["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"?: (HelixHeadlessSpatialSurfaceChart["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?: (HelixHeadlessSpatialSurfaceChart["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. */
@@ -29275,6 +29935,20 @@ does not look inside the one it has. */
 };
 
 export type HelixHeadlessSpatialSurfaceChartSolidJsProps = {
+  /** 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"?: (HelixHeadlessSpatialSurfaceChart["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"?: (HelixHeadlessSpatialSurfaceChart["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"?: (HelixHeadlessSpatialSurfaceChart["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. */
@@ -29398,6 +30072,276 @@ does not look inside the one it has. */
   textContent?: (string | number) | undefined;
 };
 
+/** `HelixHeadlessSpatialTreemap` component event */
+export type HelixHeadlessSpatialTreemapElementEvent<E = Event> = TypedEvent<
+  HelixHeadlessSpatialTreemap,
+  E
+>;
+/** `helix-plot-change` event type */
+export type HelixHeadlessSpatialTreemapHelixPlotChangeElementEvent =
+  HelixHeadlessSpatialTreemapElementEvent<HelixPlotChangeEvent>;
+/** `helix-plot-turn` event type */
+export type HelixHeadlessSpatialTreemapHelixPlotTurnElementEvent =
+  HelixHeadlessSpatialTreemapElementEvent<HelixPlotTurnEvent>;
+/** `helix-reading-change` event type */
+export type HelixHeadlessSpatialTreemapHelixReadingChangeElementEvent =
+  HelixHeadlessSpatialTreemapElementEvent<HelixReadingChangeEvent>;
+/** `helix-reading-press` event type */
+export type HelixHeadlessSpatialTreemapHelixReadingPressElementEvent =
+  HelixHeadlessSpatialTreemapElementEvent<HelixReadingPressEvent>;
+
+export type HelixHeadlessSpatialTreemapProps = {
+  /** The column of text that gathers the rows into groups, by its heading. None by default. */
+  "group-by"?: (HelixHeadlessSpatialTreemap["groupBy"]) | undefined;
+  /** The column of text that gathers the rows into groups, by its heading. None by default. */
+  groupBy?: (HelixHeadlessSpatialTreemap["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"?: (HelixHeadlessSpatialTreemap["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?: (HelixHeadlessSpatialTreemap["noBox"]) | undefined;
+  /** The plot's name where the chart has none: no `aria-label`, `label`, or table caption. */
+  "plot-label"?: (HelixHeadlessSpatialTreemap["plotLabel"]) | undefined;
+  /** The plot's name where the chart has none: no `aria-label`, `label`, or table caption. */
+  plotLabel?: (HelixHeadlessSpatialTreemap["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"?: (HelixHeadlessSpatialTreemap["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?: (HelixHeadlessSpatialTreemap["summaryLabel"]) | undefined;
+  /** The words shown in place of the drawing when the table has no readings,
+and the fallback of the `empty` slot. */
+  "empty-text"?: (HelixHeadlessSpatialTreemap["emptyText"]) | undefined;
+  /** The words shown in place of the drawing when the table has no readings,
+and the fallback of the `empty` slot. */
+  emptyText?: (HelixHeadlessSpatialTreemap["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?: (HelixHeadlessSpatialTreemap["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"?: (HelixHeadlessSpatialTreemap["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?: (HelixHeadlessSpatialTreemap["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?: (HelixHeadlessSpatialTreemap["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?: (HelixHeadlessSpatialTreemap["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?: (HelixHeadlessSpatialTreemap["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"?: (HelixHeadlessSpatialTreemap["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?: (HelixHeadlessSpatialTreemap["positionLabel"]) | 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?: (HelixHeadlessSpatialTreemap["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: HelixHeadlessSpatialTreemapHelixPlotChangeElementEvent,
+  ) => void) | undefined;
+  /** Shift with an arrow asked the view to turn, by a step across or up. */
+  "onhelix-plot-turn"?: ((
+    e: HelixHeadlessSpatialTreemapHelixPlotTurnElementEvent,
+  ) => 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: HelixHeadlessSpatialTreemapHelixReadingChangeElementEvent,
+  ) => void) | undefined;
+  /** A block was clicked or pressed with Enter or Space, with the same detail as `helix-reading-change`. */
+  "onhelix-reading-press"?: ((
+    e: HelixHeadlessSpatialTreemapHelixReadingPressElementEvent,
+  ) => void) | undefined;
+};
+
+export type HelixHeadlessSpatialTreemapSolidJsProps = {
+  /** The column of text that gathers the rows into groups, by its heading. None by default. */
+  "attr:group-by"?: (HelixHeadlessSpatialTreemap["groupBy"]) | undefined;
+  /** The column of text that gathers the rows into groups, by its heading. None by default. */
+  "prop:groupBy"?: (HelixHeadlessSpatialTreemap["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"?: (HelixHeadlessSpatialTreemap["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"?: (HelixHeadlessSpatialTreemap["noBox"]) | undefined;
+  /** The plot's name where the chart has none: no `aria-label`, `label`, or table caption. */
+  "attr:plot-label"?: (HelixHeadlessSpatialTreemap["plotLabel"]) | undefined;
+  /** The plot's name where the chart has none: no `aria-label`, `label`, or table caption. */
+  "prop:plotLabel"?: (HelixHeadlessSpatialTreemap["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"?: (HelixHeadlessSpatialTreemap["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"?: (HelixHeadlessSpatialTreemap["summaryLabel"]) | 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"?: (HelixHeadlessSpatialTreemap["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"?: (HelixHeadlessSpatialTreemap["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"?: (HelixHeadlessSpatialTreemap["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"?: (HelixHeadlessSpatialTreemap["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"?: (HelixHeadlessSpatialTreemap["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"?: (HelixHeadlessSpatialTreemap["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"?: (HelixHeadlessSpatialTreemap["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"?: (HelixHeadlessSpatialTreemap["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"?: (HelixHeadlessSpatialTreemap["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"?: (HelixHeadlessSpatialTreemap["positionLabel"]) | 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"?: (HelixHeadlessSpatialTreemap["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: HelixHeadlessSpatialTreemapHelixPlotChangeElementEvent,
+  ) => void) | undefined;
+  /** Shift with an arrow asked the view to turn, by a step across or up. */
+  "on:helix-plot-turn"?: ((
+    e: HelixHeadlessSpatialTreemapHelixPlotTurnElementEvent,
+  ) => 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: HelixHeadlessSpatialTreemapHelixReadingChangeElementEvent,
+  ) => 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: HelixHeadlessSpatialTreemapHelixReadingPressElementEvent,
+  ) => void) | undefined;
+
+  /** Set the innerHTML of the element */
+  innerHTML?: (string) | undefined;
+  /** Set the textContent of the element */
+  textContent?: (string | number) | undefined;
+};
+
 export type HelixHeadlessSpeedDialGroupProps = {
   /** The group's name, drawn above its actions and read by screen readers. */
   label?: (HelixHeadlessSpeedDialGroup["label"]) | undefined;
@@ -37071,7 +38015,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?: (HelixHeadlessVideo["autoplay"]) | undefined;
   /** What the live region says when `c` turns captions off. */
   "captions-hidden-label"?: (HelixHeadlessVideo["captionsHiddenLabel"]) | undefined;
@@ -37538,7 +38488,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"?: (HelixHeadlessVideo["autoplay"]) | undefined;
   /** What the live region says when `c` turns captions off. */
   "attr:captions-hidden-label"?: (HelixHeadlessVideo["captionsHiddenLabel"]) | undefined;
@@ -41862,6 +42818,12 @@ export type CustomElements = {
    * Component attributes and properties that can be applied to the element or by using JavaScript.
    *
    * - `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,
@@ -49747,6 +50709,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:
@@ -49922,6 +50887,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
@@ -49983,7 +50957,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.
@@ -50001,6 +50977,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.
@@ -53742,9 +54720,11 @@ export type CustomElements = {
    * While `playing` is set, the layer shows the frames in order, `interval`
    * milliseconds each, and starts again from the first.
    *
-   * The frames do not play while the user has asked for reduced motion, and the
-   * layer shows its last frame. Content that moves for more than five seconds
-   * needs a way to pause it, so give `playing` a control on your page.
+   * The frames do not play while the user has asked for reduced motion, or
+   * while the page has paused its motion, through `pauseMotion` or `Motion
+   * Toggle`, and the layer holds the frame it shows. Content that moves for more
+   * than five seconds needs a way to pause it, which `Motion Toggle` gives the
+   * whole page, or give `playing` a control of its own.
    *
    * Put the tile provider's credit in `attribution`. The frame shows it beside
    * the map's own credit.
@@ -55245,6 +56225,91 @@ export type CustomElements = {
     HelixHeadlessMeterProps & BaseProps<HelixHeadlessMeter> & BaseEvents<HelixHeadlessMeter>
   >;
 
+  /**
+   * WCAG 2.2.2 asks that motion which starts by itself and runs longer than
+   * five seconds can be paused. **This is one control for the whole page**: a
+   * press pauses every Helix component that moves by itself, and another lets
+   * them run again.
+   *
+   * - `Carousel` stops rotating under `autoplay`.
+   * - `Video` pauses a video that started itself under `autoplay`.
+   * - `Aura`, `Orb`, and `Strands` hold the frame they show.
+   * - A graph that `connectGraph` lays out stops where its notes stand, and its
+   *   three.js view stops turning.
+   * - A map layer's `frames` stop on the frame they show.
+   *
+   * **The choice is the page's**, held on the document element as
+   * `data-helix-motion="paused"`, so two of these on one page agree, and a page
+   * can set it in its markup or with `pauseMotion` from
+   * `@fusion.dev/helix-core`. A stylesheet can select on the attribute to
+   * pause motion of its own.
+   *
+   * It is a toggle button: a `<button>` that says whether motion is paused with
+   * `aria-pressed`. It keeps one name, `label`, whichever way it stands, as a
+   * toggle button does, and its icon shows what a press does next.
+   *
+   * Put it where a reader looks first, such as the page's header. Where the
+   * reader asked for reduced motion, nothing moves by itself to begin with.
+   *
+   * ## 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 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-headless-motion-toggle": Partial<
+    HelixHeadlessMotionToggleProps &
+      BaseProps<HelixHeadlessMotionToggle> &
+      BaseEvents<HelixHeadlessMotionToggle>
+  >;
+
   /**
    * Renders a real `<nav>`, the landmark that screen reader users jump to.
    * Navigation is its own component, separate from `AppHeader`, so you can use it
@@ -60674,6 +61739,292 @@ export type CustomElements = {
     HelixHeadlessSparklineProps & BaseProps<HelixHeadlessSparkline> & BaseEvents<HelixHeadlessSparkline>
   >;
 
+  /**
+   * A 3D bar chart reads its table as `Bar Chart` does: **each row is a
+   * category, named by its label, and each numeric column a series**, named by
+   * its heading. The bars stand on a grid of categories across and series in
+   * depth, each as tall as its value from zero and colored by its series, so
+   * one series is a single row of bars and several make a block of them.
+   *
+   * **The flat `Bar Chart` is read more exactly.** Measured, a reader judges
+   * a 3D bar's value less closely than a flat one's, and a bar can stand
+   * behind another. Use this one where the shape across two sets of names
+   * matters more than any one exact value, such as sales by region and by
+   * quarter. The tooltip and the table carry the exact values, and a drag
+   * turns the view to show a bar another hides.
+   *
+   * **Helix draws the frame, and the chart draws the bars in 3D itself, in
+   * SVG**: a picture a print and a page without WebGL show too, which a drag
+   * or Shift with an arrow turns. Put a box inside the chart, and
+   * `connectSpatialBarChart` from `@fusion.dev/helix-plot`, given
+   * `threeBarDriver` from `@fusion.dev/helix-plot/three`, draws the bars in it
+   * with three.js, lit and in perspective.
+   *
+   * **The table is the reading.** Every number is in it, and screen readers
+   * read it. The `summary` part names the number of bars, series, and
+   * categories, and the range of values, and describes the plot.
+   *
+   * **The plot is read by key, across and in depth.** It takes focus, named by
+   * `label` or the caption. The left and right arrows move from category to
+   * category, the down and up arrows from series to series, and Home and End
+   * go to the first and the last bar. The `live` part says the bar's category,
+   * series, and value in words. Shift with an arrow turns the view, and
+   * Escape lets the bar go.
+   *
+   * **A reading shows its row in a tooltip**, as on every chart: the bar a
+   * mouse or a pen rests on, the bar tapped, or the one the keys move to.
+   *
+   * **Readings are sent as every chart sends them.** `helix-reading-change`
+   * says each move of the reading, and `helix-reading-press` a bar clicked or
+   * pressed with Enter or Space, each with the row of the table in `index`.
+   *
+   * **Keyboard.** The plot is one tab stop once it has readings.
+   *
+   * | Key | What it does |
+   * |---|---|
+   * | Tab | Moves focus to the plot. |
+   * | Right, Left | Moves to the next or the previous category. |
+   * | Down, Up | Moves to the next or the previous series. |
+   * | Home, End | Moves to the first or the last bar. |
+   * | Shift with an arrow | Turns the view across, or tilts it up and down. |
+   * | Enter, Space | Presses the bar, which sends `helix-reading-press`. |
+   * | Escape | Lets the bar go. |
+   *
+   * ## Attributes & Properties
+   *
+   * Component attributes and properties that can be applied to the element or by using JavaScript.
+   *
+   * - `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.
+   * - `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.
+   * - `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)
+   * - `readings`: The number of places on the grid, which the keys walk. (property only) (readonly)
+   * - `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)
+   * - `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.
+   *
+   * - `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.
+   * - `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.
+   *
+   * ## CSS Custom Properties
+   *
+   * CSS variables available for styling the component.
+   *
+   * - `--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-headless-spatial-bar-chart": Partial<
+    HelixHeadlessSpatialBarChartProps &
+      BaseProps<HelixHeadlessSpatialBarChart> &
+      BaseEvents<HelixHeadlessSpatialBarChart>
+  >;
+
   /**
    * The same strip as `Heatmap`, seen from above at an angle. Each reading is a
    * prism: its top face takes the cell's tone, and its height repeats the value,
@@ -61100,6 +62451,290 @@ export type CustomElements = {
       BaseEvents<HelixHeadlessSpatialHeatmap>
   >;
 
+  /**
+   * A 3D ribbon chart reads its table as `Line Chart` does: **each row is a
+   * place across, such as a day, named by its label, and each numeric column a
+   * series**, named by its heading. Each series is a ribbon in a depth of its
+   * own, the first in front, its top following the values and its face falling
+   * to zero, so several series that would tangle as lines stand apart.
+   *
+   * **The flat `Line Chart` is read more exactly.** Use this one where the
+   * shape of each series, and how the series differ, matters more than any one
+   * value, such as response times by region over a month. The tooltip and the
+   * table carry the exact values, and a drag turns the view to show a ribbon
+   * another hides.
+   *
+   * **Helix draws the frame, and the chart draws the ribbons in 3D itself, in
+   * SVG**: a picture a print and a page without WebGL show too, which a drag
+   * or Shift with an arrow turns. Put a box inside the chart, and
+   * `connectSpatialRibbonChart` from `@fusion.dev/helix-plot`, given
+   * `threeRibbonDriver` from `@fusion.dev/helix-plot/three`, draws the ribbons
+   * in it with three.js, lit and in perspective.
+   *
+   * **The table is the reading.** Every number is in it, and screen readers
+   * read it. The `summary` part names the number of readings, series, and
+   * places, and the range of values, and describes the plot.
+   *
+   * **The plot is read by key, across and in depth.** It takes focus, named by
+   * `label` or the caption. The left and right arrows move from place to
+   * place, the down and up arrows from series to series, and Home and End go
+   * to the first and the last reading. The `live` part says the reading's
+   * place, series, and value in words. Shift with an arrow turns the view, and
+   * Escape lets the reading go.
+   *
+   * **A reading shows its row in a tooltip**, as on every chart: the reading a
+   * mouse or a pen rests nearest, the one tapped, or the one the keys move to.
+   *
+   * **Readings are sent as every chart sends them.** `helix-reading-change`
+   * says each move of the reading, and `helix-reading-press` a reading clicked
+   * or pressed with Enter or Space, each with the row of the table in `index`.
+   *
+   * **Keyboard.** The plot is one tab stop once it has readings.
+   *
+   * | Key | What it does |
+   * |---|---|
+   * | Tab | Moves focus to the plot. |
+   * | Right, Left | Moves to the next or the previous place. |
+   * | Down, Up | Moves to the next or the previous series. |
+   * | Home, End | Moves to the first or the last reading. |
+   * | Shift with an arrow | Turns the view across, or tilts it up and down. |
+   * | Enter, Space | Presses the reading, which sends `helix-reading-press`. |
+   * | Escape | Lets the reading go. |
+   *
+   * ## Attributes & Properties
+   *
+   * Component attributes and properties that can be applied to the element or by using JavaScript.
+   *
+   * - `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.
+   * - `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.
+   * - `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)
+   * - `readings`: The number of places on the grid, which the keys walk. (property only) (readonly)
+   * - `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)
+   * - `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.
+   *
+   * - `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.
+   * - `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.
+   *
+   * ## CSS Custom Properties
+   *
+   * CSS variables available for styling the component.
+   *
+   * - `--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-headless-spatial-ribbon-chart": Partial<
+    HelixHeadlessSpatialRibbonChartProps &
+      BaseProps<HelixHeadlessSpatialRibbonChart> &
+      BaseEvents<HelixHeadlessSpatialRibbonChart>
+  >;
+
   /**
    * A 3D scatter chart shows how three measures relate. The table's first
    * three numeric columns are measured across, up, and in depth, and each row
@@ -61151,7 +62786,14 @@ export type CustomElements = {
    *
    * Component attributes and properties that can be applied to the element or by using JavaScript.
    *
+   * - `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.
@@ -61324,6 +62966,7 @@ export type CustomElements = {
    *
    * - `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.
@@ -61423,6 +63066,13 @@ export type CustomElements = {
    *
    * Component attributes and properties that can be applied to the element or by using JavaScript.
    *
+   * - `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.
@@ -61606,6 +63256,7 @@ export type CustomElements = {
    * 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.
@@ -61652,6 +63303,291 @@ export type CustomElements = {
       BaseEvents<HelixHeadlessSpatialSurfaceChart>
   >;
 
+  /**
+   * A 3D treemap shares a floor out among the rows of its table: **the first
+   * numeric column is each block's size, and its share of the floor is in
+   * proportion to it**. The second numeric column, where there is one, is each
+   * block's height, from zero, so one block shows two measures: how large an
+   * item is, and how it stands on another count, such as each service's
+   * requests and its errors. `group-by` names a column of text, such as a team,
+   * that gathers its rows into one part of the floor, in one color, and the
+   * part is as large as their total.
+   *
+   * **Each part is laid out as near to square as its share allows**, so two
+   * items compare by area, and the largest stand at the back left, where they
+   * hide the least. With no height column the blocks stand as one thin slab, a
+   * treemap seen in 3D.
+   *
+   * **Helix draws the frame, and the chart draws the blocks in 3D itself, in
+   * SVG**: a picture a print and a page without WebGL show too, which a drag
+   * or Shift with an arrow turns. Put a box inside the chart, and
+   * `connectSpatialTreemap` from `@fusion.dev/helix-plot`, given
+   * `threeTreemapDriver` from `@fusion.dev/helix-plot/three`, draws the blocks
+   * in it with three.js, lit and in perspective.
+   *
+   * **The table is the reading.** Every number is in it, and screen readers
+   * read it. The `summary` part names the number of items and groups and the
+   * range of their sizes, and describes the plot.
+   *
+   * **The plot is read by key, in the table's order.** It takes focus, named
+   * by `label` or the caption. The left and right arrows move from item to
+   * item, the down and up arrows among the item's measures, which the readout
+   * says first, and Home and End go to the first and the last item. Shift
+   * with an arrow turns the view, and Escape lets the item go.
+   *
+   * **A reading shows its row in a tooltip**, as on every chart: the block a
+   * mouse or a pen rests on, the block tapped, or the one the keys move to.
+   *
+   * **Readings are sent as every chart sends them.** `helix-reading-change`
+   * says each move of the reading, and `helix-reading-press` a block clicked
+   * or pressed with Enter or Space, each with the row of the table in `index`.
+   *
+   * **Keyboard.** The plot is one tab stop once it has readings.
+   *
+   * | Key | What it does |
+   * |---|---|
+   * | Tab | Moves focus to the plot. |
+   * | Right, Left | Moves to the next or the previous item, in the table's order. |
+   * | Down, Up | Moves among the item's measures, which the readout says first. |
+   * | Home, End | Moves to the first or the last item. |
+   * | Shift with an arrow | Turns the view across, or tilts it up and down. |
+   * | Enter, Space | Presses the item, which sends `helix-reading-press`. |
+   * | Escape | Lets the item go. |
+   *
+   * ## Attributes & Properties
+   *
+   * Component attributes and properties that can be applied to the element or by using JavaScript.
+   *
+   * - `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.
+   * - `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.
+   * - `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)
+   * - `readings`: The number of blocks, which the keys walk. (property only) (readonly)
+   * - `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)
+   * - `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.
+   *
+   * - `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.
+   * - `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.
+   *
+   * ## CSS Custom Properties
+   *
+   * CSS variables available for styling the component.
+   *
+   * - `--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-headless-spatial-treemap": Partial<
+    HelixHeadlessSpatialTreemapProps &
+      BaseProps<HelixHeadlessSpatialTreemap> &
+      BaseEvents<HelixHeadlessSpatialTreemap>
+  >;
+
   /**
    * A `group` of the dial's menu, named by its label, as React Aria's menu
    * sections and Menu's groups are: a reader hears the name on entering the set,
@@ -68399,6 +70335,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.
@@ -72647,6 +74589,12 @@ export type CustomElementsSolidJs = {
    * Component attributes and properties that can be applied to the element or by using JavaScript.
    *
    * - `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,
@@ -80594,6 +82542,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:
@@ -80769,6 +82720,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
@@ -80830,7 +82790,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.
@@ -80848,6 +82810,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.
@@ -84643,9 +86607,11 @@ export type CustomElementsSolidJs = {
    * While `playing` is set, the layer shows the frames in order, `interval`
    * milliseconds each, and starts again from the first.
    *
-   * The frames do not play while the user has asked for reduced motion, and the
-   * layer shows its last frame. Content that moves for more than five seconds
-   * needs a way to pause it, so give `playing` a control on your page.
+   * The frames do not play while the user has asked for reduced motion, or
+   * while the page has paused its motion, through `pauseMotion` or `Motion
+   * Toggle`, and the layer holds the frame it shows. Content that moves for more
+   * than five seconds needs a way to pause it, which `Motion Toggle` gives the
+   * whole page, or give `playing` a control of its own.
    *
    * Put the tile provider's credit in `attribution`. The frame shows it beside
    * the map's own credit.
@@ -86169,6 +88135,92 @@ export type CustomElementsSolidJs = {
       BaseEvents<HelixHeadlessMeter>
   >;
 
+  /**
+   * WCAG 2.2.2 asks that motion which starts by itself and runs longer than
+   * five seconds can be paused. **This is one control for the whole page**: a
+   * press pauses every Helix component that moves by itself, and another lets
+   * them run again.
+   *
+   * - `Carousel` stops rotating under `autoplay`.
+   * - `Video` pauses a video that started itself under `autoplay`.
+   * - `Aura`, `Orb`, and `Strands` hold the frame they show.
+   * - A graph that `connectGraph` lays out stops where its notes stand, and its
+   *   three.js view stops turning.
+   * - A map layer's `frames` stop on the frame they show.
+   *
+   * **The choice is the page's**, held on the document element as
+   * `data-helix-motion="paused"`, so two of these on one page agree, and a page
+   * can set it in its markup or with `pauseMotion` from
+   * `@fusion.dev/helix-core`. A stylesheet can select on the attribute to
+   * pause motion of its own.
+   *
+   * It is a toggle button: a `<button>` that says whether motion is paused with
+   * `aria-pressed`. It keeps one name, `label`, whichever way it stands, as a
+   * toggle button does, and its icon shows what a press does next.
+   *
+   * Put it where a reader looks first, such as the page's header. Where the
+   * reader asked for reduced motion, nothing moves by itself to begin with.
+   *
+   * ## 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 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-headless-motion-toggle": Partial<
+    HelixHeadlessMotionToggleProps &
+      HelixHeadlessMotionToggleSolidJsProps &
+      BaseProps<HelixHeadlessMotionToggle> &
+      BaseEvents<HelixHeadlessMotionToggle>
+  >;
+
   /**
    * Renders a real `<nav>`, the landmark that screen reader users jump to.
    * Navigation is its own component, separate from `AppHeader`, so you can use it
@@ -91654,6 +93706,293 @@ export type CustomElementsSolidJs = {
       BaseEvents<HelixHeadlessSparkline>
   >;
 
+  /**
+   * A 3D bar chart reads its table as `Bar Chart` does: **each row is a
+   * category, named by its label, and each numeric column a series**, named by
+   * its heading. The bars stand on a grid of categories across and series in
+   * depth, each as tall as its value from zero and colored by its series, so
+   * one series is a single row of bars and several make a block of them.
+   *
+   * **The flat `Bar Chart` is read more exactly.** Measured, a reader judges
+   * a 3D bar's value less closely than a flat one's, and a bar can stand
+   * behind another. Use this one where the shape across two sets of names
+   * matters more than any one exact value, such as sales by region and by
+   * quarter. The tooltip and the table carry the exact values, and a drag
+   * turns the view to show a bar another hides.
+   *
+   * **Helix draws the frame, and the chart draws the bars in 3D itself, in
+   * SVG**: a picture a print and a page without WebGL show too, which a drag
+   * or Shift with an arrow turns. Put a box inside the chart, and
+   * `connectSpatialBarChart` from `@fusion.dev/helix-plot`, given
+   * `threeBarDriver` from `@fusion.dev/helix-plot/three`, draws the bars in it
+   * with three.js, lit and in perspective.
+   *
+   * **The table is the reading.** Every number is in it, and screen readers
+   * read it. The `summary` part names the number of bars, series, and
+   * categories, and the range of values, and describes the plot.
+   *
+   * **The plot is read by key, across and in depth.** It takes focus, named by
+   * `label` or the caption. The left and right arrows move from category to
+   * category, the down and up arrows from series to series, and Home and End
+   * go to the first and the last bar. The `live` part says the bar's category,
+   * series, and value in words. Shift with an arrow turns the view, and
+   * Escape lets the bar go.
+   *
+   * **A reading shows its row in a tooltip**, as on every chart: the bar a
+   * mouse or a pen rests on, the bar tapped, or the one the keys move to.
+   *
+   * **Readings are sent as every chart sends them.** `helix-reading-change`
+   * says each move of the reading, and `helix-reading-press` a bar clicked or
+   * pressed with Enter or Space, each with the row of the table in `index`.
+   *
+   * **Keyboard.** The plot is one tab stop once it has readings.
+   *
+   * | Key | What it does |
+   * |---|---|
+   * | Tab | Moves focus to the plot. |
+   * | Right, Left | Moves to the next or the previous category. |
+   * | Down, Up | Moves to the next or the previous series. |
+   * | Home, End | Moves to the first or the last bar. |
+   * | Shift with an arrow | Turns the view across, or tilts it up and down. |
+   * | Enter, Space | Presses the bar, which sends `helix-reading-press`. |
+   * | Escape | Lets the bar go. |
+   *
+   * ## Attributes & Properties
+   *
+   * Component attributes and properties that can be applied to the element or by using JavaScript.
+   *
+   * - `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.
+   * - `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.
+   * - `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)
+   * - `readings`: The number of places on the grid, which the keys walk. (property only) (readonly)
+   * - `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)
+   * - `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.
+   *
+   * - `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.
+   * - `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.
+   *
+   * ## CSS Custom Properties
+   *
+   * CSS variables available for styling the component.
+   *
+   * - `--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-headless-spatial-bar-chart": Partial<
+    HelixHeadlessSpatialBarChartProps &
+      HelixHeadlessSpatialBarChartSolidJsProps &
+      BaseProps<HelixHeadlessSpatialBarChart> &
+      BaseEvents<HelixHeadlessSpatialBarChart>
+  >;
+
   /**
    * The same strip as `Heatmap`, seen from above at an angle. Each reading is a
    * prism: its top face takes the cell's tone, and its height repeats the value,
@@ -91992,61 +94331,346 @@ 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.
-   * - `pageFrom(at: number, forward: boolean) => number | undefined`: Where PageUp or PageDown goes from the drawn cell at `at`: the same day a
-   * month on or back, by the dates the rows' headers carry. Undefined where
-   * they carry none, and the keys move four columns.
+   * - `pageFrom(at: number, forward: boolean) => number | undefined`: Where PageUp or PageDown goes from the drawn cell at `at`: the same day a
+   * month on or back, by the dates the rows' headers carry. Undefined where
+   * they carry none, and the keys move four columns.
+   *
+   * ## CSS Custom Properties
+   *
+   * CSS variables available for styling the component.
+   *
+   * - `--spatial-heatmap-label-x`: Where the `start` or the `end` label stands clear of the drawing, from the footer's inline start, in pixels. The component measures it and writes it on the label, with `data-placed`, as the view turns.
+   * - `--spatial-heatmap-label-y`: Where the `start` or the `end` label stands clear of the drawing, from the footer's top, in pixels. The component measures it and writes it on the label, with `data-placed`, as the view turns.
+   * - `--spatial-heatmap-span`: 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.
+   * - `--heatmap-rows`: How many rows the strip lays out. The component writes it from the data, and the stylesheet that draws the strip reads it.
+   * - `--heatmap-tone`: The tone of the cell it is set on. The component writes it, and the stylesheet that paints the cell reads it.
+   * - `--heatmap-tone-1`: The weakest step of the magnitude ramp, used by `tones="1 …"`.
+   * - `--heatmap-tone-2`: The second step of the magnitude ramp.
+   * - `--heatmap-tone-3`: The third step of the magnitude ramp.
+   * - `--heatmap-tone-4`: The fourth step of the magnitude ramp.
+   * - `--heatmap-tone-5`: The strongest step of the magnitude ramp.
+   * - `--heatmap-tone-accent`: The color of the `accent` tone.
+   * - `--heatmap-tone-danger`: The color of the `danger` tone.
+   * - `--heatmap-tone-info`: The color of the `info` tone.
+   * - `--heatmap-tone-muted`: The color of the `muted` tone: a quiet background, for a bucket that means nothing happened.
+   * - `--heatmap-tone-primary`: The color of the `primary` tone.
+   * - `--heatmap-tone-success`: The color of the `success` tone, named in `tones` or in `data-tone`.
+   * - `--heatmap-tone-warning`: The color of the `warning` tone.
+   *
+   * ## CSS Parts
+   *
+   * Custom selectors for styling elements within the component.
+   *
+   * - `base`: The slab the prisms stand on: a group holding its top and its two sides. Hidden from screen readers.
+   * - `base-left`: The slab's side toward the viewer at the lower left, under the strip's last row.
+   * - `base-right`: The slab's side toward the viewer at the lower right, under the newest column.
+   * - `base-top`: The slab's top, which is the floor the prisms stand on.
+   * - `cell`: One reading drawn as a prism: a group holding the faces the view shows. Under `selection-mode` it is the picture of a grid cell, hidden from screen readers.
+   * - `drawing`: The SVG every prism is drawn in. It is mirrored on a right-to-left page.
+   * - `left-face`: The side of a prism facing the light more: from the isometric view, the side toward the next row, drawn at its lower left. Left out where the view shows no side.
+   * - `right-face`: The side of a prism facing the light less: from the isometric view, the side toward the next column, drawn at its lower right. Left out where the view shows one side or none.
+   * - `row`: A column of the strip, which a grid reads as a row, under `selection-mode`. It holds the column's grid cells, which draw nothing: the prisms are painted apart, in the order the view needs.
+   * - `strip`: 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.
+   * - `top-face`: The top of a prism, which carries the reading's tone.
+   * - `cell-active`: The cell the pointer or the keys rest on. Set alongside `cell`.
+   * - `cell-selected`: A cell that is selected, under `selection-mode`. Set alongside `cell`.
+   * - `empty`: The words under the strip when the table has no readings: the `empty` slot, falling back to `empty-text`. Not drawn while the table cannot be read yet, on the server and during hydration, there being no document to resolve `for` in.
+   * - `end`: The trailing slot's box.
+   * - `footer`: The three-slot row under the strip.
+   * - `live`: The readout: a polite live region that says the cell the keys moved to. Hide it visually.
+   * - `loading`: The words under the strip while `loading` is set and there are no readings: the `loading` slot, falling back to `loading-text`.
+   * - `mark`: The invisible point the tooltip is anchored to.
+   * - `overview`: The busiest reading and the total of the readings drawn, written as a sentence for screen readers, which describes the strip. Rendered once there are cells. Hide it visually.
+   * - `plot`: The same element as `strip`, under the name every chart gives the drawing that takes focus.
+   * - `selection`: A polite region that says how many cells are selected after a change, rendered from the first change. Hide it visually.
+   * - `start`: The leading slot's box.
+   * - `summary`: The middle slot's box.
+   * - `table`: The readings as a table, for a screen reader, rendered only where they were drawn from `data`. Hide it visually.
+   * - `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 the series keys rest on, in the charts whose readings hold several series. A strip draws one, so it is never set here.
+   * - `tooltip-label`: The reading'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.
+   *
+   * - `drawn`: While a renderer has drawn the relief, and the chart's own drawing stays unseen under it.
+   * - `active`: While a cell is shown, under the pointer or the keys, with its tooltip open.
+   * - `empty`: While the `empty` part stands in place of the cells.
+   * - `loading`: While the `loading` part stands in place of the cells.
+   * - `settled`: Set one frame after the first render. Transitions wait for it, so an element does not animate its own arrival.
+   */
+  "helix-headless-spatial-heatmap": Partial<
+    HelixHeadlessSpatialHeatmapProps &
+      HelixHeadlessSpatialHeatmapSolidJsProps &
+      BaseProps<HelixHeadlessSpatialHeatmap> &
+      BaseEvents<HelixHeadlessSpatialHeatmap>
+  >;
+
+  /**
+   * A 3D ribbon chart reads its table as `Line Chart` does: **each row is a
+   * place across, such as a day, named by its label, and each numeric column a
+   * series**, named by its heading. Each series is a ribbon in a depth of its
+   * own, the first in front, its top following the values and its face falling
+   * to zero, so several series that would tangle as lines stand apart.
+   *
+   * **The flat `Line Chart` is read more exactly.** Use this one where the
+   * shape of each series, and how the series differ, matters more than any one
+   * value, such as response times by region over a month. The tooltip and the
+   * table carry the exact values, and a drag turns the view to show a ribbon
+   * another hides.
+   *
+   * **Helix draws the frame, and the chart draws the ribbons in 3D itself, in
+   * SVG**: a picture a print and a page without WebGL show too, which a drag
+   * or Shift with an arrow turns. Put a box inside the chart, and
+   * `connectSpatialRibbonChart` from `@fusion.dev/helix-plot`, given
+   * `threeRibbonDriver` from `@fusion.dev/helix-plot/three`, draws the ribbons
+   * in it with three.js, lit and in perspective.
+   *
+   * **The table is the reading.** Every number is in it, and screen readers
+   * read it. The `summary` part names the number of readings, series, and
+   * places, and the range of values, and describes the plot.
+   *
+   * **The plot is read by key, across and in depth.** It takes focus, named by
+   * `label` or the caption. The left and right arrows move from place to
+   * place, the down and up arrows from series to series, and Home and End go
+   * to the first and the last reading. The `live` part says the reading's
+   * place, series, and value in words. Shift with an arrow turns the view, and
+   * Escape lets the reading go.
+   *
+   * **A reading shows its row in a tooltip**, as on every chart: the reading a
+   * mouse or a pen rests nearest, the one tapped, or the one the keys move to.
+   *
+   * **Readings are sent as every chart sends them.** `helix-reading-change`
+   * says each move of the reading, and `helix-reading-press` a reading clicked
+   * or pressed with Enter or Space, each with the row of the table in `index`.
+   *
+   * **Keyboard.** The plot is one tab stop once it has readings.
+   *
+   * | Key | What it does |
+   * |---|---|
+   * | Tab | Moves focus to the plot. |
+   * | Right, Left | Moves to the next or the previous place. |
+   * | Down, Up | Moves to the next or the previous series. |
+   * | Home, End | Moves to the first or the last reading. |
+   * | Shift with an arrow | Turns the view across, or tilts it up and down. |
+   * | Enter, Space | Presses the reading, which sends `helix-reading-press`. |
+   * | Escape | Lets the reading go. |
+   *
+   * ## Attributes & Properties
+   *
+   * Component attributes and properties that can be applied to the element or by using JavaScript.
+   *
+   * - `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.
+   * - `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.
+   * - `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)
+   * - `readings`: The number of places on the grid, which the keys walk. (property only) (readonly)
+   * - `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)
+   * - `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.
+   *
+   * - `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.
+   * - `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.
    *
    * ## CSS Custom Properties
    *
    * CSS variables available for styling the component.
    *
-   * - `--spatial-heatmap-label-x`: Where the `start` or the `end` label stands clear of the drawing, from the footer's inline start, in pixels. The component measures it and writes it on the label, with `data-placed`, as the view turns.
-   * - `--spatial-heatmap-label-y`: Where the `start` or the `end` label stands clear of the drawing, from the footer's top, in pixels. The component measures it and writes it on the label, with `data-placed`, as the view turns.
-   * - `--spatial-heatmap-span`: 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.
-   * - `--heatmap-rows`: How many rows the strip lays out. The component writes it from the data, and the stylesheet that draws the strip reads it.
-   * - `--heatmap-tone`: The tone of the cell it is set on. The component writes it, and the stylesheet that paints the cell reads it.
-   * - `--heatmap-tone-1`: The weakest step of the magnitude ramp, used by `tones="1 …"`.
-   * - `--heatmap-tone-2`: The second step of the magnitude ramp.
-   * - `--heatmap-tone-3`: The third step of the magnitude ramp.
-   * - `--heatmap-tone-4`: The fourth step of the magnitude ramp.
-   * - `--heatmap-tone-5`: The strongest step of the magnitude ramp.
-   * - `--heatmap-tone-accent`: The color of the `accent` tone.
-   * - `--heatmap-tone-danger`: The color of the `danger` tone.
-   * - `--heatmap-tone-info`: The color of the `info` tone.
-   * - `--heatmap-tone-muted`: The color of the `muted` tone: a quiet background, for a bucket that means nothing happened.
-   * - `--heatmap-tone-primary`: The color of the `primary` tone.
-   * - `--heatmap-tone-success`: The color of the `success` tone, named in `tones` or in `data-tone`.
-   * - `--heatmap-tone-warning`: The color of the `warning` tone.
+   * - `--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.
    *
-   * - `base`: The slab the prisms stand on: a group holding its top and its two sides. Hidden from screen readers.
-   * - `base-left`: The slab's side toward the viewer at the lower left, under the strip's last row.
-   * - `base-right`: The slab's side toward the viewer at the lower right, under the newest column.
-   * - `base-top`: The slab's top, which is the floor the prisms stand on.
-   * - `cell`: One reading drawn as a prism: a group holding the faces the view shows. Under `selection-mode` it is the picture of a grid cell, hidden from screen readers.
-   * - `drawing`: The SVG every prism is drawn in. It is mirrored on a right-to-left page.
-   * - `left-face`: The side of a prism facing the light more: from the isometric view, the side toward the next row, drawn at its lower left. Left out where the view shows no side.
-   * - `right-face`: The side of a prism facing the light less: from the isometric view, the side toward the next column, drawn at its lower right. Left out where the view shows one side or none.
-   * - `row`: A column of the strip, which a grid reads as a row, under `selection-mode`. It holds the column's grid cells, which draw nothing: the prisms are painted apart, in the order the view needs.
-   * - `strip`: 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.
-   * - `top-face`: The top of a prism, which carries the reading's tone.
-   * - `cell-active`: The cell the pointer or the keys rest on. Set alongside `cell`.
-   * - `cell-selected`: A cell that is selected, under `selection-mode`. Set alongside `cell`.
-   * - `empty`: The words under the strip when the table has no readings: the `empty` slot, falling back to `empty-text`. Not drawn while the table cannot be read yet, on the server and during hydration, there being no document to resolve `for` in.
-   * - `end`: The trailing slot's box.
-   * - `footer`: The three-slot row under the strip.
-   * - `live`: The readout: a polite live region that says the cell the keys moved to. Hide it visually.
-   * - `loading`: The words under the strip while `loading` is set and there are no readings: the `loading` slot, falling back to `loading-text`.
-   * - `mark`: The invisible point the tooltip is anchored to.
-   * - `overview`: The busiest reading and the total of the readings drawn, written as a sentence for screen readers, which describes the strip. Rendered once there are cells. Hide it visually.
-   * - `plot`: The same element as `strip`, under the name every chart gives the drawing that takes focus.
-   * - `selection`: A polite region that says how many cells are selected after a change, rendered from the first change. Hide it visually.
-   * - `start`: The leading slot's box.
-   * - `summary`: The middle slot's box.
+   * - `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`.
@@ -92056,8 +94680,8 @@ export type CustomElementsSolidJs = {
    * - `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 the series keys rest on, in the charts whose readings hold several series. A strip draws one, so it is never set here.
-   * - `tooltip-label`: The reading's own name 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`.
@@ -92068,17 +94692,17 @@ export type CustomElementsSolidJs = {
    *
    * These can be used to apply styling when a component is in a given state.
    *
-   * - `drawn`: While a renderer has drawn the relief, and the chart's own drawing stays unseen under it.
-   * - `active`: While a cell is shown, under the pointer or the keys, with its tooltip open.
-   * - `empty`: While the `empty` part stands in place of the cells.
-   * - `loading`: While the `loading` part stands in place of the cells.
+   * - `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-headless-spatial-heatmap": Partial<
-    HelixHeadlessSpatialHeatmapProps &
-      HelixHeadlessSpatialHeatmapSolidJsProps &
-      BaseProps<HelixHeadlessSpatialHeatmap> &
-      BaseEvents<HelixHeadlessSpatialHeatmap>
+  "helix-headless-spatial-ribbon-chart": Partial<
+    HelixHeadlessSpatialRibbonChartProps &
+      HelixHeadlessSpatialRibbonChartSolidJsProps &
+      BaseProps<HelixHeadlessSpatialRibbonChart> &
+      BaseEvents<HelixHeadlessSpatialRibbonChart>
   >;
 
   /**
@@ -92132,7 +94756,14 @@ export type CustomElementsSolidJs = {
    *
    * Component attributes and properties that can be applied to the element or by using JavaScript.
    *
+   * - `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.
@@ -92305,6 +94936,7 @@ export type CustomElementsSolidJs = {
    *
    * - `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.
@@ -92405,6 +95037,13 @@ export type CustomElementsSolidJs = {
    *
    * Component attributes and properties that can be applied to the element or by using JavaScript.
    *
+   * - `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.
@@ -92588,6 +95227,7 @@ export type CustomElementsSolidJs = {
    * 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.
@@ -92635,6 +95275,292 @@ export type CustomElementsSolidJs = {
       BaseEvents<HelixHeadlessSpatialSurfaceChart>
   >;
 
+  /**
+   * A 3D treemap shares a floor out among the rows of its table: **the first
+   * numeric column is each block's size, and its share of the floor is in
+   * proportion to it**. The second numeric column, where there is one, is each
+   * block's height, from zero, so one block shows two measures: how large an
+   * item is, and how it stands on another count, such as each service's
+   * requests and its errors. `group-by` names a column of text, such as a team,
+   * that gathers its rows into one part of the floor, in one color, and the
+   * part is as large as their total.
+   *
+   * **Each part is laid out as near to square as its share allows**, so two
+   * items compare by area, and the largest stand at the back left, where they
+   * hide the least. With no height column the blocks stand as one thin slab, a
+   * treemap seen in 3D.
+   *
+   * **Helix draws the frame, and the chart draws the blocks in 3D itself, in
+   * SVG**: a picture a print and a page without WebGL show too, which a drag
+   * or Shift with an arrow turns. Put a box inside the chart, and
+   * `connectSpatialTreemap` from `@fusion.dev/helix-plot`, given
+   * `threeTreemapDriver` from `@fusion.dev/helix-plot/three`, draws the blocks
+   * in it with three.js, lit and in perspective.
+   *
+   * **The table is the reading.** Every number is in it, and screen readers
+   * read it. The `summary` part names the number of items and groups and the
+   * range of their sizes, and describes the plot.
+   *
+   * **The plot is read by key, in the table's order.** It takes focus, named
+   * by `label` or the caption. The left and right arrows move from item to
+   * item, the down and up arrows among the item's measures, which the readout
+   * says first, and Home and End go to the first and the last item. Shift
+   * with an arrow turns the view, and Escape lets the item go.
+   *
+   * **A reading shows its row in a tooltip**, as on every chart: the block a
+   * mouse or a pen rests on, the block tapped, or the one the keys move to.
+   *
+   * **Readings are sent as every chart sends them.** `helix-reading-change`
+   * says each move of the reading, and `helix-reading-press` a block clicked
+   * or pressed with Enter or Space, each with the row of the table in `index`.
+   *
+   * **Keyboard.** The plot is one tab stop once it has readings.
+   *
+   * | Key | What it does |
+   * |---|---|
+   * | Tab | Moves focus to the plot. |
+   * | Right, Left | Moves to the next or the previous item, in the table's order. |
+   * | Down, Up | Moves among the item's measures, which the readout says first. |
+   * | Home, End | Moves to the first or the last item. |
+   * | Shift with an arrow | Turns the view across, or tilts it up and down. |
+   * | Enter, Space | Presses the item, which sends `helix-reading-press`. |
+   * | Escape | Lets the item go. |
+   *
+   * ## Attributes & Properties
+   *
+   * Component attributes and properties that can be applied to the element or by using JavaScript.
+   *
+   * - `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.
+   * - `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.
+   * - `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)
+   * - `readings`: The number of blocks, which the keys walk. (property only) (readonly)
+   * - `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)
+   * - `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.
+   *
+   * - `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.
+   * - `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.
+   *
+   * ## CSS Custom Properties
+   *
+   * CSS variables available for styling the component.
+   *
+   * - `--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-headless-spatial-treemap": Partial<
+    HelixHeadlessSpatialTreemapProps &
+      HelixHeadlessSpatialTreemapSolidJsProps &
+      BaseProps<HelixHeadlessSpatialTreemap> &
+      BaseEvents<HelixHeadlessSpatialTreemap>
+  >;
+
   /**
    * A `group` of the dial's menu, named by its label, as React Aria's menu
    * sections and Menu's groups are: a reader hears the name on entering the set,
@@ -99476,6 +102402,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.
@@ -100381,16 +103313,22 @@ export type CustomCssProperties = {
   "--slider-marker-at"?: (string) | undefined;
   /** Where the filled span ends, as a fraction of the track, 0 to 1: a range's upper thumb, or the farther of a single thumb and its `origin`. */
   "--slider-to"?: (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;
   /** Where the `start` or the `end` label stands clear of the drawing, from the footer's inline start, in pixels. The component measures it and writes it on the label, with `data-placed`, as the view turns. */
   "--spatial-heatmap-label-x"?: (string) | undefined;
   /** Where the `start` or the `end` label stands clear of the drawing, from the footer's top, in pixels. The component measures it and writes it on the label, with `data-placed`, as the view turns. */
   "--spatial-heatmap-label-y"?: (string) | undefined;
   /** How many cells the drawing spans across: its columns and its rows together. The component writes it on the strip, and a stylesheet that caps the cell size reads it. */
   "--spatial-heatmap-span"?: (string) | undefined;
+  /** How 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 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-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 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;
   /** Where a nested splitter crosses this one, as a percentage. */
   "--splitter-corner-at"?: (string) | undefined;
   /** Where the divider sits, as a percentage of the box. */