@seniorsistemas/angular-components 17.27.1-feature-sds-110-8be5f7f5 → 17.27.1-feature-sds-110-d6af3a99

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

@@ -17,10 +17,10 @@ var EnumSeverity;
 class BorderButtonComponent {
     severity = 'default';
     options;
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: BorderButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: BorderButtonComponent, selector: "s-border-button", inputs: { severity: "severity", options: "options" }, ngImport: i0, template: "<button\n    class=\"border-button\"\n    [ngClass]=\"{\n        'border-button--severity-default': severity === 'default',\n        'border-button--severity-info': severity === 'info',\n        'border-button--severity-warn': severity === 'warn',\n        'border-button--severity-error': severity === 'error',\n        'border-button--severity-success': severity === 'success',\n        'border-button--disabled': options?.disabled ? options?.disabled(severity) : false,\n    }\"\n    (click)=\"options?.onClick ? options?.onClick(severity) : null\"\n    [sTooltip]=\"options?.tooltip?.(severity)\"\n    tooltipPosition=\"left\"\n    [disabled]=\"options?.disabled ? options?.disabled(severity) : false\"\n>\n    <span class=\"border-button__label\">\n        {{ options?.label ? options?.label(severity) : null }}\n    </span>\n    @if (options?.icon ? options?.icon(severity) : false) {\n        <span class=\"border-button__icon {{ options?.icon(severity) }}\"></span>\n    }\n</button>\n", styles: [".border-button{padding:0 8px;border:1px solid;border-radius:12px;height:23px;max-width:320px;display:flex;justify-content:center;align-items:center;cursor:pointer}.border-button__label{font-family:Open Sans,sans-serif;font-size:12px;line-height:150%;width:100%;display:block;color:#333;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.border-button__icon{font-size:12px;color:#333;margin-left:8px}.border-button--severity-default{border-color:#ccc;background-color:#fff}.border-button--severity-info{border-color:#428bca;background-color:#d5e8ec;transition:background-color .5s ease,border-color .5s ease}.border-button--severity-info:enabled:hover{background-color:#9ecad4;cursor:pointer}.border-button--severity-info:enabled:active{transition:none;background-color:#67acbc;border-color:#67acbc}.border-button--severity-warn{border-color:#f8931f;background-color:#fce3ba;transition:background-color .5s ease,border-color .5s ease}.border-button--severity-warn:enabled:hover{background-color:#f8bf5e;cursor:pointer}.border-button--severity-warn:enabled:active{transition:none;background-color:#f5a319;border-color:#f5a319}.border-button--severity-error{border-color:#c13018;background-color:#fcd2d2;transition:background-color .5s ease,border-color .5s ease}.border-button--severity-error:enabled:hover{background-color:#f89696;cursor:pointer}.border-button--severity-error:enabled:active{transition:none;background-color:#f45b5b;border-color:#f45b5b}.border-button--severity-success{border-color:#0c9348;background-color:#e6ffb3;transition:background-color .5s ease,border-color .5s ease}.border-button--severity-success:enabled:hover{background-color:#c8ff5c;cursor:pointer}.border-button--severity-success:enabled:active{transition:none;background-color:#ade500;border-color:#ade500}.border-button--disabled:disabled:hover{cursor:default}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.TooltipDirective, selector: "[sTooltip]", inputs: ["sTooltip", "tooltipPosition", "showDelay", "displayTime", "tooltipEvent", "escape", "visible", "mobileBehavior", "focusedInputRef", "checkTruncatedText"] }] });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: BorderButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: BorderButtonComponent, selector: "s-border-button", inputs: { severity: "severity", options: "options" }, ngImport: i0, template: "<button\n    class=\"border-button\"\n    [ngClass]=\"{\n        'border-button--severity-default': severity === 'default',\n        'border-button--severity-info': severity === 'info',\n        'border-button--severity-warn': severity === 'warn',\n        'border-button--severity-error': severity === 'error',\n        'border-button--severity-success': severity === 'success',\n        'border-button--disabled': options?.disabled ? options?.disabled(severity) : false,\n    }\"\n    (click)=\"options?.onClick ? options?.onClick(severity) : null\"\n    [sTooltip]=\"options?.tooltip?.(severity)\"\n    tooltipPosition=\"left\"\n    [disabled]=\"options?.disabled ? options?.disabled(severity) : false\"\n>\n    <span class=\"border-button__label\">\n        {{ options?.label ? options?.label(severity) : null }}\n    </span>\n    @if (options?.icon ? options?.icon(severity) : false) {\n        <span class=\"border-button__icon {{ options?.icon(severity) }}\"></span>\n    }\n</button>\n", styles: [".border-button{padding:0 8px;border:1px solid;border-radius:12px;height:23px;max-width:320px;display:flex;justify-content:center;align-items:center;cursor:pointer}.border-button__label{font-family:Open Sans,sans-serif;font-size:12px;line-height:150%;width:100%;display:block;color:#333;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.border-button__icon{font-size:12px;color:#333;margin-left:8px}.border-button--severity-default{border-color:#ccc;background-color:#fff}.border-button--severity-info{border-color:#428bca;background-color:#d5e8ec;transition:background-color .5s ease,border-color .5s ease}.border-button--severity-info:enabled:hover{background-color:#9ecad4;cursor:pointer}.border-button--severity-info:enabled:active{transition:none;background-color:#67acbc;border-color:#67acbc}.border-button--severity-warn{border-color:#f8931f;background-color:#fce3ba;transition:background-color .5s ease,border-color .5s ease}.border-button--severity-warn:enabled:hover{background-color:#f8bf5e;cursor:pointer}.border-button--severity-warn:enabled:active{transition:none;background-color:#f5a319;border-color:#f5a319}.border-button--severity-error{border-color:#c13018;background-color:#fcd2d2;transition:background-color .5s ease,border-color .5s ease}.border-button--severity-error:enabled:hover{background-color:#f89696;cursor:pointer}.border-button--severity-error:enabled:active{transition:none;background-color:#f45b5b;border-color:#f45b5b}.border-button--severity-success{border-color:#0c9348;background-color:#e6ffb3;transition:background-color .5s ease,border-color .5s ease}.border-button--severity-success:enabled:hover{background-color:#c8ff5c;cursor:pointer}.border-button--severity-success:enabled:active{transition:none;background-color:#ade500;border-color:#ade500}.border-button--disabled:disabled:hover{cursor:default}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.TooltipDirective, selector: "[sTooltip]", inputs: ["sTooltip", "tooltipPosition", "showDelay", "displayTime", "tooltipEvent", "escape", "visible", "mobileBehavior", "focusedInputRef", "checkTruncatedText"] }] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: BorderButtonComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: BorderButtonComponent, decorators: [{
             type: Component,
             args: [{ selector: "s-border-button", template: "<button\n    class=\"border-button\"\n    [ngClass]=\"{\n        'border-button--severity-default': severity === 'default',\n        'border-button--severity-info': severity === 'info',\n        'border-button--severity-warn': severity === 'warn',\n        'border-button--severity-error': severity === 'error',\n        'border-button--severity-success': severity === 'success',\n        'border-button--disabled': options?.disabled ? options?.disabled(severity) : false,\n    }\"\n    (click)=\"options?.onClick ? options?.onClick(severity) : null\"\n    [sTooltip]=\"options?.tooltip?.(severity)\"\n    tooltipPosition=\"left\"\n    [disabled]=\"options?.disabled ? options?.disabled(severity) : false\"\n>\n    <span class=\"border-button__label\">\n        {{ options?.label ? options?.label(severity) : null }}\n    </span>\n    @if (options?.icon ? options?.icon(severity) : false) {\n        <span class=\"border-button__icon {{ options?.icon(severity) }}\"></span>\n    }\n</button>\n", styles: [".border-button{padding:0 8px;border:1px solid;border-radius:12px;height:23px;max-width:320px;display:flex;justify-content:center;align-items:center;cursor:pointer}.border-button__label{font-family:Open Sans,sans-serif;font-size:12px;line-height:150%;width:100%;display:block;color:#333;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.border-button__icon{font-size:12px;color:#333;margin-left:8px}.border-button--severity-default{border-color:#ccc;background-color:#fff}.border-button--severity-info{border-color:#428bca;background-color:#d5e8ec;transition:background-color .5s ease,border-color .5s ease}.border-button--severity-info:enabled:hover{background-color:#9ecad4;cursor:pointer}.border-button--severity-info:enabled:active{transition:none;background-color:#67acbc;border-color:#67acbc}.border-button--severity-warn{border-color:#f8931f;background-color:#fce3ba;transition:background-color .5s ease,border-color .5s ease}.border-button--severity-warn:enabled:hover{background-color:#f8bf5e;cursor:pointer}.border-button--severity-warn:enabled:active{transition:none;background-color:#f5a319;border-color:#f5a319}.border-button--severity-error{border-color:#c13018;background-color:#fcd2d2;transition:background-color .5s ease,border-color .5s ease}.border-button--severity-error:enabled:hover{background-color:#f89696;cursor:pointer}.border-button--severity-error:enabled:active{transition:none;background-color:#f45b5b;border-color:#f45b5b}.border-button--severity-success{border-color:#0c9348;background-color:#e6ffb3;transition:background-color .5s ease,border-color .5s ease}.border-button--severity-success:enabled:hover{background-color:#c8ff5c;cursor:pointer}.border-button--severity-success:enabled:active{transition:none;background-color:#ade500;border-color:#ade500}.border-button--disabled:disabled:hover{cursor:default}\n"] }]
         }], propDecorators: { severity: [{
@@ -30,11 +30,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
             }] } });
 
 class BorderButtonModule {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: BorderButtonModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.13", ngImport: i0, type: BorderButtonModule, declarations: [BorderButtonComponent], imports: [CommonModule, TooltipModule], exports: [BorderButtonComponent] });
-    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: BorderButtonModule, imports: [CommonModule, TooltipModule] });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: BorderButtonModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.14", ngImport: i0, type: BorderButtonModule, declarations: [BorderButtonComponent], imports: [CommonModule, TooltipModule], exports: [BorderButtonComponent] });
+    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: BorderButtonModule, imports: [CommonModule, TooltipModule] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: BorderButtonModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: BorderButtonModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [CommonModule, TooltipModule],

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

@@ -1,7 +1,8 @@
 import { trigger, transition, style, animate } from '@angular/animations';
 import * as i0 from '@angular/core';
-import { EventEmitter, Component, ContentChildren, Input, Output, NgModule } from '@angular/core';
+import { model, effect, Component, ContentChildren, Input, NgModule } from '@angular/core';
 import { TemplateDirective, TemplateModule } from '@seniorsistemas/angular-components/template';
+import { disableScroll, enableScroll } from '@seniorsistemas/angular-components/utils';
 import * as i1 from '@angular/common';
 import { CommonModule } from '@angular/common';
 import * as i2 from '@angular/cdk/a11y';
@@ -9,7 +10,7 @@ import { A11yModule } from '@angular/cdk/a11y';
 
 class SidebarComponent {
     templates = null;
-    visible = false;
+    visible = model(false);
     closable = true;
     dismissible = true;
     closeOnEscape = true;
@@ -19,21 +20,31 @@ class SidebarComponent {
     set registerConfirmClose(fn) {
         this._confirmClose = fn;
     }
-    visibleChange = new EventEmitter();
     headerTemplate = null;
     bodyTemplate = null;
     footerTemplate = null;
     _confirmClose = () => true;
+    visibleEffect = effect(() => {
+        const visible = this.visible();
+        if (visible) {
+            disableScroll();
+        }
+        else {
+            enableScroll();
+        }
+    });
     ngAfterContentInit() {
         this._getTemplates();
     }
+    ngOnDestroy() {
+        this.visibleEffect.destroy();
+    }
     closeSidebar() {
         if (this._confirmClose()) {
-            this.visible = false;
-            this.visibleChange.emit(this.visible);
+            this.visible.set(false);
         }
     }
-    handleEscape(_) {
+    handleEscape() {
         if (this.closeOnEscape) {
             this.closeSidebar();
         }
@@ -55,29 +66,39 @@ class SidebarComponent {
         this.bodyTemplate = this.getBodyTemplate();
         this.footerTemplate = this.getFooterTemplate();
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SidebarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: SidebarComponent, selector: "s-sidebar", inputs: { visible: "visible", closable: "closable", dismissible: "dismissible", closeOnEscape: "closeOnEscape", header: "header", largeSized: "largeSized", cache: "cache", registerConfirmClose: "registerConfirmClose" }, outputs: { visibleChange: "visibleChange" }, host: { listeners: { "document:keydown.escape": "handleEscape($event)" } }, queries: [{ propertyName: "templates", predicate: TemplateDirective }], ngImport: i0, template: "@if (visible) {\n\t<div\n\t\tclass=\"backdrop\"\n\t\t(click)=\"dismissible && closeSidebar()\"></div>\n}\n\n@if (cache || visible) {\n\t<div\n\t\tcdkTrapFocus\n\t\t[cdkTrapFocusAutoCapture]=\"visible\"\n\t\t[@visibilityChanged]\n\t\tclass=\"sidebar\"\n\t\t[class.sidebar--open]=\"visible\"\n\t\t[class.sidebar--large-size]=\"largeSized\">\n\t\t<div class=\"sidebar__header\">\n\t\t\t@if (headerTemplate) {\n\t\t\t\t<ng-template *ngTemplateOutlet=\"headerTemplate\"></ng-template>\n\t\t\t} @else {\n\t\t\t\t<span class=\"sidebar__header__title\">{{ header }}</span>\n\t\t\t}\n\t\t\t@if (closable) {\n\t\t\t\t<button\n\t\t\t\t\tclass=\"sidebar__header__close fa-solid fa-xmark\"\n\t\t\t\t\t(click)=\"closeSidebar()\"></button>\n\t\t\t}\n\t\t</div>\n\t\t<div class=\"sidebar__body\">\n\t\t\t@if (bodyTemplate) {\n\t\t\t\t<ng-template [ngTemplateOutlet]=\"bodyTemplate\"></ng-template>\n\t\t\t} @else {\n\t\t\t\t<ng-content></ng-content>\n\t\t\t}\n\t\t</div>\n\t\t@if (footerTemplate) {\n\t\t\t<div class=\"sidebar__footer\">\n\t\t\t\t<ng-template [ngTemplateOutlet]=\"footerTemplate\"></ng-template>\n\t\t\t</div>\n\t\t}\n\t</div>\n}\n", styles: [".backdrop{background-color:#00000080;height:100%;left:0;position:fixed;top:0;transition:opacity .3s;width:100%;z-index:9998}.sidebar{background-color:#fff;box-shadow:0 1px 5px #00000040;display:flex;flex-direction:column;height:100%;right:-100%;padding:1rem;position:fixed;top:0;transition:right .3s;width:100%;z-index:9999}.sidebar__header{border-bottom:1px solid #dedce5;display:flex;justify-content:space-between;padding-bottom:.75rem}.sidebar__header__title{color:#212533;font-family:Inter,sans-serif;font-size:1rem;text-transform:uppercase;-webkit-user-select:none;user-select:none}.sidebar__header__close{background-color:transparent;border:none;color:#212533;cursor:pointer;font-size:1rem;padding:.5rem}.sidebar__body{flex-grow:1;overflow:auto;padding:1rem .5rem}.sidebar__footer{border-top:1px solid #dedce5;padding-top:.75rem}.sidebar--open{right:0}@media (min-width: 768px){.sidebar{width:75%}}@media (min-width: 992px){.sidebar{width:50%}}\n"], dependencies: [{ kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.CdkTrapFocus, selector: "[cdkTrapFocus]", inputs: ["cdkTrapFocus", "cdkTrapFocusAutoCapture"], exportAs: ["cdkTrapFocus"] }], animations: [
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: SidebarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: SidebarComponent, selector: "s-sidebar", inputs: { visible: { classPropertyName: "visible", publicName: "visible", isSignal: true, isRequired: false, transformFunction: null }, closable: { classPropertyName: "closable", publicName: "closable", isSignal: false, isRequired: false, transformFunction: null }, dismissible: { classPropertyName: "dismissible", publicName: "dismissible", isSignal: false, isRequired: false, transformFunction: null }, closeOnEscape: { classPropertyName: "closeOnEscape", publicName: "closeOnEscape", isSignal: false, isRequired: false, transformFunction: null }, header: { classPropertyName: "header", publicName: "header", isSignal: false, isRequired: false, transformFunction: null }, largeSized: { classPropertyName: "largeSized", publicName: "largeSized", isSignal: false, isRequired: false, transformFunction: null }, cache: { classPropertyName: "cache", publicName: "cache", isSignal: false, isRequired: false, transformFunction: null }, registerConfirmClose: { classPropertyName: "registerConfirmClose", publicName: "registerConfirmClose", isSignal: false, isRequired: false, transformFunction: null } }, outputs: { visible: "visibleChange" }, host: { listeners: { "document:keydown.escape": "handleEscape()" } }, queries: [{ propertyName: "templates", predicate: TemplateDirective }], ngImport: i0, template: "@if (visible()) {\n    <div\n        class=\"backdrop\"\n        (click)=\"dismissible && closeSidebar()\"\n    ></div>\n}\n\n@if (cache || visible()) {\n    <div\n        cdkTrapFocus\n        [cdkTrapFocusAutoCapture]=\"visible()\"\n        [@visibilityChanged]\n        class=\"sidebar\"\n        [class.sidebar--open]=\"visible()\"\n        [class.sidebar--large-size]=\"largeSized\"\n    >\n        <div class=\"sidebar__header\">\n            @if (headerTemplate) {\n                <ng-template *ngTemplateOutlet=\"headerTemplate\"></ng-template>\n            } @else {\n                <span class=\"sidebar__header__title\">{{ header }}</span>\n            }\n            @if (closable) {\n                <button\n                    class=\"sidebar__header__close fa-solid fa-xmark\"\n                    (click)=\"closeSidebar()\"\n                ></button>\n            }\n        </div>\n        <div class=\"sidebar__body\">\n            @if (bodyTemplate) {\n                <ng-template [ngTemplateOutlet]=\"bodyTemplate\"></ng-template>\n            } @else {\n                <ng-content></ng-content>\n            }\n        </div>\n        @if (footerTemplate) {\n            <div class=\"sidebar__footer\">\n                <ng-template [ngTemplateOutlet]=\"footerTemplate\"></ng-template>\n            </div>\n        }\n    </div>\n}\n", styles: [".backdrop{background-color:#00000080;height:100%;left:0;position:fixed;top:0;transition:opacity .3s;width:100%;z-index:998}.sidebar{background-color:#fff;box-shadow:0 1px 5px #00000040;display:flex;flex-direction:column;height:100%;right:-100%;padding:1rem;position:fixed;top:0;transition:right .3s;width:100%;z-index:999}.sidebar__header{border-bottom:1px solid #dedce5;display:flex;justify-content:space-between;padding-bottom:.75rem}.sidebar__header__title{color:#212533;font-family:Inter,sans-serif;font-size:1rem;text-transform:uppercase;-webkit-user-select:none;user-select:none}.sidebar__header__close{background-color:transparent;border:none;color:#212533;cursor:pointer;font-size:1rem;padding:.5rem}.sidebar__body{flex-grow:1;overflow:auto;padding:1rem .5rem}.sidebar__footer{border-top:1px solid #dedce5;padding-top:.75rem}.sidebar--open{right:0}@media (min-width: 768px){.sidebar{width:75%}}@media (min-width: 992px){.sidebar{width:50%}}\n"], dependencies: [{ kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.CdkTrapFocus, selector: "[cdkTrapFocus]", inputs: ["cdkTrapFocus", "cdkTrapFocusAutoCapture"], exportAs: ["cdkTrapFocus"] }], animations: [
             trigger('visibilityChanged', [
-                transition(':enter', [style({ transform: 'translateX(100%)' }), animate('300ms', style({ transform: 'translateX(0)' }))]),
-                transition(':leave', [style({ transform: 'translateX(0)' }), animate('300ms', style({ transform: 'translateX(100%)' }))]),
+                transition(':enter', [
+                    style({ transform: 'translateX(100%)' }),
+                    animate('300ms', style({ transform: 'translateX(0)' })),
+                ]),
+                transition(':leave', [
+                    style({ transform: 'translateX(0)' }),
+                    animate('300ms', style({ transform: 'translateX(100%)' })),
+                ]),
             ]),
         ] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SidebarComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: SidebarComponent, decorators: [{
             type: Component,
             args: [{ selector: 's-sidebar', host: {
-                        '(document:keydown.escape)': 'handleEscape($event)',
+                        '(document:keydown.escape)': 'handleEscape()',
                     }, animations: [
                         trigger('visibilityChanged', [
-                            transition(':enter', [style({ transform: 'translateX(100%)' }), animate('300ms', style({ transform: 'translateX(0)' }))]),
-                            transition(':leave', [style({ transform: 'translateX(0)' }), animate('300ms', style({ transform: 'translateX(100%)' }))]),
+                            transition(':enter', [
+                                style({ transform: 'translateX(100%)' }),
+                                animate('300ms', style({ transform: 'translateX(0)' })),
+                            ]),
+                            transition(':leave', [
+                                style({ transform: 'translateX(0)' }),
+                                animate('300ms', style({ transform: 'translateX(100%)' })),
+                            ]),
                         ]),
-                    ], template: "@if (visible) {\n\t<div\n\t\tclass=\"backdrop\"\n\t\t(click)=\"dismissible && closeSidebar()\"></div>\n}\n\n@if (cache || visible) {\n\t<div\n\t\tcdkTrapFocus\n\t\t[cdkTrapFocusAutoCapture]=\"visible\"\n\t\t[@visibilityChanged]\n\t\tclass=\"sidebar\"\n\t\t[class.sidebar--open]=\"visible\"\n\t\t[class.sidebar--large-size]=\"largeSized\">\n\t\t<div class=\"sidebar__header\">\n\t\t\t@if (headerTemplate) {\n\t\t\t\t<ng-template *ngTemplateOutlet=\"headerTemplate\"></ng-template>\n\t\t\t} @else {\n\t\t\t\t<span class=\"sidebar__header__title\">{{ header }}</span>\n\t\t\t}\n\t\t\t@if (closable) {\n\t\t\t\t<button\n\t\t\t\t\tclass=\"sidebar__header__close fa-solid fa-xmark\"\n\t\t\t\t\t(click)=\"closeSidebar()\"></button>\n\t\t\t}\n\t\t</div>\n\t\t<div class=\"sidebar__body\">\n\t\t\t@if (bodyTemplate) {\n\t\t\t\t<ng-template [ngTemplateOutlet]=\"bodyTemplate\"></ng-template>\n\t\t\t} @else {\n\t\t\t\t<ng-content></ng-content>\n\t\t\t}\n\t\t</div>\n\t\t@if (footerTemplate) {\n\t\t\t<div class=\"sidebar__footer\">\n\t\t\t\t<ng-template [ngTemplateOutlet]=\"footerTemplate\"></ng-template>\n\t\t\t</div>\n\t\t}\n\t</div>\n}\n", styles: [".backdrop{background-color:#00000080;height:100%;left:0;position:fixed;top:0;transition:opacity .3s;width:100%;z-index:9998}.sidebar{background-color:#fff;box-shadow:0 1px 5px #00000040;display:flex;flex-direction:column;height:100%;right:-100%;padding:1rem;position:fixed;top:0;transition:right .3s;width:100%;z-index:9999}.sidebar__header{border-bottom:1px solid #dedce5;display:flex;justify-content:space-between;padding-bottom:.75rem}.sidebar__header__title{color:#212533;font-family:Inter,sans-serif;font-size:1rem;text-transform:uppercase;-webkit-user-select:none;user-select:none}.sidebar__header__close{background-color:transparent;border:none;color:#212533;cursor:pointer;font-size:1rem;padding:.5rem}.sidebar__body{flex-grow:1;overflow:auto;padding:1rem .5rem}.sidebar__footer{border-top:1px solid #dedce5;padding-top:.75rem}.sidebar--open{right:0}@media (min-width: 768px){.sidebar{width:75%}}@media (min-width: 992px){.sidebar{width:50%}}\n"] }]
+                    ], template: "@if (visible()) {\n    <div\n        class=\"backdrop\"\n        (click)=\"dismissible && closeSidebar()\"\n    ></div>\n}\n\n@if (cache || visible()) {\n    <div\n        cdkTrapFocus\n        [cdkTrapFocusAutoCapture]=\"visible()\"\n        [@visibilityChanged]\n        class=\"sidebar\"\n        [class.sidebar--open]=\"visible()\"\n        [class.sidebar--large-size]=\"largeSized\"\n    >\n        <div class=\"sidebar__header\">\n            @if (headerTemplate) {\n                <ng-template *ngTemplateOutlet=\"headerTemplate\"></ng-template>\n            } @else {\n                <span class=\"sidebar__header__title\">{{ header }}</span>\n            }\n            @if (closable) {\n                <button\n                    class=\"sidebar__header__close fa-solid fa-xmark\"\n                    (click)=\"closeSidebar()\"\n                ></button>\n            }\n        </div>\n        <div class=\"sidebar__body\">\n            @if (bodyTemplate) {\n                <ng-template [ngTemplateOutlet]=\"bodyTemplate\"></ng-template>\n            } @else {\n                <ng-content></ng-content>\n            }\n        </div>\n        @if (footerTemplate) {\n            <div class=\"sidebar__footer\">\n                <ng-template [ngTemplateOutlet]=\"footerTemplate\"></ng-template>\n            </div>\n        }\n    </div>\n}\n", styles: [".backdrop{background-color:#00000080;height:100%;left:0;position:fixed;top:0;transition:opacity .3s;width:100%;z-index:998}.sidebar{background-color:#fff;box-shadow:0 1px 5px #00000040;display:flex;flex-direction:column;height:100%;right:-100%;padding:1rem;position:fixed;top:0;transition:right .3s;width:100%;z-index:999}.sidebar__header{border-bottom:1px solid #dedce5;display:flex;justify-content:space-between;padding-bottom:.75rem}.sidebar__header__title{color:#212533;font-family:Inter,sans-serif;font-size:1rem;text-transform:uppercase;-webkit-user-select:none;user-select:none}.sidebar__header__close{background-color:transparent;border:none;color:#212533;cursor:pointer;font-size:1rem;padding:.5rem}.sidebar__body{flex-grow:1;overflow:auto;padding:1rem .5rem}.sidebar__footer{border-top:1px solid #dedce5;padding-top:.75rem}.sidebar--open{right:0}@media (min-width: 768px){.sidebar{width:75%}}@media (min-width: 992px){.sidebar{width:50%}}\n"] }]
         }], propDecorators: { templates: [{
                 type: ContentChildren,
                 args: [TemplateDirective]
-            }], visible: [{
-                type: Input
             }], closable: [{
                 type: Input
             }], dismissible: [{
@@ -92,16 +113,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
                 type: Input
             }], registerConfirmClose: [{
                 type: Input
-            }], visibleChange: [{
-                type: Output
             }] } });
 
 class SidebarModule {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SidebarModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.13", ngImport: i0, type: SidebarModule, declarations: [SidebarComponent], imports: [CommonModule, A11yModule], exports: [SidebarComponent, TemplateModule] });
-    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SidebarModule, imports: [CommonModule, A11yModule, TemplateModule] });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: SidebarModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.14", ngImport: i0, type: SidebarModule, declarations: [SidebarComponent], imports: [CommonModule, A11yModule], exports: [SidebarComponent, TemplateModule] });
+    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: SidebarModule, imports: [CommonModule, A11yModule, TemplateModule] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SidebarModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: SidebarModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [CommonModule, A11yModule],

package/fesm2022/seniorsistemas-angular-components-sidebar.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"seniorsistemas-angular-components-sidebar.mjs","sources":["../../projects/angular-components/sidebar/src/lib/sidebar/sidebar.component.ts","../../projects/angular-components/sidebar/src/lib/sidebar/sidebar.component.html","../../projects/angular-components/sidebar/src/lib/sidebar/sidebar.module.ts","../../projects/angular-components/sidebar/src/seniorsistemas-angular-components-sidebar.ts"],"sourcesContent":["import { animate, style, transition, trigger } from '@angular/animations';\nimport { AfterContentInit, Component, ContentChildren, EventEmitter, Input, Output, QueryList, TemplateRef } from '@angular/core';\nimport { TemplateDirective } from '@seniorsistemas/angular-components/template';\n\n@Component({\n    selector: 's-sidebar',\n    templateUrl: './sidebar.component.html',\n    styleUrls: ['./sidebar.component.scss'],\n    host: {\n        '(document:keydown.escape)': 'handleEscape($event)',\n    },\n    animations: [\n        trigger('visibilityChanged', [\n            transition(':enter', [style({ transform: 'translateX(100%)' }), animate('300ms', style({ transform: 'translateX(0)' }))]),\n            transition(':leave', [style({ transform: 'translateX(0)' }), animate('300ms', style({ transform: 'translateX(100%)' }))]),\n        ]),\n    ],\n})\nexport class SidebarComponent implements AfterContentInit {\n    @ContentChildren(TemplateDirective)\n    public templates: QueryList<TemplateDirective> | null = null;\n\n    @Input()\n    public visible = false;\n\n    @Input()\n    public closable = true;\n\n    @Input()\n    public dismissible = true;\n\n    @Input()\n    public closeOnEscape = true;\n\n    @Input()\n    public header?: string;\n\n    @Input()\n    public largeSized = false;\n\n    @Input()\n    public cache = false;\n\n    @Input()\n    public set registerConfirmClose(fn: () => boolean) {\n        this._confirmClose = fn;\n    }\n\n    @Output()\n    public visibleChange = new EventEmitter<boolean>();\n\n    public headerTemplate: TemplateRef<unknown> | null = null;\n    public bodyTemplate: TemplateRef<unknown> | null = null;\n    public footerTemplate: TemplateRef<unknown> | null = null;\n\n    private _confirmClose = () => true;\n\n    public ngAfterContentInit(): void {\n        this._getTemplates();\n    }\n\n    public closeSidebar(): void {\n        if (this._confirmClose()) {\n            this.visible = false;\n            this.visibleChange.emit(this.visible);\n        }\n    }\n\n    public handleEscape(_: KeyboardEvent): void {\n        if (this.closeOnEscape) {\n            this.closeSidebar();\n        }\n    }\n\n    private _getCustomTemplate(type: string): TemplateRef<any> | null {\n        return this.templates?.find((template: TemplateDirective) => template.type === type)?.template ?? null;\n    }\n\n    private getHeaderTemplate(): TemplateRef<unknown> | null {\n        return this._getCustomTemplate('header') ?? null;\n    }\n\n    private getBodyTemplate(): TemplateRef<unknown> | null {\n        return this._getCustomTemplate('body') ?? null;\n    }\n\n    private getFooterTemplate(): TemplateRef<unknown> | null {\n        return this._getCustomTemplate('footer') ?? null;\n    }\n\n    private _getTemplates(): void {\n        this.headerTemplate = this.getHeaderTemplate();\n        this.bodyTemplate = this.getBodyTemplate();\n        this.footerTemplate = this.getFooterTemplate();\n    }\n}\n","@if (visible) {\n\t<div\n\t\tclass=\"backdrop\"\n\t\t(click)=\"dismissible && closeSidebar()\"></div>\n}\n\n@if (cache || visible) {\n\t<div\n\t\tcdkTrapFocus\n\t\t[cdkTrapFocusAutoCapture]=\"visible\"\n\t\t[@visibilityChanged]\n\t\tclass=\"sidebar\"\n\t\t[class.sidebar--open]=\"visible\"\n\t\t[class.sidebar--large-size]=\"largeSized\">\n\t\t<div class=\"sidebar__header\">\n\t\t\t@if (headerTemplate) {\n\t\t\t\t<ng-template *ngTemplateOutlet=\"headerTemplate\"></ng-template>\n\t\t\t} @else {\n\t\t\t\t<span class=\"sidebar__header__title\">{{ header }}</span>\n\t\t\t}\n\t\t\t@if (closable) {\n\t\t\t\t<button\n\t\t\t\t\tclass=\"sidebar__header__close fa-solid fa-xmark\"\n\t\t\t\t\t(click)=\"closeSidebar()\"></button>\n\t\t\t}\n\t\t</div>\n\t\t<div class=\"sidebar__body\">\n\t\t\t@if (bodyTemplate) {\n\t\t\t\t<ng-template [ngTemplateOutlet]=\"bodyTemplate\"></ng-template>\n\t\t\t} @else {\n\t\t\t\t<ng-content></ng-content>\n\t\t\t}\n\t\t</div>\n\t\t@if (footerTemplate) {\n\t\t\t<div class=\"sidebar__footer\">\n\t\t\t\t<ng-template [ngTemplateOutlet]=\"footerTemplate\"></ng-template>\n\t\t\t</div>\n\t\t}\n\t</div>\n}\n","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { A11yModule } from '@angular/cdk/a11y';\n\nimport { SidebarComponent } from './sidebar.component';\nimport { TemplateModule } from '@seniorsistemas/angular-components/template';\n\n@NgModule({\n    imports: [CommonModule, A11yModule],\n    declarations: [SidebarComponent],\n    exports: [SidebarComponent, TemplateModule],\n})\nexport class SidebarModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":";;;;;;;;;MAkBa,gBAAgB,CAAA;IAElB,SAAS,GAAwC,IAAI,CAAC;IAGtD,OAAO,GAAG,KAAK,CAAC;IAGhB,QAAQ,GAAG,IAAI,CAAC;IAGhB,WAAW,GAAG,IAAI,CAAC;IAGnB,aAAa,GAAG,IAAI,CAAC;AAGrB,IAAA,MAAM,CAAU;IAGhB,UAAU,GAAG,KAAK,CAAC;IAGnB,KAAK,GAAG,KAAK,CAAC;IAErB,IACW,oBAAoB,CAAC,EAAiB,EAAA;AAC7C,QAAA,IAAI,CAAC,aAAa,GAAG,EAAE,CAAC;KAC3B;AAGM,IAAA,aAAa,GAAG,IAAI,YAAY,EAAW,CAAC;IAE5C,cAAc,GAAgC,IAAI,CAAC;IACnD,YAAY,GAAgC,IAAI,CAAC;IACjD,cAAc,GAAgC,IAAI,CAAC;AAElD,IAAA,aAAa,GAAG,MAAM,IAAI,CAAC;IAE5B,kBAAkB,GAAA;QACrB,IAAI,CAAC,aAAa,EAAE,CAAC;KACxB;IAEM,YAAY,GAAA;AACf,QAAA,IAAI,IAAI,CAAC,aAAa,EAAE,EAAE;AACtB,YAAA,IAAI,CAAC,OAAO,GAAG,KAAK,CAAC;YACrB,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;SACzC;KACJ;AAEM,IAAA,YAAY,CAAC,CAAgB,EAAA;AAChC,QAAA,IAAI,IAAI,CAAC,aAAa,EAAE;YACpB,IAAI,CAAC,YAAY,EAAE,CAAC;SACvB;KACJ;AAEO,IAAA,kBAAkB,CAAC,IAAY,EAAA;QACnC,OAAO,IAAI,CAAC,SAAS,EAAE,IAAI,CAAC,CAAC,QAA2B,KAAK,QAAQ,CAAC,IAAI,KAAK,IAAI,CAAC,EAAE,QAAQ,IAAI,IAAI,CAAC;KAC1G;IAEO,iBAAiB,GAAA;QACrB,OAAO,IAAI,CAAC,kBAAkB,CAAC,QAAQ,CAAC,IAAI,IAAI,CAAC;KACpD;IAEO,eAAe,GAAA;QACnB,OAAO,IAAI,CAAC,kBAAkB,CAAC,MAAM,CAAC,IAAI,IAAI,CAAC;KAClD;IAEO,iBAAiB,GAAA;QACrB,OAAO,IAAI,CAAC,kBAAkB,CAAC,QAAQ,CAAC,IAAI,IAAI,CAAC;KACpD;IAEO,aAAa,GAAA;AACjB,QAAA,IAAI,CAAC,cAAc,GAAG,IAAI,CAAC,iBAAiB,EAAE,CAAC;AAC/C,QAAA,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC,eAAe,EAAE,CAAC;AAC3C,QAAA,IAAI,CAAC,cAAc,GAAG,IAAI,CAAC,iBAAiB,EAAE,CAAC;KAClD;wGA5EQ,gBAAgB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAAhB,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,IAAA,EAAA,gBAAgB,EACR,QAAA,EAAA,WAAA,EAAA,MAAA,EAAA,EAAA,OAAA,EAAA,SAAA,EAAA,QAAA,EAAA,UAAA,EAAA,WAAA,EAAA,aAAA,EAAA,aAAA,EAAA,eAAA,EAAA,MAAA,EAAA,QAAA,EAAA,UAAA,EAAA,YAAA,EAAA,KAAA,EAAA,OAAA,EAAA,oBAAA,EAAA,sBAAA,EAAA,EAAA,OAAA,EAAA,EAAA,aAAA,EAAA,eAAA,EAAA,EAAA,IAAA,EAAA,EAAA,SAAA,EAAA,EAAA,yBAAA,EAAA,sBAAA,EAAA,EAAA,EAAA,OAAA,EAAA,CAAA,EAAA,YAAA,EAAA,WAAA,EAAA,SAAA,EAAA,iBAAiB,ECnBtC,CAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,EAAA,8mCAwCA,ED7BgB,MAAA,EAAA,CAAA,07BAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,gBAAA,EAAA,QAAA,EAAA,oBAAA,EAAA,MAAA,EAAA,CAAA,yBAAA,EAAA,kBAAA,EAAA,0BAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,YAAA,EAAA,QAAA,EAAA,gBAAA,EAAA,MAAA,EAAA,CAAA,cAAA,EAAA,yBAAA,CAAA,EAAA,QAAA,EAAA,CAAA,cAAA,CAAA,EAAA,CAAA,EAAA,UAAA,EAAA;YACR,OAAO,CAAC,mBAAmB,EAAE;gBACzB,UAAU,CAAC,QAAQ,EAAE,CAAC,KAAK,CAAC,EAAE,SAAS,EAAE,kBAAkB,EAAE,CAAC,EAAE,OAAO,CAAC,OAAO,EAAE,KAAK,CAAC,EAAE,SAAS,EAAE,eAAe,EAAE,CAAC,CAAC,CAAC,CAAC;gBACzH,UAAU,CAAC,QAAQ,EAAE,CAAC,KAAK,CAAC,EAAE,SAAS,EAAE,eAAe,EAAE,CAAC,EAAE,OAAO,CAAC,OAAO,EAAE,KAAK,CAAC,EAAE,SAAS,EAAE,kBAAkB,EAAE,CAAC,CAAC,CAAC,CAAC;aAC5H,CAAC;AACL,SAAA,EAAA,CAAA,CAAA;;4FAEQ,gBAAgB,EAAA,UAAA,EAAA,CAAA;kBAd5B,SAAS;AACI,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,WAAW,EAGf,IAAA,EAAA;AACF,wBAAA,2BAA2B,EAAE,sBAAsB;qBACtD,EACW,UAAA,EAAA;wBACR,OAAO,CAAC,mBAAmB,EAAE;4BACzB,UAAU,CAAC,QAAQ,EAAE,CAAC,KAAK,CAAC,EAAE,SAAS,EAAE,kBAAkB,EAAE,CAAC,EAAE,OAAO,CAAC,OAAO,EAAE,KAAK,CAAC,EAAE,SAAS,EAAE,eAAe,EAAE,CAAC,CAAC,CAAC,CAAC;4BACzH,UAAU,CAAC,QAAQ,EAAE,CAAC,KAAK,CAAC,EAAE,SAAS,EAAE,eAAe,EAAE,CAAC,EAAE,OAAO,CAAC,OAAO,EAAE,KAAK,CAAC,EAAE,SAAS,EAAE,kBAAkB,EAAE,CAAC,CAAC,CAAC,CAAC;yBAC5H,CAAC;AACL,qBAAA,EAAA,QAAA,EAAA,8mCAAA,EAAA,MAAA,EAAA,CAAA,07BAAA,CAAA,EAAA,CAAA;8BAIM,SAAS,EAAA,CAAA;sBADf,eAAe;uBAAC,iBAAiB,CAAA;gBAI3B,OAAO,EAAA,CAAA;sBADb,KAAK;gBAIC,QAAQ,EAAA,CAAA;sBADd,KAAK;gBAIC,WAAW,EAAA,CAAA;sBADjB,KAAK;gBAIC,aAAa,EAAA,CAAA;sBADnB,KAAK;gBAIC,MAAM,EAAA,CAAA;sBADZ,KAAK;gBAIC,UAAU,EAAA,CAAA;sBADhB,KAAK;gBAIC,KAAK,EAAA,CAAA;sBADX,KAAK;gBAIK,oBAAoB,EAAA,CAAA;sBAD9B,KAAK;gBAMC,aAAa,EAAA,CAAA;sBADnB,MAAM;;;MEpCE,aAAa,CAAA;wGAAb,aAAa,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,QAAA,EAAA,CAAA,CAAA;yGAAb,aAAa,EAAA,YAAA,EAAA,CAHP,gBAAgB,CADrB,EAAA,OAAA,EAAA,CAAA,YAAY,EAAE,UAAU,CAAA,EAAA,OAAA,EAAA,CAExB,gBAAgB,EAAE,cAAc,CAAA,EAAA,CAAA,CAAA;AAEjC,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,mBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,aAAa,EAJZ,OAAA,EAAA,CAAA,YAAY,EAAE,UAAU,EAEN,cAAc,CAAA,EAAA,CAAA,CAAA;;4FAEjC,aAAa,EAAA,UAAA,EAAA,CAAA;kBALzB,QAAQ;AAAC,YAAA,IAAA,EAAA,CAAA;AACN,oBAAA,OAAO,EAAE,CAAC,YAAY,EAAE,UAAU,CAAC;oBACnC,YAAY,EAAE,CAAC,gBAAgB,CAAC;AAChC,oBAAA,OAAO,EAAE,CAAC,gBAAgB,EAAE,cAAc,CAAC;AAC9C,iBAAA,CAAA;;;ACXD;;AAEG;;;;"}
+{"version":3,"file":"seniorsistemas-angular-components-sidebar.mjs","sources":["../../projects/angular-components/sidebar/src/lib/sidebar/sidebar.component.ts","../../projects/angular-components/sidebar/src/lib/sidebar/sidebar.component.html","../../projects/angular-components/sidebar/src/lib/sidebar/sidebar.module.ts","../../projects/angular-components/sidebar/src/seniorsistemas-angular-components-sidebar.ts"],"sourcesContent":["import { animate, style, transition, trigger } from '@angular/animations';\nimport {\n    AfterContentInit,\n    Component,\n    ContentChildren,\n    effect,\n    Input,\n    model,\n    OnDestroy,\n    QueryList,\n    TemplateRef,\n} from '@angular/core';\nimport { TemplateDirective } from '@seniorsistemas/angular-components/template';\nimport { disableScroll, enableScroll } from '@seniorsistemas/angular-components/utils';\n\n@Component({\n    selector: 's-sidebar',\n    templateUrl: './sidebar.component.html',\n    styleUrls: ['./sidebar.component.scss'],\n    host: {\n        '(document:keydown.escape)': 'handleEscape()',\n    },\n    animations: [\n        trigger('visibilityChanged', [\n            transition(':enter', [\n                style({ transform: 'translateX(100%)' }),\n                animate('300ms', style({ transform: 'translateX(0)' })),\n            ]),\n            transition(':leave', [\n                style({ transform: 'translateX(0)' }),\n                animate('300ms', style({ transform: 'translateX(100%)' })),\n            ]),\n        ]),\n    ],\n})\nexport class SidebarComponent implements AfterContentInit, OnDestroy {\n    @ContentChildren(TemplateDirective)\n    public templates: QueryList<TemplateDirective> | null = null;\n\n    public visible = model<boolean>(false);\n\n    @Input()\n    public closable = true;\n\n    @Input()\n    public dismissible = true;\n\n    @Input()\n    public closeOnEscape = true;\n\n    @Input()\n    public header?: string;\n\n    @Input()\n    public largeSized = false;\n\n    @Input()\n    public cache = false;\n\n    @Input()\n    public set registerConfirmClose(fn: () => boolean) {\n        this._confirmClose = fn;\n    }\n\n    public headerTemplate: TemplateRef<unknown> | null = null;\n    public bodyTemplate: TemplateRef<unknown> | null = null;\n    public footerTemplate: TemplateRef<unknown> | null = null;\n\n    private _confirmClose = () => true;\n\n    private readonly visibleEffect = effect(() => {\n        const visible = this.visible();\n        if (visible) {\n            disableScroll();\n        } else {\n            enableScroll();\n        }\n    });\n\n    public ngAfterContentInit(): void {\n        this._getTemplates();\n    }\n\n    public ngOnDestroy(): void {\n        this.visibleEffect.destroy();\n    }\n\n    public closeSidebar(): void {\n        if (this._confirmClose()) {\n            this.visible.set(false);\n        }\n    }\n\n    public handleEscape(): void {\n        if (this.closeOnEscape) {\n            this.closeSidebar();\n        }\n    }\n\n    private _getCustomTemplate(type: string): TemplateRef<any> | null {\n        return this.templates?.find((template: TemplateDirective) => template.type === type)?.template ?? null;\n    }\n\n    private getHeaderTemplate(): TemplateRef<unknown> | null {\n        return this._getCustomTemplate('header') ?? null;\n    }\n\n    private getBodyTemplate(): TemplateRef<unknown> | null {\n        return this._getCustomTemplate('body') ?? null;\n    }\n\n    private getFooterTemplate(): TemplateRef<unknown> | null {\n        return this._getCustomTemplate('footer') ?? null;\n    }\n\n    private _getTemplates(): void {\n        this.headerTemplate = this.getHeaderTemplate();\n        this.bodyTemplate = this.getBodyTemplate();\n        this.footerTemplate = this.getFooterTemplate();\n    }\n}\n","@if (visible()) {\n    <div\n        class=\"backdrop\"\n        (click)=\"dismissible && closeSidebar()\"\n    ></div>\n}\n\n@if (cache || visible()) {\n    <div\n        cdkTrapFocus\n        [cdkTrapFocusAutoCapture]=\"visible()\"\n        [@visibilityChanged]\n        class=\"sidebar\"\n        [class.sidebar--open]=\"visible()\"\n        [class.sidebar--large-size]=\"largeSized\"\n    >\n        <div class=\"sidebar__header\">\n            @if (headerTemplate) {\n                <ng-template *ngTemplateOutlet=\"headerTemplate\"></ng-template>\n            } @else {\n                <span class=\"sidebar__header__title\">{{ header }}</span>\n            }\n            @if (closable) {\n                <button\n                    class=\"sidebar__header__close fa-solid fa-xmark\"\n                    (click)=\"closeSidebar()\"\n                ></button>\n            }\n        </div>\n        <div class=\"sidebar__body\">\n            @if (bodyTemplate) {\n                <ng-template [ngTemplateOutlet]=\"bodyTemplate\"></ng-template>\n            } @else {\n                <ng-content></ng-content>\n            }\n        </div>\n        @if (footerTemplate) {\n            <div class=\"sidebar__footer\">\n                <ng-template [ngTemplateOutlet]=\"footerTemplate\"></ng-template>\n            </div>\n        }\n    </div>\n}\n","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { A11yModule } from '@angular/cdk/a11y';\n\nimport { SidebarComponent } from './sidebar.component';\nimport { TemplateModule } from '@seniorsistemas/angular-components/template';\n\n@NgModule({\n    imports: [CommonModule, A11yModule],\n    declarations: [SidebarComponent],\n    exports: [SidebarComponent, TemplateModule],\n})\nexport class SidebarModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}

package/fesm2022/seniorsistemas-angular-components-slide-panel.mjs

@@ -22,10 +22,10 @@ class SlidePanelService {
             subject.next();
         }
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SlidePanelService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SlidePanelService });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: SlidePanelService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: SlidePanelService });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SlidePanelService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: SlidePanelService, decorators: [{
             type: Injectable
         }] });
 
@@ -100,8 +100,8 @@ class SlidePanelComponent {
     _checkOverBehavior() {
         this.isSlideOver = window.innerWidth <= SMALL_DEVICE_BREAKPOINT;
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SlidePanelComponent, deps: [{ token: SlidePanelService }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: SlidePanelComponent, selector: "s-slide-panel", inputs: { id: "id", openIcon: "openIcon", closeIcon: "closeIcon", cache: "cache", createOpen: "createOpen", noOverlap: "noOverlap" }, outputs: { panelOpened: "panelOpened", panelClosed: "panelClosed" }, host: { listeners: { "window:resize": "onResize()" } }, ngImport: i0, template: "<div class=\"slide-panel\">\n    <div\n        class=\"slide-content\"\n        [ngClass]=\"{\n            'slide-content--closed': !isOpen,\n            'slide-content--over': isSlideOver,\n            'slide-content--no-overlap': noOverlap,\n        }\"\n    >\n        <div\n            #mainContainer\n            class=\"main-container\"\n        >\n            @if (cache) {\n                <div\n                    class=\"content-container\"\n                    [@cacheAnimation]=\"isOpen\"\n                    [@.disabled]=\"isContentAnimationDisabled\"\n                    (@cacheAnimation.start)=\"onContentAnimationStart()\"\n                    (@cacheAnimation.done)=\"onContentAnimationDone()\"\n                >\n                    <ng-container [ngTemplateOutlet]=\"slideContentTemplate\"></ng-container>\n                </div>\n            } @else {\n                @if (isOpen) {\n                    <div\n                        class=\"content-container\"\n                        @cachelessAnimation\n                        [@.disabled]=\"isContentAnimationDisabled\"\n                        (@cachelessAnimation.start)=\"onContentAnimationStart()\"\n                        (@cachelessAnimation.done)=\"onContentAnimationDone()\"\n                    >\n                        <ng-container [ngTemplateOutlet]=\"slideContentTemplate\"></ng-container>\n                    </div>\n                }\n            }\n        </div>\n        <button\n            class=\"button\"\n            [ngClass]=\"isOpen ? closeIcon : openIcon\"\n            (click)=\"onClickButton()\"\n        ></button>\n    </div>\n    <div\n        class=\"side-content\"\n    >\n        <ng-content select=\"[side-content]\"></ng-content>\n    </div>\n</div>\n\n<ng-template #slideContentTemplate>\n    <ng-content select=\"[slide-content]\"></ng-content>\n</ng-template>\n", styles: [".slide-panel{display:flex;width:100%}.slide-panel .slide-content{display:flex;position:relative}.slide-panel .slide-content .main-container{background-color:#eeebf2;display:flex;border:1px solid #ccc;overflow:hidden;position:relative}.slide-panel .slide-content .main-container .content-container{overflow-y:auto;overflow-x:hidden;padding:16px}.slide-panel .slide-content .button{align-items:center;background-color:#eeebf2;border:1px solid #ccc;border-left:none;border-radius:0 4px 4px 0;cursor:pointer;display:flex;font-family:\"Font Awesome 5 Pro\";font-size:16px;height:32px;justify-content:center;position:absolute;right:-32px;top:16px;width:32px;z-index:99}.slide-panel .slide-content--closed .main-container{border:none}.slide-panel .slide-content--over{position:absolute}.slide-panel .slide-content--no-overlap{margin-right:32px}.slide-panel .side-content{display:flex;height:max-content;overflow:auto;transition:width .1s linear}\n"], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], animations: [
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: SlidePanelComponent, deps: [{ token: SlidePanelService }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: SlidePanelComponent, selector: "s-slide-panel", inputs: { id: "id", openIcon: "openIcon", closeIcon: "closeIcon", cache: "cache", createOpen: "createOpen", noOverlap: "noOverlap" }, outputs: { panelOpened: "panelOpened", panelClosed: "panelClosed" }, host: { listeners: { "window:resize": "onResize()" } }, ngImport: i0, template: "<div class=\"slide-panel\">\n    <div\n        class=\"slide-content\"\n        [ngClass]=\"{\n            'slide-content--closed': !isOpen,\n            'slide-content--over': isSlideOver,\n            'slide-content--no-overlap': noOverlap,\n        }\"\n    >\n        <div\n            #mainContainer\n            class=\"main-container\"\n        >\n            @if (cache) {\n                <div\n                    class=\"content-container\"\n                    [@cacheAnimation]=\"isOpen\"\n                    [@.disabled]=\"isContentAnimationDisabled\"\n                    (@cacheAnimation.start)=\"onContentAnimationStart()\"\n                    (@cacheAnimation.done)=\"onContentAnimationDone()\"\n                >\n                    <ng-container [ngTemplateOutlet]=\"slideContentTemplate\"></ng-container>\n                </div>\n            } @else {\n                @if (isOpen) {\n                    <div\n                        class=\"content-container\"\n                        @cachelessAnimation\n                        [@.disabled]=\"isContentAnimationDisabled\"\n                        (@cachelessAnimation.start)=\"onContentAnimationStart()\"\n                        (@cachelessAnimation.done)=\"onContentAnimationDone()\"\n                    >\n                        <ng-container [ngTemplateOutlet]=\"slideContentTemplate\"></ng-container>\n                    </div>\n                }\n            }\n        </div>\n        <button\n            class=\"button\"\n            [ngClass]=\"isOpen ? closeIcon : openIcon\"\n            (click)=\"onClickButton()\"\n        ></button>\n    </div>\n    <div\n        class=\"side-content\"\n    >\n        <ng-content select=\"[side-content]\"></ng-content>\n    </div>\n</div>\n\n<ng-template #slideContentTemplate>\n    <ng-content select=\"[slide-content]\"></ng-content>\n</ng-template>\n", styles: [".slide-panel{display:flex;width:100%}.slide-panel .slide-content{display:flex;position:relative}.slide-panel .slide-content .main-container{background-color:#eeebf2;display:flex;border:1px solid #ccc;overflow:hidden;position:relative}.slide-panel .slide-content .main-container .content-container{overflow-y:auto;overflow-x:hidden;padding:16px}.slide-panel .slide-content .button{align-items:center;background-color:#eeebf2;border:1px solid #ccc;border-left:none;border-radius:0 4px 4px 0;cursor:pointer;display:flex;font-family:\"Font Awesome 5 Pro\";font-size:16px;height:32px;justify-content:center;position:absolute;right:-32px;top:16px;width:32px;z-index:99}.slide-panel .slide-content--closed .main-container{border:none}.slide-panel .slide-content--over{position:absolute}.slide-panel .slide-content--no-overlap{margin-right:32px}.slide-panel .side-content{display:flex;height:max-content;overflow:auto;transition:width .1s linear}\n"], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], animations: [
             trigger("cachelessAnimation", [
                 transition(":enter", [
                     style({ width: "0" }),
@@ -119,7 +119,7 @@ class SlidePanelComponent {
             ]),
         ] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SlidePanelComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: SlidePanelComponent, decorators: [{
             type: Component,
             args: [{ selector: "s-slide-panel", animations: [
                         trigger("cachelessAnimation", [
@@ -160,11 +160,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
             }] } });
 
 class SlidePanelModule {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SlidePanelModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.13", ngImport: i0, type: SlidePanelModule, declarations: [SlidePanelComponent], imports: [CommonModule], exports: [SlidePanelComponent] });
-    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SlidePanelModule, providers: [SlidePanelService], imports: [CommonModule] });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: SlidePanelModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.14", ngImport: i0, type: SlidePanelModule, declarations: [SlidePanelComponent], imports: [CommonModule], exports: [SlidePanelComponent] });
+    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: SlidePanelModule, providers: [SlidePanelService], imports: [CommonModule] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SlidePanelModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: SlidePanelModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [CommonModule],

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

@@ -528,8 +528,8 @@ class SliderComponent {
     get needParseValues() {
         return this.max !== this.MAX_RANGE_VALUE || this.min !== this.MIN_RANGE_VALUE;
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SliderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: SliderComponent, selector: "s-slider", inputs: { multiple: "multiple", value: "value", step: "step", hiddenThumb: "hiddenThumb", disabled: "disabled", min: "min", max: "max", minValueLabel: "minValueLabel", maxValueLabel: "maxValueLabel", tabindex: "tabindex" }, outputs: { valueChange: "valueChange" }, host: { listeners: { "document:keydown": "onKeydown($event)" } }, providers: [
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: SliderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: SliderComponent, selector: "s-slider", inputs: { multiple: "multiple", value: "value", step: "step", hiddenThumb: "hiddenThumb", disabled: "disabled", min: "min", max: "max", minValueLabel: "minValueLabel", maxValueLabel: "maxValueLabel", tabindex: "tabindex" }, outputs: { valueChange: "valueChange" }, host: { listeners: { "document:keydown": "onKeydown($event)" } }, providers: [
             {
                 provide: NG_VALUE_ACCESSOR,
                 useExisting: forwardRef(() => SliderComponent),
@@ -537,7 +537,7 @@ class SliderComponent {
             },
         ], viewQueries: [{ propertyName: "track", first: true, predicate: ["track"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div\n    class=\"slider-container\"\n    [ngClass]=\"{ 'slider-container--disabled': disabled }\"\n    [tabindex]=\"tabindex\"\n    (click)=\"onTrackClick($event)\"\n    (focus)=\"onFocusIn()\"\n    (blur)=\"onBlur()\">\n    <div\n        #track\n        class=\"slider-track\"\n        [ngClass]=\"{\n            'slider-track--hidden-thumb': hiddenThumb,\n            'slider-track--moving-multiple-thumbs': movingProgressBar\n        }\">\n        <div\n            class=\"slider-progress\"\n            (mousedown)=\"onProgressMouseDown($event)\"\n            [style.left.%]=\"progressLeft\"\n            [style.width]=\"progressWidth\"\n        ></div>\n        <div\n            *ngIf=\"multiple\"\n            class=\"slider-thumb\"\n            [sTooltip]=\"tooltipStartText\"\n            [showDelay]=\"0\"\n            (mousedown)=\"onMouseDown($event, 'start')\"\n            [style.left.%]=\"startValue\"\n        ></div>\n        <div\n            [sTooltip]=\"tooltipEndText\"\n            class=\"slider-thumb\"\n            [showDelay]=\"0\"\n            (mousedown)=\"onMouseDown($event, 'end')\"\n            [style.left.%]=\"endValue\"></div>\n    </div>\n    <div class=\"footer\">\n        <span>{{ minValueLabel || min }}</span>\n        <span>{{ maxValueLabel || max }}</span>\n    </div>\n</div>\n", styles: [".slider-container{height:20px;padding:16px 0 40px;position:relative;-webkit-user-select:none;user-select:none;width:100%}.slider-container .slider-track{background-color:#ddd;border-radius:3px;cursor:pointer;height:6px;position:relative;width:100%}.slider-container .slider-track .slider-progress{background-color:#428bca;border-radius:3px;cursor:pointer;height:100%;left:0;position:absolute;top:0;width:0}.slider-container .slider-track .slider-thumb{background-color:#fff;border:2px solid #428bca;border-radius:50%;cursor:pointer;height:20px;position:absolute;transform:translateY(-50%);top:50%;width:20px}.slider-container .slider-track .slider-thumb:active{box-shadow:0 0 0 4px #428bca33}.slider-container .slider-track--hidden-thumb:not(:hover) .slider-thumb{opacity:0}.slider-container .slider-track--moving-multiple-thumbs .slider-thumb{box-shadow:0 0 0 4px #428bca33}.slider-container .footer{color:#212533;display:flex;font-family:Open Sans,sans-serif;font-size:14px;justify-content:space-between;margin-top:8px}.slider-container--disabled .slider-track{cursor:default}.slider-container--disabled .slider-track .slider-thumb{border-color:#a5a5b2;cursor:default}.slider-container--disabled .slider-track .slider-thumb:active{box-shadow:none}.slider-container--disabled .slider-track .slider-progress{background-color:#a5a5b2;cursor:default}.slider-container:focus-visible{outline:none}.slider-container:focus-visible .slider-thumb{box-shadow:0 0 0 4px #428bca33}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.TooltipDirective, selector: "[sTooltip]", inputs: ["sTooltip", "tooltipPosition", "showDelay", "displayTime", "tooltipEvent", "escape", "visible", "mobileBehavior", "focusedInputRef", "checkTruncatedText"] }] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SliderComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: SliderComponent, decorators: [{
             type: Component,
             args: [{ selector: 's-slider', providers: [
                         {
@@ -603,11 +603,11 @@ const getDifference = (end, start) => {
 };
 
 class SliderModule {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SliderModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.13", ngImport: i0, type: SliderModule, declarations: [SliderComponent], imports: [CommonModule, TooltipModule], exports: [SliderComponent] });
-    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SliderModule, imports: [CommonModule, TooltipModule] });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: SliderModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.14", ngImport: i0, type: SliderModule, declarations: [SliderComponent], imports: [CommonModule, TooltipModule], exports: [SliderComponent] });
+    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: SliderModule, imports: [CommonModule, TooltipModule] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SliderModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: SliderModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [CommonModule, TooltipModule],

package/fesm2022/seniorsistemas-angular-components-speech-recognition.mjs

@@ -138,10 +138,10 @@ class SpeechRecognitionService {
             }
         });
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SpeechRecognitionService, deps: [{ token: i1.LocaleService }, { token: i0.NgZone }, { token: i2.ToastService }, { token: i3.TranslateService }], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SpeechRecognitionService, providedIn: 'root' });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: SpeechRecognitionService, deps: [{ token: i1.LocaleService }, { token: i0.NgZone }, { token: i2.ToastService }, { token: i3.TranslateService }], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: SpeechRecognitionService, providedIn: 'root' });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SpeechRecognitionService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: SpeechRecognitionService, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root'
@@ -216,10 +216,10 @@ class TextToSpeechService {
             this.activeVoice = _voice;
         }
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: TextToSpeechService, deps: [{ token: i1.LocaleService }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: TextToSpeechService, providedIn: 'root' });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: TextToSpeechService, deps: [{ token: i1.LocaleService }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: TextToSpeechService, providedIn: 'root' });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: TextToSpeechService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: TextToSpeechService, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root'
@@ -419,10 +419,10 @@ class SpeechRecognitionComponent {
     get textToSpeech() {
         return this.textAreaElement.value;
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SpeechRecognitionComponent, deps: [{ token: SpeechRecognitionService }, { token: TextToSpeechService }, { token: i3.TranslateService }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: SpeechRecognitionComponent, selector: "s-speech-recognition", inputs: { textAreaElement: "textAreaElement", keepContext: "keepContext", speechRecognitionPlaceholder: "speechRecognitionPlaceholder" }, outputs: { recognizedText: "recognizedText" }, ngImport: i0, template: "@if(hasSpeechRecognitionBrowserApi) {\n    <section class=\"speech-recognition\">\n        <div class=\"speech-recognition-text\">\n            @if(canRenderMicrophone) {\n                {{ 'platform.angular_components.text_area_before_speech' | translate }}\n            }\n\n            @if(isListeningUserVoice) {\n                {{ 'platform.angular_components.text_area_while_speech' | translate }}\n            }\n\n            @if(canRenderAprove && canRenderDiscard) {\n                {{ 'platform.angular_components.text_area_end_speech' | translate }}\n            }\n        </div>\n        <div class=\"speech-recognition-buttons\">\n            @if(canRenderListeningText) {\n                <span\n                    (click)=\"stopListening()\"\n                    class=\"speech-recognition-item speech-recognition-item-regular\">\n                    <i class=\"far fa-ellipsis-h\"></i>\n                </span>\n            }\n\n            @if(canRenderMicrophone) {\n                <span\n                    (click)=\"onListen()\"\n                    class=\"speech-recognition-item speech-recognition-item-microphone\"\n                    [class.speech-recognition-item-disabled]=\"isDisabledMicrophone || isListening || disabled\">\n                    <i class=\"fas fa-microphone\"></i>\n                </span>\n            }\n\n\n            @if(canRenderAprove) {\n                <span\n                    (click)=\"onAprove()\"\n                    class=\"speech-recognition-item speech-recognition-item-aprove\">\n                    <i class=\"fas fa-check\"></i>\n                </span>\n            }\n\n            @if(canRenderDiscard) {\n                <span\n                    (click)=\"onDiscard()\"\n                    class=\"speech-recognition-item speech-recognition-item-discard\">\n                    <i class=\"fas fa-times\"></i>\n                </span>\n            }\n\n            @if(canRenderTextToSpeech) {\n                <span\n                    (click)=\"onOpenToolbar()\"\n                    class=\"speech-recognition-item speech-recognition-item-regular\"\n                    [class.speech-recognition-item-disabled]=\"isDisabledTextToSpeech\">\n                    <i class=\"fas fa-volume-down\"></i>\n                </span>\n            }\n\n            @if(canRenderTextToSpeechToolbar) {\n                <span\n                    class=\"speech-recognition-item-toolbar\">\n                     <i class=\"fas\" [class.fa-pause]=\"isPlayingTextToSpeech\" [class.fa-play]=\"!isPlayingTextToSpeech\"\n                     (click)=\"toggleTextToSpeech()\"></i>\n                        <i class=\"fas fa-backward\" (click)=\"restartTextToSpeech()\"></i>\n                        <span (click)=\"updateVoiceSpeed()\">\n                            {{ voiceSpeed }}x\n                        </span>\n                        <i class=\"fas fa-times\" (click)=\"onCloseToolbar()\"></i>\n                </span>\n            }\n        </div>\n    </section>\n}\n", styles: [".speech-recognition{display:flex;gap:10px;justify-content:space-between;width:100%}.speech-recognition-buttons{display:flex;gap:10px;position:relative;bottom:15px;margin-right:16px}.speech-recognition-item{display:inline-flex;height:25px;padding:4px 12px;justify-content:center;align-items:center;gap:8px;border-radius:15px;cursor:pointer;transition:background .1s ease-in}.speech-recognition-item i,.speech-recognition-item span{color:#fff}.speech-recognition-item-disabled{cursor:default!important}.speech-recognition-item-disabled *{opacity:.5}.speech-recognition-item-microphone{background:#428bca}.speech-recognition-item-microphone:not(.speech-recognition-item-disabled):hover{background:#063951}.speech-recognition-item-regular{background:#7892a1}.speech-recognition-item-regular:not(.speech-recognition-item-disabled):hover{background:#697882}.speech-recognition-item-aprove{background:#0c9348}.speech-recognition-item-aprove:not(.speech-recognition-item-disabled):hover{background:#063951}.speech-recognition-item-discard{background:#c13018}.speech-recognition-item-discard:not(.speech-recognition-item-disabled):hover{background:#063951}.speech-recognition-item-toolbar{background:#7892a1;display:flex;border-radius:15px;align-items:center;color:#fff;height:25px}.speech-recognition-item-toolbar i,.speech-recognition-item-toolbar span{cursor:pointer}.speech-recognition-item-toolbar i:not(:first-child),.speech-recognition-item-toolbar i:not(:last-child){padding:6px}.speech-recognition-item-toolbar i:first-child{padding-left:10px}.speech-recognition-item-toolbar i:last-child{padding-right:10px}.speech-recognition-text{color:#212533;font-size:12px;font-style:normal;font-weight:400;word-break:break-word}\n"], dependencies: [{ kind: "pipe", type: i3.TranslatePipe, name: "translate" }] });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: SpeechRecognitionComponent, deps: [{ token: SpeechRecognitionService }, { token: TextToSpeechService }, { token: i3.TranslateService }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: SpeechRecognitionComponent, selector: "s-speech-recognition", inputs: { textAreaElement: "textAreaElement", keepContext: "keepContext", speechRecognitionPlaceholder: "speechRecognitionPlaceholder" }, outputs: { recognizedText: "recognizedText" }, ngImport: i0, template: "@if(hasSpeechRecognitionBrowserApi) {\n    <section class=\"speech-recognition\">\n        <div class=\"speech-recognition-text\">\n            @if(canRenderMicrophone) {\n                {{ 'platform.angular_components.text_area_before_speech' | translate }}\n            }\n\n            @if(isListeningUserVoice) {\n                {{ 'platform.angular_components.text_area_while_speech' | translate }}\n            }\n\n            @if(canRenderAprove && canRenderDiscard) {\n                {{ 'platform.angular_components.text_area_end_speech' | translate }}\n            }\n        </div>\n        <div class=\"speech-recognition-buttons\">\n            @if(canRenderListeningText) {\n                <span\n                    (click)=\"stopListening()\"\n                    class=\"speech-recognition-item speech-recognition-item-regular\">\n                    <i class=\"far fa-ellipsis-h\"></i>\n                </span>\n            }\n\n            @if(canRenderMicrophone) {\n                <span\n                    (click)=\"onListen()\"\n                    class=\"speech-recognition-item speech-recognition-item-microphone\"\n                    [class.speech-recognition-item-disabled]=\"isDisabledMicrophone || isListening || disabled\">\n                    <i class=\"fas fa-microphone\"></i>\n                </span>\n            }\n\n\n            @if(canRenderAprove) {\n                <span\n                    (click)=\"onAprove()\"\n                    class=\"speech-recognition-item speech-recognition-item-aprove\">\n                    <i class=\"fas fa-check\"></i>\n                </span>\n            }\n\n            @if(canRenderDiscard) {\n                <span\n                    (click)=\"onDiscard()\"\n                    class=\"speech-recognition-item speech-recognition-item-discard\">\n                    <i class=\"fas fa-times\"></i>\n                </span>\n            }\n\n            @if(canRenderTextToSpeech) {\n                <span\n                    (click)=\"onOpenToolbar()\"\n                    class=\"speech-recognition-item speech-recognition-item-regular\"\n                    [class.speech-recognition-item-disabled]=\"isDisabledTextToSpeech\">\n                    <i class=\"fas fa-volume-down\"></i>\n                </span>\n            }\n\n            @if(canRenderTextToSpeechToolbar) {\n                <span\n                    class=\"speech-recognition-item-toolbar\">\n                     <i class=\"fas\" [class.fa-pause]=\"isPlayingTextToSpeech\" [class.fa-play]=\"!isPlayingTextToSpeech\"\n                     (click)=\"toggleTextToSpeech()\"></i>\n                        <i class=\"fas fa-backward\" (click)=\"restartTextToSpeech()\"></i>\n                        <span (click)=\"updateVoiceSpeed()\">\n                            {{ voiceSpeed }}x\n                        </span>\n                        <i class=\"fas fa-times\" (click)=\"onCloseToolbar()\"></i>\n                </span>\n            }\n        </div>\n    </section>\n}\n", styles: [".speech-recognition{display:flex;gap:10px;justify-content:space-between;width:100%}.speech-recognition-buttons{display:flex;gap:10px;position:relative;bottom:15px;margin-right:16px}.speech-recognition-item{display:inline-flex;height:25px;padding:4px 12px;justify-content:center;align-items:center;gap:8px;border-radius:15px;cursor:pointer;transition:background .1s ease-in}.speech-recognition-item i,.speech-recognition-item span{color:#fff}.speech-recognition-item-disabled{cursor:default!important}.speech-recognition-item-disabled *{opacity:.5}.speech-recognition-item-microphone{background:#428bca}.speech-recognition-item-microphone:not(.speech-recognition-item-disabled):hover{background:#063951}.speech-recognition-item-regular{background:#7892a1}.speech-recognition-item-regular:not(.speech-recognition-item-disabled):hover{background:#697882}.speech-recognition-item-aprove{background:#0c9348}.speech-recognition-item-aprove:not(.speech-recognition-item-disabled):hover{background:#063951}.speech-recognition-item-discard{background:#c13018}.speech-recognition-item-discard:not(.speech-recognition-item-disabled):hover{background:#063951}.speech-recognition-item-toolbar{background:#7892a1;display:flex;border-radius:15px;align-items:center;color:#fff;height:25px}.speech-recognition-item-toolbar i,.speech-recognition-item-toolbar span{cursor:pointer}.speech-recognition-item-toolbar i:not(:first-child),.speech-recognition-item-toolbar i:not(:last-child){padding:6px}.speech-recognition-item-toolbar i:first-child{padding-left:10px}.speech-recognition-item-toolbar i:last-child{padding-right:10px}.speech-recognition-text{color:#212533;font-size:12px;font-style:normal;font-weight:400;word-break:break-word}\n"], dependencies: [{ kind: "pipe", type: i3.TranslatePipe, name: "translate" }] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SpeechRecognitionComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: SpeechRecognitionComponent, decorators: [{
             type: Component,
             args: [{ selector: 's-speech-recognition', template: "@if(hasSpeechRecognitionBrowserApi) {\n    <section class=\"speech-recognition\">\n        <div class=\"speech-recognition-text\">\n            @if(canRenderMicrophone) {\n                {{ 'platform.angular_components.text_area_before_speech' | translate }}\n            }\n\n            @if(isListeningUserVoice) {\n                {{ 'platform.angular_components.text_area_while_speech' | translate }}\n            }\n\n            @if(canRenderAprove && canRenderDiscard) {\n                {{ 'platform.angular_components.text_area_end_speech' | translate }}\n            }\n        </div>\n        <div class=\"speech-recognition-buttons\">\n            @if(canRenderListeningText) {\n                <span\n                    (click)=\"stopListening()\"\n                    class=\"speech-recognition-item speech-recognition-item-regular\">\n                    <i class=\"far fa-ellipsis-h\"></i>\n                </span>\n            }\n\n            @if(canRenderMicrophone) {\n                <span\n                    (click)=\"onListen()\"\n                    class=\"speech-recognition-item speech-recognition-item-microphone\"\n                    [class.speech-recognition-item-disabled]=\"isDisabledMicrophone || isListening || disabled\">\n                    <i class=\"fas fa-microphone\"></i>\n                </span>\n            }\n\n\n            @if(canRenderAprove) {\n                <span\n                    (click)=\"onAprove()\"\n                    class=\"speech-recognition-item speech-recognition-item-aprove\">\n                    <i class=\"fas fa-check\"></i>\n                </span>\n            }\n\n            @if(canRenderDiscard) {\n                <span\n                    (click)=\"onDiscard()\"\n                    class=\"speech-recognition-item speech-recognition-item-discard\">\n                    <i class=\"fas fa-times\"></i>\n                </span>\n            }\n\n            @if(canRenderTextToSpeech) {\n                <span\n                    (click)=\"onOpenToolbar()\"\n                    class=\"speech-recognition-item speech-recognition-item-regular\"\n                    [class.speech-recognition-item-disabled]=\"isDisabledTextToSpeech\">\n                    <i class=\"fas fa-volume-down\"></i>\n                </span>\n            }\n\n            @if(canRenderTextToSpeechToolbar) {\n                <span\n                    class=\"speech-recognition-item-toolbar\">\n                     <i class=\"fas\" [class.fa-pause]=\"isPlayingTextToSpeech\" [class.fa-play]=\"!isPlayingTextToSpeech\"\n                     (click)=\"toggleTextToSpeech()\"></i>\n                        <i class=\"fas fa-backward\" (click)=\"restartTextToSpeech()\"></i>\n                        <span (click)=\"updateVoiceSpeed()\">\n                            {{ voiceSpeed }}x\n                        </span>\n                        <i class=\"fas fa-times\" (click)=\"onCloseToolbar()\"></i>\n                </span>\n            }\n        </div>\n    </section>\n}\n", styles: [".speech-recognition{display:flex;gap:10px;justify-content:space-between;width:100%}.speech-recognition-buttons{display:flex;gap:10px;position:relative;bottom:15px;margin-right:16px}.speech-recognition-item{display:inline-flex;height:25px;padding:4px 12px;justify-content:center;align-items:center;gap:8px;border-radius:15px;cursor:pointer;transition:background .1s ease-in}.speech-recognition-item i,.speech-recognition-item span{color:#fff}.speech-recognition-item-disabled{cursor:default!important}.speech-recognition-item-disabled *{opacity:.5}.speech-recognition-item-microphone{background:#428bca}.speech-recognition-item-microphone:not(.speech-recognition-item-disabled):hover{background:#063951}.speech-recognition-item-regular{background:#7892a1}.speech-recognition-item-regular:not(.speech-recognition-item-disabled):hover{background:#697882}.speech-recognition-item-aprove{background:#0c9348}.speech-recognition-item-aprove:not(.speech-recognition-item-disabled):hover{background:#063951}.speech-recognition-item-discard{background:#c13018}.speech-recognition-item-discard:not(.speech-recognition-item-disabled):hover{background:#063951}.speech-recognition-item-toolbar{background:#7892a1;display:flex;border-radius:15px;align-items:center;color:#fff;height:25px}.speech-recognition-item-toolbar i,.speech-recognition-item-toolbar span{cursor:pointer}.speech-recognition-item-toolbar i:not(:first-child),.speech-recognition-item-toolbar i:not(:last-child){padding:6px}.speech-recognition-item-toolbar i:first-child{padding-left:10px}.speech-recognition-item-toolbar i:last-child{padding-right:10px}.speech-recognition-text{color:#212533;font-size:12px;font-style:normal;font-weight:400;word-break:break-word}\n"] }]
         }], ctorParameters: () => [{ type: SpeechRecognitionService }, { type: TextToSpeechService }, { type: i3.TranslateService }], propDecorators: { textAreaElement: [{
@@ -437,13 +437,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
             }] } });
 
 class SpeechRecognitionModule {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SpeechRecognitionModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.13", ngImport: i0, type: SpeechRecognitionModule, declarations: [SpeechRecognitionComponent], imports: [CommonModule,
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: SpeechRecognitionModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.14", ngImport: i0, type: SpeechRecognitionModule, declarations: [SpeechRecognitionComponent], imports: [CommonModule,
             TranslateModule], exports: [SpeechRecognitionComponent] });
-    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SpeechRecognitionModule, imports: [CommonModule,
+    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: SpeechRecognitionModule, imports: [CommonModule,
             TranslateModule] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SpeechRecognitionModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: SpeechRecognitionModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [SpeechRecognitionComponent],

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

@@ -38,10 +38,10 @@ class SplitButtonComponent {
     _closeDropdown() {
         this.open = false;
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SplitButtonComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: SplitButtonComponent, selector: "s-split-button", inputs: { disabled: "disabled", iconClass: "iconClass", label: "label", type: "type", options: "options" }, outputs: { buttonClicked: "buttonClicked" }, host: { listeners: { "document:click": "onClickout($event)" } }, ngImport: i0, template: "<div\n    class=\"split-button\"\n    [ngClass]=\"{\n        'split-button--primary': type === 'primary',\n        'split-button--secondary': type === 'secondary',\n        'split-button--default': type === 'default',\n        'split-button--disabled': disabled,\n    }\"\n>\n    <button\n        class=\"button\"\n        (click)=\"onButtonClick()\"\n    >\n        <span\n            class=\"button__icon\"\n            [ngClass]=\"iconClass\"\n        ></span>\n        <span class=\"button__label\">{{ label }}</span>\n    </button>\n    <button\n        class=\"dropdown\"\n        (click)=\"onDropdownClick()\"\n    >\n        <span\n            class=\"dropdown__icon\"\n            [ngClass]=\"{\n                far: true,\n                'fa-chevron-down': !open,\n                'fa-chevron-up': open,\n            }\"\n        >\n        </span>\n    </button>\n</div>\n\n@if (this.open) {\n    <ul class=\"options\">\n        @for (option of options; track option.title) {\n            <li (click)=\"onOptionClick(option)\">\n                {{ option.title }}\n            </li>\n        }\n    </ul>\n}\n", styles: [".split-button{display:flex;-webkit-user-select:none;user-select:none;max-height:35px}.split-button .button{align-items:center;border:none;border-radius:4px 0 0 4px;display:flex;padding:8px 8px 8px 12px;transition:all .3s ease-in-out}.split-button .button__icon{font-size:16px;padding:0 4px}.split-button .button__title{font-family:Open Sans,sans-serif;font-size:14px;font-weight:400;line-height:21px}.split-button .dropdown{align-items:center;border:none;border-left:1px solid #608190;border-radius:0 4px 4px 0;display:flex;justify-content:center;padding:12px 8px;transition:all .3s ease-in-out}.split-button--disabled{opacity:.5}.split-button--primary .button,.split-button--primary .dropdown{background-color:#428bca;color:#fff}.split-button--primary:not(.split-button--primary--disabled) .button,.split-button--primary:not(.split-button--primary--disabled) .dropdown{cursor:pointer}.split-button--primary:not(.split-button--primary--disabled) .button:hover,.split-button--primary:not(.split-button--primary--disabled) .dropdown:hover{background-color:#063951}.split-button--secondary .button,.split-button--secondary .dropdown{background-color:#7892a1;color:#fff}.split-button--secondary:not(.split-button--secondary--disabled) .button,.split-button--secondary:not(.split-button--secondary--disabled) .dropdown{cursor:pointer}.split-button--secondary:not(.split-button--secondary--disabled) .button:hover,.split-button--secondary:not(.split-button--secondary--disabled) .dropdown:hover{background-color:#697882}.split-button--default .button,.split-button--default .dropdown{background-color:unset;border:1px solid #d8d8d8;color:#333}.split-button--default:not(.split-button--default--disabled) .button,.split-button--default:not(.split-button--default--disabled) .dropdown{cursor:pointer}.split-button--default:not(.split-button--default--disabled) .button:hover,.split-button--default:not(.split-button--default--disabled) .dropdown:hover{background-color:#d8d8d8}.options{background-color:#fff;border-radius:4px;box-shadow:0 1px 5px #00000040;display:inline-block;list-style:none;margin:2px 0;padding:8px 0;position:absolute;-webkit-user-select:none;user-select:none;z-index:10}.options li{color:#333;cursor:pointer;font-family:Open Sans,sans-serif;font-weight:400;font-size:14px;line-height:21px;padding:8px 16px}.options li:hover{background-color:#d8d8d8}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: SplitButtonComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: SplitButtonComponent, selector: "s-split-button", inputs: { disabled: "disabled", iconClass: "iconClass", label: "label", type: "type", options: "options" }, outputs: { buttonClicked: "buttonClicked" }, host: { listeners: { "document:click": "onClickout($event)" } }, ngImport: i0, template: "<div\n    class=\"split-button\"\n    [ngClass]=\"{\n        'split-button--primary': type === 'primary',\n        'split-button--secondary': type === 'secondary',\n        'split-button--default': type === 'default',\n        'split-button--disabled': disabled,\n    }\"\n>\n    <button\n        class=\"button\"\n        (click)=\"onButtonClick()\"\n    >\n        <span\n            class=\"button__icon\"\n            [ngClass]=\"iconClass\"\n        ></span>\n        <span class=\"button__label\">{{ label }}</span>\n    </button>\n    <button\n        class=\"dropdown\"\n        (click)=\"onDropdownClick()\"\n    >\n        <span\n            class=\"dropdown__icon\"\n            [ngClass]=\"{\n                far: true,\n                'fa-chevron-down': !open,\n                'fa-chevron-up': open,\n            }\"\n        >\n        </span>\n    </button>\n</div>\n\n@if (this.open) {\n    <ul class=\"options\">\n        @for (option of options; track option.title) {\n            <li (click)=\"onOptionClick(option)\">\n                {{ option.title }}\n            </li>\n        }\n    </ul>\n}\n", styles: [".split-button{display:flex;-webkit-user-select:none;user-select:none;max-height:35px}.split-button .button{align-items:center;border:none;border-radius:4px 0 0 4px;display:flex;padding:8px 8px 8px 12px;transition:all .3s ease-in-out}.split-button .button__icon{font-size:16px;padding:0 4px}.split-button .button__title{font-family:Open Sans,sans-serif;font-size:14px;font-weight:400;line-height:21px}.split-button .dropdown{align-items:center;border:none;border-left:1px solid #608190;border-radius:0 4px 4px 0;display:flex;justify-content:center;padding:12px 8px;transition:all .3s ease-in-out}.split-button--disabled{opacity:.5}.split-button--primary .button,.split-button--primary .dropdown{background-color:#428bca;color:#fff}.split-button--primary:not(.split-button--primary--disabled) .button,.split-button--primary:not(.split-button--primary--disabled) .dropdown{cursor:pointer}.split-button--primary:not(.split-button--primary--disabled) .button:hover,.split-button--primary:not(.split-button--primary--disabled) .dropdown:hover{background-color:#063951}.split-button--secondary .button,.split-button--secondary .dropdown{background-color:#7892a1;color:#fff}.split-button--secondary:not(.split-button--secondary--disabled) .button,.split-button--secondary:not(.split-button--secondary--disabled) .dropdown{cursor:pointer}.split-button--secondary:not(.split-button--secondary--disabled) .button:hover,.split-button--secondary:not(.split-button--secondary--disabled) .dropdown:hover{background-color:#697882}.split-button--default .button,.split-button--default .dropdown{background-color:unset;border:1px solid #d8d8d8;color:#333}.split-button--default:not(.split-button--default--disabled) .button,.split-button--default:not(.split-button--default--disabled) .dropdown{cursor:pointer}.split-button--default:not(.split-button--default--disabled) .button:hover,.split-button--default:not(.split-button--default--disabled) .dropdown:hover{background-color:#d8d8d8}.options{background-color:#fff;border-radius:4px;box-shadow:0 1px 5px #00000040;display:inline-block;list-style:none;margin:2px 0;padding:8px 0;position:absolute;-webkit-user-select:none;user-select:none;z-index:10}.options li{color:#333;cursor:pointer;font-family:Open Sans,sans-serif;font-weight:400;font-size:14px;line-height:21px;padding:8px 16px}.options li:hover{background-color:#d8d8d8}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SplitButtonComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: SplitButtonComponent, decorators: [{
             type: Component,
             args: [{ selector: 's-split-button', template: "<div\n    class=\"split-button\"\n    [ngClass]=\"{\n        'split-button--primary': type === 'primary',\n        'split-button--secondary': type === 'secondary',\n        'split-button--default': type === 'default',\n        'split-button--disabled': disabled,\n    }\"\n>\n    <button\n        class=\"button\"\n        (click)=\"onButtonClick()\"\n    >\n        <span\n            class=\"button__icon\"\n            [ngClass]=\"iconClass\"\n        ></span>\n        <span class=\"button__label\">{{ label }}</span>\n    </button>\n    <button\n        class=\"dropdown\"\n        (click)=\"onDropdownClick()\"\n    >\n        <span\n            class=\"dropdown__icon\"\n            [ngClass]=\"{\n                far: true,\n                'fa-chevron-down': !open,\n                'fa-chevron-up': open,\n            }\"\n        >\n        </span>\n    </button>\n</div>\n\n@if (this.open) {\n    <ul class=\"options\">\n        @for (option of options; track option.title) {\n            <li (click)=\"onOptionClick(option)\">\n                {{ option.title }}\n            </li>\n        }\n    </ul>\n}\n", styles: [".split-button{display:flex;-webkit-user-select:none;user-select:none;max-height:35px}.split-button .button{align-items:center;border:none;border-radius:4px 0 0 4px;display:flex;padding:8px 8px 8px 12px;transition:all .3s ease-in-out}.split-button .button__icon{font-size:16px;padding:0 4px}.split-button .button__title{font-family:Open Sans,sans-serif;font-size:14px;font-weight:400;line-height:21px}.split-button .dropdown{align-items:center;border:none;border-left:1px solid #608190;border-radius:0 4px 4px 0;display:flex;justify-content:center;padding:12px 8px;transition:all .3s ease-in-out}.split-button--disabled{opacity:.5}.split-button--primary .button,.split-button--primary .dropdown{background-color:#428bca;color:#fff}.split-button--primary:not(.split-button--primary--disabled) .button,.split-button--primary:not(.split-button--primary--disabled) .dropdown{cursor:pointer}.split-button--primary:not(.split-button--primary--disabled) .button:hover,.split-button--primary:not(.split-button--primary--disabled) .dropdown:hover{background-color:#063951}.split-button--secondary .button,.split-button--secondary .dropdown{background-color:#7892a1;color:#fff}.split-button--secondary:not(.split-button--secondary--disabled) .button,.split-button--secondary:not(.split-button--secondary--disabled) .dropdown{cursor:pointer}.split-button--secondary:not(.split-button--secondary--disabled) .button:hover,.split-button--secondary:not(.split-button--secondary--disabled) .dropdown:hover{background-color:#697882}.split-button--default .button,.split-button--default .dropdown{background-color:unset;border:1px solid #d8d8d8;color:#333}.split-button--default:not(.split-button--default--disabled) .button,.split-button--default:not(.split-button--default--disabled) .dropdown{cursor:pointer}.split-button--default:not(.split-button--default--disabled) .button:hover,.split-button--default:not(.split-button--default--disabled) .dropdown:hover{background-color:#d8d8d8}.options{background-color:#fff;border-radius:4px;box-shadow:0 1px 5px #00000040;display:inline-block;list-style:none;margin:2px 0;padding:8px 0;position:absolute;-webkit-user-select:none;user-select:none;z-index:10}.options li{color:#333;cursor:pointer;font-family:Open Sans,sans-serif;font-weight:400;font-size:14px;line-height:21px;padding:8px 16px}.options li:hover{background-color:#d8d8d8}\n"] }]
         }], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { disabled: [{
@@ -65,11 +65,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
             }] } });
 
 class SplitButtonModule {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SplitButtonModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.13", ngImport: i0, type: SplitButtonModule, declarations: [SplitButtonComponent], imports: [CommonModule], exports: [SplitButtonComponent] });
-    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SplitButtonModule, imports: [CommonModule] });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: SplitButtonModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.14", ngImport: i0, type: SplitButtonModule, declarations: [SplitButtonComponent], imports: [CommonModule], exports: [SplitButtonComponent] });
+    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: SplitButtonModule, imports: [CommonModule] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SplitButtonModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: SplitButtonModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [CommonModule],

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

@@ -42,16 +42,16 @@ class StarRatingComponent {
         this.onChange(selectedIndex);
         this.onTouched(selectedIndex);
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: StarRatingComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: StarRatingComponent, isStandalone: true, selector: "s-star-rating", inputs: { selectedStar: { classPropertyName: "selectedStar", publicName: "selectedStar", isSignal: true, isRequired: false, transformFunction: null }, starsRange: { classPropertyName: "starsRange", publicName: "starsRange", isSignal: true, isRequired: false, transformFunction: null }, justifyContent: { classPropertyName: "justifyContent", publicName: "justifyContent", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { selectedStar: "selectedStarChange", disabled: "disabledChange" }, providers: [
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StarRatingComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: StarRatingComponent, isStandalone: true, selector: "s-star-rating", inputs: { selectedStar: { classPropertyName: "selectedStar", publicName: "selectedStar", isSignal: true, isRequired: false, transformFunction: null }, starsRange: { classPropertyName: "starsRange", publicName: "starsRange", isSignal: true, isRequired: false, transformFunction: null }, justifyContent: { classPropertyName: "justifyContent", publicName: "justifyContent", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { selectedStar: "selectedStarChange", disabled: "disabledChange" }, providers: [
             {
                 provide: NG_VALUE_ACCESSOR,
                 useExisting: StarRatingComponent,
                 multi: true,
             },
-        ], ngImport: i0, template: "@let justifyContentClassName = 'justify-' + justifyContent();\n<section [class]=\"justifyContentClassName\" class=\"flex gap-2\" [class.opacity-50]=\"disabled()\">\n    @for(item of elementsRender(); track item) {\n        @let isActivated = selectedStar() <= item;\n        <i\n            [class.fas]=\"!isActivated\"\n            [class.far]=\"isActivated\"\n            [class.cursor-pointer]=\"!disabled()\"\n            class=\"fa-star text-[#F5A319] cursor-pointer\"\n            (sInteractiveContent)=\"onSelectStar(item + 1)\">\n        </i>\n    }\n</section>\n", styles: [""], dependencies: [{ kind: "directive", type: InteractiveContentDirective, selector: "[sInteractiveContent]", inputs: ["focusable", "disabled"], outputs: ["sInteractiveContent"] }] });
+        ], ngImport: i0, template: "@let justifyContentClassName = 'justify-' + justifyContent();\n<section [class]=\"justifyContentClassName\" class=\"flex gap-2\" [class.opacity-50]=\"disabled()\">\n    @for(item of elementsRender(); track item) {\n        @let isActivated = selectedStar() <= item;\n        <i\n            [class.fas]=\"!isActivated\"\n            [class.far]=\"isActivated\"\n            [class.cursor-pointer]=\"!disabled()\"\n            class=\"fa-star text-[#F5A319] cursor-pointer\"\n            (sInteractiveContent)=\"onSelectStar(item + 1)\">\n        </i>\n    }\n</section>\n", styles: [""], dependencies: [{ kind: "directive", type: InteractiveContentDirective, selector: "[sInteractiveContent]", inputs: ["focusable", "disabled", "stopPropagation"], outputs: ["sInteractiveContent"] }] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: StarRatingComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StarRatingComponent, decorators: [{
             type: Component,
             args: [{ selector: 's-star-rating', standalone: true, imports: [InteractiveContentDirective], providers: [
                         {