@fusion.dev/helix-headless 0.172.0 → 0.174.0

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 (41) hide show
  1. package/custom-elements.json +912 -60
  2. package/dist/button-group/root/button-group-root.d.ts +30 -0
  3. package/dist/button-group/root/button-group-root.js +50 -4
  4. package/dist/canvas/root/canvas-root.d.ts +7 -0
  5. package/dist/canvas/root/canvas-root.js +7 -0
  6. package/dist/copy-button/root/copy-button-root.d.ts +43 -3
  7. package/dist/copy-button/root/copy-button-root.js +49 -3
  8. package/dist/element-events.generated.js +2 -0
  9. package/dist/graph/root/graph-root.d.ts +22 -0
  10. package/dist/graph/root/graph-root.js +21 -5
  11. package/dist/list/root/list-root.d.ts +6 -1
  12. package/dist/list/root/list-root.js +3 -2
  13. package/dist/outline/root/outline-root.d.ts +57 -0
  14. package/dist/outline/root/outline-root.js +98 -29
  15. package/dist/speed-dial/root/speed-dial-root.d.ts +14 -0
  16. package/dist/speed-dial/root/speed-dial-root.js +34 -2
  17. package/dist/splitter/root/splitter-root.d.ts +25 -2
  18. package/dist/splitter/root/splitter-root.js +19 -4
  19. package/dist/tag/group/tag-group.d.ts +8 -1
  20. package/dist/tag/group/tag-group.js +8 -0
  21. package/dist/tag/root/tag-root.d.ts +12 -0
  22. package/dist/tag/root/tag-root.js +12 -0
  23. package/dist/time-picker/root/time-picker-root.d.ts +14 -0
  24. package/dist/time-picker/root/time-picker-root.js +8 -1
  25. package/dist/timeline/item/timeline-item.d.ts +5 -1
  26. package/dist/timeline/item/timeline-item.js +9 -0
  27. package/dist/timeline/root/timeline-root.d.ts +23 -0
  28. package/dist/timeline/root/timeline-root.js +17 -3
  29. package/dist/tooltip/root/tooltip-root.d.ts +10 -0
  30. package/dist/tooltip/root/tooltip-root.js +14 -2
  31. package/dist/virtual-list/reorder/index.d.ts +1 -0
  32. package/dist/virtual-list/reorder/index.js +4 -0
  33. package/dist/virtual-list/reorder/virtual-list-reorder.d.ts +86 -0
  34. package/dist/virtual-list/reorder/virtual-list-reorder.js +193 -0
  35. package/dist/virtual-list/root/virtual-list-root.d.ts +49 -11
  36. package/dist/virtual-list/root/virtual-list-root.js +10 -1
  37. package/lint.json +1 -1
  38. package/package.json +5 -5
  39. package/types/jsx.d.ts +568 -18
  40. package/types/vue.d.ts +115 -11
  41. package/types/words.d.ts +14 -0
package/types/jsx.d.ts CHANGED
@@ -2410,6 +2410,9 @@ export type HelixHeadlessButtonGroupHelixBeforeChangeElementEvent =
2410
2410
  HelixHeadlessButtonGroupElementEvent<HelixBeforeChangeEvent>;
2411
2411
 
2412
2412
  export type HelixHeadlessButtonGroupProps = {
2413
+ /** Disables every button in the group, and says so on the group with
2414
+ `aria-disabled`. Reflected, so a stylesheet can select on it. */
2415
+ disabled?: (HelixHeadlessButtonGroup["disabled"]) | undefined;
2413
2416
  /** Keeps at least one button pressed once one is, as React Aria's
2414
2417
  `disallowEmptySelection`: a press that would leave none pressed is
2415
2418
  refused. */
@@ -2459,6 +2462,9 @@ A button's own `value` names it, so a value holds no comma.
2459
2462
  The attribute is the seed, and a press changes the property, which does
2460
2463
  not reflect, as a native control's `value` does not. */
2461
2464
  value?: (HelixHeadlessButtonGroup["value"]) | undefined;
2465
+ /** The pressed values as a list, in a selection mode, and an empty list
2466
+ otherwise. Written, it presses exactly those buttons. */
2467
+ values?: (HelixHeadlessButtonGroup["values"]) | undefined;
2462
2468
 
2463
2469
  /** Fired after a press changes `value`, in a selection mode. */
2464
2470
  onchange?: ((e: HelixHeadlessButtonGroupElementEvent) => void) | undefined;
@@ -2469,6 +2475,9 @@ not reflect, as a native control's `value` does not. */
2469
2475
  };
2470
2476
 
2471
2477
  export type HelixHeadlessButtonGroupSolidJsProps = {
2478
+ /** Disables every button in the group, and says so on the group with
2479
+ `aria-disabled`. Reflected, so a stylesheet can select on it. */
2480
+ "prop:disabled"?: (HelixHeadlessButtonGroup["disabled"]) | undefined;
2472
2481
  /** Keeps at least one button pressed once one is, as React Aria's
2473
2482
  `disallowEmptySelection`: a press that would leave none pressed is
2474
2483
  refused. */
@@ -2518,6 +2527,9 @@ A button's own `value` names it, so a value holds no comma.
2518
2527
  The attribute is the seed, and a press changes the property, which does
2519
2528
  not reflect, as a native control's `value` does not. */
2520
2529
  "prop:value"?: (HelixHeadlessButtonGroup["value"]) | undefined;
2530
+ /** The pressed values as a list, in a selection mode, and an empty list
2531
+ otherwise. Written, it presses exactly those buttons. */
2532
+ "prop:values"?: (HelixHeadlessButtonGroup["values"]) | undefined;
2521
2533
  /** Fired after a press changes `value`, in a selection mode. */
2522
2534
  "on:change"?: ((e: HelixHeadlessButtonGroupElementEvent) => void) | undefined;
2523
2535
  /** Fired before a press changes `value`, with the value it would leave in `detail.value`. Cancelable: call `preventDefault()` to keep the buttons as they are. */
@@ -3468,6 +3480,9 @@ Third", rather than with a comma this component chose. */
3468
3480
  /** The text read with a card that has connections both ways. `{leadsTo}` is
3469
3481
  `leads-to-label` and `{comesFrom}` is `comes-from-label`, each filled in. */
3470
3482
  linkedLabel?: (HelixHeadlessCanvas["linkedLabel"]) | undefined;
3483
+ /** Marks the board as busy while its document arrives: the board is
3484
+ `aria-busy`, and the `loading` slot is shown. */
3485
+ loading?: (HelixHeadlessCanvas["loading"]) | undefined;
3471
3486
  /** What screen readers hear after a key moves a card, with `{name}` for the
3472
3487
  card and `{x}` and `{y}` for where it now is, in the document's units.
3473
3488
 
@@ -3945,6 +3960,9 @@ Third", rather than with a comma this component chose. */
3945
3960
  /** The text read with a card that has connections both ways. `{leadsTo}` is
3946
3961
  `leads-to-label` and `{comesFrom}` is `comes-from-label`, each filled in. */
3947
3962
  "prop:linkedLabel"?: (HelixHeadlessCanvas["linkedLabel"]) | undefined;
3963
+ /** Marks the board as busy while its document arrives: the board is
3964
+ `aria-busy`, and the `loading` slot is shown. */
3965
+ "prop:loading"?: (HelixHeadlessCanvas["loading"]) | undefined;
3948
3966
  /** What screen readers hear after a key moves a card, with `{name}` for the
3949
3967
  card and `{x}` and `{y}` for where it now is, in the document's units.
3950
3968
 
@@ -9098,6 +9116,24 @@ Defaulted rather than left empty. An icon-only control must be named, and
9098
9116
  the name of this one is not a judgment call: every copy button in the
9099
9117
  world is called Copy. A consumer with a better word still sets it. */
9100
9118
  label?: (HelixHeadlessCopyButton["label"]) | undefined;
9119
+ /** Draws the name as words beside the icon, and the result in their place
9120
+ after a press. The button stays as wide as the longest of them. */
9121
+ "show-label"?: (HelixHeadlessCopyButton["showLabel"]) | undefined;
9122
+ /** Draws the name as words beside the icon, and the result in their place
9123
+ after a press. The button stays as wide as the longest of them. */
9124
+ showLabel?: (HelixHeadlessCopyButton["showLabel"]) | undefined;
9125
+ /** When the tooltip shows: `full` on hover and focus and after a press,
9126
+ `copy` only after a press, to show the result, and `none` never, for a
9127
+ button whose result shows another way, such as under `show-label`.
9128
+
9129
+ Unset is `full`, and the attribute stays absent until you write it. */
9130
+ tooltip?: (HelixHeadlessCopyButton["tooltip"]) | undefined;
9131
+ /** The side the tooltip prefers. It moves to another side where this one
9132
+ does not fit. */
9133
+ "tooltip-placement"?: (HelixHeadlessCopyButton["tooltipPlacement"]) | undefined;
9134
+ /** The side the tooltip prefers. It moves to another side where this one
9135
+ does not fit. */
9136
+ tooltipPlacement?: (HelixHeadlessCopyButton["tooltipPlacement"]) | undefined;
9101
9137
  /** The text copied to the clipboard.
9102
9138
 
9103
9139
  It replaces `Button.value`, the submit value: a copy button never submits,
@@ -9213,6 +9249,24 @@ Defaulted rather than left empty. An icon-only control must be named, and
9213
9249
  the name of this one is not a judgment call: every copy button in the
9214
9250
  world is called Copy. A consumer with a better word still sets it. */
9215
9251
  "prop:label"?: (HelixHeadlessCopyButton["label"]) | undefined;
9252
+ /** Draws the name as words beside the icon, and the result in their place
9253
+ after a press. The button stays as wide as the longest of them. */
9254
+ "bool:show-label"?: (HelixHeadlessCopyButton["showLabel"]) | undefined;
9255
+ /** Draws the name as words beside the icon, and the result in their place
9256
+ after a press. The button stays as wide as the longest of them. */
9257
+ "prop:showLabel"?: (HelixHeadlessCopyButton["showLabel"]) | undefined;
9258
+ /** When the tooltip shows: `full` on hover and focus and after a press,
9259
+ `copy` only after a press, to show the result, and `none` never, for a
9260
+ button whose result shows another way, such as under `show-label`.
9261
+
9262
+ Unset is `full`, and the attribute stays absent until you write it. */
9263
+ "prop:tooltip"?: (HelixHeadlessCopyButton["tooltip"]) | undefined;
9264
+ /** The side the tooltip prefers. It moves to another side where this one
9265
+ does not fit. */
9266
+ "attr:tooltip-placement"?: (HelixHeadlessCopyButton["tooltipPlacement"]) | undefined;
9267
+ /** The side the tooltip prefers. It moves to another side where this one
9268
+ does not fit. */
9269
+ "prop:tooltipPlacement"?: (HelixHeadlessCopyButton["tooltipPlacement"]) | undefined;
9216
9270
  /** The text copied to the clipboard.
9217
9271
 
9218
9272
  It replaces `Button.value`, the submit value: a copy button never submits,
@@ -14801,6 +14855,13 @@ or hides its notes. Drawn where the notes have two groups or more. */
14801
14855
  "links-to-label"?: (HelixHeadlessGraph["linksToLabel"]) | undefined;
14802
14856
  /** How a note that links to the selected one is described, with `{note}`. */
14803
14857
  linksToLabel?: (HelixHeadlessGraph["linksToLabel"]) | undefined;
14858
+ /** Marks the graph as busy while its notes arrive: the list is `aria-busy`,
14859
+ and the panel says so where it holds no notes yet. */
14860
+ loading?: (HelixHeadlessGraph["loading"]) | undefined;
14861
+ /** What the panel says while `loading` is set and the list holds no notes. */
14862
+ "loading-label"?: (HelixHeadlessGraph["loadingLabel"]) | undefined;
14863
+ /** What the panel says while `loading` is set and the list holds no notes. */
14864
+ loadingLabel?: (HelixHeadlessGraph["loadingLabel"]) | undefined;
14804
14865
  /** What screen readers hear once the drawing has moved down, after `moved()`. */
14805
14866
  "moved-down-label"?: (HelixHeadlessGraph["movedDownLabel"]) | undefined;
14806
14867
  /** What screen readers hear once the drawing has moved down, after `moved()`. */
@@ -15022,6 +15083,16 @@ Ignored once `active` is written. */
15022
15083
  links?: (HelixHeadlessGraph["links"]) | undefined;
15023
15084
  /** The notes. A property, never an attribute. */
15024
15085
  nodes?: (HelixHeadlessGraph["nodes"]) | undefined;
15086
+ /** What each note's row in the list shows in place of its name: a function
15087
+ given the note that returns text, an element or a Lit template.
15088
+
15089
+ For an icon by its kind, or a date under its name, as React Aria's
15090
+ `ListBoxItem` takes children. The row is still named by the note's name,
15091
+ which typeahead and the search find it by, and described by how it stands
15092
+ to the selected note. Return the name with your content where it should
15093
+ still show. A property only, there being no way to write a function in
15094
+ markup. */
15095
+ noteContent?: (HelixHeadlessGraph["noteContent"]) | undefined;
15025
15096
 
15026
15097
  /** A note was selected, in the list or in the drawing. The detail's `value` is its `id`. */
15027
15098
  "onhelix-activate"?: ((e: HelixHeadlessGraphHelixActivateElementEvent) => void) | undefined;
@@ -15115,6 +15186,13 @@ or hides its notes. Drawn where the notes have two groups or more. */
15115
15186
  "attr:links-to-label"?: (HelixHeadlessGraph["linksToLabel"]) | undefined;
15116
15187
  /** How a note that links to the selected one is described, with `{note}`. */
15117
15188
  "prop:linksToLabel"?: (HelixHeadlessGraph["linksToLabel"]) | undefined;
15189
+ /** Marks the graph as busy while its notes arrive: the list is `aria-busy`,
15190
+ and the panel says so where it holds no notes yet. */
15191
+ "prop:loading"?: (HelixHeadlessGraph["loading"]) | undefined;
15192
+ /** What the panel says while `loading` is set and the list holds no notes. */
15193
+ "attr:loading-label"?: (HelixHeadlessGraph["loadingLabel"]) | undefined;
15194
+ /** What the panel says while `loading` is set and the list holds no notes. */
15195
+ "prop:loadingLabel"?: (HelixHeadlessGraph["loadingLabel"]) | undefined;
15118
15196
  /** What screen readers hear once the drawing has moved down, after `moved()`. */
15119
15197
  "attr:moved-down-label"?: (HelixHeadlessGraph["movedDownLabel"]) | undefined;
15120
15198
  /** What screen readers hear once the drawing has moved down, after `moved()`. */
@@ -15336,6 +15414,16 @@ Ignored once `active` is written. */
15336
15414
  "prop:links"?: (HelixHeadlessGraph["links"]) | undefined;
15337
15415
  /** The notes. A property, never an attribute. */
15338
15416
  "prop:nodes"?: (HelixHeadlessGraph["nodes"]) | undefined;
15417
+ /** What each note's row in the list shows in place of its name: a function
15418
+ given the note that returns text, an element or a Lit template.
15419
+
15420
+ For an icon by its kind, or a date under its name, as React Aria's
15421
+ `ListBoxItem` takes children. The row is still named by the note's name,
15422
+ which typeahead and the search find it by, and described by how it stands
15423
+ to the selected note. Return the name with your content where it should
15424
+ still show. A property only, there being no way to write a function in
15425
+ markup. */
15426
+ "prop:noteContent"?: (HelixHeadlessGraph["noteContent"]) | undefined;
15339
15427
  /** A note was selected, in the list or in the drawing. The detail's `value` is its `id`. */
15340
15428
  "on:helix-activate"?: ((
15341
15429
  e: HelixHeadlessGraphHelixActivateElementEvent,
@@ -18390,7 +18478,8 @@ itself. */
18390
18478
  type?: (HelixHeadlessList["type"]) | undefined;
18391
18479
  /** The selected rows' values, separated by commas with no spaces, such as `a,c`, in a list that selects.
18392
18480
 
18393
- Set it to start with rows selected. A row's value is its `value`, or its
18481
+ A press or a key writes it in row order, as Data Table does, whatever
18482
+ order the rows were chosen in. Set it to start with rows selected. A row's value is its `value`, or its
18394
18483
  words where it has none. */
18395
18484
  value?: (HelixHeadlessList["value"]) | undefined;
18396
18485
 
@@ -18536,7 +18625,8 @@ itself. */
18536
18625
  "prop:type"?: (HelixHeadlessList["type"]) | undefined;
18537
18626
  /** The selected rows' values, separated by commas with no spaces, such as `a,c`, in a list that selects.
18538
18627
 
18539
- Set it to start with rows selected. A row's value is its `value`, or its
18628
+ A press or a key writes it in row order, as Data Table does, whatever
18629
+ order the rows were chosen in. Set it to start with rows selected. A row's value is its `value`, or its
18540
18630
  words where it has none. */
18541
18631
  "prop:value"?: (HelixHeadlessList["value"]) | undefined;
18542
18632
  /** Fired once a press has changed which rows are selected. */
@@ -23741,6 +23831,10 @@ box the sections scroll in. */
23741
23831
  /** The navigation's name, read by screen readers. A heading in the `heading`
23742
23832
  slot names it in place of this. */
23743
23833
  label?: (HelixHeadlessOutline["label"]) | undefined;
23834
+ /** Which links are marked. `reading` marks the one section being read, the
23835
+ last whose heading has passed the reading line. `visible` marks every
23836
+ section with part of it on screen, and the mark runs across their links. */
23837
+ marks?: (HelixHeadlessOutline["marks"]) | undefined;
23744
23838
  /** How far below the top of the scroll container a heading counts as reached,
23745
23839
  in pixels. The scroll container is the window or the panel the sections
23746
23840
  scroll in.
@@ -23785,6 +23879,10 @@ box the sections scroll in. */
23785
23879
  /** The navigation's name, read by screen readers. A heading in the `heading`
23786
23880
  slot names it in place of this. */
23787
23881
  "prop:label"?: (HelixHeadlessOutline["label"]) | undefined;
23882
+ /** Which links are marked. `reading` marks the one section being read, the
23883
+ last whose heading has passed the reading line. `visible` marks every
23884
+ section with part of it on screen, and the mark runs across their links. */
23885
+ "prop:marks"?: (HelixHeadlessOutline["marks"]) | undefined;
23788
23886
  /** How far below the top of the scroll container a heading counts as reached,
23789
23887
  in pixels. The scroll container is the window or the panel the sections
23790
23888
  scroll in.
@@ -28258,6 +28356,13 @@ that should survive its own collapse says how much of itself to keep, and
28258
28356
  only whoever put it there knows that, which is the same reason `min` is a
28259
28357
  consumer's to set. */
28260
28358
  collapsedSize?: (HelixHeadlessSplitter["collapsedSize"]) | undefined;
28359
+ /** Which panes can be collapsed, as Zag's panels each take `collapsible`:
28360
+ `start`, `end`, `both`, or `none`. A pane that cannot be collapsed stops
28361
+ at the edge without shutting. `Enter` collapses the end pane where only
28362
+ the end pane can be collapsed, and the start pane otherwise.
28363
+
28364
+ Unset is `both`, and the attribute stays absent until you write it. */
28365
+ collapsible?: (HelixHeadlessSplitter["collapsible"]) | undefined;
28261
28366
  /** The name of the handle where two dividers cross, read by screen readers. */
28262
28367
  "corner-label"?: (HelixHeadlessSplitter["cornerLabel"]) | undefined;
28263
28368
  /** The name of the handle where two dividers cross, read by screen readers. */
@@ -28286,6 +28391,18 @@ these words are the whole of where it is. */
28286
28391
  "default-position"?: (HelixHeadlessSplitter["defaultPosition"] | `${number}`) | undefined;
28287
28392
  /** Where the divider starts, when `position` is not set. */
28288
28393
  defaultPosition?: (HelixHeadlessSplitter["defaultPosition"]) | undefined;
28394
+ /** The least the end pane keeps, in the units `min` takes: a percentage, or
28395
+ a CSS length such as `16rem` resolved against the splitter's box. The
28396
+ divider stops that far from the end, whatever `max` allows, so `min` and
28397
+ `end-min` hold a minimum for each pane, as Zag's panels each take
28398
+ `minSize`. */
28399
+ "end-min"?: (HelixHeadlessSplitter["endMin"]) | undefined;
28400
+ /** The least the end pane keeps, in the units `min` takes: a percentage, or
28401
+ a CSS length such as `16rem` resolved against the splitter's box. The
28402
+ divider stops that far from the end, whatever `max` allows, so `min` and
28403
+ `end-min` hold a minimum for each pane, as Zag's panels each take
28404
+ `minSize`. */
28405
+ endMin?: (HelixHeadlessSplitter["endMin"]) | undefined;
28289
28406
  /** The divider's name, read by screen readers.
28290
28407
 
28291
28408
  An `aria-label` or `aria-labelledby` on the host names the divider too,
@@ -28418,6 +28535,13 @@ that should survive its own collapse says how much of itself to keep, and
28418
28535
  only whoever put it there knows that, which is the same reason `min` is a
28419
28536
  consumer's to set. */
28420
28537
  "prop:collapsedSize"?: (HelixHeadlessSplitter["collapsedSize"]) | undefined;
28538
+ /** Which panes can be collapsed, as Zag's panels each take `collapsible`:
28539
+ `start`, `end`, `both`, or `none`. A pane that cannot be collapsed stops
28540
+ at the edge without shutting. `Enter` collapses the end pane where only
28541
+ the end pane can be collapsed, and the start pane otherwise.
28542
+
28543
+ Unset is `both`, and the attribute stays absent until you write it. */
28544
+ "prop:collapsible"?: (HelixHeadlessSplitter["collapsible"]) | undefined;
28421
28545
  /** The name of the handle where two dividers cross, read by screen readers. */
28422
28546
  "attr:corner-label"?: (HelixHeadlessSplitter["cornerLabel"]) | undefined;
28423
28547
  /** The name of the handle where two dividers cross, read by screen readers. */
@@ -28446,6 +28570,18 @@ these words are the whole of where it is. */
28446
28570
  "attr:default-position"?: (HelixHeadlessSplitter["defaultPosition"] | `${number}`) | undefined;
28447
28571
  /** Where the divider starts, when `position` is not set. */
28448
28572
  "prop:defaultPosition"?: (HelixHeadlessSplitter["defaultPosition"]) | undefined;
28573
+ /** The least the end pane keeps, in the units `min` takes: a percentage, or
28574
+ a CSS length such as `16rem` resolved against the splitter's box. The
28575
+ divider stops that far from the end, whatever `max` allows, so `min` and
28576
+ `end-min` hold a minimum for each pane, as Zag's panels each take
28577
+ `minSize`. */
28578
+ "attr:end-min"?: (HelixHeadlessSplitter["endMin"]) | undefined;
28579
+ /** The least the end pane keeps, in the units `min` takes: a percentage, or
28580
+ a CSS length such as `16rem` resolved against the splitter's box. The
28581
+ divider stops that far from the end, whatever `max` allows, so `min` and
28582
+ `end-min` hold a minimum for each pane, as Zag's panels each take
28583
+ `minSize`. */
28584
+ "prop:endMin"?: (HelixHeadlessSplitter["endMin"]) | undefined;
28449
28585
  /** The divider's name, read by screen readers.
28450
28586
 
28451
28587
  An `aria-label` or `aria-labelledby` on the host names the divider too,
@@ -32411,6 +32547,18 @@ imperatively later, and nothing is hydrating by then.
32411
32547
 
32412
32548
  Here rather than on each control. */
32413
32549
  name?: (HelixHeadlessTimePicker["name"]) | undefined;
32550
+ /** What each time in the list shows: a function given the time as `HH:mm`,
32551
+ or `HH:mm:ss` with `seconds`, and the time as the row writes it, that
32552
+ returns text, an element or a Lit template.
32553
+
32554
+ For the seats left at a time, or a caption under it, as React Aria's
32555
+ `ListBoxItem` takes children. Content with `slot="start"`, `slot="end"`
32556
+ or `slot="description"` goes to that slot of the row, and a description
32557
+ is read after the time. The row is still named by the written time, and
32558
+ typeahead still finds it by that. Return the written time with your
32559
+ content where it should still show. A property only, there being no way
32560
+ to write a function in markup. The wheels draw their own figures. */
32561
+ timeContent?: (HelixHeadlessTimePicker["timeContent"]) | undefined;
32414
32562
  /** The value as a `Date` on 1 January 1970 UTC, or `null` while there is no time.
32415
32563
 
32416
32564
  The platform's own pair on `<input type="time">`, epoch day included: a time
@@ -32747,6 +32895,18 @@ imperatively later, and nothing is hydrating by then.
32747
32895
 
32748
32896
  Here rather than on each control. */
32749
32897
  "prop:name"?: (HelixHeadlessTimePicker["name"]) | undefined;
32898
+ /** What each time in the list shows: a function given the time as `HH:mm`,
32899
+ or `HH:mm:ss` with `seconds`, and the time as the row writes it, that
32900
+ returns text, an element or a Lit template.
32901
+
32902
+ For the seats left at a time, or a caption under it, as React Aria's
32903
+ `ListBoxItem` takes children. Content with `slot="start"`, `slot="end"`
32904
+ or `slot="description"` goes to that slot of the row, and a description
32905
+ is read after the time. The row is still named by the written time, and
32906
+ typeahead still finds it by that. Return the written time with your
32907
+ content where it should still show. A property only, there being no way
32908
+ to write a function in markup. The wheels draw their own figures. */
32909
+ "prop:timeContent"?: (HelixHeadlessTimePicker["timeContent"]) | undefined;
32750
32910
  /** The value as a `Date` on 1 January 1970 UTC, or `null` while there is no time.
32751
32911
 
32752
32912
  The platform's own pair on `<input type="time">`, epoch day included: a time
@@ -32885,11 +33045,25 @@ word is not read, which is `neutral` and `primary` in English. */
32885
33045
  export type HelixHeadlessTimelineProps = {
32886
33046
  /** Accessible name for the timeline, for people who reach it out of context. */
32887
33047
  label?: (HelixHeadlessTimeline["label"]) | undefined;
33048
+ /** Marks the timeline as busy fetching more entries, and draws an entry
33049
+ after the last that says so. */
33050
+ loading?: (HelixHeadlessTimeline["loading"]) | undefined;
33051
+ /** The text of the entry drawn while `loading` is set, where the `loading` slot is empty. */
33052
+ "loading-label"?: (HelixHeadlessTimeline["loadingLabel"]) | undefined;
33053
+ /** The text of the entry drawn while `loading` is set, where the `loading` slot is empty. */
33054
+ loadingLabel?: (HelixHeadlessTimeline["loadingLabel"]) | undefined;
32888
33055
  };
32889
33056
 
32890
33057
  export type HelixHeadlessTimelineSolidJsProps = {
32891
33058
  /** Accessible name for the timeline, for people who reach it out of context. */
32892
33059
  "prop:label"?: (HelixHeadlessTimeline["label"]) | undefined;
33060
+ /** Marks the timeline as busy fetching more entries, and draws an entry
33061
+ after the last that says so. */
33062
+ "prop:loading"?: (HelixHeadlessTimeline["loading"]) | undefined;
33063
+ /** The text of the entry drawn while `loading` is set, where the `loading` slot is empty. */
33064
+ "attr:loading-label"?: (HelixHeadlessTimeline["loadingLabel"]) | undefined;
33065
+ /** The text of the entry drawn while `loading` is set, where the `loading` slot is empty. */
33066
+ "prop:loadingLabel"?: (HelixHeadlessTimeline["loadingLabel"]) | undefined;
32893
33067
 
32894
33068
  /** Set the innerHTML of the element */
32895
33069
  innerHTML?: (string) | undefined;
@@ -36421,12 +36595,18 @@ export type HelixHeadlessVirtualListElementEvent<E = Event> = TypedEvent<
36421
36595
  /** `helix-before-change` event type */
36422
36596
  export type HelixHeadlessVirtualListHelixBeforeChangeElementEvent =
36423
36597
  HelixHeadlessVirtualListElementEvent<HelixBeforeChangeEvent>;
36598
+ /** `helix-before-reorder` event type */
36599
+ export type HelixHeadlessVirtualListHelixBeforeReorderElementEvent =
36600
+ HelixHeadlessVirtualListElementEvent<HelixBeforeReorderEvent>;
36424
36601
  /** `helix-load-more` event type */
36425
36602
  export type HelixHeadlessVirtualListHelixLoadMoreElementEvent =
36426
36603
  HelixHeadlessVirtualListElementEvent<HelixLoadMoreEvent>;
36427
36604
  /** `helix-range-change` event type */
36428
36605
  export type HelixHeadlessVirtualListHelixRangeChangeElementEvent =
36429
36606
  HelixHeadlessVirtualListElementEvent<HelixRangeChangeEvent>;
36607
+ /** `helix-reorder` event type */
36608
+ export type HelixHeadlessVirtualListHelixReorderElementEvent =
36609
+ HelixHeadlessVirtualListElementEvent<HelixReorderEvent>;
36430
36610
 
36431
36611
  export type HelixHeadlessVirtualListProps = {
36432
36612
  /** How many items a line holds. One, the default, is a list; more lays the
@@ -36506,6 +36686,13 @@ and scrolls it sideways: Left and Right move between items, the other
36506
36686
  way round on a right-to-left page, and `estimate` is an item's width. A
36507
36687
  grid always runs down. */
36508
36688
  orientation?: (HelixHeadlessVirtualList["orientation"]) | undefined;
36689
+ /** Lets a reader move items, once `@fusion.dev/helix/virtual-list/reorder`
36690
+ (or `@fusion.dev/helix-headless/virtual-list/reorder`) is imported: Alt
36691
+ with an arrow moves the row the keys are on, and a pointer drags a row.
36692
+ The list moves no item itself: you move your `items` on `helix-reorder`.
36693
+ Without that import it does nothing, so a list that never moves items
36694
+ carries none of the code. A list of one column, without sections. */
36695
+ reorderable?: (HelixHeadlessVirtualList["reorderable"]) | undefined;
36509
36696
  /** The field of each item that names its section, as a key or a path of
36510
36697
  keys. Set, the items are drawn in sections: a header, then the items, in
36511
36698
  an element with the `group` role that the header names. A section starts
@@ -36571,6 +36758,10 @@ it is unset, the header is the name as text. */
36571
36758
  "onhelix-before-change"?: ((
36572
36759
  e: HelixHeadlessVirtualListHelixBeforeChangeElementEvent,
36573
36760
  ) => void) | undefined;
36761
+ /** Fired when an item is dropped at a new place, in a `reorderable` list with `@fusion.dev/helix/virtual-list/reorder` imported, with every key in the new order. Cancelable: cancel it to keep the item where it is. */
36762
+ "onhelix-before-reorder"?: ((
36763
+ e: HelixHeadlessVirtualListHelixBeforeReorderElementEvent,
36764
+ ) => void) | undefined;
36574
36765
  /** Fired when a reader comes within one screen of the last item, once for each length of the set. */
36575
36766
  "onhelix-load-more"?: ((
36576
36767
  e: HelixHeadlessVirtualListHelixLoadMoreElementEvent,
@@ -36579,6 +36770,10 @@ it is unset, the header is the name as text. */
36579
36770
  "onhelix-range-change"?: ((
36580
36771
  e: HelixHeadlessVirtualListHelixRangeChangeElementEvent,
36581
36772
  ) => void) | undefined;
36773
+ /** Fired after `helix-before-reorder` when nobody canceled it. Set `items` to the order in `keys`. Cancelable: cancel it to say the move did not happen. */
36774
+ "onhelix-reorder"?: ((
36775
+ e: HelixHeadlessVirtualListHelixReorderElementEvent,
36776
+ ) => void) | undefined;
36582
36777
  };
36583
36778
 
36584
36779
  export type HelixHeadlessVirtualListSolidJsProps = {
@@ -36659,6 +36854,13 @@ and scrolls it sideways: Left and Right move between items, the other
36659
36854
  way round on a right-to-left page, and `estimate` is an item's width. A
36660
36855
  grid always runs down. */
36661
36856
  "prop:orientation"?: (HelixHeadlessVirtualList["orientation"]) | undefined;
36857
+ /** Lets a reader move items, once `@fusion.dev/helix/virtual-list/reorder`
36858
+ (or `@fusion.dev/helix-headless/virtual-list/reorder`) is imported: Alt
36859
+ with an arrow moves the row the keys are on, and a pointer drags a row.
36860
+ The list moves no item itself: you move your `items` on `helix-reorder`.
36861
+ Without that import it does nothing, so a list that never moves items
36862
+ carries none of the code. A list of one column, without sections. */
36863
+ "prop:reorderable"?: (HelixHeadlessVirtualList["reorderable"]) | undefined;
36662
36864
  /** The field of each item that names its section, as a key or a path of
36663
36865
  keys. Set, the items are drawn in sections: a header, then the items, in
36664
36866
  an element with the `group` role that the header names. A section starts
@@ -36723,6 +36925,10 @@ it is unset, the header is the name as text. */
36723
36925
  "on:helix-before-change"?: ((
36724
36926
  e: HelixHeadlessVirtualListHelixBeforeChangeElementEvent,
36725
36927
  ) => void) | undefined;
36928
+ /** Fired when an item is dropped at a new place, in a `reorderable` list with `@fusion.dev/helix/virtual-list/reorder` imported, with every key in the new order. Cancelable: cancel it to keep the item where it is. */
36929
+ "on:helix-before-reorder"?: ((
36930
+ e: HelixHeadlessVirtualListHelixBeforeReorderElementEvent,
36931
+ ) => void) | undefined;
36726
36932
  /** Fired when a reader comes within one screen of the last item, once for each length of the set. */
36727
36933
  "on:helix-load-more"?: ((
36728
36934
  e: HelixHeadlessVirtualListHelixLoadMoreElementEvent,
@@ -36731,6 +36937,10 @@ it is unset, the header is the name as text. */
36731
36937
  "on:helix-range-change"?: ((
36732
36938
  e: HelixHeadlessVirtualListHelixRangeChangeElementEvent,
36733
36939
  ) => void) | undefined;
36940
+ /** Fired after `helix-before-reorder` when nobody canceled it. Set `items` to the order in `keys`. Cancelable: cancel it to say the move did not happen. */
36941
+ "on:helix-reorder"?: ((
36942
+ e: HelixHeadlessVirtualListHelixReorderElementEvent,
36943
+ ) => void) | undefined;
36734
36944
 
36735
36945
  /** Set the innerHTML of the element */
36736
36946
  innerHTML?: (string) | undefined;
@@ -38740,10 +38950,18 @@ export type CustomElements = {
38740
38950
  * a named `group`, and the toolbar's own arrow keys walk its buttons, so a
38741
38951
  * reader meets one toolbar. Under `single` it is a `radiogroup` either way.
38742
38952
  *
38953
+ * **Disabled.** `disabled` on the group disables every button in it, Helix
38954
+ * and native alike, and says so on the group with `aria-disabled`, as React
38955
+ * Aria's `isDisabled` does. A button disabled on its own stays disabled when
38956
+ * the group is enabled again, and a button that leaves the group gets back
38957
+ * what it said for itself.
38958
+ *
38743
38959
  * ## Attributes & Properties
38744
38960
  *
38745
38961
  * Component attributes and properties that can be applied to the element or by using JavaScript.
38746
38962
  *
38963
+ * - `disabled`: Disables every button in the group, and says so on the group with
38964
+ * `aria-disabled`. Reflected, so a stylesheet can select on it.
38747
38965
  * - `disallow-empty-selection`/`disallowEmptySelection`: Keeps at least one button pressed once one is, as React Aria's
38748
38966
  * `disallowEmptySelection`: a press that would leave none pressed is
38749
38967
  * refused.
@@ -38778,6 +38996,8 @@ export type CustomElements = {
38778
38996
  *
38779
38997
  * The attribute is the seed, and a press changes the property, which does
38780
38998
  * not reflect, as a native control's `value` does not.
38999
+ * - `values`: The pressed values as a list, in a selection mode, and an empty list
39000
+ * otherwise. Written, it presses exactly those buttons. (property only)
38781
39001
  * - `whenSettled`: Resolves a frame after the first update, when transitions are switched on.
38782
39002
  *
38783
39003
  * **Named `whenSettled` because `settled` is taken four times over**, by
@@ -39631,6 +39851,8 @@ export type CustomElements = {
39631
39851
  * Third", rather than with a comma this component chose.
39632
39852
  * - `linked-label`/`linkedLabel`: The text read with a card that has connections both ways. `{leadsTo}` is
39633
39853
  * `leads-to-label` and `{comesFrom}` is `comes-from-label`, each filled in.
39854
+ * - `loading`: Marks the board as busy while its document arrives: the board is
39855
+ * `aria-busy`, and the `loading` slot is shown.
39634
39856
  * - `moved-label`/`movedLabel`: What screen readers hear after a key moves a card, with `{name}` for the
39635
39857
  * card and `{x}` and `{y}` for where it now is, in the document's units.
39636
39858
  *
@@ -39871,6 +40093,7 @@ export type CustomElements = {
39871
40093
  * - `footer`: Content below the board.
39872
40094
  * - `fullscreen-icon`: Replaces the glyph inside the fullscreen button.
39873
40095
  * - `header`: Content above the board.
40096
+ * - `loading`: Content shown while `loading` is set, such as a progress bar while the document arrives.
39874
40097
  * - `pan-down-icon`: Replaces the glyph inside the pan down button.
39875
40098
  * - `pan-end-icon`: Replaces the glyph inside the button that pans toward the end of a line of text.
39876
40099
  * - `pan-start-icon`: Replaces the glyph inside the button that pans toward the start of a line of text.
@@ -39993,6 +40216,7 @@ export type CustomElements = {
39993
40216
  * - `fullscreen`: While the board fills the screen.
39994
40217
  * - `holding`: An item picked up with a click follows the pointer until the next press puts it down.
39995
40218
  * - `idle`: The user has been still for `idle-delay` milliseconds. The board's own controls stay; select on it to hide chrome of your own.
40219
+ * - `loading`: While `loading` is set.
39996
40220
  * - `pressing`: While a press on the board, its cards or its connections is under way.
39997
40221
  * - `sharing`: The page keeps the plain wheel and one finger, with `gestures="cooperative"` or while a board with `gestures="activate"` waits to be pressed.
39998
40222
  * - `using`: A board with `gestures="activate"` has been pressed and has the gestures.
@@ -43339,7 +43563,17 @@ export type CustomElements = {
43339
43563
  * The button is named `label`, or the host's `aria-label`, and its name
43340
43564
  * changes to `copied-label` or `error-label` for the moment after a press. The
43341
43565
  * same words are said in a live region, so a screen reader hears the result,
43342
- * and the tooltip shows them.
43566
+ * and the tooltip shows them. The tooltip does not also describe the button,
43567
+ * since its words are the button's name.
43568
+ *
43569
+ * **The tooltip.** It shows the name on hover and focus and the result after a
43570
+ * press. `tooltip="copy"` shows it only for the result, and `tooltip="none"`
43571
+ * draws none, as Web Awesome's copy button offers. `tooltip-placement` is the
43572
+ * side it prefers, and it moves to another side where that one does not fit.
43573
+ *
43574
+ * **Words on the button.** `show-label` draws the name beside the icon, and
43575
+ * the result in its place after a press. The button is as wide as the longest
43576
+ * of the three, so a press does not resize it.
43343
43577
  *
43344
43578
  * ## Attributes & Properties
43345
43579
  *
@@ -43362,6 +43596,15 @@ export type CustomElements = {
43362
43596
  * Defaulted rather than left empty. An icon-only control must be named, and
43363
43597
  * the name of this one is not a judgment call: every copy button in the
43364
43598
  * world is called Copy. A consumer with a better word still sets it.
43599
+ * - `show-label`/`showLabel`: Draws the name as words beside the icon, and the result in their place
43600
+ * after a press. The button stays as wide as the longest of them.
43601
+ * - `tooltip`: When the tooltip shows: `full` on hover and focus and after a press,
43602
+ * `copy` only after a press, to show the result, and `none` never, for a
43603
+ * button whose result shows another way, such as under `show-label`.
43604
+ *
43605
+ * Unset is `full`, and the attribute stays absent until you write it.
43606
+ * - `tooltip-placement`/`tooltipPlacement`: The side the tooltip prefers. It moves to another side where this one
43607
+ * does not fit.
43365
43608
  * - `value`: The text copied to the clipboard.
43366
43609
  *
43367
43610
  * It replaces `Button.value`, the submit value: a copy button never submits,
@@ -43523,6 +43766,7 @@ export type CustomElements = {
43523
43766
  * - `live`: The live region that says `copied-label` or `error-label` after a press, and `pending-label` when the button becomes pending under focus. It is rendered from the first time it says anything.
43524
43767
  * - `mark`: The clipboard icon, and the confirmation icon that replaces it.
43525
43768
  * - `spinner`: The ring a pending button turns, an empty element the styled button draws over the icon. It is rendered only while the button is pending.
43769
+ * - `text`: The words beside the icon, under `show-label`. It holds all three, `label`, `copied-label` and `error-label`, with all but the current one hidden.
43526
43770
  * - `tooltip`: The tooltip bubble, forwarded from the tooltip inside the button.
43527
43771
  * - `tooltip-arrow`: The tooltip's arrow, which points at the button.
43528
43772
  * - `tooltip-arrow-bottom`: The arrow while the bubble is below the button, on the bubble's top edge. Set together with `tooltip-arrow`.
@@ -47808,6 +48052,9 @@ export type CustomElements = {
47808
48052
  * - `linked-both-label`/`linkedBothLabel`: How a note linked both to and from the selected one is described, with `{note}`.
47809
48053
  * - `linked-from-label`/`linkedFromLabel`: How a note the selected one links to is described, with `{note}`, the selected note's name.
47810
48054
  * - `links-to-label`/`linksToLabel`: How a note that links to the selected one is described, with `{note}`.
48055
+ * - `loading`: Marks the graph as busy while its notes arrive: the list is `aria-busy`,
48056
+ * and the panel says so where it holds no notes yet.
48057
+ * - `loading-label`/`loadingLabel`: What the panel says while `loading` is set and the list holds no notes.
47811
48058
  * - `moved-down-label`/`movedDownLabel`: What screen readers hear once the drawing has moved down, after `moved()`.
47812
48059
  * - `moved-left-label`/`movedLeftLabel`: What screen readers hear once the drawing has moved left, after `moved()`.
47813
48060
  * - `moved-right-label`/`movedRightLabel`: What screen readers hear once the drawing has moved right, after `moved()`.
@@ -47916,6 +48163,15 @@ export type CustomElements = {
47916
48163
  * - `hiddenGroups`: The groups turned off in the legend, by name, whose notes neither the drawing nor the list shows. A property, never an attribute. (property only)
47917
48164
  * - `links`: The links between notes, each from `source` to `target`. A property, never an attribute. (property only)
47918
48165
  * - `nodes`: The notes. A property, never an attribute. (property only)
48166
+ * - `noteContent`: What each note's row in the list shows in place of its name: a function
48167
+ * given the note that returns text, an element or a Lit template.
48168
+ *
48169
+ * For an icon by its kind, or a date under its name, as React Aria's
48170
+ * `ListBoxItem` takes children. The row is still named by the note's name,
48171
+ * which typeahead and the search find it by, and described by how it stands
48172
+ * to the selected note. Return the name with your content where it should
48173
+ * still show. A property only, there being no way to write a function in
48174
+ * markup. (property only)
47919
48175
  * - `ready`: Whether the graph has been drawn whole. For code that runs after `helix-graph-ready`. (property only) (readonly)
47920
48176
  * - `whenSettled`: Resolves a frame after the first update, when transitions are switched on.
47921
48177
  *
@@ -47962,6 +48218,7 @@ export type CustomElements = {
47962
48218
  * - `footer`: Content below the graph.
47963
48219
  * - `fullscreen-icon`: Replaces the glyph inside the fullscreen button.
47964
48220
  * - `header`: Content above the graph.
48221
+ * - `loading`: What the panel shows while `loading` is set and the list holds no notes. Defaults to `loading-label`.
47965
48222
  * - `pan-down-icon`: Replaces the glyph inside the pan down button.
47966
48223
  * - `pan-end-icon`: Replaces the glyph inside the button that pans toward the end of a line of text.
47967
48224
  * - `pan-start-icon`: Replaces the glyph inside the button that pans toward the start of a line of text.
@@ -48035,6 +48292,7 @@ export type CustomElements = {
48035
48292
  * - `legend-swatch`: The mark in a group's color, before its name.
48036
48293
  * - `list`: The list of notes, which draws only the rows in view.
48037
48294
  * - `live`: What screen readers hear: how many notes there are when a search or the legend changes it, and which way the drawing went after a key or a control moved it.
48295
+ * - `loading`: The box in place of the list while `loading` is set and it holds no notes, holding the `loading` slot.
48038
48296
  * - `note`: One note in the list.
48039
48297
  * - `note-cursor`: The note the keyboard is on in the list.
48040
48298
  * - `note-linked`: A note linked to or from the selected one.
@@ -48062,6 +48320,7 @@ export type CustomElements = {
48062
48320
  * - `empty`: The list holds no notes: the graph has none, or a search or the groups hid them all.
48063
48321
  * - `fullscreen`: The graph fills the screen.
48064
48322
  * - `idle`: The user has been still long enough for the header and footer to fade.
48323
+ * - `loading`: While `loading` is set.
48065
48324
  * - `local`: The drawing shows the selected note's local graph, with `depth`.
48066
48325
  * - `panel-open`: A graph with `no-panel` has the search and the list open over the drawing.
48067
48326
  * - `ready`: The graph has been drawn whole, after `helix-graph-ready`.
@@ -50605,7 +50864,8 @@ export type CustomElements = {
50605
50864
  * itself.
50606
50865
  * - `value`: The selected rows' values, separated by commas with no spaces, such as `a,c`, in a list that selects.
50607
50866
  *
50608
- * Set it to start with rows selected. A row's value is its `value`, or its
50867
+ * A press or a key writes it in row order, as Data Table does, whatever
50868
+ * order the rows were chosen in. Set it to start with rows selected. A row's value is its `value`, or its
50609
50869
  * words where it has none.
50610
50870
  * - `rows`: The rows the list holds, in order. (property only) (readonly)
50611
50871
  * - `whenSettled`: Resolves a frame after the first update, when transitions are switched on.
@@ -54891,6 +55151,22 @@ export type CustomElements = {
54891
55151
  * headings are far apart, none is in the band and no section is marked, and
54892
55152
  * when they are close together, several are in the band at once.
54893
55153
  *
55154
+ * **Several sections at once.** `marks="visible"` marks the link of every
55155
+ * section with part of it on screen, from the reading line to the bottom of
55156
+ * what the sections scroll in, as Zag's table of contents marks its active
55157
+ * ids. The mark then runs from the first of those links to the last, and
55158
+ * `marked` lists their ids in page order.
55159
+ *
55160
+ * **Going to a section from code.** `scrollToSection(id)` scrolls to the
55161
+ * section as a press on its link does, with `behavior`, and marks its link at
55162
+ * once.
55163
+ *
55164
+ * **Styling a link by its state.** Each link the outline finds carries
55165
+ * `data-depth`, its depth in the outline from `1`, nested lists and
55166
+ * `data-level` alike, and `aria-current="location"` while its section is
55167
+ * marked, so `a[aria-current]` and `a[data-depth="2"]` are the hooks for a
55168
+ * rule of yours.
55169
+ *
54894
55170
  * ## Attributes & Properties
54895
55171
  *
54896
55172
  * Component attributes and properties that can be applied to the element or by using JavaScript.
@@ -54920,6 +55196,9 @@ export type CustomElements = {
54920
55196
  * box the sections scroll in.
54921
55197
  * - `label`: The navigation's name, read by screen readers. A heading in the `heading`
54922
55198
  * slot names it in place of this.
55199
+ * - `marks`: Which links are marked. `reading` marks the one section being read, the
55200
+ * last whose heading has passed the reading line. `visible` marks every
55201
+ * section with part of it on screen, and the mark runs across their links.
54923
55202
  * - `offset`: How far below the top of the scroll container a heading counts as reached,
54924
55203
  * in pixels. The scroll container is the window or the panel the sections
54925
55204
  * scroll in.
@@ -54935,6 +55214,9 @@ export type CustomElements = {
54935
55214
  * writable property in this library that a component also writes is state a
54936
55215
  * consumer can own; this one cannot be, and saying so with the type is better
54937
55216
  * than saying it in a sentence nobody reads. (property only) (readonly)
55217
+ * - `marked`: The ids of the sections whose links are marked, in page order: the one
55218
+ * `current` names, or under `marks="visible"` every section on screen.
55219
+ * Read-only, for the reason `current` gives. (property only) (readonly)
54938
55220
  * - `whenSettled`: Resolves a frame after the first update, when transitions are switched on.
54939
55221
  *
54940
55222
  * **Named `whenSettled` because `settled` is taken four times over**, by
@@ -54970,6 +55252,14 @@ export type CustomElements = {
54970
55252
  * - `heading`: A heading above the links, such as "On this page". It names the navigation.
54971
55253
  * - `indicator`: A mark of your own, drawn inside the `indicator` part, where `--indicator-x`, `--indicator-y`, `--indicator-inline-size` and `--indicator-block-size` reach it.
54972
55254
  *
55255
+ * ## Methods
55256
+ *
55257
+ * Methods that can be called to access component functionality.
55258
+ *
55259
+ * - `scrollToSection(id: string) => boolean`: Scrolls to the section with this id, as a press on its link does, with
55260
+ * `behavior`, and marks its link at once. The address and focus stay where
55261
+ * they are. Returns whether the outline has a link to that section.
55262
+ *
54973
55263
  * ## CSS Parts
54974
55264
  *
54975
55265
  * Custom selectors for styling elements within the component.
@@ -58941,7 +59231,11 @@ export type CustomElements = {
58941
59231
  * back to the position where the collapsing gesture began. A drag records that position
58942
59232
  * on press, and every other way of collapsing records it in `settle`.
58943
59233
  * `collapsed-size` keeps a sliver of the pane visible, such as a tab strip.
58944
- * Collapsing overrides `min` and `max`.
59234
+ * Collapsing overrides `min` and `max`. `collapsible` says which panes can be
59235
+ * collapsed at all, as Zag's panels each say.
59236
+ *
59237
+ * `min` is the least the start pane keeps and `end-min` the least the end pane
59238
+ * keeps, each a percentage or a CSS length such as `16rem`.
58945
59239
  *
58946
59240
  * Set `primary` to the pane that keeps its size when the splitter's own size
58947
59241
  * changes, such as a sidebar beside a window being resized. The other pane
@@ -58962,7 +59256,7 @@ export type CustomElements = {
58962
59256
  * | Left, Right | Moves a side-by-side divider by `step`. On a right-to-left page, Left moves it toward the end. |
58963
59257
  * | Up, Down | Moves a stacked divider by `step`. |
58964
59258
  * | Home, End | Moves the divider to its bounds. |
58965
- * | Enter | Collapses the start pane, and opens it again. |
59259
+ * | Enter | Collapses the start pane, or the end pane where `collapsible="end"`, and opens it again. |
58966
59260
  * | F6 | Moves focus from one pane to the first control in the other, and from the divider to the start pane. |
58967
59261
  *
58968
59262
  * ## Attributes & Properties
@@ -58992,6 +59286,12 @@ export type CustomElements = {
58992
59286
  * that should survive its own collapse says how much of itself to keep, and
58993
59287
  * only whoever put it there knows that, which is the same reason `min` is a
58994
59288
  * consumer's to set.
59289
+ * - `collapsible`: Which panes can be collapsed, as Zag's panels each take `collapsible`:
59290
+ * `start`, `end`, `both`, or `none`. A pane that cannot be collapsed stops
59291
+ * at the edge without shutting. `Enter` collapses the end pane where only
59292
+ * the end pane can be collapsed, and the start pane otherwise.
59293
+ *
59294
+ * Unset is `both`, and the attribute stays absent until you write it.
58995
59295
  * - `corner-label`/`cornerLabel`: The name of the handle where two dividers cross, read by screen readers.
58996
59296
  * - `corner-value-label`/`cornerValueLabel`: What the handle where two dividers cross says it is set to, both dividers
58997
59297
  * at once: `{across}` is where the divider that runs down stands, and
@@ -59002,6 +59302,11 @@ export type CustomElements = {
59002
59302
  * these words are the whole of where it is.
59003
59303
  * - `default-collapsed`/`defaultCollapsed`: Which pane starts shut, when `collapsed` is not set.
59004
59304
  * - `default-position`/`defaultPosition`: Where the divider starts, when `position` is not set.
59305
+ * - `end-min`/`endMin`: The least the end pane keeps, in the units `min` takes: a percentage, or
59306
+ * a CSS length such as `16rem` resolved against the splitter's box. The
59307
+ * divider stops that far from the end, whatever `max` allows, so `min` and
59308
+ * `end-min` hold a minimum for each pane, as Zag's panels each take
59309
+ * `minSize`.
59005
59310
  * - `label`: The divider's name, read by screen readers.
59006
59311
  *
59007
59312
  * An `aria-label` or `aria-labelledby` on the host names the divider too,
@@ -61079,7 +61384,8 @@ export type CustomElements = {
61079
61384
  * not disabled. `selection-behavior="replace"` selects the tag a reader
61080
61385
  * presses or moves to alone, as a file list does, and Control or Command
61081
61386
  * with a press or Space adds or takes out one tag. `disallow-empty-selection`
61082
- * keeps one tag selected once one is. `value` holds the
61387
+ * keeps one tag selected once one is, and Escape lets go of the selection
61388
+ * otherwise. `value` holds the
61083
61389
  * selected tags' values, separated by commas, and a change asks with
61084
61390
  * `helix-before-change` and tells with `change`. Enter on a tag with an
61085
61391
  * `href` follows its link. A `disabled` tag is passed over. A selected tag
@@ -61097,6 +61403,12 @@ export type CustomElements = {
61097
61403
  * Where only disabled tags are left, the first of them holds the tab stop and
61098
61404
  * takes focus, so the reader stays in the set.
61099
61405
  *
61406
+ * **Typing new tags.** A field where people type tags and press Enter to add
61407
+ * each one is Combobox with `multiple` and `allows-custom-value`, or
61408
+ * `creatable` to ask first with `helix-create`. It draws each value as a tag,
61409
+ * Backspace on the empty field removes the last one, and the arrow keys move
61410
+ * between them.
61411
+ *
61100
61412
  * ## Attributes & Properties
61101
61413
  *
61102
61414
  * Component attributes and properties that can be applied to the element or by using JavaScript.
@@ -61199,6 +61511,12 @@ export type CustomElements = {
61199
61511
  * selected. Its remove button leaves the tab order there, Delete and Backspace
61200
61512
  * doing its job from the row.
61201
61513
  *
61514
+ * **Styling a tag by what is happening to it.** `:state(selected)` while it is
61515
+ * selected, `:state(focus-visible)` while its cell shows keyboard focus,
61516
+ * `[disabled]` while it is out of reach, and the host's own `:hover` and
61517
+ * `:active` under the pointer, as React Aria's `data-hovered` and
61518
+ * `data-pressed` are.
61519
+ *
61202
61520
  * ## Attributes & Properties
61203
61521
  *
61204
61522
  * Component attributes and properties that can be applied to the element or by using JavaScript.
@@ -61291,6 +61609,7 @@ export type CustomElements = {
61291
61609
  *
61292
61610
  * These can be used to apply styling when a component is in a given state.
61293
61611
  *
61612
+ * - `focus-visible`: The tag's cell has keyboard focus that the browser shows, in a `Tag.Group`.
61294
61613
  * - `selected`: The tag is selected in a `Tag.Group` that selects.
61295
61614
  * - `settled`: Set one frame after the first render. Transitions wait for it, so an element does not animate its own arrival.
61296
61615
  */
@@ -62295,6 +62614,17 @@ export type CustomElements = {
62295
62614
  * imperatively later, and nothing is hydrating by then.
62296
62615
  *
62297
62616
  * Here rather than on each control.
62617
+ * - `timeContent`: What each time in the list shows: a function given the time as `HH:mm`,
62618
+ * or `HH:mm:ss` with `seconds`, and the time as the row writes it, that
62619
+ * returns text, an element or a Lit template.
62620
+ *
62621
+ * For the seats left at a time, or a caption under it, as React Aria's
62622
+ * `ListBoxItem` takes children. Content with `slot="start"`, `slot="end"`
62623
+ * or `slot="description"` goes to that slot of the row, and a description
62624
+ * is read after the time. The row is still named by the written time, and
62625
+ * typeahead still finds it by that. Return the written time with your
62626
+ * content where it should still show. A property only, there being no way
62627
+ * to write a function in markup. The wheels draw their own figures. (property only)
62298
62628
  * - `valueAsDate`: The value as a `Date` on 1 January 1970 UTC, or `null` while there is no time.
62299
62629
  *
62300
62630
  * The platform's own pair on `<input type="time">`, epoch day included: a time
@@ -62571,7 +62901,9 @@ export type CustomElements = {
62571
62901
  * hours ago", from `datetime`, where the `time` slot is empty. The words move
62572
62902
  * on as they go stale, "3 hours ago" becoming "4 hours ago", with one wakeup
62573
62903
  * shared by every reading on the page, as `FormatDate` keeps its own. They are
62574
- * in the language of the page, or of the nearest `lang`.
62904
+ * in the language of the page, or of the nearest `lang`. The whole date and
62905
+ * time is the reading's `title`, so a pointer resting on "3 hours ago" shows
62906
+ * when it was, and a screen reader reads it as the description.
62575
62907
  *
62576
62908
  * Each entry draws the connector line that arrives at it and hides it when it
62577
62909
  * is the first entry, using `:host(:first-child)`. This needs no index, no
@@ -62685,11 +63017,20 @@ export type CustomElements = {
62685
63017
  * Write the entries in the order the events happened, oldest or newest first,
62686
63018
  * and the layout only moves where they are drawn.
62687
63019
  *
63020
+ * **A feed that loads more entries sets `loading` while it fetches.** The
63021
+ * timeline is busy, and an entry after the last says "Loading more"
63022
+ * (`loading-label`, or your own content in the `loading` slot). Put a button
63023
+ * that asks for more after the timeline, and move focus to the first new
63024
+ * entry when they arrive.
63025
+ *
62688
63026
  * ## Attributes & Properties
62689
63027
  *
62690
63028
  * Component attributes and properties that can be applied to the element or by using JavaScript.
62691
63029
  *
62692
63030
  * - `label`: Accessible name for the timeline, for people who reach it out of context.
63031
+ * - `loading`: Marks the timeline as busy fetching more entries, and draws an entry
63032
+ * after the last that says so.
63033
+ * - `loading-label`/`loadingLabel`: The text of the entry drawn while `loading` is set, where the `loading` slot is empty.
62693
63034
  * - `whenSettled`: Resolves a frame after the first update, when transitions are switched on.
62694
63035
  *
62695
63036
  * **Named `whenSettled` because `settled` is taken four times over**, by
@@ -62716,11 +63057,19 @@ export type CustomElements = {
62716
63057
  * Areas where markup can be added to the component.
62717
63058
  *
62718
63059
  * - `(default)`: The entries, and any groups of them.
63060
+ * - `loading`: Content for the entry after the last while `loading` is set. Falls back to `loading-label`.
63061
+ *
63062
+ * ## CSS Parts
63063
+ *
63064
+ * Custom selectors for styling elements within the component.
63065
+ *
63066
+ * - `loading`: The entry after the last while `loading` is set.
62719
63067
  *
62720
63068
  * ## CSS States
62721
63069
  *
62722
63070
  * These can be used to apply styling when a component is in a given state.
62723
63071
  *
63072
+ * - `loading`: While `loading` is set.
62724
63073
  * - `settled`: Set one frame after the first render. Transitions wait for it, so an element does not animate its own arrival.
62725
63074
  */
62726
63075
  "helix-headless-timeline": Partial<
@@ -63605,6 +63954,9 @@ export type CustomElements = {
63605
63954
  * describes a Helix component and leaves a plain element undescribed. In the
63606
63955
  * `for` form the tooltip itself is out of the accessibility tree while its
63607
63956
  * bubble is down, so you meet its words once, as the trigger's description.
63957
+ * A trigger whose name is already the tooltip's words, such as an icon button
63958
+ * named Settings under a tooltip reading Settings, is not described by them
63959
+ * again.
63608
63960
  *
63609
63961
  * The tooltip shows on hover and on focus. It hides on pointer leave, on blur,
63610
63962
  * on Escape, and when the trigger is activated. The pointer can move from the
@@ -65661,11 +66013,14 @@ export type CustomElements = {
65661
66013
  * | Page Down, Page Up | Moves by the number of items, or of lines in a grid, on screen. |
65662
66014
  * | A letter or a word | Moves to the next item whose text starts with what you typed. |
65663
66015
  * | Escape | Lets go of every chosen item, in a list with `selection-mode`. |
66016
+ * | Alt with Up or Down | In a `reorderable` list, moves the item a place. Alt with Home or End moves it to either end. |
65664
66017
  * | Tab | Moves into the focused row's own links and buttons, then out of the list. |
65665
66018
  *
65666
66019
  * An item that is not drawn is scrolled into view and focused, so a keyboard
65667
- * reaches the whole set. When the row holding the tab stop scrolls away, the
65668
- * stop moves to the first row on screen. Typing matches each item's
66020
+ * reaches the whole set. The row a reader last focused keeps the tab stop and
66021
+ * stays drawn when it scrolls away, so Tab and Shift+Tab come back to it, as
66022
+ * React Aria's collections do. In a list nobody has focused yet, the stop
66023
+ * moves to the first row on screen. Typing matches each item's
65669
66024
  * `text-field`, which is the first `data-field` of the row template by default,
65670
66025
  * or the item itself when it is a string or a number.
65671
66026
  *
@@ -65707,6 +66062,23 @@ export type CustomElements = {
65707
66062
  * the last item says "Loading more" (`loading-label`, or your own content in
65708
66063
  * the `loading` slot). `scrollToIndex` takes a reader to an item.
65709
66064
  *
66065
+ * **Moving items** is a separate import, `@fusion.dev/helix/virtual-list/reorder`,
66066
+ * as React Aria's drag and drop is. With it imported, `reorderable` lets a
66067
+ * reader move items in a list of one column without sections:
66068
+ *
66069
+ * - Alt with Up or Down moves the item the keys are on a place, and Alt with
66070
+ * Home or End to either end, as the APG's rearrangeable listbox does.
66071
+ * - A pointer drags a whole row. A press that does not travel is still a
66072
+ * press. The list scrolls near an edge, and an item far down a long set is
66073
+ * reached by dragging to the edge.
66074
+ * - A drop sends `helix-before-reorder`, which you can refuse, and then
66075
+ * `helix-reorder`, whose `keys` hold every item's key in the new order.
66076
+ * **You move the items**: set `items` to them in that order. The keys stay
66077
+ * on the item that moved.
66078
+ * - Each move is said in a region screen readers announce. The row being
66079
+ * dragged carries `data-dragging`, and the row a drop would land beside
66080
+ * `data-drop-before` or `data-drop-after`.
66081
+ *
65710
66082
  * **An empty list.** Set `empty-label`, or put your own content in the `empty`
65711
66083
  * slot, for a row shown when there are no items and none are loading, such as
65712
66084
  * "No messages yet" and a link to write one. Without either, an empty list
@@ -65785,6 +66157,12 @@ export type CustomElements = {
65785
66157
  * and scrolls it sideways: Left and Right move between items, the other
65786
66158
  * way round on a right-to-left page, and `estimate` is an item's width. A
65787
66159
  * grid always runs down.
66160
+ * - `reorderable`: Lets a reader move items, once `@fusion.dev/helix/virtual-list/reorder`
66161
+ * (or `@fusion.dev/helix-headless/virtual-list/reorder`) is imported: Alt
66162
+ * with an arrow moves the row the keys are on, and a pointer drags a row.
66163
+ * The list moves no item itself: you move your `items` on `helix-reorder`.
66164
+ * Without that import it does nothing, so a list that never moves items
66165
+ * carries none of the code. A list of one column, without sections.
65788
66166
  * - `section-field`/`sectionField`: The field of each item that names its section, as a key or a path of
65789
66167
  * keys. Set, the items are drawn in sections: a header, then the items, in
65790
66168
  * an element with the `group` role that the header names. A section starts
@@ -65847,8 +66225,10 @@ export type CustomElements = {
65847
66225
  *
65848
66226
  * - `change`: Fired once a press or a key has changed which items are selected, in a list with `selection-mode`.
65849
66227
  * - `helix-before-change`: Fired before a press or a key changes which items are selected, with the `value` it would leave. Cancelable.
66228
+ * - `helix-before-reorder`: Fired when an item is dropped at a new place, in a `reorderable` list with `@fusion.dev/helix/virtual-list/reorder` imported, with every key in the new order. Cancelable: cancel it to keep the item where it is.
65850
66229
  * - `helix-load-more`: Fired when a reader comes within one screen of the last item, once for each length of the set.
65851
66230
  * - `helix-range-change`: Fired when the items on screen change, with the new `first` and `last`, which `range` also holds.
66231
+ * - `helix-reorder`: Fired after `helix-before-reorder` when nobody canceled it. Set `items` to the order in `keys`. Cancelable: cancel it to say the move did not happen.
65852
66232
  *
65853
66233
  * ## Slots
65854
66234
  *
@@ -67920,10 +68300,18 @@ export type CustomElementsSolidJs = {
67920
68300
  * a named `group`, and the toolbar's own arrow keys walk its buttons, so a
67921
68301
  * reader meets one toolbar. Under `single` it is a `radiogroup` either way.
67922
68302
  *
68303
+ * **Disabled.** `disabled` on the group disables every button in it, Helix
68304
+ * and native alike, and says so on the group with `aria-disabled`, as React
68305
+ * Aria's `isDisabled` does. A button disabled on its own stays disabled when
68306
+ * the group is enabled again, and a button that leaves the group gets back
68307
+ * what it said for itself.
68308
+ *
67923
68309
  * ## Attributes & Properties
67924
68310
  *
67925
68311
  * Component attributes and properties that can be applied to the element or by using JavaScript.
67926
68312
  *
68313
+ * - `disabled`: Disables every button in the group, and says so on the group with
68314
+ * `aria-disabled`. Reflected, so a stylesheet can select on it.
67927
68315
  * - `disallow-empty-selection`/`disallowEmptySelection`: Keeps at least one button pressed once one is, as React Aria's
67928
68316
  * `disallowEmptySelection`: a press that would leave none pressed is
67929
68317
  * refused.
@@ -67958,6 +68346,8 @@ export type CustomElementsSolidJs = {
67958
68346
  *
67959
68347
  * The attribute is the seed, and a press changes the property, which does
67960
68348
  * not reflect, as a native control's `value` does not.
68349
+ * - `values`: The pressed values as a list, in a selection mode, and an empty list
68350
+ * otherwise. Written, it presses exactly those buttons. (property only)
67961
68351
  * - `whenSettled`: Resolves a frame after the first update, when transitions are switched on.
67962
68352
  *
67963
68353
  * **Named `whenSettled` because `settled` is taken four times over**, by
@@ -68820,6 +69210,8 @@ export type CustomElementsSolidJs = {
68820
69210
  * Third", rather than with a comma this component chose.
68821
69211
  * - `linked-label`/`linkedLabel`: The text read with a card that has connections both ways. `{leadsTo}` is
68822
69212
  * `leads-to-label` and `{comesFrom}` is `comes-from-label`, each filled in.
69213
+ * - `loading`: Marks the board as busy while its document arrives: the board is
69214
+ * `aria-busy`, and the `loading` slot is shown.
68823
69215
  * - `moved-label`/`movedLabel`: What screen readers hear after a key moves a card, with `{name}` for the
68824
69216
  * card and `{x}` and `{y}` for where it now is, in the document's units.
68825
69217
  *
@@ -69060,6 +69452,7 @@ export type CustomElementsSolidJs = {
69060
69452
  * - `footer`: Content below the board.
69061
69453
  * - `fullscreen-icon`: Replaces the glyph inside the fullscreen button.
69062
69454
  * - `header`: Content above the board.
69455
+ * - `loading`: Content shown while `loading` is set, such as a progress bar while the document arrives.
69063
69456
  * - `pan-down-icon`: Replaces the glyph inside the pan down button.
69064
69457
  * - `pan-end-icon`: Replaces the glyph inside the button that pans toward the end of a line of text.
69065
69458
  * - `pan-start-icon`: Replaces the glyph inside the button that pans toward the start of a line of text.
@@ -69182,6 +69575,7 @@ export type CustomElementsSolidJs = {
69182
69575
  * - `fullscreen`: While the board fills the screen.
69183
69576
  * - `holding`: An item picked up with a click follows the pointer until the next press puts it down.
69184
69577
  * - `idle`: The user has been still for `idle-delay` milliseconds. The board's own controls stay; select on it to hide chrome of your own.
69578
+ * - `loading`: While `loading` is set.
69185
69579
  * - `pressing`: While a press on the board, its cards or its connections is under way.
69186
69580
  * - `sharing`: The page keeps the plain wheel and one finger, with `gestures="cooperative"` or while a board with `gestures="activate"` waits to be pressed.
69187
69581
  * - `using`: A board with `gestures="activate"` has been pressed and has the gestures.
@@ -72560,7 +72954,17 @@ export type CustomElementsSolidJs = {
72560
72954
  * The button is named `label`, or the host's `aria-label`, and its name
72561
72955
  * changes to `copied-label` or `error-label` for the moment after a press. The
72562
72956
  * same words are said in a live region, so a screen reader hears the result,
72563
- * and the tooltip shows them.
72957
+ * and the tooltip shows them. The tooltip does not also describe the button,
72958
+ * since its words are the button's name.
72959
+ *
72960
+ * **The tooltip.** It shows the name on hover and focus and the result after a
72961
+ * press. `tooltip="copy"` shows it only for the result, and `tooltip="none"`
72962
+ * draws none, as Web Awesome's copy button offers. `tooltip-placement` is the
72963
+ * side it prefers, and it moves to another side where that one does not fit.
72964
+ *
72965
+ * **Words on the button.** `show-label` draws the name beside the icon, and
72966
+ * the result in its place after a press. The button is as wide as the longest
72967
+ * of the three, so a press does not resize it.
72564
72968
  *
72565
72969
  * ## Attributes & Properties
72566
72970
  *
@@ -72583,6 +72987,15 @@ export type CustomElementsSolidJs = {
72583
72987
  * Defaulted rather than left empty. An icon-only control must be named, and
72584
72988
  * the name of this one is not a judgment call: every copy button in the
72585
72989
  * world is called Copy. A consumer with a better word still sets it.
72990
+ * - `show-label`/`showLabel`: Draws the name as words beside the icon, and the result in their place
72991
+ * after a press. The button stays as wide as the longest of them.
72992
+ * - `tooltip`: When the tooltip shows: `full` on hover and focus and after a press,
72993
+ * `copy` only after a press, to show the result, and `none` never, for a
72994
+ * button whose result shows another way, such as under `show-label`.
72995
+ *
72996
+ * Unset is `full`, and the attribute stays absent until you write it.
72997
+ * - `tooltip-placement`/`tooltipPlacement`: The side the tooltip prefers. It moves to another side where this one
72998
+ * does not fit.
72586
72999
  * - `value`: The text copied to the clipboard.
72587
73000
  *
72588
73001
  * It replaces `Button.value`, the submit value: a copy button never submits,
@@ -72744,6 +73157,7 @@ export type CustomElementsSolidJs = {
72744
73157
  * - `live`: The live region that says `copied-label` or `error-label` after a press, and `pending-label` when the button becomes pending under focus. It is rendered from the first time it says anything.
72745
73158
  * - `mark`: The clipboard icon, and the confirmation icon that replaces it.
72746
73159
  * - `spinner`: The ring a pending button turns, an empty element the styled button draws over the icon. It is rendered only while the button is pending.
73160
+ * - `text`: The words beside the icon, under `show-label`. It holds all three, `label`, `copied-label` and `error-label`, with all but the current one hidden.
72747
73161
  * - `tooltip`: The tooltip bubble, forwarded from the tooltip inside the button.
72748
73162
  * - `tooltip-arrow`: The tooltip's arrow, which points at the button.
72749
73163
  * - `tooltip-arrow-bottom`: The arrow while the bubble is below the button, on the bubble's top edge. Set together with `tooltip-arrow`.
@@ -77065,6 +77479,9 @@ export type CustomElementsSolidJs = {
77065
77479
  * - `linked-both-label`/`linkedBothLabel`: How a note linked both to and from the selected one is described, with `{note}`.
77066
77480
  * - `linked-from-label`/`linkedFromLabel`: How a note the selected one links to is described, with `{note}`, the selected note's name.
77067
77481
  * - `links-to-label`/`linksToLabel`: How a note that links to the selected one is described, with `{note}`.
77482
+ * - `loading`: Marks the graph as busy while its notes arrive: the list is `aria-busy`,
77483
+ * and the panel says so where it holds no notes yet.
77484
+ * - `loading-label`/`loadingLabel`: What the panel says while `loading` is set and the list holds no notes.
77068
77485
  * - `moved-down-label`/`movedDownLabel`: What screen readers hear once the drawing has moved down, after `moved()`.
77069
77486
  * - `moved-left-label`/`movedLeftLabel`: What screen readers hear once the drawing has moved left, after `moved()`.
77070
77487
  * - `moved-right-label`/`movedRightLabel`: What screen readers hear once the drawing has moved right, after `moved()`.
@@ -77173,6 +77590,15 @@ export type CustomElementsSolidJs = {
77173
77590
  * - `hiddenGroups`: The groups turned off in the legend, by name, whose notes neither the drawing nor the list shows. A property, never an attribute. (property only)
77174
77591
  * - `links`: The links between notes, each from `source` to `target`. A property, never an attribute. (property only)
77175
77592
  * - `nodes`: The notes. A property, never an attribute. (property only)
77593
+ * - `noteContent`: What each note's row in the list shows in place of its name: a function
77594
+ * given the note that returns text, an element or a Lit template.
77595
+ *
77596
+ * For an icon by its kind, or a date under its name, as React Aria's
77597
+ * `ListBoxItem` takes children. The row is still named by the note's name,
77598
+ * which typeahead and the search find it by, and described by how it stands
77599
+ * to the selected note. Return the name with your content where it should
77600
+ * still show. A property only, there being no way to write a function in
77601
+ * markup. (property only)
77176
77602
  * - `ready`: Whether the graph has been drawn whole. For code that runs after `helix-graph-ready`. (property only) (readonly)
77177
77603
  * - `whenSettled`: Resolves a frame after the first update, when transitions are switched on.
77178
77604
  *
@@ -77219,6 +77645,7 @@ export type CustomElementsSolidJs = {
77219
77645
  * - `footer`: Content below the graph.
77220
77646
  * - `fullscreen-icon`: Replaces the glyph inside the fullscreen button.
77221
77647
  * - `header`: Content above the graph.
77648
+ * - `loading`: What the panel shows while `loading` is set and the list holds no notes. Defaults to `loading-label`.
77222
77649
  * - `pan-down-icon`: Replaces the glyph inside the pan down button.
77223
77650
  * - `pan-end-icon`: Replaces the glyph inside the button that pans toward the end of a line of text.
77224
77651
  * - `pan-start-icon`: Replaces the glyph inside the button that pans toward the start of a line of text.
@@ -77292,6 +77719,7 @@ export type CustomElementsSolidJs = {
77292
77719
  * - `legend-swatch`: The mark in a group's color, before its name.
77293
77720
  * - `list`: The list of notes, which draws only the rows in view.
77294
77721
  * - `live`: What screen readers hear: how many notes there are when a search or the legend changes it, and which way the drawing went after a key or a control moved it.
77722
+ * - `loading`: The box in place of the list while `loading` is set and it holds no notes, holding the `loading` slot.
77295
77723
  * - `note`: One note in the list.
77296
77724
  * - `note-cursor`: The note the keyboard is on in the list.
77297
77725
  * - `note-linked`: A note linked to or from the selected one.
@@ -77319,6 +77747,7 @@ export type CustomElementsSolidJs = {
77319
77747
  * - `empty`: The list holds no notes: the graph has none, or a search or the groups hid them all.
77320
77748
  * - `fullscreen`: The graph fills the screen.
77321
77749
  * - `idle`: The user has been still long enough for the header and footer to fade.
77750
+ * - `loading`: While `loading` is set.
77322
77751
  * - `local`: The drawing shows the selected note's local graph, with `depth`.
77323
77752
  * - `panel-open`: A graph with `no-panel` has the search and the list open over the drawing.
77324
77753
  * - `ready`: The graph has been drawn whole, after `helix-graph-ready`.
@@ -79894,7 +80323,8 @@ export type CustomElementsSolidJs = {
79894
80323
  * itself.
79895
80324
  * - `value`: The selected rows' values, separated by commas with no spaces, such as `a,c`, in a list that selects.
79896
80325
  *
79897
- * Set it to start with rows selected. A row's value is its `value`, or its
80326
+ * A press or a key writes it in row order, as Data Table does, whatever
80327
+ * order the rows were chosen in. Set it to start with rows selected. A row's value is its `value`, or its
79898
80328
  * words where it has none.
79899
80329
  * - `rows`: The rows the list holds, in order. (property only) (readonly)
79900
80330
  * - `whenSettled`: Resolves a frame after the first update, when transitions are switched on.
@@ -84236,6 +84666,22 @@ export type CustomElementsSolidJs = {
84236
84666
  * headings are far apart, none is in the band and no section is marked, and
84237
84667
  * when they are close together, several are in the band at once.
84238
84668
  *
84669
+ * **Several sections at once.** `marks="visible"` marks the link of every
84670
+ * section with part of it on screen, from the reading line to the bottom of
84671
+ * what the sections scroll in, as Zag's table of contents marks its active
84672
+ * ids. The mark then runs from the first of those links to the last, and
84673
+ * `marked` lists their ids in page order.
84674
+ *
84675
+ * **Going to a section from code.** `scrollToSection(id)` scrolls to the
84676
+ * section as a press on its link does, with `behavior`, and marks its link at
84677
+ * once.
84678
+ *
84679
+ * **Styling a link by its state.** Each link the outline finds carries
84680
+ * `data-depth`, its depth in the outline from `1`, nested lists and
84681
+ * `data-level` alike, and `aria-current="location"` while its section is
84682
+ * marked, so `a[aria-current]` and `a[data-depth="2"]` are the hooks for a
84683
+ * rule of yours.
84684
+ *
84239
84685
  * ## Attributes & Properties
84240
84686
  *
84241
84687
  * Component attributes and properties that can be applied to the element or by using JavaScript.
@@ -84265,6 +84711,9 @@ export type CustomElementsSolidJs = {
84265
84711
  * box the sections scroll in.
84266
84712
  * - `label`: The navigation's name, read by screen readers. A heading in the `heading`
84267
84713
  * slot names it in place of this.
84714
+ * - `marks`: Which links are marked. `reading` marks the one section being read, the
84715
+ * last whose heading has passed the reading line. `visible` marks every
84716
+ * section with part of it on screen, and the mark runs across their links.
84268
84717
  * - `offset`: How far below the top of the scroll container a heading counts as reached,
84269
84718
  * in pixels. The scroll container is the window or the panel the sections
84270
84719
  * scroll in.
@@ -84280,6 +84729,9 @@ export type CustomElementsSolidJs = {
84280
84729
  * writable property in this library that a component also writes is state a
84281
84730
  * consumer can own; this one cannot be, and saying so with the type is better
84282
84731
  * than saying it in a sentence nobody reads. (property only) (readonly)
84732
+ * - `marked`: The ids of the sections whose links are marked, in page order: the one
84733
+ * `current` names, or under `marks="visible"` every section on screen.
84734
+ * Read-only, for the reason `current` gives. (property only) (readonly)
84283
84735
  * - `whenSettled`: Resolves a frame after the first update, when transitions are switched on.
84284
84736
  *
84285
84737
  * **Named `whenSettled` because `settled` is taken four times over**, by
@@ -84315,6 +84767,14 @@ export type CustomElementsSolidJs = {
84315
84767
  * - `heading`: A heading above the links, such as "On this page". It names the navigation.
84316
84768
  * - `indicator`: A mark of your own, drawn inside the `indicator` part, where `--indicator-x`, `--indicator-y`, `--indicator-inline-size` and `--indicator-block-size` reach it.
84317
84769
  *
84770
+ * ## Methods
84771
+ *
84772
+ * Methods that can be called to access component functionality.
84773
+ *
84774
+ * - `scrollToSection(id: string) => boolean`: Scrolls to the section with this id, as a press on its link does, with
84775
+ * `behavior`, and marks its link at once. The address and focus stay where
84776
+ * they are. Returns whether the outline has a link to that section.
84777
+ *
84318
84778
  * ## CSS Parts
84319
84779
  *
84320
84780
  * Custom selectors for styling elements within the component.
@@ -88336,7 +88796,11 @@ export type CustomElementsSolidJs = {
88336
88796
  * back to the position where the collapsing gesture began. A drag records that position
88337
88797
  * on press, and every other way of collapsing records it in `settle`.
88338
88798
  * `collapsed-size` keeps a sliver of the pane visible, such as a tab strip.
88339
- * Collapsing overrides `min` and `max`.
88799
+ * Collapsing overrides `min` and `max`. `collapsible` says which panes can be
88800
+ * collapsed at all, as Zag's panels each say.
88801
+ *
88802
+ * `min` is the least the start pane keeps and `end-min` the least the end pane
88803
+ * keeps, each a percentage or a CSS length such as `16rem`.
88340
88804
  *
88341
88805
  * Set `primary` to the pane that keeps its size when the splitter's own size
88342
88806
  * changes, such as a sidebar beside a window being resized. The other pane
@@ -88357,7 +88821,7 @@ export type CustomElementsSolidJs = {
88357
88821
  * | Left, Right | Moves a side-by-side divider by `step`. On a right-to-left page, Left moves it toward the end. |
88358
88822
  * | Up, Down | Moves a stacked divider by `step`. |
88359
88823
  * | Home, End | Moves the divider to its bounds. |
88360
- * | Enter | Collapses the start pane, and opens it again. |
88824
+ * | Enter | Collapses the start pane, or the end pane where `collapsible="end"`, and opens it again. |
88361
88825
  * | F6 | Moves focus from one pane to the first control in the other, and from the divider to the start pane. |
88362
88826
  *
88363
88827
  * ## Attributes & Properties
@@ -88387,6 +88851,12 @@ export type CustomElementsSolidJs = {
88387
88851
  * that should survive its own collapse says how much of itself to keep, and
88388
88852
  * only whoever put it there knows that, which is the same reason `min` is a
88389
88853
  * consumer's to set.
88854
+ * - `collapsible`: Which panes can be collapsed, as Zag's panels each take `collapsible`:
88855
+ * `start`, `end`, `both`, or `none`. A pane that cannot be collapsed stops
88856
+ * at the edge without shutting. `Enter` collapses the end pane where only
88857
+ * the end pane can be collapsed, and the start pane otherwise.
88858
+ *
88859
+ * Unset is `both`, and the attribute stays absent until you write it.
88390
88860
  * - `corner-label`/`cornerLabel`: The name of the handle where two dividers cross, read by screen readers.
88391
88861
  * - `corner-value-label`/`cornerValueLabel`: What the handle where two dividers cross says it is set to, both dividers
88392
88862
  * at once: `{across}` is where the divider that runs down stands, and
@@ -88397,6 +88867,11 @@ export type CustomElementsSolidJs = {
88397
88867
  * these words are the whole of where it is.
88398
88868
  * - `default-collapsed`/`defaultCollapsed`: Which pane starts shut, when `collapsed` is not set.
88399
88869
  * - `default-position`/`defaultPosition`: Where the divider starts, when `position` is not set.
88870
+ * - `end-min`/`endMin`: The least the end pane keeps, in the units `min` takes: a percentage, or
88871
+ * a CSS length such as `16rem` resolved against the splitter's box. The
88872
+ * divider stops that far from the end, whatever `max` allows, so `min` and
88873
+ * `end-min` hold a minimum for each pane, as Zag's panels each take
88874
+ * `minSize`.
88400
88875
  * - `label`: The divider's name, read by screen readers.
88401
88876
  *
88402
88877
  * An `aria-label` or `aria-labelledby` on the host names the divider too,
@@ -90511,7 +90986,8 @@ export type CustomElementsSolidJs = {
90511
90986
  * not disabled. `selection-behavior="replace"` selects the tag a reader
90512
90987
  * presses or moves to alone, as a file list does, and Control or Command
90513
90988
  * with a press or Space adds or takes out one tag. `disallow-empty-selection`
90514
- * keeps one tag selected once one is. `value` holds the
90989
+ * keeps one tag selected once one is, and Escape lets go of the selection
90990
+ * otherwise. `value` holds the
90515
90991
  * selected tags' values, separated by commas, and a change asks with
90516
90992
  * `helix-before-change` and tells with `change`. Enter on a tag with an
90517
90993
  * `href` follows its link. A `disabled` tag is passed over. A selected tag
@@ -90529,6 +91005,12 @@ export type CustomElementsSolidJs = {
90529
91005
  * Where only disabled tags are left, the first of them holds the tab stop and
90530
91006
  * takes focus, so the reader stays in the set.
90531
91007
  *
91008
+ * **Typing new tags.** A field where people type tags and press Enter to add
91009
+ * each one is Combobox with `multiple` and `allows-custom-value`, or
91010
+ * `creatable` to ask first with `helix-create`. It draws each value as a tag,
91011
+ * Backspace on the empty field removes the last one, and the arrow keys move
91012
+ * between them.
91013
+ *
90532
91014
  * ## Attributes & Properties
90533
91015
  *
90534
91016
  * Component attributes and properties that can be applied to the element or by using JavaScript.
@@ -90634,6 +91116,12 @@ export type CustomElementsSolidJs = {
90634
91116
  * selected. Its remove button leaves the tab order there, Delete and Backspace
90635
91117
  * doing its job from the row.
90636
91118
  *
91119
+ * **Styling a tag by what is happening to it.** `:state(selected)` while it is
91120
+ * selected, `:state(focus-visible)` while its cell shows keyboard focus,
91121
+ * `[disabled]` while it is out of reach, and the host's own `:hover` and
91122
+ * `:active` under the pointer, as React Aria's `data-hovered` and
91123
+ * `data-pressed` are.
91124
+ *
90637
91125
  * ## Attributes & Properties
90638
91126
  *
90639
91127
  * Component attributes and properties that can be applied to the element or by using JavaScript.
@@ -90726,6 +91214,7 @@ export type CustomElementsSolidJs = {
90726
91214
  *
90727
91215
  * These can be used to apply styling when a component is in a given state.
90728
91216
  *
91217
+ * - `focus-visible`: The tag's cell has keyboard focus that the browser shows, in a `Tag.Group`.
90729
91218
  * - `selected`: The tag is selected in a `Tag.Group` that selects.
90730
91219
  * - `settled`: Set one frame after the first render. Transitions wait for it, so an element does not animate its own arrival.
90731
91220
  */
@@ -91739,6 +92228,17 @@ export type CustomElementsSolidJs = {
91739
92228
  * imperatively later, and nothing is hydrating by then.
91740
92229
  *
91741
92230
  * Here rather than on each control.
92231
+ * - `timeContent`: What each time in the list shows: a function given the time as `HH:mm`,
92232
+ * or `HH:mm:ss` with `seconds`, and the time as the row writes it, that
92233
+ * returns text, an element or a Lit template.
92234
+ *
92235
+ * For the seats left at a time, or a caption under it, as React Aria's
92236
+ * `ListBoxItem` takes children. Content with `slot="start"`, `slot="end"`
92237
+ * or `slot="description"` goes to that slot of the row, and a description
92238
+ * is read after the time. The row is still named by the written time, and
92239
+ * typeahead still finds it by that. Return the written time with your
92240
+ * content where it should still show. A property only, there being no way
92241
+ * to write a function in markup. The wheels draw their own figures. (property only)
91742
92242
  * - `valueAsDate`: The value as a `Date` on 1 January 1970 UTC, or `null` while there is no time.
91743
92243
  *
91744
92244
  * The platform's own pair on `<input type="time">`, epoch day included: a time
@@ -92017,7 +92517,9 @@ export type CustomElementsSolidJs = {
92017
92517
  * hours ago", from `datetime`, where the `time` slot is empty. The words move
92018
92518
  * on as they go stale, "3 hours ago" becoming "4 hours ago", with one wakeup
92019
92519
  * shared by every reading on the page, as `FormatDate` keeps its own. They are
92020
- * in the language of the page, or of the nearest `lang`.
92520
+ * in the language of the page, or of the nearest `lang`. The whole date and
92521
+ * time is the reading's `title`, so a pointer resting on "3 hours ago" shows
92522
+ * when it was, and a screen reader reads it as the description.
92021
92523
  *
92022
92524
  * Each entry draws the connector line that arrives at it and hides it when it
92023
92525
  * is the first entry, using `:host(:first-child)`. This needs no index, no
@@ -92132,11 +92634,20 @@ export type CustomElementsSolidJs = {
92132
92634
  * Write the entries in the order the events happened, oldest or newest first,
92133
92635
  * and the layout only moves where they are drawn.
92134
92636
  *
92637
+ * **A feed that loads more entries sets `loading` while it fetches.** The
92638
+ * timeline is busy, and an entry after the last says "Loading more"
92639
+ * (`loading-label`, or your own content in the `loading` slot). Put a button
92640
+ * that asks for more after the timeline, and move focus to the first new
92641
+ * entry when they arrive.
92642
+ *
92135
92643
  * ## Attributes & Properties
92136
92644
  *
92137
92645
  * Component attributes and properties that can be applied to the element or by using JavaScript.
92138
92646
  *
92139
92647
  * - `label`: Accessible name for the timeline, for people who reach it out of context.
92648
+ * - `loading`: Marks the timeline as busy fetching more entries, and draws an entry
92649
+ * after the last that says so.
92650
+ * - `loading-label`/`loadingLabel`: The text of the entry drawn while `loading` is set, where the `loading` slot is empty.
92140
92651
  * - `whenSettled`: Resolves a frame after the first update, when transitions are switched on.
92141
92652
  *
92142
92653
  * **Named `whenSettled` because `settled` is taken four times over**, by
@@ -92163,11 +92674,19 @@ export type CustomElementsSolidJs = {
92163
92674
  * Areas where markup can be added to the component.
92164
92675
  *
92165
92676
  * - `(default)`: The entries, and any groups of them.
92677
+ * - `loading`: Content for the entry after the last while `loading` is set. Falls back to `loading-label`.
92678
+ *
92679
+ * ## CSS Parts
92680
+ *
92681
+ * Custom selectors for styling elements within the component.
92682
+ *
92683
+ * - `loading`: The entry after the last while `loading` is set.
92166
92684
  *
92167
92685
  * ## CSS States
92168
92686
  *
92169
92687
  * These can be used to apply styling when a component is in a given state.
92170
92688
  *
92689
+ * - `loading`: While `loading` is set.
92171
92690
  * - `settled`: Set one frame after the first render. Transitions wait for it, so an element does not animate its own arrival.
92172
92691
  */
92173
92692
  "helix-headless-timeline": Partial<
@@ -93068,6 +93587,9 @@ export type CustomElementsSolidJs = {
93068
93587
  * describes a Helix component and leaves a plain element undescribed. In the
93069
93588
  * `for` form the tooltip itself is out of the accessibility tree while its
93070
93589
  * bubble is down, so you meet its words once, as the trigger's description.
93590
+ * A trigger whose name is already the tooltip's words, such as an icon button
93591
+ * named Settings under a tooltip reading Settings, is not described by them
93592
+ * again.
93071
93593
  *
93072
93594
  * The tooltip shows on hover and on focus. It hides on pointer leave, on blur,
93073
93595
  * on Escape, and when the trigger is activated. The pointer can move from the
@@ -95148,11 +95670,14 @@ export type CustomElementsSolidJs = {
95148
95670
  * | Page Down, Page Up | Moves by the number of items, or of lines in a grid, on screen. |
95149
95671
  * | A letter or a word | Moves to the next item whose text starts with what you typed. |
95150
95672
  * | Escape | Lets go of every chosen item, in a list with `selection-mode`. |
95673
+ * | Alt with Up or Down | In a `reorderable` list, moves the item a place. Alt with Home or End moves it to either end. |
95151
95674
  * | Tab | Moves into the focused row's own links and buttons, then out of the list. |
95152
95675
  *
95153
95676
  * An item that is not drawn is scrolled into view and focused, so a keyboard
95154
- * reaches the whole set. When the row holding the tab stop scrolls away, the
95155
- * stop moves to the first row on screen. Typing matches each item's
95677
+ * reaches the whole set. The row a reader last focused keeps the tab stop and
95678
+ * stays drawn when it scrolls away, so Tab and Shift+Tab come back to it, as
95679
+ * React Aria's collections do. In a list nobody has focused yet, the stop
95680
+ * moves to the first row on screen. Typing matches each item's
95156
95681
  * `text-field`, which is the first `data-field` of the row template by default,
95157
95682
  * or the item itself when it is a string or a number.
95158
95683
  *
@@ -95194,6 +95719,23 @@ export type CustomElementsSolidJs = {
95194
95719
  * the last item says "Loading more" (`loading-label`, or your own content in
95195
95720
  * the `loading` slot). `scrollToIndex` takes a reader to an item.
95196
95721
  *
95722
+ * **Moving items** is a separate import, `@fusion.dev/helix/virtual-list/reorder`,
95723
+ * as React Aria's drag and drop is. With it imported, `reorderable` lets a
95724
+ * reader move items in a list of one column without sections:
95725
+ *
95726
+ * - Alt with Up or Down moves the item the keys are on a place, and Alt with
95727
+ * Home or End to either end, as the APG's rearrangeable listbox does.
95728
+ * - A pointer drags a whole row. A press that does not travel is still a
95729
+ * press. The list scrolls near an edge, and an item far down a long set is
95730
+ * reached by dragging to the edge.
95731
+ * - A drop sends `helix-before-reorder`, which you can refuse, and then
95732
+ * `helix-reorder`, whose `keys` hold every item's key in the new order.
95733
+ * **You move the items**: set `items` to them in that order. The keys stay
95734
+ * on the item that moved.
95735
+ * - Each move is said in a region screen readers announce. The row being
95736
+ * dragged carries `data-dragging`, and the row a drop would land beside
95737
+ * `data-drop-before` or `data-drop-after`.
95738
+ *
95197
95739
  * **An empty list.** Set `empty-label`, or put your own content in the `empty`
95198
95740
  * slot, for a row shown when there are no items and none are loading, such as
95199
95741
  * "No messages yet" and a link to write one. Without either, an empty list
@@ -95272,6 +95814,12 @@ export type CustomElementsSolidJs = {
95272
95814
  * and scrolls it sideways: Left and Right move between items, the other
95273
95815
  * way round on a right-to-left page, and `estimate` is an item's width. A
95274
95816
  * grid always runs down.
95817
+ * - `reorderable`: Lets a reader move items, once `@fusion.dev/helix/virtual-list/reorder`
95818
+ * (or `@fusion.dev/helix-headless/virtual-list/reorder`) is imported: Alt
95819
+ * with an arrow moves the row the keys are on, and a pointer drags a row.
95820
+ * The list moves no item itself: you move your `items` on `helix-reorder`.
95821
+ * Without that import it does nothing, so a list that never moves items
95822
+ * carries none of the code. A list of one column, without sections.
95275
95823
  * - `section-field`/`sectionField`: The field of each item that names its section, as a key or a path of
95276
95824
  * keys. Set, the items are drawn in sections: a header, then the items, in
95277
95825
  * an element with the `group` role that the header names. A section starts
@@ -95334,8 +95882,10 @@ export type CustomElementsSolidJs = {
95334
95882
  *
95335
95883
  * - `change`: Fired once a press or a key has changed which items are selected, in a list with `selection-mode`.
95336
95884
  * - `helix-before-change`: Fired before a press or a key changes which items are selected, with the `value` it would leave. Cancelable.
95885
+ * - `helix-before-reorder`: Fired when an item is dropped at a new place, in a `reorderable` list with `@fusion.dev/helix/virtual-list/reorder` imported, with every key in the new order. Cancelable: cancel it to keep the item where it is.
95337
95886
  * - `helix-load-more`: Fired when a reader comes within one screen of the last item, once for each length of the set.
95338
95887
  * - `helix-range-change`: Fired when the items on screen change, with the new `first` and `last`, which `range` also holds.
95888
+ * - `helix-reorder`: Fired after `helix-before-reorder` when nobody canceled it. Set `items` to the order in `keys`. Cancelable: cancel it to say the move did not happen.
95339
95889
  *
95340
95890
  * ## Slots
95341
95891
  *