@foxeltech/angular-ui 0.3.1 → 0.7.44

package/types/foxeltech-angular-ui.d.ts

@@ -1,46 +1,21 @@
-import * as i0 from '@angular/core';
-import { OnDestroy, Injector, DestroyRef, ApplicationRef, OnInit, AfterViewInit, ChangeDetectorRef, Type, EventEmitter, Provider, ModuleWithProviders, TemplateRef, ViewContainerRef, ElementRef, RendererFactory2, OnChanges, SimpleChanges, AfterContentInit, QueryList, Renderer2, NgZone } from '@angular/core';
+import * as _angular_core from '@angular/core';
+import { OnDestroy, Injector, DestroyRef, ApplicationRef, OnInit, AfterViewInit, ChangeDetectorRef, Type, EventEmitter, Provider, ModuleWithProviders, TemplateRef, ViewContainerRef, ElementRef, RendererFactory2, OnChanges, SimpleChanges, AfterContentInit, AfterViewChecked, Renderer2, InjectionToken, QueryList, NgZone } from '@angular/core';
 import * as _foxeltech_angular_ui from '@foxeltech/angular-ui';
-import * as i53 from '@angular/material/paginator';
-import { MatPaginator } from '@angular/material/paginator';
-import * as i54 from '@angular/material/table';
+import { MatDialog, MatDialogRef, MatDialogConfig } from '@angular/material/dialog';
+import { MatPaginator, PageEvent } from '@angular/material/paginator';
 import { MatTableDataSource, MatTable } from '@angular/material/table';
 import { HttpClient, HttpEvent, HttpErrorResponse, HttpInterceptor, HttpRequest, HttpHandler } from '@angular/common/http';
 import * as rxjs from 'rxjs';
 import { Observable, Subject } from 'rxjs';
-import * as i40 from '@angular/forms';
-import { NgForm, ValidationErrors, NgControl, ControlValueAccessor } from '@angular/forms';
-import * as i56 from '@angular/material/dialog';
-import { MatDialogRef, MatDialog } from '@angular/material/dialog';
-import * as i41 from '@angular/router';
+import * as i1$1 from '@angular/forms';
+import { NgForm, ValidationErrors, ControlValueAccessor, NgControl } from '@angular/forms';
+import * as i2 from '@angular/router';
 import { ActivatedRouteSnapshot, RouterStateSnapshot, ResolveFn, CanActivate, Router } from '@angular/router';
 import { TranslateHttpLoader } from '@ngx-translate/http-loader';
 import * as i1 from '@ngx-translate/core';
 import { TranslateService } from '@ngx-translate/core';
-import { EChartsOption, ECharts } from 'echarts';
-import * as i47 from 'ngx-vflow';
-import { Node, Edge, Connection } from 'ngx-vflow';
-import * as i66 from '@angular/cdk/drag-drop';
+import { ComponentType } from '@angular/cdk/portal';
 import { CdkDragDrop } from '@angular/cdk/drag-drop';
-import * as i39 from '@angular/common';
-import * as i42 from '@danielmoncada/angular-datetime-picker';
-import * as i43 from '@danielmoncada/angular-datetime-picker-moment-adapter';
-import * as i46 from '@dimaslz/ng-heroicons';
-import * as i48 from 'ngx-echarts';
-import * as i49 from '@angular/material/select';
-import * as i50 from '@angular/material/radio';
-import * as i51 from '@angular/material/button';
-import * as i52 from '@angular/material/icon';
-import * as i55 from '@angular/material/snack-bar';
-import * as i57 from '@angular/material/checkbox';
-import * as i58 from '@angular/material/card';
-import * as i59 from '@angular/material/datepicker';
-import * as i60 from '@angular/material/timepicker';
-import * as i61 from '@angular/material/badge';
-import * as i62 from '@angular/material/expansion';
-import * as i63 from '@angular/material/form-field';
-import * as i64 from '@angular/material/menu';
-import * as i65 from '@angular/material/tooltip';
 
 declare abstract class BaseComponent implements OnDestroy {
     protected injector: Injector;
@@ -48,8 +23,8 @@ declare abstract class BaseComponent implements OnDestroy {
     protected destroyRef: DestroyRef;
     constructor(injector?: Injector);
     ngOnDestroy(): void;
-    static ɵfac: i0.ɵɵFactoryDeclaration<BaseComponent, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<BaseComponent, never, never, {}, {}, never, never, true, never>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<BaseComponent, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<BaseComponent, never, never, {}, {}, never, never, true, never>;
 }
 
 declare class HttpWrapper {
@@ -103,26 +78,45 @@ declare class FxToastrService {
     error(message: string, title?: string): void;
     info(message: string, title?: string): void;
     warning(message: string, title?: string): void;
-    static ɵfac: i0.ɵɵFactoryDeclaration<FxToastrService, never>;
-    static ɵprov: i0.ɵɵInjectableDeclaration<FxToastrService>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<FxToastrService, never>;
+    static ɵprov: _angular_core.ɵɵInjectableDeclaration<FxToastrService>;
 }
 
 interface TableResult<T> {
     data: T[];
     total: number;
 }
+/**
+ * Filter bag for BaseTable screens. The platform-wide keys are declared so
+ * templates keep dot access under noPropertyAccessFromIndexSignature;
+ * screen-specific keys ride on the index signature (bracket access).
+ */
+interface FxTableFilters {
+    keyword?: string;
+    status?: string;
+    statuses?: string[];
+    severity?: string;
+    riskLevel?: string;
+    priority?: string;
+    category?: string;
+    integrityLevel?: string;
+    tags?: string[];
+    name?: string;
+    groupId?: string;
+    [key: string]: any;
+}
 declare class BaseTableComponent<T = any> extends BaseComponent implements OnInit, AfterViewInit {
     api: HttpWrapper;
-    modal: any;
+    modal: MatDialog;
     ref: ChangeDetectorRef;
     dataSource: MatTableDataSource<T, MatPaginator>;
     cols: string[];
     total: number;
     page: number;
     pageSize: number;
-    filters: any;
+    filters: FxTableFilters;
     loading: boolean;
-    expandedElement: any | null;
+    expandedElement: T | null;
     toastr: FxToastrService;
     _lock: boolean;
     keywordChange$: Subject<string>;
@@ -164,8 +158,8 @@ declare class BaseTableComponent<T = any> extends BaseComponent implements OnIni
         };
     };
     paginator: MatPaginator;
-    table: MatTable<T>;
-    constructor(injector: Injector, api: HttpWrapper, modal: any, ref: ChangeDetectorRef);
+    readonly table: _angular_core.Signal<MatTable<any>>;
+    constructor(injector: Injector, api: HttpWrapper, modal: MatDialog, ref: ChangeDetectorRef);
     ngOnInit(): void;
     init(): void;
     ngAfterViewInit(): void;
@@ -186,22 +180,22 @@ declare class BaseTableComponent<T = any> extends BaseComponent implements OnIni
     setDataSource(result: any): void;
     private _fetchSeq;
     fetch(): Promise<void>;
-    onPageChange(event: any): Promise<void>;
+    onPageChange(event: PageEvent): Promise<void>;
     resolve(): {};
     empty(): {};
     onKeywordChange(keyword: string): void;
     create(): Promise<void>;
-    update(model: any): Promise<void>;
-    view(model: any): Promise<void>;
-    delete(model: any): Promise<void>;
-    remove(model: any): Promise<any>;
+    update(model: T): Promise<void>;
+    view(model: T): Promise<void>;
+    delete(model: T): Promise<void>;
+    remove(model: T): Promise<any>;
     tagClass(tag: string): _foxeltech_angular_ui.TagType;
     capitalize(label: string): string;
     value(model: any, key: string, defaultValue?: any): any;
     toggleExpand(element: any): void;
     updateStatus(params: any): Promise<void>;
-    static ɵfac: i0.ɵɵFactoryDeclaration<BaseTableComponent<any>, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<BaseTableComponent<any>, never, never, {}, {}, never, never, true, never>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<BaseTableComponent<any>, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<BaseTableComponent<any>, never, never, {}, {}, never, never, true, never>;
 }
 
 /**
@@ -221,10 +215,10 @@ declare class BaseMasterDetailComponent<T = any> extends BaseTableComponent<T> {
     selected: T | null;
     detailMap: Map<string, any>;
     detailLoading: Set<string>;
-    constructor(injector: Injector, api: HttpWrapper, modal: any, ref: ChangeDetectorRef);
+    constructor(injector: Injector, api: HttpWrapper, modal: MatDialog, ref: ChangeDetectorRef);
     /** Key the row id is read from. Override idOf() instead for composite ids. */
     protected idKey: string;
-    idOf(row: any): string | null;
+    idOf(row: T): string | null;
     protected detailUrl(id: string): string | null;
     /** What the detail pane shows: the fetched detail when cached, else the row. */
     get detail(): any;
@@ -234,8 +228,8 @@ declare class BaseMasterDetailComponent<T = any> extends BaseTableComponent<T> {
     autoSelectFirst(): void;
     selectItem(row: T): void;
     fetchDetail(id: string): void;
-    static ɵfac: i0.ɵɵFactoryDeclaration<BaseMasterDetailComponent<any>, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<BaseMasterDetailComponent<any>, never, never, {}, {}, never, never, true, never>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<BaseMasterDetailComponent<any>, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<BaseMasterDetailComponent<any>, never, never, {}, {}, never, never, true, never>;
 }
 
 declare class BaseDialogComponent<T = any> extends BaseComponent implements AfterViewInit, OnInit {
@@ -244,7 +238,7 @@ declare class BaseDialogComponent<T = any> extends BaseComponent implements Afte
     toastr: FxToastrService;
     api: HttpWrapper;
     dialog: MatDialog;
-    ngForm: NgForm;
+    readonly ngForm: _angular_core.Signal<NgForm | undefined>;
     method: string;
     title: string;
     model: any;
@@ -263,8 +257,8 @@ declare class BaseDialogComponent<T = any> extends BaseComponent implements Afte
     updateInfo(params?: any): Promise<void>;
     cancel(): void;
     validate(): boolean;
-    static ɵfac: i0.ɵɵFactoryDeclaration<BaseDialogComponent<any>, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<BaseDialogComponent<any>, never, never, {}, {}, never, never, true, never>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<BaseDialogComponent<any>, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<BaseDialogComponent<any>, never, never, {}, {}, never, never, true, never>;
 }
 
 declare class FxLoadingService {
@@ -274,8 +268,8 @@ declare class FxLoadingService {
     stop(): void;
     startAction(): void;
     stopAction(): void;
-    static ɵfac: i0.ɵɵFactoryDeclaration<FxLoadingService, never>;
-    static ɵprov: i0.ɵɵInjectableDeclaration<FxLoadingService>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<FxLoadingService, never>;
+    static ɵprov: _angular_core.ɵɵInjectableDeclaration<FxLoadingService>;
 }
 
 declare class BaseResolver {
@@ -402,8 +396,8 @@ declare class NotificationService {
      * Get connection ID
      */
     getConnectionId(): string | null;
-    static ɵfac: i0.ɵɵFactoryDeclaration<NotificationService, never>;
-    static ɵprov: i0.ɵɵInjectableDeclaration<NotificationService>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<NotificationService, never>;
+    static ɵprov: _angular_core.ɵɵInjectableDeclaration<NotificationService>;
 }
 
 interface RealtimeTableEvent<T> {
@@ -482,6 +476,14 @@ declare class RealtimeTableSync<T = any> {
 }
 
 declare class FxUtils {
+    /** Dot-path accessor (lodash _.get replacement — supports 'a.b.c'). */
+    static get(obj: any, path: string, defaultValue?: any): any;
+    /** Dot-path setter (lodash _.set replacement — creates missing objects). */
+    static set(obj: any, path: string, value: any): any;
+    /** Structural equality (lodash _.isEqual replacement for plain data). */
+    static deepEqual(a: any, b: any): boolean;
+    /** Deep clone for plain data (objects/arrays/Date); functions stay by reference. */
+    static cloneDeep<T>(v: T): T;
     private static preresolve;
     static resolve(value: object): Promise<{}>;
     static isNotNull(obj: any): boolean;
@@ -507,6 +509,14 @@ declare class FxUtils {
     static convertColorFromVariable(name: string, alpha?: number, options?: {
         legacyCommaSyntax?: boolean;
     }): string;
+    /**
+     * Status/severity string → tag tone.
+     *
+     * Coerces instead of trusting the argument: every caller feeds this raw API
+     * values, and a numeric or null field used to throw
+     * "key.toLowerCase is not a function" and take the whole screen down.
+     * Non-string input simply falls through to the default tone.
+     */
     static getTagClass(key: string, isCriticalExist?: boolean): TagType;
     static validateEmail(value: string): boolean;
     /** Safe deep accessor with the org-wide empty placeholder. */
@@ -578,6 +588,25 @@ declare function toneBadge(tone: Tone | null): string;
  */
 declare function toneColor(tone: Tone | null, alpha?: number): string;
 
+/**
+ * Feature gating for the V2 rollout.
+ *
+ * Each app owns its own `environment.features` block, so the flags are passed
+ * in rather than read here — the library has no environment of its own.
+ *
+ *   readonly knowledge = featureEnabled(environment.features, 'knowledge');
+ *
+ * Why a helper instead of `environment.features?.x`: call sites were drifting
+ * between truthy checks and `=== true`, some behind an `as any` cast that hides
+ * a typo in the flag name. One function keeps the semantics identical
+ * everywhere — a flag counts as on only when it is exactly `true`, so a missing
+ * block, a missing key or a stale string value all read as off.
+ */
+type FxFeatureFlags = Record<string, boolean | undefined> | undefined | null;
+declare function featureEnabled(flags: FxFeatureFlags, name: string): boolean;
+/** Convenience for templates that gate on several flags at once. */
+declare function anyFeatureEnabled(flags: FxFeatureFlags, ...names: string[]): boolean;
+
 declare class FxValidators {
     /**
      * Name fields: firstName, lastName, groupName, projectName, displayName
@@ -639,9 +668,9 @@ declare function HttpLoaderFactory(http: HttpClient): TranslateHttpLoader;
 declare class TranslationModule {
     static forRoot(): ModuleWithProviders<TranslationModule>;
     static forChild(): ModuleWithProviders<TranslationModule>;
-    static ɵfac: i0.ɵɵFactoryDeclaration<TranslationModule, never>;
-    static ɵmod: i0.ɵɵNgModuleDeclaration<TranslationModule, never, [typeof i1.TranslateModule], [typeof i1.TranslateModule]>;
-    static ɵinj: i0.ɵɵInjectorDeclaration<TranslationModule>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<TranslationModule, never>;
+    static ɵmod: _angular_core.ɵɵNgModuleDeclaration<TranslationModule, never, [typeof i1.TranslateModule], [typeof i1.TranslateModule]>;
+    static ɵinj: _angular_core.ɵɵInjectorDeclaration<TranslationModule>;
 }
 
 declare class TranslationService {
@@ -655,8 +684,8 @@ declare class TranslationService {
     setLanguage(lang: string): void;
     loadTranslations(lang: string, path: string): void;
     onLanguageChange(callback: (lang: string) => void): void;
-    static ɵfac: i0.ɵɵFactoryDeclaration<TranslationService, never>;
-    static ɵprov: i0.ɵɵInjectableDeclaration<TranslationService>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<TranslationService, never>;
+    static ɵprov: _angular_core.ɵɵInjectableDeclaration<TranslationService>;
 }
 
 declare class PermissionService {
@@ -664,8 +693,8 @@ declare class PermissionService {
     setPermissions(perms: string[]): void;
     hasPermission(requiredPermissions: string[]): boolean;
     getPermissions(): string[];
-    static ɵfac: i0.ɵɵFactoryDeclaration<PermissionService, never>;
-    static ɵprov: i0.ɵɵInjectableDeclaration<PermissionService>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<PermissionService, never>;
+    static ɵprov: _angular_core.ɵɵInjectableDeclaration<PermissionService>;
 }
 
 declare class HasPermissionDirective {
@@ -674,18 +703,18 @@ declare class HasPermissionDirective {
     private permissionService;
     constructor(templateRef: TemplateRef<any>, viewContainerRef: ViewContainerRef, permissionService: PermissionService);
     set hasPermission(required: string | string[]);
-    static ɵfac: i0.ɵɵFactoryDeclaration<HasPermissionDirective, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<HasPermissionDirective, "[hasPermission]", never, { "hasPermission": { "alias": "hasPermission"; "required": false; }; }, {}, never, never, true, never>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<HasPermissionDirective, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<HasPermissionDirective, "[hasPermission]", never, { "hasPermission": { "alias": "hasPermission"; "required": false; }; }, {}, never, never, true, never>;
 }
 
 declare class TrimOnBlurDirective {
     private el;
+    readonly collapseWhitespace: _angular_core.InputSignal<boolean>;
     private ngControl;
-    collapseWhitespace: boolean;
-    constructor(el: ElementRef<HTMLInputElement>, ngControl: NgControl);
+    constructor(el: ElementRef<HTMLInputElement>);
     onBlur(): void;
-    static ɵfac: i0.ɵɵFactoryDeclaration<TrimOnBlurDirective, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<TrimOnBlurDirective, "[appTrimOnBlur]", never, { "collapseWhitespace": { "alias": "appTrimOnBlurCollapse"; "required": false; }; }, {}, never, never, true, never>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<TrimOnBlurDirective, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<TrimOnBlurDirective, "[appTrimOnBlur]", never, { "collapseWhitespace": { "alias": "appTrimOnBlurCollapse"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
 }
 
 declare class PermissionGuard implements CanActivate {
@@ -693,15 +722,15 @@ declare class PermissionGuard implements CanActivate {
     private router;
     constructor(permissionService: PermissionService, router: Router);
     canActivate(route: any): boolean;
-    static ɵfac: i0.ɵɵFactoryDeclaration<PermissionGuard, never>;
-    static ɵprov: i0.ɵɵInjectableDeclaration<PermissionGuard>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<PermissionGuard, never>;
+    static ɵprov: _angular_core.ɵɵInjectableDeclaration<PermissionGuard>;
 }
 
 declare class FxStorageService {
     resolve(key: string, value?: any): any;
     remove(key: string): void;
-    static ɵfac: i0.ɵɵFactoryDeclaration<FxStorageService, never>;
-    static ɵprov: i0.ɵɵInjectableDeclaration<FxStorageService>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<FxStorageService, never>;
+    static ɵprov: _angular_core.ɵɵInjectableDeclaration<FxStorageService>;
 }
 
 declare class AuthStateService {
@@ -712,8 +741,8 @@ declare class AuthStateService {
     setLoggedIn(value: boolean): void;
     get isLoggedIn(): boolean;
     handleUnauthorized(): void;
-    static ɵfac: i0.ɵɵFactoryDeclaration<AuthStateService, never>;
-    static ɵprov: i0.ɵɵInjectableDeclaration<AuthStateService>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<AuthStateService, never>;
+    static ɵprov: _angular_core.ɵɵInjectableDeclaration<AuthStateService>;
 }
 
 declare class AuthInterceptor implements HttpInterceptor {
@@ -721,8 +750,8 @@ declare class AuthInterceptor implements HttpInterceptor {
     private handlingUnauthorized;
     constructor(authState: AuthStateService);
     intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>>;
-    static ɵfac: i0.ɵɵFactoryDeclaration<AuthInterceptor, never>;
-    static ɵprov: i0.ɵɵInjectableDeclaration<AuthInterceptor>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<AuthInterceptor, never>;
+    static ɵprov: _angular_core.ɵɵInjectableDeclaration<AuthInterceptor>;
 }
 
 interface Breadcrumb {
@@ -735,38 +764,81 @@ declare class BreadcrumbService {
     set(breadcrumbs: Breadcrumb[]): void;
     get(): rxjs.Observable<Breadcrumb[]>;
     clear(): void;
-    static ɵfac: i0.ɵɵFactoryDeclaration<BreadcrumbService, never>;
-    static ɵprov: i0.ɵɵInjectableDeclaration<BreadcrumbService>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<BreadcrumbService, never>;
+    static ɵprov: _angular_core.ɵɵInjectableDeclaration<BreadcrumbService>;
 }
 
-declare class QuillStyleLoaderService {
-    private platformId;
-    private loaded;
-    private loadingPromise;
-    constructor(platformId: object);
-    /**
-     * Load Quill CSS (only in browser). Returns a promise that resolves when
-     * the CSS links have been appended.
-     */
-    load(): Promise<void>;
-    static ɵfac: i0.ɵɵFactoryDeclaration<QuillStyleLoaderService, never>;
-    static ɵprov: i0.ɵɵInjectableDeclaration<QuillStyleLoaderService>;
+/** The six OgeniumDashboards themes. */
+type OgTheme = 'porcelain' | 'charcoal' | 'ivory' | 'studio' | 'blueprint' | 'terminal';
+declare const OG_THEMES: readonly OgTheme[];
+declare const OG_LIGHT_THEMES: readonly OgTheme[];
+/** Display metadata for theme pickers — accent/page swatches are brand constants. */
+interface OgThemeMeta {
+    name: OgTheme;
+    label: string;
+    accent: string;
+    pageBg: string;
+    dark: boolean;
 }
-
+declare const OG_THEME_META: readonly OgThemeMeta[];
+/**
+ * Theme NGƯỜI DÙNG được chọn (anh Tú chốt 31/08): chỉ còn một cặp
+ * light/dark. Bốn theme còn lại vẫn tồn tại đầy đủ trong theme.css và
+ * setTheme() vẫn nhận — chúng dùng cho trang /themes của demo và cho
+ * harness screenshot chạy ma trận 6 theme; chỉ **giấu khỏi picker**.
+ * Muốn mở lại: thêm tên vào mảng này, không phải dựng lại token.
+ */
+declare const OG_PICKER_THEMES: readonly OgTheme[];
+/** OG_THEME_META đã lọc theo OG_PICKER_THEMES — nguồn duy nhất cho mọi picker. */
+declare const OG_PICKER_THEME_META: readonly OgThemeMeta[];
+/**
+ * V2 theme switching: one `data-og-theme` attribute on <html> selects the
+ * --og-* token block (theme.css). During the migration window the service
+ * also mirrors the legacy `light_theme` class on <body> so remotes built
+ * against the pre-V2 stylesheet keep resolving the correct palette
+ * (see the SKEW SHIELD note in theme.css).
+ */
 declare class ThemeService {
     private renderer;
     private lightClass;
     private theme$;
     themeStorageKey: string;
     constructor(rendererFactory: RendererFactory2);
+    /** Primary API: activate one of the six V2 themes. */
+    setTheme(theme: OgTheme): void;
+    themeChanges(): Observable<OgTheme>;
+    getCurrentTheme(): OgTheme;
+    isLight(): boolean;
+    /** @deprecated V2: use setTheme(). Maps light→porcelain, dark→charcoal. */
     setLightMode(enable: boolean): void;
+    /** @deprecated V2: use setTheme(). Flips between the two default themes. */
     toggleTheme(): void;
-    themeChanges(): rxjs.Observable<"light" | "dark">;
-    getCurrentTheme(): 'light' | 'dark';
-    isLight(): boolean;
     getLogoPath(): string;
-    static ɵfac: i0.ɵɵFactoryDeclaration<ThemeService, never>;
-    static ɵprov: i0.ɵɵInjectableDeclaration<ThemeService>;
+    private isLightTheme;
+    private readSavedTheme;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<ThemeService, never>;
+    static ɵprov: _angular_core.ɵɵInjectableDeclaration<ThemeService>;
+}
+
+interface FxConfirmOptions {
+    title?: string;
+    message?: string;
+    confirmLabel?: string;
+    cancelLabel?: string;
+}
+/**
+ * Thin façade over MatDialog so app code never imports @angular/material
+ * directly (behavior-layer rule, Playbook §5.1). Same semantics — the
+ * returned ref is the Material one, typed through this service.
+ */
+declare class FxDialogService {
+    private dialog;
+    open<T, D = any, R = any>(component: ComponentType<T> | TemplateRef<T>, config?: MatDialogConfig<D>): MatDialogRef<T, R>;
+    /** Standard confirmation flow — resolves true when the user confirms. */
+    confirm(options?: FxConfirmOptions): Promise<boolean>;
+    closeAll(): void;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<FxDialogService, never>;
+    static ɵprov: _angular_core.ɵɵInjectableDeclaration<FxDialogService>;
 }
 
 type ErrorMessages = Record<string, any>;
@@ -778,6 +850,9 @@ declare abstract class FxComponent<T> implements ControlValueAccessor {
      * bind to an ancestor's NgControl.
      */
     ngControl: NgControl | null;
+    /** With OnPush, programmatic writes (form.setValue / setDisabledState) must
+     *  mark the view — CVA calls come from outside the component's own events. */
+    protected cdr: ChangeDetectorRef;
     disabled: boolean;
     value: T;
     onChange: (value: T) => void;
@@ -802,8 +877,8 @@ declare abstract class FxComponent<T> implements ControlValueAccessor {
      */
     clearErrors(): void;
     getErrorMessage(label?: string): string | null;
-    static ɵfac: i0.ɵɵFactoryDeclaration<FxComponent<any>, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<FxComponent<any>, never, never, { "disabled": { "alias": "disabled"; "required": false; }; }, {}, never, never, true, never>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<FxComponent<any>, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<FxComponent<any>, never, never, { "disabled": { "alias": "disabled"; "required": false; }; }, {}, never, never, true, never>;
 }
 
 declare class InputComponent extends FxComponent<string> implements AfterViewInit {
@@ -811,18 +886,18 @@ declare class InputComponent extends FxComponent<string> implements AfterViewIni
     label: string;
     tooltip: string;
     type: string;
-    placeholder: string;
+    readonly placeholder: _angular_core.InputSignal<string>;
     errorMessages: Record<string, string>;
-    required: string | boolean;
+    readonly required: _angular_core.InputSignal<string | boolean>;
     suffixIcon?: string;
-    class?: any;
-    maxlength?: number;
-    validateFn?: (value: string) => ValidationErrors | null;
-    blurred: EventEmitter<void>;
-    focused: EventEmitter<void>;
-    suffixClick: EventEmitter<void>;
+    readonly class: _angular_core.InputSignal<any>;
+    readonly maxlength: _angular_core.InputSignal<number | undefined>;
+    readonly validateFn: _angular_core.InputSignal<((value: string) => ValidationErrors | null) | undefined>;
+    readonly blurred: _angular_core.OutputEmitterRef<void>;
+    readonly focused: _angular_core.OutputEmitterRef<void>;
+    readonly suffixClick: _angular_core.OutputEmitterRef<void>;
     /** Accessible name for the suffix icon button (it renders no text). */
-    suffixAriaLabel: string;
+    readonly suffixAriaLabel: _angular_core.InputSignal<string>;
     readonly fieldId: string;
     showPassword: boolean;
     validateError: ValidationErrors | null;
@@ -835,30 +910,30 @@ declare class InputComponent extends FxComponent<string> implements AfterViewIni
     togglePassword(): void;
     onSuffixClick(): void;
     get displayType(): string;
-    static ɵfac: i0.ɵɵFactoryDeclaration<InputComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<InputComponent, "fx-ui-input", never, { "label": { "alias": "label"; "required": false; }; "tooltip": { "alias": "tooltip"; "required": false; }; "type": { "alias": "type"; "required": false; }; "placeholder": { "alias": "placeholder"; "required": false; }; "errorMessages": { "alias": "errorMessages"; "required": false; }; "required": { "alias": "required"; "required": false; }; "suffixIcon": { "alias": "suffixIcon"; "required": false; }; "class": { "alias": "class"; "required": false; }; "maxlength": { "alias": "maxlength"; "required": false; }; "validateFn": { "alias": "validateFn"; "required": false; }; "suffixAriaLabel": { "alias": "suffixAriaLabel"; "required": false; }; }, { "blurred": "blurred"; "focused": "focused"; "suffixClick": "suffixClick"; }, never, never, false, never>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<InputComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<InputComponent, "fx-ui-input", never, { "label": { "alias": "label"; "required": false; }; "tooltip": { "alias": "tooltip"; "required": false; }; "type": { "alias": "type"; "required": false; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "errorMessages": { "alias": "errorMessages"; "required": false; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "suffixIcon": { "alias": "suffixIcon"; "required": false; }; "class": { "alias": "class"; "required": false; "isSignal": true; }; "maxlength": { "alias": "maxlength"; "required": false; "isSignal": true; }; "validateFn": { "alias": "validateFn"; "required": false; "isSignal": true; }; "suffixAriaLabel": { "alias": "suffixAriaLabel"; "required": false; "isSignal": true; }; }, { "blurred": "blurred"; "focused": "focused"; "suffixClick": "suffixClick"; }, never, never, true, never>;
 }
 
 declare class SelectComponent extends FxComponent<string | string[]> implements AfterViewInit, OnInit, OnChanges {
     private ref;
     label: string;
     tooltip: string;
-    placeholder: string;
-    options: {
+    readonly placeholder: _angular_core.InputSignal<string>;
+    readonly options: _angular_core.InputSignal<{
         label: string;
         value: string;
-    }[];
-    multiple: boolean;
+    }[]>;
+    readonly multiple: _angular_core.InputSignal<boolean>;
     errorMessages: Record<string, string>;
-    required: boolean;
-    class?: any;
-    enableSearch: boolean;
-    searchFn?: (query: string) => Promise<{
+    readonly required: _angular_core.InputSignal<boolean>;
+    readonly class: _angular_core.InputSignal<any>;
+    readonly enableSearch: _angular_core.InputSignal<boolean>;
+    readonly searchFn: _angular_core.InputSignal<((query: string) => Promise<{
         label: string;
         value: string;
-    }[]>;
+    }[]>) | undefined>;
     /** Emits the current value when the select panel closes (useful for multiple mode). */
-    closed: EventEmitter<string | string[]>;
+    readonly closed: _angular_core.OutputEmitterRef<string | string[]>;
     readonly fieldId: string;
     searchTerm: string;
     filteredOptions: {
@@ -877,8 +952,8 @@ declare class SelectComponent extends FxComponent<string | string[]> implements
     performSearch(term: string): Promise<void>;
     onSelectionChange(value: any): void;
     isSelected(value: string): boolean;
-    static ɵfac: i0.ɵɵFactoryDeclaration<SelectComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<SelectComponent, "fx-ui-select", never, { "label": { "alias": "label"; "required": false; }; "tooltip": { "alias": "tooltip"; "required": false; }; "placeholder": { "alias": "placeholder"; "required": false; }; "options": { "alias": "options"; "required": false; }; "multiple": { "alias": "multiple"; "required": false; }; "errorMessages": { "alias": "errorMessages"; "required": false; }; "required": { "alias": "required"; "required": false; }; "class": { "alias": "class"; "required": false; }; "enableSearch": { "alias": "enableSearch"; "required": false; }; "searchFn": { "alias": "searchFn"; "required": false; }; }, { "closed": "closed"; }, never, never, false, never>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<SelectComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<SelectComponent, "fx-ui-select", never, { "label": { "alias": "label"; "required": false; }; "tooltip": { "alias": "tooltip"; "required": false; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "options": { "alias": "options"; "required": false; "isSignal": true; }; "multiple": { "alias": "multiple"; "required": false; "isSignal": true; }; "errorMessages": { "alias": "errorMessages"; "required": false; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "class": { "alias": "class"; "required": false; "isSignal": true; }; "enableSearch": { "alias": "enableSearch"; "required": false; "isSignal": true; }; "searchFn": { "alias": "searchFn"; "required": false; "isSignal": true; }; }, { "closed": "closed"; }, never, never, true, never>;
 }
 
 interface IRadioButton {
@@ -892,34 +967,34 @@ declare class RadioButtonComponent extends FxComponent<IRadioButton> implements
     readonly groupId: string;
     label?: string;
     tooltip: string;
-    required?: boolean;
-    options: {
+    readonly required: _angular_core.InputSignal<boolean | undefined>;
+    readonly options: _angular_core.InputSignal<{
         label: string;
         value: any;
         icon?: any;
         tooltip?: string;
-    }[];
+    }[]>;
     errorMessages: ErrorMessages;
-    class?: any;
+    readonly class: _angular_core.InputSignal<any>;
     constructor(ref: ChangeDetectorRef);
     ngAfterViewInit(): void;
     onSelectValue(value: any): void;
-    static ɵfac: i0.ɵɵFactoryDeclaration<RadioButtonComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<RadioButtonComponent, "fx-ui-radio", never, { "label": { "alias": "label"; "required": false; }; "tooltip": { "alias": "tooltip"; "required": false; }; "required": { "alias": "required"; "required": false; }; "options": { "alias": "options"; "required": false; }; "errorMessages": { "alias": "errorMessages"; "required": false; }; "class": { "alias": "class"; "required": false; }; }, {}, never, never, false, never>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<RadioButtonComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<RadioButtonComponent, "fx-ui-radio", never, { "label": { "alias": "label"; "required": false; }; "tooltip": { "alias": "tooltip"; "required": false; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "options": { "alias": "options"; "required": false; "isSignal": true; }; "errorMessages": { "alias": "errorMessages"; "required": false; }; "class": { "alias": "class"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
 }
 
 declare class CheckboxComponent extends FxComponent<any> implements AfterViewInit {
     private ref;
     label: string;
-    rounded: boolean;
-    valueChange: EventEmitter<boolean>;
+    readonly rounded: _angular_core.InputSignal<boolean | undefined>;
+    readonly valueChange: _angular_core.OutputEmitterRef<boolean>;
     constructor(ref: ChangeDetectorRef);
     ngAfterViewInit(): void;
     writeValue(value: any): void;
     onInputChange(event: Event): void;
     markTouched(): void;
-    static ɵfac: i0.ɵɵFactoryDeclaration<CheckboxComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<CheckboxComponent, "fx-ui-checkbox", never, { "label": { "alias": "label"; "required": false; }; "rounded": { "alias": "rounded"; "required": false; }; }, { "valueChange": "valueChange"; }, never, never, false, never>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<CheckboxComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<CheckboxComponent, "fx-ui-checkbox", never, { "label": { "alias": "label"; "required": false; }; "rounded": { "alias": "rounded"; "required": false; "isSignal": true; }; }, { "valueChange": "valueChange"; }, never, never, true, never>;
 }
 
 interface UploadResult {
@@ -931,18 +1006,19 @@ interface UploadResult {
     }[];
 }
 declare class DndUploadComponent {
-    multiple: boolean;
+    private cdr;
+    readonly multiple: _angular_core.InputSignal<boolean>;
     accept: string;
-    maxSizeMB: number;
-    strictSize: boolean;
+    readonly maxSizeMB: _angular_core.InputSignal<number>;
+    readonly strictSize: _angular_core.InputSignal<boolean>;
     /** Icon name from heroicons (outline). Default: 'arrow-up-tray' */
-    icon: string;
+    readonly icon: _angular_core.InputSignal<string>;
     /** CSS color value for accent (border, icon, link). Default uses --gradient-primary-start */
-    accentColor: string;
-    fileDrop: EventEmitter<File[]>;
-    fileClick: EventEmitter<void>;
-    uploadComplete: EventEmitter<File[]>;
-    uploadError: EventEmitter<{
+    readonly accentColor: _angular_core.InputSignal<string>;
+    readonly fileDrop: _angular_core.OutputEmitterRef<File[]>;
+    readonly fileClick: _angular_core.OutputEmitterRef<void>;
+    readonly uploadComplete: _angular_core.OutputEmitterRef<File[]>;
+    readonly uploadError: _angular_core.OutputEmitterRef<{
         file: File;
         reason: string;
     }>;
@@ -957,103 +1033,137 @@ declare class DndUploadComponent {
     private processFiles;
     private onUpload;
     private isAccepted;
-    static ɵfac: i0.ɵɵFactoryDeclaration<DndUploadComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<DndUploadComponent, "fx-ui-dnd-upload", never, { "multiple": { "alias": "multiple"; "required": false; }; "accept": { "alias": "accept"; "required": false; }; "maxSizeMB": { "alias": "maxSizeMB"; "required": false; }; "strictSize": { "alias": "strictSize"; "required": false; }; "icon": { "alias": "icon"; "required": false; }; "accentColor": { "alias": "accentColor"; "required": false; }; }, { "fileDrop": "fileDrop"; "fileClick": "fileClick"; "uploadComplete": "uploadComplete"; "uploadError": "uploadError"; }, never, never, false, never>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<DndUploadComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<DndUploadComponent, "fx-ui-dnd-upload", never, { "multiple": { "alias": "multiple"; "required": false; "isSignal": true; }; "accept": { "alias": "accept"; "required": false; }; "maxSizeMB": { "alias": "maxSizeMB"; "required": false; "isSignal": true; }; "strictSize": { "alias": "strictSize"; "required": false; "isSignal": true; }; "icon": { "alias": "icon"; "required": false; "isSignal": true; }; "accentColor": { "alias": "accentColor"; "required": false; "isSignal": true; }; }, { "fileDrop": "fileDrop"; "fileClick": "fileClick"; "uploadComplete": "uploadComplete"; "uploadError": "uploadError"; }, never, never, true, never>;
 }
 
 declare class ButtonComponent {
     label: string;
-    disabled: boolean;
-    buttonVariant: 'default' | 'primary' | 'success' | 'alternative';
+    readonly disabled: _angular_core.InputSignal<boolean>;
+    readonly buttonVariant: _angular_core.InputSignal<"default" | "success" | "primary" | "alternative">;
     icon?: any;
-    class?: any;
-    loading: boolean;
+    readonly class: _angular_core.InputSignal<any>;
+    readonly loading: _angular_core.InputSignal<boolean>;
     /** Native button type. Defaults to 'button' so it never implicitly submits a form. */
-    type: 'button' | 'submit' | 'reset';
+    readonly type: _angular_core.InputSignal<"button" | "submit" | "reset">;
     /** Accessible name for icon-only usage (icon set, no label). */
-    ariaLabel: string;
-    clicked: EventEmitter<void>;
+    readonly ariaLabel: _angular_core.InputSignal<string>;
+    readonly clicked: _angular_core.OutputEmitterRef<void>;
     onClick(): void;
-    static ɵfac: i0.ɵɵFactoryDeclaration<ButtonComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<ButtonComponent, "fx-ui-button", never, { "label": { "alias": "label"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "buttonVariant": { "alias": "buttonVariant"; "required": false; }; "icon": { "alias": "icon"; "required": false; }; "class": { "alias": "class"; "required": false; }; "loading": { "alias": "loading"; "required": false; }; "type": { "alias": "type"; "required": false; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; }; }, { "clicked": "clicked"; }, never, never, false, never>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<ButtonComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<ButtonComponent, "fx-ui-button", never, { "label": { "alias": "label"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "buttonVariant": { "alias": "buttonVariant"; "required": false; "isSignal": true; }; "icon": { "alias": "icon"; "required": false; }; "class": { "alias": "class"; "required": false; "isSignal": true; }; "loading": { "alias": "loading"; "required": false; "isSignal": true; }; "type": { "alias": "type"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; }, { "clicked": "clicked"; }, never, never, true, never>;
 }
 
 declare class RadioButtonToggleComponent extends FxComponent<any> implements AfterViewInit {
     private ref;
     readonly groupId: string;
     label?: string;
-    required?: boolean;
-    options: {
+    readonly required: _angular_core.InputSignal<boolean | undefined>;
+    readonly options: _angular_core.InputSignal<{
         label: string;
         value: any;
         icon?: any;
-    }[];
+    }[]>;
     errorMessages: ErrorMessages;
-    class?: any;
+    readonly class: _angular_core.InputSignal<any>;
     constructor(ref: ChangeDetectorRef);
     ngAfterViewInit(): void;
     onSelectValue(value: any): void;
-    static ɵfac: i0.ɵɵFactoryDeclaration<RadioButtonToggleComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<RadioButtonToggleComponent, "fx-ui-radio-toggle, [fx-ui-radio-toggle]", never, { "label": { "alias": "label"; "required": false; }; "required": { "alias": "required"; "required": false; }; "options": { "alias": "options"; "required": false; }; "errorMessages": { "alias": "errorMessages"; "required": false; }; "class": { "alias": "class"; "required": false; }; }, {}, never, never, false, never>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<RadioButtonToggleComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<RadioButtonToggleComponent, "fx-ui-radio-toggle, [fx-ui-radio-toggle]", never, { "label": { "alias": "label"; "required": false; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "options": { "alias": "options"; "required": false; "isSignal": true; }; "errorMessages": { "alias": "errorMessages"; "required": false; }; "class": { "alias": "class"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
 }
 
+/**
+ * Date/time field backed by first-party Material pickers (mat-datepicker +
+ * mat-timepicker, the latter first-party since Material 19) — replaces the
+ * former @danielmoncada/angular-datetime-picker + moment adapter stack.
+ *
+ * The public contract is unchanged: the CVA value is a plain string
+ * ('YYYY-MM-DD HH:mm' for type 'both', 'YYYY-MM-DD' for 'calendar',
+ * 'HH:mm' for 'timer'), so existing forms keep working as-is.
+ */
 declare class DatetimePicker extends FxComponent<any> implements AfterViewInit {
     private ref;
     label?: string;
-    placeholder: string;
-    required: boolean;
-    type: any;
-    minDate?: any;
-    maxDate?: any;
+    readonly placeholder: _angular_core.InputSignal<string>;
+    readonly required: _angular_core.InputSignal<boolean>;
+    /** 'both' | 'calendar' | 'timer' — same values the Owl picker accepted. */
+    readonly type: _angular_core.InputSignal<"both" | "calendar" | "timer">;
+    readonly minDate: _angular_core.InputSignal<any>;
+    readonly maxDate: _angular_core.InputSignal<any>;
     errorMessages: ErrorMessages;
-    validateFn: (date: string) => ValidationErrors | null;
+    readonly validateFn: _angular_core.InputSignal<((date: string) => ValidationErrors | null) | undefined>;
     readonly fieldId: string;
-    startAt: any;
+    /** Internal Date the Material pickers operate on; `value` stays a string. */
+    dateValue: Date | null;
     constructor(ref: ChangeDetectorRef);
     ngAfterViewInit(): void;
+    get showDate(): boolean;
+    get showTime(): boolean;
+    get min(): Date | null;
+    get max(): Date | null;
     onBlur(): void;
     writeValue(value: any): void;
-    onValueChange(date: any): void;
-    static ɵfac: i0.ɵɵFactoryDeclaration<DatetimePicker, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<DatetimePicker, "fx-ui-datetime-picker", never, { "label": { "alias": "label"; "required": false; }; "placeholder": { "alias": "placeholder"; "required": false; }; "required": { "alias": "required"; "required": false; }; "type": { "alias": "type"; "required": false; }; "minDate": { "alias": "minDate"; "required": false; }; "maxDate": { "alias": "maxDate"; "required": false; }; "errorMessages": { "alias": "errorMessages"; "required": false; }; "validateFn": { "alias": "validateFn"; "required": false; }; }, {}, never, never, false, never>;
+    onDateChange(date: Date | null): void;
+    onTimeChange(time: Date | null): void;
+    private commit;
+    private toDate;
+    private format;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<DatetimePicker, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<DatetimePicker, "fx-ui-datetime-picker", never, { "label": { "alias": "label"; "required": false; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "type": { "alias": "type"; "required": false; "isSignal": true; }; "minDate": { "alias": "minDate"; "required": false; "isSignal": true; }; "maxDate": { "alias": "maxDate"; "required": false; "isSignal": true; }; "errorMessages": { "alias": "errorMessages"; "required": false; }; "validateFn": { "alias": "validateFn"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
 }
 
 declare class LoadingPanel {
-    show: boolean;
+    readonly show: _angular_core.InputSignal<boolean>;
     message?: string;
-    static ɵfac: i0.ɵɵFactoryDeclaration<LoadingPanel, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<LoadingPanel, "fx-ui-loading-panel", never, { "show": { "alias": "show"; "required": false; }; "message": { "alias": "message"; "required": false; }; }, {}, never, never, false, never>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<LoadingPanel, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<LoadingPanel, "fx-ui-loading-panel", never, { "show": { "alias": "show"; "required": false; "isSignal": true; }; "message": { "alias": "message"; "required": false; }; }, {}, never, never, true, never>;
 }
 
 declare class SearchBarComponent extends FxComponent<string> implements AfterViewInit {
     private ref;
-    placeholder: string;
-    search: EventEmitter<string>;
-    valueChange: EventEmitter<string>;
+    /** FxComponent leaves `value` undefined; without ngModel the input would
+        render the literal string "undefined". */
+    value: string;
+    readonly placeholder: _angular_core.InputSignal<string>;
+    readonly search: _angular_core.OutputEmitterRef<string>;
+    readonly valueChange: _angular_core.OutputEmitterRef<string>;
     constructor(ref: ChangeDetectorRef);
     ngAfterViewInit(): void;
     writeValue(value: string): void;
     onValueChange(value: string): void;
     onEnterKey(): void;
     clear(): void;
-    static ɵfac: i0.ɵɵFactoryDeclaration<SearchBarComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<SearchBarComponent, "fx-ui-search-bar", never, { "placeholder": { "alias": "placeholder"; "required": false; }; }, { "search": "search"; "valueChange": "valueChange"; }, never, never, false, never>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<SearchBarComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<SearchBarComponent, "fx-ui-search-bar", never, { "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; }, { "search": "search"; "valueChange": "valueChange"; }, never, never, true, never>;
 }
 
 declare class TabComponent {
-    label: string;
+    readonly label: _angular_core.InputSignal<string>;
     icon?: string;
-    content: TemplateRef<any>;
-    static ɵfac: i0.ɵɵFactoryDeclaration<TabComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<TabComponent, "fx-ui-tab", never, { "label": { "alias": "label"; "required": false; }; "icon": { "alias": "icon"; "required": false; }; }, {}, never, ["*"], false, never>;
+    /** Trailing count badge (V2 'page' variant); null/undefined hides it. */
+    readonly count: _angular_core.InputSignal<number | null>;
+    /** Tints the count badge (e.g. vulnerabilities tab shows a danger count). */
+    readonly tone: _angular_core.InputSignal<Tone | null>;
+    readonly content: _angular_core.Signal<TemplateRef<any>>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<TabComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<TabComponent, "fx-ui-tab", never, { "label": { "alias": "label"; "required": true; "isSignal": true; }; "icon": { "alias": "icon"; "required": false; }; "count": { "alias": "count"; "required": false; "isSignal": true; }; "tone": { "alias": "tone"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
 }
 
-declare class TabGroupComponent implements AfterContentInit {
+declare class TabGroupComponent implements AfterContentInit, AfterViewChecked, OnChanges {
     private renderer;
-    tabs: QueryList<TabComponent>;
+    private cdr;
+    readonly tabs: _angular_core.Signal<readonly TabComponent[]>;
     activeIndex: number;
-    tabListRef: ElementRef<HTMLElement>;
-    underlineRef: ElementRef<HTMLElement>;
+    /** Emitted on user selection — enables [(activeIndex)] two-way binding. */
+    readonly activeIndexChange: _angular_core.OutputEmitterRef<number>;
+    /** 'page' = the V2 workspace tab strip (larger hit area, count badges). */
+    readonly variant: _angular_core.InputSignal<"default" | "page">;
+    readonly tabListRef: _angular_core.Signal<ElementRef<HTMLElement>>;
+    readonly underlineRef: _angular_core.Signal<ElementRef<HTMLElement> | undefined>;
+    readonly pagePillRef: _angular_core.Signal<ElementRef<HTMLElement> | undefined>;
+    /** Last applied pill geometry — skip DOM writes when nothing moved. */
+    private pillState;
     canScrollLeft: boolean;
     canScrollRight: boolean;
     private animateDelay;
@@ -1062,37 +1172,64 @@ declare class TabGroupComponent implements AfterContentInit {
     constructor(renderer: Renderer2);
     ngAfterContentInit(): void;
     selectTab(index: number): void;
+    badgeClass(tab: TabComponent): string;
     /** Roving tablist keyboard nav: arrows move AND activate (selection follows focus). */
     onTabKeydown(event: KeyboardEvent, index: number): void;
+    /** Parent-driven activeIndex (deep-link ?tab=, quick-links) must also move the pill. */
+    ngOnChanges(changes: SimpleChanges): void;
+    /**
+     * Re-measure every view check: catches label-width changes (language switch,
+     * count arriving) with cached geometry so the DOM write only happens when
+     * the pill actually moved.
+     */
+    ngAfterViewChecked(): void;
+    /** Slide the 'page' pill to the active tab (offset* is scroll-content relative). */
+    private updatePagePill;
     private updateUnderlinePosition;
     private scrollToActiveTab;
     scroll(direction: 'left' | 'right'): void;
     onScroll(): void;
     private updateScrollButtons;
     onResize(): void;
-    static ɵfac: i0.ɵɵFactoryDeclaration<TabGroupComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<TabGroupComponent, "fx-ui-tab-group", never, { "activeIndex": { "alias": "activeIndex"; "required": false; }; }, {}, ["tabs"], never, false, never>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<TabGroupComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<TabGroupComponent, "fx-ui-tab-group", never, { "activeIndex": { "alias": "activeIndex"; "required": false; }; "variant": { "alias": "variant"; "required": false; "isSignal": true; }; }, { "activeIndexChange": "activeIndexChange"; }, ["tabs"], never, true, never>;
 }
 
+/**
+ * Where the generated Heroicons sprite is served from. Defaults to
+ * 'fx-icons.svg' at the app base — consumers copy it from the package via an
+ * angular.json assets glob (same pattern as the lib fonts):
+ *   { "input": "node_modules/@foxeltech/angular-ui", "glob": "fx-icons.svg", "output": "." }
+ */
+declare const FX_ICON_SPRITE_URL: InjectionToken<string>;
+/**
+ * Heroicons rendered from the self-hosted sprite (see
+ * scripts/generate-icon-sprite.mjs) — every 24px outline/solid icon is
+ * available by name with no per-icon registration and no runtime icon
+ * library. API kept compatible with the old @dimaslz/ng-heroicons wrapper.
+ */
 declare class HeroIconComponent {
-    stroke: number;
-    icon: any;
-    solid: boolean;
-    outline: boolean;
-    size: number;
-    color: any;
-    class?: any;
-    static ɵfac: i0.ɵɵFactoryDeclaration<HeroIconComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<HeroIconComponent, "fx-ui-hero-icon", never, { "stroke": { "alias": "stroke"; "required": false; }; "icon": { "alias": "icon"; "required": false; }; "solid": { "alias": "solid"; "required": false; }; "outline": { "alias": "outline"; "required": false; }; "size": { "alias": "size"; "required": false; }; "color": { "alias": "color"; "required": false; }; "class": { "alias": "class"; "required": false; }; }, {}, never, never, false, never>;
+    readonly stroke: _angular_core.InputSignal<number>;
+    readonly icon: _angular_core.InputSignal<string | undefined>;
+    readonly solid: _angular_core.InputSignal<boolean | undefined>;
+    readonly outline: _angular_core.InputSignal<boolean | undefined>;
+    readonly size: _angular_core.InputSignal<number | undefined>;
+    readonly color: _angular_core.InputSignal<string | undefined>;
+    readonly class: _angular_core.InputSignal<string | undefined>;
+    readonly spriteUrl: string;
+    constructor();
+    get href(): string;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<HeroIconComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<HeroIconComponent, "fx-ui-hero-icon", never, { "stroke": { "alias": "stroke"; "required": false; "isSignal": true; }; "icon": { "alias": "icon"; "required": false; "isSignal": true; }; "solid": { "alias": "solid"; "required": false; "isSignal": true; }; "outline": { "alias": "outline"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "color": { "alias": "color"; "required": false; "isSignal": true; }; "class": { "alias": "class"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
 }
 
 declare class ToastComponent {
-    toastId: number;
+    readonly toastId: _angular_core.InputSignal<number>;
     title?: string;
-    message: string;
-    type: 'success' | 'error' | 'info' | 'warning';
-    static ɵfac: i0.ɵɵFactoryDeclaration<ToastComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<ToastComponent, "fx-ui-toast", never, { "toastId": { "alias": "toastId"; "required": false; }; "title": { "alias": "title"; "required": false; }; "message": { "alias": "message"; "required": false; }; "type": { "alias": "type"; "required": false; }; }, {}, never, never, false, never>;
+    readonly message: _angular_core.InputSignal<string>;
+    readonly type: _angular_core.InputSignal<"error" | "success" | "info" | "warning" | undefined>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<ToastComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<ToastComponent, "fx-ui-toast", never, { "toastId": { "alias": "toastId"; "required": true; "isSignal": true; }; "title": { "alias": "title"; "required": false; }; "message": { "alias": "message"; "required": false; "isSignal": true; }; "type": { "alias": "type"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
 }
 
 declare class ToastContainerComponent {
@@ -1101,79 +1238,32 @@ declare class ToastContainerComponent {
     constructor(ref: ChangeDetectorRef);
     addToast(toast: any): void;
     removeToast(id: number): void;
-    static ɵfac: i0.ɵɵFactoryDeclaration<ToastContainerComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<ToastContainerComponent, "fx-ui-toast-container", never, {}, {}, never, never, false, never>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<ToastContainerComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<ToastContainerComponent, "fx-ui-toast-container", never, {}, {}, never, never, true, never>;
 }
 
 type TagType = 'success' | 'warning' | 'critical' | 'information' | 'discovery' | 'default' | 'danger';
 declare class TagComponent {
-    label: string;
-    type: TagType;
-    rounded: boolean;
-    icon?: any;
-    solid: boolean;
+    readonly label: _angular_core.InputSignal<string | undefined>;
+    readonly type: _angular_core.InputSignal<TagType>;
+    readonly rounded: _angular_core.InputSignal<boolean>;
+    icon?: string;
+    readonly solid: _angular_core.InputSignal<boolean>;
     clicked: EventEmitter<void>;
     onClick(): void;
-    static ɵfac: i0.ɵɵFactoryDeclaration<TagComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<TagComponent, "fx-ui-tag", never, { "label": { "alias": "label"; "required": false; }; "type": { "alias": "type"; "required": false; }; "rounded": { "alias": "rounded"; "required": false; }; "icon": { "alias": "icon"; "required": false; }; "solid": { "alias": "solid"; "required": false; }; }, { "clicked": "clicked"; }, never, never, false, never>;
-}
-
-type IChartType = 'bar' | 'pie' | 'sunburst' | 'auto';
-declare class ChartComponent implements OnChanges, AfterViewInit, OnDestroy {
-    private ref;
-    private cdr;
-    type: IChartType;
-    data: any;
-    options?: EChartsOption;
-    palette?: string[];
-    height: string;
-    loading: boolean;
-    pieLegendAlign: string | number;
-    pieLegendPosition: string | number;
-    showPieLabel: boolean;
-    mobileWidth: number;
-    labelFontFamily: string;
-    emptyText: string;
-    chartClick: EventEmitter<any>;
-    chartInit: EventEmitter<ECharts>;
-    chartOptions: EChartsOption;
-    isEmpty: boolean;
-    labelFontSize: number;
-    private chartInstance?;
-    private resizeObserver?;
-    private intersectionObserver?;
-    private canInit;
-    private isMobile;
-    private containerWidth;
-    constructor(ref: ElementRef<HTMLElement>, cdr: ChangeDetectorRef);
-    ngAfterViewInit(): void;
-    ngOnChanges(): void;
-    ngOnDestroy(): void;
-    onThemeChange(): void;
-    onChartClick(event: any): void;
-    onChartInit(chart: any): void;
-    private updateResponsiveState;
-    private forceMediaRecalc;
-    private rebuildChart;
-    private checkEmpty;
-    private registry;
-    private calcPieLayout;
-    private detectType;
-    private buildOptions;
-    private resolvePalette;
-    static ɵfac: i0.ɵɵFactoryDeclaration<ChartComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<ChartComponent, "fx-ui-chart", never, { "type": { "alias": "type"; "required": false; }; "data": { "alias": "data"; "required": false; }; "options": { "alias": "options"; "required": false; }; "palette": { "alias": "palette"; "required": false; }; "height": { "alias": "height"; "required": false; }; "loading": { "alias": "loading"; "required": false; }; "pieLegendAlign": { "alias": "pieLegendAlign"; "required": false; }; "pieLegendPosition": { "alias": "pieLegendPosition"; "required": false; }; "showPieLabel": { "alias": "showPieLabel"; "required": false; }; "mobileWidth": { "alias": "mobileWidth"; "required": false; }; "labelFontFamily": { "alias": "labelFontFamily"; "required": false; }; "emptyText": { "alias": "emptyText"; "required": false; }; }, { "chartClick": "chartClick"; "chartInit": "chartInit"; }, never, never, false, never>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<TagComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<TagComponent, "fx-ui-tag", never, { "label": { "alias": "label"; "required": false; "isSignal": true; }; "type": { "alias": "type"; "required": false; "isSignal": true; }; "rounded": { "alias": "rounded"; "required": false; "isSignal": true; }; "icon": { "alias": "icon"; "required": false; }; "solid": { "alias": "solid"; "required": false; "isSignal": true; }; }, { "clicked": "clicked"; }, never, never, true, never>;
 }
 
 declare class SliderComponent extends FxComponent<any> implements AfterViewInit {
     private ref;
-    trackRef: ElementRef<HTMLElement>;
-    thumbRef: ElementRef<HTMLElement>;
-    min: number;
-    max: number;
-    step: number;
-    vertical: boolean;
-    valueChange: EventEmitter<number>;
+    readonly trackRef: _angular_core.Signal<ElementRef<HTMLElement>>;
+    readonly thumbRef: _angular_core.Signal<ElementRef<HTMLElement>>;
+    readonly min: _angular_core.InputSignal<number>;
+    readonly max: _angular_core.InputSignal<number>;
+    readonly step: _angular_core.InputSignal<number>;
+    readonly vertical: _angular_core.InputSignal<boolean>;
+    readonly valueChange: _angular_core.OutputEmitterRef<number>;
     dragging: boolean;
     constructor(ref: ChangeDetectorRef);
     ngAfterViewInit(): void;
@@ -1200,68 +1290,39 @@ declare class SliderComponent extends FxComponent<any> implements AfterViewInit
         transform: string;
         bottom?: undefined;
     };
-    static ɵfac: i0.ɵɵFactoryDeclaration<SliderComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<SliderComponent, "fx-ui-slider", never, { "min": { "alias": "min"; "required": false; }; "max": { "alias": "max"; "required": false; }; "step": { "alias": "step"; "required": false; }; "vertical": { "alias": "vertical"; "required": false; }; }, { "valueChange": "valueChange"; }, never, never, false, never>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<SliderComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<SliderComponent, "fx-ui-slider", never, { "min": { "alias": "min"; "required": false; "isSignal": true; }; "max": { "alias": "max"; "required": false; "isSignal": true; }; "step": { "alias": "step"; "required": false; "isSignal": true; }; "vertical": { "alias": "vertical"; "required": false; "isSignal": true; }; }, { "valueChange": "valueChange"; }, never, never, true, never>;
 }
 
 declare class SwitchComponent extends FxComponent<any> implements AfterViewInit {
-    private cdr;
-    onSwitch: EventEmitter<boolean>;
+    readonly onSwitch: _angular_core.OutputEmitterRef<boolean>;
     /** Accessible name — the switch renders no visible text of its own. */
-    ariaLabel: string;
+    readonly ariaLabel: _angular_core.InputSignal<string>;
     ngAfterViewInit(): void;
-    constructor(cdr: ChangeDetectorRef);
     writeValue(value: any): void;
     toggle(): void;
-    static ɵfac: i0.ɵɵFactoryDeclaration<SwitchComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<SwitchComponent, "fx-ui-switch", never, { "ariaLabel": { "alias": "ariaLabel"; "required": false; }; }, { "onSwitch": "onSwitch"; }, never, never, false, never>;
-}
-
-declare class RichTextAreaComponent extends FxComponent<any> implements AfterViewInit {
-    private cdr;
-    private styleLoader;
-    private platformId;
-    editorContainer: ElementRef<HTMLDivElement>;
-    placeholder: string;
-    toolbarOptions: any;
-    contentChange: EventEmitter<string>;
-    private quillInstance;
-    constructor(cdr: ChangeDetectorRef, styleLoader: QuillStyleLoaderService, platformId: object);
-    ngAfterViewInit(): Promise<void>;
-    writeValue(value: any): void;
-    setDisabledState(isDisabled: boolean): void;
-    static ɵfac: i0.ɵɵFactoryDeclaration<RichTextAreaComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<RichTextAreaComponent, "fx-ui-rich-text-area", never, { "placeholder": { "alias": "placeholder"; "required": false; }; "toolbarOptions": { "alias": "toolbarOptions"; "required": false; }; }, { "contentChange": "contentChange"; }, never, never, false, never>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<SwitchComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<SwitchComponent, "fx-ui-switch", never, { "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; }, { "onSwitch": "onSwitch"; }, never, never, true, never>;
 }
 
 declare class SkeletonTableLoadingComponent {
-    columns: number;
-    rows: number;
-    static ɵfac: i0.ɵɵFactoryDeclaration<SkeletonTableLoadingComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<SkeletonTableLoadingComponent, "fx-ui-skeleton-table-loading", never, { "columns": { "alias": "columns"; "required": false; }; "rows": { "alias": "rows"; "required": false; }; }, {}, never, never, false, never>;
-}
-
-declare class FlowConnection {
-    nodes: Node[];
-    edges: Edge[];
-    backgroundColor: any;
-    view: any;
-    handleConnection(connection: Connection): void;
-    static ɵfac: i0.ɵɵFactoryDeclaration<FlowConnection, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<FlowConnection, "fx-ui-flow-connection", never, { "nodes": { "alias": "nodes"; "required": false; }; "edges": { "alias": "edges"; "required": false; }; "backgroundColor": { "alias": "backgroundColor"; "required": false; }; "view": { "alias": "view"; "required": false; }; }, {}, never, never, false, never>;
+    readonly columns: _angular_core.InputSignal<number>;
+    readonly rows: _angular_core.InputSignal<number>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<SkeletonTableLoadingComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<SkeletonTableLoadingComponent, "fx-ui-skeleton-table-loading", never, { "columns": { "alias": "columns"; "required": false; "isSignal": true; }; "rows": { "alias": "rows"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
 }
 
 declare class CircleProgressBar {
-    percent: number;
-    showPercent: boolean;
+    readonly percent: _angular_core.InputSignal<number>;
+    readonly showPercent: _angular_core.InputSignal<boolean>;
     readonly radius = 35;
     readonly stroke = 10;
     readonly normalizedRadius: number;
     readonly circumference: number;
     get dashOffset(): number;
     get ariaLabel(): string;
-    static ɵfac: i0.ɵɵFactoryDeclaration<CircleProgressBar, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<CircleProgressBar, "fx-ui-circle-progress-bar", never, { "percent": { "alias": "percent"; "required": false; }; "showPercent": { "alias": "showPercent"; "required": false; }; }, {}, never, never, false, never>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<CircleProgressBar, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<CircleProgressBar, "fx-ui-circle-progress-bar", never, { "percent": { "alias": "percent"; "required": false; "isSignal": true; }; "showPercent": { "alias": "showPercent"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
 }
 
 interface TreeNode {
@@ -1273,9 +1334,9 @@ interface TreeNode {
 declare class TreeDiagram implements AfterViewInit, OnDestroy {
     private zone;
     private cdr;
-    data: any;
-    container: ElementRef;
-    root: ElementRef;
+    readonly data: _angular_core.InputSignal<any>;
+    readonly container: _angular_core.Signal<ElementRef<any>>;
+    readonly root: _angular_core.Signal<ElementRef<any>>;
     children: QueryList<ElementRef>;
     lines: any[];
     svgWidth: number;
@@ -1287,15 +1348,15 @@ declare class TreeDiagram implements AfterViewInit, OnDestroy {
     ngOnDestroy(): void;
     private scheduleDraw;
     private drawLines;
-    static ɵfac: i0.ɵɵFactoryDeclaration<TreeDiagram, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<TreeDiagram, "fx-ui-tree-diagram", never, { "data": { "alias": "data"; "required": false; }; }, {}, never, never, false, never>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<TreeDiagram, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<TreeDiagram, "fx-ui-tree-diagram", never, { "data": { "alias": "data"; "required": true; "isSignal": true; }; }, {}, never, never, true, never>;
 }
 
 declare class TableCell {
-    loading: boolean;
-    skeletonClass: string;
-    static ɵfac: i0.ɵɵFactoryDeclaration<TableCell, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<TableCell, "fx-ui-table-cell", never, { "loading": { "alias": "loading"; "required": true; }; "skeletonClass": { "alias": "skeletonClass"; "required": false; }; }, {}, never, ["*"], false, never>;
+    readonly loading: _angular_core.InputSignal<boolean>;
+    readonly skeletonClass: _angular_core.InputSignal<string>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<TableCell, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<TableCell, "fx-ui-table-cell", never, { "loading": { "alias": "loading"; "required": true; "isSignal": true; }; "skeletonClass": { "alias": "skeletonClass"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
 }
 
 interface KanbanColumn<T = any> {
@@ -1312,9 +1373,9 @@ interface ColumnChangedEvent<T = any> {
 }
 
 declare class KanbanBoardComponent<T = any> {
-    columns: KanbanColumn<T>[];
+    readonly columns: _angular_core.InputSignal<KanbanColumn<T>[]>;
     itemTemplate?: TemplateRef<any>;
-    columnChanged: EventEmitter<ColumnChangedEvent<T>>;
+    readonly columnChanged: _angular_core.OutputEmitterRef<ColumnChangedEvent<T>>;
     /**
      * Get all column IDs for connecting drop lists
      */
@@ -1323,14 +1384,16 @@ declare class KanbanBoardComponent<T = any> {
      * Handle drop event when item is moved
      */
     onDrop(event: CdkDragDrop<T[]>, columnId: string): void;
-    static ɵfac: i0.ɵɵFactoryDeclaration<KanbanBoardComponent<any>, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<KanbanBoardComponent<any>, "fx-ui-kanban-board", never, { "columns": { "alias": "columns"; "required": false; }; "itemTemplate": { "alias": "itemTemplate"; "required": false; }; }, { "columnChanged": "columnChanged"; }, never, never, false, never>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<KanbanBoardComponent<any>, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<KanbanBoardComponent<any>, "fx-ui-kanban-board", never, { "columns": { "alias": "columns"; "required": false; "isSignal": true; }; "itemTemplate": { "alias": "itemTemplate"; "required": false; }; }, { "columnChanged": "columnChanged"; }, never, never, true, never>;
 }
 
 interface DrawerItem {
     id: string;
     label: string;
     icon: string;
+    /** V2: renders as a non-interactive section caption (flat nav, no accordion). */
+    heading?: boolean;
     route?: string;
     children?: DrawerItem[];
     action?: () => void;
@@ -1338,12 +1401,20 @@ interface DrawerItem {
 
 declare class DrawerComponent implements OnInit, OnDestroy {
     private router;
-    items: DrawerItem[];
+    private cdr;
+    readonly items: _angular_core.InputSignal<DrawerItem[]>;
+    /** V2: bottom-pinned section (Administration group) — same item rendering,
+        separated by a rule, above the [drawerFooter] slot and version. */
+    readonly footerItems: _angular_core.InputSignal<DrawerItem[]>;
     isExpanded: boolean;
     logo?: string;
+    /** Wordmark cạnh logo, chỉ hiện khi drawer mở. Bỏ trống = chỉ có mark. */
+    logoText?: string;
+    /** Dòng phụ dưới logoText (tagline/workspace). Chỉ hiện khi drawer mở. */
+    logoSubtext?: string;
     version?: string;
-    toggleExpanded: EventEmitter<boolean>;
-    itemClicked: EventEmitter<DrawerItem>;
+    readonly toggleExpanded: _angular_core.OutputEmitterRef<boolean>;
+    readonly itemClicked: _angular_core.OutputEmitterRef<DrawerItem>;
     expandedItems: Set<string>;
     currentRoute: string;
     private destroy$;
@@ -1359,60 +1430,83 @@ declare class DrawerComponent implements OnInit, OnDestroy {
     private autoExpandActiveParents;
     getAccordionState(itemId: string): string;
     getDrawerState(): string;
-    static ɵfac: i0.ɵɵFactoryDeclaration<DrawerComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<DrawerComponent, "fx-ui-drawer", never, { "items": { "alias": "items"; "required": false; }; "isExpanded": { "alias": "isExpanded"; "required": false; }; "logo": { "alias": "logo"; "required": false; }; "version": { "alias": "version"; "required": false; }; }, { "toggleExpanded": "toggleExpanded"; "itemClicked": "itemClicked"; }, never, never, false, never>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<DrawerComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<DrawerComponent, "fx-ui-drawer", never, { "items": { "alias": "items"; "required": false; "isSignal": true; }; "footerItems": { "alias": "footerItems"; "required": false; "isSignal": true; }; "isExpanded": { "alias": "isExpanded"; "required": false; }; "logo": { "alias": "logo"; "required": false; }; "logoText": { "alias": "logoText"; "required": false; }; "logoSubtext": { "alias": "logoSubtext"; "required": false; }; "version": { "alias": "version"; "required": false; }; }, { "toggleExpanded": "toggleExpanded"; "itemClicked": "itemClicked"; }, never, ["[drawerFooter]"], true, never>;
 }
 
 /** Row-card skeleton placeholder for master-detail list panes. */
 declare class SkeletonListComponent {
-    rows: number;
+    readonly rows: _angular_core.InputSignal<number>;
     range(n: number): number[];
-    static ɵfac: i0.ɵɵFactoryDeclaration<SkeletonListComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<SkeletonListComponent, "fx-ui-skeleton-list", never, { "rows": { "alias": "rows"; "required": false; }; }, {}, never, never, false, never>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<SkeletonListComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<SkeletonListComponent, "fx-ui-skeleton-list", never, { "rows": { "alias": "rows"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
 }
 
 /** Card-shaped skeleton placeholder for detail panels. */
 declare class SkeletonDetailComponent {
     /** Number of content cards rendered below the header card. */
-    cards: number;
+    readonly cards: _angular_core.InputSignal<number>;
     /** Rows per content card. */
-    rows: number;
+    readonly rows: _angular_core.InputSignal<number>;
     range(n: number): number[];
     rowWidth(i: number): number;
-    static ɵfac: i0.ɵɵFactoryDeclaration<SkeletonDetailComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<SkeletonDetailComponent, "fx-ui-skeleton-detail", never, { "cards": { "alias": "cards"; "required": false; }; "rows": { "alias": "rows"; "required": false; }; }, {}, never, never, false, never>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<SkeletonDetailComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<SkeletonDetailComponent, "fx-ui-skeleton-detail", never, { "cards": { "alias": "cards"; "required": false; "isSignal": true; }; "rows": { "alias": "rows"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
 }
 
+interface FxStatCardDelta {
+    /** Caller-formatted delta text (e.g. "+12%", "-3"). */
+    value: string;
+    direction: 'up' | 'down';
+    /** Delta colour — up is not always good (findings up = danger). */
+    tone?: Tone | null;
+}
 interface FxStatCard {
     /** Caller-translated caption. */
     label: string;
     value: string | number;
     /** hero-icon name shown in the tinted box. */
-    icon?: any;
+    icon?: string;
     /** Colours the number and the icon box; null/undefined renders neutral. */
     tone?: Tone | null;
+    /** V2 StatGrid: trend chip beside the number. */
+    delta?: FxStatCardDelta;
+    /** V2 StatGrid: mini bar-trend under the caption. */
+    spark?: number[];
+    /** variant 'figure': caller-formatted sub-caption under the number ("+1 since 4.8.0"). */
+    sub?: string;
+    /** Colours the sub-caption; null/undefined renders muted. */
+    subTone?: Tone | null;
 }
 /** KPI tile row: big number + tinted icon box + caption, in a responsive grid. */
 declare class StatCardsComponent {
-    cards: FxStatCard[];
+    readonly cards: _angular_core.InputSignal<FxStatCard[]>;
+    /**
+     * 'tile' (default): tinted icon box + number + caption — the pre-V2 look.
+     * 'figure': the V2 design's KPI column — caption on top, large figure-font
+     * number, toned sub-caption underneath (no icon box).
+     */
+    readonly variant: _angular_core.InputSignal<"figure" | "tile">;
     /** Grid columns; defaults to one column per card. */
     cols?: number;
     get gridColumns(): string;
     numClass(card: FxStatCard): string;
     boxClass(card: FxStatCard): string;
-    static ɵfac: i0.ɵɵFactoryDeclaration<StatCardsComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<StatCardsComponent, "fx-ui-stat-cards", never, { "cards": { "alias": "cards"; "required": false; }; "cols": { "alias": "cols"; "required": false; }; }, {}, never, never, false, never>;
+    deltaClass(card: FxStatCard): string;
+    subClass(card: FxStatCard): string;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<StatCardsComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<StatCardsComponent, "fx-ui-stat-cards", never, { "cards": { "alias": "cards"; "required": false; "isSignal": true; }; "variant": { "alias": "variant"; "required": false; "isSignal": true; }; "cols": { "alias": "cols"; "required": false; }; }, {}, never, never, true, never>;
 }
 
 /** Centered "no data" block. The message is caller-translated (no i18n in lib). */
 declare class EmptyStateComponent {
-    message: string;
+    readonly message: _angular_core.InputSignal<string>;
     /** Optional icon (hero-icon name). */
     icon?: any;
     /** Min height of the block, CSS length. */
-    height: string;
-    static ɵfac: i0.ɵɵFactoryDeclaration<EmptyStateComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<EmptyStateComponent, "fx-ui-empty-state", never, { "message": { "alias": "message"; "required": false; }; "icon": { "alias": "icon"; "required": false; }; "height": { "alias": "height"; "required": false; }; }, {}, never, never, false, never>;
+    readonly height: _angular_core.InputSignal<string>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<EmptyStateComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<EmptyStateComponent, "fx-ui-empty-state", never, { "message": { "alias": "message"; "required": false; "isSignal": true; }; "icon": { "alias": "icon"; "required": false; }; "height": { "alias": "height"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
 }
 
 interface FxFilterChipOption {
@@ -1428,40 +1522,142 @@ interface FxFilterChipOption {
  */
 declare class FilterChipsComponent {
     options: FxFilterChipOption[];
-    value: string;
-    valueChange: EventEmitter<string>;
+    value: string | undefined;
+    readonly valueChange: _angular_core.OutputEmitterRef<string>;
     /** Per-value tone overrides (e.g. { Safe: 'information', Protected: 'discovery' as any }). */
     toneOverrides: Record<string, Tone | null>;
     select(option: FxFilterChipOption): void;
     chipClass(option: FxFilterChipOption): string;
-    static ɵfac: i0.ɵɵFactoryDeclaration<FilterChipsComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<FilterChipsComponent, "fx-ui-filter-chips", never, { "options": { "alias": "options"; "required": false; }; "value": { "alias": "value"; "required": false; }; "toneOverrides": { "alias": "toneOverrides"; "required": false; }; }, { "valueChange": "valueChange"; }, never, never, false, never>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<FilterChipsComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<FilterChipsComponent, "fx-ui-filter-chips", never, { "options": { "alias": "options"; "required": false; }; "value": { "alias": "value"; "required": false; }; "toneOverrides": { "alias": "toneOverrides"; "required": false; }; }, { "valueChange": "valueChange"; }, never, never, true, never>;
+}
+
+interface FxFilterPillOption {
+    /** '' (empty) is the conventional "All" pill. */
+    value: string;
+    /** Caller-translated label. */
+    label: string;
+    /** Shown muted beside the label; null/undefined renders no count. */
+    count?: number | null;
+}
+/**
+ * V2 filter pills — the quick-filter row above ranked lists (design refs 02,
+ * 03, 11): outlined capsules with a muted count, the active one filled with
+ * the primary text colour.
+ *
+ * Distinct from `fx-ui-filter-chips`, which tints each chip by its severity
+ * tone and carries no count. Presentational: the caller owns the filter state.
+ *
+ *   <fx-ui-filter-pills [options]="pills" [value]="filters.status"
+ *                       (valueChange)="filters.status = $event; refresh()" />
+ */
+declare class FilterPillsComponent {
+    readonly options: _angular_core.InputSignal<FxFilterPillOption[]>;
+    /** Accepts undefined so screens can bind an optional filter-bag key. */
+    readonly value: _angular_core.InputSignal<string | undefined>;
+    readonly valueChange: _angular_core.OutputEmitterRef<string>;
+    isActive(option: FxFilterPillOption): boolean;
+    pillClass(option: FxFilterPillOption): string;
+    countClass(option: FxFilterPillOption): string;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<FilterPillsComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<FilterPillsComponent, "fx-ui-filter-pills", never, { "options": { "alias": "options"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; }, { "valueChange": "valueChange"; }, never, never, true, never>;
+}
+
+/**
+ * V2 stage progress dots — the walkthrough position indicator on the attack
+ * chain toolbar (design refs 04, 07): one dot per stage, the current one drawn
+ * as a wider accent bar, visited ones solid, the rest faint.
+ *
+ *   <fx-ui-stage-dots [count]="8" [current]="stageIndex()"
+ *                     (dotClick)="goToStage($event)" />
+ */
+declare class StageDotsComponent {
+    readonly count: _angular_core.InputSignal<number>;
+    /** 0-based current stage; -1 (default) means none selected yet. */
+    readonly current: _angular_core.InputSignal<number>;
+    /** Emit the clicked stage index; wire it to make the dots navigable. */
+    readonly dotClick: _angular_core.OutputEmitterRef<number>;
+    readonly dots: _angular_core.Signal<number[]>;
+    dotClass(index: number): string;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<StageDotsComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<StageDotsComponent, "fx-ui-stage-dots", never, { "count": { "alias": "count"; "required": false; "isSignal": true; }; "current": { "alias": "current"; "required": false; "isSignal": true; }; }, { "dotClick": "dotClick"; }, never, never, true, never>;
+}
+
+/**
+ * V2 evidence code block — the mono panel that carries a process tree, a
+ * command line or any captured text (design ref 05, "Process tree").
+ *
+ * Whitespace is preserved and the box scrolls on its own rather than pushing
+ * the page wide, so ASCII trees survive narrow viewports.
+ *
+ *   <fx-ui-code-block [label]="'analyze.processTree' | translate" [code]="tree" />
+ */
+declare class CodeBlockComponent {
+    readonly code: _angular_core.InputSignal<string>;
+    /** Caller-translated caption above the box; omit for a bare block. */
+    readonly label: _angular_core.InputSignal<string>;
+    /** Scroll cap; empty grows with the content. */
+    readonly maxHeight: _angular_core.InputSignal<string>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<CodeBlockComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<CodeBlockComponent, "fx-ui-code-block", never, { "code": { "alias": "code"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "maxHeight": { "alias": "maxHeight"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+}
+
+/**
+ * V2 captured-evidence frame — a faux window chrome (traffic lights + mono file
+ * name + timestamp) around a screenshot, with a placeholder when the image is
+ * missing (design ref 05, "Screenshot").
+ *
+ *   <fx-ui-screenshot-frame [label]="'analyze.screenshot' | translate"
+ *                           fileName="chain-05.png" timestamp="09:42:18"
+ *                           [src]="url" [caption]="caption" />
+ */
+declare class ScreenshotFrameComponent {
+    /** Caller-translated caption above the frame; omit for a bare frame. */
+    readonly label: _angular_core.InputSignal<string>;
+    readonly fileName: _angular_core.InputSignal<string>;
+    readonly timestamp: _angular_core.InputSignal<string>;
+    /** Image URL; empty renders the placeholder body. */
+    readonly src: _angular_core.InputSignal<string>;
+    /** Caller-translated line under (or inside) the frame. */
+    readonly caption: _angular_core.InputSignal<string>;
+    readonly alt: _angular_core.InputSignal<string>;
+    readonly height: _angular_core.InputSignal<string>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<ScreenshotFrameComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<ScreenshotFrameComponent, "fx-ui-screenshot-frame", never, { "label": { "alias": "label"; "required": false; "isSignal": true; }; "fileName": { "alias": "fileName"; "required": false; "isSignal": true; }; "timestamp": { "alias": "timestamp"; "required": false; "isSignal": true; }; "src": { "alias": "src"; "required": false; "isSignal": true; }; "caption": { "alias": "caption"; "required": false; "isSignal": true; }; "alt": { "alias": "alt"; "required": false; "isSignal": true; }; "height": { "alias": "height"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
 }
 
 /** Thin tone-coloured progress/score bar with optional label and caption. */
 declare class MeterComponent {
     value: number;
     max: number;
-    tone: Tone | null;
+    readonly tone: _angular_core.InputSignal<Tone | null>;
     /** Caller-translated texts; omitted → bar only. */
     label?: string;
     caption?: string;
     get percent(): number;
     get fillClass(): string;
-    static ɵfac: i0.ɵɵFactoryDeclaration<MeterComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<MeterComponent, "fx-ui-meter", never, { "value": { "alias": "value"; "required": false; }; "max": { "alias": "max"; "required": false; }; "tone": { "alias": "tone"; "required": false; }; "label": { "alias": "label"; "required": false; }; "caption": { "alias": "caption"; "required": false; }; }, {}, never, never, false, never>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<MeterComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<MeterComponent, "fx-ui-meter", never, { "value": { "alias": "value"; "required": false; }; "max": { "alias": "max"; "required": false; }; "tone": { "alias": "tone"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; }; "caption": { "alias": "caption"; "required": false; }; }, {}, never, never, true, never>;
 }
 
-/** Detail-panel section: card with an icon + heading header and projected body. */
+/**
+ * Panel section: card with a header and projected body.
+ *  - titleStyle 'heading' (default): icon + heading, the pre-V2 look
+ *  - titleStyle 'eyebrow': the V2 design's panel header — small tracked
+ *    caption on the left, muted [aside] text on the right
+ */
 declare class SectionCardComponent {
     /** Caller-translated heading. */
-    title: string;
+    readonly title: _angular_core.InputSignal<string>;
     /** hero-icon name; omitted → text-only header. */
     icon?: any;
-    iconTone: Tone | null;
+    readonly iconTone: _angular_core.InputSignal<Tone | null>;
+    readonly titleStyle: _angular_core.InputSignal<"heading" | "eyebrow">;
+    /** Caller-translated right-aligned hint (eyebrow style). */
+    readonly aside: _angular_core.InputSignal<string>;
     get iconClass(): string;
-    static ɵfac: i0.ɵɵFactoryDeclaration<SectionCardComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<SectionCardComponent, "fx-ui-section-card", never, { "title": { "alias": "title"; "required": false; }; "icon": { "alias": "icon"; "required": false; }; "iconTone": { "alias": "iconTone"; "required": false; }; }, {}, never, ["*"], false, never>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<SectionCardComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<SectionCardComponent, "fx-ui-section-card", never, { "title": { "alias": "title"; "required": false; "isSignal": true; }; "icon": { "alias": "icon"; "required": false; }; "iconTone": { "alias": "iconTone"; "required": false; "isSignal": true; }; "titleStyle": { "alias": "titleStyle"; "required": false; "isSignal": true; }; "aside": { "alias": "aside"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
 }
 
 /**
@@ -1471,18 +1667,18 @@ declare class SectionCardComponent {
  */
 declare class InfoFieldComponent {
     /** Caller-translated label. */
-    label: string;
+    readonly label: _angular_core.InputSignal<string>;
     value: string | number | null | undefined;
     /** Colours the value; null/undefined renders the primary text colour. */
     tone: Tone | null;
     /** Monospace value (hashes, paths). */
     mono: boolean;
     /** Placeholder when value is empty. */
-    placeholder: string;
+    readonly placeholder: _angular_core.InputSignal<string>;
     get displayValue(): string;
     get valueClass(): string;
-    static ɵfac: i0.ɵɵFactoryDeclaration<InfoFieldComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<InfoFieldComponent, "fx-ui-info-field", never, { "label": { "alias": "label"; "required": false; }; "value": { "alias": "value"; "required": false; }; "tone": { "alias": "tone"; "required": false; }; "mono": { "alias": "mono"; "required": false; }; "placeholder": { "alias": "placeholder"; "required": false; }; }, {}, never, never, false, never>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<InfoFieldComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<InfoFieldComponent, "fx-ui-info-field", never, { "label": { "alias": "label"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; }; "tone": { "alias": "tone"; "required": false; }; "mono": { "alias": "mono"; "required": false; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
 }
 
 interface FxSeverityBadge {
@@ -1507,20 +1703,22 @@ declare class SeverityBadgesComponent {
     showZero: boolean;
     /** Append the severity letter to counts ("3C", "5H", "2M") per the report design. */
     suffixed: boolean;
-    badgeClick: EventEmitter<string>;
+    readonly badgeClick: _angular_core.OutputEmitterRef<string>;
     private static readonly TONES;
     get badges(): FxSeverityBadge[];
     badgeClass(badge: FxSeverityBadge): string;
-    static ɵfac: i0.ɵɵFactoryDeclaration<SeverityBadgesComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<SeverityBadgesComponent, "fx-ui-severity-badges", never, { "stats": { "alias": "stats"; "required": false; }; "showZero": { "alias": "showZero"; "required": false; }; "suffixed": { "alias": "suffixed"; "required": false; }; }, { "badgeClick": "badgeClick"; }, never, never, false, never>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<SeverityBadgesComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<SeverityBadgesComponent, "fx-ui-severity-badges", never, { "stats": { "alias": "stats"; "required": false; }; "showZero": { "alias": "showZero"; "required": false; }; "suffixed": { "alias": "suffixed"; "required": false; }; }, { "badgeClick": "badgeClick"; }, never, never, true, never>;
 }
 
 /**
- * Two-column master-detail shell driven by a BaseMasterDetailComponent.
- * The host page projects its own header/filters and supplies templates for
- * the parts that vary per entity:
+ * Master-detail shell driven by a BaseMasterDetailComponent. Two-column by
+ * default; projecting a [mdFacets] block (V2 lookup screens) adds a third
+ * facets-rail column before the list. The host page projects its own
+ * header/filters and supplies templates for the parts that vary per entity:
  *
  *   <fx-ui-master-detail [table]="this" [emptyMessage]="'noData' | translate">
+ *     <div mdFacets>…<fx-ui-facets-rail …/>…</div>   <!-- optional, V2 -->
  *     <div mdHeader>…title / stat cards…</div>
  *     <div mdFilters>…search bar / filter chips…</div>
  *     <ng-template #row let-item let-selected="selected">…row body…</ng-template>
@@ -1530,26 +1728,449 @@ declare class SeverityBadgesComponent {
  * The list behaves as a single-select listbox: the selected option is the
  * tab stop, ArrowUp/Down/Home/End move the selection.
  */
-declare class MasterDetailComponent implements AfterViewInit {
+declare class MasterDetailComponent implements AfterViewInit, AfterContentInit {
+    private hostEl;
+    /** True when the host projected a [mdFacets] block — switches to 3 columns. */
+    hasFacets: boolean;
     table: BaseMasterDetailComponent<any>;
     /** Fixed list-pane width on lg+ viewports (stacked full-width below). */
-    listWidth: string;
-    maxListHeight: string;
-    pageSizeOptions: number[];
+    readonly listWidth: _angular_core.InputSignal<string>;
+    readonly maxListHeight: _angular_core.InputSignal<string>;
+    readonly pageSizeOptions: _angular_core.InputSignal<number[]>;
     /** Labels come in via inputs — the lib carries no i18n. */
-    emptyMessage: string;
-    listLabel: string;
-    skeletonCards: number;
-    rowTemplate: TemplateRef<any>;
-    detailTemplate: TemplateRef<any>;
-    paginator: MatPaginator;
+    readonly emptyMessage: _angular_core.InputSignal<string>;
+    readonly listLabel: _angular_core.InputSignal<string>;
+    readonly skeletonCards: _angular_core.InputSignal<number>;
+    /** 'prevnext' renders the V2 "X of Y" + Prev/Next controls instead of the
+        Material paginator (which stays in the DOM, hidden — it is the paging
+        engine BaseTable subscribes to). */
+    readonly paginationStyle: _angular_core.InputSignal<"paginator" | "prevnext">;
+    /** Caller-translated Prev/Next labels ("X of Y" is numeric). */
+    readonly prevLabel: _angular_core.InputSignal<string>;
+    readonly nextLabel: _angular_core.InputSignal<string>;
+    readonly rowTemplate: _angular_core.Signal<TemplateRef<any>>;
+    readonly detailTemplate: _angular_core.Signal<TemplateRef<any>>;
+    readonly paginator: _angular_core.Signal<MatPaginator>;
     readonly uid: string;
+    ngAfterContentInit(): void;
     ngAfterViewInit(): void;
+    /** "X of Y" range text for the prevnext pagination style. */
+    rangeText(): string;
     isSelected(row: any): boolean;
     optionId(index: number): string;
     onKeydown(event: KeyboardEvent, index: number): void;
-    static ɵfac: i0.ɵɵFactoryDeclaration<MasterDetailComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<MasterDetailComponent, "fx-ui-master-detail", never, { "table": { "alias": "table"; "required": false; }; "listWidth": { "alias": "listWidth"; "required": false; }; "maxListHeight": { "alias": "maxListHeight"; "required": false; }; "pageSizeOptions": { "alias": "pageSizeOptions"; "required": false; }; "emptyMessage": { "alias": "emptyMessage"; "required": false; }; "listLabel": { "alias": "listLabel"; "required": false; }; "skeletonCards": { "alias": "skeletonCards"; "required": false; }; }, {}, ["rowTemplate", "detailTemplate"], ["[mdHeader]", "[mdFilters]"], false, never>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<MasterDetailComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<MasterDetailComponent, "fx-ui-master-detail", never, { "table": { "alias": "table"; "required": false; }; "listWidth": { "alias": "listWidth"; "required": false; "isSignal": true; }; "maxListHeight": { "alias": "maxListHeight"; "required": false; "isSignal": true; }; "pageSizeOptions": { "alias": "pageSizeOptions"; "required": false; "isSignal": true; }; "emptyMessage": { "alias": "emptyMessage"; "required": false; "isSignal": true; }; "listLabel": { "alias": "listLabel"; "required": false; "isSignal": true; }; "skeletonCards": { "alias": "skeletonCards"; "required": false; "isSignal": true; }; "paginationStyle": { "alias": "paginationStyle"; "required": false; "isSignal": true; }; "prevLabel": { "alias": "prevLabel"; "required": false; "isSignal": true; }; "nextLabel": { "alias": "nextLabel"; "required": false; "isSignal": true; }; }, {}, ["rowTemplate", "detailTemplate"], ["[mdFacets]", "[mdHeader]", "[mdFilters]"], true, never>;
+}
+
+interface FxMenuItem {
+    /** Caller-translated label. */
+    label: string;
+    /** Optional hero-icon name shown before the label. */
+    icon?: string;
+    /** Danger/warning items get the matching text tone. */
+    tone?: Tone | null;
+    disabled?: boolean;
+    /** Free-form identifier handed back on (select). */
+    value?: any;
+}
+/**
+ * Row-action dropdown wrapper over mat-menu (behavior-layer rule, Playbook
+ * §5.1 — apps never import @angular/material directly). Project the trigger
+ * content; items render from [items] and come back through (select).
+ *
+ *   <fx-ui-menu [items]="actions" (select)="onAction($event)">
+ *     <fx-ui-hero-icon icon="ellipsis-vertical" [size]="20" />
+ *   </fx-ui-menu>
+ */
+declare class MenuComponent {
+    readonly items: _angular_core.InputSignal<FxMenuItem[]>;
+    readonly disabled: _angular_core.InputSignal<boolean>;
+    /** Accessible name for the trigger button. */
+    readonly ariaLabel: _angular_core.InputSignal<string>;
+    readonly select: _angular_core.OutputEmitterRef<FxMenuItem>;
+    toneClass(item: FxMenuItem): string;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<MenuComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<MenuComponent, "fx-ui-menu", never, { "items": { "alias": "items"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; }, { "select": "select"; }, never, ["*"], true, never>;
+}
+
+/**
+ * V2 theme picker — dropdown các theme OgeniumDashboards cho chọn
+ * (OG_PICKER_THEME_META: porcelain/charcoal), mỗi dòng có swatch accent +
+ * page. Drives ThemeService.setTheme(); replaces the pre-V2 sun/moon toggle
+ * (behavior-layer rule: mat-menu stays inside the lib, apps never import
+ * @angular/material directly).
+ *
+ *   <fx-ui-theme-picker />
+ */
+declare class ThemePickerComponent {
+    private themeService;
+    readonly themes: readonly OgThemeMeta[];
+    readonly current: _angular_core.Signal<OgTheme>;
+    /** Tra trên bộ ĐẦY ĐỦ: theme đang active có thể là một trong 4 theme đã ẩn
+        khỏi picker (deep-link /themes, localStorage cũ) — nhãn vẫn phải đúng. */
+    currentMeta(): OgThemeMeta;
+    select(theme: OgTheme): void;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<ThemePickerComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<ThemePickerComponent, "fx-ui-theme-picker", never, {}, {}, never, never, true, never>;
+}
+
+/**
+ * "Waiting on the backend" marker (anh Tú 29/08).
+ *
+ * Put this on any UI the V2 design calls for but no endpoint feeds yet, so the
+ * gap is visible in the product instead of living only in a backlog file.
+ * `grep -r "fx-ui-pending-badge"` then lists every outstanding field.
+ *
+ *   <fx-ui-pending-badge [field]="'confirmed-chains weekly series'" />
+ *
+ * Keep the copy factual: it states that data is missing, never fakes a value.
+ */
+declare class PendingBadgeComponent {
+    /** Caller-translated chip text. */
+    readonly label: _angular_core.InputSignal<string>;
+    /**
+     * What exactly is missing — shown as the title tooltip so a reviewer can read
+     * the required field without opening the code.
+     */
+    readonly field: _angular_core.InputSignal<string>;
+    /** 'chip' (default) sits inline; 'dot' is a bare marker for dense rows. */
+    readonly variant: _angular_core.InputSignal<"chip" | "dot">;
+    get tooltip(): string;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<PendingBadgeComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<PendingBadgeComponent, "fx-ui-pending-badge", never, { "label": { "alias": "label"; "required": false; "isSignal": true; }; "field": { "alias": "field"; "required": false; "isSignal": true; }; "variant": { "alias": "variant"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+}
+
+/**
+ * Wraps UI that is rendered from PLACEHOLDER data so the layout can be
+ * reviewed before its endpoint exists (anh Tú 29/08: "muốn có full giao diện
+ * trước để review").
+ *
+ * The frame makes the status unmistakable — dashed outline, a corner label and
+ * the pending marker naming the missing field — so sample shapes can never be
+ * mistaken for measured values. Drop the wrapper (and the sample input) the
+ * moment the API lands.
+ *
+ * The pending chip is inlined rather than composed from fx-ui-pending-badge:
+ * one lib component importing another inside the same barrel tripped NG0919
+ * (metadata read before definition) in consuming apps.
+ *
+ *   <fx-ui-sample-frame [field]="'weekly activity'" [label]="'Sample layout'">
+ *     …chart rendered from sample series…
+ *   </fx-ui-sample-frame>
+ */
+declare class SampleFrameComponent {
+    /** Caller-translated corner label. */
+    readonly label: _angular_core.InputSignal<string>;
+    /** Field the backend still owes — shown on the pending badge tooltip. */
+    readonly field: _angular_core.InputSignal<string>;
+    /** Caller-translated pending-chip text. */
+    readonly pendingLabel: _angular_core.InputSignal<string>;
+    get tooltip(): string;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<SampleFrameComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<SampleFrameComponent, "fx-ui-sample-frame", never, { "label": { "alias": "label"; "required": false; "isSignal": true; }; "field": { "alias": "field"; "required": false; "isSignal": true; }; "pendingLabel": { "alias": "pendingLabel"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
+}
+
+/**
+ * V2 score badge — the risk/score chip used on attack-path rows, dashboard
+ * panels and project tiles. Colour comes from the 0–100 risk band unless an
+ * explicit tone is given (bands: ≥90 critical, ≥70 danger, ≥40 warning, else
+ * success — same thresholds as value-tone's scoreTone on a 0–100 scale).
+ */
+declare class ScoreBadgeComponent {
+    readonly score: _angular_core.InputSignal<string | number>;
+    /** Denominator shown as "98 / 100"; omit for a bare score. */
+    readonly outOf: _angular_core.InputSignal<number | null>;
+    /** Overrides the band-derived tone. */
+    readonly tone: _angular_core.InputSignal<Tone | null>;
+    readonly size: _angular_core.InputSignal<"sm" | "md" | "lg">;
+    readonly resolvedTone: _angular_core.Signal<Tone | null>;
+    badgeClass(): string;
+    sizeClass(): string;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<ScoreBadgeComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<ScoreBadgeComponent, "fx-ui-score-badge", never, { "score": { "alias": "score"; "required": true; "isSignal": true; }; "outOf": { "alias": "outOf"; "required": false; "isSignal": true; }; "tone": { "alias": "tone"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+}
+
+/**
+ * V2 StatusDot — tiny tone-coloured indicator used in list rows, project
+ * cards and stat grids. Optional pulse for "live" states (running scans).
+ *
+ *   <fx-ui-status-dot tone="success" />
+ *   <fx-ui-status-dot tone="warning" [pulse]="true" />
+ */
+declare class StatusDotComponent {
+    readonly tone: _angular_core.InputSignal<Tone | null>;
+    /** Diameter in px. */
+    readonly size: _angular_core.InputSignal<number>;
+    readonly pulse: _angular_core.InputSignal<boolean>;
+    dotClass(): string;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<StatusDotComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<StatusDotComponent, "fx-ui-status-dot", never, { "tone": { "alias": "tone"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "pulse": { "alias": "pulse"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+}
+
+/**
+ * V2 sparkbar — inline mini bar-trend (risk trend on project cards, deltas in
+ * stat grids). Pure DOM, token-coloured; no chart engine.
+ *
+ *   <fx-ui-sparkbar [values]="[3, 5, 2, 8, 6]" />
+ */
+declare class SparkbarComponent {
+    readonly values: _angular_core.InputSignal<number[]>;
+    /** Bar colour; null renders the accent. */
+    readonly tone: _angular_core.InputSignal<Tone | null>;
+    readonly height: _angular_core.InputSignal<number>;
+    readonly bars: _angular_core.Signal<number[]>;
+    barClass(): string;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<SparkbarComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<SparkbarComponent, "fx-ui-sparkbar", never, { "values": { "alias": "values"; "required": false; "isSignal": true; }; "tone": { "alias": "tone"; "required": false; "isSignal": true; }; "height": { "alias": "height"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+}
+
+interface FxSegmentedOption {
+    value: string | number;
+    /** Caller-translated label. */
+    label: string;
+    /** Optional hero-icon before the label. */
+    icon?: string;
+    /** Optional trailing count chip. */
+    count?: number;
+    disabled?: boolean;
+}
+/**
+ * V2 segmented control — mode toggles (Essentials/Advanced), Catalog/Table
+ * view switches, sub-navigation inside a tab. Generic n-option control; the
+ * semantics live with the caller.
+ *
+ * Rendered as a compact pill group (anh Tú 29/08): equal-width options inside
+ * a rounded-full track, with a single "thumb" that SLIDES to the active
+ * option (transform transition — no per-button background repaint).
+ *
+ *   <fx-ui-segmented [options]="modes" [(value)]="mode" />
+ */
+declare class SegmentedComponent {
+    readonly options: _angular_core.InputSignal<FxSegmentedOption[]>;
+    readonly value: _angular_core.ModelSignal<string | number | null>;
+    /** Accessible name for the group. */
+    readonly ariaLabel: _angular_core.InputSignal<string>;
+    /**
+     * Both variants share the pill shape; they differ in the thumb fill:
+     * 'default': raised surface thumb — view switches (Catalog/Table, ref 10).
+     * 'pill': accent-filled thumb — the Essential/Advanced depth toggle
+     * (design refs 04/05).
+     */
+    readonly variant: _angular_core.InputSignal<"default" | "pill">;
+    /** Index the sliding thumb sits on; -1 hides it (no/unknown selection). */
+    readonly activeIndex: _angular_core.Signal<number>;
+    /** Equal-width tracks → the thumb is 1/n of the inner width and slides by
+     *  multiples of its own width. Pure CSS transform, nothing to measure. */
+    readonly thumbWidth: _angular_core.Signal<string>;
+    readonly thumbTransform: _angular_core.Signal<string>;
+    select(option: FxSegmentedOption): void;
+    thumbClass(): string;
+    optionClass(option: FxSegmentedOption): string;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<SegmentedComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<SegmentedComponent, "fx-ui-segmented", never, { "options": { "alias": "options"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "variant": { "alias": "variant"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; }, never, never, true, never>;
+}
+
+interface FxListRowBadge {
+    /** Caller-translated label. */
+    label: string;
+    tone?: Tone | null;
+}
+/**
+ * V2 ListRow — presentational body for master-detail #row templates and other
+ * selectable lists: status dot + title, trailing badges, meta line. Extra
+ * content projects below the meta line.
+ *
+ *   <ng-template #row let-item>
+ *     <fx-ui-list-row
+ *       [title]="item.name"
+ *       [meta]="item.version + ' · ' + item.date"
+ *       [dotTone]="statusTone(item)"
+ *       [badges]="[{ label: item.severity, tone: severityTone(item.severity) }]"
+ *     />
+ *   </ng-template>
+ */
+declare class ListRowComponent {
+    readonly title: _angular_core.InputSignal<string>;
+    readonly meta: _angular_core.InputSignal<string>;
+    readonly badges: _angular_core.InputSignal<FxListRowBadge[]>;
+    readonly dotTone: _angular_core.InputSignal<Tone | null | undefined>;
+    readonly dotPulse: _angular_core.InputSignal<boolean>;
+    badgeClass(badge: FxListRowBadge): string;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<ListRowComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<ListRowComponent, "fx-ui-list-row", never, { "title": { "alias": "title"; "required": true; "isSignal": true; }; "meta": { "alias": "meta"; "required": false; "isSignal": true; }; "badges": { "alias": "badges"; "required": false; "isSignal": true; }; "dotTone": { "alias": "dotTone"; "required": false; "isSignal": true; }; "dotPulse": { "alias": "dotPulse"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
+}
+
+interface FxBarListItem {
+    /** Caller-translated label. */
+    label: string;
+    value: number;
+    /** Shown instead of the raw value (e.g. "9.8", "82%"). */
+    valueLabel?: string;
+    /** Bar colour; null/undefined renders the accent. */
+    tone?: Tone | null;
+    /** Secondary line under the label. */
+    meta?: string;
+    /** Free-form identifier handed back on (select). */
+    data?: any;
+}
+/**
+ * V2 BarList — ranked horizontal bars ("Top projects by risk", "Top critical
+ * attack paths"). Pure DOM (accessible, token-native, clickable) — charts via
+ * ECharts are for time series, not rankings.
+ *
+ *   <fx-ui-bar-list [items]="topRisk" (select)="open($event)" />
+ */
+declare class BarListComponent {
+    readonly items: _angular_core.InputSignal<FxBarListItem[]>;
+    /** Rows render as buttons only when true (a (select) listener exists). */
+    readonly interactive: _angular_core.InputSignal<boolean>;
+    readonly select: _angular_core.OutputEmitterRef<FxBarListItem>;
+    readonly max: _angular_core.Signal<number>;
+    widthOf(item: FxBarListItem): number;
+    barClass(item: FxBarListItem): string;
+    onSelect(item: FxBarListItem): void;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<BarListComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<BarListComponent, "fx-ui-bar-list", never, { "items": { "alias": "items"; "required": false; "isSignal": true; }; "interactive": { "alias": "interactive"; "required": false; "isSignal": true; }; }, { "select": "select"; }, never, never, true, never>;
+}
+
+interface FxFacetOption {
+    value: string | number;
+    /** Caller-translated label. */
+    label: string;
+    count?: number;
+    /** Optional tone dot before the label (severity facets). */
+    tone?: Tone | null;
+}
+interface FxFacetGroup {
+    id: string;
+    /** Caller-translated group heading. */
+    label: string;
+    /** Multi-select (checkbox semantics); default single-select toggle. */
+    multi?: boolean;
+    options: FxFacetOption[];
+}
+type FxFacetSelection = Record<string, (string | number)[]>;
+/**
+ * V2 facets rail — the first column of 3-column lookup screens: filter groups
+ * with counts + a Reset link. Presentational: filtering itself stays in the
+ * page (feed the emitted selection into BaseMasterDetail filters).
+ *
+ *   <div mdFacets>
+ *     <fx-ui-facets-rail [groups]="facetGroups" [selection]="facets"
+ *                        (selectionChange)="onFacets($event)" />
+ *   </div>
+ */
+declare class FacetsRailComponent {
+    readonly groups: _angular_core.InputSignal<FxFacetGroup[]>;
+    readonly selection: _angular_core.InputSignal<FxFacetSelection>;
+    /** Caller-translated label for the reset affordance. */
+    readonly resetLabel: _angular_core.InputSignal<string>;
+    readonly selectionChange: _angular_core.OutputEmitterRef<FxFacetSelection>;
+    readonly hasSelection: _angular_core.Signal<boolean>;
+    isSelected(group: FxFacetGroup, option: FxFacetOption): boolean;
+    toggle(group: FxFacetGroup, option: FxFacetOption): void;
+    reset(): void;
+    toneClass(option: FxFacetOption): string;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<FacetsRailComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<FacetsRailComponent, "fx-ui-facets-rail", never, { "groups": { "alias": "groups"; "required": false; "isSignal": true; }; "selection": { "alias": "selection"; "required": false; "isSignal": true; }; "resetLabel": { "alias": "resetLabel"; "required": false; "isSignal": true; }; }, { "selectionChange": "selectionChange"; }, never, never, true, never>;
+}
+
+interface FxProjectCardChip {
+    /** Caller-translated label. */
+    label: string;
+    tone?: Tone | null;
+}
+interface FxProjectCardMetric {
+    /** Caller-formatted figure ("128", "--"). */
+    value: string | number;
+    /** Caller-translated caption under the figure. */
+    label: string;
+}
+interface FxProjectCard {
+    name: string;
+    description?: string;
+    /** 1–2 char initials rendered in an accent-soft square (design 12). */
+    avatar?: string;
+    /** Small line under the name (schedule / scope) with an optional hero-icon. */
+    sub?: {
+        icon?: string;
+        label: string;
+    };
+    /** Score chip top-right ("High · 82"); rendered as a toned pill. */
+    score?: string | number;
+    scoreTone?: Tone | null;
+    /** Caption under the score chip (kept for pre-V2 callers). */
+    scoreLabel?: string;
+    /** Risk-trend sparkbar values (pre-V2 look; prefer `trend`). */
+    spark?: number[];
+    /**
+     * Design-12 risk trend: one toned block per period, oldest first, with a
+     * caption line underneath ("risk trend" · "128 analyses").
+     */
+    trend?: {
+        tones: (Tone | null)[];
+        caption?: string;
+        aside?: string;
+    };
+    chips?: FxProjectCardChip[];
+    /** Metric columns (Binaries · Findings · …): figure + caption. */
+    metrics?: FxProjectCardMetric[];
+    /** Footer meta line (e.g. "Last analysis · 2d ago"). */
+    meta?: string;
+    /** Footer link label right of the meta ("Open ›"); the whole card emits (open). */
+    openLabel?: string;
+    /** Free-form identifier handed back on (open). */
+    data?: any;
+}
+/**
+ * V2 project card — the Project Management catalog tile (design 12): initials
+ * avatar + name + schedule line, toned score chip, risk-trend blocks, metric
+ * columns and a "Last analysis · … / Open ›" footer.
+ *
+ *   <fx-ui-project-card [card]="project" (open)="goTo(project)" />
+ */
+declare class ProjectCardComponent {
+    readonly card: _angular_core.InputSignal<FxProjectCard>;
+    readonly open: _angular_core.OutputEmitterRef<FxProjectCard>;
+    scoreChipClass(): string;
+    chipClass(chip: FxProjectCardChip): string;
+    blockClass(tone: Tone | null): string;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<ProjectCardComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<ProjectCardComponent, "fx-ui-project-card", never, { "card": { "alias": "card"; "required": true; "isSignal": true; }; }, { "open": "open"; }, never, never, true, never>;
+}
+
+type FxPipelineStageState = 'pending' | 'active' | 'done' | 'error';
+interface FxPipelineStage {
+    id: string;
+    /** Caller-translated label. */
+    label: string;
+    state?: FxPipelineStageState;
+    /** Small line under the label (e.g. "optional", a duration). */
+    description?: string;
+}
+/**
+ * V2 pipeline stepper — the New Analysis 7-stage pipeline header. Renders the
+ * stage strip only; the page owns the stage bodies (project the current one
+ * below). Stage states are data — the parent decides what is done/active.
+ *
+ *   <fx-ui-pipeline-stepper [stages]="stages" (stageClick)="goTo($event)">
+ *     …current stage body…
+ *   </fx-ui-pipeline-stepper>
+ */
+declare class PipelineStepperComponent {
+    readonly stages: _angular_core.InputSignal<FxPipelineStage[]>;
+    /** Only done stages are click-navigable (review a completed step). */
+    readonly clickable: _angular_core.InputSignal<boolean>;
+    readonly stageClick: _angular_core.OutputEmitterRef<number>;
+    stateOf(stage: FxPipelineStage): FxPipelineStageState;
+    circleClass(stage: FxPipelineStage): string;
+    labelClass(stage: FxPipelineStage): string;
+    connectorClass(stage: FxPipelineStage): string;
+    canClick(stage: FxPipelineStage): boolean;
+    onStageClick(stage: FxPipelineStage, index: number): void;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<PipelineStepperComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<PipelineStepperComponent, "fx-ui-pipeline-stepper", never, { "stages": { "alias": "stages"; "required": false; "isSignal": true; }; "clickable": { "alias": "clickable"; "required": false; "isSignal": true; }; }, { "stageClick": "stageClick"; }, never, ["*"], true, never>;
 }
 
 declare class ConfirmationDialogComponent {
@@ -1563,24 +2184,26 @@ declare class ConfirmationDialogComponent {
     constructor(ref: MatDialogRef<ConfirmationDialogComponent>, bindings: any);
     accept(): Promise<void>;
     cancel(): void;
-    static ɵfac: i0.ɵɵFactoryDeclaration<ConfirmationDialogComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<ConfirmationDialogComponent, "fx-ui-confirmation-dialog", never, {}, {}, never, never, false, never>;
-}
-
-declare const MY_MOMENT_FORMATS: {
-    parseInput: string;
-    fullPickerInput: string;
-    datePickerInput: string;
-    timePickerInput: string;
-    monthYearLabel: string;
-    dateA11yLabel: string;
-    monthYearA11yLabel: string;
-};
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<ConfirmationDialogComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<ConfirmationDialogComponent, "fx-ui-confirmation-dialog", never, {}, {}, never, never, true, never>;
+}
+
+/**
+ * Compatibility barrel over the (now standalone) core components.
+ *
+ * Deliberately NOT re-exported anymore: Angular Material —
+ * Material is a behavior layer that stays an
+ * implementation detail of this lib (Playbook §5.1); each standalone
+ * component imports what it needs itself. Apps consume fx-ui-* only.
+ *
+ * Heavy components live in secondary entry points and are not part of this
+ * barrel: @foxeltech/angular-ui/chart, /flow, /rich-text.
+ */
 declare class UiModule {
-    static ɵfac: i0.ɵɵFactoryDeclaration<UiModule, never>;
-    static ɵmod: i0.ɵɵNgModuleDeclaration<UiModule, [typeof InputComponent, typeof SelectComponent, typeof RadioButtonComponent, typeof CheckboxComponent, typeof DndUploadComponent, typeof ButtonComponent, typeof RadioButtonToggleComponent, typeof DatetimePicker, typeof LoadingPanel, typeof SearchBarComponent, typeof TabGroupComponent, typeof TabComponent, typeof HeroIconComponent, typeof ToastComponent, typeof ToastContainerComponent, typeof TagComponent, typeof ChartComponent, typeof SliderComponent, typeof SwitchComponent, typeof RichTextAreaComponent, typeof SkeletonTableLoadingComponent, typeof FlowConnection, typeof CircleProgressBar, typeof TreeDiagram, typeof TableCell, typeof KanbanBoardComponent, typeof DrawerComponent, typeof SkeletonListComponent, typeof SkeletonDetailComponent, typeof StatCardsComponent, typeof EmptyStateComponent, typeof FilterChipsComponent, typeof MeterComponent, typeof SectionCardComponent, typeof InfoFieldComponent, typeof SeverityBadgesComponent, typeof MasterDetailComponent, typeof ConfirmationDialogComponent], [typeof i39.CommonModule, typeof i40.FormsModule, typeof i40.ReactiveFormsModule, typeof i41.RouterModule, typeof i42.OwlDateTimeModule, typeof i42.OwlNativeDateTimeModule, typeof i43.OwlMomentDateTimeModule, typeof HasPermissionDirective, typeof TrimOnBlurDirective, typeof i46.NgHeroiconsModule, typeof i47.VflowComponent, typeof i47.HandleComponent, typeof i47.ResizableComponent, typeof i47.SelectableDirective, typeof i47.MiniMapComponent, typeof i47.NodeToolbarComponent, typeof i47.CustomTemplateEdgeComponent, typeof i47.DragHandleDirective, typeof i47.ConnectionControllerDirective, typeof i47.NodeHtmlTemplateDirective, typeof i47.NodeSvgTemplateDirective, typeof i47.GroupNodeTemplateDirective, typeof i47.EdgeLabelHtmlTemplateDirective, typeof i47.EdgeTemplateDirective, typeof i47.ConnectionTemplateDirective, typeof i47.HandleTemplateDirective, typeof i48.NgxEchartsModule, typeof i49.MatSelectModule, typeof i50.MatRadioModule, typeof i51.MatButtonModule, typeof i52.MatIconModule, typeof i53.MatPaginatorModule, typeof i54.MatTableModule, typeof i55.MatSnackBarModule, typeof i56.MatDialogModule, typeof i57.MatCheckboxModule, typeof i58.MatCardModule, typeof i59.MatDatepickerModule, typeof i60.MatTimepickerModule, typeof i61.MatBadgeModule, typeof i62.MatExpansionModule, typeof i63.MatFormFieldModule, typeof i64.MatMenuModule, typeof i65.MatTooltipModule, typeof i66.DragDropModule], [typeof InputComponent, typeof SelectComponent, typeof RadioButtonComponent, typeof CheckboxComponent, typeof DndUploadComponent, typeof ButtonComponent, typeof RadioButtonToggleComponent, typeof DatetimePicker, typeof LoadingPanel, typeof SearchBarComponent, typeof TabGroupComponent, typeof TabComponent, typeof HeroIconComponent, typeof ToastComponent, typeof ToastContainerComponent, typeof TagComponent, typeof ChartComponent, typeof SliderComponent, typeof SwitchComponent, typeof RichTextAreaComponent, typeof SkeletonTableLoadingComponent, typeof FlowConnection, typeof CircleProgressBar, typeof TreeDiagram, typeof TableCell, typeof KanbanBoardComponent, typeof DrawerComponent, typeof SkeletonListComponent, typeof SkeletonDetailComponent, typeof StatCardsComponent, typeof EmptyStateComponent, typeof FilterChipsComponent, typeof MeterComponent, typeof SectionCardComponent, typeof InfoFieldComponent, typeof SeverityBadgesComponent, typeof MasterDetailComponent, typeof ConfirmationDialogComponent, typeof i40.FormsModule, typeof i40.ReactiveFormsModule, typeof i41.RouterModule, typeof i42.OwlDateTimeModule, typeof i42.OwlNativeDateTimeModule, typeof HasPermissionDirective, typeof i46.NgHeroiconsModule, typeof i49.MatSelectModule, typeof i50.MatRadioModule, typeof i51.MatButtonModule, typeof i52.MatIconModule, typeof i53.MatPaginatorModule, typeof i54.MatTableModule, typeof i55.MatSnackBarModule, typeof i56.MatDialogModule, typeof i57.MatCheckboxModule, typeof i58.MatCardModule, typeof i59.MatDatepickerModule, typeof i60.MatTimepickerModule, typeof i61.MatBadgeModule, typeof i62.MatExpansionModule, typeof i63.MatFormFieldModule, typeof i64.MatMenuModule, typeof i65.MatTooltipModule, typeof i66.DragDropModule]>;
-    static ɵinj: i0.ɵɵInjectorDeclaration<UiModule>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<UiModule, never>;
+    static ɵmod: _angular_core.ɵɵNgModuleDeclaration<UiModule, never, [typeof i1$1.FormsModule, typeof i1$1.ReactiveFormsModule, typeof i2.RouterModule, typeof HasPermissionDirective, typeof TrimOnBlurDirective, typeof InputComponent, typeof SelectComponent, typeof RadioButtonComponent, typeof CheckboxComponent, typeof DndUploadComponent, typeof ButtonComponent, typeof RadioButtonToggleComponent, typeof DatetimePicker, typeof LoadingPanel, typeof SearchBarComponent, typeof TabGroupComponent, typeof TabComponent, typeof HeroIconComponent, typeof ToastComponent, typeof ToastContainerComponent, typeof TagComponent, typeof SliderComponent, typeof SwitchComponent, typeof SkeletonTableLoadingComponent, typeof CircleProgressBar, typeof TreeDiagram, typeof TableCell, typeof KanbanBoardComponent, typeof DrawerComponent, typeof SkeletonListComponent, typeof SkeletonDetailComponent, typeof StatCardsComponent, typeof EmptyStateComponent, typeof FilterChipsComponent, typeof FilterPillsComponent, typeof StageDotsComponent, typeof CodeBlockComponent, typeof ScreenshotFrameComponent, typeof MeterComponent, typeof SectionCardComponent, typeof InfoFieldComponent, typeof SeverityBadgesComponent, typeof MasterDetailComponent, typeof MenuComponent, typeof ThemePickerComponent, typeof PendingBadgeComponent, typeof SampleFrameComponent, typeof ScoreBadgeComponent, typeof StatusDotComponent, typeof SparkbarComponent, typeof SegmentedComponent, typeof ListRowComponent, typeof BarListComponent, typeof FacetsRailComponent, typeof ProjectCardComponent, typeof PipelineStepperComponent, typeof ConfirmationDialogComponent], [typeof InputComponent, typeof SelectComponent, typeof RadioButtonComponent, typeof CheckboxComponent, typeof DndUploadComponent, typeof ButtonComponent, typeof RadioButtonToggleComponent, typeof DatetimePicker, typeof LoadingPanel, typeof SearchBarComponent, typeof TabGroupComponent, typeof TabComponent, typeof HeroIconComponent, typeof ToastComponent, typeof ToastContainerComponent, typeof TagComponent, typeof SliderComponent, typeof SwitchComponent, typeof SkeletonTableLoadingComponent, typeof CircleProgressBar, typeof TreeDiagram, typeof TableCell, typeof KanbanBoardComponent, typeof DrawerComponent, typeof SkeletonListComponent, typeof SkeletonDetailComponent, typeof StatCardsComponent, typeof EmptyStateComponent, typeof FilterChipsComponent, typeof FilterPillsComponent, typeof StageDotsComponent, typeof CodeBlockComponent, typeof ScreenshotFrameComponent, typeof MeterComponent, typeof SectionCardComponent, typeof InfoFieldComponent, typeof SeverityBadgesComponent, typeof MasterDetailComponent, typeof MenuComponent, typeof ThemePickerComponent, typeof PendingBadgeComponent, typeof SampleFrameComponent, typeof ScoreBadgeComponent, typeof StatusDotComponent, typeof SparkbarComponent, typeof SegmentedComponent, typeof ListRowComponent, typeof BarListComponent, typeof FacetsRailComponent, typeof ProjectCardComponent, typeof PipelineStepperComponent, typeof ConfirmationDialogComponent, typeof i1$1.FormsModule, typeof i1$1.ReactiveFormsModule, typeof i2.RouterModule, typeof HasPermissionDirective, typeof TrimOnBlurDirective]>;
+    static ɵinj: _angular_core.ɵɵInjectorDeclaration<UiModule>;
 }
 
-export { AuthInterceptor, AuthStateService, BaseComponent, BaseDialogComponent, BaseMasterDetailComponent, BaseResolver, BaseTableComponent, BreadcrumbService, ButtonComponent, ChartComponent, CheckboxComponent, CircleProgressBar, ConfirmationDialogComponent, DatetimePicker, DndUploadComponent, DrawerComponent, EmptyStateComponent, FilterChipsComponent, FlowConnection, FxLoadingService, FxStorageService, FxToastrService, FxUtils, FxValidators, HasPermissionDirective, HeroIconComponent, HttpLoaderFactory, HttpWrapper, InfoFieldComponent, InputComponent, KanbanBoardComponent, LoadingPanel, MY_MOMENT_FORMATS, MasterDetailComponent, MeterComponent, NotificationService, PermissionGuard, PermissionService, QuillStyleLoaderService, RadioButtonComponent, RadioButtonToggleComponent, RealtimeTableSync, RichTextAreaComponent, SearchBarComponent, SectionCardComponent, SelectComponent, SeverityBadgesComponent, SkeletonDetailComponent, SkeletonListComponent, SkeletonTableLoadingComponent, SliderComponent, StatCardsComponent, SwitchComponent, TabComponent, TabGroupComponent, TableCell, TagComponent, ThemeService, ToastComponent, ToastContainerComponent, TranslationModule, TranslationService, TreeDiagram, TrimOnBlurDirective, UiModule, countTone, createApi, fxListResolver, scoreTone, severityTone, toneBadge, toneBg, toneColor, toneText };
-export type { Breadcrumb, ColumnChangedEvent, FxApiClass, FxFilterChipOption, FxListRequest, FxListResolverContext, FxSeverityBadge, FxStatCard, IChartType, IRadioButton, KanbanColumn, NotificationCallback, NotificationConnectOptions, RealtimeTableEvent, RealtimeTableSyncOptions, TableResult, TagType, ToastData, Tone, TreeNode, UploadResult };
+export { AuthInterceptor, AuthStateService, BarListComponent, BaseComponent, BaseDialogComponent, BaseMasterDetailComponent, BaseResolver, BaseTableComponent, BreadcrumbService, ButtonComponent, CheckboxComponent, CircleProgressBar, CodeBlockComponent, ConfirmationDialogComponent, DatetimePicker, DndUploadComponent, DrawerComponent, EmptyStateComponent, FX_ICON_SPRITE_URL, FacetsRailComponent, FilterChipsComponent, FilterPillsComponent, FxComponent, FxDialogService, FxLoadingService, FxStorageService, FxToastrService, FxUtils, FxValidators, HasPermissionDirective, HeroIconComponent, HttpLoaderFactory, HttpWrapper, InfoFieldComponent, InputComponent, KanbanBoardComponent, ListRowComponent, LoadingPanel, MasterDetailComponent, MenuComponent, MeterComponent, NotificationService, OG_LIGHT_THEMES, OG_PICKER_THEMES, OG_PICKER_THEME_META, OG_THEMES, OG_THEME_META, PendingBadgeComponent, PermissionGuard, PermissionService, PipelineStepperComponent, ProjectCardComponent, RadioButtonComponent, RadioButtonToggleComponent, RealtimeTableSync, SampleFrameComponent, ScoreBadgeComponent, ScreenshotFrameComponent, SearchBarComponent, SectionCardComponent, SegmentedComponent, SelectComponent, SeverityBadgesComponent, SkeletonDetailComponent, SkeletonListComponent, SkeletonTableLoadingComponent, SliderComponent, SparkbarComponent, StageDotsComponent, StatCardsComponent, StatusDotComponent, SwitchComponent, TabComponent, TabGroupComponent, TableCell, TagComponent, ThemePickerComponent, ThemeService, ToastComponent, ToastContainerComponent, TranslationModule, TranslationService, TreeDiagram, TrimOnBlurDirective, UiModule, anyFeatureEnabled, countTone, createApi, featureEnabled, fxListResolver, scoreTone, severityTone, toneBadge, toneBg, toneColor, toneText };
+export type { Breadcrumb, ColumnChangedEvent, DrawerItem, ErrorMessages, FxApiClass, FxBarListItem, FxConfirmOptions, FxFacetGroup, FxFacetOption, FxFacetSelection, FxFeatureFlags, FxFilterChipOption, FxFilterPillOption, FxListRequest, FxListResolverContext, FxListRowBadge, FxMenuItem, FxPipelineStage, FxPipelineStageState, FxProjectCard, FxProjectCardChip, FxProjectCardMetric, FxSegmentedOption, FxSeverityBadge, FxStatCard, FxStatCardDelta, FxTableFilters, IRadioButton, KanbanColumn, NotificationCallback, NotificationConnectOptions, OgTheme, OgThemeMeta, RealtimeTableEvent, RealtimeTableSyncOptions, TableResult, TagType, ToastData, Tone, TreeNode, UploadResult };