@fusion.dev/helix 0.177.1 → 0.178.0

package/types/vue.d.ts

@@ -6581,10 +6581,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?: (HelixDateInput["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"?: (HelixDateInput["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?: (HelixDateInput["unreadableMessage"]) | undefined;
   /** The name of the calendar's heading where it shows a page of years, with
 `{heading}` filled in. */
@@ -6705,16 +6717,24 @@ a reset should return to. */
 **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"?: (HelixDatePicker["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?: (HelixDatePicker["badInputMessage"]) | undefined;
   /** The calendar the heading, the days, and the months are written in.
 
@@ -8341,6 +8361,14 @@ an icon. */
   /** The name of the clear button, read by screen readers. The button shows only
 an icon. */
   clearLabel?: (HelixFilterInput["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"?: (HelixFilterInput["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?: (HelixFilterInput["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. */
@@ -8418,6 +8446,13 @@ imperatively later, and nothing is hydrating by then.
 
 Here rather than on each control. */
   name?: (HelixFilterInput["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?: (HelixFilterInput["source"]) | undefined;
 };
 
 export type HelixFilterInputVueEvents = {
@@ -8435,7 +8470,7 @@ export type HelixFilterInputVueEvents = {
   "helix-dismiss": HelixFilterInputHelixDismissElementEvent;
   /** 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": HelixFilterInputHelixFacetElementEvent;
-  /** 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": HelixFilterInputHelixSelectElementEvent;
   /** Fired when the text changes. */
   input: HelixFilterInputElementEvent;
@@ -8909,6 +8944,14 @@ or hides its notes. Drawn where the notes have two groups or more. */
   "legend-label"?: (HelixGraph["legendLabel"]) | undefined;
   /** The legend's name, read by screen readers. */
   legendLabel?: (HelixGraph["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"?: (HelixGraph["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?: (HelixGraph["linkCountLabel"]) | undefined;
   /** How a note linked both to and from the selected one is described, with `{note}`. */
   "linked-both-label"?: (HelixGraph["linkedBothLabel"]) | undefined;
   /** How a note linked both to and from the selected one is described, with `{note}`. */
@@ -8988,6 +9031,16 @@ the list then holds, written with `count-label`. */
   "using-label"?: (HelixGraph["usingLabel"]) | undefined;
   /** The line shown while the graph, with `gestures="activate"`, has the gestures. */
   usingLabel?: (HelixGraph["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"?: (HelixGraph["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?: (HelixGraph["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"?: (HelixGraph["wheelHintLabel"]) | undefined;
@@ -9031,7 +9084,7 @@ export type HelixGraphVueEvents = {
   "helix-graph-layout": HelixGraphHelixGraphLayoutElementEvent;
   /** A pan button or arrow key was pressed. `connectGraph` moves the drawing, then calls `moved()`. */
   "helix-graph-pan": HelixGraphHelixGraphPanElementEvent;
-  /** 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": HelixGraphHelixGraphPartChangeElementEvent;
   /** 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": HelixGraphHelixGraphReadyElementEvent;
@@ -19087,18 +19140,28 @@ a reset should return to. */
 **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"?: (HelixTimePicker["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?: (HelixTimePicker["badInputMessage"]) | undefined;
   /** Times that cannot be chosen, as `HH:mm`, separated by commas or spaces.
 

package/types/words.d.ts

@@ -320,6 +320,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}`.
        *
@@ -900,9 +908,11 @@ declare module '@fusion.dev/helix-core' {
       undoneLabel: 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
       /**
@@ -930,6 +940,15 @@ declare module '@fusion.dev/helix-core' {
        * English: `Choose one to continue.`
        */
       valueMissingMessage: 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 a surface with
        * `gestures="cooperative"`, with `{key}`. Each family declares it as a
@@ -1424,7 +1443,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
       /**
@@ -2537,7 +2556,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
       /**