verben-workflow-ui 0.5.76 → 0.5.78

package/esm2022/src/lib/components/workflows/workflows.state.mjs

@@ -80,10 +80,10 @@ export class WorkflowsState {
         const currentValue = this.requests$.getValue();
         this.requests$.next(currentValue.filter((r) => r.Code !== requestId));
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: WorkflowsState, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: WorkflowsState, providedIn: 'root' });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: WorkflowsState, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: WorkflowsState, providedIn: 'root' });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: WorkflowsState, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: WorkflowsState, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root',

package/esm2022/src/lib/pipes/async-label.pipe.mjs

@@ -12,10 +12,10 @@ export class AsyncLabelPipe {
             return of('');
         return from(this.labelService.getAsyncLabelWithRequestTracking(code, entity, labelProp, env, key));
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: AsyncLabelPipe, deps: [{ token: i1.LabelService }], target: i0.ɵɵFactoryTarget.Pipe });
-    static ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "18.2.13", ngImport: i0, type: AsyncLabelPipe, isStandalone: true, name: "asyncLabel" });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: AsyncLabelPipe, deps: [{ token: i1.LabelService }], target: i0.ɵɵFactoryTarget.Pipe });
+    static ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "18.2.14", ngImport: i0, type: AsyncLabelPipe, isStandalone: true, name: "asyncLabel" });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: AsyncLabelPipe, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: AsyncLabelPipe, decorators: [{
             type: Pipe,
             args: [{
                     name: 'asyncLabel',

package/esm2022/src/lib/services/environment.service.mjs

@@ -12,10 +12,10 @@ export class EnvironmentService {
     get environment() {
         return this.env;
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: EnvironmentService, deps: [{ token: ENVIRONMENT }], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: EnvironmentService, providedIn: 'root' });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: EnvironmentService, deps: [{ token: ENVIRONMENT }], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: EnvironmentService, providedIn: 'root' });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: EnvironmentService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: EnvironmentService, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root',

package/esm2022/src/lib/services/http-web-request.service.mjs

@@ -78,10 +78,10 @@ export class HttpWebRequestService {
     delete(url, baseUrl, overrideToken) {
         return this.request('DELETE', url, undefined, overrideToken, baseUrl);
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: HttpWebRequestService, deps: [{ token: i1.HttpClient }, { token: i2.EnvironmentService }, { token: i3.NotificationService }], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: HttpWebRequestService, providedIn: 'root' });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: HttpWebRequestService, deps: [{ token: i1.HttpClient }, { token: i2.EnvironmentService }, { token: i3.NotificationService }], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: HttpWebRequestService, providedIn: 'root' });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: HttpWebRequestService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: HttpWebRequestService, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root',

package/esm2022/src/lib/services/label.service.mjs

@@ -122,10 +122,10 @@ export class LabelService {
         this.inFlightRequests.set(cacheKey, requestPromise);
         return requestPromise;
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: LabelService, deps: [{ token: i1.UtilService }, { token: i2.HttpWebRequestService }], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: LabelService, providedIn: 'root' });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: LabelService, deps: [{ token: i1.UtilService }, { token: i2.HttpWebRequestService }], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: LabelService, providedIn: 'root' });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: LabelService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: LabelService, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root',

package/esm2022/src/lib/services/util.service.mjs

@@ -48,10 +48,10 @@ export class UtilService {
             console.warn('Util Service is not provided');
         }
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: UtilService, deps: [{ token: UTIL_SERVICE, optional: true }], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: UtilService, providedIn: 'root' });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: UtilService, deps: [{ token: UTIL_SERVICE, optional: true }], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: UtilService, providedIn: 'root' });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: UtilService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: UtilService, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root',

package/esm2022/src/lib/shared/base-table-style.mjs

@@ -4,7 +4,7 @@ export const baseStyle = {
     fontSize: '125%',
     whiteSpace: 'nowrap',
     margin: '0',
-    border: '1px solid #D4A007',
+    border: '1px solid var(--vbn-color-primary)',
     borderRadius: '16px',
     borderCollapse: 'separate',
     borderSpacing: '0',
@@ -12,10 +12,10 @@ export const baseStyle = {
     overflow: 'hidden',
     rows: {
         even: {
-            backgroundColor: '#FDFDFD',
+            backgroundColor: 'var(--vbn-color-surface)',
         },
         odd: {
-            backgroundColor: '#F1F4FB',
+            backgroundColor: 'var(--vbn-color-surface-alt)',
         },
         height: '68px',
     },
@@ -25,7 +25,7 @@ export const baseStyle = {
     header: {
         stickyTop: true,
         // zIndex: 2,
-        backgroundColor: '#EFF2FB',
+        backgroundColor: 'var(--vbn-color-surface-alt)',
         fontWeight: 'bold',
         textAlign: 'left',
         padding: '12px 16px',
@@ -37,7 +37,7 @@ export const baseStyle = {
         padding: '3px',
     },
     //   body: {
-    //     background: '#fff',
+    //     background: 'var(--vbn-color-surface)',
     //     padding: '4px 5px',
     //     textAlign: 'center',
     //   },
@@ -52,4 +52,4 @@ export const baseStyle = {
         width: 'min-content',
     },
 };
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYmFzZS10YWJsZS1zdHlsZS5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL3ZlcmJlbi13b3JrZmxvdy11aS9zcmMvbGliL3NoYXJlZC9iYXNlLXRhYmxlLXN0eWxlLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUVBLE1BQU0sQ0FBQyxNQUFNLFNBQVMsR0FBZ0I7SUFDcEMsS0FBSyxFQUFFLE1BQU07SUFDYixVQUFVLEVBQUUsbUJBQW1CO0lBQy9CLFFBQVEsRUFBRSxNQUFNO0lBQ2hCLFVBQVUsRUFBRSxRQUFRO0lBQ3BCLE1BQU0sRUFBRSxHQUFHO0lBQ1gsTUFBTSxFQUFFLG1CQUFtQjtJQUMzQixZQUFZLEVBQUUsTUFBTTtJQUNwQixjQUFjLEVBQUUsVUFBVTtJQUMxQixhQUFhLEVBQUUsR0FBRztJQUNsQix3QkFBd0I7SUFDeEIsUUFBUSxFQUFFLFFBQVE7SUFDbEIsSUFBSSxFQUFFO1FBQ0osSUFBSSxFQUFFO1lBQ0osZUFBZSxFQUFFLFNBQVM7U0FDM0I7UUFDRCxHQUFHLEVBQUU7WUFDSCxlQUFlLEVBQUUsU0FBUztTQUMzQjtRQUNELE1BQU0sRUFBRSxNQUFNO0tBQ2Y7SUFDRCxLQUFLLEVBQUU7UUFDTCxPQUFPLEVBQUUsYUFBYTtLQUN2QjtJQUNELE1BQU0sRUFBRTtRQUNOLFNBQVMsRUFBRSxJQUFJO1FBQ2YsYUFBYTtRQUNiLGVBQWUsRUFBRSxTQUFTO1FBQzFCLFVBQVUsRUFBRSxNQUFNO1FBQ2xCLFNBQVMsRUFBRSxNQUFNO1FBQ2pCLE9BQU8sRUFBRSxXQUFXO1FBQ3BCLE1BQU0sRUFBRSxNQUFNO0tBQ2Y7SUFDRCxNQUFNLEVBQUU7UUFDTixzQkFBc0I7UUFDdEIsYUFBYTtRQUNiLE9BQU8sRUFBRSxLQUFLO0tBQ2Y7SUFDRCxZQUFZO0lBQ1osMEJBQTBCO0lBQzFCLDBCQUEwQjtJQUMxQiwyQkFBMkI7SUFDM0IsT0FBTztJQUNQLFdBQVcsRUFBRTtJQUNYLG9CQUFvQjtJQUNwQixhQUFhO0tBQ2Q7SUFDRCxVQUFVLEVBQUU7UUFDVixXQUFXLEVBQUUsSUFBSTtRQUNqQixNQUFNLEVBQUUsQ0FBQztRQUNULFNBQVMsRUFBRSxRQUFRO1FBQ25CLEtBQUssRUFBRSxhQUFhO0tBQ3JCO0NBQ0YsQ0FBQyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IFRhYmxlU3R5bGVzIH0gZnJvbSAndmVyYmVuLW5nLXVpJztcblxuZXhwb3J0IGNvbnN0IGJhc2VTdHlsZTogVGFibGVTdHlsZXMgPSB7XG4gIHdpZHRoOiAnMTAwJScsXG4gIGZvbnRGYW1pbHk6ICdcIkZyYXVuY2VzXCIsIHNlcmlmJyxcbiAgZm9udFNpemU6ICcxMjUlJyxcbiAgd2hpdGVTcGFjZTogJ25vd3JhcCcsXG4gIG1hcmdpbjogJzAnLFxuICBib3JkZXI6ICcxcHggc29saWQgI0Q0QTAwNycsXG4gIGJvcmRlclJhZGl1czogJzE2cHgnLFxuICBib3JkZXJDb2xsYXBzZTogJ3NlcGFyYXRlJyxcbiAgYm9yZGVyU3BhY2luZzogJzAnLFxuICAvLyB0YWJsZUxheW91dDogJ2ZpeGVkJyxcbiAgb3ZlcmZsb3c6ICdoaWRkZW4nLFxuICByb3dzOiB7XG4gICAgZXZlbjoge1xuICAgICAgYmFja2dyb3VuZENvbG9yOiAnI0ZERkRGRCcsXG4gICAgfSxcbiAgICBvZGQ6IHtcbiAgICAgIGJhY2tncm91bmRDb2xvcjogJyNGMUY0RkInLFxuICAgIH0sXG4gICAgaGVpZ2h0OiAnNjhweCcsXG4gIH0sXG4gIGNlbGxzOiB7XG4gICAgcGFkZGluZzogJzAuNXJlbSAxcmVtJyxcbiAgfSxcbiAgaGVhZGVyOiB7XG4gICAgc3RpY2t5VG9wOiB0cnVlLFxuICAgIC8vIHpJbmRleDogMixcbiAgICBiYWNrZ3JvdW5kQ29sb3I6ICcjRUZGMkZCJyxcbiAgICBmb250V2VpZ2h0OiAnYm9sZCcsXG4gICAgdGV4dEFsaWduOiAnbGVmdCcsXG4gICAgcGFkZGluZzogJzEycHggMTZweCcsXG4gICAgaGVpZ2h0OiAnNDBweCcsXG4gIH0sXG4gIGZvb3Rlcjoge1xuICAgIC8vIHN0aWNreUJvdHRvbTogdHJ1ZSxcbiAgICAvLyB6SW5kZXg6IDIsXG4gICAgcGFkZGluZzogJzNweCcsXG4gIH0sXG4gIC8vICAgYm9keToge1xuICAvLyAgICAgYmFja2dyb3VuZDogJyNmZmYnLFxuICAvLyAgICAgcGFkZGluZzogJzRweCA1cHgnLFxuICAvLyAgICAgdGV4dEFsaWduOiAnY2VudGVyJyxcbiAgLy8gICB9LFxuICBmaXJzdENvbHVtbjoge1xuICAgIC8vIHN0aWNreUxlZnQ6IHRydWUsXG4gICAgLy8gekluZGV4OiAxLFxuICB9LFxuICBsYXN0Q29sdW1uOiB7XG4gICAgc3RpY2t5UmlnaHQ6IHRydWUsXG4gICAgekluZGV4OiAxLFxuICAgIHRleHRBbGlnbjogJ2NlbnRlcicsXG4gICAgd2lkdGg6ICdtaW4tY29udGVudCcsXG4gIH0sXG59O1xuIl19
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYmFzZS10YWJsZS1zdHlsZS5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL3ZlcmJlbi13b3JrZmxvdy11aS9zcmMvbGliL3NoYXJlZC9iYXNlLXRhYmxlLXN0eWxlLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUVBLE1BQU0sQ0FBQyxNQUFNLFNBQVMsR0FBZ0I7SUFDcEMsS0FBSyxFQUFFLE1BQU07SUFDYixVQUFVLEVBQUUsbUJBQW1CO0lBQy9CLFFBQVEsRUFBRSxNQUFNO0lBQ2hCLFVBQVUsRUFBRSxRQUFRO0lBQ3BCLE1BQU0sRUFBRSxHQUFHO0lBQ1gsTUFBTSxFQUFFLG9DQUFvQztJQUM1QyxZQUFZLEVBQUUsTUFBTTtJQUNwQixjQUFjLEVBQUUsVUFBVTtJQUMxQixhQUFhLEVBQUUsR0FBRztJQUNsQix3QkFBd0I7SUFDeEIsUUFBUSxFQUFFLFFBQVE7SUFDbEIsSUFBSSxFQUFFO1FBQ0osSUFBSSxFQUFFO1lBQ0osZUFBZSxFQUFFLDBCQUEwQjtTQUM1QztRQUNELEdBQUcsRUFBRTtZQUNILGVBQWUsRUFBRSw4QkFBOEI7U0FDaEQ7UUFDRCxNQUFNLEVBQUUsTUFBTTtLQUNmO0lBQ0QsS0FBSyxFQUFFO1FBQ0wsT0FBTyxFQUFFLGFBQWE7S0FDdkI7SUFDRCxNQUFNLEVBQUU7UUFDTixTQUFTLEVBQUUsSUFBSTtRQUNmLGFBQWE7UUFDYixlQUFlLEVBQUUsOEJBQThCO1FBQy9DLFVBQVUsRUFBRSxNQUFNO1FBQ2xCLFNBQVMsRUFBRSxNQUFNO1FBQ2pCLE9BQU8sRUFBRSxXQUFXO1FBQ3BCLE1BQU0sRUFBRSxNQUFNO0tBQ2Y7SUFDRCxNQUFNLEVBQUU7UUFDTixzQkFBc0I7UUFDdEIsYUFBYTtRQUNiLE9BQU8sRUFBRSxLQUFLO0tBQ2Y7SUFDRCxZQUFZO0lBQ1osOENBQThDO0lBQzlDLDBCQUEwQjtJQUMxQiwyQkFBMkI7SUFDM0IsT0FBTztJQUNQLFdBQVcsRUFBRTtJQUNYLG9CQUFvQjtJQUNwQixhQUFhO0tBQ2Q7SUFDRCxVQUFVLEVBQUU7UUFDVixXQUFXLEVBQUUsSUFBSTtRQUNqQixNQUFNLEVBQUUsQ0FBQztRQUNULFNBQVMsRUFBRSxRQUFRO1FBQ25CLEtBQUssRUFBRSxhQUFhO0tBQ3JCO0NBQ0YsQ0FBQyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IFRhYmxlU3R5bGVzIH0gZnJvbSAndmVyYmVuLW5nLXVpJztcblxuZXhwb3J0IGNvbnN0IGJhc2VTdHlsZTogVGFibGVTdHlsZXMgPSB7XG4gIHdpZHRoOiAnMTAwJScsXG4gIGZvbnRGYW1pbHk6ICdcIkZyYXVuY2VzXCIsIHNlcmlmJyxcbiAgZm9udFNpemU6ICcxMjUlJyxcbiAgd2hpdGVTcGFjZTogJ25vd3JhcCcsXG4gIG1hcmdpbjogJzAnLFxuICBib3JkZXI6ICcxcHggc29saWQgdmFyKC0tdmJuLWNvbG9yLXByaW1hcnkpJyxcbiAgYm9yZGVyUmFkaXVzOiAnMTZweCcsXG4gIGJvcmRlckNvbGxhcHNlOiAnc2VwYXJhdGUnLFxuICBib3JkZXJTcGFjaW5nOiAnMCcsXG4gIC8vIHRhYmxlTGF5b3V0OiAnZml4ZWQnLFxuICBvdmVyZmxvdzogJ2hpZGRlbicsXG4gIHJvd3M6IHtcbiAgICBldmVuOiB7XG4gICAgICBiYWNrZ3JvdW5kQ29sb3I6ICd2YXIoLS12Ym4tY29sb3Itc3VyZmFjZSknLFxuICAgIH0sXG4gICAgb2RkOiB7XG4gICAgICBiYWNrZ3JvdW5kQ29sb3I6ICd2YXIoLS12Ym4tY29sb3Itc3VyZmFjZS1hbHQpJyxcbiAgICB9LFxuICAgIGhlaWdodDogJzY4cHgnLFxuICB9LFxuICBjZWxsczoge1xuICAgIHBhZGRpbmc6ICcwLjVyZW0gMXJlbScsXG4gIH0sXG4gIGhlYWRlcjoge1xuICAgIHN0aWNreVRvcDogdHJ1ZSxcbiAgICAvLyB6SW5kZXg6IDIsXG4gICAgYmFja2dyb3VuZENvbG9yOiAndmFyKC0tdmJuLWNvbG9yLXN1cmZhY2UtYWx0KScsXG4gICAgZm9udFdlaWdodDogJ2JvbGQnLFxuICAgIHRleHRBbGlnbjogJ2xlZnQnLFxuICAgIHBhZGRpbmc6ICcxMnB4IDE2cHgnLFxuICAgIGhlaWdodDogJzQwcHgnLFxuICB9LFxuICBmb290ZXI6IHtcbiAgICAvLyBzdGlja3lCb3R0b206IHRydWUsXG4gICAgLy8gekluZGV4OiAyLFxuICAgIHBhZGRpbmc6ICczcHgnLFxuICB9LFxuICAvLyAgIGJvZHk6IHtcbiAgLy8gICAgIGJhY2tncm91bmQ6ICd2YXIoLS12Ym4tY29sb3Itc3VyZmFjZSknLFxuICAvLyAgICAgcGFkZGluZzogJzRweCA1cHgnLFxuICAvLyAgICAgdGV4dEFsaWduOiAnY2VudGVyJyxcbiAgLy8gICB9LFxuICBmaXJzdENvbHVtbjoge1xuICAgIC8vIHN0aWNreUxlZnQ6IHRydWUsXG4gICAgLy8gekluZGV4OiAxLFxuICB9LFxuICBsYXN0Q29sdW1uOiB7XG4gICAgc3RpY2t5UmlnaHQ6IHRydWUsXG4gICAgekluZGV4OiAxLFxuICAgIHRleHRBbGlnbjogJ2NlbnRlcicsXG4gICAgd2lkdGg6ICdtaW4tY29udGVudCcsXG4gIH0sXG59O1xuIl19

package/esm2022/src/lib/shared/components/base-data-view.component.mjs

@@ -140,10 +140,10 @@ export class BaseDataViewComponent {
             this.dataView.toggleView();
         }
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: BaseDataViewComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "18.2.13", type: BaseDataViewComponent, selector: "ng-component", viewQueries: [{ propertyName: "dataTable", first: true, predicate: DataTableComponent, descendants: true, isSignal: true }, { propertyName: "cardDataView", first: true, predicate: ["vdcv"], descendants: true }, { propertyName: "dataView", first: true, predicate: ["vdv"], descendants: true }], ngImport: i0, template: '', isInline: true });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: BaseDataViewComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "18.2.14", type: BaseDataViewComponent, selector: "ng-component", viewQueries: [{ propertyName: "dataTable", first: true, predicate: DataTableComponent, descendants: true, isSignal: true }, { propertyName: "cardDataView", first: true, predicate: ["vdcv"], descendants: true }, { propertyName: "dataView", first: true, predicate: ["vdv"], descendants: true }], ngImport: i0, template: '', isInline: true });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: BaseDataViewComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: BaseDataViewComponent, decorators: [{
             type: Component,
             args: [{
                     template: '',

package/esm2022/src/lib/shared/shared.module.mjs

@@ -6,8 +6,8 @@ import { FormsModule, ReactiveFormsModule } from '@angular/forms';
 import { AsyncLabelPipe } from 'verben-workflow-ui/src/lib/pipes';
 import * as i0 from "@angular/core";
 export class SharedModule {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SharedModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.13", ngImport: i0, type: SharedModule, imports: [CommonModule, AsyncLabelPipe], exports: [CommonModule,
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: SharedModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.14", ngImport: i0, type: SharedModule, imports: [CommonModule, AsyncLabelPipe], exports: [CommonModule,
             DataTableModule,
             CardModule,
             SvgModule,
@@ -35,7 +35,7 @@ export class SharedModule {
             DataFilterModule,
             AsyncLabelPipe,
             EditorModule] });
-    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SharedModule, imports: [CommonModule, CommonModule,
+    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: SharedModule, imports: [CommonModule, CommonModule,
             DataTableModule,
             CardModule,
             SvgModule,
@@ -63,7 +63,7 @@ export class SharedModule {
             DataFilterModule,
             EditorModule] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SharedModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: SharedModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [],

package/fesm2022/verben-workflow-ui-src-lib-components-actors.mjs

@@ -115,10 +115,10 @@ class ActorService {
         const url = `GetActorTags/${skip}/${limit}/${sortParam}/${sortOrder}`;
         return this.httpService.get(url);
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ActorService, deps: [{ token: i1.HttpWebRequestService }, { token: i1.EnvironmentService }], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ActorService, providedIn: 'root' });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ActorService, deps: [{ token: i1.HttpWebRequestService }, { token: i1.EnvironmentService }], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ActorService, providedIn: 'root' });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ActorService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ActorService, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root',
@@ -211,10 +211,10 @@ class ActorState {
         const currentRequests = this.data$.getValue();
         this.data$.next([...currentRequests, ...newRequests]);
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ActorState, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ActorState, providedIn: 'root' });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ActorState, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ActorState, providedIn: 'root' });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ActorState, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ActorState, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root',
@@ -457,10 +457,10 @@ class ActorFacade {
             throw error;
         }
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ActorFacade, deps: [{ token: ActorService }, { token: ActorState }, { token: i1.UtilService }], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ActorFacade, providedIn: 'root' });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ActorFacade, deps: [{ token: ActorService }, { token: ActorState }, { token: i1.UtilService }], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ActorFacade, providedIn: 'root' });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ActorFacade, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ActorFacade, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root',
@@ -524,12 +524,12 @@ class ActorsFormComponent {
             this.onSave.emit(this.form.value);
         }
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ActorsFormComponent, deps: [{ token: i1$1.FormBuilder }, { token: ActorFacade }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: ActorsFormComponent, selector: "actors-form", inputs: { currentData: "currentData" }, outputs: { onSave: "onSave", switchView: "switchView" }, ngImport: i0, template: "<form [formGroup]=\"form\" class=\"flex flex-col px-3 pb-3 rounded-xl h-full w-full relative space-y-4\"\n  (ngSubmit)=\"handleSubmit()\">\n  <verbena-input name=\"Name\" label=\"Name\" formControlName=\"Name\" placeHolder=\"Enter Name\" />\n  <verbena-input name=\"Identifier\" label=\"Identifier\" formControlName=\"Identifier\" placeHolder=\"Actor Identifier\" />\n\n  <div class=\"space-y-1\">\n    <label for=\"tags\">Tags</label>\n\n    <verben-drop-down selectKey=\"Code\" label=\"Tags\" styleClass=\"w-full\" width=\"100%\" [multiselect]=\"true\"\n      placeholder=\"Select\" [options]=\"tags()\" optionLabel=\"Name\" id=\"tags\" formControlName=\"Tags\" class=\"form-control\">\n    </verben-drop-down>\n  </div>\n\n  <div class=\"space-y-1\">\n    <label for=\"actorTags\">Actor Tags</label>\n\n    <verben-drop-down selectKey=\"Code\" label=\"Actor Tags\" styleClass=\"w-full\" width=\"100%\" [multiselect]=\"true\"\n      placeholder=\"Select\" [options]=\"actorTags()\" optionLabel=\"Name\" id=\"actorTags\" formControlName=\"ActorTags\"\n      class=\"form-control\">\n    </verben-drop-down>\n  </div>\n\n  <div class=\"space-y-1\">\n    <label for=\"status\">Status</label>\n\n    <verben-drop-down label=\"Status\" styleClass=\"w-full\" width=\"100%\" [multiselect]=\"false\" placeholder=\"Select\"\n      [options]=\"statusOptions\" id=\"status\" formControlName=\"Status\" class=\"form-control\">\n    </verben-drop-down>\n  </div>\n\n  <div class=\"flex justify-between gap-4 my-2\">\n    <verbena-button (click)=\"switchView.emit()\" text=\"Switch To Table\" styleType=\"ylw-outline\"\n      class=\"ml-auto\"></verbena-button>\n    <verbena-button type=\"submit\" text=\"Save\" bgColor=\"#FFE681\" textColor=\"#404040\" borderRadius=\"10px\" pd=\"10px 20px\"\n      width=\"114px\" height=\"39px\" [disable]=\"form.invalid\"></verbena-button>\n  </div>\n</form>\n", dependencies: [{ kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: i4.VerbenaInputComponent, selector: "verbena-input", inputs: ["label", "placeHolder", "required", "svgPosition", "minLength", "maxLength", "type", "bgColor", "border", "borderRadius", "textColor", "value", "labelPosition", "labelColor", "disable", "readOnly", "min", "max", "showBorder", "showErrorMessage", "errorMessageColor", "errorBorderColor", "errorPosition", "svg", "fontSize", "svgWidth", "svgHeight", "svgColor", "capitalization", "inputContainerClass", "inputFieldClass", "passLength", "inputWrapperClass", "passwordToggle", "customErrorMessages", "icon", "textPass"], outputs: ["valueChange"] }, { kind: "component", type: i4.VerbenaButtonComponent, selector: "verbena-button", inputs: ["text", "icon", "useIcon", "svgPosition", "iconPosition", "bgColor", "textColor", "border", "borderRadius", "pd", "width", "height", "fontSize", "fontWeight", "disable", "svgSize", "weight", "variant", "styleType", "svg", "svgWidth", "svgHeight", "iconColor", "svgColor", "buttonClass", "buttonTextClass", "isLoading", "spinnerSize", "spinnerColor"] }, { kind: "component", type: i4.DropDownComponent, selector: "verben-drop-down", inputs: ["options", "width", "showHorizontalLine", "horizontalLineColor", "optionLabel", "optionSubLabel", "optionValue", "placeholder", "invalidMessage", "errorPosition", "loadMoreCaption", "display", "showClear", "lazyLoad", "selectKey", "styleClass", "group", "multiselect", "filter", "avoidDuplication", "filterBy", "debounceTime", "minChar", "disabled", "required", "load", "asyncLabel", "search"], outputs: ["optionsChange", "onChange", "onClick", "onClear"] }] });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ActorsFormComponent, deps: [{ token: i1$1.FormBuilder }, { token: ActorFacade }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: ActorsFormComponent, selector: "actors-form", inputs: { currentData: "currentData" }, outputs: { onSave: "onSave", switchView: "switchView" }, ngImport: i0, template: "<form [formGroup]=\"form\" class=\"flex flex-col px-3 pb-3 rounded-xl h-full w-full relative space-y-4\"\n  (ngSubmit)=\"handleSubmit()\">\n  <verbena-input name=\"Name\" label=\"Name\" formControlName=\"Name\" placeHolder=\"Enter Name\" />\n  <verbena-input name=\"Identifier\" label=\"Identifier\" formControlName=\"Identifier\" placeHolder=\"Actor Identifier\" />\n\n  <div class=\"space-y-1\">\n    <label for=\"tags\">Tags</label>\n\n    <verben-drop-down selectKey=\"Code\" label=\"Tags\" styleClass=\"w-full\" width=\"100%\" [multiselect]=\"true\"\n      placeholder=\"Select\" [options]=\"tags()\" optionLabel=\"Name\" id=\"tags\" formControlName=\"Tags\" class=\"form-control\">\n    </verben-drop-down>\n  </div>\n\n  <div class=\"space-y-1\">\n    <label for=\"actorTags\">Actor Tags</label>\n\n    <verben-drop-down selectKey=\"Code\" label=\"Actor Tags\" styleClass=\"w-full\" width=\"100%\" [multiselect]=\"true\"\n      placeholder=\"Select\" [options]=\"actorTags()\" optionLabel=\"Name\" id=\"actorTags\" formControlName=\"ActorTags\"\n      class=\"form-control\">\n    </verben-drop-down>\n  </div>\n\n  <div class=\"space-y-1\">\n    <label for=\"status\">Status</label>\n\n    <verben-drop-down label=\"Status\" styleClass=\"w-full\" width=\"100%\" [multiselect]=\"false\" placeholder=\"Select\"\n      [options]=\"statusOptions\" id=\"status\" formControlName=\"Status\" class=\"form-control\">\n    </verben-drop-down>\n  </div>\n\n  <div class=\"flex justify-between gap-4 my-2\">\n    <verbena-button (click)=\"switchView.emit()\" text=\"Switch To Table\" styleType=\"ylw-outline\"\n      class=\"ml-auto\"></verbena-button>\n    <verbena-button type=\"submit\" text=\"Save\" bgColor=\"var(--vbn-color-primary)\" textColor=\"var(--vbn-color-on-primary)\" borderRadius=\"10px\" pd=\"10px 20px\"\n      width=\"114px\" height=\"39px\" [disable]=\"form.invalid\"></verbena-button>\n  </div>\n</form>\n", dependencies: [{ kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: i4.VerbenaInputComponent, selector: "verbena-input", inputs: ["disabled", "label", "placeHolder", "required", "svgPosition", "minLength", "maxLength", "type", "bgColor", "border", "borderRadius", "textColor", "value", "labelPosition", "labelColor", "disable", "readOnly", "min", "max", "showBorder", "showErrorMessage", "errorMessageColor", "errorBorderColor", "errorPosition", "svg", "fontSize", "svgWidth", "svgHeight", "svgColor", "capitalization", "inputContainerClass", "inputFieldClass", "passLength", "inputWrapperClass", "passwordToggle", "customErrorMessages", "icon", "textPass"], outputs: ["valueChange"] }, { kind: "component", type: i4.VerbenaButtonComponent, selector: "verbena-button", inputs: ["type", "text", "icon", "useIcon", "svgPosition", "iconPosition", "bgColor", "textColor", "border", "borderRadius", "pd", "width", "height", "fontSize", "fontWeight", "disable", "svgSize", "weight", "variant", "styleType", "svg", "svgWidth", "svgHeight", "iconColor", "svgColor", "buttonClass", "buttonTextClass", "isLoading", "spinnerSize", "spinnerColor"] }, { kind: "component", type: i4.DropDownComponent, selector: "verben-drop-down", inputs: ["options", "width", "overlayWidth", "showHorizontalLine", "horizontalLineColor", "optionLabel", "optionSubLabel", "optionValue", "placeholder", "invalidMessage", "errorPosition", "loadMoreCaption", "display", "showClear", "lazyLoad", "selectKey", "styleClass", "group", "multiselect", "filter", "avoidDuplication", "filterBy", "debounceTime", "minChar", "refPageSize", "disabled", "required", "load", "asyncLabel", "search"], outputs: ["optionsChange", "onChange", "onClick", "onClear"] }] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ActorsFormComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ActorsFormComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'actors-form', template: "<form [formGroup]=\"form\" class=\"flex flex-col px-3 pb-3 rounded-xl h-full w-full relative space-y-4\"\n  (ngSubmit)=\"handleSubmit()\">\n  <verbena-input name=\"Name\" label=\"Name\" formControlName=\"Name\" placeHolder=\"Enter Name\" />\n  <verbena-input name=\"Identifier\" label=\"Identifier\" formControlName=\"Identifier\" placeHolder=\"Actor Identifier\" />\n\n  <div class=\"space-y-1\">\n    <label for=\"tags\">Tags</label>\n\n    <verben-drop-down selectKey=\"Code\" label=\"Tags\" styleClass=\"w-full\" width=\"100%\" [multiselect]=\"true\"\n      placeholder=\"Select\" [options]=\"tags()\" optionLabel=\"Name\" id=\"tags\" formControlName=\"Tags\" class=\"form-control\">\n    </verben-drop-down>\n  </div>\n\n  <div class=\"space-y-1\">\n    <label for=\"actorTags\">Actor Tags</label>\n\n    <verben-drop-down selectKey=\"Code\" label=\"Actor Tags\" styleClass=\"w-full\" width=\"100%\" [multiselect]=\"true\"\n      placeholder=\"Select\" [options]=\"actorTags()\" optionLabel=\"Name\" id=\"actorTags\" formControlName=\"ActorTags\"\n      class=\"form-control\">\n    </verben-drop-down>\n  </div>\n\n  <div class=\"space-y-1\">\n    <label for=\"status\">Status</label>\n\n    <verben-drop-down label=\"Status\" styleClass=\"w-full\" width=\"100%\" [multiselect]=\"false\" placeholder=\"Select\"\n      [options]=\"statusOptions\" id=\"status\" formControlName=\"Status\" class=\"form-control\">\n    </verben-drop-down>\n  </div>\n\n  <div class=\"flex justify-between gap-4 my-2\">\n    <verbena-button (click)=\"switchView.emit()\" text=\"Switch To Table\" styleType=\"ylw-outline\"\n      class=\"ml-auto\"></verbena-button>\n    <verbena-button type=\"submit\" text=\"Save\" bgColor=\"#FFE681\" textColor=\"#404040\" borderRadius=\"10px\" pd=\"10px 20px\"\n      width=\"114px\" height=\"39px\" [disable]=\"form.invalid\"></verbena-button>\n  </div>\n</form>\n" }]
+            args: [{ selector: 'actors-form', template: "<form [formGroup]=\"form\" class=\"flex flex-col px-3 pb-3 rounded-xl h-full w-full relative space-y-4\"\n  (ngSubmit)=\"handleSubmit()\">\n  <verbena-input name=\"Name\" label=\"Name\" formControlName=\"Name\" placeHolder=\"Enter Name\" />\n  <verbena-input name=\"Identifier\" label=\"Identifier\" formControlName=\"Identifier\" placeHolder=\"Actor Identifier\" />\n\n  <div class=\"space-y-1\">\n    <label for=\"tags\">Tags</label>\n\n    <verben-drop-down selectKey=\"Code\" label=\"Tags\" styleClass=\"w-full\" width=\"100%\" [multiselect]=\"true\"\n      placeholder=\"Select\" [options]=\"tags()\" optionLabel=\"Name\" id=\"tags\" formControlName=\"Tags\" class=\"form-control\">\n    </verben-drop-down>\n  </div>\n\n  <div class=\"space-y-1\">\n    <label for=\"actorTags\">Actor Tags</label>\n\n    <verben-drop-down selectKey=\"Code\" label=\"Actor Tags\" styleClass=\"w-full\" width=\"100%\" [multiselect]=\"true\"\n      placeholder=\"Select\" [options]=\"actorTags()\" optionLabel=\"Name\" id=\"actorTags\" formControlName=\"ActorTags\"\n      class=\"form-control\">\n    </verben-drop-down>\n  </div>\n\n  <div class=\"space-y-1\">\n    <label for=\"status\">Status</label>\n\n    <verben-drop-down label=\"Status\" styleClass=\"w-full\" width=\"100%\" [multiselect]=\"false\" placeholder=\"Select\"\n      [options]=\"statusOptions\" id=\"status\" formControlName=\"Status\" class=\"form-control\">\n    </verben-drop-down>\n  </div>\n\n  <div class=\"flex justify-between gap-4 my-2\">\n    <verbena-button (click)=\"switchView.emit()\" text=\"Switch To Table\" styleType=\"ylw-outline\"\n      class=\"ml-auto\"></verbena-button>\n    <verbena-button type=\"submit\" text=\"Save\" bgColor=\"var(--vbn-color-primary)\" textColor=\"var(--vbn-color-on-primary)\" borderRadius=\"10px\" pd=\"10px 20px\"\n      width=\"114px\" height=\"39px\" [disable]=\"form.invalid\"></verbena-button>\n  </div>\n</form>\n" }]
         }], ctorParameters: () => [{ type: i1$1.FormBuilder }, { type: ActorFacade }], propDecorators: { onSave: [{
                 type: Output
             }], switchView: [{
@@ -648,20 +648,20 @@ class ActorsComponent extends BaseDataViewComponent {
         const data = await this.facade.loadData(range.skip, range.limit);
         return data ?? [];
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ActorsComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: ActorFacade }, { token: i1$1.FormBuilder }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: ActorsComponent, selector: "lib-actors", usesInheritance: true, ngImport: i0, template: "<div class=\"space-y-8\">\n  <verben-data-view\n    #vdv\n    [viewState]=\"{\n      isSearch: true,\n      isColumn: true,\n      isFilter: true,\n      isSort: true,\n      isExport: true,\n      isSelect: true,\n      isCreate: false,\n      isToggle: true,\n    }\"\n    [buttonClass]=\"'my-custom-button-class'\"\n    [iconClass]=\"'my-icon-class'\"\n    [activeIconClass]=\"'my-active-icon-class'\"\n    [selectedColumnCount]=\"selectedColumnCount\"\n    [selectedSortCount]=\"selectedSortCount\"\n    [selectedFilterTableCount]=\"selectedFilterTableCount\"\n    (viewChange)=\"onViewChange($event)\"\n    (stateChange)=\"onStateChange($event)\"\n    (onSearchChange)=\"handleSearch($event)\"\n  >\n    <div table-content>\n      <lib-data-table\n        [data]=\"data()\"\n        [columns]=\"config.columns\"\n        [styleConfig]=\"styles\"\n        [formGroupConfig]=\"formGroupConfig()\"\n        (selectionChange)=\"onSelectionChange($event)\"\n        (rowSave)=\"onSave($event.data)\"\n      >\n        <ng-container libColumn=\"date\">\n          <ng-template #cell let-row=\"row\" let-value>\n            {{ value | date }}\n          </ng-template>\n        </ng-container>\n\n        <ng-container libColumn=\"name\">\n          <ng-template #cellEdit let-control=\"control\">\n            <verbena-input\n              name=\"Name\"\n              [formControl]=\"control\"\n              placeHolder=\"Enter Name\"\n            />\n          </ng-template>\n        </ng-container>\n\n        <ng-container libColumn=\"tags\">\n          <ng-template #cellEdit let-control=\"control\">\n            <verben-drop-down\n              styleClass=\"w-full\"\n              width=\"100%\"\n              [multiselect]=\"false\"\n              placeholder=\"Select tags\"\n              [options]=\"tags()\"\n              optionLabel=\"Name\"\n              id=\"tags\"\n              [formControl]=\"control\"\n              class=\"form-control\"\n            >\n            </verben-drop-down>\n          </ng-template>\n        </ng-container>\n\n        <ng-container libColumn=\"actions\">\n          <ng-template\n            #cell\n            let-value\n            let-isEditing=\"isEditing\"\n            let-toggleRowEdit=\"toggleRowEdit\"\n            let-deleteRow=\"deleteRow\"\n          >\n            <div class=\"flex gap-6\">\n              <verben-svg\n                (click)=\"toggleRowEdit()\"\n                icon=\"edit\"\n                [width]=\"15\"\n                [height]=\"15\"\n                class=\"cursor-pointer\"\n              ></verben-svg>\n\n              <verben-svg\n                icon=\"delete\"\n                [width]=\"15\"\n                [height]=\"15\"\n                (click)=\"deleteRow()\"\n                class=\"cursor-pointer\"\n              ></verben-svg>\n            </div>\n          </ng-template>\n\n          <ng-template\n            #cellEdit\n            let-value\n            let-deleteRow\n            let-isEditing=\"isEditing\"\n            let-toggleRowEdit=\"toggleRowEdit\"\n            let-row=\"row\"\n            let-rowIndex=\"rowIndex\"\n          >\n            <div class=\"flex gap-6\">\n              <verben-svg\n                (click)=\"toggleRowEdit()\"\n                icon=\"tick\"\n                [width]=\"15\"\n                [height]=\"15\"\n                class=\"cursor-pointer\"\n              ></verben-svg>\n\n              <verben-svg\n                icon=\"delete\"\n                [width]=\"15\"\n                [height]=\"15\"\n                (click)=\"toggleRowEdit()\"\n                class=\"cursor-pointer\"\n              ></verben-svg>\n            </div>\n          </ng-template>\n        </ng-container>\n      </lib-data-table>\n    </div>\n    <div card-content>\n      <verben-card-data-view\n        borderRadius=\"12px\"\n        (loadMoreClick)=\"loadMore()\"\n        #vdcv\n        dataId=\"Id\"\n        border=\"5px\"\n        [cardDataList]=\"cardData()\"\n        rbgColor=\"#f5f6f9\"\n        mg=\"20px\"\n      >\n        <verben-left-card-data-view class=\"space-y-7\">\n          <verben-left-card-data\n            #vlcd\n            [parent]=\"vdcv\"\n            dataId=\"Id\"\n            class=\"bg-secondary-100 rounded-xl border-primary border-[1px]\"\n            [cardDataList]=\"cardData()\"\n          >\n            <ng-template #card let-item>\n              <div (click)=\"currentData = vdcv.onItemClick(item)\" class=\"flex\">\n                <div\n                  (click)=\"currentData = vdcv.onItemClick(item)\"\n                  class=\"flex cursor-pointer w-full bg-secondary rounded-xl\"\n                >\n                  <div\n                    class=\"w-3 rounded-xl rounded-tr-none rounded-br-none\"\n                    [ngClass]=\"\n                      item.selected ? 'bg-primary' : 'bg-secondary-200'\n                    \"\n                  ></div>\n                  <div class=\"flex flex-col py-2 px-4 w-full\">\n                    <div class=\"flex items-center gap-4 justify-between\">\n                      <div class=\"grid gap-y-2\">\n                        <span class=\"font-semibold text-[#404040]\">{{\n                          item.title\n                        }}</span>\n                        <p class=\"flex items-center gap-1\">\n                          <label for=\"phone\" class=\"text-[10px] font-light\"\n                            >E-Mail:</label\n                          >\n                          <span id=\"phone\" class=\"text-sm\">{{\n                            item.data.Identifier\n                          }}</span>\n                        </p>\n                      </div>\n\n                      <!-- <div class=\"grid gap-y-2\">\n                        <span for=\"role\" class=\"font-light\">{{\n                          item.data.WorkflowCode\n                        }}</span>\n                        <a\n                          [routerLink]=\"[\n                            '/workflow/task-history',\n                            item.data.Code\n                          ]\"\n                          routerLinkActive=\"router-link-active\"\n                          class=\"underline text-[#0000FF] text-xs\"\n                          >view history</a\n                        >\n                      </div> -->\n\n                      <div class=\"grid gap-y-1\">\n                        <p class=\"grid\">\n                          <label\n                            for=\"role\"\n                            class=\"text-[10px] font-light text-[#404040]\"\n                            >Name</label\n                          >\n                          <span id=\"role\" class=\"text-sm font-medium\">{{\n                            item.data?.Name\n                          }}</span>\n                        </p>\n                      </div>\n                    </div>\n\n                    <!-- <div class=\"flex\">\n                      <span class=\"font-normal text-sm\">{{ item.title }}</span>\n                    </div>\n                    @for (ciItem of item.body; track ciItem.value) {\n                    <div class=\"\">\n                      <span class=\"text-muted font-light text-xs\"\n                        >{{ ciItem.title }}:</span\n                      >\n                      <span class=\"text-black\">{{ ciItem.value }}</span>\n                    </div>\n                    } -->\n                  </div>\n                </div>\n              </div>\n            </ng-template>\n          </verben-left-card-data>\n        </verben-left-card-data-view>\n\n        <verben-right-card-data-view>\n          <ng-template #parent>\n            <!-- <lib-user-request-form\n              [currentData]=\"currentData\"\n              (switchView)=\"vdv.toggleView()\"\n              (onApproval)=\"onApprove($event)\"\n            ></lib-user-request-form> -->\n            <actors-form\n              [currentData]=\"currentData\"\n              (switchView)=\"vdv.toggleView()\"\n              (onSave)=\"onSave($event)\"\n            ></actors-form>\n          </ng-template>\n        </verben-right-card-data-view>\n\n        <verben-card-data-view-footer class=\"w-full\">\n          <div\n            [ngClass]=\"{\n              'flex gap-2 items-center': true,\n              'justify-end': true\n            }\"\n          >\n            <!-- <verbena-button\n              *ngIf=\"!vdcv.hasCurrentItem()\"\n              [fontWeight]=\"'bold'\"\n              [bgColor]=\"'#8E8D87'\"\n              [borderRadius]=\"'4px'\"\n              [textColor]=\"'#fff'\"\n              [pd]=\"'9.79px 37.28px'\"\n              [text]=\"'Delete'\"\n            >\n            </verbena-button> -->\n            <div\n              class=\"flex {{\n                vdcv.hasCurrentItem() ? 'flex-1' : ''\n              }} justify-end items-center gap-5\"\n            >\n              <span class=\"paginator-text\"\n                >{{ cardData().length }} records loaded</span\n              >\n              <button\n                (click)=\"loadMore()\"\n                class=\"load-more view-links text-[#3479E9] underline\"\n              >\n                Load more\n              </button>\n            </div>\n          </div>\n        </verben-card-data-view-footer>\n      </verben-card-data-view>\n    </div>\n    <div column-content>\n      <lib-data-columns\n        [columns]=\"config.columns\"\n        (columnsUpdated)=\"onColumnsUpdated($event)\"\n      ></lib-data-columns>\n    </div>\n    <div filter-content>\n      <verben-table-filter\n        [border]=\"'1px solid rgba(212, 160, 7, 1)'\"\n        borderRadius=\"10px\"\n        boxShadow=\"2px 2px 2px 0px silver\"\n        bgColor=\"white\"\n        width=\"420px\"\n        textColor=\"black\"\n        pd=\"1rem\"\n        primaryColor=\"#FFE681\"\n        secondaryColor=\"#3479E9\"\n        tertiaryColor=\"#404040\"\n        [filterOptions]=\"filterArray\"\n        [maxFilterLength]=\"3\"\n      ></verben-table-filter>\n    </div>\n    <div sort-content>\n      <lib-data-sort\n        [columns]=\"config.columns\"\n        [data]=\"data()\"\n        (sortApplied)=\"onSortUpdated($event)\"\n      ></lib-data-sort>\n    </div>\n    <div export-content>\n      <lib-data-xport\n        [columns]=\"config.columns\"\n        [data]=\"data()\"\n        [dataQueryFunction]=\"loadData\"\n      >\n      </lib-data-xport>\n    </div>\n  </verben-data-view>\n\n  <div *ngIf=\"vdv.isTableView\" class=\"flex gap-2 justify-end\">\n    <!-- <div class=\"message-log-button-container flex justify-between\">\n      <verbena-button\n        [fontWeight]=\"'bold'\"\n        [bgColor]=\"'#8E8D87'\"\n        [borderRadius]=\"'4px'\"\n        [textColor]=\"'#fff'\"\n        [pd]=\"'9.79px 37.28px'\"\n        [text]=\"'Delete'\"\n      >\n      </verbena-button>\n    </div> -->\n    <div class=\"flex justify-end items-center gap-5\">\n      <span class=\"paginator-text\">{{ cardData().length }} records loaded</span>\n      <button\n        (click)=\"loadMore()\"\n        class=\"load-more view-links text-[#3479E9] underline\"\n      >\n        Load more\n      </button>\n    </div>\n  </div>\n</div>\n", styles: [""], dependencies: [{ kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i4.DataTableComponent, selector: "lib-data-table", inputs: ["data", "columns", "dataKey", "formGroupConfig", "groupBy", "useVirtualScroll", "virtualScrollItemSize", "styleConfig"], outputs: ["rowEdit", "rowSave", "rowRevert", "rowDelete", "selectionChange"] }, { kind: "directive", type: i4.ColumnDirective, selector: "[libColumn]", inputs: ["libColumn"] }, { kind: "component", type: i4.SvgComponent, selector: "verben-svg", inputs: ["icon", "width", "height", "fill", "stroke", "type", "size"] }, { kind: "component", type: i4.DataViewComponent, selector: "verben-data-view", inputs: ["buttonClass", "iconClass", "activeIconClass", "columnCustomClass", "filterCustomClass", "sortCustomClass", "extendCustomClass", "exportCustomClass", "selectCustomClass", "importCustomClass", "zIndex", "createCustomClass", "tableIcon", "cardIcon", "cardClass", "tableClass", "searchKey", "searchValue", "viewState", "searchTemplate", "importTemplate", "columnTemplate", "extendTemplate", "filterTemplate", "sortTemplate", "children", "exportTemplate", "createTemplate", "selectedColumnCount", "selectedSortCount", "selectedFilterTableCount", "inputWidth", "milliseconds", "showColumnChild", "showSortChild", "showFilterChild", "showImportChild", "showExportChild", "showExtendChild", "create", "showSelected", "isTableView"], outputs: ["viewChange", "stateChange", "onSearchChange"] }, { kind: "component", type: i4.CardDataViewComponent, selector: "verben-card-data-view", inputs: ["pd", "mg", "lHeight", "rHeight", "rWidth", "lWidth", "textColor", "lbgColor", "rbgColor", "border", "display", "borderRadius", "activeCss", "inActiveCss", "displayAsRow", "cardDataList", "dataId", "totalRecords", "footer", "noOfVisibleChildren", "showEditIcon", "onItemClick", "onCardChildClick"], outputs: ["editClicked", "loadMoreClick"] }, { kind: "component", type: i4.LeftCardDataComponent, selector: "verben-left-card-data", inputs: ["pd", "mg", "height", "weight", "activeCss", "inActiveCss", "cardDataList", "iconCollapse", "iconExpanded", "parent", "dataId"] }, { kind: "component", type: i4.LeftCardDataViewComponent, selector: "verben-left-card-data-view", inputs: ["cardDataList"] }, { kind: "component", type: i4.RightCardDataViewComponent, selector: "verben-right-card-data-view", inputs: ["parentData", "chilData", "meth"] }, { kind: "component", type: i4.CardDataViewFooterComponent, selector: "verben-card-data-view-footer" }, { kind: "component", type: i4.TableFilterComponent, selector: "verben-table-filter", inputs: ["filterOptions", "pd", "mg", "height", "width", "bgColor", "boxShadow", "textColor", "primaryColor", "secondaryColor", "tertiaryColor", "border", "borderRadius", "selectWidth", "maxFilterLength", "tooltip"], outputs: ["filtersApplied", "resetSortData"] }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: i4.VerbenaInputComponent, selector: "verbena-input", inputs: ["label", "placeHolder", "required", "svgPosition", "minLength", "maxLength", "type", "bgColor", "border", "borderRadius", "textColor", "value", "labelPosition", "labelColor", "disable", "readOnly", "min", "max", "showBorder", "showErrorMessage", "errorMessageColor", "errorBorderColor", "errorPosition", "svg", "fontSize", "svgWidth", "svgHeight", "svgColor", "capitalization", "inputContainerClass", "inputFieldClass", "passLength", "inputWrapperClass", "passwordToggle", "customErrorMessages", "icon", "textPass"], outputs: ["valueChange"] }, { kind: "component", type: i4.DropDownComponent, selector: "verben-drop-down", inputs: ["options", "width", "showHorizontalLine", "horizontalLineColor", "optionLabel", "optionSubLabel", "optionValue", "placeholder", "invalidMessage", "errorPosition", "loadMoreCaption", "display", "showClear", "lazyLoad", "selectKey", "styleClass", "group", "multiselect", "filter", "avoidDuplication", "filterBy", "debounceTime", "minChar", "disabled", "required", "load", "asyncLabel", "search"], outputs: ["optionsChange", "onChange", "onClick", "onClear"] }, { kind: "component", type: i4.DataColumnsComponent, selector: "lib-data-columns", inputs: ["columns", "enableDragAndDrop", "maxVisibleItems"], outputs: ["columnsUpdated"] }, { kind: "component", type: i4.DataXportComponent, selector: "lib-data-xport", inputs: ["data", "columns", "useImportKey", "dataFetchUrl", "dataQueryParameters", "dataQueryFunction"], outputs: ["exportDataEvent", "exportDataRangeEvent"] }, { kind: "component", type: i4.DataSortComponent, selector: "lib-data-sort", inputs: ["columns", "data", "enableDragAndDrop"], outputs: ["sortApplied", "resetFilter"] }, { kind: "component", type: ActorsFormComponent, selector: "actors-form", inputs: ["currentData"], outputs: ["onSave", "switchView"] }, { kind: "pipe", type: i3.DatePipe, name: "date" }] });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ActorsComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: ActorFacade }, { token: i1$1.FormBuilder }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: ActorsComponent, selector: "lib-actors", usesInheritance: true, ngImport: i0, template: "<div class=\"space-y-8\">\n  <verben-data-view\n    #vdv\n    [viewState]=\"{\n      isSearch: true,\n      isColumn: true,\n      isFilter: true,\n      isSort: true,\n      isExport: true,\n      isSelect: true,\n      isCreate: false,\n      isToggle: true,\n    }\"\n    [buttonClass]=\"'my-custom-button-class'\"\n    [iconClass]=\"'my-icon-class'\"\n    [activeIconClass]=\"'my-active-icon-class'\"\n    [selectedColumnCount]=\"selectedColumnCount\"\n    [selectedSortCount]=\"selectedSortCount\"\n    [selectedFilterTableCount]=\"selectedFilterTableCount\"\n    (viewChange)=\"onViewChange($event)\"\n    (stateChange)=\"onStateChange($event)\"\n    (onSearchChange)=\"handleSearch($event)\"\n  >\n    <div table-content>\n      <lib-data-table\n        [data]=\"data()\"\n        [columns]=\"config.columns\"\n        [styleConfig]=\"styles\"\n        [formGroupConfig]=\"formGroupConfig()\"\n        (selectionChange)=\"onSelectionChange($event)\"\n        (rowSave)=\"onSave($event.data)\"\n      >\n        <ng-container libColumn=\"date\">\n          <ng-template #cell let-row=\"row\" let-value>\n            {{ value | date }}\n          </ng-template>\n        </ng-container>\n\n        <ng-container libColumn=\"name\">\n          <ng-template #cellEdit let-control=\"control\">\n            <verbena-input\n              name=\"Name\"\n              [formControl]=\"control\"\n              placeHolder=\"Enter Name\"\n            />\n          </ng-template>\n        </ng-container>\n\n        <ng-container libColumn=\"tags\">\n          <ng-template #cellEdit let-control=\"control\">\n            <verben-drop-down\n              styleClass=\"w-full\"\n              width=\"100%\"\n              [multiselect]=\"false\"\n              placeholder=\"Select tags\"\n              [options]=\"tags()\"\n              optionLabel=\"Name\"\n              id=\"tags\"\n              [formControl]=\"control\"\n              class=\"form-control\"\n            >\n            </verben-drop-down>\n          </ng-template>\n        </ng-container>\n\n        <ng-container libColumn=\"actions\">\n          <ng-template\n            #cell\n            let-value\n            let-isEditing=\"isEditing\"\n            let-toggleRowEdit=\"toggleRowEdit\"\n            let-deleteRow=\"deleteRow\"\n          >\n            <div class=\"flex gap-6\">\n              <verben-svg\n                (click)=\"toggleRowEdit()\"\n                icon=\"edit\"\n                [width]=\"15\"\n                [height]=\"15\"\n                class=\"cursor-pointer\"\n              ></verben-svg>\n\n              <verben-svg\n                icon=\"delete\"\n                [width]=\"15\"\n                [height]=\"15\"\n                (click)=\"deleteRow()\"\n                class=\"cursor-pointer\"\n              ></verben-svg>\n            </div>\n          </ng-template>\n\n          <ng-template\n            #cellEdit\n            let-value\n            let-deleteRow\n            let-isEditing=\"isEditing\"\n            let-toggleRowEdit=\"toggleRowEdit\"\n            let-row=\"row\"\n            let-rowIndex=\"rowIndex\"\n          >\n            <div class=\"flex gap-6\">\n              <verben-svg\n                (click)=\"toggleRowEdit()\"\n                icon=\"tick\"\n                [width]=\"15\"\n                [height]=\"15\"\n                class=\"cursor-pointer\"\n              ></verben-svg>\n\n              <verben-svg\n                icon=\"delete\"\n                [width]=\"15\"\n                [height]=\"15\"\n                (click)=\"toggleRowEdit()\"\n                class=\"cursor-pointer\"\n              ></verben-svg>\n            </div>\n          </ng-template>\n        </ng-container>\n      </lib-data-table>\n    </div>\n    <div card-content>\n      <verben-card-data-view\n        borderRadius=\"12px\"\n        (loadMoreClick)=\"loadMore()\"\n        #vdcv\n        dataId=\"Id\"\n        border=\"5px\"\n        [cardDataList]=\"cardData()\"\n        rbgColor=\"var(--vbn-color-surface-alt)\"\n        mg=\"20px\"\n      >\n        <verben-left-card-data-view class=\"space-y-7\">\n          <verben-left-card-data\n            #vlcd\n            [parent]=\"vdcv\"\n            dataId=\"Id\"\n            class=\"bg-secondary-100 rounded-xl border-primary border-[1px]\"\n            [cardDataList]=\"cardData()\"\n          >\n            <ng-template #card let-item>\n              <div (click)=\"currentData = vdcv.onItemClick(item)\" class=\"flex\">\n                <div\n                  (click)=\"currentData = vdcv.onItemClick(item)\"\n                  class=\"flex cursor-pointer w-full bg-secondary rounded-xl\"\n                >\n                  <div\n                    class=\"w-3 rounded-xl rounded-tr-none rounded-br-none\"\n                    [ngClass]=\"\n                      item.selected ? 'bg-primary' : 'bg-secondary-200'\n                    \"\n                  ></div>\n                  <div class=\"flex flex-col py-2 px-4 w-full\">\n                    <div class=\"flex items-center gap-4 justify-between\">\n                      <div class=\"grid gap-y-2\">\n                        <span class=\"font-semibold text-[var(--vbn-color-on-primary)]\">{{\n                          item.title\n                        }}</span>\n                        <p class=\"flex items-center gap-1\">\n                          <label for=\"phone\" class=\"text-[10px] font-light\"\n                            >E-Mail:</label\n                          >\n                          <span id=\"phone\" class=\"text-sm\">{{\n                            item.data.Identifier\n                          }}</span>\n                        </p>\n                      </div>\n\n                      <!-- <div class=\"grid gap-y-2\">\n                        <span for=\"role\" class=\"font-light\">{{\n                          item.data.WorkflowCode\n                        }}</span>\n                        <a\n                          [routerLink]=\"[\n                            '/workflow/task-history',\n                            item.data.Code\n                          ]\"\n                          routerLinkActive=\"router-link-active\"\n                          class=\"underline text-[var(--vbn-color-border-focus)] text-xs\"\n                          >view history</a\n                        >\n                      </div> -->\n\n                      <div class=\"grid gap-y-1\">\n                        <p class=\"grid\">\n                          <label\n                            for=\"role\"\n                            class=\"text-[10px] font-light text-[var(--vbn-color-on-primary)]\"\n                            >Name</label\n                          >\n                          <span id=\"role\" class=\"text-sm font-medium\">{{\n                            item.data?.Name\n                          }}</span>\n                        </p>\n                      </div>\n                    </div>\n\n                    <!-- <div class=\"flex\">\n                      <span class=\"font-normal text-sm\">{{ item.title }}</span>\n                    </div>\n                    @for (ciItem of item.body; track ciItem.value) {\n                    <div class=\"\">\n                      <span class=\"text-muted font-light text-xs\"\n                        >{{ ciItem.title }}:</span\n                      >\n                      <span class=\"text-black\">{{ ciItem.value }}</span>\n                    </div>\n                    } -->\n                  </div>\n                </div>\n              </div>\n            </ng-template>\n          </verben-left-card-data>\n        </verben-left-card-data-view>\n\n        <verben-right-card-data-view>\n          <ng-template #parent>\n            <!-- <lib-user-request-form\n              [currentData]=\"currentData\"\n              (switchView)=\"vdv.toggleView()\"\n              (onApproval)=\"onApprove($event)\"\n            ></lib-user-request-form> -->\n            <actors-form\n              [currentData]=\"currentData\"\n              (switchView)=\"vdv.toggleView()\"\n              (onSave)=\"onSave($event)\"\n            ></actors-form>\n          </ng-template>\n        </verben-right-card-data-view>\n\n        <verben-card-data-view-footer class=\"w-full\">\n          <div\n            [ngClass]=\"{\n              'flex gap-2 items-center': true,\n              'justify-end': true\n            }\"\n          >\n            <!-- <verbena-button\n              *ngIf=\"!vdcv.hasCurrentItem()\"\n              [fontWeight]=\"'bold'\"\n              [bgColor]=\"'var(--vbn-color-text-muted)'\"\n              [borderRadius]=\"'4px'\"\n              [textColor]=\"'var(--vbn-color-surface)'\"\n              [pd]=\"'9.79px 37.28px'\"\n              [text]=\"'Delete'\"\n            >\n            </verbena-button> -->\n            <div\n              class=\"flex {{\n                vdcv.hasCurrentItem() ? 'flex-1' : ''\n              }} justify-end items-center gap-5\"\n            >\n              <span class=\"paginator-text\"\n                >{{ cardData().length }} records loaded</span\n              >\n              <button\n                (click)=\"loadMore()\"\n                class=\"load-more view-links text-[var(--vbn-color-border-focus)] underline\"\n              >\n                Load more\n              </button>\n            </div>\n          </div>\n        </verben-card-data-view-footer>\n      </verben-card-data-view>\n    </div>\n    <div column-content>\n      <lib-data-columns\n        [columns]=\"config.columns\"\n        (columnsUpdated)=\"onColumnsUpdated($event)\"\n      ></lib-data-columns>\n    </div>\n    <div filter-content>\n      <verben-table-filter\n        [border]=\"'1px solid var(--vbn-color-primary)'\"\n        borderRadius=\"10px\"\n        boxShadow=\"2px 2px 2px 0px silver\"\n        bgColor=\"white\"\n        width=\"420px\"\n        textColor=\"black\"\n        pd=\"1rem\"\n        primaryColor=\"var(--vbn-color-primary)\"\n        secondaryColor=\"var(--vbn-color-border-focus)\"\n        tertiaryColor=\"var(--vbn-color-on-primary)\"\n        [filterOptions]=\"filterArray\"\n        [maxFilterLength]=\"3\"\n      ></verben-table-filter>\n    </div>\n    <div sort-content>\n      <lib-data-sort\n        [columns]=\"config.columns\"\n        [data]=\"data()\"\n        (sortApplied)=\"onSortUpdated($event)\"\n      ></lib-data-sort>\n    </div>\n    <div export-content>\n      <lib-data-xport\n        [columns]=\"config.columns\"\n        [data]=\"data()\"\n        [dataQueryFunction]=\"loadData\"\n      >\n      </lib-data-xport>\n    </div>\n  </verben-data-view>\n\n  <div *ngIf=\"vdv.isTableView\" class=\"flex gap-2 justify-end\">\n    <!-- <div class=\"message-log-button-container flex justify-between\">\n      <verbena-button\n        [fontWeight]=\"'bold'\"\n        [bgColor]=\"'var(--vbn-color-text-muted)'\"\n        [borderRadius]=\"'4px'\"\n        [textColor]=\"'var(--vbn-color-surface)'\"\n        [pd]=\"'9.79px 37.28px'\"\n        [text]=\"'Delete'\"\n      >\n      </verbena-button>\n    </div> -->\n    <div class=\"flex justify-end items-center gap-5\">\n      <span class=\"paginator-text\">{{ cardData().length }} records loaded</span>\n      <button\n        (click)=\"loadMore()\"\n        class=\"load-more view-links text-[var(--vbn-color-border-focus)] underline\"\n      >\n        Load more\n      </button>\n    </div>\n  </div>\n</div>\n", styles: [""], dependencies: [{ kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i4.DataTableComponent, selector: "lib-data-table", inputs: ["data", "columns", "dataKey", "formGroupConfig", "groupBy", "useVirtualScroll", "virtualScrollItemSize", "styleConfig"], outputs: ["rowEdit", "rowSave", "rowRevert", "rowDelete", "selectionChange"] }, { kind: "directive", type: i4.ColumnDirective, selector: "[libColumn]", inputs: ["libColumn"] }, { kind: "component", type: i4.SvgComponent, selector: "verben-svg", inputs: ["icon", "width", "height", "fill", "stroke", "type", "size"] }, { kind: "component", type: i4.DataViewComponent, selector: "verben-data-view", inputs: ["buttonClass", "iconClass", "activeIconClass", "columnCustomClass", "filterCustomClass", "sortCustomClass", "extendCustomClass", "exportCustomClass", "selectCustomClass", "importCustomClass", "zIndex", "createCustomClass", "tableIcon", "cardIcon", "cardClass", "tableClass", "searchKey", "searchValue", "viewState", "searchTemplate", "importTemplate", "columnTemplate", "extendTemplate", "filterTemplate", "sortTemplate", "children", "exportTemplate", "createTemplate", "selectedColumnCount", "selectedSortCount", "selectedFilterTableCount", "inputWidth", "milliseconds", "showColumnChild", "showSortChild", "showFilterChild", "showImportChild", "showExportChild", "showExtendChild", "create", "showSelected", "isTableView"], outputs: ["viewChange", "stateChange", "onSearchChange"] }, { kind: "component", type: i4.CardDataViewComponent, selector: "verben-card-data-view", inputs: ["pd", "mg", "lHeight", "rHeight", "rWidth", "lWidth", "textColor", "lbgColor", "rbgColor", "border", "display", "borderRadius", "activeCss", "inActiveCss", "displayAsRow", "cardDataList", "dataId", "totalRecords", "footer", "noOfVisibleChildren", "showEditIcon", "useVirtualScroll", "virtualScrollItemSize", "onItemClick", "onCardChildClick"], outputs: ["editClicked", "loadMoreClick"] }, { kind: "component", type: i4.LeftCardDataComponent, selector: "verben-left-card-data", inputs: ["pd", "mg", "height", "weight", "activeCss", "inActiveCss", "cardDataList", "iconCollapse", "iconExpanded", "parent", "useVirtualScroll", "virtualScrollItemSize", "dataId"] }, { kind: "component", type: i4.LeftCardDataViewComponent, selector: "verben-left-card-data-view", inputs: ["cardDataList"] }, { kind: "component", type: i4.RightCardDataViewComponent, selector: "verben-right-card-data-view", inputs: ["parentData", "chilData", "meth"] }, { kind: "component", type: i4.CardDataViewFooterComponent, selector: "verben-card-data-view-footer" }, { kind: "component", type: i4.TableFilterComponent, selector: "verben-table-filter", inputs: ["filterOptions", "pd", "mg", "height", "width", "bgColor", "boxShadow", "textColor", "primaryColor", "secondaryColor", "tertiaryColor", "border", "borderRadius", "selectWidth", "maxFilterLength", "tooltip"], outputs: ["filtersApplied", "resetSortData"] }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: i4.VerbenaInputComponent, selector: "verbena-input", inputs: ["disabled", "label", "placeHolder", "required", "svgPosition", "minLength", "maxLength", "type", "bgColor", "border", "borderRadius", "textColor", "value", "labelPosition", "labelColor", "disable", "readOnly", "min", "max", "showBorder", "showErrorMessage", "errorMessageColor", "errorBorderColor", "errorPosition", "svg", "fontSize", "svgWidth", "svgHeight", "svgColor", "capitalization", "inputContainerClass", "inputFieldClass", "passLength", "inputWrapperClass", "passwordToggle", "customErrorMessages", "icon", "textPass"], outputs: ["valueChange"] }, { kind: "component", type: i4.DropDownComponent, selector: "verben-drop-down", inputs: ["options", "width", "overlayWidth", "showHorizontalLine", "horizontalLineColor", "optionLabel", "optionSubLabel", "optionValue", "placeholder", "invalidMessage", "errorPosition", "loadMoreCaption", "display", "showClear", "lazyLoad", "selectKey", "styleClass", "group", "multiselect", "filter", "avoidDuplication", "filterBy", "debounceTime", "minChar", "refPageSize", "disabled", "required", "load", "asyncLabel", "search"], outputs: ["optionsChange", "onChange", "onClick", "onClear"] }, { kind: "component", type: i4.DataColumnsComponent, selector: "lib-data-columns", inputs: ["columns", "enableDragAndDrop", "maxVisibleItems"], outputs: ["columnsUpdated"] }, { kind: "component", type: i4.DataXportComponent, selector: "lib-data-xport", inputs: ["data", "columns", "useImportKey", "includeFooterInExport", "dataFetchUrl", "dataQueryParameters", "dataQueryFunction"], outputs: ["exportDataEvent", "exportDataRangeEvent"] }, { kind: "component", type: i4.DataSortComponent, selector: "lib-data-sort", inputs: ["columns", "data", "enableDragAndDrop"], outputs: ["sortApplied", "resetFilter"] }, { kind: "component", type: ActorsFormComponent, selector: "actors-form", inputs: ["currentData"], outputs: ["onSave", "switchView"] }, { kind: "pipe", type: i3.DatePipe, name: "date" }] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ActorsComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ActorsComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'lib-actors', template: "<div class=\"space-y-8\">\n  <verben-data-view\n    #vdv\n    [viewState]=\"{\n      isSearch: true,\n      isColumn: true,\n      isFilter: true,\n      isSort: true,\n      isExport: true,\n      isSelect: true,\n      isCreate: false,\n      isToggle: true,\n    }\"\n    [buttonClass]=\"'my-custom-button-class'\"\n    [iconClass]=\"'my-icon-class'\"\n    [activeIconClass]=\"'my-active-icon-class'\"\n    [selectedColumnCount]=\"selectedColumnCount\"\n    [selectedSortCount]=\"selectedSortCount\"\n    [selectedFilterTableCount]=\"selectedFilterTableCount\"\n    (viewChange)=\"onViewChange($event)\"\n    (stateChange)=\"onStateChange($event)\"\n    (onSearchChange)=\"handleSearch($event)\"\n  >\n    <div table-content>\n      <lib-data-table\n        [data]=\"data()\"\n        [columns]=\"config.columns\"\n        [styleConfig]=\"styles\"\n        [formGroupConfig]=\"formGroupConfig()\"\n        (selectionChange)=\"onSelectionChange($event)\"\n        (rowSave)=\"onSave($event.data)\"\n      >\n        <ng-container libColumn=\"date\">\n          <ng-template #cell let-row=\"row\" let-value>\n            {{ value | date }}\n          </ng-template>\n        </ng-container>\n\n        <ng-container libColumn=\"name\">\n          <ng-template #cellEdit let-control=\"control\">\n            <verbena-input\n              name=\"Name\"\n              [formControl]=\"control\"\n              placeHolder=\"Enter Name\"\n            />\n          </ng-template>\n        </ng-container>\n\n        <ng-container libColumn=\"tags\">\n          <ng-template #cellEdit let-control=\"control\">\n            <verben-drop-down\n              styleClass=\"w-full\"\n              width=\"100%\"\n              [multiselect]=\"false\"\n              placeholder=\"Select tags\"\n              [options]=\"tags()\"\n              optionLabel=\"Name\"\n              id=\"tags\"\n              [formControl]=\"control\"\n              class=\"form-control\"\n            >\n            </verben-drop-down>\n          </ng-template>\n        </ng-container>\n\n        <ng-container libColumn=\"actions\">\n          <ng-template\n            #cell\n            let-value\n            let-isEditing=\"isEditing\"\n            let-toggleRowEdit=\"toggleRowEdit\"\n            let-deleteRow=\"deleteRow\"\n          >\n            <div class=\"flex gap-6\">\n              <verben-svg\n                (click)=\"toggleRowEdit()\"\n                icon=\"edit\"\n                [width]=\"15\"\n                [height]=\"15\"\n                class=\"cursor-pointer\"\n              ></verben-svg>\n\n              <verben-svg\n                icon=\"delete\"\n                [width]=\"15\"\n                [height]=\"15\"\n                (click)=\"deleteRow()\"\n                class=\"cursor-pointer\"\n              ></verben-svg>\n            </div>\n          </ng-template>\n\n          <ng-template\n            #cellEdit\n            let-value\n            let-deleteRow\n            let-isEditing=\"isEditing\"\n            let-toggleRowEdit=\"toggleRowEdit\"\n            let-row=\"row\"\n            let-rowIndex=\"rowIndex\"\n          >\n            <div class=\"flex gap-6\">\n              <verben-svg\n                (click)=\"toggleRowEdit()\"\n                icon=\"tick\"\n                [width]=\"15\"\n                [height]=\"15\"\n                class=\"cursor-pointer\"\n              ></verben-svg>\n\n              <verben-svg\n                icon=\"delete\"\n                [width]=\"15\"\n                [height]=\"15\"\n                (click)=\"toggleRowEdit()\"\n                class=\"cursor-pointer\"\n              ></verben-svg>\n            </div>\n          </ng-template>\n        </ng-container>\n      </lib-data-table>\n    </div>\n    <div card-content>\n      <verben-card-data-view\n        borderRadius=\"12px\"\n        (loadMoreClick)=\"loadMore()\"\n        #vdcv\n        dataId=\"Id\"\n        border=\"5px\"\n        [cardDataList]=\"cardData()\"\n        rbgColor=\"#f5f6f9\"\n        mg=\"20px\"\n      >\n        <verben-left-card-data-view class=\"space-y-7\">\n          <verben-left-card-data\n            #vlcd\n            [parent]=\"vdcv\"\n            dataId=\"Id\"\n            class=\"bg-secondary-100 rounded-xl border-primary border-[1px]\"\n            [cardDataList]=\"cardData()\"\n          >\n            <ng-template #card let-item>\n              <div (click)=\"currentData = vdcv.onItemClick(item)\" class=\"flex\">\n                <div\n                  (click)=\"currentData = vdcv.onItemClick(item)\"\n                  class=\"flex cursor-pointer w-full bg-secondary rounded-xl\"\n                >\n                  <div\n                    class=\"w-3 rounded-xl rounded-tr-none rounded-br-none\"\n                    [ngClass]=\"\n                      item.selected ? 'bg-primary' : 'bg-secondary-200'\n                    \"\n                  ></div>\n                  <div class=\"flex flex-col py-2 px-4 w-full\">\n                    <div class=\"flex items-center gap-4 justify-between\">\n                      <div class=\"grid gap-y-2\">\n                        <span class=\"font-semibold text-[#404040]\">{{\n                          item.title\n                        }}</span>\n                        <p class=\"flex items-center gap-1\">\n                          <label for=\"phone\" class=\"text-[10px] font-light\"\n                            >E-Mail:</label\n                          >\n                          <span id=\"phone\" class=\"text-sm\">{{\n                            item.data.Identifier\n                          }}</span>\n                        </p>\n                      </div>\n\n                      <!-- <div class=\"grid gap-y-2\">\n                        <span for=\"role\" class=\"font-light\">{{\n                          item.data.WorkflowCode\n                        }}</span>\n                        <a\n                          [routerLink]=\"[\n                            '/workflow/task-history',\n                            item.data.Code\n                          ]\"\n                          routerLinkActive=\"router-link-active\"\n                          class=\"underline text-[#0000FF] text-xs\"\n                          >view history</a\n                        >\n                      </div> -->\n\n                      <div class=\"grid gap-y-1\">\n                        <p class=\"grid\">\n                          <label\n                            for=\"role\"\n                            class=\"text-[10px] font-light text-[#404040]\"\n                            >Name</label\n                          >\n                          <span id=\"role\" class=\"text-sm font-medium\">{{\n                            item.data?.Name\n                          }}</span>\n                        </p>\n                      </div>\n                    </div>\n\n                    <!-- <div class=\"flex\">\n                      <span class=\"font-normal text-sm\">{{ item.title }}</span>\n                    </div>\n                    @for (ciItem of item.body; track ciItem.value) {\n                    <div class=\"\">\n                      <span class=\"text-muted font-light text-xs\"\n                        >{{ ciItem.title }}:</span\n                      >\n                      <span class=\"text-black\">{{ ciItem.value }}</span>\n                    </div>\n                    } -->\n                  </div>\n                </div>\n              </div>\n            </ng-template>\n          </verben-left-card-data>\n        </verben-left-card-data-view>\n\n        <verben-right-card-data-view>\n          <ng-template #parent>\n            <!-- <lib-user-request-form\n              [currentData]=\"currentData\"\n              (switchView)=\"vdv.toggleView()\"\n              (onApproval)=\"onApprove($event)\"\n            ></lib-user-request-form> -->\n            <actors-form\n              [currentData]=\"currentData\"\n              (switchView)=\"vdv.toggleView()\"\n              (onSave)=\"onSave($event)\"\n            ></actors-form>\n          </ng-template>\n        </verben-right-card-data-view>\n\n        <verben-card-data-view-footer class=\"w-full\">\n          <div\n            [ngClass]=\"{\n              'flex gap-2 items-center': true,\n              'justify-end': true\n            }\"\n          >\n            <!-- <verbena-button\n              *ngIf=\"!vdcv.hasCurrentItem()\"\n              [fontWeight]=\"'bold'\"\n              [bgColor]=\"'#8E8D87'\"\n              [borderRadius]=\"'4px'\"\n              [textColor]=\"'#fff'\"\n              [pd]=\"'9.79px 37.28px'\"\n              [text]=\"'Delete'\"\n            >\n            </verbena-button> -->\n            <div\n              class=\"flex {{\n                vdcv.hasCurrentItem() ? 'flex-1' : ''\n              }} justify-end items-center gap-5\"\n            >\n              <span class=\"paginator-text\"\n                >{{ cardData().length }} records loaded</span\n              >\n              <button\n                (click)=\"loadMore()\"\n                class=\"load-more view-links text-[#3479E9] underline\"\n              >\n                Load more\n              </button>\n            </div>\n          </div>\n        </verben-card-data-view-footer>\n      </verben-card-data-view>\n    </div>\n    <div column-content>\n      <lib-data-columns\n        [columns]=\"config.columns\"\n        (columnsUpdated)=\"onColumnsUpdated($event)\"\n      ></lib-data-columns>\n    </div>\n    <div filter-content>\n      <verben-table-filter\n        [border]=\"'1px solid rgba(212, 160, 7, 1)'\"\n        borderRadius=\"10px\"\n        boxShadow=\"2px 2px 2px 0px silver\"\n        bgColor=\"white\"\n        width=\"420px\"\n        textColor=\"black\"\n        pd=\"1rem\"\n        primaryColor=\"#FFE681\"\n        secondaryColor=\"#3479E9\"\n        tertiaryColor=\"#404040\"\n        [filterOptions]=\"filterArray\"\n        [maxFilterLength]=\"3\"\n      ></verben-table-filter>\n    </div>\n    <div sort-content>\n      <lib-data-sort\n        [columns]=\"config.columns\"\n        [data]=\"data()\"\n        (sortApplied)=\"onSortUpdated($event)\"\n      ></lib-data-sort>\n    </div>\n    <div export-content>\n      <lib-data-xport\n        [columns]=\"config.columns\"\n        [data]=\"data()\"\n        [dataQueryFunction]=\"loadData\"\n      >\n      </lib-data-xport>\n    </div>\n  </verben-data-view>\n\n  <div *ngIf=\"vdv.isTableView\" class=\"flex gap-2 justify-end\">\n    <!-- <div class=\"message-log-button-container flex justify-between\">\n      <verbena-button\n        [fontWeight]=\"'bold'\"\n        [bgColor]=\"'#8E8D87'\"\n        [borderRadius]=\"'4px'\"\n        [textColor]=\"'#fff'\"\n        [pd]=\"'9.79px 37.28px'\"\n        [text]=\"'Delete'\"\n      >\n      </verbena-button>\n    </div> -->\n    <div class=\"flex justify-end items-center gap-5\">\n      <span class=\"paginator-text\">{{ cardData().length }} records loaded</span>\n      <button\n        (click)=\"loadMore()\"\n        class=\"load-more view-links text-[#3479E9] underline\"\n      >\n        Load more\n      </button>\n    </div>\n  </div>\n</div>\n" }]
+            args: [{ selector: 'lib-actors', template: "<div class=\"space-y-8\">\n  <verben-data-view\n    #vdv\n    [viewState]=\"{\n      isSearch: true,\n      isColumn: true,\n      isFilter: true,\n      isSort: true,\n      isExport: true,\n      isSelect: true,\n      isCreate: false,\n      isToggle: true,\n    }\"\n    [buttonClass]=\"'my-custom-button-class'\"\n    [iconClass]=\"'my-icon-class'\"\n    [activeIconClass]=\"'my-active-icon-class'\"\n    [selectedColumnCount]=\"selectedColumnCount\"\n    [selectedSortCount]=\"selectedSortCount\"\n    [selectedFilterTableCount]=\"selectedFilterTableCount\"\n    (viewChange)=\"onViewChange($event)\"\n    (stateChange)=\"onStateChange($event)\"\n    (onSearchChange)=\"handleSearch($event)\"\n  >\n    <div table-content>\n      <lib-data-table\n        [data]=\"data()\"\n        [columns]=\"config.columns\"\n        [styleConfig]=\"styles\"\n        [formGroupConfig]=\"formGroupConfig()\"\n        (selectionChange)=\"onSelectionChange($event)\"\n        (rowSave)=\"onSave($event.data)\"\n      >\n        <ng-container libColumn=\"date\">\n          <ng-template #cell let-row=\"row\" let-value>\n            {{ value | date }}\n          </ng-template>\n        </ng-container>\n\n        <ng-container libColumn=\"name\">\n          <ng-template #cellEdit let-control=\"control\">\n            <verbena-input\n              name=\"Name\"\n              [formControl]=\"control\"\n              placeHolder=\"Enter Name\"\n            />\n          </ng-template>\n        </ng-container>\n\n        <ng-container libColumn=\"tags\">\n          <ng-template #cellEdit let-control=\"control\">\n            <verben-drop-down\n              styleClass=\"w-full\"\n              width=\"100%\"\n              [multiselect]=\"false\"\n              placeholder=\"Select tags\"\n              [options]=\"tags()\"\n              optionLabel=\"Name\"\n              id=\"tags\"\n              [formControl]=\"control\"\n              class=\"form-control\"\n            >\n            </verben-drop-down>\n          </ng-template>\n        </ng-container>\n\n        <ng-container libColumn=\"actions\">\n          <ng-template\n            #cell\n            let-value\n            let-isEditing=\"isEditing\"\n            let-toggleRowEdit=\"toggleRowEdit\"\n            let-deleteRow=\"deleteRow\"\n          >\n            <div class=\"flex gap-6\">\n              <verben-svg\n                (click)=\"toggleRowEdit()\"\n                icon=\"edit\"\n                [width]=\"15\"\n                [height]=\"15\"\n                class=\"cursor-pointer\"\n              ></verben-svg>\n\n              <verben-svg\n                icon=\"delete\"\n                [width]=\"15\"\n                [height]=\"15\"\n                (click)=\"deleteRow()\"\n                class=\"cursor-pointer\"\n              ></verben-svg>\n            </div>\n          </ng-template>\n\n          <ng-template\n            #cellEdit\n            let-value\n            let-deleteRow\n            let-isEditing=\"isEditing\"\n            let-toggleRowEdit=\"toggleRowEdit\"\n            let-row=\"row\"\n            let-rowIndex=\"rowIndex\"\n          >\n            <div class=\"flex gap-6\">\n              <verben-svg\n                (click)=\"toggleRowEdit()\"\n                icon=\"tick\"\n                [width]=\"15\"\n                [height]=\"15\"\n                class=\"cursor-pointer\"\n              ></verben-svg>\n\n              <verben-svg\n                icon=\"delete\"\n                [width]=\"15\"\n                [height]=\"15\"\n                (click)=\"toggleRowEdit()\"\n                class=\"cursor-pointer\"\n              ></verben-svg>\n            </div>\n          </ng-template>\n        </ng-container>\n      </lib-data-table>\n    </div>\n    <div card-content>\n      <verben-card-data-view\n        borderRadius=\"12px\"\n        (loadMoreClick)=\"loadMore()\"\n        #vdcv\n        dataId=\"Id\"\n        border=\"5px\"\n        [cardDataList]=\"cardData()\"\n        rbgColor=\"var(--vbn-color-surface-alt)\"\n        mg=\"20px\"\n      >\n        <verben-left-card-data-view class=\"space-y-7\">\n          <verben-left-card-data\n            #vlcd\n            [parent]=\"vdcv\"\n            dataId=\"Id\"\n            class=\"bg-secondary-100 rounded-xl border-primary border-[1px]\"\n            [cardDataList]=\"cardData()\"\n          >\n            <ng-template #card let-item>\n              <div (click)=\"currentData = vdcv.onItemClick(item)\" class=\"flex\">\n                <div\n                  (click)=\"currentData = vdcv.onItemClick(item)\"\n                  class=\"flex cursor-pointer w-full bg-secondary rounded-xl\"\n                >\n                  <div\n                    class=\"w-3 rounded-xl rounded-tr-none rounded-br-none\"\n                    [ngClass]=\"\n                      item.selected ? 'bg-primary' : 'bg-secondary-200'\n                    \"\n                  ></div>\n                  <div class=\"flex flex-col py-2 px-4 w-full\">\n                    <div class=\"flex items-center gap-4 justify-between\">\n                      <div class=\"grid gap-y-2\">\n                        <span class=\"font-semibold text-[var(--vbn-color-on-primary)]\">{{\n                          item.title\n                        }}</span>\n                        <p class=\"flex items-center gap-1\">\n                          <label for=\"phone\" class=\"text-[10px] font-light\"\n                            >E-Mail:</label\n                          >\n                          <span id=\"phone\" class=\"text-sm\">{{\n                            item.data.Identifier\n                          }}</span>\n                        </p>\n                      </div>\n\n                      <!-- <div class=\"grid gap-y-2\">\n                        <span for=\"role\" class=\"font-light\">{{\n                          item.data.WorkflowCode\n                        }}</span>\n                        <a\n                          [routerLink]=\"[\n                            '/workflow/task-history',\n                            item.data.Code\n                          ]\"\n                          routerLinkActive=\"router-link-active\"\n                          class=\"underline text-[var(--vbn-color-border-focus)] text-xs\"\n                          >view history</a\n                        >\n                      </div> -->\n\n                      <div class=\"grid gap-y-1\">\n                        <p class=\"grid\">\n                          <label\n                            for=\"role\"\n                            class=\"text-[10px] font-light text-[var(--vbn-color-on-primary)]\"\n                            >Name</label\n                          >\n                          <span id=\"role\" class=\"text-sm font-medium\">{{\n                            item.data?.Name\n                          }}</span>\n                        </p>\n                      </div>\n                    </div>\n\n                    <!-- <div class=\"flex\">\n                      <span class=\"font-normal text-sm\">{{ item.title }}</span>\n                    </div>\n                    @for (ciItem of item.body; track ciItem.value) {\n                    <div class=\"\">\n                      <span class=\"text-muted font-light text-xs\"\n                        >{{ ciItem.title }}:</span\n                      >\n                      <span class=\"text-black\">{{ ciItem.value }}</span>\n                    </div>\n                    } -->\n                  </div>\n                </div>\n              </div>\n            </ng-template>\n          </verben-left-card-data>\n        </verben-left-card-data-view>\n\n        <verben-right-card-data-view>\n          <ng-template #parent>\n            <!-- <lib-user-request-form\n              [currentData]=\"currentData\"\n              (switchView)=\"vdv.toggleView()\"\n              (onApproval)=\"onApprove($event)\"\n            ></lib-user-request-form> -->\n            <actors-form\n              [currentData]=\"currentData\"\n              (switchView)=\"vdv.toggleView()\"\n              (onSave)=\"onSave($event)\"\n            ></actors-form>\n          </ng-template>\n        </verben-right-card-data-view>\n\n        <verben-card-data-view-footer class=\"w-full\">\n          <div\n            [ngClass]=\"{\n              'flex gap-2 items-center': true,\n              'justify-end': true\n            }\"\n          >\n            <!-- <verbena-button\n              *ngIf=\"!vdcv.hasCurrentItem()\"\n              [fontWeight]=\"'bold'\"\n              [bgColor]=\"'var(--vbn-color-text-muted)'\"\n              [borderRadius]=\"'4px'\"\n              [textColor]=\"'var(--vbn-color-surface)'\"\n              [pd]=\"'9.79px 37.28px'\"\n              [text]=\"'Delete'\"\n            >\n            </verbena-button> -->\n            <div\n              class=\"flex {{\n                vdcv.hasCurrentItem() ? 'flex-1' : ''\n              }} justify-end items-center gap-5\"\n            >\n              <span class=\"paginator-text\"\n                >{{ cardData().length }} records loaded</span\n              >\n              <button\n                (click)=\"loadMore()\"\n                class=\"load-more view-links text-[var(--vbn-color-border-focus)] underline\"\n              >\n                Load more\n              </button>\n            </div>\n          </div>\n        </verben-card-data-view-footer>\n      </verben-card-data-view>\n    </div>\n    <div column-content>\n      <lib-data-columns\n        [columns]=\"config.columns\"\n        (columnsUpdated)=\"onColumnsUpdated($event)\"\n      ></lib-data-columns>\n    </div>\n    <div filter-content>\n      <verben-table-filter\n        [border]=\"'1px solid var(--vbn-color-primary)'\"\n        borderRadius=\"10px\"\n        boxShadow=\"2px 2px 2px 0px silver\"\n        bgColor=\"white\"\n        width=\"420px\"\n        textColor=\"black\"\n        pd=\"1rem\"\n        primaryColor=\"var(--vbn-color-primary)\"\n        secondaryColor=\"var(--vbn-color-border-focus)\"\n        tertiaryColor=\"var(--vbn-color-on-primary)\"\n        [filterOptions]=\"filterArray\"\n        [maxFilterLength]=\"3\"\n      ></verben-table-filter>\n    </div>\n    <div sort-content>\n      <lib-data-sort\n        [columns]=\"config.columns\"\n        [data]=\"data()\"\n        (sortApplied)=\"onSortUpdated($event)\"\n      ></lib-data-sort>\n    </div>\n    <div export-content>\n      <lib-data-xport\n        [columns]=\"config.columns\"\n        [data]=\"data()\"\n        [dataQueryFunction]=\"loadData\"\n      >\n      </lib-data-xport>\n    </div>\n  </verben-data-view>\n\n  <div *ngIf=\"vdv.isTableView\" class=\"flex gap-2 justify-end\">\n    <!-- <div class=\"message-log-button-container flex justify-between\">\n      <verbena-button\n        [fontWeight]=\"'bold'\"\n        [bgColor]=\"'var(--vbn-color-text-muted)'\"\n        [borderRadius]=\"'4px'\"\n        [textColor]=\"'var(--vbn-color-surface)'\"\n        [pd]=\"'9.79px 37.28px'\"\n        [text]=\"'Delete'\"\n      >\n      </verbena-button>\n    </div> -->\n    <div class=\"flex justify-end items-center gap-5\">\n      <span class=\"paginator-text\">{{ cardData().length }} records loaded</span>\n      <button\n        (click)=\"loadMore()\"\n        class=\"load-more view-links text-[var(--vbn-color-border-focus)] underline\"\n      >\n        Load more\n      </button>\n    </div>\n  </div>\n</div>\n" }]
         }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: ActorFacade }, { type: i1$1.FormBuilder }] });
 
 class ActorsModule {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ActorsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.13", ngImport: i0, type: ActorsModule, declarations: [ActorsComponent, ActorsFormComponent], imports: [CommonModule, SharedModule, RouterLink], exports: [ActorsComponent] });
-    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ActorsModule, imports: [CommonModule, SharedModule] });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ActorsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.14", ngImport: i0, type: ActorsModule, declarations: [ActorsComponent, ActorsFormComponent], imports: [CommonModule, SharedModule, RouterLink], exports: [ActorsComponent] });
+    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ActorsModule, imports: [CommonModule, SharedModule] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ActorsModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ActorsModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [ActorsComponent, ActorsFormComponent],