@unipin/angular-applet 21.3.2 → 21.6.0

package/fesm2022/unipin-angular-applet-approval.mjs

@@ -1,11 +1,13 @@
 import * as i0 from '@angular/core';
-import { Injectable, input, model, signal, effect, ChangeDetectionStrategy, Component } from '@angular/core';
+import { Injectable, InjectionToken, input, model, signal, effect, ChangeDetectionStrategy, Component, computed, Inject } from '@angular/core';
 import * as i1 from '@unipin/angular-gql';
-import { DatePipe, JsonPipe } from '@angular/common';
+import { DatePipe, JsonPipe, formatDate } from '@angular/common';
 import { UpInputDirective } from '@unipin/angular-applet/forms';
 import { UpBadgeDirective } from '@unipin/angular-applet/badge';
-import { UpCapitalizaPipe } from '@unipin/angular-applet/common';
+import { UpCapitalizaPipe, formatCapitalize, up } from '@unipin/angular-applet/common';
 import { UpSkeletonDirective } from '@unipin/angular-applet/skeleton';
+import { renderStatusBadge, UpGridComponent } from '@unipin/angular-applet/grids';
+import * as i1$1 from '@angular/router';
 
 class ApprovalService {
     constructor(gql) {
@@ -55,22 +57,30 @@ class ApprovalService {
       `
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: ApprovalService, deps: [{ token: i1.GqlParser }], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: ApprovalService, providedIn: 'root' }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.10", ngImport: i0, type: ApprovalService, deps: [{ token: i1.GqlParser }], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.10", ngImport: i0, type: ApprovalService, providedIn: 'root' }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: ApprovalService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.10", ngImport: i0, type: ApprovalService, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root'
                 }]
         }], ctorParameters: () => [{ type: i1.GqlParser }] });
 
+const APPROVAL_ENTITIES = new InjectionToken('APPROVAL_ENTITIES');
+function provideApprovalEntities(entities) {
+    return {
+        provide: APPROVAL_ENTITIES,
+        useValue: entities
+    };
+}
+
 class UpApprovalFormComponent {
     constructor() {
-        this.approvalData = input.required(...(ngDevMode ? [{ debugName: "approvalData" }] : []));
-        this.isLoading = model(true, ...(ngDevMode ? [{ debugName: "isLoading" }] : []));
-        this.borderColors = signal({}, ...(ngDevMode ? [{ debugName: "borderColors" }] : []));
-        this.backgroundColors = signal({}, ...(ngDevMode ? [{ debugName: "backgroundColors" }] : []));
+        this.approvalData = input.required(...(ngDevMode ? [{ debugName: "approvalData" }] : /* istanbul ignore next */ []));
+        this.isLoading = model(true, ...(ngDevMode ? [{ debugName: "isLoading" }] : /* istanbul ignore next */ []));
+        this.borderColors = signal({}, ...(ngDevMode ? [{ debugName: "borderColors" }] : /* istanbul ignore next */ []));
+        this.backgroundColors = signal({}, ...(ngDevMode ? [{ debugName: "backgroundColors" }] : /* istanbul ignore next */ []));
         this.STATUS_COLOR_MAP = {
             PENDING: {
                 bg: 'bg-yellow-500',
@@ -104,12 +114,12 @@ class UpApprovalFormComponent {
     getColors(status) {
         return this.STATUS_COLOR_MAP[status] ?? this.STATUS_COLOR_MAP.DEFAULT;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: UpApprovalFormComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.0", type: UpApprovalFormComponent, isStandalone: true, selector: "up-approval-form", inputs: { approvalData: { classPropertyName: "approvalData", publicName: "approvalData", isSignal: true, isRequired: true, transformFunction: null }, isLoading: { classPropertyName: "isLoading", publicName: "isLoading", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { isLoading: "isLoadingChange" }, host: { classAttribute: "block space-y-4" }, ngImport: i0, template: "@if (isLoading()) {\n    @for (i of [1,2,3,4,5]; track $index) {\n        <div class=\"border border-border rounded-md px-2 select-none\">\n            <div class=\"px-2 py-4 border-b border-border flex justify-between items-center gap-4\">\n                <div class=\"grow flex items-center gap-2\">\n                    <div \n                        upSkeleton\n                        class=\"h-6 w-4/5 max-w-50\"\n                    ></div>\n                </div>\n\n                <div class=\"shrink-0 text-sm\">\n                    <div \n                        upSkeleton\n                        class=\"h-6 w-screen max-w-30\"\n                    ></div>\n                </div>\n            </div>\n\n            <div class=\"px-2 py-4 space-y-4\">\n                <div class=\"grid grid-cols-1 lg:grid-cols-2 gap-4\">\n                    <div class=\"flex flex-col gap-2\">\n                        <label class=\"text-sm font-medium leading-none\">\n                            Entity\n                        </label>\n\n                        <div \n                            upSkeleton\n                            class=\"h-9 w-full\"\n                        ></div>\n                    </div>\n\n                    <div class=\"flex flex-col gap-2\">\n                        <label class=\"text-sm font-medium leading-none\">\n                            User\n                        </label>\n\n                        <div \n                            upSkeleton\n                            class=\"h-9 w-full\"\n                        ></div>\n                    </div>\n                </div>\n\n                <div class=\"flex flex-col gap-2\">\n                    <label class=\"text-sm font-medium leading-none\">\n                        Remark\n                    </label>\n\n                    <div \n                        upSkeleton\n                        class=\"h-9 w-full\"\n                    ></div>\n                </div>\n\n                <div class=\"flex flex-col gap-2\">\n                    <label class=\"text-sm font-medium leading-none\">\n                        Data\n                    </label>\n\n                    <div \n                        upSkeleton\n                        class=\"h-20 w-full\"\n                    ></div>\n                </div>\n            </div>\n        </div>\n    }\n}\n@else {\n    @for (d of approvalData(); track $index) {\n        <div \n            class=\"border rounded-md px-2 select-none\"\n            [class]=\"borderColors()[$index]\"\n        >\n            <div \n                class=\"px-2 py-4 border-b flex justify-between items-center gap-4\"\n                [class]=\"borderColors()[$index]\"\n            >\n                <div class=\"grow flex items-center gap-2\">\n                    <div \n                        upBadge \n                        class=\"text-white shrink-0\" \n                        [class]=\"backgroundColors()[$index]\"\n                    >\n                        {{ (d.status?? 'Unknown') | upCapitalize }}\n                    </div>\n                </div>\n\n                @if (d.createdAt) {\n                    <div class=\"shrink-0 text-sm text-muted-foreground\">\n                        {{ d.createdAt | date: 'dd LLL yyyy HH:mm' }}\n                    </div>\n                }\n            </div>\n\n            <div class=\"px-2 py-4 space-y-6\">\n                <div class=\"grid grid-cols-1 lg:grid-cols-2 gap-4\">\n                    <div class=\"flex flex-col gap-2\">\n                        <label class=\"text-sm font-medium leading-none\">\n                            Entity\n                        </label>\n\n                        <input \n                            upInput \n                            readonly \n                            [value]=\"d.entity\"\n                        />\n                    </div>\n\n                    <div class=\"flex flex-col gap-2\">\n                        <label class=\"text-sm font-medium leading-none\">\n                            User\n                        </label>\n\n                        <input \n                            upInput \n                            readonly \n                            [value]=\"d.createdByUser?.name?? '-'\"\n                        />\n                    </div>\n                </div>\n\n                <div class=\"flex flex-col gap-2\">\n                    <label class=\"text-sm font-medium leading-none\">\n                        Remark\n                    </label>\n\n                    <input \n                        upInput \n                        readonly \n                        [value]=\"d.remark\"\n                    />\n                </div>\n\n                <div class=\"flex flex-col gap-2\">\n                    <label class=\"text-sm font-medium leading-none\">\n                        Data\n                    </label>\n\n                    <textarea \n                        upInput \n                        readonly\n                        class=\"min-h-50 resize-none\"\n                        [value]=\"d.data | json\"\n                    >\n                    </textarea>\n                </div>\n            </div>\n        </div>\n    }\n}\n", dependencies: [{ kind: "directive", type: UpInputDirective, selector: "[upInput]", inputs: ["class"], exportAs: ["upInput"] }, { kind: "directive", type: UpBadgeDirective, selector: "[upBadge]", inputs: ["variant", "class"], exportAs: ["upBadge"] }, { kind: "directive", type: UpSkeletonDirective, selector: "[upSkeleton]", inputs: ["class"], exportAs: ["upSkeleton"] }, { kind: "pipe", type: DatePipe, name: "date" }, { kind: "pipe", type: JsonPipe, name: "json" }, { kind: "pipe", type: UpCapitalizaPipe, name: "upCapitalize" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.10", ngImport: i0, type: UpApprovalFormComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.10", type: UpApprovalFormComponent, isStandalone: true, selector: "up-approval-form", inputs: { approvalData: { classPropertyName: "approvalData", publicName: "approvalData", isSignal: true, isRequired: true, transformFunction: null }, isLoading: { classPropertyName: "isLoading", publicName: "isLoading", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { isLoading: "isLoadingChange" }, host: { classAttribute: "block space-y-4" }, ngImport: i0, template: "@if (isLoading()) {\n    @for (i of [1,2,3,4,5]; track $index) {\n        <div class=\"border border-border rounded-md px-2 select-none\">\n            <div class=\"px-2 py-4 border-b border-border flex justify-between items-center gap-4\">\n                <div class=\"grow flex items-center gap-2\">\n                    <div \n                        upSkeleton\n                        class=\"h-6 w-4/5 max-w-50\"\n                    ></div>\n                </div>\n\n                <div class=\"shrink-0 text-sm\">\n                    <div \n                        upSkeleton\n                        class=\"h-6 w-screen max-w-30\"\n                    ></div>\n                </div>\n            </div>\n\n            <div class=\"px-2 py-4 space-y-4\">\n                <div class=\"grid grid-cols-1 lg:grid-cols-2 gap-4\">\n                    <div class=\"flex flex-col gap-2\">\n                        <label class=\"text-sm font-medium leading-none\">\n                            Entity\n                        </label>\n\n                        <div \n                            upSkeleton\n                            class=\"h-9 w-full\"\n                        ></div>\n                    </div>\n\n                    <div class=\"flex flex-col gap-2\">\n                        <label class=\"text-sm font-medium leading-none\">\n                            User\n                        </label>\n\n                        <div \n                            upSkeleton\n                            class=\"h-9 w-full\"\n                        ></div>\n                    </div>\n                </div>\n\n                <div class=\"flex flex-col gap-2\">\n                    <label class=\"text-sm font-medium leading-none\">\n                        Remark\n                    </label>\n\n                    <div \n                        upSkeleton\n                        class=\"h-9 w-full\"\n                    ></div>\n                </div>\n\n                <div class=\"flex flex-col gap-2\">\n                    <label class=\"text-sm font-medium leading-none\">\n                        Data\n                    </label>\n\n                    <div \n                        upSkeleton\n                        class=\"h-20 w-full\"\n                    ></div>\n                </div>\n            </div>\n        </div>\n    }\n}\n@else {\n    @for (d of approvalData(); track $index) {\n        <div \n            class=\"border rounded-md px-2 select-none\"\n            [class]=\"borderColors()[$index]\"\n        >\n            <div \n                class=\"px-2 py-4 border-b flex justify-between items-center gap-4\"\n                [class]=\"borderColors()[$index]\"\n            >\n                <div class=\"grow flex items-center gap-2\">\n                    <div \n                        upBadge \n                        class=\"text-white shrink-0\" \n                        [class]=\"backgroundColors()[$index]\"\n                    >\n                        {{ (d.status?? 'Unknown') | upCapitalize }}\n                    </div>\n                </div>\n\n                @if (d.createdAt) {\n                    <div class=\"shrink-0 text-sm text-muted-foreground\">\n                        {{ d.createdAt | date: 'dd LLL yyyy HH:mm' }}\n                    </div>\n                }\n            </div>\n\n            <div class=\"px-2 py-4 space-y-6\">\n                <div class=\"grid grid-cols-1 lg:grid-cols-2 gap-4\">\n                    <div class=\"flex flex-col gap-2\">\n                        <label class=\"text-sm font-medium leading-none\">\n                            Entity\n                        </label>\n\n                        <input \n                            upInput \n                            readonly \n                            [value]=\"d.entity\"\n                        />\n                    </div>\n\n                    <div class=\"flex flex-col gap-2\">\n                        <label class=\"text-sm font-medium leading-none\">\n                            User\n                        </label>\n\n                        <input \n                            upInput \n                            readonly \n                            [value]=\"d.createdByUser?.name?? '-'\"\n                        />\n                    </div>\n                </div>\n\n                <div class=\"flex flex-col gap-2\">\n                    <label class=\"text-sm font-medium leading-none\">\n                        Remark\n                    </label>\n\n                    <input \n                        upInput \n                        readonly \n                        [value]=\"d.remark\"\n                    />\n                </div>\n\n                <div class=\"flex flex-col gap-2\">\n                    <label class=\"text-sm font-medium leading-none\">\n                        Data\n                    </label>\n\n                    <textarea \n                        upInput \n                        readonly\n                        class=\"min-h-50 resize-none\"\n                        [value]=\"d.data | json\"\n                    >\n                    </textarea>\n                </div>\n            </div>\n        </div>\n    }\n}\n", dependencies: [{ kind: "directive", type: UpInputDirective, selector: "[upInput]", inputs: ["class"], exportAs: ["upInput"] }, { kind: "directive", type: UpBadgeDirective, selector: "[upBadge]", inputs: ["variant", "class"], exportAs: ["upBadge"] }, { kind: "directive", type: UpSkeletonDirective, selector: "[upSkeleton]", inputs: ["class"], exportAs: ["upSkeleton"] }, { kind: "pipe", type: DatePipe, name: "date" }, { kind: "pipe", type: JsonPipe, name: "json" }, { kind: "pipe", type: UpCapitalizaPipe, name: "upCapitalize" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: UpApprovalFormComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.10", ngImport: i0, type: UpApprovalFormComponent, decorators: [{
             type: Component,
-            args: [{ standalone: true, selector: 'up-approval-form', changeDetection: ChangeDetectionStrategy.OnPush, host: {
+            args: [{ selector: 'up-approval-form', changeDetection: ChangeDetectionStrategy.OnPush, host: {
                         class: 'block space-y-4'
                     }, imports: [
                         DatePipe,
@@ -121,9 +131,108 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImpor
                     ], template: "@if (isLoading()) {\n    @for (i of [1,2,3,4,5]; track $index) {\n        <div class=\"border border-border rounded-md px-2 select-none\">\n            <div class=\"px-2 py-4 border-b border-border flex justify-between items-center gap-4\">\n                <div class=\"grow flex items-center gap-2\">\n                    <div \n                        upSkeleton\n                        class=\"h-6 w-4/5 max-w-50\"\n                    ></div>\n                </div>\n\n                <div class=\"shrink-0 text-sm\">\n                    <div \n                        upSkeleton\n                        class=\"h-6 w-screen max-w-30\"\n                    ></div>\n                </div>\n            </div>\n\n            <div class=\"px-2 py-4 space-y-4\">\n                <div class=\"grid grid-cols-1 lg:grid-cols-2 gap-4\">\n                    <div class=\"flex flex-col gap-2\">\n                        <label class=\"text-sm font-medium leading-none\">\n                            Entity\n                        </label>\n\n                        <div \n                            upSkeleton\n                            class=\"h-9 w-full\"\n                        ></div>\n                    </div>\n\n                    <div class=\"flex flex-col gap-2\">\n                        <label class=\"text-sm font-medium leading-none\">\n                            User\n                        </label>\n\n                        <div \n                            upSkeleton\n                            class=\"h-9 w-full\"\n                        ></div>\n                    </div>\n                </div>\n\n                <div class=\"flex flex-col gap-2\">\n                    <label class=\"text-sm font-medium leading-none\">\n                        Remark\n                    </label>\n\n                    <div \n                        upSkeleton\n                        class=\"h-9 w-full\"\n                    ></div>\n                </div>\n\n                <div class=\"flex flex-col gap-2\">\n                    <label class=\"text-sm font-medium leading-none\">\n                        Data\n                    </label>\n\n                    <div \n                        upSkeleton\n                        class=\"h-20 w-full\"\n                    ></div>\n                </div>\n            </div>\n        </div>\n    }\n}\n@else {\n    @for (d of approvalData(); track $index) {\n        <div \n            class=\"border rounded-md px-2 select-none\"\n            [class]=\"borderColors()[$index]\"\n        >\n            <div \n                class=\"px-2 py-4 border-b flex justify-between items-center gap-4\"\n                [class]=\"borderColors()[$index]\"\n            >\n                <div class=\"grow flex items-center gap-2\">\n                    <div \n                        upBadge \n                        class=\"text-white shrink-0\" \n                        [class]=\"backgroundColors()[$index]\"\n                    >\n                        {{ (d.status?? 'Unknown') | upCapitalize }}\n                    </div>\n                </div>\n\n                @if (d.createdAt) {\n                    <div class=\"shrink-0 text-sm text-muted-foreground\">\n                        {{ d.createdAt | date: 'dd LLL yyyy HH:mm' }}\n                    </div>\n                }\n            </div>\n\n            <div class=\"px-2 py-4 space-y-6\">\n                <div class=\"grid grid-cols-1 lg:grid-cols-2 gap-4\">\n                    <div class=\"flex flex-col gap-2\">\n                        <label class=\"text-sm font-medium leading-none\">\n                            Entity\n                        </label>\n\n                        <input \n                            upInput \n                            readonly \n                            [value]=\"d.entity\"\n                        />\n                    </div>\n\n                    <div class=\"flex flex-col gap-2\">\n                        <label class=\"text-sm font-medium leading-none\">\n                            User\n                        </label>\n\n                        <input \n                            upInput \n                            readonly \n                            [value]=\"d.createdByUser?.name?? '-'\"\n                        />\n                    </div>\n                </div>\n\n                <div class=\"flex flex-col gap-2\">\n                    <label class=\"text-sm font-medium leading-none\">\n                        Remark\n                    </label>\n\n                    <input \n                        upInput \n                        readonly \n                        [value]=\"d.remark\"\n                    />\n                </div>\n\n                <div class=\"flex flex-col gap-2\">\n                    <label class=\"text-sm font-medium leading-none\">\n                        Data\n                    </label>\n\n                    <textarea \n                        upInput \n                        readonly\n                        class=\"min-h-50 resize-none\"\n                        [value]=\"d.data | json\"\n                    >\n                    </textarea>\n                </div>\n            </div>\n        </div>\n    }\n}\n" }]
         }], ctorParameters: () => [], propDecorators: { approvalData: [{ type: i0.Input, args: [{ isSignal: true, alias: "approvalData", required: true }] }], isLoading: [{ type: i0.Input, args: [{ isSignal: true, alias: "isLoading", required: false }] }, { type: i0.Output, args: ["isLoadingChange"] }] } });
 
+class UpApprovalGridComponent {
+    constructor(entities, router, route, approvalService) {
+        this.entities = entities;
+        this.router = router;
+        this.route = route;
+        this.approvalService = approvalService;
+        this.detailUrl = input('/approval', ...(ngDevMode ? [{ debugName: "detailUrl" }] : /* istanbul ignore next */ []));
+        this.inlineClass = input('', { ...(ngDevMode ? { debugName: "inlineClass" } : /* istanbul ignore next */ {}), alias: 'class' });
+        this.noRowText = 'Approval not found';
+        this.columnDefs = [
+            {
+                field: 'entity',
+                headerName: 'Entity'
+            },
+            {
+                field: 'remark',
+                headerName: 'Remark'
+            },
+            {
+                field: 'sourcePlatform',
+                headerName: 'Source Platform'
+            },
+            {
+                maxWidth: 130,
+                field: 'status',
+                headerName: 'Status',
+                cellRenderer: ({ value }) => renderStatusBadge(value, {})
+            },
+            {
+                maxWidth: 100,
+                field: 'type',
+                sortable: false,
+                headerName: 'Type',
+                cellRenderer: ({ value }) => formatCapitalize(value ?? '')
+            },
+            {
+                sort: 'desc',
+                field: 'createdAt',
+                headerName: 'Created Date',
+                valueFormatter: ({ value }) => value && formatDate(value, 'dd MMM yyyy HH:mm', 'en-US')
+            }
+        ];
+        this._computedClass = computed(() => {
+            return up('flex flex-col size-full', this.inlineClass());
+        }, ...(ngDevMode ? [{ debugName: "_computedClass" }] : /* istanbul ignore next */ []));
+        this.input = {
+            page: 0,
+            pageSize: 50
+        };
+        this.input.entity = this.entities ?? [];
+    }
+    ngOnDestroy() {
+        this.sub?.unsubscribe();
+    }
+    onGridReady({ api }) {
+        this.gridApi = api;
+    }
+    openDetail({ guid }) {
+        this.router.navigate([`${this.detailUrl()}/${guid}`], { preserveFragment: true });
+    }
+    selectApprovals() {
+        if (!this.gridApi) {
+            return;
+        }
+        const dataGrid = this.gridApi.getSelectedRows();
+        this.selectedApprovalGroupGuid = dataGrid.length === 0 ? undefined : dataGrid[0].approvalGroup.guid;
+        this.gridApi.refreshCells({ force: true });
+    }
+    datasourceRefreshed({ page, pageSize, sort, successCallback, failCallback }) {
+        const dir = sort?.sort || 'desc';
+        const sortBy = sort?.colId || 'createdAt';
+        this.input.page = page;
+        this.input.sortBy = sortBy;
+        this.input.pageSize = pageSize;
+        this.input.sortDirection = dir;
+        this.sub = this.approvalService.query(this.input).subscribe({
+            next: ({ data: { approvalMsApprovals: { data, totalRecord } } }) => {
+                successCallback(data ?? [], totalRecord ?? 0);
+            },
+            error: () => {
+                failCallback('Failed to load approvals data');
+            }
+        });
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.10", ngImport: i0, type: UpApprovalGridComponent, deps: [{ token: APPROVAL_ENTITIES }, { token: i1$1.Router }, { token: i1$1.ActivatedRoute }, { token: ApprovalService }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.10", type: UpApprovalGridComponent, isStandalone: true, selector: "up-approval-grid", inputs: { detailUrl: { classPropertyName: "detailUrl", publicName: "detailUrl", isSignal: true, isRequired: false, transformFunction: null }, inlineClass: { classPropertyName: "inlineClass", publicName: "class", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "_computedClass()" } }, ngImport: i0, template: "<div class=\"d-flex align-items-center justify-content-between gap-4 p-4 shrink-0 flex-wrap\">\n    <div class=\"grow d-flex align-items-center gap-3\">\n        <h3 class=\"m-0 text-2xl font-semibold\">Approval</h3>\n    </div>\n\n    <!-- TODO : Add filter for approval list -->     \n</div>\n\n<div class=\"grow min-h-0 overflow-hidden\">\n    <up-grid\n        id=\"grid-approval-grid\"\n        rowModelType=\"infinite\"\n\n        [noRowText]=\"noRowText\"\n        [columnDefs]=\"columnDefs\"\n        (rowClicked)=\"openDetail($event)\"\n        (gridReady)=\"onGridReady($event)\"\n        (datasourceRefreshed)=\"datasourceRefreshed($event)\"\n    />\n</div>\n", dependencies: [{ kind: "component", type: UpGridComponent, selector: "up-grid", inputs: ["columnDefs", "noRowText", "rowModelType", "rowSelection", "getRowClass", "id", "class", "rowPerPage", "pagination"], outputs: ["rowPerPageChange", "gridReady", "rowClicked", "selectionChanged", "datasourceRefreshed"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.10", ngImport: i0, type: UpApprovalGridComponent, decorators: [{
+            type: Component,
+            args: [{ standalone: true, selector: 'up-approval-grid', changeDetection: ChangeDetectionStrategy.OnPush, host: {
+                        '[class]': '_computedClass()',
+                    }, imports: [
+                        UpGridComponent
+                    ], template: "<div class=\"d-flex align-items-center justify-content-between gap-4 p-4 shrink-0 flex-wrap\">\n    <div class=\"grow d-flex align-items-center gap-3\">\n        <h3 class=\"m-0 text-2xl font-semibold\">Approval</h3>\n    </div>\n\n    <!-- TODO : Add filter for approval list -->     \n</div>\n\n<div class=\"grow min-h-0 overflow-hidden\">\n    <up-grid\n        id=\"grid-approval-grid\"\n        rowModelType=\"infinite\"\n\n        [noRowText]=\"noRowText\"\n        [columnDefs]=\"columnDefs\"\n        (rowClicked)=\"openDetail($event)\"\n        (gridReady)=\"onGridReady($event)\"\n        (datasourceRefreshed)=\"datasourceRefreshed($event)\"\n    />\n</div>\n" }]
+        }], ctorParameters: () => [{ type: undefined, decorators: [{
+                    type: Inject,
+                    args: [APPROVAL_ENTITIES]
+                }] }, { type: i1$1.Router }, { type: i1$1.ActivatedRoute }, { type: ApprovalService }], propDecorators: { detailUrl: [{ type: i0.Input, args: [{ isSignal: true, alias: "detailUrl", required: false }] }], inlineClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }] } });
+
 /**
  * Generated bundle index. Do not edit.
  */
 
-export { ApprovalService, UpApprovalFormComponent };
+export { ApprovalService, UpApprovalFormComponent, UpApprovalGridComponent, provideApprovalEntities };
 //# sourceMappingURL=unipin-angular-applet-approval.mjs.map

package/fesm2022/unipin-angular-applet-approval.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"unipin-angular-applet-approval.mjs","sources":["../../../projects/unipin-angular/approval/services/approval.service.ts","../../../projects/unipin-angular/approval/component/form/approval-form.component.ts","../../../projects/unipin-angular/approval/component/form/approval-form.component.html","../../../projects/unipin-angular/approval/unipin-angular-applet-approval.ts"],"sourcesContent":["import { Injectable } from '@angular/core';\nimport { Observable } from 'rxjs';\nimport { CacheStrategy, GqlParser, MutationResult, QueryResult } from '@unipin/angular-gql';\nimport { ApprovalCriteria, PageableResponse, MutationApprovalMsApproveOrDeclineRequestArgs } from '@unipin/graphql-schema';\n\n@Injectable({\n  providedIn: 'root'\n})\nexport class ApprovalService {\n\n  constructor(\n    protected readonly gql: GqlParser\n  ) { }\n\n  public query(\n    input: ApprovalCriteria, \n    extraAttr: string = '', \n    cacheStrategy?: CacheStrategy\n  ): Observable<QueryResult<{ approvalMsApprovals: PageableResponse }>>{\n    \n    return this.gql.query({\n      operationName: 'QueryApproval',\n      cacheStrategy,\n      variables: { \n        input \n      },\n      query: `\n        query QueryApproval($input: ApprovalCriteria) {\n          approvalMsApprovals(input: $input) {\n            data {\n              guid \n              createdAt \n              entity \n              remark \n              sourcePlatform \n              status \n              type \n              createdByUser {\n                guid\n                name\n              }\n              approvalGroup { \n                guid \n              }\n              ${ extraAttr }\n            }\n            ${ input.page === 0? 'totalRecord' : '' }\n          }\n        }\n      `\n    });\n  }\n\n  public request(variables: MutationApprovalMsApproveOrDeclineRequestArgs): Observable<MutationResult<{ approvalMsApproveOrDeclineRequest: string }>>{\n    \n    return this.gql.mutate({\n      variables,\n      operationName: variables.isApprove? 'ApproveApproval' : 'DeclineApproval',\n      mutation: `\n        mutation ${ variables.isApprove? 'ApproveApproval' : 'DeclineApproval'} ($approvalGroupGuid: String, $guids: [String], $isApprove: Boolean, $reason: String) {\n          approvalMsApproveOrDeclineRequest(approvalGroupGuid: $approvalGroupGuid, guids: $guids, isApprove: $isApprove, reason: $reason)\n        }\n      `\n    });\n  }\n}\n","import { ChangeDetectionStrategy, Component, effect, input, model, signal } from '@angular/core';\nimport { DatePipe, JsonPipe } from '@angular/common';\nimport { Approval } from '@unipin/graphql-schema';\nimport { UpInputDirective } from '@unipin/angular-applet/forms';\nimport { UpBadgeDirective } from '@unipin/angular-applet/badge';\nimport { UpCapitalizaPipe } from '@unipin/angular-applet/common';\nimport { UpSkeletonDirective } from '@unipin/angular-applet/skeleton';\n\n\n@Component({\n  standalone: true,\n  selector: 'up-approval-form',\n  templateUrl: './approval-form.component.html',\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  host: {\n    class: 'block space-y-4'\n  },\n  imports: [\n    DatePipe,\n    JsonPipe,\n    UpCapitalizaPipe,\n    UpInputDirective,\n    UpBadgeDirective,\n    UpSkeletonDirective\n  ]\n})\nexport class UpApprovalFormComponent {\n  \n  public readonly approvalData = input.required<Approval[]>();\n  public readonly isLoading = model<boolean>(true);\n\n  public readonly borderColors = signal<{ [key: number]: string }>({});\n  public readonly backgroundColors = signal<{ [key: number]: string }>({});\n\n  protected readonly STATUS_COLOR_MAP = {\n    PENDING: { \n      bg: 'bg-yellow-500', \n      border: 'border-yellow-500' \n    },\n    APPROVED: { \n      bg: 'bg-green-700', \n      border: 'border-green-700' \n    },\n    DECLINED: { \n      bg: 'bg-destructive', \n      border: 'border-destructive' \n    },\n    DEFAULT: { \n      bg: 'bg-primary', \n      border: 'border-primary' \n    },\n  };\n\n  constructor() {\n    effect(\n      () => {\n        const bg: any = {};\n        const border: any = {};\n  \n        this.approvalData().forEach(\n          (item, index) => {\n            const colors = this.getColors(item.status);\n            \n            bg[index] = colors.bg;\n            border[index] = colors.border;\n          }\n        );\n  \n        this.backgroundColors.set(bg);\n        this.borderColors.set(border);\n      }\n    );\n  }\n\n  protected getColors(status?: string | null): { bg: string, border: string}{\n    return this.STATUS_COLOR_MAP[status as keyof typeof this.STATUS_COLOR_MAP]?? this.STATUS_COLOR_MAP.DEFAULT;\n  }\n}\n","@if (isLoading()) {\n    @for (i of [1,2,3,4,5]; track $index) {\n        <div class=\"border border-border rounded-md px-2 select-none\">\n            <div class=\"px-2 py-4 border-b border-border flex justify-between items-center gap-4\">\n                <div class=\"grow flex items-center gap-2\">\n                    <div \n                        upSkeleton\n                        class=\"h-6 w-4/5 max-w-50\"\n                    ></div>\n                </div>\n\n                <div class=\"shrink-0 text-sm\">\n                    <div \n                        upSkeleton\n                        class=\"h-6 w-screen max-w-30\"\n                    ></div>\n                </div>\n            </div>\n\n            <div class=\"px-2 py-4 space-y-4\">\n                <div class=\"grid grid-cols-1 lg:grid-cols-2 gap-4\">\n                    <div class=\"flex flex-col gap-2\">\n                        <label class=\"text-sm font-medium leading-none\">\n                            Entity\n                        </label>\n\n                        <div \n                            upSkeleton\n                            class=\"h-9 w-full\"\n                        ></div>\n                    </div>\n\n                    <div class=\"flex flex-col gap-2\">\n                        <label class=\"text-sm font-medium leading-none\">\n                            User\n                        </label>\n\n                        <div \n                            upSkeleton\n                            class=\"h-9 w-full\"\n                        ></div>\n                    </div>\n                </div>\n\n                <div class=\"flex flex-col gap-2\">\n                    <label class=\"text-sm font-medium leading-none\">\n                        Remark\n                    </label>\n\n                    <div \n                        upSkeleton\n                        class=\"h-9 w-full\"\n                    ></div>\n                </div>\n\n                <div class=\"flex flex-col gap-2\">\n                    <label class=\"text-sm font-medium leading-none\">\n                        Data\n                    </label>\n\n                    <div \n                        upSkeleton\n                        class=\"h-20 w-full\"\n                    ></div>\n                </div>\n            </div>\n        </div>\n    }\n}\n@else {\n    @for (d of approvalData(); track $index) {\n        <div \n            class=\"border rounded-md px-2 select-none\"\n            [class]=\"borderColors()[$index]\"\n        >\n            <div \n                class=\"px-2 py-4 border-b flex justify-between items-center gap-4\"\n                [class]=\"borderColors()[$index]\"\n            >\n                <div class=\"grow flex items-center gap-2\">\n                    <div \n                        upBadge \n                        class=\"text-white shrink-0\" \n                        [class]=\"backgroundColors()[$index]\"\n                    >\n                        {{ (d.status?? 'Unknown') | upCapitalize }}\n                    </div>\n                </div>\n\n                @if (d.createdAt) {\n                    <div class=\"shrink-0 text-sm text-muted-foreground\">\n                        {{ d.createdAt | date: 'dd LLL yyyy HH:mm' }}\n                    </div>\n                }\n            </div>\n\n            <div class=\"px-2 py-4 space-y-6\">\n                <div class=\"grid grid-cols-1 lg:grid-cols-2 gap-4\">\n                    <div class=\"flex flex-col gap-2\">\n                        <label class=\"text-sm font-medium leading-none\">\n                            Entity\n                        </label>\n\n                        <input \n                            upInput \n                            readonly \n                            [value]=\"d.entity\"\n                        />\n                    </div>\n\n                    <div class=\"flex flex-col gap-2\">\n                        <label class=\"text-sm font-medium leading-none\">\n                            User\n                        </label>\n\n                        <input \n                            upInput \n                            readonly \n                            [value]=\"d.createdByUser?.name?? '-'\"\n                        />\n                    </div>\n                </div>\n\n                <div class=\"flex flex-col gap-2\">\n                    <label class=\"text-sm font-medium leading-none\">\n                        Remark\n                    </label>\n\n                    <input \n                        upInput \n                        readonly \n                        [value]=\"d.remark\"\n                    />\n                </div>\n\n                <div class=\"flex flex-col gap-2\">\n                    <label class=\"text-sm font-medium leading-none\">\n                        Data\n                    </label>\n\n                    <textarea \n                        upInput \n                        readonly\n                        class=\"min-h-50 resize-none\"\n                        [value]=\"d.data | json\"\n                    >\n                    </textarea>\n                </div>\n            </div>\n        </div>\n    }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"unipin-angular-applet-approval.mjs","sources":["../../../projects/unipin-angular/approval/services/approval.service.ts","../../../projects/unipin-angular/approval/component/grid/provide-approval-entities.util.ts","../../../projects/unipin-angular/approval/component/form/approval-form.component.ts","../../../projects/unipin-angular/approval/component/form/approval-form.component.html","../../../projects/unipin-angular/approval/component/grid/approval-grid.component.ts","../../../projects/unipin-angular/approval/component/grid/approval-grid.component.html","../../../projects/unipin-angular/approval/unipin-angular-applet-approval.ts"],"sourcesContent":["import { Injectable } from '@angular/core';\nimport { Observable } from 'rxjs';\nimport { CacheStrategy, GqlParser, MutationResult, QueryResult } from '@unipin/angular-gql';\nimport { ApprovalCriteria, PageableResponse, MutationApprovalMsApproveOrDeclineRequestArgs } from '@unipin/graphql-schema';\n\n@Injectable({\n  providedIn: 'root'\n})\nexport class ApprovalService {\n\n  constructor(\n    protected readonly gql: GqlParser\n  ) { }\n\n  public query(\n    input: ApprovalCriteria, \n    extraAttr: string = '', \n    cacheStrategy?: CacheStrategy\n  ): Observable<QueryResult<{ approvalMsApprovals: PageableResponse }>>{\n    \n    return this.gql.query({\n      operationName: 'QueryApproval',\n      cacheStrategy,\n      variables: { \n        input \n      },\n      query: `\n        query QueryApproval($input: ApprovalCriteria) {\n          approvalMsApprovals(input: $input) {\n            data {\n              guid \n              createdAt \n              entity \n              remark \n              sourcePlatform \n              status \n              type \n              createdByUser {\n                guid\n                name\n              }\n              approvalGroup { \n                guid \n              }\n              ${ extraAttr }\n            }\n            ${ input.page === 0? 'totalRecord' : '' }\n          }\n        }\n      `\n    });\n  }\n\n  public request(variables: MutationApprovalMsApproveOrDeclineRequestArgs): Observable<MutationResult<{ approvalMsApproveOrDeclineRequest: string }>>{\n    \n    return this.gql.mutate({\n      variables,\n      operationName: variables.isApprove? 'ApproveApproval' : 'DeclineApproval',\n      mutation: `\n        mutation ${ variables.isApprove? 'ApproveApproval' : 'DeclineApproval'} ($approvalGroupGuid: String, $guids: [String], $isApprove: Boolean, $reason: String) {\n          approvalMsApproveOrDeclineRequest(approvalGroupGuid: $approvalGroupGuid, guids: $guids, isApprove: $isApprove, reason: $reason)\n        }\n      `\n    });\n  }\n}\n","import { InjectionToken, Provider } from '@angular/core';\n\nexport const APPROVAL_ENTITIES = new InjectionToken<string[]>('APPROVAL_ENTITIES');\n\nexport function provideApprovalEntities(entities: string[]): Provider{\n  return { \n    provide: APPROVAL_ENTITIES, \n    useValue: entities \n  };\n}\n","import { ChangeDetectionStrategy, Component, effect, input, model, signal } from '@angular/core';\nimport { DatePipe, JsonPipe } from '@angular/common';\nimport { Approval } from '@unipin/graphql-schema';\nimport { UpInputDirective } from '@unipin/angular-applet/forms';\nimport { UpBadgeDirective } from '@unipin/angular-applet/badge';\nimport { UpCapitalizaPipe } from '@unipin/angular-applet/common';\nimport { UpSkeletonDirective } from '@unipin/angular-applet/skeleton';\n\n\n@Component({\n  selector: 'up-approval-form',\n  templateUrl: './approval-form.component.html',\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  host: {\n    class: 'block space-y-4'\n  },\n  imports: [\n    DatePipe,\n    JsonPipe,\n    UpCapitalizaPipe,\n    UpInputDirective,\n    UpBadgeDirective,\n    UpSkeletonDirective\n  ]\n})\nexport class UpApprovalFormComponent {\n  \n  public readonly approvalData = input.required<Approval[]>();\n  public readonly isLoading = model<boolean>(true);\n\n  public readonly borderColors = signal<{ [key: number]: string }>({});\n  public readonly backgroundColors = signal<{ [key: number]: string }>({});\n\n  protected readonly STATUS_COLOR_MAP = {\n    PENDING: { \n      bg: 'bg-yellow-500', \n      border: 'border-yellow-500' \n    },\n    APPROVED: { \n      bg: 'bg-green-700', \n      border: 'border-green-700' \n    },\n    DECLINED: { \n      bg: 'bg-destructive', \n      border: 'border-destructive' \n    },\n    DEFAULT: { \n      bg: 'bg-primary', \n      border: 'border-primary' \n    },\n  };\n\n  constructor() {\n    effect(\n      () => {\n        const bg: any = {};\n        const border: any = {};\n  \n        this.approvalData().forEach(\n          (item, index) => {\n            const colors = this.getColors(item.status);\n            \n            bg[index] = colors.bg;\n            border[index] = colors.border;\n          }\n        );\n  \n        this.backgroundColors.set(bg);\n        this.borderColors.set(border);\n      }\n    );\n  }\n\n  protected getColors(status?: string | null): { bg: string, border: string}{\n    return this.STATUS_COLOR_MAP[status as keyof typeof this.STATUS_COLOR_MAP]?? this.STATUS_COLOR_MAP.DEFAULT;\n  }\n}\n","@if (isLoading()) {\n    @for (i of [1,2,3,4,5]; track $index) {\n        <div class=\"border border-border rounded-md px-2 select-none\">\n            <div class=\"px-2 py-4 border-b border-border flex justify-between items-center gap-4\">\n                <div class=\"grow flex items-center gap-2\">\n                    <div \n                        upSkeleton\n                        class=\"h-6 w-4/5 max-w-50\"\n                    ></div>\n                </div>\n\n                <div class=\"shrink-0 text-sm\">\n                    <div \n                        upSkeleton\n                        class=\"h-6 w-screen max-w-30\"\n                    ></div>\n                </div>\n            </div>\n\n            <div class=\"px-2 py-4 space-y-4\">\n                <div class=\"grid grid-cols-1 lg:grid-cols-2 gap-4\">\n                    <div class=\"flex flex-col gap-2\">\n                        <label class=\"text-sm font-medium leading-none\">\n                            Entity\n                        </label>\n\n                        <div \n                            upSkeleton\n                            class=\"h-9 w-full\"\n                        ></div>\n                    </div>\n\n                    <div class=\"flex flex-col gap-2\">\n                        <label class=\"text-sm font-medium leading-none\">\n                            User\n                        </label>\n\n                        <div \n                            upSkeleton\n                            class=\"h-9 w-full\"\n                        ></div>\n                    </div>\n                </div>\n\n                <div class=\"flex flex-col gap-2\">\n                    <label class=\"text-sm font-medium leading-none\">\n                        Remark\n                    </label>\n\n                    <div \n                        upSkeleton\n                        class=\"h-9 w-full\"\n                    ></div>\n                </div>\n\n                <div class=\"flex flex-col gap-2\">\n                    <label class=\"text-sm font-medium leading-none\">\n                        Data\n                    </label>\n\n                    <div \n                        upSkeleton\n                        class=\"h-20 w-full\"\n                    ></div>\n                </div>\n            </div>\n        </div>\n    }\n}\n@else {\n    @for (d of approvalData(); track $index) {\n        <div \n            class=\"border rounded-md px-2 select-none\"\n            [class]=\"borderColors()[$index]\"\n        >\n            <div \n                class=\"px-2 py-4 border-b flex justify-between items-center gap-4\"\n                [class]=\"borderColors()[$index]\"\n            >\n                <div class=\"grow flex items-center gap-2\">\n                    <div \n                        upBadge \n                        class=\"text-white shrink-0\" \n                        [class]=\"backgroundColors()[$index]\"\n                    >\n                        {{ (d.status?? 'Unknown') | upCapitalize }}\n                    </div>\n                </div>\n\n                @if (d.createdAt) {\n                    <div class=\"shrink-0 text-sm text-muted-foreground\">\n                        {{ d.createdAt | date: 'dd LLL yyyy HH:mm' }}\n                    </div>\n                }\n            </div>\n\n            <div class=\"px-2 py-4 space-y-6\">\n                <div class=\"grid grid-cols-1 lg:grid-cols-2 gap-4\">\n                    <div class=\"flex flex-col gap-2\">\n                        <label class=\"text-sm font-medium leading-none\">\n                            Entity\n                        </label>\n\n                        <input \n                            upInput \n                            readonly \n                            [value]=\"d.entity\"\n                        />\n                    </div>\n\n                    <div class=\"flex flex-col gap-2\">\n                        <label class=\"text-sm font-medium leading-none\">\n                            User\n                        </label>\n\n                        <input \n                            upInput \n                            readonly \n                            [value]=\"d.createdByUser?.name?? '-'\"\n                        />\n                    </div>\n                </div>\n\n                <div class=\"flex flex-col gap-2\">\n                    <label class=\"text-sm font-medium leading-none\">\n                        Remark\n                    </label>\n\n                    <input \n                        upInput \n                        readonly \n                        [value]=\"d.remark\"\n                    />\n                </div>\n\n                <div class=\"flex flex-col gap-2\">\n                    <label class=\"text-sm font-medium leading-none\">\n                        Data\n                    </label>\n\n                    <textarea \n                        upInput \n                        readonly\n                        class=\"min-h-50 resize-none\"\n                        [value]=\"d.data | json\"\n                    >\n                    </textarea>\n                </div>\n            </div>\n        </div>\n    }\n}\n","import { Component, ChangeDetectionStrategy, Inject, input, InputSignal, computed } from '@angular/core';\nimport { formatDate } from '@angular/common';\nimport { Router, ActivatedRoute } from '@angular/router';\nimport { ClassValue } from 'clsx';\nimport { Subscription } from 'rxjs';\nimport { ColDef, GridApi, ICellRendererParams } from 'ag-grid-community';\nimport { formatCapitalize, up } from '@unipin/angular-applet/common';\nimport { renderStatusBadge, UpGridComponent, GridDatasourceRefreshEvent } from '@unipin/angular-applet/grids';\nimport { Approval, ApprovalCriteria } from '@unipin/graphql-schema';\nimport { ApprovalService } from './../../services/approval.service';\nimport { APPROVAL_ENTITIES } from './provide-approval-entities.util';\n\n\n@Component({\n  standalone: true,\n  selector: 'up-approval-grid',\n  templateUrl: './approval-grid.component.html',\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  host: {\n    '[class]': '_computedClass()',\n  },\n  imports: [\n    UpGridComponent\n  ]\n})\nexport class UpApprovalGridComponent {\n\n  public readonly detailUrl: InputSignal<string> = input('/approval');\n  public readonly inlineClass = input<ClassValue>('', { alias: 'class' });\n  \n  public readonly noRowText: string = 'Approval not found';\n  public readonly columnDefs: ColDef<Approval>[] = [\n    { \n      field: 'entity',\n      headerName: 'Entity' \n    },\n    { \n      field: 'remark',\n      headerName: 'Remark' \n    },\n    { \n      field: 'sourcePlatform',\n      headerName: 'Source Platform' \n    },\n    { \n      maxWidth: 130, \n      field: 'status',\n      headerName: 'Status', \n      cellRenderer: ({ value }: ICellRendererParams) => renderStatusBadge(value, {})\n    },\n    { \n      maxWidth: 100,\n      field: 'type',\n      sortable: false,\n      headerName: 'Type', \n      cellRenderer: ({ value }: ICellRendererParams) => formatCapitalize(value?? '')\n    },\n    { \n      sort: 'desc', \n      field: 'createdAt',\n      headerName: 'Created Date',\n      valueFormatter: ({ value }) => value && formatDate(value, 'dd MMM yyyy HH:mm', 'en-US')\n    }\n  ];\n\n  protected readonly _computedClass = computed(\n    () => {\n      return up(\n        'flex flex-col size-full',\n        this.inlineClass(),\n      );\n    }\n  );\n  \n  protected gridApi?: GridApi;\n  protected sub?: Subscription;\n  protected selectedApprovalGroupGuid?: string;\n  protected input: ApprovalCriteria = { \n    page: 0,\n    pageSize: 50\n  };\n  \n  constructor(\n    @Inject(APPROVAL_ENTITIES) public readonly entities: string[],\n    \n    protected readonly router: Router,\n    protected readonly route: ActivatedRoute,\n    protected readonly approvalService: ApprovalService,\n  ) {\n    this.input.entity = this.entities?? [];\n  }\n\n  public ngOnDestroy(): void{\n    this.sub?.unsubscribe();\n  }\n\n  public onGridReady({ api }: any): void{\n    this.gridApi = api;\n  }\n\n  public openDetail({ guid }: any): void{\n    this.router.navigate(\n      [ `${ this.detailUrl() }/${ guid }` ], \n      { preserveFragment: true }\n    );\n  }\n\n  public selectApprovals(): void{\n    if (!this.gridApi) {\n      return;\n    }\n    const dataGrid: any[] = this.gridApi.getSelectedRows();\n\n    this.selectedApprovalGroupGuid = dataGrid.length === 0? undefined : dataGrid[0].approvalGroup.guid;\n    this.gridApi.refreshCells({ force: true });\n  }\n\n  public datasourceRefreshed({ page, pageSize, sort, successCallback, failCallback }: GridDatasourceRefreshEvent<any>): void{\n    const dir = sort?.sort || 'desc';\n    const sortBy = sort?.colId || 'createdAt';\n\n    this.input.page = page;\n    this.input.sortBy = sortBy;\n    this.input.pageSize = pageSize;\n    this.input.sortDirection = dir as 'asc' | 'desc';\n\n    this.sub = this.approvalService.query(this.input).subscribe(\n      {\n        next: ({ data: { approvalMsApprovals: { data, totalRecord }}}) => {\n          successCallback(data?? [], totalRecord?? 0);\n        },\n        error: () => {\n          failCallback('Failed to load approvals data');\n        }\n      }\n    );\n  }\n}\n","<div class=\"d-flex align-items-center justify-content-between gap-4 p-4 shrink-0 flex-wrap\">\n    <div class=\"grow d-flex align-items-center gap-3\">\n        <h3 class=\"m-0 text-2xl font-semibold\">Approval</h3>\n    </div>\n\n    <!-- TODO : Add filter for approval list -->     \n</div>\n\n<div class=\"grow min-h-0 overflow-hidden\">\n    <up-grid\n        id=\"grid-approval-grid\"\n        rowModelType=\"infinite\"\n\n        [noRowText]=\"noRowText\"\n        [columnDefs]=\"columnDefs\"\n        (rowClicked)=\"openDetail($event)\"\n        (gridReady)=\"onGridReady($event)\"\n        (datasourceRefreshed)=\"datasourceRefreshed($event)\"\n    />\n</div>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":["i1","i2.ApprovalService"],"mappings":"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"}

package/fesm2022/{unipin-angular-applet-audit-audit-modal.component-wPoNvU2r.mjs → unipin-angular-applet-audit-audit-modal.component-DNlMbUda.mjs}

@@ -7,11 +7,11 @@ import { UpDialogWrapperComponent, UpDialogContentDirective, UpDialogContentRefD
 
 class UpAuditModalComponent {
     constructor() {
-        this.audit = input.required(...(ngDevMode ? [{ debugName: "audit" }] : []));
+        this.audit = input.required(...(ngDevMode ? [{ debugName: "audit" }] : /* istanbul ignore next */ []));
         this.dismissed = output();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: UpAuditModalComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.0", type: UpAuditModalComponent, isStandalone: true, selector: "up-audit-modal", inputs: { audit: { classPropertyName: "audit", publicName: "audit", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { dismissed: "dismissed" }, ngImport: i0, template: `
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.10", ngImport: i0, type: UpAuditModalComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.10", type: UpAuditModalComponent, isStandalone: true, selector: "up-audit-modal", inputs: { audit: { classPropertyName: "audit", publicName: "audit", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { dismissed: "dismissed" }, ngImport: i0, template: `
     <up-dialog-wrapper
       [isOpen]="audit() !== null"
       (dismissed)="dismissed.emit()"
@@ -133,12 +133,11 @@ class UpAuditModalComponent {
         </up-content-container>
       </div>
     </up-dialog-wrapper>  
-  `, isInline: true, dependencies: [{ kind: "directive", type: UpInputDirective, selector: "[upInput]", inputs: ["class"], exportAs: ["upInput"] }, { kind: "component", type: UpFormFieldComponent, selector: "up-form-field", inputs: ["name", "hint", "label", "class"] }, { kind: "component", type: UpDialogWrapperComponent, selector: "up-dialog-wrapper", inputs: ["isOpen"], outputs: ["dismissed"], exportAs: ["upDialogWrapper"] }, { kind: "directive", type: UpDialogContentDirective, selector: "[upDialogContent]", inputs: ["class"], exportAs: ["upDialogContent"] }, { kind: "directive", type: UpDialogContentRefDirective, selector: "[upDialogContentRef]", inputs: ["context"], exportAs: ["upDialogContentRef"] }, { kind: "component", type: UpContentContainerComponent, selector: "up-content-container", inputs: ["header", "disabled", "hideCloseButton"], outputs: ["closed"] }, { kind: "pipe", type: DatePipe, name: "date" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+  `, isInline: true, dependencies: [{ kind: "directive", type: UpInputDirective, selector: "[upInput]", inputs: ["class"], exportAs: ["upInput"] }, { kind: "component", type: UpFormFieldComponent, selector: "up-form-field", inputs: ["name", "hint", "label", "class", "hideAsterisk"] }, { kind: "component", type: UpDialogWrapperComponent, selector: "up-dialog-wrapper", inputs: ["isOpen"], outputs: ["dismissed"], exportAs: ["upDialogWrapper"] }, { kind: "directive", type: UpDialogContentDirective, selector: "[upDialogContent]", inputs: ["class"], exportAs: ["upDialogContent"] }, { kind: "directive", type: UpDialogContentRefDirective, selector: "[upDialogContentRef]", inputs: ["context"], exportAs: ["upDialogContentRef"] }, { kind: "component", type: UpContentContainerComponent, selector: "up-content-container", inputs: ["header", "disabled", "hideCloseButton"], outputs: ["closed"] }, { kind: "pipe", type: DatePipe, name: "date" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: UpAuditModalComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.10", ngImport: i0, type: UpAuditModalComponent, decorators: [{
             type: Component,
             args: [{
-                    standalone: true,
                     selector: 'up-audit-modal',
                     changeDetection: ChangeDetectionStrategy.OnPush,
                     imports: [
@@ -277,4 +276,4 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImpor
         }], propDecorators: { audit: [{ type: i0.Input, args: [{ isSignal: true, alias: "audit", required: true }] }], dismissed: [{ type: i0.Output, args: ["dismissed"] }] } });
 
 export { UpAuditModalComponent };
-//# sourceMappingURL=unipin-angular-applet-audit-audit-modal.component-wPoNvU2r.mjs.map
+//# sourceMappingURL=unipin-angular-applet-audit-audit-modal.component-DNlMbUda.mjs.map

package/fesm2022/unipin-angular-applet-audit-audit-modal.component-DNlMbUda.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"unipin-angular-applet-audit-audit-modal.component-DNlMbUda.mjs","sources":["../../../projects/unipin-angular/audit/components/modal/audit-modal.component.ts"],"sourcesContent":["import { Component, ChangeDetectionStrategy, input, output } from '@angular/core';\nimport { DatePipe } from '@angular/common';\nimport { AuditTrail } from '@unipin/graphql-schema';\nimport { UpContentContainerComponent } from '@unipin/angular-applet/containers';\nimport { UpFormFieldComponent, UpInputDirective } from '@unipin/angular-applet/forms';\nimport { UpDialogWrapperComponent, UpDialogContentDirective, UpDialogContentRefDirective } from '@unipin/angular-applet/dialog';\n\n\ntype AuditTrailData = AuditTrail & {\n  icon: string;\n  changedData?: Array<{ field: string; oldValue: any; newValue: any }>;\n}\n\n\n@Component({\n  selector: 'up-audit-modal',\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  imports: [\n    DatePipe,\n    UpInputDirective,\n    UpFormFieldComponent,\n    UpDialogWrapperComponent,\n    UpDialogContentDirective,\n    UpDialogContentRefDirective,\n    UpContentContainerComponent\n  ],\n  template: `\n    <up-dialog-wrapper\n      [isOpen]=\"audit() !== null\"\n      (dismissed)=\"dismissed.emit()\"\n    >\n      <div\n        upDialogContent\n        class=\"max-w-200\"\n        *upDialogContentRef\n      >\n        <up-content-container\n          [header]=\"audit()?.user?.name + ' ' + audit()?.action + ' • ' + (audit()?.createdAt | date: 'dd LLL yyyy HH:mm')\"\n          (closed)=\"dismissed.emit()\"\n        >\n          <div class=\"p-4 space-y-6\">\n            <up-form-field label=\"Username\">\n              <input \n                upInput  \n                readonly\n                type=\"text\"\n                tabindex=\"-1\"\n                [value]=\"audit()?.user?.name\" \n              />\n            </up-form-field>\n\n            <up-form-field label=\"Description\">\n              <textarea \n                upInput\n                readonly\n                tabindex=\"-1\"\n                class=\"h-25 w-full\"\n                [value]=\"audit()?.description\"\n              ></textarea>\n            </up-form-field>\n\n            <div class=\"grid grid-cols-1 lg:grid-cols-2 gap-6\">\n              <up-form-field label=\"Source IP\">\n                <input \n                  upInput  \n                  readonly\n                  type=\"text\"\n                  tabindex=\"-1\"\n                  [value]=\"audit()?.sourceIp\" \n                />\n              </up-form-field>\n\n              <up-form-field label=\"Source Platform\">\n                <input \n                  upInput  \n                  readonly\n                  type=\"text\"\n                  tabindex=\"-1\"\n                  [value]=\"audit()?.user?.sourcePlatform\" \n                />\n              </up-form-field>\n\n              <up-form-field label=\"MS Source\">\n                <input \n                  upInput  \n                  readonly\n                  type=\"text\"\n                  tabindex=\"-1\"\n                  [value]=\"audit()?.msSource\" \n                />\n              </up-form-field>\n\n              <up-form-field label=\"Function\">\n                <input \n                  upInput  \n                  readonly\n                  type=\"text\"\n                  tabindex=\"-1\"\n                  [value]=\"audit()?.function\" \n                />\n              </up-form-field>\n            </div>\n\n            @if (\n              audit() &&\n              audit()!.changedData &&\n              audit()!.changedData!.length > 0\n            ) {\n              <div class=\"space-y-2\">\n                <label class=\"text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70 select-none\">\n                  Changed Data\n                </label>\n                \n                <table class=\"w-full my-2 table-fixed border-collapse rounded-md select-none\">\n                  <thead class=\"border-inherit border-solid border-0\">\n                    <tr>\n                      <th class=\"w-[30%] p-2 text-left border border-border bg-[#f2f2f2] text-base border-tl-2\">Field</th>\n                      <th class=\"w-[35%] p-2 text-left border border-border bg-[#f2f2f2] text-base\">Old Value</th>\n                      <th class=\"w-[35%] p-2 text-left border border-border bg-[#f2f2f2] text-base border-tr-2\">New Value</th>\n                    </tr>\n                  </thead>\n\n                  <tbody class=\"border-inherit border-solid border-0\">\n                    @for (data of audit()!.changedData; track data.field; let even = $even) {\n                      <tr \n                        [class]=\"even? 'bg-white': 'bg-[#f9f9f9]'\"\n                      >\n                        <td class=\"p-2 text-left border border-border capitalize\">\n                          {{ data.field }}\n                        </td>\n\n                        <td class=\"p-2 text-left border border-border capitalize\">\n                          {{ data.oldValue }}\n                        </td>\n\n                        <td class=\"p-2 text-left border border-border capitalize\">\n                          {{ data.newValue }}\n                        </td>\n                      </tr>\n                    }\n                  </tbody>\n                </table>\n              </div>\n            }\n          </div>\n        </up-content-container>\n      </div>\n    </up-dialog-wrapper>  \n  `\n})\nexport class UpAuditModalComponent {\n\n  public readonly audit = input.required<AuditTrailData | null>();\n  public readonly dismissed = output<void>();\n}\n"],"names":[],"mappings":"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"}

package/fesm2022/unipin-angular-applet-audit.mjs

@@ -54,10 +54,10 @@ class AuditService {
             });
         }));
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: AuditService, deps: [{ token: i1.GqlParser }], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: AuditService, providedIn: 'root' }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.10", ngImport: i0, type: AuditService, deps: [{ token: i1.GqlParser }], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.10", ngImport: i0, type: AuditService, providedIn: 'root' }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: AuditService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.10", ngImport: i0, type: AuditService, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root'
@@ -67,12 +67,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImpor
 class UpAuditListComponent {
     constructor(service) {
         this.service = service;
-        this.tagValues = input(...(ngDevMode ? [undefined, { debugName: "tagValues" }] : []));
-        this.relatedEntities = input(...(ngDevMode ? [undefined, { debugName: "relatedEntities" }] : []));
-        this.hasMore = signal(true, ...(ngDevMode ? [{ debugName: "hasMore" }] : []));
-        this.isLoading = signal(false, ...(ngDevMode ? [{ debugName: "isLoading" }] : []));
-        this.auditTrails = signal([], ...(ngDevMode ? [{ debugName: "auditTrails" }] : []));
-        this.selectedTrail = signal(null, ...(ngDevMode ? [{ debugName: "selectedTrail" }] : []));
+        this.tagValues = input(...(ngDevMode ? [undefined, { debugName: "tagValues" }] : /* istanbul ignore next */ []));
+        this.relatedEntities = input(...(ngDevMode ? [undefined, { debugName: "relatedEntities" }] : /* istanbul ignore next */ []));
+        this.hasMore = signal(true, ...(ngDevMode ? [{ debugName: "hasMore" }] : /* istanbul ignore next */ []));
+        this.isLoading = signal(false, ...(ngDevMode ? [{ debugName: "isLoading" }] : /* istanbul ignore next */ []));
+        this.auditTrails = signal([], ...(ngDevMode ? [{ debugName: "auditTrails" }] : /* istanbul ignore next */ []));
+        this.selectedTrail = signal(null, ...(ngDevMode ? [{ debugName: "selectedTrail" }] : /* istanbul ignore next */ []));
         this.criteria = {
             page: 0,
             pageSize: 20,
@@ -182,8 +182,8 @@ class UpAuditListComponent {
             return JSON.stringify(value);
         return String(value);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: UpAuditListComponent, deps: [{ token: AuditService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.0", type: UpAuditListComponent, isStandalone: true, selector: "up-audit-list", inputs: { tagValues: { classPropertyName: "tagValues", publicName: "tagValues", isSignal: true, isRequired: false, transformFunction: null }, relatedEntities: { classPropertyName: "relatedEntities", publicName: "relatedEntities", isSignal: true, isRequired: false, transformFunction: null } }, providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.10", ngImport: i0, type: UpAuditListComponent, deps: [{ token: AuditService }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.10", type: UpAuditListComponent, isStandalone: true, selector: "up-audit-list", inputs: { tagValues: { classPropertyName: "tagValues", publicName: "tagValues", isSignal: true, isRequired: false, transformFunction: null }, relatedEntities: { classPropertyName: "relatedEntities", publicName: "relatedEntities", isSignal: true, isRequired: false, transformFunction: null } }, providers: [
             provideIcons({
                 matEditRound,
                 matErrorRound,
@@ -191,11 +191,11 @@ class UpAuditListComponent {
                 matHourglassEmptyRound,
                 matKeyboardArrowDownRound,
             })
-        ], ngImport: i0, template: "<div class=\"w-full pb-5 pl-5 border-l-2 border-border\">\n    @for (audit of auditTrails(); track audit.guid) {\n        <div class=\"relative flex items-start first:pt-2.5 not-first:pt-4 not-last:pb-4 not-last:border-b not-last:border-border\">\n            <div class=\"absolute border border-border rounded-full p-2 flex items-center bg-[#f5f7f6] -left-9.25\">\n                <ng-icon\n                    size=\"14\"\n                    [name]=\"audit.icon\"\n                />\n            </div>\n\n            <div class=\"px-2 pt-1.25 w-full\">\n                <div class=\"flex items-center justify-between gap-3 select-none\">\n                    <div class=\"text-sm grow\">\n                        <b>{{ audit.user?.name }}</b> <span class=\"lowercase\">&nbsp;{{ audit.action }} <i class=\"text-muted-foreground\">\u2022</i></span>\n                        <span class=\"text-muted-foreground text-xs\">&nbsp;{{ audit.createdAt | date: 'dd LLL yyyy HH:mm' }}</span>\n                    </div>\n\n                    <button\n                        type=\"button\"\n                        class=\"text-sm text-primary font-medium hover:underline shrink-0 cursor-pointer\"\n                        (click)=\"selectedTrail.set(audit)\"\n                    >\n                        Detail\n                    </button>\n                </div>\n\n                @if (\n                    audit.changedData && \n                    audit.changedData.length > 0\n                ) {\n                    <table class=\"w-full my-2 table-fixed border-collapse rounded-md select-none\">\n                        <thead class=\"border-inherit border-solid border-0\">\n                            <tr>\n                                <th class=\"w-[30%] p-2 text-left border border-border bg-[#f2f2f2] text-base border-tl-2\">Field</th>\n                                <th class=\"w-[35%] p-2 text-left border border-border bg-[#f2f2f2] text-base\">Old Value</th>\n                                <th class=\"w-[35%] p-2 text-left border border-border bg-[#f2f2f2] text-base border-tr-2\">New Value</th>\n                            </tr>\n                        </thead>\n\n                        <tbody class=\"border-inherit border-solid border-0\">\n                            @for (data of audit.changedData; track data.field; let even = $even) {\n                                <tr \n                                    [class]=\"even? 'bg-white': 'bg-[#f9f9f9]'\"\n                                >\n                                    <td class=\"p-2 text-left border border-border capitalize\">\n                                        {{ data.field }}\n                                    </td>\n\n                                    <td class=\"p-2 text-left border border-border capitalize\">\n                                        <div class=\"line-clamp-5 wrap-break-word\">{{ data.oldValue }}</div>\n                                    </td>\n\n                                    <td class=\"p-2 text-left border border-border capitalize\">\n                                        <div class=\"line-clamp-5 wrap-break-word\">{{ data.newValue }}</div>\n                                    </td>\n                                </tr>\n                            }\n                        </tbody>\n                    </table>\n                }\n            </div>\n        </div>\n    }\n</div>\n\n\n@if (hasMore()) {\n    <div \n        upInfiniteScroll\n        class=\"flex justify-center py-4\"\n        (scrolled)=\"loadData()\"\n    >\n        <up-spinner />\n    </div>\n}\n\n@defer (when selectedTrail()) {\n    <up-audit-modal\n        [audit]=\"selectedTrail()\"\n        (dismissed)=\"selectedTrail.set(null)\"\n    />\n}\n", dependencies: [{ kind: "component", type: NgIcon, selector: "ng-icon", inputs: ["name", "svg", "size", "strokeWidth", "color"] }, { kind: "component", type: UpSpinnerComponent, selector: "up-spinner", inputs: ["stokeWidth", "inlineClass"] }, { kind: "directive", type: UpInfiniteScrollDirective, selector: "[upInfiniteScroll]", inputs: ["threshold", "rootMargin"], outputs: ["scrolled"], exportAs: ["upInfiniteScroll"] }, { kind: "pipe", type: DatePipe, name: "date" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, deferBlockDependencies: [() => [import('./unipin-angular-applet-audit-audit-modal.component-wPoNvU2r.mjs').then(m => m.UpAuditModalComponent)]] }); }
+        ], ngImport: i0, template: "<div class=\"w-full pb-5 pl-5 border-l-2 border-border\">\n    @for (audit of auditTrails(); track audit.guid) {\n        <div class=\"relative flex items-start first:pt-2.5 not-first:pt-4 not-last:pb-4 not-last:border-b not-last:border-border\">\n            <div class=\"absolute border border-border rounded-full p-2 flex items-center bg-[#f5f7f6] -left-9.25\">\n                <ng-icon\n                    size=\"14\"\n                    [name]=\"audit.icon\"\n                />\n            </div>\n\n            <div class=\"px-2 pt-1.25 w-full\">\n                <div class=\"flex items-center justify-between gap-3 select-none\">\n                    <div class=\"text-sm grow\">\n                        <b>{{ audit.user?.name }}</b> <span class=\"lowercase\">&nbsp;{{ audit.action }} <i class=\"text-muted-foreground\">\u2022</i></span>\n                        <span class=\"text-muted-foreground text-xs\">&nbsp;{{ audit.createdAt | date: 'dd LLL yyyy HH:mm' }}</span>\n                    </div>\n\n                    <button\n                        type=\"button\"\n                        class=\"text-sm text-primary font-medium hover:underline shrink-0 cursor-pointer\"\n                        (click)=\"selectedTrail.set(audit)\"\n                    >\n                        Detail\n                    </button>\n                </div>\n\n                @if (\n                    audit.changedData && \n                    audit.changedData.length > 0\n                ) {\n                    <table class=\"w-full my-2 table-fixed border-collapse rounded-md select-none\">\n                        <thead class=\"border-inherit border-solid border-0\">\n                            <tr>\n                                <th class=\"w-[30%] p-2 text-left border border-border bg-[#f2f2f2] text-base border-tl-2\">Field</th>\n                                <th class=\"w-[35%] p-2 text-left border border-border bg-[#f2f2f2] text-base\">Old Value</th>\n                                <th class=\"w-[35%] p-2 text-left border border-border bg-[#f2f2f2] text-base border-tr-2\">New Value</th>\n                            </tr>\n                        </thead>\n\n                        <tbody class=\"border-inherit border-solid border-0\">\n                            @for (data of audit.changedData; track data.field; let even = $even) {\n                                <tr \n                                    [class]=\"even? 'bg-white': 'bg-[#f9f9f9]'\"\n                                >\n                                    <td class=\"p-2 text-left border border-border capitalize\">\n                                        {{ data.field }}\n                                    </td>\n\n                                    <td class=\"p-2 text-left border border-border capitalize\">\n                                        <div class=\"line-clamp-5 wrap-break-word\">{{ data.oldValue }}</div>\n                                    </td>\n\n                                    <td class=\"p-2 text-left border border-border capitalize\">\n                                        <div class=\"line-clamp-5 wrap-break-word\">{{ data.newValue }}</div>\n                                    </td>\n                                </tr>\n                            }\n                        </tbody>\n                    </table>\n                }\n            </div>\n        </div>\n    }\n</div>\n\n\n@if (hasMore()) {\n    <div \n        upInfiniteScroll\n        class=\"flex justify-center py-4\"\n        (scrolled)=\"loadData()\"\n    >\n        <up-spinner />\n    </div>\n}\n\n@defer (when selectedTrail()) {\n    <up-audit-modal\n        [audit]=\"selectedTrail()\"\n        (dismissed)=\"selectedTrail.set(null)\"\n    />\n}\n", dependencies: [{ kind: "component", type: NgIcon, selector: "ng-icon", inputs: ["name", "svg", "size", "strokeWidth", "color"] }, { kind: "component", type: UpSpinnerComponent, selector: "up-spinner", inputs: ["stokeWidth", "inlineClass"] }, { kind: "directive", type: UpInfiniteScrollDirective, selector: "[upInfiniteScroll]", inputs: ["threshold", "rootMargin"], outputs: ["scrolled"], exportAs: ["upInfiniteScroll"] }, { kind: "pipe", type: DatePipe, name: "date" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, deferBlockDependencies: [() => [import('./unipin-angular-applet-audit-audit-modal.component-DNlMbUda.mjs').then(m => m.UpAuditModalComponent)]] }); }
 }
-i0.ɵɵngDeclareClassMetadataAsync({ minVersion: "18.0.0", version: "21.2.0", ngImport: i0, type: UpAuditListComponent, resolveDeferredDeps: () => [import('./unipin-angular-applet-audit-audit-modal.component-wPoNvU2r.mjs').then(m => m.UpAuditModalComponent)], resolveMetadata: UpAuditModalComponent => ({ decorators: [{
+i0.ɵɵngDeclareClassMetadataAsync({ minVersion: "18.0.0", version: "21.2.10", ngImport: i0, type: UpAuditListComponent, resolveDeferredDeps: () => [import('./unipin-angular-applet-audit-audit-modal.component-DNlMbUda.mjs').then(m => m.UpAuditModalComponent)], resolveMetadata: UpAuditModalComponent => ({ decorators: [{
                 type: Component,
-                args: [{ standalone: true, selector: 'up-audit-list', changeDetection: ChangeDetectionStrategy.OnPush, imports: [
+                args: [{ selector: 'up-audit-list', changeDetection: ChangeDetectionStrategy.OnPush, imports: [
                             NgIcon,
                             DatePipe,
                             UpSpinnerComponent,

package/fesm2022/unipin-angular-applet-audit.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"unipin-angular-applet-audit.mjs","sources":["../../../projects/unipin-angular/audit/services/audit.service.ts","../../../projects/unipin-angular/audit/components/list/audit-list.component.ts","../../../projects/unipin-angular/audit/components/list/audit-list.component.html","../../../projects/unipin-angular/audit/unipin-angular-applet-audit.ts"],"sourcesContent":["import { Injectable } from '@angular/core';\nimport { Observable, of } from 'rxjs';\nimport { catchError, map } from 'rxjs/operators';\nimport { GqlParser, QueryResult } from '@unipin/angular-gql';\nimport { AuditTrail, AuditTrailCriteria } from '@unipin/graphql-schema';\n\n\n@Injectable({\n  providedIn: 'root'\n})\nexport class AuditService {\n\n  constructor(\n    protected readonly gql: GqlParser\n  ) { }\n\n  public query(input: AuditTrailCriteria): Observable<QueryResult<{ auditMsAuditTrail: AuditTrail[] }>>{\n    return this.gql.query<{ auditMsAuditTrail: AuditTrail[] }>({\n      operationName: 'QueryAuditTrail',\n      variables: {\n        input\n      },\n      query: `\n        query QueryAuditTrail($input: AuditTrailCriteria) {\n          auditMsAuditTrail(input: $input) {\n            action\n            createdAt\n            description\n            function\n            guid\n            msSource\n            sourceIp\n            data\n            user {\n              name\n              sourcePlatform\n              status\n              appLoginPrincipal {\n                principalId\n                principalType\n              }\n            }\n          }\n        }\n      `,\n    }).pipe(\n      map(\n        (res) => {\n          return {\n            data: res.data?? null,\n            errors: res.errors?? []\n          };\n        }\n      ),\n      catchError(\n        (err) => {\n          return of(\n            {\n              data: null as any,\n              errors: Array.isArray(err)? err : [err]\n            }\n          );\n        }\n      )\n    );\n  }\n}\n","import { Component, ChangeDetectionStrategy, signal, OnDestroy, input, effect, untracked } from '@angular/core';\nimport { DatePipe } from '@angular/common';\nimport { Subscription } from 'rxjs';\nimport { NgIcon, provideIcons } from '@ng-icons/core';\nimport { matAddCircleRound, matKeyboardArrowDownRound, matEditRound, matHourglassEmptyRound, matErrorRound } from '@ng-icons/material-icons/round';\nimport { AuditTrail, AuditTrailCriteria } from '@unipin/graphql-schema';\nimport { UpSpinnerComponent } from '@unipin/angular-applet/spinner';\nimport { UpInfiniteScrollDirective } from '@unipin/angular-applet/infinite-scroll';\nimport { AuditService } from './../../services/audit.service';\nimport { UpAuditModalComponent } from '../modal/audit-modal.component';\n\n\ntype AuditTrailData = AuditTrail & {\n  icon: string;\n  changedData?: Array<{ field: string; oldValue: any; newValue: any }>;\n}\n\n\n@Component({\n  standalone: true,\n  selector: 'up-audit-list',\n  templateUrl: './audit-list.component.html',\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  imports: [\n    NgIcon,\n    DatePipe,\n    UpSpinnerComponent,\n    UpInfiniteScrollDirective,\n    UpAuditModalComponent\n  ],\n  providers: [\n    provideIcons(\n      { \n        matEditRound,\n        matErrorRound,\n        matAddCircleRound,\n        matHourglassEmptyRound,\n        matKeyboardArrowDownRound,\n      }\n    ) \n  ]\n})\nexport class UpAuditListComponent implements OnDestroy {\n\n  public readonly tagValues = input<string[] | undefined>();\n  public readonly relatedEntities = input<string[] | undefined>();\n\n  public readonly hasMore = signal<boolean>(true);\n  public readonly isLoading = signal<boolean>(false);\n  public readonly auditTrails = signal<AuditTrailData[]>([]);\n  public readonly selectedTrail = signal<AuditTrailData | null>(null);\n\n  protected sub?: Subscription;\n  protected readonly criteria: AuditTrailCriteria = { \n    page: 0, \n    pageSize: 20,\n    sortBy: 'createdAt', \n    sortDirection: 'desc'\n  };\n\n  constructor(\n    protected readonly service: AuditService\n  ) {\n    effect(\n      () => {\n        this.criteria.page = 0;\n        this.criteria.tagValues = undefined;\n        this.criteria.relatedEntities = undefined;\n        \n        if (this.tagValues()) {\n          this.criteria.tagValues = this.tagValues();\n        }\n        \n        if (this.relatedEntities()) {\n          this.criteria.relatedEntities = this.relatedEntities();\n        }\n\n        untracked(\n          () => {\n            this.hasMore.set(true);\n            this.auditTrails.set([]);\n            this.isLoading.set(false);\n\n            this.sub?.unsubscribe();\n            this.loadData();\n          }\n        );\n      }\n    );\n  }\n\n  public ngOnDestroy(): void{\n    this.sub?.unsubscribe();\n  }\n\n  public loadData(): void{\n    if (\n      this.isLoading() || \n      !this.hasMore()\n    ) {\n      return;\n    }\n    this.isLoading.set(true);\n\n    this.sub = this.service.query(this.criteria).subscribe(\n      {\n        error: () => {\n          this.isLoading.set(false);\n        },\n        next: ({ data: { auditMsAuditTrail: data }}) => {\n          const formattedData = data.reduce(\n            (acc, curr) => {\n              if (!curr) {\n                return acc;\n              }\n\n              acc.push(\n                {\n                  ...curr,\n                  icon: this.getAuditIcon(curr),\n                  changedData: this.getChangedData(curr.data),\n                }\n              );\n              return acc;\n            },\n            [] as AuditTrailData[]\n          );\n          this.hasMore.set(formattedData.length >= this.criteria.pageSize!);\n\n          this.auditTrails.update(\n            (curr) => {\n              return [\n                ...curr,\n                ...formattedData\n              ]\n            }\n          );\n          \n          this.criteria.page!++;\n          this.isLoading.set(false);\n        }\n      }\n    );\n  }\n\n  protected getAuditIcon(audit: AuditTrail): string{\n    const actionLower = audit.action?.toLowerCase() || '';\n    const descLower = audit.description?.toLowerCase() || '';\n    \n    if (\n      actionLower.includes('waiting') || \n      descLower.includes('waiting')\n    ) {\n      return 'matHourglassEmptyRound';\n    }\n    \n    if (\n      actionLower.includes('creation') || \n      descLower.includes('creation')\n    ) {\n      return 'matAddCircleRound';\n    }\n    \n    if (\n      actionLower.includes('update') || \n      descLower.includes('update')\n    ) {\n      return 'matEditRound';\n    }\n    return 'matErrorRound';\n  }\n\n  protected getChangedData(data: any): Array<{ field: string; oldValue: any; newValue: any }>{\n    if (\n      !data || \n      !data.oldData || \n      !data.newData\n    ) {\n      return [];\n    }\n\n    try {\n      const oldData = JSON.parse(data.oldData);\n      const newData = JSON.parse(data.newData);\n\n      return Object.keys(newData).filter(\n        (key) => {\n          return JSON.stringify(oldData[key]) !== JSON.stringify(newData[key]) && !key.match(/update|created/);\n        }\n      ).map(\n        (key) => {\n          return {\n            field: key,\n            oldValue: this.formatValue(oldData[key]),\n            newValue: this.formatValue(newData[key])\n          };\n        }\n      );\n    } \n    catch (error) {\n      return [];\n    }\n  }\n\n  protected formatValue(value: any): string{\n    if (value === null || value === undefined) return '-';\n    if (typeof value === 'object') return JSON.stringify(value);\n    return String(value);\n  }\n}\n","<div class=\"w-full pb-5 pl-5 border-l-2 border-border\">\n    @for (audit of auditTrails(); track audit.guid) {\n        <div class=\"relative flex items-start first:pt-2.5 not-first:pt-4 not-last:pb-4 not-last:border-b not-last:border-border\">\n            <div class=\"absolute border border-border rounded-full p-2 flex items-center bg-[#f5f7f6] -left-9.25\">\n                <ng-icon\n                    size=\"14\"\n                    [name]=\"audit.icon\"\n                />\n            </div>\n\n            <div class=\"px-2 pt-1.25 w-full\">\n                <div class=\"flex items-center justify-between gap-3 select-none\">\n                    <div class=\"text-sm grow\">\n                        <b>{{ audit.user?.name }}</b> <span class=\"lowercase\">&nbsp;{{ audit.action }} <i class=\"text-muted-foreground\">•</i></span>\n                        <span class=\"text-muted-foreground text-xs\">&nbsp;{{ audit.createdAt | date: 'dd LLL yyyy HH:mm' }}</span>\n                    </div>\n\n                    <button\n                        type=\"button\"\n                        class=\"text-sm text-primary font-medium hover:underline shrink-0 cursor-pointer\"\n                        (click)=\"selectedTrail.set(audit)\"\n                    >\n                        Detail\n                    </button>\n                </div>\n\n                @if (\n                    audit.changedData && \n                    audit.changedData.length > 0\n                ) {\n                    <table class=\"w-full my-2 table-fixed border-collapse rounded-md select-none\">\n                        <thead class=\"border-inherit border-solid border-0\">\n                            <tr>\n                                <th class=\"w-[30%] p-2 text-left border border-border bg-[#f2f2f2] text-base border-tl-2\">Field</th>\n                                <th class=\"w-[35%] p-2 text-left border border-border bg-[#f2f2f2] text-base\">Old Value</th>\n                                <th class=\"w-[35%] p-2 text-left border border-border bg-[#f2f2f2] text-base border-tr-2\">New Value</th>\n                            </tr>\n                        </thead>\n\n                        <tbody class=\"border-inherit border-solid border-0\">\n                            @for (data of audit.changedData; track data.field; let even = $even) {\n                                <tr \n                                    [class]=\"even? 'bg-white': 'bg-[#f9f9f9]'\"\n                                >\n                                    <td class=\"p-2 text-left border border-border capitalize\">\n                                        {{ data.field }}\n                                    </td>\n\n                                    <td class=\"p-2 text-left border border-border capitalize\">\n                                        <div class=\"line-clamp-5 wrap-break-word\">{{ data.oldValue }}</div>\n                                    </td>\n\n                                    <td class=\"p-2 text-left border border-border capitalize\">\n                                        <div class=\"line-clamp-5 wrap-break-word\">{{ data.newValue }}</div>\n                                    </td>\n                                </tr>\n                            }\n                        </tbody>\n                    </table>\n                }\n            </div>\n        </div>\n    }\n</div>\n\n\n@if (hasMore()) {\n    <div \n        upInfiniteScroll\n        class=\"flex justify-center py-4\"\n        (scrolled)=\"loadData()\"\n    >\n        <up-spinner />\n    </div>\n}\n\n@defer (when selectedTrail()) {\n    <up-audit-modal\n        [audit]=\"selectedTrail()\"\n        (dismissed)=\"selectedTrail.set(null)\"\n    />\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":["i1.AuditService"],"mappings":"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"}
+{"version":3,"file":"unipin-angular-applet-audit.mjs","sources":["../../../projects/unipin-angular/audit/services/audit.service.ts","../../../projects/unipin-angular/audit/components/list/audit-list.component.ts","../../../projects/unipin-angular/audit/components/list/audit-list.component.html","../../../projects/unipin-angular/audit/unipin-angular-applet-audit.ts"],"sourcesContent":["import { Injectable } from '@angular/core';\nimport { Observable, of } from 'rxjs';\nimport { catchError, map } from 'rxjs/operators';\nimport { GqlParser, QueryResult } from '@unipin/angular-gql';\nimport { AuditTrail, AuditTrailCriteria } from '@unipin/graphql-schema';\n\n\n@Injectable({\n  providedIn: 'root'\n})\nexport class AuditService {\n\n  constructor(\n    protected readonly gql: GqlParser\n  ) { }\n\n  public query(input: AuditTrailCriteria): Observable<QueryResult<{ auditMsAuditTrail: AuditTrail[] }>>{\n    return this.gql.query<{ auditMsAuditTrail: AuditTrail[] }>({\n      operationName: 'QueryAuditTrail',\n      variables: {\n        input\n      },\n      query: `\n        query QueryAuditTrail($input: AuditTrailCriteria) {\n          auditMsAuditTrail(input: $input) {\n            action\n            createdAt\n            description\n            function\n            guid\n            msSource\n            sourceIp\n            data\n            user {\n              name\n              sourcePlatform\n              status\n              appLoginPrincipal {\n                principalId\n                principalType\n              }\n            }\n          }\n        }\n      `,\n    }).pipe(\n      map(\n        (res) => {\n          return {\n            data: res.data?? null,\n            errors: res.errors?? []\n          };\n        }\n      ),\n      catchError(\n        (err) => {\n          return of(\n            {\n              data: null as any,\n              errors: Array.isArray(err)? err : [err]\n            }\n          );\n        }\n      )\n    );\n  }\n}\n","import { Component, ChangeDetectionStrategy, signal, OnDestroy, input, effect, untracked } from '@angular/core';\nimport { DatePipe } from '@angular/common';\nimport { Subscription } from 'rxjs';\nimport { NgIcon, provideIcons } from '@ng-icons/core';\nimport { matAddCircleRound, matKeyboardArrowDownRound, matEditRound, matHourglassEmptyRound, matErrorRound } from '@ng-icons/material-icons/round';\nimport { AuditTrail, AuditTrailCriteria } from '@unipin/graphql-schema';\nimport { UpSpinnerComponent } from '@unipin/angular-applet/spinner';\nimport { UpInfiniteScrollDirective } from '@unipin/angular-applet/infinite-scroll';\nimport { AuditService } from './../../services/audit.service';\nimport { UpAuditModalComponent } from '../modal/audit-modal.component';\n\n\ntype AuditTrailData = AuditTrail & {\n  icon: string;\n  changedData?: Array<{ field: string; oldValue: any; newValue: any }>;\n}\n\n\n@Component({\n  selector: 'up-audit-list',\n  templateUrl: './audit-list.component.html',\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  imports: [\n    NgIcon,\n    DatePipe,\n    UpSpinnerComponent,\n    UpInfiniteScrollDirective,\n    UpAuditModalComponent\n  ],\n  providers: [\n    provideIcons(\n      { \n        matEditRound,\n        matErrorRound,\n        matAddCircleRound,\n        matHourglassEmptyRound,\n        matKeyboardArrowDownRound,\n      }\n    ) \n  ]\n})\nexport class UpAuditListComponent implements OnDestroy {\n\n  public readonly tagValues = input<string[] | undefined>();\n  public readonly relatedEntities = input<string[] | undefined>();\n\n  public readonly hasMore = signal<boolean>(true);\n  public readonly isLoading = signal<boolean>(false);\n  public readonly auditTrails = signal<AuditTrailData[]>([]);\n  public readonly selectedTrail = signal<AuditTrailData | null>(null);\n\n  protected sub?: Subscription;\n  protected readonly criteria: AuditTrailCriteria = { \n    page: 0, \n    pageSize: 20,\n    sortBy: 'createdAt', \n    sortDirection: 'desc'\n  };\n\n  constructor(\n    protected readonly service: AuditService\n  ) {\n    effect(\n      () => {\n        this.criteria.page = 0;\n        this.criteria.tagValues = undefined;\n        this.criteria.relatedEntities = undefined;\n        \n        if (this.tagValues()) {\n          this.criteria.tagValues = this.tagValues();\n        }\n        \n        if (this.relatedEntities()) {\n          this.criteria.relatedEntities = this.relatedEntities();\n        }\n\n        untracked(\n          () => {\n            this.hasMore.set(true);\n            this.auditTrails.set([]);\n            this.isLoading.set(false);\n\n            this.sub?.unsubscribe();\n            this.loadData();\n          }\n        );\n      }\n    );\n  }\n\n  public ngOnDestroy(): void{\n    this.sub?.unsubscribe();\n  }\n\n  public loadData(): void{\n    if (\n      this.isLoading() || \n      !this.hasMore()\n    ) {\n      return;\n    }\n    this.isLoading.set(true);\n\n    this.sub = this.service.query(this.criteria).subscribe(\n      {\n        error: () => {\n          this.isLoading.set(false);\n        },\n        next: ({ data: { auditMsAuditTrail: data }}) => {\n          const formattedData = data.reduce(\n            (acc, curr) => {\n              if (!curr) {\n                return acc;\n              }\n\n              acc.push(\n                {\n                  ...curr,\n                  icon: this.getAuditIcon(curr),\n                  changedData: this.getChangedData(curr.data),\n                }\n              );\n              return acc;\n            },\n            [] as AuditTrailData[]\n          );\n          this.hasMore.set(formattedData.length >= this.criteria.pageSize!);\n\n          this.auditTrails.update(\n            (curr) => {\n              return [\n                ...curr,\n                ...formattedData\n              ]\n            }\n          );\n          \n          this.criteria.page!++;\n          this.isLoading.set(false);\n        }\n      }\n    );\n  }\n\n  protected getAuditIcon(audit: AuditTrail): string{\n    const actionLower = audit.action?.toLowerCase() || '';\n    const descLower = audit.description?.toLowerCase() || '';\n    \n    if (\n      actionLower.includes('waiting') || \n      descLower.includes('waiting')\n    ) {\n      return 'matHourglassEmptyRound';\n    }\n    \n    if (\n      actionLower.includes('creation') || \n      descLower.includes('creation')\n    ) {\n      return 'matAddCircleRound';\n    }\n    \n    if (\n      actionLower.includes('update') || \n      descLower.includes('update')\n    ) {\n      return 'matEditRound';\n    }\n    return 'matErrorRound';\n  }\n\n  protected getChangedData(data: any): Array<{ field: string; oldValue: any; newValue: any }>{\n    if (\n      !data || \n      !data.oldData || \n      !data.newData\n    ) {\n      return [];\n    }\n\n    try {\n      const oldData = JSON.parse(data.oldData);\n      const newData = JSON.parse(data.newData);\n\n      return Object.keys(newData).filter(\n        (key) => {\n          return JSON.stringify(oldData[key]) !== JSON.stringify(newData[key]) && !key.match(/update|created/);\n        }\n      ).map(\n        (key) => {\n          return {\n            field: key,\n            oldValue: this.formatValue(oldData[key]),\n            newValue: this.formatValue(newData[key])\n          };\n        }\n      );\n    } \n    catch (error) {\n      return [];\n    }\n  }\n\n  protected formatValue(value: any): string{\n    if (value === null || value === undefined) return '-';\n    if (typeof value === 'object') return JSON.stringify(value);\n    return String(value);\n  }\n}\n","<div class=\"w-full pb-5 pl-5 border-l-2 border-border\">\n    @for (audit of auditTrails(); track audit.guid) {\n        <div class=\"relative flex items-start first:pt-2.5 not-first:pt-4 not-last:pb-4 not-last:border-b not-last:border-border\">\n            <div class=\"absolute border border-border rounded-full p-2 flex items-center bg-[#f5f7f6] -left-9.25\">\n                <ng-icon\n                    size=\"14\"\n                    [name]=\"audit.icon\"\n                />\n            </div>\n\n            <div class=\"px-2 pt-1.25 w-full\">\n                <div class=\"flex items-center justify-between gap-3 select-none\">\n                    <div class=\"text-sm grow\">\n                        <b>{{ audit.user?.name }}</b> <span class=\"lowercase\">&nbsp;{{ audit.action }} <i class=\"text-muted-foreground\">•</i></span>\n                        <span class=\"text-muted-foreground text-xs\">&nbsp;{{ audit.createdAt | date: 'dd LLL yyyy HH:mm' }}</span>\n                    </div>\n\n                    <button\n                        type=\"button\"\n                        class=\"text-sm text-primary font-medium hover:underline shrink-0 cursor-pointer\"\n                        (click)=\"selectedTrail.set(audit)\"\n                    >\n                        Detail\n                    </button>\n                </div>\n\n                @if (\n                    audit.changedData && \n                    audit.changedData.length > 0\n                ) {\n                    <table class=\"w-full my-2 table-fixed border-collapse rounded-md select-none\">\n                        <thead class=\"border-inherit border-solid border-0\">\n                            <tr>\n                                <th class=\"w-[30%] p-2 text-left border border-border bg-[#f2f2f2] text-base border-tl-2\">Field</th>\n                                <th class=\"w-[35%] p-2 text-left border border-border bg-[#f2f2f2] text-base\">Old Value</th>\n                                <th class=\"w-[35%] p-2 text-left border border-border bg-[#f2f2f2] text-base border-tr-2\">New Value</th>\n                            </tr>\n                        </thead>\n\n                        <tbody class=\"border-inherit border-solid border-0\">\n                            @for (data of audit.changedData; track data.field; let even = $even) {\n                                <tr \n                                    [class]=\"even? 'bg-white': 'bg-[#f9f9f9]'\"\n                                >\n                                    <td class=\"p-2 text-left border border-border capitalize\">\n                                        {{ data.field }}\n                                    </td>\n\n                                    <td class=\"p-2 text-left border border-border capitalize\">\n                                        <div class=\"line-clamp-5 wrap-break-word\">{{ data.oldValue }}</div>\n                                    </td>\n\n                                    <td class=\"p-2 text-left border border-border capitalize\">\n                                        <div class=\"line-clamp-5 wrap-break-word\">{{ data.newValue }}</div>\n                                    </td>\n                                </tr>\n                            }\n                        </tbody>\n                    </table>\n                }\n            </div>\n        </div>\n    }\n</div>\n\n\n@if (hasMore()) {\n    <div \n        upInfiniteScroll\n        class=\"flex justify-center py-4\"\n        (scrolled)=\"loadData()\"\n    >\n        <up-spinner />\n    </div>\n}\n\n@defer (when selectedTrail()) {\n    <up-audit-modal\n        [audit]=\"selectedTrail()\"\n        (dismissed)=\"selectedTrail.set(null)\"\n    />\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":["i1.AuditService"],"mappings":"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"}