@akcelik/strct 0.11.0 → 0.22.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,6 +1,7 @@
1
1
  import * as _angular_core from '@angular/core';
2
2
  import { OnDestroy, TemplateRef } from '@angular/core';
3
3
  import { SafeHtml } from '@angular/platform-browser';
4
+ import * as _akcelik_strct from '@akcelik/strct';
4
5
  import { ControlValueAccessor } from '@angular/forms';
5
6
 
6
7
  /** Available color palettes. */
@@ -54,10 +55,40 @@ declare class StrctThemeSwitcher {
54
55
  static ɵcmp: _angular_core.ɵɵComponentDeclaration<StrctThemeSwitcher, "strct-theme-switcher", never, {}, {}, never, never, true, never>;
55
56
  }
56
57
 
58
+ /**
59
+ * Shared status / tone union used across the library's tone-colored components
60
+ * (badge, metric tile, hero, flow, segmented …). One canonical type so apps and
61
+ * components agree on the same five tones instead of each re-declaring them.
62
+ *
63
+ * `StrctProgress` / `StrctGauge` use the narrower `StrctChartStatus` (no
64
+ * `'neutral'`) since a bar/gauge is always tinted.
65
+ */
66
+ type StrctStatus = 'neutral' | 'accent' | 'success' | 'warning' | 'critical';
67
+ /**
68
+ * Optional value-driven thresholds for meters (`StrctProgress`, `StrctGauge`).
69
+ * When supplied, the component derives its own status from the value:
70
+ * `value >= critical → 'critical'`, `>= warning → 'warning'`, otherwise the
71
+ * healthy base ('success' by default).
72
+ */
73
+ interface StrctThresholds {
74
+ warning?: number;
75
+ critical?: number;
76
+ }
77
+
57
78
  /**
58
79
  * Inner markup (path/shape contents) for each icon, drawn on a 0 0 16 16
59
80
  * viewBox with `currentColor` stroke. Keep strokes at 1.3–1.5 for crispness.
60
81
  *
82
+ * RENDER SIZES ("16 Native" policy): object / semantic glyphs must render at the
83
+ * grid's native 16px or larger — never downscaled (fractional scaling blurs
84
+ * hairlines). Simple single-stroke glyphs (chevrons, close, check, dots) may
85
+ * render at 11–14px; their wide details survive scaling.
86
+ *
87
+ * DETAIL BUDGET (small-size legibility): icons render as small as 14px, so keep
88
+ * gaps between parallel details ≥ 1.5px on the 16-grid (≈ max 3 parallel lines),
89
+ * prefer one large distinguishing feature over many small ones, and cap a glyph
90
+ * at ~6 drawing elements. Filled dots should be r ≥ 0.55.
91
+ *
61
92
  * The set is intentionally datacenter-flavoured (hosts, clusters, switches,
62
93
  * storage, VMs …). Object state — running / stopped / maintenance — is layered
63
94
  * on with the `badge` input rather than a separate icon per state.
@@ -346,11 +377,23 @@ type StrctProgressStatus = 'accent' | 'success' | 'warning' | 'critical';
346
377
  declare class StrctProgress {
347
378
  /** Current value. */
348
379
  readonly value: _angular_core.InputSignal<number>;
380
+ /** Accessible name of the bar (e.g. "CPU usage"). Falls back to "Progress". */
381
+ readonly label: _angular_core.InputSignal<string>;
349
382
  /** Visual status color. */
350
383
  readonly status: _angular_core.InputSignal<StrctProgressStatus>;
384
+ /**
385
+ * Optional value-driven thresholds. When set, the component picks its own
386
+ * status from the value instead of the caller computing it: `value >= critical`
387
+ * → critical, `>= warning` → warning, else the healthy base. The healthy base is
388
+ * `status` when it has been set to a semantic tone, or `'success'` when `status`
389
+ * is left at its default `'accent'`.
390
+ */
391
+ readonly thresholds: _angular_core.InputSignal<StrctThresholds | null>;
351
392
  protected readonly clamped: _angular_core.Signal<number>;
393
+ /** Status after applying thresholds (falls back to `status` when none set). */
394
+ protected readonly resolvedStatus: _angular_core.Signal<StrctProgressStatus>;
352
395
  static ɵfac: _angular_core.ɵɵFactoryDeclaration<StrctProgress, never>;
353
- 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>;
396
+ 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>;
354
397
  }
355
398
 
356
399
  /** Spinner size variants. */
@@ -359,8 +402,10 @@ type StrctSpinnerSize = 'sm' | 'md' | 'lg';
359
402
  declare class StrctSpinner {
360
403
  /** Size variant. */
361
404
  readonly size: _angular_core.InputSignal<StrctSpinnerSize>;
405
+ /** Accessible label (localizable). */
406
+ readonly label: _angular_core.InputSignal<string>;
362
407
  static ɵfac: _angular_core.ɵɵFactoryDeclaration<StrctSpinner, never>;
363
- static ɵcmp: _angular_core.ɵɵComponentDeclaration<StrctSpinner, "strct-spinner", never, { "size": { "alias": "size"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
408
+ 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>;
364
409
  }
365
410
 
366
411
  /**
@@ -463,12 +508,12 @@ declare class StrctTab {
463
508
  /** Tab group. Wraps `<strct-tab>` children and renders the tab bar. */
464
509
  declare class StrctTabs {
465
510
  readonly tabs: _angular_core.Signal<readonly StrctTab[]>;
466
- readonly selectedIndex: _angular_core.WritableSignal<number>;
511
+ readonly selectedIndex: _angular_core.ModelSignal<number>;
467
512
  constructor();
468
513
  select(index: number): void;
469
514
  onKeydown(event: KeyboardEvent, bar: HTMLElement): void;
470
515
  static ɵfac: _angular_core.ɵɵFactoryDeclaration<StrctTabs, never>;
471
- static ɵcmp: _angular_core.ɵɵComponentDeclaration<StrctTabs, "strct-tabs", never, {}, {}, ["tabs"], ["*"], true, never>;
516
+ static ɵcmp: _angular_core.ɵɵComponentDeclaration<StrctTabs, "strct-tabs", never, { "selectedIndex": { "alias": "selectedIndex"; "required": false; "isSignal": true; }; }, { "selectedIndex": "selectedIndexChange"; }, ["tabs"], ["*"], true, never>;
472
517
  }
473
518
 
474
519
  /** A single entry in a data-driven menu. */
@@ -581,6 +626,12 @@ declare class StrctContextMenuTrigger {
581
626
 
582
627
  /** A node in the data-driven tree (`<strct-tree [nodes]="...">`). */
583
628
  interface StrctTreeNodeData {
629
+ /**
630
+ * Stable unique key — used for `trackBy`, controlled expansion state
631
+ * (`expandedIds`) and a `data-node-id` DOM attribute. Falls back to `label`
632
+ * when absent (backward-compatible).
633
+ */
634
+ id?: string;
584
635
  label: string;
585
636
  /** Optional leading icon name. */
586
637
  icon?: string;
@@ -634,15 +685,29 @@ declare class StrctTreeNode {
634
685
  readonly nodeMenuSelect: _angular_core.OutputEmitterRef<StrctTreeMenuEvent>;
635
686
  /** Right-click menu items for this node ([] when no resolver / not data mode). */
636
687
  protected readonly menuItems: _angular_core.Signal<StrctMenuItem[]>;
688
+ /** The owning `<strct-tree>` (null only for standalone nodes outside a tree). */
689
+ protected readonly tree: StrctTree | null;
690
+ /** Parent tree node (element-injector ancestor); drives aria-level + ArrowLeft. */
691
+ readonly parent: StrctTreeNode | null;
692
+ /** 1-based depth, exposed as aria-level. */
693
+ readonly level: number;
694
+ private readonly hostEl;
637
695
  private readonly childNodes;
638
- /** Data-mode expansion (seeded from node.expanded on first toggle). */
696
+ /** Data-mode expansion fallback when there is no owning tree (seeded from node.expanded). */
639
697
  private readonly dataExpanded;
640
698
  protected readonly displayLabel: _angular_core.Signal<string>;
641
699
  protected readonly displayIcon: _angular_core.Signal<string | undefined>;
642
700
  protected readonly displayBadge: _angular_core.Signal<StrctIconBadge>;
643
701
  protected readonly displayActive: _angular_core.Signal<boolean>;
644
- protected readonly hasChildren: _angular_core.Signal<boolean>;
645
- protected readonly isOpen: _angular_core.Signal<boolean>;
702
+ constructor();
703
+ /** The focusable row element of this node. */
704
+ rowEl(): HTMLElement | null;
705
+ /** Roving tabindex: inside a tree only the active row is tabbable. */
706
+ protected readonly rowTabindex: _angular_core.Signal<0 | -1>;
707
+ protected onRowFocus(): void;
708
+ protected onRowKeydown(event: KeyboardEvent): void;
709
+ readonly hasChildren: _angular_core.Signal<boolean>;
710
+ readonly isOpen: _angular_core.Signal<boolean>;
646
711
  toggle(): void;
647
712
  protected onActivate(): void;
648
713
  protected onMenuSelect(item: StrctMenuItem): void;
@@ -663,8 +728,47 @@ declare class StrctTree {
663
728
  readonly nodeActivated: _angular_core.OutputEmitterRef<StrctTreeNodeData>;
664
729
  /** Emitted when a data-driven node's right-click menu item is chosen. */
665
730
  readonly nodeMenuSelect: _angular_core.OutputEmitterRef<StrctTreeMenuEvent>;
731
+ /**
732
+ * Controlled expansion (two-way). When non-null it is the single source of
733
+ * truth: node open state derives from it and toggles write back through it, so
734
+ * persisting/restoring is `<strct-tree [(expandedIds)]="ids" />`. When null
735
+ * (default), expansion is uncontrolled — seeded from each node's `expanded`
736
+ * flag and owned internally (backward-compatible).
737
+ */
738
+ readonly expandedIds: _angular_core.ModelSignal<string[] | null>;
739
+ /** The full set of expanded ids, emitted on every expand / collapse. */
740
+ readonly expandedChange: _angular_core.OutputEmitterRef<string[]>;
741
+ /** Emitted per toggle with the node and its new state. */
742
+ readonly nodeToggled: _angular_core.OutputEmitterRef<{
743
+ node: StrctTreeNodeData;
744
+ expanded: boolean;
745
+ }>;
746
+ /** Stable key for a node: its `id`, or the `label` as a fallback. */
747
+ private readonly keyOf;
748
+ /** Explicit user toggles layered on top of the `node.expanded` seed (uncontrolled). */
749
+ private readonly overrides;
750
+ /** Keys expanded by their `node.expanded` seed (pure — no flash on first render). */
751
+ private readonly seededSet;
752
+ /** The active expanded-key set — controlled `expandedIds`, or seed + overrides. */
753
+ private readonly currentSet;
754
+ /** Whether a node is currently expanded (called by its `StrctTreeNode`). */
755
+ isNodeOpen(node: StrctTreeNodeData): boolean;
756
+ private readonly registeredNodes;
757
+ private readonly activeRoving;
758
+ registerNode(node: StrctTreeNode): void;
759
+ unregisterNode(node: StrctTreeNode): void;
760
+ /** Visible nodes in document order (collapsed subtrees are never registered). */
761
+ private ordered;
762
+ /** Whether this node currently holds the roving tabindex (0). */
763
+ isRovingActive(node: StrctTreeNode): boolean;
764
+ setActive(node: StrctTreeNode): void;
765
+ private focusNode;
766
+ /** Keyboard navigation between visible rows (called from the focused node). */
767
+ navigate(node: StrctTreeNode, key: string): void;
768
+ /** Toggle a node's expansion, updating state and emitting outputs. */
769
+ toggleNode(node: StrctTreeNodeData): void;
666
770
  static ɵfac: _angular_core.ɵɵFactoryDeclaration<StrctTree, never>;
667
- 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>;
771
+ static ɵcmp: _angular_core.ɵɵComponentDeclaration<StrctTree, "strct-tree", never, { "nodes": { "alias": "nodes"; "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>;
668
772
  }
669
773
 
670
774
  /** Fixed modal width presets: sm 480 · md 640 · lg 860 · xl 1080 (px). */
@@ -689,6 +793,8 @@ declare class StrctModal {
689
793
  readonly size: _angular_core.InputSignal<StrctModalSize>;
690
794
  /** Hide the footer slot. */
691
795
  readonly hideFooter: _angular_core.InputSignalWithTransform<boolean, unknown>;
796
+ /** Accessible label of the X close button (localizable). */
797
+ readonly closeLabel: _angular_core.InputSignal<string>;
692
798
  /**
693
799
  * Allow closing via a backdrop click / the Escape key. **Off by default** —
694
800
  * a modal closes only through its X button or an explicit action button, so a
@@ -705,7 +811,7 @@ declare class StrctModal {
705
811
  private locked;
706
812
  constructor();
707
813
  close(): void;
708
- protected onBackdrop(): void;
814
+ protected onBackdrop(event?: Event): void;
709
815
  protected onEscape(): void;
710
816
  /** Wrap Tab focus within the dialog. */
711
817
  protected onTab(event: Event): void;
@@ -713,7 +819,7 @@ declare class StrctModal {
713
819
  private focusable;
714
820
  private focusInitial;
715
821
  static ɵfac: _angular_core.ɵɵFactoryDeclaration<StrctModal, never>;
716
- 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>;
822
+ 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>;
717
823
  }
718
824
 
719
825
  /** Marks the drawer's footer action area: `<ng-container strctDrawerFooter>…`. */
@@ -858,9 +964,12 @@ declare class StrctStep {
858
964
  /** Multi-step flow with a numbered header and Back / Next / Finish controls. */
859
965
  declare class StrctWizard {
860
966
  readonly steps: _angular_core.Signal<readonly StrctStep[]>;
861
- readonly current: _angular_core.WritableSignal<number>;
967
+ readonly current: _angular_core.ModelSignal<number>;
862
968
  /** Label for the final-step button (default "Finish"). */
863
969
  readonly finishLabel: _angular_core.InputSignal<string>;
970
+ /** Labels for the Back / Next buttons (localizable). */
971
+ readonly backLabel: _angular_core.InputSignal<string>;
972
+ readonly nextLabel: _angular_core.InputSignal<string>;
864
973
  /** Disable Finish and show a busy label while an async submit is in flight. */
865
974
  readonly submitting: _angular_core.InputSignalWithTransform<boolean, unknown>;
866
975
  /** Show a Cancel button on the left. */
@@ -879,7 +988,7 @@ declare class StrctWizard {
879
988
  back(): void;
880
989
  finish(): void;
881
990
  static ɵfac: _angular_core.ɵɵFactoryDeclaration<StrctWizard, never>;
882
- 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>;
991
+ 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>;
883
992
  }
884
993
 
885
994
  /**
@@ -914,6 +1023,10 @@ type PageToken = number | 'dots';
914
1023
  * <strct-pagination [total]="240" [pageSize]="20" [(page)]="page" />
915
1024
  */
916
1025
  declare class StrctPagination {
1026
+ /** Accessible labels (localizable). */
1027
+ readonly prevLabel: _angular_core.InputSignal<string>;
1028
+ readonly nextLabel: _angular_core.InputSignal<string>;
1029
+ readonly regionLabel: _angular_core.InputSignal<string>;
917
1030
  /** Total number of items. */
918
1031
  readonly total: _angular_core.InputSignal<number>;
919
1032
  /** Rows per page (0 disables paging). */
@@ -924,7 +1037,7 @@ declare class StrctPagination {
924
1037
  protected readonly pages: _angular_core.Signal<PageToken[]>;
925
1038
  go(target: number): void;
926
1039
  static ɵfac: _angular_core.ɵɵFactoryDeclaration<StrctPagination, never>;
927
- 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>;
1040
+ 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>;
928
1041
  }
929
1042
 
930
1043
  /** A leaf entry under a {@link StrctMenuSection}. */
@@ -976,6 +1089,113 @@ declare class StrctSectionMenu {
976
1089
  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>;
977
1090
  }
978
1091
 
1092
+ /** One searchable command in the palette. */
1093
+ interface StrctCommandItem {
1094
+ /** Stable key; returned with (picked). */
1095
+ id: string;
1096
+ label: string;
1097
+ /** Right-aligned group tag (e.g. a category or section name). */
1098
+ group?: string;
1099
+ /** Leading icon name (StrctIcon set). */
1100
+ icon?: string;
1101
+ /** Right-aligned shortcut hint, rendered as a key chip. */
1102
+ hint?: string;
1103
+ /** Extra search terms beyond label/group. */
1104
+ keywords?: string[];
1105
+ /** Arbitrary payload carried back with (picked). */
1106
+ data?: unknown;
1107
+ }
1108
+ /**
1109
+ * ⌘/Ctrl-K command palette — a spotlight search over app commands or pages.
1110
+ * Mount once near the app root, feed it `items`, and act on `(picked)`:
1111
+ *
1112
+ * <strct-command-palette [items]="commands" [(open)]="paletteOpen"
1113
+ * (picked)="run($event)" />
1114
+ *
1115
+ * Opens via the two-way `open` model or the built-in ⌘/Ctrl-K hotkey
1116
+ * (`hotkey` input). Implements the ARIA combobox/listbox pattern: arrow keys
1117
+ * move the active option, Enter picks, Escape closes; focus returns to the
1118
+ * previously focused element on close.
1119
+ */
1120
+ declare class StrctCommandPalette {
1121
+ private readonly doc;
1122
+ private readonly inputRef;
1123
+ /** Searchable commands. */
1124
+ readonly items: _angular_core.InputSignal<StrctCommandItem[]>;
1125
+ /** Whether the palette is open (two-way). */
1126
+ readonly open: _angular_core.ModelSignal<boolean>;
1127
+ /** Enable the built-in ⌘/Ctrl-K toggle. */
1128
+ readonly hotkey: _angular_core.InputSignalWithTransform<boolean, unknown>;
1129
+ /** Search input placeholder / dialog name (localizable). */
1130
+ readonly placeholder: _angular_core.InputSignal<string>;
1131
+ /** Empty-result message prefix (localizable). */
1132
+ readonly emptyText: _angular_core.InputSignal<string>;
1133
+ /** Maximum rendered results. */
1134
+ readonly maxResults: _angular_core.InputSignal<number>;
1135
+ /** Emitted when a command is chosen (Enter or click); the palette closes. */
1136
+ readonly picked: _angular_core.OutputEmitterRef<StrctCommandItem>;
1137
+ protected readonly query: _angular_core.WritableSignal<string>;
1138
+ protected readonly activeIndex: _angular_core.WritableSignal<number>;
1139
+ protected readonly listId: string;
1140
+ private previousActive;
1141
+ protected optionId(i: number): string;
1142
+ /** Rank: label prefix > word-start > substring; group/keyword matches last. */
1143
+ protected readonly filtered: _angular_core.Signal<StrctCommandItem[]>;
1144
+ constructor();
1145
+ /** ⌘/Ctrl-K toggle + global Escape while open. */
1146
+ protected onGlobalKey(event: KeyboardEvent): void;
1147
+ protected onType(event: Event): void;
1148
+ protected onKey(event: KeyboardEvent): void;
1149
+ private move;
1150
+ protected pick(item: StrctCommandItem): void;
1151
+ protected close(): void;
1152
+ static ɵfac: _angular_core.ɵɵFactoryDeclaration<StrctCommandPalette, never>;
1153
+ 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>;
1154
+ }
1155
+
1156
+ /**
1157
+ * Inline keyboard-key chip: `<strct-kbd>⌘K</strct-kbd>`. Used for shortcut hints
1158
+ * in menus, tooltips and the command palette.
1159
+ */
1160
+ declare class StrctKbd {
1161
+ static ɵfac: _angular_core.ɵɵFactoryDeclaration<StrctKbd, never>;
1162
+ static ɵcmp: _angular_core.ɵɵComponentDeclaration<StrctKbd, "strct-kbd", never, {}, {}, never, ["*"], true, never>;
1163
+ }
1164
+
1165
+ /** Lifecycle of an async (or deferred) validation check. */
1166
+ type StrctValidationStatus = 'idle' | 'checking' | 'ok' | 'warning' | 'error';
1167
+ /**
1168
+ * A first-class "validating… → ok / warning / error (reason)" model, so apps stop
1169
+ * composing a spinner + badge by hand (e.g. live reachability checks while typing).
1170
+ * Consumed by `StrctField`'s `validationState` input and the `[strctCellStatus]`
1171
+ * datagrid-cell helper.
1172
+ */
1173
+ interface StrctValidationState {
1174
+ status: StrctValidationStatus;
1175
+ /** Optional human-readable reason, shown beside the affordance / in the hint slot. */
1176
+ message?: string;
1177
+ }
1178
+ /** Tone class suffix per validation status (used by field + cell helper styles). */
1179
+ declare function strctValidationTone(status: StrctValidationStatus): string;
1180
+ /** Leading icon name per (non-checking) validation status; '' for idle/checking. */
1181
+ declare function strctValidationIcon(status: StrctValidationStatus): string;
1182
+ /**
1183
+ * Renders the shared "checking / ok / warning / error (reason)" affordance from a
1184
+ * small `StrctValidationState` model — a spinner while checking, then an icon and
1185
+ * an optional message. Drop it into a `StrctDatagrid` cell template for
1186
+ * list-building flows, as an element or an attribute:
1187
+ *
1188
+ * <strct-cell-status [state]="probe(row)" />
1189
+ * <span strct-cell-status [state]="probe(row)"></span>
1190
+ */
1191
+ declare class StrctCellStatus {
1192
+ /** The validation state to render. */
1193
+ readonly state: _angular_core.InputSignal<StrctValidationState>;
1194
+ protected readonly icon: _angular_core.Signal<string>;
1195
+ static ɵfac: _angular_core.ɵɵFactoryDeclaration<StrctCellStatus, never>;
1196
+ static ɵcmp: _angular_core.ɵɵComponentDeclaration<StrctCellStatus, "strct-cell-status, [strct-cell-status]", never, { "state": { "alias": "state"; "required": true; "isSignal": true; }; }, {}, never, never, true, never>;
1197
+ }
1198
+
979
1199
  /**
980
1200
  * Form-field wrapper: a label (with optional required marker), the projected
981
1201
  * control, and a hint or error message. It auto-links the control via
@@ -994,18 +1214,33 @@ declare class StrctField {
994
1214
  readonly hint: _angular_core.InputSignal<string>;
995
1215
  /** Error message (string or first-of array); falsy clears the error state. */
996
1216
  readonly error: _angular_core.InputSignal<string | string[] | null | undefined>;
1217
+ /**
1218
+ * Async-validation state rendered as a trailing adornment (spinner / check /
1219
+ * warning) plus its message in the hint/error slot — so apps stop composing a
1220
+ * spinner + badge by hand for live "checking… → ok / warning / error" checks.
1221
+ */
1222
+ readonly validationState: _angular_core.InputSignal<StrctValidationState | null>;
997
1223
  private readonly host;
998
1224
  private readonly n;
999
1225
  protected readonly hintId: string;
1000
1226
  protected readonly errorId: string;
1001
1227
  protected readonly controlId: _angular_core.WritableSignal<string>;
1002
1228
  protected readonly errorText: _angular_core.Signal<string>;
1229
+ /** Effective validation status ('idle' when no state supplied). */
1230
+ protected readonly stateStatus: _angular_core.Signal<_akcelik_strct.StrctValidationStatus>;
1231
+ /** Whether to show the trailing adornment (an explicit error suppresses it). */
1232
+ protected readonly stateActive: _angular_core.Signal<boolean>;
1233
+ protected readonly stateIcon: _angular_core.Signal<string>;
1234
+ /** Validation message, shown only when there is no explicit error. */
1235
+ protected readonly stateMessage: _angular_core.Signal<string>;
1236
+ /** Invalid when an explicit error is set or the validation state is 'error'. */
1237
+ protected readonly isInvalid: _angular_core.Signal<boolean>;
1003
1238
  constructor();
1004
1239
  private control;
1005
1240
  private link;
1006
1241
  private applyAria;
1007
1242
  static ɵfac: _angular_core.ɵɵFactoryDeclaration<StrctField, never>;
1008
- 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>;
1243
+ 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>;
1009
1244
  }
1010
1245
 
1011
1246
  /**
@@ -1092,6 +1327,56 @@ declare class StrctRadio {
1092
1327
  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>;
1093
1328
  }
1094
1329
 
1330
+ /** One segment of a `StrctSegmented`. */
1331
+ interface StrctSegmentedOption {
1332
+ value: unknown;
1333
+ label: string;
1334
+ /** Optional leading icon name (StrctIcon set). */
1335
+ icon?: string;
1336
+ /** Disable just this segment. */
1337
+ disabled?: boolean;
1338
+ }
1339
+ /** Segment size. */
1340
+ type StrctSegmentedSize = 'sm' | 'md';
1341
+ /**
1342
+ * One-of-N selection rendered as a joined segmented control with managed
1343
+ * selected state — distinct from `StrctTabs` (panel switching) and
1344
+ * `StrctButtonGroup` (a visual cluster only). For mode pickers and list filters.
1345
+ * CVA-compatible, so `formControlName` and `[(ngModel)]` both work.
1346
+ *
1347
+ * <strct-segmented
1348
+ * [options]="[{ value: 'all', label: 'All' }, { value: 'active', label: 'Active' }]"
1349
+ * [(ngModel)]="filter" size="sm" />
1350
+ */
1351
+ declare class StrctSegmented implements ControlValueAccessor {
1352
+ /** The selectable segments. */
1353
+ readonly options: _angular_core.InputSignal<StrctSegmentedOption[]>;
1354
+ /** Segment size. */
1355
+ readonly size: _angular_core.InputSignal<StrctSegmentedSize>;
1356
+ /** Stretch to the full width of the container. */
1357
+ readonly block: _angular_core.InputSignalWithTransform<boolean, unknown>;
1358
+ /** Static disable; forms' setDisabledState also drives the disabled state. */
1359
+ readonly disabled: _angular_core.InputSignalWithTransform<boolean, unknown>;
1360
+ readonly value: _angular_core.WritableSignal<unknown>;
1361
+ readonly isDisabled: _angular_core.WritableSignal<boolean>;
1362
+ private readonly segs;
1363
+ private onChange;
1364
+ protected onTouched: () => void;
1365
+ constructor();
1366
+ protected isSelected(opt: StrctSegmentedOption): boolean;
1367
+ /** Index of the currently selected (or first enabled) option for roving focus. */
1368
+ private readonly activeIndex;
1369
+ protected rovingIndex(opt: StrctSegmentedOption, i: number): number;
1370
+ protected select(opt: StrctSegmentedOption): void;
1371
+ protected onKeydown(event: KeyboardEvent): void;
1372
+ writeValue(value: unknown): void;
1373
+ registerOnChange(fn: (value: unknown) => void): void;
1374
+ registerOnTouched(fn: () => void): void;
1375
+ setDisabledState(isDisabled: boolean): void;
1376
+ static ɵfac: _angular_core.ɵɵFactoryDeclaration<StrctSegmented, never>;
1377
+ 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>;
1378
+ }
1379
+
1095
1380
  /**
1096
1381
  * Slider built on a native range input — fully accessible, CVA-compatible.
1097
1382
  * <strct-range [min]="0" [max]="100" [(ngModel)]="volume" showValue />
@@ -1530,6 +1815,57 @@ declare class StrctCascadeSelect extends StrctCascadeHost implements ControlValu
1530
1815
  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>;
1531
1816
  }
1532
1817
 
1818
+ /** One row in a `StrctDescriptionList` when driven by the `items` input. */
1819
+ interface StrctDescItem {
1820
+ label: string;
1821
+ value?: string | number;
1822
+ /** Render the value in the monospace face. */
1823
+ mono?: boolean;
1824
+ /** Dim the value (secondary information). */
1825
+ muted?: boolean;
1826
+ }
1827
+ /** Value alignment for the stacked (non-inline) layout. */
1828
+ type StrctDescAlign = 'between' | 'start';
1829
+ /**
1830
+ * Compact definition list: aligned `label : value` rows with an optional trailing
1831
+ * slot. The `inline` variant is the horizontal "stat strip" (label-value pairs in
1832
+ * a row). Replaces the hand-rolled `<dl>` + flex.
1833
+ *
1834
+ * Drive it with the `items` input, or project `<strct-desc>` rows so a value can
1835
+ * host a badge, icon or any rich content:
1836
+ *
1837
+ * <strct-description-list>
1838
+ * <strct-desc label="IPv4" mono>172.16.75.100/24</strct-desc>
1839
+ * <strct-desc label="IPv6"><strct-badge status="success">Enabled</strct-badge></strct-desc>
1840
+ * </strct-description-list>
1841
+ *
1842
+ * <strct-description-list [items]="[{ label: 'Gateway', value: '172.16.75.2', mono: true }]" />
1843
+ */
1844
+ declare class StrctDescriptionList {
1845
+ /** Rows, as an alternative to projecting `<strct-desc>` children. */
1846
+ readonly items: _angular_core.InputSignal<StrctDescItem[]>;
1847
+ /** Horizontal stat-strip layout instead of stacked rows. */
1848
+ readonly inline: _angular_core.InputSignalWithTransform<boolean, unknown>;
1849
+ /** Value alignment in stacked mode. */
1850
+ readonly align: _angular_core.InputSignal<StrctDescAlign>;
1851
+ static ɵfac: _angular_core.ɵɵFactoryDeclaration<StrctDescriptionList, never>;
1852
+ 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>;
1853
+ }
1854
+ /**
1855
+ * One projected `label → value` row inside a `<strct-description-list>`. The
1856
+ * value is whatever you project, so it can host a badge, icon or formatted text.
1857
+ */
1858
+ declare class StrctDesc {
1859
+ /** The row's label. */
1860
+ readonly label: _angular_core.InputSignal<string>;
1861
+ /** Render the projected value in the monospace face. */
1862
+ readonly mono: _angular_core.InputSignalWithTransform<boolean, unknown>;
1863
+ /** Dim the projected value. */
1864
+ readonly muted: _angular_core.InputSignalWithTransform<boolean, unknown>;
1865
+ static ɵfac: _angular_core.ɵɵFactoryDeclaration<StrctDesc, never>;
1866
+ 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>;
1867
+ }
1868
+
1533
1869
  /** Column definition for the table. */
1534
1870
  interface StrctColumn {
1535
1871
  key: string;
@@ -1588,6 +1924,21 @@ declare class StrctTable {
1588
1924
  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>;
1589
1925
  }
1590
1926
 
1927
+ /** Every user-visible / assistive string in the grid, overridable for i18n. */
1928
+ interface StrctDatagridLabels {
1929
+ row: string;
1930
+ rows: string;
1931
+ selected: string;
1932
+ selectAll: string;
1933
+ selectRow: string;
1934
+ openDetail: string;
1935
+ toggleDetail: string;
1936
+ closeDetail: string;
1937
+ rowActions: string;
1938
+ chooseColumns: string;
1939
+ refresh: string;
1940
+ actions: string;
1941
+ }
1591
1942
  /** Resolves a stable identity for a row: a property key, or a function. */
1592
1943
  type StrctRowId = string | ((row: StrctRow) => unknown);
1593
1944
  /** Column definition for the datagrid. */
@@ -1663,6 +2014,30 @@ declare class StrctDatagrid {
1663
2014
  * [rowActions]="(row) => [{ label: 'Open', action: () => open(row) }, …]"
1664
2015
  */
1665
2016
  readonly rowActions: _angular_core.InputSignal<((row: StrctRow) => StrctMenuItem[]) | null>;
2017
+ /**
2018
+ * Seed the row selection. Each value is a row id (matching {@link rowId}); the
2019
+ * grid checks those rows when this input is set or changes. Requires
2020
+ * `selectable`. Assigning a new array (e.g. when opening a dialog) re-seeds the
2021
+ * selection; the user's subsequent toggles are preserved until the next change.
2022
+ */
2023
+ readonly initialSelection: _angular_core.InputSignal<readonly unknown[] | null>;
2024
+ /** Override any user-visible / assistive string (partial; merged over defaults). */
2025
+ readonly labels: _angular_core.InputSignal<Partial<StrctDatagridLabels>>;
2026
+ /** Effective labels (defaults + overrides). */
2027
+ protected readonly L: _angular_core.Signal<{
2028
+ row: string;
2029
+ rows: string;
2030
+ selected: string;
2031
+ selectAll: string;
2032
+ selectRow: string;
2033
+ openDetail: string;
2034
+ toggleDetail: string;
2035
+ closeDetail: string;
2036
+ rowActions: string;
2037
+ chooseColumns: string;
2038
+ refresh: string;
2039
+ actions: string;
2040
+ }>;
1666
2041
  /** Emitted when the selection changes. */
1667
2042
  readonly selectionChange: _angular_core.OutputEmitterRef<StrctRow[]>;
1668
2043
  /** Emitted when the refresh button is clicked. */
@@ -1734,7 +2109,7 @@ declare class StrctDatagrid {
1734
2109
  private commitSelection;
1735
2110
  private compare;
1736
2111
  static ɵfac: _angular_core.ɵɵFactoryDeclaration<StrctDatagrid, never>;
1737
- 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>;
2112
+ 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>;
1738
2113
  }
1739
2114
 
1740
2115
  /** Timeline node state colors. */
@@ -1793,24 +2168,125 @@ declare class StrctSparkline {
1793
2168
 
1794
2169
  /** Chart rendering types (line, area, bar). */
1795
2170
  type StrctChartType = 'line' | 'area' | 'bar';
2171
+ /** Line interpolation between points. */
2172
+ type StrctChartCurve = 'smooth' | 'linear' | 'step';
2173
+ /** One series in a multi-series chart. */
2174
+ interface StrctChartSeries {
2175
+ data: number[];
2176
+ /** Legend + tooltip name. */
2177
+ label?: string;
2178
+ /** Per-series color; falls back to the chart's `status`. */
2179
+ status?: StrctChartStatus;
2180
+ /** Per-series area fill. */
2181
+ area?: boolean;
2182
+ /** Per-series interpolation; falls back to the chart's `curve`. */
2183
+ curve?: StrctChartCurve;
2184
+ /**
2185
+ * Dashed line — a second visual channel besides color, so two series stay
2186
+ * distinguishable under color-vision deficiency. `true` uses `'5 4'`; pass a
2187
+ * custom SVG dasharray string to tune it.
2188
+ */
2189
+ dash?: boolean | string;
2190
+ }
2191
+ /** A horizontal reference / threshold line. */
2192
+ interface StrctChartThreshold {
2193
+ value: number;
2194
+ label?: string;
2195
+ /** Line color; default 'warning'. */
2196
+ status?: StrctChartStatus;
2197
+ /** Dashed line; default true. */
2198
+ dashed?: boolean;
2199
+ }
2200
+ interface Pt {
2201
+ x: number;
2202
+ y: number;
2203
+ }
2204
+ interface SeriesRender {
2205
+ color: string;
2206
+ label: string;
2207
+ area: boolean;
2208
+ dash: string | null;
2209
+ pts: Pt[];
2210
+ path: string;
2211
+ areaPath: string;
2212
+ /** Global x-offset (right-aligned) so shorter series line up on the right. */
2213
+ offset: number;
2214
+ data: number[];
2215
+ }
1796
2216
  /**
1797
- * Single-series chart (line / area / bar). Dependency-free SVG, token-coloured.
1798
- * <strct-chart [data]="cpu" type="area" [labels]="hours" status="warning" />
2217
+ * Single- or multi-series chart (line / area / bar). Dependency-free SVG,
2218
+ * token-coloured.
2219
+ *
2220
+ * Lines are smooth by default (monotone cubic, no overshoot); set `curve` to
2221
+ * `linear` or `step`. Toggle the gradient fill with `area`, the ambient glow with
2222
+ * `glow`, and turn on `live` for streaming metrics. Pass `series` for multiple
2223
+ * lines with a `legend`; add persistent scale labels with `yAxis`, reference lines
2224
+ * with `thresholds`, a floor with `min`, and thin x labels with `xTicks`. Hover
2225
+ * anywhere for a crosshair + tooltip. The SVG is measured (1:1 coordinates) so
2226
+ * dots and the glow stay crisp at any width. Reduced-motion safe.
2227
+ *
2228
+ * <strct-chart [data]="cpu" area glow [labels]="hours" status="warning" />
2229
+ * <strct-chart [series]="[{data:inArr,label:'In'},{data:outArr,label:'Out'}]" legend />
1799
2230
  */
1800
2231
  declare class StrctChart {
1801
- /** Data array. */
2232
+ /** Single-series data (or use `series`). */
1802
2233
  readonly data: _angular_core.InputSignal<number[]>;
2234
+ /** Multiple series; when set it takes precedence over `data`. */
2235
+ readonly series: _angular_core.InputSignal<StrctChartSeries[] | null>;
1803
2236
  /** Visual type / variant. */
1804
2237
  readonly type: _angular_core.InputSignal<StrctChartType>;
2238
+ /** Line interpolation. */
2239
+ readonly curve: _angular_core.InputSignal<StrctChartCurve>;
2240
+ /** Fill the area under the line with a soft gradient. */
2241
+ readonly area: _angular_core.InputSignalWithTransform<boolean, unknown>;
2242
+ /** Soft ambient glow on the line and the leading-edge dot. */
2243
+ readonly glow: _angular_core.InputSignalWithTransform<boolean, unknown>;
2244
+ /** Live streaming: the window scrolls left as new points arrive. */
2245
+ readonly live: _angular_core.InputSignalWithTransform<boolean, unknown>;
2246
+ /** Expected ms between updates in live mode (drives the scroll duration). */
2247
+ readonly interval: _angular_core.InputSignal<number>;
2248
+ /** Hover crosshair + value tooltip. */
2249
+ readonly interactive: _angular_core.InputSignalWithTransform<boolean, unknown>;
2250
+ /** Line thickness in pixels. */
2251
+ readonly strokeWidth: _angular_core.InputSignal<number>;
2252
+ /** Show the horizontal gridlines. */
2253
+ readonly grid: _angular_core.InputSignalWithTransform<boolean, unknown>;
2254
+ /** Show a dot at each data point (single-series). */
2255
+ readonly dots: _angular_core.InputSignalWithTransform<boolean, unknown>;
2256
+ /** Show a legend (with `series`). */
2257
+ readonly legend: _angular_core.InputSignalWithTransform<boolean, unknown>;
1805
2258
  /** X-axis labels. */
1806
2259
  readonly labels: _angular_core.InputSignal<string[]>;
2260
+ /** Target number of x labels; null renders every label. */
2261
+ readonly xTicks: _angular_core.InputSignal<number | null>;
2262
+ /** Formatter for x labels. */
2263
+ readonly xFormat: _angular_core.InputSignal<((label: string, index: number) => string) | null>;
1807
2264
  /** Visual status color. */
1808
2265
  readonly status: _angular_core.InputSignal<StrctChartStatus>;
1809
2266
  /** Height in pixels. */
1810
2267
  readonly height: _angular_core.InputSignal<number>;
1811
2268
  /** Override the top of the value axis (defaults to the data max + headroom). */
1812
2269
  readonly max: _angular_core.InputSignal<number | null>;
1813
- protected readonly vbW = 320;
2270
+ /** Override the floor of the value axis (defaults to 0). */
2271
+ readonly min: _angular_core.InputSignal<number | null>;
2272
+ /** Persistent y-axis scale labels. */
2273
+ readonly yAxis: _angular_core.InputSignalWithTransform<boolean, unknown>;
2274
+ /** Approx number of y ticks. */
2275
+ readonly yTicks: _angular_core.InputSignal<number>;
2276
+ /** Formatter for y-axis labels; falls back to `valueFormat`. */
2277
+ readonly axisFormat: _angular_core.InputSignal<((v: number) => string) | null>;
2278
+ /** Horizontal reference / threshold lines. */
2279
+ readonly thresholds: _angular_core.InputSignal<StrctChartThreshold[]>;
2280
+ /** Text shown when there is no data. */
2281
+ readonly emptyText: _angular_core.InputSignal<string>;
2282
+ /** Formatter for the live-mode "Xs ago" tooltip line (receives seconds). */
2283
+ readonly agoFormat: _angular_core.InputSignal<((seconds: number) => string) | null>;
2284
+ /**
2285
+ * Optional formatter for the values shown in the hover tooltip + y-axis flag
2286
+ * (and the delta magnitude). Lets callers add units / fixed precision, e.g.
2287
+ * `[valueFormat]="v => v.toFixed(3) + ' %'"`. When null, the raw value is shown.
2288
+ */
2289
+ readonly valueFormat: _angular_core.InputSignal<((v: number) => string) | null>;
1814
2290
  protected readonly pad: {
1815
2291
  l: number;
1816
2292
  r: number;
@@ -1818,14 +2294,48 @@ declare class StrctChart {
1818
2294
  b: number;
1819
2295
  };
1820
2296
  protected readonly color: _angular_core.Signal<string>;
1821
- private readonly maxValue;
2297
+ protected readonly showArea: _angular_core.Signal<boolean>;
2298
+ private readonly uid;
2299
+ protected readonly gradId: string;
2300
+ protected readonly clipId: string;
2301
+ /** Measured pixel width → 1:1 viewBox so dots / glow stay crisp at any size. */
2302
+ protected readonly width: _angular_core.WritableSignal<number>;
2303
+ private readonly svgRef;
2304
+ protected readonly slidePx: _angular_core.WritableSignal<number>;
2305
+ protected readonly sliding: _angular_core.WritableSignal<boolean>;
2306
+ protected readonly drawOn: _angular_core.WritableSignal<boolean>;
2307
+ private firstData;
2308
+ /** Reactive OS motion preference (tracks live changes, not just first load). */
2309
+ private readonly reduceMotion;
2310
+ protected readonly hoverIdx: _angular_core.WritableSignal<number | null>;
2311
+ constructor();
2312
+ private readonly seriesResolved;
2313
+ protected readonly isMulti: _angular_core.Signal<boolean>;
2314
+ /** All data arrays (multi or single). */
2315
+ private readonly allData;
2316
+ protected readonly isEmpty: _angular_core.Signal<boolean>;
2317
+ /** Number of x slots. */
2318
+ private readonly nx;
2319
+ /** Left padding: wider when the y-axis labels are shown. */
2320
+ protected readonly pl: _angular_core.Signal<number>;
2321
+ private chartW;
1822
2322
  private chartH;
1823
- protected readonly points: _angular_core.Signal<{
1824
- x: number;
1825
- y: number;
2323
+ /** Horizontal gap between two data points, in px. */
2324
+ private stepX;
2325
+ private readonly yMax;
2326
+ private readonly yMin;
2327
+ private yOf;
2328
+ protected readonly points: _angular_core.Signal<Pt[]>;
2329
+ protected readonly head: _angular_core.Signal<Pt | null>;
2330
+ private readonly plotPoints;
2331
+ protected readonly linePath: _angular_core.Signal<string>;
2332
+ protected readonly areaPath: _angular_core.Signal<string>;
2333
+ protected readonly multiSeries: _angular_core.Signal<SeriesRender[]>;
2334
+ protected readonly legendItems: _angular_core.Signal<{
2335
+ label: string;
2336
+ color: string;
2337
+ dash: string | null;
1826
2338
  }[]>;
1827
- protected readonly linePoints: _angular_core.Signal<string>;
1828
- protected readonly areaPoints: _angular_core.Signal<string>;
1829
2339
  protected readonly bars: _angular_core.Signal<{
1830
2340
  x: number;
1831
2341
  y: number;
@@ -1833,8 +2343,59 @@ declare class StrctChart {
1833
2343
  h: number;
1834
2344
  }[]>;
1835
2345
  protected readonly gridY: _angular_core.Signal<number[]>;
2346
+ private fmtAxis;
2347
+ protected readonly yAxisTicks: _angular_core.Signal<{
2348
+ value: number;
2349
+ y: number;
2350
+ text: string;
2351
+ }[]>;
2352
+ protected readonly thresholdLines: _angular_core.Signal<{
2353
+ y: number;
2354
+ color: string;
2355
+ dashed: boolean;
2356
+ label: string;
2357
+ }[]>;
2358
+ protected readonly displayLabels: _angular_core.Signal<{
2359
+ text: string;
2360
+ i: number;
2361
+ }[]>;
2362
+ protected readonly hoverX: _angular_core.Signal<number | null>;
2363
+ protected readonly hoverPt: _angular_core.Signal<Pt | null>;
2364
+ protected readonly hoverValue: _angular_core.Signal<number | "">;
2365
+ /** hoverValue run through valueFormat (unit / precision), else the raw value. */
2366
+ protected readonly hoverValueText: _angular_core.Signal<string>;
2367
+ /** Delta magnitude, formatted the same way so its unit matches the value. */
2368
+ protected readonly absDeltaText: _angular_core.Signal<string>;
2369
+ protected readonly hoverLabel: _angular_core.Signal<string>;
2370
+ /** Change from the previous point (single-series; null at the first point). */
2371
+ protected readonly hoverDelta: _angular_core.Signal<number | null>;
2372
+ protected readonly absDelta: _angular_core.Signal<number>;
2373
+ /** Second tooltip line: "Xs ago" while live, else the x label. */
2374
+ protected readonly hoverMeta: _angular_core.Signal<string>;
2375
+ /** Per-series value at the hovered index (multi-series tooltip). */
2376
+ protected readonly hoverRows: _angular_core.Signal<{
2377
+ label: string;
2378
+ color: string;
2379
+ value: number | null;
2380
+ text: string;
2381
+ }[]>;
2382
+ /** Per-series hover dots (multi-series). */
2383
+ protected readonly hoverDots: _angular_core.Signal<{
2384
+ x: number;
2385
+ y: number;
2386
+ color: string;
2387
+ }[]>;
2388
+ /** Screen-reader summary of the whole chart (role="img" name). */
2389
+ protected readonly chartAria: _angular_core.Signal<string>;
2390
+ /** aria-live text announcing the hovered / keyboard-selected point. */
2391
+ protected readonly srText: _angular_core.Signal<string>;
2392
+ /** Pixel x of a data index (shared by the plot and the x-axis labels). */
2393
+ protected xOf(i: number): number;
2394
+ /** Keyboard access to the crosshair: arrows walk the points. */
2395
+ protected onKey(event: KeyboardEvent): void;
2396
+ protected onMove(event: PointerEvent): void;
1836
2397
  static ɵfac: _angular_core.ɵɵFactoryDeclaration<StrctChart, never>;
1837
- 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>;
2398
+ 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>;
1838
2399
  }
1839
2400
 
1840
2401
  /** A single weighted slice of a donut chart. */
@@ -1844,9 +2405,13 @@ interface StrctDonutSegment {
1844
2405
  color?: string;
1845
2406
  }
1846
2407
  /**
1847
- * Donut / ring chart from weighted segments.
1848
- * <strct-donut [segments]="[{value:6,label:'Running'},{value:2,label:'Off'}]"
1849
- * centerValue="8" centerLabel="VMs" />
2408
+ * Donut / ring chart from weighted segments. Rounded, gapped slices with a
2409
+ * sweep-in animation; hover a slice (or its legend row) to highlight it and read
2410
+ * its value + share in the center. Dependency-free SVG, token-coloured.
2411
+ *
2412
+ * <strct-donut
2413
+ * [segments]="[{ value: 36, label: 'Running' }, { value: 8, label: 'Stopped' }]"
2414
+ * centerValue="44" centerLabel="VMs" legend />
1850
2415
  */
1851
2416
  declare class StrctDonut {
1852
2417
  /** Weighted segments. */
@@ -1855,20 +2420,38 @@ declare class StrctDonut {
1855
2420
  readonly size: _angular_core.InputSignal<number>;
1856
2421
  /** Stroke thickness in pixels. */
1857
2422
  readonly thickness: _angular_core.InputSignal<number>;
1858
- /** Value shown in the donut center. */
2423
+ /** Value shown in the donut center (when no slice is hovered). */
1859
2424
  readonly centerValue: _angular_core.InputSignal<string | number>;
1860
- /** Label shown in the donut center. */
2425
+ /** Label shown in the donut center (when no slice is hovered). */
1861
2426
  readonly centerLabel: _angular_core.InputSignal<string>;
2427
+ /** Show a legend (color · label · value · %) beside the ring. */
2428
+ readonly legend: _angular_core.InputSignalWithTransform<boolean, unknown>;
2429
+ /** Gap between slices, in degrees. */
2430
+ readonly gap: _angular_core.InputSignal<number>;
2431
+ /** Hover highlight + center readout. */
2432
+ readonly interactive: _angular_core.InputSignalWithTransform<boolean, unknown>;
2433
+ protected readonly hovered: _angular_core.WritableSignal<number | null>;
1862
2434
  protected readonly half: _angular_core.Signal<number>;
1863
2435
  protected readonly radius: _angular_core.Signal<number>;
1864
2436
  protected readonly circumference: _angular_core.Signal<number>;
2437
+ private readonly total;
1865
2438
  protected readonly arcs: _angular_core.Signal<{
1866
2439
  color: string;
1867
- len: number;
2440
+ label: string;
2441
+ value: number;
2442
+ pct: number;
2443
+ dash: string;
1868
2444
  offset: number;
1869
2445
  }[]>;
2446
+ protected readonly centerMain: _angular_core.Signal<string | number>;
2447
+ protected readonly centerSub: _angular_core.Signal<string>;
2448
+ protected readonly centerColor: _angular_core.Signal<string>;
2449
+ /** Screen-reader summary (role="img" name): every slice with value + share. */
2450
+ protected readonly ariaSummary: _angular_core.Signal<string>;
2451
+ protected enter(i: number): void;
2452
+ protected leave(): void;
1870
2453
  static ɵfac: _angular_core.ɵɵFactoryDeclaration<StrctDonut, never>;
1871
- 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>;
2454
+ 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>;
1872
2455
  }
1873
2456
 
1874
2457
  /**
@@ -1880,6 +2463,13 @@ declare class StrctGauge {
1880
2463
  readonly value: _angular_core.InputSignal<number>;
1881
2464
  /** Visual status color. */
1882
2465
  readonly status: _angular_core.InputSignal<StrctChartStatus>;
2466
+ /**
2467
+ * Optional value-driven thresholds. When set, the gauge picks its own status
2468
+ * from the value: `value >= critical` → critical, `>= warning` → warning, else
2469
+ * the healthy base (`status`, or `'success'` when `status` is left at its
2470
+ * default `'accent'`).
2471
+ */
2472
+ readonly thresholds: _angular_core.InputSignal<StrctThresholds | null>;
1883
2473
  /** Label text. */
1884
2474
  readonly label: _angular_core.InputSignal<string>;
1885
2475
  /** Size variant. */
@@ -1889,12 +2479,72 @@ declare class StrctGauge {
1889
2479
  protected readonly clamped: _angular_core.Signal<number>;
1890
2480
  protected readonly half: _angular_core.Signal<number>;
1891
2481
  protected readonly radius: _angular_core.Signal<number>;
2482
+ /** Status after applying thresholds (falls back to `status` when none set). */
2483
+ protected readonly resolvedStatus: _angular_core.Signal<StrctChartStatus>;
1892
2484
  protected readonly color: _angular_core.Signal<string>;
1893
2485
  private readonly circumference;
1894
2486
  protected readonly trackDash: _angular_core.Signal<string>;
1895
2487
  protected readonly valueDash: _angular_core.Signal<string>;
1896
2488
  static ɵfac: _angular_core.ɵɵFactoryDeclaration<StrctGauge, never>;
1897
- 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>;
2489
+ 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>;
2490
+ }
2491
+
2492
+ /** One endpoint in a `StrctFlow`. */
2493
+ interface StrctFlowNode {
2494
+ /** Stable identity (used as the @for track key). */
2495
+ id: string;
2496
+ /** Primary terminal label. */
2497
+ label: string;
2498
+ /** Optional secondary line under the label. */
2499
+ sublabel?: string;
2500
+ /** Optional role tag (e.g. "ACTIVE", "STANDBY"). */
2501
+ role?: string;
2502
+ /** Optional status dot tone for this terminal. */
2503
+ status?: StrctStatus;
2504
+ }
2505
+ /** Direction of travel for the animated flow. */
2506
+ type StrctFlowDirection = 'forward' | 'reverse' | 'both';
2507
+ /** Axis the terminals are laid out along. */
2508
+ type StrctFlowOrientation = 'horizontal' | 'vertical';
2509
+ /**
2510
+ * Shows a connection between two (or N) endpoints with an optional animated
2511
+ * "flow" — moving dots travelling along the connector — to represent live data
2512
+ * movement (replication, sync, a pipeline).
2513
+ *
2514
+ * <strct-flow
2515
+ * [nodes]="[
2516
+ * { id: 'a', label: 'node01', role: 'ACTIVE', status: 'success' },
2517
+ * { id: 'b', label: 'node02', role: 'STANDBY', status: 'accent' }
2518
+ * ]"
2519
+ * [live]="true" label="live replication · 0 lag" status="success" />
2520
+ *
2521
+ * When `live` is off (or the user prefers reduced motion) the connector is a
2522
+ * static gradient with a direction arrow instead of moving dots.
2523
+ */
2524
+ declare class StrctFlow {
2525
+ /** Ordered endpoints. */
2526
+ readonly nodes: _angular_core.InputSignal<StrctFlowNode[]>;
2527
+ /** Animate the flow (packets travel along the connector). */
2528
+ readonly live: _angular_core.InputSignalWithTransform<boolean, unknown>;
2529
+ /** Direction of travel. */
2530
+ readonly direction: _angular_core.InputSignal<StrctFlowDirection>;
2531
+ /** Caption under the connector (e.g. "live replication", "0 lag"). */
2532
+ readonly label: _angular_core.InputSignal<string>;
2533
+ /** Connector + packet color. */
2534
+ readonly status: _angular_core.InputSignal<StrctStatus>;
2535
+ /** Layout axis. */
2536
+ readonly orientation: _angular_core.InputSignal<StrctFlowOrientation>;
2537
+ /** A flow needs at least two terminals to animate. */
2538
+ protected readonly connected: _angular_core.Signal<boolean>;
2539
+ protected readonly animated: _angular_core.Signal<boolean>;
2540
+ /** Whether to show packets / arrow in the given travel direction. */
2541
+ protected showArrow(dir: 'forward' | 'reverse'): boolean;
2542
+ /** Caption text, falling back to a "no connection" hint for a lone terminal. */
2543
+ protected readonly caption: _angular_core.Signal<string>;
2544
+ /** Human-readable summary for assistive tech. */
2545
+ protected readonly ariaLabel: _angular_core.Signal<string>;
2546
+ static ɵfac: _angular_core.ɵɵFactoryDeclaration<StrctFlow, never>;
2547
+ 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>;
1898
2548
  }
1899
2549
 
1900
2550
  /** Accent colour for a metric tile. */
@@ -1935,6 +2585,37 @@ declare class StrctMetricTile {
1935
2585
  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>;
1936
2586
  }
1937
2587
 
2588
+ /**
2589
+ * Page-level status summary banner: a tone-colored surface with a leading icon
2590
+ * chip, a heading, a description, and optional right-aligned metadata / actions.
2591
+ *
2592
+ * Distinct from `StrctAlert` (a dismissible inline notification) and
2593
+ * `StrctSignpost` (a popover). Use it for the prominent "Protected", "All systems
2594
+ * healthy", "Clock synchronized" summaries apps otherwise hand-roll.
2595
+ *
2596
+ * <strct-hero status="success" icon="shield" heading="High availability is on">
2597
+ * The standby node can take over if this one fails.
2598
+ * <div strctHeroMeta><strct-badge status="success">HA ON</strct-badge></div>
2599
+ * <div strctHeroActions>
2600
+ * <button strct-button size="sm">Switch over</button>
2601
+ * </div>
2602
+ * </strct-hero>
2603
+ */
2604
+ declare class StrctHero {
2605
+ /** Tone: drives the left rail + icon chip color. */
2606
+ readonly status: _angular_core.InputSignal<StrctStatus>;
2607
+ /** Leading icon name (StrctIcon set). Falls back to a per-status default. */
2608
+ readonly icon: _angular_core.InputSignal<string>;
2609
+ /** The headline; exposed as the banner's accessible name. */
2610
+ readonly heading: _angular_core.InputSignal<string>;
2611
+ /** Tighter padding for secondary placements. */
2612
+ readonly dense: _angular_core.InputSignalWithTransform<boolean, unknown>;
2613
+ protected readonly headingId: string;
2614
+ protected readonly resolvedIcon: _angular_core.Signal<string>;
2615
+ static ɵfac: _angular_core.ɵɵFactoryDeclaration<StrctHero, never>;
2616
+ 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>;
2617
+ }
2618
+
1938
2619
  /** Alert visual types. */
1939
2620
  type StrctAlertType = 'info' | 'success' | 'warning' | 'critical';
1940
2621
  /** Inline contextual banner. `<strct-alert type="warning">…</strct-alert>`. */
@@ -1943,11 +2624,13 @@ declare class StrctAlert {
1943
2624
  readonly type: _angular_core.InputSignal<StrctAlertType>;
1944
2625
  /** Show a dismiss button. */
1945
2626
  readonly closable: _angular_core.InputSignalWithTransform<boolean, unknown>;
2627
+ /** Accessible label of the dismiss button (localizable). */
2628
+ readonly dismissLabel: _angular_core.InputSignal<string>;
1946
2629
  /** Emitted when the alert is dismissed. */
1947
2630
  readonly closed: _angular_core.OutputEmitterRef<void>;
1948
2631
  protected readonly icon: _angular_core.Signal<"info" | "success" | "warning" | "critical">;
1949
2632
  static ɵfac: _angular_core.ɵɵFactoryDeclaration<StrctAlert, never>;
1950
- 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>;
2633
+ 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>;
1951
2634
  }
1952
2635
 
1953
2636
  /** Tooltip placement relative to the host element. */
@@ -2033,10 +2716,12 @@ declare class StrctToastService {
2033
2716
  }
2034
2717
  /** Renders the toast stack. Place once, typically just inside the app shell. */
2035
2718
  declare class StrctToastOutlet {
2719
+ /** Accessible name of the notifications region (localizable). */
2720
+ readonly regionLabel: _angular_core.InputSignal<string>;
2036
2721
  protected readonly service: StrctToastService;
2037
2722
  protected icon(type: StrctToastType): string;
2038
2723
  static ɵfac: _angular_core.ɵɵFactoryDeclaration<StrctToastOutlet, never>;
2039
- static ɵcmp: _angular_core.ɵɵComponentDeclaration<StrctToastOutlet, "strct-toast-outlet", never, {}, {}, never, never, true, never>;
2724
+ static ɵcmp: _angular_core.ɵɵComponentDeclaration<StrctToastOutlet, "strct-toast-outlet", never, { "regionLabel": { "alias": "regionLabel"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
2040
2725
  }
2041
2726
 
2042
2727
  /** Preset zero/permission/error states with a sensible icon + tone. */
@@ -2065,5 +2750,5 @@ declare class StrctEmptyState {
2065
2750
  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>;
2066
2751
  }
2067
2752
 
2068
- 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 };
2069
- 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 };
2753
+ 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 };
2754
+ 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 };