@foxeltech/angular-ui 0.7.108 → 0.7.131

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

@@ -16,6 +16,8 @@ import * as i1 from '@ngx-translate/core';
 import { TranslateService } from '@ngx-translate/core';
 import { ComponentType } from '@angular/cdk/portal';
 import { CdkDragDrop } from '@angular/cdk/drag-drop';
+import * as lucide_angular from 'lucide-angular';
+import { LucideIconData } from 'lucide-angular';
 
 declare abstract class BaseComponent implements OnDestroy {
     protected injector: Injector;
@@ -1050,6 +1052,12 @@ interface Breadcrumb {
     mono?: boolean;
     /** Dropdown to switch the entity this crumb names. */
     switcher?: BreadcrumbSwitcher;
+    /**
+     * Renders the crumb as an accent CTA pill instead of a link or a chip — the
+     * reference's "＋ Create project" closing the Project Management trail.
+     * Navigates to `url`; `icon` is the leading mark and defaults to `plus`.
+     */
+    cta?: boolean;
 }
 declare class BreadcrumbService {
     private breadcrumbs$;
@@ -1703,6 +1711,14 @@ interface DrawerItem {
     id: string;
     label: string;
     icon: string;
+    /**
+     * Lucide icon DATA (from `FX_LUCIDE_ICONS`), drawn instead of the HeroIcon
+     * sprite when given. Data, not a name: the LUCIDE_ICONS provider does not
+     * reach a federated remote's components — see FxLucideModule.
+     */
+    iconData?: unknown;
+    /** Fill the lucide mark instead of outlining it (the reference's ❖ is solid). */
+    iconSolid?: boolean;
     /** V2: renders as a non-interactive section caption (flat nav, no accordion). */
     heading?: boolean;
     route?: string;
@@ -1732,6 +1748,13 @@ declare class DrawerComponent implements OnInit, OnDestroy {
     constructor(router: Router);
     ngOnInit(): void;
     ngOnDestroy(): void;
+    /**
+     * Ignores presses while the 300ms width animation is still running. The
+     * button rides the drawer's edge, travelling ~190px as it animates, so a
+     * second press lands on whatever the button has just slid away from — and a
+     * mid-flight toggle leaves the animation and `isExpanded` out of step.
+     */
+    private toggleLocked;
     toggleDrawer(): void;
     toggleAccordion(itemId: string): void;
     isAccordionExpanded(itemId: string): boolean;
@@ -1858,6 +1881,12 @@ interface FxFilterPillOption {
     label: string;
     /** Shown muted beside the label; null/undefined renders no count. */
     count?: number | null;
+    /**
+     * Optional lucide icon DATA (from `FX_LUCIDE_ICONS`), drawn before the label.
+     * Passed as data rather than by name because the LUCIDE_ICONS provider does
+     * not reach a federated remote's components — see FxLucideModule.
+     */
+    icon?: LucideIconData;
 }
 /**
  * V2 filter pills — the quick-filter row above ranked lists (design refs 02,
@@ -2068,8 +2097,27 @@ declare class MasterDetailComponent implements AfterViewInit, AfterContentInit {
     /** 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). */
-    readonly listWidth: _angular_core.InputSignal<string>;
+    /**
+     * Optional CAP on the list pane.
+     *
+     * The list is the flexible track now (the design's `204px 1fr 340px`), so it
+     * takes whatever the rail and the detail leave. Set this only for a screen
+     * whose rows genuinely stop reading better past some width; left unset the
+     * property is not emitted at all and the pane simply fills.
+     */
+    readonly listWidth: _angular_core.InputSignal<string | null>;
+    /**
+     * The detail pane's fixed track — the design's own 340px, and 450px on the
+     * screens anh Tú widened (17/09).
+     *
+     * Pass `'auto'` (or null) to give the detail the SPARE width instead and cap
+     * the list at `listWidth` — the pre-0.7.130 behaviour, which Binaries and
+     * Remediation keep because their panes carry header blocks, metric grids and
+     * step lists that a narrow track cannot hold.
+     */
+    readonly detailWidth: _angular_core.InputSignal<string | null>;
+    /** true = detail takes the spare width; false = it is a fixed track. */
+    protected detailFluid(): boolean;
     /**
      * Chiều cao CHUNG của cả ba cụm (facets / list / detail). Mặc định trừ phần
      * chrome phía trên (topbar + tab strip + context line) khỏi viewport để
@@ -2115,7 +2163,7 @@ declare class MasterDetailComponent implements AfterViewInit, AfterContentInit {
     optionId(index: number): string;
     onKeydown(event: KeyboardEvent, index: number): void;
     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; }; "paneHeight": { "alias": "paneHeight"; "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; }; "pageLabel": { "alias": "pageLabel"; "required": false; "isSignal": true; }; "ofLabel": { "alias": "ofLabel"; "required": false; "isSignal": true; }; "facetsOpen": { "alias": "facetsOpen"; "required": false; "isSignal": true; }; "facetsLabel": { "alias": "facetsLabel"; "required": false; "isSignal": true; }; "expandFacetsLabel": { "alias": "expandFacetsLabel"; "required": false; "isSignal": true; }; "collapseFacetsLabel": { "alias": "collapseFacetsLabel"; "required": false; "isSignal": true; }; }, {}, ["rowTemplate", "detailTemplate"], ["[mdFacets]", "[mdHeader]", "[mdFilters]"], true, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<MasterDetailComponent, "fx-ui-master-detail", never, { "table": { "alias": "table"; "required": false; }; "listWidth": { "alias": "listWidth"; "required": false; "isSignal": true; }; "detailWidth": { "alias": "detailWidth"; "required": false; "isSignal": true; }; "paneHeight": { "alias": "paneHeight"; "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; }; "pageLabel": { "alias": "pageLabel"; "required": false; "isSignal": true; }; "ofLabel": { "alias": "ofLabel"; "required": false; "isSignal": true; }; "facetsOpen": { "alias": "facetsOpen"; "required": false; "isSignal": true; }; "facetsLabel": { "alias": "facetsLabel"; "required": false; "isSignal": true; }; "expandFacetsLabel": { "alias": "expandFacetsLabel"; "required": false; "isSignal": true; }; "collapseFacetsLabel": { "alias": "collapseFacetsLabel"; "required": false; "isSignal": true; }; }, {}, ["rowTemplate", "detailTemplate"], ["[mdFacets]", "[mdHeader]", "[mdFilters]"], true, never>;
 }
 
 interface FxMenuItem {
@@ -2471,7 +2519,6 @@ declare class BarListComponent {
     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>;
@@ -2769,6 +2816,46 @@ declare class UiModule {
     static ɵinj: _angular_core.ɵɵInjectorDeclaration<UiModule>;
 }
 
+/**
+ * The lucide marks this design system draws, PICKED rather than pulled in whole:
+ * `lucide-angular` ships ~2,100 icons and `pick()` is the only thing keeping the
+ * bundle to the ones actually rendered.
+ *
+ * Heroicons remain the general-purpose set — `fx-ui-hero-icon` serves them from
+ * the self-hosted sprite with no runtime icon library, and that does not change.
+ * Lucide is here for the two marks the Binary Intelligence reference draws as
+ * inline SVG of its own, which the sprite has no equivalent of:
+ *
+ *   - `star`      the GitHub star beside a PoC's star count
+ *   - `radiation` the proprietary-exploit mark (identified by matching the
+ *                 reference's path data against lucide-static, 16/09)
+ *   - `download`  the Download PoC action in the exploit detail footer
+ *
+ * And the four sidebar marks, chosen to match the reference's nav GLYPHS shape
+ * for shape rather than by meaning (16/09):
+ *   `▦` → `grid-2x2`   a square split by a cross
+ *   `⊞` → `square-plus` a square with a plus inside
+ *   `▤` → `rows-3`      a square split into three bands
+ *   `❖` → `diamond`     a diamond outline
+ *
+ * Usage: import `FxLucideModule`, then `<lucide-icon name="star" [size]="12" />`.
+ * Names are kebab-case; the component pascal-cases them to look the icon up.
+ */
+declare const FX_LUCIDE_ICONS: {
+    Star: lucide_angular.LucideIconData;
+    Radiation: lucide_angular.LucideIconData;
+    Download: lucide_angular.LucideIconData;
+    Grid2x2: lucide_angular.LucideIconData;
+    SquarePlus: lucide_angular.LucideIconData;
+    Rows3: lucide_angular.LucideIconData;
+    Diamond: lucide_angular.LucideIconData;
+};
+declare class FxLucideModule {
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<FxLucideModule, never>;
+    static ɵmod: _angular_core.ɵɵNgModuleDeclaration<FxLucideModule, never, [typeof lucide_angular.LucideAngularModule], [typeof lucide_angular.LucideAngularModule]>;
+    static ɵinj: _angular_core.ɵɵInjectorDeclaration<FxLucideModule>;
+}
+
 /** Users who asked the OS for reduced motion get instant state changes. */
 declare function fxMotionAllowed(): boolean;
 /** Shared timing so every screen moves the same way. */
@@ -2785,5 +2872,5 @@ declare const FX_MOTION: {
 /** Motion directives exported by UiModule (GSAP-based, reduced-motion aware). */
 declare const FX_MOTION_DIRECTIVES: readonly [typeof FxRevealDirective, typeof FxRevealGroupDirective, typeof FxCountUpDirective];
 
-export { AuthInterceptor, AuthStateService, BarListComponent, BaseComponent, BaseDialogComponent, BaseMasterDetailComponent, BaseTableComponent, BreadcrumbComponent, BreadcrumbService, ButtonComponent, CheckboxComponent, CircleProgressBar, CodeBlockComponent, ConfirmationDialogComponent, DatetimePicker, DndUploadComponent, DrawerComponent, EmptyStateComponent, FX_ICON_SPRITE_URL, FX_MOTION, FX_MOTION_DIRECTIVES, FX_SKELETON_DATA_KEY, FacetsRailComponent, FilterChipsComponent, FilterPillsComponent, FxComponent, FxCountUpDirective, FxDialogService, FxLoadStatusService, FxLoadingService, FxRevealDirective, FxRevealGroupDirective, FxRouteSkeletonService, FxStorageService, FxToastrService, FxUtils, FxValidators, HasPermissionDirective, HeroIconComponent, HttpLoaderFactory, HttpWrapper, InfoFieldComponent, InputComponent, KanbanBoardComponent, ListRowComponent, LoadStatusComponent, 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, RouteSkeletonComponent, SampleFrameComponent, ScoreBadgeComponent, ScreenshotFrameComponent, SearchBarComponent, SectionCardComponent, SegmentedComponent, SelectComponent, SeverityBadgesComponent, SkeletonDashboardComponent, SkeletonDetailComponent, SkeletonFacetsComponent, SkeletonFrameComponent, SkeletonListComponent, SliderComponent, SparkbarComponent, StageDotsComponent, StatCardsComponent, StatusDotComponent, SwitchComponent, TabComponent, TabGroupComponent, TableCell, TagComponent, ThemePickerComponent, ThemeService, ToastComponent, ToastContainerComponent, TranslationModule, TranslationService, TreeDiagram, TrimOnBlurDirective, UiModule, anyFeatureEnabled, countTone, createApi, featureEnabled, fxListResolver, fxMotionAllowed, fxRevealElement, scoreTone, severityTone, toneBadge, toneBadgeSolid, toneBg, toneBorder, toneColor, toneDot, toneDotChart, toneFg, toneScale, toneText, toneTint };
+export { AuthInterceptor, AuthStateService, BarListComponent, BaseComponent, BaseDialogComponent, BaseMasterDetailComponent, BaseTableComponent, BreadcrumbComponent, BreadcrumbService, ButtonComponent, CheckboxComponent, CircleProgressBar, CodeBlockComponent, ConfirmationDialogComponent, DatetimePicker, DndUploadComponent, DrawerComponent, EmptyStateComponent, FX_ICON_SPRITE_URL, FX_LUCIDE_ICONS, FX_MOTION, FX_MOTION_DIRECTIVES, FX_SKELETON_DATA_KEY, FacetsRailComponent, FilterChipsComponent, FilterPillsComponent, FxComponent, FxCountUpDirective, FxDialogService, FxLoadStatusService, FxLoadingService, FxLucideModule, FxRevealDirective, FxRevealGroupDirective, FxRouteSkeletonService, FxStorageService, FxToastrService, FxUtils, FxValidators, HasPermissionDirective, HeroIconComponent, HttpLoaderFactory, HttpWrapper, InfoFieldComponent, InputComponent, KanbanBoardComponent, ListRowComponent, LoadStatusComponent, 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, RouteSkeletonComponent, SampleFrameComponent, ScoreBadgeComponent, ScreenshotFrameComponent, SearchBarComponent, SectionCardComponent, SegmentedComponent, SelectComponent, SeverityBadgesComponent, SkeletonDashboardComponent, SkeletonDetailComponent, SkeletonFacetsComponent, SkeletonFrameComponent, SkeletonListComponent, SliderComponent, SparkbarComponent, StageDotsComponent, StatCardsComponent, StatusDotComponent, SwitchComponent, TabComponent, TabGroupComponent, TableCell, TagComponent, ThemePickerComponent, ThemeService, ToastComponent, ToastContainerComponent, TranslationModule, TranslationService, TreeDiagram, TrimOnBlurDirective, UiModule, anyFeatureEnabled, countTone, createApi, featureEnabled, fxListResolver, fxMotionAllowed, fxRevealElement, scoreTone, severityTone, toneBadge, toneBadgeSolid, toneBg, toneBorder, toneColor, toneDot, toneDotChart, toneFg, toneScale, toneText, toneTint };
 export type { Breadcrumb, BreadcrumbOption, BreadcrumbSwitcher, ColumnChangedEvent, DrawerItem, ErrorMessages, FxApiClass, FxBarListItem, FxConfirmOptions, FxFacetGroup, FxFacetOption, FxFacetSelection, FxFeatureFlags, FxFilterChipOption, FxFilterPillOption, FxListRequest, FxListResolverContext, FxListRowBadge, FxLoadJob, FxMenuItem, FxPipelineStage, FxPipelineStageState, FxProjectCard, FxProjectCardChip, FxProjectCardMetric, FxSegmentedOption, FxSeverityBadge, FxSkeletonBlock, FxSkeletonBlockKind, FxSkeletonBlockSpec, FxSkeletonHint, FxStatCard, FxStatCardDelta, FxTableFilters, IRadioButton, KanbanColumn, NotificationCallback, NotificationConnectOptions, OgTheme, OgThemeMeta, RealtimeTableEvent, RealtimeTableSyncOptions, TableResult, TagType, ToastData, Tone, TreeNode, UploadResult };

package/utilities.css

@@ -8,10 +8,15 @@
 }
 
 @utility btn-common {
-  /* Compact size (anh Tú 29/08): h-8 + 13px label — the pre-V2 h-10 read too
-     large against the V2 density. leading-none: arbitrary text-[13px] inherits
-     lh 1.5 and Archivo's uneven leading floats the ink ~1px above center. */
-  @apply flex text-[13px] leading-none h-8 font-semibold px-large py-small items-center justify-center rounded-lg shadow-sm transition-all duration-200 disabled:opacity-50 disabled:pointer-events-none disabled:cursor-not-allowed;
+  /* The demo's `.og-button--sm` (anh Tú 17/09: compact như New Analysis) —
+     27px tall, 11.5px at weight 400, 12px sides, 7px radius. MEASURED off the
+     reference's own `.og-button--sm.bi-newbtn`, which is the topbar CTA: it
+     wore this shape through `!` overrides because the shared button was a size
+     above it. The h-8 / 13px / 600 this replaces was itself a step down from
+     pre-V2 h-10 (29/08); against V2 panel density it still read one notch
+     heavy. leading-none: an arbitrary font-size inherits lh 1.5 and Archivo's
+     uneven leading floats the ink ~1px above centre. */
+  @apply flex text-[length:var(--og-fs-xs)] leading-none h-[27px] font-normal px-[12px] py-[4px] items-center justify-center rounded-control shadow-sm transition-all duration-200 disabled:opacity-50 disabled:pointer-events-none disabled:cursor-not-allowed;
 }
 
 @utility btn-menu-common {