@brandsync/wc 0.1.0 → 1.1.0

package/custom-elements.json

@@ -80,7 +80,6 @@
                 "text": "string"
               },
               "default": "'Genie'",
-              "readonly": true,
               "attribute": "assistant-name"
             },
             {
@@ -90,7 +89,6 @@
               "type": {
                 "text": "string"
               },
-              "readonly": true,
               "attribute": "product-name"
             }
           ],
@@ -153,7 +151,6 @@
                 "text": "string"
               },
               "default": "'Thinking'",
-              "readonly": true,
               "attribute": "label"
             }
           ],
@@ -265,7 +262,6 @@
                 "text": "string"
               },
               "default": "'Attachment'",
-              "readonly": true,
               "attribute": "file-name"
             },
             {
@@ -276,7 +272,6 @@
                 "text": "string"
               },
               "default": "''",
-              "readonly": true,
               "attribute": "image-alt"
             },
             {
@@ -286,7 +281,6 @@
               "type": {
                 "text": "string"
               },
-              "readonly": true,
               "attribute": "image-src"
             },
             {
@@ -297,7 +291,6 @@
                 "text": "boolean"
               },
               "default": "false",
-              "readonly": true,
               "attribute": "loading"
             },
             {
@@ -308,7 +301,6 @@
                 "text": "boolean"
               },
               "default": "true",
-              "readonly": true,
               "attribute": "removable"
             },
             {
@@ -324,7 +316,6 @@
                 ]
               },
               "default": "'image'",
-              "readonly": true,
               "attribute": "type"
             }
           ],
@@ -408,7 +399,6 @@
                 "text": "string"
               },
               "default": "'Attachments'",
-              "readonly": true,
               "attribute": "aria-label"
             }
           ],
@@ -541,7 +531,6 @@
                 "text": "string"
               },
               "default": "null",
-              "readonly": true,
               "attribute": "alt"
             },
             {
@@ -552,7 +541,6 @@
                 "text": "string"
               },
               "default": "null",
-              "readonly": true,
               "attribute": "aria-label"
             },
             {
@@ -563,7 +551,6 @@
                 "text": "boolean"
               },
               "default": "false",
-              "readonly": true,
               "attribute": "disabled",
               "reflects": true
             },
@@ -575,7 +562,6 @@
                 "text": "string"
               },
               "default": "null",
-              "readonly": true,
               "attribute": "initials"
             },
             {
@@ -591,7 +577,6 @@
                 ]
               },
               "default": "'md'",
-              "readonly": true,
               "attribute": "size"
             },
             {
@@ -602,7 +587,6 @@
                 "text": "string"
               },
               "default": "null",
-              "readonly": true,
               "attribute": "src"
             },
             {
@@ -618,7 +602,6 @@
                 ]
               },
               "default": "'icon'",
-              "readonly": true,
               "attribute": "type"
             }
           ],
@@ -781,7 +764,6 @@
                 ]
               },
               "default": "'default'",
-              "readonly": true,
               "attribute": "variant"
             }
           ],
@@ -868,7 +850,6 @@
                 "text": "boolean"
               },
               "default": "false",
-              "readonly": true,
               "attribute": "current",
               "reflects": true
             },
@@ -879,7 +860,6 @@
               "type": {
                 "text": "string"
               },
-              "readonly": true,
               "attribute": "href"
             },
             {
@@ -895,7 +875,6 @@
                 ]
               },
               "default": "'md'",
-              "readonly": true,
               "attribute": "size",
               "reflects": true
             }
@@ -1042,8 +1021,7 @@
                   }
                 ]
               },
-              "default": "[]",
-              "readonly": true
+              "default": "[]"
             },
             {
               "kind": "field",
@@ -1053,7 +1031,6 @@
                 "text": "string"
               },
               "default": "'Show hidden breadcrumbs'",
-              "readonly": true,
               "attribute": "overflow-label"
             },
             {
@@ -1070,7 +1047,6 @@
                 ]
               },
               "default": "'md'",
-              "readonly": true,
               "attribute": "size",
               "reflects": true
             }
@@ -1213,7 +1189,6 @@
                 "text": "string"
               },
               "default": "'Breadcrumb'",
-              "readonly": true,
               "attribute": "label"
             },
             {
@@ -1230,7 +1205,6 @@
                 ]
               },
               "default": "'md'",
-              "readonly": true,
               "attribute": "size"
             }
           ],
@@ -1347,7 +1321,6 @@
                 "text": "string"
               },
               "default": "null",
-              "readonly": true,
               "attribute": "aria-label"
             },
             {
@@ -1358,7 +1331,6 @@
                 "text": "boolean"
               },
               "default": "false",
-              "readonly": true,
               "attribute": "disabled"
             },
             {
@@ -1374,7 +1346,6 @@
                 ]
               },
               "default": "'md'",
-              "readonly": true,
               "attribute": "size"
             },
             {
@@ -1385,7 +1356,6 @@
                 "text": "\"button\" | \"reset\" | \"submit\""
               },
               "default": "'button'",
-              "readonly": true,
               "attribute": "type"
             },
             {
@@ -1401,7 +1371,6 @@
                 ]
               },
               "default": "'primary'",
-              "readonly": true,
               "attribute": "variant"
             }
           ],
@@ -1494,7 +1463,6 @@
                 ]
               },
               "default": "'md'",
-              "readonly": true,
               "attribute": "size"
             }
           ],
@@ -1563,7 +1531,6 @@
                 ]
               },
               "default": "'raised'",
-              "readonly": true,
               "attribute": "surface"
             }
           ],
@@ -1699,7 +1666,6 @@
               "type": {
                 "text": "string"
               },
-              "readonly": true,
               "attribute": "heading"
             },
             {
@@ -1731,7 +1697,6 @@
               "type": {
                 "text": "string"
               },
-              "readonly": true,
               "attribute": "subtitle"
             }
           ],
@@ -1879,7 +1844,6 @@
                 "text": "string"
               },
               "default": "'Genie'",
-              "readonly": true,
               "attribute": "heading"
             }
           ],
@@ -2020,7 +1984,6 @@
               "type": {
                 "text": "number"
               },
-              "readonly": true,
               "attribute": "sources-count"
             }
           ],
@@ -2180,7 +2143,6 @@
               "type": {
                 "text": "number"
               },
-              "readonly": true,
               "attribute": "count"
             },
             {
@@ -2191,7 +2153,6 @@
                 "text": "string"
               },
               "default": "'Sources'",
-              "readonly": true,
               "attribute": "heading"
             }
           ],
@@ -2281,7 +2242,6 @@
                 "text": "boolean"
               },
               "default": "false",
-              "readonly": true,
               "attribute": "disabled"
             }
           ],
@@ -2405,7 +2365,6 @@
                 "text": "string"
               },
               "default": "null",
-              "readonly": true,
               "attribute": "aria-label"
             },
             {
@@ -2427,7 +2386,6 @@
                 "text": "boolean"
               },
               "default": "false",
-              "readonly": true,
               "attribute": "disabled"
             },
             {
@@ -2438,7 +2396,6 @@
                 "text": "boolean"
               },
               "default": "false",
-              "readonly": true,
               "attribute": "error"
             },
             {
@@ -2465,7 +2422,6 @@
                 ]
               },
               "default": "'lg'",
-              "readonly": true,
               "attribute": "size"
             }
           ],
@@ -2673,7 +2629,6 @@
                 ]
               },
               "default": "'lg'",
-              "readonly": true,
               "attribute": "size"
             }
           ],
@@ -2712,18 +2667,18 @@
     },
     {
       "kind": "javascript-module",
-      "path": "src/components/bs-composer/bs-composer.tsx",
+      "path": "src/components/bs-chip/bs-chip-filter/bs-chip-filter.tsx",
       "declarations": [
         {
           "kind": "class",
           "customElement": true,
-          "tagName": "bs-composer",
-          "name": "BsComposer",
-          "description": "A chat composer input for Genie AI-style conversational interfaces: a text field\nplus an attach button, a mic/voice-recording toggle, and a single primary action button whose\nicon and behavior change with `state` (send, stop generating, or confirm a voice recording).\n\n## When to use\n- The message-entry bar for an AI chat/assistant or human support conversation.\n\n## When not to use\n- A general-purpose text field — use `bs-input` instead; this component's layout and states are\n  purpose-built for a chat composer, not a generic form field.\n\n## Focus\nUses `shadow: { delegatesFocus: true }`, so calling `.focus()` on the `<bs-composer>` host\nelement itself (not just its internal `<input>`) moves focus into the shadow-DOM text field --\nuseful for e.g. focusing the composer after a parent view mounts, without reaching into its\nshadow root.",
+          "tagName": "bs-chip-filter",
+          "name": "BsChipFilter",
+          "description": "A pill-shaped, selectable toggle used to filter a list or dataset (e.g. a \"Filter chip\" row\nabove a table or search results), optionally paired with a leading icon and/or a dropdown caret\nthat signals it opens a menu of further options.\n\n## When to use\n- Letting a user toggle a filter on/off, or open a menu of filter options (pair `dropdown` with\n  your own `bs-menu` -- this component only renders the caret affordance, it doesn't manage a\n  menu itself).\n\n## When not to use\n- A static, non-interactive status/category label -- use `bs-badge` instead.\n- A single primary action -- use `bs-button`.",
           "attributes": [
             {
               "name": "aria-label",
-              "description": "Accessible name for the text field. This component has no visible `<label>` (chat composers\ndon't show one in the design), so `ariaLabel` is the only way a consumer gives the textbox an\naccessible name -- set it in every real usage.",
+              "description": "Accessible name override. The visible label (default slot) already gives the native button\nan accessible name, so this is only needed if that text isn't sufficient on its own (e.g. it\ndoesn't convey that activating the chip toggles a filter).",
               "type": {
                 "text": "string"
               },
@@ -2731,191 +2686,178 @@
               "fieldName": "ariaLabel"
             },
             {
-              "name": "placeholder",
-              "description": "Overrides the variant's default placeholder.",
+              "name": "disabled",
+              "description": "Disables the chip: sets the native `disabled` attribute, suppresses hover/focus/pressed\nstyling, and prevents toggling.",
               "type": {
-                "text": "string"
+                "text": "boolean"
               },
-              "fieldName": "placeholder"
+              "default": "false",
+              "fieldName": "disabled"
             },
             {
-              "name": "state",
-              "description": "Which of the four mutually-exclusive composer states to render: `idle` (send, enabled),\n`generating` (stop, while the AI is responding), `disabled` (send, but not interactive), or\n`recording` (voice input in progress -- shows a waveform and a confirm action).",
+              "name": "dropdown",
+              "description": "Shows a trailing dropdown caret, signaling this chip opens a menu of further options.\nPurely a visual affordance -- wire up the actual menu (e.g. `bs-menu`) yourself.",
               "type": {
-                "text": "\"disabled\" | \"generating\" | \"idle\" | \"recording\"",
-                "references": [
-                  {
-                    "name": "BsComposerState"
-                  }
-                ]
+                "text": "boolean"
               },
-              "default": "'idle'",
-              "fieldName": "state"
+              "default": "false",
+              "fieldName": "dropdown"
             },
             {
-              "name": "value",
-              "description": "Current text value. Native `input` events don't cross the Shadow DOM boundary, so this\ncomponent re-dispatches them as a `bsInput` custom event instead.\n\nThe field is a `<textarea>` (not a single-line `<input>`) that grows with its content, up to\n`--bs-composer-input-max-lines` (10 by default) -- beyond that it scrolls internally instead\nof growing further. Setting `value` as a prop (not just typing) also re-triggers the resize,\nso e.g. programmatically clearing the field after submit correctly shrinks it back down.",
+              "name": "selected",
+              "description": "Whether the chip reads as toggled on. Mutable so clicking it toggles directly, and\nreflected so consumers can target `bs-chip-filter[selected]` via CSS.",
               "type": {
-                "text": "string"
+                "text": "boolean"
               },
-              "default": "''",
-              "fieldName": "value"
+              "default": "false",
+              "fieldName": "selected"
             },
             {
-              "name": "variant",
-              "description": "Which flavor of composer this is: changes the *default* placeholder text (set `placeholder`\ndirectly to override it) and, per the Figma design, renders the container border dashed\ninstead of solid for `'human'` -- a deliberate visual cue distinguishing a human-support\ncomposer from the AI one, not a layout/token difference.",
+              "name": "size",
+              "description": "Sizing scale. Controls the chip's height only -- icon size, gap, and font size stay\nconstant across sizes, matching the Figma spec exactly.",
               "type": {
-                "text": "\"ai\" | \"human\"",
+                "text": "\"lg\" | \"md\"",
                 "references": [
                   {
-                    "name": "BsComposerVariant"
+                    "name": "BsChipFilterSize"
                   }
                 ]
               },
-              "default": "'ai'",
-              "fieldName": "variant"
+              "default": "'lg'",
+              "fieldName": "size"
             }
           ],
           "members": [
             {
               "kind": "field",
               "name": "ariaLabel",
-              "description": "Accessible name for the text field. This component has no visible `<label>` (chat composers\ndon't show one in the design), so `ariaLabel` is the only way a consumer gives the textbox an\naccessible name -- set it in every real usage.",
+              "description": "Accessible name override. The visible label (default slot) already gives the native button\nan accessible name, so this is only needed if that text isn't sufficient on its own (e.g. it\ndoesn't convey that activating the chip toggles a filter).",
               "type": {
                 "text": "string"
               },
               "default": "null",
-              "readonly": true,
               "attribute": "aria-label"
             },
             {
               "kind": "field",
-              "name": "placeholder",
-              "description": "Overrides the variant's default placeholder.",
+              "name": "disabled",
+              "description": "Disables the chip: sets the native `disabled` attribute, suppresses hover/focus/pressed\nstyling, and prevents toggling.",
               "type": {
-                "text": "string"
+                "text": "boolean"
               },
-              "readonly": true,
-              "attribute": "placeholder"
+              "default": "false",
+              "attribute": "disabled"
             },
             {
               "kind": "field",
-              "name": "state",
-              "description": "Which of the four mutually-exclusive composer states to render: `idle` (send, enabled),\n`generating` (stop, while the AI is responding), `disabled` (send, but not interactive), or\n`recording` (voice input in progress -- shows a waveform and a confirm action).",
+              "name": "dropdown",
+              "description": "Shows a trailing dropdown caret, signaling this chip opens a menu of further options.\nPurely a visual affordance -- wire up the actual menu (e.g. `bs-menu`) yourself.",
               "type": {
-                "text": "\"disabled\" | \"generating\" | \"idle\" | \"recording\"",
-                "references": [
-                  {
-                    "name": "BsComposerState"
-                  }
-                ]
+                "text": "boolean"
               },
-              "default": "'idle'",
-              "readonly": true,
-              "attribute": "state"
+              "default": "false",
+              "attribute": "dropdown"
             },
             {
               "kind": "field",
-              "name": "value",
-              "description": "Current text value. Native `input` events don't cross the Shadow DOM boundary, so this\ncomponent re-dispatches them as a `bsInput` custom event instead.\n\nThe field is a `<textarea>` (not a single-line `<input>`) that grows with its content, up to\n`--bs-composer-input-max-lines` (10 by default) -- beyond that it scrolls internally instead\nof growing further. Setting `value` as a prop (not just typing) also re-triggers the resize,\nso e.g. programmatically clearing the field after submit correctly shrinks it back down.",
+              "name": "selected",
+              "description": "Whether the chip reads as toggled on. Mutable so clicking it toggles directly, and\nreflected so consumers can target `bs-chip-filter[selected]` via CSS.",
               "type": {
-                "text": "string"
+                "text": "boolean"
               },
-              "default": "''",
-              "readonly": true,
-              "attribute": "value"
+              "default": "false",
+              "attribute": "selected",
+              "reflects": true
             },
             {
               "kind": "field",
-              "name": "variant",
-              "description": "Which flavor of composer this is: changes the *default* placeholder text (set `placeholder`\ndirectly to override it) and, per the Figma design, renders the container border dashed\ninstead of solid for `'human'` -- a deliberate visual cue distinguishing a human-support\ncomposer from the AI one, not a layout/token difference.",
+              "name": "size",
+              "description": "Sizing scale. Controls the chip's height only -- icon size, gap, and font size stay\nconstant across sizes, matching the Figma spec exactly.",
               "type": {
-                "text": "\"ai\" | \"human\"",
+                "text": "\"lg\" | \"md\"",
                 "references": [
                   {
-                    "name": "BsComposerVariant"
+                    "name": "BsChipFilterSize"
                   }
                 ]
               },
-              "default": "'ai'",
-              "readonly": true,
-              "attribute": "variant"
+              "default": "'lg'",
+              "attribute": "size"
             }
           ],
           "events": [
             {
-              "name": "bsAttach",
-              "description": "Fires when the \"+\" attach button is clicked.",
+              "name": "bsChange",
+              "description": "Emitted when `selected` changes via user interaction, with the new value.",
               "type": {
-                "text": "CustomEvent<void>"
+                "text": "CustomEvent<boolean>"
               }
-            },
+            }
+          ],
+          "slots": [
             {
-              "name": "bsInput",
-              "description": "Fires on every keystroke in the text field, with the current value.",
-              "type": {
-                "text": "CustomEvent<string>"
-              }
+              "name": "",
+              "description": "Default slot: the chip's label content."
             },
             {
-              "name": "bsMicToggle",
-              "description": "Fires when the mic/stop-recording button is clicked. The consumer decides what that means\n(e.g. start recording when idle/generating, or stop recording when `state=\"recording\"`).",
-              "type": {
-                "text": "CustomEvent<void>"
-              }
-            },
+              "name": "icon",
+              "description": "Optional leading icon, rendered before the label."
+            }
+          ],
+          "cssParts": [
             {
-              "name": "bsStop",
-              "description": "Fires when the primary action button is clicked while `state=\"generating\"`.",
-              "type": {
-                "text": "CustomEvent<void>"
-              }
+              "name": "caret",
+              "description": "The dropdown caret wrapper element, when `dropdown` is set."
             },
             {
-              "name": "bsSubmit",
-              "description": "Fires when the primary action button is clicked while `state=\"idle\"`.",
-              "type": {
-                "text": "CustomEvent<void>"
-              }
+              "name": "icon",
+              "description": "The icon wrapper element."
             },
             {
-              "name": "bsVoiceConfirm",
-              "description": "Fires when the primary action button is clicked while `state=\"recording\"`.",
-              "type": {
-                "text": "CustomEvent<void>"
-              }
+              "name": "label",
+              "description": "The text label element."
             }
           ],
-          "slots": [
+          "cssProperties": [
             {
-              "name": "actions-end",
-              "description": "Extra consumer-supplied controls appended after the primary action button\nin the controls row (e.g. a product-specific \"Tools\" button). Slotted content is placed\ninline in the same flex row as attach/mic/action, so a slotted element should size itself to\nroughly match `--bs-composer-button-size` to align visually."
+              "name": "--bs-chip-filter-font-size",
+              "description": "Aliased to --bs-font-size-sm."
             },
             {
-              "name": "attachments",
-              "description": "A `bs-attachment-list` (or other content) rendered inside the composer's own\nbordered container, above the text field -- only takes up space/padding when it has assigned\ncontent, so leaving it empty renders identically to not having the slot at all."
-            }
-          ],
-          "cssParts": [
+              "name": "--bs-chip-filter-font-weight",
+              "description": "Aliased to --bs-font-weight-regular. Color (background/text per selected/hover/focus/pressed/disabled state) comes directly from brandsync-tokens' own pre-built chip token set (--bs-chip-bg-..., --bs-chip-text-..., --bs-chip-border-...) below -- those are shared across the whole bs-chip family, not local to this component, so they're consumed directly rather than re-aliased under a bs-chip-filter-specific name."
+            },
             {
-              "name": "action",
-              "description": "The primary circular action button (send, stop, or confirm depending on `state`)."
+              "name": "--bs-chip-filter-gap",
+              "description": "Gap between icon/label/caret. Aliased to --bs-spacing-50."
             },
             {
-              "name": "attach",
-              "description": "The \"+\" attach button."
+              "name": "--bs-chip-filter-height-lg",
+              "description": "Height at size=\"lg\". Aliased to --bs-spacing-400."
             },
             {
-              "name": "attachments",
-              "description": "The wrapper around the `attachments` slot."
+              "name": "--bs-chip-filter-height-md",
+              "description": "Height at size=\"md\". Aliased to --bs-spacing-300."
             },
             {
-              "name": "input",
-              "description": "The native text `<textarea>`."
+              "name": "--bs-chip-filter-icon-size",
+              "description": "Icon/caret glyph size. 16px, matching Figma exactly -- constant across both sizes, only the chip's own height changes."
             },
             {
-              "name": "mic",
-              "description": "The secondary icon button (microphone, or the stop-recording square while `state=\"recording\"`)."
+              "name": "--bs-chip-filter-line-height",
+              "description": "Aliased to --bs-line-height-body-sm."
+            },
+            {
+              "name": "--bs-chip-filter-padding-x-glyph-side",
+              "description": "Horizontal padding on an edge adjacent to the icon or the caret. Aliased to --bs-spacing-100."
+            },
+            {
+              "name": "--bs-chip-filter-padding-x-plain-side",
+              "description": "Horizontal padding on a label-only edge, when the opposite edge has a glyph. Aliased to --bs-spacing-150."
+            },
+            {
+              "name": "--bs-chip-filter-padding-x-text-only",
+              "description": "Horizontal padding on both edges, when neither has a glyph. Aliased to --bs-spacing-200 -- deliberately not the same as --bs-chip-filter-padding-x-plain-side; verified against Figma that a plain-text chip (no icon, no dropdown) uses a bigger value on both sides rather than the smaller one-sided compensating value used when only one edge lacks a glyph."
             }
           ]
         }
@@ -2923,202 +2865,184 @@
       "exports": [
         {
           "kind": "js",
-          "name": "BsComposer",
+          "name": "BsChipFilter",
           "declaration": {
-            "name": "BsComposer"
+            "name": "BsChipFilter"
           }
         },
         {
           "kind": "custom-element-definition",
-          "name": "bs-composer",
+          "name": "bs-chip-filter",
           "declaration": {
-            "name": "BsComposer"
+            "name": "BsChipFilter"
           }
         }
       ]
     },
     {
       "kind": "javascript-module",
-      "path": "src/components/bs-composer-status-banner/bs-composer-status-banner.tsx",
+      "path": "src/components/bs-chip/bs-chip-informative/bs-chip-informative.tsx",
       "declarations": [
         {
           "kind": "class",
           "customElement": true,
-          "tagName": "bs-composer-status-banner",
-          "name": "BsComposerStatusBanner",
-          "description": "A full-width status banner for use directly above `bs-composer`, surfacing a message about the\ncomposer's current state (e.g. a send failure, an informational notice) with an optional\n\"Continue\"-style action button and an optional close button.\n\n## When to use\n- A message tied to the composer itself (send failed, rate-limited, draft restored, etc.) that\n  needs to sit directly above it, not a general-purpose alert -- see `CONVENTIONS.md` if this\n  library gains a generic banner/alert component later, and prefer that instead once it exists.\n\n## When not to use\n- A toast/snackbar notification unrelated to the composer -- this component is not\n  self-dismissing and has no positioning of its own (it's a static block, not an overlay).\n\n## Accessibility\nSets `role=\"status\"` for `type=\"info\"`/`type=\"neutral\"` and `role=\"alert\"` for\n`type=\"error\"`/`type=\"warning\"` on its own root element automatically -- no opt-in prop needed.\nBoth roles carry implicit ARIA live-region semantics (`status` is polite, `alert` is assertive),\nso a screen reader announces the message as soon as this banner is inserted into the DOM,\nwithout a consumer having to remember to add `role`/`aria-live` themselves.",
+          "tagName": "bs-chip-informative",
+          "name": "BsChipInformative",
+          "description": "A pill-shaped, non-interactive label for conveying a category or status at a glance, optionally\npaired with a leading icon. Unlike `bs-chip-filter`/`bs-chip-input`, this is purely informational\n-- no click/select/remove behavior, no hover/focus/pressed states.\n\n## When to use\n- Conveying a category or status inline with other content, with more color options and an\n  optional icon than `bs-badge` offers.\n\n## When not to use\n- Anything clickable/selectable -- use `bs-chip-filter`.\n- A short, fixed status label with no color/icon needs -- `bs-badge` is the simpler choice.",
           "attributes": [
             {
-              "name": "action-label",
-              "description": "Label for the action button, only rendered when `showButton` is true.",
-              "type": {
-                "text": "string"
-              },
-              "default": "'Continue'",
-              "fieldName": "actionLabel"
-            },
-            {
-              "name": "allow-close",
-              "description": "Whether the close button is rendered.",
-              "type": {
-                "text": "boolean"
-              },
-              "default": "true",
-              "fieldName": "allowClose"
-            },
-            {
-              "name": "message",
-              "description": "The message text.",
+              "name": "color",
+              "description": "Semantic color. Maps directly to the brandsync-tokens `--bs-chip-bg-*-container`/\n`--bs-chip-text-*` sets. Ignored (in favor of the disabled token set) when `disabled` is\nset -- same override relationship `bs-stepper-step`'s `error`/`disabled` props have.",
               "type": {
-                "text": "string"
+                "text": "\"error\" | \"info\" | \"neutral\" | \"success\" | \"warning\"",
+                "references": [
+                  {
+                    "name": "BsChipInformativeColor"
+                  }
+                ]
               },
-              "default": "'This is a message'",
-              "fieldName": "message"
+              "default": "'neutral'",
+              "fieldName": "color"
             },
             {
-              "name": "show-button",
-              "description": "Whether the \"Continue\"-style action button is rendered.",
+              "name": "disabled",
+              "description": "Overrides `color` with the disabled token set, regardless of its value. Reflected so\n`:host([disabled])` can apply it in CSS.",
               "type": {
                 "text": "boolean"
               },
               "default": "false",
-              "fieldName": "showButton"
-            },
-            {
-              "name": "show-icon",
-              "description": "Whether the leading icon (default: clock) is rendered.",
-              "type": {
-                "text": "boolean"
-              },
-              "default": "true",
-              "fieldName": "showIcon"
+              "fieldName": "disabled"
             },
             {
-              "name": "type",
-              "description": "Which severity/style to render. Drives background, text/icon color, and the action button's color.",
+              "name": "size",
+              "description": "Sizing scale. Controls height and font-size/line-height together -- unlike\n`bs-chip-filter`/`bs-chip-input`, Figma specs a distinct (smaller) font at `size=\"sm\"`, not\njust a shorter pill.",
               "type": {
-                "text": "\"error\" | \"info\" | \"neutral\" | \"warning\"",
+                "text": "\"lg\" | \"md\" | \"sm\"",
                 "references": [
                   {
-                    "name": "BsComposerStatusBannerType"
+                    "name": "BsChipInformativeSize"
                   }
                 ]
               },
-              "default": "'error'",
-              "fieldName": "type"
+              "default": "'lg'",
+              "fieldName": "size"
             }
           ],
           "members": [
             {
               "kind": "field",
-              "name": "actionLabel",
-              "description": "Label for the action button, only rendered when `showButton` is true.",
+              "name": "color",
+              "description": "Semantic color. Maps directly to the brandsync-tokens `--bs-chip-bg-*-container`/\n`--bs-chip-text-*` sets. Ignored (in favor of the disabled token set) when `disabled` is\nset -- same override relationship `bs-stepper-step`'s `error`/`disabled` props have.",
               "type": {
-                "text": "string"
+                "text": "\"error\" | \"info\" | \"neutral\" | \"success\" | \"warning\"",
+                "references": [
+                  {
+                    "name": "BsChipInformativeColor"
+                  }
+                ]
               },
-              "default": "'Continue'",
-              "readonly": true,
-              "attribute": "action-label"
+              "default": "'neutral'",
+              "attribute": "color"
             },
             {
               "kind": "field",
-              "name": "allowClose",
-              "description": "Whether the close button is rendered.",
+              "name": "disabled",
+              "description": "Overrides `color` with the disabled token set, regardless of its value. Reflected so\n`:host([disabled])` can apply it in CSS.",
               "type": {
                 "text": "boolean"
               },
-              "default": "true",
-              "readonly": true,
-              "attribute": "allow-close"
+              "default": "false",
+              "attribute": "disabled",
+              "reflects": true
             },
             {
               "kind": "field",
-              "name": "message",
-              "description": "The message text.",
+              "name": "size",
+              "description": "Sizing scale. Controls height and font-size/line-height together -- unlike\n`bs-chip-filter`/`bs-chip-input`, Figma specs a distinct (smaller) font at `size=\"sm\"`, not\njust a shorter pill.",
               "type": {
-                "text": "string"
+                "text": "\"lg\" | \"md\" | \"sm\"",
+                "references": [
+                  {
+                    "name": "BsChipInformativeSize"
+                  }
+                ]
               },
-              "default": "'This is a message'",
-              "readonly": true,
-              "attribute": "message"
+              "default": "'lg'",
+              "attribute": "size"
+            }
+          ],
+          "slots": [
+            {
+              "name": "",
+              "description": "Default slot: the chip's label content."
             },
             {
-              "kind": "field",
-              "name": "showButton",
-              "description": "Whether the \"Continue\"-style action button is rendered.",
-              "type": {
-                "text": "boolean"
-              },
-              "default": "false",
-              "readonly": true,
-              "attribute": "show-button"
-            },
+              "name": "icon",
+              "description": "Optional leading icon."
+            }
+          ],
+          "cssParts": [
             {
-              "kind": "field",
-              "name": "showIcon",
-              "description": "Whether the leading icon (default: clock) is rendered.",
-              "type": {
-                "text": "boolean"
-              },
-              "default": "true",
-              "readonly": true,
-              "attribute": "show-icon"
+              "name": "icon",
+              "description": "The icon wrapper element."
             },
             {
-              "kind": "field",
-              "name": "type",
-              "description": "Which severity/style to render. Drives background, text/icon color, and the action button's color.",
-              "type": {
-                "text": "\"error\" | \"info\" | \"neutral\" | \"warning\"",
-                "references": [
-                  {
-                    "name": "BsComposerStatusBannerType"
-                  }
-                ]
-              },
-              "default": "'error'",
-              "readonly": true,
-              "attribute": "type"
+              "name": "label",
+              "description": "The text label element."
             }
           ],
-          "events": [
+          "cssProperties": [
             {
-              "name": "bsAction",
-              "description": "Fires when the action button is clicked. Only relevant when `showButton` is true.",
-              "type": {
-                "text": "CustomEvent<void>"
-              }
+              "name": "--bs-chip-informative-font-size",
+              "description": "Aliased to --bs-font-size-sm (size=\"md\"/\"lg\")."
             },
             {
-              "name": "bsClose",
-              "description": "Fires when the close button is clicked. Only relevant when `allowClose` is true.",
-              "type": {
-                "text": "CustomEvent<void>"
-              }
-            }
-          ],
-          "slots": [
+              "name": "--bs-chip-informative-font-size-sm",
+              "description": "Aliased to --bs-font-size-xs (size=\"sm\" only -- every other size uses --bs-chip-informative-font-size below)."
+            },
             {
-              "name": "icon",
-              "description": "Overrides the default leading icon. Only rendered when `showIcon` is true."
-            }
-          ],
-          "cssParts": [
+              "name": "--bs-chip-informative-font-weight",
+              "description": "Aliased to --bs-font-weight-regular. Color (background/text per color/disabled) comes directly from brandsync-tokens' own pre-built chip token set below -- shared across the whole bs-chip family, not local to this component, consumed directly rather than re-aliased under a bs-chip-informative-specific name."
+            },
             {
-              "name": "action",
-              "description": "The optional \"Continue\"-style action button."
+              "name": "--bs-chip-informative-gap",
+              "description": "Gap between icon and label. Aliased to --bs-spacing-50."
             },
             {
-              "name": "close",
-              "description": "The optional close button."
+              "name": "--bs-chip-informative-height-lg",
+              "description": "Height at size=\"lg\". Aliased to --bs-spacing-400."
             },
             {
-              "name": "icon",
-              "description": "The leading icon wrapper."
+              "name": "--bs-chip-informative-height-md",
+              "description": "Height at size=\"md\". Aliased to --bs-spacing-300."
             },
             {
-              "name": "message",
-              "description": "The message text."
+              "name": "--bs-chip-informative-height-sm",
+              "description": "Height at size=\"sm\". Aliased to --bs-spacing-250."
+            },
+            {
+              "name": "--bs-chip-informative-icon-size",
+              "description": "Icon glyph size. 16px, matching Figma exactly -- constant across all sizes, only the chip's own height/font changes."
+            },
+            {
+              "name": "--bs-chip-informative-line-height",
+              "description": "Aliased to --bs-line-height-body-sm (size=\"md\"/\"lg\")."
+            },
+            {
+              "name": "--bs-chip-informative-line-height-sm",
+              "description": "Aliased to --bs-line-height-caption-sm (size=\"sm\" only)."
+            },
+            {
+              "name": "--bs-chip-informative-padding-right-icon-variant",
+              "description": "Right-edge padding specifically when there's a leading icon (the label-only edge in that case). Aliased to --bs-spacing-150."
+            },
+            {
+              "name": "--bs-chip-informative-padding-x-glyph-side",
+              "description": "Left-edge padding when there's a leading icon. Aliased to --bs-spacing-100."
+            },
+            {
+              "name": "--bs-chip-informative-padding-x-plain-side",
+              "description": "Both edges' padding when there's no leading icon. Aliased to --bs-spacing-200 -- deliberately not the icon variant's own right-edge value (--bs-spacing-150) below; verified against Figma that the no-icon variant uses a bigger value on both sides rather than reusing the icon variant's smaller one-sided value."
             }
           ]
         }
@@ -3126,171 +3050,179 @@
       "exports": [
         {
           "kind": "js",
-          "name": "BsComposerStatusBanner",
+          "name": "BsChipInformative",
           "declaration": {
-            "name": "BsComposerStatusBanner"
+            "name": "BsChipInformative"
           }
         },
         {
           "kind": "custom-element-definition",
-          "name": "bs-composer-status-banner",
+          "name": "bs-chip-informative",
           "declaration": {
-            "name": "BsComposerStatusBanner"
+            "name": "BsChipInformative"
           }
         }
       ]
     },
     {
       "kind": "javascript-module",
-      "path": "src/components/bs-data-table/bs-data-table.tsx",
+      "path": "src/components/bs-chip/bs-chip-input/bs-chip-input.tsx",
       "declarations": [
         {
           "kind": "class",
           "customElement": true,
-          "tagName": "bs-data-table",
-          "name": "BsDataTable",
-          "description": "A sortable, optionally row-selectable table for tabular data.\n\n`columns`, `rows`, and `cellRenderer` are JS-property-only — HTML attributes can only carry\nstrings, so arrays/objects/functions must be set via `element.rows = [...]` etc., not as\nattributes. See CONVENTIONS.md.\n\n## When to use\n- Comparing structured records across the same set of fields (a list of people, bookings, etc.).\n\n## When not to use\n- A handful of unrelated key/value pairs — a simple list or card is lighter-weight.\n- Deeply nested/hierarchical data — this component renders one flat row per record.",
+          "tagName": "bs-chip-input",
+          "name": "BsChipInput",
+          "description": "A pill-shaped, removable representation of a discrete piece of user-entered data (e.g. a tag,\na selected filter value, an invited email address), optionally paired with a leading icon or\navatar. Unlike `bs-chip-filter`, this is a compound control -- the body toggles `selected`, and\na separate trailing button removes the chip entirely.\n\n## When to use\n- Representing one entry in a list the user built themselves (tags, recipients, multi-select\n  values) that they need to be able to remove individually.\n\n## When not to use\n- A single toggleable filter, with no removal affordance -- use `bs-chip-filter`.\n- A static, non-interactive status/category label -- use `bs-badge`.",
           "attributes": [
             {
-              "name": "selectable",
+              "name": "disabled",
+              "description": "Disables both the body and the remove button, and reflected so `:host([disabled])` can\napply the disabled token set (a plain CSS pseudo-class can't target the host itself here,\nsince :host isn't a native form control).",
               "type": {
                 "text": "boolean"
               },
               "default": "false",
-              "fieldName": "selectable"
+              "fieldName": "disabled"
             },
             {
-              "name": "sort-column",
+              "name": "selected",
+              "description": "Whether the chip reads as toggled on. Mutable so clicking the body toggles directly, and\nreflected so consumers can target `bs-chip-input[selected]` via CSS.",
               "type": {
-                "text": "string"
+                "text": "boolean"
               },
-              "fieldName": "sortColumn"
+              "default": "false",
+              "fieldName": "selected"
             },
             {
-              "name": "sort-direction",
+              "name": "size",
+              "description": "Sizing scale. Controls the chip's height only -- icon size, gap, and font size stay\nconstant across sizes, matching the Figma spec exactly.",
               "type": {
-                "text": "\"asc\" | \"desc\""
+                "text": "\"lg\" | \"md\"",
+                "references": [
+                  {
+                    "name": "BsChipInputSize"
+                  }
+                ]
               },
-              "default": "'asc'",
-              "fieldName": "sortDirection"
+              "default": "'lg'",
+              "fieldName": "size"
             }
           ],
           "members": [
             {
               "kind": "field",
-              "name": "cellRenderer",
-              "description": "Optional custom cell renderer, e.g. for an actions column. Function props are JS-property-only,\nsame as array props -- there is no attribute equivalent. Falls back to the raw cell value.",
+              "name": "disabled",
+              "description": "Disables both the body and the remove button, and reflected so `:host([disabled])` can\napply the disabled token set (a plain CSS pseudo-class can't target the host itself here,\nsince :host isn't a native form control).",
               "type": {
-                "text": "(row: BsDataTableRow, column: BsDataTableColumn) => string",
-                "references": [
-                  {
-                    "name": "BsDataTableRow"
-                  },
-                  {
-                    "name": "BsDataTableColumn"
-                  }
-                ]
+                "text": "boolean"
               },
-              "readonly": true
+              "default": "false",
+              "attribute": "disabled",
+              "reflects": true
             },
             {
               "kind": "field",
-              "name": "columns",
-              "description": "Array prop -- must be set as a JS property (`el.columns = [...]`), not an HTML attribute,\nsince attributes can only carry strings. See CONVENTIONS.md.",
+              "name": "selected",
+              "description": "Whether the chip reads as toggled on. Mutable so clicking the body toggles directly, and\nreflected so consumers can target `bs-chip-input[selected]` via CSS.",
               "type": {
-                "text": "BsDataTableColumn[]",
-                "references": [
-                  {
-                    "name": "BsDataTableColumn"
-                  }
-                ]
+                "text": "boolean"
               },
-              "default": "[]",
-              "readonly": true
+              "default": "false",
+              "attribute": "selected",
+              "reflects": true
             },
             {
               "kind": "field",
-              "name": "rows",
-              "description": "Array prop -- same JS-property-only rule as `columns`.",
+              "name": "size",
+              "description": "Sizing scale. Controls the chip's height only -- icon size, gap, and font size stay\nconstant across sizes, matching the Figma spec exactly.",
               "type": {
-                "text": "BsDataTableRow[]",
+                "text": "\"lg\" | \"md\"",
                 "references": [
                   {
-                    "name": "BsDataTableRow"
+                    "name": "BsChipInputSize"
                   }
                 ]
               },
-              "default": "[]",
-              "readonly": true
-            },
-            {
-              "kind": "field",
-              "name": "selectable",
-              "type": {
-                "text": "boolean"
-              },
-              "default": "false",
-              "readonly": true,
-              "attribute": "selectable"
-            },
-            {
-              "kind": "field",
-              "name": "sortColumn",
-              "type": {
-                "text": "string"
-              },
-              "readonly": true,
-              "attribute": "sort-column"
-            },
-            {
-              "kind": "field",
-              "name": "sortDirection",
-              "type": {
-                "text": "\"asc\" | \"desc\""
-              },
-              "default": "'asc'",
-              "readonly": true,
-              "attribute": "sort-direction"
+              "default": "'lg'",
+              "attribute": "size"
             }
           ],
           "events": [
             {
-              "name": "bsRowSelect",
+              "name": "bsChange",
+              "description": "Emitted when `selected` changes via clicking the body, with the new value.",
               "type": {
-                "text": "CustomEvent<{ id: string | number; selected: boolean; }>"
+                "text": "CustomEvent<boolean>"
               }
             },
             {
-              "name": "bsSort",
+              "name": "bsRemove",
+              "description": "Emitted when the remove button is clicked. No payload -- unlike bs-input's own chip-entry\nmode (which tracks a `chips: string[]` array internally and can identify which string was\nremoved), a standalone chip doesn't know its own \"value\" to a consumer; whatever's rendering\na list of these already has that context via closure/key.",
               "type": {
-                "text": "CustomEvent<{ column: string; direction: \"desc\" | \"asc\"; }>"
+                "text": "CustomEvent<void>"
               }
             }
           ],
+          "slots": [
+            {
+              "name": "",
+              "description": "Default slot: the chip's label content."
+            },
+            {
+              "name": "icon",
+              "description": "Optional leading visual. Defaults to 16px (a plain icon), except a\n`<bs-avatar size=\"xs\">` specifically keeps its own natural 24px sizing instead -- Figma specs\na plain icon and an avatar (with its own existing border ring) at two different sizes."
+            }
+          ],
           "cssParts": [
             {
               "name": "body",
-              "description": "The `<tbody>` element."
+              "description": "The button that toggles `selected`."
             },
             {
-              "name": "cell",
-              "description": "Each `<td>` in a body row."
+              "name": "icon",
+              "description": "The icon wrapper element."
             },
             {
-              "name": "head",
-              "description": "The `<thead>` element."
+              "name": "label",
+              "description": "The text label element."
             },
             {
-              "name": "header-cell",
-              "description": "Each `<th>` in the header row."
+              "name": "remove",
+              "description": "The trailing remove button."
+            }
+          ],
+          "cssProperties": [
+            {
+              "name": "--bs-chip-input-font-size",
+              "description": "Aliased to --bs-font-size-sm."
             },
             {
-              "name": "row",
-              "description": "Each `<tr>` in the body."
+              "name": "--bs-chip-input-font-weight",
+              "description": "Aliased to --bs-font-weight-regular. Color (background/text per selected/hover/focus/pressed/disabled state) comes directly from brandsync-tokens' own pre-built chip token set (--bs-chip-bg-..., --bs-chip-text-..., --bs-chip-border-...) below -- shared across the whole bs-chip family, not local to this component, consumed directly rather than re-aliased under a bs-chip-input-specific name."
             },
             {
-              "name": "table",
-              "description": "The `<table>` element."
+              "name": "--bs-chip-input-gap",
+              "description": "Gap between icon/label/remove. Aliased to --bs-spacing-50."
+            },
+            {
+              "name": "--bs-chip-input-height-lg",
+              "description": "Height at size=\"lg\". Aliased to --bs-spacing-400."
+            },
+            {
+              "name": "--bs-chip-input-height-md",
+              "description": "Height at size=\"md\". Aliased to --bs-spacing-300."
+            },
+            {
+              "name": "--bs-chip-input-line-height",
+              "description": "Aliased to --bs-line-height-body-sm."
+            },
+            {
+              "name": "--bs-chip-input-padding-x-glyph-side",
+              "description": "Horizontal padding on an edge adjacent to a glyph (the icon on the left, or the remove button on the right, which is always present). Aliased to --bs-spacing-100."
+            },
+            {
+              "name": "--bs-chip-input-padding-x-plain-side",
+              "description": "Left-edge padding when there's no leading icon. Aliased to --bs-spacing-150."
             }
           ]
         }
@@ -3298,177 +3230,221 @@
       "exports": [
         {
           "kind": "js",
-          "name": "BsDataTable",
+          "name": "BsChipInput",
           "declaration": {
-            "name": "BsDataTable"
+            "name": "BsChipInput"
           }
         },
         {
           "kind": "custom-element-definition",
-          "name": "bs-data-table",
+          "name": "bs-chip-input",
           "declaration": {
-            "name": "BsDataTable"
+            "name": "BsChipInput"
           }
         }
       ]
     },
     {
       "kind": "javascript-module",
-      "path": "src/components/bs-dialog/bs-dialog.tsx",
+      "path": "src/components/bs-composer/bs-composer.tsx",
       "declarations": [
         {
           "kind": "class",
           "customElement": true,
-          "tagName": "bs-dialog",
-          "name": "BsDialog",
-          "description": "An overlay dialog that interrupts the current flow for a focused task or confirmation.\nCloses itself on backdrop click, Escape, or its own close button, and emits `bsClose`.\n\n## When to use\n- Confirming a consequential action (e.g. \"Confirm booking\") before it takes effect.\n- A short, focused task that doesn't warrant navigating to a new page.\n\n## When not to use\n- For non-blocking status messages — use a toast/notification instead of interrupting the user.\n- For a long, multi-step flow — a full page or a dedicated route is usually a better fit than a\n  dialog that just gets taller and taller.\n\nTwo additional slots cover the Figma \"Dialog\" component's other states: `image` (a hero image\nacross the top, close button floats over it instead of sitting in the header row) and `icon`\n(only rendered when `centered` is set, e.g. a success checkmark above a centered heading). The\nclose button \"floats\" (absolute-positioned, top-right of the dialog, with its own background)\nwhenever `centered` is true or the `image` slot has content -- otherwise it's the plain inline\nbutton in the header row next to the heading, same as before this addition.",
+          "tagName": "bs-composer",
+          "name": "BsComposer",
+          "description": "A chat composer input for Genie AI-style conversational interfaces: a text field\nplus an attach button, a mic/voice-recording toggle, and a single primary action button whose\nicon and behavior change with `state` (send, stop generating, or confirm a voice recording).\n\n## When to use\n- The message-entry bar for an AI chat/assistant or human support conversation.\n\n## When not to use\n- A general-purpose text field — use `bs-input` instead; this component's layout and states are\n  purpose-built for a chat composer, not a generic form field.\n\n## Focus\nUses `shadow: { delegatesFocus: true }`, so calling `.focus()` on the `<bs-composer>` host\nelement itself (not just its internal `<input>`) moves focus into the shadow-DOM text field --\nuseful for e.g. focusing the composer after a parent view mounts, without reaching into its\nshadow root.",
           "attributes": [
             {
-              "name": "centered",
-              "description": "Switches to the Figma \"Icon Centered\" layout: heading/body text centered, the `icon` slot\nrendered above the heading, and the close button floating top-right of the dialog instead of\ninline in the header row. Doesn't hide a slotted `image` if one is also provided -- Figma's\nspec doesn't show the two combined, so this is unspecified rather than actively blocked.\nReflected so consumers/CSS can target `bs-dialog[centered]`.",
+              "name": "aria-label",
+              "description": "Accessible name for the text field. This component has no visible `<label>` (chat composers\ndon't show one in the design), so `ariaLabel` is the only way a consumer gives the textbox an\naccessible name -- set it in every real usage.",
               "type": {
-                "text": "boolean"
+                "text": "string"
               },
-              "default": "false",
-              "fieldName": "centered"
+              "default": "null",
+              "fieldName": "ariaLabel"
             },
             {
-              "name": "heading",
+              "name": "placeholder",
+              "description": "Overrides the variant's default placeholder.",
               "type": {
                 "text": "string"
               },
-              "fieldName": "heading"
+              "fieldName": "placeholder"
             },
             {
-              "name": "open",
-              "description": "Mutable + reflected so the component can close itself (backdrop click, Escape, close button)\nthe same way a native `<dialog>` does, while still emitting `bsClose` for the consumer to react to.",
+              "name": "state",
+              "description": "Which of the four mutually-exclusive composer states to render: `idle` (send, enabled),\n`generating` (stop, while the AI is responding), `disabled` (send, but not interactive), or\n`recording` (voice input in progress -- shows a waveform and a confirm action).",
               "type": {
-                "text": "boolean"
-              },
-              "default": "false",
-              "fieldName": "open"
-            },
-            {
-              "name": "size",
+                "text": "\"disabled\" | \"generating\" | \"idle\" | \"recording\"",
+                "references": [
+                  {
+                    "name": "BsComposerState"
+                  }
+                ]
+              },
+              "default": "'idle'",
+              "fieldName": "state"
+            },
+            {
+              "name": "value",
+              "description": "Current text value. Native `input` events don't cross the Shadow DOM boundary, so this\ncomponent re-dispatches them as a `bsInput` custom event instead.\n\nThe field is a `<textarea>` (not a single-line `<input>`) that grows with its content, up to\n`--bs-composer-input-max-lines` (10 by default) -- beyond that it scrolls internally instead\nof growing further. Setting `value` as a prop (not just typing) also re-triggers the resize,\nso e.g. programmatically clearing the field after submit correctly shrinks it back down.",
               "type": {
-                "text": "\"lg\" | \"md\" | \"sm\"",
+                "text": "string"
+              },
+              "default": "''",
+              "fieldName": "value"
+            },
+            {
+              "name": "variant",
+              "description": "Which flavor of composer this is: changes the *default* placeholder text (set `placeholder`\ndirectly to override it) and, per the Figma design, renders the container border dashed\ninstead of solid for `'human'` -- a deliberate visual cue distinguishing a human-support\ncomposer from the AI one, not a layout/token difference.",
+              "type": {
+                "text": "\"ai\" | \"human\"",
                 "references": [
                   {
-                    "name": "BsDialogSize"
+                    "name": "BsComposerVariant"
                   }
                 ]
               },
-              "default": "'md'",
-              "fieldName": "size"
+              "default": "'ai'",
+              "fieldName": "variant"
             }
           ],
           "members": [
             {
               "kind": "field",
-              "name": "centered",
-              "description": "Switches to the Figma \"Icon Centered\" layout: heading/body text centered, the `icon` slot\nrendered above the heading, and the close button floating top-right of the dialog instead of\ninline in the header row. Doesn't hide a slotted `image` if one is also provided -- Figma's\nspec doesn't show the two combined, so this is unspecified rather than actively blocked.\nReflected so consumers/CSS can target `bs-dialog[centered]`.",
+              "name": "ariaLabel",
+              "description": "Accessible name for the text field. This component has no visible `<label>` (chat composers\ndon't show one in the design), so `ariaLabel` is the only way a consumer gives the textbox an\naccessible name -- set it in every real usage.",
               "type": {
-                "text": "boolean"
+                "text": "string"
               },
-              "default": "false",
-              "readonly": true,
-              "attribute": "centered",
-              "reflects": true
+              "default": "null",
+              "attribute": "aria-label"
             },
             {
               "kind": "field",
-              "name": "heading",
+              "name": "placeholder",
+              "description": "Overrides the variant's default placeholder.",
               "type": {
                 "text": "string"
               },
-              "readonly": true,
-              "attribute": "heading"
+              "attribute": "placeholder"
             },
             {
               "kind": "field",
-              "name": "open",
-              "description": "Mutable + reflected so the component can close itself (backdrop click, Escape, close button)\nthe same way a native `<dialog>` does, while still emitting `bsClose` for the consumer to react to.",
+              "name": "state",
+              "description": "Which of the four mutually-exclusive composer states to render: `idle` (send, enabled),\n`generating` (stop, while the AI is responding), `disabled` (send, but not interactive), or\n`recording` (voice input in progress -- shows a waveform and a confirm action).",
               "type": {
-                "text": "boolean"
+                "text": "\"disabled\" | \"generating\" | \"idle\" | \"recording\"",
+                "references": [
+                  {
+                    "name": "BsComposerState"
+                  }
+                ]
               },
-              "default": "false",
-              "attribute": "open",
-              "reflects": true
+              "default": "'idle'",
+              "attribute": "state"
             },
             {
               "kind": "field",
-              "name": "size",
+              "name": "value",
+              "description": "Current text value. Native `input` events don't cross the Shadow DOM boundary, so this\ncomponent re-dispatches them as a `bsInput` custom event instead.\n\nThe field is a `<textarea>` (not a single-line `<input>`) that grows with its content, up to\n`--bs-composer-input-max-lines` (10 by default) -- beyond that it scrolls internally instead\nof growing further. Setting `value` as a prop (not just typing) also re-triggers the resize,\nso e.g. programmatically clearing the field after submit correctly shrinks it back down.",
               "type": {
-                "text": "\"lg\" | \"md\" | \"sm\"",
+                "text": "string"
+              },
+              "default": "''",
+              "attribute": "value"
+            },
+            {
+              "kind": "field",
+              "name": "variant",
+              "description": "Which flavor of composer this is: changes the *default* placeholder text (set `placeholder`\ndirectly to override it) and, per the Figma design, renders the container border dashed\ninstead of solid for `'human'` -- a deliberate visual cue distinguishing a human-support\ncomposer from the AI one, not a layout/token difference.",
+              "type": {
+                "text": "\"ai\" | \"human\"",
                 "references": [
                   {
-                    "name": "BsDialogSize"
+                    "name": "BsComposerVariant"
                   }
                 ]
               },
-              "default": "'md'",
-              "readonly": true,
-              "attribute": "size"
+              "default": "'ai'",
+              "attribute": "variant"
             }
           ],
           "events": [
             {
-              "name": "bsClose",
+              "name": "bsAttach",
+              "description": "Fires when the \"+\" attach button is clicked.",
               "type": {
                 "text": "CustomEvent<void>"
               }
-            }
-          ],
-          "slots": [
+            },
             {
-              "name": "",
-              "description": "Default slot: the dialog body content."
+              "name": "bsInput",
+              "description": "Fires on every keystroke in the text field, with the current value.",
+              "type": {
+                "text": "CustomEvent<string>"
+              }
             },
             {
-              "name": "footer",
-              "description": "Optional footer content (typically action buttons)."
+              "name": "bsMicToggle",
+              "description": "Fires when the mic/stop-recording button is clicked. The consumer decides what that means\n(e.g. start recording when idle/generating, or stop recording when `state=\"recording\"`).",
+              "type": {
+                "text": "CustomEvent<void>"
+              }
             },
             {
-              "name": "icon",
-              "description": "Optional icon shown above the heading, only rendered at all when `centered` is true."
+              "name": "bsStop",
+              "description": "Fires when the primary action button is clicked while `state=\"generating\"`.",
+              "type": {
+                "text": "CustomEvent<void>"
+              }
             },
             {
-              "name": "image",
-              "description": "Optional hero image across the top of the dialog. Presence of assigned content\nswitches the close button to float over it; doesn't affect layout when empty."
+              "name": "bsSubmit",
+              "description": "Fires when the primary action button is clicked while `state=\"idle\"`.",
+              "type": {
+                "text": "CustomEvent<void>"
+              }
+            },
+            {
+              "name": "bsVoiceConfirm",
+              "description": "Fires when the primary action button is clicked while `state=\"recording\"`.",
+              "type": {
+                "text": "CustomEvent<void>"
+              }
             }
           ],
-          "cssParts": [
-            {
-              "name": "backdrop",
-              "description": "The full-viewport overlay behind the dialog."
-            },
+          "slots": [
             {
-              "name": "body",
-              "description": "The body content wrapper."
+              "name": "actions-end",
+              "description": "Extra consumer-supplied controls appended after the primary action button\nin the controls row (e.g. a product-specific \"Tools\" button). Slotted content is placed\ninline in the same flex row as attach/mic/action, so a slotted element should size itself to\nroughly match `--bs-composer-button-size` to align visually."
             },
             {
-              "name": "close",
-              "description": "The close button (inline in the header, or floating -- see the class doc above)."
-            },
+              "name": "attachments",
+              "description": "A `bs-attachment-list` (or other content) rendered inside the composer's own\nbordered container, above the text field -- only takes up space/padding when it has assigned\ncontent, so leaving it empty renders identically to not having the slot at all."
+            }
+          ],
+          "cssParts": [
             {
-              "name": "dialog",
-              "description": "The dialog box itself."
+              "name": "action",
+              "description": "The primary circular action button (send, stop, or confirm depending on `state`)."
             },
             {
-              "name": "footer",
-              "description": "The footer wrapper (only visible when the footer slot has content)."
+              "name": "attach",
+              "description": "The \"+\" attach button."
             },
             {
-              "name": "header",
-              "description": "The header row (heading + close button, when the close button isn't floating)."
+              "name": "attachments",
+              "description": "The wrapper around the `attachments` slot."
             },
             {
-              "name": "icon",
-              "description": "The icon wrapper (only rendered when `centered` is true)."
+              "name": "input",
+              "description": "The native text `<textarea>`."
             },
             {
-              "name": "image",
-              "description": "The hero image wrapper (only visible when the `image` slot has content)."
+              "name": "mic",
+              "description": "The secondary icon button (microphone, or the stop-recording square while `state=\"recording\"`)."
             }
           ]
         }
@@ -3476,109 +3452,645 @@
       "exports": [
         {
           "kind": "js",
-          "name": "BsDialog",
+          "name": "BsComposer",
           "declaration": {
-            "name": "BsDialog"
+            "name": "BsComposer"
           }
         },
         {
           "kind": "custom-element-definition",
-          "name": "bs-dialog",
+          "name": "bs-composer",
           "declaration": {
-            "name": "BsDialog"
+            "name": "BsComposer"
           }
         }
       ]
     },
     {
       "kind": "javascript-module",
-      "path": "src/components/bs-button/bs-icon-button/bs-icon-button.tsx",
+      "path": "src/components/bs-composer-status-banner/bs-composer-status-banner.tsx",
       "declarations": [
         {
           "kind": "class",
           "customElement": true,
-          "tagName": "bs-icon-button",
-          "name": "BsIconButton",
-          "description": "A clickable, icon-only action element -- the icon-only sibling of `bs-button`, sharing the same\n8 visual variants and color language, but ALWAYS rendering just a single icon, never a label.\n\n## When to use\n- A compact action where the icon alone is unambiguous (e.g. a close/dismiss control, a toolbar\n  action) and adding a text label would take up more space than the context allows.\n- The same variant guidance as `bs-button` applies: `primary` for the single most important\n  action, `neutral`/`subtle`/`outlined` for lower-emphasis alternatives, `error` reserved for\n  destructive/irreversible actions (never `neutral`, per BrandSync guidance), `success`/\n  `warning`/`info` only when the action's own outcome is predictable and clearly communicated.\n\n## When not to use\n- When the action isn't self-evident from the icon alone -- use `bs-button` with a visible label\n  instead, don't rely on a tooltip to compensate for an unclear icon.\n- For navigation between pages -- use a link/nav component instead.\n\nBecause this component is always icon-only, `ariaLabel` is required for every real usage (not\njust conditionally, unlike `bs-button`) -- there's no visible label text to fall back on for an\naccessible name.",
+          "tagName": "bs-composer-status-banner",
+          "name": "BsComposerStatusBanner",
+          "description": "A full-width status banner for use directly above `bs-composer`, surfacing a message about the\ncomposer's current state (e.g. a send failure, an informational notice) with an optional\n\"Continue\"-style action button and an optional close button.\n\n## When to use\n- A message tied to the composer itself (send failed, rate-limited, draft restored, etc.) that\n  needs to sit directly above it, not a general-purpose alert -- see `CONVENTIONS.md` if this\n  library gains a generic banner/alert component later, and prefer that instead once it exists.\n\n## When not to use\n- A toast/snackbar notification unrelated to the composer -- this component is not\n  self-dismissing and has no positioning of its own (it's a static block, not an overlay).\n\n## Accessibility\nSets `role=\"status\"` for `type=\"info\"`/`type=\"neutral\"` and `role=\"alert\"` for\n`type=\"error\"`/`type=\"warning\"` on its own root element automatically -- no opt-in prop needed.\nBoth roles carry implicit ARIA live-region semantics (`status` is polite, `alert` is assertive),\nso a screen reader announces the message as soon as this banner is inserted into the DOM,\nwithout a consumer having to remember to add `role`/`aria-live` themselves.",
           "attributes": [
             {
-              "name": "aria-label",
-              "description": "Accessible name for the button. Required -- this component is always icon-only, so there's\nno visible label text for screen readers to fall back on. Stencil reflects this camelCase\nprop to the `aria-label` HTML attribute automatically.",
+              "name": "action-label",
+              "description": "Label for the action button, only rendered when `showButton` is true.",
               "type": {
                 "text": "string"
               },
-              "default": "null",
-              "fieldName": "ariaLabel"
+              "default": "'Continue'",
+              "fieldName": "actionLabel"
             },
             {
-              "name": "disabled",
-              "description": "Disables the button and applies the disabled token set.",
+              "name": "allow-close",
+              "description": "Whether the close button is rendered.",
               "type": {
                 "text": "boolean"
               },
-              "default": "false",
-              "fieldName": "disabled"
+              "default": "true",
+              "fieldName": "allowClose"
             },
             {
-              "name": "size",
-              "description": "Sizing scale. `xs` (16px, an 8px icon) is a distinct, much smaller tier meant for compact\nchip/tag \"remove\" controls, not just a smaller toolbar button -- verified against a separate\nFigma redline (EG BrandSync UI Kit v1.5, node 20731:18427) from the one `sm`/`md`/`lg` were\nbuilt against.",
+              "name": "message",
+              "description": "The message text.",
               "type": {
-                "text": "\"lg\" | \"md\" | \"sm\" | \"xs\"",
-                "references": [
-                  {
-                    "name": "BsIconButtonSize"
-                  }
-                ]
+                "text": "string"
               },
-              "default": "'md'",
-              "fieldName": "size"
+              "default": "'This is a message'",
+              "fieldName": "message"
             },
             {
-              "name": "type",
-              "description": "Native `<button>` type.",
+              "name": "show-button",
+              "description": "Whether the \"Continue\"-style action button is rendered.",
               "type": {
-                "text": "\"button\" | \"reset\" | \"submit\""
+                "text": "boolean"
               },
-              "default": "'button'",
-              "fieldName": "type"
+              "default": "false",
+              "fieldName": "showButton"
             },
             {
-              "name": "variant",
-              "description": "Visual style. Maps to the same semantic token families as `bs-button`'s `variant`.\n`error` is for destructive/irreversible actions per BrandSync guidance, not a stronger\nemphasis alternative to `primary`.",
+              "name": "show-icon",
+              "description": "Whether the leading icon (default: clock) is rendered.",
               "type": {
-                "text": "\"error\" | \"info\" | \"neutral\" | \"outlined\" | \"primary\" | \"subtle\" | \"success\" | \"warning\"",
+                "text": "boolean"
+              },
+              "default": "true",
+              "fieldName": "showIcon"
+            },
+            {
+              "name": "type",
+              "description": "Which severity/style to render. Drives background, text/icon color, and the action button's color.",
+              "type": {
+                "text": "\"error\" | \"info\" | \"neutral\" | \"warning\"",
                 "references": [
                   {
-                    "name": "BsIconButtonVariant"
+                    "name": "BsComposerStatusBannerType"
                   }
                 ]
               },
-              "default": "'primary'",
-              "fieldName": "variant"
+              "default": "'error'",
+              "fieldName": "type"
             }
           ],
           "members": [
             {
               "kind": "field",
-              "name": "ariaLabel",
-              "description": "Accessible name for the button. Required -- this component is always icon-only, so there's\nno visible label text for screen readers to fall back on. Stencil reflects this camelCase\nprop to the `aria-label` HTML attribute automatically.",
+              "name": "actionLabel",
+              "description": "Label for the action button, only rendered when `showButton` is true.",
               "type": {
                 "text": "string"
               },
-              "default": "null",
-              "readonly": true,
-              "attribute": "aria-label"
+              "default": "'Continue'",
+              "attribute": "action-label"
             },
             {
               "kind": "field",
-              "name": "disabled",
-              "description": "Disables the button and applies the disabled token set.",
+              "name": "allowClose",
+              "description": "Whether the close button is rendered.",
               "type": {
                 "text": "boolean"
               },
-              "default": "false",
-              "readonly": true,
-              "attribute": "disabled"
+              "default": "true",
+              "attribute": "allow-close"
+            },
+            {
+              "kind": "field",
+              "name": "message",
+              "description": "The message text.",
+              "type": {
+                "text": "string"
+              },
+              "default": "'This is a message'",
+              "attribute": "message"
+            },
+            {
+              "kind": "field",
+              "name": "showButton",
+              "description": "Whether the \"Continue\"-style action button is rendered.",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "attribute": "show-button"
+            },
+            {
+              "kind": "field",
+              "name": "showIcon",
+              "description": "Whether the leading icon (default: clock) is rendered.",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "true",
+              "attribute": "show-icon"
+            },
+            {
+              "kind": "field",
+              "name": "type",
+              "description": "Which severity/style to render. Drives background, text/icon color, and the action button's color.",
+              "type": {
+                "text": "\"error\" | \"info\" | \"neutral\" | \"warning\"",
+                "references": [
+                  {
+                    "name": "BsComposerStatusBannerType"
+                  }
+                ]
+              },
+              "default": "'error'",
+              "attribute": "type"
+            }
+          ],
+          "events": [
+            {
+              "name": "bsAction",
+              "description": "Fires when the action button is clicked. Only relevant when `showButton` is true.",
+              "type": {
+                "text": "CustomEvent<void>"
+              }
+            },
+            {
+              "name": "bsClose",
+              "description": "Fires when the close button is clicked. Only relevant when `allowClose` is true.",
+              "type": {
+                "text": "CustomEvent<void>"
+              }
+            }
+          ],
+          "slots": [
+            {
+              "name": "icon",
+              "description": "Overrides the default leading icon. Only rendered when `showIcon` is true."
+            }
+          ],
+          "cssParts": [
+            {
+              "name": "action",
+              "description": "The optional \"Continue\"-style action button."
+            },
+            {
+              "name": "close",
+              "description": "The optional close button."
+            },
+            {
+              "name": "icon",
+              "description": "The leading icon wrapper."
+            },
+            {
+              "name": "message",
+              "description": "The message text."
+            }
+          ]
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "BsComposerStatusBanner",
+          "declaration": {
+            "name": "BsComposerStatusBanner"
+          }
+        },
+        {
+          "kind": "custom-element-definition",
+          "name": "bs-composer-status-banner",
+          "declaration": {
+            "name": "BsComposerStatusBanner"
+          }
+        }
+      ]
+    },
+    {
+      "kind": "javascript-module",
+      "path": "src/components/bs-data-table/bs-data-table.tsx",
+      "declarations": [
+        {
+          "kind": "class",
+          "customElement": true,
+          "tagName": "bs-data-table",
+          "name": "BsDataTable",
+          "description": "A sortable, optionally row-selectable table for tabular data.\n\n`columns`, `rows`, and `cellRenderer` are JS-property-only — HTML attributes can only carry\nstrings, so arrays/objects/functions must be set via `element.rows = [...]` etc., not as\nattributes. See CONVENTIONS.md.\n\n## When to use\n- Comparing structured records across the same set of fields (a list of people, bookings, etc.).\n\n## When not to use\n- A handful of unrelated key/value pairs — a simple list or card is lighter-weight.\n- Deeply nested/hierarchical data — this component renders one flat row per record.",
+          "attributes": [
+            {
+              "name": "selectable",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "fieldName": "selectable"
+            },
+            {
+              "name": "sort-column",
+              "type": {
+                "text": "string"
+              },
+              "fieldName": "sortColumn"
+            },
+            {
+              "name": "sort-direction",
+              "type": {
+                "text": "\"asc\" | \"desc\""
+              },
+              "default": "'asc'",
+              "fieldName": "sortDirection"
+            }
+          ],
+          "members": [
+            {
+              "kind": "field",
+              "name": "cellRenderer",
+              "description": "Optional custom cell renderer, e.g. for an actions column. Function props are JS-property-only,\nsame as array props -- there is no attribute equivalent. Falls back to the raw cell value.",
+              "type": {
+                "text": "(row: BsDataTableRow, column: BsDataTableColumn) => string",
+                "references": [
+                  {
+                    "name": "BsDataTableRow"
+                  },
+                  {
+                    "name": "BsDataTableColumn"
+                  }
+                ]
+              }
+            },
+            {
+              "kind": "field",
+              "name": "columns",
+              "description": "Array prop -- must be set as a JS property (`el.columns = [...]`), not an HTML attribute,\nsince attributes can only carry strings. See CONVENTIONS.md.",
+              "type": {
+                "text": "BsDataTableColumn[]",
+                "references": [
+                  {
+                    "name": "BsDataTableColumn"
+                  }
+                ]
+              },
+              "default": "[]"
+            },
+            {
+              "kind": "field",
+              "name": "rows",
+              "description": "Array prop -- same JS-property-only rule as `columns`.",
+              "type": {
+                "text": "BsDataTableRow[]",
+                "references": [
+                  {
+                    "name": "BsDataTableRow"
+                  }
+                ]
+              },
+              "default": "[]"
+            },
+            {
+              "kind": "field",
+              "name": "selectable",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "attribute": "selectable"
+            },
+            {
+              "kind": "field",
+              "name": "sortColumn",
+              "type": {
+                "text": "string"
+              },
+              "attribute": "sort-column"
+            },
+            {
+              "kind": "field",
+              "name": "sortDirection",
+              "type": {
+                "text": "\"asc\" | \"desc\""
+              },
+              "default": "'asc'",
+              "attribute": "sort-direction"
+            }
+          ],
+          "events": [
+            {
+              "name": "bsRowSelect",
+              "type": {
+                "text": "CustomEvent<{ id: string | number; selected: boolean; }>"
+              }
+            },
+            {
+              "name": "bsSort",
+              "type": {
+                "text": "CustomEvent<{ column: string; direction: \"desc\" | \"asc\"; }>"
+              }
+            }
+          ],
+          "cssParts": [
+            {
+              "name": "body",
+              "description": "The `<tbody>` element."
+            },
+            {
+              "name": "cell",
+              "description": "Each `<td>` in a body row."
+            },
+            {
+              "name": "head",
+              "description": "The `<thead>` element."
+            },
+            {
+              "name": "header-cell",
+              "description": "Each `<th>` in the header row."
+            },
+            {
+              "name": "row",
+              "description": "Each `<tr>` in the body."
+            },
+            {
+              "name": "table",
+              "description": "The `<table>` element."
+            }
+          ]
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "BsDataTable",
+          "declaration": {
+            "name": "BsDataTable"
+          }
+        },
+        {
+          "kind": "custom-element-definition",
+          "name": "bs-data-table",
+          "declaration": {
+            "name": "BsDataTable"
+          }
+        }
+      ]
+    },
+    {
+      "kind": "javascript-module",
+      "path": "src/components/bs-dialog/bs-dialog.tsx",
+      "declarations": [
+        {
+          "kind": "class",
+          "customElement": true,
+          "tagName": "bs-dialog",
+          "name": "BsDialog",
+          "description": "An overlay dialog that interrupts the current flow for a focused task or confirmation.\nCloses itself on backdrop click, Escape, or its own close button, and emits `bsClose`.\n\n## When to use\n- Confirming a consequential action (e.g. \"Confirm booking\") before it takes effect.\n- A short, focused task that doesn't warrant navigating to a new page.\n\n## When not to use\n- For non-blocking status messages — use a toast/notification instead of interrupting the user.\n- For a long, multi-step flow — a full page or a dedicated route is usually a better fit than a\n  dialog that just gets taller and taller.\n\nTwo additional slots cover the Figma \"Dialog\" component's other states: `image` (a hero image\nacross the top, close button floats over it instead of sitting in the header row) and `icon`\n(only rendered when `centered` is set, e.g. a success checkmark above a centered heading). The\nclose button \"floats\" (absolute-positioned, top-right of the dialog, with its own background)\nwhenever `centered` is true or the `image` slot has content -- otherwise it's the plain inline\nbutton in the header row next to the heading, same as before this addition.",
+          "attributes": [
+            {
+              "name": "centered",
+              "description": "Switches to the Figma \"Icon Centered\" layout: heading/body text centered, the `icon` slot\nrendered above the heading, and the close button floating top-right of the dialog instead of\ninline in the header row. Doesn't hide a slotted `image` if one is also provided -- Figma's\nspec doesn't show the two combined, so this is unspecified rather than actively blocked.\nReflected so consumers/CSS can target `bs-dialog[centered]`.",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "fieldName": "centered"
+            },
+            {
+              "name": "heading",
+              "type": {
+                "text": "string"
+              },
+              "fieldName": "heading"
+            },
+            {
+              "name": "open",
+              "description": "Mutable + reflected so the component can close itself (backdrop click, Escape, close button)\nthe same way a native `<dialog>` does, while still emitting `bsClose` for the consumer to react to.",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "fieldName": "open"
+            },
+            {
+              "name": "size",
+              "type": {
+                "text": "\"lg\" | \"md\" | \"sm\"",
+                "references": [
+                  {
+                    "name": "BsDialogSize"
+                  }
+                ]
+              },
+              "default": "'md'",
+              "fieldName": "size"
+            }
+          ],
+          "members": [
+            {
+              "kind": "field",
+              "name": "centered",
+              "description": "Switches to the Figma \"Icon Centered\" layout: heading/body text centered, the `icon` slot\nrendered above the heading, and the close button floating top-right of the dialog instead of\ninline in the header row. Doesn't hide a slotted `image` if one is also provided -- Figma's\nspec doesn't show the two combined, so this is unspecified rather than actively blocked.\nReflected so consumers/CSS can target `bs-dialog[centered]`.",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "attribute": "centered",
+              "reflects": true
+            },
+            {
+              "kind": "field",
+              "name": "heading",
+              "type": {
+                "text": "string"
+              },
+              "attribute": "heading"
+            },
+            {
+              "kind": "field",
+              "name": "open",
+              "description": "Mutable + reflected so the component can close itself (backdrop click, Escape, close button)\nthe same way a native `<dialog>` does, while still emitting `bsClose` for the consumer to react to.",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "attribute": "open",
+              "reflects": true
+            },
+            {
+              "kind": "field",
+              "name": "size",
+              "type": {
+                "text": "\"lg\" | \"md\" | \"sm\"",
+                "references": [
+                  {
+                    "name": "BsDialogSize"
+                  }
+                ]
+              },
+              "default": "'md'",
+              "attribute": "size"
+            }
+          ],
+          "events": [
+            {
+              "name": "bsClose",
+              "type": {
+                "text": "CustomEvent<void>"
+              }
+            }
+          ],
+          "slots": [
+            {
+              "name": "",
+              "description": "Default slot: the dialog body content."
+            },
+            {
+              "name": "footer",
+              "description": "Optional footer content (typically action buttons)."
+            },
+            {
+              "name": "icon",
+              "description": "Optional icon shown above the heading, only rendered at all when `centered` is true."
+            },
+            {
+              "name": "image",
+              "description": "Optional hero image across the top of the dialog. Presence of assigned content\nswitches the close button to float over it; doesn't affect layout when empty."
+            }
+          ],
+          "cssParts": [
+            {
+              "name": "backdrop",
+              "description": "The full-viewport overlay behind the dialog."
+            },
+            {
+              "name": "body",
+              "description": "The body content wrapper."
+            },
+            {
+              "name": "close",
+              "description": "The close button (inline in the header, or floating -- see the class doc above)."
+            },
+            {
+              "name": "dialog",
+              "description": "The dialog box itself."
+            },
+            {
+              "name": "footer",
+              "description": "The footer wrapper (only visible when the footer slot has content)."
+            },
+            {
+              "name": "header",
+              "description": "The header row (heading + close button, when the close button isn't floating)."
+            },
+            {
+              "name": "icon",
+              "description": "The icon wrapper (only rendered when `centered` is true)."
+            },
+            {
+              "name": "image",
+              "description": "The hero image wrapper (only visible when the `image` slot has content)."
+            }
+          ]
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "BsDialog",
+          "declaration": {
+            "name": "BsDialog"
+          }
+        },
+        {
+          "kind": "custom-element-definition",
+          "name": "bs-dialog",
+          "declaration": {
+            "name": "BsDialog"
+          }
+        }
+      ]
+    },
+    {
+      "kind": "javascript-module",
+      "path": "src/components/bs-button/bs-icon-button/bs-icon-button.tsx",
+      "declarations": [
+        {
+          "kind": "class",
+          "customElement": true,
+          "tagName": "bs-icon-button",
+          "name": "BsIconButton",
+          "description": "A clickable, icon-only action element -- the icon-only sibling of `bs-button`, sharing the same\n8 visual variants and color language, but ALWAYS rendering just a single icon, never a label.\n\n## When to use\n- A compact action where the icon alone is unambiguous (e.g. a close/dismiss control, a toolbar\n  action) and adding a text label would take up more space than the context allows.\n- The same variant guidance as `bs-button` applies: `primary` for the single most important\n  action, `neutral`/`subtle`/`outlined` for lower-emphasis alternatives, `error` reserved for\n  destructive/irreversible actions (never `neutral`, per BrandSync guidance), `success`/\n  `warning`/`info` only when the action's own outcome is predictable and clearly communicated.\n\n## When not to use\n- When the action isn't self-evident from the icon alone -- use `bs-button` with a visible label\n  instead, don't rely on a tooltip to compensate for an unclear icon.\n- For navigation between pages -- use a link/nav component instead.\n\nBecause this component is always icon-only, `ariaLabel` is required for every real usage (not\njust conditionally, unlike `bs-button`) -- there's no visible label text to fall back on for an\naccessible name.",
+          "attributes": [
+            {
+              "name": "aria-label",
+              "description": "Accessible name for the button. Required -- this component is always icon-only, so there's\nno visible label text for screen readers to fall back on. Stencil reflects this camelCase\nprop to the `aria-label` HTML attribute automatically.",
+              "type": {
+                "text": "string"
+              },
+              "default": "null",
+              "fieldName": "ariaLabel"
+            },
+            {
+              "name": "disabled",
+              "description": "Disables the button and applies the disabled token set.",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "fieldName": "disabled"
+            },
+            {
+              "name": "size",
+              "description": "Sizing scale. `xs` (16px, an 8px icon) is a distinct, much smaller tier meant for compact\nchip/tag \"remove\" controls, not just a smaller toolbar button -- verified against a separate\nFigma redline (EG BrandSync UI Kit v1.5, node 20731:18427) from the one `sm`/`md`/`lg` were\nbuilt against.",
+              "type": {
+                "text": "\"lg\" | \"md\" | \"sm\" | \"xs\"",
+                "references": [
+                  {
+                    "name": "BsIconButtonSize"
+                  }
+                ]
+              },
+              "default": "'md'",
+              "fieldName": "size"
+            },
+            {
+              "name": "type",
+              "description": "Native `<button>` type.",
+              "type": {
+                "text": "\"button\" | \"reset\" | \"submit\""
+              },
+              "default": "'button'",
+              "fieldName": "type"
+            },
+            {
+              "name": "variant",
+              "description": "Visual style. Maps to the same semantic token families as `bs-button`'s `variant`.\n`error` is for destructive/irreversible actions per BrandSync guidance, not a stronger\nemphasis alternative to `primary`.",
+              "type": {
+                "text": "\"error\" | \"info\" | \"neutral\" | \"outlined\" | \"primary\" | \"subtle\" | \"success\" | \"warning\"",
+                "references": [
+                  {
+                    "name": "BsIconButtonVariant"
+                  }
+                ]
+              },
+              "default": "'primary'",
+              "fieldName": "variant"
+            }
+          ],
+          "members": [
+            {
+              "kind": "field",
+              "name": "ariaLabel",
+              "description": "Accessible name for the button. Required -- this component is always icon-only, so there's\nno visible label text for screen readers to fall back on. Stencil reflects this camelCase\nprop to the `aria-label` HTML attribute automatically.",
+              "type": {
+                "text": "string"
+              },
+              "default": "null",
+              "attribute": "aria-label"
+            },
+            {
+              "kind": "field",
+              "name": "disabled",
+              "description": "Disables the button and applies the disabled token set.",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "attribute": "disabled"
             },
             {
               "kind": "field",
@@ -3593,7 +4105,6 @@
                 ]
               },
               "default": "'md'",
-              "readonly": true,
               "attribute": "size"
             },
             {
@@ -3604,7 +4115,6 @@
                 "text": "\"button\" | \"reset\" | \"submit\""
               },
               "default": "'button'",
-              "readonly": true,
               "attribute": "type"
             },
             {
@@ -3620,7 +4130,6 @@
                 ]
               },
               "default": "'primary'",
-              "readonly": true,
               "attribute": "variant"
             }
           ],
@@ -3901,7 +4410,6 @@
                 "text": "string"
               },
               "default": "null",
-              "readonly": true,
               "attribute": "aria-label"
             },
             {
@@ -3912,7 +4420,6 @@
                 "text": "boolean"
               },
               "default": "false",
-              "readonly": true,
               "attribute": "disabled"
             },
             {
@@ -3923,7 +4430,6 @@
                 "text": "boolean"
               },
               "default": "false",
-              "readonly": true,
               "attribute": "selected",
               "reflects": true
             }
@@ -4226,8 +4732,7 @@
               "type": {
                 "text": "string[]"
               },
-              "default": "[]",
-              "readonly": true
+              "default": "[]"
             },
             {
               "kind": "field",
@@ -4237,7 +4742,6 @@
                 "text": "string"
               },
               "default": "''",
-              "readonly": true,
               "attribute": "country"
             },
             {
@@ -4247,8 +4751,7 @@
               "type": {
                 "text": "{ code: string; label: string; flagIcon?: string; }[]"
               },
-              "default": "[]",
-              "readonly": true
+              "default": "[]"
             },
             {
               "kind": "field",
@@ -4256,7 +4759,6 @@
               "type": {
                 "text": "string"
               },
-              "readonly": true,
               "attribute": "description"
             },
             {
@@ -4266,7 +4768,6 @@
                 "text": "boolean"
               },
               "default": "false",
-              "readonly": true,
               "attribute": "disabled"
             },
             {
@@ -4275,7 +4776,6 @@
               "type": {
                 "text": "string"
               },
-              "readonly": true,
               "attribute": "error"
             },
             {
@@ -4286,7 +4786,6 @@
                 "text": "string"
               },
               "default": "''",
-              "readonly": true,
               "attribute": "initials-title"
             },
             {
@@ -4295,7 +4794,6 @@
               "type": {
                 "text": "string"
               },
-              "readonly": true,
               "attribute": "label"
             },
             {
@@ -4306,7 +4804,6 @@
                 "text": "number"
               },
               "default": "4",
-              "readonly": true,
               "attribute": "length"
             },
             {
@@ -4316,7 +4813,6 @@
               "type": {
                 "text": "number"
               },
-              "readonly": true,
               "attribute": "max"
             },
             {
@@ -4326,7 +4822,6 @@
               "type": {
                 "text": "number"
               },
-              "readonly": true,
               "attribute": "min"
             },
             {
@@ -4347,8 +4842,7 @@
               "type": {
                 "text": "{ label: string; value: string; }[]"
               },
-              "default": "[]",
-              "readonly": true
+              "default": "[]"
             },
             {
               "kind": "field",
@@ -4356,7 +4850,6 @@
               "type": {
                 "text": "string"
               },
-              "readonly": true,
               "attribute": "placeholder"
             },
             {
@@ -4367,7 +4860,6 @@
                 "text": "boolean"
               },
               "default": "false",
-              "readonly": true,
               "attribute": "required"
             },
             {
@@ -4378,7 +4870,6 @@
                 "text": "number"
               },
               "default": "3",
-              "readonly": true,
               "attribute": "rows"
             },
             {
@@ -4389,7 +4880,6 @@
                 "text": "number"
               },
               "default": "1",
-              "readonly": true,
               "attribute": "step"
             },
             {
@@ -4399,8 +4889,7 @@
               "type": {
                 "text": "string[]"
               },
-              "default": "[]",
-              "readonly": true
+              "default": "[]"
             },
             {
               "kind": "field",
@@ -4409,7 +4898,6 @@
                 "text": "\"chip\" | \"country\" | \"date\" | \"dropdown\" | \"email\" | \"initials\" | \"number\" | \"password\" | \"pin\" | \"search\" | \"select\" | \"text\" | \"textarea\""
               },
               "default": "'text'",
-              "readonly": true,
               "attribute": "type"
             },
             {
@@ -4720,7 +5208,6 @@
                 "text": "string"
               },
               "default": "null",
-              "readonly": true,
               "attribute": "alt"
             },
             {
@@ -4736,7 +5223,6 @@
                 ]
               },
               "default": "'auto'",
-              "readonly": true,
               "attribute": "background"
             },
             {
@@ -4747,7 +5233,6 @@
                 "text": "string"
               },
               "default": "null",
-              "readonly": true,
               "attribute": "src"
             },
             {
@@ -4763,7 +5248,6 @@
                 ]
               },
               "default": "'full'",
-              "readonly": true,
               "attribute": "variant"
             }
           ],
@@ -4893,7 +5377,6 @@
                 "text": "boolean"
               },
               "default": "false",
-              "readonly": true,
               "attribute": "disabled"
             }
           ],
@@ -5026,7 +5509,6 @@
                 "text": "boolean"
               },
               "default": "true",
-              "readonly": true,
               "attribute": "collapsible"
             },
             {
@@ -5037,7 +5519,6 @@
                 "text": "string"
               },
               "default": "'Main Menu'",
-              "readonly": true,
               "attribute": "heading"
             },
             {
@@ -5048,7 +5529,6 @@
                 "text": "\"auto\" | \"dark\" | \"light\""
               },
               "default": "'auto'",
-              "readonly": true,
               "attribute": "logo-background"
             },
             {
@@ -5059,7 +5539,6 @@
                 "text": "boolean"
               },
               "default": "true",
-              "readonly": true,
               "attribute": "show-logo"
             }
           ],
@@ -5303,7 +5782,6 @@
                 "text": "string"
               },
               "default": "null",
-              "readonly": true,
               "attribute": "aria-label"
             },
             {
@@ -5314,7 +5792,6 @@
                 "text": "boolean"
               },
               "default": "false",
-              "readonly": true,
               "attribute": "collapsed",
               "reflects": true
             },
@@ -5326,7 +5803,6 @@
                 "text": "boolean"
               },
               "default": "false",
-              "readonly": true,
               "attribute": "expandable"
             },
             {
@@ -5348,7 +5824,6 @@
                 "text": "boolean"
               },
               "default": "false",
-              "readonly": true,
               "attribute": "nested"
             },
             {
@@ -5359,7 +5834,6 @@
                 "text": "boolean"
               },
               "default": "false",
-              "readonly": true,
               "attribute": "selected",
               "reflects": true
             }
@@ -5617,7 +6091,6 @@
                 ]
               },
               "default": "'default'",
-              "readonly": true,
               "attribute": "alignment"
             },
             {
@@ -5628,7 +6101,6 @@
                 "text": "string"
               },
               "default": "null",
-              "readonly": true,
               "attribute": "aria-label"
             },
             {
@@ -5639,7 +6111,6 @@
                 "text": "\"auto\" | \"dark\" | \"light\""
               },
               "default": "'auto'",
-              "readonly": true,
               "attribute": "logo-background"
             },
             {
@@ -5650,7 +6121,6 @@
                 "text": "string"
               },
               "default": "null",
-              "readonly": true,
               "attribute": "skip-to-content-href"
             },
             {
@@ -5661,7 +6131,6 @@
                 "text": "string"
               },
               "default": "'Skip to main content'",
-              "readonly": true,
               "attribute": "skip-to-content-label"
             }
           ],
@@ -5831,7 +6300,6 @@
                 "text": "string"
               },
               "default": "'Next page'",
-              "readonly": true,
               "attribute": "next-label"
             },
             {
@@ -5842,7 +6310,6 @@
                 "text": "string"
               },
               "default": "'Previous page'",
-              "readonly": true,
               "attribute": "previous-label"
             },
             {
@@ -5853,7 +6320,6 @@
                 "text": "number"
               },
               "default": "1",
-              "readonly": true,
               "attribute": "sibling-count"
             },
             {
@@ -5864,7 +6330,6 @@
                 "text": "number"
               },
               "default": "1",
-              "readonly": true,
               "attribute": "total-pages"
             }
           ],
@@ -6050,7 +6515,6 @@
                 "text": "boolean"
               },
               "default": "false",
-              "readonly": true,
               "attribute": "disabled"
             },
             {
@@ -6060,7 +6524,6 @@
               "type": {
                 "text": "string"
               },
-              "readonly": true,
               "attribute": "name"
             },
             {
@@ -6070,7 +6533,6 @@
               "type": {
                 "text": "string"
               },
-              "readonly": true,
               "attribute": "value"
             }
           ],
@@ -6276,7 +6738,6 @@
                 "text": "string"
               },
               "default": "null",
-              "readonly": true,
               "attribute": "aria-label"
             },
             {
@@ -6287,7 +6748,6 @@
                 "text": "boolean"
               },
               "default": "false",
-              "readonly": true,
               "attribute": "disabled"
             },
             {
@@ -6298,7 +6758,6 @@
                 "text": "string"
               },
               "default": "'Label'",
-              "readonly": true,
               "attribute": "label"
             },
             {
@@ -6309,7 +6768,6 @@
                 "text": "number"
               },
               "default": "100",
-              "readonly": true,
               "attribute": "max"
             },
             {
@@ -6320,7 +6778,6 @@
                 "text": "number"
               },
               "default": "0",
-              "readonly": true,
               "attribute": "min"
             },
             {
@@ -6331,7 +6788,6 @@
                 "text": "number"
               },
               "default": "10",
-              "readonly": true,
               "attribute": "segments"
             },
             {
@@ -6342,7 +6798,6 @@
                 "text": "boolean"
               },
               "default": "true",
-              "readonly": true,
               "attribute": "show-label"
             },
             {
@@ -6353,7 +6808,6 @@
                 "text": "number"
               },
               "default": "1",
-              "readonly": true,
               "attribute": "step"
             },
             {
@@ -6369,7 +6823,6 @@
                 ]
               },
               "default": "'default'",
-              "readonly": true,
               "attribute": "type"
             },
             {
@@ -6631,7 +7084,6 @@
               "type": {
                 "text": "string"
               },
-              "readonly": true,
               "attribute": "action-label"
             },
             {
@@ -6642,7 +7094,6 @@
                 "text": "boolean"
               },
               "default": "false",
-              "readonly": true,
               "attribute": "loading"
             },
             {
@@ -6658,7 +7109,6 @@
                 ]
               },
               "default": "'default'",
-              "readonly": true,
               "attribute": "variant"
             }
           ],
@@ -6844,36 +7294,310 @@
               "description": "Bar background, variant=\"default\". Aliased to --bs-snackbar-bg-default (brandsync-tokens)."
             },
             {
-              "name": "--bs-snackbar-surface-error",
-              "description": "Bar background, variant=\"error\". Aliased to --bs-color-error-container."
+              "name": "--bs-snackbar-surface-error",
+              "description": "Bar background, variant=\"error\". Aliased to --bs-color-error-container."
+            },
+            {
+              "name": "--bs-snackbar-surface-info",
+              "description": "Bar background, variant=\"info\". Aliased to --bs-color-info-container."
+            },
+            {
+              "name": "--bs-snackbar-surface-success",
+              "description": "Bar background, variant=\"success\". Aliased to --bs-color-success-container."
+            },
+            {
+              "name": "--bs-snackbar-surface-warning",
+              "description": "Bar background, variant=\"warning\". Aliased to --bs-color-warning-container."
+            },
+            {
+              "name": "--bs-snackbar-text-error",
+              "description": "Icon/message/close color, variant=\"error\". Aliased to --bs-text-error."
+            },
+            {
+              "name": "--bs-snackbar-text-info",
+              "description": "Icon/message/close color, variant=\"info\". Aliased to --bs-text-info."
+            },
+            {
+              "name": "--bs-snackbar-text-success",
+              "description": "Icon/message/close color, variant=\"success\". Aliased to --bs-text-success."
+            },
+            {
+              "name": "--bs-snackbar-text-warning",
+              "description": "Icon/message/close color, variant=\"warning\". Aliased to --bs-text-warning."
+            }
+          ]
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "BsSnackbar",
+          "declaration": {
+            "name": "BsSnackbar"
+          }
+        },
+        {
+          "kind": "custom-element-definition",
+          "name": "bs-snackbar",
+          "declaration": {
+            "name": "BsSnackbar"
+          }
+        }
+      ]
+    },
+    {
+      "kind": "javascript-module",
+      "path": "src/components/bs-source-link/bs-source-link.tsx",
+      "declarations": [
+        {
+          "kind": "class",
+          "customElement": true,
+          "tagName": "bs-source-link",
+          "name": "BsSourceLink",
+          "description": "A single citation row inside `bs-chatbot-sources-drawer` -- a file icon + filename on the first\nline, the originating system and version on the second, and a trailing \"open\" arrow.\n\n## When to use\n- One row per source Genie cited in a response, slotted into `bs-chatbot-sources-drawer`.\n\n## When not to use\n- Outside the sources drawer context -- this is a purpose-built citation row, not a generic\n  link/list-item component.",
+          "attributes": [
+            {
+              "name": "file-name",
+              "description": "The cited document's filename.",
+              "type": {
+                "text": "string"
+              },
+              "default": "'Source'",
+              "fieldName": "fileName"
+            },
+            {
+              "name": "href",
+              "description": "If set, renders the row as a link that opens this URL; otherwise as a button that only emits `bsOpen`.",
+              "type": {
+                "text": "string"
+              },
+              "fieldName": "href"
+            },
+            {
+              "name": "source-name",
+              "description": "The system/app the document came from (e.g. \"HoltePortalen\").",
+              "type": {
+                "text": "string"
+              },
+              "fieldName": "sourceName"
+            },
+            {
+              "name": "target",
+              "description": "`target` used when `href` is set.",
+              "type": {
+                "text": "string"
+              },
+              "default": "'_blank'",
+              "fieldName": "target"
+            },
+            {
+              "name": "version",
+              "description": "The document's version label (e.g. \"v3.2\"). Omit if the source has no version.",
+              "type": {
+                "text": "string"
+              },
+              "fieldName": "version"
+            }
+          ],
+          "members": [
+            {
+              "kind": "field",
+              "name": "fileName",
+              "description": "The cited document's filename.",
+              "type": {
+                "text": "string"
+              },
+              "default": "'Source'",
+              "attribute": "file-name"
+            },
+            {
+              "kind": "field",
+              "name": "href",
+              "description": "If set, renders the row as a link that opens this URL; otherwise as a button that only emits `bsOpen`.",
+              "type": {
+                "text": "string"
+              },
+              "attribute": "href"
+            },
+            {
+              "kind": "field",
+              "name": "sourceName",
+              "description": "The system/app the document came from (e.g. \"HoltePortalen\").",
+              "type": {
+                "text": "string"
+              },
+              "attribute": "source-name"
+            },
+            {
+              "kind": "field",
+              "name": "target",
+              "description": "`target` used when `href` is set.",
+              "type": {
+                "text": "string"
+              },
+              "default": "'_blank'",
+              "attribute": "target"
+            },
+            {
+              "kind": "field",
+              "name": "version",
+              "description": "The document's version label (e.g. \"v3.2\"). Omit if the source has no version.",
+              "type": {
+                "text": "string"
+              },
+              "attribute": "version"
+            }
+          ],
+          "events": [
+            {
+              "name": "bsOpen",
+              "description": "Fires on click/activation, whether or not `href` is set -- lets the consuming app log or handle the open.",
+              "type": {
+                "text": "CustomEvent<void>"
+              }
+            }
+          ],
+          "slots": [
+            {
+              "name": "icon",
+              "description": "Overrides the default file icon."
+            }
+          ],
+          "cssParts": [
+            {
+              "name": "arrow",
+              "description": "The trailing \"open\" arrow icon."
+            },
+            {
+              "name": "filename",
+              "description": "The filename text."
+            },
+            {
+              "name": "icon",
+              "description": "The leading file-type icon."
+            },
+            {
+              "name": "source",
+              "description": "The source system name."
+            },
+            {
+              "name": "version",
+              "description": "The version label."
+            }
+          ]
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "BsSourceLink",
+          "declaration": {
+            "name": "BsSourceLink"
+          }
+        },
+        {
+          "kind": "custom-element-definition",
+          "name": "bs-source-link",
+          "declaration": {
+            "name": "BsSourceLink"
+          }
+        }
+      ]
+    },
+    {
+      "kind": "javascript-module",
+      "path": "src/components/bs-stepper/bs-stepper/bs-stepper.tsx",
+      "declarations": [
+        {
+          "kind": "class",
+          "customElement": true,
+          "tagName": "bs-stepper",
+          "name": "BsStepper",
+          "description": "A sequence of named steps showing overall progress through a multi-step flow (e.g. a checkout,\nan onboarding wizard) -- each step reads as enabled (not yet reached), current, done, error, or\ndisabled, connected by a rail between them.\n\nThis container is intentionally thin: it renders a `<slot>` for `<bs-stepper-step>` children and\npropagates `currentStep`/`direction`/`showDescription` down to them as JS properties whenever any\nof those change or the slotted children themselves change -- the same \"container pushes state\nonto its slotted children\" pattern `bs-tabs` uses for `selected` and `bs-breadcrumbs` uses for\n`size`. Each step computes its own `enabled`/`current`/`done` state from its position among its\nsiblings relative to `currentStep`, unless that step's own `error`/`disabled` prop overrides it.\n\nThis is a static status display, not an interactive control -- Figma's spec shows no\nhover/pressed treatment on any step, so nothing here is clickable.\n\n## When to use\n- Showing where the user is in a fixed, ordered, multi-step flow.\n\n## When not to use\n- A flow whose steps aren't fixed/known in advance -- a stepper implies the full sequence is\n  already known.\n- As a substitute for actual in-page navigation between steps -- pair this with real controls\n  (Next/Back buttons) elsewhere in the flow, this component only displays status.",
+          "attributes": [
+            {
+              "name": "current-step",
+              "description": "0-indexed: which step is current. Every step before this index reads as \"done\" (unless that\nstep's own `error`/`disabled` overrides it), every step after reads as \"enabled\".",
+              "type": {
+                "text": "number"
+              },
+              "default": "0",
+              "fieldName": "currentStep"
             },
             {
-              "name": "--bs-snackbar-surface-info",
-              "description": "Bar background, variant=\"info\". Aliased to --bs-color-info-container."
+              "name": "direction",
+              "description": "`horizontal` (icon above name/description, connected by a horizontal rail) or `vertical`\n(icon beside name/description, connected by a vertical rail). Propagated to every slotted\n`bs-stepper-step`, and reflected as an attribute so this container's own `:host` CSS can switch\nits `flex-direction` to match -- a bare `<slot>` with no wrapping element (see `render()`)\nmeans the slotted steps' flex-row/column layout comes directly from `:host` here, not from any\nwrapper div.",
+              "type": {
+                "text": "\"horizontal\" | \"vertical\"",
+                "references": [
+                  {
+                    "name": "BsStepperDirection",
+                    "module": "../bs-stepper-step/bs-stepper-step"
+                  }
+                ]
+              },
+              "default": "'horizontal'",
+              "fieldName": "direction"
             },
             {
-              "name": "--bs-snackbar-surface-success",
-              "description": "Bar background, variant=\"success\". Aliased to --bs-color-success-container."
-            },
+              "name": "show-description",
+              "description": "Whether each step's description renders at all. Propagated to every slotted\n`bs-stepper-step`.",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "true",
+              "fieldName": "showDescription"
+            }
+          ],
+          "members": [
             {
-              "name": "--bs-snackbar-surface-warning",
-              "description": "Bar background, variant=\"warning\". Aliased to --bs-color-warning-container."
+              "kind": "field",
+              "name": "currentStep",
+              "description": "0-indexed: which step is current. Every step before this index reads as \"done\" (unless that\nstep's own `error`/`disabled` overrides it), every step after reads as \"enabled\".",
+              "type": {
+                "text": "number"
+              },
+              "default": "0",
+              "attribute": "current-step"
             },
             {
-              "name": "--bs-snackbar-text-error",
-              "description": "Icon/message/close color, variant=\"error\". Aliased to --bs-text-error."
+              "kind": "field",
+              "name": "direction",
+              "description": "`horizontal` (icon above name/description, connected by a horizontal rail) or `vertical`\n(icon beside name/description, connected by a vertical rail). Propagated to every slotted\n`bs-stepper-step`, and reflected as an attribute so this container's own `:host` CSS can switch\nits `flex-direction` to match -- a bare `<slot>` with no wrapping element (see `render()`)\nmeans the slotted steps' flex-row/column layout comes directly from `:host` here, not from any\nwrapper div.",
+              "type": {
+                "text": "\"horizontal\" | \"vertical\"",
+                "references": [
+                  {
+                    "name": "BsStepperDirection",
+                    "module": "../bs-stepper-step/bs-stepper-step"
+                  }
+                ]
+              },
+              "default": "'horizontal'",
+              "attribute": "direction",
+              "reflects": true
             },
             {
-              "name": "--bs-snackbar-text-info",
-              "description": "Icon/message/close color, variant=\"info\". Aliased to --bs-text-info."
-            },
+              "kind": "field",
+              "name": "showDescription",
+              "description": "Whether each step's description renders at all. Propagated to every slotted\n`bs-stepper-step`.",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "true",
+              "attribute": "show-description"
+            }
+          ],
+          "slots": [
             {
-              "name": "--bs-snackbar-text-success",
-              "description": "Icon/message/close color, variant=\"success\". Aliased to --bs-text-success."
-            },
+              "name": "",
+              "description": "Default slot: the `<bs-stepper-step>` elements making up the sequence, in order."
+            }
+          ],
+          "cssProperties": [
             {
-              "name": "--bs-snackbar-text-warning",
-              "description": "Icon/message/close color, variant=\"warning\". Aliased to --bs-text-warning."
+              "name": "--bs-stepper-edge-padding",
+              "description": "Horizontal padding, direction=\"horizontal\" only. Aliased to --bs-spacing-800. Every step's name/description centers under its own icon (see bs-stepper-step.css), including the first and last steps -- whose icons sit flush against this container's own edges. Without this padding, a first/last step's centered text has room to overflow in only one direction and clips against the container edge (confirmed by measuring a real render: a description clipped to a negative x position). This padding exists purely to give that overflow somewhere to go; it isn't a general \"breathing room\" affordance for content that fits."
             }
           ]
         }
@@ -6881,163 +7605,293 @@
       "exports": [
         {
           "kind": "js",
-          "name": "BsSnackbar",
+          "name": "BsStepper",
           "declaration": {
-            "name": "BsSnackbar"
+            "name": "BsStepper"
           }
         },
         {
           "kind": "custom-element-definition",
-          "name": "bs-snackbar",
+          "name": "bs-stepper",
           "declaration": {
-            "name": "BsSnackbar"
+            "name": "BsStepper"
           }
         }
       ]
     },
     {
       "kind": "javascript-module",
-      "path": "src/components/bs-source-link/bs-source-link.tsx",
+      "path": "src/components/bs-stepper/bs-stepper-step/bs-stepper-step.tsx",
       "declarations": [
         {
           "kind": "class",
           "customElement": true,
-          "tagName": "bs-source-link",
-          "name": "BsSourceLink",
-          "description": "A single citation row inside `bs-chatbot-sources-drawer` -- a file icon + filename on the first\nline, the originating system and version on the second, and a trailing \"open\" arrow.\n\n## When to use\n- One row per source Genie cited in a response, slotted into `bs-chatbot-sources-drawer`.\n\n## When not to use\n- Outside the sources drawer context -- this is a purpose-built citation row, not a generic\n  link/list-item component.",
+          "tagName": "bs-stepper-step",
+          "name": "BsStepperStep",
+          "description": "A single step within a `<bs-stepper>` sequence: an icon/indicator plus a name and optional\ndescription, connected to the next step by a trailing rail.\n\n`computedState` is set automatically by the parent `<bs-stepper>` based on this step's position\nrelative to its `currentStep` (before it = \"done\", at it = \"current\", after it = \"enabled\") --\nsame \"container pushes state onto its slotted children\" pattern `bs-tabs` uses for `selected`\nand `bs-breadcrumbs` uses for `size`. This step's own `error`/`disabled` props, when set directly\nby the consumer, override that computed value -- e.g. a step before `currentStep` would normally\nread as \"done\", but `error` on that step wins regardless.\n\nThe trailing rail is owned by this component, not the container: `:host(:last-child)` hides it\non whichever step is visually last, mirroring `bs-breadcrumb`'s own `:host(:first-child)` rule\nfor its leading separator (same technique, opposite end -- see that component for why pure DOM\nposition, not CSS `:last-of-type`, is what actually needs checking here too).\n\n## When to use\n- As a child of `<bs-stepper>`, one per step in the sequence.\n\n## When not to use\n- Standalone, outside a `<bs-stepper>` wrapper -- `computedState`/`direction`/`showDescription`\n  depend on that parent propagating them; alone, this defaults to `enabled`/`horizontal`/`true`.",
           "attributes": [
             {
-              "name": "file-name",
-              "description": "The cited document's filename.",
+              "name": "computed-state",
+              "description": "Set automatically by the parent `<bs-stepper>` from this step's position relative to its\n`currentStep` -- see the class doc above. Can be set directly for a standalone step.",
               "type": {
-                "text": "string"
+                "text": "\"current\" | \"done\" | \"enabled\"",
+                "references": [
+                  {
+                    "name": "BsStepperStepComputedState"
+                  }
+                ]
               },
-              "default": "'Source'",
-              "fieldName": "fileName"
+              "default": "'enabled'",
+              "fieldName": "computedState"
             },
             {
-              "name": "href",
-              "description": "If set, renders the row as a link that opens this URL; otherwise as a button that only emits `bsOpen`.",
+              "name": "description",
+              "description": "Optional supporting text below the name. Only rendered when `showDescription` (propagated\nfrom the parent `<bs-stepper>`) is also true.",
               "type": {
                 "text": "string"
               },
-              "fieldName": "href"
+              "fieldName": "description"
             },
             {
-              "name": "source-name",
-              "description": "The system/app the document came from (e.g. \"HoltePortalen\").",
+              "name": "direction",
+              "description": "Set automatically by the parent `<bs-stepper>`, propagated to every slotted step.",
               "type": {
-                "text": "string"
+                "text": "\"horizontal\" | \"vertical\"",
+                "references": [
+                  {
+                    "name": "BsStepperDirection"
+                  }
+                ]
               },
-              "fieldName": "sourceName"
+              "default": "'horizontal'",
+              "fieldName": "direction"
             },
             {
-              "name": "target",
-              "description": "`target` used when `href` is set.",
+              "name": "disabled",
+              "description": "Shows the disabled treatment for this step, regardless of its `computedState`. Takes priority\nover `error` if both are somehow set.",
               "type": {
-                "text": "string"
+                "text": "boolean"
               },
-              "default": "'_blank'",
-              "fieldName": "target"
+              "default": "false",
+              "fieldName": "disabled"
             },
             {
-              "name": "version",
-              "description": "The document's version label (e.g. \"v3.2\"). Omit if the source has no version.",
+              "name": "error",
+              "description": "Shows the error treatment for this step, regardless of its `computedState`.",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "fieldName": "error"
+            },
+            {
+              "name": "name",
+              "description": "This step's name/title.",
               "type": {
                 "text": "string"
               },
-              "fieldName": "version"
+              "default": "''",
+              "fieldName": "name"
+            },
+            {
+              "name": "show-description",
+              "description": "Set automatically by the parent `<bs-stepper>`, propagated to every slotted step.",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "true",
+              "fieldName": "showDescription"
             }
           ],
           "members": [
             {
               "kind": "field",
-              "name": "fileName",
-              "description": "The cited document's filename.",
+              "name": "computedState",
+              "description": "Set automatically by the parent `<bs-stepper>` from this step's position relative to its\n`currentStep` -- see the class doc above. Can be set directly for a standalone step.",
               "type": {
-                "text": "string"
+                "text": "\"current\" | \"done\" | \"enabled\"",
+                "references": [
+                  {
+                    "name": "BsStepperStepComputedState"
+                  }
+                ]
               },
-              "default": "'Source'",
-              "readonly": true,
-              "attribute": "file-name"
+              "default": "'enabled'",
+              "attribute": "computed-state"
             },
             {
               "kind": "field",
-              "name": "href",
-              "description": "If set, renders the row as a link that opens this URL; otherwise as a button that only emits `bsOpen`.",
+              "name": "description",
+              "description": "Optional supporting text below the name. Only rendered when `showDescription` (propagated\nfrom the parent `<bs-stepper>`) is also true.",
               "type": {
                 "text": "string"
               },
-              "readonly": true,
-              "attribute": "href"
+              "attribute": "description"
             },
             {
               "kind": "field",
-              "name": "sourceName",
-              "description": "The system/app the document came from (e.g. \"HoltePortalen\").",
+              "name": "direction",
+              "description": "Set automatically by the parent `<bs-stepper>`, propagated to every slotted step.",
               "type": {
-                "text": "string"
+                "text": "\"horizontal\" | \"vertical\"",
+                "references": [
+                  {
+                    "name": "BsStepperDirection"
+                  }
+                ]
               },
-              "readonly": true,
-              "attribute": "source-name"
+              "default": "'horizontal'",
+              "attribute": "direction"
             },
             {
               "kind": "field",
-              "name": "target",
-              "description": "`target` used when `href` is set.",
+              "name": "disabled",
+              "description": "Shows the disabled treatment for this step, regardless of its `computedState`. Takes priority\nover `error` if both are somehow set.",
               "type": {
-                "text": "string"
+                "text": "boolean"
               },
-              "default": "'_blank'",
-              "readonly": true,
-              "attribute": "target"
+              "default": "false",
+              "attribute": "disabled"
             },
             {
               "kind": "field",
-              "name": "version",
-              "description": "The document's version label (e.g. \"v3.2\"). Omit if the source has no version.",
+              "name": "error",
+              "description": "Shows the error treatment for this step, regardless of its `computedState`.",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "attribute": "error"
+            },
+            {
+              "kind": "field",
+              "name": "name",
+              "description": "This step's name/title.",
               "type": {
                 "text": "string"
               },
-              "readonly": true,
-              "attribute": "version"
-            }
-          ],
-          "events": [
+              "default": "''",
+              "attribute": "name"
+            },
             {
-              "name": "bsOpen",
-              "description": "Fires on click/activation, whether or not `href` is set -- lets the consuming app log or handle the open.",
+              "kind": "field",
+              "name": "showDescription",
+              "description": "Set automatically by the parent `<bs-stepper>`, propagated to every slotted step.",
               "type": {
-                "text": "CustomEvent<void>"
-              }
+                "text": "boolean"
+              },
+              "default": "true",
+              "attribute": "show-description"
             }
           ],
           "slots": [
             {
-              "name": "icon",
-              "description": "Overrides the default file icon."
+              "name": "",
+              "description": "None: `name`/`description` fully drive the label content."
             }
           ],
           "cssParts": [
             {
-              "name": "arrow",
-              "description": "The trailing \"open\" arrow icon."
+              "name": "connector",
+              "description": "The trailing rail segment (not rendered on the last step)."
             },
             {
-              "name": "filename",
-              "description": "The filename text."
+              "name": "description",
+              "description": "The description text (only rendered when `showDescription` is true and\n`description` is set)."
             },
             {
               "name": "icon",
-              "description": "The leading file-type icon."
+              "description": "The icon/indicator wrapper."
             },
             {
-              "name": "source",
-              "description": "The source system name."
+              "name": "label",
+              "description": "The name+description wrapper."
             },
             {
-              "name": "version",
-              "description": "The version label."
+              "name": "name",
+              "description": "The name text."
+            }
+          ],
+          "cssProperties": [
+            {
+              "name": "--bs-stepper-step-connector-color",
+              "description": "Rail color to the next step. Aliased to --bs-border-default. Figma's spec shows one static rail color regardless of adjacent steps' state -- completion is conveyed by the icons, not the rail."
+            },
+            {
+              "name": "--bs-stepper-step-connector-thickness",
+              "description": "Rail line thickness. 2px, matching Figma exactly."
+            },
+            {
+              "name": "--bs-stepper-step-description-font-weight",
+              "description": "Aliased to --bs-font-weight-regular."
+            },
+            {
+              "name": "--bs-stepper-step-font-size",
+              "description": "Aliased to --bs-font-size-md."
+            },
+            {
+              "name": "--bs-stepper-step-gap",
+              "description": "Gap between the icon/connector row (or column) and the label. Aliased to --bs-spacing-100."
+            },
+            {
+              "name": "--bs-stepper-step-icon-bg-done",
+              "description": "Icon background, state=\"done\". Aliased to --bs-color-primary-default."
+            },
+            {
+              "name": "--bs-stepper-step-icon-border-current",
+              "description": "Icon border, state=\"current\". Aliased to --bs-color-primary-default."
+            },
+            {
+              "name": "--bs-stepper-step-icon-border-disabled",
+              "description": "Icon border, state=\"disabled\". Aliased to --bs-border-neutral-disabled."
+            },
+            {
+              "name": "--bs-stepper-step-icon-border-enabled",
+              "description": "Icon border, state=\"enabled\" (not yet reached). Aliased to --bs-border-default."
+            },
+            {
+              "name": "--bs-stepper-step-icon-border-error",
+              "description": "Icon border, state=\"error\". Aliased to --bs-border-error."
+            },
+            {
+              "name": "--bs-stepper-step-icon-border-width",
+              "description": "Border width of the icon circle. 1.5px, matching Figma exactly."
+            },
+            {
+              "name": "--bs-stepper-step-icon-color-done",
+              "description": "Checkmark icon color, state=\"done\". Aliased to --bs-text-on-action."
+            },
+            {
+              "name": "--bs-stepper-step-icon-color-error",
+              "description": "Exclamation icon color, state=\"error\". Aliased to --bs-border-error."
+            },
+            {
+              "name": "--bs-stepper-step-icon-dot-current",
+              "description": "Inner filled dot color, state=\"current\". Aliased to --bs-color-primary-default."
+            },
+            {
+              "name": "--bs-stepper-step-icon-size",
+              "description": "Width/height of the icon/indicator circle. 24px, matching Figma exactly."
+            },
+            {
+              "name": "--bs-stepper-step-line-height",
+              "description": "Aliased to --bs-line-height-body-md."
+            },
+            {
+              "name": "--bs-stepper-step-name-font-weight",
+              "description": "Aliased to --bs-font-weight-semibold."
+            },
+            {
+              "name": "--bs-stepper-step-text-active",
+              "description": "Name/description color, state=\"current\"/\"done\". Aliased to --bs-text-default."
+            },
+            {
+              "name": "--bs-stepper-step-text-disabled",
+              "description": "Name/description color, state=\"disabled\". Aliased to --bs-text-on-disabled."
+            },
+            {
+              "name": "--bs-stepper-step-text-enabled",
+              "description": "Name/description color, state=\"enabled\"/\"error\". Aliased to --bs-text-muted."
             }
           ]
         }
@@ -7045,16 +7899,16 @@
       "exports": [
         {
           "kind": "js",
-          "name": "BsSourceLink",
+          "name": "BsStepperStep",
           "declaration": {
-            "name": "BsSourceLink"
+            "name": "BsStepperStep"
           }
         },
         {
           "kind": "custom-element-definition",
-          "name": "bs-source-link",
+          "name": "bs-stepper-step",
           "declaration": {
-            "name": "BsSourceLink"
+            "name": "BsStepperStep"
           }
         }
       ]
@@ -7121,7 +7975,6 @@
                 "text": "string"
               },
               "default": "null",
-              "readonly": true,
               "attribute": "aria-label"
             },
             {
@@ -7143,7 +7996,6 @@
                 "text": "boolean"
               },
               "default": "false",
-              "readonly": true,
               "attribute": "disabled"
             },
             {
@@ -7159,7 +8011,6 @@
                 ]
               },
               "default": "'lg'",
-              "readonly": true,
               "attribute": "size"
             }
           ],
@@ -7375,7 +8226,6 @@
                 "text": "string"
               },
               "default": "null",
-              "readonly": true,
               "attribute": "aria-label"
             },
             {
@@ -7386,7 +8236,6 @@
                 "text": "boolean"
               },
               "default": "false",
-              "readonly": true,
               "attribute": "disabled"
             },
             {
@@ -7402,7 +8251,6 @@
                 ]
               },
               "default": "'start'",
-              "readonly": true,
               "attribute": "icon-position"
             },
             {
@@ -7413,7 +8261,6 @@
                 "text": "boolean"
               },
               "default": "false",
-              "readonly": true,
               "attribute": "selected",
               "reflects": true
             }
@@ -7622,7 +8469,6 @@
                 ]
               },
               "default": "'horizontal'",
-              "readonly": true,
               "attribute": "orientation"
             },
             {
@@ -7638,7 +8484,6 @@
                 ]
               },
               "default": "'bs-tab'",
-              "readonly": true,
               "attribute": "type"
             }
           ],
@@ -7725,7 +8570,6 @@
                 "text": "\"top\""
               },
               "default": "'top'",
-              "readonly": true,
               "attribute": "placement"
             }
           ],