@fusion.dev/helix 0.26.0 → 0.30.0

package/types/vue.d.ts

@@ -672,6 +672,15 @@ Used for the label and the initials. */
 
 Falls back to the slot, or to initials, if it fails. */
   src?: (HelixAvatar["src"]) | undefined;
+  /** Where the image stands: still on its way, arrived, or failed and replaced
+by the initials.
+
+Read-only to a consumer: it is a report rather than a setting, and the same
+report `Image` gives, for the same reason. `load` and `error` fire once, so
+a listener bound after the picture settled hears neither, which is the
+platform on an `<img>` too, and this is what that listener asks instead.
+Mirrored to `data-status` rather than reflected, as `Image` explains. */
+  status?: (HelixAvatar["status"]) | undefined;
 };
 
 export type HelixAvatarVueEvents = {
@@ -1455,7 +1464,7 @@ way to stop it, so an autoplaying carousel keeps its pause control on a
 touch device exactly as it does on a desktop. */
   controls?: (HelixCarousel["controls"]) | undefined;
   /** Slide to start on, where nothing declared one. */
-  "default-index"?: (HelixCarousel["defaultIndex"]) | undefined;
+  "default-index"?: (HelixCarousel["defaultIndex"] | `${number}`) | undefined;
   /** Slide to start on, where nothing declared one. */
   defaultIndex?: (HelixCarousel["defaultIndex"]) | undefined;
   /** How long each slide is held, in milliseconds. */
@@ -1492,7 +1501,7 @@ No default, because it reflects. A reflected property with a value writes
 its attribute on upgrade, and the host then carries something a consumer's
 server markup never had, which React reports as a mismatch. The one-across
 case is the absent attribute, and the styles read it that way. */
-  "per-view"?: (HelixCarousel["perView"]) | undefined;
+  "per-view"?: (HelixCarousel["perView"] | `${number}`) | undefined;
   /** How many slides are shown across the track at once. Absent shows one.
 
 **Here rather than on the styled tier, because it decides how many places
@@ -2058,8 +2067,6 @@ Here rather than on each control. */
 };
 
 export type HelixColorInputVueEvents = {
-  /** Announced once the value has moved. */
-  input: HelixColorInputElementEvent;
   /** Announced once the value has moved. */
   change: HelixColorInputElementEvent;
   /** Fired before the color changes. Cancelable: refusing it takes the decision and nothing moves. */
@@ -2068,6 +2075,8 @@ export type HelixColorInputVueEvents = {
   "helix-before-close": HelixColorInputHelixBeforeCloseElementEvent;
   /** Fired before the panel opens. Cancelable: refusing it takes the decision and nothing moves. */
   "helix-before-open": HelixColorInputHelixBeforeOpenElementEvent;
+  /** Announced once the value has moved. */
+  input: HelixColorInputElementEvent;
   /** Says the state moved, carrying `newState` and `oldState`. */
   toggle: HelixColorInputElementEvent;
 };
@@ -2192,8 +2201,6 @@ Here rather than on each control. */
 };
 
 export type HelixColorPickerVueEvents = {
-  /** Announced once the value has moved. */
-  input: HelixColorPickerElementEvent;
   /** Announced once the value has moved. */
   change: HelixColorPickerElementEvent;
   /** Fired before the color changes. Cancelable: refusing it takes the decision and nothing moves. */
@@ -2204,6 +2211,8 @@ export type HelixColorPickerVueEvents = {
   "helix-sample-end": HelixColorPickerHelixSampleEndElementEvent;
   /** The eyedropper is opening, so anything covering the page should get out of the way. */
   "helix-sample-start": HelixColorPickerHelixSampleStartElementEvent;
+  /** Announced once the value has moved. */
+  input: HelixColorPickerElementEvent;
 };
 
 /** `HelixCombobox` component event */
@@ -2253,7 +2262,7 @@ the resolved state for stylesheets, which is what the mirror is for. */
   /** What the collapsed count is called, since `+3` names nothing. */
   expandLabel?: (HelixCombobox["expandLabel"]) | undefined;
   /** How many tokens to show before the rest become a count. */
-  "max-tags"?: (HelixCombobox["maxTags"]) | undefined;
+  "max-tags"?: (HelixCombobox["maxTags"] | `${number}`) | undefined;
   /** How many tokens to show before the rest become a count. */
   maxTags?: (HelixCombobox["maxTags"]) | undefined;
   /** The value the markup declared, which is where a reset returns to. */
@@ -2368,8 +2377,6 @@ differently: they are one chooser to a consumer. */
 };
 
 export type HelixComboboxVueEvents = {
-  /** Announced once the value has moved. */
-  input: HelixComboboxElementEvent;
   /** Announced once the value has moved. */
   change: HelixComboboxElementEvent;
   /** Fired before the chosen option changes. Cancelable: refusing it takes the decision and nothing moves. */
@@ -2382,6 +2389,8 @@ export type HelixComboboxVueEvents = {
   "helix-create": HelixComboboxHelixCreateElementEvent;
   /** Fired as the reader types, carrying the text the list is being narrowed to. Cancelable: refusing it leaves the list whole, and is how a consumer takes the filtering for themselves. */
   "helix-filter": HelixComboboxHelixFilterElementEvent;
+  /** Announced once the value has moved. */
+  input: HelixComboboxElementEvent;
   /** Says the state moved, carrying `newState` and `oldState`. */
   toggle: HelixComboboxElementEvent;
 };
@@ -2691,11 +2700,11 @@ say that without the component knowing what a row looks like. */
   /** Column order to open with, where nothing declared one. */
   defaultOrder?: (HelixDataTable["defaultOrder"]) | undefined;
   /** Page to open on, where nothing declared one. */
-  "default-page"?: (HelixDataTable["defaultPage"]) | undefined;
+  "default-page"?: (HelixDataTable["defaultPage"] | `${number}`) | undefined;
   /** Page to open on, where nothing declared one. */
   defaultPage?: (HelixDataTable["defaultPage"]) | undefined;
   /** Page size to open with, where nothing declared one. */
-  "default-page-size"?: (HelixDataTable["defaultPageSize"]) | undefined;
+  "default-page-size"?: (HelixDataTable["defaultPageSize"] | `${number}`) | undefined;
   /** Page size to open with, where nothing declared one. */
   defaultPageSize?: (HelixDataTable["defaultPageSize"]) | undefined;
   /** Keys to open with selected, comma separated, where nothing declared any. */
@@ -2802,7 +2811,7 @@ element ever asks for a different page size: a size selector is
 `helix-pagination-size`, which a consumer puts in the `footer` slot and
 answers themselves. Routing this through `requestChange` would announce an
 event the element never has cause to fire. */
-  "page-size"?: (HelixDataTable["pageSize"]) | undefined;
+  "page-size"?: (HelixDataTable["pageSize"] | `${number}`) | undefined;
   /** How many rows a page holds. Zero is every row, which is what "no paging" means.
 
 **It announces nothing, and that is not an omission.** Nothing in this
@@ -2884,6 +2893,30 @@ export type HelixDateInputHelixBeforeOpenElementEvent =
   HelixDateInputElementEvent<HelixBeforeOpenEvent>;
 
 export type HelixDateInputVueProps = {
+  /** Whether the control refuses changes while still submitting its value.
+
+**Enforced by refusing every request in one place**, which is the seam this
+component already has: `requestValue` is what every path here comes through,
+and gating it once is what stops the next call site from being written
+without the check.
+
+Not `disabled`, which is the confusion worth naming: a disabled control
+submits nothing and leaves the tab order, and a read-only one submits its
+value and stays reachable, which is what a form showing a value somebody
+else set needs. */
+  readonly?: (HelixDateInput["readOnly"]) | undefined;
+  /** Whether the control refuses changes while still submitting its value.
+
+**Enforced by refusing every request in one place**, which is the seam this
+component already has: `requestValue` is what every path here comes through,
+and gating it once is what stops the next call site from being written
+without the check.
+
+Not `disabled`, which is the confusion worth naming: a disabled control
+submits nothing and leaves the tab order, and a read-only one submits its
+value and stays reachable, which is what a form showing a value somebody
+else set needs. */
+  readOnly?: (HelixDateInput["readOnly"]) | undefined;
   /** Whether the element is open.
 
 One property, not two, so `dialog.open` answers the question anyone
@@ -2912,7 +2945,7 @@ the resolved state for stylesheets, which is what the mirror is for. */
   /** What the collapsed count is called, since `+3` names nothing. */
   expandLabel?: (HelixDateInput["expandLabel"]) | undefined;
   /** How many tokens to show before the rest become a count. */
-  "max-tags"?: (HelixDateInput["maxTags"]) | undefined;
+  "max-tags"?: (HelixDateInput["maxTags"] | `${number}`) | undefined;
   /** How many tokens to show before the rest become a count. */
   maxTags?: (HelixDateInput["maxTags"]) | undefined;
   /** The value the markup declared, which is where a reset returns to. */
@@ -2995,7 +3028,7 @@ submits and what `min` and `max` compare against. */
   /** Days of the week that cannot be chosen, `0` for Sunday through `6`. */
   disableDays?: (HelixDateInput["disableDays"]) | undefined;
   /** First column of the week in the calendar, `0` for Sunday through `6`. */
-  "first-day-of-week"?: (HelixDateInput["firstDayOfWeek"]) | undefined;
+  "first-day-of-week"?: (HelixDateInput["firstDayOfWeek"] | `${number}`) | undefined;
   /** First column of the week in the calendar, `0` for Sunday through `6`. */
   firstDayOfWeek?: (HelixDateInput["firstDayOfWeek"]) | undefined;
   /** Language tag the calendar names its months and days in. */
@@ -3018,30 +3051,6 @@ first. The panel is sized by its content, so this widens it. */
   months?: (HelixDateInput["months"]) | undefined;
   /** What the field says before a date is in it. */
   placeholder?: (HelixDateInput["placeholder"]) | undefined;
-  /** Whether the control refuses changes while still submitting its value.
-
-**Enforced by refusing every request in one place**, which is the seam this
-component already has: `requestValue` is what every path here comes through,
-and gating it once is what stops the next call site from being written
-without the check.
-
-Not `disabled`, which is the confusion worth naming: a disabled control
-submits nothing and leaves the tab order, and a read-only one submits its
-value and stays reachable, which is what a form showing a value somebody
-else set needs. */
-  readonly?: (HelixDateInput["readOnly"]) | undefined;
-  /** Whether the control refuses changes while still submitting its value.
-
-**Enforced by refusing every request in one place**, which is the seam this
-component already has: `requestValue` is what every path here comes through,
-and gating it once is what stops the next call site from being written
-without the check.
-
-Not `disabled`, which is the confusion worth naming: a disabled control
-submits nothing and leaves the tab order, and a read-only one submits its
-value and stays reachable, which is what a form showing a value somebody
-else set needs. */
-  readOnly?: (HelixDateInput["readOnly"]) | undefined;
   /** How far apart the selectable dates are, in days.
 
 `<input type="date" step>`'s own unit, handed to the calendar this renders
@@ -3096,8 +3105,6 @@ reader makes in one of these. */
 };
 
 export type HelixDateInputVueEvents = {
-  /** Announced once the value has moved. */
-  input: HelixDateInputElementEvent;
   /** Announced once the value has moved. */
   change: HelixDateInputElementEvent;
   /** Fired before the date changes. Cancelable: refusing it takes the decision and nothing moves. */
@@ -3106,6 +3113,8 @@ export type HelixDateInputVueEvents = {
   "helix-before-close": HelixDateInputHelixBeforeCloseElementEvent;
   /** Fired before the calendar opens. Cancelable: refusing it takes the decision and nothing moves. */
   "helix-before-open": HelixDateInputHelixBeforeOpenElementEvent;
+  /** Announced once the value has moved. */
+  input: HelixDateInputElementEvent;
   /** Says the state moved, carrying `newState` and `oldState`. */
   toggle: HelixDateInputElementEvent;
 };
@@ -3147,7 +3156,7 @@ a reset should return to. */
   /** Days of the week that cannot be chosen, comma separated, `0` to `6`. */
   disableDays?: (HelixDatePicker["disableDays"]) | undefined;
   /** First column of the week, `0` for Sunday through `6` for Saturday. */
-  "first-day-of-week"?: (HelixDatePicker["firstDayOfWeek"]) | undefined;
+  "first-day-of-week"?: (HelixDatePicker["firstDayOfWeek"] | `${number}`) | undefined;
   /** First column of the week, `0` for Sunday through `6` for Saturday. */
   firstDayOfWeek?: (HelixDatePicker["firstDayOfWeek"]) | undefined;
   /** Whether the current selection fails validation. */
@@ -3271,14 +3280,14 @@ reader makes in one of these. */
 };
 
 export type HelixDatePickerVueEvents = {
-  /** Announced once the value has moved. */
-  input: HelixDatePickerElementEvent;
   /** Announced once the value has moved. */
   change: HelixDatePickerElementEvent;
   /** Fired before the dates change, and cancelable. */
   "helix-before-change": HelixDatePickerHelixBeforeChangeElementEvent;
   /** Fired before the month on show changes, and cancelable. */
   "helix-navigate": HelixDatePickerHelixNavigateElementEvent;
+  /** Announced once the value has moved. */
+  input: HelixDatePickerElementEvent;
 };
 
 export type HelixDescriptionListItemVueProps = {
@@ -3813,12 +3822,12 @@ Here rather than on each control. */
 };
 
 export type HelixFileInputVueEvents = {
-  /** Announced once the value has moved. */
-  input: HelixFileInputElementEvent;
   /** Announced once the value has moved. */
   change: HelixFileInputElementEvent;
   /** Fired before the chosen files change, with their names. Cancelable: refusing it takes the decision and nothing moves. */
   "helix-before-change": HelixFileInputHelixBeforeChangeElementEvent;
+  /** Announced once the value has moved. */
+  input: HelixFileInputElementEvent;
 };
 
 /** `HelixFilterChip` component event */
@@ -4039,7 +4048,7 @@ the resolved state for stylesheets, which is what the mirror is for. */
   /** What the collapsed count is called, since `+3` names nothing. */
   expandLabel?: (HelixFilterInput["expandLabel"]) | undefined;
   /** How many tokens to show before the rest become a count. */
-  "max-tags"?: (HelixFilterInput["maxTags"]) | undefined;
+  "max-tags"?: (HelixFilterInput["maxTags"] | `${number}`) | undefined;
   /** How many tokens to show before the rest become a count. */
   maxTags?: (HelixFilterInput["maxTags"]) | undefined;
   /** The value the markup declared, which is where a reset returns to. */
@@ -4105,8 +4114,6 @@ Here rather than on each control. */
 };
 
 export type HelixFilterInputVueEvents = {
-  /** Announced once the text has moved. */
-  input: HelixFilterInputElementEvent;
   /** Relayed from the input once the reader has finished. */
   change: HelixFilterInputElementEvent;
   /** Fired as the text changes, and cancelable. */
@@ -4121,6 +4128,8 @@ export type HelixFilterInputVueEvents = {
   "helix-facet": HelixFilterInputHelixFacetElementEvent;
   /** A suggestion was chosen: the option's own, heard here because it bubbles out of `suggestions`. Cancelable: refusing it takes the decision from any other listener, and this field never acts on a choice itself, since what it means is the page's. */
   "helix-select": HelixFilterInputHelixSelectElementEvent;
+  /** Announced once the text has moved. */
+  input: HelixFilterInputElementEvent;
   /** Says the panel moved, carrying `newState` and `oldState`. */
   toggle: HelixFilterInputElementEvent;
 };
@@ -4259,7 +4268,7 @@ arithmetic should plan around.
 
 Zero turns the dropping off altogether, which is right for a strip in a
 container that cannot get narrow. */
-  "min-cell"?: (HelixHeatmap["minCell"]) | undefined;
+  "min-cell"?: (HelixHeatmap["minCell"] | `${number}`) | undefined;
   /** The smallest a cell may get before the strip draws fewer of them, in CSS pixels.
 
 **Set this only to overrule what the strip actually draws.** The arithmetic
@@ -4658,11 +4667,11 @@ is broken. */
   /** What the clear button is called, since an icon has no name of its own. */
   clearLabel?: (HelixInput["clearLabel"]) | undefined;
   /** Most characters the value may have. */
-  maxlength?: (HelixInput["maxLength"]) | undefined;
+  maxlength?: (HelixInput["maxLength"] | `${number}`) | undefined;
   /** Most characters the value may have. */
   maxLength?: (HelixInput["maxLength"]) | undefined;
   /** Fewest characters the value may have. */
-  minlength?: (HelixInput["minLength"]) | undefined;
+  minlength?: (HelixInput["minLength"] | `${number}`) | undefined;
   /** Fewest characters the value may have. */
   minLength?: (HelixInput["minLength"]) | undefined;
   /** A regular expression the value has to match, as the platform reads it.
@@ -4777,12 +4786,12 @@ be anyway. */
 };
 
 export type HelixInputVueEvents = {
-  /** Announced once the value has moved. */
-  input: HelixInputElementEvent;
   /** Relayed from the input once the reader has finished. */
   change: HelixInputElementEvent;
   /** Fired as the text changes, and cancelable. */
   "helix-before-change": HelixInputHelixBeforeChangeElementEvent;
+  /** Announced once the value has moved. */
+  input: HelixInputElementEvent;
 };
 
 /** `HelixKbd` component event */
@@ -5226,14 +5235,14 @@ that can. */
 };
 
 export type HelixListboxVueEvents = {
-  /** Announced once the value has moved. */
-  input: HelixListboxElementEvent;
   /** Announced once the value has moved. */
   change: HelixListboxElementEvent;
   /** Fired when the answer changes, and cancelable. */
   "helix-before-change": HelixListboxHelixBeforeChangeElementEvent;
   /** Fired before the list narrows, and cancelable. */
   "helix-filter": HelixListboxHelixFilterElementEvent;
+  /** Announced once the value has moved. */
+  input: HelixListboxElementEvent;
 };
 
 export type HelixLoaderVueProps = {
@@ -5297,7 +5306,7 @@ so the controller has to be told not to measure, and that decision is here
 whatever the stylesheet says. Writing the width in both places would be one
 number in two languages, drifting the first time either moved. This sets
 `data-narrow` on the host and the stylesheet arranges itself off that. */
-  "full-below"?: (HelixMegamenu["fullBelow"]) | undefined;
+  "full-below"?: (HelixMegamenu["fullBelow"] | `${number}`) | undefined;
   /** The width, in pixels, under which a card becomes a band. Zero never does.
 
 A card is a panel hung off one word, and there is no room to hang anything
@@ -5853,7 +5862,7 @@ consumer to ask for it. */
 Ten steps, which is the convention every spinner on the platform follows,
 and a property because ten of a step of `0.01` is a hundredth and rarely
 what a reader wants from a whole key. */
-  "large-step"?: (HelixNumberInput["largeStep"]) | undefined;
+  "large-step"?: (HelixNumberInput["largeStep"] | `${number}`) | undefined;
   /** How far `PageUp` and `PageDown` move.
 
 Ten steps, which is the convention every spinner on the platform follows,
@@ -5922,12 +5931,12 @@ form would submit it. */
 };
 
 export type HelixNumberInputVueEvents = {
-  /** Announced once the value has moved. */
-  input: HelixNumberInputElementEvent;
   /** Relayed from the field once the reader has finished. */
   change: HelixNumberInputElementEvent;
   /** Fired as the value changes, and cancelable. */
   "helix-before-change": HelixNumberInputHelixBeforeChangeElementEvent;
+  /** Announced once the value has moved. */
+  input: HelixNumberInputElementEvent;
 };
 
 /** `HelixObjectInspector` component event */
@@ -5946,7 +5955,7 @@ One by default: the root is open and everything under it closed, so a
 reader sees the shape of the value before its contents. `0` starts with the
 root closed; a large number opens everything, which on a big value is the
 wall of text this exists to avoid. */
-  "default-depth"?: (HelixObjectInspector["defaultDepth"]) | undefined;
+  "default-depth"?: (HelixObjectInspector["defaultDepth"] | `${number}`) | undefined;
   /** How many levels start open.
 
 One by default: the root is open and everything under it closed, so a
@@ -6193,7 +6202,7 @@ Not reflected, for the reason `ends` is not: it decides what renders, so
 nothing has to select on it. */
   compact?: (HelixPagination["compact"]) | undefined;
   /** Page to open on, where nothing declared one. */
-  "default-page"?: (HelixPagination["defaultPage"]) | undefined;
+  "default-page"?: (HelixPagination["defaultPage"] | `${number}`) | undefined;
   /** Page to open on, where nothing declared one. */
   defaultPage?: (HelixPagination["defaultPage"]) | undefined;
   /** Whether to offer a jump to the first and last pages.
@@ -6279,7 +6288,7 @@ so there is never a question of which of two sources is current. */
 Only arithmetic: this does not slice anything, because the component never
 sees the items. It is what turns `total` into a page count, and nothing
 else. */
-  "page-size"?: (HelixPagination["pageSize"]) | undefined;
+  "page-size"?: (HelixPagination["pageSize"] | `${number}`) | undefined;
   /** How many items are on a page.
 
 Only arithmetic: this does not slice anything, because the component never
@@ -6332,7 +6341,7 @@ export type HelixPaginationSizeHelixBeforeChangeElementEvent =
 
 export type HelixPaginationSizeVueProps = {
   /** Size to start on, where nothing declared one. */
-  "default-value"?: (HelixPaginationSize["defaultValue"]) | undefined;
+  "default-value"?: (HelixPaginationSize["defaultValue"] | `${number}`) | undefined;
   /** Size to start on, where nothing declared one. */
   defaultValue?: (HelixPaginationSize["defaultValue"]) | undefined;
   /** The size in force.
@@ -6382,7 +6391,7 @@ Absent uses the runtime's own. */
   /** The page on show, one-based. */
   page?: (HelixPaginationSummary["page"]) | undefined;
   /** How many items are on a page. */
-  "page-size"?: (HelixPaginationSummary["pageSize"]) | undefined;
+  "page-size"?: (HelixPaginationSummary["pageSize"] | `${number}`) | undefined;
   /** How many items are on a page. */
   pageSize?: (HelixPaginationSummary["pageSize"]) | undefined;
   /** How many items there are across every page. */
@@ -6499,14 +6508,14 @@ Here rather than on each control. */
 };
 
 export type HelixPinInputVueEvents = {
-  /** Announced once the value has moved. */
-  input: HelixPinInputElementEvent;
   /** Announced with a filled code, and when an edited one loses focus. */
   change: HelixPinInputElementEvent;
   /** Fired as the code changes, and cancelable. */
   "helix-before-change": HelixPinInputHelixBeforeChangeElementEvent;
   /** Fired when the last box is filled. */
   "helix-complete": HelixPinInputHelixCompleteElementEvent;
+  /** Announced once the value has moved. */
+  input: HelixPinInputElementEvent;
 };
 
 /** `HelixPopover` component event */
@@ -6765,14 +6774,14 @@ Here rather than on each control. */
 };
 
 export type HelixRadioGroupVueEvents = {
-  /** Announced once the value has moved. */
-  input: HelixRadioGroupElementEvent;
   /** Announced once the value has moved. */
   change: HelixRadioGroupElementEvent;
   /** Fired when the answer changes, and cancelable. */
   "helix-before-change": HelixRadioGroupHelixBeforeChangeElementEvent;
   /** Fired when an answer is chosen. Dispatched by the radio and listened for here, because the group is what a consumer holds. Cancelable: refusing it takes the decision and nothing moves. */
   "helix-select": HelixRadioGroupHelixSelectElementEvent;
+  /** Announced once the value has moved. */
+  input: HelixRadioGroupElementEvent;
 };
 
 /** `HelixRadio` component event */
@@ -6998,12 +7007,12 @@ form would submit it. */
 };
 
 export type HelixRatingVueEvents = {
-  /** Announced once the value has moved. */
-  input: HelixRatingElementEvent;
   /** Announced with it, the choice being the commit. */
   change: HelixRatingElementEvent;
   /** Fired before the score changes, and cancelable. */
   "helix-before-change": HelixRatingHelixBeforeChangeElementEvent;
+  /** Announced once the value has moved. */
+  input: HelixRatingElementEvent;
 };
 
 /** `HelixSandboxPreview` component event */
@@ -7097,7 +7106,7 @@ export type HelixSandboxVueProps = {
   /** What a reset makes the panel, in pixels.
 
 The pair to `panel-size`. */
-  "default-panel-size"?: (HelixSandbox["defaultPanelSize"]) | undefined;
+  "default-panel-size"?: (HelixSandbox["defaultPanelSize"] | `${number}`) | undefined;
   /** What a reset makes the panel, in pixels.
 
 The pair to `panel-size`. */
@@ -7113,7 +7122,7 @@ sandbox back to the size it already was.
 
 Declared rather than captured, so it is a number a consumer states and can
 change, and it needs no first frame to be read on. */
-  "default-split"?: (HelixSandbox["defaultSplit"]) | undefined;
+  "default-split"?: (HelixSandbox["defaultSplit"] | `${number}`) | undefined;
   /** Where a reset puts the divider, where nothing declared it.
 
 Separate from `split` for the reason `Splitter` keeps `default-position`
@@ -7149,7 +7158,7 @@ the same thing in both directions: thirty percent to whatever comes first. */
 Zero closes it outright. A panel whose contents include the control that
 reopens it, a row of tabs being the usual one, wants that row left showing,
 and only whoever slotted it knows how tall that is. */
-  "panel-collapsed-size"?: (HelixSandbox["panelCollapsedSize"]) | undefined;
+  "panel-collapsed-size"?: (HelixSandbox["panelCollapsedSize"] | `${number}`) | undefined;
   /** What the panel's height becomes when it is closed.
 
 Zero closes it outright. A panel whose contents include the control that
@@ -7161,7 +7170,7 @@ and only whoever slotted it knows how tall that is. */
   /** Accessible name for the panel's divider. */
   panelLabel?: (HelixSandbox["panelLabel"]) | undefined;
   /** Height of the panel, in pixels. */
-  "panel-size"?: (HelixSandbox["panelSize"]) | undefined;
+  "panel-size"?: (HelixSandbox["panelSize"] | `${number}`) | undefined;
   /** Height of the panel, in pixels. */
   panelSize?: (HelixSandbox["panelSize"]) | undefined;
   /** Accessible name for the divider. */
@@ -7437,8 +7446,6 @@ differently: they are one chooser to a consumer. */
 };
 
 export type HelixSelectVueEvents = {
-  /** Announced once the value has moved. */
-  input: HelixSelectElementEvent;
   /** Announced once the value has moved. */
   change: HelixSelectElementEvent;
   /** Relayed from the listbox when the answer changes. Cancelable: refusing it takes the decision and nothing moves. */
@@ -7447,6 +7454,8 @@ export type HelixSelectVueEvents = {
   "helix-before-close": HelixSelectHelixBeforeCloseElementEvent;
   /** Fired before the list opens. Cancelable: refusing it takes the decision and nothing moves. */
   "helix-before-open": HelixSelectHelixBeforeOpenElementEvent;
+  /** Announced once the value has moved. */
+  input: HelixSelectElementEvent;
   /** Says the state moved, carrying `newState` and `oldState`. */
   toggle: HelixSelectElementEvent;
 };
@@ -7577,12 +7586,12 @@ Here rather than on each control. */
 };
 
 export type HelixSliderVueEvents = {
-  /** Announced once the value has moved. */
-  input: HelixSliderElementEvent;
   /** Relayed once the reader has let go. */
   change: HelixSliderElementEvent;
   /** Fired as the value changes, and cancelable. */
   "helix-before-change": HelixSliderHelixBeforeChangeElementEvent;
+  /** Announced once the value has moved. */
+  input: HelixSliderElementEvent;
 };
 
 export type HelixSparklineVueProps = {
@@ -7826,7 +7835,7 @@ Zero by default, which is a pane fully gone. A tab strip or a title bar
 that should survive its own collapse says how much of itself to keep, and
 only whoever put it there knows that, which is the same reason `min` is a
 consumer's to set. */
-  "collapsed-size"?: (HelixSplitter["collapsedSize"]) | undefined;
+  "collapsed-size"?: (HelixSplitter["collapsedSize"] | `${number}`) | undefined;
   /** How much of a shut pane is still shown, as a percentage.
 
 Zero by default, which is a pane fully gone. A tab strip or a title bar
@@ -7861,7 +7870,7 @@ of a pane during a drag; this is the thing that says the sliver can go. */
   /** Which pane starts shut, where nothing declared it. */
   defaultCollapsed?: (HelixSplitter["defaultCollapsed"]) | undefined;
   /** Where the divider starts, where nothing declared it. */
-  "default-position"?: (HelixSplitter["defaultPosition"]) | undefined;
+  "default-position"?: (HelixSplitter["defaultPosition"] | `${number}`) | undefined;
   /** Where the divider starts, where nothing declared it. */
   defaultPosition?: (HelixSplitter["defaultPosition"]) | undefined;
   /** Accessible name for the divider. */
@@ -8509,7 +8518,7 @@ submitted nothing. `ElementInternals` takes a `FormData`, which is how one
 element sends two entries, and that is what this does. */
   dirName?: (HelixTextarea["dirName"]) | undefined;
   /** Most characters the value may have. */
-  maxlength?: (HelixTextarea["maxLength"]) | undefined;
+  maxlength?: (HelixTextarea["maxLength"] | `${number}`) | undefined;
   /** Most characters the value may have. */
   maxLength?: (HelixTextarea["maxLength"]) | undefined;
   /** Fewest characters the value may have.
@@ -8518,7 +8527,7 @@ Forwarded to the real `<textarea>` rather than checked here, which is what
 makes the message the browser's and therefore the reader's own language.
 No `pattern`: the platform does not give a textarea one, and inventing it
 would be this library guessing where the point is to stop guessing. */
-  minlength?: (HelixTextarea["minLength"]) | undefined;
+  minlength?: (HelixTextarea["minLength"] | `${number}`) | undefined;
   /** Fewest characters the value may have.
 
 Forwarded to the real `<textarea>` rather than checked here, which is what
@@ -8584,12 +8593,12 @@ which is where an empty field's caret would be anyway. */
 };
 
 export type HelixTextareaVueEvents = {
-  /** Announced once the value has moved. */
-  input: HelixTextareaElementEvent;
   /** Relayed from the textarea once the reader has finished. */
   change: HelixTextareaElementEvent;
   /** Fired as the text changes, and cancelable. */
   "helix-before-change": HelixTextareaHelixBeforeChangeElementEvent;
+  /** Announced once the value has moved. */
+  input: HelixTextareaElementEvent;
 };
 
 /** `HelixTimeInput` component event */
@@ -8608,6 +8617,30 @@ export type HelixTimeInputHelixBeforeOpenElementEvent =
   HelixTimeInputElementEvent<HelixBeforeOpenEvent>;
 
 export type HelixTimeInputVueProps = {
+  /** Whether the control refuses changes while still submitting its value.
+
+**Enforced by refusing every request in one place**, which is the seam this
+component already has: `requestValue` is what every path here comes through,
+and gating it once is what stops the next call site from being written
+without the check.
+
+Not `disabled`, which is the confusion worth naming: a disabled control
+submits nothing and leaves the tab order, and a read-only one submits its
+value and stays reachable, which is what a form showing a value somebody
+else set needs. */
+  readonly?: (HelixTimeInput["readOnly"]) | undefined;
+  /** Whether the control refuses changes while still submitting its value.
+
+**Enforced by refusing every request in one place**, which is the seam this
+component already has: `requestValue` is what every path here comes through,
+and gating it once is what stops the next call site from being written
+without the check.
+
+Not `disabled`, which is the confusion worth naming: a disabled control
+submits nothing and leaves the tab order, and a read-only one submits its
+value and stays reachable, which is what a form showing a value somebody
+else set needs. */
+  readOnly?: (HelixTimeInput["readOnly"]) | undefined;
   /** Whether the element is open.
 
 One property, not two, so `dialog.open` answers the question anyone
@@ -8636,7 +8669,7 @@ the resolved state for stylesheets, which is what the mirror is for. */
   /** What the collapsed count is called, since `+3` names nothing. */
   expandLabel?: (HelixTimeInput["expandLabel"]) | undefined;
   /** How many tokens to show before the rest become a count. */
-  "max-tags"?: (HelixTimeInput["maxTags"]) | undefined;
+  "max-tags"?: (HelixTimeInput["maxTags"] | `${number}`) | undefined;
   /** How many tokens to show before the rest become a count. */
   maxTags?: (HelixTimeInput["maxTags"]) | undefined;
   /** The value the markup declared, which is where a reset returns to. */
@@ -8680,30 +8713,6 @@ why a wheel cannot do either. */
   mode?: (HelixTimeInput["mode"]) | undefined;
   /** What the field says before a time is in it. */
   placeholder?: (HelixTimeInput["placeholder"]) | undefined;
-  /** Whether the control refuses changes while still submitting its value.
-
-**Enforced by refusing every request in one place**, which is the seam this
-component already has: `requestValue` is what every path here comes through,
-and gating it once is what stops the next call site from being written
-without the check.
-
-Not `disabled`, which is the confusion worth naming: a disabled control
-submits nothing and leaves the tab order, and a read-only one submits its
-value and stays reachable, which is what a form showing a value somebody
-else set needs. */
-  readonly?: (HelixTimeInput["readOnly"]) | undefined;
-  /** Whether the control refuses changes while still submitting its value.
-
-**Enforced by refusing every request in one place**, which is the seam this
-component already has: `requestValue` is what every path here comes through,
-and gating it once is what stops the next call site from being written
-without the check.
-
-Not `disabled`, which is the confusion worth naming: a disabled control
-submits nothing and leaves the tab order, and a read-only one submits its
-value and stays reachable, which is what a form showing a value somebody
-else set needs. */
-  readOnly?: (HelixTimeInput["readOnly"]) | undefined;
   /** How far apart the offered times are, in minutes. */
   step?: (HelixTimeInput["step"]) | undefined;
   /** Whether the field writes the time out, or holds the value as it is.
@@ -8777,8 +8786,6 @@ a consumer handing over `new Date()` gets the time of day they expected. */
 };
 
 export type HelixTimeInputVueEvents = {
-  /** Announced once the value has moved. */
-  input: HelixTimeInputElementEvent;
   /** Announced once the value has moved. */
   change: HelixTimeInputElementEvent;
   /** Fired before the time changes. Cancelable: refusing it takes the decision and nothing moves. */
@@ -8787,6 +8794,8 @@ export type HelixTimeInputVueEvents = {
   "helix-before-close": HelixTimeInputHelixBeforeCloseElementEvent;
   /** Fired before the list opens. Cancelable: refusing it takes the decision and nothing moves. */
   "helix-before-open": HelixTimeInputHelixBeforeOpenElementEvent;
+  /** Announced once the value has moved. */
+  input: HelixTimeInputElementEvent;
   /** Says the state moved, carrying `newState` and `oldState`. */
   toggle: HelixTimeInputElementEvent;
 };
@@ -8966,12 +8975,12 @@ a consumer handing over `new Date()` gets the time of day they expected. */
 };
 
 export type HelixTimePickerVueEvents = {
-  /** Announced once the value has moved. */
-  input: HelixTimePickerElementEvent;
   /** Announced once the value has moved. */
   change: HelixTimePickerElementEvent;
   /** Fired before the time changes. Cancelable: refusing it takes the decision and nothing moves. */
   "helix-before-change": HelixTimePickerHelixBeforeChangeElementEvent;
+  /** Announced once the value has moved. */
+  input: HelixTimePickerElementEvent;
 };
 
 export type HelixTimelineItemVueProps = {
@@ -9177,14 +9186,14 @@ Here rather than on each control. */
 };
 
 export type HelixToggleGroupVueEvents = {
-  /** Announced once the value has moved. */
-  input: HelixToggleGroupElementEvent;
   /** Announced once the value has moved. */
   change: HelixToggleGroupElementEvent;
   /** Fired before the answer moves, and cancelable. The only way to refuse one. */
   "helix-before-change": HelixToggleGroupHelixBeforeChangeElementEvent;
   /** Fired when an item is chosen. Dispatched by the item and listened for here. Cancelable: refusing it takes the decision and nothing moves. */
   "helix-select": HelixToggleGroupHelixSelectElementEvent;
+  /** Announced once the value has moved. */
+  input: HelixToggleGroupElementEvent;
 };
 
 /** `HelixToggle` component event */
@@ -9305,7 +9314,7 @@ of them, which is noise rather than help. Focus opens with no delay: a
 keyboard reader arriving on a control has already committed to it. */
   delay?: (HelixTooltip["delay"]) | undefined;
   /** How long the bubble stays after the pointer leaves, in milliseconds. */
-  "delay-out"?: (HelixTooltip["delayOut"]) | undefined;
+  "delay-out"?: (HelixTooltip["delayOut"] | `${number}`) | undefined;
   /** How long the bubble stays after the pointer leaves, in milliseconds. */
   delayOut?: (HelixTooltip["delayOut"]) | undefined;
   /** Whether the tooltip never shows. */
@@ -9412,7 +9421,7 @@ The shape is `Carousel`'s, which is the nearest thing in the library: a
 `undefined` until somebody sets one. */
   index?: (HelixTour["index"]) | undefined;
   /** Stop to start on, where nothing declared one. */
-  "default-index"?: (HelixTour["defaultIndex"]) | undefined;
+  "default-index"?: (HelixTour["defaultIndex"] | `${number}`) | undefined;
   /** Stop to start on, where nothing declared one. */
   defaultIndex?: (HelixTour["defaultIndex"]) | undefined;
   /** Label for the control that goes on from the last stop. */
@@ -9432,7 +9441,7 @@ The shape is `Carousel`'s, which is the nearest thing in the library: a
   /** Label for the control that leaves the tour. */
   skipLabel?: (HelixTour["skipLabel"]) | undefined;
   /** Space left around the target when it is lit, in pixels. */
-  "spotlight-padding"?: (HelixTour["spotlightPadding"]) | undefined;
+  "spotlight-padding"?: (HelixTour["spotlightPadding"] | `${number}`) | undefined;
   /** Space left around the target when it is lit, in pixels. */
   spotlightPadding?: (HelixTour["spotlightPadding"]) | undefined;
 };
@@ -9931,7 +9940,7 @@ as long as anyone is likely to look.
 
 The wait is only ever about *idling*. A video that is paused keeps its bar
 regardless, because a reader who stopped it is deciding what to do next. */
-  "idle-delay"?: (HelixVideo["idleDelay"]) | undefined;
+  "idle-delay"?: (HelixVideo["idleDelay"] | `${number}`) | undefined;
   /** How long the bar waits after the pointer stops before it goes, in ms.
 
 A wait rather than leaving with the pointer, or a reader moving across the
@@ -10117,7 +10126,7 @@ export type CustomCssProperties = {
   "--area-chart-gap"?: (string) | undefined;
   /** One rule across the plot, under `gridlines`. */
   "--area-chart-gridline-color"?: (string) | undefined;
-  /** Thickness of a band's top edge. */
+  /** Thickness of a band's top edge, over `--chart-stroke`. */
   "--area-chart-width"?: (string) | undefined;
   /** How far each avatar sits over the one before it. */
   "--avatar-group-overlap"?: (string) | undefined;
@@ -10147,7 +10156,7 @@ export type CustomCssProperties = {
   "--bar-chart-gridline-color"?: (string) | undefined;
   /** A `lines` series, overriding its series color. */
   "--bar-chart-line-color"?: (string) | undefined;
-  /** Thickness of a `lines` series. */
+  /** Thickness of a `lines` series, over `--chart-stroke`. */
   "--bar-chart-line-width"?: (string) | undefined;
   /** The color of a single-series axis, taken from that series. */
   "--bar-chart-axis"?: (string) | undefined;
@@ -10555,6 +10564,8 @@ export type CustomCssProperties = {
   "--legend-swatch-size"?: (string) | undefined;
   /** Width of the edge an `outlined` or `subtle` swatch is drawn with. */
   "--legend-swatch-stroke"?: (string) | undefined;
+  /** Thickness of a series drawn as a line, here and on Area Chart's top edge and Bar Chart's `lines`. Each family's own width hook overrides it. */
+  "--chart-stroke"?: (string) | undefined;
   /** How much of a line's color its wash takes. */
   "--line-chart-area-opacity"?: (string) | undefined;
   /** The slot the pointer is resting in. */
@@ -10565,7 +10576,7 @@ export type CustomCssProperties = {
   "--line-chart-gap"?: (string) | undefined;
   /** One rule across the plot, under `gridlines`. */
   "--line-chart-gridline-color"?: (string) | undefined;
-  /** Thickness of a line. */
+  /** Thickness of a line, over `--chart-stroke`. */
   "--line-chart-width"?: (string) | undefined;
   /** Padding inside the row. */
   "--list-item-padding"?: (string) | undefined;
@@ -10687,6 +10698,8 @@ export type CustomCssProperties = {
   "--notifications-max-block-size"?: (string) | undefined;
   /** The gutter every item holds open where something in the feed has media. */
   "--notifications-media-column"?: (string) | undefined;
+  /** Fill behind the number. */
+  "--number-input-background-color"?: (string) | undefined;
   /** Ground under the tree. */
   "--object-inspector-background-color"?: (string) | undefined;
   /** Height of the scrolling box, when windowed. */
@@ -11139,7 +11152,7 @@ export interface WcToolkitVueGlobalComponents {
     HelixAreaChartVueProps,
     HelixAreaChartVueEvents
   >;
-  /** One fragment shader over a full-screen triangle, with the palette read from the tokens rather than given as colors. A background written with hex values is an asset that has to be re-cut when the brand moves; one written against '--helix-color-primary' is a consequence of it.  **Every shape ramps through four token stops**, and the token layer inverts each: the page's background, 'primary-subtle', 'primary', then a peak. The peak is the foreground on a dark page and 'primary-active' on a light one, because mixing a saturated hue toward near-black takes the chroma out of the pixels carrying most of it. Which way the page runs is read off the ground's own luminance rather than asked of the mode, which is a private token.  **No dependency, and no scene graph.** The geometry is three vertices derived from 'gl_VertexID', so there is no attribute, no buffer and no upload.  **It stops when nobody is looking**, off screen and in a background tab, and 'prefers-reduced-motion' gets one still frame rather than an empty box. */
+  /** One fragment shader over a full-screen triangle, with the palette read from the tokens rather than given as colors. A background written with hex values is an asset that has to be re-cut when the brand moves; one written against '--helix-color-primary' is a consequence of it.  **Every shape ramps through four token stops**, and the token layer inverts each: the page's background, 'primary-subtle', 'primary', then a peak. The peak is the foreground on a dark page and 'primary-active' on a light one, because mixing a saturated hue toward near-black takes the chroma out of the pixels carrying most of it. Which way the page runs is read off the ground's own luminance rather than asked of the mode, which is a private token.  **No dependency, and no scene graph.** The geometry is three vertices derived from 'gl_VertexID', so there is no attribute, no buffer and no upload.  **It stops when nobody is looking**, off screen and in a background tab, and 'prefers-reduced-motion' gets one still frame rather than an empty box.  Styled only, and with behavior, which the tier split does not otherwise allow: the behavior is drawing to a canvas, so there is no structure a consumer could restyle and nothing for a headless twin to hold. */
   "helix-aura": DefineCustomElement<
     HelixAura,
     HelixAuraVueProps,
@@ -11241,7 +11254,7 @@ export interface WcToolkitVueGlobalComponents {
     HelixCheckboxGroupVueProps,
     HelixCheckboxGroupVueEvents
   >;
-  /** The box is the native input, restyled rather than replaced, so the tick and the indeterminate dash are the browser's own and the control stays a control for anything reading the page.  The label sits beside it and the whole thing is the click target, which is what a native '<label>' wrapping a checkbox gives and what a reader expects. */
+  /** The box is the native input with its own drawing switched off, so the control stays a control for anything reading the page while the tick and the indeterminate dash are drawn here, as masks over a mark beside it, and their weight, color and motion are the design system's rather than the browser's.  The label sits beside it and the whole thing is the click target, which is what a native '<label>' wrapping a checkbox gives and what a reader expects. */
   "helix-checkbox": DefineCustomElement<
     HelixCheckbox,
     HelixCheckboxVueProps,
@@ -11559,7 +11572,7 @@ export interface WcToolkitVueGlobalComponents {
     HelixOptionVueProps,
     HelixOptionVueEvents
   >;
-  /** A cloud of dots, drawn to a canvas, with one shape per state. 'connecting' and 'thinking' are the same leaning sash and differ in how agitated it is; 'waiting' and 'done' are the same settled ball at different tempos, which is the difference between not having started and having finished. 'fetching' is a globe with a light going round it, 'listening' a closed sphere with a ripple crossing it, and 'working' a ring.  **None of them is a separate drawing.** Each is the same banded grid given different numbers, so changing state interpolates the numbers and every frame in between is a whole shape. A loader that cuts between pictures says the work restarted; one that carries a shape into the next says it moved on.  **A change is measured before it is played.** Two states differing in one small number are given less time than a sash becoming a ring, and the silhouette leads what the shape is doing, so a light is never seen orbiting something that has not finished becoming round.  **Nothing spins.** The whole cloud holds still and everything that moves is moving inside it, which is what makes it read as thought rather than as a thing being rotated. The one exception is the light, which travels because a ring of evenly spaced dots is unchanged by rotation: without something fixed in space passing over them, a state that turns has nothing a reader can see turning.  **The palette is read from the tokens**, not given as colors: a dot's ink is mixed toward the ground by how far away it is, and both ends come from '--orb-color' and '--orb-ground'. That is what makes depth survive a theme change without the consumer restating anything.  **It stops when nobody is looking**, off screen and in a background tab, and 'prefers-reduced-motion' gets one still frame rather than an empty box. */
+  /** A cloud of dots, drawn to a canvas, with one shape per state. 'connecting' and 'thinking' are the same leaning sash and differ in how agitated it is; 'waiting' and 'done' are the same settled ball at different tempos, which is the difference between not having started and having finished. 'fetching' is a globe with a light going round it, 'listening' a closed sphere with a ripple crossing it, and 'working' a ring.  **None of them is a separate drawing.** Each is the same banded grid given different numbers, so changing state interpolates the numbers and every frame in between is a whole shape. A loader that cuts between pictures says the work restarted; one that carries a shape into the next says it moved on.  **A change is measured before it is played.** Two states differing in one small number are given less time than a sash becoming a ring, and the silhouette leads what the shape is doing, so a light is never seen orbiting something that has not finished becoming round.  **Nothing spins.** The whole cloud holds still and everything that moves is moving inside it, which is what makes it read as thought rather than as a thing being rotated. The one exception is the light, which travels because a ring of evenly spaced dots is unchanged by rotation: without something fixed in space passing over them, a state that turns has nothing a reader can see turning.  **The palette is read from the tokens**, not given as colors: a dot's ink is mixed toward the ground by how far away it is, and both ends come from '--orb-color' and '--orb-ground'. That is what makes depth survive a theme change without the consumer restating anything.  **It stops when nobody is looking**, off screen and in a background tab, and 'prefers-reduced-motion' gets one still frame rather than an empty box.  Styled only, and with behavior, which the tier split does not otherwise allow: the behavior is drawing dots to a canvas, so there is no structure a consumer could restyle and nothing for a headless twin to hold. */
   "helix-orb": DefineCustomElement<
     HelixOrb,
     HelixOrbVueProps,
@@ -11762,7 +11775,7 @@ export interface WcToolkitVueGlobalComponents {
     HelixSwitchVueProps,
     HelixSwitchVueEvents
   >;
-  /** Hairline rules between rows and no fill, per the rule that depth comes from a single border rather than from elevation. A dense table earns its density by decorating none of it. */
+  /** Every cell is the same height whatever it holds, so a row with a tag or an icon button in it sits level with a row of text. Content is set in full foreground, since the cells are what a reader is reading, and a long identifier breaks rather than running into the next column. */
   "helix-table-cell": DefineCustomElement<
     HelixTableCell,
     HelixTableCellVueProps,
@@ -11780,13 +11793,13 @@ export interface WcToolkitVueGlobalComponents {
     HelixTableVueProps,
     HelixTableVueEvents
   >;
-  /** Hairline rules between rows and no fill, per the rule that depth comes from a single border rather than from elevation. A dense table earns its density by decorating none of it. */
+  /** No box of its own, so its cells become items of the table's grid and line up with every other row's. The element still exists, which is what lets a row be selected, hidden or made interactive without a wrapper that would break the columns. */
   "helix-table-row": DefineCustomElement<
     HelixTableRow,
     HelixTableRowVueProps,
     HelixTableRowVueEvents
   >;
-  /** Selection is marked with a rule under the active tab rather than a filled pill, which keeps the row flat and lets the underline animate between tabs as a movement instead of two separate fills. */
+  /** No box of its own, so only the panel that is showing takes space: a tab set with four panels gives the visible one the whole height rather than a quarter of it. */
   "helix-tab-panel": DefineCustomElement<
     HelixTabPanel,
     HelixTabPanelVueProps,
@@ -11798,7 +11811,7 @@ export interface WcToolkitVueGlobalComponents {
     HelixTabsVueProps,
     HelixTabsVueEvents
   >;
-  /** Selection is marked with a rule under the active tab rather than a filled pill, which keeps the row flat and lets the underline animate between tabs as a movement instead of two separate fills. */
+  /** A control's height, so a tab row sits level with the buttons beside it. The current tab is not marked here: one indicator travels along the tab list, and each tab keeps a transparent edge of the same width so its box does not move when it becomes current. */
   "helix-tab": DefineCustomElement<
     HelixTab,
     HelixTabVueProps,