@fusion.dev/helix-headless 0.53.0 → 0.53.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (77) hide show
  1. package/custom-elements.json +141 -141
  2. package/dist/accordion/item/accordion-item.d.ts +13 -13
  3. package/dist/accordion/root/accordion-root.d.ts +1 -1
  4. package/dist/area-chart/root/area-chart-root.js +1 -1
  5. package/dist/avatar/group/avatar-group.d.ts +11 -11
  6. package/dist/bar-chart/root/bar-chart-root.d.ts +1 -1
  7. package/dist/breadcrumbs/breadcrumb/breadcrumb.d.ts +6 -6
  8. package/dist/button/root/button-root.d.ts +1 -1
  9. package/dist/card/root/card-root.d.ts +1 -1
  10. package/dist/carousel/root/carousel-root.d.ts +14 -14
  11. package/dist/chat/composer/chat-composer.d.ts +6 -6
  12. package/dist/chat/root/chat-root.d.ts +9 -9
  13. package/dist/checkbox/root/checkbox-root.d.ts +2 -2
  14. package/dist/checkbox/root/checkbox-root.js +1 -1
  15. package/dist/code-block/root/code-block-root.d.ts +5 -5
  16. package/dist/color-input/root/color-input-root.d.ts +3 -3
  17. package/dist/color-picker/root/color-picker-root.d.ts +14 -14
  18. package/dist/combobox/root/combobox-root.d.ts +25 -5
  19. package/dist/combobox/root/combobox-root.js +6 -4
  20. package/dist/command/root/command-root.d.ts +6 -7
  21. package/dist/data-table/root/data-table-root.d.ts +61 -38
  22. package/dist/data-table/root/data-table-root.js +8 -3
  23. package/dist/data-table/root/order.d.ts +3 -3
  24. package/dist/date-input/root/date-input-root.d.ts +12 -11
  25. package/dist/dialog/root/dialog-root.d.ts +4 -4
  26. package/dist/drawer/root/drawer-root.d.ts +5 -5
  27. package/dist/filter-input/menu/filter-menu.d.ts +7 -1
  28. package/dist/filter-input/menu/filter-menu.js +2 -1
  29. package/dist/filter-input/root/filter-input-root.d.ts +6 -6
  30. package/dist/format-date/root/format-date-root.d.ts +6 -5
  31. package/dist/heatmap/root/heatmap-root.d.ts +11 -16
  32. package/dist/image/root/image-root.d.ts +4 -4
  33. package/dist/input/root/input-root.d.ts +7 -7
  34. package/dist/line-chart/root/line-chart-root.d.ts +1 -2
  35. package/dist/list/item/list-item.d.ts +6 -7
  36. package/dist/list/root/list-root.d.ts +4 -4
  37. package/dist/megamenu/root/megamenu-root.d.ts +4 -4
  38. package/dist/notifications/notification/notification.d.ts +10 -10
  39. package/dist/notifications/root/notifications-root.d.ts +1 -1
  40. package/dist/option/root/option-root.d.ts +3 -3
  41. package/dist/pagination/root/pagination-root.d.ts +2 -2
  42. package/dist/pin-input/root/pin-input-root.d.ts +4 -4
  43. package/dist/popover/root/popover-root.d.ts +7 -6
  44. package/dist/radio/root/radio-root.d.ts +12 -2
  45. package/dist/radio/root/radio-root.js +5 -1
  46. package/dist/select/root/select-root.d.ts +24 -0
  47. package/dist/select/root/select-root.js +4 -1
  48. package/dist/speed-dial/root/speed-dial-root.d.ts +8 -9
  49. package/dist/stat/root/stat-root.d.ts +3 -3
  50. package/dist/steps/root/steps-root.d.ts +1 -1
  51. package/dist/steps/step/step.d.ts +5 -5
  52. package/dist/switch/root/switch-root.js +1 -1
  53. package/dist/table/column/table-column.d.ts +28 -28
  54. package/dist/table/root/table-root.d.ts +14 -17
  55. package/dist/table/row/table-row.d.ts +4 -4
  56. package/dist/tabs/panel/tab-panel.d.ts +2 -2
  57. package/dist/tabs/root/tabs-root.js +11 -4
  58. package/dist/tabs/tab/tab.d.ts +11 -1
  59. package/dist/tabs/tab/tab.js +5 -1
  60. package/dist/time-input/root/time-input-root.d.ts +13 -13
  61. package/dist/time-picker/root/time-picker-root.d.ts +8 -8
  62. package/dist/toast/root/toast-root.d.ts +2 -2
  63. package/dist/toggle/root/toggle-root.d.ts +16 -6
  64. package/dist/toggle/root/toggle-root.js +5 -1
  65. package/dist/tooltip/root/tooltip-root.d.ts +2 -2
  66. package/dist/tour/stop/tour-stop.d.ts +3 -3
  67. package/dist/tree/item/tree-item.d.ts +2 -2
  68. package/dist/tree/item/tree-item.js +4 -3
  69. package/dist/tree/root/tree-root.d.ts +8 -7
  70. package/dist/tree/root/tree-root.js +9 -5
  71. package/dist/video-playlist/menu/video-playlist-menu.d.ts +7 -1
  72. package/dist/video-playlist/menu/video-playlist-menu.js +4 -2
  73. package/dist/video-playlist/root/video-playlist-root.d.ts +5 -5
  74. package/dist/video-playlist/root/video-playlist-root.js +2 -3
  75. package/package.json +5 -5
  76. package/types/jsx.d.ts +754 -780
  77. package/types/vue.d.ts +172 -185
package/types/jsx.d.ts CHANGED
@@ -860,13 +860,13 @@ export type HelixHeadlessAvatarGroupProps = {
860
860
  Unset shows all of them, which is what no limit means and is more useful
861
861
  than refusing to render.
862
862
 
863
- **Reflected, because the fold is a stylesheet rule and nothing else.** The
864
- styled tier hides past the limit with `:host([max="N"]) ::slotted(:nth-child(n + N+1))`,
865
- so the attribute *is* the mechanism: a `max` that reaches this property and
866
- never reaches the host matches no rule, and every avatar is drawn beside a
867
- count claiming some are hidden. Markup is the safe path and hides the fault;
868
- a script is the broken one, and React takes it for everyone, assigning a
869
- matching property rather than an attribute.
863
+ **Reflected, because the fold is a stylesheet rule and nothing else.** A
864
+ sheet hides past the limit one selector per value, as `FOLDS_UP_TO`
865
+ describes, so the attribute *is* the mechanism: a `max` that reaches this
866
+ property and never reaches the host matches no rule, and every avatar is
867
+ drawn beside a count claiming some are hidden. Markup is the safe path and
868
+ hides the fault; a script is the broken one, and React takes it for
869
+ everyone, assigning a matching property rather than an attribute.
870
870
 
871
871
  **Optional rather than defaulted, per the rule that a reflected property
872
872
  takes no default**: `max = 0` would stamp `max="0"` onto every host that
@@ -882,13 +882,13 @@ export type HelixHeadlessAvatarGroupSolidJsProps = {
882
882
  Unset shows all of them, which is what no limit means and is more useful
883
883
  than refusing to render.
884
884
 
885
- **Reflected, because the fold is a stylesheet rule and nothing else.** The
886
- styled tier hides past the limit with `:host([max="N"]) ::slotted(:nth-child(n + N+1))`,
887
- so the attribute *is* the mechanism: a `max` that reaches this property and
888
- never reaches the host matches no rule, and every avatar is drawn beside a
889
- count claiming some are hidden. Markup is the safe path and hides the fault;
890
- a script is the broken one, and React takes it for everyone, assigning a
891
- matching property rather than an attribute.
885
+ **Reflected, because the fold is a stylesheet rule and nothing else.** A
886
+ sheet hides past the limit one selector per value, as `FOLDS_UP_TO`
887
+ describes, so the attribute *is* the mechanism: a `max` that reaches this
888
+ property and never reaches the host matches no rule, and every avatar is
889
+ drawn beside a count claiming some are hidden. Markup is the safe path and
890
+ hides the fault; a script is the broken one, and React takes it for
891
+ everyone, assigning a matching property rather than an attribute.
892
892
 
893
893
  **Optional rather than defaulted, per the rule that a reflected property
894
894
  takes no default**: `max = 0` would stamp `max="0"` onto every host that
@@ -1237,12 +1237,12 @@ export type HelixHeadlessBreadcrumbProps = {
1237
1237
  current?: (HelixHeadlessBreadcrumb["current"]) | undefined;
1238
1238
  /** Where the crumb goes, and nothing where it is the current page.
1239
1239
 
1240
- **Optional and reflected, because a stylesheet does select on it.**
1241
- `breadcrumb.css` writes `:host(:not([href])) [part="link"]` to take the
1242
- block padding off a crumb that is not a link, so the attribute is what
1243
- decides how tall a crumb is. Unreflected, an `href` set from script reached
1244
- the property, rendered the anchor, and left the host looking unlinked: the
1245
- crumb drew at 20px where a markup twin drew at 28.
1240
+ **Optional and reflected, because a stylesheet does select on it.** A sheet
1241
+ writes `:host(:not([href])) [part="link"]` to take the block padding off a
1242
+ crumb that is not a link, so the attribute is what decides how tall a crumb
1243
+ is. Unreflected, an `href` set from script reached the property, rendered
1244
+ the anchor, and left the host looking unlinked: the crumb drew at 20px
1245
+ where a markup twin drew at 28.
1246
1246
 
1247
1247
  Optional rather than defaulted, which is the general rule that a reflected
1248
1248
  property takes no default: an `href` written onto every host would be a link
@@ -1265,12 +1265,12 @@ export type HelixHeadlessBreadcrumbSolidJsProps = {
1265
1265
  "prop:current"?: (HelixHeadlessBreadcrumb["current"]) | undefined;
1266
1266
  /** Where the crumb goes, and nothing where it is the current page.
1267
1267
 
1268
- **Optional and reflected, because a stylesheet does select on it.**
1269
- `breadcrumb.css` writes `:host(:not([href])) [part="link"]` to take the
1270
- block padding off a crumb that is not a link, so the attribute is what
1271
- decides how tall a crumb is. Unreflected, an `href` set from script reached
1272
- the property, rendered the anchor, and left the host looking unlinked: the
1273
- crumb drew at 20px where a markup twin drew at 28.
1268
+ **Optional and reflected, because a stylesheet does select on it.** A sheet
1269
+ writes `:host(:not([href])) [part="link"]` to take the block padding off a
1270
+ crumb that is not a link, so the attribute is what decides how tall a crumb
1271
+ is. Unreflected, an `href` set from script reached the property, rendered
1272
+ the anchor, and left the host looking unlinked: the crumb drew at 20px
1273
+ where a markup twin drew at 28.
1274
1274
 
1275
1275
  Optional rather than defaulted, which is the general rule that a reflected
1276
1276
  property takes no default: an `href` written onto every host would be a link
@@ -1369,7 +1369,7 @@ the trigger silently does nothing at all. A wrapper has to hand them down,
1369
1369
  the same way `label` becomes `aria-label` in there.
1370
1370
 
1371
1371
  ```html
1372
- <helix-button commandfor="confirm" command="--show">Delete…</helix-button>
1372
+ <helix-headless-button commandfor="confirm" command="--show">Delete…</helix-headless-button>
1373
1373
  ```
1374
1374
 
1375
1375
  `commandFor` spells its attribute out, because Lit lowercases a property
@@ -1530,7 +1530,7 @@ the trigger silently does nothing at all. A wrapper has to hand them down,
1530
1530
  the same way `label` becomes `aria-label` in there.
1531
1531
 
1532
1532
  ```html
1533
- <helix-button commandfor="confirm" command="--show">Delete…</helix-button>
1533
+ <helix-headless-button commandfor="confirm" command="--show">Delete…</helix-headless-button>
1534
1534
  ```
1535
1535
 
1536
1536
  `commandFor` spells its attribute out, because Lit lowercases a property
@@ -1857,13 +1857,13 @@ end while the slides stop moving a third of the way through.
1857
1857
  **The number is published to the styles rather than enumerated by them**,
1858
1858
  as `--carousel-per-view` on the track, which is what keeps a width and a
1859
1859
  count from disagreeing. A sheet can only name a value it wrote a rule for,
1860
- so the styled tier enumerated `per-view="2"` through `5` and called five a
1861
- judgment; above it the pane fell back to one across while this file went on
1862
- counting positions. Measured in Chromium over eight slides, six across gave
1863
- three dots, a pane taking the whole track and five slides reachable only by
1864
- dragging. Written from here there is no ceiling to exceed, and a consumer's
1865
- own sheet reads the same declaration the styled one does. `runEnd` publishes
1866
- its correction the same way and for the same reason.
1860
+ so a sheet enumerating `per-view="2"` through `5` is a ceiling of five, and
1861
+ above it the pane falls back to one across while this file goes on counting
1862
+ positions. Measured in Chromium over eight slides against such a sheet, six
1863
+ across gave three dots, a pane taking the whole track and five slides
1864
+ reachable only by dragging. Published from here there is no ceiling to
1865
+ exceed, and every sheet reads the same declaration. `runEnd` publishes its
1866
+ correction the same way and for the same reason.
1867
1867
 
1868
1868
  **On the track and not on the host.** A custom property on the host is a
1869
1869
  reflected attribute by another name: it would arrive on upgrade, and a
@@ -1888,8 +1888,8 @@ inline the count would outrank the sheet that computes it, which is why an
1888
1888
  `auto` track is handed nothing. A count stays for the design that calls for
1889
1889
  exactly three.
1890
1890
 
1891
- The styled sheet says how it divides, and the headless `auto` example
1892
- carries the same three lines for a consumer writing their own.
1891
+ A sheet says how it divides, and the `auto` example here carries the same
1892
+ three lines for a consumer writing their own.
1893
1893
 
1894
1894
  **A value rather than the resting behavior**, which is what the
1895
1895
  responsiveness policy asks of every axis that a box decides: a splitter
@@ -1917,13 +1917,13 @@ end while the slides stop moving a third of the way through.
1917
1917
  **The number is published to the styles rather than enumerated by them**,
1918
1918
  as `--carousel-per-view` on the track, which is what keeps a width and a
1919
1919
  count from disagreeing. A sheet can only name a value it wrote a rule for,
1920
- so the styled tier enumerated `per-view="2"` through `5` and called five a
1921
- judgment; above it the pane fell back to one across while this file went on
1922
- counting positions. Measured in Chromium over eight slides, six across gave
1923
- three dots, a pane taking the whole track and five slides reachable only by
1924
- dragging. Written from here there is no ceiling to exceed, and a consumer's
1925
- own sheet reads the same declaration the styled one does. `runEnd` publishes
1926
- its correction the same way and for the same reason.
1920
+ so a sheet enumerating `per-view="2"` through `5` is a ceiling of five, and
1921
+ above it the pane falls back to one across while this file goes on counting
1922
+ positions. Measured in Chromium over eight slides against such a sheet, six
1923
+ across gave three dots, a pane taking the whole track and five slides
1924
+ reachable only by dragging. Published from here there is no ceiling to
1925
+ exceed, and every sheet reads the same declaration. `runEnd` publishes its
1926
+ correction the same way and for the same reason.
1927
1927
 
1928
1928
  **On the track and not on the host.** A custom property on the host is a
1929
1929
  reflected attribute by another name: it would arrive on upgrade, and a
@@ -1948,8 +1948,8 @@ inline the count would outrank the sheet that computes it, which is why an
1948
1948
  `auto` track is handed nothing. A count stays for the design that calls for
1949
1949
  exactly three.
1950
1950
 
1951
- The styled sheet says how it divides, and the headless `auto` example
1952
- carries the same three lines for a consumer writing their own.
1951
+ A sheet says how it divides, and the `auto` example here carries the same
1952
+ three lines for a consumer writing their own.
1953
1953
 
1954
1954
  **A value rather than the resting behavior**, which is what the
1955
1955
  responsiveness policy asks of every axis that a box decides: a splitter
@@ -2046,13 +2046,13 @@ end while the slides stop moving a third of the way through.
2046
2046
  **The number is published to the styles rather than enumerated by them**,
2047
2047
  as `--carousel-per-view` on the track, which is what keeps a width and a
2048
2048
  count from disagreeing. A sheet can only name a value it wrote a rule for,
2049
- so the styled tier enumerated `per-view="2"` through `5` and called five a
2050
- judgment; above it the pane fell back to one across while this file went on
2051
- counting positions. Measured in Chromium over eight slides, six across gave
2052
- three dots, a pane taking the whole track and five slides reachable only by
2053
- dragging. Written from here there is no ceiling to exceed, and a consumer's
2054
- own sheet reads the same declaration the styled one does. `runEnd` publishes
2055
- its correction the same way and for the same reason.
2049
+ so a sheet enumerating `per-view="2"` through `5` is a ceiling of five, and
2050
+ above it the pane falls back to one across while this file goes on counting
2051
+ positions. Measured in Chromium over eight slides against such a sheet, six
2052
+ across gave three dots, a pane taking the whole track and five slides
2053
+ reachable only by dragging. Published from here there is no ceiling to
2054
+ exceed, and every sheet reads the same declaration. `runEnd` publishes its
2055
+ correction the same way and for the same reason.
2056
2056
 
2057
2057
  **On the track and not on the host.** A custom property on the host is a
2058
2058
  reflected attribute by another name: it would arrive on upgrade, and a
@@ -2077,8 +2077,8 @@ inline the count would outrank the sheet that computes it, which is why an
2077
2077
  `auto` track is handed nothing. A count stays for the design that calls for
2078
2078
  exactly three.
2079
2079
 
2080
- The styled sheet says how it divides, and the headless `auto` example
2081
- carries the same three lines for a consumer writing their own.
2080
+ A sheet says how it divides, and the `auto` example here carries the same
2081
+ three lines for a consumer writing their own.
2082
2082
 
2083
2083
  **A value rather than the resting behavior**, which is what the
2084
2084
  responsiveness policy asks of every axis that a box decides: a splitter
@@ -2106,13 +2106,13 @@ end while the slides stop moving a third of the way through.
2106
2106
  **The number is published to the styles rather than enumerated by them**,
2107
2107
  as `--carousel-per-view` on the track, which is what keeps a width and a
2108
2108
  count from disagreeing. A sheet can only name a value it wrote a rule for,
2109
- so the styled tier enumerated `per-view="2"` through `5` and called five a
2110
- judgment; above it the pane fell back to one across while this file went on
2111
- counting positions. Measured in Chromium over eight slides, six across gave
2112
- three dots, a pane taking the whole track and five slides reachable only by
2113
- dragging. Written from here there is no ceiling to exceed, and a consumer's
2114
- own sheet reads the same declaration the styled one does. `runEnd` publishes
2115
- its correction the same way and for the same reason.
2109
+ so a sheet enumerating `per-view="2"` through `5` is a ceiling of five, and
2110
+ above it the pane falls back to one across while this file goes on counting
2111
+ positions. Measured in Chromium over eight slides against such a sheet, six
2112
+ across gave three dots, a pane taking the whole track and five slides
2113
+ reachable only by dragging. Published from here there is no ceiling to
2114
+ exceed, and every sheet reads the same declaration. `runEnd` publishes its
2115
+ correction the same way and for the same reason.
2116
2116
 
2117
2117
  **On the track and not on the host.** A custom property on the host is a
2118
2118
  reflected attribute by another name: it would arrive on upgrade, and a
@@ -2137,8 +2137,8 @@ inline the count would outrank the sheet that computes it, which is why an
2137
2137
  `auto` track is handed nothing. A count stays for the design that calls for
2138
2138
  exactly three.
2139
2139
 
2140
- The styled sheet says how it divides, and the headless `auto` example
2141
- carries the same three lines for a consumer writing their own.
2140
+ A sheet says how it divides, and the `auto` example here carries the same
2141
+ three lines for a consumer writing their own.
2142
2142
 
2143
2143
  **A value rather than the resting behavior**, which is what the
2144
2144
  responsiveness policy asks of every axis that a box decides: a splitter
@@ -2387,13 +2387,13 @@ pinned because a conversation opens at its most recent turn.
2387
2387
 
2388
2388
  **Not reflected, and the default is why.** A reflected property that
2389
2389
  defaults to true writes its attribute on upgrade whether or not the
2390
- consumer wrote one, so the server serves `<helix-chat label="x">` and the
2391
- client turns it into `<helix-chat label="x" pinned>`: a hydration mismatch a
2392
- React consumer reports and does not patch up. Nothing needs the attribute
2393
- either, because the one thing that changes with the pin is the way back, and
2394
- that is a part inside the shadow tree where a stylesheet can already reach
2395
- it. Measured rather than assumed: `label, pinned` after upgrade against
2396
- `label` from the server. */
2390
+ consumer wrote one, so the server serves `<helix-headless-chat label="x">`
2391
+ and the client turns it into `<helix-headless-chat label="x" pinned>`: a
2392
+ hydration mismatch a React consumer reports and does not patch up. Nothing
2393
+ needs the attribute either, because the one thing that changes with the pin
2394
+ is the way back, and that is a part inside the shadow tree where a
2395
+ stylesheet can already reach it. Measured rather than assumed: `label,
2396
+ pinned` after upgrade against `label` from the server. */
2397
2397
  pinned?: (HelixHeadlessChat["pinned"]) | undefined;
2398
2398
  /** How near the bottom still counts as being at it, in pixels.
2399
2399
 
@@ -2464,13 +2464,13 @@ pinned because a conversation opens at its most recent turn.
2464
2464
 
2465
2465
  **Not reflected, and the default is why.** A reflected property that
2466
2466
  defaults to true writes its attribute on upgrade whether or not the
2467
- consumer wrote one, so the server serves `<helix-chat label="x">` and the
2468
- client turns it into `<helix-chat label="x" pinned>`: a hydration mismatch a
2469
- React consumer reports and does not patch up. Nothing needs the attribute
2470
- either, because the one thing that changes with the pin is the way back, and
2471
- that is a part inside the shadow tree where a stylesheet can already reach
2472
- it. Measured rather than assumed: `label, pinned` after upgrade against
2473
- `label` from the server. */
2467
+ consumer wrote one, so the server serves `<helix-headless-chat label="x">`
2468
+ and the client turns it into `<helix-headless-chat label="x" pinned>`: a
2469
+ hydration mismatch a React consumer reports and does not patch up. Nothing
2470
+ needs the attribute either, because the one thing that changes with the pin
2471
+ is the way back, and that is a part inside the shadow tree where a
2472
+ stylesheet can already reach it. Measured rather than assumed: `label,
2473
+ pinned` after upgrade against `label` from the server. */
2474
2474
  "prop:pinned"?: (HelixHeadlessChat["pinned"]) | undefined;
2475
2475
  /** How near the bottom still counts as being at it, in pixels.
2476
2476
 
@@ -2790,11 +2790,11 @@ present, which is true. Measured, and it is why this is named the other way
2790
2790
  round. The platform already writes booleans like this for the same reason,
2791
2791
  `novalidate` and `nomodule` and `noreferrer` among them.
2792
2792
 
2793
- **Reflected, because the gutter is a stylesheet rule.** `code-block.css`
2794
- reserves the copy button's width with `:host(:not([no-copy]))`, so the
2795
- attribute is what decides whether the block pays for a control. Unreflected,
2796
- setting it from script takes the button away (`render` reads the property)
2797
- and leaves the 40px it stood in reserved.
2793
+ **Reflected, because the gutter is a stylesheet rule.** A sheet reserves
2794
+ the copy button's width with `:host(:not([no-copy]))`, so the attribute is
2795
+ what decides whether the block pays for a control. Unreflected, setting it
2796
+ from script takes the button away (`render` reads the property) and leaves
2797
+ the 40px it stood in reserved.
2798
2798
 
2799
2799
  A false boolean reflects as the attribute's absence, so this costs no
2800
2800
  `no-copy=""` on hosts that never asked for one, and the rule about a
@@ -2810,11 +2810,11 @@ present, which is true. Measured, and it is why this is named the other way
2810
2810
  round. The platform already writes booleans like this for the same reason,
2811
2811
  `novalidate` and `nomodule` and `noreferrer` among them.
2812
2812
 
2813
- **Reflected, because the gutter is a stylesheet rule.** `code-block.css`
2814
- reserves the copy button's width with `:host(:not([no-copy]))`, so the
2815
- attribute is what decides whether the block pays for a control. Unreflected,
2816
- setting it from script takes the button away (`render` reads the property)
2817
- and leaves the 40px it stood in reserved.
2813
+ **Reflected, because the gutter is a stylesheet rule.** A sheet reserves
2814
+ the copy button's width with `:host(:not([no-copy]))`, so the attribute is
2815
+ what decides whether the block pays for a control. Unreflected, setting it
2816
+ from script takes the button away (`render` reads the property) and leaves
2817
+ the 40px it stood in reserved.
2818
2818
 
2819
2819
  A false boolean reflects as the attribute's absence, so this costs no
2820
2820
  `no-copy=""` on hosts that never asked for one, and the rule about a
@@ -2849,11 +2849,11 @@ present, which is true. Measured, and it is why this is named the other way
2849
2849
  round. The platform already writes booleans like this for the same reason,
2850
2850
  `novalidate` and `nomodule` and `noreferrer` among them.
2851
2851
 
2852
- **Reflected, because the gutter is a stylesheet rule.** `code-block.css`
2853
- reserves the copy button's width with `:host(:not([no-copy]))`, so the
2854
- attribute is what decides whether the block pays for a control. Unreflected,
2855
- setting it from script takes the button away (`render` reads the property)
2856
- and leaves the 40px it stood in reserved.
2852
+ **Reflected, because the gutter is a stylesheet rule.** A sheet reserves
2853
+ the copy button's width with `:host(:not([no-copy]))`, so the attribute is
2854
+ what decides whether the block pays for a control. Unreflected, setting it
2855
+ from script takes the button away (`render` reads the property) and leaves
2856
+ the 40px it stood in reserved.
2857
2857
 
2858
2858
  A false boolean reflects as the attribute's absence, so this costs no
2859
2859
  `no-copy=""` on hosts that never asked for one, and the rule about a
@@ -2869,11 +2869,11 @@ present, which is true. Measured, and it is why this is named the other way
2869
2869
  round. The platform already writes booleans like this for the same reason,
2870
2870
  `novalidate` and `nomodule` and `noreferrer` among them.
2871
2871
 
2872
- **Reflected, because the gutter is a stylesheet rule.** `code-block.css`
2873
- reserves the copy button's width with `:host(:not([no-copy]))`, so the
2874
- attribute is what decides whether the block pays for a control. Unreflected,
2875
- setting it from script takes the button away (`render` reads the property)
2876
- and leaves the 40px it stood in reserved.
2872
+ **Reflected, because the gutter is a stylesheet rule.** A sheet reserves
2873
+ the copy button's width with `:host(:not([no-copy]))`, so the attribute is
2874
+ what decides whether the block pays for a control. Unreflected, setting it
2875
+ from script takes the button away (`render` reads the property) and leaves
2876
+ the 40px it stood in reserved.
2877
2877
 
2878
2878
  A false boolean reflects as the attribute's absence, so this costs no
2879
2879
  `no-copy=""` on hosts that never asked for one, and the rule about a
@@ -3315,10 +3315,10 @@ letting it open would take a color from the reader and drop it. */
3315
3315
 
3316
3316
  **A color is exactly as requirable as a date**, which is the comparison
3317
3317
  that settles it: this element extends `HelixFormElement`, carries `name`
3318
- and reports its value, so a consumer writing
3319
- `<helix-color-picker name="brand" required>` inside a form has every reason
3320
- to expect the form to refuse an empty one. Its two siblings in the same
3321
- composition position, Date Picker and Time Picker, both check it.
3318
+ and reports its value, so a consumer writing `<helix-headless-color-picker
3319
+ name="brand" required>` inside a form has every reason to expect the form
3320
+ to refuse an empty one. Its two siblings in the same composition position,
3321
+ Date Picker and Time Picker, both check it.
3322
3322
 
3323
3323
  Written out rather than taken from `MixinField`, for the reason those two
3324
3324
  record: the mixin brings a label, a hint and a feedback region, and this is
@@ -3508,10 +3508,10 @@ letting it open would take a color from the reader and drop it. */
3508
3508
 
3509
3509
  **A color is exactly as requirable as a date**, which is the comparison
3510
3510
  that settles it: this element extends `HelixFormElement`, carries `name`
3511
- and reports its value, so a consumer writing
3512
- `<helix-color-picker name="brand" required>` inside a form has every reason
3513
- to expect the form to refuse an empty one. Its two siblings in the same
3514
- composition position, Date Picker and Time Picker, both check it.
3511
+ and reports its value, so a consumer writing `<helix-headless-color-picker
3512
+ name="brand" required>` inside a form has every reason to expect the form
3513
+ to refuse an empty one. Its two siblings in the same composition position,
3514
+ Date Picker and Time Picker, both check it.
3515
3515
 
3516
3516
  Written out rather than taken from `MixinField`, for the reason those two
3517
3517
  record: the mixin brings a label, a hint and a feedback region, and this is
@@ -4123,7 +4123,7 @@ the trigger silently does nothing at all. A wrapper has to hand them down,
4123
4123
  the same way `label` becomes `aria-label` in there.
4124
4124
 
4125
4125
  ```html
4126
- <helix-button commandfor="confirm" command="--show">Delete…</helix-button>
4126
+ <helix-headless-button commandfor="confirm" command="--show">Delete…</helix-headless-button>
4127
4127
  ```
4128
4128
 
4129
4129
  `commandFor` spells its attribute out, because Lit lowercases a property
@@ -4292,7 +4292,7 @@ the trigger silently does nothing at all. A wrapper has to hand them down,
4292
4292
  the same way `label` becomes `aria-label` in there.
4293
4293
 
4294
4294
  ```html
4295
- <helix-button commandfor="confirm" command="--show">Delete…</helix-button>
4295
+ <helix-headless-button commandfor="confirm" command="--show">Delete…</helix-headless-button>
4296
4296
  ```
4297
4297
 
4298
4298
  `commandFor` spells its attribute out, because Lit lowercases a property
@@ -4569,17 +4569,17 @@ refusing it leaves the selection as it was. */
4569
4569
 
4570
4570
  **It announces nothing, and that is not an omission.** Nothing in this
4571
4571
  element ever asks for a different page size: a size selector is
4572
- `helix-pagination-size`, which a consumer puts in the `footer` slot and
4573
- answers themselves. Routing this through `requestChange` would announce an
4574
- event the element never has cause to fire. */
4572
+ `PaginationSize`, which a consumer puts in the `footer` slot and answers
4573
+ themselves. Routing this through `requestChange` would announce an event
4574
+ the element never has cause to fire. */
4575
4575
  "page-size"?: (HelixHeadlessDataTable["pageSize"] | `${number}`) | undefined;
4576
4576
  /** How many rows a page holds. Zero is every row, which is what "no paging" means.
4577
4577
 
4578
4578
  **It announces nothing, and that is not an omission.** Nothing in this
4579
4579
  element ever asks for a different page size: a size selector is
4580
- `helix-pagination-size`, which a consumer puts in the `footer` slot and
4581
- answers themselves. Routing this through `requestChange` would announce an
4582
- event the element never has cause to fire. */
4580
+ `PaginationSize`, which a consumer puts in the `footer` slot and answers
4581
+ themselves. Routing this through `requestChange` would announce an event
4582
+ the element never has cause to fire. */
4583
4583
  pageSize?: (HelixHeadlessDataTable["pageSize"]) | undefined;
4584
4584
  /** How many rows the whole result has, where this element cannot count them.
4585
4585
 
@@ -4772,17 +4772,17 @@ refusing it leaves the selection as it was. */
4772
4772
 
4773
4773
  **It announces nothing, and that is not an omission.** Nothing in this
4774
4774
  element ever asks for a different page size: a size selector is
4775
- `helix-pagination-size`, which a consumer puts in the `footer` slot and
4776
- answers themselves. Routing this through `requestChange` would announce an
4777
- event the element never has cause to fire. */
4775
+ `PaginationSize`, which a consumer puts in the `footer` slot and answers
4776
+ themselves. Routing this through `requestChange` would announce an event
4777
+ the element never has cause to fire. */
4778
4778
  "attr:page-size"?: (HelixHeadlessDataTable["pageSize"] | `${number}`) | undefined;
4779
4779
  /** How many rows a page holds. Zero is every row, which is what "no paging" means.
4780
4780
 
4781
4781
  **It announces nothing, and that is not an omission.** Nothing in this
4782
4782
  element ever asks for a different page size: a size selector is
4783
- `helix-pagination-size`, which a consumer puts in the `footer` slot and
4784
- answers themselves. Routing this through `requestChange` would announce an
4785
- event the element never has cause to fire. */
4783
+ `PaginationSize`, which a consumer puts in the `footer` slot and answers
4784
+ themselves. Routing this through `requestChange` would announce an event
4785
+ the element never has cause to fire. */
4786
4786
  "prop:pageSize"?: (HelixHeadlessDataTable["pageSize"]) | undefined;
4787
4787
  /** How many rows the whole result has, where this element cannot count them.
4788
4788
 
@@ -6147,10 +6147,10 @@ not, rather than shown or hidden by CSS. */
6147
6147
  modal?: (HelixHeadlessDrawer["modal"]) | undefined;
6148
6148
  /** Which edge the drawer comes from.
6149
6149
 
6150
- Unset is `end`, which the styled tier reads as `:host(:not([placement]))`
6151
- beside `:host([placement="end"])` rather than as a value written here: a
6150
+ Unset is `end`, and it stays unset rather than being written down: a
6152
6151
  default assigned to the property would reflect onto every host and put a
6153
- `placement="end"` into markup no consumer wrote. */
6152
+ `placement="end"` into markup no consumer wrote. So what this tier
6153
+ guarantees is the absence, and a sheet selects on it. */
6154
6154
  placement?: (HelixHeadlessDrawer["placement"]) | undefined;
6155
6155
  /** Whether the element is open.
6156
6156
 
@@ -6238,10 +6238,10 @@ not, rather than shown or hidden by CSS. */
6238
6238
  "prop:modal"?: (HelixHeadlessDrawer["modal"]) | undefined;
6239
6239
  /** Which edge the drawer comes from.
6240
6240
 
6241
- Unset is `end`, which the styled tier reads as `:host(:not([placement]))`
6242
- beside `:host([placement="end"])` rather than as a value written here: a
6241
+ Unset is `end`, and it stays unset rather than being written down: a
6243
6242
  default assigned to the property would reflect onto every host and put a
6244
- `placement="end"` into markup no consumer wrote. */
6243
+ `placement="end"` into markup no consumer wrote. So what this tier
6244
+ guarantees is the absence, and a sheet selects on it. */
6245
6245
  "prop:placement"?: (HelixHeadlessDrawer["placement"]) | undefined;
6246
6246
  /** Whether the element is open.
6247
6247
 
@@ -7217,11 +7217,12 @@ renders nothing rather than the epoch, which is what parsing an empty string
7217
7217
  would give.
7218
7218
 
7219
7219
  **The element's own text is read as a fallback, and only in a browser.**
7220
- `<helix-format-date elapsed>2026-08-27T01:00:00Z</helix-format-date>` is the
7221
- spelling that reads best in markup, and it cannot be the only one: measured
7222
- against Lit's server shim, `textContent`, `children`, `firstChild` and
7223
- `querySelector` are all `undefined` there, so a server has no way to see it.
7224
- An element rendered on a server needs the attribute; one rendered in a
7220
+ `<helix-headless-format-date
7221
+ elapsed>2026-08-27T01:00:00Z</helix-headless-format-date>` is the spelling
7222
+ that reads best in markup, and it cannot be the only one: measured against
7223
+ Lit's server shim, `textContent`, `children`, `firstChild` and
7224
+ `querySelector` are all `undefined` there, so a server has no way to see
7225
+ it. An element rendered on a server needs the attribute; one rendered in a
7225
7226
  browser may use either. */
7226
7227
  date?: (HelixHeadlessFormatDate["date"]) | undefined;
7227
7228
  /** How the day of the month is written, where a date is shown. */
@@ -7271,11 +7272,12 @@ renders nothing rather than the epoch, which is what parsing an empty string
7271
7272
  would give.
7272
7273
 
7273
7274
  **The element's own text is read as a fallback, and only in a browser.**
7274
- `<helix-format-date elapsed>2026-08-27T01:00:00Z</helix-format-date>` is the
7275
- spelling that reads best in markup, and it cannot be the only one: measured
7276
- against Lit's server shim, `textContent`, `children`, `firstChild` and
7277
- `querySelector` are all `undefined` there, so a server has no way to see it.
7278
- An element rendered on a server needs the attribute; one rendered in a
7275
+ `<helix-headless-format-date
7276
+ elapsed>2026-08-27T01:00:00Z</helix-headless-format-date>` is the spelling
7277
+ that reads best in markup, and it cannot be the only one: measured against
7278
+ Lit's server shim, `textContent`, `children`, `firstChild` and
7279
+ `querySelector` are all `undefined` there, so a server has no way to see
7280
+ it. An element rendered on a server needs the attribute; one rendered in a
7279
7281
  browser may use either. */
7280
7282
  "prop:date"?: (HelixHeadlessFormatDate["date"]) | undefined;
7281
7283
  /** How the day of the month is written, where a date is shown. */
@@ -7352,12 +7354,12 @@ so a number written here that disagrees with the sheet is a promise the
7352
7354
  consumer has to keep by hand, and the one number a summary is told to trust
7353
7355
  is the one it gets wrong.
7354
7356
 
7355
- The strip measures itself, so `--heatmap-cell-inline-size` and `--heatmap-gap` are
7356
- enough on their own and these two are the estimate used until the first
7357
- measurement lands. Writing the attribute pins the value and stops the
7358
- measurement being consulted, which is what a container query or a transition
7359
- on the cell size wants, where what is drawn this frame is not what the
7360
- arithmetic should plan around.
7357
+ The strip measures itself, so sizing the cells in a sheet is enough on its
7358
+ own and these two are the estimate used until the first measurement lands.
7359
+ Writing the attribute pins the value and stops the measurement being
7360
+ consulted, which is what a container query or a transition on the cell size
7361
+ wants, where what is drawn this frame is not what the arithmetic should
7362
+ plan around.
7361
7363
 
7362
7364
  Zero turns the dropping off altogether, which is right for a strip in a
7363
7365
  container that cannot get narrow. */
@@ -7370,12 +7372,12 @@ so a number written here that disagrees with the sheet is a promise the
7370
7372
  consumer has to keep by hand, and the one number a summary is told to trust
7371
7373
  is the one it gets wrong.
7372
7374
 
7373
- The strip measures itself, so `--heatmap-cell-inline-size` and `--heatmap-gap` are
7374
- enough on their own and these two are the estimate used until the first
7375
- measurement lands. Writing the attribute pins the value and stops the
7376
- measurement being consulted, which is what a container query or a transition
7377
- on the cell size wants, where what is drawn this frame is not what the
7378
- arithmetic should plan around.
7375
+ The strip measures itself, so sizing the cells in a sheet is enough on its
7376
+ own and these two are the estimate used until the first measurement lands.
7377
+ Writing the attribute pins the value and stops the measurement being
7378
+ consulted, which is what a container query or a transition on the cell size
7379
+ wants, where what is drawn this frame is not what the arithmetic should
7380
+ plan around.
7379
7381
 
7380
7382
  Zero turns the dropping off altogether, which is right for a strip in a
7381
7383
  container that cannot get narrow. */
@@ -7447,12 +7449,12 @@ so a number written here that disagrees with the sheet is a promise the
7447
7449
  consumer has to keep by hand, and the one number a summary is told to trust
7448
7450
  is the one it gets wrong.
7449
7451
 
7450
- The strip measures itself, so `--heatmap-cell-inline-size` and `--heatmap-gap` are
7451
- enough on their own and these two are the estimate used until the first
7452
- measurement lands. Writing the attribute pins the value and stops the
7453
- measurement being consulted, which is what a container query or a transition
7454
- on the cell size wants, where what is drawn this frame is not what the
7455
- arithmetic should plan around.
7452
+ The strip measures itself, so sizing the cells in a sheet is enough on its
7453
+ own and these two are the estimate used until the first measurement lands.
7454
+ Writing the attribute pins the value and stops the measurement being
7455
+ consulted, which is what a container query or a transition on the cell size
7456
+ wants, where what is drawn this frame is not what the arithmetic should
7457
+ plan around.
7456
7458
 
7457
7459
  Zero turns the dropping off altogether, which is right for a strip in a
7458
7460
  container that cannot get narrow. */
@@ -7465,12 +7467,12 @@ so a number written here that disagrees with the sheet is a promise the
7465
7467
  consumer has to keep by hand, and the one number a summary is told to trust
7466
7468
  is the one it gets wrong.
7467
7469
 
7468
- The strip measures itself, so `--heatmap-cell-inline-size` and `--heatmap-gap` are
7469
- enough on their own and these two are the estimate used until the first
7470
- measurement lands. Writing the attribute pins the value and stops the
7471
- measurement being consulted, which is what a container query or a transition
7472
- on the cell size wants, where what is drawn this frame is not what the
7473
- arithmetic should plan around.
7470
+ The strip measures itself, so sizing the cells in a sheet is enough on its
7471
+ own and these two are the estimate used until the first measurement lands.
7472
+ Writing the attribute pins the value and stops the measurement being
7473
+ consulted, which is what a container query or a transition on the cell size
7474
+ wants, where what is drawn this frame is not what the arithmetic should
7475
+ plan around.
7474
7476
 
7475
7477
  Zero turns the dropping off altogether, which is right for a strip in a
7476
7478
  container that cannot get narrow. */
@@ -7534,7 +7536,7 @@ the trigger silently does nothing at all. A wrapper has to hand them down,
7534
7536
  the same way `label` becomes `aria-label` in there.
7535
7537
 
7536
7538
  ```html
7537
- <helix-button commandfor="confirm" command="--show">Delete…</helix-button>
7539
+ <helix-headless-button commandfor="confirm" command="--show">Delete…</helix-headless-button>
7538
7540
  ```
7539
7541
 
7540
7542
  `commandFor` spells its attribute out, because Lit lowercases a property
@@ -7695,7 +7697,7 @@ the trigger silently does nothing at all. A wrapper has to hand them down,
7695
7697
  the same way `label` becomes `aria-label` in there.
7696
7698
 
7697
7699
  ```html
7698
- <helix-button commandfor="confirm" command="--show">Delete…</helix-button>
7700
+ <helix-headless-button commandfor="confirm" command="--show">Delete…</helix-headless-button>
7699
7701
  ```
7700
7702
 
7701
7703
  `commandFor` spells its attribute out, because Lit lowercases a property
@@ -7945,10 +7947,10 @@ Read-only to a consumer: it is a report rather than a setting.
7945
7947
  **Mirrored to `data-status`, and not reflected as `status`.** It is element
7946
7948
  state, so reflecting it puts the element's own bookkeeping into the markup
7947
7949
  a consumer rendered: React reads the attribute appearing at upgrade as a
7948
- hydration mismatch, and a serialized `<helix-image status="loaded">` pasted
7949
- back declares that a picture has arrived which this element has never
7950
- fetched. The `data-` name is the library's answer to both, being a name a
7951
- re-parse cannot mistake for a declaration, and it is what `data-closed` on
7950
+ hydration mismatch, and a host pasted back carrying `status="loaded"`
7951
+ declares that a picture has arrived which this element has never fetched.
7952
+ The `data-` name is the library's answer to both, being a name a re-parse
7953
+ cannot mistake for a declaration, and it is what `data-closed` on
7952
7954
  `Toast.Item` already does. A picture arrives after somebody fetched it,
7953
7955
  which puts this on the safe side of hydration: a fact that can be true on
7954
7956
  the *first* update mirrors to a custom state instead, which is what
@@ -8021,10 +8023,10 @@ Read-only to a consumer: it is a report rather than a setting.
8021
8023
  **Mirrored to `data-status`, and not reflected as `status`.** It is element
8022
8024
  state, so reflecting it puts the element's own bookkeeping into the markup
8023
8025
  a consumer rendered: React reads the attribute appearing at upgrade as a
8024
- hydration mismatch, and a serialized `<helix-image status="loaded">` pasted
8025
- back declares that a picture has arrived which this element has never
8026
- fetched. The `data-` name is the library's answer to both, being a name a
8027
- re-parse cannot mistake for a declaration, and it is what `data-closed` on
8026
+ hydration mismatch, and a host pasted back carrying `status="loaded"`
8027
+ declares that a picture has arrived which this element has never fetched.
8028
+ The `data-` name is the library's answer to both, being a name a re-parse
8029
+ cannot mistake for a declaration, and it is what `data-closed` on
8028
8030
  `Toast.Item` already does. A picture arrives after somebody fetched it,
8029
8031
  which puts this on the safe side of hydration: a fact that can be true on
8030
8032
  the *first* update mirrors to a custom state instead, which is what
@@ -8093,20 +8095,20 @@ Not a label: it goes when typing starts. */
8093
8095
  **The attribute is `readonly`, which is the platform's spelling.** A
8094
8096
  camelCase property needs an explicit `attribute`, and dash-casing a word
8095
8097
  HTML writes as one costs what an attribute always costs here: nothing
8096
- warns. `<helix-input readonly>` is what anybody who has written HTML types;
8097
- against `read-only` it parses to no property at all, and the field stays
8098
- editable with no error anywhere. Measured on the dash-cased form, `readOnly`
8099
- came back `false`. */
8098
+ warns. `<helix-headless-input readonly>` is what anybody who has written
8099
+ HTML types; against `read-only` it parses to no property at all, and the
8100
+ field stays editable with no error anywhere. Measured on the dash-cased
8101
+ form, `readOnly` came back `false`. */
8100
8102
  readonly?: (HelixHeadlessInput["readOnly"]) | undefined;
8101
8103
  /** Whether the field refuses input while still submitting its value.
8102
8104
 
8103
8105
  **The attribute is `readonly`, which is the platform's spelling.** A
8104
8106
  camelCase property needs an explicit `attribute`, and dash-casing a word
8105
8107
  HTML writes as one costs what an attribute always costs here: nothing
8106
- warns. `<helix-input readonly>` is what anybody who has written HTML types;
8107
- against `read-only` it parses to no property at all, and the field stays
8108
- editable with no error anywhere. Measured on the dash-cased form, `readOnly`
8109
- came back `false`. */
8108
+ warns. `<helix-headless-input readonly>` is what anybody who has written
8109
+ HTML types; against `read-only` it parses to no property at all, and the
8110
+ field stays editable with no error anywhere. Measured on the dash-cased
8111
+ form, `readOnly` came back `false`. */
8110
8112
  readOnly?: (HelixHeadlessInput["readOnly"]) | undefined;
8111
8113
  /** Whether a password field offers a toggle that shows what was typed.
8112
8114
 
@@ -8127,9 +8129,9 @@ The state is `aria-pressed`, not this. */
8127
8129
 
8128
8130
  **Not reflected.** Reflection exists so a selector can reach a value, and
8129
8131
  no stylesheet in this repository selects on `type`. Reflecting it writes
8130
- `type="text"` onto every `<helix-input>` ever rendered, an attribute no
8131
- consumer's markup has, which is the fault the area rules write up under
8132
- `Button`'s `href`, `target` and `rel`.
8132
+ `type="text"` onto every `<helix-headless-input>` ever rendered, an
8133
+ attribute no consumer's markup has, which is the fault the area rules write
8134
+ up under `Button`'s `href`, `target` and `rel`.
8133
8135
 
8134
8136
  Nothing reads it from the attribute either. The real `<input>` inside takes
8135
8137
  it as a property binding, which is what makes the keyboard and the
@@ -8247,20 +8249,20 @@ Not a label: it goes when typing starts. */
8247
8249
  **The attribute is `readonly`, which is the platform's spelling.** A
8248
8250
  camelCase property needs an explicit `attribute`, and dash-casing a word
8249
8251
  HTML writes as one costs what an attribute always costs here: nothing
8250
- warns. `<helix-input readonly>` is what anybody who has written HTML types;
8251
- against `read-only` it parses to no property at all, and the field stays
8252
- editable with no error anywhere. Measured on the dash-cased form, `readOnly`
8253
- came back `false`. */
8252
+ warns. `<helix-headless-input readonly>` is what anybody who has written
8253
+ HTML types; against `read-only` it parses to no property at all, and the
8254
+ field stays editable with no error anywhere. Measured on the dash-cased
8255
+ form, `readOnly` came back `false`. */
8254
8256
  "bool:readonly"?: (HelixHeadlessInput["readOnly"]) | undefined;
8255
8257
  /** Whether the field refuses input while still submitting its value.
8256
8258
 
8257
8259
  **The attribute is `readonly`, which is the platform's spelling.** A
8258
8260
  camelCase property needs an explicit `attribute`, and dash-casing a word
8259
8261
  HTML writes as one costs what an attribute always costs here: nothing
8260
- warns. `<helix-input readonly>` is what anybody who has written HTML types;
8261
- against `read-only` it parses to no property at all, and the field stays
8262
- editable with no error anywhere. Measured on the dash-cased form, `readOnly`
8263
- came back `false`. */
8262
+ warns. `<helix-headless-input readonly>` is what anybody who has written
8263
+ HTML types; against `read-only` it parses to no property at all, and the
8264
+ field stays editable with no error anywhere. Measured on the dash-cased
8265
+ form, `readOnly` came back `false`. */
8264
8266
  "prop:readOnly"?: (HelixHeadlessInput["readOnly"]) | undefined;
8265
8267
  /** Whether a password field offers a toggle that shows what was typed.
8266
8268
 
@@ -8281,9 +8283,9 @@ The state is `aria-pressed`, not this. */
8281
8283
 
8282
8284
  **Not reflected.** Reflection exists so a selector can reach a value, and
8283
8285
  no stylesheet in this repository selects on `type`. Reflecting it writes
8284
- `type="text"` onto every `<helix-input>` ever rendered, an attribute no
8285
- consumer's markup has, which is the fault the area rules write up under
8286
- `Button`'s `href`, `target` and `rel`.
8286
+ `type="text"` onto every `<helix-headless-input>` ever rendered, an
8287
+ attribute no consumer's markup has, which is the fault the area rules write
8288
+ up under `Button`'s `href`, `target` and `rel`.
8287
8289
 
8288
8290
  Nothing reads it from the attribute either. The real `<input>` inside takes
8289
8291
  it as a property binding, which is what makes the keyboard and the
@@ -8556,8 +8558,7 @@ beside it for instance. `ring` lets the ground through, for a chart drawn
8556
8558
  over something busy. `triangle` points along the axis and reads as "and
8557
8559
  onward" rather than as a second claim about the data.
8558
8560
 
8559
- The shapes come from
8560
- `helix/styled/src/shared/chart/terminus.css`, the same sheet `Sparkline` takes, so
8561
+ The shapes come from one shared sheet, the same one `Sparkline` takes, so
8561
8562
  the set is identical wherever one appears. **Which is why every value is
8562
8563
  named here.** `Sparkline` shipped `square` implemented, drawn, asserted and
8563
8564
  undocumented until the cohort before this one; this family reads the same
@@ -8667,8 +8668,7 @@ beside it for instance. `ring` lets the ground through, for a chart drawn
8667
8668
  over something busy. `triangle` points along the axis and reads as "and
8668
8669
  onward" rather than as a second claim about the data.
8669
8670
 
8670
- The shapes come from
8671
- `helix/styled/src/shared/chart/terminus.css`, the same sheet `Sparkline` takes, so
8671
+ The shapes come from one shared sheet, the same one `Sparkline` takes, so
8672
8672
  the set is identical wherever one appears. **Which is why every value is
8673
8673
  named here.** `Sparkline` shipped `square` implemented, drawn, asserted and
8674
8674
  undocumented until the cohort before this one; this family reads the same
@@ -8769,10 +8769,10 @@ has to survive with the stylesheet turned off.
8769
8769
  label?: (HelixHeadlessList["label"]) | undefined;
8770
8770
  /** Which markers an ordered list draws, in `<ol type>`'s own five values.
8771
8771
 
8772
- Reflected, because this is one of the things a stylesheet selects on and
8773
- the styled tier maps each to a `list-style-type`. The platform's spellings
8774
- rather than the CSS ones, so `<helix-list kind="ordered" type="i">` is what
8775
- a consumer would have written on an `<ol>`.
8772
+ Reflected, because this is one of the things a stylesheet selects on, each
8773
+ value mapping to a `list-style-type`. The platform's spellings rather than
8774
+ the CSS ones, so `<helix-headless-list kind="ordered" type="i">` is what a
8775
+ consumer would have written on an `<ol>`.
8776
8776
 
8777
8777
  **`start` and `reversed` are both absent and neither can be done here.**
8778
8778
  This renders no `<ol>`: the rows are slotted and numbered by the CSS
@@ -8811,10 +8811,10 @@ has to survive with the stylesheet turned off.
8811
8811
  "prop:label"?: (HelixHeadlessList["label"]) | undefined;
8812
8812
  /** Which markers an ordered list draws, in `<ol type>`'s own five values.
8813
8813
 
8814
- Reflected, because this is one of the things a stylesheet selects on and
8815
- the styled tier maps each to a `list-style-type`. The platform's spellings
8816
- rather than the CSS ones, so `<helix-list kind="ordered" type="i">` is what
8817
- a consumer would have written on an `<ol>`.
8814
+ Reflected, because this is one of the things a stylesheet selects on, each
8815
+ value mapping to a `list-style-type`. The platform's spellings rather than
8816
+ the CSS ones, so `<helix-headless-list kind="ordered" type="i">` is what a
8817
+ consumer would have written on an `<ol>`.
8818
8818
 
8819
8819
  **`start` and `reversed` are both absent and neither can be done here.**
8820
8820
  This renders no `<ol>`: the rows are slotted and numbered by the CSS
@@ -9995,10 +9995,10 @@ this element then owns.
9995
9995
 
9996
9996
  **Not reflected.** Unread is a visual state, which is why the four mixins
9997
9997
  mirror theirs, but the mirror may not be the property's own attribute:
9998
- `<helix-notification default-read>` comes back from a server without `read`
9999
- and would gain it on the first update, which React reports as a hydration
10000
- mismatch, and which a copy of the serialized element re-parses as a
10001
- declaration. `:state(read)` is what the stylesheet reads.
9998
+ `<helix-headless-notification default-read>` comes back from a server
9999
+ without `read` and would gain it on the first update, which React reports
10000
+ as a hydration mismatch, and which a copy of the serialized element
10001
+ re-parses as a declaration. `:state(read)` is what the stylesheet reads.
10002
10002
  `hydration.dom.spec.ts` holds it. */
10003
10003
  read?: (HelixHeadlessNotification["read"]) | undefined;
10004
10004
  /** State to open with, where nothing declared one. */
@@ -10050,10 +10050,10 @@ this element then owns.
10050
10050
 
10051
10051
  **Not reflected.** Unread is a visual state, which is why the four mixins
10052
10052
  mirror theirs, but the mirror may not be the property's own attribute:
10053
- `<helix-notification default-read>` comes back from a server without `read`
10054
- and would gain it on the first update, which React reports as a hydration
10055
- mismatch, and which a copy of the serialized element re-parses as a
10056
- declaration. `:state(read)` is what the stylesheet reads.
10053
+ `<helix-headless-notification default-read>` comes back from a server
10054
+ without `read` and would gain it on the first update, which React reports
10055
+ as a hydration mismatch, and which a copy of the serialized element
10056
+ re-parses as a declaration. `:state(read)` is what the stylesheet reads.
10057
10057
  `hydration.dom.spec.ts` holds it. */
10058
10058
  "prop:read"?: (HelixHeadlessNotification["read"]) | undefined;
10059
10059
  /** State to open with, where nothing declared one. */
@@ -10677,7 +10677,7 @@ attribute and the state is the property.
10677
10677
  **The attribute, read when it is asked for, and never a snapshot taken in
10678
10678
  the constructor.** A field initializer runs there, and an element the HTML
10679
10679
  parser created has none of its attributes yet at that moment: measured on
10680
- this element, on `Radio` and on `Toggle`, `<helix-option value="a"
10680
+ this element, on `Radio` and on `Toggle`, `<helix-headless-option value="a"
10681
10681
  selected>` reported `defaultSelected` as `false` both from parsed markup
10682
10682
  and from `createElement` followed by `setAttribute`, which is every way a
10683
10683
  consumer writes one. The snapshot could only ever be true for an element
@@ -10784,7 +10784,7 @@ attribute and the state is the property.
10784
10784
  **The attribute, read when it is asked for, and never a snapshot taken in
10785
10785
  the constructor.** A field initializer runs there, and an element the HTML
10786
10786
  parser created has none of its attributes yet at that moment: measured on
10787
- this element, on `Radio` and on `Toggle`, `<helix-option value="a"
10787
+ this element, on `Radio` and on `Toggle`, `<helix-headless-option value="a"
10788
10788
  selected>` reported `defaultSelected` as `false` both from parsed markup
10789
10789
  and from `createElement` followed by `setAttribute`, which is every way a
10790
10790
  consumer writes one. The snapshot could only ever be true for an element
@@ -11387,10 +11387,10 @@ other end is going to reject. A consumer whose codes really do carry
11387
11387
  marked letters wants `text`, which judges nothing.
11388
11388
 
11389
11389
  **Not reflected**: nothing selects on it, so reflecting only writes
11390
- `type="numeric"` onto every `<helix-pin-input>` ever rendered, an attribute
11391
- no consumer's markup had. The area rules carry the sentence "reflect only
11392
- what CSS selects on". The real inputs take it as a binding, which is what
11393
- makes the keyboard follow. */
11390
+ `type="numeric"` onto every `<helix-headless-pin-input>` ever rendered, an
11391
+ attribute no consumer's markup had. The area rules carry the sentence
11392
+ "reflect only what CSS selects on". The real inputs take it as a binding,
11393
+ which is what makes the keyboard follow. */
11394
11394
  type?: (HelixHeadlessPinInput["type"]) | undefined;
11395
11395
  /** The value the markup declared, which is where a reset returns to. */
11396
11396
  "default-value"?: (HelixHeadlessPinInput["defaultValue"]) | undefined;
@@ -11498,10 +11498,10 @@ other end is going to reject. A consumer whose codes really do carry
11498
11498
  marked letters wants `text`, which judges nothing.
11499
11499
 
11500
11500
  **Not reflected**: nothing selects on it, so reflecting only writes
11501
- `type="numeric"` onto every `<helix-pin-input>` ever rendered, an attribute
11502
- no consumer's markup had. The area rules carry the sentence "reflect only
11503
- what CSS selects on". The real inputs take it as a binding, which is what
11504
- makes the keyboard follow. */
11501
+ `type="numeric"` onto every `<helix-headless-pin-input>` ever rendered, an
11502
+ attribute no consumer's markup had. The area rules carry the sentence
11503
+ "reflect only what CSS selects on". The real inputs take it as a binding,
11504
+ which is what makes the keyboard follow. */
11505
11505
  "prop:type"?: (HelixHeadlessPinInput["type"]) | undefined;
11506
11506
  /** The value the markup declared, which is where a reset returns to. */
11507
11507
  "attr:default-value"?: (HelixHeadlessPinInput["defaultValue"]) | undefined;
@@ -12080,7 +12080,7 @@ attribute and the state is the property.
12080
12080
  **The attribute, read when it is asked for, and never a snapshot taken in
12081
12081
  the constructor.** A field initializer runs there, and an element the HTML
12082
12082
  parser created has none of its attributes yet at that moment: measured on
12083
- this element, on `Option` and on `Toggle`, `<helix-radio value="a"
12083
+ this element, on `Option` and on `Toggle`, `<helix-headless-radio value="a"
12084
12084
  selected>` reported `defaultSelected` as `false` both from parsed markup
12085
12085
  and from `createElement` followed by `setAttribute`, which is every way a
12086
12086
  consumer writes one. The snapshot could only ever be true for an element
@@ -12137,7 +12137,7 @@ attribute and the state is the property.
12137
12137
  **The attribute, read when it is asked for, and never a snapshot taken in
12138
12138
  the constructor.** A field initializer runs there, and an element the HTML
12139
12139
  parser created has none of its attributes yet at that moment: measured on
12140
- this element, on `Option` and on `Toggle`, `<helix-radio value="a"
12140
+ this element, on `Option` and on `Toggle`, `<helix-headless-radio value="a"
12141
12141
  selected>` reported `defaultSelected` as `false` both from parsed markup
12142
12142
  and from `createElement` followed by `setAttribute`, which is every way a
12143
12143
  consumer writes one. The snapshot could only ever be true for an element
@@ -13661,9 +13661,9 @@ the headline and the label is a caption under it.
13661
13661
  The row directions set them side by side, for a figure in a line of text or
13662
13662
  a narrow strip where a stacked pair would be two lines of almost nothing.
13663
13663
 
13664
- A property rather than a `helix-flex` around it, because the unit has to
13665
- stay on the value's baseline whichever way the pair goes, and only this
13666
- element knows which of its children the unit belongs to.
13664
+ A property rather than a `Flex` around it, because the unit has to stay on
13665
+ the value's baseline whichever way the pair goes, and only this element
13666
+ knows which of its children the unit belongs to.
13667
13667
 
13668
13668
  **Optional rather than defaulted to `column`, which is not a style
13669
13669
  preference.** A reflecting property with a default writes its attribute onto
@@ -13686,9 +13686,9 @@ the headline and the label is a caption under it.
13686
13686
  The row directions set them side by side, for a figure in a line of text or
13687
13687
  a narrow strip where a stacked pair would be two lines of almost nothing.
13688
13688
 
13689
- A property rather than a `helix-flex` around it, because the unit has to
13690
- stay on the value's baseline whichever way the pair goes, and only this
13691
- element knows which of its children the unit belongs to.
13689
+ A property rather than a `Flex` around it, because the unit has to stay on
13690
+ the value's baseline whichever way the pair goes, and only this element
13691
+ knows which of its children the unit belongs to.
13692
13692
 
13693
13693
  **Optional rather than defaulted to `column`, which is not a style
13694
13694
  preference.** A reflecting property with a default writes its attribute onto
@@ -14043,15 +14043,15 @@ export type HelixHeadlessTableColumnHelixBeforeResizeElementEvent =
14043
14043
  export type HelixHeadlessTableColumnProps = {
14044
14044
  /** Which edge the values line up against.
14045
14045
 
14046
- `end` is what a column of numbers wants, so digits of the same magnitude sit
14047
- above each other. Left unset the cell inherits the table's own alignment,
14048
- which is `start` for text in either writing direction. `helix-data-table`
14049
- aligns the cells it draws. A `helix-table`'s cells are markup the consumer
14050
- wrote, so the table writes nothing onto them: it publishes the edge to each
14051
- cell under this column as `--table-cell-align`, which `@fusion.dev/helix`
14052
- reads. The heading is this element's own, and `@fusion.dev/helix` sets it to
14053
- the same edge in either table. `end` is the inline end, so in a
14054
- right-to-left table it is the left.
14046
+ `end` is what a column of numbers wants, so digits of the same magnitude
14047
+ sit above each other. Left unset the cell inherits the table's own
14048
+ alignment, which is `start` for text in either writing direction.
14049
+ `DataTable` aligns the cells it draws. A `Table`'s cells are markup the
14050
+ consumer wrote, so the table writes nothing onto them: it publishes the
14051
+ edge to each cell under this column as `--table-cell-align`, which
14052
+ `@fusion.dev/helix` reads. The heading is this element's own, and
14053
+ `@fusion.dev/helix` sets it to the same edge in either table. `end` is the
14054
+ inline end, so in a right-to-left table it is the left.
14055
14055
 
14056
14056
  **Reflected, because the heading is drawn by a stylesheet and has no other
14057
14057
  way to learn it.** Set as a property, which is how React sets it, an
@@ -14098,8 +14098,8 @@ onto its host. */
14098
14098
  /** The track this column takes, as CSS.
14099
14099
 
14100
14100
  A single track value, so anything valid in `grid-template-columns` works:
14101
- `16rem`, `auto`, `minmax(0, 2fr)`. Left unset the column takes the track
14102
- in its place in a `helix-table`'s `columns`, where that table sets one, and
14101
+ `16rem`, `auto`, `minmax(0, 2fr)`. Left unset the column takes the track in
14102
+ its place in a `Table`'s `columns`, where that table sets one, and
14103
14103
  otherwise shares what is left over equally, as `minmax(max-content, 1fr)`.
14104
14104
  Set here, it wins over that list, which is what lets a reader resize a
14105
14105
  column in a table that set one.
@@ -14145,15 +14145,15 @@ correct default: the raw value is what an API sorted by. */
14145
14145
  export type HelixHeadlessTableColumnSolidJsProps = {
14146
14146
  /** Which edge the values line up against.
14147
14147
 
14148
- `end` is what a column of numbers wants, so digits of the same magnitude sit
14149
- above each other. Left unset the cell inherits the table's own alignment,
14150
- which is `start` for text in either writing direction. `helix-data-table`
14151
- aligns the cells it draws. A `helix-table`'s cells are markup the consumer
14152
- wrote, so the table writes nothing onto them: it publishes the edge to each
14153
- cell under this column as `--table-cell-align`, which `@fusion.dev/helix`
14154
- reads. The heading is this element's own, and `@fusion.dev/helix` sets it to
14155
- the same edge in either table. `end` is the inline end, so in a
14156
- right-to-left table it is the left.
14148
+ `end` is what a column of numbers wants, so digits of the same magnitude
14149
+ sit above each other. Left unset the cell inherits the table's own
14150
+ alignment, which is `start` for text in either writing direction.
14151
+ `DataTable` aligns the cells it draws. A `Table`'s cells are markup the
14152
+ consumer wrote, so the table writes nothing onto them: it publishes the
14153
+ edge to each cell under this column as `--table-cell-align`, which
14154
+ `@fusion.dev/helix` reads. The heading is this element's own, and
14155
+ `@fusion.dev/helix` sets it to the same edge in either table. `end` is the
14156
+ inline end, so in a right-to-left table it is the left.
14157
14157
 
14158
14158
  **Reflected, because the heading is drawn by a stylesheet and has no other
14159
14159
  way to learn it.** Set as a property, which is how React sets it, an
@@ -14200,8 +14200,8 @@ onto its host. */
14200
14200
  /** The track this column takes, as CSS.
14201
14201
 
14202
14202
  A single track value, so anything valid in `grid-template-columns` works:
14203
- `16rem`, `auto`, `minmax(0, 2fr)`. Left unset the column takes the track
14204
- in its place in a `helix-table`'s `columns`, where that table sets one, and
14203
+ `16rem`, `auto`, `minmax(0, 2fr)`. Left unset the column takes the track in
14204
+ its place in a `Table`'s `columns`, where that table sets one, and
14205
14205
  otherwise shares what is left over equally, as `minmax(max-content, 1fr)`.
14206
14206
  Set here, it wins over that list, which is what lets a reader resize a
14207
14207
  column in a table that set one.
@@ -14251,15 +14251,14 @@ correct default: the raw value is what an API sorted by. */
14251
14251
  export type HelixHeadlessTableProps = {
14252
14252
  /** The column widths as one track list, written once on the table.
14253
14253
 
14254
- With `helix-table-column` children, each track sizes the column in its
14255
- place, a hidden column counted, so hiding one takes its track with it and
14256
- the rest keep theirs. The columns decide how many tracks there are and this
14257
- list only how wide: a track past the last column is dropped, and a column
14258
- past the last track shares what is left. With no columns declared it is
14259
- the whole track list. Tracks count as the grid counts them, so
14260
- `minmax(0, 1fr)` is one and `repeat(2, 8rem)` is two, and one the grid
14261
- would refuse leaves its column at the default rather than taking the table
14262
- down to one column.
14254
+ With `TableColumn` children, each track sizes the column in its place, a
14255
+ hidden column counted, so hiding one takes its track with it and the rest
14256
+ keep theirs. The columns decide how many tracks there are and this list
14257
+ only how wide: a track past the last column is dropped, and a column past
14258
+ the last track shares what is left. With no columns declared it is the
14259
+ whole track list. Tracks count as the grid counts them, so `minmax(0, 1fr)`
14260
+ is one and `repeat(2, 8rem)` is two, and one the grid would refuse leaves
14261
+ its column at the default rather than taking the table down to one column.
14263
14262
 
14264
14263
  **A column's own `width` wins over its track here.** The width is written
14265
14264
  on the column it sizes, which is the more particular statement, and it is
@@ -14273,13 +14272,11 @@ to walk, so a render there knows of no columns and this attribute is the
14273
14272
  whole answer: a table given one lays its grid out in the first paint, and a
14274
14273
  table sized only by its columns is one track wide until it upgrades.
14275
14274
 
14276
- **`helix-data-table` has none of this, and should not.** Its columns are
14277
- its schema rather than an option, so there is always a column to write a
14278
- `width` on and a list here would be a second way to say what that says.
14279
- This table's cells are markup, and a table written as rows of cells with no
14280
- `helix-table-column` in it has nowhere else to be sized from. Both families
14281
- take the same CSS hook, `--table-columns` and `--data-table-columns`, which
14282
- wins over whichever list the element worked out. */
14275
+ **Data Table has none of this, and should not.** Its columns are its schema
14276
+ rather than an option, so there is always a column to write a `width` on
14277
+ and a list here would be a second way to say what that says. This table's
14278
+ cells are markup, and a table written as rows of cells with no column
14279
+ declared in it has nowhere else to be sized from. */
14283
14280
  columns?: (HelixHeadlessTable["columns"]) | undefined;
14284
14281
  /** Accessible name for the table. */
14285
14282
  label?: (HelixHeadlessTable["label"]) | undefined;
@@ -14302,15 +14299,14 @@ say that without the component knowing what a row looks like. */
14302
14299
  export type HelixHeadlessTableSolidJsProps = {
14303
14300
  /** The column widths as one track list, written once on the table.
14304
14301
 
14305
- With `helix-table-column` children, each track sizes the column in its
14306
- place, a hidden column counted, so hiding one takes its track with it and
14307
- the rest keep theirs. The columns decide how many tracks there are and this
14308
- list only how wide: a track past the last column is dropped, and a column
14309
- past the last track shares what is left. With no columns declared it is
14310
- the whole track list. Tracks count as the grid counts them, so
14311
- `minmax(0, 1fr)` is one and `repeat(2, 8rem)` is two, and one the grid
14312
- would refuse leaves its column at the default rather than taking the table
14313
- down to one column.
14302
+ With `TableColumn` children, each track sizes the column in its place, a
14303
+ hidden column counted, so hiding one takes its track with it and the rest
14304
+ keep theirs. The columns decide how many tracks there are and this list
14305
+ only how wide: a track past the last column is dropped, and a column past
14306
+ the last track shares what is left. With no columns declared it is the
14307
+ whole track list. Tracks count as the grid counts them, so `minmax(0, 1fr)`
14308
+ is one and `repeat(2, 8rem)` is two, and one the grid would refuse leaves
14309
+ its column at the default rather than taking the table down to one column.
14314
14310
 
14315
14311
  **A column's own `width` wins over its track here.** The width is written
14316
14312
  on the column it sizes, which is the more particular statement, and it is
@@ -14324,13 +14320,11 @@ to walk, so a render there knows of no columns and this attribute is the
14324
14320
  whole answer: a table given one lays its grid out in the first paint, and a
14325
14321
  table sized only by its columns is one track wide until it upgrades.
14326
14322
 
14327
- **`helix-data-table` has none of this, and should not.** Its columns are
14328
- its schema rather than an option, so there is always a column to write a
14329
- `width` on and a list here would be a second way to say what that says.
14330
- This table's cells are markup, and a table written as rows of cells with no
14331
- `helix-table-column` in it has nowhere else to be sized from. Both families
14332
- take the same CSS hook, `--table-columns` and `--data-table-columns`, which
14333
- wins over whichever list the element worked out. */
14323
+ **Data Table has none of this, and should not.** Its columns are its schema
14324
+ rather than an option, so there is always a column to write a `width` on
14325
+ and a list here would be a second way to say what that says. This table's
14326
+ cells are markup, and a table written as rows of cells with no column
14327
+ declared in it has nowhere else to be sized from. */
14334
14328
  "prop:columns"?: (HelixHeadlessTable["columns"]) | undefined;
14335
14329
  /** Accessible name for the table. */
14336
14330
  "prop:label"?: (HelixHeadlessTable["label"]) | undefined;
@@ -14956,8 +14950,8 @@ Absent uses the runtime's own. */
14956
14950
 
14957
14951
  Absent is one. `range` holds a start and an end, `multiple` holds any
14958
14952
  number, and both are carried as one comma-separated value, which is what a
14959
- form submits. `helix-time-picker` carries the longer note on the interaction and on
14960
- why a wheel cannot do either. */
14953
+ form submits. `TimePicker` carries the longer note on the interaction and
14954
+ on why a wheel cannot do either. */
14961
14955
  mode?: (HelixHeadlessTimeInput["mode"]) | undefined;
14962
14956
  /** What the field says before a time is in it. */
14963
14957
  placeholder?: (HelixHeadlessTimeInput["placeholder"]) | undefined;
@@ -14986,7 +14980,7 @@ never something this element would refuse to read back. */
14986
14980
  `list` offers whole times, which is what a product with slots or opening
14987
14981
  hours has. `wheels` splits them into an hour, a minute and a meridiem where
14988
14982
  the locale uses one, which is the only way to reach `23:45` without
14989
- scrolling most of a day. `helix-time-picker` carries the longer note on the trade.
14983
+ scrolling most of a day. `TimePicker` carries the longer note on the trade.
14990
14984
 
14991
14985
  **Optional rather than defaulted, which is not a style preference.** A
14992
14986
  reflecting property with a default writes its attribute onto every host the
@@ -15144,8 +15138,8 @@ Absent uses the runtime's own. */
15144
15138
 
15145
15139
  Absent is one. `range` holds a start and an end, `multiple` holds any
15146
15140
  number, and both are carried as one comma-separated value, which is what a
15147
- form submits. `helix-time-picker` carries the longer note on the interaction and on
15148
- why a wheel cannot do either. */
15141
+ form submits. `TimePicker` carries the longer note on the interaction and
15142
+ on why a wheel cannot do either. */
15149
15143
  "prop:mode"?: (HelixHeadlessTimeInput["mode"]) | undefined;
15150
15144
  /** What the field says before a time is in it. */
15151
15145
  "prop:placeholder"?: (HelixHeadlessTimeInput["placeholder"]) | undefined;
@@ -15174,7 +15168,7 @@ never something this element would refuse to read back. */
15174
15168
  `list` offers whole times, which is what a product with slots or opening
15175
15169
  hours has. `wheels` splits them into an hour, a minute and a meridiem where
15176
15170
  the locale uses one, which is the only way to reach `23:45` without
15177
- scrolling most of a day. `helix-time-picker` carries the longer note on the trade.
15171
+ scrolling most of a day. `TimePicker` carries the longer note on the trade.
15178
15172
 
15179
15173
  **Optional rather than defaulted, which is not a style preference.** A
15180
15174
  reflecting property with a default writes its attribute onto every host the
@@ -15372,7 +15366,7 @@ Absent uses the runtime's own. */
15372
15366
 
15373
15367
  Absent is one. `range` holds a start and an end with everything between
15374
15368
  them shown as part of the answer, `multiple` holds any number, and both are
15375
- carried as one comma-separated value: the same shape `helix-date-picker` uses,
15369
+ carried as one comma-separated value: the same shape `DatePicker` uses,
15376
15370
  because it is the same question asked of a different unit.
15377
15371
 
15378
15372
  **A range is two picks, and a third starts over.** That is the calendar's
@@ -15546,7 +15540,7 @@ Absent uses the runtime's own. */
15546
15540
 
15547
15541
  Absent is one. `range` holds a start and an end with everything between
15548
15542
  them shown as part of the answer, `multiple` holds any number, and both are
15549
- carried as one comma-separated value: the same shape `helix-date-picker` uses,
15543
+ carried as one comma-separated value: the same shape `DatePicker` uses,
15550
15544
  because it is the same question asked of a different unit.
15551
15545
 
15552
15546
  **A range is two picks, and a third starts over.** That is the calendar's
@@ -15845,7 +15839,7 @@ where they were would not be a stack.
15845
15839
  **Optional, and bottom-end is the absence of it.** Reflecting *and*
15846
15840
  defaulting is the pair that writes onto a host: every toast region anybody
15847
15841
  rendered would gain a `placement="bottom-end"` nobody typed, which a React
15848
- consumer's server markup does not have. The styled sheet carries the resting
15842
+ consumer's server markup does not have. A sheet carries the resting
15849
15843
  arrangement in its own `:host` rule and the selectors describe only the
15850
15844
  departures, which is what `orientation` does. */
15851
15845
  placement?: (HelixHeadlessToast["placement"]) | undefined;
@@ -15866,7 +15860,7 @@ where they were would not be a stack.
15866
15860
  **Optional, and bottom-end is the absence of it.** Reflecting *and*
15867
15861
  defaulting is the pair that writes onto a host: every toast region anybody
15868
15862
  rendered would gain a `placement="bottom-end"` nobody typed, which a React
15869
- consumer's server markup does not have. The styled sheet carries the resting
15863
+ consumer's server markup does not have. A sheet carries the resting
15870
15864
  arrangement in its own `:host` rule and the selectors describe only the
15871
15865
  departures, which is what `orientation` does. */
15872
15866
  "prop:placement"?: (HelixHeadlessToast["placement"]) | undefined;
@@ -16107,11 +16101,11 @@ attribute and the state is the property.
16107
16101
  **The attribute, read when it is asked for, and never a snapshot taken in
16108
16102
  the constructor.** A field initializer runs there, and an element the HTML
16109
16103
  parser created has none of its attributes yet at that moment: measured on
16110
- this element, on `Option` and on `Radio`, `<helix-toggle value="light"
16111
- selected>` reported `defaultSelected` as `false` both from parsed markup
16112
- and from `createElement` followed by `setAttribute`, which is every way a
16113
- consumer writes one. The snapshot could only ever be true for an element
16114
- already in the document when `customElements.define` ran.
16104
+ this element, on `Option` and on `Radio`, `<helix-headless-toggle
16105
+ value="light" selected>` reported `defaultSelected` as `false` both from
16106
+ parsed markup and from `createElement` followed by `setAttribute`, which is
16107
+ every way a consumer writes one. The snapshot could only ever be true for
16108
+ an element already in the document when `customElements.define` ran.
16115
16109
 
16116
16110
  Nothing overwrites it either, which is what makes reading it late correct
16117
16111
  rather than merely later: `selected` does not reflect, for the reason
@@ -16157,11 +16151,11 @@ attribute and the state is the property.
16157
16151
  **The attribute, read when it is asked for, and never a snapshot taken in
16158
16152
  the constructor.** A field initializer runs there, and an element the HTML
16159
16153
  parser created has none of its attributes yet at that moment: measured on
16160
- this element, on `Option` and on `Radio`, `<helix-toggle value="light"
16161
- selected>` reported `defaultSelected` as `false` both from parsed markup
16162
- and from `createElement` followed by `setAttribute`, which is every way a
16163
- consumer writes one. The snapshot could only ever be true for an element
16164
- already in the document when `customElements.define` ran.
16154
+ this element, on `Option` and on `Radio`, `<helix-headless-toggle
16155
+ value="light" selected>` reported `defaultSelected` as `false` both from
16156
+ parsed markup and from `createElement` followed by `setAttribute`, which is
16157
+ every way a consumer writes one. The snapshot could only ever be true for
16158
+ an element already in the document when `customElements.define` ran.
16165
16159
 
16166
16160
  Nothing overwrites it either, which is what makes reading it late correct
16167
16161
  rather than merely later: `selected` does not reflect, for the reason
@@ -17962,7 +17956,7 @@ export type CustomElements = {
17962
17956
  * item added a second after render coordinates on its first click.
17963
17957
  *
17964
17958
  * Items are matched with `instanceof HelixHeadlessAccordionItem`, never by tag
17965
- * name. Matching `helix-accordion-item` would tie this tier to the styled one.
17959
+ * name, so this tier does not learn about the styled one.
17966
17960
  *
17967
17961
  * The keyboard listener is the controller's and is attached on connect, so
17968
17962
  * none of it runs on the server, where there is no tree to walk and no events
@@ -18450,13 +18444,13 @@ export type CustomElements = {
18450
18444
  * Unset shows all of them, which is what no limit means and is more useful
18451
18445
  * than refusing to render.
18452
18446
  *
18453
- * **Reflected, because the fold is a stylesheet rule and nothing else.** The
18454
- * styled tier hides past the limit with `:host([max="N"]) ::slotted(:nth-child(n + N+1))`,
18455
- * so the attribute *is* the mechanism: a `max` that reaches this property and
18456
- * never reaches the host matches no rule, and every avatar is drawn beside a
18457
- * count claiming some are hidden. Markup is the safe path and hides the fault;
18458
- * a script is the broken one, and React takes it for everyone, assigning a
18459
- * matching property rather than an attribute.
18447
+ * **Reflected, because the fold is a stylesheet rule and nothing else.** A
18448
+ * sheet hides past the limit one selector per value, as `FOLDS_UP_TO`
18449
+ * describes, so the attribute *is* the mechanism: a `max` that reaches this
18450
+ * property and never reaches the host matches no rule, and every avatar is
18451
+ * drawn beside a count claiming some are hidden. Markup is the safe path and
18452
+ * hides the fault; a script is the broken one, and React takes it for
18453
+ * everyone, assigning a matching property rather than an attribute.
18460
18454
  *
18461
18455
  * **Optional rather than defaulted, per the rule that a reflected property
18462
18456
  * takes no default**: `max = 0` would stamp `max="0"` onto every host that
@@ -18869,7 +18863,7 @@ export type CustomElements = {
18869
18863
  * CSS variables available for styling the component.
18870
18864
  *
18871
18865
  * - `--bar-chart-axis`: How wide an axis column is drawn, in `ch`, from the widest number on it. Written on the axis itself, and only where the categories run along the bottom: turned sideways an axis is a row and takes a line's height instead. (default: `undefined`)
18872
- * - `--bar-chart-secondary`: The color of the secondary axis when one series owns it. It resolves a `--helix-color-series-*` token, so on the headless tier alone it names something that is not there. #138. (default: `undefined`)
18866
+ * - `--bar-chart-secondary`: The color of the secondary axis, where one series owns it. Written by the component from that series' `--chart-series-*`, so it promises the series color and nothing more: whatever that hook resolves to is what the axis is drawn in. (default: `undefined`)
18873
18867
  * - `--chart-bar-wash`: The gradient a bar would take, named per bar so the styled tier can point `fill` at it. Drawn whatever the treatment and used only where `wash="gradient"` asks for it. (default: `undefined`)
18874
18868
  *
18875
18869
  * ## CSS Parts
@@ -19012,12 +19006,12 @@ export type CustomElements = {
19012
19006
  * - `current`: Whether this item is the page the reader is on.
19013
19007
  * - `href`: Where the crumb goes, and nothing where it is the current page.
19014
19008
  *
19015
- * **Optional and reflected, because a stylesheet does select on it.**
19016
- * `breadcrumb.css` writes `:host(:not([href])) [part="link"]` to take the
19017
- * block padding off a crumb that is not a link, so the attribute is what
19018
- * decides how tall a crumb is. Unreflected, an `href` set from script reached
19019
- * the property, rendered the anchor, and left the host looking unlinked: the
19020
- * crumb drew at 20px where a markup twin drew at 28.
19009
+ * **Optional and reflected, because a stylesheet does select on it.** A sheet
19010
+ * writes `:host(:not([href])) [part="link"]` to take the block padding off a
19011
+ * crumb that is not a link, so the attribute is what decides how tall a crumb
19012
+ * is. Unreflected, an `href` set from script reached the property, rendered
19013
+ * the anchor, and left the host looking unlinked: the crumb drew at 20px
19014
+ * where a markup twin drew at 28.
19021
19015
  *
19022
19016
  * Optional rather than defaulted, which is the general rule that a reflected
19023
19017
  * property takes no default: an `href` written onto every host would be a link
@@ -19254,7 +19248,7 @@ export type CustomElements = {
19254
19248
  * the same way `label` becomes `aria-label` in there.
19255
19249
  *
19256
19250
  * ```html
19257
- * <helix-button commandfor="confirm" command="--show">Delete…</helix-button>
19251
+ * <helix-headless-button commandfor="confirm" command="--show">Delete…</helix-headless-button>
19258
19252
  * ```
19259
19253
  *
19260
19254
  * `commandFor` spells its attribute out, because Lit lowercases a property
@@ -19530,7 +19524,7 @@ export type CustomElements = {
19530
19524
  *
19531
19525
  * The host is the surface. A wrapper `<div part="container">` would be a second
19532
19526
  * box doing nothing the host cannot: the element itself takes the border, the
19533
- * radius, and the grid, and a consumer styles `helix-card` rather than reaching
19527
+ * radius, and the grid, and a consumer styles `Card` rather than reaching
19534
19528
  * through `::part`. One node instead of two, on every card on the page.
19535
19529
  *
19536
19530
  * Name the card with `aria-label` or `aria-labelledby`. That is the only
@@ -19679,13 +19673,13 @@ export type CustomElements = {
19679
19673
  * **The number is published to the styles rather than enumerated by them**,
19680
19674
  * as `--carousel-per-view` on the track, which is what keeps a width and a
19681
19675
  * count from disagreeing. A sheet can only name a value it wrote a rule for,
19682
- * so the styled tier enumerated `per-view="2"` through `5` and called five a
19683
- * judgment; above it the pane fell back to one across while this file went on
19684
- * counting positions. Measured in Chromium over eight slides, six across gave
19685
- * three dots, a pane taking the whole track and five slides reachable only by
19686
- * dragging. Written from here there is no ceiling to exceed, and a consumer's
19687
- * own sheet reads the same declaration the styled one does. `runEnd` publishes
19688
- * its correction the same way and for the same reason.
19676
+ * so a sheet enumerating `per-view="2"` through `5` is a ceiling of five, and
19677
+ * above it the pane falls back to one across while this file goes on counting
19678
+ * positions. Measured in Chromium over eight slides against such a sheet, six
19679
+ * across gave three dots, a pane taking the whole track and five slides
19680
+ * reachable only by dragging. Published from here there is no ceiling to
19681
+ * exceed, and every sheet reads the same declaration. `runEnd` publishes its
19682
+ * correction the same way and for the same reason.
19689
19683
  *
19690
19684
  * **On the track and not on the host.** A custom property on the host is a
19691
19685
  * reflected attribute by another name: it would arrive on upgrade, and a
@@ -19710,8 +19704,8 @@ export type CustomElements = {
19710
19704
  * `auto` track is handed nothing. A count stays for the design that calls for
19711
19705
  * exactly three.
19712
19706
  *
19713
- * The styled sheet says how it divides, and the headless `auto` example
19714
- * carries the same three lines for a consumer writing their own.
19707
+ * A sheet says how it divides, and the `auto` example here carries the same
19708
+ * three lines for a consumer writing their own.
19715
19709
  *
19716
19710
  * **A value rather than the resting behavior**, which is what the
19717
19711
  * responsiveness policy asks of every axis that a box decides: a splitter
@@ -20085,13 +20079,13 @@ export type CustomElements = {
20085
20079
  *
20086
20080
  * **Not reflected, and the default is why.** A reflected property that
20087
20081
  * defaults to true writes its attribute on upgrade whether or not the
20088
- * consumer wrote one, so the server serves `<helix-chat label="x">` and the
20089
- * client turns it into `<helix-chat label="x" pinned>`: a hydration mismatch a
20090
- * React consumer reports and does not patch up. Nothing needs the attribute
20091
- * either, because the one thing that changes with the pin is the way back, and
20092
- * that is a part inside the shadow tree where a stylesheet can already reach
20093
- * it. Measured rather than assumed: `label, pinned` after upgrade against
20094
- * `label` from the server.
20082
+ * consumer wrote one, so the server serves `<helix-headless-chat label="x">`
20083
+ * and the client turns it into `<helix-headless-chat label="x" pinned>`: a
20084
+ * hydration mismatch a React consumer reports and does not patch up. Nothing
20085
+ * needs the attribute either, because the one thing that changes with the pin
20086
+ * is the way back, and that is a part inside the shadow tree where a
20087
+ * stylesheet can already reach it. Measured rather than assumed: `label,
20088
+ * pinned` after upgrade against `label` from the server.
20095
20089
  * - `threshold`: How near the bottom still counts as being at it, in pixels.
20096
20090
  *
20097
20091
  * A hook rather than a constant, because the right number depends on how tall
@@ -20148,7 +20142,7 @@ export type CustomElements = {
20148
20142
  *
20149
20143
  * Areas where markup can be added to the component.
20150
20144
  *
20151
- * - `(default)`: The turns, as `helix-chat-message` children.
20145
+ * - `(default)`: The turns.
20152
20146
  * - `actions`: Beside the header: what can be done to the conversation itself.
20153
20147
  * - `composer`: Below the transcript, where the reader writes.
20154
20148
  * - `header`: Above the transcript: what this conversation is.
@@ -20611,11 +20605,11 @@ export type CustomElements = {
20611
20605
  * round. The platform already writes booleans like this for the same reason,
20612
20606
  * `novalidate` and `nomodule` and `noreferrer` among them.
20613
20607
  *
20614
- * **Reflected, because the gutter is a stylesheet rule.** `code-block.css`
20615
- * reserves the copy button's width with `:host(:not([no-copy]))`, so the
20616
- * attribute is what decides whether the block pays for a control. Unreflected,
20617
- * setting it from script takes the button away (`render` reads the property)
20618
- * and leaves the 40px it stood in reserved.
20608
+ * **Reflected, because the gutter is a stylesheet rule.** A sheet reserves
20609
+ * the copy button's width with `:host(:not([no-copy]))`, so the attribute is
20610
+ * what decides whether the block pays for a control. Unreflected, setting it
20611
+ * from script takes the button away (`render` reads the property) and leaves
20612
+ * the 40px it stood in reserved.
20619
20613
  *
20620
20614
  * A false boolean reflects as the attribute's absence, so this costs no
20621
20615
  * `no-copy=""` on hosts that never asked for one, and the rule about a
@@ -20759,11 +20753,11 @@ export type CustomElements = {
20759
20753
  >;
20760
20754
 
20761
20755
  /**
20762
- * **The picker is `helix-color-picker`, not a second one written here.** It owns the
20756
+ * **The picker is `ColorPicker`, not a second one written here.** It owns the
20763
20757
  * square, the ramps, the eyedropper and the syntax toggle, and it is worth
20764
20758
  * having on its own: a settings pane wants a picker flat on the page with
20765
20759
  * nothing to open. This element is the field, the overlay, and the form.
20766
- * Exactly the arrangement Date Input has with `helix-date-picker`.
20760
+ * Exactly the arrangement Date Input has with `DatePicker`.
20767
20761
  *
20768
20762
  * **Typed as well as picked, and the typing is the reason this is not
20769
20763
  * `<input type="color">`.** The native control gives a free picker and takes
@@ -21123,10 +21117,10 @@ export type CustomElements = {
21123
21117
  *
21124
21118
  * **A color is exactly as requirable as a date**, which is the comparison
21125
21119
  * that settles it: this element extends `HelixFormElement`, carries `name`
21126
- * and reports its value, so a consumer writing
21127
- * `<helix-color-picker name="brand" required>` inside a form has every reason
21128
- * to expect the form to refuse an empty one. Its two siblings in the same
21129
- * composition position, Date Picker and Time Picker, both check it.
21120
+ * and reports its value, so a consumer writing `<helix-headless-color-picker
21121
+ * name="brand" required>` inside a form has every reason to expect the form
21122
+ * to refuse an empty one. Its two siblings in the same composition position,
21123
+ * Date Picker and Time Picker, both check it.
21130
21124
  *
21131
21125
  * Written out rather than taken from `MixinField`, for the reason those two
21132
21126
  * record: the mixin brings a label, a hint and a feedback region, and this is
@@ -21317,10 +21311,10 @@ export type CustomElements = {
21317
21311
  >;
21318
21312
 
21319
21313
  /**
21320
- * **The list is `helix-listbox`, and the filtering is its own.** It owns
21321
- * narrowing, the empty state, the highlight, `aria-activedescendant` and
21322
- * scrolling an option into view. What is left for this element is the field,
21323
- * the panel and the traffic between them.
21314
+ * **The list is `Listbox`, and the filtering is its own.** It owns narrowing,
21315
+ * the empty state, the highlight, `aria-activedescendant` and scrolling an
21316
+ * option into view. What is left for this element is the field, the panel and
21317
+ * the traffic between them.
21324
21318
  *
21325
21319
  * **The text and the value are two things.** What a reader types is a filter:
21326
21320
  * it narrows the list and is thrown away. The value is whichever option they
@@ -21491,7 +21485,7 @@ export type CustomElements = {
21491
21485
  *
21492
21486
  * Areas where markup can be added to the component.
21493
21487
  *
21494
- * - `(default)`: The options, which are `helix-option` elements.
21488
+ * - `(default)`: The options.
21495
21489
  * - `end`: After it, for a unit or a clear button.
21496
21490
  * - `indicator`: Replaces the caret saying the field opens.
21497
21491
  * - `start`: Before the text, for an icon.
@@ -21602,12 +21596,11 @@ export type CustomElements = {
21602
21596
  >;
21603
21597
 
21604
21598
  /**
21605
- * **The list is `helix-listbox`, filtering and all.** Listbox already owns
21606
- * narrowing, the empty state, the highlight over what matched,
21607
- * `aria-activedescendant`, scrolling an option into view and the keyboard that
21608
- * moves between them. Its own note says a command palette is that list again
21609
- * with something different opening it, and this is that something: a dialog,
21610
- * and a key that summons it.
21599
+ * **The list is `Listbox`, filtering and all.** Listbox already owns narrowing,
21600
+ * the empty state, the highlight over what matched, `aria-activedescendant`,
21601
+ * scrolling an option into view and the keyboard that moves between them. Its
21602
+ * own note says a command palette is that list again with something different
21603
+ * opening it, and this is that something: a dialog, and a key that summons it.
21611
21604
  *
21612
21605
  * **The value is not kept.** A palette runs a command and forgets it: nothing
21613
21606
  * here is a form control and nothing is submitted, so what it reports is that
@@ -21684,7 +21677,7 @@ export type CustomElements = {
21684
21677
  *
21685
21678
  * Areas where markup can be added to the component.
21686
21679
  *
21687
- * - `(default)`: The commands, which are `helix-option` elements and their groups.
21680
+ * - `(default)`: The commands, and any groups of them.
21688
21681
  * - `footer`: Under the list, for the keys a reader can press.
21689
21682
  *
21690
21683
  * ## Methods
@@ -21771,7 +21764,7 @@ export type CustomElements = {
21771
21764
  * the same way `label` becomes `aria-label` in there.
21772
21765
  *
21773
21766
  * ```html
21774
- * <helix-button commandfor="confirm" command="--show">Delete…</helix-button>
21767
+ * <helix-headless-button commandfor="confirm" command="--show">Delete…</helix-headless-button>
21775
21768
  * ```
21776
21769
  *
21777
21770
  * `commandFor` spells its attribute out, because Lit lowercases a property
@@ -21969,19 +21962,19 @@ export type CustomElements = {
21969
21962
 
21970
21963
  /**
21971
21964
  * **The schema is markup and the data is a property.** Columns are declared as
21972
- * `helix-table-column` children, because a schema is small and something a
21973
- * reader should see in the HTML; rows are handed over as an array, because a
21974
- * table that draws ten thousand elements cannot window them.
21965
+ * `TableColumn` children, because a schema is small and something a reader
21966
+ * should see in the HTML; rows are handed over as an array, because a table
21967
+ * that draws ten thousand elements cannot window them.
21975
21968
  *
21976
21969
  * ```html
21977
- * <helix-data-table .rows=${rows} sort="name:asc" page-size="20">
21978
- * <helix-table-column field="name" sortable>Name</helix-table-column>
21979
- * <helix-table-column field="size" align="end" sortable .cell=${bytes}>Size</helix-table-column>
21980
- * </helix-data-table>
21970
+ * <helix-headless-data-table .rows=${rows} sort="name:asc" page-size="20">
21971
+ * <helix-headless-table-column field="name" sortable>Name</helix-headless-table-column>
21972
+ * <helix-headless-table-column field="size" align="end" sortable .cell=${bytes}>Size</helix-headless-table-column>
21973
+ * </helix-headless-data-table>
21981
21974
  * ```
21982
21975
  *
21983
- * `helix-table` takes rows as markup and is the right component for a table of
21984
- * twelve things a person wrote out.
21976
+ * `Table` takes rows as markup and is the right component for a table of twelve
21977
+ * things a person wrote out.
21985
21978
  *
21986
21979
  * **Sort and filter apply to the whole set, never the page.** Sorting the drawn
21987
21980
  * window is correct on the first screen and wrong on every other one.
@@ -21990,7 +21983,7 @@ export type CustomElements = {
21990
21983
  * elements do, but reading a cell needs the columns, and the columns are markup
21991
21984
  * children Lit SSR does not hand this element. So a crawler sees a table of the
21992
21985
  * right shape with nothing in it. That is the cost of the first paragraph: use
21993
- * `helix-table` where the served HTML has to carry the values.
21986
+ * `Table` where the served HTML has to carry the values.
21994
21987
  *
21995
21988
  * **`selectable` adds a column of checkboxes, keyed on `row-key`.** A row is
21996
21989
  * selected by its identity rather than its position, so a selection survives a
@@ -22011,14 +22004,13 @@ export type CustomElements = {
22011
22004
  * in the order on screen, in the columns on screen. Saving it is the page's
22012
22005
  * business, the same as any other file.
22013
22006
  *
22014
- * **There is no `columns` attribute here, and `helix-table` has one.** The
22015
- * difference is what a column is in each: here it is the schema, so a table
22016
- * without one has nothing to read a row with, and every column is a place to
22017
- * write a `width`. A `helix-table` holds cells a consumer wrote and can be
22018
- * written with no column at all, so its `columns` is where such a table is
22019
- * sized from. Written on this element the attribute is inert, which is the trap
22020
- * worth knowing when moving between the two. What both take is the CSS hook,
22021
- * `--data-table-columns` here and `--table-columns` there.
22007
+ * **There is no `columns` attribute here, and Table has one.** The difference
22008
+ * is what a column is in each: here it is the schema, so a table without one
22009
+ * has nothing to read a row with, and every column is a place to write a
22010
+ * `width`. A Table holds cells a consumer wrote and can be written with no
22011
+ * column at all, so its `columns` is where such a table is sized from. Written
22012
+ * on this element the attribute is inert, which is the trap worth knowing when
22013
+ * moving between the two.
22022
22014
  *
22023
22015
  * ## Attributes & Properties
22024
22016
  *
@@ -22099,9 +22091,9 @@ export type CustomElements = {
22099
22091
  *
22100
22092
  * **It announces nothing, and that is not an omission.** Nothing in this
22101
22093
  * element ever asks for a different page size: a size selector is
22102
- * `helix-pagination-size`, which a consumer puts in the `footer` slot and
22103
- * answers themselves. Routing this through `requestChange` would announce an
22104
- * event the element never has cause to fire.
22094
+ * `PaginationSize`, which a consumer puts in the `footer` slot and answers
22095
+ * themselves. Routing this through `requestChange` would announce an event
22096
+ * the element never has cause to fire.
22105
22097
  * - `total`: How many rows the whole result has, where this element cannot count them.
22106
22098
  *
22107
22099
  * Only read in `server` mode, where `rows` is one page and its length says
@@ -22188,7 +22180,7 @@ export type CustomElements = {
22188
22180
  *
22189
22181
  * Areas where markup can be added to the component.
22190
22182
  *
22191
- * - `(default)`: The columns, declared as `helix-table-column` children.
22183
+ * - `(default)`: The columns, declared rather than drawn.
22192
22184
  * - `footer`: Below the grid, replacing the pagination this would otherwise draw.
22193
22185
  * - `toolbar`: Above the grid, for a search field or actions.
22194
22186
  *
@@ -22224,8 +22216,8 @@ export type CustomElements = {
22224
22216
  *
22225
22217
  * CSS variables available for styling the component.
22226
22218
  *
22227
- * - `--data-table-cell-align`: The edge the column a cell sits under is set to, `start`, `center` or `end`, and unset under a column that sets none. Written by the component onto each cell it draws, read by the sheet that paints one; `helix-table` publishes `--table-cell-align` for the same attribute on the cells a consumer wrote, under its own family's name. (default: `undefined`)
22228
- * - `--data-table-template`: The column track list this element worked out from the columns declared in it. Written by the component, read by the sheet that paints: a stylesheet takes it to lay the grid out, and setting it does nothing, because the component writes it inline on the very element that reads it and an inline declaration beats any sheet. `--data-table-columns` is the one to set. (default: `undefined`)
22219
+ * - `--data-table-cell-align`: The edge the column a cell sits under is set to, `start`, `center` or `end`, and unset under a column that sets none. Written by the component onto each cell it draws, read by the sheet that paints one; Table publishes `--table-cell-align` for the same attribute on the cells a consumer wrote, under its own family's name. (default: `undefined`)
22220
+ * - `--data-table-template`: The column track list this element worked out from the columns declared in it. Written by the component, read by the sheet that paints: a stylesheet takes it to lay the grid out, and setting it does nothing, because the component writes it inline on the very element that reads it and an inline declaration beats any sheet. A column's `width` is the one to set. (default: `undefined`)
22229
22221
  *
22230
22222
  * ## CSS Parts
22231
22223
  *
@@ -22280,9 +22272,9 @@ export type CustomElements = {
22280
22272
  >;
22281
22273
 
22282
22274
  /**
22283
- * **The calendar is `helix-date-picker`, not a second one written here.** It
22284
- * already knows about months, ranges, disabled days, the first day of the week
22285
- * and every keyboard rule a grid owes a reader. This element is the field, the
22275
+ * **The calendar is `DatePicker`, not a second one written here.** It already
22276
+ * knows about months, ranges, disabled days, the first day of the week and
22277
+ * every keyboard rule a grid owes a reader. This element is the field, the
22286
22278
  * overlay, and the translation between them.
22287
22279
  *
22288
22280
  * **Typed as well as picked, and the typing is why it is not
@@ -23386,8 +23378,8 @@ export type CustomElements = {
23386
23378
  * Opened declaratively with the platform's invoker attributes:
23387
23379
  *
23388
23380
  * ```html
23389
- * <helix-button commandfor="nav" command="--toggle">Menu</helix-button>
23390
- * <helix-drawer id="nav">…</helix-drawer>
23381
+ * <helix-headless-button commandfor="nav" command="--toggle">Menu</helix-headless-button>
23382
+ * <helix-headless-drawer id="nav">…</helix-headless-drawer>
23391
23383
  * ```
23392
23384
  *
23393
23385
  * ## Attributes & Properties
@@ -23418,10 +23410,10 @@ export type CustomElements = {
23418
23410
  * not, rather than shown or hidden by CSS.
23419
23411
  * - `placement`: Which edge the drawer comes from.
23420
23412
  *
23421
- * Unset is `end`, which the styled tier reads as `:host(:not([placement]))`
23422
- * beside `:host([placement="end"])` rather than as a value written here: a
23413
+ * Unset is `end`, and it stays unset rather than being written down: a
23423
23414
  * default assigned to the property would reflect onto every host and put a
23424
- * `placement="end"` into markup no consumer wrote.
23415
+ * `placement="end"` into markup no consumer wrote. So what this tier
23416
+ * guarantees is the absence, and a sheet selects on it.
23425
23417
  * - `open`: Whether the element is open.
23426
23418
  *
23427
23419
  * One property, not two, so `dialog.open` answers the question anyone
@@ -24304,7 +24296,13 @@ export type CustomElements = {
24304
24296
  * - `fields`: The fields declared inside this, in the order they were written.
24305
24297
  *
24306
24298
  * What a render may know of them: none on a server, whose shim has no tree
24307
- * and threw here, and none while hydrating what one sent. (property only) (readonly)
24299
+ * and threw here, and none while hydrating what one sent.
24300
+ *
24301
+ * By identity rather than by tag. A list of names can only hold the tags this
24302
+ * package knows about, so it misses any third one, which is what subclassing
24303
+ * a headless element produces, and it is also how a headless package learns a
24304
+ * styled tag. `instanceof` answers for every one of them and proves the type
24305
+ * the signature claims. (property only) (readonly)
24308
24306
  * - `whenSettled`: Resolves a frame after the first update, when transitions are switched on.
24309
24307
  *
24310
24308
  * **Named `whenSettled` because `settled` is taken four times over**, by
@@ -24541,12 +24539,12 @@ export type CustomElements = {
24541
24539
  * `FilterField` already plays on its own children.
24542
24540
  *
24543
24541
  * **It can suggest what to type next, and deciding what to suggest is still the
24544
- * consumer's.** Slot `helix-option` elements into `suggestions` and the field
24545
- * shows them, moves through them with the arrows, and lets Enter press one; the
24546
- * option fires its own `helix-select` and the consumer decides what choosing
24547
- * meant. Keys before a colon and values after it are the same panel with
24548
- * different contents, and `readFilterText` is exported for a consumer narrowing
24549
- * that panel against what a reader has half typed.
24542
+ * consumer's.** Slot options into `suggestions` and the field shows them, moves
24543
+ * through them with the arrows, and lets Enter press one; the option fires its
24544
+ * own `helix-select` and the consumer decides what choosing meant. Keys before
24545
+ * a colon and values after it are the same panel with different contents, and
24546
+ * `readFilterText` is exported for a consumer narrowing that panel against what
24547
+ * a reader has half typed.
24550
24548
  *
24551
24549
  * **The panel opens when there is something in it and closes when there is
24552
24550
  * not**, rather than on a choice. A reader who picks a key wants its values
@@ -24844,11 +24842,12 @@ export type CustomElements = {
24844
24842
  * would give.
24845
24843
  *
24846
24844
  * **The element's own text is read as a fallback, and only in a browser.**
24847
- * `<helix-format-date elapsed>2026-08-27T01:00:00Z</helix-format-date>` is the
24848
- * spelling that reads best in markup, and it cannot be the only one: measured
24849
- * against Lit's server shim, `textContent`, `children`, `firstChild` and
24850
- * `querySelector` are all `undefined` there, so a server has no way to see it.
24851
- * An element rendered on a server needs the attribute; one rendered in a
24845
+ * `<helix-headless-format-date
24846
+ * elapsed>2026-08-27T01:00:00Z</helix-headless-format-date>` is the spelling
24847
+ * that reads best in markup, and it cannot be the only one: measured against
24848
+ * Lit's server shim, `textContent`, `children`, `firstChild` and
24849
+ * `querySelector` are all `undefined` there, so a server has no way to see
24850
+ * it. An element rendered on a server needs the attribute; one rendered in a
24852
24851
  * browser may use either.
24853
24852
  * - `day`: How the day of the month is written, where a date is shown.
24854
24853
  * - `elapsed`: Show how long ago it was, compactly, instead of the date.
@@ -24948,12 +24947,12 @@ export type CustomElements = {
24948
24947
  * consumer has to keep by hand, and the one number a summary is told to trust
24949
24948
  * is the one it gets wrong.
24950
24949
  *
24951
- * The strip measures itself, so `--heatmap-cell-inline-size` and `--heatmap-gap` are
24952
- * enough on their own and these two are the estimate used until the first
24953
- * measurement lands. Writing the attribute pins the value and stops the
24954
- * measurement being consulted, which is what a container query or a transition
24955
- * on the cell size wants, where what is drawn this frame is not what the
24956
- * arithmetic should plan around.
24950
+ * The strip measures itself, so sizing the cells in a sheet is enough on its
24951
+ * own and these two are the estimate used until the first measurement lands.
24952
+ * Writing the attribute pins the value and stops the measurement being
24953
+ * consulted, which is what a container query or a transition on the cell size
24954
+ * wants, where what is drawn this frame is not what the arithmetic should
24955
+ * plan around.
24957
24956
  *
24958
24957
  * Zero turns the dropping off altogether, which is right for a strip in a
24959
24958
  * container that cannot get narrow.
@@ -25097,11 +25096,6 @@ export type CustomElements = {
25097
25096
  *
25098
25097
  * CSS variables available for styling the component.
25099
25098
  *
25100
- * - `--heatmap-cell-height`: How tall a cell is. A row of a tall thin cell is what a status page draws. (default: `undefined`)
25101
- * - `--heatmap-cell-inline-size`: How wide a cell is. The strip fits as many as the container allows. (default: `undefined`)
25102
- * - `--heatmap-cell-radius`: How far a cell's corners are rounded. (default: `undefined`)
25103
- * - `--heatmap-cell-size`: The size a cell wants on both axes, where neither is given its own. (default: `undefined`)
25104
- * - `--heatmap-gap`: Space between cells. Zero is a continuous field rather than a grid of tiles. (default: `undefined`)
25105
25099
  * - `--heatmap-rows`: How many rows the strip lays out. Written by the component from the data, read by the tier that draws it. (default: `undefined`)
25106
25100
  * - `--heatmap-tone`: The tone of the cell this is set on. Written by the component, read by the sheet that paints. (default: `undefined`)
25107
25101
  * - `--heatmap-tone-1`: The quietest step of the magnitude ramp, reached by `tones="1 …"`. (default: `undefined`)
@@ -25185,7 +25179,7 @@ export type CustomElements = {
25185
25179
  * the same way `label` becomes `aria-label` in there.
25186
25180
  *
25187
25181
  * ```html
25188
- * <helix-button commandfor="confirm" command="--show">Delete…</helix-button>
25182
+ * <helix-headless-button commandfor="confirm" command="--show">Delete…</helix-headless-button>
25189
25183
  * ```
25190
25184
  *
25191
25185
  * `commandFor` spells its attribute out, because Lit lowercases a property
@@ -25502,10 +25496,10 @@ export type CustomElements = {
25502
25496
  * **Mirrored to `data-status`, and not reflected as `status`.** It is element
25503
25497
  * state, so reflecting it puts the element's own bookkeeping into the markup
25504
25498
  * a consumer rendered: React reads the attribute appearing at upgrade as a
25505
- * hydration mismatch, and a serialized `<helix-image status="loaded">` pasted
25506
- * back declares that a picture has arrived which this element has never
25507
- * fetched. The `data-` name is the library's answer to both, being a name a
25508
- * re-parse cannot mistake for a declaration, and it is what `data-closed` on
25499
+ * hydration mismatch, and a host pasted back carrying `status="loaded"`
25500
+ * declares that a picture has arrived which this element has never fetched.
25501
+ * The `data-` name is the library's answer to both, being a name a re-parse
25502
+ * cannot mistake for a declaration, and it is what `data-closed` on
25509
25503
  * `Toast.Item` already does. A picture arrives after somebody fetched it,
25510
25504
  * which puts this on the safe side of hydration: a fact that can be true on
25511
25505
  * the *first* update mirrors to a custom state instead, which is what
@@ -25618,10 +25612,10 @@ export type CustomElements = {
25618
25612
  * **The attribute is `readonly`, which is the platform's spelling.** A
25619
25613
  * camelCase property needs an explicit `attribute`, and dash-casing a word
25620
25614
  * HTML writes as one costs what an attribute always costs here: nothing
25621
- * warns. `<helix-input readonly>` is what anybody who has written HTML types;
25622
- * against `read-only` it parses to no property at all, and the field stays
25623
- * editable with no error anywhere. Measured on the dash-cased form, `readOnly`
25624
- * came back `false`.
25615
+ * warns. `<helix-headless-input readonly>` is what anybody who has written
25616
+ * HTML types; against `read-only` it parses to no property at all, and the
25617
+ * field stays editable with no error anywhere. Measured on the dash-cased
25618
+ * form, `readOnly` came back `false`.
25625
25619
  * - `reveal`: Whether a password field offers a toggle that shows what was typed.
25626
25620
  *
25627
25621
  * Ignored on every other type. A reveal on an email field would be a button
@@ -25635,9 +25629,9 @@ export type CustomElements = {
25635
25629
  *
25636
25630
  * **Not reflected.** Reflection exists so a selector can reach a value, and
25637
25631
  * no stylesheet in this repository selects on `type`. Reflecting it writes
25638
- * `type="text"` onto every `<helix-input>` ever rendered, an attribute no
25639
- * consumer's markup has, which is the fault the area rules write up under
25640
- * `Button`'s `href`, `target` and `rel`.
25632
+ * `type="text"` onto every `<helix-headless-input>` ever rendered, an
25633
+ * attribute no consumer's markup has, which is the fault the area rules write
25634
+ * up under `Button`'s `href`, `target` and `rel`.
25641
25635
  *
25642
25636
  * Nothing reads it from the attribute either. The real `<input>` inside takes
25643
25637
  * it as a property binding, which is what makes the keyboard and the
@@ -26083,8 +26077,7 @@ export type CustomElements = {
26083
26077
  * over something busy. `triangle` points along the axis and reads as "and
26084
26078
  * onward" rather than as a second claim about the data.
26085
26079
  *
26086
- * The shapes come from
26087
- * `helix/styled/src/shared/chart/terminus.css`, the same sheet `Sparkline` takes, so
26080
+ * The shapes come from one shared sheet, the same one `Sparkline` takes, so
26088
26081
  * the set is identical wherever one appears. **Which is why every value is
26089
26082
  * named here.** `Sparkline` shipped `square` implemented, drawn, asserted and
26090
26083
  * undocumented until the cohort before this one; this family reads the same
@@ -26349,10 +26342,10 @@ export type CustomElements = {
26349
26342
  * - `label`: Accessible name for the set.
26350
26343
  * - `type`: Which markers an ordered list draws, in `<ol type>`'s own five values.
26351
26344
  *
26352
- * Reflected, because this is one of the things a stylesheet selects on and
26353
- * the styled tier maps each to a `list-style-type`. The platform's spellings
26354
- * rather than the CSS ones, so `<helix-list kind="ordered" type="i">` is what
26355
- * a consumer would have written on an `<ol>`.
26345
+ * Reflected, because this is one of the things a stylesheet selects on, each
26346
+ * value mapping to a `list-style-type`. The platform's spellings rather than
26347
+ * the CSS ones, so `<helix-headless-list kind="ordered" type="i">` is what a
26348
+ * consumer would have written on an `<ol>`.
26356
26349
  *
26357
26350
  * **`start` and `reversed` are both absent and neither can be done here.**
26358
26351
  * This renders no `<ol>`: the rows are slotted and numbered by the CSS
@@ -27511,9 +27504,9 @@ export type CustomElements = {
27511
27504
  >;
27512
27505
 
27513
27506
  /**
27514
- * A notification is a toast that did not go away. `helix-toast` is deliberately
27515
- * the opposite of this: a live region whose items carry a `duration` and whose
27516
- * root never creates or destroys anything. What makes this its own family is the
27507
+ * A notification is a toast that did not go away. `Toast` is deliberately the
27508
+ * opposite of this: a live region whose items carry a `duration` and whose root
27509
+ * never creates or destroys anything. What makes this its own family is the
27517
27510
  * state each item carries rather than the arrangement it sits in: read and
27518
27511
  * unread, a timestamp that has to stay correct, and an action a reader can take
27519
27512
  * later.
@@ -27525,9 +27518,9 @@ export type CustomElements = {
27525
27518
  * reader wants exactly one of them at a time: the time while they are scanning,
27526
27519
  * and what they can do about it once they have stopped on a row.
27527
27520
  *
27528
- * **The timestamp is `helix-format-date`**, which is where the reading, the
27529
- * `<time datetime>` and the shared timer now live. It was implemented here, and
27530
- * a component that formats a date is not a fact about notifications: Chat wanted
27521
+ * **The timestamp is `FormatDate`**, which is where the reading, the `<time
27522
+ * datetime>` and the shared timer now live. It was implemented here, and a
27523
+ * component that formats a date is not a fact about notifications: Chat wanted
27531
27524
  * the same thing and had its own copy of half of it.
27532
27525
  *
27533
27526
  * **Read state is reported, not invented.** Marking something read is usually a
@@ -27553,10 +27546,10 @@ export type CustomElements = {
27553
27546
  *
27554
27547
  * **Not reflected.** Unread is a visual state, which is why the four mixins
27555
27548
  * mirror theirs, but the mirror may not be the property's own attribute:
27556
- * `<helix-notification default-read>` comes back from a server without `read`
27557
- * and would gain it on the first update, which React reports as a hydration
27558
- * mismatch, and which a copy of the serialized element re-parses as a
27559
- * declaration. `:state(read)` is what the stylesheet reads.
27549
+ * `<helix-headless-notification default-read>` comes back from a server
27550
+ * without `read` and would gain it on the first update, which React reports
27551
+ * as a hydration mismatch, and which a copy of the serialized element
27552
+ * re-parses as a declaration. `:state(read)` is what the stylesheet reads.
27560
27553
  * `hydration.dom.spec.ts` holds it.
27561
27554
  * - `default-read`/`defaultRead`: State to open with, where nothing declared one.
27562
27555
  * - `locale`: Locale for the timestamp.
@@ -27748,7 +27741,7 @@ export type CustomElements = {
27748
27741
  *
27749
27742
  * Areas where markup can be added to the component.
27750
27743
  *
27751
- * - `(default)`: The notifications, as `helix-notification` children.
27744
+ * - `(default)`: The notifications.
27752
27745
  * - `footer`: Below the list, for a link to everything.
27753
27746
  * - `header`: Above the list, for a title and the mark-all control.
27754
27747
  *
@@ -28338,7 +28331,7 @@ export type CustomElements = {
28338
28331
  * **The attribute, read when it is asked for, and never a snapshot taken in
28339
28332
  * the constructor.** A field initializer runs there, and an element the HTML
28340
28333
  * parser created has none of its attributes yet at that moment: measured on
28341
- * this element, on `Radio` and on `Toggle`, `<helix-option value="a"
28334
+ * this element, on `Radio` and on `Toggle`, `<helix-headless-option value="a"
28342
28335
  * selected>` reported `defaultSelected` as `false` both from parsed markup
28343
28336
  * and from `createElement` followed by `setAttribute`, which is every way a
28344
28337
  * consumer writes one. The snapshot could only ever be true for an element
@@ -28556,8 +28549,8 @@ export type CustomElements = {
28556
28549
  /**
28557
28550
  * **The component is the truncation.** Given a page and a total it works out
28558
28551
  * which numbers to show and where the runs break, so this is data-driven rather
28559
- * than composed: `<helix-pagination page="4" pages="12">` rather than twelve
28560
- * slotted children a consumer keeps in step with their own query.
28552
+ * than composed: `<helix-headless-pagination page="4" pages="12">` rather than
28553
+ * twelve slotted children a consumer keeps in step with their own query.
28561
28554
  *
28562
28555
  * **The width does not change as you page.** The run around the current page is
28563
28556
  * `siblings` either side, and grows to absorb a gap slot at a boundary, so the
@@ -28995,10 +28988,10 @@ export type CustomElements = {
28995
28988
  * marked letters wants `text`, which judges nothing.
28996
28989
  *
28997
28990
  * **Not reflected**: nothing selects on it, so reflecting only writes
28998
- * `type="numeric"` onto every `<helix-pin-input>` ever rendered, an attribute
28999
- * no consumer's markup had. The area rules carry the sentence "reflect only
29000
- * what CSS selects on". The real inputs take it as a binding, which is what
29001
- * makes the keyboard follow.
28991
+ * `type="numeric"` onto every `<helix-headless-pin-input>` ever rendered, an
28992
+ * attribute no consumer's markup had. The area rules carry the sentence
28993
+ * "reflect only what CSS selects on". The real inputs take it as a binding,
28994
+ * which is what makes the keyboard follow.
29002
28995
  * - `default-value`/`defaultValue`: The value the markup declared, which is where a reset returns to.
29003
28996
  * - `value`: What the control holds now, and what its form submits.
29004
28997
  *
@@ -29741,7 +29734,7 @@ export type CustomElements = {
29741
29734
  * **The attribute, read when it is asked for, and never a snapshot taken in
29742
29735
  * the constructor.** A field initializer runs there, and an element the HTML
29743
29736
  * parser created has none of its attributes yet at that moment: measured on
29744
- * this element, on `Option` and on `Toggle`, `<helix-radio value="a"
29737
+ * this element, on `Option` and on `Toggle`, `<helix-headless-radio value="a"
29745
29738
  * selected>` reported `defaultSelected` as `false` both from parsed markup
29746
29739
  * and from `createElement` followed by `setAttribute`, which is every way a
29747
29740
  * consumer writes one. The snapshot could only ever be true for an element
@@ -31190,11 +31183,10 @@ export type CustomElements = {
31190
31183
  * mean defining what a dial with a submenu in it does.
31191
31184
  *
31192
31185
  * **The trigger is a control the consumer slots**, and the floating action
31193
- * button is the usual one: `helix-icon-button` with `shape="circle"` and
31194
- * `raised`. There is no `helix-fab`, because it would re-declare `emphasis`,
31195
- * `tone`, `label` and a size around a control that already has all four. A
31196
- * round raised button is a shape, and where it sits is `data-dock` in the base
31197
- * layer.
31186
+ * button is the usual one: `IconButton` with `shape="circle"` and `raised`.
31187
+ * There is no `helix-fab`, because it would re-declare `emphasis`, `tone`,
31188
+ * `label` and a size around a control that already has all four. A round raised
31189
+ * button is a shape, and where it sits is `data-dock` in the base layer.
31198
31190
  *
31199
31191
  * **Nothing is reserved from the keyboard.** A menu that drills has to keep the
31200
31192
  * horizontal pair for going in and coming back; a dial goes nowhere, so all four
@@ -31553,9 +31545,9 @@ export type CustomElements = {
31553
31545
  * The row directions set them side by side, for a figure in a line of text or
31554
31546
  * a narrow strip where a stacked pair would be two lines of almost nothing.
31555
31547
  *
31556
- * A property rather than a `helix-flex` around it, because the unit has to
31557
- * stay on the value's baseline whichever way the pair goes, and only this
31558
- * element knows which of its children the unit belongs to.
31548
+ * A property rather than a `Flex` around it, because the unit has to stay on
31549
+ * the value's baseline whichever way the pair goes, and only this element
31550
+ * knows which of its children the unit belongs to.
31559
31551
  *
31560
31552
  * **Optional rather than defaulted to `column`, which is not a style
31561
31553
  * preference.** A reflecting property with a default writes its attribute onto
@@ -31688,7 +31680,7 @@ export type CustomElements = {
31688
31680
  *
31689
31681
  * Areas where markup can be added to the component.
31690
31682
  *
31691
- * - `(default)`: The steps, which are `helix-step` elements.
31683
+ * - `(default)`: The steps.
31692
31684
  *
31693
31685
  * ## Methods
31694
31686
  *
@@ -31715,9 +31707,9 @@ export type CustomElements = {
31715
31707
 
31716
31708
  /**
31717
31709
  * **The name is a button, and only the name.** The marker is `aria-hidden`
31718
- * decoration, so wrapping it would add hit area and no meaning. It is
31719
- * `helix-button` rather than a `<button>` this element resets: the hover wash,
31720
- * the focus ring and the disabled treatment are decisions the button carries.
31710
+ * decoration, so wrapping it would add hit area and no meaning. It is `Button`
31711
+ * rather than a `<button>` this element resets: the hover wash, the focus ring
31712
+ * and the disabled treatment are decisions the button carries.
31721
31713
  *
31722
31714
  * **It says nothing about where a reader may go.** Every step is pressable and
31723
31715
  * announces itself with `helix-select`; refusing the ones ahead is `disabled`,
@@ -31770,7 +31762,7 @@ export type CustomElements = {
31770
31762
  * Areas where markup can be added to the component.
31771
31763
  *
31772
31764
  * - `(default)`: The step's name.
31773
- * - `content`: What the stage holds. Always rendered here, a tier with no stylesheet having nothing to fold it with; the styled tier opens it on the current step down a column, and a row has no space under a step to open it into.
31765
+ * - `content`: What the stage holds. Always rendered here, a tier with no stylesheet having nothing to fold it with, so whether it is folded away is the sheet's answer and not this tier's.
31774
31766
  * - `description`: A line under the name, for what the stage is for.
31775
31767
  * - `marker`: Replaces the number, or the check a complete step shows.
31776
31768
  *
@@ -31787,7 +31779,7 @@ export type CustomElements = {
31787
31779
  * - `body`: The name and its description.
31788
31780
  * - `content`: What the stage holds, while it is open.
31789
31781
  * - `description`: The line under it.
31790
- * - `label`: The step's name, which is a `helix-button`.
31782
+ * - `label`: The step's name, which is a control.
31791
31783
  * - `label-button`: The inner control.
31792
31784
  * - `lead`: The half line arriving from the step before.
31793
31785
  * - `mark`: The glyph inside the marker: a tick, a dot, or an empty ring.
@@ -32047,23 +32039,23 @@ export type CustomElements = {
32047
32039
  * the table has another track; remove one and it does not. That is what ties
32048
32040
  * the two together, and a table-level track list on its own does not: a list
32049
32041
  * that is accidentally the headings is invalid CSS a grid ignores in silence,
32050
- * drawing the whole table as one column. `helix-table`'s `columns` is dealt out
32051
- * a track at a time against the columns declared under it, so a heading among
32052
- * the widths costs its own column a width and no more, and a list longer or
32053
- * shorter than the columns is trimmed or shared rather than being a second
32054
- * count of them. A column's own `width` wins over the track in its place.
32042
+ * drawing the whole table as one column. `Table`'s `columns` is dealt out a
32043
+ * track at a time against the columns declared under it, so a heading among the
32044
+ * widths costs its own column a width and no more, and a list longer or shorter
32045
+ * than the columns is trimmed or shared rather than being a second count of
32046
+ * them. A column's own `width` wins over the track in its place.
32055
32047
  *
32056
32048
  * **It is also where every per-column fact goes**, which is the reason
32057
- * `helix-data-table` needs no column config object. `field` names the key the
32058
- * cell reads, `sortable` says a reader may reorder by it, `align` says which
32059
- * edge the values line up against, and `cell` takes a function for anything the
32049
+ * `DataTable` needs no column config object. `field` names the key the cell
32050
+ * reads, `sortable` says a reader may reorder by it, `align` says which edge
32051
+ * the values line up against, and `cell` takes a function for anything the
32060
32052
  * field alone cannot express. The schema is markup and the data is a property:
32061
32053
  * a schema is small, declarative, and something a reader should be able to see
32062
32054
  * in the HTML, and data is large and windowed.
32063
32055
  *
32064
32056
  * **The same element serves both tables**, the markup one and the data one. It
32065
- * is identified by a flag rather than by `instanceof`, so a `helix-table-column`
32066
- * works inside either without the two roots sharing anything else.
32057
+ * is identified by a flag rather than by `instanceof`, so a `TableColumn` works
32058
+ * inside either without the two roots sharing anything else.
32067
32059
  *
32068
32060
  * **It generates no box of its own**, the same as a row: the heading is a grid
32069
32061
  * item of the table, so it lines up with the cells under it rather than sitting
@@ -32073,10 +32065,10 @@ export type CustomElements = {
32073
32065
  * both, so the columns after it keep their own widths and every row keeps its
32074
32066
  * cells under their headings. `hidden="until-found"` keeps its track, the
32075
32067
  * heading being left drawn, as every Helix element leaves one with that value.
32076
- * `helix-data-table` draws the cells, so it leaves out the ones under a hidden
32077
- * column. A `helix-table`'s cells are markup the consumer wrote, so hide them
32078
- * with the column, as removing a column means removing its cells: a row with a
32079
- * cell more than the table has tracks wraps into the next.
32068
+ * `DataTable` draws the cells, so it leaves out the ones under a hidden column.
32069
+ * A `Table`'s cells are markup the consumer wrote, so hide them with the
32070
+ * column, as removing a column means removing its cells: a row with a cell more
32071
+ * than the table has tracks wraps into the next.
32080
32072
  *
32081
32073
  * **A heading that does something holds a control that does it.** The host is
32082
32074
  * the column header, and a header is not focusable, so a sortable heading is a
@@ -32092,15 +32084,15 @@ export type CustomElements = {
32092
32084
  *
32093
32085
  * - `align`: Which edge the values line up against.
32094
32086
  *
32095
- * `end` is what a column of numbers wants, so digits of the same magnitude sit
32096
- * above each other. Left unset the cell inherits the table's own alignment,
32097
- * which is `start` for text in either writing direction. `helix-data-table`
32098
- * aligns the cells it draws. A `helix-table`'s cells are markup the consumer
32099
- * wrote, so the table writes nothing onto them: it publishes the edge to each
32100
- * cell under this column as `--table-cell-align`, which `@fusion.dev/helix`
32101
- * reads. The heading is this element's own, and `@fusion.dev/helix` sets it to
32102
- * the same edge in either table. `end` is the inline end, so in a
32103
- * right-to-left table it is the left.
32087
+ * `end` is what a column of numbers wants, so digits of the same magnitude
32088
+ * sit above each other. Left unset the cell inherits the table's own
32089
+ * alignment, which is `start` for text in either writing direction.
32090
+ * `DataTable` aligns the cells it draws. A `Table`'s cells are markup the
32091
+ * consumer wrote, so the table writes nothing onto them: it publishes the
32092
+ * edge to each cell under this column as `--table-cell-align`, which
32093
+ * `@fusion.dev/helix` reads. The heading is this element's own, and
32094
+ * `@fusion.dev/helix` sets it to the same edge in either table. `end` is the
32095
+ * inline end, so in a right-to-left table it is the left.
32104
32096
  *
32105
32097
  * **Reflected, because the heading is drawn by a stylesheet and has no other
32106
32098
  * way to learn it.** Set as a property, which is how React sets it, an
@@ -32143,8 +32135,8 @@ export type CustomElements = {
32143
32135
  * - `width`: The track this column takes, as CSS.
32144
32136
  *
32145
32137
  * A single track value, so anything valid in `grid-template-columns` works:
32146
- * `16rem`, `auto`, `minmax(0, 2fr)`. Left unset the column takes the track
32147
- * in its place in a `helix-table`'s `columns`, where that table sets one, and
32138
+ * `16rem`, `auto`, `minmax(0, 2fr)`. Left unset the column takes the track in
32139
+ * its place in a `Table`'s `columns`, where that table sets one, and
32148
32140
  * otherwise shares what is left over equally, as `minmax(max-content, 1fr)`.
32149
32141
  * Set here, it wins over that list, which is what lets a reader resize a
32150
32142
  * column in a table that set one.
@@ -32269,15 +32261,14 @@ export type CustomElements = {
32269
32261
  *
32270
32262
  * - `columns`: The column widths as one track list, written once on the table.
32271
32263
  *
32272
- * With `helix-table-column` children, each track sizes the column in its
32273
- * place, a hidden column counted, so hiding one takes its track with it and
32274
- * the rest keep theirs. The columns decide how many tracks there are and this
32275
- * list only how wide: a track past the last column is dropped, and a column
32276
- * past the last track shares what is left. With no columns declared it is
32277
- * the whole track list. Tracks count as the grid counts them, so
32278
- * `minmax(0, 1fr)` is one and `repeat(2, 8rem)` is two, and one the grid
32279
- * would refuse leaves its column at the default rather than taking the table
32280
- * down to one column.
32264
+ * With `TableColumn` children, each track sizes the column in its place, a
32265
+ * hidden column counted, so hiding one takes its track with it and the rest
32266
+ * keep theirs. The columns decide how many tracks there are and this list
32267
+ * only how wide: a track past the last column is dropped, and a column past
32268
+ * the last track shares what is left. With no columns declared it is the
32269
+ * whole track list. Tracks count as the grid counts them, so `minmax(0, 1fr)`
32270
+ * is one and `repeat(2, 8rem)` is two, and one the grid would refuse leaves
32271
+ * its column at the default rather than taking the table down to one column.
32281
32272
  *
32282
32273
  * **A column's own `width` wins over its track here.** The width is written
32283
32274
  * on the column it sizes, which is the more particular statement, and it is
@@ -32291,13 +32282,11 @@ export type CustomElements = {
32291
32282
  * whole answer: a table given one lays its grid out in the first paint, and a
32292
32283
  * table sized only by its columns is one track wide until it upgrades.
32293
32284
  *
32294
- * **`helix-data-table` has none of this, and should not.** Its columns are
32295
- * its schema rather than an option, so there is always a column to write a
32296
- * `width` on and a list here would be a second way to say what that says.
32297
- * This table's cells are markup, and a table written as rows of cells with no
32298
- * `helix-table-column` in it has nowhere else to be sized from. Both families
32299
- * take the same CSS hook, `--table-columns` and `--data-table-columns`, which
32300
- * wins over whichever list the element worked out.
32285
+ * **Data Table has none of this, and should not.** Its columns are its schema
32286
+ * rather than an option, so there is always a column to write a `width` on
32287
+ * and a list here would be a second way to say what that says. This table's
32288
+ * cells are markup, and a table written as rows of cells with no column
32289
+ * declared in it has nowhere else to be sized from.
32301
32290
  * - `label`: Accessible name for the table.
32302
32291
  * - `empty-text`/`emptyText`: What is said where there are none, and none are coming.
32303
32292
  * - `loading`: Whether the rows are still on their way.
@@ -32338,7 +32327,7 @@ export type CustomElements = {
32338
32327
  *
32339
32328
  * CSS variables available for styling the component.
32340
32329
  *
32341
- * - `--table-template`: The column track list this element worked out from the columns declared in it. Written by the component, read by the sheet that paints: a stylesheet takes it to lay the grid out, and setting it does nothing, because the component writes it inline on the very element that reads it and an inline declaration beats any sheet. `--table-columns` is the one to set. (default: `undefined`)
32330
+ * - `--table-template`: The column track list this element worked out from the columns declared in it. Written by the component, read by the sheet that paints: a stylesheet takes it to lay the grid out, and setting it does nothing, because the component writes it inline on the very element that reads it and an inline declaration beats any sheet. `columns` is the one to set. (default: `undefined`)
32342
32331
  *
32343
32332
  * ## CSS Parts
32344
32333
  *
@@ -32360,10 +32349,10 @@ export type CustomElements = {
32360
32349
  >;
32361
32350
 
32362
32351
  /**
32363
- * `display: contents` in the styled tier, so the row's cells become items of
32364
- * the table's own grid and every column lines up across every row. The row
32365
- * still exists as an element, which is what a `<table>` gives away when its
32366
- * cells are laid out by the table algorithm.
32352
+ * The row renders its cells straight through and lays out none of them, so a
32353
+ * sheet can take them into the table's own grid and every column lines up
32354
+ * across every row. The row still exists as an element, which is what a
32355
+ * `<table>` gives away when its cells are laid out by the table algorithm.
32367
32356
  *
32368
32357
  * ## Attributes & Properties
32369
32358
  *
@@ -32964,10 +32953,10 @@ export type CustomElements = {
32964
32953
  >;
32965
32954
 
32966
32955
  /**
32967
- * **The list is `helix-time-picker`, not a second one written here.** It is worth
32956
+ * **The list is `TimePicker`, not a second one written here.** It is worth
32968
32957
  * having on its own, flat in a settings pane with nothing to open, and this
32969
32958
  * element is the field, the overlay and the form. Exactly the arrangement Input
32970
- * Date has with `helix-date-picker` and Color Input with `helix-color-picker`.
32959
+ * Date has with `DatePicker` and Color Input with `ColorPicker`.
32971
32960
  *
32972
32961
  * **Typed as well as picked, and that is the division the list depends on.** A
32973
32962
  * list at a step offers the times a product actually has, and the field is how a
@@ -32998,8 +32987,8 @@ export type CustomElements = {
32998
32987
  *
32999
32988
  * Absent is one. `range` holds a start and an end, `multiple` holds any
33000
32989
  * number, and both are carried as one comma-separated value, which is what a
33001
- * form submits. `helix-time-picker` carries the longer note on the interaction and on
33002
- * why a wheel cannot do either.
32990
+ * form submits. `TimePicker` carries the longer note on the interaction and
32991
+ * on why a wheel cannot do either.
33003
32992
  * - `placeholder`: What the field says before a time is in it.
33004
32993
  * - `step`: How far apart the offered times are, in minutes.
33005
32994
  * - `time-style`/`timeStyle`: Whether the field writes the time out, or holds the value as it is.
@@ -33014,7 +33003,7 @@ export type CustomElements = {
33014
33003
  * `list` offers whole times, which is what a product with slots or opening
33015
33004
  * hours has. `wheels` splits them into an hour, a minute and a meridiem where
33016
33005
  * the locale uses one, which is the only way to reach `23:45` without
33017
- * scrolling most of a day. `helix-time-picker` carries the longer note on the trade.
33006
+ * scrolling most of a day. `TimePicker` carries the longer note on the trade.
33018
33007
  *
33019
33008
  * **Optional rather than defaulted, which is not a style preference.** A
33020
33009
  * reflecting property with a default writes its attribute onto every host the
@@ -33258,8 +33247,8 @@ export type CustomElements = {
33258
33247
 
33259
33248
  /**
33260
33249
  * **A list rather than three wheels**, and the reason is what a list already
33261
- * is. `helix-listbox` brings the keyboard, the typeahead, the scroll into view
33262
- * and the announcement of a set of options, and a time at a step is a set of
33250
+ * is. `Listbox` brings the keyboard, the typeahead, the scroll into view and
33251
+ * the announcement of a set of options, and a time at a step is a set of
33263
33252
  * options. Three little wheels for hours, minutes and a meridiem are three
33264
33253
  * controls to build, three to test, and a tab stop each for something a reader
33265
33254
  * answers once.
@@ -33320,7 +33309,7 @@ export type CustomElements = {
33320
33309
  *
33321
33310
  * Absent is one. `range` holds a start and an end with everything between
33322
33311
  * them shown as part of the answer, `multiple` holds any number, and both are
33323
- * carried as one comma-separated value: the same shape `helix-date-picker` uses,
33312
+ * carried as one comma-separated value: the same shape `DatePicker` uses,
33324
33313
  * because it is the same question asked of a different unit.
33325
33314
  *
33326
33315
  * **A range is two picks, and a third starts over.** That is the calendar's
@@ -33869,7 +33858,7 @@ export type CustomElements = {
33869
33858
  * **Optional, and bottom-end is the absence of it.** Reflecting *and*
33870
33859
  * defaulting is the pair that writes onto a host: every toast region anybody
33871
33860
  * rendered would gain a `placement="bottom-end"` nobody typed, which a React
33872
- * consumer's server markup does not have. The styled sheet carries the resting
33861
+ * consumer's server markup does not have. A sheet carries the resting
33873
33862
  * arrangement in its own `:host` rule and the selectors describe only the
33874
33863
  * departures, which is what `orientation` does.
33875
33864
  * - `whenSettled`: Resolves a frame after the first update, when transitions are switched on.
@@ -33903,7 +33892,7 @@ export type CustomElements = {
33903
33892
  *
33904
33893
  * Areas where markup can be added to the component.
33905
33894
  *
33906
- * - `(default)`: The messages, as `helix-toast-item` elements.
33895
+ * - `(default)`: The messages.
33907
33896
  *
33908
33897
  * ## CSS Parts
33909
33898
  *
@@ -34133,11 +34122,11 @@ export type CustomElements = {
34133
34122
  * **The attribute, read when it is asked for, and never a snapshot taken in
34134
34123
  * the constructor.** A field initializer runs there, and an element the HTML
34135
34124
  * parser created has none of its attributes yet at that moment: measured on
34136
- * this element, on `Option` and on `Radio`, `<helix-toggle value="light"
34137
- * selected>` reported `defaultSelected` as `false` both from parsed markup
34138
- * and from `createElement` followed by `setAttribute`, which is every way a
34139
- * consumer writes one. The snapshot could only ever be true for an element
34140
- * already in the document when `customElements.define` ran.
34125
+ * this element, on `Option` and on `Radio`, `<helix-headless-toggle
34126
+ * value="light" selected>` reported `defaultSelected` as `false` both from
34127
+ * parsed markup and from `createElement` followed by `setAttribute`, which is
34128
+ * every way a consumer writes one. The snapshot could only ever be true for
34129
+ * an element already in the document when `customElements.define` ran.
34141
34130
  *
34142
34131
  * Nothing overwrites it either, which is what makes reading it late correct
34143
34132
  * rather than merely later: `selected` does not reflect, for the reason
@@ -34293,8 +34282,8 @@ export type CustomElements = {
34293
34282
  * the ordinary way:
34294
34283
  *
34295
34284
  * ```html
34296
- * <helix-button id="save" aria-describedby="save-tip">Save</helix-button>
34297
- * <helix-tooltip id="save-tip" for="save" content="Save your work"></helix-tooltip>
34285
+ * <helix-headless-button id="save" aria-describedby="save-tip">Save</helix-headless-button>
34286
+ * <helix-headless-tooltip id="save-tip" for="save" content="Save your work"></helix-headless-tooltip>
34298
34287
  * ```
34299
34288
  *
34300
34289
  * The reference points at *this host*, not at the bubble in its shadow root:
@@ -34603,9 +34592,9 @@ export type CustomElements = {
34603
34592
  * - **When it shows.** Which is `current`, and which the root decides.
34604
34593
  *
34605
34594
  * What it does not own is the heading, the paragraph, the picture and the
34606
- * layout. Slot a `helix-card`, or a heading and a line of prose, or anything
34607
- * else. Fixed `title` and `body` parts would be a component deciding what a
34608
- * tour is allowed to say.
34595
+ * layout. Slot a `Card`, or a heading and a line of prose, or anything else.
34596
+ * Fixed `title` and `body` parts would be a component deciding what a tour is
34597
+ * allowed to say.
34609
34598
  *
34610
34599
  * **The buttons are slot fallback, so the common case costs nothing and the
34611
34600
  * uncommon one is possible.** Write nothing and get Back, Next and Skip already
@@ -35352,7 +35341,7 @@ export type CustomElements = {
35352
35341
  * Areas where markup can be added to the component.
35353
35342
  *
35354
35343
  * - `(default)`: The entries.
35355
- * - `player`: The `helix-video` they play in.
35344
+ * - `player`: The player the entries take turns in.
35356
35345
  *
35357
35346
  * ## Methods
35358
35347
  *
@@ -35906,7 +35895,7 @@ export type CustomElementsSolidJs = {
35906
35895
  * item added a second after render coordinates on its first click.
35907
35896
  *
35908
35897
  * Items are matched with `instanceof HelixHeadlessAccordionItem`, never by tag
35909
- * name. Matching `helix-accordion-item` would tie this tier to the styled one.
35898
+ * name, so this tier does not learn about the styled one.
35910
35899
  *
35911
35900
  * The keyboard listener is the controller's and is attached on connect, so
35912
35901
  * none of it runs on the server, where there is no tree to walk and no events
@@ -36404,13 +36393,13 @@ export type CustomElementsSolidJs = {
36404
36393
  * Unset shows all of them, which is what no limit means and is more useful
36405
36394
  * than refusing to render.
36406
36395
  *
36407
- * **Reflected, because the fold is a stylesheet rule and nothing else.** The
36408
- * styled tier hides past the limit with `:host([max="N"]) ::slotted(:nth-child(n + N+1))`,
36409
- * so the attribute *is* the mechanism: a `max` that reaches this property and
36410
- * never reaches the host matches no rule, and every avatar is drawn beside a
36411
- * count claiming some are hidden. Markup is the safe path and hides the fault;
36412
- * a script is the broken one, and React takes it for everyone, assigning a
36413
- * matching property rather than an attribute.
36396
+ * **Reflected, because the fold is a stylesheet rule and nothing else.** A
36397
+ * sheet hides past the limit one selector per value, as `FOLDS_UP_TO`
36398
+ * describes, so the attribute *is* the mechanism: a `max` that reaches this
36399
+ * property and never reaches the host matches no rule, and every avatar is
36400
+ * drawn beside a count claiming some are hidden. Markup is the safe path and
36401
+ * hides the fault; a script is the broken one, and React takes it for
36402
+ * everyone, assigning a matching property rather than an attribute.
36414
36403
  *
36415
36404
  * **Optional rather than defaulted, per the rule that a reflected property
36416
36405
  * takes no default**: `max = 0` would stamp `max="0"` onto every host that
@@ -36830,7 +36819,7 @@ export type CustomElementsSolidJs = {
36830
36819
  * CSS variables available for styling the component.
36831
36820
  *
36832
36821
  * - `--bar-chart-axis`: How wide an axis column is drawn, in `ch`, from the widest number on it. Written on the axis itself, and only where the categories run along the bottom: turned sideways an axis is a row and takes a line's height instead. (default: `undefined`)
36833
- * - `--bar-chart-secondary`: The color of the secondary axis when one series owns it. It resolves a `--helix-color-series-*` token, so on the headless tier alone it names something that is not there. #138. (default: `undefined`)
36822
+ * - `--bar-chart-secondary`: The color of the secondary axis, where one series owns it. Written by the component from that series' `--chart-series-*`, so it promises the series color and nothing more: whatever that hook resolves to is what the axis is drawn in. (default: `undefined`)
36834
36823
  * - `--chart-bar-wash`: The gradient a bar would take, named per bar so the styled tier can point `fill` at it. Drawn whatever the treatment and used only where `wash="gradient"` asks for it. (default: `undefined`)
36835
36824
  *
36836
36825
  * ## CSS Parts
@@ -36977,12 +36966,12 @@ export type CustomElementsSolidJs = {
36977
36966
  * - `current`: Whether this item is the page the reader is on.
36978
36967
  * - `href`: Where the crumb goes, and nothing where it is the current page.
36979
36968
  *
36980
- * **Optional and reflected, because a stylesheet does select on it.**
36981
- * `breadcrumb.css` writes `:host(:not([href])) [part="link"]` to take the
36982
- * block padding off a crumb that is not a link, so the attribute is what
36983
- * decides how tall a crumb is. Unreflected, an `href` set from script reached
36984
- * the property, rendered the anchor, and left the host looking unlinked: the
36985
- * crumb drew at 20px where a markup twin drew at 28.
36969
+ * **Optional and reflected, because a stylesheet does select on it.** A sheet
36970
+ * writes `:host(:not([href])) [part="link"]` to take the block padding off a
36971
+ * crumb that is not a link, so the attribute is what decides how tall a crumb
36972
+ * is. Unreflected, an `href` set from script reached the property, rendered
36973
+ * the anchor, and left the host looking unlinked: the crumb drew at 20px
36974
+ * where a markup twin drew at 28.
36986
36975
  *
36987
36976
  * Optional rather than defaulted, which is the general rule that a reflected
36988
36977
  * property takes no default: an `href` written onto every host would be a link
@@ -37222,7 +37211,7 @@ export type CustomElementsSolidJs = {
37222
37211
  * the same way `label` becomes `aria-label` in there.
37223
37212
  *
37224
37213
  * ```html
37225
- * <helix-button commandfor="confirm" command="--show">Delete…</helix-button>
37214
+ * <helix-headless-button commandfor="confirm" command="--show">Delete…</helix-headless-button>
37226
37215
  * ```
37227
37216
  *
37228
37217
  * `commandFor` spells its attribute out, because Lit lowercases a property
@@ -37504,7 +37493,7 @@ export type CustomElementsSolidJs = {
37504
37493
  *
37505
37494
  * The host is the surface. A wrapper `<div part="container">` would be a second
37506
37495
  * box doing nothing the host cannot: the element itself takes the border, the
37507
- * radius, and the grid, and a consumer styles `helix-card` rather than reaching
37496
+ * radius, and the grid, and a consumer styles `Card` rather than reaching
37508
37497
  * through `::part`. One node instead of two, on every card on the page.
37509
37498
  *
37510
37499
  * Name the card with `aria-label` or `aria-labelledby`. That is the only
@@ -37656,13 +37645,13 @@ export type CustomElementsSolidJs = {
37656
37645
  * **The number is published to the styles rather than enumerated by them**,
37657
37646
  * as `--carousel-per-view` on the track, which is what keeps a width and a
37658
37647
  * count from disagreeing. A sheet can only name a value it wrote a rule for,
37659
- * so the styled tier enumerated `per-view="2"` through `5` and called five a
37660
- * judgment; above it the pane fell back to one across while this file went on
37661
- * counting positions. Measured in Chromium over eight slides, six across gave
37662
- * three dots, a pane taking the whole track and five slides reachable only by
37663
- * dragging. Written from here there is no ceiling to exceed, and a consumer's
37664
- * own sheet reads the same declaration the styled one does. `runEnd` publishes
37665
- * its correction the same way and for the same reason.
37648
+ * so a sheet enumerating `per-view="2"` through `5` is a ceiling of five, and
37649
+ * above it the pane falls back to one across while this file goes on counting
37650
+ * positions. Measured in Chromium over eight slides against such a sheet, six
37651
+ * across gave three dots, a pane taking the whole track and five slides
37652
+ * reachable only by dragging. Published from here there is no ceiling to
37653
+ * exceed, and every sheet reads the same declaration. `runEnd` publishes its
37654
+ * correction the same way and for the same reason.
37666
37655
  *
37667
37656
  * **On the track and not on the host.** A custom property on the host is a
37668
37657
  * reflected attribute by another name: it would arrive on upgrade, and a
@@ -37687,8 +37676,8 @@ export type CustomElementsSolidJs = {
37687
37676
  * `auto` track is handed nothing. A count stays for the design that calls for
37688
37677
  * exactly three.
37689
37678
  *
37690
- * The styled sheet says how it divides, and the headless `auto` example
37691
- * carries the same three lines for a consumer writing their own.
37679
+ * A sheet says how it divides, and the `auto` example here carries the same
37680
+ * three lines for a consumer writing their own.
37692
37681
  *
37693
37682
  * **A value rather than the resting behavior**, which is what the
37694
37683
  * responsiveness policy asks of every axis that a box decides: a splitter
@@ -38067,13 +38056,13 @@ export type CustomElementsSolidJs = {
38067
38056
  *
38068
38057
  * **Not reflected, and the default is why.** A reflected property that
38069
38058
  * defaults to true writes its attribute on upgrade whether or not the
38070
- * consumer wrote one, so the server serves `<helix-chat label="x">` and the
38071
- * client turns it into `<helix-chat label="x" pinned>`: a hydration mismatch a
38072
- * React consumer reports and does not patch up. Nothing needs the attribute
38073
- * either, because the one thing that changes with the pin is the way back, and
38074
- * that is a part inside the shadow tree where a stylesheet can already reach
38075
- * it. Measured rather than assumed: `label, pinned` after upgrade against
38076
- * `label` from the server.
38059
+ * consumer wrote one, so the server serves `<helix-headless-chat label="x">`
38060
+ * and the client turns it into `<helix-headless-chat label="x" pinned>`: a
38061
+ * hydration mismatch a React consumer reports and does not patch up. Nothing
38062
+ * needs the attribute either, because the one thing that changes with the pin
38063
+ * is the way back, and that is a part inside the shadow tree where a
38064
+ * stylesheet can already reach it. Measured rather than assumed: `label,
38065
+ * pinned` after upgrade against `label` from the server.
38077
38066
  * - `threshold`: How near the bottom still counts as being at it, in pixels.
38078
38067
  *
38079
38068
  * A hook rather than a constant, because the right number depends on how tall
@@ -38130,7 +38119,7 @@ export type CustomElementsSolidJs = {
38130
38119
  *
38131
38120
  * Areas where markup can be added to the component.
38132
38121
  *
38133
- * - `(default)`: The turns, as `helix-chat-message` children.
38122
+ * - `(default)`: The turns.
38134
38123
  * - `actions`: Beside the header: what can be done to the conversation itself.
38135
38124
  * - `composer`: Below the transcript, where the reader writes.
38136
38125
  * - `header`: Above the transcript: what this conversation is.
@@ -38600,11 +38589,11 @@ export type CustomElementsSolidJs = {
38600
38589
  * round. The platform already writes booleans like this for the same reason,
38601
38590
  * `novalidate` and `nomodule` and `noreferrer` among them.
38602
38591
  *
38603
- * **Reflected, because the gutter is a stylesheet rule.** `code-block.css`
38604
- * reserves the copy button's width with `:host(:not([no-copy]))`, so the
38605
- * attribute is what decides whether the block pays for a control. Unreflected,
38606
- * setting it from script takes the button away (`render` reads the property)
38607
- * and leaves the 40px it stood in reserved.
38592
+ * **Reflected, because the gutter is a stylesheet rule.** A sheet reserves
38593
+ * the copy button's width with `:host(:not([no-copy]))`, so the attribute is
38594
+ * what decides whether the block pays for a control. Unreflected, setting it
38595
+ * from script takes the button away (`render` reads the property) and leaves
38596
+ * the 40px it stood in reserved.
38608
38597
  *
38609
38598
  * A false boolean reflects as the attribute's absence, so this costs no
38610
38599
  * `no-copy=""` on hosts that never asked for one, and the rule about a
@@ -38754,11 +38743,11 @@ export type CustomElementsSolidJs = {
38754
38743
  >;
38755
38744
 
38756
38745
  /**
38757
- * **The picker is `helix-color-picker`, not a second one written here.** It owns the
38746
+ * **The picker is `ColorPicker`, not a second one written here.** It owns the
38758
38747
  * square, the ramps, the eyedropper and the syntax toggle, and it is worth
38759
38748
  * having on its own: a settings pane wants a picker flat on the page with
38760
38749
  * nothing to open. This element is the field, the overlay, and the form.
38761
- * Exactly the arrangement Date Input has with `helix-date-picker`.
38750
+ * Exactly the arrangement Date Input has with `DatePicker`.
38762
38751
  *
38763
38752
  * **Typed as well as picked, and the typing is the reason this is not
38764
38753
  * `<input type="color">`.** The native control gives a free picker and takes
@@ -39119,10 +39108,10 @@ export type CustomElementsSolidJs = {
39119
39108
  *
39120
39109
  * **A color is exactly as requirable as a date**, which is the comparison
39121
39110
  * that settles it: this element extends `HelixFormElement`, carries `name`
39122
- * and reports its value, so a consumer writing
39123
- * `<helix-color-picker name="brand" required>` inside a form has every reason
39124
- * to expect the form to refuse an empty one. Its two siblings in the same
39125
- * composition position, Date Picker and Time Picker, both check it.
39111
+ * and reports its value, so a consumer writing `<helix-headless-color-picker
39112
+ * name="brand" required>` inside a form has every reason to expect the form
39113
+ * to refuse an empty one. Its two siblings in the same composition position,
39114
+ * Date Picker and Time Picker, both check it.
39126
39115
  *
39127
39116
  * Written out rather than taken from `MixinField`, for the reason those two
39128
39117
  * record: the mixin brings a label, a hint and a feedback region, and this is
@@ -39314,10 +39303,10 @@ export type CustomElementsSolidJs = {
39314
39303
  >;
39315
39304
 
39316
39305
  /**
39317
- * **The list is `helix-listbox`, and the filtering is its own.** It owns
39318
- * narrowing, the empty state, the highlight, `aria-activedescendant` and
39319
- * scrolling an option into view. What is left for this element is the field,
39320
- * the panel and the traffic between them.
39306
+ * **The list is `Listbox`, and the filtering is its own.** It owns narrowing,
39307
+ * the empty state, the highlight, `aria-activedescendant` and scrolling an
39308
+ * option into view. What is left for this element is the field, the panel and
39309
+ * the traffic between them.
39321
39310
  *
39322
39311
  * **The text and the value are two things.** What a reader types is a filter:
39323
39312
  * it narrows the list and is thrown away. The value is whichever option they
@@ -39488,7 +39477,7 @@ export type CustomElementsSolidJs = {
39488
39477
  *
39489
39478
  * Areas where markup can be added to the component.
39490
39479
  *
39491
- * - `(default)`: The options, which are `helix-option` elements.
39480
+ * - `(default)`: The options.
39492
39481
  * - `end`: After it, for a unit or a clear button.
39493
39482
  * - `indicator`: Replaces the caret saying the field opens.
39494
39483
  * - `start`: Before the text, for an icon.
@@ -39602,12 +39591,11 @@ export type CustomElementsSolidJs = {
39602
39591
  >;
39603
39592
 
39604
39593
  /**
39605
- * **The list is `helix-listbox`, filtering and all.** Listbox already owns
39606
- * narrowing, the empty state, the highlight over what matched,
39607
- * `aria-activedescendant`, scrolling an option into view and the keyboard that
39608
- * moves between them. Its own note says a command palette is that list again
39609
- * with something different opening it, and this is that something: a dialog,
39610
- * and a key that summons it.
39594
+ * **The list is `Listbox`, filtering and all.** Listbox already owns narrowing,
39595
+ * the empty state, the highlight over what matched, `aria-activedescendant`,
39596
+ * scrolling an option into view and the keyboard that moves between them. Its
39597
+ * own note says a command palette is that list again with something different
39598
+ * opening it, and this is that something: a dialog, and a key that summons it.
39611
39599
  *
39612
39600
  * **The value is not kept.** A palette runs a command and forgets it: nothing
39613
39601
  * here is a form control and nothing is submitted, so what it reports is that
@@ -39684,7 +39672,7 @@ export type CustomElementsSolidJs = {
39684
39672
  *
39685
39673
  * Areas where markup can be added to the component.
39686
39674
  *
39687
- * - `(default)`: The commands, which are `helix-option` elements and their groups.
39675
+ * - `(default)`: The commands, and any groups of them.
39688
39676
  * - `footer`: Under the list, for the keys a reader can press.
39689
39677
  *
39690
39678
  * ## Methods
@@ -39774,7 +39762,7 @@ export type CustomElementsSolidJs = {
39774
39762
  * the same way `label` becomes `aria-label` in there.
39775
39763
  *
39776
39764
  * ```html
39777
- * <helix-button commandfor="confirm" command="--show">Delete…</helix-button>
39765
+ * <helix-headless-button commandfor="confirm" command="--show">Delete…</helix-headless-button>
39778
39766
  * ```
39779
39767
  *
39780
39768
  * `commandFor` spells its attribute out, because Lit lowercases a property
@@ -39973,19 +39961,19 @@ export type CustomElementsSolidJs = {
39973
39961
 
39974
39962
  /**
39975
39963
  * **The schema is markup and the data is a property.** Columns are declared as
39976
- * `helix-table-column` children, because a schema is small and something a
39977
- * reader should see in the HTML; rows are handed over as an array, because a
39978
- * table that draws ten thousand elements cannot window them.
39964
+ * `TableColumn` children, because a schema is small and something a reader
39965
+ * should see in the HTML; rows are handed over as an array, because a table
39966
+ * that draws ten thousand elements cannot window them.
39979
39967
  *
39980
39968
  * ```html
39981
- * <helix-data-table .rows=${rows} sort="name:asc" page-size="20">
39982
- * <helix-table-column field="name" sortable>Name</helix-table-column>
39983
- * <helix-table-column field="size" align="end" sortable .cell=${bytes}>Size</helix-table-column>
39984
- * </helix-data-table>
39969
+ * <helix-headless-data-table .rows=${rows} sort="name:asc" page-size="20">
39970
+ * <helix-headless-table-column field="name" sortable>Name</helix-headless-table-column>
39971
+ * <helix-headless-table-column field="size" align="end" sortable .cell=${bytes}>Size</helix-headless-table-column>
39972
+ * </helix-headless-data-table>
39985
39973
  * ```
39986
39974
  *
39987
- * `helix-table` takes rows as markup and is the right component for a table of
39988
- * twelve things a person wrote out.
39975
+ * `Table` takes rows as markup and is the right component for a table of twelve
39976
+ * things a person wrote out.
39989
39977
  *
39990
39978
  * **Sort and filter apply to the whole set, never the page.** Sorting the drawn
39991
39979
  * window is correct on the first screen and wrong on every other one.
@@ -39994,7 +39982,7 @@ export type CustomElementsSolidJs = {
39994
39982
  * elements do, but reading a cell needs the columns, and the columns are markup
39995
39983
  * children Lit SSR does not hand this element. So a crawler sees a table of the
39996
39984
  * right shape with nothing in it. That is the cost of the first paragraph: use
39997
- * `helix-table` where the served HTML has to carry the values.
39985
+ * `Table` where the served HTML has to carry the values.
39998
39986
  *
39999
39987
  * **`selectable` adds a column of checkboxes, keyed on `row-key`.** A row is
40000
39988
  * selected by its identity rather than its position, so a selection survives a
@@ -40015,14 +40003,13 @@ export type CustomElementsSolidJs = {
40015
40003
  * in the order on screen, in the columns on screen. Saving it is the page's
40016
40004
  * business, the same as any other file.
40017
40005
  *
40018
- * **There is no `columns` attribute here, and `helix-table` has one.** The
40019
- * difference is what a column is in each: here it is the schema, so a table
40020
- * without one has nothing to read a row with, and every column is a place to
40021
- * write a `width`. A `helix-table` holds cells a consumer wrote and can be
40022
- * written with no column at all, so its `columns` is where such a table is
40023
- * sized from. Written on this element the attribute is inert, which is the trap
40024
- * worth knowing when moving between the two. What both take is the CSS hook,
40025
- * `--data-table-columns` here and `--table-columns` there.
40006
+ * **There is no `columns` attribute here, and Table has one.** The difference
40007
+ * is what a column is in each: here it is the schema, so a table without one
40008
+ * has nothing to read a row with, and every column is a place to write a
40009
+ * `width`. A Table holds cells a consumer wrote and can be written with no
40010
+ * column at all, so its `columns` is where such a table is sized from. Written
40011
+ * on this element the attribute is inert, which is the trap worth knowing when
40012
+ * moving between the two.
40026
40013
  *
40027
40014
  * ## Attributes & Properties
40028
40015
  *
@@ -40103,9 +40090,9 @@ export type CustomElementsSolidJs = {
40103
40090
  *
40104
40091
  * **It announces nothing, and that is not an omission.** Nothing in this
40105
40092
  * element ever asks for a different page size: a size selector is
40106
- * `helix-pagination-size`, which a consumer puts in the `footer` slot and
40107
- * answers themselves. Routing this through `requestChange` would announce an
40108
- * event the element never has cause to fire.
40093
+ * `PaginationSize`, which a consumer puts in the `footer` slot and answers
40094
+ * themselves. Routing this through `requestChange` would announce an event
40095
+ * the element never has cause to fire.
40109
40096
  * - `total`: How many rows the whole result has, where this element cannot count them.
40110
40097
  *
40111
40098
  * Only read in `server` mode, where `rows` is one page and its length says
@@ -40192,7 +40179,7 @@ export type CustomElementsSolidJs = {
40192
40179
  *
40193
40180
  * Areas where markup can be added to the component.
40194
40181
  *
40195
- * - `(default)`: The columns, declared as `helix-table-column` children.
40182
+ * - `(default)`: The columns, declared rather than drawn.
40196
40183
  * - `footer`: Below the grid, replacing the pagination this would otherwise draw.
40197
40184
  * - `toolbar`: Above the grid, for a search field or actions.
40198
40185
  *
@@ -40228,8 +40215,8 @@ export type CustomElementsSolidJs = {
40228
40215
  *
40229
40216
  * CSS variables available for styling the component.
40230
40217
  *
40231
- * - `--data-table-cell-align`: The edge the column a cell sits under is set to, `start`, `center` or `end`, and unset under a column that sets none. Written by the component onto each cell it draws, read by the sheet that paints one; `helix-table` publishes `--table-cell-align` for the same attribute on the cells a consumer wrote, under its own family's name. (default: `undefined`)
40232
- * - `--data-table-template`: The column track list this element worked out from the columns declared in it. Written by the component, read by the sheet that paints: a stylesheet takes it to lay the grid out, and setting it does nothing, because the component writes it inline on the very element that reads it and an inline declaration beats any sheet. `--data-table-columns` is the one to set. (default: `undefined`)
40218
+ * - `--data-table-cell-align`: The edge the column a cell sits under is set to, `start`, `center` or `end`, and unset under a column that sets none. Written by the component onto each cell it draws, read by the sheet that paints one; Table publishes `--table-cell-align` for the same attribute on the cells a consumer wrote, under its own family's name. (default: `undefined`)
40219
+ * - `--data-table-template`: The column track list this element worked out from the columns declared in it. Written by the component, read by the sheet that paints: a stylesheet takes it to lay the grid out, and setting it does nothing, because the component writes it inline on the very element that reads it and an inline declaration beats any sheet. A column's `width` is the one to set. (default: `undefined`)
40233
40220
  *
40234
40221
  * ## CSS Parts
40235
40222
  *
@@ -40287,9 +40274,9 @@ export type CustomElementsSolidJs = {
40287
40274
  >;
40288
40275
 
40289
40276
  /**
40290
- * **The calendar is `helix-date-picker`, not a second one written here.** It
40291
- * already knows about months, ranges, disabled days, the first day of the week
40292
- * and every keyboard rule a grid owes a reader. This element is the field, the
40277
+ * **The calendar is `DatePicker`, not a second one written here.** It already
40278
+ * knows about months, ranges, disabled days, the first day of the week and
40279
+ * every keyboard rule a grid owes a reader. This element is the field, the
40293
40280
  * overlay, and the translation between them.
40294
40281
  *
40295
40282
  * **Typed as well as picked, and the typing is why it is not
@@ -41406,8 +41393,8 @@ export type CustomElementsSolidJs = {
41406
41393
  * Opened declaratively with the platform's invoker attributes:
41407
41394
  *
41408
41395
  * ```html
41409
- * <helix-button commandfor="nav" command="--toggle">Menu</helix-button>
41410
- * <helix-drawer id="nav">…</helix-drawer>
41396
+ * <helix-headless-button commandfor="nav" command="--toggle">Menu</helix-headless-button>
41397
+ * <helix-headless-drawer id="nav">…</helix-headless-drawer>
41411
41398
  * ```
41412
41399
  *
41413
41400
  * ## Attributes & Properties
@@ -41438,10 +41425,10 @@ export type CustomElementsSolidJs = {
41438
41425
  * not, rather than shown or hidden by CSS.
41439
41426
  * - `placement`: Which edge the drawer comes from.
41440
41427
  *
41441
- * Unset is `end`, which the styled tier reads as `:host(:not([placement]))`
41442
- * beside `:host([placement="end"])` rather than as a value written here: a
41428
+ * Unset is `end`, and it stays unset rather than being written down: a
41443
41429
  * default assigned to the property would reflect onto every host and put a
41444
- * `placement="end"` into markup no consumer wrote.
41430
+ * `placement="end"` into markup no consumer wrote. So what this tier
41431
+ * guarantees is the absence, and a sheet selects on it.
41445
41432
  * - `open`: Whether the element is open.
41446
41433
  *
41447
41434
  * One property, not two, so `dialog.open` answers the question anyone
@@ -42339,7 +42326,13 @@ export type CustomElementsSolidJs = {
42339
42326
  * - `fields`: The fields declared inside this, in the order they were written.
42340
42327
  *
42341
42328
  * What a render may know of them: none on a server, whose shim has no tree
42342
- * and threw here, and none while hydrating what one sent. (property only) (readonly)
42329
+ * and threw here, and none while hydrating what one sent.
42330
+ *
42331
+ * By identity rather than by tag. A list of names can only hold the tags this
42332
+ * package knows about, so it misses any third one, which is what subclassing
42333
+ * a headless element produces, and it is also how a headless package learns a
42334
+ * styled tag. `instanceof` answers for every one of them and proves the type
42335
+ * the signature claims. (property only) (readonly)
42343
42336
  * - `whenSettled`: Resolves a frame after the first update, when transitions are switched on.
42344
42337
  *
42345
42338
  * **Named `whenSettled` because `settled` is taken four times over**, by
@@ -42578,12 +42571,12 @@ export type CustomElementsSolidJs = {
42578
42571
  * `FilterField` already plays on its own children.
42579
42572
  *
42580
42573
  * **It can suggest what to type next, and deciding what to suggest is still the
42581
- * consumer's.** Slot `helix-option` elements into `suggestions` and the field
42582
- * shows them, moves through them with the arrows, and lets Enter press one; the
42583
- * option fires its own `helix-select` and the consumer decides what choosing
42584
- * meant. Keys before a colon and values after it are the same panel with
42585
- * different contents, and `readFilterText` is exported for a consumer narrowing
42586
- * that panel against what a reader has half typed.
42574
+ * consumer's.** Slot options into `suggestions` and the field shows them, moves
42575
+ * through them with the arrows, and lets Enter press one; the option fires its
42576
+ * own `helix-select` and the consumer decides what choosing meant. Keys before
42577
+ * a colon and values after it are the same panel with different contents, and
42578
+ * `readFilterText` is exported for a consumer narrowing that panel against what
42579
+ * a reader has half typed.
42587
42580
  *
42588
42581
  * **The panel opens when there is something in it and closes when there is
42589
42582
  * not**, rather than on a choice. A reader who picks a key wants its values
@@ -42882,11 +42875,12 @@ export type CustomElementsSolidJs = {
42882
42875
  * would give.
42883
42876
  *
42884
42877
  * **The element's own text is read as a fallback, and only in a browser.**
42885
- * `<helix-format-date elapsed>2026-08-27T01:00:00Z</helix-format-date>` is the
42886
- * spelling that reads best in markup, and it cannot be the only one: measured
42887
- * against Lit's server shim, `textContent`, `children`, `firstChild` and
42888
- * `querySelector` are all `undefined` there, so a server has no way to see it.
42889
- * An element rendered on a server needs the attribute; one rendered in a
42878
+ * `<helix-headless-format-date
42879
+ * elapsed>2026-08-27T01:00:00Z</helix-headless-format-date>` is the spelling
42880
+ * that reads best in markup, and it cannot be the only one: measured against
42881
+ * Lit's server shim, `textContent`, `children`, `firstChild` and
42882
+ * `querySelector` are all `undefined` there, so a server has no way to see
42883
+ * it. An element rendered on a server needs the attribute; one rendered in a
42890
42884
  * browser may use either.
42891
42885
  * - `day`: How the day of the month is written, where a date is shown.
42892
42886
  * - `elapsed`: Show how long ago it was, compactly, instead of the date.
@@ -42987,12 +42981,12 @@ export type CustomElementsSolidJs = {
42987
42981
  * consumer has to keep by hand, and the one number a summary is told to trust
42988
42982
  * is the one it gets wrong.
42989
42983
  *
42990
- * The strip measures itself, so `--heatmap-cell-inline-size` and `--heatmap-gap` are
42991
- * enough on their own and these two are the estimate used until the first
42992
- * measurement lands. Writing the attribute pins the value and stops the
42993
- * measurement being consulted, which is what a container query or a transition
42994
- * on the cell size wants, where what is drawn this frame is not what the
42995
- * arithmetic should plan around.
42984
+ * The strip measures itself, so sizing the cells in a sheet is enough on its
42985
+ * own and these two are the estimate used until the first measurement lands.
42986
+ * Writing the attribute pins the value and stops the measurement being
42987
+ * consulted, which is what a container query or a transition on the cell size
42988
+ * wants, where what is drawn this frame is not what the arithmetic should
42989
+ * plan around.
42996
42990
  *
42997
42991
  * Zero turns the dropping off altogether, which is right for a strip in a
42998
42992
  * container that cannot get narrow.
@@ -43136,11 +43130,6 @@ export type CustomElementsSolidJs = {
43136
43130
  *
43137
43131
  * CSS variables available for styling the component.
43138
43132
  *
43139
- * - `--heatmap-cell-height`: How tall a cell is. A row of a tall thin cell is what a status page draws. (default: `undefined`)
43140
- * - `--heatmap-cell-inline-size`: How wide a cell is. The strip fits as many as the container allows. (default: `undefined`)
43141
- * - `--heatmap-cell-radius`: How far a cell's corners are rounded. (default: `undefined`)
43142
- * - `--heatmap-cell-size`: The size a cell wants on both axes, where neither is given its own. (default: `undefined`)
43143
- * - `--heatmap-gap`: Space between cells. Zero is a continuous field rather than a grid of tiles. (default: `undefined`)
43144
43133
  * - `--heatmap-rows`: How many rows the strip lays out. Written by the component from the data, read by the tier that draws it. (default: `undefined`)
43145
43134
  * - `--heatmap-tone`: The tone of the cell this is set on. Written by the component, read by the sheet that paints. (default: `undefined`)
43146
43135
  * - `--heatmap-tone-1`: The quietest step of the magnitude ramp, reached by `tones="1 …"`. (default: `undefined`)
@@ -43227,7 +43216,7 @@ export type CustomElementsSolidJs = {
43227
43216
  * the same way `label` becomes `aria-label` in there.
43228
43217
  *
43229
43218
  * ```html
43230
- * <helix-button commandfor="confirm" command="--show">Delete…</helix-button>
43219
+ * <helix-headless-button commandfor="confirm" command="--show">Delete…</helix-headless-button>
43231
43220
  * ```
43232
43221
  *
43233
43222
  * `commandFor` spells its attribute out, because Lit lowercases a property
@@ -43548,10 +43537,10 @@ export type CustomElementsSolidJs = {
43548
43537
  * **Mirrored to `data-status`, and not reflected as `status`.** It is element
43549
43538
  * state, so reflecting it puts the element's own bookkeeping into the markup
43550
43539
  * a consumer rendered: React reads the attribute appearing at upgrade as a
43551
- * hydration mismatch, and a serialized `<helix-image status="loaded">` pasted
43552
- * back declares that a picture has arrived which this element has never
43553
- * fetched. The `data-` name is the library's answer to both, being a name a
43554
- * re-parse cannot mistake for a declaration, and it is what `data-closed` on
43540
+ * hydration mismatch, and a host pasted back carrying `status="loaded"`
43541
+ * declares that a picture has arrived which this element has never fetched.
43542
+ * The `data-` name is the library's answer to both, being a name a re-parse
43543
+ * cannot mistake for a declaration, and it is what `data-closed` on
43555
43544
  * `Toast.Item` already does. A picture arrives after somebody fetched it,
43556
43545
  * which puts this on the safe side of hydration: a fact that can be true on
43557
43546
  * the *first* update mirrors to a custom state instead, which is what
@@ -43667,10 +43656,10 @@ export type CustomElementsSolidJs = {
43667
43656
  * **The attribute is `readonly`, which is the platform's spelling.** A
43668
43657
  * camelCase property needs an explicit `attribute`, and dash-casing a word
43669
43658
  * HTML writes as one costs what an attribute always costs here: nothing
43670
- * warns. `<helix-input readonly>` is what anybody who has written HTML types;
43671
- * against `read-only` it parses to no property at all, and the field stays
43672
- * editable with no error anywhere. Measured on the dash-cased form, `readOnly`
43673
- * came back `false`.
43659
+ * warns. `<helix-headless-input readonly>` is what anybody who has written
43660
+ * HTML types; against `read-only` it parses to no property at all, and the
43661
+ * field stays editable with no error anywhere. Measured on the dash-cased
43662
+ * form, `readOnly` came back `false`.
43674
43663
  * - `reveal`: Whether a password field offers a toggle that shows what was typed.
43675
43664
  *
43676
43665
  * Ignored on every other type. A reveal on an email field would be a button
@@ -43684,9 +43673,9 @@ export type CustomElementsSolidJs = {
43684
43673
  *
43685
43674
  * **Not reflected.** Reflection exists so a selector can reach a value, and
43686
43675
  * no stylesheet in this repository selects on `type`. Reflecting it writes
43687
- * `type="text"` onto every `<helix-input>` ever rendered, an attribute no
43688
- * consumer's markup has, which is the fault the area rules write up under
43689
- * `Button`'s `href`, `target` and `rel`.
43676
+ * `type="text"` onto every `<helix-headless-input>` ever rendered, an
43677
+ * attribute no consumer's markup has, which is the fault the area rules write
43678
+ * up under `Button`'s `href`, `target` and `rel`.
43690
43679
  *
43691
43680
  * Nothing reads it from the attribute either. The real `<input>` inside takes
43692
43681
  * it as a property binding, which is what makes the keyboard and the
@@ -44141,8 +44130,7 @@ export type CustomElementsSolidJs = {
44141
44130
  * over something busy. `triangle` points along the axis and reads as "and
44142
44131
  * onward" rather than as a second claim about the data.
44143
44132
  *
44144
- * The shapes come from
44145
- * `helix/styled/src/shared/chart/terminus.css`, the same sheet `Sparkline` takes, so
44133
+ * The shapes come from one shared sheet, the same one `Sparkline` takes, so
44146
44134
  * the set is identical wherever one appears. **Which is why every value is
44147
44135
  * named here.** `Sparkline` shipped `square` implemented, drawn, asserted and
44148
44136
  * undocumented until the cohort before this one; this family reads the same
@@ -44413,10 +44401,10 @@ export type CustomElementsSolidJs = {
44413
44401
  * - `label`: Accessible name for the set.
44414
44402
  * - `type`: Which markers an ordered list draws, in `<ol type>`'s own five values.
44415
44403
  *
44416
- * Reflected, because this is one of the things a stylesheet selects on and
44417
- * the styled tier maps each to a `list-style-type`. The platform's spellings
44418
- * rather than the CSS ones, so `<helix-list kind="ordered" type="i">` is what
44419
- * a consumer would have written on an `<ol>`.
44404
+ * Reflected, because this is one of the things a stylesheet selects on, each
44405
+ * value mapping to a `list-style-type`. The platform's spellings rather than
44406
+ * the CSS ones, so `<helix-headless-list kind="ordered" type="i">` is what a
44407
+ * consumer would have written on an `<ol>`.
44420
44408
  *
44421
44409
  * **`start` and `reversed` are both absent and neither can be done here.**
44422
44410
  * This renders no `<ol>`: the rows are slotted and numbered by the CSS
@@ -45598,9 +45586,9 @@ export type CustomElementsSolidJs = {
45598
45586
  >;
45599
45587
 
45600
45588
  /**
45601
- * A notification is a toast that did not go away. `helix-toast` is deliberately
45602
- * the opposite of this: a live region whose items carry a `duration` and whose
45603
- * root never creates or destroys anything. What makes this its own family is the
45589
+ * A notification is a toast that did not go away. `Toast` is deliberately the
45590
+ * opposite of this: a live region whose items carry a `duration` and whose root
45591
+ * never creates or destroys anything. What makes this its own family is the
45604
45592
  * state each item carries rather than the arrangement it sits in: read and
45605
45593
  * unread, a timestamp that has to stay correct, and an action a reader can take
45606
45594
  * later.
@@ -45612,9 +45600,9 @@ export type CustomElementsSolidJs = {
45612
45600
  * reader wants exactly one of them at a time: the time while they are scanning,
45613
45601
  * and what they can do about it once they have stopped on a row.
45614
45602
  *
45615
- * **The timestamp is `helix-format-date`**, which is where the reading, the
45616
- * `<time datetime>` and the shared timer now live. It was implemented here, and
45617
- * a component that formats a date is not a fact about notifications: Chat wanted
45603
+ * **The timestamp is `FormatDate`**, which is where the reading, the `<time
45604
+ * datetime>` and the shared timer now live. It was implemented here, and a
45605
+ * component that formats a date is not a fact about notifications: Chat wanted
45618
45606
  * the same thing and had its own copy of half of it.
45619
45607
  *
45620
45608
  * **Read state is reported, not invented.** Marking something read is usually a
@@ -45640,10 +45628,10 @@ export type CustomElementsSolidJs = {
45640
45628
  *
45641
45629
  * **Not reflected.** Unread is a visual state, which is why the four mixins
45642
45630
  * mirror theirs, but the mirror may not be the property's own attribute:
45643
- * `<helix-notification default-read>` comes back from a server without `read`
45644
- * and would gain it on the first update, which React reports as a hydration
45645
- * mismatch, and which a copy of the serialized element re-parses as a
45646
- * declaration. `:state(read)` is what the stylesheet reads.
45631
+ * `<helix-headless-notification default-read>` comes back from a server
45632
+ * without `read` and would gain it on the first update, which React reports
45633
+ * as a hydration mismatch, and which a copy of the serialized element
45634
+ * re-parses as a declaration. `:state(read)` is what the stylesheet reads.
45647
45635
  * `hydration.dom.spec.ts` holds it.
45648
45636
  * - `default-read`/`defaultRead`: State to open with, where nothing declared one.
45649
45637
  * - `locale`: Locale for the timestamp.
@@ -45836,7 +45824,7 @@ export type CustomElementsSolidJs = {
45836
45824
  *
45837
45825
  * Areas where markup can be added to the component.
45838
45826
  *
45839
- * - `(default)`: The notifications, as `helix-notification` children.
45827
+ * - `(default)`: The notifications.
45840
45828
  * - `footer`: Below the list, for a link to everything.
45841
45829
  * - `header`: Above the list, for a title and the mark-all control.
45842
45830
  *
@@ -46430,7 +46418,7 @@ export type CustomElementsSolidJs = {
46430
46418
  * **The attribute, read when it is asked for, and never a snapshot taken in
46431
46419
  * the constructor.** A field initializer runs there, and an element the HTML
46432
46420
  * parser created has none of its attributes yet at that moment: measured on
46433
- * this element, on `Radio` and on `Toggle`, `<helix-option value="a"
46421
+ * this element, on `Radio` and on `Toggle`, `<helix-headless-option value="a"
46434
46422
  * selected>` reported `defaultSelected` as `false` both from parsed markup
46435
46423
  * and from `createElement` followed by `setAttribute`, which is every way a
46436
46424
  * consumer writes one. The snapshot could only ever be true for an element
@@ -46654,8 +46642,8 @@ export type CustomElementsSolidJs = {
46654
46642
  /**
46655
46643
  * **The component is the truncation.** Given a page and a total it works out
46656
46644
  * which numbers to show and where the runs break, so this is data-driven rather
46657
- * than composed: `<helix-pagination page="4" pages="12">` rather than twelve
46658
- * slotted children a consumer keeps in step with their own query.
46645
+ * than composed: `<helix-headless-pagination page="4" pages="12">` rather than
46646
+ * twelve slotted children a consumer keeps in step with their own query.
46659
46647
  *
46660
46648
  * **The width does not change as you page.** The run around the current page is
46661
46649
  * `siblings` either side, and grows to absorb a gap slot at a boundary, so the
@@ -47096,10 +47084,10 @@ export type CustomElementsSolidJs = {
47096
47084
  * marked letters wants `text`, which judges nothing.
47097
47085
  *
47098
47086
  * **Not reflected**: nothing selects on it, so reflecting only writes
47099
- * `type="numeric"` onto every `<helix-pin-input>` ever rendered, an attribute
47100
- * no consumer's markup had. The area rules carry the sentence "reflect only
47101
- * what CSS selects on". The real inputs take it as a binding, which is what
47102
- * makes the keyboard follow.
47087
+ * `type="numeric"` onto every `<helix-headless-pin-input>` ever rendered, an
47088
+ * attribute no consumer's markup had. The area rules carry the sentence
47089
+ * "reflect only what CSS selects on". The real inputs take it as a binding,
47090
+ * which is what makes the keyboard follow.
47103
47091
  * - `default-value`/`defaultValue`: The value the markup declared, which is where a reset returns to.
47104
47092
  * - `value`: What the control holds now, and what its form submits.
47105
47093
  *
@@ -47858,7 +47846,7 @@ export type CustomElementsSolidJs = {
47858
47846
  * **The attribute, read when it is asked for, and never a snapshot taken in
47859
47847
  * the constructor.** A field initializer runs there, and an element the HTML
47860
47848
  * parser created has none of its attributes yet at that moment: measured on
47861
- * this element, on `Option` and on `Toggle`, `<helix-radio value="a"
47849
+ * this element, on `Option` and on `Toggle`, `<helix-headless-radio value="a"
47862
47850
  * selected>` reported `defaultSelected` as `false` both from parsed markup
47863
47851
  * and from `createElement` followed by `setAttribute`, which is every way a
47864
47852
  * consumer writes one. The snapshot could only ever be true for an element
@@ -49331,11 +49319,10 @@ export type CustomElementsSolidJs = {
49331
49319
  * mean defining what a dial with a submenu in it does.
49332
49320
  *
49333
49321
  * **The trigger is a control the consumer slots**, and the floating action
49334
- * button is the usual one: `helix-icon-button` with `shape="circle"` and
49335
- * `raised`. There is no `helix-fab`, because it would re-declare `emphasis`,
49336
- * `tone`, `label` and a size around a control that already has all four. A
49337
- * round raised button is a shape, and where it sits is `data-dock` in the base
49338
- * layer.
49322
+ * button is the usual one: `IconButton` with `shape="circle"` and `raised`.
49323
+ * There is no `helix-fab`, because it would re-declare `emphasis`, `tone`,
49324
+ * `label` and a size around a control that already has all four. A round raised
49325
+ * button is a shape, and where it sits is `data-dock` in the base layer.
49339
49326
  *
49340
49327
  * **Nothing is reserved from the keyboard.** A menu that drills has to keep the
49341
49328
  * horizontal pair for going in and coming back; a dial goes nowhere, so all four
@@ -49703,9 +49690,9 @@ export type CustomElementsSolidJs = {
49703
49690
  * The row directions set them side by side, for a figure in a line of text or
49704
49691
  * a narrow strip where a stacked pair would be two lines of almost nothing.
49705
49692
  *
49706
- * A property rather than a `helix-flex` around it, because the unit has to
49707
- * stay on the value's baseline whichever way the pair goes, and only this
49708
- * element knows which of its children the unit belongs to.
49693
+ * A property rather than a `Flex` around it, because the unit has to stay on
49694
+ * the value's baseline whichever way the pair goes, and only this element
49695
+ * knows which of its children the unit belongs to.
49709
49696
  *
49710
49697
  * **Optional rather than defaulted to `column`, which is not a style
49711
49698
  * preference.** A reflecting property with a default writes its attribute onto
@@ -49841,7 +49828,7 @@ export type CustomElementsSolidJs = {
49841
49828
  *
49842
49829
  * Areas where markup can be added to the component.
49843
49830
  *
49844
- * - `(default)`: The steps, which are `helix-step` elements.
49831
+ * - `(default)`: The steps.
49845
49832
  *
49846
49833
  * ## Methods
49847
49834
  *
@@ -49871,9 +49858,9 @@ export type CustomElementsSolidJs = {
49871
49858
 
49872
49859
  /**
49873
49860
  * **The name is a button, and only the name.** The marker is `aria-hidden`
49874
- * decoration, so wrapping it would add hit area and no meaning. It is
49875
- * `helix-button` rather than a `<button>` this element resets: the hover wash,
49876
- * the focus ring and the disabled treatment are decisions the button carries.
49861
+ * decoration, so wrapping it would add hit area and no meaning. It is `Button`
49862
+ * rather than a `<button>` this element resets: the hover wash, the focus ring
49863
+ * and the disabled treatment are decisions the button carries.
49877
49864
  *
49878
49865
  * **It says nothing about where a reader may go.** Every step is pressable and
49879
49866
  * announces itself with `helix-select`; refusing the ones ahead is `disabled`,
@@ -49926,7 +49913,7 @@ export type CustomElementsSolidJs = {
49926
49913
  * Areas where markup can be added to the component.
49927
49914
  *
49928
49915
  * - `(default)`: The step's name.
49929
- * - `content`: What the stage holds. Always rendered here, a tier with no stylesheet having nothing to fold it with; the styled tier opens it on the current step down a column, and a row has no space under a step to open it into.
49916
+ * - `content`: What the stage holds. Always rendered here, a tier with no stylesheet having nothing to fold it with, so whether it is folded away is the sheet's answer and not this tier's.
49930
49917
  * - `description`: A line under the name, for what the stage is for.
49931
49918
  * - `marker`: Replaces the number, or the check a complete step shows.
49932
49919
  *
@@ -49943,7 +49930,7 @@ export type CustomElementsSolidJs = {
49943
49930
  * - `body`: The name and its description.
49944
49931
  * - `content`: What the stage holds, while it is open.
49945
49932
  * - `description`: The line under it.
49946
- * - `label`: The step's name, which is a `helix-button`.
49933
+ * - `label`: The step's name, which is a control.
49947
49934
  * - `label-button`: The inner control.
49948
49935
  * - `lead`: The half line arriving from the step before.
49949
49936
  * - `mark`: The glyph inside the marker: a tick, a dot, or an empty ring.
@@ -50212,23 +50199,23 @@ export type CustomElementsSolidJs = {
50212
50199
  * the table has another track; remove one and it does not. That is what ties
50213
50200
  * the two together, and a table-level track list on its own does not: a list
50214
50201
  * that is accidentally the headings is invalid CSS a grid ignores in silence,
50215
- * drawing the whole table as one column. `helix-table`'s `columns` is dealt out
50216
- * a track at a time against the columns declared under it, so a heading among
50217
- * the widths costs its own column a width and no more, and a list longer or
50218
- * shorter than the columns is trimmed or shared rather than being a second
50219
- * count of them. A column's own `width` wins over the track in its place.
50202
+ * drawing the whole table as one column. `Table`'s `columns` is dealt out a
50203
+ * track at a time against the columns declared under it, so a heading among the
50204
+ * widths costs its own column a width and no more, and a list longer or shorter
50205
+ * than the columns is trimmed or shared rather than being a second count of
50206
+ * them. A column's own `width` wins over the track in its place.
50220
50207
  *
50221
50208
  * **It is also where every per-column fact goes**, which is the reason
50222
- * `helix-data-table` needs no column config object. `field` names the key the
50223
- * cell reads, `sortable` says a reader may reorder by it, `align` says which
50224
- * edge the values line up against, and `cell` takes a function for anything the
50209
+ * `DataTable` needs no column config object. `field` names the key the cell
50210
+ * reads, `sortable` says a reader may reorder by it, `align` says which edge
50211
+ * the values line up against, and `cell` takes a function for anything the
50225
50212
  * field alone cannot express. The schema is markup and the data is a property:
50226
50213
  * a schema is small, declarative, and something a reader should be able to see
50227
50214
  * in the HTML, and data is large and windowed.
50228
50215
  *
50229
50216
  * **The same element serves both tables**, the markup one and the data one. It
50230
- * is identified by a flag rather than by `instanceof`, so a `helix-table-column`
50231
- * works inside either without the two roots sharing anything else.
50217
+ * is identified by a flag rather than by `instanceof`, so a `TableColumn` works
50218
+ * inside either without the two roots sharing anything else.
50232
50219
  *
50233
50220
  * **It generates no box of its own**, the same as a row: the heading is a grid
50234
50221
  * item of the table, so it lines up with the cells under it rather than sitting
@@ -50238,10 +50225,10 @@ export type CustomElementsSolidJs = {
50238
50225
  * both, so the columns after it keep their own widths and every row keeps its
50239
50226
  * cells under their headings. `hidden="until-found"` keeps its track, the
50240
50227
  * heading being left drawn, as every Helix element leaves one with that value.
50241
- * `helix-data-table` draws the cells, so it leaves out the ones under a hidden
50242
- * column. A `helix-table`'s cells are markup the consumer wrote, so hide them
50243
- * with the column, as removing a column means removing its cells: a row with a
50244
- * cell more than the table has tracks wraps into the next.
50228
+ * `DataTable` draws the cells, so it leaves out the ones under a hidden column.
50229
+ * A `Table`'s cells are markup the consumer wrote, so hide them with the
50230
+ * column, as removing a column means removing its cells: a row with a cell more
50231
+ * than the table has tracks wraps into the next.
50245
50232
  *
50246
50233
  * **A heading that does something holds a control that does it.** The host is
50247
50234
  * the column header, and a header is not focusable, so a sortable heading is a
@@ -50257,15 +50244,15 @@ export type CustomElementsSolidJs = {
50257
50244
  *
50258
50245
  * - `align`: Which edge the values line up against.
50259
50246
  *
50260
- * `end` is what a column of numbers wants, so digits of the same magnitude sit
50261
- * above each other. Left unset the cell inherits the table's own alignment,
50262
- * which is `start` for text in either writing direction. `helix-data-table`
50263
- * aligns the cells it draws. A `helix-table`'s cells are markup the consumer
50264
- * wrote, so the table writes nothing onto them: it publishes the edge to each
50265
- * cell under this column as `--table-cell-align`, which `@fusion.dev/helix`
50266
- * reads. The heading is this element's own, and `@fusion.dev/helix` sets it to
50267
- * the same edge in either table. `end` is the inline end, so in a
50268
- * right-to-left table it is the left.
50247
+ * `end` is what a column of numbers wants, so digits of the same magnitude
50248
+ * sit above each other. Left unset the cell inherits the table's own
50249
+ * alignment, which is `start` for text in either writing direction.
50250
+ * `DataTable` aligns the cells it draws. A `Table`'s cells are markup the
50251
+ * consumer wrote, so the table writes nothing onto them: it publishes the
50252
+ * edge to each cell under this column as `--table-cell-align`, which
50253
+ * `@fusion.dev/helix` reads. The heading is this element's own, and
50254
+ * `@fusion.dev/helix` sets it to the same edge in either table. `end` is the
50255
+ * inline end, so in a right-to-left table it is the left.
50269
50256
  *
50270
50257
  * **Reflected, because the heading is drawn by a stylesheet and has no other
50271
50258
  * way to learn it.** Set as a property, which is how React sets it, an
@@ -50308,8 +50295,8 @@ export type CustomElementsSolidJs = {
50308
50295
  * - `width`: The track this column takes, as CSS.
50309
50296
  *
50310
50297
  * A single track value, so anything valid in `grid-template-columns` works:
50311
- * `16rem`, `auto`, `minmax(0, 2fr)`. Left unset the column takes the track
50312
- * in its place in a `helix-table`'s `columns`, where that table sets one, and
50298
+ * `16rem`, `auto`, `minmax(0, 2fr)`. Left unset the column takes the track in
50299
+ * its place in a `Table`'s `columns`, where that table sets one, and
50313
50300
  * otherwise shares what is left over equally, as `minmax(max-content, 1fr)`.
50314
50301
  * Set here, it wins over that list, which is what lets a reader resize a
50315
50302
  * column in a table that set one.
@@ -50435,15 +50422,14 @@ export type CustomElementsSolidJs = {
50435
50422
  *
50436
50423
  * - `columns`: The column widths as one track list, written once on the table.
50437
50424
  *
50438
- * With `helix-table-column` children, each track sizes the column in its
50439
- * place, a hidden column counted, so hiding one takes its track with it and
50440
- * the rest keep theirs. The columns decide how many tracks there are and this
50441
- * list only how wide: a track past the last column is dropped, and a column
50442
- * past the last track shares what is left. With no columns declared it is
50443
- * the whole track list. Tracks count as the grid counts them, so
50444
- * `minmax(0, 1fr)` is one and `repeat(2, 8rem)` is two, and one the grid
50445
- * would refuse leaves its column at the default rather than taking the table
50446
- * down to one column.
50425
+ * With `TableColumn` children, each track sizes the column in its place, a
50426
+ * hidden column counted, so hiding one takes its track with it and the rest
50427
+ * keep theirs. The columns decide how many tracks there are and this list
50428
+ * only how wide: a track past the last column is dropped, and a column past
50429
+ * the last track shares what is left. With no columns declared it is the
50430
+ * whole track list. Tracks count as the grid counts them, so `minmax(0, 1fr)`
50431
+ * is one and `repeat(2, 8rem)` is two, and one the grid would refuse leaves
50432
+ * its column at the default rather than taking the table down to one column.
50447
50433
  *
50448
50434
  * **A column's own `width` wins over its track here.** The width is written
50449
50435
  * on the column it sizes, which is the more particular statement, and it is
@@ -50457,13 +50443,11 @@ export type CustomElementsSolidJs = {
50457
50443
  * whole answer: a table given one lays its grid out in the first paint, and a
50458
50444
  * table sized only by its columns is one track wide until it upgrades.
50459
50445
  *
50460
- * **`helix-data-table` has none of this, and should not.** Its columns are
50461
- * its schema rather than an option, so there is always a column to write a
50462
- * `width` on and a list here would be a second way to say what that says.
50463
- * This table's cells are markup, and a table written as rows of cells with no
50464
- * `helix-table-column` in it has nowhere else to be sized from. Both families
50465
- * take the same CSS hook, `--table-columns` and `--data-table-columns`, which
50466
- * wins over whichever list the element worked out.
50446
+ * **Data Table has none of this, and should not.** Its columns are its schema
50447
+ * rather than an option, so there is always a column to write a `width` on
50448
+ * and a list here would be a second way to say what that says. This table's
50449
+ * cells are markup, and a table written as rows of cells with no column
50450
+ * declared in it has nowhere else to be sized from.
50467
50451
  * - `label`: Accessible name for the table.
50468
50452
  * - `empty-text`/`emptyText`: What is said where there are none, and none are coming.
50469
50453
  * - `loading`: Whether the rows are still on their way.
@@ -50504,7 +50488,7 @@ export type CustomElementsSolidJs = {
50504
50488
  *
50505
50489
  * CSS variables available for styling the component.
50506
50490
  *
50507
- * - `--table-template`: The column track list this element worked out from the columns declared in it. Written by the component, read by the sheet that paints: a stylesheet takes it to lay the grid out, and setting it does nothing, because the component writes it inline on the very element that reads it and an inline declaration beats any sheet. `--table-columns` is the one to set. (default: `undefined`)
50491
+ * - `--table-template`: The column track list this element worked out from the columns declared in it. Written by the component, read by the sheet that paints: a stylesheet takes it to lay the grid out, and setting it does nothing, because the component writes it inline on the very element that reads it and an inline declaration beats any sheet. `columns` is the one to set. (default: `undefined`)
50508
50492
  *
50509
50493
  * ## CSS Parts
50510
50494
  *
@@ -50529,10 +50513,10 @@ export type CustomElementsSolidJs = {
50529
50513
  >;
50530
50514
 
50531
50515
  /**
50532
- * `display: contents` in the styled tier, so the row's cells become items of
50533
- * the table's own grid and every column lines up across every row. The row
50534
- * still exists as an element, which is what a `<table>` gives away when its
50535
- * cells are laid out by the table algorithm.
50516
+ * The row renders its cells straight through and lays out none of them, so a
50517
+ * sheet can take them into the table's own grid and every column lines up
50518
+ * across every row. The row still exists as an element, which is what a
50519
+ * `<table>` gives away when its cells are laid out by the table algorithm.
50536
50520
  *
50537
50521
  * ## Attributes & Properties
50538
50522
  *
@@ -51151,10 +51135,10 @@ export type CustomElementsSolidJs = {
51151
51135
  >;
51152
51136
 
51153
51137
  /**
51154
- * **The list is `helix-time-picker`, not a second one written here.** It is worth
51138
+ * **The list is `TimePicker`, not a second one written here.** It is worth
51155
51139
  * having on its own, flat in a settings pane with nothing to open, and this
51156
51140
  * element is the field, the overlay and the form. Exactly the arrangement Input
51157
- * Date has with `helix-date-picker` and Color Input with `helix-color-picker`.
51141
+ * Date has with `DatePicker` and Color Input with `ColorPicker`.
51158
51142
  *
51159
51143
  * **Typed as well as picked, and that is the division the list depends on.** A
51160
51144
  * list at a step offers the times a product actually has, and the field is how a
@@ -51185,8 +51169,8 @@ export type CustomElementsSolidJs = {
51185
51169
  *
51186
51170
  * Absent is one. `range` holds a start and an end, `multiple` holds any
51187
51171
  * number, and both are carried as one comma-separated value, which is what a
51188
- * form submits. `helix-time-picker` carries the longer note on the interaction and on
51189
- * why a wheel cannot do either.
51172
+ * form submits. `TimePicker` carries the longer note on the interaction and
51173
+ * on why a wheel cannot do either.
51190
51174
  * - `placeholder`: What the field says before a time is in it.
51191
51175
  * - `step`: How far apart the offered times are, in minutes.
51192
51176
  * - `time-style`/`timeStyle`: Whether the field writes the time out, or holds the value as it is.
@@ -51201,7 +51185,7 @@ export type CustomElementsSolidJs = {
51201
51185
  * `list` offers whole times, which is what a product with slots or opening
51202
51186
  * hours has. `wheels` splits them into an hour, a minute and a meridiem where
51203
51187
  * the locale uses one, which is the only way to reach `23:45` without
51204
- * scrolling most of a day. `helix-time-picker` carries the longer note on the trade.
51188
+ * scrolling most of a day. `TimePicker` carries the longer note on the trade.
51205
51189
  *
51206
51190
  * **Optional rather than defaulted, which is not a style preference.** A
51207
51191
  * reflecting property with a default writes its attribute onto every host the
@@ -51448,8 +51432,8 @@ export type CustomElementsSolidJs = {
51448
51432
 
51449
51433
  /**
51450
51434
  * **A list rather than three wheels**, and the reason is what a list already
51451
- * is. `helix-listbox` brings the keyboard, the typeahead, the scroll into view
51452
- * and the announcement of a set of options, and a time at a step is a set of
51435
+ * is. `Listbox` brings the keyboard, the typeahead, the scroll into view and
51436
+ * the announcement of a set of options, and a time at a step is a set of
51453
51437
  * options. Three little wheels for hours, minutes and a meridiem are three
51454
51438
  * controls to build, three to test, and a tab stop each for something a reader
51455
51439
  * answers once.
@@ -51510,7 +51494,7 @@ export type CustomElementsSolidJs = {
51510
51494
  *
51511
51495
  * Absent is one. `range` holds a start and an end with everything between
51512
51496
  * them shown as part of the answer, `multiple` holds any number, and both are
51513
- * carried as one comma-separated value: the same shape `helix-date-picker` uses,
51497
+ * carried as one comma-separated value: the same shape `DatePicker` uses,
51514
51498
  * because it is the same question asked of a different unit.
51515
51499
  *
51516
51500
  * **A range is two picks, and a third starts over.** That is the calendar's
@@ -52067,7 +52051,7 @@ export type CustomElementsSolidJs = {
52067
52051
  * **Optional, and bottom-end is the absence of it.** Reflecting *and*
52068
52052
  * defaulting is the pair that writes onto a host: every toast region anybody
52069
52053
  * rendered would gain a `placement="bottom-end"` nobody typed, which a React
52070
- * consumer's server markup does not have. The styled sheet carries the resting
52054
+ * consumer's server markup does not have. A sheet carries the resting
52071
52055
  * arrangement in its own `:host` rule and the selectors describe only the
52072
52056
  * departures, which is what `orientation` does.
52073
52057
  * - `whenSettled`: Resolves a frame after the first update, when transitions are switched on.
@@ -52101,7 +52085,7 @@ export type CustomElementsSolidJs = {
52101
52085
  *
52102
52086
  * Areas where markup can be added to the component.
52103
52087
  *
52104
- * - `(default)`: The messages, as `helix-toast-item` elements.
52088
+ * - `(default)`: The messages.
52105
52089
  *
52106
52090
  * ## CSS Parts
52107
52091
  *
@@ -52335,11 +52319,11 @@ export type CustomElementsSolidJs = {
52335
52319
  * **The attribute, read when it is asked for, and never a snapshot taken in
52336
52320
  * the constructor.** A field initializer runs there, and an element the HTML
52337
52321
  * parser created has none of its attributes yet at that moment: measured on
52338
- * this element, on `Option` and on `Radio`, `<helix-toggle value="light"
52339
- * selected>` reported `defaultSelected` as `false` both from parsed markup
52340
- * and from `createElement` followed by `setAttribute`, which is every way a
52341
- * consumer writes one. The snapshot could only ever be true for an element
52342
- * already in the document when `customElements.define` ran.
52322
+ * this element, on `Option` and on `Radio`, `<helix-headless-toggle
52323
+ * value="light" selected>` reported `defaultSelected` as `false` both from
52324
+ * parsed markup and from `createElement` followed by `setAttribute`, which is
52325
+ * every way a consumer writes one. The snapshot could only ever be true for
52326
+ * an element already in the document when `customElements.define` ran.
52343
52327
  *
52344
52328
  * Nothing overwrites it either, which is what makes reading it late correct
52345
52329
  * rather than merely later: `selected` does not reflect, for the reason
@@ -52501,8 +52485,8 @@ export type CustomElementsSolidJs = {
52501
52485
  * the ordinary way:
52502
52486
  *
52503
52487
  * ```html
52504
- * <helix-button id="save" aria-describedby="save-tip">Save</helix-button>
52505
- * <helix-tooltip id="save-tip" for="save" content="Save your work"></helix-tooltip>
52488
+ * <helix-headless-button id="save" aria-describedby="save-tip">Save</helix-headless-button>
52489
+ * <helix-headless-tooltip id="save-tip" for="save" content="Save your work"></helix-headless-tooltip>
52506
52490
  * ```
52507
52491
  *
52508
52492
  * The reference points at *this host*, not at the bubble in its shadow root:
@@ -52817,9 +52801,9 @@ export type CustomElementsSolidJs = {
52817
52801
  * - **When it shows.** Which is `current`, and which the root decides.
52818
52802
  *
52819
52803
  * What it does not own is the heading, the paragraph, the picture and the
52820
- * layout. Slot a `helix-card`, or a heading and a line of prose, or anything
52821
- * else. Fixed `title` and `body` parts would be a component deciding what a
52822
- * tour is allowed to say.
52804
+ * layout. Slot a `Card`, or a heading and a line of prose, or anything else.
52805
+ * Fixed `title` and `body` parts would be a component deciding what a tour is
52806
+ * allowed to say.
52823
52807
  *
52824
52808
  * **The buttons are slot fallback, so the common case costs nothing and the
52825
52809
  * uncommon one is possible.** Write nothing and get Back, Next and Skip already
@@ -53580,7 +53564,7 @@ export type CustomElementsSolidJs = {
53580
53564
  * Areas where markup can be added to the component.
53581
53565
  *
53582
53566
  * - `(default)`: The entries.
53583
- * - `player`: The `helix-video` they play in.
53567
+ * - `player`: The player the entries take turns in.
53584
53568
  *
53585
53569
  * ## Methods
53586
53570
  *
@@ -53997,7 +53981,7 @@ export type CustomElementsSolidJs = {
53997
53981
  export type CustomCssProperties = {
53998
53982
  /** How wide an axis column is drawn, in `ch`, from the widest number on it. Written on the axis itself, and only where the categories run along the bottom: turned sideways an axis is a row and takes a line's height instead. */
53999
53983
  "--bar-chart-axis"?: (string) | undefined;
54000
- /** The color of the secondary axis when one series owns it. It resolves a `--helix-color-series-*` token, so on the headless tier alone it names something that is not there. #138. */
53984
+ /** The color of the secondary axis, where one series owns it. Written by the component from that series' `--chart-series-*`, so it promises the series color and nothing more: whatever that hook resolves to is what the axis is drawn in. */
54001
53985
  "--bar-chart-secondary"?: (string) | undefined;
54002
53986
  /** The gradient a bar would take, named per bar so the styled tier can point `fill` at it. Drawn whatever the treatment and used only where `wash="gradient"` asks for it. */
54003
53987
  "--chart-bar-wash"?: (string) | undefined;
@@ -54021,24 +54005,14 @@ export type CustomCssProperties = {
54021
54005
  "--color-picker-saturation"?: (string) | undefined;
54022
54006
  /** A color to paint: the current one on the sample, a preset's on each preset. */
54023
54007
  "--color-picker-swatch"?: (string) | undefined;
54024
- /** The edge the column a cell sits under is set to, `start`, `center` or `end`, and unset under a column that sets none. Written by the component onto each cell it draws, read by the sheet that paints one; `helix-table` publishes `--table-cell-align` for the same attribute on the cells a consumer wrote, under its own family's name. */
54008
+ /** The edge the column a cell sits under is set to, `start`, `center` or `end`, and unset under a column that sets none. Written by the component onto each cell it draws, read by the sheet that paints one; Table publishes `--table-cell-align` for the same attribute on the cells a consumer wrote, under its own family's name. */
54025
54009
  "--data-table-cell-align"?: (string) | undefined;
54026
- /** The column track list this element worked out from the columns declared in it. Written by the component, read by the sheet that paints: a stylesheet takes it to lay the grid out, and setting it does nothing, because the component writes it inline on the very element that reads it and an inline declaration beats any sheet. `--data-table-columns` is the one to set. */
54010
+ /** The column track list this element worked out from the columns declared in it. Written by the component, read by the sheet that paints: a stylesheet takes it to lay the grid out, and setting it does nothing, because the component writes it inline on the very element that reads it and an inline declaration beats any sheet. A column's `width` is the one to set. */
54027
54011
  "--data-table-template"?: (string) | undefined;
54028
54012
  /** How many month columns are drawn, capped at two. `--date-picker-columns` overrides it. */
54029
54013
  "--date-picker-column-count"?: (string) | undefined;
54030
54014
  /** How thick the ring is drawn, derived from `hole`. */
54031
54015
  "--donut-chart-stroke"?: (string) | undefined;
54032
- /** How tall a cell is. A row of a tall thin cell is what a status page draws. */
54033
- "--heatmap-cell-height"?: (string) | undefined;
54034
- /** How wide a cell is. The strip fits as many as the container allows. */
54035
- "--heatmap-cell-inline-size"?: (string) | undefined;
54036
- /** How far a cell's corners are rounded. */
54037
- "--heatmap-cell-radius"?: (string) | undefined;
54038
- /** The size a cell wants on both axes, where neither is given its own. */
54039
- "--heatmap-cell-size"?: (string) | undefined;
54040
- /** Space between cells. Zero is a continuous field rather than a grid of tiles. */
54041
- "--heatmap-gap"?: (string) | undefined;
54042
54016
  /** How many rows the strip lays out. Written by the component from the data, read by the tier that draws it. */
54043
54017
  "--heatmap-rows"?: (string) | undefined;
54044
54018
  /** The tone of the cell this is set on. Written by the component, read by the sheet that paints. */
@@ -54113,7 +54087,7 @@ export type CustomCssProperties = {
54113
54087
  "--splitter-position"?: (string) | undefined;
54114
54088
  /** The edge the column this cell sits under is set to, `start`, `center` or `end`, and unset under a column that sets none. Written by the table around it, since the cell is the consumer's markup and nothing is written onto it; read by the sheet that draws the cell, where `justify-content` and `text-align` both take it as it comes and both follow the writing direction. */
54115
54089
  "--table-cell-align"?: (string) | undefined;
54116
- /** The column track list this element worked out from the columns declared in it. Written by the component, read by the sheet that paints: a stylesheet takes it to lay the grid out, and setting it does nothing, because the component writes it inline on the very element that reads it and an inline declaration beats any sheet. `--table-columns` is the one to set. */
54090
+ /** The column track list this element worked out from the columns declared in it. Written by the component, read by the sheet that paints: a stylesheet takes it to lay the grid out, and setting it does nothing, because the component writes it inline on the very element that reads it and an inline declaration beats any sheet. `columns` is the one to set. */
54117
54091
  "--table-template"?: (string) | undefined;
54118
54092
  /** How long this message stays, in milliseconds, for a progress hint. */
54119
54093
  "--toast-duration"?: (string) | undefined;