ets-fe-ng-sdk 20.0.10 → 20.0.12

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

@@ -1,6 +1,6 @@
 import * as i2$2 from '@angular/forms';
 import { FormControl, Validators, FormGroup, FormArray, FormBuilder, NG_VALUE_ACCESSOR, FormsModule, ReactiveFormsModule, UntypedFormArray } from '@angular/forms';
-import { ReplaySubject, filter, debounceTime, lastValueFrom, Observable, BehaviorSubject, isObservable, merge, of, firstValueFrom, throwError, interval, map as map$1, startWith, switchMap, forkJoin, catchError as catchError$1, first, distinctUntilChanged, tap as tap$1, fromEvent, mergeMap, debounce, timer, Subject, distinct, concat } from 'rxjs';
+import { ReplaySubject, filter, debounceTime, lastValueFrom, Observable, BehaviorSubject, isObservable, of, merge, firstValueFrom, throwError, interval, map as map$1, startWith, switchMap, forkJoin, catchError as catchError$1, first, distinctUntilChanged, tap as tap$1, fromEvent, mergeMap, debounce, timer, Subject, distinct, concat } from 'rxjs';
 import 'zone.js/plugins/zone-error';
 import * as i0 from '@angular/core';
 import { signal, computed, Injectable, inject, APP_INITIALIZER, isDevMode, Pipe, NgModule, input, Directive, booleanAttribute, ChangeDetectorRef, model, output, effect, ViewChild, Input, Component, EventEmitter, Output, forwardRef, ChangeDetectionStrategy, HostListener, HostBinding, viewChild, linkedSignal, viewChildren, Inject, DestroyRef, contentChild, ElementRef, InjectionToken, ErrorHandler } from '@angular/core';
@@ -3464,6 +3464,18 @@ class UtilityService {
                 return Promise.resolve(val);
             }
         };
+        this.getCodeTitles = (obs, valueField) => obs.pipe(catchError((e) => {
+            console.warn(e);
+            return of(null);
+        }), map((r) => ({ list: r, map: r?.toMap(valueField) })));
+        this.rxResourceErrorWrapper = (obs) => obs.pipe(catchError((e) => {
+            console.warn(e);
+            return of(null);
+        }));
+        this.resourceErrorWrapper = (ps) => ps.catch((e) => {
+            console.warn(e);
+            return null;
+        });
         /**
          * Merges multiple observables into a single observable
          * @param arr - Array of observables to fetch
@@ -8434,9 +8446,8 @@ class InputFormatDirective {
     get shouldFormat() {
         return this.acceptedType.includes(this.oType);
     }
-    constructor(elementRef, formatterService, decimalPipe) {
+    constructor(elementRef, decimalPipe) {
         this.elementRef = elementRef;
-        this.formatterService = formatterService;
         this.decimalPipe = decimalPipe;
         /** List of input types that can be formatted */
         this.acceptedType = ['text', 'number', 'percentage'];
@@ -8521,7 +8532,7 @@ class InputFormatDirective {
         else if (this.oType == 'percentage')
             this.setPercentageInput(value);
         else if (this.oType == 'text' && !this.noTextFormat) {
-            this._value = this.formatterService.toTitleCase(value);
+            this._value = this.inputFormatService.toTitleCase(value);
             this.setTextInput(value);
         }
         else if (this.oType == 'checkbox') {
@@ -8545,7 +8556,7 @@ class InputFormatDirective {
             nValue = value;
         }
         else if (this.oType == 'text' && !this.noTextFormat) {
-            nValue = this.formatterService.toTitleCase(value);
+            nValue = this.inputFormatService.toTitleCase(value);
         }
         else if (this.oType == 'checkbox') {
             nValue = this.el?.checked;
@@ -8555,11 +8566,11 @@ class InputFormatDirective {
                 nValue = value;
             }
             else {
-                nValue = this.formatterService.normalise(value);
+                nValue = this.inputFormatService.normalise(value);
             }
         }
         else if (this.oType == 'percentage') {
-            nValue = this.formatterService.normalise(String(value)?.replace('%', ''));
+            nValue = this.inputFormatService.normalise(String(value)?.replace('%', ''));
         }
         else {
             nValue = value;
@@ -8582,7 +8593,7 @@ class InputFormatDirective {
                 this.setPercentageInput(this.value);
             }
             else if (this.oType == 'text' && !this.noTextFormat)
-                this.el.value = this.formatterService.toTitleCase(this.value);
+                this.el.value = this.inputFormatService.toTitleCase(this.value);
         }, 0);
     }
     /**
@@ -8617,7 +8628,7 @@ class InputFormatDirective {
             if (this.el.disabled)
                 this.setInput(value);
             else {
-                this._value = this.formatterService.toTitleCase(value);
+                this._value = this.inputFormatService.toTitleCase(value);
                 this.setTextInput(value);
             }
         }
@@ -8701,7 +8712,7 @@ class InputFormatDirective {
             this.elementRef.nativeElement.value = '';
             return;
         }
-        this.elementRef.nativeElement.value = this.formatterService.toTitleCase(value);
+        this.elementRef.nativeElement.value = this.inputFormatService.toTitleCase(value);
     }
     /**
      * Set a value on the input element without special formatting
@@ -8736,7 +8747,7 @@ class InputFormatDirective {
         if (this.isLastCharacterDecimalSeparator(value)) {
             return;
         }
-        this._value = this.formatterService.normalise(value);
+        this._value = this.inputFormatService.normalise(value);
         if (value) {
             this.elementRef.nativeElement.value = this.inputFormatService.normaliseForInput(this.value);
         }
@@ -8753,7 +8764,7 @@ class InputFormatDirective {
         if (this.isLastCharacterDecimalSeparator(value)) {
             return;
         }
-        this._value = this.formatterService.normalise(value.replace('%', ''));
+        this._value = this.inputFormatService.normalise(value.replace('%', ''));
         if (value) {
             this.elementRef.nativeElement.value = this.inputFormatService.normaliseForInput(this.value);
         }
@@ -8771,7 +8782,7 @@ class InputFormatDirective {
         // debugger
         // this._onBlur()
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.4", ngImport: i0, type: InputFormatDirective, deps: [{ token: i0.ElementRef }, { token: InputFormatService }, { token: i1$1.DecimalPipe }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.4", ngImport: i0, type: InputFormatDirective, deps: [{ token: i0.ElementRef }, { token: i1$1.DecimalPipe }], target: i0.ɵɵFactoryTarget.Directive }); }
     static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.1.4", type: InputFormatDirective, isStandalone: true, selector: "input:not([matInput]):not([noformat])", inputs: { value: "value" }, host: { listeners: { "input": "input($event.target.value)", "blur": "_onBlur()", "focus": "onFocus()" } }, providers: [
             {
                 provide: MAT_INPUT_VALUE_ACCESSOR,
@@ -8801,7 +8812,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.4", ngImpor
                     ],
                     standalone: true,
                 }]
-        }], ctorParameters: () => [{ type: i0.ElementRef }, { type: InputFormatService }, { type: i1$1.DecimalPipe }], propDecorators: { value: [{
+        }], ctorParameters: () => [{ type: i0.ElementRef }, { type: i1$1.DecimalPipe }], propDecorators: { value: [{
                 type: Input,
                 args: ['value']
             }], input: [{
@@ -24697,6 +24708,7 @@ class FindItemComponent extends BaseFormGenerator {
          * Whether to show the clear form button
          */
         this.showClearBtn = input(true, ...(ngDevMode ? [{ debugName: "showClearBtn" }] : []));
+        this.showFormError = input(true, ...(ngDevMode ? [{ debugName: "showFormError" }] : []));
         /**
          * Whether to show validation messages
          */
@@ -24727,6 +24739,7 @@ class FindItemComponent extends BaseFormGenerator {
         this.tableHTTPSREFSignal = viewChild(TableHttpsComponent, ...(ngDevMode ? [{ debugName: "tableHTTPSREFSignal" }] : []));
         /** Signal-based reference to the plain table component */
         this.tablePlainRefSignal = viewChild(TablePlainComponent, ...(ngDevMode ? [{ debugName: "tablePlainRefSignal" }] : []));
+        this.formErrorRef = viewChild(FormErrorComponent, ...(ngDevMode ? [{ debugName: "formErrorRef" }] : []));
         /** Data to display in the table */
         this.data = signal([], ...(ngDevMode ? [{ debugName: "data" }] : []));
         /** Internal loading state */
@@ -25097,7 +25110,7 @@ class FindItemComponent extends BaseFormGenerator {
         this._loading.set(false);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.4", ngImport: i0, type: FindItemComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.4", type: FindItemComponent, isStandalone: true, selector: "app-find-item,find-item", inputs: { autoFormatSchema: { classPropertyName: "autoFormatSchema", publicName: "autoFormatSchema", isSignal: true, isRequired: false, transformFunction: null }, id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null }, autoOrder: { classPropertyName: "autoOrder", publicName: "autoOrder", isSignal: true, isRequired: false, transformFunction: null }, searchButtonText: { classPropertyName: "searchButtonText", publicName: "searchButtonText", isSignal: true, isRequired: false, transformFunction: null }, searchButtonIcon: { classPropertyName: "searchButtonIcon", publicName: "searchButtonIcon", 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 }, customTableCellTemplates: { classPropertyName: "customTableCellTemplates", publicName: "customTableCellTemplates", 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 }, isCompact: { classPropertyName: "isCompact", publicName: "isCompact", 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 }, useStaticLoader: { classPropertyName: "useStaticLoader", publicName: "useStaticLoader", isSignal: true, isRequired: false, transformFunction: null }, striped: { classPropertyName: "striped", publicName: "striped", isSignal: true, isRequired: false, transformFunction: null }, searchPromptText: { classPropertyName: "searchPromptText", publicName: "searchPromptText", 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 }, initialQuery: { classPropertyName: "initialQuery", publicName: "initialQuery", 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: { initialQuery: "initialQueryChange", _rowClick: "rowClick", clickedExpandRow: "clickedExpandRow", clickedCreate: "clickedCreate" }, viewQueries: [{ propertyName: "actionBtns", predicate: ["actionBtn"], descendants: true, isSignal: true }, { 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()\" [useStaticLoader]=\"useStaticLoader()\">\n  @if (!hideForm() && searchForm()) {\n    <div class=\"row align-items-center\">\n      @for (scheme of computedFormSchema(); track scheme.field) {\n        <form class=\"{{ gridClass() }} \" (ngSubmit)=\"fieldAction(scheme)\">\n          <div class=\"form-cell\" [ngClass]=\"{ showValidationMsg: showValidationMsg() }\">\n            <ng-template #actionCell let-formField>\n              <span #actionBtn [id]=\"formField.name()\">\n                <app-btn\n                  [icon]=\"scheme.icon || 'show'\"\n                  [group]=\"scheme.standalone && scheme.action ? 'show' : null\"\n                  actionType=\"submit\"\n                  [disabled]=\"!formField?.validSignal()\" />\n              </span>\n            </ng-template>\n\n            @switch (scheme.type) {\n              @case ('template') {\n                <ng-container\n                  *ngTemplateOutlet=\"\n                    customTemplates()[scheme.field];\n                    context: { $implicit: { scheme, form: scheme.form } }\n                  \" />\n              }\n              @case ('tel') {\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                  [showValidationMsg]=\"showValidationMsg()\"\n                  [style.width]=\"\n                    'calc(100% - ' +\n                    (fieldWidthOffsets()[inputTag.nameStrSignal()]?.nativeElement.offsetWidth\n                      | widthOffsetPipe)+\n                    'px )'\n                  \"\n                  [disabled]=\"\n                    scheme.disabledIf | functionCaller2: searchFormValue() : (scheme.field | toAny)\n                  \"\n                  #inputTag />\n                @if (scheme.needsButton) {\n                  <ng-container *ngTemplateOutlet=\"actionCell; context: { $implicit: inputTag }\" />\n                }\n              }\n              @case ('autocomplete') {\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                  [showValidationMsg]=\"showValidationMsg()\"\n                  [hint]=\"scheme.hint\"\n                  [style.width]=\"\n                    'calc(100% - ' +\n                    (fieldWidthOffsets()[inputTag.nameStrSignal()]?.nativeElement.offsetWidth\n                      | widthOffsetPipe) +\n                    'px )'\n                  \"\n                  [disabled]=\"\n                    scheme.disabledIf | functionCaller2: searchFormValue : (scheme.field | toAny)\n                  \"\n                  #inputTag />\n                @if (scheme.needsButton) {\n                  <ng-container *ngTemplateOutlet=\"actionCell; context: { $implicit: inputTag }\" />\n                }\n              }\n              @default {\n                <app-input-basic\n                  #inputTag\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]=\"inputTag.hasValue() && !!scheme.asyncValidators\"\n                  [showValidationIcon]=\"inputTag.hasValue() && !!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                  [showValidationMsg]=\"showValidationMsg()\"\n                  [max]=\"scheme.max\"\n                  [min]=\"scheme.min\"\n                  [placeholder]=\"scheme.placeholder\"\n                  [label]=\"scheme.label\"\n                  [style.width]=\"\n                    'calc(100% - ' +\n                    (fieldWidthOffsets()[inputTag.nameStrSignal()]?.nativeElement.offsetWidth\n                    | widthOffsetPipe) +\n                    'px )'\n                  \"\n                  [disabled]=\"\n                    scheme.disabledIf | functionCaller2: searchFormValue : (scheme.field | toAny)\n                  \" />\n                @if (scheme.needsButton) {\n                  <ng-container *ngTemplateOutlet=\"actionCell; context: { $implicit: inputTag }\" />\n                }\n              }\n            }\n          </div>\n        </form>\n      }\n      <div class=\"col-md justify-content-end gap-1 align-items-center d-flex\">\n        <form-error #feTag [customResult]=\"true\" [inline]=\"true\" [form]=\"searchForm()\" />\n        @if (showClearBtn()) {\n          <app-btn type=\"danger-outline\" text=\"Clear\" icon=\"delete\" (mclick)=\"clearFilters()\" />\n        }\n        @if (showSearchBtn()) {\n          <app-btn\n            [group]=\"'search'\"\n            [iconBtn]=\"true\"\n            [text]=\"searchButtonText()\"\n            [icon]=\"searchButtonIcon()\"\n            actionType=\"submit\"\n            [form]=\"searchForm()\"\n            (mclick)=\"search()\"\n            [excludeLogging]=\"true\"\n            [disabled]=\"!searchFunction() && !isTablePaginated()\" />\n        }\n        @if (isCompact()) {\n          <app-btn\n            [showHelpIcon]=\"false\"\n            [excludeLogging]=\"true\"\n            help=\"Search Fields\"\n            customIcon=\"fa fa-ellipsis-v\"\n            (mclick)=\"extraFieldsModal.open(); tempSelectedCompactedFields.set([])\" />\n          <modal-comp #extraFieldsModal header=\"Additional Search Fields\" width=\"800px\">\n            <ng-template modalBody>\n              <toggle-input-form\n                [valueField]=\"'field' | toAny\"\n                labelField=\"label\"\n                [gridNo]=\"3\"\n                [checkedChecker]=\"asfCheckedChecker()\"\n                [list]=\"compactedFields()\"\n                (selected)=\"tempSelectedCompactedFields.set($event)\" />\n            </ng-template>\n            <ng-template modalFooter>\n              <app-btn\n                icon=\"save\"\n                (mclick)=\"extraFieldsModal.close(); selectedCompactedFields()\"\n                text=\"Save\" />\n            </ng-template>\n          </modal-comp>\n        }\n        @if (createButton()) {\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    <ng-container *ngTemplateOutlet=\"feTag.resultTemplateRef()\"></ng-container>\n  }\n\n  <ng-content select=\"[tablePanel]\"></ng-content>\n  <!-- {{searchForm()?.getRawValue()|json}}\n  <hr>\n  {{standaloneForm()?.getRawValue()|json}} -->\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            [customTemplates]=\"customTableCellTemplates()\"\n            [label]=\"label()\"\n            [striped]=\"striped()\"\n            [nowrap]=\"nowrap()\"\n            [orderDirection]=\"orderDirection()\"\n            [orderField]=\"orderField()\"\n            [pageSize]=\"pageSize()\"\n            [rowOptions]=\"options()\"\n            [debug]=\"debug()\"\n            [searchPromptText]=\"searchPromptText()\"\n            [rowOptionsMap]=\"rowOptionsMap()\"\n            [(queryData)]=\"initialQuery\"\n            [showAdditionalColumns]=\"showAdditionalColumns()\"\n            [showExport]=\"showExport()\"\n            [showRefreshBtn]=\"showRefreshBtn()\"\n            [smallerFonts]=\"smallerFonts()\"\n            [startSectionTemplate]=\"startSectionTemplate()\"\n            [useSelection]=\"useSelection()\"\n            (clickedExpandRow)=\"clickedExpandRow.emit($event)\"\n            noItemTxt=\"No results found\" />\n        } @else {\n          @if (searchIfNoQuery() || data()?.length || searched()) {\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              [customTemplates]=\"customTableCellTemplates()\"\n              [expandedRowTemplate]=\"expandedRowTemplate()\"\n              [label]=\"label()\"\n              [striped]=\"striped()\"\n              noItemTxt=\"No results found\"\n              (rowClick)=\"rowClick($event)\"\n              [orderField]=\"orderField()\"\n              [rowOptions]=\"options()\"\n              [debug]=\"debug()\"\n              [rowOptionsMap]=\"rowOptionsMap()\"\n              [showAdditionalColumns]=\"showAdditionalColumns()\"\n              [orderDirection]=\"orderDirection()\"\n              [displayedColumns]=\"displayedColumns()\"\n              (clickedExpandRow)=\"clickedExpandRow.emit($event)\"\n              [data]=\"data()\" />\n          } @else {\n            <div class=\"text-center p-3\">\n              {{ 'Please type a search query' | appTranslate | async }}\n            </div>\n          }\n        }\n      </ng-container>\n    </div>\n  }\n</loader>\n", styles: [":host .form-cell{display:flex;align-items:end;gap:8px}:host .form-cell.showValidationMsg{align-items:center}:host .form-cell>*:first-child{width:100%}\n"], dependencies: [{ kind: "component", type: LoaderComponent, selector: "loader", inputs: ["class", "text", "loading", "height", "width", "useStaticLoader", "ratioHW"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i2$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2$2.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: AutocompleteComponent, selector: "app-autocomplete,autocomplete", inputs: ["showRequiredTag", "validate", "skipDoesOptionExistCheck", "options"], outputs: ["skipDoesOptionExistCheckChange"] }, { kind: "ngmodule", type: MatMenuModule }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { 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", "clearOnDisable", "labelLink", "loading", "multiple", "optionsFunc", "vms", "setCurrentDate", "options"], outputs: ["loadingChange", "mSelectedOptionLabel"] }, { kind: "component", type: ModalComponent, selector: "modal-comp", inputs: ["header", "bodyTemplateRef", "footerTemplateRef", "showHeader", "loading", "isFullscreen", "showFooter", "width", "minWidth", "height", "maxHeight", "icon", "data", "disableClose", "hasBackdrop", "baseConfig"], outputs: ["headerChange", "showHeaderChange", "mouseLeft", "loadingChange", "showFooterChange", "modalOpen", "modalClose"] }, { kind: "directive", type: ModalBodyDirective, selector: "[modalBody]" }, { kind: "directive", type: ModalFooterDirective, selector: "[modalFooter]" }, { kind: "component", type: BtnComponent, selector: "app-btn", inputs: ["formSchema", "debug", "centerBtn", "danger", "warning", "verbose", "translatorOptions", "loading", "icon", "rightIcon", "leftIcon", "type", "group", "actionType", "animate", "excludeLogging", "loggingValue", "badge", "class", "customIcon", "form", "forms", "help", "helpShowDelay", "iconBtn", "mclass", "showHelpIcon", "rightCustomIcon", "leftCustomIcon", "text", "valid", "mini", "onFormInvalid", "disabled"], outputs: ["loadingChange", "leftCustomIconChange", "mclick", "disabledChange"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: ToggleInputFormComponent, selector: "toggle-input-form", inputs: ["addToFormFunc", "defaultToggleAll", "readOnly", "hideSearchMenu", "hideGridMenu", "hideToggle", "deleteFromFormFunc", "gridNo", "labelField", "labelSeparator", "searchQuery", "showToggleAll", "valueField", "checkedChecker", "list"], outputs: ["gridNoChange", "searchQueryChange", "selected"] }, { kind: "component", type: TableHttpsComponent, selector: "table-https", inputs: ["observableFunc", "pageNumber", "queryData", "searchIfNoQuery", "showRefreshBtn", "useStaticLoader", "searchPromptText"], outputs: ["queryDataChange", "dataFetched"] }, { kind: "component", type: TablePlainComponent, selector: "table-plain", inputs: ["customSelectClass", "idField", "obsDataSource", "showFilter", "showPager", "disableSelectionByField", "filterExactMatch", "data", "filterFields", "filterFieldsMap", "selectionPerPage"], outputs: ["view", "dataChanged", "filterChange", "listMutated"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "component", type: FormErrorComponent, selector: "form-error", inputs: ["form", "customResult", "inline", "lgGridNo", "xxlGridNo"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: TranslatePipe, name: "appTranslate" }, { kind: "pipe", type: FunctionCaller2, name: "functionCaller2" }, { kind: "pipe", type: ToAnyPipe, name: "toAny" }, { kind: "pipe", type: widthOffsetPipe, name: "widthOffsetPipe" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.4", type: FindItemComponent, isStandalone: true, selector: "app-find-item,find-item", inputs: { autoFormatSchema: { classPropertyName: "autoFormatSchema", publicName: "autoFormatSchema", isSignal: true, isRequired: false, transformFunction: null }, id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null }, autoOrder: { classPropertyName: "autoOrder", publicName: "autoOrder", isSignal: true, isRequired: false, transformFunction: null }, searchButtonText: { classPropertyName: "searchButtonText", publicName: "searchButtonText", isSignal: true, isRequired: false, transformFunction: null }, searchButtonIcon: { classPropertyName: "searchButtonIcon", publicName: "searchButtonIcon", 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 }, customTableCellTemplates: { classPropertyName: "customTableCellTemplates", publicName: "customTableCellTemplates", 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 }, isCompact: { classPropertyName: "isCompact", publicName: "isCompact", 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 }, useStaticLoader: { classPropertyName: "useStaticLoader", publicName: "useStaticLoader", isSignal: true, isRequired: false, transformFunction: null }, striped: { classPropertyName: "striped", publicName: "striped", isSignal: true, isRequired: false, transformFunction: null }, searchPromptText: { classPropertyName: "searchPromptText", publicName: "searchPromptText", 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 }, showFormError: { classPropertyName: "showFormError", publicName: "showFormError", 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 }, initialQuery: { classPropertyName: "initialQuery", publicName: "initialQuery", 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: { initialQuery: "initialQueryChange", _rowClick: "rowClick", clickedExpandRow: "clickedExpandRow", clickedCreate: "clickedCreate" }, viewQueries: [{ propertyName: "actionBtns", predicate: ["actionBtn"], descendants: true, isSignal: true }, { 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 }, { propertyName: "formErrorRef", first: true, predicate: FormErrorComponent, descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<loader [loading]=\"_loading()\" [useStaticLoader]=\"useStaticLoader()\">\n  @if (!hideForm() && searchForm()) {\n    <div class=\"row align-items-center\">\n      @for (scheme of computedFormSchema(); track scheme.field) {\n        <form class=\"{{ gridClass() }} \" (ngSubmit)=\"fieldAction(scheme)\">\n          <div class=\"form-cell\" [ngClass]=\"{ showValidationMsg: showValidationMsg() }\">\n            <ng-template #actionCell let-formField>\n              <span #actionBtn [id]=\"formField.name()\">\n                <app-btn\n                  [icon]=\"scheme.icon || 'show'\"\n                  [group]=\"scheme.standalone && scheme.action ? 'show' : null\"\n                  actionType=\"submit\"\n                  [disabled]=\"!formField?.validSignal()\" />\n              </span>\n            </ng-template>\n\n            @switch (scheme.type) {\n              @case ('template') {\n                <ng-container\n                  *ngTemplateOutlet=\"\n                    customTemplates()[scheme.field];\n                    context: { $implicit: { scheme, form: scheme.form } }\n                  \" />\n              }\n              @case ('tel') {\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                  [showValidationMsg]=\"showValidationMsg()\"\n                  [style.width]=\"\n                    'calc(100% - ' +\n                    (fieldWidthOffsets()[inputTag.nameStrSignal()]?.nativeElement.offsetWidth\n                      | widthOffsetPipe) +\n                    'px )'\n                  \"\n                  [disabled]=\"\n                    scheme.disabledIf | functionCaller2: searchFormValue() : (scheme.field | toAny)\n                  \"\n                  #inputTag />\n                @if (scheme.needsButton) {\n                  <ng-container *ngTemplateOutlet=\"actionCell; context: { $implicit: inputTag }\" />\n                }\n              }\n              @case ('autocomplete') {\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                  [showValidationMsg]=\"showValidationMsg()\"\n                  [hint]=\"scheme.hint\"\n                  [style.width]=\"\n                    'calc(100% - ' +\n                    (fieldWidthOffsets()[inputTag.nameStrSignal()]?.nativeElement.offsetWidth\n                      | widthOffsetPipe) +\n                    'px )'\n                  \"\n                  [disabled]=\"\n                    scheme.disabledIf | functionCaller2: searchFormValue : (scheme.field | toAny)\n                  \"\n                  #inputTag />\n                @if (scheme.needsButton) {\n                  <ng-container *ngTemplateOutlet=\"actionCell; context: { $implicit: inputTag }\" />\n                }\n              }\n              @default {\n                <app-input-basic\n                  #inputTag\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]=\"inputTag.hasValue() && !!scheme.asyncValidators\"\n                  [showValidationIcon]=\"inputTag.hasValue() && !!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                  [showValidationMsg]=\"showValidationMsg()\"\n                  [max]=\"scheme.max\"\n                  [min]=\"scheme.min\"\n                  [placeholder]=\"scheme.placeholder\"\n                  [label]=\"scheme.label\"\n                  [style.width]=\"\n                    'calc(100% - ' +\n                    (fieldWidthOffsets()[inputTag.nameStrSignal()]?.nativeElement.offsetWidth\n                      | widthOffsetPipe) +\n                    'px )'\n                  \"\n                  [disabled]=\"\n                    scheme.disabledIf | functionCaller2: searchFormValue : (scheme.field | toAny)\n                  \" />\n                @if (scheme.needsButton) {\n                  <ng-container *ngTemplateOutlet=\"actionCell; context: { $implicit: inputTag }\" />\n                }\n              }\n            }\n          </div>\n        </form>\n      }\n      <div class=\"col-md justify-content-end gap-1 align-items-center d-flex\">\n        @if (showFormError()) {\n          <form-error #feTag [customResult]=\"true\" [inline]=\"true\" [form]=\"searchForm()\" />\n        }\n        @if (showClearBtn()) {\n          <app-btn type=\"danger-outline\" text=\"Clear\" icon=\"delete\" (mclick)=\"clearFilters()\" />\n        }\n        @if (showSearchBtn()) {\n          <app-btn\n            [group]=\"'search'\"\n            [iconBtn]=\"true\"\n            [text]=\"searchButtonText()\"\n            [icon]=\"searchButtonIcon()\"\n            actionType=\"submit\"\n            [form]=\"searchForm()\"\n            (mclick)=\"search()\"\n            [excludeLogging]=\"true\"\n            [disabled]=\"!searchFunction() && !isTablePaginated()\" />\n        }\n        @if (isCompact()) {\n          <app-btn\n            [showHelpIcon]=\"false\"\n            [excludeLogging]=\"true\"\n            help=\"Search Fields\"\n            customIcon=\"fa fa-ellipsis-v\"\n            (mclick)=\"extraFieldsModal.open(); tempSelectedCompactedFields.set([])\" />\n          <modal-comp #extraFieldsModal header=\"Additional Search Fields\" width=\"800px\">\n            <ng-template modalBody>\n              <toggle-input-form\n                [valueField]=\"'field' | toAny\"\n                labelField=\"label\"\n                [gridNo]=\"3\"\n                [checkedChecker]=\"asfCheckedChecker()\"\n                [list]=\"compactedFields()\"\n                (selected)=\"tempSelectedCompactedFields.set($event)\" />\n            </ng-template>\n            <ng-template modalFooter>\n              <app-btn\n                icon=\"save\"\n                (mclick)=\"extraFieldsModal.close(); selectedCompactedFields()\"\n                text=\"Save\" />\n            </ng-template>\n          </modal-comp>\n        }\n        @if (createButton()) {\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    @if (showFormError()) {\n      <ng-container *ngTemplateOutlet=\"formErrorRef().resultTemplateRef()\"></ng-container>\n    }\n  }\n\n  <ng-content select=\"[tablePanel]\"></ng-content>\n  <!-- {{searchForm()?.getRawValue()|json}}\n  <hr>\n  {{standaloneForm()?.getRawValue()|json}} -->\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            [customTemplates]=\"customTableCellTemplates()\"\n            [label]=\"label()\"\n            [striped]=\"striped()\"\n            [nowrap]=\"nowrap()\"\n            [orderDirection]=\"orderDirection()\"\n            [orderField]=\"orderField()\"\n            [pageSize]=\"pageSize()\"\n            [rowOptions]=\"options()\"\n            [debug]=\"debug()\"\n            [searchPromptText]=\"searchPromptText()\"\n            [rowOptionsMap]=\"rowOptionsMap()\"\n            [(queryData)]=\"initialQuery\"\n            [showAdditionalColumns]=\"showAdditionalColumns()\"\n            [showExport]=\"showExport()\"\n            [showRefreshBtn]=\"showRefreshBtn()\"\n            [smallerFonts]=\"smallerFonts()\"\n            [startSectionTemplate]=\"startSectionTemplate()\"\n            [useSelection]=\"useSelection()\"\n            (clickedExpandRow)=\"clickedExpandRow.emit($event)\"\n            noItemTxt=\"No results found\" />\n        } @else {\n          @if (searchIfNoQuery() || data()?.length || searched()) {\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              [customTemplates]=\"customTableCellTemplates()\"\n              [expandedRowTemplate]=\"expandedRowTemplate()\"\n              [label]=\"label()\"\n              [striped]=\"striped()\"\n              noItemTxt=\"No results found\"\n              (rowClick)=\"rowClick($event)\"\n              [orderField]=\"orderField()\"\n              [rowOptions]=\"options()\"\n              [debug]=\"debug()\"\n              [rowOptionsMap]=\"rowOptionsMap()\"\n              [showAdditionalColumns]=\"showAdditionalColumns()\"\n              [orderDirection]=\"orderDirection()\"\n              [displayedColumns]=\"displayedColumns()\"\n              (clickedExpandRow)=\"clickedExpandRow.emit($event)\"\n              [data]=\"data()\" />\n          } @else {\n            <div class=\"text-center p-3\">\n              {{ 'Please type a search query' | appTranslate | async }}\n            </div>\n          }\n        }\n      </ng-container>\n    </div>\n  }\n</loader>\n", styles: [":host .form-cell{display:flex;align-items:end;gap:8px}:host .form-cell.showValidationMsg{align-items:center}:host .form-cell>*:first-child{width:100%}\n"], dependencies: [{ kind: "component", type: LoaderComponent, selector: "loader", inputs: ["class", "text", "loading", "height", "width", "useStaticLoader", "ratioHW"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i2$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2$2.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: AutocompleteComponent, selector: "app-autocomplete,autocomplete", inputs: ["showRequiredTag", "validate", "skipDoesOptionExistCheck", "options"], outputs: ["skipDoesOptionExistCheckChange"] }, { kind: "ngmodule", type: MatMenuModule }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { 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", "clearOnDisable", "labelLink", "loading", "multiple", "optionsFunc", "vms", "setCurrentDate", "options"], outputs: ["loadingChange", "mSelectedOptionLabel"] }, { kind: "component", type: ModalComponent, selector: "modal-comp", inputs: ["header", "bodyTemplateRef", "footerTemplateRef", "showHeader", "loading", "isFullscreen", "showFooter", "width", "minWidth", "height", "maxHeight", "icon", "data", "disableClose", "hasBackdrop", "baseConfig"], outputs: ["headerChange", "showHeaderChange", "mouseLeft", "loadingChange", "showFooterChange", "modalOpen", "modalClose"] }, { kind: "directive", type: ModalBodyDirective, selector: "[modalBody]" }, { kind: "directive", type: ModalFooterDirective, selector: "[modalFooter]" }, { kind: "component", type: BtnComponent, selector: "app-btn", inputs: ["formSchema", "debug", "centerBtn", "danger", "warning", "verbose", "translatorOptions", "loading", "icon", "rightIcon", "leftIcon", "type", "group", "actionType", "animate", "excludeLogging", "loggingValue", "badge", "class", "customIcon", "form", "forms", "help", "helpShowDelay", "iconBtn", "mclass", "showHelpIcon", "rightCustomIcon", "leftCustomIcon", "text", "valid", "mini", "onFormInvalid", "disabled"], outputs: ["loadingChange", "leftCustomIconChange", "mclick", "disabledChange"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: ToggleInputFormComponent, selector: "toggle-input-form", inputs: ["addToFormFunc", "defaultToggleAll", "readOnly", "hideSearchMenu", "hideGridMenu", "hideToggle", "deleteFromFormFunc", "gridNo", "labelField", "labelSeparator", "searchQuery", "showToggleAll", "valueField", "checkedChecker", "list"], outputs: ["gridNoChange", "searchQueryChange", "selected"] }, { kind: "component", type: TableHttpsComponent, selector: "table-https", inputs: ["observableFunc", "pageNumber", "queryData", "searchIfNoQuery", "showRefreshBtn", "useStaticLoader", "searchPromptText"], outputs: ["queryDataChange", "dataFetched"] }, { kind: "component", type: TablePlainComponent, selector: "table-plain", inputs: ["customSelectClass", "idField", "obsDataSource", "showFilter", "showPager", "disableSelectionByField", "filterExactMatch", "data", "filterFields", "filterFieldsMap", "selectionPerPage"], outputs: ["view", "dataChanged", "filterChange", "listMutated"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "component", type: FormErrorComponent, selector: "form-error", inputs: ["form", "customResult", "inline", "lgGridNo", "xxlGridNo"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: TranslatePipe, name: "appTranslate" }, { kind: "pipe", type: FunctionCaller2, name: "functionCaller2" }, { kind: "pipe", type: ToAnyPipe, name: "toAny" }, { kind: "pipe", type: widthOffsetPipe, name: "widthOffsetPipe" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.4", ngImport: i0, type: FindItemComponent, decorators: [{
             type: Component,
@@ -25125,7 +25138,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.4", ngImpor
                         ToAnyPipe,
                         FormErrorComponent,
                         widthOffsetPipe,
-                    ], template: "<loader [loading]=\"_loading()\" [useStaticLoader]=\"useStaticLoader()\">\n  @if (!hideForm() && searchForm()) {\n    <div class=\"row align-items-center\">\n      @for (scheme of computedFormSchema(); track scheme.field) {\n        <form class=\"{{ gridClass() }} \" (ngSubmit)=\"fieldAction(scheme)\">\n          <div class=\"form-cell\" [ngClass]=\"{ showValidationMsg: showValidationMsg() }\">\n            <ng-template #actionCell let-formField>\n              <span #actionBtn [id]=\"formField.name()\">\n                <app-btn\n                  [icon]=\"scheme.icon || 'show'\"\n                  [group]=\"scheme.standalone && scheme.action ? 'show' : null\"\n                  actionType=\"submit\"\n                  [disabled]=\"!formField?.validSignal()\" />\n              </span>\n            </ng-template>\n\n            @switch (scheme.type) {\n              @case ('template') {\n                <ng-container\n                  *ngTemplateOutlet=\"\n                    customTemplates()[scheme.field];\n                    context: { $implicit: { scheme, form: scheme.form } }\n                  \" />\n              }\n              @case ('tel') {\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                  [showValidationMsg]=\"showValidationMsg()\"\n                  [style.width]=\"\n                    'calc(100% - ' +\n                    (fieldWidthOffsets()[inputTag.nameStrSignal()]?.nativeElement.offsetWidth\n                      | widthOffsetPipe)+\n                    'px )'\n                  \"\n                  [disabled]=\"\n                    scheme.disabledIf | functionCaller2: searchFormValue() : (scheme.field | toAny)\n                  \"\n                  #inputTag />\n                @if (scheme.needsButton) {\n                  <ng-container *ngTemplateOutlet=\"actionCell; context: { $implicit: inputTag }\" />\n                }\n              }\n              @case ('autocomplete') {\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                  [showValidationMsg]=\"showValidationMsg()\"\n                  [hint]=\"scheme.hint\"\n                  [style.width]=\"\n                    'calc(100% - ' +\n                    (fieldWidthOffsets()[inputTag.nameStrSignal()]?.nativeElement.offsetWidth\n                      | widthOffsetPipe) +\n                    'px )'\n                  \"\n                  [disabled]=\"\n                    scheme.disabledIf | functionCaller2: searchFormValue : (scheme.field | toAny)\n                  \"\n                  #inputTag />\n                @if (scheme.needsButton) {\n                  <ng-container *ngTemplateOutlet=\"actionCell; context: { $implicit: inputTag }\" />\n                }\n              }\n              @default {\n                <app-input-basic\n                  #inputTag\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]=\"inputTag.hasValue() && !!scheme.asyncValidators\"\n                  [showValidationIcon]=\"inputTag.hasValue() && !!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                  [showValidationMsg]=\"showValidationMsg()\"\n                  [max]=\"scheme.max\"\n                  [min]=\"scheme.min\"\n                  [placeholder]=\"scheme.placeholder\"\n                  [label]=\"scheme.label\"\n                  [style.width]=\"\n                    'calc(100% - ' +\n                    (fieldWidthOffsets()[inputTag.nameStrSignal()]?.nativeElement.offsetWidth\n                    | widthOffsetPipe) +\n                    'px )'\n                  \"\n                  [disabled]=\"\n                    scheme.disabledIf | functionCaller2: searchFormValue : (scheme.field | toAny)\n                  \" />\n                @if (scheme.needsButton) {\n                  <ng-container *ngTemplateOutlet=\"actionCell; context: { $implicit: inputTag }\" />\n                }\n              }\n            }\n          </div>\n        </form>\n      }\n      <div class=\"col-md justify-content-end gap-1 align-items-center d-flex\">\n        <form-error #feTag [customResult]=\"true\" [inline]=\"true\" [form]=\"searchForm()\" />\n        @if (showClearBtn()) {\n          <app-btn type=\"danger-outline\" text=\"Clear\" icon=\"delete\" (mclick)=\"clearFilters()\" />\n        }\n        @if (showSearchBtn()) {\n          <app-btn\n            [group]=\"'search'\"\n            [iconBtn]=\"true\"\n            [text]=\"searchButtonText()\"\n            [icon]=\"searchButtonIcon()\"\n            actionType=\"submit\"\n            [form]=\"searchForm()\"\n            (mclick)=\"search()\"\n            [excludeLogging]=\"true\"\n            [disabled]=\"!searchFunction() && !isTablePaginated()\" />\n        }\n        @if (isCompact()) {\n          <app-btn\n            [showHelpIcon]=\"false\"\n            [excludeLogging]=\"true\"\n            help=\"Search Fields\"\n            customIcon=\"fa fa-ellipsis-v\"\n            (mclick)=\"extraFieldsModal.open(); tempSelectedCompactedFields.set([])\" />\n          <modal-comp #extraFieldsModal header=\"Additional Search Fields\" width=\"800px\">\n            <ng-template modalBody>\n              <toggle-input-form\n                [valueField]=\"'field' | toAny\"\n                labelField=\"label\"\n                [gridNo]=\"3\"\n                [checkedChecker]=\"asfCheckedChecker()\"\n                [list]=\"compactedFields()\"\n                (selected)=\"tempSelectedCompactedFields.set($event)\" />\n            </ng-template>\n            <ng-template modalFooter>\n              <app-btn\n                icon=\"save\"\n                (mclick)=\"extraFieldsModal.close(); selectedCompactedFields()\"\n                text=\"Save\" />\n            </ng-template>\n          </modal-comp>\n        }\n        @if (createButton()) {\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    <ng-container *ngTemplateOutlet=\"feTag.resultTemplateRef()\"></ng-container>\n  }\n\n  <ng-content select=\"[tablePanel]\"></ng-content>\n  <!-- {{searchForm()?.getRawValue()|json}}\n  <hr>\n  {{standaloneForm()?.getRawValue()|json}} -->\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            [customTemplates]=\"customTableCellTemplates()\"\n            [label]=\"label()\"\n            [striped]=\"striped()\"\n            [nowrap]=\"nowrap()\"\n            [orderDirection]=\"orderDirection()\"\n            [orderField]=\"orderField()\"\n            [pageSize]=\"pageSize()\"\n            [rowOptions]=\"options()\"\n            [debug]=\"debug()\"\n            [searchPromptText]=\"searchPromptText()\"\n            [rowOptionsMap]=\"rowOptionsMap()\"\n            [(queryData)]=\"initialQuery\"\n            [showAdditionalColumns]=\"showAdditionalColumns()\"\n            [showExport]=\"showExport()\"\n            [showRefreshBtn]=\"showRefreshBtn()\"\n            [smallerFonts]=\"smallerFonts()\"\n            [startSectionTemplate]=\"startSectionTemplate()\"\n            [useSelection]=\"useSelection()\"\n            (clickedExpandRow)=\"clickedExpandRow.emit($event)\"\n            noItemTxt=\"No results found\" />\n        } @else {\n          @if (searchIfNoQuery() || data()?.length || searched()) {\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              [customTemplates]=\"customTableCellTemplates()\"\n              [expandedRowTemplate]=\"expandedRowTemplate()\"\n              [label]=\"label()\"\n              [striped]=\"striped()\"\n              noItemTxt=\"No results found\"\n              (rowClick)=\"rowClick($event)\"\n              [orderField]=\"orderField()\"\n              [rowOptions]=\"options()\"\n              [debug]=\"debug()\"\n              [rowOptionsMap]=\"rowOptionsMap()\"\n              [showAdditionalColumns]=\"showAdditionalColumns()\"\n              [orderDirection]=\"orderDirection()\"\n              [displayedColumns]=\"displayedColumns()\"\n              (clickedExpandRow)=\"clickedExpandRow.emit($event)\"\n              [data]=\"data()\" />\n          } @else {\n            <div class=\"text-center p-3\">\n              {{ 'Please type a search query' | appTranslate | async }}\n            </div>\n          }\n        }\n      </ng-container>\n    </div>\n  }\n</loader>\n", styles: [":host .form-cell{display:flex;align-items:end;gap:8px}:host .form-cell.showValidationMsg{align-items:center}:host .form-cell>*:first-child{width:100%}\n"] }]
+                    ], template: "<loader [loading]=\"_loading()\" [useStaticLoader]=\"useStaticLoader()\">\n  @if (!hideForm() && searchForm()) {\n    <div class=\"row align-items-center\">\n      @for (scheme of computedFormSchema(); track scheme.field) {\n        <form class=\"{{ gridClass() }} \" (ngSubmit)=\"fieldAction(scheme)\">\n          <div class=\"form-cell\" [ngClass]=\"{ showValidationMsg: showValidationMsg() }\">\n            <ng-template #actionCell let-formField>\n              <span #actionBtn [id]=\"formField.name()\">\n                <app-btn\n                  [icon]=\"scheme.icon || 'show'\"\n                  [group]=\"scheme.standalone && scheme.action ? 'show' : null\"\n                  actionType=\"submit\"\n                  [disabled]=\"!formField?.validSignal()\" />\n              </span>\n            </ng-template>\n\n            @switch (scheme.type) {\n              @case ('template') {\n                <ng-container\n                  *ngTemplateOutlet=\"\n                    customTemplates()[scheme.field];\n                    context: { $implicit: { scheme, form: scheme.form } }\n                  \" />\n              }\n              @case ('tel') {\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                  [showValidationMsg]=\"showValidationMsg()\"\n                  [style.width]=\"\n                    'calc(100% - ' +\n                    (fieldWidthOffsets()[inputTag.nameStrSignal()]?.nativeElement.offsetWidth\n                      | widthOffsetPipe) +\n                    'px )'\n                  \"\n                  [disabled]=\"\n                    scheme.disabledIf | functionCaller2: searchFormValue() : (scheme.field | toAny)\n                  \"\n                  #inputTag />\n                @if (scheme.needsButton) {\n                  <ng-container *ngTemplateOutlet=\"actionCell; context: { $implicit: inputTag }\" />\n                }\n              }\n              @case ('autocomplete') {\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                  [showValidationMsg]=\"showValidationMsg()\"\n                  [hint]=\"scheme.hint\"\n                  [style.width]=\"\n                    'calc(100% - ' +\n                    (fieldWidthOffsets()[inputTag.nameStrSignal()]?.nativeElement.offsetWidth\n                      | widthOffsetPipe) +\n                    'px )'\n                  \"\n                  [disabled]=\"\n                    scheme.disabledIf | functionCaller2: searchFormValue : (scheme.field | toAny)\n                  \"\n                  #inputTag />\n                @if (scheme.needsButton) {\n                  <ng-container *ngTemplateOutlet=\"actionCell; context: { $implicit: inputTag }\" />\n                }\n              }\n              @default {\n                <app-input-basic\n                  #inputTag\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]=\"inputTag.hasValue() && !!scheme.asyncValidators\"\n                  [showValidationIcon]=\"inputTag.hasValue() && !!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                  [showValidationMsg]=\"showValidationMsg()\"\n                  [max]=\"scheme.max\"\n                  [min]=\"scheme.min\"\n                  [placeholder]=\"scheme.placeholder\"\n                  [label]=\"scheme.label\"\n                  [style.width]=\"\n                    'calc(100% - ' +\n                    (fieldWidthOffsets()[inputTag.nameStrSignal()]?.nativeElement.offsetWidth\n                      | widthOffsetPipe) +\n                    'px )'\n                  \"\n                  [disabled]=\"\n                    scheme.disabledIf | functionCaller2: searchFormValue : (scheme.field | toAny)\n                  \" />\n                @if (scheme.needsButton) {\n                  <ng-container *ngTemplateOutlet=\"actionCell; context: { $implicit: inputTag }\" />\n                }\n              }\n            }\n          </div>\n        </form>\n      }\n      <div class=\"col-md justify-content-end gap-1 align-items-center d-flex\">\n        @if (showFormError()) {\n          <form-error #feTag [customResult]=\"true\" [inline]=\"true\" [form]=\"searchForm()\" />\n        }\n        @if (showClearBtn()) {\n          <app-btn type=\"danger-outline\" text=\"Clear\" icon=\"delete\" (mclick)=\"clearFilters()\" />\n        }\n        @if (showSearchBtn()) {\n          <app-btn\n            [group]=\"'search'\"\n            [iconBtn]=\"true\"\n            [text]=\"searchButtonText()\"\n            [icon]=\"searchButtonIcon()\"\n            actionType=\"submit\"\n            [form]=\"searchForm()\"\n            (mclick)=\"search()\"\n            [excludeLogging]=\"true\"\n            [disabled]=\"!searchFunction() && !isTablePaginated()\" />\n        }\n        @if (isCompact()) {\n          <app-btn\n            [showHelpIcon]=\"false\"\n            [excludeLogging]=\"true\"\n            help=\"Search Fields\"\n            customIcon=\"fa fa-ellipsis-v\"\n            (mclick)=\"extraFieldsModal.open(); tempSelectedCompactedFields.set([])\" />\n          <modal-comp #extraFieldsModal header=\"Additional Search Fields\" width=\"800px\">\n            <ng-template modalBody>\n              <toggle-input-form\n                [valueField]=\"'field' | toAny\"\n                labelField=\"label\"\n                [gridNo]=\"3\"\n                [checkedChecker]=\"asfCheckedChecker()\"\n                [list]=\"compactedFields()\"\n                (selected)=\"tempSelectedCompactedFields.set($event)\" />\n            </ng-template>\n            <ng-template modalFooter>\n              <app-btn\n                icon=\"save\"\n                (mclick)=\"extraFieldsModal.close(); selectedCompactedFields()\"\n                text=\"Save\" />\n            </ng-template>\n          </modal-comp>\n        }\n        @if (createButton()) {\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    @if (showFormError()) {\n      <ng-container *ngTemplateOutlet=\"formErrorRef().resultTemplateRef()\"></ng-container>\n    }\n  }\n\n  <ng-content select=\"[tablePanel]\"></ng-content>\n  <!-- {{searchForm()?.getRawValue()|json}}\n  <hr>\n  {{standaloneForm()?.getRawValue()|json}} -->\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            [customTemplates]=\"customTableCellTemplates()\"\n            [label]=\"label()\"\n            [striped]=\"striped()\"\n            [nowrap]=\"nowrap()\"\n            [orderDirection]=\"orderDirection()\"\n            [orderField]=\"orderField()\"\n            [pageSize]=\"pageSize()\"\n            [rowOptions]=\"options()\"\n            [debug]=\"debug()\"\n            [searchPromptText]=\"searchPromptText()\"\n            [rowOptionsMap]=\"rowOptionsMap()\"\n            [(queryData)]=\"initialQuery\"\n            [showAdditionalColumns]=\"showAdditionalColumns()\"\n            [showExport]=\"showExport()\"\n            [showRefreshBtn]=\"showRefreshBtn()\"\n            [smallerFonts]=\"smallerFonts()\"\n            [startSectionTemplate]=\"startSectionTemplate()\"\n            [useSelection]=\"useSelection()\"\n            (clickedExpandRow)=\"clickedExpandRow.emit($event)\"\n            noItemTxt=\"No results found\" />\n        } @else {\n          @if (searchIfNoQuery() || data()?.length || searched()) {\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              [customTemplates]=\"customTableCellTemplates()\"\n              [expandedRowTemplate]=\"expandedRowTemplate()\"\n              [label]=\"label()\"\n              [striped]=\"striped()\"\n              noItemTxt=\"No results found\"\n              (rowClick)=\"rowClick($event)\"\n              [orderField]=\"orderField()\"\n              [rowOptions]=\"options()\"\n              [debug]=\"debug()\"\n              [rowOptionsMap]=\"rowOptionsMap()\"\n              [showAdditionalColumns]=\"showAdditionalColumns()\"\n              [orderDirection]=\"orderDirection()\"\n              [displayedColumns]=\"displayedColumns()\"\n              (clickedExpandRow)=\"clickedExpandRow.emit($event)\"\n              [data]=\"data()\" />\n          } @else {\n            <div class=\"text-center p-3\">\n              {{ 'Please type a search query' | appTranslate | async }}\n            </div>\n          }\n        }\n      </ng-container>\n    </div>\n  }\n</loader>\n", styles: [":host .form-cell{display:flex;align-items:end;gap:8px}:host .form-cell.showValidationMsg{align-items:center}:host .form-cell>*:first-child{width:100%}\n"] }]
         }], propDecorators: { _formSchema: [{
                 type: Input,
                 args: ['formSchema']