@datarailsshared/datarailsshared 1.5.266 → 1.5.268
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.
- package/assets/styles/mixins.scss +96 -0
- package/datarailsshared-datarailsshared-1.5.268.tgz +0 -0
- package/esm2022/lib/dr-dialog/components/dialog-wrapper/dialog-wrapper.component.mjs +2 -2
- package/esm2022/lib/dr-dialog/interfaces/dialog-data.mjs +2 -1
- package/esm2022/lib/stepper/stepper.component.mjs +3 -3
- package/fesm2022/datarailsshared-datarailsshared.mjs +5 -4
- package/fesm2022/datarailsshared-datarailsshared.mjs.map +1 -1
- package/lib/dr-dialog/interfaces/dialog-data.d.ts +3 -2
- package/package.json +1 -1
- package/datarailsshared-datarailsshared-1.5.266.tgz +0 -0
|
@@ -16,3 +16,99 @@
|
|
|
16
16
|
$left: $dr-spacing-large) {
|
|
17
17
|
padding: $top $right $bottom $left;
|
|
18
18
|
}
|
|
19
|
+
|
|
20
|
+
|
|
21
|
+
@mixin dr-typography-caption() {
|
|
22
|
+
font-family: $dr-primary-font-family;
|
|
23
|
+
font-size: 12px;
|
|
24
|
+
line-height: 20px;
|
|
25
|
+
font-weight: 500;
|
|
26
|
+
}
|
|
27
|
+
|
|
28
|
+
@mixin dr-typography-caption-light() {
|
|
29
|
+
@include dr-typography-caption();
|
|
30
|
+
font-weight: 400;
|
|
31
|
+
}
|
|
32
|
+
|
|
33
|
+
@mixin dr-typography-caption-bold() {
|
|
34
|
+
@include dr-typography-caption();
|
|
35
|
+
font-weight: 600;
|
|
36
|
+
}
|
|
37
|
+
|
|
38
|
+
@mixin dr-typography-body() {
|
|
39
|
+
font-family: $dr-primary-font-family;
|
|
40
|
+
font-size: 14px;
|
|
41
|
+
line-height: 22px;
|
|
42
|
+
}
|
|
43
|
+
|
|
44
|
+
@mixin dr-typography-body-large() {
|
|
45
|
+
@include dr-typography-body();
|
|
46
|
+
font-size: 16px;
|
|
47
|
+
line-height: 24px;
|
|
48
|
+
}
|
|
49
|
+
|
|
50
|
+
@mixin dr-typography-body-x-large() {
|
|
51
|
+
@include dr-typography-body();
|
|
52
|
+
font-size: 18px;
|
|
53
|
+
line-height: 27px;
|
|
54
|
+
}
|
|
55
|
+
|
|
56
|
+
@mixin dr-typography-subtitle() {
|
|
57
|
+
font-family: $dr-primary-font-family;
|
|
58
|
+
font-size: 14px;
|
|
59
|
+
font-weight: 500;
|
|
60
|
+
line-height: 21px;
|
|
61
|
+
}
|
|
62
|
+
|
|
63
|
+
@mixin dr-typography-subtitle-light() {
|
|
64
|
+
@include dr-typography-subtitle();
|
|
65
|
+
font-weight: 400;
|
|
66
|
+
}
|
|
67
|
+
|
|
68
|
+
@mixin dr-typography-subtitle-bold() {
|
|
69
|
+
@include dr-typography-subtitle();
|
|
70
|
+
font-weight: 600;
|
|
71
|
+
}
|
|
72
|
+
|
|
73
|
+
@mixin dr-typography-head() {
|
|
74
|
+
font-family: $dr-primary-font-family;
|
|
75
|
+
font-size: 16px;
|
|
76
|
+
font-weight: 500;
|
|
77
|
+
line-height: 24px;
|
|
78
|
+
}
|
|
79
|
+
|
|
80
|
+
@mixin dr-typography-head-bold() {
|
|
81
|
+
@include dr-typography-head();
|
|
82
|
+
font-weight: 600;
|
|
83
|
+
}
|
|
84
|
+
|
|
85
|
+
@mixin dr-typography-head-large() {
|
|
86
|
+
font-family: $dr-primary-font-family;
|
|
87
|
+
font-size: 18px;
|
|
88
|
+
font-weight: 500;
|
|
89
|
+
line-height: 24px;
|
|
90
|
+
}
|
|
91
|
+
|
|
92
|
+
@mixin dr-typography-head-large-bold() {
|
|
93
|
+
@include dr-typography-head-large();
|
|
94
|
+
font-weight: 600;
|
|
95
|
+
}
|
|
96
|
+
|
|
97
|
+
@mixin dr-typography-head-x-large() {
|
|
98
|
+
font-family: $dr-primary-font-family;
|
|
99
|
+
font-size: 20px;
|
|
100
|
+
font-weight: 600;
|
|
101
|
+
line-height: 28px;
|
|
102
|
+
}
|
|
103
|
+
|
|
104
|
+
@mixin dr-typography-head-xx-large() {
|
|
105
|
+
@include dr-typography-head-x-large();
|
|
106
|
+
font-size: 24px;
|
|
107
|
+
line-height: 32px;
|
|
108
|
+
}
|
|
109
|
+
|
|
110
|
+
@mixin dr-typography-head-xxx-large() {
|
|
111
|
+
@include dr-typography-head-x-large();
|
|
112
|
+
font-size: 32px;
|
|
113
|
+
line-height: normal;
|
|
114
|
+
}
|
|
Binary file
|
|
@@ -79,11 +79,11 @@ export class DialogWrapperComponent {
|
|
|
79
79
|
this.destroy$.complete();
|
|
80
80
|
}
|
|
81
81
|
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DialogWrapperComponent, deps: [{ token: i1.MatLegacyDialogRef }, { token: i2.DialogService }, { token: i0.ChangeDetectorRef }, { token: i0.ComponentFactoryResolver }, { token: MAT_DIALOG_DATA }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
82
|
-
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: DialogWrapperComponent, selector: "dr-dialog-wrapper", host: { properties: { "class": "this.elementClass" } }, viewQueries: [{ propertyName: "content", first: true, predicate: ["content"], descendants: true, read: ViewContainerRef }], ngImport: i0, template: "<div class=\"dialog-wrapper\"\n [class.dialog-wrapper--confirmation-no-title]=\"dialogData.theme?.isConfirmation && !dialogData.title\">\n <i class=\"dr-icon-exit\" data-test=\"close_btn\" (click)=\"closeDialog()\" *ngIf=\"!dialogData?.hideCloseBtn\"></i>\n\n <div header class=\"dialog-wrapper__header\" *ngIf=\"dialogData.title\">\n <h1 class=\"dialog-wrapper__header__title\"\n data-test=\"dialogTitle\">{{ dialogData.title }}</h1>\n <h1 class=\"dialog-wrapper__header__subtitle\" data-test=\"dialogSubtitle\"\n *ngIf=\"dialogData.subtitle\">{{ dialogData.subtitle }}</h1>\n </div>\n <div class=\"dialog-wrapper__content\"\n [class.dialog-wrapper__content--no-padding]=\"dialogData.theme?.contentNoPadding\"\n [ngClass]=\"{ 'flex-position': dialogData.contentIcon?.class && !childComponent }\">\n <span *ngIf=\"dialogData.contentIcon?.class\" class=\"dialog-wrapper__content__icon\">\n <i [ngClass]=\"dialogData.contentIcon.class\" [style.color]=\"dialogData.contentIcon?.color || 'inherit'\"></i>\n </span>\n <span class=\"dialog-content__wrapper\" [innerHTML]=\"dialogData.content\"></span>\n <span #content class=\"dialog-wrapper__content__anchor\"> </span>\n </div>\n <dr-details-list *ngIf=\"dialogData.details\"\n [title]=\"dialogData.details.title\"\n [items]=\"dialogData.details.items\">\n </dr-details-list>\n <div footer class=\"dialog-wrapper__footer\" *ngIf=\"dialogData.cancelButton || dialogData.acceptButton\">\n <div class=\"dialog-wrapper__footer__buttons\">\n <span *ngIf=\"dialogData.customButton\"\n class=\"dialog-wrapper__footer__button-wrapper dialog-wrapper__footer__button-wrapper--custom\"\n [drTooltip]=\"dialogData.customButton.isDisabled && dialogData.tooltips?.customDisabled\">\n <dr-button (click)=\"onDecline()\"\n [theme]=\"dialogData.customButton?.theme || 'secondary'\"\n [isLoading]=\"isLoading\"\n data-test=\"declineBtn\"\n [disabled]=\"dialogData.customButton.isDisabled\"\n [drTooltip]=\"dialogData.tooltips?.custom\">{{ dialogData.customButton.label }}</dr-button>\n </span>\n <span *ngIf=\"dialogData.cancelButton\"\n class=\"dialog-wrapper__footer__button-wrapper\"\n [drTooltip]=\"dialogData.cancelButton.isDisabled && dialogData.tooltips?.cancelDisabled\">\n <dr-button (click)=\"closeDialog()\"\n [theme]=\"dialogData.cancelButton?.theme || 'secondary'\"\n data-test=\"closeBtn\"\n [disabled]=\"dialogData.cancelButton.isDisabled\"\n [drTooltip]=\"dialogData.tooltips?.cancel\">{{ dialogData.cancelButton.label }}</dr-button>\n </span>\n <span *ngIf=\"dialogData.acceptButton\"\n class=\"dialog-wrapper__footer__button-wrapper\"\n [drTooltip]=\"dialogData.acceptButton.isDisabled && dialogData.tooltips?.acceptDisabled\">\n <dr-button (click)=\"onAcceptDialog()\"\n [theme]=\"dialogData.acceptButton?.theme || 'primary'\"\n [isLoading]=\"isLoading\"\n data-test=\"acceptBtn\"\n [disabled]=\"dialogData.acceptButton.isDisabled\"\n [drTooltip]=\"dialogData.tooltips?.accept\">{{ dialogData.acceptButton.label }}</dr-button>\n </span>\n </div>\n </div>\n</div>\n", styles: [":host.small-modal,:host.small-modal-max-height{min-height:188px;max-height:467px;min-width:400px;max-width:400px}:host.medium-modal,:host.medium-modal-max-height{min-height:188px;max-height:467px;min-width:632px;max-width:632px}:host.medium-small-modal{min-height:188px;max-height:345px;min-width:460px;max-width:460px}:host.medium-modal-max-height,:host.small-modal-max-height{max-height:85vh}:host.large-modal{min-width:750px;max-width:750px}:host.medium-large-modal{min-width:669px;max-width:669px}:host.xl-modal{min-height:188px;max-height:800px;min-width:1100px;max-width:1100px}:host.xl-custom-modal{min-height:188px;max-height:800px;min-width:1100px;max-width:100%}::ng-deep .dialog-wrapper{display:flex;justify-content:space-between;flex-direction:column;position:relative}::ng-deep .dialog-wrapper>.dr-icon-exit{z-index:1;position:absolute;right:32px;top:16px;color:#6d6e6f;cursor:pointer}::ng-deep .dialog-wrapper__header{display:flex;flex-direction:column;padding:16px 56px 16px 32px;border-bottom:1px solid #DFE0E3}::ng-deep .dialog-wrapper__header__title{color:#333;position:static;font-weight:600;font-size:16px;line-height:24px;margin-top:0;margin-bottom:0}::ng-deep .dialog-wrapper__header__subtitle{color:#333;font-weight:400;font-size:14px;line-height:22px;margin:4px 0 0}::ng-deep .dialog-wrapper--confirmation-no-title{padding-top:16px;height:100%}::ng-deep .dialog-wrapper__content{overflow-y:inherit;font-size:14px;font-weight:400;line-height:22px;padding:24px 32px 32px}::ng-deep .dialog-wrapper__content__anchor{display:none}::ng-deep .dialog-wrapper__content--no-padding{padding:0}::ng-deep .dialog-wrapper__content__icon{margin-right:10px;top:5px;position:relative}::ng-deep .dialog-wrapper__content.flex-position{display:flex}::ng-deep .dialog-wrapper__content .dialog-content__wrapper{white-space:pre-line}::ng-deep .dialog-wrapper dr-details-list{margin-top:-24px;padding:0 32px 32px}::ng-deep .dialog-wrapper__footer{border-top:1px solid #DFE0E3}::ng-deep .dialog-wrapper__footer__buttons{display:flex;justify-content:flex-end;padding:11px 32px}::ng-deep .dialog-wrapper__footer__buttons>dr-button:nth-child(n+2){margin-left:12px}::ng-deep .dialog-wrapper__footer__button-wrapper:nth-child(n+2){margin-left:12px}::ng-deep .dialog-wrapper__footer__button-wrapper--custom:nth-last-child(3){margin-right:auto}\n"], dependencies: [{ kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i4.DrButtonComponent, selector: "dr-button", inputs: ["theme", "icon", "iconColor", "iconSize", "iconAfter", "iconAfterColor", "iconAfterSize", "disabled", "isLoading", "isActive"] }, { kind: "directive", type: i5.DrTooltipDirective, selector: "[drTooltip]", inputs: ["drTooltip", "drTooltipContext", "drTooltipPosition", "drTooltipClass", "drTooltipTheme", "drTooltipMousleaveTimeout", "drTooltipOptions", "drTooltipShow"] }, { kind: "component", type: i6.DrDetailsListComponent, selector: "dr-details-list", inputs: ["title", "items", "collapse"] }] }); }
|
|
82
|
+
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: DialogWrapperComponent, selector: "dr-dialog-wrapper", host: { properties: { "class": "this.elementClass" } }, viewQueries: [{ propertyName: "content", first: true, predicate: ["content"], descendants: true, read: ViewContainerRef }], ngImport: i0, template: "<div class=\"dialog-wrapper\"\n [class.dialog-wrapper--confirmation-no-title]=\"dialogData.theme?.isConfirmation && !dialogData.title\">\n <i class=\"dr-icon-exit\" data-test=\"close_btn\" (click)=\"closeDialog()\" *ngIf=\"!dialogData?.hideCloseBtn\"></i>\n\n <div header class=\"dialog-wrapper__header\" *ngIf=\"dialogData.title\">\n <h1 class=\"dialog-wrapper__header__title\"\n data-test=\"dialogTitle\">{{ dialogData.title }}</h1>\n <h1 class=\"dialog-wrapper__header__subtitle\" data-test=\"dialogSubtitle\"\n *ngIf=\"dialogData.subtitle\">{{ dialogData.subtitle }}</h1>\n </div>\n <div class=\"dialog-wrapper__content\"\n [class.dialog-wrapper__content--no-padding]=\"dialogData.theme?.contentNoPadding\"\n [ngClass]=\"{ 'flex-position': dialogData.contentIcon?.class && !childComponent }\">\n <span *ngIf=\"dialogData.contentIcon?.class\" class=\"dialog-wrapper__content__icon\">\n <i [ngClass]=\"dialogData.contentIcon.class\" [style.color]=\"dialogData.contentIcon?.color || 'inherit'\"></i>\n </span>\n <span class=\"dialog-content__wrapper\" [innerHTML]=\"dialogData.content\"></span>\n <span #content class=\"dialog-wrapper__content__anchor\"> </span>\n </div>\n <dr-details-list *ngIf=\"dialogData.details\"\n [title]=\"dialogData.details.title\"\n [items]=\"dialogData.details.items\">\n </dr-details-list>\n <div footer class=\"dialog-wrapper__footer\" *ngIf=\"dialogData.cancelButton || dialogData.acceptButton\">\n <div class=\"dialog-wrapper__footer__buttons\">\n <span *ngIf=\"dialogData.customButton\"\n class=\"dialog-wrapper__footer__button-wrapper dialog-wrapper__footer__button-wrapper--custom\"\n [drTooltip]=\"dialogData.customButton.isDisabled && dialogData.tooltips?.customDisabled\">\n <dr-button (click)=\"onDecline()\"\n [theme]=\"dialogData.customButton?.theme || 'secondary'\"\n [isLoading]=\"isLoading\"\n data-test=\"declineBtn\"\n [disabled]=\"dialogData.customButton.isDisabled\"\n [drTooltip]=\"dialogData.tooltips?.custom\">{{ dialogData.customButton.label }}</dr-button>\n </span>\n <span *ngIf=\"dialogData.cancelButton\"\n class=\"dialog-wrapper__footer__button-wrapper\"\n [drTooltip]=\"dialogData.cancelButton.isDisabled && dialogData.tooltips?.cancelDisabled\">\n <dr-button (click)=\"closeDialog()\"\n [theme]=\"dialogData.cancelButton?.theme || 'secondary'\"\n data-test=\"closeBtn\"\n [disabled]=\"dialogData.cancelButton.isDisabled\"\n [drTooltip]=\"dialogData.tooltips?.cancel\">{{ dialogData.cancelButton.label }}</dr-button>\n </span>\n <span *ngIf=\"dialogData.acceptButton\"\n class=\"dialog-wrapper__footer__button-wrapper\"\n [drTooltip]=\"dialogData.acceptButton.isDisabled && dialogData.tooltips?.acceptDisabled\">\n <dr-button (click)=\"onAcceptDialog()\"\n [theme]=\"dialogData.acceptButton?.theme || 'primary'\"\n [isLoading]=\"isLoading\"\n data-test=\"acceptBtn\"\n [disabled]=\"dialogData.acceptButton.isDisabled\"\n [drTooltip]=\"dialogData.tooltips?.accept\">{{ dialogData.acceptButton.label }}</dr-button>\n </span>\n </div>\n </div>\n</div>\n", styles: [":host.small-modal,:host.small-modal-max-height{min-height:188px;max-height:467px;min-width:400px;max-width:400px}:host.medium-modal,:host.medium-modal-max-height{min-height:188px;max-height:467px;min-width:632px;max-width:632px}:host.medium-small-modal{min-height:188px;max-height:345px;min-width:460px;max-width:460px}:host.medium-modal-max-height,:host.small-modal-max-height{max-height:85vh}:host.large-modal{min-width:750px;max-width:750px}:host.xl-medium-modal{min-width:850px;max-width:850px}:host.medium-large-modal{min-width:669px;max-width:669px}:host.xl-modal{min-height:188px;max-height:800px;min-width:1100px;max-width:1100px}:host.xl-custom-modal{min-height:188px;max-height:800px;min-width:1100px;max-width:100%}::ng-deep .dialog-wrapper{display:flex;justify-content:space-between;flex-direction:column;position:relative}::ng-deep .dialog-wrapper>.dr-icon-exit{z-index:1;position:absolute;right:32px;top:16px;color:#6d6e6f;cursor:pointer}::ng-deep .dialog-wrapper__header{display:flex;flex-direction:column;padding:16px 56px 16px 32px;border-bottom:1px solid #DFE0E3}::ng-deep .dialog-wrapper__header__title{color:#333;position:static;font-weight:600;font-size:16px;line-height:24px;margin-top:0;margin-bottom:0}::ng-deep .dialog-wrapper__header__subtitle{color:#333;font-weight:400;font-size:14px;line-height:22px;margin:4px 0 0}::ng-deep .dialog-wrapper--confirmation-no-title{padding-top:16px;height:100%}::ng-deep .dialog-wrapper__content{overflow-y:inherit;font-size:14px;font-weight:400;line-height:22px;padding:24px 32px 32px}::ng-deep .dialog-wrapper__content__anchor{display:none}::ng-deep .dialog-wrapper__content--no-padding{padding:0}::ng-deep .dialog-wrapper__content__icon{margin-right:10px;top:5px;position:relative}::ng-deep .dialog-wrapper__content.flex-position{display:flex}::ng-deep .dialog-wrapper__content .dialog-content__wrapper{white-space:pre-line}::ng-deep .dialog-wrapper dr-details-list{margin-top:-24px;padding:0 32px 32px}::ng-deep .dialog-wrapper__footer{border-top:1px solid #DFE0E3}::ng-deep .dialog-wrapper__footer__buttons{display:flex;justify-content:flex-end;padding:11px 32px}::ng-deep .dialog-wrapper__footer__buttons>dr-button:nth-child(n+2){margin-left:12px}::ng-deep .dialog-wrapper__footer__button-wrapper:nth-child(n+2){margin-left:12px}::ng-deep .dialog-wrapper__footer__button-wrapper--custom:nth-last-child(3){margin-right:auto}\n"], dependencies: [{ kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i4.DrButtonComponent, selector: "dr-button", inputs: ["theme", "icon", "iconColor", "iconSize", "iconAfter", "iconAfterColor", "iconAfterSize", "disabled", "isLoading", "isActive"] }, { kind: "directive", type: i5.DrTooltipDirective, selector: "[drTooltip]", inputs: ["drTooltip", "drTooltipContext", "drTooltipPosition", "drTooltipClass", "drTooltipTheme", "drTooltipMousleaveTimeout", "drTooltipOptions", "drTooltipShow"] }, { kind: "component", type: i6.DrDetailsListComponent, selector: "dr-details-list", inputs: ["title", "items", "collapse"] }] }); }
|
|
83
83
|
}
|
|
84
84
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DialogWrapperComponent, decorators: [{
|
|
85
85
|
type: Component,
|
|
86
|
-
args: [{ selector: 'dr-dialog-wrapper', template: "<div class=\"dialog-wrapper\"\n [class.dialog-wrapper--confirmation-no-title]=\"dialogData.theme?.isConfirmation && !dialogData.title\">\n <i class=\"dr-icon-exit\" data-test=\"close_btn\" (click)=\"closeDialog()\" *ngIf=\"!dialogData?.hideCloseBtn\"></i>\n\n <div header class=\"dialog-wrapper__header\" *ngIf=\"dialogData.title\">\n <h1 class=\"dialog-wrapper__header__title\"\n data-test=\"dialogTitle\">{{ dialogData.title }}</h1>\n <h1 class=\"dialog-wrapper__header__subtitle\" data-test=\"dialogSubtitle\"\n *ngIf=\"dialogData.subtitle\">{{ dialogData.subtitle }}</h1>\n </div>\n <div class=\"dialog-wrapper__content\"\n [class.dialog-wrapper__content--no-padding]=\"dialogData.theme?.contentNoPadding\"\n [ngClass]=\"{ 'flex-position': dialogData.contentIcon?.class && !childComponent }\">\n <span *ngIf=\"dialogData.contentIcon?.class\" class=\"dialog-wrapper__content__icon\">\n <i [ngClass]=\"dialogData.contentIcon.class\" [style.color]=\"dialogData.contentIcon?.color || 'inherit'\"></i>\n </span>\n <span class=\"dialog-content__wrapper\" [innerHTML]=\"dialogData.content\"></span>\n <span #content class=\"dialog-wrapper__content__anchor\"> </span>\n </div>\n <dr-details-list *ngIf=\"dialogData.details\"\n [title]=\"dialogData.details.title\"\n [items]=\"dialogData.details.items\">\n </dr-details-list>\n <div footer class=\"dialog-wrapper__footer\" *ngIf=\"dialogData.cancelButton || dialogData.acceptButton\">\n <div class=\"dialog-wrapper__footer__buttons\">\n <span *ngIf=\"dialogData.customButton\"\n class=\"dialog-wrapper__footer__button-wrapper dialog-wrapper__footer__button-wrapper--custom\"\n [drTooltip]=\"dialogData.customButton.isDisabled && dialogData.tooltips?.customDisabled\">\n <dr-button (click)=\"onDecline()\"\n [theme]=\"dialogData.customButton?.theme || 'secondary'\"\n [isLoading]=\"isLoading\"\n data-test=\"declineBtn\"\n [disabled]=\"dialogData.customButton.isDisabled\"\n [drTooltip]=\"dialogData.tooltips?.custom\">{{ dialogData.customButton.label }}</dr-button>\n </span>\n <span *ngIf=\"dialogData.cancelButton\"\n class=\"dialog-wrapper__footer__button-wrapper\"\n [drTooltip]=\"dialogData.cancelButton.isDisabled && dialogData.tooltips?.cancelDisabled\">\n <dr-button (click)=\"closeDialog()\"\n [theme]=\"dialogData.cancelButton?.theme || 'secondary'\"\n data-test=\"closeBtn\"\n [disabled]=\"dialogData.cancelButton.isDisabled\"\n [drTooltip]=\"dialogData.tooltips?.cancel\">{{ dialogData.cancelButton.label }}</dr-button>\n </span>\n <span *ngIf=\"dialogData.acceptButton\"\n class=\"dialog-wrapper__footer__button-wrapper\"\n [drTooltip]=\"dialogData.acceptButton.isDisabled && dialogData.tooltips?.acceptDisabled\">\n <dr-button (click)=\"onAcceptDialog()\"\n [theme]=\"dialogData.acceptButton?.theme || 'primary'\"\n [isLoading]=\"isLoading\"\n data-test=\"acceptBtn\"\n [disabled]=\"dialogData.acceptButton.isDisabled\"\n [drTooltip]=\"dialogData.tooltips?.accept\">{{ dialogData.acceptButton.label }}</dr-button>\n </span>\n </div>\n </div>\n</div>\n", styles: [":host.small-modal,:host.small-modal-max-height{min-height:188px;max-height:467px;min-width:400px;max-width:400px}:host.medium-modal,:host.medium-modal-max-height{min-height:188px;max-height:467px;min-width:632px;max-width:632px}:host.medium-small-modal{min-height:188px;max-height:345px;min-width:460px;max-width:460px}:host.medium-modal-max-height,:host.small-modal-max-height{max-height:85vh}:host.large-modal{min-width:750px;max-width:750px}:host.medium-large-modal{min-width:669px;max-width:669px}:host.xl-modal{min-height:188px;max-height:800px;min-width:1100px;max-width:1100px}:host.xl-custom-modal{min-height:188px;max-height:800px;min-width:1100px;max-width:100%}::ng-deep .dialog-wrapper{display:flex;justify-content:space-between;flex-direction:column;position:relative}::ng-deep .dialog-wrapper>.dr-icon-exit{z-index:1;position:absolute;right:32px;top:16px;color:#6d6e6f;cursor:pointer}::ng-deep .dialog-wrapper__header{display:flex;flex-direction:column;padding:16px 56px 16px 32px;border-bottom:1px solid #DFE0E3}::ng-deep .dialog-wrapper__header__title{color:#333;position:static;font-weight:600;font-size:16px;line-height:24px;margin-top:0;margin-bottom:0}::ng-deep .dialog-wrapper__header__subtitle{color:#333;font-weight:400;font-size:14px;line-height:22px;margin:4px 0 0}::ng-deep .dialog-wrapper--confirmation-no-title{padding-top:16px;height:100%}::ng-deep .dialog-wrapper__content{overflow-y:inherit;font-size:14px;font-weight:400;line-height:22px;padding:24px 32px 32px}::ng-deep .dialog-wrapper__content__anchor{display:none}::ng-deep .dialog-wrapper__content--no-padding{padding:0}::ng-deep .dialog-wrapper__content__icon{margin-right:10px;top:5px;position:relative}::ng-deep .dialog-wrapper__content.flex-position{display:flex}::ng-deep .dialog-wrapper__content .dialog-content__wrapper{white-space:pre-line}::ng-deep .dialog-wrapper dr-details-list{margin-top:-24px;padding:0 32px 32px}::ng-deep .dialog-wrapper__footer{border-top:1px solid #DFE0E3}::ng-deep .dialog-wrapper__footer__buttons{display:flex;justify-content:flex-end;padding:11px 32px}::ng-deep .dialog-wrapper__footer__buttons>dr-button:nth-child(n+2){margin-left:12px}::ng-deep .dialog-wrapper__footer__button-wrapper:nth-child(n+2){margin-left:12px}::ng-deep .dialog-wrapper__footer__button-wrapper--custom:nth-last-child(3){margin-right:auto}\n"] }]
|
|
86
|
+
args: [{ selector: 'dr-dialog-wrapper', template: "<div class=\"dialog-wrapper\"\n [class.dialog-wrapper--confirmation-no-title]=\"dialogData.theme?.isConfirmation && !dialogData.title\">\n <i class=\"dr-icon-exit\" data-test=\"close_btn\" (click)=\"closeDialog()\" *ngIf=\"!dialogData?.hideCloseBtn\"></i>\n\n <div header class=\"dialog-wrapper__header\" *ngIf=\"dialogData.title\">\n <h1 class=\"dialog-wrapper__header__title\"\n data-test=\"dialogTitle\">{{ dialogData.title }}</h1>\n <h1 class=\"dialog-wrapper__header__subtitle\" data-test=\"dialogSubtitle\"\n *ngIf=\"dialogData.subtitle\">{{ dialogData.subtitle }}</h1>\n </div>\n <div class=\"dialog-wrapper__content\"\n [class.dialog-wrapper__content--no-padding]=\"dialogData.theme?.contentNoPadding\"\n [ngClass]=\"{ 'flex-position': dialogData.contentIcon?.class && !childComponent }\">\n <span *ngIf=\"dialogData.contentIcon?.class\" class=\"dialog-wrapper__content__icon\">\n <i [ngClass]=\"dialogData.contentIcon.class\" [style.color]=\"dialogData.contentIcon?.color || 'inherit'\"></i>\n </span>\n <span class=\"dialog-content__wrapper\" [innerHTML]=\"dialogData.content\"></span>\n <span #content class=\"dialog-wrapper__content__anchor\"> </span>\n </div>\n <dr-details-list *ngIf=\"dialogData.details\"\n [title]=\"dialogData.details.title\"\n [items]=\"dialogData.details.items\">\n </dr-details-list>\n <div footer class=\"dialog-wrapper__footer\" *ngIf=\"dialogData.cancelButton || dialogData.acceptButton\">\n <div class=\"dialog-wrapper__footer__buttons\">\n <span *ngIf=\"dialogData.customButton\"\n class=\"dialog-wrapper__footer__button-wrapper dialog-wrapper__footer__button-wrapper--custom\"\n [drTooltip]=\"dialogData.customButton.isDisabled && dialogData.tooltips?.customDisabled\">\n <dr-button (click)=\"onDecline()\"\n [theme]=\"dialogData.customButton?.theme || 'secondary'\"\n [isLoading]=\"isLoading\"\n data-test=\"declineBtn\"\n [disabled]=\"dialogData.customButton.isDisabled\"\n [drTooltip]=\"dialogData.tooltips?.custom\">{{ dialogData.customButton.label }}</dr-button>\n </span>\n <span *ngIf=\"dialogData.cancelButton\"\n class=\"dialog-wrapper__footer__button-wrapper\"\n [drTooltip]=\"dialogData.cancelButton.isDisabled && dialogData.tooltips?.cancelDisabled\">\n <dr-button (click)=\"closeDialog()\"\n [theme]=\"dialogData.cancelButton?.theme || 'secondary'\"\n data-test=\"closeBtn\"\n [disabled]=\"dialogData.cancelButton.isDisabled\"\n [drTooltip]=\"dialogData.tooltips?.cancel\">{{ dialogData.cancelButton.label }}</dr-button>\n </span>\n <span *ngIf=\"dialogData.acceptButton\"\n class=\"dialog-wrapper__footer__button-wrapper\"\n [drTooltip]=\"dialogData.acceptButton.isDisabled && dialogData.tooltips?.acceptDisabled\">\n <dr-button (click)=\"onAcceptDialog()\"\n [theme]=\"dialogData.acceptButton?.theme || 'primary'\"\n [isLoading]=\"isLoading\"\n data-test=\"acceptBtn\"\n [disabled]=\"dialogData.acceptButton.isDisabled\"\n [drTooltip]=\"dialogData.tooltips?.accept\">{{ dialogData.acceptButton.label }}</dr-button>\n </span>\n </div>\n </div>\n</div>\n", styles: [":host.small-modal,:host.small-modal-max-height{min-height:188px;max-height:467px;min-width:400px;max-width:400px}:host.medium-modal,:host.medium-modal-max-height{min-height:188px;max-height:467px;min-width:632px;max-width:632px}:host.medium-small-modal{min-height:188px;max-height:345px;min-width:460px;max-width:460px}:host.medium-modal-max-height,:host.small-modal-max-height{max-height:85vh}:host.large-modal{min-width:750px;max-width:750px}:host.xl-medium-modal{min-width:850px;max-width:850px}:host.medium-large-modal{min-width:669px;max-width:669px}:host.xl-modal{min-height:188px;max-height:800px;min-width:1100px;max-width:1100px}:host.xl-custom-modal{min-height:188px;max-height:800px;min-width:1100px;max-width:100%}::ng-deep .dialog-wrapper{display:flex;justify-content:space-between;flex-direction:column;position:relative}::ng-deep .dialog-wrapper>.dr-icon-exit{z-index:1;position:absolute;right:32px;top:16px;color:#6d6e6f;cursor:pointer}::ng-deep .dialog-wrapper__header{display:flex;flex-direction:column;padding:16px 56px 16px 32px;border-bottom:1px solid #DFE0E3}::ng-deep .dialog-wrapper__header__title{color:#333;position:static;font-weight:600;font-size:16px;line-height:24px;margin-top:0;margin-bottom:0}::ng-deep .dialog-wrapper__header__subtitle{color:#333;font-weight:400;font-size:14px;line-height:22px;margin:4px 0 0}::ng-deep .dialog-wrapper--confirmation-no-title{padding-top:16px;height:100%}::ng-deep .dialog-wrapper__content{overflow-y:inherit;font-size:14px;font-weight:400;line-height:22px;padding:24px 32px 32px}::ng-deep .dialog-wrapper__content__anchor{display:none}::ng-deep .dialog-wrapper__content--no-padding{padding:0}::ng-deep .dialog-wrapper__content__icon{margin-right:10px;top:5px;position:relative}::ng-deep .dialog-wrapper__content.flex-position{display:flex}::ng-deep .dialog-wrapper__content .dialog-content__wrapper{white-space:pre-line}::ng-deep .dialog-wrapper dr-details-list{margin-top:-24px;padding:0 32px 32px}::ng-deep .dialog-wrapper__footer{border-top:1px solid #DFE0E3}::ng-deep .dialog-wrapper__footer__buttons{display:flex;justify-content:flex-end;padding:11px 32px}::ng-deep .dialog-wrapper__footer__buttons>dr-button:nth-child(n+2){margin-left:12px}::ng-deep .dialog-wrapper__footer__button-wrapper:nth-child(n+2){margin-left:12px}::ng-deep .dialog-wrapper__footer__button-wrapper--custom:nth-last-child(3){margin-right:auto}\n"] }]
|
|
87
87
|
}], ctorParameters: function () { return [{ type: i1.MatLegacyDialogRef }, { type: i2.DialogService }, { type: i0.ChangeDetectorRef }, { type: i0.ComponentFactoryResolver }, { type: undefined, decorators: [{
|
|
88
88
|
type: Inject,
|
|
89
89
|
args: [MAT_DIALOG_DATA]
|
|
@@ -9,6 +9,7 @@ export var DIALOG_SIZE;
|
|
|
9
9
|
DIALOG_SIZE["LARGE"] = "large-modal";
|
|
10
10
|
DIALOG_SIZE["X_LARGE"] = "xl-modal";
|
|
11
11
|
DIALOG_SIZE["X_CUSTOM_LARGE"] = "xl-custom-modal";
|
|
12
|
+
DIALOG_SIZE["X_MEDIUM"] = "xl-medium-modal";
|
|
12
13
|
})(DIALOG_SIZE || (DIALOG_SIZE = {}));
|
|
13
14
|
export var DIALOG_BUTTON_LABEL;
|
|
14
15
|
(function (DIALOG_BUTTON_LABEL) {
|
|
@@ -23,4 +24,4 @@ export var DIALOG_FIELD_TYPE;
|
|
|
23
24
|
DIALOG_FIELD_TYPE["DATE_PICKER"] = "date_picker";
|
|
24
25
|
DIALOG_FIELD_TYPE["CHECKBOX"] = "checkbox";
|
|
25
26
|
})(DIALOG_FIELD_TYPE || (DIALOG_FIELD_TYPE = {}));
|
|
26
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
27
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZGlhbG9nLWRhdGEuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9kYXRhcmFpbHNzaGFyZWQvc3JjL2xpYi9kci1kaWFsb2cvaW50ZXJmYWNlcy9kaWFsb2ctZGF0YS50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUF1SUEsTUFBTSxDQUFOLElBQVksV0FXWDtBQVhELFdBQVksV0FBVztJQUNuQixvQ0FBcUIsQ0FBQTtJQUNyQiwwREFBMkMsQ0FBQTtJQUMzQyxzQ0FBdUIsQ0FBQTtJQUN2QixrREFBbUMsQ0FBQTtJQUNuQyw0REFBNkMsQ0FBQTtJQUM3QyxrREFBbUMsQ0FBQTtJQUNuQyxvQ0FBcUIsQ0FBQTtJQUNyQixtQ0FBb0IsQ0FBQTtJQUNwQixpREFBa0MsQ0FBQTtJQUNsQywyQ0FBNEIsQ0FBQTtBQUNoQyxDQUFDLEVBWFcsV0FBVyxLQUFYLFdBQVcsUUFXdEI7QUFFRCxNQUFNLENBQU4sSUFBWSxtQkFJWDtBQUpELFdBQVksbUJBQW1CO0lBQzNCLG9DQUFhLENBQUE7SUFDYix3Q0FBaUIsQ0FBQTtJQUNqQixzQ0FBZSxDQUFBO0FBQ25CLENBQUMsRUFKVyxtQkFBbUIsS0FBbkIsbUJBQW1CLFFBSTlCO0FBRUQsTUFBTSxDQUFOLElBQVksaUJBS1g7QUFMRCxXQUFZLGlCQUFpQjtJQUN6QixvQ0FBZSxDQUFBO0lBQ2Ysc0NBQWlCLENBQUE7SUFDakIsZ0RBQTJCLENBQUE7SUFDM0IsMENBQXFCLENBQUE7QUFDekIsQ0FBQyxFQUxXLGlCQUFpQixLQUFqQixpQkFBaUIsUUFLNUIiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDb21wb25lbnRUeXBlIH0gZnJvbSAnQGFuZ3VsYXIvY2RrL3BvcnRhbCc7XG5pbXBvcnQgeyBPYnNlcnZhYmxlIH0gZnJvbSAncnhqcyc7XG5pbXBvcnQgeyBUaW1lZnJhbWVPcHRpb24gfSBmcm9tICcuLi8uLi9tb2RlbHMvZGF0ZVBpY2tlcic7XG5pbXBvcnQgeyBNYXRMZWdhY3lEaWFsb2dDb25maWcgYXMgTWF0RGlhbG9nQ29uZmlnIH0gZnJvbSAnQGFuZ3VsYXIvbWF0ZXJpYWwvbGVnYWN5LWRpYWxvZyc7XG5cbnR5cGUgRGlhbG9nQ29uZmlnID0gT21pdDxNYXREaWFsb2dDb25maWcsICdkYXRhJz47XG5cbi8vIERhdGEgT2JqIGZvciBvcGVuRGlhbG9nV3JhcHBlcigpXG5leHBvcnQgaW50ZXJmYWNlIERpYWxvZ0RhdGE8VCA9IGFueT4gZXh0ZW5kcyBEaWFsb2dDb25maWcge1xuICAgIGRhdGE6IHtcbiAgICAgICAgdGl0bGU/OiBzdHJpbmc7XG4gICAgICAgIHNlYXJjaGFibGU/OiBib29sZWFuO1xuICAgICAgICBjbGVhcmFibGU/OiBib29sZWFuO1xuICAgICAgICBzdWJ0aXRsZT86IHN0cmluZztcbiAgICAgICAgY29udGVudD86IGFueTtcbiAgICAgICAgY29udGVudEljb24/OiB7XG4gICAgICAgICAgICBjbGFzcz86IHN0cmluZztcbiAgICAgICAgICAgIGNvbG9yPzogc3RyaW5nO1xuICAgICAgICB9O1xuICAgICAgICBhY2NlcHRCdXR0b24/OiBEaWFsb2dGb290ZXJCdXR0b247XG4gICAgICAgIGNhbmNlbEJ1dHRvbj86IERpYWxvZ0Zvb3RlckJ1dHRvbjtcbiAgICAgICAgY3VzdG9tQnV0dG9uPzogRGlhbG9nRm9vdGVyQnV0dG9uO1xuICAgICAgICB0b29sdGlwcz86IGFueTtcbiAgICAgICAgZXJyb3JNZXNzYWdlPzogc3RyaW5nO1xuICAgICAgICBzZXJ2ZXJFcnJvck1lc3NhZ2U/OiBzdHJpbmc7XG4gICAgICAgIGNoaWxkPzogQ29tcG9uZW50VHlwZTxUPjtcbiAgICAgICAgY2hpbGREYXRhPzogUGFydGlhbDxUPjtcbiAgICAgICAgdGhlbWU/OiB7XG4gICAgICAgICAgICB0aGVtZVNpemU/OiBTaXplTW9kYWw7XG4gICAgICAgICAgICB0eXBlPzogJ3N1Y2Nlc3NmdWwnO1xuICAgICAgICAgICAgY29udGVudE5vUGFkZGluZz86IGJvb2xlYW47XG4gICAgICAgICAgICBpc0NvbmZpcm1hdGlvbj86IGJvb2xlYW47XG4gICAgICAgICAgICBub1RoZW1lU2l6ZUNsYXNzPzogYm9vbGVhbjtcbiAgICAgICAgfTtcbiAgICAgICAgY29uZmlybUZuPzogYW55O1xuICAgICAgICBmaWVsZHM/OiBNb2RhbEZvcm1GaWVsZFtdO1xuICAgICAgICBoaWRlQ2xvc2VCdG4/OiBib29sZWFuO1xuICAgICAgICBmb290ZXJUZW1wbGF0ZURhdGE/OiBGb290ZXJUZW1wbGF0ZURhdGE7XG4gICAgICAgIGRldGFpbHM/OiB7XG4gICAgICAgICAgICB0aXRsZT86IHN0cmluZztcbiAgICAgICAgICAgIGl0ZW1zPzogc3RyaW5nW10gfCBPYnNlcnZhYmxlPHN0cmluZ1tdPjtcbiAgICAgICAgfTtcbiAgICAgICAgaGVhZGVySWNvbkNsYXNzPzogc3RyaW5nO1xuICAgICAgICBmb3JtV3JhcHBlckNsYXNzPzogc3RyaW5nO1xuICAgIH07XG59XG5cbi8vIERhdGEgT2JqIGZvciBvcGVuQ29uZmlybURpYWxvZygpXG5leHBvcnQgaW50ZXJmYWNlIENvbmZpcm1EaWFsb2dEYXRhIHtcbiAgICB0aXRsZT86IHN0cmluZztcbiAgICBzZWFyY2hhYmxlPzogYm9vbGVhbjtcbiAgICBjbGVhcmFibGU/OiBib29sZWFuO1xuICAgIGNvbnRlbnQ/OiBzdHJpbmc7XG4gICAgY29udGVudEljb24/OiB7XG4gICAgICAgIGNsYXNzPzogc3RyaW5nO1xuICAgICAgICBjb2xvcj86IHN0cmluZztcbiAgICB9O1xuICAgIGFjY2VwdEJ1dHRvbj86IERpYWxvZ0Zvb3RlckJ1dHRvbjtcbiAgICBjYW5jZWxCdXR0b24/OiBEaWFsb2dGb290ZXJCdXR0b247XG4gICAgY3VzdG9tQnV0dG9uPzogRGlhbG9nRm9vdGVyQnV0dG9uO1xuICAgIHRvb2x0aXBzPzogYW55O1xuICAgIGVycm9yTWVzc2FnZT86IHN0cmluZztcbiAgICBzZXJ2ZXJFcnJvck1lc3NhZ2U/OiBzdHJpbmc7XG4gICAgaGlkZUNsb3NlQnRuPzogYm9vbGVhbjtcbiAgICBjb25maXJtRm4/OiAocmVzcG9uc2U/OiBhbnkpID0+IE9ic2VydmFibGU8YW55PjtcbiAgICBmaWVsZHM/OiBNb2RhbEZvcm1GaWVsZFtdO1xuICAgIGZvb3RlclRlbXBsYXRlRGF0YT86IEZvb3RlclRlbXBsYXRlRGF0YTtcbiAgICBkZXRhaWxzPzoge1xuICAgICAgICB0aXRsZT86IHN0cmluZztcbiAgICAgICAgaXRlbXM/OiBzdHJpbmdbXSB8IE9ic2VydmFibGU8c3RyaW5nW10+O1xuICAgIH07XG4gICAgdGhlbWU/OiB7XG4gICAgICAgIHRoZW1lU2l6ZT86IFNpemVNb2RhbDtcbiAgICB9O1xuICAgIGhlYWRlckljb25DbGFzcz86IHN0cmluZztcbiAgICBmb3JtV3JhcHBlckNsYXNzPzogc3RyaW5nO1xufVxuXG4vLyBEYXRhIE9iaiBmb3Igb3BlbkNvbmZpcm1EaWFsb2dNb2RhbCgpXG5leHBvcnQgaW50ZXJmYWNlIENvbmZpcm1EaWFsb2dNb2RhbERhdGEgZXh0ZW5kcyBDb25maXJtRGlhbG9nRGF0YSB7XG4gICAgY29uZmlybUZuPzogYW55O1xuICAgIGhpZGVDbG9zZUJ0bj86IGJvb2xlYW47XG4gICAgZm9vdGVyVGVtcGxhdGVEYXRhPzogRm9vdGVyVGVtcGxhdGVEYXRhO1xuICAgIGZpZWxkcz86IE1vZGFsRm9ybUZpZWxkW107XG4gICAgaGVhZGVySWNvbkNsYXNzPzogc3RyaW5nO1xuICAgIGZvcm1XcmFwcGVyQ2xhc3M/OiBzdHJpbmc7XG59XG5cbmV4cG9ydCBpbnRlcmZhY2UgRm9vdGVyVGVtcGxhdGVEYXRhIHtcbiAgICBsYWJlbDogc3RyaW5nO1xuICAgIGljb24/OiBzdHJpbmc7XG4gICAgYWN0aW9uOiAob2JqVG9TYXZlPzogYW55KSA9PiBhbnk7XG59XG5cbmV4cG9ydCBpbnRlcmZhY2UgTW9kYWxGb3JtRmllbGQge1xuICAgIG5hbWU6IHN0cmluZztcbiAgICB0eXBlOiBURGlhbG9nRmllbGRUeXBlO1xuICAgIGxhYmVsPzogc3RyaW5nO1xuICAgIGlzTGFiZWxGdWxsV2lkdGg/OiBib29sZWFuO1xuICAgIGl0ZW1zPzogYW55W107XG4gICAgaXRlbXMkPzogT2JzZXJ2YWJsZTxhbnlbXT4gfCBPYnNlcnZhYmxlPGFueT47XG4gICAgZGVmYXVsdD86IGFueTtcbiAgICBwbGFjZWhvbGRlcj86IHN0cmluZztcbiAgICBiaW5kTGFiZWw/OiBzdHJpbmc7XG4gICAgYmluZFZhbHVlPzogc3RyaW5nO1xuICAgIHZhbGlkYXRvcnM/OiBhbnlbXTtcbiAgICBkYXRlUGlja2VyRm9ybWF0PzogVGltZWZyYW1lT3B0aW9uO1xuICAgIGZvcm1Hcm91cENsYXNzPzogc3RyaW5nO1xufVxuXG5leHBvcnQgdHlwZSBTaXplTW9kYWwgPVxuICAgIHwgJ3NtYWxsLW1vZGFsJ1xuICAgIHwgJ3NtYWxsLW1vZGFsLW1heC1oZWlnaHQnXG4gICAgfCAnbWVkaXVtLXNtYWxsLW1vZGFsJ1xuICAgIHwgJ21lZGl1bS1tb2RhbCdcbiAgICB8ICdtZWRpdW0tbW9kYWwtbWF4LWhlaWdodCdcbiAgICB8ICdtZWRpdW0tbGFyZ2UtbW9kYWwnXG4gICAgfCAnbGFyZ2UtbW9kYWwnXG4gICAgfCAneGwtbW9kYWwnXG4gICAgfCAneGwtY3VzdG9tLW1vZGFsJ1xuICAgIHwgJ3hsLW1lZGl1bS1tb2RhbCc7XG5cbmV4cG9ydCB0eXBlIERhdGFQcm9wPFQgPSBhbnk+ID0gRGlhbG9nRGF0YTxUPlsnZGF0YSddO1xuXG5leHBvcnQgdHlwZSBEaWFsb2dUaGVtZSA9IERhdGFQcm9wWyd0aGVtZSddO1xuXG5leHBvcnQgdHlwZSBEaWFsb2dGb290ZXJCdXR0b24gPSB7XG4gICAgbGFiZWw/OiBzdHJpbmc7XG4gICAgbG9hZGluZ0xhYmVsPzogc3RyaW5nO1xuICAgIGZ1bmN0aW9ucz86IGFueTtcbiAgICBpc0Rpc2FibGVkPzogYm9vbGVhbjtcbiAgICBsb2FkaW5nPzogYW55O1xuICAgIHRoZW1lPzogYW55O1xufTtcblxuZXhwb3J0IGVudW0gRElBTE9HX1NJWkUge1xuICAgIFNNQUxMID0gJ3NtYWxsLW1vZGFsJyxcbiAgICBTTUFMTF9NQVhfSEVJR0hUID0gJ3NtYWxsLW1vZGFsLW1heC1oZWlnaHQnLFxuICAgIE1FRElVTSA9ICdtZWRpdW0tbW9kYWwnLFxuICAgIE1FRElVTV9TTUFMTCA9ICdtZWRpdW0tc21hbGwtbW9kYWwnLFxuICAgIE1FRElVTV9NQVhfSEVJR0hUID0gJ21lZGl1bS1tb2RhbC1tYXgtaGVpZ2h0JyxcbiAgICBNRURJVU1fTEFSR0UgPSAnbWVkaXVtLWxhcmdlLW1vZGFsJyxcbiAgICBMQVJHRSA9ICdsYXJnZS1tb2RhbCcsXG4gICAgWF9MQVJHRSA9ICd4bC1tb2RhbCcsXG4gICAgWF9DVVNUT01fTEFSR0UgPSAneGwtY3VzdG9tLW1vZGFsJyxcbiAgICBYX01FRElVTSA9ICd4bC1tZWRpdW0tbW9kYWwnLFxufVxuXG5leHBvcnQgZW51bSBESUFMT0dfQlVUVE9OX0xBQkVMIHtcbiAgICBTQVZFID0gJ1NhdmUnLFxuICAgIENBTkNFTCA9ICdDYW5jZWwnLFxuICAgIENMT1NFID0gJ0Nsb3NlJyxcbn1cblxuZXhwb3J0IGVudW0gRElBTE9HX0ZJRUxEX1RZUEUge1xuICAgIElOUFVUID0gJ2lucHV0JyxcbiAgICBTRUxFQ1QgPSAnc2VsZWN0JyxcbiAgICBEQVRFX1BJQ0tFUiA9ICdkYXRlX3BpY2tlcicsXG4gICAgQ0hFQ0tCT1ggPSAnY2hlY2tib3gnLFxufVxuXG5leHBvcnQgdHlwZSBURGlhbG9nRmllbGRUeXBlID0gRElBTE9HX0ZJRUxEX1RZUEU7XG4iXX0=
|
|
@@ -36,11 +36,11 @@ export class StepperComponent {
|
|
|
36
36
|
return Math.round(width);
|
|
37
37
|
}
|
|
38
38
|
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: StepperComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
39
|
-
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: StepperComponent, selector: "dr-stepper", inputs: { steps: "steps", currentStep: "currentStep", withoutConnectors: "withoutConnectors", hiddenNames: "hiddenNames", inlineLabels: "inlineLabels", disabled: "disabled", hiddenIndex: "hiddenIndex", mini: "mini" }, outputs: { stepChange: "stepChange" }, viewQueries: [{ propertyName: "stepper", first: true, predicate: ["stepper"], descendants: true, read: ElementRef }], ngImport: i0, template: "<div class=\"scroll-section\" *ngIf=\"stepper?.scrollLeft !== 0\" (click)=\"scrollLeft()\">\n <i class=\"dr-icon-arrow-right\"></i>\n</div>\n<div #stepper\n class=\"stepper\"\n [class.stepper--disabled]=\"disabled\"\n [class.stepper--mini]=\"mini\">\n <ng-container *ngFor=\"let step of steps; let index = index; last as isLast; first as isFirst\">\n <div *ngIf=\"!step.hide\" class=\"step\" (click)=\"selectStep(step)\"\n [class.step-setup]=\"inlineLabels\">\n <div class=\"step-wrapper\" [drTooltip]=\"step.description && tooltip\"\n [drTooltipContext]=\"{ step: step }\"\n [drTooltipPosition]=\"'bottom'\">\n <div data-test=\"step_point\" class=\"step-point\" [class.active]=\"currentStep === step\" [class.completed]=\"step.completed\">\n <div *ngIf=\"step === currentStep;\" class=\"ellipse\"></div>\n <ng-container [ngSwitch]=\"step.completed\">\n <ng-template [ngSwitchCase]=\"true\">\n <div class=\"pointer blue\">\n <i class=\"dr-icon-approve\"></i>\n </div>\n </ng-template>\n <ng-template [ngSwitchCase]=\"false\">\n <div class=\"pointer\" [class.gray]=\"step !== currentStep\"\n [ngClass]=\"{'blue with-ellipse': step === currentStep}\">\n <div [hidden]=\"step === currentStep || hiddenIndex\" class=\"text\">{{index + 1}}</div>\n </div>\n </ng-template>\n </ng-container>\n </div>\n <div data-test=\"step_label_name\" class=\"step-label\" [class.active]=\"currentStep === step\"\n [ngClass]=\"step.completed ? 'completed' : 'uncompleted'\">\n <span [hidden]=\"hiddenNames\">{{step.name}}</span>\n </div>\n <ng-container *ngIf=\"inlineLabels\" [ngTemplateOutlet]=\"connector\"\n [ngTemplateOutletContext]=\"{ index, isLast, step }\">\n </ng-container>\n <span *ngIf=\"step.showProgress\"\n data-test=\"step_progress\"\n class=\"step-progress\">\n {{(step.requiredTasks ? step.completedTasks : step.requiredTasks) + '/' + step.requiredTasks}}\n </span>\n </div>\n <ng-container *ngIf=\"!inlineLabels\" [ngTemplateOutlet]=\"connector\"\n [ngTemplateOutletContext]=\"{ index, isLast, step }\">\n </ng-container>\n </div>\n </ng-container>\n</div>\n<div (click)=\"scrollRight()\" class=\"scroll-section\"\n *ngIf=\"stepper?.scrollWidth > stepper?.clientWidth && roundWidth(stepper?.scrollLeft + stepper?.clientWidth) < stepper?.scrollWidth\">\n <i class=\"dr-icon-arrow-right\"></i>\n</div>\n\n<ng-template #tooltip let-step=\"step\">\n <div class=\"step-tooltip\">\n <div class=\"step-tooltip_name\">{{step.name}}</div>\n <div class=\"step-tooltip_description\">{{step.description}}</div>\n </div>\n</ng-template>\n\n<ng-template #connector let-step=\"step\" let-isLast=\"isLast\" let-index=\"index\">\n <div class=\"step-connector\" [class.only-one-step]=\"steps.length === 1\"\n [class]=\"'step-connector--' + (!inlineLabels ? 'absolute' : 'inline')\"\n *ngIf=\"steps.length === 1 || !isLast\"\n [style.visibility]=\"withoutConnectors || steps[step.index + 1]?.hide ? 'hidden' : 'unset'\"\n [class.connector-grand]=\"!inlineLabels && (index === 0 || index === steps.length - 2)\">\n <div class=\"progress\" [style.width]=\"getWidth(step)\"></div>\n </div>\n</ng-template>\n", styles: [":host{font-family:Poppins,sans-serif;display:flex;justify-content:center;height:100%;position:relative}:host .scroll-section{position:absolute;top:0;height:100%;width:108px;display:flex;align-items:center;z-index:10}:host .scroll-section i{font-size:24px;color:#2969b0;background:#f3f7ff;border-radius:24px}:host .scroll-section i:hover{background:#cde1fb;cursor:pointer}:host .scroll-section:first-child{left:0;padding-left:16px;background:linear-gradient(90deg,#fff 36.08%,#fff0 87.17%)}:host .scroll-section:first-child i{transform:rotate(180deg)}:host .scroll-section:last-child{right:0;padding-right:16px;background:linear-gradient(270deg,#fff 36.08%,#fff0 87.17%);justify-content:flex-end}:host .stepper{display:flex;align-items:center;height:100%;width:100%;overflow:auto;scroll-behavior:smooth}:host .stepper::-webkit-scrollbar{display:none}:host .stepper--disabled .step:hover{cursor:default}:host .stepper--disabled .step-point .ellipse{border-color:#bcbcbc}:host .stepper--disabled .step-point .pointer{color:#fff;background-color:#bcbcbc;cursor:default}:host .stepper--disabled .step-label{color:#bcbcbc}:host .stepper--disabled .step-connector{background-color:#bcbcbc}:host .stepper--disabled .step-connector .progress{background-color:#bcbcbc}:host .stepper--mini .step-point{width:18px!important;height:18px!important}:host .stepper--mini .step-point.active .pointer{width:12px;height:12px}:host .stepper--mini .step-point.active .pointer i{display:none}:host .stepper--mini .step-point.active .ellipse{width:18px;height:18px}:host .stepper--mini .step-point .pointer{width:16px;height:16px}:host .stepper--mini .step-point .pointer .text{font-size:12px!important;font-weight:500;line-height:20px}:host .stepper--mini .step-point .pointer i{font-size:12px!important}:host .stepper--mini .step-label{margin-left:8px}:host .stepper--mini .step-label span{font-size:12px;font-weight:400;line-height:20px}:host .stepper--mini .step-label.active span{font-weight:600}:host .stepper--mini .step-connector .progress{background-color:#dfe0e3}:host .stepper--mini .step-connector--inline{width:53px;margin:0 12px}:host .step{position:relative;display:flex;flex-direction:column;width:120px;align-items:center;flex-shrink:0;flex-grow:1}:host .step:hover{cursor:pointer}:host .step:not(.step-setup) .step-wrapper{width:100%}:host .step:not(.step-setup):first-child .step-wrapper,:host .step:not(.step-setup):first-child .step-point,:host .step:not(.step-setup):first-child .step-label,:host .step:not(.step-setup):first-child .step-progress{margin-left:8px}:host .step:not(.step-setup):first-child .only-one-step{left:0!important;margin-left:25px}:host .step-point{display:flex;justify-content:center;width:100%;height:28px;position:relative;align-items:center}:host .step-point .ellipse{width:28px;height:28px;position:absolute;border-radius:50px;border-color:#4646ce;border-style:solid;border-width:2px;background:#fff;display:flex;justify-content:center;align-items:center;z-index:2}:host .step-point .pointer{width:24px;height:24px;position:absolute;z-index:4;border-radius:20px;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:16px;line-height:1.4;color:#6d6e6f;transition:box-shadow .2s ease-in-out}:host .step-point .pointer i{color:#fff;font-size:22px}:host .step-point .pointer.blue{background:#4646ce}:host .step-point .pointer.gray{background:#dfe0e3}:host .step-point .pointer.gray:hover{box-shadow:0 0 4px 2px #00000026}:host .step-point.completed :host .step-point.active{background:#4646ce}:host .step-point.active .ellipse{width:28px;height:28px}:host .step-point.active .pointer{width:20px;height:20px}:host .step-label{font-weight:400;font-size:14px;line-height:22px;line-height:1.5;color:#6d6e6f;display:flex;justify-content:center;overflow:hidden;margin-top:8px}:host .step-label span{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}:host .step-label.active{font-weight:600;color:#333}:host .step-label:last-child{margin-bottom:23px}:host .step-progress{margin-top:3px;font-style:normal;font-weight:400;font-size:12px;line-height:1.4;display:flex;justify-content:center}:host .step-connector{background-color:#dfe0e3;height:2px}:host .step-connector.connector-grand{width:calc(100% - 25px)}:host .step-connector.connector-grand.only-one-step{width:calc(100% - 50px)}:host .step-connector .progress{background-color:#4646ce;height:2px;width:0}:host .step-connector--absolute{position:absolute;top:14px;width:100%;left:calc(50% + 12px)}:host .step-connector--inline{width:50px;margin-left:32px;margin-right:32px}:host .step-setup{width:auto}:host .step-setup .step-wrapper{display:flex;flex-direction:row;align-items:center;width:auto}:host .step-setup+.step-setup{margin-left:0}:host .step-setup .step-progress{display:none}:host .step-setup .step-label{position:relative;transform:none;align-items:center;justify-content:start;margin:0 0 0 8px;font-size:16px}:host .step-setup .step-point{width:28px;height:28px}:host .step-setup .step-point .pointer i{font-size:22px}:host .step-setup .step-point .pointer .text{font-size:16px}::ng-deep .step-tooltip{max-width:250px;font-size:14px;line-height:22px;padding:10px 12px}::ng-deep .step-tooltip_name{font-weight:700;overflow:hidden;text-overflow:ellipsis}@media screen and (min-width: 1367px){.stepper .step-label{font-size:14px}}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i2.DrTooltipDirective, selector: "[drTooltip]", inputs: ["drTooltip", "drTooltipContext", "drTooltipPosition", "drTooltipClass", "drTooltipTheme", "drTooltipMousleaveTimeout", "drTooltipOptions", "drTooltipShow"] }], changeDetection: i0.ChangeDetectionStrategy.Default }); }
|
|
39
|
+
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: StepperComponent, selector: "dr-stepper", inputs: { steps: "steps", currentStep: "currentStep", withoutConnectors: "withoutConnectors", hiddenNames: "hiddenNames", inlineLabels: "inlineLabels", disabled: "disabled", hiddenIndex: "hiddenIndex", mini: "mini" }, outputs: { stepChange: "stepChange" }, viewQueries: [{ propertyName: "stepper", first: true, predicate: ["stepper"], descendants: true, read: ElementRef }], ngImport: i0, template: "<div class=\"scroll-section\" *ngIf=\"stepper?.scrollLeft !== 0\" (click)=\"scrollLeft()\">\n <i class=\"dr-icon-arrow-right\"></i>\n</div>\n<div #stepper\n class=\"stepper\"\n [class.stepper--disabled]=\"disabled\"\n [class.stepper--mini]=\"mini\">\n <ng-container *ngFor=\"let step of steps; let index = index; last as isLast; first as isFirst\">\n <div *ngIf=\"!step.hide\" class=\"step\" (click)=\"selectStep(step)\"\n [class.step-setup]=\"inlineLabels\">\n <div class=\"step-wrapper\" [drTooltip]=\"step.description && tooltip\"\n [drTooltipContext]=\"{ step: step }\"\n [drTooltipPosition]=\"'bottom'\">\n <div data-test=\"step_point\" class=\"step-point\" [class.active]=\"currentStep === step\" [class.completed]=\"step.completed\">\n <div *ngIf=\"step === currentStep;\" class=\"ellipse\"></div>\n <ng-container [ngSwitch]=\"step.completed\">\n <ng-template [ngSwitchCase]=\"true\">\n <div class=\"pointer blue\">\n <i class=\"dr-icon-approve\"></i>\n </div>\n </ng-template>\n <ng-template [ngSwitchCase]=\"false\">\n <div class=\"pointer\" [class.gray]=\"step !== currentStep\"\n [ngClass]=\"{'blue with-ellipse': step === currentStep}\">\n <div [hidden]=\"step === currentStep || hiddenIndex\" class=\"text\">{{index + 1}}</div>\n </div>\n </ng-template>\n </ng-container>\n </div>\n <div data-test=\"step_label_name\" class=\"step-label\" [class.active]=\"currentStep === step\"\n [ngClass]=\"step.completed ? 'completed' : 'uncompleted'\">\n <span [hidden]=\"hiddenNames\">{{step.name}}</span>\n </div>\n <ng-container *ngIf=\"inlineLabels\" [ngTemplateOutlet]=\"connector\"\n [ngTemplateOutletContext]=\"{ index, isLast, step }\">\n </ng-container>\n <span *ngIf=\"step.showProgress\"\n data-test=\"step_progress\"\n class=\"step-progress\">\n {{(step.requiredTasks ? step.completedTasks : step.requiredTasks) + '/' + step.requiredTasks}}\n </span>\n </div>\n <ng-container *ngIf=\"!inlineLabels\" [ngTemplateOutlet]=\"connector\"\n [ngTemplateOutletContext]=\"{ index, isLast, step }\">\n </ng-container>\n </div>\n <div *ngIf=\"mini\" class=\"stepper--mini-connector\"></div>\n </ng-container>\n</div>\n<div (click)=\"scrollRight()\" class=\"scroll-section\"\n *ngIf=\"stepper?.scrollWidth > stepper?.clientWidth && roundWidth(stepper?.scrollLeft + stepper?.clientWidth) < stepper?.scrollWidth\">\n <i class=\"dr-icon-arrow-right\"></i>\n</div>\n\n<ng-template #tooltip let-step=\"step\">\n <div class=\"step-tooltip\">\n <div class=\"step-tooltip_name\">{{step.name}}</div>\n <div class=\"step-tooltip_description\">{{step.description}}</div>\n </div>\n</ng-template>\n\n<ng-template #connector let-step=\"step\" let-isLast=\"isLast\" let-index=\"index\">\n <div class=\"step-connector\" [class.only-one-step]=\"steps.length === 1\"\n [class]=\"'step-connector--' + (!inlineLabels ? 'absolute' : 'inline')\"\n *ngIf=\"steps.length === 1 || !isLast\"\n [style.visibility]=\"withoutConnectors || steps[step.index + 1]?.hide ? 'hidden' : 'unset'\"\n [class.connector-grand]=\"!inlineLabels && (index === 0 || index === steps.length - 2)\">\n <div class=\"progress\" [style.width]=\"getWidth(step)\"></div>\n </div>\n</ng-template>\n", styles: [":host{font-family:Poppins,sans-serif;display:flex;justify-content:center;height:100%;position:relative}:host .scroll-section{position:absolute;top:0;height:100%;width:108px;display:flex;align-items:center;z-index:10}:host .scroll-section i{font-size:24px;color:#2969b0;background:#f3f7ff;border-radius:24px}:host .scroll-section i:hover{background:#cde1fb;cursor:pointer}:host .scroll-section:first-child{left:0;padding-left:16px;background:linear-gradient(90deg,#fff 36.08%,#fff0 87.17%)}:host .scroll-section:first-child i{transform:rotate(180deg)}:host .scroll-section:last-child{right:0;padding-right:16px;background:linear-gradient(270deg,#fff 36.08%,#fff0 87.17%);justify-content:flex-end}:host .stepper{display:flex;align-items:center;height:100%;width:100%;overflow:auto;scroll-behavior:smooth}:host .stepper::-webkit-scrollbar{display:none}:host .stepper--disabled .step:hover{cursor:default}:host .stepper--disabled .step-point .ellipse{border-color:#bcbcbc}:host .stepper--disabled .step-point .pointer{color:#fff;background-color:#bcbcbc;cursor:default}:host .stepper--disabled .step-label{color:#bcbcbc}:host .stepper--disabled .step-connector{background-color:#bcbcbc}:host .stepper--disabled .step-connector .progress{background-color:#bcbcbc}:host .stepper--mini .step-connector{display:none}:host .stepper--mini-connector{flex-grow:1;display:flex;margin:0 8px;background-color:#dfe0e3;height:2px}:host .stepper--mini-connector:last-child{display:none}:host .stepper--mini .step-setup{flex-grow:unset}:host .stepper--mini .step-point{width:18px!important;height:18px!important}:host .stepper--mini .step-point.active .pointer{width:12px;height:12px}:host .stepper--mini .step-point.active .pointer i{display:none}:host .stepper--mini .step-point.active .ellipse{width:18px;height:18px}:host .stepper--mini .step-point .pointer{width:16px;height:16px}:host .stepper--mini .step-point .pointer .text{font-size:12px!important;font-weight:500;line-height:20px}:host .stepper--mini .step-point .pointer i{font-size:12px!important}:host .stepper--mini .step-label{margin-left:8px}:host .stepper--mini .step-label span{font-size:12px;font-weight:400;line-height:20px}:host .stepper--mini .step-label.active span{font-weight:600}:host .step{position:relative;display:flex;flex-direction:column;width:120px;align-items:center;flex-shrink:0;flex-grow:1}:host .step:hover{cursor:pointer}:host .step:not(.step-setup) .step-wrapper{width:100%}:host .step:not(.step-setup):first-child .step-wrapper,:host .step:not(.step-setup):first-child .step-point,:host .step:not(.step-setup):first-child .step-label,:host .step:not(.step-setup):first-child .step-progress{margin-left:8px}:host .step:not(.step-setup):first-child .only-one-step{left:0!important;margin-left:25px}:host .step-point{display:flex;justify-content:center;width:100%;height:28px;position:relative;align-items:center}:host .step-point .ellipse{width:28px;height:28px;position:absolute;border-radius:50px;border-color:#4646ce;border-style:solid;border-width:2px;background:#fff;display:flex;justify-content:center;align-items:center;z-index:2}:host .step-point .pointer{width:24px;height:24px;position:absolute;z-index:4;border-radius:20px;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:16px;line-height:1.4;color:#6d6e6f;transition:box-shadow .2s ease-in-out}:host .step-point .pointer i{color:#fff;font-size:22px}:host .step-point .pointer.blue{background:#4646ce}:host .step-point .pointer.gray{background:#dfe0e3}:host .step-point .pointer.gray:hover{box-shadow:0 0 4px 2px #00000026}:host .step-point.completed :host .step-point.active{background:#4646ce}:host .step-point.active .ellipse{width:28px;height:28px}:host .step-point.active .pointer{width:20px;height:20px}:host .step-label{font-weight:400;font-size:14px;line-height:22px;line-height:1.5;color:#6d6e6f;display:flex;justify-content:center;overflow:hidden;margin-top:8px}:host .step-label span{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}:host .step-label.active{font-weight:600;color:#333}:host .step-label:last-child{margin-bottom:23px}:host .step-progress{margin-top:3px;font-style:normal;font-weight:400;font-size:12px;line-height:1.4;display:flex;justify-content:center}:host .step-connector{background-color:#dfe0e3;height:2px}:host .step-connector.connector-grand{width:calc(100% - 25px)}:host .step-connector.connector-grand.only-one-step{width:calc(100% - 50px)}:host .step-connector .progress{background-color:#4646ce;height:2px;width:0}:host .step-connector--absolute{position:absolute;top:14px;width:100%;left:calc(50% + 12px)}:host .step-connector--inline{width:50px;margin-left:32px;margin-right:32px}:host .step-setup{width:auto}:host .step-setup .step-wrapper{display:flex;flex-direction:row;align-items:center;width:auto}:host .step-setup+.step-setup{margin-left:0}:host .step-setup .step-progress{display:none}:host .step-setup .step-label{position:relative;transform:none;align-items:center;justify-content:start;margin:0 0 0 8px;font-size:16px}:host .step-setup .step-point{width:28px;height:28px}:host .step-setup .step-point .pointer i{font-size:22px}:host .step-setup .step-point .pointer .text{font-size:16px}::ng-deep .step-tooltip{max-width:250px;font-size:14px;line-height:22px;padding:10px 12px}::ng-deep .step-tooltip_name{font-weight:700;overflow:hidden;text-overflow:ellipsis}@media screen and (min-width: 1367px){.stepper .step-label{font-size:14px}}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i2.DrTooltipDirective, selector: "[drTooltip]", inputs: ["drTooltip", "drTooltipContext", "drTooltipPosition", "drTooltipClass", "drTooltipTheme", "drTooltipMousleaveTimeout", "drTooltipOptions", "drTooltipShow"] }], changeDetection: i0.ChangeDetectionStrategy.Default }); }
|
|
40
40
|
}
|
|
41
41
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: StepperComponent, decorators: [{
|
|
42
42
|
type: Component,
|
|
43
|
-
args: [{ selector: 'dr-stepper', changeDetection: ChangeDetectionStrategy.Default, template: "<div class=\"scroll-section\" *ngIf=\"stepper?.scrollLeft !== 0\" (click)=\"scrollLeft()\">\n <i class=\"dr-icon-arrow-right\"></i>\n</div>\n<div #stepper\n class=\"stepper\"\n [class.stepper--disabled]=\"disabled\"\n [class.stepper--mini]=\"mini\">\n <ng-container *ngFor=\"let step of steps; let index = index; last as isLast; first as isFirst\">\n <div *ngIf=\"!step.hide\" class=\"step\" (click)=\"selectStep(step)\"\n [class.step-setup]=\"inlineLabels\">\n <div class=\"step-wrapper\" [drTooltip]=\"step.description && tooltip\"\n [drTooltipContext]=\"{ step: step }\"\n [drTooltipPosition]=\"'bottom'\">\n <div data-test=\"step_point\" class=\"step-point\" [class.active]=\"currentStep === step\" [class.completed]=\"step.completed\">\n <div *ngIf=\"step === currentStep;\" class=\"ellipse\"></div>\n <ng-container [ngSwitch]=\"step.completed\">\n <ng-template [ngSwitchCase]=\"true\">\n <div class=\"pointer blue\">\n <i class=\"dr-icon-approve\"></i>\n </div>\n </ng-template>\n <ng-template [ngSwitchCase]=\"false\">\n <div class=\"pointer\" [class.gray]=\"step !== currentStep\"\n [ngClass]=\"{'blue with-ellipse': step === currentStep}\">\n <div [hidden]=\"step === currentStep || hiddenIndex\" class=\"text\">{{index + 1}}</div>\n </div>\n </ng-template>\n </ng-container>\n </div>\n <div data-test=\"step_label_name\" class=\"step-label\" [class.active]=\"currentStep === step\"\n [ngClass]=\"step.completed ? 'completed' : 'uncompleted'\">\n <span [hidden]=\"hiddenNames\">{{step.name}}</span>\n </div>\n <ng-container *ngIf=\"inlineLabels\" [ngTemplateOutlet]=\"connector\"\n [ngTemplateOutletContext]=\"{ index, isLast, step }\">\n </ng-container>\n <span *ngIf=\"step.showProgress\"\n data-test=\"step_progress\"\n class=\"step-progress\">\n {{(step.requiredTasks ? step.completedTasks : step.requiredTasks) + '/' + step.requiredTasks}}\n </span>\n </div>\n <ng-container *ngIf=\"!inlineLabels\" [ngTemplateOutlet]=\"connector\"\n [ngTemplateOutletContext]=\"{ index, isLast, step }\">\n </ng-container>\n </div>\n </ng-container>\n</div>\n<div (click)=\"scrollRight()\" class=\"scroll-section\"\n *ngIf=\"stepper?.scrollWidth > stepper?.clientWidth && roundWidth(stepper?.scrollLeft + stepper?.clientWidth) < stepper?.scrollWidth\">\n <i class=\"dr-icon-arrow-right\"></i>\n</div>\n\n<ng-template #tooltip let-step=\"step\">\n <div class=\"step-tooltip\">\n <div class=\"step-tooltip_name\">{{step.name}}</div>\n <div class=\"step-tooltip_description\">{{step.description}}</div>\n </div>\n</ng-template>\n\n<ng-template #connector let-step=\"step\" let-isLast=\"isLast\" let-index=\"index\">\n <div class=\"step-connector\" [class.only-one-step]=\"steps.length === 1\"\n [class]=\"'step-connector--' + (!inlineLabels ? 'absolute' : 'inline')\"\n *ngIf=\"steps.length === 1 || !isLast\"\n [style.visibility]=\"withoutConnectors || steps[step.index + 1]?.hide ? 'hidden' : 'unset'\"\n [class.connector-grand]=\"!inlineLabels && (index === 0 || index === steps.length - 2)\">\n <div class=\"progress\" [style.width]=\"getWidth(step)\"></div>\n </div>\n</ng-template>\n", styles: [":host{font-family:Poppins,sans-serif;display:flex;justify-content:center;height:100%;position:relative}:host .scroll-section{position:absolute;top:0;height:100%;width:108px;display:flex;align-items:center;z-index:10}:host .scroll-section i{font-size:24px;color:#2969b0;background:#f3f7ff;border-radius:24px}:host .scroll-section i:hover{background:#cde1fb;cursor:pointer}:host .scroll-section:first-child{left:0;padding-left:16px;background:linear-gradient(90deg,#fff 36.08%,#fff0 87.17%)}:host .scroll-section:first-child i{transform:rotate(180deg)}:host .scroll-section:last-child{right:0;padding-right:16px;background:linear-gradient(270deg,#fff 36.08%,#fff0 87.17%);justify-content:flex-end}:host .stepper{display:flex;align-items:center;height:100%;width:100%;overflow:auto;scroll-behavior:smooth}:host .stepper::-webkit-scrollbar{display:none}:host .stepper--disabled .step:hover{cursor:default}:host .stepper--disabled .step-point .ellipse{border-color:#bcbcbc}:host .stepper--disabled .step-point .pointer{color:#fff;background-color:#bcbcbc;cursor:default}:host .stepper--disabled .step-label{color:#bcbcbc}:host .stepper--disabled .step-connector{background-color:#bcbcbc}:host .stepper--disabled .step-connector .progress{background-color:#bcbcbc}:host .stepper--mini .step-point{width:18px!important;height:18px!important}:host .stepper--mini .step-point.active .pointer{width:12px;height:12px}:host .stepper--mini .step-point.active .pointer i{display:none}:host .stepper--mini .step-point.active .ellipse{width:18px;height:18px}:host .stepper--mini .step-point .pointer{width:16px;height:16px}:host .stepper--mini .step-point .pointer .text{font-size:12px!important;font-weight:500;line-height:20px}:host .stepper--mini .step-point .pointer i{font-size:12px!important}:host .stepper--mini .step-label{margin-left:8px}:host .stepper--mini .step-label span{font-size:12px;font-weight:400;line-height:20px}:host .stepper--mini .step-label.active span{font-weight:600}:host .
|
|
43
|
+
args: [{ selector: 'dr-stepper', changeDetection: ChangeDetectionStrategy.Default, template: "<div class=\"scroll-section\" *ngIf=\"stepper?.scrollLeft !== 0\" (click)=\"scrollLeft()\">\n <i class=\"dr-icon-arrow-right\"></i>\n</div>\n<div #stepper\n class=\"stepper\"\n [class.stepper--disabled]=\"disabled\"\n [class.stepper--mini]=\"mini\">\n <ng-container *ngFor=\"let step of steps; let index = index; last as isLast; first as isFirst\">\n <div *ngIf=\"!step.hide\" class=\"step\" (click)=\"selectStep(step)\"\n [class.step-setup]=\"inlineLabels\">\n <div class=\"step-wrapper\" [drTooltip]=\"step.description && tooltip\"\n [drTooltipContext]=\"{ step: step }\"\n [drTooltipPosition]=\"'bottom'\">\n <div data-test=\"step_point\" class=\"step-point\" [class.active]=\"currentStep === step\" [class.completed]=\"step.completed\">\n <div *ngIf=\"step === currentStep;\" class=\"ellipse\"></div>\n <ng-container [ngSwitch]=\"step.completed\">\n <ng-template [ngSwitchCase]=\"true\">\n <div class=\"pointer blue\">\n <i class=\"dr-icon-approve\"></i>\n </div>\n </ng-template>\n <ng-template [ngSwitchCase]=\"false\">\n <div class=\"pointer\" [class.gray]=\"step !== currentStep\"\n [ngClass]=\"{'blue with-ellipse': step === currentStep}\">\n <div [hidden]=\"step === currentStep || hiddenIndex\" class=\"text\">{{index + 1}}</div>\n </div>\n </ng-template>\n </ng-container>\n </div>\n <div data-test=\"step_label_name\" class=\"step-label\" [class.active]=\"currentStep === step\"\n [ngClass]=\"step.completed ? 'completed' : 'uncompleted'\">\n <span [hidden]=\"hiddenNames\">{{step.name}}</span>\n </div>\n <ng-container *ngIf=\"inlineLabels\" [ngTemplateOutlet]=\"connector\"\n [ngTemplateOutletContext]=\"{ index, isLast, step }\">\n </ng-container>\n <span *ngIf=\"step.showProgress\"\n data-test=\"step_progress\"\n class=\"step-progress\">\n {{(step.requiredTasks ? step.completedTasks : step.requiredTasks) + '/' + step.requiredTasks}}\n </span>\n </div>\n <ng-container *ngIf=\"!inlineLabels\" [ngTemplateOutlet]=\"connector\"\n [ngTemplateOutletContext]=\"{ index, isLast, step }\">\n </ng-container>\n </div>\n <div *ngIf=\"mini\" class=\"stepper--mini-connector\"></div>\n </ng-container>\n</div>\n<div (click)=\"scrollRight()\" class=\"scroll-section\"\n *ngIf=\"stepper?.scrollWidth > stepper?.clientWidth && roundWidth(stepper?.scrollLeft + stepper?.clientWidth) < stepper?.scrollWidth\">\n <i class=\"dr-icon-arrow-right\"></i>\n</div>\n\n<ng-template #tooltip let-step=\"step\">\n <div class=\"step-tooltip\">\n <div class=\"step-tooltip_name\">{{step.name}}</div>\n <div class=\"step-tooltip_description\">{{step.description}}</div>\n </div>\n</ng-template>\n\n<ng-template #connector let-step=\"step\" let-isLast=\"isLast\" let-index=\"index\">\n <div class=\"step-connector\" [class.only-one-step]=\"steps.length === 1\"\n [class]=\"'step-connector--' + (!inlineLabels ? 'absolute' : 'inline')\"\n *ngIf=\"steps.length === 1 || !isLast\"\n [style.visibility]=\"withoutConnectors || steps[step.index + 1]?.hide ? 'hidden' : 'unset'\"\n [class.connector-grand]=\"!inlineLabels && (index === 0 || index === steps.length - 2)\">\n <div class=\"progress\" [style.width]=\"getWidth(step)\"></div>\n </div>\n</ng-template>\n", styles: [":host{font-family:Poppins,sans-serif;display:flex;justify-content:center;height:100%;position:relative}:host .scroll-section{position:absolute;top:0;height:100%;width:108px;display:flex;align-items:center;z-index:10}:host .scroll-section i{font-size:24px;color:#2969b0;background:#f3f7ff;border-radius:24px}:host .scroll-section i:hover{background:#cde1fb;cursor:pointer}:host .scroll-section:first-child{left:0;padding-left:16px;background:linear-gradient(90deg,#fff 36.08%,#fff0 87.17%)}:host .scroll-section:first-child i{transform:rotate(180deg)}:host .scroll-section:last-child{right:0;padding-right:16px;background:linear-gradient(270deg,#fff 36.08%,#fff0 87.17%);justify-content:flex-end}:host .stepper{display:flex;align-items:center;height:100%;width:100%;overflow:auto;scroll-behavior:smooth}:host .stepper::-webkit-scrollbar{display:none}:host .stepper--disabled .step:hover{cursor:default}:host .stepper--disabled .step-point .ellipse{border-color:#bcbcbc}:host .stepper--disabled .step-point .pointer{color:#fff;background-color:#bcbcbc;cursor:default}:host .stepper--disabled .step-label{color:#bcbcbc}:host .stepper--disabled .step-connector{background-color:#bcbcbc}:host .stepper--disabled .step-connector .progress{background-color:#bcbcbc}:host .stepper--mini .step-connector{display:none}:host .stepper--mini-connector{flex-grow:1;display:flex;margin:0 8px;background-color:#dfe0e3;height:2px}:host .stepper--mini-connector:last-child{display:none}:host .stepper--mini .step-setup{flex-grow:unset}:host .stepper--mini .step-point{width:18px!important;height:18px!important}:host .stepper--mini .step-point.active .pointer{width:12px;height:12px}:host .stepper--mini .step-point.active .pointer i{display:none}:host .stepper--mini .step-point.active .ellipse{width:18px;height:18px}:host .stepper--mini .step-point .pointer{width:16px;height:16px}:host .stepper--mini .step-point .pointer .text{font-size:12px!important;font-weight:500;line-height:20px}:host .stepper--mini .step-point .pointer i{font-size:12px!important}:host .stepper--mini .step-label{margin-left:8px}:host .stepper--mini .step-label span{font-size:12px;font-weight:400;line-height:20px}:host .stepper--mini .step-label.active span{font-weight:600}:host .step{position:relative;display:flex;flex-direction:column;width:120px;align-items:center;flex-shrink:0;flex-grow:1}:host .step:hover{cursor:pointer}:host .step:not(.step-setup) .step-wrapper{width:100%}:host .step:not(.step-setup):first-child .step-wrapper,:host .step:not(.step-setup):first-child .step-point,:host .step:not(.step-setup):first-child .step-label,:host .step:not(.step-setup):first-child .step-progress{margin-left:8px}:host .step:not(.step-setup):first-child .only-one-step{left:0!important;margin-left:25px}:host .step-point{display:flex;justify-content:center;width:100%;height:28px;position:relative;align-items:center}:host .step-point .ellipse{width:28px;height:28px;position:absolute;border-radius:50px;border-color:#4646ce;border-style:solid;border-width:2px;background:#fff;display:flex;justify-content:center;align-items:center;z-index:2}:host .step-point .pointer{width:24px;height:24px;position:absolute;z-index:4;border-radius:20px;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:16px;line-height:1.4;color:#6d6e6f;transition:box-shadow .2s ease-in-out}:host .step-point .pointer i{color:#fff;font-size:22px}:host .step-point .pointer.blue{background:#4646ce}:host .step-point .pointer.gray{background:#dfe0e3}:host .step-point .pointer.gray:hover{box-shadow:0 0 4px 2px #00000026}:host .step-point.completed :host .step-point.active{background:#4646ce}:host .step-point.active .ellipse{width:28px;height:28px}:host .step-point.active .pointer{width:20px;height:20px}:host .step-label{font-weight:400;font-size:14px;line-height:22px;line-height:1.5;color:#6d6e6f;display:flex;justify-content:center;overflow:hidden;margin-top:8px}:host .step-label span{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}:host .step-label.active{font-weight:600;color:#333}:host .step-label:last-child{margin-bottom:23px}:host .step-progress{margin-top:3px;font-style:normal;font-weight:400;font-size:12px;line-height:1.4;display:flex;justify-content:center}:host .step-connector{background-color:#dfe0e3;height:2px}:host .step-connector.connector-grand{width:calc(100% - 25px)}:host .step-connector.connector-grand.only-one-step{width:calc(100% - 50px)}:host .step-connector .progress{background-color:#4646ce;height:2px;width:0}:host .step-connector--absolute{position:absolute;top:14px;width:100%;left:calc(50% + 12px)}:host .step-connector--inline{width:50px;margin-left:32px;margin-right:32px}:host .step-setup{width:auto}:host .step-setup .step-wrapper{display:flex;flex-direction:row;align-items:center;width:auto}:host .step-setup+.step-setup{margin-left:0}:host .step-setup .step-progress{display:none}:host .step-setup .step-label{position:relative;transform:none;align-items:center;justify-content:start;margin:0 0 0 8px;font-size:16px}:host .step-setup .step-point{width:28px;height:28px}:host .step-setup .step-point .pointer i{font-size:22px}:host .step-setup .step-point .pointer .text{font-size:16px}::ng-deep .step-tooltip{max-width:250px;font-size:14px;line-height:22px;padding:10px 12px}::ng-deep .step-tooltip_name{font-weight:700;overflow:hidden;text-overflow:ellipsis}@media screen and (min-width: 1367px){.stepper .step-label{font-size:14px}}\n"] }]
|
|
44
44
|
}], propDecorators: { steps: [{
|
|
45
45
|
type: Input
|
|
46
46
|
}], currentStep: [{
|
|
@@ -63,4 +63,4 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
|
|
|
63
63
|
type: ViewChild,
|
|
64
64
|
args: ['stepper', { read: ElementRef }]
|
|
65
65
|
}] } });
|
|
66
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
66
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic3RlcHBlci5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9kYXRhcmFpbHNzaGFyZWQvc3JjL2xpYi9zdGVwcGVyL3N0ZXBwZXIuY29tcG9uZW50LnRzIiwiLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvZGF0YXJhaWxzc2hhcmVkL3NyYy9saWIvc3RlcHBlci9zdGVwcGVyLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSx1QkFBdUIsRUFBRSxTQUFTLEVBQUUsVUFBVSxFQUFFLFlBQVksRUFBRSxLQUFLLEVBQUUsTUFBTSxFQUFFLFNBQVMsRUFBRSxNQUFNLGVBQWUsQ0FBQzs7OztBQVN2SCxNQUFNLE9BQU8sZ0JBQWdCO0lBTjdCO1FBVWEsc0JBQWlCLEdBQUcsS0FBSyxDQUFDO1FBQzFCLGdCQUFXLEdBQUcsS0FBSyxDQUFDO1FBQ3BCLGlCQUFZLEdBQUcsS0FBSyxDQUFDO1FBQ3JCLGFBQVEsR0FBRyxLQUFLLENBQUM7UUFDakIsZ0JBQVcsR0FBRyxLQUFLLENBQUM7UUFDcEIsU0FBSSxHQUFHLEtBQUssQ0FBQztRQUNaLGVBQVUsR0FBb0IsSUFBSSxZQUFZLEVBQUssQ0FBQztLQTJCakU7SUF4QkcsVUFBVSxDQUFDLElBQU87UUFDZCxJQUFJLElBQUksS0FBSyxJQUFJLENBQUMsV0FBVyxJQUFJLENBQUMsSUFBSSxDQUFDLFFBQVEsRUFBRTtZQUM3QyxJQUFJLENBQUMsVUFBVSxDQUFDLElBQUksQ0FBQyxJQUFJLENBQUMsQ0FBQztTQUM5QjtJQUNMLENBQUM7SUFFRCxRQUFRLENBQUMsSUFBTztRQUNaLElBQUksSUFBSSxDQUFDLGlCQUFpQjtZQUFFLE9BQU8sSUFBSSxDQUFDO1FBQ3hDLElBQUksSUFBSSxDQUFDLFNBQVM7WUFBRSxPQUFPLE1BQU0sQ0FBQztRQUNsQyxJQUFJLElBQUksQ0FBQyxLQUFLLEtBQUssQ0FBQyxJQUFJLElBQUksQ0FBQyxLQUFLLENBQUMsSUFBSSxDQUFDLEtBQUssR0FBRyxDQUFDLENBQUMsQ0FBQyxTQUFTO1lBQUUsT0FBTyxHQUFJLENBQUMsSUFBSSxFQUFFLGNBQWMsR0FBRyxJQUFJLEVBQUUsYUFBYSxHQUFHLEdBQUcsQ0FBQyxJQUFJLENBQUUsR0FBRyxDQUFDO1FBQ3JJLE9BQU8sSUFBSSxDQUFDO0lBQ2hCLENBQUM7SUFFTSxVQUFVO1FBQ2IsSUFBSSxDQUFDLE9BQU8sQ0FBQyxhQUFhLENBQUMsVUFBVSxJQUFJLEVBQUUsQ0FBQztJQUNoRCxDQUFDO0lBRU0sV0FBVztRQUNkLElBQUksQ0FBQyxPQUFPLENBQUMsYUFBYSxDQUFDLFVBQVUsSUFBSSxFQUFFLENBQUM7SUFDaEQsQ0FBQztJQUVNLFVBQVUsQ0FBQyxLQUFhO1FBQzNCLE9BQU8sSUFBSSxDQUFDLEtBQUssQ0FBQyxLQUFLLENBQUMsQ0FBQztJQUM3QixDQUFDO2tJQXBDUSxnQkFBZ0I7c0hBQWhCLGdCQUFnQixrWUFXSyxVQUFVLDZCQ3BCNUMsdzRIQXNFQTs7NEZEN0RhLGdCQUFnQjtrQkFONUIsU0FBUzsrQkFDSSxZQUFZLG1CQUdMLHVCQUF1QixDQUFDLE9BQU87OEJBSXZDLEtBQUs7c0JBQWIsS0FBSztnQkFDRyxXQUFXO3NCQUFuQixLQUFLO2dCQUNHLGlCQUFpQjtzQkFBekIsS0FBSztnQkFDRyxXQUFXO3NCQUFuQixLQUFLO2dCQUNHLFlBQVk7c0JBQXBCLEtBQUs7Z0JBQ0csUUFBUTtzQkFBaEIsS0FBSztnQkFDRyxXQUFXO3NCQUFuQixLQUFLO2dCQUNHLElBQUk7c0JBQVosS0FBSztnQkFDSSxVQUFVO3NCQUFuQixNQUFNO2dCQUM0QyxPQUFPO3NCQUF6RCxTQUFTO3VCQUFDLFNBQVMsRUFBRSxFQUFFLElBQUksRUFBRSxVQUFVLEVBQUUiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneSwgQ29tcG9uZW50LCBFbGVtZW50UmVmLCBFdmVudEVtaXR0ZXIsIElucHV0LCBPdXRwdXQsIFZpZXdDaGlsZCB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHsgU3RlcCB9IGZyb20gJy4vaW50ZXJmYWNlcy9zdGVwcGVyJztcblxuQENvbXBvbmVudCh7XG4gICAgc2VsZWN0b3I6ICdkci1zdGVwcGVyJyxcbiAgICB0ZW1wbGF0ZVVybDogJy4vc3RlcHBlci5jb21wb25lbnQuaHRtbCcsXG4gICAgc3R5bGVVcmxzOiBbJy4vc3RlcHBlci5jb21wb25lbnQuc2NzcyddLFxuICAgIGNoYW5nZURldGVjdGlvbjogQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3kuRGVmYXVsdFxufSlcbmV4cG9ydCBjbGFzcyBTdGVwcGVyQ29tcG9uZW50PFQgZXh0ZW5kcyBTdGVwPiB7XG5cbiAgICBASW5wdXQoKSBzdGVwczogVFtdO1xuICAgIEBJbnB1dCgpIGN1cnJlbnRTdGVwOiBUO1xuICAgIEBJbnB1dCgpIHdpdGhvdXRDb25uZWN0b3JzID0gZmFsc2U7XG4gICAgQElucHV0KCkgaGlkZGVuTmFtZXMgPSBmYWxzZTtcbiAgICBASW5wdXQoKSBpbmxpbmVMYWJlbHMgPSBmYWxzZTtcbiAgICBASW5wdXQoKSBkaXNhYmxlZCA9IGZhbHNlO1xuICAgIEBJbnB1dCgpIGhpZGRlbkluZGV4ID0gZmFsc2U7XG4gICAgQElucHV0KCkgbWluaSA9IGZhbHNlO1xuICAgIEBPdXRwdXQoKSBzdGVwQ2hhbmdlOiBFdmVudEVtaXR0ZXI8VD4gPSBuZXcgRXZlbnRFbWl0dGVyPFQ+KCk7XG4gICAgQFZpZXdDaGlsZCgnc3RlcHBlcicsIHsgcmVhZDogRWxlbWVudFJlZiB9KSBwdWJsaWMgc3RlcHBlcjogRWxlbWVudFJlZjxIVE1MRWxlbWVudD47XG5cbiAgICBzZWxlY3RTdGVwKHN0ZXA6IFQpOiB2b2lkIHtcbiAgICAgICAgaWYgKHN0ZXAgIT09IHRoaXMuY3VycmVudFN0ZXAgJiYgIXRoaXMuZGlzYWJsZWQpIHtcbiAgICAgICAgICAgIHRoaXMuc3RlcENoYW5nZS5lbWl0KHN0ZXApO1xuICAgICAgICB9XG4gICAgfVxuXG4gICAgZ2V0V2lkdGgoc3RlcDogVCk6IHN0cmluZyB7XG4gICAgICAgIGlmICh0aGlzLndpdGhvdXRDb25uZWN0b3JzKSByZXR1cm4gJzAlJztcbiAgICAgICAgaWYgKHN0ZXAuY29tcGxldGVkKSByZXR1cm4gJzEwMCUnO1xuICAgICAgICBpZiAoc3RlcC5pbmRleCA9PT0gMCB8fCB0aGlzLnN0ZXBzW3N0ZXAuaW5kZXggLSAxXS5jb21wbGV0ZWQpIHJldHVybiBgJHsgKHN0ZXA/LmNvbXBsZXRlZFRhc2tzIC8gc3RlcD8ucmVxdWlyZWRUYXNrcyAqIDEwMCkgfHwgMCB9JWA7XG4gICAgICAgIHJldHVybiAnMCUnO1xuICAgIH1cblxuICAgIHB1YmxpYyBzY3JvbGxMZWZ0KCk6IHZvaWQge1xuICAgICAgICB0aGlzLnN0ZXBwZXIubmF0aXZlRWxlbWVudC5zY3JvbGxMZWZ0IC09IDgwO1xuICAgIH1cblxuICAgIHB1YmxpYyBzY3JvbGxSaWdodCgpOiB2b2lkIHtcbiAgICAgICAgdGhpcy5zdGVwcGVyLm5hdGl2ZUVsZW1lbnQuc2Nyb2xsTGVmdCArPSA4MDtcbiAgICB9XG5cbiAgICBwdWJsaWMgcm91bmRXaWR0aCh3aWR0aDogbnVtYmVyKTogbnVtYmVyIHtcbiAgICAgICAgcmV0dXJuIE1hdGgucm91bmQod2lkdGgpO1xuICAgIH1cbn1cbiIsIjxkaXYgY2xhc3M9XCJzY3JvbGwtc2VjdGlvblwiICpuZ0lmPVwic3RlcHBlcj8uc2Nyb2xsTGVmdCAhPT0gMFwiIChjbGljayk9XCJzY3JvbGxMZWZ0KClcIj5cbiAgICA8aSBjbGFzcz1cImRyLWljb24tYXJyb3ctcmlnaHRcIj48L2k+XG48L2Rpdj5cbjxkaXYgI3N0ZXBwZXJcbiAgICAgY2xhc3M9XCJzdGVwcGVyXCJcbiAgICAgW2NsYXNzLnN0ZXBwZXItLWRpc2FibGVkXT1cImRpc2FibGVkXCJcbiAgICAgW2NsYXNzLnN0ZXBwZXItLW1pbmldPVwibWluaVwiPlxuICAgIDxuZy1jb250YWluZXIgKm5nRm9yPVwibGV0IHN0ZXAgb2Ygc3RlcHM7IGxldCBpbmRleCA9IGluZGV4OyBsYXN0IGFzIGlzTGFzdDsgZmlyc3QgYXMgaXNGaXJzdFwiPlxuICAgICAgICA8ZGl2ICpuZ0lmPVwiIXN0ZXAuaGlkZVwiIGNsYXNzPVwic3RlcFwiIChjbGljayk9XCJzZWxlY3RTdGVwKHN0ZXApXCJcbiAgICAgICAgICAgICBbY2xhc3Muc3RlcC1zZXR1cF09XCJpbmxpbmVMYWJlbHNcIj5cbiAgICAgICAgICAgIDxkaXYgY2xhc3M9XCJzdGVwLXdyYXBwZXJcIiBbZHJUb29sdGlwXT1cInN0ZXAuZGVzY3JpcHRpb24gJiYgdG9vbHRpcFwiXG4gICAgICAgICAgICAgICAgIFtkclRvb2x0aXBDb250ZXh0XT1cInsgc3RlcDogc3RlcCB9XCJcbiAgICAgICAgICAgICAgICAgW2RyVG9vbHRpcFBvc2l0aW9uXT1cIidib3R0b20nXCI+XG4gICAgICAgICAgICAgICAgPGRpdiBkYXRhLXRlc3Q9XCJzdGVwX3BvaW50XCIgY2xhc3M9XCJzdGVwLXBvaW50XCIgW2NsYXNzLmFjdGl2ZV09XCJjdXJyZW50U3RlcCA9PT0gc3RlcFwiIFtjbGFzcy5jb21wbGV0ZWRdPVwic3RlcC5jb21wbGV0ZWRcIj5cbiAgICAgICAgICAgICAgICAgICAgPGRpdiAqbmdJZj1cInN0ZXAgPT09IGN1cnJlbnRTdGVwO1wiIGNsYXNzPVwiZWxsaXBzZVwiPjwvZGl2PlxuICAgICAgICAgICAgICAgICAgICA8bmctY29udGFpbmVyIFtuZ1N3aXRjaF09XCJzdGVwLmNvbXBsZXRlZFwiPlxuICAgICAgICAgICAgICAgICAgICAgICAgPG5nLXRlbXBsYXRlIFtuZ1N3aXRjaENhc2VdPVwidHJ1ZVwiPlxuICAgICAgICAgICAgICAgICAgICAgICAgICAgIDxkaXYgY2xhc3M9XCJwb2ludGVyIGJsdWVcIj5cbiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgPGkgY2xhc3M9XCJkci1pY29uLWFwcHJvdmVcIj48L2k+XG4gICAgICAgICAgICAgICAgICAgICAgICAgICAgPC9kaXY+XG4gICAgICAgICAgICAgICAgICAgICAgICA8L25nLXRlbXBsYXRlPlxuICAgICAgICAgICAgICAgICAgICAgICAgPG5nLXRlbXBsYXRlIFtuZ1N3aXRjaENhc2VdPVwiZmFsc2VcIj5cbiAgICAgICAgICAgICAgICAgICAgICAgICAgICA8ZGl2IGNsYXNzPVwicG9pbnRlclwiIFtjbGFzcy5ncmF5XT1cInN0ZXAgIT09IGN1cnJlbnRTdGVwXCJcbiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIFtuZ0NsYXNzXT1cInsnYmx1ZSB3aXRoLWVsbGlwc2UnOiBzdGVwID09PSBjdXJyZW50U3RlcH1cIj5cbiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgPGRpdiBbaGlkZGVuXT1cInN0ZXAgPT09IGN1cnJlbnRTdGVwIHx8IGhpZGRlbkluZGV4XCIgY2xhc3M9XCJ0ZXh0XCI+e3tpbmRleCArIDF9fTwvZGl2PlxuICAgICAgICAgICAgICAgICAgICAgICAgICAgIDwvZGl2PlxuICAgICAgICAgICAgICAgICAgICAgICAgPC9uZy10ZW1wbGF0ZT5cbiAgICAgICAgICAgICAgICAgICAgPC9uZy1jb250YWluZXI+XG4gICAgICAgICAgICAgICAgPC9kaXY+XG4gICAgICAgICAgICAgICAgPGRpdiBkYXRhLXRlc3Q9XCJzdGVwX2xhYmVsX25hbWVcIiBjbGFzcz1cInN0ZXAtbGFiZWxcIiBbY2xhc3MuYWN0aXZlXT1cImN1cnJlbnRTdGVwID09PSBzdGVwXCJcbiAgICAgICAgICAgICAgICAgICAgIFtuZ0NsYXNzXT1cInN0ZXAuY29tcGxldGVkID8gJ2NvbXBsZXRlZCcgOiAndW5jb21wbGV0ZWQnXCI+XG4gICAgICAgICAgICAgICAgICAgIDxzcGFuIFtoaWRkZW5dPVwiaGlkZGVuTmFtZXNcIj57e3N0ZXAubmFtZX19PC9zcGFuPlxuICAgICAgICAgICAgICAgIDwvZGl2PlxuICAgICAgICAgICAgICAgIDxuZy1jb250YWluZXIgKm5nSWY9XCJpbmxpbmVMYWJlbHNcIiBbbmdUZW1wbGF0ZU91dGxldF09XCJjb25uZWN0b3JcIlxuICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgW25nVGVtcGxhdGVPdXRsZXRDb250ZXh0XT1cInsgaW5kZXgsIGlzTGFzdCwgc3RlcCB9XCI+XG4gICAgICAgICAgICAgICAgPC9uZy1jb250YWluZXI+XG4gICAgICAgICAgICAgICAgPHNwYW4gKm5nSWY9XCJzdGVwLnNob3dQcm9ncmVzc1wiXG4gICAgICAgICAgICAgICAgICAgICAgZGF0YS10ZXN0PVwic3RlcF9wcm9ncmVzc1wiXG4gICAgICAgICAgICAgICAgICAgICAgY2xhc3M9XCJzdGVwLXByb2dyZXNzXCI+XG4gICAgICAgICAgICAgICAgICAgIHt7KHN0ZXAucmVxdWlyZWRUYXNrcyA/IHN0ZXAuY29tcGxldGVkVGFza3MgOiBzdGVwLnJlcXVpcmVkVGFza3MpICsgJy8nICsgc3RlcC5yZXF1aXJlZFRhc2tzfX1cbiAgICAgICAgICAgICAgICA8L3NwYW4+XG4gICAgICAgICAgICA8L2Rpdj5cbiAgICAgICAgICAgIDxuZy1jb250YWluZXIgKm5nSWY9XCIhaW5saW5lTGFiZWxzXCIgW25nVGVtcGxhdGVPdXRsZXRdPVwiY29ubmVjdG9yXCJcbiAgICAgICAgICAgICAgICAgICAgICAgICAgW25nVGVtcGxhdGVPdXRsZXRDb250ZXh0XT1cInsgaW5kZXgsIGlzTGFzdCwgc3RlcCB9XCI+XG4gICAgICAgICAgICA8L25nLWNvbnRhaW5lcj5cbiAgICAgICAgPC9kaXY+XG4gICAgICAgIDxkaXYgKm5nSWY9XCJtaW5pXCIgY2xhc3M9XCJzdGVwcGVyLS1taW5pLWNvbm5lY3RvclwiPjwvZGl2PlxuICAgIDwvbmctY29udGFpbmVyPlxuPC9kaXY+XG48ZGl2IChjbGljayk9XCJzY3JvbGxSaWdodCgpXCIgY2xhc3M9XCJzY3JvbGwtc2VjdGlvblwiXG4gICAgICpuZ0lmPVwic3RlcHBlcj8uc2Nyb2xsV2lkdGggPiBzdGVwcGVyPy5jbGllbnRXaWR0aCAmJiByb3VuZFdpZHRoKHN0ZXBwZXI/LnNjcm9sbExlZnQgKyBzdGVwcGVyPy5jbGllbnRXaWR0aCkgPCBzdGVwcGVyPy5zY3JvbGxXaWR0aFwiPlxuICAgIDxpIGNsYXNzPVwiZHItaWNvbi1hcnJvdy1yaWdodFwiPjwvaT5cbjwvZGl2PlxuXG48bmctdGVtcGxhdGUgI3Rvb2x0aXAgbGV0LXN0ZXA9XCJzdGVwXCI+XG4gICAgPGRpdiBjbGFzcz1cInN0ZXAtdG9vbHRpcFwiPlxuICAgICAgICA8ZGl2IGNsYXNzPVwic3RlcC10b29sdGlwX25hbWVcIj57e3N0ZXAubmFtZX19PC9kaXY+XG4gICAgICAgIDxkaXYgY2xhc3M9XCJzdGVwLXRvb2x0aXBfZGVzY3JpcHRpb25cIj57e3N0ZXAuZGVzY3JpcHRpb259fTwvZGl2PlxuICAgIDwvZGl2PlxuPC9uZy10ZW1wbGF0ZT5cblxuPG5nLXRlbXBsYXRlICNjb25uZWN0b3IgbGV0LXN0ZXA9XCJzdGVwXCIgbGV0LWlzTGFzdD1cImlzTGFzdFwiIGxldC1pbmRleD1cImluZGV4XCI+XG4gICAgPGRpdiBjbGFzcz1cInN0ZXAtY29ubmVjdG9yXCIgW2NsYXNzLm9ubHktb25lLXN0ZXBdPVwic3RlcHMubGVuZ3RoID09PSAxXCJcbiAgICAgICAgIFtjbGFzc109XCInc3RlcC1jb25uZWN0b3ItLScgKyAoIWlubGluZUxhYmVscyA/ICdhYnNvbHV0ZScgOiAnaW5saW5lJylcIlxuICAgICAgICAgKm5nSWY9XCJzdGVwcy5sZW5ndGggPT09IDEgfHwgIWlzTGFzdFwiXG4gICAgICAgICBbc3R5bGUudmlzaWJpbGl0eV09XCJ3aXRob3V0Q29ubmVjdG9ycyB8fCBzdGVwc1tzdGVwLmluZGV4ICsgMV0/LmhpZGUgPyAnaGlkZGVuJyA6ICd1bnNldCdcIlxuICAgICAgICAgW2NsYXNzLmNvbm5lY3Rvci1ncmFuZF09XCIhaW5saW5lTGFiZWxzICYmIChpbmRleCA9PT0gMCB8fCBpbmRleCA9PT0gc3RlcHMubGVuZ3RoIC0gMilcIj5cbiAgICAgICAgPGRpdiBjbGFzcz1cInByb2dyZXNzXCIgW3N0eWxlLndpZHRoXT1cImdldFdpZHRoKHN0ZXApXCI+PC9kaXY+XG4gICAgPC9kaXY+XG48L25nLXRlbXBsYXRlPlxuIl19
|