invensys-ng 21.3.13 → 21.4.1

package/fesm2022/invensys-ng.mjs

@@ -990,11 +990,11 @@ class IInputText {
         inputElement.value = this.value;
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: IInputText, deps: [{ token: i1.NgControl, optional: true, self: true }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.12", type: IInputText, isStandalone: true, selector: "i-input-text", inputs: { label: "label", type: "type", id: "id", fluid: "fluid", forceFloated: "forceFloated", hideText: "hideText", useFloatLabel: "useFloatLabel", placeholder: "placeholder", externalInvalid: "externalInvalid", externalErrorMessage: "externalErrorMessage", backgroundStyle: "backgroundStyle", icon: "icon", readonly: "readonly", disabled: "disabled", errorMessages: "errorMessages" }, ngImport: i0, template: "<div\n  class=\"i-input-wrapper\"\n  [class.invalid]=\"showErrors\"\n  [class.i-input--fluid]=\"fluid\"\n  [class.i-input--no-float]=\"!useFloatLabel\"\n  [attr.id]=\"componentId\"\n>\n  <div\n    [ngClass]=\"useFloatLabel ? 'float-label' : 'normal-input'\"\n    class=\"i-input-container\"\n    [class.has-icon]=\"icon\"\n  >\n    <div class=\"i-input-icon-wrapper\">\n      @if (icon) {\n        <span class=\"i-input-icon\" [attr.aria-hidden]=\"true\">\n          <i [class]=\"icon\" [attr.aria-hidden]=\"true\"></i>\n        </span>\n      }\n      <input\n        #inputElement\n        [id]=\"id || componentId\"\n        [type]=\"type\"\n        [attr.aria-label]=\"!useFloatLabel ? label : null\"\n        [disabled]=\"disabled\"\n        [readonly]=\"readonly\"\n        [value]=\"hideText ? '' : value || ''\"\n        (input)=\"handleInput($event)\"\n        (blur)=\"touch()\"\n        [placeholder]=\"useFloatLabel ? ' ' : placeholder || label\"\n        class=\"i-input\"\n        [class.has-icon]=\"icon\"\n        [class.hide-text]=\"hideText\"\n        [class.readonly]=\"readonly\"\n        [class.component-border]=\"backgroundStyle === 'component'\"\n        [iTooltip]=\"showErrors ? getErrorMessage() || '' : ''\"\n        tooltipPosition=\"below\"\n        [tooltipDelay]=\"100\"\n      />\n      @if (type === \"number\" && !disabled && !readonly) {\n        <div class=\"i-input-spinners\">\n          <button\n            type=\"button\"\n            class=\"i-input-spinner-button i-input-spinner-up\"\n            (click)=\"incrementNumber(inputElement)\"\n            [attr.aria-label]=\"'Increment ' + label\"\n            tabindex=\"-1\"\n          >\n            <i class=\"pi pi-chevron-up\"></i>\n          </button>\n          <button\n            type=\"button\"\n            class=\"i-input-spinner-button i-input-spinner-down\"\n            (click)=\"decrementNumber(inputElement)\"\n            [attr.aria-label]=\"'Decrement ' + label\"\n            tabindex=\"-1\"\n          >\n            <i class=\"pi pi-chevron-down\"></i>\n          </button>\n        </div>\n      }\n    </div>\n    @if (useFloatLabel) {\n      <label\n        [for]=\"id || componentId\"\n        class=\"i-label\"\n        [class.floated]=\"forceFloated || hasValue\"\n        >{{ label }}</label\n      >\n    }\n    <ng-content></ng-content>\n  </div>\n</div>\n", styles: [".i-input{color:var(--color-text-primary);border:1px solid var(--surface-border);background:var(--color-component-background-secondary)}.i-input.component-border{background:var(--color-component-background)}.i-input:focus{outline:none;border-color:var(--color-primary);box-shadow:0 2px 10px #0003}.i-label{color:var(--color-text-secondary)}.i-input:focus+.i-label,.i-input:not(:placeholder-shown)+.i-label,.i-label.floated{background:var(--color-component-background-secondary)}.i-input[disabled]{background:var(--color-disabled-background);border-color:var(--color-disabled-border);color:var(--color-text-disabled);cursor:not-allowed}.invalid .i-input{border-color:var(--color-danger)}.invalid .i-label,.invalid .i-error{color:var(--color-danger)}.i-input-spinner-button{color:var(--color-text-secondary);background:transparent}.i-input-spinner-button:hover{background:var(--surface-hover);color:var(--color-text-primary)}.i-input-spinner-button:active{background:var(--surface-hover);color:var(--color-primary)}.i-input-wrapper{display:flex;flex-direction:column;gap:8px;width:100%;margin-top:4px;font-size:1em}.i-input-wrapper.i-input--fluid{width:100%}.i-input-wrapper.i-input--no-float{margin-top:0;height:auto}.i-input-wrapper .i-input-container{display:flex;align-items:center;gap:8px}.i-input-wrapper .i-input{box-sizing:border-box;width:100%;border-radius:4px;min-height:42px;transition:border-color .15s ease,box-shadow .15s ease}.i-input-wrapper .i-input:focus{outline:none}.i-input-wrapper .i-input.has-icon{padding-left:34px}.i-input-wrapper .i-input.hide-text{color:transparent;text-shadow:none;cursor:pointer}.i-input-wrapper .i-input.readonly{cursor:pointer;-webkit-user-select:none;user-select:none;caret-color:transparent}.i-input-wrapper .i-input-icon-wrapper{position:relative;width:100%;display:flex}.i-input-wrapper .i-input-icon{position:absolute;top:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0;width:16px;height:16px;color:inherit;pointer-events:none;transform:translateY(-50%)}.i-input-wrapper .float-label{position:relative;display:flex;align-items:stretch}.i-input-wrapper .float-label .i-input-icon{left:10px}.i-input-wrapper .float-label .i-input{padding:14px 10px}.i-input-wrapper .float-label .i-input.has-icon{padding-left:34px}.i-input-wrapper .float-label .i-label{position:absolute;top:14px;left:8px;padding:0 4px;pointer-events:none;transition:all .15s ease}.i-input-wrapper .float-label .i-input:focus+.i-label,.i-input-wrapper .float-label .i-input:not(:placeholder-shown)+.i-label,.i-input-wrapper .float-label .i-label.floated{top:-8px}.i-input-wrapper .float-label.has-icon .i-label:not(.floated){left:34px}.i-input-wrapper .normal-input{position:relative}.i-input-wrapper .normal-input .i-input-icon{left:12px}.i-input-wrapper .normal-input .i-input{padding:8px 12px}.i-input-wrapper .normal-input .i-input.has-icon{padding-left:38px}.i-input-wrapper .i-input[type=number]{padding-right:32px}.i-input-wrapper .i-input[type=number]::-webkit-outer-spin-button,.i-input-wrapper .i-input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.i-input-wrapper .i-input[type=number]{appearance:textfield;-moz-appearance:textfield}.i-input-wrapper .i-input-spinners{position:absolute;right:4px;top:50%;transform:translateY(-50%);display:flex;flex-direction:column;gap:2px}.i-input-wrapper .i-input-spinner-button{display:flex;align-items:center;justify-content:center;width:24px;height:16px;border:none;border-radius:3px;cursor:pointer;transition:background-color .15s ease,color .15s ease;padding:0;font-size:10px}.i-input-wrapper .i-input-spinner-button i{font-size:10px;line-height:1}.i-input-wrapper .i-input-spinner-button:focus{outline:none}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: TooltipDirective, selector: "[iTooltip]", inputs: ["iTooltip", "tooltipPosition", "tooltipDelay"] }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.12", type: IInputText, isStandalone: true, selector: "i-input-text", inputs: { label: "label", type: "type", id: "id", fluid: "fluid", forceFloated: "forceFloated", hideText: "hideText", useFloatLabel: "useFloatLabel", placeholder: "placeholder", externalInvalid: "externalInvalid", externalErrorMessage: "externalErrorMessage", backgroundStyle: "backgroundStyle", icon: "icon", readonly: "readonly", disabled: "disabled", errorMessages: "errorMessages" }, ngImport: i0, template: "<div\n  class=\"i-input-wrapper\"\n  [class.invalid]=\"showErrors\"\n  [class.i-input--fluid]=\"fluid\"\n  [class.i-input--no-float]=\"!useFloatLabel\"\n  [attr.id]=\"componentId\"\n>\n  <div\n    [ngClass]=\"useFloatLabel ? 'float-label' : 'normal-input'\"\n    class=\"i-input-container\"\n    [class.has-icon]=\"icon\"\n  >\n    <div class=\"i-input-icon-wrapper\">\n      @if (icon) {\n        <span class=\"i-input-icon\" [attr.aria-hidden]=\"true\">\n          <i [class]=\"icon\" [attr.aria-hidden]=\"true\"></i>\n        </span>\n      }\n      <input\n        #inputElement\n        [id]=\"id || componentId\"\n        [type]=\"type\"\n        [attr.aria-label]=\"!useFloatLabel ? label : null\"\n        [disabled]=\"disabled\"\n        [readonly]=\"readonly\"\n        [value]=\"hideText ? '' : value || ''\"\n        (input)=\"handleInput($event)\"\n        (blur)=\"touch()\"\n        [placeholder]=\"useFloatLabel ? ' ' : placeholder || label\"\n        class=\"i-input\"\n        [class.has-icon]=\"icon\"\n        [class.hide-text]=\"hideText\"\n        [class.readonly]=\"readonly\"\n        [class.component-border]=\"backgroundStyle === 'component'\"\n        [iTooltip]=\"showErrors ? getErrorMessage() || '' : ''\"\n        tooltipPosition=\"below\"\n        [tooltipDelay]=\"100\"\n      />\n      @if (type === \"number\" && !disabled && !readonly) {\n        <div class=\"i-input-spinners\">\n          <button\n            type=\"button\"\n            class=\"i-input-spinner-button i-input-spinner-up\"\n            (click)=\"incrementNumber(inputElement)\"\n            [attr.aria-label]=\"'Increment ' + label\"\n            tabindex=\"-1\"\n          >\n            <i class=\"pi pi-chevron-up\"></i>\n          </button>\n          <button\n            type=\"button\"\n            class=\"i-input-spinner-button i-input-spinner-down\"\n            (click)=\"decrementNumber(inputElement)\"\n            [attr.aria-label]=\"'Decrement ' + label\"\n            tabindex=\"-1\"\n          >\n            <i class=\"pi pi-chevron-down\"></i>\n          </button>\n        </div>\n      }\n    </div>\n    @if (useFloatLabel) {\n      <label\n        [for]=\"id || componentId\"\n        class=\"i-label\"\n        [class.floated]=\"forceFloated || hasValue\"\n        >{{ label }}</label\n      >\n    }\n    <ng-content></ng-content>\n  </div>\n</div>\n", styles: [".i-input{color:var(--color-text-primary);border:1px solid var(--surface-border);background:var(--color-component-background-secondary)}.i-input.component-border{background:var(--color-component-background)}.i-input:focus{outline:none;border-color:var(--color-primary);box-shadow:0 2px 10px #0003}.i-label{color:var(--color-text-secondary)}.i-input[disabled]{background:var(--color-disabled-background);border-color:var(--color-disabled-border);color:var(--color-text-disabled);cursor:not-allowed}.invalid .i-input{border-color:var(--color-danger)}.invalid .i-label,.invalid .i-error{color:var(--color-danger)}.i-input-spinner-button{color:var(--color-text-secondary);background:transparent}.i-input-spinner-button:hover{background:var(--surface-hover);color:var(--color-text-primary)}.i-input-spinner-button:active{background:var(--surface-hover);color:var(--color-primary)}.i-input-wrapper{display:flex;flex-direction:column;gap:8px;width:100%;margin-top:1.5em;font-size:1em}.i-input-wrapper.i-input--fluid{width:100%}.i-input-wrapper.i-input--no-float{margin-top:0;height:auto}.i-input-wrapper .i-input-container{display:flex;align-items:center;gap:8px}.i-input-wrapper .i-input{box-sizing:border-box;width:100%;border-radius:4px;min-height:42px;transition:border-color .15s ease,box-shadow .15s ease}.i-input-wrapper .i-input:focus{outline:none}.i-input-wrapper .i-input.has-icon{padding-left:34px}.i-input-wrapper .i-input.hide-text{color:transparent;text-shadow:none;cursor:pointer}.i-input-wrapper .i-input.readonly{cursor:pointer;-webkit-user-select:none;user-select:none;caret-color:transparent}.i-input-wrapper .i-input-icon-wrapper{position:relative;width:100%;display:flex}.i-input-wrapper .i-input-icon{position:absolute;top:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0;width:16px;height:16px;color:inherit;pointer-events:none;transform:translateY(-50%)}.i-input-wrapper .float-label{position:relative;display:flex;align-items:stretch}.i-input-wrapper .float-label .i-input-icon{left:10px}.i-input-wrapper .float-label .i-input{padding:14px 10px}.i-input-wrapper .float-label .i-input.has-icon{padding-left:34px}.i-input-wrapper .float-label .i-label{position:absolute;top:14px;left:12px;padding:0;max-width:calc(100% - 24px);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;line-height:1.2;background:transparent;transition:top .15s ease,left .15s ease,transform .15s ease,font-size .15s ease;pointer-events:none}.i-input-wrapper .float-label .i-input-icon-wrapper:has(.i-input:focus)+.i-label,.i-input-wrapper .float-label .i-input-icon-wrapper:has(.i-input:not(:placeholder-shown))+.i-label,.i-input-wrapper .float-label .i-label.floated{top:-4px;left:12px;transform:translateY(-100%);font-size:.85em}.i-input-wrapper .float-label.has-icon .i-input-icon-wrapper:not(:has(.i-input:focus)):not(:has(.i-input:not(:placeholder-shown)))+.i-label:not(.floated){left:34px}.i-input-wrapper .normal-input{position:relative}.i-input-wrapper .normal-input .i-input-icon{left:12px}.i-input-wrapper .normal-input .i-input{padding:8px 12px}.i-input-wrapper .normal-input .i-input.has-icon{padding-left:38px}.i-input-wrapper .i-input[type=number]{padding-right:32px}.i-input-wrapper .i-input[type=number]::-webkit-outer-spin-button,.i-input-wrapper .i-input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.i-input-wrapper .i-input[type=number]{appearance:textfield;-moz-appearance:textfield}.i-input-wrapper .i-input-spinners{position:absolute;right:4px;top:50%;transform:translateY(-50%);display:flex;flex-direction:column;gap:2px}.i-input-wrapper .i-input-spinner-button{display:flex;align-items:center;justify-content:center;width:24px;height:16px;border:none;border-radius:3px;cursor:pointer;transition:background-color .15s ease,color .15s ease;padding:0;font-size:10px}.i-input-wrapper .i-input-spinner-button i{font-size:10px;line-height:1}.i-input-wrapper .i-input-spinner-button:focus{outline:none}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: TooltipDirective, selector: "[iTooltip]", inputs: ["iTooltip", "tooltipPosition", "tooltipDelay"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: IInputText, decorators: [{
             type: Component,
-            args: [{ selector: 'i-input-text', standalone: true, imports: [CommonModule, TooltipDirective], template: "<div\n  class=\"i-input-wrapper\"\n  [class.invalid]=\"showErrors\"\n  [class.i-input--fluid]=\"fluid\"\n  [class.i-input--no-float]=\"!useFloatLabel\"\n  [attr.id]=\"componentId\"\n>\n  <div\n    [ngClass]=\"useFloatLabel ? 'float-label' : 'normal-input'\"\n    class=\"i-input-container\"\n    [class.has-icon]=\"icon\"\n  >\n    <div class=\"i-input-icon-wrapper\">\n      @if (icon) {\n        <span class=\"i-input-icon\" [attr.aria-hidden]=\"true\">\n          <i [class]=\"icon\" [attr.aria-hidden]=\"true\"></i>\n        </span>\n      }\n      <input\n        #inputElement\n        [id]=\"id || componentId\"\n        [type]=\"type\"\n        [attr.aria-label]=\"!useFloatLabel ? label : null\"\n        [disabled]=\"disabled\"\n        [readonly]=\"readonly\"\n        [value]=\"hideText ? '' : value || ''\"\n        (input)=\"handleInput($event)\"\n        (blur)=\"touch()\"\n        [placeholder]=\"useFloatLabel ? ' ' : placeholder || label\"\n        class=\"i-input\"\n        [class.has-icon]=\"icon\"\n        [class.hide-text]=\"hideText\"\n        [class.readonly]=\"readonly\"\n        [class.component-border]=\"backgroundStyle === 'component'\"\n        [iTooltip]=\"showErrors ? getErrorMessage() || '' : ''\"\n        tooltipPosition=\"below\"\n        [tooltipDelay]=\"100\"\n      />\n      @if (type === \"number\" && !disabled && !readonly) {\n        <div class=\"i-input-spinners\">\n          <button\n            type=\"button\"\n            class=\"i-input-spinner-button i-input-spinner-up\"\n            (click)=\"incrementNumber(inputElement)\"\n            [attr.aria-label]=\"'Increment ' + label\"\n            tabindex=\"-1\"\n          >\n            <i class=\"pi pi-chevron-up\"></i>\n          </button>\n          <button\n            type=\"button\"\n            class=\"i-input-spinner-button i-input-spinner-down\"\n            (click)=\"decrementNumber(inputElement)\"\n            [attr.aria-label]=\"'Decrement ' + label\"\n            tabindex=\"-1\"\n          >\n            <i class=\"pi pi-chevron-down\"></i>\n          </button>\n        </div>\n      }\n    </div>\n    @if (useFloatLabel) {\n      <label\n        [for]=\"id || componentId\"\n        class=\"i-label\"\n        [class.floated]=\"forceFloated || hasValue\"\n        >{{ label }}</label\n      >\n    }\n    <ng-content></ng-content>\n  </div>\n</div>\n", styles: [".i-input{color:var(--color-text-primary);border:1px solid var(--surface-border);background:var(--color-component-background-secondary)}.i-input.component-border{background:var(--color-component-background)}.i-input:focus{outline:none;border-color:var(--color-primary);box-shadow:0 2px 10px #0003}.i-label{color:var(--color-text-secondary)}.i-input:focus+.i-label,.i-input:not(:placeholder-shown)+.i-label,.i-label.floated{background:var(--color-component-background-secondary)}.i-input[disabled]{background:var(--color-disabled-background);border-color:var(--color-disabled-border);color:var(--color-text-disabled);cursor:not-allowed}.invalid .i-input{border-color:var(--color-danger)}.invalid .i-label,.invalid .i-error{color:var(--color-danger)}.i-input-spinner-button{color:var(--color-text-secondary);background:transparent}.i-input-spinner-button:hover{background:var(--surface-hover);color:var(--color-text-primary)}.i-input-spinner-button:active{background:var(--surface-hover);color:var(--color-primary)}.i-input-wrapper{display:flex;flex-direction:column;gap:8px;width:100%;margin-top:4px;font-size:1em}.i-input-wrapper.i-input--fluid{width:100%}.i-input-wrapper.i-input--no-float{margin-top:0;height:auto}.i-input-wrapper .i-input-container{display:flex;align-items:center;gap:8px}.i-input-wrapper .i-input{box-sizing:border-box;width:100%;border-radius:4px;min-height:42px;transition:border-color .15s ease,box-shadow .15s ease}.i-input-wrapper .i-input:focus{outline:none}.i-input-wrapper .i-input.has-icon{padding-left:34px}.i-input-wrapper .i-input.hide-text{color:transparent;text-shadow:none;cursor:pointer}.i-input-wrapper .i-input.readonly{cursor:pointer;-webkit-user-select:none;user-select:none;caret-color:transparent}.i-input-wrapper .i-input-icon-wrapper{position:relative;width:100%;display:flex}.i-input-wrapper .i-input-icon{position:absolute;top:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0;width:16px;height:16px;color:inherit;pointer-events:none;transform:translateY(-50%)}.i-input-wrapper .float-label{position:relative;display:flex;align-items:stretch}.i-input-wrapper .float-label .i-input-icon{left:10px}.i-input-wrapper .float-label .i-input{padding:14px 10px}.i-input-wrapper .float-label .i-input.has-icon{padding-left:34px}.i-input-wrapper .float-label .i-label{position:absolute;top:14px;left:8px;padding:0 4px;pointer-events:none;transition:all .15s ease}.i-input-wrapper .float-label .i-input:focus+.i-label,.i-input-wrapper .float-label .i-input:not(:placeholder-shown)+.i-label,.i-input-wrapper .float-label .i-label.floated{top:-8px}.i-input-wrapper .float-label.has-icon .i-label:not(.floated){left:34px}.i-input-wrapper .normal-input{position:relative}.i-input-wrapper .normal-input .i-input-icon{left:12px}.i-input-wrapper .normal-input .i-input{padding:8px 12px}.i-input-wrapper .normal-input .i-input.has-icon{padding-left:38px}.i-input-wrapper .i-input[type=number]{padding-right:32px}.i-input-wrapper .i-input[type=number]::-webkit-outer-spin-button,.i-input-wrapper .i-input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.i-input-wrapper .i-input[type=number]{appearance:textfield;-moz-appearance:textfield}.i-input-wrapper .i-input-spinners{position:absolute;right:4px;top:50%;transform:translateY(-50%);display:flex;flex-direction:column;gap:2px}.i-input-wrapper .i-input-spinner-button{display:flex;align-items:center;justify-content:center;width:24px;height:16px;border:none;border-radius:3px;cursor:pointer;transition:background-color .15s ease,color .15s ease;padding:0;font-size:10px}.i-input-wrapper .i-input-spinner-button i{font-size:10px;line-height:1}.i-input-wrapper .i-input-spinner-button:focus{outline:none}\n"] }]
+            args: [{ selector: 'i-input-text', standalone: true, imports: [CommonModule, TooltipDirective], template: "<div\n  class=\"i-input-wrapper\"\n  [class.invalid]=\"showErrors\"\n  [class.i-input--fluid]=\"fluid\"\n  [class.i-input--no-float]=\"!useFloatLabel\"\n  [attr.id]=\"componentId\"\n>\n  <div\n    [ngClass]=\"useFloatLabel ? 'float-label' : 'normal-input'\"\n    class=\"i-input-container\"\n    [class.has-icon]=\"icon\"\n  >\n    <div class=\"i-input-icon-wrapper\">\n      @if (icon) {\n        <span class=\"i-input-icon\" [attr.aria-hidden]=\"true\">\n          <i [class]=\"icon\" [attr.aria-hidden]=\"true\"></i>\n        </span>\n      }\n      <input\n        #inputElement\n        [id]=\"id || componentId\"\n        [type]=\"type\"\n        [attr.aria-label]=\"!useFloatLabel ? label : null\"\n        [disabled]=\"disabled\"\n        [readonly]=\"readonly\"\n        [value]=\"hideText ? '' : value || ''\"\n        (input)=\"handleInput($event)\"\n        (blur)=\"touch()\"\n        [placeholder]=\"useFloatLabel ? ' ' : placeholder || label\"\n        class=\"i-input\"\n        [class.has-icon]=\"icon\"\n        [class.hide-text]=\"hideText\"\n        [class.readonly]=\"readonly\"\n        [class.component-border]=\"backgroundStyle === 'component'\"\n        [iTooltip]=\"showErrors ? getErrorMessage() || '' : ''\"\n        tooltipPosition=\"below\"\n        [tooltipDelay]=\"100\"\n      />\n      @if (type === \"number\" && !disabled && !readonly) {\n        <div class=\"i-input-spinners\">\n          <button\n            type=\"button\"\n            class=\"i-input-spinner-button i-input-spinner-up\"\n            (click)=\"incrementNumber(inputElement)\"\n            [attr.aria-label]=\"'Increment ' + label\"\n            tabindex=\"-1\"\n          >\n            <i class=\"pi pi-chevron-up\"></i>\n          </button>\n          <button\n            type=\"button\"\n            class=\"i-input-spinner-button i-input-spinner-down\"\n            (click)=\"decrementNumber(inputElement)\"\n            [attr.aria-label]=\"'Decrement ' + label\"\n            tabindex=\"-1\"\n          >\n            <i class=\"pi pi-chevron-down\"></i>\n          </button>\n        </div>\n      }\n    </div>\n    @if (useFloatLabel) {\n      <label\n        [for]=\"id || componentId\"\n        class=\"i-label\"\n        [class.floated]=\"forceFloated || hasValue\"\n        >{{ label }}</label\n      >\n    }\n    <ng-content></ng-content>\n  </div>\n</div>\n", styles: [".i-input{color:var(--color-text-primary);border:1px solid var(--surface-border);background:var(--color-component-background-secondary)}.i-input.component-border{background:var(--color-component-background)}.i-input:focus{outline:none;border-color:var(--color-primary);box-shadow:0 2px 10px #0003}.i-label{color:var(--color-text-secondary)}.i-input[disabled]{background:var(--color-disabled-background);border-color:var(--color-disabled-border);color:var(--color-text-disabled);cursor:not-allowed}.invalid .i-input{border-color:var(--color-danger)}.invalid .i-label,.invalid .i-error{color:var(--color-danger)}.i-input-spinner-button{color:var(--color-text-secondary);background:transparent}.i-input-spinner-button:hover{background:var(--surface-hover);color:var(--color-text-primary)}.i-input-spinner-button:active{background:var(--surface-hover);color:var(--color-primary)}.i-input-wrapper{display:flex;flex-direction:column;gap:8px;width:100%;margin-top:1.5em;font-size:1em}.i-input-wrapper.i-input--fluid{width:100%}.i-input-wrapper.i-input--no-float{margin-top:0;height:auto}.i-input-wrapper .i-input-container{display:flex;align-items:center;gap:8px}.i-input-wrapper .i-input{box-sizing:border-box;width:100%;border-radius:4px;min-height:42px;transition:border-color .15s ease,box-shadow .15s ease}.i-input-wrapper .i-input:focus{outline:none}.i-input-wrapper .i-input.has-icon{padding-left:34px}.i-input-wrapper .i-input.hide-text{color:transparent;text-shadow:none;cursor:pointer}.i-input-wrapper .i-input.readonly{cursor:pointer;-webkit-user-select:none;user-select:none;caret-color:transparent}.i-input-wrapper .i-input-icon-wrapper{position:relative;width:100%;display:flex}.i-input-wrapper .i-input-icon{position:absolute;top:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0;width:16px;height:16px;color:inherit;pointer-events:none;transform:translateY(-50%)}.i-input-wrapper .float-label{position:relative;display:flex;align-items:stretch}.i-input-wrapper .float-label .i-input-icon{left:10px}.i-input-wrapper .float-label .i-input{padding:14px 10px}.i-input-wrapper .float-label .i-input.has-icon{padding-left:34px}.i-input-wrapper .float-label .i-label{position:absolute;top:14px;left:12px;padding:0;max-width:calc(100% - 24px);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;line-height:1.2;background:transparent;transition:top .15s ease,left .15s ease,transform .15s ease,font-size .15s ease;pointer-events:none}.i-input-wrapper .float-label .i-input-icon-wrapper:has(.i-input:focus)+.i-label,.i-input-wrapper .float-label .i-input-icon-wrapper:has(.i-input:not(:placeholder-shown))+.i-label,.i-input-wrapper .float-label .i-label.floated{top:-4px;left:12px;transform:translateY(-100%);font-size:.85em}.i-input-wrapper .float-label.has-icon .i-input-icon-wrapper:not(:has(.i-input:focus)):not(:has(.i-input:not(:placeholder-shown)))+.i-label:not(.floated){left:34px}.i-input-wrapper .normal-input{position:relative}.i-input-wrapper .normal-input .i-input-icon{left:12px}.i-input-wrapper .normal-input .i-input{padding:8px 12px}.i-input-wrapper .normal-input .i-input.has-icon{padding-left:38px}.i-input-wrapper .i-input[type=number]{padding-right:32px}.i-input-wrapper .i-input[type=number]::-webkit-outer-spin-button,.i-input-wrapper .i-input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.i-input-wrapper .i-input[type=number]{appearance:textfield;-moz-appearance:textfield}.i-input-wrapper .i-input-spinners{position:absolute;right:4px;top:50%;transform:translateY(-50%);display:flex;flex-direction:column;gap:2px}.i-input-wrapper .i-input-spinner-button{display:flex;align-items:center;justify-content:center;width:24px;height:16px;border:none;border-radius:3px;cursor:pointer;transition:background-color .15s ease,color .15s ease;padding:0;font-size:10px}.i-input-wrapper .i-input-spinner-button i{font-size:10px;line-height:1}.i-input-wrapper .i-input-spinner-button:focus{outline:none}\n"] }]
         }], ctorParameters: () => [{ type: i1.NgControl, decorators: [{
                     type: Optional
                 }, {
@@ -2143,11 +2143,11 @@ class IChipsComponent {
         this.closedAll.emit();
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: IChipsComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.12", type: IChipsComponent, isStandalone: true, selector: "i-chips", inputs: { chips: "chips", removable: "removable", disabled: "disabled", collapseOnOverflow: "collapseOnOverflow", overflowLabel: "overflowLabel", boxed: "boxed", allowCloseAll: "allowCloseAll", label: "label", useFloatLabel: "useFloatLabel", showError: "showError" }, outputs: { closedAll: "closedAll", removeChip: "removeChip" }, viewQueries: [{ propertyName: "chipsViewportRef", first: true, predicate: ["chipsViewport"], descendants: true }, { propertyName: "chipsListRef", first: true, predicate: ["chipsList"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div\n  class=\"i-chips-wrapper\"\n  [class.i-chips-wrapper--float]=\"useFloatLabel\"\n  [class.i-chips-wrapper--error]=\"showError\"\n  [attr.id]=\"componentId\"\n>\n  <div\n    class=\"i-chips-container\"\n    #chipsViewport\n    [class.i-chips-container--collapse]=\"collapseOnOverflow\"\n    [class.i-chips-container--overflow]=\"collapseOnOverflow && chipsOverflow\"\n    [class.i-chips-box]=\"boxed\"\n    [class.i-chips--disabled]=\"disabled\"\n    [class.i-chips--empty]=\"!chips || chips.length === 0\"\n    [attr.tabindex]=\"boxed && !disabled ? 0 : null\"\n  >\n    <div class=\"i-chips-list\" #chipsList>\n      @for (chip of chips; track trackByValue($index, chip)) {\n        <i-chip\n          [label]=\"chip.label\"\n          [icon]=\"chip.icon\"\n          [removable]=\"chip.removable ?? removable\"\n          [disabled]=\"disabled || !!chip.disabled\"\n          (onRemove)=\"onChipRemove(chip, $event)\"\n        ></i-chip>\n      }\n    </div>\n\n    @if (allowCloseAll && chips && chips.length > 0) {\n      <div class=\"i-chips-actions\">\n        <i-button\n          [text]=\"true\"\n          [size]=\"'xtra-small'\"\n          [severity]=\"'contrast'\"\n          [icon]=\"'pi pi-times'\"\n          (clicked)=\"onCloseAllClicked($event)\"\n        ></i-button>\n      </div>\n    }\n    @if (collapseOnOverflow && chipsOverflow) {\n      <div class=\"i-chips-summary\">\n        {{ overflowText }}\n      </div>\n    }\n  </div>\n\n  @if (useFloatLabel && label) {\n    <label\n      class=\"i-chips-label\"\n      [class.i-chips-label--floated]=\"chips && chips.length > 0\"\n      [class.i-chips-label--error]=\"showError\"\n    >\n      {{ label }}\n    </label>\n  }\n</div>\n", styles: [".i-chips-container{color:var(--color-text-primary)}.i-chips-summary{color:var(--color-text-secondary)}.i-chips-label{color:var(--color-text-secondary);background:transparent}.i-chips-label--floated{background:var(--color-component-background-secondary)}.i-chips-container:focus-within+.i-chips-label{background:var(--color-component-background-secondary)}.i-chips-label--error{color:var(--color-danger)}.i-chips-box{border:1px solid var(--surface-border);background:var(--color-component-background)}.i-chips-box:focus{outline:none;border-color:var(--color-primary);box-shadow:0 2px 10px #0003}.i-chips-box:focus-within{border-color:var(--color-primary);box-shadow:0 2px 10px #0003}.i-chips-box.i-chips--disabled{background:var(--color-disabled-background);border-color:var(--color-disabled-border);color:var(--color-text-disabled)}.i-chips-wrapper--error .i-chips-box{border-color:var(--color-danger)}:host{display:block;width:100%}.i-chips-wrapper{position:relative;width:100%}.i-chips-wrapper--float{margin-top:20px}.i-chips-wrapper--float .i-chips-label{position:absolute;top:14px;left:12px;padding:0 4px;pointer-events:none;transition:all .15s ease}.i-chips-wrapper--float .i-chips-label--floated{top:-8px;font-size:.85em}.i-chips-wrapper--float .i-chips-container:focus-within+.i-chips-label{top:-8px;font-size:.85em}.i-chips-container{position:relative;display:flex;flex-wrap:wrap;align-content:flex-start;gap:8px;width:100%;min-height:32px}.i-chips-container--collapse{flex-wrap:nowrap;overflow:hidden}.i-chips-container--collapse .i-chips-list{white-space:nowrap;max-width:100%;min-width:0}.i-chips-container--overflow .i-chips-list{visibility:hidden}.i-chips-container .i-chips-list{display:flex;flex-wrap:inherit;gap:inherit;width:100%;padding-right:40px}.i-chips-container .i-chips-summary{position:absolute;inset:0 40px 0 0;display:flex;align-items:center;padding:0 16px;background:inherit}.i-chips-container .i-chips-actions{position:absolute;right:20px;top:50%;transform:translateY(-50%);display:flex;align-items:center;justify-content:center}.i-chips-box{box-sizing:border-box;border-radius:4px;padding:9px 12px;min-height:42px;align-items:center;transition:border-color .15s ease,box-shadow .15s ease;cursor:pointer}.i-chips-box:focus{outline:none}.i-chips-box.i-chips-container--collapse{padding-right:40px}\n"], dependencies: [{ kind: "component", type: IChip, selector: "i-chip", inputs: ["label", "icon", "image", "removable", "removeIcon", "styleClass", "disabled"], outputs: ["onRemove"] }, { kind: "component", type: IButton, selector: "i-button", inputs: ["severity", "size", "type", "ariaLabel", "ariaExpanded", "disabled", "outlined", "raised", "text", "icon", "fluid", "loading"], outputs: ["clicked"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.12", type: IChipsComponent, isStandalone: true, selector: "i-chips", inputs: { chips: "chips", removable: "removable", disabled: "disabled", collapseOnOverflow: "collapseOnOverflow", overflowLabel: "overflowLabel", boxed: "boxed", allowCloseAll: "allowCloseAll", label: "label", useFloatLabel: "useFloatLabel", showError: "showError" }, outputs: { closedAll: "closedAll", removeChip: "removeChip" }, viewQueries: [{ propertyName: "chipsViewportRef", first: true, predicate: ["chipsViewport"], descendants: true }, { propertyName: "chipsListRef", first: true, predicate: ["chipsList"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div\n  class=\"i-chips-wrapper\"\n  [class.i-chips-wrapper--float]=\"useFloatLabel\"\n  [class.i-chips-wrapper--error]=\"showError\"\n  [attr.id]=\"componentId\"\n>\n  <div\n    class=\"i-chips-container\"\n    #chipsViewport\n    [class.i-chips-container--collapse]=\"collapseOnOverflow\"\n    [class.i-chips-container--overflow]=\"collapseOnOverflow && chipsOverflow\"\n    [class.i-chips-box]=\"boxed\"\n    [class.i-chips--disabled]=\"disabled\"\n    [class.i-chips--empty]=\"!chips || chips.length === 0\"\n    [attr.tabindex]=\"boxed && !disabled ? 0 : null\"\n  >\n    <div class=\"i-chips-list\" #chipsList>\n      @for (chip of chips; track trackByValue($index, chip)) {\n        <i-chip\n          [label]=\"chip.label\"\n          [icon]=\"chip.icon\"\n          [removable]=\"chip.removable ?? removable\"\n          [disabled]=\"disabled || !!chip.disabled\"\n          (onRemove)=\"onChipRemove(chip, $event)\"\n        ></i-chip>\n      }\n    </div>\n\n    @if (allowCloseAll && chips && chips.length > 0) {\n      <div class=\"i-chips-actions\">\n        <i-button\n          [text]=\"true\"\n          [size]=\"'xtra-small'\"\n          [severity]=\"'contrast'\"\n          [icon]=\"'pi pi-times'\"\n          (clicked)=\"onCloseAllClicked($event)\"\n        ></i-button>\n      </div>\n    }\n    @if (collapseOnOverflow && chipsOverflow) {\n      <div class=\"i-chips-summary\">\n        {{ overflowText }}\n      </div>\n    }\n  </div>\n\n  @if (useFloatLabel && label) {\n    <label\n      class=\"i-chips-label\"\n      [class.i-chips-label--floated]=\"chips && chips.length > 0\"\n      [class.i-chips-label--error]=\"showError\"\n    >\n      {{ label }}\n    </label>\n  }\n</div>\n", styles: [".i-chips-container{color:var(--color-text-primary)}.i-chips-summary{color:var(--color-text-secondary)}.i-chips-label{color:var(--color-text-secondary);background:transparent}.i-chips-label--error{color:var(--color-danger)}.i-chips-box{border:1px solid var(--surface-border);background:var(--color-component-background)}.i-chips-box:focus{outline:none;border-color:var(--color-primary);box-shadow:0 2px 10px #0003}.i-chips-box:focus-within{border-color:var(--color-primary);box-shadow:0 2px 10px #0003}.i-chips-box.i-chips--disabled{background:var(--color-disabled-background);border-color:var(--color-disabled-border);color:var(--color-text-disabled)}.i-chips-wrapper--error .i-chips-box{border-color:var(--color-danger)}:host{display:block;width:100%}.i-chips-wrapper{position:relative;width:100%}.i-chips-wrapper--float{margin-top:1.5em}.i-chips-wrapper--float .i-chips-label{position:absolute;top:14px;left:12px;padding:0;max-width:calc(100% - 24px);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;line-height:1.2;background:transparent;transition:top .15s ease,left .15s ease,transform .15s ease,font-size .15s ease;pointer-events:none}.i-chips-wrapper--float .i-chips-label--floated{top:-4px;left:12px;transform:translateY(-100%);font-size:.85em}.i-chips-wrapper--float .i-chips-container:focus-within+.i-chips-label{top:-4px;left:12px;transform:translateY(-100%);font-size:.85em}.i-chips-container{position:relative;display:flex;flex-wrap:wrap;align-content:flex-start;gap:8px;width:100%;min-height:32px}.i-chips-container--collapse{flex-wrap:nowrap;overflow:hidden}.i-chips-container--collapse .i-chips-list{white-space:nowrap;max-width:100%;min-width:0}.i-chips-container--overflow .i-chips-list{visibility:hidden}.i-chips-container .i-chips-list{display:flex;flex-wrap:inherit;gap:inherit;width:100%;padding-right:40px}.i-chips-container .i-chips-summary{position:absolute;inset:0 40px 0 0;display:flex;align-items:center;padding:0 16px;background:inherit}.i-chips-container .i-chips-actions{position:absolute;right:20px;top:50%;transform:translateY(-50%);display:flex;align-items:center;justify-content:center}.i-chips-box{box-sizing:border-box;border-radius:4px;padding:9px 12px;min-height:42px;align-items:center;transition:border-color .15s ease,box-shadow .15s ease;cursor:pointer}.i-chips-box:focus{outline:none}.i-chips-box.i-chips-container--collapse{padding-right:40px}\n"], dependencies: [{ kind: "component", type: IChip, selector: "i-chip", inputs: ["label", "icon", "image", "removable", "removeIcon", "styleClass", "disabled"], outputs: ["onRemove"] }, { kind: "component", type: IButton, selector: "i-button", inputs: ["severity", "size", "type", "ariaLabel", "ariaExpanded", "disabled", "outlined", "raised", "text", "icon", "fluid", "loading"], outputs: ["clicked"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: IChipsComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'i-chips', standalone: true, imports: [IChip, IButton], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n  class=\"i-chips-wrapper\"\n  [class.i-chips-wrapper--float]=\"useFloatLabel\"\n  [class.i-chips-wrapper--error]=\"showError\"\n  [attr.id]=\"componentId\"\n>\n  <div\n    class=\"i-chips-container\"\n    #chipsViewport\n    [class.i-chips-container--collapse]=\"collapseOnOverflow\"\n    [class.i-chips-container--overflow]=\"collapseOnOverflow && chipsOverflow\"\n    [class.i-chips-box]=\"boxed\"\n    [class.i-chips--disabled]=\"disabled\"\n    [class.i-chips--empty]=\"!chips || chips.length === 0\"\n    [attr.tabindex]=\"boxed && !disabled ? 0 : null\"\n  >\n    <div class=\"i-chips-list\" #chipsList>\n      @for (chip of chips; track trackByValue($index, chip)) {\n        <i-chip\n          [label]=\"chip.label\"\n          [icon]=\"chip.icon\"\n          [removable]=\"chip.removable ?? removable\"\n          [disabled]=\"disabled || !!chip.disabled\"\n          (onRemove)=\"onChipRemove(chip, $event)\"\n        ></i-chip>\n      }\n    </div>\n\n    @if (allowCloseAll && chips && chips.length > 0) {\n      <div class=\"i-chips-actions\">\n        <i-button\n          [text]=\"true\"\n          [size]=\"'xtra-small'\"\n          [severity]=\"'contrast'\"\n          [icon]=\"'pi pi-times'\"\n          (clicked)=\"onCloseAllClicked($event)\"\n        ></i-button>\n      </div>\n    }\n    @if (collapseOnOverflow && chipsOverflow) {\n      <div class=\"i-chips-summary\">\n        {{ overflowText }}\n      </div>\n    }\n  </div>\n\n  @if (useFloatLabel && label) {\n    <label\n      class=\"i-chips-label\"\n      [class.i-chips-label--floated]=\"chips && chips.length > 0\"\n      [class.i-chips-label--error]=\"showError\"\n    >\n      {{ label }}\n    </label>\n  }\n</div>\n", styles: [".i-chips-container{color:var(--color-text-primary)}.i-chips-summary{color:var(--color-text-secondary)}.i-chips-label{color:var(--color-text-secondary);background:transparent}.i-chips-label--floated{background:var(--color-component-background-secondary)}.i-chips-container:focus-within+.i-chips-label{background:var(--color-component-background-secondary)}.i-chips-label--error{color:var(--color-danger)}.i-chips-box{border:1px solid var(--surface-border);background:var(--color-component-background)}.i-chips-box:focus{outline:none;border-color:var(--color-primary);box-shadow:0 2px 10px #0003}.i-chips-box:focus-within{border-color:var(--color-primary);box-shadow:0 2px 10px #0003}.i-chips-box.i-chips--disabled{background:var(--color-disabled-background);border-color:var(--color-disabled-border);color:var(--color-text-disabled)}.i-chips-wrapper--error .i-chips-box{border-color:var(--color-danger)}:host{display:block;width:100%}.i-chips-wrapper{position:relative;width:100%}.i-chips-wrapper--float{margin-top:20px}.i-chips-wrapper--float .i-chips-label{position:absolute;top:14px;left:12px;padding:0 4px;pointer-events:none;transition:all .15s ease}.i-chips-wrapper--float .i-chips-label--floated{top:-8px;font-size:.85em}.i-chips-wrapper--float .i-chips-container:focus-within+.i-chips-label{top:-8px;font-size:.85em}.i-chips-container{position:relative;display:flex;flex-wrap:wrap;align-content:flex-start;gap:8px;width:100%;min-height:32px}.i-chips-container--collapse{flex-wrap:nowrap;overflow:hidden}.i-chips-container--collapse .i-chips-list{white-space:nowrap;max-width:100%;min-width:0}.i-chips-container--overflow .i-chips-list{visibility:hidden}.i-chips-container .i-chips-list{display:flex;flex-wrap:inherit;gap:inherit;width:100%;padding-right:40px}.i-chips-container .i-chips-summary{position:absolute;inset:0 40px 0 0;display:flex;align-items:center;padding:0 16px;background:inherit}.i-chips-container .i-chips-actions{position:absolute;right:20px;top:50%;transform:translateY(-50%);display:flex;align-items:center;justify-content:center}.i-chips-box{box-sizing:border-box;border-radius:4px;padding:9px 12px;min-height:42px;align-items:center;transition:border-color .15s ease,box-shadow .15s ease;cursor:pointer}.i-chips-box:focus{outline:none}.i-chips-box.i-chips-container--collapse{padding-right:40px}\n"] }]
+            args: [{ selector: 'i-chips', standalone: true, imports: [IChip, IButton], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n  class=\"i-chips-wrapper\"\n  [class.i-chips-wrapper--float]=\"useFloatLabel\"\n  [class.i-chips-wrapper--error]=\"showError\"\n  [attr.id]=\"componentId\"\n>\n  <div\n    class=\"i-chips-container\"\n    #chipsViewport\n    [class.i-chips-container--collapse]=\"collapseOnOverflow\"\n    [class.i-chips-container--overflow]=\"collapseOnOverflow && chipsOverflow\"\n    [class.i-chips-box]=\"boxed\"\n    [class.i-chips--disabled]=\"disabled\"\n    [class.i-chips--empty]=\"!chips || chips.length === 0\"\n    [attr.tabindex]=\"boxed && !disabled ? 0 : null\"\n  >\n    <div class=\"i-chips-list\" #chipsList>\n      @for (chip of chips; track trackByValue($index, chip)) {\n        <i-chip\n          [label]=\"chip.label\"\n          [icon]=\"chip.icon\"\n          [removable]=\"chip.removable ?? removable\"\n          [disabled]=\"disabled || !!chip.disabled\"\n          (onRemove)=\"onChipRemove(chip, $event)\"\n        ></i-chip>\n      }\n    </div>\n\n    @if (allowCloseAll && chips && chips.length > 0) {\n      <div class=\"i-chips-actions\">\n        <i-button\n          [text]=\"true\"\n          [size]=\"'xtra-small'\"\n          [severity]=\"'contrast'\"\n          [icon]=\"'pi pi-times'\"\n          (clicked)=\"onCloseAllClicked($event)\"\n        ></i-button>\n      </div>\n    }\n    @if (collapseOnOverflow && chipsOverflow) {\n      <div class=\"i-chips-summary\">\n        {{ overflowText }}\n      </div>\n    }\n  </div>\n\n  @if (useFloatLabel && label) {\n    <label\n      class=\"i-chips-label\"\n      [class.i-chips-label--floated]=\"chips && chips.length > 0\"\n      [class.i-chips-label--error]=\"showError\"\n    >\n      {{ label }}\n    </label>\n  }\n</div>\n", styles: [".i-chips-container{color:var(--color-text-primary)}.i-chips-summary{color:var(--color-text-secondary)}.i-chips-label{color:var(--color-text-secondary);background:transparent}.i-chips-label--error{color:var(--color-danger)}.i-chips-box{border:1px solid var(--surface-border);background:var(--color-component-background)}.i-chips-box:focus{outline:none;border-color:var(--color-primary);box-shadow:0 2px 10px #0003}.i-chips-box:focus-within{border-color:var(--color-primary);box-shadow:0 2px 10px #0003}.i-chips-box.i-chips--disabled{background:var(--color-disabled-background);border-color:var(--color-disabled-border);color:var(--color-text-disabled)}.i-chips-wrapper--error .i-chips-box{border-color:var(--color-danger)}:host{display:block;width:100%}.i-chips-wrapper{position:relative;width:100%}.i-chips-wrapper--float{margin-top:1.5em}.i-chips-wrapper--float .i-chips-label{position:absolute;top:14px;left:12px;padding:0;max-width:calc(100% - 24px);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;line-height:1.2;background:transparent;transition:top .15s ease,left .15s ease,transform .15s ease,font-size .15s ease;pointer-events:none}.i-chips-wrapper--float .i-chips-label--floated{top:-4px;left:12px;transform:translateY(-100%);font-size:.85em}.i-chips-wrapper--float .i-chips-container:focus-within+.i-chips-label{top:-4px;left:12px;transform:translateY(-100%);font-size:.85em}.i-chips-container{position:relative;display:flex;flex-wrap:wrap;align-content:flex-start;gap:8px;width:100%;min-height:32px}.i-chips-container--collapse{flex-wrap:nowrap;overflow:hidden}.i-chips-container--collapse .i-chips-list{white-space:nowrap;max-width:100%;min-width:0}.i-chips-container--overflow .i-chips-list{visibility:hidden}.i-chips-container .i-chips-list{display:flex;flex-wrap:inherit;gap:inherit;width:100%;padding-right:40px}.i-chips-container .i-chips-summary{position:absolute;inset:0 40px 0 0;display:flex;align-items:center;padding:0 16px;background:inherit}.i-chips-container .i-chips-actions{position:absolute;right:20px;top:50%;transform:translateY(-50%);display:flex;align-items:center;justify-content:center}.i-chips-box{box-sizing:border-box;border-radius:4px;padding:9px 12px;min-height:42px;align-items:center;transition:border-color .15s ease,box-shadow .15s ease;cursor:pointer}.i-chips-box:focus{outline:none}.i-chips-box.i-chips-container--collapse{padding-right:40px}\n"] }]
         }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i0.NgZone }], propDecorators: { chips: [{
                 type: Input
             }], removable: [{
@@ -2308,6 +2308,8 @@ class ConfirmationDialogComponent {
         this.message.set(this.config.data?.message || '');
         this.header.set(this.config.data?.header || 'Are you sure?');
         this.severity.set(this.config.data?.severity || 'primary');
+        this.acceptLabel = this.config.data?.acceptLabel || 'Confirm';
+        this.rejectLabel = this.config.data?.rejectLabel || 'Cancel';
     }
     /**
      * Handles confirm button click
@@ -2864,6 +2866,8 @@ class ConfirmationDialogService {
                 message: config.message,
                 header: config.header,
                 severity: config.severity || 'primary',
+                acceptLabel: this.acceptLabel,
+                rejectLabel: this.rejectLabel,
             },
         });
         // Subscribe to dialog close event to execute callbacks
@@ -3558,11 +3562,11 @@ class ITextarea {
         return this.currentLength >= this.maxLength;
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: ITextarea, deps: [{ token: i1.NgControl, optional: true, self: true }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.12", type: ITextarea, isStandalone: true, selector: "i-textarea", inputs: { label: "label", id: "id", fluid: "fluid", forceFloated: "forceFloated", useFloatLabel: "useFloatLabel", placeholder: "placeholder", rows: "rows", maxLength: "maxLength", resizable: "resizable", readonly: "readonly", disabled: "disabled", externalInvalid: "externalInvalid", externalErrorMessage: "externalErrorMessage", backgroundStyle: "backgroundStyle", errorMessages: "errorMessages", charCountWarnAt: "charCountWarnAt" }, ngImport: i0, template: "<div\n  class=\"i-textarea-wrapper\"\n  [class.invalid]=\"showErrors\"\n  [class.i-textarea--fluid]=\"fluid\"\n  [class.i-textarea--no-float]=\"!useFloatLabel\"\n  [attr.id]=\"componentId\"\n>\n  <div\n    [ngClass]=\"useFloatLabel ? 'float-label' : 'normal-input'\"\n    class=\"i-textarea-container\"\n  >\n    <div class=\"i-textarea-icon-wrapper\">\n      <textarea\n        #textareaElement\n        [id]=\"id || componentId\"\n        [disabled]=\"disabled\"\n        [readonly]=\"readonly\"\n        [rows]=\"rows\"\n        [attr.maxlength]=\"maxLength || null\"\n        [value]=\"value || ''\"\n        (input)=\"handleInput($event)\"\n        (blur)=\"touch()\"\n        [placeholder]=\"useFloatLabel ? ' ' : placeholder || label\"\n        class=\"i-textarea\"\n        [class.readonly]=\"readonly\"\n        [class.no-resize]=\"!resizable\"\n        [class.component-border]=\"backgroundStyle === 'component'\"\n        [iTooltip]=\"showErrors ? getErrorMessage() || '' : ''\"\n        tooltipPosition=\"below\"\n        [tooltipDelay]=\"100\"\n      ></textarea>\n      @if (useFloatLabel) {\n        <label\n          [for]=\"id || componentId\"\n          class=\"i-textarea-label\"\n          [class.floated]=\"forceFloated || hasValue\"\n          >{{ label }}</label\n        >\n      }\n      <ng-content></ng-content>\n    </div>\n  </div>\n\n  <div class=\"i-textarea-footer\">\n    @if (showErrors && getErrorMessage()) {\n      <span class=\"i-error\">{{ getErrorMessage() }}</span>\n    }\n    @if (maxLength) {\n      <span\n        class=\"i-char-count\"\n        [class.i-char-count--warn]=\"charCountWarning\"\n        [class.i-char-count--over]=\"charCountOver\"\n      >\n        {{ currentLength }}/{{ maxLength }}\n      </span>\n    }\n  </div>\n</div>\n", styles: [".i-textarea{color:var(--color-text-primary);border:1px solid var(--surface-border);background:var(--color-component-background-secondary)}.i-textarea.component-border{background:var(--color-component-background)}.i-textarea:focus{outline:none;border-color:var(--color-primary);box-shadow:0 2px 10px #0003}.i-textarea-label{color:var(--color-text-secondary)}.i-textarea:focus+.i-textarea-label,.i-textarea:not(:placeholder-shown)+.i-textarea-label,.i-textarea-label.floated{background:var(--color-component-background-secondary)}.i-textarea[disabled]{background:var(--color-disabled-background);border-color:var(--color-disabled-border);color:var(--color-text-disabled);cursor:not-allowed}.i-textarea[disabled]+.i-textarea-label{color:var(--color-text-disabled)}.invalid .i-textarea{border-color:var(--color-danger)}.invalid .i-textarea-label,.invalid .i-error{color:var(--color-danger)}.i-char-count{color:var(--color-text-secondary)}.i-char-count.i-char-count--warn{color:var(--color-warning)}.i-char-count.i-char-count--over{color:var(--color-danger)}.i-textarea-wrapper{display:flex;flex-direction:column;gap:8px;width:100%;margin-top:4px;font-size:1em}.i-textarea-wrapper.i-textarea--fluid{width:100%}.i-textarea-wrapper.i-textarea--no-float{margin-top:0;height:auto}.i-textarea-wrapper .i-textarea-container{display:flex;align-items:flex-start;gap:8px}.i-textarea-wrapper .i-textarea{box-sizing:border-box;width:100%;border-radius:4px;transition:border-color .15s ease,box-shadow .15s ease;font-family:inherit;font-size:inherit;line-height:1.5;resize:vertical}.i-textarea-wrapper .i-textarea:focus{outline:none}.i-textarea-wrapper .i-textarea.readonly{cursor:pointer;-webkit-user-select:none;user-select:none;caret-color:transparent;resize:none}.i-textarea-wrapper .i-textarea.no-resize{resize:none}.i-textarea-wrapper .i-textarea-icon-wrapper{position:relative;width:100%;display:flex}.i-textarea-wrapper .float-label{position:relative;display:flex;align-items:flex-start}.i-textarea-wrapper .float-label .i-textarea{padding:20px 10px 8px}.i-textarea-wrapper .float-label .i-textarea-label{position:absolute;top:16px;left:8px;padding:0 4px;pointer-events:none;transition:all .15s ease;font-size:1em}.i-textarea-wrapper .float-label .i-textarea:focus+.i-textarea-label,.i-textarea-wrapper .float-label .i-textarea:not(:placeholder-shown)+.i-textarea-label,.i-textarea-wrapper .float-label .i-textarea-label.floated{top:-8px;font-size:.78em}.i-textarea-wrapper .normal-input{position:relative}.i-textarea-wrapper .normal-input .i-textarea{padding:8px 12px}.i-textarea-wrapper .i-textarea-footer{display:flex;justify-content:flex-end;align-items:center;gap:8px;min-height:16px}.i-textarea-wrapper .i-char-count{font-size:.75em}.i-textarea-wrapper .i-error{font-size:.75em;flex:1}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: TooltipDirective, selector: "[iTooltip]", inputs: ["iTooltip", "tooltipPosition", "tooltipDelay"] }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.12", type: ITextarea, isStandalone: true, selector: "i-textarea", inputs: { label: "label", id: "id", fluid: "fluid", forceFloated: "forceFloated", useFloatLabel: "useFloatLabel", placeholder: "placeholder", rows: "rows", maxLength: "maxLength", resizable: "resizable", readonly: "readonly", disabled: "disabled", externalInvalid: "externalInvalid", externalErrorMessage: "externalErrorMessage", backgroundStyle: "backgroundStyle", errorMessages: "errorMessages", charCountWarnAt: "charCountWarnAt" }, ngImport: i0, template: "<div\n  class=\"i-textarea-wrapper\"\n  [class.invalid]=\"showErrors\"\n  [class.i-textarea--fluid]=\"fluid\"\n  [class.i-textarea--no-float]=\"!useFloatLabel\"\n  [attr.id]=\"componentId\"\n>\n  <div\n    [ngClass]=\"useFloatLabel ? 'float-label' : 'normal-input'\"\n    class=\"i-textarea-container\"\n  >\n    <div class=\"i-textarea-icon-wrapper\">\n      <textarea\n        #textareaElement\n        [id]=\"id || componentId\"\n        [disabled]=\"disabled\"\n        [readonly]=\"readonly\"\n        [rows]=\"rows\"\n        [attr.maxlength]=\"maxLength || null\"\n        [value]=\"value || ''\"\n        (input)=\"handleInput($event)\"\n        (blur)=\"touch()\"\n        [placeholder]=\"useFloatLabel ? ' ' : placeholder || label\"\n        class=\"i-textarea\"\n        [class.readonly]=\"readonly\"\n        [class.no-resize]=\"!resizable\"\n        [class.component-border]=\"backgroundStyle === 'component'\"\n        [iTooltip]=\"showErrors ? getErrorMessage() || '' : ''\"\n        tooltipPosition=\"below\"\n        [tooltipDelay]=\"100\"\n      ></textarea>\n      @if (useFloatLabel) {\n        <label\n          [for]=\"id || componentId\"\n          class=\"i-textarea-label\"\n          [class.floated]=\"forceFloated || hasValue\"\n          >{{ label }}</label\n        >\n      }\n      <ng-content></ng-content>\n    </div>\n  </div>\n\n  <div class=\"i-textarea-footer\">\n    @if (showErrors && getErrorMessage()) {\n      <span class=\"i-error\">{{ getErrorMessage() }}</span>\n    }\n    @if (maxLength) {\n      <span\n        class=\"i-char-count\"\n        [class.i-char-count--warn]=\"charCountWarning\"\n        [class.i-char-count--over]=\"charCountOver\"\n      >\n        {{ currentLength }}/{{ maxLength }}\n      </span>\n    }\n  </div>\n</div>\n", styles: [".i-textarea{color:var(--color-text-primary);border:1px solid var(--surface-border);background:var(--color-component-background-secondary)}.i-textarea.component-border{background:var(--color-component-background)}.i-textarea:focus{outline:none;border-color:var(--color-primary);box-shadow:0 2px 10px #0003}.i-textarea-label{color:var(--color-text-secondary)}.i-textarea[disabled]{background:var(--color-disabled-background);border-color:var(--color-disabled-border);color:var(--color-text-disabled);cursor:not-allowed}.i-textarea[disabled]+.i-textarea-label{color:var(--color-text-disabled)}.invalid .i-textarea{border-color:var(--color-danger)}.invalid .i-textarea-label,.invalid .i-error{color:var(--color-danger)}.i-char-count{color:var(--color-text-secondary)}.i-char-count.i-char-count--warn{color:var(--color-warning)}.i-char-count.i-char-count--over{color:var(--color-danger)}.i-textarea-wrapper{display:flex;flex-direction:column;gap:8px;width:100%;margin-top:1.5em;font-size:1em}.i-textarea-wrapper.i-textarea--fluid{width:100%}.i-textarea-wrapper.i-textarea--no-float{margin-top:0;height:auto}.i-textarea-wrapper .i-textarea-container{display:flex;align-items:flex-start;gap:8px}.i-textarea-wrapper .i-textarea{box-sizing:border-box;width:100%;border-radius:4px;transition:border-color .15s ease,box-shadow .15s ease;font-family:inherit;font-size:inherit;line-height:1.5;resize:vertical}.i-textarea-wrapper .i-textarea:focus{outline:none}.i-textarea-wrapper .i-textarea.readonly{cursor:pointer;-webkit-user-select:none;user-select:none;caret-color:transparent;resize:none}.i-textarea-wrapper .i-textarea.no-resize{resize:none}.i-textarea-wrapper .i-textarea-icon-wrapper{position:relative;width:100%;display:flex}.i-textarea-wrapper .float-label{position:relative;display:flex;align-items:flex-start}.i-textarea-wrapper .float-label .i-textarea{padding:20px 10px 8px}.i-textarea-wrapper .float-label .i-textarea-label{position:absolute;top:16px;left:12px;padding:0;max-width:calc(100% - 24px);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;line-height:1.2;background:transparent;transition:top .15s ease,left .15s ease,transform .15s ease,font-size .15s ease;pointer-events:none;font-size:1em}.i-textarea-wrapper .float-label .i-textarea:focus+.i-textarea-label,.i-textarea-wrapper .float-label .i-textarea:not(:placeholder-shown)+.i-textarea-label,.i-textarea-wrapper .float-label .i-textarea-label.floated{top:-4px;left:12px;transform:translateY(-100%);font-size:.85em}.i-textarea-wrapper .normal-input{position:relative}.i-textarea-wrapper .normal-input .i-textarea{padding:8px 12px}.i-textarea-wrapper .i-textarea-footer{display:flex;justify-content:flex-end;align-items:center;gap:8px;min-height:16px}.i-textarea-wrapper .i-char-count{font-size:.75em}.i-textarea-wrapper .i-error{font-size:.75em;flex:1}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: TooltipDirective, selector: "[iTooltip]", inputs: ["iTooltip", "tooltipPosition", "tooltipDelay"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: ITextarea, decorators: [{
             type: Component,
-            args: [{ selector: 'i-textarea', standalone: true, imports: [CommonModule, TooltipDirective], template: "<div\n  class=\"i-textarea-wrapper\"\n  [class.invalid]=\"showErrors\"\n  [class.i-textarea--fluid]=\"fluid\"\n  [class.i-textarea--no-float]=\"!useFloatLabel\"\n  [attr.id]=\"componentId\"\n>\n  <div\n    [ngClass]=\"useFloatLabel ? 'float-label' : 'normal-input'\"\n    class=\"i-textarea-container\"\n  >\n    <div class=\"i-textarea-icon-wrapper\">\n      <textarea\n        #textareaElement\n        [id]=\"id || componentId\"\n        [disabled]=\"disabled\"\n        [readonly]=\"readonly\"\n        [rows]=\"rows\"\n        [attr.maxlength]=\"maxLength || null\"\n        [value]=\"value || ''\"\n        (input)=\"handleInput($event)\"\n        (blur)=\"touch()\"\n        [placeholder]=\"useFloatLabel ? ' ' : placeholder || label\"\n        class=\"i-textarea\"\n        [class.readonly]=\"readonly\"\n        [class.no-resize]=\"!resizable\"\n        [class.component-border]=\"backgroundStyle === 'component'\"\n        [iTooltip]=\"showErrors ? getErrorMessage() || '' : ''\"\n        tooltipPosition=\"below\"\n        [tooltipDelay]=\"100\"\n      ></textarea>\n      @if (useFloatLabel) {\n        <label\n          [for]=\"id || componentId\"\n          class=\"i-textarea-label\"\n          [class.floated]=\"forceFloated || hasValue\"\n          >{{ label }}</label\n        >\n      }\n      <ng-content></ng-content>\n    </div>\n  </div>\n\n  <div class=\"i-textarea-footer\">\n    @if (showErrors && getErrorMessage()) {\n      <span class=\"i-error\">{{ getErrorMessage() }}</span>\n    }\n    @if (maxLength) {\n      <span\n        class=\"i-char-count\"\n        [class.i-char-count--warn]=\"charCountWarning\"\n        [class.i-char-count--over]=\"charCountOver\"\n      >\n        {{ currentLength }}/{{ maxLength }}\n      </span>\n    }\n  </div>\n</div>\n", styles: [".i-textarea{color:var(--color-text-primary);border:1px solid var(--surface-border);background:var(--color-component-background-secondary)}.i-textarea.component-border{background:var(--color-component-background)}.i-textarea:focus{outline:none;border-color:var(--color-primary);box-shadow:0 2px 10px #0003}.i-textarea-label{color:var(--color-text-secondary)}.i-textarea:focus+.i-textarea-label,.i-textarea:not(:placeholder-shown)+.i-textarea-label,.i-textarea-label.floated{background:var(--color-component-background-secondary)}.i-textarea[disabled]{background:var(--color-disabled-background);border-color:var(--color-disabled-border);color:var(--color-text-disabled);cursor:not-allowed}.i-textarea[disabled]+.i-textarea-label{color:var(--color-text-disabled)}.invalid .i-textarea{border-color:var(--color-danger)}.invalid .i-textarea-label,.invalid .i-error{color:var(--color-danger)}.i-char-count{color:var(--color-text-secondary)}.i-char-count.i-char-count--warn{color:var(--color-warning)}.i-char-count.i-char-count--over{color:var(--color-danger)}.i-textarea-wrapper{display:flex;flex-direction:column;gap:8px;width:100%;margin-top:4px;font-size:1em}.i-textarea-wrapper.i-textarea--fluid{width:100%}.i-textarea-wrapper.i-textarea--no-float{margin-top:0;height:auto}.i-textarea-wrapper .i-textarea-container{display:flex;align-items:flex-start;gap:8px}.i-textarea-wrapper .i-textarea{box-sizing:border-box;width:100%;border-radius:4px;transition:border-color .15s ease,box-shadow .15s ease;font-family:inherit;font-size:inherit;line-height:1.5;resize:vertical}.i-textarea-wrapper .i-textarea:focus{outline:none}.i-textarea-wrapper .i-textarea.readonly{cursor:pointer;-webkit-user-select:none;user-select:none;caret-color:transparent;resize:none}.i-textarea-wrapper .i-textarea.no-resize{resize:none}.i-textarea-wrapper .i-textarea-icon-wrapper{position:relative;width:100%;display:flex}.i-textarea-wrapper .float-label{position:relative;display:flex;align-items:flex-start}.i-textarea-wrapper .float-label .i-textarea{padding:20px 10px 8px}.i-textarea-wrapper .float-label .i-textarea-label{position:absolute;top:16px;left:8px;padding:0 4px;pointer-events:none;transition:all .15s ease;font-size:1em}.i-textarea-wrapper .float-label .i-textarea:focus+.i-textarea-label,.i-textarea-wrapper .float-label .i-textarea:not(:placeholder-shown)+.i-textarea-label,.i-textarea-wrapper .float-label .i-textarea-label.floated{top:-8px;font-size:.78em}.i-textarea-wrapper .normal-input{position:relative}.i-textarea-wrapper .normal-input .i-textarea{padding:8px 12px}.i-textarea-wrapper .i-textarea-footer{display:flex;justify-content:flex-end;align-items:center;gap:8px;min-height:16px}.i-textarea-wrapper .i-char-count{font-size:.75em}.i-textarea-wrapper .i-error{font-size:.75em;flex:1}\n"] }]
+            args: [{ selector: 'i-textarea', standalone: true, imports: [CommonModule, TooltipDirective], template: "<div\n  class=\"i-textarea-wrapper\"\n  [class.invalid]=\"showErrors\"\n  [class.i-textarea--fluid]=\"fluid\"\n  [class.i-textarea--no-float]=\"!useFloatLabel\"\n  [attr.id]=\"componentId\"\n>\n  <div\n    [ngClass]=\"useFloatLabel ? 'float-label' : 'normal-input'\"\n    class=\"i-textarea-container\"\n  >\n    <div class=\"i-textarea-icon-wrapper\">\n      <textarea\n        #textareaElement\n        [id]=\"id || componentId\"\n        [disabled]=\"disabled\"\n        [readonly]=\"readonly\"\n        [rows]=\"rows\"\n        [attr.maxlength]=\"maxLength || null\"\n        [value]=\"value || ''\"\n        (input)=\"handleInput($event)\"\n        (blur)=\"touch()\"\n        [placeholder]=\"useFloatLabel ? ' ' : placeholder || label\"\n        class=\"i-textarea\"\n        [class.readonly]=\"readonly\"\n        [class.no-resize]=\"!resizable\"\n        [class.component-border]=\"backgroundStyle === 'component'\"\n        [iTooltip]=\"showErrors ? getErrorMessage() || '' : ''\"\n        tooltipPosition=\"below\"\n        [tooltipDelay]=\"100\"\n      ></textarea>\n      @if (useFloatLabel) {\n        <label\n          [for]=\"id || componentId\"\n          class=\"i-textarea-label\"\n          [class.floated]=\"forceFloated || hasValue\"\n          >{{ label }}</label\n        >\n      }\n      <ng-content></ng-content>\n    </div>\n  </div>\n\n  <div class=\"i-textarea-footer\">\n    @if (showErrors && getErrorMessage()) {\n      <span class=\"i-error\">{{ getErrorMessage() }}</span>\n    }\n    @if (maxLength) {\n      <span\n        class=\"i-char-count\"\n        [class.i-char-count--warn]=\"charCountWarning\"\n        [class.i-char-count--over]=\"charCountOver\"\n      >\n        {{ currentLength }}/{{ maxLength }}\n      </span>\n    }\n  </div>\n</div>\n", styles: [".i-textarea{color:var(--color-text-primary);border:1px solid var(--surface-border);background:var(--color-component-background-secondary)}.i-textarea.component-border{background:var(--color-component-background)}.i-textarea:focus{outline:none;border-color:var(--color-primary);box-shadow:0 2px 10px #0003}.i-textarea-label{color:var(--color-text-secondary)}.i-textarea[disabled]{background:var(--color-disabled-background);border-color:var(--color-disabled-border);color:var(--color-text-disabled);cursor:not-allowed}.i-textarea[disabled]+.i-textarea-label{color:var(--color-text-disabled)}.invalid .i-textarea{border-color:var(--color-danger)}.invalid .i-textarea-label,.invalid .i-error{color:var(--color-danger)}.i-char-count{color:var(--color-text-secondary)}.i-char-count.i-char-count--warn{color:var(--color-warning)}.i-char-count.i-char-count--over{color:var(--color-danger)}.i-textarea-wrapper{display:flex;flex-direction:column;gap:8px;width:100%;margin-top:1.5em;font-size:1em}.i-textarea-wrapper.i-textarea--fluid{width:100%}.i-textarea-wrapper.i-textarea--no-float{margin-top:0;height:auto}.i-textarea-wrapper .i-textarea-container{display:flex;align-items:flex-start;gap:8px}.i-textarea-wrapper .i-textarea{box-sizing:border-box;width:100%;border-radius:4px;transition:border-color .15s ease,box-shadow .15s ease;font-family:inherit;font-size:inherit;line-height:1.5;resize:vertical}.i-textarea-wrapper .i-textarea:focus{outline:none}.i-textarea-wrapper .i-textarea.readonly{cursor:pointer;-webkit-user-select:none;user-select:none;caret-color:transparent;resize:none}.i-textarea-wrapper .i-textarea.no-resize{resize:none}.i-textarea-wrapper .i-textarea-icon-wrapper{position:relative;width:100%;display:flex}.i-textarea-wrapper .float-label{position:relative;display:flex;align-items:flex-start}.i-textarea-wrapper .float-label .i-textarea{padding:20px 10px 8px}.i-textarea-wrapper .float-label .i-textarea-label{position:absolute;top:16px;left:12px;padding:0;max-width:calc(100% - 24px);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;line-height:1.2;background:transparent;transition:top .15s ease,left .15s ease,transform .15s ease,font-size .15s ease;pointer-events:none;font-size:1em}.i-textarea-wrapper .float-label .i-textarea:focus+.i-textarea-label,.i-textarea-wrapper .float-label .i-textarea:not(:placeholder-shown)+.i-textarea-label,.i-textarea-wrapper .float-label .i-textarea-label.floated{top:-4px;left:12px;transform:translateY(-100%);font-size:.85em}.i-textarea-wrapper .normal-input{position:relative}.i-textarea-wrapper .normal-input .i-textarea{padding:8px 12px}.i-textarea-wrapper .i-textarea-footer{display:flex;justify-content:flex-end;align-items:center;gap:8px;min-height:16px}.i-textarea-wrapper .i-char-count{font-size:.75em}.i-textarea-wrapper .i-error{font-size:.75em;flex:1}\n"] }]
         }], ctorParameters: () => [{ type: i1.NgControl, decorators: [{
                     type: Optional
                 }, {
@@ -5550,7 +5554,7 @@ class IMultiSelect {
                 useExisting: forwardRef(() => IMultiSelect),
                 multi: true,
             },
-        ], viewQueries: [{ propertyName: "dropdownRef", first: true, predicate: ["dropdown"], descendants: true }, { propertyName: "searchInputRef", first: true, predicate: ["searchInput"], descendants: true }], ngImport: i0, template: "<div\n  class=\"i-multi-select-wrapper\"\n  [class.i-multi-select--fluid]=\"fluid\"\n  #dropdown\n>\n  <!-- Input container with click handler -->\n  <div class=\"i-multi-select-input-container\" (click)=\"toggleDropdown()\">\n    <!-- Chips component with float label -->\n    <i-chips\n      [chips]=\"selectedChips()\"\n      [boxed]=\"true\"\n      [collapseOnOverflow]=\"true\"\n      [removable]=\"!disabled\"\n      [disabled]=\"disabled\"\n      [allowCloseAll]=\"showClear && value && value.length > 0\"\n      [useFloatLabel]=\"true\"\n      [label]=\"label\"\n      [showError]=\"showErrors\"\n      (removeChip)=\"onChipRemove($event)\"\n      (closedAll)=\"onChipsCloseAll()\"\n      class=\"i-multi-select-chips\"\n    ></i-chips>\n\n    <!-- Icons overlay -->\n    <div class=\"i-multi-select-icons-overlay\">\n      <span class=\"i-multi-select-arrow-wrapper\">\n        <i\n          class=\"pi pi-chevron-down i-multi-select-arrow\"\n          [class.flipped]=\"isOpen\"\n        ></i>\n      </span>\n    </div>\n\n    <!-- Error message -->\n    @if (showErrors) {\n      <div class=\"i-multi-select-error\">\n        {{ getErrorMessage() }}\n      </div>\n    }\n  </div>\n\n  @if (isOpen) {\n    <div class=\"i-multi-select-dropdown\" [class.open]=\"isOpen\">\n      @if (filter) {\n        <div class=\"i-multi-select-filter\">\n          <i-input-text\n            #searchInput\n            [useFloatLabel]=\"false\"\n            placeholder=\"Search...\"\n            [ngModel]=\"filterValue()\"\n            (ngModelChange)=\"filterValue.set($event)\"\n            [fluid]=\"true\"\n            [icon]=\"'pi pi-search'\"\n          >\n          </i-input-text>\n        </div>\n      }\n\n      <div class=\"i-multi-select-options\">\n        @for (option of filteredOptions(); track option) {\n          <div\n            class=\"i-multi-select-option\"\n            [class.selected]=\"isOptionSelected(option)\"\n            (click)=\"toggleOption(option)\"\n          >\n            <i-checkbox\n              [checked]=\"isOptionSelected(option)\"\n              [readonly]=\"true\"\n              size=\"small\"\n              class=\"i-multi-select-checkbox\"\n            ></i-checkbox>\n            <span class=\"i-multi-select-option-label\">\n              {{ getOptionLabel(option) }}\n            </span>\n          </div>\n        }\n\n        @if (filteredOptions().length === 0) {\n          <div class=\"i-multi-select-no-options\">No options found</div>\n        }\n      </div>\n    </div>\n  }\n</div>\n", styles: [".i-multi-select-error{color:var(--color-danger)}.i-multi-select-icons-overlay{color:var(--color-text-secondary)}.i-multi-select-dropdown{background:var(--color-component-background);border:1px solid var(--surface-border)}.i-multi-select-dropdown .i-multi-select-filter .i-multi-select-search{border-color:var(--surface-border);background:var(--surface-ground);color:var(--color-text-primary)}.i-multi-select-dropdown .i-multi-select-filter .i-multi-select-search:focus{border-color:var(--color-primary);box-shadow:0 2px 10px #0003}.i-multi-select-dropdown .i-multi-select-options{background:transparent}.i-multi-select-dropdown .i-multi-select-options .i-multi-select-option{color:var(--color-text-primary)}.i-multi-select-dropdown .i-multi-select-options .i-multi-select-option:hover,.i-multi-select-dropdown .i-multi-select-options .i-multi-select-option.selected{background-color:var(--surface-hover)}.i-multi-select-dropdown .i-multi-select-options .i-multi-select-option .i-multi-select-checkbox{accent-color:var(--color-primary)}.i-multi-select-dropdown .i-multi-select-options .i-multi-select-no-options{color:var(--color-text-secondary)}.invalid .i-multi-select-trigger{border-color:var(--color-danger)}.invalid .i-label{color:var(--color-danger)}.i-multi-select-wrapper{position:relative;width:100%}.i-multi-select-wrapper.i-multi-select--fluid{width:100%}.i-multi-select-wrapper .i-multi-select-input-container{position:relative;cursor:pointer}.i-multi-select-wrapper .i-multi-select-input-container .i-multi-select-chips{position:relative;min-height:56px;cursor:pointer}.i-multi-select-wrapper .i-multi-select-input-container .i-multi-select-icons-overlay{position:absolute;top:18%;right:4px;z-index:3;display:flex;align-items:center;gap:0;pointer-events:none}.i-multi-select-wrapper .i-multi-select-input-container .i-multi-select-icons-overlay .i-multi-select-arrow-wrapper{width:24px;height:24px;display:inline-flex;align-items:center;justify-content:center}.i-multi-select-wrapper .i-multi-select-input-container .i-multi-select-icons-overlay .i-multi-select-arrow{font-size:.8em;transition:transform .15s ease}.i-multi-select-wrapper .i-multi-select-input-container .i-multi-select-icons-overlay .i-multi-select-arrow.flipped{transform:rotate(180deg)}.i-multi-select-wrapper .i-multi-select-input-container .i-multi-select-error{margin-top:4px;font-size:1em;padding-left:12px}.i-multi-select-wrapper .i-multi-select-dropdown{position:absolute;top:100%;left:0;right:0;z-index:1000;margin-top:4px;margin-bottom:8px;border-radius:4px;box-shadow:0 4px 12px #00000026;overflow:visible}.i-multi-select-wrapper .i-multi-select-dropdown .i-multi-select-filter{padding:8px}.i-multi-select-wrapper .i-multi-select-dropdown .i-multi-select-filter .i-multi-select-search{width:100%;padding:8px;border:1px solid;border-radius:4px;font-size:1em;outline:none}.i-multi-select-wrapper .i-multi-select-dropdown .i-multi-select-options{max-height:min(160px,100vh - 150px);padding-right:2px;overflow-x:hidden;overflow-y:auto;border-radius:0 0 4px 4px}.i-multi-select-wrapper .i-multi-select-dropdown .i-multi-select-options::-webkit-scrollbar-track{background:var(--scrollbar-track, transparent);border-radius:var(--scrollbar-radius, 3px)}.i-multi-select-wrapper .i-multi-select-dropdown .i-multi-select-options::-webkit-scrollbar-thumb{background:#0003;border-radius:var(--scrollbar-radius, 3px);transition:background .2s ease}.i-multi-select-wrapper .i-multi-select-dropdown .i-multi-select-options::-webkit-scrollbar-thumb:hover{background:#00000059}.i-multi-select-wrapper .i-multi-select-dropdown .i-multi-select-options::-webkit-scrollbar-thumb:active{background:#00000080}.i-multi-select-wrapper .i-multi-select-dropdown .i-multi-select-options::-webkit-scrollbar-corner{background:transparent}.i-multi-select-wrapper .i-multi-select-dropdown .i-multi-select-options{scrollbar-width:thin;scrollbar-color:rgba(0,0,0,.2) transparent;scroll-behavior:smooth}.i-multi-select-wrapper .i-multi-select-dropdown .i-multi-select-options::-webkit-scrollbar-thumb{background:var(--scrollbar-thumb, var(--color-text-secondary))}.i-multi-select-wrapper .i-multi-select-dropdown .i-multi-select-options{scrollbar-color:var(--scrollbar-thumb, var(--color-text-secondary)) var(--scrollbar-track, transparent)}.i-multi-select-wrapper .i-multi-select-dropdown .i-multi-select-options::-webkit-scrollbar{width:var(--scrollbar-size, 6px);height:var(--scrollbar-size, 6px)}.i-multi-select-wrapper .i-multi-select-dropdown .i-multi-select-options::-webkit-scrollbar-track{background:var(--scrollbar-track-dropdown, rgba(0, 0, 0, .05));border-radius:var(--scrollbar-radius, 3px);margin:2px 0}.i-multi-select-wrapper .i-multi-select-dropdown .i-multi-select-options::-webkit-scrollbar-thumb{border-radius:var(--scrollbar-radius, 3px);min-height:20px;background:var(--scrollbar-thumb, var(--color-text-secondary))}.i-multi-select-wrapper .i-multi-select-dropdown .i-multi-select-options::-webkit-scrollbar-thumb:hover{background:var(--scrollbar-thumb-hover, var(--color-text-primary))}.i-multi-select-wrapper .i-multi-select-dropdown .i-multi-select-options::-webkit-scrollbar-thumb:active{background:var(--scrollbar-thumb-active, var(--color-primary))}.i-multi-select-wrapper .i-multi-select-dropdown .i-multi-select-options{scrollbar-width:thin;scrollbar-color:var(--scrollbar-thumb, var(--color-text-secondary)) var(--scrollbar-track-dropdown, rgba(0, 0, 0, .05))}.i-multi-select-wrapper .i-multi-select-dropdown .i-multi-select-options .i-multi-select-option{display:flex;align-items:center;gap:8px;padding:8px 12px;font-size:1em;cursor:pointer;transition:background-color .15s ease}.i-multi-select-wrapper .i-multi-select-dropdown .i-multi-select-options .i-multi-select-option.selected{font-weight:500}.i-multi-select-wrapper .i-multi-select-dropdown .i-multi-select-options .i-multi-select-option .i-multi-select-checkbox{pointer-events:none}.i-multi-select-wrapper .i-multi-select-dropdown .i-multi-select-options .i-multi-select-option .i-multi-select-option-label{flex:1}.i-multi-select-wrapper .i-multi-select-dropdown .i-multi-select-options .i-multi-select-no-options{padding:12px;font-style:italic;text-align:center;opacity:.6}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: IChipsComponent, selector: "i-chips", inputs: ["chips", "removable", "disabled", "collapseOnOverflow", "overflowLabel", "boxed", "allowCloseAll", "label", "useFloatLabel", "showError"], outputs: ["closedAll", "removeChip"] }, { kind: "component", type: ICheckbox, selector: "i-checkbox", inputs: ["label", "id", "disabled", "readonly", "size", "indeterminate", "checked"], outputs: ["onChange"] }, { kind: "component", type: IInputText, selector: "i-input-text", inputs: ["label", "type", "id", "fluid", "forceFloated", "hideText", "useFloatLabel", "placeholder", "externalInvalid", "externalErrorMessage", "backgroundStyle", "icon", "readonly", "disabled", "errorMessages"] }] });
+        ], viewQueries: [{ propertyName: "dropdownRef", first: true, predicate: ["dropdown"], descendants: true }, { propertyName: "searchInputRef", first: true, predicate: ["searchInput"], descendants: true }], ngImport: i0, template: "<div\n  class=\"i-multi-select-wrapper\"\n  [class.i-multi-select--fluid]=\"fluid\"\n  #dropdown\n>\n  <!-- Input container with click handler -->\n  <div class=\"i-multi-select-input-container\" (click)=\"toggleDropdown()\">\n    <!-- Chips component with float label -->\n    <i-chips\n      [chips]=\"selectedChips()\"\n      [boxed]=\"true\"\n      [collapseOnOverflow]=\"true\"\n      [removable]=\"!disabled\"\n      [disabled]=\"disabled\"\n      [allowCloseAll]=\"showClear && value && value.length > 0\"\n      [useFloatLabel]=\"true\"\n      [label]=\"label\"\n      [showError]=\"showErrors\"\n      (removeChip)=\"onChipRemove($event)\"\n      (closedAll)=\"onChipsCloseAll()\"\n      class=\"i-multi-select-chips\"\n    ></i-chips>\n\n    <!-- Icons overlay -->\n    <div class=\"i-multi-select-icons-overlay\">\n      <span class=\"i-multi-select-arrow-wrapper\">\n        <i\n          class=\"pi pi-chevron-down i-multi-select-arrow\"\n          [class.flipped]=\"isOpen\"\n        ></i>\n      </span>\n    </div>\n\n    <!-- Error message -->\n    @if (showErrors) {\n      <div class=\"i-multi-select-error\">\n        {{ getErrorMessage() }}\n      </div>\n    }\n  </div>\n\n  @if (isOpen) {\n    <div class=\"i-multi-select-dropdown\" [class.open]=\"isOpen\">\n      @if (filter) {\n        <div class=\"i-multi-select-filter\">\n          <i-input-text\n            #searchInput\n            [useFloatLabel]=\"false\"\n            placeholder=\"Search...\"\n            [ngModel]=\"filterValue()\"\n            (ngModelChange)=\"filterValue.set($event)\"\n            [fluid]=\"true\"\n            [icon]=\"'pi pi-search'\"\n          >\n          </i-input-text>\n        </div>\n      }\n\n      <div class=\"i-multi-select-options\">\n        @for (option of filteredOptions(); track option) {\n          <div\n            class=\"i-multi-select-option\"\n            [class.selected]=\"isOptionSelected(option)\"\n            (click)=\"toggleOption(option)\"\n          >\n            <i-checkbox\n              [checked]=\"isOptionSelected(option)\"\n              [readonly]=\"true\"\n              size=\"small\"\n              class=\"i-multi-select-checkbox\"\n            ></i-checkbox>\n            <span class=\"i-multi-select-option-label\">\n              {{ getOptionLabel(option) }}\n            </span>\n          </div>\n        }\n\n        @if (filteredOptions().length === 0) {\n          <div class=\"i-multi-select-no-options\">No options found</div>\n        }\n      </div>\n    </div>\n  }\n</div>\n", styles: [".i-multi-select-error{color:var(--color-danger)}.i-multi-select-icons-overlay{color:var(--color-text-secondary)}.i-multi-select-dropdown{background:var(--color-component-background);border:1px solid var(--surface-border)}.i-multi-select-dropdown .i-multi-select-filter .i-multi-select-search{border-color:var(--surface-border);background:var(--surface-ground);color:var(--color-text-primary)}.i-multi-select-dropdown .i-multi-select-filter .i-multi-select-search:focus{border-color:var(--color-primary);box-shadow:0 2px 10px #0003}.i-multi-select-dropdown .i-multi-select-options{background:transparent}.i-multi-select-dropdown .i-multi-select-options .i-multi-select-option{color:var(--color-text-primary)}.i-multi-select-dropdown .i-multi-select-options .i-multi-select-option:hover,.i-multi-select-dropdown .i-multi-select-options .i-multi-select-option.selected{background-color:var(--surface-hover)}.i-multi-select-dropdown .i-multi-select-options .i-multi-select-option .i-multi-select-checkbox{accent-color:var(--color-primary)}.i-multi-select-dropdown .i-multi-select-options .i-multi-select-no-options{color:var(--color-text-secondary)}.invalid .i-multi-select-trigger{border-color:var(--color-danger)}.invalid .i-label{color:var(--color-danger)}.i-multi-select-wrapper{position:relative;width:100%}.i-multi-select-wrapper.i-multi-select--fluid{width:100%}.i-multi-select-wrapper .i-multi-select-input-container{display:flow-root;position:relative;cursor:pointer}.i-multi-select-wrapper .i-multi-select-input-container .i-multi-select-chips{position:relative;cursor:pointer}.i-multi-select-wrapper .i-multi-select-input-container .i-multi-select-icons-overlay{position:absolute;top:calc(1.5em + 21px);transform:translateY(-50%);right:4px;z-index:3;display:flex;align-items:center;gap:0;pointer-events:none}.i-multi-select-wrapper .i-multi-select-input-container .i-multi-select-icons-overlay .i-multi-select-arrow-wrapper{width:24px;height:24px;display:inline-flex;align-items:center;justify-content:center}.i-multi-select-wrapper .i-multi-select-input-container .i-multi-select-icons-overlay .i-multi-select-arrow{font-size:.8em;transition:transform .15s ease}.i-multi-select-wrapper .i-multi-select-input-container .i-multi-select-icons-overlay .i-multi-select-arrow.flipped{transform:rotate(180deg)}.i-multi-select-wrapper .i-multi-select-input-container .i-multi-select-error{margin-top:4px;font-size:1em;padding-left:12px}.i-multi-select-wrapper .i-multi-select-dropdown{position:absolute;top:100%;left:0;right:0;z-index:1000;margin-top:4px;margin-bottom:8px;border-radius:4px;box-shadow:0 4px 12px #00000026;overflow:visible}.i-multi-select-wrapper .i-multi-select-dropdown .i-multi-select-filter{padding:8px}.i-multi-select-wrapper .i-multi-select-dropdown .i-multi-select-filter .i-multi-select-search{width:100%;padding:8px;border:1px solid;border-radius:4px;font-size:1em;outline:none}.i-multi-select-wrapper .i-multi-select-dropdown .i-multi-select-options{max-height:min(160px,100vh - 150px);padding-right:2px;overflow-x:hidden;overflow-y:auto;border-radius:0 0 4px 4px}.i-multi-select-wrapper .i-multi-select-dropdown .i-multi-select-options::-webkit-scrollbar-track{background:var(--scrollbar-track, transparent);border-radius:var(--scrollbar-radius, 3px)}.i-multi-select-wrapper .i-multi-select-dropdown .i-multi-select-options::-webkit-scrollbar-thumb{background:#0003;border-radius:var(--scrollbar-radius, 3px);transition:background .2s ease}.i-multi-select-wrapper .i-multi-select-dropdown .i-multi-select-options::-webkit-scrollbar-thumb:hover{background:#00000059}.i-multi-select-wrapper .i-multi-select-dropdown .i-multi-select-options::-webkit-scrollbar-thumb:active{background:#00000080}.i-multi-select-wrapper .i-multi-select-dropdown .i-multi-select-options::-webkit-scrollbar-corner{background:transparent}.i-multi-select-wrapper .i-multi-select-dropdown .i-multi-select-options{scrollbar-width:thin;scrollbar-color:rgba(0,0,0,.2) transparent;scroll-behavior:smooth}.i-multi-select-wrapper .i-multi-select-dropdown .i-multi-select-options::-webkit-scrollbar-thumb{background:var(--scrollbar-thumb, var(--color-text-secondary))}.i-multi-select-wrapper .i-multi-select-dropdown .i-multi-select-options{scrollbar-color:var(--scrollbar-thumb, var(--color-text-secondary)) var(--scrollbar-track, transparent)}.i-multi-select-wrapper .i-multi-select-dropdown .i-multi-select-options::-webkit-scrollbar{width:var(--scrollbar-size, 6px);height:var(--scrollbar-size, 6px)}.i-multi-select-wrapper .i-multi-select-dropdown .i-multi-select-options::-webkit-scrollbar-track{background:var(--scrollbar-track-dropdown, rgba(0, 0, 0, .05));border-radius:var(--scrollbar-radius, 3px);margin:2px 0}.i-multi-select-wrapper .i-multi-select-dropdown .i-multi-select-options::-webkit-scrollbar-thumb{border-radius:var(--scrollbar-radius, 3px);min-height:20px;background:var(--scrollbar-thumb, var(--color-text-secondary))}.i-multi-select-wrapper .i-multi-select-dropdown .i-multi-select-options::-webkit-scrollbar-thumb:hover{background:var(--scrollbar-thumb-hover, var(--color-text-primary))}.i-multi-select-wrapper .i-multi-select-dropdown .i-multi-select-options::-webkit-scrollbar-thumb:active{background:var(--scrollbar-thumb-active, var(--color-primary))}.i-multi-select-wrapper .i-multi-select-dropdown .i-multi-select-options{scrollbar-width:thin;scrollbar-color:var(--scrollbar-thumb, var(--color-text-secondary)) var(--scrollbar-track-dropdown, rgba(0, 0, 0, .05))}.i-multi-select-wrapper .i-multi-select-dropdown .i-multi-select-options .i-multi-select-option{display:flex;align-items:center;gap:8px;padding:8px 12px;font-size:1em;cursor:pointer;transition:background-color .15s ease}.i-multi-select-wrapper .i-multi-select-dropdown .i-multi-select-options .i-multi-select-option.selected{font-weight:500}.i-multi-select-wrapper .i-multi-select-dropdown .i-multi-select-options .i-multi-select-option .i-multi-select-checkbox{pointer-events:none}.i-multi-select-wrapper .i-multi-select-dropdown .i-multi-select-options .i-multi-select-option .i-multi-select-option-label{flex:1}.i-multi-select-wrapper .i-multi-select-dropdown .i-multi-select-options .i-multi-select-no-options{padding:12px;font-style:italic;text-align:center;opacity:.6}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: IChipsComponent, selector: "i-chips", inputs: ["chips", "removable", "disabled", "collapseOnOverflow", "overflowLabel", "boxed", "allowCloseAll", "label", "useFloatLabel", "showError"], outputs: ["closedAll", "removeChip"] }, { kind: "component", type: ICheckbox, selector: "i-checkbox", inputs: ["label", "id", "disabled", "readonly", "size", "indeterminate", "checked"], outputs: ["onChange"] }, { kind: "component", type: IInputText, selector: "i-input-text", inputs: ["label", "type", "id", "fluid", "forceFloated", "hideText", "useFloatLabel", "placeholder", "externalInvalid", "externalErrorMessage", "backgroundStyle", "icon", "readonly", "disabled", "errorMessages"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: IMultiSelect, decorators: [{
             type: Component,
@@ -5560,7 +5564,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImpo
                             useExisting: forwardRef(() => IMultiSelect),
                             multi: true,
                         },
-                    ], template: "<div\n  class=\"i-multi-select-wrapper\"\n  [class.i-multi-select--fluid]=\"fluid\"\n  #dropdown\n>\n  <!-- Input container with click handler -->\n  <div class=\"i-multi-select-input-container\" (click)=\"toggleDropdown()\">\n    <!-- Chips component with float label -->\n    <i-chips\n      [chips]=\"selectedChips()\"\n      [boxed]=\"true\"\n      [collapseOnOverflow]=\"true\"\n      [removable]=\"!disabled\"\n      [disabled]=\"disabled\"\n      [allowCloseAll]=\"showClear && value && value.length > 0\"\n      [useFloatLabel]=\"true\"\n      [label]=\"label\"\n      [showError]=\"showErrors\"\n      (removeChip)=\"onChipRemove($event)\"\n      (closedAll)=\"onChipsCloseAll()\"\n      class=\"i-multi-select-chips\"\n    ></i-chips>\n\n    <!-- Icons overlay -->\n    <div class=\"i-multi-select-icons-overlay\">\n      <span class=\"i-multi-select-arrow-wrapper\">\n        <i\n          class=\"pi pi-chevron-down i-multi-select-arrow\"\n          [class.flipped]=\"isOpen\"\n        ></i>\n      </span>\n    </div>\n\n    <!-- Error message -->\n    @if (showErrors) {\n      <div class=\"i-multi-select-error\">\n        {{ getErrorMessage() }}\n      </div>\n    }\n  </div>\n\n  @if (isOpen) {\n    <div class=\"i-multi-select-dropdown\" [class.open]=\"isOpen\">\n      @if (filter) {\n        <div class=\"i-multi-select-filter\">\n          <i-input-text\n            #searchInput\n            [useFloatLabel]=\"false\"\n            placeholder=\"Search...\"\n            [ngModel]=\"filterValue()\"\n            (ngModelChange)=\"filterValue.set($event)\"\n            [fluid]=\"true\"\n            [icon]=\"'pi pi-search'\"\n          >\n          </i-input-text>\n        </div>\n      }\n\n      <div class=\"i-multi-select-options\">\n        @for (option of filteredOptions(); track option) {\n          <div\n            class=\"i-multi-select-option\"\n            [class.selected]=\"isOptionSelected(option)\"\n            (click)=\"toggleOption(option)\"\n          >\n            <i-checkbox\n              [checked]=\"isOptionSelected(option)\"\n              [readonly]=\"true\"\n              size=\"small\"\n              class=\"i-multi-select-checkbox\"\n            ></i-checkbox>\n            <span class=\"i-multi-select-option-label\">\n              {{ getOptionLabel(option) }}\n            </span>\n          </div>\n        }\n\n        @if (filteredOptions().length === 0) {\n          <div class=\"i-multi-select-no-options\">No options found</div>\n        }\n      </div>\n    </div>\n  }\n</div>\n", styles: [".i-multi-select-error{color:var(--color-danger)}.i-multi-select-icons-overlay{color:var(--color-text-secondary)}.i-multi-select-dropdown{background:var(--color-component-background);border:1px solid var(--surface-border)}.i-multi-select-dropdown .i-multi-select-filter .i-multi-select-search{border-color:var(--surface-border);background:var(--surface-ground);color:var(--color-text-primary)}.i-multi-select-dropdown .i-multi-select-filter .i-multi-select-search:focus{border-color:var(--color-primary);box-shadow:0 2px 10px #0003}.i-multi-select-dropdown .i-multi-select-options{background:transparent}.i-multi-select-dropdown .i-multi-select-options .i-multi-select-option{color:var(--color-text-primary)}.i-multi-select-dropdown .i-multi-select-options .i-multi-select-option:hover,.i-multi-select-dropdown .i-multi-select-options .i-multi-select-option.selected{background-color:var(--surface-hover)}.i-multi-select-dropdown .i-multi-select-options .i-multi-select-option .i-multi-select-checkbox{accent-color:var(--color-primary)}.i-multi-select-dropdown .i-multi-select-options .i-multi-select-no-options{color:var(--color-text-secondary)}.invalid .i-multi-select-trigger{border-color:var(--color-danger)}.invalid .i-label{color:var(--color-danger)}.i-multi-select-wrapper{position:relative;width:100%}.i-multi-select-wrapper.i-multi-select--fluid{width:100%}.i-multi-select-wrapper .i-multi-select-input-container{position:relative;cursor:pointer}.i-multi-select-wrapper .i-multi-select-input-container .i-multi-select-chips{position:relative;min-height:56px;cursor:pointer}.i-multi-select-wrapper .i-multi-select-input-container .i-multi-select-icons-overlay{position:absolute;top:18%;right:4px;z-index:3;display:flex;align-items:center;gap:0;pointer-events:none}.i-multi-select-wrapper .i-multi-select-input-container .i-multi-select-icons-overlay .i-multi-select-arrow-wrapper{width:24px;height:24px;display:inline-flex;align-items:center;justify-content:center}.i-multi-select-wrapper .i-multi-select-input-container .i-multi-select-icons-overlay .i-multi-select-arrow{font-size:.8em;transition:transform .15s ease}.i-multi-select-wrapper .i-multi-select-input-container .i-multi-select-icons-overlay .i-multi-select-arrow.flipped{transform:rotate(180deg)}.i-multi-select-wrapper .i-multi-select-input-container .i-multi-select-error{margin-top:4px;font-size:1em;padding-left:12px}.i-multi-select-wrapper .i-multi-select-dropdown{position:absolute;top:100%;left:0;right:0;z-index:1000;margin-top:4px;margin-bottom:8px;border-radius:4px;box-shadow:0 4px 12px #00000026;overflow:visible}.i-multi-select-wrapper .i-multi-select-dropdown .i-multi-select-filter{padding:8px}.i-multi-select-wrapper .i-multi-select-dropdown .i-multi-select-filter .i-multi-select-search{width:100%;padding:8px;border:1px solid;border-radius:4px;font-size:1em;outline:none}.i-multi-select-wrapper .i-multi-select-dropdown .i-multi-select-options{max-height:min(160px,100vh - 150px);padding-right:2px;overflow-x:hidden;overflow-y:auto;border-radius:0 0 4px 4px}.i-multi-select-wrapper .i-multi-select-dropdown .i-multi-select-options::-webkit-scrollbar-track{background:var(--scrollbar-track, transparent);border-radius:var(--scrollbar-radius, 3px)}.i-multi-select-wrapper .i-multi-select-dropdown .i-multi-select-options::-webkit-scrollbar-thumb{background:#0003;border-radius:var(--scrollbar-radius, 3px);transition:background .2s ease}.i-multi-select-wrapper .i-multi-select-dropdown .i-multi-select-options::-webkit-scrollbar-thumb:hover{background:#00000059}.i-multi-select-wrapper .i-multi-select-dropdown .i-multi-select-options::-webkit-scrollbar-thumb:active{background:#00000080}.i-multi-select-wrapper .i-multi-select-dropdown .i-multi-select-options::-webkit-scrollbar-corner{background:transparent}.i-multi-select-wrapper .i-multi-select-dropdown .i-multi-select-options{scrollbar-width:thin;scrollbar-color:rgba(0,0,0,.2) transparent;scroll-behavior:smooth}.i-multi-select-wrapper .i-multi-select-dropdown .i-multi-select-options::-webkit-scrollbar-thumb{background:var(--scrollbar-thumb, var(--color-text-secondary))}.i-multi-select-wrapper .i-multi-select-dropdown .i-multi-select-options{scrollbar-color:var(--scrollbar-thumb, var(--color-text-secondary)) var(--scrollbar-track, transparent)}.i-multi-select-wrapper .i-multi-select-dropdown .i-multi-select-options::-webkit-scrollbar{width:var(--scrollbar-size, 6px);height:var(--scrollbar-size, 6px)}.i-multi-select-wrapper .i-multi-select-dropdown .i-multi-select-options::-webkit-scrollbar-track{background:var(--scrollbar-track-dropdown, rgba(0, 0, 0, .05));border-radius:var(--scrollbar-radius, 3px);margin:2px 0}.i-multi-select-wrapper .i-multi-select-dropdown .i-multi-select-options::-webkit-scrollbar-thumb{border-radius:var(--scrollbar-radius, 3px);min-height:20px;background:var(--scrollbar-thumb, var(--color-text-secondary))}.i-multi-select-wrapper .i-multi-select-dropdown .i-multi-select-options::-webkit-scrollbar-thumb:hover{background:var(--scrollbar-thumb-hover, var(--color-text-primary))}.i-multi-select-wrapper .i-multi-select-dropdown .i-multi-select-options::-webkit-scrollbar-thumb:active{background:var(--scrollbar-thumb-active, var(--color-primary))}.i-multi-select-wrapper .i-multi-select-dropdown .i-multi-select-options{scrollbar-width:thin;scrollbar-color:var(--scrollbar-thumb, var(--color-text-secondary)) var(--scrollbar-track-dropdown, rgba(0, 0, 0, .05))}.i-multi-select-wrapper .i-multi-select-dropdown .i-multi-select-options .i-multi-select-option{display:flex;align-items:center;gap:8px;padding:8px 12px;font-size:1em;cursor:pointer;transition:background-color .15s ease}.i-multi-select-wrapper .i-multi-select-dropdown .i-multi-select-options .i-multi-select-option.selected{font-weight:500}.i-multi-select-wrapper .i-multi-select-dropdown .i-multi-select-options .i-multi-select-option .i-multi-select-checkbox{pointer-events:none}.i-multi-select-wrapper .i-multi-select-dropdown .i-multi-select-options .i-multi-select-option .i-multi-select-option-label{flex:1}.i-multi-select-wrapper .i-multi-select-dropdown .i-multi-select-options .i-multi-select-no-options{padding:12px;font-style:italic;text-align:center;opacity:.6}\n"] }]
+                    ], template: "<div\n  class=\"i-multi-select-wrapper\"\n  [class.i-multi-select--fluid]=\"fluid\"\n  #dropdown\n>\n  <!-- Input container with click handler -->\n  <div class=\"i-multi-select-input-container\" (click)=\"toggleDropdown()\">\n    <!-- Chips component with float label -->\n    <i-chips\n      [chips]=\"selectedChips()\"\n      [boxed]=\"true\"\n      [collapseOnOverflow]=\"true\"\n      [removable]=\"!disabled\"\n      [disabled]=\"disabled\"\n      [allowCloseAll]=\"showClear && value && value.length > 0\"\n      [useFloatLabel]=\"true\"\n      [label]=\"label\"\n      [showError]=\"showErrors\"\n      (removeChip)=\"onChipRemove($event)\"\n      (closedAll)=\"onChipsCloseAll()\"\n      class=\"i-multi-select-chips\"\n    ></i-chips>\n\n    <!-- Icons overlay -->\n    <div class=\"i-multi-select-icons-overlay\">\n      <span class=\"i-multi-select-arrow-wrapper\">\n        <i\n          class=\"pi pi-chevron-down i-multi-select-arrow\"\n          [class.flipped]=\"isOpen\"\n        ></i>\n      </span>\n    </div>\n\n    <!-- Error message -->\n    @if (showErrors) {\n      <div class=\"i-multi-select-error\">\n        {{ getErrorMessage() }}\n      </div>\n    }\n  </div>\n\n  @if (isOpen) {\n    <div class=\"i-multi-select-dropdown\" [class.open]=\"isOpen\">\n      @if (filter) {\n        <div class=\"i-multi-select-filter\">\n          <i-input-text\n            #searchInput\n            [useFloatLabel]=\"false\"\n            placeholder=\"Search...\"\n            [ngModel]=\"filterValue()\"\n            (ngModelChange)=\"filterValue.set($event)\"\n            [fluid]=\"true\"\n            [icon]=\"'pi pi-search'\"\n          >\n          </i-input-text>\n        </div>\n      }\n\n      <div class=\"i-multi-select-options\">\n        @for (option of filteredOptions(); track option) {\n          <div\n            class=\"i-multi-select-option\"\n            [class.selected]=\"isOptionSelected(option)\"\n            (click)=\"toggleOption(option)\"\n          >\n            <i-checkbox\n              [checked]=\"isOptionSelected(option)\"\n              [readonly]=\"true\"\n              size=\"small\"\n              class=\"i-multi-select-checkbox\"\n            ></i-checkbox>\n            <span class=\"i-multi-select-option-label\">\n              {{ getOptionLabel(option) }}\n            </span>\n          </div>\n        }\n\n        @if (filteredOptions().length === 0) {\n          <div class=\"i-multi-select-no-options\">No options found</div>\n        }\n      </div>\n    </div>\n  }\n</div>\n", styles: [".i-multi-select-error{color:var(--color-danger)}.i-multi-select-icons-overlay{color:var(--color-text-secondary)}.i-multi-select-dropdown{background:var(--color-component-background);border:1px solid var(--surface-border)}.i-multi-select-dropdown .i-multi-select-filter .i-multi-select-search{border-color:var(--surface-border);background:var(--surface-ground);color:var(--color-text-primary)}.i-multi-select-dropdown .i-multi-select-filter .i-multi-select-search:focus{border-color:var(--color-primary);box-shadow:0 2px 10px #0003}.i-multi-select-dropdown .i-multi-select-options{background:transparent}.i-multi-select-dropdown .i-multi-select-options .i-multi-select-option{color:var(--color-text-primary)}.i-multi-select-dropdown .i-multi-select-options .i-multi-select-option:hover,.i-multi-select-dropdown .i-multi-select-options .i-multi-select-option.selected{background-color:var(--surface-hover)}.i-multi-select-dropdown .i-multi-select-options .i-multi-select-option .i-multi-select-checkbox{accent-color:var(--color-primary)}.i-multi-select-dropdown .i-multi-select-options .i-multi-select-no-options{color:var(--color-text-secondary)}.invalid .i-multi-select-trigger{border-color:var(--color-danger)}.invalid .i-label{color:var(--color-danger)}.i-multi-select-wrapper{position:relative;width:100%}.i-multi-select-wrapper.i-multi-select--fluid{width:100%}.i-multi-select-wrapper .i-multi-select-input-container{display:flow-root;position:relative;cursor:pointer}.i-multi-select-wrapper .i-multi-select-input-container .i-multi-select-chips{position:relative;cursor:pointer}.i-multi-select-wrapper .i-multi-select-input-container .i-multi-select-icons-overlay{position:absolute;top:calc(1.5em + 21px);transform:translateY(-50%);right:4px;z-index:3;display:flex;align-items:center;gap:0;pointer-events:none}.i-multi-select-wrapper .i-multi-select-input-container .i-multi-select-icons-overlay .i-multi-select-arrow-wrapper{width:24px;height:24px;display:inline-flex;align-items:center;justify-content:center}.i-multi-select-wrapper .i-multi-select-input-container .i-multi-select-icons-overlay .i-multi-select-arrow{font-size:.8em;transition:transform .15s ease}.i-multi-select-wrapper .i-multi-select-input-container .i-multi-select-icons-overlay .i-multi-select-arrow.flipped{transform:rotate(180deg)}.i-multi-select-wrapper .i-multi-select-input-container .i-multi-select-error{margin-top:4px;font-size:1em;padding-left:12px}.i-multi-select-wrapper .i-multi-select-dropdown{position:absolute;top:100%;left:0;right:0;z-index:1000;margin-top:4px;margin-bottom:8px;border-radius:4px;box-shadow:0 4px 12px #00000026;overflow:visible}.i-multi-select-wrapper .i-multi-select-dropdown .i-multi-select-filter{padding:8px}.i-multi-select-wrapper .i-multi-select-dropdown .i-multi-select-filter .i-multi-select-search{width:100%;padding:8px;border:1px solid;border-radius:4px;font-size:1em;outline:none}.i-multi-select-wrapper .i-multi-select-dropdown .i-multi-select-options{max-height:min(160px,100vh - 150px);padding-right:2px;overflow-x:hidden;overflow-y:auto;border-radius:0 0 4px 4px}.i-multi-select-wrapper .i-multi-select-dropdown .i-multi-select-options::-webkit-scrollbar-track{background:var(--scrollbar-track, transparent);border-radius:var(--scrollbar-radius, 3px)}.i-multi-select-wrapper .i-multi-select-dropdown .i-multi-select-options::-webkit-scrollbar-thumb{background:#0003;border-radius:var(--scrollbar-radius, 3px);transition:background .2s ease}.i-multi-select-wrapper .i-multi-select-dropdown .i-multi-select-options::-webkit-scrollbar-thumb:hover{background:#00000059}.i-multi-select-wrapper .i-multi-select-dropdown .i-multi-select-options::-webkit-scrollbar-thumb:active{background:#00000080}.i-multi-select-wrapper .i-multi-select-dropdown .i-multi-select-options::-webkit-scrollbar-corner{background:transparent}.i-multi-select-wrapper .i-multi-select-dropdown .i-multi-select-options{scrollbar-width:thin;scrollbar-color:rgba(0,0,0,.2) transparent;scroll-behavior:smooth}.i-multi-select-wrapper .i-multi-select-dropdown .i-multi-select-options::-webkit-scrollbar-thumb{background:var(--scrollbar-thumb, var(--color-text-secondary))}.i-multi-select-wrapper .i-multi-select-dropdown .i-multi-select-options{scrollbar-color:var(--scrollbar-thumb, var(--color-text-secondary)) var(--scrollbar-track, transparent)}.i-multi-select-wrapper .i-multi-select-dropdown .i-multi-select-options::-webkit-scrollbar{width:var(--scrollbar-size, 6px);height:var(--scrollbar-size, 6px)}.i-multi-select-wrapper .i-multi-select-dropdown .i-multi-select-options::-webkit-scrollbar-track{background:var(--scrollbar-track-dropdown, rgba(0, 0, 0, .05));border-radius:var(--scrollbar-radius, 3px);margin:2px 0}.i-multi-select-wrapper .i-multi-select-dropdown .i-multi-select-options::-webkit-scrollbar-thumb{border-radius:var(--scrollbar-radius, 3px);min-height:20px;background:var(--scrollbar-thumb, var(--color-text-secondary))}.i-multi-select-wrapper .i-multi-select-dropdown .i-multi-select-options::-webkit-scrollbar-thumb:hover{background:var(--scrollbar-thumb-hover, var(--color-text-primary))}.i-multi-select-wrapper .i-multi-select-dropdown .i-multi-select-options::-webkit-scrollbar-thumb:active{background:var(--scrollbar-thumb-active, var(--color-primary))}.i-multi-select-wrapper .i-multi-select-dropdown .i-multi-select-options{scrollbar-width:thin;scrollbar-color:var(--scrollbar-thumb, var(--color-text-secondary)) var(--scrollbar-track-dropdown, rgba(0, 0, 0, .05))}.i-multi-select-wrapper .i-multi-select-dropdown .i-multi-select-options .i-multi-select-option{display:flex;align-items:center;gap:8px;padding:8px 12px;font-size:1em;cursor:pointer;transition:background-color .15s ease}.i-multi-select-wrapper .i-multi-select-dropdown .i-multi-select-options .i-multi-select-option.selected{font-weight:500}.i-multi-select-wrapper .i-multi-select-dropdown .i-multi-select-options .i-multi-select-option .i-multi-select-checkbox{pointer-events:none}.i-multi-select-wrapper .i-multi-select-dropdown .i-multi-select-options .i-multi-select-option .i-multi-select-option-label{flex:1}.i-multi-select-wrapper .i-multi-select-dropdown .i-multi-select-options .i-multi-select-no-options{padding:12px;font-style:italic;text-align:center;opacity:.6}\n"] }]
         }], ctorParameters: () => [{ type: i0.Injector }], propDecorators: { label: [{
                 type: Input
             }], options: [{ type: i0.Input, args: [{ isSignal: true, alias: "options", required: false }] }], optionLabel: [{
@@ -6039,11 +6043,11 @@ class IPanel {
         this.onToggle.emit(this.collapsed);
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: IPanel, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.12", type: IPanel, isStandalone: true, selector: "i-panel", inputs: { header: "header", collapsed: "collapsed", toggleable: "toggleable" }, outputs: { collapsedChange: "collapsedChange", onToggle: "onToggle" }, ngImport: i0, template: "<div\n  class=\"i-panel\"\n  [class.i-panel--collapsed]=\"collapsed\"\n  [class.i-panel--toggleable]=\"toggleable\"\n  [attr.id]=\"componentId\"\n>\n  <div class=\"i-panel-header-wrap\">\n    @if (toggleable) {\n      <button\n        class=\"i-panel-header\"\n        type=\"button\"\n        (click)=\"toggle()\"\n        [attr.aria-expanded]=\"!collapsed\"\n      >\n        <i\n          class=\"i-panel-toggle-icon pi\"\n          [class.pi-minus]=\"!collapsed\"\n          [class.pi-plus]=\"collapsed\"\n          aria-hidden=\"true\"\n        ></i>\n        <span class=\"i-panel-title\">{{ header }}</span>\n      </button>\n    }\n    @if (!toggleable) {\n      <div class=\"i-panel-header\">\n        <i class=\"i-panel-toggle-icon\" aria-hidden=\"true\"></i>\n        <span class=\"i-panel-title\">{{ header }}</span>\n      </div>\n    }\n  </div>\n  <div\n    class=\"i-panel-content-wrapper\"\n    [class.i-panel-content-wrapper--collapsed]=\"collapsed\"\n  >\n    <div class=\"i-panel-content\">\n      <ng-content></ng-content>\n    </div>\n  </div>\n</div>\n", styles: [".i-panel{background:var(--surface-card);color:var(--color-text-primary);border:1px solid var(--surface-border)}.i-panel .i-panel-header{color:var(--color-text-secondary);background:var(--surface-card)}.i-panel .i-panel-header .i-panel-toggle-icon{color:var(--color-primary)}.i-panel .i-panel-header .i-panel-title{color:var(--color-text-secondary)}.i-panel.i-panel--toggleable .i-panel-header:hover{background:var(--surface-hover)}.i-panel .i-panel-content{color:var(--color-text-primary)}.i-panel{border-radius:8px;overflow:visible;position:relative;padding-top:14px;min-height:48px}.i-panel .i-panel-header-wrap{position:absolute;top:0;left:0;right:0;height:0;z-index:1}.i-panel .i-panel-header-wrap .i-panel-header{display:inline-flex;flex-direction:row;align-items:center;gap:8px;position:relative;top:0;transform:translateY(-50%);padding:4px 12px;margin-left:20px;background:var(--surface-card);-webkit-user-select:none;user-select:none;transition:background-color .2s ease}.i-panel .i-panel-header-wrap .i-panel-header.i-panel-header:where(button){border:none;background:var(--surface-card);cursor:pointer;padding:4px 12px;font-family:inherit;color:inherit}.i-panel .i-panel-header-wrap .i-panel-header .i-panel-toggle-icon{font-size:12px;font-weight:600;display:inline-block}.i-panel .i-panel-header-wrap .i-panel-header .i-panel-title{font-weight:500;font-size:1em;line-height:1;display:inline-block;white-space:nowrap}.i-panel .i-panel-content-wrapper{overflow:visible;transition:max-height .3s ease,opacity .2s ease;max-height:1000px;opacity:1}.i-panel .i-panel-content-wrapper.i-panel-content-wrapper--collapsed{max-height:0;opacity:0;overflow:hidden}.i-panel .i-panel-content{padding:16px}\n"] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.12", type: IPanel, isStandalone: true, selector: "i-panel", inputs: { header: "header", collapsed: "collapsed", toggleable: "toggleable" }, outputs: { collapsedChange: "collapsedChange", onToggle: "onToggle" }, ngImport: i0, template: "<div\n  class=\"i-panel\"\n  [class.i-panel--collapsed]=\"collapsed\"\n  [class.i-panel--toggleable]=\"toggleable\"\n  [attr.id]=\"componentId\"\n>\n  <div class=\"i-panel-header-wrap\">\n    @if (toggleable) {\n      <button\n        class=\"i-panel-header\"\n        type=\"button\"\n        (click)=\"toggle()\"\n        [attr.aria-expanded]=\"!collapsed\"\n      >\n        <i\n          class=\"i-panel-toggle-icon pi\"\n          [class.pi-minus]=\"!collapsed\"\n          [class.pi-plus]=\"collapsed\"\n          aria-hidden=\"true\"\n        ></i>\n        <span class=\"i-panel-title\">{{ header }}</span>\n      </button>\n    }\n    @if (!toggleable) {\n      <div class=\"i-panel-header\">\n        <i class=\"i-panel-toggle-icon\" aria-hidden=\"true\"></i>\n        <span class=\"i-panel-title\">{{ header }}</span>\n      </div>\n    }\n  </div>\n  <div\n    class=\"i-panel-content-wrapper\"\n    [class.i-panel-content-wrapper--collapsed]=\"collapsed\"\n  >\n    <div class=\"i-panel-content\">\n      <ng-content></ng-content>\n    </div>\n  </div>\n</div>\n", styles: [".i-panel{background:var(--surface-card);color:var(--color-text-primary);border:1px solid var(--surface-border)}.i-panel .i-panel-header{color:var(--color-text-secondary);background:transparent}.i-panel .i-panel-header .i-panel-toggle-icon{color:var(--color-primary)}.i-panel .i-panel-header .i-panel-title{color:inherit}.i-panel.i-panel--toggleable .i-panel-header:hover{color:var(--color-primary)}.i-panel .i-panel-content{color:var(--color-text-primary)}.i-panel{border-radius:8px;overflow:visible;position:relative;margin-top:2em;padding-top:0;min-height:48px}.i-panel .i-panel-header-wrap{position:absolute;top:0;left:0;right:0;height:0;z-index:1}.i-panel .i-panel-header-wrap .i-panel-header{display:inline-flex;flex-direction:row;align-items:center;gap:8px;position:relative;top:-4px;transform:translateY(-100%);max-width:calc(100% - 40px);box-sizing:border-box;padding:4px 12px;margin-left:20px;background:transparent;-webkit-user-select:none;user-select:none;transition:color .2s ease}.i-panel .i-panel-header-wrap .i-panel-header.i-panel-header:where(button){border:none;background:transparent;cursor:pointer;padding:4px 12px;font-family:inherit}.i-panel .i-panel-header-wrap .i-panel-header .i-panel-toggle-icon{font-size:12px;font-weight:600;display:inline-block;flex-shrink:0}.i-panel .i-panel-header-wrap .i-panel-header .i-panel-title{font-weight:500;font-size:1em;line-height:1;display:inline-block;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.i-panel .i-panel-content-wrapper{overflow:visible;transition:max-height .3s ease,opacity .2s ease;max-height:1000px;opacity:1}.i-panel .i-panel-content-wrapper.i-panel-content-wrapper--collapsed{max-height:0;opacity:0;overflow:hidden}.i-panel .i-panel-content{padding:16px}\n"] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: IPanel, decorators: [{
             type: Component,
-            args: [{ selector: 'i-panel', template: "<div\n  class=\"i-panel\"\n  [class.i-panel--collapsed]=\"collapsed\"\n  [class.i-panel--toggleable]=\"toggleable\"\n  [attr.id]=\"componentId\"\n>\n  <div class=\"i-panel-header-wrap\">\n    @if (toggleable) {\n      <button\n        class=\"i-panel-header\"\n        type=\"button\"\n        (click)=\"toggle()\"\n        [attr.aria-expanded]=\"!collapsed\"\n      >\n        <i\n          class=\"i-panel-toggle-icon pi\"\n          [class.pi-minus]=\"!collapsed\"\n          [class.pi-plus]=\"collapsed\"\n          aria-hidden=\"true\"\n        ></i>\n        <span class=\"i-panel-title\">{{ header }}</span>\n      </button>\n    }\n    @if (!toggleable) {\n      <div class=\"i-panel-header\">\n        <i class=\"i-panel-toggle-icon\" aria-hidden=\"true\"></i>\n        <span class=\"i-panel-title\">{{ header }}</span>\n      </div>\n    }\n  </div>\n  <div\n    class=\"i-panel-content-wrapper\"\n    [class.i-panel-content-wrapper--collapsed]=\"collapsed\"\n  >\n    <div class=\"i-panel-content\">\n      <ng-content></ng-content>\n    </div>\n  </div>\n</div>\n", styles: [".i-panel{background:var(--surface-card);color:var(--color-text-primary);border:1px solid var(--surface-border)}.i-panel .i-panel-header{color:var(--color-text-secondary);background:var(--surface-card)}.i-panel .i-panel-header .i-panel-toggle-icon{color:var(--color-primary)}.i-panel .i-panel-header .i-panel-title{color:var(--color-text-secondary)}.i-panel.i-panel--toggleable .i-panel-header:hover{background:var(--surface-hover)}.i-panel .i-panel-content{color:var(--color-text-primary)}.i-panel{border-radius:8px;overflow:visible;position:relative;padding-top:14px;min-height:48px}.i-panel .i-panel-header-wrap{position:absolute;top:0;left:0;right:0;height:0;z-index:1}.i-panel .i-panel-header-wrap .i-panel-header{display:inline-flex;flex-direction:row;align-items:center;gap:8px;position:relative;top:0;transform:translateY(-50%);padding:4px 12px;margin-left:20px;background:var(--surface-card);-webkit-user-select:none;user-select:none;transition:background-color .2s ease}.i-panel .i-panel-header-wrap .i-panel-header.i-panel-header:where(button){border:none;background:var(--surface-card);cursor:pointer;padding:4px 12px;font-family:inherit;color:inherit}.i-panel .i-panel-header-wrap .i-panel-header .i-panel-toggle-icon{font-size:12px;font-weight:600;display:inline-block}.i-panel .i-panel-header-wrap .i-panel-header .i-panel-title{font-weight:500;font-size:1em;line-height:1;display:inline-block;white-space:nowrap}.i-panel .i-panel-content-wrapper{overflow:visible;transition:max-height .3s ease,opacity .2s ease;max-height:1000px;opacity:1}.i-panel .i-panel-content-wrapper.i-panel-content-wrapper--collapsed{max-height:0;opacity:0;overflow:hidden}.i-panel .i-panel-content{padding:16px}\n"] }]
+            args: [{ selector: 'i-panel', template: "<div\n  class=\"i-panel\"\n  [class.i-panel--collapsed]=\"collapsed\"\n  [class.i-panel--toggleable]=\"toggleable\"\n  [attr.id]=\"componentId\"\n>\n  <div class=\"i-panel-header-wrap\">\n    @if (toggleable) {\n      <button\n        class=\"i-panel-header\"\n        type=\"button\"\n        (click)=\"toggle()\"\n        [attr.aria-expanded]=\"!collapsed\"\n      >\n        <i\n          class=\"i-panel-toggle-icon pi\"\n          [class.pi-minus]=\"!collapsed\"\n          [class.pi-plus]=\"collapsed\"\n          aria-hidden=\"true\"\n        ></i>\n        <span class=\"i-panel-title\">{{ header }}</span>\n      </button>\n    }\n    @if (!toggleable) {\n      <div class=\"i-panel-header\">\n        <i class=\"i-panel-toggle-icon\" aria-hidden=\"true\"></i>\n        <span class=\"i-panel-title\">{{ header }}</span>\n      </div>\n    }\n  </div>\n  <div\n    class=\"i-panel-content-wrapper\"\n    [class.i-panel-content-wrapper--collapsed]=\"collapsed\"\n  >\n    <div class=\"i-panel-content\">\n      <ng-content></ng-content>\n    </div>\n  </div>\n</div>\n", styles: [".i-panel{background:var(--surface-card);color:var(--color-text-primary);border:1px solid var(--surface-border)}.i-panel .i-panel-header{color:var(--color-text-secondary);background:transparent}.i-panel .i-panel-header .i-panel-toggle-icon{color:var(--color-primary)}.i-panel .i-panel-header .i-panel-title{color:inherit}.i-panel.i-panel--toggleable .i-panel-header:hover{color:var(--color-primary)}.i-panel .i-panel-content{color:var(--color-text-primary)}.i-panel{border-radius:8px;overflow:visible;position:relative;margin-top:2em;padding-top:0;min-height:48px}.i-panel .i-panel-header-wrap{position:absolute;top:0;left:0;right:0;height:0;z-index:1}.i-panel .i-panel-header-wrap .i-panel-header{display:inline-flex;flex-direction:row;align-items:center;gap:8px;position:relative;top:-4px;transform:translateY(-100%);max-width:calc(100% - 40px);box-sizing:border-box;padding:4px 12px;margin-left:20px;background:transparent;-webkit-user-select:none;user-select:none;transition:color .2s ease}.i-panel .i-panel-header-wrap .i-panel-header.i-panel-header:where(button){border:none;background:transparent;cursor:pointer;padding:4px 12px;font-family:inherit}.i-panel .i-panel-header-wrap .i-panel-header .i-panel-toggle-icon{font-size:12px;font-weight:600;display:inline-block;flex-shrink:0}.i-panel .i-panel-header-wrap .i-panel-header .i-panel-title{font-weight:500;font-size:1em;line-height:1;display:inline-block;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.i-panel .i-panel-content-wrapper{overflow:visible;transition:max-height .3s ease,opacity .2s ease;max-height:1000px;opacity:1}.i-panel .i-panel-content-wrapper.i-panel-content-wrapper--collapsed{max-height:0;opacity:0;overflow:hidden}.i-panel .i-panel-content{padding:16px}\n"] }]
         }], propDecorators: { header: [{
                 type: Input
             }], collapsed: [{