UNPKG

ng-devui

Version:

DevUI components based on Angular

devui.design

DevCloudFE/ng-devui

78 lines (76 loc) • 55.3 kB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
import * as i1 from '@angular/common'; import { CommonModule } from '@angular/common'; import * as i0 from '@angular/core'; import { Component, ChangeDetectionStrategy, Input, EventEmitter, Output, ViewChild, HostListener, NgModule } from '@angular/core'; import * as i3 from 'ng-devui/common'; import { DCommonModule } from 'ng-devui/common'; import * as i2 from 'ng-devui/loading'; import { LoadingModule } from 'ng-devui/loading'; import { AnimationNumberDuration } from 'ng-devui/utils'; class ButtonGroupComponent { constructor() { this.size = 'md'; } static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ButtonGroupComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); } static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: ButtonGroupComponent, selector: "d-button-group", inputs: { size: "size" }, ngImport: i0, template: "<div class=\"devui-btn-group {{ size ? 'devui-btn-group-' + size : '' }}\">\n <ng-content></ng-content>\n</div>\n", styles: [".devui-font-size-base{font-size:var(--devui-font-size, 12px)}.devui-font-base{font-size:var(--devui-font-size, 12px);font-weight:var(--devui-font-content-weight, normal);line-height:var(--devui-line-height-base, 1.5)}.devui-font-size-modal-title{font-size:var(--devui-font-size-modal-title, 18px)}.devui-font-modal-title{font-size:var(--devui-font-size-modal-title, 18px);font-weight:var(--devui-font-title-weight, bold);line-height:var(--devui-line-height-base, 1.5)}.devui-font-size-page-title{font-size:var(--devui-font-size-page-title, 16px)}.devui-font-page-title{font-size:var(--devui-font-size-page-title, 16px);font-weight:var(--devui-font-title-weight, bold);line-height:var(--devui-line-height-base, 1.5)}.devui-font-size-secondary-title{font-size:var(--devui-font-size-card-title, 14px)}.devui-font-secondary-title{font-size:var(--devui-font-size-card-title, 14px);font-weight:var(--devui-font-title-weight, bold);line-height:var(--devui-line-height-base, 1.5)}.devui-btn{padding:var(--devui-btn-padding, 0 20px);font-size:var(--devui-font-size-md, 12px);height:28px;line-height:var(--devui-line-height-base, 1.5);border-radius:var(--devui-btn-border-radius, var(--devui-border-radius, 2px));border-width:1px;border-color:transparent;background-color:transparent;position:relative;overflow:hidden;transform:scale(1)}.devui-btn.devui-btn-common{color:var(--devui-text, #191919);min-width:64px;background-color:var(--devui-btn-common-bg, var(--devui-base-bg, #ffffff));border-color:var(--devui-btn-common-border-color, var(--devui-line, #dbdbdb))}.devui-btn.devui-btn-stress,.devui-btn.devui-btn-primary{color:var(--devui-light-text, #ffffff);min-width:64px;background-color:var(--devui-primary, #0a59f7)}.devui-btn.devui-btn-danger{color:var(--devui-light-text, #ffffff);min-width:64px;background-color:var(--devui-contrast, #c7000b)}.devui-btn.devui-btn-left{border-radius:var(--devui-border-radius, 2px) 0 0 var(--devui-border-radius, 2px)}.devui-btn.devui-btn-right{border-radius:0 var(--devui-border-radius, 2px) var(--devui-border-radius, 2px) 0}.devui-btn.devui-btn-xs,:host ::ng-deep .devui-btn-group-xs .devui-btn{padding:0 4px;height:24px;font-size:var(--devui-font-size-sm, 12px);min-width:48px}.devui-btn.devui-btn-sm,:host ::ng-deep .devui-btn-group-sm .devui-btn{padding:var(--devui-btn-sm-padding, 0 16px);height:24px;font-size:var(--devui-font-size-sm, 12px);min-width:56px}.devui-btn.devui-btn-lg,:host ::ng-deep .devui-btn-group-lg .devui-btn{padding:var(--devui-btn-lg-padding, 0 24px);height:32px;font-size:var(--devui-font-size-lg, 14px);min-width:72px}.devui-btn.devui-btn-text,.devui-btn.devui-btn-text-dark{color:var(--devui-brand-active, #0950de);padding:0}.devui-btn.devui-btn-text:hover,.devui-btn.devui-btn-text:active,.devui-btn.devui-btn-text-dark:hover,.devui-btn.devui-btn-text-dark:active{background-color:transparent;color:var(--devui-brand-active-focus, #00196b)}.devui-btn.devui-btn-common:hover{border-color:var(--devui-btn-common-border-color-hover, var(--devui-form-control-line-active, #0a59f7));color:var(--devui-btn-common-color-hover, var(--devui-brand-active, #0950de));background-color:var(--devui-btn-common-bg-hover, var(--devui-base-bg, #ffffff))}.devui-btn.devui-btn-common:active{border-color:var(--devui-btn-common-border-color-active, var(--devui-form-control-line-active, #0a59f7));color:var(--devui-btn-common-color-active, var(--devui-brand-active, #0950de));background-color:var(--devui-btn-common-bg-active, var(--devui-base-bg, #ffffff))}.devui-btn.devui-btn-stress:hover{background-color:var(--devui-primary-hover, #3979f9)}.devui-btn.devui-btn-stress:active{background-color:var(--devui-primary-active, #00196b)}.devui-btn.devui-btn-primary:hover{background-color:var(--devui-primary-hover, #3979f9)}.devui-btn.devui-btn-primary:active{background-color:var(--devui-primary-active, #00196b)}.devui-btn.devui-btn-danger:hover{background-color:var(--devui-contrast-hover, #cc272a)}.devui-btn.devui-btn-danger:active{background-color:var(--devui-contrast-active, #78080e)}.devui-btn.devui-btn-common:disabled{color:var(--devui-btn-common-text-disabled, var(--devui-disabled-text, #c2c2c2));background:var(--devui-btn-common-bg-disabled, var(--devui-disabled-bg, #f3f3f3));border-color:var(--devui-btn-common-border-disabled, var(--devui-disabled-line, #e6e6e6))}.devui-btn.devui-btn-primary:disabled{color:var(--devui-btn-primary-text-disabled, var(--devui-light-text, #ffffff));background:var(--devui-btn-primary-bg-disabled, var(--devui-primary-disabled, #9dbdfc));border-color:transparent}.devui-btn.devui-btn-danger:disabled{color:var(--devui-light-text, #ffffff);background:#f59297;border:1px solid #f59297}.devui-btn.devui-btn-text-dark:disabled{color:var(--devui-disabled-text, #c2c2c2)}.devui-btn.devui-btn-text:disabled{color:var(--devui-disabled-text, #c2c2c2)}.devui-btn.bordered.devui-btn-common{color:var(--devui-text, #191919);border-color:transparent}.devui-btn.bordered.devui-btn-common:hover,.devui-btn.bordered.devui-btn-common:focus{border-color:var(--devui-primary-hover, #3979f9)}.devui-btn.bordered.devui-btn-common:active{border-color:var(--devui-primary-active, #00196b)}.devui-btn.bordered.devui-btn-stress,.devui-btn.bordered.devui-btn-primary{border-color:var(--devui-brand, #0a59f7);color:var(--devui-brand, #0a59f7);background-color:var(--devui-block, #ffffff)}.devui-btn.bordered.devui-btn-success{border-color:var(--devui-success, #058358);color:var(--devui-success, #058358);background-color:var(--devui-block, #ffffff)}.devui-btn.bordered.devui-btn-warning{border-color:var(--devui-warning, #fcc800);color:var(--devui-warning, #fcc800);background-color:var(--devui-block, #ffffff)}.devui-btn.bordered.devui-btn-danger{border-color:var(--devui-danger, #e02128);color:var(--devui-danger, #e02128);background-color:var(--devui-block, #ffffff)}.devui-btn.d-btn-icon:not(.devui-btn-primary):not(.devui-btn-danger):not(.devui-btn-common):hover,.devui-btn.d-btn-icon:not(.devui-btn-primary):not(.devui-btn-danger):not(.devui-btn-common):focus{border:1px solid var(--devui-list-item-hover-bg, #f2f2f3);background-color:var(--devui-list-item-hover-bg, #f2f2f3)}.devui-btn.d-btn-icon:not(.devui-btn-primary):not(.devui-btn-danger):not(.devui-btn-common):disabled{background-color:var(--devui-disabled-bg, #f3f3f3)}.devui-btn:not(:disabled).devui-btn-text.d-btn-icon-wrap,.devui-btn:not(:disabled).devui-btn-text-dark.d-btn-icon-wrap{color:var(--devui-text, #191919)}.devui-btn:not(:disabled).devui-btn-text.d-btn-icon-wrap .devui-icon-fix,.devui-btn:not(:disabled).devui-btn-text-dark.d-btn-icon-wrap .devui-icon-fix{color:var(--devui-icon-fill, #595959)}.devui-btn:not(:disabled).devui-btn-text.d-btn-icon-wrap:hover,.devui-btn:not(:disabled).devui-btn-text-dark.d-btn-icon-wrap:hover{color:var(--devui-icon-fill-hover, #191919)}.devui-btn:not(:disabled).devui-btn-text.d-btn-icon-wrap:hover .devui-icon-fix,.devui-btn:not(:disabled).devui-btn-text-dark.d-btn-icon-wrap:hover .devui-icon-fix{color:var(--devui-icon-fill-hover, #191919)}.devui-btn.mouseDown:not(:disabled){transform:scale(.95)}.devui-loading .devui-loading-default-spinner div{background-color:var(--devui-text, #191919)}:host{display:inline-block}.devui-btn{transition:background-color var(--devui-animation-duration-slow, .3s) var(--devui-animation-ease-in-out-smooth, cubic-bezier(.645, .045, .355, 1)),border-color var(--devui-animation-duration-slow, .3s) var(--devui-animation-ease-in-out-smooth, cubic-bezier(.645, .045, .355, 1)),color var(--devui-animation-duration-slow, .3s) var(--devui-animation-ease-in-out-smooth, cubic-bezier(.645, .045, .355, 1));border-style:solid;white-space:nowrap;display:flex;align-items:center;justify-content:center}.devui-btn:disabled,.devui-btn[disabled]{cursor:not-allowed}.devui-btn.d-btn-icon{padding:8px;line-height:1em;min-width:unset;border:1px solid transparent}.devui-btn.d-btn-icon:not(.devui-btn-common){border:1px solid transparent}.devui-btn.d-btn-icon.devui-btn-xs,:host ::ng-deep .devui-btn-group-xs .devui-btn.d-btn-icon,.devui-btn.d-btn-icon.devui-btn-sm,:host ::ng-deep .devui-btn-group-sm .devui-btn.d-btn-icon{padding:4px}.devui-btn.d-btn-icon.devui-btn-xs,:host ::ng-deep .devui-btn-group-xs .devui-btn.d-btn-icon{min-width:24px}.devui-btn.d-btn-icon.devui-btn-sm,:host ::ng-deep .devui-btn-group-sm .devui-btn.d-btn-icon{min-width:24px}.devui-btn.d-btn-icon.devui-btn-lg,:host ::ng-deep .devui-btn-group-lg .devui-btn.d-btn-icon{min-width:32px}.devui-btn.d-btn-icon.devui-btn-lg .icon,:host ::ng-deep .devui-btn-group-lg .devui-btn.d-btn-icon .icon{font-size:var(--devui-font-size-icon, 16px)}.devui-btn:not(.d-btn-icon) .icon-fix{font-size:var(--devui-font-size-icon, 16px)}.devui-icon-fix{position:relative;font-size:var(--devui-font-size, 12px);pointer-events:none}.devui-icon-fix:before{transition:color var(--devui-animation-duration-slow, .3s) var(--devui-animation-ease-in-out-smooth, cubic-bezier(.645, .045, .355, 1))}.devui-btn.devui-btn-common:not(:disabled) .devui-icon-fix{color:var(--devui-text-weak, #333333)}.devui-btn.devui-btn-common:not(:disabled):hover .devui-icon-fix,.devui-btn.devui-btn-common:not(:disabled):active .devui-icon-fix,.devui-btn.devui-btn-common:not(:disabled):focus .devui-icon-fix{color:var(--devui-icon-fill-active, #191919)}.button-content{display:inline-block;position:relative;pointer-events:none}.clear-right-8{margin-right:8px}.devui-btn-more-text-omits{text-overflow:ellipsis;overflow:hidden;white-space:nowrap}.devui-btn-circle{border-radius:100%}.devui-button-water-wave{position:absolute;background-color:var(--devui-base-bg, #ffffff);border-radius:50%;opacity:0;width:20px;height:20px;transform:translate(-50%,-50%);animation:waterWave var(--devui-animation-duration-slow, .3s) var(--devui-animation-linear, cubic-bezier(0, 0, 1, 1))}@keyframes waterWave{0%{opacity:.2;width:30px;height:30px}to{opacity:0;width:200px;height:200px}}:host ::ng-deep .devui-btn-group{display:flex}:host ::ng-deep .devui-btn-group>*{position:relative}:host ::ng-deep .devui-btn-group>*:not(:first-child) .devui-dropdown-toggle:not(d-button),:host ::ng-deep .devui-btn-group>*:not(:first-child) .devui-btn{border-top-left-radius:0;border-bottom-left-radius:0;margin-left:-1px}:host ::ng-deep .devui-btn-group>*:not(:first-child) .devui-dropdown-toggle:not(d-button).devui-btn-primary,:host ::ng-deep .devui-btn-group>*:not(:first-child) .devui-btn.devui-btn-primary{margin-left:0}:host ::ng-deep .devui-btn-group>*:not(:first-child) .devui-dropdown-menu{left:-1px}:host ::ng-deep .devui-btn-group>*:not(:last-child) .devui-dropdown-toggle,:host ::ng-deep .devui-btn-group>*:not(:last-child) .devui-btn{border-top-right-radius:0;border-bottom-right-radius:0}:host ::ng-deep .devui-btn-group>* .devui-dropdown-origin{z-index:0}:host ::ng-deep .devui-btn-group>*:hover,:host ::ng-deep .devui-btn-group>*:active{z-index:1}:host ::ng-deep .devui-btn-group>*:focus-within{z-index:1}:host ::ng-deep d-button+d-button .devui-btn-primary:not(:disabled):before,:host ::ng-deep d-button+d-button .devui-btn-common:not(:disabled):before,:host ::ng-deep d-button+d-button .devui-btn-danger:not(:disabled):before{content:\"\";position:absolute;top:1px;bottom:1px;left:0;width:1px}:host ::ng-deep d-button+d-button .devui-btn-primary:not(:disabled):before{background-color:#fff3}:host ::ng-deep d-button+d-button .devui-btn-common:not(:disabled):before{background-color:var(--devui-btn-common-bg-hover, var(--devui-base-bg, #ffffff))}:host ::ng-deep d-button+d-button .devui-btn:disabled{border-left-style:none;margin-left:0}:host ::ng-deep d-button:active+d-button .devui-btn-primary:not(:disabled):before,:host ::ng-deep d-button+d-button:active .devui-btn-primary:not(:disabled):before{background-color:var(--devui-primary-active, #00196b)}:host ::ng-deep d-button:active+d-button .devui-btn-common:not(:disabled):before,:host ::ng-deep d-button+d-button:active .devui-btn-common:not(:disabled):before{background-color:var(--devui-btn-common-bg-active, var(--devui-base-bg, #ffffff))}:host ::ng-deep d-button:active+d-button .devui-btn-danger:not(:disabled):before,:host ::ng-deep d-button+d-button:active .devui-btn-danger:not(:disabled):before{background-color:var(--devui-contrast-active, #78080e)}:host ::ng-deep d-button:focus-within+d-button .devui-btn-primary:not(:disabled):before,:host ::ng-deep d-button+d-button:focus-within .devui-btn-primary:not(:disabled):before,:host ::ng-deep d-button:hover+d-button .devui-btn-primary:not(:disabled):before,:host ::ng-deep d-button+d-button:hover .devui-btn-primary:not(:disabled):before{background-color:var(--devui-primary-hover, #3979f9)}:host ::ng-deep d-button:focus-within+d-button .devui-btn-common:not(:disabled):before,:host ::ng-deep d-button+d-button:focus-within .devui-btn-common:not(:disabled):before,:host ::ng-deep d-button:hover+d-button .devui-btn-common:not(:disabled):before,:host ::ng-deep d-button+d-button:hover .devui-btn-common:not(:disabled):before{background-color:var(--devui-btn-common-border-color-hover, var(--devui-form-control-line-active, #0a59f7))}:host ::ng-deep d-button:focus-within+d-button .devui-btn-danger:not(:disabled):before,:host ::ng-deep d-button+d-button:focus-within .devui-btn-danger:not(:disabled):before,:host ::ng-deep d-button:hover+d-button .devui-btn-danger:not(:disabled):before,:host ::ng-deep d-button+d-button:hover .devui-btn-danger:not(:disabled):before{background-color:var(--devui-contrast-hover, #cc272a)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); } } i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ButtonGroupComponent, decorators: [{ type: Component, args: [{ selector: 'd-button-group', changeDetection: ChangeDetectionStrategy.OnPush, preserveWhitespaces: false, template: "<div class=\"devui-btn-group {{ size ? 'devui-btn-group-' + size : '' }}\">\n <ng-content></ng-content>\n</div>\n", styles: [".devui-font-size-base{font-size:var(--devui-font-size, 12px)}.devui-font-base{font-size:var(--devui-font-size, 12px);font-weight:var(--devui-font-content-weight, normal);line-height:var(--devui-line-height-base, 1.5)}.devui-font-size-modal-title{font-size:var(--devui-font-size-modal-title, 18px)}.devui-font-modal-title{font-size:var(--devui-font-size-modal-title, 18px);font-weight:var(--devui-font-title-weight, bold);line-height:var(--devui-line-height-base, 1.5)}.devui-font-size-page-title{font-size:var(--devui-font-size-page-title, 16px)}.devui-font-page-title{font-size:var(--devui-font-size-page-title, 16px);font-weight:var(--devui-font-title-weight, bold);line-height:var(--devui-line-height-base, 1.5)}.devui-font-size-secondary-title{font-size:var(--devui-font-size-card-title, 14px)}.devui-font-secondary-title{font-size:var(--devui-font-size-card-title, 14px);font-weight:var(--devui-font-title-weight, bold);line-height:var(--devui-line-height-base, 1.5)}.devui-btn{padding:var(--devui-btn-padding, 0 20px);font-size:var(--devui-font-size-md, 12px);height:28px;line-height:var(--devui-line-height-base, 1.5);border-radius:var(--devui-btn-border-radius, var(--devui-border-radius, 2px));border-width:1px;border-color:transparent;background-color:transparent;position:relative;overflow:hidden;transform:scale(1)}.devui-btn.devui-btn-common{color:var(--devui-text, #191919);min-width:64px;background-color:var(--devui-btn-common-bg, var(--devui-base-bg, #ffffff));border-color:var(--devui-btn-common-border-color, var(--devui-line, #dbdbdb))}.devui-btn.devui-btn-stress,.devui-btn.devui-btn-primary{color:var(--devui-light-text, #ffffff);min-width:64px;background-color:var(--devui-primary, #0a59f7)}.devui-btn.devui-btn-danger{color:var(--devui-light-text, #ffffff);min-width:64px;background-color:var(--devui-contrast, #c7000b)}.devui-btn.devui-btn-left{border-radius:var(--devui-border-radius, 2px) 0 0 var(--devui-border-radius, 2px)}.devui-btn.devui-btn-right{border-radius:0 var(--devui-border-radius, 2px) var(--devui-border-radius, 2px) 0}.devui-btn.devui-btn-xs,:host ::ng-deep .devui-btn-group-xs .devui-btn{padding:0 4px;height:24px;font-size:var(--devui-font-size-sm, 12px);min-width:48px}.devui-btn.devui-btn-sm,:host ::ng-deep .devui-btn-group-sm .devui-btn{padding:var(--devui-btn-sm-padding, 0 16px);height:24px;font-size:var(--devui-font-size-sm, 12px);min-width:56px}.devui-btn.devui-btn-lg,:host ::ng-deep .devui-btn-group-lg .devui-btn{padding:var(--devui-btn-lg-padding, 0 24px);height:32px;font-size:var(--devui-font-size-lg, 14px);min-width:72px}.devui-btn.devui-btn-text,.devui-btn.devui-btn-text-dark{color:var(--devui-brand-active, #0950de);padding:0}.devui-btn.devui-btn-text:hover,.devui-btn.devui-btn-text:active,.devui-btn.devui-btn-text-dark:hover,.devui-btn.devui-btn-text-dark:active{background-color:transparent;color:var(--devui-brand-active-focus, #00196b)}.devui-btn.devui-btn-common:hover{border-color:var(--devui-btn-common-border-color-hover, var(--devui-form-control-line-active, #0a59f7));color:var(--devui-btn-common-color-hover, var(--devui-brand-active, #0950de));background-color:var(--devui-btn-common-bg-hover, var(--devui-base-bg, #ffffff))}.devui-btn.devui-btn-common:active{border-color:var(--devui-btn-common-border-color-active, var(--devui-form-control-line-active, #0a59f7));color:var(--devui-btn-common-color-active, var(--devui-brand-active, #0950de));background-color:var(--devui-btn-common-bg-active, var(--devui-base-bg, #ffffff))}.devui-btn.devui-btn-stress:hover{background-color:var(--devui-primary-hover, #3979f9)}.devui-btn.devui-btn-stress:active{background-color:var(--devui-primary-active, #00196b)}.devui-btn.devui-btn-primary:hover{background-color:var(--devui-primary-hover, #3979f9)}.devui-btn.devui-btn-primary:active{background-color:var(--devui-primary-active, #00196b)}.devui-btn.devui-btn-danger:hover{background-color:var(--devui-contrast-hover, #cc272a)}.devui-btn.devui-btn-danger:active{background-color:var(--devui-contrast-active, #78080e)}.devui-btn.devui-btn-common:disabled{color:var(--devui-btn-common-text-disabled, var(--devui-disabled-text, #c2c2c2));background:var(--devui-btn-common-bg-disabled, var(--devui-disabled-bg, #f3f3f3));border-color:var(--devui-btn-common-border-disabled, var(--devui-disabled-line, #e6e6e6))}.devui-btn.devui-btn-primary:disabled{color:var(--devui-btn-primary-text-disabled, var(--devui-light-text, #ffffff));background:var(--devui-btn-primary-bg-disabled, var(--devui-primary-disabled, #9dbdfc));border-color:transparent}.devui-btn.devui-btn-danger:disabled{color:var(--devui-light-text, #ffffff);background:#f59297;border:1px solid #f59297}.devui-btn.devui-btn-text-dark:disabled{color:var(--devui-disabled-text, #c2c2c2)}.devui-btn.devui-btn-text:disabled{color:var(--devui-disabled-text, #c2c2c2)}.devui-btn.bordered.devui-btn-common{color:var(--devui-text, #191919);border-color:transparent}.devui-btn.bordered.devui-btn-common:hover,.devui-btn.bordered.devui-btn-common:focus{border-color:var(--devui-primary-hover, #3979f9)}.devui-btn.bordered.devui-btn-common:active{border-color:var(--devui-primary-active, #00196b)}.devui-btn.bordered.devui-btn-stress,.devui-btn.bordered.devui-btn-primary{border-color:var(--devui-brand, #0a59f7);color:var(--devui-brand, #0a59f7);background-color:var(--devui-block, #ffffff)}.devui-btn.bordered.devui-btn-success{border-color:var(--devui-success, #058358);color:var(--devui-success, #058358);background-color:var(--devui-block, #ffffff)}.devui-btn.bordered.devui-btn-warning{border-color:var(--devui-warning, #fcc800);color:var(--devui-warning, #fcc800);background-color:var(--devui-block, #ffffff)}.devui-btn.bordered.devui-btn-danger{border-color:var(--devui-danger, #e02128);color:var(--devui-danger, #e02128);background-color:var(--devui-block, #ffffff)}.devui-btn.d-btn-icon:not(.devui-btn-primary):not(.devui-btn-danger):not(.devui-btn-common):hover,.devui-btn.d-btn-icon:not(.devui-btn-primary):not(.devui-btn-danger):not(.devui-btn-common):focus{border:1px solid var(--devui-list-item-hover-bg, #f2f2f3);background-color:var(--devui-list-item-hover-bg, #f2f2f3)}.devui-btn.d-btn-icon:not(.devui-btn-primary):not(.devui-btn-danger):not(.devui-btn-common):disabled{background-color:var(--devui-disabled-bg, #f3f3f3)}.devui-btn:not(:disabled).devui-btn-text.d-btn-icon-wrap,.devui-btn:not(:disabled).devui-btn-text-dark.d-btn-icon-wrap{color:var(--devui-text, #191919)}.devui-btn:not(:disabled).devui-btn-text.d-btn-icon-wrap .devui-icon-fix,.devui-btn:not(:disabled).devui-btn-text-dark.d-btn-icon-wrap .devui-icon-fix{color:var(--devui-icon-fill, #595959)}.devui-btn:not(:disabled).devui-btn-text.d-btn-icon-wrap:hover,.devui-btn:not(:disabled).devui-btn-text-dark.d-btn-icon-wrap:hover{color:var(--devui-icon-fill-hover, #191919)}.devui-btn:not(:disabled).devui-btn-text.d-btn-icon-wrap:hover .devui-icon-fix,.devui-btn:not(:disabled).devui-btn-text-dark.d-btn-icon-wrap:hover .devui-icon-fix{color:var(--devui-icon-fill-hover, #191919)}.devui-btn.mouseDown:not(:disabled){transform:scale(.95)}.devui-loading .devui-loading-default-spinner div{background-color:var(--devui-text, #191919)}:host{display:inline-block}.devui-btn{transition:background-color var(--devui-animation-duration-slow, .3s) var(--devui-animation-ease-in-out-smooth, cubic-bezier(.645, .045, .355, 1)),border-color var(--devui-animation-duration-slow, .3s) var(--devui-animation-ease-in-out-smooth, cubic-bezier(.645, .045, .355, 1)),color var(--devui-animation-duration-slow, .3s) var(--devui-animation-ease-in-out-smooth, cubic-bezier(.645, .045, .355, 1));border-style:solid;white-space:nowrap;display:flex;align-items:center;justify-content:center}.devui-btn:disabled,.devui-btn[disabled]{cursor:not-allowed}.devui-btn.d-btn-icon{padding:8px;line-height:1em;min-width:unset;border:1px solid transparent}.devui-btn.d-btn-icon:not(.devui-btn-common){border:1px solid transparent}.devui-btn.d-btn-icon.devui-btn-xs,:host ::ng-deep .devui-btn-group-xs .devui-btn.d-btn-icon,.devui-btn.d-btn-icon.devui-btn-sm,:host ::ng-deep .devui-btn-group-sm .devui-btn.d-btn-icon{padding:4px}.devui-btn.d-btn-icon.devui-btn-xs,:host ::ng-deep .devui-btn-group-xs .devui-btn.d-btn-icon{min-width:24px}.devui-btn.d-btn-icon.devui-btn-sm,:host ::ng-deep .devui-btn-group-sm .devui-btn.d-btn-icon{min-width:24px}.devui-btn.d-btn-icon.devui-btn-lg,:host ::ng-deep .devui-btn-group-lg .devui-btn.d-btn-icon{min-width:32px}.devui-btn.d-btn-icon.devui-btn-lg .icon,:host ::ng-deep .devui-btn-group-lg .devui-btn.d-btn-icon .icon{font-size:var(--devui-font-size-icon, 16px)}.devui-btn:not(.d-btn-icon) .icon-fix{font-size:var(--devui-font-size-icon, 16px)}.devui-icon-fix{position:relative;font-size:var(--devui-font-size, 12px);pointer-events:none}.devui-icon-fix:before{transition:color var(--devui-animation-duration-slow, .3s) var(--devui-animation-ease-in-out-smooth, cubic-bezier(.645, .045, .355, 1))}.devui-btn.devui-btn-common:not(:disabled) .devui-icon-fix{color:var(--devui-text-weak, #333333)}.devui-btn.devui-btn-common:not(:disabled):hover .devui-icon-fix,.devui-btn.devui-btn-common:not(:disabled):active .devui-icon-fix,.devui-btn.devui-btn-common:not(:disabled):focus .devui-icon-fix{color:var(--devui-icon-fill-active, #191919)}.button-content{display:inline-block;position:relative;pointer-events:none}.clear-right-8{margin-right:8px}.devui-btn-more-text-omits{text-overflow:ellipsis;overflow:hidden;white-space:nowrap}.devui-btn-circle{border-radius:100%}.devui-button-water-wave{position:absolute;background-color:var(--devui-base-bg, #ffffff);border-radius:50%;opacity:0;width:20px;height:20px;transform:translate(-50%,-50%);animation:waterWave var(--devui-animation-duration-slow, .3s) var(--devui-animation-linear, cubic-bezier(0, 0, 1, 1))}@keyframes waterWave{0%{opacity:.2;width:30px;height:30px}to{opacity:0;width:200px;height:200px}}:host ::ng-deep .devui-btn-group{display:flex}:host ::ng-deep .devui-btn-group>*{position:relative}:host ::ng-deep .devui-btn-group>*:not(:first-child) .devui-dropdown-toggle:not(d-button),:host ::ng-deep .devui-btn-group>*:not(:first-child) .devui-btn{border-top-left-radius:0;border-bottom-left-radius:0;margin-left:-1px}:host ::ng-deep .devui-btn-group>*:not(:first-child) .devui-dropdown-toggle:not(d-button).devui-btn-primary,:host ::ng-deep .devui-btn-group>*:not(:first-child) .devui-btn.devui-btn-primary{margin-left:0}:host ::ng-deep .devui-btn-group>*:not(:first-child) .devui-dropdown-menu{left:-1px}:host ::ng-deep .devui-btn-group>*:not(:last-child) .devui-dropdown-toggle,:host ::ng-deep .devui-btn-group>*:not(:last-child) .devui-btn{border-top-right-radius:0;border-bottom-right-radius:0}:host ::ng-deep .devui-btn-group>* .devui-dropdown-origin{z-index:0}:host ::ng-deep .devui-btn-group>*:hover,:host ::ng-deep .devui-btn-group>*:active{z-index:1}:host ::ng-deep .devui-btn-group>*:focus-within{z-index:1}:host ::ng-deep d-button+d-button .devui-btn-primary:not(:disabled):before,:host ::ng-deep d-button+d-button .devui-btn-common:not(:disabled):before,:host ::ng-deep d-button+d-button .devui-btn-danger:not(:disabled):before{content:\"\";position:absolute;top:1px;bottom:1px;left:0;width:1px}:host ::ng-deep d-button+d-button .devui-btn-primary:not(:disabled):before{background-color:#fff3}:host ::ng-deep d-button+d-button .devui-btn-common:not(:disabled):before{background-color:var(--devui-btn-common-bg-hover, var(--devui-base-bg, #ffffff))}:host ::ng-deep d-button+d-button .devui-btn:disabled{border-left-style:none;margin-left:0}:host ::ng-deep d-button:active+d-button .devui-btn-primary:not(:disabled):before,:host ::ng-deep d-button+d-button:active .devui-btn-primary:not(:disabled):before{background-color:var(--devui-primary-active, #00196b)}:host ::ng-deep d-button:active+d-button .devui-btn-common:not(:disabled):before,:host ::ng-deep d-button+d-button:active .devui-btn-common:not(:disabled):before{background-color:var(--devui-btn-common-bg-active, var(--devui-base-bg, #ffffff))}:host ::ng-deep d-button:active+d-button .devui-btn-danger:not(:disabled):before,:host ::ng-deep d-button+d-button:active .devui-btn-danger:not(:disabled):before{background-color:var(--devui-contrast-active, #78080e)}:host ::ng-deep d-button:focus-within+d-button .devui-btn-primary:not(:disabled):before,:host ::ng-deep d-button+d-button:focus-within .devui-btn-primary:not(:disabled):before,:host ::ng-deep d-button:hover+d-button .devui-btn-primary:not(:disabled):before,:host ::ng-deep d-button+d-button:hover .devui-btn-primary:not(:disabled):before{background-color:var(--devui-primary-hover, #3979f9)}:host ::ng-deep d-button:focus-within+d-button .devui-btn-common:not(:disabled):before,:host ::ng-deep d-button+d-button:focus-within .devui-btn-common:not(:disabled):before,:host ::ng-deep d-button:hover+d-button .devui-btn-common:not(:disabled):before,:host ::ng-deep d-button+d-button:hover .devui-btn-common:not(:disabled):before{background-color:var(--devui-btn-common-border-color-hover, var(--devui-form-control-line-active, #0a59f7))}:host ::ng-deep d-button:focus-within+d-button .devui-btn-danger:not(:disabled):before,:host ::ng-deep d-button+d-button:focus-within .devui-btn-danger:not(:disabled):before,:host ::ng-deep d-button:hover+d-button .devui-btn-danger:not(:disabled):before,:host ::ng-deep d-button+d-button:hover .devui-btn-danger:not(:disabled):before{background-color:var(--devui-contrast-hover, #cc272a)}\n"] }] }], ctorParameters: () => [], propDecorators: { size: [{ type: Input }] } }); class ButtonComponent { handleDisabled($event) { if (this.disabled) { $event.preventDefault(); $event.stopImmediatePropagation(); } } constructor(cd) { this.cd = cd; this.type = 'button'; this.bsStyle = 'primary'; this.bsSize = 'md'; /** * @deprecated * 原左右按钮用按钮组实现 */ this.bsPosition = 'default'; this.disabled = false; this.showLoading = false; this.autofocus = false; this.btnClick = new EventEmitter(); this.waveLeft = 0; this.waveTop = 0; this.showWave = false; this.isMouseDown = false; } // 新增click事件，解决直接在host上使用click，在disabled状态下还能触发事件 onClick(event) { if (!this.showLoading) { this.btnClick.emit(event); } this.showClickWave(event); } showClickWave(event) { this.waveLeft = event.offsetX; this.waveTop = event.offsetY; this.showWave = true; setTimeout(() => { this.showWave = false; this.cd.detectChanges(); }, AnimationNumberDuration.SLOW); } ngAfterContentChecked() { this.cd.detectChanges(); } hasContent() { return !!this.buttonContent && this.buttonContent.nativeElement && this.buttonContent.nativeElement.innerHTML.trim(); } static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ButtonComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); } static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: ButtonComponent, selector: "d-button", inputs: { id: "id", type: "type", bsStyle: "bsStyle", shape: "shape", bsSize: "bsSize", bsPosition: "bsPosition", bordered: "bordered", icon: "icon", disabled: "disabled", showLoading: "showLoading", width: "width", autofocus: "autofocus", loadingTemplateRef: "loadingTemplateRef" }, outputs: { btnClick: "btnClick" }, host: { listeners: { "click": "handleDisabled($event)" } }, viewQueries: [{ propertyName: "buttonContent", first: true, predicate: ["buttonContent"], descendants: true, static: true }], ngImport: i0, template: "<button\n [attr.id]=\"id\"\n class=\"devui-btn devui-btn-{{ bsStyle }} devui-btn-{{ bsSize }} devui-btn-{{ bsPosition }}\"\n [class.devui-btn-circle]=\"shape === 'circle'\"\n [type]=\"type\"\n [disabled]=\"disabled\"\n [class.bordered]=\"bordered\"\n [class.mouseDown]=\"isMouseDown\"\n [backdrop]=\"true\"\n dLoading\n [showLoading]=\"showLoading\"\n [loadingTemplateRef]=\"loadingTemplateRef\"\n [ngStyle]=\"{ width: width }\"\n [dAutoFocus]=\"autofocus\"\n (click)=\"onClick($event)\"\n [ngClass]=\"{ 'd-btn-icon': !!icon && !hasContent(), 'd-btn-icon-wrap': !!icon }\"\n (mousedown)=\"isMouseDown = true\"\n (mouseup)=\"isMouseDown = false\"\n>\n <span *ngIf=\"!!icon\" class=\"devui-icon-fix icon {{ icon }}\" [ngClass]=\"{ 'clear-right-8': hasContent() }\"></span>\n <!--\n --><span class=\"button-content\" [class.devui-btn-more-text-omits]=\"width !== undefined\" #buttonContent><ng-content></ng-content></span>\n <div class=\"devui-button-water-wave\" *ngIf=\"showWave\" [ngStyle]=\"{ top: waveTop + 'px', left: waveLeft + 'px' }\"></div>\n</button>\n", styles: [".devui-font-size-base{font-size:var(--devui-font-size, 12px)}.devui-font-base{font-size:var(--devui-font-size, 12px);font-weight:var(--devui-font-content-weight, normal);line-height:var(--devui-line-height-base, 1.5)}.devui-font-size-modal-title{font-size:var(--devui-font-size-modal-title, 18px)}.devui-font-modal-title{font-size:var(--devui-font-size-modal-title, 18px);font-weight:var(--devui-font-title-weight, bold);line-height:var(--devui-line-height-base, 1.5)}.devui-font-size-page-title{font-size:var(--devui-font-size-page-title, 16px)}.devui-font-page-title{font-size:var(--devui-font-size-page-title, 16px);font-weight:var(--devui-font-title-weight, bold);line-height:var(--devui-line-height-base, 1.5)}.devui-font-size-secondary-title{font-size:var(--devui-font-size-card-title, 14px)}.devui-font-secondary-title{font-size:var(--devui-font-size-card-title, 14px);font-weight:var(--devui-font-title-weight, bold);line-height:var(--devui-line-height-base, 1.5)}.devui-btn{padding:var(--devui-btn-padding, 0 20px);font-size:var(--devui-font-size-md, 12px);height:28px;line-height:var(--devui-line-height-base, 1.5);border-radius:var(--devui-btn-border-radius, var(--devui-border-radius, 2px));border-width:1px;border-color:transparent;background-color:transparent;position:relative;overflow:hidden;transform:scale(1)}.devui-btn.devui-btn-common{color:var(--devui-text, #191919);min-width:64px;background-color:var(--devui-btn-common-bg, var(--devui-base-bg, #ffffff));border-color:var(--devui-btn-common-border-color, var(--devui-line, #dbdbdb))}.devui-btn.devui-btn-stress,.devui-btn.devui-btn-primary{color:var(--devui-light-text, #ffffff);min-width:64px;background-color:var(--devui-primary, #0a59f7)}.devui-btn.devui-btn-danger{color:var(--devui-light-text, #ffffff);min-width:64px;background-color:var(--devui-contrast, #c7000b)}.devui-btn.devui-btn-left{border-radius:var(--devui-border-radius, 2px) 0 0 var(--devui-border-radius, 2px)}.devui-btn.devui-btn-right{border-radius:0 var(--devui-border-radius, 2px) var(--devui-border-radius, 2px) 0}.devui-btn.devui-btn-xs{padding:0 4px;height:24px;font-size:var(--devui-font-size-sm, 12px);min-width:48px}.devui-btn.devui-btn-sm{padding:var(--devui-btn-sm-padding, 0 16px);height:24px;font-size:var(--devui-font-size-sm, 12px);min-width:56px}.devui-btn.devui-btn-lg{padding:var(--devui-btn-lg-padding, 0 24px);height:32px;font-size:var(--devui-font-size-lg, 14px);min-width:72px}.devui-btn.devui-btn-text,.devui-btn.devui-btn-text-dark{color:var(--devui-brand-active, #0950de);padding:0}.devui-btn.devui-btn-text:hover,.devui-btn.devui-btn-text:active,.devui-btn.devui-btn-text-dark:hover,.devui-btn.devui-btn-text-dark:active{background-color:transparent;color:var(--devui-brand-active-focus, #00196b)}.devui-btn.devui-btn-common:hover{border-color:var(--devui-btn-common-border-color-hover, var(--devui-form-control-line-active, #0a59f7));color:var(--devui-btn-common-color-hover, var(--devui-brand-active, #0950de));background-color:var(--devui-btn-common-bg-hover, var(--devui-base-bg, #ffffff))}.devui-btn.devui-btn-common:active{border-color:var(--devui-btn-common-border-color-active, var(--devui-form-control-line-active, #0a59f7));color:var(--devui-btn-common-color-active, var(--devui-brand-active, #0950de));background-color:var(--devui-btn-common-bg-active, var(--devui-base-bg, #ffffff))}.devui-btn.devui-btn-stress:hover{background-color:var(--devui-primary-hover, #3979f9)}.devui-btn.devui-btn-stress:active{background-color:var(--devui-primary-active, #00196b)}.devui-btn.devui-btn-primary:hover{background-color:var(--devui-primary-hover, #3979f9)}.devui-btn.devui-btn-primary:active{background-color:var(--devui-primary-active, #00196b)}.devui-btn.devui-btn-danger:hover{background-color:var(--devui-contrast-hover, #cc272a)}.devui-btn.devui-btn-danger:active{background-color:var(--devui-contrast-active, #78080e)}.devui-btn.devui-btn-common:disabled{color:var(--devui-btn-common-text-disabled, var(--devui-disabled-text, #c2c2c2));background:var(--devui-btn-common-bg-disabled, var(--devui-disabled-bg, #f3f3f3));border-color:var(--devui-btn-common-border-disabled, var(--devui-disabled-line, #e6e6e6))}.devui-btn.devui-btn-primary:disabled{color:var(--devui-btn-primary-text-disabled, var(--devui-light-text, #ffffff));background:var(--devui-btn-primary-bg-disabled, var(--devui-primary-disabled, #9dbdfc));border-color:transparent}.devui-btn.devui-btn-danger:disabled{color:var(--devui-light-text, #ffffff);background:#f59297;border:1px solid #f59297}.devui-btn.devui-btn-text-dark:disabled{color:var(--devui-disabled-text, #c2c2c2)}.devui-btn.devui-btn-text:disabled{color:var(--devui-disabled-text, #c2c2c2)}.devui-btn.bordered.devui-btn-common{color:var(--devui-text, #191919);border-color:transparent}.devui-btn.bordered.devui-btn-common:hover,.devui-btn.bordered.devui-btn-common:focus{border-color:var(--devui-primary-hover, #3979f9)}.devui-btn.bordered.devui-btn-common:active{border-color:var(--devui-primary-active, #00196b)}.devui-btn.bordered.devui-btn-stress,.devui-btn.bordered.devui-btn-primary{border-color:var(--devui-brand, #0a59f7);color:var(--devui-brand, #0a59f7);background-color:var(--devui-block, #ffffff)}.devui-btn.bordered.devui-btn-success{border-color:var(--devui-success, #058358);color:var(--devui-success, #058358);background-color:var(--devui-block, #ffffff)}.devui-btn.bordered.devui-btn-warning{border-color:var(--devui-warning, #fcc800);color:var(--devui-warning, #fcc800);background-color:var(--devui-block, #ffffff)}.devui-btn.bordered.devui-btn-danger{border-color:var(--devui-danger, #e02128);color:var(--devui-danger, #e02128);background-color:var(--devui-block, #ffffff)}.devui-btn.d-btn-icon:not(.devui-btn-primary):not(.devui-btn-danger):not(.devui-btn-common):hover,.devui-btn.d-btn-icon:not(.devui-btn-primary):not(.devui-btn-danger):not(.devui-btn-common):focus{border:1px solid var(--devui-list-item-hover-bg, #f2f2f3);background-color:var(--devui-list-item-hover-bg, #f2f2f3)}.devui-btn.d-btn-icon:not(.devui-btn-primary):not(.devui-btn-danger):not(.devui-btn-common):disabled{background-color:var(--devui-disabled-bg, #f3f3f3)}.devui-btn:not(:disabled).devui-btn-text.d-btn-icon-wrap,.devui-btn:not(:disabled).devui-btn-text-dark.d-btn-icon-wrap{color:var(--devui-text, #191919)}.devui-btn:not(:disabled).devui-btn-text.d-btn-icon-wrap .devui-icon-fix,.devui-btn:not(:disabled).devui-btn-text-dark.d-btn-icon-wrap .devui-icon-fix{color:var(--devui-icon-fill, #595959)}.devui-btn:not(:disabled).devui-btn-text.d-btn-icon-wrap:hover,.devui-btn:not(:disabled).devui-btn-text-dark.d-btn-icon-wrap:hover{color:var(--devui-icon-fill-hover, #191919)}.devui-btn:not(:disabled).devui-btn-text.d-btn-icon-wrap:hover .devui-icon-fix,.devui-btn:not(:disabled).devui-btn-text-dark.d-btn-icon-wrap:hover .devui-icon-fix{color:var(--devui-icon-fill-hover, #191919)}.devui-btn.mouseDown:not(:disabled){transform:scale(.95)}.devui-loading .devui-loading-default-spinner div{background-color:var(--devui-text, #191919)}:host{display:inline-block}.devui-btn{transition:background-color var(--devui-animation-duration-slow, .3s) var(--devui-animation-ease-in-out-smooth, cubic-bezier(.645, .045, .355, 1)),border-color var(--devui-animation-duration-slow, .3s) var(--devui-animation-ease-in-out-smooth, cubic-bezier(.645, .045, .355, 1)),color var(--devui-animation-duration-slow, .3s) var(--devui-animation-ease-in-out-smooth, cubic-bezier(.645, .045, .355, 1));border-style:solid;white-space:nowrap;display:flex;align-items:center;justify-content:center}.devui-btn:disabled,.devui-btn[disabled]{cursor:not-allowed}.devui-btn.d-btn-icon{padding:8px;line-height:1em;min-width:unset;border:1px solid transparent}.devui-btn.d-btn-icon:not(.devui-btn-common){border:1px solid transparent}.devui-btn.d-btn-icon.devui-btn-xs,.devui-btn.d-btn-icon.devui-btn-sm{padding:4px}.devui-btn.d-btn-icon.devui-btn-xs,.devui-btn.d-btn-icon.devui-btn-sm{min-width:24px}.devui-btn.d-btn-icon.devui-btn-lg{min-width:32px}.devui-btn.d-btn-icon.devui-btn-lg .icon{font-size:var(--devui-font-size-icon, 16px)}.devui-btn:not(.d-btn-icon) .icon-fix{font-size:var(--devui-font-size-icon, 16px)}.devui-icon-fix{position:relative;font-size:var(--devui-font-size, 12px);pointer-events:none}.devui-icon-fix:before{transition:color var(--devui-animation-duration-slow, .3s) var(--devui-animation-ease-in-out-smooth, cubic-bezier(.645, .045, .355, 1))}.devui-btn.devui-btn-common:not(:disabled) .devui-icon-fix{color:var(--devui-text-weak, #333333)}.devui-btn.devui-btn-common:not(:disabled):hover .devui-icon-fix,.devui-btn.devui-btn-common:not(:disabled):active .devui-icon-fix,.devui-btn.devui-btn-common:not(:disabled):focus .devui-icon-fix{color:var(--devui-icon-fill-active, #191919)}.button-content{display:inline-block;position:relative;pointer-events:none}.clear-right-8{margin-right:8px}.devui-btn-more-text-omits{text-overflow:ellipsis;overflow:hidden;white-space:nowrap}.devui-btn-circle{border-radius:100%}.devui-button-water-wave{position:absolute;background-color:var(--devui-base-bg, #ffffff);border-radius:50%;opacity:0;width:20px;height:20px;transform:translate(-50%,-50%);animation:waterWave var(--devui-animation-duration-slow, .3s) var(--devui-animation-linear, cubic-bezier(0, 0, 1, 1))}@keyframes waterWave{0%{opacity:.2;width:30px;height:30px}to{opacity:0;width:200px;height:200px}}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i2.LoadingDirective, selector: "[dLoading]", inputs: ["backdrop", "message", "positionType", "showLoading", "view", "zIndex", "loading", "loadingStyle", "loadingTemplateRef"], exportAs: ["dLoading"] }, { kind: "directive", type: i3.AutoFocusDirective, selector: "[dAutoFocus]", inputs: ["dAutoFocus"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); } } i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ButtonComponent, decorators: [{ type: Component, args: [{ selector: 'd-button', changeDetection: ChangeDetectionStrategy.OnPush, preserveWhitespaces: false, template: "<button\n [attr.id]=\"id\"\n class=\"devui-btn devui-btn-{{ bsStyle }} devui-btn-{{ bsSize }} devui-btn-{{ bsPosition }}\"\n [class.devui-btn-circle]=\"shape === 'circle'\"\n [type]=\"type\"\n [disabled]=\"disabled\"\n [class.bordered]=\"bordered\"\n [class.mouseDown]=\"isMouseDown\"\n [backdrop]=\"true\"\n dLoading\n [showLoading]=\"showLoading\"\n [loadingTemplateRef]=\"loadingTemplateRef\"\n [ngStyle]=\"{ width: width }\"\n [dAutoFocus]=\"autofocus\"\n (click)=\"onClick($event)\"\n [ngClass]=\"{ 'd-btn-icon': !!icon && !hasContent(), 'd-btn-icon-wrap': !!icon }\"\n (mousedown)=\"isMouseDown = true\"\n (mouseup)=\"isMouseDown = false\"\n>\n <span *ngIf=\"!!icon\" class=\"devui-icon-fix icon {{ icon }}\" [ngClass]=\"{ 'clear-right-8': hasContent() }\"></span>\n <!--\n --><span class=\"button-content\" [class.devui-btn-more-text-omits]=\"width !== undefined\" #buttonContent><ng-content></ng-content></span>\n <div class=\"devui-button-water-wave\" *ngIf=\"showWave\" [ngStyle]=\"{ top: waveTop + 'px', left: waveLeft + 'px' }\"></div>\n</button>\n", styles: [".devui-font-size-base{font-size:var(--devui-font-size, 12px)}.devui-font-base{font-size:var(--devui-font-size, 12px);font-weight:var(--devui-font-content-weight, normal);line-height:var(--devui-line-height-base, 1.5)}.devui-font-size-modal-title{font-size:var(--devui-font-size-modal-title, 18px)}.devui-font-modal-title{font-size:var(--devui-font-size-modal-title, 18px);font-weight:var(--devui-font-title-weight, bold);line-height:var(--devui-line-height-base, 1.5)}.devui-font-size-page-title{font-size:var(--devui-font-size-page-title, 16px)}.devui-font-page-title{font-size:var(--devui-font-size-page-title, 16px);font-weight:var(--devui-font-title-weight, bold);line-height:var(--devui-line-height-base, 1.5)}.devui-font-size-secondary-title{font-size:var(--devui-font-size-card-title, 14px)}.devui-font-secondary-title{font-size:var(--devui-font-size-card-title, 14px);font-weight:var(--devui-font-title-weight, bold);line-height:var(--devui-line-height-base, 1.5)}.devui-btn{padding:var(--devui-btn-padding, 0 20px);font-size:var(--devui-font-size-md, 12px);height:28px;line-height:var(--devui-line-height-base, 1.5);border-radius:var(--devui-btn-border-radius, var(--devui-border-radius, 2px));border-width:1px;border-color:transparent;background-color:transparent;position:relative;overflow:hidden;transform:scale(1)}.devui-btn.devui-btn-common{color:var(--devui-text, #191919);min-width:64px;background-color:var(--devui-btn-common-bg, var(--devui-base-bg, #ffffff));border-color:var(--devui-btn-common-border-color, var(--devui-line, #dbdbdb))}.devui-btn.devui-btn-stress,.devui-btn.devui-btn-primary{color:var(--devui-light-text, #ffffff);min-width:64px;background-color:var(--devui-primary, #0a59f7)}.devui-btn.devui-btn-danger{color:var(--devui-light-text, #ffffff);min-width:64px;background-color:var(--devui-contrast, #c7000b)}.devui-btn.devui-btn-left{border-radius:var(--devui-border-radius, 2px) 0 0 var(--devui-border-radius, 2px)}.devui-btn.devui-btn-right{border-radius:0 var(--devui-border-radius, 2px) var(--devui-border-radius, 2px) 0}.devui-btn.devui-btn-xs{padding:0 4px;height:24px;font-size:var(--devui-font-size-sm, 12px);min-width:48px}.devui-btn.devui-btn-sm{padding:var(--devui-btn-sm-padding, 0 16px);height:24px;font-size:var(--devui-font-size-sm, 12px);min-width:56px}.devui-btn.devui-btn-lg{padding:var(--devui-btn-lg-padding, 0 24px);height:32px;font-size:var(--devui-font-size-lg, 14px);min-width:72px}.devui-btn.devui-btn-text,.devui-btn.devui-btn-text-dark{color:var(--devui-brand-active, #0950de);padding:0}.devui-btn.devui-btn-text:hover,.devui-btn.devui-btn-text:active,.devui-btn.devui-btn-text-dark:hover,.devui-btn.devui-btn-text-dark:active{background-color:transparent;color:var(--devui-brand-active-focus, #00196b)}.devui-btn.devui-btn-common:hover{border-color:var(--devui-btn-common-border-color-hover, var(--devui-form-control-line-active, #0a59f7));color:var(--devui-btn-common-color-hover, var(--devui-brand-active, #0950de));background-color:var(--devui-btn-common-bg-hover, var(--devui-base-bg, #ffffff))}.devui-btn.devui-btn-common:active{border-color:var(--devui-btn-common-border-color-active, var(--devui-form-control-line-active, #0a59f7));color:var(--devui-btn-common-color-active, var(--devui-brand-active, #0950de));background-color:var(--devui-btn-common-bg-active, var(--devui-base-bg, #ffffff))}.devui-btn.devui-btn-stress:hover{background-color:var(--devui-primary-hover, #3979f9)}.devui-btn.devui-btn-stress:active{background-color:var(--devui-primary-active, #00196b)}.devui-btn.devui-btn-primary:hover{background-color:var(--devui-primary-hover, #3979f9)}.devui-btn.devui-btn-primary:active{background-color:var(--devui-primary-active, #00196b)}.devui-btn.devui-btn-danger:hover{background-color:var(--devui-contrast-hover, #cc272a)}.devui-btn.devui-btn-danger:active{background-color:var(--devui-contrast-active, #78080e)}.devui-btn.devui-btn-common:disabled{color:var(--devui-btn-common-text-disabled, var(--devui-disabled-text, #c2c2c2));background:var(--devui-btn-common-bg-disabled, var(--devui-disabled-bg, #f3f3f3));border-color:var(--devui-btn-common-border-disabled, var(--devui-disabled-line, #e6e6e6))}.devui-btn.devui-btn-primary:disabled{color:var(--devui-btn-primary-text-disabled, var(--devui-light-text, #ffffff));background:var(--devui-btn-primary-bg-disabled, var(--devui-primary-disabled, #9dbdfc));border-color:transparent}.devui-btn.devui-btn-danger:disabled{color:var(--devui-light-text, #ffffff);background:#f59297;border:1px solid #f59297}.devui-btn.devui-btn-text-dark:disabled{color:var(--devui-disabled-text, #c2c2c2)}.devui-btn.devui-btn-text:disabled{color:var(--devui-disabled-text, #c2c2c2)}.devui-btn.bordered.devui-btn-common{color:var(--devui-text, #191919);border-color:transparent}.devui-btn.bordered.devui-btn-common:hover,.devui-btn.bordered.devui-btn-common:focus{border-color:var(--devui-primary-hover, #3979f9)}.devui-btn.bordered.devui-btn-common:active{border-color:var(--devui-primary-active, #00196b)}.devui-btn.bordered.devui-btn-stress,.devui-btn.bordered.devui-btn-primary{border-color:var(--devui-brand, #0a59f7);color:var(--devui-brand, #0a59f7);background-color:var(--devui-block, #ffffff)}.devui-btn.bordered.devui-btn-success{border-color:var(--devui-success, #058358);color:var(--devui-success, #058358);background-color:var(--devui-block, #ffffff)}.devui-btn.bordered.devui-btn-warning{border-color:var(--devui-warning, #fcc800);color:var(--devui-warning, #fcc800);background-color:var(--devui-block, #ffffff)}.devui-btn.bordered.devui-btn-danger{border-color:var(--devui-danger, #e02128);color:var(--devui-danger, #e02128);background-color:var(--devui-block, #ffffff)}.devui-btn.d-btn-icon:not(.devui-btn-primary):not(.devui-btn-danger):not(.devui-btn-common):hover,.devui-btn.d-btn-icon:not(.devui-btn-primary):not(.devui-btn-danger):not(.devui-btn-common):focus{border:1px solid var(--devui-list-item-hover-bg, #f2f2f3);background-color:var(--devui-list-item-hover-bg, #f2f2f3)}.devui-btn.d-btn-icon:not(.devui-btn-primary):not(.devui-btn-danger):not(.devui-btn-common):disabled{background-color:var(--devui-disabled-bg, #f3f3f3)}.devui-btn:not(:disabled).devui-btn-text.d-btn-icon-wrap,.devui-btn:not(:disabled).devui-btn-text-dark.d-btn-icon-wrap{color:var(--devui-text, #191919)}.devui-btn:not(:disabled).devui-btn-text.d-btn-icon-wrap .devui-icon-fix,.devui-btn:not(:disabled).devui-btn-text-dark.d-btn-icon-wrap .devui-icon-fix{color:var(--devui-icon-fill, #595959)}.devui-btn:not(:disabled).devui-btn-text.d-btn-icon-wrap:hover,.devu