@akcelik/strct 0.11.0 → 0.24.0

package/types/akcelik-strct.d.ts

@@ -1,6 +1,7 @@
 import * as _angular_core from '@angular/core';
 import { OnDestroy, TemplateRef } from '@angular/core';
 import { SafeHtml } from '@angular/platform-browser';
+import * as _akcelik_strct from '@akcelik/strct';
 import { ControlValueAccessor } from '@angular/forms';
 
 /** Available color palettes. */
@@ -54,10 +55,40 @@ declare class StrctThemeSwitcher {
     static ɵcmp: _angular_core.ɵɵComponentDeclaration<StrctThemeSwitcher, "strct-theme-switcher", never, {}, {}, never, never, true, never>;
 }
 
+/**
+ * Shared status / tone union used across the library's tone-colored components
+ * (badge, metric tile, hero, flow, segmented …). One canonical type so apps and
+ * components agree on the same five tones instead of each re-declaring them.
+ *
+ * `StrctProgress` / `StrctGauge` use the narrower `StrctChartStatus` (no
+ * `'neutral'`) since a bar/gauge is always tinted.
+ */
+type StrctStatus = 'neutral' | 'accent' | 'success' | 'warning' | 'critical';
+/**
+ * Optional value-driven thresholds for meters (`StrctProgress`, `StrctGauge`).
+ * When supplied, the component derives its own status from the value:
+ * `value >= critical → 'critical'`, `>= warning → 'warning'`, otherwise the
+ * healthy base ('success' by default).
+ */
+interface StrctThresholds {
+    warning?: number;
+    critical?: number;
+}
+
 /**
  * Inner markup (path/shape contents) for each icon, drawn on a 0 0 16 16
  * viewBox with `currentColor` stroke. Keep strokes at 1.3–1.5 for crispness.
  *
+ * RENDER SIZES ("16 Native" policy): object / semantic glyphs must render at the
+ * grid's native 16px or larger — never downscaled (fractional scaling blurs
+ * hairlines). Simple single-stroke glyphs (chevrons, close, check, dots) may
+ * render at 11–14px; their wide details survive scaling.
+ *
+ * DETAIL BUDGET (small-size legibility): icons render as small as 14px, so keep
+ * gaps between parallel details ≥ 1.5px on the 16-grid (≈ max 3 parallel lines),
+ * prefer one large distinguishing feature over many small ones, and cap a glyph
+ * at ~6 drawing elements. Filled dots should be r ≥ 0.55.
+ *
  * The set is intentionally datacenter-flavoured (hosts, clusters, switches,
  * storage, VMs …). Object state — running / stopped / maintenance — is layered
  * on with the `badge` input rather than a separate icon per state.
@@ -346,11 +377,23 @@ type StrctProgressStatus = 'accent' | 'success' | 'warning' | 'critical';
 declare class StrctProgress {
     /** Current value. */
     readonly value: _angular_core.InputSignal<number>;
+    /** Accessible name of the bar (e.g. "CPU usage"). Falls back to "Progress". */
+    readonly label: _angular_core.InputSignal<string>;
     /** Visual status color. */
     readonly status: _angular_core.InputSignal<StrctProgressStatus>;
+    /**
+     * Optional value-driven thresholds. When set, the component picks its own
+     * status from the value instead of the caller computing it: `value >= critical`
+     * → critical, `>= warning` → warning, else the healthy base. The healthy base is
+     * `status` when it has been set to a semantic tone, or `'success'` when `status`
+     * is left at its default `'accent'`.
+     */
+    readonly thresholds: _angular_core.InputSignal<StrctThresholds | null>;
     protected readonly clamped: _angular_core.Signal<number>;
+    /** Status after applying thresholds (falls back to `status` when none set). */
+    protected readonly resolvedStatus: _angular_core.Signal<StrctProgressStatus>;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<StrctProgress, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<StrctProgress, "strct-progress", never, { "value": { "alias": "value"; "required": false; "isSignal": true; }; "status": { "alias": "status"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<StrctProgress, "strct-progress", never, { "value": { "alias": "value"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "status": { "alias": "status"; "required": false; "isSignal": true; }; "thresholds": { "alias": "thresholds"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
 }
 
 /** Spinner size variants. */
@@ -359,8 +402,10 @@ type StrctSpinnerSize = 'sm' | 'md' | 'lg';
 declare class StrctSpinner {
     /** Size variant. */
     readonly size: _angular_core.InputSignal<StrctSpinnerSize>;
+    /** Accessible label (localizable). */
+    readonly label: _angular_core.InputSignal<string>;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<StrctSpinner, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<StrctSpinner, "strct-spinner", never, { "size": { "alias": "size"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<StrctSpinner, "strct-spinner", never, { "size": { "alias": "size"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
 }
 
 /**
@@ -405,20 +450,51 @@ declare class StrctSpeedDial {
 
 /**
  * Surface container. Compose with the header / block / footer pieces:
- *   <strct-card>
- *     <strct-card-header>Title</strct-card-header>
- *     <strct-card-block>...</strct-card-block>
+ *
+ *   <strct-card status="warning" collapsible [(collapsed)]="hidden">
+ *     <strct-card-header icon="host">Host hv-02</strct-card-header>
+ *     <strct-card-block>…</strct-card-block>
  *     <strct-card-footer><button strct-button>OK</button></strct-card-footer>
  *   </strct-card>
+ *
+ * Rich options (all opt-in; defaults preserve the plain card):
+ * - `status` — tone rail on the leading edge (same language as alert / hero).
+ * - `interactive` — hover lift + accent border for clickable cards.
+ * - `selected` — accent ring for picker layouts.
+ * - `dense` — tighter paddings for dashboards.
+ * - `loading` — indeterminate top bar + `aria-busy` (reduced-motion safe).
+ * - `collapsible` + two-way `collapsed` — the header gains a chevron toggle;
+ *   block and footer hide while collapsed.
  */
 declare class StrctCard {
+    /** Tone rail on the leading edge. */
+    readonly status: _angular_core.InputSignal<StrctStatus>;
+    /** Hover lift + accent border for clickable cards (style-only affordance). */
+    readonly interactive: _angular_core.InputSignalWithTransform<boolean, unknown>;
+    /** Accent ring — for picker / multi-select card layouts. */
+    readonly selected: _angular_core.InputSignalWithTransform<boolean, unknown>;
+    /** Tighter paddings for dense dashboards. */
+    readonly dense: _angular_core.InputSignalWithTransform<boolean, unknown>;
+    /** Indeterminate top bar + aria-busy; body/footer dim and ignore input. */
+    readonly loading: _angular_core.InputSignalWithTransform<boolean, unknown>;
+    /** Allow collapsing to just the header (a chevron appears in the header). */
+    readonly collapsible: _angular_core.InputSignalWithTransform<boolean, unknown>;
+    /** Collapsed state (two-way; only meaningful with `collapsible`). */
+    readonly collapsed: _angular_core.ModelSignal<boolean>;
+    toggle(): void;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<StrctCard, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<StrctCard, "strct-card", never, {}, {}, never, ["*"], true, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<StrctCard, "strct-card", never, { "status": { "alias": "status"; "required": false; "isSignal": true; }; "interactive": { "alias": "interactive"; "required": false; "isSignal": true; }; "selected": { "alias": "selected"; "required": false; "isSignal": true; }; "dense": { "alias": "dense"; "required": false; "isSignal": true; }; "loading": { "alias": "loading"; "required": false; "isSignal": true; }; "collapsible": { "alias": "collapsible"; "required": false; "isSignal": true; }; "collapsed": { "alias": "collapsed"; "required": false; "isSignal": true; }; }, { "collapsed": "collapsedChange"; }, never, ["*"], true, never>;
 }
 /** Header section of a {@link StrctCard}. */
 declare class StrctCardHeader {
+    /** Optional leading icon (StrctIcon set). */
+    readonly icon: _angular_core.InputSignal<string>;
+    /** Accessible labels for the collapse toggle (localizable). */
+    readonly collapseLabel: _angular_core.InputSignal<string>;
+    readonly expandLabel: _angular_core.InputSignal<string>;
+    protected readonly card: StrctCard | null;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<StrctCardHeader, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<StrctCardHeader, "strct-card-header", never, {}, {}, never, ["*"], true, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<StrctCardHeader, "strct-card-header", never, { "icon": { "alias": "icon"; "required": false; "isSignal": true; }; "collapseLabel": { "alias": "collapseLabel"; "required": false; "isSignal": true; }; "expandLabel": { "alias": "expandLabel"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
 }
 /** Body section of a {@link StrctCard}. */
 declare class StrctCardBlock {
@@ -463,12 +539,12 @@ declare class StrctTab {
 /** Tab group. Wraps `<strct-tab>` children and renders the tab bar. */
 declare class StrctTabs {
     readonly tabs: _angular_core.Signal<readonly StrctTab[]>;
-    readonly selectedIndex: _angular_core.WritableSignal<number>;
+    readonly selectedIndex: _angular_core.ModelSignal<number>;
     constructor();
     select(index: number): void;
     onKeydown(event: KeyboardEvent, bar: HTMLElement): void;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<StrctTabs, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<StrctTabs, "strct-tabs", never, {}, {}, ["tabs"], ["*"], true, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<StrctTabs, "strct-tabs", never, { "selectedIndex": { "alias": "selectedIndex"; "required": false; "isSignal": true; }; }, { "selectedIndex": "selectedIndexChange"; }, ["tabs"], ["*"], true, never>;
 }
 
 /** A single entry in a data-driven menu. */
@@ -581,6 +657,12 @@ declare class StrctContextMenuTrigger {
 
 /** A node in the data-driven tree (`<strct-tree [nodes]="...">`). */
 interface StrctTreeNodeData {
+    /**
+     * Stable unique key — used for `trackBy`, controlled expansion state
+     * (`expandedIds`) and a `data-node-id` DOM attribute. Falls back to `label`
+     * when absent (backward-compatible).
+     */
+    id?: string;
     label: string;
     /** Optional leading icon name. */
     icon?: string;
@@ -634,15 +716,31 @@ declare class StrctTreeNode {
     readonly nodeMenuSelect: _angular_core.OutputEmitterRef<StrctTreeMenuEvent>;
     /** Right-click menu items for this node ([] when no resolver / not data mode). */
     protected readonly menuItems: _angular_core.Signal<StrctMenuItem[]>;
+    /** The owning `<strct-tree>` (null only for standalone nodes outside a tree). */
+    protected readonly tree: StrctTree | null;
+    /** Node icon scales with the owning tree's density (16 native → 18 comfortable). */
+    protected readonly iconSize: _angular_core.Signal<16 | 18>;
+    /** Parent tree node (element-injector ancestor); drives aria-level + ArrowLeft. */
+    readonly parent: StrctTreeNode | null;
+    /** 1-based depth, exposed as aria-level. */
+    readonly level: number;
+    private readonly hostEl;
     private readonly childNodes;
-    /** Data-mode expansion (seeded from node.expanded on first toggle). */
+    /** Data-mode expansion fallback when there is no owning tree (seeded from node.expanded). */
     private readonly dataExpanded;
     protected readonly displayLabel: _angular_core.Signal<string>;
     protected readonly displayIcon: _angular_core.Signal<string | undefined>;
     protected readonly displayBadge: _angular_core.Signal<StrctIconBadge>;
     protected readonly displayActive: _angular_core.Signal<boolean>;
-    protected readonly hasChildren: _angular_core.Signal<boolean>;
-    protected readonly isOpen: _angular_core.Signal<boolean>;
+    constructor();
+    /** The focusable row element of this node. */
+    rowEl(): HTMLElement | null;
+    /** Roving tabindex: inside a tree only the active row is tabbable. */
+    protected readonly rowTabindex: _angular_core.Signal<0 | -1>;
+    protected onRowFocus(): void;
+    protected onRowKeydown(event: KeyboardEvent): void;
+    readonly hasChildren: _angular_core.Signal<boolean>;
+    readonly isOpen: _angular_core.Signal<boolean>;
     toggle(): void;
     protected onActivate(): void;
     protected onMenuSelect(item: StrctMenuItem): void;
@@ -657,14 +755,59 @@ declare class StrctTreeNode {
 declare class StrctTree {
     /** Data-driven node list; when set, projected content is ignored. */
     readonly nodes: _angular_core.InputSignal<StrctTreeNodeData[] | null>;
+    /**
+     * Row density. `compact` (default) is the dense inventory layout —
+     * 13px text / 16px icons; `comfortable` relaxes to 14px text / 18px icons
+     * with taller rows for touch-friendly or low-density consoles.
+     */
+    readonly density: _angular_core.InputSignal<"compact" | "comfortable">;
     /** Per-node right-click menu resolver. */
     readonly nodeMenu: _angular_core.InputSignal<StrctTreeNodeMenuFn | null>;
     /** Emitted when any data-driven node is clicked. */
     readonly nodeActivated: _angular_core.OutputEmitterRef<StrctTreeNodeData>;
     /** Emitted when a data-driven node's right-click menu item is chosen. */
     readonly nodeMenuSelect: _angular_core.OutputEmitterRef<StrctTreeMenuEvent>;
+    /**
+     * Controlled expansion (two-way). When non-null it is the single source of
+     * truth: node open state derives from it and toggles write back through it, so
+     * persisting/restoring is `<strct-tree [(expandedIds)]="ids" />`. When null
+     * (default), expansion is uncontrolled — seeded from each node's `expanded`
+     * flag and owned internally (backward-compatible).
+     */
+    readonly expandedIds: _angular_core.ModelSignal<string[] | null>;
+    /** The full set of expanded ids, emitted on every expand / collapse. */
+    readonly expandedChange: _angular_core.OutputEmitterRef<string[]>;
+    /** Emitted per toggle with the node and its new state. */
+    readonly nodeToggled: _angular_core.OutputEmitterRef<{
+        node: StrctTreeNodeData;
+        expanded: boolean;
+    }>;
+    /** Stable key for a node: its `id`, or the `label` as a fallback. */
+    private readonly keyOf;
+    /** Explicit user toggles layered on top of the `node.expanded` seed (uncontrolled). */
+    private readonly overrides;
+    /** Keys expanded by their `node.expanded` seed (pure — no flash on first render). */
+    private readonly seededSet;
+    /** The active expanded-key set — controlled `expandedIds`, or seed + overrides. */
+    private readonly currentSet;
+    /** Whether a node is currently expanded (called by its `StrctTreeNode`). */
+    isNodeOpen(node: StrctTreeNodeData): boolean;
+    private readonly registeredNodes;
+    private readonly activeRoving;
+    registerNode(node: StrctTreeNode): void;
+    unregisterNode(node: StrctTreeNode): void;
+    /** Visible nodes in document order (collapsed subtrees are never registered). */
+    private ordered;
+    /** Whether this node currently holds the roving tabindex (0). */
+    isRovingActive(node: StrctTreeNode): boolean;
+    setActive(node: StrctTreeNode): void;
+    private focusNode;
+    /** Keyboard navigation between visible rows (called from the focused node). */
+    navigate(node: StrctTreeNode, key: string): void;
+    /** Toggle a node's expansion, updating state and emitting outputs. */
+    toggleNode(node: StrctTreeNodeData): void;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<StrctTree, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<StrctTree, "strct-tree", never, { "nodes": { "alias": "nodes"; "required": false; "isSignal": true; }; "nodeMenu": { "alias": "nodeMenu"; "required": false; "isSignal": true; }; }, { "nodeActivated": "nodeActivated"; "nodeMenuSelect": "nodeMenuSelect"; }, never, ["*"], true, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<StrctTree, "strct-tree", never, { "nodes": { "alias": "nodes"; "required": false; "isSignal": true; }; "density": { "alias": "density"; "required": false; "isSignal": true; }; "nodeMenu": { "alias": "nodeMenu"; "required": false; "isSignal": true; }; "expandedIds": { "alias": "expandedIds"; "required": false; "isSignal": true; }; }, { "nodeActivated": "nodeActivated"; "nodeMenuSelect": "nodeMenuSelect"; "expandedIds": "expandedIdsChange"; "expandedChange": "expandedChange"; "nodeToggled": "nodeToggled"; }, never, ["*"], true, never>;
 }
 
 /** Fixed modal width presets: sm 480 · md 640 · lg 860 · xl 1080 (px). */
@@ -689,6 +832,8 @@ declare class StrctModal {
     readonly size: _angular_core.InputSignal<StrctModalSize>;
     /** Hide the footer slot. */
     readonly hideFooter: _angular_core.InputSignalWithTransform<boolean, unknown>;
+    /** Accessible label of the X close button (localizable). */
+    readonly closeLabel: _angular_core.InputSignal<string>;
     /**
      * Allow closing via a backdrop click / the Escape key. **Off by default** —
      * a modal closes only through its X button or an explicit action button, so a
@@ -705,7 +850,7 @@ declare class StrctModal {
     private locked;
     constructor();
     close(): void;
-    protected onBackdrop(): void;
+    protected onBackdrop(event?: Event): void;
     protected onEscape(): void;
     /** Wrap Tab focus within the dialog. */
     protected onTab(event: Event): void;
@@ -713,7 +858,7 @@ declare class StrctModal {
     private focusable;
     private focusInitial;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<StrctModal, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<StrctModal, "strct-modal", never, { "open": { "alias": "open"; "required": false; "isSignal": true; }; "title": { "alias": "title"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "hideFooter": { "alias": "hideFooter"; "required": false; "isSignal": true; }; "dismissible": { "alias": "dismissible"; "required": false; "isSignal": true; }; }, { "open": "openChange"; "closed": "closed"; }, never, ["*", "[strctModalFooter]"], true, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<StrctModal, "strct-modal", never, { "open": { "alias": "open"; "required": false; "isSignal": true; }; "title": { "alias": "title"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "hideFooter": { "alias": "hideFooter"; "required": false; "isSignal": true; }; "closeLabel": { "alias": "closeLabel"; "required": false; "isSignal": true; }; "dismissible": { "alias": "dismissible"; "required": false; "isSignal": true; }; }, { "open": "openChange"; "closed": "closed"; }, never, ["*", "[strctModalFooter]"], true, never>;
 }
 
 /** Marks the drawer's footer action area: `<ng-container strctDrawerFooter>…`. */
@@ -858,9 +1003,12 @@ declare class StrctStep {
 /** Multi-step flow with a numbered header and Back / Next / Finish controls. */
 declare class StrctWizard {
     readonly steps: _angular_core.Signal<readonly StrctStep[]>;
-    readonly current: _angular_core.WritableSignal<number>;
+    readonly current: _angular_core.ModelSignal<number>;
     /** Label for the final-step button (default "Finish"). */
     readonly finishLabel: _angular_core.InputSignal<string>;
+    /** Labels for the Back / Next buttons (localizable). */
+    readonly backLabel: _angular_core.InputSignal<string>;
+    readonly nextLabel: _angular_core.InputSignal<string>;
     /** Disable Finish and show a busy label while an async submit is in flight. */
     readonly submitting: _angular_core.InputSignalWithTransform<boolean, unknown>;
     /** Show a Cancel button on the left. */
@@ -879,7 +1027,7 @@ declare class StrctWizard {
     back(): void;
     finish(): void;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<StrctWizard, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<StrctWizard, "strct-wizard", never, { "finishLabel": { "alias": "finishLabel"; "required": false; "isSignal": true; }; "submitting": { "alias": "submitting"; "required": false; "isSignal": true; }; "cancelable": { "alias": "cancelable"; "required": false; "isSignal": true; }; }, { "finished": "finished"; "cancelled": "cancelled"; "stepChange": "stepChange"; }, ["steps"], ["*"], true, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<StrctWizard, "strct-wizard", never, { "current": { "alias": "current"; "required": false; "isSignal": true; }; "finishLabel": { "alias": "finishLabel"; "required": false; "isSignal": true; }; "backLabel": { "alias": "backLabel"; "required": false; "isSignal": true; }; "nextLabel": { "alias": "nextLabel"; "required": false; "isSignal": true; }; "submitting": { "alias": "submitting"; "required": false; "isSignal": true; }; "cancelable": { "alias": "cancelable"; "required": false; "isSignal": true; }; }, { "current": "currentChange"; "finished": "finished"; "cancelled": "cancelled"; "stepChange": "stepChange"; }, ["steps"], ["*"], true, never>;
 }
 
 /**
@@ -914,6 +1062,10 @@ type PageToken = number | 'dots';
  *   <strct-pagination [total]="240" [pageSize]="20" [(page)]="page" />
  */
 declare class StrctPagination {
+    /** Accessible labels (localizable). */
+    readonly prevLabel: _angular_core.InputSignal<string>;
+    readonly nextLabel: _angular_core.InputSignal<string>;
+    readonly regionLabel: _angular_core.InputSignal<string>;
     /** Total number of items. */
     readonly total: _angular_core.InputSignal<number>;
     /** Rows per page (0 disables paging). */
@@ -924,7 +1076,7 @@ declare class StrctPagination {
     protected readonly pages: _angular_core.Signal<PageToken[]>;
     go(target: number): void;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<StrctPagination, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<StrctPagination, "strct-pagination", never, { "total": { "alias": "total"; "required": true; "isSignal": true; }; "pageSize": { "alias": "pageSize"; "required": false; "isSignal": true; }; "page": { "alias": "page"; "required": false; "isSignal": true; }; }, { "page": "pageChange"; }, never, never, true, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<StrctPagination, "strct-pagination", never, { "prevLabel": { "alias": "prevLabel"; "required": false; "isSignal": true; }; "nextLabel": { "alias": "nextLabel"; "required": false; "isSignal": true; }; "regionLabel": { "alias": "regionLabel"; "required": false; "isSignal": true; }; "total": { "alias": "total"; "required": true; "isSignal": true; }; "pageSize": { "alias": "pageSize"; "required": false; "isSignal": true; }; "page": { "alias": "page"; "required": false; "isSignal": true; }; }, { "page": "pageChange"; }, never, never, true, never>;
 }
 
 /** A leaf entry under a {@link StrctMenuSection}. */
@@ -976,6 +1128,113 @@ declare class StrctSectionMenu {
     static ɵcmp: _angular_core.ɵɵComponentDeclaration<StrctSectionMenu, "strct-section-menu", never, { "sections": { "alias": "sections"; "required": true; "isSignal": true; }; "activeId": { "alias": "activeId"; "required": false; "isSignal": true; }; "collapsible": { "alias": "collapsible"; "required": false; "isSignal": true; }; "showIcons": { "alias": "showIcons"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; }, { "activeId": "activeIdChange"; "select": "select"; }, never, never, true, never>;
 }
 
+/** One searchable command in the palette. */
+interface StrctCommandItem {
+    /** Stable key; returned with (picked). */
+    id: string;
+    label: string;
+    /** Right-aligned group tag (e.g. a category or section name). */
+    group?: string;
+    /** Leading icon name (StrctIcon set). */
+    icon?: string;
+    /** Right-aligned shortcut hint, rendered as a key chip. */
+    hint?: string;
+    /** Extra search terms beyond label/group. */
+    keywords?: string[];
+    /** Arbitrary payload carried back with (picked). */
+    data?: unknown;
+}
+/**
+ * ⌘/Ctrl-K command palette — a spotlight search over app commands or pages.
+ * Mount once near the app root, feed it `items`, and act on `(picked)`:
+ *
+ *   <strct-command-palette [items]="commands" [(open)]="paletteOpen"
+ *                          (picked)="run($event)" />
+ *
+ * Opens via the two-way `open` model or the built-in ⌘/Ctrl-K hotkey
+ * (`hotkey` input). Implements the ARIA combobox/listbox pattern: arrow keys
+ * move the active option, Enter picks, Escape closes; focus returns to the
+ * previously focused element on close.
+ */
+declare class StrctCommandPalette {
+    private readonly doc;
+    private readonly inputRef;
+    /** Searchable commands. */
+    readonly items: _angular_core.InputSignal<StrctCommandItem[]>;
+    /** Whether the palette is open (two-way). */
+    readonly open: _angular_core.ModelSignal<boolean>;
+    /** Enable the built-in ⌘/Ctrl-K toggle. */
+    readonly hotkey: _angular_core.InputSignalWithTransform<boolean, unknown>;
+    /** Search input placeholder / dialog name (localizable). */
+    readonly placeholder: _angular_core.InputSignal<string>;
+    /** Empty-result message prefix (localizable). */
+    readonly emptyText: _angular_core.InputSignal<string>;
+    /** Maximum rendered results. */
+    readonly maxResults: _angular_core.InputSignal<number>;
+    /** Emitted when a command is chosen (Enter or click); the palette closes. */
+    readonly picked: _angular_core.OutputEmitterRef<StrctCommandItem>;
+    protected readonly query: _angular_core.WritableSignal<string>;
+    protected readonly activeIndex: _angular_core.WritableSignal<number>;
+    protected readonly listId: string;
+    private previousActive;
+    protected optionId(i: number): string;
+    /** Rank: label prefix > word-start > substring; group/keyword matches last. */
+    protected readonly filtered: _angular_core.Signal<StrctCommandItem[]>;
+    constructor();
+    /** ⌘/Ctrl-K toggle + global Escape while open. */
+    protected onGlobalKey(event: KeyboardEvent): void;
+    protected onType(event: Event): void;
+    protected onKey(event: KeyboardEvent): void;
+    private move;
+    protected pick(item: StrctCommandItem): void;
+    protected close(): void;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<StrctCommandPalette, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<StrctCommandPalette, "strct-command-palette", never, { "items": { "alias": "items"; "required": false; "isSignal": true; }; "open": { "alias": "open"; "required": false; "isSignal": true; }; "hotkey": { "alias": "hotkey"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "emptyText": { "alias": "emptyText"; "required": false; "isSignal": true; }; "maxResults": { "alias": "maxResults"; "required": false; "isSignal": true; }; }, { "open": "openChange"; "picked": "picked"; }, never, never, true, never>;
+}
+
+/**
+ * Inline keyboard-key chip: `<strct-kbd>⌘K</strct-kbd>`. Used for shortcut hints
+ * in menus, tooltips and the command palette.
+ */
+declare class StrctKbd {
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<StrctKbd, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<StrctKbd, "strct-kbd", never, {}, {}, never, ["*"], true, never>;
+}
+
+/** Lifecycle of an async (or deferred) validation check. */
+type StrctValidationStatus = 'idle' | 'checking' | 'ok' | 'warning' | 'error';
+/**
+ * A first-class "validating… → ok / warning / error (reason)" model, so apps stop
+ * composing a spinner + badge by hand (e.g. live reachability checks while typing).
+ * Consumed by `StrctField`'s `validationState` input and the `[strctCellStatus]`
+ * datagrid-cell helper.
+ */
+interface StrctValidationState {
+    status: StrctValidationStatus;
+    /** Optional human-readable reason, shown beside the affordance / in the hint slot. */
+    message?: string;
+}
+/** Tone class suffix per validation status (used by field + cell helper styles). */
+declare function strctValidationTone(status: StrctValidationStatus): string;
+/** Leading icon name per (non-checking) validation status; '' for idle/checking. */
+declare function strctValidationIcon(status: StrctValidationStatus): string;
+/**
+ * Renders the shared "checking / ok / warning / error (reason)" affordance from a
+ * small `StrctValidationState` model — a spinner while checking, then an icon and
+ * an optional message. Drop it into a `StrctDatagrid` cell template for
+ * list-building flows, as an element or an attribute:
+ *
+ *   <strct-cell-status [state]="probe(row)" />
+ *   <span strct-cell-status [state]="probe(row)"></span>
+ */
+declare class StrctCellStatus {
+    /** The validation state to render. */
+    readonly state: _angular_core.InputSignal<StrctValidationState>;
+    protected readonly icon: _angular_core.Signal<string>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<StrctCellStatus, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<StrctCellStatus, "strct-cell-status, [strct-cell-status]", never, { "state": { "alias": "state"; "required": true; "isSignal": true; }; }, {}, never, never, true, never>;
+}
+
 /**
  * Form-field wrapper: a label (with optional required marker), the projected
  * control, and a hint or error message. It auto-links the control via
@@ -994,18 +1253,33 @@ declare class StrctField {
     readonly hint: _angular_core.InputSignal<string>;
     /** Error message (string or first-of array); falsy clears the error state. */
     readonly error: _angular_core.InputSignal<string | string[] | null | undefined>;
+    /**
+     * Async-validation state rendered as a trailing adornment (spinner / check /
+     * warning) plus its message in the hint/error slot — so apps stop composing a
+     * spinner + badge by hand for live "checking… → ok / warning / error" checks.
+     */
+    readonly validationState: _angular_core.InputSignal<StrctValidationState | null>;
     private readonly host;
     private readonly n;
     protected readonly hintId: string;
     protected readonly errorId: string;
     protected readonly controlId: _angular_core.WritableSignal<string>;
     protected readonly errorText: _angular_core.Signal<string>;
+    /** Effective validation status ('idle' when no state supplied). */
+    protected readonly stateStatus: _angular_core.Signal<_akcelik_strct.StrctValidationStatus>;
+    /** Whether to show the trailing adornment (an explicit error suppresses it). */
+    protected readonly stateActive: _angular_core.Signal<boolean>;
+    protected readonly stateIcon: _angular_core.Signal<string>;
+    /** Validation message, shown only when there is no explicit error. */
+    protected readonly stateMessage: _angular_core.Signal<string>;
+    /** Invalid when an explicit error is set or the validation state is 'error'. */
+    protected readonly isInvalid: _angular_core.Signal<boolean>;
     constructor();
     private control;
     private link;
     private applyAria;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<StrctField, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<StrctField, "strct-field", never, { "label": { "alias": "label"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "hint": { "alias": "hint"; "required": false; "isSignal": true; }; "error": { "alias": "error"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<StrctField, "strct-field", never, { "label": { "alias": "label"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "hint": { "alias": "hint"; "required": false; "isSignal": true; }; "error": { "alias": "error"; "required": false; "isSignal": true; }; "validationState": { "alias": "validationState"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
 }
 
 /**
@@ -1092,6 +1366,56 @@ declare class StrctRadio {
     static ɵcmp: _angular_core.ɵɵComponentDeclaration<StrctRadio, "strct-radio", never, { "value": { "alias": "value"; "required": true; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
 }
 
+/** One segment of a `StrctSegmented`. */
+interface StrctSegmentedOption {
+    value: unknown;
+    label: string;
+    /** Optional leading icon name (StrctIcon set). */
+    icon?: string;
+    /** Disable just this segment. */
+    disabled?: boolean;
+}
+/** Segment size. */
+type StrctSegmentedSize = 'sm' | 'md';
+/**
+ * One-of-N selection rendered as a joined segmented control with managed
+ * selected state — distinct from `StrctTabs` (panel switching) and
+ * `StrctButtonGroup` (a visual cluster only). For mode pickers and list filters.
+ * CVA-compatible, so `formControlName` and `[(ngModel)]` both work.
+ *
+ *   <strct-segmented
+ *     [options]="[{ value: 'all', label: 'All' }, { value: 'active', label: 'Active' }]"
+ *     [(ngModel)]="filter" size="sm" />
+ */
+declare class StrctSegmented implements ControlValueAccessor {
+    /** The selectable segments. */
+    readonly options: _angular_core.InputSignal<StrctSegmentedOption[]>;
+    /** Segment size. */
+    readonly size: _angular_core.InputSignal<StrctSegmentedSize>;
+    /** Stretch to the full width of the container. */
+    readonly block: _angular_core.InputSignalWithTransform<boolean, unknown>;
+    /** Static disable; forms' setDisabledState also drives the disabled state. */
+    readonly disabled: _angular_core.InputSignalWithTransform<boolean, unknown>;
+    readonly value: _angular_core.WritableSignal<unknown>;
+    readonly isDisabled: _angular_core.WritableSignal<boolean>;
+    private readonly segs;
+    private onChange;
+    protected onTouched: () => void;
+    constructor();
+    protected isSelected(opt: StrctSegmentedOption): boolean;
+    /** Index of the currently selected (or first enabled) option for roving focus. */
+    private readonly activeIndex;
+    protected rovingIndex(opt: StrctSegmentedOption, i: number): number;
+    protected select(opt: StrctSegmentedOption): void;
+    protected onKeydown(event: KeyboardEvent): void;
+    writeValue(value: unknown): void;
+    registerOnChange(fn: (value: unknown) => void): void;
+    registerOnTouched(fn: () => void): void;
+    setDisabledState(isDisabled: boolean): void;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<StrctSegmented, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<StrctSegmented, "strct-segmented", never, { "options": { "alias": "options"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "block": { "alias": "block"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+}
+
 /**
  * Slider built on a native range input — fully accessible, CVA-compatible.
  *   <strct-range [min]="0" [max]="100" [(ngModel)]="volume" showValue />
@@ -1530,6 +1854,57 @@ declare class StrctCascadeSelect extends StrctCascadeHost implements ControlValu
     static ɵcmp: _angular_core.ɵɵComponentDeclaration<StrctCascadeSelect, "strct-cascade-select", never, { "options": { "alias": "options"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
 }
 
+/** One row in a `StrctDescriptionList` when driven by the `items` input. */
+interface StrctDescItem {
+    label: string;
+    value?: string | number;
+    /** Render the value in the monospace face. */
+    mono?: boolean;
+    /** Dim the value (secondary information). */
+    muted?: boolean;
+}
+/** Value alignment for the stacked (non-inline) layout. */
+type StrctDescAlign = 'between' | 'start';
+/**
+ * Compact definition list: aligned `label : value` rows with an optional trailing
+ * slot. The `inline` variant is the horizontal "stat strip" (label-value pairs in
+ * a row). Replaces the hand-rolled `<dl>` + flex.
+ *
+ * Drive it with the `items` input, or project `<strct-desc>` rows so a value can
+ * host a badge, icon or any rich content:
+ *
+ *   <strct-description-list>
+ *     <strct-desc label="IPv4" mono>172.16.75.100/24</strct-desc>
+ *     <strct-desc label="IPv6"><strct-badge status="success">Enabled</strct-badge></strct-desc>
+ *   </strct-description-list>
+ *
+ *   <strct-description-list [items]="[{ label: 'Gateway', value: '172.16.75.2', mono: true }]" />
+ */
+declare class StrctDescriptionList {
+    /** Rows, as an alternative to projecting `<strct-desc>` children. */
+    readonly items: _angular_core.InputSignal<StrctDescItem[]>;
+    /** Horizontal stat-strip layout instead of stacked rows. */
+    readonly inline: _angular_core.InputSignalWithTransform<boolean, unknown>;
+    /** Value alignment in stacked mode. */
+    readonly align: _angular_core.InputSignal<StrctDescAlign>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<StrctDescriptionList, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<StrctDescriptionList, "strct-description-list", never, { "items": { "alias": "items"; "required": false; "isSignal": true; }; "inline": { "alias": "inline"; "required": false; "isSignal": true; }; "align": { "alias": "align"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
+}
+/**
+ * One projected `label → value` row inside a `<strct-description-list>`. The
+ * value is whatever you project, so it can host a badge, icon or formatted text.
+ */
+declare class StrctDesc {
+    /** The row's label. */
+    readonly label: _angular_core.InputSignal<string>;
+    /** Render the projected value in the monospace face. */
+    readonly mono: _angular_core.InputSignalWithTransform<boolean, unknown>;
+    /** Dim the projected value. */
+    readonly muted: _angular_core.InputSignalWithTransform<boolean, unknown>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<StrctDesc, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<StrctDesc, "strct-desc", never, { "label": { "alias": "label"; "required": true; "isSignal": true; }; "mono": { "alias": "mono"; "required": false; "isSignal": true; }; "muted": { "alias": "muted"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
+}
+
 /** Column definition for the table. */
 interface StrctColumn {
     key: string;
@@ -1588,6 +1963,21 @@ declare class StrctTable {
     static ɵcmp: _angular_core.ɵɵComponentDeclaration<StrctTable, "strct-table", never, { "columns": { "alias": "columns"; "required": true; "isSignal": true; }; "rows": { "alias": "rows"; "required": true; "isSignal": true; }; "striped": { "alias": "striped"; "required": false; "isSignal": true; }; "hover": { "alias": "hover"; "required": false; "isSignal": true; }; "emptyText": { "alias": "emptyText"; "required": false; "isSignal": true; }; "loading": { "alias": "loading"; "required": false; "isSignal": true; }; }, {}, ["cellDefs"], never, true, never>;
 }
 
+/** Every user-visible / assistive string in the grid, overridable for i18n. */
+interface StrctDatagridLabels {
+    row: string;
+    rows: string;
+    selected: string;
+    selectAll: string;
+    selectRow: string;
+    openDetail: string;
+    toggleDetail: string;
+    closeDetail: string;
+    rowActions: string;
+    chooseColumns: string;
+    refresh: string;
+    actions: string;
+}
 /** Resolves a stable identity for a row: a property key, or a function. */
 type StrctRowId = string | ((row: StrctRow) => unknown);
 /** Column definition for the datagrid. */
@@ -1663,6 +2053,30 @@ declare class StrctDatagrid {
      *   [rowActions]="(row) => [{ label: 'Open', action: () => open(row) }, …]"
      */
     readonly rowActions: _angular_core.InputSignal<((row: StrctRow) => StrctMenuItem[]) | null>;
+    /**
+     * Seed the row selection. Each value is a row id (matching {@link rowId}); the
+     * grid checks those rows when this input is set or changes. Requires
+     * `selectable`. Assigning a new array (e.g. when opening a dialog) re-seeds the
+     * selection; the user's subsequent toggles are preserved until the next change.
+     */
+    readonly initialSelection: _angular_core.InputSignal<readonly unknown[] | null>;
+    /** Override any user-visible / assistive string (partial; merged over defaults). */
+    readonly labels: _angular_core.InputSignal<Partial<StrctDatagridLabels>>;
+    /** Effective labels (defaults + overrides). */
+    protected readonly L: _angular_core.Signal<{
+        row: string;
+        rows: string;
+        selected: string;
+        selectAll: string;
+        selectRow: string;
+        openDetail: string;
+        toggleDetail: string;
+        closeDetail: string;
+        rowActions: string;
+        chooseColumns: string;
+        refresh: string;
+        actions: string;
+    }>;
     /** Emitted when the selection changes. */
     readonly selectionChange: _angular_core.OutputEmitterRef<StrctRow[]>;
     /** Emitted when the refresh button is clicked. */
@@ -1734,7 +2148,7 @@ declare class StrctDatagrid {
     private commitSelection;
     private compare;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<StrctDatagrid, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<StrctDatagrid, "strct-datagrid", never, { "columns": { "alias": "columns"; "required": true; "isSignal": true; }; "rows": { "alias": "rows"; "required": true; "isSignal": true; }; "pageSize": { "alias": "pageSize"; "required": false; "isSignal": true; }; "selectable": { "alias": "selectable"; "required": false; "isSignal": true; }; "expandable": { "alias": "expandable"; "required": false; "isSignal": true; }; "detailPane": { "alias": "detailPane"; "required": false; "isSignal": true; }; "compact": { "alias": "compact"; "required": false; "isSignal": true; }; "emptyText": { "alias": "emptyText"; "required": false; "isSignal": true; }; "loading": { "alias": "loading"; "required": false; "isSignal": true; }; "resizable": { "alias": "resizable"; "required": false; "isSignal": true; }; "columnChooser": { "alias": "columnChooser"; "required": false; "isSignal": true; }; "sync": { "alias": "sync"; "required": false; "isSignal": true; }; "footerActionsDisabled": { "alias": "footerActionsDisabled"; "required": false; "isSignal": true; }; "rowId": { "alias": "rowId"; "required": false; "isSignal": true; }; "rowActions": { "alias": "rowActions"; "required": false; "isSignal": true; }; }, { "selectionChange": "selectionChange"; "syncChange": "syncChange"; "rowAction": "rowAction"; }, ["detailDef", "actionBarDef", "cellDefs"], ["[strctDatagridActionBar]"], true, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<StrctDatagrid, "strct-datagrid", never, { "columns": { "alias": "columns"; "required": true; "isSignal": true; }; "rows": { "alias": "rows"; "required": true; "isSignal": true; }; "pageSize": { "alias": "pageSize"; "required": false; "isSignal": true; }; "selectable": { "alias": "selectable"; "required": false; "isSignal": true; }; "expandable": { "alias": "expandable"; "required": false; "isSignal": true; }; "detailPane": { "alias": "detailPane"; "required": false; "isSignal": true; }; "compact": { "alias": "compact"; "required": false; "isSignal": true; }; "emptyText": { "alias": "emptyText"; "required": false; "isSignal": true; }; "loading": { "alias": "loading"; "required": false; "isSignal": true; }; "resizable": { "alias": "resizable"; "required": false; "isSignal": true; }; "columnChooser": { "alias": "columnChooser"; "required": false; "isSignal": true; }; "sync": { "alias": "sync"; "required": false; "isSignal": true; }; "footerActionsDisabled": { "alias": "footerActionsDisabled"; "required": false; "isSignal": true; }; "rowId": { "alias": "rowId"; "required": false; "isSignal": true; }; "rowActions": { "alias": "rowActions"; "required": false; "isSignal": true; }; "initialSelection": { "alias": "initialSelection"; "required": false; "isSignal": true; }; "labels": { "alias": "labels"; "required": false; "isSignal": true; }; }, { "selectionChange": "selectionChange"; "syncChange": "syncChange"; "rowAction": "rowAction"; }, ["detailDef", "actionBarDef", "cellDefs"], ["[strctDatagridActionBar]"], true, never>;
 }
 
 /** Timeline node state colors. */
@@ -1793,24 +2207,125 @@ declare class StrctSparkline {
 
 /** Chart rendering types (line, area, bar). */
 type StrctChartType = 'line' | 'area' | 'bar';
+/** Line interpolation between points. */
+type StrctChartCurve = 'smooth' | 'linear' | 'step';
+/** One series in a multi-series chart. */
+interface StrctChartSeries {
+    data: number[];
+    /** Legend + tooltip name. */
+    label?: string;
+    /** Per-series color; falls back to the chart's `status`. */
+    status?: StrctChartStatus;
+    /** Per-series area fill. */
+    area?: boolean;
+    /** Per-series interpolation; falls back to the chart's `curve`. */
+    curve?: StrctChartCurve;
+    /**
+     * Dashed line — a second visual channel besides color, so two series stay
+     * distinguishable under color-vision deficiency. `true` uses `'5 4'`; pass a
+     * custom SVG dasharray string to tune it.
+     */
+    dash?: boolean | string;
+}
+/** A horizontal reference / threshold line. */
+interface StrctChartThreshold {
+    value: number;
+    label?: string;
+    /** Line color; default 'warning'. */
+    status?: StrctChartStatus;
+    /** Dashed line; default true. */
+    dashed?: boolean;
+}
+interface Pt {
+    x: number;
+    y: number;
+}
+interface SeriesRender {
+    color: string;
+    label: string;
+    area: boolean;
+    dash: string | null;
+    pts: Pt[];
+    path: string;
+    areaPath: string;
+    /** Global x-offset (right-aligned) so shorter series line up on the right. */
+    offset: number;
+    data: number[];
+}
 /**
- * Single-series chart (line / area / bar). Dependency-free SVG, token-coloured.
- *   <strct-chart [data]="cpu" type="area" [labels]="hours" status="warning" />
+ * Single- or multi-series chart (line / area / bar). Dependency-free SVG,
+ * token-coloured.
+ *
+ * Lines are smooth by default (monotone cubic, no overshoot); set `curve` to
+ * `linear` or `step`. Toggle the gradient fill with `area`, the ambient glow with
+ * `glow`, and turn on `live` for streaming metrics. Pass `series` for multiple
+ * lines with a `legend`; add persistent scale labels with `yAxis`, reference lines
+ * with `thresholds`, a floor with `min`, and thin x labels with `xTicks`. Hover
+ * anywhere for a crosshair + tooltip. The SVG is measured (1:1 coordinates) so
+ * dots and the glow stay crisp at any width. Reduced-motion safe.
+ *
+ *   <strct-chart [data]="cpu" area glow [labels]="hours" status="warning" />
+ *   <strct-chart [series]="[{data:inArr,label:'In'},{data:outArr,label:'Out'}]" legend />
  */
 declare class StrctChart {
-    /** Data array. */
+    /** Single-series data (or use `series`). */
     readonly data: _angular_core.InputSignal<number[]>;
+    /** Multiple series; when set it takes precedence over `data`. */
+    readonly series: _angular_core.InputSignal<StrctChartSeries[] | null>;
     /** Visual type / variant. */
     readonly type: _angular_core.InputSignal<StrctChartType>;
+    /** Line interpolation. */
+    readonly curve: _angular_core.InputSignal<StrctChartCurve>;
+    /** Fill the area under the line with a soft gradient. */
+    readonly area: _angular_core.InputSignalWithTransform<boolean, unknown>;
+    /** Soft ambient glow on the line and the leading-edge dot. */
+    readonly glow: _angular_core.InputSignalWithTransform<boolean, unknown>;
+    /** Live streaming: the window scrolls left as new points arrive. */
+    readonly live: _angular_core.InputSignalWithTransform<boolean, unknown>;
+    /** Expected ms between updates in live mode (drives the scroll duration). */
+    readonly interval: _angular_core.InputSignal<number>;
+    /** Hover crosshair + value tooltip. */
+    readonly interactive: _angular_core.InputSignalWithTransform<boolean, unknown>;
+    /** Line thickness in pixels. */
+    readonly strokeWidth: _angular_core.InputSignal<number>;
+    /** Show the horizontal gridlines. */
+    readonly grid: _angular_core.InputSignalWithTransform<boolean, unknown>;
+    /** Show a dot at each data point (single-series). */
+    readonly dots: _angular_core.InputSignalWithTransform<boolean, unknown>;
+    /** Show a legend (with `series`). */
+    readonly legend: _angular_core.InputSignalWithTransform<boolean, unknown>;
     /** X-axis labels. */
     readonly labels: _angular_core.InputSignal<string[]>;
+    /** Target number of x labels; null renders every label. */
+    readonly xTicks: _angular_core.InputSignal<number | null>;
+    /** Formatter for x labels. */
+    readonly xFormat: _angular_core.InputSignal<((label: string, index: number) => string) | null>;
     /** Visual status color. */
     readonly status: _angular_core.InputSignal<StrctChartStatus>;
     /** Height in pixels. */
     readonly height: _angular_core.InputSignal<number>;
     /** Override the top of the value axis (defaults to the data max + headroom). */
     readonly max: _angular_core.InputSignal<number | null>;
-    protected readonly vbW = 320;
+    /** Override the floor of the value axis (defaults to 0). */
+    readonly min: _angular_core.InputSignal<number | null>;
+    /** Persistent y-axis scale labels. */
+    readonly yAxis: _angular_core.InputSignalWithTransform<boolean, unknown>;
+    /** Approx number of y ticks. */
+    readonly yTicks: _angular_core.InputSignal<number>;
+    /** Formatter for y-axis labels; falls back to `valueFormat`. */
+    readonly axisFormat: _angular_core.InputSignal<((v: number) => string) | null>;
+    /** Horizontal reference / threshold lines. */
+    readonly thresholds: _angular_core.InputSignal<StrctChartThreshold[]>;
+    /** Text shown when there is no data. */
+    readonly emptyText: _angular_core.InputSignal<string>;
+    /** Formatter for the live-mode "Xs ago" tooltip line (receives seconds). */
+    readonly agoFormat: _angular_core.InputSignal<((seconds: number) => string) | null>;
+    /**
+     * Optional formatter for the values shown in the hover tooltip + y-axis flag
+     * (and the delta magnitude). Lets callers add units / fixed precision, e.g.
+     * `[valueFormat]="v => v.toFixed(3) + ' %'"`. When null, the raw value is shown.
+     */
+    readonly valueFormat: _angular_core.InputSignal<((v: number) => string) | null>;
     protected readonly pad: {
         l: number;
         r: number;
@@ -1818,14 +2333,48 @@ declare class StrctChart {
         b: number;
     };
     protected readonly color: _angular_core.Signal<string>;
-    private readonly maxValue;
+    protected readonly showArea: _angular_core.Signal<boolean>;
+    private readonly uid;
+    protected readonly gradId: string;
+    protected readonly clipId: string;
+    /** Measured pixel width → 1:1 viewBox so dots / glow stay crisp at any size. */
+    protected readonly width: _angular_core.WritableSignal<number>;
+    private readonly svgRef;
+    protected readonly slidePx: _angular_core.WritableSignal<number>;
+    protected readonly sliding: _angular_core.WritableSignal<boolean>;
+    protected readonly drawOn: _angular_core.WritableSignal<boolean>;
+    private firstData;
+    /** Reactive OS motion preference (tracks live changes, not just first load). */
+    private readonly reduceMotion;
+    protected readonly hoverIdx: _angular_core.WritableSignal<number | null>;
+    constructor();
+    private readonly seriesResolved;
+    protected readonly isMulti: _angular_core.Signal<boolean>;
+    /** All data arrays (multi or single). */
+    private readonly allData;
+    protected readonly isEmpty: _angular_core.Signal<boolean>;
+    /** Number of x slots. */
+    private readonly nx;
+    /** Left padding: wider when the y-axis labels are shown. */
+    protected readonly pl: _angular_core.Signal<number>;
+    private chartW;
     private chartH;
-    protected readonly points: _angular_core.Signal<{
-        x: number;
-        y: number;
+    /** Horizontal gap between two data points, in px. */
+    private stepX;
+    private readonly yMax;
+    private readonly yMin;
+    private yOf;
+    protected readonly points: _angular_core.Signal<Pt[]>;
+    protected readonly head: _angular_core.Signal<Pt | null>;
+    private readonly plotPoints;
+    protected readonly linePath: _angular_core.Signal<string>;
+    protected readonly areaPath: _angular_core.Signal<string>;
+    protected readonly multiSeries: _angular_core.Signal<SeriesRender[]>;
+    protected readonly legendItems: _angular_core.Signal<{
+        label: string;
+        color: string;
+        dash: string | null;
     }[]>;
-    protected readonly linePoints: _angular_core.Signal<string>;
-    protected readonly areaPoints: _angular_core.Signal<string>;
     protected readonly bars: _angular_core.Signal<{
         x: number;
         y: number;
@@ -1833,8 +2382,59 @@ declare class StrctChart {
         h: number;
     }[]>;
     protected readonly gridY: _angular_core.Signal<number[]>;
+    private fmtAxis;
+    protected readonly yAxisTicks: _angular_core.Signal<{
+        value: number;
+        y: number;
+        text: string;
+    }[]>;
+    protected readonly thresholdLines: _angular_core.Signal<{
+        y: number;
+        color: string;
+        dashed: boolean;
+        label: string;
+    }[]>;
+    protected readonly displayLabels: _angular_core.Signal<{
+        text: string;
+        i: number;
+    }[]>;
+    protected readonly hoverX: _angular_core.Signal<number | null>;
+    protected readonly hoverPt: _angular_core.Signal<Pt | null>;
+    protected readonly hoverValue: _angular_core.Signal<number | "">;
+    /** hoverValue run through valueFormat (unit / precision), else the raw value. */
+    protected readonly hoverValueText: _angular_core.Signal<string>;
+    /** Delta magnitude, formatted the same way so its unit matches the value. */
+    protected readonly absDeltaText: _angular_core.Signal<string>;
+    protected readonly hoverLabel: _angular_core.Signal<string>;
+    /** Change from the previous point (single-series; null at the first point). */
+    protected readonly hoverDelta: _angular_core.Signal<number | null>;
+    protected readonly absDelta: _angular_core.Signal<number>;
+    /** Second tooltip line: "Xs ago" while live, else the x label. */
+    protected readonly hoverMeta: _angular_core.Signal<string>;
+    /** Per-series value at the hovered index (multi-series tooltip). */
+    protected readonly hoverRows: _angular_core.Signal<{
+        label: string;
+        color: string;
+        value: number | null;
+        text: string;
+    }[]>;
+    /** Per-series hover dots (multi-series). */
+    protected readonly hoverDots: _angular_core.Signal<{
+        x: number;
+        y: number;
+        color: string;
+    }[]>;
+    /** Screen-reader summary of the whole chart (role="img" name). */
+    protected readonly chartAria: _angular_core.Signal<string>;
+    /** aria-live text announcing the hovered / keyboard-selected point. */
+    protected readonly srText: _angular_core.Signal<string>;
+    /** Pixel x of a data index (shared by the plot and the x-axis labels). */
+    protected xOf(i: number): number;
+    /** Keyboard access to the crosshair: arrows walk the points. */
+    protected onKey(event: KeyboardEvent): void;
+    protected onMove(event: PointerEvent): void;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<StrctChart, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<StrctChart, "strct-chart", never, { "data": { "alias": "data"; "required": true; "isSignal": true; }; "type": { "alias": "type"; "required": false; "isSignal": true; }; "labels": { "alias": "labels"; "required": false; "isSignal": true; }; "status": { "alias": "status"; "required": false; "isSignal": true; }; "height": { "alias": "height"; "required": false; "isSignal": true; }; "max": { "alias": "max"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<StrctChart, "strct-chart", never, { "data": { "alias": "data"; "required": false; "isSignal": true; }; "series": { "alias": "series"; "required": false; "isSignal": true; }; "type": { "alias": "type"; "required": false; "isSignal": true; }; "curve": { "alias": "curve"; "required": false; "isSignal": true; }; "area": { "alias": "area"; "required": false; "isSignal": true; }; "glow": { "alias": "glow"; "required": false; "isSignal": true; }; "live": { "alias": "live"; "required": false; "isSignal": true; }; "interval": { "alias": "interval"; "required": false; "isSignal": true; }; "interactive": { "alias": "interactive"; "required": false; "isSignal": true; }; "strokeWidth": { "alias": "strokeWidth"; "required": false; "isSignal": true; }; "grid": { "alias": "grid"; "required": false; "isSignal": true; }; "dots": { "alias": "dots"; "required": false; "isSignal": true; }; "legend": { "alias": "legend"; "required": false; "isSignal": true; }; "labels": { "alias": "labels"; "required": false; "isSignal": true; }; "xTicks": { "alias": "xTicks"; "required": false; "isSignal": true; }; "xFormat": { "alias": "xFormat"; "required": false; "isSignal": true; }; "status": { "alias": "status"; "required": false; "isSignal": true; }; "height": { "alias": "height"; "required": false; "isSignal": true; }; "max": { "alias": "max"; "required": false; "isSignal": true; }; "min": { "alias": "min"; "required": false; "isSignal": true; }; "yAxis": { "alias": "yAxis"; "required": false; "isSignal": true; }; "yTicks": { "alias": "yTicks"; "required": false; "isSignal": true; }; "axisFormat": { "alias": "axisFormat"; "required": false; "isSignal": true; }; "thresholds": { "alias": "thresholds"; "required": false; "isSignal": true; }; "emptyText": { "alias": "emptyText"; "required": false; "isSignal": true; }; "agoFormat": { "alias": "agoFormat"; "required": false; "isSignal": true; }; "valueFormat": { "alias": "valueFormat"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
 }
 
 /** A single weighted slice of a donut chart. */
@@ -1844,9 +2444,13 @@ interface StrctDonutSegment {
     color?: string;
 }
 /**
- * Donut / ring chart from weighted segments.
- *   <strct-donut [segments]="[{value:6,label:'Running'},{value:2,label:'Off'}]"
- *                centerValue="8" centerLabel="VMs" />
+ * Donut / ring chart from weighted segments. Rounded, gapped slices with a
+ * sweep-in animation; hover a slice (or its legend row) to highlight it and read
+ * its value + share in the center. Dependency-free SVG, token-coloured.
+ *
+ *   <strct-donut
+ *     [segments]="[{ value: 36, label: 'Running' }, { value: 8, label: 'Stopped' }]"
+ *     centerValue="44" centerLabel="VMs" legend />
  */
 declare class StrctDonut {
     /** Weighted segments. */
@@ -1855,20 +2459,38 @@ declare class StrctDonut {
     readonly size: _angular_core.InputSignal<number>;
     /** Stroke thickness in pixels. */
     readonly thickness: _angular_core.InputSignal<number>;
-    /** Value shown in the donut center. */
+    /** Value shown in the donut center (when no slice is hovered). */
     readonly centerValue: _angular_core.InputSignal<string | number>;
-    /** Label shown in the donut center. */
+    /** Label shown in the donut center (when no slice is hovered). */
     readonly centerLabel: _angular_core.InputSignal<string>;
+    /** Show a legend (color · label · value · %) beside the ring. */
+    readonly legend: _angular_core.InputSignalWithTransform<boolean, unknown>;
+    /** Gap between slices, in degrees. */
+    readonly gap: _angular_core.InputSignal<number>;
+    /** Hover highlight + center readout. */
+    readonly interactive: _angular_core.InputSignalWithTransform<boolean, unknown>;
+    protected readonly hovered: _angular_core.WritableSignal<number | null>;
     protected readonly half: _angular_core.Signal<number>;
     protected readonly radius: _angular_core.Signal<number>;
     protected readonly circumference: _angular_core.Signal<number>;
+    private readonly total;
     protected readonly arcs: _angular_core.Signal<{
         color: string;
-        len: number;
+        label: string;
+        value: number;
+        pct: number;
+        dash: string;
         offset: number;
     }[]>;
+    protected readonly centerMain: _angular_core.Signal<string | number>;
+    protected readonly centerSub: _angular_core.Signal<string>;
+    protected readonly centerColor: _angular_core.Signal<string>;
+    /** Screen-reader summary (role="img" name): every slice with value + share. */
+    protected readonly ariaSummary: _angular_core.Signal<string>;
+    protected enter(i: number): void;
+    protected leave(): void;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<StrctDonut, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<StrctDonut, "strct-donut", never, { "segments": { "alias": "segments"; "required": true; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "thickness": { "alias": "thickness"; "required": false; "isSignal": true; }; "centerValue": { "alias": "centerValue"; "required": false; "isSignal": true; }; "centerLabel": { "alias": "centerLabel"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<StrctDonut, "strct-donut", never, { "segments": { "alias": "segments"; "required": true; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "thickness": { "alias": "thickness"; "required": false; "isSignal": true; }; "centerValue": { "alias": "centerValue"; "required": false; "isSignal": true; }; "centerLabel": { "alias": "centerLabel"; "required": false; "isSignal": true; }; "legend": { "alias": "legend"; "required": false; "isSignal": true; }; "gap": { "alias": "gap"; "required": false; "isSignal": true; }; "interactive": { "alias": "interactive"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
 }
 
 /**
@@ -1880,6 +2502,13 @@ declare class StrctGauge {
     readonly value: _angular_core.InputSignal<number>;
     /** Visual status color. */
     readonly status: _angular_core.InputSignal<StrctChartStatus>;
+    /**
+     * Optional value-driven thresholds. When set, the gauge picks its own status
+     * from the value: `value >= critical` → critical, `>= warning` → warning, else
+     * the healthy base (`status`, or `'success'` when `status` is left at its
+     * default `'accent'`).
+     */
+    readonly thresholds: _angular_core.InputSignal<StrctThresholds | null>;
     /** Label text. */
     readonly label: _angular_core.InputSignal<string>;
     /** Size variant. */
@@ -1889,12 +2518,72 @@ declare class StrctGauge {
     protected readonly clamped: _angular_core.Signal<number>;
     protected readonly half: _angular_core.Signal<number>;
     protected readonly radius: _angular_core.Signal<number>;
+    /** Status after applying thresholds (falls back to `status` when none set). */
+    protected readonly resolvedStatus: _angular_core.Signal<StrctChartStatus>;
     protected readonly color: _angular_core.Signal<string>;
     private readonly circumference;
     protected readonly trackDash: _angular_core.Signal<string>;
     protected readonly valueDash: _angular_core.Signal<string>;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<StrctGauge, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<StrctGauge, "strct-gauge", never, { "value": { "alias": "value"; "required": false; "isSignal": true; }; "status": { "alias": "status"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "thickness": { "alias": "thickness"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<StrctGauge, "strct-gauge", never, { "value": { "alias": "value"; "required": false; "isSignal": true; }; "status": { "alias": "status"; "required": false; "isSignal": true; }; "thresholds": { "alias": "thresholds"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "thickness": { "alias": "thickness"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+}
+
+/** One endpoint in a `StrctFlow`. */
+interface StrctFlowNode {
+    /** Stable identity (used as the @for track key). */
+    id: string;
+    /** Primary terminal label. */
+    label: string;
+    /** Optional secondary line under the label. */
+    sublabel?: string;
+    /** Optional role tag (e.g. "ACTIVE", "STANDBY"). */
+    role?: string;
+    /** Optional status dot tone for this terminal. */
+    status?: StrctStatus;
+}
+/** Direction of travel for the animated flow. */
+type StrctFlowDirection = 'forward' | 'reverse' | 'both';
+/** Axis the terminals are laid out along. */
+type StrctFlowOrientation = 'horizontal' | 'vertical';
+/**
+ * Shows a connection between two (or N) endpoints with an optional animated
+ * "flow" — moving dots travelling along the connector — to represent live data
+ * movement (replication, sync, a pipeline).
+ *
+ *   <strct-flow
+ *     [nodes]="[
+ *       { id: 'a', label: 'node01', role: 'ACTIVE', status: 'success' },
+ *       { id: 'b', label: 'node02', role: 'STANDBY', status: 'accent' }
+ *     ]"
+ *     [live]="true" label="live replication · 0 lag" status="success" />
+ *
+ * When `live` is off (or the user prefers reduced motion) the connector is a
+ * static gradient with a direction arrow instead of moving dots.
+ */
+declare class StrctFlow {
+    /** Ordered endpoints. */
+    readonly nodes: _angular_core.InputSignal<StrctFlowNode[]>;
+    /** Animate the flow (packets travel along the connector). */
+    readonly live: _angular_core.InputSignalWithTransform<boolean, unknown>;
+    /** Direction of travel. */
+    readonly direction: _angular_core.InputSignal<StrctFlowDirection>;
+    /** Caption under the connector (e.g. "live replication", "0 lag"). */
+    readonly label: _angular_core.InputSignal<string>;
+    /** Connector + packet color. */
+    readonly status: _angular_core.InputSignal<StrctStatus>;
+    /** Layout axis. */
+    readonly orientation: _angular_core.InputSignal<StrctFlowOrientation>;
+    /** A flow needs at least two terminals to animate. */
+    protected readonly connected: _angular_core.Signal<boolean>;
+    protected readonly animated: _angular_core.Signal<boolean>;
+    /** Whether to show packets / arrow in the given travel direction. */
+    protected showArrow(dir: 'forward' | 'reverse'): boolean;
+    /** Caption text, falling back to a "no connection" hint for a lone terminal. */
+    protected readonly caption: _angular_core.Signal<string>;
+    /** Human-readable summary for assistive tech. */
+    protected readonly ariaLabel: _angular_core.Signal<string>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<StrctFlow, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<StrctFlow, "strct-flow", never, { "nodes": { "alias": "nodes"; "required": false; "isSignal": true; }; "live": { "alias": "live"; "required": false; "isSignal": true; }; "direction": { "alias": "direction"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "status": { "alias": "status"; "required": false; "isSignal": true; }; "orientation": { "alias": "orientation"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
 }
 
 /** Accent colour for a metric tile. */
@@ -1935,6 +2624,37 @@ declare class StrctMetricTile {
     static ɵcmp: _angular_core.ɵɵComponentDeclaration<StrctMetricTile, "strct-metric-tile", never, { "label": { "alias": "label"; "required": true; "isSignal": true; }; "value": { "alias": "value"; "required": true; "isSignal": true; }; "unit": { "alias": "unit"; "required": false; "isSignal": true; }; "icon": { "alias": "icon"; "required": false; "isSignal": true; }; "status": { "alias": "status"; "required": false; "isSignal": true; }; "delta": { "alias": "delta"; "required": false; "isSignal": true; }; "deltaSuffix": { "alias": "deltaSuffix"; "required": false; "isSignal": true; }; "invertDelta": { "alias": "invertDelta"; "required": false; "isSignal": true; }; "caption": { "alias": "caption"; "required": false; "isSignal": true; }; "data": { "alias": "data"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
 }
 
+/**
+ * Page-level status summary banner: a tone-colored surface with a leading icon
+ * chip, a heading, a description, and optional right-aligned metadata / actions.
+ *
+ * Distinct from `StrctAlert` (a dismissible inline notification) and
+ * `StrctSignpost` (a popover). Use it for the prominent "Protected", "All systems
+ * healthy", "Clock synchronized" summaries apps otherwise hand-roll.
+ *
+ *   <strct-hero status="success" icon="shield" heading="High availability is on">
+ *     The standby node can take over if this one fails.
+ *     <div strctHeroMeta><strct-badge status="success">HA ON</strct-badge></div>
+ *     <div strctHeroActions>
+ *       <button strct-button size="sm">Switch over</button>
+ *     </div>
+ *   </strct-hero>
+ */
+declare class StrctHero {
+    /** Tone: drives the left rail + icon chip color. */
+    readonly status: _angular_core.InputSignal<StrctStatus>;
+    /** Leading icon name (StrctIcon set). Falls back to a per-status default. */
+    readonly icon: _angular_core.InputSignal<string>;
+    /** The headline; exposed as the banner's accessible name. */
+    readonly heading: _angular_core.InputSignal<string>;
+    /** Tighter padding for secondary placements. */
+    readonly dense: _angular_core.InputSignalWithTransform<boolean, unknown>;
+    protected readonly headingId: string;
+    protected readonly resolvedIcon: _angular_core.Signal<string>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<StrctHero, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<StrctHero, "strct-hero", never, { "status": { "alias": "status"; "required": false; "isSignal": true; }; "icon": { "alias": "icon"; "required": false; "isSignal": true; }; "heading": { "alias": "heading"; "required": true; "isSignal": true; }; "dense": { "alias": "dense"; "required": false; "isSignal": true; }; }, {}, never, ["*", "[strctHeroMeta]", "[strctHeroActions]"], true, never>;
+}
+
 /** Alert visual types. */
 type StrctAlertType = 'info' | 'success' | 'warning' | 'critical';
 /** Inline contextual banner. `<strct-alert type="warning">…</strct-alert>`. */
@@ -1943,11 +2663,13 @@ declare class StrctAlert {
     readonly type: _angular_core.InputSignal<StrctAlertType>;
     /** Show a dismiss button. */
     readonly closable: _angular_core.InputSignalWithTransform<boolean, unknown>;
+    /** Accessible label of the dismiss button (localizable). */
+    readonly dismissLabel: _angular_core.InputSignal<string>;
     /** Emitted when the alert is dismissed. */
     readonly closed: _angular_core.OutputEmitterRef<void>;
     protected readonly icon: _angular_core.Signal<"info" | "success" | "warning" | "critical">;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<StrctAlert, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<StrctAlert, "strct-alert", never, { "type": { "alias": "type"; "required": false; "isSignal": true; }; "closable": { "alias": "closable"; "required": false; "isSignal": true; }; }, { "closed": "closed"; }, never, ["*"], true, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<StrctAlert, "strct-alert", never, { "type": { "alias": "type"; "required": false; "isSignal": true; }; "closable": { "alias": "closable"; "required": false; "isSignal": true; }; "dismissLabel": { "alias": "dismissLabel"; "required": false; "isSignal": true; }; }, { "closed": "closed"; }, never, ["*"], true, never>;
 }
 
 /** Tooltip placement relative to the host element. */
@@ -2033,10 +2755,12 @@ declare class StrctToastService {
 }
 /** Renders the toast stack. Place once, typically just inside the app shell. */
 declare class StrctToastOutlet {
+    /** Accessible name of the notifications region (localizable). */
+    readonly regionLabel: _angular_core.InputSignal<string>;
     protected readonly service: StrctToastService;
     protected icon(type: StrctToastType): string;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<StrctToastOutlet, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<StrctToastOutlet, "strct-toast-outlet", never, {}, {}, never, never, true, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<StrctToastOutlet, "strct-toast-outlet", never, { "regionLabel": { "alias": "regionLabel"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
 }
 
 /** Preset zero/permission/error states with a sensible icon + tone. */
@@ -2065,5 +2789,5 @@ declare class StrctEmptyState {
     static ɵcmp: _angular_core.ɵɵComponentDeclaration<StrctEmptyState, "strct-empty-state", never, { "variant": { "alias": "variant"; "required": false; "isSignal": true; }; "icon": { "alias": "icon"; "required": false; "isSignal": true; }; "tone": { "alias": "tone"; "required": false; "isSignal": true; }; "title": { "alias": "title"; "required": true; "isSignal": true; }; "description": { "alias": "description"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
 }
 
-export { STRCT_ICONS, STRCT_ICON_GROUPS, STRCT_MASKS, STRCT_PALETTES, STRCT_RAW_ICONS, StrctAccordion, StrctAccordionPanel, StrctAlert, StrctAvatar, StrctBadge, StrctBreadcrumb, StrctBreadcrumbItem, StrctButton, StrctButtonGroup, StrctCard, StrctCardBlock, StrctCardFooter, StrctCardHeader, StrctCascadeHost, StrctCascadeNode, StrctCascadeSelect, StrctCellDef, StrctChart, StrctCheckbox, StrctChips, StrctColorPicker, StrctCombobox, StrctContextMenu, StrctContextMenuTrigger, StrctDatagrid, StrctDatagridActionBar, StrctDatepicker, StrctDivider, StrctDonut, StrctDrawer, StrctDrawerFooter, StrctDropdown, StrctDropdownDivider, StrctDropdownItem, StrctEmptyState, StrctField, StrctFile, StrctFooter, StrctGauge, StrctHeader, StrctIcon, StrctInput, StrctInputMask, StrctInputOtp, StrctKnob, StrctLogin, StrctMenuPanel, StrctMenuService, StrctMetricTile, StrctModal, StrctNav, StrctNavItem, StrctOverlay, StrctPagination, StrctPassword, StrctProgress, StrctRadio, StrctRadioGroup, StrctRail, StrctRange, StrctRating, StrctRowDetailDef, StrctSectionMenu, StrctShell, StrctShellService, StrctSignpost, StrctSkeleton, StrctSparkline, StrctSpeedDial, StrctSpinner, StrctStack, StrctStackItem, StrctStep, StrctSubmenu, StrctTab, StrctTable, StrctTabs, StrctTag, StrctThemeService, StrctThemeSwitcher, StrctTimeline, StrctTimelineItem, StrctToastOutlet, StrctToastService, StrctToggle, StrctTooltip, StrctTree, StrctTreeNode, StrctVerticalNav, StrctWizard, registerStrctIcon };
-export type { StrctAlertType, StrctAvatarSize, StrctAvatarStatus, StrctBadgeStatus, StrctButtonSize, StrctButtonVariant, StrctCascadeOption, StrctCellContext, StrctChartStatus, StrctChartType, StrctColumn, StrctDatagridColumn, StrctDonutSegment, StrctDrawerSide, StrctDrawerSize, StrctEmptyVariant, StrctIconBadge, StrctKnobStatus, StrctMenuItem, StrctMenuLink, StrctMenuOpenOptions, StrctMenuSection, StrctMetricStatus, StrctModalSize, StrctMode, StrctOption, StrctOverlayPlacement, StrctPalette, StrctPaletteInfo, StrctProgressStatus, StrctRailItem, StrctRailStatus, StrctRow, StrctRowId, StrctSignpostPosition, StrctSpeedDialDirection, StrctSpinnerSize, StrctTagStatus, StrctTimelineState, StrctToast, StrctToastOptions, StrctToastType, StrctTooltipPosition, StrctTreeMenuEvent, StrctTreeNodeData, StrctTreeNodeMenuFn };
+export { STRCT_ICONS, STRCT_ICON_GROUPS, STRCT_MASKS, STRCT_PALETTES, STRCT_RAW_ICONS, StrctAccordion, StrctAccordionPanel, StrctAlert, StrctAvatar, StrctBadge, StrctBreadcrumb, StrctBreadcrumbItem, StrctButton, StrctButtonGroup, StrctCard, StrctCardBlock, StrctCardFooter, StrctCardHeader, StrctCascadeHost, StrctCascadeNode, StrctCascadeSelect, StrctCellDef, StrctCellStatus, StrctChart, StrctCheckbox, StrctChips, StrctColorPicker, StrctCombobox, StrctCommandPalette, StrctContextMenu, StrctContextMenuTrigger, StrctDatagrid, StrctDatagridActionBar, StrctDatepicker, StrctDesc, StrctDescriptionList, StrctDivider, StrctDonut, StrctDrawer, StrctDrawerFooter, StrctDropdown, StrctDropdownDivider, StrctDropdownItem, StrctEmptyState, StrctField, StrctFile, StrctFlow, StrctFooter, StrctGauge, StrctHeader, StrctHero, StrctIcon, StrctInput, StrctInputMask, StrctInputOtp, StrctKbd, StrctKnob, StrctLogin, StrctMenuPanel, StrctMenuService, StrctMetricTile, StrctModal, StrctNav, StrctNavItem, StrctOverlay, StrctPagination, StrctPassword, StrctProgress, StrctRadio, StrctRadioGroup, StrctRail, StrctRange, StrctRating, StrctRowDetailDef, StrctSectionMenu, StrctSegmented, StrctShell, StrctShellService, StrctSignpost, StrctSkeleton, StrctSparkline, StrctSpeedDial, StrctSpinner, StrctStack, StrctStackItem, StrctStep, StrctSubmenu, StrctTab, StrctTable, StrctTabs, StrctTag, StrctThemeService, StrctThemeSwitcher, StrctTimeline, StrctTimelineItem, StrctToastOutlet, StrctToastService, StrctToggle, StrctTooltip, StrctTree, StrctTreeNode, StrctVerticalNav, StrctWizard, registerStrctIcon, strctValidationIcon, strctValidationTone };
+export type { StrctAlertType, StrctAvatarSize, StrctAvatarStatus, StrctBadgeStatus, StrctButtonSize, StrctButtonVariant, StrctCascadeOption, StrctCellContext, StrctChartCurve, StrctChartSeries, StrctChartStatus, StrctChartThreshold, StrctChartType, StrctColumn, StrctCommandItem, StrctDatagridColumn, StrctDatagridLabels, StrctDescAlign, StrctDescItem, StrctDonutSegment, StrctDrawerSide, StrctDrawerSize, StrctEmptyVariant, StrctFlowDirection, StrctFlowNode, StrctFlowOrientation, StrctIconBadge, StrctKnobStatus, StrctMenuItem, StrctMenuLink, StrctMenuOpenOptions, StrctMenuSection, StrctMetricStatus, StrctModalSize, StrctMode, StrctOption, StrctOverlayPlacement, StrctPalette, StrctPaletteInfo, StrctProgressStatus, StrctRailItem, StrctRailStatus, StrctRow, StrctRowId, StrctSegmentedOption, StrctSegmentedSize, StrctSignpostPosition, StrctSpeedDialDirection, StrctSpinnerSize, StrctStatus, StrctTagStatus, StrctThresholds, StrctTimelineState, StrctToast, StrctToastOptions, StrctToastType, StrctTooltipPosition, StrctTreeMenuEvent, StrctTreeNodeData, StrctTreeNodeMenuFn, StrctValidationState, StrctValidationStatus };