@unopsitg/ux 21.0.2 → 21.0.5

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@unopsitg/ux",
-  "version": "21.0.2",
+  "version": "21.0.5",
   "description": "UNOPS Angular 21 layout shell, brand theme (PrimeNG / PrimeUIX), and shared types",
   "keywords": [
     "angular",

package/types/unopsitg-ux.d.ts

@@ -1,6 +1,6 @@
 import * as _primeuix_themes_types from '@primeuix/themes/types';
 import * as _angular_core from '@angular/core';
-import { InjectionToken, OnInit, OnDestroy, ElementRef, AfterViewChecked, AfterViewInit } from '@angular/core';
+import { InjectionToken, OnInit, OnDestroy, ElementRef, AfterViewChecked, AfterViewInit, TemplateRef, QueryList } from '@angular/core';
 import { QueryParamsHandling, IsActiveMatchOptions, Router } from '@angular/router';
 import * as _unopsitg_ux from '@unopsitg/ux';
 import * as rxjs from 'rxjs';
@@ -660,6 +660,93 @@ declare class AiCardBgComponent {
     static ɵcmp: _angular_core.ɵɵComponentDeclaration<AiCardBgComponent, "ux-ai-card-bg", never, {}, {}, never, ["*"], true, never>;
 }
 
+interface AiInsight {
+    id: number;
+    title: string;
+    description: string;
+    actionLabel: string;
+    icon: string;
+    iconColor: string;
+}
+declare class AiInsightsCardComponent implements OnInit {
+    title: _angular_core.InputSignal<string>;
+    insights: _angular_core.InputSignal<AiInsight[]>;
+    searchPlaceholder: _angular_core.InputSignal<string>;
+    actionClick: _angular_core.OutputEmitterRef<AiInsight>;
+    expanded: _angular_core.WritableSignal<boolean>;
+    searchQuery: _angular_core.WritableSignal<string>;
+    filteredInsights: _angular_core.Signal<AiInsight[]>;
+    perPage: _angular_core.WritableSignal<number>;
+    page: _angular_core.WritableSignal<number>;
+    first: _angular_core.Signal<number>;
+    paginatedInsights: _angular_core.Signal<AiInsight[]>;
+    private destroyRef;
+    ngOnInit(): void;
+    private calcPerPage;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<AiInsightsCardComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<AiInsightsCardComponent, "ux-ai-insights-card", never, { "title": { "alias": "title"; "required": true; "isSignal": true; }; "insights": { "alias": "insights"; "required": true; "isSignal": true; }; "searchPlaceholder": { "alias": "searchPlaceholder"; "required": false; "isSignal": true; }; }, { "actionClick": "actionClick"; }, never, never, true, never>;
+}
+
+interface DetailTab {
+    value: string;
+    label: string;
+    icon?: string;
+}
+/**
+ * Structural directive that marks a template as content for a specific tab
+ * inside `<ux-detail-layout>`.
+ *
+ * Usage: `<ng-template uxDetailTab="overview">...content...</ng-template>`
+ */
+declare class DetailTabDirective {
+    templateRef: TemplateRef<unknown>;
+    readonly uxDetailTab: _angular_core.InputSignal<string>;
+    constructor(templateRef: TemplateRef<unknown>);
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<DetailTabDirective, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<DetailTabDirective, "[uxDetailTab]", never, { "uxDetailTab": { "alias": "uxDetailTab"; "required": true; "isSignal": true; }; }, {}, never, never, true, never>;
+}
+/**
+ * Reusable detail-page layout shell: sticky header, tabbed main column,
+ * and a persistent right sidebar (typically for AI insights).
+ *
+ * All styling derives from the active PrimeNG brand preset (BrandSoft / BrandCrisp /
+ * BrandContrast) via `--p-*` CSS variables and Tailwind `surface-*` / `primary-*`
+ * utilities (resolved by `tailwindcss-primeui`). No hardcoded colors.
+ *
+ * ```html
+ * <ux-detail-layout [tabs]="myTabs" [(activeTab)]="currentTab">
+ *   <ng-container ux-detail-header>
+ *     ...sticky header content...
+ *   </ng-container>
+ *
+ *   <ng-template uxDetailTab="overview">...tab 1...</ng-template>
+ *   <ng-template uxDetailTab="scope">...tab 2...</ng-template>
+ *
+ *   <ng-container ux-detail-sidebar>
+ *     ...right sidebar (AI card, documents, etc.)...
+ *   </ng-container>
+ *
+ *   <ng-container ux-detail-footer>
+ *     ...audit metadata row...
+ *   </ng-container>
+ * </ux-detail-layout>
+ * ```
+ */
+declare class DetailLayoutComponent {
+    /** Tab definitions for the main content area. */
+    readonly tabs: _angular_core.InputSignal<DetailTab[]>;
+    /** Currently active tab value (two-way bindable). */
+    readonly activeTab: _angular_core.ModelSignal<string>;
+    /** True once the scrollable body has been scrolled past the threshold. */
+    readonly scrolled: _angular_core.WritableSignal<boolean>;
+    /** Tab content templates provided by the consumer. */
+    tabTemplates: QueryList<DetailTabDirective>;
+    getTabTemplate(value: string): TemplateRef<unknown> | null;
+    onScroll(event: Event): void;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<DetailLayoutComponent, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<DetailLayoutComponent, "ux-detail-layout", never, { "tabs": { "alias": "tabs"; "required": true; "isSignal": true; }; "activeTab": { "alias": "activeTab"; "required": false; "isSignal": true; }; }, { "activeTab": "activeTabChange"; }, ["tabTemplates"], ["[ux-detail-header]", "[ux-detail-header-meta]", "[ux-detail-footer]", "[ux-detail-sidebar]"], true, never>;
+}
+
 interface Blog {
     name?: string;
     coverImage?: any;
@@ -874,5 +961,5 @@ interface DialogConfig {
     newTask?: boolean;
 }
 
-export { AiCardBgComponent, AppBreadcrumb, AppConfigurator, AppFooter, AppLayout, AppMenu, AppMenuitem, AppRightMenu, AppSearch, AppSidebar, AppTopbar, AuthLayout, BrandContrast, BrandCrisp, BrandSoft, LayoutService, MENU_MODEL, SIDEBAR_LOGO, TOPBAR_MOBILE_LOGO, brandPresets, brandPrimitives };
-export type { Assignee, Blog, Chat, Comment$1 as Comment, Country, Customer, DialogConfig, File, Folder, Image, KanbanCardType, Comment as KanbanComment, KanbanListType, Task$1 as KanbanTask, LayoutConfig, ListName, Mail, Member$1 as Member, MenuItem, Message, Metric, Partner, Product, Representative, SidebarLogoConfig, Task, TaskList, TopbarMobileLogoConfig };
+export { AiCardBgComponent, AiInsightsCardComponent, AppBreadcrumb, AppConfigurator, AppFooter, AppLayout, AppMenu, AppMenuitem, AppRightMenu, AppSearch, AppSidebar, AppTopbar, AuthLayout, BrandContrast, BrandCrisp, BrandSoft, DetailLayoutComponent, DetailTabDirective, LayoutService, MENU_MODEL, SIDEBAR_LOGO, TOPBAR_MOBILE_LOGO, brandPresets, brandPrimitives };
+export type { AiInsight, Assignee, Blog, Chat, Comment$1 as Comment, Country, Customer, DetailTab, DialogConfig, File, Folder, Image, KanbanCardType, Comment as KanbanComment, KanbanListType, Task$1 as KanbanTask, LayoutConfig, ListName, Mail, Member$1 as Member, MenuItem, Message, Metric, Partner, Product, Representative, SidebarLogoConfig, Task, TaskList, TopbarMobileLogoConfig };