@festo-ui/angular 9.0.1-dev.799 → 9.0.1-dev.802

package/fesm2022/festo-ui-angular.mjs

@@ -3218,9 +3218,6 @@ class FngTextInputComponent {
         if (this.onChange != null) {
             this.onChange(value);
         }
-        if (this.onTouched != null) {
-            this.onTouched();
-        }
     }
     get required() {
         return this.innerRequired;
@@ -3273,6 +3270,9 @@ class FngTextInputComponent {
         if (this.focused) {
             this.focused = false;
         }
+        if (this.onTouched != null) {
+            this.onTouched();
+        }
     }
     /**
      * Sets the disabled state.
@@ -3289,7 +3289,7 @@ class FngTextInputComponent {
                 useExisting: forwardRef(() => FngTextInputComponent),
                 multi: true
             }
-        ], viewQueries: [{ propertyName: "inputElement", first: true, predicate: ["inputElement"], descendants: true }], ngImport: i0, template: "<label class=\"fwe-input-text\" [class.fwe-no-pointer-events]=\"readonly === true\" [ngClass]=\"{ 'fng-input-text--with-icon': showValidationIcons }\">\n  <input\n    #inputElement\n    [disabled]=\"disabled\"\n    [required]=\"required === true || false\"\n    [attr.readonly]=\"readonly === true || null\"\n    [attr.placeholder]=\"placeholder || null\"\n    [attr.type]=\"type\"\n    [attr.step]=\"step\"\n    [attr.min]=\"min\"\n    [attr.max]=\"max\"\n    [attr.name]=\"name || null\"\n    [attr.tabindex]=\"tabindex\"\n    [class.fng-has-value]=\"value != null && value !== ''\"\n    autocomplete=\"off\"\n    (focus)=\"onFocus()\"\n    [(ngModel)]=\"value\"\n    (blur)=\"onBlur()\"\n  />\n  <span class=\"fwe-input-text-label\">{{ label }}</span>\n  @if (hint) {\n  <span class=\"fwe-input-text-info\">{{ hint }}</span>\n  } @else {\n  <span class=\"fwe-input-text-info fng-projected\"><ng-content select=\".fng-hint\"></ng-content></span>\n  } @if (error) {\n  <span class=\"fwe-input-text-invalid\">{{ error }}</span>\n  } @else {\n  <span class=\"fwe-input-text-invalid fng-projected\"><ng-content select=\".fng-error\"></ng-content></span>\n  } @if(showValidationIcons){\n  <i class=\"fng-icon-svg-validation-state\" aria-hidden=\"true\"></i>\n  }\n</label>\n", styles: ["fng-text-input:not(.ng-pristine).ng-invalid label.fwe-input-text input[type=text],fng-text-input:not(.ng-pristine).ng-invalid label.fwe-input-text input[type=password],fng-text-input:not(.ng-pristine).ng-invalid label.fwe-input-text input[type=date],fng-text-input:not(.ng-pristine).ng-invalid label.fwe-input-text input[type=datetime-local],fng-text-input:not(.ng-pristine).ng-invalid label.fwe-input-text input[type=number]{border-bottom:1px solid var(--fwe-red)!important;box-shadow:none;outline:none}fng-text-input:not(.ng-pristine).ng-invalid label.fwe-input-text input[type=text]:focus,fng-text-input:not(.ng-pristine).ng-invalid label.fwe-input-text input[type=password]:focus,fng-text-input:not(.ng-pristine).ng-invalid label.fwe-input-text input[type=date]:focus,fng-text-input:not(.ng-pristine).ng-invalid label.fwe-input-text input[type=datetime-local]:focus,fng-text-input:not(.ng-pristine).ng-invalid label.fwe-input-text input[type=number]:focus{border-bottom:1px solid var(--fwe-red)!important}fng-text-input:not(.ng-pristine).ng-invalid label.fwe-input-text input[type=text]:disabled,fng-text-input:not(.ng-pristine).ng-invalid label.fwe-input-text input[type=password]:disabled,fng-text-input:not(.ng-pristine).ng-invalid label.fwe-input-text input[type=date]:disabled,fng-text-input:not(.ng-pristine).ng-invalid label.fwe-input-text input[type=datetime-local]:disabled,fng-text-input:not(.ng-pristine).ng-invalid label.fwe-input-text input[type=number]:disabled{border-bottom:1px solid var(--fwe-control-disabled)!important}fng-text-input:not(.ng-pristine).ng-invalid label.fwe-input-text input[type=text]:disabled~.fwe-input-text-label,fng-text-input:not(.ng-pristine).ng-invalid label.fwe-input-text input[type=text]:disabled~.fwe-input-text-invalid,fng-text-input:not(.ng-pristine).ng-invalid label.fwe-input-text input[type=text]:disabled~.fwe-input-text-info,fng-text-input:not(.ng-pristine).ng-invalid label.fwe-input-text input[type=password]:disabled~.fwe-input-text-label,fng-text-input:not(.ng-pristine).ng-invalid label.fwe-input-text input[type=password]:disabled~.fwe-input-text-invalid,fng-text-input:not(.ng-pristine).ng-invalid label.fwe-input-text input[type=password]:disabled~.fwe-input-text-info,fng-text-input:not(.ng-pristine).ng-invalid label.fwe-input-text input[type=date]:disabled~.fwe-input-text-label,fng-text-input:not(.ng-pristine).ng-invalid label.fwe-input-text input[type=date]:disabled~.fwe-input-text-invalid,fng-text-input:not(.ng-pristine).ng-invalid label.fwe-input-text input[type=date]:disabled~.fwe-input-text-info,fng-text-input:not(.ng-pristine).ng-invalid label.fwe-input-text input[type=datetime-local]:disabled~.fwe-input-text-label,fng-text-input:not(.ng-pristine).ng-invalid label.fwe-input-text input[type=datetime-local]:disabled~.fwe-input-text-invalid,fng-text-input:not(.ng-pristine).ng-invalid label.fwe-input-text input[type=datetime-local]:disabled~.fwe-input-text-info,fng-text-input:not(.ng-pristine).ng-invalid label.fwe-input-text input[type=number]:disabled~.fwe-input-text-label,fng-text-input:not(.ng-pristine).ng-invalid label.fwe-input-text input[type=number]:disabled~.fwe-input-text-invalid,fng-text-input:not(.ng-pristine).ng-invalid label.fwe-input-text input[type=number]:disabled~.fwe-input-text-info{color:var(--fwe-text-disabled)}fng-text-input:not(.ng-pristine).ng-invalid label.fwe-input-text .fwe-input-text-info{display:none!important}fng-text-input:not(.ng-pristine).ng-invalid label.fwe-input-text .fwe-input-text-invalid{display:block!important}fng-text-input.ng-valid label.fwe-input-text input[type=text]:hover:not(:disabled),fng-text-input.ng-valid label.fwe-input-text input[type=password]:hover:not(:disabled),fng-text-input.ng-valid label.fwe-input-text input[type=date]:hover:not(:disabled),fng-text-input.ng-valid label.fwe-input-text input[type=time]:hover:not(:disabled),fng-text-input.ng-valid label.fwe-input-text input[type=datetime-local]:hover:not(:disabled),fng-text-input.ng-valid label.fwe-input-text input[type=number]:hover:not(:disabled){border-bottom:1px solid var(--fwe-hero)!important}fng-text-input label.fwe-input-text.fwe-no-pointer-events{pointer-events:none!important}fng-text-input label.fwe-input-text:has(input:disabled){cursor:not-allowed!important}.fwe-input-text-invalid.fng-projected:empty{display:none}.fwe-input-text-info.fng-projected:empty{display:none}.fng-input-text--with-icon input{padding-right:24px}.fng-input-text--with-icon i{position:absolute;line-height:1;bottom:26px;right:4px;height:16px;width:16px;visibility:hidden}.fng-input-text--with-icon input.ng-valid.ng-touched~i.fng-icon-svg-validation-state{visibility:visible;background-image:url(\"data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='13' height='10' viewBox='0 0 13 10' fill='none'><path d='M4.207 9.621L0 5.414L1.414 4L4.207 6.793L11 0L12.414 1.414L4.207 9.621Z' fill='%230091DC'/></svg>\");background-repeat:no-repeat;background-size:13px 13px;background-position:center center}.fng-input-text--with-icon input.ng-invalid.ng-touched:not(.ng-pristine)~i.fng-icon-svg-validation-state{visibility:visible;background-image:url(\"data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='10' height='10' viewBox='0 0 10 10' fill='none'><path d='M9.9 1.414L8.486 0L4.95 3.536L1.414 0L0 1.414L3.536 4.95L0 8.486L1.414 9.9L4.95 6.364L8.486 9.9L9.9 8.486L6.364 4.95L9.9 1.414Z' fill='%23D50000'/></svg>\");background-repeat:no-repeat;background-position:center center;background-size:10px 10px}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], encapsulation: i0.ViewEncapsulation.None }); }
+        ], viewQueries: [{ propertyName: "inputElement", first: true, predicate: ["inputElement"], descendants: true }], ngImport: i0, template: "<label class=\"fwe-input-text\" [class.fwe-no-pointer-events]=\"readonly === true\" [ngClass]=\"{ 'fng-input-text--with-icon': showValidationIcons }\">\n  <input\n    #inputElement\n    [disabled]=\"disabled\"\n    [required]=\"required === true || false\"\n    [attr.readonly]=\"readonly === true || null\"\n    [attr.placeholder]=\"placeholder || null\"\n    [attr.type]=\"type\"\n    [attr.step]=\"step\"\n    [attr.min]=\"min\"\n    [attr.max]=\"max\"\n    [attr.name]=\"name || null\"\n    [attr.tabindex]=\"tabindex\"\n    [class.fng-has-value]=\"value != null && value !== ''\"\n    autocomplete=\"off\"\n    (focus)=\"onFocus()\"\n    [(ngModel)]=\"value\"\n    (blur)=\"onBlur()\"\n  />\n  <span class=\"fwe-input-text-label\">{{ label }}</span>\n  @if (hint) {\n  <span class=\"fwe-input-text-info\">{{ hint }}</span>\n  } @else {\n  <span class=\"fwe-input-text-info fng-projected\"><ng-content select=\".fng-hint\"></ng-content></span>\n  } @if (error) {\n  <span class=\"fwe-input-text-invalid\">{{ error }}</span>\n  } @else {\n  <span class=\"fwe-input-text-invalid fng-projected\"><ng-content select=\".fng-error\"></ng-content></span>\n  } @if(showValidationIcons){\n  <i class=\"fng-icon-svg-validation-state\" aria-hidden=\"true\"></i>\n  }\n</label>\n", styles: ["fng-text-input:not(.ng-pristine).ng-invalid.ng-touched label.fwe-input-text input[type=text],fng-text-input:not(.ng-pristine).ng-invalid.ng-touched label.fwe-input-text input[type=password],fng-text-input:not(.ng-pristine).ng-invalid.ng-touched label.fwe-input-text input[type=date],fng-text-input:not(.ng-pristine).ng-invalid.ng-touched label.fwe-input-text input[type=datetime-local],fng-text-input:not(.ng-pristine).ng-invalid.ng-touched label.fwe-input-text input[type=number]{border-bottom:1px solid var(--fwe-red)!important;box-shadow:none;outline:none}fng-text-input:not(.ng-pristine).ng-invalid.ng-touched label.fwe-input-text input[type=text]:focus,fng-text-input:not(.ng-pristine).ng-invalid.ng-touched label.fwe-input-text input[type=password]:focus,fng-text-input:not(.ng-pristine).ng-invalid.ng-touched label.fwe-input-text input[type=date]:focus,fng-text-input:not(.ng-pristine).ng-invalid.ng-touched label.fwe-input-text input[type=datetime-local]:focus,fng-text-input:not(.ng-pristine).ng-invalid.ng-touched label.fwe-input-text input[type=number]:focus{border-bottom:1px solid var(--fwe-red)!important}fng-text-input:not(.ng-pristine).ng-invalid.ng-touched label.fwe-input-text input[type=text]:disabled,fng-text-input:not(.ng-pristine).ng-invalid.ng-touched label.fwe-input-text input[type=password]:disabled,fng-text-input:not(.ng-pristine).ng-invalid.ng-touched label.fwe-input-text input[type=date]:disabled,fng-text-input:not(.ng-pristine).ng-invalid.ng-touched label.fwe-input-text input[type=datetime-local]:disabled,fng-text-input:not(.ng-pristine).ng-invalid.ng-touched label.fwe-input-text input[type=number]:disabled{border-bottom:1px solid var(--fwe-control-disabled)!important}fng-text-input:not(.ng-pristine).ng-invalid.ng-touched label.fwe-input-text input[type=text]:disabled~.fwe-input-text-label,fng-text-input:not(.ng-pristine).ng-invalid.ng-touched label.fwe-input-text input[type=text]:disabled~.fwe-input-text-invalid,fng-text-input:not(.ng-pristine).ng-invalid.ng-touched label.fwe-input-text input[type=text]:disabled~.fwe-input-text-info,fng-text-input:not(.ng-pristine).ng-invalid.ng-touched label.fwe-input-text input[type=password]:disabled~.fwe-input-text-label,fng-text-input:not(.ng-pristine).ng-invalid.ng-touched label.fwe-input-text input[type=password]:disabled~.fwe-input-text-invalid,fng-text-input:not(.ng-pristine).ng-invalid.ng-touched label.fwe-input-text input[type=password]:disabled~.fwe-input-text-info,fng-text-input:not(.ng-pristine).ng-invalid.ng-touched label.fwe-input-text input[type=date]:disabled~.fwe-input-text-label,fng-text-input:not(.ng-pristine).ng-invalid.ng-touched label.fwe-input-text input[type=date]:disabled~.fwe-input-text-invalid,fng-text-input:not(.ng-pristine).ng-invalid.ng-touched label.fwe-input-text input[type=date]:disabled~.fwe-input-text-info,fng-text-input:not(.ng-pristine).ng-invalid.ng-touched label.fwe-input-text input[type=datetime-local]:disabled~.fwe-input-text-label,fng-text-input:not(.ng-pristine).ng-invalid.ng-touched label.fwe-input-text input[type=datetime-local]:disabled~.fwe-input-text-invalid,fng-text-input:not(.ng-pristine).ng-invalid.ng-touched label.fwe-input-text input[type=datetime-local]:disabled~.fwe-input-text-info,fng-text-input:not(.ng-pristine).ng-invalid.ng-touched label.fwe-input-text input[type=number]:disabled~.fwe-input-text-label,fng-text-input:not(.ng-pristine).ng-invalid.ng-touched label.fwe-input-text input[type=number]:disabled~.fwe-input-text-invalid,fng-text-input:not(.ng-pristine).ng-invalid.ng-touched label.fwe-input-text input[type=number]:disabled~.fwe-input-text-info{color:var(--fwe-text-disabled)}fng-text-input:not(.ng-pristine).ng-invalid.ng-touched label.fwe-input-text .fwe-input-text-info{display:none!important}fng-text-input:not(.ng-pristine).ng-invalid.ng-touched label.fwe-input-text .fwe-input-text-invalid{display:block!important}fng-text-input.ng-valid label.fwe-input-text input[type=text]:hover:not(:disabled),fng-text-input.ng-valid label.fwe-input-text input[type=password]:hover:not(:disabled),fng-text-input.ng-valid label.fwe-input-text input[type=date]:hover:not(:disabled),fng-text-input.ng-valid label.fwe-input-text input[type=time]:hover:not(:disabled),fng-text-input.ng-valid label.fwe-input-text input[type=datetime-local]:hover:not(:disabled),fng-text-input.ng-valid label.fwe-input-text input[type=number]:hover:not(:disabled){border-bottom:1px solid var(--fwe-hero)!important}fng-text-input label.fwe-input-text.fwe-no-pointer-events{pointer-events:none!important}fng-text-input label.fwe-input-text:has(input:disabled){cursor:not-allowed!important}.fwe-input-text-invalid.fng-projected:empty{display:none}.fwe-input-text-info.fng-projected:empty{display:none}.fng-input-text--with-icon input{padding-right:24px}.fng-input-text--with-icon i{position:absolute;line-height:1;bottom:26px;right:4px;height:16px;width:16px;visibility:hidden}fng-text-input.ng-valid.ng-touched .fng-input-text--with-icon i.fng-icon-svg-validation-state{visibility:visible;background-image:url(\"data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='13' height='10' viewBox='0 0 13 10' fill='none'><path d='M4.207 9.621L0 5.414L1.414 4L4.207 6.793L11 0L12.414 1.414L4.207 9.621Z' fill='%230091DC'/></svg>\");background-repeat:no-repeat;background-size:13px 13px;background-position:center center}fng-text-input.ng-invalid.ng-touched:not(.ng-pristine) .fng-input-text--with-icon i.fng-icon-svg-validation-state{visibility:visible;background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIj48cGF0aCBkPSJNMTYuOTUgOC40NjQwNUwxNS41MzYgNy4wNTAwNUwxMiAxMC41ODZMOC40NjQwNSA3LjA1MDA1TDcuMDUwMDUgOC40NjQwNUwxMC41ODYgMTJMNy4wNTAwNSAxNS41MzZMOC40NjQwNSAxNi45NUwxMiAxMy40MTRMMTUuNTM2IDE2Ljk1TDE2Ljk1IDE1LjUzNkwxMy40MTQgMTJMMTYuOTUgOC40NjQwNVoiIGZpbGw9IiNENTAwMDAiLz48L3N2Zz4=);background-repeat:no-repeat;background-position:center center;background-size:24px 24px}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: FngTextInputComponent, decorators: [{
             type: Component,
@@ -3299,7 +3299,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImpo
                             useExisting: forwardRef(() => FngTextInputComponent),
                             multi: true
                         }
-                    ], encapsulation: ViewEncapsulation.None, template: "<label class=\"fwe-input-text\" [class.fwe-no-pointer-events]=\"readonly === true\" [ngClass]=\"{ 'fng-input-text--with-icon': showValidationIcons }\">\n  <input\n    #inputElement\n    [disabled]=\"disabled\"\n    [required]=\"required === true || false\"\n    [attr.readonly]=\"readonly === true || null\"\n    [attr.placeholder]=\"placeholder || null\"\n    [attr.type]=\"type\"\n    [attr.step]=\"step\"\n    [attr.min]=\"min\"\n    [attr.max]=\"max\"\n    [attr.name]=\"name || null\"\n    [attr.tabindex]=\"tabindex\"\n    [class.fng-has-value]=\"value != null && value !== ''\"\n    autocomplete=\"off\"\n    (focus)=\"onFocus()\"\n    [(ngModel)]=\"value\"\n    (blur)=\"onBlur()\"\n  />\n  <span class=\"fwe-input-text-label\">{{ label }}</span>\n  @if (hint) {\n  <span class=\"fwe-input-text-info\">{{ hint }}</span>\n  } @else {\n  <span class=\"fwe-input-text-info fng-projected\"><ng-content select=\".fng-hint\"></ng-content></span>\n  } @if (error) {\n  <span class=\"fwe-input-text-invalid\">{{ error }}</span>\n  } @else {\n  <span class=\"fwe-input-text-invalid fng-projected\"><ng-content select=\".fng-error\"></ng-content></span>\n  } @if(showValidationIcons){\n  <i class=\"fng-icon-svg-validation-state\" aria-hidden=\"true\"></i>\n  }\n</label>\n", styles: ["fng-text-input:not(.ng-pristine).ng-invalid label.fwe-input-text input[type=text],fng-text-input:not(.ng-pristine).ng-invalid label.fwe-input-text input[type=password],fng-text-input:not(.ng-pristine).ng-invalid label.fwe-input-text input[type=date],fng-text-input:not(.ng-pristine).ng-invalid label.fwe-input-text input[type=datetime-local],fng-text-input:not(.ng-pristine).ng-invalid label.fwe-input-text input[type=number]{border-bottom:1px solid var(--fwe-red)!important;box-shadow:none;outline:none}fng-text-input:not(.ng-pristine).ng-invalid label.fwe-input-text input[type=text]:focus,fng-text-input:not(.ng-pristine).ng-invalid label.fwe-input-text input[type=password]:focus,fng-text-input:not(.ng-pristine).ng-invalid label.fwe-input-text input[type=date]:focus,fng-text-input:not(.ng-pristine).ng-invalid label.fwe-input-text input[type=datetime-local]:focus,fng-text-input:not(.ng-pristine).ng-invalid label.fwe-input-text input[type=number]:focus{border-bottom:1px solid var(--fwe-red)!important}fng-text-input:not(.ng-pristine).ng-invalid label.fwe-input-text input[type=text]:disabled,fng-text-input:not(.ng-pristine).ng-invalid label.fwe-input-text input[type=password]:disabled,fng-text-input:not(.ng-pristine).ng-invalid label.fwe-input-text input[type=date]:disabled,fng-text-input:not(.ng-pristine).ng-invalid label.fwe-input-text input[type=datetime-local]:disabled,fng-text-input:not(.ng-pristine).ng-invalid label.fwe-input-text input[type=number]:disabled{border-bottom:1px solid var(--fwe-control-disabled)!important}fng-text-input:not(.ng-pristine).ng-invalid label.fwe-input-text input[type=text]:disabled~.fwe-input-text-label,fng-text-input:not(.ng-pristine).ng-invalid label.fwe-input-text input[type=text]:disabled~.fwe-input-text-invalid,fng-text-input:not(.ng-pristine).ng-invalid label.fwe-input-text input[type=text]:disabled~.fwe-input-text-info,fng-text-input:not(.ng-pristine).ng-invalid label.fwe-input-text input[type=password]:disabled~.fwe-input-text-label,fng-text-input:not(.ng-pristine).ng-invalid label.fwe-input-text input[type=password]:disabled~.fwe-input-text-invalid,fng-text-input:not(.ng-pristine).ng-invalid label.fwe-input-text input[type=password]:disabled~.fwe-input-text-info,fng-text-input:not(.ng-pristine).ng-invalid label.fwe-input-text input[type=date]:disabled~.fwe-input-text-label,fng-text-input:not(.ng-pristine).ng-invalid label.fwe-input-text input[type=date]:disabled~.fwe-input-text-invalid,fng-text-input:not(.ng-pristine).ng-invalid label.fwe-input-text input[type=date]:disabled~.fwe-input-text-info,fng-text-input:not(.ng-pristine).ng-invalid label.fwe-input-text input[type=datetime-local]:disabled~.fwe-input-text-label,fng-text-input:not(.ng-pristine).ng-invalid label.fwe-input-text input[type=datetime-local]:disabled~.fwe-input-text-invalid,fng-text-input:not(.ng-pristine).ng-invalid label.fwe-input-text input[type=datetime-local]:disabled~.fwe-input-text-info,fng-text-input:not(.ng-pristine).ng-invalid label.fwe-input-text input[type=number]:disabled~.fwe-input-text-label,fng-text-input:not(.ng-pristine).ng-invalid label.fwe-input-text input[type=number]:disabled~.fwe-input-text-invalid,fng-text-input:not(.ng-pristine).ng-invalid label.fwe-input-text input[type=number]:disabled~.fwe-input-text-info{color:var(--fwe-text-disabled)}fng-text-input:not(.ng-pristine).ng-invalid label.fwe-input-text .fwe-input-text-info{display:none!important}fng-text-input:not(.ng-pristine).ng-invalid label.fwe-input-text .fwe-input-text-invalid{display:block!important}fng-text-input.ng-valid label.fwe-input-text input[type=text]:hover:not(:disabled),fng-text-input.ng-valid label.fwe-input-text input[type=password]:hover:not(:disabled),fng-text-input.ng-valid label.fwe-input-text input[type=date]:hover:not(:disabled),fng-text-input.ng-valid label.fwe-input-text input[type=time]:hover:not(:disabled),fng-text-input.ng-valid label.fwe-input-text input[type=datetime-local]:hover:not(:disabled),fng-text-input.ng-valid label.fwe-input-text input[type=number]:hover:not(:disabled){border-bottom:1px solid var(--fwe-hero)!important}fng-text-input label.fwe-input-text.fwe-no-pointer-events{pointer-events:none!important}fng-text-input label.fwe-input-text:has(input:disabled){cursor:not-allowed!important}.fwe-input-text-invalid.fng-projected:empty{display:none}.fwe-input-text-info.fng-projected:empty{display:none}.fng-input-text--with-icon input{padding-right:24px}.fng-input-text--with-icon i{position:absolute;line-height:1;bottom:26px;right:4px;height:16px;width:16px;visibility:hidden}.fng-input-text--with-icon input.ng-valid.ng-touched~i.fng-icon-svg-validation-state{visibility:visible;background-image:url(\"data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='13' height='10' viewBox='0 0 13 10' fill='none'><path d='M4.207 9.621L0 5.414L1.414 4L4.207 6.793L11 0L12.414 1.414L4.207 9.621Z' fill='%230091DC'/></svg>\");background-repeat:no-repeat;background-size:13px 13px;background-position:center center}.fng-input-text--with-icon input.ng-invalid.ng-touched:not(.ng-pristine)~i.fng-icon-svg-validation-state{visibility:visible;background-image:url(\"data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='10' height='10' viewBox='0 0 10 10' fill='none'><path d='M9.9 1.414L8.486 0L4.95 3.536L1.414 0L0 1.414L3.536 4.95L0 8.486L1.414 9.9L4.95 6.364L8.486 9.9L9.9 8.486L6.364 4.95L9.9 1.414Z' fill='%23D50000'/></svg>\");background-repeat:no-repeat;background-position:center center;background-size:10px 10px}\n"] }]
+                    ], encapsulation: ViewEncapsulation.None, template: "<label class=\"fwe-input-text\" [class.fwe-no-pointer-events]=\"readonly === true\" [ngClass]=\"{ 'fng-input-text--with-icon': showValidationIcons }\">\n  <input\n    #inputElement\n    [disabled]=\"disabled\"\n    [required]=\"required === true || false\"\n    [attr.readonly]=\"readonly === true || null\"\n    [attr.placeholder]=\"placeholder || null\"\n    [attr.type]=\"type\"\n    [attr.step]=\"step\"\n    [attr.min]=\"min\"\n    [attr.max]=\"max\"\n    [attr.name]=\"name || null\"\n    [attr.tabindex]=\"tabindex\"\n    [class.fng-has-value]=\"value != null && value !== ''\"\n    autocomplete=\"off\"\n    (focus)=\"onFocus()\"\n    [(ngModel)]=\"value\"\n    (blur)=\"onBlur()\"\n  />\n  <span class=\"fwe-input-text-label\">{{ label }}</span>\n  @if (hint) {\n  <span class=\"fwe-input-text-info\">{{ hint }}</span>\n  } @else {\n  <span class=\"fwe-input-text-info fng-projected\"><ng-content select=\".fng-hint\"></ng-content></span>\n  } @if (error) {\n  <span class=\"fwe-input-text-invalid\">{{ error }}</span>\n  } @else {\n  <span class=\"fwe-input-text-invalid fng-projected\"><ng-content select=\".fng-error\"></ng-content></span>\n  } @if(showValidationIcons){\n  <i class=\"fng-icon-svg-validation-state\" aria-hidden=\"true\"></i>\n  }\n</label>\n", styles: ["fng-text-input:not(.ng-pristine).ng-invalid.ng-touched label.fwe-input-text input[type=text],fng-text-input:not(.ng-pristine).ng-invalid.ng-touched label.fwe-input-text input[type=password],fng-text-input:not(.ng-pristine).ng-invalid.ng-touched label.fwe-input-text input[type=date],fng-text-input:not(.ng-pristine).ng-invalid.ng-touched label.fwe-input-text input[type=datetime-local],fng-text-input:not(.ng-pristine).ng-invalid.ng-touched label.fwe-input-text input[type=number]{border-bottom:1px solid var(--fwe-red)!important;box-shadow:none;outline:none}fng-text-input:not(.ng-pristine).ng-invalid.ng-touched label.fwe-input-text input[type=text]:focus,fng-text-input:not(.ng-pristine).ng-invalid.ng-touched label.fwe-input-text input[type=password]:focus,fng-text-input:not(.ng-pristine).ng-invalid.ng-touched label.fwe-input-text input[type=date]:focus,fng-text-input:not(.ng-pristine).ng-invalid.ng-touched label.fwe-input-text input[type=datetime-local]:focus,fng-text-input:not(.ng-pristine).ng-invalid.ng-touched label.fwe-input-text input[type=number]:focus{border-bottom:1px solid var(--fwe-red)!important}fng-text-input:not(.ng-pristine).ng-invalid.ng-touched label.fwe-input-text input[type=text]:disabled,fng-text-input:not(.ng-pristine).ng-invalid.ng-touched label.fwe-input-text input[type=password]:disabled,fng-text-input:not(.ng-pristine).ng-invalid.ng-touched label.fwe-input-text input[type=date]:disabled,fng-text-input:not(.ng-pristine).ng-invalid.ng-touched label.fwe-input-text input[type=datetime-local]:disabled,fng-text-input:not(.ng-pristine).ng-invalid.ng-touched label.fwe-input-text input[type=number]:disabled{border-bottom:1px solid var(--fwe-control-disabled)!important}fng-text-input:not(.ng-pristine).ng-invalid.ng-touched label.fwe-input-text input[type=text]:disabled~.fwe-input-text-label,fng-text-input:not(.ng-pristine).ng-invalid.ng-touched label.fwe-input-text input[type=text]:disabled~.fwe-input-text-invalid,fng-text-input:not(.ng-pristine).ng-invalid.ng-touched label.fwe-input-text input[type=text]:disabled~.fwe-input-text-info,fng-text-input:not(.ng-pristine).ng-invalid.ng-touched label.fwe-input-text input[type=password]:disabled~.fwe-input-text-label,fng-text-input:not(.ng-pristine).ng-invalid.ng-touched label.fwe-input-text input[type=password]:disabled~.fwe-input-text-invalid,fng-text-input:not(.ng-pristine).ng-invalid.ng-touched label.fwe-input-text input[type=password]:disabled~.fwe-input-text-info,fng-text-input:not(.ng-pristine).ng-invalid.ng-touched label.fwe-input-text input[type=date]:disabled~.fwe-input-text-label,fng-text-input:not(.ng-pristine).ng-invalid.ng-touched label.fwe-input-text input[type=date]:disabled~.fwe-input-text-invalid,fng-text-input:not(.ng-pristine).ng-invalid.ng-touched label.fwe-input-text input[type=date]:disabled~.fwe-input-text-info,fng-text-input:not(.ng-pristine).ng-invalid.ng-touched label.fwe-input-text input[type=datetime-local]:disabled~.fwe-input-text-label,fng-text-input:not(.ng-pristine).ng-invalid.ng-touched label.fwe-input-text input[type=datetime-local]:disabled~.fwe-input-text-invalid,fng-text-input:not(.ng-pristine).ng-invalid.ng-touched label.fwe-input-text input[type=datetime-local]:disabled~.fwe-input-text-info,fng-text-input:not(.ng-pristine).ng-invalid.ng-touched label.fwe-input-text input[type=number]:disabled~.fwe-input-text-label,fng-text-input:not(.ng-pristine).ng-invalid.ng-touched label.fwe-input-text input[type=number]:disabled~.fwe-input-text-invalid,fng-text-input:not(.ng-pristine).ng-invalid.ng-touched label.fwe-input-text input[type=number]:disabled~.fwe-input-text-info{color:var(--fwe-text-disabled)}fng-text-input:not(.ng-pristine).ng-invalid.ng-touched label.fwe-input-text .fwe-input-text-info{display:none!important}fng-text-input:not(.ng-pristine).ng-invalid.ng-touched label.fwe-input-text .fwe-input-text-invalid{display:block!important}fng-text-input.ng-valid label.fwe-input-text input[type=text]:hover:not(:disabled),fng-text-input.ng-valid label.fwe-input-text input[type=password]:hover:not(:disabled),fng-text-input.ng-valid label.fwe-input-text input[type=date]:hover:not(:disabled),fng-text-input.ng-valid label.fwe-input-text input[type=time]:hover:not(:disabled),fng-text-input.ng-valid label.fwe-input-text input[type=datetime-local]:hover:not(:disabled),fng-text-input.ng-valid label.fwe-input-text input[type=number]:hover:not(:disabled){border-bottom:1px solid var(--fwe-hero)!important}fng-text-input label.fwe-input-text.fwe-no-pointer-events{pointer-events:none!important}fng-text-input label.fwe-input-text:has(input:disabled){cursor:not-allowed!important}.fwe-input-text-invalid.fng-projected:empty{display:none}.fwe-input-text-info.fng-projected:empty{display:none}.fng-input-text--with-icon input{padding-right:24px}.fng-input-text--with-icon i{position:absolute;line-height:1;bottom:26px;right:4px;height:16px;width:16px;visibility:hidden}fng-text-input.ng-valid.ng-touched .fng-input-text--with-icon i.fng-icon-svg-validation-state{visibility:visible;background-image:url(\"data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='13' height='10' viewBox='0 0 13 10' fill='none'><path d='M4.207 9.621L0 5.414L1.414 4L4.207 6.793L11 0L12.414 1.414L4.207 9.621Z' fill='%230091DC'/></svg>\");background-repeat:no-repeat;background-size:13px 13px;background-position:center center}fng-text-input.ng-invalid.ng-touched:not(.ng-pristine) .fng-input-text--with-icon i.fng-icon-svg-validation-state{visibility:visible;background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIj48cGF0aCBkPSJNMTYuOTUgOC40NjQwNUwxNS41MzYgNy4wNTAwNUwxMiAxMC41ODZMOC40NjQwNSA3LjA1MDA1TDcuMDUwMDUgOC40NjQwNUwxMC41ODYgMTJMNy4wNTAwNSAxNS41MzZMOC40NjQwNSAxNi45NUwxMiAxMy40MTRMMTUuNTM2IDE2Ljk1TDE2Ljk1IDE1LjUzNkwxMy40MTQgMTJMMTYuOTUgOC40NjQwNVoiIGZpbGw9IiNENTAwMDAiLz48L3N2Zz4=);background-repeat:no-repeat;background-position:center center;background-size:24px 24px}\n"] }]
         }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { label: [{
                 type: Input
             }], showValidationIcons: [{
@@ -5962,6 +5962,12 @@ class FngSelectComponent {
     isEmpty() {
         this.empty = !this.showOptions && (!this._value || '' === this._value);
     }
+    isOptionSelected(index) {
+        if (this.multiple) {
+            return false;
+        }
+        return this.value === this.getOptionValue(index);
+    }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: FngSelectComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: DOCUMENT }, { token: i0.Renderer2 }, { token: i0.DestroyRef }], target: i0.ɵɵFactoryTarget.Component }); }
     static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.15", type: FngSelectComponent, isStandalone: true, selector: "fng-select", inputs: { disabled: "disabled", required: "required", multiple: "multiple", size: "size", options: "options", optionsValueKey: "optionsValueKey", optionsTextKey: "optionsTextKey", optionObjectAsValue: "optionObjectAsValue", error: "error", label: "label", hideLabel: "hideLabel", hint: "hint", resetOption: "resetOption" }, outputs: { fngChange: "fngChange" }, host: { listeners: { "blur": "markAsTouched()" }, properties: { "id": "this.id" } }, providers: [
             {
@@ -5969,7 +5975,7 @@ class FngSelectComponent {
                 useExisting: forwardRef(() => FngSelectComponent),
                 multi: true
             }
-        ], queries: [{ propertyName: "fngSelectOptions", predicate: FngSelectOptionComponent }], viewQueries: [{ propertyName: "elementRef", first: true, predicate: ["div"], descendants: true }], ngImport: i0, template: "<div #div class=\"fwe-select-wrapper\" [class.fwe-disabled]=\"disabled\" [class.fng-hide-label]=\"hideLabel\">\n  <div\n    class=\"fwe-select\"\n    (click)=\"toggle()\"\n    cdkOverlayOrigin\n    #trigger=\"cdkOverlayOrigin\"\n    [class.fwe-focus]=\"showOptions\"\n    [class.fwe-required]=\"required\"\n    [class.fwe-disabled]=\"disabled\"\n    [class.fwe-pty]=\"empty\"\n    >\n    <div class=\"fwe-select-content\">\n      @if (!multiple) {\n        {{ value != null && value | fngChipText: options:optionsValueKey:optionsTextKey }}\n      } @else {\n        <div class=\"fwe-chip-container\">\n          @for (v of value; track v) {\n            <div\n              class=\"fwe-chip chip-text-truncate fwe-pr-4\"\n              [style.max-width.px]=\"triggerWidth\"\n              [title]=\"v | fngChipText: options:optionsValueKey:optionsTextKey\"\n              >\n              {{ v | fngChipText: options:optionsValueKey:optionsTextKey }}\n              <span class=\"chip-removable\" (click)=\"removeChip($event, v)\"></span>\n            </div>\n          }\n        </div>\n      }\n    </div>\n  </div>\n  <ng-template\n    cdkConnectedOverlay\n    cdkConnectedOverlayHasBackdrop\n    cdkConnectedOverlayBackdropClass=\"cdk-overlay-transparent-backdrop\"\n    [cdkConnectedOverlayOrigin]=\"trigger\"\n    [cdkConnectedOverlayMinWidth]=\"triggerWidth\"\n    [cdkConnectedOverlayOpen]=\"showOptions\"\n    [cdkConnectedOverlayPanelClass]=\"selectPanelClasses\"\n    (backdropClick)=\"close()\"\n    (detach)=\"close()\"\n    >\n    <div class=\"fng-select-panel-wrap\">\n      <ul class=\"fwe-select-options-container\">\n        @if (resetOption != null && !multiple) {\n          <li class=\"fwe-select-option\" (click)=\"select(null, $event)\">{{ resetOption }}</li>\n        }\n        @for (option of options; track option; let i = $index) {\n          <li\n            class=\"fwe-select-option\"\n            (click)=\"select(getOptionValue(i), $event)\"\n            [title]=\"getOptionText(i) || option?.text\"\n            >\n            <span class=\"fwe-select-option-content\">\n              @if (multiple) {\n                <span\n                  class=\"fng-select-pseudo-checkbox\"\n                  [ngClass]=\"{ 'fng-select-pseudo-checkbox-checked': checked.get(getOptionValue(i)) === 'checked' }\"\n                ></span>\n              }\n              @if (hasProjectedOptions) {\n                <span [innerHTML]=\"projectedHtml[i]\"></span>\n              } @else {\n                {{ getOptionText(i) || option?.text }}\n              }\n            </span>\n          </li>\n        }\n      </ul>\n    </div>\n  </ng-template>\n  <label class=\"fwe-select-label\" [for]=\"id\" [class.fwe-sr-only]=\"hideLabel\">{{ label }}</label>\n  @if (hint) {\n    <div class=\"fwe-select-description\">\n      {{ hint }}\n    </div>\n  }\n  @if (error) {\n    <div class=\"fwe-select-invalid\">\n      {{ error }}\n    </div>\n  }\n</div>\n<div class=\"fwe-d-none\">\n  <ng-content></ng-content>\n</div>\n", styles: [".fng-select-panel-open .fng-select-panel{opacity:1!important}fng-select{width:auto}fng-select.ng-invalid:not(.ng-pristine) .fwe-select:hover{border-color:var(--fwe-red)}fng-select.ng-invalid:not(.ng-pristine) .fwe-select.fwe-required~.fwe-select-invalid{display:block}fng-select.ng-invalid:not(.ng-pristine) .fwe-select.fwe-required~.fwe-select-description{display:none}.fng-select-panel{opacity:0!important}.fng-select-panel.fng-select-panel-options-3 .fwe-select-options-container{max-height:162px}.fng-select-panel.fng-select-panel-options-4 .fwe-select-options-container{max-height:210px}.fng-select-panel.fng-select-panel-options-5 .fwe-select-options-container{max-height:258px}.fng-select-panel.fng-select-panel-options-6 .fwe-select-options-container{max-height:306px}.fng-select-panel.fng-select-panel-options-7 .fwe-select-options-container{max-height:354px}.fng-select-panel.fng-select-panel-options-8 .fwe-select-options-container{max-height:402px}.fng-select-panel.fng-select-panel-options-9 .fwe-select-options-container{max-height:450px}.fng-select-panel.fng-select-panel-options-10 .fwe-select-options-container{max-height:498px}@-moz-document url-prefix(){.fng-select-panel .fwe-select-options-container{scrollbar-width:thin;scrollbar-color:var(--fwe-control-scrollbar) transparent}}@media (pointer: fine){.fng-select-panel .fwe-select-options-container::-webkit-scrollbar{width:14px}.fng-select-panel .fwe-select-options-container::-webkit-scrollbar-track{background:transparent}.fng-select-panel .fwe-select-options-container::-webkit-scrollbar-thumb{overflow:visible;background-color:var(--fwe-control-scrollbar);border:3px solid rgba(242,243,245,0);-webkit-background-clip:padding-box;background-clip:padding-box;border-radius:8px}}.fng-select-panel-wrap{flex-basis:100%}.fwe-select-options-container{position:relative;top:4px;left:0;max-height:258px;min-width:calc(100% + 0px)!important;max-width:280px;overflow:auto;font-size:var(--fwe-font-size-base);background-color:var(--fwe-white);border-radius:4px;padding:8px;margin:0;border:1px solid var(--fwe-gray-200);box-shadow:0 1px 4px #00000029;list-style:none;outline:0}.fwe-select-options-container .fwe-select-option{position:relative;line-height:24px;padding:12px 8px;min-height:24px;cursor:pointer}.fwe-select-options-container .fwe-select-option:hover{background-color:var(--fwe-gray-100)}.fwe-select-options-container .fwe-select-option:last-child{border-bottom:none}.fwe-select-options-container .fwe-select-option .fwe-select-option-content{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;width:100%;line-height:24px;min-height:24px}.fng-select-pseudo-checkbox{width:16px;height:16px;border-radius:2px;cursor:pointer;display:inline-block;vertical-align:middle;box-sizing:border-box;position:relative;flex-shrink:0;color:var(--fwe-control-border);border:1px solid;transition:none;margin-right:12px;top:-1px}.fng-select-pseudo-checkbox:after{color:var(--fwe-white);position:absolute;display:block;opacity:0;content:\"\";border-bottom:2px solid currentColor;transition:opacity 90ms cubic-bezier(0,0,.2,.1)}.fng-select-pseudo-checkbox.fng-select-pseudo-checkbox-checked{background:var(--fwe-caerul);border:1px solid var(--fwe-caerul)}.fng-select-pseudo-checkbox.fng-select-pseudo-checkbox-checked:after{top:3px;left:2px;width:8px;height:3px;border-left:2px solid currentColor;transform:rotate(-45deg);opacity:1;box-sizing:content-box}.chip-text-truncate{display:inline-block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.chip-removable:after{content:\"\";position:absolute;right:5px;top:3px;height:16px;width:16px;background-image:url(data:image/svg+xml;base64,PHN2ZyBpZD0iYTAwMzhlNDEtMjFlNi00ZjBlLWFmZjctMzViMzY2MWQ0ZDhlIiBkYXRhLW5hbWU9ImNvbnRlbnQiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgdmlld0JveD0iMCAwIDE2IDE2Ij4NCgk8ZyBpZD0iZmQwZDc0NmQtZTE2My00Yjk4LTkxYTctYjk0MGYyYTlkZDc4IiBkYXRhLW5hbWU9ImFiYjU1YWU4LWNhNTUtNDcwYy04N2MzLTRiMDY3MzhiNDM2MCI+DQoJCTxyZWN0IHdpZHRoPSIxNiIgaGVpZ2h0PSIxNiIgZmlsbD0ibm9uZSIvPg0KCTwvZz4NCgk8ZyBpZD0iYTE4OTFiZmMtNDBjMS00Y2EwLWFmOTgtMmJiOTQ1YTdmMDFmIiBkYXRhLW5hbWU9ImI2NGIxZWQyLWI4MzEtNDM1Yy05Y2VlLWI5OTY0MjYwMjA5ZCI+DQoJCTxwb2x5Z29uIHBvaW50cz0iMTAuMjQgNS4wNSA4IDcuMyA1Ljc1IDUuMDUgNS4wNSA1Ljc2IDcuMjkgOCA1LjA1IDEwLjI1IDUuNzUgMTAuOTUgOCA4LjcxIDEwLjI0IDEwLjk1IDEwLjk1IDEwLjI1IDguNyA4IDEwLjk1IDUuNzYgMTAuMjQgNS4wNSAxMC4yNCA1LjA1IiBmaWxsPSIjMzMzIi8+DQoJPC9nPg0KPC9zdmc+)}.fwe-select-wrapper{display:flex;width:inherit;min-width:48px}.fwe-select-wrapper:before{bottom:unset;top:24px}.fwe-select-wrapper.fng-hide-label{margin-top:18px}.fwe-select-wrapper.fng-hide-label:before{top:6px}.fwe-select-wrapper.fwe-disabled:before{color:var(--fwe-text-disabled);background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij48ZyB0cmFuc2Zvcm09InRyYW5zbGF0ZSgxMiAxMikiPjxnIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0xMiAtMTIpIj48ZyB0cmFuc2Zvcm09InRyYW5zbGF0ZSgwIDApIj48cmVjdCB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIGZpbGw9Im5vbmUiLz48L2c+PGcgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoNS41OTggOC41MTMpIj48cGF0aCBkPSJNNS42MzYsOS4xOTRsNi4yNzgsNi41NjQsNi4yNzgtNi41NjQtLjctLjczTDExLjkxNCwxNC4zLDYuMzMzLDguNDY0WiIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoLTUuNjM2IC04LjQ2NCkiIGZpbGw9IiNiOWJhYmIiLz48L2c+PC9nPjwvZz48L3N2Zz4=)}.fwe-select-wrapper .fwe-select{cursor:pointer;height:unset;min-height:33px}.fwe-select-wrapper .fwe-select .fwe-select-content{padding-right:24px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:1.5rem}.fwe-select-wrapper .fwe-select.fwe-required:not(.fwe-disabled)~.fwe-select-label:after{position:relative;left:3px;display:inline-block;content:\"*\"}.fwe-select-wrapper .fwe-select.fwe-disabled{cursor:default;border-color:var(--fwe-control-disabled)!important}.fwe-select-wrapper .fwe-select.fwe-disabled~.fwe-select-label{color:var(--fwe-text-disabled)}.fwe-select-wrapper .fwe-select.fwe-disabled .fwe-select-content{color:var(--fwe-text-disabled)}.fwe-select-wrapper .fwe-select.fwe-disabled .fwe-chip{color:var(--fwe-text-disabled);border:1px solid var(--fwe-control-disabled);pointer-events:none}.fwe-select-wrapper .fwe-select.fwe-disabled .fwe-chip .chip-removable:after{color:var(--fwe-text-disabled)}.fwe-select-wrapper .fwe-select-label:empty~.fwe-select-options-container,.fwe-select-wrapper .fwe-select-label.fwe-sr-only~.fwe-select-options-container{top:38px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: OverlayModule }, { kind: "directive", type: i1$2.CdkConnectedOverlay, selector: "[cdk-connected-overlay], [connected-overlay], [cdkConnectedOverlay]", inputs: ["cdkConnectedOverlayOrigin", "cdkConnectedOverlayPositions", "cdkConnectedOverlayPositionStrategy", "cdkConnectedOverlayOffsetX", "cdkConnectedOverlayOffsetY", "cdkConnectedOverlayWidth", "cdkConnectedOverlayHeight", "cdkConnectedOverlayMinWidth", "cdkConnectedOverlayMinHeight", "cdkConnectedOverlayBackdropClass", "cdkConnectedOverlayPanelClass", "cdkConnectedOverlayViewportMargin", "cdkConnectedOverlayScrollStrategy", "cdkConnectedOverlayOpen", "cdkConnectedOverlayDisableClose", "cdkConnectedOverlayTransformOriginOn", "cdkConnectedOverlayHasBackdrop", "cdkConnectedOverlayLockPosition", "cdkConnectedOverlayFlexibleDimensions", "cdkConnectedOverlayGrowAfterOpen", "cdkConnectedOverlayPush", "cdkConnectedOverlayDisposeOnNavigation"], outputs: ["backdropClick", "positionChange", "attach", "detach", "overlayKeydown", "overlayOutsideClick"], exportAs: ["cdkConnectedOverlay"] }, { kind: "directive", type: i1$2.CdkOverlayOrigin, selector: "[cdk-overlay-origin], [overlay-origin], [cdkOverlayOrigin]", exportAs: ["cdkOverlayOrigin"] }, { kind: "pipe", type: FngChipTextPipe, name: "fngChipText" }], encapsulation: i0.ViewEncapsulation.None }); }
+        ], queries: [{ propertyName: "fngSelectOptions", predicate: FngSelectOptionComponent }], viewQueries: [{ propertyName: "elementRef", first: true, predicate: ["div"], descendants: true }], ngImport: i0, template: "<div #div class=\"fwe-select-wrapper\" [class.fwe-disabled]=\"disabled\" [class.fng-hide-label]=\"hideLabel\">\n  <div\n    class=\"fwe-select\"\n    (click)=\"toggle()\"\n    cdkOverlayOrigin\n    #trigger=\"cdkOverlayOrigin\"\n    [class.fwe-focus]=\"showOptions\"\n    [class.fwe-required]=\"required\"\n    [class.fwe-disabled]=\"disabled\"\n    [class.fwe-pty]=\"empty\"\n    >\n    <div class=\"fwe-select-content\">\n      @if (!multiple) {\n        {{ value != null && value | fngChipText: options:optionsValueKey:optionsTextKey }}\n      } @else {\n        <div class=\"fwe-chip-container\">\n          @for (v of value; track v) {\n            <div\n              class=\"fwe-chip chip-text-truncate fwe-pr-4\"\n              [style.max-width.px]=\"triggerWidth\"\n              [title]=\"v | fngChipText: options:optionsValueKey:optionsTextKey\"\n              >\n              {{ v | fngChipText: options:optionsValueKey:optionsTextKey }}\n              <span class=\"chip-removable\" (click)=\"removeChip($event, v)\"></span>\n            </div>\n          }\n        </div>\n      }\n    </div>\n  </div>\n  <ng-template\n    cdkConnectedOverlay\n    cdkConnectedOverlayHasBackdrop\n    cdkConnectedOverlayBackdropClass=\"cdk-overlay-transparent-backdrop\"\n    [cdkConnectedOverlayOrigin]=\"trigger\"\n    [cdkConnectedOverlayMinWidth]=\"triggerWidth\"\n    [cdkConnectedOverlayOpen]=\"showOptions\"\n    [cdkConnectedOverlayPanelClass]=\"selectPanelClasses\"\n    (backdropClick)=\"close()\"\n    (detach)=\"close()\"\n    >\n    <div class=\"fng-select-panel-wrap\">\n      <ul class=\"fwe-select-options-container\">\n        @if (resetOption != null && !multiple) {\n          <li class=\"fwe-select-option\" (click)=\"select(null, $event)\">{{ resetOption }}</li>\n        }\n        @for (option of options; track option; let i = $index) {\n          <li\n            class=\"fwe-select-option\"\n            (click)=\"select(getOptionValue(i), $event)\"\n            [title]=\"getOptionText(i) || option?.text\"\n            [class.fwe-selected]=\"isOptionSelected(i)\"\n            >\n            <span class=\"fwe-select-option-content\">\n              @if (multiple) {\n                <span\n                  class=\"fng-select-pseudo-checkbox\"\n                  [ngClass]=\"{ 'fng-select-pseudo-checkbox-checked': checked.get(getOptionValue(i)) === 'checked' }\"\n                ></span>\n              }\n              @if (hasProjectedOptions) {\n                <span [innerHTML]=\"projectedHtml[i]\"></span>\n              } @else {\n                {{ getOptionText(i) || option?.text }}\n              }\n            </span>\n          </li>\n        }\n      </ul>\n    </div>\n  </ng-template>\n  <label class=\"fwe-select-label\" [for]=\"id\" [class.fwe-sr-only]=\"hideLabel\">{{ label }}</label>\n  @if (hint) {\n    <div class=\"fwe-select-description\">\n      {{ hint }}\n    </div>\n  }\n  @if (error) {\n    <div class=\"fwe-select-invalid\">\n      {{ error }}\n    </div>\n  }\n</div>\n<div class=\"fwe-d-none\">\n  <ng-content></ng-content>\n</div>\n", styles: [".fng-select-panel-open .fng-select-panel{opacity:1!important}fng-select{width:auto}fng-select.ng-invalid:not(.ng-pristine) .fwe-select:hover{border-color:var(--fwe-red)}fng-select.ng-invalid:not(.ng-pristine) .fwe-select.fwe-required~.fwe-select-invalid{display:block}fng-select.ng-invalid:not(.ng-pristine) .fwe-select.fwe-required~.fwe-select-description{display:none}.fng-select-panel{opacity:0!important}.fng-select-panel.fng-select-panel-options-3 .fwe-select-options-container{max-height:162px}.fng-select-panel.fng-select-panel-options-4 .fwe-select-options-container{max-height:210px}.fng-select-panel.fng-select-panel-options-5 .fwe-select-options-container{max-height:258px}.fng-select-panel.fng-select-panel-options-6 .fwe-select-options-container{max-height:306px}.fng-select-panel.fng-select-panel-options-7 .fwe-select-options-container{max-height:354px}.fng-select-panel.fng-select-panel-options-8 .fwe-select-options-container{max-height:402px}.fng-select-panel.fng-select-panel-options-9 .fwe-select-options-container{max-height:450px}.fng-select-panel.fng-select-panel-options-10 .fwe-select-options-container{max-height:498px}@-moz-document url-prefix(){.fng-select-panel .fwe-select-options-container{scrollbar-width:thin;scrollbar-color:var(--fwe-control-scrollbar) transparent}}@media (pointer: fine){.fng-select-panel .fwe-select-options-container::-webkit-scrollbar{width:14px}.fng-select-panel .fwe-select-options-container::-webkit-scrollbar-track{background:transparent}.fng-select-panel .fwe-select-options-container::-webkit-scrollbar-thumb{overflow:visible;background-color:var(--fwe-control-scrollbar);border:3px solid rgba(242,243,245,0);-webkit-background-clip:padding-box;background-clip:padding-box;border-radius:8px}}.fng-select-panel-wrap{flex-basis:100%}.fwe-select-options-container{position:relative;top:4px;left:0;max-height:258px;min-width:calc(100% + 0px)!important;max-width:280px;overflow:auto;font-size:var(--fwe-font-size-base);background-color:var(--fwe-white);border-radius:4px;padding:8px 0;margin:0;border:1px solid var(--fwe-gray-200);box-shadow:0 1px 4px #00000029;list-style:none;outline:0}.fwe-select-options-container .fwe-select-option{position:relative;line-height:24px;padding:12px 8px 12px 16px;min-height:24px;cursor:pointer}.fwe-select-options-container .fwe-select-option:hover{background-color:var(--fwe-gray-100)}.fwe-select-options-container .fwe-select-option.fwe-selected{color:var(--fwe-hero)}.fwe-select-options-container .fwe-select-option.fwe-selected:before{content:\"\";width:4px;height:100%;background-color:var(--fwe-hero);position:absolute;left:0;top:0}.fwe-select-options-container .fwe-select-option.fwe-selected:hover{color:var(--fwe-hero-hover)}.fwe-select-options-container .fwe-select-option.fwe-selected:hover:before{background-color:var(--fwe-hero-hover)}.fwe-select-options-container .fwe-select-option:last-child{border-bottom:none}.fwe-select-options-container .fwe-select-option .fwe-select-option-content{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;width:100%;line-height:24px;min-height:24px}.fng-select-pseudo-checkbox{width:16px;height:16px;border-radius:2px;cursor:pointer;display:inline-block;vertical-align:middle;box-sizing:border-box;position:relative;flex-shrink:0;color:var(--fwe-control-border);border:1px solid;transition:none;margin-right:12px;top:-1px}.fng-select-pseudo-checkbox:after{color:var(--fwe-white);position:absolute;display:block;opacity:0;content:\"\";border-bottom:2px solid currentColor;transition:opacity 90ms cubic-bezier(0,0,.2,.1)}.fng-select-pseudo-checkbox.fng-select-pseudo-checkbox-checked{background:var(--fwe-caerul);border:1px solid var(--fwe-caerul)}.fng-select-pseudo-checkbox.fng-select-pseudo-checkbox-checked:after{top:3px;left:2px;width:8px;height:3px;border-left:2px solid currentColor;transform:rotate(-45deg);opacity:1;box-sizing:content-box}.chip-text-truncate{display:inline-block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.chip-removable:after{content:\"\";position:absolute;right:5px;top:3px;height:16px;width:16px;background-image:url(data:image/svg+xml;base64,PHN2ZyBpZD0iYTAwMzhlNDEtMjFlNi00ZjBlLWFmZjctMzViMzY2MWQ0ZDhlIiBkYXRhLW5hbWU9ImNvbnRlbnQiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgdmlld0JveD0iMCAwIDE2IDE2Ij4NCgk8ZyBpZD0iZmQwZDc0NmQtZTE2My00Yjk4LTkxYTctYjk0MGYyYTlkZDc4IiBkYXRhLW5hbWU9ImFiYjU1YWU4LWNhNTUtNDcwYy04N2MzLTRiMDY3MzhiNDM2MCI+DQoJCTxyZWN0IHdpZHRoPSIxNiIgaGVpZ2h0PSIxNiIgZmlsbD0ibm9uZSIvPg0KCTwvZz4NCgk8ZyBpZD0iYTE4OTFiZmMtNDBjMS00Y2EwLWFmOTgtMmJiOTQ1YTdmMDFmIiBkYXRhLW5hbWU9ImI2NGIxZWQyLWI4MzEtNDM1Yy05Y2VlLWI5OTY0MjYwMjA5ZCI+DQoJCTxwb2x5Z29uIHBvaW50cz0iMTAuMjQgNS4wNSA4IDcuMyA1Ljc1IDUuMDUgNS4wNSA1Ljc2IDcuMjkgOCA1LjA1IDEwLjI1IDUuNzUgMTAuOTUgOCA4LjcxIDEwLjI0IDEwLjk1IDEwLjk1IDEwLjI1IDguNyA4IDEwLjk1IDUuNzYgMTAuMjQgNS4wNSAxMC4yNCA1LjA1IiBmaWxsPSIjMzMzIi8+DQoJPC9nPg0KPC9zdmc+)}.fwe-select-wrapper{display:flex;width:inherit;min-width:48px}.fwe-select-wrapper:before{bottom:unset;top:24px}.fwe-select-wrapper.fng-hide-label{margin-top:18px}.fwe-select-wrapper.fng-hide-label:before{top:6px}.fwe-select-wrapper:has(.fwe-select.fwe-focus):before{transform:rotate(180deg)}.fwe-select-wrapper.fwe-disabled:before{color:var(--fwe-text-disabled);background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij48ZyB0cmFuc2Zvcm09InRyYW5zbGF0ZSgxMiAxMikiPjxnIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0xMiAtMTIpIj48ZyB0cmFuc2Zvcm09InRyYW5zbGF0ZSgwIDApIj48cmVjdCB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIGZpbGw9Im5vbmUiLz48L2c+PGcgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoNS41OTggOC41MTMpIj48cGF0aCBkPSJNNS42MzYsOS4xOTRsNi4yNzgsNi41NjQsNi4yNzgtNi41NjQtLjctLjczTDExLjkxNCwxNC4zLDYuMzMzLDguNDY0WiIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoLTUuNjM2IC04LjQ2NCkiIGZpbGw9IiNiOWJhYmIiLz48L2c+PC9nPjwvZz48L3N2Zz4=)}.fwe-select-wrapper .fwe-select{cursor:pointer;height:unset;min-height:33px}.fwe-select-wrapper .fwe-select .fwe-select-content{padding-right:24px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:1.5rem}.fwe-select-wrapper .fwe-select.fwe-required:not(.fwe-disabled)~.fwe-select-label:after{position:relative;left:3px;display:inline-block;content:\"*\"}.fwe-select-wrapper .fwe-select.fwe-disabled{cursor:default;border-color:var(--fwe-control-disabled)!important}.fwe-select-wrapper .fwe-select.fwe-disabled~.fwe-select-label{color:var(--fwe-text-disabled)}.fwe-select-wrapper .fwe-select.fwe-disabled .fwe-select-content{color:var(--fwe-text-disabled)}.fwe-select-wrapper .fwe-select.fwe-disabled .fwe-chip{color:var(--fwe-text-disabled);border:1px solid var(--fwe-control-disabled);pointer-events:none}.fwe-select-wrapper .fwe-select.fwe-disabled .fwe-chip .chip-removable:after{color:var(--fwe-text-disabled)}.fwe-select-wrapper .fwe-select-label:empty~.fwe-select-options-container,.fwe-select-wrapper .fwe-select-label.fwe-sr-only~.fwe-select-options-container{top:38px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: OverlayModule }, { kind: "directive", type: i1$2.CdkConnectedOverlay, selector: "[cdk-connected-overlay], [connected-overlay], [cdkConnectedOverlay]", inputs: ["cdkConnectedOverlayOrigin", "cdkConnectedOverlayPositions", "cdkConnectedOverlayPositionStrategy", "cdkConnectedOverlayOffsetX", "cdkConnectedOverlayOffsetY", "cdkConnectedOverlayWidth", "cdkConnectedOverlayHeight", "cdkConnectedOverlayMinWidth", "cdkConnectedOverlayMinHeight", "cdkConnectedOverlayBackdropClass", "cdkConnectedOverlayPanelClass", "cdkConnectedOverlayViewportMargin", "cdkConnectedOverlayScrollStrategy", "cdkConnectedOverlayOpen", "cdkConnectedOverlayDisableClose", "cdkConnectedOverlayTransformOriginOn", "cdkConnectedOverlayHasBackdrop", "cdkConnectedOverlayLockPosition", "cdkConnectedOverlayFlexibleDimensions", "cdkConnectedOverlayGrowAfterOpen", "cdkConnectedOverlayPush", "cdkConnectedOverlayDisposeOnNavigation"], outputs: ["backdropClick", "positionChange", "attach", "detach", "overlayKeydown", "overlayOutsideClick"], exportAs: ["cdkConnectedOverlay"] }, { kind: "directive", type: i1$2.CdkOverlayOrigin, selector: "[cdk-overlay-origin], [overlay-origin], [cdkOverlayOrigin]", exportAs: ["cdkOverlayOrigin"] }, { kind: "pipe", type: FngChipTextPipe, name: "fngChipText" }], encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: FngSelectComponent, decorators: [{
             type: Component,
@@ -5979,7 +5985,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImpo
                             useExisting: forwardRef(() => FngSelectComponent),
                             multi: true
                         }
-                    ], template: "<div #div class=\"fwe-select-wrapper\" [class.fwe-disabled]=\"disabled\" [class.fng-hide-label]=\"hideLabel\">\n  <div\n    class=\"fwe-select\"\n    (click)=\"toggle()\"\n    cdkOverlayOrigin\n    #trigger=\"cdkOverlayOrigin\"\n    [class.fwe-focus]=\"showOptions\"\n    [class.fwe-required]=\"required\"\n    [class.fwe-disabled]=\"disabled\"\n    [class.fwe-pty]=\"empty\"\n    >\n    <div class=\"fwe-select-content\">\n      @if (!multiple) {\n        {{ value != null && value | fngChipText: options:optionsValueKey:optionsTextKey }}\n      } @else {\n        <div class=\"fwe-chip-container\">\n          @for (v of value; track v) {\n            <div\n              class=\"fwe-chip chip-text-truncate fwe-pr-4\"\n              [style.max-width.px]=\"triggerWidth\"\n              [title]=\"v | fngChipText: options:optionsValueKey:optionsTextKey\"\n              >\n              {{ v | fngChipText: options:optionsValueKey:optionsTextKey }}\n              <span class=\"chip-removable\" (click)=\"removeChip($event, v)\"></span>\n            </div>\n          }\n        </div>\n      }\n    </div>\n  </div>\n  <ng-template\n    cdkConnectedOverlay\n    cdkConnectedOverlayHasBackdrop\n    cdkConnectedOverlayBackdropClass=\"cdk-overlay-transparent-backdrop\"\n    [cdkConnectedOverlayOrigin]=\"trigger\"\n    [cdkConnectedOverlayMinWidth]=\"triggerWidth\"\n    [cdkConnectedOverlayOpen]=\"showOptions\"\n    [cdkConnectedOverlayPanelClass]=\"selectPanelClasses\"\n    (backdropClick)=\"close()\"\n    (detach)=\"close()\"\n    >\n    <div class=\"fng-select-panel-wrap\">\n      <ul class=\"fwe-select-options-container\">\n        @if (resetOption != null && !multiple) {\n          <li class=\"fwe-select-option\" (click)=\"select(null, $event)\">{{ resetOption }}</li>\n        }\n        @for (option of options; track option; let i = $index) {\n          <li\n            class=\"fwe-select-option\"\n            (click)=\"select(getOptionValue(i), $event)\"\n            [title]=\"getOptionText(i) || option?.text\"\n            >\n            <span class=\"fwe-select-option-content\">\n              @if (multiple) {\n                <span\n                  class=\"fng-select-pseudo-checkbox\"\n                  [ngClass]=\"{ 'fng-select-pseudo-checkbox-checked': checked.get(getOptionValue(i)) === 'checked' }\"\n                ></span>\n              }\n              @if (hasProjectedOptions) {\n                <span [innerHTML]=\"projectedHtml[i]\"></span>\n              } @else {\n                {{ getOptionText(i) || option?.text }}\n              }\n            </span>\n          </li>\n        }\n      </ul>\n    </div>\n  </ng-template>\n  <label class=\"fwe-select-label\" [for]=\"id\" [class.fwe-sr-only]=\"hideLabel\">{{ label }}</label>\n  @if (hint) {\n    <div class=\"fwe-select-description\">\n      {{ hint }}\n    </div>\n  }\n  @if (error) {\n    <div class=\"fwe-select-invalid\">\n      {{ error }}\n    </div>\n  }\n</div>\n<div class=\"fwe-d-none\">\n  <ng-content></ng-content>\n</div>\n", styles: [".fng-select-panel-open .fng-select-panel{opacity:1!important}fng-select{width:auto}fng-select.ng-invalid:not(.ng-pristine) .fwe-select:hover{border-color:var(--fwe-red)}fng-select.ng-invalid:not(.ng-pristine) .fwe-select.fwe-required~.fwe-select-invalid{display:block}fng-select.ng-invalid:not(.ng-pristine) .fwe-select.fwe-required~.fwe-select-description{display:none}.fng-select-panel{opacity:0!important}.fng-select-panel.fng-select-panel-options-3 .fwe-select-options-container{max-height:162px}.fng-select-panel.fng-select-panel-options-4 .fwe-select-options-container{max-height:210px}.fng-select-panel.fng-select-panel-options-5 .fwe-select-options-container{max-height:258px}.fng-select-panel.fng-select-panel-options-6 .fwe-select-options-container{max-height:306px}.fng-select-panel.fng-select-panel-options-7 .fwe-select-options-container{max-height:354px}.fng-select-panel.fng-select-panel-options-8 .fwe-select-options-container{max-height:402px}.fng-select-panel.fng-select-panel-options-9 .fwe-select-options-container{max-height:450px}.fng-select-panel.fng-select-panel-options-10 .fwe-select-options-container{max-height:498px}@-moz-document url-prefix(){.fng-select-panel .fwe-select-options-container{scrollbar-width:thin;scrollbar-color:var(--fwe-control-scrollbar) transparent}}@media (pointer: fine){.fng-select-panel .fwe-select-options-container::-webkit-scrollbar{width:14px}.fng-select-panel .fwe-select-options-container::-webkit-scrollbar-track{background:transparent}.fng-select-panel .fwe-select-options-container::-webkit-scrollbar-thumb{overflow:visible;background-color:var(--fwe-control-scrollbar);border:3px solid rgba(242,243,245,0);-webkit-background-clip:padding-box;background-clip:padding-box;border-radius:8px}}.fng-select-panel-wrap{flex-basis:100%}.fwe-select-options-container{position:relative;top:4px;left:0;max-height:258px;min-width:calc(100% + 0px)!important;max-width:280px;overflow:auto;font-size:var(--fwe-font-size-base);background-color:var(--fwe-white);border-radius:4px;padding:8px;margin:0;border:1px solid var(--fwe-gray-200);box-shadow:0 1px 4px #00000029;list-style:none;outline:0}.fwe-select-options-container .fwe-select-option{position:relative;line-height:24px;padding:12px 8px;min-height:24px;cursor:pointer}.fwe-select-options-container .fwe-select-option:hover{background-color:var(--fwe-gray-100)}.fwe-select-options-container .fwe-select-option:last-child{border-bottom:none}.fwe-select-options-container .fwe-select-option .fwe-select-option-content{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;width:100%;line-height:24px;min-height:24px}.fng-select-pseudo-checkbox{width:16px;height:16px;border-radius:2px;cursor:pointer;display:inline-block;vertical-align:middle;box-sizing:border-box;position:relative;flex-shrink:0;color:var(--fwe-control-border);border:1px solid;transition:none;margin-right:12px;top:-1px}.fng-select-pseudo-checkbox:after{color:var(--fwe-white);position:absolute;display:block;opacity:0;content:\"\";border-bottom:2px solid currentColor;transition:opacity 90ms cubic-bezier(0,0,.2,.1)}.fng-select-pseudo-checkbox.fng-select-pseudo-checkbox-checked{background:var(--fwe-caerul);border:1px solid var(--fwe-caerul)}.fng-select-pseudo-checkbox.fng-select-pseudo-checkbox-checked:after{top:3px;left:2px;width:8px;height:3px;border-left:2px solid currentColor;transform:rotate(-45deg);opacity:1;box-sizing:content-box}.chip-text-truncate{display:inline-block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.chip-removable:after{content:\"\";position:absolute;right:5px;top:3px;height:16px;width:16px;background-image:url(data:image/svg+xml;base64,PHN2ZyBpZD0iYTAwMzhlNDEtMjFlNi00ZjBlLWFmZjctMzViMzY2MWQ0ZDhlIiBkYXRhLW5hbWU9ImNvbnRlbnQiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgdmlld0JveD0iMCAwIDE2IDE2Ij4NCgk8ZyBpZD0iZmQwZDc0NmQtZTE2My00Yjk4LTkxYTctYjk0MGYyYTlkZDc4IiBkYXRhLW5hbWU9ImFiYjU1YWU4LWNhNTUtNDcwYy04N2MzLTRiMDY3MzhiNDM2MCI+DQoJCTxyZWN0IHdpZHRoPSIxNiIgaGVpZ2h0PSIxNiIgZmlsbD0ibm9uZSIvPg0KCTwvZz4NCgk8ZyBpZD0iYTE4OTFiZmMtNDBjMS00Y2EwLWFmOTgtMmJiOTQ1YTdmMDFmIiBkYXRhLW5hbWU9ImI2NGIxZWQyLWI4MzEtNDM1Yy05Y2VlLWI5OTY0MjYwMjA5ZCI+DQoJCTxwb2x5Z29uIHBvaW50cz0iMTAuMjQgNS4wNSA4IDcuMyA1Ljc1IDUuMDUgNS4wNSA1Ljc2IDcuMjkgOCA1LjA1IDEwLjI1IDUuNzUgMTAuOTUgOCA4LjcxIDEwLjI0IDEwLjk1IDEwLjk1IDEwLjI1IDguNyA4IDEwLjk1IDUuNzYgMTAuMjQgNS4wNSAxMC4yNCA1LjA1IiBmaWxsPSIjMzMzIi8+DQoJPC9nPg0KPC9zdmc+)}.fwe-select-wrapper{display:flex;width:inherit;min-width:48px}.fwe-select-wrapper:before{bottom:unset;top:24px}.fwe-select-wrapper.fng-hide-label{margin-top:18px}.fwe-select-wrapper.fng-hide-label:before{top:6px}.fwe-select-wrapper.fwe-disabled:before{color:var(--fwe-text-disabled);background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij48ZyB0cmFuc2Zvcm09InRyYW5zbGF0ZSgxMiAxMikiPjxnIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0xMiAtMTIpIj48ZyB0cmFuc2Zvcm09InRyYW5zbGF0ZSgwIDApIj48cmVjdCB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIGZpbGw9Im5vbmUiLz48L2c+PGcgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoNS41OTggOC41MTMpIj48cGF0aCBkPSJNNS42MzYsOS4xOTRsNi4yNzgsNi41NjQsNi4yNzgtNi41NjQtLjctLjczTDExLjkxNCwxNC4zLDYuMzMzLDguNDY0WiIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoLTUuNjM2IC04LjQ2NCkiIGZpbGw9IiNiOWJhYmIiLz48L2c+PC9nPjwvZz48L3N2Zz4=)}.fwe-select-wrapper .fwe-select{cursor:pointer;height:unset;min-height:33px}.fwe-select-wrapper .fwe-select .fwe-select-content{padding-right:24px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:1.5rem}.fwe-select-wrapper .fwe-select.fwe-required:not(.fwe-disabled)~.fwe-select-label:after{position:relative;left:3px;display:inline-block;content:\"*\"}.fwe-select-wrapper .fwe-select.fwe-disabled{cursor:default;border-color:var(--fwe-control-disabled)!important}.fwe-select-wrapper .fwe-select.fwe-disabled~.fwe-select-label{color:var(--fwe-text-disabled)}.fwe-select-wrapper .fwe-select.fwe-disabled .fwe-select-content{color:var(--fwe-text-disabled)}.fwe-select-wrapper .fwe-select.fwe-disabled .fwe-chip{color:var(--fwe-text-disabled);border:1px solid var(--fwe-control-disabled);pointer-events:none}.fwe-select-wrapper .fwe-select.fwe-disabled .fwe-chip .chip-removable:after{color:var(--fwe-text-disabled)}.fwe-select-wrapper .fwe-select-label:empty~.fwe-select-options-container,.fwe-select-wrapper .fwe-select-label.fwe-sr-only~.fwe-select-options-container{top:38px}\n"] }]
+                    ], template: "<div #div class=\"fwe-select-wrapper\" [class.fwe-disabled]=\"disabled\" [class.fng-hide-label]=\"hideLabel\">\n  <div\n    class=\"fwe-select\"\n    (click)=\"toggle()\"\n    cdkOverlayOrigin\n    #trigger=\"cdkOverlayOrigin\"\n    [class.fwe-focus]=\"showOptions\"\n    [class.fwe-required]=\"required\"\n    [class.fwe-disabled]=\"disabled\"\n    [class.fwe-pty]=\"empty\"\n    >\n    <div class=\"fwe-select-content\">\n      @if (!multiple) {\n        {{ value != null && value | fngChipText: options:optionsValueKey:optionsTextKey }}\n      } @else {\n        <div class=\"fwe-chip-container\">\n          @for (v of value; track v) {\n            <div\n              class=\"fwe-chip chip-text-truncate fwe-pr-4\"\n              [style.max-width.px]=\"triggerWidth\"\n              [title]=\"v | fngChipText: options:optionsValueKey:optionsTextKey\"\n              >\n              {{ v | fngChipText: options:optionsValueKey:optionsTextKey }}\n              <span class=\"chip-removable\" (click)=\"removeChip($event, v)\"></span>\n            </div>\n          }\n        </div>\n      }\n    </div>\n  </div>\n  <ng-template\n    cdkConnectedOverlay\n    cdkConnectedOverlayHasBackdrop\n    cdkConnectedOverlayBackdropClass=\"cdk-overlay-transparent-backdrop\"\n    [cdkConnectedOverlayOrigin]=\"trigger\"\n    [cdkConnectedOverlayMinWidth]=\"triggerWidth\"\n    [cdkConnectedOverlayOpen]=\"showOptions\"\n    [cdkConnectedOverlayPanelClass]=\"selectPanelClasses\"\n    (backdropClick)=\"close()\"\n    (detach)=\"close()\"\n    >\n    <div class=\"fng-select-panel-wrap\">\n      <ul class=\"fwe-select-options-container\">\n        @if (resetOption != null && !multiple) {\n          <li class=\"fwe-select-option\" (click)=\"select(null, $event)\">{{ resetOption }}</li>\n        }\n        @for (option of options; track option; let i = $index) {\n          <li\n            class=\"fwe-select-option\"\n            (click)=\"select(getOptionValue(i), $event)\"\n            [title]=\"getOptionText(i) || option?.text\"\n            [class.fwe-selected]=\"isOptionSelected(i)\"\n            >\n            <span class=\"fwe-select-option-content\">\n              @if (multiple) {\n                <span\n                  class=\"fng-select-pseudo-checkbox\"\n                  [ngClass]=\"{ 'fng-select-pseudo-checkbox-checked': checked.get(getOptionValue(i)) === 'checked' }\"\n                ></span>\n              }\n              @if (hasProjectedOptions) {\n                <span [innerHTML]=\"projectedHtml[i]\"></span>\n              } @else {\n                {{ getOptionText(i) || option?.text }}\n              }\n            </span>\n          </li>\n        }\n      </ul>\n    </div>\n  </ng-template>\n  <label class=\"fwe-select-label\" [for]=\"id\" [class.fwe-sr-only]=\"hideLabel\">{{ label }}</label>\n  @if (hint) {\n    <div class=\"fwe-select-description\">\n      {{ hint }}\n    </div>\n  }\n  @if (error) {\n    <div class=\"fwe-select-invalid\">\n      {{ error }}\n    </div>\n  }\n</div>\n<div class=\"fwe-d-none\">\n  <ng-content></ng-content>\n</div>\n", styles: [".fng-select-panel-open .fng-select-panel{opacity:1!important}fng-select{width:auto}fng-select.ng-invalid:not(.ng-pristine) .fwe-select:hover{border-color:var(--fwe-red)}fng-select.ng-invalid:not(.ng-pristine) .fwe-select.fwe-required~.fwe-select-invalid{display:block}fng-select.ng-invalid:not(.ng-pristine) .fwe-select.fwe-required~.fwe-select-description{display:none}.fng-select-panel{opacity:0!important}.fng-select-panel.fng-select-panel-options-3 .fwe-select-options-container{max-height:162px}.fng-select-panel.fng-select-panel-options-4 .fwe-select-options-container{max-height:210px}.fng-select-panel.fng-select-panel-options-5 .fwe-select-options-container{max-height:258px}.fng-select-panel.fng-select-panel-options-6 .fwe-select-options-container{max-height:306px}.fng-select-panel.fng-select-panel-options-7 .fwe-select-options-container{max-height:354px}.fng-select-panel.fng-select-panel-options-8 .fwe-select-options-container{max-height:402px}.fng-select-panel.fng-select-panel-options-9 .fwe-select-options-container{max-height:450px}.fng-select-panel.fng-select-panel-options-10 .fwe-select-options-container{max-height:498px}@-moz-document url-prefix(){.fng-select-panel .fwe-select-options-container{scrollbar-width:thin;scrollbar-color:var(--fwe-control-scrollbar) transparent}}@media (pointer: fine){.fng-select-panel .fwe-select-options-container::-webkit-scrollbar{width:14px}.fng-select-panel .fwe-select-options-container::-webkit-scrollbar-track{background:transparent}.fng-select-panel .fwe-select-options-container::-webkit-scrollbar-thumb{overflow:visible;background-color:var(--fwe-control-scrollbar);border:3px solid rgba(242,243,245,0);-webkit-background-clip:padding-box;background-clip:padding-box;border-radius:8px}}.fng-select-panel-wrap{flex-basis:100%}.fwe-select-options-container{position:relative;top:4px;left:0;max-height:258px;min-width:calc(100% + 0px)!important;max-width:280px;overflow:auto;font-size:var(--fwe-font-size-base);background-color:var(--fwe-white);border-radius:4px;padding:8px 0;margin:0;border:1px solid var(--fwe-gray-200);box-shadow:0 1px 4px #00000029;list-style:none;outline:0}.fwe-select-options-container .fwe-select-option{position:relative;line-height:24px;padding:12px 8px 12px 16px;min-height:24px;cursor:pointer}.fwe-select-options-container .fwe-select-option:hover{background-color:var(--fwe-gray-100)}.fwe-select-options-container .fwe-select-option.fwe-selected{color:var(--fwe-hero)}.fwe-select-options-container .fwe-select-option.fwe-selected:before{content:\"\";width:4px;height:100%;background-color:var(--fwe-hero);position:absolute;left:0;top:0}.fwe-select-options-container .fwe-select-option.fwe-selected:hover{color:var(--fwe-hero-hover)}.fwe-select-options-container .fwe-select-option.fwe-selected:hover:before{background-color:var(--fwe-hero-hover)}.fwe-select-options-container .fwe-select-option:last-child{border-bottom:none}.fwe-select-options-container .fwe-select-option .fwe-select-option-content{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;width:100%;line-height:24px;min-height:24px}.fng-select-pseudo-checkbox{width:16px;height:16px;border-radius:2px;cursor:pointer;display:inline-block;vertical-align:middle;box-sizing:border-box;position:relative;flex-shrink:0;color:var(--fwe-control-border);border:1px solid;transition:none;margin-right:12px;top:-1px}.fng-select-pseudo-checkbox:after{color:var(--fwe-white);position:absolute;display:block;opacity:0;content:\"\";border-bottom:2px solid currentColor;transition:opacity 90ms cubic-bezier(0,0,.2,.1)}.fng-select-pseudo-checkbox.fng-select-pseudo-checkbox-checked{background:var(--fwe-caerul);border:1px solid var(--fwe-caerul)}.fng-select-pseudo-checkbox.fng-select-pseudo-checkbox-checked:after{top:3px;left:2px;width:8px;height:3px;border-left:2px solid currentColor;transform:rotate(-45deg);opacity:1;box-sizing:content-box}.chip-text-truncate{display:inline-block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.chip-removable:after{content:\"\";position:absolute;right:5px;top:3px;height:16px;width:16px;background-image:url(data:image/svg+xml;base64,PHN2ZyBpZD0iYTAwMzhlNDEtMjFlNi00ZjBlLWFmZjctMzViMzY2MWQ0ZDhlIiBkYXRhLW5hbWU9ImNvbnRlbnQiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgdmlld0JveD0iMCAwIDE2IDE2Ij4NCgk8ZyBpZD0iZmQwZDc0NmQtZTE2My00Yjk4LTkxYTctYjk0MGYyYTlkZDc4IiBkYXRhLW5hbWU9ImFiYjU1YWU4LWNhNTUtNDcwYy04N2MzLTRiMDY3MzhiNDM2MCI+DQoJCTxyZWN0IHdpZHRoPSIxNiIgaGVpZ2h0PSIxNiIgZmlsbD0ibm9uZSIvPg0KCTwvZz4NCgk8ZyBpZD0iYTE4OTFiZmMtNDBjMS00Y2EwLWFmOTgtMmJiOTQ1YTdmMDFmIiBkYXRhLW5hbWU9ImI2NGIxZWQyLWI4MzEtNDM1Yy05Y2VlLWI5OTY0MjYwMjA5ZCI+DQoJCTxwb2x5Z29uIHBvaW50cz0iMTAuMjQgNS4wNSA4IDcuMyA1Ljc1IDUuMDUgNS4wNSA1Ljc2IDcuMjkgOCA1LjA1IDEwLjI1IDUuNzUgMTAuOTUgOCA4LjcxIDEwLjI0IDEwLjk1IDEwLjk1IDEwLjI1IDguNyA4IDEwLjk1IDUuNzYgMTAuMjQgNS4wNSAxMC4yNCA1LjA1IiBmaWxsPSIjMzMzIi8+DQoJPC9nPg0KPC9zdmc+)}.fwe-select-wrapper{display:flex;width:inherit;min-width:48px}.fwe-select-wrapper:before{bottom:unset;top:24px}.fwe-select-wrapper.fng-hide-label{margin-top:18px}.fwe-select-wrapper.fng-hide-label:before{top:6px}.fwe-select-wrapper:has(.fwe-select.fwe-focus):before{transform:rotate(180deg)}.fwe-select-wrapper.fwe-disabled:before{color:var(--fwe-text-disabled);background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij48ZyB0cmFuc2Zvcm09InRyYW5zbGF0ZSgxMiAxMikiPjxnIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0xMiAtMTIpIj48ZyB0cmFuc2Zvcm09InRyYW5zbGF0ZSgwIDApIj48cmVjdCB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIGZpbGw9Im5vbmUiLz48L2c+PGcgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoNS41OTggOC41MTMpIj48cGF0aCBkPSJNNS42MzYsOS4xOTRsNi4yNzgsNi41NjQsNi4yNzgtNi41NjQtLjctLjczTDExLjkxNCwxNC4zLDYuMzMzLDguNDY0WiIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoLTUuNjM2IC04LjQ2NCkiIGZpbGw9IiNiOWJhYmIiLz48L2c+PC9nPjwvZz48L3N2Zz4=)}.fwe-select-wrapper .fwe-select{cursor:pointer;height:unset;min-height:33px}.fwe-select-wrapper .fwe-select .fwe-select-content{padding-right:24px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:1.5rem}.fwe-select-wrapper .fwe-select.fwe-required:not(.fwe-disabled)~.fwe-select-label:after{position:relative;left:3px;display:inline-block;content:\"*\"}.fwe-select-wrapper .fwe-select.fwe-disabled{cursor:default;border-color:var(--fwe-control-disabled)!important}.fwe-select-wrapper .fwe-select.fwe-disabled~.fwe-select-label{color:var(--fwe-text-disabled)}.fwe-select-wrapper .fwe-select.fwe-disabled .fwe-select-content{color:var(--fwe-text-disabled)}.fwe-select-wrapper .fwe-select.fwe-disabled .fwe-chip{color:var(--fwe-text-disabled);border:1px solid var(--fwe-control-disabled);pointer-events:none}.fwe-select-wrapper .fwe-select.fwe-disabled .fwe-chip .chip-removable:after{color:var(--fwe-text-disabled)}.fwe-select-wrapper .fwe-select-label:empty~.fwe-select-options-container,.fwe-select-wrapper .fwe-select-label.fwe-sr-only~.fwe-select-options-container{top:38px}\n"] }]
         }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: Document, decorators: [{
                     type: Inject,
                     args: [DOCUMENT]