ets-fe-ng-sdk 18.0.21 → 18.0.23

package/fesm2022/ets-fe-ng-sdk.mjs

@@ -3,7 +3,7 @@ import { FormControl, Validators, FormArray, FormGroup, FormBuilder, NG_VALUE_AC
 import 'zone.js/plugins/zone-error';
 import { cloneDeep, uniqBy, isEqual, isEmpty, clone } from 'lodash-es';
 import * as i0 from '@angular/core';
-import { Injectable, signal, computed, inject, Pipe, NgModule, Directive, Input, booleanAttribute, input, model, EventEmitter, effect, Component, Output, ViewChild, forwardRef, HostListener, viewChild, output, Inject, HostBinding, DestroyRef, contentChild, ChangeDetectorRef, ChangeDetectionStrategy, InjectionToken, ErrorHandler } from '@angular/core';
+import { Injectable, signal, computed, inject, Pipe, NgModule, Directive, Input, booleanAttribute, input, model, EventEmitter, effect, Component, ChangeDetectionStrategy, Output, ViewChild, forwardRef, HostListener, viewChild, output, Inject, HostBinding, DestroyRef, contentChild, ChangeDetectorRef, InjectionToken, ErrorHandler } from '@angular/core';
 import * as i1 from '@angular/common';
 import { Location, CurrencyPipe, TitleCasePipe, DatePipe, DecimalPipe, CommonModule, NgClass, JsonPipe, AsyncPipe, NgIf, NgFor, UpperCasePipe, NgSwitch, NgSwitchCase, NgSwitchDefault, NgTemplateOutlet, NgStyle } from '@angular/common';
 import { faPlus, faSlidersH, faMoneyCheck, faCancel, faCheck, faListAlt, faClone, faCogs, faTrash, faDownload, faEdit, faFileExport, faFile, faFilter, faPenFancy, faUserShield, faHistory, faHome, faFileImport, faInfoCircle, faLock, faArrowRight, faPause, faPen, faArrowLeft, faRecycle, faSave, faSearch, faEye, faBellSlash, faUpload, faUnlock, faUsers, faStop, faTruck, faTag, faReceipt, faBank, faArrowsH, faPlay, faPercent, faHandshake, faCircleExclamation, faTable, faSpoon } from '@fortawesome/free-solid-svg-icons';
@@ -3707,11 +3707,11 @@ class BtnComponent {
         this.disabled.set(false);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.1", ngImport: i0, type: BtnComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.1", type: BtnComponent, isStandalone: true, selector: "app-btn", inputs: { formSchema: { classPropertyName: "formSchema", publicName: "formSchema", isSignal: true, isRequired: false, transformFunction: null }, debug: { classPropertyName: "debug", publicName: "debug", isSignal: true, isRequired: false, transformFunction: null }, centerBtn: { classPropertyName: "centerBtn", publicName: "centerBtn", isSignal: true, isRequired: false, transformFunction: null }, danger: { classPropertyName: "danger", publicName: "danger", isSignal: true, isRequired: false, transformFunction: null }, warning: { classPropertyName: "warning", publicName: "warning", isSignal: true, isRequired: false, transformFunction: null }, verbose: { classPropertyName: "verbose", publicName: "verbose", isSignal: true, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, _icon: { classPropertyName: "_icon", publicName: "icon", isSignal: false, isRequired: false, transformFunction: null }, _rightIcon: { classPropertyName: "_rightIcon", publicName: "rightIcon", isSignal: false, isRequired: false, transformFunction: null }, _leftIcon: { classPropertyName: "_leftIcon", publicName: "leftIcon", isSignal: false, isRequired: false, transformFunction: null }, _type: { classPropertyName: "_type", publicName: "type", isSignal: false, isRequired: false, transformFunction: null }, _group: { classPropertyName: "_group", publicName: "group", isSignal: false, isRequired: false, transformFunction: null }, actionType: { classPropertyName: "actionType", publicName: "actionType", isSignal: true, isRequired: false, transformFunction: null }, animate: { classPropertyName: "animate", publicName: "animate", isSignal: true, isRequired: false, transformFunction: null }, excludeLogging: { classPropertyName: "excludeLogging", publicName: "excludeLogging", isSignal: false, isRequired: false, transformFunction: booleanAttribute2 }, loggingValue: { classPropertyName: "loggingValue", publicName: "loggingValue", isSignal: false, isRequired: false, transformFunction: null }, badge: { classPropertyName: "badge", publicName: "badge", isSignal: true, isRequired: false, transformFunction: null }, class: { classPropertyName: "class", publicName: "class", isSignal: true, isRequired: false, transformFunction: null }, customIcon: { classPropertyName: "customIcon", publicName: "customIcon", isSignal: false, isRequired: false, transformFunction: null }, form: { classPropertyName: "form", publicName: "form", isSignal: true, isRequired: false, transformFunction: null }, forms: { classPropertyName: "forms", publicName: "forms", isSignal: true, isRequired: false, transformFunction: null }, help: { classPropertyName: "help", publicName: "help", isSignal: true, isRequired: false, transformFunction: null }, _iconBtn: { classPropertyName: "_iconBtn", publicName: "iconBtn", isSignal: false, isRequired: false, transformFunction: booleanAttribute2 }, mclass: { classPropertyName: "mclass", publicName: "mclass", isSignal: true, isRequired: false, transformFunction: null }, showHelpIcon: { classPropertyName: "showHelpIcon", publicName: "showHelpIcon", isSignal: true, isRequired: false, transformFunction: null }, _rightCustomIcon: { classPropertyName: "_rightCustomIcon", publicName: "rightCustomIcon", isSignal: false, isRequired: false, transformFunction: null }, leftCustomIcon: { classPropertyName: "leftCustomIcon", publicName: "leftCustomIcon", isSignal: true, isRequired: false, transformFunction: null }, text: { classPropertyName: "text", publicName: "text", isSignal: true, isRequired: false, transformFunction: null }, valid: { classPropertyName: "valid", publicName: "valid", isSignal: true, isRequired: false, transformFunction: null }, mini: { classPropertyName: "mini", publicName: "mini", isSignal: true, isRequired: false, transformFunction: null }, onFormInvalid: { classPropertyName: "onFormInvalid", publicName: "onFormInvalid", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { loading: "loadingChange", leftCustomIcon: "leftCustomIconChange", mclick: "mclick", disabled: "disabledChange" }, viewQueries: [{ propertyName: "innerText", first: true, predicate: ["innerText"], descendants: true }], ngImport: i0, template: "@if (verbose()) {\n <div class=\"\">\n  formState():{{formState()|json}}\n </div>\n <div class=\"\">\n  form():{{form()?.value|json}}\n </div>\n}\n<span\n  class=\"{{ class() }}  d-flex  align-items-center justify-content-center\"\n  [ngClass]=\"{ disabled: isDisabled(), mini: mini() }\"\n  (click)=\"btnS.checkForm(this)\">\n  @if (showHelpIcon() && help()) {\n    <i class=\"fa fa-info-circle me-2 text-primary\" [matTooltip]=\"help() | appTranslate | async\"></i>\n  }\n  <button\n    type=\"{{ actionType() }}\"\n    class=\"{{ mclass() }} {{ _mclass() || 'btn' }} d-flex align-items-center \"\n    [matBadge]=\"badge()\"\n    [ngClass]=\"{\n      changecolor: valid(),\n      'btn-raised': animate(),\n      disabled: isDisabled(),\n      isDanger: danger(),\n      isWarning: warning(),\n      invalid: formIsInvalid(),\n      'justify-content-center': centerBtn()\n    }\"\n    [disabled]=\"isDisabled()\"\n    (click)=\"click($event)\"\n    [matTooltip]=\"showHelpIcon() ? null : (help() | appTranslate | async)\">\n    @if (!loading()) {\n      @if (isLeftIcon()) {\n        @if (isDisabled()) {\n          <fa-icon [icon]=\"lockedIcon()\" />\n        } @else if (leftCustomIcon()) {\n          <i class=\"{{ leftCustomIcon() }}\"></i>\n        } @else {\n          <fa-icon [icon]=\"leftIcon()\" />\n        }\n      }\n    }\n\n    @if (computedText()) {\n      <span\n        class=\"\"\n        [ngClass]=\"{\n          'ms-1': leftIcon() || leftCustomIcon(),\n          'me-1': rightIcon() || rightCustomIcon()\n        }\">\n        {{ computedText() | appTranslate | async }}\n      </span>\n    } @else {\n      <span\n        class=\" \"\n        [ngClass]=\"{\n          'ms-1': innerText.innerText && (leftIcon() || leftCustomIcon()),\n          'me-1': innerText.innerText && (rightIcon() || rightCustomIcon())\n        }\"\n        #innerText\n        appTranslator>\n        <ng-content></ng-content>\n      </span>\n    }\n\n    @if (loading()) {\n      <span class=\"fa fa-spinner ms-{{ iconBtn() ? '' : '2' }} fa-spin\"></span>\n    } @else {\n      @if (isRightIcon()) {\n        @if (isDisabled()) {\n          <fa-icon [icon]=\"lockedIcon()\" />\n        } @else if (rightCustomIcon()) {\n          <i class=\"{{ rightCustomIcon() }}\"></i>\n        } @else {\n          <fa-icon [icon]=\"rightIcon()\" />\n        }\n      }\n    }\n  </button>\n</span>\n", styles: [".lite{padding:0}.disabled{cursor:not-allowed}.invalid{border:3px solid var(--bs-danger)}.mini button{height:auto!important;min-height:unset;padding:2px 5px}@keyframes animateDanger{0%{background-color:red;border-color:red;background-image:none;color:#fff}50%{background-color:red;border-color:red;background-image:none;color:#fff}}@keyframes animateWarning{0%{background-color:#ff8107;border-color:#ff8107;background-image:none;color:#000}50%{background-color:#ff8107;border-color:#ff8107;background-image:none;color:#000}}.isDanger{animation-name:animateDanger;animation-duration:1s;animation-iteration-count:infinite}.isWarning{animation-name:animateWarning;animation-duration:1s;animation-iteration-count:infinite}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i11.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "ngmodule", type: MatBadgeModule }, { kind: "directive", type: i2.MatBadge, selector: "[matBadge]", inputs: ["matBadgeColor", "matBadgeOverlap", "matBadgeDisabled", "matBadgePosition", "matBadge", "matBadgeDescription", "matBadgeSize", "matBadgeHidden"] }, { kind: "ngmodule", type: FontAwesomeModule }, { kind: "component", type: i2$1.FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "animation", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "classes", "transform", "a11yRole"] }, { kind: "pipe", type: JsonPipe, name: "json" }, { kind: "directive", type: TranslatorDirective, selector: "[appTranslator]", inputs: ["appTranslator"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: SDKTranslatePipe, name: "appTranslate" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.1", type: BtnComponent, isStandalone: true, selector: "app-btn", inputs: { formSchema: { classPropertyName: "formSchema", publicName: "formSchema", isSignal: true, isRequired: false, transformFunction: null }, debug: { classPropertyName: "debug", publicName: "debug", isSignal: true, isRequired: false, transformFunction: null }, centerBtn: { classPropertyName: "centerBtn", publicName: "centerBtn", isSignal: true, isRequired: false, transformFunction: null }, danger: { classPropertyName: "danger", publicName: "danger", isSignal: true, isRequired: false, transformFunction: null }, warning: { classPropertyName: "warning", publicName: "warning", isSignal: true, isRequired: false, transformFunction: null }, verbose: { classPropertyName: "verbose", publicName: "verbose", isSignal: true, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, _icon: { classPropertyName: "_icon", publicName: "icon", isSignal: false, isRequired: false, transformFunction: null }, _rightIcon: { classPropertyName: "_rightIcon", publicName: "rightIcon", isSignal: false, isRequired: false, transformFunction: null }, _leftIcon: { classPropertyName: "_leftIcon", publicName: "leftIcon", isSignal: false, isRequired: false, transformFunction: null }, _type: { classPropertyName: "_type", publicName: "type", isSignal: false, isRequired: false, transformFunction: null }, _group: { classPropertyName: "_group", publicName: "group", isSignal: false, isRequired: false, transformFunction: null }, actionType: { classPropertyName: "actionType", publicName: "actionType", isSignal: true, isRequired: false, transformFunction: null }, animate: { classPropertyName: "animate", publicName: "animate", isSignal: true, isRequired: false, transformFunction: null }, excludeLogging: { classPropertyName: "excludeLogging", publicName: "excludeLogging", isSignal: false, isRequired: false, transformFunction: booleanAttribute2 }, loggingValue: { classPropertyName: "loggingValue", publicName: "loggingValue", isSignal: false, isRequired: false, transformFunction: null }, badge: { classPropertyName: "badge", publicName: "badge", isSignal: true, isRequired: false, transformFunction: null }, class: { classPropertyName: "class", publicName: "class", isSignal: true, isRequired: false, transformFunction: null }, customIcon: { classPropertyName: "customIcon", publicName: "customIcon", isSignal: false, isRequired: false, transformFunction: null }, form: { classPropertyName: "form", publicName: "form", isSignal: true, isRequired: false, transformFunction: null }, forms: { classPropertyName: "forms", publicName: "forms", isSignal: true, isRequired: false, transformFunction: null }, help: { classPropertyName: "help", publicName: "help", isSignal: true, isRequired: false, transformFunction: null }, _iconBtn: { classPropertyName: "_iconBtn", publicName: "iconBtn", isSignal: false, isRequired: false, transformFunction: booleanAttribute2 }, mclass: { classPropertyName: "mclass", publicName: "mclass", isSignal: true, isRequired: false, transformFunction: null }, showHelpIcon: { classPropertyName: "showHelpIcon", publicName: "showHelpIcon", isSignal: true, isRequired: false, transformFunction: null }, _rightCustomIcon: { classPropertyName: "_rightCustomIcon", publicName: "rightCustomIcon", isSignal: false, isRequired: false, transformFunction: null }, leftCustomIcon: { classPropertyName: "leftCustomIcon", publicName: "leftCustomIcon", isSignal: true, isRequired: false, transformFunction: null }, text: { classPropertyName: "text", publicName: "text", isSignal: true, isRequired: false, transformFunction: null }, valid: { classPropertyName: "valid", publicName: "valid", isSignal: true, isRequired: false, transformFunction: null }, mini: { classPropertyName: "mini", publicName: "mini", isSignal: true, isRequired: false, transformFunction: null }, onFormInvalid: { classPropertyName: "onFormInvalid", publicName: "onFormInvalid", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { loading: "loadingChange", leftCustomIcon: "leftCustomIconChange", mclick: "mclick", disabled: "disabledChange" }, viewQueries: [{ propertyName: "innerText", first: true, predicate: ["innerText"], descendants: true }], ngImport: i0, template: "@if (verbose()) {\n <div class=\"\">\n  formState():{{formState()|json}}\n </div>\n <div class=\"\">\n  form():{{form()?.value|json}}\n </div>\n}\n<span\n  class=\"{{ class() }}  d-flex  align-items-center justify-content-center\"\n  [ngClass]=\"{ disabled: isDisabled(), mini: mini() }\"\n  (click)=\"btnS.checkForm(this)\">\n  @if (showHelpIcon() && help()) {\n    <i class=\"fa fa-info-circle me-2 text-primary\" [matTooltip]=\"help() | appTranslate | async\"></i>\n  }\n  <button\n    type=\"{{ actionType() }}\"\n    class=\"{{ mclass() }} {{ _mclass() || 'btn' }} d-flex align-items-center \"\n    [matBadge]=\"badge()\"\n    [ngClass]=\"{\n      changecolor: valid(),\n      'btn-raised': animate(),\n      disabled: isDisabled(),\n      isDanger: danger(),\n      isWarning: warning(),\n      invalid: formIsInvalid(),\n      'justify-content-center': centerBtn()\n    }\"\n    [disabled]=\"isDisabled()\"\n    (click)=\"click($event)\"\n    [matTooltip]=\"showHelpIcon() ? null : (help() | appTranslate | async)\">\n    @if (!loading()) {\n      @if (isLeftIcon()) {\n        @if (isDisabled()) {\n          <fa-icon [icon]=\"lockedIcon()\" />\n        } @else if (leftCustomIcon()) {\n          <i class=\"{{ leftCustomIcon() }}\"></i>\n        } @else {\n          <fa-icon [icon]=\"leftIcon()\" />\n        }\n      }\n    }\n\n    @if (computedText()) {\n      <span\n        class=\"\"\n        [ngClass]=\"{\n          'ms-1': leftIcon() || leftCustomIcon(),\n          'me-1': rightIcon() || rightCustomIcon()\n        }\">\n        {{ computedText() | appTranslate | async }}\n      </span>\n    } @else {\n      <span\n        class=\" \"\n        [ngClass]=\"{\n          'ms-1': innerText.innerText && (leftIcon() || leftCustomIcon()),\n          'me-1': innerText.innerText && (rightIcon() || rightCustomIcon())\n        }\"\n        #innerText\n        appTranslator>\n        <ng-content></ng-content>\n      </span>\n    }\n\n    @if (loading()) {\n      <span class=\"fa fa-spinner ms-{{ iconBtn() ? '' : '2' }} fa-spin\"></span>\n    } @else {\n      @if (isRightIcon()) {\n        @if (isDisabled()) {\n          <fa-icon [icon]=\"lockedIcon()\" />\n        } @else if (rightCustomIcon()) {\n          <i class=\"{{ rightCustomIcon() }}\"></i>\n        } @else {\n          <fa-icon [icon]=\"rightIcon()\" />\n        }\n      }\n    }\n  </button>\n</span>\n", styles: [".lite{padding:0}.disabled{cursor:not-allowed}.invalid{border:3px solid var(--bs-danger)}.mini button{height:auto!important;min-height:unset;padding:2px 5px}@keyframes animateDanger{0%{background-color:red;border-color:red;background-image:none;color:#fff}50%{background-color:red;border-color:red;background-image:none;color:#fff}}@keyframes animateWarning{0%{background-color:#ff8107;border-color:#ff8107;background-image:none;color:#000}50%{background-color:#ff8107;border-color:#ff8107;background-image:none;color:#000}}.isDanger{animation-name:animateDanger;animation-duration:1s;animation-iteration-count:infinite}.isWarning{animation-name:animateWarning;animation-duration:1s;animation-iteration-count:infinite}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i11.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "ngmodule", type: MatBadgeModule }, { kind: "directive", type: i2.MatBadge, selector: "[matBadge]", inputs: ["matBadgeColor", "matBadgeOverlap", "matBadgeDisabled", "matBadgePosition", "matBadge", "matBadgeDescription", "matBadgeSize", "matBadgeHidden"] }, { kind: "ngmodule", type: FontAwesomeModule }, { kind: "component", type: i2$1.FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "animation", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "classes", "transform", "a11yRole"] }, { kind: "pipe", type: JsonPipe, name: "json" }, { kind: "directive", type: TranslatorDirective, selector: "[appTranslator]", inputs: ["appTranslator"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: SDKTranslatePipe, name: "appTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.1", ngImport: i0, type: BtnComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'app-btn', standalone: true, imports: [
+            args: [{ selector: 'app-btn', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, imports: [
                         NgClass,
                         NgIf,
                         MatTooltipModule,
@@ -15082,8 +15082,8 @@ class TableHttpsComponent extends TableBaseComponent {
                 }).pipe(catchError((e) => of({ content: [], total: 0 })))
                 : of({ content: [], total: 0 });
         }), map((data) => {
-            this.resultsLength.set(data?.total || data?.totalElements);
-            return data?.content;
+            this.resultsLength.set(data?.total || data?.totalElements || data?.page?.totalElements);
+            return data?.page?.content || data?.content;
         }), tap((data) => {
             this.selection.clear();
             console.log(data);
@@ -15186,7 +15186,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.1", ngImpor
                         TableToStringPipe,
                         ToAnyPipe,
                         SDKTranslatePipe,
-                        FunctionCaller
+                        FunctionCaller,
                     ], template: "<div class=\"table-https\">\n  @if (header()) {\n    <h6 class=\"text-primary\">\n      {{ header() | appTranslate | async }}\n    </h6>\n  }\n\n  <!-- {{queryData()|json}} -->\n  <div class=\"\" [hidden]=\"!allowSearch()\">\n    <div class=\"row g-3 m-0 row-cols-md-auto justify-content-between align-items-center\">\n      <div class=\"ps-0\">\n        @if (startSectionTemplate()) {\n          <div class=\"{{ starterSectionClass() }}\">\n            <ng-container [ngTemplateOutlet]=\"startSectionTemplate()\" />\n          </div>\n        }\n      </div>\n      <div class=\"pe-0\">\n        <div class=\"row g-3 row-cols-lg-auto align-items-center justify-content-between\">\n          <div class=\"col-auto\">\n            @if (showExport()) {\n              <app-export-table\n                [disabled]=\"!data()?.length\"\n                [label]=\"label()\"\n                [searchQuery]=\"allQueryData() | toAny\"\n                [searchFunc]=\"observableFunc()\"\n                [displayedColumns]=\"computedDisplayedColumns()\"></app-export-table>\n            }\n          </div>\n          @if (showAdditionalColumns()) {\n            <div class=\"col-auto\">\n              <fields-to-display\n                [fields]=\"allTableColumns()\"\n                [currentColumns]=\"computedDisplayedColumns()\"\n                (fieldsChanged)=\"fieldsChanged($event)\" />\n            </div>\n          }\n          @if (showRefreshBtn()) {\n            <div class=\"col-auto\">\n              <app-btn icon=\"refresh\" [iconBtn]=\"true\" (mclick)=\"refresh()\" />\n            </div>\n          }\n        </div>\n      </div>\n    </div>\n    <div\n      class=\"mt-2 overflow-auto {{ tableContainerClass() }} table-container rounded-10\"\n      [ngClass]=\"{ border: distinct() }\">\n      <loader [loading]=\"isLoadingResults()\" [height]=\"container?.scrollHeight + 400\">\n        <div #container>\n          <div class=\"table-responsive\">\n            <table\n              mat-table\n              [dataSource]=\"filteredAndPagedResults()\"\n              class=\"w-100 d-table table\"\n              [multiTemplateDataRows]=\"isExpandable()\"\n              [ngClass]=\"{\n                smallerFonts: smallerFonts(),\n                nowrap: nowrap(),\n                centerCells: centerCells(),\n                curvy: curvy(),\n                'table-striped': striped()\n              }\"\n              matSort\n              matSortActive=\"{{ orderField() | toAny }}\"\n              matSortDisableClear\n              [matSortDirection]=\"orderDirection()\"\n              #table\n              (matSortChange)=\"resetPaging()\">\n              <!-- Checkbox Column -->\n              <ng-container\n                matColumnDef=\"mselect\"\n                [sticky]=\"!placeSelectionAtRight()\"\n                [stickyEnd]=\"placeSelectionAtRight()\">\n                <th mat-header-cell *matHeaderCellDef class=\"w-1\">\n                  <mat-checkbox\n                    (change)=\"$event ? masterToggle() : null\"\n                    [checked]=\"selection.hasValue() && isAllSelected()\"\n                    [indeterminate]=\"selection.hasValue() && !isAllSelected()\"\n                    [aria-label]=\"checkboxLabel()\"></mat-checkbox>\n                </th>\n                <td mat-cell *matCellDef=\"let row\" class=\"w-1\">\n                  <mat-checkbox\n                    (click)=\"$event.stopPropagation()\"\n                    (change)=\"$event ? selection.toggle(row) : null\"\n                    [checked]=\"selection.isSelected(row)\"\n                    [aria-label]=\"checkboxLabel(row)\"></mat-checkbox>\n                </td>\n              </ng-container>\n              <!-- COLUMNS -->\n              @for (col of computedDisplayedColumns(); track col; let i = $index) {\n                @switch (col.type) {\n                  <!-- CHECKBOX -->\n                  @case ('checkbox') {\n                    <ng-container matColumnDef=\"{{ col.f | toAny }}\">\n                      <th mat-header-cell *matHeaderCellDef class=\"w-1\">\n                        <app-info-icon [text]=\"col.hint\">\n                          {{ col.t | appTranslate | async }}\n                        </app-info-icon>\n                      </th>\n                      <td mat-cell *matCellDef=\"let row\" class=\"w-1\">\n                        <!-- Removing the empty space above checkboxes -->\n                        <app-input-ngmodel\n                          [showLabel]=\"false\"\n                          [stacked]=\"true\"\n                          type=\"checkbox\"\n                          [disabled]=\"col.disabled\"\n                          [checked]=\"col.checked\"\n                          [(model)]=\"row[col.f]\"\n                          (mchange)=\"outputCheckbox(col.f, row, $event)\"></app-input-ngmodel>\n                      </td>\n                    </ng-container>\n                  }\n                  <!--// -->\n                  <!-- Sub Table -->\n                  @case ('table') {\n                    <ng-container matColumnDef=\"{{ col.f | toAny }}\">\n                      <th mat-header-cell class=\"text-center\" *matHeaderCellDef>\n                        {{ col.t | appTranslate | async }}\n                      </th>\n                      <td mat-cell *matCellDef=\"let row\">\n                        <app-btn\n                          [icon]=\"col.icon\"\n                          type=\"dark\"\n                          (mclick)=\"col.action ? col.action(row, col.f) : null\"\n                          [help]=\"col.subTable | tableToString: row | async\"\n                          [showHelpIcon]=\"false\"\n                          [iconBtn]=\"true\"\n                          mclass=\"w-auto\" />\n                      </td>\n                    </ng-container>\n                  }\n                  <!--// -->\n                  <!-- COLOR -->\n                  @case ('color') {\n                    <ng-container matColumnDef=\"{{ col.f | toAny }}\">\n                      <th mat-header-cell *matHeaderCellDef>\n                        <app-info-icon [text]=\"col.hint\">\n                          {{ col.t | appTranslate | async }}\n                        </app-info-icon>\n                      </th>\n                      <td mat-cell *matCellDef=\"let row\">\n                        <div class=\"square-2\" [style]=\"'background-color:' + row[col.f]\"></div>\n                      </td>\n                    </ng-container>\n                  }\n                  <!--// -->\n                  <!-- Button -->\n                  @case ('button') {\n                    <ng-container [sticky]=\"col.sticky\" matColumnDef=\"{{ col.f | toAny }}\">\n                      <th mat-header-cell class=\"text-center\" *matHeaderCellDef>\n                        <app-info-icon [text]=\"col.hint\">\n                          {{ col.t | appTranslate | async }}\n                        </app-info-icon>\n                      </th>\n                      <td mat-cell *matCellDef=\"let row; let index = index\" class=\"btn-cell\">\n                        <app-btn\n                          [icon]=\"col.icon || col.btn?.icon\"\n                          [type]=\"col.btn?.type\"\n                          (mclick)=\"\n                            col.action\n                              ? col.action(row, col.f, getActionStatusCallback(col), index)\n                              : null\n                          \"\n                          [help]=\"col.btn?.help\"\n                          [showHelpIcon]=\"col.btn?.showHelpIcon\"\n                          [text]=\"col.btn?.label\"\n                          [mini]=\"col.btn?.mini\"\n                          [loading]=\"col.btn?.loading\"\n                          [iconBtn]=\"col.btn?.iconBtn\"\n                          mclass=\"w-auto\"\n                          [disabled]=\"col.btn?.disabled || col.btn?.loading\" />\n                      </td>\n                    </ng-container>\n                  }\n                  <!--// -->\n                  <!-- ACTION/BTNS COLUMNS -->\n                  @case ('btns') {\n                    <ng-container\n                      matColumnDef=\"{{ col.f | toAny }}\"\n                      [stickyEnd]=\"true\"\n                      [sticky]=\"true\">\n                      <th mat-header-cell *matHeaderCellDef class=\"btn-cell text-center\">\n                        <app-info-icon [text]=\"col.hint\">\n                          {{ col.t | appTranslate | async }}\n                        </app-info-icon>\n                      </th>\n                      <td mat-cell *matCellDef=\"let row; let i = index\" class=\"btn-cell\">\n                        <div class=\"d-flex col-md-auto col-sm-auto\">\n                          @for (button of col.buttons; track button) {\n                            <div class=\"mx-2\">\n                              <app-btn\n                                [icon]=\"button.icon\"\n                                [text]=\"button.label\"\n                                [help]=\"button.help\"\n                                [showHelpIcon]=\"button.showHelpIcon\"\n                                [type]=\"button.type\"\n                                [group]=\"button.group\"\n                                [mini]=\"button.mini\"\n                                [iconBtn]=\"!button.label\"\n                                mclass=\"w-auto\"\n                                (mclick)=\"button.action(row, i, btn)\"\n                                #btn />\n                            </div>\n                          }\n                        </div>\n                      </td>\n                    </ng-container>\n                  }\n                  <!-- EDITABLE -->\n                  @case ('editable') {\n                    <ng-container matColumnDef=\"{{ col.f | toAny }}\">\n                      <th mat-header-cell *matHeaderCellDef mat-sort-header>\n                        {{ col.t | appTranslate | async }}\n                      </th>\n                      <td mat-cell *matCellDef=\"let row\">\n                        <a\n                          class=\"cell\"\n                          [mqueryParams]=\"col.mqueryParams | functionCaller2: row : col.f\"\n                          [mrouterLink]=\"col.routeFormatter | functionCaller2: row : col.f\"\n                          [innerHTML]=\"row | getColFormatted: col | async | valueOrX: '-'\"></a>\n                        <i\n                          (click)=\"col.action ? col.action(row, col.f) : null\"\n                          class=\"ps-1 pointer fas fa-pencil-alt\"></i>\n                      </td>\n                    </ng-container>\n                  }\n                  <!-- DEFAULT -->\n                  @default {\n                    <ng-container matColumnDef=\"{{ col.f | toAny }}\" [sticky]=\"col.sticky\">\n                      <th mat-header-cell *matHeaderCellDef mat-sort-header disableClear>\n                        {{ col.t | appTranslate | async }}\n                      </th>\n                      <td mat-cell *matCellDef=\"let row\">\n                        @if (col.routeFormatter) {\n                          @if (extractRoute | functionCaller2: col : row; as cellRoute) {\n                            <a\n                              class=\"cell\"\n                              [ngClass]=\"{ pointer: col.action, link: col.action }\"\n                              (click)=\"col.action ? col.action(row, col.f) : null\"\n                              [queryParams]=\"cellRoute.queryParams\"\n                              routerLink=\"{{ cellRoute.route }}\"\n                              [innerHTML]=\"row | getColFormatted: col | async | valueOrX: '-'\"></a>\n                          }\n                        } @else {\n                          <span\n                            class=\"cell\"\n                            [ngClass]=\"{ pointer: col.action, link: col.action }\"\n                            (click)=\"col.action ? col.action(row, col.f) : null\"\n                            [innerHTML]=\"row | getColFormatted: col | async | valueOrX: '-'\"></span>\n                          @if (col.expandable) {\n                            <button\n                              matTooltip=\"Exapnd\"\n                              [matTooltipShowDelay]=\"1000\"\n                              mat-icon-button\n                              (click)=\"expandCell(row, col, expandModal)\"\n                              class=\"expandBtn\">\n                              <mat-icon [inline]=\"true\">open_in_full</mat-icon>\n                            </button>\n                          }\n                        }\n                      </td>\n                    </ng-container>\n                  }\n                  <!--// -->\n                }\n              }\n              <!--// -->\n              <!-- EXPANDABLE COLUMN-->\n              @if (isExpandable()) {\n                <ng-container matColumnDef=\"_expandCol\" stickyEnd>\n                  <th mat-header-cell *matHeaderCellDef aria-label=\"row actions\">&nbsp;</th>\n                  <td mat-cell *matCellDef=\"let row\">\n                    <!-- {{expandedElement()|json}} -->\n                    <div class=\"d-flex justify-content-end\">\n                      <app-btn\n                        [iconBtn]=\"true\"\n                        type=\"clear\"\n                        [customIcon]=\"\n                          expandedElement() !== row ? 'fa fa-chevron-down' : 'fa fa-chevron-up'\n                        \"\n                        aria-label=\"expand row\"\n                        loggingValue=\"Expand Row Button {{ row | json }}\"\n                        (mclick)=\"\n                          expandedElement.set(expandedElement() === row ? null : row);\n                          $event.stopPropagation()\n                        \" />\n                    </div>\n                  </td>\n                </ng-container>\n              }\n              <!--// -->\n              <!-- OPTIONS COLUMN -->\n              @if (hasRowOptions()) {\n                <ng-container matColumnDef=\"option\" stickyEnd>\n                  <th mat-header-cell *matHeaderCellDef mat-sort-header disableClear></th>\n                  <td mat-cell *matCellDef=\"let row\">\n                    @if (rowOptionsMap()) {\n                      @if (formOptionsMap() | functionCaller: row; as _rowoptions) {\n                        <button type=\"button\" [matMenuTriggerFor]=\"menu\" class=\"btn ms-2\">\n                          <i class=\"fa fa-ellipsis-v me-0\"></i>\n                        </button>\n                        <mat-menu #menu=\"matMenu\">\n                          @for (option of _rowoptions; track option) {\n                            <button\n                              mat-menu-item\n                              class=\"{{ option.itemClass }}\"\n                              (click)=\"option.action?.(row)\">\n                              @if (option.iconClass) {\n                                <i class=\"{{ option.iconClass }}\"></i>\n                              }\n                              {{ option.t | appTranslate | async }}\n                            </button>\n                          }\n                        </mat-menu>\n                      }\n                    } @else {\n                      <button type=\"button\" [matMenuTriggerFor]=\"menu\" class=\"btn ms-2\">\n                        <i class=\"fa fa-ellipsis-v me-0\"></i>\n                      </button>\n                      <mat-menu #menu=\"matMenu\">\n                        @for (option of rowOptions(); track option) {\n                          <button\n                            mat-menu-item\n                            class=\"{{ option.itemClass }}\"\n                            (click)=\"option.action?.(row)\">\n                            @if (option.iconClass) {\n                              <i class=\"{{ option.iconClass }}\"></i>\n                            }\n                            {{ option.t | appTranslate | async }}\n                          </button>\n                        }\n                      </mat-menu>\n                    }\n                  </td>\n                </ng-container>\n              }\n              <!--// -->\n\n              @if (rawColumns(); as dcols) {\n                <!-- Expanded Content Column - The detail row is made up of this one column that spans across all columns -->\n                @if (isExpandable()) {\n                  <ng-container matColumnDef=\"expandedDetail\">\n                    <td\n                      mat-cell\n                      *matCellDef=\"let row\"\n                      [attr.colspan]=\"dcols?.length || 1\"\n                      [ngClass]=\"{ hideBorder: row != expandedElement() }\">\n                      <div\n                        class=\"example-element-detail\"\n                        [@detailExpand]=\"row == expandedElement() ? 'expanded' : 'collapsed'\">\n                        <ng-container\n                          *ngTemplateOutlet=\"\n                            expandedRowTemplate();\n                            context: { $implicit: { row } }\n                          \" />\n                      </div>\n                    </td>\n                  </ng-container>\n                }\n                <tr mat-header-row *matHeaderRowDef=\"dcols\"></tr>\n                <tr\n                  mat-row\n                  *matRowDef=\"let row; columns: dcols\"\n                  [ngClass]=\"{\n                    pointer: showRowPointer(),\n                    disabled: isDisabledFunc() ? isDisabledFunc()(row) : false\n                  }\"\n                  [matTooltip]=\"isDisabledFunc() && isDisabledFunc()(row) ? 'Disabled' : null\"\n                  (click)=\"rowClick(row)\"></tr>\n                <tr class=\"mat-row\" *matNoDataRow>\n                  <td class=\"mat-cell no-item\" [attr.colspan]=\"dcols?.length || 1\">\n                    {{ noItemTxt() | appTranslate | async }}\n                  </td>\n                </tr>\n                @if (isExpandable()) {\n                  <tr\n                    mat-row\n                    *matRowDef=\"let row; columns: ['expandedDetail']\"\n                    class=\"expanded-detail-row\"\n                    [style.height.px]=\"0\"></tr>\n                }\n              }\n            </table>\n          </div>\n          <mat-paginator\n            [length]=\"resultsLength()\"\n            [pageSizeOptions]=\"computedPageSizeOptions()\"\n            [pageSize]=\"pageSize()\"\n            showFirstLastButtons />\n        </div>\n      </loader>\n    </div>\n  </div>\n  @if (!allowSearch()) {\n    <div class=\"not-allowed-search\">Please enter a search query</div>\n  }\n</div>\n<modal-comp\n  [width]=\"selectedCellForExpansion()?.column?.expandedWidth || '900px'\"\n  [header]=\"selectedCellForExpansion()?.column?.t\"\n  [showFooter]=\"false\"\n  (modalClose)=\"closeExpandedCell()\"\n  #expandModal>\n  <ng-template modalBody>\n    @if (selectedCellForExpansion(); as _selected) {\n      <div\n        class=\"\"\n        [innerHTML]=\"\n          _selected.row | getColFormattedE: _selected.column | async | valueOrX: '-'\n        \"></div>\n    }\n  </ng-template>\n</modal-comp>\n", styles: [":host ::ng-deep .table-plain td.cdk-column-expandedDetail.mat-column-expandedDetail,:host ::ng-deep .table-https td.cdk-column-expandedDetail.mat-column-expandedDetail{padding:0}:host ::ng-deep .table-plain td.cdk-column-expandedDetail.mat-column-expandedDetail.hideBorder,:host ::ng-deep .table-https td.cdk-column-expandedDetail.mat-column-expandedDetail.hideBorder{border-bottom:0}:host ::ng-deep .table-plain td.cdk-column-expandedDetail.mat-column-expandedDetail .example-element-detail,:host ::ng-deep .table-https td.cdk-column-expandedDetail.mat-column-expandedDetail .example-element-detail{overflow:hidden;display:flex}:host ::ng-deep .table-plain .mat-cell,:host ::ng-deep .table-https .mat-cell{padding:3px 5px!important}:host ::ng-deep .table-plain .colour,:host ::ng-deep .table-https .colour{height:15px;width:15px;display:inline-block;border-radius:5px}:host ::ng-deep .table-plain .centerCells .mat-sort-header-container,:host ::ng-deep .table-plain .centerCells .mat-mdc-sort-header-container,:host ::ng-deep .table-https .centerCells .mat-sort-header-container,:host ::ng-deep .table-https .centerCells .mat-mdc-sort-header-container{justify-content:center}:host ::ng-deep .table-plain .default.colour,:host ::ng-deep .table-https .default.colour{background-color:#545454}:host ::ng-deep .table-plain .btn-cell,:host ::ng-deep .table-https .btn-cell{width:1%}:host ::ng-deep .table-plain input[type=checkbox]:not(.form-control),:host ::ng-deep .table-https input[type=checkbox]:not(.form-control){border:1px solid rgba(80,78,245,.3019607843)}:host ::ng-deep .table-plain .mat-header-cell,:host ::ng-deep .table-plain .mat-mdc-header-cell,:host ::ng-deep .table-https .mat-header-cell,:host ::ng-deep .table-https .mat-mdc-header-cell{vertical-align:middle;color:var(--primary);font-style:normal;font-weight:600;font-size:14px;text-align:center}:host ::ng-deep .table-plain .mat-table-sticky-border-elem-left,:host ::ng-deep .table-plain .mat-mdc-table-sticky-border-elem-left,:host ::ng-deep .table-https .mat-table-sticky-border-elem-left,:host ::ng-deep .table-https .mat-mdc-table-sticky-border-elem-left{border-right:1px solid #e0e0e0;background-color:#fff}:host ::ng-deep .table-plain .mat-mdc-table-sticky,:host ::ng-deep .table-https .mat-mdc-table-sticky{background-color:#fff!important}:host ::ng-deep .table-plain .smallerFonts td,:host ::ng-deep .table-plain .smallerFonts th,:host ::ng-deep .table-https .smallerFonts td,:host ::ng-deep .table-https .smallerFonts th{font-size:.7rem}:host ::ng-deep .table-plain .nowrap td,:host ::ng-deep .table-plain .nowrap th,:host ::ng-deep .table-https .nowrap td,:host ::ng-deep .table-https .nowrap th{white-space:nowrap;text-align:left;padding:5px}:host ::ng-deep .table-plain table tr,:host ::ng-deep .table-https table tr{position:relative}:host ::ng-deep .table-plain table tr.mat-mdc-row,:host ::ng-deep .table-plain table tr.mat-mdc-header-row,:host ::ng-deep .table-plain table tr .mat-header-row,:host ::ng-deep .table-https table tr.mat-mdc-row,:host ::ng-deep .table-https table tr.mat-mdc-header-row,:host ::ng-deep .table-https table tr .mat-header-row{height:52px}:host ::ng-deep .table-plain table tr td:hover,:host ::ng-deep .table-https table tr td:hover{color:unset!important;text-decoration:unset;cursor:unset}:host ::ng-deep .table-plain table tr.disabled:after,:host ::ng-deep .table-https table tr.disabled:after{content:\" \";display:block;background-color:#c7c7c726;width:100%;height:100%;position:absolute;top:0;left:0;z-index:11111;cursor:not-allowed}:host ::ng-deep .table-plain .centerCells td,:host ::ng-deep .table-https .centerCells td{text-align:center}:host ::ng-deep .table-plain .curvy tr,:host ::ng-deep .table-https .curvy tr{border-radius:0 10px}:host ::ng-deep .table-plain .inline-block,:host ::ng-deep .table-https .inline-block{display:inline-block}:host ::ng-deep .table-plain td.no-item,:host ::ng-deep .table-https td.no-item{border-bottom:none!important;height:50px}\n"] }]
         }], propDecorators: { pageNumber: [{
                 type: Input
@@ -17742,7 +17742,7 @@ class FindItemComponent extends BaseFormGenerator {
         this.gridClass = input('col-md-4 col-xxl-3');
         this.hideForm = input(false);
         this.expandedRowTemplate = input();
-        this.isTablePaginated = input(false);
+        this.isTablePaginated = computed(() => !!this.searchObservableFunc());
         this.rowOptionsMap = input();
         this.isExpandable = input(false);
         this.label = input();
@@ -17778,8 +17778,10 @@ class FindItemComponent extends BaseFormGenerator {
         this.smallerFonts = input(false);
         /** Use checkboxes */
         this.useSelection = input(false);
-        this._rowClick = new EventEmitter();
-        this.clickedCreate = new EventEmitter();
+        this._rowClick = output({ alias: 'rowClick' });
+        this.clickedCreate = output();
+        this.tableHTTPSREF = viewChild((TableHttpsComponent));
+        this.tablePlainRef = viewChild((TablePlainComponent));
         this.tableHTTPSREFSignal = viewChild(TableHttpsComponent);
         this.tablePlainRefSignal = viewChild(TablePlainComponent);
         this.data = signal([]);
@@ -17823,6 +17825,8 @@ class FindItemComponent extends BaseFormGenerator {
                 return scheme;
             });
         }, { equal: isEqual });
+        this.hasColumns = computed(() => !!this.displayedColumns()?.length);
+        this.hideTable = computed(() => !this.showData() || (!this.data() && !this.isTablePaginated()));
         this.uaS = inject(UserActivityService);
         this.router = inject(Router);
         this.route = inject(ActivatedRoute);
@@ -17836,7 +17840,10 @@ class FindItemComponent extends BaseFormGenerator {
         this.trackByRowID = (index, item) => {
             return item?.value?.__rowID;
         };
-        this.selectionSignal = signal([]);
+        this.selectionSignal = computed(() => {
+            const th = this.tableHTTPSREFSignal()?.selectedItemsSignal(), tp = this.tablePlainRefSignal()?.selectedItemsSignal();
+            return th || tp;
+        });
         this.isAnySelected = computed(() => {
             const th = this.tableHTTPSREFSignal()?.isAnySelected(), tp = this.tablePlainRefSignal()?.isAnySelected();
             return th || tp;
@@ -17988,10 +17995,8 @@ class FindItemComponent extends BaseFormGenerator {
             if (!this.data())
                 this.loading.set(true);
             this.data.set([]);
-            setTimeout(() => {
-                this.tableHTTPSREF?.search(req);
-                this.loading.set(false);
-            }, 0);
+            this.tableHTTPSREF()?.search(req);
+            this.loading.set(false);
         }
         else if (this.searchFunction) {
             try {
@@ -18036,13 +18041,10 @@ class FindItemComponent extends BaseFormGenerator {
         this._rowClick.emit(e);
     }
     get selection() {
-        return this.tableHTTPSREF?.selectedItems || this.tablePlainRef?.selectedItems;
-    }
-    setSelection() {
-        this.selectionSignal.set(this.tableHTTPSREF?.selectedItemsSignal() || this.tablePlainRef?.selectedItemsSignal());
+        return this.tableHTTPSREF()?.selectedItems || this.tablePlainRef()?.selectedItems;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.1", ngImport: i0, type: FindItemComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.1", type: FindItemComponent, isStandalone: true, selector: "app-find-item,find-item", inputs: { autoFormatSchema: { classPropertyName: "autoFormatSchema", publicName: "autoFormatSchema", isSignal: true, isRequired: false, transformFunction: null }, autoOrder: { classPropertyName: "autoOrder", publicName: "autoOrder", isSignal: true, isRequired: false, transformFunction: null }, centerCells: { classPropertyName: "centerCells", publicName: "centerCells", isSignal: true, isRequired: false, transformFunction: null }, _displayedColumns: { classPropertyName: "_displayedColumns", publicName: "displayedColumns", isSignal: true, isRequired: false, transformFunction: null }, gridClass: { classPropertyName: "gridClass", publicName: "gridClass", isSignal: true, isRequired: false, transformFunction: null }, hideForm: { classPropertyName: "hideForm", publicName: "hideForm", isSignal: true, isRequired: false, transformFunction: null }, expandedRowTemplate: { classPropertyName: "expandedRowTemplate", publicName: "expandedRowTemplate", isSignal: true, isRequired: false, transformFunction: null }, isTablePaginated: { classPropertyName: "isTablePaginated", publicName: "isTablePaginated", isSignal: true, isRequired: false, transformFunction: null }, rowOptionsMap: { classPropertyName: "rowOptionsMap", publicName: "rowOptionsMap", isSignal: true, isRequired: false, transformFunction: null }, isExpandable: { classPropertyName: "isExpandable", publicName: "isExpandable", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, nowrap: { classPropertyName: "nowrap", publicName: "nowrap", isSignal: true, isRequired: false, transformFunction: null }, options: { classPropertyName: "options", publicName: "rowOptions", isSignal: true, isRequired: false, transformFunction: null }, orderDirection: { classPropertyName: "orderDirection", publicName: "orderDirection", isSignal: true, isRequired: false, transformFunction: null }, orderField: { classPropertyName: "orderField", publicName: "orderField", isSignal: true, isRequired: false, transformFunction: null }, pageSize: { classPropertyName: "pageSize", publicName: "pageSize", isSignal: true, isRequired: false, transformFunction: null }, searchFunction: { classPropertyName: "searchFunction", publicName: "searchFunction", isSignal: true, isRequired: false, transformFunction: null }, showData: { classPropertyName: "showData", publicName: "showData", isSignal: true, isRequired: false, transformFunction: null }, searchIfNoQuery: { classPropertyName: "searchIfNoQuery", publicName: "searchIfNoQuery", isSignal: true, isRequired: false, transformFunction: null }, showExport: { classPropertyName: "showExport", publicName: "showExport", isSignal: true, isRequired: false, transformFunction: null }, showFilter: { classPropertyName: "showFilter", publicName: "showFilter", isSignal: true, isRequired: false, transformFunction: null }, showRefreshBtn: { classPropertyName: "showRefreshBtn", publicName: "showRefreshBtn", isSignal: true, isRequired: false, transformFunction: null }, startSectionTemplate: { classPropertyName: "startSectionTemplate", publicName: "startSectionTemplate", isSignal: true, isRequired: false, transformFunction: null }, showSearchBtn: { classPropertyName: "showSearchBtn", publicName: "showSearchBtn", isSignal: true, isRequired: false, transformFunction: null }, showClearBtn: { classPropertyName: "showClearBtn", publicName: "showClearBtn", isSignal: true, isRequired: false, transformFunction: null }, showValidationMsg: { classPropertyName: "showValidationMsg", publicName: "showValidationMsg", isSignal: true, isRequired: false, transformFunction: null }, createBtnRoute: { classPropertyName: "createBtnRoute", publicName: "createBtnRoute", isSignal: true, isRequired: false, transformFunction: null }, showAdditionalColumns: { classPropertyName: "showAdditionalColumns", publicName: "showAdditionalColumns", isSignal: true, isRequired: false, transformFunction: null }, smallerFonts: { classPropertyName: "smallerFonts", publicName: "smallerFonts", isSignal: true, isRequired: false, transformFunction: null }, useSelection: { classPropertyName: "useSelection", publicName: "useSelection", isSignal: true, isRequired: false, transformFunction: null }, createButton: { classPropertyName: "createButton", publicName: "createButton", isSignal: true, isRequired: false, transformFunction: null }, _formSchema: { classPropertyName: "_formSchema", publicName: "formSchema", isSignal: false, isRequired: false, transformFunction: null }, searchObservableFunc: { classPropertyName: "searchObservableFunc", publicName: "searchObservableFunc", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { _rowClick: "rowClick", clickedCreate: "clickedCreate" }, viewQueries: [{ propertyName: "tableHTTPSREFSignal", first: true, predicate: TableHttpsComponent, descendants: true, isSignal: true }, { propertyName: "tablePlainRefSignal", first: true, predicate: TablePlainComponent, descendants: true, isSignal: true }, { propertyName: "tableHTTPSREF", first: true, predicate: TableHttpsComponent, descendants: true }, { propertyName: "tablePlainRef", first: true, predicate: TablePlainComponent, descendants: true }], usesInheritance: true, ngImport: i0, template: "<loader [loading]=\"loading()\">\n  @if (!hideForm() && searchForm()) {\n    <form [formGroup]=\"searchForm()\" (ngSubmit)=\"search()\">\n      <div class=\"row align-items-center\">\n        @for (scheme of computedFormSchema(); track scheme._id) {\n          <div class=\"{{ gridClass() }} \">\n            <div class=\"row align-items-end\">\n              @switch (true) {\n                @case (scheme.type == 'tel') {\n                  <div class=\"col\">\n                    <app-phone-number\n                      [form]=\"scheme.form\"\n                      [label]=\"scheme.label\"\n                      [name]=\"scheme.field\"\n                      [showLabel]=\"false\"\n                      [showValidation]=\"scheme.showValidation\"\n                      [showValidationIcon]=\"scheme.showValidationIcon\"\n                      [countryCode3]=\"scheme.countryCode3\"\n                      [disabled]=\"\n                        scheme.disabledIf\n                          | functionCaller2: searchFormValue() : (scheme.field | toAny)\n                      \"\n                      #inputTag />\n                    @if (showValidationMsg()) {\n                      <app-validation-message [input]=\"inputTag\" />\n                    }\n                  </div>\n                }\n                @case (scheme.type == 'autocomplete') {\n                  <div class=\"col\">\n                    <app-autocomplete\n                      [form]=\"scheme.form\"\n                      [label]=\"scheme.label\"\n                      [labelField]=\"scheme.labelField\"\n                      [autoPickValueField]=\"scheme.autoPickValueField\"\n                      [labelType]=\"scheme.labelType | toAny\"\n                      [optionsFunc]=\"scheme.optionsFunc\"\n                      [name]=\"scheme.field\"\n                      [optionFormatter]=\"scheme.optionFormatter\"\n                      [valueField]=\"scheme.valueField\"\n                      [options]=\"scheme.options\"\n                      [hint]=\"scheme.hint\"\n                      [disabled]=\"\n                        scheme.disabledIf\n                          | functionCaller2: searchFormValue : (scheme.field | toAny)\n                      \"\n                      #inputTag />\n                    @if (showValidationMsg()) {\n                      <app-validation-message [input]=\"inputTag\" />\n                    }\n                  </div>\n                }\n                @default {\n                  <div class=\"col\">\n                    <form>\n                      <div class=\"gx-2 row align-items-end\">\n                        <div class=\"col\">\n                          <app-input-basic\n                            #formField\n                            [name]=\"scheme.field\"\n                            [form]=\"scheme.form\"\n                            [type]=\"scheme.type\"\n                            [autoPickValueField]=\"scheme.autoPickValueField\"\n                            [valueField]=\"scheme.valueField\"\n                            [labelType]=\"scheme.labelType | toAny\"\n                            [checkedSignal]=\"scheme.checked\"\n                            [showValidation]=\"!!scheme.asyncValidators\"\n                            [showValidationIcon]=\"!!scheme.asyncValidators\"\n                            [noFormat]=\"true\"\n                            [labelField]=\"scheme.labelField\"\n                            [optionFormatter]=\"scheme.optionFormatter\"\n                            [options]=\"scheme.options\"\n                            [decimalPoints]=\"scheme.decimalPoints\"\n                            [hint]=\"scheme.hint\"\n                            [max]=\"scheme.max\"\n                            [min]=\"scheme.min\"\n                            [placeholder]=\"scheme.placeholder\"\n                            [label]=\"scheme.label\"\n                            [disabled]=\"\n                              scheme.disabledIf\n                                | functionCaller2: searchFormValue : (scheme.field | toAny)\n                            \" />\n                        </div>\n                        @if (scheme.standalone && scheme.action) {\n                          <div class=\"col-auto\">\n                            <app-btn\n                              group=\"show\"\n                              [disabled]=\"!formField?.validSignal()\"\n                              actionType=\"submit\"\n                              (mclick)=\"\n                                scheme.action(\n                                  allSearchFormValue(),\n                                  formField.valueSignal(),\n                                  standaloneForm()\n                                )\n                              \" />\n                          </div>\n                        }\n                        @if (scheme.action && !scheme.standalone) {\n                          <div class=\"col-auto\">\n                            <app-btn\n                              [icon]=\"scheme.icon\"\n                              [iconBtn]=\"true\"\n                              actionType=\"submit\"\n                              (mclick)=\"\n                                scheme.action(\n                                  allSearchFormValue(),\n                                  formField.valueSignal(),\n                                  searchForm()\n                                )\n                              \" />\n                          </div>\n                        }\n                      </div>\n                    </form>\n                  </div>\n                  @if (showValidationMsg()) {\n                    <app-validation-message [input]=\"formField\" />\n                  }\n                }\n              }\n            </div>\n          </div>\n        }\n        <div class=\"col-md justify-content-end d-flex\">\n          @if (showClearBtn()) {\n            <app-btn type=\"danger-outline\" text=\"Clear\" icon=\"delete\" (mclick)=\"clearFilters()\" />\n          }\n          <span class=\"mx-1\"></span>\n          @if (showSearchBtn()) {\n            <app-btn\n              [group]=\"'search'\"\n              [iconBtn]=\"true\"\n              text=\"Search\"\n              actionType=\"submit\"\n              [excludeLogging]=\"true\"\n              [disabled]=\"!searchFunction() && !isTablePaginated()\"\n              (mclick)=\"search()\" />\n          }\n          @if (createButton()) {\n            <span class=\"mx-1\"></span>\n            @if (createBtnRoute()) {\n              <app-btn\n                type=\"outline\"\n                text=\"Create\"\n                icon=\"add\"\n                (mclick)=\"clickedCreate.emit()\"\n                routerLink=\"{{ createBtnRoute() }}\" />\n            } @else {\n              <app-btn type=\"outline\" text=\"Create\" icon=\"add\" (mclick)=\"clickedCreate.emit()\" />\n            }\n          }\n        </div>\n      </div>\n    </form>\n  }\n\n  <ng-content select=\"[tablePanel]\"></ng-content>\n\n  @if (displayedColumns()?.length) {\n    <div class=\"mt-3\" [hidden]=\"!showData() || (!data() && !isTablePaginated())\">\n      <ng-container>\n        @if (isTablePaginated()) {\n          <table-https\n            #tableHTTPS\n            [searchIfNoQuery]=\"searchIfNoQuery()\"\n            [displayedColumns]=\"displayedColumns()\"\n            [observableFunc]=\"searchObservableFunc()\"\n            (rowClick)=\"rowClick($event)\"\n            (selectionChanged)=\"setSelection()\"\n            [centerCells]=\"centerCells()\"\n            [expandedRowTemplate]=\"expandedRowTemplate()\"\n            [isExpandable]=\"isExpandable()\"\n            [label]=\"label()\"\n            [nowrap]=\"nowrap()\"\n            [orderDirection]=\"orderDirection()\"\n            [orderField]=\"orderField()\"\n            [pageSize]=\"pageSize()\"\n            [rowOptions]=\"options()\"\n            [rowOptionsMap]=\"rowOptionsMap()\"\n            [showAdditionalColumns]=\"showAdditionalColumns()\"\n            [showExport]=\"showExport()\"\n            [showRefreshBtn]=\"showRefreshBtn()\"\n            [smallerFonts]=\"smallerFonts()\"\n            [startSectionTemplate]=\"startSectionTemplate()\"\n            [useSelection]=\"useSelection()\"\n            noItemTxt=\"No results found\" />\n        } @else {\n          <table-plain\n            [distinct]=\"true\"\n            [showPager]=\"true\"\n            [pageSize]=\"pageSize()\"\n            [centerCells]=\"false\"\n            [startSectionTemplate]=\"startSectionTemplate()\"\n            [smallerFonts]=\"smallerFonts()\"\n            [nowrap]=\"nowrap()\"\n            [showFilter]=\"showFilter()\"\n            [showExport]=\"showExport()\"\n            [isExpandable]=\"isExpandable()\"\n            [expandedRowTemplate]=\"expandedRowTemplate()\"\n            [label]=\"label()\"\n            noItemTxt=\"No results found\"\n            (rowClick)=\"rowClick($event)\"\n            [orderField]=\"orderField()\"\n            [rowOptions]=\"options()\"\n            [rowOptionsMap]=\"rowOptionsMap()\"\n            [showAdditionalColumns]=\"showAdditionalColumns()\"\n            [orderDirection]=\"orderDirection()\"\n            [displayedColumns]=\"displayedColumns()\"\n            (selectionChanged)=\"setSelection()\"\n            [data]=\"data()\" />\n        }\n      </ng-container>\n    </div>\n  }\n</loader>\n", styles: [""], dependencies: [{ kind: "component", type: LoaderComponent, selector: "loader", inputs: ["class", "text", "loading", "height", "width", "ratioHW"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i3$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i3$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i3$1.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "component", type: PhoneNumberComponent, selector: "app-phone-number", inputs: ["showLabel", "countryCode3", "config"], outputs: ["onCountrySelect"] }, { kind: "component", type: ValidationMessageComponent, selector: "app-validation-message", inputs: ["debug", "label", "hideOverflow", "minLength", "maxLength", "ignoreDirtiness", "customMessage", "control", "input"], outputs: ["labelChange"] }, { kind: "component", type: AutocompleteComponent, selector: "app-autocomplete,autocomplete", inputs: ["showRequiredTag", "validate", "options"] }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: InputBasicComponent, selector: "app-input-basic,app-input", inputs: ["accept", "autocomplete", "input", "contextData", "decimalPoints", "files", "hide", "hint", "clearOnDisable", "labelLink", "lblCl", "light", "loading", "multiple", "optionsFunc", "theme", "vms", "xsmall", "setCurrentDate", "options"], outputs: ["mSelectedOptionLabel"] }, { kind: "component", type: BtnComponent, selector: "app-btn", inputs: ["formSchema", "debug", "centerBtn", "danger", "warning", "verbose", "loading", "icon", "rightIcon", "leftIcon", "type", "group", "actionType", "animate", "excludeLogging", "loggingValue", "badge", "class", "customIcon", "form", "forms", "help", "iconBtn", "mclass", "showHelpIcon", "rightCustomIcon", "leftCustomIcon", "text", "valid", "mini", "onFormInvalid", "disabled"], outputs: ["loadingChange", "leftCustomIconChange", "mclick", "disabledChange"] }, { kind: "component", type: TableHttpsComponent, selector: "table-https", inputs: ["observableFunc", "pageNumber", "queryData", "searchIfNoQuery", "showRefreshBtn"], outputs: ["queryDataChange", "dataFetched"] }, { kind: "component", type: TablePlainComponent, selector: "table-plain", inputs: ["customSelectClass", "idField", "obsDataSource", "showFilter", "showPager", "disableSelectionByField", "data", "filterFields", "filterFieldsMap", "selectionPerPage"], outputs: ["view", "dataChanged", "filterChange", "listMutated"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i3$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "pipe", type: FunctionCaller2, name: "functionCaller2" }, { kind: "pipe", type: ToAnyPipe, name: "toAny" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.1", type: FindItemComponent, isStandalone: true, selector: "app-find-item,find-item", inputs: { autoFormatSchema: { classPropertyName: "autoFormatSchema", publicName: "autoFormatSchema", isSignal: true, isRequired: false, transformFunction: null }, autoOrder: { classPropertyName: "autoOrder", publicName: "autoOrder", isSignal: true, isRequired: false, transformFunction: null }, centerCells: { classPropertyName: "centerCells", publicName: "centerCells", isSignal: true, isRequired: false, transformFunction: null }, _displayedColumns: { classPropertyName: "_displayedColumns", publicName: "displayedColumns", isSignal: true, isRequired: false, transformFunction: null }, gridClass: { classPropertyName: "gridClass", publicName: "gridClass", isSignal: true, isRequired: false, transformFunction: null }, hideForm: { classPropertyName: "hideForm", publicName: "hideForm", isSignal: true, isRequired: false, transformFunction: null }, expandedRowTemplate: { classPropertyName: "expandedRowTemplate", publicName: "expandedRowTemplate", isSignal: true, isRequired: false, transformFunction: null }, rowOptionsMap: { classPropertyName: "rowOptionsMap", publicName: "rowOptionsMap", isSignal: true, isRequired: false, transformFunction: null }, isExpandable: { classPropertyName: "isExpandable", publicName: "isExpandable", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, nowrap: { classPropertyName: "nowrap", publicName: "nowrap", isSignal: true, isRequired: false, transformFunction: null }, options: { classPropertyName: "options", publicName: "rowOptions", isSignal: true, isRequired: false, transformFunction: null }, orderDirection: { classPropertyName: "orderDirection", publicName: "orderDirection", isSignal: true, isRequired: false, transformFunction: null }, orderField: { classPropertyName: "orderField", publicName: "orderField", isSignal: true, isRequired: false, transformFunction: null }, pageSize: { classPropertyName: "pageSize", publicName: "pageSize", isSignal: true, isRequired: false, transformFunction: null }, searchFunction: { classPropertyName: "searchFunction", publicName: "searchFunction", isSignal: true, isRequired: false, transformFunction: null }, showData: { classPropertyName: "showData", publicName: "showData", isSignal: true, isRequired: false, transformFunction: null }, searchIfNoQuery: { classPropertyName: "searchIfNoQuery", publicName: "searchIfNoQuery", isSignal: true, isRequired: false, transformFunction: null }, showExport: { classPropertyName: "showExport", publicName: "showExport", isSignal: true, isRequired: false, transformFunction: null }, showFilter: { classPropertyName: "showFilter", publicName: "showFilter", isSignal: true, isRequired: false, transformFunction: null }, showRefreshBtn: { classPropertyName: "showRefreshBtn", publicName: "showRefreshBtn", isSignal: true, isRequired: false, transformFunction: null }, startSectionTemplate: { classPropertyName: "startSectionTemplate", publicName: "startSectionTemplate", isSignal: true, isRequired: false, transformFunction: null }, showSearchBtn: { classPropertyName: "showSearchBtn", publicName: "showSearchBtn", isSignal: true, isRequired: false, transformFunction: null }, showClearBtn: { classPropertyName: "showClearBtn", publicName: "showClearBtn", isSignal: true, isRequired: false, transformFunction: null }, showValidationMsg: { classPropertyName: "showValidationMsg", publicName: "showValidationMsg", isSignal: true, isRequired: false, transformFunction: null }, createBtnRoute: { classPropertyName: "createBtnRoute", publicName: "createBtnRoute", isSignal: true, isRequired: false, transformFunction: null }, showAdditionalColumns: { classPropertyName: "showAdditionalColumns", publicName: "showAdditionalColumns", isSignal: true, isRequired: false, transformFunction: null }, smallerFonts: { classPropertyName: "smallerFonts", publicName: "smallerFonts", isSignal: true, isRequired: false, transformFunction: null }, useSelection: { classPropertyName: "useSelection", publicName: "useSelection", isSignal: true, isRequired: false, transformFunction: null }, createButton: { classPropertyName: "createButton", publicName: "createButton", isSignal: true, isRequired: false, transformFunction: null }, _formSchema: { classPropertyName: "_formSchema", publicName: "formSchema", isSignal: false, isRequired: false, transformFunction: null }, searchObservableFunc: { classPropertyName: "searchObservableFunc", publicName: "searchObservableFunc", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { _rowClick: "rowClick", clickedCreate: "clickedCreate" }, viewQueries: [{ propertyName: "tableHTTPSREF", first: true, predicate: (TableHttpsComponent), descendants: true, isSignal: true }, { propertyName: "tablePlainRef", first: true, predicate: (TablePlainComponent), descendants: true, isSignal: true }, { propertyName: "tableHTTPSREFSignal", first: true, predicate: TableHttpsComponent, descendants: true, isSignal: true }, { propertyName: "tablePlainRefSignal", first: true, predicate: TablePlainComponent, descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<loader [loading]=\"loading()\">\n  @if (!hideForm() && searchForm()) {\n    <form [formGroup]=\"searchForm()\" (ngSubmit)=\"search()\">\n      <div class=\"row align-items-center\">\n        @for (scheme of computedFormSchema(); track scheme._id) {\n          <div class=\"{{ gridClass() }} \">\n            <div class=\"row align-items-end\">\n              @switch (true) {\n                @case (scheme.type == 'tel') {\n                  <div class=\"col\">\n                    <app-phone-number\n                      [form]=\"scheme.form\"\n                      [label]=\"scheme.label\"\n                      [name]=\"scheme.field\"\n                      [showLabel]=\"false\"\n                      [showValidation]=\"scheme.showValidation\"\n                      [showValidationIcon]=\"scheme.showValidationIcon\"\n                      [countryCode3]=\"scheme.countryCode3\"\n                      [disabled]=\"\n                        scheme.disabledIf\n                          | functionCaller2: searchFormValue() : (scheme.field | toAny)\n                      \"\n                      #inputTag />\n                    @if (showValidationMsg()) {\n                      <app-validation-message [input]=\"inputTag\" />\n                    }\n                  </div>\n                }\n                @case (scheme.type == 'autocomplete') {\n                  <div class=\"col\">\n                    <app-autocomplete\n                      [form]=\"scheme.form\"\n                      [label]=\"scheme.label\"\n                      [labelField]=\"scheme.labelField\"\n                      [autoPickValueField]=\"scheme.autoPickValueField\"\n                      [labelType]=\"scheme.labelType | toAny\"\n                      [optionsFunc]=\"scheme.optionsFunc\"\n                      [name]=\"scheme.field\"\n                      [optionFormatter]=\"scheme.optionFormatter\"\n                      [valueField]=\"scheme.valueField\"\n                      [options]=\"scheme.options\"\n                      [hint]=\"scheme.hint\"\n                      [disabled]=\"\n                        scheme.disabledIf\n                          | functionCaller2: searchFormValue : (scheme.field | toAny)\n                      \"\n                      #inputTag />\n                    @if (showValidationMsg()) {\n                      <app-validation-message [input]=\"inputTag\" />\n                    }\n                  </div>\n                }\n                @default {\n                  <div class=\"col\">\n                    <form>\n                      <div class=\"gx-2 row align-items-end\">\n                        <div class=\"col\">\n                          <app-input-basic\n                            #formField\n                            [name]=\"scheme.field\"\n                            [form]=\"scheme.form\"\n                            [type]=\"scheme.type\"\n                            [autoPickValueField]=\"scheme.autoPickValueField\"\n                            [valueField]=\"scheme.valueField\"\n                            [labelType]=\"scheme.labelType | toAny\"\n                            [checkedSignal]=\"scheme.checked\"\n                            [showValidation]=\"!!scheme.asyncValidators\"\n                            [showValidationIcon]=\"!!scheme.asyncValidators\"\n                            [noFormat]=\"true\"\n                            [labelField]=\"scheme.labelField\"\n                            [optionFormatter]=\"scheme.optionFormatter\"\n                            [options]=\"scheme.options\"\n                            [decimalPoints]=\"scheme.decimalPoints\"\n                            [hint]=\"scheme.hint\"\n                            [max]=\"scheme.max\"\n                            [min]=\"scheme.min\"\n                            [placeholder]=\"scheme.placeholder\"\n                            [label]=\"scheme.label\"\n                            [disabled]=\"\n                              scheme.disabledIf\n                                | functionCaller2: searchFormValue : (scheme.field | toAny)\n                            \" />\n                        </div>\n                        @if (scheme.standalone && scheme.action) {\n                          <div class=\"col-auto\">\n                            <app-btn\n                              group=\"show\"\n                              [disabled]=\"!formField?.validSignal()\"\n                              actionType=\"submit\"\n                              (mclick)=\"\n                                scheme.action(\n                                  allSearchFormValue(),\n                                  formField.valueSignal(),\n                                  standaloneForm()\n                                )\n                              \" />\n                          </div>\n                        }\n                        @if (scheme.action && !scheme.standalone) {\n                          <div class=\"col-auto\">\n                            <app-btn\n                              [icon]=\"scheme.icon\"\n                              [iconBtn]=\"true\"\n                              actionType=\"submit\"\n                              (mclick)=\"\n                                scheme.action(\n                                  allSearchFormValue(),\n                                  formField.valueSignal(),\n                                  searchForm()\n                                )\n                              \" />\n                          </div>\n                        }\n                      </div>\n                    </form>\n                  </div>\n                  @if (showValidationMsg()) {\n                    <app-validation-message [input]=\"formField\" />\n                  }\n                }\n              }\n            </div>\n          </div>\n        }\n        <div class=\"col-md justify-content-end d-flex\">\n          @if (showClearBtn()) {\n            <app-btn type=\"danger-outline\" text=\"Clear\" icon=\"delete\" (mclick)=\"clearFilters()\" />\n          }\n          <span class=\"mx-1\"></span>\n          @if (showSearchBtn()) {\n            <app-btn\n              [group]=\"'search'\"\n              [iconBtn]=\"true\"\n              text=\"Search\"\n              actionType=\"submit\"\n              [excludeLogging]=\"true\"\n              [disabled]=\"!searchFunction() && !isTablePaginated()\"\n              (mclick)=\"search()\" />\n          }\n          @if (createButton()) {\n            <span class=\"mx-1\"></span>\n            @if (createBtnRoute()) {\n              <app-btn\n                type=\"outline\"\n                text=\"Create\"\n                icon=\"add\"\n                (mclick)=\"clickedCreate.emit()\"\n                routerLink=\"{{ createBtnRoute() }}\" />\n            } @else {\n              <app-btn type=\"outline\" text=\"Create\" icon=\"add\" (mclick)=\"clickedCreate.emit()\" />\n            }\n          }\n        </div>\n      </div>\n    </form>\n  }\n\n  <ng-content select=\"[tablePanel]\"></ng-content>\n\n  @if (hasColumns()) {\n    <div class=\"mt-3\" [hidden]=\"hideTable()\">\n      <ng-container>\n        @if (isTablePaginated()) {\n          <table-https\n            #tableHTTPS\n            [searchIfNoQuery]=\"searchIfNoQuery()\"\n            [displayedColumns]=\"displayedColumns()\"\n            [observableFunc]=\"searchObservableFunc()\"\n            (rowClick)=\"rowClick($event)\" \n            [centerCells]=\"centerCells()\"\n            [expandedRowTemplate]=\"expandedRowTemplate()\"\n            [isExpandable]=\"isExpandable()\"\n            [label]=\"label()\"\n            [nowrap]=\"nowrap()\"\n            [orderDirection]=\"orderDirection()\"\n            [orderField]=\"orderField()\"\n            [pageSize]=\"pageSize()\"\n            [rowOptions]=\"options()\"\n            [rowOptionsMap]=\"rowOptionsMap()\"\n            [showAdditionalColumns]=\"showAdditionalColumns()\"\n            [showExport]=\"showExport()\"\n            [showRefreshBtn]=\"showRefreshBtn()\"\n            [smallerFonts]=\"smallerFonts()\"\n            [startSectionTemplate]=\"startSectionTemplate()\"\n            [useSelection]=\"useSelection()\"\n            noItemTxt=\"No results found\" />\n        } @else {\n          <table-plain\n            [distinct]=\"true\"\n            [showPager]=\"true\"\n            [pageSize]=\"pageSize()\"\n            [centerCells]=\"false\"\n            [startSectionTemplate]=\"startSectionTemplate()\"\n            [smallerFonts]=\"smallerFonts()\"\n            [nowrap]=\"nowrap()\"\n            [showFilter]=\"showFilter()\"\n            [showExport]=\"showExport()\"\n            [isExpandable]=\"isExpandable()\"\n            [expandedRowTemplate]=\"expandedRowTemplate()\"\n            [label]=\"label()\"\n            noItemTxt=\"No results found\"\n            (rowClick)=\"rowClick($event)\"\n            [orderField]=\"orderField()\"\n            [rowOptions]=\"options()\"\n            [rowOptionsMap]=\"rowOptionsMap()\"\n            [showAdditionalColumns]=\"showAdditionalColumns()\"\n            [orderDirection]=\"orderDirection()\"\n            [displayedColumns]=\"displayedColumns()\" \n            [data]=\"data()\" />\n        }\n      </ng-container>\n    </div>\n  }\n</loader>\n", styles: [""], dependencies: [{ kind: "component", type: LoaderComponent, selector: "loader", inputs: ["class", "text", "loading", "height", "width", "ratioHW"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i3$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i3$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i3$1.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "component", type: PhoneNumberComponent, selector: "app-phone-number", inputs: ["showLabel", "countryCode3", "config"], outputs: ["onCountrySelect"] }, { kind: "component", type: ValidationMessageComponent, selector: "app-validation-message", inputs: ["debug", "label", "hideOverflow", "minLength", "maxLength", "ignoreDirtiness", "customMessage", "control", "input"], outputs: ["labelChange"] }, { kind: "component", type: AutocompleteComponent, selector: "app-autocomplete,autocomplete", inputs: ["showRequiredTag", "validate", "options"] }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: InputBasicComponent, selector: "app-input-basic,app-input", inputs: ["accept", "autocomplete", "input", "contextData", "decimalPoints", "files", "hide", "hint", "clearOnDisable", "labelLink", "lblCl", "light", "loading", "multiple", "optionsFunc", "theme", "vms", "xsmall", "setCurrentDate", "options"], outputs: ["mSelectedOptionLabel"] }, { kind: "component", type: BtnComponent, selector: "app-btn", inputs: ["formSchema", "debug", "centerBtn", "danger", "warning", "verbose", "loading", "icon", "rightIcon", "leftIcon", "type", "group", "actionType", "animate", "excludeLogging", "loggingValue", "badge", "class", "customIcon", "form", "forms", "help", "iconBtn", "mclass", "showHelpIcon", "rightCustomIcon", "leftCustomIcon", "text", "valid", "mini", "onFormInvalid", "disabled"], outputs: ["loadingChange", "leftCustomIconChange", "mclick", "disabledChange"] }, { kind: "component", type: TableHttpsComponent, selector: "table-https", inputs: ["observableFunc", "pageNumber", "queryData", "searchIfNoQuery", "showRefreshBtn"], outputs: ["queryDataChange", "dataFetched"] }, { kind: "component", type: TablePlainComponent, selector: "table-plain", inputs: ["customSelectClass", "idField", "obsDataSource", "showFilter", "showPager", "disableSelectionByField", "data", "filterFields", "filterFieldsMap", "selectionPerPage"], outputs: ["view", "dataChanged", "filterChange", "listMutated"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i3$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "pipe", type: FunctionCaller2, name: "functionCaller2" }, { kind: "pipe", type: ToAnyPipe, name: "toAny" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.1", ngImport: i0, type: FindItemComponent, decorators: [{
             type: Component,
@@ -18066,19 +18068,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.1", ngImpor
                         ReactiveFormsModule,
                         FunctionCaller2,
                         ToAnyPipe,
-                    ], template: "<loader [loading]=\"loading()\">\n  @if (!hideForm() && searchForm()) {\n    <form [formGroup]=\"searchForm()\" (ngSubmit)=\"search()\">\n      <div class=\"row align-items-center\">\n        @for (scheme of computedFormSchema(); track scheme._id) {\n          <div class=\"{{ gridClass() }} \">\n            <div class=\"row align-items-end\">\n              @switch (true) {\n                @case (scheme.type == 'tel') {\n                  <div class=\"col\">\n                    <app-phone-number\n                      [form]=\"scheme.form\"\n                      [label]=\"scheme.label\"\n                      [name]=\"scheme.field\"\n                      [showLabel]=\"false\"\n                      [showValidation]=\"scheme.showValidation\"\n                      [showValidationIcon]=\"scheme.showValidationIcon\"\n                      [countryCode3]=\"scheme.countryCode3\"\n                      [disabled]=\"\n                        scheme.disabledIf\n                          | functionCaller2: searchFormValue() : (scheme.field | toAny)\n                      \"\n                      #inputTag />\n                    @if (showValidationMsg()) {\n                      <app-validation-message [input]=\"inputTag\" />\n                    }\n                  </div>\n                }\n                @case (scheme.type == 'autocomplete') {\n                  <div class=\"col\">\n                    <app-autocomplete\n                      [form]=\"scheme.form\"\n                      [label]=\"scheme.label\"\n                      [labelField]=\"scheme.labelField\"\n                      [autoPickValueField]=\"scheme.autoPickValueField\"\n                      [labelType]=\"scheme.labelType | toAny\"\n                      [optionsFunc]=\"scheme.optionsFunc\"\n                      [name]=\"scheme.field\"\n                      [optionFormatter]=\"scheme.optionFormatter\"\n                      [valueField]=\"scheme.valueField\"\n                      [options]=\"scheme.options\"\n                      [hint]=\"scheme.hint\"\n                      [disabled]=\"\n                        scheme.disabledIf\n                          | functionCaller2: searchFormValue : (scheme.field | toAny)\n                      \"\n                      #inputTag />\n                    @if (showValidationMsg()) {\n                      <app-validation-message [input]=\"inputTag\" />\n                    }\n                  </div>\n                }\n                @default {\n                  <div class=\"col\">\n                    <form>\n                      <div class=\"gx-2 row align-items-end\">\n                        <div class=\"col\">\n                          <app-input-basic\n                            #formField\n                            [name]=\"scheme.field\"\n                            [form]=\"scheme.form\"\n                            [type]=\"scheme.type\"\n                            [autoPickValueField]=\"scheme.autoPickValueField\"\n                            [valueField]=\"scheme.valueField\"\n                            [labelType]=\"scheme.labelType | toAny\"\n                            [checkedSignal]=\"scheme.checked\"\n                            [showValidation]=\"!!scheme.asyncValidators\"\n                            [showValidationIcon]=\"!!scheme.asyncValidators\"\n                            [noFormat]=\"true\"\n                            [labelField]=\"scheme.labelField\"\n                            [optionFormatter]=\"scheme.optionFormatter\"\n                            [options]=\"scheme.options\"\n                            [decimalPoints]=\"scheme.decimalPoints\"\n                            [hint]=\"scheme.hint\"\n                            [max]=\"scheme.max\"\n                            [min]=\"scheme.min\"\n                            [placeholder]=\"scheme.placeholder\"\n                            [label]=\"scheme.label\"\n                            [disabled]=\"\n                              scheme.disabledIf\n                                | functionCaller2: searchFormValue : (scheme.field | toAny)\n                            \" />\n                        </div>\n                        @if (scheme.standalone && scheme.action) {\n                          <div class=\"col-auto\">\n                            <app-btn\n                              group=\"show\"\n                              [disabled]=\"!formField?.validSignal()\"\n                              actionType=\"submit\"\n                              (mclick)=\"\n                                scheme.action(\n                                  allSearchFormValue(),\n                                  formField.valueSignal(),\n                                  standaloneForm()\n                                )\n                              \" />\n                          </div>\n                        }\n                        @if (scheme.action && !scheme.standalone) {\n                          <div class=\"col-auto\">\n                            <app-btn\n                              [icon]=\"scheme.icon\"\n                              [iconBtn]=\"true\"\n                              actionType=\"submit\"\n                              (mclick)=\"\n                                scheme.action(\n                                  allSearchFormValue(),\n                                  formField.valueSignal(),\n                                  searchForm()\n                                )\n                              \" />\n                          </div>\n                        }\n                      </div>\n                    </form>\n                  </div>\n                  @if (showValidationMsg()) {\n                    <app-validation-message [input]=\"formField\" />\n                  }\n                }\n              }\n            </div>\n          </div>\n        }\n        <div class=\"col-md justify-content-end d-flex\">\n          @if (showClearBtn()) {\n            <app-btn type=\"danger-outline\" text=\"Clear\" icon=\"delete\" (mclick)=\"clearFilters()\" />\n          }\n          <span class=\"mx-1\"></span>\n          @if (showSearchBtn()) {\n            <app-btn\n              [group]=\"'search'\"\n              [iconBtn]=\"true\"\n              text=\"Search\"\n              actionType=\"submit\"\n              [excludeLogging]=\"true\"\n              [disabled]=\"!searchFunction() && !isTablePaginated()\"\n              (mclick)=\"search()\" />\n          }\n          @if (createButton()) {\n            <span class=\"mx-1\"></span>\n            @if (createBtnRoute()) {\n              <app-btn\n                type=\"outline\"\n                text=\"Create\"\n                icon=\"add\"\n                (mclick)=\"clickedCreate.emit()\"\n                routerLink=\"{{ createBtnRoute() }}\" />\n            } @else {\n              <app-btn type=\"outline\" text=\"Create\" icon=\"add\" (mclick)=\"clickedCreate.emit()\" />\n            }\n          }\n        </div>\n      </div>\n    </form>\n  }\n\n  <ng-content select=\"[tablePanel]\"></ng-content>\n\n  @if (displayedColumns()?.length) {\n    <div class=\"mt-3\" [hidden]=\"!showData() || (!data() && !isTablePaginated())\">\n      <ng-container>\n        @if (isTablePaginated()) {\n          <table-https\n            #tableHTTPS\n            [searchIfNoQuery]=\"searchIfNoQuery()\"\n            [displayedColumns]=\"displayedColumns()\"\n            [observableFunc]=\"searchObservableFunc()\"\n            (rowClick)=\"rowClick($event)\"\n            (selectionChanged)=\"setSelection()\"\n            [centerCells]=\"centerCells()\"\n            [expandedRowTemplate]=\"expandedRowTemplate()\"\n            [isExpandable]=\"isExpandable()\"\n            [label]=\"label()\"\n            [nowrap]=\"nowrap()\"\n            [orderDirection]=\"orderDirection()\"\n            [orderField]=\"orderField()\"\n            [pageSize]=\"pageSize()\"\n            [rowOptions]=\"options()\"\n            [rowOptionsMap]=\"rowOptionsMap()\"\n            [showAdditionalColumns]=\"showAdditionalColumns()\"\n            [showExport]=\"showExport()\"\n            [showRefreshBtn]=\"showRefreshBtn()\"\n            [smallerFonts]=\"smallerFonts()\"\n            [startSectionTemplate]=\"startSectionTemplate()\"\n            [useSelection]=\"useSelection()\"\n            noItemTxt=\"No results found\" />\n        } @else {\n          <table-plain\n            [distinct]=\"true\"\n            [showPager]=\"true\"\n            [pageSize]=\"pageSize()\"\n            [centerCells]=\"false\"\n            [startSectionTemplate]=\"startSectionTemplate()\"\n            [smallerFonts]=\"smallerFonts()\"\n            [nowrap]=\"nowrap()\"\n            [showFilter]=\"showFilter()\"\n            [showExport]=\"showExport()\"\n            [isExpandable]=\"isExpandable()\"\n            [expandedRowTemplate]=\"expandedRowTemplate()\"\n            [label]=\"label()\"\n            noItemTxt=\"No results found\"\n            (rowClick)=\"rowClick($event)\"\n            [orderField]=\"orderField()\"\n            [rowOptions]=\"options()\"\n            [rowOptionsMap]=\"rowOptionsMap()\"\n            [showAdditionalColumns]=\"showAdditionalColumns()\"\n            [orderDirection]=\"orderDirection()\"\n            [displayedColumns]=\"displayedColumns()\"\n            (selectionChanged)=\"setSelection()\"\n            [data]=\"data()\" />\n        }\n      </ng-container>\n    </div>\n  }\n</loader>\n" }]
-        }], propDecorators: { _rowClick: [{
-                type: Output,
-                args: ['rowClick']
-            }], clickedCreate: [{
-                type: Output
-            }], tableHTTPSREF: [{
-                type: ViewChild,
-                args: [TableHttpsComponent]
-            }], tablePlainRef: [{
-                type: ViewChild,
-                args: [TablePlainComponent]
-            }], _formSchema: [{
+                    ], template: "<loader [loading]=\"loading()\">\n  @if (!hideForm() && searchForm()) {\n    <form [formGroup]=\"searchForm()\" (ngSubmit)=\"search()\">\n      <div class=\"row align-items-center\">\n        @for (scheme of computedFormSchema(); track scheme._id) {\n          <div class=\"{{ gridClass() }} \">\n            <div class=\"row align-items-end\">\n              @switch (true) {\n                @case (scheme.type == 'tel') {\n                  <div class=\"col\">\n                    <app-phone-number\n                      [form]=\"scheme.form\"\n                      [label]=\"scheme.label\"\n                      [name]=\"scheme.field\"\n                      [showLabel]=\"false\"\n                      [showValidation]=\"scheme.showValidation\"\n                      [showValidationIcon]=\"scheme.showValidationIcon\"\n                      [countryCode3]=\"scheme.countryCode3\"\n                      [disabled]=\"\n                        scheme.disabledIf\n                          | functionCaller2: searchFormValue() : (scheme.field | toAny)\n                      \"\n                      #inputTag />\n                    @if (showValidationMsg()) {\n                      <app-validation-message [input]=\"inputTag\" />\n                    }\n                  </div>\n                }\n                @case (scheme.type == 'autocomplete') {\n                  <div class=\"col\">\n                    <app-autocomplete\n                      [form]=\"scheme.form\"\n                      [label]=\"scheme.label\"\n                      [labelField]=\"scheme.labelField\"\n                      [autoPickValueField]=\"scheme.autoPickValueField\"\n                      [labelType]=\"scheme.labelType | toAny\"\n                      [optionsFunc]=\"scheme.optionsFunc\"\n                      [name]=\"scheme.field\"\n                      [optionFormatter]=\"scheme.optionFormatter\"\n                      [valueField]=\"scheme.valueField\"\n                      [options]=\"scheme.options\"\n                      [hint]=\"scheme.hint\"\n                      [disabled]=\"\n                        scheme.disabledIf\n                          | functionCaller2: searchFormValue : (scheme.field | toAny)\n                      \"\n                      #inputTag />\n                    @if (showValidationMsg()) {\n                      <app-validation-message [input]=\"inputTag\" />\n                    }\n                  </div>\n                }\n                @default {\n                  <div class=\"col\">\n                    <form>\n                      <div class=\"gx-2 row align-items-end\">\n                        <div class=\"col\">\n                          <app-input-basic\n                            #formField\n                            [name]=\"scheme.field\"\n                            [form]=\"scheme.form\"\n                            [type]=\"scheme.type\"\n                            [autoPickValueField]=\"scheme.autoPickValueField\"\n                            [valueField]=\"scheme.valueField\"\n                            [labelType]=\"scheme.labelType | toAny\"\n                            [checkedSignal]=\"scheme.checked\"\n                            [showValidation]=\"!!scheme.asyncValidators\"\n                            [showValidationIcon]=\"!!scheme.asyncValidators\"\n                            [noFormat]=\"true\"\n                            [labelField]=\"scheme.labelField\"\n                            [optionFormatter]=\"scheme.optionFormatter\"\n                            [options]=\"scheme.options\"\n                            [decimalPoints]=\"scheme.decimalPoints\"\n                            [hint]=\"scheme.hint\"\n                            [max]=\"scheme.max\"\n                            [min]=\"scheme.min\"\n                            [placeholder]=\"scheme.placeholder\"\n                            [label]=\"scheme.label\"\n                            [disabled]=\"\n                              scheme.disabledIf\n                                | functionCaller2: searchFormValue : (scheme.field | toAny)\n                            \" />\n                        </div>\n                        @if (scheme.standalone && scheme.action) {\n                          <div class=\"col-auto\">\n                            <app-btn\n                              group=\"show\"\n                              [disabled]=\"!formField?.validSignal()\"\n                              actionType=\"submit\"\n                              (mclick)=\"\n                                scheme.action(\n                                  allSearchFormValue(),\n                                  formField.valueSignal(),\n                                  standaloneForm()\n                                )\n                              \" />\n                          </div>\n                        }\n                        @if (scheme.action && !scheme.standalone) {\n                          <div class=\"col-auto\">\n                            <app-btn\n                              [icon]=\"scheme.icon\"\n                              [iconBtn]=\"true\"\n                              actionType=\"submit\"\n                              (mclick)=\"\n                                scheme.action(\n                                  allSearchFormValue(),\n                                  formField.valueSignal(),\n                                  searchForm()\n                                )\n                              \" />\n                          </div>\n                        }\n                      </div>\n                    </form>\n                  </div>\n                  @if (showValidationMsg()) {\n                    <app-validation-message [input]=\"formField\" />\n                  }\n                }\n              }\n            </div>\n          </div>\n        }\n        <div class=\"col-md justify-content-end d-flex\">\n          @if (showClearBtn()) {\n            <app-btn type=\"danger-outline\" text=\"Clear\" icon=\"delete\" (mclick)=\"clearFilters()\" />\n          }\n          <span class=\"mx-1\"></span>\n          @if (showSearchBtn()) {\n            <app-btn\n              [group]=\"'search'\"\n              [iconBtn]=\"true\"\n              text=\"Search\"\n              actionType=\"submit\"\n              [excludeLogging]=\"true\"\n              [disabled]=\"!searchFunction() && !isTablePaginated()\"\n              (mclick)=\"search()\" />\n          }\n          @if (createButton()) {\n            <span class=\"mx-1\"></span>\n            @if (createBtnRoute()) {\n              <app-btn\n                type=\"outline\"\n                text=\"Create\"\n                icon=\"add\"\n                (mclick)=\"clickedCreate.emit()\"\n                routerLink=\"{{ createBtnRoute() }}\" />\n            } @else {\n              <app-btn type=\"outline\" text=\"Create\" icon=\"add\" (mclick)=\"clickedCreate.emit()\" />\n            }\n          }\n        </div>\n      </div>\n    </form>\n  }\n\n  <ng-content select=\"[tablePanel]\"></ng-content>\n\n  @if (hasColumns()) {\n    <div class=\"mt-3\" [hidden]=\"hideTable()\">\n      <ng-container>\n        @if (isTablePaginated()) {\n          <table-https\n            #tableHTTPS\n            [searchIfNoQuery]=\"searchIfNoQuery()\"\n            [displayedColumns]=\"displayedColumns()\"\n            [observableFunc]=\"searchObservableFunc()\"\n            (rowClick)=\"rowClick($event)\" \n            [centerCells]=\"centerCells()\"\n            [expandedRowTemplate]=\"expandedRowTemplate()\"\n            [isExpandable]=\"isExpandable()\"\n            [label]=\"label()\"\n            [nowrap]=\"nowrap()\"\n            [orderDirection]=\"orderDirection()\"\n            [orderField]=\"orderField()\"\n            [pageSize]=\"pageSize()\"\n            [rowOptions]=\"options()\"\n            [rowOptionsMap]=\"rowOptionsMap()\"\n            [showAdditionalColumns]=\"showAdditionalColumns()\"\n            [showExport]=\"showExport()\"\n            [showRefreshBtn]=\"showRefreshBtn()\"\n            [smallerFonts]=\"smallerFonts()\"\n            [startSectionTemplate]=\"startSectionTemplate()\"\n            [useSelection]=\"useSelection()\"\n            noItemTxt=\"No results found\" />\n        } @else {\n          <table-plain\n            [distinct]=\"true\"\n            [showPager]=\"true\"\n            [pageSize]=\"pageSize()\"\n            [centerCells]=\"false\"\n            [startSectionTemplate]=\"startSectionTemplate()\"\n            [smallerFonts]=\"smallerFonts()\"\n            [nowrap]=\"nowrap()\"\n            [showFilter]=\"showFilter()\"\n            [showExport]=\"showExport()\"\n            [isExpandable]=\"isExpandable()\"\n            [expandedRowTemplate]=\"expandedRowTemplate()\"\n            [label]=\"label()\"\n            noItemTxt=\"No results found\"\n            (rowClick)=\"rowClick($event)\"\n            [orderField]=\"orderField()\"\n            [rowOptions]=\"options()\"\n            [rowOptionsMap]=\"rowOptionsMap()\"\n            [showAdditionalColumns]=\"showAdditionalColumns()\"\n            [orderDirection]=\"orderDirection()\"\n            [displayedColumns]=\"displayedColumns()\" \n            [data]=\"data()\" />\n        }\n      </ng-container>\n    </div>\n  }\n</loader>\n" }]
+        }], propDecorators: { _formSchema: [{
                 type: Input,
                 args: ['formSchema']
             }] } });
@@ -18108,11 +18099,11 @@ class WatermarkComponent {
         this.imgPath = model(environment.images.watermark);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.1", ngImport: i0, type: WatermarkComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.0.1", type: WatermarkComponent, isStandalone: true, selector: "watermark", inputs: { imgPath: { classPropertyName: "imgPath", publicName: "imgPath", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { imgPath: "imgPathChange" }, ngImport: i0, template: "<div class=\"watermark\" [ngStyle]=\"{'background-image':'url('+imgPath()+')'}\">\n<!-- <img [src]=\"img\" alt=\"\"> -->\n</div>", styles: [".watermark{width:200px;height:200px;opacity:.4;position:fixed;bottom:10px;left:10px;z-index:-1;object-fit:contain;object-position:bottom;background-position:bottom;background-size:contain;background-repeat:no-repeat}\n"], dependencies: [{ kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.0.1", type: WatermarkComponent, isStandalone: true, selector: "watermark", inputs: { imgPath: { classPropertyName: "imgPath", publicName: "imgPath", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { imgPath: "imgPathChange" }, ngImport: i0, template: "<div class=\"watermark\" [ngStyle]=\"{'background-image':'url('+imgPath()+')'}\">\n<!-- <img [src]=\"img\" alt=\"\"> -->\n</div>", styles: [".watermark{width:200px;height:200px;opacity:.4;position:fixed;bottom:10px;left:10px;z-index:-1;object-fit:contain;object-position:bottom;background-position:bottom;background-size:contain;background-repeat:no-repeat}\n"], dependencies: [{ kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.1", ngImport: i0, type: WatermarkComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'watermark', standalone: true, imports: [NgStyle], template: "<div class=\"watermark\" [ngStyle]=\"{'background-image':'url('+imgPath()+')'}\">\n<!-- <img [src]=\"img\" alt=\"\"> -->\n</div>", styles: [".watermark{width:200px;height:200px;opacity:.4;position:fixed;bottom:10px;left:10px;z-index:-1;object-fit:contain;object-position:bottom;background-position:bottom;background-size:contain;background-repeat:no-repeat}\n"] }]
+            args: [{ selector: 'watermark', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, imports: [NgStyle], template: "<div class=\"watermark\" [ngStyle]=\"{'background-image':'url('+imgPath()+')'}\">\n<!-- <img [src]=\"img\" alt=\"\"> -->\n</div>", styles: [".watermark{width:200px;height:200px;opacity:.4;position:fixed;bottom:10px;left:10px;z-index:-1;object-fit:contain;object-position:bottom;background-position:bottom;background-size:contain;background-repeat:no-repeat}\n"] }]
         }], ctorParameters: () => [] });
 
 class ResetComponent {