@fusion.dev/helix-headless 0.177.1 → 0.178.0

package/types/vue.d.ts

@@ -5540,10 +5540,22 @@ Empty is the reader's own. Dates are plain `YYYY-MM-DD` and carry no zone. */
   /** The message shown when `disable-dates` or `disable-days` bars a date. */
   unavailableMessage?: (HelixHeadlessDateInput["unavailableMessage"]) | undefined;
   /** The message for text that is no date, where `bad-input-message` is not
-set. `{mode}` is `single`, `range`, or `multiple`. */
+set. `{mode}` is `single`, `range`, or `multiple`, and `{example}` is a
+date written as the field writes one, `August 24, 2026` in `en-US` and
+`24. August 2026` in `de-DE` at the default `date-style`.
+
+**The default names a date the field reads back.** It said "Enter a date
+as YYYY-MM-DD." to a reader whose field showed `August 4, 2026`, and a
+pattern token is words for a developer. Time Input says the same. */
   "unreadable-message"?: (HelixHeadlessDateInput["unreadableMessage"]) | undefined;
   /** The message for text that is no date, where `bad-input-message` is not
-set. `{mode}` is `single`, `range`, or `multiple`. */
+set. `{mode}` is `single`, `range`, or `multiple`, and `{example}` is a
+date written as the field writes one, `August 24, 2026` in `en-US` and
+`24. August 2026` in `de-DE` at the default `date-style`.
+
+**The default names a date the field reads back.** It said "Enter a date
+as YYYY-MM-DD." to a reader whose field showed `August 4, 2026`, and a
+pattern token is words for a developer. Time Input says the same. */
   unreadableMessage?: (HelixHeadlessDateInput["unreadableMessage"]) | undefined;
   /** The name of the calendar's heading where it shows a page of years, with
 `{heading}` filled in. */
@@ -5834,16 +5846,24 @@ export type HelixHeadlessDatePickerVueProps = {
 **Every sentence a control raises in the browser's bubble is a property**,
 named for the validity flag it reports, so a form in another language
 speaks it. Unset is the sentence registered for the page's language, then
-the English. `{mode}` is `single`, `range` or `multiple`, so each can have
-its own sentence. */
+the English. `{example}` is a date written as the calendar names one,
+`August 24, 2026` in `en-US` and `24. August 2026` in `de-DE`, and `{mode}`
+is `single`, `range` or `multiple`, so each can have its own sentence.
+
+**The default names a date in words.** It said "Enter a date as
+YYYY-MM-DD.", and a pattern token is words for a developer. */
   "bad-input-message"?: (HelixHeadlessDatePicker["badInputMessage"]) | undefined;
   /** The validation message for a value that is not a date.
 
 **Every sentence a control raises in the browser's bubble is a property**,
 named for the validity flag it reports, so a form in another language
 speaks it. Unset is the sentence registered for the page's language, then
-the English. `{mode}` is `single`, `range` or `multiple`, so each can have
-its own sentence. */
+the English. `{example}` is a date written as the calendar names one,
+`August 24, 2026` in `en-US` and `24. August 2026` in `de-DE`, and `{mode}`
+is `single`, `range` or `multiple`, so each can have its own sentence.
+
+**The default names a date in words.** It said "Enter a date as
+YYYY-MM-DD.", and a pattern token is words for a developer. */
   badInputMessage?: (HelixHeadlessDatePicker["badInputMessage"]) | undefined;
   /** The calendar the heading, the days, and the months are written in.
 
@@ -7225,6 +7245,14 @@ an icon. */
   /** The name of the clear button, read by screen readers. The button shows only
 an icon. */
   clearLabel?: (HelixHeadlessFilterInput["clearLabel"]) | undefined;
+  /** How long typing rests before `source` is asked, in milliseconds. A delay
+sends one request for a word in place of one for each letter. The arrow
+keys and Enter ask at once. `0` asks on every keystroke. */
+  "filter-delay"?: (HelixHeadlessFilterInput["filterDelay"] | `${number}`) | undefined;
+  /** How long typing rests before `source` is asked, in milliseconds. A delay
+sends one request for a word in place of one for each letter. The arrow
+keys and Enter ask at once. `0` asks on every keystroke. */
+  filterDelay?: (HelixHeadlessFilterInput["filterDelay"]) | undefined;
   /** Whether the panel narrows itself to the suggestions that hold the term
 being typed, as React Aria's Autocomplete filters. Off, the panel shows
 what you slot and you narrow it. */
@@ -7418,6 +7446,13 @@ imperatively later, and nothing is hydrating by then.
 
 Here rather than on each control. */
   name?: (HelixHeadlessFilterInput["name"]) | undefined;
+  /** Where the suggestions come from: a function given the term at the caret,
+the field it is a value of, the whole text, and an `AbortSignal`, which
+returns the suggestions or a promise of them. Each is a string, or a
+`value` with a `label` and `disabled`. The field draws them as options in
+the panel, beside any you slot. A property only, there being no way to
+write a function in markup. See the class description. */
+  source?: (HelixHeadlessFilterInput["source"]) | undefined;
 };
 
 export type HelixHeadlessFilterInputVueEvents = {
@@ -7433,7 +7468,7 @@ export type HelixHeadlessFilterInputVueEvents = {
   "helix-dismiss": HelixHeadlessFilterInputHelixDismissElementEvent;
   /** Fired when a filter changes, whether it was typed, picked, or removed. Cancelable: call `preventDefault()` to leave the text and the chip as they were. */
   "helix-facet": HelixHeadlessFilterInputHelixFacetElementEvent;
-  /** Fired by an option in `suggestions` when it is chosen, and bubbles out of the field. Cancelable: call `preventDefault()` to stop other listeners acting on it. The field takes no action on a choice; you decide what it does. */
+  /** Fired by an option in `suggestions` when it is chosen, and bubbles out of the field. Cancelable: call `preventDefault()` to stop other listeners acting on it. The field takes no action on an option you slotted, and you decide what it does. A suggestion from `source` is written over the term at the caret unless you cancel it. */
   "helix-select": HelixHeadlessFilterInputHelixSelectElementEvent;
   /** Fired when the text changes. */
   input: HelixHeadlessFilterInputElementEvent;
@@ -7665,6 +7700,14 @@ or hides its notes. Drawn where the notes have two groups or more. */
   "legend-label"?: (HelixHeadlessGraph["legendLabel"]) | undefined;
   /** The legend's name, read by screen readers. */
   legendLabel?: (HelixHeadlessGraph["legendLabel"]) | undefined;
+  /** What screen readers hear when a walk along the links reaches a note that
+has no link to follow, or goes back to a note: `{note}` for its name and
+`{count}` for how many notes the list holds that it links to or from. */
+  "link-count-label"?: (HelixHeadlessGraph["linkCountLabel"]) | undefined;
+  /** What screen readers hear when a walk along the links reaches a note that
+has no link to follow, or goes back to a note: `{note}` for its name and
+`{count}` for how many notes the list holds that it links to or from. */
+  linkCountLabel?: (HelixHeadlessGraph["linkCountLabel"]) | undefined;
   /** How a note linked both to and from the selected one is described, with `{note}`. */
   "linked-both-label"?: (HelixHeadlessGraph["linkedBothLabel"]) | undefined;
   /** How a note linked both to and from the selected one is described, with `{note}`. */
@@ -7744,6 +7787,16 @@ the list then holds, written with `count-label`. */
   "using-label"?: (HelixHeadlessGraph["usingLabel"]) | undefined;
   /** The line shown while the graph, with `gestures="activate"`, has the gestures. */
   usingLabel?: (HelixHeadlessGraph["usingLabel"]) | undefined;
+  /** What screen readers hear when a walk along the links moves to a note:
+`{note}` for its name, `{relation}` for how it stands to the note the
+step came from, such as "Linked from Roadmap", and `{index}` and `{count}`
+for its place among that note's links. */
+  "walk-label"?: (HelixHeadlessGraph["walkLabel"]) | undefined;
+  /** What screen readers hear when a walk along the links moves to a note:
+`{note}` for its name, `{relation}` for how it stands to the note the
+step came from, such as "Linked from Roadmap", and `{index}` and `{count}`
+for its place among that note's links. */
+  walkLabel?: (HelixHeadlessGraph["walkLabel"]) | undefined;
   /** The hint shown when the wheel scrolls past the graph with
 `gestures="cooperative"`. `{key}` is ⌘ on a Mac and Ctrl elsewhere. */
   "wheel-hint-label"?: (HelixHeadlessGraph["wheelHintLabel"]) | undefined;
@@ -7936,7 +7989,7 @@ export type HelixHeadlessGraphVueEvents = {
   "helix-graph-layout": HelixHeadlessGraphHelixGraphLayoutElementEvent;
   /** A pan button or arrow key was pressed. `connectGraph` moves the drawing, then calls `moved()`. */
   "helix-graph-pan": HelixHeadlessGraphHelixGraphPanElementEvent;
-  /** The notes, the links, the selection, the depth or the gestures changed. Used by `connectGraph`; pages do not need to listen for it. */
+  /** The notes, the links, the selection, the depth, the note the keys are on, or the gestures changed. Used by `connectGraph`; pages do not need to listen for it. */
   "helix-graph-part-change": HelixHeadlessGraphHelixGraphPartChangeElementEvent;
   /** The graph has been drawn whole, laid out and settled. Sent each time `drawn()` says it is drawn after it was not. */
   "helix-graph-ready": HelixHeadlessGraphHelixGraphReadyElementEvent;
@@ -16581,18 +16634,28 @@ export type HelixHeadlessTimePickerVueProps = {
 **Every sentence a control raises in the browser's bubble is a property**,
 named for the validity flag it reports, so a form in another language
 speaks it. Unset is the sentence registered for the page's language, then
-the English. `{shape}` is how a time is written, `HH:mm` or `HH:mm:ss`, and
-`{mode}` is `single`, `range` or `multiple`, so each can have its own
-sentence. */
+the English. `{example}` is a time written as the picker writes one,
+`2:30 PM` in `en-US` and `14:30` in `de-DE`, `{shape}` is `HH:mm` or
+`HH:mm:ss`, and `{mode}` is `single`, `range` or `multiple`, so each can
+have its own sentence.
+
+**The default names a time as the picker shows one.** It said "Enter a
+time as HH:mm." to a reader whose list showed `2:30 PM`, and a pattern
+token is words for a developer. Time Input says the same. */
   "bad-input-message"?: (HelixHeadlessTimePicker["badInputMessage"]) | undefined;
   /** The validation message for a value that is not a time.
 
 **Every sentence a control raises in the browser's bubble is a property**,
 named for the validity flag it reports, so a form in another language
 speaks it. Unset is the sentence registered for the page's language, then
-the English. `{shape}` is how a time is written, `HH:mm` or `HH:mm:ss`, and
-`{mode}` is `single`, `range` or `multiple`, so each can have its own
-sentence. */
+the English. `{example}` is a time written as the picker writes one,
+`2:30 PM` in `en-US` and `14:30` in `de-DE`, `{shape}` is `HH:mm` or
+`HH:mm:ss`, and `{mode}` is `single`, `range` or `multiple`, so each can
+have its own sentence.
+
+**The default names a time as the picker shows one.** It said "Enter a
+time as HH:mm." to a reader whose list showed `2:30 PM`, and a pattern
+token is words for a developer. Time Input says the same. */
   badInputMessage?: (HelixHeadlessTimePicker["badInputMessage"]) | undefined;
   /** Times that cannot be chosen, as `HH:mm`, separated by commas or spaces.
 
@@ -19474,7 +19537,7 @@ export interface WcToolkitVueGlobalComponents {
     HelixHeadlessFilterOperatorVueProps,
     HelixHeadlessFilterOperatorVueEvents
   >;
-  /** Tokens are your own elements, slotted in. A filter can be a facet with a prefix, a saved query, or a range, and these belong to your model, so the element does not render tokens from a list of strings. Removing a token is a request the element fires, and you apply it. Combobox works the other way: its tokens show a selection it owns, drawn from the options it was given.  'value' is the typed text. Every keystroke fires 'input' with the text on the element, so a table can narrow as the user types. Backspace in an empty field fires 'helix-dismiss' on the last token, the same event its remove control fires, so one handler covers the pointer and the keyboard.  **What a form receives.** The text under 'name', and then one more entry under 'name' for each token, in the order the tokens stand:  | Token | Entry | |---|---| | Any element with a 'value' attribute | The value as written: 'saved:mine' | | 'FilterChip' with 'name' and values | 'status:open,pending' | | The same, with 'operator="none"' (what a typed '-status:' makes) | '-status:open,pending' | | The same, with any other 'operator' except 'any' | 'created[after]:2024' | | A token with neither | Nothing |  The values are the chip's text outside its 'field' and 'operator' slots, with the spaces around each comma removed. A server splits an entry at its first colon, reads a leading '-' as the negation, and reads a word in brackets before the colon as the comparison.  **Keyboard.** Focus stays in the text, which is the field's one tab stop. The text names the highlighted suggestion as its 'aria-activedescendant', and the arrow keys reach the tokens.  | Key | What it does | |---|---| | Enter | Presses the highlighted suggestion. With none highlighted, reads the typed filters into chips, or submits the form when there are none. | | Down, Up | Moves the highlight through the suggestions, wrapping, and opens the panel. | | Home, End | Highlights the first or the last suggestion while the panel is open. | | Escape | Closes the panel and stops there, so a dialog around the field stays open. With the panel closed, empties the text. In an empty field, does nothing, so the page hears it. | | Backspace | In an empty field, asks the last token to go. | | Left | With the caret at the start of the text, moves to the last token's remove button. Right on a right-to-left page. | | Left, Right on a token | Move between the tokens, and past the last back to the text. | | Delete, Backspace on a token | Asks the token to go. |  **Typed filters.** The field parses only the fields you declare. Write 'FilterField' elements, usually inside the 'FilterMenu' slotted into 'start', so the picker and the text share one set. On Enter, the field reads the text against them, and a paste is read the same way as soon as it lands. 'disposition:refunded,settled' and '-disposition:refunded' fire 'helix-facet' exactly as ticking those values in the picker would, and the parsed text is removed. Everything else stays, so 'refund tuesday disposition:settled' is a filter and a search at once. Helix defines the punctuation and you define every word. 'grammar.ts' has the full rule, so read it before you rely on it. A field with no 'FilterField' in it parses nothing.  A field whose values cannot be listed, such as 'assignee:ada', goes directly inside this element, outside the menu. It is not assigned to a slot, so nothing draws it and the menu has no page for it, and the grammar still reads it.  **The picker has an entry of its own.** 'FilterMenu' draws its pages with 'Menu', which a field without a picker does not need, so this family's entry leaves it out. A page that writes one imports '@fusion.dev/helix/filter-input/menu' as well, and a picker written without it is reported once the page has loaded, with the entry to add.  **Suggestions.** Slot options into 'suggestions' and the field shows them, moves through them with the arrow keys, and presses one on Enter. The option fires its own 'helix-select', and you decide what choosing it means. Keys before a colon and values after it use the same panel with different contents. 'filter-suggestions' narrows the panel to the options whose words hold the term at the caret, after its colon, ignoring case and accents, and hides the rest. 'readFilterText' is exported so you can narrow it yourself against partly typed text. While the panel is open, a reader hears how many suggestions it offers. The panel opens when it has options and closes when it has none, and a choice does not close it, so after picking a key you see its values next. Use 'selectionStart' and 'setSelectionRange' to write a completion back and put the caret after it, or the next parse reads the wrong term.  **State.** Three things have three different owners:  - 'value' is the text. The user types, the element applies it, and 'input'   reports it. Setting 'value' seeds or corrects the text, and the next   keystroke overwrites it, even in React. To control the value, cancel   'helix-before-change' and write the value you want, as with every field in   this library. 'default-value' seeds the field. - 'open' is the suggestions panel. Cancel 'helix-before-open' or   'helix-before-close' to control it, and use 'default-open' to seed it. - Tokens are your elements in a slot and hold no state. A token goes when you   remove it from your markup after 'helix-dismiss'. A 'FilterChip' naming a   declared field works differently, because the picker holds what is ticked   and removing the chip alone would leave its value ticked in the hidden   menu. Its dismissal is treated as the field being filtered by nothing, so   it fires 'helix-facet' like every other change, and the chip goes when the   filter goes. Set 'chips' and the field adds, updates, and removes those   chips itself, from every 'helix-facet' you do not cancel. */
+  /** Tokens are your own elements, slotted in. A filter can be a facet with a prefix, a saved query, or a range, and these belong to your model, so the element does not render tokens from a list of strings. Removing a token is a request the element fires, and you apply it. Combobox works the other way: its tokens show a selection it owns, drawn from the options it was given.  'value' is the typed text. Every keystroke fires 'input' with the text on the element, so a table can narrow as the user types. Backspace in an empty field fires 'helix-dismiss' on the last token, the same event its remove control fires, so one handler covers the pointer and the keyboard.  **What a form receives.** The text under 'name', and then one more entry under 'name' for each token, in the order the tokens stand:  | Token | Entry | |---|---| | Any element with a 'value' attribute | The value as written: 'saved:mine' | | 'FilterChip' with 'name' and values | 'status:open,pending' | | The same, with 'operator="none"' (what a typed '-status:' makes) | '-status:open,pending' | | The same, with any other 'operator' except 'any' | 'created[after]:2024' | | A token with neither | Nothing |  The values are the chip's text outside its 'field' and 'operator' slots, with the spaces around each comma removed. A server splits an entry at its first colon, reads a leading '-' as the negation, and reads a word in brackets before the colon as the comparison.  **Keyboard.** Focus stays in the text, which is the field's one tab stop. The text names the highlighted suggestion as its 'aria-activedescendant', and the arrow keys reach the tokens.  | Key | What it does | |---|---| | Enter | Presses the highlighted suggestion. With none highlighted, reads the typed filters into chips, or submits the form when there are none. | | Down, Up | Moves the highlight through the suggestions, wrapping, and opens the panel. | | Home, End | Highlights the first or the last suggestion while the panel is open. | | Escape | Closes the panel and stops there, so a dialog around the field stays open. With the panel closed, empties the text. In an empty field, does nothing, so the page hears it. | | Backspace | In an empty field, asks the last token to go. | | Left | With the caret at the start of the text, moves to the last token's remove button. Right on a right-to-left page. | | Left, Right on a token | Move between the tokens, and past the last back to the text. | | Delete, Backspace on a token | Asks the token to go. |  **Typed filters.** The field parses only the fields you declare. Write 'FilterField' elements, usually inside the 'FilterMenu' slotted into 'start', so the picker and the text share one set. On Enter, the field reads the text against them, and a paste is read the same way as soon as it lands. 'disposition:refunded,settled' and '-disposition:refunded' fire 'helix-facet' exactly as ticking those values in the picker would, and the parsed text is removed. Everything else stays, so 'refund tuesday disposition:settled' is a filter and a search at once. Helix defines the punctuation and you define every word. 'grammar.ts' has the full rule, so read it before you rely on it. A field with no 'FilterField' in it parses nothing.  A field whose values cannot be listed, such as 'assignee:ada', goes directly inside this element, outside the menu. It is not assigned to a slot, so nothing draws it and the menu has no page for it, and the grammar still reads it.  **The picker has an entry of its own.** 'FilterMenu' draws its pages with 'Menu', which a field without a picker does not need, so this family's entry leaves it out. A page that writes a 'FilterMenu' imports both entries:  '''js import '@fusion.dev/helix/filter-input' import '@fusion.dev/helix/filter-input/menu' '''  A picker written without the second is reported once the page has loaded, with the entry to add.  **Suggestions.** Slot options into 'suggestions' and the field shows them, moves through them with the arrow keys, and presses one on Enter. The option fires its own 'helix-select', and you decide what choosing it means. Keys before a colon and values after it use the same panel with different contents. 'filter-suggestions' narrows the panel to the options whose words hold the term at the caret, after its colon, ignoring case and accents, and hides the rest. 'readFilterText' is exported so you can narrow it yourself against partly typed text. While the panel is open, a reader hears how many suggestions it offers. The panel opens when it has options and closes when it has none, and a choice does not close it, so after picking a key you see its values next. Use 'selectionStart' and 'setSelectionRange' to write a completion back and put the caret after it, or the next parse reads the wrong term.  **Suggestions from a source.** Set 'source' to a function, and the field asks it for suggestions as the text changes and draws them as options in the panel. It is given the term at the caret, the field the term is a value of, the whole text, and an 'AbortSignal', and returns the suggestions or a promise of them. 'filter-delay' waits for typing to rest before asking, and a later keystroke aborts a request still out. While a promise is pending, the panel shows 'loading-text' and a screen reader hears it, then the count. Choosing a suggestion writes its value over the term at the caret, and a finished 'field:value' is read into a chip as Enter would. Cancel its 'helix-select' to write it yourself.  '''js filter.source = async ({ field, term, signal }) => {   const response = await fetch('/values?field=${field}&q=${term}', { signal })   return response.json() } '''  **State.** Three things have three different owners:  - 'value' is the text. The user types, the element applies it, and 'input'   reports it. Setting 'value' seeds or corrects the text, and the next   keystroke overwrites it, even in React. To control the value, cancel   'helix-before-change' and write the value you want, as with every field in   this library. 'default-value' seeds the field. - 'open' is the suggestions panel. Cancel 'helix-before-open' or   'helix-before-close' to control it, and use 'default-open' to seed it. - Tokens are your elements in a slot and hold no state. A token goes when you   remove it from your markup after 'helix-dismiss'. A 'FilterChip' naming a   declared field works differently, because the picker holds what is ticked   and removing the chip alone would leave its value ticked in the hidden   menu. Its dismissal is treated as the field being filtered by nothing, so   it fires 'helix-facet' like every other change, and the chip goes when the   filter goes. Set 'chips' and the field adds, updates, and removes those   chips itself, from every 'helix-facet' you do not cancel. */
   "helix-headless-filter-input": DefineCustomElement<
     HelixHeadlessFilterInput,
     HelixHeadlessFilterInputVueProps,
@@ -19486,7 +19549,7 @@ export interface WcToolkitVueGlobalComponents {
     HelixHeadlessFormatDateVueProps,
     HelixHeadlessFormatDateVueEvents
   >;
-  /** Helix draws no graph. A force layout of thousands of notes is physics and WebGL, which a renderer such as Sigma.js does. Put the renderer's box in the frame, and 'connectGraph' from '@fusion.dev/helix-graph' draws 'nodes' and 'links' in it and keeps it in step with the frame.  What the frame adds is what a drawing of a graph cannot do: a list of every note beside it, which is the graph for a screen reader and a quick way to find a note for anyone. The selected note comes first, then the notes it links to and from, then every other note, and the search field narrows it. Selecting a note in the list or in the drawing is the same selection.  Set 'depth' to show the local graph: only the notes within that many links of the selected one.  Set 'legend' to name the groups over the drawing, each a button that shows or hides its notes. 'hiddenGroups' holds the groups turned off, and the list holds only what the drawing shows. The legend is a toolbar and one tab stop: the arrow keys, Home, End and a group's first letters move between its buttons, and Space or Enter presses one.  'nodes' and 'links' are properties, never markup: a graph of ten thousand notes as ten thousand elements would cost what the renderer exists to save. The list draws only the rows in view.  The list scrolls on this tier. It carries 'data-scroller', and 'core' ships '[data-scroller] { overflow: auto }' into every shadow root. You still need to set a block size on the list, or it grows to hold every row. */
+  /** Helix draws no graph. A force layout of thousands of notes is physics and WebGL, which a renderer such as Sigma.js does. Put the renderer's box in the frame, and 'connectGraph' from '@fusion.dev/helix-graph' draws 'nodes' and 'links' in it and keeps it in step with the frame.  What the frame adds is what a drawing of a graph cannot do: a list of every note beside it, which is the graph for a screen reader and a quick way to find a note for anyone. The selected note comes first, then the notes it links to and from, then every other note, and the search field narrows it. Selecting a note in the list or in the drawing is the same selection.  Set 'depth' to show the local graph: only the notes within that many links of the selected one.  The search field is a combobox over the list. Down and Up move through the notes while the focus stays in the field, and Enter selects one.  **Walk the links with Alt and the arrow keys**, in the list or in the search field once its keys are on a note. The note the keys are on is marked in the drawing.  | Key | What it does | |---|---| | Alt+Right | Follows a link, to the first note the one the keys are on links to or from. | | Alt+Down, Alt+Up | Moves to the next or the previous note linked to the one the step came from, wrapping. | | Alt+Left | Goes back along the links walked. |  Right and Left swap on a right-to-left page. Each step says the note, how it stands to the note it came from, and its place among that note's links, such as "Hiring plan. Linked from Roadmap. 2 of 3". Enter selects the note.  Set 'legend' to name the groups over the drawing, each a button that shows or hides its notes. 'hiddenGroups' holds the groups turned off, and the list holds only what the drawing shows. The legend is a toolbar and one tab stop: the arrow keys, Home, End and a group's first letters move between its buttons, and Space or Enter presses one.  'nodes' and 'links' are properties, never markup: a graph of ten thousand notes as ten thousand elements would cost what the renderer exists to save. The list draws only the rows in view.  The list scrolls on this tier. It carries 'data-scroller', and 'core' ships '[data-scroller] { overflow: auto }' into every shadow root. You still need to set a block size on the list, or it grows to hold every row. */
   "helix-headless-graph": DefineCustomElement<
     HelixHeadlessGraph,
     HelixHeadlessGraphVueProps,

package/types/words.d.ts

@@ -1276,9 +1276,11 @@ declare module '@fusion.dev/helix-core' {
       unavailableMessage: Message
       /**
        * The message for text that is no date, where `bad-input-message` is not
-       * set. `{mode}` is `single`, `range`, or `multiple`.
+       * set. `{mode}` is `single`, `range`, or `multiple`, and `{example}` is a
+       * date written as the field writes one, `August 24, 2026` in `en-US` and
+       * `24. August 2026` in `de-DE` at the default `date-style`.
        *
-       * English: `{mode, select, single {Enter a date as YYYY-MM-DD.} other {Enter dates as YYYY-MM-DD, separated by commas.}}`
+       * English: `{mode, select, single {Enter a date such as {example}.} other {Enter dates such as {example}, separated by commas.}}`
        */
       unreadableMessage: Message
       /**
@@ -1293,7 +1295,7 @@ declare module '@fusion.dev/helix-core' {
       /**
        * The validation message for a value that is not a date.
        *
-       * English: `{mode, select, single {Enter a date as YYYY-MM-DD.} other {Enter dates as YYYY-MM-DD, separated by commas.}}`
+       * English: `{mode, select, single {Enter a date such as {example}.} other {Enter dates such as {example}, separated by commas.}}`
        */
       badInputMessage: Message
       /**
@@ -1637,6 +1639,14 @@ declare module '@fusion.dev/helix-core' {
        * English: `Groups`
        */
       legendLabel: Message
+      /**
+       * What screen readers hear when a walk along the links reaches a note that
+       * has no link to follow, or goes back to a note: `{note}` for its name and
+       * `{count}` for how many notes the list holds that it links to or from.
+       *
+       * English: `{note}. {count, plural, =0 {No links} one {# link} other {# links}}`
+       */
+      linkCountLabel: Message
       /**
        * How a note linked both to and from the selected one is described, with `{note}`.
        *
@@ -1755,6 +1765,15 @@ declare module '@fusion.dev/helix-core' {
        * English: `Using the graph. Press Escape to scroll the page again.`
        */
       usingLabel: Message
+      /**
+       * What screen readers hear when a walk along the links moves to a note:
+       * `{note}` for its name, `{relation}` for how it stands to the note the
+       * step came from, such as "Linked from Roadmap", and `{index}` and `{count}`
+       * for its place among that note's links.
+       *
+       * English: `{note}. {relation}. {index} of {count}`
+       */
+      walkLabel: Message
       /**
        * The hint shown when the wheel scrolls past the graph with
        * `gestures="cooperative"`. `{key}` is ⌘ on a Mac and Ctrl elsewhere.
@@ -3323,7 +3342,7 @@ declare module '@fusion.dev/helix-core' {
       /**
        * The validation message for a value that is not a time.
        *
-       * English: `{mode, select, single {Enter a time as {shape}.} other {Enter times as {shape}, separated by commas.}}`
+       * English: `{mode, select, single {Enter a time such as {example}.} other {Enter times such as {example}, separated by commas.}}`
        */
       badInputMessage: Message
       /**