@ng-nest/ui 20.2.6 → 21.0.1

package/fesm2022/ng-nest-ui-button.mjs

@@ -248,10 +248,10 @@ class XButtonProperty extends XPropertyFunction(X_BUTTON_CONFIG_NAME) {
          */
         this.attrType = input(this.config?.attrType ?? 'button', ...(ngDevMode ? [{ debugName: "attrType" }] : []));
     }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.5", ngImport: i0, type: XButtonProperty, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.3.5", type: XButtonProperty, isStandalone: true, selector: "x-button-property", inputs: { type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, direction: { classPropertyName: "direction", publicName: "direction", isSignal: true, isRequired: false, transformFunction: null }, tabindex: { classPropertyName: "tabindex", publicName: "tabindex", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, onlyIcon: { classPropertyName: "onlyIcon", publicName: "onlyIcon", isSignal: true, isRequired: false, transformFunction: null }, activated: { classPropertyName: "activated", publicName: "activated", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, plain: { classPropertyName: "plain", publicName: "plain", isSignal: true, isRequired: false, transformFunction: null }, flat: { classPropertyName: "flat", publicName: "flat", isSignal: true, isRequired: false, transformFunction: null }, text: { classPropertyName: "text", publicName: "text", isSignal: true, isRequired: false, transformFunction: null }, round: { classPropertyName: "round", publicName: "round", isSignal: true, isRequired: false, transformFunction: null }, circle: { classPropertyName: "circle", publicName: "circle", isSignal: true, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, closable: { classPropertyName: "closable", publicName: "closable", isSignal: true, isRequired: false, transformFunction: null }, attrType: { classPropertyName: "attrType", publicName: "attrType", isSignal: true, isRequired: false, transformFunction: null } }, usesInheritance: true, ngImport: i0, template: '', isInline: true }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: XButtonProperty, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.0.0", type: XButtonProperty, isStandalone: true, selector: "x-button-property", inputs: { type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, direction: { classPropertyName: "direction", publicName: "direction", isSignal: true, isRequired: false, transformFunction: null }, tabindex: { classPropertyName: "tabindex", publicName: "tabindex", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, onlyIcon: { classPropertyName: "onlyIcon", publicName: "onlyIcon", isSignal: true, isRequired: false, transformFunction: null }, activated: { classPropertyName: "activated", publicName: "activated", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, plain: { classPropertyName: "plain", publicName: "plain", isSignal: true, isRequired: false, transformFunction: null }, flat: { classPropertyName: "flat", publicName: "flat", isSignal: true, isRequired: false, transformFunction: null }, text: { classPropertyName: "text", publicName: "text", isSignal: true, isRequired: false, transformFunction: null }, round: { classPropertyName: "round", publicName: "round", isSignal: true, isRequired: false, transformFunction: null }, circle: { classPropertyName: "circle", publicName: "circle", isSignal: true, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, closable: { classPropertyName: "closable", publicName: "closable", isSignal: true, isRequired: false, transformFunction: null }, attrType: { classPropertyName: "attrType", publicName: "attrType", isSignal: true, isRequired: false, transformFunction: null } }, usesInheritance: true, ngImport: i0, template: '', isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.5", ngImport: i0, type: XButtonProperty, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: XButtonProperty, decorators: [{
             type: Component,
             args: [{ selector: `${XButtonPrefix}-property`, template: '' }]
         }], propDecorators: { type: [{ type: i0.Input, args: [{ isSignal: true, alias: "type", required: false }] }], icon: [{ type: i0.Input, args: [{ isSignal: true, alias: "icon", required: false }] }], title: [{ type: i0.Input, args: [{ isSignal: true, alias: "title", required: false }] }], direction: [{ type: i0.Input, args: [{ isSignal: true, alias: "direction", required: false }] }], tabindex: [{ type: i0.Input, args: [{ isSignal: true, alias: "tabindex", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], onlyIcon: [{ type: i0.Input, args: [{ isSignal: true, alias: "onlyIcon", required: false }] }], activated: [{ type: i0.Input, args: [{ isSignal: true, alias: "activated", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], plain: [{ type: i0.Input, args: [{ isSignal: true, alias: "plain", required: false }] }], flat: [{ type: i0.Input, args: [{ isSignal: true, alias: "flat", required: false }] }], text: [{ type: i0.Input, args: [{ isSignal: true, alias: "text", required: false }] }], round: [{ type: i0.Input, args: [{ isSignal: true, alias: "round", required: false }] }], circle: [{ type: i0.Input, args: [{ isSignal: true, alias: "circle", required: false }] }], loading: [{ type: i0.Input, args: [{ isSignal: true, alias: "loading", required: false }] }], closable: [{ type: i0.Input, args: [{ isSignal: true, alias: "closable", required: false }] }], attrType: [{ type: i0.Input, args: [{ isSignal: true, alias: "attrType", required: false }] }] } });
@@ -326,10 +326,10 @@ class XButtonsProperty extends XPropertyFunction(X_BUTTONS_CONFIG_NAME) {
          */
         this.round = input(this.config?.round ?? false, ...(ngDevMode ? [{ debugName: "round", transform: XToBoolean }] : [{ transform: XToBoolean }]));
     }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.5", ngImport: i0, type: XButtonsProperty, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.3.5", type: XButtonsProperty, isStandalone: true, selector: "x-buttons-property", inputs: { space: { classPropertyName: "space", publicName: "space", isSignal: true, isRequired: false, transformFunction: null }, hiddenBorder: { classPropertyName: "hiddenBorder", publicName: "hiddenBorder", isSignal: true, isRequired: false, transformFunction: null }, boxShadow: { classPropertyName: "boxShadow", publicName: "boxShadow", isSignal: true, isRequired: false, transformFunction: null }, round: { classPropertyName: "round", publicName: "round", isSignal: true, isRequired: false, transformFunction: null } }, usesInheritance: true, ngImport: i0, template: '', isInline: true }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: XButtonsProperty, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.0.0", type: XButtonsProperty, isStandalone: true, selector: "x-buttons-property", inputs: { space: { classPropertyName: "space", publicName: "space", isSignal: true, isRequired: false, transformFunction: null }, hiddenBorder: { classPropertyName: "hiddenBorder", publicName: "hiddenBorder", isSignal: true, isRequired: false, transformFunction: null }, boxShadow: { classPropertyName: "boxShadow", publicName: "boxShadow", isSignal: true, isRequired: false, transformFunction: null }, round: { classPropertyName: "round", publicName: "round", isSignal: true, isRequired: false, transformFunction: null } }, usesInheritance: true, ngImport: i0, template: '', isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.5", ngImport: i0, type: XButtonsProperty, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: XButtonsProperty, decorators: [{
             type: Component,
             args: [{ selector: `${XButtonsPrefix}-property`, template: '' }]
         }], propDecorators: { space: [{ type: i0.Input, args: [{ isSignal: true, alias: "space", required: false }] }], hiddenBorder: [{ type: i0.Input, args: [{ isSignal: true, alias: "hiddenBorder", required: false }] }], boxShadow: [{ type: i0.Input, args: [{ isSignal: true, alias: "boxShadow", required: false }] }], round: [{ type: i0.Input, args: [{ isSignal: true, alias: "round", required: false }] }] } });
@@ -357,10 +357,10 @@ class XButtonsComponent extends XButtonsProperty {
     get getMarginRight() {
         return '-' + this.space();
     }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.5", ngImport: i0, type: XButtonsComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.5", type: XButtonsComponent, isStandalone: true, selector: "x-buttons", host: { properties: { "class": "this.className", "class.x-buttons-space": "this.getSpace", "class.x-buttons-hiddenBorder": "this.getHiddenBorder", "class.x-buttons-box-shadow": "this.getBoxShadow", "class.x-buttons-round": "this.getRound", "style.marginLeft": "this.getMarginLeft", "style.marginRight": "this.getMarginRight" } }, usesInheritance: true, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, styles: ["@keyframes loading-rotate{to{transform:rotate(360deg)}}@keyframes loading-dash{0%{stroke-dasharray:1,200;stroke-dashoffset:0}50%{stroke-dasharray:90,150;stroke-dashoffset:-2.5rem}to{stroke-dasharray:90,150;stroke-dashoffset:-7.5rem}}.x-buttons{margin:0;padding:0}.x-buttons{display:inline-flex;position:relative}.x-buttons:not(.x-buttons-space)>x-button .x-button{border-radius:0;position:relative;box-shadow:none!important}.x-buttons:not(.x-buttons-space)>x-button .x-button-round{border-radius:0}.x-buttons:not(.x-buttons-space)>x-button .x-button:focus,.x-buttons:not(.x-buttons-space)>x-button .x-button-activated{z-index:1}.x-buttons:not(.x-buttons-space)>x-button:hover{z-index:1}.x-buttons:not(.x-buttons-space)>x-button:active{z-index:2}.x-buttons:not(.x-buttons-space)>x-button:first-child .x-button{border-top-left-radius:var(--x-border-radius);border-bottom-left-radius:var(--x-border-radius)}.x-buttons:not(.x-buttons-space)>x-button:first-child .x-button-round{border-top-left-radius:5rem;border-bottom-left-radius:5rem}.x-buttons:not(.x-buttons-space)>x-button:last-child .x-button{border-top-right-radius:var(--x-border-radius);border-bottom-right-radius:var(--x-border-radius)}.x-buttons:not(.x-buttons-space)>x-button:last-child .x-button-round{border-top-right-radius:5rem;border-bottom-right-radius:5rem}.x-buttons-hiddenBorder>x-button .x-button{border:none;padding:0 var(--x-padding-small);background-color:transparent;box-shadow:none!important}.x-buttons-hiddenBorder>x-button .x-button-icon>.x-icon{font-size:1.125rem}.x-buttons-hiddenBorder>x-button .x-button-icon:hover{color:var(--x-primary)}.x-buttons-box-shadow:not(.x-buttons-space){border-radius:var(--x-border-radius);box-shadow:var(--x-box-shadow)}.x-buttons-round:not(.x-buttons-space){border-radius:5rem}.x-buttons>x-button:not(:first-child)>.x-button-primary{border-left-color:#fff3}.x-buttons>x-button:not(:first-child)>.x-button-success{border-left-color:#fff3}.x-buttons>x-button:not(:first-child)>.x-button-warning{border-left-color:#fff3}.x-buttons>x-button:not(:first-child)>.x-button-danger{border-left-color:#fff3}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: XButtonsComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.0", type: XButtonsComponent, isStandalone: true, selector: "x-buttons", host: { properties: { "class": "this.className", "class.x-buttons-space": "this.getSpace", "class.x-buttons-hiddenBorder": "this.getHiddenBorder", "class.x-buttons-box-shadow": "this.getBoxShadow", "class.x-buttons-round": "this.getRound", "style.marginLeft": "this.getMarginLeft", "style.marginRight": "this.getMarginRight" } }, usesInheritance: true, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, styles: ["@keyframes loading-rotate{to{transform:rotate(360deg)}}@keyframes loading-dash{0%{stroke-dasharray:1,200;stroke-dashoffset:0}50%{stroke-dasharray:90,150;stroke-dashoffset:-2.5rem}to{stroke-dasharray:90,150;stroke-dashoffset:-7.5rem}}.x-buttons{margin:0;padding:0}.x-buttons{display:inline-flex;position:relative}.x-buttons:not(.x-buttons-space)>x-button .x-button{border-radius:0;position:relative;box-shadow:none!important}.x-buttons:not(.x-buttons-space)>x-button .x-button-round{border-radius:0}.x-buttons:not(.x-buttons-space)>x-button .x-button:focus,.x-buttons:not(.x-buttons-space)>x-button .x-button-activated{z-index:1}.x-buttons:not(.x-buttons-space)>x-button:hover{z-index:1}.x-buttons:not(.x-buttons-space)>x-button:active{z-index:2}.x-buttons:not(.x-buttons-space)>x-button:first-child .x-button{border-top-left-radius:var(--x-border-radius);border-bottom-left-radius:var(--x-border-radius)}.x-buttons:not(.x-buttons-space)>x-button:first-child .x-button-round{border-top-left-radius:5rem;border-bottom-left-radius:5rem}.x-buttons:not(.x-buttons-space)>x-button:last-child .x-button{border-top-right-radius:var(--x-border-radius);border-bottom-right-radius:var(--x-border-radius)}.x-buttons:not(.x-buttons-space)>x-button:last-child .x-button-round{border-top-right-radius:5rem;border-bottom-right-radius:5rem}.x-buttons-hiddenBorder>x-button .x-button{border:none;padding:0 var(--x-padding-small);background-color:transparent;box-shadow:none!important}.x-buttons-hiddenBorder>x-button .x-button-icon>.x-icon{font-size:1.125rem}.x-buttons-hiddenBorder>x-button .x-button-icon:hover{color:var(--x-primary)}.x-buttons-box-shadow:not(.x-buttons-space){border-radius:var(--x-border-radius);box-shadow:var(--x-box-shadow)}.x-buttons-round:not(.x-buttons-space){border-radius:5rem}.x-buttons>x-button:not(:first-child)>.x-button-primary{border-left-color:#fff3}.x-buttons>x-button:not(:first-child)>.x-button-success{border-left-color:#fff3}.x-buttons>x-button:not(:first-child)>.x-button-warning{border-left-color:#fff3}.x-buttons>x-button:not(:first-child)>.x-button-danger{border-left-color:#fff3}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.5", ngImport: i0, type: XButtonsComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: XButtonsComponent, decorators: [{
             type: Component,
             args: [{ selector: `${XButtonsPrefix}`, template: '<ng-content></ng-content>', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, styles: ["@keyframes loading-rotate{to{transform:rotate(360deg)}}@keyframes loading-dash{0%{stroke-dasharray:1,200;stroke-dashoffset:0}50%{stroke-dasharray:90,150;stroke-dashoffset:-2.5rem}to{stroke-dasharray:90,150;stroke-dashoffset:-7.5rem}}.x-buttons{margin:0;padding:0}.x-buttons{display:inline-flex;position:relative}.x-buttons:not(.x-buttons-space)>x-button .x-button{border-radius:0;position:relative;box-shadow:none!important}.x-buttons:not(.x-buttons-space)>x-button .x-button-round{border-radius:0}.x-buttons:not(.x-buttons-space)>x-button .x-button:focus,.x-buttons:not(.x-buttons-space)>x-button .x-button-activated{z-index:1}.x-buttons:not(.x-buttons-space)>x-button:hover{z-index:1}.x-buttons:not(.x-buttons-space)>x-button:active{z-index:2}.x-buttons:not(.x-buttons-space)>x-button:first-child .x-button{border-top-left-radius:var(--x-border-radius);border-bottom-left-radius:var(--x-border-radius)}.x-buttons:not(.x-buttons-space)>x-button:first-child .x-button-round{border-top-left-radius:5rem;border-bottom-left-radius:5rem}.x-buttons:not(.x-buttons-space)>x-button:last-child .x-button{border-top-right-radius:var(--x-border-radius);border-bottom-right-radius:var(--x-border-radius)}.x-buttons:not(.x-buttons-space)>x-button:last-child .x-button-round{border-top-right-radius:5rem;border-bottom-right-radius:5rem}.x-buttons-hiddenBorder>x-button .x-button{border:none;padding:0 var(--x-padding-small);background-color:transparent;box-shadow:none!important}.x-buttons-hiddenBorder>x-button .x-button-icon>.x-icon{font-size:1.125rem}.x-buttons-hiddenBorder>x-button .x-button-icon:hover{color:var(--x-primary)}.x-buttons-box-shadow:not(.x-buttons-space){border-radius:var(--x-border-radius);box-shadow:var(--x-box-shadow)}.x-buttons-round:not(.x-buttons-space){border-radius:5rem}.x-buttons>x-button:not(:first-child)>.x-button-primary{border-left-color:#fff3}.x-buttons>x-button:not(:first-child)>.x-button-success{border-left-color:#fff3}.x-buttons>x-button:not(:first-child)>.x-button-warning{border-left-color:#fff3}.x-buttons>x-button:not(:first-child)>.x-button-danger{border-left-color:#fff3}\n"] }]
         }], propDecorators: { className: [{
@@ -431,10 +431,10 @@ class XButtonComponent extends XButtonProperty {
     ngOnDestroy() {
         this.focusMontitor.stopMonitoring(this.buttonRef());
     }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.5", ngImport: i0, type: XButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.5", type: XButtonComponent, isStandalone: true, selector: "x-button", host: { properties: { "style.marginLeft": "this.marginLeft", "style.marginRight": "this.marginRight", "style.pointerEvents": "this.pointerEvents" } }, viewQueries: [{ propertyName: "buttonRef", first: true, predicate: ["buttonRef"], descendants: true, read: ElementRef, isSignal: true }, { propertyName: "contentRef", first: true, predicate: ["content"], descendants: true, read: ElementRef, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<button\r\n  #buttonRef\r\n  class=\"x-button\"\r\n  [tabindex]=\"tabindex()\"\r\n  [ngClass]=\"classMap()\"\r\n  [class.x-button-only-icon]=\"onlyIcon()\"\r\n  [class.x-button-activated]=\"activated()\"\r\n  [class.x-button-disabled]=\"disabledComputed()\"\r\n  [class.x-button-round]=\"roundSignal()\"\r\n  [class.x-button-circle]=\"circle()\"\r\n  [class.x-button-icon]=\"icon() && !contentIsEmpty()\"\r\n  [class.x-button-icon-not-content]=\"icon() && contentIsEmpty()\"\r\n  [class.x-button-closable]=\"closable()\"\r\n  [class.x-button-transition]=\"transition()\"\r\n  [title]=\"title()\"\r\n  x-ripple\r\n  [type]=\"type()\"\r\n  [disabled]=\"disabledComputed()\"\r\n  [attr.type]=\"attrType()\"\r\n  [attr.disabled]=\"disabledComputed() || null\"\r\n>\r\n  @if (direction() === 'row' && icon() && !loading()) {\r\n    <x-icon [type]=\"icon()\"></x-icon>\r\n  }\r\n  @if (loading()) {\r\n    <span class=\"x-button-loading\">\r\n      <svg class=\"x-button-circular\" viewBox=\"25 25 50 50\">\r\n        <circle class=\"x-button-path\" cx=\"50\" cy=\"50\" r=\"20\" fill=\"none\" />\r\n      </svg>\r\n    </span>\r\n  }\r\n  <span #content><ng-content></ng-content></span>\r\n  @if (direction() === 'row-reverse' && icon() && !loading()) {\r\n    <x-icon [type]=\"icon()\"></x-icon>\r\n  }\r\n</button>\r\n", styles: ["@keyframes loading-rotate{to{transform:rotate(360deg)}}@keyframes loading-dash{0%{stroke-dasharray:1,200;stroke-dashoffset:0}50%{stroke-dasharray:90,150;stroke-dashoffset:-2.5rem}to{stroke-dasharray:90,150;stroke-dashoffset:-7.5rem}}x-button{display:inline-block;line-height:initial}.x-button{margin:0;padding:0}.x-button{position:relative;border:none;outline:none;border-radius:var(--x-border-radius);font-size:var(--x-font-size-small);text-align:center;background-clip:border-box;cursor:pointer;-webkit-user-select:none;user-select:none;white-space:nowrap;touch-action:manipulation;box-shadow:var(--x-box-shadow);width:100%}.x-button:focus{outline:none}.x-button>.x-icon{font-size:1rem;vertical-align:-.1875rem}.x-button.x-direction-row>.x-icon{margin-right:.25rem;margin-left:-.25rem}.x-button.x-direction-row-reverse>.x-icon{margin-right:-.25rem;margin-left:.25rem}.x-button-loading{margin-right:.25rem;margin-left:-.25rem;font-size:1rem;vertical-align:-.1875rem}.x-button-circular{width:1rem;height:1rem;animation:loading-rotate 2s linear infinite}.x-button-path{animation:loading-dash 1.5s ease-in-out infinite;stroke-dasharray:90,150;stroke-dashoffset:0;stroke-width:2;stroke-linecap:round}.x-button-transition{will-change:color,background-color,border,box-shadow;transition:color var(--x-animation-duration-base) ease-in-out,background-color var(--x-animation-duration-base) ease-in-out,border var(--x-animation-duration-base) ease-in-out,box-shadow var(--x-animation-duration-base) ease-in-out}.x-button-disabled{transform:none!important;opacity:.6}.x-button-round{border-radius:5rem}.x-button-circle{border-radius:50%;padding:0!important}.x-button-circle.x-size-big{width:var(--x-height-big)}.x-button-circle.x-size-large{width:var(--x-height-large)}.x-button-circle.x-size-medium{width:var(--x-height-medium)}.x-button-circle.x-size-small{width:var(--x-height-small)}.x-button-circle.x-size-mini{width:var(--x-height-mini)}.x-button-circle .x-button-loading{margin-right:0;margin-left:0}.x-button-icon-not-content.x-direction-row>.x-icon{margin-right:0;margin-left:0}.x-button-icon-not-content .x-button-loading{margin-right:0;margin-left:0}.x-button-only-icon,.x-button-only-icon.x-button-initial,.x-button-text{color:var(--x-text);border:none;background-color:transparent;box-shadow:none}.x-button-only-icon:hover,.x-button-only-icon:active,.x-button-only-icon.x-button-initial:hover,.x-button-only-icon.x-button-initial:active,.x-button-text:hover,.x-button-text:active{color:var(--x-primary);background-color:var(--x-background-a200);border-color:transparent}.x-button-only-icon:hover .x-button-path,.x-button-only-icon:active .x-button-path,.x-button-only-icon.x-button-initial:hover .x-button-path,.x-button-only-icon.x-button-initial:active .x-button-path,.x-button-text:hover .x-button-path,.x-button-text:active .x-button-path{stroke:var(--x-primary)}.x-button-closable{color:var(--x-text-400);box-shadow:none;background:none}.x-button-closable:hover{background:none;color:var(--x-text)}.x-button-disabled.x-button-activated.x-button-initial,.x-button-disabled.x-button-activated.x-button-initial:hover,.x-button-disabled.x-button-activated.x-button-initial:active{color:var(--x-primary-700);cursor:not-allowed;background-image:none;background-color:var(--x-background);border-color:var(--x-primary-700);box-shadow:none}.x-button-disabled.x-button-text,.x-button-disabled.x-button-only-icon,.x-button-disabled.x-button-text:hover,.x-button-disabled.x-button-text:active,.x-button-disabled.x-button-only-icon:hover,.x-button-disabled.x-button-only-icon:active{color:var(--x-text-400);cursor:not-allowed;background-image:none;background-color:transparent;border-color:transparent;box-shadow:none}.x-button.x-size-big{height:var(--x-height-big);line-height:var(--x-height-big);padding:0 var(--x-padding-big)}.x-button.x-size-large{height:var(--x-height-large);line-height:var(--x-height-large);padding:0 var(--x-padding-large)}.x-button.x-size-medium{height:var(--x-height-medium);line-height:var(--x-height-medium);padding:0 var(--x-padding-medium)}.x-button.x-size-small{height:var(--x-height-small);line-height:var(--x-height-small);padding:0 var(--x-padding-small)}.x-button.x-size-mini{height:var(--x-height-mini);line-height:var(--x-height-mini);padding:0 var(--x-padding-mini)}.x-button-initial{color:var(--x-text);background-color:var(--x-background-100);border-color:var(--x-border)}.x-button-initial .x-button-path{stroke:var(--x-text)}.x-button-initial:hover:not(.x-button-disabled):not(.x-button-activated),.x-button-initial.cdk-program-focused:not(.x-button-disabled),.x-button-initial.cdk-keyboard-focused:not(.x-button-disabled){color:var(--x-text);background-color:var(--x-background-a200);border-color:var(--x-border)}.x-button-initial:hover:not(.x-button-disabled):not(.x-button-activated) .x-button-path,.x-button-initial.cdk-program-focused:not(.x-button-disabled) .x-button-path,.x-button-initial.cdk-keyboard-focused:not(.x-button-disabled) .x-button-path{stroke:var(--x-text)}.x-button-initial:hover:not(.x-button-disabled):not(.x-button-activated),.x-button-initial.cdk-program-focused:not(.x-button-disabled),.x-button-initial.cdk-keyboard-focused:not(.x-button-disabled){box-shadow:var(--x-box-shadow-hover)}.x-button-initial:active:not(.x-button-disabled){color:var(--x-text);background-color:var(--x-background-a600);border-color:var(--x-border)}.x-button-initial:active:not(.x-button-disabled) .x-button-path{stroke:var(--x-text)}.x-button-initial.x-button-disabled{color:var(--x-text-400);cursor:not-allowed;background-image:none;background-color:var(--x-background-a400);border-color:var(--x-border);box-shadow:none}.x-button-initial-plain{color:var(--x-text);background-color:var(--x-background-a200);border-color:var(--x-border)}.x-button-initial-plain .x-button-path{stroke:var(--x-text)}.x-button-initial-plain:hover:not(.x-button-disabled):not(.x-button-activated),.x-button-initial-plain.cdk-program-focused:not(.x-button-disabled),.x-button-initial-plain.cdk-keyboard-focused:not(.x-button-disabled){color:var(--x-text);background-color:var(--x-background-a300);border-color:var(--x-primary)}.x-button-initial-plain:hover:not(.x-button-disabled):not(.x-button-activated) .x-button-path,.x-button-initial-plain.cdk-program-focused:not(.x-button-disabled) .x-button-path,.x-button-initial-plain.cdk-keyboard-focused:not(.x-button-disabled) .x-button-path{stroke:var(--x-text)}.x-button-initial-plain:active:not(.x-button-disabled){color:var(--x-text);background-color:var(--x-background-a200);border-color:var(--x-primary-a100)}.x-button-initial-plain:active:not(.x-button-disabled) .x-button-path{stroke:var(--x-text)}.x-button-initial-plain.x-button-disabled{color:var(--x-text-400);cursor:not-allowed;background-image:none;background-color:var(--x-background-a400);border-color:var(--x-border);box-shadow:none}.x-button-initial-plain.x-button-activated{z-index:2;color:var(--x-text);background-color:var(--x-background-a600);border-color:var(--x-border)}.x-button-initial-plain.x-button-activated .x-button-path{stroke:var(--x-text)}.x-button-initial-text{box-shadow:none;color:var(--x-text);background-color:transparent;border-color:var(--x-border)}.x-button-initial-text .x-button-path{stroke:var(--x-text)}.x-button-initial-text:hover:not(.x-button-disabled):not(.x-button-activated),.x-button-initial-text.cdk-program-focused:not(.x-button-disabled),.x-button-initial-text.cdk-keyboard-focused:not(.x-button-disabled){box-shadow:none;color:var(--x-text);background-color:var(--x-background-a200);border-color:var(--x-border)}.x-button-initial-text:hover:not(.x-button-disabled):not(.x-button-activated) .x-button-path,.x-button-initial-text.cdk-program-focused:not(.x-button-disabled) .x-button-path,.x-button-initial-text.cdk-keyboard-focused:not(.x-button-disabled) .x-button-path{stroke:var(--x-text)}.x-button-initial-text.x-button-disabled{color:var(--x-text-400);cursor:not-allowed;background-image:none;background-color:transparent;border-color:var(--x-border);box-shadow:none}.x-button-initial-flat{box-shadow:none}.x-button-initial-flat:hover:not(.x-button-disabled):not(.x-button-activated),.x-button-initial-flat.cdk-program-focused:not(.x-button-disabled),.x-button-initial-flat.cdk-keyboard-focused:not(.x-button-disabled){box-shadow:none}.x-button-initial.x-button-activated{z-index:2;color:var(--x-text);background-color:var(--x-background-a600);border-color:var(--x-border)}.x-button-initial.x-button-activated .x-button-path{stroke:var(--x-text)}.x-button-initial .x-ripple-element{background-color:var(--x-text-800)}.x-button-primary{color:var(--x-white);background-color:var(--x-primary);border-color:var(--x-primary)}.x-button-primary .x-button-path{stroke:var(--x-white)}.x-button-primary:hover:not(.x-button-disabled):not(.x-button-activated),.x-button-primary.cdk-program-focused:not(.x-button-disabled),.x-button-primary.cdk-keyboard-focused:not(.x-button-disabled){color:var(--x-white);background-color:var(--x-primary-100);border-color:var(--x-primary-100)}.x-button-primary:hover:not(.x-button-disabled):not(.x-button-activated) .x-button-path,.x-button-primary.cdk-program-focused:not(.x-button-disabled) .x-button-path,.x-button-primary.cdk-keyboard-focused:not(.x-button-disabled) .x-button-path{stroke:var(--x-white)}.x-button-primary:hover:not(.x-button-disabled):not(.x-button-activated),.x-button-primary.cdk-program-focused:not(.x-button-disabled),.x-button-primary.cdk-keyboard-focused:not(.x-button-disabled){box-shadow:var(--x-box-shadow-hover)}.x-button-primary:active:not(.x-button-disabled){color:var(--x-white);background-color:var(--x-primary);border-color:var(--x-primary)}.x-button-primary:active:not(.x-button-disabled) .x-button-path{stroke:var(--x-white)}.x-button-primary.x-button-disabled{color:var(--x-primary-800);cursor:not-allowed;background-image:none;background-color:var(--x-primary-500);border-color:var(--x-primary-500);box-shadow:none}.x-button-primary-plain{color:var(--x-primary);background-color:var(--x-primary-900);border-color:var(--x-primary-600)}.x-button-primary-plain .x-button-path{stroke:var(--x-primary)}.x-button-primary-plain:hover:not(.x-button-disabled):not(.x-button-activated),.x-button-primary-plain.cdk-program-focused:not(.x-button-disabled),.x-button-primary-plain.cdk-keyboard-focused:not(.x-button-disabled){color:var(--x-white);background-color:var(--x-primary);border-color:var(--x-primary)}.x-button-primary-plain:hover:not(.x-button-disabled):not(.x-button-activated) .x-button-path,.x-button-primary-plain.cdk-program-focused:not(.x-button-disabled) .x-button-path,.x-button-primary-plain.cdk-keyboard-focused:not(.x-button-disabled) .x-button-path{stroke:var(--x-white)}.x-button-primary-plain:active:not(.x-button-disabled){color:var(--x-white);background-color:var(--x-primary-a100);border-color:var(--x-primary-a100)}.x-button-primary-plain:active:not(.x-button-disabled) .x-button-path{stroke:var(--x-white)}.x-button-primary-plain.x-button-disabled{color:var(--x-primary-400);cursor:not-allowed;background-image:none;background-color:var(--x-primary-900);border-color:var(--x-primary-800);box-shadow:none}.x-button-primary-plain.x-button-activated{z-index:2;color:var(--x-white);background-color:var(--x-primary);border-color:var(--x-primary)}.x-button-primary-plain.x-button-activated .x-button-path{stroke:var(--x-white)}.x-button-primary-text{box-shadow:none;color:var(--x-primary);background-color:transparent;border-color:var(--x-primary-600)}.x-button-primary-text .x-button-path{stroke:var(--x-primary)}.x-button-primary-text:hover:not(.x-button-disabled):not(.x-button-activated),.x-button-primary-text.cdk-program-focused:not(.x-button-disabled),.x-button-primary-text.cdk-keyboard-focused:not(.x-button-disabled){box-shadow:none;color:var(--x-primary);background-color:var(--x-primary-900);border-color:var(--x-primary-600)}.x-button-primary-text:hover:not(.x-button-disabled):not(.x-button-activated) .x-button-path,.x-button-primary-text.cdk-program-focused:not(.x-button-disabled) .x-button-path,.x-button-primary-text.cdk-keyboard-focused:not(.x-button-disabled) .x-button-path{stroke:var(--x-primary)}.x-button-primary-text.x-button-disabled{color:var(--x-primary-400);cursor:not-allowed;background-image:none;background-color:transparent;border-color:var(--x-primary-800);box-shadow:none}.x-button-primary-flat{box-shadow:none}.x-button-primary-flat:hover:not(.x-button-disabled):not(.x-button-activated),.x-button-primary-flat.cdk-program-focused:not(.x-button-disabled),.x-button-primary-flat.cdk-keyboard-focused:not(.x-button-disabled){box-shadow:none}.x-button-primary.x-button-activated{z-index:2;color:var(--x-white);background-color:var(--x-primary);border-color:var(--x-primary)}.x-button-primary.x-button-activated .x-button-path{stroke:var(--x-white)}.x-button-primary .x-ripple-element{background-color:var(--x-primary-500)}.x-button-success{color:var(--x-white);background-color:var(--x-success);border-color:var(--x-success)}.x-button-success .x-button-path{stroke:var(--x-white)}.x-button-success:hover:not(.x-button-disabled):not(.x-button-activated),.x-button-success.cdk-program-focused:not(.x-button-disabled),.x-button-success.cdk-keyboard-focused:not(.x-button-disabled){color:var(--x-white);background-color:var(--x-success-100);border-color:var(--x-success-100)}.x-button-success:hover:not(.x-button-disabled):not(.x-button-activated) .x-button-path,.x-button-success.cdk-program-focused:not(.x-button-disabled) .x-button-path,.x-button-success.cdk-keyboard-focused:not(.x-button-disabled) .x-button-path{stroke:var(--x-white)}.x-button-success:hover:not(.x-button-disabled):not(.x-button-activated),.x-button-success.cdk-program-focused:not(.x-button-disabled),.x-button-success.cdk-keyboard-focused:not(.x-button-disabled){box-shadow:var(--x-box-shadow-hover)}.x-button-success:active:not(.x-button-disabled){color:var(--x-white);background-color:var(--x-success);border-color:var(--x-success)}.x-button-success:active:not(.x-button-disabled) .x-button-path{stroke:var(--x-white)}.x-button-success.x-button-disabled{color:var(--x-success-800);cursor:not-allowed;background-image:none;background-color:var(--x-success-500);border-color:var(--x-success-500);box-shadow:none}.x-button-success-plain{color:var(--x-success);background-color:var(--x-success-900);border-color:var(--x-success-600)}.x-button-success-plain .x-button-path{stroke:var(--x-success)}.x-button-success-plain:hover:not(.x-button-disabled):not(.x-button-activated),.x-button-success-plain.cdk-program-focused:not(.x-button-disabled),.x-button-success-plain.cdk-keyboard-focused:not(.x-button-disabled){color:var(--x-white);background-color:var(--x-success);border-color:var(--x-success)}.x-button-success-plain:hover:not(.x-button-disabled):not(.x-button-activated) .x-button-path,.x-button-success-plain.cdk-program-focused:not(.x-button-disabled) .x-button-path,.x-button-success-plain.cdk-keyboard-focused:not(.x-button-disabled) .x-button-path{stroke:var(--x-white)}.x-button-success-plain:active:not(.x-button-disabled){color:var(--x-white);background-color:var(--x-success-a100);border-color:var(--x-success-a100)}.x-button-success-plain:active:not(.x-button-disabled) .x-button-path{stroke:var(--x-white)}.x-button-success-plain.x-button-disabled{color:var(--x-success-400);cursor:not-allowed;background-image:none;background-color:var(--x-success-900);border-color:var(--x-success-800);box-shadow:none}.x-button-success-plain.x-button-activated{z-index:2;color:var(--x-white);background-color:var(--x-success);border-color:var(--x-success)}.x-button-success-plain.x-button-activated .x-button-path{stroke:var(--x-white)}.x-button-success-text{box-shadow:none;color:var(--x-success);background-color:transparent;border-color:var(--x-success-600)}.x-button-success-text .x-button-path{stroke:var(--x-success)}.x-button-success-text:hover:not(.x-button-disabled):not(.x-button-activated),.x-button-success-text.cdk-program-focused:not(.x-button-disabled),.x-button-success-text.cdk-keyboard-focused:not(.x-button-disabled){box-shadow:none;color:var(--x-success);background-color:var(--x-success-900);border-color:var(--x-success-600)}.x-button-success-text:hover:not(.x-button-disabled):not(.x-button-activated) .x-button-path,.x-button-success-text.cdk-program-focused:not(.x-button-disabled) .x-button-path,.x-button-success-text.cdk-keyboard-focused:not(.x-button-disabled) .x-button-path{stroke:var(--x-success)}.x-button-success-text.x-button-disabled{color:var(--x-success-400);cursor:not-allowed;background-image:none;background-color:transparent;border-color:var(--x-success-800);box-shadow:none}.x-button-success-flat{box-shadow:none}.x-button-success-flat:hover:not(.x-button-disabled):not(.x-button-activated),.x-button-success-flat.cdk-program-focused:not(.x-button-disabled),.x-button-success-flat.cdk-keyboard-focused:not(.x-button-disabled){box-shadow:none}.x-button-success.x-button-activated{z-index:2;color:var(--x-white);background-color:var(--x-success);border-color:var(--x-success)}.x-button-success.x-button-activated .x-button-path{stroke:var(--x-white)}.x-button-success .x-ripple-element{background-color:var(--x-success-500)}.x-button-warning{color:var(--x-white);background-color:var(--x-warning);border-color:var(--x-warning)}.x-button-warning .x-button-path{stroke:var(--x-white)}.x-button-warning:hover:not(.x-button-disabled):not(.x-button-activated),.x-button-warning.cdk-program-focused:not(.x-button-disabled),.x-button-warning.cdk-keyboard-focused:not(.x-button-disabled){color:var(--x-white);background-color:var(--x-warning-100);border-color:var(--x-warning-100)}.x-button-warning:hover:not(.x-button-disabled):not(.x-button-activated) .x-button-path,.x-button-warning.cdk-program-focused:not(.x-button-disabled) .x-button-path,.x-button-warning.cdk-keyboard-focused:not(.x-button-disabled) .x-button-path{stroke:var(--x-white)}.x-button-warning:hover:not(.x-button-disabled):not(.x-button-activated),.x-button-warning.cdk-program-focused:not(.x-button-disabled),.x-button-warning.cdk-keyboard-focused:not(.x-button-disabled){box-shadow:var(--x-box-shadow-hover)}.x-button-warning:active:not(.x-button-disabled){color:var(--x-white);background-color:var(--x-warning);border-color:var(--x-warning)}.x-button-warning:active:not(.x-button-disabled) .x-button-path{stroke:var(--x-white)}.x-button-warning.x-button-disabled{color:var(--x-warning-800);cursor:not-allowed;background-image:none;background-color:var(--x-warning-500);border-color:var(--x-warning-500);box-shadow:none}.x-button-warning-plain{color:var(--x-warning);background-color:var(--x-warning-900);border-color:var(--x-warning-600)}.x-button-warning-plain .x-button-path{stroke:var(--x-warning)}.x-button-warning-plain:hover:not(.x-button-disabled):not(.x-button-activated),.x-button-warning-plain.cdk-program-focused:not(.x-button-disabled),.x-button-warning-plain.cdk-keyboard-focused:not(.x-button-disabled){color:var(--x-white);background-color:var(--x-warning);border-color:var(--x-warning)}.x-button-warning-plain:hover:not(.x-button-disabled):not(.x-button-activated) .x-button-path,.x-button-warning-plain.cdk-program-focused:not(.x-button-disabled) .x-button-path,.x-button-warning-plain.cdk-keyboard-focused:not(.x-button-disabled) .x-button-path{stroke:var(--x-white)}.x-button-warning-plain:active:not(.x-button-disabled){color:var(--x-white);background-color:var(--x-warning-a100);border-color:var(--x-warning-a100)}.x-button-warning-plain:active:not(.x-button-disabled) .x-button-path{stroke:var(--x-white)}.x-button-warning-plain.x-button-disabled{color:var(--x-warning-400);cursor:not-allowed;background-image:none;background-color:var(--x-warning-900);border-color:var(--x-warning-800);box-shadow:none}.x-button-warning-plain.x-button-activated{z-index:2;color:var(--x-white);background-color:var(--x-warning);border-color:var(--x-warning)}.x-button-warning-plain.x-button-activated .x-button-path{stroke:var(--x-white)}.x-button-warning-text{box-shadow:none;color:var(--x-warning);background-color:transparent;border-color:var(--x-warning-600)}.x-button-warning-text .x-button-path{stroke:var(--x-warning)}.x-button-warning-text:hover:not(.x-button-disabled):not(.x-button-activated),.x-button-warning-text.cdk-program-focused:not(.x-button-disabled),.x-button-warning-text.cdk-keyboard-focused:not(.x-button-disabled){box-shadow:none;color:var(--x-warning);background-color:var(--x-warning-900);border-color:var(--x-warning-600)}.x-button-warning-text:hover:not(.x-button-disabled):not(.x-button-activated) .x-button-path,.x-button-warning-text.cdk-program-focused:not(.x-button-disabled) .x-button-path,.x-button-warning-text.cdk-keyboard-focused:not(.x-button-disabled) .x-button-path{stroke:var(--x-warning)}.x-button-warning-text.x-button-disabled{color:var(--x-warning-400);cursor:not-allowed;background-image:none;background-color:transparent;border-color:var(--x-warning-800);box-shadow:none}.x-button-warning-flat{box-shadow:none}.x-button-warning-flat:hover:not(.x-button-disabled):not(.x-button-activated),.x-button-warning-flat.cdk-program-focused:not(.x-button-disabled),.x-button-warning-flat.cdk-keyboard-focused:not(.x-button-disabled){box-shadow:none}.x-button-warning.x-button-activated{z-index:2;color:var(--x-white);background-color:var(--x-warning);border-color:var(--x-warning)}.x-button-warning.x-button-activated .x-button-path{stroke:var(--x-white)}.x-button-warning .x-ripple-element{background-color:var(--x-warning-500)}.x-button-danger{color:var(--x-white);background-color:var(--x-danger);border-color:var(--x-danger)}.x-button-danger .x-button-path{stroke:var(--x-white)}.x-button-danger:hover:not(.x-button-disabled):not(.x-button-activated),.x-button-danger.cdk-program-focused:not(.x-button-disabled),.x-button-danger.cdk-keyboard-focused:not(.x-button-disabled){color:var(--x-white);background-color:var(--x-danger-100);border-color:var(--x-danger-100)}.x-button-danger:hover:not(.x-button-disabled):not(.x-button-activated) .x-button-path,.x-button-danger.cdk-program-focused:not(.x-button-disabled) .x-button-path,.x-button-danger.cdk-keyboard-focused:not(.x-button-disabled) .x-button-path{stroke:var(--x-white)}.x-button-danger:hover:not(.x-button-disabled):not(.x-button-activated),.x-button-danger.cdk-program-focused:not(.x-button-disabled),.x-button-danger.cdk-keyboard-focused:not(.x-button-disabled){box-shadow:var(--x-box-shadow-hover)}.x-button-danger:active:not(.x-button-disabled){color:var(--x-white);background-color:var(--x-danger);border-color:var(--x-danger)}.x-button-danger:active:not(.x-button-disabled) .x-button-path{stroke:var(--x-white)}.x-button-danger.x-button-disabled{color:var(--x-danger-800);cursor:not-allowed;background-image:none;background-color:var(--x-danger-500);border-color:var(--x-danger-500);box-shadow:none}.x-button-danger-plain{color:var(--x-danger);background-color:var(--x-danger-900);border-color:var(--x-danger-600)}.x-button-danger-plain .x-button-path{stroke:var(--x-danger)}.x-button-danger-plain:hover:not(.x-button-disabled):not(.x-button-activated),.x-button-danger-plain.cdk-program-focused:not(.x-button-disabled),.x-button-danger-plain.cdk-keyboard-focused:not(.x-button-disabled){color:var(--x-white);background-color:var(--x-danger);border-color:var(--x-danger)}.x-button-danger-plain:hover:not(.x-button-disabled):not(.x-button-activated) .x-button-path,.x-button-danger-plain.cdk-program-focused:not(.x-button-disabled) .x-button-path,.x-button-danger-plain.cdk-keyboard-focused:not(.x-button-disabled) .x-button-path{stroke:var(--x-white)}.x-button-danger-plain:active:not(.x-button-disabled){color:var(--x-white);background-color:var(--x-danger-a100);border-color:var(--x-danger-a100)}.x-button-danger-plain:active:not(.x-button-disabled) .x-button-path{stroke:var(--x-white)}.x-button-danger-plain.x-button-disabled{color:var(--x-danger-400);cursor:not-allowed;background-image:none;background-color:var(--x-danger-900);border-color:var(--x-danger-800);box-shadow:none}.x-button-danger-plain.x-button-activated{z-index:2;color:var(--x-white);background-color:var(--x-danger);border-color:var(--x-danger)}.x-button-danger-plain.x-button-activated .x-button-path{stroke:var(--x-white)}.x-button-danger-text{box-shadow:none;color:var(--x-danger);background-color:transparent;border-color:var(--x-danger-600)}.x-button-danger-text .x-button-path{stroke:var(--x-danger)}.x-button-danger-text:hover:not(.x-button-disabled):not(.x-button-activated),.x-button-danger-text.cdk-program-focused:not(.x-button-disabled),.x-button-danger-text.cdk-keyboard-focused:not(.x-button-disabled){box-shadow:none;color:var(--x-danger);background-color:var(--x-danger-900);border-color:var(--x-danger-600)}.x-button-danger-text:hover:not(.x-button-disabled):not(.x-button-activated) .x-button-path,.x-button-danger-text.cdk-program-focused:not(.x-button-disabled) .x-button-path,.x-button-danger-text.cdk-keyboard-focused:not(.x-button-disabled) .x-button-path{stroke:var(--x-danger)}.x-button-danger-text.x-button-disabled{color:var(--x-danger-400);cursor:not-allowed;background-image:none;background-color:transparent;border-color:var(--x-danger-800);box-shadow:none}.x-button-danger-flat{box-shadow:none}.x-button-danger-flat:hover:not(.x-button-disabled):not(.x-button-activated),.x-button-danger-flat.cdk-program-focused:not(.x-button-disabled),.x-button-danger-flat.cdk-keyboard-focused:not(.x-button-disabled){box-shadow:none}.x-button-danger.x-button-activated{z-index:2;color:var(--x-white);background-color:var(--x-danger);border-color:var(--x-danger)}.x-button-danger.x-button-activated .x-button-path{stroke:var(--x-white)}.x-button-danger .x-ripple-element{background-color:var(--x-danger-500)}.x-button-info{color:var(--x-white);background-color:var(--x-info);border-color:var(--x-info)}.x-button-info .x-button-path{stroke:var(--x-white)}.x-button-info:hover:not(.x-button-disabled):not(.x-button-activated),.x-button-info.cdk-program-focused:not(.x-button-disabled),.x-button-info.cdk-keyboard-focused:not(.x-button-disabled){color:var(--x-white);background-color:var(--x-info-100);border-color:var(--x-info-100)}.x-button-info:hover:not(.x-button-disabled):not(.x-button-activated) .x-button-path,.x-button-info.cdk-program-focused:not(.x-button-disabled) .x-button-path,.x-button-info.cdk-keyboard-focused:not(.x-button-disabled) .x-button-path{stroke:var(--x-white)}.x-button-info:hover:not(.x-button-disabled):not(.x-button-activated),.x-button-info.cdk-program-focused:not(.x-button-disabled),.x-button-info.cdk-keyboard-focused:not(.x-button-disabled){box-shadow:var(--x-box-shadow-hover)}.x-button-info:active:not(.x-button-disabled){color:var(--x-white);background-color:var(--x-info);border-color:var(--x-info)}.x-button-info:active:not(.x-button-disabled) .x-button-path{stroke:var(--x-white)}.x-button-info.x-button-disabled{color:var(--x-info-800);cursor:not-allowed;background-image:none;background-color:var(--x-info-500);border-color:var(--x-info-500);box-shadow:none}.x-button-info-plain{color:var(--x-info);background-color:var(--x-info-900);border-color:var(--x-info-600)}.x-button-info-plain .x-button-path{stroke:var(--x-info)}.x-button-info-plain:hover:not(.x-button-disabled):not(.x-button-activated),.x-button-info-plain.cdk-program-focused:not(.x-button-disabled),.x-button-info-plain.cdk-keyboard-focused:not(.x-button-disabled){color:var(--x-white);background-color:var(--x-info);border-color:var(--x-info)}.x-button-info-plain:hover:not(.x-button-disabled):not(.x-button-activated) .x-button-path,.x-button-info-plain.cdk-program-focused:not(.x-button-disabled) .x-button-path,.x-button-info-plain.cdk-keyboard-focused:not(.x-button-disabled) .x-button-path{stroke:var(--x-white)}.x-button-info-plain:active:not(.x-button-disabled){color:var(--x-white);background-color:var(--x-info-a100);border-color:var(--x-info-a100)}.x-button-info-plain:active:not(.x-button-disabled) .x-button-path{stroke:var(--x-white)}.x-button-info-plain.x-button-disabled{color:var(--x-info-400);cursor:not-allowed;background-image:none;background-color:var(--x-info-900);border-color:var(--x-info-800);box-shadow:none}.x-button-info-plain.x-button-activated{z-index:2;color:var(--x-white);background-color:var(--x-info);border-color:var(--x-info)}.x-button-info-plain.x-button-activated .x-button-path{stroke:var(--x-white)}.x-button-info-text{box-shadow:none;color:var(--x-info);background-color:transparent;border-color:var(--x-info-600)}.x-button-info-text .x-button-path{stroke:var(--x-info)}.x-button-info-text:hover:not(.x-button-disabled):not(.x-button-activated),.x-button-info-text.cdk-program-focused:not(.x-button-disabled),.x-button-info-text.cdk-keyboard-focused:not(.x-button-disabled){box-shadow:none;color:var(--x-info);background-color:var(--x-info-900);border-color:var(--x-info-600)}.x-button-info-text:hover:not(.x-button-disabled):not(.x-button-activated) .x-button-path,.x-button-info-text.cdk-program-focused:not(.x-button-disabled) .x-button-path,.x-button-info-text.cdk-keyboard-focused:not(.x-button-disabled) .x-button-path{stroke:var(--x-info)}.x-button-info-text.x-button-disabled{color:var(--x-info-400);cursor:not-allowed;background-image:none;background-color:transparent;border-color:var(--x-info-800);box-shadow:none}.x-button-info-flat{box-shadow:none}.x-button-info-flat:hover:not(.x-button-disabled):not(.x-button-activated),.x-button-info-flat.cdk-program-focused:not(.x-button-disabled),.x-button-info-flat.cdk-keyboard-focused:not(.x-button-disabled){box-shadow:none}.x-button-info.x-button-activated{z-index:2;color:var(--x-white);background-color:var(--x-info);border-color:var(--x-info)}.x-button-info.x-button-activated .x-button-path{stroke:var(--x-white)}.x-button-info .x-ripple-element{background-color:var(--x-info-500)}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: XIconComponent, selector: "x-icon" }, { kind: "directive", type: XRippleDirective, selector: "[x-ripple]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: XButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.0", type: XButtonComponent, isStandalone: true, selector: "x-button", host: { properties: { "style.marginLeft": "this.marginLeft", "style.marginRight": "this.marginRight", "style.pointerEvents": "this.pointerEvents" } }, viewQueries: [{ propertyName: "buttonRef", first: true, predicate: ["buttonRef"], descendants: true, read: ElementRef, isSignal: true }, { propertyName: "contentRef", first: true, predicate: ["content"], descendants: true, read: ElementRef, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<button\r\n  #buttonRef\r\n  class=\"x-button\"\r\n  [tabindex]=\"tabindex()\"\r\n  [ngClass]=\"classMap()\"\r\n  [class.x-button-only-icon]=\"onlyIcon()\"\r\n  [class.x-button-activated]=\"activated()\"\r\n  [class.x-button-disabled]=\"disabledComputed()\"\r\n  [class.x-button-round]=\"roundSignal()\"\r\n  [class.x-button-circle]=\"circle()\"\r\n  [class.x-button-icon]=\"icon() && !contentIsEmpty()\"\r\n  [class.x-button-icon-not-content]=\"icon() && contentIsEmpty()\"\r\n  [class.x-button-closable]=\"closable()\"\r\n  [class.x-button-transition]=\"transition()\"\r\n  [title]=\"title()\"\r\n  x-ripple\r\n  [type]=\"type()\"\r\n  [disabled]=\"disabledComputed()\"\r\n  [attr.type]=\"attrType()\"\r\n  [attr.disabled]=\"disabledComputed() || null\"\r\n>\r\n  @if (direction() === 'row' && icon() && !loading()) {\r\n    <x-icon [type]=\"icon()\"></x-icon>\r\n  }\r\n  @if (loading()) {\r\n    <span class=\"x-button-loading\">\r\n      <svg class=\"x-button-circular\" viewBox=\"25 25 50 50\">\r\n        <circle class=\"x-button-path\" cx=\"50\" cy=\"50\" r=\"20\" fill=\"none\" />\r\n      </svg>\r\n    </span>\r\n  }\r\n  <span #content><ng-content></ng-content></span>\r\n  @if (direction() === 'row-reverse' && icon() && !loading()) {\r\n    <x-icon [type]=\"icon()\"></x-icon>\r\n  }\r\n</button>\r\n", styles: ["@keyframes loading-rotate{to{transform:rotate(360deg)}}@keyframes loading-dash{0%{stroke-dasharray:1,200;stroke-dashoffset:0}50%{stroke-dasharray:90,150;stroke-dashoffset:-2.5rem}to{stroke-dasharray:90,150;stroke-dashoffset:-7.5rem}}x-button{display:inline-block;line-height:initial}.x-button{margin:0;padding:0}.x-button{position:relative;border:none;outline:none;border-radius:var(--x-border-radius);font-size:var(--x-font-size-small);text-align:center;background-clip:border-box;cursor:pointer;-webkit-user-select:none;user-select:none;white-space:nowrap;touch-action:manipulation;box-shadow:var(--x-box-shadow);width:100%}.x-button:focus{outline:none}.x-button>.x-icon{font-size:1rem;vertical-align:-.1875rem}.x-button.x-direction-row>.x-icon{margin-right:.25rem;margin-left:-.25rem}.x-button.x-direction-row-reverse>.x-icon{margin-right:-.25rem;margin-left:.25rem}.x-button-loading{margin-right:.25rem;margin-left:-.25rem;font-size:1rem;vertical-align:-.1875rem}.x-button-circular{width:1rem;height:1rem;animation:loading-rotate 2s linear infinite}.x-button-path{animation:loading-dash 1.5s ease-in-out infinite;stroke-dasharray:90,150;stroke-dashoffset:0;stroke-width:2;stroke-linecap:round}.x-button-transition{will-change:color,background-color,border,box-shadow;transition:color var(--x-animation-duration-base) ease-in-out,background-color var(--x-animation-duration-base) ease-in-out,border var(--x-animation-duration-base) ease-in-out,box-shadow var(--x-animation-duration-base) ease-in-out}.x-button-disabled{transform:none!important;opacity:.6}.x-button-round{border-radius:5rem}.x-button-circle{border-radius:50%;padding:0!important}.x-button-circle.x-size-big{width:var(--x-height-big)}.x-button-circle.x-size-large{width:var(--x-height-large)}.x-button-circle.x-size-medium{width:var(--x-height-medium)}.x-button-circle.x-size-small{width:var(--x-height-small)}.x-button-circle.x-size-mini{width:var(--x-height-mini)}.x-button-circle .x-button-loading{margin-right:0;margin-left:0}.x-button-icon-not-content.x-direction-row>.x-icon{margin-right:0;margin-left:0}.x-button-icon-not-content .x-button-loading{margin-right:0;margin-left:0}.x-button-only-icon,.x-button-only-icon.x-button-initial,.x-button-text{color:var(--x-text);border:none;background-color:transparent;box-shadow:none}.x-button-only-icon:hover,.x-button-only-icon:active,.x-button-only-icon.x-button-initial:hover,.x-button-only-icon.x-button-initial:active,.x-button-text:hover,.x-button-text:active{color:var(--x-primary);background-color:var(--x-background-a200);border-color:transparent}.x-button-only-icon:hover .x-button-path,.x-button-only-icon:active .x-button-path,.x-button-only-icon.x-button-initial:hover .x-button-path,.x-button-only-icon.x-button-initial:active .x-button-path,.x-button-text:hover .x-button-path,.x-button-text:active .x-button-path{stroke:var(--x-primary)}.x-button-closable{color:var(--x-text-400);box-shadow:none;background:none}.x-button-closable:hover{background:none;color:var(--x-text)}.x-button-disabled.x-button-activated.x-button-initial,.x-button-disabled.x-button-activated.x-button-initial:hover,.x-button-disabled.x-button-activated.x-button-initial:active{color:var(--x-primary-700);cursor:not-allowed;background-image:none;background-color:var(--x-background);border-color:var(--x-primary-700);box-shadow:none}.x-button-disabled.x-button-text,.x-button-disabled.x-button-only-icon,.x-button-disabled.x-button-text:hover,.x-button-disabled.x-button-text:active,.x-button-disabled.x-button-only-icon:hover,.x-button-disabled.x-button-only-icon:active{color:var(--x-text-400);cursor:not-allowed;background-image:none;background-color:transparent;border-color:transparent;box-shadow:none}.x-button.x-size-big{height:var(--x-height-big);line-height:var(--x-height-big);padding:0 var(--x-padding-big)}.x-button.x-size-large{height:var(--x-height-large);line-height:var(--x-height-large);padding:0 var(--x-padding-large)}.x-button.x-size-medium{height:var(--x-height-medium);line-height:var(--x-height-medium);padding:0 var(--x-padding-medium)}.x-button.x-size-small{height:var(--x-height-small);line-height:var(--x-height-small);padding:0 var(--x-padding-small)}.x-button.x-size-mini{height:var(--x-height-mini);line-height:var(--x-height-mini);padding:0 var(--x-padding-mini)}.x-button-initial{color:var(--x-text);background-color:var(--x-background-100);border-color:var(--x-border)}.x-button-initial .x-button-path{stroke:var(--x-text)}.x-button-initial:hover:not(.x-button-disabled):not(.x-button-activated),.x-button-initial.cdk-program-focused:not(.x-button-disabled),.x-button-initial.cdk-keyboard-focused:not(.x-button-disabled){color:var(--x-text);background-color:var(--x-background-a200);border-color:var(--x-border)}.x-button-initial:hover:not(.x-button-disabled):not(.x-button-activated) .x-button-path,.x-button-initial.cdk-program-focused:not(.x-button-disabled) .x-button-path,.x-button-initial.cdk-keyboard-focused:not(.x-button-disabled) .x-button-path{stroke:var(--x-text)}.x-button-initial:hover:not(.x-button-disabled):not(.x-button-activated),.x-button-initial.cdk-program-focused:not(.x-button-disabled),.x-button-initial.cdk-keyboard-focused:not(.x-button-disabled){box-shadow:var(--x-box-shadow-hover)}.x-button-initial:active:not(.x-button-disabled){color:var(--x-text);background-color:var(--x-background-a600);border-color:var(--x-border)}.x-button-initial:active:not(.x-button-disabled) .x-button-path{stroke:var(--x-text)}.x-button-initial.x-button-disabled{color:var(--x-text-400);cursor:not-allowed;background-image:none;background-color:var(--x-background-a400);border-color:var(--x-border);box-shadow:none}.x-button-initial-plain{color:var(--x-text);background-color:var(--x-background-a200);border-color:var(--x-border)}.x-button-initial-plain .x-button-path{stroke:var(--x-text)}.x-button-initial-plain:hover:not(.x-button-disabled):not(.x-button-activated),.x-button-initial-plain.cdk-program-focused:not(.x-button-disabled),.x-button-initial-plain.cdk-keyboard-focused:not(.x-button-disabled){color:var(--x-text);background-color:var(--x-background-a300);border-color:var(--x-primary)}.x-button-initial-plain:hover:not(.x-button-disabled):not(.x-button-activated) .x-button-path,.x-button-initial-plain.cdk-program-focused:not(.x-button-disabled) .x-button-path,.x-button-initial-plain.cdk-keyboard-focused:not(.x-button-disabled) .x-button-path{stroke:var(--x-text)}.x-button-initial-plain:active:not(.x-button-disabled){color:var(--x-text);background-color:var(--x-background-a200);border-color:var(--x-primary-a100)}.x-button-initial-plain:active:not(.x-button-disabled) .x-button-path{stroke:var(--x-text)}.x-button-initial-plain.x-button-disabled{color:var(--x-text-400);cursor:not-allowed;background-image:none;background-color:var(--x-background-a400);border-color:var(--x-border);box-shadow:none}.x-button-initial-plain.x-button-activated{z-index:2;color:var(--x-text);background-color:var(--x-background-a600);border-color:var(--x-border)}.x-button-initial-plain.x-button-activated .x-button-path{stroke:var(--x-text)}.x-button-initial-text{box-shadow:none;color:var(--x-text);background-color:transparent;border-color:var(--x-border)}.x-button-initial-text .x-button-path{stroke:var(--x-text)}.x-button-initial-text:hover:not(.x-button-disabled):not(.x-button-activated),.x-button-initial-text.cdk-program-focused:not(.x-button-disabled),.x-button-initial-text.cdk-keyboard-focused:not(.x-button-disabled){box-shadow:none;color:var(--x-text);background-color:var(--x-background-a200);border-color:var(--x-border)}.x-button-initial-text:hover:not(.x-button-disabled):not(.x-button-activated) .x-button-path,.x-button-initial-text.cdk-program-focused:not(.x-button-disabled) .x-button-path,.x-button-initial-text.cdk-keyboard-focused:not(.x-button-disabled) .x-button-path{stroke:var(--x-text)}.x-button-initial-text.x-button-disabled{color:var(--x-text-400);cursor:not-allowed;background-image:none;background-color:transparent;border-color:var(--x-border);box-shadow:none}.x-button-initial-flat{box-shadow:none}.x-button-initial-flat:hover:not(.x-button-disabled):not(.x-button-activated),.x-button-initial-flat.cdk-program-focused:not(.x-button-disabled),.x-button-initial-flat.cdk-keyboard-focused:not(.x-button-disabled){box-shadow:none}.x-button-initial.x-button-activated{z-index:2;color:var(--x-text);background-color:var(--x-background-a600);border-color:var(--x-border)}.x-button-initial.x-button-activated .x-button-path{stroke:var(--x-text)}.x-button-initial .x-ripple-element{background-color:var(--x-text-800)}.x-button-primary{color:var(--x-white);background-color:var(--x-primary);border-color:var(--x-primary)}.x-button-primary .x-button-path{stroke:var(--x-white)}.x-button-primary:hover:not(.x-button-disabled):not(.x-button-activated),.x-button-primary.cdk-program-focused:not(.x-button-disabled),.x-button-primary.cdk-keyboard-focused:not(.x-button-disabled){color:var(--x-white);background-color:var(--x-primary-100);border-color:var(--x-primary-100)}.x-button-primary:hover:not(.x-button-disabled):not(.x-button-activated) .x-button-path,.x-button-primary.cdk-program-focused:not(.x-button-disabled) .x-button-path,.x-button-primary.cdk-keyboard-focused:not(.x-button-disabled) .x-button-path{stroke:var(--x-white)}.x-button-primary:hover:not(.x-button-disabled):not(.x-button-activated),.x-button-primary.cdk-program-focused:not(.x-button-disabled),.x-button-primary.cdk-keyboard-focused:not(.x-button-disabled){box-shadow:var(--x-box-shadow-hover)}.x-button-primary:active:not(.x-button-disabled){color:var(--x-white);background-color:var(--x-primary);border-color:var(--x-primary)}.x-button-primary:active:not(.x-button-disabled) .x-button-path{stroke:var(--x-white)}.x-button-primary.x-button-disabled{color:var(--x-primary-800);cursor:not-allowed;background-image:none;background-color:var(--x-primary-500);border-color:var(--x-primary-500);box-shadow:none}.x-button-primary-plain{color:var(--x-primary);background-color:var(--x-primary-900);border-color:var(--x-primary-600)}.x-button-primary-plain .x-button-path{stroke:var(--x-primary)}.x-button-primary-plain:hover:not(.x-button-disabled):not(.x-button-activated),.x-button-primary-plain.cdk-program-focused:not(.x-button-disabled),.x-button-primary-plain.cdk-keyboard-focused:not(.x-button-disabled){color:var(--x-white);background-color:var(--x-primary);border-color:var(--x-primary)}.x-button-primary-plain:hover:not(.x-button-disabled):not(.x-button-activated) .x-button-path,.x-button-primary-plain.cdk-program-focused:not(.x-button-disabled) .x-button-path,.x-button-primary-plain.cdk-keyboard-focused:not(.x-button-disabled) .x-button-path{stroke:var(--x-white)}.x-button-primary-plain:active:not(.x-button-disabled){color:var(--x-white);background-color:var(--x-primary-a100);border-color:var(--x-primary-a100)}.x-button-primary-plain:active:not(.x-button-disabled) .x-button-path{stroke:var(--x-white)}.x-button-primary-plain.x-button-disabled{color:var(--x-primary-400);cursor:not-allowed;background-image:none;background-color:var(--x-primary-900);border-color:var(--x-primary-800);box-shadow:none}.x-button-primary-plain.x-button-activated{z-index:2;color:var(--x-white);background-color:var(--x-primary);border-color:var(--x-primary)}.x-button-primary-plain.x-button-activated .x-button-path{stroke:var(--x-white)}.x-button-primary-text{box-shadow:none;color:var(--x-primary);background-color:transparent;border-color:var(--x-primary-600)}.x-button-primary-text .x-button-path{stroke:var(--x-primary)}.x-button-primary-text:hover:not(.x-button-disabled):not(.x-button-activated),.x-button-primary-text.cdk-program-focused:not(.x-button-disabled),.x-button-primary-text.cdk-keyboard-focused:not(.x-button-disabled){box-shadow:none;color:var(--x-primary);background-color:var(--x-primary-900);border-color:var(--x-primary-600)}.x-button-primary-text:hover:not(.x-button-disabled):not(.x-button-activated) .x-button-path,.x-button-primary-text.cdk-program-focused:not(.x-button-disabled) .x-button-path,.x-button-primary-text.cdk-keyboard-focused:not(.x-button-disabled) .x-button-path{stroke:var(--x-primary)}.x-button-primary-text.x-button-disabled{color:var(--x-primary-400);cursor:not-allowed;background-image:none;background-color:transparent;border-color:var(--x-primary-800);box-shadow:none}.x-button-primary-flat{box-shadow:none}.x-button-primary-flat:hover:not(.x-button-disabled):not(.x-button-activated),.x-button-primary-flat.cdk-program-focused:not(.x-button-disabled),.x-button-primary-flat.cdk-keyboard-focused:not(.x-button-disabled){box-shadow:none}.x-button-primary.x-button-activated{z-index:2;color:var(--x-white);background-color:var(--x-primary);border-color:var(--x-primary)}.x-button-primary.x-button-activated .x-button-path{stroke:var(--x-white)}.x-button-primary .x-ripple-element{background-color:var(--x-primary-500)}.x-button-success{color:var(--x-white);background-color:var(--x-success);border-color:var(--x-success)}.x-button-success .x-button-path{stroke:var(--x-white)}.x-button-success:hover:not(.x-button-disabled):not(.x-button-activated),.x-button-success.cdk-program-focused:not(.x-button-disabled),.x-button-success.cdk-keyboard-focused:not(.x-button-disabled){color:var(--x-white);background-color:var(--x-success-100);border-color:var(--x-success-100)}.x-button-success:hover:not(.x-button-disabled):not(.x-button-activated) .x-button-path,.x-button-success.cdk-program-focused:not(.x-button-disabled) .x-button-path,.x-button-success.cdk-keyboard-focused:not(.x-button-disabled) .x-button-path{stroke:var(--x-white)}.x-button-success:hover:not(.x-button-disabled):not(.x-button-activated),.x-button-success.cdk-program-focused:not(.x-button-disabled),.x-button-success.cdk-keyboard-focused:not(.x-button-disabled){box-shadow:var(--x-box-shadow-hover)}.x-button-success:active:not(.x-button-disabled){color:var(--x-white);background-color:var(--x-success);border-color:var(--x-success)}.x-button-success:active:not(.x-button-disabled) .x-button-path{stroke:var(--x-white)}.x-button-success.x-button-disabled{color:var(--x-success-800);cursor:not-allowed;background-image:none;background-color:var(--x-success-500);border-color:var(--x-success-500);box-shadow:none}.x-button-success-plain{color:var(--x-success);background-color:var(--x-success-900);border-color:var(--x-success-600)}.x-button-success-plain .x-button-path{stroke:var(--x-success)}.x-button-success-plain:hover:not(.x-button-disabled):not(.x-button-activated),.x-button-success-plain.cdk-program-focused:not(.x-button-disabled),.x-button-success-plain.cdk-keyboard-focused:not(.x-button-disabled){color:var(--x-white);background-color:var(--x-success);border-color:var(--x-success)}.x-button-success-plain:hover:not(.x-button-disabled):not(.x-button-activated) .x-button-path,.x-button-success-plain.cdk-program-focused:not(.x-button-disabled) .x-button-path,.x-button-success-plain.cdk-keyboard-focused:not(.x-button-disabled) .x-button-path{stroke:var(--x-white)}.x-button-success-plain:active:not(.x-button-disabled){color:var(--x-white);background-color:var(--x-success-a100);border-color:var(--x-success-a100)}.x-button-success-plain:active:not(.x-button-disabled) .x-button-path{stroke:var(--x-white)}.x-button-success-plain.x-button-disabled{color:var(--x-success-400);cursor:not-allowed;background-image:none;background-color:var(--x-success-900);border-color:var(--x-success-800);box-shadow:none}.x-button-success-plain.x-button-activated{z-index:2;color:var(--x-white);background-color:var(--x-success);border-color:var(--x-success)}.x-button-success-plain.x-button-activated .x-button-path{stroke:var(--x-white)}.x-button-success-text{box-shadow:none;color:var(--x-success);background-color:transparent;border-color:var(--x-success-600)}.x-button-success-text .x-button-path{stroke:var(--x-success)}.x-button-success-text:hover:not(.x-button-disabled):not(.x-button-activated),.x-button-success-text.cdk-program-focused:not(.x-button-disabled),.x-button-success-text.cdk-keyboard-focused:not(.x-button-disabled){box-shadow:none;color:var(--x-success);background-color:var(--x-success-900);border-color:var(--x-success-600)}.x-button-success-text:hover:not(.x-button-disabled):not(.x-button-activated) .x-button-path,.x-button-success-text.cdk-program-focused:not(.x-button-disabled) .x-button-path,.x-button-success-text.cdk-keyboard-focused:not(.x-button-disabled) .x-button-path{stroke:var(--x-success)}.x-button-success-text.x-button-disabled{color:var(--x-success-400);cursor:not-allowed;background-image:none;background-color:transparent;border-color:var(--x-success-800);box-shadow:none}.x-button-success-flat{box-shadow:none}.x-button-success-flat:hover:not(.x-button-disabled):not(.x-button-activated),.x-button-success-flat.cdk-program-focused:not(.x-button-disabled),.x-button-success-flat.cdk-keyboard-focused:not(.x-button-disabled){box-shadow:none}.x-button-success.x-button-activated{z-index:2;color:var(--x-white);background-color:var(--x-success);border-color:var(--x-success)}.x-button-success.x-button-activated .x-button-path{stroke:var(--x-white)}.x-button-success .x-ripple-element{background-color:var(--x-success-500)}.x-button-warning{color:var(--x-white);background-color:var(--x-warning);border-color:var(--x-warning)}.x-button-warning .x-button-path{stroke:var(--x-white)}.x-button-warning:hover:not(.x-button-disabled):not(.x-button-activated),.x-button-warning.cdk-program-focused:not(.x-button-disabled),.x-button-warning.cdk-keyboard-focused:not(.x-button-disabled){color:var(--x-white);background-color:var(--x-warning-100);border-color:var(--x-warning-100)}.x-button-warning:hover:not(.x-button-disabled):not(.x-button-activated) .x-button-path,.x-button-warning.cdk-program-focused:not(.x-button-disabled) .x-button-path,.x-button-warning.cdk-keyboard-focused:not(.x-button-disabled) .x-button-path{stroke:var(--x-white)}.x-button-warning:hover:not(.x-button-disabled):not(.x-button-activated),.x-button-warning.cdk-program-focused:not(.x-button-disabled),.x-button-warning.cdk-keyboard-focused:not(.x-button-disabled){box-shadow:var(--x-box-shadow-hover)}.x-button-warning:active:not(.x-button-disabled){color:var(--x-white);background-color:var(--x-warning);border-color:var(--x-warning)}.x-button-warning:active:not(.x-button-disabled) .x-button-path{stroke:var(--x-white)}.x-button-warning.x-button-disabled{color:var(--x-warning-800);cursor:not-allowed;background-image:none;background-color:var(--x-warning-500);border-color:var(--x-warning-500);box-shadow:none}.x-button-warning-plain{color:var(--x-warning);background-color:var(--x-warning-900);border-color:var(--x-warning-600)}.x-button-warning-plain .x-button-path{stroke:var(--x-warning)}.x-button-warning-plain:hover:not(.x-button-disabled):not(.x-button-activated),.x-button-warning-plain.cdk-program-focused:not(.x-button-disabled),.x-button-warning-plain.cdk-keyboard-focused:not(.x-button-disabled){color:var(--x-white);background-color:var(--x-warning);border-color:var(--x-warning)}.x-button-warning-plain:hover:not(.x-button-disabled):not(.x-button-activated) .x-button-path,.x-button-warning-plain.cdk-program-focused:not(.x-button-disabled) .x-button-path,.x-button-warning-plain.cdk-keyboard-focused:not(.x-button-disabled) .x-button-path{stroke:var(--x-white)}.x-button-warning-plain:active:not(.x-button-disabled){color:var(--x-white);background-color:var(--x-warning-a100);border-color:var(--x-warning-a100)}.x-button-warning-plain:active:not(.x-button-disabled) .x-button-path{stroke:var(--x-white)}.x-button-warning-plain.x-button-disabled{color:var(--x-warning-400);cursor:not-allowed;background-image:none;background-color:var(--x-warning-900);border-color:var(--x-warning-800);box-shadow:none}.x-button-warning-plain.x-button-activated{z-index:2;color:var(--x-white);background-color:var(--x-warning);border-color:var(--x-warning)}.x-button-warning-plain.x-button-activated .x-button-path{stroke:var(--x-white)}.x-button-warning-text{box-shadow:none;color:var(--x-warning);background-color:transparent;border-color:var(--x-warning-600)}.x-button-warning-text .x-button-path{stroke:var(--x-warning)}.x-button-warning-text:hover:not(.x-button-disabled):not(.x-button-activated),.x-button-warning-text.cdk-program-focused:not(.x-button-disabled),.x-button-warning-text.cdk-keyboard-focused:not(.x-button-disabled){box-shadow:none;color:var(--x-warning);background-color:var(--x-warning-900);border-color:var(--x-warning-600)}.x-button-warning-text:hover:not(.x-button-disabled):not(.x-button-activated) .x-button-path,.x-button-warning-text.cdk-program-focused:not(.x-button-disabled) .x-button-path,.x-button-warning-text.cdk-keyboard-focused:not(.x-button-disabled) .x-button-path{stroke:var(--x-warning)}.x-button-warning-text.x-button-disabled{color:var(--x-warning-400);cursor:not-allowed;background-image:none;background-color:transparent;border-color:var(--x-warning-800);box-shadow:none}.x-button-warning-flat{box-shadow:none}.x-button-warning-flat:hover:not(.x-button-disabled):not(.x-button-activated),.x-button-warning-flat.cdk-program-focused:not(.x-button-disabled),.x-button-warning-flat.cdk-keyboard-focused:not(.x-button-disabled){box-shadow:none}.x-button-warning.x-button-activated{z-index:2;color:var(--x-white);background-color:var(--x-warning);border-color:var(--x-warning)}.x-button-warning.x-button-activated .x-button-path{stroke:var(--x-white)}.x-button-warning .x-ripple-element{background-color:var(--x-warning-500)}.x-button-danger{color:var(--x-white);background-color:var(--x-danger);border-color:var(--x-danger)}.x-button-danger .x-button-path{stroke:var(--x-white)}.x-button-danger:hover:not(.x-button-disabled):not(.x-button-activated),.x-button-danger.cdk-program-focused:not(.x-button-disabled),.x-button-danger.cdk-keyboard-focused:not(.x-button-disabled){color:var(--x-white);background-color:var(--x-danger-100);border-color:var(--x-danger-100)}.x-button-danger:hover:not(.x-button-disabled):not(.x-button-activated) .x-button-path,.x-button-danger.cdk-program-focused:not(.x-button-disabled) .x-button-path,.x-button-danger.cdk-keyboard-focused:not(.x-button-disabled) .x-button-path{stroke:var(--x-white)}.x-button-danger:hover:not(.x-button-disabled):not(.x-button-activated),.x-button-danger.cdk-program-focused:not(.x-button-disabled),.x-button-danger.cdk-keyboard-focused:not(.x-button-disabled){box-shadow:var(--x-box-shadow-hover)}.x-button-danger:active:not(.x-button-disabled){color:var(--x-white);background-color:var(--x-danger);border-color:var(--x-danger)}.x-button-danger:active:not(.x-button-disabled) .x-button-path{stroke:var(--x-white)}.x-button-danger.x-button-disabled{color:var(--x-danger-800);cursor:not-allowed;background-image:none;background-color:var(--x-danger-500);border-color:var(--x-danger-500);box-shadow:none}.x-button-danger-plain{color:var(--x-danger);background-color:var(--x-danger-900);border-color:var(--x-danger-600)}.x-button-danger-plain .x-button-path{stroke:var(--x-danger)}.x-button-danger-plain:hover:not(.x-button-disabled):not(.x-button-activated),.x-button-danger-plain.cdk-program-focused:not(.x-button-disabled),.x-button-danger-plain.cdk-keyboard-focused:not(.x-button-disabled){color:var(--x-white);background-color:var(--x-danger);border-color:var(--x-danger)}.x-button-danger-plain:hover:not(.x-button-disabled):not(.x-button-activated) .x-button-path,.x-button-danger-plain.cdk-program-focused:not(.x-button-disabled) .x-button-path,.x-button-danger-plain.cdk-keyboard-focused:not(.x-button-disabled) .x-button-path{stroke:var(--x-white)}.x-button-danger-plain:active:not(.x-button-disabled){color:var(--x-white);background-color:var(--x-danger-a100);border-color:var(--x-danger-a100)}.x-button-danger-plain:active:not(.x-button-disabled) .x-button-path{stroke:var(--x-white)}.x-button-danger-plain.x-button-disabled{color:var(--x-danger-400);cursor:not-allowed;background-image:none;background-color:var(--x-danger-900);border-color:var(--x-danger-800);box-shadow:none}.x-button-danger-plain.x-button-activated{z-index:2;color:var(--x-white);background-color:var(--x-danger);border-color:var(--x-danger)}.x-button-danger-plain.x-button-activated .x-button-path{stroke:var(--x-white)}.x-button-danger-text{box-shadow:none;color:var(--x-danger);background-color:transparent;border-color:var(--x-danger-600)}.x-button-danger-text .x-button-path{stroke:var(--x-danger)}.x-button-danger-text:hover:not(.x-button-disabled):not(.x-button-activated),.x-button-danger-text.cdk-program-focused:not(.x-button-disabled),.x-button-danger-text.cdk-keyboard-focused:not(.x-button-disabled){box-shadow:none;color:var(--x-danger);background-color:var(--x-danger-900);border-color:var(--x-danger-600)}.x-button-danger-text:hover:not(.x-button-disabled):not(.x-button-activated) .x-button-path,.x-button-danger-text.cdk-program-focused:not(.x-button-disabled) .x-button-path,.x-button-danger-text.cdk-keyboard-focused:not(.x-button-disabled) .x-button-path{stroke:var(--x-danger)}.x-button-danger-text.x-button-disabled{color:var(--x-danger-400);cursor:not-allowed;background-image:none;background-color:transparent;border-color:var(--x-danger-800);box-shadow:none}.x-button-danger-flat{box-shadow:none}.x-button-danger-flat:hover:not(.x-button-disabled):not(.x-button-activated),.x-button-danger-flat.cdk-program-focused:not(.x-button-disabled),.x-button-danger-flat.cdk-keyboard-focused:not(.x-button-disabled){box-shadow:none}.x-button-danger.x-button-activated{z-index:2;color:var(--x-white);background-color:var(--x-danger);border-color:var(--x-danger)}.x-button-danger.x-button-activated .x-button-path{stroke:var(--x-white)}.x-button-danger .x-ripple-element{background-color:var(--x-danger-500)}.x-button-info{color:var(--x-white);background-color:var(--x-info);border-color:var(--x-info)}.x-button-info .x-button-path{stroke:var(--x-white)}.x-button-info:hover:not(.x-button-disabled):not(.x-button-activated),.x-button-info.cdk-program-focused:not(.x-button-disabled),.x-button-info.cdk-keyboard-focused:not(.x-button-disabled){color:var(--x-white);background-color:var(--x-info-100);border-color:var(--x-info-100)}.x-button-info:hover:not(.x-button-disabled):not(.x-button-activated) .x-button-path,.x-button-info.cdk-program-focused:not(.x-button-disabled) .x-button-path,.x-button-info.cdk-keyboard-focused:not(.x-button-disabled) .x-button-path{stroke:var(--x-white)}.x-button-info:hover:not(.x-button-disabled):not(.x-button-activated),.x-button-info.cdk-program-focused:not(.x-button-disabled),.x-button-info.cdk-keyboard-focused:not(.x-button-disabled){box-shadow:var(--x-box-shadow-hover)}.x-button-info:active:not(.x-button-disabled){color:var(--x-white);background-color:var(--x-info);border-color:var(--x-info)}.x-button-info:active:not(.x-button-disabled) .x-button-path{stroke:var(--x-white)}.x-button-info.x-button-disabled{color:var(--x-info-800);cursor:not-allowed;background-image:none;background-color:var(--x-info-500);border-color:var(--x-info-500);box-shadow:none}.x-button-info-plain{color:var(--x-info);background-color:var(--x-info-900);border-color:var(--x-info-600)}.x-button-info-plain .x-button-path{stroke:var(--x-info)}.x-button-info-plain:hover:not(.x-button-disabled):not(.x-button-activated),.x-button-info-plain.cdk-program-focused:not(.x-button-disabled),.x-button-info-plain.cdk-keyboard-focused:not(.x-button-disabled){color:var(--x-white);background-color:var(--x-info);border-color:var(--x-info)}.x-button-info-plain:hover:not(.x-button-disabled):not(.x-button-activated) .x-button-path,.x-button-info-plain.cdk-program-focused:not(.x-button-disabled) .x-button-path,.x-button-info-plain.cdk-keyboard-focused:not(.x-button-disabled) .x-button-path{stroke:var(--x-white)}.x-button-info-plain:active:not(.x-button-disabled){color:var(--x-white);background-color:var(--x-info-a100);border-color:var(--x-info-a100)}.x-button-info-plain:active:not(.x-button-disabled) .x-button-path{stroke:var(--x-white)}.x-button-info-plain.x-button-disabled{color:var(--x-info-400);cursor:not-allowed;background-image:none;background-color:var(--x-info-900);border-color:var(--x-info-800);box-shadow:none}.x-button-info-plain.x-button-activated{z-index:2;color:var(--x-white);background-color:var(--x-info);border-color:var(--x-info)}.x-button-info-plain.x-button-activated .x-button-path{stroke:var(--x-white)}.x-button-info-text{box-shadow:none;color:var(--x-info);background-color:transparent;border-color:var(--x-info-600)}.x-button-info-text .x-button-path{stroke:var(--x-info)}.x-button-info-text:hover:not(.x-button-disabled):not(.x-button-activated),.x-button-info-text.cdk-program-focused:not(.x-button-disabled),.x-button-info-text.cdk-keyboard-focused:not(.x-button-disabled){box-shadow:none;color:var(--x-info);background-color:var(--x-info-900);border-color:var(--x-info-600)}.x-button-info-text:hover:not(.x-button-disabled):not(.x-button-activated) .x-button-path,.x-button-info-text.cdk-program-focused:not(.x-button-disabled) .x-button-path,.x-button-info-text.cdk-keyboard-focused:not(.x-button-disabled) .x-button-path{stroke:var(--x-info)}.x-button-info-text.x-button-disabled{color:var(--x-info-400);cursor:not-allowed;background-image:none;background-color:transparent;border-color:var(--x-info-800);box-shadow:none}.x-button-info-flat{box-shadow:none}.x-button-info-flat:hover:not(.x-button-disabled):not(.x-button-activated),.x-button-info-flat.cdk-program-focused:not(.x-button-disabled),.x-button-info-flat.cdk-keyboard-focused:not(.x-button-disabled){box-shadow:none}.x-button-info.x-button-activated{z-index:2;color:var(--x-white);background-color:var(--x-info);border-color:var(--x-info)}.x-button-info.x-button-activated .x-button-path{stroke:var(--x-white)}.x-button-info .x-ripple-element{background-color:var(--x-info-500)}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: XIconComponent, selector: "x-icon" }, { kind: "directive", type: XRippleDirective, selector: "[x-ripple]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.5", ngImport: i0, type: XButtonComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: XButtonComponent, decorators: [{
             type: Component,
             args: [{ selector: `${XButtonPrefix}`, imports: [NgClass, XIconComponent, XRippleDirective], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<button\r\n  #buttonRef\r\n  class=\"x-button\"\r\n  [tabindex]=\"tabindex()\"\r\n  [ngClass]=\"classMap()\"\r\n  [class.x-button-only-icon]=\"onlyIcon()\"\r\n  [class.x-button-activated]=\"activated()\"\r\n  [class.x-button-disabled]=\"disabledComputed()\"\r\n  [class.x-button-round]=\"roundSignal()\"\r\n  [class.x-button-circle]=\"circle()\"\r\n  [class.x-button-icon]=\"icon() && !contentIsEmpty()\"\r\n  [class.x-button-icon-not-content]=\"icon() && contentIsEmpty()\"\r\n  [class.x-button-closable]=\"closable()\"\r\n  [class.x-button-transition]=\"transition()\"\r\n  [title]=\"title()\"\r\n  x-ripple\r\n  [type]=\"type()\"\r\n  [disabled]=\"disabledComputed()\"\r\n  [attr.type]=\"attrType()\"\r\n  [attr.disabled]=\"disabledComputed() || null\"\r\n>\r\n  @if (direction() === 'row' && icon() && !loading()) {\r\n    <x-icon [type]=\"icon()\"></x-icon>\r\n  }\r\n  @if (loading()) {\r\n    <span class=\"x-button-loading\">\r\n      <svg class=\"x-button-circular\" viewBox=\"25 25 50 50\">\r\n        <circle class=\"x-button-path\" cx=\"50\" cy=\"50\" r=\"20\" fill=\"none\" />\r\n      </svg>\r\n    </span>\r\n  }\r\n  <span #content><ng-content></ng-content></span>\r\n  @if (direction() === 'row-reverse' && icon() && !loading()) {\r\n    <x-icon [type]=\"icon()\"></x-icon>\r\n  }\r\n</button>\r\n", styles: ["@keyframes loading-rotate{to{transform:rotate(360deg)}}@keyframes loading-dash{0%{stroke-dasharray:1,200;stroke-dashoffset:0}50%{stroke-dasharray:90,150;stroke-dashoffset:-2.5rem}to{stroke-dasharray:90,150;stroke-dashoffset:-7.5rem}}x-button{display:inline-block;line-height:initial}.x-button{margin:0;padding:0}.x-button{position:relative;border:none;outline:none;border-radius:var(--x-border-radius);font-size:var(--x-font-size-small);text-align:center;background-clip:border-box;cursor:pointer;-webkit-user-select:none;user-select:none;white-space:nowrap;touch-action:manipulation;box-shadow:var(--x-box-shadow);width:100%}.x-button:focus{outline:none}.x-button>.x-icon{font-size:1rem;vertical-align:-.1875rem}.x-button.x-direction-row>.x-icon{margin-right:.25rem;margin-left:-.25rem}.x-button.x-direction-row-reverse>.x-icon{margin-right:-.25rem;margin-left:.25rem}.x-button-loading{margin-right:.25rem;margin-left:-.25rem;font-size:1rem;vertical-align:-.1875rem}.x-button-circular{width:1rem;height:1rem;animation:loading-rotate 2s linear infinite}.x-button-path{animation:loading-dash 1.5s ease-in-out infinite;stroke-dasharray:90,150;stroke-dashoffset:0;stroke-width:2;stroke-linecap:round}.x-button-transition{will-change:color,background-color,border,box-shadow;transition:color var(--x-animation-duration-base) ease-in-out,background-color var(--x-animation-duration-base) ease-in-out,border var(--x-animation-duration-base) ease-in-out,box-shadow var(--x-animation-duration-base) ease-in-out}.x-button-disabled{transform:none!important;opacity:.6}.x-button-round{border-radius:5rem}.x-button-circle{border-radius:50%;padding:0!important}.x-button-circle.x-size-big{width:var(--x-height-big)}.x-button-circle.x-size-large{width:var(--x-height-large)}.x-button-circle.x-size-medium{width:var(--x-height-medium)}.x-button-circle.x-size-small{width:var(--x-height-small)}.x-button-circle.x-size-mini{width:var(--x-height-mini)}.x-button-circle .x-button-loading{margin-right:0;margin-left:0}.x-button-icon-not-content.x-direction-row>.x-icon{margin-right:0;margin-left:0}.x-button-icon-not-content .x-button-loading{margin-right:0;margin-left:0}.x-button-only-icon,.x-button-only-icon.x-button-initial,.x-button-text{color:var(--x-text);border:none;background-color:transparent;box-shadow:none}.x-button-only-icon:hover,.x-button-only-icon:active,.x-button-only-icon.x-button-initial:hover,.x-button-only-icon.x-button-initial:active,.x-button-text:hover,.x-button-text:active{color:var(--x-primary);background-color:var(--x-background-a200);border-color:transparent}.x-button-only-icon:hover .x-button-path,.x-button-only-icon:active .x-button-path,.x-button-only-icon.x-button-initial:hover .x-button-path,.x-button-only-icon.x-button-initial:active .x-button-path,.x-button-text:hover .x-button-path,.x-button-text:active .x-button-path{stroke:var(--x-primary)}.x-button-closable{color:var(--x-text-400);box-shadow:none;background:none}.x-button-closable:hover{background:none;color:var(--x-text)}.x-button-disabled.x-button-activated.x-button-initial,.x-button-disabled.x-button-activated.x-button-initial:hover,.x-button-disabled.x-button-activated.x-button-initial:active{color:var(--x-primary-700);cursor:not-allowed;background-image:none;background-color:var(--x-background);border-color:var(--x-primary-700);box-shadow:none}.x-button-disabled.x-button-text,.x-button-disabled.x-button-only-icon,.x-button-disabled.x-button-text:hover,.x-button-disabled.x-button-text:active,.x-button-disabled.x-button-only-icon:hover,.x-button-disabled.x-button-only-icon:active{color:var(--x-text-400);cursor:not-allowed;background-image:none;background-color:transparent;border-color:transparent;box-shadow:none}.x-button.x-size-big{height:var(--x-height-big);line-height:var(--x-height-big);padding:0 var(--x-padding-big)}.x-button.x-size-large{height:var(--x-height-large);line-height:var(--x-height-large);padding:0 var(--x-padding-large)}.x-button.x-size-medium{height:var(--x-height-medium);line-height:var(--x-height-medium);padding:0 var(--x-padding-medium)}.x-button.x-size-small{height:var(--x-height-small);line-height:var(--x-height-small);padding:0 var(--x-padding-small)}.x-button.x-size-mini{height:var(--x-height-mini);line-height:var(--x-height-mini);padding:0 var(--x-padding-mini)}.x-button-initial{color:var(--x-text);background-color:var(--x-background-100);border-color:var(--x-border)}.x-button-initial .x-button-path{stroke:var(--x-text)}.x-button-initial:hover:not(.x-button-disabled):not(.x-button-activated),.x-button-initial.cdk-program-focused:not(.x-button-disabled),.x-button-initial.cdk-keyboard-focused:not(.x-button-disabled){color:var(--x-text);background-color:var(--x-background-a200);border-color:var(--x-border)}.x-button-initial:hover:not(.x-button-disabled):not(.x-button-activated) .x-button-path,.x-button-initial.cdk-program-focused:not(.x-button-disabled) .x-button-path,.x-button-initial.cdk-keyboard-focused:not(.x-button-disabled) .x-button-path{stroke:var(--x-text)}.x-button-initial:hover:not(.x-button-disabled):not(.x-button-activated),.x-button-initial.cdk-program-focused:not(.x-button-disabled),.x-button-initial.cdk-keyboard-focused:not(.x-button-disabled){box-shadow:var(--x-box-shadow-hover)}.x-button-initial:active:not(.x-button-disabled){color:var(--x-text);background-color:var(--x-background-a600);border-color:var(--x-border)}.x-button-initial:active:not(.x-button-disabled) .x-button-path{stroke:var(--x-text)}.x-button-initial.x-button-disabled{color:var(--x-text-400);cursor:not-allowed;background-image:none;background-color:var(--x-background-a400);border-color:var(--x-border);box-shadow:none}.x-button-initial-plain{color:var(--x-text);background-color:var(--x-background-a200);border-color:var(--x-border)}.x-button-initial-plain .x-button-path{stroke:var(--x-text)}.x-button-initial-plain:hover:not(.x-button-disabled):not(.x-button-activated),.x-button-initial-plain.cdk-program-focused:not(.x-button-disabled),.x-button-initial-plain.cdk-keyboard-focused:not(.x-button-disabled){color:var(--x-text);background-color:var(--x-background-a300);border-color:var(--x-primary)}.x-button-initial-plain:hover:not(.x-button-disabled):not(.x-button-activated) .x-button-path,.x-button-initial-plain.cdk-program-focused:not(.x-button-disabled) .x-button-path,.x-button-initial-plain.cdk-keyboard-focused:not(.x-button-disabled) .x-button-path{stroke:var(--x-text)}.x-button-initial-plain:active:not(.x-button-disabled){color:var(--x-text);background-color:var(--x-background-a200);border-color:var(--x-primary-a100)}.x-button-initial-plain:active:not(.x-button-disabled) .x-button-path{stroke:var(--x-text)}.x-button-initial-plain.x-button-disabled{color:var(--x-text-400);cursor:not-allowed;background-image:none;background-color:var(--x-background-a400);border-color:var(--x-border);box-shadow:none}.x-button-initial-plain.x-button-activated{z-index:2;color:var(--x-text);background-color:var(--x-background-a600);border-color:var(--x-border)}.x-button-initial-plain.x-button-activated .x-button-path{stroke:var(--x-text)}.x-button-initial-text{box-shadow:none;color:var(--x-text);background-color:transparent;border-color:var(--x-border)}.x-button-initial-text .x-button-path{stroke:var(--x-text)}.x-button-initial-text:hover:not(.x-button-disabled):not(.x-button-activated),.x-button-initial-text.cdk-program-focused:not(.x-button-disabled),.x-button-initial-text.cdk-keyboard-focused:not(.x-button-disabled){box-shadow:none;color:var(--x-text);background-color:var(--x-background-a200);border-color:var(--x-border)}.x-button-initial-text:hover:not(.x-button-disabled):not(.x-button-activated) .x-button-path,.x-button-initial-text.cdk-program-focused:not(.x-button-disabled) .x-button-path,.x-button-initial-text.cdk-keyboard-focused:not(.x-button-disabled) .x-button-path{stroke:var(--x-text)}.x-button-initial-text.x-button-disabled{color:var(--x-text-400);cursor:not-allowed;background-image:none;background-color:transparent;border-color:var(--x-border);box-shadow:none}.x-button-initial-flat{box-shadow:none}.x-button-initial-flat:hover:not(.x-button-disabled):not(.x-button-activated),.x-button-initial-flat.cdk-program-focused:not(.x-button-disabled),.x-button-initial-flat.cdk-keyboard-focused:not(.x-button-disabled){box-shadow:none}.x-button-initial.x-button-activated{z-index:2;color:var(--x-text);background-color:var(--x-background-a600);border-color:var(--x-border)}.x-button-initial.x-button-activated .x-button-path{stroke:var(--x-text)}.x-button-initial .x-ripple-element{background-color:var(--x-text-800)}.x-button-primary{color:var(--x-white);background-color:var(--x-primary);border-color:var(--x-primary)}.x-button-primary .x-button-path{stroke:var(--x-white)}.x-button-primary:hover:not(.x-button-disabled):not(.x-button-activated),.x-button-primary.cdk-program-focused:not(.x-button-disabled),.x-button-primary.cdk-keyboard-focused:not(.x-button-disabled){color:var(--x-white);background-color:var(--x-primary-100);border-color:var(--x-primary-100)}.x-button-primary:hover:not(.x-button-disabled):not(.x-button-activated) .x-button-path,.x-button-primary.cdk-program-focused:not(.x-button-disabled) .x-button-path,.x-button-primary.cdk-keyboard-focused:not(.x-button-disabled) .x-button-path{stroke:var(--x-white)}.x-button-primary:hover:not(.x-button-disabled):not(.x-button-activated),.x-button-primary.cdk-program-focused:not(.x-button-disabled),.x-button-primary.cdk-keyboard-focused:not(.x-button-disabled){box-shadow:var(--x-box-shadow-hover)}.x-button-primary:active:not(.x-button-disabled){color:var(--x-white);background-color:var(--x-primary);border-color:var(--x-primary)}.x-button-primary:active:not(.x-button-disabled) .x-button-path{stroke:var(--x-white)}.x-button-primary.x-button-disabled{color:var(--x-primary-800);cursor:not-allowed;background-image:none;background-color:var(--x-primary-500);border-color:var(--x-primary-500);box-shadow:none}.x-button-primary-plain{color:var(--x-primary);background-color:var(--x-primary-900);border-color:var(--x-primary-600)}.x-button-primary-plain .x-button-path{stroke:var(--x-primary)}.x-button-primary-plain:hover:not(.x-button-disabled):not(.x-button-activated),.x-button-primary-plain.cdk-program-focused:not(.x-button-disabled),.x-button-primary-plain.cdk-keyboard-focused:not(.x-button-disabled){color:var(--x-white);background-color:var(--x-primary);border-color:var(--x-primary)}.x-button-primary-plain:hover:not(.x-button-disabled):not(.x-button-activated) .x-button-path,.x-button-primary-plain.cdk-program-focused:not(.x-button-disabled) .x-button-path,.x-button-primary-plain.cdk-keyboard-focused:not(.x-button-disabled) .x-button-path{stroke:var(--x-white)}.x-button-primary-plain:active:not(.x-button-disabled){color:var(--x-white);background-color:var(--x-primary-a100);border-color:var(--x-primary-a100)}.x-button-primary-plain:active:not(.x-button-disabled) .x-button-path{stroke:var(--x-white)}.x-button-primary-plain.x-button-disabled{color:var(--x-primary-400);cursor:not-allowed;background-image:none;background-color:var(--x-primary-900);border-color:var(--x-primary-800);box-shadow:none}.x-button-primary-plain.x-button-activated{z-index:2;color:var(--x-white);background-color:var(--x-primary);border-color:var(--x-primary)}.x-button-primary-plain.x-button-activated .x-button-path{stroke:var(--x-white)}.x-button-primary-text{box-shadow:none;color:var(--x-primary);background-color:transparent;border-color:var(--x-primary-600)}.x-button-primary-text .x-button-path{stroke:var(--x-primary)}.x-button-primary-text:hover:not(.x-button-disabled):not(.x-button-activated),.x-button-primary-text.cdk-program-focused:not(.x-button-disabled),.x-button-primary-text.cdk-keyboard-focused:not(.x-button-disabled){box-shadow:none;color:var(--x-primary);background-color:var(--x-primary-900);border-color:var(--x-primary-600)}.x-button-primary-text:hover:not(.x-button-disabled):not(.x-button-activated) .x-button-path,.x-button-primary-text.cdk-program-focused:not(.x-button-disabled) .x-button-path,.x-button-primary-text.cdk-keyboard-focused:not(.x-button-disabled) .x-button-path{stroke:var(--x-primary)}.x-button-primary-text.x-button-disabled{color:var(--x-primary-400);cursor:not-allowed;background-image:none;background-color:transparent;border-color:var(--x-primary-800);box-shadow:none}.x-button-primary-flat{box-shadow:none}.x-button-primary-flat:hover:not(.x-button-disabled):not(.x-button-activated),.x-button-primary-flat.cdk-program-focused:not(.x-button-disabled),.x-button-primary-flat.cdk-keyboard-focused:not(.x-button-disabled){box-shadow:none}.x-button-primary.x-button-activated{z-index:2;color:var(--x-white);background-color:var(--x-primary);border-color:var(--x-primary)}.x-button-primary.x-button-activated .x-button-path{stroke:var(--x-white)}.x-button-primary .x-ripple-element{background-color:var(--x-primary-500)}.x-button-success{color:var(--x-white);background-color:var(--x-success);border-color:var(--x-success)}.x-button-success .x-button-path{stroke:var(--x-white)}.x-button-success:hover:not(.x-button-disabled):not(.x-button-activated),.x-button-success.cdk-program-focused:not(.x-button-disabled),.x-button-success.cdk-keyboard-focused:not(.x-button-disabled){color:var(--x-white);background-color:var(--x-success-100);border-color:var(--x-success-100)}.x-button-success:hover:not(.x-button-disabled):not(.x-button-activated) .x-button-path,.x-button-success.cdk-program-focused:not(.x-button-disabled) .x-button-path,.x-button-success.cdk-keyboard-focused:not(.x-button-disabled) .x-button-path{stroke:var(--x-white)}.x-button-success:hover:not(.x-button-disabled):not(.x-button-activated),.x-button-success.cdk-program-focused:not(.x-button-disabled),.x-button-success.cdk-keyboard-focused:not(.x-button-disabled){box-shadow:var(--x-box-shadow-hover)}.x-button-success:active:not(.x-button-disabled){color:var(--x-white);background-color:var(--x-success);border-color:var(--x-success)}.x-button-success:active:not(.x-button-disabled) .x-button-path{stroke:var(--x-white)}.x-button-success.x-button-disabled{color:var(--x-success-800);cursor:not-allowed;background-image:none;background-color:var(--x-success-500);border-color:var(--x-success-500);box-shadow:none}.x-button-success-plain{color:var(--x-success);background-color:var(--x-success-900);border-color:var(--x-success-600)}.x-button-success-plain .x-button-path{stroke:var(--x-success)}.x-button-success-plain:hover:not(.x-button-disabled):not(.x-button-activated),.x-button-success-plain.cdk-program-focused:not(.x-button-disabled),.x-button-success-plain.cdk-keyboard-focused:not(.x-button-disabled){color:var(--x-white);background-color:var(--x-success);border-color:var(--x-success)}.x-button-success-plain:hover:not(.x-button-disabled):not(.x-button-activated) .x-button-path,.x-button-success-plain.cdk-program-focused:not(.x-button-disabled) .x-button-path,.x-button-success-plain.cdk-keyboard-focused:not(.x-button-disabled) .x-button-path{stroke:var(--x-white)}.x-button-success-plain:active:not(.x-button-disabled){color:var(--x-white);background-color:var(--x-success-a100);border-color:var(--x-success-a100)}.x-button-success-plain:active:not(.x-button-disabled) .x-button-path{stroke:var(--x-white)}.x-button-success-plain.x-button-disabled{color:var(--x-success-400);cursor:not-allowed;background-image:none;background-color:var(--x-success-900);border-color:var(--x-success-800);box-shadow:none}.x-button-success-plain.x-button-activated{z-index:2;color:var(--x-white);background-color:var(--x-success);border-color:var(--x-success)}.x-button-success-plain.x-button-activated .x-button-path{stroke:var(--x-white)}.x-button-success-text{box-shadow:none;color:var(--x-success);background-color:transparent;border-color:var(--x-success-600)}.x-button-success-text .x-button-path{stroke:var(--x-success)}.x-button-success-text:hover:not(.x-button-disabled):not(.x-button-activated),.x-button-success-text.cdk-program-focused:not(.x-button-disabled),.x-button-success-text.cdk-keyboard-focused:not(.x-button-disabled){box-shadow:none;color:var(--x-success);background-color:var(--x-success-900);border-color:var(--x-success-600)}.x-button-success-text:hover:not(.x-button-disabled):not(.x-button-activated) .x-button-path,.x-button-success-text.cdk-program-focused:not(.x-button-disabled) .x-button-path,.x-button-success-text.cdk-keyboard-focused:not(.x-button-disabled) .x-button-path{stroke:var(--x-success)}.x-button-success-text.x-button-disabled{color:var(--x-success-400);cursor:not-allowed;background-image:none;background-color:transparent;border-color:var(--x-success-800);box-shadow:none}.x-button-success-flat{box-shadow:none}.x-button-success-flat:hover:not(.x-button-disabled):not(.x-button-activated),.x-button-success-flat.cdk-program-focused:not(.x-button-disabled),.x-button-success-flat.cdk-keyboard-focused:not(.x-button-disabled){box-shadow:none}.x-button-success.x-button-activated{z-index:2;color:var(--x-white);background-color:var(--x-success);border-color:var(--x-success)}.x-button-success.x-button-activated .x-button-path{stroke:var(--x-white)}.x-button-success .x-ripple-element{background-color:var(--x-success-500)}.x-button-warning{color:var(--x-white);background-color:var(--x-warning);border-color:var(--x-warning)}.x-button-warning .x-button-path{stroke:var(--x-white)}.x-button-warning:hover:not(.x-button-disabled):not(.x-button-activated),.x-button-warning.cdk-program-focused:not(.x-button-disabled),.x-button-warning.cdk-keyboard-focused:not(.x-button-disabled){color:var(--x-white);background-color:var(--x-warning-100);border-color:var(--x-warning-100)}.x-button-warning:hover:not(.x-button-disabled):not(.x-button-activated) .x-button-path,.x-button-warning.cdk-program-focused:not(.x-button-disabled) .x-button-path,.x-button-warning.cdk-keyboard-focused:not(.x-button-disabled) .x-button-path{stroke:var(--x-white)}.x-button-warning:hover:not(.x-button-disabled):not(.x-button-activated),.x-button-warning.cdk-program-focused:not(.x-button-disabled),.x-button-warning.cdk-keyboard-focused:not(.x-button-disabled){box-shadow:var(--x-box-shadow-hover)}.x-button-warning:active:not(.x-button-disabled){color:var(--x-white);background-color:var(--x-warning);border-color:var(--x-warning)}.x-button-warning:active:not(.x-button-disabled) .x-button-path{stroke:var(--x-white)}.x-button-warning.x-button-disabled{color:var(--x-warning-800);cursor:not-allowed;background-image:none;background-color:var(--x-warning-500);border-color:var(--x-warning-500);box-shadow:none}.x-button-warning-plain{color:var(--x-warning);background-color:var(--x-warning-900);border-color:var(--x-warning-600)}.x-button-warning-plain .x-button-path{stroke:var(--x-warning)}.x-button-warning-plain:hover:not(.x-button-disabled):not(.x-button-activated),.x-button-warning-plain.cdk-program-focused:not(.x-button-disabled),.x-button-warning-plain.cdk-keyboard-focused:not(.x-button-disabled){color:var(--x-white);background-color:var(--x-warning);border-color:var(--x-warning)}.x-button-warning-plain:hover:not(.x-button-disabled):not(.x-button-activated) .x-button-path,.x-button-warning-plain.cdk-program-focused:not(.x-button-disabled) .x-button-path,.x-button-warning-plain.cdk-keyboard-focused:not(.x-button-disabled) .x-button-path{stroke:var(--x-white)}.x-button-warning-plain:active:not(.x-button-disabled){color:var(--x-white);background-color:var(--x-warning-a100);border-color:var(--x-warning-a100)}.x-button-warning-plain:active:not(.x-button-disabled) .x-button-path{stroke:var(--x-white)}.x-button-warning-plain.x-button-disabled{color:var(--x-warning-400);cursor:not-allowed;background-image:none;background-color:var(--x-warning-900);border-color:var(--x-warning-800);box-shadow:none}.x-button-warning-plain.x-button-activated{z-index:2;color:var(--x-white);background-color:var(--x-warning);border-color:var(--x-warning)}.x-button-warning-plain.x-button-activated .x-button-path{stroke:var(--x-white)}.x-button-warning-text{box-shadow:none;color:var(--x-warning);background-color:transparent;border-color:var(--x-warning-600)}.x-button-warning-text .x-button-path{stroke:var(--x-warning)}.x-button-warning-text:hover:not(.x-button-disabled):not(.x-button-activated),.x-button-warning-text.cdk-program-focused:not(.x-button-disabled),.x-button-warning-text.cdk-keyboard-focused:not(.x-button-disabled){box-shadow:none;color:var(--x-warning);background-color:var(--x-warning-900);border-color:var(--x-warning-600)}.x-button-warning-text:hover:not(.x-button-disabled):not(.x-button-activated) .x-button-path,.x-button-warning-text.cdk-program-focused:not(.x-button-disabled) .x-button-path,.x-button-warning-text.cdk-keyboard-focused:not(.x-button-disabled) .x-button-path{stroke:var(--x-warning)}.x-button-warning-text.x-button-disabled{color:var(--x-warning-400);cursor:not-allowed;background-image:none;background-color:transparent;border-color:var(--x-warning-800);box-shadow:none}.x-button-warning-flat{box-shadow:none}.x-button-warning-flat:hover:not(.x-button-disabled):not(.x-button-activated),.x-button-warning-flat.cdk-program-focused:not(.x-button-disabled),.x-button-warning-flat.cdk-keyboard-focused:not(.x-button-disabled){box-shadow:none}.x-button-warning.x-button-activated{z-index:2;color:var(--x-white);background-color:var(--x-warning);border-color:var(--x-warning)}.x-button-warning.x-button-activated .x-button-path{stroke:var(--x-white)}.x-button-warning .x-ripple-element{background-color:var(--x-warning-500)}.x-button-danger{color:var(--x-white);background-color:var(--x-danger);border-color:var(--x-danger)}.x-button-danger .x-button-path{stroke:var(--x-white)}.x-button-danger:hover:not(.x-button-disabled):not(.x-button-activated),.x-button-danger.cdk-program-focused:not(.x-button-disabled),.x-button-danger.cdk-keyboard-focused:not(.x-button-disabled){color:var(--x-white);background-color:var(--x-danger-100);border-color:var(--x-danger-100)}.x-button-danger:hover:not(.x-button-disabled):not(.x-button-activated) .x-button-path,.x-button-danger.cdk-program-focused:not(.x-button-disabled) .x-button-path,.x-button-danger.cdk-keyboard-focused:not(.x-button-disabled) .x-button-path{stroke:var(--x-white)}.x-button-danger:hover:not(.x-button-disabled):not(.x-button-activated),.x-button-danger.cdk-program-focused:not(.x-button-disabled),.x-button-danger.cdk-keyboard-focused:not(.x-button-disabled){box-shadow:var(--x-box-shadow-hover)}.x-button-danger:active:not(.x-button-disabled){color:var(--x-white);background-color:var(--x-danger);border-color:var(--x-danger)}.x-button-danger:active:not(.x-button-disabled) .x-button-path{stroke:var(--x-white)}.x-button-danger.x-button-disabled{color:var(--x-danger-800);cursor:not-allowed;background-image:none;background-color:var(--x-danger-500);border-color:var(--x-danger-500);box-shadow:none}.x-button-danger-plain{color:var(--x-danger);background-color:var(--x-danger-900);border-color:var(--x-danger-600)}.x-button-danger-plain .x-button-path{stroke:var(--x-danger)}.x-button-danger-plain:hover:not(.x-button-disabled):not(.x-button-activated),.x-button-danger-plain.cdk-program-focused:not(.x-button-disabled),.x-button-danger-plain.cdk-keyboard-focused:not(.x-button-disabled){color:var(--x-white);background-color:var(--x-danger);border-color:var(--x-danger)}.x-button-danger-plain:hover:not(.x-button-disabled):not(.x-button-activated) .x-button-path,.x-button-danger-plain.cdk-program-focused:not(.x-button-disabled) .x-button-path,.x-button-danger-plain.cdk-keyboard-focused:not(.x-button-disabled) .x-button-path{stroke:var(--x-white)}.x-button-danger-plain:active:not(.x-button-disabled){color:var(--x-white);background-color:var(--x-danger-a100);border-color:var(--x-danger-a100)}.x-button-danger-plain:active:not(.x-button-disabled) .x-button-path{stroke:var(--x-white)}.x-button-danger-plain.x-button-disabled{color:var(--x-danger-400);cursor:not-allowed;background-image:none;background-color:var(--x-danger-900);border-color:var(--x-danger-800);box-shadow:none}.x-button-danger-plain.x-button-activated{z-index:2;color:var(--x-white);background-color:var(--x-danger);border-color:var(--x-danger)}.x-button-danger-plain.x-button-activated .x-button-path{stroke:var(--x-white)}.x-button-danger-text{box-shadow:none;color:var(--x-danger);background-color:transparent;border-color:var(--x-danger-600)}.x-button-danger-text .x-button-path{stroke:var(--x-danger)}.x-button-danger-text:hover:not(.x-button-disabled):not(.x-button-activated),.x-button-danger-text.cdk-program-focused:not(.x-button-disabled),.x-button-danger-text.cdk-keyboard-focused:not(.x-button-disabled){box-shadow:none;color:var(--x-danger);background-color:var(--x-danger-900);border-color:var(--x-danger-600)}.x-button-danger-text:hover:not(.x-button-disabled):not(.x-button-activated) .x-button-path,.x-button-danger-text.cdk-program-focused:not(.x-button-disabled) .x-button-path,.x-button-danger-text.cdk-keyboard-focused:not(.x-button-disabled) .x-button-path{stroke:var(--x-danger)}.x-button-danger-text.x-button-disabled{color:var(--x-danger-400);cursor:not-allowed;background-image:none;background-color:transparent;border-color:var(--x-danger-800);box-shadow:none}.x-button-danger-flat{box-shadow:none}.x-button-danger-flat:hover:not(.x-button-disabled):not(.x-button-activated),.x-button-danger-flat.cdk-program-focused:not(.x-button-disabled),.x-button-danger-flat.cdk-keyboard-focused:not(.x-button-disabled){box-shadow:none}.x-button-danger.x-button-activated{z-index:2;color:var(--x-white);background-color:var(--x-danger);border-color:var(--x-danger)}.x-button-danger.x-button-activated .x-button-path{stroke:var(--x-white)}.x-button-danger .x-ripple-element{background-color:var(--x-danger-500)}.x-button-info{color:var(--x-white);background-color:var(--x-info);border-color:var(--x-info)}.x-button-info .x-button-path{stroke:var(--x-white)}.x-button-info:hover:not(.x-button-disabled):not(.x-button-activated),.x-button-info.cdk-program-focused:not(.x-button-disabled),.x-button-info.cdk-keyboard-focused:not(.x-button-disabled){color:var(--x-white);background-color:var(--x-info-100);border-color:var(--x-info-100)}.x-button-info:hover:not(.x-button-disabled):not(.x-button-activated) .x-button-path,.x-button-info.cdk-program-focused:not(.x-button-disabled) .x-button-path,.x-button-info.cdk-keyboard-focused:not(.x-button-disabled) .x-button-path{stroke:var(--x-white)}.x-button-info:hover:not(.x-button-disabled):not(.x-button-activated),.x-button-info.cdk-program-focused:not(.x-button-disabled),.x-button-info.cdk-keyboard-focused:not(.x-button-disabled){box-shadow:var(--x-box-shadow-hover)}.x-button-info:active:not(.x-button-disabled){color:var(--x-white);background-color:var(--x-info);border-color:var(--x-info)}.x-button-info:active:not(.x-button-disabled) .x-button-path{stroke:var(--x-white)}.x-button-info.x-button-disabled{color:var(--x-info-800);cursor:not-allowed;background-image:none;background-color:var(--x-info-500);border-color:var(--x-info-500);box-shadow:none}.x-button-info-plain{color:var(--x-info);background-color:var(--x-info-900);border-color:var(--x-info-600)}.x-button-info-plain .x-button-path{stroke:var(--x-info)}.x-button-info-plain:hover:not(.x-button-disabled):not(.x-button-activated),.x-button-info-plain.cdk-program-focused:not(.x-button-disabled),.x-button-info-plain.cdk-keyboard-focused:not(.x-button-disabled){color:var(--x-white);background-color:var(--x-info);border-color:var(--x-info)}.x-button-info-plain:hover:not(.x-button-disabled):not(.x-button-activated) .x-button-path,.x-button-info-plain.cdk-program-focused:not(.x-button-disabled) .x-button-path,.x-button-info-plain.cdk-keyboard-focused:not(.x-button-disabled) .x-button-path{stroke:var(--x-white)}.x-button-info-plain:active:not(.x-button-disabled){color:var(--x-white);background-color:var(--x-info-a100);border-color:var(--x-info-a100)}.x-button-info-plain:active:not(.x-button-disabled) .x-button-path{stroke:var(--x-white)}.x-button-info-plain.x-button-disabled{color:var(--x-info-400);cursor:not-allowed;background-image:none;background-color:var(--x-info-900);border-color:var(--x-info-800);box-shadow:none}.x-button-info-plain.x-button-activated{z-index:2;color:var(--x-white);background-color:var(--x-info);border-color:var(--x-info)}.x-button-info-plain.x-button-activated .x-button-path{stroke:var(--x-white)}.x-button-info-text{box-shadow:none;color:var(--x-info);background-color:transparent;border-color:var(--x-info-600)}.x-button-info-text .x-button-path{stroke:var(--x-info)}.x-button-info-text:hover:not(.x-button-disabled):not(.x-button-activated),.x-button-info-text.cdk-program-focused:not(.x-button-disabled),.x-button-info-text.cdk-keyboard-focused:not(.x-button-disabled){box-shadow:none;color:var(--x-info);background-color:var(--x-info-900);border-color:var(--x-info-600)}.x-button-info-text:hover:not(.x-button-disabled):not(.x-button-activated) .x-button-path,.x-button-info-text.cdk-program-focused:not(.x-button-disabled) .x-button-path,.x-button-info-text.cdk-keyboard-focused:not(.x-button-disabled) .x-button-path{stroke:var(--x-info)}.x-button-info-text.x-button-disabled{color:var(--x-info-400);cursor:not-allowed;background-image:none;background-color:transparent;border-color:var(--x-info-800);box-shadow:none}.x-button-info-flat{box-shadow:none}.x-button-info-flat:hover:not(.x-button-disabled):not(.x-button-activated),.x-button-info-flat.cdk-program-focused:not(.x-button-disabled),.x-button-info-flat.cdk-keyboard-focused:not(.x-button-disabled){box-shadow:none}.x-button-info.x-button-activated{z-index:2;color:var(--x-white);background-color:var(--x-info);border-color:var(--x-info)}.x-button-info.x-button-activated .x-button-path{stroke:var(--x-white)}.x-button-info .x-ripple-element{background-color:var(--x-info-500)}\n"] }]
         }], ctorParameters: () => [], propDecorators: { buttonRef: [{ type: i0.ViewChild, args: ['buttonRef', { ...{ read: (ElementRef) }, isSignal: true }] }], contentRef: [{ type: i0.ViewChild, args: ['content', { ...{ read: (ElementRef) }, isSignal: true }] }], marginLeft: [{
@@ -449,11 +449,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.5", ngImpor
             }] } });
 
 class XButtonModule {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.5", ngImport: i0, type: XButtonModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    /** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.5", ngImport: i0, type: XButtonModule, imports: [XButtonComponent, XButtonsComponent], exports: [XButtonComponent, XButtonsComponent] }); }
-    /** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.5", ngImport: i0, type: XButtonModule, imports: [XButtonComponent] }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: XButtonModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    /** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.0.0", ngImport: i0, type: XButtonModule, imports: [XButtonComponent, XButtonsComponent], exports: [XButtonComponent, XButtonsComponent] }); }
+    /** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: XButtonModule, imports: [XButtonComponent] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.5", ngImport: i0, type: XButtonModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: XButtonModule, decorators: [{
             type: NgModule,
             args: [{
                     exports: [XButtonComponent, XButtonsComponent],

package/fesm2022/ng-nest-ui-calendar.mjs

@@ -112,10 +112,10 @@ class XCalendarProperty extends XPropertyFunction(X_CALENDAR_CONFIG_NAME) {
          */
         this.rangeChange = output();
     }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.5", ngImport: i0, type: XCalendarProperty, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.3.5", type: XCalendarProperty, isStandalone: true, selector: "x-calendar-property", inputs: { data: { classPropertyName: "data", publicName: "data", isSignal: true, isRequired: false, transformFunction: null }, model: { classPropertyName: "model", publicName: "model", isSignal: true, isRequired: false, transformFunction: null }, displayType: { classPropertyName: "displayType", publicName: "displayType", isSignal: true, isRequired: false, transformFunction: null }, headerLeftTemp: { classPropertyName: "headerLeftTemp", publicName: "headerLeftTemp", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { dateChange: "dateChange", rangeChange: "rangeChange" }, usesInheritance: true, ngImport: i0, template: '', isInline: true }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: XCalendarProperty, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.0.0", type: XCalendarProperty, isStandalone: true, selector: "x-calendar-property", inputs: { data: { classPropertyName: "data", publicName: "data", isSignal: true, isRequired: false, transformFunction: null }, model: { classPropertyName: "model", publicName: "model", isSignal: true, isRequired: false, transformFunction: null }, displayType: { classPropertyName: "displayType", publicName: "displayType", isSignal: true, isRequired: false, transformFunction: null }, headerLeftTemp: { classPropertyName: "headerLeftTemp", publicName: "headerLeftTemp", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { dateChange: "dateChange", rangeChange: "rangeChange" }, usesInheritance: true, ngImport: i0, template: '', isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.5", ngImport: i0, type: XCalendarProperty, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: XCalendarProperty, decorators: [{
             type: Component,
             args: [{ selector: `${XCalendarPrefix}-property`, template: '' }]
         }], propDecorators: { data: [{ type: i0.Input, args: [{ isSignal: true, alias: "data", required: false }] }], model: [{ type: i0.Input, args: [{ isSignal: true, alias: "model", required: false }] }], displayType: [{ type: i0.Input, args: [{ isSignal: true, alias: "displayType", required: false }] }], headerLeftTemp: [{ type: i0.Input, args: [{ isSignal: true, alias: "headerLeftTemp", required: false }] }], dateChange: [{ type: i0.Output, args: ["dateChange"] }], rangeChange: [{ type: i0.Output, args: ["rangeChange"] }] } });
@@ -195,10 +195,10 @@ class XCalendarComponent extends XCalendarProperty {
     getMonth(date) {
         return this.monthData()?.[this.datePipe.transform(date, 'yyyy-MM')];
     }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.5", ngImport: i0, type: XCalendarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.5", type: XCalendarComponent, isStandalone: true, selector: "x-calendar", providers: [DatePipe, LowerCasePipe], usesInheritance: true, ngImport: i0, template: "<div #calendar class=\"x-calendar\" [ngClass]=\"classMap()\">\r\n  <div class=\"x-calendar-header\">\r\n    <div class=\"x-calendar-header-left\">\r\n      @if (headerLeftTemp()) {\r\n        <ng-container *ngTemplateOutlet=\"headerLeftTemp()!\"></ng-container>\r\n      }\r\n    </div>\r\n    <div class=\"x-calendar-header-right\">\r\n      <x-date-picker\r\n        [(ngModel)]=\"datetime\"\r\n        [type]=\"modelSignal()\"\r\n        showHeader=\"false\"\r\n        [clearable]=\"false\"\r\n      ></x-date-picker>\r\n      <x-buttons [boxShadow]=\"false\">\r\n        <x-button (click)=\"action(-1)\" plain>{{\r\n          modelSignal() === 'month' ? locale().lastMonth : locale().lastYear\r\n        }}</x-button>\r\n        <x-button (click)=\"action(1)\" plain>{{\r\n          modelSignal() === 'month' ? locale().nextMonth : locale().nextYear\r\n        }}</x-button>\r\n      </x-buttons>\r\n      <x-radio [data]=\"radioData()\" [(ngModel)]=\"modelSignal\" button></x-radio>\r\n    </div>\r\n  </div>\r\n  <div class=\"x-calendar-body\">\r\n    @if (modelSignal() === 'month') {\r\n      <x-picker-date\r\n        [display]=\"datetime()\"\r\n        (modelChange)=\"dateOnChange($event!)\"\r\n        (rangeChange)=\"rangeOnChange($event)\"\r\n        [dateTemp]=\"dateTemp\"\r\n        showHeader=\"false\"\r\n      ></x-picker-date>\r\n    }\r\n    @if (modelSignal() === 'year') {\r\n      <x-picker-month\r\n        [display]=\"datetime()\"\r\n        (modelChange)=\"dateOnChange($event!)\"\r\n        (rangeChange)=\"rangeOnChange($event)\"\r\n        [monthTemp]=\"monthTemp\"\r\n        showHeader=\"false\"\r\n      ></x-picker-month>\r\n    }\r\n  </div>\r\n</div>\r\n\r\n<ng-template #dateTemp let-date=\"date$\">\r\n  <div class=\"x-calendar-date\" [class.x-activated]=\"(date | date: 'yyyyMMdd') === (activatedDate() | date: 'yyyyMMdd')\">\r\n    <span [title]=\"date | date: 'yyyy-MM-dd'\">{{ date | date: 'd' }}</span>\r\n    @if (displayType() === 'calendar') {\r\n      <div class=\"x-calendar-date-content\">\r\n        @if (getDate(date)) {\r\n          <ul>\r\n            @for (item of getDate(date); track item.id + item.label) {\r\n              <li>\r\n                <span [title]=\"item.id + item.label\">{{ item.id }}{{ item.label }}</span>\r\n              </li>\r\n            }\r\n          </ul>\r\n        }\r\n      </div>\r\n    }\r\n  </div>\r\n</ng-template>\r\n\r\n<ng-template #monthTemp let-date=\"date$\">\r\n  <div class=\"x-calendar-month\" [class.x-activated]=\"(date | date: 'yyyyMM') === (activatedDate() | date: 'yyyyMM')\">\r\n    <span [title]=\"date | date: 'yyyy-MM'\">{{ getLocaleMonth(date) }}</span>\r\n    @if (displayType() === 'calendar') {\r\n      <div class=\"x-calendar-month-content\">\r\n        @if (getMonth(date)) {\r\n          <ul>\r\n            @for (item of getMonth(date); track item.id) {\r\n              <li>\r\n                <x-link x-tooltip [content]=\"item.label\" placement=\"top\">{{ item.id }}</x-link>\r\n              </li>\r\n            }\r\n          </ul>\r\n        }\r\n      </div>\r\n    }\r\n  </div>\r\n</ng-template>\r\n", styles: ["x-calendar{display:inline-block}.x-calendar{margin:0;padding:0}.x-calendar{box-sizing:border-box}.x-calendar-header{display:flex;align-items:center;justify-content:space-between}.x-calendar-header-right{display:flex;align-items:center;justify-content:flex-end}.x-calendar-header-right>x-date-picker{display:inline-block;width:8rem}.x-calendar-header-right>x-buttons,.x-calendar-header-right>x-radio{margin-left:.5rem}.x-calendar-body>x-picker-date .x-picker-date tr,.x-calendar-body>x-picker-month .x-picker-month tr{display:flex}.x-calendar-body>x-picker-date .x-picker-date tr th,.x-calendar-body>x-picker-month .x-picker-month tr th{padding:.325rem;margin:0 .25rem;display:inline-block;flex:1;overflow:hidden}.x-calendar-body>x-picker-date .x-picker-date tr td,.x-calendar-body>x-picker-month .x-picker-month tr td{padding:0;cursor:pointer;position:relative;flex:1;overflow:hidden;margin:0 .25rem;transition:.3s}.x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-date>span,.x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-month>span,.x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-date>span,.x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-month>span{display:block}.x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-date-content,.x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-month-content,.x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-date-content,.x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-month-content{padding-left:.325rem;position:static;width:auto;overflow-y:auto}.x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-date-content ul,.x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-date-content li,.x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-month-content ul,.x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-month-content li,.x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-date-content ul,.x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-date-content li,.x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-month-content ul,.x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-month-content li{margin:0;padding:0;list-style:none}.x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-date-content>ul li,.x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-month-content>ul li,.x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-date-content>ul li,.x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-month-content>ul li{line-height:1.5;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;width:100%;display:inline-block;position:relative}.x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-date-content>ul li>span,.x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-month-content>ul li>span,.x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-date-content>ul li>span,.x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-month-content>ul li>span{width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.x-calendar-calendar{margin:.25rem -.25rem 0}.x-calendar-calendar .x-calendar-body>x-picker-date .x-picker-date tr th,.x-calendar-calendar .x-calendar-body>x-picker-month .x-picker-month tr th{height:2.25rem;line-height:2.25rem;text-align:right}.x-calendar-calendar .x-calendar-body>x-picker-date .x-picker-date tr td,.x-calendar-calendar .x-calendar-body>x-picker-month .x-picker-month tr td{height:6.75rem;border-top:var(--x-border-width) var(--x-border-style) var(--x-border);text-align:left}.x-calendar-calendar .x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-date>span,.x-calendar-calendar .x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-month>span,.x-calendar-calendar .x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-date>span,.x-calendar-calendar .x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-month>span{text-align:right;padding:.325rem}.x-calendar-calendar .x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-date-content,.x-calendar-calendar .x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-month-content,.x-calendar-calendar .x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-date-content,.x-calendar-calendar .x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-month-content{height:4.5rem}.x-calendar-calendar .x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-date.x-activated,.x-calendar-calendar .x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-month.x-activated,.x-calendar-calendar .x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-date.x-activated,.x-calendar-calendar .x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-month.x-activated{background-color:var(--x-primary-900)}.x-calendar-calendar .x-calendar-body>x-picker-date .x-picker-date tr td:hover,.x-calendar-calendar .x-calendar-body>x-picker-month .x-picker-month tr td:hover{background-color:var(--x-background-a200)}.x-calendar-calendar .x-calendar-body>x-picker-date .x-picker-date tr td.x-date-last-or-next,.x-calendar-calendar .x-calendar-body>x-picker-month .x-picker-month tr td.x-date-last-or-next{color:var(--x-text-400)}.x-calendar-calendar .x-calendar-body>x-picker-date .x-picker-date tr td.x-date-now,.x-calendar-calendar .x-calendar-body>x-picker-month .x-picker-month tr td.x-date-now{color:var(--x-primary);border-top-color:var(--x-primary)}.x-calendar-calendar .x-calendar-body .x-picker-date-body>table td:first-child,.x-calendar-calendar .x-calendar-body .x-picker-date-body>table td:last-child{border-radius:0}.x-calendar-card{border:var(--x-border-width) var(--x-border-style) var(--x-border);border-radius:var(--x-border-radius)}.x-calendar-card .x-calendar-header{padding:.5rem;border-bottom:var(--x-border-width) var(--x-border-style) var(--x-border);justify-content:center}.x-calendar-card .x-calendar-body>x-picker-date .x-picker-date tr td,.x-calendar-card .x-calendar-body>x-picker-month .x-picker-month tr td{margin:.25rem}.x-calendar-card .x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-date,.x-calendar-card .x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-month,.x-calendar-card .x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-date,.x-calendar-card .x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-month{border:var(--x-border-width) var(--x-border-style) var(--x-border);border-color:transparent}.x-calendar-card .x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-date>span,.x-calendar-card .x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-month>span,.x-calendar-card .x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-date>span,.x-calendar-card .x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-month>span{padding:.125rem}.x-calendar-card .x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-date.x-activated,.x-calendar-card .x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-month.x-activated,.x-calendar-card .x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-date.x-activated,.x-calendar-card .x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-month.x-activated{background-color:var(--x-primary);color:var(--x-background-100)}.x-calendar-card .x-calendar-body>x-picker-date .x-picker-date tr td:hover,.x-calendar-card .x-calendar-body>x-picker-month .x-picker-month tr td:hover{background-color:var(--x-background-a200);color:var(--x-primary)}.x-calendar-card .x-calendar-body>x-picker-date .x-picker-date tr td.x-date-last-or-next,.x-calendar-card .x-calendar-body>x-picker-month .x-picker-month tr td.x-date-last-or-next{color:var(--x-text-700)}.x-calendar-card .x-calendar-body>x-picker-date .x-picker-date tr td.x-date-now .x-calendar-date:not(.x-activated),.x-calendar-card .x-calendar-body>x-picker-date .x-picker-date tr td.x-date-now .x-calendar-month:not(.x-activated),.x-calendar-card .x-calendar-body>x-picker-month .x-picker-month tr td.x-date-now .x-calendar-date:not(.x-activated),.x-calendar-card .x-calendar-body>x-picker-month .x-picker-month tr td.x-date-now .x-calendar-month:not(.x-activated){color:var(--x-primary);background-color:transparent;border-color:var(--x-primary)}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: XLinkComponent, selector: "x-link" }, { kind: "directive", type: XTooltipDirective, selector: "[x-tooltip], x-tooltip" }, { kind: "component", type: XRadioComponent, selector: "x-radio" }, { kind: "component", type: XDatePickerComponent, selector: "x-date-picker" }, { kind: "component", type: XPickerDateComponent, selector: "x-picker-date" }, { kind: "component", type: XPickerMonthComponent, selector: "x-picker-month" }, { kind: "component", type: XButtonComponent, selector: "x-button" }, { kind: "component", type: XButtonsComponent, selector: "x-buttons" }, { kind: "pipe", type: DatePipe, name: "date" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: XCalendarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.0", type: XCalendarComponent, isStandalone: true, selector: "x-calendar", providers: [DatePipe, LowerCasePipe], usesInheritance: true, ngImport: i0, template: "<div #calendar class=\"x-calendar\" [ngClass]=\"classMap()\">\r\n  <div class=\"x-calendar-header\">\r\n    <div class=\"x-calendar-header-left\">\r\n      @if (headerLeftTemp()) {\r\n        <ng-container *ngTemplateOutlet=\"headerLeftTemp()!\"></ng-container>\r\n      }\r\n    </div>\r\n    <div class=\"x-calendar-header-right\">\r\n      <x-date-picker\r\n        [(ngModel)]=\"datetime\"\r\n        [type]=\"modelSignal()\"\r\n        showHeader=\"false\"\r\n        [clearable]=\"false\"\r\n      ></x-date-picker>\r\n      <x-buttons [boxShadow]=\"false\">\r\n        <x-button (click)=\"action(-1)\" plain>{{\r\n          modelSignal() === 'month' ? locale().lastMonth : locale().lastYear\r\n        }}</x-button>\r\n        <x-button (click)=\"action(1)\" plain>{{\r\n          modelSignal() === 'month' ? locale().nextMonth : locale().nextYear\r\n        }}</x-button>\r\n      </x-buttons>\r\n      <x-radio [data]=\"radioData()\" [(ngModel)]=\"modelSignal\" button></x-radio>\r\n    </div>\r\n  </div>\r\n  <div class=\"x-calendar-body\">\r\n    @if (modelSignal() === 'month') {\r\n      <x-picker-date\r\n        [display]=\"datetime()\"\r\n        (modelChange)=\"dateOnChange($event!)\"\r\n        (rangeChange)=\"rangeOnChange($event)\"\r\n        [dateTemp]=\"dateTemp\"\r\n        showHeader=\"false\"\r\n      ></x-picker-date>\r\n    }\r\n    @if (modelSignal() === 'year') {\r\n      <x-picker-month\r\n        [display]=\"datetime()\"\r\n        (modelChange)=\"dateOnChange($event!)\"\r\n        (rangeChange)=\"rangeOnChange($event)\"\r\n        [monthTemp]=\"monthTemp\"\r\n        showHeader=\"false\"\r\n      ></x-picker-month>\r\n    }\r\n  </div>\r\n</div>\r\n\r\n<ng-template #dateTemp let-date=\"date$\">\r\n  <div class=\"x-calendar-date\" [class.x-activated]=\"(date | date: 'yyyyMMdd') === (activatedDate() | date: 'yyyyMMdd')\">\r\n    <span [title]=\"date | date: 'yyyy-MM-dd'\">{{ date | date: 'd' }}</span>\r\n    @if (displayType() === 'calendar') {\r\n      <div class=\"x-calendar-date-content\">\r\n        @if (getDate(date)) {\r\n          <ul>\r\n            @for (item of getDate(date); track item.id + item.label) {\r\n              <li>\r\n                <span [title]=\"item.id + item.label\">{{ item.id }}{{ item.label }}</span>\r\n              </li>\r\n            }\r\n          </ul>\r\n        }\r\n      </div>\r\n    }\r\n  </div>\r\n</ng-template>\r\n\r\n<ng-template #monthTemp let-date=\"date$\">\r\n  <div class=\"x-calendar-month\" [class.x-activated]=\"(date | date: 'yyyyMM') === (activatedDate() | date: 'yyyyMM')\">\r\n    <span [title]=\"date | date: 'yyyy-MM'\">{{ getLocaleMonth(date) }}</span>\r\n    @if (displayType() === 'calendar') {\r\n      <div class=\"x-calendar-month-content\">\r\n        @if (getMonth(date)) {\r\n          <ul>\r\n            @for (item of getMonth(date); track item.id) {\r\n              <li>\r\n                <x-link x-tooltip [content]=\"item.label\" placement=\"top\">{{ item.id }}</x-link>\r\n              </li>\r\n            }\r\n          </ul>\r\n        }\r\n      </div>\r\n    }\r\n  </div>\r\n</ng-template>\r\n", styles: ["x-calendar{display:inline-block}.x-calendar{margin:0;padding:0}.x-calendar{box-sizing:border-box}.x-calendar-header{display:flex;align-items:center;justify-content:space-between}.x-calendar-header-right{display:flex;align-items:center;justify-content:flex-end}.x-calendar-header-right>x-date-picker{display:inline-block;width:8rem}.x-calendar-header-right>x-buttons,.x-calendar-header-right>x-radio{margin-left:.5rem}.x-calendar-body>x-picker-date .x-picker-date tr,.x-calendar-body>x-picker-month .x-picker-month tr{display:flex}.x-calendar-body>x-picker-date .x-picker-date tr th,.x-calendar-body>x-picker-month .x-picker-month tr th{padding:.325rem;margin:0 .25rem;display:inline-block;flex:1;overflow:hidden}.x-calendar-body>x-picker-date .x-picker-date tr td,.x-calendar-body>x-picker-month .x-picker-month tr td{padding:0;cursor:pointer;position:relative;flex:1;overflow:hidden;margin:0 .25rem;transition:.3s}.x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-date>span,.x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-month>span,.x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-date>span,.x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-month>span{display:block}.x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-date-content,.x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-month-content,.x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-date-content,.x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-month-content{padding-left:.325rem;position:static;width:auto;overflow-y:auto}.x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-date-content ul,.x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-date-content li,.x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-month-content ul,.x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-month-content li,.x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-date-content ul,.x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-date-content li,.x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-month-content ul,.x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-month-content li{margin:0;padding:0;list-style:none}.x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-date-content>ul li,.x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-month-content>ul li,.x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-date-content>ul li,.x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-month-content>ul li{line-height:1.5;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;width:100%;display:inline-block;position:relative}.x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-date-content>ul li>span,.x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-month-content>ul li>span,.x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-date-content>ul li>span,.x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-month-content>ul li>span{width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.x-calendar-calendar{margin:.25rem -.25rem 0}.x-calendar-calendar .x-calendar-body>x-picker-date .x-picker-date tr th,.x-calendar-calendar .x-calendar-body>x-picker-month .x-picker-month tr th{height:2.25rem;line-height:2.25rem;text-align:right}.x-calendar-calendar .x-calendar-body>x-picker-date .x-picker-date tr td,.x-calendar-calendar .x-calendar-body>x-picker-month .x-picker-month tr td{height:6.75rem;border-top:var(--x-border-width) var(--x-border-style) var(--x-border);text-align:left}.x-calendar-calendar .x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-date>span,.x-calendar-calendar .x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-month>span,.x-calendar-calendar .x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-date>span,.x-calendar-calendar .x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-month>span{text-align:right;padding:.325rem}.x-calendar-calendar .x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-date-content,.x-calendar-calendar .x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-month-content,.x-calendar-calendar .x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-date-content,.x-calendar-calendar .x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-month-content{height:4.5rem}.x-calendar-calendar .x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-date.x-activated,.x-calendar-calendar .x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-month.x-activated,.x-calendar-calendar .x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-date.x-activated,.x-calendar-calendar .x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-month.x-activated{background-color:var(--x-primary-900)}.x-calendar-calendar .x-calendar-body>x-picker-date .x-picker-date tr td:hover,.x-calendar-calendar .x-calendar-body>x-picker-month .x-picker-month tr td:hover{background-color:var(--x-background-a200)}.x-calendar-calendar .x-calendar-body>x-picker-date .x-picker-date tr td.x-date-last-or-next,.x-calendar-calendar .x-calendar-body>x-picker-month .x-picker-month tr td.x-date-last-or-next{color:var(--x-text-400)}.x-calendar-calendar .x-calendar-body>x-picker-date .x-picker-date tr td.x-date-now,.x-calendar-calendar .x-calendar-body>x-picker-month .x-picker-month tr td.x-date-now{color:var(--x-primary);border-top-color:var(--x-primary)}.x-calendar-calendar .x-calendar-body .x-picker-date-body>table td:first-child,.x-calendar-calendar .x-calendar-body .x-picker-date-body>table td:last-child{border-radius:0}.x-calendar-card{border:var(--x-border-width) var(--x-border-style) var(--x-border);border-radius:var(--x-border-radius)}.x-calendar-card .x-calendar-header{padding:.5rem;border-bottom:var(--x-border-width) var(--x-border-style) var(--x-border);justify-content:center}.x-calendar-card .x-calendar-body>x-picker-date .x-picker-date tr td,.x-calendar-card .x-calendar-body>x-picker-month .x-picker-month tr td{margin:.25rem}.x-calendar-card .x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-date,.x-calendar-card .x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-month,.x-calendar-card .x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-date,.x-calendar-card .x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-month{border:var(--x-border-width) var(--x-border-style) var(--x-border);border-color:transparent}.x-calendar-card .x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-date>span,.x-calendar-card .x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-month>span,.x-calendar-card .x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-date>span,.x-calendar-card .x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-month>span{padding:.125rem}.x-calendar-card .x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-date.x-activated,.x-calendar-card .x-calendar-body>x-picker-date .x-picker-date tr td .x-calendar-month.x-activated,.x-calendar-card .x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-date.x-activated,.x-calendar-card .x-calendar-body>x-picker-month .x-picker-month tr td .x-calendar-month.x-activated{background-color:var(--x-primary);color:var(--x-background-100)}.x-calendar-card .x-calendar-body>x-picker-date .x-picker-date tr td:hover,.x-calendar-card .x-calendar-body>x-picker-month .x-picker-month tr td:hover{background-color:var(--x-background-a200);color:var(--x-primary)}.x-calendar-card .x-calendar-body>x-picker-date .x-picker-date tr td.x-date-last-or-next,.x-calendar-card .x-calendar-body>x-picker-month .x-picker-month tr td.x-date-last-or-next{color:var(--x-text-700)}.x-calendar-card .x-calendar-body>x-picker-date .x-picker-date tr td.x-date-now .x-calendar-date:not(.x-activated),.x-calendar-card .x-calendar-body>x-picker-date .x-picker-date tr td.x-date-now .x-calendar-month:not(.x-activated),.x-calendar-card .x-calendar-body>x-picker-month .x-picker-month tr td.x-date-now .x-calendar-date:not(.x-activated),.x-calendar-card .x-calendar-body>x-picker-month .x-picker-month tr td.x-date-now .x-calendar-month:not(.x-activated){color:var(--x-primary);background-color:transparent;border-color:var(--x-primary)}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: XLinkComponent, selector: "x-link" }, { kind: "directive", type: XTooltipDirective, selector: "[x-tooltip], x-tooltip" }, { kind: "component", type: XRadioComponent, selector: "x-radio" }, { kind: "component", type: XDatePickerComponent, selector: "x-date-picker" }, { kind: "component", type: XPickerDateComponent, selector: "x-picker-date" }, { kind: "component", type: XPickerMonthComponent, selector: "x-picker-month" }, { kind: "component", type: XButtonComponent, selector: "x-button" }, { kind: "component", type: XButtonsComponent, selector: "x-buttons" }, { kind: "pipe", type: DatePipe, name: "date" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.5", ngImport: i0, type: XCalendarComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: XCalendarComponent, decorators: [{
             type: Component,
             args: [{ selector: `${XCalendarPrefix}`, imports: [
                         NgClass,
@@ -217,11 +217,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.5", ngImpor
         }], ctorParameters: () => [] });
 
 class XCalendarModule {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.5", ngImport: i0, type: XCalendarModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    /** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.5", ngImport: i0, type: XCalendarModule, imports: [XCalendarComponent], exports: [XCalendarComponent] }); }
-    /** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.5", ngImport: i0, type: XCalendarModule, imports: [XCalendarComponent] }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: XCalendarModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    /** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.0.0", ngImport: i0, type: XCalendarModule, imports: [XCalendarComponent], exports: [XCalendarComponent] }); }
+    /** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: XCalendarModule, imports: [XCalendarComponent] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.5", ngImport: i0, type: XCalendarModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: XCalendarModule, decorators: [{
             type: NgModule,
             args: [{
                     exports: [XCalendarComponent],

package/fesm2022/ng-nest-ui-card.mjs

@@ -75,10 +75,10 @@ class XCardProperty extends XPropertyFunction(X_CARD_CONFIG_NAME) {
          */
         this.variant = input(this.config?.variant ?? 'outlined', ...(ngDevMode ? [{ debugName: "variant" }] : []));
     }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.5", ngImport: i0, type: XCardProperty, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.3.5", type: XCardProperty, isStandalone: true, selector: "x-card-property", inputs: { width: { classPropertyName: "width", publicName: "width", isSignal: true, isRequired: false, transformFunction: null }, bodyStyle: { classPropertyName: "bodyStyle", publicName: "bodyStyle", isSignal: true, isRequired: false, transformFunction: null }, header: { classPropertyName: "header", publicName: "header", isSignal: true, isRequired: false, transformFunction: null }, shadow: { classPropertyName: "shadow", publicName: "shadow", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null } }, usesInheritance: true, ngImport: i0, template: '', isInline: true }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: XCardProperty, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.0.0", type: XCardProperty, isStandalone: true, selector: "x-card-property", inputs: { width: { classPropertyName: "width", publicName: "width", isSignal: true, isRequired: false, transformFunction: null }, bodyStyle: { classPropertyName: "bodyStyle", publicName: "bodyStyle", isSignal: true, isRequired: false, transformFunction: null }, header: { classPropertyName: "header", publicName: "header", isSignal: true, isRequired: false, transformFunction: null }, shadow: { classPropertyName: "shadow", publicName: "shadow", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null } }, usesInheritance: true, ngImport: i0, template: '', isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.5", ngImport: i0, type: XCardProperty, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: XCardProperty, decorators: [{
             type: Component,
             args: [{ selector: `${XCardPrefix}-property`, template: '' }]
         }], propDecorators: { width: [{ type: i0.Input, args: [{ isSignal: true, alias: "width", required: false }] }], bodyStyle: [{ type: i0.Input, args: [{ isSignal: true, alias: "bodyStyle", required: false }] }], header: [{ type: i0.Input, args: [{ isSignal: true, alias: "header", required: false }] }], shadow: [{ type: i0.Input, args: [{ isSignal: true, alias: "shadow", required: false }] }], variant: [{ type: i0.Input, args: [{ isSignal: true, alias: "variant", required: false }] }] } });
@@ -91,20 +91,20 @@ class XCardComponent extends XCardProperty {
             [`${XCardPrefix}-${this.variant()}`]: !XIsEmpty(this.variant())
         }), ...(ngDevMode ? [{ debugName: "classMap" }] : []));
     }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.5", ngImport: i0, type: XCardComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.5", type: XCardComponent, isStandalone: true, selector: "x-card", usesInheritance: true, ngImport: i0, template: "<div #card class=\"x-card\" [ngClass]=\"classMap()\" [style.width]=\"width()\">\r\n  @if (header()) {\r\n    <div class=\"x-card-header\">\r\n      <ng-container *xOutlet=\"header()\">{{ header() }}</ng-container>\r\n    </div>\r\n  }\r\n  <div class=\"x-card-body\" [ngStyle]=\"bodyStyle()\">\r\n    <ng-content></ng-content>\r\n  </div>\r\n</div>\r\n", styles: ["x-card{display:block}.x-card{margin:0;padding:0}.x-card{font-size:var(--x-font-size);box-sizing:border-box;position:relative;border-radius:var(--x-border-radius);transition:box-shadow .3s}.x-card-always,.x-card-hover:hover{box-shadow:var(--x-box-shadow)}.x-card-header{display:flex;align-items:center;justify-content:space-between;padding:.675rem;border-bottom:var(--x-border-width) var(--x-border-style) var(--x-border)}.x-card-body{padding:var(--x-font-size);width:100%}.x-card-body>ul li:not(:last-child){margin-bottom:var(--x-font-size)}.x-card-outlined{border:var(--x-border-width) var(--x-border-style) var(--x-border)}.x-card-filled{background-color:var(--x-background-a200)}.x-card-shadow{box-shadow:var(--x-box-shadow)}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: XOutletDirective, selector: "[xOutlet]", inputs: ["xOutletContext", "xOutlet"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: XCardComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.0", type: XCardComponent, isStandalone: true, selector: "x-card", usesInheritance: true, ngImport: i0, template: "<div #card class=\"x-card\" [ngClass]=\"classMap()\" [style.width]=\"width()\">\r\n  @if (header()) {\r\n    <div class=\"x-card-header\">\r\n      <ng-container *xOutlet=\"header()\">{{ header() }}</ng-container>\r\n    </div>\r\n  }\r\n  <div class=\"x-card-body\" [ngStyle]=\"bodyStyle()\">\r\n    <ng-content></ng-content>\r\n  </div>\r\n</div>\r\n", styles: ["x-card{display:block}.x-card{margin:0;padding:0}.x-card{font-size:var(--x-font-size);box-sizing:border-box;position:relative;border-radius:var(--x-border-radius);transition:box-shadow .3s}.x-card-always,.x-card-hover:hover{box-shadow:var(--x-box-shadow)}.x-card-header{display:flex;align-items:center;justify-content:space-between;padding:.675rem;border-bottom:var(--x-border-width) var(--x-border-style) var(--x-border)}.x-card-body{padding:var(--x-font-size);width:100%}.x-card-body>ul li:not(:last-child){margin-bottom:var(--x-font-size)}.x-card-outlined{border:var(--x-border-width) var(--x-border-style) var(--x-border)}.x-card-filled{background-color:var(--x-background-a200)}.x-card-shadow{box-shadow:var(--x-box-shadow)}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: XOutletDirective, selector: "[xOutlet]", inputs: ["xOutletContext", "xOutlet"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.5", ngImport: i0, type: XCardComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: XCardComponent, decorators: [{
             type: Component,
             args: [{ selector: `${XCardPrefix}`, imports: [NgClass, NgStyle, XOutletDirective], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div #card class=\"x-card\" [ngClass]=\"classMap()\" [style.width]=\"width()\">\r\n  @if (header()) {\r\n    <div class=\"x-card-header\">\r\n      <ng-container *xOutlet=\"header()\">{{ header() }}</ng-container>\r\n    </div>\r\n  }\r\n  <div class=\"x-card-body\" [ngStyle]=\"bodyStyle()\">\r\n    <ng-content></ng-content>\r\n  </div>\r\n</div>\r\n", styles: ["x-card{display:block}.x-card{margin:0;padding:0}.x-card{font-size:var(--x-font-size);box-sizing:border-box;position:relative;border-radius:var(--x-border-radius);transition:box-shadow .3s}.x-card-always,.x-card-hover:hover{box-shadow:var(--x-box-shadow)}.x-card-header{display:flex;align-items:center;justify-content:space-between;padding:.675rem;border-bottom:var(--x-border-width) var(--x-border-style) var(--x-border)}.x-card-body{padding:var(--x-font-size);width:100%}.x-card-body>ul li:not(:last-child){margin-bottom:var(--x-font-size)}.x-card-outlined{border:var(--x-border-width) var(--x-border-style) var(--x-border)}.x-card-filled{background-color:var(--x-background-a200)}.x-card-shadow{box-shadow:var(--x-box-shadow)}\n"] }]
         }] });
 
 class XCardModule {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.5", ngImport: i0, type: XCardModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    /** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.5", ngImport: i0, type: XCardModule, imports: [XCardComponent], exports: [XCardComponent] }); }
-    /** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.5", ngImport: i0, type: XCardModule }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: XCardModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    /** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.0.0", ngImport: i0, type: XCardModule, imports: [XCardComponent], exports: [XCardComponent] }); }
+    /** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: XCardModule }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.5", ngImport: i0, type: XCardModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: XCardModule, decorators: [{
             type: NgModule,
             args: [{
                     exports: [XCardComponent],