@seniorsistemas/angular-components 17.27.1-fix-interactive-content-46e38731 → 17.27.1-fixlookupteste-sds-110-c424f879

package/fesm2022/seniorsistemas-angular-components-radio-button.mjs

@@ -0,0 +1,182 @@
+import { NgClass } from '@angular/common';
+import * as i0 from '@angular/core';
+import { Injectable, inject, Injector, computed, signal, model, input, output, forwardRef, Component } from '@angular/core';
+import * as i1 from '@angular/forms';
+import { NgControl, NG_VALUE_ACCESSOR, FormsModule } from '@angular/forms';
+import { InteractiveContentDirective } from '@seniorsistemas/angular-components/interactive-content';
+import { randomHash } from '@seniorsistemas/angular-components/utils';
+
+class RadioButtonRegistryService {
+    componentRefs = [];
+    add(control, componentInstance) {
+        this.componentRefs.push({
+            componentInstance,
+            formControl: control,
+        });
+    }
+    remove(componentInstance) {
+        this.componentRefs = this.componentRefs.filter((item) => item.componentInstance !== componentInstance);
+    }
+    select(componentInstance) {
+        this.componentRefs.forEach((item) => {
+            if (this.isSameGroup(item, componentInstance) && item.componentInstance !== componentInstance) {
+                item.componentInstance.writeValue(componentInstance.value());
+            }
+        });
+    }
+    isSameGroup({ componentInstance, formControl }, currentComponentInstance) {
+        if (!formControl) {
+            return false;
+        }
+        const controlRoot = formControl.control?.root;
+        return (controlRoot === componentInstance?.['control']?.control?.root &&
+            componentInstance.name() === currentComponentInstance.name());
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: RadioButtonRegistryService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: RadioButtonRegistryService, providedIn: 'root' });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: RadioButtonRegistryService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root',
+                }]
+        }] });
+
+class RadioButtonComponent {
+    static ID = 0;
+    radioButtonRegistry = inject(RadioButtonRegistryService);
+    injector = inject(Injector);
+    control = null;
+    disabled = computed(() => {
+        return this.buttonDisabled() || this.formItemDisabled();
+    });
+    onChange = () => { };
+    onTouched = () => { };
+    checked = null;
+    formItemDisabled = signal(false);
+    buttonDisabled = model(false);
+    label = input.required();
+    name = input.required();
+    value = model.required();
+    inputId = input(`RadioButton_${RadioButtonComponent.ID++}`);
+    focusedInput = output();
+    inputFocusLost = output();
+    registerOnChange(fn) {
+        this.onChange = fn;
+    }
+    registerOnTouched(fn) {
+        this.onTouched = fn;
+    }
+    setDisabledState(isDisabled) {
+        this.formItemDisabled.set(isDisabled);
+    }
+    writeValue(value) {
+        this.checked = value === this.value();
+    }
+    ngOnInit() {
+        this.control = this.injector.get(NgControl, null);
+        if (this.control) {
+            this.radioButtonRegistry.add(this.control, this);
+        }
+    }
+    ngOnDestroy() {
+        if (this.control) {
+            this.radioButtonRegistry.remove(this);
+        }
+    }
+    setValue() {
+        if (this.disabled()) {
+            return;
+        }
+        this.checked = true;
+        this.onChange(this.value());
+        this.radioButtonRegistry.select(this);
+        this.onTouched(this.value());
+    }
+    activedContent(event) {
+        event.stopPropagation();
+        event.preventDefault();
+        this.setValue();
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: RadioButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.14", type: RadioButtonComponent, isStandalone: true, selector: "s-radiobutton", inputs: { buttonDisabled: { classPropertyName: "buttonDisabled", publicName: "buttonDisabled", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: true, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: true, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: true, transformFunction: null }, inputId: { classPropertyName: "inputId", publicName: "inputId", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { buttonDisabled: "buttonDisabledChange", value: "valueChange", focusedInput: "focusedInput", inputFocusLost: "inputFocusLost" }, providers: [
+            {
+                provide: NG_VALUE_ACCESSOR,
+                useExisting: forwardRef(() => RadioButtonComponent),
+                multi: true,
+            },
+        ], ngImport: i0, template: "<div\n    class=\"flex items-center gap-3\"\n    (sInteractiveContent)=\"activedContent($event)\"\n    [stopPropagation]=\"true\"\n    [disabled]=\"disabled()\"\n    [tabindex]=\"disabled() ? -1 : 0\"\n>\n    <input\n        type=\"radio\"\n        [value]=\"value()\"\n        [checked]=\"checked\"\n        [name]=\"name()\"\n        [id]=\"inputId()\"\n        (change)=\"setValue()\"\n        [disabled]=\"disabled()\"\n        class=\"h-4 w-4 appearance-none rounded-[50%] transition-all ease-in-out disabled:opacity-50\"\n        [ngClass]=\"{\n            'border-2 border-primary': checked,\n            'border-[1px] border-grayscale-30': !checked,\n            'cursor-pointer': !disabled(),\n            'focus-within:!border-primary hover:border-[1px] hover:border-[#063951]': !disabled() && checked,\n            'hover:border-grayscale-50': !disabled() && !checked,\n        }\"\n        [stopPropagation]=\"true\"\n        (sInteractiveContent)=\"activedContent($event)\"\n        (focus)=\"focusedInput.emit($event)\"\n        (blur)=\"inputFocusLost.emit($event)\"\n    />\n\n    <label\n        class=\"font-open-sans m-0 text-sm text-grayscale-90\"\n        [disabled]=\"disabled()\"\n        (sInteractiveContent)=\"activedContent($event)\"\n        [stopPropagation]=\"true\"\n        [tabindex]=\"disabled() ? -1 : 0\"\n        [ngClass]=\"{\n            'cursor-pointer': !disabled(),\n            'opacity-50': disabled(),\n        }\"\n        [for]=\"inputId()\"\n    >\n        {{ label() }}\n    </label>\n</div>\n", dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: InteractiveContentDirective, selector: "[sInteractiveContent]", inputs: ["focusable", "disabled", "stopPropagation"], outputs: ["sInteractiveContent"] }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: RadioButtonComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 's-radiobutton', standalone: true, imports: [FormsModule, NgClass, InteractiveContentDirective], providers: [
+                        {
+                            provide: NG_VALUE_ACCESSOR,
+                            useExisting: forwardRef(() => RadioButtonComponent),
+                            multi: true,
+                        },
+                    ], template: "<div\n    class=\"flex items-center gap-3\"\n    (sInteractiveContent)=\"activedContent($event)\"\n    [stopPropagation]=\"true\"\n    [disabled]=\"disabled()\"\n    [tabindex]=\"disabled() ? -1 : 0\"\n>\n    <input\n        type=\"radio\"\n        [value]=\"value()\"\n        [checked]=\"checked\"\n        [name]=\"name()\"\n        [id]=\"inputId()\"\n        (change)=\"setValue()\"\n        [disabled]=\"disabled()\"\n        class=\"h-4 w-4 appearance-none rounded-[50%] transition-all ease-in-out disabled:opacity-50\"\n        [ngClass]=\"{\n            'border-2 border-primary': checked,\n            'border-[1px] border-grayscale-30': !checked,\n            'cursor-pointer': !disabled(),\n            'focus-within:!border-primary hover:border-[1px] hover:border-[#063951]': !disabled() && checked,\n            'hover:border-grayscale-50': !disabled() && !checked,\n        }\"\n        [stopPropagation]=\"true\"\n        (sInteractiveContent)=\"activedContent($event)\"\n        (focus)=\"focusedInput.emit($event)\"\n        (blur)=\"inputFocusLost.emit($event)\"\n    />\n\n    <label\n        class=\"font-open-sans m-0 text-sm text-grayscale-90\"\n        [disabled]=\"disabled()\"\n        (sInteractiveContent)=\"activedContent($event)\"\n        [stopPropagation]=\"true\"\n        [tabindex]=\"disabled() ? -1 : 0\"\n        [ngClass]=\"{\n            'cursor-pointer': !disabled(),\n            'opacity-50': disabled(),\n        }\"\n        [for]=\"inputId()\"\n    >\n        {{ label() }}\n    </label>\n</div>\n" }]
+        }] });
+
+class RadioButtonGroupComponent {
+    onChange = () => { };
+    onTouched = () => { };
+    modelValue = signal(undefined);
+    disabled = model(false);
+    items = input.required();
+    inputName = input.required();
+    viewMode = input('horizontal');
+    registerOnChange(fn) {
+        this.onChange = fn;
+    }
+    registerOnTouched(fn) {
+        this.onTouched = fn;
+    }
+    setDisabledState(isDisabled) {
+        this.disabled.set(isDisabled);
+    }
+    writeValue(value) {
+        this.modelValue.set(value);
+    }
+    radioButtonItems = computed(() => {
+        const items = this.items();
+        return items.map((item) => {
+            return {
+                ...item,
+                hash: randomHash(),
+            };
+        });
+    });
+    setValue(value) {
+        if (this.disabled()) {
+            return;
+        }
+        this.onChange(value);
+        this.onTouched(value);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: RadioButtonGroupComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: RadioButtonGroupComponent, isStandalone: true, selector: "s-radiobutton-group", inputs: { disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, items: { classPropertyName: "items", publicName: "items", isSignal: true, isRequired: true, transformFunction: null }, inputName: { classPropertyName: "inputName", publicName: "inputName", isSignal: true, isRequired: true, transformFunction: null }, viewMode: { classPropertyName: "viewMode", publicName: "viewMode", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { disabled: "disabledChange" }, providers: [
+            {
+                provide: NG_VALUE_ACCESSOR,
+                useExisting: forwardRef(() => RadioButtonGroupComponent),
+                multi: true,
+            },
+        ], ngImport: i0, template: "<section\n    class=\"flex gap-2\"\n    [class.flex-col]=\"viewMode() === 'horizontal'\"\n>\n    @for (radioButtonItem of radioButtonItems(); track radioButtonItem.hash) {\n        @let itemDisabled = disabled() ? true : radioButtonItem.disabled || false;\n\n        <s-radiobutton\n            [(ngModel)]=\"modelValue\"\n            (ngModelChange)=\"setValue($event)\"\n            [value]=\"radioButtonItem.value\"\n            [buttonDisabled]=\"itemDisabled\"\n            [name]=\"inputName()\"\n            [label]=\"radioButtonItem.label\"\n        >\n        </s-radiobutton>\n    }\n</section>\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: RadioButtonComponent, selector: "s-radiobutton", inputs: ["buttonDisabled", "label", "name", "value", "inputId"], outputs: ["buttonDisabledChange", "valueChange", "focusedInput", "inputFocusLost"] }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: RadioButtonGroupComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 's-radiobutton-group', standalone: true, imports: [FormsModule, RadioButtonComponent], providers: [
+                        {
+                            provide: NG_VALUE_ACCESSOR,
+                            useExisting: forwardRef(() => RadioButtonGroupComponent),
+                            multi: true,
+                        },
+                    ], template: "<section\n    class=\"flex gap-2\"\n    [class.flex-col]=\"viewMode() === 'horizontal'\"\n>\n    @for (radioButtonItem of radioButtonItems(); track radioButtonItem.hash) {\n        @let itemDisabled = disabled() ? true : radioButtonItem.disabled || false;\n\n        <s-radiobutton\n            [(ngModel)]=\"modelValue\"\n            (ngModelChange)=\"setValue($event)\"\n            [value]=\"radioButtonItem.value\"\n            [buttonDisabled]=\"itemDisabled\"\n            [name]=\"inputName()\"\n            [label]=\"radioButtonItem.label\"\n        >\n        </s-radiobutton>\n    }\n</section>\n" }]
+        }] });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { RadioButtonComponent, RadioButtonGroupComponent };
+//# sourceMappingURL=seniorsistemas-angular-components-radio-button.mjs.map

package/fesm2022/seniorsistemas-angular-components-radio-button.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"seniorsistemas-angular-components-radio-button.mjs","sources":["../../projects/angular-components/radio-button/src/lib/services/radio-button-registry.service.ts","../../projects/angular-components/radio-button/src/lib/radio-button/radio-button.component.ts","../../projects/angular-components/radio-button/src/lib/radio-button/radio-button.component.html","../../projects/angular-components/radio-button/src/lib/radio-button-group/radio-button-group.component.ts","../../projects/angular-components/radio-button/src/lib/radio-button-group/radio-button-group.component.html","../../projects/angular-components/radio-button/src/seniorsistemas-angular-components-radio-button.ts"],"sourcesContent":["import { Injectable } from '@angular/core';\nimport { NgControl } from '@angular/forms';\n\nimport { RadioButtonComponent } from '../radio-button/radio-button.component';\n\ntype ComponentRef = { componentInstance: RadioButtonComponent; formControl: NgControl };\n\n@Injectable({\n    providedIn: 'root',\n})\nexport class RadioButtonRegistryService {\n    private componentRefs: ComponentRef[] = [];\n\n    add(control: NgControl, componentInstance: RadioButtonComponent) {\n        this.componentRefs.push({\n            componentInstance,\n            formControl: control,\n        });\n    }\n\n    remove(componentInstance: RadioButtonComponent) {\n        this.componentRefs = this.componentRefs.filter((item) => item.componentInstance !== componentInstance);\n    }\n\n    select(componentInstance: RadioButtonComponent) {\n        this.componentRefs.forEach((item) => {\n            if (this.isSameGroup(item, componentInstance) && item.componentInstance !== componentInstance) {\n                item.componentInstance.writeValue(componentInstance.value());\n            }\n        });\n    }\n\n    private isSameGroup(\n        { componentInstance, formControl }: ComponentRef,\n        currentComponentInstance: RadioButtonComponent,\n    ): boolean {\n        if (!formControl) {\n            return false;\n        }\n        const controlRoot = formControl.control?.root;\n        return (\n            controlRoot === componentInstance?.['control']?.control?.root &&\n            componentInstance.name() === currentComponentInstance.name()\n        );\n    }\n}\n","import { NgClass } from '@angular/common';\nimport {\n    Component,\n    computed,\n    forwardRef,\n    inject,\n    Injector,\n    input,\n    model,\n    OnDestroy,\n    OnInit,\n    output,\n    signal,\n} from '@angular/core';\nimport { ControlValueAccessor, FormsModule, NG_VALUE_ACCESSOR, NgControl } from '@angular/forms';\nimport { InteractiveContentDirective } from '@seniorsistemas/angular-components/interactive-content';\nimport { RadioButtonRegistryService } from '../services/radio-button-registry.service';\n\n@Component({\n    selector: 's-radiobutton',\n    standalone: true,\n    imports: [FormsModule, NgClass, InteractiveContentDirective],\n    templateUrl: './radio-button.component.html',\n    providers: [\n        {\n            provide: NG_VALUE_ACCESSOR,\n            useExisting: forwardRef(() => RadioButtonComponent),\n            multi: true,\n        },\n    ],\n})\nexport class RadioButtonComponent implements ControlValueAccessor, OnInit, OnDestroy {\n    private static ID = 0;\n    private readonly radioButtonRegistry = inject(RadioButtonRegistryService);\n    private readonly injector = inject(Injector);\n    private control: NgControl | null = null;\n\n    protected readonly disabled = computed(() => {\n        return this.buttonDisabled() || this.formItemDisabled();\n    });\n\n    protected onChange: (value: unknown) => void = () => {};\n    protected onTouched: (value: unknown) => void = () => {};\n    protected checked: boolean | null = null;\n    protected formItemDisabled = signal(false);\n\n    buttonDisabled = model(false);\n    label = input.required<string>();\n    name = input.required<string>();\n    value = model.required<unknown>();\n    inputId = input(`RadioButton_${RadioButtonComponent.ID++}`);\n\n    focusedInput = output<FocusEvent>();\n    inputFocusLost = output<FocusEvent>();\n\n    registerOnChange(fn: (value: unknown) => void): void {\n        this.onChange = fn;\n    }\n\n    registerOnTouched(fn: () => void): void {\n        this.onTouched = fn;\n    }\n\n    setDisabledState(isDisabled: boolean): void {\n        this.formItemDisabled.set(isDisabled);\n    }\n\n    writeValue(value: unknown): void {\n        this.checked = value === this.value();\n    }\n\n    ngOnInit(): void {\n        this.control = this.injector.get(NgControl, null);\n        if (this.control) {\n            this.radioButtonRegistry.add(this.control, this);\n        }\n    }\n\n    ngOnDestroy(): void {\n        if (this.control) {\n            this.radioButtonRegistry.remove(this);\n        }\n    }\n\n    protected setValue() {\n        if (this.disabled()) {\n            return;\n        }\n        this.checked = true;\n        this.onChange(this.value());\n        this.radioButtonRegistry.select(this);\n        this.onTouched(this.value());\n    }\n\n    protected activedContent(event: Event | KeyboardEvent) {\n        event.stopPropagation();\n        event.preventDefault();\n        this.setValue();\n    }\n}\n","<div\n    class=\"flex items-center gap-3\"\n    (sInteractiveContent)=\"activedContent($event)\"\n    [stopPropagation]=\"true\"\n    [disabled]=\"disabled()\"\n    [tabindex]=\"disabled() ? -1 : 0\"\n>\n    <input\n        type=\"radio\"\n        [value]=\"value()\"\n        [checked]=\"checked\"\n        [name]=\"name()\"\n        [id]=\"inputId()\"\n        (change)=\"setValue()\"\n        [disabled]=\"disabled()\"\n        class=\"h-4 w-4 appearance-none rounded-[50%] transition-all ease-in-out disabled:opacity-50\"\n        [ngClass]=\"{\n            'border-2 border-primary': checked,\n            'border-[1px] border-grayscale-30': !checked,\n            'cursor-pointer': !disabled(),\n            'focus-within:!border-primary hover:border-[1px] hover:border-[#063951]': !disabled() && checked,\n            'hover:border-grayscale-50': !disabled() && !checked,\n        }\"\n        [stopPropagation]=\"true\"\n        (sInteractiveContent)=\"activedContent($event)\"\n        (focus)=\"focusedInput.emit($event)\"\n        (blur)=\"inputFocusLost.emit($event)\"\n    />\n\n    <label\n        class=\"font-open-sans m-0 text-sm text-grayscale-90\"\n        [disabled]=\"disabled()\"\n        (sInteractiveContent)=\"activedContent($event)\"\n        [stopPropagation]=\"true\"\n        [tabindex]=\"disabled() ? -1 : 0\"\n        [ngClass]=\"{\n            'cursor-pointer': !disabled(),\n            'opacity-50': disabled(),\n        }\"\n        [for]=\"inputId()\"\n    >\n        {{ label() }}\n    </label>\n</div>\n","import { Component, computed, forwardRef, input, model, signal } from '@angular/core';\nimport { ControlValueAccessor, FormsModule, NG_VALUE_ACCESSOR } from '@angular/forms';\nimport { randomHash } from '@seniorsistemas/angular-components/utils';\nimport { RadioButtonComponent } from '../radio-button/radio-button.component';\nimport { RadioButtonGroupItem } from './models/radio-button-group.models';\n\n@Component({\n    selector: 's-radiobutton-group',\n    standalone: true,\n    imports: [FormsModule, RadioButtonComponent],\n    templateUrl: './radio-button-group.component.html',\n    providers: [\n        {\n            provide: NG_VALUE_ACCESSOR,\n            useExisting: forwardRef(() => RadioButtonGroupComponent),\n            multi: true,\n        },\n    ],\n})\nexport class RadioButtonGroupComponent implements ControlValueAccessor {\n    protected onChange: (value: unknown) => void = () => {};\n    protected onTouched: (value: unknown) => void = () => {};\n    protected modelValue = signal<unknown>(undefined);\n\n    readonly disabled = model(false);\n    readonly items = input.required<RadioButtonGroupItem[]>();\n    readonly inputName = input.required<string>();\n    readonly viewMode = input<'horizontal' | 'vertical'>('horizontal');\n\n    registerOnChange(fn: (value: unknown) => void): void {\n        this.onChange = fn;\n    }\n\n    registerOnTouched(fn: () => void): void {\n        this.onTouched = fn;\n    }\n\n    setDisabledState(isDisabled: boolean): void {\n        this.disabled.set(isDisabled);\n    }\n\n    writeValue(value: unknown): void {\n        this.modelValue.set(value);\n    }\n\n    protected radioButtonItems = computed(() => {\n        const items = this.items();\n        return items.map((item) => {\n            return {\n                ...item,\n                hash: randomHash(),\n            };\n        });\n    });\n\n    protected setValue(value: unknown) {\n        if (this.disabled()) {\n            return;\n        }\n\n        this.onChange(value);\n        this.onTouched(value);\n    }\n}\n","<section\n    class=\"flex gap-2\"\n    [class.flex-col]=\"viewMode() === 'horizontal'\"\n>\n    @for (radioButtonItem of radioButtonItems(); track radioButtonItem.hash) {\n        @let itemDisabled = disabled() ? true : radioButtonItem.disabled || false;\n\n        <s-radiobutton\n            [(ngModel)]=\"modelValue\"\n            (ngModelChange)=\"setValue($event)\"\n            [value]=\"radioButtonItem.value\"\n            [buttonDisabled]=\"itemDisabled\"\n            [name]=\"inputName()\"\n            [label]=\"radioButtonItem.label\"\n        >\n        </s-radiobutton>\n    }\n</section>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":";;;;;;;;MAUa,0BAA0B,CAAA;IAC3B,aAAa,GAAmB,EAAE,CAAC;IAE3C,GAAG,CAAC,OAAkB,EAAE,iBAAuC,EAAA;AAC3D,QAAA,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC;YACpB,iBAAiB;AACjB,YAAA,WAAW,EAAE,OAAO;AACvB,SAAA,CAAC,CAAC;KACN;AAED,IAAA,MAAM,CAAC,iBAAuC,EAAA;QAC1C,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC,aAAa,CAAC,MAAM,CAAC,CAAC,IAAI,KAAK,IAAI,CAAC,iBAAiB,KAAK,iBAAiB,CAAC,CAAC;KAC1G;AAED,IAAA,MAAM,CAAC,iBAAuC,EAAA;QAC1C,IAAI,CAAC,aAAa,CAAC,OAAO,CAAC,CAAC,IAAI,KAAI;AAChC,YAAA,IAAI,IAAI,CAAC,WAAW,CAAC,IAAI,EAAE,iBAAiB,CAAC,IAAI,IAAI,CAAC,iBAAiB,KAAK,iBAAiB,EAAE;gBAC3F,IAAI,CAAC,iBAAiB,CAAC,UAAU,CAAC,iBAAiB,CAAC,KAAK,EAAE,CAAC,CAAC;aAChE;AACL,SAAC,CAAC,CAAC;KACN;AAEO,IAAA,WAAW,CACf,EAAE,iBAAiB,EAAE,WAAW,EAAgB,EAChD,wBAA8C,EAAA;QAE9C,IAAI,CAAC,WAAW,EAAE;AACd,YAAA,OAAO,KAAK,CAAC;SAChB;AACD,QAAA,MAAM,WAAW,GAAG,WAAW,CAAC,OAAO,EAAE,IAAI,CAAC;QAC9C,QACI,WAAW,KAAK,iBAAiB,GAAG,SAAS,CAAC,EAAE,OAAO,EAAE,IAAI;YAC7D,iBAAiB,CAAC,IAAI,EAAE,KAAK,wBAAwB,CAAC,IAAI,EAAE,EAC9D;KACL;wGAlCQ,0BAA0B,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,UAAA,EAAA,CAAA,CAAA;AAA1B,IAAA,OAAA,KAAA,GAAA,EAAA,CAAA,qBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,0BAA0B,cAFvB,MAAM,EAAA,CAAA,CAAA;;4FAET,0BAA0B,EAAA,UAAA,EAAA,CAAA;kBAHtC,UAAU;AAAC,YAAA,IAAA,EAAA,CAAA;AACR,oBAAA,UAAU,EAAE,MAAM;AACrB,iBAAA,CAAA;;;MCsBY,oBAAoB,CAAA;AACrB,IAAA,OAAO,EAAE,GAAG,CAAC,CAAC;AACL,IAAA,mBAAmB,GAAG,MAAM,CAAC,0BAA0B,CAAC,CAAC;AACzD,IAAA,QAAQ,GAAG,MAAM,CAAC,QAAQ,CAAC,CAAC;IACrC,OAAO,GAAqB,IAAI,CAAC;AAEtB,IAAA,QAAQ,GAAG,QAAQ,CAAC,MAAK;QACxC,OAAO,IAAI,CAAC,cAAc,EAAE,IAAI,IAAI,CAAC,gBAAgB,EAAE,CAAC;AAC5D,KAAC,CAAC,CAAC;AAEO,IAAA,QAAQ,GAA6B,MAAK,GAAG,CAAC;AAC9C,IAAA,SAAS,GAA6B,MAAK,GAAG,CAAC;IAC/C,OAAO,GAAmB,IAAI,CAAC;AAC/B,IAAA,gBAAgB,GAAG,MAAM,CAAC,KAAK,CAAC,CAAC;AAE3C,IAAA,cAAc,GAAG,KAAK,CAAC,KAAK,CAAC,CAAC;AAC9B,IAAA,KAAK,GAAG,KAAK,CAAC,QAAQ,EAAU,CAAC;AACjC,IAAA,IAAI,GAAG,KAAK,CAAC,QAAQ,EAAU,CAAC;AAChC,IAAA,KAAK,GAAG,KAAK,CAAC,QAAQ,EAAW,CAAC;IAClC,OAAO,GAAG,KAAK,CAAC,CAAe,YAAA,EAAA,oBAAoB,CAAC,EAAE,EAAE,CAAE,CAAA,CAAC,CAAC;IAE5D,YAAY,GAAG,MAAM,EAAc,CAAC;IACpC,cAAc,GAAG,MAAM,EAAc,CAAC;AAEtC,IAAA,gBAAgB,CAAC,EAA4B,EAAA;AACzC,QAAA,IAAI,CAAC,QAAQ,GAAG,EAAE,CAAC;KACtB;AAED,IAAA,iBAAiB,CAAC,EAAc,EAAA;AAC5B,QAAA,IAAI,CAAC,SAAS,GAAG,EAAE,CAAC;KACvB;AAED,IAAA,gBAAgB,CAAC,UAAmB,EAAA;AAChC,QAAA,IAAI,CAAC,gBAAgB,CAAC,GAAG,CAAC,UAAU,CAAC,CAAC;KACzC;AAED,IAAA,UAAU,CAAC,KAAc,EAAA;QACrB,IAAI,CAAC,OAAO,GAAG,KAAK,KAAK,IAAI,CAAC,KAAK,EAAE,CAAC;KACzC;IAED,QAAQ,GAAA;AACJ,QAAA,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC,QAAQ,CAAC,GAAG,CAAC,SAAS,EAAE,IAAI,CAAC,CAAC;AAClD,QAAA,IAAI,IAAI,CAAC,OAAO,EAAE;YACd,IAAI,CAAC,mBAAmB,CAAC,GAAG,CAAC,IAAI,CAAC,OAAO,EAAE,IAAI,CAAC,CAAC;SACpD;KACJ;IAED,WAAW,GAAA;AACP,QAAA,IAAI,IAAI,CAAC,OAAO,EAAE;AACd,YAAA,IAAI,CAAC,mBAAmB,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC;SACzC;KACJ;IAES,QAAQ,GAAA;AACd,QAAA,IAAI,IAAI,CAAC,QAAQ,EAAE,EAAE;YACjB,OAAO;SACV;AACD,QAAA,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC;QACpB,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,KAAK,EAAE,CAAC,CAAC;AAC5B,QAAA,IAAI,CAAC,mBAAmB,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC;QACtC,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,KAAK,EAAE,CAAC,CAAC;KAChC;AAES,IAAA,cAAc,CAAC,KAA4B,EAAA;QACjD,KAAK,CAAC,eAAe,EAAE,CAAC;QACxB,KAAK,CAAC,cAAc,EAAE,CAAC;QACvB,IAAI,CAAC,QAAQ,EAAE,CAAC;KACnB;wGAnEQ,oBAAoB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAApB,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,IAAA,EAAA,oBAAoB,EARlB,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,eAAA,EAAA,MAAA,EAAA,EAAA,cAAA,EAAA,EAAA,iBAAA,EAAA,gBAAA,EAAA,UAAA,EAAA,gBAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,KAAA,EAAA,EAAA,iBAAA,EAAA,OAAA,EAAA,UAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,IAAA,EAAA,EAAA,iBAAA,EAAA,MAAA,EAAA,UAAA,EAAA,MAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,KAAA,EAAA,EAAA,iBAAA,EAAA,OAAA,EAAA,UAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,OAAA,EAAA,EAAA,iBAAA,EAAA,SAAA,EAAA,UAAA,EAAA,SAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,EAAA,OAAA,EAAA,EAAA,cAAA,EAAA,sBAAA,EAAA,KAAA,EAAA,aAAA,EAAA,YAAA,EAAA,cAAA,EAAA,cAAA,EAAA,gBAAA,EAAA,EAAA,SAAA,EAAA;AACP,YAAA;AACI,gBAAA,OAAO,EAAE,iBAAiB;AAC1B,gBAAA,WAAW,EAAE,UAAU,CAAC,MAAM,oBAAoB,CAAC;AACnD,gBAAA,KAAK,EAAE,IAAI;AACd,aAAA;AACJ,SAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,EC7BL,wgDA4CA,EDvBc,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EAAA,WAAW,EAAE,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,OAAO,oFAAE,2BAA2B,EAAA,QAAA,EAAA,uBAAA,EAAA,MAAA,EAAA,CAAA,WAAA,EAAA,UAAA,EAAA,iBAAA,CAAA,EAAA,OAAA,EAAA,CAAA,qBAAA,CAAA,EAAA,CAAA,EAAA,CAAA,CAAA;;4FAUlD,oBAAoB,EAAA,UAAA,EAAA,CAAA;kBAbhC,SAAS;+BACI,eAAe,EAAA,UAAA,EACb,IAAI,EAAA,OAAA,EACP,CAAC,WAAW,EAAE,OAAO,EAAE,2BAA2B,CAAC,EAEjD,SAAA,EAAA;AACP,wBAAA;AACI,4BAAA,OAAO,EAAE,iBAAiB;AAC1B,4BAAA,WAAW,EAAE,UAAU,CAAC,0BAA0B,CAAC;AACnD,4BAAA,KAAK,EAAE,IAAI;AACd,yBAAA;AACJ,qBAAA,EAAA,QAAA,EAAA,wgDAAA,EAAA,CAAA;;;MEVQ,yBAAyB,CAAA;AACxB,IAAA,QAAQ,GAA6B,MAAK,GAAG,CAAC;AAC9C,IAAA,SAAS,GAA6B,MAAK,GAAG,CAAC;AAC/C,IAAA,UAAU,GAAG,MAAM,CAAU,SAAS,CAAC,CAAC;AAEzC,IAAA,QAAQ,GAAG,KAAK,CAAC,KAAK,CAAC,CAAC;AACxB,IAAA,KAAK,GAAG,KAAK,CAAC,QAAQ,EAA0B,CAAC;AACjD,IAAA,SAAS,GAAG,KAAK,CAAC,QAAQ,EAAU,CAAC;AACrC,IAAA,QAAQ,GAAG,KAAK,CAA4B,YAAY,CAAC,CAAC;AAEnE,IAAA,gBAAgB,CAAC,EAA4B,EAAA;AACzC,QAAA,IAAI,CAAC,QAAQ,GAAG,EAAE,CAAC;KACtB;AAED,IAAA,iBAAiB,CAAC,EAAc,EAAA;AAC5B,QAAA,IAAI,CAAC,SAAS,GAAG,EAAE,CAAC;KACvB;AAED,IAAA,gBAAgB,CAAC,UAAmB,EAAA;AAChC,QAAA,IAAI,CAAC,QAAQ,CAAC,GAAG,CAAC,UAAU,CAAC,CAAC;KACjC;AAED,IAAA,UAAU,CAAC,KAAc,EAAA;AACrB,QAAA,IAAI,CAAC,UAAU,CAAC,GAAG,CAAC,KAAK,CAAC,CAAC;KAC9B;AAES,IAAA,gBAAgB,GAAG,QAAQ,CAAC,MAAK;AACvC,QAAA,MAAM,KAAK,GAAG,IAAI,CAAC,KAAK,EAAE,CAAC;AAC3B,QAAA,OAAO,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,KAAI;YACtB,OAAO;AACH,gBAAA,GAAG,IAAI;gBACP,IAAI,EAAE,UAAU,EAAE;aACrB,CAAC;AACN,SAAC,CAAC,CAAC;AACP,KAAC,CAAC,CAAC;AAEO,IAAA,QAAQ,CAAC,KAAc,EAAA;AAC7B,QAAA,IAAI,IAAI,CAAC,QAAQ,EAAE,EAAE;YACjB,OAAO;SACV;AAED,QAAA,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC;AACrB,QAAA,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,CAAC;KACzB;wGA3CQ,yBAAyB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAAzB,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,IAAA,EAAA,yBAAyB,EARvB,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,qBAAA,EAAA,MAAA,EAAA,EAAA,QAAA,EAAA,EAAA,iBAAA,EAAA,UAAA,EAAA,UAAA,EAAA,UAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,KAAA,EAAA,EAAA,iBAAA,EAAA,OAAA,EAAA,UAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,SAAA,EAAA,EAAA,iBAAA,EAAA,WAAA,EAAA,UAAA,EAAA,WAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,QAAA,EAAA,EAAA,iBAAA,EAAA,UAAA,EAAA,UAAA,EAAA,UAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,EAAA,OAAA,EAAA,EAAA,QAAA,EAAA,gBAAA,EAAA,EAAA,SAAA,EAAA;AACP,YAAA;AACI,gBAAA,OAAO,EAAE,iBAAiB;AAC1B,gBAAA,WAAW,EAAE,UAAU,CAAC,MAAM,yBAAyB,CAAC;AACxD,gBAAA,KAAK,EAAE,IAAI;AACd,aAAA;AACJ,SAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,ECjBL,gmBAkBA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EDTc,WAAW,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,eAAA,EAAA,QAAA,EAAA,2CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,OAAA,EAAA,QAAA,EAAA,qDAAA,EAAA,MAAA,EAAA,CAAA,MAAA,EAAA,UAAA,EAAA,SAAA,EAAA,gBAAA,CAAA,EAAA,OAAA,EAAA,CAAA,eAAA,CAAA,EAAA,QAAA,EAAA,CAAA,SAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAE,oBAAoB,EAAA,QAAA,EAAA,eAAA,EAAA,MAAA,EAAA,CAAA,gBAAA,EAAA,OAAA,EAAA,MAAA,EAAA,OAAA,EAAA,SAAA,CAAA,EAAA,OAAA,EAAA,CAAA,sBAAA,EAAA,aAAA,EAAA,cAAA,EAAA,gBAAA,CAAA,EAAA,CAAA,EAAA,CAAA,CAAA;;4FAUlC,yBAAyB,EAAA,UAAA,EAAA,CAAA;kBAbrC,SAAS;+BACI,qBAAqB,EAAA,UAAA,EACnB,IAAI,EACP,OAAA,EAAA,CAAC,WAAW,EAAE,oBAAoB,CAAC,EAEjC,SAAA,EAAA;AACP,wBAAA;AACI,4BAAA,OAAO,EAAE,iBAAiB;AAC1B,4BAAA,WAAW,EAAE,UAAU,CAAC,+BAA+B,CAAC;AACxD,4BAAA,KAAK,EAAE,IAAI;AACd,yBAAA;AACJ,qBAAA,EAAA,QAAA,EAAA,gmBAAA,EAAA,CAAA;;;AEjBL;;AAEG;;;;"}

package/fesm2022/seniorsistemas-angular-components-rating-scale.mjs

@@ -29,14 +29,14 @@ class RatingScaleComponent {
             this._onChange(this.value);
         }
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: RatingScaleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: RatingScaleComponent, selector: "s-rating-scale", inputs: { nodes: "nodes", startLabel: "startLabel", endLabel: "endLabel", disabled: "disabled" }, providers: [{
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: RatingScaleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: RatingScaleComponent, selector: "s-rating-scale", inputs: { nodes: "nodes", startLabel: "startLabel", endLabel: "endLabel", disabled: "disabled" }, providers: [{
                 provide: NG_VALUE_ACCESSOR,
                 useExisting: forwardRef(() => RatingScaleComponent),
                 multi: true,
             }], ngImport: i0, template: "<div\n    class=\"rating-scale\"\n    [ngClass]=\"{ 'rating-scale--disabled': disabled }\">\n    <div class=\"nodes\">\n        @for (node of nodes; track node.id) {\n            <button\n                class=\"node\"\n                [ngClass]=\"{ 'node--selected': value?.id === node.id && !disabled }\"\n                tabindex=\"0\"\n                (click)=\"onSelect(node)\">\n                @if (node.icon) {\n                    <span\n                        class=\"icon fas\"\n                        [ngClass]=\"node.icon\">\n                    </span>\n                }\n                @if (node.title) {\n                    <span class=\"label\">{{ node.title }}</span>\n                }\n            </button>\n        }\n    </div>\n    <div class=\"labels\">\n        <span>{{ startLabel }}</span>\n        <span>{{ endLabel }}</span>\n    </div>\n</div>", styles: [".rating-scale{display:flex;flex-direction:column}.rating-scale .nodes{display:flex}.rating-scale .nodes .node{align-items:center;background-color:#fff;border-color:#7892a1;border-radius:6px;border-style:solid;border-width:1px;display:flex;flex-grow:1;justify-content:center;margin:0 2px;padding:8px}.rating-scale .nodes .node .icon{color:#6e7280;font-size:1rem}.rating-scale .nodes .node .label{color:#212533;font-size:.875rem;font-weight:400;line-height:150%}.rating-scale .nodes .node .icon,.rating-scale .nodes .node .label{margin:6px}.rating-scale .nodes .node--selected{background-color:#d5e8ec;border-color:#428bca;color:#428bca}.rating-scale .nodes .node:first-child{margin-left:0}.rating-scale .nodes .node:last-child{margin-right:0}.rating-scale .labels{display:flex;justify-content:space-between;padding:12px 0}.rating-scale .labels span{color:#080808;font-family:\"Open Sans\" sans-serif;font-size:.875rem;font-weight:400;line-height:150%}.rating-scale--disabled{opacity:.5}.rating-scale:not(.rating-scale--disabled) .node{cursor:pointer}.rating-scale:not(.rating-scale--disabled) .node:hover{background-color:#dedce5}.rating-scale:not(.rating-scale--disabled) .node:focus{border-width:2px;outline:none}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: RatingScaleComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: RatingScaleComponent, decorators: [{
             type: Component,
             args: [{ selector: "s-rating-scale", providers: [{
                             provide: NG_VALUE_ACCESSOR,
@@ -55,13 +55,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
             }] } });
 
 class RatingScaleModule {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: RatingScaleModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.13", ngImport: i0, type: RatingScaleModule, declarations: [RatingScaleComponent], imports: [CommonModule,
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: RatingScaleModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.14", ngImport: i0, type: RatingScaleModule, declarations: [RatingScaleComponent], imports: [CommonModule,
             ReactiveFormsModule], exports: [RatingScaleComponent] });
-    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: RatingScaleModule, imports: [CommonModule,
+    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: RatingScaleModule, imports: [CommonModule,
             ReactiveFormsModule] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: RatingScaleModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: RatingScaleModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [

package/fesm2022/seniorsistemas-angular-components-select-button.mjs

@@ -10,10 +10,10 @@ class SelectButtonItemComponent {
     first = false;
     last = false;
     disabled = false;
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SelectButtonItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: SelectButtonItemComponent, selector: "s-select-button-item", inputs: { label: "label", active: "active", first: "first", last: "last", disabled: "disabled" }, ngImport: i0, template: "<button\n    class=\"select-button-item\"\n    [ngClass]=\"{\n        'select-button-item--active': active,\n        'select-button-item--disabled': disabled,\n        'select-button-item--first': first,\n        'select-button-item--last': last\n    }\">\n    <span class=\"select-button-item__label\">{{ label }}</span>\n</button>", styles: [".select-button-item{padding:8px 12px;cursor:pointer;background-color:#fff;border:none;border-left:1px solid #c1c1cc;border-top:1px solid #c1c1cc;border-bottom:1px solid #c1c1cc}.select-button-item__label{font-family:\"Open Sans\" sans-serif;font-size:14px}.select-button-item:not(.select-button-item--disabled):not(.select-button-item--active):hover{background-color:#eeebf2}.select-button-item--active,.select-button-item--active:hover{background-color:#c1c1cc;font-weight:700}.select-button-item--disabled{opacity:.5;cursor:default}.select-button-item--first{border-top-left-radius:2px;border-bottom-left-radius:2px}.select-button-item--last{border-right:1px solid #c1c1cc;border-top-right-radius:2px;border-bottom-right-radius:2px}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: SelectButtonItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: SelectButtonItemComponent, selector: "s-select-button-item", inputs: { label: "label", active: "active", first: "first", last: "last", disabled: "disabled" }, ngImport: i0, template: "<button\n    class=\"select-button-item\"\n    [ngClass]=\"{\n        'select-button-item--active': active,\n        'select-button-item--disabled': disabled,\n        'select-button-item--first': first,\n        'select-button-item--last': last\n    }\">\n    <span class=\"select-button-item__label\">{{ label }}</span>\n</button>", styles: [".select-button-item{padding:8px 12px;cursor:pointer;background-color:#fff;border:none;border-left:1px solid #c1c1cc;border-top:1px solid #c1c1cc;border-bottom:1px solid #c1c1cc}.select-button-item__label{font-family:\"Open Sans\" sans-serif;font-size:14px}.select-button-item:not(.select-button-item--disabled):not(.select-button-item--active):hover{background-color:#eeebf2}.select-button-item--active,.select-button-item--active:hover{background-color:#c1c1cc;font-weight:700}.select-button-item--disabled{opacity:.5;cursor:default}.select-button-item--first{border-top-left-radius:2px;border-bottom-left-radius:2px}.select-button-item--last{border-right:1px solid #c1c1cc;border-top-right-radius:2px;border-bottom-right-radius:2px}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SelectButtonItemComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: SelectButtonItemComponent, decorators: [{
             type: Component,
             args: [{ selector: "s-select-button-item", template: "<button\n    class=\"select-button-item\"\n    [ngClass]=\"{\n        'select-button-item--active': active,\n        'select-button-item--disabled': disabled,\n        'select-button-item--first': first,\n        'select-button-item--last': last\n    }\">\n    <span class=\"select-button-item__label\">{{ label }}</span>\n</button>", styles: [".select-button-item{padding:8px 12px;cursor:pointer;background-color:#fff;border:none;border-left:1px solid #c1c1cc;border-top:1px solid #c1c1cc;border-bottom:1px solid #c1c1cc}.select-button-item__label{font-family:\"Open Sans\" sans-serif;font-size:14px}.select-button-item:not(.select-button-item--disabled):not(.select-button-item--active):hover{background-color:#eeebf2}.select-button-item--active,.select-button-item--active:hover{background-color:#c1c1cc;font-weight:700}.select-button-item--disabled{opacity:.5;cursor:default}.select-button-item--first{border-top-left-radius:2px;border-bottom-left-radius:2px}.select-button-item--last{border-right:1px solid #c1c1cc;border-top-right-radius:2px;border-bottom-right-radius:2px}\n"] }]
         }], propDecorators: { label: [{
@@ -117,8 +117,8 @@ class SelectButtonComponent {
         };
         return _compare(item1, item2);
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SelectButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: SelectButtonComponent, selector: "s-select-button", inputs: { items: "items", multiple: "multiple" }, outputs: { itemSelected: "itemSelected", itemClicked: "itemClicked" }, providers: [
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: SelectButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: SelectButtonComponent, selector: "s-select-button", inputs: { items: "items", multiple: "multiple" }, outputs: { itemSelected: "itemSelected", itemClicked: "itemClicked" }, providers: [
             {
                 provide: NG_VALUE_ACCESSOR,
                 useExisting: forwardRef(() => SelectButtonComponent),
@@ -126,7 +126,7 @@ class SelectButtonComponent {
             },
         ], ngImport: i0, template: "<div\n    class=\"select-button\"\n    [ngClass]=\"{ 'select-button--disabled': disabled }\">\n    @for(item of items; track item.value; let i = $index) {\n        <s-select-button-item\n            *ngFor=\"let item of items; index as i\"\n            [label]=\"item.label\"\n            [active]=\"activeItems.has(item)\"\n            [disabled]=\"disabled || (item.disabled ?? false)\"\n            [first]=\"i === 0\"\n            [last]=\"i === items.length - 1\"\n            (click)=\"onItemSelect(item)\">\n        </s-select-button-item>\n    }\n</div>", styles: [".select-button{overflow:hidden}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: SelectButtonItemComponent, selector: "s-select-button-item", inputs: ["label", "active", "first", "last", "disabled"] }] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SelectButtonComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: SelectButtonComponent, decorators: [{
             type: Component,
             args: [{ selector: 's-select-button', providers: [
                         {
@@ -147,12 +147,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
             }] } });
 
 class SelectButtonModule {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SelectButtonModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.13", ngImport: i0, type: SelectButtonModule, declarations: [SelectButtonComponent,
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: SelectButtonModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.14", ngImport: i0, type: SelectButtonModule, declarations: [SelectButtonComponent,
             SelectButtonItemComponent], imports: [CommonModule], exports: [SelectButtonComponent] });
-    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SelectButtonModule, imports: [CommonModule] });
+    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: SelectButtonModule, imports: [CommonModule] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SelectButtonModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: SelectButtonModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [CommonModule],

package/fesm2022/seniorsistemas-angular-components-select.mjs

@@ -28,10 +28,10 @@ class SelectOptionComponent {
         }
         this.selected.emit();
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SelectOptionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: SelectOptionComponent, isStandalone: true, selector: "s-select-option", inputs: { id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: true, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: true, transformFunction: null }, multiple: { classPropertyName: "multiple", publicName: "multiple", isSignal: true, isRequired: true, transformFunction: null }, checkmark: { classPropertyName: "checkmark", publicName: "checkmark", isSignal: true, isRequired: true, transformFunction: null }, isGrouper: { classPropertyName: "isGrouper", publicName: "isGrouper", isSignal: true, isRequired: true, transformFunction: null }, isFocused: { classPropertyName: "isFocused", publicName: "isFocused", isSignal: true, isRequired: true, transformFunction: null }, isSelected: { classPropertyName: "isSelected", publicName: "isSelected", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { isSelected: "isSelectedChange", selected: "selected" }, ngImport: i0, template: "<li\n    [attr.id]=\"id()\"\n    class=\"flex select-none items-center gap-3 px-3 py-2\"\n    [class.hover:bg-grayscale-10]=\"!isGrouper()\"\n    [class.bg-grayscale-10]=\"!isGrouper() && isFocused()\"\n    (click)=\"onClick()\"\n>\n    @if (!isGrouper() && checkmark() && !multiple() && isSelected()) {\n        <i class=\"far fa-check text-grayscale-60\"></i>\n    }\n\n    @if (!isGrouper() && multiple()) {\n        <s-checkbox [checked]=\"isSelected()\"></s-checkbox>\n    }\n    <span\n        class=\"text-grayscale-90\"\n        [class.font-bold]=\"isGrouper()\"\n    >\n        {{ label() }}\n    </span>\n</li>\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: CheckboxComponent, selector: "s-checkbox", inputs: ["disabled", "checked", "indeterminate", "label"], outputs: ["disabledChange", "checkedChange", "indeterminateChange"] }] });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: SelectOptionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: SelectOptionComponent, isStandalone: true, selector: "s-select-option", inputs: { id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: true, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: true, transformFunction: null }, multiple: { classPropertyName: "multiple", publicName: "multiple", isSignal: true, isRequired: true, transformFunction: null }, checkmark: { classPropertyName: "checkmark", publicName: "checkmark", isSignal: true, isRequired: true, transformFunction: null }, isGrouper: { classPropertyName: "isGrouper", publicName: "isGrouper", isSignal: true, isRequired: true, transformFunction: null }, isFocused: { classPropertyName: "isFocused", publicName: "isFocused", isSignal: true, isRequired: true, transformFunction: null }, isSelected: { classPropertyName: "isSelected", publicName: "isSelected", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { isSelected: "isSelectedChange", selected: "selected" }, ngImport: i0, template: "<li\n    [attr.id]=\"id()\"\n    class=\"flex select-none items-center gap-3 px-3 py-2\"\n    [class.hover:bg-grayscale-10]=\"!isGrouper()\"\n    [class.bg-grayscale-10]=\"!isGrouper() && isFocused()\"\n    (click)=\"onClick()\"\n>\n    @if (!isGrouper() && checkmark() && !multiple() && isSelected()) {\n        <i class=\"far fa-check text-grayscale-60\"></i>\n    }\n\n    @if (!isGrouper() && multiple()) {\n        <s-checkbox [checked]=\"isSelected()\"></s-checkbox>\n    }\n    <span\n        class=\"text-grayscale-90\"\n        [class.font-bold]=\"isGrouper()\"\n    >\n        {{ label() }}\n    </span>\n</li>\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: CheckboxComponent, selector: "s-checkbox", inputs: ["disabled", "checked", "indeterminate", "label"], outputs: ["disabledChange", "checkedChange", "indeterminateChange"] }] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SelectOptionComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: SelectOptionComponent, decorators: [{
             type: Component,
             args: [{ selector: 's-select-option', standalone: true, imports: [CommonModule, CheckboxComponent], template: "<li\n    [attr.id]=\"id()\"\n    class=\"flex select-none items-center gap-3 px-3 py-2\"\n    [class.hover:bg-grayscale-10]=\"!isGrouper()\"\n    [class.bg-grayscale-10]=\"!isGrouper() && isFocused()\"\n    (click)=\"onClick()\"\n>\n    @if (!isGrouper() && checkmark() && !multiple() && isSelected()) {\n        <i class=\"far fa-check text-grayscale-60\"></i>\n    }\n\n    @if (!isGrouper() && multiple()) {\n        <s-checkbox [checked]=\"isSelected()\"></s-checkbox>\n    }\n    <span\n        class=\"text-grayscale-90\"\n        [class.font-bold]=\"isGrouper()\"\n    >\n        {{ label() }}\n    </span>\n</li>\n" }]
         }] });
@@ -703,16 +703,16 @@ class SelectComponent {
             this._portalHost.detach();
         }
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SelectComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: SelectComponent, isStandalone: true, selector: "s-select", inputs: { placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, multiple: { classPropertyName: "multiple", publicName: "multiple", isSignal: true, isRequired: false, transformFunction: null }, options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: true, transformFunction: null }, optionLabel: { classPropertyName: "optionLabel", publicName: "optionLabel", isSignal: true, isRequired: false, transformFunction: null }, optionValue: { classPropertyName: "optionValue", publicName: "optionValue", isSignal: true, isRequired: false, transformFunction: null }, showClear: { classPropertyName: "showClear", publicName: "showClear", isSignal: true, isRequired: false, transformFunction: null }, filter: { classPropertyName: "filter", publicName: "filter", isSignal: true, isRequired: false, transformFunction: null }, checkmark: { classPropertyName: "checkmark", publicName: "checkmark", isSignal: true, isRequired: false, transformFunction: null }, filterBy: { classPropertyName: "filterBy", publicName: "filterBy", isSignal: true, isRequired: false, transformFunction: null }, group: { classPropertyName: "group", publicName: "group", isSignal: true, isRequired: false, transformFunction: null }, virtualScroll: { classPropertyName: "virtualScroll", publicName: "virtualScroll", isSignal: true, isRequired: false, transformFunction: null }, virtualScrollItemSize: { classPropertyName: "virtualScrollItemSize", publicName: "virtualScrollItemSize", isSignal: true, isRequired: false, transformFunction: null }, emptyMessage: { classPropertyName: "emptyMessage", publicName: "emptyMessage", isSignal: true, isRequired: false, transformFunction: null }, useRawValue: { classPropertyName: "useRawValue", publicName: "useRawValue", isSignal: true, isRequired: false, transformFunction: null }, dataKey: { classPropertyName: "dataKey", publicName: "dataKey", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { disabled: "disabledChange" }, host: { listeners: { "document:click": "onDocumentClick($event)", "window:resize": "onWindowResize($event)" } }, providers: [
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: SelectComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: SelectComponent, isStandalone: true, selector: "s-select", inputs: { placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, multiple: { classPropertyName: "multiple", publicName: "multiple", isSignal: true, isRequired: false, transformFunction: null }, options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: true, transformFunction: null }, optionLabel: { classPropertyName: "optionLabel", publicName: "optionLabel", isSignal: true, isRequired: false, transformFunction: null }, optionValue: { classPropertyName: "optionValue", publicName: "optionValue", isSignal: true, isRequired: false, transformFunction: null }, showClear: { classPropertyName: "showClear", publicName: "showClear", isSignal: true, isRequired: false, transformFunction: null }, filter: { classPropertyName: "filter", publicName: "filter", isSignal: true, isRequired: false, transformFunction: null }, checkmark: { classPropertyName: "checkmark", publicName: "checkmark", isSignal: true, isRequired: false, transformFunction: null }, filterBy: { classPropertyName: "filterBy", publicName: "filterBy", isSignal: true, isRequired: false, transformFunction: null }, group: { classPropertyName: "group", publicName: "group", isSignal: true, isRequired: false, transformFunction: null }, virtualScroll: { classPropertyName: "virtualScroll", publicName: "virtualScroll", isSignal: true, isRequired: false, transformFunction: null }, virtualScrollItemSize: { classPropertyName: "virtualScrollItemSize", publicName: "virtualScrollItemSize", isSignal: true, isRequired: false, transformFunction: null }, emptyMessage: { classPropertyName: "emptyMessage", publicName: "emptyMessage", isSignal: true, isRequired: false, transformFunction: null }, useRawValue: { classPropertyName: "useRawValue", publicName: "useRawValue", isSignal: true, isRequired: false, transformFunction: null }, dataKey: { classPropertyName: "dataKey", publicName: "dataKey", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { disabled: "disabledChange" }, host: { listeners: { "document:click": "onDocumentClick($event)", "window:resize": "onWindowResize($event)" } }, providers: [
             {
                 provide: NG_VALUE_ACCESSOR,
                 useExisting: forwardRef(() => SelectComponent),
                 multi: true,
             },
-        ], viewQueries: [{ propertyName: "_dropdownTemplate", first: true, predicate: ["dropdownTemplate"], descendants: true, isSignal: true }, { propertyName: "_containerDiv", first: true, predicate: ["containerDiv"], descendants: true, isSignal: true }], ngImport: i0, template: "<ng-template #portalAnchor></ng-template>\n\n<div\n    #containerDiv\n    class=\"group flex w-full overflow-hidden rounded-[3px] border outline-1 outline-primary focus:outline\"\n    [ngClass]=\"{\n        'pointer-events-none border-grayscale-20 bg-grayscale-5': disabled(),\n        'pointer-events-auto border-grayscale-30 bg-grayscale-0': !disabled(),\n    }\"\n    [attr.aria-disabled]=\"disabled()\"\n    (click)=\"onContainerDivClick()\"\n    (keydown)=\"onKeyDown($event)\"\n    tabindex=\"0\"\n>\n    <span\n        class=\"flex flex-grow select-none px-3 py-[7px]\"\n        [ngClass]=\"{\n            'text-grayscale-90': !disabled() && !isClean(),\n            'text-grayscale-60': !disabled() && isClean(),\n            'text-grayscale-30': disabled(),\n        }\"\n    >\n        {{ print() || placeholder() }}\n    </span>\n\n    @if (!disabled() && showClear() && !isClean()) {\n        <button\n            class=\"mx-3\"\n            (click)=\"clear($event)\"\n        >\n            <i class=\"fas fa-times flex items-center\"></i>\n        </button>\n    }\n\n    <div\n        class=\"flex items-center border-l px-3 group-hover:bg-grayscale-10 group-focus:border-primary\"\n        [ngClass]=\"{ 'border-grayscale-20': disabled(), 'border-grayscale-30': !disabled() }\"\n    >\n        <i\n            class=\"fas\"\n            [ngClass]=\"{\n                'text-grayscale-30': disabled(),\n                'text-grayscale-90': !disabled(),\n                'fa-caret-down': !showOptions(),\n                'fa-caret-up': showOptions(),\n            }\"\n        ></i>\n    </div>\n</div>\n\n<ng-template #dropdownTemplate>\n    <div\n        class=\"dropdown-body-class z-[999] rounded-[3px] bg-grayscale-0 py-1 shadow-md\"\n        [style.position]=\"'absolute'\"\n        [style.top.px]=\"dropTop\"\n        [style.left.px]=\"dropLeft\"\n        (click)=\"$event.stopPropagation()\"\n    >\n        @if (filter()) {\n            <div class=\"flex w-full items-center gap-3 px-3 py-1.5\">\n                @if (multiple()) {\n                    <s-checkbox\n                        #selectAllCheckbox\n                        [checked]=\"allSelected()\"\n                        [indeterminate]=\"selectAllIsIndeterminate()\"\n                        (checkedChange)=\"toggleSelectAll()\"\n                    ></s-checkbox>\n                }\n\n                <div class=\"relative flex h-[35px] grow\">\n                    <form\n                        class=\"flex grow\"\n                        [formGroup]=\"filterForm\"\n                    >\n                        <input\n                            class=\"w-full grow rounded-[3px] border border-grayscale-30 pl-2.5 pr-7 outline-1 outline-primary\"\n                            type=\"text\"\n                            formControlName=\"filter\"\n                            (click)=\"$event.stopPropagation()\"\n                        />\n                    </form>\n                    <i class=\"fas fa-search absolute right-2.5 top-2.5 text-grayscale-90\"></i>\n                </div>\n                <button (click)=\"clearFilter()\">\n                    <i class=\"fas fa-times flex items-center\"></i>\n                </button>\n            </div>\n        }\n\n        <!-- Virtual scroll -->\n        @if (virtualScroll() && filteredOptions().length > 10) {\n            <cdk-virtual-scroll-viewport\n                [itemSize]=\"virtualScrollItemSize()\"\n                class=\"h-52 overflow-auto\"\n            >\n                <ng-container *cdkVirtualFor=\"let option of filteredOptions(); trackBy: trackById\">\n                    <s-select-option\n                        [id]=\"option.id\"\n                        [label]=\"getOptionLabel(option.data)\"\n                        [multiple]=\"multiple()\"\n                        [checkmark]=\"checkmark()\"\n                        [isSelected]=\"isOptionSelected(option.data)\"\n                        (selected)=\"selectItem(option.data)\"\n                        [isGrouper]=\"option.grouper\"\n                        [isFocused]=\"option.data === focusedItem()\"\n                    ></s-select-option>\n                </ng-container>\n            </cdk-virtual-scroll-viewport>\n        }\n\n        <!-- Normal list -->\n        @if (!virtualScroll() || filteredOptions().length <= 10) {\n            <ul class=\"max-h-52 overflow-auto\">\n                @for (option of filteredOptions(); track option.id) {\n                    <s-select-option\n                        [id]=\"option.id\"\n                        [label]=\"getOptionLabel(option.data)\"\n                        [multiple]=\"multiple()\"\n                        [checkmark]=\"checkmark()\"\n                        [isSelected]=\"isOptionSelected(option.data)\"\n                        (selected)=\"selectItem(option.data)\"\n                        [isGrouper]=\"option.grouper ?? false\"\n                        [isFocused]=\"option.data === focusedItem()\"\n                    ></s-select-option>\n                }\n            </ul>\n        }\n\n        @if (filteredOptions().length === 0) {\n            <span class=\"m-3 text-grayscale-60\">{{\n                emptyMessage() ?? 'platform.angular_components.no_records_found' | translate\n            }}</span>\n        }\n    </div>\n</ng-template>\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: ScrollingModule }, { kind: "directive", type: i3.CdkFixedSizeVirtualScroll, selector: "cdk-virtual-scroll-viewport[itemSize]", inputs: ["itemSize", "minBufferPx", "maxBufferPx"] }, { kind: "directive", type: i3.CdkVirtualForOf, selector: "[cdkVirtualFor][cdkVirtualForOf]", inputs: ["cdkVirtualForOf", "cdkVirtualForTrackBy", "cdkVirtualForTemplate", "cdkVirtualForTemplateCacheSize"] }, { kind: "component", type: i3.CdkVirtualScrollViewport, selector: "cdk-virtual-scroll-viewport", inputs: ["orientation", "appendOnly"], outputs: ["scrolledIndexChange"] }, { kind: "component", type: SelectOptionComponent, selector: "s-select-option", inputs: ["id", "label", "multiple", "checkmark", "isGrouper", "isFocused", "isSelected"], outputs: ["isSelectedChange", "selected"] }, { kind: "component", type: CheckboxComponent, selector: "s-checkbox", inputs: ["disabled", "checked", "indeterminate", "label"], outputs: ["disabledChange", "checkedChange", "indeterminateChange"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i4.TranslatePipe, name: "translate" }] });
+        ], viewQueries: [{ propertyName: "_dropdownTemplate", first: true, predicate: ["dropdownTemplate"], descendants: true, isSignal: true }, { propertyName: "_containerDiv", first: true, predicate: ["containerDiv"], descendants: true, isSignal: true }], ngImport: i0, template: "<ng-template #portalAnchor></ng-template>\n\n<div\n    #containerDiv\n    class=\"group flex w-full overflow-hidden rounded-[3px] border outline-1 outline-primary focus:outline\"\n    [ngClass]=\"{\n        'pointer-events-none border-grayscale-20 bg-grayscale-5': disabled(),\n        'pointer-events-auto border-grayscale-30 bg-grayscale-0': !disabled(),\n    }\"\n    [attr.aria-disabled]=\"disabled()\"\n    (click)=\"onContainerDivClick()\"\n    (keydown)=\"onKeyDown($event)\"\n    tabindex=\"0\"\n>\n    <span\n        class=\"flex flex-grow select-none px-3 py-[7px]\"\n        [ngClass]=\"{\n            'text-grayscale-90': !disabled() && !isClean(),\n            'text-grayscale-60': !disabled() && isClean(),\n            'text-grayscale-30': disabled(),\n        }\"\n    >\n        {{ print() || placeholder() }}\n    </span>\n\n    @if (!disabled() && showClear() && !isClean()) {\n        <button\n            class=\"mx-3\"\n            (click)=\"clear($event)\"\n        >\n            <i class=\"fas fa-times flex items-center\"></i>\n        </button>\n    }\n\n    <div\n        class=\"flex items-center border-l px-3 group-hover:bg-grayscale-10 group-focus:border-primary\"\n        [ngClass]=\"{ 'border-grayscale-20': disabled(), 'border-grayscale-30': !disabled() }\"\n    >\n        <i\n            class=\"fas\"\n            [ngClass]=\"{\n                'text-grayscale-30': disabled(),\n                'text-grayscale-90': !disabled(),\n                'fa-caret-down': !showOptions(),\n                'fa-caret-up': showOptions(),\n            }\"\n        ></i>\n    </div>\n</div>\n\n<ng-template #dropdownTemplate>\n    <div\n        class=\"dropdown-body-class z-[1000] rounded-[3px] bg-grayscale-0 py-1 shadow-md\"\n        [style.position]=\"'absolute'\"\n        [style.top.px]=\"dropTop\"\n        [style.left.px]=\"dropLeft\"\n        (click)=\"$event.stopPropagation()\"\n    >\n        @if (filter()) {\n            <div class=\"flex w-full items-center gap-3 px-3 py-1.5\">\n                @if (multiple()) {\n                    <s-checkbox\n                        #selectAllCheckbox\n                        [checked]=\"allSelected()\"\n                        [indeterminate]=\"selectAllIsIndeterminate()\"\n                        (checkedChange)=\"toggleSelectAll()\"\n                    ></s-checkbox>\n                }\n\n                <div class=\"relative flex h-[35px] grow\">\n                    <form\n                        class=\"flex grow\"\n                        [formGroup]=\"filterForm\"\n                    >\n                        <input\n                            class=\"w-full grow rounded-[3px] border border-grayscale-30 pl-2.5 pr-7 outline-1 outline-primary\"\n                            type=\"text\"\n                            formControlName=\"filter\"\n                            (click)=\"$event.stopPropagation()\"\n                        />\n                    </form>\n                    <i class=\"fas fa-search absolute right-2.5 top-2.5 text-grayscale-90\"></i>\n                </div>\n                <button (click)=\"clearFilter()\">\n                    <i class=\"fas fa-times flex items-center\"></i>\n                </button>\n            </div>\n        }\n\n        <!-- Virtual scroll -->\n        @if (virtualScroll() && filteredOptions().length > 10) {\n            <cdk-virtual-scroll-viewport\n                [itemSize]=\"virtualScrollItemSize()\"\n                class=\"h-52 overflow-auto\"\n            >\n                <ng-container *cdkVirtualFor=\"let option of filteredOptions(); trackBy: trackById\">\n                    <s-select-option\n                        [id]=\"option.id\"\n                        [label]=\"getOptionLabel(option.data)\"\n                        [multiple]=\"multiple()\"\n                        [checkmark]=\"checkmark()\"\n                        [isSelected]=\"isOptionSelected(option.data)\"\n                        (selected)=\"selectItem(option.data)\"\n                        [isGrouper]=\"option.grouper\"\n                        [isFocused]=\"option.data === focusedItem()\"\n                    ></s-select-option>\n                </ng-container>\n            </cdk-virtual-scroll-viewport>\n        }\n\n        <!-- Normal list -->\n        @if (!virtualScroll() || filteredOptions().length <= 10) {\n            <ul class=\"max-h-52 overflow-auto\">\n                @for (option of filteredOptions(); track option.id) {\n                    <s-select-option\n                        [id]=\"option.id\"\n                        [label]=\"getOptionLabel(option.data)\"\n                        [multiple]=\"multiple()\"\n                        [checkmark]=\"checkmark()\"\n                        [isSelected]=\"isOptionSelected(option.data)\"\n                        (selected)=\"selectItem(option.data)\"\n                        [isGrouper]=\"option.grouper ?? false\"\n                        [isFocused]=\"option.data === focusedItem()\"\n                    ></s-select-option>\n                }\n            </ul>\n        }\n\n        @if (filteredOptions().length === 0) {\n            <span class=\"m-3 text-grayscale-60\">{{\n                emptyMessage() ?? 'platform.angular_components.no_records_found' | translate\n            }}</span>\n        }\n    </div>\n</ng-template>\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: ScrollingModule }, { kind: "directive", type: i3.CdkFixedSizeVirtualScroll, selector: "cdk-virtual-scroll-viewport[itemSize]", inputs: ["itemSize", "minBufferPx", "maxBufferPx"] }, { kind: "directive", type: i3.CdkVirtualForOf, selector: "[cdkVirtualFor][cdkVirtualForOf]", inputs: ["cdkVirtualForOf", "cdkVirtualForTrackBy", "cdkVirtualForTemplate", "cdkVirtualForTemplateCacheSize"] }, { kind: "component", type: i3.CdkVirtualScrollViewport, selector: "cdk-virtual-scroll-viewport", inputs: ["orientation", "appendOnly"], outputs: ["scrolledIndexChange"] }, { kind: "component", type: SelectOptionComponent, selector: "s-select-option", inputs: ["id", "label", "multiple", "checkmark", "isGrouper", "isFocused", "isSelected"], outputs: ["isSelectedChange", "selected"] }, { kind: "component", type: CheckboxComponent, selector: "s-checkbox", inputs: ["disabled", "checked", "indeterminate", "label"], outputs: ["disabledChange", "checkedChange", "indeterminateChange"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i4.TranslatePipe, name: "translate" }] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SelectComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: SelectComponent, decorators: [{
             type: Component,
             args: [{ selector: 's-select', standalone: true, imports: [
                         CommonModule,
@@ -730,7 +730,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
                             useExisting: forwardRef(() => SelectComponent),
                             multi: true,
                         },
-                    ], template: "<ng-template #portalAnchor></ng-template>\n\n<div\n    #containerDiv\n    class=\"group flex w-full overflow-hidden rounded-[3px] border outline-1 outline-primary focus:outline\"\n    [ngClass]=\"{\n        'pointer-events-none border-grayscale-20 bg-grayscale-5': disabled(),\n        'pointer-events-auto border-grayscale-30 bg-grayscale-0': !disabled(),\n    }\"\n    [attr.aria-disabled]=\"disabled()\"\n    (click)=\"onContainerDivClick()\"\n    (keydown)=\"onKeyDown($event)\"\n    tabindex=\"0\"\n>\n    <span\n        class=\"flex flex-grow select-none px-3 py-[7px]\"\n        [ngClass]=\"{\n            'text-grayscale-90': !disabled() && !isClean(),\n            'text-grayscale-60': !disabled() && isClean(),\n            'text-grayscale-30': disabled(),\n        }\"\n    >\n        {{ print() || placeholder() }}\n    </span>\n\n    @if (!disabled() && showClear() && !isClean()) {\n        <button\n            class=\"mx-3\"\n            (click)=\"clear($event)\"\n        >\n            <i class=\"fas fa-times flex items-center\"></i>\n        </button>\n    }\n\n    <div\n        class=\"flex items-center border-l px-3 group-hover:bg-grayscale-10 group-focus:border-primary\"\n        [ngClass]=\"{ 'border-grayscale-20': disabled(), 'border-grayscale-30': !disabled() }\"\n    >\n        <i\n            class=\"fas\"\n            [ngClass]=\"{\n                'text-grayscale-30': disabled(),\n                'text-grayscale-90': !disabled(),\n                'fa-caret-down': !showOptions(),\n                'fa-caret-up': showOptions(),\n            }\"\n        ></i>\n    </div>\n</div>\n\n<ng-template #dropdownTemplate>\n    <div\n        class=\"dropdown-body-class z-[999] rounded-[3px] bg-grayscale-0 py-1 shadow-md\"\n        [style.position]=\"'absolute'\"\n        [style.top.px]=\"dropTop\"\n        [style.left.px]=\"dropLeft\"\n        (click)=\"$event.stopPropagation()\"\n    >\n        @if (filter()) {\n            <div class=\"flex w-full items-center gap-3 px-3 py-1.5\">\n                @if (multiple()) {\n                    <s-checkbox\n                        #selectAllCheckbox\n                        [checked]=\"allSelected()\"\n                        [indeterminate]=\"selectAllIsIndeterminate()\"\n                        (checkedChange)=\"toggleSelectAll()\"\n                    ></s-checkbox>\n                }\n\n                <div class=\"relative flex h-[35px] grow\">\n                    <form\n                        class=\"flex grow\"\n                        [formGroup]=\"filterForm\"\n                    >\n                        <input\n                            class=\"w-full grow rounded-[3px] border border-grayscale-30 pl-2.5 pr-7 outline-1 outline-primary\"\n                            type=\"text\"\n                            formControlName=\"filter\"\n                            (click)=\"$event.stopPropagation()\"\n                        />\n                    </form>\n                    <i class=\"fas fa-search absolute right-2.5 top-2.5 text-grayscale-90\"></i>\n                </div>\n                <button (click)=\"clearFilter()\">\n                    <i class=\"fas fa-times flex items-center\"></i>\n                </button>\n            </div>\n        }\n\n        <!-- Virtual scroll -->\n        @if (virtualScroll() && filteredOptions().length > 10) {\n            <cdk-virtual-scroll-viewport\n                [itemSize]=\"virtualScrollItemSize()\"\n                class=\"h-52 overflow-auto\"\n            >\n                <ng-container *cdkVirtualFor=\"let option of filteredOptions(); trackBy: trackById\">\n                    <s-select-option\n                        [id]=\"option.id\"\n                        [label]=\"getOptionLabel(option.data)\"\n                        [multiple]=\"multiple()\"\n                        [checkmark]=\"checkmark()\"\n                        [isSelected]=\"isOptionSelected(option.data)\"\n                        (selected)=\"selectItem(option.data)\"\n                        [isGrouper]=\"option.grouper\"\n                        [isFocused]=\"option.data === focusedItem()\"\n                    ></s-select-option>\n                </ng-container>\n            </cdk-virtual-scroll-viewport>\n        }\n\n        <!-- Normal list -->\n        @if (!virtualScroll() || filteredOptions().length <= 10) {\n            <ul class=\"max-h-52 overflow-auto\">\n                @for (option of filteredOptions(); track option.id) {\n                    <s-select-option\n                        [id]=\"option.id\"\n                        [label]=\"getOptionLabel(option.data)\"\n                        [multiple]=\"multiple()\"\n                        [checkmark]=\"checkmark()\"\n                        [isSelected]=\"isOptionSelected(option.data)\"\n                        (selected)=\"selectItem(option.data)\"\n                        [isGrouper]=\"option.grouper ?? false\"\n                        [isFocused]=\"option.data === focusedItem()\"\n                    ></s-select-option>\n                }\n            </ul>\n        }\n\n        @if (filteredOptions().length === 0) {\n            <span class=\"m-3 text-grayscale-60\">{{\n                emptyMessage() ?? 'platform.angular_components.no_records_found' | translate\n            }}</span>\n        }\n    </div>\n</ng-template>\n" }]
+                    ], template: "<ng-template #portalAnchor></ng-template>\n\n<div\n    #containerDiv\n    class=\"group flex w-full overflow-hidden rounded-[3px] border outline-1 outline-primary focus:outline\"\n    [ngClass]=\"{\n        'pointer-events-none border-grayscale-20 bg-grayscale-5': disabled(),\n        'pointer-events-auto border-grayscale-30 bg-grayscale-0': !disabled(),\n    }\"\n    [attr.aria-disabled]=\"disabled()\"\n    (click)=\"onContainerDivClick()\"\n    (keydown)=\"onKeyDown($event)\"\n    tabindex=\"0\"\n>\n    <span\n        class=\"flex flex-grow select-none px-3 py-[7px]\"\n        [ngClass]=\"{\n            'text-grayscale-90': !disabled() && !isClean(),\n            'text-grayscale-60': !disabled() && isClean(),\n            'text-grayscale-30': disabled(),\n        }\"\n    >\n        {{ print() || placeholder() }}\n    </span>\n\n    @if (!disabled() && showClear() && !isClean()) {\n        <button\n            class=\"mx-3\"\n            (click)=\"clear($event)\"\n        >\n            <i class=\"fas fa-times flex items-center\"></i>\n        </button>\n    }\n\n    <div\n        class=\"flex items-center border-l px-3 group-hover:bg-grayscale-10 group-focus:border-primary\"\n        [ngClass]=\"{ 'border-grayscale-20': disabled(), 'border-grayscale-30': !disabled() }\"\n    >\n        <i\n            class=\"fas\"\n            [ngClass]=\"{\n                'text-grayscale-30': disabled(),\n                'text-grayscale-90': !disabled(),\n                'fa-caret-down': !showOptions(),\n                'fa-caret-up': showOptions(),\n            }\"\n        ></i>\n    </div>\n</div>\n\n<ng-template #dropdownTemplate>\n    <div\n        class=\"dropdown-body-class z-[1000] rounded-[3px] bg-grayscale-0 py-1 shadow-md\"\n        [style.position]=\"'absolute'\"\n        [style.top.px]=\"dropTop\"\n        [style.left.px]=\"dropLeft\"\n        (click)=\"$event.stopPropagation()\"\n    >\n        @if (filter()) {\n            <div class=\"flex w-full items-center gap-3 px-3 py-1.5\">\n                @if (multiple()) {\n                    <s-checkbox\n                        #selectAllCheckbox\n                        [checked]=\"allSelected()\"\n                        [indeterminate]=\"selectAllIsIndeterminate()\"\n                        (checkedChange)=\"toggleSelectAll()\"\n                    ></s-checkbox>\n                }\n\n                <div class=\"relative flex h-[35px] grow\">\n                    <form\n                        class=\"flex grow\"\n                        [formGroup]=\"filterForm\"\n                    >\n                        <input\n                            class=\"w-full grow rounded-[3px] border border-grayscale-30 pl-2.5 pr-7 outline-1 outline-primary\"\n                            type=\"text\"\n                            formControlName=\"filter\"\n                            (click)=\"$event.stopPropagation()\"\n                        />\n                    </form>\n                    <i class=\"fas fa-search absolute right-2.5 top-2.5 text-grayscale-90\"></i>\n                </div>\n                <button (click)=\"clearFilter()\">\n                    <i class=\"fas fa-times flex items-center\"></i>\n                </button>\n            </div>\n        }\n\n        <!-- Virtual scroll -->\n        @if (virtualScroll() && filteredOptions().length > 10) {\n            <cdk-virtual-scroll-viewport\n                [itemSize]=\"virtualScrollItemSize()\"\n                class=\"h-52 overflow-auto\"\n            >\n                <ng-container *cdkVirtualFor=\"let option of filteredOptions(); trackBy: trackById\">\n                    <s-select-option\n                        [id]=\"option.id\"\n                        [label]=\"getOptionLabel(option.data)\"\n                        [multiple]=\"multiple()\"\n                        [checkmark]=\"checkmark()\"\n                        [isSelected]=\"isOptionSelected(option.data)\"\n                        (selected)=\"selectItem(option.data)\"\n                        [isGrouper]=\"option.grouper\"\n                        [isFocused]=\"option.data === focusedItem()\"\n                    ></s-select-option>\n                </ng-container>\n            </cdk-virtual-scroll-viewport>\n        }\n\n        <!-- Normal list -->\n        @if (!virtualScroll() || filteredOptions().length <= 10) {\n            <ul class=\"max-h-52 overflow-auto\">\n                @for (option of filteredOptions(); track option.id) {\n                    <s-select-option\n                        [id]=\"option.id\"\n                        [label]=\"getOptionLabel(option.data)\"\n                        [multiple]=\"multiple()\"\n                        [checkmark]=\"checkmark()\"\n                        [isSelected]=\"isOptionSelected(option.data)\"\n                        (selected)=\"selectItem(option.data)\"\n                        [isGrouper]=\"option.grouper ?? false\"\n                        [isFocused]=\"option.data === focusedItem()\"\n                    ></s-select-option>\n                }\n            </ul>\n        }\n\n        @if (filteredOptions().length === 0) {\n            <span class=\"m-3 text-grayscale-60\">{{\n                emptyMessage() ?? 'platform.angular_components.no_records_found' | translate\n            }}</span>\n        }\n    </div>\n</ng-template>\n" }]
         }] });
 
 /**