@flusys/ng-shared 6.0.0-rc.1 → 6.0.0

package/fesm2022/flusys-ng-shared.mjs

@@ -1728,7 +1728,7 @@ class BaseFormComponent {
         }
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: BaseFormComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.6", type: BaseFormComponent, isStandalone: true, selector: "lib-base-form", inputs: { fields: { classPropertyName: "fields", publicName: "fields", isSignal: true, isRequired: true, transformFunction: null }, title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, createTitle: { classPropertyName: "createTitle", publicName: "createTitle", isSignal: true, isRequired: false, transformFunction: null }, editTitle: { classPropertyName: "editTitle", publicName: "editTitle", isSignal: true, isRequired: false, transformFunction: null }, columns: { classPropertyName: "columns", publicName: "columns", isSignal: true, isRequired: false, transformFunction: null }, submitLabel: { classPropertyName: "submitLabel", publicName: "submitLabel", isSignal: true, isRequired: false, transformFunction: null }, cancelLabel: { classPropertyName: "cancelLabel", publicName: "cancelLabel", isSignal: true, isRequired: false, transformFunction: null }, isLoading: { classPropertyName: "isLoading", publicName: "isLoading", isSignal: true, isRequired: false, transformFunction: null }, isEditMode: { classPropertyName: "isEditMode", publicName: "isEditMode", isSignal: true, isRequired: false, transformFunction: null }, initialValue: { classPropertyName: "initialValue", publicName: "initialValue", isSignal: true, isRequired: false, transformFunction: null }, service: { classPropertyName: "service", publicName: "service", isSignal: true, isRequired: false, transformFunction: null }, editId: { classPropertyName: "editId", publicName: "editId", isSignal: true, isRequired: false, transformFunction: null }, cancelRoute: { classPropertyName: "cancelRoute", publicName: "cancelRoute", isSignal: true, isRequired: false, transformFunction: null }, navigateOnSuccess: { classPropertyName: "navigateOnSuccess", publicName: "navigateOnSuccess", isSignal: true, isRequired: false, transformFunction: null }, mapToRequest: { classPropertyName: "mapToRequest", publicName: "mapToRequest", isSignal: true, isRequired: false, transformFunction: null }, mapFromEntity: { classPropertyName: "mapFromEntity", publicName: "mapFromEntity", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onSubmit: "onSubmit", onCancel: "onCancel", onValueChange: "onValueChange" }, queries: [{ propertyName: "fieldTemplates", predicate: BaseFormTemplateDirective, isSignal: true }], ngImport: i0, template: "<f-card>\n  <ng-template #header>\n    @if (resolvedTitle()) {\n      <div class=\"flex justify-between items-center p-4\">\n        <h2 class=\"text-xl font-semibold m-0\">{{ resolvedTitle() }}</h2>\n      </div>\n    }\n  </ng-template>\n\n  <form (ngSubmit)=\"handleSubmit()\" novalidate>\n    <div class=\"grid gap-4\" [class]=\"gridClass()\">\n      @for (field of fields(); track field.key) {\n        <div class=\"flex flex-col gap-2\" [class.col-span-full]=\"field.fullWidth\">\n          @if (field.type !== 'checkbox' && field.type !== 'toggle') {\n            <label [for]=\"field.key\" class=\"font-medium\">\n              {{ field.label }}\n              @if (field.required) {\n                <span class=\"text-red-500 ml-1\">*</span>\n              }\n            </label>\n          }\n\n          @switch (field.type) {\n            @case ('text') {\n              <input\n                fInputText\n                [id]=\"field.key\"\n                [name]=\"field.key\"\n                [ngModel]=\"getFieldValue(field.key)\"\n                (ngModelChange)=\"setFieldValue(field.key, $event)\"\n                (blur)=\"markFieldTouched(field.key)\"\n                [placeholder]=\"field.placeholder ?? ''\"\n                [disabled]=\"field.disabled ?? false\"\n                [class.ng-invalid]=\"isFieldInvalid(field)\"\n                [class.ng-dirty]=\"isFieldInvalid(field)\"\n                class=\"w-full\"\n              />\n            }\n\n            @case ('email') {\n              <input\n                fInputText\n                type=\"email\"\n                [id]=\"field.key\"\n                [name]=\"field.key\"\n                [ngModel]=\"getFieldValue(field.key)\"\n                (ngModelChange)=\"setFieldValue(field.key, $event)\"\n                (blur)=\"markFieldTouched(field.key)\"\n                [placeholder]=\"field.placeholder ?? ''\"\n                [disabled]=\"field.disabled ?? false\"\n                [class.ng-invalid]=\"isFieldInvalid(field)\"\n                [class.ng-dirty]=\"isFieldInvalid(field)\"\n                class=\"w-full\"\n              />\n            }\n\n            @case ('password') {\n              <f-iconfield iconPosition=\"right\" class=\"w-full\">\n                <input\n                  fInputText\n                  fInputPassword\n                  [id]=\"field.key\"\n                  [name]=\"field.key\"\n                  [mask]=\"!isPasswordVisible(field.key)\"\n                  [ngModel]=\"getFieldValue(field.key)\"\n                  (ngModelChange)=\"setFieldValue(field.key, $event)\"\n                  (blur)=\"markFieldTouched(field.key)\"\n                  [placeholder]=\"field.placeholder ?? ''\"\n                  [disabled]=\"field.disabled ?? false\"\n                  [invalid]=\"isFieldInvalid(field)\"\n                  class=\"w-full\"\n                />\n                <f-inputicon\n                  class=\"cursor-pointer\"\n                  (click)=\"togglePasswordVisibility(field.key)\"\n                >\n                  <ui-icon [name]=\"isPasswordVisible(field.key) ? 'eye-slash' : 'eye'\"></ui-icon>\n                </f-inputicon>\n              </f-iconfield>\n            }\n\n            @case ('number') {\n              <f-inputnumber\n                [inputId]=\"field.key\"\n                [name]=\"field.key\"\n                [ngModel]=\"getFieldValue(field.key)\"\n                (ngModelChange)=\"setFieldValue(field.key, $event)\"\n                (onBlur)=\"markFieldTouched(field.key)\"\n                [placeholder]=\"field.placeholder ?? ''\"\n                [disabled]=\"field.disabled ?? false\"\n                [min]=\"field.min ?? null\"\n                [max]=\"field.max ?? null\"\n                [invalid]=\"isFieldInvalid(field)\"\n                class=\"w-full\"\n                inputStyleClass=\"w-full\"\n              />\n            }\n\n            @case ('textarea') {\n              <textarea\n                fTextarea\n                [id]=\"field.key\"\n                [name]=\"field.key\"\n                [ngModel]=\"getFieldValue(field.key)\"\n                (ngModelChange)=\"setFieldValue(field.key, $event)\"\n                (blur)=\"markFieldTouched(field.key)\"\n                [placeholder]=\"field.placeholder ?? ''\"\n                [disabled]=\"field.disabled ?? false\"\n                [rows]=\"field.rows ?? 3\"\n                [class.ng-invalid]=\"isFieldInvalid(field)\"\n                [class.ng-dirty]=\"isFieldInvalid(field)\"\n                class=\"w-full\"\n              ></textarea>\n            }\n\n            @case ('select') {\n              <f-select\n                [inputId]=\"field.key\"\n                [name]=\"field.key\"\n                [ngModel]=\"getFieldValue(field.key)\"\n                (ngModelChange)=\"setFieldValue(field.key, $event)\"\n                [options]=\"field.options ?? []\"\n                optionLabel=\"label\"\n                optionValue=\"value\"\n                [placeholder]=\"field.placeholder ?? t('shared.select.placeholder')\"\n                [disabled]=\"field.disabled ?? false\"\n                [invalid]=\"isFieldInvalid(field)\"\n                class=\"w-full\"\n              />\n            }\n\n            @case ('multiselect') {\n              <f-multiselect\n                [inputId]=\"field.key\"\n                [name]=\"field.key\"\n                [ngModel]=\"getFieldValue(field.key)\"\n                (ngModelChange)=\"setFieldValue(field.key, $event)\"\n                [options]=\"field.options ?? []\"\n                optionLabel=\"label\"\n                optionValue=\"value\"\n                [placeholder]=\"field.placeholder ?? t('shared.select.placeholder')\"\n                [disabled]=\"field.disabled ?? false\"\n                [invalid]=\"isFieldInvalid(field)\"\n                class=\"w-full\"\n              />\n            }\n\n            @case ('date') {\n              <f-datepicker\n                [inputId]=\"field.key\"\n                [name]=\"field.key\"\n                [ngModel]=\"getFieldValue(field.key)\"\n                (ngModelChange)=\"setFieldValue(field.key, $event)\"\n                (onBlur)=\"markFieldTouched(field.key)\"\n                [placeholder]=\"field.placeholder ?? ''\"\n                [disabled]=\"field.disabled ?? false\"\n                [minDate]=\"field.minDate ?? null\"\n                [maxDate]=\"field.maxDate ?? null\"\n                [invalid]=\"isFieldInvalid(field)\"\n                class=\"w-full\"\n                inputStyleClass=\"w-full\"\n              />\n            }\n\n            @case ('checkbox') {\n              <div class=\"flex items-center gap-2 h-9\">\n                <f-checkbox\n                  [inputId]=\"field.key\"\n                  [name]=\"field.key\"\n                  [ngModel]=\"getFieldValue(field.key)\"\n                  (ngModelChange)=\"setFieldValue(field.key, $event)\"\n                  [disabled]=\"field.disabled ?? false\"\n                  [binary]=\"true\"\n                  [invalid]=\"isFieldInvalid(field)\"\n                />\n                <label [for]=\"field.key\" class=\"font-medium cursor-pointer select-none\">\n                  {{ field.label }}\n                  @if (field.required) {\n                    <span class=\"text-red-500 ml-1\">*</span>\n                  }\n                </label>\n              </div>\n            }\n\n            @case ('toggle') {\n              <div class=\"flex items-center gap-3 h-9\">\n                <f-toggleswitch\n                  [inputId]=\"field.key\"\n                  [name]=\"field.key\"\n                  [ngModel]=\"getFieldValue(field.key)\"\n                  (ngModelChange)=\"setFieldValue(field.key, $event)\"\n                  [disabled]=\"field.disabled ?? false\"\n                />\n                <label [for]=\"field.key\" class=\"font-medium cursor-pointer select-none\">\n                  {{ field.label }}\n                  @if (field.required) {\n                    <span class=\"text-red-500 ml-1\">*</span>\n                  }\n                </label>\n              </div>\n            }\n\n            @case ('custom') {\n              <ng-container\n                *ngTemplateOutlet=\"getFieldTemplate(field.key); context: { $implicit: getFieldValue(field.key), field: field }\"\n              />\n            }\n          }\n\n          @if (isFieldInvalid(field)) {\n            <small class=\"text-red-500\">{{ field.label }} {{ t('shared.required') }}</small>\n          }\n\n          @if (field.hint && !isFieldInvalid(field)) {\n            <small class=\"text-surface-400\">{{ field.hint }}</small>\n          }\n        </div>\n      }\n\n      <div class=\"col-span-full flex justify-end gap-4 pt-4\">\n        <button\n          fButton\n          type=\"button\"\n          severity=\"secondary\"\n          [outlined]=\"true\"\n          [disabled]=\"effectiveIsLoading()\"\n          (click)=\"handleCancel()\"\n        >\n          <span pButtonLabel>{{ cancelLabel() || t('shared.cancel') }}</span>\n        </button>\n        <button\n          fButton\n          type=\"submit\"\n          [disabled]=\"!isFormValid() || effectiveIsLoading()\"\n        >\n          @if (effectiveIsLoading()) {\n            <ui-icon pButtonIcon name=\"spinner\" [spin]=\"true\"></ui-icon>\n          }\n          <span pButtonLabel>{{ submitLabel() || (effectiveIsEditMode() ? t('shared.update') : t('shared.save')) }}</span>\n        </button>\n      </div>\n    </div>\n  </form>\n</f-card>\n", dependencies: [{ kind: "ngmodule", type: AngularModule }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox]):not([ngNoCva])[formControlName],textarea:not([ngNoCva])[formControlName],input:not([type=checkbox]):not([ngNoCva])[formControl],textarea:not([ngNoCva])[formControl],input:not([type=checkbox]):not([ngNoCva])[ngModel],textarea:not([ngNoCva])[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i2.NgForm, selector: "form:not([ngNoForm]):not([formGroup]):not([formArray]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: UiModule }, { kind: "directive", type: i3.FButtonDirective, selector: "[fButton]", inputs: ["severity", "text", "outlined", "link", "variant", "rounded", "raised", "fluid", "disabled", "loading", "loadingIcon", "size", "label", "icon", "iconPos", "ariaLabel", "plain"] }, { kind: "component", type: i3.CheckboxComponent, selector: "f-checkbox", inputs: ["label", "binary", "disabled", "readonly", "inputId", "invalid", "indeterminate", "variant", "size", "touched", "styleClass", "style", "checked"], outputs: ["onChange", "onBlur", "touch", "checkedChange"] }, { kind: "component", type: i3.DatePickerComponent, selector: "f-datepicker", inputs: ["placeholder", "dateFormat", "disabled", "readonly", "readonlyInput", "showTime", "timeOnly", "hourFormat", "showSeconds", "selectionMode", "minDate", "maxDate", "disabledDates", "disabledDays", "inputId", "invalid", "touched", "showClear", "inputStyleClass", "showIcon", "iconDisplay", "showButtonBar", "inline", "numberOfMonths", "view", "showOtherMonths", "selectOtherMonths", "firstDayOfWeek", "appendTo", "styleClass", "style"], outputs: ["onBlur", "onSelect", "onShow", "onHide", "onClearClick", "onTodayClick", "onMonthChange", "onYearChange"] }, { kind: "component", type: i3.IconFieldComponent, selector: "f-iconfield", inputs: ["iconPosition", "styleClass"] }, { kind: "component", type: i3.InputIconComponent, selector: "f-inputicon", inputs: ["icon", "position", "styleClass", "style"] }, { kind: "component", type: i3.InputNumberComponent, selector: "f-inputnumber", inputs: ["mode", "currency", "currencyDisplay", "locale", "min", "max", "step", "showButtons", "buttonLayout", "disabled", "readonly", "inputId", "invalid", "touched", "placeholder", "prefix", "suffix", "useGrouping", "minFractionDigits", "maxFractionDigits", "size", "ariaLabel", "ariaDescribedBy", "inputStyleClass", "styleClass", "style"], outputs: ["onInput", "onFocus", "onBlur", "onKeyDown"] }, { kind: "directive", type: i3.InputTextDirective, selector: "[fInputText]", inputs: ["invalid", "touched", "variant", "size", "fluid"] }, { kind: "directive", type: i3.InputPasswordDirective, selector: "[fInputPassword]", inputs: ["mask", "toggleMask"], exportAs: ["fInputPassword"] }, { kind: "component", type: i3.MultiSelectComponent, selector: "f-multiselect", inputs: ["options", "optionLabel", "optionValue", "placeholder", "disabled", "filter", "filterBy", "filterMatchMode", "filterLocale", "filterPlaceholder", "resetFilterOnHide", "autofocusFilter", "emptyMessage", "emptyFilterMessage", "inputId", "invalid", "touched", "showClear", "optionDisabled", "display", "maxSelectedLabels", "selectionLimit", "showToggleAll", "styleClass", "style", "readonly", "autofocus", "loading", "loadingIcon", "dropdownIcon", "clearIcon", "group", "optionGroupLabel", "optionGroupChildren", "virtualScroll", "virtualScrollItemSize", "lazy"], outputs: ["onBlur", "onFocus", "onChange", "onFilter", "onShow", "onHide", "onClear", "onLazyLoad", "onSelectAllChange"] }, { kind: "component", type: i3.SelectComponent, selector: "f-select", inputs: ["options", "optionLabel", "optionValue", "placeholder", "disabled", "filter", "filterBy", "filterMatchMode", "filterLocale", "filterPlaceholder", "resetFilterOnHide", "autofocusFilter", "emptyMessage", "emptyFilterMessage", "showClear", "loading", "loadingIcon", "dropdownIcon", "clearIcon", "inputId", "invalid", "touched", "styleClass", "style", "editable", "readonly", "autofocus", "checkmark", "group", "optionGroupLabel", "optionGroupChildren", "virtualScroll", "virtualScrollItemSize", "lazy"], outputs: ["onFilter", "onChange", "onShow", "onHide", "onBlur", "onFocus", "onClear", "onLazyLoad"] }, { kind: "directive", type: i3.TextareaDirective, selector: "[fTextarea]", inputs: ["invalid", "touched", "variant", "fluid", "autoResize"], outputs: ["onResize"] }, { kind: "component", type: i3.ToggleSwitchComponent, selector: "f-toggleswitch", inputs: ["disabled", "readonly", "invalid", "ariaLabel", "trueValue", "falseValue", "inputId", "size", "tabindex", "styleClass", "style"] }, { kind: "component", type: i3.CardComponent, selector: "f-card", inputs: ["header", "subheader", "styleClass", "style"] }, { kind: "component", type: i3.UiIconComponent, selector: "ui-icon", inputs: ["name", "size", "spin", "fill", "severity"] }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.6", type: BaseFormComponent, isStandalone: true, selector: "lib-base-form", inputs: { fields: { classPropertyName: "fields", publicName: "fields", isSignal: true, isRequired: true, transformFunction: null }, title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, createTitle: { classPropertyName: "createTitle", publicName: "createTitle", isSignal: true, isRequired: false, transformFunction: null }, editTitle: { classPropertyName: "editTitle", publicName: "editTitle", isSignal: true, isRequired: false, transformFunction: null }, columns: { classPropertyName: "columns", publicName: "columns", isSignal: true, isRequired: false, transformFunction: null }, submitLabel: { classPropertyName: "submitLabel", publicName: "submitLabel", isSignal: true, isRequired: false, transformFunction: null }, cancelLabel: { classPropertyName: "cancelLabel", publicName: "cancelLabel", isSignal: true, isRequired: false, transformFunction: null }, isLoading: { classPropertyName: "isLoading", publicName: "isLoading", isSignal: true, isRequired: false, transformFunction: null }, isEditMode: { classPropertyName: "isEditMode", publicName: "isEditMode", isSignal: true, isRequired: false, transformFunction: null }, initialValue: { classPropertyName: "initialValue", publicName: "initialValue", isSignal: true, isRequired: false, transformFunction: null }, service: { classPropertyName: "service", publicName: "service", isSignal: true, isRequired: false, transformFunction: null }, editId: { classPropertyName: "editId", publicName: "editId", isSignal: true, isRequired: false, transformFunction: null }, cancelRoute: { classPropertyName: "cancelRoute", publicName: "cancelRoute", isSignal: true, isRequired: false, transformFunction: null }, navigateOnSuccess: { classPropertyName: "navigateOnSuccess", publicName: "navigateOnSuccess", isSignal: true, isRequired: false, transformFunction: null }, mapToRequest: { classPropertyName: "mapToRequest", publicName: "mapToRequest", isSignal: true, isRequired: false, transformFunction: null }, mapFromEntity: { classPropertyName: "mapFromEntity", publicName: "mapFromEntity", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onSubmit: "onSubmit", onCancel: "onCancel", onValueChange: "onValueChange" }, queries: [{ propertyName: "fieldTemplates", predicate: BaseFormTemplateDirective, isSignal: true }], ngImport: i0, template: "<f-card>\n  <ng-template #header>\n    @if (resolvedTitle()) {\n      <div class=\"flex justify-between items-center p-4\">\n        <h2 class=\"text-xl font-semibold m-0\">{{ resolvedTitle() }}</h2>\n      </div>\n    }\n  </ng-template>\n\n  <form (ngSubmit)=\"handleSubmit()\" novalidate>\n    <div class=\"grid gap-4\" [class]=\"gridClass()\">\n      @for (field of fields(); track field.key) {\n        <div class=\"flex flex-col gap-2\" [class.col-span-full]=\"field.fullWidth\">\n          @if (field.type !== 'checkbox' && field.type !== 'toggle') {\n            <label [for]=\"field.key\" class=\"font-medium\">\n              {{ field.label }}\n              @if (field.required) {\n                <span class=\"text-red-500 ml-1\">*</span>\n              }\n            </label>\n          }\n\n          @switch (field.type) {\n            @case ('text') {\n              <input\n                fInputText\n                [id]=\"field.key\"\n                [name]=\"field.key\"\n                [ngModel]=\"getFieldValue(field.key)\"\n                (ngModelChange)=\"setFieldValue(field.key, $event)\"\n                (blur)=\"markFieldTouched(field.key)\"\n                [placeholder]=\"field.placeholder ?? ''\"\n                [disabled]=\"field.disabled ?? false\"\n                [class.ng-invalid]=\"isFieldInvalid(field)\"\n                [class.ng-dirty]=\"isFieldInvalid(field)\"\n                class=\"w-full\"\n              />\n            }\n\n            @case ('email') {\n              <input\n                fInputText\n                type=\"email\"\n                [id]=\"field.key\"\n                [name]=\"field.key\"\n                [ngModel]=\"getFieldValue(field.key)\"\n                (ngModelChange)=\"setFieldValue(field.key, $event)\"\n                (blur)=\"markFieldTouched(field.key)\"\n                [placeholder]=\"field.placeholder ?? ''\"\n                [disabled]=\"field.disabled ?? false\"\n                [class.ng-invalid]=\"isFieldInvalid(field)\"\n                [class.ng-dirty]=\"isFieldInvalid(field)\"\n                class=\"w-full\"\n              />\n            }\n\n            @case ('password') {\n              <f-iconfield iconPosition=\"right\" class=\"w-full\">\n                <input\n                  fInputText\n                  fInputPassword\n                  [id]=\"field.key\"\n                  [name]=\"field.key\"\n                  [mask]=\"!isPasswordVisible(field.key)\"\n                  [ngModel]=\"getFieldValue(field.key)\"\n                  (ngModelChange)=\"setFieldValue(field.key, $event)\"\n                  (blur)=\"markFieldTouched(field.key)\"\n                  [placeholder]=\"field.placeholder ?? ''\"\n                  [disabled]=\"field.disabled ?? false\"\n                  [invalid]=\"isFieldInvalid(field)\"\n                  class=\"w-full\"\n                />\n                <f-inputicon\n                  class=\"cursor-pointer\"\n                  (click)=\"togglePasswordVisibility(field.key)\"\n                >\n                  <ui-icon [name]=\"isPasswordVisible(field.key) ? 'eye-slash' : 'eye'\"></ui-icon>\n                </f-inputicon>\n              </f-iconfield>\n            }\n\n            @case ('number') {\n              <f-inputnumber\n                [inputId]=\"field.key\"\n                [name]=\"field.key\"\n                [ngModel]=\"getFieldValue(field.key)\"\n                (ngModelChange)=\"setFieldValue(field.key, $event)\"\n                (onBlur)=\"markFieldTouched(field.key)\"\n                [placeholder]=\"field.placeholder ?? ''\"\n                [disabled]=\"field.disabled ?? false\"\n                [min]=\"field.min ?? null\"\n                [max]=\"field.max ?? null\"\n                [invalid]=\"isFieldInvalid(field)\"\n                class=\"w-full\"\n                inputStyleClass=\"w-full\"\n              />\n            }\n\n            @case ('textarea') {\n              <textarea\n                fTextarea\n                [id]=\"field.key\"\n                [name]=\"field.key\"\n                [ngModel]=\"getFieldValue(field.key)\"\n                (ngModelChange)=\"setFieldValue(field.key, $event)\"\n                (blur)=\"markFieldTouched(field.key)\"\n                [placeholder]=\"field.placeholder ?? ''\"\n                [disabled]=\"field.disabled ?? false\"\n                [rows]=\"field.rows ?? 3\"\n                [class.ng-invalid]=\"isFieldInvalid(field)\"\n                [class.ng-dirty]=\"isFieldInvalid(field)\"\n                class=\"w-full\"\n              ></textarea>\n            }\n\n            @case ('select') {\n              <f-select\n                [inputId]=\"field.key\"\n                [name]=\"field.key\"\n                [ngModel]=\"getFieldValue(field.key)\"\n                (ngModelChange)=\"setFieldValue(field.key, $event)\"\n                [options]=\"field.options ?? []\"\n                optionLabel=\"label\"\n                optionValue=\"value\"\n                [placeholder]=\"field.placeholder ?? t('shared.select.placeholder')\"\n                [disabled]=\"field.disabled ?? false\"\n                [invalid]=\"isFieldInvalid(field)\"\n                class=\"w-full\"\n              />\n            }\n\n            @case ('multiselect') {\n              <f-multiselect\n                [inputId]=\"field.key\"\n                [name]=\"field.key\"\n                [ngModel]=\"getFieldValue(field.key)\"\n                (ngModelChange)=\"setFieldValue(field.key, $event)\"\n                [options]=\"field.options ?? []\"\n                optionLabel=\"label\"\n                optionValue=\"value\"\n                [placeholder]=\"field.placeholder ?? t('shared.select.placeholder')\"\n                [disabled]=\"field.disabled ?? false\"\n                [invalid]=\"isFieldInvalid(field)\"\n                class=\"w-full\"\n              />\n            }\n\n            @case ('date') {\n              <f-datepicker\n                [inputId]=\"field.key\"\n                [name]=\"field.key\"\n                [ngModel]=\"getFieldValue(field.key)\"\n                (ngModelChange)=\"setFieldValue(field.key, $event)\"\n                (onBlur)=\"markFieldTouched(field.key)\"\n                [placeholder]=\"field.placeholder ?? ''\"\n                [disabled]=\"field.disabled ?? false\"\n                [minDate]=\"field.minDate ?? null\"\n                [maxDate]=\"field.maxDate ?? null\"\n                [invalid]=\"isFieldInvalid(field)\"\n                class=\"w-full\"\n                inputStyleClass=\"w-full\"\n              />\n            }\n\n            @case ('checkbox') {\n              <div class=\"flex items-center gap-2 h-9\">\n                <f-checkbox\n                  [inputId]=\"field.key\"\n                  [name]=\"field.key\"\n                  [ngModel]=\"getFieldValue(field.key)\"\n                  (ngModelChange)=\"setFieldValue(field.key, $event)\"\n                  [disabled]=\"field.disabled ?? false\"\n                  [binary]=\"true\"\n                  [invalid]=\"isFieldInvalid(field)\"\n                />\n                <label [for]=\"field.key\" class=\"font-medium cursor-pointer select-none\">\n                  {{ field.label }}\n                  @if (field.required) {\n                    <span class=\"text-red-500 ml-1\">*</span>\n                  }\n                </label>\n              </div>\n            }\n\n            @case ('toggle') {\n              <div class=\"flex items-center gap-3 h-9\">\n                <f-toggleswitch\n                  [inputId]=\"field.key\"\n                  [name]=\"field.key\"\n                  [ngModel]=\"getFieldValue(field.key)\"\n                  (ngModelChange)=\"setFieldValue(field.key, $event)\"\n                  [disabled]=\"field.disabled ?? false\"\n                />\n                <label [for]=\"field.key\" class=\"font-medium cursor-pointer select-none\">\n                  {{ field.label }}\n                  @if (field.required) {\n                    <span class=\"text-red-500 ml-1\">*</span>\n                  }\n                </label>\n              </div>\n            }\n\n            @case ('custom') {\n              <ng-container\n                *ngTemplateOutlet=\"getFieldTemplate(field.key); context: { $implicit: getFieldValue(field.key), field: field }\"\n              />\n            }\n          }\n\n          @if (isFieldInvalid(field)) {\n            <small class=\"text-red-500\">{{ field.label }} {{ t('shared.required') }}</small>\n          }\n\n          @if (field.hint && !isFieldInvalid(field)) {\n            <small class=\"text-surface-400\">{{ field.hint }}</small>\n          }\n        </div>\n      }\n\n      <div class=\"col-span-full flex justify-end gap-4 pt-4\">\n        <button\n          fButton\n          type=\"button\"\n          severity=\"secondary\"\n          [outlined]=\"true\"\n          [disabled]=\"effectiveIsLoading()\"\n          (click)=\"handleCancel()\"\n        >\n          <span pButtonLabel>{{ cancelLabel() || t('shared.cancel') }}</span>\n        </button>\n        <button\n          fButton\n          type=\"submit\"\n          [disabled]=\"!isFormValid() || effectiveIsLoading()\"\n        >\n          @if (effectiveIsLoading()) {\n            <ui-icon pButtonIcon name=\"spinner\" [spin]=\"true\"></ui-icon>\n          }\n          <span pButtonLabel>{{ submitLabel() || (effectiveIsEditMode() ? t('shared.update') : t('shared.save')) }}</span>\n        </button>\n      </div>\n    </div>\n  </form>\n</f-card>\n", dependencies: [{ kind: "ngmodule", type: AngularModule }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox]):not([ngNoCva])[formControlName],textarea:not([ngNoCva])[formControlName],input:not([type=checkbox]):not([ngNoCva])[formControl],textarea:not([ngNoCva])[formControl],input:not([type=checkbox]):not([ngNoCva])[ngModel],textarea:not([ngNoCva])[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i2.NgForm, selector: "form:not([ngNoForm]):not([formGroup]):not([formArray]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: UiModule }, { kind: "directive", type: i3.FButtonDirective, selector: "[fButton]", inputs: ["severity", "text", "outlined", "link", "variant", "rounded", "raised", "fluid", "disabled", "loading", "loadingIcon", "size", "label", "icon", "iconPos", "ariaLabel", "plain"] }, { kind: "component", type: i3.CheckboxComponent, selector: "f-checkbox", inputs: ["label", "binary", "disabled", "readonly", "inputId", "invalid", "indeterminate", "variant", "size", "touched", "styleClass", "style", "checked"], outputs: ["onChange", "onBlur", "touch", "checkedChange"] }, { kind: "component", type: i3.DatePickerComponent, selector: "f-datepicker", inputs: ["placeholder", "dateFormat", "disabled", "readonly", "readonlyInput", "showTime", "timeOnly", "hourFormat", "showSeconds", "selectionMode", "minDate", "maxDate", "disabledDates", "disabledDays", "inputId", "invalid", "touched", "showClear", "inputStyleClass", "showIcon", "iconDisplay", "showButtonBar", "inline", "numberOfMonths", "view", "showOtherMonths", "selectOtherMonths", "firstDayOfWeek", "appendTo", "styleClass", "style"], outputs: ["onBlur", "onSelect", "onShow", "onHide", "onClearClick", "onTodayClick", "onMonthChange", "onYearChange"] }, { kind: "component", type: i3.IconFieldComponent, selector: "f-iconfield", inputs: ["iconPosition", "styleClass"] }, { kind: "component", type: i3.InputIconComponent, selector: "f-inputicon", inputs: ["icon", "position", "styleClass", "style"] }, { kind: "component", type: i3.InputNumberComponent, selector: "f-inputnumber", inputs: ["mode", "currency", "currencyDisplay", "locale", "min", "max", "step", "showButtons", "buttonLayout", "disabled", "readonly", "inputId", "invalid", "touched", "placeholder", "prefix", "suffix", "useGrouping", "minFractionDigits", "maxFractionDigits", "size", "ariaLabel", "ariaDescribedBy", "inputStyleClass", "styleClass", "style"], outputs: ["onInput", "onFocus", "onBlur", "onKeyDown"] }, { kind: "directive", type: i3.InputTextDirective, selector: "[fInputText]", inputs: ["invalid", "touched", "variant", "size", "fluid"] }, { kind: "directive", type: i3.InputPasswordDirective, selector: "[fInputPassword]", inputs: ["mask", "toggleMask"], exportAs: ["fInputPassword"] }, { kind: "component", type: i3.MultiSelectComponent, selector: "f-multiselect", inputs: ["options", "optionLabel", "optionValue", "placeholder", "disabled", "filter", "filterBy", "filterMatchMode", "filterLocale", "filterPlaceholder", "resetFilterOnHide", "autofocusFilter", "emptyMessage", "emptyFilterMessage", "inputId", "invalid", "touched", "showClear", "optionDisabled", "display", "maxSelectedLabels", "selectionLimit", "showToggleAll", "styleClass", "style", "appendTo", "readonly", "autofocus", "loading", "loadingIcon", "dropdownIcon", "clearIcon", "group", "optionGroupLabel", "optionGroupChildren", "virtualScroll", "virtualScrollItemSize", "lazy"], outputs: ["onBlur", "onFocus", "onChange", "onFilter", "onShow", "onHide", "onClear", "onLazyLoad", "onSelectAllChange"] }, { kind: "component", type: i3.SelectComponent, selector: "f-select", inputs: ["options", "optionLabel", "optionValue", "placeholder", "disabled", "filter", "filterBy", "filterMatchMode", "filterLocale", "filterPlaceholder", "resetFilterOnHide", "autofocusFilter", "emptyMessage", "emptyFilterMessage", "showClear", "loading", "loadingIcon", "dropdownIcon", "clearIcon", "inputId", "invalid", "touched", "styleClass", "style", "appendTo", "editable", "readonly", "autofocus", "checkmark", "group", "optionGroupLabel", "optionGroupChildren", "virtualScroll", "virtualScrollItemSize", "lazy"], outputs: ["onFilter", "onChange", "onShow", "onHide", "onBlur", "onFocus", "onClear", "onLazyLoad"] }, { kind: "directive", type: i3.TextareaDirective, selector: "[fTextarea]", inputs: ["invalid", "touched", "variant", "fluid", "autoResize"], outputs: ["onResize"] }, { kind: "component", type: i3.ToggleSwitchComponent, selector: "f-toggleswitch", inputs: ["disabled", "readonly", "invalid", "ariaLabel", "trueValue", "falseValue", "inputId", "size", "tabindex", "styleClass", "style"] }, { kind: "component", type: i3.CardComponent, selector: "f-card", inputs: ["header", "subheader", "styleClass", "style"] }, { kind: "component", type: i3.UiIconComponent, selector: "ui-icon", inputs: ["name", "size", "spin", "fill", "severity"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: BaseFormComponent, decorators: [{
             type: Component,
@@ -1747,10 +1747,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.6", ngImpor
         }], propDecorators: { key: [{ type: i0.Input, args: [{ isSignal: true, alias: "baseListTemplate", required: true }] }] } });
 
 class BaseListComponent {
-    translateAdapter = inject(TranslateService, { optional: true });
+    translateAdapter = inject(TranslateService, {
+        optional: true,
+    });
     router = inject(Router, { optional: true });
     messageService = inject(MessageService, { optional: true });
-    confirmationService = inject(ConfirmationService, { optional: true });
+    confirmationService = inject(ConfirmationService, {
+        optional: true,
+    });
     columns = input.required(/* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "columns" }] : /* istanbul ignore next */ []));
     actions = input([], /* @ts-ignore */
@@ -1763,6 +1767,8 @@ class BaseListComponent {
     ...(ngDevMode ? [{ debugName: "searchable" }] : /* istanbul ignore next */ []));
     pageSize = input(10, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "pageSize" }] : /* istanbul ignore next */ []));
+    scrollHeight = input('10rem', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "scrollHeight" }] : /* istanbul ignore next */ []));
     emptyMessage = input('', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "emptyMessage" }] : /* istanbul ignore next */ []));
     createButtonLabel = input('', /* @ts-ignore */
@@ -1812,19 +1818,34 @@ class BaseListComponent {
         const editRoute = this.editRoute();
         const deleteField = this.deleteConfirmField();
         const editAction = editRoute
-            ? [{ icon: 'pencil', tooltip: 'shared.edit', severity: 'info',
-                    show: this.canEdit() ?? undefined, handler: (item) => this.handleEditItem(item) }]
+            ? [
+                {
+                    icon: 'pencil',
+                    tooltip: 'shared.edit',
+                    severity: 'info',
+                    show: this.canEdit() ?? undefined,
+                    handler: (item) => this.handleEditItem(item),
+                },
+            ]
             : [];
         const deleteAction = deleteField
-            ? [{ icon: 'trash', tooltip: 'shared.delete', severity: 'danger',
-                    show: this.canDelete() ?? undefined, handler: (item) => this.handleDeleteItem(item) }]
+            ? [
+                {
+                    icon: 'trash',
+                    tooltip: 'shared.delete',
+                    severity: 'danger',
+                    show: this.canDelete() ?? undefined,
+                    handler: (item) => this.handleDeleteItem(item),
+                },
+            ]
             : [];
         return [...editAction, ...this.actions(), ...deleteAction];
     }, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "effectiveActions" }] : /* istanbul ignore next */ []));
     visibleColumns = computed(() => this.columns().filter((c) => !c.hidden), /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "visibleColumns" }] : /* istanbul ignore next */ []));
-    columnCount = computed(() => this.visibleColumns().length + (this.effectiveActions().length > 0 ? 1 : 0), /* @ts-ignore */
+    columnCount = computed(() => this.visibleColumns().length +
+        (this.effectiveActions().length > 0 ? 1 : 0), /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "columnCount" }] : /* istanbul ignore next */ []));
     resolvedEmptyMessage = computed(() => this.emptyMessage() || this.t('shared.no.data'), /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "resolvedEmptyMessage" }] : /* istanbul ignore next */ []));
@@ -1897,7 +1918,7 @@ class BaseListComponent {
     getFieldValue(item, field) {
         return field
             .split('.')
-            .reduce((obj, key) => (obj != null ? obj[key] : null), item);
+            .reduce((obj, key) => obj != null ? obj[key] : null, item);
     }
     getFieldValueAsString(item, field) {
         return String(this.getFieldValue(item, field) ?? '');
@@ -1906,7 +1927,7 @@ class BaseListComponent {
         return col.tagMap?.[String(value)] ?? null;
     }
     getColumnTemplate(field) {
-        return this.columnTemplates().find((t) => t.key() === field)?.templateRef ?? null;
+        return (this.columnTemplates().find((t) => t.key() === field)?.templateRef ?? null);
     }
     truncateText(value, limit) {
         const str = String(value ?? '');
@@ -1914,21 +1935,24 @@ class BaseListComponent {
     }
     getCellClass(col) {
         switch (col.align) {
-            case 'center': return 'text-center';
-            case 'right': return 'text-right';
-            default: return '';
+            case 'center':
+                return 'text-center';
+            case 'right':
+                return 'text-right';
+            default:
+                return '';
         }
     }
     t(key, vars) {
         return this.translateAdapter?.translate(key, vars) ?? key;
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: BaseListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.6", type: BaseListComponent, isStandalone: true, selector: "lib-base-list", inputs: { columns: { classPropertyName: "columns", publicName: "columns", isSignal: true, isRequired: true, transformFunction: null }, actions: { classPropertyName: "actions", publicName: "actions", isSignal: true, isRequired: false, transformFunction: null }, title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, showCreateButton: { classPropertyName: "showCreateButton", publicName: "showCreateButton", isSignal: true, isRequired: false, transformFunction: null }, searchable: { classPropertyName: "searchable", publicName: "searchable", isSignal: true, isRequired: false, transformFunction: null }, pageSize: { classPropertyName: "pageSize", publicName: "pageSize", isSignal: true, isRequired: false, transformFunction: null }, emptyMessage: { classPropertyName: "emptyMessage", publicName: "emptyMessage", isSignal: true, isRequired: false, transformFunction: null }, createButtonLabel: { classPropertyName: "createButtonLabel", publicName: "createButtonLabel", isSignal: true, isRequired: false, transformFunction: null }, createButtonIcon: { classPropertyName: "createButtonIcon", publicName: "createButtonIcon", isSignal: true, isRequired: false, transformFunction: null }, data: { classPropertyName: "data", publicName: "data", isSignal: true, isRequired: false, transformFunction: null }, total: { classPropertyName: "total", publicName: "total", isSignal: true, isRequired: false, transformFunction: null }, isLoading: { classPropertyName: "isLoading", publicName: "isLoading", isSignal: true, isRequired: false, transformFunction: null }, service: { classPropertyName: "service", publicName: "service", isSignal: true, isRequired: false, transformFunction: null }, filter: { classPropertyName: "filter", publicName: "filter", isSignal: true, isRequired: false, transformFunction: null }, createRoute: { classPropertyName: "createRoute", publicName: "createRoute", isSignal: true, isRequired: false, transformFunction: null }, editRoute: { classPropertyName: "editRoute", publicName: "editRoute", isSignal: true, isRequired: false, transformFunction: null }, deleteConfirmField: { classPropertyName: "deleteConfirmField", publicName: "deleteConfirmField", isSignal: true, isRequired: false, transformFunction: null }, idField: { classPropertyName: "idField", publicName: "idField", isSignal: true, isRequired: false, transformFunction: null }, canEdit: { classPropertyName: "canEdit", publicName: "canEdit", isSignal: true, isRequired: false, transformFunction: null }, canDelete: { classPropertyName: "canDelete", publicName: "canDelete", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onCreate: "onCreate", onLazyLoad: "onLazyLoad", onSearch: "onSearch" }, queries: [{ propertyName: "columnTemplates", predicate: BaseListTemplateDirective, isSignal: true }], ngImport: i0, template: "<f-card>\n  <ng-template #header>\n    @if (title() || searchable() || showCreateButton()) {\n      <div class=\"flex flex-col sm:flex-row justify-between items-start sm:items-center gap-3 p-4\">\n        @if (title()) {\n          <h2 class=\"text-xl font-semibold m-0\">{{ title() }}</h2>\n        }\n        <div class=\"flex items-center gap-2\" [class.ml-auto]=\"!!title()\">\n          @if (searchable()) {\n            <f-iconfield>\n              <f-inputicon><ui-icon name=\"search\" class=\"text-sm\"></ui-icon></f-inputicon>\n              <input\n                fInputText\n                type=\"text\"\n                [ngModel]=\"searchTerm()\"\n                (ngModelChange)=\"onSearchChange($event)\"\n                [placeholder]=\"t('shared.search')\"\n              />\n            </f-iconfield>\n          }\n          @if (showCreateButton()) {\n            <button\n              fButton\n              (click)=\"handleCreate()\"\n            >\n              <ui-icon pButtonIcon [name]=\"createButtonIcon()\"></ui-icon>\n              <span pButtonLabel>{{ resolvedCreateLabel() }}</span>\n            </button>\n          }\n        </div>\n      </div>\n    }\n  </ng-template>\n\n  <div class=\"overflow-x-auto\">\n    <f-table\n      [value]=\"effectiveData()\"\n      [loading]=\"effectiveIsLoading()\"\n      [lazy]=\"true\"\n      [scrollable]=\"true\"\n      [paginator]=\"effectiveTotal() > pageSize()\"\n      [rows]=\"pageSize()\"\n      [totalRecords]=\"effectiveTotal()\"\n      [first]=\"first()\"\n      (onLazyLoad)=\"handleLazyLoad($event)\"\n      [showCurrentPageReport]=\"true\"\n      [currentPageReportTemplate]=\"t('shared.pagination.report')\"\n      class=\"p-datatable-striped\"\n    >\n      <ng-template #header>\n        <tr>\n          @for (col of visibleColumns(); track col.field) {\n            <th [style.width]=\"col.width\" [style.min-width]=\"col.minWidth\" [class]=\"getCellClass(col)\">\n              {{ col.header }}\n            </th>\n          }\n          @if (effectiveActions().length > 0) {\n            <th style=\"width: 120px; text-align: center;\">{{ t('shared.actions') }}</th>\n          }\n        </tr>\n      </ng-template>\n\n      <ng-template #body let-item>\n        <tr>\n          @for (col of visibleColumns(); track col.field) {\n            <td [class]=\"getCellClass(col)\">\n              @switch (col.type ?? 'text') {\n                @case ('tag') {\n                  @if (getTagConfig(col, getFieldValue(item, col.field)); as tagCfg) {\n                    <f-tag [severity]=\"tagCfg.severity\" [value]=\"tagCfg.label ?? getFieldValueAsString(item, col.field)\" />\n                  } @else {\n                    {{ getFieldValueAsString(item, col.field) }}\n                  }\n                }\n                @case ('boolean') {\n                  <f-tag\n                    [severity]=\"getFieldValue(item, col.field) ? 'success' : 'danger'\"\n                    [value]=\"getFieldValue(item, col.field) ? t('shared.yes') : t('shared.no')\"\n                  />\n                }\n                @case ('date') {\n                  {{ getFieldValueAsString(item, col.field) | date: (col.dateFormat ?? 'dd/MM/yyyy') }}\n                }\n                @case ('number') {\n                  {{ getFieldValueAsString(item, col.field) | number }}\n                }\n                @case ('custom') {\n                  <ng-container\n                    *ngTemplateOutlet=\"getColumnTemplate(col.field); context: { $implicit: item, field: col.field }\"\n                  />\n                }\n                @default {\n                  {{ truncateText(getFieldValue(item, col.field), col.truncate) }}\n                }\n              }\n            </td>\n          }\n          @if (effectiveActions().length > 0) {\n            <td>\n              <div class=\"flex items-center justify-center gap-2\">\n                @for (action of effectiveActions(); track $index) {\n                  @if (!action.show || action.show(item)) {\n                    <button\n                      fButton\n                      [severity]=\"action.severity ?? 'secondary'\"\n                      [fTooltip]=\"action.tooltip ? t(action.tooltip) : ''\"\n                      [disabled]=\"action.disabled ? action.disabled(item) : false\"\n                      (click)=\"action.handler(item)\"\n                      [rounded]=\"true\"\n                      [text]=\"true\"\n                    >\n                      <ui-icon pButtonIcon [name]=\"action.icon\"></ui-icon>\n                    </button>\n                  }\n                }\n              </div>\n            </td>\n          }\n        </tr>\n      </ng-template>\n\n      <ng-template #emptymessage>\n        <tr>\n          <td [attr.colspan]=\"columnCount()\">\n            <div class=\"flex flex-col items-center justify-center py-12 text-surface-400\">\n              <ui-icon name=\"inbox\" class=\"text-5xl mb-3\"></ui-icon>\n              <span>{{ resolvedEmptyMessage() }}</span>\n            </div>\n          </td>\n        </tr>\n      </ng-template>\n    </f-table>\n  </div>\n</f-card>\n", dependencies: [{ kind: "ngmodule", type: AngularModule }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox]):not([ngNoCva])[formControlName],textarea:not([ngNoCva])[formControlName],input:not([type=checkbox]):not([ngNoCva])[formControl],textarea:not([ngNoCva])[formControl],input:not([type=checkbox]):not([ngNoCva])[ngModel],textarea:not([ngNoCva])[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: UiModule }, { kind: "directive", type: i3.FButtonDirective, selector: "[fButton]", inputs: ["severity", "text", "outlined", "link", "variant", "rounded", "raised", "fluid", "disabled", "loading", "loadingIcon", "size", "label", "icon", "iconPos", "ariaLabel", "plain"] }, { kind: "component", type: i3.TagComponent, selector: "f-tag", inputs: ["value", "severity", "icon", "rounded", "color", "styleClass", "style"] }, { kind: "component", type: i3.IconFieldComponent, selector: "f-iconfield", inputs: ["iconPosition", "styleClass"] }, { kind: "component", type: i3.InputIconComponent, selector: "f-inputicon", inputs: ["icon", "position", "styleClass", "style"] }, { kind: "directive", type: i3.InputTextDirective, selector: "[fInputText]", inputs: ["invalid", "touched", "variant", "size", "fluid"] }, { kind: "component", type: i3.CardComponent, selector: "f-card", inputs: ["header", "subheader", "styleClass", "style"] }, { kind: "component", type: i3.TableComponent, selector: "f-table", inputs: ["value", "lazy", "loading", "rows", "totalRecords", "rowHover", "dataKey", "scrollable", "scrollHeight", "paginator", "first", "rowsPerPageOptions", "showCurrentPageReport", "currentPageReportTemplate", "tableStyle", "styleClass", "globalFilterFields", "filterDelay", "responsiveLayout", "selectionMode", "sortMode", "rowExpandMode", "resizableColumns", "rowStyleClass", "virtualScroll", "virtualScrollItemSize", "sortField", "sortOrder", "multiSortMeta", "filters", "selection", "expandedRowKeys", "contextMenuSelection"], outputs: ["sortFieldChange", "sortOrderChange", "multiSortMetaChange", "filtersChange", "selectionChange", "expandedRowKeysChange", "contextMenuSelectionChange", "onLazyLoad", "onSort", "onFilter", "onRowSelect", "onRowUnselect", "onSelectAllChange", "onRowExpand", "onRowCollapse", "onColResize", "onRowContextMenu"] }, { kind: "directive", type: i3.TooltipDirective, selector: "[fTooltip]", inputs: ["fTooltip", "tooltipPosition", "positionStyle", "tooltipStyleClass", "disabled", "tooltipEvent", "showDelay", "hideDelay", "life", "autoHide", "positionTop", "positionLeft", "escape"] }, { kind: "component", type: i3.UiIconComponent, selector: "ui-icon", inputs: ["name", "size", "spin", "fill", "severity"] }, { kind: "pipe", type: i1.DecimalPipe, name: "number" }, { kind: "pipe", type: i1.DatePipe, name: "date" }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.6", type: BaseListComponent, isStandalone: true, selector: "lib-base-list", inputs: { columns: { classPropertyName: "columns", publicName: "columns", isSignal: true, isRequired: true, transformFunction: null }, actions: { classPropertyName: "actions", publicName: "actions", isSignal: true, isRequired: false, transformFunction: null }, title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, showCreateButton: { classPropertyName: "showCreateButton", publicName: "showCreateButton", isSignal: true, isRequired: false, transformFunction: null }, searchable: { classPropertyName: "searchable", publicName: "searchable", isSignal: true, isRequired: false, transformFunction: null }, pageSize: { classPropertyName: "pageSize", publicName: "pageSize", isSignal: true, isRequired: false, transformFunction: null }, scrollHeight: { classPropertyName: "scrollHeight", publicName: "scrollHeight", isSignal: true, isRequired: false, transformFunction: null }, emptyMessage: { classPropertyName: "emptyMessage", publicName: "emptyMessage", isSignal: true, isRequired: false, transformFunction: null }, createButtonLabel: { classPropertyName: "createButtonLabel", publicName: "createButtonLabel", isSignal: true, isRequired: false, transformFunction: null }, createButtonIcon: { classPropertyName: "createButtonIcon", publicName: "createButtonIcon", isSignal: true, isRequired: false, transformFunction: null }, data: { classPropertyName: "data", publicName: "data", isSignal: true, isRequired: false, transformFunction: null }, total: { classPropertyName: "total", publicName: "total", isSignal: true, isRequired: false, transformFunction: null }, isLoading: { classPropertyName: "isLoading", publicName: "isLoading", isSignal: true, isRequired: false, transformFunction: null }, service: { classPropertyName: "service", publicName: "service", isSignal: true, isRequired: false, transformFunction: null }, filter: { classPropertyName: "filter", publicName: "filter", isSignal: true, isRequired: false, transformFunction: null }, createRoute: { classPropertyName: "createRoute", publicName: "createRoute", isSignal: true, isRequired: false, transformFunction: null }, editRoute: { classPropertyName: "editRoute", publicName: "editRoute", isSignal: true, isRequired: false, transformFunction: null }, deleteConfirmField: { classPropertyName: "deleteConfirmField", publicName: "deleteConfirmField", isSignal: true, isRequired: false, transformFunction: null }, idField: { classPropertyName: "idField", publicName: "idField", isSignal: true, isRequired: false, transformFunction: null }, canEdit: { classPropertyName: "canEdit", publicName: "canEdit", isSignal: true, isRequired: false, transformFunction: null }, canDelete: { classPropertyName: "canDelete", publicName: "canDelete", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onCreate: "onCreate", onLazyLoad: "onLazyLoad", onSearch: "onSearch" }, queries: [{ propertyName: "columnTemplates", predicate: BaseListTemplateDirective, isSignal: true }], ngImport: i0, template: "<f-card>\n  <ng-template #header>\n    @if (title() || searchable() || showCreateButton()) {\n      <div\n        class=\"flex flex-col sm:flex-row justify-between items-start sm:items-center gap-3 p-4\"\n      >\n        @if (title()) {\n          <h2 class=\"text-xl font-semibold m-0\">{{ title() }}</h2>\n        }\n        <div class=\"flex items-center gap-2\" [class.ml-auto]=\"!!title()\">\n          @if (searchable()) {\n            <f-iconfield>\n              <f-inputicon\n                ><ui-icon name=\"search\" class=\"text-sm\"></ui-icon\n              ></f-inputicon>\n              <input\n                fInputText\n                type=\"text\"\n                [ngModel]=\"searchTerm()\"\n                (ngModelChange)=\"onSearchChange($event)\"\n                [placeholder]=\"t('shared.search')\"\n              />\n            </f-iconfield>\n          }\n          @if (showCreateButton()) {\n            <button fButton (click)=\"handleCreate()\">\n              <ui-icon pButtonIcon [name]=\"createButtonIcon()\"></ui-icon>\n              <span pButtonLabel>{{ resolvedCreateLabel() }}</span>\n            </button>\n          }\n        </div>\n      </div>\n    }\n  </ng-template>\n\n  <div class=\"overflow-x-auto\">\n    <f-table\n      [value]=\"effectiveData()\"\n      [loading]=\"effectiveIsLoading()\"\n      [lazy]=\"true\"\n      [scrollable]=\"true\"\n      [scrollHeight]=\"scrollHeight()\"\n      [paginator]=\"effectiveTotal() > pageSize()\"\n      [rows]=\"pageSize()\"\n      [totalRecords]=\"effectiveTotal()\"\n      [first]=\"first()\"\n      (onLazyLoad)=\"handleLazyLoad($event)\"\n      [showCurrentPageReport]=\"true\"\n      [currentPageReportTemplate]=\"t('shared.pagination.report')\"\n      class=\"p-datatable-striped\"\n    >\n      <ng-template #header>\n        <tr>\n          @for (col of visibleColumns(); track col.field) {\n            <th\n              [style.width]=\"col.width\"\n              [style.min-width]=\"col.minWidth\"\n              [class]=\"getCellClass(col)\"\n            >\n              {{ col.header }}\n            </th>\n          }\n          @if (effectiveActions().length > 0) {\n            <th style=\"width: 120px; text-align: center\">\n              {{ t(\"shared.actions\") }}\n            </th>\n          }\n        </tr>\n      </ng-template>\n\n      <ng-template #body let-item>\n        <tr>\n          @for (col of visibleColumns(); track col.field) {\n            <td [class]=\"getCellClass(col)\">\n              @switch (col.type ?? \"text\") {\n                @case (\"tag\") {\n                  @if (\n                    getTagConfig(col, getFieldValue(item, col.field));\n                    as tagCfg\n                  ) {\n                    <f-tag\n                      [severity]=\"tagCfg.severity\"\n                      [value]=\"\n                        tagCfg.label ?? getFieldValueAsString(item, col.field)\n                      \"\n                    />\n                  } @else {\n                    {{ getFieldValueAsString(item, col.field) }}\n                  }\n                }\n                @case (\"boolean\") {\n                  <f-tag\n                    [severity]=\"\n                      getFieldValue(item, col.field) ? 'success' : 'danger'\n                    \"\n                    [value]=\"\n                      getFieldValue(item, col.field)\n                        ? t('shared.yes')\n                        : t('shared.no')\n                    \"\n                  />\n                }\n                @case (\"date\") {\n                  {{\n                    getFieldValueAsString(item, col.field)\n                      | date: col.dateFormat ?? \"dd/MM/yyyy\"\n                  }}\n                }\n                @case (\"number\") {\n                  {{ getFieldValueAsString(item, col.field) | number }}\n                }\n                @case (\"custom\") {\n                  <ng-container\n                    *ngTemplateOutlet=\"\n                      getColumnTemplate(col.field);\n                      context: { $implicit: item, field: col.field }\n                    \"\n                  />\n                }\n                @default {\n                  {{\n                    truncateText(getFieldValue(item, col.field), col.truncate)\n                  }}\n                }\n              }\n            </td>\n          }\n          @if (effectiveActions().length > 0) {\n            <td>\n              <div class=\"flex items-center justify-center gap-2\">\n                @for (action of effectiveActions(); track $index) {\n                  @if (!action.show || action.show(item)) {\n                    <button\n                      fButton\n                      [severity]=\"action.severity ?? 'secondary'\"\n                      [fTooltip]=\"action.tooltip ? t(action.tooltip) : ''\"\n                      [disabled]=\"\n                        action.disabled ? action.disabled(item) : false\n                      \"\n                      (click)=\"action.handler(item)\"\n                      [rounded]=\"true\"\n                      [text]=\"true\"\n                    >\n                      <ui-icon pButtonIcon [name]=\"action.icon\"></ui-icon>\n                    </button>\n                  }\n                }\n              </div>\n            </td>\n          }\n        </tr>\n      </ng-template>\n\n      <ng-template #emptymessage>\n        <tr>\n          <td [attr.colspan]=\"columnCount()\">\n            <div\n              class=\"flex flex-col items-center justify-center py-12 text-surface-400\"\n            >\n              <ui-icon name=\"inbox\" class=\"text-5xl mb-3\"></ui-icon>\n              <span>{{ resolvedEmptyMessage() }}</span>\n            </div>\n          </td>\n        </tr>\n      </ng-template>\n    </f-table>\n  </div>\n</f-card>\n", dependencies: [{ kind: "ngmodule", type: AngularModule }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox]):not([ngNoCva])[formControlName],textarea:not([ngNoCva])[formControlName],input:not([type=checkbox]):not([ngNoCva])[formControl],textarea:not([ngNoCva])[formControl],input:not([type=checkbox]):not([ngNoCva])[ngModel],textarea:not([ngNoCva])[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: UiModule }, { kind: "directive", type: i3.FButtonDirective, selector: "[fButton]", inputs: ["severity", "text", "outlined", "link", "variant", "rounded", "raised", "fluid", "disabled", "loading", "loadingIcon", "size", "label", "icon", "iconPos", "ariaLabel", "plain"] }, { kind: "component", type: i3.TagComponent, selector: "f-tag", inputs: ["value", "severity", "icon", "rounded", "color", "styleClass", "style"] }, { kind: "component", type: i3.IconFieldComponent, selector: "f-iconfield", inputs: ["iconPosition", "styleClass"] }, { kind: "component", type: i3.InputIconComponent, selector: "f-inputicon", inputs: ["icon", "position", "styleClass", "style"] }, { kind: "directive", type: i3.InputTextDirective, selector: "[fInputText]", inputs: ["invalid", "touched", "variant", "size", "fluid"] }, { kind: "component", type: i3.CardComponent, selector: "f-card", inputs: ["header", "subheader", "styleClass", "style"] }, { kind: "component", type: i3.TableComponent, selector: "f-table", inputs: ["value", "lazy", "loading", "rows", "totalRecords", "rowHover", "dataKey", "scrollable", "scrollHeight", "paginator", "first", "rowsPerPageOptions", "showCurrentPageReport", "currentPageReportTemplate", "tableStyle", "styleClass", "globalFilterFields", "filterDelay", "responsiveLayout", "selectionMode", "sortMode", "rowExpandMode", "resizableColumns", "rowStyleClass", "virtualScroll", "virtualScrollItemSize", "sortField", "sortOrder", "multiSortMeta", "filters", "selection", "expandedRowKeys", "contextMenuSelection"], outputs: ["sortFieldChange", "sortOrderChange", "multiSortMetaChange", "filtersChange", "selectionChange", "expandedRowKeysChange", "contextMenuSelectionChange", "onLazyLoad", "onSort", "onFilter", "onRowSelect", "onRowUnselect", "onSelectAllChange", "onRowExpand", "onRowCollapse", "onColResize", "onRowContextMenu"] }, { kind: "directive", type: i3.TooltipDirective, selector: "[fTooltip]", inputs: ["fTooltip", "tooltipPosition", "positionStyle", "tooltipStyleClass", "disabled", "tooltipEvent", "showDelay", "hideDelay", "life", "autoHide", "positionTop", "positionLeft", "escape"] }, { kind: "component", type: i3.UiIconComponent, selector: "ui-icon", inputs: ["name", "size", "spin", "fill", "severity"] }, { kind: "pipe", type: i1.DecimalPipe, name: "number" }, { kind: "pipe", type: i1.DatePipe, name: "date" }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: BaseListComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'lib-base-list', imports: [AngularModule, UiModule], template: "<f-card>\n  <ng-template #header>\n    @if (title() || searchable() || showCreateButton()) {\n      <div class=\"flex flex-col sm:flex-row justify-between items-start sm:items-center gap-3 p-4\">\n        @if (title()) {\n          <h2 class=\"text-xl font-semibold m-0\">{{ title() }}</h2>\n        }\n        <div class=\"flex items-center gap-2\" [class.ml-auto]=\"!!title()\">\n          @if (searchable()) {\n            <f-iconfield>\n              <f-inputicon><ui-icon name=\"search\" class=\"text-sm\"></ui-icon></f-inputicon>\n              <input\n                fInputText\n                type=\"text\"\n                [ngModel]=\"searchTerm()\"\n                (ngModelChange)=\"onSearchChange($event)\"\n                [placeholder]=\"t('shared.search')\"\n              />\n            </f-iconfield>\n          }\n          @if (showCreateButton()) {\n            <button\n              fButton\n              (click)=\"handleCreate()\"\n            >\n              <ui-icon pButtonIcon [name]=\"createButtonIcon()\"></ui-icon>\n              <span pButtonLabel>{{ resolvedCreateLabel() }}</span>\n            </button>\n          }\n        </div>\n      </div>\n    }\n  </ng-template>\n\n  <div class=\"overflow-x-auto\">\n    <f-table\n      [value]=\"effectiveData()\"\n      [loading]=\"effectiveIsLoading()\"\n      [lazy]=\"true\"\n      [scrollable]=\"true\"\n      [paginator]=\"effectiveTotal() > pageSize()\"\n      [rows]=\"pageSize()\"\n      [totalRecords]=\"effectiveTotal()\"\n      [first]=\"first()\"\n      (onLazyLoad)=\"handleLazyLoad($event)\"\n      [showCurrentPageReport]=\"true\"\n      [currentPageReportTemplate]=\"t('shared.pagination.report')\"\n      class=\"p-datatable-striped\"\n    >\n      <ng-template #header>\n        <tr>\n          @for (col of visibleColumns(); track col.field) {\n            <th [style.width]=\"col.width\" [style.min-width]=\"col.minWidth\" [class]=\"getCellClass(col)\">\n              {{ col.header }}\n            </th>\n          }\n          @if (effectiveActions().length > 0) {\n            <th style=\"width: 120px; text-align: center;\">{{ t('shared.actions') }}</th>\n          }\n        </tr>\n      </ng-template>\n\n      <ng-template #body let-item>\n        <tr>\n          @for (col of visibleColumns(); track col.field) {\n            <td [class]=\"getCellClass(col)\">\n              @switch (col.type ?? 'text') {\n                @case ('tag') {\n                  @if (getTagConfig(col, getFieldValue(item, col.field)); as tagCfg) {\n                    <f-tag [severity]=\"tagCfg.severity\" [value]=\"tagCfg.label ?? getFieldValueAsString(item, col.field)\" />\n                  } @else {\n                    {{ getFieldValueAsString(item, col.field) }}\n                  }\n                }\n                @case ('boolean') {\n                  <f-tag\n                    [severity]=\"getFieldValue(item, col.field) ? 'success' : 'danger'\"\n                    [value]=\"getFieldValue(item, col.field) ? t('shared.yes') : t('shared.no')\"\n                  />\n                }\n                @case ('date') {\n                  {{ getFieldValueAsString(item, col.field) | date: (col.dateFormat ?? 'dd/MM/yyyy') }}\n                }\n                @case ('number') {\n                  {{ getFieldValueAsString(item, col.field) | number }}\n                }\n                @case ('custom') {\n                  <ng-container\n                    *ngTemplateOutlet=\"getColumnTemplate(col.field); context: { $implicit: item, field: col.field }\"\n                  />\n                }\n                @default {\n                  {{ truncateText(getFieldValue(item, col.field), col.truncate) }}\n                }\n              }\n            </td>\n          }\n          @if (effectiveActions().length > 0) {\n            <td>\n              <div class=\"flex items-center justify-center gap-2\">\n                @for (action of effectiveActions(); track $index) {\n                  @if (!action.show || action.show(item)) {\n                    <button\n                      fButton\n                      [severity]=\"action.severity ?? 'secondary'\"\n                      [fTooltip]=\"action.tooltip ? t(action.tooltip) : ''\"\n                      [disabled]=\"action.disabled ? action.disabled(item) : false\"\n                      (click)=\"action.handler(item)\"\n                      [rounded]=\"true\"\n                      [text]=\"true\"\n                    >\n                      <ui-icon pButtonIcon [name]=\"action.icon\"></ui-icon>\n                    </button>\n                  }\n                }\n              </div>\n            </td>\n          }\n        </tr>\n      </ng-template>\n\n      <ng-template #emptymessage>\n        <tr>\n          <td [attr.colspan]=\"columnCount()\">\n            <div class=\"flex flex-col items-center justify-center py-12 text-surface-400\">\n              <ui-icon name=\"inbox\" class=\"text-5xl mb-3\"></ui-icon>\n              <span>{{ resolvedEmptyMessage() }}</span>\n            </div>\n          </td>\n        </tr>\n      </ng-template>\n    </f-table>\n  </div>\n</f-card>\n" }]
-        }], propDecorators: { columns: [{ type: i0.Input, args: [{ isSignal: true, alias: "columns", required: true }] }], actions: [{ type: i0.Input, args: [{ isSignal: true, alias: "actions", required: false }] }], title: [{ type: i0.Input, args: [{ isSignal: true, alias: "title", required: false }] }], showCreateButton: [{ type: i0.Input, args: [{ isSignal: true, alias: "showCreateButton", required: false }] }], searchable: [{ type: i0.Input, args: [{ isSignal: true, alias: "searchable", required: false }] }], pageSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "pageSize", required: false }] }], emptyMessage: [{ type: i0.Input, args: [{ isSignal: true, alias: "emptyMessage", required: false }] }], createButtonLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "createButtonLabel", required: false }] }], createButtonIcon: [{ type: i0.Input, args: [{ isSignal: true, alias: "createButtonIcon", required: false }] }], data: [{ type: i0.Input, args: [{ isSignal: true, alias: "data", required: false }] }], total: [{ type: i0.Input, args: [{ isSignal: true, alias: "total", required: false }] }], isLoading: [{ type: i0.Input, args: [{ isSignal: true, alias: "isLoading", required: false }] }], service: [{ type: i0.Input, args: [{ isSignal: true, alias: "service", required: false }] }], filter: [{ type: i0.Input, args: [{ isSignal: true, alias: "filter", required: false }] }], createRoute: [{ type: i0.Input, args: [{ isSignal: true, alias: "createRoute", required: false }] }], editRoute: [{ type: i0.Input, args: [{ isSignal: true, alias: "editRoute", required: false }] }], deleteConfirmField: [{ type: i0.Input, args: [{ isSignal: true, alias: "deleteConfirmField", required: false }] }], idField: [{ type: i0.Input, args: [{ isSignal: true, alias: "idField", required: false }] }], canEdit: [{ type: i0.Input, args: [{ isSignal: true, alias: "canEdit", required: false }] }], canDelete: [{ type: i0.Input, args: [{ isSignal: true, alias: "canDelete", required: false }] }], onCreate: [{ type: i0.Output, args: ["onCreate"] }], onLazyLoad: [{ type: i0.Output, args: ["onLazyLoad"] }], onSearch: [{ type: i0.Output, args: ["onSearch"] }], columnTemplates: [{ type: i0.ContentChildren, args: [i0.forwardRef(() => BaseListTemplateDirective), { isSignal: true }] }] } });
+            args: [{ selector: 'lib-base-list', imports: [AngularModule, UiModule], template: "<f-card>\n  <ng-template #header>\n    @if (title() || searchable() || showCreateButton()) {\n      <div\n        class=\"flex flex-col sm:flex-row justify-between items-start sm:items-center gap-3 p-4\"\n      >\n        @if (title()) {\n          <h2 class=\"text-xl font-semibold m-0\">{{ title() }}</h2>\n        }\n        <div class=\"flex items-center gap-2\" [class.ml-auto]=\"!!title()\">\n          @if (searchable()) {\n            <f-iconfield>\n              <f-inputicon\n                ><ui-icon name=\"search\" class=\"text-sm\"></ui-icon\n              ></f-inputicon>\n              <input\n                fInputText\n                type=\"text\"\n                [ngModel]=\"searchTerm()\"\n                (ngModelChange)=\"onSearchChange($event)\"\n                [placeholder]=\"t('shared.search')\"\n              />\n            </f-iconfield>\n          }\n          @if (showCreateButton()) {\n            <button fButton (click)=\"handleCreate()\">\n              <ui-icon pButtonIcon [name]=\"createButtonIcon()\"></ui-icon>\n              <span pButtonLabel>{{ resolvedCreateLabel() }}</span>\n            </button>\n          }\n        </div>\n      </div>\n    }\n  </ng-template>\n\n  <div class=\"overflow-x-auto\">\n    <f-table\n      [value]=\"effectiveData()\"\n      [loading]=\"effectiveIsLoading()\"\n      [lazy]=\"true\"\n      [scrollable]=\"true\"\n      [scrollHeight]=\"scrollHeight()\"\n      [paginator]=\"effectiveTotal() > pageSize()\"\n      [rows]=\"pageSize()\"\n      [totalRecords]=\"effectiveTotal()\"\n      [first]=\"first()\"\n      (onLazyLoad)=\"handleLazyLoad($event)\"\n      [showCurrentPageReport]=\"true\"\n      [currentPageReportTemplate]=\"t('shared.pagination.report')\"\n      class=\"p-datatable-striped\"\n    >\n      <ng-template #header>\n        <tr>\n          @for (col of visibleColumns(); track col.field) {\n            <th\n              [style.width]=\"col.width\"\n              [style.min-width]=\"col.minWidth\"\n              [class]=\"getCellClass(col)\"\n            >\n              {{ col.header }}\n            </th>\n          }\n          @if (effectiveActions().length > 0) {\n            <th style=\"width: 120px; text-align: center\">\n              {{ t(\"shared.actions\") }}\n            </th>\n          }\n        </tr>\n      </ng-template>\n\n      <ng-template #body let-item>\n        <tr>\n          @for (col of visibleColumns(); track col.field) {\n            <td [class]=\"getCellClass(col)\">\n              @switch (col.type ?? \"text\") {\n                @case (\"tag\") {\n                  @if (\n                    getTagConfig(col, getFieldValue(item, col.field));\n                    as tagCfg\n                  ) {\n                    <f-tag\n                      [severity]=\"tagCfg.severity\"\n                      [value]=\"\n                        tagCfg.label ?? getFieldValueAsString(item, col.field)\n                      \"\n                    />\n                  } @else {\n                    {{ getFieldValueAsString(item, col.field) }}\n                  }\n                }\n                @case (\"boolean\") {\n                  <f-tag\n                    [severity]=\"\n                      getFieldValue(item, col.field) ? 'success' : 'danger'\n                    \"\n                    [value]=\"\n                      getFieldValue(item, col.field)\n                        ? t('shared.yes')\n                        : t('shared.no')\n                    \"\n                  />\n                }\n                @case (\"date\") {\n                  {{\n                    getFieldValueAsString(item, col.field)\n                      | date: col.dateFormat ?? \"dd/MM/yyyy\"\n                  }}\n                }\n                @case (\"number\") {\n                  {{ getFieldValueAsString(item, col.field) | number }}\n                }\n                @case (\"custom\") {\n                  <ng-container\n                    *ngTemplateOutlet=\"\n                      getColumnTemplate(col.field);\n                      context: { $implicit: item, field: col.field }\n                    \"\n                  />\n                }\n                @default {\n                  {{\n                    truncateText(getFieldValue(item, col.field), col.truncate)\n                  }}\n                }\n              }\n            </td>\n          }\n          @if (effectiveActions().length > 0) {\n            <td>\n              <div class=\"flex items-center justify-center gap-2\">\n                @for (action of effectiveActions(); track $index) {\n                  @if (!action.show || action.show(item)) {\n                    <button\n                      fButton\n                      [severity]=\"action.severity ?? 'secondary'\"\n                      [fTooltip]=\"action.tooltip ? t(action.tooltip) : ''\"\n                      [disabled]=\"\n                        action.disabled ? action.disabled(item) : false\n                      \"\n                      (click)=\"action.handler(item)\"\n                      [rounded]=\"true\"\n                      [text]=\"true\"\n                    >\n                      <ui-icon pButtonIcon [name]=\"action.icon\"></ui-icon>\n                    </button>\n                  }\n                }\n              </div>\n            </td>\n          }\n        </tr>\n      </ng-template>\n\n      <ng-template #emptymessage>\n        <tr>\n          <td [attr.colspan]=\"columnCount()\">\n            <div\n              class=\"flex flex-col items-center justify-center py-12 text-surface-400\"\n            >\n              <ui-icon name=\"inbox\" class=\"text-5xl mb-3\"></ui-icon>\n              <span>{{ resolvedEmptyMessage() }}</span>\n            </div>\n          </td>\n        </tr>\n      </ng-template>\n    </f-table>\n  </div>\n</f-card>\n" }]
+        }], propDecorators: { columns: [{ type: i0.Input, args: [{ isSignal: true, alias: "columns", required: true }] }], actions: [{ type: i0.Input, args: [{ isSignal: true, alias: "actions", required: false }] }], title: [{ type: i0.Input, args: [{ isSignal: true, alias: "title", required: false }] }], showCreateButton: [{ type: i0.Input, args: [{ isSignal: true, alias: "showCreateButton", required: false }] }], searchable: [{ type: i0.Input, args: [{ isSignal: true, alias: "searchable", required: false }] }], pageSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "pageSize", required: false }] }], scrollHeight: [{ type: i0.Input, args: [{ isSignal: true, alias: "scrollHeight", required: false }] }], emptyMessage: [{ type: i0.Input, args: [{ isSignal: true, alias: "emptyMessage", required: false }] }], createButtonLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "createButtonLabel", required: false }] }], createButtonIcon: [{ type: i0.Input, args: [{ isSignal: true, alias: "createButtonIcon", required: false }] }], data: [{ type: i0.Input, args: [{ isSignal: true, alias: "data", required: false }] }], total: [{ type: i0.Input, args: [{ isSignal: true, alias: "total", required: false }] }], isLoading: [{ type: i0.Input, args: [{ isSignal: true, alias: "isLoading", required: false }] }], service: [{ type: i0.Input, args: [{ isSignal: true, alias: "service", required: false }] }], filter: [{ type: i0.Input, args: [{ isSignal: true, alias: "filter", required: false }] }], createRoute: [{ type: i0.Input, args: [{ isSignal: true, alias: "createRoute", required: false }] }], editRoute: [{ type: i0.Input, args: [{ isSignal: true, alias: "editRoute", required: false }] }], deleteConfirmField: [{ type: i0.Input, args: [{ isSignal: true, alias: "deleteConfirmField", required: false }] }], idField: [{ type: i0.Input, args: [{ isSignal: true, alias: "idField", required: false }] }], canEdit: [{ type: i0.Input, args: [{ isSignal: true, alias: "canEdit", required: false }] }], canDelete: [{ type: i0.Input, args: [{ isSignal: true, alias: "canDelete", required: false }] }], onCreate: [{ type: i0.Output, args: ["onCreate"] }], onLazyLoad: [{ type: i0.Output, args: ["onLazyLoad"] }], onSearch: [{ type: i0.Output, args: ["onSearch"] }], columnTemplates: [{ type: i0.ContentChildren, args: [i0.forwardRef(() => BaseListTemplateDirective), { isSignal: true }] }] } });
 
 /**
  * Injection Tokens for Provider Interfaces
@@ -3143,7 +3167,7 @@ class FileSelectorDialogComponent {
         </ng-template>
       }
     </f-dialog>
-  `, isInline: true, styles: [".file-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:.75rem;max-height:300px;overflow-y:auto;padding:.5rem}@media(min-width:480px){.file-grid{grid-template-columns:repeat(3,1fr);max-height:350px}}@media(min-width:640px){.file-grid{grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:1rem;max-height:400px}}.file-card{border:2px solid var(--f-surface-300);border-radius:var(--f-border-radius);cursor:pointer;transition:all .2s ease;overflow:hidden;background:var(--f-surface-0)}:host-context(.p-dark) .file-card,.dark .file-card{border-color:var(--f-surface-600);background:var(--f-surface-800)}.file-card:hover:not(.disabled){border-color:var(--f-primary-color);transform:translateY(-2px);box-shadow:var(--f-overlay-shadow)}.file-card.selected{border-color:var(--f-primary-color);background:var(--f-primary-50)}:host-context(.p-dark) .file-card.selected,.dark .file-card.selected{background:var(--f-primary-900)}.file-card.disabled{opacity:.5;cursor:not-allowed}.file-preview{position:relative;height:80px;display:flex;align-items:center;justify-content:center;background:var(--f-surface-100)}@media(min-width:640px){.file-preview{height:100px}}:host-context(.p-dark) .file-preview,.dark .file-preview{background:var(--f-surface-700)}.selected-overlay{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:rgba(var(--f-primary-500-rgb, 59, 130, 246),.3)}.selected-overlay i{color:var(--f-primary-color);background:var(--f-surface-0);border-radius:50%;padding:.5rem}:host-context(.p-dark) .selected-overlay i,.dark .selected-overlay i{background:var(--f-surface-900)}\n"], dependencies: [{ kind: "ngmodule", type: AngularModule }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox]):not([ngNoCva])[formControlName],textarea:not([ngNoCva])[formControlName],input:not([type=checkbox]):not([ngNoCva])[formControl],textarea:not([ngNoCva])[formControl],input:not([type=checkbox]):not([ngNoCva])[ngModel],textarea:not([ngNoCva])[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: IsEmptyImageDirective, selector: "img", inputs: ["src"] }, { kind: "ngmodule", type: UiModule }, { kind: "component", type: i3.ButtonComponent, selector: "f-button", inputs: ["label", "icon", "iconPos", "severity", "type", "disabled", "loading", "loadingIcon", "text", "link", "outlined", "plain", "variant", "raised", "rounded", "fluid", "size", "ariaLabel", "autofocus", "tabindex", "styleClass", "style", "badge", "badgeSeverity", "badgeClass"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "component", type: i3.IconFieldComponent, selector: "f-iconfield", inputs: ["iconPosition", "styleClass"] }, { kind: "component", type: i3.InputIconComponent, selector: "f-inputicon", inputs: ["icon", "position", "styleClass", "style"] }, { kind: "directive", type: i3.InputTextDirective, selector: "[fInputText]", inputs: ["invalid", "touched", "variant", "size", "fluid"] }, { kind: "component", type: i3.SelectComponent, selector: "f-select", inputs: ["options", "optionLabel", "optionValue", "placeholder", "disabled", "filter", "filterBy", "filterMatchMode", "filterLocale", "filterPlaceholder", "resetFilterOnHide", "autofocusFilter", "emptyMessage", "emptyFilterMessage", "showClear", "loading", "loadingIcon", "dropdownIcon", "clearIcon", "inputId", "invalid", "touched", "styleClass", "style", "editable", "readonly", "autofocus", "checkmark", "group", "optionGroupLabel", "optionGroupChildren", "virtualScroll", "virtualScrollItemSize", "lazy"], outputs: ["onFilter", "onChange", "onShow", "onHide", "onBlur", "onFocus", "onClear", "onLazyLoad"] }, { kind: "component", type: i3.DialogComponent, selector: "f-dialog", inputs: ["header", "visible", "modal", "closable", "closeOnEscape", "dismissableMask", "resizable", "draggable", "maximizable", "blockScroll", "returnFocusOnClose", "position", "style", "styleClass", "breakpoints"], outputs: ["visibleChange", "onShow", "onHide", "onMaximize"] }, { kind: "component", type: i3.UiIconComponent, selector: "ui-icon", inputs: ["name", "size", "spin", "fill", "severity"] }, { kind: "component", type: FileUploaderComponent, selector: "lib-file-uploader", inputs: ["uploadFile", "uploadMultipleFiles", "acceptTypes", "multiple", "maxFiles", "maxSizeMb", "uploadOptions", "disabled", "showPreview", "autoUpload"], outputs: ["fileUploaded", "filesUploaded", "onError", "fileSelected"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }] });
+  `, isInline: true, styles: [".file-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:.75rem;max-height:300px;overflow-y:auto;padding:.5rem}@media(min-width:480px){.file-grid{grid-template-columns:repeat(3,1fr);max-height:350px}}@media(min-width:640px){.file-grid{grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:1rem;max-height:400px}}.file-card{border:2px solid var(--f-surface-300);border-radius:var(--f-border-radius);cursor:pointer;transition:all .2s ease;overflow:hidden;background:var(--f-surface-0)}:host-context(.p-dark) .file-card,.dark .file-card{border-color:var(--f-surface-600);background:var(--f-surface-800)}.file-card:hover:not(.disabled){border-color:var(--f-primary-color);transform:translateY(-2px);box-shadow:var(--f-overlay-shadow)}.file-card.selected{border-color:var(--f-primary-color);background:var(--f-primary-50)}:host-context(.p-dark) .file-card.selected,.dark .file-card.selected{background:var(--f-primary-900)}.file-card.disabled{opacity:.5;cursor:not-allowed}.file-preview{position:relative;height:80px;display:flex;align-items:center;justify-content:center;background:var(--f-surface-100)}@media(min-width:640px){.file-preview{height:100px}}:host-context(.p-dark) .file-preview,.dark .file-preview{background:var(--f-surface-700)}.selected-overlay{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:rgba(var(--f-primary-500-rgb, 59, 130, 246),.3)}.selected-overlay i{color:var(--f-primary-color);background:var(--f-surface-0);border-radius:50%;padding:.5rem}:host-context(.p-dark) .selected-overlay i,.dark .selected-overlay i{background:var(--f-surface-900)}\n"], dependencies: [{ kind: "ngmodule", type: AngularModule }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox]):not([ngNoCva])[formControlName],textarea:not([ngNoCva])[formControlName],input:not([type=checkbox]):not([ngNoCva])[formControl],textarea:not([ngNoCva])[formControl],input:not([type=checkbox]):not([ngNoCva])[ngModel],textarea:not([ngNoCva])[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: IsEmptyImageDirective, selector: "img", inputs: ["src"] }, { kind: "ngmodule", type: UiModule }, { kind: "component", type: i3.ButtonComponent, selector: "f-button", inputs: ["label", "icon", "iconPos", "severity", "type", "disabled", "loading", "loadingIcon", "text", "link", "outlined", "plain", "variant", "raised", "rounded", "fluid", "size", "ariaLabel", "autofocus", "tabindex", "styleClass", "style", "badge", "badgeSeverity", "badgeClass"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "component", type: i3.IconFieldComponent, selector: "f-iconfield", inputs: ["iconPosition", "styleClass"] }, { kind: "component", type: i3.InputIconComponent, selector: "f-inputicon", inputs: ["icon", "position", "styleClass", "style"] }, { kind: "directive", type: i3.InputTextDirective, selector: "[fInputText]", inputs: ["invalid", "touched", "variant", "size", "fluid"] }, { kind: "component", type: i3.SelectComponent, selector: "f-select", inputs: ["options", "optionLabel", "optionValue", "placeholder", "disabled", "filter", "filterBy", "filterMatchMode", "filterLocale", "filterPlaceholder", "resetFilterOnHide", "autofocusFilter", "emptyMessage", "emptyFilterMessage", "showClear", "loading", "loadingIcon", "dropdownIcon", "clearIcon", "inputId", "invalid", "touched", "styleClass", "style", "appendTo", "editable", "readonly", "autofocus", "checkmark", "group", "optionGroupLabel", "optionGroupChildren", "virtualScroll", "virtualScrollItemSize", "lazy"], outputs: ["onFilter", "onChange", "onShow", "onHide", "onBlur", "onFocus", "onClear", "onLazyLoad"] }, { kind: "component", type: i3.DialogComponent, selector: "f-dialog", inputs: ["header", "visible", "modal", "closable", "closeOnEscape", "dismissableMask", "resizable", "draggable", "maximizable", "blockScroll", "returnFocusOnClose", "position", "style", "styleClass", "breakpoints"], outputs: ["visibleChange", "onShow", "onHide", "onMaximize"] }, { kind: "component", type: i3.UiIconComponent, selector: "ui-icon", inputs: ["name", "size", "spin", "fill", "severity"] }, { kind: "component", type: FileUploaderComponent, selector: "lib-file-uploader", inputs: ["uploadFile", "uploadMultipleFiles", "acceptTypes", "multiple", "maxFiles", "maxSizeMb", "uploadOptions", "disabled", "showPreview", "autoUpload"], outputs: ["fileUploaded", "filesUploaded", "onError", "fileSelected"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: FileSelectorDialogComponent, decorators: [{
             type: Component,
@@ -3804,7 +3828,7 @@ class LazySelectComponent extends BaseFormControl {
         return key;
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: LazySelectComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "22.0.6", type: LazySelectComponent, isStandalone: true, selector: "lib-lazy-select", inputs: { placeHolder: { classPropertyName: "placeHolder", publicName: "placeHolder", isSignal: true, isRequired: false, transformFunction: null }, showClear: { classPropertyName: "showClear", publicName: "showClear", isSignal: true, isRequired: false, transformFunction: null }, optionLabel: { classPropertyName: "optionLabel", publicName: "optionLabel", isSignal: true, isRequired: true, transformFunction: null }, optionValue: { classPropertyName: "optionValue", publicName: "optionValue", isSignal: true, isRequired: true, transformFunction: null }, isEditMode: { classPropertyName: "isEditMode", publicName: "isEditMode", isSignal: true, isRequired: true, transformFunction: null }, isLoading: { classPropertyName: "isLoading", publicName: "isLoading", isSignal: true, isRequired: true, transformFunction: null }, total: { classPropertyName: "total", publicName: "total", isSignal: true, isRequired: true, transformFunction: null }, pagination: { classPropertyName: "pagination", publicName: "pagination", isSignal: true, isRequired: true, transformFunction: null }, selectDataList: { classPropertyName: "selectDataList", publicName: "selectDataList", isSignal: true, isRequired: true, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange", onSearch: "onSearch", onPagination: "onPagination" }, providers: [provideValueAccessor(LazySelectComponent)], viewQueries: [{ propertyName: "scrollContainer", first: true, predicate: ["scrollContainer"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<div #scrollContainer class=\"lib-scroll-container\">\n  <f-select\n    class=\"w-full\"\n    [options]=\"selectDataList()\"\n    [optionLabel]=\"optionLabel()\"\n    [optionValue]=\"optionValue()\"\n    [filter]=\"true\"\n    [showClear]=\"showClear()\"\n    [placeholder]=\"displayPlaceholder()\"\n    [disabled]=\"disabled()\"\n    [(ngModel)]=\"value\"\n    appEditModeElementChanger\n    [isEditMode]=\"isEditMode()\"\n    (click)=\"showPanel()\"\n    (onBlur)=\"onBlur()\"\n  >\n    <ng-template #filter let-filter>\n      <input\n        fInputText\n        class=\"w-full\"\n        [ngModel]=\"searchTerm()\"\n        [ngModelOptions]=\"{ standalone: true }\"\n        (ngModelChange)=\"searchTerm.set($event)\"\n      />\n    </ng-template>\n    <ng-template #selectedItem let-selectedOption>\n      {{ selectedOption[optionLabel()] }}\n    </ng-template>\n    <ng-template #item let-item>\n      {{ item[optionLabel()] }}\n    </ng-template>\n  </f-select>\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: AngularModule }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox]):not([ngNoCva])[formControlName],textarea:not([ngNoCva])[formControlName],input:not([type=checkbox]):not([ngNoCva])[formControl],textarea:not([ngNoCva])[formControl],input:not([type=checkbox]):not([ngNoCva])[ngModel],textarea:not([ngNoCva])[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: UiModule }, { kind: "directive", type: i3.InputTextDirective, selector: "[fInputText]", inputs: ["invalid", "touched", "variant", "size", "fluid"] }, { kind: "component", type: i3.SelectComponent, selector: "f-select", inputs: ["options", "optionLabel", "optionValue", "placeholder", "disabled", "filter", "filterBy", "filterMatchMode", "filterLocale", "filterPlaceholder", "resetFilterOnHide", "autofocusFilter", "emptyMessage", "emptyFilterMessage", "showClear", "loading", "loadingIcon", "dropdownIcon", "clearIcon", "inputId", "invalid", "touched", "styleClass", "style", "editable", "readonly", "autofocus", "checkmark", "group", "optionGroupLabel", "optionGroupChildren", "virtualScroll", "virtualScrollItemSize", "lazy"], outputs: ["onFilter", "onChange", "onShow", "onHide", "onBlur", "onFocus", "onClear", "onLazyLoad"] }, { kind: "directive", type: EditModeElementChangerDirective, selector: "[appEditModeElementChanger]", inputs: ["isEditMode"] }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "22.0.6", type: LazySelectComponent, isStandalone: true, selector: "lib-lazy-select", inputs: { placeHolder: { classPropertyName: "placeHolder", publicName: "placeHolder", isSignal: true, isRequired: false, transformFunction: null }, showClear: { classPropertyName: "showClear", publicName: "showClear", isSignal: true, isRequired: false, transformFunction: null }, optionLabel: { classPropertyName: "optionLabel", publicName: "optionLabel", isSignal: true, isRequired: true, transformFunction: null }, optionValue: { classPropertyName: "optionValue", publicName: "optionValue", isSignal: true, isRequired: true, transformFunction: null }, isEditMode: { classPropertyName: "isEditMode", publicName: "isEditMode", isSignal: true, isRequired: true, transformFunction: null }, isLoading: { classPropertyName: "isLoading", publicName: "isLoading", isSignal: true, isRequired: true, transformFunction: null }, total: { classPropertyName: "total", publicName: "total", isSignal: true, isRequired: true, transformFunction: null }, pagination: { classPropertyName: "pagination", publicName: "pagination", isSignal: true, isRequired: true, transformFunction: null }, selectDataList: { classPropertyName: "selectDataList", publicName: "selectDataList", isSignal: true, isRequired: true, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange", onSearch: "onSearch", onPagination: "onPagination" }, providers: [provideValueAccessor(LazySelectComponent)], viewQueries: [{ propertyName: "scrollContainer", first: true, predicate: ["scrollContainer"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<div #scrollContainer class=\"lib-scroll-container\">\n  <f-select\n    class=\"w-full\"\n    [options]=\"selectDataList()\"\n    [optionLabel]=\"optionLabel()\"\n    [optionValue]=\"optionValue()\"\n    [filter]=\"true\"\n    [showClear]=\"showClear()\"\n    [placeholder]=\"displayPlaceholder()\"\n    [disabled]=\"disabled()\"\n    [(ngModel)]=\"value\"\n    appEditModeElementChanger\n    [isEditMode]=\"isEditMode()\"\n    (click)=\"showPanel()\"\n    (onBlur)=\"onBlur()\"\n  >\n    <ng-template #filter let-filter>\n      <input\n        fInputText\n        class=\"w-full\"\n        [ngModel]=\"searchTerm()\"\n        [ngModelOptions]=\"{ standalone: true }\"\n        (ngModelChange)=\"searchTerm.set($event)\"\n      />\n    </ng-template>\n    <ng-template #selectedItem let-selectedOption>\n      {{ selectedOption[optionLabel()] }}\n    </ng-template>\n    <ng-template #item let-item>\n      {{ item[optionLabel()] }}\n    </ng-template>\n  </f-select>\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: AngularModule }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox]):not([ngNoCva])[formControlName],textarea:not([ngNoCva])[formControlName],input:not([type=checkbox]):not([ngNoCva])[formControl],textarea:not([ngNoCva])[formControl],input:not([type=checkbox]):not([ngNoCva])[ngModel],textarea:not([ngNoCva])[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: UiModule }, { kind: "directive", type: i3.InputTextDirective, selector: "[fInputText]", inputs: ["invalid", "touched", "variant", "size", "fluid"] }, { kind: "component", type: i3.SelectComponent, selector: "f-select", inputs: ["options", "optionLabel", "optionValue", "placeholder", "disabled", "filter", "filterBy", "filterMatchMode", "filterLocale", "filterPlaceholder", "resetFilterOnHide", "autofocusFilter", "emptyMessage", "emptyFilterMessage", "showClear", "loading", "loadingIcon", "dropdownIcon", "clearIcon", "inputId", "invalid", "touched", "styleClass", "style", "appendTo", "editable", "readonly", "autofocus", "checkmark", "group", "optionGroupLabel", "optionGroupChildren", "virtualScroll", "virtualScrollItemSize", "lazy"], outputs: ["onFilter", "onChange", "onShow", "onHide", "onBlur", "onFocus", "onClear", "onLazyLoad"] }, { kind: "directive", type: EditModeElementChangerDirective, selector: "[appEditModeElementChanger]", inputs: ["isEditMode"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: LazySelectComponent, decorators: [{
             type: Component,