@sapphire-ion/framework 1.2.52 → 1.2.54

package/esm2022/lib/components/inputs/input-textarea/input-textarea.component.mjs

@@ -57,18 +57,18 @@ export class InputTextareaComponent extends CustomInput {
         this.runValidation();
         requestAnimationFrame(() => this.resize());
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: InputTextareaComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.14", type: InputTextareaComponent, selector: "input-textarea", inputs: { configuration: { classPropertyName: "configuration", publicName: "configuration", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "input": "onInput()" } }, providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: InputTextareaComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: InputTextareaComponent, selector: "input-textarea", inputs: { configuration: { classPropertyName: "configuration", publicName: "configuration", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "input": "onInput()" } }, providers: [
             ...InputProviderFactory.GetProviders(InputTextareaComponent),
             { provide: CustomInput, useExisting: forwardRef(() => InputTextareaComponent) },
-        ], viewQueries: [{ propertyName: "input", first: true, predicate: ["textarea"], descendants: true }, { propertyName: "inputContainer", first: true, predicate: ["inputContainer"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<div \r\n  #inputContainer\r\n  class=\"input-container\" \r\n  (click)=\"setFocus($event)\"\r\n  [class.required]=\"required()\" \r\n  [class.submitted]=\"submitted()\" \r\n  [class.invalid]=\"invalid\" \r\n  [class.disabled]=\"disabled() || loading()\"\r\n  [class.loading]=\"loading()\"\r\n>\r\n  <div class=\"input-label\"> \r\n    <span class=\"truncate\">\r\n      {{label()}} \r\n    </span>\r\n  </div>\r\n  <textarea #textarea\r\n    [ngModel]=\"value()\" \r\n    (ngModelChange)=\"SetValue($event)\"\r\n    [disabled]=\"disabled() || loading()\"\r\n    [maxlength]=\"configuration().maxlength\"\r\n    (blur)=\"blur.emit($event)\"\r\n  >\r\n  </textarea>\r\n  <div class=\"loading-container\" [class.loading]=\"loading()\">\r\n    <ion-spinner></ion-spinner>\r\n  </div>\r\n</div>", styles: [".input-container{padding-right:.25rem!important}.loading-container{padding-top:.5rem;align-items:start!important}\n", "@property --input-color{syntax: \"<color>\"; initial-value: transparent; inherits: false;}.input-container{position:relative;--tw-scale-x: 1;--tw-scale-y: 1;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));cursor:text;border-radius:.75rem;padding:.25rem .75rem;--tw-shadow: 0 4px 6px -1px rgb(0 0 0 / .1), 0 2px 4px -2px rgb(0 0 0 / .1);--tw-shadow-colored: 0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow);transition:--input-color .2s ease-in-out,box-shadow .2s ease-in-out,opacity .2s ease-in-out,filter .2s ease-in-out;--color: var(--ion-color-dark);--input-color: var(--input-background, var(--ion-color-step-250));--shadow: 0 3px 4px -1px rgb(0 0 0 / .1);--inset-shadow: var(--input-color) 0px 1.75px 2px 0px inset;--focused-shadow: 0 0 1px 2px color-mix(in srgb, var(--ion-color-medium) 35%, transparent);box-shadow:var(--inset-shadow),var(--shadow);will-change:box-shadow,filter opacity;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;background:radial-gradient(ellipse at 0px top,hsl(from var(--input-color) h s l/.5),hsl(from var(--input-color) h s l/.4)),hsl(from var(--ion-color-light) h s l/.8)}.input-container:hover{--tw-brightness: brightness(.9);filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.input-container:focus-within,.input-container:focus,.input-container.manual-focus{box-shadow:var(--inset-shadow),var(--shadow),var(--focused-shadow);--tw-brightness: brightness(.9);filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.input-container .input-label{pointer-events:none;display:flex;height:1rem;width:100%;min-width:0px;max-width:100%;align-items:center;justify-content:flex-start;gap:.25rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.75rem;line-height:1rem;color:var(--color)}.input-container input,.input-container textarea{height:1.5rem;width:100%;border-radius:.375rem;background-color:transparent;font-size:.875rem;line-height:1.25rem;color:var(--ion-color-dark);outline:2px solid transparent;outline-offset:2px}.input-container.loading{cursor:wait!important}.input-container.required .input-label:after{content:\"*\";color:var(--ion-color-danger);vertical-align:bottom}.input-container.submitted.invalid{--input-color: color-mix(in srgb, var(--ion-color-danger) 50%, transparent)}.input-container.disabled{cursor:not-allowed;opacity:.5;--tw-brightness: brightness(1);filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.input-container.disabled *{pointer-events:none}.loading-container{position:absolute;pointer-events:none;width:100%;height:100%;top:0;left:0;display:flex;justify-content:end;align-items:center;padding-right:.5rem;will-change:opacity;transition:opacity .2s ease-in-out;overflow:hidden;opacity:0;z-index:10}.loading-container ion-spinner{will-change:auto;transition:transform .2s ease-in-out;transform:translateY(-100%)}.loading-container.loading{opacity:1}.loading-container.loading ion-spinner{transform:translateY(0)}ion-modal::part(content){border-radius:.75rem;border:1px solid var(--ion-color-step-250)}\n"], dependencies: [{ kind: "component", type: i1.IonSpinner, selector: "ion-spinner", inputs: ["color", "duration", "name", "paused"] }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] }); }
+        ], viewQueries: [{ propertyName: "input", first: true, predicate: ["textarea"], descendants: true }, { propertyName: "inputContainer", first: true, predicate: ["inputContainer"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<div \r\n  #inputContainer\r\n  class=\"input-container\" \r\n  (click)=\"setFocus($event)\"\r\n  [class.required]=\"required()\" \r\n  [class.submitted]=\"submitted()\" \r\n  [class.invalid]=\"invalid\" \r\n  [class.disabled]=\"disabled() || loading()\"\r\n  [class.loading]=\"loading()\"\r\n>\r\n  <div class=\"input-label\"> \r\n    <span class=\"truncate\">\r\n      {{label()}} \r\n    </span>\r\n  </div>\r\n  <textarea #textarea\r\n    [ngModel]=\"value()\" \r\n    (ngModelChange)=\"SetValue($event)\"\r\n    [disabled]=\"disabled() || loading()\"\r\n    [maxlength]=\"configuration().maxlength\"\r\n    (blur)=\"blur.emit($event)\"\r\n  >\r\n  </textarea>\r\n  <div class=\"loading-container\" [class.loading]=\"loading()\">\r\n    <ion-spinner></ion-spinner>\r\n  </div>\r\n</div>", styles: [".input-container{padding-right:.25rem!important}.loading-container{padding-top:.5rem;align-items:start!important}textarea::-webkit-scrollbar{width:10px}textarea::-webkit-scrollbar-track{background:transparent}textarea::-webkit-scrollbar-thumb{background-color:#ffffff40;border-radius:10px;border:2px solid transparent;background-clip:content-box}textarea::-webkit-scrollbar-thumb:hover{background-color:#fff6}\n", "@property --input-color{syntax: \"<color>\"; initial-value: transparent; inherits: false;}.input-container{position:relative;--tw-scale-x: 1;--tw-scale-y: 1;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));cursor:text;border-radius:.75rem;padding:.25rem .75rem;--tw-shadow: 0 4px 6px -1px rgb(0 0 0 / .1), 0 2px 4px -2px rgb(0 0 0 / .1);--tw-shadow-colored: 0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow);transition:--input-color .2s ease-in-out,box-shadow .2s ease-in-out,opacity .2s ease-in-out,filter .2s ease-in-out;--color: var(--ion-color-dark);--input-color: var(--input-background, var(--ion-color-step-250));--shadow: 0 3px 4px -1px rgb(0 0 0 / .1);--inset-shadow: var(--input-color) 0px 1.75px 2px 0px inset;--focused-shadow: 0 0 1px 2px color-mix(in srgb, var(--ion-color-medium) 35%, transparent);box-shadow:var(--inset-shadow),var(--shadow);will-change:box-shadow,filter opacity;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;background:radial-gradient(ellipse at 0px top,hsl(from var(--input-color) h s l/.5),hsl(from var(--input-color) h s l/.4)),hsl(from var(--ion-color-light) h s l/.8)}.input-container:hover{--tw-brightness: brightness(.9);filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.input-container:focus-within,.input-container:focus,.input-container.manual-focus{box-shadow:var(--inset-shadow),var(--shadow),var(--focused-shadow);--tw-brightness: brightness(.9);filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.input-container .input-label{pointer-events:none;display:flex;height:1rem;width:100%;min-width:0px;max-width:100%;align-items:center;justify-content:flex-start;gap:.25rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.75rem;line-height:1rem;color:var(--color)}.input-container input,.input-container textarea{height:1.5rem;width:100%;border-radius:.375rem;background-color:transparent;font-size:.875rem;line-height:1.25rem;color:var(--ion-color-dark);outline:2px solid transparent;outline-offset:2px}.input-container.loading{cursor:wait!important}.input-container.required .input-label:after{content:\"*\";color:var(--ion-color-danger);vertical-align:bottom}.input-container.submitted.invalid{--input-color: color-mix(in srgb, var(--ion-color-danger) 50%, transparent)}.input-container.disabled{cursor:not-allowed;opacity:.5;--tw-brightness: brightness(1);filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.input-container.disabled *{pointer-events:none}.loading-container{position:absolute;pointer-events:none;width:100%;height:100%;top:0;left:0;display:flex;justify-content:end;align-items:center;padding-right:.5rem;will-change:opacity;transition:opacity .2s ease-in-out;overflow:hidden;opacity:0;z-index:10}.loading-container ion-spinner{will-change:auto;transition:transform .2s ease-in-out;transform:translateY(-100%)}.loading-container.loading{opacity:1}.loading-container.loading ion-spinner{transform:translateY(0)}ion-modal::part(content){border-radius:.75rem;border:1px solid var(--ion-color-step-250)}\n"], dependencies: [{ kind: "component", type: i1.IonSpinner, selector: "ion-spinner", inputs: ["color", "duration", "name", "paused"] }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: InputTextareaComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: InputTextareaComponent, decorators: [{
             type: Component,
             args: [{ selector: 'input-textarea', providers: [
                         ...InputProviderFactory.GetProviders(InputTextareaComponent),
                         { provide: CustomInput, useExisting: forwardRef(() => InputTextareaComponent) },
-                    ], template: "<div \r\n  #inputContainer\r\n  class=\"input-container\" \r\n  (click)=\"setFocus($event)\"\r\n  [class.required]=\"required()\" \r\n  [class.submitted]=\"submitted()\" \r\n  [class.invalid]=\"invalid\" \r\n  [class.disabled]=\"disabled() || loading()\"\r\n  [class.loading]=\"loading()\"\r\n>\r\n  <div class=\"input-label\"> \r\n    <span class=\"truncate\">\r\n      {{label()}} \r\n    </span>\r\n  </div>\r\n  <textarea #textarea\r\n    [ngModel]=\"value()\" \r\n    (ngModelChange)=\"SetValue($event)\"\r\n    [disabled]=\"disabled() || loading()\"\r\n    [maxlength]=\"configuration().maxlength\"\r\n    (blur)=\"blur.emit($event)\"\r\n  >\r\n  </textarea>\r\n  <div class=\"loading-container\" [class.loading]=\"loading()\">\r\n    <ion-spinner></ion-spinner>\r\n  </div>\r\n</div>", styles: [".input-container{padding-right:.25rem!important}.loading-container{padding-top:.5rem;align-items:start!important}\n", "@property --input-color{syntax: \"<color>\"; initial-value: transparent; inherits: false;}.input-container{position:relative;--tw-scale-x: 1;--tw-scale-y: 1;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));cursor:text;border-radius:.75rem;padding:.25rem .75rem;--tw-shadow: 0 4px 6px -1px rgb(0 0 0 / .1), 0 2px 4px -2px rgb(0 0 0 / .1);--tw-shadow-colored: 0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow);transition:--input-color .2s ease-in-out,box-shadow .2s ease-in-out,opacity .2s ease-in-out,filter .2s ease-in-out;--color: var(--ion-color-dark);--input-color: var(--input-background, var(--ion-color-step-250));--shadow: 0 3px 4px -1px rgb(0 0 0 / .1);--inset-shadow: var(--input-color) 0px 1.75px 2px 0px inset;--focused-shadow: 0 0 1px 2px color-mix(in srgb, var(--ion-color-medium) 35%, transparent);box-shadow:var(--inset-shadow),var(--shadow);will-change:box-shadow,filter opacity;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;background:radial-gradient(ellipse at 0px top,hsl(from var(--input-color) h s l/.5),hsl(from var(--input-color) h s l/.4)),hsl(from var(--ion-color-light) h s l/.8)}.input-container:hover{--tw-brightness: brightness(.9);filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.input-container:focus-within,.input-container:focus,.input-container.manual-focus{box-shadow:var(--inset-shadow),var(--shadow),var(--focused-shadow);--tw-brightness: brightness(.9);filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.input-container .input-label{pointer-events:none;display:flex;height:1rem;width:100%;min-width:0px;max-width:100%;align-items:center;justify-content:flex-start;gap:.25rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.75rem;line-height:1rem;color:var(--color)}.input-container input,.input-container textarea{height:1.5rem;width:100%;border-radius:.375rem;background-color:transparent;font-size:.875rem;line-height:1.25rem;color:var(--ion-color-dark);outline:2px solid transparent;outline-offset:2px}.input-container.loading{cursor:wait!important}.input-container.required .input-label:after{content:\"*\";color:var(--ion-color-danger);vertical-align:bottom}.input-container.submitted.invalid{--input-color: color-mix(in srgb, var(--ion-color-danger) 50%, transparent)}.input-container.disabled{cursor:not-allowed;opacity:.5;--tw-brightness: brightness(1);filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.input-container.disabled *{pointer-events:none}.loading-container{position:absolute;pointer-events:none;width:100%;height:100%;top:0;left:0;display:flex;justify-content:end;align-items:center;padding-right:.5rem;will-change:opacity;transition:opacity .2s ease-in-out;overflow:hidden;opacity:0;z-index:10}.loading-container ion-spinner{will-change:auto;transition:transform .2s ease-in-out;transform:translateY(-100%)}.loading-container.loading{opacity:1}.loading-container.loading ion-spinner{transform:translateY(0)}ion-modal::part(content){border-radius:.75rem;border:1px solid var(--ion-color-step-250)}\n"] }]
+                    ], template: "<div \r\n  #inputContainer\r\n  class=\"input-container\" \r\n  (click)=\"setFocus($event)\"\r\n  [class.required]=\"required()\" \r\n  [class.submitted]=\"submitted()\" \r\n  [class.invalid]=\"invalid\" \r\n  [class.disabled]=\"disabled() || loading()\"\r\n  [class.loading]=\"loading()\"\r\n>\r\n  <div class=\"input-label\"> \r\n    <span class=\"truncate\">\r\n      {{label()}} \r\n    </span>\r\n  </div>\r\n  <textarea #textarea\r\n    [ngModel]=\"value()\" \r\n    (ngModelChange)=\"SetValue($event)\"\r\n    [disabled]=\"disabled() || loading()\"\r\n    [maxlength]=\"configuration().maxlength\"\r\n    (blur)=\"blur.emit($event)\"\r\n  >\r\n  </textarea>\r\n  <div class=\"loading-container\" [class.loading]=\"loading()\">\r\n    <ion-spinner></ion-spinner>\r\n  </div>\r\n</div>", styles: [".input-container{padding-right:.25rem!important}.loading-container{padding-top:.5rem;align-items:start!important}textarea::-webkit-scrollbar{width:10px}textarea::-webkit-scrollbar-track{background:transparent}textarea::-webkit-scrollbar-thumb{background-color:#ffffff40;border-radius:10px;border:2px solid transparent;background-clip:content-box}textarea::-webkit-scrollbar-thumb:hover{background-color:#fff6}\n", "@property --input-color{syntax: \"<color>\"; initial-value: transparent; inherits: false;}.input-container{position:relative;--tw-scale-x: 1;--tw-scale-y: 1;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));cursor:text;border-radius:.75rem;padding:.25rem .75rem;--tw-shadow: 0 4px 6px -1px rgb(0 0 0 / .1), 0 2px 4px -2px rgb(0 0 0 / .1);--tw-shadow-colored: 0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow);transition:--input-color .2s ease-in-out,box-shadow .2s ease-in-out,opacity .2s ease-in-out,filter .2s ease-in-out;--color: var(--ion-color-dark);--input-color: var(--input-background, var(--ion-color-step-250));--shadow: 0 3px 4px -1px rgb(0 0 0 / .1);--inset-shadow: var(--input-color) 0px 1.75px 2px 0px inset;--focused-shadow: 0 0 1px 2px color-mix(in srgb, var(--ion-color-medium) 35%, transparent);box-shadow:var(--inset-shadow),var(--shadow);will-change:box-shadow,filter opacity;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;background:radial-gradient(ellipse at 0px top,hsl(from var(--input-color) h s l/.5),hsl(from var(--input-color) h s l/.4)),hsl(from var(--ion-color-light) h s l/.8)}.input-container:hover{--tw-brightness: brightness(.9);filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.input-container:focus-within,.input-container:focus,.input-container.manual-focus{box-shadow:var(--inset-shadow),var(--shadow),var(--focused-shadow);--tw-brightness: brightness(.9);filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.input-container .input-label{pointer-events:none;display:flex;height:1rem;width:100%;min-width:0px;max-width:100%;align-items:center;justify-content:flex-start;gap:.25rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.75rem;line-height:1rem;color:var(--color)}.input-container input,.input-container textarea{height:1.5rem;width:100%;border-radius:.375rem;background-color:transparent;font-size:.875rem;line-height:1.25rem;color:var(--ion-color-dark);outline:2px solid transparent;outline-offset:2px}.input-container.loading{cursor:wait!important}.input-container.required .input-label:after{content:\"*\";color:var(--ion-color-danger);vertical-align:bottom}.input-container.submitted.invalid{--input-color: color-mix(in srgb, var(--ion-color-danger) 50%, transparent)}.input-container.disabled{cursor:not-allowed;opacity:.5;--tw-brightness: brightness(1);filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.input-container.disabled *{pointer-events:none}.loading-container{position:absolute;pointer-events:none;width:100%;height:100%;top:0;left:0;display:flex;justify-content:end;align-items:center;padding-right:.5rem;will-change:opacity;transition:opacity .2s ease-in-out;overflow:hidden;opacity:0;z-index:10}.loading-container ion-spinner{will-change:auto;transition:transform .2s ease-in-out;transform:translateY(-100%)}.loading-container.loading{opacity:1}.loading-container.loading ion-spinner{transform:translateY(0)}ion-modal::part(content){border-radius:.75rem;border:1px solid var(--ion-color-step-250)}\n"] }]
         }], ctorParameters: () => [], propDecorators: { input: [{
                 type: ViewChild,
                 args: ['textarea']

package/esm2022/lib/components/inputs/input-textarea/input-textarea.configuration.mjs

@@ -1,7 +1,7 @@
 import { InputStringConfiguration, InputStringType } from "../input-string/input-string.configuration";
 export class InputTextAreaConfiguration extends InputStringConfiguration {
-    constructor(maxlength = 255, autoGrow = false) {
+    constructor(maxlength = 2000, autoGrow = false) {
         super(InputStringType.Text, maxlength, autoGrow);
     }
 }
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5wdXQtdGV4dGFyZWEuY29uZmlndXJhdGlvbi5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uL3NyYy9saWIvY29tcG9uZW50cy9pbnB1dHMvaW5wdXQtdGV4dGFyZWEvaW5wdXQtdGV4dGFyZWEuY29uZmlndXJhdGlvbi50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsd0JBQXdCLEVBQUUsZUFBZSxFQUFFLE1BQU0sNENBQTRDLENBQUM7QUFFdkcsTUFBTSxPQUFPLDBCQUEyQixTQUFRLHdCQUF3QjtJQUN0RSxZQUFZLFlBQW9CLEdBQUcsRUFBRSxXQUFvQixLQUFLO1FBQzVELEtBQUssQ0FBQyxlQUFlLENBQUMsSUFBSSxFQUFFLFNBQVMsRUFBRSxRQUFRLENBQUMsQ0FBQztJQUNuRCxDQUFDO0NBQ0YiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBJbnB1dFN0cmluZ0NvbmZpZ3VyYXRpb24sIElucHV0U3RyaW5nVHlwZSB9IGZyb20gXCIuLi9pbnB1dC1zdHJpbmcvaW5wdXQtc3RyaW5nLmNvbmZpZ3VyYXRpb25cIjtcclxuXHJcbmV4cG9ydCBjbGFzcyBJbnB1dFRleHRBcmVhQ29uZmlndXJhdGlvbiBleHRlbmRzIElucHV0U3RyaW5nQ29uZmlndXJhdGlvbntcclxuICBjb25zdHJ1Y3RvcihtYXhsZW5ndGg6IG51bWJlciA9IDI1NSwgYXV0b0dyb3c6IGJvb2xlYW4gPSBmYWxzZSl7XHJcbiAgICBzdXBlcihJbnB1dFN0cmluZ1R5cGUuVGV4dCwgbWF4bGVuZ3RoLCBhdXRvR3Jvdyk7XHJcbiAgfVxyXG59Il19
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5wdXQtdGV4dGFyZWEuY29uZmlndXJhdGlvbi5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uL3NyYy9saWIvY29tcG9uZW50cy9pbnB1dHMvaW5wdXQtdGV4dGFyZWEvaW5wdXQtdGV4dGFyZWEuY29uZmlndXJhdGlvbi50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsd0JBQXdCLEVBQUUsZUFBZSxFQUFFLE1BQU0sNENBQTRDLENBQUM7QUFFdkcsTUFBTSxPQUFPLDBCQUEyQixTQUFRLHdCQUF3QjtJQUN0RSxZQUFZLFlBQW9CLElBQUksRUFBRSxXQUFvQixLQUFLO1FBQzdELEtBQUssQ0FBQyxlQUFlLENBQUMsSUFBSSxFQUFFLFNBQVMsRUFBRSxRQUFRLENBQUMsQ0FBQztJQUNuRCxDQUFDO0NBQ0YiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBJbnB1dFN0cmluZ0NvbmZpZ3VyYXRpb24sIElucHV0U3RyaW5nVHlwZSB9IGZyb20gXCIuLi9pbnB1dC1zdHJpbmcvaW5wdXQtc3RyaW5nLmNvbmZpZ3VyYXRpb25cIjtcclxuXHJcbmV4cG9ydCBjbGFzcyBJbnB1dFRleHRBcmVhQ29uZmlndXJhdGlvbiBleHRlbmRzIElucHV0U3RyaW5nQ29uZmlndXJhdGlvbntcclxuICBjb25zdHJ1Y3RvcihtYXhsZW5ndGg6IG51bWJlciA9IDIwMDAsIGF1dG9Hcm93OiBib29sZWFuID0gZmFsc2Upe1xyXG4gICAgc3VwZXIoSW5wdXRTdHJpbmdUeXBlLlRleHQsIG1heGxlbmd0aCwgYXV0b0dyb3cpO1xyXG4gIH1cclxufSJdfQ==

package/esm2022/lib/components/inputs/inputs.module.mjs

@@ -48,8 +48,8 @@ const lstComponents = [
     DownloadButtonComponent,
 ];
 export class InputsModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: InputsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.14", ngImport: i0, type: InputsModule, declarations: [InputBoolComponent,
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: InputsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.13", ngImport: i0, type: InputsModule, declarations: [InputBoolComponent,
             InputCepComponent,
             InputColorComponent,
             InputCpfCnpjComponent,
@@ -91,7 +91,7 @@ export class InputsModule {
             InputTelefoneComponent,
             InputTextareaComponent,
             DownloadButtonComponent] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: InputsModule, providers: [
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: InputsModule, providers: [
             { provide: DateAdapter, useClass: MomentDateAdapter, deps: [MAT_DATE_LOCALE] },
             { provide: MAT_DATE_FORMATS, useValue: MAT_MOMENT_DATE_FORMATS },
         ], imports: [IonicModule,
@@ -105,7 +105,7 @@ export class InputsModule {
             MatDatepickerModule,
             MatCardModule] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: InputsModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: InputsModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [...lstComponents],

package/esm2022/lib/components/loading/loading.component.mjs

@@ -18,10 +18,10 @@ export class LoadingComponent {
         this.loading = true;
     }
     ngOnInit() { }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: LoadingComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: LoadingComponent, isStandalone: true, selector: "loading", inputs: { text: "text", type: "type", loading: "loading" }, ngImport: i0, template: "@switch (type) {\r\n  @case (1) {\r\n    <div class=\"w-full text-center h-16 flex items-center justify-center\">\r\n      <div class=\"flex items-center justify-center\">\r\n        <ion-spinner></ion-spinner>\r\n      </div>\r\n      @if(text){\r\n        <span>{{text}}</span>\r\n      }\r\n    </div>\r\n  }\r\n  @case (2) {\r\n    <div class=\"w-full text-center h-16 flex items-center justify-center\">\r\n      <div class=\"flex items-center justify-center\">\r\n        <ion-spinner></ion-spinner> \r\n        @if (text) {\r\n          <span class=\"ml-3\">{{text}}</span>\r\n        }\r\n      </div>\r\n    </div>\r\n  }\r\n  @case (3) {\r\n    <div class=\"absolute top-0 left-0 size-full opacity-0 -z-50 default-transition -translate-y-12 flex items-center justify-center !translucid-background\" \r\n      [ngClass]=\"{'!z-20 !opacity-100 !translate-y-0': loading}\">\r\n      <loading [type]=\"2\" [text]=\"text\"></loading>   \r\n    </div>\r\n  }\r\n}", styles: [""], dependencies: [{ kind: "component", type: LoadingComponent, selector: "loading", inputs: ["text", "type", "loading"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: IonicModule }, { kind: "component", type: i2.IonSpinner, selector: "ion-spinner", inputs: ["color", "duration", "name", "paused"] }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: LoadingComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: LoadingComponent, isStandalone: true, selector: "loading", inputs: { text: "text", type: "type", loading: "loading" }, ngImport: i0, template: "@switch (type) {\r\n  @case (1) {\r\n    <div class=\"w-full text-center h-16 flex items-center justify-center\">\r\n      <div class=\"flex items-center justify-center\">\r\n        <ion-spinner></ion-spinner>\r\n      </div>\r\n      @if(text){\r\n        <span>{{text}}</span>\r\n      }\r\n    </div>\r\n  }\r\n  @case (2) {\r\n    <div class=\"w-full text-center h-16 flex items-center justify-center\">\r\n      <div class=\"flex items-center justify-center\">\r\n        <ion-spinner></ion-spinner> \r\n        @if (text) {\r\n          <span class=\"ml-3\">{{text}}</span>\r\n        }\r\n      </div>\r\n    </div>\r\n  }\r\n  @case (3) {\r\n    <div class=\"absolute top-0 left-0 size-full opacity-0 -z-50 default-transition -translate-y-12 flex items-center justify-center !translucid-background\" \r\n      [ngClass]=\"{'!z-20 !opacity-100 !translate-y-0': loading}\">\r\n      <loading [type]=\"2\" [text]=\"text\"></loading>   \r\n    </div>\r\n  }\r\n}", styles: [""], dependencies: [{ kind: "component", type: LoadingComponent, selector: "loading", inputs: ["text", "type", "loading"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: IonicModule }, { kind: "component", type: i2.IonSpinner, selector: "ion-spinner", inputs: ["color", "duration", "name", "paused"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: LoadingComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: LoadingComponent, decorators: [{
             type: Component,
             args: [{ standalone: true, imports: [CommonModule, IonicModule], selector: 'loading', template: "@switch (type) {\r\n  @case (1) {\r\n    <div class=\"w-full text-center h-16 flex items-center justify-center\">\r\n      <div class=\"flex items-center justify-center\">\r\n        <ion-spinner></ion-spinner>\r\n      </div>\r\n      @if(text){\r\n        <span>{{text}}</span>\r\n      }\r\n    </div>\r\n  }\r\n  @case (2) {\r\n    <div class=\"w-full text-center h-16 flex items-center justify-center\">\r\n      <div class=\"flex items-center justify-center\">\r\n        <ion-spinner></ion-spinner> \r\n        @if (text) {\r\n          <span class=\"ml-3\">{{text}}</span>\r\n        }\r\n      </div>\r\n    </div>\r\n  }\r\n  @case (3) {\r\n    <div class=\"absolute top-0 left-0 size-full opacity-0 -z-50 default-transition -translate-y-12 flex items-center justify-center !translucid-background\" \r\n      [ngClass]=\"{'!z-20 !opacity-100 !translate-y-0': loading}\">\r\n      <loading [type]=\"2\" [text]=\"text\"></loading>   \r\n    </div>\r\n  }\r\n}" }]
         }], ctorParameters: () => [], propDecorators: { text: [{

package/esm2022/lib/components/login/login-admin/login-admin.component.mjs

@@ -36,10 +36,10 @@ export class LoginAdminComponent {
     SetApiUrl() {
         this.apiUrlProviderService.apiUrl = this.apiUrl;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: LoginAdminComponent, deps: [{ token: i1.ApiUrlProviderService }, { token: i2.AuthService }, { token: i3.UsuarioService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: LoginAdminComponent, isStandalone: true, selector: "login-admin", ngImport: i0, template: "@if (this.authService.isAdmin || !this.apiUrlProviderService.production) {\r\n  <ion-button (click)=\"adminPopover.present($event)\" fill=\"outline\" class=\"aspect-square h-8 z-50\" size=\"small\">\r\n    <ion-icon name=\"shield\" slot=\"icon-only\"></ion-icon>\r\n  </ion-button>\r\n  <ion-popover id=\"admin-popover\" #adminPopover>\r\n    <ng-template>\r\n      <ion-content class=\"p-2 bg-transparent\">\r\n      <div class=\"p-2\">\r\n        <input-select\r\n          [(ngModel)]=\"idUsuario\"\r\n          label=\"Logar como...\"\r\n          (change)=\"SelectUser($event)\"\r\n          [configuration]=\"selectUserConfiguration\"\r\n        ></input-select>\r\n  \r\n        <div class=\"rounded-2xl mt-2 overflow-hidden border border-primary/30\">\r\n          <div class=\"py-2 text-center border-b border-b-medium/30\">\r\n            <span class=\"font-poppins\"> API </span>\r\n          </div>\r\n          <ion-item lines=\"none\" style=\"--border-width: 0 !important;\">\r\n            <ion-input [(ngModel)]=\"apiUrl\" (ngModelChange)=\"SetApiUrl()\"></ion-input>\r\n          </ion-item>\r\n        </div>\r\n      </div>\r\n      </ion-content>\r\n    </ng-template>\r\n  </ion-popover>\r\n}", styles: ["#admin-popover{--width: 17rem}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: IonicModule }, { kind: "component", type: i4.IonButton, selector: "ion-button", inputs: ["buttonType", "color", "disabled", "download", "expand", "fill", "form", "href", "mode", "rel", "routerAnimation", "routerDirection", "shape", "size", "strong", "target", "type"] }, { kind: "component", type: i4.IonContent, selector: "ion-content", inputs: ["color", "fixedSlotPlacement", "forceOverscroll", "fullscreen", "scrollEvents", "scrollX", "scrollY"] }, { kind: "component", type: i4.IonIcon, selector: "ion-icon", inputs: ["color", "flipRtl", "icon", "ios", "lazy", "md", "mode", "name", "sanitize", "size", "src"] }, { kind: "component", type: i4.IonInput, selector: "ion-input", inputs: ["autocapitalize", "autocomplete", "autocorrect", "autofocus", "clearInput", "clearInputIcon", "clearOnEdit", "color", "counter", "counterFormatter", "debounce", "disabled", "enterkeyhint", "errorText", "fill", "helperText", "inputmode", "label", "labelPlacement", "max", "maxlength", "min", "minlength", "mode", "multiple", "name", "pattern", "placeholder", "readonly", "required", "shape", "spellcheck", "step", "type", "value"] }, { kind: "component", type: i4.IonItem, selector: "ion-item", inputs: ["button", "color", "detail", "detailIcon", "disabled", "download", "href", "lines", "mode", "rel", "routerAnimation", "routerDirection", "target", "type"] }, { kind: "component", type: i4.IonPopover, selector: "ion-popover" }, { kind: "directive", type: i4.TextValueAccessor, selector: "ion-input:not([type=number]),ion-input-otp[type=text],ion-textarea,ion-searchbar" }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "ngmodule", type: InputsModule }, { kind: "component", type: i6.InputSelectComponent, selector: "input-select", inputs: ["items", "configuration"], outputs: ["itemsChange"] }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: LoginAdminComponent, deps: [{ token: i1.ApiUrlProviderService }, { token: i2.AuthService }, { token: i3.UsuarioService }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: LoginAdminComponent, isStandalone: true, selector: "login-admin", ngImport: i0, template: "@if (this.authService.isAdmin || !this.apiUrlProviderService.production) {\r\n  <ion-button (click)=\"adminPopover.present($event)\" fill=\"outline\" class=\"aspect-square h-8 z-50\" size=\"small\">\r\n    <ion-icon name=\"shield\" slot=\"icon-only\"></ion-icon>\r\n  </ion-button>\r\n  <ion-popover id=\"admin-popover\" #adminPopover>\r\n    <ng-template>\r\n      <ion-content class=\"p-2 bg-transparent\">\r\n      <div class=\"p-2\">\r\n        <input-select\r\n          [(ngModel)]=\"idUsuario\"\r\n          label=\"Logar como...\"\r\n          (change)=\"SelectUser($event)\"\r\n          [configuration]=\"selectUserConfiguration\"\r\n        ></input-select>\r\n  \r\n        <div class=\"rounded-2xl mt-2 overflow-hidden border border-primary/30\">\r\n          <div class=\"py-2 text-center border-b border-b-medium/30\">\r\n            <span class=\"font-poppins\"> API </span>\r\n          </div>\r\n          <ion-item lines=\"none\" style=\"--border-width: 0 !important;\">\r\n            <ion-input [(ngModel)]=\"apiUrl\" (ngModelChange)=\"SetApiUrl()\"></ion-input>\r\n          </ion-item>\r\n        </div>\r\n      </div>\r\n      </ion-content>\r\n    </ng-template>\r\n  </ion-popover>\r\n}", styles: ["#admin-popover{--width: 17rem}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: IonicModule }, { kind: "component", type: i4.IonButton, selector: "ion-button", inputs: ["buttonType", "color", "disabled", "download", "expand", "fill", "form", "href", "mode", "rel", "routerAnimation", "routerDirection", "shape", "size", "strong", "target", "type"] }, { kind: "component", type: i4.IonContent, selector: "ion-content", inputs: ["color", "fixedSlotPlacement", "forceOverscroll", "fullscreen", "scrollEvents", "scrollX", "scrollY"] }, { kind: "component", type: i4.IonIcon, selector: "ion-icon", inputs: ["color", "flipRtl", "icon", "ios", "lazy", "md", "mode", "name", "sanitize", "size", "src"] }, { kind: "component", type: i4.IonInput, selector: "ion-input", inputs: ["autocapitalize", "autocomplete", "autocorrect", "autofocus", "clearInput", "clearInputIcon", "clearOnEdit", "color", "counter", "counterFormatter", "debounce", "disabled", "enterkeyhint", "errorText", "fill", "helperText", "inputmode", "label", "labelPlacement", "max", "maxlength", "min", "minlength", "mode", "multiple", "name", "pattern", "placeholder", "readonly", "required", "shape", "spellcheck", "step", "type", "value"] }, { kind: "component", type: i4.IonItem, selector: "ion-item", inputs: ["button", "color", "detail", "detailIcon", "disabled", "download", "href", "lines", "mode", "rel", "routerAnimation", "routerDirection", "target", "type"] }, { kind: "component", type: i4.IonPopover, selector: "ion-popover" }, { kind: "directive", type: i4.TextValueAccessor, selector: "ion-input:not([type=number]),ion-input-otp[type=text],ion-textarea,ion-searchbar" }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "ngmodule", type: InputsModule }, { kind: "component", type: i6.InputSelectComponent, selector: "input-select", inputs: ["items", "configuration"], outputs: ["itemsChange"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: LoginAdminComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: LoginAdminComponent, decorators: [{
             type: Component,
             args: [{ standalone: true, imports: [
                         CommonModule,

package/esm2022/lib/components/login/login.component.mjs

@@ -76,10 +76,10 @@ export class DefaultLoginComponent {
             this.loading = false;
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: DefaultLoginComponent, deps: [{ token: i1.FormBuilder }, { token: i2.GenericService }, { token: i3.NavController }, { token: i4.AuthService }, { token: i5.ApiUrlProviderService }, { token: i6.EnvironmentService }, { token: i7.Router }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: DefaultLoginComponent, isStandalone: true, selector: "login", outputs: { OnLogin: "OnLogin" }, host: { listeners: { "window:keydown": "Login($event)" } }, viewQueries: [{ propertyName: "loginContainer", first: true, predicate: ["loginContainer"], descendants: true }], ngImport: i0, template: "<!-- <div class=\"size-full flex justify-center items-center relative\">\r\n  <div class=\"landscape:w-4/5 portrait:w-full landscape:h-2/3 portrait:h-full landscape:max-w-[60rem] translucid-border landscape:rounded-3xl landscape:backdrop-blur-xl overflow-hidden\">\r\n    <div class=\"size-full flex portrait:flex-col\" style=\"background-color: color-mix(in srgb, var(--ion-color-light) 20%, transparent 80%);\">\r\n      <div class=\"shrink-0 w-96 portrait:w-full portrait:h-32 h-full p-3\">\r\n        <div class=\"rounded-2xl size-full overflow-x-hidden\">\r\n          <ng-content class=\"size-full\"></ng-content>\r\n        </div>\r\n      </div>\r\n      <div class=\"grow flex items-center justify-center h-full py-3 pr-3 portrait:pl-3\">\r\n        <div class=\"w-96 h-full flex flex-col items-center justify-center gap-2\" *ngIf=\"frm\" [formGroup]=\"frm\">\r\n\r\n          <ion-text class=\"text-5xl my-10 portrait:mt-[-5rem]\"> Login </ion-text>\r\n\r\n          <ion-card class=\"w-full backdrop-blur-xl\">\r\n            <ion-card-content>\r\n              <ion-item lines=\"none\" label=\"Senha\" labelPlacement=\"stacked\" class=\"rounded-2xl my-3 w-full\">\r\n                <ion-icon name=\"person\" slot=\"start\"></ion-icon>\r\n                <ion-input placeholder=\"Usu\u00E1rio / User\" formControlName=\"apelido\"></ion-input>\r\n              </ion-item>\r\n            </ion-card-content>\r\n          </ion-card>\r\n\r\n          <ion-card class=\"w-full backdrop-blur-xl\"> \r\n            <ion-card-content>\r\n              <ion-item lines=\"none\" class=\"rounded-2xl my-3 w-full\">\r\n                <ion-icon name=\"lock-closed\" slot=\"start\"></ion-icon>\r\n                <ion-input type=\"password\" formControlName=\"senha\" placeholder=\"Senha / Password\">\r\n                  <ion-input-password-toggle slot=\"end\"></ion-input-password-toggle>\r\n                </ion-input>\r\n              </ion-item>\r\n            </ion-card-content>\r\n          </ion-card>\r\n\r\n          <div class=\"w-full\">\r\n            <a href=\"\">Esqueceu a senha?</a>\r\n          </div>\r\n\r\n          <div class=\"flex w-full\">\r\n            <ion-button class=\"rounded-2xl shadow-xl default-transition w-full\" expand=\"block\" (click)=\"Login()\" [disabled]=\"loading\">\r\n              <ion-spinner class=\"default-transition\" [ngClass]=\"{'-translate-x-12 opacity-0 size-0': !loading, 'mr-2' : loading}\" slot=\"start\"></ion-spinner>\r\n              <ion-icon    class=\"default-transition\" [ngClass]=\"{'-translate-x-12 opacity-0 size-0':  loading}\" name=\"enter-outline\" slot=\"start\" ></ion-icon>\r\n              <span class=\"default-transition\" > Login </span>\r\n            </ion-button>\r\n\r\n            <ion-button class=\"shrink-0 aspect-square ml-3\" color=\"dark\" hidden>\r\n              <svg class=\"size-8\" slot=\"icon-only\" xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\" viewBox=\"0 0 32 32\" width=\"64\" height=\"64\"><defs><path id=\"A\" d=\"M44.5 20H24v8.5h11.8C34.7 33.9 30.1 37 24 37c-7.2 0-13-5.8-13-13s5.8-13 13-13c3.1 0 5.9 1.1 8.1 2.9l6.4-6.4C34.6 4.1 29.6 2 24 2 11.8 2 2 11.8 2 24s9.8 22 22 22c11 0 21-8 21-22 0-1.3-.2-2.7-.5-4z\"/></defs><clipPath id=\"B\"><use xlink:href=\"#A\"/></clipPath><g transform=\"matrix(.727273 0 0 .727273 -.954545 -1.45455)\"><path d=\"M0 37V11l17 13z\" clip-path=\"url(#B)\" fill=\"#fbbc05\"/><path d=\"M0 11l17 13 7-6.1L48 14V0H0z\" clip-path=\"url(#B)\" fill=\"#ea4335\"/><path d=\"M0 37l30-23 7.9 1L48 0v48H0z\" clip-path=\"url(#B)\" fill=\"#34a853\"/><path d=\"M48 48L17 24l-4-3 35-10z\" clip-path=\"url(#B)\" fill=\"#4285f4\"/></g></svg>\r\n            </ion-button>\r\n          </div>\r\n        </div>\r\n      </div>\r\n    </div>\r\n  </div>\r\n</div> -->\r\n\r\n<div #loginContainer class=\"size-full flex justify-center items-center relative portrait:p-4\">\r\n  <div class=\"landscape:w-4/5 landscape:h-2/3 landscape:xl:max-w-[60rem] portrait:size-full translucid-border backdrop-blur-xl rounded-3xl overflow-hidden\">\r\n    <div class=\"size-full flex portrait:flex-col\" style=\"background-color: color-mix(in srgb, var(--ion-color-light) 20%, transparent 80%);\">\r\n      <div class=\"shrink-0 w-96 portrait:w-full portrait:h-40 landscape:h-full p-2\">\r\n        <div class=\"size-full rounded-2xl overflow-hidden\">\r\n          <ng-content select=\"[slot=logo]\" class=\"size-full\"></ng-content>\r\n        </div>\r\n      </div>\r\n      <div class=\"shrink size-full flex flex-col items-center justify-center gap-3 px-10 relative\" *ngIf=\"frm\" [formGroup]=\"frm\">\r\n        <ion-text class=\"h-24 text-5xl\"> Login </ion-text>\r\n\r\n        <ion-card class=\"w-full backdrop-blur-xl\">\r\n          <ion-card-content>\r\n            <ion-item lines=\"none\" label=\"Senha\" labelPlacement=\"stacked\" class=\"rounded-2xl my-3 w-full\">\r\n              <ion-icon name=\"person\" slot=\"start\"></ion-icon>\r\n              <ion-input placeholder=\"Usu\u00E1rio / User\" formControlName=\"apelido\"></ion-input>\r\n            </ion-item>\r\n          </ion-card-content>\r\n        </ion-card>\r\n\r\n        <ion-card class=\"w-full backdrop-blur-xl\"> \r\n          <ion-card-content>\r\n            <ion-item lines=\"none\" class=\"rounded-2xl my-3 w-full\">\r\n              <ion-icon name=\"lock-closed\" slot=\"start\"></ion-icon>\r\n              <ion-input type=\"password\" formControlName=\"senha\" placeholder=\"Senha / Password\">\r\n                <ion-input-password-toggle slot=\"end\"></ion-input-password-toggle>\r\n              </ion-input>\r\n            </ion-item>\r\n          </ion-card-content>\r\n        </ion-card>\r\n\r\n        <div class=\"flex w-full\">\r\n          <ion-button class=\"transition-all rounded-2xl shadow-xl default-transition w-full\" expand=\"block\" (click)=\"Login()\" [disabled]=\"loading\">\r\n            <ion-spinner class=\"default-transition\" [ngClass]=\"{'-translate-x-12 opacity-0 size-0': !loading, 'mr-2' : loading}\" slot=\"start\"></ion-spinner>\r\n            <ion-icon    class=\"default-transition\" [ngClass]=\"{'-translate-x-12 opacity-0 size-0':  loading}\" name=\"enter-outline\" slot=\"start\" ></ion-icon>\r\n            <span class=\"default-transition\"> Login </span>\r\n          </ion-button>\r\n\r\n          <!-- <ion-button class=\"shrink-0 aspect-square ml-3\" color=\"dark\" hidden>\r\n            <svg class=\"size-8\" slot=\"icon-only\" xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\" viewBox=\"0 0 32 32\" width=\"64\" height=\"64\"><defs><path id=\"A\" d=\"M44.5 20H24v8.5h11.8C34.7 33.9 30.1 37 24 37c-7.2 0-13-5.8-13-13s5.8-13 13-13c3.1 0 5.9 1.1 8.1 2.9l6.4-6.4C34.6 4.1 29.6 2 24 2 11.8 2 2 11.8 2 24s9.8 22 22 22c11 0 21-8 21-22 0-1.3-.2-2.7-.5-4z\"/></defs><clipPath id=\"B\"><use xlink:href=\"#A\"/></clipPath><g transform=\"matrix(.727273 0 0 .727273 -.954545 -1.45455)\"><path d=\"M0 37V11l17 13z\" clip-path=\"url(#B)\" fill=\"#fbbc05\"/><path d=\"M0 11l17 13 7-6.1L48 14V0H0z\" clip-path=\"url(#B)\" fill=\"#ea4335\"/><path d=\"M0 37l30-23 7.9 1L48 0v48H0z\" clip-path=\"url(#B)\" fill=\"#34a853\"/><path d=\"M48 48L17 24l-4-3 35-10z\" clip-path=\"url(#B)\" fill=\"#4285f4\"/></g></svg>\r\n          </ion-button> -->\r\n        </div>\r\n\r\n        <div class=\"w-full\">\r\n          <ng-content select=\"[slot=end]\"></ng-content>\r\n        </div>\r\n      </div>\r\n    </div>\r\n  </div>\r\n</div>", styles: ["ion-card{margin:0;display:flex;align-items:center;justify-content:center;overflow:hidden;border-radius:1rem;--tw-shadow: 0 1px 2px 0 rgb(0 0 0 / .05);--tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow);transition-property:all;transition-duration:.3s;transition-timing-function:cubic-bezier(.4,0,.2,1);background:color-mix(in srgb,var(--ion-color-light) 15%,transparent 93%);border-bottom-color:var(--ion-color-medium);border-right-color:color-mix(in srgb,var(--ion-color-medium) 30%,transparent 70%);border-top-color:color-mix(in srgb,var(--ion-color-medium) 30%,transparent 70%);border-left-color:color-mix(in srgb,var(--ion-color-medium) 30%,transparent 70%);border-width:1px 1px 2px 1px}ion-card ion-card-content{padding:0}ion-card:hover{background:color-mix(in srgb,var(--ion-color-dark) 15%,transparent 93%)}ion-card.submitted.invalid{border-color:color-mix(in srgb,var(--ion-color-danger) 75%,transparent 25%)!important}ion-card ion-card-content{width:100%;height:100%;background-color:transparent;padding:0}ion-item{--background: transparent;margin:0}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i8.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i8.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: IonicModule }, { kind: "component", type: i3.IonButton, selector: "ion-button", inputs: ["buttonType", "color", "disabled", "download", "expand", "fill", "form", "href", "mode", "rel", "routerAnimation", "routerDirection", "shape", "size", "strong", "target", "type"] }, { kind: "component", type: i3.IonCard, selector: "ion-card", inputs: ["button", "color", "disabled", "download", "href", "mode", "rel", "routerAnimation", "routerDirection", "target", "type"] }, { kind: "component", type: i3.IonCardContent, selector: "ion-card-content", inputs: ["mode"] }, { kind: "component", type: i3.IonIcon, selector: "ion-icon", inputs: ["color", "flipRtl", "icon", "ios", "lazy", "md", "mode", "name", "sanitize", "size", "src"] }, { kind: "component", type: i3.IonInput, selector: "ion-input", inputs: ["autocapitalize", "autocomplete", "autocorrect", "autofocus", "clearInput", "clearInputIcon", "clearOnEdit", "color", "counter", "counterFormatter", "debounce", "disabled", "enterkeyhint", "errorText", "fill", "helperText", "inputmode", "label", "labelPlacement", "max", "maxlength", "min", "minlength", "mode", "multiple", "name", "pattern", "placeholder", "readonly", "required", "shape", "spellcheck", "step", "type", "value"] }, { kind: "component", type: i3.IonInputPasswordToggle, selector: "ion-input-password-toggle", inputs: ["color", "hideIcon", "mode", "showIcon"] }, { kind: "component", type: i3.IonItem, selector: "ion-item", inputs: ["button", "color", "detail", "detailIcon", "disabled", "download", "href", "lines", "mode", "rel", "routerAnimation", "routerDirection", "target", "type"] }, { kind: "component", type: i3.IonSpinner, selector: "ion-spinner", inputs: ["color", "duration", "name", "paused"] }, { kind: "component", type: i3.IonText, selector: "ion-text", inputs: ["color", "mode"] }, { kind: "directive", type: i3.TextValueAccessor, selector: "ion-input:not([type=number]),ion-input-otp[type=text],ion-textarea,ion-searchbar" }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: DefaultLoginComponent, deps: [{ token: i1.FormBuilder }, { token: i2.GenericService }, { token: i3.NavController }, { token: i4.AuthService }, { token: i5.ApiUrlProviderService }, { token: i6.EnvironmentService }, { token: i7.Router }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: DefaultLoginComponent, isStandalone: true, selector: "login", outputs: { OnLogin: "OnLogin" }, host: { listeners: { "window:keydown": "Login($event)" } }, viewQueries: [{ propertyName: "loginContainer", first: true, predicate: ["loginContainer"], descendants: true }], ngImport: i0, template: "<!-- <div class=\"size-full flex justify-center items-center relative\">\r\n  <div class=\"landscape:w-4/5 portrait:w-full landscape:h-2/3 portrait:h-full landscape:max-w-[60rem] translucid-border landscape:rounded-3xl landscape:backdrop-blur-xl overflow-hidden\">\r\n    <div class=\"size-full flex portrait:flex-col\" style=\"background-color: color-mix(in srgb, var(--ion-color-light) 20%, transparent 80%);\">\r\n      <div class=\"shrink-0 w-96 portrait:w-full portrait:h-32 h-full p-3\">\r\n        <div class=\"rounded-2xl size-full overflow-x-hidden\">\r\n          <ng-content class=\"size-full\"></ng-content>\r\n        </div>\r\n      </div>\r\n      <div class=\"grow flex items-center justify-center h-full py-3 pr-3 portrait:pl-3\">\r\n        <div class=\"w-96 h-full flex flex-col items-center justify-center gap-2\" *ngIf=\"frm\" [formGroup]=\"frm\">\r\n\r\n          <ion-text class=\"text-5xl my-10 portrait:mt-[-5rem]\"> Login </ion-text>\r\n\r\n          <ion-card class=\"w-full backdrop-blur-xl\">\r\n            <ion-card-content>\r\n              <ion-item lines=\"none\" label=\"Senha\" labelPlacement=\"stacked\" class=\"rounded-2xl my-3 w-full\">\r\n                <ion-icon name=\"person\" slot=\"start\"></ion-icon>\r\n                <ion-input placeholder=\"Usu\u00E1rio / User\" formControlName=\"apelido\"></ion-input>\r\n              </ion-item>\r\n            </ion-card-content>\r\n          </ion-card>\r\n\r\n          <ion-card class=\"w-full backdrop-blur-xl\"> \r\n            <ion-card-content>\r\n              <ion-item lines=\"none\" class=\"rounded-2xl my-3 w-full\">\r\n                <ion-icon name=\"lock-closed\" slot=\"start\"></ion-icon>\r\n                <ion-input type=\"password\" formControlName=\"senha\" placeholder=\"Senha / Password\">\r\n                  <ion-input-password-toggle slot=\"end\"></ion-input-password-toggle>\r\n                </ion-input>\r\n              </ion-item>\r\n            </ion-card-content>\r\n          </ion-card>\r\n\r\n          <div class=\"w-full\">\r\n            <a href=\"\">Esqueceu a senha?</a>\r\n          </div>\r\n\r\n          <div class=\"flex w-full\">\r\n            <ion-button class=\"rounded-2xl shadow-xl default-transition w-full\" expand=\"block\" (click)=\"Login()\" [disabled]=\"loading\">\r\n              <ion-spinner class=\"default-transition\" [ngClass]=\"{'-translate-x-12 opacity-0 size-0': !loading, 'mr-2' : loading}\" slot=\"start\"></ion-spinner>\r\n              <ion-icon    class=\"default-transition\" [ngClass]=\"{'-translate-x-12 opacity-0 size-0':  loading}\" name=\"enter-outline\" slot=\"start\" ></ion-icon>\r\n              <span class=\"default-transition\" > Login </span>\r\n            </ion-button>\r\n\r\n            <ion-button class=\"shrink-0 aspect-square ml-3\" color=\"dark\" hidden>\r\n              <svg class=\"size-8\" slot=\"icon-only\" xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\" viewBox=\"0 0 32 32\" width=\"64\" height=\"64\"><defs><path id=\"A\" d=\"M44.5 20H24v8.5h11.8C34.7 33.9 30.1 37 24 37c-7.2 0-13-5.8-13-13s5.8-13 13-13c3.1 0 5.9 1.1 8.1 2.9l6.4-6.4C34.6 4.1 29.6 2 24 2 11.8 2 2 11.8 2 24s9.8 22 22 22c11 0 21-8 21-22 0-1.3-.2-2.7-.5-4z\"/></defs><clipPath id=\"B\"><use xlink:href=\"#A\"/></clipPath><g transform=\"matrix(.727273 0 0 .727273 -.954545 -1.45455)\"><path d=\"M0 37V11l17 13z\" clip-path=\"url(#B)\" fill=\"#fbbc05\"/><path d=\"M0 11l17 13 7-6.1L48 14V0H0z\" clip-path=\"url(#B)\" fill=\"#ea4335\"/><path d=\"M0 37l30-23 7.9 1L48 0v48H0z\" clip-path=\"url(#B)\" fill=\"#34a853\"/><path d=\"M48 48L17 24l-4-3 35-10z\" clip-path=\"url(#B)\" fill=\"#4285f4\"/></g></svg>\r\n            </ion-button>\r\n          </div>\r\n        </div>\r\n      </div>\r\n    </div>\r\n  </div>\r\n</div> -->\r\n\r\n<div #loginContainer class=\"size-full flex justify-center items-center relative portrait:p-4\">\r\n  <div class=\"landscape:w-4/5 landscape:h-2/3 landscape:xl:max-w-[60rem] portrait:size-full translucid-border backdrop-blur-xl rounded-3xl overflow-hidden\">\r\n    <div class=\"size-full flex portrait:flex-col\" style=\"background-color: color-mix(in srgb, var(--ion-color-light) 20%, transparent 80%);\">\r\n      <div class=\"shrink-0 w-96 portrait:w-full portrait:h-40 landscape:h-full p-2\">\r\n        <div class=\"size-full rounded-2xl overflow-hidden\">\r\n          <ng-content select=\"[slot=logo]\" class=\"size-full\"></ng-content>\r\n        </div>\r\n      </div>\r\n      <div class=\"shrink size-full flex flex-col items-center justify-center gap-3 px-10 relative\" *ngIf=\"frm\" [formGroup]=\"frm\">\r\n        <ion-text class=\"h-24 text-5xl\"> Login </ion-text>\r\n\r\n        <ion-card class=\"w-full backdrop-blur-xl\">\r\n          <ion-card-content>\r\n            <ion-item lines=\"none\" label=\"Senha\" labelPlacement=\"stacked\" class=\"rounded-2xl my-3 w-full\">\r\n              <ion-icon name=\"person\" slot=\"start\"></ion-icon>\r\n              <ion-input placeholder=\"Usu\u00E1rio / User\" formControlName=\"apelido\"></ion-input>\r\n            </ion-item>\r\n          </ion-card-content>\r\n        </ion-card>\r\n\r\n        <ion-card class=\"w-full backdrop-blur-xl\"> \r\n          <ion-card-content>\r\n            <ion-item lines=\"none\" class=\"rounded-2xl my-3 w-full\">\r\n              <ion-icon name=\"lock-closed\" slot=\"start\"></ion-icon>\r\n              <ion-input type=\"password\" formControlName=\"senha\" placeholder=\"Senha / Password\">\r\n                <ion-input-password-toggle slot=\"end\"></ion-input-password-toggle>\r\n              </ion-input>\r\n            </ion-item>\r\n          </ion-card-content>\r\n        </ion-card>\r\n\r\n        <div class=\"flex w-full\">\r\n          <ion-button class=\"transition-all rounded-2xl shadow-xl default-transition w-full\" expand=\"block\" (click)=\"Login()\" [disabled]=\"loading\">\r\n            <ion-spinner class=\"default-transition\" [ngClass]=\"{'-translate-x-12 opacity-0 size-0': !loading, 'mr-2' : loading}\" slot=\"start\"></ion-spinner>\r\n            <ion-icon    class=\"default-transition\" [ngClass]=\"{'-translate-x-12 opacity-0 size-0':  loading}\" name=\"enter-outline\" slot=\"start\" ></ion-icon>\r\n            <span class=\"default-transition\"> Login </span>\r\n          </ion-button>\r\n\r\n          <!-- <ion-button class=\"shrink-0 aspect-square ml-3\" color=\"dark\" hidden>\r\n            <svg class=\"size-8\" slot=\"icon-only\" xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\" viewBox=\"0 0 32 32\" width=\"64\" height=\"64\"><defs><path id=\"A\" d=\"M44.5 20H24v8.5h11.8C34.7 33.9 30.1 37 24 37c-7.2 0-13-5.8-13-13s5.8-13 13-13c3.1 0 5.9 1.1 8.1 2.9l6.4-6.4C34.6 4.1 29.6 2 24 2 11.8 2 2 11.8 2 24s9.8 22 22 22c11 0 21-8 21-22 0-1.3-.2-2.7-.5-4z\"/></defs><clipPath id=\"B\"><use xlink:href=\"#A\"/></clipPath><g transform=\"matrix(.727273 0 0 .727273 -.954545 -1.45455)\"><path d=\"M0 37V11l17 13z\" clip-path=\"url(#B)\" fill=\"#fbbc05\"/><path d=\"M0 11l17 13 7-6.1L48 14V0H0z\" clip-path=\"url(#B)\" fill=\"#ea4335\"/><path d=\"M0 37l30-23 7.9 1L48 0v48H0z\" clip-path=\"url(#B)\" fill=\"#34a853\"/><path d=\"M48 48L17 24l-4-3 35-10z\" clip-path=\"url(#B)\" fill=\"#4285f4\"/></g></svg>\r\n          </ion-button> -->\r\n        </div>\r\n\r\n        <div class=\"w-full\">\r\n          <ng-content select=\"[slot=end]\"></ng-content>\r\n        </div>\r\n      </div>\r\n    </div>\r\n  </div>\r\n</div>", styles: ["ion-card{margin:0;display:flex;align-items:center;justify-content:center;overflow:hidden;border-radius:1rem;--tw-shadow: 0 1px 2px 0 rgb(0 0 0 / .05);--tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow);transition-property:all;transition-duration:.3s;transition-timing-function:cubic-bezier(.4,0,.2,1);background:color-mix(in srgb,var(--ion-color-light) 15%,transparent 93%);border-bottom-color:var(--ion-color-medium);border-right-color:color-mix(in srgb,var(--ion-color-medium) 30%,transparent 70%);border-top-color:color-mix(in srgb,var(--ion-color-medium) 30%,transparent 70%);border-left-color:color-mix(in srgb,var(--ion-color-medium) 30%,transparent 70%);border-width:1px 1px 2px 1px}ion-card ion-card-content{padding:0}ion-card:hover{background:color-mix(in srgb,var(--ion-color-dark) 15%,transparent 93%)}ion-card.submitted.invalid{border-color:color-mix(in srgb,var(--ion-color-danger) 75%,transparent 25%)!important}ion-card ion-card-content{width:100%;height:100%;background-color:transparent;padding:0}ion-item{--background: transparent;margin:0}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i8.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i8.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: IonicModule }, { kind: "component", type: i3.IonButton, selector: "ion-button", inputs: ["buttonType", "color", "disabled", "download", "expand", "fill", "form", "href", "mode", "rel", "routerAnimation", "routerDirection", "shape", "size", "strong", "target", "type"] }, { kind: "component", type: i3.IonCard, selector: "ion-card", inputs: ["button", "color", "disabled", "download", "href", "mode", "rel", "routerAnimation", "routerDirection", "target", "type"] }, { kind: "component", type: i3.IonCardContent, selector: "ion-card-content", inputs: ["mode"] }, { kind: "component", type: i3.IonIcon, selector: "ion-icon", inputs: ["color", "flipRtl", "icon", "ios", "lazy", "md", "mode", "name", "sanitize", "size", "src"] }, { kind: "component", type: i3.IonInput, selector: "ion-input", inputs: ["autocapitalize", "autocomplete", "autocorrect", "autofocus", "clearInput", "clearInputIcon", "clearOnEdit", "color", "counter", "counterFormatter", "debounce", "disabled", "enterkeyhint", "errorText", "fill", "helperText", "inputmode", "label", "labelPlacement", "max", "maxlength", "min", "minlength", "mode", "multiple", "name", "pattern", "placeholder", "readonly", "required", "shape", "spellcheck", "step", "type", "value"] }, { kind: "component", type: i3.IonInputPasswordToggle, selector: "ion-input-password-toggle", inputs: ["color", "hideIcon", "mode", "showIcon"] }, { kind: "component", type: i3.IonItem, selector: "ion-item", inputs: ["button", "color", "detail", "detailIcon", "disabled", "download", "href", "lines", "mode", "rel", "routerAnimation", "routerDirection", "target", "type"] }, { kind: "component", type: i3.IonSpinner, selector: "ion-spinner", inputs: ["color", "duration", "name", "paused"] }, { kind: "component", type: i3.IonText, selector: "ion-text", inputs: ["color", "mode"] }, { kind: "directive", type: i3.TextValueAccessor, selector: "ion-input:not([type=number]),ion-input-otp[type=text],ion-textarea,ion-searchbar" }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: DefaultLoginComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: DefaultLoginComponent, decorators: [{
             type: Component,
             args: [{ standalone: true, imports: [
                         CommonModule,

package/esm2022/lib/components/main-content/main-content.component.mjs

@@ -73,10 +73,10 @@ export class MainContentComponent {
             document.exitFullscreen();
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: MainContentComponent, deps: [{ token: i1.AuthService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: MainContentComponent, isStandalone: true, selector: "main-content", inputs: { backdrop: "backdrop", shadowColor: "shadowColor", colapsed: "colapsed", drawerComponent: "drawerComponent" }, viewQueries: [{ propertyName: "FullScreenConteiner", first: true, predicate: ["target"], descendants: true }], ngImport: i0, template: "<div class=\"size-full flex flex-col\" [ngClass]=\"{'bg-light/50': fullScreen}\" #target>\r\n  <div class=\"w-full h-14 relative shrink-0\">\r\n    <ion-card class=\"m-0 rounded-none size-full border-none\">\r\n      <ion-card-content class=\"p-0 px-2 size-full flex\">\r\n        <div class=\"w-1/2 h-full flex items-center justify-start\">\r\n          @if (!fullScreen) {\r\n            <ion-menu-button  [routerLink]=\"['/']\" [autoHide]=\"true\"></ion-menu-button>\r\n          }\r\n          <ng-content select=\"[slot=start]\"></ng-content>\r\n        </div>\r\n\r\n        <div class=\"w-1/2 h-full flex items-center justify-end gap-2\">\r\n          <ng-content select=\"[slot=end]\"></ng-content>\r\n\r\n          <ion-button (click)=\"FullScreen()\" fill=\"outline\" color=\"dark\" size=\"small\" class=\"size-10 aspect-square  portrait:hidden\">\r\n            <ion-icon slot=\"icon-only\" name=\"expand\"></ion-icon>\r\n          </ion-button>\r\n\r\n\r\n          @if (!fullScreen) {\r\n            <div #anchor>\r\n              <ion-button (click)=\"userPopover.present($event)\" size=\"small\" class=\"size-10 aspect-square\">\r\n                <span class=\"uppercase text-white\">{{Token ? Token.Nome[0] : ''}}</span>\r\n              </ion-button>\r\n            </div>\r\n            <sion-popover #userPopover [anchor]=\"anchor\" [flip]=\"false\" width=\"13rem\">\r\n              <div class=\"w-full flex flex-col overflow-hidden\">\r\n                <div class=\"w-full flex p-2 gap-2 overflow-hidden\">\r\n                  <div class=\"size-10 shrink-0 aspect-square rounded-2xl text-sm flex items-center justify-center bg-primary\">\r\n                    <span class=\"uppercase text-white\">{{Token ? Token.Nome[0] : ''}}</span>\r\n                  </div>\r\n\r\n                  <div class=\"shrink-0 w-full flex flex-col justify-center items-start overflow-hidden text-sm\">\r\n                    <span class=\"truncate\"> {{Token ? Token.Nome : ''}} </span>\r\n                    <span class=\"truncate text-secondary\"> &#64;{{Token ? Token.Apelido : ''}} </span>\r\n                  </div>\r\n                </div>\r\n\r\n                <div class=\"w-full\">\r\n                  <ng-content class=\"size-full\" select=\"[slot=user-popover]\"></ng-content>\r\n                </div>\r\n\r\n                <div class=\"w-full p-1 !pb-0 translucid-border !border-x-0 !border-b-0\">\r\n                  <div class=\"rounded-xl flex gap-2 items-center justify-start default-transition py-1 px-2\">\r\n                    <ion-icon name=\"contrast\"></ion-icon>\r\n                    <ion-text> Tema </ion-text>\r\n                  </div>\r\n\r\n                  <div class=\"flex flex-col pl-4\">\r\n                    <ion-radio-group alignment=\"start\" [allowEmptySelection]=\"false\" [value]=\"Theme\" (ionChange)=\"SetTheme($event.detail.value)\">\r\n                      <ion-item class=\"bg-transparent\" lines=\"full\">\r\n                        <ion-icon name=\"cog\" slot=\"start\"></ion-icon>\r\n                        <ion-radio class=\"w-full\" [value]=\"0\">Sistema</ion-radio>\r\n                      </ion-item>\r\n                      <ion-item class=\"bg-transparent\" lines=\"full\">\r\n                        <ion-icon name=\"sunny\" slot=\"start\"></ion-icon>\r\n                        <ion-radio class=\"w-full\" [value]=\"1\">Claro</ion-radio>\r\n                      </ion-item>\r\n                      <ion-item class=\"bg-transparent\" lines=\"none\">\r\n                        <ion-icon name=\"moon\" slot=\"start\"></ion-icon>\r\n                        <ion-radio class=\"w-full\" [value]=\"2\">Escuro</ion-radio>\r\n                      </ion-item>\r\n                    </ion-radio-group>\r\n\r\n\r\n                    <!-- <div class=\"w-full p-1 translucid-border !border-x-0 !border-b-0 overflow-hidden\">\r\n                      <div class=\"rounded-xl flex gap-2 items-center justify-start cursor-pointer hover:bg-medium/30 default-transition py-1 px-2\">\r\n                        <ion-checkbox [checked]=\"Theme == 0\" (ionChange)=\"SetTheme(0)\" ></ion-checkbox>\r\n                        <ion-icon name=\"cog\"></ion-icon>\r\n                        <ion-text> Sistema </ion-text>\r\n                      </div>\r\n                    </div>\r\n                    <div class=\"w-full p-1 translucid-border !border-x-0 !border-b-0 overflow-hidden\">\r\n                      <div class=\"rounded-xl flex gap-2 items-center justify-start cursor-pointer hover:bg-medium/30 default-transition py-1 px-2\">\r\n                        <ion-checkbox [checked]=\"Theme == 1\" (ionChange)=\"SetTheme(1)\" ></ion-checkbox>\r\n                        <ion-icon name=\"sunny\"></ion-icon>\r\n                        <ion-text> Claro </ion-text>\r\n                      </div>\r\n                    </div>\r\n                    <div class=\"w-full p-1 translucid-border !border-x-0 !border-b-0 overflow-hidden\">\r\n                      <div class=\"rounded-xl flex gap-2 items-center justify-start cursor-pointer hover:bg-medium/30 default-transition py-1 px-2\">\r\n                        <ion-checkbox [checked]=\"Theme == 2\" (ionChange)=\"SetTheme(2)\" ></ion-checkbox>\r\n                        <ion-icon name=\"moon\"></ion-icon>\r\n                        <ion-text> Escuro </ion-text>\r\n                      </div>\r\n                    </div> -->\r\n                  </div>\r\n                </div>\r\n\r\n\r\n                <div class=\"w-full p-1 translucid-border !border-x-0 !border-b-0\">\r\n                  <div (click)=\"authService.Loggout()\" class=\"rounded-xl flex gap-2 cursor-pointer items-center justify-start hover:bg-medium/10 default-transition py-1 px-2\">\r\n                    <ion-icon color=\"danger\" name=\"exit\"></ion-icon>\r\n                    <ion-text> Log Out </ion-text>\r\n                  </div>\r\n\r\n                  <!-- <ion-text> Log Out </ion-text>\r\n                  <ion-button (click)=\"authService.Loggout()\" class=\"size-8 shrink-0\" size=\"small\" fill=\"clear\" color=\"danger\">\r\n                    <ion-icon slot=\"icon-only\" name=\"exit-outline\"></ion-icon> \r\n                  </ion-button> -->\r\n                </div>\r\n              </div>\r\n\r\n              <!-- <div class=\"size-full\">\r\n                <div class=\"w-full p-1 flex items-center\">\r\n                  <div class=\"size-10 shrink-0 aspect-square rounded-2xl text-sm flex items-center justify-center default-transition\" style=\"background-color: var(--ion-color-primary);\">\r\n                    <span class=\"uppercase text-white\">{{Token ? Token.Nome[0] : ''}}</span>\r\n                  </div>\r\n                  <div class=\"grow min-w-10 p-2 justify-center items-center whitespace-nowrap text-ellipsis overflow-hidden block default-transition\" [ngClass]=\"{'opacity-0 w-0': colapsed}\">\r\n                    <span>{{Token ? Token.Nome : ''}}</span> <br>\r\n                    <ion-text color=\"secondary\" class=\"text-sm\">\r\n                      &#64;{{Token ? Token.Apelido : ''}}\r\n                    </ion-text>\r\n                  </div>\r\n                </div>\r\n                <div class=\"w-full\">\r\n                  <ng-content class=\"size-full\" select=\"[slot=user-popover]\"></ng-content>\r\n                </div>\r\n                <div class=\"w-full p-1 px-2 translucid-border !border-x-0 !border-b-0 flex items-center justify-between\">\r\n                  <div class=\"hover:bg-medium/30 default-transition size-full\">\r\n                    <ion-button color=\"dark\" fill=\"clear\" size=\"small\" class=\"rounded-xl w-full text-left overflow-hidden\">\r\n                      <ion-icon slot=\"start\" name=\"contrast\"></ion-icon>\r\n                      <ion-label class=\"text-sm\">Tema</ion-label>\r\n                    </ion-button>\r\n                  </div>\r\n                </div>\r\n                <div class=\"w-full p-1 px-2 translucid-border !border-x-0 !border-b-0 flex items-center justify-between\">\r\n                  <ion-text> Log Out </ion-text>\r\n                  <ion-button (click)=\"authService.Loggout()\" class=\"size-8 shrink-0\" size=\"small\" fill=\"clear\" color=\"danger\">\r\n                    <ion-icon slot=\"icon-only\" name=\"exit-outline\"></ion-icon> \r\n                  </ion-button>\r\n                </div>\r\n              </div> -->\r\n            </sion-popover>\r\n          }\r\n        </div>\r\n      </ion-card-content>\r\n    </ion-card>\r\n  </div>\r\n  <div class=\"size-full relative p-2 pt-0 bg-light\">\r\n    <div class=\"size-full relative rounded-2xl content-shadow overflow-hidden {{backdrop}}\" style=\"--shadow-color: {{shadowColor}}\">\r\n      <ng-content></ng-content> \r\n    </div>\r\n  </div>\r\n</div>", styles: ["#popover-user{--width: 17rem}.content-shadow{--shadow-color: color-mix(in srgb, var(--ion-color-primary) 15%, transparent);box-shadow:0 0 0 1px var(--shadow-color),0 6px 10px -4px var(--shadow-color)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: IonicModule }, { kind: "component", type: i3.IonButton, selector: "ion-button", inputs: ["buttonType", "color", "disabled", "download", "expand", "fill", "form", "href", "mode", "rel", "routerAnimation", "routerDirection", "shape", "size", "strong", "target", "type"] }, { kind: "component", type: i3.IonCard, selector: "ion-card", inputs: ["button", "color", "disabled", "download", "href", "mode", "rel", "routerAnimation", "routerDirection", "target", "type"] }, { kind: "component", type: i3.IonCardContent, selector: "ion-card-content", inputs: ["mode"] }, { kind: "component", type: i3.IonIcon, selector: "ion-icon", inputs: ["color", "flipRtl", "icon", "ios", "lazy", "md", "mode", "name", "sanitize", "size", "src"] }, { kind: "component", type: i3.IonItem, selector: "ion-item", inputs: ["button", "color", "detail", "detailIcon", "disabled", "download", "href", "lines", "mode", "rel", "routerAnimation", "routerDirection", "target", "type"] }, { kind: "component", type: i3.IonMenuButton, selector: "ion-menu-button", inputs: ["autoHide", "color", "disabled", "menu", "mode", "type"] }, { kind: "component", type: i3.IonRadio, selector: "ion-radio", inputs: ["alignment", "color", "disabled", "justify", "labelPlacement", "mode", "name", "value"] }, { kind: "component", type: i3.IonRadioGroup, selector: "ion-radio-group", inputs: ["allowEmptySelection", "compareWith", "errorText", "helperText", "name", "value"] }, { kind: "component", type: i3.IonText, selector: "ion-text", inputs: ["color", "mode"] }, { kind: "directive", type: i3.SelectValueAccessor, selector: "ion-select, ion-radio-group, ion-segment, ion-datetime" }, { kind: "directive", type: i3.RouterLinkDelegate, selector: ":not(a):not(area)[routerLink]" }, { kind: "directive", type: RouterLinkWithHref, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "ngmodule", type: SIonPopoverModule }, { kind: "component", type: i4.SIonPopoverComponent, selector: "sion-popover", inputs: ["fill", "arrow", "flip", "placement", "height", "width", "anchor"], outputs: ["onWillPresent", "onDidPresent", "onWillDismiss", "onDidDismiss"] }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: MainContentComponent, deps: [{ token: i1.AuthService }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: MainContentComponent, isStandalone: true, selector: "main-content", inputs: { backdrop: "backdrop", shadowColor: "shadowColor", colapsed: "colapsed", drawerComponent: "drawerComponent" }, viewQueries: [{ propertyName: "FullScreenConteiner", first: true, predicate: ["target"], descendants: true }], ngImport: i0, template: "<div class=\"size-full flex flex-col\" [ngClass]=\"{'bg-light/50': fullScreen}\" #target>\r\n  <div class=\"w-full h-14 relative shrink-0\">\r\n    <ion-card class=\"m-0 rounded-none size-full border-none\">\r\n      <ion-card-content class=\"p-0 px-2 size-full flex\">\r\n        <div class=\"w-1/2 h-full flex items-center justify-start\">\r\n          @if (!fullScreen) {\r\n            <ion-menu-button  [routerLink]=\"['/']\" [autoHide]=\"true\"></ion-menu-button>\r\n          }\r\n          <ng-content select=\"[slot=start]\"></ng-content>\r\n        </div>\r\n\r\n        <div class=\"w-1/2 h-full flex items-center justify-end gap-2\">\r\n          <ng-content select=\"[slot=end]\"></ng-content>\r\n\r\n          <ion-button (click)=\"FullScreen()\" fill=\"outline\" color=\"dark\" size=\"small\" class=\"size-10 aspect-square  portrait:hidden\">\r\n            <ion-icon slot=\"icon-only\" name=\"expand\"></ion-icon>\r\n          </ion-button>\r\n\r\n\r\n          @if (!fullScreen) {\r\n            <div #anchor>\r\n              <ion-button (click)=\"userPopover.present($event)\" size=\"small\" class=\"size-10 aspect-square\">\r\n                <span class=\"uppercase text-white\">{{Token ? Token.Nome[0] : ''}}</span>\r\n              </ion-button>\r\n            </div>\r\n            <sion-popover #userPopover [anchor]=\"anchor\" [flip]=\"false\" width=\"13rem\">\r\n              <div class=\"w-full flex flex-col overflow-hidden\">\r\n                <div class=\"w-full flex p-2 gap-2 overflow-hidden\">\r\n                  <div class=\"size-10 shrink-0 aspect-square rounded-2xl text-sm flex items-center justify-center bg-primary\">\r\n                    <span class=\"uppercase text-white\">{{Token ? Token.Nome[0] : ''}}</span>\r\n                  </div>\r\n\r\n                  <div class=\"shrink-0 w-full flex flex-col justify-center items-start overflow-hidden text-sm\">\r\n                    <span class=\"truncate\"> {{Token ? Token.Nome : ''}} </span>\r\n                    <span class=\"truncate text-secondary\"> &#64;{{Token ? Token.Apelido : ''}} </span>\r\n                  </div>\r\n                </div>\r\n\r\n                <div class=\"w-full\">\r\n                  <ng-content class=\"size-full\" select=\"[slot=user-popover]\"></ng-content>\r\n                </div>\r\n\r\n                <div class=\"w-full p-1 !pb-0 translucid-border !border-x-0 !border-b-0\">\r\n                  <div class=\"rounded-xl flex gap-2 items-center justify-start default-transition py-1 px-2\">\r\n                    <ion-icon name=\"contrast\"></ion-icon>\r\n                    <ion-text> Tema </ion-text>\r\n                  </div>\r\n\r\n                  <div class=\"flex flex-col pl-4\">\r\n                    <ion-radio-group alignment=\"start\" [allowEmptySelection]=\"false\" [value]=\"Theme\" (ionChange)=\"SetTheme($event.detail.value)\">\r\n                      <ion-item class=\"bg-transparent\" lines=\"full\">\r\n                        <ion-icon name=\"cog\" slot=\"start\"></ion-icon>\r\n                        <ion-radio class=\"w-full\" [value]=\"0\">Sistema</ion-radio>\r\n                      </ion-item>\r\n                      <ion-item class=\"bg-transparent\" lines=\"full\">\r\n                        <ion-icon name=\"sunny\" slot=\"start\"></ion-icon>\r\n                        <ion-radio class=\"w-full\" [value]=\"1\">Claro</ion-radio>\r\n                      </ion-item>\r\n                      <ion-item class=\"bg-transparent\" lines=\"none\">\r\n                        <ion-icon name=\"moon\" slot=\"start\"></ion-icon>\r\n                        <ion-radio class=\"w-full\" [value]=\"2\">Escuro</ion-radio>\r\n                      </ion-item>\r\n                    </ion-radio-group>\r\n\r\n\r\n                    <!-- <div class=\"w-full p-1 translucid-border !border-x-0 !border-b-0 overflow-hidden\">\r\n                      <div class=\"rounded-xl flex gap-2 items-center justify-start cursor-pointer hover:bg-medium/30 default-transition py-1 px-2\">\r\n                        <ion-checkbox [checked]=\"Theme == 0\" (ionChange)=\"SetTheme(0)\" ></ion-checkbox>\r\n                        <ion-icon name=\"cog\"></ion-icon>\r\n                        <ion-text> Sistema </ion-text>\r\n                      </div>\r\n                    </div>\r\n                    <div class=\"w-full p-1 translucid-border !border-x-0 !border-b-0 overflow-hidden\">\r\n                      <div class=\"rounded-xl flex gap-2 items-center justify-start cursor-pointer hover:bg-medium/30 default-transition py-1 px-2\">\r\n                        <ion-checkbox [checked]=\"Theme == 1\" (ionChange)=\"SetTheme(1)\" ></ion-checkbox>\r\n                        <ion-icon name=\"sunny\"></ion-icon>\r\n                        <ion-text> Claro </ion-text>\r\n                      </div>\r\n                    </div>\r\n                    <div class=\"w-full p-1 translucid-border !border-x-0 !border-b-0 overflow-hidden\">\r\n                      <div class=\"rounded-xl flex gap-2 items-center justify-start cursor-pointer hover:bg-medium/30 default-transition py-1 px-2\">\r\n                        <ion-checkbox [checked]=\"Theme == 2\" (ionChange)=\"SetTheme(2)\" ></ion-checkbox>\r\n                        <ion-icon name=\"moon\"></ion-icon>\r\n                        <ion-text> Escuro </ion-text>\r\n                      </div>\r\n                    </div> -->\r\n                  </div>\r\n                </div>\r\n\r\n\r\n                <div class=\"w-full p-1 translucid-border !border-x-0 !border-b-0\">\r\n                  <div (click)=\"authService.Loggout()\" class=\"rounded-xl flex gap-2 cursor-pointer items-center justify-start hover:bg-medium/10 default-transition py-1 px-2\">\r\n                    <ion-icon color=\"danger\" name=\"exit\"></ion-icon>\r\n                    <ion-text> Log Out </ion-text>\r\n                  </div>\r\n\r\n                  <!-- <ion-text> Log Out </ion-text>\r\n                  <ion-button (click)=\"authService.Loggout()\" class=\"size-8 shrink-0\" size=\"small\" fill=\"clear\" color=\"danger\">\r\n                    <ion-icon slot=\"icon-only\" name=\"exit-outline\"></ion-icon> \r\n                  </ion-button> -->\r\n                </div>\r\n              </div>\r\n\r\n              <!-- <div class=\"size-full\">\r\n                <div class=\"w-full p-1 flex items-center\">\r\n                  <div class=\"size-10 shrink-0 aspect-square rounded-2xl text-sm flex items-center justify-center default-transition\" style=\"background-color: var(--ion-color-primary);\">\r\n                    <span class=\"uppercase text-white\">{{Token ? Token.Nome[0] : ''}}</span>\r\n                  </div>\r\n                  <div class=\"grow min-w-10 p-2 justify-center items-center whitespace-nowrap text-ellipsis overflow-hidden block default-transition\" [ngClass]=\"{'opacity-0 w-0': colapsed}\">\r\n                    <span>{{Token ? Token.Nome : ''}}</span> <br>\r\n                    <ion-text color=\"secondary\" class=\"text-sm\">\r\n                      &#64;{{Token ? Token.Apelido : ''}}\r\n                    </ion-text>\r\n                  </div>\r\n                </div>\r\n                <div class=\"w-full\">\r\n                  <ng-content class=\"size-full\" select=\"[slot=user-popover]\"></ng-content>\r\n                </div>\r\n                <div class=\"w-full p-1 px-2 translucid-border !border-x-0 !border-b-0 flex items-center justify-between\">\r\n                  <div class=\"hover:bg-medium/30 default-transition size-full\">\r\n                    <ion-button color=\"dark\" fill=\"clear\" size=\"small\" class=\"rounded-xl w-full text-left overflow-hidden\">\r\n                      <ion-icon slot=\"start\" name=\"contrast\"></ion-icon>\r\n                      <ion-label class=\"text-sm\">Tema</ion-label>\r\n                    </ion-button>\r\n                  </div>\r\n                </div>\r\n                <div class=\"w-full p-1 px-2 translucid-border !border-x-0 !border-b-0 flex items-center justify-between\">\r\n                  <ion-text> Log Out </ion-text>\r\n                  <ion-button (click)=\"authService.Loggout()\" class=\"size-8 shrink-0\" size=\"small\" fill=\"clear\" color=\"danger\">\r\n                    <ion-icon slot=\"icon-only\" name=\"exit-outline\"></ion-icon> \r\n                  </ion-button>\r\n                </div>\r\n              </div> -->\r\n            </sion-popover>\r\n          }\r\n        </div>\r\n      </ion-card-content>\r\n    </ion-card>\r\n  </div>\r\n  <div class=\"size-full relative p-2 pt-0 bg-light\">\r\n    <div class=\"size-full relative rounded-2xl content-shadow overflow-hidden {{backdrop}}\" style=\"--shadow-color: {{shadowColor}}\">\r\n      <ng-content></ng-content> \r\n    </div>\r\n  </div>\r\n</div>", styles: ["#popover-user{--width: 17rem}.content-shadow{--shadow-color: color-mix(in srgb, var(--ion-color-primary) 15%, transparent);box-shadow:0 0 0 1px var(--shadow-color),0 6px 10px -4px var(--shadow-color)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: IonicModule }, { kind: "component", type: i3.IonButton, selector: "ion-button", inputs: ["buttonType", "color", "disabled", "download", "expand", "fill", "form", "href", "mode", "rel", "routerAnimation", "routerDirection", "shape", "size", "strong", "target", "type"] }, { kind: "component", type: i3.IonCard, selector: "ion-card", inputs: ["button", "color", "disabled", "download", "href", "mode", "rel", "routerAnimation", "routerDirection", "target", "type"] }, { kind: "component", type: i3.IonCardContent, selector: "ion-card-content", inputs: ["mode"] }, { kind: "component", type: i3.IonIcon, selector: "ion-icon", inputs: ["color", "flipRtl", "icon", "ios", "lazy", "md", "mode", "name", "sanitize", "size", "src"] }, { kind: "component", type: i3.IonItem, selector: "ion-item", inputs: ["button", "color", "detail", "detailIcon", "disabled", "download", "href", "lines", "mode", "rel", "routerAnimation", "routerDirection", "target", "type"] }, { kind: "component", type: i3.IonMenuButton, selector: "ion-menu-button", inputs: ["autoHide", "color", "disabled", "menu", "mode", "type"] }, { kind: "component", type: i3.IonRadio, selector: "ion-radio", inputs: ["alignment", "color", "disabled", "justify", "labelPlacement", "mode", "name", "value"] }, { kind: "component", type: i3.IonRadioGroup, selector: "ion-radio-group", inputs: ["allowEmptySelection", "compareWith", "errorText", "helperText", "name", "value"] }, { kind: "component", type: i3.IonText, selector: "ion-text", inputs: ["color", "mode"] }, { kind: "directive", type: i3.SelectValueAccessor, selector: "ion-select, ion-radio-group, ion-segment, ion-datetime" }, { kind: "directive", type: i3.RouterLinkDelegate, selector: ":not(a):not(area)[routerLink]" }, { kind: "directive", type: RouterLinkWithHref, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "ngmodule", type: SIonPopoverModule }, { kind: "component", type: i4.SIonPopoverComponent, selector: "sion-popover", inputs: ["fill", "arrow", "flip", "placement", "height", "width", "anchor"], outputs: ["onWillPresent", "onDidPresent", "onWillDismiss", "onDidDismiss"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: MainContentComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: MainContentComponent, decorators: [{
             type: Component,
             args: [{ standalone: true, imports: [CommonModule, IonicModule, RouterLinkWithHref, SIonPopoverModule], selector: 'main-content', template: "<div class=\"size-full flex flex-col\" [ngClass]=\"{'bg-light/50': fullScreen}\" #target>\r\n  <div class=\"w-full h-14 relative shrink-0\">\r\n    <ion-card class=\"m-0 rounded-none size-full border-none\">\r\n      <ion-card-content class=\"p-0 px-2 size-full flex\">\r\n        <div class=\"w-1/2 h-full flex items-center justify-start\">\r\n          @if (!fullScreen) {\r\n            <ion-menu-button  [routerLink]=\"['/']\" [autoHide]=\"true\"></ion-menu-button>\r\n          }\r\n          <ng-content select=\"[slot=start]\"></ng-content>\r\n        </div>\r\n\r\n        <div class=\"w-1/2 h-full flex items-center justify-end gap-2\">\r\n          <ng-content select=\"[slot=end]\"></ng-content>\r\n\r\n          <ion-button (click)=\"FullScreen()\" fill=\"outline\" color=\"dark\" size=\"small\" class=\"size-10 aspect-square  portrait:hidden\">\r\n            <ion-icon slot=\"icon-only\" name=\"expand\"></ion-icon>\r\n          </ion-button>\r\n\r\n\r\n          @if (!fullScreen) {\r\n            <div #anchor>\r\n              <ion-button (click)=\"userPopover.present($event)\" size=\"small\" class=\"size-10 aspect-square\">\r\n                <span class=\"uppercase text-white\">{{Token ? Token.Nome[0] : ''}}</span>\r\n              </ion-button>\r\n            </div>\r\n            <sion-popover #userPopover [anchor]=\"anchor\" [flip]=\"false\" width=\"13rem\">\r\n              <div class=\"w-full flex flex-col overflow-hidden\">\r\n                <div class=\"w-full flex p-2 gap-2 overflow-hidden\">\r\n                  <div class=\"size-10 shrink-0 aspect-square rounded-2xl text-sm flex items-center justify-center bg-primary\">\r\n                    <span class=\"uppercase text-white\">{{Token ? Token.Nome[0] : ''}}</span>\r\n                  </div>\r\n\r\n                  <div class=\"shrink-0 w-full flex flex-col justify-center items-start overflow-hidden text-sm\">\r\n                    <span class=\"truncate\"> {{Token ? Token.Nome : ''}} </span>\r\n                    <span class=\"truncate text-secondary\"> &#64;{{Token ? Token.Apelido : ''}} </span>\r\n                  </div>\r\n                </div>\r\n\r\n                <div class=\"w-full\">\r\n                  <ng-content class=\"size-full\" select=\"[slot=user-popover]\"></ng-content>\r\n                </div>\r\n\r\n                <div class=\"w-full p-1 !pb-0 translucid-border !border-x-0 !border-b-0\">\r\n                  <div class=\"rounded-xl flex gap-2 items-center justify-start default-transition py-1 px-2\">\r\n                    <ion-icon name=\"contrast\"></ion-icon>\r\n                    <ion-text> Tema </ion-text>\r\n                  </div>\r\n\r\n                  <div class=\"flex flex-col pl-4\">\r\n                    <ion-radio-group alignment=\"start\" [allowEmptySelection]=\"false\" [value]=\"Theme\" (ionChange)=\"SetTheme($event.detail.value)\">\r\n                      <ion-item class=\"bg-transparent\" lines=\"full\">\r\n                        <ion-icon name=\"cog\" slot=\"start\"></ion-icon>\r\n                        <ion-radio class=\"w-full\" [value]=\"0\">Sistema</ion-radio>\r\n                      </ion-item>\r\n                      <ion-item class=\"bg-transparent\" lines=\"full\">\r\n                        <ion-icon name=\"sunny\" slot=\"start\"></ion-icon>\r\n                        <ion-radio class=\"w-full\" [value]=\"1\">Claro</ion-radio>\r\n                      </ion-item>\r\n                      <ion-item class=\"bg-transparent\" lines=\"none\">\r\n                        <ion-icon name=\"moon\" slot=\"start\"></ion-icon>\r\n                        <ion-radio class=\"w-full\" [value]=\"2\">Escuro</ion-radio>\r\n                      </ion-item>\r\n                    </ion-radio-group>\r\n\r\n\r\n                    <!-- <div class=\"w-full p-1 translucid-border !border-x-0 !border-b-0 overflow-hidden\">\r\n                      <div class=\"rounded-xl flex gap-2 items-center justify-start cursor-pointer hover:bg-medium/30 default-transition py-1 px-2\">\r\n                        <ion-checkbox [checked]=\"Theme == 0\" (ionChange)=\"SetTheme(0)\" ></ion-checkbox>\r\n                        <ion-icon name=\"cog\"></ion-icon>\r\n                        <ion-text> Sistema </ion-text>\r\n                      </div>\r\n                    </div>\r\n                    <div class=\"w-full p-1 translucid-border !border-x-0 !border-b-0 overflow-hidden\">\r\n                      <div class=\"rounded-xl flex gap-2 items-center justify-start cursor-pointer hover:bg-medium/30 default-transition py-1 px-2\">\r\n                        <ion-checkbox [checked]=\"Theme == 1\" (ionChange)=\"SetTheme(1)\" ></ion-checkbox>\r\n                        <ion-icon name=\"sunny\"></ion-icon>\r\n                        <ion-text> Claro </ion-text>\r\n                      </div>\r\n                    </div>\r\n                    <div class=\"w-full p-1 translucid-border !border-x-0 !border-b-0 overflow-hidden\">\r\n                      <div class=\"rounded-xl flex gap-2 items-center justify-start cursor-pointer hover:bg-medium/30 default-transition py-1 px-2\">\r\n                        <ion-checkbox [checked]=\"Theme == 2\" (ionChange)=\"SetTheme(2)\" ></ion-checkbox>\r\n                        <ion-icon name=\"moon\"></ion-icon>\r\n                        <ion-text> Escuro </ion-text>\r\n                      </div>\r\n                    </div> -->\r\n                  </div>\r\n                </div>\r\n\r\n\r\n                <div class=\"w-full p-1 translucid-border !border-x-0 !border-b-0\">\r\n                  <div (click)=\"authService.Loggout()\" class=\"rounded-xl flex gap-2 cursor-pointer items-center justify-start hover:bg-medium/10 default-transition py-1 px-2\">\r\n                    <ion-icon color=\"danger\" name=\"exit\"></ion-icon>\r\n                    <ion-text> Log Out </ion-text>\r\n                  </div>\r\n\r\n                  <!-- <ion-text> Log Out </ion-text>\r\n                  <ion-button (click)=\"authService.Loggout()\" class=\"size-8 shrink-0\" size=\"small\" fill=\"clear\" color=\"danger\">\r\n                    <ion-icon slot=\"icon-only\" name=\"exit-outline\"></ion-icon> \r\n                  </ion-button> -->\r\n                </div>\r\n              </div>\r\n\r\n              <!-- <div class=\"size-full\">\r\n                <div class=\"w-full p-1 flex items-center\">\r\n                  <div class=\"size-10 shrink-0 aspect-square rounded-2xl text-sm flex items-center justify-center default-transition\" style=\"background-color: var(--ion-color-primary);\">\r\n                    <span class=\"uppercase text-white\">{{Token ? Token.Nome[0] : ''}}</span>\r\n                  </div>\r\n                  <div class=\"grow min-w-10 p-2 justify-center items-center whitespace-nowrap text-ellipsis overflow-hidden block default-transition\" [ngClass]=\"{'opacity-0 w-0': colapsed}\">\r\n                    <span>{{Token ? Token.Nome : ''}}</span> <br>\r\n                    <ion-text color=\"secondary\" class=\"text-sm\">\r\n                      &#64;{{Token ? Token.Apelido : ''}}\r\n                    </ion-text>\r\n                  </div>\r\n                </div>\r\n                <div class=\"w-full\">\r\n                  <ng-content class=\"size-full\" select=\"[slot=user-popover]\"></ng-content>\r\n                </div>\r\n                <div class=\"w-full p-1 px-2 translucid-border !border-x-0 !border-b-0 flex items-center justify-between\">\r\n                  <div class=\"hover:bg-medium/30 default-transition size-full\">\r\n                    <ion-button color=\"dark\" fill=\"clear\" size=\"small\" class=\"rounded-xl w-full text-left overflow-hidden\">\r\n                      <ion-icon slot=\"start\" name=\"contrast\"></ion-icon>\r\n                      <ion-label class=\"text-sm\">Tema</ion-label>\r\n                    </ion-button>\r\n                  </div>\r\n                </div>\r\n                <div class=\"w-full p-1 px-2 translucid-border !border-x-0 !border-b-0 flex items-center justify-between\">\r\n                  <ion-text> Log Out </ion-text>\r\n                  <ion-button (click)=\"authService.Loggout()\" class=\"size-8 shrink-0\" size=\"small\" fill=\"clear\" color=\"danger\">\r\n                    <ion-icon slot=\"icon-only\" name=\"exit-outline\"></ion-icon> \r\n                  </ion-button>\r\n                </div>\r\n              </div> -->\r\n            </sion-popover>\r\n          }\r\n        </div>\r\n      </ion-card-content>\r\n    </ion-card>\r\n  </div>\r\n  <div class=\"size-full relative p-2 pt-0 bg-light\">\r\n    <div class=\"size-full relative rounded-2xl content-shadow overflow-hidden {{backdrop}}\" style=\"--shadow-color: {{shadowColor}}\">\r\n      <ng-content></ng-content> \r\n    </div>\r\n  </div>\r\n</div>", styles: ["#popover-user{--width: 17rem}.content-shadow{--shadow-color: color-mix(in srgb, var(--ion-color-primary) 15%, transparent);box-shadow:0 0 0 1px var(--shadow-color),0 6px 10px -4px var(--shadow-color)}\n"] }]
         }], ctorParameters: () => [{ type: i1.AuthService }], propDecorators: { backdrop: [{

package/esm2022/lib/components/popover/sion-popover/sion-popover.component.mjs

@@ -128,10 +128,10 @@ export class SIonPopoverComponent {
             ].filter(p => p),
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: SIonPopoverComponent, deps: [{ token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: SIonPopoverComponent, selector: "sion-popover", inputs: { fill: "fill", arrow: "arrow", flip: "flip", placement: "placement", height: "height", width: "width", anchor: "anchor" }, outputs: { onWillPresent: "onWillPresent", onDidPresent: "onDidPresent", onWillDismiss: "onWillDismiss", onDidDismiss: "onDidDismiss" }, viewQueries: [{ propertyName: "contentContainer", first: true, predicate: ["popoverWrapper"], descendants: true, read: ElementRef }], ngImport: i0, template: "<div #popoverWrapper \r\n  class=\"popover-wrapper translucid-border\"\r\n  [style.height]=\"height\"\r\n  [style.width]=\"width\"\r\n  [ngClass]=\"{\r\n      'bg-light'        : fill == 'solid',\r\n      'bg-transparent'  : fill == 'outline',\r\n      'bg-light/90'     : fill == 'blur',\r\n      '!border-0'       : fill == 'clear',\r\n    }\"\r\n> \r\n  <div #popoverArrow class=\"popover-arrow size-4 translucid-border\"\r\n    [ngClass]=\"{\r\n      'bg-light'        : fill == 'solid',\r\n      'bg-transparent'  : fill == 'outline',\r\n      'bg-light/90'     : fill == 'blur',\r\n      '!border-0'       : fill == 'clear',\r\n    }\"\r\n  ></div>\r\n  <ng-content #content></ng-content>\r\n</div>", styles: [".popover-wrapper{border-radius:.75rem;width:max-content;position:fixed;will-change:left,top,bottom,right,auto,opacity,filter;opacity:0;transition:opacity .15s ease-in-out,transform .15s ease-in-out,filter .15s ease-in-out;min-width:2rem;min-height:2rem;filter:grayscale(.9);transform:scale(.95);pointer-events:auto!important;z-index:10001!important}.popover-arrow{border-radius:.125rem;position:absolute;transform:scale(1) rotate(var(--rotation))!important;clip-path:var(--clip-path-triangle, polygon(0% 0%, 0% 100%, 100% 100%))}.show{filter:grayscale(0);transform:scale(1);opacity:1}.popover-wrapper:not(.show){pointer-events:none!important}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SIonPopoverComponent, deps: [{ token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: SIonPopoverComponent, selector: "sion-popover", inputs: { fill: "fill", arrow: "arrow", flip: "flip", placement: "placement", height: "height", width: "width", anchor: "anchor" }, outputs: { onWillPresent: "onWillPresent", onDidPresent: "onDidPresent", onWillDismiss: "onWillDismiss", onDidDismiss: "onDidDismiss" }, viewQueries: [{ propertyName: "contentContainer", first: true, predicate: ["popoverWrapper"], descendants: true, read: ElementRef }], ngImport: i0, template: "<div #popoverWrapper \r\n  class=\"popover-wrapper translucid-border\"\r\n  [style.height]=\"height\"\r\n  [style.width]=\"width\"\r\n  [ngClass]=\"{\r\n      'bg-light'        : fill == 'solid',\r\n      'bg-transparent'  : fill == 'outline',\r\n      'bg-light/90'     : fill == 'blur',\r\n      '!border-0'       : fill == 'clear',\r\n    }\"\r\n> \r\n  <div #popoverArrow class=\"popover-arrow size-4 translucid-border\"\r\n    [ngClass]=\"{\r\n      'bg-light'        : fill == 'solid',\r\n      'bg-transparent'  : fill == 'outline',\r\n      'bg-light/90'     : fill == 'blur',\r\n      '!border-0'       : fill == 'clear',\r\n    }\"\r\n  ></div>\r\n  <ng-content #content></ng-content>\r\n</div>", styles: [".popover-wrapper{border-radius:.75rem;width:max-content;position:fixed;will-change:left,top,bottom,right,auto,opacity,filter;opacity:0;transition:opacity .15s ease-in-out,transform .15s ease-in-out,filter .15s ease-in-out;min-width:2rem;min-height:2rem;filter:grayscale(.9);transform:scale(.95);pointer-events:auto!important;z-index:10001!important}.popover-arrow{border-radius:.125rem;position:absolute;transform:scale(1) rotate(var(--rotation))!important;clip-path:var(--clip-path-triangle, polygon(0% 0%, 0% 100%, 100% 100%))}.show{filter:grayscale(0);transform:scale(1);opacity:1}.popover-wrapper:not(.show){pointer-events:none!important}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: SIonPopoverComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SIonPopoverComponent, decorators: [{
             type: Component,
             args: [{ selector: 'sion-popover', template: "<div #popoverWrapper \r\n  class=\"popover-wrapper translucid-border\"\r\n  [style.height]=\"height\"\r\n  [style.width]=\"width\"\r\n  [ngClass]=\"{\r\n      'bg-light'        : fill == 'solid',\r\n      'bg-transparent'  : fill == 'outline',\r\n      'bg-light/90'     : fill == 'blur',\r\n      '!border-0'       : fill == 'clear',\r\n    }\"\r\n> \r\n  <div #popoverArrow class=\"popover-arrow size-4 translucid-border\"\r\n    [ngClass]=\"{\r\n      'bg-light'        : fill == 'solid',\r\n      'bg-transparent'  : fill == 'outline',\r\n      'bg-light/90'     : fill == 'blur',\r\n      '!border-0'       : fill == 'clear',\r\n    }\"\r\n  ></div>\r\n  <ng-content #content></ng-content>\r\n</div>", styles: [".popover-wrapper{border-radius:.75rem;width:max-content;position:fixed;will-change:left,top,bottom,right,auto,opacity,filter;opacity:0;transition:opacity .15s ease-in-out,transform .15s ease-in-out,filter .15s ease-in-out;min-width:2rem;min-height:2rem;filter:grayscale(.9);transform:scale(.95);pointer-events:auto!important;z-index:10001!important}.popover-arrow{border-radius:.125rem;position:absolute;transform:scale(1) rotate(var(--rotation))!important;clip-path:var(--clip-path-triangle, polygon(0% 0%, 0% 100%, 100% 100%))}.show{filter:grayscale(0);transform:scale(1);opacity:1}.popover-wrapper:not(.show){pointer-events:none!important}\n"] }]
         }], ctorParameters: () => [{ type: i0.NgZone }], propDecorators: { fill: [{

package/esm2022/lib/components/popover/sion-popover.module.mjs

@@ -4,11 +4,11 @@ import { SIonPopoverComponent } from './sion-popover/sion-popover.component';
 import { OverlayModule } from '@angular/cdk/overlay';
 import * as i0 from "@angular/core";
 export class SIonPopoverModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: SIonPopoverModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.14", ngImport: i0, type: SIonPopoverModule, declarations: [SIonPopoverComponent], imports: [CommonModule, OverlayModule], exports: [SIonPopoverComponent] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: SIonPopoverModule, imports: [CommonModule, OverlayModule] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SIonPopoverModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.13", ngImport: i0, type: SIonPopoverModule, declarations: [SIonPopoverComponent], imports: [CommonModule, OverlayModule], exports: [SIonPopoverComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SIonPopoverModule, imports: [CommonModule, OverlayModule] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: SIonPopoverModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SIonPopoverModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [SIonPopoverComponent],

package/esm2022/lib/components/sion-card/sion-card.component.mjs

@@ -10,10 +10,10 @@ export class SionCardComponent {
         this.justify = 'justify-center';
     }
     ngOnInit() { }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: SionCardComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: SionCardComponent, isStandalone: true, selector: "sion-card", inputs: { background: "background", backdrop: "backdrop", justify: "justify" }, ngImport: i0, template: "<ion-card class=\"m-0 size-full\">\r\n  <ion-card-content class=\"size-full p-0\">\r\n    <div class=\"size-full {{backdrop}} flex flex-col overflow-hidden\">\r\n      <div class=\"flex items-center {{justify}} p-2 min-h-8 shrink-0\">\r\n        <ng-content select=\"[slot=header]\"></ng-content>\r\n      </div>\r\n      <div class=\"{{background}} size-full rounded-t-2xl overflow-hidden\">\r\n        <ng-content></ng-content>\r\n      </div>\r\n    </div>\r\n  </ion-card-content>\r\n</ion-card>", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: IonicModule }, { kind: "component", type: i1.IonCard, selector: "ion-card", inputs: ["button", "color", "disabled", "download", "href", "mode", "rel", "routerAnimation", "routerDirection", "target", "type"] }, { kind: "component", type: i1.IonCardContent, selector: "ion-card-content", inputs: ["mode"] }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SionCardComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: SionCardComponent, isStandalone: true, selector: "sion-card", inputs: { background: "background", backdrop: "backdrop", justify: "justify" }, ngImport: i0, template: "<ion-card class=\"m-0 size-full\">\r\n  <ion-card-content class=\"size-full p-0\">\r\n    <div class=\"size-full {{backdrop}} flex flex-col overflow-hidden\">\r\n      <div class=\"flex items-center {{justify}} p-2 min-h-8 shrink-0\">\r\n        <ng-content select=\"[slot=header]\"></ng-content>\r\n      </div>\r\n      <div class=\"{{background}} size-full rounded-t-2xl overflow-hidden\">\r\n        <ng-content></ng-content>\r\n      </div>\r\n    </div>\r\n  </ion-card-content>\r\n</ion-card>", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: IonicModule }, { kind: "component", type: i1.IonCard, selector: "ion-card", inputs: ["button", "color", "disabled", "download", "href", "mode", "rel", "routerAnimation", "routerDirection", "target", "type"] }, { kind: "component", type: i1.IonCardContent, selector: "ion-card-content", inputs: ["mode"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: SionCardComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SionCardComponent, decorators: [{
             type: Component,
             args: [{ selector: 'sion-card', standalone: true, imports: [CommonModule, IonicModule], template: "<ion-card class=\"m-0 size-full\">\r\n  <ion-card-content class=\"size-full p-0\">\r\n    <div class=\"size-full {{backdrop}} flex flex-col overflow-hidden\">\r\n      <div class=\"flex items-center {{justify}} p-2 min-h-8 shrink-0\">\r\n        <ng-content select=\"[slot=header]\"></ng-content>\r\n      </div>\r\n      <div class=\"{{background}} size-full rounded-t-2xl overflow-hidden\">\r\n        <ng-content></ng-content>\r\n      </div>\r\n    </div>\r\n  </ion-card-content>\r\n</ion-card>" }]
         }], ctorParameters: () => [], propDecorators: { background: [{

package/esm2022/lib/components/stepper/step/step.component.mjs

@@ -31,10 +31,10 @@ export class StepComponent {
     get _fill() {
         return this.fill ? 1 : 0;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StepComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StepComponent, selector: "step", inputs: { label: "label" }, ngImport: i0, template: "<div class=\"px-1 flex flex-col items-center justify-center text-center animated\">\r\n  <div [ngClass]=\"{'selected': selected}\" class=\"default-transition min-h-8 min-w-8 bg-red-400 flex items-center justify-center rounded-2xl step\">\r\n    <div class=\"wrapper\"><ng-content select=\"ion-icon, ion-text\"></ng-content></div>\r\n    <div class=\"default\">\r\n      {{index + 1}}\r\n    </div>\r\n  </div>\r\n  \r\n  <ion-text> {{label}} </ion-text>\r\n  <ion-progress-bar [color]=\"selected ? 'secondary' : 'primary'\" class=\"h-2 ease-in-out\" [value]=\"_fill\"></ion-progress-bar>\r\n</div>", styles: [":host{--stepper-selected-color: var(--ion-color-primary);--stepper-color: var(--ion-color-light-shade)}.step{background-color:var(--stepper-color);color:var(--ion-color-dark)}.selected{background-color:var(--stepper-selected-color);color:var(--ion-color-light)}ion-progress-bar::part(progress){transition:all ease-in-out .3s!important}.wrapper:not(:empty)+.default{display:none}.wrapper:empty{display:none}.animated{animation-name:slidein;animation-duration:.3s;animation-iteration-count:1;animation-timing-function:ease-in-out}@keyframes slidein{0%{opacity:0;transform:translate(3rem)}to{opacity:1;transform:translateX()}}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: i2.IonProgressBar, selector: "ion-progress-bar", inputs: ["buffer", "color", "mode", "reversed", "type", "value"] }, { kind: "component", type: i2.IonText, selector: "ion-text", inputs: ["color", "mode"] }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: StepComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: StepComponent, selector: "step", inputs: { label: "label" }, ngImport: i0, template: "<div class=\"px-1 flex flex-col items-center justify-center text-center animated\">\r\n  <div [ngClass]=\"{'selected': selected}\" class=\"default-transition min-h-8 min-w-8 bg-red-400 flex items-center justify-center rounded-2xl step\">\r\n    <div class=\"wrapper\"><ng-content select=\"ion-icon, ion-text\"></ng-content></div>\r\n    <div class=\"default\">\r\n      {{index + 1}}\r\n    </div>\r\n  </div>\r\n  \r\n  <ion-text> {{label}} </ion-text>\r\n  <ion-progress-bar [color]=\"selected ? 'secondary' : 'primary'\" class=\"h-2 ease-in-out\" [value]=\"_fill\"></ion-progress-bar>\r\n</div>", styles: [":host{--stepper-selected-color: var(--ion-color-primary);--stepper-color: var(--ion-color-light-shade)}.step{background-color:var(--stepper-color);color:var(--ion-color-dark)}.selected{background-color:var(--stepper-selected-color);color:var(--ion-color-light)}ion-progress-bar::part(progress){transition:all ease-in-out .3s!important}.wrapper:not(:empty)+.default{display:none}.wrapper:empty{display:none}.animated{animation-name:slidein;animation-duration:.3s;animation-iteration-count:1;animation-timing-function:ease-in-out}@keyframes slidein{0%{opacity:0;transform:translate(3rem)}to{opacity:1;transform:translateX()}}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: i2.IonProgressBar, selector: "ion-progress-bar", inputs: ["buffer", "color", "mode", "reversed", "type", "value"] }, { kind: "component", type: i2.IonText, selector: "ion-text", inputs: ["color", "mode"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StepComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: StepComponent, decorators: [{
             type: Component,
             args: [{ selector: 'step', template: "<div class=\"px-1 flex flex-col items-center justify-center text-center animated\">\r\n  <div [ngClass]=\"{'selected': selected}\" class=\"default-transition min-h-8 min-w-8 bg-red-400 flex items-center justify-center rounded-2xl step\">\r\n    <div class=\"wrapper\"><ng-content select=\"ion-icon, ion-text\"></ng-content></div>\r\n    <div class=\"default\">\r\n      {{index + 1}}\r\n    </div>\r\n  </div>\r\n  \r\n  <ion-text> {{label}} </ion-text>\r\n  <ion-progress-bar [color]=\"selected ? 'secondary' : 'primary'\" class=\"h-2 ease-in-out\" [value]=\"_fill\"></ion-progress-bar>\r\n</div>", styles: [":host{--stepper-selected-color: var(--ion-color-primary);--stepper-color: var(--ion-color-light-shade)}.step{background-color:var(--stepper-color);color:var(--ion-color-dark)}.selected{background-color:var(--stepper-selected-color);color:var(--ion-color-light)}ion-progress-bar::part(progress){transition:all ease-in-out .3s!important}.wrapper:not(:empty)+.default{display:none}.wrapper:empty{display:none}.animated{animation-name:slidein;animation-duration:.3s;animation-iteration-count:1;animation-timing-function:ease-in-out}@keyframes slidein{0%{opacity:0;transform:translate(3rem)}to{opacity:1;transform:translateX()}}\n"] }]
         }], ctorParameters: () => [], propDecorators: { label: [{

package/esm2022/lib/components/stepper/stepper.component.mjs

@@ -23,10 +23,10 @@ export class StepperComponent extends CustomInput {
         this.runValidation();
         this.propagateChange(obj);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StepperComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StepperComponent, selector: "stepper", providers: InputProviderFactory.GetProviders(StepperComponent), queries: [{ propertyName: "lstSteps", predicate: StepComponent }], usesInheritance: true, ngImport: i0, template: "<div class=\"flex w-full justify-evenly\">\r\n    <ng-content select=\"step\" class=\"grow\"></ng-content>\r\n</div>", styles: [""] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: StepperComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: StepperComponent, selector: "stepper", providers: InputProviderFactory.GetProviders(StepperComponent), queries: [{ propertyName: "lstSteps", predicate: StepComponent }], usesInheritance: true, ngImport: i0, template: "<div class=\"flex w-full justify-evenly\">\r\n    <ng-content select=\"step\" class=\"grow\"></ng-content>\r\n</div>", styles: [""] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StepperComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: StepperComponent, decorators: [{
             type: Component,
             args: [{ selector: 'stepper', providers: InputProviderFactory.GetProviders(StepperComponent), template: "<div class=\"flex w-full justify-evenly\">\r\n    <ng-content select=\"step\" class=\"grow\"></ng-content>\r\n</div>" }]
         }], ctorParameters: () => [], propDecorators: { lstSteps: [{

package/esm2022/lib/components/stepper/stepper.module.mjs

@@ -5,13 +5,13 @@ import { StepperComponent } from './stepper.component';
 import { IonicModule } from '@ionic/angular';
 import * as i0 from "@angular/core";
 export class StepperModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StepperModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.14", ngImport: i0, type: StepperModule, declarations: [StepComponent, StepperComponent], imports: [CommonModule,
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: StepperModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.13", ngImport: i0, type: StepperModule, declarations: [StepComponent, StepperComponent], imports: [CommonModule,
             IonicModule], exports: [StepComponent, StepperComponent] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StepperModule, imports: [CommonModule,
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: StepperModule, imports: [CommonModule,
             IonicModule] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StepperModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: StepperModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [StepComponent, StepperComponent],

package/esm2022/lib/components/tabs/tab/tab.component.mjs

@@ -16,10 +16,10 @@ export class TabComponent {
         this.routerOutlet = null;
         this.guid = Utils.GenerateGUID();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: TabComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: TabComponent, selector: "tab", inputs: { id: "id", label: "label", name: "name", route: "route", active: "active", relative: "relative" }, viewQueries: [{ propertyName: "placeToRender", first: true, predicate: ["placeToRender"], descendants: true, read: ViewContainerRef }], ngImport: i0, template: "<div [ngClass]=\"{'-translate-x-full opacity-0': !active,\r\n                 '!relative': relative }\" class=\"default-transition overflow-hidden max-h-full size-full absolute top-0 left-0\">\r\n  @if(route && active){\r\n    <router-outlet class=\"size-full\"></router-outlet>\r\n  }@else {\r\n    <ng-content></ng-content>\r\n  }\r\n</div>", styles: [""], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.RouterOutlet, selector: "router-outlet", inputs: ["name"], outputs: ["activate", "deactivate", "attach", "detach"], exportAs: ["outlet"] }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: TabComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: TabComponent, selector: "tab", inputs: { id: "id", label: "label", name: "name", route: "route", active: "active", relative: "relative" }, viewQueries: [{ propertyName: "placeToRender", first: true, predicate: ["placeToRender"], descendants: true, read: ViewContainerRef }], ngImport: i0, template: "<div [ngClass]=\"{'-translate-x-full opacity-0': !active,\r\n                 '!relative': relative }\" class=\"default-transition overflow-hidden max-h-full size-full absolute top-0 left-0\">\r\n  @if(route && active){\r\n    <router-outlet class=\"size-full\"></router-outlet>\r\n  }@else {\r\n    <ng-content></ng-content>\r\n  }\r\n</div>", styles: [""], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.RouterOutlet, selector: "router-outlet", inputs: ["name"], outputs: ["activate", "deactivate", "attach", "detach"], exportAs: ["outlet"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: TabComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: TabComponent, decorators: [{
             type: Component,
             args: [{ selector: 'tab', template: "<div [ngClass]=\"{'-translate-x-full opacity-0': !active,\r\n                 '!relative': relative }\" class=\"default-transition overflow-hidden max-h-full size-full absolute top-0 left-0\">\r\n  @if(route && active){\r\n    <router-outlet class=\"size-full\"></router-outlet>\r\n  }@else {\r\n    <ng-content></ng-content>\r\n  }\r\n</div>" }]
         }], ctorParameters: () => [], propDecorators: { id: [{