@elite.framework/ng.core 1.0.30 → 1.0.32

package/fesm2022/elite.framework-ng.core.mjs

@@ -13,7 +13,7 @@ import * as i3 from 'primeng/autocomplete';
 import { AutoCompleteModule, AutoComplete } from 'primeng/autocomplete';
 import * as i3$1 from 'primeng/button';
 import { ButtonModule, Button } from 'primeng/button';
-import * as i7 from 'primeng/inputtext';
+import * as i6 from 'primeng/inputtext';
 import { InputTextModule } from 'primeng/inputtext';
 import * as i8 from 'primeng/dialog';
 import { DialogModule } from 'primeng/dialog';
@@ -24,21 +24,22 @@ import * as i1$1 from '@angular/common/http';
 import { HttpParams } from '@angular/common/http';
 import * as i1$2 from 'primeng/api';
 import { MessageService } from 'primeng/api';
-import * as i4 from 'primeng/menu';
+import * as i4$1 from 'primeng/menu';
 import { SafeHtmlPipe, MenuModule, Menu } from 'primeng/menu';
-import * as i2$1 from 'primeng/fileupload';
+import * as i4 from 'primeng/fileupload';
 import { FileUploadModule } from 'primeng/fileupload';
-import * as i2$2 from '@angular/router';
+import { ENVIRONMENT as ENVIRONMENT$1, AttachmentDto as AttachmentDto$1 } from '@framework/ng.core';
+import * as i2$1 from '@angular/router';
 import { RouterModule } from '@angular/router';
 import * as i1$4 from 'primeng/colorpicker';
 import { ColorPickerModule } from 'primeng/colorpicker';
-import * as i4$2 from 'primeng/divider';
+import * as i4$3 from 'primeng/divider';
 import { DividerModule } from 'primeng/divider';
 import * as i1$5 from 'primeng/tooltip';
 import { TooltipModule, Tooltip } from 'primeng/tooltip';
 import * as i5 from 'primeng/orderlist';
 import { OrderListModule } from 'primeng/orderlist';
-import * as i6 from 'primeng/checkbox';
+import * as i6$1 from 'primeng/checkbox';
 import { CheckboxModule, Checkbox } from 'primeng/checkbox';
 import { ToggleSwitch } from 'primeng/toggleswitch';
 import * as i1$6 from 'primeng/dynamicdialog';
@@ -52,20 +53,20 @@ import { FormlyPrimeNGModule, withFormlyPrimeNG } from '@ngx-formly/primeng';
 import { ProgressSpinnerModule } from 'primeng/progressspinner';
 import { MessageModule } from 'primeng/message';
 import { ToolbarModule } from 'primeng/toolbar';
-import * as i4$1 from 'primeng/inputicon';
+import * as i4$2 from 'primeng/inputicon';
 import { InputIconModule } from 'primeng/inputicon';
 import * as i5$1 from 'primeng/iconfield';
 import { IconFieldModule } from 'primeng/iconfield';
-import * as i2$3 from 'primeng/table';
+import * as i2$2 from 'primeng/table';
 import { TableModule } from 'primeng/table';
 import * as i5$2 from 'primeng/drawer';
 import { DrawerModule, Drawer } from 'primeng/drawer';
 import Swal from 'sweetalert2';
-import * as i2$4 from 'primeng/datepicker';
+import * as i2$3 from 'primeng/datepicker';
 import { DatePickerModule } from 'primeng/datepicker';
 import { TabsModule } from 'primeng/tabs';
 import { Tag } from 'primeng/tag';
-import * as i2$5 from 'primeng/editor';
+import * as i2$4 from 'primeng/editor';
 import { EditorModule } from 'primeng/editor';
 import { FormlyFormFieldModule as FormlyFormFieldModule$1 } from '@ngx-formly/primeng/form-field';
 import { InputNumber } from 'primeng/inputnumber';
@@ -73,7 +74,7 @@ import * as i3$3 from 'primeng/select';
 import { SelectModule } from 'primeng/select';
 import * as i5$3 from '@ngx-formly/core/select';
 import { FormlySelectModule as FormlySelectModule$1 } from '@ngx-formly/core/select';
-import * as i2$6 from 'primeng/textarea';
+import * as i2$5 from 'primeng/textarea';
 import { TextareaModule } from 'primeng/textarea';
 import * as i3$4 from 'primeng/radiobutton';
 import { RadioButtonModule } from 'primeng/radiobutton';
@@ -1115,7 +1116,7 @@ class ConditionExpressionBuilderType extends FieldType {
     </div>
   </ng-template>
     </div>
-  `, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[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: AutoCompleteModule }, { kind: "component", type: i3.AutoComplete, selector: "p-autoComplete, p-autocomplete, p-auto-complete", inputs: ["minLength", "minQueryLength", "delay", "panelStyle", "styleClass", "panelStyleClass", "inputStyle", "inputId", "inputStyleClass", "placeholder", "readonly", "scrollHeight", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "autoHighlight", "forceSelection", "type", "autoZIndex", "baseZIndex", "ariaLabel", "dropdownAriaLabel", "ariaLabelledBy", "dropdownIcon", "unique", "group", "completeOnFocus", "showClear", "dropdown", "showEmptyMessage", "dropdownMode", "multiple", "tabindex", "dataKey", "emptyMessage", "showTransitionOptions", "hideTransitionOptions", "autofocus", "autocomplete", "optionGroupChildren", "optionGroupLabel", "overlayOptions", "suggestions", "optionLabel", "optionValue", "id", "searchMessage", "emptySelectionMessage", "selectionMessage", "autoOptionFocus", "selectOnFocus", "searchLocale", "optionDisabled", "focusOnHover", "typeahead", "appendTo"], outputs: ["completeMethod", "onSelect", "onUnselect", "onFocus", "onBlur", "onDropdownClick", "onClear", "onKeyUp", "onShow", "onHide", "onLazyLoad"] }, { kind: "component", type: i1$2.Footer, selector: "p-footer" }, { kind: "directive", type: i1$2.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "directive", type: i3$1.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "loading", "severity", "raised", "rounded", "text", "outlined", "size", "plain", "fluid", "label", "icon", "buttonProps"] }, { kind: "ngmodule", type: InputTextModule }, { kind: "directive", type: i7.InputText, selector: "[pInputText]", inputs: ["pSize", "variant", "fluid", "invalid"] }, { kind: "ngmodule", type: DialogModule }, { kind: "component", type: i8.Dialog, selector: "p-dialog", inputs: ["header", "draggable", "resizable", "contentStyle", "contentStyleClass", "modal", "closeOnEscape", "dismissableMask", "rtl", "closable", "breakpoints", "styleClass", "maskStyleClass", "maskStyle", "showHeader", "blockScroll", "autoZIndex", "baseZIndex", "minX", "minY", "focusOnShow", "maximizable", "keepInViewport", "focusTrap", "transitionOptions", "closeIcon", "closeAriaLabel", "closeTabindex", "minimizeIcon", "maximizeIcon", "closeButtonProps", "maximizeButtonProps", "visible", "style", "position", "role", "appendTo", "content", "contentTemplate", "footerTemplate", "closeIconTemplate", "maximizeIconTemplate", "minimizeIconTemplate", "headlessTemplate"], outputs: ["onShow", "onHide", "visibleChange", "onResizeInit", "onResizeEnd", "onDragEnd", "onMaximize"] }, { kind: "ngmodule", type: PopoverModule }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1$3.TranslatePipe, name: "translate" }] });
+  `, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[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: AutoCompleteModule }, { kind: "component", type: i3.AutoComplete, selector: "p-autoComplete, p-autocomplete, p-auto-complete", inputs: ["minLength", "minQueryLength", "delay", "panelStyle", "styleClass", "panelStyleClass", "inputStyle", "inputId", "inputStyleClass", "placeholder", "readonly", "scrollHeight", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "autoHighlight", "forceSelection", "type", "autoZIndex", "baseZIndex", "ariaLabel", "dropdownAriaLabel", "ariaLabelledBy", "dropdownIcon", "unique", "group", "completeOnFocus", "showClear", "dropdown", "showEmptyMessage", "dropdownMode", "multiple", "tabindex", "dataKey", "emptyMessage", "showTransitionOptions", "hideTransitionOptions", "autofocus", "autocomplete", "optionGroupChildren", "optionGroupLabel", "overlayOptions", "suggestions", "optionLabel", "optionValue", "id", "searchMessage", "emptySelectionMessage", "selectionMessage", "autoOptionFocus", "selectOnFocus", "searchLocale", "optionDisabled", "focusOnHover", "typeahead", "appendTo"], outputs: ["completeMethod", "onSelect", "onUnselect", "onFocus", "onBlur", "onDropdownClick", "onClear", "onKeyUp", "onShow", "onHide", "onLazyLoad"] }, { kind: "component", type: i1$2.Footer, selector: "p-footer" }, { kind: "directive", type: i1$2.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "directive", type: i3$1.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "loading", "severity", "raised", "rounded", "text", "outlined", "size", "plain", "fluid", "label", "icon", "buttonProps"] }, { kind: "ngmodule", type: InputTextModule }, { kind: "directive", type: i6.InputText, selector: "[pInputText]", inputs: ["pSize", "variant", "fluid", "invalid"] }, { kind: "ngmodule", type: DialogModule }, { kind: "component", type: i8.Dialog, selector: "p-dialog", inputs: ["header", "draggable", "resizable", "contentStyle", "contentStyleClass", "modal", "closeOnEscape", "dismissableMask", "rtl", "closable", "breakpoints", "styleClass", "maskStyleClass", "maskStyle", "showHeader", "blockScroll", "autoZIndex", "baseZIndex", "minX", "minY", "focusOnShow", "maximizable", "keepInViewport", "focusTrap", "transitionOptions", "closeIcon", "closeAriaLabel", "closeTabindex", "minimizeIcon", "maximizeIcon", "closeButtonProps", "maximizeButtonProps", "visible", "style", "position", "role", "appendTo", "content", "contentTemplate", "footerTemplate", "closeIconTemplate", "maximizeIconTemplate", "minimizeIconTemplate", "headlessTemplate"], outputs: ["onShow", "onHide", "visibleChange", "onResizeInit", "onResizeEnd", "onDragEnd", "onMaximize"] }, { kind: "ngmodule", type: PopoverModule }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1$3.TranslatePipe, name: "translate" }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.4", ngImport: i0, type: ConditionExpressionBuilderType, decorators: [{
             type: Component,
@@ -1321,59 +1322,84 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.4", ngImpor
                 }]
         }] });
 
-class AttachmentDto {
-    binaryObjectId;
-    description;
-    tiMt; // mimeType
-    id;
-    tiNa; // fileName
-    base64;
-}
-
-// import { API_BASE_URL } from '../../tokens';
 class AttachmentTypeComponent extends FieldType {
     messageService;
-    maxFileSize = 1 * 1024 * 1024;
+    defaultAcceptTypes = '.pdf,application/pdf,image/*,.txt,text/plain,application/vnd.openxmlformats-officedocument.spreadsheetml.sheet,application/vnd.ms-excel';
+    maxFileSize = 1 * 1024 * 1024; // 1 MB
     url = '';
     tenantId = 0;
-    env = inject(ENVIRONMENT);
+    env = inject(ENVIRONMENT$1);
     constructor(messageService) {
         super();
         this.messageService = messageService;
-        this.url = this.env.apiUrl + '/files';
+        this.url = this.env.apiUrl + (this.props['apiUrl'] ?? '/api/files');
     }
     get attachments() {
-        return this.formControl.value || [];
+        return Array.isArray(this.formControl.value)
+            ? this.formControl.value
+            : (this.formControl.value ? [this.formControl.value] : []);
     }
     set attachments(value) {
-        this.formControl.setValue(value);
+        if (this.props['multiple']) {
+            this.formControl.setValue(value);
+        }
+        else {
+            this.formControl.setValue(value?.[0] || null);
+        }
+    }
+    get attachment() {
+        return Array.isArray(this.formControl.value)
+            ? (this.formControl.value[0] || null)
+            : this.formControl.value || null;
+    }
+    set attachment(value) {
+        if (this.props['multiple']) {
+            const arr = Array.isArray(this.formControl.value)
+                ? [...this.formControl.value]
+                : (this.formControl.value ? [this.formControl.value] : []);
+            if (value)
+                arr.push(value);
+            this.formControl.setValue(arr);
+        }
+        else {
+            this.formControl.setValue(value);
+        }
     }
     async onUpload(event) {
         const files = event.files;
+        const isMultiple = this.props['multiple'] ?? true;
+        const allowedTypes = this.props['accept'] || '';
         for (const file of files) {
             if (file.size > this.maxFileSize) {
                 this.messageService.add({
                     severity: 'error',
                     summary: 'خطأ',
-                    detail: `الملف "${file.name}" يتجاوز الحد الأقصى (1MB)`
+                    detail: `الملف "${file.name}" يتجاوز الحد الأقصى (1MB)`,
+                });
+                continue;
+            }
+            if (allowedTypes && !this.isFileTypeAllowed(file, allowedTypes)) {
+                this.messageService.add({
+                    severity: 'error',
+                    summary: 'نوع الملف غير مسموح',
+                    detail: `الملف "${file.name}" ليس من الأنواع المسموحة`,
                 });
                 continue;
             }
-            const isDuplicate = this.attachments.some(a => a.tiNa === file.name);
-            if (isDuplicate) {
-                // this.messageService.add({
-                //   severity: 'warn',
-                //   summary: 'تكرار',
-                //   detail: `الملف "${file.name}" موجود بالفعل`
-                // });
+            if (isMultiple && this.attachments.some(a => a.fileName === file.name)) {
                 continue;
             }
             const base64 = await this.fileToBase64(file);
-            const attachment = new AttachmentDto();
-            attachment.tiNa = file.name;
-            attachment.tiMt = file.type;
+            const attachment = new AttachmentDto$1();
+            attachment.fileName = file.name;
+            attachment.mimeType = file.type;
             attachment.base64 = base64;
-            this.attachments = [...this.attachments, attachment];
+            if (isMultiple) {
+                this.attachments = [...this.attachments, attachment];
+            }
+            else {
+                this.attachment = attachment;
+            }
         }
     }
     remove(index) {
@@ -1389,7 +1415,18 @@ class AttachmentTypeComponent extends FieldType {
             const reader = new FileReader();
             reader.readAsDataURL(file);
             reader.onload = () => resolve(reader.result.split(',')[1]);
-            reader.onerror = (err) => reject(err);
+            reader.onerror = err => reject(err);
+        });
+    }
+    isFileTypeAllowed(file, allowedTypes) {
+        const accepted = allowedTypes.split(',').map(t => t.trim());
+        return accepted.some(type => {
+            if (type === '*/*')
+                return true;
+            if (type.endsWith('/*')) {
+                return file.type.startsWith(type.split('/')[0] + '/');
+            }
+            return file.type === type;
         });
     }
     getFileLabel(mime) {
@@ -1451,11 +1488,18 @@ class AttachmentTypeComponent extends FieldType {
         return 'pi pi-file';
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.4", ngImport: i0, type: AttachmentTypeComponent, deps: [{ token: i1$2.MessageService }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.4", type: AttachmentTypeComponent, isStandalone: true, selector: "attachment-type", providers: [MessageService], usesInheritance: true, ngImport: i0, template: "\n  <div class=\"panel\">\n  <p-fileUpload\n    name=\"file\"\n    [customUpload]=\"true\"\n    [auto]=\"true\"\n    [multiple]=\"true\"\n    [maxFileSize]=\"maxFileSize\"\n    accept=\".pdf,application/pdf,image/*,.txt,text/plain,application/vnd.openxmlformats-officedocument.spreadsheetml.sheet,application/vnd.ms-excel\"\n    (uploadHandler)=\"onUpload($event)\"\n    chooseLabel=\"\u0627\u0633\u062D\u0628 \u0627\u0644\u0645\u0644\u0641\u0627\u062A \u0623\u0648 \u0627\u0646\u0642\u0631 \u0644\u0644\u0625\u0631\u0641\u0627\u0642\"\n    class=\"w-full\"\n  >\n    <ng-template pTemplate=\"header\" let-files let-chooseCallback=\"chooseCallback\" let-clearCallback=\"clearCallback\" let-uploadCallback=\"uploadCallback\">\n        <div class=\"flex flex-wrap justify-content-between align-items-center flex-1 gap-2\">\n            <div class=\"flex gap-2\">\n              <p-button\n              (onClick)=\"choose($event, chooseCallback)\"\n              icon=\"pi pi-plus\"\n              [rounded]=\"true\"\n              [outlined]=\"true\"\n              styleClass=\"border border-green-600 text-green-600 hover:bg-green-100 bg-white shadow-sm !rounded-full\"\n            />\n\n             </div>\n\n        </div>\n    </ng-template>\n    <ng-template pTemplate=\"content\" let-files let-uploadedFiles=\"uploadedFiles\" let-removeFileCallback=\"removeFileCallback\" let-removeUploadedFileCallback=\"removeUploadedFileCallback\">\n\n        <div *ngIf=\"uploadedFiles?.length > 0\">\n\n        </div>\n    </ng-template>\n    <ng-template pTemplate=\"file\"> </ng-template>\n    <ng-template  pTemplate=\"empty\">\n        <div *ngIf=\" attachments?.length == 0\" class=\"border-2 border-dashed rounded-md p-4 bg-gray-50 hover:bg-gray-100 transition flex align-items-center justify-content-center flex-column\">\n            <i class=\"pi pi-cloud-upload border-2 rounded p-5 text-8xl text-400 border-400\"></i>\n            <!-- <p class=\"mt-4 mb-0\">Drag and drop files here to upload.</p> -->\n            <p class=\"mt-4 mb-0\">\u0627\u0633\u062D\u0628 \u0648\u0623\u0641\u0644\u0650\u062A \u0627\u0644\u0645\u0644\u0641\u0627\u062A \u0647\u0646\u0627 \u0644\u0644\u062A\u062D\u0645\u064A\u0644.</p>\n        </div>\n    </ng-template>\n</p-fileUpload>\n\n\n\n<div class=\"p-2 flex flex-wrap gap-4\">\n  <div\n    *ngFor=\"let file of attachments; let i = index\"\n    class=\"relative w-24 h-28 bg-white border rounded-lg shadow-sm flex flex-col items-center justify-center\"\n  >\n    <!-- File type label -->\n    <div\n      class=\"absolute top-0 left-0 px-2 py-0.5 text-[10px] font-bold uppercase rounded-br-md shadow-sm text-white\"\n      [ngClass]=\"getLabelClass(file.tiMt)\"\n    >\n      {{ getFileLabel(file.tiMt) }}\n    </div>\n\n    <!-- Remove button -->\n    <button\n      class=\"absolute top-1 right-1 text-red-500 hover:text-red-700\"\n      (click)=\"remove(i)\"\n      title=\"\u062D\u0630\u0641\"\n    >\n      <i class=\"pi pi-times text-xs\"></i>\n    </button>\n\n    <!-- Center icon -->\n    <i\n      [class]=\"getFileIcon(file.tiMt)\"\n      [ngClass]=\"getIconColor(file.tiMt)\"\n      class=\"!text-4xl text-center mt-5\"\n    ></i>\n\n    <!-- File name -->\n    <div class=\"mt-1 text-[11px] text-gray-600 truncate max-w-[85%] text-center\">\n      {{ file.tiNa }}\n    </div>\n\n    <!-- Download icon -->\n    <a\n      class=\"absolute bottom-1 right-1 text-gray-400 hover:text-blue-500\"\n      [href]=\"url+'/' + file.binaryObjectId\"\n      target=\"_blank\"\n      download\n      title=\"\u062A\u062D\u0645\u064A\u0644\"\n    >\n      <i class=\"pi pi-download text-xs\"></i>\n    </a>\n  </div>\n</div>\n</div>\n\n", dependencies: [{ kind: "ngmodule", type: FileUploadModule }, { kind: "component", type: i2$1.FileUpload, selector: "p-fileupload, p-fileUpload", inputs: ["name", "url", "method", "multiple", "accept", "disabled", "auto", "withCredentials", "maxFileSize", "invalidFileSizeMessageSummary", "invalidFileSizeMessageDetail", "invalidFileTypeMessageSummary", "invalidFileTypeMessageDetail", "invalidFileLimitMessageDetail", "invalidFileLimitMessageSummary", "style", "styleClass", "previewWidth", "chooseLabel", "uploadLabel", "cancelLabel", "chooseIcon", "uploadIcon", "cancelIcon", "showUploadButton", "showCancelButton", "mode", "headers", "customUpload", "fileLimit", "uploadStyleClass", "cancelStyleClass", "removeStyleClass", "chooseStyleClass", "chooseButtonProps", "uploadButtonProps", "cancelButtonProps", "files"], outputs: ["onBeforeUpload", "onSend", "onUpload", "onError", "onClear", "onRemove", "onSelect", "onProgress", "uploadHandler", "onImageError", "onRemoveUploadedFile"] }, { kind: "directive", type: i1$2.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "component", type: i3$1.Button, selector: "p-button", inputs: ["type", "iconPos", "icon", "badge", "label", "disabled", "loading", "loadingIcon", "raised", "rounded", "text", "plain", "severity", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "buttonProps", "autofocus", "fluid"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: FormsModule }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.4", type: AttachmentTypeComponent, isStandalone: true, selector: "attachment-type", providers: [MessageService], usesInheritance: true, ngImport: i0, template: "<p-fileUpload\n  name=\"file\"\n  [customUpload]=\"true\"\n  [auto]=\"true\"\n  [multiple]=\"props['multiple'] !== false\"\n  [maxFileSize]=\"maxFileSize\"\n  [accept]=\"props['accept'] || defaultAcceptTypes\"\n  (uploadHandler)=\"onUpload($event)\"\n  chooseLabel=\"\u0627\u0633\u062D\u0628 \u0627\u0644\u0645\u0644\u0641\u0627\u062A \u0623\u0648 \u0627\u0646\u0642\u0631 \u0644\u0644\u0625\u0631\u0641\u0627\u0642\"\n  class=\"w-full\"\n>\n  <!-- Header Template -->\n  <ng-template pTemplate=\"header\" let-chooseCallback=\"chooseCallback\">\n    <div class=\"flex flex-wrap justify-content-between align-items-center flex-1 gap-2\">\n      <div class=\"flex gap-2\">\n        <p-button\n          (click)=\"choose($event, chooseCallback)\"\n          icon=\"pi pi-plus\"\n          [rounded]=\"true\"\n          [outlined]=\"true\"\n          styleClass=\"border border-green-600 text-green-600 hover:bg-green-100 bg-white shadow-sm !rounded-full\"\n        ></p-button>\n      </div>\n    </div>\n  </ng-template>\n\n  <!-- Content Template -->\n  <ng-template pTemplate=\"content\">\n    <!-- Multi mode -->\n   <div class=\"p-2 flex flex-wrap gap-4\">\n  <div\n    *ngFor=\"let file of attachments; let i = index\"\n    class=\"relative w-24 h-28 bg-white border rounded-lg shadow-sm flex flex-col items-center justify-center\"\n  >\n    <!-- File type label -->\n    <div\n      class=\"absolute top-0 left-0 px-2 py-0.5 text-[10px] font-bold uppercase rounded-br-md shadow-sm text-white\"\n      [ngClass]=\"getLabelClass(file.mimeType)\"\n    >\n      {{ getFileLabel(file.mimeType) }}\n    </div>\n\n    <!-- Remove button -->\n    <button\n      class=\"absolute top-1 right-1 text-red-500 hover:text-red-700\"\n      (click)=\"remove(i)\"\n      title=\"\u062D\u0630\u0641\"\n    >\n      <i class=\"pi pi-times text-xs\"></i>\n    </button>\n\n    <!-- Center icon -->\n    <i\n      [class]=\"getFileIcon(file.mimeType)\"\n      [ngClass]=\"getIconColor(file.mimeType)\"\n      class=\"!text-4xl text-center mt-5\"\n    ></i>\n\n    <!-- File name -->\n    <div class=\"mt-1 text-[11px] text-gray-600 truncate max-w-[85%] text-center\">\n      {{ file.fileName }}\n    </div>\n\n    <!-- Download icon -->\n    <a\n      class=\"absolute bottom-1 right-1 text-gray-400 hover:text-blue-500\"\n      [href]=\"url+'/' + file.binaryObjectId\"\n      target=\"_blank\"\n      download\n      title=\"\u062A\u062D\u0645\u064A\u0644\"\n    >\n      <i class=\"pi pi-download text-xs\"></i>\n    </a>\n  </div>\n</div>\n\n    <!-- Single mode -->\n    <div *ngIf=\"props['multiple'] === false && attachment\">\n      <div class=\"flex items-center justify-between p-2 border-b\">\n        <span>{{ attachment.fileName }}</span>\n        <p-button\n          icon=\"pi pi-times\"\n          class=\"p-button-rounded p-button-text text-red-600\"\n          (click)=\"remove(0)\"\n        ></p-button>\n      </div>\n       <!-- Caption input if allowed -->\n      <div *ngIf=\"props['allowCaption']\" class=\"mt-1\">\n        <input\n        pInputText\n          type=\"text\"\n          class=\"w-full border rounded px-2 py-1 text-sm\"\n          placeholder=\"\u0623\u0636\u0641 \u0648\u0635\u0641\u0627\u064B\"\n          (change)=\"attachment = attachment\"\n          [(ngModel)]=\"attachment.caption\"\n        />\n      </div>\n    </div>\n  </ng-template>\n\n  <!-- Empty Template -->\n  <ng-template pTemplate=\"empty\">\n    <div\n      *ngIf=\"(props['multiple'] !== false && (!attachments || attachments.length === 0)) ||\n             (props['multiple'] === false && !attachment)\"\n      class=\"border-2 border-dashed rounded-md p-4 bg-gray-50 hover:bg-gray-100 transition flex align-items-center justify-content-center flex-column\"\n    >\n      <i class=\"pi pi-cloud-upload border-2 rounded p-5 text-8xl text-400 border-400\"></i>\n      <p class=\"mt-4 mb-0\">\u0627\u0633\u062D\u0628 \u0648\u0623\u0641\u0644\u0650\u062A \u0627\u0644\u0645\u0644\u0641\u0627\u062A \u0647\u0646\u0627 \u0644\u0644\u062A\u062D\u0645\u064A\u0644.</p>\n    </div>\n  </ng-template>\n</p-fileUpload>\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: FileUploadModule }, { kind: "component", type: i4.FileUpload, selector: "p-fileupload, p-fileUpload", inputs: ["name", "url", "method", "multiple", "accept", "disabled", "auto", "withCredentials", "maxFileSize", "invalidFileSizeMessageSummary", "invalidFileSizeMessageDetail", "invalidFileTypeMessageSummary", "invalidFileTypeMessageDetail", "invalidFileLimitMessageDetail", "invalidFileLimitMessageSummary", "style", "styleClass", "previewWidth", "chooseLabel", "uploadLabel", "cancelLabel", "chooseIcon", "uploadIcon", "cancelIcon", "showUploadButton", "showCancelButton", "mode", "headers", "customUpload", "fileLimit", "uploadStyleClass", "cancelStyleClass", "removeStyleClass", "chooseStyleClass", "chooseButtonProps", "uploadButtonProps", "cancelButtonProps", "files"], outputs: ["onBeforeUpload", "onSend", "onUpload", "onError", "onClear", "onRemove", "onSelect", "onProgress", "uploadHandler", "onImageError", "onRemoveUploadedFile"] }, { kind: "directive", type: i1$2.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "component", type: i3$1.Button, selector: "p-button", inputs: ["type", "iconPos", "icon", "badge", "label", "disabled", "loading", "loadingIcon", "raised", "rounded", "text", "plain", "severity", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "buttonProps", "autofocus", "fluid"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "ngmodule", type: InputTextModule }, { kind: "directive", type: i6.InputText, selector: "[pInputText]", inputs: ["pSize", "variant", "fluid", "invalid"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.4", ngImport: i0, type: AttachmentTypeComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'attachment-type', standalone: true, imports: [FileUploadModule, ButtonModule, ReactiveFormsModule, CommonModule, FormsModule], providers: [MessageService], template: "\n  <div class=\"panel\">\n  <p-fileUpload\n    name=\"file\"\n    [customUpload]=\"true\"\n    [auto]=\"true\"\n    [multiple]=\"true\"\n    [maxFileSize]=\"maxFileSize\"\n    accept=\".pdf,application/pdf,image/*,.txt,text/plain,application/vnd.openxmlformats-officedocument.spreadsheetml.sheet,application/vnd.ms-excel\"\n    (uploadHandler)=\"onUpload($event)\"\n    chooseLabel=\"\u0627\u0633\u062D\u0628 \u0627\u0644\u0645\u0644\u0641\u0627\u062A \u0623\u0648 \u0627\u0646\u0642\u0631 \u0644\u0644\u0625\u0631\u0641\u0627\u0642\"\n    class=\"w-full\"\n  >\n    <ng-template pTemplate=\"header\" let-files let-chooseCallback=\"chooseCallback\" let-clearCallback=\"clearCallback\" let-uploadCallback=\"uploadCallback\">\n        <div class=\"flex flex-wrap justify-content-between align-items-center flex-1 gap-2\">\n            <div class=\"flex gap-2\">\n              <p-button\n              (onClick)=\"choose($event, chooseCallback)\"\n              icon=\"pi pi-plus\"\n              [rounded]=\"true\"\n              [outlined]=\"true\"\n              styleClass=\"border border-green-600 text-green-600 hover:bg-green-100 bg-white shadow-sm !rounded-full\"\n            />\n\n             </div>\n\n        </div>\n    </ng-template>\n    <ng-template pTemplate=\"content\" let-files let-uploadedFiles=\"uploadedFiles\" let-removeFileCallback=\"removeFileCallback\" let-removeUploadedFileCallback=\"removeUploadedFileCallback\">\n\n        <div *ngIf=\"uploadedFiles?.length > 0\">\n\n        </div>\n    </ng-template>\n    <ng-template pTemplate=\"file\"> </ng-template>\n    <ng-template  pTemplate=\"empty\">\n        <div *ngIf=\" attachments?.length == 0\" class=\"border-2 border-dashed rounded-md p-4 bg-gray-50 hover:bg-gray-100 transition flex align-items-center justify-content-center flex-column\">\n            <i class=\"pi pi-cloud-upload border-2 rounded p-5 text-8xl text-400 border-400\"></i>\n            <!-- <p class=\"mt-4 mb-0\">Drag and drop files here to upload.</p> -->\n            <p class=\"mt-4 mb-0\">\u0627\u0633\u062D\u0628 \u0648\u0623\u0641\u0644\u0650\u062A \u0627\u0644\u0645\u0644\u0641\u0627\u062A \u0647\u0646\u0627 \u0644\u0644\u062A\u062D\u0645\u064A\u0644.</p>\n        </div>\n    </ng-template>\n</p-fileUpload>\n\n\n\n<div class=\"p-2 flex flex-wrap gap-4\">\n  <div\n    *ngFor=\"let file of attachments; let i = index\"\n    class=\"relative w-24 h-28 bg-white border rounded-lg shadow-sm flex flex-col items-center justify-center\"\n  >\n    <!-- File type label -->\n    <div\n      class=\"absolute top-0 left-0 px-2 py-0.5 text-[10px] font-bold uppercase rounded-br-md shadow-sm text-white\"\n      [ngClass]=\"getLabelClass(file.tiMt)\"\n    >\n      {{ getFileLabel(file.tiMt) }}\n    </div>\n\n    <!-- Remove button -->\n    <button\n      class=\"absolute top-1 right-1 text-red-500 hover:text-red-700\"\n      (click)=\"remove(i)\"\n      title=\"\u062D\u0630\u0641\"\n    >\n      <i class=\"pi pi-times text-xs\"></i>\n    </button>\n\n    <!-- Center icon -->\n    <i\n      [class]=\"getFileIcon(file.tiMt)\"\n      [ngClass]=\"getIconColor(file.tiMt)\"\n      class=\"!text-4xl text-center mt-5\"\n    ></i>\n\n    <!-- File name -->\n    <div class=\"mt-1 text-[11px] text-gray-600 truncate max-w-[85%] text-center\">\n      {{ file.tiNa }}\n    </div>\n\n    <!-- Download icon -->\n    <a\n      class=\"absolute bottom-1 right-1 text-gray-400 hover:text-blue-500\"\n      [href]=\"url+'/' + file.binaryObjectId\"\n      target=\"_blank\"\n      download\n      title=\"\u062A\u062D\u0645\u064A\u0644\"\n    >\n      <i class=\"pi pi-download text-xs\"></i>\n    </a>\n  </div>\n</div>\n</div>\n\n" }]
+            args: [{ selector: 'attachment-type', standalone: true, imports: [
+                        CommonModule,
+                        ReactiveFormsModule,
+                        FormsModule,
+                        FileUploadModule,
+                        ButtonModule,
+                        InputTextModule
+                    ], providers: [MessageService], template: "<p-fileUpload\n  name=\"file\"\n  [customUpload]=\"true\"\n  [auto]=\"true\"\n  [multiple]=\"props['multiple'] !== false\"\n  [maxFileSize]=\"maxFileSize\"\n  [accept]=\"props['accept'] || defaultAcceptTypes\"\n  (uploadHandler)=\"onUpload($event)\"\n  chooseLabel=\"\u0627\u0633\u062D\u0628 \u0627\u0644\u0645\u0644\u0641\u0627\u062A \u0623\u0648 \u0627\u0646\u0642\u0631 \u0644\u0644\u0625\u0631\u0641\u0627\u0642\"\n  class=\"w-full\"\n>\n  <!-- Header Template -->\n  <ng-template pTemplate=\"header\" let-chooseCallback=\"chooseCallback\">\n    <div class=\"flex flex-wrap justify-content-between align-items-center flex-1 gap-2\">\n      <div class=\"flex gap-2\">\n        <p-button\n          (click)=\"choose($event, chooseCallback)\"\n          icon=\"pi pi-plus\"\n          [rounded]=\"true\"\n          [outlined]=\"true\"\n          styleClass=\"border border-green-600 text-green-600 hover:bg-green-100 bg-white shadow-sm !rounded-full\"\n        ></p-button>\n      </div>\n    </div>\n  </ng-template>\n\n  <!-- Content Template -->\n  <ng-template pTemplate=\"content\">\n    <!-- Multi mode -->\n   <div class=\"p-2 flex flex-wrap gap-4\">\n  <div\n    *ngFor=\"let file of attachments; let i = index\"\n    class=\"relative w-24 h-28 bg-white border rounded-lg shadow-sm flex flex-col items-center justify-center\"\n  >\n    <!-- File type label -->\n    <div\n      class=\"absolute top-0 left-0 px-2 py-0.5 text-[10px] font-bold uppercase rounded-br-md shadow-sm text-white\"\n      [ngClass]=\"getLabelClass(file.mimeType)\"\n    >\n      {{ getFileLabel(file.mimeType) }}\n    </div>\n\n    <!-- Remove button -->\n    <button\n      class=\"absolute top-1 right-1 text-red-500 hover:text-red-700\"\n      (click)=\"remove(i)\"\n      title=\"\u062D\u0630\u0641\"\n    >\n      <i class=\"pi pi-times text-xs\"></i>\n    </button>\n\n    <!-- Center icon -->\n    <i\n      [class]=\"getFileIcon(file.mimeType)\"\n      [ngClass]=\"getIconColor(file.mimeType)\"\n      class=\"!text-4xl text-center mt-5\"\n    ></i>\n\n    <!-- File name -->\n    <div class=\"mt-1 text-[11px] text-gray-600 truncate max-w-[85%] text-center\">\n      {{ file.fileName }}\n    </div>\n\n    <!-- Download icon -->\n    <a\n      class=\"absolute bottom-1 right-1 text-gray-400 hover:text-blue-500\"\n      [href]=\"url+'/' + file.binaryObjectId\"\n      target=\"_blank\"\n      download\n      title=\"\u062A\u062D\u0645\u064A\u0644\"\n    >\n      <i class=\"pi pi-download text-xs\"></i>\n    </a>\n  </div>\n</div>\n\n    <!-- Single mode -->\n    <div *ngIf=\"props['multiple'] === false && attachment\">\n      <div class=\"flex items-center justify-between p-2 border-b\">\n        <span>{{ attachment.fileName }}</span>\n        <p-button\n          icon=\"pi pi-times\"\n          class=\"p-button-rounded p-button-text text-red-600\"\n          (click)=\"remove(0)\"\n        ></p-button>\n      </div>\n       <!-- Caption input if allowed -->\n      <div *ngIf=\"props['allowCaption']\" class=\"mt-1\">\n        <input\n        pInputText\n          type=\"text\"\n          class=\"w-full border rounded px-2 py-1 text-sm\"\n          placeholder=\"\u0623\u0636\u0641 \u0648\u0635\u0641\u0627\u064B\"\n          (change)=\"attachment = attachment\"\n          [(ngModel)]=\"attachment.caption\"\n        />\n      </div>\n    </div>\n  </ng-template>\n\n  <!-- Empty Template -->\n  <ng-template pTemplate=\"empty\">\n    <div\n      *ngIf=\"(props['multiple'] !== false && (!attachments || attachments.length === 0)) ||\n             (props['multiple'] === false && !attachment)\"\n      class=\"border-2 border-dashed rounded-md p-4 bg-gray-50 hover:bg-gray-100 transition flex align-items-center justify-content-center flex-column\"\n    >\n      <i class=\"pi pi-cloud-upload border-2 rounded p-5 text-8xl text-400 border-400\"></i>\n      <p class=\"mt-4 mb-0\">\u0627\u0633\u062D\u0628 \u0648\u0623\u0641\u0644\u0650\u062A \u0627\u0644\u0645\u0644\u0641\u0627\u062A \u0647\u0646\u0627 \u0644\u0644\u062A\u062D\u0645\u064A\u0644.</p>\n    </div>\n  </ng-template>\n</p-fileUpload>\n" }]
         }], ctorParameters: () => [{ type: i1$2.MessageService }] });
 
 class BreadcrumbComponent {
@@ -1512,7 +1556,7 @@ class BreadcrumbComponent {
         </li>
       </ul>
     </nav>
-  `, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: RouterModule }, { kind: "directive", type: i2$2.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }] });
+  `, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: RouterModule }, { kind: "directive", type: i2$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.4", ngImport: i0, type: BreadcrumbComponent, decorators: [{
             type: Component,
@@ -1753,7 +1797,7 @@ class ColumnSettingsPopoverComponent {
         return true;
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.4", ngImport: i0, type: ColumnSettingsPopoverComponent, deps: [{ token: i1$3.TranslateService }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.4", type: ColumnSettingsPopoverComponent, isStandalone: true, selector: "lib-column-settings-popover", inputs: { fixedColumns: "fixedColumns", toggleableColumns: "toggleableColumns", tableId: "tableId", selectedToggleableColumns: "selectedToggleableColumns" }, outputs: { selectedToggleableColumnsChange: "selectedToggleableColumnsChange" }, viewQueries: [{ propertyName: "op", first: true, predicate: ["op"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<p-popover #op appendTo=\"body\" styleClass=\"w-80\">\n\n\n\n\n    <!-- \u2B50 \u0645\u0631\u0628\u0639 \u0627\u062E\u062A\u064A\u0627\u0631 \"\u062A\u062D\u062F\u064A\u062F \u0627\u0644\u0643\u0644\" \u2B50 -->\n    <div class=\"flex items-center mb-3\">\n        <p-checkbox\n            [(ngModel)]=\"allColumnsSelected\"\n            [binary]=\"true\"\n            inputId=\"selectAllColumns\"\n        ></p-checkbox>\n        <label for=\"selectAllColumns\" class=\"ml-2 cursor-pointer font-medium text-color-secondary\">\n            {{ 'COMMON.SELECT_ALL' | translate }}\n        </label>\n    </div>\n\n    <p-orderList\n      [value]=\"_displayOrderListColumns\"\n      header=\"{{ 'COMMON.REORDER_AND_SELECT_COLUMNS' | translate }}\"\n      [listStyle]=\"{'height':'250px'}\"\n      [responsive]=\"true\"\n      [dragdrop]=\"true\"\n      (onReorder)=\"onOrderListReorder($event)\"\n      styleClass=\"w-full\"\n    >\n      <ng-template let-col pTemplate=\"item\">\n        <div class=\"p-2 border rounded-md flex items-center justify-between w-full\">\n          <!-- \u0645\u0631\u0628\u0639 \u0627\u062E\u062A\u064A\u0627\u0631 \u0644\u0644\u062A\u062D\u0643\u0645 \u0641\u064A \u0627\u0644\u0631\u0624\u064A\u0629 -->\n          <p-checkbox\n            [(ngModel)]=\"col.isSelected\"\n            (ngModelChange)=\"onColumnVisibilityChange(col)\"\n            [binary]=\"true\"\n            class=\"mr-4\"\n          ></p-checkbox>\n          <span class=\"flex-grow\">{{ col.header | translate }}</span>\n          <i class=\"pi pi-bars text-surface-400 cursor-grab\"></i> <!-- \u0623\u064A\u0642\u0648\u0646\u0629 \u0627\u0644\u0633\u062D\u0628 -->\n        </div>\n      </ng-template>\n    </p-orderList>\n\n\n</p-popover>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: FormsModule }, { 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: PopoverModule }, { kind: "component", type: i3$2.Popover, selector: "p-popover", inputs: ["ariaLabel", "ariaLabelledBy", "dismissable", "style", "styleClass", "appendTo", "autoZIndex", "ariaCloseLabel", "baseZIndex", "focusOnShow", "showTransitionOptions", "hideTransitionOptions"], outputs: ["onShow", "onHide"] }, { kind: "directive", type: i1$2.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "ngmodule", type: DividerModule }, { kind: "ngmodule", type: ButtonModule }, { kind: "ngmodule", type: TooltipModule }, { kind: "ngmodule", type: TranslateModule }, { kind: "ngmodule", type: OrderListModule }, { kind: "component", type: i5.OrderList, selector: "p-orderList, p-orderlist, p-order-list", inputs: ["header", "styleClass", "tabindex", "ariaLabel", "ariaLabelledBy", "listStyle", "responsive", "filterBy", "filterPlaceholder", "filterLocale", "metaKeySelection", "dragdrop", "controlsPosition", "ariaFilterLabel", "filterMatchMode", "breakpoint", "stripedRows", "disabled", "trackBy", "scrollHeight", "autoOptionFocus", "selection", "value", "buttonProps", "moveUpButtonProps", "moveTopButtonProps", "moveDownButtonProps", "moveBottomButtonProps"], outputs: ["selectionChange", "onReorder", "onSelectionChange", "onFilterEvent", "onFocus", "onBlur"] }, { kind: "ngmodule", type: CheckboxModule }, { kind: "component", type: i6.Checkbox, selector: "p-checkbox, p-checkBox, p-check-box", inputs: ["value", "binary", "ariaLabelledBy", "ariaLabel", "tabindex", "inputId", "inputStyle", "styleClass", "inputClass", "indeterminate", "formControl", "checkboxIcon", "readonly", "autofocus", "trueValue", "falseValue", "variant", "size"], outputs: ["onChange", "onFocus", "onBlur"] }, { kind: "pipe", type: i1$3.TranslatePipe, name: "translate" }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.4", type: ColumnSettingsPopoverComponent, isStandalone: true, selector: "lib-column-settings-popover", inputs: { fixedColumns: "fixedColumns", toggleableColumns: "toggleableColumns", tableId: "tableId", selectedToggleableColumns: "selectedToggleableColumns" }, outputs: { selectedToggleableColumnsChange: "selectedToggleableColumnsChange" }, viewQueries: [{ propertyName: "op", first: true, predicate: ["op"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<p-popover #op appendTo=\"body\" styleClass=\"w-80\">\n\n\n\n\n    <!-- \u2B50 \u0645\u0631\u0628\u0639 \u0627\u062E\u062A\u064A\u0627\u0631 \"\u062A\u062D\u062F\u064A\u062F \u0627\u0644\u0643\u0644\" \u2B50 -->\n    <div class=\"flex items-center mb-3\">\n        <p-checkbox\n            [(ngModel)]=\"allColumnsSelected\"\n            [binary]=\"true\"\n            inputId=\"selectAllColumns\"\n        ></p-checkbox>\n        <label for=\"selectAllColumns\" class=\"ml-2 cursor-pointer font-medium text-color-secondary\">\n            {{ 'COMMON.SELECT_ALL' | translate }}\n        </label>\n    </div>\n\n    <p-orderList\n      [value]=\"_displayOrderListColumns\"\n      header=\"{{ 'COMMON.REORDER_AND_SELECT_COLUMNS' | translate }}\"\n      [listStyle]=\"{'height':'250px'}\"\n      [responsive]=\"true\"\n      [dragdrop]=\"true\"\n      (onReorder)=\"onOrderListReorder($event)\"\n      styleClass=\"w-full\"\n    >\n      <ng-template let-col pTemplate=\"item\">\n        <div class=\"p-2 border rounded-md flex items-center justify-between w-full\">\n          <!-- \u0645\u0631\u0628\u0639 \u0627\u062E\u062A\u064A\u0627\u0631 \u0644\u0644\u062A\u062D\u0643\u0645 \u0641\u064A \u0627\u0644\u0631\u0624\u064A\u0629 -->\n          <p-checkbox\n            [(ngModel)]=\"col.isSelected\"\n            (ngModelChange)=\"onColumnVisibilityChange(col)\"\n            [binary]=\"true\"\n            class=\"mr-4\"\n          ></p-checkbox>\n          <span class=\"flex-grow\">{{ col.header | translate }}</span>\n          <i class=\"pi pi-bars text-surface-400 cursor-grab\"></i> <!-- \u0623\u064A\u0642\u0648\u0646\u0629 \u0627\u0644\u0633\u062D\u0628 -->\n        </div>\n      </ng-template>\n    </p-orderList>\n\n\n</p-popover>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: FormsModule }, { 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: PopoverModule }, { kind: "component", type: i3$2.Popover, selector: "p-popover", inputs: ["ariaLabel", "ariaLabelledBy", "dismissable", "style", "styleClass", "appendTo", "autoZIndex", "ariaCloseLabel", "baseZIndex", "focusOnShow", "showTransitionOptions", "hideTransitionOptions"], outputs: ["onShow", "onHide"] }, { kind: "directive", type: i1$2.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "ngmodule", type: DividerModule }, { kind: "ngmodule", type: ButtonModule }, { kind: "ngmodule", type: TooltipModule }, { kind: "ngmodule", type: TranslateModule }, { kind: "ngmodule", type: OrderListModule }, { kind: "component", type: i5.OrderList, selector: "p-orderList, p-orderlist, p-order-list", inputs: ["header", "styleClass", "tabindex", "ariaLabel", "ariaLabelledBy", "listStyle", "responsive", "filterBy", "filterPlaceholder", "filterLocale", "metaKeySelection", "dragdrop", "controlsPosition", "ariaFilterLabel", "filterMatchMode", "breakpoint", "stripedRows", "disabled", "trackBy", "scrollHeight", "autoOptionFocus", "selection", "value", "buttonProps", "moveUpButtonProps", "moveTopButtonProps", "moveDownButtonProps", "moveBottomButtonProps"], outputs: ["selectionChange", "onReorder", "onSelectionChange", "onFilterEvent", "onFocus", "onBlur"] }, { kind: "ngmodule", type: CheckboxModule }, { kind: "component", type: i6$1.Checkbox, selector: "p-checkbox, p-checkBox, p-check-box", inputs: ["value", "binary", "ariaLabelledBy", "ariaLabel", "tabindex", "inputId", "inputStyle", "styleClass", "inputClass", "indeterminate", "formControl", "checkboxIcon", "readonly", "autofocus", "trueValue", "falseValue", "variant", "size"], outputs: ["onChange", "onFocus", "onBlur"] }, { kind: "pipe", type: i1$3.TranslatePipe, name: "translate" }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.4", ngImport: i0, type: ColumnSettingsPopoverComponent, decorators: [{
             type: Component,
@@ -2307,7 +2351,7 @@ class UsernameWithDomainComponent extends FieldType {
  [formlyAttributes]="field"
  (blur)="onBlur()"
  />
-  `, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: InputTextModule }, { kind: "directive", type: i7.InputText, selector: "[pInputText]", inputs: ["pSize", "variant", "fluid", "invalid"] }, { kind: "ngmodule", type: InputGroupModule }, { kind: "ngmodule", type: // ✅ إضافة InputGroupModule
+  `, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: InputTextModule }, { kind: "directive", type: i6.InputText, selector: "[pInputText]", inputs: ["pSize", "variant", "fluid", "invalid"] }, { kind: "ngmodule", type: InputGroupModule }, { kind: "ngmodule", type: // ✅ إضافة InputGroupModule
                 InputGroupAddonModule }, { kind: "directive", type: // ✅ إضافة InputGroupAddonModule
                 FormlyAttributes, selector: "[formlyAttributes]", inputs: ["formlyAttributes", "id"] }] });
 }
@@ -2754,7 +2798,7 @@ class GenericCard {
         return item.id || index;
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.4", ngImport: i0, type: GenericCard, deps: [{ token: i1$3.TranslateService }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.4", type: GenericCard, isStandalone: true, selector: "lib-generic-card", inputs: { data: "data", columns: "columns", loading: "loading", actions: "actions", actionsMode: "actionsMode", showOperations: "showOperations", rowSelectable: "rowSelectable", showRowSelectionCheckbox: "showRowSelectionCheckbox", paginator: "paginator", rowClassFn: "rowClassFn", selection: "selection" }, outputs: { action: "action", selectionChange: "selectionChange", rowSelect: "rowSelect" }, ngImport: i0, template: "\n<div class=\"p-4 p-4 flex flex-col gap-6 font-inter\">\n  <div *ngIf=\"loading\" class=\"col-span-full text-center py-8\">\n    <div class=\"animate-spin rounded-full h-12 w-12 border-b-2 border-blue-500 inline-block\"></div>\n    <p class=\"mt-4 text-gray-600\">Loading data...</p>\n  </div>\n\n  <div *ngIf=\"!loading && data.length === 0\" class=\"col-span-full text-center py-8 text-gray-500\">\n    No records found.\n  </div>\n\n  <div *ngFor=\"let item of data; trackBy: trackById\"\n       [ngClass]=\"rowClassFn(item)\"\n       class=\"bg-white rounded-lg shadow-md hover:shadow-lg transition-shadow duration-300 overflow-hidden flex flex-row items-center\"\n       (click)=\"handleCardClick(item)\"\n       [class.cursor-pointer]=\"rowSelectable && !showRowSelectionCheckbox\">\n\n    <div *ngIf=\"showRowSelectionCheckbox\" class=\"p-4\">\n      <input type=\"checkbox\"\n             [checked]=\"isItemSelected(item)\"\n             (change)=\"toggleItemSelection(item, $event)\"\n             class=\"form-checkbox h-5 w-5 text-blue-600 rounded focus:ring-blue-500\">\n    </div>\n\n    <div class=\"p-6 flex-grow\">\n      <div class=\"flex flex-wrap -mx-2\">\n        <ng-container *ngFor=\"let col of columns\">\n        <div *ngIf=\"col.isCardVisible\" class=\"px-2 mb-2 w-full sm:w-1/5\">\n          <div class=\"flex flex-col sm:flex-row sm:items-center text-sm\">\n            <span class=\"font-semibold text-gray-700 sm:w-1/3 sm:min-w-[80px] sm:pr-2\">{{ col.header | translate }}:</span>\n            <div class=\"flex-grow text-gray-800 text-left mt-1 sm:mt-0\">\n              <ng-container *ngIf=\"col.clickable; else readonlyCardCell\">\n                <span class=\"cursor-pointer hover:underline text-blue-600\"\n                      (click)=\"handleCellClick(col, item, $event)\"\n                      (mouseenter)=\"col.hoverable && onCellHover(col, item, $event)\"\n                      (mouseleave)=\"col.hoverable && onCellLeave(col, item, $event)\">\n                  <ng-container *ngIf=\"col.formatter; else defaultCardText\">\n                    <span [innerHTML]=\"col.formatter(item)\"></span>\n                  </ng-container>\n                  <ng-template #defaultCardText>\n                    {{ col.pipe ? col.pipe(item[col.field]) : item[col.field] }}\n                  </ng-template>\n                </span>\n              </ng-container>\n\n              <ng-template #readonlyCardCell>\n                <span>\n                  <ng-container *ngIf=\"col.formatter; else defaultCardText2\">\n                    <span [innerHTML]=\"col.formatter(item)\"></span>\n                  </ng-container>\n                  <ng-template #defaultCardText2>\n                    {{ col.pipe ? col.pipe(item[col.field]) : item[col.field] }}\n                  </ng-template>\n                </span>\n              </ng-template>\n            </div>\n          </div>\n        </div>\n        </ng-container>\n      </div>\n\n    </div>\n\n    <div *ngIf=\"showOperations && actions.length > 0\" class=\"border-l border-gray-200 p-4 flex justify-end items-center\">\n        <ng-container *ngIf=\"actionsMode === 'buttons'; else cardMenuTpl\">\n            <ng-container *ngFor=\"let act of actions\">\n                <button\n                    pButton\n                    type=\"button\"\n                    [icon]=\"act.icon || ''\"\n                    [title]=\"act.label?? '' | translate\"\n                    class=\"p-button-rounded p-button-text text-gray-600 hover:text-blue-600 custom-button-medium mr-1\"\n                    [ngClass]=\"act.styleClass\"\n                    (click)=\"action.emit({ name: act.name, row: item })\"\n                ></button>\n            </ng-container>\n        </ng-container>\n\n        <ng-template #cardMenuTpl>\n            <p-menu\n                #cardMenu\n                [model]=\"getMenuItems(item)\"\n                popup=\"true\"\n                appendTo=\"body\">\n            </p-menu>\n            <button\n                pButton\n                type=\"button\"\n                icon=\"pi pi-ellipsis-v\"\n                class=\"p-button-rounded p-button-text text-gray-600 hover:text-blue-600\"\n                (click)=\"cardMenu.toggle($event)\">\n            </button>\n        </ng-template>\n    </div>\n  </div>\n</div>\n", styles: [".custom-button-medium{width:2.5rem;height:2.5rem}.icon-delete{color:#ef4444}.icon-edit{color:#2563eb}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "directive", type: i3$1.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "loading", "severity", "raised", "rounded", "text", "outlined", "size", "plain", "fluid", "label", "icon", "buttonProps"] }, { kind: "ngmodule", type: MenuModule }, { kind: "component", type: i4.Menu, selector: "p-menu", inputs: ["model", "popup", "style", "styleClass", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "ariaLabel", "ariaLabelledBy", "id", "tabindex", "appendTo"], outputs: ["onShow", "onHide", "onBlur", "onFocus"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "ngmodule", type: FormsModule }, { kind: "pipe", type: i1$3.TranslatePipe, name: "translate" }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.4", type: GenericCard, isStandalone: true, selector: "lib-generic-card", inputs: { data: "data", columns: "columns", loading: "loading", actions: "actions", actionsMode: "actionsMode", showOperations: "showOperations", rowSelectable: "rowSelectable", showRowSelectionCheckbox: "showRowSelectionCheckbox", paginator: "paginator", rowClassFn: "rowClassFn", selection: "selection" }, outputs: { action: "action", selectionChange: "selectionChange", rowSelect: "rowSelect" }, ngImport: i0, template: "\n<div class=\"p-4 p-4 flex flex-col gap-6 font-inter\">\n  <div *ngIf=\"loading\" class=\"col-span-full text-center py-8\">\n    <div class=\"animate-spin rounded-full h-12 w-12 border-b-2 border-blue-500 inline-block\"></div>\n    <p class=\"mt-4 text-gray-600\">Loading data...</p>\n  </div>\n\n  <div *ngIf=\"!loading && data.length === 0\" class=\"col-span-full text-center py-8 text-gray-500\">\n    No records found.\n  </div>\n\n  <div *ngFor=\"let item of data; trackBy: trackById\"\n       [ngClass]=\"rowClassFn(item)\"\n       class=\"bg-white rounded-lg shadow-md hover:shadow-lg transition-shadow duration-300 overflow-hidden flex flex-row items-center\"\n       (click)=\"handleCardClick(item)\"\n       [class.cursor-pointer]=\"rowSelectable && !showRowSelectionCheckbox\">\n\n    <div *ngIf=\"showRowSelectionCheckbox\" class=\"p-4\">\n      <input type=\"checkbox\"\n             [checked]=\"isItemSelected(item)\"\n             (change)=\"toggleItemSelection(item, $event)\"\n             class=\"form-checkbox h-5 w-5 text-blue-600 rounded focus:ring-blue-500\">\n    </div>\n\n    <div class=\"p-6 flex-grow\">\n      <div class=\"flex flex-wrap -mx-2\">\n        <ng-container *ngFor=\"let col of columns\">\n        <div *ngIf=\"col.isCardVisible\" class=\"px-2 mb-2 w-full sm:w-1/5\">\n          <div class=\"flex flex-col sm:flex-row sm:items-center text-sm\">\n            <span class=\"font-semibold text-gray-700 sm:w-1/3 sm:min-w-[80px] sm:pr-2\">{{ col.header | translate }}:</span>\n            <div class=\"flex-grow text-gray-800 text-left mt-1 sm:mt-0\">\n              <ng-container *ngIf=\"col.clickable; else readonlyCardCell\">\n                <span class=\"cursor-pointer hover:underline text-blue-600\"\n                      (click)=\"handleCellClick(col, item, $event)\"\n                      (mouseenter)=\"col.hoverable && onCellHover(col, item, $event)\"\n                      (mouseleave)=\"col.hoverable && onCellLeave(col, item, $event)\">\n                  <ng-container *ngIf=\"col.formatter; else defaultCardText\">\n                    <span [innerHTML]=\"col.formatter(item)\"></span>\n                  </ng-container>\n                  <ng-template #defaultCardText>\n                    {{ col.pipe ? col.pipe(item[col.field]) : item[col.field] }}\n                  </ng-template>\n                </span>\n              </ng-container>\n\n              <ng-template #readonlyCardCell>\n                <span>\n                  <ng-container *ngIf=\"col.formatter; else defaultCardText2\">\n                    <span [innerHTML]=\"col.formatter(item)\"></span>\n                  </ng-container>\n                  <ng-template #defaultCardText2>\n                    {{ col.pipe ? col.pipe(item[col.field]) : item[col.field] }}\n                  </ng-template>\n                </span>\n              </ng-template>\n            </div>\n          </div>\n        </div>\n        </ng-container>\n      </div>\n\n    </div>\n\n    <div *ngIf=\"showOperations && actions.length > 0\" class=\"border-l border-gray-200 p-4 flex justify-end items-center\">\n        <ng-container *ngIf=\"actionsMode === 'buttons'; else cardMenuTpl\">\n            <ng-container *ngFor=\"let act of actions\">\n                <button\n                    pButton\n                    type=\"button\"\n                    [icon]=\"act.icon || ''\"\n                    [title]=\"act.label?? '' | translate\"\n                    class=\"p-button-rounded p-button-text text-gray-600 hover:text-blue-600 custom-button-medium mr-1\"\n                    [ngClass]=\"act.styleClass\"\n                    (click)=\"action.emit({ name: act.name, row: item })\"\n                ></button>\n            </ng-container>\n        </ng-container>\n\n        <ng-template #cardMenuTpl>\n            <p-menu\n                #cardMenu\n                [model]=\"getMenuItems(item)\"\n                popup=\"true\"\n                appendTo=\"body\">\n            </p-menu>\n            <button\n                pButton\n                type=\"button\"\n                icon=\"pi pi-ellipsis-v\"\n                class=\"p-button-rounded p-button-text text-gray-600 hover:text-blue-600\"\n                (click)=\"cardMenu.toggle($event)\">\n            </button>\n        </ng-template>\n    </div>\n  </div>\n</div>\n", styles: [".custom-button-medium{width:2.5rem;height:2.5rem}.icon-delete{color:#ef4444}.icon-edit{color:#2563eb}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "directive", type: i3$1.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "loading", "severity", "raised", "rounded", "text", "outlined", "size", "plain", "fluid", "label", "icon", "buttonProps"] }, { kind: "ngmodule", type: MenuModule }, { kind: "component", type: i4$1.Menu, selector: "p-menu", inputs: ["model", "popup", "style", "styleClass", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "ariaLabel", "ariaLabelledBy", "id", "tabindex", "appendTo"], outputs: ["onShow", "onHide", "onBlur", "onFocus"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "ngmodule", type: FormsModule }, { kind: "pipe", type: i1$3.TranslatePipe, name: "translate" }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.4", ngImport: i0, type: GenericCard, decorators: [{
             type: Component,
@@ -2960,7 +3004,7 @@ class GenericSearch {
         this.search.emit(this.model);
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.4", ngImport: i0, type: GenericSearch, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.4", type: GenericSearch, isStandalone: true, selector: "lib-generic-search", inputs: { placeholder: "placeholder", model: "model", fields: "fields" }, outputs: { search: "search" }, viewQueries: [{ propertyName: "overlay", first: true, predicate: ["overlay"], descendants: true }], ngImport: i0, template: "<div class=\"flex items-center gap-3\">\n<p-iconfield iconPosition=\"left\">\n\n          <p-inputicon class=\"pi pi-search\"> </p-inputicon>\n                <input pInputText type=\"text\" (keyup.enter)=\"onSubmit()\" [(ngModel)]=\"model['filter']\" placeholder=\"{{ 'SEARCH' | translate }}\" />\n  <!-- 2) Search Button that toggles the popover -->\n\n</p-iconfield>\n<p-button icon=\"pi pi-filter\" outlined severity=\"secondary\" (onClick)=\"overlay.toggle($event)\" />\n</div>\n<!-- 4) Popover for Advanced Multi-field Search -->\n<p-popover #overlay [dismissable]=\"true\"  styleClass=\"p-4 w-80\">\n\n  <form [formGroup]=\"form\" (ngSubmit)=\"onSubmit(); overlay.hide()\">\n    <formly-form\n      [form]=\"form\"\n      [fields]=\"fields_\"\n      [model]=\"model\"\n      [options]=\"options\">\n    </formly-form>\n\n    <div class=\"flex justify-end mt-4 space-x-2\">\n      <button type=\"submit\" pButton size=\"small\" label=\"{{ 'SEARCH' | translate }}\"></button>\n      <button type=\"button\" pButton size=\"small\" class=\"p-button-text\" (click)=\"onReset(); overlay.hide()\">\n        {{ 'CLEAR' | translate }}\n      </button>\n    </div>\n  </form>\n\n</p-popover>\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: FormlyForm, selector: "formly-form", inputs: ["form", "model", "fields", "options"], outputs: ["modelChange"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "ngmodule", type: ToolbarModule }, { kind: "ngmodule", type: ButtonModule }, { kind: "directive", type: i3$1.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "loading", "severity", "raised", "rounded", "text", "outlined", "size", "plain", "fluid", "label", "icon", "buttonProps"] }, { kind: "component", type: i3$1.Button, selector: "p-button", inputs: ["type", "iconPos", "icon", "badge", "label", "disabled", "loading", "loadingIcon", "raised", "rounded", "text", "plain", "severity", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "buttonProps", "autofocus", "fluid"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: PopoverModule }, { kind: "component", type: i3$2.Popover, selector: "p-popover", inputs: ["ariaLabel", "ariaLabelledBy", "dismissable", "style", "styleClass", "appendTo", "autoZIndex", "ariaCloseLabel", "baseZIndex", "focusOnShow", "showTransitionOptions", "hideTransitionOptions"], outputs: ["onShow", "onHide"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: InputIconModule }, { kind: "component", type: i4$1.InputIcon, selector: "p-inputicon, p-inputIcon", inputs: ["styleClass"] }, { kind: "ngmodule", type: IconFieldModule }, { kind: "component", type: i5$1.IconField, selector: "p-iconfield, p-iconField, p-icon-field", inputs: ["iconPosition", "styleClass"] }, { kind: "ngmodule", type: InputTextModule }, { kind: "directive", type: i7.InputText, selector: "[pInputText]", inputs: ["pSize", "variant", "fluid", "invalid"] }, { kind: "pipe", type: i1$3.TranslatePipe, name: "translate" }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.4", type: GenericSearch, isStandalone: true, selector: "lib-generic-search", inputs: { placeholder: "placeholder", model: "model", fields: "fields" }, outputs: { search: "search" }, viewQueries: [{ propertyName: "overlay", first: true, predicate: ["overlay"], descendants: true }], ngImport: i0, template: "<div class=\"flex items-center gap-3\">\n<p-iconfield iconPosition=\"left\">\n\n          <p-inputicon class=\"pi pi-search\"> </p-inputicon>\n                <input pInputText type=\"text\" (keyup.enter)=\"onSubmit()\" [(ngModel)]=\"model['filter']\" placeholder=\"{{ 'SEARCH' | translate }}\" />\n  <!-- 2) Search Button that toggles the popover -->\n\n</p-iconfield>\n<p-button icon=\"pi pi-filter\" outlined severity=\"secondary\" (onClick)=\"overlay.toggle($event)\" />\n</div>\n<!-- 4) Popover for Advanced Multi-field Search -->\n<p-popover #overlay [dismissable]=\"true\"  styleClass=\"p-4 w-80\">\n\n  <form [formGroup]=\"form\" (ngSubmit)=\"onSubmit(); overlay.hide()\">\n    <formly-form\n      [form]=\"form\"\n      [fields]=\"fields_\"\n      [model]=\"model\"\n      [options]=\"options\">\n    </formly-form>\n\n    <div class=\"flex justify-end mt-4 space-x-2\">\n      <button type=\"submit\" pButton size=\"small\" label=\"{{ 'SEARCH' | translate }}\"></button>\n      <button type=\"button\" pButton size=\"small\" class=\"p-button-text\" (click)=\"onReset(); overlay.hide()\">\n        {{ 'CLEAR' | translate }}\n      </button>\n    </div>\n  </form>\n\n</p-popover>\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: FormlyForm, selector: "formly-form", inputs: ["form", "model", "fields", "options"], outputs: ["modelChange"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "ngmodule", type: ToolbarModule }, { kind: "ngmodule", type: ButtonModule }, { kind: "directive", type: i3$1.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "loading", "severity", "raised", "rounded", "text", "outlined", "size", "plain", "fluid", "label", "icon", "buttonProps"] }, { kind: "component", type: i3$1.Button, selector: "p-button", inputs: ["type", "iconPos", "icon", "badge", "label", "disabled", "loading", "loadingIcon", "raised", "rounded", "text", "plain", "severity", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "buttonProps", "autofocus", "fluid"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: PopoverModule }, { kind: "component", type: i3$2.Popover, selector: "p-popover", inputs: ["ariaLabel", "ariaLabelledBy", "dismissable", "style", "styleClass", "appendTo", "autoZIndex", "ariaCloseLabel", "baseZIndex", "focusOnShow", "showTransitionOptions", "hideTransitionOptions"], outputs: ["onShow", "onHide"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: InputIconModule }, { kind: "component", type: i4$2.InputIcon, selector: "p-inputicon, p-inputIcon", inputs: ["styleClass"] }, { kind: "ngmodule", type: IconFieldModule }, { kind: "component", type: i5$1.IconField, selector: "p-iconfield, p-iconField, p-icon-field", inputs: ["iconPosition", "styleClass"] }, { kind: "ngmodule", type: InputTextModule }, { kind: "directive", type: i6.InputText, selector: "[pInputText]", inputs: ["pSize", "variant", "fluid", "invalid"] }, { kind: "pipe", type: i1$3.TranslatePipe, name: "translate" }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.4", ngImport: i0, type: GenericSearch, decorators: [{
             type: Component,
@@ -3133,7 +3177,7 @@ class GenericTable {
         }
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.4", ngImport: i0, type: GenericTable, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.4", type: GenericTable, isStandalone: true, selector: "lib-generic-table", inputs: { data: "data", columns: "columns", loading: "loading", actions: "actions", actionsMode: "actionsMode", first: "first", rows: "rows", totalRecords: "totalRecords", sortField: "sortField", sortOrder: "sortOrder", globalFilterFields: "globalFilterFields", scrollHeight: "scrollHeight", rowSelectable: "rowSelectable", selection: "selection", paginator: "paginator", showRowSelectionCheckbox: "showRowSelectionCheckbox" }, outputs: { action: "action", pageChange: "pageChange", rowSelect: "rowSelect", selectionChange: "selectionChange" }, viewQueries: [{ propertyName: "dt", first: true, predicate: ["dt"], descendants: true }], ngImport: i0, template: "\r\n<div class=\"flex-1 last:[&>td]:border-0 rounded-lg border border-surface w-full overflow-auto\">\r\n  <p-table #dt\r\n  [value]=\"data\"\r\n  [columns]=\"columns\"\r\n  [lazy]=\"true\"\r\n  [paginator]=\"paginator\"\r\n  [rows]=\"rows\"\r\n  [first]=\"first\"\r\n    [totalRecords]=\"totalRecords\"\r\n    [sortField]=\"sortField\"\r\n    [sortOrder]=\"sortOrder\" (onLazyLoad)=\"onLazyLoad($event)\"\r\n    [globalFilterFields]=\"globalFilterFields\"\r\n    [loading]=\"loading\"\r\n    [scrollable]=\"true\"\r\n    [scrollHeight]=\"scrollHeight\"\r\n    [selectionMode]=\"showRowSelectionCheckbox ? 'multiple' : (rowSelectable ? 'single' : undefined)\"\r\n    [(selection)]=\"_selection\"\r\n    (onRowSelect)=\"onInternalSelectionChange($event)\"\r\n    (onRowUnselect)=\"onInternalSelectionChange($event)\"\r\n    (onHeaderCheckboxToggle)=\"onInternalSelectionChange($event)\"\r\n    tableLayout=\"fixed\"\r\n    [customSort]=\"false\"\r\n    (sortFunction)=\"customSort($event)\"\r\n    >\r\n\r\n    <ng-template pTemplate=\"header\" let-columns>\r\n      <tr>\r\n          <th *ngIf=\"showRowSelectionCheckbox\" style=\"width: 2rem\">\r\n        <p-tableHeaderCheckbox></p-tableHeaderCheckbox>\r\n      </th>\r\n        <!-- <th style=\"width: 1rem\">\r\n          <p-tableHeaderCheckbox />\r\n        </th> -->\r\n\r\n       <ng-container *ngFor=\"let col of columns\" >\r\n  <th *ngIf=\"col.props?.table?.props?.width; else templateName\" [pSortableColumn]=\"col.key\"\r\n      class=\"px-4 py-2 text-sm font-medium text-white text-center\"\r\n      [style.min-width]=\"col.props?.table?.props?.width\">\r\n    {{ col.props?.label | translate }}\r\n    <p-sortIcon [field]=\"col.key\"></p-sortIcon>\r\n  </th>\r\n\r\n  <ng-template #templateName>\r\n    <th class=\"px-4 py-2 text-sm font-medium text-white text-center\">\r\n      {{ col.props?.label | translate }}\r\n      <p-sortIcon [field]=\"col.key\"></p-sortIcon>\r\n    </th>\r\n  </ng-template>\r\n</ng-container>\r\n\r\n\r\n        <th class=\"px-4 py-2 text-sm font-medium text-white text-center\"> {{ 'OPERATIONS' | translate }}</th>\r\n      </tr>\r\n    </ng-template>\r\n\r\n    <ng-template pTemplate=\"body\" let-rowData let-columns=\"columns\" let-i=\"rowIndex\">\r\n      <tr class=\"even:bg-gray-50 hover:bg-gray-100\" (click)=\"rowSelect.emit(rowData)\">\r\n        <!-- <td style=\"width: 1rem\">\r\n          <p-tableCheckbox [value]=\"rowData\" />\r\n        </td> -->\r\n        <td *ngIf=\"showRowSelectionCheckbox\" style=\"width: 2rem\">\r\n        <p-tableCheckbox [value]=\"rowData\"></p-tableCheckbox>\r\n      </td>\r\n        <td *ngFor=\"let col of columns_ ; let colIndex = index\"\r\n    class=\"border-t border-gray-200 px-4 py-2 text-center text-sm text-gray-700\"\r\n     [style.width]=\"col.props && col.props['table']\r\n     && col.props['table']['props'] && col.props['table']['props']['width'] \"\r\n\r\n     >\r\n\r\n\r\n <!-- \u0625\u0630\u0627 \u0627\u0644\u0639\u0645\u0648\u062F \u0642\u0627\u0628\u0644 \u0644\u0644\u0646\u0642\u0631 -->\r\n\r\n      <formly-form\r\n      [model]=\"rowData\"\r\n      [form]=\"getForm(i, colIndex)\"\r\n      [fields]=\"[cloneField(col)]\"\r\n      [options]=\"options\">\r\n    </formly-form>\r\n\r\n        </td>\r\n        <td class=\"border-t border-gray-200 px-4 py-2 text-center align-middle\">\r\n          <ng-container [ngSwitch]=\"actionsMode\">\r\n                  <!-- Render buttons -->\r\n                  <ng-container *ngSwitchCase=\"'buttons'\">\r\n                    <ng-container *ngFor=\"let act of actions\">\r\n                      <button\r\n                        *ngIf=\"act.icon || act.label\"\r\n                        pButton\r\n                        [icon]=\"act.icon || ''\"\r\n                        [label]=\"(act.label  || '') | translate\"\r\n                        [class]=\"act.styleClass || ''\"\r\n                        class=\"p-button-sm mx-1\"\r\n                        (click)=\"onAction(act, rowData)\"\r\n                      ></button>\r\n                    </ng-container>\r\n                  </ng-container>\r\n\r\n                  <!-- Render menu -->\r\n                  <ng-container *ngSwitchCase=\"'menu'\">\r\n                     <p-menu #menu [model]=\"getMenuItems(rowData)\" [popup]=\"true\" appendTo=\"body\">\r\n                    <ng-template let-item pTemplate=\"item\">\r\n                      <div class=\"flex items-center gap-2 px-2 py-1\">\r\n                        <i [ngClass]=\"item.icon\" class=\"text-primary-600\" *ngIf=\"item.icon\"></i>\r\n                        <span class=\"font-medium\">{{ (item.label  || '') | translate }}</span>\r\n\r\n                        <span *ngIf=\"item.badge\" class=\"ml-auto text-xs bg-red-500 text-white px-2 py-1 rounded\">\r\n                          {{ item.badge }}\r\n                        </span>\r\n\r\n                        <!-- <p-inputSwitch *ngIf=\"item.toggle\" [(ngModel)]=\"item.toggleValue\" class=\"ml-auto\" /> -->\r\n                      </div>\r\n                    </ng-template>\r\n                  </p-menu>\r\n\r\n                    <p-button\r\n                    outlined\r\n                      icon=\"pi pi-ellipsis-v\"\r\n                      class=\"p-button-text p-button-sm\"\r\n                      (onClick)=\"menu.toggle($event)\"\r\n                    ></p-button>\r\n                  </ng-container>\r\n                </ng-container>\r\n\r\n        </td>\r\n      </tr>\r\n    </ng-template>\r\n  </p-table>\r\n\r\n</div>\r\n", styles: [".custom-button-medium{font-size:1.1rem;width:2.5rem;height:2.5rem;line-height:2.5rem;padding:0}.custom-button-gray{color:#333;background-color:transparent;border:none}.custom-button-gray:hover{background-color:#eee;color:#000}.icon-delete{color:red!important}.icon-edit{color:#333}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "ngmodule", type: TableModule }, { kind: "component", type: i2$3.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "styleClass", "tableStyle", "tableStyleClass", "paginator", "pageLinks", "rowsPerPageOptions", "alwaysShowPaginator", "paginatorPosition", "paginatorStyleClass", "paginatorDropdownAppendTo", "paginatorDropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showJumpToPageDropdown", "showJumpToPageInput", "showFirstLastIcon", "showPageLinks", "defaultSortOrder", "sortMode", "resetPageOnSort", "selectionMode", "selectionPageOnly", "contextMenuSelection", "contextMenuSelectionMode", "dataKey", "metaKeySelection", "rowSelectable", "rowTrackBy", "lazy", "lazyLoadOnInit", "compareSelectionBy", "csvSeparator", "exportFilename", "filters", "globalFilterFields", "filterDelay", "filterLocale", "expandedRowKeys", "editingRowKeys", "rowExpandMode", "scrollable", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "size", "showGridlines", "stripedRows", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "selectAll"], outputs: ["contextMenuSelectionChange", "selectAllChange", "selectionChange", "onRowSelect", "onRowUnselect", "onPage", "onSort", "onFilter", "onLazyLoad", "onRowExpand", "onRowCollapse", "onContextMenuSelect", "onColResize", "onColReorder", "onRowReorder", "onEditInit", "onEditComplete", "onEditCancel", "onHeaderCheckboxToggle", "sortFunction", "firstChange", "rowsChange", "onStateSave", "onStateRestore"] }, { kind: "directive", type: i1$2.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "directive", type: i2$3.SortableColumn, selector: "[pSortableColumn]", inputs: ["pSortableColumn", "pSortableColumnDisabled"] }, { kind: "component", type: i2$3.SortIcon, selector: "p-sortIcon", inputs: ["field"] }, { kind: "component", type: i2$3.TableCheckbox, selector: "p-tableCheckbox", inputs: ["value", "disabled", "required", "index", "inputId", "name", "ariaLabel"] }, { kind: "component", type: i2$3.TableHeaderCheckbox, selector: "p-tableHeaderCheckbox", inputs: ["disabled", "inputId", "name", "ariaLabel"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "directive", type: i3$1.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "loading", "severity", "raised", "rounded", "text", "outlined", "size", "plain", "fluid", "label", "icon", "buttonProps"] }, { kind: "component", type: i3$1.Button, selector: "p-button", inputs: ["type", "iconPos", "icon", "badge", "label", "disabled", "loading", "loadingIcon", "raised", "rounded", "text", "plain", "severity", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "buttonProps", "autofocus", "fluid"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "ngmodule", type: MenuModule }, { kind: "component", type: i4.Menu, selector: "p-menu", inputs: ["model", "popup", "style", "styleClass", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "ariaLabel", "ariaLabelledBy", "id", "tabindex", "appendTo"], outputs: ["onShow", "onHide", "onBlur", "onFocus"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "component", type: FormlyForm, selector: "formly-form", inputs: ["form", "model", "fields", "options"], outputs: ["modelChange"] }, { kind: "pipe", type: i1$3.TranslatePipe, name: "translate" }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.4", type: GenericTable, isStandalone: true, selector: "lib-generic-table", inputs: { data: "data", columns: "columns", loading: "loading", actions: "actions", actionsMode: "actionsMode", first: "first", rows: "rows", totalRecords: "totalRecords", sortField: "sortField", sortOrder: "sortOrder", globalFilterFields: "globalFilterFields", scrollHeight: "scrollHeight", rowSelectable: "rowSelectable", selection: "selection", paginator: "paginator", showRowSelectionCheckbox: "showRowSelectionCheckbox" }, outputs: { action: "action", pageChange: "pageChange", rowSelect: "rowSelect", selectionChange: "selectionChange" }, viewQueries: [{ propertyName: "dt", first: true, predicate: ["dt"], descendants: true }], ngImport: i0, template: "\r\n<div class=\"flex-1 last:[&>td]:border-0 rounded-lg border border-surface w-full overflow-auto\">\r\n  <p-table #dt\r\n  [value]=\"data\"\r\n  [columns]=\"columns\"\r\n  [lazy]=\"true\"\r\n  [paginator]=\"paginator\"\r\n  [rows]=\"rows\"\r\n  [first]=\"first\"\r\n    [totalRecords]=\"totalRecords\"\r\n    [sortField]=\"sortField\"\r\n    [sortOrder]=\"sortOrder\" (onLazyLoad)=\"onLazyLoad($event)\"\r\n    [globalFilterFields]=\"globalFilterFields\"\r\n    [loading]=\"loading\"\r\n    [scrollable]=\"true\"\r\n    [scrollHeight]=\"scrollHeight\"\r\n    [selectionMode]=\"showRowSelectionCheckbox ? 'multiple' : (rowSelectable ? 'single' : undefined)\"\r\n    [(selection)]=\"_selection\"\r\n    (onRowSelect)=\"onInternalSelectionChange($event)\"\r\n    (onRowUnselect)=\"onInternalSelectionChange($event)\"\r\n    (onHeaderCheckboxToggle)=\"onInternalSelectionChange($event)\"\r\n    tableLayout=\"fixed\"\r\n    [customSort]=\"false\"\r\n    (sortFunction)=\"customSort($event)\"\r\n    >\r\n\r\n    <ng-template pTemplate=\"header\" let-columns>\r\n      <tr>\r\n          <th *ngIf=\"showRowSelectionCheckbox\" style=\"width: 2rem\">\r\n        <p-tableHeaderCheckbox></p-tableHeaderCheckbox>\r\n      </th>\r\n        <!-- <th style=\"width: 1rem\">\r\n          <p-tableHeaderCheckbox />\r\n        </th> -->\r\n\r\n       <ng-container *ngFor=\"let col of columns\" >\r\n  <th *ngIf=\"col.props?.table?.props?.width; else templateName\" [pSortableColumn]=\"col.key\"\r\n      class=\"px-4 py-2 text-sm font-medium text-white text-center\"\r\n      [style.min-width]=\"col.props?.table?.props?.width\">\r\n    {{ col.props?.label | translate }}\r\n    <p-sortIcon [field]=\"col.key\"></p-sortIcon>\r\n  </th>\r\n\r\n  <ng-template #templateName>\r\n    <th class=\"px-4 py-2 text-sm font-medium text-white text-center\">\r\n      {{ col.props?.label | translate }}\r\n      <p-sortIcon [field]=\"col.key\"></p-sortIcon>\r\n    </th>\r\n  </ng-template>\r\n</ng-container>\r\n\r\n\r\n        <th class=\"px-4 py-2 text-sm font-medium text-white text-center\"> {{ 'OPERATIONS' | translate }}</th>\r\n      </tr>\r\n    </ng-template>\r\n\r\n    <ng-template pTemplate=\"body\" let-rowData let-columns=\"columns\" let-i=\"rowIndex\">\r\n      <tr class=\"even:bg-gray-50 hover:bg-gray-100\" (click)=\"rowSelect.emit(rowData)\">\r\n        <!-- <td style=\"width: 1rem\">\r\n          <p-tableCheckbox [value]=\"rowData\" />\r\n        </td> -->\r\n        <td *ngIf=\"showRowSelectionCheckbox\" style=\"width: 2rem\">\r\n        <p-tableCheckbox [value]=\"rowData\"></p-tableCheckbox>\r\n      </td>\r\n        <td *ngFor=\"let col of columns_ ; let colIndex = index\"\r\n    class=\"border-t border-gray-200 px-4 py-2 text-center text-sm text-gray-700\"\r\n     [style.width]=\"col.props && col.props['table']\r\n     && col.props['table']['props'] && col.props['table']['props']['width'] \"\r\n\r\n     >\r\n\r\n\r\n <!-- \u0625\u0630\u0627 \u0627\u0644\u0639\u0645\u0648\u062F \u0642\u0627\u0628\u0644 \u0644\u0644\u0646\u0642\u0631 -->\r\n\r\n      <formly-form\r\n      [model]=\"rowData\"\r\n      [form]=\"getForm(i, colIndex)\"\r\n      [fields]=\"[cloneField(col)]\"\r\n      [options]=\"options\">\r\n    </formly-form>\r\n\r\n        </td>\r\n        <td class=\"border-t border-gray-200 px-4 py-2 text-center align-middle\">\r\n          <ng-container [ngSwitch]=\"actionsMode\">\r\n                  <!-- Render buttons -->\r\n                  <ng-container *ngSwitchCase=\"'buttons'\">\r\n                    <ng-container *ngFor=\"let act of actions\">\r\n                      <button\r\n                        *ngIf=\"act.icon || act.label\"\r\n                        pButton\r\n                        [icon]=\"act.icon || ''\"\r\n                        [label]=\"(act.label  || '') | translate\"\r\n                        [class]=\"act.styleClass || ''\"\r\n                        class=\"p-button-sm mx-1\"\r\n                        (click)=\"onAction(act, rowData)\"\r\n                      ></button>\r\n                    </ng-container>\r\n                  </ng-container>\r\n\r\n                  <!-- Render menu -->\r\n                  <ng-container *ngSwitchCase=\"'menu'\">\r\n                     <p-menu #menu [model]=\"getMenuItems(rowData)\" [popup]=\"true\" appendTo=\"body\">\r\n                    <ng-template let-item pTemplate=\"item\">\r\n                      <div class=\"flex items-center gap-2 px-2 py-1\">\r\n                        <i [ngClass]=\"item.icon\" class=\"text-primary-600\" *ngIf=\"item.icon\"></i>\r\n                        <span class=\"font-medium\">{{ (item.label  || '') | translate }}</span>\r\n\r\n                        <span *ngIf=\"item.badge\" class=\"ml-auto text-xs bg-red-500 text-white px-2 py-1 rounded\">\r\n                          {{ item.badge }}\r\n                        </span>\r\n\r\n                        <!-- <p-inputSwitch *ngIf=\"item.toggle\" [(ngModel)]=\"item.toggleValue\" class=\"ml-auto\" /> -->\r\n                      </div>\r\n                    </ng-template>\r\n                  </p-menu>\r\n\r\n                    <p-button\r\n                    outlined\r\n                      icon=\"pi pi-ellipsis-v\"\r\n                      class=\"p-button-text p-button-sm\"\r\n                      (onClick)=\"menu.toggle($event)\"\r\n                    ></p-button>\r\n                  </ng-container>\r\n                </ng-container>\r\n\r\n        </td>\r\n      </tr>\r\n    </ng-template>\r\n  </p-table>\r\n\r\n</div>\r\n", styles: [".custom-button-medium{font-size:1.1rem;width:2.5rem;height:2.5rem;line-height:2.5rem;padding:0}.custom-button-gray{color:#333;background-color:transparent;border:none}.custom-button-gray:hover{background-color:#eee;color:#000}.icon-delete{color:red!important}.icon-edit{color:#333}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "ngmodule", type: TableModule }, { kind: "component", type: i2$2.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "styleClass", "tableStyle", "tableStyleClass", "paginator", "pageLinks", "rowsPerPageOptions", "alwaysShowPaginator", "paginatorPosition", "paginatorStyleClass", "paginatorDropdownAppendTo", "paginatorDropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showJumpToPageDropdown", "showJumpToPageInput", "showFirstLastIcon", "showPageLinks", "defaultSortOrder", "sortMode", "resetPageOnSort", "selectionMode", "selectionPageOnly", "contextMenuSelection", "contextMenuSelectionMode", "dataKey", "metaKeySelection", "rowSelectable", "rowTrackBy", "lazy", "lazyLoadOnInit", "compareSelectionBy", "csvSeparator", "exportFilename", "filters", "globalFilterFields", "filterDelay", "filterLocale", "expandedRowKeys", "editingRowKeys", "rowExpandMode", "scrollable", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "size", "showGridlines", "stripedRows", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "selectAll"], outputs: ["contextMenuSelectionChange", "selectAllChange", "selectionChange", "onRowSelect", "onRowUnselect", "onPage", "onSort", "onFilter", "onLazyLoad", "onRowExpand", "onRowCollapse", "onContextMenuSelect", "onColResize", "onColReorder", "onRowReorder", "onEditInit", "onEditComplete", "onEditCancel", "onHeaderCheckboxToggle", "sortFunction", "firstChange", "rowsChange", "onStateSave", "onStateRestore"] }, { kind: "directive", type: i1$2.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "directive", type: i2$2.SortableColumn, selector: "[pSortableColumn]", inputs: ["pSortableColumn", "pSortableColumnDisabled"] }, { kind: "component", type: i2$2.SortIcon, selector: "p-sortIcon", inputs: ["field"] }, { kind: "component", type: i2$2.TableCheckbox, selector: "p-tableCheckbox", inputs: ["value", "disabled", "required", "index", "inputId", "name", "ariaLabel"] }, { kind: "component", type: i2$2.TableHeaderCheckbox, selector: "p-tableHeaderCheckbox", inputs: ["disabled", "inputId", "name", "ariaLabel"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "directive", type: i3$1.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "loading", "severity", "raised", "rounded", "text", "outlined", "size", "plain", "fluid", "label", "icon", "buttonProps"] }, { kind: "component", type: i3$1.Button, selector: "p-button", inputs: ["type", "iconPos", "icon", "badge", "label", "disabled", "loading", "loadingIcon", "raised", "rounded", "text", "plain", "severity", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "buttonProps", "autofocus", "fluid"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "ngmodule", type: MenuModule }, { kind: "component", type: i4$1.Menu, selector: "p-menu", inputs: ["model", "popup", "style", "styleClass", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "ariaLabel", "ariaLabelledBy", "id", "tabindex", "appendTo"], outputs: ["onShow", "onHide", "onBlur", "onFocus"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "component", type: FormlyForm, selector: "formly-form", inputs: ["form", "model", "fields", "options"], outputs: ["modelChange"] }, { kind: "pipe", type: i1$3.TranslatePipe, name: "translate" }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.4", ngImport: i0, type: GenericTable, decorators: [{
             type: Component,
@@ -3487,7 +3531,7 @@ class GenericCrudTableComponent {
         });
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.4", ngImport: i0, type: GenericCrudTableComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.4", type: GenericCrudTableComponent, isStandalone: true, selector: "app-generic-crud-table", inputs: { data: "data", formFields: "formFields", columns: "columns", isViewMode: "isViewMode", isEditMode: "isEditMode", drawerVisible: "drawerVisible", dialogVisible: "dialogVisible", model: "model", loading: "loading", errorMsg: "errorMsg", errorMessage: "errorMessage", actions: "actions", actionsMode: "actionsMode", filters: "filters", filterModel: "filterModel", showSearch: "showSearch", first: "first", rows: "rows", totalRecords: "totalRecords", rowSelectable: "rowSelectable", scrollHeight: "scrollHeight", paginator: "paginator", service: "service", idField: "idField", showRowSelectionCheckbox: "showRowSelectionCheckbox", bulkActionButtons: "bulkActionButtons", singleActionButtons: "singleActionButtons", showAddButton: "showAddButton", addButtonIcon: "addButtonIcon", addButtonLabel: "addButtonLabel", addButtonPosition: "addButtonPosition", addButtonConfigs: "addButtonConfigs", breadcrumb: "breadcrumb", beforeSave: "beforeSave" }, outputs: { action: "action", bulkAction: "bulkAction", singleAction: "singleAction", search: "search", pageChange: "pageChange", onSearch: "onSearch", visibleChange: "visibleChange", rowSelect: "rowSelect" }, host: { classAttribute: "h-full flex-1 flex flex-col overflow-hidden border border-surface rounded-2xl p-4 bg-white" }, viewQueries: [{ propertyName: "genericTable", first: true, predicate: ["genericTable"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "\r\n <div class=\"flex items-start gap-2 justify-between\">\r\n            <div>\r\n               <!-- <div class=\"text-2xl leading-8 font-medium bg-slate-800 p-4 rounded-md\">\r\n            <p-breadcrumb\r\n              [model]=\"breadcrumb_\"\r\n              [home]=\"home\"\r\n              styleClass=\"custom-breadcrumb\"\r\n            ></p-breadcrumb>\r\n          </div> -->\r\n\r\n<app-breadcrumb [breadcrumb]=\"breadcrumb_\"></app-breadcrumb>\r\n\r\n            </div>\r\n\r\n<div class=\"flex items-center gap-2 justify-end flex-wrap\">\r\n       <ng-container *ngIf=\"isSingleItemSelected\">\r\n <ng-container *ngFor=\"let btn of singleActionButtons; trackBy: trackByIdx\">\r\n <lib-generic-button\r\n\r\n  [icon]=\"btn.icon\"\r\n[label]=\"btn.label | translate\"\r\n[variant]=\"btn.variant\"\r\n [size]=\"btn.size\"\r\n [permission]=\"btn.permission\"\r\n (clicked)=\"onSingleItemAction(btn)\"\r\n ></lib-generic-button>\r\n</ng-container>\r\n </ng-container>\r\n\r\n    <ng-container *ngIf=\"selectedItems.length > 0\">\r\n      <ng-container *ngFor=\"let btn of bulkActionButtons; trackBy: trackByIdx\">\r\n        <lib-generic-button\r\n          [icon]=\"btn.icon\"\r\n          [label]=\"btn.label | translate\"\r\n          [variant]=\"btn.variant\"\r\n          [size]=\"btn.size\"\r\n          [permission]=\"btn.permission\"\r\n          (clicked)=\"onInternalBulkAction(btn)\"\r\n        ></lib-generic-button>\r\n      </ng-container>\r\n    </ng-container>\r\n\r\n      <ng-container *ngFor=\"let btn of addButtonConfigs; trackBy: trackByIdx\">\r\n      <lib-generic-button\r\n        [icon]=\"btn.icon\"\r\n        [label]=\"btn.label | translate\"\r\n        [variant]=\"btn.variant\"\r\n        [size]=\"btn.size\"\r\n        [permission]=\"btn.permission\"\r\n        (clicked)=\" this.action.emit({ name: btn.actionName ?? 'add', row: null! });\"\r\n      ></lib-generic-button>\r\n    </ng-container>\r\n\r\n            <p-button\r\n            icon=\"pi pi-circle-fill text-green-500\" *ngIf=\"showAddButton && addButtonConfigs.length == 0\"\r\n            [label]=\"(addButtonLabel | translate)\r\n            \"(onClick)=\"action.emit({ name: 'add', row: null! })\"\r\n            outlined severity=\"secondary\" />\r\n\r\n            </div>\r\n        </div>\r\n        <div class=\"mt-2 mb-4 flex items-center justify-between\">\r\n\r\n          <ng-container *ngIf=\"showSearch && filters; else emptySearch\">\r\n           <lib-generic-search\r\n                [model]=\"filterModel\"\r\n                [fields]=\"filters\"\r\n                (search)=\"applySearch($event)\"\r\n                (reset)=\"applySearch('')\"\r\n              ></lib-generic-search>\r\n          </ng-container>\r\n\r\n              <ng-template #emptySearch>\r\n    <!-- Render a dummy div to preserve expected DOM shape -->\r\n    <!-- <div class=\"min-h-[2.5rem] w-[12rem]\"></div> -->\r\n  </ng-template>\r\n\r\n            <div class=\"flex items-center gap-3\">\r\n\r\n              <p-button icon=\"pi pi-refresh\" outlined severity=\"secondary\" (onClick)=\"applySearch('')\" />\r\n              <p-divider layout=\"vertical\" class=\"m-0 p-0\" />\r\n              <p-button icon=\"pi pi-sort\" outlined severity=\"secondary\" />\r\n                <p-button label=\"1 of 15\" outlined severity=\"secondary\" />\r\n                <p-button icon=\"pi pi-chevron-right\" outlined severity=\"secondary\" />\r\n                <p-button icon=\"pi pi-chevron-left\" outlined severity=\"secondary\" />\r\n            </div>\r\n        </div>\r\n\r\n\r\n\r\n<lib-generic-table\r\n  [data]=\"data\"\r\n  [columns]=\"columns\"\r\n  [paginator]=\"paginator\"\r\n  [loading]=\"loading\"\r\n  [actions]=\"actions\"\r\n  [actionsMode]=\"actionsMode\"\r\n  [first]=\"first\"\r\n  [rows]=\"rows\"\r\n  [totalRecords]=\"totalRecords\"\r\n  [sortField]=\"sortField\"\r\n  [sortOrder]=\"sortOrder\"\r\n  [globalFilterFields]=\"globalFilterFields\"\r\n  [scrollHeight]=\"scrollHeight\"\r\n  [showRowSelectionCheckbox]=\"showRowSelectionCheckbox\"\r\n  (action)=\"action.emit($event)\"\r\n  (pageChange)=\"onLazyLoad($event)\"\r\n  [rowSelectable]=\"rowSelectable\"\r\n  (rowSelect)=\"onRowClick($event)\"\r\n  [(selection)]=\"_selectedRows\"\r\n  #genericTable\r\n></lib-generic-table>\r\n\r\n\r\n\r\n\r\n\r\n\r\n<p-drawer *ngIf=\"drawerVisible\"\r\n[(visible)]=\"drawerVisible\" [closable]=\"true\"\r\n[dismissible]=\"false\" [closeOnEscape]=\"true\"\r\n(visibleChange)=\"visibleChange.emit($event)\"\r\nstyleClass=\"!w-full md:!w-80 lg:!w-[40rem]\">\r\n  <!-- Header -->\r\n  <ng-template pTemplate=\"header\">\r\n    <div class=\"flex items-center justify-between w-full\">\r\n      <div class=\"flex items-center gap-2\">\r\n        <i class=\"pi pi-arrow-left cursor-pointer text-xl\" (click)=\"visibleChange.emit(false)\"></i>\r\n        <span class=\"font-bold text-lg\">{{ isEditMode ? '\u062A\u0639\u062F\u064A\u0644 ' : '\u0625\u0636\u0627\u0641\u0629' }}</span>\r\n      </div>\r\n    </div>\r\n  </ng-template>\r\n<form *ngIf=\"form\" [formGroup]=\"form\" (ngSubmit)=\"onSubmit()\" class=\"p-4\">\r\n    <formly-form  [form]=\"form\" [fields]=\"formFields_\"  [model]=\"model\"  [options]=\"options\"></formly-form>\r\n  </form>\r\n\r\n  <!-- Footer -->\r\n  <ng-template pTemplate=\"footer\">\r\n    <div class=\"flex justify-end gap-2\">\r\n      <button\r\n        pButton\r\n        [label]=\"isEditMode ? ('UPDATE' | translate) : ('SAVE' | translate)\"\r\n        [disabled]=\"loading || form.invalid\"\r\n        [loading]=\"loading\"\r\n        size=\"large\"\r\n         type=\"submit\"\r\n        (click)=\"onSubmit()\">\r\n      </button>\r\n\r\n      <button\r\n        pButton\r\n        label=\"{{ 'CANCEL' | translate }}\"\r\n        severity=\"danger\"\r\n        size=\"large\"\r\n        (click)=\"visibleChange.emit(false)\">\r\n      </button>\r\n    </div>\r\n  </ng-template>\r\n</p-drawer>\r\n\r\n<p-dialog\r\n  *ngIf=\"dialogVisible\"\r\n  [(visible)]=\"dialogVisible\"\r\n  [modal]=\"true\"\r\n  [closable]=\"true\"\r\n  [dismissableMask]=\"true\"\r\n  [closeOnEscape]=\"true\"\r\n  (visibleChange)=\"visibleChange.emit($event)\"\r\n  [style]=\"{ width: '95vw', maxWidth: '40rem' }\"\r\n  [header]=\"viewHeaderTitle\"\r\n>\r\n<!-- backdrop-blur-sm -->\r\n  <div class=\"relative\">\r\n    <!-- Only visible in view mode: disables interaction and adds blur effect -->\r\n    <div\r\n      *ngIf=\"isViewMode\"\r\n      class=\"absolute inset-0 z-10 bg-white/50 pointer-events-auto cursor-not-allowed rounded-md\">\r\n    </div>\r\n\r\n    <!-- Form -->\r\n    <form *ngIf=\"form\" [formGroup]=\"form\" class=\"p-4\">\r\n      <formly-form\r\n        [form]=\"form\"\r\n        [fields]=\"formFields_\"\r\n        [model]=\"model\"\r\n        [options]=\"options\">\r\n      </formly-form>\r\n    </form>\r\n </div>\r\n  <!-- Footer -->\r\n  <ng-template pTemplate=\"footer\">\r\n    <div class=\"flex justify-end\">\r\n      <button\r\n        pButton\r\n        label=\"{{ 'CLOSE' | translate }}\"\r\n        severity=\"secondary\"\r\n        size=\"large\"\r\n        (click)=\"visibleChange.emit(false)\">\r\n      </button>\r\n    </div>\r\n  </ng-template>\r\n</p-dialog>\r\n\r\n\r\n\r\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: TableModule }, { kind: "directive", type: i1$2.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: GenericButton, selector: "lib-generic-button", inputs: ["model", "type", "icon", "label", "variant", "severity", "size", "iconPosition", "disabled", "loading", "ariaLabel", "extraClasses", "permission"], outputs: ["clicked", "itemClick"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "directive", type: i3$1.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "loading", "severity", "raised", "rounded", "text", "outlined", "size", "plain", "fluid", "label", "icon", "buttonProps"] }, { kind: "component", type: i3$1.Button, selector: "p-button", inputs: ["type", "iconPos", "icon", "badge", "label", "disabled", "loading", "loadingIcon", "raised", "rounded", "text", "plain", "severity", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "buttonProps", "autofocus", "fluid"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "component", type: GenericSearch, selector: "lib-generic-search", inputs: ["placeholder", "model", "fields"], outputs: ["search"] }, { kind: "component", type: GenericTable, selector: "lib-generic-table", inputs: ["data", "columns", "loading", "actions", "actionsMode", "first", "rows", "totalRecords", "sortField", "sortOrder", "globalFilterFields", "scrollHeight", "rowSelectable", "selection", "paginator", "showRowSelectionCheckbox"], outputs: ["action", "pageChange", "rowSelect", "selectionChange"] }, { kind: "ngmodule", type: ToolbarModule }, { kind: "ngmodule", type: TranslateModule }, { kind: "ngmodule", type: DividerModule }, { kind: "component", type: i4$2.Divider, selector: "p-divider", inputs: ["styleClass", "layout", "type", "align"] }, { kind: "ngmodule", type: IconFieldModule }, { kind: "ngmodule", type: DrawerModule }, { kind: "component", type: i5$2.Drawer, selector: "p-drawer", inputs: ["appendTo", "blockScroll", "style", "styleClass", "ariaCloseLabel", "autoZIndex", "baseZIndex", "modal", "closeButtonProps", "dismissible", "showCloseIcon", "closeOnEscape", "transitionOptions", "visible", "position", "fullScreen", "header", "maskStyle", "closable"], outputs: ["onShow", "onHide", "visibleChange"] }, { kind: "component", type: FormlyForm, selector: "formly-form", inputs: ["form", "model", "fields", "options"], outputs: ["modelChange"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: FormsModule }, { kind: "ngmodule", type: MessageModule }, { kind: "component", type: BreadcrumbComponent, selector: "app-breadcrumb", inputs: ["breadcrumb"] }, { kind: "ngmodule", type: DialogModule }, { kind: "component", type: i8.Dialog, selector: "p-dialog", inputs: ["header", "draggable", "resizable", "contentStyle", "contentStyleClass", "modal", "closeOnEscape", "dismissableMask", "rtl", "closable", "breakpoints", "styleClass", "maskStyleClass", "maskStyle", "showHeader", "blockScroll", "autoZIndex", "baseZIndex", "minX", "minY", "focusOnShow", "maximizable", "keepInViewport", "focusTrap", "transitionOptions", "closeIcon", "closeAriaLabel", "closeTabindex", "minimizeIcon", "maximizeIcon", "closeButtonProps", "maximizeButtonProps", "visible", "style", "position", "role", "appendTo", "content", "contentTemplate", "footerTemplate", "closeIconTemplate", "maximizeIconTemplate", "minimizeIconTemplate", "headlessTemplate"], outputs: ["onShow", "onHide", "visibleChange", "onResizeInit", "onResizeEnd", "onDragEnd", "onMaximize"] }, { kind: "pipe", type: i1$3.TranslatePipe, name: "translate" }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.4", type: GenericCrudTableComponent, isStandalone: true, selector: "app-generic-crud-table", inputs: { data: "data", formFields: "formFields", columns: "columns", isViewMode: "isViewMode", isEditMode: "isEditMode", drawerVisible: "drawerVisible", dialogVisible: "dialogVisible", model: "model", loading: "loading", errorMsg: "errorMsg", errorMessage: "errorMessage", actions: "actions", actionsMode: "actionsMode", filters: "filters", filterModel: "filterModel", showSearch: "showSearch", first: "first", rows: "rows", totalRecords: "totalRecords", rowSelectable: "rowSelectable", scrollHeight: "scrollHeight", paginator: "paginator", service: "service", idField: "idField", showRowSelectionCheckbox: "showRowSelectionCheckbox", bulkActionButtons: "bulkActionButtons", singleActionButtons: "singleActionButtons", showAddButton: "showAddButton", addButtonIcon: "addButtonIcon", addButtonLabel: "addButtonLabel", addButtonPosition: "addButtonPosition", addButtonConfigs: "addButtonConfigs", breadcrumb: "breadcrumb", beforeSave: "beforeSave" }, outputs: { action: "action", bulkAction: "bulkAction", singleAction: "singleAction", search: "search", pageChange: "pageChange", onSearch: "onSearch", visibleChange: "visibleChange", rowSelect: "rowSelect" }, host: { classAttribute: "h-full flex-1 flex flex-col overflow-hidden border border-surface rounded-2xl p-4 bg-white" }, viewQueries: [{ propertyName: "genericTable", first: true, predicate: ["genericTable"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "\r\n <div class=\"flex items-start gap-2 justify-between\">\r\n            <div>\r\n               <!-- <div class=\"text-2xl leading-8 font-medium bg-slate-800 p-4 rounded-md\">\r\n            <p-breadcrumb\r\n              [model]=\"breadcrumb_\"\r\n              [home]=\"home\"\r\n              styleClass=\"custom-breadcrumb\"\r\n            ></p-breadcrumb>\r\n          </div> -->\r\n\r\n<app-breadcrumb [breadcrumb]=\"breadcrumb_\"></app-breadcrumb>\r\n\r\n            </div>\r\n\r\n<div class=\"flex items-center gap-2 justify-end flex-wrap\">\r\n       <ng-container *ngIf=\"isSingleItemSelected\">\r\n <ng-container *ngFor=\"let btn of singleActionButtons; trackBy: trackByIdx\">\r\n <lib-generic-button\r\n\r\n  [icon]=\"btn.icon\"\r\n[label]=\"btn.label | translate\"\r\n[variant]=\"btn.variant\"\r\n [size]=\"btn.size\"\r\n [permission]=\"btn.permission\"\r\n (clicked)=\"onSingleItemAction(btn)\"\r\n ></lib-generic-button>\r\n</ng-container>\r\n </ng-container>\r\n\r\n    <ng-container *ngIf=\"selectedItems.length > 0\">\r\n      <ng-container *ngFor=\"let btn of bulkActionButtons; trackBy: trackByIdx\">\r\n        <lib-generic-button\r\n          [icon]=\"btn.icon\"\r\n          [label]=\"btn.label | translate\"\r\n          [variant]=\"btn.variant\"\r\n          [size]=\"btn.size\"\r\n          [permission]=\"btn.permission\"\r\n          (clicked)=\"onInternalBulkAction(btn)\"\r\n        ></lib-generic-button>\r\n      </ng-container>\r\n    </ng-container>\r\n\r\n      <ng-container *ngFor=\"let btn of addButtonConfigs; trackBy: trackByIdx\">\r\n      <lib-generic-button\r\n        [icon]=\"btn.icon\"\r\n        [label]=\"btn.label | translate\"\r\n        [variant]=\"btn.variant\"\r\n        [size]=\"btn.size\"\r\n        [permission]=\"btn.permission\"\r\n        (clicked)=\" this.action.emit({ name: btn.actionName ?? 'add', row: null! });\"\r\n      ></lib-generic-button>\r\n    </ng-container>\r\n\r\n            <p-button\r\n            icon=\"pi pi-circle-fill text-green-500\" *ngIf=\"showAddButton && addButtonConfigs.length == 0\"\r\n            [label]=\"(addButtonLabel | translate)\r\n            \"(onClick)=\"action.emit({ name: 'add', row: null! })\"\r\n            outlined severity=\"secondary\" />\r\n\r\n            </div>\r\n        </div>\r\n        <div class=\"mt-2 mb-4 flex items-center justify-between\">\r\n\r\n          <ng-container *ngIf=\"showSearch && filters; else emptySearch\">\r\n           <lib-generic-search\r\n                [model]=\"filterModel\"\r\n                [fields]=\"filters\"\r\n                (search)=\"applySearch($event)\"\r\n                (reset)=\"applySearch('')\"\r\n              ></lib-generic-search>\r\n          </ng-container>\r\n\r\n              <ng-template #emptySearch>\r\n    <!-- Render a dummy div to preserve expected DOM shape -->\r\n    <!-- <div class=\"min-h-[2.5rem] w-[12rem]\"></div> -->\r\n  </ng-template>\r\n\r\n            <div class=\"flex items-center gap-3\">\r\n\r\n              <p-button icon=\"pi pi-refresh\" outlined severity=\"secondary\" (onClick)=\"applySearch('')\" />\r\n              <p-divider layout=\"vertical\" class=\"m-0 p-0\" />\r\n              <p-button icon=\"pi pi-sort\" outlined severity=\"secondary\" />\r\n                <p-button label=\"1 of 15\" outlined severity=\"secondary\" />\r\n                <p-button icon=\"pi pi-chevron-right\" outlined severity=\"secondary\" />\r\n                <p-button icon=\"pi pi-chevron-left\" outlined severity=\"secondary\" />\r\n            </div>\r\n        </div>\r\n\r\n\r\n\r\n<lib-generic-table\r\n  [data]=\"data\"\r\n  [columns]=\"columns\"\r\n  [paginator]=\"paginator\"\r\n  [loading]=\"loading\"\r\n  [actions]=\"actions\"\r\n  [actionsMode]=\"actionsMode\"\r\n  [first]=\"first\"\r\n  [rows]=\"rows\"\r\n  [totalRecords]=\"totalRecords\"\r\n  [sortField]=\"sortField\"\r\n  [sortOrder]=\"sortOrder\"\r\n  [globalFilterFields]=\"globalFilterFields\"\r\n  [scrollHeight]=\"scrollHeight\"\r\n  [showRowSelectionCheckbox]=\"showRowSelectionCheckbox\"\r\n  (action)=\"action.emit($event)\"\r\n  (pageChange)=\"onLazyLoad($event)\"\r\n  [rowSelectable]=\"rowSelectable\"\r\n  (rowSelect)=\"onRowClick($event)\"\r\n  [(selection)]=\"_selectedRows\"\r\n  #genericTable\r\n></lib-generic-table>\r\n\r\n\r\n\r\n\r\n\r\n\r\n<p-drawer *ngIf=\"drawerVisible\"\r\n[(visible)]=\"drawerVisible\" [closable]=\"true\"\r\n[dismissible]=\"false\" [closeOnEscape]=\"true\"\r\n(visibleChange)=\"visibleChange.emit($event)\"\r\nstyleClass=\"!w-full md:!w-80 lg:!w-[40rem]\">\r\n  <!-- Header -->\r\n  <ng-template pTemplate=\"header\">\r\n    <div class=\"flex items-center justify-between w-full\">\r\n      <div class=\"flex items-center gap-2\">\r\n        <i class=\"pi pi-arrow-left cursor-pointer text-xl\" (click)=\"visibleChange.emit(false)\"></i>\r\n        <span class=\"font-bold text-lg\">{{ isEditMode ? '\u062A\u0639\u062F\u064A\u0644 ' : '\u0625\u0636\u0627\u0641\u0629' }}</span>\r\n      </div>\r\n    </div>\r\n  </ng-template>\r\n<form *ngIf=\"form\" [formGroup]=\"form\" (ngSubmit)=\"onSubmit()\" class=\"p-4\">\r\n    <formly-form  [form]=\"form\" [fields]=\"formFields_\"  [model]=\"model\"  [options]=\"options\"></formly-form>\r\n  </form>\r\n\r\n  <!-- Footer -->\r\n  <ng-template pTemplate=\"footer\">\r\n    <div class=\"flex justify-end gap-2\">\r\n      <button\r\n        pButton\r\n        [label]=\"isEditMode ? ('UPDATE' | translate) : ('SAVE' | translate)\"\r\n        [disabled]=\"loading || form.invalid\"\r\n        [loading]=\"loading\"\r\n        size=\"large\"\r\n         type=\"submit\"\r\n        (click)=\"onSubmit()\">\r\n      </button>\r\n\r\n      <button\r\n        pButton\r\n        label=\"{{ 'CANCEL' | translate }}\"\r\n        severity=\"danger\"\r\n        size=\"large\"\r\n        (click)=\"visibleChange.emit(false)\">\r\n      </button>\r\n    </div>\r\n  </ng-template>\r\n</p-drawer>\r\n\r\n<p-dialog\r\n  *ngIf=\"dialogVisible\"\r\n  [(visible)]=\"dialogVisible\"\r\n  [modal]=\"true\"\r\n  [closable]=\"true\"\r\n  [dismissableMask]=\"true\"\r\n  [closeOnEscape]=\"true\"\r\n  (visibleChange)=\"visibleChange.emit($event)\"\r\n  [style]=\"{ width: '95vw', maxWidth: '40rem' }\"\r\n  [header]=\"viewHeaderTitle\"\r\n>\r\n<!-- backdrop-blur-sm -->\r\n  <div class=\"relative\">\r\n    <!-- Only visible in view mode: disables interaction and adds blur effect -->\r\n    <div\r\n      *ngIf=\"isViewMode\"\r\n      class=\"absolute inset-0 z-10 bg-white/50 pointer-events-auto cursor-not-allowed rounded-md\">\r\n    </div>\r\n\r\n    <!-- Form -->\r\n    <form *ngIf=\"form\" [formGroup]=\"form\" class=\"p-4\">\r\n      <formly-form\r\n        [form]=\"form\"\r\n        [fields]=\"formFields_\"\r\n        [model]=\"model\"\r\n        [options]=\"options\">\r\n      </formly-form>\r\n    </form>\r\n </div>\r\n  <!-- Footer -->\r\n  <ng-template pTemplate=\"footer\">\r\n    <div class=\"flex justify-end\">\r\n      <button\r\n        pButton\r\n        label=\"{{ 'CLOSE' | translate }}\"\r\n        severity=\"secondary\"\r\n        size=\"large\"\r\n        (click)=\"visibleChange.emit(false)\">\r\n      </button>\r\n    </div>\r\n  </ng-template>\r\n</p-dialog>\r\n\r\n\r\n\r\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: TableModule }, { kind: "directive", type: i1$2.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: GenericButton, selector: "lib-generic-button", inputs: ["model", "type", "icon", "label", "variant", "severity", "size", "iconPosition", "disabled", "loading", "ariaLabel", "extraClasses", "permission"], outputs: ["clicked", "itemClick"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "directive", type: i3$1.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "loading", "severity", "raised", "rounded", "text", "outlined", "size", "plain", "fluid", "label", "icon", "buttonProps"] }, { kind: "component", type: i3$1.Button, selector: "p-button", inputs: ["type", "iconPos", "icon", "badge", "label", "disabled", "loading", "loadingIcon", "raised", "rounded", "text", "plain", "severity", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "buttonProps", "autofocus", "fluid"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "component", type: GenericSearch, selector: "lib-generic-search", inputs: ["placeholder", "model", "fields"], outputs: ["search"] }, { kind: "component", type: GenericTable, selector: "lib-generic-table", inputs: ["data", "columns", "loading", "actions", "actionsMode", "first", "rows", "totalRecords", "sortField", "sortOrder", "globalFilterFields", "scrollHeight", "rowSelectable", "selection", "paginator", "showRowSelectionCheckbox"], outputs: ["action", "pageChange", "rowSelect", "selectionChange"] }, { kind: "ngmodule", type: ToolbarModule }, { kind: "ngmodule", type: TranslateModule }, { kind: "ngmodule", type: DividerModule }, { kind: "component", type: i4$3.Divider, selector: "p-divider", inputs: ["styleClass", "layout", "type", "align"] }, { kind: "ngmodule", type: IconFieldModule }, { kind: "ngmodule", type: DrawerModule }, { kind: "component", type: i5$2.Drawer, selector: "p-drawer", inputs: ["appendTo", "blockScroll", "style", "styleClass", "ariaCloseLabel", "autoZIndex", "baseZIndex", "modal", "closeButtonProps", "dismissible", "showCloseIcon", "closeOnEscape", "transitionOptions", "visible", "position", "fullScreen", "header", "maskStyle", "closable"], outputs: ["onShow", "onHide", "visibleChange"] }, { kind: "component", type: FormlyForm, selector: "formly-form", inputs: ["form", "model", "fields", "options"], outputs: ["modelChange"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: FormsModule }, { kind: "ngmodule", type: MessageModule }, { kind: "component", type: BreadcrumbComponent, selector: "app-breadcrumb", inputs: ["breadcrumb"] }, { kind: "ngmodule", type: DialogModule }, { kind: "component", type: i8.Dialog, selector: "p-dialog", inputs: ["header", "draggable", "resizable", "contentStyle", "contentStyleClass", "modal", "closeOnEscape", "dismissableMask", "rtl", "closable", "breakpoints", "styleClass", "maskStyleClass", "maskStyle", "showHeader", "blockScroll", "autoZIndex", "baseZIndex", "minX", "minY", "focusOnShow", "maximizable", "keepInViewport", "focusTrap", "transitionOptions", "closeIcon", "closeAriaLabel", "closeTabindex", "minimizeIcon", "maximizeIcon", "closeButtonProps", "maximizeButtonProps", "visible", "style", "position", "role", "appendTo", "content", "contentTemplate", "footerTemplate", "closeIconTemplate", "maximizeIconTemplate", "minimizeIconTemplate", "headlessTemplate"], outputs: ["onShow", "onHide", "visibleChange", "onResizeInit", "onResizeEnd", "onDragEnd", "onMaximize"] }, { kind: "pipe", type: i1$3.TranslatePipe, name: "translate" }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.4", ngImport: i0, type: GenericCrudTableComponent, decorators: [{
             type: Component,
@@ -3832,7 +3876,7 @@ class FormlyFieldDatepicker extends FieldType {
       (onSelect)="onDateSelect($event)"
       (onBlur)="onTouched()"
     ></p-datepicker>
-  `, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: DatePickerModule }, { kind: "component", type: i2$4.DatePicker, selector: "p-datePicker, p-datepicker, p-date-picker", inputs: ["iconDisplay", "styleClass", "inputStyle", "inputId", "inputStyleClass", "placeholder", "ariaLabelledBy", "ariaLabel", "iconAriaLabel", "dateFormat", "multipleSeparator", "rangeSeparator", "inline", "showOtherMonths", "selectOtherMonths", "showIcon", "icon", "readonlyInput", "shortYearCutoff", "hourFormat", "timeOnly", "stepHour", "stepMinute", "stepSecond", "showSeconds", "showOnFocus", "showWeek", "startWeekFromFirstDayOfYear", "showClear", "dataType", "selectionMode", "maxDateCount", "showButtonBar", "todayButtonStyleClass", "clearButtonStyleClass", "autofocus", "autoZIndex", "baseZIndex", "panelStyleClass", "panelStyle", "keepInvalid", "hideOnDateTimeSelect", "touchUI", "timeSeparator", "focusTrap", "showTransitionOptions", "hideTransitionOptions", "tabindex", "minDate", "maxDate", "disabledDates", "disabledDays", "showTime", "responsiveOptions", "numberOfMonths", "firstDayOfWeek", "view", "defaultDate", "appendTo"], outputs: ["onFocus", "onBlur", "onClose", "onSelect", "onClear", "onInput", "onTodayClick", "onClearClick", "onMonthChange", "onYearChange", "onClickOutside", "onShow"] }, { kind: "ngmodule", type: FormlyFormFieldModule }, { kind: "directive", type: FormlyAttributes, selector: "[formlyAttributes]", inputs: ["formlyAttributes", "id"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1$3.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+  `, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: DatePickerModule }, { kind: "component", type: i2$3.DatePicker, selector: "p-datePicker, p-datepicker, p-date-picker", inputs: ["iconDisplay", "styleClass", "inputStyle", "inputId", "inputStyleClass", "placeholder", "ariaLabelledBy", "ariaLabel", "iconAriaLabel", "dateFormat", "multipleSeparator", "rangeSeparator", "inline", "showOtherMonths", "selectOtherMonths", "showIcon", "icon", "readonlyInput", "shortYearCutoff", "hourFormat", "timeOnly", "stepHour", "stepMinute", "stepSecond", "showSeconds", "showOnFocus", "showWeek", "startWeekFromFirstDayOfYear", "showClear", "dataType", "selectionMode", "maxDateCount", "showButtonBar", "todayButtonStyleClass", "clearButtonStyleClass", "autofocus", "autoZIndex", "baseZIndex", "panelStyleClass", "panelStyle", "keepInvalid", "hideOnDateTimeSelect", "touchUI", "timeSeparator", "focusTrap", "showTransitionOptions", "hideTransitionOptions", "tabindex", "minDate", "maxDate", "disabledDates", "disabledDays", "showTime", "responsiveOptions", "numberOfMonths", "firstDayOfWeek", "view", "defaultDate", "appendTo"], outputs: ["onFocus", "onBlur", "onClose", "onSelect", "onClear", "onInput", "onTodayClick", "onClearClick", "onMonthChange", "onYearChange", "onClickOutside", "onShow"] }, { kind: "ngmodule", type: FormlyFormFieldModule }, { kind: "directive", type: FormlyAttributes, selector: "[formlyAttributes]", inputs: ["formlyAttributes", "id"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1$3.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.4", ngImport: i0, type: FormlyFieldDatepicker, decorators: [{
             type: Component,
@@ -3996,8 +4040,10 @@ class GenericSelectorTypeComponent extends FieldType {
         this.loading = true;
         const vf = this.to['valueField'] || 'id';
         const fixedFilters = this.to['fixedFilters'] || {};
+        const lf = this.to['loadDefaultField'] || 'isDefault';
+        const lfValue = this.to['loadDefaultValue'] || true;
         const searchParams = {
-            isDefault: true,
+            [lf]: lfValue,
             ...fixedFilters,
         };
         this.api.getList(searchParams)
@@ -4948,7 +4994,7 @@ class RichTextEditorTypeComponent extends FieldType {
       [style]="{height: to['height'] || '200px'}"
       [placeholder]="to.placeholder"
     ></p-editor>
-  `, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: FormsModule }, { 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: EditorModule }, { kind: "component", type: i2$5.Editor, selector: "p-editor", inputs: ["style", "styleClass", "placeholder", "formats", "modules", "bounds", "scrollingContainer", "debug", "readonly"], outputs: ["onInit", "onTextChange", "onSelectionChange"] }, { kind: "directive", type: AutofocusDirective, selector: "[appAutofocus]", inputs: ["appAutofocus"] }] });
+  `, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: FormsModule }, { 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: EditorModule }, { kind: "component", type: i2$4.Editor, selector: "p-editor", inputs: ["style", "styleClass", "placeholder", "formats", "modules", "bounds", "scrollingContainer", "debug", "readonly"], outputs: ["onInit", "onTextChange", "onSelectionChange"] }, { kind: "directive", type: AutofocusDirective, selector: "[appAutofocus]", inputs: ["appAutofocus"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.4", ngImport: i0, type: RichTextEditorTypeComponent, decorators: [{
             type: Component,
@@ -5059,7 +5105,7 @@ class FormlyFieldInput extends FieldType {
         </ng-template>
       </p-inputNumber>
     </ng-template>
-  `, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: DatePickerModule }, { kind: "ngmodule", type: FormlyFormFieldModule$1 }, { kind: "directive", type: FormlyAttributes, selector: "[formlyAttributes]", inputs: ["formlyAttributes", "id"] }, { kind: "ngmodule", type: InputTextModule }, { kind: "directive", type: i7.InputText, selector: "[pInputText]", inputs: ["pSize", "variant", "fluid", "invalid"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "component", type: InputNumber, selector: "p-inputNumber, p-inputnumber, p-input-number", inputs: ["showButtons", "format", "buttonLayout", "inputId", "styleClass", "placeholder", "tabindex", "title", "ariaLabelledBy", "ariaDescribedBy", "ariaLabel", "ariaRequired", "autocomplete", "incrementButtonClass", "decrementButtonClass", "incrementButtonIcon", "decrementButtonIcon", "readonly", "allowEmpty", "locale", "localeMatcher", "mode", "currency", "currencyDisplay", "useGrouping", "minFractionDigits", "maxFractionDigits", "prefix", "suffix", "inputStyle", "inputStyleClass", "showClear", "autofocus"], outputs: ["onInput", "onFocus", "onBlur", "onKeyDown", "onClear"] }, { kind: "pipe", type: i1$3.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+  `, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: DatePickerModule }, { kind: "ngmodule", type: FormlyFormFieldModule$1 }, { kind: "directive", type: FormlyAttributes, selector: "[formlyAttributes]", inputs: ["formlyAttributes", "id"] }, { kind: "ngmodule", type: InputTextModule }, { kind: "directive", type: i6.InputText, selector: "[pInputText]", inputs: ["pSize", "variant", "fluid", "invalid"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "component", type: InputNumber, selector: "p-inputNumber, p-inputnumber, p-input-number", inputs: ["showButtons", "format", "buttonLayout", "inputId", "styleClass", "placeholder", "tabindex", "title", "ariaLabelledBy", "ariaDescribedBy", "ariaLabel", "ariaRequired", "autocomplete", "incrementButtonClass", "decrementButtonClass", "incrementButtonIcon", "decrementButtonIcon", "readonly", "allowEmpty", "locale", "localeMatcher", "mode", "currency", "currencyDisplay", "useGrouping", "minFractionDigits", "maxFractionDigits", "prefix", "suffix", "inputStyle", "inputStyleClass", "showClear", "autofocus"], outputs: ["onInput", "onFocus", "onBlur", "onKeyDown", "onClear"] }, { kind: "pipe", type: i1$3.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.4", ngImport: i0, type: FormlyFieldInput, decorators: [{
             type: Component,
@@ -5322,7 +5368,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.4", ngImpor
 
 class FormlyFieldTextArea extends FieldType {
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.4", ngImport: i0, type: FormlyFieldTextArea, deps: null, target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.4", type: FormlyFieldTextArea, isStandalone: true, selector: "formly-field-primeng-textarea", usesInheritance: true, ngImport: i0, template: ` <textarea [formControl]="formControl" [formlyAttributes]="field" class="w-full rounded-none block" [placeholder]="(props['placeholder'] ?? '')| translate" pInputTextarea></textarea> `, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: DatePickerModule }, { kind: "ngmodule", type: FormlyFormFieldModule }, { kind: "directive", type: FormlyAttributes, selector: "[formlyAttributes]", inputs: ["formlyAttributes", "id"] }, { kind: "ngmodule", type: SelectModule }, { kind: "ngmodule", type: TextareaModule }, { kind: "directive", type: i2$6.Textarea, selector: "[pTextarea], [pInputTextarea]", inputs: ["autoResize", "pSize", "variant", "fluid", "invalid"], outputs: ["onResize"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1$3.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.4", type: FormlyFieldTextArea, isStandalone: true, selector: "formly-field-primeng-textarea", usesInheritance: true, ngImport: i0, template: ` <textarea [formControl]="formControl" [formlyAttributes]="field" class="w-full rounded-none block" [placeholder]="(props['placeholder'] ?? '')| translate" pInputTextarea></textarea> `, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: DatePickerModule }, { kind: "ngmodule", type: FormlyFormFieldModule }, { kind: "directive", type: FormlyAttributes, selector: "[formlyAttributes]", inputs: ["formlyAttributes", "id"] }, { kind: "ngmodule", type: SelectModule }, { kind: "ngmodule", type: TextareaModule }, { kind: "directive", type: i2$5.Textarea, selector: "[pTextarea], [pInputTextarea]", inputs: ["autoResize", "pSize", "variant", "fluid", "invalid"], outputs: ["onResize"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1$3.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.4", ngImport: i0, type: FormlyFieldTextArea, decorators: [{
             type: Component,
@@ -5411,7 +5457,7 @@ class FormlyFieldCheckbox extends FieldType {
 
       />
 </div>
-  `, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: DatePickerModule }, { kind: "ngmodule", type: FormlyFormFieldModule }, { kind: "directive", type: FormlyAttributes, selector: "[formlyAttributes]", inputs: ["formlyAttributes", "id"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "ngmodule", type: CheckboxModule }, { kind: "component", type: i6.Checkbox, selector: "p-checkbox, p-checkBox, p-check-box", inputs: ["value", "binary", "ariaLabelledBy", "ariaLabel", "tabindex", "inputId", "inputStyle", "styleClass", "inputClass", "indeterminate", "formControl", "checkboxIcon", "readonly", "autofocus", "trueValue", "falseValue", "variant", "size"], outputs: ["onChange", "onFocus", "onBlur"] }, { kind: "pipe", type: i1$3.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+  `, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: DatePickerModule }, { kind: "ngmodule", type: FormlyFormFieldModule }, { kind: "directive", type: FormlyAttributes, selector: "[formlyAttributes]", inputs: ["formlyAttributes", "id"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "ngmodule", type: CheckboxModule }, { kind: "component", type: i6$1.Checkbox, selector: "p-checkbox, p-checkBox, p-check-box", inputs: ["value", "binary", "ariaLabelledBy", "ariaLabel", "tabindex", "inputId", "inputStyle", "styleClass", "inputClass", "indeterminate", "formControl", "checkboxIcon", "readonly", "autofocus", "trueValue", "falseValue", "variant", "size"], outputs: ["onChange", "onFocus", "onBlur"] }, { kind: "pipe", type: i1$3.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.4", ngImport: i0, type: FormlyFieldCheckbox, decorators: [{
             type: Component,
@@ -6490,6 +6536,17 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.4", ngImpor
                 args: ['appRtlLang']
             }] } });
 
+class AttachmentDto {
+    id;
+    binaryObjectId;
+    description;
+    mimeType;
+    fileName;
+    base64;
+    caption;
+    link;
+}
+
 class ListResultDto {
     items;
     constructor(initialValues = {}) {