@fusion.dev/helix 0.149.0 → 0.150.0

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@fusion.dev/helix",
   "description": "Styled component tier. Extends the headless tier with token-driven presentation.",
-  "version": "0.149.0",
+  "version": "0.150.0",
   "license": "MIT",
   "author": "Ross Sheppard <ross.sheppard@fusion.dev>",
   "repository": {
@@ -54,17 +54,17 @@
   },
   "bugs": "https://github.com/project-fusion/fusion/issues",
   "dependencies": {
-    "@fusion.dev/helix-core": "0.149.0",
-    "@fusion.dev/helix-headless": "0.149.0",
-    "@fusion.dev/helix-styles": "0.149.0"
+    "@fusion.dev/helix-core": "0.150.0",
+    "@fusion.dev/helix-headless": "0.150.0",
+    "@fusion.dev/helix-styles": "0.150.0"
   },
   "devDependencies": {
-    "@fusion.dev/helix-cem": "0.149.0",
-    "@fusion.dev/helix-testing": "0.149.0",
+    "@fusion.dev/helix-cem": "0.150.0",
+    "@fusion.dev/helix-testing": "0.150.0",
     "@fusion.dev/scripts": "0.0.0-dev",
-    "@happy-dom/global-registrator": "^20.0.0",
+    "@happy-dom/global-registrator": "^20.14.5",
     "@lit-labs/ssr": "^4.1.0",
-    "@types/bun": "^1.3.0",
+    "@types/bun": "^1.4.2",
     "lit": "^3.2.1",
     "remark-gfm": "^4.0.1",
     "remark-parse": "^11.0.0",

package/types/jsx.d.ts

@@ -23344,14 +23344,10 @@ between them makes a reader parse the punctuation to find where the name
 ends. Matching still reads the label, so what somebody types is matched
 against the name rather than against prose about it.
 
-**A property and not a slot, which is the departure worth explaining.** The
-area rules say a content property is its slot's fallback, and that holds for
-a region always drawn: `Avatar`'s initials, `Tooltip`'s text. This one is
-usually absent, and a wrapped slot generates a box whether or not it is
-filled, so every option without a caption would carry an empty line. The
-detection that would avoid it does not exist, `:host(:has())` being invalid
-and the server having no children to inspect. A property is known at render
-time, so the component can decline to draw the box at all.
+For a caption richer than a string, slot it into `description`. The
+property is that slot's fallback inside the `description` part. With no
+property the slot is drawn bare, which takes no box while it is empty, so
+an option without a caption carries no empty line.
 
 It does not reflect, per the rule that payload state stays off the host: a
 string is not a fact a selector needs. */
@@ -23439,6 +23435,13 @@ name is the fault `TreeItem` avoids by mirroring to `data-selected`.
 Splitting them means moving what every stylesheet selects on, which is a
 change of its own rather than a property being added. */
   defaultSelected?: (HelixOption["defaultSelected"]) | undefined;
+  /** Whether the option says it is selected while the keyboard is on it.
+
+Written by a control whose list holds suggestions, such as `FilterInput`:
+nothing there stays chosen, so the row the keyboard is on is the
+selection, as the APG combobox's list with selection that follows focus
+says. No attribute: it is coordination between elements. */
+  selectionFollowsActive?: (HelixOption["selectionFollowsActive"]) | undefined;
 
   /** The option was chosen. Cancelable: canceling it leaves the selection as it was, and keeps the browser from following an option's `href`. */
   "onhelix-select"?: ((e: HelixOptionHelixSelectElementEvent) => void) | undefined;
@@ -23501,14 +23504,10 @@ between them makes a reader parse the punctuation to find where the name
 ends. Matching still reads the label, so what somebody types is matched
 against the name rather than against prose about it.
 
-**A property and not a slot, which is the departure worth explaining.** The
-area rules say a content property is its slot's fallback, and that holds for
-a region always drawn: `Avatar`'s initials, `Tooltip`'s text. This one is
-usually absent, and a wrapped slot generates a box whether or not it is
-filled, so every option without a caption would carry an empty line. The
-detection that would avoid it does not exist, `:host(:has())` being invalid
-and the server having no children to inspect. A property is known at render
-time, so the component can decline to draw the box at all.
+For a caption richer than a string, slot it into `description`. The
+property is that slot's fallback inside the `description` part. With no
+property the slot is drawn bare, which takes no box while it is empty, so
+an option without a caption carries no empty line.
 
 It does not reflect, per the rule that payload state stays off the host: a
 string is not a fact a selector needs. */
@@ -23596,6 +23595,13 @@ name is the fault `TreeItem` avoids by mirroring to `data-selected`.
 Splitting them means moving what every stylesheet selects on, which is a
 change of its own rather than a property being added. */
   "prop:defaultSelected"?: (HelixOption["defaultSelected"]) | undefined;
+  /** Whether the option says it is selected while the keyboard is on it.
+
+Written by a control whose list holds suggestions, such as `FilterInput`:
+nothing there stays chosen, so the row the keyboard is on is the
+selection, as the APG combobox's list with selection that follows focus
+says. No attribute: it is coordination between elements. */
+  "prop:selectionFollowsActive"?: (HelixOption["selectionFollowsActive"]) | undefined;
   /** The option was chosen. Cancelable: canceling it leaves the selection as it was, and keeps the browser from following an option's `href`. */
   "on:helix-select"?: ((e: HelixOptionHelixSelectElementEvent) => void) | undefined;
 
@@ -30959,6 +30965,9 @@ Independent of `tone` on purpose: an outlined danger tag and a solid danger
 tag are both sensible, and one property welding color to fill can ask for
 neither. That is the test the whole axis registry answers to. */
   emphasis?: (HelixTag["emphasis"]) | undefined;
+  /** The tag's outline. `pill` rounds its ends fully, for a set of tags among
+rounded controls. Absent is the theme's small radius. */
+  shape?: (HelixTag["shape"]) | undefined;
   /** The meaning the tag's color shows, such as `success` or `danger`.
 
 `tone` is semantic color, which is what these are and what `helix-text`
@@ -31007,6 +31016,13 @@ be selected or removed. */
 
 Absent is the tag's own words, its category first. */
   value?: (HelixTag["value"]) | undefined;
+  /** Whether the remove button is a tab stop of its own, outside a `Tag.Group`.
+
+A field that holds tags as its tokens, such as a `multiple` Combobox,
+writes `false`: the field's text is its one tab stop, and the arrow keys
+move from the text to the tags. No attribute: it is coordination between
+elements, as `focusable` is. */
+  dismissTabStop?: (HelixTag["dismissTabStop"]) | undefined;
   /** Whether the tag holds its group's tab stop.
 
 Written by `Tag.Group` on every tag it holds, and unset outside one, which
@@ -31038,6 +31054,9 @@ Independent of `tone` on purpose: an outlined danger tag and a solid danger
 tag are both sensible, and one property welding color to fill can ask for
 neither. That is the test the whole axis registry answers to. */
   "prop:emphasis"?: (HelixTag["emphasis"]) | undefined;
+  /** The tag's outline. `pill` rounds its ends fully, for a set of tags among
+rounded controls. Absent is the theme's small radius. */
+  "prop:shape"?: (HelixTag["shape"]) | undefined;
   /** The meaning the tag's color shows, such as `success` or `danger`.
 
 `tone` is semantic color, which is what these are and what `helix-text`
@@ -31086,6 +31105,13 @@ be selected or removed. */
 
 Absent is the tag's own words, its category first. */
   "prop:value"?: (HelixTag["value"]) | undefined;
+  /** Whether the remove button is a tab stop of its own, outside a `Tag.Group`.
+
+A field that holds tags as its tokens, such as a `multiple` Combobox,
+writes `false`: the field's text is its one tab stop, and the arrow keys
+move from the text to the tags. No attribute: it is coordination between
+elements, as `focusable` is. */
+  "prop:dismissTabStop"?: (HelixTag["dismissTabStop"]) | undefined;
   /** Whether the tag holds its group's tab stop.
 
 Written by `Tag.Group` on every tag it holds, and unset outside one, which
@@ -33668,8 +33694,8 @@ name is the fault `TreeItem` avoids by mirroring to `data-selected`.
 Splitting them means moving what every stylesheet selects on, which is a
 change of its own rather than a property being added. */
   defaultSelected?: (HelixToggle["defaultSelected"]) | undefined;
-  /** Whether the item holds the group's tab stop. Unset, the chosen item holds
-it.
+  /** Whether the item holds the group's tab stop. Unset, no group holds the
+item, and it is a toggle button with a tab stop of its own.
 
 Written by the group on every item: `true` for the chosen item, or for the
 first item that can be chosen while there is no selection to carry the
@@ -33684,6 +33710,8 @@ React consumer's hydration reports and does not patch up. */
 Written by the group, like `selected`, so no attribute. */
   pressed?: (HelixToggle["pressed"]) | undefined;
 
+  /** Fired after a toggle button on its own is pressed or released. */
+  onchange?: ((e: HelixToggleElementEvent) => void) | undefined;
   /** Fired when the item is chosen. Cancelable: call `preventDefault()` to keep the current choice. */
   "onhelix-select"?: ((e: HelixToggleHelixSelectElementEvent) => void) | undefined;
 };
@@ -33726,8 +33754,8 @@ name is the fault `TreeItem` avoids by mirroring to `data-selected`.
 Splitting them means moving what every stylesheet selects on, which is a
 change of its own rather than a property being added. */
   "prop:defaultSelected"?: (HelixToggle["defaultSelected"]) | undefined;
-  /** Whether the item holds the group's tab stop. Unset, the chosen item holds
-it.
+  /** Whether the item holds the group's tab stop. Unset, no group holds the
+item, and it is a toggle button with a tab stop of its own.
 
 Written by the group on every item: `true` for the chosen item, or for the
 first item that can be chosen while there is no selection to carry the
@@ -33741,6 +33769,8 @@ React consumer's hydration reports and does not patch up. */
 
 Written by the group, like `selected`, so no attribute. */
   "prop:pressed"?: (HelixToggle["pressed"]) | undefined;
+  /** Fired after a toggle button on its own is pressed or released. */
+  "on:change"?: ((e: HelixToggleElementEvent) => void) | undefined;
   /** Fired when the item is chosen. Cancelable: call `preventDefault()` to keep the current choice. */
   "on:helix-select"?: ((e: HelixToggleHelixSelectElementEvent) => void) | undefined;
 
@@ -41744,6 +41774,7 @@ export type CustomElements = {
    * - `end`: Content at the trailing end, before the trigger.
    * - `feedback`: The message that says what is wrong with the value.
    * - `hint`: Help text under the field.
+   * - `label`: The label, for content richer than the `label` text.
    * - `panel-footer`: Content in the panel under the picker, such as a note or an action.
    * - `panel-header`: Content in the panel above the picker, such as a heading or a shortcut.
    * - `start`: Content at the leading end of the field, inside its border.
@@ -43049,7 +43080,7 @@ export type CustomElements = {
    * Custom selectors for styling elements within the component.
    *
    * - `button`: The inner button.
-   * - `live`: The live region that says `pending-label` when the button becomes pending under focus. It is rendered from the first time the button is pending.
+   * - `live`: The live region that says `copied-label` or `error-label` after a press, and `pending-label` when the button becomes pending under focus. It is rendered from the first time it says anything.
    * - `mark`: The clipboard icon, and the confirmation icon that replaces it.
    * - `spinner`: The ring a pending button turns, an empty element the styled button draws over the icon. It is rendered only while the button is pending.
    * - `tooltip`: The tooltip bubble, forwarded from the tooltip inside the button.
@@ -43750,6 +43781,7 @@ export type CustomElements = {
    *
    * - `feedback`: The error message under the field.
    * - `hint`: The help text under the field.
+   * - `label`: The label, for content richer than the `label` text.
    * - `next-icon`: The icon on the calendar's next month control.
    * - `panel-footer`: Content in the panel under the calendar, such as a note or an action.
    * - `panel-header`: Content in the panel above the calendar, such as a heading or a shortcut.
@@ -53099,14 +53131,10 @@ export type CustomElements = {
    * ends. Matching still reads the label, so what somebody types is matched
    * against the name rather than against prose about it.
    *
-   * **A property and not a slot, which is the departure worth explaining.** The
-   * area rules say a content property is its slot's fallback, and that holds for
-   * a region always drawn: `Avatar`'s initials, `Tooltip`'s text. This one is
-   * usually absent, and a wrapped slot generates a box whether or not it is
-   * filled, so every option without a caption would carry an empty line. The
-   * detection that would avoid it does not exist, `:host(:has())` being invalid
-   * and the server having no children to inspect. A property is known at render
-   * time, so the component can decline to draw the box at all.
+   * For a caption richer than a string, slot it into `description`. The
+   * property is that slot's fallback inside the `description` part. With no
+   * property the slot is drawn bare, which takes no box while it is empty, so
+   * an option without a caption carries no empty line.
    *
    * It does not reflect, per the rule that payload state stays off the host: a
    * string is not a fact a selector needs.
@@ -53175,6 +53203,12 @@ export type CustomElements = {
    * name is the fault `TreeItem` avoids by mirroring to `data-selected`.
    * Splitting them means moving what every stylesheet selects on, which is a
    * change of its own rather than a property being added. (property only)
+   * - `selectionFollowsActive`: Whether the option says it is selected while the keyboard is on it.
+   *
+   * Written by a control whose list holds suggestions, such as `FilterInput`:
+   * nothing there stays chosen, so the row the keyboard is on is the
+   * selection, as the APG combobox's list with selection that follows focus
+   * says. No attribute: it is coordination between elements. (property only)
    * - `text`: The option's text, which a listbox matches typed text against.
    *
    * Read from the rendered content rather than required as a property, because
@@ -53247,7 +53281,9 @@ export type CustomElements = {
    * Areas where markup can be added to the component.
    *
    * - `(default)`: The option's label.
+   * - `description`: A second line under the label, for content richer than the `description` text.
    * - `end`: Content after the label, such as a shortcut or a count.
+   * - `indicator`: An icon shown while the option is chosen, in place of the check the styled option draws.
    * - `start`: Content before the label, such as an icon or an avatar.
    *
    * ## Methods
@@ -53284,6 +53320,8 @@ export type CustomElements = {
    * These can be used to apply styling when a component is in a given state.
    *
    * - `active`: While the keyboard is on the option, which is the option `aria-activedescendant` names.
+   * - `disabled`: While the option cannot be chosen.
+   * - `has-indicator`: An icon is slotted into `indicator`.
    * - `selected`: While the option is chosen.
    * - `settled`: Set one frame after the first render. Transitions wait for it, so an element does not animate its own arrival.
    */
@@ -54920,7 +54958,11 @@ export type CustomElements = {
    *
    * No attribute: it is coordination between elements, and a consumer has no
    * reason to set it. (property only)
-   * - `items`: The radios, in light-DOM order. Client only: the server has no tree. (property only) (readonly)
+   * - `items`: The radios, in light-DOM order. Client only: the server has no tree.
+   *
+   * Descendants, as `Checkbox.Group` reads its boxes, so a radio inside a
+   * layout wrapper of yours is one of the group's. A radio held by a group
+   * nested inside this one is that group's. (property only) (readonly)
    * - `validity`: Whether the control meets its constraints, and why not. (property only) (readonly)
    * - `validationMessage`: The message the browser would show for the control, or an empty string. (property only) (readonly)
    * - `willValidate`: Whether the control is checked when its form is submitted. (property only) (readonly)
@@ -59690,6 +59732,8 @@ export type CustomElements = {
    * Independent of `tone` on purpose: an outlined danger tag and a solid danger
    * tag are both sensible, and one property welding color to fill can ask for
    * neither. That is the test the whole axis registry answers to.
+   * - `shape`: The tag's outline. `pill` rounds its ends fully, for a set of tags among
+   * rounded controls. Absent is the theme's small radius.
    * - `tone`: The meaning the tag's color shows, such as `success` or `danger`.
    *
    * `tone` is semantic color, which is what these are and what `helix-text`
@@ -59721,6 +59765,12 @@ export type CustomElements = {
    * - `value`: What the tag stands for in its group's `value`.
    *
    * Absent is the tag's own words, its category first.
+   * - `dismissTabStop`: Whether the remove button is a tab stop of its own, outside a `Tag.Group`.
+   *
+   * A field that holds tags as its tokens, such as a `multiple` Combobox,
+   * writes `false`: the field's text is its one tab stop, and the arrow keys
+   * move from the text to the tags. No attribute: it is coordination between
+   * elements, as `focusable` is. (property only)
    * - `focusable`: Whether the tag holds its group's tab stop.
    *
    * Written by `Tag.Group` on every tag it holds, and unset outside one, which
@@ -60447,6 +60497,7 @@ export type CustomElements = {
    *
    * - `feedback`: The message that says what is wrong with the value.
    * - `hint`: Help under the field.
+   * - `label`: The label, for content richer than the `label` text.
    * - `panel-footer`: Content in the panel under the times, such as a note or an action.
    * - `panel-header`: Content in the panel above the times, such as a heading or a shortcut.
    * - `trigger`: The icon on the field that shows a list opens.
@@ -61735,8 +61786,8 @@ export type CustomElements = {
    * name is the fault `TreeItem` avoids by mirroring to `data-selected`.
    * Splitting them means moving what every stylesheet selects on, which is a
    * change of its own rather than a property being added. (property only)
-   * - `focusable`: Whether the item holds the group's tab stop. Unset, the chosen item holds
-   * it.
+   * - `focusable`: Whether the item holds the group's tab stop. Unset, no group holds the
+   * item, and it is a toggle button with a tab stop of its own.
    *
    * Written by the group on every item: `true` for the chosen item, or for the
    * first item that can be chosen while there is no selection to carry the
@@ -61773,6 +61824,7 @@ export type CustomElements = {
    *
    * Events that will be emitted by the component.
    *
+   * - `change`: Fired after a toggle button on its own is pressed or released.
    * - `helix-select`: Fired when the item is chosen. Cancelable: call `preventDefault()` to keep the current choice.
    *
    * ## Slots
@@ -69077,6 +69129,7 @@ export type CustomElementsSolidJs = {
    * - `end`: Content at the trailing end, before the trigger.
    * - `feedback`: The message that says what is wrong with the value.
    * - `hint`: Help text under the field.
+   * - `label`: The label, for content richer than the `label` text.
    * - `panel-footer`: Content in the panel under the picker, such as a note or an action.
    * - `panel-header`: Content in the panel above the picker, such as a heading or a shortcut.
    * - `start`: Content at the leading end of the field, inside its border.
@@ -70394,7 +70447,7 @@ export type CustomElementsSolidJs = {
    * Custom selectors for styling elements within the component.
    *
    * - `button`: The inner button.
-   * - `live`: The live region that says `pending-label` when the button becomes pending under focus. It is rendered from the first time the button is pending.
+   * - `live`: The live region that says `copied-label` or `error-label` after a press, and `pending-label` when the button becomes pending under focus. It is rendered from the first time it says anything.
    * - `mark`: The clipboard icon, and the confirmation icon that replaces it.
    * - `spinner`: The ring a pending button turns, an empty element the styled button draws over the icon. It is rendered only while the button is pending.
    * - `tooltip`: The tooltip bubble, forwarded from the tooltip inside the button.
@@ -71101,6 +71154,7 @@ export type CustomElementsSolidJs = {
    *
    * - `feedback`: The error message under the field.
    * - `hint`: The help text under the field.
+   * - `label`: The label, for content richer than the `label` text.
    * - `next-icon`: The icon on the calendar's next month control.
    * - `panel-footer`: Content in the panel under the calendar, such as a note or an action.
    * - `panel-header`: Content in the panel above the calendar, such as a heading or a shortcut.
@@ -80625,14 +80679,10 @@ export type CustomElementsSolidJs = {
    * ends. Matching still reads the label, so what somebody types is matched
    * against the name rather than against prose about it.
    *
-   * **A property and not a slot, which is the departure worth explaining.** The
-   * area rules say a content property is its slot's fallback, and that holds for
-   * a region always drawn: `Avatar`'s initials, `Tooltip`'s text. This one is
-   * usually absent, and a wrapped slot generates a box whether or not it is
-   * filled, so every option without a caption would carry an empty line. The
-   * detection that would avoid it does not exist, `:host(:has())` being invalid
-   * and the server having no children to inspect. A property is known at render
-   * time, so the component can decline to draw the box at all.
+   * For a caption richer than a string, slot it into `description`. The
+   * property is that slot's fallback inside the `description` part. With no
+   * property the slot is drawn bare, which takes no box while it is empty, so
+   * an option without a caption carries no empty line.
    *
    * It does not reflect, per the rule that payload state stays off the host: a
    * string is not a fact a selector needs.
@@ -80701,6 +80751,12 @@ export type CustomElementsSolidJs = {
    * name is the fault `TreeItem` avoids by mirroring to `data-selected`.
    * Splitting them means moving what every stylesheet selects on, which is a
    * change of its own rather than a property being added. (property only)
+   * - `selectionFollowsActive`: Whether the option says it is selected while the keyboard is on it.
+   *
+   * Written by a control whose list holds suggestions, such as `FilterInput`:
+   * nothing there stays chosen, so the row the keyboard is on is the
+   * selection, as the APG combobox's list with selection that follows focus
+   * says. No attribute: it is coordination between elements. (property only)
    * - `text`: The option's text, which a listbox matches typed text against.
    *
    * Read from the rendered content rather than required as a property, because
@@ -80773,7 +80829,9 @@ export type CustomElementsSolidJs = {
    * Areas where markup can be added to the component.
    *
    * - `(default)`: The option's label.
+   * - `description`: A second line under the label, for content richer than the `description` text.
    * - `end`: Content after the label, such as a shortcut or a count.
+   * - `indicator`: An icon shown while the option is chosen, in place of the check the styled option draws.
    * - `start`: Content before the label, such as an icon or an avatar.
    *
    * ## Methods
@@ -80810,6 +80868,8 @@ export type CustomElementsSolidJs = {
    * These can be used to apply styling when a component is in a given state.
    *
    * - `active`: While the keyboard is on the option, which is the option `aria-activedescendant` names.
+   * - `disabled`: While the option cannot be chosen.
+   * - `has-indicator`: An icon is slotted into `indicator`.
    * - `selected`: While the option is chosen.
    * - `settled`: Set one frame after the first render. Transitions wait for it, so an element does not animate its own arrival.
    */
@@ -82483,7 +82543,11 @@ export type CustomElementsSolidJs = {
    *
    * No attribute: it is coordination between elements, and a consumer has no
    * reason to set it. (property only)
-   * - `items`: The radios, in light-DOM order. Client only: the server has no tree. (property only) (readonly)
+   * - `items`: The radios, in light-DOM order. Client only: the server has no tree.
+   *
+   * Descendants, as `Checkbox.Group` reads its boxes, so a radio inside a
+   * layout wrapper of yours is one of the group's. A radio held by a group
+   * nested inside this one is that group's. (property only) (readonly)
    * - `validity`: Whether the control meets its constraints, and why not. (property only) (readonly)
    * - `validationMessage`: The message the browser would show for the control, or an empty string. (property only) (readonly)
    * - `willValidate`: Whether the control is checked when its form is submitted. (property only) (readonly)
@@ -87354,6 +87418,8 @@ export type CustomElementsSolidJs = {
    * Independent of `tone` on purpose: an outlined danger tag and a solid danger
    * tag are both sensible, and one property welding color to fill can ask for
    * neither. That is the test the whole axis registry answers to.
+   * - `shape`: The tag's outline. `pill` rounds its ends fully, for a set of tags among
+   * rounded controls. Absent is the theme's small radius.
    * - `tone`: The meaning the tag's color shows, such as `success` or `danger`.
    *
    * `tone` is semantic color, which is what these are and what `helix-text`
@@ -87385,6 +87451,12 @@ export type CustomElementsSolidJs = {
    * - `value`: What the tag stands for in its group's `value`.
    *
    * Absent is the tag's own words, its category first.
+   * - `dismissTabStop`: Whether the remove button is a tab stop of its own, outside a `Tag.Group`.
+   *
+   * A field that holds tags as its tokens, such as a `multiple` Combobox,
+   * writes `false`: the field's text is its one tab stop, and the arrow keys
+   * move from the text to the tags. No attribute: it is coordination between
+   * elements, as `focusable` is. (property only)
    * - `focusable`: Whether the tag holds its group's tab stop.
    *
    * Written by `Tag.Group` on every tag it holds, and unset outside one, which
@@ -88118,6 +88190,7 @@ export type CustomElementsSolidJs = {
    *
    * - `feedback`: The message that says what is wrong with the value.
    * - `hint`: Help under the field.
+   * - `label`: The label, for content richer than the `label` text.
    * - `panel-footer`: Content in the panel under the times, such as a note or an action.
    * - `panel-header`: Content in the panel above the times, such as a heading or a shortcut.
    * - `trigger`: The icon on the field that shows a list opens.
@@ -89432,8 +89505,8 @@ export type CustomElementsSolidJs = {
    * name is the fault `TreeItem` avoids by mirroring to `data-selected`.
    * Splitting them means moving what every stylesheet selects on, which is a
    * change of its own rather than a property being added. (property only)
-   * - `focusable`: Whether the item holds the group's tab stop. Unset, the chosen item holds
-   * it.
+   * - `focusable`: Whether the item holds the group's tab stop. Unset, no group holds the
+   * item, and it is a toggle button with a tab stop of its own.
    *
    * Written by the group on every item: `true` for the chosen item, or for the
    * first item that can be chosen while there is no selection to carry the
@@ -89470,6 +89543,7 @@ export type CustomElementsSolidJs = {
    *
    * Events that will be emitted by the component.
    *
+   * - `change`: Fired after a toggle button on its own is pressed or released.
    * - `helix-select`: Fired when the item is chosen. Cancelable: call `preventDefault()` to keep the current choice.
    *
    * ## Slots

package/types/vue.d.ts

@@ -11990,14 +11990,10 @@ between them makes a reader parse the punctuation to find where the name
 ends. Matching still reads the label, so what somebody types is matched
 against the name rather than against prose about it.
 
-**A property and not a slot, which is the departure worth explaining.** The
-area rules say a content property is its slot's fallback, and that holds for
-a region always drawn: `Avatar`'s initials, `Tooltip`'s text. This one is
-usually absent, and a wrapped slot generates a box whether or not it is
-filled, so every option without a caption would carry an empty line. The
-detection that would avoid it does not exist, `:host(:has())` being invalid
-and the server having no children to inspect. A property is known at render
-time, so the component can decline to draw the box at all.
+For a caption richer than a string, slot it into `description`. The
+property is that slot's fallback inside the `description` part. With no
+property the slot is drawn bare, which takes no box while it is empty, so
+an option without a caption carries no empty line.
 
 It does not reflect, per the rule that payload state stays off the host: a
 string is not a fact a selector needs. */
@@ -12085,6 +12081,13 @@ name is the fault `TreeItem` avoids by mirroring to `data-selected`.
 Splitting them means moving what every stylesheet selects on, which is a
 change of its own rather than a property being added. */
   defaultSelected?: (HelixOption["defaultSelected"]) | undefined;
+  /** Whether the option says it is selected while the keyboard is on it.
+
+Written by a control whose list holds suggestions, such as `FilterInput`:
+nothing there stays chosen, so the row the keyboard is on is the
+selection, as the APG combobox's list with selection that follows focus
+says. No attribute: it is coordination between elements. */
+  selectionFollowsActive?: (HelixOption["selectionFollowsActive"]) | undefined;
 };
 
 export type HelixOptionVueEvents = {
@@ -15870,6 +15873,9 @@ Independent of `tone` on purpose: an outlined danger tag and a solid danger
 tag are both sensible, and one property welding color to fill can ask for
 neither. That is the test the whole axis registry answers to. */
   emphasis?: (HelixTag["emphasis"]) | undefined;
+  /** The tag's outline. `pill` rounds its ends fully, for a set of tags among
+rounded controls. Absent is the theme's small radius. */
+  shape?: (HelixTag["shape"]) | undefined;
   /** The meaning the tag's color shows, such as `success` or `danger`.
 
 `tone` is semantic color, which is what these are and what `helix-text`
@@ -15918,6 +15924,13 @@ be selected or removed. */
 
 Absent is the tag's own words, its category first. */
   value?: (HelixTag["value"]) | undefined;
+  /** Whether the remove button is a tab stop of its own, outside a `Tag.Group`.
+
+A field that holds tags as its tokens, such as a `multiple` Combobox,
+writes `false`: the field's text is its one tab stop, and the arrow keys
+move from the text to the tags. No attribute: it is coordination between
+elements, as `focusable` is. */
+  dismissTabStop?: (HelixTag["dismissTabStop"]) | undefined;
   /** Whether the tag holds its group's tab stop.
 
 Written by `Tag.Group` on every tag it holds, and unset outside one, which
@@ -17251,8 +17264,8 @@ name is the fault `TreeItem` avoids by mirroring to `data-selected`.
 Splitting them means moving what every stylesheet selects on, which is a
 change of its own rather than a property being added. */
   defaultSelected?: (HelixToggle["defaultSelected"]) | undefined;
-  /** Whether the item holds the group's tab stop. Unset, the chosen item holds
-it.
+  /** Whether the item holds the group's tab stop. Unset, no group holds the
+item, and it is a toggle button with a tab stop of its own.
 
 Written by the group on every item: `true` for the chosen item, or for the
 first item that can be chosen while there is no selection to carry the
@@ -17269,6 +17282,8 @@ Written by the group, like `selected`, so no attribute. */
 };
 
 export type HelixToggleVueEvents = {
+  /** Fired after a toggle button on its own is pressed or released. */
+  change: HelixToggleElementEvent;
   /** Fired when the item is chosen. Cancelable: call `preventDefault()` to keep the current choice. */
   "helix-select": HelixToggleHelixSelectElementEvent;
 };