springest 0.0.0-stage → 0.1.1

package/fesm2022/springest.mjs

@@ -0,0 +1,874 @@
+import * as i0 from '@angular/core';
+import { input, ChangeDetectionStrategy, Component, model, output, inject, ChangeDetectorRef, effect, signal, computed, ContentChild, ViewChild, linkedSignal, TemplateRef, Input, Directive, forwardRef, ContentChildren } from '@angular/core';
+import { Avatar } from 'primeng/avatar';
+import { OverlayBadge } from 'primeng/overlaybadge';
+import * as i1 from 'primeng/button';
+import { ButtonModule } from 'primeng/button';
+import * as i1$2 from '@angular/forms';
+import { FormsModule, FormControl, ReactiveFormsModule, NG_VALUE_ACCESSOR } from '@angular/forms';
+import * as i1$1 from 'primeng/datepicker';
+import { DatePickerModule } from 'primeng/datepicker';
+import * as i2 from 'primeng/floatlabel';
+import { FloatLabelModule, FloatLabel } from 'primeng/floatlabel';
+import { UIChart } from 'primeng/chart';
+import * as i1$5 from 'primeng/table';
+import { TableModule } from 'primeng/table';
+import * as i1$3 from '@ngx-translate/core';
+import { TranslateModule } from '@ngx-translate/core';
+import * as i1$7 from '@angular/common';
+import { NgTemplateOutlet, DatePipe, CommonModule } from '@angular/common';
+import { startWith } from 'rxjs/operators';
+import { merge } from 'rxjs';
+import * as i1$4 from 'primeng/inputtext';
+import { InputTextModule } from 'primeng/inputtext';
+import { form, required, FormField } from '@angular/forms/signals';
+import * as i2$1 from 'primeng/api';
+import { Select } from 'primeng/select';
+import * as i1$6 from 'primeng/checkbox';
+import { CheckboxModule } from 'primeng/checkbox';
+import { Password } from 'primeng/password';
+import { MultiSelect } from 'primeng/multiselect';
+import * as i2$2 from 'primeng/stepper';
+import { StepperModule } from 'primeng/stepper';
+
+class AvatarComponent {
+    constructor() {
+        this.icon = input("pi pi-user", ...(ngDevMode ? [{ debugName: "icon" }] : /* istanbul ignore next */ []));
+        this.className = input(...(ngDevMode ? [undefined, { debugName: "className" }] : /* istanbul ignore next */ []));
+        this.size = input("normal", ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
+        this.style = input(...(ngDevMode ? [undefined, { debugName: "style" }] : /* istanbul ignore next */ []));
+        this.label = input(...(ngDevMode ? [undefined, { debugName: "label" }] : /* istanbul ignore next */ []));
+        this.shape = input("circle", ...(ngDevMode ? [{ debugName: "shape" }] : /* istanbul ignore next */ []));
+        this.iconType = input("icon", ...(ngDevMode ? [{ debugName: "iconType" }] : /* istanbul ignore next */ []));
+        this.imageUrl = input(...(ngDevMode ? [undefined, { debugName: "imageUrl" }] : /* istanbul ignore next */ []));
+        this.overlayBadge = input(false, ...(ngDevMode ? [{ debugName: "overlayBadge" }] : /* istanbul ignore next */ []));
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: AvatarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.18", type: AvatarComponent, isStandalone: true, selector: "app-avatar", inputs: { icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, className: { classPropertyName: "className", publicName: "className", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, style: { classPropertyName: "style", publicName: "style", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, shape: { classPropertyName: "shape", publicName: "shape", isSignal: true, isRequired: false, transformFunction: null }, iconType: { classPropertyName: "iconType", publicName: "iconType", isSignal: true, isRequired: false, transformFunction: null }, imageUrl: { classPropertyName: "imageUrl", publicName: "imageUrl", isSignal: true, isRequired: false, transformFunction: null }, overlayBadge: { classPropertyName: "overlayBadge", publicName: "overlayBadge", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "@if (iconType() === 'icon') {\n  <p-avatar\n       [icon]=\"icon()\"\n       [class]=\"className()\"\n       [size]=\"size()\"\n       [shape]=\"shape()\"\n       [label]=\"label()\"\n  />\n}\n\n@if (iconType() === 'image' && !overlayBadge()) {\n  <p-avatar\n       [image]=\"imageUrl()\"\n       [class]=\"className()\"\n       [size]=\"size()\"\n       [shape]=\"shape()\"\n       [label]=\"label()\"\n  />\n}\n\n@if (iconType() === 'image' && overlayBadge()) {\n  <p-overlay-badge value=\"5\" severity=\"danger\" class=\"inline-flex\">\n    <p-avatar\n         [image]=\"imageUrl()\"\n         [class]=\"className()\"\n         [size]=\"size()\"\n         [shape]=\"shape()\"\n         [label]=\"label()\"\n    />\n  </p-overlay-badge>\n}\n", styles: [""], dependencies: [{ kind: "component", type: Avatar, selector: "p-avatar", inputs: ["label", "icon", "image", "size", "shape", "styleClass", "ariaLabel", "ariaLabelledBy"], outputs: ["onImageError"] }, { kind: "component", type: OverlayBadge, selector: "p-overlayBadge, p-overlay-badge, p-overlaybadge", inputs: ["styleClass", "style", "badgeSize", "severity", "value", "badgeDisabled", "size"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: AvatarComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'app-avatar', standalone: true, imports: [
+                        Avatar,
+                        OverlayBadge
+                    ], changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (iconType() === 'icon') {\n  <p-avatar\n       [icon]=\"icon()\"\n       [class]=\"className()\"\n       [size]=\"size()\"\n       [shape]=\"shape()\"\n       [label]=\"label()\"\n  />\n}\n\n@if (iconType() === 'image' && !overlayBadge()) {\n  <p-avatar\n       [image]=\"imageUrl()\"\n       [class]=\"className()\"\n       [size]=\"size()\"\n       [shape]=\"shape()\"\n       [label]=\"label()\"\n  />\n}\n\n@if (iconType() === 'image' && overlayBadge()) {\n  <p-overlay-badge value=\"5\" severity=\"danger\" class=\"inline-flex\">\n    <p-avatar\n         [image]=\"imageUrl()\"\n         [class]=\"className()\"\n         [size]=\"size()\"\n         [shape]=\"shape()\"\n         [label]=\"label()\"\n    />\n  </p-overlay-badge>\n}\n" }]
+        }], propDecorators: { icon: [{ type: i0.Input, args: [{ isSignal: true, alias: "icon", required: false }] }], className: [{ type: i0.Input, args: [{ isSignal: true, alias: "className", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], style: [{ type: i0.Input, args: [{ isSignal: true, alias: "style", required: false }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], shape: [{ type: i0.Input, args: [{ isSignal: true, alias: "shape", required: false }] }], iconType: [{ type: i0.Input, args: [{ isSignal: true, alias: "iconType", required: false }] }], imageUrl: [{ type: i0.Input, args: [{ isSignal: true, alias: "imageUrl", required: false }] }], overlayBadge: [{ type: i0.Input, args: [{ isSignal: true, alias: "overlayBadge", required: false }] }] } });
+
+class ButtonComponent {
+    constructor() {
+        this.type = input('button', ...(ngDevMode ? [{ debugName: "type" }] : /* istanbul ignore next */ []));
+        this.className = input(...(ngDevMode ? [undefined, { debugName: "className" }] : /* istanbul ignore next */ []));
+        this.style = input(...(ngDevMode ? [undefined, { debugName: "style" }] : /* istanbul ignore next */ []));
+        this.label = input(...(ngDevMode ? [undefined, { debugName: "label" }] : /* istanbul ignore next */ []));
+        this.iconPos = input('left', ...(ngDevMode ? [{ debugName: "iconPos" }] : /* istanbul ignore next */ []));
+        this.styleClass = input(...(ngDevMode ? [undefined, { debugName: "styleClass" }] : /* istanbul ignore next */ []));
+        this.icon = input(...(ngDevMode ? [undefined, { debugName: "icon" }] : /* istanbul ignore next */ []));
+        this.disabled = input(false, ...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
+        this.rounded = input(false, ...(ngDevMode ? [{ debugName: "rounded" }] : /* istanbul ignore next */ []));
+        this.badgeSeverity = input('warn', ...(ngDevMode ? [{ debugName: "badgeSeverity" }] : /* istanbul ignore next */ []));
+        this.size = input('small', ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
+        this.loading = input(false, ...(ngDevMode ? [{ debugName: "loading" }] : /* istanbul ignore next */ []));
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: ButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.18", type: ButtonComponent, isStandalone: true, selector: "app-button", inputs: { type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null }, className: { classPropertyName: "className", publicName: "className", isSignal: true, isRequired: false, transformFunction: null }, style: { classPropertyName: "style", publicName: "style", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, iconPos: { classPropertyName: "iconPos", publicName: "iconPos", isSignal: true, isRequired: false, transformFunction: null }, styleClass: { classPropertyName: "styleClass", publicName: "styleClass", isSignal: true, isRequired: false, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, rounded: { classPropertyName: "rounded", publicName: "rounded", isSignal: true, isRequired: false, transformFunction: null }, badgeSeverity: { classPropertyName: "badgeSeverity", publicName: "badgeSeverity", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<div class=\"default-button\">\n  <p-button\n       [class]=\"className()\"\n       [type]=\"type()\"\n       [label]=\"label()\"\n       [style]=\"style()\"\n       [disabled]=\"disabled()\"\n       [icon]=\"icon()\"\n       [size]=\"size()\"\n       [iconPos]=\"iconPos()\"\n       [styleClass]=\"styleClass()\"\n       [badgeSeverity]=\"badgeSeverity()\"\n  >\n  </p-button>\n</div>\n", styles: [":host{display:inline-flex}.default-button{display:inline-flex}:host ::ng-deep .p-button{width:auto;min-width:8rem;justify-content:center;border-radius:.8rem;border:1px solid #2563eb;background:#2563eb;color:#fff;font-weight:600;box-shadow:0 1px 2px #0f172a14;transition:background-color .18s ease,border-color .18s ease,box-shadow .18s ease,transform .18s ease}:host ::ng-deep .p-button:not(:disabled):hover{background:#1d4ed8;border-color:#1d4ed8;box-shadow:0 10px 20px #2563eb33}:host ::ng-deep .p-button:not(:disabled):focus-visible{box-shadow:0 0 0 .25rem #3b82f633}:host ::ng-deep .p-button:disabled{background:#cbd5e1;border-color:#cbd5e1;color:#64748b}:host ::ng-deep .p-button.p-button-icon-only{min-width:2.5rem;width:2.5rem;height:2.5rem;padding:0;border-color:#cbd5e1;background:#fff;color:#2563eb;box-shadow:none}:host ::ng-deep .p-button.p-button-icon-only:not(:disabled):hover{background:#eff6ff;border-color:#93c5fd;color:#1d4ed8}\n"], dependencies: [{ kind: "ngmodule", type: ButtonModule }, { kind: "component", type: i1.Button, selector: "p-button", inputs: ["hostName", "type", "badge", "disabled", "raised", "rounded", "text", "plain", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "autofocus", "iconPos", "icon", "label", "loading", "loadingIcon", "severity", "buttonProps", "fluid"], outputs: ["onClick", "onFocus", "onBlur"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: ButtonComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'app-button', imports: [ButtonModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"default-button\">\n  <p-button\n       [class]=\"className()\"\n       [type]=\"type()\"\n       [label]=\"label()\"\n       [style]=\"style()\"\n       [disabled]=\"disabled()\"\n       [icon]=\"icon()\"\n       [size]=\"size()\"\n       [iconPos]=\"iconPos()\"\n       [styleClass]=\"styleClass()\"\n       [badgeSeverity]=\"badgeSeverity()\"\n  >\n  </p-button>\n</div>\n", styles: [":host{display:inline-flex}.default-button{display:inline-flex}:host ::ng-deep .p-button{width:auto;min-width:8rem;justify-content:center;border-radius:.8rem;border:1px solid #2563eb;background:#2563eb;color:#fff;font-weight:600;box-shadow:0 1px 2px #0f172a14;transition:background-color .18s ease,border-color .18s ease,box-shadow .18s ease,transform .18s ease}:host ::ng-deep .p-button:not(:disabled):hover{background:#1d4ed8;border-color:#1d4ed8;box-shadow:0 10px 20px #2563eb33}:host ::ng-deep .p-button:not(:disabled):focus-visible{box-shadow:0 0 0 .25rem #3b82f633}:host ::ng-deep .p-button:disabled{background:#cbd5e1;border-color:#cbd5e1;color:#64748b}:host ::ng-deep .p-button.p-button-icon-only{min-width:2.5rem;width:2.5rem;height:2.5rem;padding:0;border-color:#cbd5e1;background:#fff;color:#2563eb;box-shadow:none}:host ::ng-deep .p-button.p-button-icon-only:not(:disabled):hover{background:#eff6ff;border-color:#93c5fd;color:#1d4ed8}\n"] }]
+        }], propDecorators: { type: [{ type: i0.Input, args: [{ isSignal: true, alias: "type", required: false }] }], className: [{ type: i0.Input, args: [{ isSignal: true, alias: "className", required: false }] }], style: [{ type: i0.Input, args: [{ isSignal: true, alias: "style", required: false }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], iconPos: [{ type: i0.Input, args: [{ isSignal: true, alias: "iconPos", required: false }] }], styleClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "styleClass", required: false }] }], icon: [{ type: i0.Input, args: [{ isSignal: true, alias: "icon", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], rounded: [{ type: i0.Input, args: [{ isSignal: true, alias: "rounded", required: false }] }], badgeSeverity: [{ type: i0.Input, args: [{ isSignal: true, alias: "badgeSeverity", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], loading: [{ type: i0.Input, args: [{ isSignal: true, alias: "loading", required: false }] }] } });
+
+class CalendarComponent {
+    constructor() {
+        this.placeholder = input(...(ngDevMode ? [undefined, { debugName: "placeholder" }] : /* istanbul ignore next */ []));
+        this.maxDate = input(...(ngDevMode ? [undefined, { debugName: "maxDate" }] : /* istanbul ignore next */ []));
+        this.minDate = input(...(ngDevMode ? [undefined, { debugName: "minDate" }] : /* istanbul ignore next */ []));
+        this.disabled = input(false, ...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
+        this.touched = model(false, ...(ngDevMode ? [{ debugName: "touched" }] : /* istanbul ignore next */ []));
+        this.value = model(null, ...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
+        this.changed = output();
+        this.closed = output();
+    }
+    onChanged(event) {
+        this.value.set(event);
+        this.changed.emit(event);
+    }
+    onClosed() {
+        this.touched.set(true);
+        this.closed.emit();
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: CalendarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.18", type: CalendarComponent, isStandalone: true, selector: "global-calendar", inputs: { placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, maxDate: { classPropertyName: "maxDate", publicName: "maxDate", isSignal: true, isRequired: false, transformFunction: null }, minDate: { classPropertyName: "minDate", publicName: "minDate", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, touched: { classPropertyName: "touched", publicName: "touched", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { touched: "touchedChange", value: "valueChange", changed: "changed", closed: "closed" }, ngImport: i0, template: "<div class=\"app-calendar input-group input-group-sm\">\n  <p-floatlabel variant=\"on\">\n    <p-datepicker\n         [ngModel]=\"value()\"\n         (ngModelChange)=\"onChanged($event)\"\n         [inputId]=\"'calendar_' + (placeholder() || 'on_label')\"\n         showIcon\n         iconDisplay=\"input\"\n         [minDate]=\"minDate()\"\n         [maxDate]=\"maxDate()\"\n         [disabled]=\"disabled()\"\n         (onBlur)=\"onClosed()\"\n    ></p-datepicker>\n    <label>{{ placeholder() || 'On Label' }}</label>\n  </p-floatlabel>\n</div>\n", styles: [":host-context(.form-field_error) .p-datepicker-input{border-color:#dc2626!important}.app-calendar{width:100%}:host ::ng-deep .p-floatlabel{display:block}:host ::ng-deep .p-floatlabel label{color:#64748b}:host ::ng-deep .p-datepicker{width:100%}:host ::ng-deep .p-datepicker .p-inputtext,:host ::ng-deep .p-datepicker-input{min-height:2.75rem;width:100%;border:1px solid #cbd5e1;border-radius:.85rem;background:#fff;color:#0f172a;box-shadow:none;transition:border-color .18s ease,box-shadow .18s ease,background-color .18s ease}:host ::ng-deep .p-datepicker .p-inputtext:hover,:host ::ng-deep .p-datepicker-input:hover{border-color:#93c5fd}:host ::ng-deep .p-datepicker .p-inputtext:focus,:host ::ng-deep .p-datepicker-input:focus,:host ::ng-deep .p-datepicker .p-inputtext:focus-visible,:host ::ng-deep .p-datepicker-input:focus-visible{border-color:#3b82f6;box-shadow:0 0 0 .25rem #3b82f629;outline:none}:host ::ng-deep .p-datepicker:has(.p-datepicker-input:focus),:host ::ng-deep .p-datepicker:has(.p-inputtext:focus){border-radius:.85rem}:host ::ng-deep .p-datepicker.p-disabled .p-inputtext,:host ::ng-deep .p-datepicker .p-inputtext:disabled{background:#f8fafc;border-color:#e2e8f0;color:#94a3b8}:host ::ng-deep .p-datepicker-dropdown,:host ::ng-deep .p-datepicker-input-icon-container{color:#64748b}\n"], dependencies: [{ kind: "ngmodule", type: DatePickerModule }, { kind: "component", type: i1$1.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", "motionOptions"], outputs: ["onFocus", "onBlur", "onClose", "onSelect", "onClear", "onInput", "onTodayClick", "onClearClick", "onMonthChange", "onYearChange", "onClickOutside", "onShow"] }, { kind: "ngmodule", type: FloatLabelModule }, { kind: "component", type: i2.FloatLabel, selector: "p-floatlabel, p-floatLabel, p-float-label", inputs: ["variant"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: CalendarComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'global-calendar', imports: [DatePickerModule, FloatLabelModule, FormsModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"app-calendar input-group input-group-sm\">\n  <p-floatlabel variant=\"on\">\n    <p-datepicker\n         [ngModel]=\"value()\"\n         (ngModelChange)=\"onChanged($event)\"\n         [inputId]=\"'calendar_' + (placeholder() || 'on_label')\"\n         showIcon\n         iconDisplay=\"input\"\n         [minDate]=\"minDate()\"\n         [maxDate]=\"maxDate()\"\n         [disabled]=\"disabled()\"\n         (onBlur)=\"onClosed()\"\n    ></p-datepicker>\n    <label>{{ placeholder() || 'On Label' }}</label>\n  </p-floatlabel>\n</div>\n", styles: [":host-context(.form-field_error) .p-datepicker-input{border-color:#dc2626!important}.app-calendar{width:100%}:host ::ng-deep .p-floatlabel{display:block}:host ::ng-deep .p-floatlabel label{color:#64748b}:host ::ng-deep .p-datepicker{width:100%}:host ::ng-deep .p-datepicker .p-inputtext,:host ::ng-deep .p-datepicker-input{min-height:2.75rem;width:100%;border:1px solid #cbd5e1;border-radius:.85rem;background:#fff;color:#0f172a;box-shadow:none;transition:border-color .18s ease,box-shadow .18s ease,background-color .18s ease}:host ::ng-deep .p-datepicker .p-inputtext:hover,:host ::ng-deep .p-datepicker-input:hover{border-color:#93c5fd}:host ::ng-deep .p-datepicker .p-inputtext:focus,:host ::ng-deep .p-datepicker-input:focus,:host ::ng-deep .p-datepicker .p-inputtext:focus-visible,:host ::ng-deep .p-datepicker-input:focus-visible{border-color:#3b82f6;box-shadow:0 0 0 .25rem #3b82f629;outline:none}:host ::ng-deep .p-datepicker:has(.p-datepicker-input:focus),:host ::ng-deep .p-datepicker:has(.p-inputtext:focus){border-radius:.85rem}:host ::ng-deep .p-datepicker.p-disabled .p-inputtext,:host ::ng-deep .p-datepicker .p-inputtext:disabled{background:#f8fafc;border-color:#e2e8f0;color:#94a3b8}:host ::ng-deep .p-datepicker-dropdown,:host ::ng-deep .p-datepicker-input-icon-container{color:#64748b}\n"] }]
+        }], propDecorators: { placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], maxDate: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxDate", required: false }] }], minDate: [{ type: i0.Input, args: [{ isSignal: true, alias: "minDate", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], touched: [{ type: i0.Input, args: [{ isSignal: true, alias: "touched", required: false }] }, { type: i0.Output, args: ["touchedChange"] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }, { type: i0.Output, args: ["valueChange"] }], changed: [{ type: i0.Output, args: ["changed"] }], closed: [{ type: i0.Output, args: ["closed"] }] } });
+
+class ChartsComponent {
+    constructor() {
+        this.data = input(null, ...(ngDevMode ? [{ debugName: "data" }] : /* istanbul ignore next */ []));
+        this.options = input(null, ...(ngDevMode ? [{ debugName: "options" }] : /* istanbul ignore next */ []));
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: ChartsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.18", type: ChartsComponent, isStandalone: true, selector: "app-charts", inputs: { data: { classPropertyName: "data", publicName: "data", isSignal: true, isRequired: false, transformFunction: null }, options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<div class=\"card flex justify-center\">\n  <p-chart type=\"pie\"\n           [data]=\"data()\"\n           [options]=\"options()\"\n           class=\"w-full md:w-[30rem]\"\n  />\n</div>\n", styles: [""], dependencies: [{ kind: "component", type: UIChart, selector: "p-chart", inputs: ["type", "plugins", "width", "height", "responsive", "ariaLabel", "ariaLabelledBy", "data", "options"], outputs: ["onDataSelect"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: ChartsComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'app-charts', imports: [
+                        UIChart
+                    ], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"card flex justify-center\">\n  <p-chart type=\"pie\"\n           [data]=\"data()\"\n           [options]=\"options()\"\n           class=\"w-full md:w-[30rem]\"\n  />\n</div>\n" }]
+        }], propDecorators: { data: [{ type: i0.Input, args: [{ isSignal: true, alias: "data", required: false }] }], options: [{ type: i0.Input, args: [{ isSignal: true, alias: "options", required: false }] }] } });
+
+class FormFieldComponent {
+    constructor() {
+        this.cdr = inject(ChangeDetectorRef);
+        this.label = input(...(ngDevMode ? [undefined, { debugName: "label" }] : /* istanbul ignore next */ []));
+        this.required = input(false, ...(ngDevMode ? [{ debugName: "required" }] : /* istanbul ignore next */ []));
+        this.isInline = input(true, ...(ngDevMode ? [{ debugName: "isInline" }] : /* istanbul ignore next */ []));
+        this.showLabel = input(false, ...(ngDevMode ? [{ debugName: "showLabel" }] : /* istanbul ignore next */ []));
+        this.field = input.required(...(ngDevMode ? [{ debugName: "field" }] : /* istanbul ignore next */ []));
+        this.patternError = input(...(ngDevMode ? [undefined, { debugName: "patternError" }] : /* istanbul ignore next */ []));
+        effect(() => {
+            const control = this.field();
+            if (!this.isAbstractControl(control))
+                return;
+            const sub = merge(control.statusChanges, control.valueChanges)
+                .pipe(startWith(null))
+                .subscribe(() => this.cdr.markForCheck());
+            return () => sub.unsubscribe();
+        });
+        effect(() => {
+            const fieldState = this.getSignalFieldState(this.field());
+            if (!fieldState)
+                return;
+            fieldState.invalid();
+            fieldState.touched();
+            fieldState.errors();
+            this.cdr.markForCheck();
+        });
+    }
+    hasError() {
+        const control = this.field();
+        if (this.isAbstractControl(control)) {
+            return control.invalid && control.touched;
+        }
+        const fieldState = this.getSignalFieldState(control);
+        return !!fieldState && fieldState.invalid() && fieldState.touched();
+    }
+    get errorKey() {
+        const control = this.field();
+        if (this.isAbstractControl(control)) {
+            const errs = control.errors ?? null;
+            return errs ? Object.keys(errs)[0] : null;
+        }
+        const fieldState = this.getSignalFieldState(control);
+        const firstError = fieldState?.errors()?.[0];
+        if (!firstError)
+            return null;
+        if (firstError.kind === 'minLength')
+            return 'minlength';
+        if (firstError.kind === 'maxLength')
+            return 'maxlength';
+        return firstError.kind ?? null;
+    }
+    get errorValue() {
+        const key = this.errorKey;
+        if (!key)
+            return null;
+        const control = this.field();
+        if (this.isAbstractControl(control)) {
+            return control.errors?.[key] ?? null;
+        }
+        const fieldState = this.getSignalFieldState(control);
+        return fieldState?.errors()?.[0] ?? null;
+    }
+    isAbstractControl(value) {
+        return !!value
+            && typeof value === 'object'
+            && 'valueChanges' in value
+            && 'statusChanges' in value;
+    }
+    getSignalFieldState(value) {
+        const candidate = typeof value === 'function' ? value() : value;
+        if (!candidate || typeof candidate !== 'object')
+            return null;
+        const state = candidate;
+        if (typeof state.invalid !== 'function')
+            return null;
+        if (typeof state.touched !== 'function')
+            return null;
+        if (typeof state.errors !== 'function')
+            return null;
+        return state;
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: FormFieldComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.18", type: FormFieldComponent, isStandalone: true, selector: "app-form-field", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, required: { classPropertyName: "required", publicName: "required", isSignal: true, isRequired: false, transformFunction: null }, isInline: { classPropertyName: "isInline", publicName: "isInline", isSignal: true, isRequired: false, transformFunction: null }, showLabel: { classPropertyName: "showLabel", publicName: "showLabel", isSignal: true, isRequired: false, transformFunction: null }, field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: true, transformFunction: null }, patternError: { classPropertyName: "patternError", publicName: "patternError", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<div class=\"form-field\" [class.form-field_error]=\"hasError()\" [class.form-field_inline]=\"isInline()\">\n  @if (showLabel()) {\n    <label class=\"form-field__label\">\n      <span class=\"form-field__label-text\">{{ label() }}</span>\n      @if (required()) {\n        <span class=\"form-field__req\">*</span>\n      }\n    </label>\n  }\n\n  <div class=\"form-field__control\">\n    <ng-content></ng-content>\n\n    <div class=\"form-field__error\">\n      @if(errorKey; as key) {\n        @switch(errorKey) {\n          @case(\"min\") {\n            <span>Minimum {{errorValue?.min}}</span>\n          }\n          @case(\"max\") {\n            <span>Maximum {{errorValue?.max}}</span>\n          }\n          @case(\"required\") {\n            <span>{{'ERRORS.FIELD_REQUIRED' | translate}}</span>\n          }\n          @case(\"minlength\") {\n            <span>At least {{errorValue?.requiredLength}} characters</span>\n          }\n          @case(\"maxlength\") {\n            <span>No more than {{errorValue?.requiredLength}} characters</span>\n          }\n          @case(\"startsWith\") {\n            <span>{{errorValue}} Test</span>\n          }\n          @case(\"startsWithParam\") {\n            <span>{{errorValue?.message}} Test</span>\n          }\n          @default {\n            @if (key === \"pattern\") {\n              <span>\n                @if (patternError()) {\n                  <span>{{patternError()}}</span>\n                }\n                @if (!patternError()) {\n                  <span>Pattern does not match</span>\n                }\n              </span>\n            }\n          }\n        }\n      }\n    </div>\n  </div>\n</div>\n", styles: [".form-field{padding-bottom:8px}.form-field__label{display:block;margin:.25rem 0 0}.form-field__label-text{color:#475569;font-size:.92rem;font-weight:600}.form-field__control{display:block}.form-field__error{opacity:0;font-size:.78rem;color:#b91c1c;position:static;margin-top:.35rem}.form-field__error span{display:block}.form-field_error .form-field__error{opacity:1}.form-field .form-field__warning{font-size:12px;color:#c8741f;position:static;margin-top:.35rem}.form-field .form-field__warning span{display:block}.form-field_inline{display:flex}.form-field_inline>.form-field__label{align-self:flex-start;flex:1 0 auto;padding-right:1.1em;padding-top:.85rem}.form-field_inline>.form-field__control{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1$3.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: FormFieldComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'app-form-field', imports: [
+                        TranslateModule
+                    ], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"form-field\" [class.form-field_error]=\"hasError()\" [class.form-field_inline]=\"isInline()\">\n  @if (showLabel()) {\n    <label class=\"form-field__label\">\n      <span class=\"form-field__label-text\">{{ label() }}</span>\n      @if (required()) {\n        <span class=\"form-field__req\">*</span>\n      }\n    </label>\n  }\n\n  <div class=\"form-field__control\">\n    <ng-content></ng-content>\n\n    <div class=\"form-field__error\">\n      @if(errorKey; as key) {\n        @switch(errorKey) {\n          @case(\"min\") {\n            <span>Minimum {{errorValue?.min}}</span>\n          }\n          @case(\"max\") {\n            <span>Maximum {{errorValue?.max}}</span>\n          }\n          @case(\"required\") {\n            <span>{{'ERRORS.FIELD_REQUIRED' | translate}}</span>\n          }\n          @case(\"minlength\") {\n            <span>At least {{errorValue?.requiredLength}} characters</span>\n          }\n          @case(\"maxlength\") {\n            <span>No more than {{errorValue?.requiredLength}} characters</span>\n          }\n          @case(\"startsWith\") {\n            <span>{{errorValue}} Test</span>\n          }\n          @case(\"startsWithParam\") {\n            <span>{{errorValue?.message}} Test</span>\n          }\n          @default {\n            @if (key === \"pattern\") {\n              <span>\n                @if (patternError()) {\n                  <span>{{patternError()}}</span>\n                }\n                @if (!patternError()) {\n                  <span>Pattern does not match</span>\n                }\n              </span>\n            }\n          }\n        }\n      }\n    </div>\n  </div>\n</div>\n", styles: [".form-field{padding-bottom:8px}.form-field__label{display:block;margin:.25rem 0 0}.form-field__label-text{color:#475569;font-size:.92rem;font-weight:600}.form-field__control{display:block}.form-field__error{opacity:0;font-size:.78rem;color:#b91c1c;position:static;margin-top:.35rem}.form-field__error span{display:block}.form-field_error .form-field__error{opacity:1}.form-field .form-field__warning{font-size:12px;color:#c8741f;position:static;margin-top:.35rem}.form-field .form-field__warning span{display:block}.form-field_inline{display:flex}.form-field_inline>.form-field__label{align-self:flex-start;flex:1 0 auto;padding-right:1.1em;padding-top:.85rem}.form-field_inline>.form-field__control{width:100%}\n"] }]
+        }], ctorParameters: () => [], propDecorators: { label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], required: [{ type: i0.Input, args: [{ isSignal: true, alias: "required", required: false }] }], isInline: [{ type: i0.Input, args: [{ isSignal: true, alias: "isInline", required: false }] }], showLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "showLabel", required: false }] }], field: [{ type: i0.Input, args: [{ isSignal: true, alias: "field", required: true }] }], patternError: [{ type: i0.Input, args: [{ isSignal: true, alias: "patternError", required: false }] }] } });
+
+class BasicInputComponent {
+    constructor() {
+        this.placeholder = input("Input some text...", ...(ngDevMode ? [{ debugName: "placeholder" }] : /* istanbul ignore next */ []));
+        this.labelType = input("in_label", ...(ngDevMode ? [{ debugName: "labelType" }] : /* istanbul ignore next */ []));
+        this.isDisabled = input(false, ...(ngDevMode ? [{ debugName: "isDisabled" }] : /* istanbul ignore next */ []));
+        this.value = model('', ...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
+        this.touched = model(false, ...(ngDevMode ? [{ debugName: "touched" }] : /* istanbul ignore next */ []));
+        this.changed = output();
+    }
+    onKeyup(event) {
+        const value = event.target.value;
+        this.value.set(value);
+        this.changed.emit(value);
+    }
+    onBlur() {
+        this.touched.set(true);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: BasicInputComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.18", type: BasicInputComponent, isStandalone: true, selector: "app-basic-input", inputs: { placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, labelType: { classPropertyName: "labelType", publicName: "labelType", isSignal: true, isRequired: false, transformFunction: null }, isDisabled: { classPropertyName: "isDisabled", publicName: "isDisabled", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, touched: { classPropertyName: "touched", publicName: "touched", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange", touched: "touchedChange", changed: "changed" }, ngImport: i0, template: "<div class=\"basic-input\">\n  <p-floatlabel>\n    <input\n      type=\"text\"\n      pInputText\n      class=\"app-input\"\n      [disabled]=\"isDisabled()\"\n      (keyup)=\"onKeyup($event)\"\n      (blur)=\"onBlur()\"\n      [value]=\"value()\"\n    />\n    <label for=\"labelType()\">{{placeholder()}}</label>\n  </p-floatlabel>\n</div>\n\n", styles: [":host-context(.form-field_error) .app-input{border-color:#dc2626!important}:host{display:block;width:100%}.basic-input{width:100%}:host ::ng-deep .p-floatlabel{display:block}:host ::ng-deep .p-floatlabel label{color:#64748b}.app-input{min-height:2.75rem;border:1px solid #cbd5e1;border-radius:.85rem;background-color:#fff;color:#0f172a;width:100%;padding:.85rem .95rem .35rem;transition:border-color .18s ease,box-shadow .18s ease,background-color .18s ease}.app-input_disabled{background:#f8fafc;border:1px solid #e2e8f0;color:#94a3b8}:host ::ng-deep .app-input:hover{border-color:#93c5fd}:host ::ng-deep .app-input:focus,:host ::ng-deep .app-input:focus-visible{border-color:#3b82f6;box-shadow:0 0 0 .25rem #3b82f629;outline:none}\n"], dependencies: [{ kind: "ngmodule", type: InputTextModule }, { kind: "directive", type: i1$4.InputText, selector: "[pInputText]", inputs: ["hostName", "ptInputText", "pInputTextPT", "pInputTextUnstyled", "pSize", "variant", "fluid", "invalid"] }, { kind: "component", type: FloatLabel, selector: "p-floatlabel, p-floatLabel, p-float-label", inputs: ["variant"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: BasicInputComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'app-basic-input', standalone: true, imports: [InputTextModule, FloatLabel], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"basic-input\">\n  <p-floatlabel>\n    <input\n      type=\"text\"\n      pInputText\n      class=\"app-input\"\n      [disabled]=\"isDisabled()\"\n      (keyup)=\"onKeyup($event)\"\n      (blur)=\"onBlur()\"\n      [value]=\"value()\"\n    />\n    <label for=\"labelType()\">{{placeholder()}}</label>\n  </p-floatlabel>\n</div>\n\n", styles: [":host-context(.form-field_error) .app-input{border-color:#dc2626!important}:host{display:block;width:100%}.basic-input{width:100%}:host ::ng-deep .p-floatlabel{display:block}:host ::ng-deep .p-floatlabel label{color:#64748b}.app-input{min-height:2.75rem;border:1px solid #cbd5e1;border-radius:.85rem;background-color:#fff;color:#0f172a;width:100%;padding:.85rem .95rem .35rem;transition:border-color .18s ease,box-shadow .18s ease,background-color .18s ease}.app-input_disabled{background:#f8fafc;border:1px solid #e2e8f0;color:#94a3b8}:host ::ng-deep .app-input:hover{border-color:#93c5fd}:host ::ng-deep .app-input:focus,:host ::ng-deep .app-input:focus-visible{border-color:#3b82f6;box-shadow:0 0 0 .25rem #3b82f629;outline:none}\n"] }]
+        }], propDecorators: { placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], labelType: [{ type: i0.Input, args: [{ isSignal: true, alias: "labelType", required: false }] }], isDisabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "isDisabled", required: false }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }, { type: i0.Output, args: ["valueChange"] }], touched: [{ type: i0.Input, args: [{ isSignal: true, alias: "touched", required: false }] }, { type: i0.Output, args: ["touchedChange"] }], changed: [{ type: i0.Output, args: ["changed"] }] } });
+
+class TableComponent {
+    constructor(cd) {
+        this.cd = cd;
+        this.rows = 10;
+        this.currentlyEditingRow = null;
+        this.originalByRow = new WeakMap();
+        // Local signal to track the index of the currently editing row
+        this.editingRowIndex = signal(null, ...(ngDevMode ? [{ debugName: "editingRowIndex" }] : /* istanbul ignore next */ []));
+        this.dataSource = input([], ...(ngDevMode ? [{ debugName: "dataSource" }] : /* istanbul ignore next */ []));
+        // Computed signal that enriches data with _editing flag without mutating input
+        this.enrichedDataSource = computed(() => {
+            const data = this.dataSource();
+            const editIndex = this.editingRowIndex();
+            if (editIndex === null) {
+                return data;
+            }
+            return data.map((row, index) => ({
+                ...row,
+                _editing: index === editIndex
+            }));
+        }, ...(ngDevMode ? [{ debugName: "enrichedDataSource" }] : /* istanbul ignore next */ []));
+        this.dataSourceColumns = input([], ...(ngDevMode ? [{ debugName: "dataSourceColumns" }] : /* istanbul ignore next */ []));
+        this.iconColor = input('', ...(ngDevMode ? [{ debugName: "iconColor" }] : /* istanbul ignore next */ []));
+        this.iconClass = input('', ...(ngDevMode ? [{ debugName: "iconClass" }] : /* istanbul ignore next */ []));
+        this.msgTooltip = input('', ...(ngDevMode ? [{ debugName: "msgTooltip" }] : /* istanbul ignore next */ []));
+        this.paginator = input(false, ...(ngDevMode ? [{ debugName: "paginator" }] : /* istanbul ignore next */ []));
+        this.selectionMode = input(null, ...(ngDevMode ? [{ debugName: "selectionMode" }] : /* istanbul ignore next */ []));
+        this.scrollable = input(true, ...(ngDevMode ? [{ debugName: "scrollable" }] : /* istanbul ignore next */ []));
+        this.metaKeySelection = input(...(ngDevMode ? [undefined, { debugName: "metaKeySelection" }] : /* istanbul ignore next */ []));
+        this.resizableColumns = input(false, ...(ngDevMode ? [{ debugName: "resizableColumns" }] : /* istanbul ignore next */ []));
+        this.selectedRowValue = input(...(ngDevMode ? [undefined, { debugName: "selectedRowValue" }] : /* istanbul ignore next */ []));
+        this.showIconSort = input(true, ...(ngDevMode ? [{ debugName: "showIconSort" }] : /* istanbul ignore next */ []));
+        this.showRowActions = input(true, ...(ngDevMode ? [{ debugName: "showRowActions" }] : /* istanbul ignore next */ []));
+        this.showIconCondition = input(false, ...(ngDevMode ? [{ debugName: "showIconCondition" }] : /* istanbul ignore next */ []));
+        this.showFilterCondition = input(...(ngDevMode ? [undefined, { debugName: "showFilterCondition" }] : /* istanbul ignore next */ []));
+        this.editableFieldName = input(...(ngDevMode ? [undefined, { debugName: "editableFieldName" }] : /* istanbul ignore next */ [])); // Optional: explicitly specify which field is editable
+        this.customSortFun = false;
+        this.editModel = signal({ inputValue: '' }, ...(ngDevMode ? [{ debugName: "editModel" }] : /* istanbul ignore next */ []));
+        this.initialForm = form(this.editModel, (p) => {
+            required(p.inputValue);
+        });
+        //outputs
+        this.selectRow = output();
+        this.unselectRow = output();
+        this.cellEdit = output();
+        this.rowUpdate = output();
+        effect(() => {
+            const ds = this.enrichedDataSource();
+            if (ds?.length && this.table) {
+                this.table.first = 0;
+            }
+        });
+    }
+    onSelectedRow(event) {
+        if (!event.data || Array.isArray(event.data) || event.index === undefined)
+            return;
+        this.selectRow.emit({ row: event.data, rowIndex: event.index });
+    }
+    onRowUnselect() {
+        this.unselectRow.emit(null);
+    }
+    onCustomSort(event) {
+        const { data, field, order } = event;
+        if (!field)
+            return;
+        const col = this.dataSourceColumns().find(c => c.field === field);
+        if (!col)
+            return;
+        if (!data)
+            return;
+        data.sort((a, b) => {
+            const av = a[field];
+            const bv = b[field];
+            if (this.isDateType(col.type)) {
+                const ad = new Date(av);
+                const bd = new Date(bv);
+                return (ad.getTime() - bd.getTime()) * (order ?? 1);
+            }
+            if (typeof av === 'number' && typeof bv === 'number') {
+                return (av - bv) * (order ?? 1);
+            }
+            return String(av).localeCompare(String(bv)) * (order ?? 1);
+        });
+    }
+    takeSnapshot(row) {
+        const snap = {};
+        (this.dataSourceColumns() || [])
+            .filter(c => c && c.modificable)
+            .forEach(c => snap[c.field] = row[c.field]);
+        this.originalByRow.set(row, snap);
+    }
+    revertFromSnapshot(row) {
+        const snap = this.originalByRow.get(row);
+        if (snap) {
+            Object.keys(snap).forEach(k => row[k] = snap[k]);
+            this.originalByRow.delete(row);
+        }
+    }
+    /**
+     * Determines the field name to edit.
+     * Priority: 1) explicit editableFieldName input, 2) first modificable column
+     */
+    getEditableField() {
+        // First, check if editableFieldName is explicitly provided
+        const explicitField = this.editableFieldName();
+        if (explicitField) {
+            return explicitField;
+        }
+        // Otherwise, find the first modificable column
+        const modificableCol = this.dataSourceColumns().find(col => col.modificable);
+        return modificableCol?.field ?? null;
+    }
+    /**
+     * Determines if a column type is a date type
+     */
+    isDateType(type) {
+        return type === 'date' || type === 'datetime' || type === 'date-mes' || type === 'date-reverse';
+    }
+    /**
+     * Determines if a column should use custom cell template
+     */
+    shouldUseCustomCell(col) {
+        return this.isDateType(col.type)
+            || col.type === 'icon'
+            || col.type === 'decimal'
+            || col.type === 'clickable';
+    }
+    startEdit(row, rowIndex) {
+        // Dynamically get the editable field instead of hardcoding 'Valor'
+        const editableField = this.getEditableField();
+        if (!editableField) {
+            console.warn('No editable field found. Make sure at least one column has modificable: true or provide editableFieldName input.');
+            return;
+        }
+        this.editModel.set({ inputValue: String(row[editableField] ?? '') });
+        // If another row was being edited, revert its changes
+        if (this.currentlyEditingRow && this.currentlyEditingRow !== row) {
+            this.revertFromSnapshot(this.currentlyEditingRow);
+        }
+        // Update the editing index signal (no mutation of input data)
+        this.editingRowIndex.set(rowIndex);
+        this.takeSnapshot(row);
+        this.currentlyEditingRow = row;
+        this.cd.markForCheck();
+    }
+    confirmEdit(row) {
+        const editableField = this.getEditableField();
+        if (!editableField) {
+            console.warn('No editable field found.');
+            return;
+        }
+        // Clear the editing state
+        this.editingRowIndex.set(null);
+        this.originalByRow.delete(row);
+        this.currentlyEditingRow = null;
+        this.rowUpdate.emit({
+            data: row,
+            field: editableField,
+            newValue: this.editModel().inputValue,
+        });
+    }
+    cancelEdit(row) {
+        const snap = this.originalByRow.get(row);
+        if (snap) {
+            Object.keys(snap).forEach(k => row[k] = snap[k]);
+            this.originalByRow.delete(row);
+        }
+        // Clear the editing state
+        this.editingRowIndex.set(null);
+        this.currentlyEditingRow = null;
+        this.cd.markForCheck();
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: TableComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.18", type: TableComponent, isStandalone: true, selector: "app-table", inputs: { dataSource: { classPropertyName: "dataSource", publicName: "dataSource", isSignal: true, isRequired: false, transformFunction: null }, dataSourceColumns: { classPropertyName: "dataSourceColumns", publicName: "dataSourceColumns", isSignal: true, isRequired: false, transformFunction: null }, iconColor: { classPropertyName: "iconColor", publicName: "iconColor", isSignal: true, isRequired: false, transformFunction: null }, iconClass: { classPropertyName: "iconClass", publicName: "iconClass", isSignal: true, isRequired: false, transformFunction: null }, msgTooltip: { classPropertyName: "msgTooltip", publicName: "msgTooltip", isSignal: true, isRequired: false, transformFunction: null }, paginator: { classPropertyName: "paginator", publicName: "paginator", isSignal: true, isRequired: false, transformFunction: null }, selectionMode: { classPropertyName: "selectionMode", publicName: "selectionMode", isSignal: true, isRequired: false, transformFunction: null }, scrollable: { classPropertyName: "scrollable", publicName: "scrollable", isSignal: true, isRequired: false, transformFunction: null }, metaKeySelection: { classPropertyName: "metaKeySelection", publicName: "metaKeySelection", isSignal: true, isRequired: false, transformFunction: null }, resizableColumns: { classPropertyName: "resizableColumns", publicName: "resizableColumns", isSignal: true, isRequired: false, transformFunction: null }, selectedRowValue: { classPropertyName: "selectedRowValue", publicName: "selectedRowValue", isSignal: true, isRequired: false, transformFunction: null }, showIconSort: { classPropertyName: "showIconSort", publicName: "showIconSort", isSignal: true, isRequired: false, transformFunction: null }, showRowActions: { classPropertyName: "showRowActions", publicName: "showRowActions", isSignal: true, isRequired: false, transformFunction: null }, showIconCondition: { classPropertyName: "showIconCondition", publicName: "showIconCondition", isSignal: true, isRequired: false, transformFunction: null }, showFilterCondition: { classPropertyName: "showFilterCondition", publicName: "showFilterCondition", isSignal: true, isRequired: false, transformFunction: null }, editableFieldName: { classPropertyName: "editableFieldName", publicName: "editableFieldName", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { selectRow: "selectRow", unselectRow: "unselectRow", cellEdit: "cellEdit", rowUpdate: "rowUpdate" }, queries: [{ propertyName: "customCellTemplate", first: true, predicate: ["customCellTemplate"], descendants: true }], viewQueries: [{ propertyName: "table", first: true, predicate: ["table"], descendants: true }], ngImport: i0, template: "<p-table #table class=\"custom-table\"\n         [columns]=\"dataSourceColumns()\"\n         [value]=\"enrichedDataSource()\"\n         [paginator]=\"paginator()\"\n         [scrollable]=\"scrollable()\"\n         [resizableColumns]=\"resizableColumns()\"\n         [selection]=\"selectedRowValue()\"\n         [selectionMode]=\"selectionMode()\"\n         [customSort]=\"customSortFun\"\n         [rowsPerPageOptions]=\"[10, 25, 100]\"\n         (onRowSelect)=\"onSelectedRow($event)\"\n         (onRowUnselect)=\"onRowUnselect()\"\n         (onSort)=\"onCustomSort($event)\"\n         [rows]=\"rows\">\n  <ng-template #header let-columns pTemplate=\"header\">\n    <tr >\n      @for (col of columns; track $index) {\n        <th pResizableColumn\n            [pSortableColumn]=\"col.field\"\n            [hidden]=\"!col.visible\"\n            [style]=\"{'min-width': col.minWidth || '100px', 'width': col.width, 'text-align': col.textAlign}\"\n            scope=\"col\"\n        >\n          {{ col.header | translate }}\n          @if (showIconSort() && col.field !== showFilterCondition) {\n            <p-sortIcon [field]=\"col.field\"></p-sortIcon>\n          }\n        </th>\n      }\n\n      @if (showRowActions()) {\n        <th\n             scope=\"col\"\n             [attr.id]=\"'actions-col'\"\n             [style]=\"{ width: '7%' }\"\n        >\n            <span class=\"sr-only\">\n              {{ 'Action' | translate }}\n            </span>\n        </th>\n      }\n    </tr>\n  </ng-template>\n  <ng-template #body let-rowData let-rowIndex=\"rowIndex\" let-columns=\"columns\" pTemplate=\"body\">\n    <tr [pSelectableRow]=\"rowData\"\n        [pSelectableRowIndex]=\"rowIndex\"\n    >\n      @for (col of columns; track $index) {\n        <td  [style]=\"{'min-width': col.minWidth || '100px', 'width': col.width, 'text-align': col.textAlign}\"\n             [hidden]=\"!col.visible\"\n        >\n          @if (customCellTemplate && col.type === 'especial') {\n            <ng-container\n                 *ngTemplateOutlet=\"customCellTemplate; context: { $implicit: rowData, col: col }\"></ng-container>\n          } @else {\n              @if (rowData._editing && col.modificable) {\n\n                <form (keydown.enter)=\"confirmEdit(rowData)\">\n                  <app-form-field\n                       [required]=\"true\"\n                       [field]=\"initialForm.inputValue\">\n                    <app-basic-input\n                         [placeholder]=\"''\"\n                         [formField]=\"initialForm.inputValue\"\n                    ></app-basic-input>\n                  </app-form-field>\n                </form>\n\n              } @else {\n                <ng-container *ngTemplateOutlet=\"\n                                      shouldUseCustomCell(col)\n                                        ? customCell\n                                        : defaultCell;\n                                      context: { $implicit: rowData, col: col }\n                                    \"></ng-container>\n              }\n          }\n        </td>\n      }\n\n      @if (showRowActions()) {\n        <td class=\"action-cell\"\n            [attr.headers]=\"'actions-col'\"\n        >\n          <div class=\"button-cell\">\n            @if (!rowData._editing) {\n              <app-button (click)=\"startEdit(rowData, rowIndex)\"\n                          [iconPos]=\"'left'\"\n                          [icon]=\"'pi pi-pencil'\"\n                          [disabled]=\"rowData._editing\"\n              ></app-button>\n            }\n\n            @if (rowData._editing) {\n              <app-button (click)=\"confirmEdit(rowData)\"\n                          [iconPos]=\"'left'\"\n                          [icon]=\"'pi pi-check'\"\n              ></app-button>\n              <app-button\n                   (click)=\"cancelEdit(rowData)\"\n                   [iconPos]=\"'left'\"\n                   [icon]=\"'pi pi-times'\"\n              ></app-button>\n            }\n          </div>\n        </td>\n      }\n    </tr>\n  </ng-template>\n\n  <ng-template #customCell let-rowData=\"$implicit\" let-col=\"col\">\n    @switch (col.type) {\n      @case ('datetime') {\n        <span>{{ rowData[col.field] | date:'dd-MM-yyyy HH:mm' }}</span>\n      }\n      @case ('date-mes') {\n        <span>{{ rowData[col.field] | date:'MM-yyyy' }}</span>\n      }\n      @case ('date') {\n        <span>{{ rowData[col.field] }}</span>\n      }\n      @case ('date-reverse') {\n        <span>{{ rowData[col.field] | date:'YYYY-MM-DD' }}</span>\n      }\n      @case ('decimal') {\n        <span>{{ rowData[col.field] }}</span>\n      }\n      @case ('icon') {\n        @if (rowData[col.field] === showIconCondition()) {\n          <div>\n            <div class=\"tooltip-wrapper\">\n              <em [class]=\"iconClass()\"\n                  [style]=\"{ color: iconColor() }\"></em>\n              <span class=\"tooltip-text\">{{ rowData.ToolTipMsg || msgTooltip | translate }}</span>\n            </div>\n          </div>\n        }\n      }\n      @case ('clickable') {\n        <span class=\"clickable\" (click)=\"startEdit(rowData, col.rowIndex)\">{{ rowData[col.field] }}</span>\n      }\n    }\n  </ng-template>\n\n  <ng-template #defaultCell let-rowData=\"$implicit\" let-col=\"col\">\n    @if (rowData !== null) {\n      <span>{{ rowData[col.field] }}</span>\n    }\n  </ng-template>\n</p-table>\n", styles: [":host ::ng-deep .app-input{height:1.9rem;color:#495057;width:100%;padding-left:.2rem;margin:-1rem 0rem -1rem -.3rem;background-color:#fff}:host::ng-deep .ui-inputtext{height:2.1rem;color:#495057;width:100%}:host::ng-deep .ui-inputtext:focus{border:1px solid rgb(135,220,55)!important;-webkit-box-shadow:0 0 0 .2rem rgba(72,126,22,.25)!important;box-shadow:0 0 0 .2rem #487e1640!important;outline:none!important}:host::ng-deep .ui-inputtext:hover{border:1px solid rgb(206,212,218)!important}:host::ng-deep .ui-inputtext[disabled]{background:#0000000d;border:1px solid rgba(0,0,0,.18);color:#000}:host ::ng-deep .custom-table{table-layout:auto;width:100%}:host ::ng-deep .custom-table .p-datatable-table-container{border:1px solid #dbe5f0;border-radius:1rem;overflow:hidden}:host ::ng-deep .custom-table .p-datatable-thead>tr>th{padding:.95rem 1rem;background:#f8fafc;border-color:#dbe5f0;color:#334155;font-size:.86rem;font-weight:700}:host ::ng-deep .custom-table .p-datatable-tbody>tr>td{padding:.95rem 1rem;background-color:#fff;border-color:#e2e8f0;color:#0f172a}:host ::ng-deep .custom-table .p-datatable-tbody>tr:nth-child(2n)>td{background:#f8fbff}:host ::ng-deep .custom-table .p-datatable-tbody>tr:hover>td{background:#eff6ff}:host ::ng-deep .custom-table th,:host ::ng-deep .custom-table td{white-space:normal;word-wrap:break-word;overflow-wrap:anywhere;min-width:100px}:host ::ng-deep .custom-table .p-datatable-table-container,:host ::ng-deep .custom-table .ui-table-scrollable-body{overflow-x:auto}.tooltip-wrapper{position:relative;display:inline-block}.tooltip-wrapper .tooltip-text{visibility:hidden;background-color:#0f172a;color:#fff;text-align:center;padding:.45rem .6rem;border-radius:.5rem;position:absolute;z-index:1;left:150%;top:50%;transform:translateY(-50%);white-space:nowrap;opacity:0;transition:opacity .3s}.tooltip-wrapper:hover .tooltip-text{visibility:visible;opacity:1}.action-col,.action-cell{width:7%;text-align:center;white-space:nowrap;background:inherit}.action-col .button-cell,.action-cell .button-cell{display:flex;justify-content:center;gap:.4rem}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}:host ::ng-deep .clickable{cursor:pointer;display:block;width:100%;color:#2563eb}:host ::ng-deep .custom-table .p-sortable-column-icon,:host ::ng-deep .custom-table .p-paginator,:host ::ng-deep .custom-table .p-paginator-page,:host ::ng-deep .custom-table .p-paginator-next,:host ::ng-deep .custom-table .p-paginator-prev,:host ::ng-deep .custom-table .p-paginator-first,:host ::ng-deep .custom-table .p-paginator-last{color:#475569}:host ::ng-deep .custom-table .p-paginator{border:none;padding-top:1rem;background:transparent}\n"], dependencies: [{ kind: "ngmodule", type: TableModule }, { kind: "component", type: i1$5.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: i2$1.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "directive", type: i1$5.SortableColumn, selector: "[pSortableColumn]", inputs: ["pSortableColumn", "pSortableColumnDisabled"] }, { kind: "directive", type: i1$5.SelectableRow, selector: "[pSelectableRow]", inputs: ["pSelectableRow", "pSelectableRowIndex", "pSelectableRowDisabled"] }, { kind: "directive", type: i1$5.ResizableColumn, selector: "[pResizableColumn]", inputs: ["pResizableColumnDisabled"] }, { kind: "component", type: i1$5.SortIcon, selector: "p-sortIcon", inputs: ["field"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: ButtonComponent, selector: "app-button", inputs: ["type", "className", "style", "label", "iconPos", "styleClass", "icon", "disabled", "rounded", "badgeSeverity", "size", "loading"] }, { kind: "component", type: FormFieldComponent, selector: "app-form-field", inputs: ["label", "required", "isInline", "showLabel", "field", "patternError"] }, { kind: "component", type: BasicInputComponent, selector: "app-basic-input", inputs: ["placeholder", "labelType", "isDisabled", "value", "touched"], outputs: ["valueChange", "touchedChange", "changed"] }, { kind: "directive", type: FormField, selector: "[formField]", inputs: ["formField"], exportAs: ["formField"] }, { kind: "pipe", type: i1$3.TranslatePipe, name: "translate" }, { kind: "pipe", type: DatePipe, name: "date" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: TableComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'app-table', standalone: true, imports: [
+                        TableModule,
+                        TranslateModule,
+                        NgTemplateOutlet,
+                        DatePipe,
+                        ButtonComponent,
+                        FormFieldComponent,
+                        BasicInputComponent,
+                        FormField
+                    ], changeDetection: ChangeDetectionStrategy.OnPush, template: "<p-table #table class=\"custom-table\"\n         [columns]=\"dataSourceColumns()\"\n         [value]=\"enrichedDataSource()\"\n         [paginator]=\"paginator()\"\n         [scrollable]=\"scrollable()\"\n         [resizableColumns]=\"resizableColumns()\"\n         [selection]=\"selectedRowValue()\"\n         [selectionMode]=\"selectionMode()\"\n         [customSort]=\"customSortFun\"\n         [rowsPerPageOptions]=\"[10, 25, 100]\"\n         (onRowSelect)=\"onSelectedRow($event)\"\n         (onRowUnselect)=\"onRowUnselect()\"\n         (onSort)=\"onCustomSort($event)\"\n         [rows]=\"rows\">\n  <ng-template #header let-columns pTemplate=\"header\">\n    <tr >\n      @for (col of columns; track $index) {\n        <th pResizableColumn\n            [pSortableColumn]=\"col.field\"\n            [hidden]=\"!col.visible\"\n            [style]=\"{'min-width': col.minWidth || '100px', 'width': col.width, 'text-align': col.textAlign}\"\n            scope=\"col\"\n        >\n          {{ col.header | translate }}\n          @if (showIconSort() && col.field !== showFilterCondition) {\n            <p-sortIcon [field]=\"col.field\"></p-sortIcon>\n          }\n        </th>\n      }\n\n      @if (showRowActions()) {\n        <th\n             scope=\"col\"\n             [attr.id]=\"'actions-col'\"\n             [style]=\"{ width: '7%' }\"\n        >\n            <span class=\"sr-only\">\n              {{ 'Action' | translate }}\n            </span>\n        </th>\n      }\n    </tr>\n  </ng-template>\n  <ng-template #body let-rowData let-rowIndex=\"rowIndex\" let-columns=\"columns\" pTemplate=\"body\">\n    <tr [pSelectableRow]=\"rowData\"\n        [pSelectableRowIndex]=\"rowIndex\"\n    >\n      @for (col of columns; track $index) {\n        <td  [style]=\"{'min-width': col.minWidth || '100px', 'width': col.width, 'text-align': col.textAlign}\"\n             [hidden]=\"!col.visible\"\n        >\n          @if (customCellTemplate && col.type === 'especial') {\n            <ng-container\n                 *ngTemplateOutlet=\"customCellTemplate; context: { $implicit: rowData, col: col }\"></ng-container>\n          } @else {\n              @if (rowData._editing && col.modificable) {\n\n                <form (keydown.enter)=\"confirmEdit(rowData)\">\n                  <app-form-field\n                       [required]=\"true\"\n                       [field]=\"initialForm.inputValue\">\n                    <app-basic-input\n                         [placeholder]=\"''\"\n                         [formField]=\"initialForm.inputValue\"\n                    ></app-basic-input>\n                  </app-form-field>\n                </form>\n\n              } @else {\n                <ng-container *ngTemplateOutlet=\"\n                                      shouldUseCustomCell(col)\n                                        ? customCell\n                                        : defaultCell;\n                                      context: { $implicit: rowData, col: col }\n                                    \"></ng-container>\n              }\n          }\n        </td>\n      }\n\n      @if (showRowActions()) {\n        <td class=\"action-cell\"\n            [attr.headers]=\"'actions-col'\"\n        >\n          <div class=\"button-cell\">\n            @if (!rowData._editing) {\n              <app-button (click)=\"startEdit(rowData, rowIndex)\"\n                          [iconPos]=\"'left'\"\n                          [icon]=\"'pi pi-pencil'\"\n                          [disabled]=\"rowData._editing\"\n              ></app-button>\n            }\n\n            @if (rowData._editing) {\n              <app-button (click)=\"confirmEdit(rowData)\"\n                          [iconPos]=\"'left'\"\n                          [icon]=\"'pi pi-check'\"\n              ></app-button>\n              <app-button\n                   (click)=\"cancelEdit(rowData)\"\n                   [iconPos]=\"'left'\"\n                   [icon]=\"'pi pi-times'\"\n              ></app-button>\n            }\n          </div>\n        </td>\n      }\n    </tr>\n  </ng-template>\n\n  <ng-template #customCell let-rowData=\"$implicit\" let-col=\"col\">\n    @switch (col.type) {\n      @case ('datetime') {\n        <span>{{ rowData[col.field] | date:'dd-MM-yyyy HH:mm' }}</span>\n      }\n      @case ('date-mes') {\n        <span>{{ rowData[col.field] | date:'MM-yyyy' }}</span>\n      }\n      @case ('date') {\n        <span>{{ rowData[col.field] }}</span>\n      }\n      @case ('date-reverse') {\n        <span>{{ rowData[col.field] | date:'YYYY-MM-DD' }}</span>\n      }\n      @case ('decimal') {\n        <span>{{ rowData[col.field] }}</span>\n      }\n      @case ('icon') {\n        @if (rowData[col.field] === showIconCondition()) {\n          <div>\n            <div class=\"tooltip-wrapper\">\n              <em [class]=\"iconClass()\"\n                  [style]=\"{ color: iconColor() }\"></em>\n              <span class=\"tooltip-text\">{{ rowData.ToolTipMsg || msgTooltip | translate }}</span>\n            </div>\n          </div>\n        }\n      }\n      @case ('clickable') {\n        <span class=\"clickable\" (click)=\"startEdit(rowData, col.rowIndex)\">{{ rowData[col.field] }}</span>\n      }\n    }\n  </ng-template>\n\n  <ng-template #defaultCell let-rowData=\"$implicit\" let-col=\"col\">\n    @if (rowData !== null) {\n      <span>{{ rowData[col.field] }}</span>\n    }\n  </ng-template>\n</p-table>\n", styles: [":host ::ng-deep .app-input{height:1.9rem;color:#495057;width:100%;padding-left:.2rem;margin:-1rem 0rem -1rem -.3rem;background-color:#fff}:host::ng-deep .ui-inputtext{height:2.1rem;color:#495057;width:100%}:host::ng-deep .ui-inputtext:focus{border:1px solid rgb(135,220,55)!important;-webkit-box-shadow:0 0 0 .2rem rgba(72,126,22,.25)!important;box-shadow:0 0 0 .2rem #487e1640!important;outline:none!important}:host::ng-deep .ui-inputtext:hover{border:1px solid rgb(206,212,218)!important}:host::ng-deep .ui-inputtext[disabled]{background:#0000000d;border:1px solid rgba(0,0,0,.18);color:#000}:host ::ng-deep .custom-table{table-layout:auto;width:100%}:host ::ng-deep .custom-table .p-datatable-table-container{border:1px solid #dbe5f0;border-radius:1rem;overflow:hidden}:host ::ng-deep .custom-table .p-datatable-thead>tr>th{padding:.95rem 1rem;background:#f8fafc;border-color:#dbe5f0;color:#334155;font-size:.86rem;font-weight:700}:host ::ng-deep .custom-table .p-datatable-tbody>tr>td{padding:.95rem 1rem;background-color:#fff;border-color:#e2e8f0;color:#0f172a}:host ::ng-deep .custom-table .p-datatable-tbody>tr:nth-child(2n)>td{background:#f8fbff}:host ::ng-deep .custom-table .p-datatable-tbody>tr:hover>td{background:#eff6ff}:host ::ng-deep .custom-table th,:host ::ng-deep .custom-table td{white-space:normal;word-wrap:break-word;overflow-wrap:anywhere;min-width:100px}:host ::ng-deep .custom-table .p-datatable-table-container,:host ::ng-deep .custom-table .ui-table-scrollable-body{overflow-x:auto}.tooltip-wrapper{position:relative;display:inline-block}.tooltip-wrapper .tooltip-text{visibility:hidden;background-color:#0f172a;color:#fff;text-align:center;padding:.45rem .6rem;border-radius:.5rem;position:absolute;z-index:1;left:150%;top:50%;transform:translateY(-50%);white-space:nowrap;opacity:0;transition:opacity .3s}.tooltip-wrapper:hover .tooltip-text{visibility:visible;opacity:1}.action-col,.action-cell{width:7%;text-align:center;white-space:nowrap;background:inherit}.action-col .button-cell,.action-cell .button-cell{display:flex;justify-content:center;gap:.4rem}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}:host ::ng-deep .clickable{cursor:pointer;display:block;width:100%;color:#2563eb}:host ::ng-deep .custom-table .p-sortable-column-icon,:host ::ng-deep .custom-table .p-paginator,:host ::ng-deep .custom-table .p-paginator-page,:host ::ng-deep .custom-table .p-paginator-next,:host ::ng-deep .custom-table .p-paginator-prev,:host ::ng-deep .custom-table .p-paginator-first,:host ::ng-deep .custom-table .p-paginator-last{color:#475569}:host ::ng-deep .custom-table .p-paginator{border:none;padding-top:1rem;background:transparent}\n"] }]
+        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { dataSource: [{ type: i0.Input, args: [{ isSignal: true, alias: "dataSource", required: false }] }], dataSourceColumns: [{ type: i0.Input, args: [{ isSignal: true, alias: "dataSourceColumns", required: false }] }], iconColor: [{ type: i0.Input, args: [{ isSignal: true, alias: "iconColor", required: false }] }], iconClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "iconClass", required: false }] }], msgTooltip: [{ type: i0.Input, args: [{ isSignal: true, alias: "msgTooltip", required: false }] }], paginator: [{ type: i0.Input, args: [{ isSignal: true, alias: "paginator", required: false }] }], selectionMode: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectionMode", required: false }] }], scrollable: [{ type: i0.Input, args: [{ isSignal: true, alias: "scrollable", required: false }] }], metaKeySelection: [{ type: i0.Input, args: [{ isSignal: true, alias: "metaKeySelection", required: false }] }], resizableColumns: [{ type: i0.Input, args: [{ isSignal: true, alias: "resizableColumns", required: false }] }], selectedRowValue: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectedRowValue", required: false }] }], showIconSort: [{ type: i0.Input, args: [{ isSignal: true, alias: "showIconSort", required: false }] }], showRowActions: [{ type: i0.Input, args: [{ isSignal: true, alias: "showRowActions", required: false }] }], showIconCondition: [{ type: i0.Input, args: [{ isSignal: true, alias: "showIconCondition", required: false }] }], showFilterCondition: [{ type: i0.Input, args: [{ isSignal: true, alias: "showFilterCondition", required: false }] }], editableFieldName: [{ type: i0.Input, args: [{ isSignal: true, alias: "editableFieldName", required: false }] }], selectRow: [{ type: i0.Output, args: ["selectRow"] }], unselectRow: [{ type: i0.Output, args: ["unselectRow"] }], cellEdit: [{ type: i0.Output, args: ["cellEdit"] }], rowUpdate: [{ type: i0.Output, args: ["rowUpdate"] }], table: [{
+                type: ViewChild,
+                args: ['table']
+            }], customCellTemplate: [{
+                type: ContentChild,
+                args: ['customCellTemplate']
+            }] } });
+
+class BasicSelectComponent {
+    constructor() {
+        this.items = input(...(ngDevMode ? [undefined, { debugName: "items" }] : /* istanbul ignore next */ []));
+        this.class = input(...(ngDevMode ? [undefined, { debugName: "class" }] : /* istanbul ignore next */ []));
+        this.disabledValue = input([], ...(ngDevMode ? [{ debugName: "disabledValue" }] : /* istanbul ignore next */ []));
+        this.placeholder = input('Select sum items...', ...(ngDevMode ? [{ debugName: "placeholder" }] : /* istanbul ignore next */ []));
+        this.lengthTextSelected = input(20, ...(ngDevMode ? [{ debugName: "lengthTextSelected" }] : /* istanbul ignore next */ []));
+        this.filter = input(false, ...(ngDevMode ? [{ debugName: "filter" }] : /* istanbul ignore next */ []));
+        this.emptyOption = input(false, ...(ngDevMode ? [{ debugName: "emptyOption" }] : /* istanbul ignore next */ []));
+        this.showClear = input(...(ngDevMode ? [undefined, { debugName: "showClear" }] : /* istanbul ignore next */ []));
+        this.withIcons = input(false, ...(ngDevMode ? [{ debugName: "withIcons" }] : /* istanbul ignore next */ []));
+        this.resetFilterOnHide = input(true, ...(ngDevMode ? [{ debugName: "resetFilterOnHide" }] : /* istanbul ignore next */ []));
+        this.nullOrZero = input(null, ...(ngDevMode ? [{ debugName: "nullOrZero" }] : /* istanbul ignore next */ []));
+        this.labelType = input('in_label', ...(ngDevMode ? [{ debugName: "labelType" }] : /* istanbul ignore next */ []));
+        this.showIcon = input(false, ...(ngDevMode ? [{ debugName: "showIcon" }] : /* istanbul ignore next */ []));
+        this.optionLabel = input('name', ...(ngDevMode ? [{ debugName: "optionLabel" }] : /* istanbul ignore next */ []));
+        this.optionValue = input(...(ngDevMode ? [undefined, { debugName: "optionValue" }] : /* istanbul ignore next */ []));
+        this.changed = output();
+        this.showClearState = linkedSignal(() => this.showClear(), ...(ngDevMode ? [{ debugName: "showClearState" }] : /* istanbul ignore next */ []));
+        this.isDisabled = input(false, ...(ngDevMode ? [{ debugName: "isDisabled" }] : /* istanbul ignore next */ []));
+        this.value = model(null, ...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
+        this.touched = model(false, ...(ngDevMode ? [{ debugName: "touched" }] : /* istanbul ignore next */ []));
+        this.closed = output();
+    }
+    onChanged({ value }) {
+        this.value.set(value);
+        this.changed.emit(value);
+    }
+    onClosed() {
+        this.touched.set(true);
+        this.closed.emit();
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: BasicSelectComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.18", type: BasicSelectComponent, isStandalone: true, selector: "app-basic-select", inputs: { items: { classPropertyName: "items", publicName: "items", isSignal: true, isRequired: false, transformFunction: null }, class: { classPropertyName: "class", publicName: "class", isSignal: true, isRequired: false, transformFunction: null }, disabledValue: { classPropertyName: "disabledValue", publicName: "disabledValue", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, lengthTextSelected: { classPropertyName: "lengthTextSelected", publicName: "lengthTextSelected", isSignal: true, isRequired: false, transformFunction: null }, filter: { classPropertyName: "filter", publicName: "filter", isSignal: true, isRequired: false, transformFunction: null }, emptyOption: { classPropertyName: "emptyOption", publicName: "emptyOption", isSignal: true, isRequired: false, transformFunction: null }, showClear: { classPropertyName: "showClear", publicName: "showClear", isSignal: true, isRequired: false, transformFunction: null }, withIcons: { classPropertyName: "withIcons", publicName: "withIcons", isSignal: true, isRequired: false, transformFunction: null }, resetFilterOnHide: { classPropertyName: "resetFilterOnHide", publicName: "resetFilterOnHide", isSignal: true, isRequired: false, transformFunction: null }, nullOrZero: { classPropertyName: "nullOrZero", publicName: "nullOrZero", isSignal: true, isRequired: false, transformFunction: null }, labelType: { classPropertyName: "labelType", publicName: "labelType", isSignal: true, isRequired: false, transformFunction: null }, showIcon: { classPropertyName: "showIcon", publicName: "showIcon", isSignal: true, isRequired: false, transformFunction: null }, optionLabel: { classPropertyName: "optionLabel", publicName: "optionLabel", isSignal: true, isRequired: false, transformFunction: null }, optionValue: { classPropertyName: "optionValue", publicName: "optionValue", isSignal: true, isRequired: false, transformFunction: null }, isDisabled: { classPropertyName: "isDisabled", publicName: "isDisabled", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, touched: { classPropertyName: "touched", publicName: "touched", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { changed: "changed", value: "valueChange", touched: "touchedChange", closed: "closed" }, ngImport: i0, template: "<div class=\"select_wrapper\" [class.select_disabled]=\"isDisabled()\">\n  <p-floatlabel>\n    <p-select\n      class=\"select\"\n      [options]=\"items()\"\n      [disabled]=\"isDisabled()\"\n      [placeholder]=\"placeholder()\"\n      [resetFilterOnHide]=\"resetFilterOnHide()\"\n      [filter]=\"filter()\"\n      [showClear]=\"showClearState()\"\n      [optionLabel]=\"optionLabel()\"\n      [optionValue]=\"optionValue()\"\n      [ngModel]=\"value()\"\n      (onChange)=\"onChanged($event)\"\n      (onBlur)=\"touched.set(true)\"\n      (onHide)=\"onClosed()\">\n      @if (showIcon()) {\n        <ng-template #selectedItem let-selectedOption>\n          <div class=\"flex items-center gap-2\">\n            <img src=\"https://primefaces.org/cdn/primeng/images/demo/flag/flag_placeholder.png\"\n                 [class]=\"'flag flag-' + value()\" style=\"width: 18px\" alt=\"\"/>\n            <div>{{ selectedOption.name }}</div>\n          </div>\n        </ng-template>\n        <ng-template let-country #item>\n          <div class=\"flex items-center gap-2\">\n            <img src=\"https://primefaces.org/cdn/primeng/images/demo/flag/flag_placeholder.png\"\n                 [class]=\"'flag flag-' + country.code.toLowerCase()\" style=\"width: 18px\"  alt=\"\"/>\n            <div>{{ country.name }}</div>\n          </div>\n        </ng-template>\n      }\n    </p-select>\n    <label [for]=\"labelType()\">{{placeholder()}}</label>\n  </p-floatlabel>\n</div>\n", styles: [".select_wrapper,.select_wrapper .select{width:100%}:host ::ng-deep .p-floatlabel{display:block}:host ::ng-deep .p-floatlabel label{color:#64748b}:host ::ng-deep .p-select{width:100%;min-height:2.75rem;border:1px solid #cbd5e1;border-radius:.85rem;background:#fff;box-shadow:none;transition:border-color .18s ease,box-shadow .18s ease,background-color .18s ease}:host ::ng-deep .p-select:hover{border-color:#93c5fd}:host ::ng-deep .p-select.p-focus{border-color:#3b82f6;box-shadow:0 0 0 .25rem #3b82f629}:host ::ng-deep .p-select-label{color:#0f172a}:host ::ng-deep .p-select-dropdown,:host ::ng-deep .p-select-clear-icon{color:#64748b}:host ::ng-deep .p-select.p-disabled{background:#f8fafc;border-color:#e2e8f0}\n"], dependencies: [{ kind: "component", type: Select, selector: "p-select", inputs: ["id", "scrollHeight", "filter", "panelStyle", "styleClass", "panelStyleClass", "readonly", "editable", "tabindex", "placeholder", "loadingIcon", "filterPlaceholder", "filterLocale", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "checkmark", "dropdownIcon", "loading", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "filterValue", "options", "appendTo", "motionOptions"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: FloatLabel, selector: "p-floatlabel, p-floatLabel, p-float-label", inputs: ["variant"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: BasicSelectComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'app-basic-select', imports: [
+                        Select,
+                        FormsModule,
+                        FloatLabel
+                    ], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"select_wrapper\" [class.select_disabled]=\"isDisabled()\">\n  <p-floatlabel>\n    <p-select\n      class=\"select\"\n      [options]=\"items()\"\n      [disabled]=\"isDisabled()\"\n      [placeholder]=\"placeholder()\"\n      [resetFilterOnHide]=\"resetFilterOnHide()\"\n      [filter]=\"filter()\"\n      [showClear]=\"showClearState()\"\n      [optionLabel]=\"optionLabel()\"\n      [optionValue]=\"optionValue()\"\n      [ngModel]=\"value()\"\n      (onChange)=\"onChanged($event)\"\n      (onBlur)=\"touched.set(true)\"\n      (onHide)=\"onClosed()\">\n      @if (showIcon()) {\n        <ng-template #selectedItem let-selectedOption>\n          <div class=\"flex items-center gap-2\">\n            <img src=\"https://primefaces.org/cdn/primeng/images/demo/flag/flag_placeholder.png\"\n                 [class]=\"'flag flag-' + value()\" style=\"width: 18px\" alt=\"\"/>\n            <div>{{ selectedOption.name }}</div>\n          </div>\n        </ng-template>\n        <ng-template let-country #item>\n          <div class=\"flex items-center gap-2\">\n            <img src=\"https://primefaces.org/cdn/primeng/images/demo/flag/flag_placeholder.png\"\n                 [class]=\"'flag flag-' + country.code.toLowerCase()\" style=\"width: 18px\"  alt=\"\"/>\n            <div>{{ country.name }}</div>\n          </div>\n        </ng-template>\n      }\n    </p-select>\n    <label [for]=\"labelType()\">{{placeholder()}}</label>\n  </p-floatlabel>\n</div>\n", styles: [".select_wrapper,.select_wrapper .select{width:100%}:host ::ng-deep .p-floatlabel{display:block}:host ::ng-deep .p-floatlabel label{color:#64748b}:host ::ng-deep .p-select{width:100%;min-height:2.75rem;border:1px solid #cbd5e1;border-radius:.85rem;background:#fff;box-shadow:none;transition:border-color .18s ease,box-shadow .18s ease,background-color .18s ease}:host ::ng-deep .p-select:hover{border-color:#93c5fd}:host ::ng-deep .p-select.p-focus{border-color:#3b82f6;box-shadow:0 0 0 .25rem #3b82f629}:host ::ng-deep .p-select-label{color:#0f172a}:host ::ng-deep .p-select-dropdown,:host ::ng-deep .p-select-clear-icon{color:#64748b}:host ::ng-deep .p-select.p-disabled{background:#f8fafc;border-color:#e2e8f0}\n"] }]
+        }], propDecorators: { items: [{ type: i0.Input, args: [{ isSignal: true, alias: "items", required: false }] }], class: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }], disabledValue: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabledValue", required: false }] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], lengthTextSelected: [{ type: i0.Input, args: [{ isSignal: true, alias: "lengthTextSelected", required: false }] }], filter: [{ type: i0.Input, args: [{ isSignal: true, alias: "filter", required: false }] }], emptyOption: [{ type: i0.Input, args: [{ isSignal: true, alias: "emptyOption", required: false }] }], showClear: [{ type: i0.Input, args: [{ isSignal: true, alias: "showClear", required: false }] }], withIcons: [{ type: i0.Input, args: [{ isSignal: true, alias: "withIcons", required: false }] }], resetFilterOnHide: [{ type: i0.Input, args: [{ isSignal: true, alias: "resetFilterOnHide", required: false }] }], nullOrZero: [{ type: i0.Input, args: [{ isSignal: true, alias: "nullOrZero", required: false }] }], labelType: [{ type: i0.Input, args: [{ isSignal: true, alias: "labelType", required: false }] }], showIcon: [{ type: i0.Input, args: [{ isSignal: true, alias: "showIcon", required: false }] }], optionLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "optionLabel", required: false }] }], optionValue: [{ type: i0.Input, args: [{ isSignal: true, alias: "optionValue", required: false }] }], changed: [{ type: i0.Output, args: ["changed"] }], isDisabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "isDisabled", required: false }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }, { type: i0.Output, args: ["valueChange"] }], touched: [{ type: i0.Input, args: [{ isSignal: true, alias: "touched", required: false }] }, { type: i0.Output, args: ["touchedChange"] }], closed: [{ type: i0.Output, args: ["closed"] }] } });
+
+class CheckboxComponent {
+    constructor() {
+        this.label = input('', ...(ngDevMode ? [{ debugName: "label" }] : /* istanbul ignore next */ []));
+        this.binary = input(true, ...(ngDevMode ? [{ debugName: "binary" }] : /* istanbul ignore next */ []));
+        this.disabled = input(false, ...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
+        this.readonly = input(false, ...(ngDevMode ? [{ debugName: "readonly" }] : /* istanbul ignore next */ []));
+        this.value = model(false, ...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
+        this.touched = model(false, ...(ngDevMode ? [{ debugName: "touched" }] : /* istanbul ignore next */ []));
+        this.changed = output();
+    }
+    onValueChange(checked) {
+        this.value.set(checked);
+        this.changed.emit(checked);
+    }
+    onBlur() {
+        this.touched.set(true);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: CheckboxComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.18", type: CheckboxComponent, isStandalone: true, selector: "app-checkbox", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, binary: { classPropertyName: "binary", publicName: "binary", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, touched: { classPropertyName: "touched", publicName: "touched", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange", touched: "touchedChange", changed: "changed" }, ngImport: i0, template: "<div class=\"checkbox-wrapper\">\n    <p-checkbox\n        [ngModel]=\"value()\"\n        [binary]=\"binary()\"\n        [disabled]=\"disabled()\"\n        [readonly]=\"readonly()\"\n        (ngModelChange)=\"onValueChange($event)\"\n        (onBlur)=\"onBlur()\"\n    />\n    @if (label()) {\n        <label class=\"checkbox-label\">{{ label() }}</label>\n    }\n</div>\n", styles: ["app-checkbox .checkbox-wrapper{display:flex;align-items:center;gap:8px}app-checkbox .checkbox-wrapper .checkbox-label{color:#334155;font-size:14px;cursor:pointer;-webkit-user-select:none;user-select:none}app-checkbox .p-checkbox{display:inline-flex;cursor:pointer;-webkit-user-select:none;user-select:none;vertical-align:bottom;position:relative}app-checkbox .p-checkbox-box{display:flex;align-items:center;justify-content:center;width:20px!important;height:20px!important;border:2px solid #cbd5e1!important;background:#fff!important;border-radius:4px!important;transition:all .2s!important;box-shadow:none!important;outline:none!important}app-checkbox .p-checkbox:not(.p-disabled):hover .p-checkbox-box{border-color:#1e40af!important;background:#f0f7ff!important}app-checkbox .p-checkbox-box.p-highlight{border-color:#1e40af!important;background:#1e40af!important}app-checkbox .p-checkbox:not(.p-disabled):hover .p-checkbox-box.p-highlight{border-color:#1e3a8a!important;background:#1e3a8a!important}app-checkbox .p-checkbox-box.p-focus{outline:2px solid #93c5fd!important;outline-offset:2px!important;box-shadow:none!important}app-checkbox .p-checkbox-icon{display:flex!important;align-items:center!important;justify-content:center!important;width:12px!important;height:12px!important;font-size:12px!important;color:#fff!important;transition:all .2s!important}app-checkbox .p-checkbox.p-disabled .p-checkbox-box{background:#f1f5f9!important;border-color:#e2e8f0!important;opacity:.6!important;cursor:not-allowed!important}app-checkbox .p-checkbox.p-disabled{cursor:not-allowed!important}\n"], dependencies: [{ kind: "ngmodule", type: CheckboxModule }, { kind: "component", type: i1$6.Checkbox, selector: "p-checkbox, p-checkBox, p-check-box", inputs: ["hostName", "value", "binary", "ariaLabelledBy", "ariaLabel", "tabindex", "inputId", "inputStyle", "styleClass", "inputClass", "indeterminate", "formControl", "checkboxIcon", "readonly", "autofocus", "trueValue", "falseValue", "variant", "size"], outputs: ["onChange", "onFocus", "onBlur"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: CheckboxComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'app-checkbox', standalone: true, imports: [CheckboxModule, FormsModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"checkbox-wrapper\">\n    <p-checkbox\n        [ngModel]=\"value()\"\n        [binary]=\"binary()\"\n        [disabled]=\"disabled()\"\n        [readonly]=\"readonly()\"\n        (ngModelChange)=\"onValueChange($event)\"\n        (onBlur)=\"onBlur()\"\n    />\n    @if (label()) {\n        <label class=\"checkbox-label\">{{ label() }}</label>\n    }\n</div>\n", styles: ["app-checkbox .checkbox-wrapper{display:flex;align-items:center;gap:8px}app-checkbox .checkbox-wrapper .checkbox-label{color:#334155;font-size:14px;cursor:pointer;-webkit-user-select:none;user-select:none}app-checkbox .p-checkbox{display:inline-flex;cursor:pointer;-webkit-user-select:none;user-select:none;vertical-align:bottom;position:relative}app-checkbox .p-checkbox-box{display:flex;align-items:center;justify-content:center;width:20px!important;height:20px!important;border:2px solid #cbd5e1!important;background:#fff!important;border-radius:4px!important;transition:all .2s!important;box-shadow:none!important;outline:none!important}app-checkbox .p-checkbox:not(.p-disabled):hover .p-checkbox-box{border-color:#1e40af!important;background:#f0f7ff!important}app-checkbox .p-checkbox-box.p-highlight{border-color:#1e40af!important;background:#1e40af!important}app-checkbox .p-checkbox:not(.p-disabled):hover .p-checkbox-box.p-highlight{border-color:#1e3a8a!important;background:#1e3a8a!important}app-checkbox .p-checkbox-box.p-focus{outline:2px solid #93c5fd!important;outline-offset:2px!important;box-shadow:none!important}app-checkbox .p-checkbox-icon{display:flex!important;align-items:center!important;justify-content:center!important;width:12px!important;height:12px!important;font-size:12px!important;color:#fff!important;transition:all .2s!important}app-checkbox .p-checkbox.p-disabled .p-checkbox-box{background:#f1f5f9!important;border-color:#e2e8f0!important;opacity:.6!important;cursor:not-allowed!important}app-checkbox .p-checkbox.p-disabled{cursor:not-allowed!important}\n"] }]
+        }], propDecorators: { label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], binary: [{ type: i0.Input, args: [{ isSignal: true, alias: "binary", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], readonly: [{ type: i0.Input, args: [{ isSignal: true, alias: "readonly", required: false }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }, { type: i0.Output, args: ["valueChange"] }], touched: [{ type: i0.Input, args: [{ isSignal: true, alias: "touched", required: false }] }, { type: i0.Output, args: ["touchedChange"] }], changed: [{ type: i0.Output, args: ["changed"] }] } });
+
+class PasswordInputComponent {
+    constructor() {
+        this.placeholder = input("Input your password...", ...(ngDevMode ? [{ debugName: "placeholder" }] : /* istanbul ignore next */ []));
+        this.labelType = input("in_label", ...(ngDevMode ? [{ debugName: "labelType" }] : /* istanbul ignore next */ []));
+        this.toggleMask = input(true, ...(ngDevMode ? [{ debugName: "toggleMask" }] : /* istanbul ignore next */ []));
+        this.feedback = input(false, ...(ngDevMode ? [{ debugName: "feedback" }] : /* istanbul ignore next */ []));
+        this.isDisabled = input(false, ...(ngDevMode ? [{ debugName: "isDisabled" }] : /* istanbul ignore next */ []));
+        this.value = model('', ...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
+        this.touched = model(false, ...(ngDevMode ? [{ debugName: "touched" }] : /* istanbul ignore next */ []));
+        this.changed = output();
+    }
+    onKeyup(event) {
+        const value = event.target.value;
+        this.value.set(value);
+        this.changed.emit(value);
+    }
+    onBlur() {
+        this.touched.set(true);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: PasswordInputComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.18", type: PasswordInputComponent, isStandalone: true, selector: "app-password-input", inputs: { placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, labelType: { classPropertyName: "labelType", publicName: "labelType", isSignal: true, isRequired: false, transformFunction: null }, toggleMask: { classPropertyName: "toggleMask", publicName: "toggleMask", isSignal: true, isRequired: false, transformFunction: null }, feedback: { classPropertyName: "feedback", publicName: "feedback", isSignal: true, isRequired: false, transformFunction: null }, isDisabled: { classPropertyName: "isDisabled", publicName: "isDisabled", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, touched: { classPropertyName: "touched", publicName: "touched", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange", touched: "touchedChange", changed: "changed" }, ngImport: i0, template: "<div class=\"password-wrapper\">\n  <p-floatlabel>\n    <p-password\n         type=\"text\"\n         class=\"password-input\"\n         [disabled]=\"isDisabled()\"\n         (keyup)=\"onKeyup($event)\"\n         (blur)=\"onBlur()\"\n         [inputId]=\"labelType()\"\n         [ngModel]=\"value()\"\n         [feedback]=\"feedback()\"\n         [toggleMask]=\"toggleMask()\"\n    />\n    <label for=\"labelType()\">{{ placeholder() }}</label>\n  </p-floatlabel>\n</div>", styles: [":host{display:block;width:100%}:host ::ng-deep .p-password{display:block;position:relative;width:100%}:host-context(.form-field_error) .p-password-input{border-color:#dc2626!important}:host ::ng-deep .p-floatlabel{display:block}:host ::ng-deep .p-floatlabel label{color:#64748b}:host ::ng-deep .password-input .p-inputtext,:host ::ng-deep .password-input .p-password-input{min-height:2.75rem;border:1px solid #cbd5e1;border-radius:.85rem;background-color:#fff;color:#0f172a;width:100%;padding:.85rem 2.6rem .35rem .95rem;transition:border-color .18s ease,box-shadow .18s ease,background-color .18s ease}:host ::ng-deep .password-input .p-inputtext_disabled,:host ::ng-deep .password-input .p-password-input_disabled{background:#f8fafc;border:1px solid #e2e8f0;color:#94a3b8}:host ::ng-deep .password-input .p-inputtext:hover,:host ::ng-deep .password-input .p-password-input:hover{border-color:#93c5fd}:host ::ng-deep .password-input .p-inputtext:focus,:host ::ng-deep .password-input .p-password-input:focus,:host ::ng-deep .password-input .p-inputtext:focus-visible,:host ::ng-deep .password-input .p-password-input:focus-visible{border-color:#3b82f6;box-shadow:0 0 0 .25rem #3b82f629;outline:none}:host ::ng-deep .password-input .p-password-toggle-mask-icon{color:#64748b;right:.9rem}\n"], dependencies: [{ kind: "component", type: FloatLabel, selector: "p-floatlabel, p-floatLabel, p-float-label", inputs: ["variant"] }, { kind: "component", type: Password, selector: "p-password", inputs: ["ariaLabel", "ariaLabelledBy", "label", "promptLabel", "mediumRegex", "strongRegex", "weakLabel", "mediumLabel", "maxLength", "strongLabel", "inputId", "feedback", "toggleMask", "inputStyleClass", "styleClass", "inputStyle", "showTransitionOptions", "hideTransitionOptions", "autocomplete", "placeholder", "showClear", "autofocus", "tabindex", "appendTo", "motionOptions", "overlayOptions"], outputs: ["onFocus", "onBlur", "onClear"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: PasswordInputComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'app-password-input', standalone: true, imports: [
+                        FloatLabel,
+                        Password,
+                        FormsModule
+                    ], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"password-wrapper\">\n  <p-floatlabel>\n    <p-password\n         type=\"text\"\n         class=\"password-input\"\n         [disabled]=\"isDisabled()\"\n         (keyup)=\"onKeyup($event)\"\n         (blur)=\"onBlur()\"\n         [inputId]=\"labelType()\"\n         [ngModel]=\"value()\"\n         [feedback]=\"feedback()\"\n         [toggleMask]=\"toggleMask()\"\n    />\n    <label for=\"labelType()\">{{ placeholder() }}</label>\n  </p-floatlabel>\n</div>", styles: [":host{display:block;width:100%}:host ::ng-deep .p-password{display:block;position:relative;width:100%}:host-context(.form-field_error) .p-password-input{border-color:#dc2626!important}:host ::ng-deep .p-floatlabel{display:block}:host ::ng-deep .p-floatlabel label{color:#64748b}:host ::ng-deep .password-input .p-inputtext,:host ::ng-deep .password-input .p-password-input{min-height:2.75rem;border:1px solid #cbd5e1;border-radius:.85rem;background-color:#fff;color:#0f172a;width:100%;padding:.85rem 2.6rem .35rem .95rem;transition:border-color .18s ease,box-shadow .18s ease,background-color .18s ease}:host ::ng-deep .password-input .p-inputtext_disabled,:host ::ng-deep .password-input .p-password-input_disabled{background:#f8fafc;border:1px solid #e2e8f0;color:#94a3b8}:host ::ng-deep .password-input .p-inputtext:hover,:host ::ng-deep .password-input .p-password-input:hover{border-color:#93c5fd}:host ::ng-deep .password-input .p-inputtext:focus,:host ::ng-deep .password-input .p-password-input:focus,:host ::ng-deep .password-input .p-inputtext:focus-visible,:host ::ng-deep .password-input .p-password-input:focus-visible{border-color:#3b82f6;box-shadow:0 0 0 .25rem #3b82f629;outline:none}:host ::ng-deep .password-input .p-password-toggle-mask-icon{color:#64748b;right:.9rem}\n"] }]
+        }], propDecorators: { placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], labelType: [{ type: i0.Input, args: [{ isSignal: true, alias: "labelType", required: false }] }], toggleMask: [{ type: i0.Input, args: [{ isSignal: true, alias: "toggleMask", required: false }] }], feedback: [{ type: i0.Input, args: [{ isSignal: true, alias: "feedback", required: false }] }], isDisabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "isDisabled", required: false }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }, { type: i0.Output, args: ["valueChange"] }], touched: [{ type: i0.Input, args: [{ isSignal: true, alias: "touched", required: false }] }, { type: i0.Output, args: ["touchedChange"] }], changed: [{ type: i0.Output, args: ["changed"] }] } });
+
+class MultiSelectComponent {
+    constructor() {
+        this.items = input([], ...(ngDevMode ? [{ debugName: "items" }] : /* istanbul ignore next */ []));
+        this.disabledValue = input([], ...(ngDevMode ? [{ debugName: "disabledValue" }] : /* istanbul ignore next */ []));
+        this.placeholder = input("Select sum items...", ...(ngDevMode ? [{ debugName: "placeholder" }] : /* istanbul ignore next */ []));
+        this.selectedItemsLabel = input(...(ngDevMode ? [undefined, { debugName: "selectedItemsLabel" }] : /* istanbul ignore next */ []));
+        this.lengthTextSelected = input(20, ...(ngDevMode ? [{ debugName: "lengthTextSelected" }] : /* istanbul ignore next */ []));
+        this.filter = input(false, ...(ngDevMode ? [{ debugName: "filter" }] : /* istanbul ignore next */ []));
+        this.displaySelectedLabel = input(false, ...(ngDevMode ? [{ debugName: "displaySelectedLabel" }] : /* istanbul ignore next */ []));
+        this.emptyOption = input(false, ...(ngDevMode ? [{ debugName: "emptyOption" }] : /* istanbul ignore next */ []));
+        this.showClear = input(...(ngDevMode ? [undefined, { debugName: "showClear" }] : /* istanbul ignore next */ []));
+        this.withIcons = input(false, ...(ngDevMode ? [{ debugName: "withIcons" }] : /* istanbul ignore next */ []));
+        this.resetFilterOnHide = input(true, ...(ngDevMode ? [{ debugName: "resetFilterOnHide" }] : /* istanbul ignore next */ []));
+        this.nullOrZero = input(null, ...(ngDevMode ? [{ debugName: "nullOrZero" }] : /* istanbul ignore next */ []));
+        this.labelType = input("in_label", ...(ngDevMode ? [{ debugName: "labelType" }] : /* istanbul ignore next */ []));
+        this.showIcon = input(false, ...(ngDevMode ? [{ debugName: "showIcon" }] : /* istanbul ignore next */ []));
+        this.virtualScroll = input(false, ...(ngDevMode ? [{ debugName: "virtualScroll" }] : /* istanbul ignore next */ []));
+        this.maxSelectedLabels = input(2, ...(ngDevMode ? [{ debugName: "maxSelectedLabels" }] : /* istanbul ignore next */ []));
+        this.style = input(...(ngDevMode ? [undefined, { debugName: "style" }] : /* istanbul ignore next */ []));
+        this.disabled = input(false, ...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
+        this.changed = output();
+        this.value = model([], ...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
+        this.touched = model(false, ...(ngDevMode ? [{ debugName: "touched" }] : /* istanbul ignore next */ []));
+        this.multiSelectControl = new FormControl([], { nonNullable: true });
+        this.selectedItems = computed(() => {
+            const suffix = this.selectedItemsLabel()?.trim();
+            return suffix ? `Selecionado {0} ${suffix}` : undefined;
+        }, ...(ngDevMode ? [{ debugName: "selectedItems" }] : /* istanbul ignore next */ []));
+        effect(() => {
+            const currentValue = this.value();
+            if (this.multiSelectControl.value !== currentValue) {
+                this.multiSelectControl.setValue(currentValue, { emitEvent: false });
+            }
+        });
+        effect(() => {
+            if (this.disabled()) {
+                this.multiSelectControl.disable({ emitEvent: false });
+                return;
+            }
+            this.multiSelectControl.enable({ emitEvent: false });
+        });
+    }
+    onBlur() {
+        this.touched.set(true);
+    }
+    onChanged(event) {
+        const nextValue = event.value ?? [];
+        this.multiSelectControl.setValue(nextValue, { emitEvent: false });
+        this.value.set(nextValue);
+        this.changed.emit(nextValue);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: MultiSelectComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.18", type: MultiSelectComponent, isStandalone: true, selector: "app-multi-select", inputs: { items: { classPropertyName: "items", publicName: "items", isSignal: true, isRequired: false, transformFunction: null }, disabledValue: { classPropertyName: "disabledValue", publicName: "disabledValue", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, selectedItemsLabel: { classPropertyName: "selectedItemsLabel", publicName: "selectedItemsLabel", isSignal: true, isRequired: false, transformFunction: null }, lengthTextSelected: { classPropertyName: "lengthTextSelected", publicName: "lengthTextSelected", isSignal: true, isRequired: false, transformFunction: null }, filter: { classPropertyName: "filter", publicName: "filter", isSignal: true, isRequired: false, transformFunction: null }, displaySelectedLabel: { classPropertyName: "displaySelectedLabel", publicName: "displaySelectedLabel", isSignal: true, isRequired: false, transformFunction: null }, emptyOption: { classPropertyName: "emptyOption", publicName: "emptyOption", isSignal: true, isRequired: false, transformFunction: null }, showClear: { classPropertyName: "showClear", publicName: "showClear", isSignal: true, isRequired: false, transformFunction: null }, withIcons: { classPropertyName: "withIcons", publicName: "withIcons", isSignal: true, isRequired: false, transformFunction: null }, resetFilterOnHide: { classPropertyName: "resetFilterOnHide", publicName: "resetFilterOnHide", isSignal: true, isRequired: false, transformFunction: null }, nullOrZero: { classPropertyName: "nullOrZero", publicName: "nullOrZero", isSignal: true, isRequired: false, transformFunction: null }, labelType: { classPropertyName: "labelType", publicName: "labelType", isSignal: true, isRequired: false, transformFunction: null }, showIcon: { classPropertyName: "showIcon", publicName: "showIcon", isSignal: true, isRequired: false, transformFunction: null }, virtualScroll: { classPropertyName: "virtualScroll", publicName: "virtualScroll", isSignal: true, isRequired: false, transformFunction: null }, maxSelectedLabels: { classPropertyName: "maxSelectedLabels", publicName: "maxSelectedLabels", isSignal: true, isRequired: false, transformFunction: null }, style: { classPropertyName: "style", publicName: "style", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, touched: { classPropertyName: "touched", publicName: "touched", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { changed: "changed", value: "valueChange", touched: "touchedChange" }, ngImport: i0, template: "<div class=\"multiselect\">\n  <p-multiSelect\n    [options]=\"items()\"\n    [optionLabel]=\"'label'\"\n    [optionValue]=\"'value'\"\n    [panelStyle]=\"{minWidth:'12em'}\"\n    [filter]=\"filter()\"\n    [selectedItemsLabel]=\"selectedItems()\"\n    [displaySelectedLabel]=\"displaySelectedLabel()\"\n    [maxSelectedLabels]=\"maxSelectedLabels()\"\n    [style]=\"style()\"\n    [showClear]=\"showClear()\"\n    [placeholder]=\"placeholder()\"\n    [resetFilterOnHide]=\"resetFilterOnHide()\"\n    [virtualScroll]=\"virtualScroll()\"\n    [formControl]=\"multiSelectControl\"\n    (onBlur)=\"onBlur()\"\n    (onChange)=\"onChanged($event)\">\n    <ng-template let-option #item>\n      <div class=\"multiselect-option\">\n        @if (showIcon() && option.icon?.src) {\n          <img\n            class=\"multiselect-option__icon\"\n            [class]=\"option.icon?.cssClass\"\n            [src]=\"option.icon?.src\"\n            [alt]=\"option.label\"\n          />\n        }\n        <span class=\"multiselect-option__label\">{{ option.label }}</span>\n      </div>\n    </ng-template>\n  </p-multiSelect>\n</div>\n", styles: [".multiselect-option{display:inline-flex;align-items:center;gap:.5rem;min-width:0}.multiselect-option__icon{width:18px;height:14px;object-fit:contain;flex:0 0 auto}.multiselect-option__label{min-width:0;line-height:1.2}\n"], dependencies: [{ kind: "component", type: MultiSelect, selector: "p-multiSelect, p-multiselect, p-multi-select", inputs: ["id", "ariaLabel", "styleClass", "panelStyle", "panelStyleClass", "inputId", "readonly", "group", "filter", "filterPlaceHolder", "filterLocale", "overlayVisible", "tabindex", "dataKey", "ariaLabelledBy", "displaySelectedLabel", "maxSelectedLabels", "selectionLimit", "selectedItemsLabel", "showToggleAll", "emptyFilterMessage", "emptyMessage", "resetFilterOnHide", "dropdownIcon", "chipIcon", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "showHeader", "filterBy", "scrollHeight", "lazy", "virtualScroll", "loading", "virtualScrollItemSize", "loadingIcon", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "filterMatchMode", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "autofocusFilter", "display", "autocomplete", "showClear", "autofocus", "placeholder", "options", "filterValue", "selectAll", "focusOnHover", "filterFields", "selectOnFocus", "autoOptionFocus", "highlightOnSelect", "size", "variant", "fluid", "appendTo", "motionOptions"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onClear", "onPanelShow", "onPanelHide", "onLazyLoad", "onRemove", "onSelectAllChange"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: MultiSelectComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'app-multi-select', standalone: true, imports: [MultiSelect, ReactiveFormsModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"multiselect\">\n  <p-multiSelect\n    [options]=\"items()\"\n    [optionLabel]=\"'label'\"\n    [optionValue]=\"'value'\"\n    [panelStyle]=\"{minWidth:'12em'}\"\n    [filter]=\"filter()\"\n    [selectedItemsLabel]=\"selectedItems()\"\n    [displaySelectedLabel]=\"displaySelectedLabel()\"\n    [maxSelectedLabels]=\"maxSelectedLabels()\"\n    [style]=\"style()\"\n    [showClear]=\"showClear()\"\n    [placeholder]=\"placeholder()\"\n    [resetFilterOnHide]=\"resetFilterOnHide()\"\n    [virtualScroll]=\"virtualScroll()\"\n    [formControl]=\"multiSelectControl\"\n    (onBlur)=\"onBlur()\"\n    (onChange)=\"onChanged($event)\">\n    <ng-template let-option #item>\n      <div class=\"multiselect-option\">\n        @if (showIcon() && option.icon?.src) {\n          <img\n            class=\"multiselect-option__icon\"\n            [class]=\"option.icon?.cssClass\"\n            [src]=\"option.icon?.src\"\n            [alt]=\"option.label\"\n          />\n        }\n        <span class=\"multiselect-option__label\">{{ option.label }}</span>\n      </div>\n    </ng-template>\n  </p-multiSelect>\n</div>\n", styles: [".multiselect-option{display:inline-flex;align-items:center;gap:.5rem;min-width:0}.multiselect-option__icon{width:18px;height:14px;object-fit:contain;flex:0 0 auto}.multiselect-option__label{min-width:0;line-height:1.2}\n"] }]
+        }], ctorParameters: () => [], propDecorators: { items: [{ type: i0.Input, args: [{ isSignal: true, alias: "items", required: false }] }], disabledValue: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabledValue", required: false }] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], selectedItemsLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectedItemsLabel", required: false }] }], lengthTextSelected: [{ type: i0.Input, args: [{ isSignal: true, alias: "lengthTextSelected", required: false }] }], filter: [{ type: i0.Input, args: [{ isSignal: true, alias: "filter", required: false }] }], displaySelectedLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "displaySelectedLabel", required: false }] }], emptyOption: [{ type: i0.Input, args: [{ isSignal: true, alias: "emptyOption", required: false }] }], showClear: [{ type: i0.Input, args: [{ isSignal: true, alias: "showClear", required: false }] }], withIcons: [{ type: i0.Input, args: [{ isSignal: true, alias: "withIcons", required: false }] }], resetFilterOnHide: [{ type: i0.Input, args: [{ isSignal: true, alias: "resetFilterOnHide", required: false }] }], nullOrZero: [{ type: i0.Input, args: [{ isSignal: true, alias: "nullOrZero", required: false }] }], labelType: [{ type: i0.Input, args: [{ isSignal: true, alias: "labelType", required: false }] }], showIcon: [{ type: i0.Input, args: [{ isSignal: true, alias: "showIcon", required: false }] }], virtualScroll: [{ type: i0.Input, args: [{ isSignal: true, alias: "virtualScroll", required: false }] }], maxSelectedLabels: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxSelectedLabels", required: false }] }], style: [{ type: i0.Input, args: [{ isSignal: true, alias: "style", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], changed: [{ type: i0.Output, args: ["changed"] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }, { type: i0.Output, args: ["valueChange"] }], touched: [{ type: i0.Input, args: [{ isSignal: true, alias: "touched", required: false }] }, { type: i0.Output, args: ["touchedChange"] }] } });
+
+/**
+ * Directive to define content for a specific step in the stepper.
+ * Used with ng-template to provide step content.
+ *
+ * @example
+ * ```html
+ * <ng-template appStepperStep [step]="0" let-activateCallback="activateCallback">
+ *   <div>Step content here</div>
+ *   <button (click)="activateCallback(1)">Next</button>
+ * </ng-template>
+ * ```
+ */
+class StepperStepDirective {
+    constructor() {
+        /**
+         * Reference to the template
+         */
+        this.templateRef = inject((TemplateRef));
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: StepperStepDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.18", type: StepperStepDirective, isStandalone: true, selector: "[appStepperStep]", inputs: { step: "step" }, ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: StepperStepDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[appStepperStep]',
+                    standalone: true
+                }]
+        }], propDecorators: { step: [{
+                type: Input,
+                args: [{ required: true }]
+            }] } });
+
+/**
+ * A reusable stepper component based on PrimeNG's Stepper.
+ * Implements ControlValueAccessor for reactive forms integration.
+ *
+ * @example
+ * ```html
+ * <app-stepper-control
+ *   [steps]="stepConfigs"
+ *   [linear]="true"
+ *   [orientation]="'horizontal'"
+ *   (stepChange)="onStepChange($event)">
+ *
+ *   <ng-template appStepperStep [step]="0" let-activateCallback="activateCallback">
+ *     <div>Step 1 content</div>
+ *     <button (click)="activateCallback(1)">Next</button>
+ *   </ng-template>
+ *
+ *   <ng-template appStepperStep [step]="1" let-activateCallback="activateCallback">
+ *     <div>Step 2 content</div>
+ *     <button (click)="activateCallback(0)">Back</button>
+ *     <button (click)="activateCallback(2)">Next</button>
+ *   </ng-template>
+ * </app-stepper-control>
+ * ```
+ */
+class StepperControlComponent {
+    constructor() {
+        /**
+         * Array of step configurations
+         */
+        this.steps = input.required(...(ngDevMode ? [{ debugName: "steps" }] : /* istanbul ignore next */ []));
+        /**
+         * Whether steps must be completed in sequence
+         */
+        this.linear = input(false, ...(ngDevMode ? [{ debugName: "linear" }] : /* istanbul ignore next */ []));
+        /**
+         * Orientation of the stepper: 'horizontal' or 'vertical'
+         */
+        this.orientation = input('horizontal', ...(ngDevMode ? [{ debugName: "orientation" }] : /* istanbul ignore next */ []));
+        /**
+         * Custom CSS class for the stepper container
+         */
+        this.styleClass = input('', ...(ngDevMode ? [{ debugName: "styleClass" }] : /* istanbul ignore next */ []));
+        /**
+         * Whether to show navigation buttons
+         */
+        this.showNavigation = input(true, ...(ngDevMode ? [{ debugName: "showNavigation" }] : /* istanbul ignore next */ []));
+        /**
+         * Label for the "Back" button
+         */
+        this.backLabel = input('Back', ...(ngDevMode ? [{ debugName: "backLabel" }] : /* istanbul ignore next */ []));
+        /**
+         * Label for the "Next" button
+         */
+        this.nextLabel = input('Next', ...(ngDevMode ? [{ debugName: "nextLabel" }] : /* istanbul ignore next */ []));
+        /**
+         * Label for the "Finish" button on the last step
+         */
+        this.finishLabel = input('Finish', ...(ngDevMode ? [{ debugName: "finishLabel" }] : /* istanbul ignore next */ []));
+        /**
+         * Emitted when the active step changes
+         */
+        this.stepChange = output();
+        /**
+         * Emitted when the stepper is completed (last step finished)
+         */
+        this.complete = output();
+        /**
+         * Current active step value (signal-based state)
+         */
+        this.activeStep = signal(0, ...(ngDevMode ? [{ debugName: "activeStep" }] : /* istanbul ignore next */ []));
+        /**
+         * Whether the component is disabled
+         */
+        this.isDisabled = signal(false, ...(ngDevMode ? [{ debugName: "isDisabled" }] : /* istanbul ignore next */ []));
+        /**
+         * Map of step templates by step value
+         */
+        this.stepTemplateMap = signal(new Map(), ...(ngDevMode ? [{ debugName: "stepTemplateMap" }] : /* istanbul ignore next */ []));
+        this.propagateChange = () => { };
+        this.propagateTouched = () => { };
+    }
+    ngAfterContentInit() {
+        this.buildTemplateMap();
+        this.stepTemplates.changes.subscribe(() => {
+            this.buildTemplateMap();
+        });
+    }
+    /**
+     * Build a map of step templates for quick lookup
+     */
+    buildTemplateMap() {
+        const map = new Map();
+        this.stepTemplates.forEach((directive) => {
+            map.set(directive.step, directive.templateRef);
+        });
+        this.stepTemplateMap.set(map);
+    }
+    /**
+     * Get the template for a specific step
+     */
+    getStepTemplate(stepValue) {
+        return this.stepTemplateMap().get(stepValue) ?? null;
+    }
+    /**
+     * Navigate to a specific step
+     */
+    goToStep(stepValue) {
+        if (this.isDisabled()) {
+            return;
+        }
+        const stepsArray = this.steps();
+        const targetStep = stepsArray.find(s => s.value === stepValue);
+        if (!targetStep || targetStep.disabled) {
+            return;
+        }
+        if (this.linear()) {
+            const currentIndex = stepsArray.findIndex(s => s.value === this.activeStep());
+            const targetIndex = stepsArray.findIndex(s => s.value === stepValue);
+            // In linear mode, can only go forward one step or backward
+            if (targetIndex > currentIndex + 1) {
+                return;
+            }
+        }
+        const previousStep = this.activeStep();
+        this.activeStep.set(stepValue);
+        this.propagateChange(stepValue);
+        this.stepChange.emit({
+            previousStep,
+            currentStep: stepValue,
+            step: targetStep
+        });
+    }
+    /**
+     * Navigate to the next step
+     */
+    nextStep() {
+        const stepsArray = this.steps();
+        const currentIndex = stepsArray.findIndex(s => s.value === this.activeStep());
+        if (currentIndex < stepsArray.length - 1) {
+            const nextStepValue = stepsArray[currentIndex + 1].value;
+            this.goToStep(nextStepValue);
+        }
+    }
+    /**
+     * Navigate to the previous step
+     */
+    previousStep() {
+        const stepsArray = this.steps();
+        const currentIndex = stepsArray.findIndex(s => s.value === this.activeStep());
+        if (currentIndex > 0) {
+            const prevStepValue = stepsArray[currentIndex - 1].value;
+            this.goToStep(prevStepValue);
+        }
+    }
+    /**
+     * Check if the current step is the first step
+     */
+    isFirstStep() {
+        const stepsArray = this.steps();
+        return stepsArray.length > 0 && this.activeStep() === stepsArray[0].value;
+    }
+    /**
+     * Check if the current step is the last step
+     */
+    isLastStep() {
+        const stepsArray = this.steps();
+        return stepsArray.length > 0 && this.activeStep() === stepsArray[stepsArray.length - 1].value;
+    }
+    /**
+     * Handle finish action on the last step
+     */
+    onFinish() {
+        this.complete.emit();
+    }
+    /**
+     * Handle step header click
+     */
+    onStepClick(step) {
+        if (!step.disabled) {
+            this.goToStep(step.value);
+        }
+    }
+    /**
+     * Check if a step is active
+     */
+    isStepActive(stepValue) {
+        return this.activeStep() === stepValue;
+    }
+    /**
+     * Check if a step is completed (all previous steps in linear mode)
+     */
+    isStepCompleted(stepValue) {
+        const stepsArray = this.steps();
+        const currentIndex = stepsArray.findIndex(s => s.value === this.activeStep());
+        const stepIndex = stepsArray.findIndex(s => s.value === stepValue);
+        return stepIndex < currentIndex;
+    }
+    // ControlValueAccessor implementation
+    writeValue(value) {
+        if (value !== undefined && value !== null) {
+            this.activeStep.set(value);
+        }
+    }
+    registerOnChange(fn) {
+        this.propagateChange = fn;
+    }
+    registerOnTouched(fn) {
+        this.propagateTouched = fn;
+    }
+    setDisabledState(isDisabled) {
+        this.isDisabled.set(isDisabled);
+    }
+    onBlur() {
+        this.propagateTouched();
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: StepperControlComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.18", type: StepperControlComponent, isStandalone: true, selector: "app-stepper-control", inputs: { steps: { classPropertyName: "steps", publicName: "steps", isSignal: true, isRequired: true, transformFunction: null }, linear: { classPropertyName: "linear", publicName: "linear", isSignal: true, isRequired: false, transformFunction: null }, orientation: { classPropertyName: "orientation", publicName: "orientation", isSignal: true, isRequired: false, transformFunction: null }, styleClass: { classPropertyName: "styleClass", publicName: "styleClass", isSignal: true, isRequired: false, transformFunction: null }, showNavigation: { classPropertyName: "showNavigation", publicName: "showNavigation", isSignal: true, isRequired: false, transformFunction: null }, backLabel: { classPropertyName: "backLabel", publicName: "backLabel", isSignal: true, isRequired: false, transformFunction: null }, nextLabel: { classPropertyName: "nextLabel", publicName: "nextLabel", isSignal: true, isRequired: false, transformFunction: null }, finishLabel: { classPropertyName: "finishLabel", publicName: "finishLabel", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { stepChange: "stepChange", complete: "complete" }, providers: [
+            {
+                provide: NG_VALUE_ACCESSOR,
+                useExisting: forwardRef(() => StepperControlComponent),
+                multi: true
+            }
+        ], queries: [{ propertyName: "stepTemplates", predicate: StepperStepDirective }], ngImport: i0, template: "<div\n    class=\"stepper-control-wrapper\"\n    [class.stepper-control--horizontal]=\"orientation() === 'horizontal'\"\n    [class.stepper-control--vertical]=\"orientation() === 'vertical'\"\n    [class.stepper-control--disabled]=\"isDisabled()\"\n    [class]=\"styleClass()\">\n\n    @if (orientation() === 'horizontal') {\n        <p-stepper [value]=\"activeStep()\" [linear]=\"linear()\">\n            <p-step-list>\n                @for (step of steps(); track step.value) {\n                    <p-step\n                        [value]=\"step.value\"\n                        [disabled]=\"step.disabled || isDisabled()\"\n                        (click)=\"onStepClick(step)\">\n                        @if (step.icon) {\n                            <i [class]=\"step.icon\"></i>\n                        }\n                        <span class=\"step-label\">{{ step.label }}</span>\n                    </p-step>\n                }\n            </p-step-list>\n\n            <p-step-panels>\n                @for (step of steps(); track step.value) {\n                    <p-step-panel [value]=\"step.value\">\n                        <ng-template #content let-activateCallback=\"activateCallback\">\n                            <div class=\"step-content\">\n                                @if (getStepTemplate(step.value)) {\n                                    <ng-container\n                                        [ngTemplateOutlet]=\"getStepTemplate(step.value)\"\n                                        [ngTemplateOutletContext]=\"{\n                                            activateCallback: goToStep.bind(this),\n                                            step: step.value,\n                                            isActive: isStepActive(step.value),\n                                            index: $index\n                                        }\">\n                                    </ng-container>\n                                }\n\n                                @if (showNavigation()) {\n                                    <div class=\"step-navigation\">\n                                        @if (!isFirstStep()) {\n                                            <p-button\n                                                [label]=\"backLabel()\"\n                                                [outlined]=\"true\"\n                                                [disabled]=\"isDisabled()\"\n                                                (onClick)=\"previousStep()\"\n                                                severity=\"secondary\">\n                                            </p-button>\n                                        }\n\n                                        @if (!isLastStep()) {\n                                            <p-button\n                                                [label]=\"nextLabel()\"\n                                                [disabled]=\"isDisabled()\"\n                                                (onClick)=\"nextStep()\">\n                                            </p-button>\n                                        }\n\n                                        @if (isLastStep()) {\n                                            <p-button\n                                                [label]=\"finishLabel()\"\n                                                [disabled]=\"isDisabled()\"\n                                                (onClick)=\"onFinish()\"\n                                                severity=\"success\">\n                                            </p-button>\n                                        }\n                                    </div>\n                                }\n                            </div>\n                        </ng-template>\n                    </p-step-panel>\n                }\n            </p-step-panels>\n        </p-stepper>\n    } @else {\n        <p-stepper [value]=\"activeStep()\" [linear]=\"linear()\">\n            @for (step of steps(); track step.value) {\n                <p-step-item [value]=\"step.value\">\n                    <p-step\n                        [value]=\"step.value\"\n                        [disabled]=\"step.disabled || isDisabled()\"\n                        (click)=\"onStepClick(step)\">\n                        @if (step.icon) {\n                            <i [class]=\"step.icon\"></i>\n                        }\n                        <span class=\"step-label\">{{ step.label }}</span>\n                    </p-step>\n\n                    <p-step-panel [value]=\"step.value\">\n                        <ng-template #content let-activateCallback=\"activateCallback\">\n                            <div class=\"step-content step-content--vertical\">\n                                @if (getStepTemplate(step.value)) {\n                                    <ng-container\n                                        [ngTemplateOutlet]=\"getStepTemplate(step.value)\"\n                                        [ngTemplateOutletContext]=\"{\n                                            activateCallback: goToStep.bind(this),\n                                            step: step.value,\n                                            isActive: isStepActive(step.value),\n                                            index: $index\n                                        }\">\n                                    </ng-container>\n                                }\n\n                                @if (showNavigation()) {\n                                    <div class=\"step-navigation step-navigation--vertical\">\n                                        @if (!isFirstStep()) {\n                                            <p-button\n                                                [label]=\"backLabel()\"\n                                                [outlined]=\"true\"\n                                                [disabled]=\"isDisabled()\"\n                                                (onClick)=\"previousStep()\"\n                                                severity=\"secondary\">\n                                            </p-button>\n                                        }\n\n                                        @if (!isLastStep()) {\n                                            <p-button\n                                                [label]=\"nextLabel()\"\n                                                [disabled]=\"isDisabled()\"\n                                                (onClick)=\"nextStep()\">\n                                            </p-button>\n                                        }\n\n                                        @if (isLastStep()) {\n                                            <p-button\n                                                [label]=\"finishLabel()\"\n                                                [disabled]=\"isDisabled()\"\n                                                (onClick)=\"onFinish()\"\n                                                severity=\"success\">\n                                            </p-button>\n                                        }\n                                    </div>\n                                }\n                            </div>\n                        </ng-template>\n                    </p-step-panel>\n                </p-step-item>\n            }\n        </p-stepper>\n    }\n</div>\n", styles: [".stepper-control-wrapper{width:100%}.stepper-control-wrapper.stepper-control--disabled{opacity:.6;pointer-events:none}.stepper-control--horizontal .step-content{padding:1rem 0}.stepper-control--horizontal .step-navigation{display:flex;justify-content:flex-end;gap:.5rem;margin-top:1rem;padding-top:1rem;border-top:1px solid var(--p-surface-200, #e4e4e7)}.stepper-control--vertical .step-content--vertical{padding:1rem 0 1rem 1.5rem;border-left:2px solid var(--p-surface-200, #e4e4e7);margin-left:.75rem}.stepper-control--vertical .step-navigation--vertical{display:flex;gap:.5rem;margin-top:1rem}.step-label{margin-left:.5rem;color:inherit}:host ::ng-deep .p-stepper{width:100%}:host ::ng-deep .p-step-header{display:flex;align-items:center;gap:.75rem;padding:.75rem 1rem;border-radius:.375rem;cursor:pointer;transition:background-color .2s ease,box-shadow .2s ease}:host ::ng-deep .p-step-header:focus-visible{outline:none;box-shadow:0 0 0 2px #05966980}:host ::ng-deep .p-step-header:hover:not(.p-disabled){background-color:#18181b0d}:host ::ng-deep .p-step-number{display:flex;align-items:center;justify-content:center;width:2rem;height:2rem;border-radius:50%;font-size:.875rem;font-weight:600;flex-shrink:0;background-color:#e4e4e7;color:#52525b;transition:background-color .2s ease,color .2s ease}:host ::ng-deep .p-step-title{font-size:.9375rem;font-weight:500;transition:color .2s ease;color:#52525b!important}:host ::ng-deep .p-step{cursor:pointer;transition:all .2s ease}:host ::ng-deep .p-step.p-step-active .p-step-header{background-color:#0596691a}:host ::ng-deep .p-step.p-step-active .p-step-number{background-color:#059669;color:#fff}:host ::ng-deep .p-step.p-step-active .p-step-title{color:#059669!important;font-weight:600}:host ::ng-deep .p-step.p-step-completed .p-step-number{background-color:#10b981;color:#fff}:host ::ng-deep .p-step.p-step-completed .p-step-title{color:#10b981!important}:host ::ng-deep .p-step:not(.p-step-active):not(.p-step-completed) .p-step-title{color:#52525b!important;opacity:1!important}:host ::ng-deep .p-step:not(.p-step-active):not(.p-step-completed) .p-step-number{background-color:#e4e4e7;color:#52525b}:host ::ng-deep .p-step:hover:not(.p-disabled) .p-step-header{background-color:#18181b0d}:host ::ng-deep .p-step.p-disabled{cursor:not-allowed}:host ::ng-deep .p-step.p-disabled .p-step-header{opacity:.5;cursor:not-allowed}:host ::ng-deep .p-step.p-disabled .p-step-title{color:#71717a!important}:host ::ng-deep .p-step-separator{flex:1;height:2px;background-color:#e4e4e7;margin:0 .5rem}:host ::ng-deep .p-step-separator.p-step-separator-completed{background-color:#10b981}:host ::ng-deep .p-step-list{display:flex;align-items:center;margin-bottom:1rem;padding:.5rem 0}:host ::ng-deep .p-step-panel,:host ::ng-deep .p-step-panels{padding:1rem 0;background-color:#fff!important}:host ::ng-deep .p-steppanel{background-color:#fff!important;color:#18181b!important;padding:1rem 1rem 1rem 2rem}:host ::ng-deep .p-steppanel p,:host ::ng-deep .p-steppanel span,:host ::ng-deep .p-steppanel div{color:#52525b}:host ::ng-deep .p-steppanel.p-steppanel-active{background-color:#fff!important}:host ::ng-deep .p-steppanel-content{background-color:#fff!important;color:#18181b!important}:host ::ng-deep .p-steppanel-content p{color:#52525b}:host ::ng-deep .p-stepper-content{background-color:#fff!important}:host ::ng-deep .p-step-item{margin-bottom:.5rem}:host ::ng-deep .p-stepper-vertical .p-step-list{flex-direction:column;align-items:flex-start}:host ::ng-deep .p-stepper-vertical .p-step-separator{width:2px;height:2rem;margin:.25rem 0 .25rem 1rem}:host ::ng-deep .p-stepper-vertical .p-step-item{display:flex;flex-direction:column;width:100%}:host ::ng-deep .p-stepper-vertical .p-step-header{width:100%}@media(max-width:768px){:host ::ng-deep .p-step-header{padding:.5rem .75rem;gap:.5rem}:host ::ng-deep .p-step-title{font-size:.875rem}:host ::ng-deep .p-step-number{width:1.75rem;height:1.75rem;font-size:.75rem}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$7.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: StepperModule }, { kind: "component", type: i2$2.Stepper, selector: "p-stepper", inputs: ["value", "linear", "transitionOptions", "motionOptions"], outputs: ["valueChange"] }, { kind: "component", type: i2$2.StepList, selector: "p-step-list" }, { kind: "component", type: i2$2.StepPanels, selector: "p-step-panels" }, { kind: "component", type: i2$2.StepPanel, selector: "p-step-panel", inputs: ["value"], outputs: ["valueChange"] }, { kind: "component", type: i2$2.StepItem, selector: "p-step-item", inputs: ["value"], outputs: ["valueChange"] }, { kind: "component", type: i2$2.Step, selector: "p-step", inputs: ["value", "disabled"], outputs: ["valueChange"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "component", type: i1.Button, selector: "p-button", inputs: ["hostName", "type", "badge", "disabled", "raised", "rounded", "text", "plain", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "autofocus", "iconPos", "icon", "label", "loading", "loadingIcon", "severity", "buttonProps", "fluid"], outputs: ["onClick", "onFocus", "onBlur"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: StepperControlComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'app-stepper-control', standalone: true, imports: [
+                        CommonModule,
+                        StepperModule,
+                        ButtonModule
+                    ], changeDetection: ChangeDetectionStrategy.OnPush, providers: [
+                        {
+                            provide: NG_VALUE_ACCESSOR,
+                            useExisting: forwardRef(() => StepperControlComponent),
+                            multi: true
+                        }
+                    ], template: "<div\n    class=\"stepper-control-wrapper\"\n    [class.stepper-control--horizontal]=\"orientation() === 'horizontal'\"\n    [class.stepper-control--vertical]=\"orientation() === 'vertical'\"\n    [class.stepper-control--disabled]=\"isDisabled()\"\n    [class]=\"styleClass()\">\n\n    @if (orientation() === 'horizontal') {\n        <p-stepper [value]=\"activeStep()\" [linear]=\"linear()\">\n            <p-step-list>\n                @for (step of steps(); track step.value) {\n                    <p-step\n                        [value]=\"step.value\"\n                        [disabled]=\"step.disabled || isDisabled()\"\n                        (click)=\"onStepClick(step)\">\n                        @if (step.icon) {\n                            <i [class]=\"step.icon\"></i>\n                        }\n                        <span class=\"step-label\">{{ step.label }}</span>\n                    </p-step>\n                }\n            </p-step-list>\n\n            <p-step-panels>\n                @for (step of steps(); track step.value) {\n                    <p-step-panel [value]=\"step.value\">\n                        <ng-template #content let-activateCallback=\"activateCallback\">\n                            <div class=\"step-content\">\n                                @if (getStepTemplate(step.value)) {\n                                    <ng-container\n                                        [ngTemplateOutlet]=\"getStepTemplate(step.value)\"\n                                        [ngTemplateOutletContext]=\"{\n                                            activateCallback: goToStep.bind(this),\n                                            step: step.value,\n                                            isActive: isStepActive(step.value),\n                                            index: $index\n                                        }\">\n                                    </ng-container>\n                                }\n\n                                @if (showNavigation()) {\n                                    <div class=\"step-navigation\">\n                                        @if (!isFirstStep()) {\n                                            <p-button\n                                                [label]=\"backLabel()\"\n                                                [outlined]=\"true\"\n                                                [disabled]=\"isDisabled()\"\n                                                (onClick)=\"previousStep()\"\n                                                severity=\"secondary\">\n                                            </p-button>\n                                        }\n\n                                        @if (!isLastStep()) {\n                                            <p-button\n                                                [label]=\"nextLabel()\"\n                                                [disabled]=\"isDisabled()\"\n                                                (onClick)=\"nextStep()\">\n                                            </p-button>\n                                        }\n\n                                        @if (isLastStep()) {\n                                            <p-button\n                                                [label]=\"finishLabel()\"\n                                                [disabled]=\"isDisabled()\"\n                                                (onClick)=\"onFinish()\"\n                                                severity=\"success\">\n                                            </p-button>\n                                        }\n                                    </div>\n                                }\n                            </div>\n                        </ng-template>\n                    </p-step-panel>\n                }\n            </p-step-panels>\n        </p-stepper>\n    } @else {\n        <p-stepper [value]=\"activeStep()\" [linear]=\"linear()\">\n            @for (step of steps(); track step.value) {\n                <p-step-item [value]=\"step.value\">\n                    <p-step\n                        [value]=\"step.value\"\n                        [disabled]=\"step.disabled || isDisabled()\"\n                        (click)=\"onStepClick(step)\">\n                        @if (step.icon) {\n                            <i [class]=\"step.icon\"></i>\n                        }\n                        <span class=\"step-label\">{{ step.label }}</span>\n                    </p-step>\n\n                    <p-step-panel [value]=\"step.value\">\n                        <ng-template #content let-activateCallback=\"activateCallback\">\n                            <div class=\"step-content step-content--vertical\">\n                                @if (getStepTemplate(step.value)) {\n                                    <ng-container\n                                        [ngTemplateOutlet]=\"getStepTemplate(step.value)\"\n                                        [ngTemplateOutletContext]=\"{\n                                            activateCallback: goToStep.bind(this),\n                                            step: step.value,\n                                            isActive: isStepActive(step.value),\n                                            index: $index\n                                        }\">\n                                    </ng-container>\n                                }\n\n                                @if (showNavigation()) {\n                                    <div class=\"step-navigation step-navigation--vertical\">\n                                        @if (!isFirstStep()) {\n                                            <p-button\n                                                [label]=\"backLabel()\"\n                                                [outlined]=\"true\"\n                                                [disabled]=\"isDisabled()\"\n                                                (onClick)=\"previousStep()\"\n                                                severity=\"secondary\">\n                                            </p-button>\n                                        }\n\n                                        @if (!isLastStep()) {\n                                            <p-button\n                                                [label]=\"nextLabel()\"\n                                                [disabled]=\"isDisabled()\"\n                                                (onClick)=\"nextStep()\">\n                                            </p-button>\n                                        }\n\n                                        @if (isLastStep()) {\n                                            <p-button\n                                                [label]=\"finishLabel()\"\n                                                [disabled]=\"isDisabled()\"\n                                                (onClick)=\"onFinish()\"\n                                                severity=\"success\">\n                                            </p-button>\n                                        }\n                                    </div>\n                                }\n                            </div>\n                        </ng-template>\n                    </p-step-panel>\n                </p-step-item>\n            }\n        </p-stepper>\n    }\n</div>\n", styles: [".stepper-control-wrapper{width:100%}.stepper-control-wrapper.stepper-control--disabled{opacity:.6;pointer-events:none}.stepper-control--horizontal .step-content{padding:1rem 0}.stepper-control--horizontal .step-navigation{display:flex;justify-content:flex-end;gap:.5rem;margin-top:1rem;padding-top:1rem;border-top:1px solid var(--p-surface-200, #e4e4e7)}.stepper-control--vertical .step-content--vertical{padding:1rem 0 1rem 1.5rem;border-left:2px solid var(--p-surface-200, #e4e4e7);margin-left:.75rem}.stepper-control--vertical .step-navigation--vertical{display:flex;gap:.5rem;margin-top:1rem}.step-label{margin-left:.5rem;color:inherit}:host ::ng-deep .p-stepper{width:100%}:host ::ng-deep .p-step-header{display:flex;align-items:center;gap:.75rem;padding:.75rem 1rem;border-radius:.375rem;cursor:pointer;transition:background-color .2s ease,box-shadow .2s ease}:host ::ng-deep .p-step-header:focus-visible{outline:none;box-shadow:0 0 0 2px #05966980}:host ::ng-deep .p-step-header:hover:not(.p-disabled){background-color:#18181b0d}:host ::ng-deep .p-step-number{display:flex;align-items:center;justify-content:center;width:2rem;height:2rem;border-radius:50%;font-size:.875rem;font-weight:600;flex-shrink:0;background-color:#e4e4e7;color:#52525b;transition:background-color .2s ease,color .2s ease}:host ::ng-deep .p-step-title{font-size:.9375rem;font-weight:500;transition:color .2s ease;color:#52525b!important}:host ::ng-deep .p-step{cursor:pointer;transition:all .2s ease}:host ::ng-deep .p-step.p-step-active .p-step-header{background-color:#0596691a}:host ::ng-deep .p-step.p-step-active .p-step-number{background-color:#059669;color:#fff}:host ::ng-deep .p-step.p-step-active .p-step-title{color:#059669!important;font-weight:600}:host ::ng-deep .p-step.p-step-completed .p-step-number{background-color:#10b981;color:#fff}:host ::ng-deep .p-step.p-step-completed .p-step-title{color:#10b981!important}:host ::ng-deep .p-step:not(.p-step-active):not(.p-step-completed) .p-step-title{color:#52525b!important;opacity:1!important}:host ::ng-deep .p-step:not(.p-step-active):not(.p-step-completed) .p-step-number{background-color:#e4e4e7;color:#52525b}:host ::ng-deep .p-step:hover:not(.p-disabled) .p-step-header{background-color:#18181b0d}:host ::ng-deep .p-step.p-disabled{cursor:not-allowed}:host ::ng-deep .p-step.p-disabled .p-step-header{opacity:.5;cursor:not-allowed}:host ::ng-deep .p-step.p-disabled .p-step-title{color:#71717a!important}:host ::ng-deep .p-step-separator{flex:1;height:2px;background-color:#e4e4e7;margin:0 .5rem}:host ::ng-deep .p-step-separator.p-step-separator-completed{background-color:#10b981}:host ::ng-deep .p-step-list{display:flex;align-items:center;margin-bottom:1rem;padding:.5rem 0}:host ::ng-deep .p-step-panel,:host ::ng-deep .p-step-panels{padding:1rem 0;background-color:#fff!important}:host ::ng-deep .p-steppanel{background-color:#fff!important;color:#18181b!important;padding:1rem 1rem 1rem 2rem}:host ::ng-deep .p-steppanel p,:host ::ng-deep .p-steppanel span,:host ::ng-deep .p-steppanel div{color:#52525b}:host ::ng-deep .p-steppanel.p-steppanel-active{background-color:#fff!important}:host ::ng-deep .p-steppanel-content{background-color:#fff!important;color:#18181b!important}:host ::ng-deep .p-steppanel-content p{color:#52525b}:host ::ng-deep .p-stepper-content{background-color:#fff!important}:host ::ng-deep .p-step-item{margin-bottom:.5rem}:host ::ng-deep .p-stepper-vertical .p-step-list{flex-direction:column;align-items:flex-start}:host ::ng-deep .p-stepper-vertical .p-step-separator{width:2px;height:2rem;margin:.25rem 0 .25rem 1rem}:host ::ng-deep .p-stepper-vertical .p-step-item{display:flex;flex-direction:column;width:100%}:host ::ng-deep .p-stepper-vertical .p-step-header{width:100%}@media(max-width:768px){:host ::ng-deep .p-step-header{padding:.5rem .75rem;gap:.5rem}:host ::ng-deep .p-step-title{font-size:.875rem}:host ::ng-deep .p-step-number{width:1.75rem;height:1.75rem;font-size:.75rem}}\n"] }]
+        }], propDecorators: { steps: [{ type: i0.Input, args: [{ isSignal: true, alias: "steps", required: true }] }], linear: [{ type: i0.Input, args: [{ isSignal: true, alias: "linear", required: false }] }], orientation: [{ type: i0.Input, args: [{ isSignal: true, alias: "orientation", required: false }] }], styleClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "styleClass", required: false }] }], showNavigation: [{ type: i0.Input, args: [{ isSignal: true, alias: "showNavigation", required: false }] }], backLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "backLabel", required: false }] }], nextLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "nextLabel", required: false }] }], finishLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "finishLabel", required: false }] }], stepChange: [{ type: i0.Output, args: ["stepChange"] }], complete: [{ type: i0.Output, args: ["complete"] }], stepTemplates: [{
+                type: ContentChildren,
+                args: [StepperStepDirective]
+            }] } });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { AvatarComponent, BasicInputComponent, BasicSelectComponent, ButtonComponent, CalendarComponent, ChartsComponent, CheckboxComponent, FormFieldComponent, MultiSelectComponent, PasswordInputComponent, StepperControlComponent, StepperStepDirective, TableComponent };
+//# sourceMappingURL=springest.mjs.map