@fusion.dev/helix 0.143.0 → 0.144.0

package/types/vue.d.ts

@@ -132,6 +132,7 @@ import type {
   HelixTabPanel,
   HelixTabs,
   HelixTab,
+  HelixTagGroup,
   HelixTag,
   HelixText,
   HelixTextarea,
@@ -192,6 +193,7 @@ import type {
   HelixSelectedEvent,
   HelixSortEvent,
   HelixSortedEvent,
+  HelixRejectEvent,
   HelixFacetEvent,
   HelixBeforeActivateEvent,
   HelixGraphFilterEvent,
@@ -791,6 +793,24 @@ for it is the one the registry already has. */
   shape?: (HelixAvatar["shape"]) | undefined;
   /** Edge length of the avatar. */
   size?: (HelixAvatar["size"]) | undefined;
+  /** How long, in milliseconds, a picture may take before the initials stand
+in for it while it loads.
+
+Absent keeps the picture's place empty until it arrives or fails. Set,
+the initials show once the wait is over and the picture
+replaces them when it arrives, so a slow connection shows who it is
+without a cached picture flashing initials first. Radix's `delayMs` is the
+same idea. */
+  "fallback-delay"?: (HelixAvatar["fallbackDelay"] | `${number}`) | undefined;
+  /** How long, in milliseconds, a picture may take before the initials stand
+in for it while it loads.
+
+Absent keeps the picture's place empty until it arrives or fails. Set,
+the initials show once the wait is over and the picture
+replaces them when it arrives, so a slow connection shows who it is
+without a cached picture flashing initials first. Radix's `delayMs` is the
+same idea. */
+  fallbackDelay?: (HelixAvatar["fallbackDelay"]) | undefined;
   /** Name of the person or entity.
 
 Used for the label and the initials. */
@@ -820,6 +840,13 @@ export type HelixAvatarVueEvents = {
 };
 
 export type HelixBadgeVueProps = {
+  /** Where the mark sits: a corner, `top-start`, `bottom-end` or `bottom-start`,
+or `inline`, in the line after the content.
+
+Absent is the top end, the corner a count is looked for in. `inline` is
+for a badge inside a control, where its count is read as part of the
+control's name. */
+  placement?: (HelixBadge["placement"]) | undefined;
   /** What the mark means. The stylesheet picks the fill from it.
 
 **`Tag`'s vocabulary, because a badge is the same kind of thing.** Both are
@@ -1285,6 +1312,22 @@ Lives here rather than only on `IconButton` so the two share one render.
 An icon-only button without it is a control a screen reader announces as
 "button" and nothing else. */
   label?: (HelixButton["label"]) | undefined;
+  /** Whether the action the button started is still running.
+
+A pending button keeps focus and stays in the tab order, and refuses every
+press: a click, Enter and Space, and Enter in a field of its form. The
+click does not reach your listeners. The inner control carries
+`aria-busy` and `aria-disabled`, and when the button becomes pending while
+it has focus, a reader hears `pending-label`. The styled button draws a
+turning ring over its words.
+
+`disabled` takes the button out of reach. Use `pending` for the wait after
+a press, so focus stays where the reader left it. */
+  pending?: (HelixButton["pending"]) | undefined;
+  /** What a reader hears when the button becomes pending while it has focus. */
+  "pending-label"?: (HelixButton["pendingLabel"]) | undefined;
+  /** What a reader hears when the button becomes pending while it has focus. */
+  pendingLabel?: (HelixButton["pendingLabel"]) | undefined;
   /** What activating the button does to its form. */
   type?: (HelixButton["type"]) | undefined;
   /** The value this button submits under its own `name`, as a native submit
@@ -1384,7 +1427,40 @@ invoker without an id in the same tree needs. */
 
 export type HelixButtonVueEvents = {};
 
+/** `HelixCallout` component event */
+export type HelixCalloutElementEvent<E = Event> = TypedEvent<HelixCallout, E>;
+/** `helix-dismiss` event type */
+export type HelixCalloutHelixDismissElementEvent =
+  HelixCalloutElementEvent<HelixDismissEvent>;
+
 export type HelixCalloutVueProps = {
+  /** Where the callout's box ends, whatever its tone.
+
+Absent, or `filled`, is the tint with the bar, the resting look.
+`outlined` draws the tone at the edge with no fill, and `plain` keeps only
+the bar and the mark, for an aside in running prose. The bar stays in
+every one, being what says the tone where the hue is not seen.
+
+Web Awesome calls this `appearance`. It is `separation` here, as on
+`Announcement` and `Card`, since a box's edge and its meaning are two
+choices. */
+  separation?: (HelixCallout["separation"]) | undefined;
+  /** Whether the element shows a control that dismisses it. */
+  dismissible?: (HelixCallout["dismissible"]) | undefined;
+  /** The dismiss control's label, read by screen readers.
+
+`attribute` is spelled out because Lit lowercases a property name to
+derive one rather than dash-casing it, so this would otherwise be
+reachable only as `dismisslabel`, which nobody would guess and no linter
+would catch. */
+  "dismiss-label"?: (HelixCallout["dismissLabel"]) | undefined;
+  /** The dismiss control's label, read by screen readers.
+
+`attribute` is spelled out because Lit lowercases a property name to
+derive one rather than dash-casing it, so this would otherwise be
+reachable only as `dismisslabel`, which nobody would guess and no linter
+would catch. */
+  dismissLabel?: (HelixCallout["dismissLabel"]) | undefined;
   /** What kind of attention the passage needs.
 
 `tone` is the axis for what a thing means, and this is a subset of it: a
@@ -1404,7 +1480,10 @@ Absent is the English for the tone: "Error", "Information", "Note",
   toneLabel?: (HelixCallout["toneLabel"]) | undefined;
 };
 
-export type HelixCalloutVueEvents = {};
+export type HelixCalloutVueEvents = {
+  /** The dismiss button was pressed. The callout does not remove itself, so remove it in response. Cancelable. */
+  "helix-dismiss": HelixCalloutHelixDismissElementEvent;
+};
 
 export type HelixCanvasEdgeVueProps = {
   /** The name of the card the connection starts from. */
@@ -2048,6 +2127,10 @@ twice what this says once.
 Reflected and undefaulted, so a card that has not asked reads as a card
 with no attribute on it and the stylesheet only describes the departure. */
   mediaPlacement?: (HelixCard["mediaPlacement"]) | undefined;
+  /**  */
+  "aria-labelledby"?: unknown;
+  /**  */
+  "aria-label"?: unknown;
 };
 
 export type HelixCardVueEvents = {};
@@ -2760,10 +2843,19 @@ and this one was the English a form in another language still spoke in
 the bubble it raises on submit: `feedback` replaces the message under
 the field and does not reach that one. */
   valueMissingMessage?: (HelixCheckboxGroup["valueMissingMessage"]) | undefined;
+  /** Whether a box above the set checks or unchecks every enabled box. */
+  "select-all"?: (HelixCheckboxGroup["selectAll"]) | undefined;
+  /** Whether a box above the set checks or unchecks every enabled box. */
+  selectAll?: (HelixCheckboxGroup["selectAll"]) | undefined;
+  /** The words beside the box `select-all` draws. */
+  "select-all-label"?: (HelixCheckboxGroup["selectAllLabel"]) | undefined;
+  /** The words beside the box `select-all` draws. */
+  selectAllLabel?: (HelixCheckboxGroup["selectAllLabel"]) | undefined;
   /** The checked values, comma separated.
 
 Read from the boxes once they are known, so a box a script ticks directly
-is in it at once. Written, it is pushed onto the boxes. */
+is in it at once. Written, it is pushed onto the boxes. A box whose value
+holds a comma cannot be named here: use `values`. */
   value?: (HelixCheckboxGroup["value"]) | undefined;
   /** Whether the control is disabled and cannot be used.
 
@@ -2791,6 +2883,11 @@ imperatively later, and nothing is hydrating by then.
 
 Here rather than on each control. */
   name?: (HelixCheckboxGroup["name"]) | undefined;
+  /** The checked values, as a list, in the order the boxes are written.
+
+The same set as `value`, and the one to use where a value may hold a
+comma. Written, it checks exactly those boxes and unchecks the rest. */
+  values?: (HelixCheckboxGroup["values"]) | undefined;
 };
 
 export type HelixCheckboxGroupVueEvents = {
@@ -2848,6 +2945,28 @@ stylesheets. */
   "default-checked"?: (HelixCheckbox["defaultChecked"]) | undefined;
   /** Whether the control starts checked. A form reset returns it to this state. */
   defaultChecked?: (HelixCheckbox["defaultChecked"]) | undefined;
+  /** Whether a reader can see and focus the control and cannot change it. A
+read-only control still submits its value.
+
+React Aria's `isReadOnly`. A native checkbox has no read-only state, so
+the press is refused at the inner control, which keeps its box as it
+was, and the control says `aria-readonly`. A script can still set
+`checked`, as it can set the value of a read-only text field.
+
+The attribute is `readonly`, which is the platform's spelling for the
+text fields. */
+  readonly?: (HelixCheckbox["readOnly"]) | undefined;
+  /** Whether a reader can see and focus the control and cannot change it. A
+read-only control still submits its value.
+
+React Aria's `isReadOnly`. A native checkbox has no read-only state, so
+the press is refused at the inner control, which keeps its box as it
+was, and the control says `aria-readonly`. A script can still set
+`checked`, as it can set the value of a read-only text field.
+
+The attribute is `readonly`, which is the platform's spelling for the
+text fields. */
+  readOnly?: (HelixCheckbox["readOnly"]) | undefined;
   /**  */
   "aria-label"?: unknown;
   /** The validation message shown under the control. It replaces the
@@ -2926,6 +3045,13 @@ export type HelixCheckboxVueEvents = {
 };
 
 export type HelixCodeBlockVueProps = {
+  /** Whether long lines wrap.
+
+Off by default, so long lines scroll, because a line break can be
+significant in code and a wrapped line reads as two. For prose-like code, such as a long command or
+a log line, a wrap reads better than a scroll. Line numbers keep the lines
+unwrapped, since a wrapped line would take one number and several rows. */
+  wrap?: (HelixCodeBlock["wrap"]) | undefined;
   /** The copy button's name and tooltip text after a copy. */
   "copied-label"?: (HelixCodeBlock["copiedLabel"]) | undefined;
   /** The copy button's name and tooltip text after a copy. */
@@ -2944,6 +3070,20 @@ Reflected, because the stylesheet paints a diff differently from code, and
 In a diff, each file is named from the patch, and this names a patch that
 carries no name of its own. */
   label?: (HelixCodeBlock["label"]) | undefined;
+  /** Whether the lines are numbered in a gutter beside the code.
+
+The numbers are hidden from the accessibility tree and are not part of a
+copy, which takes the code alone. Reflected, because the stylesheet lays
+the gutter out beside the code. A diff numbers its lines from its hunks
+whether or not this is set. */
+  "line-numbers"?: (HelixCodeBlock["lineNumbers"]) | undefined;
+  /** Whether the lines are numbered in a gutter beside the code.
+
+The numbers are hidden from the accessibility tree and are not part of a
+copy, which takes the code alone. Reflected, because the stylesheet lays
+the gutter out beside the code. A diff numbers its lines from its hunks
+whether or not this is set. */
+  lineNumbers?: (HelixCodeBlock["lineNumbers"]) | undefined;
   /** Whether to leave the copy button off.
 
 Negative, which is not a style choice. A boolean attribute is true whenever
@@ -2990,6 +3130,17 @@ Absent is unified, each removal above its replacement, which fits any
 width. `split` sets the old version beside the new one. Optional rather
 than defaulted, so the host carries no attribute the consumer did not write. */
   variant?: (HelixCodeBlock["variant"]) | undefined;
+  /** Turns the code into highlighted markup, which the block draws in place of
+the plain text.
+
+Called with the code as written and returning HTML, such as the output of
+Shiki's `codeToHtml` or Prism's `highlight`. **The markup is drawn as
+given**, so it has to escape the code it was handed, which those
+highlighters do. Bind the language in the function you pass. The code
+stays in the slot, so the copy button copies it as written and a reader
+without the script still has it. Not called on a server, which has no code
+to read, nor for a diff. */
+  highlight?: (HelixCodeBlock["highlight"]) | undefined;
 };
 
 export type HelixCodeBlockVueEvents = {};
@@ -3100,6 +3251,26 @@ point.** The field holds a color, so a browser offering to fill it with a
 saved address is competing for the same keystrokes as the picker. A
 consumer who wants autofill can still ask. */
   autocomplete?: (HelixColorInput["autocomplete"]) | undefined;
+  /** Whether the panel shows a number field for each channel of the color.
+Passed to the panel; see Color Picker's `channel-fields`. */
+  "channel-fields"?: (HelixColorInput["channelFields"]) | undefined;
+  /** Whether the panel shows a number field for each channel of the color.
+Passed to the panel; see Color Picker's `channel-fields`. */
+  channelFields?: (HelixColorInput["channelFields"]) | undefined;
+  /** The words a color's name is spoken in, as JSON keyed by their English,
+such as `{"red": "rot", "vibrant": "kräftiges"}`.
+
+Passed to the panel, whose square, hue ramp and presets say the color's
+name, and read by the swatch in `swatch`, which says it before the value.
+Color Picker lists the keys. */
+  "color-words"?: (HelixColorInput["colorWords"]) | undefined;
+  /** The words a color's name is spoken in, as JSON keyed by their English,
+such as `{"red": "rot", "vibrant": "kräftiges"}`.
+
+Passed to the panel, whose square, hue ramp and presets say the color's
+name, and read by the swatch in `swatch`, which says it before the value.
+Color Picker lists the keys. */
+  colorWords?: (HelixColorInput["colorWords"]) | undefined;
   /** The syntax the value is written in: `hex`, `rgb`, or `hsl`.
 
 **Undefaulted, because it reflects.** The two together stamp an attribute
@@ -3237,6 +3408,10 @@ ramps. A consumer who wants autofill can still ask. */
   "bad-input-message"?: (HelixColorPicker["badInputMessage"]) | undefined;
   /** The message shown when the value is text that is not a color. */
   badInputMessage?: (HelixColorPicker["badInputMessage"]) | undefined;
+  /** What the blue channel's field is called, in `channel-fields`. */
+  "blue-label"?: (HelixColorPicker["blueLabel"]) | undefined;
+  /** What the blue channel's field is called, in `channel-fields`. */
+  blueLabel?: (HelixColorPicker["blueLabel"]) | undefined;
   /** What the square's vertical ramp is called.
 
 **Every word the picker speaks is a property**, so a page in another
@@ -3247,6 +3422,50 @@ language hears its own rather than English between its own labels. */
 **Every word the picker speaks is a property**, so a page in another
 language hears its own rather than English between its own labels. */
   brightnessLabel?: (HelixColorPicker["brightnessLabel"]) | undefined;
+  /** Whether the picker shows a number field for each channel of the color, as
+React Aria's ColorField does with `channel`: red, green and blue for hex
+and rgb, hue, saturation and lightness for hsl, and the opacity with
+`alpha`.
+
+For a reader who has the numbers from a brand guide, and for a keyboard,
+where typing 128 is quicker than holding an arrow key. The fields follow
+the syntax the format toggle sets. */
+  "channel-fields"?: (HelixColorPicker["channelFields"]) | undefined;
+  /** Whether the picker shows a number field for each channel of the color, as
+React Aria's ColorField does with `channel`: red, green and blue for hex
+and rgb, hue, saturation and lightness for hsl, and the opacity with
+`alpha`.
+
+For a reader who has the numbers from a brand guide, and for a keyboard,
+where typing 128 is quicker than holding an arrow key. The fields follow
+the syntax the format toggle sets. */
+  channelFields?: (HelixColorPicker["channelFields"]) | undefined;
+  /** The words a color's name is spoken in, as JSON keyed by their English,
+such as `{"red": "rot", "vibrant": "kräftiges"}`.
+
+**A color is named the way React Aria names one**, as "vibrant red" or
+"dark grayish blue", and the keys are the ones `@react-stately/color`
+translates, so a table a page already has for it can be handed over whole.
+`colorName` and `transparentColorName` are the two sentences that put the
+words together. A word left out is spoken in English.
+
+The name follows the numbers on the square, follows the number on the hue
+ramp, and names each preset, so a reader who cannot see the color hears
+which one it is. */
+  "color-words"?: (HelixColorPicker["colorWords"]) | undefined;
+  /** The words a color's name is spoken in, as JSON keyed by their English,
+such as `{"red": "rot", "vibrant": "kräftiges"}`.
+
+**A color is named the way React Aria names one**, as "vibrant red" or
+"dark grayish blue", and the keys are the ones `@react-stately/color`
+translates, so a table a page already has for it can be handed over whole.
+`colorName` and `transparentColorName` are the two sentences that put the
+words together. A word left out is spoken in English.
+
+The name follows the numbers on the square, follows the number on the hue
+ramp, and names each preset, so a reader who cannot see the color hears
+which one it is. */
+  colorWords?: (HelixColorPicker["colorWords"]) | undefined;
   /** The text the sample shows for a moment after it copies the value. */
   "copied-label"?: (HelixColorPicker["copiedLabel"]) | undefined;
   /** The text the sample shows for a moment after it copies the value. */
@@ -3270,6 +3489,10 @@ Only what is written. Everything is read whatever this says, so a picker on
   "format-label"?: (HelixColorPicker["formatLabel"]) | undefined;
   /** What the syntax toggle is called, with `{format}` filled in. */
   formatLabel?: (HelixColorPicker["formatLabel"]) | undefined;
+  /** What the green channel's field is called, in `channel-fields`. */
+  "green-label"?: (HelixColorPicker["greenLabel"]) | undefined;
+  /** What the green channel's field is called, in `channel-fields`. */
+  greenLabel?: (HelixColorPicker["greenLabel"]) | undefined;
   /** What the hue channel is called. */
   "hue-label"?: (HelixColorPicker["hueLabel"]) | undefined;
   /** What the hue channel is called. */
@@ -3282,6 +3505,12 @@ the label, the hint and the feedback, and a second message inside the panel
 would be the same error said twice. What is left for the picker is the one
 thing the field cannot draw from outside, the mark on the answer itself. */
   invalid?: (HelixColorPicker["invalid"]) | undefined;
+  /** What the lightness channel's field is called, in `channel-fields` with
+hsl. */
+  "lightness-label"?: (HelixColorPicker["lightnessLabel"]) | undefined;
+  /** What the lightness channel's field is called, in `channel-fields` with
+hsl. */
+  lightnessLabel?: (HelixColorPicker["lightnessLabel"]) | undefined;
   /** Hides the eyedropper. Without it, the eyedropper appears in browsers that
 support one. */
   "no-eyedropper"?: (HelixColorPicker["noEyedropper"]) | undefined;
@@ -3378,6 +3607,10 @@ letting it move would show `rgb` over a hex it is no longer allowed to
 restate. The eyedropper clears the screen and runs a system sampler, so
 letting it open would take a color from the reader and drop it. */
   readOnly?: (HelixColorPicker["readOnly"]) | undefined;
+  /** What the red channel's field is called, in `channel-fields`. */
+  "red-label"?: (HelixColorPicker["redLabel"]) | undefined;
+  /** What the red channel's field is called, in `channel-fields`. */
+  redLabel?: (HelixColorPicker["redLabel"]) | undefined;
   /** Requires a color before the form can submit.
 
 **A color is exactly as requirable as a date**, which is the comparison
@@ -3564,6 +3797,24 @@ and this one was the English a form in another language still spoke in
 the bubble it raises on submit: `feedback` replaces the message under
 the field and does not reach that one. */
   valueMissingMessage?: (HelixCombobox["valueMissingMessage"]) | undefined;
+  /** Whether text that names no option is taken as the value, as React Aria's
+`allowsCustomValue`.
+
+For a field where the list is a help and not the whole of the answer, a
+city or a job title. What was typed becomes the value when the reader
+leaves the field or presses Enter with nothing highlighted, and text that
+names an option takes that option. Unlike `creatable`, no event asks
+first and no option is expected to be added: the value is the text. */
+  "allows-custom-value"?: (HelixCombobox["allowsCustomValue"]) | undefined;
+  /** Whether text that names no option is taken as the value, as React Aria's
+`allowsCustomValue`.
+
+For a field where the list is a help and not the whole of the answer, a
+city or a job title. What was typed becomes the value when the reader
+leaves the field or presses Enter with nothing highlighted, and text that
+names an option takes that option. Unlike `creatable`, no event asks
+first and no option is expected to be added: the value is the text. */
+  allowsCustomValue?: (HelixCombobox["allowsCustomValue"]) | undefined;
   /** What the browser may autofill in the text field, as a platform token.
 
 **Defaults to `off`, which is not the platform's default and is the
@@ -3642,6 +3893,20 @@ filled in.
 **The name goes in**, so a row of them is heard as which one each
 removes rather than as "Remove" said once per chosen option. */
   removeLabel?: (HelixCombobox["removeLabel"]) | undefined;
+  /** What a screen reader hears when typing leaves one option. `{count}` is
+the count. */
+  "result-label"?: (HelixCombobox["resultLabel"]) | undefined;
+  /** What a screen reader hears when typing leaves one option. `{count}` is
+the count. */
+  resultLabel?: (HelixCombobox["resultLabel"]) | undefined;
+  /** What a screen reader hears when typing leaves any other number of
+options. `{count}` is the count, and `Intl.PluralRules` picks between the
+two. */
+  "results-label"?: (HelixCombobox["resultsLabel"]) | undefined;
+  /** What a screen reader hears when typing leaves any other number of
+options. `{count}` is the count, and `Intl.PluralRules` picks between the
+two. */
+  resultsLabel?: (HelixCombobox["resultsLabel"]) | undefined;
   /** Whether the field completes the word as the user types.
 
 `suggest` rather than `autocomplete`, which is a real HTML attribute this
@@ -3743,6 +4008,14 @@ the resolved state for stylesheets, which is what the mirror is for. */
   "empty-text"?: (HelixCommand["emptyText"]) | undefined;
   /** The text shown when the filter matches no commands. */
   emptyText?: (HelixCommand["emptyText"]) | undefined;
+  /** How long typing rests before the commands are filtered, in milliseconds,
+so a palette filtered on a server sends one `helix-filter` for a word.
+`0` filters on every keystroke. See Listbox's `filter-delay`. */
+  "filter-delay"?: (HelixCommand["filterDelay"] | `${number}`) | undefined;
+  /** How long typing rests before the commands are filtered, in milliseconds,
+so a palette filtered on a server sends one `helix-filter` for a word.
+`0` filters on every keystroke. See Listbox's `filter-delay`. */
+  filterDelay?: (HelixCommand["filterDelay"]) | undefined;
   /** The key that opens the palette, written as `mod+k`, `shift+p`, or `k`.
 
 Empty turns it off, for a consumer who opens the palette from a button or
@@ -3762,6 +4035,20 @@ Passed to the list, which shows `loading-text` and tells screen readers. */
   loadingText?: (HelixCommand["loadingText"]) | undefined;
   /** The text shown in the filter field before anything is typed. */
   placeholder?: (HelixCommand["placeholder"]) | undefined;
+  /** What a screen reader hears when typing leaves one command. `{count}` is
+the count. */
+  "result-label"?: (HelixCommand["resultLabel"]) | undefined;
+  /** What a screen reader hears when typing leaves one command. `{count}` is
+the count. */
+  resultLabel?: (HelixCommand["resultLabel"]) | undefined;
+  /** What a screen reader hears when typing leaves any other number of
+commands. `{count}` is the count, and `Intl.PluralRules` picks between the
+two. */
+  "results-label"?: (HelixCommand["resultsLabel"]) | undefined;
+  /** What a screen reader hears when typing leaves any other number of
+commands. `{count}` is the count, and `Intl.PluralRules` picks between the
+two. */
+  resultsLabel?: (HelixCommand["resultsLabel"]) | undefined;
 };
 
 export type HelixCommandVueEvents = {
@@ -3773,7 +4060,7 @@ export type HelixCommandVueEvents = {
   "helix-before-open": HelixCommandHelixBeforeOpenElementEvent;
   /** Fired as the user types, with the text the list is filtered by. Cancelable: cancel it to leave the list unfiltered and filter the commands yourself, for example on a server while `loading` is set. */
   "helix-filter": HelixCommandHelixFilterElementEvent;
-  /** A command was chosen. Cancelable: cancel it to keep the palette open. */
+  /** A command was chosen, with its `href` where the option is a link. Cancelable: cancel it to keep the palette open, and to keep the browser from following the link. */
   "helix-select": HelixCommandHelixSelectElementEvent;
 };
 
@@ -3820,6 +4107,17 @@ dash-casing it, and `copiedlabel` is not what anyone would type. */
 `attribute` written out, because Lit lowercases a property name rather than
 dash-casing it, and `copiedlabel` is not what anyone would type. */
   copiedLabel?: (HelixCopyButton["copiedLabel"]) | undefined;
+  /** The button's name and tooltip text after a press that put nothing on the
+clipboard. */
+  "error-label"?: (HelixCopyButton["errorLabel"]) | undefined;
+  /** The button's name and tooltip text after a press that put nothing on the
+clipboard. */
+  errorLabel?: (HelixCopyButton["errorLabel"]) | undefined;
+  /** The element to copy from, by its id: `key` for its text, `key[value]` for
+an attribute, and `key.value` for a property. Read at the press, and used
+in place of `value`. An element that is not there copies nothing, which is
+a failed copy. */
+  from?: (HelixCopyButton["from"]) | undefined;
   /** The button's name and tooltip text before a copy.
 
 Defaulted rather than left empty. An icon-only control must be named, and
@@ -3899,6 +4197,22 @@ native submitter would have given it, which is the point. */
   formtarget?: (HelixCopyButton["formTarget"]) | undefined;
   /** Which browsing context the response lands in, overriding the form's own. */
   formTarget?: (HelixCopyButton["formTarget"]) | undefined;
+  /** Whether the action the button started is still running.
+
+A pending button keeps focus and stays in the tab order, and refuses every
+press: a click, Enter and Space, and Enter in a field of its form. The
+click does not reach your listeners. The inner control carries
+`aria-busy` and `aria-disabled`, and when the button becomes pending while
+it has focus, a reader hears `pending-label`. The styled button draws a
+turning ring over its words.
+
+`disabled` takes the button out of reach. Use `pending` for the wait after
+a press, so focus stays where the reader left it. */
+  pending?: (HelixCopyButton["pending"]) | undefined;
+  /** What a reader hears when the button becomes pending while it has focus. */
+  "pending-label"?: (HelixCopyButton["pendingLabel"]) | undefined;
+  /** What a reader hears when the button becomes pending while it has focus. */
+  pendingLabel?: (HelixCopyButton["pendingLabel"]) | undefined;
   /** What activating the button does to its form. */
   type?: (HelixCopyButton["type"]) | undefined;
   /** Whether the control is disabled and cannot be used.
@@ -3984,6 +4298,8 @@ invoker without an id in the same tree needs. */
 export type HelixCopyButtonVueEvents = {
   /** Fired after the clipboard write succeeds. */
   "helix-copy": HelixCopyButtonHelixCopyElementEvent;
+  /** Fired when a press put nothing on the clipboard: the browser refused the write, or there was nothing to copy. */
+  "helix-copy-error": HelixCopyButtonElementEvent;
 };
 
 /** `HelixDataTable` component event */
@@ -4325,6 +4641,20 @@ export type HelixDateInputHelixBeforeOpenElementEvent =
   HelixDateInputElementEvent<HelixBeforeOpenEvent>;
 
 export type HelixDateInputVueProps = {
+  /** What a screen reader hears for a segment with nothing in it, which a
+sighted reader sees as dashes. */
+  "empty-segment-label"?: (HelixDateInput["emptySegmentLabel"]) | undefined;
+  /** What a screen reader hears for a segment with nothing in it, which a
+sighted reader sees as dashes. */
+  emptySegmentLabel?: (HelixDateInput["emptySegmentLabel"]) | undefined;
+  /** Whether the field is a row of segments, one for each part of the date or
+time, in place of a line of text.
+
+Each segment is set with digits or the arrow keys, in the order the
+locale writes them, so a reader types a date the way they write one and
+no format has to be read back. The picker still opens from the trigger
+and with Alt+Down. */
+  segmented?: (HelixDateInput["segmented"]) | undefined;
   /** Whether the value is locked. A read-only control still submits its value.
 
 **Enforced by refusing every request in one place**, which is the seam this
@@ -4523,6 +4853,12 @@ and is Sunday otherwise. */
   locale?: (HelixDateInput["locale"]) | undefined;
   /** The latest date that can be chosen, as `YYYY-MM-DD`. */
   max?: (HelixDateInput["max"]) | undefined;
+  /** How far the calendar's heading steps back from the days: `month` or
+`year`. Handed to the calendar; see Date Picker's `max-view`. */
+  "max-view"?: (HelixDateInput["maxView"]) | undefined;
+  /** How far the calendar's heading steps back from the days: `month` or
+`year`. Handed to the calendar; see Date Picker's `max-view`. */
+  maxView?: (HelixDateInput["maxView"]) | undefined;
   /** The earliest date that can be chosen, as `YYYY-MM-DD`. */
   min?: (HelixDateInput["min"]) | undefined;
   /** How many dates can be held at once.
@@ -4538,16 +4874,38 @@ an end in April otherwise means paging between them and losing sight of the
 first. The panel is sized by its content, so this widens it, and where the
 window has no room for that width it shows one month until there is. */
   months?: (HelixDateInput["months"]) | undefined;
+  /** The name of the calendar's heading where it shows the months, with
+`{heading}` filled in. */
+  "month-view-label"?: (HelixDateInput["monthViewLabel"]) | undefined;
+  /** The name of the calendar's heading where it shows the months, with
+`{heading}` filled in. */
+  monthViewLabel?: (HelixDateInput["monthViewLabel"]) | undefined;
   /** The name of the calendar's control that moves to the next month. */
   "next-label"?: (HelixDateInput["nextLabel"]) | undefined;
   /** The name of the calendar's control that moves to the next month. */
   nextLabel?: (HelixDateInput["nextLabel"]) | undefined;
+  /** The name of the calendar's control that moves forward a year. */
+  "next-year-label"?: (HelixDateInput["nextYearLabel"]) | undefined;
+  /** The name of the calendar's control that moves forward a year. */
+  nextYearLabel?: (HelixDateInput["nextYearLabel"]) | undefined;
+  /** The name of the calendar's control that moves forward a page of years. */
+  "next-years-label"?: (HelixDateInput["nextYearsLabel"]) | undefined;
+  /** The name of the calendar's control that moves forward a page of years. */
+  nextYearsLabel?: (HelixDateInput["nextYearsLabel"]) | undefined;
   /** The text the field shows before a date is entered. */
   placeholder?: (HelixDateInput["placeholder"]) | undefined;
   /** The name of the calendar's control that moves to the previous month. */
   "previous-label"?: (HelixDateInput["previousLabel"]) | undefined;
   /** The name of the calendar's control that moves to the previous month. */
   previousLabel?: (HelixDateInput["previousLabel"]) | undefined;
+  /** The name of the calendar's control that moves back a year. */
+  "previous-year-label"?: (HelixDateInput["previousYearLabel"]) | undefined;
+  /** The name of the calendar's control that moves back a year. */
+  previousYearLabel?: (HelixDateInput["previousYearLabel"]) | undefined;
+  /** The name of the calendar's control that moves back a page of years. */
+  "previous-years-label"?: (HelixDateInput["previousYearsLabel"]) | undefined;
+  /** The name of the calendar's control that moves back a page of years. */
+  previousYearsLabel?: (HelixDateInput["previousYearsLabel"]) | undefined;
   /** The message shown when a range holds more than two dates.
 
 **Every sentence a control raises in the browser's bubble is a property**,
@@ -4603,6 +4961,12 @@ platform's base. */
   "unavailable-message"?: (HelixDateInput["unavailableMessage"]) | undefined;
   /** The message shown when `disable-dates` or `disable-days` bars a date. */
   unavailableMessage?: (HelixDateInput["unavailableMessage"]) | undefined;
+  /** The name of the calendar's heading where it shows a page of years, with
+`{heading}` filled in. */
+  "year-view-label"?: (HelixDateInput["yearViewLabel"]) | undefined;
+  /** The name of the calendar's heading where it shows a page of years, with
+`{heading}` filled in. */
+  yearViewLabel?: (HelixDateInput["yearViewLabel"]) | undefined;
   /** Whether the control is disabled and cannot be used.
 
 Reflected, because the styled tier selects on it, and mirrored to
@@ -4629,6 +4993,14 @@ imperatively later, and nothing is hydrating by then.
 
 Here rather than on each control. */
   name?: (HelixDateInput["name"]) | undefined;
+  /** What each day in the calendar shows, in place of its number: a function
+given the date as `YYYY-MM-DD`. Handed to the calendar; see Date Picker's
+`dayContent`. */
+  dayContent?: (HelixDateInput["dayContent"]) | undefined;
+  /** A rule for which dates cannot be chosen: a function given the date as
+`YYYY-MM-DD` that returns `true` to bar it. The calendar offers such a date
+as unavailable, and a typed one is invalid, as with `disable-dates`. */
+  isDateUnavailable?: (HelixDateInput["isDateUnavailable"]) | undefined;
   /** The value as a `Date`, at midnight UTC, or `null` while there is no date.
 
 The platform's own pair on `<input type="date">`, and this control holds the
@@ -4732,6 +5104,24 @@ Absent uses the runtime's own. */
   locale?: (HelixDatePicker["locale"]) | undefined;
   /** Latest selectable date, as `YYYY-MM-DD`. */
   max?: (HelixDatePicker["max"]) | undefined;
+  /** How far the heading lets a reader step back from the days: `month` to a
+year's months, or `year` to a page of years and then its months.
+
+Absent, the heading is text and the calendar moves a month at a time. Set,
+the heading is a button that shows the months, and from there the years,
+so a birth date forty years back is three presses rather than four hundred
+and eighty. Choosing a year shows its months, and choosing a month shows
+its days. */
+  "max-view"?: (HelixDatePicker["maxView"]) | undefined;
+  /** How far the heading lets a reader step back from the days: `month` to a
+year's months, or `year` to a page of years and then its months.
+
+Absent, the heading is text and the calendar moves a month at a time. Set,
+the heading is a button that shows the months, and from there the years,
+so a birth date forty years back is three presses rather than four hundred
+and eighty. Choosing a year shows its months, and choosing a month shows
+its days. */
+  maxView?: (HelixDatePicker["maxView"]) | undefined;
   /** Earliest selectable date, as `YYYY-MM-DD`. */
   min?: (HelixDatePicker["min"]) | undefined;
   /** How many dates can be held at once. */
@@ -4745,10 +5135,24 @@ can drive the view. Reading gives the month on show; writing sets it, and
   month?: (HelixDatePicker["month"]) | undefined;
   /** How many months to show, side by side. */
   months?: (HelixDatePicker["months"]) | undefined;
+  /** The name of the heading where it shows the months, with `{heading}`
+filled in as the month on show. */
+  "month-view-label"?: (HelixDatePicker["monthViewLabel"]) | undefined;
+  /** The name of the heading where it shows the months, with `{heading}`
+filled in as the month on show. */
+  monthViewLabel?: (HelixDatePicker["monthViewLabel"]) | undefined;
   /** Accessible name for the control that pages forward. */
   "next-label"?: (HelixDatePicker["nextLabel"]) | undefined;
   /** Accessible name for the control that pages forward. */
   nextLabel?: (HelixDatePicker["nextLabel"]) | undefined;
+  /** Accessible name for the control that moves forward a year, in the months. */
+  "next-year-label"?: (HelixDatePicker["nextYearLabel"]) | undefined;
+  /** Accessible name for the control that moves forward a year, in the months. */
+  nextYearLabel?: (HelixDatePicker["nextYearLabel"]) | undefined;
+  /** Accessible name for the control that moves forward a page, in the years. */
+  "next-years-label"?: (HelixDatePicker["nextYearsLabel"]) | undefined;
+  /** Accessible name for the control that moves forward a page, in the years. */
+  nextYearsLabel?: (HelixDatePicker["nextYearsLabel"]) | undefined;
   /** Accessible name for the control that pages back.
 
 A property because a calendar rendering its own month names from `locale`
@@ -4763,6 +5167,14 @@ would otherwise still announce its controls in English. `attribute:`
 spelled out, since Lit lowercases a camelCase name rather than dash-casing
 it. */
   previousLabel?: (HelixDatePicker["previousLabel"]) | undefined;
+  /** Accessible name for the control that moves back a year, in the months. */
+  "previous-year-label"?: (HelixDatePicker["previousYearLabel"]) | undefined;
+  /** Accessible name for the control that moves back a year, in the months. */
+  previousYearLabel?: (HelixDatePicker["previousYearLabel"]) | undefined;
+  /** Accessible name for the control that moves back a page, in the years. */
+  "previous-years-label"?: (HelixDatePicker["previousYearsLabel"]) | undefined;
+  /** Accessible name for the control that moves back a page, in the years. */
+  previousYearsLabel?: (HelixDatePicker["previousYearsLabel"]) | undefined;
   /** The validation message for a date after `max`. `{max}` is replaced with
 `max`, written as a date in `locale`. */
   "range-overflow-message"?: (HelixDatePicker["rangeOverflowMessage"]) | undefined;
@@ -4827,6 +5239,17 @@ bars. */
   "value-missing-message"?: (HelixDatePicker["valueMissingMessage"]) | undefined;
   /** The validation message for a required date picker with no date chosen. */
   valueMissingMessage?: (HelixDatePicker["valueMissingMessage"]) | undefined;
+  /** What the calendar shows: the days of a month, the months of a year, or a
+page of years. `day` unless `max-view` lets a reader step back.
+
+Not reflected, being state. Set it to open on the months or the years. */
+  view?: (HelixDatePicker["view"]) | undefined;
+  /** The name of the heading where it shows a page of years, with `{heading}`
+filled in as the year on show. */
+  "year-view-label"?: (HelixDatePicker["yearViewLabel"]) | undefined;
+  /** The name of the heading where it shows a page of years, with `{heading}`
+filled in as the year on show. */
+  yearViewLabel?: (HelixDatePicker["yearViewLabel"]) | undefined;
   /** Whether the control is disabled and cannot be used.
 
 Reflected, because the styled tier selects on it, and mirrored to
@@ -4853,6 +5276,24 @@ imperatively later, and nothing is hydrating by then.
 
 Here rather than on each control. */
   name?: (HelixDatePicker["name"]) | undefined;
+  /** What each day shows, in place of its number: a function given the date as
+`YYYY-MM-DD` that returns text, an element or a Lit template.
+
+For a price or a dot under the number, as React Aria's `CalendarCell`
+takes children. The cell is still named by its whole date, so what you
+draw here is for the eye; say anything a reader must hear in the date's
+description elsewhere. Return the day's number with it where it should
+still show. A property only, there being no way to write a function in
+markup. */
+  dayContent?: (HelixDatePicker["dayContent"]) | undefined;
+  /** A rule for which dates cannot be chosen: a function given the date as
+`YYYY-MM-DD` that returns `true` to bar it.
+
+For what a list cannot say, such as the second Tuesday of each month or
+the days a server has fully booked. It bars a date as `disable-dates`
+does, in the grid and in validation. A property only, as React Aria's
+`isDateUnavailable` is a prop. */
+  isDateUnavailable?: (HelixDatePicker["isDateUnavailable"]) | undefined;
   /** The value as a `Date`, at midnight UTC, or `null` while there is no date.
 
 The platform's own pair on `<input type="date">`, and this control holds the
@@ -5022,6 +5463,16 @@ hydration, or diffed by a framework, it comes back holding whatever the
 last reader did rather than what the author wrote. `:state(open)` carries
 the resolved state for stylesheets, which is what the mirror is for. */
   open?: (HelixDialog["open"]) | undefined;
+  /** Makes the dialog an alert dialog, for a message that interrupts to ask for
+an answer, such as a confirmation before something is deleted.
+
+The `<dialog>` takes `role="alertdialog"`, so a screen reader announces the
+dialog and its description as it opens. Everything else stays the same:
+the dialog is modal, Escape asks to close it, and `persistent` still
+refuses that.
+
+Not reflected, because no stylesheet selects on it. */
+  alert?: (HelixDialog["alert"]) | undefined;
   /** Which close requests the browser handles on its own.
 
 `<dialog closedby>`, forwarded, and safe to forward because every path it
@@ -5044,6 +5495,17 @@ the property this component exists to keep.
 Absent by default, which is the platform's `auto` and this library's rule
 that a resting value is an attribute's absence. */
   closedBy?: (HelixDialog["closedBy"]) | undefined;
+  /** Draws a control that closes the dialog, in the corner where the title is.
+
+Pressing it is `close()`, so it sends `helix-before-close` like every other
+way out, and `persistent` does not disable it. */
+  dismissible?: (HelixDialog["dismissible"]) | undefined;
+  /** The close control's accessible name. Translate it with the rest of your
+interface. */
+  "dismiss-label"?: (HelixDialog["dismissLabel"]) | undefined;
+  /** The close control's accessible name. Translate it with the rest of your
+interface. */
+  dismissLabel?: (HelixDialog["dismissLabel"]) | undefined;
   /** Accessible name for the dialog. When it is empty, the heading in the
 `header` slot names the dialog. */
   label?: (HelixDialog["label"]) | undefined;
@@ -5082,6 +5544,18 @@ export type HelixDialogVueEvents = {
 };
 
 export type HelixDividerVueProps = {
+  /** Where content set into the line sits along it.
+
+Absent is the middle. `start` and `end` move it toward one end, with a
+short length of line, `--divider-content-offset`, kept before or after it.
+A divider with nothing set into it is one line whatever this says. */
+  "content-placement"?: (HelixDivider["contentPlacement"]) | undefined;
+  /** Where content set into the line sits along it.
+
+Absent is the middle. `start` and `end` move it toward one end, with a
+short length of line, `--divider-content-offset`, kept before or after it.
+A divider with nothing set into it is one line whatever this says. */
+  contentPlacement?: (HelixDivider["contentPlacement"]) | undefined;
   /** Whether screen readers announce the line as a separator.
 
 Off by default, and out of the accessibility tree. Most rules on a page
@@ -5305,6 +5779,24 @@ default assigned to the property would reflect onto every host and put a
 `placement="end"` into markup no consumer wrote. So what this tier
 guarantees is the absence, and a sheet selects on it. */
   placement?: (HelixDrawer["placement"]) | undefined;
+  /** The fractions of the panel a reader can leave on screen, as a list such as
+`0.5 1`. The drawer opens at the smallest, and a swipe comes to rest at the
+nearest, or closes the drawer below the smallest.
+
+Empty is `1`: the whole panel, and a swipe either closes it or puts it
+back. */
+  "snap-points"?: (HelixDrawer["snapPoints"]) | undefined;
+  /** The fractions of the panel a reader can leave on screen, as a list such as
+`0.5 1`. The drawer opens at the smallest, and a swipe comes to rest at the
+nearest, or closes the drawer below the smallest.
+
+Empty is `1`: the whole panel, and a swipe either closes it or puts it
+back. */
+  snapPoints?: (HelixDrawer["snapPoints"]) | undefined;
+  /** Whether a touch or a pen can swipe the drawer away. `swipe="false"` turns
+it off, for a panel whose content has its own use for the gesture, such as
+a map. */
+  swipe?: (HelixDrawer["swipe"]) | undefined;
   /** What the dialog closed with, the way `<dialog>` reports it.
 
 **The whole point of a `<dialog>` returning a value is lost behind a shadow
@@ -5440,6 +5932,9 @@ export type HelixFileInputElementEvent<E = Event> = TypedEvent<
 /** `helix-before-change` event type */
 export type HelixFileInputHelixBeforeChangeElementEvent =
   HelixFileInputElementEvent<HelixBeforeChangeEvent>;
+/** `helix-reject` event type */
+export type HelixFileInputHelixRejectElementEvent =
+  HelixFileInputElementEvent<HelixRejectEvent>;
 
 export type HelixFileInputVueProps = {
   /**  */
@@ -5479,12 +5974,31 @@ filter is the only check the platform makes and a drop never meets it. */
   accept?: (HelixFileInput["accept"]) | undefined;
   /** Which camera or microphone a mobile picker should offer, if any. */
   capture?: (HelixFileInput["capture"]) | undefined;
+  /** Whether the picker chooses a folder, and the field takes every file in
+it. The platform's `webkitdirectory`. */
+  directory?: (HelixFileInput["directory"]) | undefined;
   /** Language tag the sizes are written in.
 
 Absent uses the runtime's own. */
   locale?: (HelixFileInput["locale"]) | undefined;
+  /** The most files the field holds, under `multiple`. Files past it are
+refused. */
+  "max-files"?: (HelixFileInput["maxFiles"] | `${number}`) | undefined;
+  /** The most files the field holds, under `multiple`. Files past it are
+refused. */
+  maxFiles?: (HelixFileInput["maxFiles"]) | undefined;
+  /** The most bytes one file may have. A larger one is refused. */
+  "max-file-size"?: (HelixFileInput["maxFileSize"] | `${number}`) | undefined;
+  /** The most bytes one file may have. A larger one is refused. */
+  maxFileSize?: (HelixFileInput["maxFileSize"]) | undefined;
   /** Whether more than one file can be chosen. */
   multiple?: (HelixFileInput["multiple"]) | undefined;
+  /** What a reader hears when files are refused, with `{count}` and `{names}`
+filled in. */
+  "rejected-text"?: (HelixFileInput["rejectedText"]) | undefined;
+  /** What a reader hears when files are refused, with `{count}` and `{names}`
+filled in. */
+  rejectedText?: (HelixFileInput["rejectedText"]) | undefined;
   /** The accessible name of the control that removes a file. `{name}` is
 replaced with the file's name.
 
@@ -5529,6 +6043,9 @@ imperatively later, and nothing is hydrating by then.
 
 Here rather than on each control. */
   name?: (HelixFileInput["name"]) | undefined;
+  /** Your own check on each arriving file, which returns why it is refused, or
+nothing to take it. A property, since a function cannot be an attribute. */
+  validate?: (HelixFileInput["validate"]) | undefined;
 };
 
 export type HelixFileInputVueEvents = {
@@ -5536,6 +6053,8 @@ export type HelixFileInputVueEvents = {
   change: HelixFileInputElementEvent;
   /** Fired before the chosen files change, with their names, and cancelable. Canceling it keeps the files the field had, even when the browser has already written a new pick. */
   "helix-before-change": HelixFileInputHelixBeforeChangeElementEvent;
+  /** Fired when files arrive and some are left out. `detail.files` lists each with its `reason`: `type`, `size`, `count` or `invalid`, and your `validate` message. */
+  "helix-reject": HelixFileInputHelixRejectElementEvent;
   /** Fired after the value changes. */
   input: HelixFileInputElementEvent;
 };
@@ -5823,10 +6342,26 @@ an icon. */
   /** The name of the clear button, read by screen readers. The button shows only
 an icon. */
   clearLabel?: (HelixFilterInput["clearLabel"]) | 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. */
+  "filter-suggestions"?: (HelixFilterInput["filterSuggestions"]) | 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. */
+  filterSuggestions?: (HelixFilterInput["filterSuggestions"]) | undefined;
   /** The text shown while the field is empty.
 
 Not a label: it goes when typing starts. */
   placeholder?: (HelixFilterInput["placeholder"]) | undefined;
+  /** What a reader hears for one suggestion, with `{count}` filled in. */
+  "suggestion-label"?: (HelixFilterInput["suggestionLabel"]) | undefined;
+  /** What a reader hears for one suggestion, with `{count}` filled in. */
+  suggestionLabel?: (HelixFilterInput["suggestionLabel"]) | undefined;
+  /** What a reader hears for any other number of suggestions, with `{count}` filled in. */
+  "suggestions-label"?: (HelixFilterInput["suggestionsLabel"]) | undefined;
+  /** What a reader hears for any other number of suggestions, with `{count}` filled in. */
+  suggestionsLabel?: (HelixFilterInput["suggestionsLabel"]) | undefined;
   /** Whether the control is disabled and cannot be used.
 
 Reflected, because the styled tier selects on it, and mirrored to
@@ -5952,6 +6487,12 @@ Lit's server shim, `textContent`, `children`, `firstChild` and
 it. An element rendered on a server needs the attribute; one rendered in a
 browser may use either. */
   date?: (HelixFormatDate["date"]) | undefined;
+  /** The locale's own pattern for the date: `full`, `long`, `medium`, or
+`short`. Set, it stands in for `weekday`, `day`, `month`, `year` and `era`. */
+  "date-style"?: (HelixFormatDate["dateStyle"]) | undefined;
+  /** The locale's own pattern for the date: `full`, `long`, `medium`, or
+`short`. Set, it stands in for `weekday`, `day`, `month`, `year` and `era`. */
+  dateStyle?: (HelixFormatDate["dateStyle"]) | undefined;
   /** How the day of the month is written, where a date is shown. */
   day?: (HelixFormatDate["day"]) | undefined;
   /** Shows how long ago the timestamp was, in a compact form such as "3h", in
@@ -5961,8 +6502,22 @@ Reflected, because it is the one property that decides which of two readings
 this is and a stylesheet has a reason to know: a compact reading is a fixed
 few characters and a date is not. */
   elapsed?: (HelixFormatDate["elapsed"]) | undefined;
+  /** How the era is written, such as AD, where a date is shown. */
+  era?: (HelixFormatDate["era"]) | undefined;
   /** How the hour is written, where a time of day is shown. */
   hour?: (HelixFormatDate["hour"]) | undefined;
+  /** The clock a time of day is written on: `h12` or `h11` for twelve hours,
+`h23` or `h24` for twenty-four.
+
+Absent is the locale's own, which is right unless your product shows every
+reader the same clock whatever their language. */
+  "hour-cycle"?: (HelixFormatDate["hourCycle"]) | undefined;
+  /** The clock a time of day is written on: `h12` or `h11` for twelve hours,
+`h23` or `h24` for twenty-four.
+
+Absent is the locale's own, which is right unless your product shows every
+reader the same clock whatever their language. */
+  hourCycle?: (HelixFormatDate["hourCycle"]) | undefined;
   /** The locale to format the timestamp in.
 
 Empty is the runtime's own. */
@@ -5971,8 +6526,26 @@ Empty is the runtime's own. */
   minute?: (HelixFormatDate["minute"]) | undefined;
   /** How the month is written, where a date is shown. */
   month?: (HelixFormatDate["month"]) | undefined;
+  /** Whether a `relative` reading may use a word for a number: `auto` says
+"yesterday" and "now", and `always` says "1 day ago" and "in 0 seconds". */
+  numeric?: (HelixFormatDate["numeric"]) | undefined;
+  /** Shows how long ago the timestamp was, or how long until it, in words, in
+place of the date: `long` ("3 hours ago"), `short` ("3 hr. ago") or
+`narrow` ("3h ago").
+
+The reading refreshes as it goes stale, as `elapsed` does, and the whole
+date is its title. `elapsed` wins where both are set. */
+  relative?: (HelixFormatDate["relative"]) | undefined;
   /** How the second is written, where a time of day is shown. */
   second?: (HelixFormatDate["second"]) | undefined;
+  /** The locale's own pattern for the time of day: `full`, `long`, `medium`, or
+`short`. Set, it stands in for `hour`, `minute`, `second` and
+`time-zone-name`. */
+  "time-style"?: (HelixFormatDate["timeStyle"]) | undefined;
+  /** The locale's own pattern for the time of day: `full`, `long`, `medium`, or
+`short`. Set, it stands in for `hour`, `minute`, `second` and
+`time-zone-name`. */
+  timeStyle?: (HelixFormatDate["timeStyle"]) | undefined;
   /** The time zone to read the timestamp in.
 
 Empty is the runtime's own. */
@@ -6568,6 +7141,22 @@ Lives here rather than only on `IconButton` so the two share one render.
 An icon-only button without it is a control a screen reader announces as
 "button" and nothing else. */
   label?: (HelixIconButton["label"]) | undefined;
+  /** Whether the action the button started is still running.
+
+A pending button keeps focus and stays in the tab order, and refuses every
+press: a click, Enter and Space, and Enter in a field of its form. The
+click does not reach your listeners. The inner control carries
+`aria-busy` and `aria-disabled`, and when the button becomes pending while
+it has focus, a reader hears `pending-label`. The styled button draws a
+turning ring over its words.
+
+`disabled` takes the button out of reach. Use `pending` for the wait after
+a press, so focus stays where the reader left it. */
+  pending?: (HelixIconButton["pending"]) | undefined;
+  /** What a reader hears when the button becomes pending while it has focus. */
+  "pending-label"?: (HelixIconButton["pendingLabel"]) | undefined;
+  /** What a reader hears when the button becomes pending while it has focus. */
+  pendingLabel?: (HelixIconButton["pendingLabel"]) | undefined;
   /** What activating the button does to its form. */
   type?: (HelixIconButton["type"]) | undefined;
   /** The value this button submits under its own `name`, as a native submit
@@ -6687,8 +7276,12 @@ disagreeing with its own name for every reader who meant the left. */
 so it is what markup can carry, and resolving one means an index of the
 whole set that no bundler can shake: 15 kB for a consumer who renders one
 mark. An attribute is the only thing an HTML author can write, and that is
-worth the index; a consumer who would rather not pay it hands over the
-value instead. */
+worth the index; a consumer who would rather not pay it imports the
+element from `icon/root` and registers the glyphs it names, or hands over
+the value instead.
+
+A name written `prefix:name` asks the library registered under that
+prefix. */
   name?: (HelixIcon["name"]) | undefined;
   /** The icon to draw, as an object you import.
 
@@ -6706,8 +7299,10 @@ for. Set both and this wins, the value being the more specific statement. */
 };
 
 export type HelixIconVueEvents = {
-  /** `name` matches no icon in the set, so nothing is drawn. */
+  /** `name` matches no registered icon and no library answers it, so nothing is drawn. */
   error: HelixIconElementEvent;
+  /** A glyph a library gave later for `name` is drawn. */
+  load: HelixIconElementEvent;
 };
 
 /** `HelixImage` component event */
@@ -6766,6 +7361,18 @@ ninety-nine pictures. */
 picture worth putting in a component is usually below the fold and the one
 that is not is the exception worth writing down. */
   loading?: (HelixImage["loading"]) | undefined;
+  /** How long, in milliseconds, the placeholder waits before it shows.
+
+Absent or `0` shows it at once. A picture that arrives inside
+the wait never shows a placeholder at all, so a cached or fast image does
+not flash one. Radix's `delayMs` on its avatar fallback is the same idea. */
+  "placeholder-delay"?: (HelixImage["placeholderDelay"] | `${number}`) | undefined;
+  /** How long, in milliseconds, the placeholder waits before it shows.
+
+Absent or `0` shows it at once. A picture that arrives inside
+the wait never shows a placeholder at all, so a cached or fast image does
+not flash one. Radix's `delayMs` on its avatar fallback is the same idea. */
+  placeholderDelay?: (HelixImage["placeholderDelay"]) | undefined;
   /** How much of the referring URL to send with the request. */
   referrerpolicy?: (HelixImage["referrerPolicy"]) | undefined;
   /** How much of the referring URL to send with the request. */
@@ -7011,6 +7618,8 @@ export type HelixInputVueEvents = {
   change: HelixInputElementEvent;
   /** The text is about to change. Cancelable: cancel it to keep the current text. */
   "helix-before-change": HelixInputHelixBeforeChangeElementEvent;
+  /** Fired after the clear button has emptied the field, after `input` and `change`. */
+  "helix-clear": HelixInputElementEvent;
   /** Fired as the value changes. */
   input: HelixInputElementEvent;
 };
@@ -7022,6 +7631,13 @@ export type HelixKbdHelixShortcutElementEvent =
   HelixKbdElementEvent<HelixShortcutEvent>;
 
 export type HelixKbdVueProps = {
+  /** The id of the control the shortcut works, which is given the chord as its
+`aria-keyshortcuts`.
+
+Names an element in the same tree, the way `Tooltip.for` does. Separate
+from `within`, which says where the key listens: a key can describe a
+shortcut the page binds itself. */
+  for?: (HelixKbd["for"]) | undefined;
   /** The key or chord to show, such as `mod+k`, `?`, or `/`.
 
 `mod` is the platform's own command modifier, which is the reason to write
@@ -7050,6 +7666,12 @@ export type HelixKbdVueEvents = {
   "helix-shortcut": HelixKbdHelixShortcutElementEvent;
 };
 
+/** `HelixLegend` component event */
+export type HelixLegendElementEvent<E = Event> = TypedEvent<HelixLegend, E>;
+/** `helix-before-change` event type */
+export type HelixLegendHelixBeforeChangeElementEvent =
+  HelixLegendElementEvent<HelixBeforeChangeEvent>;
+
 export type HelixLegendVueProps = {
   /** How the swatches are drawn: `outlined`, `subtle`, or `solid`.
 
@@ -7145,14 +7767,40 @@ shadow root reads a table in that root rather than one in the document.
 **In React this arrives as a property and not as an attribute**, the way
 `Tooltip.for` does, so it does not reflect and nothing styles on it. */
   for?: (HelixLegend["for"]) | undefined;
+  /** The series hidden on the table, by name, separated by commas: what
+`toggles` hides and shows.
+
+Set it to start with series hidden. Every chart reading the same table
+draws without them. Commas only, because a column's heading may hold a
+space. For a ring the names are the rows. */
+  "hidden-series"?: (HelixLegend["hiddenSeries"]) | undefined;
+  /** The series hidden on the table, by name, separated by commas: what
+`toggles` hides and shows.
+
+Set it to start with series hidden. Every chart reading the same table
+draws without them. Commas only, because a column's heading may hold a
+space. For a ring the names are the rows. */
+  hiddenSeries?: (HelixLegend["hiddenSeries"]) | undefined;
   /** The name of the list, which a screen reader announces before its entries.
 
 Absent names the list after the table's caption, so a page with several
 charts has a legend list for each that says which chart it keys. */
   label?: (HelixLegend["label"]) | undefined;
+  /** Makes each entry a button that hides or shows its series in every chart
+reading the same table.
+
+Absent, the legend only displays, which is what it did before this
+existed. Reflected, because the styled tier draws a button differently
+from a plain entry. */
+  toggles?: (HelixLegend["toggles"]) | undefined;
 };
 
-export type HelixLegendVueEvents = {};
+export type HelixLegendVueEvents = {
+  /** Fired once a toggle has hidden or shown a series. */
+  change: HelixLegendElementEvent;
+  /** Fired before a toggle hides or shows a series, with the `hidden-series` it would leave. Cancelable. */
+  "helix-before-change": HelixLegendHelixBeforeChangeElementEvent;
+};
 
 export type HelixLightboxItemVueProps = {
   /** Whether this item is the one shown.
@@ -7221,6 +7869,19 @@ hydration, or diffed by a framework, it comes back holding whatever the
 last reader did rather than what the author wrote. `:state(open)` carries
 the resolved state for stylesheets, which is what the mirror is for. */
   open?: (HelixLightbox["open"]) | undefined;
+  /** Draws the viewer's own previous, next and close controls over the picture.
+
+Off by default, for a viewer whose chrome you compose in the `header` and
+`footer` slots. The controls hide with the rest of the chrome while the
+reader is idle, and the previous and next ones say they are unavailable at
+either end of a set that does not `loop`. */
+  controls?: (HelixLightbox["controls"]) | undefined;
+  /** The close control's accessible name. Translate it with the rest of your
+interface. */
+  "dismiss-label"?: (HelixLightbox["dismissLabel"]) | undefined;
+  /** The close control's accessible name. Translate it with the rest of your
+interface. */
+  dismissLabel?: (HelixLightbox["dismissLabel"]) | undefined;
   /** How long the user can be idle before the header and footer hide, in
 milliseconds.
 
@@ -7239,6 +7900,28 @@ keep the chrome up is the consumer's to decide with this. */
   label?: (HelixLightbox["label"]) | undefined;
   /** Whether moving past the last item returns to the first. */
   loop?: (HelixLightbox["loop"]) | undefined;
+  /** The next control's accessible name. */
+  "next-label"?: (HelixLightbox["nextLabel"]) | undefined;
+  /** The next control's accessible name. */
+  nextLabel?: (HelixLightbox["nextLabel"]) | undefined;
+  /** The previous control's accessible name. */
+  "previous-label"?: (HelixLightbox["previousLabel"]) | undefined;
+  /** The previous control's accessible name. */
+  previousLabel?: (HelixLightbox["previousLabel"]) | undefined;
+  /** The name of an item with no `label` of its own, with `{index}` and
+`{count}` filled in. */
+  "slide-label"?: (HelixLightbox["slideLabel"]) | undefined;
+  /** The name of an item with no `label` of its own, with `{index}` and
+`{count}` filled in. */
+  slideLabel?: (HelixLightbox["slideLabel"]) | undefined;
+  /** The word screen readers announce in place of an item's role, set as
+`aria-roledescription`. Translate it with the rest of your text, or empty
+it to leave the role as `group`. */
+  "slide-role-label"?: (HelixLightbox["slideRoleLabel"]) | undefined;
+  /** The word screen readers announce in place of an item's role, set as
+`aria-roledescription`. Translate it with the rest of your text, or empty
+it to leave the role as `group`. */
+  slideRoleLabel?: (HelixLightbox["slideRoleLabel"]) | undefined;
   /** The status text that says which item is shown, with `{index}`, `{count}`
 and the item's `{label}` filled in.
 
@@ -7595,6 +8278,22 @@ filtering already does: `filter`, the empty state and the keyboard are all
 this component's. A select, a combobox and a command palette drawing their
 own search boxes would be three copies of one field. */
   filterable?: (HelixListbox["filterable"]) | undefined;
+  /** How long typing in the filter field rests before the list is filtered, in
+milliseconds. `0` filters on every keystroke.
+
+For a list filtered on a server, where `helix-filter` starts a request: a
+reader typing a word sends one request for the word, not one for each
+letter. Enter and the arrow keys filter at once on what is typed, so they
+act on the list the reader expects. */
+  "filter-delay"?: (HelixListbox["filterDelay"] | `${number}`) | undefined;
+  /** How long typing in the filter field rests before the list is filtered, in
+milliseconds. `0` filters on every keystroke.
+
+For a list filtered on a server, where `helix-filter` starts a request: a
+reader typing a word sends one request for the word, not one for each
+letter. Enter and the arrow keys filter at once on what is typed, so they
+act on the list the reader expects. */
+  filterDelay?: (HelixListbox["filterDelay"]) | undefined;
   /** Placeholder text for the filter field. */
   "filter-label"?: (HelixListbox["filterLabel"]) | undefined;
   /** Placeholder text for the filter field. */
@@ -7608,6 +8307,26 @@ a reader can move through the options before closing the panel on one. */
   manual?: (HelixListbox["manual"]) | undefined;
   /** Whether more than one option can be chosen. */
   multiple?: (HelixListbox["multiple"]) | undefined;
+  /** What a screen reader hears when a filter leaves one option. `{count}` is
+the count. */
+  "result-label"?: (HelixListbox["resultLabel"]) | undefined;
+  /** What a screen reader hears when a filter leaves one option. `{count}` is
+the count. */
+  resultLabel?: (HelixListbox["resultLabel"]) | undefined;
+  /** What a screen reader hears when a filter leaves any other number of
+options. `{count}` is the count.
+
+**Two sentences, chosen by `Intl.PluralRules`**, which is Data Table's
+pair: a language with more forms than two picks the one for its `one` and
+writes the rest here. */
+  "results-label"?: (HelixListbox["resultsLabel"]) | undefined;
+  /** What a screen reader hears when a filter leaves any other number of
+options. `{count}` is the count.
+
+**Two sentences, chosen by `Intl.PluralRules`**, which is Data Table's
+pair: a language with more forms than two picks the one for its `one` and
+writes the rest here. */
+  resultsLabel?: (HelixListbox["resultsLabel"]) | undefined;
   /** Whether the control is disabled and cannot be used.
 
 Reflected, because the styled tier selects on it, and mirrored to
@@ -7671,6 +8390,18 @@ swells with it, in step. It is the shape for a wait that has a mark to
 show, a splash or a first paint behind a wordmark, where a rotating rim
 around a logo reads as chrome bolted to the brand. */
   variant?: (HelixLoader["variant"]) | undefined;
+  /** How long the loader waits before it shows, in milliseconds, so work that
+finishes quickly never flashes one.
+
+Absent shows it at once. Hidden in the served markup too, so a page that
+loads quickly never draws it. */
+  delay?: (HelixLoader["delay"]) | undefined;
+  /** The id of the region being loaded, which is marked `aria-busy` while the
+loader is on the page.
+
+Names an element in the same tree. In React it arrives as a property, the
+way `Tooltip.for` does. */
+  for?: (HelixLoader["for"]) | undefined;
   /** The loader's name, announced by screen readers while the work is in
 progress. */
   label?: (HelixLoader["label"]) | undefined;
@@ -8797,7 +9528,10 @@ no reader. */
 
 Absent leaves the range unbanded. */
   high?: (HelixMeter["high"]) | undefined;
-  /** Accessible name for the reading. */
+  /** Accessible name for the reading.
+
+A visible label in the `label` slot names it instead, with the words it
+shows, so the name and the label cannot disagree. */
   label?: (HelixMeter["label"]) | undefined;
   /** The locale the percentage is written in, such as `fr` for `72 %`.
 
@@ -9075,6 +9809,12 @@ say that without the component knowing what a row looks like. */
   "mark-all-label"?: (HelixNotifications["markAllLabel"]) | undefined;
   /** Label for the mark-all control. */
   markAllLabel?: (HelixNotifications["markAllLabel"]) | undefined;
+  /** How many notifications there are in all, where the feed holds only some of
+them, read as each row's `aria-setsize`. `-1` says the count is unknown.
+
+Unset, the browser counts the rows it can see, which is right for a feed
+that holds everything. */
+  total?: (HelixNotifications["total"]) | undefined;
 };
 
 export type HelixNotificationsVueEvents = {
@@ -9162,6 +9902,22 @@ reach the bubble. Absent is the control's own sentence, in English. */
   "decrement-label"?: (HelixNumberInput["decrementLabel"]) | undefined;
   /** The name of the step down button, read by screen readers. */
   decrementLabel?: (HelixNumberInput["decrementLabel"]) | undefined;
+  /** `Intl.NumberFormat` options the number is shown with while the field is
+not being edited: a currency, a percent, a unit, or a number of decimals.
+Written as JSON in the attribute.
+
+```html
+<helix-number-input format-options='{"style":"currency","currency":"EUR"}'></helix-number-input>
+``` */
+  "format-options"?: (HelixNumberInput["formatOptions"]) | undefined;
+  /** `Intl.NumberFormat` options the number is shown with while the field is
+not being edited: a currency, a percent, a unit, or a number of decimals.
+Written as JSON in the attribute.
+
+```html
+<helix-number-input format-options='{"style":"currency","currency":"EUR"}'></helix-number-input>
+``` */
+  formatOptions?: (HelixNumberInput["formatOptions"]) | undefined;
   /** The name of the step up button, read by screen readers. */
   "increment-label"?: (HelixNumberInput["incrementLabel"]) | undefined;
   /** The name of the step up button, read by screen readers. */
@@ -9213,6 +9969,12 @@ filled in. */
   readonly?: (HelixNumberInput["readOnly"]) | undefined;
   /** Prevents editing. The value is still submitted with the form. */
   readOnly?: (HelixNumberInput["readOnly"]) | undefined;
+  /** What the field is described as on iOS and iPadOS, where it carries no
+spinbutton role. See the class description. */
+  "role-description"?: (HelixNumberInput["roleDescription"]) | undefined;
+  /** What the field is described as on iOS and iPadOS, where it carries no
+spinbutton role. See the class description. */
+  roleDescription?: (HelixNumberInput["roleDescription"]) | undefined;
   /** Makes the label a grip that changes the value when it is dragged.
 
 The label is what is dragged, so this adds no chrome at all. Still opt-in,
@@ -9245,6 +10007,10 @@ A unit slotted into `end` is drawn beside the number and is not part of
 what the spinbutton announces, so it goes here too. Empty announces the
 number alone. */
   valueText?: (HelixNumberInput["valueText"]) | undefined;
+  /** Whether the mouse wheel steps the number while the field has focus, as
+React Aria's NumberField does unless told not to. Off, the wheel scrolls
+the page, which is what a reader passing over a form expects. */
+  wheel?: (HelixNumberInput["wheel"]) | undefined;
   /** Whether the control is disabled and cannot be used.
 
 Reflected, because the styled tier selects on it, and mirrored to
@@ -9479,6 +10245,24 @@ string is not a fact a selector needs. */
   description?: (HelixOption["description"]) | undefined;
   /** Prevents the option from being chosen. */
   disabled?: (HelixOption["disabled"]) | undefined;
+  /** Whether following the link downloads what it names. Only meaningful
+beside an `href`. */
+  download?: (HelixOption["download"]) | undefined;
+  /** The URL the option links to. Setting it makes the option a link: choosing
+it, with a press, Enter or a click, follows the link and selects nothing,
+as React Aria's items with `href` do. Command, Control and Shift open it
+where they open a link, in a new tab or a new window.
+
+`helix-select` is said first with the `href` in it, and canceling it keeps
+the browser from following, so a client-side router follows it instead.
+
+**The option stays an option**, and an anchor is never drawn inside it:
+`role="option"` sits on the host, where a listbox's
+`aria-activedescendant` can name it, and an `<a>` inside would be exposed
+as a link within the option and take its name (Menu Item's `href` records
+the measurement). The link is followed through an anchor made for the
+moment, which `followLink` describes. */
+  href?: (HelixOption["href"]) | undefined;
   /** A shorter name for this choice, for where the row does not fit.
 
 `<option label>`'s own meaning: the text a chooser shows when it has less
@@ -9490,10 +10274,30 @@ simply the accessible name.
 `<option label>` does: written the platform's way, a select listed a row of
 nothing for every choice. */
   label?: (HelixOption["label"]) | undefined;
+  /** The link's `rel`. Set it whenever you set `target="_blank"`. */
+  rel?: (HelixOption["rel"]) | undefined;
   /** Whether this choice is currently chosen.
 
 Written by the listbox. */
   selected?: (HelixOption["selected"]) | undefined;
+  /** Where the link opens, such as `_blank`, for an option with an `href`. */
+  target?: (HelixOption["target"]) | undefined;
+  /** The words a reader types to reach this choice, where the row's own words
+are not them: typeahead, a filter and a combobox match against it, and a
+select's trigger shows it.
+
+For a row whose content is a picture, an avatar beside a name and a role,
+or a name written in another script, as React Aria's `textValue`. Empty
+reads the row's words, then `label`. */
+  "text-value"?: (HelixOption["textValue"]) | undefined;
+  /** The words a reader types to reach this choice, where the row's own words
+are not them: typeahead, a filter and a combobox match against it, and a
+select's trigger shows it.
+
+For a row whose content is a picture, an avatar beside a name and a role,
+or a name written in another script, as React Aria's `textValue`. Empty
+reads the row's words, then `label`. */
+  textValue?: (HelixOption["textValue"]) | undefined;
   /** The value that identifies the option, and that a form submits. */
   value?: (HelixOption["value"]) | undefined;
   /** Whether the markup declares this option selected. A form reset returns to it.
@@ -9525,7 +10329,7 @@ change of its own rather than a property being added. */
 };
 
 export type HelixOptionVueEvents = {
-  /** The option was chosen. Cancelable: canceling it leaves the selection as it was. */
+  /** The option was chosen. Cancelable: canceling it leaves the selection as it was, and keeps the browser from following an option's `href`. */
   "helix-select": HelixOptionHelixSelectElementEvent;
 };
 
@@ -9908,10 +10712,18 @@ that lets a phone offer the code out of a message. Later cells stay `off`
 for the reason in the class comment above, that six cells each offering
 the same code is one offer made six times. */
   autocomplete?: (HelixPinInput["autocomplete"]) | undefined;
+  /** Whether the form is submitted once the last box is filled, as Web
+Awesome's `autosubmit` and Radix's `autoSubmit`. Only for a code the field
+took: a refused last character submits nothing. */
+  autosubmit?: (HelixPinInput["autosubmit"]) | undefined;
   /** Accessible name for one box, with `{index}` and `{length}` filled in. */
   "cell-label"?: (HelixPinInput["cellLabel"]) | undefined;
   /** Accessible name for one box, with `{index}` and `{length}` filled in. */
   cellLabel?: (HelixPinInput["cellLabel"]) | undefined;
+  /** Separators drawn between the boxes: `#` or `*` for a box and anything
+else as it is written, so `###-###` draws a dash after the third. The
+separators are hidden from screen readers and are not part of the value. */
+  format?: (HelixPinInput["format"]) | undefined;
   /** How many characters the code has. */
   length?: (HelixPinInput["length"]) | undefined;
   /** Whether the characters are hidden, the way a password is. */
@@ -10037,8 +10849,17 @@ hydration, or diffed by a framework, it comes back holding whatever the
 last reader did rather than what the author wrote. `:state(open)` carries
 the resolved state for stylesheets, which is what the mirror is for. */
   open?: (HelixPopover["open"]) | undefined;
-  /** The panel's name, read by screen readers. */
+  /** Draws a point on the panel's edge facing the trigger.
+
+Off by default, which is the house style: a panel that opens from its
+trigger already reads as belonging to it. */
+  arrow?: (HelixPopover["arrow"]) | undefined;
+  /** The panel's name, read by screen readers. Left at `Popover`, the first
+heading in the panel names it instead. */
   label?: (HelixPopover["label"]) | undefined;
+  /** Keeps `Tab` inside the panel while it is open, and marks the panel
+`aria-modal`. A press outside and Escape still close it. */
+  modal?: (HelixPopover["modal"]) | undefined;
   /** Space between the trigger and the panel, in pixels. */
   offset?: (HelixPopover["offset"]) | undefined;
   /** Preferred side.
@@ -10088,7 +10909,10 @@ Not `Loader`, which is the other thing this could be. A loader says the
 page is busy; a bar says a named piece of work is running, and keeps its
 place in the layout when the answer arrives and it becomes determinate. */
   indeterminate?: (HelixProgress["indeterminate"]) | undefined;
-  /** Accessible name for what is in progress. */
+  /** Accessible name for what is in progress.
+
+A visible label in the `label` slot names it instead, with the words it
+shows, so the name and the label cannot disagree. */
   label?: (HelixProgress["label"]) | undefined;
   /** The locale the percentage is written in, such as `fr` for `72 %`.
 
@@ -10271,6 +11095,22 @@ not touch, and React reads that as a hydration mismatch. The absent
 attribute *is* the column, which the stylesheet reads as the base rule, so
 only `horizontal` has to be named. */
   orientation?: (HelixRadioGroup["orientation"]) | undefined;
+  /** Whether a reader can see and focus the answer and cannot change it. A
+read-only group still submits its value.
+
+React Aria's `isReadOnly`. A press on a radio is refused, and the arrow
+keys, Home and End leave focus on the answer, so Tab still reaches it and
+a reader hears it with the group's name. The group says `aria-readonly`.
+A script can still set `value`. */
+  readonly?: (HelixRadioGroup["readOnly"]) | undefined;
+  /** Whether a reader can see and focus the answer and cannot change it. A
+read-only group still submits its value.
+
+React Aria's `isReadOnly`. A press on a radio is refused, and the arrow
+keys, Home and End leave focus on the answer, so Tab still reaches it and
+a reader hears it with the group's name. The group says `aria-readonly`.
+A script can still set `value`. */
+  readOnly?: (HelixRadioGroup["readOnly"]) | undefined;
   /** Whether the control is disabled and cannot be used.
 
 Reflected, because the styled tier selects on it, and mirrored to
@@ -10528,6 +11368,10 @@ and this one was the English a form in another language still spoke in
 the bubble it raises on submit: `feedback` replaces the message under
 the field and does not reach that one. */
   valueMissingMessage?: (HelixRating["valueMissingMessage"]) | undefined;
+  /** Whether a reader can take the rating back to unrated: by pressing the
+chosen score again, or with Backspace or Delete. Zag's rating group
+clears the same way. */
+  clearable?: (HelixRating["clearable"]) | undefined;
   /** How many marks there are. */
   max?: (HelixRating["max"]) | undefined;
   /** The lowest score that can be given. A cleared rating shows this score.
@@ -10673,6 +11517,8 @@ export type HelixRatingVueEvents = {
   change: HelixRatingElementEvent;
   /** The score is about to change. Cancelable: cancel it to keep the current score. */
   "helix-before-change": HelixRatingHelixBeforeChangeElementEvent;
+  /** The rating went back to unrated, under `clearable`. Sent after `input` and `change`. */
+  "helix-clear": HelixRatingElementEvent;
   /** The score changed. */
   input: HelixRatingElementEvent;
 };
@@ -11183,6 +12029,15 @@ imperatively later, and nothing is hydrating by then.
 
 Here rather than on each control. */
   name?: (HelixSelect["name"]) | undefined;
+  /** What the trigger shows for the chosen options: a function given them, in
+the order they appear, that returns text, an element or a Lit template.
+
+For a trigger that shows more than the words, an avatar beside a name or a
+count of a long set, as React Aria's `SelectValue` takes children. The
+trigger is named by what this draws, so keep the words in it. Nothing
+chosen still shows `placeholder`. A property only, there being no way to
+write a function in markup. */
+  valueContent?: (HelixSelect["valueContent"]) | undefined;
   /** Which option is chosen, as an index, or `-1` where none is.
 
 Read off the listbox this renders, which owns the options and is where the
@@ -11210,6 +12065,11 @@ export type HelixSelectVueEvents = {
 };
 
 export type HelixSkeletonVueProps = {
+  /** How the placeholder shows it is waiting: a sweep when unset, `pulse` to
+fade the fill in and out, or `none` to sit still.
+
+Reduced motion stills both. */
+  effect?: (HelixSkeleton["effect"]) | undefined;
   /** The shape of the placeholder: `text`, `circle`, or a block when unset.
 
 Unset is a block, which is what most missing things are. A block is the
@@ -11221,6 +12081,12 @@ profile".
 
 Absent hides the placeholder from screen readers. */
   label?: (HelixSkeleton["label"]) | undefined;
+  /** Whether the content inside is still loading, which keeps it inert and
+draws the placeholder over it.
+
+Absent shows the content. An empty skeleton is a placeholder whatever
+this says. Reflected, because the styled tier hides the content on it. */
+  loading?: (HelixSkeleton["loading"]) | undefined;
 };
 
 export type HelixSkeletonVueEvents = {};
@@ -11290,6 +12156,25 @@ and this one was the English a form in another language still spoke in
 the bubble it raises on submit: `feedback` replaces the message under
 the field and does not reach that one. */
   valueMissingMessage?: (HelixSlider["valueMissingMessage"]) | undefined;
+  /** `Intl.NumberFormat` options the value is written with: a currency, a
+percent, a unit, or a number of decimals. Written as JSON in the
+attribute.
+
+```html
+<helix-slider format-options='{"style":"currency","currency":"USD"}'></helix-slider>
+``` */
+  "format-options"?: (HelixSlider["formatOptions"]) | undefined;
+  /** `Intl.NumberFormat` options the value is written with: a currency, a
+percent, a unit, or a number of decimals. Written as JSON in the
+attribute.
+
+```html
+<helix-slider format-options='{"style":"currency","currency":"USD"}'></helix-slider>
+``` */
+  formatOptions?: (HelixSlider["formatOptions"]) | undefined;
+  /** The locale `format-options` writes the value in, such as `de-DE`. Empty is
+the reader's own. */
+  locale?: (HelixSlider["locale"]) | undefined;
   /** Shows the value at each mark. */
   "marker-labels"?: (HelixSlider["markerLabels"]) | undefined;
   /** Shows the value at each mark. */
@@ -11332,6 +12217,12 @@ property, like every other word a control speaks. */
   "minimum-label"?: (HelixSlider["minimumLabel"]) | undefined;
   /** The name of a range's lower thumb, read after the slider's label. */
   minimumLabel?: (HelixSlider["minimumLabel"]) | undefined;
+  /** How many steps a range's two thumbs stay apart, as Zag's
+`minStepsBetweenThumbs`. A thumb pushed closer stops there. */
+  "min-steps-between-thumbs"?: (HelixSlider["minStepsBetweenThumbs"] | `${number}`) | undefined;
+  /** How many steps a range's two thumbs stay apart, as Zag's
+`minStepsBetweenThumbs`. A thumb pushed closer stops there. */
+  minStepsBetweenThumbs?: (HelixSlider["minStepsBetweenThumbs"]) | undefined;
   /** The direction the track runs. `vertical` stands it on end.
 
 For a level rather than a quantity: a fader, a channel, anything a reader
@@ -11387,6 +12278,10 @@ imperatively later, and nothing is hydrating by then.
 
 Here rather than on each control. */
   name?: (HelixSlider["name"]) | undefined;
+  /** Writes a value as text, in place of `format-options`: words for a scale,
+or anything `Intl.NumberFormat` cannot say. A property, since a function
+cannot be written in an attribute. */
+  formatter?: (HelixSlider["formatter"]) | undefined;
 };
 
 export type HelixSliderVueEvents = {
@@ -11933,6 +12828,28 @@ stylesheets. */
   "default-checked"?: (HelixSwitch["defaultChecked"]) | undefined;
   /** Whether the control starts checked. A form reset returns it to this state. */
   defaultChecked?: (HelixSwitch["defaultChecked"]) | undefined;
+  /** Whether a reader can see and focus the control and cannot change it. A
+read-only control still submits its value.
+
+React Aria's `isReadOnly`. A native checkbox has no read-only state, so
+the press is refused at the inner control, which keeps its box as it
+was, and the control says `aria-readonly`. A script can still set
+`checked`, as it can set the value of a read-only text field.
+
+The attribute is `readonly`, which is the platform's spelling for the
+text fields. */
+  readonly?: (HelixSwitch["readOnly"]) | undefined;
+  /** Whether a reader can see and focus the control and cannot change it. A
+read-only control still submits its value.
+
+React Aria's `isReadOnly`. A native checkbox has no read-only state, so
+the press is refused at the inner control, which keeps its box as it
+was, and the control says `aria-readonly`. A script can still set
+`checked`, as it can set the value of a read-only text field.
+
+The attribute is `readonly`, which is the platform's spelling for the
+text fields. */
+  readOnly?: (HelixSwitch["readOnly"]) | undefined;
   /**  */
   "aria-label"?: unknown;
   /** The validation message shown under the control. It replaces the
@@ -12406,6 +13323,44 @@ export type HelixTabVueEvents = {
   "helix-select": HelixTabHelixSelectElementEvent;
 };
 
+/** `HelixTagGroup` component event */
+export type HelixTagGroupElementEvent<E = Event> = TypedEvent<HelixTagGroup, E>;
+/** `helix-before-change` event type */
+export type HelixTagGroupHelixBeforeChangeElementEvent =
+  HelixTagGroupElementEvent<HelixBeforeChangeEvent>;
+/** `helix-dismiss` event type */
+export type HelixTagGroupHelixDismissElementEvent =
+  HelixTagGroupElementEvent<HelixDismissEvent>;
+
+export type HelixTagGroupVueProps = {
+  /** The name of the set, such as "Filters", which a screen reader announces
+before its tags. */
+  label?: (HelixTagGroup["label"]) | undefined;
+  /** How many tags a reader can select: `single`, `multiple`, or none.
+
+Absent selects nothing, and the tags carry no selected state at all. */
+  "selection-mode"?: (HelixTagGroup["selectionMode"]) | undefined;
+  /** How many tags a reader can select: `single`, `multiple`, or none.
+
+Absent selects nothing, and the tags carry no selected state at all. */
+  selectionMode?: (HelixTagGroup["selectionMode"]) | undefined;
+  /** The selected tags' values, separated by commas, since a value may hold a
+space.
+
+Set it to start with tags selected. A tag's value is its `value`, or its
+words where it has none. */
+  value?: (HelixTagGroup["value"]) | undefined;
+};
+
+export type HelixTagGroupVueEvents = {
+  /** Fired once a press has changed which tags are selected. */
+  change: HelixTagGroupElementEvent;
+  /** Fired before a press changes which tags are selected, with the `value` it would leave. Cancelable. */
+  "helix-before-change": HelixTagGroupHelixBeforeChangeElementEvent;
+  /** A tag's remove button was pressed, or Delete or Backspace on the focused tag. Bubbles from that tag, which is its `target`; remove the tag in response. Cancelable. */
+  "helix-dismiss": HelixTagGroupHelixDismissElementEvent;
+};
+
 /** `HelixTag` component event */
 export type HelixTagElementEvent<E = Event> = TypedEvent<HelixTag, E>;
 /** `helix-dismiss` event type */
@@ -12456,6 +13411,28 @@ derive one rather than dash-casing it, so this would otherwise be
 reachable only as `dismisslabel`, which nobody would guess and no linter
 would catch. */
   dismissLabel?: (HelixTag["dismissLabel"]) | undefined;
+  /** Takes the tag out of reach: its link and its remove button stop
+answering, and in a `Tag.Group` the arrow keys pass over it and it cannot
+be selected or removed. */
+  disabled?: (HelixTag["disabled"]) | undefined;
+  /** Makes the label a link to this address. */
+  href?: (HelixTag["href"]) | undefined;
+  /** What the tag stands for in its group's `value`.
+
+Absent is the tag's own words, its category first. */
+  value?: (HelixTag["value"]) | undefined;
+  /** Whether the tag holds its group's tab stop.
+
+Written by `Tag.Group` on every tag it holds, and unset outside one, which
+is how a tag knows it is a row. No attribute: it is coordination between
+elements, the same shape `Toggle.focusable` has. */
+  focusable?: (HelixTag["focusable"]) | undefined;
+  /** Whether the tag is selected, in a `Tag.Group` that selects.
+
+Written by the group from its own `value`, and unset where nothing can be
+selected, which is what keeps `aria-selected` off a set that does not
+select. */
+  selected?: (HelixTag["selected"]) | undefined;
 };
 
 export type HelixTagVueEvents = {
@@ -12596,6 +13573,12 @@ element sends two entries, and that is what this does. */
   maxlength?: (HelixTextarea["maxLength"] | `${number}`) | undefined;
   /** The most characters the value can have. */
   maxLength?: (HelixTextarea["maxLength"]) | undefined;
+  /** How many lines an `auto-grow` field grows to before it scrolls. Absent,
+it grows with all of its text. */
+  "max-rows"?: (HelixTextarea["maxRows"] | `${number}`) | undefined;
+  /** How many lines an `auto-grow` field grows to before it scrolls. Absent,
+it grows with all of its text. */
+  maxRows?: (HelixTextarea["maxRows"]) | undefined;
   /** The fewest characters the value can have.
 
 Forwarded to the real `<textarea>` rather than checked here, which is what
@@ -12695,6 +13678,20 @@ export type HelixTimeInputHelixBeforeOpenElementEvent =
   HelixTimeInputElementEvent<HelixBeforeOpenEvent>;
 
 export type HelixTimeInputVueProps = {
+  /** What a screen reader hears for a segment with nothing in it, which a
+sighted reader sees as dashes. */
+  "empty-segment-label"?: (HelixTimeInput["emptySegmentLabel"]) | undefined;
+  /** What a screen reader hears for a segment with nothing in it, which a
+sighted reader sees as dashes. */
+  emptySegmentLabel?: (HelixTimeInput["emptySegmentLabel"]) | undefined;
+  /** Whether the field is a row of segments, one for each part of the date or
+time, in place of a line of text.
+
+Each segment is set with digits or the arrow keys, in the order the
+locale writes them, so a reader types a date the way they write one and
+no format has to be read back. The picker still opens from the trigger
+and with Alt+Down. */
+  segmented?: (HelixTimeInput["segmented"]) | undefined;
   /** Whether the value is locked. A read-only control still submits its value.
 
 **Enforced by refusing every request in one place**, which is the seam this
@@ -12824,6 +13821,16 @@ a typed time, which is then invalid. */
 Handed to the list, which offers them as unavailable, and checked against
 a typed time, which is then invalid. */
   disableTimes?: (HelixTimeInput["disableTimes"]) | undefined;
+  /** The clock the times are written on: `h12` for twelve hours with a
+meridiem, `h23` for twenty-four. Absent is the locale's own.
+
+Handed to the list. The value is `HH:mm` on twenty-four hours either way. */
+  "hour-cycle"?: (HelixTimeInput["hourCycle"]) | undefined;
+  /** The clock the times are written on: `h12` for twelve hours with a
+meridiem, `h23` for twenty-four. Absent is the locale's own.
+
+Handed to the list. The value is `HH:mm` on twenty-four hours either way. */
+  hourCycle?: (HelixTimeInput["hourCycle"]) | undefined;
   /** Language tag the times are written in.
 
 Absent uses the runtime's own. */
@@ -12875,7 +13882,12 @@ removes rather than as "Remove" said once per time. */
 **The name goes in**, so a row of them is heard as which one each
 removes rather than as "Remove" said once per time. */
   removeLabel?: (HelixTimeInput["removeLabel"]) | undefined;
-  /** How far apart the offered times are, in minutes. */
+  /** Whether times carry their seconds: the value is `HH:mm:ss`, a typed time
+may give them, the field writes them, and the list's `step` counts seconds.
+See Time Picker's `seconds`. */
+  seconds?: (HelixTimeInput["seconds"]) | undefined;
+  /** How far apart the offered times are, in minutes, or in seconds with
+`seconds`. */
   step?: (HelixTimeInput["step"]) | undefined;
   /** Whether the field shows the time in the local style or as the value
 itself.
@@ -13025,6 +14037,20 @@ A time not on the step is simply never offered, so it is not an error to
 name one, and naming every time in the list is how the empty state is
 reached honestly rather than by handing over an empty range. */
   disableTimes?: (HelixTimePicker["disableTimes"]) | undefined;
+  /** The clock the times are written on: `h12` for twelve hours with a
+meridiem, `h23` for twenty-four.
+
+Absent is the locale's own, which is right for a reader's own form. Set it
+where every reader must see the same clock whatever their language, as a
+timetable does. The value is `HH:mm` on twenty-four hours either way. */
+  "hour-cycle"?: (HelixTimePicker["hourCycle"]) | undefined;
+  /** The clock the times are written on: `h12` for twelve hours with a
+meridiem, `h23` for twenty-four.
+
+Absent is the locale's own, which is right for a reader's own form. Set it
+where every reader must see the same clock whatever their language, as a
+timetable does. The value is `HH:mm` on twenty-four hours either way. */
+  hourCycle?: (HelixTimePicker["hourCycle"]) | undefined;
   /** What the wheel of hours is called, read by screen readers. */
   "hour-label"?: (HelixTimePicker["hourLabel"]) | undefined;
   /** What the wheel of hours is called, read by screen readers. */
@@ -13121,7 +14147,20 @@ else set needs. */
   readOnly?: (HelixTimePicker["readOnly"]) | undefined;
   /** Stops the form from submitting while no time is chosen. */
   required?: (HelixTimePicker["required"]) | undefined;
-  /** How far apart the offered times are, in minutes.
+  /** What the wheel of seconds is called, read by screen readers. */
+  "second-label"?: (HelixTimePicker["secondLabel"]) | undefined;
+  /** What the wheel of seconds is called, read by screen readers. */
+  secondLabel?: (HelixTimePicker["secondLabel"]) | undefined;
+  /** Whether times carry their seconds.
+
+The value becomes `HH:mm:ss`, each time is written with its seconds, the
+wheels take a column of seconds, and `step` counts seconds, the unit
+`<input type="time">` counts in. A list at a step of one second is 86,400
+rows, so give `seconds` a `step` and bounds that keep it a list, or use
+the wheels. */
+  seconds?: (HelixTimePicker["seconds"]) | undefined;
+  /** How far apart the offered times are, in minutes, or in seconds with
+`seconds`.
 
 Fifteen, which is four rows an hour and ninety-six in a day: enough that a
 reader scrolls rather than hunts, and few enough that the list is a list.
@@ -13295,7 +14334,11 @@ export type HelixToastHelixDismissElementEvent =
   HelixToastElementEvent<HelixDismissEvent>;
 
 export type HelixToastVueProps = {
-  /** Accessible name for the region, such as "Notifications". */
+  /** The key that takes focus to the stack and back, such as `F8` or `Alt+T`:
+keys joined by `+`, the last one the key. Empty turns it off. */
+  hotkey?: (HelixToast["hotkey"]) | undefined;
+  /** Accessible name for the region, with `{hotkey}` filled in. Translate it with
+the rest of your interface. */
   label?: (HelixToast["label"]) | undefined;
   /** Which corner or edge the stack sits at.
 
@@ -13428,6 +14471,21 @@ reader while looking correct to everybody else. Worse, setting both draws
 it twice. One property moves the label the consumer already has to give,
 and cannot be used to remove it. */
   labelPlacement?: (HelixToggleGroup["labelPlacement"]) | undefined;
+  /** The direction the items run. `vertical` puts them in a column, and the up
+and down arrows move between them.
+
+Optional, so the attribute is absent until a consumer writes it. */
+  orientation?: (HelixToggleGroup["orientation"]) | undefined;
+  /** Whether one item is chosen, as a radio group, or several can be pressed,
+as a toolbar of buttons with `aria-pressed`.
+
+Optional, so the attribute is absent until a consumer writes it. */
+  "selection-mode"?: (HelixToggleGroup["selectionMode"]) | undefined;
+  /** Whether one item is chosen, as a radio group, or several can be pressed,
+as a toolbar of buttons with `aria-pressed`.
+
+Optional, so the attribute is absent until a consumer writes it. */
+  selectionMode?: (HelixToggleGroup["selectionMode"]) | undefined;
   /** Whether the control is disabled and cannot be used.
 
 Reflected, because the styled tier selects on it, and mirrored to
@@ -13464,6 +14522,10 @@ work as before once focus is in it.
 No attribute: it is coordination between elements, and a consumer has no
 reason to set it. */
   focusable?: (HelixToggleGroup["focusable"]) | undefined;
+  /** The pressed values as a list, under `selection-mode="multiple"`, in the
+order the items are written. Written, it presses exactly those items.
+Where one item is chosen, it is that one value, or none. */
+  values?: (HelixToggleGroup["values"]) | undefined;
 };
 
 export type HelixToggleGroupVueEvents = {
@@ -13531,6 +14593,11 @@ group sits in holds the stop. No attribute: it is coordination between
 elements, and `tabindex` on a host the consumer rendered is the change a
 React consumer's hydration reports and does not patch up. */
   focusable?: (HelixToggle["focusable"]) | undefined;
+  /** Whether the item is pressed, in a group where several can be, and
+`undefined` in a group where one is chosen.
+
+Written by the group, like `selected`, so no attribute. */
+  pressed?: (HelixToggle["pressed"]) | undefined;
 };
 
 export type HelixToggleVueEvents = {
@@ -13675,6 +14742,22 @@ worked. */
 
 It moves if that side does not fit. */
   placement?: (HelixTooltip["placement"]) | undefined;
+  /** What shows the bubble. Unset, it is a pointer resting on the trigger and
+keyboard focus. `focus` is keyboard focus alone, for a hint a pointer does
+not need, such as a shortcut a mouse reader has no use for. */
+  "show-on"?: (HelixTooltip["showOn"]) | undefined;
+  /** What shows the bubble. Unset, it is a pointer resting on the trigger and
+keyboard focus. `focus` is keyboard focus alone, for a hint a pointer does
+not need, such as a shortcut a mouse reader has no use for. */
+  showOn?: (HelixTooltip["showOn"]) | undefined;
+  /** How long after a tooltip hides the next one still shows at once, with no
+`delay`, in milliseconds. The same skip delay Radix uses. Zero makes every
+tooltip wait. */
+  "skip-delay"?: (HelixTooltip["skipDelay"] | `${number}`) | undefined;
+  /** How long after a tooltip hides the next one still shows at once, with no
+`delay`, in milliseconds. The same skip delay Radix uses. Zero makes every
+tooltip wait. */
+  skipDelay?: (HelixTooltip["skipDelay"]) | undefined;
   /** The id of a box to keep the bubble inside. Defaults to the viewport.
 
 Resolved the way `for` is, so an id in the same tree, which is what lets a
@@ -13768,6 +14851,14 @@ The shape is `Carousel`'s, which is the nearest thing in the library: a
   "next-label"?: (HelixTour["nextLabel"]) | undefined;
   /** Label for the control that goes on. */
   nextLabel?: (HelixTour["nextLabel"]) | undefined;
+  /** Draws each stop's place in the run in its panel, as well as saying it. */
+  progress?: (HelixTour["progress"]) | undefined;
+  /** Each stop's place in the run, with `{index}` and `{count}` filled in.
+Translate it with the rest of your text. */
+  "progress-label"?: (HelixTour["progressLabel"]) | undefined;
+  /** Each stop's place in the run, with `{index}` and `{count}` filled in.
+Translate it with the rest of your text. */
+  progressLabel?: (HelixTour["progressLabel"]) | undefined;
   /** Label for the control that leaves the tour. */
   "skip-label"?: (HelixTour["skipLabel"]) | undefined;
   /** Label for the control that leaves the tour. */
@@ -13822,6 +14913,9 @@ closed tour, a closed tour shows nothing, and nothing can disagree. */
   first?: (HelixTourStop["first"]) | undefined;
   /** The id of the element the stop points at. */
   for?: (HelixTourStop["for"]) | undefined;
+  /** The panel's name, where neither the `heading` slot nor the content holds a
+heading. */
+  label?: (HelixTourStop["label"]) | undefined;
   /** Whether the stop is the last one. Its next control then shows `doneLabel`. */
   last?: (HelixTourStop["last"]) | undefined;
   /** Label for the control that goes on. */
@@ -13834,6 +14928,15 @@ closed tour, a closed tour shows nothing, and nothing can disagree. */
   "skip-label"?: (HelixTourStop["skipLabel"]) | undefined;
   /** Label for the control that leaves the tour. */
   skipLabel?: (HelixTourStop["skipLabel"]) | undefined;
+  /** What kind of stop this is. Unset, it is a bubble pointing at its target.
+
+- `dialog`: a panel in the middle of the window, over a backdrop
+- `floating`: a panel in a corner of the window
+- `wait`: nothing shown, while the tour waits for the target to be on the page
+
+Reflected, because the styled tier places a dialog and a floating panel by
+it, and unset at rest, so no default is written onto the host. */
+  type?: (HelixTourStop["type"]) | undefined;
 };
 
 export type HelixTourStopVueEvents = {
@@ -14695,6 +15798,8 @@ export type CustomCssProperties = {
   "--badge-background-color"?: (string) | undefined;
   /** The color of the count, to pair with a fill set through `--badge-background-color`. */
   "--badge-color"?: (string) | undefined;
+  /** The space between the content and the count under `placement="inline"`. */
+  "--badge-gap"?: (string) | undefined;
   /** Pulls the mark in from the corner, along both axes. */
   "--badge-offset"?: (string) | undefined;
   /** The color of the ring between the indicator and what is behind it. */
@@ -14721,6 +15826,16 @@ export type CustomCssProperties = {
   "--bar-chart-secondary"?: (string) | undefined;
   /** The gradient for a bar, named per bar so the styled tier can use it as the `fill`. It is always drawn, and used only when `wash="gradient"` is set. */
   "--chart-bar-wash"?: (string) | undefined;
+  /** The color of the attribution. */
+  "--blockquote-attribution-color"?: (string) | undefined;
+  /** The font size of the attribution. */
+  "--blockquote-attribution-size"?: (string) | undefined;
+  /** The color of the quoted passage. */
+  "--blockquote-color"?: (string) | undefined;
+  /** The typeface of the quoted passage, the display face by default. */
+  "--blockquote-font-family"?: (string) | undefined;
+  /** The space between the passage and its attribution. */
+  "--blockquote-gap"?: (string) | undefined;
   /** The font size of the quoted passage. */
   "--blockquote-size"?: (string) | undefined;
   /** Inline padding of a control slotted into a crumb, matching the steps either side of it. */
@@ -14739,6 +15854,8 @@ export type CustomCssProperties = {
   "--button-background-color"?: (string) | undefined;
   /** Fill behind the button under the pointer. Without it, `--button-background-color` also applies on hover. */
   "--button-background-color-hover"?: (string) | undefined;
+  /** Edge color of an outlined button. The other emphases draw no edge. */
+  "--button-border-color"?: (string) | undefined;
   /** Label and icon color. */
   "--button-foreground-color"?: (string) | undefined;
   /** Space between the label and the content on either side of it. */
@@ -14763,8 +15880,20 @@ export type CustomCssProperties = {
   "--button-radius-start-start"?: (string) | undefined;
   /** Height of the control, for a row height outside the density steps. */
   "--button-size"?: (string) | undefined;
+  /** Size of the ring a pending button turns. Defaults to the size of its icons. */
+  "--button-spinner-size"?: (string) | undefined;
+  /** The color of the bar, the mark and the tint, in place of the tone's. */
+  "--callout-accent-color"?: (string) | undefined;
   /** The fill behind the callout. */
   "--callout-background-color"?: (string) | undefined;
+  /** The thickness of the bar on the inline start edge. */
+  "--callout-bar-thickness"?: (string) | undefined;
+  /** The size of the callout's text. */
+  "--callout-font-size"?: (string) | undefined;
+  /** The space between the mark and the content. */
+  "--callout-gap"?: (string) | undefined;
+  /** The inset around the content, to which the bar's width is added at the start. */
+  "--callout-padding"?: (string) | undefined;
   /** The corner radius of the callout. */
   "--callout-radius"?: (string) | undefined;
   /** The size of the corner handles that resize a selected card. */
@@ -14811,6 +15940,8 @@ export type CustomCssProperties = {
   "--card-border-color"?: (string) | undefined;
   /** Width of the surface's edge. Follows `--helix-border-surface`, which is a hairline unless your theme sets another width. The edge is what sets the surface apart. */
   "--card-border-width"?: (string) | undefined;
+  /** Space between the regions, and between a header or footer and its actions. */
+  "--card-gap"?: (string) | undefined;
   /** Height of the media region. Defaults to `auto`, which follows an image's own proportions. A chart has no height of its own, so set one here for a chart. */
   "--card-media-block-size"?: (string) | undefined;
   /** Width of the media column when horizontal. */
@@ -14889,8 +16020,12 @@ export type CustomCssProperties = {
   "--code-block-background-color"?: (string) | undefined;
   /** The line around the block and its header. */
   "--code-block-border-color"?: (string) | undefined;
+  /** The color of the line numbers. */
+  "--code-block-gutter-color"?: (string) | undefined;
   /** The background behind the name. The default is `surface-raised`. */
   "--code-block-header-background-color"?: (string) | undefined;
+  /** The tallest the code grows before it scrolls. The default is no limit. */
+  "--code-block-max-block-size"?: (string) | undefined;
   /** The corner radius of the header's top and the block's bottom, which form one shape. */
   "--code-block-radius"?: (string) | undefined;
   /** Fill behind the fragment. Defaults to the foreground color at 6%, which looks the same on a light page and a dark one. */
@@ -14917,6 +16052,10 @@ export type CustomCssProperties = {
   "--color-input-swatch-size"?: (string) | undefined;
   /** The chosen color, painted over the checkerboard that shows transparency. */
   "--color-input-swatch"?: (string) | undefined;
+  /** The color of the names above the channel number fields, in `channel-fields`. */
+  "--color-picker-field-label-color"?: (string) | undefined;
+  /** The space between the channel number fields, in `channel-fields`. */
+  "--color-picker-fields-gap"?: (string) | undefined;
   /** The corner radius of the square. */
   "--color-picker-grid-radius"?: (string) | undefined;
   /** The aspect ratio of the square. */
@@ -14963,6 +16102,8 @@ export type CustomCssProperties = {
   "--icon-button-shadow"?: (string) | undefined;
   /** Edge length of the control. */
   "--icon-button-size"?: (string) | undefined;
+  /** Size of the ring a pending button turns. */
+  "--icon-button-spinner-size"?: (string) | undefined;
   /** The height of the scrolling box while `windowed`. Ignored otherwise, where the grid is as tall as its rows. It is a fixed height, so a short result keeps the full box with space below it. */
   "--data-table-block-size"?: (string) | undefined;
   /** The text color of a cell. */
@@ -14991,12 +16132,22 @@ export type CustomCssProperties = {
   "--date-input-border-color"?: (string) | undefined;
   /** The width of the panel's border. It follows `--helix-border-floating`, which is `0`, so the panel stands out by its shadow unless a theme sets a border. */
   "--date-input-border-width"?: (string) | undefined;
+  /** The fill behind the segment with focus, in `segmented`. It follows `--helix-color-primary`. */
+  "--date-input-segment-focus-background-color"?: (string) | undefined;
+  /** The text of the segment with focus, in `segmented`. */
+  "--date-input-segment-focus-color"?: (string) | undefined;
+  /** The text the locale writes between two segments, in `segmented`. */
+  "--date-input-segment-literal-color"?: (string) | undefined;
+  /** The dashes of a segment with nothing in it, in `segmented`. It matches the text field's placeholder. */
+  "--date-input-segment-placeholder-color"?: (string) | undefined;
   /** The shadow under the panel. It follows `--helix-shadow-floating`. The panel can sit over any content, so it has a shadow by default. */
   "--date-input-shadow"?: (string) | undefined;
   /** Months per row. Two unless there is only one. */
   "--date-picker-columns"?: (string) | undefined;
   /** Width and height of a day. */
   "--date-picker-day-size"?: (string) | undefined;
+  /** Height of a month or a year in the months and years views, where `max-view` is set. */
+  "--date-picker-period-size"?: (string) | undefined;
   /** Band behind the days in a range. */
   "--date-picker-range-color"?: (string) | undefined;
   /** Height of a week row. */
@@ -15027,6 +16178,12 @@ export type CustomCssProperties = {
   "--dialog-shadow"?: (string) | undefined;
   /** The color of the line. */
   "--divider-color"?: (string) | undefined;
+  /** The color of the content set into the line. */
+  "--divider-content-color"?: (string) | undefined;
+  /** The space either side of the content set into the line. */
+  "--divider-content-gap"?: (string) | undefined;
+  /** The length of line before the content under `content-placement="start"`, or after it under `end`. */
+  "--divider-content-offset"?: (string) | undefined;
   /** The length of a vertical line. A horizontal line takes the divider's width. */
   "--divider-length"?: (string) | undefined;
   /** The space removed from both ends of the line. */
@@ -15065,12 +16222,34 @@ export type CustomCssProperties = {
   "--drawer-shadow"?: (string) | undefined;
   /** Width or height of the panel. */
   "--drawer-size"?: (string) | undefined;
+  /** How far a swipe, or a snap point, has moved the panel across, in pixels, toward the right. */
+  "--drawer-swipe-x"?: (string) | undefined;
+  /** How far a swipe, or a snap point, has moved the panel down, in pixels. */
+  "--drawer-swipe-y"?: (string) | undefined;
   /** Fill when a row is under the pointer. */
   "--drilldown-item-hover-color"?: (string) | undefined;
   /** Fill behind the pages. */
   "--drilldown-background-color"?: (string) | undefined;
   /** Width of the region. */
   "--drilldown-inline-size"?: (string) | undefined;
+  /** Space added above the actions. */
+  "--empty-actions-gap"?: (string) | undefined;
+  /** Space between the icon, the heading, the message and the actions. */
+  "--empty-gap"?: (string) | undefined;
+  /** Color of the heading. */
+  "--empty-heading-color"?: (string) | undefined;
+  /** Size of the heading. */
+  "--empty-heading-size"?: (string) | undefined;
+  /** Color of the icon. */
+  "--empty-icon-color"?: (string) | undefined;
+  /** Size of the icon. */
+  "--empty-icon-size"?: (string) | undefined;
+  /** Color of the message. */
+  "--empty-message-color"?: (string) | undefined;
+  /** Widest the message runs before it wraps. */
+  "--empty-message-measure"?: (string) | undefined;
+  /** Size of the message. */
+  "--empty-message-size"?: (string) | undefined;
   /** Space around the whole block. */
   "--empty-padding"?: (string) | undefined;
   /** Fill behind the field. */
@@ -15165,6 +16344,12 @@ export type CustomCssProperties = {
   "--image-radius"?: (string) | undefined;
   /** Fill behind the text. */
   "--input-background-color"?: (string) | undefined;
+  /** Edge of the field at rest. Hover, focus and an error still draw their own. */
+  "--input-border-color"?: (string) | undefined;
+  /** Space between the edge of the field and what is inside it. */
+  "--input-padding-inline"?: (string) | undefined;
+  /** Corner radius of the field. */
+  "--input-radius"?: (string) | undefined;
   /** Height of the field. */
   "--input-size"?: (string) | undefined;
   /** The fill of the key. */
@@ -15173,8 +16358,14 @@ export type CustomCssProperties = {
   "--kbd-border-color"?: (string) | undefined;
   /** The direction the entries run: `row`, which wraps, or `column`. */
   "--legend-direction"?: (string) | undefined;
+  /** The space between a swatch and its name. */
+  "--legend-entry-gap"?: (string) | undefined;
   /** The space between entries. */
   "--legend-gap"?: (string) | undefined;
+  /** How strongly a hidden series' entry is drawn, under `toggles`. */
+  "--legend-hidden-opacity"?: (string) | undefined;
+  /** The corner of the color swatch. */
+  "--legend-swatch-radius"?: (string) | undefined;
   /** The size of the color swatch. */
   "--legend-swatch-size"?: (string) | undefined;
   /** The width of the edge an `outlined` or `subtle` swatch is drawn with. */
@@ -15183,6 +16374,8 @@ export type CustomCssProperties = {
   "--lightbox-item-description-color"?: (string) | undefined;
   /** Space between the content and the line under it. */
   "--lightbox-item-gap"?: (string) | undefined;
+  /** Size of the previous, next and close controls drawn with `controls`. */
+  "--lightbox-control-size"?: (string) | undefined;
   /** Color of the controls and text drawn over the content. */
   "--lightbox-foreground"?: (string) | undefined;
   /** Space between the header or footer and the content. */
@@ -15327,6 +16520,12 @@ export type CustomCssProperties = {
   "--menu-shadow"?: (string) | undefined;
   /** The fill color. Overrides the band's tone. */
   "--meter-color"?: (string) | undefined;
+  /** The color of a slotted label. */
+  "--meter-label-color"?: (string) | undefined;
+  /** The space between a slotted label and the meter. */
+  "--meter-label-gap"?: (string) | undefined;
+  /** The type size of a slotted label. */
+  "--meter-label-size"?: (string) | undefined;
   /** The width and height of the drawing in `ring` and `arc`. */
   "--meter-ring-size"?: (string) | undefined;
   /** The thickness of the stroke in `ring` and `arc`. */
@@ -15385,6 +16584,12 @@ export type CustomCssProperties = {
   "--notifications-media-column"?: (string) | undefined;
   /** The fill behind the number. */
   "--number-input-background-color"?: (string) | undefined;
+  /** Edge of the field at rest. Hover, focus and an error still draw their own. */
+  "--number-input-border-color"?: (string) | undefined;
+  /** Corner radius of the field. */
+  "--number-input-radius"?: (string) | undefined;
+  /** Height of the field. */
+  "--number-input-size"?: (string) | undefined;
   /** The background of the tree. */
   "--object-inspector-background-color"?: (string) | undefined;
   /** The height of the scrolling box when `windowed` is set. */
@@ -15423,8 +16628,18 @@ export type CustomCssProperties = {
   "--pagination-hover-color"?: (string) | undefined;
   /** The box every control in the row takes. */
   "--pagination-size"?: (string) | undefined;
+  /** Fill behind each box. */
+  "--pin-input-cell-background-color"?: (string) | undefined;
+  /** Edge of each box at rest. Hover, focus and an error still draw their own. */
+  "--pin-input-cell-border-color"?: (string) | undefined;
+  /** Corner radius of each box. */
+  "--pin-input-cell-radius"?: (string) | undefined;
+  /** Width and height of each box. */
+  "--pin-input-cell-size"?: (string) | undefined;
   /** The space between one box and the next. */
   "--pin-input-gap"?: (string) | undefined;
+  /** Size of the point drawn with `arrow`. Tooltip's point is the same size. */
+  "--popover-arrow-size"?: (string) | undefined;
   /** Color of the panel's edge. */
   "--popover-border-color"?: (string) | undefined;
   /** Width of the panel's edge. Defaults to `--helix-border-floating`, which is `0`, so the panel stands out by its shadow unless your theme sets a width. */
@@ -15439,6 +16654,12 @@ export type CustomCssProperties = {
   "--popover-shadow"?: (string) | undefined;
   /** Fill of the part that is done. */
   "--progress-color"?: (string) | undefined;
+  /** Color of a slotted label. */
+  "--progress-label-color"?: (string) | undefined;
+  /** Space between a slotted label and the bar. */
+  "--progress-label-gap"?: (string) | undefined;
+  /** Type size of a slotted label. */
+  "--progress-label-size"?: (string) | undefined;
   /** Diameter of the ring. */
   "--progress-ring-size"?: (string) | undefined;
   /** Thickness of the ring's stroke. */
@@ -15463,6 +16684,8 @@ export type CustomCssProperties = {
   "--qr-code-size"?: (string) | undefined;
   /** Color of the quoted text. */
   "--quote-color"?: (string) | undefined;
+  /** The slant of the quoted text, `italic` by default. Set `normal` for a face whose italic is too loud, or `oblique` for one with no italic of its own. */
+  "--quote-font-style"?: (string) | undefined;
   /** The space between the choices. */
   "--radio-group-gap"?: (string) | undefined;
   /** The fill of an unselected circle. */
@@ -15563,6 +16786,14 @@ export type CustomCssProperties = {
   "--select-surface-max-block-size"?: (string) | undefined;
   /** The height of the block shape, which is the shape when `shape` is unset. Defaults to the control height. */
   "--skeleton-block-size"?: (string) | undefined;
+  /** The placeholder's fill. */
+  "--skeleton-color"?: (string) | undefined;
+  /** How long one sweep or one pulse takes. */
+  "--skeleton-duration"?: (string) | undefined;
+  /** The corner of the block shape. */
+  "--skeleton-radius"?: (string) | undefined;
+  /** The highlight the sweep carries across the fill. */
+  "--skeleton-sheen-color"?: (string) | undefined;
   /** The diameter of the circle shape. */
   "--skeleton-size"?: (string) | undefined;
   /** The border color of the link while it is shown. */
@@ -15641,6 +16872,18 @@ export type CustomCssProperties = {
   "--stat-group-columns"?: (string) | undefined;
   /** Space between figures. */
   "--stat-group-gap"?: (string) | undefined;
+  /** Space between the label and the value, and between the value and the unit in a row. */
+  "--stat-gap"?: (string) | undefined;
+  /** Color of the label. */
+  "--stat-label-color"?: (string) | undefined;
+  /** Size of the label. */
+  "--stat-label-size"?: (string) | undefined;
+  /** Color of the unit. */
+  "--stat-unit-color"?: (string) | undefined;
+  /** Size of the unit. */
+  "--stat-unit-size"?: (string) | undefined;
+  /** Color of the figure. */
+  "--stat-value-color"?: (string) | undefined;
   /** Size of the figure. */
   "--stat-value-size"?: (string) | undefined;
   /** Color of the mark on a finished step. */
@@ -15657,6 +16900,8 @@ export type CustomCssProperties = {
   "--steps-marker-size"?: (string) | undefined;
   /** Height of the track. The width follows it. */
   "--switch-block-size"?: (string) | undefined;
+  /** Color of the icon on the thumb. Without it, the icon is muted while off and takes the on color while on. */
+  "--switch-icon-color"?: (string) | undefined;
   /** Length of the track. Set it to override the length derived from the height. */
   "--switch-inline-size"?: (string) | undefined;
   /** Fill when the switch is on. */
@@ -15687,22 +16932,42 @@ export type CustomCssProperties = {
   "--tabs-tab-padding-inline"?: (string) | undefined;
   /** The label color of the current tab. */
   "--tabs-tab-selected-color"?: (string) | undefined;
+  /** The space between tags, across and between rows. */
+  "--tag-group-gap"?: (string) | undefined;
   /** The fill behind the tag. */
   "--tag-background-color"?: (string) | undefined;
   /** The color of the tag's edge. */
   "--tag-border-color"?: (string) | undefined;
+  /** How strongly a `disabled` tag is drawn. */
+  "--tag-disabled-opacity"?: (string) | undefined;
   /** The label color. */
   "--tag-foreground-color"?: (string) | undefined;
   /** The corner radius of the tag. */
   "--tag-radius"?: (string) | undefined;
   /** Fill behind the text. */
   "--textarea-background-color"?: (string) | undefined;
+  /** Edge of the field at rest. Hover, focus and an error still draw their own. */
+  "--textarea-border-color"?: (string) | undefined;
+  /** Space between the edge of the field and the text. */
+  "--textarea-padding"?: (string) | undefined;
+  /** Corner radius of the field. */
+  "--textarea-radius"?: (string) | undefined;
+  /** Which way a reader can drag the field: `vertical` by default, `none`, `both` or `horizontal`. A field under `auto-grow` has nothing to drag. */
+  "--textarea-resize"?: (string) | undefined;
   /** Fill behind the field. */
   "--time-input-background-color"?: (string) | undefined;
   /** Color of the panel's edge. */
   "--time-input-border-color"?: (string) | undefined;
   /** Width of the panel's edge. Defaults to `--helix-border-floating`, which is `0`, so the panel stands out by its shadow unless your theme sets a width. */
   "--time-input-border-width"?: (string) | undefined;
+  /** The fill behind the segment with focus, in `segmented`. It follows `--helix-color-primary`. */
+  "--time-input-segment-focus-background-color"?: (string) | undefined;
+  /** The text of the segment with focus, in `segmented`. */
+  "--time-input-segment-focus-color"?: (string) | undefined;
+  /** The text the locale writes between two segments, in `segmented`. */
+  "--time-input-segment-literal-color"?: (string) | undefined;
+  /** The dashes of a segment with nothing in it, in `segmented`. It matches the text field's placeholder. */
+  "--time-input-segment-placeholder-color"?: (string) | undefined;
   /** Shadow under the panel. Defaults to `--helix-shadow-floating`, because the panel can sit over any content. */
   "--time-input-shadow"?: (string) | undefined;
   /** How tall the list is before it scrolls. */
@@ -15733,6 +16998,8 @@ export type CustomCssProperties = {
   "--toast-shadow"?: (string) | undefined;
   /** How long this message stays, in milliseconds, for a progress hint. */
   "--toast-duration"?: (string) | undefined;
+  /** How far a swipe has moved the message across, in pixels, toward the right. */
+  "--toast-swipe-x"?: (string) | undefined;
   /** Space between one message and the next. */
   "--toast-gap"?: (string) | undefined;
   /** Width of a message. */
@@ -15781,10 +17048,20 @@ export type CustomCssProperties = {
   "--tree-chevron-gap"?: (string) | undefined;
   /** The chevron's order in the row. Set from `chevron-placement` and read by each item. */
   "--tree-chevron-order"?: (string) | undefined;
+  /** Color of a move that `good` says is an improvement. */
+  "--trend-better-color"?: (string) | undefined;
   /** Color of the arrow. Setting it overrides the color that `good` sets. */
   "--trend-color"?: (string) | undefined;
-  /** Size of the arrow. */
+  /** Space between the arrow, the metric and the label. */
+  "--trend-gap"?: (string) | undefined;
+  /** Size of the arrow, or of a glyph in the `icon` slot. */
   "--trend-icon-size"?: (string) | undefined;
+  /** Color of the label. */
+  "--trend-label-color"?: (string) | undefined;
+  /** Color of a trend that `good` does not judge, or one that did not move. */
+  "--trend-neutral-color"?: (string) | undefined;
+  /** Color of a move that `good` says is a setback. */
+  "--trend-worse-color"?: (string) | undefined;
   /** The fill behind a row. */
   "--video-playlist-item-background-color"?: (string) | undefined;
   /** The width of the thumbnail column. */
@@ -15875,7 +17152,7 @@ export interface WcToolkitVueGlobalComponents {
     HelixAvatarVueProps,
     HelixAvatarVueEvents
   >;
-  /** The indicator has a ring in the page background color, so it stays legible where it overlaps the element it is pinned to, such as a dark badge on a dark icon. */
+  /** The indicator has a ring in the page background color, so it stays legible where it overlaps the element it is pinned to, such as a dark badge on a dark icon.  'placement' pins it to another corner, or puts it in the line with 'inline'. **Inside a control, 'inline' puts the count in the control's name**: '<button>Inbox <helix-badge placement="inline" value="8" label="8 unread"></helix-badge></button>' is the button "Inbox 8 unread", kept current by the badge with no label of yours to update. */
   "helix-badge": DefineCustomElement<
     HelixBadge,
     HelixBadgeVueProps,
@@ -15917,7 +17194,7 @@ export interface WcToolkitVueGlobalComponents {
     HelixButtonVueProps,
     HelixButtonVueEvents
   >;
-  /** The background is a tint of the tone's color, mixed with 'color-mix'. A 'neutral' callout is drawn in the muted ink, for a note that reports no status, so it keeps to the palette whatever the brand. A bar on the inline start edge also marks the tone, so it still shows in grayscale and for people who do not distinguish the hues.  This tier has no treatment property. 'tone' is set on the headless tier and carries the meaning, and this tier draws it. */
+  /** The background is a tint of the tone's color, mixed with 'color-mix'. A 'neutral' callout is drawn in the muted ink, for a note that reports no status, so it keeps to the palette whatever the brand. A bar on the inline start edge also marks the tone, so it still shows in grayscale and for people who do not distinguish the hues.  'tone' is set on the headless tier and carries the meaning, and this tier draws it. 'separation' is where the box ends: absent is the tint with the bar, 'outlined' an edge with no fill, and 'plain' the bar and the mark alone. */
   "helix-callout": DefineCustomElement<
     HelixCallout,
     HelixCalloutVueProps,
@@ -15941,7 +17218,7 @@ export interface WcToolkitVueGlobalComponents {
     HelixCanvasVueProps,
     HelixCanvasVueEvents
   >;
-  /** The regions are the 'media', 'header', and 'footer' slots and the default slot for content. None of them has a wrapper element. A region you leave out takes no space, so a card with only content needs no extra markup. Style slotted content directly: a header is the element you slotted, so there is no part to target.  'media' runs edge to edge and clips to the card's corners, so an image needs no inset. Set 'orientation="horizontal"' to put the media beside the header, content, and footer. Set 'media-placement="end"' to put it below the content, for example for a chart that ends a card. */
+  /** The regions are the 'media', 'header', and 'footer' slots and the default slot for content. None of them has a wrapper element. A region you leave out takes no space, so a card with only content needs no extra markup. Style slotted content directly: a header is the element you slotted, so there is no part to target.  'header-actions' and 'footer-actions' put controls at the end of the header's and the footer's line; the footer then moves to the start of its line. Put a header of more than one element in one wrapper, since the header and its actions share a line.  'media' runs edge to edge and clips to the card's corners, so an image needs no inset. Set 'orientation="horizontal"' to put the media beside the header, content, and footer. Set 'media-placement="end"' to put it below the content, for example for a chart that ends a card. */
   "helix-card": DefineCustomElement<
     HelixCard,
     HelixCardVueProps,
@@ -15983,7 +17260,7 @@ export interface WcToolkitVueGlobalComponents {
     HelixCheckboxVueProps,
     HelixCheckboxVueEvents
   >;
-  /** The header sits above the code with the copy button at its end, so the button never covers the first line. A block with no name has no header. The button then sits beside the code in space the block keeps clear: an end gutter for code, and a band above the first hunk for a diff.  A diff draws one block per file in the same frame. Each changed line is tinted in its tone at Tag's resting strength, with its '+' or '-' in the tone's ink color, so you can see the change without comparing two pale backgrounds. A split diff stacks its two versions when the file is narrower than about 40rem. */
+  /** The header sits above the code with the copy button at its end, so the button never covers the first line. A block with no name has no header. The button then sits beside the code in space the block keeps clear: an end gutter for code, and a band above the first hunk for a diff.  A diff draws one block per file in the same frame. Each changed line is tinted in its tone at Tag's resting strength, with its '+' or '-' in the tone's ink color, so you can see the change without comparing two pale backgrounds. A split diff stacks its two versions when the file is narrower than about 40rem.  Long lines scroll by default. Set 'wrap' to wrap them instead, for prose-like code such as a long command, and set '--code-block-max-block-size' to cap the height of a long file, which then scrolls. */
   "helix-code-block": DefineCustomElement<
     HelixCodeBlock,
     HelixCodeBlockVueProps,
@@ -16061,7 +17338,7 @@ export interface WcToolkitVueGlobalComponents {
     HelixDialogVueProps,
     HelixDialogVueEvents
   >;
-  /** A one-pixel rule in the border color that spans the full inline size by default. A vertical divider stretches to fit its flex parent, so it matches the height of what it sits beside. */
+  /** A one-pixel rule in the border color that spans the full inline size by default. A vertical divider stretches to fit its flex parent, so it matches the height of what it sits beside.  Content set into the line sits at its middle. 'content-placement' moves it toward the start or the end, leaving a short length of line before or after it, the way a section label sits in a form. */
   "helix-divider": DefineCustomElement<
     HelixDivider,
     HelixDividerVueProps,
@@ -16193,7 +17470,7 @@ export interface WcToolkitVueGlobalComponents {
     HelixKbdVueProps,
     HelixKbdVueEvents
   >;
-  /** Entries are laid out in a row that wraps, because a legend under a chart is as wide as the chart, and its names have to fit any width. Set '--legend-direction' to 'column' when the legend sits beside a chart.  Series colors are mapped in this tier. The headless tier carries the index and holds no tokens. The mapping is in 'shared/chart/series.css', because an index in markup cannot select a token, and an inline custom property would put a color in the headless tier. Charts and legends share the file, so both use the same twenty-four color names. */
+  /** Entries are laid out in a row that wraps, because a legend under a chart is as wide as the chart, and its names have to fit any width. Set '--legend-direction' to 'column' when the legend sits beside a chart.  Series colors are mapped in this tier. The headless tier carries the index and holds no tokens. The mapping is in 'shared/chart/series.css', because an index in markup cannot select a token, and an inline custom property would put a color in the headless tier. Charts and legends share the file, so both use the same twenty-four color names.  Under 'toggles', each name is a button. A hidden series' entry fades and its swatch empties to an outline, so the color stays readable. */
   "helix-legend": DefineCustomElement<
     HelixLegend,
     HelixLegendVueProps,
@@ -16235,7 +17512,7 @@ export interface WcToolkitVueGlobalComponents {
     HelixListboxVueProps,
     HelixListboxVueEvents
   >;
-  /** Sized from the loader size tokens, so a loader is the same size wherever it is placed and follows the density region it sits in. Set '--loader-size: 1em' to match the text beside it, as inside a button. The color is 'currentColor', so it matches the text color around it, including inside a primary button. */
+  /** Sized from the loader size tokens, so a loader is the same size wherever it is placed and follows the density region it sits in. Set '--loader-size: 1em' to match the text beside it, as inside a button. The color is 'currentColor', so it matches the text color around it, including inside a primary button.  While 'delay' runs, the loader keeps its size and draws nothing, so the line it sits in does not move when it appears. */
   "helix-loader": DefineCustomElement<
     HelixLoader,
     HelixLoaderVueProps,
@@ -16511,7 +17788,7 @@ export interface WcToolkitVueGlobalComponents {
     HelixSelectVueProps,
     HelixSelectVueEvents
   >;
-  /** Animates a highlight sweeping across the block, which reads as work in progress. A block fading in and out can look broken. */
+  /** Animates a highlight sweeping across the block, which reads as work in progress. A block fading in and out can look broken, so 'effect="pulse"' is a choice rather than the default.  Around content with 'loading', the skeleton takes the content's box and paints over it, and the content is hidden until 'loading' is taken off. */
   "helix-skeleton": DefineCustomElement<
     HelixSkeleton,
     HelixSkeletonVueProps,
@@ -16576,7 +17853,7 @@ export interface WcToolkitVueGlobalComponents {
     HelixStepVueProps,
     HelixStepVueEvents
   >;
-  /** A thumb moves along a track. The switch is the one place in Helix where color means "on". A checkbox has a tick, and a switch has no mark, so the fill is what tells the two states apart.  The input is the hit target. It is stretched over the track and made invisible, so the press, the focus, and the label forwarding come from the platform.  The height is '--helix-size-switch', one step above the checkbox's at every density. At the checkbox's height the thumb has two pixels of track around it, and the control looks like a small dash. The width follows the height, so setting '--switch-block-size' widens the switch too and keeps the proportion. */
+  /** A thumb moves along a track. The switch is the one place in Helix where color means "on". A checkbox has a tick, and a switch has no mark, so the fill is what tells the two states apart.  The input is the hit target. It is stretched over the track and made invisible, so the press, the focus, and the label forwarding come from the platform.  The height is '--helix-size-switch', one step above the checkbox's at every density. At the checkbox's height the thumb has two pixels of track around it, and the control looks like a small dash. The width follows the height, so setting '--switch-block-size' widens the switch too and keeps the proportion.  The thumb is an element, the 'thumb' part, and holds an icon for each state: one in the 'on' slot shows while the switch is on, and one in the 'off' slot while it is off. */
   "helix-switch": DefineCustomElement<
     HelixSwitch,
     HelixSwitchVueProps,
@@ -16624,6 +17901,12 @@ export interface WcToolkitVueGlobalComponents {
     HelixTabVueProps,
     HelixTabVueEvents
   >;
+  /** The tags sit in a row that wraps. A selected tag is filled with its tone, as 'emphasis="solid"' draws one, and the focused tag takes the focus ring round its whole box. */
+  "helix-tag-group": DefineCustomElement<
+    HelixTagGroup,
+    HelixTagGroupVueProps,
+    HelixTagGroupVueEvents
+  >;
   /** Seven tones. The fill is a tint of the status color made with 'color-mix', so when a theme changes its status colors, the tints change with them. */
   "helix-tag": DefineCustomElement<
     HelixTag,