@brandsync/wc 1.14.0 → 1.16.0

package/dist/types/components.d.ts

@@ -23,13 +23,16 @@ import { BsChipInformativeColor, BsChipInformativeSize } from "./components/bs-c
 import { BsChipInputSize } from "./components/bs-chip/bs-chip-input/bs-chip-input";
 import { BsComposerState, BsComposerVariant } from "./components/bs-composer/bs-composer";
 import { BsComposerStatusBannerType } from "./components/bs-composer-status-banner/bs-composer-status-banner";
+import { BsContainerSize } from "./components/bs-container/bs-container";
 import { BsCookieCategory, BsCookieChoices, BsCookieConsentType } from "./components/bs-cookie-consent/bs-cookie-consent";
 import { BsDataTableColumn, BsDataTableRow } from "./components/bs-data-table/bs-data-table";
 import { BsDatepickerChange } from "./components/bs-datepicker/bs-datepicker";
 import { BsDialogSize } from "./components/bs-dialog/bs-dialog";
+import { BsDividerInset, BsDividerOrientation, BsDividerVariant } from "./components/bs-divider/bs-divider";
 import { BsErrorPageType } from "./components/bs-error-page/bs-error-page";
 import { BsFileUploadDirection } from "./components/bs-file-upload/bs-file-upload";
 import { BsFileUploadItemState } from "./components/bs-file-upload-item/bs-file-upload-item";
+import { BsGridAlign } from "./components/bs-grid/bs-grid";
 import { BsIconButtonSize, BsIconButtonVariant } from "./components/bs-button/bs-icon-button/bs-icon-button";
 import { BsIconTileIntent, BsIconTileSize } from "./components/bs-icon-tile/bs-icon-tile";
 import { BsLogoBackground, BsLogoVariant } from "./components/bs-logo/bs-logo";
@@ -48,6 +51,7 @@ import { BsSliderType } from "./components/bs-slider/bs-slider";
 import { BsSnackbarVariant } from "./components/bs-snackbar/bs-snackbar";
 import { BsSpinnerSize } from "./components/bs-spinner/bs-spinner";
 import { BsSplitPaneOrientation } from "./components/bs-split-pane/bs-split-pane";
+import { BsStackAlign, BsStackDirection, BsStackJustify } from "./components/bs-stack/bs-stack";
 import { BsStepperDirection } from "./components/bs-stepper/bs-stepper-step/bs-stepper-step";
 import { BsStepperDirection as BsStepperDirection1, BsStepperStepComputedState } from "./components/bs-stepper/bs-stepper-step/bs-stepper-step";
 import { BsSwitchSize } from "./components/bs-switch/bs-switch";
@@ -77,13 +81,16 @@ export { BsChipInformativeColor, BsChipInformativeSize } from "./components/bs-c
 export { BsChipInputSize } from "./components/bs-chip/bs-chip-input/bs-chip-input";
 export { BsComposerState, BsComposerVariant } from "./components/bs-composer/bs-composer";
 export { BsComposerStatusBannerType } from "./components/bs-composer-status-banner/bs-composer-status-banner";
+export { BsContainerSize } from "./components/bs-container/bs-container";
 export { BsCookieCategory, BsCookieChoices, BsCookieConsentType } from "./components/bs-cookie-consent/bs-cookie-consent";
 export { BsDataTableColumn, BsDataTableRow } from "./components/bs-data-table/bs-data-table";
 export { BsDatepickerChange } from "./components/bs-datepicker/bs-datepicker";
 export { BsDialogSize } from "./components/bs-dialog/bs-dialog";
+export { BsDividerInset, BsDividerOrientation, BsDividerVariant } from "./components/bs-divider/bs-divider";
 export { BsErrorPageType } from "./components/bs-error-page/bs-error-page";
 export { BsFileUploadDirection } from "./components/bs-file-upload/bs-file-upload";
 export { BsFileUploadItemState } from "./components/bs-file-upload-item/bs-file-upload-item";
+export { BsGridAlign } from "./components/bs-grid/bs-grid";
 export { BsIconButtonSize, BsIconButtonVariant } from "./components/bs-button/bs-icon-button/bs-icon-button";
 export { BsIconTileIntent, BsIconTileSize } from "./components/bs-icon-tile/bs-icon-tile";
 export { BsLogoBackground, BsLogoVariant } from "./components/bs-logo/bs-logo";
@@ -102,6 +109,7 @@ export { BsSliderType } from "./components/bs-slider/bs-slider";
 export { BsSnackbarVariant } from "./components/bs-snackbar/bs-snackbar";
 export { BsSpinnerSize } from "./components/bs-spinner/bs-spinner";
 export { BsSplitPaneOrientation } from "./components/bs-split-pane/bs-split-pane";
+export { BsStackAlign, BsStackDirection, BsStackJustify } from "./components/bs-stack/bs-stack";
 export { BsStepperDirection } from "./components/bs-stepper/bs-stepper-step/bs-stepper-step";
 export { BsStepperDirection as BsStepperDirection1, BsStepperStepComputedState } from "./components/bs-stepper/bs-stepper-step/bs-stepper-step";
 export { BsSwitchSize } from "./components/bs-switch/bs-switch";
@@ -253,6 +261,34 @@ export namespace Components {
          */
         "label": string;
     }
+    /**
+     * The page frame: a header across the top, and below it a navigation | main | aside row, laid out
+     * with CSS grid. The main column scrolls independently of the header and the side columns.
+     * Layout only. Compose it from the existing shell components: put a `bs-navigation-header`
+     * (usually `alignment="with-navigation-drawer"`) in `header` and a `bs-navigation-drawer` in
+     * `navigation`. The drawer sizes itself (expanded or collapsed rail); the shell reserves an `auto`
+     * track for it, so there is no `navigationWidth` prop. `bs-navigation-header` has no `collapsed`
+     * prop, so there is no collapse state to mirror and the shell does not listen to `bsCollapse`: the
+     * auto track follows the drawer's width on its own.
+     * The shell creates no landmarks besides `<main>`; the slotted header and drawer bring their own
+     * `banner` and `navigation` roles.
+     * ## When to use
+     * - The outer frame of an application page with a header and side navigation.
+     * ## When not to use
+     * - Content layout inside the page (use `bs-grid`) or resizable panes (use `bs-split-pane`).
+     * - Pages that already have their own `<main>`; the shell would add a duplicate landmark.
+     * @prop --bs-app-shell-bg - Shell background. Aliased to `--bs-surface-base`.
+     * @prop --bs-app-shell-color - Text colour. Aliased to `--bs-text-default`.
+     * @prop --bs-app-shell-main-padding - Padding of the main area. Aliased to `--bs-spacing-400`.
+     * @prop --bs-app-shell-aside-width - Width of the aside column. Defaults to `auto` (zero when empty).
+     */
+    interface BsAppShell {
+        /**
+          * When true the host is `height: 100%`; when false it is content-sized with `min-height: 100vh`.
+          * @default true
+         */
+        "fullHeight": boolean;
+    }
     /**
      * A single file attachment preview for `bs-composer` -- an image thumbnail, or a filename card
      * with a colored file-type badge (PDF/Document), with an optional upload-in-progress spinner and
@@ -1484,6 +1520,28 @@ export namespace Components {
          */
         "type": BsComposerStatusBannerType;
     }
+    /**
+     * A centred wrapper that limits content width to a breakpoint and adds horizontal padding.
+     * ## When to use
+     * - Constraining page or section content to a readable, consistent maximum width.
+     * ## When not to use
+     * - Arranging children relative to each other (use `bs-stack`).
+     * - Full-bleed regions such as hero backgrounds (use `size="fluid"` or no container).
+     * @prop --bs-container-max-width - Maximum width. Aliased to the `--bs-breakpoint-*` token for `size`; `none` for `fluid`.
+     * @prop --bs-container-padding - Horizontal padding. Aliased to the `padding` spacing token (default `--bs-spacing-300`).
+     */
+    interface BsContainer {
+        /**
+          * Spacing token name for horizontal padding (e.g. `300` => `--bs-spacing-300`). Invalid values fall back to `300`.
+          * @default '300'
+         */
+        "padding": string;
+        /**
+          * Maximum width, taken from the breakpoint tokens. `fluid` removes the limit.
+          * @default 'xl'
+         */
+        "size": BsContainerSize;
+    }
     /**
      * A cookie consent prompt in four forms, matching the Figma "Cookie consent" component:
      * - `banner` -- a wide bar: icon, heading, text, policy link, and Customise / Reject optional / Accept
@@ -1759,6 +1817,39 @@ export namespace Components {
          */
         "size": BsDialogSize;
     }
+    /**
+     * A thin line that separates content, horizontally or vertically.
+     * ## When to use
+     * - Separating groups of related content in a list, menu, toolbar or card.
+     * ## When not to use
+     * - Adding vertical space between blocks (use `bs-stack` gap or spacing tokens).
+     * - Drawing a border around a surface (use `bs-card`).
+     * @prop --bs-divider-thickness - Line thickness. Defaults to `1px`.
+     * @prop --bs-divider-color - Line colour. Aliased to `--bs-border-neutral-container` (`default`) or `--bs-neutral-100` (`subtle`).
+     * @prop --bs-divider-inset - Indent applied by `inset`. Aliased to `--bs-spacing-300`.
+     */
+    interface BsDivider {
+        /**
+          * Purely visual: hides the divider from assistive technology instead of exposing a separator.
+          * @default false
+         */
+        "decorative": boolean;
+        /**
+          * Indents the line from its start edge, or from both edges.
+          * @default 'none'
+         */
+        "inset": BsDividerInset;
+        /**
+          * Direction of the line. A vertical divider stretches to the height of its container.
+          * @default 'horizontal'
+         */
+        "orientation": BsDividerOrientation;
+        /**
+          * Visual weight of the line.
+          * @default 'default'
+         */
+        "variant": BsDividerVariant;
+    }
     /**
      * A full-block page for when the user can't get to what they asked for: page not found (404), a server
      * error (500), no access (403), planned maintenance, or no internet connection. Matches the Figma
@@ -1914,6 +2005,53 @@ export namespace Components {
          */
         "thumbnailSrc"?: string;
     }
+    /**
+     * A CSS grid layout wrapper. Children are placed in equal-width columns with a token-based gap.
+     * `columns` takes either a number (`"3"` becomes `repeat(3, minmax(0, 1fr))`) or any raw
+     * `grid-template-columns` value (`"200px 1fr"`). `minColumnWidth` is the responsive mechanism: it
+     * switches to `repeat(auto-fit, minmax(min(100%, X), 1fr))`, so the column count adapts to the
+     * container width and `columns` is ignored. There are deliberately no per-breakpoint props in v1.
+     * `gap`, `rowGap` and `columnGap` take spacing token names (`"200"` maps to `var(--bs-spacing-200)`);
+     * unknown names fall back to `100`.
+     * ## When to use
+     * - Card grids, form field grids and dashboards where items share equal column tracks.
+     * - Responsive galleries via `minColumnWidth`.
+     * ## When not to use
+     * - A single row or column of items with no wrapping (plain flex).
+     * - Resizable multi-pane layouts (use `bs-split-pane`) or the page frame (use `bs-app-shell`).
+     * @prop --bs-grid-gap - Gap on both axes. Overrides the `gap` prop's token (default `--bs-spacing-100`).
+     * @prop --bs-grid-row-gap - Row gap. Overrides `--bs-grid-gap` and the `rowGap` prop's token.
+     * @prop --bs-grid-column-gap - Column gap. Overrides `--bs-grid-gap` and the `columnGap` prop's token.
+     */
+    interface BsGrid {
+        /**
+          * Block-axis alignment of items within their cell.
+          * @default 'stretch'
+         */
+        "align": BsGridAlign;
+        /**
+          * Spacing token name for the column gap; overrides `gap` for columns.
+         */
+        "columnGap"?: string;
+        /**
+          * A number of equal columns (`"3"`), or a raw `grid-template-columns` value. Ignored when `minColumnWidth` is set.
+          * @default '1'
+         */
+        "columns": string;
+        /**
+          * Spacing token name for the gap on both axes, e.g. `"200"` for `--bs-spacing-200`.
+          * @default '100'
+         */
+        "gap": string;
+        /**
+          * CSS length (e.g. `240px`). Switches to auto-fit columns at least this wide and overrides `columns`.
+         */
+        "minColumnWidth"?: string;
+        /**
+          * Spacing token name for the row gap; overrides `gap` for rows.
+         */
+        "rowGap"?: string;
+    }
     /**
      * A clickable, icon-only action element -- the icon-only sibling of `bs-button`, sharing the same
      * 8 visual variants and color language, but ALWAYS rendering just a single icon, never a label.
@@ -2171,6 +2309,125 @@ export namespace Components {
          */
         "value": string;
     }
+    /**
+     * A vertical list of `bs-list-item` rows, optionally single-select.
+     * ## When to use
+     * - Records, people, files or options shown as rows with leading media and descriptions.
+     * - `selectable` for a single-choice list (e.g. a conversation list next to a detail pane).
+     * ## When not to use
+     * - A popup list of actions -- use `bs-menu`.
+     * - Navigation between app sections -- use `bs-navigation-drawer`.
+     * - Multi-column, sortable or paged data -- use `bs-data-table`.
+     * Built from `bs-list-item` children (light DOM; the list never moves nodes).
+     * @prop --bs-list-gap - Gap between rows. Defaults to `0`.
+     * @prop --bs-list-divider-color - Divider colour when `dividers` is set. Aliased to `--bs-border-neutral-container`.
+     */
+    interface BsList {
+        /**
+          * Accessible name of the list.
+          * @default null
+         */
+        "ariaLabel": string | null;
+        /**
+          * Draws a 1px separator between rows.
+          * @default false
+         */
+        "dividers": boolean;
+        /**
+          * Single-selection mode: role="listbox", rows are `option`s with roving tabindex.
+          * @default false
+         */
+        "selectable": boolean;
+        /**
+          * `value` of the selected item (selectable mode).
+          * @default null
+         */
+        "value": string | null;
+    }
+    /**
+     * A single row of a list: optional leading media (avatar, icon, image), a label, a description and
+     * optional support text, and an optional trailing caret or custom trailing content.
+     * ## When to use
+     * - As a child of `bs-list`, one per record, person, file or option.
+     * - Standalone as a plain information row (non-interactive), or with `interactive` as a button-like row.
+     * ## When not to use
+     * - A popup list of actions -- use `bs-menu` / `bs-menu-item`.
+     * - App navigation with an active route -- use `bs-navigation-drawer-item`.
+     * - Tabular data with columns, sorting or paging -- use `bs-data-table`.
+     * Composed from: leading media (`bs-avatar`) and trailing controls (`bs-icon-button`) are supplied by the
+     * consumer through the `leading` and `trailing` slots; the row itself only reserves layout. The default
+     * trailing caret is inline SVG.
+     * Roles are driven by the parent `bs-list` (via `selectionRole`). Standalone, the row has no role
+     * (`listitem` is only valid inside a list) unless `interactive` is set, which makes it a focusable
+     * `role="button"`.
+     * @prop --bs-list-item-min-height - Minimum row height. Aliased to `--bs-spacing-1000`.
+     * @prop --bs-list-item-padding-y - Aliased to `--bs-spacing-150`.
+     * @prop --bs-list-item-padding-x - Aliased to `--bs-spacing-200`.
+     * @prop --bs-list-item-gap - Gap between leading, content and trailing. Aliased to `--bs-spacing-200`.
+     * @prop --bs-list-item-content-gap - Gap between text lines. Aliased to `--bs-spacing-25`.
+     * @prop --bs-list-item-radius - Aliased to `--bs-border-radius-100`.
+     * @prop --bs-list-item-bg - Enabled background. `transparent`.
+     * @prop --bs-list-item-bg-hover - Aliased to `--bs-surface-hover`.
+     * @prop --bs-list-item-bg-pressed - Aliased to `--bs-surface-pressed`.
+     * @prop --bs-list-item-bg-focus - Aliased to `--bs-surface-focus`.
+     * @prop --bs-list-item-bg-selected - Aliased to `--bs-surface-selected`.
+     * @prop --bs-list-item-bg-selected-hover - Aliased to `--bs-surface-selected-hover`.
+     * @prop --bs-list-item-bg-selected-pressed - Aliased to `--bs-surface-selected-pressed`.
+     * @prop --bs-list-item-bg-selected-focus - Aliased to `--bs-surface-selected-focus`.
+     * @prop --bs-list-item-bg-disabled - Aliased to `--bs-surface-action-disabled`.
+     * @prop --bs-list-item-color - Text colour. Aliased to `--bs-text-default`.
+     * @prop --bs-list-item-color-disabled - Aliased to `--bs-text-on-disabled`.
+     * @prop --bs-list-item-focus-ring - Focus ring colour. Aliased to `--bs-border-neutral-focus`.
+     * @prop --bs-list-item-image-width - Leading image width. 72px.
+     * @prop --bs-list-item-image-height - Leading image height. 56px.
+     */
+    interface BsListItem {
+        /**
+          * Second text line (the "paragraph").
+          * @default null
+         */
+        "description": string | null;
+        /**
+          * Disables the row: dimmed, not focusable, no click event.
+          * @default false
+         */
+        "disabled": boolean;
+        /**
+          * Makes a standalone row a focusable `role="button"` that emits `bsItemClick`.
+          * @default false
+         */
+        "interactive": boolean;
+        /**
+          * First text line (semibold).
+          * @default null
+         */
+        "label": string | null;
+        /**
+          * Marks the row as selected. Managed by the parent `bs-list` when it is `selectable`.
+          * @default false
+         */
+        "selected": boolean;
+        /**
+          * Set by the parent `bs-list`: `listitem` (plain list) or `option` (selectable list). Do not set by hand.
+          * @default null
+         */
+        "selectionRole": 'listitem' | 'option' | null;
+        /**
+          * Shows a trailing caret (unless the `trailing` slot has content).
+          * @default false
+         */
+        "showArrow": boolean;
+        /**
+          * Optional third text line.
+          * @default null
+         */
+        "supportText": string | null;
+        /**
+          * Identifies the item; emitted by `bsItemClick` and matched against `bs-list`'s `value`.
+          * @default null
+         */
+        "value": string | null;
+    }
     /**
      * The BrandSync brand mark, as its own standalone component -- shared by `bs-navigation-header`
      * and `bs-navigation-drawer`, which used to each render their own duplicated copy of this SVG
@@ -3526,6 +3783,52 @@ export namespace Components {
          */
         "toggleCollapsed": () => Promise<void>;
     }
+    /**
+     * A flex layout that arranges its children in a row or column with a token-based gap, optionally
+     * drawing a divider between children.
+     * Built from: `bs-divider` (when `divider` is set).
+     * With `divider`, each child is given a generated `slot="bs-stack-item-N"` attribute (plus a
+     * `data-bs-stack-item` marker) so a divider can be rendered between the named slots. Light-DOM
+     * nodes are never moved; the attributes are removed again when `divider` is turned off.
+     * ## When to use
+     * - Spacing and aligning a short run of siblings (form fields, button rows, card content).
+     * ## When not to use
+     * - Two-dimensional grids (use CSS grid).
+     * - Resizable panes (use `bs-split-pane`).
+     * @prop --bs-stack-gap - Space between items. Defaults from the `gap` prop (`--bs-spacing-<gap>`); may be overridden directly.
+     */
+    interface BsStack {
+        /**
+          * Cross-axis alignment.
+          * @default 'stretch'
+         */
+        "align": BsStackAlign;
+        /**
+          * Main axis: `vertical` stacks children in a column, `horizontal` in a row.
+          * @default 'vertical'
+         */
+        "direction": BsStackDirection;
+        /**
+          * Renders a decorative `bs-divider` between each child.
+          * @default false
+         */
+        "divider": boolean;
+        /**
+          * Spacing token name (e.g. `200` => `--bs-spacing-200`). Invalid values fall back to `100`.
+          * @default '100'
+         */
+        "gap": string;
+        /**
+          * Main-axis distribution.
+          * @default 'start'
+         */
+        "justify": BsStackJustify;
+        /**
+          * Lets items wrap onto further lines.
+          * @default false
+         */
+        "wrap": boolean;
+    }
     /**
      * A sequence of named steps showing overall progress through a multi-step flow (e.g. a checkout,
      * an onboarding wizard) -- each step reads as enabled (not yet reached), current, done, error, or
@@ -3905,6 +4208,87 @@ export namespace Components {
          */
         "text": string;
     }
+    /**
+     * A hierarchical list of `bs-tree-item` rows with single selection, expand/collapse and the
+     * WAI-ARIA tree keyboard pattern.
+     * The tree owns `role="tree"`, the roving `tabindex` (exactly one enabled, visible item is
+     * tabbable: the selected one, otherwise the first), selection (kept in sync with each item's
+     * `selected`) and keyboard navigation over the visible (rendered, non-disabled) items. Items own
+     * their expansion state and emit `bsSelect` / `bsToggle`.
+     * Built from: `bs-tree-item` rows.
+     */
+    interface BsTree {
+        /**
+          * Accessible name of the tree. Bound onto the internal `role="tree"` element (an `aria-label` on the host would not reach it).
+          * @default null
+         */
+        "ariaLabel": string | null;
+        /**
+          * Collapses every parent item.
+         */
+        "collapseAll": () => Promise<void>;
+        /**
+          * Expands every parent item.
+         */
+        "expandAll": () => Promise<void>;
+        /**
+          * When `false`, rows do not select (clicks and Enter/Space do nothing) but parents still expand and collapse.
+          * @default true
+         */
+        "selectable": boolean;
+        /**
+          * The `value` (or, when empty, the `label`) of the selected item. Two-way synced with each item's `selected` (single selection). Setting it from code does not emit `bsChange`.
+          * @default ''
+         */
+        "value": string;
+    }
+    /**
+     * A single row of a `bs-tree`. An item that contains child `bs-tree-item` elements is a parent
+     * (it gets an expand/collapse caret and a folder icon); an item without children is a leaf (no
+     * caret, file icon).
+     * The host carries `role="treeitem"` and the `aria-*` state; the owning `bs-tree` manages the
+     * roving `tabindex`, selection and keyboard navigation. Nesting depth is computed automatically
+     * from the number of ancestor `bs-tree-item` elements and exposed as `aria-level` -- it is not a
+     * prop. Clicking the row selects it; clicking the caret (or pressing Right/Left in a tree) toggles
+     * expansion -- the two are deliberately separate.
+     * Built from: inline SVG icons only (no existing `bs-*` component covers a tree row).
+     */
+    interface BsTreeItem {
+        /**
+          * Disables the row: not focusable, ignores clicks, dimmed. Reflected.
+          * @default false
+         */
+        "disabled": boolean;
+        /**
+          * Whether the child items are shown. Only meaningful for parents. Mutable: the caret, the keyboard and the owning tree toggle it. Reflected.
+          * @default false
+         */
+        "expanded": boolean;
+        /**
+          * The row's text. Use the `label` slot for rich content.
+          * @default ''
+         */
+        "label": string;
+        /**
+          * Marks the row as selected. Owned by the tree (single selection, synced with its `value`). Reflected.
+          * @default false
+         */
+        "selected": boolean;
+        /**
+          * Sets `expanded` as a user action: updates the prop and emits `bsToggle`. No-op for leaves, disabled items, or when the value would not change.
+         */
+        "setExpanded": (next: boolean) => Promise<void>;
+        /**
+          * Shows the leading icon (default folder / file, or the `icon` slot).
+          * @default true
+         */
+        "showIcon": boolean;
+        /**
+          * Identifier used in events and for the tree's `value`. Falls back to `label` when empty.
+          * @default ''
+         */
+        "value": string;
+    }
     /**
      * A product's "What's new" surface, in three forms matching the Figma component:
      * - `feed` -- a docked panel: heading, "Mark all as read", filter tabs, the list of updates (each a
@@ -4198,6 +4582,14 @@ export interface BsInputCustomEvent<T> extends CustomEvent<T> {
     detail: T;
     target: HTMLBsInputElement;
 }
+export interface BsListCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLBsListElement;
+}
+export interface BsListItemCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLBsListItemElement;
+}
 export interface BsMenuItemCustomEvent<T> extends CustomEvent<T> {
     detail: T;
     target: HTMLBsMenuItemElement;
@@ -4282,6 +4674,14 @@ export interface BsToastCustomEvent<T> extends CustomEvent<T> {
     detail: T;
     target: HTMLBsToastElement;
 }
+export interface BsTreeCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLBsTreeElement;
+}
+export interface BsTreeItemCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLBsTreeItemElement;
+}
 export interface BsWhatsNewCustomEvent<T> extends CustomEvent<T> {
     detail: T;
     target: HTMLBsWhatsNewElement;
@@ -4417,6 +4817,33 @@ declare global {
         prototype: HTMLBsAiThinkingElement;
         new (): HTMLBsAiThinkingElement;
     };
+    /**
+     * The page frame: a header across the top, and below it a navigation | main | aside row, laid out
+     * with CSS grid. The main column scrolls independently of the header and the side columns.
+     * Layout only. Compose it from the existing shell components: put a `bs-navigation-header`
+     * (usually `alignment="with-navigation-drawer"`) in `header` and a `bs-navigation-drawer` in
+     * `navigation`. The drawer sizes itself (expanded or collapsed rail); the shell reserves an `auto`
+     * track for it, so there is no `navigationWidth` prop. `bs-navigation-header` has no `collapsed`
+     * prop, so there is no collapse state to mirror and the shell does not listen to `bsCollapse`: the
+     * auto track follows the drawer's width on its own.
+     * The shell creates no landmarks besides `<main>`; the slotted header and drawer bring their own
+     * `banner` and `navigation` roles.
+     * ## When to use
+     * - The outer frame of an application page with a header and side navigation.
+     * ## When not to use
+     * - Content layout inside the page (use `bs-grid`) or resizable panes (use `bs-split-pane`).
+     * - Pages that already have their own `<main>`; the shell would add a duplicate landmark.
+     * @prop --bs-app-shell-bg - Shell background. Aliased to `--bs-surface-base`.
+     * @prop --bs-app-shell-color - Text colour. Aliased to `--bs-text-default`.
+     * @prop --bs-app-shell-main-padding - Padding of the main area. Aliased to `--bs-spacing-400`.
+     * @prop --bs-app-shell-aside-width - Width of the aside column. Defaults to `auto` (zero when empty).
+     */
+    interface HTMLBsAppShellElement extends Components.BsAppShell, HTMLStencilElement {
+    }
+    var HTMLBsAppShellElement: {
+        prototype: HTMLBsAppShellElement;
+        new (): HTMLBsAppShellElement;
+    };
     interface HTMLBsAttachmentElementEventMap {
         "bsRemove": void;
     }
@@ -5277,6 +5704,22 @@ declare global {
         prototype: HTMLBsComposerStatusBannerElement;
         new (): HTMLBsComposerStatusBannerElement;
     };
+    /**
+     * A centred wrapper that limits content width to a breakpoint and adds horizontal padding.
+     * ## When to use
+     * - Constraining page or section content to a readable, consistent maximum width.
+     * ## When not to use
+     * - Arranging children relative to each other (use `bs-stack`).
+     * - Full-bleed regions such as hero backgrounds (use `size="fluid"` or no container).
+     * @prop --bs-container-max-width - Maximum width. Aliased to the `--bs-breakpoint-*` token for `size`; `none` for `fluid`.
+     * @prop --bs-container-padding - Horizontal padding. Aliased to the `padding` spacing token (default `--bs-spacing-300`).
+     */
+    interface HTMLBsContainerElement extends Components.BsContainer, HTMLStencilElement {
+    }
+    var HTMLBsContainerElement: {
+        prototype: HTMLBsContainerElement;
+        new (): HTMLBsContainerElement;
+    };
     interface HTMLBsCookieConsentElementEventMap {
         "bsAccept": { choices: BsCookieChoices };
         "bsReject": { choices: BsCookieChoices };
@@ -5423,6 +5866,23 @@ declare global {
         prototype: HTMLBsDialogElement;
         new (): HTMLBsDialogElement;
     };
+    /**
+     * A thin line that separates content, horizontally or vertically.
+     * ## When to use
+     * - Separating groups of related content in a list, menu, toolbar or card.
+     * ## When not to use
+     * - Adding vertical space between blocks (use `bs-stack` gap or spacing tokens).
+     * - Drawing a border around a surface (use `bs-card`).
+     * @prop --bs-divider-thickness - Line thickness. Defaults to `1px`.
+     * @prop --bs-divider-color - Line colour. Aliased to `--bs-border-neutral-container` (`default`) or `--bs-neutral-100` (`subtle`).
+     * @prop --bs-divider-inset - Indent applied by `inset`. Aliased to `--bs-spacing-300`.
+     */
+    interface HTMLBsDividerElement extends Components.BsDivider, HTMLStencilElement {
+    }
+    var HTMLBsDividerElement: {
+        prototype: HTMLBsDividerElement;
+        new (): HTMLBsDividerElement;
+    };
     interface HTMLBsErrorPageElementEventMap {
         "bsPrimary": void;
         "bsSecondary": void;
@@ -5513,6 +5973,30 @@ declare global {
         prototype: HTMLBsFileUploadItemElement;
         new (): HTMLBsFileUploadItemElement;
     };
+    /**
+     * A CSS grid layout wrapper. Children are placed in equal-width columns with a token-based gap.
+     * `columns` takes either a number (`"3"` becomes `repeat(3, minmax(0, 1fr))`) or any raw
+     * `grid-template-columns` value (`"200px 1fr"`). `minColumnWidth` is the responsive mechanism: it
+     * switches to `repeat(auto-fit, minmax(min(100%, X), 1fr))`, so the column count adapts to the
+     * container width and `columns` is ignored. There are deliberately no per-breakpoint props in v1.
+     * `gap`, `rowGap` and `columnGap` take spacing token names (`"200"` maps to `var(--bs-spacing-200)`);
+     * unknown names fall back to `100`.
+     * ## When to use
+     * - Card grids, form field grids and dashboards where items share equal column tracks.
+     * - Responsive galleries via `minColumnWidth`.
+     * ## When not to use
+     * - A single row or column of items with no wrapping (plain flex).
+     * - Resizable multi-pane layouts (use `bs-split-pane`) or the page frame (use `bs-app-shell`).
+     * @prop --bs-grid-gap - Gap on both axes. Overrides the `gap` prop's token (default `--bs-spacing-100`).
+     * @prop --bs-grid-row-gap - Row gap. Overrides `--bs-grid-gap` and the `rowGap` prop's token.
+     * @prop --bs-grid-column-gap - Column gap. Overrides `--bs-grid-gap` and the `columnGap` prop's token.
+     */
+    interface HTMLBsGridElement extends Components.BsGrid, HTMLStencilElement {
+    }
+    var HTMLBsGridElement: {
+        prototype: HTMLBsGridElement;
+        new (): HTMLBsGridElement;
+    };
     /**
      * A clickable, icon-only action element -- the icon-only sibling of `bs-button`, sharing the same
      * 8 visual variants and color language, but ALWAYS rendering just a single icon, never a label.
@@ -5636,6 +6120,90 @@ declare global {
         prototype: HTMLBsInputElement;
         new (): HTMLBsInputElement;
     };
+    interface HTMLBsListElementEventMap {
+        "bsChange": string | null;
+    }
+    /**
+     * A vertical list of `bs-list-item` rows, optionally single-select.
+     * ## When to use
+     * - Records, people, files or options shown as rows with leading media and descriptions.
+     * - `selectable` for a single-choice list (e.g. a conversation list next to a detail pane).
+     * ## When not to use
+     * - A popup list of actions -- use `bs-menu`.
+     * - Navigation between app sections -- use `bs-navigation-drawer`.
+     * - Multi-column, sortable or paged data -- use `bs-data-table`.
+     * Built from `bs-list-item` children (light DOM; the list never moves nodes).
+     * @prop --bs-list-gap - Gap between rows. Defaults to `0`.
+     * @prop --bs-list-divider-color - Divider colour when `dividers` is set. Aliased to `--bs-border-neutral-container`.
+     */
+    interface HTMLBsListElement extends Components.BsList, HTMLStencilElement {
+        addEventListener<K extends keyof HTMLBsListElementEventMap>(type: K, listener: (this: HTMLBsListElement, ev: BsListCustomEvent<HTMLBsListElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLBsListElementEventMap>(type: K, listener: (this: HTMLBsListElement, ev: BsListCustomEvent<HTMLBsListElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+    }
+    var HTMLBsListElement: {
+        prototype: HTMLBsListElement;
+        new (): HTMLBsListElement;
+    };
+    interface HTMLBsListItemElementEventMap {
+        "bsItemClick": string | null;
+    }
+    /**
+     * A single row of a list: optional leading media (avatar, icon, image), a label, a description and
+     * optional support text, and an optional trailing caret or custom trailing content.
+     * ## When to use
+     * - As a child of `bs-list`, one per record, person, file or option.
+     * - Standalone as a plain information row (non-interactive), or with `interactive` as a button-like row.
+     * ## When not to use
+     * - A popup list of actions -- use `bs-menu` / `bs-menu-item`.
+     * - App navigation with an active route -- use `bs-navigation-drawer-item`.
+     * - Tabular data with columns, sorting or paging -- use `bs-data-table`.
+     * Composed from: leading media (`bs-avatar`) and trailing controls (`bs-icon-button`) are supplied by the
+     * consumer through the `leading` and `trailing` slots; the row itself only reserves layout. The default
+     * trailing caret is inline SVG.
+     * Roles are driven by the parent `bs-list` (via `selectionRole`). Standalone, the row has no role
+     * (`listitem` is only valid inside a list) unless `interactive` is set, which makes it a focusable
+     * `role="button"`.
+     * @prop --bs-list-item-min-height - Minimum row height. Aliased to `--bs-spacing-1000`.
+     * @prop --bs-list-item-padding-y - Aliased to `--bs-spacing-150`.
+     * @prop --bs-list-item-padding-x - Aliased to `--bs-spacing-200`.
+     * @prop --bs-list-item-gap - Gap between leading, content and trailing. Aliased to `--bs-spacing-200`.
+     * @prop --bs-list-item-content-gap - Gap between text lines. Aliased to `--bs-spacing-25`.
+     * @prop --bs-list-item-radius - Aliased to `--bs-border-radius-100`.
+     * @prop --bs-list-item-bg - Enabled background. `transparent`.
+     * @prop --bs-list-item-bg-hover - Aliased to `--bs-surface-hover`.
+     * @prop --bs-list-item-bg-pressed - Aliased to `--bs-surface-pressed`.
+     * @prop --bs-list-item-bg-focus - Aliased to `--bs-surface-focus`.
+     * @prop --bs-list-item-bg-selected - Aliased to `--bs-surface-selected`.
+     * @prop --bs-list-item-bg-selected-hover - Aliased to `--bs-surface-selected-hover`.
+     * @prop --bs-list-item-bg-selected-pressed - Aliased to `--bs-surface-selected-pressed`.
+     * @prop --bs-list-item-bg-selected-focus - Aliased to `--bs-surface-selected-focus`.
+     * @prop --bs-list-item-bg-disabled - Aliased to `--bs-surface-action-disabled`.
+     * @prop --bs-list-item-color - Text colour. Aliased to `--bs-text-default`.
+     * @prop --bs-list-item-color-disabled - Aliased to `--bs-text-on-disabled`.
+     * @prop --bs-list-item-focus-ring - Focus ring colour. Aliased to `--bs-border-neutral-focus`.
+     * @prop --bs-list-item-image-width - Leading image width. 72px.
+     * @prop --bs-list-item-image-height - Leading image height. 56px.
+     */
+    interface HTMLBsListItemElement extends Components.BsListItem, HTMLStencilElement {
+        addEventListener<K extends keyof HTMLBsListItemElementEventMap>(type: K, listener: (this: HTMLBsListItemElement, ev: BsListItemCustomEvent<HTMLBsListItemElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLBsListItemElementEventMap>(type: K, listener: (this: HTMLBsListItemElement, ev: BsListItemCustomEvent<HTMLBsListItemElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+    }
+    var HTMLBsListItemElement: {
+        prototype: HTMLBsListItemElement;
+        new (): HTMLBsListItemElement;
+    };
     /**
      * The BrandSync brand mark, as its own standalone component -- shared by `bs-navigation-header`
      * and `bs-navigation-drawer`, which used to each render their own duplicated copy of this SVG
@@ -6459,6 +7027,26 @@ declare global {
         prototype: HTMLBsSplitPaneElement;
         new (): HTMLBsSplitPaneElement;
     };
+    /**
+     * A flex layout that arranges its children in a row or column with a token-based gap, optionally
+     * drawing a divider between children.
+     * Built from: `bs-divider` (when `divider` is set).
+     * With `divider`, each child is given a generated `slot="bs-stack-item-N"` attribute (plus a
+     * `data-bs-stack-item` marker) so a divider can be rendered between the named slots. Light-DOM
+     * nodes are never moved; the attributes are removed again when `divider` is turned off.
+     * ## When to use
+     * - Spacing and aligning a short run of siblings (form fields, button rows, card content).
+     * ## When not to use
+     * - Two-dimensional grids (use CSS grid).
+     * - Resizable panes (use `bs-split-pane`).
+     * @prop --bs-stack-gap - Space between items. Defaults from the `gap` prop (`--bs-spacing-<gap>`); may be overridden directly.
+     */
+    interface HTMLBsStackElement extends Components.BsStack, HTMLStencilElement {
+    }
+    var HTMLBsStackElement: {
+        prototype: HTMLBsStackElement;
+        new (): HTMLBsStackElement;
+    };
     /**
      * A sequence of named steps showing overall progress through a multi-step flow (e.g. a checkout,
      * an onboarding wizard) -- each step reads as enabled (not yet reached), current, done, error, or
@@ -6717,6 +7305,61 @@ declare global {
         prototype: HTMLBsTooltipTriggerElement;
         new (): HTMLBsTooltipTriggerElement;
     };
+    interface HTMLBsTreeElementEventMap {
+        "bsChange": string;
+    }
+    /**
+     * A hierarchical list of `bs-tree-item` rows with single selection, expand/collapse and the
+     * WAI-ARIA tree keyboard pattern.
+     * The tree owns `role="tree"`, the roving `tabindex` (exactly one enabled, visible item is
+     * tabbable: the selected one, otherwise the first), selection (kept in sync with each item's
+     * `selected`) and keyboard navigation over the visible (rendered, non-disabled) items. Items own
+     * their expansion state and emit `bsSelect` / `bsToggle`.
+     * Built from: `bs-tree-item` rows.
+     */
+    interface HTMLBsTreeElement extends Components.BsTree, HTMLStencilElement {
+        addEventListener<K extends keyof HTMLBsTreeElementEventMap>(type: K, listener: (this: HTMLBsTreeElement, ev: BsTreeCustomEvent<HTMLBsTreeElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLBsTreeElementEventMap>(type: K, listener: (this: HTMLBsTreeElement, ev: BsTreeCustomEvent<HTMLBsTreeElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+    }
+    var HTMLBsTreeElement: {
+        prototype: HTMLBsTreeElement;
+        new (): HTMLBsTreeElement;
+    };
+    interface HTMLBsTreeItemElementEventMap {
+        "bsToggle": boolean;
+        "bsSelect": string;
+    }
+    /**
+     * A single row of a `bs-tree`. An item that contains child `bs-tree-item` elements is a parent
+     * (it gets an expand/collapse caret and a folder icon); an item without children is a leaf (no
+     * caret, file icon).
+     * The host carries `role="treeitem"` and the `aria-*` state; the owning `bs-tree` manages the
+     * roving `tabindex`, selection and keyboard navigation. Nesting depth is computed automatically
+     * from the number of ancestor `bs-tree-item` elements and exposed as `aria-level` -- it is not a
+     * prop. Clicking the row selects it; clicking the caret (or pressing Right/Left in a tree) toggles
+     * expansion -- the two are deliberately separate.
+     * Built from: inline SVG icons only (no existing `bs-*` component covers a tree row).
+     */
+    interface HTMLBsTreeItemElement extends Components.BsTreeItem, HTMLStencilElement {
+        addEventListener<K extends keyof HTMLBsTreeItemElementEventMap>(type: K, listener: (this: HTMLBsTreeItemElement, ev: BsTreeItemCustomEvent<HTMLBsTreeItemElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLBsTreeItemElementEventMap>(type: K, listener: (this: HTMLBsTreeItemElement, ev: BsTreeItemCustomEvent<HTMLBsTreeItemElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+    }
+    var HTMLBsTreeItemElement: {
+        prototype: HTMLBsTreeItemElement;
+        new (): HTMLBsTreeItemElement;
+    };
     interface HTMLBsWhatsNewElementEventMap {
         "bsMarkAllRead": void;
         "bsEntryAction": { id: string };
@@ -6792,6 +7435,7 @@ declare global {
         "bs-ai-disclaimer": HTMLBsAiDisclaimerElement;
         "bs-ai-greeting": HTMLBsAiGreetingElement;
         "bs-ai-thinking": HTMLBsAiThinkingElement;
+        "bs-app-shell": HTMLBsAppShellElement;
         "bs-attachment": HTMLBsAttachmentElement;
         "bs-attachment-list": HTMLBsAttachmentListElement;
         "bs-avatar": HTMLBsAvatarElement;
@@ -6816,17 +7460,22 @@ declare global {
         "bs-citation-preview": HTMLBsCitationPreviewElement;
         "bs-composer": HTMLBsComposerElement;
         "bs-composer-status-banner": HTMLBsComposerStatusBannerElement;
+        "bs-container": HTMLBsContainerElement;
         "bs-cookie-consent": HTMLBsCookieConsentElement;
         "bs-data-table": HTMLBsDataTableElement;
         "bs-datepicker": HTMLBsDatepickerElement;
         "bs-dialog": HTMLBsDialogElement;
+        "bs-divider": HTMLBsDividerElement;
         "bs-error-page": HTMLBsErrorPageElement;
         "bs-file-upload": HTMLBsFileUploadElement;
         "bs-file-upload-item": HTMLBsFileUploadItemElement;
+        "bs-grid": HTMLBsGridElement;
         "bs-icon-button": HTMLBsIconButtonElement;
         "bs-icon-tile": HTMLBsIconTileElement;
         "bs-inline-tab": HTMLBsInlineTabElement;
         "bs-input": HTMLBsInputElement;
+        "bs-list": HTMLBsListElement;
+        "bs-list-item": HTMLBsListItemElement;
         "bs-logo": HTMLBsLogoElement;
         "bs-menu": HTMLBsMenuElement;
         "bs-menu-item": HTMLBsMenuItemElement;
@@ -6851,6 +7500,7 @@ declare global {
         "bs-source-link": HTMLBsSourceLinkElement;
         "bs-spinner": HTMLBsSpinnerElement;
         "bs-split-pane": HTMLBsSplitPaneElement;
+        "bs-stack": HTMLBsStackElement;
         "bs-stepper": HTMLBsStepperElement;
         "bs-stepper-step": HTMLBsStepperStepElement;
         "bs-switch": HTMLBsSwitchElement;
@@ -6860,6 +7510,8 @@ declare global {
         "bs-toast": HTMLBsToastElement;
         "bs-tooltip": HTMLBsTooltipElement;
         "bs-tooltip-trigger": HTMLBsTooltipTriggerElement;
+        "bs-tree": HTMLBsTreeElement;
+        "bs-tree-item": HTMLBsTreeItemElement;
         "bs-whats-new": HTMLBsWhatsNewElement;
         "bs-whats-new-entry": HTMLBsWhatsNewEntryElement;
     }
@@ -7008,6 +7660,34 @@ declare namespace LocalJSX {
          */
         "label"?: string;
     }
+    /**
+     * The page frame: a header across the top, and below it a navigation | main | aside row, laid out
+     * with CSS grid. The main column scrolls independently of the header and the side columns.
+     * Layout only. Compose it from the existing shell components: put a `bs-navigation-header`
+     * (usually `alignment="with-navigation-drawer"`) in `header` and a `bs-navigation-drawer` in
+     * `navigation`. The drawer sizes itself (expanded or collapsed rail); the shell reserves an `auto`
+     * track for it, so there is no `navigationWidth` prop. `bs-navigation-header` has no `collapsed`
+     * prop, so there is no collapse state to mirror and the shell does not listen to `bsCollapse`: the
+     * auto track follows the drawer's width on its own.
+     * The shell creates no landmarks besides `<main>`; the slotted header and drawer bring their own
+     * `banner` and `navigation` roles.
+     * ## When to use
+     * - The outer frame of an application page with a header and side navigation.
+     * ## When not to use
+     * - Content layout inside the page (use `bs-grid`) or resizable panes (use `bs-split-pane`).
+     * - Pages that already have their own `<main>`; the shell would add a duplicate landmark.
+     * @prop --bs-app-shell-bg - Shell background. Aliased to `--bs-surface-base`.
+     * @prop --bs-app-shell-color - Text colour. Aliased to `--bs-text-default`.
+     * @prop --bs-app-shell-main-padding - Padding of the main area. Aliased to `--bs-spacing-400`.
+     * @prop --bs-app-shell-aside-width - Width of the aside column. Defaults to `auto` (zero when empty).
+     */
+    interface BsAppShell {
+        /**
+          * When true the host is `height: 100%`; when false it is content-sized with `min-height: 100vh`.
+          * @default true
+         */
+        "fullHeight"?: boolean;
+    }
     /**
      * A single file attachment preview for `bs-composer` -- an image thumbnail, or a filename card
      * with a colored file-type badge (PDF/Document), with an optional upload-in-progress spinner and
@@ -8391,6 +9071,28 @@ declare namespace LocalJSX {
          */
         "type"?: BsComposerStatusBannerType;
     }
+    /**
+     * A centred wrapper that limits content width to a breakpoint and adds horizontal padding.
+     * ## When to use
+     * - Constraining page or section content to a readable, consistent maximum width.
+     * ## When not to use
+     * - Arranging children relative to each other (use `bs-stack`).
+     * - Full-bleed regions such as hero backgrounds (use `size="fluid"` or no container).
+     * @prop --bs-container-max-width - Maximum width. Aliased to the `--bs-breakpoint-*` token for `size`; `none` for `fluid`.
+     * @prop --bs-container-padding - Horizontal padding. Aliased to the `padding` spacing token (default `--bs-spacing-300`).
+     */
+    interface BsContainer {
+        /**
+          * Spacing token name for horizontal padding (e.g. `300` => `--bs-spacing-300`). Invalid values fall back to `300`.
+          * @default '300'
+         */
+        "padding"?: string;
+        /**
+          * Maximum width, taken from the breakpoint tokens. `fluid` removes the limit.
+          * @default 'xl'
+         */
+        "size"?: BsContainerSize;
+    }
     /**
      * A cookie consent prompt in four forms, matching the Figma "Cookie consent" component:
      * - `banner` -- a wide bar: icon, heading, text, policy link, and Customise / Reject optional / Accept
@@ -8705,6 +9407,39 @@ declare namespace LocalJSX {
          */
         "size"?: BsDialogSize;
     }
+    /**
+     * A thin line that separates content, horizontally or vertically.
+     * ## When to use
+     * - Separating groups of related content in a list, menu, toolbar or card.
+     * ## When not to use
+     * - Adding vertical space between blocks (use `bs-stack` gap or spacing tokens).
+     * - Drawing a border around a surface (use `bs-card`).
+     * @prop --bs-divider-thickness - Line thickness. Defaults to `1px`.
+     * @prop --bs-divider-color - Line colour. Aliased to `--bs-border-neutral-container` (`default`) or `--bs-neutral-100` (`subtle`).
+     * @prop --bs-divider-inset - Indent applied by `inset`. Aliased to `--bs-spacing-300`.
+     */
+    interface BsDivider {
+        /**
+          * Purely visual: hides the divider from assistive technology instead of exposing a separator.
+          * @default false
+         */
+        "decorative"?: boolean;
+        /**
+          * Indents the line from its start edge, or from both edges.
+          * @default 'none'
+         */
+        "inset"?: BsDividerInset;
+        /**
+          * Direction of the line. A vertical divider stretches to the height of its container.
+          * @default 'horizontal'
+         */
+        "orientation"?: BsDividerOrientation;
+        /**
+          * Visual weight of the line.
+          * @default 'default'
+         */
+        "variant"?: BsDividerVariant;
+    }
     /**
      * A full-block page for when the user can't get to what they asked for: page not found (404), a server
      * error (500), no access (403), planned maintenance, or no internet connection. Matches the Figma
@@ -8884,6 +9619,53 @@ declare namespace LocalJSX {
          */
         "thumbnailSrc"?: string;
     }
+    /**
+     * A CSS grid layout wrapper. Children are placed in equal-width columns with a token-based gap.
+     * `columns` takes either a number (`"3"` becomes `repeat(3, minmax(0, 1fr))`) or any raw
+     * `grid-template-columns` value (`"200px 1fr"`). `minColumnWidth` is the responsive mechanism: it
+     * switches to `repeat(auto-fit, minmax(min(100%, X), 1fr))`, so the column count adapts to the
+     * container width and `columns` is ignored. There are deliberately no per-breakpoint props in v1.
+     * `gap`, `rowGap` and `columnGap` take spacing token names (`"200"` maps to `var(--bs-spacing-200)`);
+     * unknown names fall back to `100`.
+     * ## When to use
+     * - Card grids, form field grids and dashboards where items share equal column tracks.
+     * - Responsive galleries via `minColumnWidth`.
+     * ## When not to use
+     * - A single row or column of items with no wrapping (plain flex).
+     * - Resizable multi-pane layouts (use `bs-split-pane`) or the page frame (use `bs-app-shell`).
+     * @prop --bs-grid-gap - Gap on both axes. Overrides the `gap` prop's token (default `--bs-spacing-100`).
+     * @prop --bs-grid-row-gap - Row gap. Overrides `--bs-grid-gap` and the `rowGap` prop's token.
+     * @prop --bs-grid-column-gap - Column gap. Overrides `--bs-grid-gap` and the `columnGap` prop's token.
+     */
+    interface BsGrid {
+        /**
+          * Block-axis alignment of items within their cell.
+          * @default 'stretch'
+         */
+        "align"?: BsGridAlign;
+        /**
+          * Spacing token name for the column gap; overrides `gap` for columns.
+         */
+        "columnGap"?: string;
+        /**
+          * A number of equal columns (`"3"`), or a raw `grid-template-columns` value. Ignored when `minColumnWidth` is set.
+          * @default '1'
+         */
+        "columns"?: string;
+        /**
+          * Spacing token name for the gap on both axes, e.g. `"200"` for `--bs-spacing-200`.
+          * @default '100'
+         */
+        "gap"?: string;
+        /**
+          * CSS length (e.g. `240px`). Switches to auto-fit columns at least this wide and overrides `columns`.
+         */
+        "minColumnWidth"?: string;
+        /**
+          * Spacing token name for the row gap; overrides `gap` for rows.
+         */
+        "rowGap"?: string;
+    }
     /**
      * A clickable, icon-only action element -- the icon-only sibling of `bs-button`, sharing the same
      * 8 visual variants and color language, but ALWAYS rendering just a single icon, never a label.
@@ -9179,6 +9961,133 @@ declare namespace LocalJSX {
          */
         "value"?: string;
     }
+    /**
+     * A vertical list of `bs-list-item` rows, optionally single-select.
+     * ## When to use
+     * - Records, people, files or options shown as rows with leading media and descriptions.
+     * - `selectable` for a single-choice list (e.g. a conversation list next to a detail pane).
+     * ## When not to use
+     * - A popup list of actions -- use `bs-menu`.
+     * - Navigation between app sections -- use `bs-navigation-drawer`.
+     * - Multi-column, sortable or paged data -- use `bs-data-table`.
+     * Built from `bs-list-item` children (light DOM; the list never moves nodes).
+     * @prop --bs-list-gap - Gap between rows. Defaults to `0`.
+     * @prop --bs-list-divider-color - Divider colour when `dividers` is set. Aliased to `--bs-border-neutral-container`.
+     */
+    interface BsList {
+        /**
+          * Accessible name of the list.
+          * @default null
+         */
+        "ariaLabel"?: string | null;
+        /**
+          * Draws a 1px separator between rows.
+          * @default false
+         */
+        "dividers"?: boolean;
+        /**
+          * Fires with the new `value` when the user changes the selection.
+         */
+        "onBsChange"?: (event: BsListCustomEvent<string | null>) => void;
+        /**
+          * Single-selection mode: role="listbox", rows are `option`s with roving tabindex.
+          * @default false
+         */
+        "selectable"?: boolean;
+        /**
+          * `value` of the selected item (selectable mode).
+          * @default null
+         */
+        "value"?: string | null;
+    }
+    /**
+     * A single row of a list: optional leading media (avatar, icon, image), a label, a description and
+     * optional support text, and an optional trailing caret or custom trailing content.
+     * ## When to use
+     * - As a child of `bs-list`, one per record, person, file or option.
+     * - Standalone as a plain information row (non-interactive), or with `interactive` as a button-like row.
+     * ## When not to use
+     * - A popup list of actions -- use `bs-menu` / `bs-menu-item`.
+     * - App navigation with an active route -- use `bs-navigation-drawer-item`.
+     * - Tabular data with columns, sorting or paging -- use `bs-data-table`.
+     * Composed from: leading media (`bs-avatar`) and trailing controls (`bs-icon-button`) are supplied by the
+     * consumer through the `leading` and `trailing` slots; the row itself only reserves layout. The default
+     * trailing caret is inline SVG.
+     * Roles are driven by the parent `bs-list` (via `selectionRole`). Standalone, the row has no role
+     * (`listitem` is only valid inside a list) unless `interactive` is set, which makes it a focusable
+     * `role="button"`.
+     * @prop --bs-list-item-min-height - Minimum row height. Aliased to `--bs-spacing-1000`.
+     * @prop --bs-list-item-padding-y - Aliased to `--bs-spacing-150`.
+     * @prop --bs-list-item-padding-x - Aliased to `--bs-spacing-200`.
+     * @prop --bs-list-item-gap - Gap between leading, content and trailing. Aliased to `--bs-spacing-200`.
+     * @prop --bs-list-item-content-gap - Gap between text lines. Aliased to `--bs-spacing-25`.
+     * @prop --bs-list-item-radius - Aliased to `--bs-border-radius-100`.
+     * @prop --bs-list-item-bg - Enabled background. `transparent`.
+     * @prop --bs-list-item-bg-hover - Aliased to `--bs-surface-hover`.
+     * @prop --bs-list-item-bg-pressed - Aliased to `--bs-surface-pressed`.
+     * @prop --bs-list-item-bg-focus - Aliased to `--bs-surface-focus`.
+     * @prop --bs-list-item-bg-selected - Aliased to `--bs-surface-selected`.
+     * @prop --bs-list-item-bg-selected-hover - Aliased to `--bs-surface-selected-hover`.
+     * @prop --bs-list-item-bg-selected-pressed - Aliased to `--bs-surface-selected-pressed`.
+     * @prop --bs-list-item-bg-selected-focus - Aliased to `--bs-surface-selected-focus`.
+     * @prop --bs-list-item-bg-disabled - Aliased to `--bs-surface-action-disabled`.
+     * @prop --bs-list-item-color - Text colour. Aliased to `--bs-text-default`.
+     * @prop --bs-list-item-color-disabled - Aliased to `--bs-text-on-disabled`.
+     * @prop --bs-list-item-focus-ring - Focus ring colour. Aliased to `--bs-border-neutral-focus`.
+     * @prop --bs-list-item-image-width - Leading image width. 72px.
+     * @prop --bs-list-item-image-height - Leading image height. 56px.
+     */
+    interface BsListItem {
+        /**
+          * Second text line (the "paragraph").
+          * @default null
+         */
+        "description"?: string | null;
+        /**
+          * Disables the row: dimmed, not focusable, no click event.
+          * @default false
+         */
+        "disabled"?: boolean;
+        /**
+          * Makes a standalone row a focusable `role="button"` that emits `bsItemClick`.
+          * @default false
+         */
+        "interactive"?: boolean;
+        /**
+          * First text line (semibold).
+          * @default null
+         */
+        "label"?: string | null;
+        /**
+          * Fires on click / Enter / Space when the row is interactive and not disabled. Payload is `value`.
+         */
+        "onBsItemClick"?: (event: BsListItemCustomEvent<string | null>) => void;
+        /**
+          * Marks the row as selected. Managed by the parent `bs-list` when it is `selectable`.
+          * @default false
+         */
+        "selected"?: boolean;
+        /**
+          * Set by the parent `bs-list`: `listitem` (plain list) or `option` (selectable list). Do not set by hand.
+          * @default null
+         */
+        "selectionRole"?: 'listitem' | 'option' | null;
+        /**
+          * Shows a trailing caret (unless the `trailing` slot has content).
+          * @default false
+         */
+        "showArrow"?: boolean;
+        /**
+          * Optional third text line.
+          * @default null
+         */
+        "supportText"?: string | null;
+        /**
+          * Identifies the item; emitted by `bsItemClick` and matched against `bs-list`'s `value`.
+          * @default null
+         */
+        "value"?: string | null;
+    }
     /**
      * The BrandSync brand mark, as its own standalone component -- shared by `bs-navigation-header`
      * and `bs-navigation-drawer`, which used to each render their own duplicated copy of this SVG
@@ -10682,6 +11591,52 @@ declare namespace LocalJSX {
          */
         "step"?: number;
     }
+    /**
+     * A flex layout that arranges its children in a row or column with a token-based gap, optionally
+     * drawing a divider between children.
+     * Built from: `bs-divider` (when `divider` is set).
+     * With `divider`, each child is given a generated `slot="bs-stack-item-N"` attribute (plus a
+     * `data-bs-stack-item` marker) so a divider can be rendered between the named slots. Light-DOM
+     * nodes are never moved; the attributes are removed again when `divider` is turned off.
+     * ## When to use
+     * - Spacing and aligning a short run of siblings (form fields, button rows, card content).
+     * ## When not to use
+     * - Two-dimensional grids (use CSS grid).
+     * - Resizable panes (use `bs-split-pane`).
+     * @prop --bs-stack-gap - Space between items. Defaults from the `gap` prop (`--bs-spacing-<gap>`); may be overridden directly.
+     */
+    interface BsStack {
+        /**
+          * Cross-axis alignment.
+          * @default 'stretch'
+         */
+        "align"?: BsStackAlign;
+        /**
+          * Main axis: `vertical` stacks children in a column, `horizontal` in a row.
+          * @default 'vertical'
+         */
+        "direction"?: BsStackDirection;
+        /**
+          * Renders a decorative `bs-divider` between each child.
+          * @default false
+         */
+        "divider"?: boolean;
+        /**
+          * Spacing token name (e.g. `200` => `--bs-spacing-200`). Invalid values fall back to `100`.
+          * @default '100'
+         */
+        "gap"?: string;
+        /**
+          * Main-axis distribution.
+          * @default 'start'
+         */
+        "justify"?: BsStackJustify;
+        /**
+          * Lets items wrap onto further lines.
+          * @default false
+         */
+        "wrap"?: boolean;
+    }
     /**
      * A sequence of named steps showing overall progress through a multi-step flow (e.g. a checkout,
      * an onboarding wizard) -- each step reads as enabled (not yet reached), current, done, error, or
@@ -11097,6 +12052,87 @@ declare namespace LocalJSX {
          */
         "text"?: string;
     }
+    /**
+     * A hierarchical list of `bs-tree-item` rows with single selection, expand/collapse and the
+     * WAI-ARIA tree keyboard pattern.
+     * The tree owns `role="tree"`, the roving `tabindex` (exactly one enabled, visible item is
+     * tabbable: the selected one, otherwise the first), selection (kept in sync with each item's
+     * `selected`) and keyboard navigation over the visible (rendered, non-disabled) items. Items own
+     * their expansion state and emit `bsSelect` / `bsToggle`.
+     * Built from: `bs-tree-item` rows.
+     */
+    interface BsTree {
+        /**
+          * Accessible name of the tree. Bound onto the internal `role="tree"` element (an `aria-label` on the host would not reach it).
+          * @default null
+         */
+        "ariaLabel"?: string | null;
+        /**
+          * Emitted when the user changes the selection (click, Enter/Space), with the new value. Not emitted when `value` is set from code.
+         */
+        "onBsChange"?: (event: BsTreeCustomEvent<string>) => void;
+        /**
+          * When `false`, rows do not select (clicks and Enter/Space do nothing) but parents still expand and collapse.
+          * @default true
+         */
+        "selectable"?: boolean;
+        /**
+          * The `value` (or, when empty, the `label`) of the selected item. Two-way synced with each item's `selected` (single selection). Setting it from code does not emit `bsChange`.
+          * @default ''
+         */
+        "value"?: string;
+    }
+    /**
+     * A single row of a `bs-tree`. An item that contains child `bs-tree-item` elements is a parent
+     * (it gets an expand/collapse caret and a folder icon); an item without children is a leaf (no
+     * caret, file icon).
+     * The host carries `role="treeitem"` and the `aria-*` state; the owning `bs-tree` manages the
+     * roving `tabindex`, selection and keyboard navigation. Nesting depth is computed automatically
+     * from the number of ancestor `bs-tree-item` elements and exposed as `aria-level` -- it is not a
+     * prop. Clicking the row selects it; clicking the caret (or pressing Right/Left in a tree) toggles
+     * expansion -- the two are deliberately separate.
+     * Built from: inline SVG icons only (no existing `bs-*` component covers a tree row).
+     */
+    interface BsTreeItem {
+        /**
+          * Disables the row: not focusable, ignores clicks, dimmed. Reflected.
+          * @default false
+         */
+        "disabled"?: boolean;
+        /**
+          * Whether the child items are shown. Only meaningful for parents. Mutable: the caret, the keyboard and the owning tree toggle it. Reflected.
+          * @default false
+         */
+        "expanded"?: boolean;
+        /**
+          * The row's text. Use the `label` slot for rich content.
+          * @default ''
+         */
+        "label"?: string;
+        /**
+          * Emitted (bubbling, composed) when the user activates the row, with the item's value. The owning `bs-tree` listens and updates the selection.
+         */
+        "onBsSelect"?: (event: BsTreeItemCustomEvent<string>) => void;
+        /**
+          * Emitted when the user toggles expansion (caret click or keyboard), with the new `expanded` value. Not emitted when `expanded` is set from code.
+         */
+        "onBsToggle"?: (event: BsTreeItemCustomEvent<boolean>) => void;
+        /**
+          * Marks the row as selected. Owned by the tree (single selection, synced with its `value`). Reflected.
+          * @default false
+         */
+        "selected"?: boolean;
+        /**
+          * Shows the leading icon (default folder / file, or the `icon` slot).
+          * @default true
+         */
+        "showIcon"?: boolean;
+        /**
+          * Identifier used in events and for the tree's `value`. Falls back to `label` when empty.
+          * @default ''
+         */
+        "value"?: string;
+    }
     /**
      * A product's "What's new" surface, in three forms matching the Figma component:
      * - `feed` -- a docked panel: heading, "Mark all as read", filter tabs, the list of updates (each a
@@ -11339,6 +12375,9 @@ declare namespace LocalJSX {
     interface BsAiThinkingAttributes {
         "label": string;
     }
+    interface BsAppShellAttributes {
+        "fullHeight": boolean;
+    }
     interface BsAttachmentAttributes {
         "uploadingLabel": string;
         "removeLabel": string;
@@ -11520,6 +12559,10 @@ declare namespace LocalJSX {
         "closeLabel": string;
         "allowClose": boolean;
     }
+    interface BsContainerAttributes {
+        "size": BsContainerSize;
+        "padding": string;
+    }
     interface BsCookieConsentAttributes {
         "type": BsCookieConsentType;
         "heading": string;
@@ -11566,6 +12609,12 @@ declare namespace LocalJSX {
         "size": BsDialogSize;
         "centered": boolean;
     }
+    interface BsDividerAttributes {
+        "orientation": BsDividerOrientation;
+        "variant": BsDividerVariant;
+        "inset": BsDividerInset;
+        "decorative": boolean;
+    }
     interface BsErrorPageAttributes {
         "type": BsErrorPageType;
         "code": string;
@@ -11597,6 +12646,14 @@ declare namespace LocalJSX {
         "cancelLabel": string;
         "removeLabel": string;
     }
+    interface BsGridAttributes {
+        "columns": string;
+        "gap": string;
+        "rowGap": string;
+        "columnGap": string;
+        "minColumnWidth": string;
+        "align": BsGridAlign;
+    }
     interface BsIconButtonAttributes {
         "variant": BsIconButtonVariant;
         "size": BsIconButtonSize;
@@ -11651,6 +12708,23 @@ declare namespace LocalJSX {
         "length": number;
         "open": boolean;
     }
+    interface BsListAttributes {
+        "selectable": boolean;
+        "value": string | null;
+        "dividers": boolean;
+        "ariaLabel": string | null;
+    }
+    interface BsListItemAttributes {
+        "label": string | null;
+        "description": string | null;
+        "supportText": string | null;
+        "selected": boolean;
+        "disabled": boolean;
+        "showArrow": boolean;
+        "value": string | null;
+        "interactive": boolean;
+        "selectionRole": 'listitem' | 'option' | null;
+    }
     interface BsLogoAttributes {
         "variant": BsLogoVariant;
         "background": BsLogoBackground;
@@ -11865,6 +12939,14 @@ declare namespace LocalJSX {
         "dividerLabel": string;
         "step": number;
     }
+    interface BsStackAttributes {
+        "direction": BsStackDirection;
+        "gap": string;
+        "align": BsStackAlign;
+        "justify": BsStackJustify;
+        "wrap": boolean;
+        "divider": boolean;
+    }
     interface BsStepperAttributes {
         "currentStep": number;
         "direction": BsStepperDirection;
@@ -11927,6 +13009,19 @@ declare namespace LocalJSX {
         "delay": number;
         "placement": BsTooltipTriggerPlacement;
     }
+    interface BsTreeAttributes {
+        "ariaLabel": string | null;
+        "value": string;
+        "selectable": boolean;
+    }
+    interface BsTreeItemAttributes {
+        "label": string;
+        "expanded": boolean;
+        "selected": boolean;
+        "disabled": boolean;
+        "showIcon": boolean;
+        "value": string;
+    }
     interface BsWhatsNewAttributes {
         "type": BsWhatsNewType;
         "heading": string;
@@ -11969,6 +13064,7 @@ declare namespace LocalJSX {
         "bs-ai-disclaimer": BsAiDisclaimer;
         "bs-ai-greeting": Omit<BsAiGreeting, keyof BsAiGreetingAttributes> & { [K in keyof BsAiGreeting & keyof BsAiGreetingAttributes]?: BsAiGreeting[K] } & { [K in keyof BsAiGreeting & keyof BsAiGreetingAttributes as `attr:${K}`]?: BsAiGreetingAttributes[K] } & { [K in keyof BsAiGreeting & keyof BsAiGreetingAttributes as `prop:${K}`]?: BsAiGreeting[K] };
         "bs-ai-thinking": Omit<BsAiThinking, keyof BsAiThinkingAttributes> & { [K in keyof BsAiThinking & keyof BsAiThinkingAttributes]?: BsAiThinking[K] } & { [K in keyof BsAiThinking & keyof BsAiThinkingAttributes as `attr:${K}`]?: BsAiThinkingAttributes[K] } & { [K in keyof BsAiThinking & keyof BsAiThinkingAttributes as `prop:${K}`]?: BsAiThinking[K] };
+        "bs-app-shell": Omit<BsAppShell, keyof BsAppShellAttributes> & { [K in keyof BsAppShell & keyof BsAppShellAttributes]?: BsAppShell[K] } & { [K in keyof BsAppShell & keyof BsAppShellAttributes as `attr:${K}`]?: BsAppShellAttributes[K] } & { [K in keyof BsAppShell & keyof BsAppShellAttributes as `prop:${K}`]?: BsAppShell[K] };
         "bs-attachment": Omit<BsAttachment, keyof BsAttachmentAttributes> & { [K in keyof BsAttachment & keyof BsAttachmentAttributes]?: BsAttachment[K] } & { [K in keyof BsAttachment & keyof BsAttachmentAttributes as `attr:${K}`]?: BsAttachmentAttributes[K] } & { [K in keyof BsAttachment & keyof BsAttachmentAttributes as `prop:${K}`]?: BsAttachment[K] };
         "bs-attachment-list": Omit<BsAttachmentList, keyof BsAttachmentListAttributes> & { [K in keyof BsAttachmentList & keyof BsAttachmentListAttributes]?: BsAttachmentList[K] } & { [K in keyof BsAttachmentList & keyof BsAttachmentListAttributes as `attr:${K}`]?: BsAttachmentListAttributes[K] } & { [K in keyof BsAttachmentList & keyof BsAttachmentListAttributes as `prop:${K}`]?: BsAttachmentList[K] };
         "bs-avatar": Omit<BsAvatar, keyof BsAvatarAttributes> & { [K in keyof BsAvatar & keyof BsAvatarAttributes]?: BsAvatar[K] } & { [K in keyof BsAvatar & keyof BsAvatarAttributes as `attr:${K}`]?: BsAvatarAttributes[K] } & { [K in keyof BsAvatar & keyof BsAvatarAttributes as `prop:${K}`]?: BsAvatar[K] };
@@ -11993,17 +13089,22 @@ declare namespace LocalJSX {
         "bs-citation-preview": Omit<BsCitationPreview, keyof BsCitationPreviewAttributes> & { [K in keyof BsCitationPreview & keyof BsCitationPreviewAttributes]?: BsCitationPreview[K] } & { [K in keyof BsCitationPreview & keyof BsCitationPreviewAttributes as `attr:${K}`]?: BsCitationPreviewAttributes[K] } & { [K in keyof BsCitationPreview & keyof BsCitationPreviewAttributes as `prop:${K}`]?: BsCitationPreview[K] };
         "bs-composer": Omit<BsComposer, keyof BsComposerAttributes> & { [K in keyof BsComposer & keyof BsComposerAttributes]?: BsComposer[K] } & { [K in keyof BsComposer & keyof BsComposerAttributes as `attr:${K}`]?: BsComposerAttributes[K] } & { [K in keyof BsComposer & keyof BsComposerAttributes as `prop:${K}`]?: BsComposer[K] };
         "bs-composer-status-banner": Omit<BsComposerStatusBanner, keyof BsComposerStatusBannerAttributes> & { [K in keyof BsComposerStatusBanner & keyof BsComposerStatusBannerAttributes]?: BsComposerStatusBanner[K] } & { [K in keyof BsComposerStatusBanner & keyof BsComposerStatusBannerAttributes as `attr:${K}`]?: BsComposerStatusBannerAttributes[K] } & { [K in keyof BsComposerStatusBanner & keyof BsComposerStatusBannerAttributes as `prop:${K}`]?: BsComposerStatusBanner[K] };
+        "bs-container": Omit<BsContainer, keyof BsContainerAttributes> & { [K in keyof BsContainer & keyof BsContainerAttributes]?: BsContainer[K] } & { [K in keyof BsContainer & keyof BsContainerAttributes as `attr:${K}`]?: BsContainerAttributes[K] } & { [K in keyof BsContainer & keyof BsContainerAttributes as `prop:${K}`]?: BsContainer[K] };
         "bs-cookie-consent": Omit<BsCookieConsent, keyof BsCookieConsentAttributes> & { [K in keyof BsCookieConsent & keyof BsCookieConsentAttributes]?: BsCookieConsent[K] } & { [K in keyof BsCookieConsent & keyof BsCookieConsentAttributes as `attr:${K}`]?: BsCookieConsentAttributes[K] } & { [K in keyof BsCookieConsent & keyof BsCookieConsentAttributes as `prop:${K}`]?: BsCookieConsent[K] };
         "bs-data-table": Omit<BsDataTable, keyof BsDataTableAttributes> & { [K in keyof BsDataTable & keyof BsDataTableAttributes]?: BsDataTable[K] } & { [K in keyof BsDataTable & keyof BsDataTableAttributes as `attr:${K}`]?: BsDataTableAttributes[K] } & { [K in keyof BsDataTable & keyof BsDataTableAttributes as `prop:${K}`]?: BsDataTable[K] };
         "bs-datepicker": Omit<BsDatepicker, keyof BsDatepickerAttributes> & { [K in keyof BsDatepicker & keyof BsDatepickerAttributes]?: BsDatepicker[K] } & { [K in keyof BsDatepicker & keyof BsDatepickerAttributes as `attr:${K}`]?: BsDatepickerAttributes[K] } & { [K in keyof BsDatepicker & keyof BsDatepickerAttributes as `prop:${K}`]?: BsDatepicker[K] };
         "bs-dialog": Omit<BsDialog, keyof BsDialogAttributes> & { [K in keyof BsDialog & keyof BsDialogAttributes]?: BsDialog[K] } & { [K in keyof BsDialog & keyof BsDialogAttributes as `attr:${K}`]?: BsDialogAttributes[K] } & { [K in keyof BsDialog & keyof BsDialogAttributes as `prop:${K}`]?: BsDialog[K] };
+        "bs-divider": Omit<BsDivider, keyof BsDividerAttributes> & { [K in keyof BsDivider & keyof BsDividerAttributes]?: BsDivider[K] } & { [K in keyof BsDivider & keyof BsDividerAttributes as `attr:${K}`]?: BsDividerAttributes[K] } & { [K in keyof BsDivider & keyof BsDividerAttributes as `prop:${K}`]?: BsDivider[K] };
         "bs-error-page": Omit<BsErrorPage, keyof BsErrorPageAttributes> & { [K in keyof BsErrorPage & keyof BsErrorPageAttributes]?: BsErrorPage[K] } & { [K in keyof BsErrorPage & keyof BsErrorPageAttributes as `attr:${K}`]?: BsErrorPageAttributes[K] } & { [K in keyof BsErrorPage & keyof BsErrorPageAttributes as `prop:${K}`]?: BsErrorPage[K] };
         "bs-file-upload": Omit<BsFileUpload, keyof BsFileUploadAttributes> & { [K in keyof BsFileUpload & keyof BsFileUploadAttributes]?: BsFileUpload[K] } & { [K in keyof BsFileUpload & keyof BsFileUploadAttributes as `attr:${K}`]?: BsFileUploadAttributes[K] } & { [K in keyof BsFileUpload & keyof BsFileUploadAttributes as `prop:${K}`]?: BsFileUpload[K] };
         "bs-file-upload-item": Omit<BsFileUploadItem, keyof BsFileUploadItemAttributes> & { [K in keyof BsFileUploadItem & keyof BsFileUploadItemAttributes]?: BsFileUploadItem[K] } & { [K in keyof BsFileUploadItem & keyof BsFileUploadItemAttributes as `attr:${K}`]?: BsFileUploadItemAttributes[K] } & { [K in keyof BsFileUploadItem & keyof BsFileUploadItemAttributes as `prop:${K}`]?: BsFileUploadItem[K] };
+        "bs-grid": Omit<BsGrid, keyof BsGridAttributes> & { [K in keyof BsGrid & keyof BsGridAttributes]?: BsGrid[K] } & { [K in keyof BsGrid & keyof BsGridAttributes as `attr:${K}`]?: BsGridAttributes[K] } & { [K in keyof BsGrid & keyof BsGridAttributes as `prop:${K}`]?: BsGrid[K] };
         "bs-icon-button": Omit<BsIconButton, keyof BsIconButtonAttributes> & { [K in keyof BsIconButton & keyof BsIconButtonAttributes]?: BsIconButton[K] } & { [K in keyof BsIconButton & keyof BsIconButtonAttributes as `attr:${K}`]?: BsIconButtonAttributes[K] } & { [K in keyof BsIconButton & keyof BsIconButtonAttributes as `prop:${K}`]?: BsIconButton[K] };
         "bs-icon-tile": Omit<BsIconTile, keyof BsIconTileAttributes> & { [K in keyof BsIconTile & keyof BsIconTileAttributes]?: BsIconTile[K] } & { [K in keyof BsIconTile & keyof BsIconTileAttributes as `attr:${K}`]?: BsIconTileAttributes[K] } & { [K in keyof BsIconTile & keyof BsIconTileAttributes as `prop:${K}`]?: BsIconTile[K] };
         "bs-inline-tab": Omit<BsInlineTab, keyof BsInlineTabAttributes> & { [K in keyof BsInlineTab & keyof BsInlineTabAttributes]?: BsInlineTab[K] } & { [K in keyof BsInlineTab & keyof BsInlineTabAttributes as `attr:${K}`]?: BsInlineTabAttributes[K] } & { [K in keyof BsInlineTab & keyof BsInlineTabAttributes as `prop:${K}`]?: BsInlineTab[K] };
         "bs-input": Omit<BsInput, keyof BsInputAttributes> & { [K in keyof BsInput & keyof BsInputAttributes]?: BsInput[K] } & { [K in keyof BsInput & keyof BsInputAttributes as `attr:${K}`]?: BsInputAttributes[K] } & { [K in keyof BsInput & keyof BsInputAttributes as `prop:${K}`]?: BsInput[K] };
+        "bs-list": Omit<BsList, keyof BsListAttributes> & { [K in keyof BsList & keyof BsListAttributes]?: BsList[K] } & { [K in keyof BsList & keyof BsListAttributes as `attr:${K}`]?: BsListAttributes[K] } & { [K in keyof BsList & keyof BsListAttributes as `prop:${K}`]?: BsList[K] };
+        "bs-list-item": Omit<BsListItem, keyof BsListItemAttributes> & { [K in keyof BsListItem & keyof BsListItemAttributes]?: BsListItem[K] } & { [K in keyof BsListItem & keyof BsListItemAttributes as `attr:${K}`]?: BsListItemAttributes[K] } & { [K in keyof BsListItem & keyof BsListItemAttributes as `prop:${K}`]?: BsListItem[K] };
         "bs-logo": Omit<BsLogo, keyof BsLogoAttributes> & { [K in keyof BsLogo & keyof BsLogoAttributes]?: BsLogo[K] } & { [K in keyof BsLogo & keyof BsLogoAttributes as `attr:${K}`]?: BsLogoAttributes[K] } & { [K in keyof BsLogo & keyof BsLogoAttributes as `prop:${K}`]?: BsLogo[K] };
         "bs-menu": BsMenu;
         "bs-menu-item": Omit<BsMenuItem, keyof BsMenuItemAttributes> & { [K in keyof BsMenuItem & keyof BsMenuItemAttributes]?: BsMenuItem[K] } & { [K in keyof BsMenuItem & keyof BsMenuItemAttributes as `attr:${K}`]?: BsMenuItemAttributes[K] } & { [K in keyof BsMenuItem & keyof BsMenuItemAttributes as `prop:${K}`]?: BsMenuItem[K] };
@@ -12028,6 +13129,7 @@ declare namespace LocalJSX {
         "bs-source-link": Omit<BsSourceLink, keyof BsSourceLinkAttributes> & { [K in keyof BsSourceLink & keyof BsSourceLinkAttributes]?: BsSourceLink[K] } & { [K in keyof BsSourceLink & keyof BsSourceLinkAttributes as `attr:${K}`]?: BsSourceLinkAttributes[K] } & { [K in keyof BsSourceLink & keyof BsSourceLinkAttributes as `prop:${K}`]?: BsSourceLink[K] };
         "bs-spinner": Omit<BsSpinner, keyof BsSpinnerAttributes> & { [K in keyof BsSpinner & keyof BsSpinnerAttributes]?: BsSpinner[K] } & { [K in keyof BsSpinner & keyof BsSpinnerAttributes as `attr:${K}`]?: BsSpinnerAttributes[K] } & { [K in keyof BsSpinner & keyof BsSpinnerAttributes as `prop:${K}`]?: BsSpinner[K] };
         "bs-split-pane": Omit<BsSplitPane, keyof BsSplitPaneAttributes> & { [K in keyof BsSplitPane & keyof BsSplitPaneAttributes]?: BsSplitPane[K] } & { [K in keyof BsSplitPane & keyof BsSplitPaneAttributes as `attr:${K}`]?: BsSplitPaneAttributes[K] } & { [K in keyof BsSplitPane & keyof BsSplitPaneAttributes as `prop:${K}`]?: BsSplitPane[K] };
+        "bs-stack": Omit<BsStack, keyof BsStackAttributes> & { [K in keyof BsStack & keyof BsStackAttributes]?: BsStack[K] } & { [K in keyof BsStack & keyof BsStackAttributes as `attr:${K}`]?: BsStackAttributes[K] } & { [K in keyof BsStack & keyof BsStackAttributes as `prop:${K}`]?: BsStack[K] };
         "bs-stepper": Omit<BsStepper, keyof BsStepperAttributes> & { [K in keyof BsStepper & keyof BsStepperAttributes]?: BsStepper[K] } & { [K in keyof BsStepper & keyof BsStepperAttributes as `attr:${K}`]?: BsStepperAttributes[K] } & { [K in keyof BsStepper & keyof BsStepperAttributes as `prop:${K}`]?: BsStepper[K] };
         "bs-stepper-step": Omit<BsStepperStep, keyof BsStepperStepAttributes> & { [K in keyof BsStepperStep & keyof BsStepperStepAttributes]?: BsStepperStep[K] } & { [K in keyof BsStepperStep & keyof BsStepperStepAttributes as `attr:${K}`]?: BsStepperStepAttributes[K] } & { [K in keyof BsStepperStep & keyof BsStepperStepAttributes as `prop:${K}`]?: BsStepperStep[K] };
         "bs-switch": Omit<BsSwitch, keyof BsSwitchAttributes> & { [K in keyof BsSwitch & keyof BsSwitchAttributes]?: BsSwitch[K] } & { [K in keyof BsSwitch & keyof BsSwitchAttributes as `attr:${K}`]?: BsSwitchAttributes[K] } & { [K in keyof BsSwitch & keyof BsSwitchAttributes as `prop:${K}`]?: BsSwitch[K] };
@@ -12037,6 +13139,8 @@ declare namespace LocalJSX {
         "bs-toast": Omit<BsToast, keyof BsToastAttributes> & { [K in keyof BsToast & keyof BsToastAttributes]?: BsToast[K] } & { [K in keyof BsToast & keyof BsToastAttributes as `attr:${K}`]?: BsToastAttributes[K] } & { [K in keyof BsToast & keyof BsToastAttributes as `prop:${K}`]?: BsToast[K] };
         "bs-tooltip": Omit<BsTooltip, keyof BsTooltipAttributes> & { [K in keyof BsTooltip & keyof BsTooltipAttributes]?: BsTooltip[K] } & { [K in keyof BsTooltip & keyof BsTooltipAttributes as `attr:${K}`]?: BsTooltipAttributes[K] } & { [K in keyof BsTooltip & keyof BsTooltipAttributes as `prop:${K}`]?: BsTooltip[K] };
         "bs-tooltip-trigger": Omit<BsTooltipTrigger, keyof BsTooltipTriggerAttributes> & { [K in keyof BsTooltipTrigger & keyof BsTooltipTriggerAttributes]?: BsTooltipTrigger[K] } & { [K in keyof BsTooltipTrigger & keyof BsTooltipTriggerAttributes as `attr:${K}`]?: BsTooltipTriggerAttributes[K] } & { [K in keyof BsTooltipTrigger & keyof BsTooltipTriggerAttributes as `prop:${K}`]?: BsTooltipTrigger[K] };
+        "bs-tree": Omit<BsTree, keyof BsTreeAttributes> & { [K in keyof BsTree & keyof BsTreeAttributes]?: BsTree[K] } & { [K in keyof BsTree & keyof BsTreeAttributes as `attr:${K}`]?: BsTreeAttributes[K] } & { [K in keyof BsTree & keyof BsTreeAttributes as `prop:${K}`]?: BsTree[K] };
+        "bs-tree-item": Omit<BsTreeItem, keyof BsTreeItemAttributes> & { [K in keyof BsTreeItem & keyof BsTreeItemAttributes]?: BsTreeItem[K] } & { [K in keyof BsTreeItem & keyof BsTreeItemAttributes as `attr:${K}`]?: BsTreeItemAttributes[K] } & { [K in keyof BsTreeItem & keyof BsTreeItemAttributes as `prop:${K}`]?: BsTreeItem[K] };
         "bs-whats-new": Omit<BsWhatsNew, keyof BsWhatsNewAttributes> & { [K in keyof BsWhatsNew & keyof BsWhatsNewAttributes]?: BsWhatsNew[K] } & { [K in keyof BsWhatsNew & keyof BsWhatsNewAttributes as `attr:${K}`]?: BsWhatsNewAttributes[K] } & { [K in keyof BsWhatsNew & keyof BsWhatsNewAttributes as `prop:${K}`]?: BsWhatsNew[K] };
         "bs-whats-new-entry": Omit<BsWhatsNewEntry, keyof BsWhatsNewEntryAttributes> & { [K in keyof BsWhatsNewEntry & keyof BsWhatsNewEntryAttributes]?: BsWhatsNewEntry[K] } & { [K in keyof BsWhatsNewEntry & keyof BsWhatsNewEntryAttributes as `attr:${K}`]?: BsWhatsNewEntryAttributes[K] } & { [K in keyof BsWhatsNewEntry & keyof BsWhatsNewEntryAttributes as `prop:${K}`]?: BsWhatsNewEntry[K] };
     }
@@ -12135,6 +13239,28 @@ declare module "@stencil/core" {
              * `--bs-duration-slower` is 500ms), so this is aliased directly to the literal value.
              */
             "bs-ai-thinking": LocalJSX.IntrinsicElements["bs-ai-thinking"] & JSXBase.HTMLAttributes<HTMLBsAiThinkingElement>;
+            /**
+             * The page frame: a header across the top, and below it a navigation | main | aside row, laid out
+             * with CSS grid. The main column scrolls independently of the header and the side columns.
+             * Layout only. Compose it from the existing shell components: put a `bs-navigation-header`
+             * (usually `alignment="with-navigation-drawer"`) in `header` and a `bs-navigation-drawer` in
+             * `navigation`. The drawer sizes itself (expanded or collapsed rail); the shell reserves an `auto`
+             * track for it, so there is no `navigationWidth` prop. `bs-navigation-header` has no `collapsed`
+             * prop, so there is no collapse state to mirror and the shell does not listen to `bsCollapse`: the
+             * auto track follows the drawer's width on its own.
+             * The shell creates no landmarks besides `<main>`; the slotted header and drawer bring their own
+             * `banner` and `navigation` roles.
+             * ## When to use
+             * - The outer frame of an application page with a header and side navigation.
+             * ## When not to use
+             * - Content layout inside the page (use `bs-grid`) or resizable panes (use `bs-split-pane`).
+             * - Pages that already have their own `<main>`; the shell would add a duplicate landmark.
+             * @prop --bs-app-shell-bg - Shell background. Aliased to `--bs-surface-base`.
+             * @prop --bs-app-shell-color - Text colour. Aliased to `--bs-text-default`.
+             * @prop --bs-app-shell-main-padding - Padding of the main area. Aliased to `--bs-spacing-400`.
+             * @prop --bs-app-shell-aside-width - Width of the aside column. Defaults to `auto` (zero when empty).
+             */
+            "bs-app-shell": LocalJSX.IntrinsicElements["bs-app-shell"] & JSXBase.HTMLAttributes<HTMLBsAppShellElement>;
             /**
              * A single file attachment preview for `bs-composer` -- an image thumbnail, or a filename card
              * with a colored file-type badge (PDF/Document), with an optional upload-in-progress spinner and
@@ -12690,6 +13816,17 @@ declare module "@stencil/core" {
              * every `type`). Aliased to `--bs-color-neutral-container-hover`.
              */
             "bs-composer-status-banner": LocalJSX.IntrinsicElements["bs-composer-status-banner"] & JSXBase.HTMLAttributes<HTMLBsComposerStatusBannerElement>;
+            /**
+             * A centred wrapper that limits content width to a breakpoint and adds horizontal padding.
+             * ## When to use
+             * - Constraining page or section content to a readable, consistent maximum width.
+             * ## When not to use
+             * - Arranging children relative to each other (use `bs-stack`).
+             * - Full-bleed regions such as hero backgrounds (use `size="fluid"` or no container).
+             * @prop --bs-container-max-width - Maximum width. Aliased to the `--bs-breakpoint-*` token for `size`; `none` for `fluid`.
+             * @prop --bs-container-padding - Horizontal padding. Aliased to the `padding` spacing token (default `--bs-spacing-300`).
+             */
+            "bs-container": LocalJSX.IntrinsicElements["bs-container"] & JSXBase.HTMLAttributes<HTMLBsContainerElement>;
             /**
              * A cookie consent prompt in four forms, matching the Figma "Cookie consent" component:
              * - `banner` -- a wide bar: icon, heading, text, policy link, and Customise / Reject optional / Accept
@@ -12765,6 +13902,18 @@ declare module "@stencil/core" {
              * button in the header row next to the heading, same as before this addition.
              */
             "bs-dialog": LocalJSX.IntrinsicElements["bs-dialog"] & JSXBase.HTMLAttributes<HTMLBsDialogElement>;
+            /**
+             * A thin line that separates content, horizontally or vertically.
+             * ## When to use
+             * - Separating groups of related content in a list, menu, toolbar or card.
+             * ## When not to use
+             * - Adding vertical space between blocks (use `bs-stack` gap or spacing tokens).
+             * - Drawing a border around a surface (use `bs-card`).
+             * @prop --bs-divider-thickness - Line thickness. Defaults to `1px`.
+             * @prop --bs-divider-color - Line colour. Aliased to `--bs-border-neutral-container` (`default`) or `--bs-neutral-100` (`subtle`).
+             * @prop --bs-divider-inset - Indent applied by `inset`. Aliased to `--bs-spacing-300`.
+             */
+            "bs-divider": LocalJSX.IntrinsicElements["bs-divider"] & JSXBase.HTMLAttributes<HTMLBsDividerElement>;
             /**
              * A full-block page for when the user can't get to what they asked for: page not found (404), a server
              * error (500), no access (403), planned maintenance, or no internet connection. Matches the Figma
@@ -12804,6 +13953,25 @@ declare module "@stencil/core" {
              * - Attaching files to a chat message -- use `bs-attachment`.
              */
             "bs-file-upload-item": LocalJSX.IntrinsicElements["bs-file-upload-item"] & JSXBase.HTMLAttributes<HTMLBsFileUploadItemElement>;
+            /**
+             * A CSS grid layout wrapper. Children are placed in equal-width columns with a token-based gap.
+             * `columns` takes either a number (`"3"` becomes `repeat(3, minmax(0, 1fr))`) or any raw
+             * `grid-template-columns` value (`"200px 1fr"`). `minColumnWidth` is the responsive mechanism: it
+             * switches to `repeat(auto-fit, minmax(min(100%, X), 1fr))`, so the column count adapts to the
+             * container width and `columns` is ignored. There are deliberately no per-breakpoint props in v1.
+             * `gap`, `rowGap` and `columnGap` take spacing token names (`"200"` maps to `var(--bs-spacing-200)`);
+             * unknown names fall back to `100`.
+             * ## When to use
+             * - Card grids, form field grids and dashboards where items share equal column tracks.
+             * - Responsive galleries via `minColumnWidth`.
+             * ## When not to use
+             * - A single row or column of items with no wrapping (plain flex).
+             * - Resizable multi-pane layouts (use `bs-split-pane`) or the page frame (use `bs-app-shell`).
+             * @prop --bs-grid-gap - Gap on both axes. Overrides the `gap` prop's token (default `--bs-spacing-100`).
+             * @prop --bs-grid-row-gap - Row gap. Overrides `--bs-grid-gap` and the `rowGap` prop's token.
+             * @prop --bs-grid-column-gap - Column gap. Overrides `--bs-grid-gap` and the `columnGap` prop's token.
+             */
+            "bs-grid": LocalJSX.IntrinsicElements["bs-grid"] & JSXBase.HTMLAttributes<HTMLBsGridElement>;
             /**
              * A clickable, icon-only action element -- the icon-only sibling of `bs-button`, sharing the same
              * 8 visual variants and color language, but ALWAYS rendering just a single icon, never a label.
@@ -12879,6 +14047,58 @@ declare module "@stencil/core" {
              *   options list at all (freeform chip entry).
              */
             "bs-input": LocalJSX.IntrinsicElements["bs-input"] & JSXBase.HTMLAttributes<HTMLBsInputElement>;
+            /**
+             * A vertical list of `bs-list-item` rows, optionally single-select.
+             * ## When to use
+             * - Records, people, files or options shown as rows with leading media and descriptions.
+             * - `selectable` for a single-choice list (e.g. a conversation list next to a detail pane).
+             * ## When not to use
+             * - A popup list of actions -- use `bs-menu`.
+             * - Navigation between app sections -- use `bs-navigation-drawer`.
+             * - Multi-column, sortable or paged data -- use `bs-data-table`.
+             * Built from `bs-list-item` children (light DOM; the list never moves nodes).
+             * @prop --bs-list-gap - Gap between rows. Defaults to `0`.
+             * @prop --bs-list-divider-color - Divider colour when `dividers` is set. Aliased to `--bs-border-neutral-container`.
+             */
+            "bs-list": LocalJSX.IntrinsicElements["bs-list"] & JSXBase.HTMLAttributes<HTMLBsListElement>;
+            /**
+             * A single row of a list: optional leading media (avatar, icon, image), a label, a description and
+             * optional support text, and an optional trailing caret or custom trailing content.
+             * ## When to use
+             * - As a child of `bs-list`, one per record, person, file or option.
+             * - Standalone as a plain information row (non-interactive), or with `interactive` as a button-like row.
+             * ## When not to use
+             * - A popup list of actions -- use `bs-menu` / `bs-menu-item`.
+             * - App navigation with an active route -- use `bs-navigation-drawer-item`.
+             * - Tabular data with columns, sorting or paging -- use `bs-data-table`.
+             * Composed from: leading media (`bs-avatar`) and trailing controls (`bs-icon-button`) are supplied by the
+             * consumer through the `leading` and `trailing` slots; the row itself only reserves layout. The default
+             * trailing caret is inline SVG.
+             * Roles are driven by the parent `bs-list` (via `selectionRole`). Standalone, the row has no role
+             * (`listitem` is only valid inside a list) unless `interactive` is set, which makes it a focusable
+             * `role="button"`.
+             * @prop --bs-list-item-min-height - Minimum row height. Aliased to `--bs-spacing-1000`.
+             * @prop --bs-list-item-padding-y - Aliased to `--bs-spacing-150`.
+             * @prop --bs-list-item-padding-x - Aliased to `--bs-spacing-200`.
+             * @prop --bs-list-item-gap - Gap between leading, content and trailing. Aliased to `--bs-spacing-200`.
+             * @prop --bs-list-item-content-gap - Gap between text lines. Aliased to `--bs-spacing-25`.
+             * @prop --bs-list-item-radius - Aliased to `--bs-border-radius-100`.
+             * @prop --bs-list-item-bg - Enabled background. `transparent`.
+             * @prop --bs-list-item-bg-hover - Aliased to `--bs-surface-hover`.
+             * @prop --bs-list-item-bg-pressed - Aliased to `--bs-surface-pressed`.
+             * @prop --bs-list-item-bg-focus - Aliased to `--bs-surface-focus`.
+             * @prop --bs-list-item-bg-selected - Aliased to `--bs-surface-selected`.
+             * @prop --bs-list-item-bg-selected-hover - Aliased to `--bs-surface-selected-hover`.
+             * @prop --bs-list-item-bg-selected-pressed - Aliased to `--bs-surface-selected-pressed`.
+             * @prop --bs-list-item-bg-selected-focus - Aliased to `--bs-surface-selected-focus`.
+             * @prop --bs-list-item-bg-disabled - Aliased to `--bs-surface-action-disabled`.
+             * @prop --bs-list-item-color - Text colour. Aliased to `--bs-text-default`.
+             * @prop --bs-list-item-color-disabled - Aliased to `--bs-text-on-disabled`.
+             * @prop --bs-list-item-focus-ring - Focus ring colour. Aliased to `--bs-border-neutral-focus`.
+             * @prop --bs-list-item-image-width - Leading image width. 72px.
+             * @prop --bs-list-item-image-height - Leading image height. 56px.
+             */
+            "bs-list-item": LocalJSX.IntrinsicElements["bs-list-item"] & JSXBase.HTMLAttributes<HTMLBsListItemElement>;
             /**
              * The BrandSync brand mark, as its own standalone component -- shared by `bs-navigation-header`
              * and `bs-navigation-drawer`, which used to each render their own duplicated copy of this SVG
@@ -13385,6 +14605,21 @@ declare module "@stencil/core" {
              * @prop --bs-split-pane-focus-ring - Divider focus ring colour. Aliased to `--bs-border-neutral-focus`.
              */
             "bs-split-pane": LocalJSX.IntrinsicElements["bs-split-pane"] & JSXBase.HTMLAttributes<HTMLBsSplitPaneElement>;
+            /**
+             * A flex layout that arranges its children in a row or column with a token-based gap, optionally
+             * drawing a divider between children.
+             * Built from: `bs-divider` (when `divider` is set).
+             * With `divider`, each child is given a generated `slot="bs-stack-item-N"` attribute (plus a
+             * `data-bs-stack-item` marker) so a divider can be rendered between the named slots. Light-DOM
+             * nodes are never moved; the attributes are removed again when `divider` is turned off.
+             * ## When to use
+             * - Spacing and aligning a short run of siblings (form fields, button rows, card content).
+             * ## When not to use
+             * - Two-dimensional grids (use CSS grid).
+             * - Resizable panes (use `bs-split-pane`).
+             * @prop --bs-stack-gap - Space between items. Defaults from the `gap` prop (`--bs-spacing-<gap>`); may be overridden directly.
+             */
+            "bs-stack": LocalJSX.IntrinsicElements["bs-stack"] & JSXBase.HTMLAttributes<HTMLBsStackElement>;
             /**
              * A sequence of named steps showing overall progress through a multi-step flow (e.g. a checkout,
              * an onboarding wizard) -- each step reads as enabled (not yet reached), current, done, error, or
@@ -13542,6 +14777,28 @@ declare module "@stencil/core" {
              * @prop --bs-tooltip-trigger-z-index - Stacking order. Aliased to `--bs-z-index-popover`.
              */
             "bs-tooltip-trigger": LocalJSX.IntrinsicElements["bs-tooltip-trigger"] & JSXBase.HTMLAttributes<HTMLBsTooltipTriggerElement>;
+            /**
+             * A hierarchical list of `bs-tree-item` rows with single selection, expand/collapse and the
+             * WAI-ARIA tree keyboard pattern.
+             * The tree owns `role="tree"`, the roving `tabindex` (exactly one enabled, visible item is
+             * tabbable: the selected one, otherwise the first), selection (kept in sync with each item's
+             * `selected`) and keyboard navigation over the visible (rendered, non-disabled) items. Items own
+             * their expansion state and emit `bsSelect` / `bsToggle`.
+             * Built from: `bs-tree-item` rows.
+             */
+            "bs-tree": LocalJSX.IntrinsicElements["bs-tree"] & JSXBase.HTMLAttributes<HTMLBsTreeElement>;
+            /**
+             * A single row of a `bs-tree`. An item that contains child `bs-tree-item` elements is a parent
+             * (it gets an expand/collapse caret and a folder icon); an item without children is a leaf (no
+             * caret, file icon).
+             * The host carries `role="treeitem"` and the `aria-*` state; the owning `bs-tree` manages the
+             * roving `tabindex`, selection and keyboard navigation. Nesting depth is computed automatically
+             * from the number of ancestor `bs-tree-item` elements and exposed as `aria-level` -- it is not a
+             * prop. Clicking the row selects it; clicking the caret (or pressing Right/Left in a tree) toggles
+             * expansion -- the two are deliberately separate.
+             * Built from: inline SVG icons only (no existing `bs-*` component covers a tree row).
+             */
+            "bs-tree-item": LocalJSX.IntrinsicElements["bs-tree-item"] & JSXBase.HTMLAttributes<HTMLBsTreeItemElement>;
             /**
              * A product's "What's new" surface, in three forms matching the Figma component:
              * - `feed` -- a docked panel: heading, "Mark all as read", filter tabs, the list of updates (each a