npm - @datarailsshared/datarailsshared - Versions diffs - 1.5.214 → 1.5.216 - Mend

@datarailsshared/datarailsshared 1.5.214 → 1.5.216

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (6) hide show

package/datarailsshared-datarailsshared-1.5.216.tgz ADDED Viewed

Binary file

package/esm2022/lib/dr-inputs/button/button.component.mjs CHANGED Viewed

@@ -17,11 +17,11 @@ export class DrButtonComponent {
         this.click.emit($event);
     }
     /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.5", ngImport: i0, type: DrButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.5", type: DrButtonComponent, selector: "dr-button", inputs: { theme: "theme", icon: "icon", iconColor: "iconColor", iconSize: "iconSize", iconAfter: "iconAfter", iconAfterColor: "iconAfterColor", iconAfterSize: "iconAfterSize", disabled: "disabled", isLoading: "isLoading", isActive: "isActive" }, outputs: { click: "click" }, host: { properties: { "class": "this.theme", "class.with-icon": "this.icon", "class.with-icon-after": "this.iconAfter", "class.disabled": "this.disabled", "class.loading": "this.isLoading", "class.active": "this.isActive" } }, ngImport: i0, template: "<button (click)=\"onClick($event)\"\n        [disabled]=\"disabled\">\n    <i *ngIf=\"icon\"\n       class=\"dr-button__icon\"\n       [class]=\"icon\"\n       [style.font-size]=\"iconSize\"\n       [style.color]=\"iconColor || 'inherit'\">\n    </i>\n    <ng-content></ng-content>\n    <div *ngIf=\"isLoading\"\n         class=\"dr-button__spinner\">\n        <i [style.font-size]=\"iconSize\" class=\"dr-icon-load\"></i>\n    </div>\n    <i *ngIf=\"iconAfter\"\n       class=\"dr-button__icon dr-button__icon--after\"\n       [class]=\"iconAfter\"\n       [style.font-size]=\"iconAfterSize\"\n       [style.color]=\"iconAfterColor || 'inherit'\">\n    </i>\n</button>\n", styles: [":host{display:inline-block}:host.disabled,:host.loading{pointer-events:none}:host button{position:relative;display:flex;align-items:center;flex-wrap:nowrap;cursor:pointer;font-family:Poppins,sans-serif;font-weight:400;font-size:14px;font-style:normal;line-height:22px;border-radius:16px;padding:4px 16px;height:32px;border:1px solid}:host button .dr-button__spinner{display:flex;align-items:center;justify-content:center;position:absolute;inset:0;background:inherit;border-radius:inherit}:host button .dr-button__spinner i{animation-name:rotate;animation-iteration-count:infinite;animation-duration:1s}:host.with-icon button{padding-left:8px}:host.with-icon button i:first-child{margin-right:4px}:host.with-icon-after button{padding-right:8px}:host.with-icon-after button i:last-child{margin-left:4px}:host.split-primary-first button,:host.split-secondary-first button{border-bottom-right-radius:0;border-top-right-radius:0;padding-right:8px}:host.help button{padding:4px 16px 4px 8px;color:#333;height:28px}:host.help button i{min-width:4px}:host.split-primary-last button,:host.split-secondary-last button{border-bottom-left-radius:0;border-top-left-radius:0;padding-right:8px;padding-left:4px;border-left:none}:host.split-primary-last button i,:host.split-secondary-last button i{margin:0!important}:host.primary button,:host.split-primary-first button,:host.split-primary-last button{color:#fff;background:#4646CE;border-color:#4646ce}:host.primary button:hover,:host.split-primary-first button:hover,:host.split-primary-last button:hover{background:linear-gradient(96.89deg,#25258C 0%,#4646CE 100%);border-color:linear-gradient(96.89deg,#25258C 0%,#4646CE 100%)}:host.primary.active button,:host.primary button:active,:host.split-primary-first.active button,:host.split-primary-first button:active,:host.split-primary-last.active button,:host.split-primary-last button:active{background:#25258C;border-color:#25258c}:host.primary.disabled button,:host.split-primary-first.disabled button,:host.split-primary-last.disabled button{color:#aeabac;background:#F0F1F4;border-color:#f0f1f4}:host.split-primary-first button{border-right-color:#dfe0e3}:host.split-primary-first.disabled button{border-right-color:#aeabac}:host.secondary button,:host.split-secondary-first button,:host.split-secondary-last button{color:#4646ce;background:#FFFFFF;border-color:#4646ce}:host.secondary button:hover,:host.split-secondary-first button:hover,:host.split-secondary-last button:hover{background:#F5F5F5;box-shadow:0 4px 14px #0000001a}:host.secondary.active button,:host.secondary button:active,:host.split-secondary-first.active button,:host.split-secondary-first button:active,:host.split-secondary-last.active button,:host.split-secondary-last button:active{background:#EAEAFF;box-shadow:none}:host.secondary.disabled button,:host.split-secondary-first.disabled button,:host.split-secondary-last.disabled button{color:#aeabac;border-color:#aeabac}:host.split-secondary-first button{border-right-color:#4646ce}:host.split-secondary-first.disabled button{border-right-color:#aeabac}:host.icon button,:host.icon-primary button,:host.icon-secondary button{width:28px;height:28px;padding:0;justify-content:center}:host.icon button i,:host.icon-primary button i,:host.icon-secondary button i{margin:0!important}:host.icon button{background:transparent;border-color:transparent;color:#6d6e6f}:host.icon button:hover{color:#333;background:#DFE0E3;border-color:#dfe0e3}:host.icon.active button,:host.icon button:active{color:#4646ce;background:#EAEAFF;border-color:#eaeaff}:host.icon.disabled button{color:#aeabac;background:transparent;border-color:transparent}:host.icon-primary button{color:#fff;background:#4646CE;border-color:#4646ce}:host.icon-primary button:hover{color:#fff;background:linear-gradient(96.89deg,#25258C 0%,#4646CE 100%);border-color:linear-gradient(96.89deg,#25258C 0%,#4646CE 100%)}:host.icon-primary.active button,:host.icon-primary button:active{color:#fff;background:#25258C;border-color:#25258c}:host.icon-primary.disabled button{color:#aeabac;background:#F0F1F4;border-color:#f0f1f4}:host.icon-secondary button{color:#4646ce;background:#FFFFFF;border-color:#4646ce}:host.icon-secondary button:hover{color:#4646ce;background:#F5F5F5;border-color:#4646ce}:host.icon-secondary.active button,:host.icon-secondary button:active{color:#4646ce;background:#EAEAFF;border-color:#4646ce}:host.icon-secondary.disabled button{color:#aeabac;background:#F0F1F4;border-color:#f0f1f4}:host.ghost button{border-radius:4px;padding:4px;background:transparent;border-color:transparent;color:#6d6e6f}:host.ghost button .dr-button__spinner{color:#4646ce;background:#FFFFFF}:host.ghost button:hover{color:#333;background:#F5F5F5;border-color:#f5f5f5}:host.ghost.active button,:host.ghost button:active{color:#4646ce;background:#EAEAFF;border-color:#eaeaff}:host.ghost.disabled button{color:#aeabac;background:transparent;border-color:transparent}:host.selection button{border-radius:6px;padding:4px 8px;background:#FFFFFF;border-color:#9ea1aa;color:#6d6e6f}:host.selection button:hover{color:#6d6e6f;background:#F5F5F5;border-color:#4e566c}:host.selection.active button,:host.selection button:active{color:#6d6e6f;background:#EAEAFF;border-color:#4646ce}:host.selection.disabled button{color:#aeabac;background:#F0F1F4;border-color:#aeabac}:host.link button{border:none;background:none;color:#4646ce;padding:0 4px}:host.link button:hover,:host.link.active button,:host.link button:active{text-decoration:underline}:host.link.disabled button{color:#aeabac}:host.danger button{color:#fff;background:#BF1D30;border-color:#bf1d30}:host.danger button:hover{background:#981440;border-color:#981440}:host.danger.active button,:host.danger button:active{background:#680325;border-color:#680325}:host.danger.disabled button{color:#aeabac;background:#F0F1F4;border-color:#f0f1f4}@keyframes rotate{0%{transform:rotate(0)}to{transform:rotate(360deg)}}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.5", type: DrButtonComponent, selector: "dr-button", inputs: { theme: "theme", icon: "icon", iconColor: "iconColor", iconSize: "iconSize", iconAfter: "iconAfter", iconAfterColor: "iconAfterColor", iconAfterSize: "iconAfterSize", disabled: "disabled", isLoading: "isLoading", isActive: "isActive" }, outputs: { click: "click" }, host: { properties: { "class": "this.theme", "class.with-icon": "this.icon", "class.with-icon-after": "this.iconAfter", "class.disabled": "this.disabled", "class.loading": "this.isLoading", "class.active": "this.isActive" } }, ngImport: i0, template: "<button (click)=\"onClick($event)\"\n        [disabled]=\"disabled\">\n    <i *ngIf=\"icon\"\n       class=\"dr-button__icon\"\n       [class]=\"icon\"\n       [style.font-size]=\"iconSize\"\n       [style.color]=\"iconColor || 'inherit'\">\n    </i>\n    <ng-content></ng-content>\n    <div *ngIf=\"isLoading\"\n         class=\"dr-button__spinner\">\n        <i [style.font-size]=\"iconSize\" class=\"dr-icon-load\"></i>\n    </div>\n    <i *ngIf=\"iconAfter\"\n       class=\"dr-button__icon dr-button__icon--after\"\n       [class]=\"iconAfter\"\n       [style.font-size]=\"iconAfterSize\"\n       [style.color]=\"iconAfterColor || 'inherit'\">\n    </i>\n</button>\n", styles: [":host{display:inline-block}:host.disabled,:host.loading{pointer-events:none}:host button{position:relative;display:flex;align-items:center;flex-wrap:nowrap;cursor:pointer;font-family:Poppins,sans-serif;font-weight:400;font-size:14px;font-style:normal;line-height:22px;border-radius:16px;padding:4px 16px;height:32px;border:1px solid}:host button .dr-button__spinner{display:flex;align-items:center;justify-content:center;position:absolute;inset:0;background:inherit;border-radius:inherit}:host button .dr-button__spinner i{animation-name:rotate;animation-iteration-count:infinite;animation-duration:1s}:host.with-icon button{padding-left:8px}:host.with-icon button i:first-child{margin-right:4px}:host.with-icon-after button{padding-right:8px}:host.with-icon-after button i:last-child{margin-left:4px}:host.split-primary-first button,:host.split-secondary-first button{border-bottom-right-radius:0;border-top-right-radius:0;padding-right:8px}:host.help button{padding:4px 16px 4px 8px;color:#333;height:28px;border:none;min-width:84px}:host.help button i{min-width:4px}:host.split-primary-last button,:host.split-secondary-last button{border-bottom-left-radius:0;border-top-left-radius:0;padding-right:8px;padding-left:4px;border-left:none}:host.split-primary-last button i,:host.split-secondary-last button i{margin:0!important}:host.primary button,:host.split-primary-first button,:host.split-primary-last button{color:#fff;background:#4646CE;border-color:#4646ce}:host.primary button:hover,:host.split-primary-first button:hover,:host.split-primary-last button:hover{background:linear-gradient(96.89deg,#25258C 0%,#4646CE 100%);border-color:linear-gradient(96.89deg,#25258C 0%,#4646CE 100%)}:host.primary.active button,:host.primary button:active,:host.split-primary-first.active button,:host.split-primary-first button:active,:host.split-primary-last.active button,:host.split-primary-last button:active{background:#25258C;border-color:#25258c}:host.primary.disabled button,:host.split-primary-first.disabled button,:host.split-primary-last.disabled button{color:#aeabac;background:#F0F1F4;border-color:#f0f1f4}:host.split-primary-first button{border-right-color:#dfe0e3}:host.split-primary-first.disabled button{border-right-color:#aeabac}:host.secondary button,:host.split-secondary-first button,:host.split-secondary-last button{color:#4646ce;background:#FFFFFF;border-color:#4646ce}:host.secondary button:hover,:host.split-secondary-first button:hover,:host.split-secondary-last button:hover{background:#F5F5F5;box-shadow:0 4px 14px #0000001a}:host.secondary.active button,:host.secondary button:active,:host.split-secondary-first.active button,:host.split-secondary-first button:active,:host.split-secondary-last.active button,:host.split-secondary-last button:active{background:#EAEAFF;box-shadow:none}:host.secondary.disabled button,:host.split-secondary-first.disabled button,:host.split-secondary-last.disabled button{color:#aeabac;border-color:#aeabac}:host.split-secondary-first button{border-right-color:#4646ce}:host.split-secondary-first.disabled button{border-right-color:#aeabac}:host.icon button,:host.icon-primary button,:host.icon-secondary button{width:28px;height:28px;padding:0;justify-content:center}:host.icon button i,:host.icon-primary button i,:host.icon-secondary button i{margin:0!important}:host.icon button{background:transparent;border-color:transparent;color:#6d6e6f}:host.icon button:hover{color:#333;background:#DFE0E3;border-color:#dfe0e3}:host.icon.active button,:host.icon button:active{color:#4646ce;background:#EAEAFF;border-color:#eaeaff}:host.icon.disabled button{color:#aeabac;background:transparent;border-color:transparent}:host.icon-primary button{color:#fff;background:#4646CE;border-color:#4646ce}:host.icon-primary button:hover{color:#fff;background:linear-gradient(96.89deg,#25258C 0%,#4646CE 100%);border-color:linear-gradient(96.89deg,#25258C 0%,#4646CE 100%)}:host.icon-primary.active button,:host.icon-primary button:active{color:#fff;background:#25258C;border-color:#25258c}:host.icon-primary.disabled button{color:#aeabac;background:#F0F1F4;border-color:#f0f1f4}:host.icon-secondary button{color:#4646ce;background:#FFFFFF;border-color:#4646ce}:host.icon-secondary button:hover{color:#4646ce;background:#F5F5F5;border-color:#4646ce}:host.icon-secondary.active button,:host.icon-secondary button:active{color:#4646ce;background:#EAEAFF;border-color:#4646ce}:host.icon-secondary.disabled button{color:#aeabac;background:#F0F1F4;border-color:#f0f1f4}:host.ghost button{border-radius:4px;padding:4px;background:transparent;border-color:transparent;color:#6d6e6f}:host.ghost button .dr-button__spinner{color:#4646ce;background:#FFFFFF}:host.ghost button:hover{color:#333;background:#F5F5F5;border-color:#f5f5f5}:host.ghost.active button,:host.ghost button:active{color:#4646ce;background:#EAEAFF;border-color:#eaeaff}:host.ghost.disabled button{color:#aeabac;background:transparent;border-color:transparent}:host.selection button{border-radius:6px;padding:4px 8px;background:#FFFFFF;border-color:#9ea1aa;color:#6d6e6f}:host.selection button:hover{color:#6d6e6f;background:#F5F5F5;border-color:#4e566c}:host.selection.active button,:host.selection button:active{color:#6d6e6f;background:#EAEAFF;border-color:#4646ce}:host.selection.disabled button{color:#aeabac;background:#F0F1F4;border-color:#aeabac}:host.link button{border:none;background:none;color:#4646ce;padding:0 4px}:host.link button:hover,:host.link.active button,:host.link button:active{text-decoration:underline}:host.link.disabled button{color:#aeabac}:host.danger button{color:#fff;background:#BF1D30;border-color:#bf1d30}:host.danger button:hover{background:#981440;border-color:#981440}:host.danger.active button,:host.danger button:active{background:#680325;border-color:#680325}:host.danger.disabled button{color:#aeabac;background:#F0F1F4;border-color:#f0f1f4}@keyframes rotate{0%{transform:rotate(0)}to{transform:rotate(360deg)}}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.5", ngImport: i0, type: DrButtonComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'dr-button', template: "<button (click)=\"onClick($event)\"\n        [disabled]=\"disabled\">\n    <i *ngIf=\"icon\"\n       class=\"dr-button__icon\"\n       [class]=\"icon\"\n       [style.font-size]=\"iconSize\"\n       [style.color]=\"iconColor || 'inherit'\">\n    </i>\n    <ng-content></ng-content>\n    <div *ngIf=\"isLoading\"\n         class=\"dr-button__spinner\">\n        <i [style.font-size]=\"iconSize\" class=\"dr-icon-load\"></i>\n    </div>\n    <i *ngIf=\"iconAfter\"\n       class=\"dr-button__icon dr-button__icon--after\"\n       [class]=\"iconAfter\"\n       [style.font-size]=\"iconAfterSize\"\n       [style.color]=\"iconAfterColor || 'inherit'\">\n    </i>\n</button>\n", styles: [":host{display:inline-block}:host.disabled,:host.loading{pointer-events:none}:host button{position:relative;display:flex;align-items:center;flex-wrap:nowrap;cursor:pointer;font-family:Poppins,sans-serif;font-weight:400;font-size:14px;font-style:normal;line-height:22px;border-radius:16px;padding:4px 16px;height:32px;border:1px solid}:host button .dr-button__spinner{display:flex;align-items:center;justify-content:center;position:absolute;inset:0;background:inherit;border-radius:inherit}:host button .dr-button__spinner i{animation-name:rotate;animation-iteration-count:infinite;animation-duration:1s}:host.with-icon button{padding-left:8px}:host.with-icon button i:first-child{margin-right:4px}:host.with-icon-after button{padding-right:8px}:host.with-icon-after button i:last-child{margin-left:4px}:host.split-primary-first button,:host.split-secondary-first button{border-bottom-right-radius:0;border-top-right-radius:0;padding-right:8px}:host.help button{padding:4px 16px 4px 8px;color:#333;height:28px}:host.help button i{min-width:4px}:host.split-primary-last button,:host.split-secondary-last button{border-bottom-left-radius:0;border-top-left-radius:0;padding-right:8px;padding-left:4px;border-left:none}:host.split-primary-last button i,:host.split-secondary-last button i{margin:0!important}:host.primary button,:host.split-primary-first button,:host.split-primary-last button{color:#fff;background:#4646CE;border-color:#4646ce}:host.primary button:hover,:host.split-primary-first button:hover,:host.split-primary-last button:hover{background:linear-gradient(96.89deg,#25258C 0%,#4646CE 100%);border-color:linear-gradient(96.89deg,#25258C 0%,#4646CE 100%)}:host.primary.active button,:host.primary button:active,:host.split-primary-first.active button,:host.split-primary-first button:active,:host.split-primary-last.active button,:host.split-primary-last button:active{background:#25258C;border-color:#25258c}:host.primary.disabled button,:host.split-primary-first.disabled button,:host.split-primary-last.disabled button{color:#aeabac;background:#F0F1F4;border-color:#f0f1f4}:host.split-primary-first button{border-right-color:#dfe0e3}:host.split-primary-first.disabled button{border-right-color:#aeabac}:host.secondary button,:host.split-secondary-first button,:host.split-secondary-last button{color:#4646ce;background:#FFFFFF;border-color:#4646ce}:host.secondary button:hover,:host.split-secondary-first button:hover,:host.split-secondary-last button:hover{background:#F5F5F5;box-shadow:0 4px 14px #0000001a}:host.secondary.active button,:host.secondary button:active,:host.split-secondary-first.active button,:host.split-secondary-first button:active,:host.split-secondary-last.active button,:host.split-secondary-last button:active{background:#EAEAFF;box-shadow:none}:host.secondary.disabled button,:host.split-secondary-first.disabled button,:host.split-secondary-last.disabled button{color:#aeabac;border-color:#aeabac}:host.split-secondary-first button{border-right-color:#4646ce}:host.split-secondary-first.disabled button{border-right-color:#aeabac}:host.icon button,:host.icon-primary button,:host.icon-secondary button{width:28px;height:28px;padding:0;justify-content:center}:host.icon button i,:host.icon-primary button i,:host.icon-secondary button i{margin:0!important}:host.icon button{background:transparent;border-color:transparent;color:#6d6e6f}:host.icon button:hover{color:#333;background:#DFE0E3;border-color:#dfe0e3}:host.icon.active button,:host.icon button:active{color:#4646ce;background:#EAEAFF;border-color:#eaeaff}:host.icon.disabled button{color:#aeabac;background:transparent;border-color:transparent}:host.icon-primary button{color:#fff;background:#4646CE;border-color:#4646ce}:host.icon-primary button:hover{color:#fff;background:linear-gradient(96.89deg,#25258C 0%,#4646CE 100%);border-color:linear-gradient(96.89deg,#25258C 0%,#4646CE 100%)}:host.icon-primary.active button,:host.icon-primary button:active{color:#fff;background:#25258C;border-color:#25258c}:host.icon-primary.disabled button{color:#aeabac;background:#F0F1F4;border-color:#f0f1f4}:host.icon-secondary button{color:#4646ce;background:#FFFFFF;border-color:#4646ce}:host.icon-secondary button:hover{color:#4646ce;background:#F5F5F5;border-color:#4646ce}:host.icon-secondary.active button,:host.icon-secondary button:active{color:#4646ce;background:#EAEAFF;border-color:#4646ce}:host.icon-secondary.disabled button{color:#aeabac;background:#F0F1F4;border-color:#f0f1f4}:host.ghost button{border-radius:4px;padding:4px;background:transparent;border-color:transparent;color:#6d6e6f}:host.ghost button .dr-button__spinner{color:#4646ce;background:#FFFFFF}:host.ghost button:hover{color:#333;background:#F5F5F5;border-color:#f5f5f5}:host.ghost.active button,:host.ghost button:active{color:#4646ce;background:#EAEAFF;border-color:#eaeaff}:host.ghost.disabled button{color:#aeabac;background:transparent;border-color:transparent}:host.selection button{border-radius:6px;padding:4px 8px;background:#FFFFFF;border-color:#9ea1aa;color:#6d6e6f}:host.selection button:hover{color:#6d6e6f;background:#F5F5F5;border-color:#4e566c}:host.selection.active button,:host.selection button:active{color:#6d6e6f;background:#EAEAFF;border-color:#4646ce}:host.selection.disabled button{color:#aeabac;background:#F0F1F4;border-color:#aeabac}:host.link button{border:none;background:none;color:#4646ce;padding:0 4px}:host.link button:hover,:host.link.active button,:host.link button:active{text-decoration:underline}:host.link.disabled button{color:#aeabac}:host.danger button{color:#fff;background:#BF1D30;border-color:#bf1d30}:host.danger button:hover{background:#981440;border-color:#981440}:host.danger.active button,:host.danger button:active{background:#680325;border-color:#680325}:host.danger.disabled button{color:#aeabac;background:#F0F1F4;border-color:#f0f1f4}@keyframes rotate{0%{transform:rotate(0)}to{transform:rotate(360deg)}}\n"] }]
+            args: [{ selector: 'dr-button', template: "<button (click)=\"onClick($event)\"\n        [disabled]=\"disabled\">\n    <i *ngIf=\"icon\"\n       class=\"dr-button__icon\"\n       [class]=\"icon\"\n       [style.font-size]=\"iconSize\"\n       [style.color]=\"iconColor || 'inherit'\">\n    </i>\n    <ng-content></ng-content>\n    <div *ngIf=\"isLoading\"\n         class=\"dr-button__spinner\">\n        <i [style.font-size]=\"iconSize\" class=\"dr-icon-load\"></i>\n    </div>\n    <i *ngIf=\"iconAfter\"\n       class=\"dr-button__icon dr-button__icon--after\"\n       [class]=\"iconAfter\"\n       [style.font-size]=\"iconAfterSize\"\n       [style.color]=\"iconAfterColor || 'inherit'\">\n    </i>\n</button>\n", styles: [":host{display:inline-block}:host.disabled,:host.loading{pointer-events:none}:host button{position:relative;display:flex;align-items:center;flex-wrap:nowrap;cursor:pointer;font-family:Poppins,sans-serif;font-weight:400;font-size:14px;font-style:normal;line-height:22px;border-radius:16px;padding:4px 16px;height:32px;border:1px solid}:host button .dr-button__spinner{display:flex;align-items:center;justify-content:center;position:absolute;inset:0;background:inherit;border-radius:inherit}:host button .dr-button__spinner i{animation-name:rotate;animation-iteration-count:infinite;animation-duration:1s}:host.with-icon button{padding-left:8px}:host.with-icon button i:first-child{margin-right:4px}:host.with-icon-after button{padding-right:8px}:host.with-icon-after button i:last-child{margin-left:4px}:host.split-primary-first button,:host.split-secondary-first button{border-bottom-right-radius:0;border-top-right-radius:0;padding-right:8px}:host.help button{padding:4px 16px 4px 8px;color:#333;height:28px;border:none;min-width:84px}:host.help button i{min-width:4px}:host.split-primary-last button,:host.split-secondary-last button{border-bottom-left-radius:0;border-top-left-radius:0;padding-right:8px;padding-left:4px;border-left:none}:host.split-primary-last button i,:host.split-secondary-last button i{margin:0!important}:host.primary button,:host.split-primary-first button,:host.split-primary-last button{color:#fff;background:#4646CE;border-color:#4646ce}:host.primary button:hover,:host.split-primary-first button:hover,:host.split-primary-last button:hover{background:linear-gradient(96.89deg,#25258C 0%,#4646CE 100%);border-color:linear-gradient(96.89deg,#25258C 0%,#4646CE 100%)}:host.primary.active button,:host.primary button:active,:host.split-primary-first.active button,:host.split-primary-first button:active,:host.split-primary-last.active button,:host.split-primary-last button:active{background:#25258C;border-color:#25258c}:host.primary.disabled button,:host.split-primary-first.disabled button,:host.split-primary-last.disabled button{color:#aeabac;background:#F0F1F4;border-color:#f0f1f4}:host.split-primary-first button{border-right-color:#dfe0e3}:host.split-primary-first.disabled button{border-right-color:#aeabac}:host.secondary button,:host.split-secondary-first button,:host.split-secondary-last button{color:#4646ce;background:#FFFFFF;border-color:#4646ce}:host.secondary button:hover,:host.split-secondary-first button:hover,:host.split-secondary-last button:hover{background:#F5F5F5;box-shadow:0 4px 14px #0000001a}:host.secondary.active button,:host.secondary button:active,:host.split-secondary-first.active button,:host.split-secondary-first button:active,:host.split-secondary-last.active button,:host.split-secondary-last button:active{background:#EAEAFF;box-shadow:none}:host.secondary.disabled button,:host.split-secondary-first.disabled button,:host.split-secondary-last.disabled button{color:#aeabac;border-color:#aeabac}:host.split-secondary-first button{border-right-color:#4646ce}:host.split-secondary-first.disabled button{border-right-color:#aeabac}:host.icon button,:host.icon-primary button,:host.icon-secondary button{width:28px;height:28px;padding:0;justify-content:center}:host.icon button i,:host.icon-primary button i,:host.icon-secondary button i{margin:0!important}:host.icon button{background:transparent;border-color:transparent;color:#6d6e6f}:host.icon button:hover{color:#333;background:#DFE0E3;border-color:#dfe0e3}:host.icon.active button,:host.icon button:active{color:#4646ce;background:#EAEAFF;border-color:#eaeaff}:host.icon.disabled button{color:#aeabac;background:transparent;border-color:transparent}:host.icon-primary button{color:#fff;background:#4646CE;border-color:#4646ce}:host.icon-primary button:hover{color:#fff;background:linear-gradient(96.89deg,#25258C 0%,#4646CE 100%);border-color:linear-gradient(96.89deg,#25258C 0%,#4646CE 100%)}:host.icon-primary.active button,:host.icon-primary button:active{color:#fff;background:#25258C;border-color:#25258c}:host.icon-primary.disabled button{color:#aeabac;background:#F0F1F4;border-color:#f0f1f4}:host.icon-secondary button{color:#4646ce;background:#FFFFFF;border-color:#4646ce}:host.icon-secondary button:hover{color:#4646ce;background:#F5F5F5;border-color:#4646ce}:host.icon-secondary.active button,:host.icon-secondary button:active{color:#4646ce;background:#EAEAFF;border-color:#4646ce}:host.icon-secondary.disabled button{color:#aeabac;background:#F0F1F4;border-color:#f0f1f4}:host.ghost button{border-radius:4px;padding:4px;background:transparent;border-color:transparent;color:#6d6e6f}:host.ghost button .dr-button__spinner{color:#4646ce;background:#FFFFFF}:host.ghost button:hover{color:#333;background:#F5F5F5;border-color:#f5f5f5}:host.ghost.active button,:host.ghost button:active{color:#4646ce;background:#EAEAFF;border-color:#eaeaff}:host.ghost.disabled button{color:#aeabac;background:transparent;border-color:transparent}:host.selection button{border-radius:6px;padding:4px 8px;background:#FFFFFF;border-color:#9ea1aa;color:#6d6e6f}:host.selection button:hover{color:#6d6e6f;background:#F5F5F5;border-color:#4e566c}:host.selection.active button,:host.selection button:active{color:#6d6e6f;background:#EAEAFF;border-color:#4646ce}:host.selection.disabled button{color:#aeabac;background:#F0F1F4;border-color:#aeabac}:host.link button{border:none;background:none;color:#4646ce;padding:0 4px}:host.link button:hover,:host.link.active button,:host.link button:active{text-decoration:underline}:host.link.disabled button{color:#aeabac}:host.danger button{color:#fff;background:#BF1D30;border-color:#bf1d30}:host.danger button:hover{background:#981440;border-color:#981440}:host.danger.active button,:host.danger button:active{background:#680325;border-color:#680325}:host.danger.disabled button{color:#aeabac;background:#F0F1F4;border-color:#f0f1f4}@keyframes rotate{0%{transform:rotate(0)}to{transform:rotate(360deg)}}\n"] }]
         }], ctorParameters: function () { return []; }, propDecorators: { theme: [{
                 type: Input
             }, {

package/fesm2022/datarailsshared-datarailsshared.mjs CHANGED Viewed

@@ -2241,11 +2241,11 @@ class DrButtonComponent {
         this.click.emit($event);
     }
     /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.5", ngImport: i0, type: DrButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.5", type: DrButtonComponent, selector: "dr-button", inputs: { theme: "theme", icon: "icon", iconColor: "iconColor", iconSize: "iconSize", iconAfter: "iconAfter", iconAfterColor: "iconAfterColor", iconAfterSize: "iconAfterSize", disabled: "disabled", isLoading: "isLoading", isActive: "isActive" }, outputs: { click: "click" }, host: { properties: { "class": "this.theme", "class.with-icon": "this.icon", "class.with-icon-after": "this.iconAfter", "class.disabled": "this.disabled", "class.loading": "this.isLoading", "class.active": "this.isActive" } }, ngImport: i0, template: "<button (click)=\"onClick($event)\"\n        [disabled]=\"disabled\">\n    <i *ngIf=\"icon\"\n       class=\"dr-button__icon\"\n       [class]=\"icon\"\n       [style.font-size]=\"iconSize\"\n       [style.color]=\"iconColor || 'inherit'\">\n    </i>\n    <ng-content></ng-content>\n    <div *ngIf=\"isLoading\"\n         class=\"dr-button__spinner\">\n        <i [style.font-size]=\"iconSize\" class=\"dr-icon-load\"></i>\n    </div>\n    <i *ngIf=\"iconAfter\"\n       class=\"dr-button__icon dr-button__icon--after\"\n       [class]=\"iconAfter\"\n       [style.font-size]=\"iconAfterSize\"\n       [style.color]=\"iconAfterColor || 'inherit'\">\n    </i>\n</button>\n", styles: [":host{display:inline-block}:host.disabled,:host.loading{pointer-events:none}:host button{position:relative;display:flex;align-items:center;flex-wrap:nowrap;cursor:pointer;font-family:Poppins,sans-serif;font-weight:400;font-size:14px;font-style:normal;line-height:22px;border-radius:16px;padding:4px 16px;height:32px;border:1px solid}:host button .dr-button__spinner{display:flex;align-items:center;justify-content:center;position:absolute;inset:0;background:inherit;border-radius:inherit}:host button .dr-button__spinner i{animation-name:rotate;animation-iteration-count:infinite;animation-duration:1s}:host.with-icon button{padding-left:8px}:host.with-icon button i:first-child{margin-right:4px}:host.with-icon-after button{padding-right:8px}:host.with-icon-after button i:last-child{margin-left:4px}:host.split-primary-first button,:host.split-secondary-first button{border-bottom-right-radius:0;border-top-right-radius:0;padding-right:8px}:host.help button{padding:4px 16px 4px 8px;color:#333;height:28px}:host.help button i{min-width:4px}:host.split-primary-last button,:host.split-secondary-last button{border-bottom-left-radius:0;border-top-left-radius:0;padding-right:8px;padding-left:4px;border-left:none}:host.split-primary-last button i,:host.split-secondary-last button i{margin:0!important}:host.primary button,:host.split-primary-first button,:host.split-primary-last button{color:#fff;background:#4646CE;border-color:#4646ce}:host.primary button:hover,:host.split-primary-first button:hover,:host.split-primary-last button:hover{background:linear-gradient(96.89deg,#25258C 0%,#4646CE 100%);border-color:linear-gradient(96.89deg,#25258C 0%,#4646CE 100%)}:host.primary.active button,:host.primary button:active,:host.split-primary-first.active button,:host.split-primary-first button:active,:host.split-primary-last.active button,:host.split-primary-last button:active{background:#25258C;border-color:#25258c}:host.primary.disabled button,:host.split-primary-first.disabled button,:host.split-primary-last.disabled button{color:#aeabac;background:#F0F1F4;border-color:#f0f1f4}:host.split-primary-first button{border-right-color:#dfe0e3}:host.split-primary-first.disabled button{border-right-color:#aeabac}:host.secondary button,:host.split-secondary-first button,:host.split-secondary-last button{color:#4646ce;background:#FFFFFF;border-color:#4646ce}:host.secondary button:hover,:host.split-secondary-first button:hover,:host.split-secondary-last button:hover{background:#F5F5F5;box-shadow:0 4px 14px #0000001a}:host.secondary.active button,:host.secondary button:active,:host.split-secondary-first.active button,:host.split-secondary-first button:active,:host.split-secondary-last.active button,:host.split-secondary-last button:active{background:#EAEAFF;box-shadow:none}:host.secondary.disabled button,:host.split-secondary-first.disabled button,:host.split-secondary-last.disabled button{color:#aeabac;border-color:#aeabac}:host.split-secondary-first button{border-right-color:#4646ce}:host.split-secondary-first.disabled button{border-right-color:#aeabac}:host.icon button,:host.icon-primary button,:host.icon-secondary button{width:28px;height:28px;padding:0;justify-content:center}:host.icon button i,:host.icon-primary button i,:host.icon-secondary button i{margin:0!important}:host.icon button{background:transparent;border-color:transparent;color:#6d6e6f}:host.icon button:hover{color:#333;background:#DFE0E3;border-color:#dfe0e3}:host.icon.active button,:host.icon button:active{color:#4646ce;background:#EAEAFF;border-color:#eaeaff}:host.icon.disabled button{color:#aeabac;background:transparent;border-color:transparent}:host.icon-primary button{color:#fff;background:#4646CE;border-color:#4646ce}:host.icon-primary button:hover{color:#fff;background:linear-gradient(96.89deg,#25258C 0%,#4646CE 100%);border-color:linear-gradient(96.89deg,#25258C 0%,#4646CE 100%)}:host.icon-primary.active button,:host.icon-primary button:active{color:#fff;background:#25258C;border-color:#25258c}:host.icon-primary.disabled button{color:#aeabac;background:#F0F1F4;border-color:#f0f1f4}:host.icon-secondary button{color:#4646ce;background:#FFFFFF;border-color:#4646ce}:host.icon-secondary button:hover{color:#4646ce;background:#F5F5F5;border-color:#4646ce}:host.icon-secondary.active button,:host.icon-secondary button:active{color:#4646ce;background:#EAEAFF;border-color:#4646ce}:host.icon-secondary.disabled button{color:#aeabac;background:#F0F1F4;border-color:#f0f1f4}:host.ghost button{border-radius:4px;padding:4px;background:transparent;border-color:transparent;color:#6d6e6f}:host.ghost button .dr-button__spinner{color:#4646ce;background:#FFFFFF}:host.ghost button:hover{color:#333;background:#F5F5F5;border-color:#f5f5f5}:host.ghost.active button,:host.ghost button:active{color:#4646ce;background:#EAEAFF;border-color:#eaeaff}:host.ghost.disabled button{color:#aeabac;background:transparent;border-color:transparent}:host.selection button{border-radius:6px;padding:4px 8px;background:#FFFFFF;border-color:#9ea1aa;color:#6d6e6f}:host.selection button:hover{color:#6d6e6f;background:#F5F5F5;border-color:#4e566c}:host.selection.active button,:host.selection button:active{color:#6d6e6f;background:#EAEAFF;border-color:#4646ce}:host.selection.disabled button{color:#aeabac;background:#F0F1F4;border-color:#aeabac}:host.link button{border:none;background:none;color:#4646ce;padding:0 4px}:host.link button:hover,:host.link.active button,:host.link button:active{text-decoration:underline}:host.link.disabled button{color:#aeabac}:host.danger button{color:#fff;background:#BF1D30;border-color:#bf1d30}:host.danger button:hover{background:#981440;border-color:#981440}:host.danger.active button,:host.danger button:active{background:#680325;border-color:#680325}:host.danger.disabled button{color:#aeabac;background:#F0F1F4;border-color:#f0f1f4}@keyframes rotate{0%{transform:rotate(0)}to{transform:rotate(360deg)}}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.5", type: DrButtonComponent, selector: "dr-button", inputs: { theme: "theme", icon: "icon", iconColor: "iconColor", iconSize: "iconSize", iconAfter: "iconAfter", iconAfterColor: "iconAfterColor", iconAfterSize: "iconAfterSize", disabled: "disabled", isLoading: "isLoading", isActive: "isActive" }, outputs: { click: "click" }, host: { properties: { "class": "this.theme", "class.with-icon": "this.icon", "class.with-icon-after": "this.iconAfter", "class.disabled": "this.disabled", "class.loading": "this.isLoading", "class.active": "this.isActive" } }, ngImport: i0, template: "<button (click)=\"onClick($event)\"\n        [disabled]=\"disabled\">\n    <i *ngIf=\"icon\"\n       class=\"dr-button__icon\"\n       [class]=\"icon\"\n       [style.font-size]=\"iconSize\"\n       [style.color]=\"iconColor || 'inherit'\">\n    </i>\n    <ng-content></ng-content>\n    <div *ngIf=\"isLoading\"\n         class=\"dr-button__spinner\">\n        <i [style.font-size]=\"iconSize\" class=\"dr-icon-load\"></i>\n    </div>\n    <i *ngIf=\"iconAfter\"\n       class=\"dr-button__icon dr-button__icon--after\"\n       [class]=\"iconAfter\"\n       [style.font-size]=\"iconAfterSize\"\n       [style.color]=\"iconAfterColor || 'inherit'\">\n    </i>\n</button>\n", styles: [":host{display:inline-block}:host.disabled,:host.loading{pointer-events:none}:host button{position:relative;display:flex;align-items:center;flex-wrap:nowrap;cursor:pointer;font-family:Poppins,sans-serif;font-weight:400;font-size:14px;font-style:normal;line-height:22px;border-radius:16px;padding:4px 16px;height:32px;border:1px solid}:host button .dr-button__spinner{display:flex;align-items:center;justify-content:center;position:absolute;inset:0;background:inherit;border-radius:inherit}:host button .dr-button__spinner i{animation-name:rotate;animation-iteration-count:infinite;animation-duration:1s}:host.with-icon button{padding-left:8px}:host.with-icon button i:first-child{margin-right:4px}:host.with-icon-after button{padding-right:8px}:host.with-icon-after button i:last-child{margin-left:4px}:host.split-primary-first button,:host.split-secondary-first button{border-bottom-right-radius:0;border-top-right-radius:0;padding-right:8px}:host.help button{padding:4px 16px 4px 8px;color:#333;height:28px;border:none;min-width:84px}:host.help button i{min-width:4px}:host.split-primary-last button,:host.split-secondary-last button{border-bottom-left-radius:0;border-top-left-radius:0;padding-right:8px;padding-left:4px;border-left:none}:host.split-primary-last button i,:host.split-secondary-last button i{margin:0!important}:host.primary button,:host.split-primary-first button,:host.split-primary-last button{color:#fff;background:#4646CE;border-color:#4646ce}:host.primary button:hover,:host.split-primary-first button:hover,:host.split-primary-last button:hover{background:linear-gradient(96.89deg,#25258C 0%,#4646CE 100%);border-color:linear-gradient(96.89deg,#25258C 0%,#4646CE 100%)}:host.primary.active button,:host.primary button:active,:host.split-primary-first.active button,:host.split-primary-first button:active,:host.split-primary-last.active button,:host.split-primary-last button:active{background:#25258C;border-color:#25258c}:host.primary.disabled button,:host.split-primary-first.disabled button,:host.split-primary-last.disabled button{color:#aeabac;background:#F0F1F4;border-color:#f0f1f4}:host.split-primary-first button{border-right-color:#dfe0e3}:host.split-primary-first.disabled button{border-right-color:#aeabac}:host.secondary button,:host.split-secondary-first button,:host.split-secondary-last button{color:#4646ce;background:#FFFFFF;border-color:#4646ce}:host.secondary button:hover,:host.split-secondary-first button:hover,:host.split-secondary-last button:hover{background:#F5F5F5;box-shadow:0 4px 14px #0000001a}:host.secondary.active button,:host.secondary button:active,:host.split-secondary-first.active button,:host.split-secondary-first button:active,:host.split-secondary-last.active button,:host.split-secondary-last button:active{background:#EAEAFF;box-shadow:none}:host.secondary.disabled button,:host.split-secondary-first.disabled button,:host.split-secondary-last.disabled button{color:#aeabac;border-color:#aeabac}:host.split-secondary-first button{border-right-color:#4646ce}:host.split-secondary-first.disabled button{border-right-color:#aeabac}:host.icon button,:host.icon-primary button,:host.icon-secondary button{width:28px;height:28px;padding:0;justify-content:center}:host.icon button i,:host.icon-primary button i,:host.icon-secondary button i{margin:0!important}:host.icon button{background:transparent;border-color:transparent;color:#6d6e6f}:host.icon button:hover{color:#333;background:#DFE0E3;border-color:#dfe0e3}:host.icon.active button,:host.icon button:active{color:#4646ce;background:#EAEAFF;border-color:#eaeaff}:host.icon.disabled button{color:#aeabac;background:transparent;border-color:transparent}:host.icon-primary button{color:#fff;background:#4646CE;border-color:#4646ce}:host.icon-primary button:hover{color:#fff;background:linear-gradient(96.89deg,#25258C 0%,#4646CE 100%);border-color:linear-gradient(96.89deg,#25258C 0%,#4646CE 100%)}:host.icon-primary.active button,:host.icon-primary button:active{color:#fff;background:#25258C;border-color:#25258c}:host.icon-primary.disabled button{color:#aeabac;background:#F0F1F4;border-color:#f0f1f4}:host.icon-secondary button{color:#4646ce;background:#FFFFFF;border-color:#4646ce}:host.icon-secondary button:hover{color:#4646ce;background:#F5F5F5;border-color:#4646ce}:host.icon-secondary.active button,:host.icon-secondary button:active{color:#4646ce;background:#EAEAFF;border-color:#4646ce}:host.icon-secondary.disabled button{color:#aeabac;background:#F0F1F4;border-color:#f0f1f4}:host.ghost button{border-radius:4px;padding:4px;background:transparent;border-color:transparent;color:#6d6e6f}:host.ghost button .dr-button__spinner{color:#4646ce;background:#FFFFFF}:host.ghost button:hover{color:#333;background:#F5F5F5;border-color:#f5f5f5}:host.ghost.active button,:host.ghost button:active{color:#4646ce;background:#EAEAFF;border-color:#eaeaff}:host.ghost.disabled button{color:#aeabac;background:transparent;border-color:transparent}:host.selection button{border-radius:6px;padding:4px 8px;background:#FFFFFF;border-color:#9ea1aa;color:#6d6e6f}:host.selection button:hover{color:#6d6e6f;background:#F5F5F5;border-color:#4e566c}:host.selection.active button,:host.selection button:active{color:#6d6e6f;background:#EAEAFF;border-color:#4646ce}:host.selection.disabled button{color:#aeabac;background:#F0F1F4;border-color:#aeabac}:host.link button{border:none;background:none;color:#4646ce;padding:0 4px}:host.link button:hover,:host.link.active button,:host.link button:active{text-decoration:underline}:host.link.disabled button{color:#aeabac}:host.danger button{color:#fff;background:#BF1D30;border-color:#bf1d30}:host.danger button:hover{background:#981440;border-color:#981440}:host.danger.active button,:host.danger button:active{background:#680325;border-color:#680325}:host.danger.disabled button{color:#aeabac;background:#F0F1F4;border-color:#f0f1f4}@keyframes rotate{0%{transform:rotate(0)}to{transform:rotate(360deg)}}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.5", ngImport: i0, type: DrButtonComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'dr-button', template: "<button (click)=\"onClick($event)\"\n        [disabled]=\"disabled\">\n    <i *ngIf=\"icon\"\n       class=\"dr-button__icon\"\n       [class]=\"icon\"\n       [style.font-size]=\"iconSize\"\n       [style.color]=\"iconColor || 'inherit'\">\n    </i>\n    <ng-content></ng-content>\n    <div *ngIf=\"isLoading\"\n         class=\"dr-button__spinner\">\n        <i [style.font-size]=\"iconSize\" class=\"dr-icon-load\"></i>\n    </div>\n    <i *ngIf=\"iconAfter\"\n       class=\"dr-button__icon dr-button__icon--after\"\n       [class]=\"iconAfter\"\n       [style.font-size]=\"iconAfterSize\"\n       [style.color]=\"iconAfterColor || 'inherit'\">\n    </i>\n</button>\n", styles: [":host{display:inline-block}:host.disabled,:host.loading{pointer-events:none}:host button{position:relative;display:flex;align-items:center;flex-wrap:nowrap;cursor:pointer;font-family:Poppins,sans-serif;font-weight:400;font-size:14px;font-style:normal;line-height:22px;border-radius:16px;padding:4px 16px;height:32px;border:1px solid}:host button .dr-button__spinner{display:flex;align-items:center;justify-content:center;position:absolute;inset:0;background:inherit;border-radius:inherit}:host button .dr-button__spinner i{animation-name:rotate;animation-iteration-count:infinite;animation-duration:1s}:host.with-icon button{padding-left:8px}:host.with-icon button i:first-child{margin-right:4px}:host.with-icon-after button{padding-right:8px}:host.with-icon-after button i:last-child{margin-left:4px}:host.split-primary-first button,:host.split-secondary-first button{border-bottom-right-radius:0;border-top-right-radius:0;padding-right:8px}:host.help button{padding:4px 16px 4px 8px;color:#333;height:28px}:host.help button i{min-width:4px}:host.split-primary-last button,:host.split-secondary-last button{border-bottom-left-radius:0;border-top-left-radius:0;padding-right:8px;padding-left:4px;border-left:none}:host.split-primary-last button i,:host.split-secondary-last button i{margin:0!important}:host.primary button,:host.split-primary-first button,:host.split-primary-last button{color:#fff;background:#4646CE;border-color:#4646ce}:host.primary button:hover,:host.split-primary-first button:hover,:host.split-primary-last button:hover{background:linear-gradient(96.89deg,#25258C 0%,#4646CE 100%);border-color:linear-gradient(96.89deg,#25258C 0%,#4646CE 100%)}:host.primary.active button,:host.primary button:active,:host.split-primary-first.active button,:host.split-primary-first button:active,:host.split-primary-last.active button,:host.split-primary-last button:active{background:#25258C;border-color:#25258c}:host.primary.disabled button,:host.split-primary-first.disabled button,:host.split-primary-last.disabled button{color:#aeabac;background:#F0F1F4;border-color:#f0f1f4}:host.split-primary-first button{border-right-color:#dfe0e3}:host.split-primary-first.disabled button{border-right-color:#aeabac}:host.secondary button,:host.split-secondary-first button,:host.split-secondary-last button{color:#4646ce;background:#FFFFFF;border-color:#4646ce}:host.secondary button:hover,:host.split-secondary-first button:hover,:host.split-secondary-last button:hover{background:#F5F5F5;box-shadow:0 4px 14px #0000001a}:host.secondary.active button,:host.secondary button:active,:host.split-secondary-first.active button,:host.split-secondary-first button:active,:host.split-secondary-last.active button,:host.split-secondary-last button:active{background:#EAEAFF;box-shadow:none}:host.secondary.disabled button,:host.split-secondary-first.disabled button,:host.split-secondary-last.disabled button{color:#aeabac;border-color:#aeabac}:host.split-secondary-first button{border-right-color:#4646ce}:host.split-secondary-first.disabled button{border-right-color:#aeabac}:host.icon button,:host.icon-primary button,:host.icon-secondary button{width:28px;height:28px;padding:0;justify-content:center}:host.icon button i,:host.icon-primary button i,:host.icon-secondary button i{margin:0!important}:host.icon button{background:transparent;border-color:transparent;color:#6d6e6f}:host.icon button:hover{color:#333;background:#DFE0E3;border-color:#dfe0e3}:host.icon.active button,:host.icon button:active{color:#4646ce;background:#EAEAFF;border-color:#eaeaff}:host.icon.disabled button{color:#aeabac;background:transparent;border-color:transparent}:host.icon-primary button{color:#fff;background:#4646CE;border-color:#4646ce}:host.icon-primary button:hover{color:#fff;background:linear-gradient(96.89deg,#25258C 0%,#4646CE 100%);border-color:linear-gradient(96.89deg,#25258C 0%,#4646CE 100%)}:host.icon-primary.active button,:host.icon-primary button:active{color:#fff;background:#25258C;border-color:#25258c}:host.icon-primary.disabled button{color:#aeabac;background:#F0F1F4;border-color:#f0f1f4}:host.icon-secondary button{color:#4646ce;background:#FFFFFF;border-color:#4646ce}:host.icon-secondary button:hover{color:#4646ce;background:#F5F5F5;border-color:#4646ce}:host.icon-secondary.active button,:host.icon-secondary button:active{color:#4646ce;background:#EAEAFF;border-color:#4646ce}:host.icon-secondary.disabled button{color:#aeabac;background:#F0F1F4;border-color:#f0f1f4}:host.ghost button{border-radius:4px;padding:4px;background:transparent;border-color:transparent;color:#6d6e6f}:host.ghost button .dr-button__spinner{color:#4646ce;background:#FFFFFF}:host.ghost button:hover{color:#333;background:#F5F5F5;border-color:#f5f5f5}:host.ghost.active button,:host.ghost button:active{color:#4646ce;background:#EAEAFF;border-color:#eaeaff}:host.ghost.disabled button{color:#aeabac;background:transparent;border-color:transparent}:host.selection button{border-radius:6px;padding:4px 8px;background:#FFFFFF;border-color:#9ea1aa;color:#6d6e6f}:host.selection button:hover{color:#6d6e6f;background:#F5F5F5;border-color:#4e566c}:host.selection.active button,:host.selection button:active{color:#6d6e6f;background:#EAEAFF;border-color:#4646ce}:host.selection.disabled button{color:#aeabac;background:#F0F1F4;border-color:#aeabac}:host.link button{border:none;background:none;color:#4646ce;padding:0 4px}:host.link button:hover,:host.link.active button,:host.link button:active{text-decoration:underline}:host.link.disabled button{color:#aeabac}:host.danger button{color:#fff;background:#BF1D30;border-color:#bf1d30}:host.danger button:hover{background:#981440;border-color:#981440}:host.danger.active button,:host.danger button:active{background:#680325;border-color:#680325}:host.danger.disabled button{color:#aeabac;background:#F0F1F4;border-color:#f0f1f4}@keyframes rotate{0%{transform:rotate(0)}to{transform:rotate(360deg)}}\n"] }]
+            args: [{ selector: 'dr-button', template: "<button (click)=\"onClick($event)\"\n        [disabled]=\"disabled\">\n    <i *ngIf=\"icon\"\n       class=\"dr-button__icon\"\n       [class]=\"icon\"\n       [style.font-size]=\"iconSize\"\n       [style.color]=\"iconColor || 'inherit'\">\n    </i>\n    <ng-content></ng-content>\n    <div *ngIf=\"isLoading\"\n         class=\"dr-button__spinner\">\n        <i [style.font-size]=\"iconSize\" class=\"dr-icon-load\"></i>\n    </div>\n    <i *ngIf=\"iconAfter\"\n       class=\"dr-button__icon dr-button__icon--after\"\n       [class]=\"iconAfter\"\n       [style.font-size]=\"iconAfterSize\"\n       [style.color]=\"iconAfterColor || 'inherit'\">\n    </i>\n</button>\n", styles: [":host{display:inline-block}:host.disabled,:host.loading{pointer-events:none}:host button{position:relative;display:flex;align-items:center;flex-wrap:nowrap;cursor:pointer;font-family:Poppins,sans-serif;font-weight:400;font-size:14px;font-style:normal;line-height:22px;border-radius:16px;padding:4px 16px;height:32px;border:1px solid}:host button .dr-button__spinner{display:flex;align-items:center;justify-content:center;position:absolute;inset:0;background:inherit;border-radius:inherit}:host button .dr-button__spinner i{animation-name:rotate;animation-iteration-count:infinite;animation-duration:1s}:host.with-icon button{padding-left:8px}:host.with-icon button i:first-child{margin-right:4px}:host.with-icon-after button{padding-right:8px}:host.with-icon-after button i:last-child{margin-left:4px}:host.split-primary-first button,:host.split-secondary-first button{border-bottom-right-radius:0;border-top-right-radius:0;padding-right:8px}:host.help button{padding:4px 16px 4px 8px;color:#333;height:28px;border:none;min-width:84px}:host.help button i{min-width:4px}:host.split-primary-last button,:host.split-secondary-last button{border-bottom-left-radius:0;border-top-left-radius:0;padding-right:8px;padding-left:4px;border-left:none}:host.split-primary-last button i,:host.split-secondary-last button i{margin:0!important}:host.primary button,:host.split-primary-first button,:host.split-primary-last button{color:#fff;background:#4646CE;border-color:#4646ce}:host.primary button:hover,:host.split-primary-first button:hover,:host.split-primary-last button:hover{background:linear-gradient(96.89deg,#25258C 0%,#4646CE 100%);border-color:linear-gradient(96.89deg,#25258C 0%,#4646CE 100%)}:host.primary.active button,:host.primary button:active,:host.split-primary-first.active button,:host.split-primary-first button:active,:host.split-primary-last.active button,:host.split-primary-last button:active{background:#25258C;border-color:#25258c}:host.primary.disabled button,:host.split-primary-first.disabled button,:host.split-primary-last.disabled button{color:#aeabac;background:#F0F1F4;border-color:#f0f1f4}:host.split-primary-first button{border-right-color:#dfe0e3}:host.split-primary-first.disabled button{border-right-color:#aeabac}:host.secondary button,:host.split-secondary-first button,:host.split-secondary-last button{color:#4646ce;background:#FFFFFF;border-color:#4646ce}:host.secondary button:hover,:host.split-secondary-first button:hover,:host.split-secondary-last button:hover{background:#F5F5F5;box-shadow:0 4px 14px #0000001a}:host.secondary.active button,:host.secondary button:active,:host.split-secondary-first.active button,:host.split-secondary-first button:active,:host.split-secondary-last.active button,:host.split-secondary-last button:active{background:#EAEAFF;box-shadow:none}:host.secondary.disabled button,:host.split-secondary-first.disabled button,:host.split-secondary-last.disabled button{color:#aeabac;border-color:#aeabac}:host.split-secondary-first button{border-right-color:#4646ce}:host.split-secondary-first.disabled button{border-right-color:#aeabac}:host.icon button,:host.icon-primary button,:host.icon-secondary button{width:28px;height:28px;padding:0;justify-content:center}:host.icon button i,:host.icon-primary button i,:host.icon-secondary button i{margin:0!important}:host.icon button{background:transparent;border-color:transparent;color:#6d6e6f}:host.icon button:hover{color:#333;background:#DFE0E3;border-color:#dfe0e3}:host.icon.active button,:host.icon button:active{color:#4646ce;background:#EAEAFF;border-color:#eaeaff}:host.icon.disabled button{color:#aeabac;background:transparent;border-color:transparent}:host.icon-primary button{color:#fff;background:#4646CE;border-color:#4646ce}:host.icon-primary button:hover{color:#fff;background:linear-gradient(96.89deg,#25258C 0%,#4646CE 100%);border-color:linear-gradient(96.89deg,#25258C 0%,#4646CE 100%)}:host.icon-primary.active button,:host.icon-primary button:active{color:#fff;background:#25258C;border-color:#25258c}:host.icon-primary.disabled button{color:#aeabac;background:#F0F1F4;border-color:#f0f1f4}:host.icon-secondary button{color:#4646ce;background:#FFFFFF;border-color:#4646ce}:host.icon-secondary button:hover{color:#4646ce;background:#F5F5F5;border-color:#4646ce}:host.icon-secondary.active button,:host.icon-secondary button:active{color:#4646ce;background:#EAEAFF;border-color:#4646ce}:host.icon-secondary.disabled button{color:#aeabac;background:#F0F1F4;border-color:#f0f1f4}:host.ghost button{border-radius:4px;padding:4px;background:transparent;border-color:transparent;color:#6d6e6f}:host.ghost button .dr-button__spinner{color:#4646ce;background:#FFFFFF}:host.ghost button:hover{color:#333;background:#F5F5F5;border-color:#f5f5f5}:host.ghost.active button,:host.ghost button:active{color:#4646ce;background:#EAEAFF;border-color:#eaeaff}:host.ghost.disabled button{color:#aeabac;background:transparent;border-color:transparent}:host.selection button{border-radius:6px;padding:4px 8px;background:#FFFFFF;border-color:#9ea1aa;color:#6d6e6f}:host.selection button:hover{color:#6d6e6f;background:#F5F5F5;border-color:#4e566c}:host.selection.active button,:host.selection button:active{color:#6d6e6f;background:#EAEAFF;border-color:#4646ce}:host.selection.disabled button{color:#aeabac;background:#F0F1F4;border-color:#aeabac}:host.link button{border:none;background:none;color:#4646ce;padding:0 4px}:host.link button:hover,:host.link.active button,:host.link button:active{text-decoration:underline}:host.link.disabled button{color:#aeabac}:host.danger button{color:#fff;background:#BF1D30;border-color:#bf1d30}:host.danger button:hover{background:#981440;border-color:#981440}:host.danger.active button,:host.danger button:active{background:#680325;border-color:#680325}:host.danger.disabled button{color:#aeabac;background:#F0F1F4;border-color:#f0f1f4}@keyframes rotate{0%{transform:rotate(0)}to{transform:rotate(360deg)}}\n"] }]
         }], ctorParameters: function () { return []; }, propDecorators: { theme: [{
                 type: Input
             }, {