@fusion.dev/helix 0.157.0 → 0.158.0

package/custom-elements.json

@@ -1859,7 +1859,7 @@
                   "text": "HTMLElement | undefined"
                 }
               },
-              "description": "The tab stop after this element on the page, or the one before it at the\nend, for a lone element whose removal would drop focus to the body.\n\n**A lone Callout or Announcement had nowhere to hand focus**, so a\nkeyboard reader who dismissed one started again from the top of the\npage. React Aria's Toast hands focus on the same way. Read before the\nevent, in the order Tab reaches the stops, while this element's own are\nstill among them.",
+              "description": "The tab stop after this element on the page, or the one before it at the\nend, for an element whose removal would drop focus to the body because\nno neighbor of its kind has a control to take it.\n\n**A lone Callout or Announcement had nowhere to hand focus**, so a\nkeyboard reader who dismissed one started again from the top of the\npage. React Aria's Toast hands focus on the same way. Read before the\nevent, in the order Tab reaches the stops, while this element's own are\nstill among them.",
               "inheritedFrom": {
                 "name": "MixinDismissible",
                 "module": "src/mixins/mixin-dismissible/mixin-dismissible.ts"
@@ -17137,7 +17137,7 @@
                   "text": "HTMLElement | undefined"
                 }
               },
-              "description": "The tab stop after this element on the page, or the one before it at the\nend, for a lone element whose removal would drop focus to the body.\n\n**A lone Callout or Announcement had nowhere to hand focus**, so a\nkeyboard reader who dismissed one started again from the top of the\npage. React Aria's Toast hands focus on the same way. Read before the\nevent, in the order Tab reaches the stops, while this element's own are\nstill among them.",
+              "description": "The tab stop after this element on the page, or the one before it at the\nend, for an element whose removal would drop focus to the body because\nno neighbor of its kind has a control to take it.\n\n**A lone Callout or Announcement had nowhere to hand focus**, so a\nkeyboard reader who dismissed one started again from the top of the\npage. React Aria's Toast hands focus on the same way. Read before the\nevent, in the order Tab reaches the stops, while this element's own are\nstill among them.",
               "inheritedFrom": {
                 "name": "MixinDismissible",
                 "module": "src/mixins/mixin-dismissible/mixin-dismissible.ts"
@@ -50134,6 +50134,18 @@
                 "module": "src/command/root/command-root.ts"
               }
             },
+            {
+              "kind": "field",
+              "name": "filterMatch",
+              "type": {
+                "text": "((text: string, filter: string) => boolean) | undefined | undefined"
+              },
+              "description": "Whether a command is kept by the filter: a function given the command's\nwords and the filter, trimmed, that returns `true` to keep it showing, as\nReact Aria's `Autocomplete` takes `filter`. See Listbox's `filterMatch`.\n\nAbsent, a command is kept where its words hold the filter, in any case. A\nproperty only, there being no way to write a function in markup.",
+              "inheritedFrom": {
+                "name": "HelixHeadlessCommand",
+                "module": "src/command/root/command-root.ts"
+              }
+            },
             {
               "kind": "field",
               "name": "hotkey",
@@ -50419,6 +50431,18 @@
                 "module": "src/command/root/command-root.ts"
               }
             },
+            {
+              "kind": "field",
+              "name": "status",
+              "privacy": "private",
+              "readonly": true,
+              "default": "new StatusController(this)",
+              "description": "The region the page shown is said from as it changes.",
+              "inheritedFrom": {
+                "name": "HelixHeadlessCommand",
+                "module": "src/command/root/command-root.ts"
+              }
+            },
             {
               "kind": "field",
               "name": "handleBack",
@@ -51442,6 +51466,14 @@
                 "name": "HelixHeadlessCommand",
                 "module": "src/command/root/command-root.ts"
               }
+            },
+            {
+              "description": "The region a screen reader announces the page shown from, by the words of the command that opens it, drawn once there is one to say. Visually hidden in the styled tier.",
+              "name": "live",
+              "inheritedFrom": {
+                "name": "HelixHeadlessCommand",
+                "module": "src/command/root/command-root.ts"
+              }
             }
           ],
           "cssStates": [
@@ -56822,6 +56854,13 @@
                   "type": {
                     "text": "boolean"
                   }
+                },
+                {
+                  "name": "id",
+                  "optional": true,
+                  "type": {
+                    "text": "string"
+                  }
                 }
               ],
               "description": "One cell, carrying its column's edge as a fact rather than as a decision.\n\n**A fact published rather than a property chosen**, which is what `Table`\ndoes with the same attribute: what lining up *means*, a `justify-content`\nfor a value that fits or a `text-align` for one that wraps, belongs to\nwhoever draws the cell. Written here as an inline `text-align` it was this\ntier choosing, in the tier that ships no CSS, and a consumer could not\noverrule it either, an inline declaration beating any `::part(cell)` rule\nthey wrote.\n\nOnly the three edges reach it, `text-align` being a string anybody can write and\nthis being a style attribute: `edgeOf` is that guard, and `Table` holds the\nsame value to the same three.",
@@ -79392,7 +79431,7 @@
                   "text": "HTMLElement | undefined"
                 }
               },
-              "description": "The tab stop after this element on the page, or the one before it at the\nend, for a lone element whose removal would drop focus to the body.\n\n**A lone Callout or Announcement had nowhere to hand focus**, so a\nkeyboard reader who dismissed one started again from the top of the\npage. React Aria's Toast hands focus on the same way. Read before the\nevent, in the order Tab reaches the stops, while this element's own are\nstill among them.",
+              "description": "The tab stop after this element on the page, or the one before it at the\nend, for an element whose removal would drop focus to the body because\nno neighbor of its kind has a control to take it.\n\n**A lone Callout or Announcement had nowhere to hand focus**, so a\nkeyboard reader who dismissed one started again from the top of the\npage. React Aria's Toast hands focus on the same way. Read before the\nevent, in the order Tab reaches the stops, while this element's own are\nstill among them.",
               "inheritedFrom": {
                 "name": "MixinDismissible",
                 "module": "src/mixins/mixin-dismissible/mixin-dismissible.ts"
@@ -107951,7 +107990,7 @@
                 "text": "boolean"
               },
               "default": "false",
-              "description": "Takes the row out of reach in a list with `selection-mode`: the arrow keys\npass over it and it cannot be selected or acted on.",
+              "description": "Takes the row out of reach in a list with `selection-mode`: the arrow keys\npass over it and it cannot be selected or acted on. In a list with\n`disabled-behavior=\"selection\"`, it cannot be selected and is reached and\nacted on as any row is.",
               "attribute": "disabled",
               "reflects": true,
               "inheritedFrom": {
@@ -108035,6 +108074,19 @@
                 "module": "src/list/item/list-item.ts"
               }
             },
+            {
+              "kind": "field",
+              "name": "selectionOnly",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "Whether `disabled` takes the row out of selection alone, written by a list\nwith `disabled-behavior=\"selection\"`. No attribute: it is coordination\nbetween elements, as `focusable` is.",
+              "inheritedFrom": {
+                "name": "HelixHeadlessListItem",
+                "module": "src/list/item/list-item.ts"
+              }
+            },
             {
               "kind": "field",
               "name": "target",
@@ -108104,6 +108156,17 @@
                 "module": "src/list/item/list-item.ts"
               }
             },
+            {
+              "kind": "field",
+              "name": "handleCellFocus",
+              "privacy": "private",
+              "readonly": true,
+              "description": "Says whether the cell shows keyboard focus, as `:focus-visible` does, so a\nsheet outside can draw the ring on the row by the host.",
+              "inheritedFrom": {
+                "name": "HelixHeadlessListItem",
+                "module": "src/list/item/list-item.ts"
+              }
+            },
             {
               "kind": "method",
               "name": "focusItem",
@@ -108548,7 +108611,7 @@
                 "text": "boolean"
               },
               "default": "false",
-              "description": "Takes the row out of reach in a list with `selection-mode`: the arrow keys\npass over it and it cannot be selected or acted on.",
+              "description": "Takes the row out of reach in a list with `selection-mode`: the arrow keys\npass over it and it cannot be selected or acted on. In a list with\n`disabled-behavior=\"selection\"`, it cannot be selected and is reached and\nacted on as any row is.",
               "fieldName": "disabled",
               "inheritedFrom": {
                 "name": "HelixHeadlessListItem",
@@ -108647,6 +108710,14 @@
                 "module": "src/list/item/list-item.ts"
               }
             },
+            {
+              "description": "The row's cell has keyboard focus that the browser shows, in a list with `selection-mode`.",
+              "name": "focus-visible",
+              "inheritedFrom": {
+                "name": "HelixHeadlessListItem",
+                "module": "src/list/item/list-item.ts"
+              }
+            },
             {
               "description": "The row is selected, in a list that selects.",
               "name": "selected",
@@ -108842,6 +108913,19 @@
                 "module": "src/list/root/list-root.ts"
               }
             },
+            {
+              "kind": "field",
+              "name": "disabledBehavior",
+              "type": {
+                "text": "'all' | 'selection' | undefined | undefined"
+              },
+              "description": "What `disabled` takes from a row, in a list that selects: `all`, which\npasses over the row, or `selection`, which keeps the row out of the\nselection and lets the keys reach it and Enter or a press act on it, as\nReact Aria's GridList takes `disabledBehavior`.\n\nAbsent is `all`.",
+              "attribute": "disabled-behavior",
+              "inheritedFrom": {
+                "name": "HelixHeadlessList",
+                "module": "src/list/root/list-root.ts"
+              }
+            },
             {
               "kind": "field",
               "name": "droppedLabel",
@@ -109039,6 +109123,43 @@
                 "module": "src/list/root/list-root.ts"
               }
             },
+            {
+              "kind": "method",
+              "name": "blocked",
+              "privacy": "private",
+              "return": {
+                "type": {
+                  "text": "boolean"
+                }
+              },
+              "parameters": [
+                {
+                  "name": "row",
+                  "type": {
+                    "text": "HelixHeadlessListItem"
+                  }
+                }
+              ],
+              "description": "Whether the row is out of reach of the keys and of actions, past selection.",
+              "inheritedFrom": {
+                "name": "HelixHeadlessList",
+                "module": "src/list/root/list-root.ts"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "selectable",
+              "type": {
+                "text": "HelixHeadlessListItem[]"
+              },
+              "privacy": "private",
+              "description": "The rows a key can land on that can also be selected.",
+              "readonly": true,
+              "inheritedFrom": {
+                "name": "HelixHeadlessList",
+                "module": "src/list/root/list-root.ts"
+              }
+            },
             {
               "kind": "field",
               "name": "selectionMode",
@@ -109106,6 +109227,20 @@
                 "module": "src/list/root/list-root.ts"
               }
             },
+            {
+              "kind": "field",
+              "name": "placed",
+              "type": {
+                "text": "HelixHeadlessListItem[]"
+              },
+              "privacy": "private",
+              "default": "[]",
+              "description": "The rows in order on the last `sync`, so a removed row's place is known.",
+              "inheritedFrom": {
+                "name": "HelixHeadlessList",
+                "module": "src/list/root/list-root.ts"
+              }
+            },
             {
               "kind": "field",
               "name": "anchor",
@@ -109373,6 +109508,29 @@
                 "module": "src/list/root/list-root.ts"
               }
             },
+            {
+              "kind": "method",
+              "name": "followRemoved",
+              "privacy": "private",
+              "return": {
+                "type": {
+                  "text": "void"
+                }
+              },
+              "parameters": [
+                {
+                  "name": "rows",
+                  "type": {
+                    "text": "HelixHeadlessListItem[]"
+                  }
+                }
+              ],
+              "description": "Moves the tab stop off a row the page removed, to the next row a key can\nreach or, at the end, the one before it, and moves focus there where\nremoving the row dropped it to the body.\n\n**Focus went to the body**, and the arrow keys did nothing until the\nreader tabbed back into the list. React Aria's GridList moves focus to a\nneighbor the same way. Focus anywhere but the body is where you put it,\nand is left there.",
+              "inheritedFrom": {
+                "name": "HelixHeadlessList",
+                "module": "src/list/root/list-root.ts"
+              }
+            },
             {
               "kind": "method",
               "name": "rowOf",
@@ -110160,6 +110318,18 @@
                 "module": "src/list/root/list-root.ts"
               }
             },
+            {
+              "name": "disabled-behavior",
+              "type": {
+                "text": "'all' | 'selection' | undefined | undefined"
+              },
+              "description": "What `disabled` takes from a row, in a list that selects: `all`, which\npasses over the row, or `selection`, which keeps the row out of the\nselection and lets the keys reach it and Enter or a press act on it, as\nReact Aria's GridList takes `disabledBehavior`.\n\nAbsent is `all`.",
+              "fieldName": "disabledBehavior",
+              "inheritedFrom": {
+                "name": "HelixHeadlessList",
+                "module": "src/list/root/list-root.ts"
+              }
+            },
             {
               "name": "dropped-label",
               "type": {
@@ -111648,6 +111818,18 @@
                 "module": "src/listbox/root/listbox-root.ts"
               }
             },
+            {
+              "kind": "field",
+              "name": "filterMatch",
+              "type": {
+                "text": "((text: string, filter: string) => boolean) | undefined | undefined"
+              },
+              "description": "Whether an option is kept by the filter: a function given the option's\nwords and the filter, trimmed, that returns `true` to keep it showing, as\nReact Aria's `Autocomplete` takes `filter`. For matching that ignores\naccents, matches the start of each word, or matches out of order.\n\nAbsent, an option is kept where its words hold the filter, in any case. A\nproperty only, there being no way to write a function in markup.",
+              "inheritedFrom": {
+                "name": "HelixHeadlessListbox",
+                "module": "src/listbox/root/listbox-root.ts"
+              }
+            },
             {
               "kind": "field",
               "name": "items",
@@ -112111,7 +112293,7 @@
               "type": {
                 "text": "string[]"
               },
-              "description": "The chosen values, as an array whether or not `multiple` is set.",
+              "description": "The chosen values, as an array whether or not `multiple` is set.\n\nRead against the options' values, so an option whose value holds a comma\nis one value. See `chosenValues`.",
               "readonly": true,
               "inheritedFrom": {
                 "name": "HelixHeadlessListbox",
@@ -122736,7 +122918,7 @@
               "name": "handlePartChange",
               "privacy": "private",
               "readonly": true,
-              "description": "A route or area renamed, or its description changed, which the list says\nand a slot change does not report.",
+              "description": "A route or area renamed, or its description changed, which the list says\nand a slot change does not report.\n\nNot the map's own `gestures` news, which it sends from `updated` and which\nchanges nothing it draws: an update asked for there ran every map's\nupdate twice, and Lit's development build warned about it.",
               "inheritedFrom": {
                 "name": "HelixHeadlessMap",
                 "module": "src/map/root/map-root.ts"
@@ -129713,7 +129895,7 @@
               "name": "panel",
               "privacy": "private",
               "readonly": true,
-              "default": "new PopoverController(this, { anchor: () => this.context && this.point ? this.renderRoot?.querySelector<HTMLElement>('#point') : this.trigger, // The host is `display: contents`, so it has no box a press can land in. // What counts as inside is the surface, plus the trigger, whose own click // handler decides what a press there means. boundary: () => this, offset: () => this.offset, onDismiss: () => this.hide(), open: () => this.open, placement: () => this.placement, surface: () => this.partNamed('surface'), })",
+              "default": "new PopoverController(this, { anchor: () => this.context && this.point ? this.renderRoot?.querySelector<HTMLElement>('#point') : this.trigger, // The host is `display: contents`, so it has no box a press can land in. // What counts as inside is the surface, plus the trigger, whose own click // handler decides what a press there means. boundary: () => this, offset: () => this.offset, onDismiss: () => this.hide(), /* The side the panel landed on, for a sheet outside that draws by side, as Popover says it. */ onPlace: (placement) => { const side = sideOf(placement) this.toggleState('placed-bottom', side === 'bottom') this.toggleState('placed-left', side === 'left') this.toggleState('placed-right', side === 'right') this.toggleState('placed-top', side === 'top') }, open: () => this.open, placement: () => this.placement, surface: () => this.partNamed('surface'), })",
               "inheritedFrom": {
                 "name": "HelixHeadlessMenu",
                 "module": "src/menu/root/menu-root.ts"
@@ -130988,6 +131170,38 @@
                 "module": "src/menu/root/menu-root.ts"
               }
             },
+            {
+              "description": "While the open panel sits below its trigger.",
+              "name": "placed-bottom",
+              "inheritedFrom": {
+                "name": "HelixHeadlessMenu",
+                "module": "src/menu/root/menu-root.ts"
+              }
+            },
+            {
+              "description": "While the open panel sits to the left of its trigger.",
+              "name": "placed-left",
+              "inheritedFrom": {
+                "name": "HelixHeadlessMenu",
+                "module": "src/menu/root/menu-root.ts"
+              }
+            },
+            {
+              "description": "While the open panel sits to the right of its trigger.",
+              "name": "placed-right",
+              "inheritedFrom": {
+                "name": "HelixHeadlessMenu",
+                "module": "src/menu/root/menu-root.ts"
+              }
+            },
+            {
+              "description": "While the open panel sits above its trigger.",
+              "name": "placed-top",
+              "inheritedFrom": {
+                "name": "HelixHeadlessMenu",
+                "module": "src/menu/root/menu-root.ts"
+              }
+            },
             {
               "description": "A row on the current page has content in its leading column, so every row keeps that column.",
               "name": "start",
@@ -135004,7 +135218,7 @@
                   "text": "HTMLElement | undefined"
                 }
               },
-              "description": "The tab stop after this element on the page, or the one before it at the\nend, for a lone element whose removal would drop focus to the body.\n\n**A lone Callout or Announcement had nowhere to hand focus**, so a\nkeyboard reader who dismissed one started again from the top of the\npage. React Aria's Toast hands focus on the same way. Read before the\nevent, in the order Tab reaches the stops, while this element's own are\nstill among them.",
+              "description": "The tab stop after this element on the page, or the one before it at the\nend, for an element whose removal would drop focus to the body because\nno neighbor of its kind has a control to take it.\n\n**A lone Callout or Announcement had nowhere to hand focus**, so a\nkeyboard reader who dismissed one started again from the top of the\npage. React Aria's Toast hands focus on the same way. Read before the\nevent, in the order Tab reaches the stops, while this element's own are\nstill among them.",
               "inheritedFrom": {
                 "name": "MixinDismissible",
                 "module": "src/mixins/mixin-dismissible/mixin-dismissible.ts"
@@ -139075,7 +139289,7 @@
               "type": {
                 "text": "number"
               },
-              "description": "The value as a number, or `NaN` while the control is empty.\n\n`NaN` and not zero, which is the trap the platform already avoids: `Number('')`\nis zero, so an empty control would report a number it does not hold and a\nform would submit it.",
+              "description": "The value as a number, or `NaN` while the control is empty or does not\nhold a number.\n\nRead in the locale and the format, as the form reads it, so `1,5` typed\nin a locale with a decimal comma is 1.5 here while the form holds 1.5.\n`NaN` and not zero, which is the trap the platform already avoids: `Number('')`\nis zero, so an empty control would report a number it does not hold and a\nform would submit it.",
               "inheritedFrom": {
                 "name": "HelixHeadlessNumberInput",
                 "module": "src/number-input/root/number-input-root.ts"
@@ -170910,6 +171124,20 @@
                 "module": "src/select/root/select-root.ts"
               }
             },
+            {
+              "kind": "field",
+              "name": "chosen",
+              "type": {
+                "text": "string[]"
+              },
+              "privacy": "private",
+              "description": "The chosen values, read against the options' values, so an option whose\nvalue holds a comma is one value. See `chosenValues`.",
+              "readonly": true,
+              "inheritedFrom": {
+                "name": "HelixHeadlessSelect",
+                "module": "src/select/root/select-root.ts"
+              }
+            },
             {
               "kind": "field",
               "name": "data",
@@ -173309,7 +173537,7 @@
                 "text": "string"
               },
               "default": "''",
-              "description": "What is loading, read out as the placeholder's name, such as \"Loading\nprofile\".\n\nAbsent hides the placeholder from screen readers.",
+              "description": "What is loading, read out as the placeholder's name, such as \"Loading\nprofile\".\n\nAbsent hides the placeholder from screen readers. Around content, the name\nis read while `loading` is set, and the loaded content is read as it is.",
               "attribute": "label",
               "inheritedFrom": {
                 "name": "HelixHeadlessSkeleton",
@@ -173716,7 +173944,7 @@
                 "text": "string"
               },
               "default": "''",
-              "description": "What is loading, read out as the placeholder's name, such as \"Loading\nprofile\".\n\nAbsent hides the placeholder from screen readers.",
+              "description": "What is loading, read out as the placeholder's name, such as \"Loading\nprofile\".\n\nAbsent hides the placeholder from screen readers. Around content, the name\nis read while `loading` is set, and the loaded content is read as it is.",
               "fieldName": "label",
               "inheritedFrom": {
                 "name": "HelixHeadlessSkeleton",
@@ -195411,7 +195639,7 @@
                   "text": "HTMLElement | undefined"
                 }
               },
-              "description": "The tab stop after this element on the page, or the one before it at the\nend, for a lone element whose removal would drop focus to the body.\n\n**A lone Callout or Announcement had nowhere to hand focus**, so a\nkeyboard reader who dismissed one started again from the top of the\npage. React Aria's Toast hands focus on the same way. Read before the\nevent, in the order Tab reaches the stops, while this element's own are\nstill among them.",
+              "description": "The tab stop after this element on the page, or the one before it at the\nend, for an element whose removal would drop focus to the body because\nno neighbor of its kind has a control to take it.\n\n**A lone Callout or Announcement had nowhere to hand focus**, so a\nkeyboard reader who dismissed one started again from the top of the\npage. React Aria's Toast hands focus on the same way. Read before the\nevent, in the order Tab reaches the stops, while this element's own are\nstill among them.",
               "inheritedFrom": {
                 "name": "MixinDismissible",
                 "module": "src/mixins/mixin-dismissible/mixin-dismissible.ts"
@@ -197568,7 +197796,7 @@
                   "text": "HTMLElement | undefined"
                 }
               },
-              "description": "The tab stop after this element on the page, or the one before it at the\nend, for a lone element whose removal would drop focus to the body.\n\n**A lone Callout or Announcement had nowhere to hand focus**, so a\nkeyboard reader who dismissed one started again from the top of the\npage. React Aria's Toast hands focus on the same way. Read before the\nevent, in the order Tab reaches the stops, while this element's own are\nstill among them.",
+              "description": "The tab stop after this element on the page, or the one before it at the\nend, for an element whose removal would drop focus to the body because\nno neighbor of its kind has a control to take it.\n\n**A lone Callout or Announcement had nowhere to hand focus**, so a\nkeyboard reader who dismissed one started again from the top of the\npage. React Aria's Toast hands focus on the same way. Read before the\nevent, in the order Tab reaches the stops, while this element's own are\nstill among them.",
               "inheritedFrom": {
                 "name": "MixinDismissible",
                 "module": "src/mixins/mixin-dismissible/mixin-dismissible.ts"
@@ -210720,7 +210948,7 @@
                   "text": "HTMLElement | undefined"
                 }
               },
-              "description": "The tab stop after this element on the page, or the one before it at the\nend, for a lone element whose removal would drop focus to the body.\n\n**A lone Callout or Announcement had nowhere to hand focus**, so a\nkeyboard reader who dismissed one started again from the top of the\npage. React Aria's Toast hands focus on the same way. Read before the\nevent, in the order Tab reaches the stops, while this element's own are\nstill among them.",
+              "description": "The tab stop after this element on the page, or the one before it at the\nend, for an element whose removal would drop focus to the body because\nno neighbor of its kind has a control to take it.\n\n**A lone Callout or Announcement had nowhere to hand focus**, so a\nkeyboard reader who dismissed one started again from the top of the\npage. React Aria's Toast hands focus on the same way. Read before the\nevent, in the order Tab reaches the stops, while this element's own are\nstill among them.",
               "inheritedFrom": {
                 "name": "MixinDismissible",
                 "module": "src/mixins/mixin-dismissible/mixin-dismissible.ts"
@@ -233673,6 +233901,6 @@
   ],
   "helix": {
     "package": "@fusion.dev/helix",
-    "version": "0.157.0"
+    "version": "0.158.0"
   }
 }

package/dist/command/root/command-root.js

@@ -8,10 +8,11 @@ import { customElement } from '@fusion.dev/helix-core';
 import { HelixHeadlessCommand } from '@fusion.dev/helix-headless/command';
 import '../../dialog/index.js';
 import '../../listbox/index.js';
+import { styles as liveStyles } from '../../shared/live/live.css.js';
 import { styles } from './command-root.css.js';
 let HelixCommand = class HelixCommand extends HelixHeadlessCommand {
     static { this.tier = 'helix-'; }
-    static { this.styles = styles; }
+    static { this.styles = [liveStyles, styles]; }
 };
 HelixCommand = __decorate([
     customElement('helix-command')