@fusion.dev/helix-headless 0.197.1 → 0.199.0

package/types/vue.d.ts

@@ -101,6 +101,7 @@ import type {
   HelixHeadlessMenu,
   HelixHeadlessMenuSection,
   HelixHeadlessMeter,
+  HelixHeadlessMotionToggle,
   HelixHeadlessNavigation,
   HelixHeadlessNotificationGroup,
   HelixHeadlessNotification,
@@ -134,9 +135,12 @@ import type {
   HelixHeadlessSkipLink,
   HelixHeadlessSlider,
   HelixHeadlessSparkline,
+  HelixHeadlessSpatialBarChart,
   HelixHeadlessSpatialHeatmap,
+  HelixHeadlessSpatialRibbonChart,
   HelixHeadlessSpatialScatterChart,
   HelixHeadlessSpatialSurfaceChart,
+  HelixHeadlessSpatialTreemap,
   HelixHeadlessSpeedDialGroup,
   HelixHeadlessSpeedDialItem,
   HelixHeadlessSpeedDial,
@@ -2326,7 +2330,13 @@ export type HelixHeadlessCarouselHelixSelectElementEvent =
   HelixHeadlessCarouselElementEvent<HelixSelectEvent>;
 
 export type HelixHeadlessCarouselVueProps = {
-  /** 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.
 
@@ -7812,6 +7822,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"`. */
@@ -11358,6 +11378,22 @@ export type HelixHeadlessMeterVueEvents = {
   "helix-band": HelixHeadlessMeterHelixBandElementEvent;
 };
 
+/** `HelixHeadlessMotionToggle` component event */
+export type HelixHeadlessMotionToggleElementEvent<E = Event> = TypedEvent<
+  HelixHeadlessMotionToggle,
+  E
+>;
+
+export type HelixHeadlessMotionToggleVueProps = {
+  /** The button's name, which stays the same whichever way it stands. */
+  label?: (HelixHeadlessMotionToggle["label"]) | undefined;
+};
+
+export type HelixHeadlessMotionToggleVueEvents = {
+  /** Fired after a press pauses the page's motion or lets it run. */
+  change: HelixHeadlessMotionToggleElementEvent;
+};
+
 export type HelixHeadlessNavigationVueProps = {
   /** Whether the arrow keys move focus between the destinations.
 
@@ -14516,6 +14552,144 @@ export type HelixHeadlessSparklineVueEvents = {
   "helix-reading-press": HelixHeadlessSparklineHelixReadingPressElementEvent;
 };
 
+/** `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 HelixHeadlessSpatialBarChartVueProps = {
+  /** 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;
+};
+
+export type HelixHeadlessSpatialBarChartVueEvents = {
+  /** The bars or the bar the keys rest on changed, which the renderer is told. It stays on the chart. */
+  "helix-plot-change": HelixHeadlessSpatialBarChartHelixPlotChangeElementEvent;
+  /** Shift with an arrow asked the view to turn, by a step across or up. */
+  "helix-plot-turn": HelixHeadlessSpatialBarChartHelixPlotTurnElementEvent;
+  /** 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-change": HelixHeadlessSpatialBarChartHelixReadingChangeElementEvent;
+  /** A bar was clicked or pressed with Enter or Space, with the same detail as `helix-reading-change`. */
+  "helix-reading-press": HelixHeadlessSpatialBarChartHelixReadingPressElementEvent;
+};
+
 /** `HelixHeadlessSpatialHeatmap` component event */
 export type HelixHeadlessSpatialHeatmapElementEvent<E = Event> = TypedEvent<
   HelixHeadlessSpatialHeatmap,
@@ -14773,6 +14947,144 @@ export type HelixHeadlessSpatialHeatmapVueEvents = {
   "helix-resize": HelixHeadlessSpatialHeatmapHelixResizeElementEvent;
 };
 
+/** `HelixHeadlessSpatialRibbonChart` component event */
+export type HelixHeadlessSpatialRibbonChartElementEvent<E = Event> = TypedEvent<
+  HelixHeadlessSpatialRibbonChart,
+  E
+>;
+/** `helix-plot-change` event type */
+export type HelixHeadlessSpatialRibbonChartHelixPlotChangeElementEvent =
+  HelixHeadlessSpatialRibbonChartElementEvent<HelixPlotChangeEvent>;
+/** `helix-plot-turn` event type */
+export type HelixHeadlessSpatialRibbonChartHelixPlotTurnElementEvent =
+  HelixHeadlessSpatialRibbonChartElementEvent<HelixPlotTurnEvent>;
+/** `helix-reading-change` event type */
+export type HelixHeadlessSpatialRibbonChartHelixReadingChangeElementEvent =
+  HelixHeadlessSpatialRibbonChartElementEvent<HelixReadingChangeEvent>;
+/** `helix-reading-press` event type */
+export type HelixHeadlessSpatialRibbonChartHelixReadingPressElementEvent =
+  HelixHeadlessSpatialRibbonChartElementEvent<HelixReadingPressEvent>;
+
+export type HelixHeadlessSpatialRibbonChartVueProps = {
+  /** 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.
+
+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;
+};
+
+export type HelixHeadlessSpatialRibbonChartVueEvents = {
+  /** The readings or the reading the keys rest on changed, which the renderer is told. It stays on the chart. */
+  "helix-plot-change": HelixHeadlessSpatialRibbonChartHelixPlotChangeElementEvent;
+  /** Shift with an arrow asked the view to turn, by a step across or up. */
+  "helix-plot-turn": HelixHeadlessSpatialRibbonChartHelixPlotTurnElementEvent;
+  /** 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-change": HelixHeadlessSpatialRibbonChartHelixReadingChangeElementEvent;
+  /** A reading was clicked or pressed with Enter or Space, with the same detail as `helix-reading-change`. */
+  "helix-reading-press": HelixHeadlessSpatialRibbonChartHelixReadingPressElementEvent;
+};
+
 /** `HelixHeadlessSpatialScatterChart` component event */
 export type HelixHeadlessSpatialScatterChartElementEvent<E = Event> =
   TypedEvent<HelixHeadlessSpatialScatterChart, E>;
@@ -14790,10 +15102,28 @@ export type HelixHeadlessSpatialScatterChartHelixReadingPressElementEvent =
   HelixHeadlessSpatialScatterChartElementEvent<HelixReadingPressEvent>;
 
 export type HelixHeadlessSpatialScatterChartVueProps = {
+  /** 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. */
@@ -14912,6 +15242,20 @@ export type HelixHeadlessSpatialSurfaceChartHelixReadingPressElementEvent =
   HelixHeadlessSpatialSurfaceChartElementEvent<HelixReadingPressEvent>;
 
 export type HelixHeadlessSpatialSurfaceChartVueProps = {
+  /** 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. */
@@ -15025,6 +15369,142 @@ export type HelixHeadlessSpatialSurfaceChartVueEvents = {
   "helix-reading-press": HelixHeadlessSpatialSurfaceChartHelixReadingPressElementEvent;
 };
 
+/** `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 HelixHeadlessSpatialTreemapVueProps = {
+  /** 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;
+};
+
+export type HelixHeadlessSpatialTreemapVueEvents = {
+  /** The blocks or the block the keys rest on changed, which the renderer is told. It stays on the chart. */
+  "helix-plot-change": HelixHeadlessSpatialTreemapHelixPlotChangeElementEvent;
+  /** Shift with an arrow asked the view to turn, by a step across or up. */
+  "helix-plot-turn": HelixHeadlessSpatialTreemapHelixPlotTurnElementEvent;
+  /** 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-change": HelixHeadlessSpatialTreemapHelixReadingChangeElementEvent;
+  /** A block was clicked or pressed with Enter or Space, with the same detail as `helix-reading-change`. */
+  "helix-reading-press": HelixHeadlessSpatialTreemapHelixReadingPressElementEvent;
+};
+
 export type HelixHeadlessSpeedDialGroupVueProps = {
   /** The group's name, drawn above its actions and read by screen readers. */
   label?: (HelixHeadlessSpeedDialGroup["label"]) | undefined;
@@ -18977,7 +19457,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;
@@ -19801,16 +20287,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. */
@@ -20289,7 +20781,7 @@ export interface WcToolkitVueGlobalComponents {
     HelixHeadlessMapPositionVueProps,
     HelixHeadlessMapPositionVueEvents
   >;
-  /** 'connectMap' draws the tiles over the map's land and roads, and under its routes, areas, and place names. Set 'ground' to draw them under the roads as well, for imagery of the ground, such as satellite or aerial photographs. Set 'max-zoom' to the deepest zoom the provider has tiles for, and the map enlarges those tiles past it. Set 'src' to one tile URL with '{z}', '{x}', and '{y}' in it, or set 'frames' to several, such as the last hour of radar. 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.  Put the tile provider's credit in 'attribution'. The frame shows it beside the map's own credit. */
+  /** 'connectMap' draws the tiles over the map's land and roads, and under its routes, areas, and place names. Set 'ground' to draw them under the roads as well, for imagery of the ground, such as satellite or aerial photographs. Set 'max-zoom' to the deepest zoom the provider has tiles for, and the map enlarges those tiles past it. Set 'src' to one tile URL with '{z}', '{x}', and '{y}' in it, or set 'frames' to several, such as the last hour of radar. 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, 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. */
   "helix-headless-map-raster": DefineCustomElement<
     HelixHeadlessMapRaster,
     HelixHeadlessMapRasterVueProps,
@@ -20343,6 +20835,12 @@ export interface WcToolkitVueGlobalComponents {
     HelixHeadlessMeterVueProps,
     HelixHeadlessMeterVueEvents
   >;
+  /** 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. */
+  "helix-headless-motion-toggle": DefineCustomElement<
+    HelixHeadlessMotionToggle,
+    HelixHeadlessMotionToggleVueProps,
+    HelixHeadlessMotionToggleVueEvents
+  >;
   /** 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 in a header, a footer, or a sidebar.  **It renders no links.** Bring your own, mark the current one with 'aria-current="page"', and style them with the 'data-navigation-item' recipe. A router renders its own anchors and cannot render them inside the component's shadow root.  The component moves a marker to the current item. It finds the current item by reading 'aria-current', so the attribute that screen readers announce also places the marker. Any value but 'false' counts, so a sidebar of sections on one page can mark the section in view with 'aria-current="location"'. Where several are marked, 'page' wins.  **The destinations can be a list.** Slot a '<ul>' or an '<ol>' of '<li>' elements, each holding a link, and a screen reader says how many there are and where each one is, as in Radix's 'NavigationMenu.List'. The marker and the arrow keys work on the list items as they do on bare links. Give the list 'role="list"' as well, since Safari drops the semantics of a list drawn without bullets.  Set 'orientation="vertical"' to stack the destinations in a column, for a sidebar.  Set 'arrows' and the arrow keys move focus between the destinations, as Radix's navigation menu does: left and right along a row, up and down a column, Home and End to the ends. A 'Megamenu' among them is reached at its trigger. Tab still stops at every link, since a navigation is a list of links and not a single control, and the keys across the other axis are left to the page and to an open panel.  While a 'Megamenu', or another disclosure among the destinations, is open, the navigation is ':state(open)', so a page can dim what lies under the panel, as Radix's navigation menu marks its open state.  A screen reader lists the page's navigation landmarks by name, so two named alike cannot be told apart. Where another navigation in the same document has the same name, "Main" for two with no 'label', the later one warns once with the kind 'duplicate-name'. */
   "helix-headless-navigation": DefineCustomElement<
     HelixHeadlessNavigation,
@@ -20511,12 +21009,24 @@ export interface WcToolkitVueGlobalComponents {
     HelixHeadlessSparklineVueProps,
     HelixHeadlessSparklineVueEvents
   >;
+  /** 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. | */
+  "helix-headless-spatial-bar-chart": DefineCustomElement<
+    HelixHeadlessSpatialBarChart,
+    HelixHeadlessSpatialBarChartVueProps,
+    HelixHeadlessSpatialBarChartVueEvents
+  >;
   /** 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, measured from zero against the highest reading in the table. 'rows="7"' makes a contribution graph, with each week a column running down to the right.  **The height says what the tone says.** Read the exact value from the tooltip or the table, and compare readings by tone. A tall reading at the front can hide a short one behind it, so the newest column stands at the front, where nothing covers it.  **Everything else is 'Heatmap'.** The table named by 'for', the tones and thresholds, the keys, the tooltip, the overview, 'selection-mode', and the events all work as they do there. The class extends the headless heatmap, and its own entry point carries the drawing, so a page using only 'Heatmap' loads none of it.  **It was 'helix-isometric-heatmap' until 0.190.0**, and 'helix-headless-isometric-heatmap' in the headless tier. The old tags are gone, and so are the '--isometric-heatmap-*' hooks, which are '--spatial-heatmap-*', and the words key, which is 'helix-spatial-heatmap'. The two shade hooks now take a step of lightness, such as '0.07', where they took a percentage mixed toward black. Every attribute, part, and event kept its name.  **'flat' lays every prism down** at no height, which leaves the tones on a plane at the same angle.  **The prisms stand on a slab**, the 'base', which reaches a little past the grid, so the relief reads as one object. The 'start' and 'end' slots name the two ends of the front edge, the long edge nearer the reader, which is the strip's first and last column. The component measures where each label stands under its corner, clear of the drawing, and writes it on the label as '--spatial-heatmap-label-x' and '--spatial-heatmap-label-y'. A renderer tells the chart where it draws those corners, so the labels stand at them there too, and follow them as the view turns.  **'gap' and 'min-cell' set the smallest cell.** The drawing scales as a whole, so a wider box draws larger cells and the gap grows with them. A box too narrow for every column at 'min-cell' draws the newest that fit.  **The drawing is SVG and holds still.** It scales with its box through its 'viewBox', needs no WebGL, and has no motion to pause. A drag turns it and tilts it, and Shift with an arrow turns it a step, from the isometric view it starts at. **Under 'selection-mode', the prisms are painted back to front for the view, and the grid's rows and cells stand beside them in the table's order**, holding no drawing of their own, so a turned view paints correctly and a screen reader still reads the grid in order.  **A renderer can draw it in 3D instead.** Put a box for it in the 'renderer' slot, and 'connectSpatialHeatmap' from '@fusion.dev/helix-plot', given 'threeHeatmapDriver' from '@fusion.dev/helix-plot/three', draws the prisms in it with three.js, lit, in the same tones, in a view that drags round and zooms. The chart publishes its readings in 'field', and its own drawing stays under the renderer's, unseen, where a screen reader and the keys still reach it. Shift with an arrow turns the view, except under 'selection-mode="multiple"', where it selects.  **Keyboard.** The keys are 'Heatmap''s. Down moves to the next reading in a column, drawn down to the left, and Right to the same reading in the next column, drawn down to the right.  | Key | What it does | |---|---| | Tab | Moves focus to the strip and shows the first cell. | | Down, Up | Moves to the next or the previous cell. | | Right, Left | Moves a column on or back, a week with 'rows="7"'. On a right-to-left page, Left moves on. | | Home, End | Moves to the first or the last cell. | | Page Down, Page Up | Moves a month on or back where the rows carry dates, and four columns otherwise. | | Enter, Space | Presses the cell, which sends 'helix-reading-press', and selects it or lets it go under 'selection-mode'. | | Shift with an arrow, Home, End, Page Up or Page Down | Selects every cell from the last one pressed to where the key went, under 'selection-mode="multiple"'. | | Shift with an arrow | Turns the view a step, or a renderer's where one is connected, except under 'selection-mode="multiple"'. | | Escape | Puts the cell's tooltip away. | */
   "helix-headless-spatial-heatmap": DefineCustomElement<
     HelixHeadlessSpatialHeatmap,
     HelixHeadlessSpatialHeatmapVueProps,
     HelixHeadlessSpatialHeatmapVueEvents
   >;
+  /** 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. | */
+  "helix-headless-spatial-ribbon-chart": DefineCustomElement<
+    HelixHeadlessSpatialRibbonChart,
+    HelixHeadlessSpatialRibbonChartVueProps,
+    HelixHeadlessSpatialRibbonChartVueEvents
+  >;
   /** 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 is one point. 'group-by' names a column of text, such as a team or a cluster, and each group is drawn in its own color.  **Helix draws the frame, and a renderer draws the points in 3D.** Put a box for the renderer inside the chart, and 'connectSpatialScatterChart' from '@fusion.dev/helix-plot', given 'threeScatterDriver' from '@fusion.dev/helix-plot/three', draws the points in it with three.js and keeps it in step with the chart. Until a renderer has drawn, and where none is connected, the chart draws the points in 3D itself, in SVG, from the same place the renderer's camera starts: a picture a print and a page without WebGL show too, which a drag or Shift with an arrow turns.  **The table is the reading.** Every number is in it, and screen readers read it. The 'summary' part names the three measures and the number of points, and describes the plot.  **The plot is read by key.** It takes focus, named by 'label' or the caption. The left and right arrows move from point to point in the table's order, Home and End go to the first and the last, and the up and down arrows move among the measures the readout says first. The 'live' part says the point's row in words, and the renderer marks it. Shift with an arrow turns the view, and Escape lets the point go.  **A reading shows its row in a tooltip**, as on every chart: the point a mouse or a pen rests on in the drawing, the point tapped, or the one the keys move to, once a renderer has drawn.  **Readings are sent as every chart sends them.** 'helix-reading-change' says each move of the reading, by pointer or key, and 'helix-reading-press' a point clicked, tapped, 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 points.  | Key | What it does | |---|---| | Tab | Moves focus to the plot. | | Right, Left | Moves to the next or the previous point, in the table's order. | | Up, Down | Moves among the point's measures, which the readout says first. | | Home, End | Moves to the first or the last point. | | Shift with an arrow | Turns the view across, or tilts it up and down. | | Enter, Space | Presses the point, which sends 'helix-reading-press'. | | Escape | Lets the point go. | */
   "helix-headless-spatial-scatter-chart": DefineCustomElement<
     HelixHeadlessSpatialScatterChart,
@@ -20529,6 +21039,12 @@ export interface WcToolkitVueGlobalComponents {
     HelixHeadlessSpatialSurfaceChartVueProps,
     HelixHeadlessSpatialSurfaceChartVueEvents
   >;
+  /** 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. | */
+  "helix-headless-spatial-treemap": DefineCustomElement<
+    HelixHeadlessSpatialTreemap,
+    HelixHeadlessSpatialTreemapVueProps,
+    HelixHeadlessSpatialTreemapVueEvents
+  >;
   /** 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, and the arrow keys walk through every group's actions in order, from the last action of one group to the first of the next.  Put actions straight into the group, and the group straight into the dial. Anything else slotted here is drawn and is not an action. */
   "helix-headless-speed-dial-group": DefineCustomElement<
     HelixHeadlessSpeedDialGroup,