sidesys-generic-ui 0.0.26 → 0.0.27-beta

package/esm2022/lib/input/components/validation-error/s-validation-error.component.mjs

@@ -0,0 +1,33 @@
+import { Component, Input, ViewEncapsulation } from '@angular/core';
+import * as i0 from "@angular/core";
+import * as i1 from "@angular/common";
+import * as i2 from "../error-control/s-error-control.component";
+export class SValidationError {
+    constructor() {
+        this.errors = {};
+        this.customErrorMessages = {};
+        this.errorMessages = {
+            required: 'Campo requerido.',
+        };
+    }
+    ngOnChanges(changes) {
+        const { customErrorMessages } = changes;
+        if (customErrorMessages) {
+            this.errorMessages = {
+                ...this.errorMessages,
+                ...customErrorMessages.currentValue,
+            };
+        }
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: SValidationError, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.3", type: SValidationError, selector: "s-validation-error", inputs: { errors: "errors", customErrorMessages: "customErrorMessages" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"s-validation-errors\">\r\n  <s-error-control *ngFor=\"let error of errors | keyvalue\" theme =\"red\">\r\n    {{ errorMessages[error.key] }}\r\n  </s-error-control>\r\n</div>", styles: [".s-validation-errors{margin:0}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: i2.SErrorControl, selector: "s-error-control", inputs: ["theme", "icon", "iconCustom", "size"] }, { kind: "pipe", type: i1.KeyValuePipe, name: "keyvalue" }], encapsulation: i0.ViewEncapsulation.None }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: SValidationError, decorators: [{
+            type: Component,
+            args: [{ selector: 's-validation-error', encapsulation: ViewEncapsulation.None, template: "<div class=\"s-validation-errors\">\r\n  <s-error-control *ngFor=\"let error of errors | keyvalue\" theme =\"red\">\r\n    {{ errorMessages[error.key] }}\r\n  </s-error-control>\r\n</div>", styles: [".s-validation-errors{margin:0}\n"] }]
+        }], propDecorators: { errors: [{
+                type: Input
+            }], customErrorMessages: [{
+                type: Input
+            }] } });
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicy12YWxpZGF0aW9uLWVycm9yLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL3NpZGVzeXMtZ2VuZXJpYy11aS9zcmMvbGliL2lucHV0L2NvbXBvbmVudHMvdmFsaWRhdGlvbi1lcnJvci9zLXZhbGlkYXRpb24tZXJyb3IuY29tcG9uZW50LnRzIiwiLi4vLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvc2lkZXN5cy1nZW5lcmljLXVpL3NyYy9saWIvaW5wdXQvY29tcG9uZW50cy92YWxpZGF0aW9uLWVycm9yL3MtdmFsaWRhdGlvbi1lcnJvci5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsU0FBUyxFQUFFLEtBQUssRUFBNEIsaUJBQWlCLEVBQUUsTUFBTSxlQUFlLENBQUM7Ozs7QUFTOUYsTUFBTSxPQUFPLGdCQUFnQjtJQU43QjtRQVFXLFdBQU0sR0FBNEMsRUFBRSxDQUFDO1FBQ3JELHdCQUFtQixHQUEyQixFQUFFLENBQUM7UUFDMUQsa0JBQWEsR0FBMkI7WUFDdEMsUUFBUSxFQUFFLGtCQUFrQjtTQUM3QixDQUFDO0tBV0g7SUFUQyxXQUFXLENBQUMsT0FBc0I7UUFDaEMsTUFBTSxFQUFFLG1CQUFtQixFQUFFLEdBQUcsT0FBTyxDQUFDO1FBQ3hDLElBQUksbUJBQW1CLEVBQUU7WUFDdkIsSUFBSSxDQUFDLGFBQWEsR0FBRztnQkFDbkIsR0FBRyxJQUFJLENBQUMsYUFBYTtnQkFDckIsR0FBRyxtQkFBbUIsQ0FBQyxZQUFZO2FBQ3BDLENBQUM7U0FDSDtJQUNILENBQUM7OEdBaEJVLGdCQUFnQjtrR0FBaEIsZ0JBQWdCLHlKQ1Q3Qiw2TEFJTTs7MkZES08sZ0JBQWdCO2tCQU41QixTQUFTOytCQUNFLG9CQUFvQixpQkFHZixpQkFBaUIsQ0FBQyxJQUFJOzhCQUk1QixNQUFNO3NCQUFkLEtBQUs7Z0JBQ0csbUJBQW1CO3NCQUEzQixLQUFLIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQ29tcG9uZW50LCBJbnB1dCwgT25DaGFuZ2VzLCBTaW1wbGVDaGFuZ2VzLCBWaWV3RW5jYXBzdWxhdGlvbiB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xyXG5pbXBvcnQgeyBWYWxpZGF0aW9uRXJyb3JzIH0gZnJvbSAnQGFuZ3VsYXIvZm9ybXMnO1xyXG5cclxuQENvbXBvbmVudCh7XHJcbiAgc2VsZWN0b3I6ICdzLXZhbGlkYXRpb24tZXJyb3InLFxyXG4gIHRlbXBsYXRlVXJsOiAnLi9zLXZhbGlkYXRpb24tZXJyb3IuY29tcG9uZW50Lmh0bWwnLFxyXG4gIHN0eWxlVXJsczogWycuL3MtdmFsaWRhdGlvbi1lcnJvci5jb21wb25lbnQuc2NzcyddLFxyXG4gIGVuY2Fwc3VsYXRpb246IFZpZXdFbmNhcHN1bGF0aW9uLk5vbmUsXHJcbn0pXHJcbmV4cG9ydCBjbGFzcyBTVmFsaWRhdGlvbkVycm9yIGltcGxlbWVudHMgT25DaGFuZ2VzIHtcclxuXHJcbiAgQElucHV0KCkgZXJyb3JzOiBSZWNvcmQ8c3RyaW5nLCBWYWxpZGF0aW9uRXJyb3JzPiB8IG51bGwgPSB7fTtcclxuICBASW5wdXQoKSBjdXN0b21FcnJvck1lc3NhZ2VzOiBSZWNvcmQ8c3RyaW5nLCBzdHJpbmc+ID0ge307XHJcbiAgZXJyb3JNZXNzYWdlczogUmVjb3JkPHN0cmluZywgc3RyaW5nPiA9IHtcclxuICAgIHJlcXVpcmVkOiAnQ2FtcG8gcmVxdWVyaWRvLicsXHJcbiAgfTtcclxuXHJcbiAgbmdPbkNoYW5nZXMoY2hhbmdlczogU2ltcGxlQ2hhbmdlcyk6IHZvaWQge1xyXG4gICAgY29uc3QgeyBjdXN0b21FcnJvck1lc3NhZ2VzIH0gPSBjaGFuZ2VzO1xyXG4gICAgaWYgKGN1c3RvbUVycm9yTWVzc2FnZXMpIHtcclxuICAgICAgdGhpcy5lcnJvck1lc3NhZ2VzID0ge1xyXG4gICAgICAgIC4uLnRoaXMuZXJyb3JNZXNzYWdlcyxcclxuICAgICAgICAuLi5jdXN0b21FcnJvck1lc3NhZ2VzLmN1cnJlbnRWYWx1ZSxcclxuICAgICAgfTtcclxuICAgIH1cclxuICB9XHJcbn1cclxuIiwiPGRpdiBjbGFzcz1cInMtdmFsaWRhdGlvbi1lcnJvcnNcIj5cclxuICA8cy1lcnJvci1jb250cm9sICpuZ0Zvcj1cImxldCBlcnJvciBvZiBlcnJvcnMgfCBrZXl2YWx1ZVwiIHRoZW1lID1cInJlZFwiPlxyXG4gICAge3sgZXJyb3JNZXNzYWdlc1tlcnJvci5rZXldIH19XHJcbiAgPC9zLWVycm9yLWNvbnRyb2w+XHJcbjwvZGl2PiJdfQ==

package/esm2022/lib/input/directives/control-value-accessor.directive.mjs

@@ -0,0 +1,69 @@
+import { Directive, Inject, Injector } from '@angular/core';
+import { FormControl, Validators, NgControl, FormControlName, FormGroupDirective, } from '@angular/forms';
+import { Subject, takeUntil, startWith, distinctUntilChanged, tap } from 'rxjs';
+import * as i0 from "@angular/core";
+import * as i1 from "@angular/forms";
+export class ControlValueAccessorDirective {
+    constructor(injector, controlContainer) {
+        this.injector = injector;
+        this.controlContainer = controlContainer;
+        this.isRequired = false;
+        this._isDisabled = false;
+        this._destroy$ = new Subject();
+    }
+    ngOnInit() {
+        this.setFormControl();
+        this.isRequired = this.control?.hasValidator(Validators.required) ?? false;
+    }
+    setFormControl() {
+        try {
+            const formControl = this.injector.get(NgControl);
+            switch (formControl.constructor) {
+                case FormControlName:
+                    this.control = this.injector
+                        .get(FormGroupDirective)
+                        .getControl(formControl);
+                    break;
+                default:
+                    this.control = formControl
+                        .form;
+                    break;
+            }
+        }
+        catch (err) {
+            this.control = new FormControl();
+        }
+    }
+    writeValue(value) {
+        if (this.control && this.control.value !== value) {
+            this.control.setValue(value);
+            return;
+        }
+        if (!this.control) {
+            this.control = new FormControl(value);
+        }
+    }
+    registerOnChange(fn) {
+        this.control?.valueChanges
+            .pipe(takeUntil(this._destroy$), startWith(this.control.value), distinctUntilChanged(), tap((val) => fn(val)))
+            .subscribe(() => this.control?.markAsUntouched());
+    }
+    registerOnTouched(fn) {
+        this._onTouched = fn;
+    }
+    setDisabledState(isDisabled) {
+        this._isDisabled = isDisabled;
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: ControlValueAccessorDirective, deps: [{ token: Injector }, { token: i1.ControlContainer }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.3", type: ControlValueAccessorDirective, selector: "[appControlValueAccessor]", ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: ControlValueAccessorDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[appControlValueAccessor]',
+                }]
+        }], ctorParameters: function () { return [{ type: i0.Injector, decorators: [{
+                    type: Inject,
+                    args: [Injector]
+                }] }, { type: i1.ControlContainer }]; } });
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiY29udHJvbC12YWx1ZS1hY2Nlc3Nvci5kaXJlY3RpdmUuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9zaWRlc3lzLWdlbmVyaWMtdWkvc3JjL2xpYi9pbnB1dC9kaXJlY3RpdmVzL2NvbnRyb2wtdmFsdWUtYWNjZXNzb3IuZGlyZWN0aXZlLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxTQUFTLEVBQUUsTUFBTSxFQUFFLFFBQVEsRUFBNEIsTUFBTSxlQUFlLENBQUM7QUFDdEYsT0FBTyxFQUVMLFdBQVcsRUFDWCxVQUFVLEVBQ1YsU0FBUyxFQUNULGVBQWUsRUFDZixrQkFBa0IsR0FHbkIsTUFBTSxnQkFBZ0IsQ0FBQztBQUN4QixPQUFPLEVBQUUsT0FBTyxFQUFFLFNBQVMsRUFBRSxTQUFTLEVBQUUsb0JBQW9CLEVBQUUsR0FBRyxFQUFFLE1BQU0sTUFBTSxDQUFDOzs7QUFLaEYsTUFBTSxPQUFPLDZCQUE2QjtJQVF4QyxZQUM0QixRQUFrQixFQUNwQyxnQkFBa0M7UUFEaEIsYUFBUSxHQUFSLFFBQVEsQ0FBVTtRQUNwQyxxQkFBZ0IsR0FBaEIsZ0JBQWdCLENBQWtCO1FBUjVDLGVBQVUsR0FBRyxLQUFLLENBQUM7UUFFWCxnQkFBVyxHQUFHLEtBQUssQ0FBQztRQUNwQixjQUFTLEdBQUcsSUFBSSxPQUFPLEVBQVEsQ0FBQztJQU1yQyxDQUFDO0lBRUosUUFBUTtRQUNOLElBQUksQ0FBQyxjQUFjLEVBQUUsQ0FBQztRQUN0QixJQUFJLENBQUMsVUFBVSxHQUFHLElBQUksQ0FBQyxPQUFPLEVBQUUsWUFBWSxDQUFDLFVBQVUsQ0FBQyxRQUFRLENBQUMsSUFBSSxLQUFLLENBQUM7SUFDN0UsQ0FBQztJQUVELGNBQWM7UUFDWixJQUFJO1lBQ0YsTUFBTSxXQUFXLEdBQUcsSUFBSSxDQUFDLFFBQVEsQ0FBQyxHQUFHLENBQUMsU0FBUyxDQUFDLENBQUM7WUFFakQsUUFBUSxXQUFXLENBQUMsV0FBVyxFQUFFO2dCQUMvQixLQUFLLGVBQWU7b0JBQ2xCLElBQUksQ0FBQyxPQUFPLEdBQUcsSUFBSSxDQUFDLFFBQVE7eUJBQ3pCLEdBQUcsQ0FBQyxrQkFBa0IsQ0FBQzt5QkFDdkIsVUFBVSxDQUFDLFdBQThCLENBQUMsQ0FBQztvQkFDOUMsTUFBTTtnQkFDUjtvQkFDRSxJQUFJLENBQUMsT0FBTyxHQUFJLFdBQW9DO3lCQUNqRCxJQUFtQixDQUFDO29CQUN2QixNQUFNO2FBQ1Q7U0FDRjtRQUFDLE9BQU8sR0FBRyxFQUFFO1lBQ1osSUFBSSxDQUFDLE9BQU8sR0FBRyxJQUFJLFdBQVcsRUFBRSxDQUFDO1NBQ2xDO0lBQ0gsQ0FBQztJQUVELFVBQVUsQ0FBQyxLQUFRO1FBQ2pCLElBQUksSUFBSSxDQUFDLE9BQU8sSUFBSSxJQUFJLENBQUMsT0FBTyxDQUFDLEtBQUssS0FBSyxLQUFLLEVBQUU7WUFDaEQsSUFBSSxDQUFDLE9BQU8sQ0FBQyxRQUFRLENBQUMsS0FBSyxDQUFDLENBQUM7WUFDN0IsT0FBTztTQUNSO1FBQ0QsSUFBSSxDQUFDLElBQUksQ0FBQyxPQUFPLEVBQUU7WUFDakIsSUFBSSxDQUFDLE9BQU8sR0FBRyxJQUFJLFdBQVcsQ0FBQyxLQUFLLENBQUMsQ0FBQztTQUN2QztJQUNILENBQUM7SUFFRCxnQkFBZ0IsQ0FBQyxFQUF3QjtRQUN2QyxJQUFJLENBQUMsT0FBTyxFQUFFLFlBQVk7YUFDdkIsSUFBSSxDQUNILFNBQVMsQ0FBQyxJQUFJLENBQUMsU0FBUyxDQUFDLEVBQ3pCLFNBQVMsQ0FBQyxJQUFJLENBQUMsT0FBTyxDQUFDLEtBQUssQ0FBQyxFQUM3QixvQkFBb0IsRUFBRSxFQUN0QixHQUFHLENBQUMsQ0FBQyxHQUFHLEVBQUUsRUFBRSxDQUFDLEVBQUUsQ0FBQyxHQUFHLENBQUMsQ0FBQyxDQUN0QjthQUNBLFNBQVMsQ0FBQyxHQUFHLEVBQUUsQ0FBQyxJQUFJLENBQUMsT0FBTyxFQUFFLGVBQWUsRUFBRSxDQUFDLENBQUM7SUFDdEQsQ0FBQztJQUVELGlCQUFpQixDQUFDLEVBQVc7UUFDM0IsSUFBSSxDQUFDLFVBQVUsR0FBRyxFQUFFLENBQUM7SUFDdkIsQ0FBQztJQUVELGdCQUFnQixDQUFFLFVBQW1CO1FBQ25DLElBQUksQ0FBQyxXQUFXLEdBQUcsVUFBVSxDQUFDO0lBQ2hDLENBQUM7OEdBakVVLDZCQUE2QixrQkFTOUIsUUFBUTtrR0FUUCw2QkFBNkI7OzJGQUE3Qiw2QkFBNkI7a0JBSHpDLFNBQVM7bUJBQUM7b0JBQ1QsUUFBUSxFQUFFLDJCQUEyQjtpQkFDdEM7OzBCQVVJLE1BQU07MkJBQUMsUUFBUSIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IERpcmVjdGl2ZSwgSW5qZWN0LCBJbmplY3RvciwgSW5wdXQsIE9uSW5pdCwgVmlld0NoaWxkIH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XHJcbmltcG9ydCB7XHJcbiAgQ29udHJvbFZhbHVlQWNjZXNzb3IsXHJcbiAgRm9ybUNvbnRyb2wsXHJcbiAgVmFsaWRhdG9ycyxcclxuICBOZ0NvbnRyb2wsXHJcbiAgRm9ybUNvbnRyb2xOYW1lLFxyXG4gIEZvcm1Hcm91cERpcmVjdGl2ZSxcclxuICBGb3JtQ29udHJvbERpcmVjdGl2ZSxcclxuICBDb250cm9sQ29udGFpbmVyLFxyXG59IGZyb20gJ0Bhbmd1bGFyL2Zvcm1zJzsgXHJcbmltcG9ydCB7IFN1YmplY3QsIHRha2VVbnRpbCwgc3RhcnRXaXRoLCBkaXN0aW5jdFVudGlsQ2hhbmdlZCwgdGFwIH0gZnJvbSAncnhqcyc7XHJcblxyXG5ARGlyZWN0aXZlKHtcclxuICBzZWxlY3RvcjogJ1thcHBDb250cm9sVmFsdWVBY2Nlc3Nvcl0nLFxyXG59KVxyXG5leHBvcnQgY2xhc3MgQ29udHJvbFZhbHVlQWNjZXNzb3JEaXJlY3RpdmU8VD4gaW1wbGVtZW50cyBDb250cm9sVmFsdWVBY2Nlc3NvciB7XHJcbiAgY29udHJvbDogRm9ybUNvbnRyb2wgfCB1bmRlZmluZWQ7XHJcbiAgaXNSZXF1aXJlZCA9IGZhbHNlO1xyXG5cclxuICBwcml2YXRlIF9pc0Rpc2FibGVkID0gZmFsc2U7XHJcbiAgcHJpdmF0ZSBfZGVzdHJveSQgPSBuZXcgU3ViamVjdDx2b2lkPigpO1xyXG4gIHByaXZhdGUgX29uVG91Y2hlZCE6ICgpID0+IFQ7XHJcblxyXG4gIGNvbnN0cnVjdG9yKFxyXG4gICAgQEluamVjdChJbmplY3RvcikgcHJpdmF0ZSBpbmplY3RvcjogSW5qZWN0b3IsXHJcbiAgICBwcml2YXRlIGNvbnRyb2xDb250YWluZXI6IENvbnRyb2xDb250YWluZXIsXHJcbiAgKSB7fVxyXG5cclxuICBuZ09uSW5pdCgpIHtcclxuICAgIHRoaXMuc2V0Rm9ybUNvbnRyb2woKTtcclxuICAgIHRoaXMuaXNSZXF1aXJlZCA9IHRoaXMuY29udHJvbD8uaGFzVmFsaWRhdG9yKFZhbGlkYXRvcnMucmVxdWlyZWQpID8/IGZhbHNlO1xyXG4gIH1cclxuXHJcbiAgc2V0Rm9ybUNvbnRyb2woKSB7XHJcbiAgICB0cnkge1xyXG4gICAgICBjb25zdCBmb3JtQ29udHJvbCA9IHRoaXMuaW5qZWN0b3IuZ2V0KE5nQ29udHJvbCk7XHJcblxyXG4gICAgICBzd2l0Y2ggKGZvcm1Db250cm9sLmNvbnN0cnVjdG9yKSB7XHJcbiAgICAgICAgY2FzZSBGb3JtQ29udHJvbE5hbWU6XHJcbiAgICAgICAgICB0aGlzLmNvbnRyb2wgPSB0aGlzLmluamVjdG9yXHJcbiAgICAgICAgICAgIC5nZXQoRm9ybUdyb3VwRGlyZWN0aXZlKVxyXG4gICAgICAgICAgICAuZ2V0Q29udHJvbChmb3JtQ29udHJvbCBhcyBGb3JtQ29udHJvbE5hbWUpO1xyXG4gICAgICAgICAgYnJlYWs7XHJcbiAgICAgICAgZGVmYXVsdDpcclxuICAgICAgICAgIHRoaXMuY29udHJvbCA9IChmb3JtQ29udHJvbCBhcyBGb3JtQ29udHJvbERpcmVjdGl2ZSlcclxuICAgICAgICAgICAgLmZvcm0gYXMgRm9ybUNvbnRyb2w7XHJcbiAgICAgICAgICBicmVhaztcclxuICAgICAgfVxyXG4gICAgfSBjYXRjaCAoZXJyKSB7XHJcbiAgICAgIHRoaXMuY29udHJvbCA9IG5ldyBGb3JtQ29udHJvbCgpO1xyXG4gICAgfVxyXG4gIH1cclxuXHJcbiAgd3JpdGVWYWx1ZSh2YWx1ZTogVCk6IHZvaWQge1xyXG4gICAgaWYgKHRoaXMuY29udHJvbCAmJiB0aGlzLmNvbnRyb2wudmFsdWUgIT09IHZhbHVlKSB7XHJcbiAgICAgIHRoaXMuY29udHJvbC5zZXRWYWx1ZSh2YWx1ZSk7XHJcbiAgICAgIHJldHVybjtcclxuICAgIH1cclxuICAgIGlmICghdGhpcy5jb250cm9sKSB7XHJcbiAgICAgIHRoaXMuY29udHJvbCA9IG5ldyBGb3JtQ29udHJvbCh2YWx1ZSk7XHJcbiAgICB9XHJcbiAgfVxyXG5cclxuICByZWdpc3Rlck9uQ2hhbmdlKGZuOiAodmFsOiBUIHwgbnVsbCkgPT4gVCk6IHZvaWQge1xyXG4gICAgdGhpcy5jb250cm9sPy52YWx1ZUNoYW5nZXNcclxuICAgICAgLnBpcGUoXHJcbiAgICAgICAgdGFrZVVudGlsKHRoaXMuX2Rlc3Ryb3kkKSxcclxuICAgICAgICBzdGFydFdpdGgodGhpcy5jb250cm9sLnZhbHVlKSxcclxuICAgICAgICBkaXN0aW5jdFVudGlsQ2hhbmdlZCgpLFxyXG4gICAgICAgIHRhcCgodmFsKSA9PiBmbih2YWwpKVxyXG4gICAgICApXHJcbiAgICAgIC5zdWJzY3JpYmUoKCkgPT4gdGhpcy5jb250cm9sPy5tYXJrQXNVbnRvdWNoZWQoKSk7XHJcbiAgfVxyXG5cclxuICByZWdpc3Rlck9uVG91Y2hlZChmbjogKCkgPT4gVCk6IHZvaWQge1xyXG4gICAgdGhpcy5fb25Ub3VjaGVkID0gZm47XHJcbiAgfVxyXG5cclxuICBzZXREaXNhYmxlZFN0YXRlPyhpc0Rpc2FibGVkOiBib29sZWFuKTogdm9pZCB7XHJcbiAgICB0aGlzLl9pc0Rpc2FibGVkID0gaXNEaXNhYmxlZDtcclxuICB9XHJcbn0iXX0=

package/esm2022/lib/input/enums/icon-theme.enum.mjs

@@ -0,0 +1,8 @@
+export var ICON_THEME;
+(function (ICON_THEME) {
+    ICON_THEME["default"] = "";
+    ICON_THEME["red"] = "error_outline";
+    ICON_THEME["green"] = "check_circle_outline";
+    ICON_THEME["yellow"] = "warning";
+})(ICON_THEME || (ICON_THEME = {}));
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaWNvbi10aGVtZS5lbnVtLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvc2lkZXN5cy1nZW5lcmljLXVpL3NyYy9saWIvaW5wdXQvZW51bXMvaWNvbi10aGVtZS5lbnVtLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE1BQU0sQ0FBTixJQUFZLFVBS1g7QUFMRCxXQUFZLFVBQVU7SUFDcEIsMEJBQVksQ0FBQTtJQUNaLG1DQUFxQixDQUFBO0lBQ3JCLDRDQUE4QixDQUFBO0lBQzlCLGdDQUFrQixDQUFBO0FBQ3BCLENBQUMsRUFMVyxVQUFVLEtBQVYsVUFBVSxRQUtyQiIsInNvdXJjZXNDb250ZW50IjpbImV4cG9ydCBlbnVtIElDT05fVEhFTUUge1xyXG4gIGRlZmF1bHQgPSBcIlwiLFxyXG4gIHJlZCA9IFwiZXJyb3Jfb3V0bGluZVwiLFxyXG4gIGdyZWVuID0gXCJjaGVja19jaXJjbGVfb3V0bGluZVwiLFxyXG4gIHllbGxvdyA9IFwid2FybmluZ1wiXHJcbn0iXX0=

package/esm2022/lib/input/enums/theme.emun.mjs

@@ -0,0 +1,8 @@
+export var THEME;
+(function (THEME) {
+    THEME["DEFAULT"] = "default";
+    THEME["GREEN"] = "green";
+    THEME["YELLOW"] = "yellow";
+    THEME["RED"] = "red";
+})(THEME || (THEME = {}));
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidGhlbWUuZW11bi5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL3NpZGVzeXMtZ2VuZXJpYy11aS9zcmMvbGliL2lucHV0L2VudW1zL3RoZW1lLmVtdW4udHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsTUFBTSxDQUFOLElBQVksS0FLWDtBQUxELFdBQVksS0FBSztJQUNmLDRCQUFtQixDQUFBO0lBQ25CLHdCQUFlLENBQUE7SUFDZiwwQkFBaUIsQ0FBQTtJQUNqQixvQkFBVyxDQUFBO0FBQ2IsQ0FBQyxFQUxXLEtBQUssS0FBTCxLQUFLLFFBS2hCIiwic291cmNlc0NvbnRlbnQiOlsiZXhwb3J0IGVudW0gVEhFTUUge1xyXG4gIERFRkFVTFQgPSAnZGVmYXVsdCcsXHJcbiAgR1JFRU4gPSAnZ3JlZW4nLFxyXG4gIFlFTExPVyA9ICd5ZWxsb3cnLFxyXG4gIFJFRCA9ICdyZWQnXHJcbn0iXX0=

package/esm2022/lib/input/index.mjs

@@ -1,5 +1,14 @@
+export * from './components/input/s-input.component';
 export * from './components/input-text/s-input-text.component';
 export * from './components/input-textarea/s-input-textarea.component';
 export * from './components/error-control/s-error-control.component';
 export * from './input.module';
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5kZXguanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9zaWRlc3lzLWdlbmVyaWMtdWkvc3JjL2xpYi9pbnB1dC9pbmRleC50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxjQUFjLGdEQUFnRCxDQUFDO0FBQy9ELGNBQWMsd0RBQXdELENBQUM7QUFDdkUsY0FBYyxzREFBc0QsQ0FBQztBQUNyRSxjQUFjLGdCQUFnQixDQUFDIiwic291cmNlc0NvbnRlbnQiOlsiZXhwb3J0ICogZnJvbSAnLi9jb21wb25lbnRzL2lucHV0LXRleHQvcy1pbnB1dC10ZXh0LmNvbXBvbmVudCc7XHJcbmV4cG9ydCAqIGZyb20gJy4vY29tcG9uZW50cy9pbnB1dC10ZXh0YXJlYS9zLWlucHV0LXRleHRhcmVhLmNvbXBvbmVudCc7XHJcbmV4cG9ydCAqIGZyb20gJy4vY29tcG9uZW50cy9lcnJvci1jb250cm9sL3MtZXJyb3ItY29udHJvbC5jb21wb25lbnQnO1xyXG5leHBvcnQgKiBmcm9tICcuL2lucHV0Lm1vZHVsZSc7XHJcbiJdfQ==
+export * from './components/range/s-range.component';
+export * from './components/calendar/s-calendar.component';
+export * from './components/time/s-time.component';
+export * from './components/color/s-color.component';
+export * from './components/input-number/s-input-number.component';
+export * from './enums/icon-theme.enum';
+export * from './enums/theme.emun';
+export * from './components/validation-error/s-validation-error.component';
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5kZXguanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9zaWRlc3lzLWdlbmVyaWMtdWkvc3JjL2xpYi9pbnB1dC9pbmRleC50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxjQUFjLHNDQUFzQyxDQUFDO0FBQ3JELGNBQWMsZ0RBQWdELENBQUM7QUFDL0QsY0FBYyx3REFBd0QsQ0FBQztBQUN2RSxjQUFjLHNEQUFzRCxDQUFDO0FBQ3JFLGNBQWMsZ0JBQWdCLENBQUM7QUFDL0IsY0FBYyxzQ0FBc0MsQ0FBQztBQUNyRCxjQUFjLDRDQUE0QyxDQUFDO0FBQzNELGNBQWMsb0NBQW9DLENBQUM7QUFDbkQsY0FBYyxzQ0FBc0MsQ0FBQztBQUNyRCxjQUFjLG9EQUFvRCxDQUFDO0FBQ25FLGNBQWMseUJBQXlCLENBQUM7QUFDeEMsY0FBYyxvQkFBb0IsQ0FBQztBQUNuQyxjQUFjLDREQUE0RCxDQUFDIiwic291cmNlc0NvbnRlbnQiOlsiZXhwb3J0ICogZnJvbSAnLi9jb21wb25lbnRzL2lucHV0L3MtaW5wdXQuY29tcG9uZW50JztcclxuZXhwb3J0ICogZnJvbSAnLi9jb21wb25lbnRzL2lucHV0LXRleHQvcy1pbnB1dC10ZXh0LmNvbXBvbmVudCc7XHJcbmV4cG9ydCAqIGZyb20gJy4vY29tcG9uZW50cy9pbnB1dC10ZXh0YXJlYS9zLWlucHV0LXRleHRhcmVhLmNvbXBvbmVudCc7XHJcbmV4cG9ydCAqIGZyb20gJy4vY29tcG9uZW50cy9lcnJvci1jb250cm9sL3MtZXJyb3ItY29udHJvbC5jb21wb25lbnQnO1xyXG5leHBvcnQgKiBmcm9tICcuL2lucHV0Lm1vZHVsZSc7XHJcbmV4cG9ydCAqIGZyb20gJy4vY29tcG9uZW50cy9yYW5nZS9zLXJhbmdlLmNvbXBvbmVudCc7XHJcbmV4cG9ydCAqIGZyb20gJy4vY29tcG9uZW50cy9jYWxlbmRhci9zLWNhbGVuZGFyLmNvbXBvbmVudCc7XHJcbmV4cG9ydCAqIGZyb20gJy4vY29tcG9uZW50cy90aW1lL3MtdGltZS5jb21wb25lbnQnO1xyXG5leHBvcnQgKiBmcm9tICcuL2NvbXBvbmVudHMvY29sb3Ivcy1jb2xvci5jb21wb25lbnQnO1xyXG5leHBvcnQgKiBmcm9tICcuL2NvbXBvbmVudHMvaW5wdXQtbnVtYmVyL3MtaW5wdXQtbnVtYmVyLmNvbXBvbmVudCc7XHJcbmV4cG9ydCAqIGZyb20gJy4vZW51bXMvaWNvbi10aGVtZS5lbnVtJztcclxuZXhwb3J0ICogZnJvbSAnLi9lbnVtcy90aGVtZS5lbXVuJztcclxuZXhwb3J0ICogZnJvbSAnLi9jb21wb25lbnRzL3ZhbGlkYXRpb24tZXJyb3Ivcy12YWxpZGF0aW9uLWVycm9yLmNvbXBvbmVudCc7Il19

package/esm2022/lib/input/input.module.mjs

@@ -6,18 +6,39 @@ import { FormsModule, ReactiveFormsModule } from '@angular/forms';
 import { SIconMaterialModule } from '../icon-material/s-icon-material.module';
 import { SInputTextAreaComponent } from './components/input-textarea/s-input-textarea.component';
 import { SButtonModule } from '../button/button.module';
+import { SInputComponent } from './components/input/s-input.component';
+import { SRangeComponent } from './components/range/s-range.component';
+import { SCalendarComponent } from './components/calendar/s-calendar.component';
+import { STimeComponent } from './components/time/s-time.component';
+import { SColorComponent } from './components/color/s-color.component';
+import { SInputNumberComponent } from './components/input-number/s-input-number.component';
+import { SValidationError } from './components/validation-error/s-validation-error.component';
 import * as i0 from "@angular/core";
 export class SInputModule {
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: SInputModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
     static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.2.3", ngImport: i0, type: SInputModule, declarations: [SInputTextComponent,
             SInputTextAreaComponent,
-            SErrorControl], imports: [CommonModule,
+            SErrorControl,
+            SInputComponent,
+            SInputNumberComponent,
+            SRangeComponent,
+            SCalendarComponent,
+            STimeComponent,
+            SColorComponent,
+            SValidationError], imports: [CommonModule,
             FormsModule,
             ReactiveFormsModule,
             SIconMaterialModule,
             SButtonModule], exports: [SInputTextComponent,
             SInputTextAreaComponent,
-            SErrorControl] }); }
+            SErrorControl,
+            SInputComponent,
+            SInputNumberComponent,
+            SRangeComponent,
+            SCalendarComponent,
+            STimeComponent,
+            SColorComponent,
+            SValidationError] }); }
     static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: SInputModule, imports: [CommonModule,
             FormsModule,
             ReactiveFormsModule,
@@ -30,7 +51,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.3", ngImpor
                     declarations: [
                         SInputTextComponent,
                         SInputTextAreaComponent,
-                        SErrorControl
+                        SErrorControl,
+                        SInputComponent,
+                        SInputNumberComponent,
+                        SRangeComponent,
+                        SCalendarComponent,
+                        STimeComponent,
+                        SColorComponent,
+                        SValidationError
                     ],
                     imports: [
                         CommonModule,
@@ -42,8 +70,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.3", ngImpor
                     exports: [
                         SInputTextComponent,
                         SInputTextAreaComponent,
-                        SErrorControl
+                        SErrorControl,
+                        SInputComponent,
+                        SInputNumberComponent,
+                        SRangeComponent,
+                        SCalendarComponent,
+                        STimeComponent,
+                        SColorComponent,
+                        SValidationError
                     ]
                 }]
         }] });
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5wdXQubW9kdWxlLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvc2lkZXN5cy1nZW5lcmljLXVpL3NyYy9saWIvaW5wdXQvaW5wdXQubW9kdWxlLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxRQUFRLEVBQUUsTUFBTSxlQUFlLENBQUM7QUFDekMsT0FBTyxFQUFFLFlBQVksRUFBRSxNQUFNLGlCQUFpQixDQUFDO0FBQy9DLE9BQU8sRUFBRSxtQkFBbUIsRUFBRSxNQUFNLGdEQUFnRCxDQUFDO0FBQ3JGLE9BQU8sRUFBRSxhQUFhLEVBQUUsTUFBTSxzREFBc0QsQ0FBQztBQUNyRixPQUFPLEVBQUUsV0FBVyxFQUFFLG1CQUFtQixFQUFFLE1BQU0sZ0JBQWdCLENBQUM7QUFDbEUsT0FBTyxFQUFFLG1CQUFtQixFQUFFLE1BQU0seUNBQXlDLENBQUE7QUFDN0UsT0FBTyxFQUFFLHVCQUF1QixFQUFFLE1BQU0sd0RBQXdELENBQUM7QUFDakcsT0FBTyxFQUFFLGFBQWEsRUFBRSxNQUFNLHlCQUF5QixDQUFDOztBQXNCeEQsTUFBTSxPQUFPLFlBQVk7OEdBQVosWUFBWTsrR0FBWixZQUFZLGlCQWpCckIsbUJBQW1CO1lBQ25CLHVCQUF1QjtZQUN2QixhQUFhLGFBR2IsWUFBWTtZQUNaLFdBQVc7WUFDWCxtQkFBbUI7WUFDbkIsbUJBQW1CO1lBQ25CLGFBQWEsYUFHYixtQkFBbUI7WUFDbkIsdUJBQXVCO1lBQ3ZCLGFBQWE7K0dBR0osWUFBWSxZQVpyQixZQUFZO1lBQ1osV0FBVztZQUNYLG1CQUFtQjtZQUNuQixtQkFBbUI7WUFDbkIsYUFBYTs7MkZBUUosWUFBWTtrQkFuQnhCLFFBQVE7bUJBQUM7b0JBQ1IsWUFBWSxFQUFFO3dCQUNaLG1CQUFtQjt3QkFDbkIsdUJBQXVCO3dCQUN2QixhQUFhO3FCQUNkO29CQUNELE9BQU8sRUFBRTt3QkFDUCxZQUFZO3dCQUNaLFdBQVc7d0JBQ1gsbUJBQW1CO3dCQUNuQixtQkFBbUI7d0JBQ25CLGFBQWE7cUJBQ2Q7b0JBQ0QsT0FBTyxFQUFFO3dCQUNQLG1CQUFtQjt3QkFDbkIsdUJBQXVCO3dCQUN2QixhQUFhO3FCQUNkO2lCQUNGIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgTmdNb2R1bGUgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcclxuaW1wb3J0IHsgQ29tbW9uTW9kdWxlIH0gZnJvbSAnQGFuZ3VsYXIvY29tbW9uJztcclxuaW1wb3J0IHsgU0lucHV0VGV4dENvbXBvbmVudCB9IGZyb20gJy4vY29tcG9uZW50cy9pbnB1dC10ZXh0L3MtaW5wdXQtdGV4dC5jb21wb25lbnQnO1xyXG5pbXBvcnQgeyBTRXJyb3JDb250cm9sIH0gZnJvbSAnLi9jb21wb25lbnRzL2Vycm9yLWNvbnRyb2wvcy1lcnJvci1jb250cm9sLmNvbXBvbmVudCc7XHJcbmltcG9ydCB7IEZvcm1zTW9kdWxlLCBSZWFjdGl2ZUZvcm1zTW9kdWxlIH0gZnJvbSAnQGFuZ3VsYXIvZm9ybXMnO1xyXG5pbXBvcnQgeyBTSWNvbk1hdGVyaWFsTW9kdWxlIH0gZnJvbSAnLi4vaWNvbi1tYXRlcmlhbC9zLWljb24tbWF0ZXJpYWwubW9kdWxlJ1xyXG5pbXBvcnQgeyBTSW5wdXRUZXh0QXJlYUNvbXBvbmVudCB9IGZyb20gJy4vY29tcG9uZW50cy9pbnB1dC10ZXh0YXJlYS9zLWlucHV0LXRleHRhcmVhLmNvbXBvbmVudCc7XHJcbmltcG9ydCB7IFNCdXR0b25Nb2R1bGUgfSBmcm9tICcuLi9idXR0b24vYnV0dG9uLm1vZHVsZSc7XHJcblxyXG5cclxuQE5nTW9kdWxlKHtcclxuICBkZWNsYXJhdGlvbnM6IFtcclxuICAgIFNJbnB1dFRleHRDb21wb25lbnQsXHJcbiAgICBTSW5wdXRUZXh0QXJlYUNvbXBvbmVudCxcclxuICAgIFNFcnJvckNvbnRyb2xcclxuICBdLFxyXG4gIGltcG9ydHM6IFtcclxuICAgIENvbW1vbk1vZHVsZSxcclxuICAgIEZvcm1zTW9kdWxlLFxyXG4gICAgUmVhY3RpdmVGb3Jtc01vZHVsZSxcclxuICAgIFNJY29uTWF0ZXJpYWxNb2R1bGUsXHJcbiAgICBTQnV0dG9uTW9kdWxlXHJcbiAgXSxcclxuICBleHBvcnRzOiBbXHJcbiAgICBTSW5wdXRUZXh0Q29tcG9uZW50LFxyXG4gICAgU0lucHV0VGV4dEFyZWFDb21wb25lbnQsXHJcbiAgICBTRXJyb3JDb250cm9sXHJcbiAgXVxyXG59KVxyXG5leHBvcnQgY2xhc3MgU0lucHV0TW9kdWxlIHsgfVxyXG4iXX0=
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5wdXQubW9kdWxlLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvc2lkZXN5cy1nZW5lcmljLXVpL3NyYy9saWIvaW5wdXQvaW5wdXQubW9kdWxlLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxRQUFRLEVBQUUsTUFBTSxlQUFlLENBQUM7QUFDekMsT0FBTyxFQUFFLFlBQVksRUFBRSxNQUFNLGlCQUFpQixDQUFDO0FBQy9DLE9BQU8sRUFBRSxtQkFBbUIsRUFBRSxNQUFNLGdEQUFnRCxDQUFDO0FBQ3JGLE9BQU8sRUFBRSxhQUFhLEVBQUUsTUFBTSxzREFBc0QsQ0FBQztBQUNyRixPQUFPLEVBQUUsV0FBVyxFQUFFLG1CQUFtQixFQUFFLE1BQU0sZ0JBQWdCLENBQUM7QUFDbEUsT0FBTyxFQUFFLG1CQUFtQixFQUFFLE1BQU0seUNBQXlDLENBQUE7QUFDN0UsT0FBTyxFQUFFLHVCQUF1QixFQUFFLE1BQU0sd0RBQXdELENBQUM7QUFDakcsT0FBTyxFQUFFLGFBQWEsRUFBRSxNQUFNLHlCQUF5QixDQUFDO0FBQ3hELE9BQU8sRUFBRSxlQUFlLEVBQUUsTUFBTSxzQ0FBc0MsQ0FBQztBQUN2RSxPQUFPLEVBQUUsZUFBZSxFQUFFLE1BQU0sc0NBQXNDLENBQUM7QUFDdkUsT0FBTyxFQUFFLGtCQUFrQixFQUFFLE1BQU0sNENBQTRDLENBQUM7QUFDaEYsT0FBTyxFQUFFLGNBQWMsRUFBRSxNQUFNLG9DQUFvQyxDQUFDO0FBQ3BFLE9BQU8sRUFBRSxlQUFlLEVBQUUsTUFBTSxzQ0FBc0MsQ0FBQztBQUN2RSxPQUFPLEVBQUUscUJBQXFCLEVBQUUsTUFBTSxvREFBb0QsQ0FBQztBQUMzRixPQUFPLEVBQUUsZ0JBQWdCLEVBQUUsTUFBTSw0REFBNEQsQ0FBQzs7QUFvQzlGLE1BQU0sT0FBTyxZQUFZOzhHQUFaLFlBQVk7K0dBQVosWUFBWSxpQkEvQnJCLG1CQUFtQjtZQUNuQix1QkFBdUI7WUFDdkIsYUFBYTtZQUNiLGVBQWU7WUFDZixxQkFBcUI7WUFDckIsZUFBZTtZQUNmLGtCQUFrQjtZQUNsQixjQUFjO1lBQ2QsZUFBZTtZQUNmLGdCQUFnQixhQUdoQixZQUFZO1lBQ1osV0FBVztZQUNYLG1CQUFtQjtZQUNuQixtQkFBbUI7WUFDbkIsYUFBYSxhQUdiLG1CQUFtQjtZQUNuQix1QkFBdUI7WUFDdkIsYUFBYTtZQUNiLGVBQWU7WUFDZixxQkFBcUI7WUFDckIsZUFBZTtZQUNmLGtCQUFrQjtZQUNsQixjQUFjO1lBQ2QsZUFBZTtZQUNmLGdCQUFnQjsrR0FHUCxZQUFZLFlBbkJyQixZQUFZO1lBQ1osV0FBVztZQUNYLG1CQUFtQjtZQUNuQixtQkFBbUI7WUFDbkIsYUFBYTs7MkZBZUosWUFBWTtrQkFqQ3hCLFFBQVE7bUJBQUM7b0JBQ1IsWUFBWSxFQUFFO3dCQUNaLG1CQUFtQjt3QkFDbkIsdUJBQXVCO3dCQUN2QixhQUFhO3dCQUNiLGVBQWU7d0JBQ2YscUJBQXFCO3dCQUNyQixlQUFlO3dCQUNmLGtCQUFrQjt3QkFDbEIsY0FBYzt3QkFDZCxlQUFlO3dCQUNmLGdCQUFnQjtxQkFDakI7b0JBQ0QsT0FBTyxFQUFFO3dCQUNQLFlBQVk7d0JBQ1osV0FBVzt3QkFDWCxtQkFBbUI7d0JBQ25CLG1CQUFtQjt3QkFDbkIsYUFBYTtxQkFDZDtvQkFDRCxPQUFPLEVBQUU7d0JBQ1AsbUJBQW1CO3dCQUNuQix1QkFBdUI7d0JBQ3ZCLGFBQWE7d0JBQ2IsZUFBZTt3QkFDZixxQkFBcUI7d0JBQ3JCLGVBQWU7d0JBQ2Ysa0JBQWtCO3dCQUNsQixjQUFjO3dCQUNkLGVBQWU7d0JBQ2YsZ0JBQWdCO3FCQUNqQjtpQkFDRiIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IE5nTW9kdWxlIH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XHJcbmltcG9ydCB7IENvbW1vbk1vZHVsZSB9IGZyb20gJ0Bhbmd1bGFyL2NvbW1vbic7XHJcbmltcG9ydCB7IFNJbnB1dFRleHRDb21wb25lbnQgfSBmcm9tICcuL2NvbXBvbmVudHMvaW5wdXQtdGV4dC9zLWlucHV0LXRleHQuY29tcG9uZW50JztcclxuaW1wb3J0IHsgU0Vycm9yQ29udHJvbCB9IGZyb20gJy4vY29tcG9uZW50cy9lcnJvci1jb250cm9sL3MtZXJyb3ItY29udHJvbC5jb21wb25lbnQnO1xyXG5pbXBvcnQgeyBGb3Jtc01vZHVsZSwgUmVhY3RpdmVGb3Jtc01vZHVsZSB9IGZyb20gJ0Bhbmd1bGFyL2Zvcm1zJztcclxuaW1wb3J0IHsgU0ljb25NYXRlcmlhbE1vZHVsZSB9IGZyb20gJy4uL2ljb24tbWF0ZXJpYWwvcy1pY29uLW1hdGVyaWFsLm1vZHVsZSdcclxuaW1wb3J0IHsgU0lucHV0VGV4dEFyZWFDb21wb25lbnQgfSBmcm9tICcuL2NvbXBvbmVudHMvaW5wdXQtdGV4dGFyZWEvcy1pbnB1dC10ZXh0YXJlYS5jb21wb25lbnQnO1xyXG5pbXBvcnQgeyBTQnV0dG9uTW9kdWxlIH0gZnJvbSAnLi4vYnV0dG9uL2J1dHRvbi5tb2R1bGUnO1xyXG5pbXBvcnQgeyBTSW5wdXRDb21wb25lbnQgfSBmcm9tICcuL2NvbXBvbmVudHMvaW5wdXQvcy1pbnB1dC5jb21wb25lbnQnO1xyXG5pbXBvcnQgeyBTUmFuZ2VDb21wb25lbnQgfSBmcm9tICcuL2NvbXBvbmVudHMvcmFuZ2Uvcy1yYW5nZS5jb21wb25lbnQnO1xyXG5pbXBvcnQgeyBTQ2FsZW5kYXJDb21wb25lbnQgfSBmcm9tICcuL2NvbXBvbmVudHMvY2FsZW5kYXIvcy1jYWxlbmRhci5jb21wb25lbnQnO1xyXG5pbXBvcnQgeyBTVGltZUNvbXBvbmVudCB9IGZyb20gJy4vY29tcG9uZW50cy90aW1lL3MtdGltZS5jb21wb25lbnQnO1xyXG5pbXBvcnQgeyBTQ29sb3JDb21wb25lbnQgfSBmcm9tICcuL2NvbXBvbmVudHMvY29sb3Ivcy1jb2xvci5jb21wb25lbnQnO1xyXG5pbXBvcnQgeyBTSW5wdXROdW1iZXJDb21wb25lbnQgfSBmcm9tICcuL2NvbXBvbmVudHMvaW5wdXQtbnVtYmVyL3MtaW5wdXQtbnVtYmVyLmNvbXBvbmVudCc7XHJcbmltcG9ydCB7IFNWYWxpZGF0aW9uRXJyb3IgfSBmcm9tICcuL2NvbXBvbmVudHMvdmFsaWRhdGlvbi1lcnJvci9zLXZhbGlkYXRpb24tZXJyb3IuY29tcG9uZW50JztcclxuXHJcblxyXG5ATmdNb2R1bGUoe1xyXG4gIGRlY2xhcmF0aW9uczogW1xyXG4gICAgU0lucHV0VGV4dENvbXBvbmVudCxcclxuICAgIFNJbnB1dFRleHRBcmVhQ29tcG9uZW50LFxyXG4gICAgU0Vycm9yQ29udHJvbCxcclxuICAgIFNJbnB1dENvbXBvbmVudCxcclxuICAgIFNJbnB1dE51bWJlckNvbXBvbmVudCxcclxuICAgIFNSYW5nZUNvbXBvbmVudCxcclxuICAgIFNDYWxlbmRhckNvbXBvbmVudCxcclxuICAgIFNUaW1lQ29tcG9uZW50LFxyXG4gICAgU0NvbG9yQ29tcG9uZW50LFxyXG4gICAgU1ZhbGlkYXRpb25FcnJvclxyXG4gIF0sXHJcbiAgaW1wb3J0czogW1xyXG4gICAgQ29tbW9uTW9kdWxlLFxyXG4gICAgRm9ybXNNb2R1bGUsXHJcbiAgICBSZWFjdGl2ZUZvcm1zTW9kdWxlLFxyXG4gICAgU0ljb25NYXRlcmlhbE1vZHVsZSxcclxuICAgIFNCdXR0b25Nb2R1bGVcclxuICBdLFxyXG4gIGV4cG9ydHM6IFtcclxuICAgIFNJbnB1dFRleHRDb21wb25lbnQsXHJcbiAgICBTSW5wdXRUZXh0QXJlYUNvbXBvbmVudCxcclxuICAgIFNFcnJvckNvbnRyb2wsXHJcbiAgICBTSW5wdXRDb21wb25lbnQsXHJcbiAgICBTSW5wdXROdW1iZXJDb21wb25lbnQsXHJcbiAgICBTUmFuZ2VDb21wb25lbnQsXHJcbiAgICBTQ2FsZW5kYXJDb21wb25lbnQsXHJcbiAgICBTVGltZUNvbXBvbmVudCxcclxuICAgIFNDb2xvckNvbXBvbmVudCxcclxuICAgIFNWYWxpZGF0aW9uRXJyb3JcclxuICBdXHJcbn0pXHJcbmV4cG9ydCBjbGFzcyBTSW5wdXRNb2R1bGUgeyB9XHJcbiJdfQ==

package/esm2022/lib/list/s-list.component.mjs

@@ -8,7 +8,7 @@ export class SListComponent {
         this.size = 'md';
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: SListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.3", type: SListComponent, selector: "s-list", inputs: { disabled: "disabled", selected: "selected", size: "size" }, ngImport: i0, template: "    <div class=\"s-list \r\n    {{disabled ? 's-list--disabled' : ''}} {{selected ? 's-list--selected' : ''}} \">\r\n        <div class=\"s-list__content\">\r\n            <div class=\"s-list__content__drag s-list__content__drag--no-select s-list__content__drag--cursor s-list__content__drag--{{size}}\" >\r\n                <s-icon-mat class=\"drag-indicator\">drag_indicator</s-icon-mat>\r\n            </div>\r\n            <div class=\"s-list__content__gral\">\r\n                <ng-content></ng-content>\r\n            </div>\r\n        </div>\r\n    </div>\r\n", styles: [".s-list{width:100%;display:flex;align-items:center;border:.063rem solid var(--neutrals-800);border-radius:.25rem;margin-bottom:.125rem;background-color:var(--neutrals-1200)}.s-list__content{display:flex;align-items:center;width:100%;border-top-left-radius:.125rem;border-bottom-left-radius:.125rem;padding:.875rem;border-left:.25rem solid var(--neutrals-1200)}.s-list__content__drag{background-color:var(--primary-100);color:var(--primary-600);border:.063rem solid var(--primary-600);display:flex;align-items:center;border-radius:.25rem}.s-list__content__drag .drag-indicator span{font-size:1rem;padding:.188rem}.s-list__content__drag--md{height:3.75rem}.s-list__content__drag--sm{height:2.375rem}.s-list__content__drag--xs{height:2rem}.s-list__content__drag--cursor{cursor:grab}.s-list__content__gral{width:100%;margin-left:.625rem}.s-list:hover:not(.s-list--disabled){border:.063rem solid var(--primary-300);background-color:var(--primary-100)}.s-list:hover:not(.s-list--disabled) .s-list__content{border-top-left-radius:.125rem;border-bottom-left-radius:.125rem;border-left:.25rem solid var(--primary-600)}.s-list--selected{border:.063rem solid var(--primary-300);background-color:var(--primary-100);box-shadow:var(--focus-cyan--md)}.s-list--selected .s-list__content{border-top-left-radius:.125rem;border-bottom-left-radius:.125rem;border-left:.25rem solid var(--primary-600)}.s-list--disabled{opacity:50%;border:.063rem solid var(--neutrals-1000);background-color:var(--neutrals-1200)}.s-list--disabled .s-list__content{border-left:.25rem solid var(--neutrals-1200)}.s-list--disabled .s-list__content__drag{background-color:var(--neutrals-1100);color:var(--neutrals-800);border:.063rem solid var(--neutrals-800);cursor:no-drop}\n"], dependencies: [{ kind: "component", type: i1.SIconMaterialComponent, selector: "s-icon-mat", inputs: ["size", "color", "fill", "weight", "grade", "opticalSize", "style", "type"] }], encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.3", type: SListComponent, selector: "s-list", inputs: { disabled: "disabled", selected: "selected", size: "size" }, ngImport: i0, template: "    <div class=\"s-list \r\n    {{disabled ? 's-list--disabled' : ''}} {{selected ? 's-list--selected' : ''}} \">\r\n        <div class=\"s-list__content\">\r\n            <div class=\"s-list__content__drag s-list__content__drag--no-select s-list__content__drag--cursor s-list__content__drag--{{size}}\" >\r\n                <s-icon-mat class=\"drag-indicator\">drag_indicator</s-icon-mat>\r\n            </div>\r\n            <div class=\"s-list__content__gral\">\r\n                <ng-content></ng-content>\r\n            </div>\r\n        </div>\r\n    </div>\r\n", styles: [".s-list{width:100%;display:flex;align-items:center;border:.063rem solid var(--neutrals-800);border-radius:.25rem;margin-bottom:.125rem;background-color:var(--neutrals-1200)}.s-list__content{display:flex;align-items:center;width:100%;border-top-left-radius:.125rem;border-bottom-left-radius:.125rem;padding:.875rem;border-left:.25rem solid var(--neutrals-1200)}.s-list__content__drag{background-color:var(--primary-100);color:var(--primary-600);border:.063rem solid var(--primary-600);display:flex;align-items:center;border-radius:.25rem}.s-list__content__drag .drag-indicator span{font-size:1rem;padding:.188rem}.s-list__content__drag--md{height:3.75rem}.s-list__content__drag--sm{height:2.375rem}.s-list__content__drag--xs{height:2rem}.s-list__content__drag--cursor{cursor:grab}.s-list__content__gral{width:100%;margin-left:.625rem}.s-list:hover:not(.s-list--disabled){border:.063rem solid var(--primary-300);background-color:var(--primary-100)}.s-list:hover:not(.s-list--disabled) .s-list__content{border-top-left-radius:.125rem;border-bottom-left-radius:.125rem;border-left:.25rem solid var(--primary-600)}.s-list--selected{border:.063rem solid var(--primary-300);background-color:var(--primary-100);box-shadow:var(--focus-cyan--md)}.s-list--selected .s-list__content{border-top-left-radius:.125rem;border-bottom-left-radius:.125rem;border-left:.25rem solid var(--primary-600)}.s-list--disabled{opacity:50%;border:.063rem solid var(--neutrals-1000);background-color:var(--neutrals-1200)}.s-list--disabled .s-list__content{border-left:.25rem solid var(--neutrals-1200)}.s-list--disabled .s-list__content__drag{background-color:var(--neutrals-1100);color:var(--neutrals-800);border:.063rem solid var(--neutrals-800);cursor:no-drop}\n"], dependencies: [{ kind: "component", type: i1.SIconMaterialComponent, selector: "s-icon-mat", inputs: ["name", "size", "color", "fill", "weight", "grade", "opticalSize", "style", "type"] }], encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: SListComponent, decorators: [{
             type: Component,

package/esm2022/lib/list-simple/s-list-simple.component.mjs

@@ -5,11 +5,11 @@ export class SListSimpleComponent {
         this.listStyle = 'default';
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: SListSimpleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.3", type: SListSimpleComponent, selector: "s-list-simple", inputs: { listStyle: "listStyle" }, ngImport: i0, template: "<div class=\"s-list-simple s-list-simple--{{listStyle}}\">\r\n    <ng-content></ng-content>\r\n</div>", styles: ["@font-face{font-family:Material Icons;font-style:normal;font-weight:400;src:url(https://fonts.gstatic.com/s/materialicons/v140/flUhRq6tzZclQEJ-Vdg-IuiaDsNc.woff2) format(\"woff2\")}@font-face{font-family:Material Symbols Outlined;font-style:normal;font-weight:100 700;src:url(https://fonts.gstatic.com/s/materialsymbolsoutlined/v110/kJEhBvYX7BgnkSrUwT8OhrdQw4oELdPIeeII9v6oFsI.woff2) format(\"woff2\")}.s-list-simple ul{font-size:.875rem;font-weight:400;line-height:1.25rem;letter-spacing:.01563rem;display:flex;flex-direction:column;align-items:flex-start;align-self:stretch}.s-list-simple ul,.s-list-simple ol{margin-left:10px}.s-list-simple ul ul,.s-list-simple ul ol,.s-list-simple ol ul,.s-list-simple ol ol{margin-left:17px}.s-list-simple ul ul ul,.s-list-simple ul ul ol,.s-list-simple ul ol ul,.s-list-simple ul ol ol,.s-list-simple ol ul ul,.s-list-simple ol ul ol,.s-list-simple ol ol ul,.s-list-simple ol ol ol{margin-left:24px}.s-list-simple ul ul ul ul,.s-list-simple ul ul ul ol,.s-list-simple ul ul ol ul,.s-list-simple ul ul ol ol,.s-list-simple ul ol ul ul,.s-list-simple ul ol ul ol,.s-list-simple ul ol ol ul,.s-list-simple ul ol ol ol,.s-list-simple ol ul ul ul,.s-list-simple ol ul ul ol,.s-list-simple ol ul ol ul,.s-list-simple ol ul ol ol,.s-list-simple ol ol ul ul,.s-list-simple ol ol ul ol,.s-list-simple ol ol ol ul,.s-list-simple ol ol ol ol{margin-left:31px}.s-list-simple--default ul{list-style:disc}.s-list-simple--check li,.s-list-simple--chevron li,.s-list-simple--folder li{list-style-type:none}.s-list-simple--check li:before,.s-list-simple--chevron li:before,.s-list-simple--folder li:before{font-family:Material Icons;display:inline-block;margin-right:.5em}.s-list-simple--check ul ul ul li:before{color:var(--green-700)}.s-list-simple--check ul ul ul .mark-invert:before,.s-list-simple--check ul ul ul .mark-invert::marker{color:var(--green-600)!important}.s-list-simple--check li:before{content:\"\\e5ca\";color:var(--green-600)}.s-list-simple--check .mark-invert:before,.s-list-simple--check .mark-invert::marker{color:var(--green-700)}.s-list-simple--chevron li:before{content:\"\\e5cc\";color:var(--secondary-600)}.s-list-simple--dot ul,.s-list-simple--dot ul ul{list-style:disc}.s-list-simple--dot ul ul ul{list-style:circle}.s-list-simple--dot li::marker{font-size:17px;color:var(--secondary-600)}.s-list-simple--folder ul ul ul li:before{font-family:Material Symbols Outlined}.s-list-simple--folder ul ul ul .mark-invert:before,.s-list-simple--folder ul ul ul .mark-invert::marker{font-family:Material Icons!important}.s-list-simple--folder li:before{content:\"\\e2c7\";color:var(--secondary-600)}.s-list-simple--folder .mark-invert:before,.s-list-simple--folder .mark-invert::marker{font-family:Material Symbols Outlined}.s-list-simple--a1 ul>li:before{color:var(--primary-600);font-weight:700;content:counter(level1) \". \";counter-increment:level1}.s-list-simple--a1 ul ul>li:before{color:var(--secondary-600);font-weight:700;content:counter(level2,lower-alpha) \". \";counter-increment:level2}.s-list-simple--a1 ul ul ul>li:before{font-weight:400;content:counter(level2,lower-alpha) \".\" counter(level3) \" \";counter-increment:level3}.s-list-simple--a1 ul{counter-reset:level1}.s-list-simple--a1 ul ul{counter-reset:level2}.s-list-simple--a1 ul ul ul{counter-reset:level3}\n"], encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.3", type: SListSimpleComponent, selector: "s-list-simple", inputs: { listStyle: "listStyle" }, ngImport: i0, template: "<div class=\"s-list-simple s-list-simple--{{listStyle}}\">\r\n    <ng-content></ng-content>\r\n</div>", styles: ["@font-face{font-family:Material Icons;font-style:normal;font-weight:400;src:url(https://fonts.gstatic.com/s/materialicons/v140/flUhRq6tzZclQEJ-Vdg-IuiaDsNc.woff2) format(\"woff2\")}@font-face{font-family:Material Symbols Outlined;font-style:normal;font-weight:100 700;src:url(https://fonts.gstatic.com/s/materialsymbolsoutlined/v179/kJF1BvYX7BgnkSrUwT8OhrdQw4oELdPIeeII9v6oDMzByHX9rA6RzaxHMPdY43zj-jCxv3fzvRNU22ZXGJpEpjC_1v-p_4MrImHCIJIZrDCvHOej.woff2) format(\"woff2\")}.s-list-simple ul{font-size:.875rem;font-weight:400;line-height:1.25rem;letter-spacing:.01563rem;display:flex;flex-direction:column;align-items:flex-start;align-self:stretch}.s-list-simple ul,.s-list-simple ol{margin-left:10px}.s-list-simple ul ul,.s-list-simple ul ol,.s-list-simple ol ul,.s-list-simple ol ol{margin-left:17px}.s-list-simple ul ul ul,.s-list-simple ul ul ol,.s-list-simple ul ol ul,.s-list-simple ul ol ol,.s-list-simple ol ul ul,.s-list-simple ol ul ol,.s-list-simple ol ol ul,.s-list-simple ol ol ol{margin-left:24px}.s-list-simple ul ul ul ul,.s-list-simple ul ul ul ol,.s-list-simple ul ul ol ul,.s-list-simple ul ul ol ol,.s-list-simple ul ol ul ul,.s-list-simple ul ol ul ol,.s-list-simple ul ol ol ul,.s-list-simple ul ol ol ol,.s-list-simple ol ul ul ul,.s-list-simple ol ul ul ol,.s-list-simple ol ul ol ul,.s-list-simple ol ul ol ol,.s-list-simple ol ol ul ul,.s-list-simple ol ol ul ol,.s-list-simple ol ol ol ul,.s-list-simple ol ol ol ol{margin-left:31px}.s-list-simple--default ul{list-style:disc}.s-list-simple--check li,.s-list-simple--chevron li,.s-list-simple--folder li{list-style-type:none}.s-list-simple--check li:before,.s-list-simple--chevron li:before,.s-list-simple--folder li:before{font-family:Material Icons;display:inline-block;margin-right:.5em}.s-list-simple--check ul ul ul li:before{color:var(--green-700)}.s-list-simple--check ul ul ul .mark-invert:before,.s-list-simple--check ul ul ul .mark-invert::marker{color:var(--green-600)!important}.s-list-simple--check li:before{content:\"\\e5ca\";color:var(--green-600)}.s-list-simple--check .mark-invert:before,.s-list-simple--check .mark-invert::marker{color:var(--green-700)}.s-list-simple--chevron li:before{content:\"\\e5cc\";color:var(--secondary-600)}.s-list-simple--dot ul,.s-list-simple--dot ul ul{list-style:disc}.s-list-simple--dot ul ul ul{list-style:circle}.s-list-simple--dot li::marker{font-size:17px;color:var(--secondary-600)}.s-list-simple--folder ul ul ul li:before{font-family:Material Symbols Outlined}.s-list-simple--folder ul ul ul .mark-invert:before,.s-list-simple--folder ul ul ul .mark-invert::marker{font-family:Material Icons!important}.s-list-simple--folder li:before{content:\"\\e2c7\";color:var(--secondary-600)}.s-list-simple--folder .mark-invert:before,.s-list-simple--folder .mark-invert::marker{font-family:Material Symbols Outlined}.s-list-simple--a1 ul>li:before{color:var(--primary-600);font-weight:700;content:counter(level1) \". \";counter-increment:level1}.s-list-simple--a1 ul ul>li:before{color:var(--secondary-600);font-weight:700;content:counter(level2,lower-alpha) \". \";counter-increment:level2}.s-list-simple--a1 ul ul ul>li:before{font-weight:400;content:counter(level2,lower-alpha) \".\" counter(level3) \" \";counter-increment:level3}.s-list-simple--a1 ul{counter-reset:level1}.s-list-simple--a1 ul ul{counter-reset:level2}.s-list-simple--a1 ul ul ul{counter-reset:level3}\n"], encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: SListSimpleComponent, decorators: [{
             type: Component,
-            args: [{ selector: 's-list-simple', encapsulation: ViewEncapsulation.None, template: "<div class=\"s-list-simple s-list-simple--{{listStyle}}\">\r\n    <ng-content></ng-content>\r\n</div>", styles: ["@font-face{font-family:Material Icons;font-style:normal;font-weight:400;src:url(https://fonts.gstatic.com/s/materialicons/v140/flUhRq6tzZclQEJ-Vdg-IuiaDsNc.woff2) format(\"woff2\")}@font-face{font-family:Material Symbols Outlined;font-style:normal;font-weight:100 700;src:url(https://fonts.gstatic.com/s/materialsymbolsoutlined/v110/kJEhBvYX7BgnkSrUwT8OhrdQw4oELdPIeeII9v6oFsI.woff2) format(\"woff2\")}.s-list-simple ul{font-size:.875rem;font-weight:400;line-height:1.25rem;letter-spacing:.01563rem;display:flex;flex-direction:column;align-items:flex-start;align-self:stretch}.s-list-simple ul,.s-list-simple ol{margin-left:10px}.s-list-simple ul ul,.s-list-simple ul ol,.s-list-simple ol ul,.s-list-simple ol ol{margin-left:17px}.s-list-simple ul ul ul,.s-list-simple ul ul ol,.s-list-simple ul ol ul,.s-list-simple ul ol ol,.s-list-simple ol ul ul,.s-list-simple ol ul ol,.s-list-simple ol ol ul,.s-list-simple ol ol ol{margin-left:24px}.s-list-simple ul ul ul ul,.s-list-simple ul ul ul ol,.s-list-simple ul ul ol ul,.s-list-simple ul ul ol ol,.s-list-simple ul ol ul ul,.s-list-simple ul ol ul ol,.s-list-simple ul ol ol ul,.s-list-simple ul ol ol ol,.s-list-simple ol ul ul ul,.s-list-simple ol ul ul ol,.s-list-simple ol ul ol ul,.s-list-simple ol ul ol ol,.s-list-simple ol ol ul ul,.s-list-simple ol ol ul ol,.s-list-simple ol ol ol ul,.s-list-simple ol ol ol ol{margin-left:31px}.s-list-simple--default ul{list-style:disc}.s-list-simple--check li,.s-list-simple--chevron li,.s-list-simple--folder li{list-style-type:none}.s-list-simple--check li:before,.s-list-simple--chevron li:before,.s-list-simple--folder li:before{font-family:Material Icons;display:inline-block;margin-right:.5em}.s-list-simple--check ul ul ul li:before{color:var(--green-700)}.s-list-simple--check ul ul ul .mark-invert:before,.s-list-simple--check ul ul ul .mark-invert::marker{color:var(--green-600)!important}.s-list-simple--check li:before{content:\"\\e5ca\";color:var(--green-600)}.s-list-simple--check .mark-invert:before,.s-list-simple--check .mark-invert::marker{color:var(--green-700)}.s-list-simple--chevron li:before{content:\"\\e5cc\";color:var(--secondary-600)}.s-list-simple--dot ul,.s-list-simple--dot ul ul{list-style:disc}.s-list-simple--dot ul ul ul{list-style:circle}.s-list-simple--dot li::marker{font-size:17px;color:var(--secondary-600)}.s-list-simple--folder ul ul ul li:before{font-family:Material Symbols Outlined}.s-list-simple--folder ul ul ul .mark-invert:before,.s-list-simple--folder ul ul ul .mark-invert::marker{font-family:Material Icons!important}.s-list-simple--folder li:before{content:\"\\e2c7\";color:var(--secondary-600)}.s-list-simple--folder .mark-invert:before,.s-list-simple--folder .mark-invert::marker{font-family:Material Symbols Outlined}.s-list-simple--a1 ul>li:before{color:var(--primary-600);font-weight:700;content:counter(level1) \". \";counter-increment:level1}.s-list-simple--a1 ul ul>li:before{color:var(--secondary-600);font-weight:700;content:counter(level2,lower-alpha) \". \";counter-increment:level2}.s-list-simple--a1 ul ul ul>li:before{font-weight:400;content:counter(level2,lower-alpha) \".\" counter(level3) \" \";counter-increment:level3}.s-list-simple--a1 ul{counter-reset:level1}.s-list-simple--a1 ul ul{counter-reset:level2}.s-list-simple--a1 ul ul ul{counter-reset:level3}\n"] }]
+            args: [{ selector: 's-list-simple', encapsulation: ViewEncapsulation.None, template: "<div class=\"s-list-simple s-list-simple--{{listStyle}}\">\r\n    <ng-content></ng-content>\r\n</div>", styles: ["@font-face{font-family:Material Icons;font-style:normal;font-weight:400;src:url(https://fonts.gstatic.com/s/materialicons/v140/flUhRq6tzZclQEJ-Vdg-IuiaDsNc.woff2) format(\"woff2\")}@font-face{font-family:Material Symbols Outlined;font-style:normal;font-weight:100 700;src:url(https://fonts.gstatic.com/s/materialsymbolsoutlined/v179/kJF1BvYX7BgnkSrUwT8OhrdQw4oELdPIeeII9v6oDMzByHX9rA6RzaxHMPdY43zj-jCxv3fzvRNU22ZXGJpEpjC_1v-p_4MrImHCIJIZrDCvHOej.woff2) format(\"woff2\")}.s-list-simple ul{font-size:.875rem;font-weight:400;line-height:1.25rem;letter-spacing:.01563rem;display:flex;flex-direction:column;align-items:flex-start;align-self:stretch}.s-list-simple ul,.s-list-simple ol{margin-left:10px}.s-list-simple ul ul,.s-list-simple ul ol,.s-list-simple ol ul,.s-list-simple ol ol{margin-left:17px}.s-list-simple ul ul ul,.s-list-simple ul ul ol,.s-list-simple ul ol ul,.s-list-simple ul ol ol,.s-list-simple ol ul ul,.s-list-simple ol ul ol,.s-list-simple ol ol ul,.s-list-simple ol ol ol{margin-left:24px}.s-list-simple ul ul ul ul,.s-list-simple ul ul ul ol,.s-list-simple ul ul ol ul,.s-list-simple ul ul ol ol,.s-list-simple ul ol ul ul,.s-list-simple ul ol ul ol,.s-list-simple ul ol ol ul,.s-list-simple ul ol ol ol,.s-list-simple ol ul ul ul,.s-list-simple ol ul ul ol,.s-list-simple ol ul ol ul,.s-list-simple ol ul ol ol,.s-list-simple ol ol ul ul,.s-list-simple ol ol ul ol,.s-list-simple ol ol ol ul,.s-list-simple ol ol ol ol{margin-left:31px}.s-list-simple--default ul{list-style:disc}.s-list-simple--check li,.s-list-simple--chevron li,.s-list-simple--folder li{list-style-type:none}.s-list-simple--check li:before,.s-list-simple--chevron li:before,.s-list-simple--folder li:before{font-family:Material Icons;display:inline-block;margin-right:.5em}.s-list-simple--check ul ul ul li:before{color:var(--green-700)}.s-list-simple--check ul ul ul .mark-invert:before,.s-list-simple--check ul ul ul .mark-invert::marker{color:var(--green-600)!important}.s-list-simple--check li:before{content:\"\\e5ca\";color:var(--green-600)}.s-list-simple--check .mark-invert:before,.s-list-simple--check .mark-invert::marker{color:var(--green-700)}.s-list-simple--chevron li:before{content:\"\\e5cc\";color:var(--secondary-600)}.s-list-simple--dot ul,.s-list-simple--dot ul ul{list-style:disc}.s-list-simple--dot ul ul ul{list-style:circle}.s-list-simple--dot li::marker{font-size:17px;color:var(--secondary-600)}.s-list-simple--folder ul ul ul li:before{font-family:Material Symbols Outlined}.s-list-simple--folder ul ul ul .mark-invert:before,.s-list-simple--folder ul ul ul .mark-invert::marker{font-family:Material Icons!important}.s-list-simple--folder li:before{content:\"\\e2c7\";color:var(--secondary-600)}.s-list-simple--folder .mark-invert:before,.s-list-simple--folder .mark-invert::marker{font-family:Material Symbols Outlined}.s-list-simple--a1 ul>li:before{color:var(--primary-600);font-weight:700;content:counter(level1) \". \";counter-increment:level1}.s-list-simple--a1 ul ul>li:before{color:var(--secondary-600);font-weight:700;content:counter(level2,lower-alpha) \". \";counter-increment:level2}.s-list-simple--a1 ul ul ul>li:before{font-weight:400;content:counter(level2,lower-alpha) \".\" counter(level3) \" \";counter-increment:level3}.s-list-simple--a1 ul{counter-reset:level1}.s-list-simple--a1 ul ul{counter-reset:level2}.s-list-simple--a1 ul ul ul{counter-reset:level3}\n"] }]
         }], propDecorators: { listStyle: [{
                 type: Input
             }] } });

package/esm2022/lib/login/s-login.component.mjs

@@ -77,11 +77,11 @@ export class SLoginComponent {
         return '';
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: SLoginComponent, deps: [{ token: i1.DomSanitizer }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.3", type: SLoginComponent, selector: "s-login", inputs: { urlForgotPassword: "urlForgotPassword", urlForgotPasswordTarget: "urlForgotPasswordTarget", errorMessage: "errorMessage", loading: "loading", model: "model", imgSrc: "imgSrc" }, outputs: { loginEvent: "loginEvent" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"login-container\">\r\n    <div class=\"login-section\">\r\n        <img class=\"login-image\" [src]=\"imgSrc\" alt=\"\">\r\n    </div>\r\n    <div class=\"login-section\">\r\n        <div class=\"login-section-second\">\r\n            <div style=\"flex: 3;\">\r\n                <h2 class=\"login-title-primary\">{{model.product}}</h2>\r\n                <br>\r\n            </div>\r\n            <div style=\"flex: 4;\">\r\n\r\n                \r\n                <div class=\"form-group\">\r\n                    <label class=\"label\">{{model.userLabel}}</label>\r\n                    <s-input-text [theme]=\"email ? 'red' : ''\" [type]=\"'email'\" [name]=\"'email'\" [placeHolder]=\"model.userPlaceholder\" \r\n                    (textChangeEvent)=\"changeEmail($event)\" (keyup.enter)=\"login()\"></s-input-text>\r\n                    <div *ngIf=\"!email\" class=\"fixclear\"></div>\r\n                    <s-error-control *ngIf=\"email\" theme =\"red\">{{email}}</s-error-control>\r\n                </div> \r\n\r\n                <div class=\"form-group\">\r\n                    <label class=\"label\">{{model.paswordLabel}}</label>\r\n                    <s-input-text [theme]=\"password ? 'red' : ''\" [type]=\"'password'\" [name]=\"'password'\" [placeHolder]=\"model.paswordPlaceholder\" \r\n                    (textChangeEvent)=\"changePassword($event)\" (keyup.enter)=\"login()\"></s-input-text>\r\n                    <div *ngIf=\"!password\" class=\"fixclear\"></div>\r\n                    <s-error-control *ngIf=\"password\" theme =\"red\">{{email}}</s-error-control>\r\n                </div>\r\n\r\n\r\n            </div>\r\n            <div style=\"flex: 2;text-align: center;\">\r\n                <br>\r\n                <p *ngIf=\"urlForgotPassword\" class=\"s-caption\">\u00BFOlvidaste tu contrase\u00F1a? <a class=\"click-here-link\" target=\"{{urlForgotPasswordTarget}}\"\r\n                        [href]=\"urlForgotPassword\">Haz clic aqu\u00ED</a> para recuperarla</p>\r\n                <br>\r\n            </div>\r\n            <div style=\"flex: 1; text-align: center;\">\r\n                <div>\r\n                    <s-error-control *ngIf=\"errorMessage\" theme=\"red\"><span class=\"s-caption\">{{errorMessage}}</span></s-error-control>\r\n                </div>\r\n                <s-button [loading]=\"loading\" [disabled]=\"loading\" size=\"md\" (click)=\"login()\">{{model.buttonText}}</s-button>\r\n            </div>\r\n        </div>\r\n    </div>\r\n</div>", styles: ["@import\"https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,400;0,500;0,700;1,400;1,500;1,700&display=swap\";html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;vertical-align:baseline}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:\"\";content:none}table{border-collapse:collapse;border-spacing:0}*{font-family:Roboto,Arial,sans-serif;font-size:16px;letter-spacing:.2px;line-height:20px;font-weight:400}h1,h2,h3,h4,h5,h6{margin:0;font-weight:700}h1{font-size:2.5rem;line-height:3.75rem}h2{font-size:2rem;line-height:2.5rem}h3{font-size:1.75rem;line-height:2.2rem}h4{font-size:1.5rem;line-height:1.875rem}h5{font-size:1.25rem;line-height:1.5rem}h6{font-size:1rem;line-height:1.5rem}p{font-size:1rem}a{font-size:1rem;line-height:1.5rem}.s-subtitle{font-size:1rem;line-height:1.5rem;letter-spacing:.15px}.s-subtitle-bold{font-size:1rem;line-height:1.5rem;font-weight:700;letter-spacing:.1px}.s-body-1{font-size:1rem;line-height:1.5rem;letter-spacing:.5px}.s-body-2{font-size:.875rem;line-height:1.375rem;letter-spacing:.25px}.s-button-xl,.s-button-xl-bold{font-size:1.125rem;line-height:1.75rem;letter-spacing:.5px}.s-button-lg,.s-button-lg-bold{font-size:1rem;line-height:1.5rem;letter-spacing:.5px}.s-button-sm,.s-button-sm-bold{font-size:.875rem;line-height:1.375rem;letter-spacing:.2px}.s-button-xs,.s-button-xs-bold{font-size:.75rem;line-height:1.125rem;letter-spacing:.1px}.s-button-xl-bold,.s-button-lg-bold,.s-button-sm-bold,.s-button-xs-bold{font-weight:700}.s-caption{font-size:.75rem;line-height:1.125rem;letter-spacing:.5px}.s-overline{font-size:.75rem;line-height:1.125rem;font-weight:500;letter-spacing:1.5px}.s-link-1{font-size:1rem;line-height:1.5rem;text-decoration:underline;letter-spacing:.5px}.s-link-2{font-size:1rem;line-height:1.5rem;letter-spacing:.5px}.s-link-3{font-size:.875rem;line-height:1.3rem;text-decoration:underline;letter-spacing:.5px}.s-link-4{font-size:.875rem;line-height:1.3rem;letter-spacing:.5px}@media only screen and (max-width: 600px){h1{font-size:2rem;line-height:2.5rem}h2,h3{font-size:1.5rem;line-height:1.875rem}h4{font-size:1.25rem;line-height:1.5rem}h5{font-size:1rem;line-height:1.25rem}}:root{--primary-100: #E6F4FF;--primary-200: #CCE9FF;--primary-300: #99D3FF;--primary-400: #66BDFE;--primary-500: #33A7FE;--primary-600: #0091FE;--primary-700: #0074CB;--primary-800: #005798;--primary-900: #003A66;--primary-1000: #001D33;--secondary-100: #E4EDF9;--secondary-200: #BBC9DB;--secondary-300: #92A5BC;--secondary-400: #69809E;--secondary-500: #405C7F;--secondary-600: #173861;--secondary-700: #122D4E;--secondary-800: #0E223A;--secondary-900: #091627;--secondary-1000: #07111D;--neutrals-100: #000000;--neutrals-200: #1E1E1E;--neutrals-300: #3C3C3C;--neutrals-400: #5A5A5A;--neutrals-500: #787878;--neutrals-600: #969696;--neutrals-700: #B4B4B4;--neutrals-800: #CECECE;--neutrals-900: #E0E0E0;--neutrals-1000: #EEEEEE;--neutrals-1100: #F7F7F7;--neutrals-1200: #FFFFFF;--green-100:#F3F8F5;--green-200:#E5F2EB;--green-300:#C8E4D5;--green-400:#A7D5BD;--green-500:#7CC5A0;--green-600:#36B37E;--green-700:#30A071;--green-800:#2A8B62;--green-900:#227150;--green-1000:#185038;--yellow-100:#FEF6E6;--yellow-200:#FEEDCD;--yellow-300:#FFDD86;--yellow-400:#FFCB59;--yellow-500:#FFB828;--yellow-600:#F9A60C;--yellow-700:#EC9709;--yellow-800:#DF8806;--yellow-900:#D37A03;--yellow-1000:#B26000;--red-100:#FFF1EC;--red-200:#FFE8E0;--red-300:#FDD1CA;--red-400:#FBB9B3;--red-500:#F68783;--red-600:#F46A68;--red-700:#F14848;--red-800:#E12E2E;--red-900:#CB1818;--red-1000:#B30000;--blue-alpha-100:rgba(23, 56, 97, .05);--blue-alpha-200:rgba(23, 56, 97, .125);--blue-alpha-300:rgba(23, 56, 97, .25);--blue-alpha-400:rgba(23, 56, 97, .375);--blue-alpha-500:rgba(23, 56, 97, .5);--blue-alpha-600:rgba(23, 56, 97, .625);--blue-alpha-700:rgba(23, 56, 97, .75);--blue-alpha-800:rgba(23, 56, 97, .875);--cyan-alpha-100:rgba(0, 145, 254, .05);--cyan-alpha-200:rgba(0, 145, 254, .125);--cyan-alpha-300:rgba(0, 145, 254, .25);--cyan-alpha-400:rgba(0, 145, 254, .375);--cyan-alpha-500:rgba(0, 145, 254, .5);--cyan-alpha-600:rgba(0, 145, 254, .625);--cyan-alpha-700:rgba(0, 145, 254, .75);--cyan-alpha-800:rgba(0, 145, 254, .875);--E000: 0px 0px 2px 0px rgba(23, 56, 97, .14);--E100: 0px 0px 10px 0px rgba(23, 56, 97, .14);--E200: 0px 0px 16px 0px rgba(23, 56, 97, .16);--E300: 0px 5px 24px 0px rgba(23, 56, 97, .18);--E400: 0px 0px 24px 0px rgba(23, 56, 97, .12), 0px 8px 20px 0px rgba(23, 56, 97, .06), 0px 4px 28px 0px rgba(23, 56, 97, .16);--E500: 0px 16px 32px 0px rgba(23, 56, 97, .16), 0px 0px 10px 0px rgba(23, 56, 97, .08), 0px 16px 28px 0px rgba(23, 56, 97, .12);--E600: 0px 16px 32px 0px rgba(23, 56, 97, .16), 0px 0px 10px 0px rgba(23, 56, 97, .08), 0px 16px 28px 0px rgba(23, 56, 97, .12);--focus-cyan--sm: 0px 1px 2px 0px rgba(16, 24, 40, .05), 0px 0px 0px 2px rgba(0, 145, 254, .15);--focus-cyan--md: 0px 1px 2px 0px rgba(16, 24, 40, .05), 0px 0px 0px 4px rgba(0, 145, 254, .15);--focus-blue--sm: 0px 1px 2px 0px rgba(16, 24, 40, .05), 0px 0px 0px 2px rgba(23, 56, 97, .15);--focus-blue--md: 0px 1px 2px 0px rgba(16, 24, 40, .05), 0px 0px 0px 4px rgba(23, 56, 97, .15);--focus-green--sm: 0px 1px 2px 0px rgba(16, 24, 40, .05), 0px 0px 0px 2px rgba(54, 179, 126, .15);--focus-green--md: 0px 1px 2px 0px rgba(16, 24, 40, .05), 0px 0px 0px 4px rgba(54, 179, 126, .15);--focus-yellow--sm: 0px 1px 2px 0px rgba(16, 24, 40, .05), 0px 0px 0px 2px rgba(255, 171, 0, .15);--focus-yellow--md: 0px 1px 2px 0px rgba(16, 24, 40, .05), 0px 0px 0px 4px rgba(255, 171, 0, .15);--focus-red--sm: 0px 1px 2px 0px rgba(16, 24, 40, .05), 0px 0px 0px 2px rgba(255, 86, 48, .15);--focus-red--md: 0px 1px 2px 0px rgba(16, 24, 40, .05), 0px 0px 0px 4px rgba(255, 86, 48, .15)}.skeleton-loading{background:linear-gradient(.25turn,transparent,#fff,transparent),linear-gradient(#eee,#eee),radial-gradient(38px circle at 19px 19px,#eee 50%,transparent 51%),linear-gradient(#eee,#eee);animation:skeleton-animation 1.5s infinite ease-in-out}@keyframes skeleton-animation{0%{opacity:.6}50%{opacity:.8}to{opacity:.6}}::selection{background:var(--primary-600);color:var(--neutrals-100)}.no-select{-webkit-touch-callout:none;-webkit-user-select:none;user-select:none}.cursor{cursor:pointer;-webkit-touch-callout:none;-webkit-user-select:none;user-select:none}.w-25{width:25%!important}.w-33{width:33%!important}.w-50{width:50%!important}.w-75{width:75%!important}.w-100{width:100%!important}.p-0{padding:0!important}.p-1{padding:.25em}.p-2{padding:.5em}.p-3{padding:1em}.p-4{padding:1.5em}.p-5{padding:3em}.px-0{padding:0}.px-1{padding:.25em 0}.px-2{padding:.5em 0}.px-3{padding:1em 0}.px-4{padding:1.5em 0}.px-5{padding:3em 0}.py-0{padding:0}.py-1{padding:0 .25em}.py-2{padding:0 .5em}.py-3{padding:0 1em}.py-4{padding:0 1.5em}.py-5{padding:0 3em}.pt-0{padding-top:0}.pt-1{padding-top:.25em}.pt-2{padding-top:.5em}.pt-3{padding-top:1em}.pt-4{padding-top:1.5em}.pt-5{padding-top:3em}.pr-0{padding-right:0}.pr-1{padding-right:.25em}.pr-2{padding-right:.5em}.pr-3{padding-right:1em}.pr-4{padding-right:1.5em}.pr-5{padding-right:3em}.pb-0{padding-bottom:0}.pb-1{padding-bottom:.25em}.pb-2{padding-bottom:.5em}.pb-3{padding-bottom:1em}.pb-4{padding-bottom:1.5em}.pb-5{padding-bottom:3em}.pl-0{padding-left:0}.pl-1{padding-left:.25em}.pl-2{padding-left:.5em}.pl-3{padding-left:1em}.pl-4{padding-left:1.5em}.pl-5{padding-left:3em}.m-auto{margin:0 auto}.m-0{margin:0}.m-1{margin:.25em}.m-2{margin:.5em}.m-3{margin:1em}.m-4{margin:1.5em}.m-5{margin:3em}.mx-0{margin:0}.mx-1{margin:.25em 0}.mx-2{margin:.5em 0}.mx-3{margin:1em 0}.mx-4{margin:1.5em 0}.mx-5{margin:3em 0}.my-0{margin:0}.my-1{margin:0 .25em}.my-2{margin:0 .5em}.my-3{margin:0 1em}.my-4{margin:0 1.5em}.my-5{margin:0 3em}.mt-0{margin-top:0}.mt-1{margin-top:.25em}.mt-2{margin-top:.5em}.mt-3{margin-top:1em}.mt-4{margin-top:1.5em}.mt-5{margin-top:3em}.mr-0{margin-right:0}.mr-1{margin-right:.25em}.mr-2{margin-right:.5em}.mr-3{margin-right:1em}.mr-4{margin-right:1.5em}.mr-5{margin-right:3em}.mb-0{margin-bottom:0}.mb-1{margin-bottom:.25em}.mb-2{margin-bottom:.5em}.mb-3{margin-bottom:1em}.mb-4{margin-bottom:1.5em}.mb-5{margin-bottom:3em}.ml-0{margin-left:0}.ml-1{margin-left:.25em}.ml-2{margin-left:.5em}.ml-3{margin-left:1em}.ml-4{margin-left:1.5em}.ml-5{margin-left:3em}.d-flex{display:flex}.fx-right{flex-direction:row-reverse}.fx-left{flex-direction:row}.justify-content-start{justify-content:flex-start!important}.justify-content-center{justify-content:center!important}.justify-content-end{justify-content:flex-end!important}.justify-content-between{justify-content:space-between!important}.justify-content-around{justify-content:space-around!important}.align-center{align-items:center}.text-start{text-align:left!important}.text-center{text-align:center!important}.text-end{text-align:right!important}.border,.border-1{border:1px solid}.border-2{border:2px solid}.border-left-1,.border-left{border-left:1px solid}.border-left-2{border-left:2px solid}.border-right-1,.border-right{border-right:1px solid}.border-right-2{border-right:2px solid}.border-top-1,.border-top{border-top:1px solid}.border-top-2{border-top:2px solid}.border-bottom-1,.border-bottom{border-bottom:1px solid}.border-bottom-2{border-bottom:2px solid}.border-y-1,.border-y{border-top:1px solid;border-bottom:1px solid}.border-y-2{border-top:2px solid;border-bottom:2px solid}.border-x-1,.border-x{border-left:1px solid;border-right:1px solid}.border-x-2{border-left:2px solid;border-right:2px solid}.br-1{border-radius:2px}.br-2{border-radius:4px}.br-3{border-radius:8px}.shadow-inner-1{box-shadow:inset 0 2px 2px #0000001a}.shadow-inner-2{box-shadow:inset 0 4px 8px #0000001a}.shadow-outer-1{box-shadow:0 2px 2px #0000001a}.shadow-outer-2{box-shadow:0 4px 8px #0000001a}.opacity-100{opacity:1}.opacity-90{opacity:.9}.opacity-80{opacity:.8}.opacity-70{opacity:.7}.opacity-60{opacity:.6}.opacity-50{opacity:.5}.opacity-40{opacity:.4}.opacity-30{opacity:.3}.opacity-20{opacity:.2}.opacity-10{opacity:.1}.highlighter,.highlighter-primary{color:var(--primary-600)}.highlighter-succes{color:var(--green-500)}.highlighter-warning{color:var(--yellow-600)}.highlighter-error{color:var(--red-600)}.highlighter-info{color:var(--secondary-600)}.s-scroll::-webkit-scrollbar{width:.7rem}.s-scroll::-webkit-scrollbar-track{background-color:transparent}.s-scroll::-webkit-scrollbar-thumb{background-color:var(--neutrals-900);border-radius:6px 10px 10px 6px;border-right:.3rem solid transparent;background-clip:content-box}.label-content{display:inline-flex;align-items:center;margin-left:3px;font-weight:400;font-size:.875rem;line-height:0px}.label-content.sm{font-size:.625rem}.label-content s-icon-mat{display:flex;align-items:center;margin-right:3px}.label-content s-icon-mat span{font-size:1.01rem}.icon-default,.label-content-default{color:var(--secondary-500)}.icon-yellow,.label-content-yellow{color:var(--yellow-600)}.icon-red,.label-content-red{color:var(--red-600)}.icon-green,.label-content-green{color:var(--green-600)}.form-group{margin:5px}.form-group .label{font-weight:400;font-size:.875rem;color:var(--secondary-600)}.form-group .content-input-main-626.sm{margin:0}.login-container{width:100%;height:100%;max-width:900px;max-height:600px;display:flex;flex-direction:row;color:var(--text);border-radius:8px;box-shadow:0 8px 10px #0000001a;background-color:var(--neutrals-1200)}.login-container .fixclear{height:20px}.login-section{flex:1 1;font-size:1rem;min-width:450px}.login-section:first-of-type{background-color:var(--primary-600);border-top-left-radius:8px;border-bottom-left-radius:8px}.login-section:not(:first-of-type){border-top-right-radius:8px;border-bottom-right-radius:8px}.login-section-second{display:flex;flex-direction:column;padding:4.75rem 3.5rem}.login-image{max-width:100%;height:100%}.login-title-primary{color:var(--primary-600);font-weight:700}.login-title-text{color:var(--primary-600)}.click-here-link{color:var(--primary);font-weight:700;text-decoration:none;font-size:inherit}@media (max-width: 750px){.login-section:first-of-type{display:none}}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3.SButtonComponent, selector: "s-button", inputs: ["disabled", "pill", "size", "invert", "type", "loading", "position", "theme"] }, { kind: "component", type: i4.SInputTextComponent, selector: "s-input-text", inputs: ["text", "id", "name", "placeHolder", "disabled", "max", "min", "step", "readOnly", "theme", "type", "classAdd", "help", "size", "rangeUnity"], outputs: ["textChangeEvent", "clickHelpIconEvent", "blur", "focus"] }, { kind: "component", type: i5.SErrorControl, selector: "s-error-control", inputs: ["theme", "icon", "iconCustom", "size"] }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.3", type: SLoginComponent, selector: "s-login", inputs: { urlForgotPassword: "urlForgotPassword", urlForgotPasswordTarget: "urlForgotPasswordTarget", errorMessage: "errorMessage", loading: "loading", model: "model", imgSrc: "imgSrc" }, outputs: { loginEvent: "loginEvent" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"login-container\">\r\n    <div class=\"login-section\">\r\n        <img class=\"login-image\" [src]=\"imgSrc\" alt=\"\">\r\n    </div>\r\n    <div class=\"login-section\">\r\n        <div class=\"login-section-second\">\r\n            <div style=\"flex: 3;\">\r\n                <h2 class=\"login-title-primary\">{{model.product}}</h2>\r\n                <br>\r\n            </div>\r\n            <div style=\"flex: 4;\">\r\n\r\n                \r\n                <div class=\"form-group\">\r\n                    <label class=\"label\">{{model.userLabel}}</label>\r\n                    <s-input-text [theme]=\"email ? 'red' : ''\" [type]=\"'email'\" [name]=\"'email'\" [placeHolder]=\"model.userPlaceholder\" \r\n                    (textChangeEvent)=\"changeEmail($event)\" (keyup.enter)=\"login()\"></s-input-text>\r\n                    <div *ngIf=\"!email\" class=\"fixclear\"></div>\r\n                    <s-error-control *ngIf=\"email\" theme =\"red\">{{email}}</s-error-control>\r\n                </div> \r\n\r\n                <div class=\"form-group\">\r\n                    <label class=\"label\">{{model.paswordLabel}}</label>\r\n                    <s-input-text [theme]=\"password ? 'red' : ''\" [type]=\"'password'\" [name]=\"'password'\" [placeHolder]=\"model.paswordPlaceholder\" \r\n                    (textChangeEvent)=\"changePassword($event)\" (keyup.enter)=\"login()\"></s-input-text>\r\n                    <div *ngIf=\"!password\" class=\"fixclear\"></div>\r\n                    <s-error-control *ngIf=\"password\" theme =\"red\">{{email}}</s-error-control>\r\n                </div>\r\n\r\n\r\n            </div>\r\n            <div style=\"flex: 2;text-align: center;\">\r\n                <br>\r\n                <p *ngIf=\"urlForgotPassword\" class=\"s-caption\">\u00BFOlvidaste tu contrase\u00F1a? <a class=\"click-here-link\" target=\"{{urlForgotPasswordTarget}}\"\r\n                        [href]=\"urlForgotPassword\">Haz clic aqu\u00ED</a> para recuperarla</p>\r\n                <br>\r\n            </div>\r\n            <div style=\"flex: 1; text-align: center;\">\r\n                <div>\r\n                    <s-error-control *ngIf=\"errorMessage\" theme=\"red\"><span class=\"s-caption\">{{errorMessage}}</span></s-error-control>\r\n                </div>\r\n                <s-button [loading]=\"loading\" [disabled]=\"loading\" size=\"md\" (click)=\"login()\">{{model.buttonText}}</s-button>\r\n            </div>\r\n        </div>\r\n    </div>\r\n</div>", styles: ["@import\"https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,400;0,500;0,700;1,400;1,500;1,700&display=swap\";html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;vertical-align:baseline}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:\"\";content:none}table{border-collapse:collapse;border-spacing:0}*{font-family:Roboto,Arial,sans-serif;font-size:16px;letter-spacing:.2px;line-height:20px;font-weight:400}h1,h2,h3,h4,h5,h6{margin:0;font-weight:700}h1{font-size:2.5rem;line-height:3.75rem}h2{font-size:2rem;line-height:2.5rem}h3{font-size:1.75rem;line-height:2.2rem}h4{font-size:1.5rem;line-height:1.875rem}h5{font-size:1.25rem;line-height:1.5rem}h6{font-size:1rem;line-height:1.5rem}p{font-size:1rem}a{font-size:1rem;line-height:1.5rem}.s-subtitle{font-size:1rem;line-height:1.5rem;letter-spacing:.15px}.s-subtitle-bold{font-size:1rem;line-height:1.5rem;font-weight:700;letter-spacing:.1px}.s-body-1{font-size:1rem;line-height:1.5rem;letter-spacing:.5px}.s-body-2{font-size:.875rem;line-height:1.375rem;letter-spacing:.25px}.s-button-xl,.s-button-xl-bold{font-size:1.125rem;line-height:1.75rem;letter-spacing:.5px}.s-button-lg,.s-button-lg-bold{font-size:1rem;line-height:1.5rem;letter-spacing:.5px}.s-button-sm,.s-button-sm-bold{font-size:.875rem;line-height:1.375rem;letter-spacing:.2px}.s-button-xs,.s-button-xs-bold{font-size:.75rem;line-height:1.125rem;letter-spacing:.1px}.s-button-xl-bold,.s-button-lg-bold,.s-button-sm-bold,.s-button-xs-bold{font-weight:700}.s-caption{font-size:.75rem;line-height:1.125rem;letter-spacing:.5px}.s-overline{font-size:.75rem;line-height:1.125rem;font-weight:500;letter-spacing:1.5px}.s-link-1{font-size:1rem;line-height:1.5rem;text-decoration:underline;letter-spacing:.5px}.s-link-2{font-size:1rem;line-height:1.5rem;letter-spacing:.5px}.s-link-3{font-size:.875rem;line-height:1.3rem;text-decoration:underline;letter-spacing:.5px}.s-link-4{font-size:.875rem;line-height:1.3rem;letter-spacing:.5px}@media only screen and (max-width: 600px){h1{font-size:2rem;line-height:2.5rem}h2,h3{font-size:1.5rem;line-height:1.875rem}h4{font-size:1.25rem;line-height:1.5rem}h5{font-size:1rem;line-height:1.25rem}}:root{--primary-100: #E6F4FF;--primary-200: #CCE9FF;--primary-300: #99D3FF;--primary-400: #66BDFE;--primary-500: #33A7FE;--primary-600: #0091FE;--primary-700: #0074CB;--primary-800: #005798;--primary-900: #003A66;--primary-1000: #001D33;--secondary-100: #E4EDF9;--secondary-200: #BBC9DB;--secondary-300: #92A5BC;--secondary-400: #69809E;--secondary-500: #405C7F;--secondary-600: #173861;--secondary-700: #122D4E;--secondary-800: #0E223A;--secondary-900: #091627;--secondary-1000: #07111D;--neutrals-100: #000000;--neutrals-200: #1E1E1E;--neutrals-300: #3C3C3C;--neutrals-400: #5A5A5A;--neutrals-500: #787878;--neutrals-600: #969696;--neutrals-700: #B4B4B4;--neutrals-800: #CECECE;--neutrals-900: #E0E0E0;--neutrals-1000: #EEEEEE;--neutrals-1100: #F7F7F7;--neutrals-1200: #FFFFFF;--green-100:#F3F8F5;--green-200:#E5F2EB;--green-300:#C8E4D5;--green-400:#A7D5BD;--green-500:#7CC5A0;--green-600:#36B37E;--green-700:#30A071;--green-800:#2A8B62;--green-900:#227150;--green-1000:#185038;--yellow-100:#FEF6E6;--yellow-200:#FEEDCD;--yellow-300:#FFDD86;--yellow-400:#FFCB59;--yellow-500:#FFB828;--yellow-600:#F9A60C;--yellow-700:#EC9709;--yellow-800:#DF8806;--yellow-900:#D37A03;--yellow-1000:#B26000;--red-100:#FFF1EC;--red-200:#FFE8E0;--red-300:#FDD1CA;--red-400:#FBB9B3;--red-500:#F68783;--red-600:#F46A68;--red-700:#F14848;--red-800:#E12E2E;--red-900:#CB1818;--red-1000:#B30000;--blue-alpha-100:rgba(23, 56, 97, .05);--blue-alpha-200:rgba(23, 56, 97, .125);--blue-alpha-300:rgba(23, 56, 97, .25);--blue-alpha-400:rgba(23, 56, 97, .375);--blue-alpha-500:rgba(23, 56, 97, .5);--blue-alpha-600:rgba(23, 56, 97, .625);--blue-alpha-700:rgba(23, 56, 97, .75);--blue-alpha-800:rgba(23, 56, 97, .875);--cyan-alpha-100:rgba(0, 145, 254, .05);--cyan-alpha-200:rgba(0, 145, 254, .125);--cyan-alpha-300:rgba(0, 145, 254, .25);--cyan-alpha-400:rgba(0, 145, 254, .375);--cyan-alpha-500:rgba(0, 145, 254, .5);--cyan-alpha-600:rgba(0, 145, 254, .625);--cyan-alpha-700:rgba(0, 145, 254, .75);--cyan-alpha-800:rgba(0, 145, 254, .875);--E000: 0px 0px 2px 0px rgba(23, 56, 97, .14);--E100: 0px 0px 10px 0px rgba(23, 56, 97, .14);--E200: 0px 0px 16px 0px rgba(23, 56, 97, .16);--E300: 0px 5px 24px 0px rgba(23, 56, 97, .18);--E400: 0px 0px 24px 0px rgba(23, 56, 97, .12), 0px 8px 20px 0px rgba(23, 56, 97, .06), 0px 4px 28px 0px rgba(23, 56, 97, .16);--E500: 0px 16px 32px 0px rgba(23, 56, 97, .16), 0px 0px 10px 0px rgba(23, 56, 97, .08), 0px 16px 28px 0px rgba(23, 56, 97, .12);--E600: 0px 16px 32px 0px rgba(23, 56, 97, .16), 0px 0px 10px 0px rgba(23, 56, 97, .08), 0px 16px 28px 0px rgba(23, 56, 97, .12);--focus-cyan--sm: 0px 1px 2px 0px rgba(16, 24, 40, .05), 0px 0px 0px 2px rgba(0, 145, 254, .15);--focus-cyan--md: 0px 1px 2px 0px rgba(16, 24, 40, .05), 0px 0px 0px 4px rgba(0, 145, 254, .15);--focus-blue--sm: 0px 1px 2px 0px rgba(16, 24, 40, .05), 0px 0px 0px 2px rgba(23, 56, 97, .15);--focus-blue--md: 0px 1px 2px 0px rgba(16, 24, 40, .05), 0px 0px 0px 4px rgba(23, 56, 97, .15);--focus-green--sm: 0px 1px 2px 0px rgba(16, 24, 40, .05), 0px 0px 0px 2px rgba(54, 179, 126, .15);--focus-green--md: 0px 1px 2px 0px rgba(16, 24, 40, .05), 0px 0px 0px 4px rgba(54, 179, 126, .15);--focus-yellow--sm: 0px 1px 2px 0px rgba(16, 24, 40, .05), 0px 0px 0px 2px rgba(255, 171, 0, .15);--focus-yellow--md: 0px 1px 2px 0px rgba(16, 24, 40, .05), 0px 0px 0px 4px rgba(255, 171, 0, .15);--focus-red--sm: 0px 1px 2px 0px rgba(16, 24, 40, .05), 0px 0px 0px 2px rgba(255, 86, 48, .15);--focus-red--md: 0px 1px 2px 0px rgba(16, 24, 40, .05), 0px 0px 0px 4px rgba(255, 86, 48, .15)}.skeleton-loading{background:linear-gradient(.25turn,transparent,#fff,transparent),linear-gradient(#eee,#eee),radial-gradient(38px circle at 19px 19px,#eee 50%,transparent 51%),linear-gradient(#eee,#eee);animation:skeleton-animation 1.5s infinite ease-in-out}@keyframes skeleton-animation{0%{opacity:.6}50%{opacity:.8}to{opacity:.6}}::selection{background:var(--primary-600);color:var(--neutrals-100)}.no-select{-webkit-touch-callout:none;-webkit-user-select:none;user-select:none}.cursor{cursor:pointer;-webkit-touch-callout:none;-webkit-user-select:none;user-select:none}.w-25{width:25%!important}.w-33{width:33%!important}.w-50{width:50%!important}.w-75{width:75%!important}.w-100{width:100%!important}.p-0{padding:0!important}.p-1{padding:.25em}.p-2{padding:.5em}.p-3{padding:1em}.p-4{padding:1.5em}.p-5{padding:3em}.px-0{padding:0}.px-1{padding:.25em 0}.px-2{padding:.5em 0}.px-3{padding:1em 0}.px-4{padding:1.5em 0}.px-5{padding:3em 0}.py-0{padding:0}.py-1{padding:0 .25em}.py-2{padding:0 .5em}.py-3{padding:0 1em}.py-4{padding:0 1.5em}.py-5{padding:0 3em}.pt-0{padding-top:0}.pt-1{padding-top:.25em}.pt-2{padding-top:.5em}.pt-3{padding-top:1em}.pt-4{padding-top:1.5em}.pt-5{padding-top:3em}.pr-0{padding-right:0}.pr-1{padding-right:.25em}.pr-2{padding-right:.5em}.pr-3{padding-right:1em}.pr-4{padding-right:1.5em}.pr-5{padding-right:3em}.pb-0{padding-bottom:0}.pb-1{padding-bottom:.25em}.pb-2{padding-bottom:.5em}.pb-3{padding-bottom:1em}.pb-4{padding-bottom:1.5em}.pb-5{padding-bottom:3em}.pl-0{padding-left:0}.pl-1{padding-left:.25em}.pl-2{padding-left:.5em}.pl-3{padding-left:1em}.pl-4{padding-left:1.5em}.pl-5{padding-left:3em}.m-auto{margin:0 auto}.m-0{margin:0}.m-1{margin:.25em}.m-2{margin:.5em}.m-3{margin:1em}.m-4{margin:1.5em}.m-5{margin:3em}.mx-0{margin:0}.mx-1{margin:.25em 0}.mx-2{margin:.5em 0}.mx-3{margin:1em 0}.mx-4{margin:1.5em 0}.mx-5{margin:3em 0}.my-0{margin:0}.my-1{margin:0 .25em}.my-2{margin:0 .5em}.my-3{margin:0 1em}.my-4{margin:0 1.5em}.my-5{margin:0 3em}.mt-0{margin-top:0}.mt-1{margin-top:.25em}.mt-2{margin-top:.5em}.mt-3{margin-top:1em}.mt-4{margin-top:1.5em}.mt-5{margin-top:3em}.mr-0{margin-right:0}.mr-1{margin-right:.25em}.mr-2{margin-right:.5em}.mr-3{margin-right:1em}.mr-4{margin-right:1.5em}.mr-5{margin-right:3em}.mb-0{margin-bottom:0}.mb-1{margin-bottom:.25em}.mb-2{margin-bottom:.5em}.mb-3{margin-bottom:1em}.mb-4{margin-bottom:1.5em}.mb-5{margin-bottom:3em}.ml-0{margin-left:0}.ml-1{margin-left:.25em}.ml-2{margin-left:.5em}.ml-3{margin-left:1em}.ml-4{margin-left:1.5em}.ml-5{margin-left:3em}.d-flex{display:flex}.fx-right{flex-direction:row-reverse}.fx-left{flex-direction:row}.justify-content-start{justify-content:flex-start!important}.justify-content-center{justify-content:center!important}.justify-content-end{justify-content:flex-end!important}.justify-content-between{justify-content:space-between!important}.justify-content-around{justify-content:space-around!important}.align-center{align-items:center}.text-start{text-align:left!important}.text-center{text-align:center!important}.text-end{text-align:right!important}.border,.border-1{border:1px solid}.border-2{border:2px solid}.border-left-1,.border-left{border-left:1px solid}.border-left-2{border-left:2px solid}.border-right-1,.border-right{border-right:1px solid}.border-right-2{border-right:2px solid}.border-top-1,.border-top{border-top:1px solid}.border-top-2{border-top:2px solid}.border-bottom-1,.border-bottom{border-bottom:1px solid}.border-bottom-2{border-bottom:2px solid}.border-y-1,.border-y{border-top:1px solid;border-bottom:1px solid}.border-y-2{border-top:2px solid;border-bottom:2px solid}.border-x-1,.border-x{border-left:1px solid;border-right:1px solid}.border-x-2{border-left:2px solid;border-right:2px solid}.br-1{border-radius:2px}.br-2{border-radius:4px}.br-3{border-radius:8px}.shadow-inner-1{box-shadow:inset 0 2px 2px #0000001a}.shadow-inner-2{box-shadow:inset 0 4px 8px #0000001a}.shadow-outer-1{box-shadow:0 2px 2px #0000001a}.shadow-outer-2{box-shadow:0 4px 8px #0000001a}.opacity-100{opacity:1}.opacity-90{opacity:.9}.opacity-80{opacity:.8}.opacity-70{opacity:.7}.opacity-60{opacity:.6}.opacity-50{opacity:.5}.opacity-40{opacity:.4}.opacity-30{opacity:.3}.opacity-20{opacity:.2}.opacity-10{opacity:.1}.highlighter,.highlighter-primary{color:var(--primary-600)}.highlighter-succes{color:var(--green-500)}.highlighter-warning{color:var(--yellow-600)}.highlighter-error{color:var(--red-600)}.highlighter-info{color:var(--secondary-600)}.s-scroll::-webkit-scrollbar{width:.7rem}.s-scroll::-webkit-scrollbar-track{background-color:transparent}.s-scroll::-webkit-scrollbar-thumb{background-color:var(--neutrals-900);border-radius:20px 13px 13px 20px;border-right:.1em solid transparent;border-left:.3rem solid transparent;background-clip:content-box}.label-content{display:inline-flex;align-items:center;margin-left:3px;font-weight:400;font-size:.875rem;line-height:0px}.label-content.sm{font-size:.625rem}.label-content s-icon-mat{display:flex;align-items:center;margin-right:3px}.label-content s-icon-mat span{font-size:1.01rem}.icon-default,.label-content-default{color:var(--secondary-500)}.icon-yellow,.label-content-yellow{color:var(--yellow-600)}.icon-red,.label-content-red{color:var(--red-600)}.icon-green,.label-content-green{color:var(--green-600)}.form-group{margin:5px}.form-group .label{font-weight:400;font-size:.875rem;color:var(--secondary-600)}.form-group .content-input-main-626.sm{margin:0}.login-container{width:100%;height:100%;max-width:900px;max-height:600px;display:flex;flex-direction:row;color:var(--text);border-radius:8px;box-shadow:0 8px 10px #0000001a;background-color:var(--neutrals-1200)}.login-container .fixclear{height:20px}.login-section{flex:1 1;font-size:1rem;min-width:450px}.login-section:first-of-type{background-color:var(--primary-600);border-top-left-radius:8px;border-bottom-left-radius:8px}.login-section:not(:first-of-type){border-top-right-radius:8px;border-bottom-right-radius:8px}.login-section-second{display:flex;flex-direction:column;padding:4.75rem 3.5rem}.login-image{max-width:100%;height:100%}.login-title-primary{color:var(--primary-600);font-weight:700}.login-title-text{color:var(--primary-600)}.click-here-link{color:var(--primary);font-weight:700;text-decoration:none;font-size:inherit}@media (max-width: 750px){.login-section:first-of-type{display:none}}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3.SButtonComponent, selector: "s-button", inputs: ["disabled", "pill", "size", "invert", "type", "loading", "position", "theme"] }, { kind: "component", type: i4.SInputTextComponent, selector: "s-input-text", inputs: ["text", "id", "name", "placeHolder", "disabled", "max", "min", "step", "readOnly", "theme", "type", "classAdd", "help", "size", "rangeUnity"], outputs: ["textChangeEvent", "clickHelpIconEvent", "blur", "focus"] }, { kind: "component", type: i5.SErrorControl, selector: "s-error-control", inputs: ["theme", "icon", "iconCustom", "size"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: SLoginComponent, decorators: [{
             type: Component,
-            args: [{ selector: 's-login', template: "<div class=\"login-container\">\r\n    <div class=\"login-section\">\r\n        <img class=\"login-image\" [src]=\"imgSrc\" alt=\"\">\r\n    </div>\r\n    <div class=\"login-section\">\r\n        <div class=\"login-section-second\">\r\n            <div style=\"flex: 3;\">\r\n                <h2 class=\"login-title-primary\">{{model.product}}</h2>\r\n                <br>\r\n            </div>\r\n            <div style=\"flex: 4;\">\r\n\r\n                \r\n                <div class=\"form-group\">\r\n                    <label class=\"label\">{{model.userLabel}}</label>\r\n                    <s-input-text [theme]=\"email ? 'red' : ''\" [type]=\"'email'\" [name]=\"'email'\" [placeHolder]=\"model.userPlaceholder\" \r\n                    (textChangeEvent)=\"changeEmail($event)\" (keyup.enter)=\"login()\"></s-input-text>\r\n                    <div *ngIf=\"!email\" class=\"fixclear\"></div>\r\n                    <s-error-control *ngIf=\"email\" theme =\"red\">{{email}}</s-error-control>\r\n                </div> \r\n\r\n                <div class=\"form-group\">\r\n                    <label class=\"label\">{{model.paswordLabel}}</label>\r\n                    <s-input-text [theme]=\"password ? 'red' : ''\" [type]=\"'password'\" [name]=\"'password'\" [placeHolder]=\"model.paswordPlaceholder\" \r\n                    (textChangeEvent)=\"changePassword($event)\" (keyup.enter)=\"login()\"></s-input-text>\r\n                    <div *ngIf=\"!password\" class=\"fixclear\"></div>\r\n                    <s-error-control *ngIf=\"password\" theme =\"red\">{{email}}</s-error-control>\r\n                </div>\r\n\r\n\r\n            </div>\r\n            <div style=\"flex: 2;text-align: center;\">\r\n                <br>\r\n                <p *ngIf=\"urlForgotPassword\" class=\"s-caption\">\u00BFOlvidaste tu contrase\u00F1a? <a class=\"click-here-link\" target=\"{{urlForgotPasswordTarget}}\"\r\n                        [href]=\"urlForgotPassword\">Haz clic aqu\u00ED</a> para recuperarla</p>\r\n                <br>\r\n            </div>\r\n            <div style=\"flex: 1; text-align: center;\">\r\n                <div>\r\n                    <s-error-control *ngIf=\"errorMessage\" theme=\"red\"><span class=\"s-caption\">{{errorMessage}}</span></s-error-control>\r\n                </div>\r\n                <s-button [loading]=\"loading\" [disabled]=\"loading\" size=\"md\" (click)=\"login()\">{{model.buttonText}}</s-button>\r\n            </div>\r\n        </div>\r\n    </div>\r\n</div>", styles: ["@import\"https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,400;0,500;0,700;1,400;1,500;1,700&display=swap\";html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;vertical-align:baseline}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:\"\";content:none}table{border-collapse:collapse;border-spacing:0}*{font-family:Roboto,Arial,sans-serif;font-size:16px;letter-spacing:.2px;line-height:20px;font-weight:400}h1,h2,h3,h4,h5,h6{margin:0;font-weight:700}h1{font-size:2.5rem;line-height:3.75rem}h2{font-size:2rem;line-height:2.5rem}h3{font-size:1.75rem;line-height:2.2rem}h4{font-size:1.5rem;line-height:1.875rem}h5{font-size:1.25rem;line-height:1.5rem}h6{font-size:1rem;line-height:1.5rem}p{font-size:1rem}a{font-size:1rem;line-height:1.5rem}.s-subtitle{font-size:1rem;line-height:1.5rem;letter-spacing:.15px}.s-subtitle-bold{font-size:1rem;line-height:1.5rem;font-weight:700;letter-spacing:.1px}.s-body-1{font-size:1rem;line-height:1.5rem;letter-spacing:.5px}.s-body-2{font-size:.875rem;line-height:1.375rem;letter-spacing:.25px}.s-button-xl,.s-button-xl-bold{font-size:1.125rem;line-height:1.75rem;letter-spacing:.5px}.s-button-lg,.s-button-lg-bold{font-size:1rem;line-height:1.5rem;letter-spacing:.5px}.s-button-sm,.s-button-sm-bold{font-size:.875rem;line-height:1.375rem;letter-spacing:.2px}.s-button-xs,.s-button-xs-bold{font-size:.75rem;line-height:1.125rem;letter-spacing:.1px}.s-button-xl-bold,.s-button-lg-bold,.s-button-sm-bold,.s-button-xs-bold{font-weight:700}.s-caption{font-size:.75rem;line-height:1.125rem;letter-spacing:.5px}.s-overline{font-size:.75rem;line-height:1.125rem;font-weight:500;letter-spacing:1.5px}.s-link-1{font-size:1rem;line-height:1.5rem;text-decoration:underline;letter-spacing:.5px}.s-link-2{font-size:1rem;line-height:1.5rem;letter-spacing:.5px}.s-link-3{font-size:.875rem;line-height:1.3rem;text-decoration:underline;letter-spacing:.5px}.s-link-4{font-size:.875rem;line-height:1.3rem;letter-spacing:.5px}@media only screen and (max-width: 600px){h1{font-size:2rem;line-height:2.5rem}h2,h3{font-size:1.5rem;line-height:1.875rem}h4{font-size:1.25rem;line-height:1.5rem}h5{font-size:1rem;line-height:1.25rem}}:root{--primary-100: #E6F4FF;--primary-200: #CCE9FF;--primary-300: #99D3FF;--primary-400: #66BDFE;--primary-500: #33A7FE;--primary-600: #0091FE;--primary-700: #0074CB;--primary-800: #005798;--primary-900: #003A66;--primary-1000: #001D33;--secondary-100: #E4EDF9;--secondary-200: #BBC9DB;--secondary-300: #92A5BC;--secondary-400: #69809E;--secondary-500: #405C7F;--secondary-600: #173861;--secondary-700: #122D4E;--secondary-800: #0E223A;--secondary-900: #091627;--secondary-1000: #07111D;--neutrals-100: #000000;--neutrals-200: #1E1E1E;--neutrals-300: #3C3C3C;--neutrals-400: #5A5A5A;--neutrals-500: #787878;--neutrals-600: #969696;--neutrals-700: #B4B4B4;--neutrals-800: #CECECE;--neutrals-900: #E0E0E0;--neutrals-1000: #EEEEEE;--neutrals-1100: #F7F7F7;--neutrals-1200: #FFFFFF;--green-100:#F3F8F5;--green-200:#E5F2EB;--green-300:#C8E4D5;--green-400:#A7D5BD;--green-500:#7CC5A0;--green-600:#36B37E;--green-700:#30A071;--green-800:#2A8B62;--green-900:#227150;--green-1000:#185038;--yellow-100:#FEF6E6;--yellow-200:#FEEDCD;--yellow-300:#FFDD86;--yellow-400:#FFCB59;--yellow-500:#FFB828;--yellow-600:#F9A60C;--yellow-700:#EC9709;--yellow-800:#DF8806;--yellow-900:#D37A03;--yellow-1000:#B26000;--red-100:#FFF1EC;--red-200:#FFE8E0;--red-300:#FDD1CA;--red-400:#FBB9B3;--red-500:#F68783;--red-600:#F46A68;--red-700:#F14848;--red-800:#E12E2E;--red-900:#CB1818;--red-1000:#B30000;--blue-alpha-100:rgba(23, 56, 97, .05);--blue-alpha-200:rgba(23, 56, 97, .125);--blue-alpha-300:rgba(23, 56, 97, .25);--blue-alpha-400:rgba(23, 56, 97, .375);--blue-alpha-500:rgba(23, 56, 97, .5);--blue-alpha-600:rgba(23, 56, 97, .625);--blue-alpha-700:rgba(23, 56, 97, .75);--blue-alpha-800:rgba(23, 56, 97, .875);--cyan-alpha-100:rgba(0, 145, 254, .05);--cyan-alpha-200:rgba(0, 145, 254, .125);--cyan-alpha-300:rgba(0, 145, 254, .25);--cyan-alpha-400:rgba(0, 145, 254, .375);--cyan-alpha-500:rgba(0, 145, 254, .5);--cyan-alpha-600:rgba(0, 145, 254, .625);--cyan-alpha-700:rgba(0, 145, 254, .75);--cyan-alpha-800:rgba(0, 145, 254, .875);--E000: 0px 0px 2px 0px rgba(23, 56, 97, .14);--E100: 0px 0px 10px 0px rgba(23, 56, 97, .14);--E200: 0px 0px 16px 0px rgba(23, 56, 97, .16);--E300: 0px 5px 24px 0px rgba(23, 56, 97, .18);--E400: 0px 0px 24px 0px rgba(23, 56, 97, .12), 0px 8px 20px 0px rgba(23, 56, 97, .06), 0px 4px 28px 0px rgba(23, 56, 97, .16);--E500: 0px 16px 32px 0px rgba(23, 56, 97, .16), 0px 0px 10px 0px rgba(23, 56, 97, .08), 0px 16px 28px 0px rgba(23, 56, 97, .12);--E600: 0px 16px 32px 0px rgba(23, 56, 97, .16), 0px 0px 10px 0px rgba(23, 56, 97, .08), 0px 16px 28px 0px rgba(23, 56, 97, .12);--focus-cyan--sm: 0px 1px 2px 0px rgba(16, 24, 40, .05), 0px 0px 0px 2px rgba(0, 145, 254, .15);--focus-cyan--md: 0px 1px 2px 0px rgba(16, 24, 40, .05), 0px 0px 0px 4px rgba(0, 145, 254, .15);--focus-blue--sm: 0px 1px 2px 0px rgba(16, 24, 40, .05), 0px 0px 0px 2px rgba(23, 56, 97, .15);--focus-blue--md: 0px 1px 2px 0px rgba(16, 24, 40, .05), 0px 0px 0px 4px rgba(23, 56, 97, .15);--focus-green--sm: 0px 1px 2px 0px rgba(16, 24, 40, .05), 0px 0px 0px 2px rgba(54, 179, 126, .15);--focus-green--md: 0px 1px 2px 0px rgba(16, 24, 40, .05), 0px 0px 0px 4px rgba(54, 179, 126, .15);--focus-yellow--sm: 0px 1px 2px 0px rgba(16, 24, 40, .05), 0px 0px 0px 2px rgba(255, 171, 0, .15);--focus-yellow--md: 0px 1px 2px 0px rgba(16, 24, 40, .05), 0px 0px 0px 4px rgba(255, 171, 0, .15);--focus-red--sm: 0px 1px 2px 0px rgba(16, 24, 40, .05), 0px 0px 0px 2px rgba(255, 86, 48, .15);--focus-red--md: 0px 1px 2px 0px rgba(16, 24, 40, .05), 0px 0px 0px 4px rgba(255, 86, 48, .15)}.skeleton-loading{background:linear-gradient(.25turn,transparent,#fff,transparent),linear-gradient(#eee,#eee),radial-gradient(38px circle at 19px 19px,#eee 50%,transparent 51%),linear-gradient(#eee,#eee);animation:skeleton-animation 1.5s infinite ease-in-out}@keyframes skeleton-animation{0%{opacity:.6}50%{opacity:.8}to{opacity:.6}}::selection{background:var(--primary-600);color:var(--neutrals-100)}.no-select{-webkit-touch-callout:none;-webkit-user-select:none;user-select:none}.cursor{cursor:pointer;-webkit-touch-callout:none;-webkit-user-select:none;user-select:none}.w-25{width:25%!important}.w-33{width:33%!important}.w-50{width:50%!important}.w-75{width:75%!important}.w-100{width:100%!important}.p-0{padding:0!important}.p-1{padding:.25em}.p-2{padding:.5em}.p-3{padding:1em}.p-4{padding:1.5em}.p-5{padding:3em}.px-0{padding:0}.px-1{padding:.25em 0}.px-2{padding:.5em 0}.px-3{padding:1em 0}.px-4{padding:1.5em 0}.px-5{padding:3em 0}.py-0{padding:0}.py-1{padding:0 .25em}.py-2{padding:0 .5em}.py-3{padding:0 1em}.py-4{padding:0 1.5em}.py-5{padding:0 3em}.pt-0{padding-top:0}.pt-1{padding-top:.25em}.pt-2{padding-top:.5em}.pt-3{padding-top:1em}.pt-4{padding-top:1.5em}.pt-5{padding-top:3em}.pr-0{padding-right:0}.pr-1{padding-right:.25em}.pr-2{padding-right:.5em}.pr-3{padding-right:1em}.pr-4{padding-right:1.5em}.pr-5{padding-right:3em}.pb-0{padding-bottom:0}.pb-1{padding-bottom:.25em}.pb-2{padding-bottom:.5em}.pb-3{padding-bottom:1em}.pb-4{padding-bottom:1.5em}.pb-5{padding-bottom:3em}.pl-0{padding-left:0}.pl-1{padding-left:.25em}.pl-2{padding-left:.5em}.pl-3{padding-left:1em}.pl-4{padding-left:1.5em}.pl-5{padding-left:3em}.m-auto{margin:0 auto}.m-0{margin:0}.m-1{margin:.25em}.m-2{margin:.5em}.m-3{margin:1em}.m-4{margin:1.5em}.m-5{margin:3em}.mx-0{margin:0}.mx-1{margin:.25em 0}.mx-2{margin:.5em 0}.mx-3{margin:1em 0}.mx-4{margin:1.5em 0}.mx-5{margin:3em 0}.my-0{margin:0}.my-1{margin:0 .25em}.my-2{margin:0 .5em}.my-3{margin:0 1em}.my-4{margin:0 1.5em}.my-5{margin:0 3em}.mt-0{margin-top:0}.mt-1{margin-top:.25em}.mt-2{margin-top:.5em}.mt-3{margin-top:1em}.mt-4{margin-top:1.5em}.mt-5{margin-top:3em}.mr-0{margin-right:0}.mr-1{margin-right:.25em}.mr-2{margin-right:.5em}.mr-3{margin-right:1em}.mr-4{margin-right:1.5em}.mr-5{margin-right:3em}.mb-0{margin-bottom:0}.mb-1{margin-bottom:.25em}.mb-2{margin-bottom:.5em}.mb-3{margin-bottom:1em}.mb-4{margin-bottom:1.5em}.mb-5{margin-bottom:3em}.ml-0{margin-left:0}.ml-1{margin-left:.25em}.ml-2{margin-left:.5em}.ml-3{margin-left:1em}.ml-4{margin-left:1.5em}.ml-5{margin-left:3em}.d-flex{display:flex}.fx-right{flex-direction:row-reverse}.fx-left{flex-direction:row}.justify-content-start{justify-content:flex-start!important}.justify-content-center{justify-content:center!important}.justify-content-end{justify-content:flex-end!important}.justify-content-between{justify-content:space-between!important}.justify-content-around{justify-content:space-around!important}.align-center{align-items:center}.text-start{text-align:left!important}.text-center{text-align:center!important}.text-end{text-align:right!important}.border,.border-1{border:1px solid}.border-2{border:2px solid}.border-left-1,.border-left{border-left:1px solid}.border-left-2{border-left:2px solid}.border-right-1,.border-right{border-right:1px solid}.border-right-2{border-right:2px solid}.border-top-1,.border-top{border-top:1px solid}.border-top-2{border-top:2px solid}.border-bottom-1,.border-bottom{border-bottom:1px solid}.border-bottom-2{border-bottom:2px solid}.border-y-1,.border-y{border-top:1px solid;border-bottom:1px solid}.border-y-2{border-top:2px solid;border-bottom:2px solid}.border-x-1,.border-x{border-left:1px solid;border-right:1px solid}.border-x-2{border-left:2px solid;border-right:2px solid}.br-1{border-radius:2px}.br-2{border-radius:4px}.br-3{border-radius:8px}.shadow-inner-1{box-shadow:inset 0 2px 2px #0000001a}.shadow-inner-2{box-shadow:inset 0 4px 8px #0000001a}.shadow-outer-1{box-shadow:0 2px 2px #0000001a}.shadow-outer-2{box-shadow:0 4px 8px #0000001a}.opacity-100{opacity:1}.opacity-90{opacity:.9}.opacity-80{opacity:.8}.opacity-70{opacity:.7}.opacity-60{opacity:.6}.opacity-50{opacity:.5}.opacity-40{opacity:.4}.opacity-30{opacity:.3}.opacity-20{opacity:.2}.opacity-10{opacity:.1}.highlighter,.highlighter-primary{color:var(--primary-600)}.highlighter-succes{color:var(--green-500)}.highlighter-warning{color:var(--yellow-600)}.highlighter-error{color:var(--red-600)}.highlighter-info{color:var(--secondary-600)}.s-scroll::-webkit-scrollbar{width:.7rem}.s-scroll::-webkit-scrollbar-track{background-color:transparent}.s-scroll::-webkit-scrollbar-thumb{background-color:var(--neutrals-900);border-radius:6px 10px 10px 6px;border-right:.3rem solid transparent;background-clip:content-box}.label-content{display:inline-flex;align-items:center;margin-left:3px;font-weight:400;font-size:.875rem;line-height:0px}.label-content.sm{font-size:.625rem}.label-content s-icon-mat{display:flex;align-items:center;margin-right:3px}.label-content s-icon-mat span{font-size:1.01rem}.icon-default,.label-content-default{color:var(--secondary-500)}.icon-yellow,.label-content-yellow{color:var(--yellow-600)}.icon-red,.label-content-red{color:var(--red-600)}.icon-green,.label-content-green{color:var(--green-600)}.form-group{margin:5px}.form-group .label{font-weight:400;font-size:.875rem;color:var(--secondary-600)}.form-group .content-input-main-626.sm{margin:0}.login-container{width:100%;height:100%;max-width:900px;max-height:600px;display:flex;flex-direction:row;color:var(--text);border-radius:8px;box-shadow:0 8px 10px #0000001a;background-color:var(--neutrals-1200)}.login-container .fixclear{height:20px}.login-section{flex:1 1;font-size:1rem;min-width:450px}.login-section:first-of-type{background-color:var(--primary-600);border-top-left-radius:8px;border-bottom-left-radius:8px}.login-section:not(:first-of-type){border-top-right-radius:8px;border-bottom-right-radius:8px}.login-section-second{display:flex;flex-direction:column;padding:4.75rem 3.5rem}.login-image{max-width:100%;height:100%}.login-title-primary{color:var(--primary-600);font-weight:700}.login-title-text{color:var(--primary-600)}.click-here-link{color:var(--primary);font-weight:700;text-decoration:none;font-size:inherit}@media (max-width: 750px){.login-section:first-of-type{display:none}}\n"] }]
+            args: [{ selector: 's-login', template: "<div class=\"login-container\">\r\n    <div class=\"login-section\">\r\n        <img class=\"login-image\" [src]=\"imgSrc\" alt=\"\">\r\n    </div>\r\n    <div class=\"login-section\">\r\n        <div class=\"login-section-second\">\r\n            <div style=\"flex: 3;\">\r\n                <h2 class=\"login-title-primary\">{{model.product}}</h2>\r\n                <br>\r\n            </div>\r\n            <div style=\"flex: 4;\">\r\n\r\n                \r\n                <div class=\"form-group\">\r\n                    <label class=\"label\">{{model.userLabel}}</label>\r\n                    <s-input-text [theme]=\"email ? 'red' : ''\" [type]=\"'email'\" [name]=\"'email'\" [placeHolder]=\"model.userPlaceholder\" \r\n                    (textChangeEvent)=\"changeEmail($event)\" (keyup.enter)=\"login()\"></s-input-text>\r\n                    <div *ngIf=\"!email\" class=\"fixclear\"></div>\r\n                    <s-error-control *ngIf=\"email\" theme =\"red\">{{email}}</s-error-control>\r\n                </div> \r\n\r\n                <div class=\"form-group\">\r\n                    <label class=\"label\">{{model.paswordLabel}}</label>\r\n                    <s-input-text [theme]=\"password ? 'red' : ''\" [type]=\"'password'\" [name]=\"'password'\" [placeHolder]=\"model.paswordPlaceholder\" \r\n                    (textChangeEvent)=\"changePassword($event)\" (keyup.enter)=\"login()\"></s-input-text>\r\n                    <div *ngIf=\"!password\" class=\"fixclear\"></div>\r\n                    <s-error-control *ngIf=\"password\" theme =\"red\">{{email}}</s-error-control>\r\n                </div>\r\n\r\n\r\n            </div>\r\n            <div style=\"flex: 2;text-align: center;\">\r\n                <br>\r\n                <p *ngIf=\"urlForgotPassword\" class=\"s-caption\">\u00BFOlvidaste tu contrase\u00F1a? <a class=\"click-here-link\" target=\"{{urlForgotPasswordTarget}}\"\r\n                        [href]=\"urlForgotPassword\">Haz clic aqu\u00ED</a> para recuperarla</p>\r\n                <br>\r\n            </div>\r\n            <div style=\"flex: 1; text-align: center;\">\r\n                <div>\r\n                    <s-error-control *ngIf=\"errorMessage\" theme=\"red\"><span class=\"s-caption\">{{errorMessage}}</span></s-error-control>\r\n                </div>\r\n                <s-button [loading]=\"loading\" [disabled]=\"loading\" size=\"md\" (click)=\"login()\">{{model.buttonText}}</s-button>\r\n            </div>\r\n        </div>\r\n    </div>\r\n</div>", styles: ["@import\"https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,400;0,500;0,700;1,400;1,500;1,700&display=swap\";html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;vertical-align:baseline}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:\"\";content:none}table{border-collapse:collapse;border-spacing:0}*{font-family:Roboto,Arial,sans-serif;font-size:16px;letter-spacing:.2px;line-height:20px;font-weight:400}h1,h2,h3,h4,h5,h6{margin:0;font-weight:700}h1{font-size:2.5rem;line-height:3.75rem}h2{font-size:2rem;line-height:2.5rem}h3{font-size:1.75rem;line-height:2.2rem}h4{font-size:1.5rem;line-height:1.875rem}h5{font-size:1.25rem;line-height:1.5rem}h6{font-size:1rem;line-height:1.5rem}p{font-size:1rem}a{font-size:1rem;line-height:1.5rem}.s-subtitle{font-size:1rem;line-height:1.5rem;letter-spacing:.15px}.s-subtitle-bold{font-size:1rem;line-height:1.5rem;font-weight:700;letter-spacing:.1px}.s-body-1{font-size:1rem;line-height:1.5rem;letter-spacing:.5px}.s-body-2{font-size:.875rem;line-height:1.375rem;letter-spacing:.25px}.s-button-xl,.s-button-xl-bold{font-size:1.125rem;line-height:1.75rem;letter-spacing:.5px}.s-button-lg,.s-button-lg-bold{font-size:1rem;line-height:1.5rem;letter-spacing:.5px}.s-button-sm,.s-button-sm-bold{font-size:.875rem;line-height:1.375rem;letter-spacing:.2px}.s-button-xs,.s-button-xs-bold{font-size:.75rem;line-height:1.125rem;letter-spacing:.1px}.s-button-xl-bold,.s-button-lg-bold,.s-button-sm-bold,.s-button-xs-bold{font-weight:700}.s-caption{font-size:.75rem;line-height:1.125rem;letter-spacing:.5px}.s-overline{font-size:.75rem;line-height:1.125rem;font-weight:500;letter-spacing:1.5px}.s-link-1{font-size:1rem;line-height:1.5rem;text-decoration:underline;letter-spacing:.5px}.s-link-2{font-size:1rem;line-height:1.5rem;letter-spacing:.5px}.s-link-3{font-size:.875rem;line-height:1.3rem;text-decoration:underline;letter-spacing:.5px}.s-link-4{font-size:.875rem;line-height:1.3rem;letter-spacing:.5px}@media only screen and (max-width: 600px){h1{font-size:2rem;line-height:2.5rem}h2,h3{font-size:1.5rem;line-height:1.875rem}h4{font-size:1.25rem;line-height:1.5rem}h5{font-size:1rem;line-height:1.25rem}}:root{--primary-100: #E6F4FF;--primary-200: #CCE9FF;--primary-300: #99D3FF;--primary-400: #66BDFE;--primary-500: #33A7FE;--primary-600: #0091FE;--primary-700: #0074CB;--primary-800: #005798;--primary-900: #003A66;--primary-1000: #001D33;--secondary-100: #E4EDF9;--secondary-200: #BBC9DB;--secondary-300: #92A5BC;--secondary-400: #69809E;--secondary-500: #405C7F;--secondary-600: #173861;--secondary-700: #122D4E;--secondary-800: #0E223A;--secondary-900: #091627;--secondary-1000: #07111D;--neutrals-100: #000000;--neutrals-200: #1E1E1E;--neutrals-300: #3C3C3C;--neutrals-400: #5A5A5A;--neutrals-500: #787878;--neutrals-600: #969696;--neutrals-700: #B4B4B4;--neutrals-800: #CECECE;--neutrals-900: #E0E0E0;--neutrals-1000: #EEEEEE;--neutrals-1100: #F7F7F7;--neutrals-1200: #FFFFFF;--green-100:#F3F8F5;--green-200:#E5F2EB;--green-300:#C8E4D5;--green-400:#A7D5BD;--green-500:#7CC5A0;--green-600:#36B37E;--green-700:#30A071;--green-800:#2A8B62;--green-900:#227150;--green-1000:#185038;--yellow-100:#FEF6E6;--yellow-200:#FEEDCD;--yellow-300:#FFDD86;--yellow-400:#FFCB59;--yellow-500:#FFB828;--yellow-600:#F9A60C;--yellow-700:#EC9709;--yellow-800:#DF8806;--yellow-900:#D37A03;--yellow-1000:#B26000;--red-100:#FFF1EC;--red-200:#FFE8E0;--red-300:#FDD1CA;--red-400:#FBB9B3;--red-500:#F68783;--red-600:#F46A68;--red-700:#F14848;--red-800:#E12E2E;--red-900:#CB1818;--red-1000:#B30000;--blue-alpha-100:rgba(23, 56, 97, .05);--blue-alpha-200:rgba(23, 56, 97, .125);--blue-alpha-300:rgba(23, 56, 97, .25);--blue-alpha-400:rgba(23, 56, 97, .375);--blue-alpha-500:rgba(23, 56, 97, .5);--blue-alpha-600:rgba(23, 56, 97, .625);--blue-alpha-700:rgba(23, 56, 97, .75);--blue-alpha-800:rgba(23, 56, 97, .875);--cyan-alpha-100:rgba(0, 145, 254, .05);--cyan-alpha-200:rgba(0, 145, 254, .125);--cyan-alpha-300:rgba(0, 145, 254, .25);--cyan-alpha-400:rgba(0, 145, 254, .375);--cyan-alpha-500:rgba(0, 145, 254, .5);--cyan-alpha-600:rgba(0, 145, 254, .625);--cyan-alpha-700:rgba(0, 145, 254, .75);--cyan-alpha-800:rgba(0, 145, 254, .875);--E000: 0px 0px 2px 0px rgba(23, 56, 97, .14);--E100: 0px 0px 10px 0px rgba(23, 56, 97, .14);--E200: 0px 0px 16px 0px rgba(23, 56, 97, .16);--E300: 0px 5px 24px 0px rgba(23, 56, 97, .18);--E400: 0px 0px 24px 0px rgba(23, 56, 97, .12), 0px 8px 20px 0px rgba(23, 56, 97, .06), 0px 4px 28px 0px rgba(23, 56, 97, .16);--E500: 0px 16px 32px 0px rgba(23, 56, 97, .16), 0px 0px 10px 0px rgba(23, 56, 97, .08), 0px 16px 28px 0px rgba(23, 56, 97, .12);--E600: 0px 16px 32px 0px rgba(23, 56, 97, .16), 0px 0px 10px 0px rgba(23, 56, 97, .08), 0px 16px 28px 0px rgba(23, 56, 97, .12);--focus-cyan--sm: 0px 1px 2px 0px rgba(16, 24, 40, .05), 0px 0px 0px 2px rgba(0, 145, 254, .15);--focus-cyan--md: 0px 1px 2px 0px rgba(16, 24, 40, .05), 0px 0px 0px 4px rgba(0, 145, 254, .15);--focus-blue--sm: 0px 1px 2px 0px rgba(16, 24, 40, .05), 0px 0px 0px 2px rgba(23, 56, 97, .15);--focus-blue--md: 0px 1px 2px 0px rgba(16, 24, 40, .05), 0px 0px 0px 4px rgba(23, 56, 97, .15);--focus-green--sm: 0px 1px 2px 0px rgba(16, 24, 40, .05), 0px 0px 0px 2px rgba(54, 179, 126, .15);--focus-green--md: 0px 1px 2px 0px rgba(16, 24, 40, .05), 0px 0px 0px 4px rgba(54, 179, 126, .15);--focus-yellow--sm: 0px 1px 2px 0px rgba(16, 24, 40, .05), 0px 0px 0px 2px rgba(255, 171, 0, .15);--focus-yellow--md: 0px 1px 2px 0px rgba(16, 24, 40, .05), 0px 0px 0px 4px rgba(255, 171, 0, .15);--focus-red--sm: 0px 1px 2px 0px rgba(16, 24, 40, .05), 0px 0px 0px 2px rgba(255, 86, 48, .15);--focus-red--md: 0px 1px 2px 0px rgba(16, 24, 40, .05), 0px 0px 0px 4px rgba(255, 86, 48, .15)}.skeleton-loading{background:linear-gradient(.25turn,transparent,#fff,transparent),linear-gradient(#eee,#eee),radial-gradient(38px circle at 19px 19px,#eee 50%,transparent 51%),linear-gradient(#eee,#eee);animation:skeleton-animation 1.5s infinite ease-in-out}@keyframes skeleton-animation{0%{opacity:.6}50%{opacity:.8}to{opacity:.6}}::selection{background:var(--primary-600);color:var(--neutrals-100)}.no-select{-webkit-touch-callout:none;-webkit-user-select:none;user-select:none}.cursor{cursor:pointer;-webkit-touch-callout:none;-webkit-user-select:none;user-select:none}.w-25{width:25%!important}.w-33{width:33%!important}.w-50{width:50%!important}.w-75{width:75%!important}.w-100{width:100%!important}.p-0{padding:0!important}.p-1{padding:.25em}.p-2{padding:.5em}.p-3{padding:1em}.p-4{padding:1.5em}.p-5{padding:3em}.px-0{padding:0}.px-1{padding:.25em 0}.px-2{padding:.5em 0}.px-3{padding:1em 0}.px-4{padding:1.5em 0}.px-5{padding:3em 0}.py-0{padding:0}.py-1{padding:0 .25em}.py-2{padding:0 .5em}.py-3{padding:0 1em}.py-4{padding:0 1.5em}.py-5{padding:0 3em}.pt-0{padding-top:0}.pt-1{padding-top:.25em}.pt-2{padding-top:.5em}.pt-3{padding-top:1em}.pt-4{padding-top:1.5em}.pt-5{padding-top:3em}.pr-0{padding-right:0}.pr-1{padding-right:.25em}.pr-2{padding-right:.5em}.pr-3{padding-right:1em}.pr-4{padding-right:1.5em}.pr-5{padding-right:3em}.pb-0{padding-bottom:0}.pb-1{padding-bottom:.25em}.pb-2{padding-bottom:.5em}.pb-3{padding-bottom:1em}.pb-4{padding-bottom:1.5em}.pb-5{padding-bottom:3em}.pl-0{padding-left:0}.pl-1{padding-left:.25em}.pl-2{padding-left:.5em}.pl-3{padding-left:1em}.pl-4{padding-left:1.5em}.pl-5{padding-left:3em}.m-auto{margin:0 auto}.m-0{margin:0}.m-1{margin:.25em}.m-2{margin:.5em}.m-3{margin:1em}.m-4{margin:1.5em}.m-5{margin:3em}.mx-0{margin:0}.mx-1{margin:.25em 0}.mx-2{margin:.5em 0}.mx-3{margin:1em 0}.mx-4{margin:1.5em 0}.mx-5{margin:3em 0}.my-0{margin:0}.my-1{margin:0 .25em}.my-2{margin:0 .5em}.my-3{margin:0 1em}.my-4{margin:0 1.5em}.my-5{margin:0 3em}.mt-0{margin-top:0}.mt-1{margin-top:.25em}.mt-2{margin-top:.5em}.mt-3{margin-top:1em}.mt-4{margin-top:1.5em}.mt-5{margin-top:3em}.mr-0{margin-right:0}.mr-1{margin-right:.25em}.mr-2{margin-right:.5em}.mr-3{margin-right:1em}.mr-4{margin-right:1.5em}.mr-5{margin-right:3em}.mb-0{margin-bottom:0}.mb-1{margin-bottom:.25em}.mb-2{margin-bottom:.5em}.mb-3{margin-bottom:1em}.mb-4{margin-bottom:1.5em}.mb-5{margin-bottom:3em}.ml-0{margin-left:0}.ml-1{margin-left:.25em}.ml-2{margin-left:.5em}.ml-3{margin-left:1em}.ml-4{margin-left:1.5em}.ml-5{margin-left:3em}.d-flex{display:flex}.fx-right{flex-direction:row-reverse}.fx-left{flex-direction:row}.justify-content-start{justify-content:flex-start!important}.justify-content-center{justify-content:center!important}.justify-content-end{justify-content:flex-end!important}.justify-content-between{justify-content:space-between!important}.justify-content-around{justify-content:space-around!important}.align-center{align-items:center}.text-start{text-align:left!important}.text-center{text-align:center!important}.text-end{text-align:right!important}.border,.border-1{border:1px solid}.border-2{border:2px solid}.border-left-1,.border-left{border-left:1px solid}.border-left-2{border-left:2px solid}.border-right-1,.border-right{border-right:1px solid}.border-right-2{border-right:2px solid}.border-top-1,.border-top{border-top:1px solid}.border-top-2{border-top:2px solid}.border-bottom-1,.border-bottom{border-bottom:1px solid}.border-bottom-2{border-bottom:2px solid}.border-y-1,.border-y{border-top:1px solid;border-bottom:1px solid}.border-y-2{border-top:2px solid;border-bottom:2px solid}.border-x-1,.border-x{border-left:1px solid;border-right:1px solid}.border-x-2{border-left:2px solid;border-right:2px solid}.br-1{border-radius:2px}.br-2{border-radius:4px}.br-3{border-radius:8px}.shadow-inner-1{box-shadow:inset 0 2px 2px #0000001a}.shadow-inner-2{box-shadow:inset 0 4px 8px #0000001a}.shadow-outer-1{box-shadow:0 2px 2px #0000001a}.shadow-outer-2{box-shadow:0 4px 8px #0000001a}.opacity-100{opacity:1}.opacity-90{opacity:.9}.opacity-80{opacity:.8}.opacity-70{opacity:.7}.opacity-60{opacity:.6}.opacity-50{opacity:.5}.opacity-40{opacity:.4}.opacity-30{opacity:.3}.opacity-20{opacity:.2}.opacity-10{opacity:.1}.highlighter,.highlighter-primary{color:var(--primary-600)}.highlighter-succes{color:var(--green-500)}.highlighter-warning{color:var(--yellow-600)}.highlighter-error{color:var(--red-600)}.highlighter-info{color:var(--secondary-600)}.s-scroll::-webkit-scrollbar{width:.7rem}.s-scroll::-webkit-scrollbar-track{background-color:transparent}.s-scroll::-webkit-scrollbar-thumb{background-color:var(--neutrals-900);border-radius:20px 13px 13px 20px;border-right:.1em solid transparent;border-left:.3rem solid transparent;background-clip:content-box}.label-content{display:inline-flex;align-items:center;margin-left:3px;font-weight:400;font-size:.875rem;line-height:0px}.label-content.sm{font-size:.625rem}.label-content s-icon-mat{display:flex;align-items:center;margin-right:3px}.label-content s-icon-mat span{font-size:1.01rem}.icon-default,.label-content-default{color:var(--secondary-500)}.icon-yellow,.label-content-yellow{color:var(--yellow-600)}.icon-red,.label-content-red{color:var(--red-600)}.icon-green,.label-content-green{color:var(--green-600)}.form-group{margin:5px}.form-group .label{font-weight:400;font-size:.875rem;color:var(--secondary-600)}.form-group .content-input-main-626.sm{margin:0}.login-container{width:100%;height:100%;max-width:900px;max-height:600px;display:flex;flex-direction:row;color:var(--text);border-radius:8px;box-shadow:0 8px 10px #0000001a;background-color:var(--neutrals-1200)}.login-container .fixclear{height:20px}.login-section{flex:1 1;font-size:1rem;min-width:450px}.login-section:first-of-type{background-color:var(--primary-600);border-top-left-radius:8px;border-bottom-left-radius:8px}.login-section:not(:first-of-type){border-top-right-radius:8px;border-bottom-right-radius:8px}.login-section-second{display:flex;flex-direction:column;padding:4.75rem 3.5rem}.login-image{max-width:100%;height:100%}.login-title-primary{color:var(--primary-600);font-weight:700}.login-title-text{color:var(--primary-600)}.click-here-link{color:var(--primary);font-weight:700;text-decoration:none;font-size:inherit}@media (max-width: 750px){.login-section:first-of-type{display:none}}\n"] }]
         }], ctorParameters: function () { return [{ type: i1.DomSanitizer }]; }, propDecorators: { urlForgotPassword: [{
                 type: Input
             }], urlForgotPasswordTarget: [{

package/esm2022/lib/navbar/components/icon-menu/components/s-notificaction.component.mjs

@@ -22,7 +22,7 @@ export class SNotificationComponent {
         this.clickTitle.emit(id);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: SNotificationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.3", type: SNotificationComponent, selector: "s-notification", inputs: { item: "item" }, outputs: { clickUnread: "clickUnread", clickDelete: "clickDelete", clickTitle: "clickTitle" }, ngImport: i0, template: "<div class=\"s-notification\">\r\n    <div class=\"s-notification__item\">\r\n        <div class=\"s-notification__item--left\">\r\n            <div class=\"s-notification__item--left__content-icon\">\r\n                <s-icon-mat>{{item.icon}}</s-icon-mat>\r\n            </div>\r\n            <div class=\"s-notification__item--left__content-text\">\r\n                <div class=\"fix-align\">\r\n                    <p (click)=\"_clickTitle(item)\" class=\"title cursor\">{{item.title}}</p>\r\n                    <span *ngIf=\"item.description\" class=\"description\">{{item.description}}</span>\r\n                    <span *ngIf=\"!item.description\" class=\"description\"></span>\r\n                </div>\r\n                <div>\r\n                    <s-tag size=\"sm\">\r\n                        <s-icon-mat>{{item.icon}}</s-icon-mat>\r\n                        {{item.subtitle}}\r\n                    </s-tag>\r\n                </div>\r\n            </div>\r\n        </div>\r\n        <div class=\"s-notification__item--right\">\r\n            <div class=\"s-notification__ite--right__content-icon\">\r\n                <div *ngIf=\"item.seen\" class=\"icon-unread read\" [tooltip]=\"readNotification\">\r\n                    <s-icon-mat>mark_email_read</s-icon-mat>\r\n                </div>\r\n                <s-tooltip position=\"left\" #readNotification [title]=\"'Le\u00EDdo'\" ></s-tooltip>\r\n                <div *ngIf=\"!item.seen\" class=\"icon-unread cursor\" (click)=\"_clickUnread(item.id)\" [tooltip]=\"unreadNotification\">\r\n                    <s-icon-mat>mark_email_unread</s-icon-mat>\r\n                </div>\r\n                <s-tooltip position=\"left\" #unreadNotification [title]=\"'Marcar como le\u00EDdo'\" ></s-tooltip>\r\n                <div class=\"icon-close cursor\" (click)=\"_clickDelete(item.id)\" [tooltip]=\"deleteNotification\">\r\n                    <s-icon-mat>close</s-icon-mat>\r\n                </div>\r\n                <s-tooltip position=\"left\" #deleteNotification [title]=\"'Eliminar notificaci\u00F3n'\" ></s-tooltip>\r\n            </div>\r\n        </div>\r\n    </div>\r\n</div>", styles: [".s-notification__item:hover{background-color:var(--neutrals-1100)}.s-notification__item{background-color:var(--neutrals-1200);height:65px;padding:13px 20px 13px 12px;display:flex;justify-content:space-between;border-top:.5px solid var(--neutrals-700)}.s-notification__item--left{display:flex;align-items:flex-start}.s-notification__item--left__content-icon s-icon-mat span{color:var(--primary-600);font-size:2rem}.s-notification__item--left__content-text{margin-left:6px;display:flex;justify-content:flex-start;align-items:center;flex-wrap:wrap}.s-notification__item--left__content-text .title{color:var(--secondary-600);font-size:14px;font-weight:700;margin-bottom:0;overflow:hidden;max-height:20px}.s-notification__item--left__content-text .description{color:var(--secondary-500);font-size:12px;font-weight:400;max-height:20px;overflow:hidden}.s-notification__item--left__content-text .fix-align{text-align:left;width:100%;display:grid}.s-notification__item--right{display:flex;flex-direction:column;justify-content:space-between}.s-notification__item--right__content-icon{display:flex;flex-direction:column}.s-notification__item--right__content-icon .icon-unread s-icon-mat span{font-size:17px;color:var(--secondary-600)}.s-notification__item--right__content-icon .icon-unread.read{cursor:default}.s-notification__item--right__content-icon .icon-unread.read s-icon-mat span{color:var(--primary-600)}.s-notification__item--right__content-icon .icon-close{margin-top:9px}.s-notification__item--right__content-icon .icon-close s-icon-mat span{font-size:16px;color:var(--red-600)}.s-notification__item--right__content-icon a{text-decoration:none}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.SIconMaterialComponent, selector: "s-icon-mat", inputs: ["size", "color", "fill", "weight", "grade", "opticalSize", "style", "type"] }, { kind: "component", type: i3.STagComponent, selector: "s-tag", inputs: ["type", "size", "disabled"] }, { kind: "component", type: i4.STooltipComponent, selector: "s-tooltip", inputs: ["title", "description", "theme", "position"] }, { kind: "directive", type: i5.CustomTooltipDirective, selector: "[tooltip]", inputs: ["tooltip"] }], encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.3", type: SNotificationComponent, selector: "s-notification", inputs: { item: "item" }, outputs: { clickUnread: "clickUnread", clickDelete: "clickDelete", clickTitle: "clickTitle" }, ngImport: i0, template: "<div class=\"s-notification\">\r\n    <div class=\"s-notification__item\">\r\n        <div class=\"s-notification__item--left\">\r\n            <div class=\"s-notification__item--left__content-icon\">\r\n                <s-icon-mat>{{item.icon}}</s-icon-mat>\r\n            </div>\r\n            <div class=\"s-notification__item--left__content-text\">\r\n                <div class=\"fix-align\">\r\n                    <p (click)=\"_clickTitle(item)\" class=\"title cursor\">{{item.title}}</p>\r\n                    <span *ngIf=\"item.description\" class=\"description\">{{item.description}}</span>\r\n                    <span *ngIf=\"!item.description\" class=\"description\"></span>\r\n                </div>\r\n                <div>\r\n                    <s-tag size=\"sm\">\r\n                        <s-icon-mat>{{item.icon}}</s-icon-mat>\r\n                        {{item.subtitle}}\r\n                    </s-tag>\r\n                </div>\r\n            </div>\r\n        </div>\r\n        <div class=\"s-notification__item--right\">\r\n            <div class=\"s-notification__ite--right__content-icon\">\r\n                <div *ngIf=\"item.seen\" class=\"icon-unread read\" [tooltip]=\"readNotification\">\r\n                    <s-icon-mat>mark_email_read</s-icon-mat>\r\n                </div>\r\n                <s-tooltip position=\"left\" #readNotification [title]=\"'Le\u00EDdo'\" ></s-tooltip>\r\n                <div *ngIf=\"!item.seen\" class=\"icon-unread cursor\" (click)=\"_clickUnread(item.id)\" [tooltip]=\"unreadNotification\">\r\n                    <s-icon-mat>mark_email_unread</s-icon-mat>\r\n                </div>\r\n                <s-tooltip position=\"left\" #unreadNotification [title]=\"'Marcar como le\u00EDdo'\" ></s-tooltip>\r\n                <div class=\"icon-close cursor\" (click)=\"_clickDelete(item.id)\" [tooltip]=\"deleteNotification\">\r\n                    <s-icon-mat>close</s-icon-mat>\r\n                </div>\r\n                <s-tooltip position=\"left\" #deleteNotification [title]=\"'Eliminar notificaci\u00F3n'\" ></s-tooltip>\r\n            </div>\r\n        </div>\r\n    </div>\r\n</div>", styles: [".s-notification__item:hover{background-color:var(--neutrals-1100)}.s-notification__item{background-color:var(--neutrals-1200);height:65px;padding:13px 20px 13px 12px;display:flex;justify-content:space-between;border-top:.5px solid var(--neutrals-700)}.s-notification__item--left{display:flex;align-items:flex-start}.s-notification__item--left__content-icon s-icon-mat span{color:var(--primary-600);font-size:2rem}.s-notification__item--left__content-text{margin-left:6px;display:flex;justify-content:flex-start;align-items:center;flex-wrap:wrap}.s-notification__item--left__content-text .title{color:var(--secondary-600);font-size:14px;font-weight:700;margin-bottom:0;overflow:hidden;max-height:20px}.s-notification__item--left__content-text .description{color:var(--secondary-500);font-size:12px;font-weight:400;max-height:20px;overflow:hidden}.s-notification__item--left__content-text .fix-align{text-align:left;width:100%;display:grid}.s-notification__item--right{display:flex;flex-direction:column;justify-content:space-between}.s-notification__item--right__content-icon{display:flex;flex-direction:column}.s-notification__item--right__content-icon .icon-unread s-icon-mat span{font-size:17px;color:var(--secondary-600)}.s-notification__item--right__content-icon .icon-unread.read{cursor:default}.s-notification__item--right__content-icon .icon-unread.read s-icon-mat span{color:var(--primary-600)}.s-notification__item--right__content-icon .icon-close{margin-top:9px}.s-notification__item--right__content-icon .icon-close s-icon-mat span{font-size:16px;color:var(--red-600)}.s-notification__item--right__content-icon a{text-decoration:none}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.SIconMaterialComponent, selector: "s-icon-mat", inputs: ["name", "size", "color", "fill", "weight", "grade", "opticalSize", "style", "type"] }, { kind: "component", type: i3.STagComponent, selector: "s-tag", inputs: ["type", "size", "disabled"] }, { kind: "component", type: i4.STooltipComponent, selector: "s-tooltip", inputs: ["title", "description", "theme", "position"] }, { kind: "directive", type: i5.CustomTooltipDirective, selector: "[tooltip]", inputs: ["tooltip"] }], encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: SNotificationComponent, decorators: [{
             type: Component,

package/esm2022/lib/navbar/components/icon-menu/s-icon-menu.component.mjs

@@ -45,7 +45,7 @@ export class SIconMenuComponent {
         this.clickInside = false;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: SIconMenuComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.3", type: SIconMenuComponent, selector: "s-icon-menu", inputs: { iconMenu: "iconMenu" }, outputs: { clickUnread: "clickUnread", clickDelete: "clickDelete", clickTitle: "clickTitle" }, host: { listeners: { "click": "clicked()", "document:click": "clickedOut()" } }, ngImport: i0, template: "<div class=\"s-icon-menu\">\r\n    <ul class=\"s-icon-menu__main-ul\">\r\n        <ng-container *ngFor=\"let item of iconMenu\">\r\n            <li class=\"s-icon-menu__main-ul__li\">\r\n                <ng-container *ngIf=\"item.notification\">\r\n                    <a (click)=\"clickSubMenu(item)\" class=\"item-link cursor\">\r\n                        <div class=\"item-link__content-badge\" *ngIf=\"item.unread\">\r\n                            <div  class=\"item-link__content-badge__badge-notification\">\r\n                                <s-badge size=\"xs\" type=\"red\" *ngIf=\"item.unread > 99\">+99</s-badge>\r\n                                <s-badge size=\"xs\" type=\"red\" *ngIf=\"item.unread < 99\">{{item.unread}}</s-badge>\r\n                            </div>\r\n                        </div>\r\n                        <s-icon-mat class=\"item-link__icon cursor\">{{item.icon}}</s-icon-mat>\r\n                    </a>\r\n                </ng-container>\r\n                <ng-container *ngIf=\"!item.notification && item.link\">\r\n                    <a routerLink=\"{{item.link}}\" (click)=\"closeSubMenu()\" routerLinkActive=\"active\" class=\"item-link\">\r\n                        <s-icon-mat class=\"item-link__icon cursor\">{{item.icon}}</s-icon-mat>\r\n                    </a>\r\n                </ng-container>\r\n\r\n                <div class=\"s-icon-menu__main-ul__li__dropdown\">\r\n                    <div *ngIf=\"item.hideme\" class=\"s-icon-menu__main-ul__li__dropdown__content\">\r\n                            <div class=\"s-icon-menu__main-ul__li__dropdown__content__notification\">\r\n                                <div class=\"s-icon-menu__main-ul__li__dropdown__content__notification__header\">\r\n                                    <div class=\"s-icon-menu__main-ul__li__dropdown__content__notification__header__left\">Notificaciones</div>\r\n                                    <div class=\"s-icon-menu__main-ul__li__dropdown__content__notification__header__right\">\r\n                                        <s-icon-mat>mark_email_read</s-icon-mat>\r\n                                    </div>\r\n                                </div>\r\n                                <ng-container *ngFor=\"let itemChildren of item.children\">\r\n                                    <s-notification (clickTitle)=\"_clickTitle($event)\" (clickDelete)=\"_clickDelete($event)\" (clickUnread)=\"_clickUnread($event)\" [item]=\"itemChildren\"></s-notification>\r\n                                </ng-container>\r\n                                <div class=\"s-icon-menu__main-ul__li__dropdown__content__notification__footer\">\r\n                                        <s-button (click)=\"closeSubMenu()\" routerLink=\"{{item.link? item.link : null}}\"  size=\"sm\">Ver todas las notificaciones</s-button>\r\n                                </div>\r\n                            </div>\r\n                    </div>\r\n                </div>\r\n            </li>\r\n        </ng-container>\r\n    </ul>\r\n</div>", styles: [".s-icon-menu{text-align:center;margin-right:auto}.s-icon-menu__main-ul{height:56px;display:flex;align-items:center;position:relative;margin-right:.3rem}.s-icon-menu__main-ul__li{margin-left:.5rem;margin-right:.5rem}.s-icon-menu__main-ul__li .item-link{text-decoration:none}.s-icon-menu__main-ul__li .item-link__content-badge{position:relative}.s-icon-menu__main-ul__li .item-link__content-badge__badge-notification{position:absolute;top:-9px;left:9px}.s-icon-menu__main-ul__li .item-link__content-badge__badge-notification s-badge{-webkit-user-select:auto;-o-user-select:auto;user-select:auto;cursor:pointer}.s-icon-menu__main-ul__li .item-link__icon span{color:var(--primary-600)}.s-icon-menu__main-ul__li .item-link__icon span:hover{color:var(--primary-700)}.s-icon-menu__main-ul__li .item-link__icon span:active{color:var(--primary-800)}.s-icon-menu__main-ul__li__dropdown{position:relative}.s-icon-menu__main-ul__li__dropdown__content{position:absolute;right:0;z-index:1;min-width:120px;width:max-content}.s-icon-menu__main-ul__li__dropdown__content__notification{width:380px;background-color:var(--neutrals-1100);border-radius:6px;box-shadow:0 12px 16px -4px #10182814,0 4px 6px -2px #10182808}.s-icon-menu__main-ul__li__dropdown__content__notification__header{padding:7px 22px 8px 12px;height:27px;display:flex;justify-content:space-between;align-items:center}.s-icon-menu__main-ul__li__dropdown__content__notification__header__right s-icon-mat span{color:var(--primary-600);font-size:1rem}.s-icon-menu__main-ul__li__dropdown__content__notification__header__left{font-size:16px;font-weight:700;color:var(--secondary-600)}.s-icon-menu__main-ul__li__dropdown__content__notification__footer{text-align:center;height:40px;padding-top:6px;border-top:.5px solid var(--neutrals-700)}.s-icon-menu__main-ul__li__dropdown__content__notification__footer s-button button{width:calc(100% - 18px)}.theme-dark .item-link__icon span{color:var(--neutrals-1200)}.theme-dark .item-link__icon span:hover{color:var(--primary-300)}.theme-dark .item-link__icon span:active{color:var(--primary-600)}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.SIconMaterialComponent, selector: "s-icon-mat", inputs: ["size", "color", "fill", "weight", "grade", "opticalSize", "style", "type"] }, { kind: "directive", type: i3.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i3.RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }, { kind: "component", type: i4.SButtonComponent, selector: "s-button", inputs: ["disabled", "pill", "size", "invert", "type", "loading", "position", "theme"] }, { kind: "component", type: i5.SBadgeComponent, selector: "s-badge", inputs: ["type", "size", "new"] }, { kind: "component", type: i6.SNotificationComponent, selector: "s-notification", inputs: ["item"], outputs: ["clickUnread", "clickDelete", "clickTitle"] }], encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.3", type: SIconMenuComponent, selector: "s-icon-menu", inputs: { iconMenu: "iconMenu" }, outputs: { clickUnread: "clickUnread", clickDelete: "clickDelete", clickTitle: "clickTitle" }, host: { listeners: { "click": "clicked()", "document:click": "clickedOut()" } }, ngImport: i0, template: "<div class=\"s-icon-menu\">\r\n    <ul class=\"s-icon-menu__main-ul\">\r\n        <ng-container *ngFor=\"let item of iconMenu\">\r\n            <li class=\"s-icon-menu__main-ul__li\">\r\n                <ng-container *ngIf=\"item.notification\">\r\n                    <a (click)=\"clickSubMenu(item)\" class=\"item-link cursor\">\r\n                        <div class=\"item-link__content-badge\" *ngIf=\"item.unread\">\r\n                            <div  class=\"item-link__content-badge__badge-notification\">\r\n                                <s-badge size=\"xs\" type=\"red\" *ngIf=\"item.unread > 99\">+99</s-badge>\r\n                                <s-badge size=\"xs\" type=\"red\" *ngIf=\"item.unread < 99\">{{item.unread}}</s-badge>\r\n                            </div>\r\n                        </div>\r\n                        <s-icon-mat class=\"item-link__icon cursor\">{{item.icon}}</s-icon-mat>\r\n                    </a>\r\n                </ng-container>\r\n                <ng-container *ngIf=\"!item.notification && item.link\">\r\n                    <a routerLink=\"{{item.link}}\" (click)=\"closeSubMenu()\" routerLinkActive=\"active\" class=\"item-link\">\r\n                        <s-icon-mat class=\"item-link__icon cursor\">{{item.icon}}</s-icon-mat>\r\n                    </a>\r\n                </ng-container>\r\n\r\n                <div class=\"s-icon-menu__main-ul__li__dropdown\">\r\n                    <div *ngIf=\"item.hideme\" class=\"s-icon-menu__main-ul__li__dropdown__content\">\r\n                            <div class=\"s-icon-menu__main-ul__li__dropdown__content__notification\">\r\n                                <div class=\"s-icon-menu__main-ul__li__dropdown__content__notification__header\">\r\n                                    <div class=\"s-icon-menu__main-ul__li__dropdown__content__notification__header__left\">Notificaciones</div>\r\n                                    <div class=\"s-icon-menu__main-ul__li__dropdown__content__notification__header__right\">\r\n                                        <s-icon-mat>mark_email_read</s-icon-mat>\r\n                                    </div>\r\n                                </div>\r\n                                <ng-container *ngFor=\"let itemChildren of item.children\">\r\n                                    <s-notification (clickTitle)=\"_clickTitle($event)\" (clickDelete)=\"_clickDelete($event)\" (clickUnread)=\"_clickUnread($event)\" [item]=\"itemChildren\"></s-notification>\r\n                                </ng-container>\r\n                                <div class=\"s-icon-menu__main-ul__li__dropdown__content__notification__footer\">\r\n                                        <s-button (click)=\"closeSubMenu()\" routerLink=\"{{item.link? item.link : null}}\"  size=\"sm\">Ver todas las notificaciones</s-button>\r\n                                </div>\r\n                            </div>\r\n                    </div>\r\n                </div>\r\n            </li>\r\n        </ng-container>\r\n    </ul>\r\n</div>", styles: [".s-icon-menu{text-align:center;margin-right:auto}.s-icon-menu__main-ul{height:56px;display:flex;align-items:center;position:relative;margin-right:.3rem}.s-icon-menu__main-ul__li{margin-left:.5rem;margin-right:.5rem}.s-icon-menu__main-ul__li .item-link{text-decoration:none}.s-icon-menu__main-ul__li .item-link__content-badge{position:relative}.s-icon-menu__main-ul__li .item-link__content-badge__badge-notification{position:absolute;top:-9px;left:9px}.s-icon-menu__main-ul__li .item-link__content-badge__badge-notification s-badge{-webkit-user-select:auto;-o-user-select:auto;user-select:auto;cursor:pointer}.s-icon-menu__main-ul__li .item-link__icon span{color:var(--primary-600)}.s-icon-menu__main-ul__li .item-link__icon span:hover{color:var(--primary-700)}.s-icon-menu__main-ul__li .item-link__icon span:active{color:var(--primary-800)}.s-icon-menu__main-ul__li__dropdown{position:relative}.s-icon-menu__main-ul__li__dropdown__content{position:absolute;right:0;z-index:1;min-width:120px;width:max-content}.s-icon-menu__main-ul__li__dropdown__content__notification{width:380px;background-color:var(--neutrals-1100);border-radius:6px;box-shadow:0 12px 16px -4px #10182814,0 4px 6px -2px #10182808}.s-icon-menu__main-ul__li__dropdown__content__notification__header{padding:7px 22px 8px 12px;height:27px;display:flex;justify-content:space-between;align-items:center}.s-icon-menu__main-ul__li__dropdown__content__notification__header__right s-icon-mat span{color:var(--primary-600);font-size:1rem}.s-icon-menu__main-ul__li__dropdown__content__notification__header__left{font-size:16px;font-weight:700;color:var(--secondary-600)}.s-icon-menu__main-ul__li__dropdown__content__notification__footer{text-align:center;height:40px;padding-top:6px;border-top:.5px solid var(--neutrals-700)}.s-icon-menu__main-ul__li__dropdown__content__notification__footer s-button button{width:calc(100% - 18px)}.theme-dark .item-link__icon span{color:var(--neutrals-1200)}.theme-dark .item-link__icon span:hover{color:var(--primary-300)}.theme-dark .item-link__icon span:active{color:var(--primary-600)}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.SIconMaterialComponent, selector: "s-icon-mat", inputs: ["name", "size", "color", "fill", "weight", "grade", "opticalSize", "style", "type"] }, { kind: "directive", type: i3.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i3.RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }, { kind: "component", type: i4.SButtonComponent, selector: "s-button", inputs: ["disabled", "pill", "size", "invert", "type", "loading", "position", "theme"] }, { kind: "component", type: i5.SBadgeComponent, selector: "s-badge", inputs: ["type", "size", "new"] }, { kind: "component", type: i6.SNotificationComponent, selector: "s-notification", inputs: ["item"], outputs: ["clickUnread", "clickDelete", "clickTitle"] }], encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: SIconMenuComponent, decorators: [{
             type: Component,