@fusion.dev/helix-headless 0.191.0 → 0.193.0

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@fusion.dev/helix-headless",
   "description": "Headless component tier. Structure, accessibility, state, and form participation. No styling.",
-  "version": "0.191.0",
+  "version": "0.193.0",
   "license": "MIT",
   "author": "Ross Sheppard <ross.sheppard@fusion.dev>",
   "repository": {
@@ -53,14 +53,14 @@
   },
   "bugs": "https://github.com/project-fusion/fusion/issues",
   "dependencies": {
-    "@fusion.dev/helix-core": "0.191.0",
-    "@fusion.dev/helix-icons": "0.191.0",
+    "@fusion.dev/helix-core": "0.193.0",
+    "@fusion.dev/helix-icons": "0.193.0",
     "tslib": "^2.8.1",
     "uqr": "^0.1.3"
   },
   "devDependencies": {
-    "@fusion.dev/helix-cem": "0.191.0",
-    "@fusion.dev/helix-testing": "0.191.0",
+    "@fusion.dev/helix-cem": "0.193.0",
+    "@fusion.dev/helix-testing": "0.193.0",
     "@fusion.dev/scripts": "0.0.0-dev",
     "@happy-dom/global-registrator": "^20.14.5",
     "@lit-labs/ssr": "^4.1.0",

package/types/jsx.d.ts

@@ -60692,7 +60692,7 @@ export type CustomElements = {
    * 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.189.0**, and
+   * **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`.
@@ -60716,7 +60716,12 @@ export type CustomElements = {
    * 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.
+   * `viewBox`, needs no WebGL, and has no motion to pause. Shift with an arrow
+   * turns it a step, or tilts it, 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`
@@ -60739,7 +60744,7 @@ export type CustomElements = {
    * | 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 a renderer's view, where one is connected and `selection-mode` is not `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. |
    *
    * ## Attributes & Properties
@@ -61041,11 +61046,11 @@ export type CustomElements = {
    * - `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: a group holding its three faces.
+   * - `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 face of a prism toward the next row, drawn at its lower left.
-   * - `right-face`: The face of a prism toward the next column, drawn at its lower right.
-   * - `row`: A column of prisms, which a grid reads as a row, under `selection-mode`.
+   * - `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`.
@@ -91665,7 +91670,7 @@ export type CustomElementsSolidJs = {
    * 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.189.0**, and
+   * **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`.
@@ -91689,7 +91694,12 @@ export type CustomElementsSolidJs = {
    * 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.
+   * `viewBox`, needs no WebGL, and has no motion to pause. Shift with an arrow
+   * turns it a step, or tilts it, 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`
@@ -91712,7 +91722,7 @@ export type CustomElementsSolidJs = {
    * | 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 a renderer's view, where one is connected and `selection-mode` is not `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. |
    *
    * ## Attributes & Properties
@@ -92014,11 +92024,11 @@ export type CustomElementsSolidJs = {
    * - `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: a group holding its three faces.
+   * - `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 face of a prism toward the next row, drawn at its lower left.
-   * - `right-face`: The face of a prism toward the next column, drawn at its lower right.
-   * - `row`: A column of prisms, which a grid reads as a row, under `selection-mode`.
+   * - `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`.

package/types/vue.d.ts

@@ -20517,7 +20517,7 @@ export interface WcToolkitVueGlobalComponents {
     HelixHeadlessSparklineVueProps,
     HelixHeadlessSparklineVueEvents
   >;
-  /** 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.189.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, which is the strip's first and last column: the component writes where those corners are on the 'footer', and a stylesheet stands each label at its corner. 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 renderer can draw it in 3D instead.** Put a box for it in the 'renderer' slot, and 'connectSpatialHeatmap' from '@fusion.dev/helix-plot' 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 a renderer's view, where one is connected and 'selection-mode' is not 'multiple'. | | Escape | Puts the cell's tooltip away. | */
+  /** 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, which is the strip's first and last column: the component writes where those corners are on the 'footer', and a stylesheet stands each label at its corner. 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. Shift with an arrow turns it a step, or tilts it, 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' 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,