@energycap/components 0.39.27-ECAP-26357-spinner-theme.20240927-1408 → 0.39.27-ECAP-26661-delete-site-updates-product-aware-confirm.20240930-1521
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/esm2020/lib/display/confirm/confirm.component.mjs +37 -4
- package/esm2020/lib/display/spinner/spinner.component.mjs +2 -2
- package/fesm2015/energycap-components.mjs +36 -4
- package/fesm2015/energycap-components.mjs.map +1 -1
- package/fesm2020/energycap-components.mjs +34 -4
- package/fesm2020/energycap-components.mjs.map +1 -1
- package/lib/display/confirm/confirm.component.d.ts +19 -2
- package/package.json +1 -1
- package/src/styles/mixins/_spinner-base.scss +1 -1
@@ -2621,10 +2621,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImpor
|
|
2621
2621
|
class SpinnerComponent {
|
2622
2622
|
}
|
2623
2623
|
SpinnerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SpinnerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
2624
|
-
SpinnerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: SpinnerComponent, selector: "ec-spinner", ngImport: i0, template: "<div class=\"spinner\">\r\n <span class=\"spinner-dot\"></span>\r\n <span class=\"spinner-dot\"></span>\r\n <span class=\"spinner-dot\"></span>\r\n <span class=\"spinner-dot\"></span>\r\n</div>", styles: ["@keyframes sk-bouncedelay{0%,80%,to{opacity:0}40%{opacity:1}}.spinner{display:flex}.spinner-dot{width:.75rem;height:.75rem;background-color:var(--ec-
|
2624
|
+
SpinnerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: SpinnerComponent, selector: "ec-spinner", ngImport: i0, template: "<div class=\"spinner\">\r\n <span class=\"spinner-dot\"></span>\r\n <span class=\"spinner-dot\"></span>\r\n <span class=\"spinner-dot\"></span>\r\n <span class=\"spinner-dot\"></span>\r\n</div>", styles: ["@keyframes sk-bouncedelay{0%,80%,to{opacity:0}40%{opacity:1}}.spinner{display:flex}.spinner-dot{width:.75rem;height:.75rem;background-color:var(--ec-color-interactive);animation:sk-bouncedelay 1.7s infinite ease-in-out both;margin-right:.25rem}.spinner-dot:nth-child(1){animation-delay:-.6s}.spinner-dot:nth-child(2){animation-delay:-.4s}.spinner-dot:nth-child(3){animation-delay:-.2s}:host(.spinner-small) .spinner-dot{width:.5rem;height:.5rem;background-color:var(--ec-color-interactive);animation:sk-bouncedelay 1.7s infinite ease-in-out both;margin-right:.1666666667rem}:host(.spinner-small) .spinner-dot:nth-child(1){animation-delay:-.6s}:host(.spinner-small) .spinner-dot:nth-child(2){animation-delay:-.4s}:host(.spinner-small) .spinner-dot:nth-child(3){animation-delay:-.2s}\n"] });
|
2625
2625
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SpinnerComponent, decorators: [{
|
2626
2626
|
type: Component,
|
2627
|
-
args: [{ selector: 'ec-spinner', template: "<div class=\"spinner\">\r\n <span class=\"spinner-dot\"></span>\r\n <span class=\"spinner-dot\"></span>\r\n <span class=\"spinner-dot\"></span>\r\n <span class=\"spinner-dot\"></span>\r\n</div>", styles: ["@keyframes sk-bouncedelay{0%,80%,to{opacity:0}40%{opacity:1}}.spinner{display:flex}.spinner-dot{width:.75rem;height:.75rem;background-color:var(--ec-
|
2627
|
+
args: [{ selector: 'ec-spinner', template: "<div class=\"spinner\">\r\n <span class=\"spinner-dot\"></span>\r\n <span class=\"spinner-dot\"></span>\r\n <span class=\"spinner-dot\"></span>\r\n <span class=\"spinner-dot\"></span>\r\n</div>", styles: ["@keyframes sk-bouncedelay{0%,80%,to{opacity:0}40%{opacity:1}}.spinner{display:flex}.spinner-dot{width:.75rem;height:.75rem;background-color:var(--ec-color-interactive);animation:sk-bouncedelay 1.7s infinite ease-in-out both;margin-right:.25rem}.spinner-dot:nth-child(1){animation-delay:-.6s}.spinner-dot:nth-child(2){animation-delay:-.4s}.spinner-dot:nth-child(3){animation-delay:-.2s}:host(.spinner-small) .spinner-dot{width:.5rem;height:.5rem;background-color:var(--ec-color-interactive);animation:sk-bouncedelay 1.7s infinite ease-in-out both;margin-right:.1666666667rem}:host(.spinner-small) .spinner-dot:nth-child(1){animation-delay:-.6s}:host(.spinner-small) .spinner-dot:nth-child(2){animation-delay:-.4s}:host(.spinner-small) .spinner-dot:nth-child(3){animation-delay:-.2s}\n"] }]
|
2628
2628
|
}] });
|
2629
2629
|
|
2630
2630
|
class Overlay {
|
@@ -5189,11 +5189,15 @@ class ConfirmComponent {
|
|
5189
5189
|
/** Form Group to hold any form controls needed */
|
5190
5190
|
this.formGroup = new UntypedFormGroup({});
|
5191
5191
|
this.status = new Overlay('hasData');
|
5192
|
+
this.showTextBox = true;
|
5193
|
+
this.destroyed = new Subject();
|
5192
5194
|
this.onDialogSave = new EventEmitter();
|
5193
5195
|
this.onDialogCancel = new EventEmitter();
|
5194
5196
|
}
|
5195
5197
|
ngOnInit() {
|
5196
5198
|
this.addFormControls();
|
5199
|
+
this.setValidations();
|
5200
|
+
this.listenCheckBox();
|
5197
5201
|
}
|
5198
5202
|
onSave(source) {
|
5199
5203
|
this.formGroup.markAllAsTouched();
|
@@ -5202,6 +5206,9 @@ class ConfirmComponent {
|
|
5202
5206
|
if (formValues.textbox) {
|
5203
5207
|
this.context.textboxValue = formValues.textbox;
|
5204
5208
|
}
|
5209
|
+
if (this.context.checkConfirm) {
|
5210
|
+
this.context.checkboxValue = formValues.checkbox ? formValues.checkbox : false;
|
5211
|
+
}
|
5205
5212
|
this.context.saveSource = source;
|
5206
5213
|
if (this.context.inlineConfirmAction) {
|
5207
5214
|
this.doInlineConfirmAction();
|
@@ -5217,6 +5224,24 @@ class ConfirmComponent {
|
|
5217
5224
|
onCancel() {
|
5218
5225
|
this.onDialogCancel.emit();
|
5219
5226
|
}
|
5227
|
+
ngOnDestroy() {
|
5228
|
+
this.destroyed.next();
|
5229
|
+
this.destroyed.complete();
|
5230
|
+
}
|
5231
|
+
listenCheckBox() {
|
5232
|
+
this.formGroup.get('checkbox')?.valueChanges.pipe(takeUntil(this.destroyed)).subscribe(value => {
|
5233
|
+
this.showTextBox = value;
|
5234
|
+
this.setValidations();
|
5235
|
+
});
|
5236
|
+
}
|
5237
|
+
setValidations() {
|
5238
|
+
if (this.showTextBox) {
|
5239
|
+
this.formGroup.controls['textbox']?.enable();
|
5240
|
+
}
|
5241
|
+
else {
|
5242
|
+
this.formGroup.controls['textbox']?.disable();
|
5243
|
+
}
|
5244
|
+
}
|
5220
5245
|
/**
|
5221
5246
|
* Adds the textbox form control to our form group if its configured to be visible
|
5222
5247
|
* Will also add the required validator if requested
|
@@ -5232,6 +5257,11 @@ class ConfirmComponent {
|
|
5232
5257
|
}
|
5233
5258
|
this.formGroup.addControl('textbox', new UntypedFormControl('', validators));
|
5234
5259
|
}
|
5260
|
+
if (this.context.checkConfirm) {
|
5261
|
+
this.showTextBox = false;
|
5262
|
+
const checkboxControl = new UntypedFormControl('');
|
5263
|
+
this.formGroup.addControl('checkbox', checkboxControl);
|
5264
|
+
}
|
5235
5265
|
}
|
5236
5266
|
async doInlineConfirmAction() {
|
5237
5267
|
this.status.setStatus('pending', this.context.inlineConfirmPendingMessage);
|
@@ -5246,10 +5276,10 @@ class ConfirmComponent {
|
|
5246
5276
|
}
|
5247
5277
|
}
|
5248
5278
|
ConfirmComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: ConfirmComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
5249
|
-
ConfirmComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: ConfirmComponent, selector: "ec-confirm", inputs: { context: "context" }, outputs: { onDialogSave: "onDialogSave", onDialogCancel: "onDialogCancel" }, ngImport: i0, template: "<section ecOverlay\r\n [status]=\"status?.status\"\r\n [message]=\"status?.message\"\r\n [action]=\"status?.action\"\r\n [noDataTemplate]=\"inlineConfirmResult\"\r\n overlayClassList=\"p-0\"\r\n class=\"bg-body flex-grow d-flex\">\r\n <form [formGroup]=\"formGroup\" class=\"flex-grow flex-column confirm-content text-body-1\">\r\n <section class=\"flex-grow\">\r\n <h2 class=\"font-weight-bold mb-3\" *ngIf=\"context?.title\">{{context?.title}}</h2>\r\n <ec-banner *ngIf=\"error\" [text]=\"error | translate\" bannerStyle=\"normal\" class=\"mb-3\"></ec-banner>\r\n <div *ngIf=\"context?.message\" [innerHtml]=\"context?.message | translate\" class=\"mb-3\"></div>\r\n <ec-textbox id=\"confirmTextbox\"\r\n *ngIf=\"context?.textboxType\"\r\n [autofocus]=\"true\"\r\n [formModel]=\"formGroup.get('textbox')\"\r\n [required]=\"context?.textboxRequired\"\r\n [label]=\"context?.textboxLabel\"\r\n [type]=\"context?.textboxType\"\r\n [rows]=\"context?.textareaRows\"\r\n [placeholder]=\"context?.textboxPlaceholder\"\r\n [upperCase]=\"context?.textboxUppercase\">\r\n </ec-textbox>\r\n </section>\r\n <footer class=\"mt-auto flex-shrink d-flex py-2 flex-row-reverse\">\r\n <ec-button id=\"saveConfirmButton\"\r\n class=\"ml-2\"\r\n [type]=\"context?.saveButtonType ? context?.saveButtonType : 'primary'\"\r\n [label]=\"context?.saveLabel ? context?.saveLabel : 'Save'\"\r\n [autofocus]=\"!context?.textboxType\"\r\n [isSubmit]=\"context?.saveOnEnter\"\r\n (clicked)=\"onSave('primary')\">\r\n </ec-button>\r\n <ec-button id=\"alternateSaveConfirmButton\"\r\n *ngIf=\"context?.alternateSaveLabel\"\r\n class=\"ml-2\"\r\n [type]=\"context?.alternateSaveButtonType ? context?.alternateSaveButtonType : 'primary'\"\r\n [label]=\"context?.alternateSaveLabel\"\r\n (clicked)=\"onSave('alternate')\">\r\n </ec-button>\r\n <ec-button *ngIf=\"!context?.hideCancel\"\r\n id=\"cancelConfirmButton\"\r\n class=\"ml-auto\"\r\n type=\"secondary\"\r\n [label]=\"context?.cancelLabel ? context?.cancelLabel : 'Cancel'\"\r\n (clicked)=\"onCancel()\">\r\n </ec-button>\r\n </footer>\r\n </form>\r\n</section>\r\n\r\n<ng-template #inlineConfirmResult>\r\n <section class=\"flex-grow align-self-stretch confirm-content text-body-1\">\r\n <div class=\"d-flex\">\r\n <i class=\"ec-icon {{status?.action?.icon}} {{status?.action?.classlist}} inline-confirm-result-icon\"></i>\r\n <div [innerHTML]=\"status?.message | translate\"></div>\r\n </div>\r\n <div class=\"d-flex pt-2 mt-auto\">\r\n <ec-button id=\"inlineConfirmClose\"\r\n label=\"Close\"\r\n type=\"secondary\"\r\n class=\"ml-auto\"\r\n (clicked)=\"status?.action?.onClick!()\"\r\n [autofocus]=\"true\">\r\n </ec-button>\r\n </div>\r\n </section>\r\n</ng-template>", styles: [":host{width:100%;display:flex}.confirm-content{padding:1.5rem;display:flex;flex-direction:column}.inline-confirm-result-icon{margin:.0625rem .25rem .0625rem 0}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i4.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i4.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "component", type: ButtonComponent, selector: "ec-button", inputs: ["id", "disabled", "icon", "label", "badge", "tabindex", "type", "pending", "pendingIcon", "customTemplate", "isSubmit", "autofocus"], outputs: ["clicked"] }, { kind: "component", type: TextboxComponent, selector: "ec-textbox", inputs: ["autocomplete", "type", "placeholder", "maxlength", "minlength", "rows", "selectOnAutofocus", "upperCase"] }, { kind: "component", type: ViewOverlayComponent, selector: "[ecOverlay]", inputs: ["status", "message", "action", "noDataTemplate", "displayAsMask", "overlayClassList"] }, { kind: "component", type: BannerComponent, selector: "ec-banner", inputs: ["hidden", "id", "type", "bannerStyle", "title", "text", "list", "showCloseBtn", "autoHideOnClose", "customIcon", "rememberClosed"], outputs: ["closed"] }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }] });
|
5279
|
+
ConfirmComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: ConfirmComponent, selector: "ec-confirm", inputs: { context: "context" }, outputs: { onDialogSave: "onDialogSave", onDialogCancel: "onDialogCancel" }, ngImport: i0, template: "<section ecOverlay\r\n [status]=\"status?.status\"\r\n [message]=\"status?.message\"\r\n [action]=\"status?.action\"\r\n [noDataTemplate]=\"inlineConfirmResult\"\r\n overlayClassList=\"p-0\"\r\n class=\"bg-body flex-grow d-flex\">\r\n <form [formGroup]=\"formGroup\" class=\"flex-grow flex-column confirm-content text-body-1\">\r\n <section class=\"flex-grow\">\r\n <h2 class=\"font-weight-bold mb-3\" *ngIf=\"context?.title\">{{context?.title}}</h2>\r\n <ec-banner *ngIf=\"error\" [text]=\"error | translate\" bannerStyle=\"normal\" class=\"mb-3\"></ec-banner>\r\n <div *ngIf=\"context?.message\" [innerHtml]=\"context?.message | translate\" class=\"mb-3\"></div>\r\n <ec-checkbox *ngIf=\"context?.checkConfirm\"\r\n [formModel]=\"formGroup.get('checkbox')\"\r\n name=\"confirmCheckbox\"\r\n [label]=\"context?.checkboxText\"\r\n [autofocus]=\"true\"\r\n ></ec-checkbox>\r\n <ec-textbox id=\"confirmTextbox\"\r\n *ngIf=\"(context?.textboxType && !context?.checkConfirm) || showTextBox\"\r\n [autofocus]=\"true\"\r\n [formModel]=\"formGroup.get('textbox')\"\r\n [required]=\"context?.textboxRequired\"\r\n [label]=\"context?.textboxLabel\"\r\n [type]=\"context?.textboxType\"\r\n [rows]=\"context?.textareaRows\"\r\n [placeholder]=\"context?.textboxPlaceholder\"\r\n [upperCase]=\"context?.textboxUppercase\">\r\n </ec-textbox>\r\n </section>\r\n <footer class=\"mt-auto flex-shrink d-flex py-2 flex-row-reverse\">\r\n <ec-button id=\"saveConfirmButton\"\r\n class=\"ml-2\"\r\n [type]=\"context?.saveButtonType ? context?.saveButtonType : 'primary'\"\r\n [label]=\"context?.saveLabel ? context?.saveLabel : 'Save'\"\r\n [autofocus]=\"!context?.textboxType\"\r\n [isSubmit]=\"context?.saveOnEnter\"\r\n (clicked)=\"onSave('primary')\">\r\n </ec-button>\r\n <ec-button id=\"alternateSaveConfirmButton\"\r\n *ngIf=\"context?.alternateSaveLabel\"\r\n class=\"ml-2\"\r\n [type]=\"context?.alternateSaveButtonType ? context?.alternateSaveButtonType : 'primary'\"\r\n [label]=\"context?.alternateSaveLabel\"\r\n (clicked)=\"onSave('alternate')\">\r\n </ec-button>\r\n <ec-button *ngIf=\"!context?.hideCancel\"\r\n id=\"cancelConfirmButton\"\r\n class=\"ml-auto\"\r\n type=\"secondary\"\r\n [label]=\"context?.cancelLabel ? context?.cancelLabel : 'Cancel'\"\r\n (clicked)=\"onCancel()\">\r\n </ec-button>\r\n </footer>\r\n </form>\r\n</section>\r\n\r\n<ng-template #inlineConfirmResult>\r\n <section class=\"flex-grow align-self-stretch confirm-content text-body-1\">\r\n <div class=\"d-flex\">\r\n <i class=\"ec-icon {{status?.action?.icon}} {{status?.action?.classlist}} inline-confirm-result-icon\"></i>\r\n <div [innerHTML]=\"status?.message | translate\"></div>\r\n </div>\r\n <div class=\"d-flex pt-2 mt-auto\">\r\n <ec-button id=\"inlineConfirmClose\"\r\n label=\"Close\"\r\n type=\"secondary\"\r\n class=\"ml-auto\"\r\n (clicked)=\"status?.action?.onClick!()\"\r\n [autofocus]=\"true\">\r\n </ec-button>\r\n </div>\r\n </section>\r\n</ng-template>", styles: [":host{width:100%;display:flex}.confirm-content{padding:1.5rem;display:flex;flex-direction:column}.inline-confirm-result-icon{margin:.0625rem .25rem .0625rem 0}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i4.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i4.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "component", type: ButtonComponent, selector: "ec-button", inputs: ["id", "disabled", "icon", "label", "badge", "tabindex", "type", "pending", "pendingIcon", "customTemplate", "isSubmit", "autofocus"], outputs: ["clicked"] }, { kind: "component", type: TextboxComponent, selector: "ec-textbox", inputs: ["autocomplete", "type", "placeholder", "maxlength", "minlength", "rows", "selectOnAutofocus", "upperCase"] }, { kind: "component", type: ViewOverlayComponent, selector: "[ecOverlay]", inputs: ["status", "message", "action", "noDataTemplate", "displayAsMask", "overlayClassList"] }, { kind: "component", type: BannerComponent, selector: "ec-banner", inputs: ["hidden", "id", "type", "bannerStyle", "title", "text", "list", "showCloseBtn", "autoHideOnClose", "customIcon", "rememberClosed"], outputs: ["closed"] }, { kind: "component", type: CheckboxComponent, selector: "ec-checkbox", inputs: ["name", "dependentCheckboxesGroup", "ignoreDisabledDependents"] }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }] });
|
5250
5280
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: ConfirmComponent, decorators: [{
|
5251
5281
|
type: Component,
|
5252
|
-
args: [{ selector: 'ec-confirm', template: "<section ecOverlay\r\n [status]=\"status?.status\"\r\n [message]=\"status?.message\"\r\n [action]=\"status?.action\"\r\n [noDataTemplate]=\"inlineConfirmResult\"\r\n overlayClassList=\"p-0\"\r\n class=\"bg-body flex-grow d-flex\">\r\n <form [formGroup]=\"formGroup\" class=\"flex-grow flex-column confirm-content text-body-1\">\r\n <section class=\"flex-grow\">\r\n <h2 class=\"font-weight-bold mb-3\" *ngIf=\"context?.title\">{{context?.title}}</h2>\r\n <ec-banner *ngIf=\"error\" [text]=\"error | translate\" bannerStyle=\"normal\" class=\"mb-3\"></ec-banner>\r\n <div *ngIf=\"context?.message\" [innerHtml]=\"context?.message | translate\" class=\"mb-3\"></div>\r\n <ec-textbox id=\"confirmTextbox\"\r\n *ngIf=\"context?.textboxType\"\r\n [autofocus]=\"true\"\r\n [formModel]=\"formGroup.get('textbox')\"\r\n [required]=\"context?.textboxRequired\"\r\n [label]=\"context?.textboxLabel\"\r\n [type]=\"context?.textboxType\"\r\n [rows]=\"context?.textareaRows\"\r\n [placeholder]=\"context?.textboxPlaceholder\"\r\n [upperCase]=\"context?.textboxUppercase\">\r\n </ec-textbox>\r\n </section>\r\n <footer class=\"mt-auto flex-shrink d-flex py-2 flex-row-reverse\">\r\n <ec-button id=\"saveConfirmButton\"\r\n class=\"ml-2\"\r\n [type]=\"context?.saveButtonType ? context?.saveButtonType : 'primary'\"\r\n [label]=\"context?.saveLabel ? context?.saveLabel : 'Save'\"\r\n [autofocus]=\"!context?.textboxType\"\r\n [isSubmit]=\"context?.saveOnEnter\"\r\n (clicked)=\"onSave('primary')\">\r\n </ec-button>\r\n <ec-button id=\"alternateSaveConfirmButton\"\r\n *ngIf=\"context?.alternateSaveLabel\"\r\n class=\"ml-2\"\r\n [type]=\"context?.alternateSaveButtonType ? context?.alternateSaveButtonType : 'primary'\"\r\n [label]=\"context?.alternateSaveLabel\"\r\n (clicked)=\"onSave('alternate')\">\r\n </ec-button>\r\n <ec-button *ngIf=\"!context?.hideCancel\"\r\n id=\"cancelConfirmButton\"\r\n class=\"ml-auto\"\r\n type=\"secondary\"\r\n [label]=\"context?.cancelLabel ? context?.cancelLabel : 'Cancel'\"\r\n (clicked)=\"onCancel()\">\r\n </ec-button>\r\n </footer>\r\n </form>\r\n</section>\r\n\r\n<ng-template #inlineConfirmResult>\r\n <section class=\"flex-grow align-self-stretch confirm-content text-body-1\">\r\n <div class=\"d-flex\">\r\n <i class=\"ec-icon {{status?.action?.icon}} {{status?.action?.classlist}} inline-confirm-result-icon\"></i>\r\n <div [innerHTML]=\"status?.message | translate\"></div>\r\n </div>\r\n <div class=\"d-flex pt-2 mt-auto\">\r\n <ec-button id=\"inlineConfirmClose\"\r\n label=\"Close\"\r\n type=\"secondary\"\r\n class=\"ml-auto\"\r\n (clicked)=\"status?.action?.onClick!()\"\r\n [autofocus]=\"true\">\r\n </ec-button>\r\n </div>\r\n </section>\r\n</ng-template>", styles: [":host{width:100%;display:flex}.confirm-content{padding:1.5rem;display:flex;flex-direction:column}.inline-confirm-result-icon{margin:.0625rem .25rem .0625rem 0}\n"] }]
|
5282
|
+
args: [{ selector: 'ec-confirm', template: "<section ecOverlay\r\n [status]=\"status?.status\"\r\n [message]=\"status?.message\"\r\n [action]=\"status?.action\"\r\n [noDataTemplate]=\"inlineConfirmResult\"\r\n overlayClassList=\"p-0\"\r\n class=\"bg-body flex-grow d-flex\">\r\n <form [formGroup]=\"formGroup\" class=\"flex-grow flex-column confirm-content text-body-1\">\r\n <section class=\"flex-grow\">\r\n <h2 class=\"font-weight-bold mb-3\" *ngIf=\"context?.title\">{{context?.title}}</h2>\r\n <ec-banner *ngIf=\"error\" [text]=\"error | translate\" bannerStyle=\"normal\" class=\"mb-3\"></ec-banner>\r\n <div *ngIf=\"context?.message\" [innerHtml]=\"context?.message | translate\" class=\"mb-3\"></div>\r\n <ec-checkbox *ngIf=\"context?.checkConfirm\"\r\n [formModel]=\"formGroup.get('checkbox')\"\r\n name=\"confirmCheckbox\"\r\n [label]=\"context?.checkboxText\"\r\n [autofocus]=\"true\"\r\n ></ec-checkbox>\r\n <ec-textbox id=\"confirmTextbox\"\r\n *ngIf=\"(context?.textboxType && !context?.checkConfirm) || showTextBox\"\r\n [autofocus]=\"true\"\r\n [formModel]=\"formGroup.get('textbox')\"\r\n [required]=\"context?.textboxRequired\"\r\n [label]=\"context?.textboxLabel\"\r\n [type]=\"context?.textboxType\"\r\n [rows]=\"context?.textareaRows\"\r\n [placeholder]=\"context?.textboxPlaceholder\"\r\n [upperCase]=\"context?.textboxUppercase\">\r\n </ec-textbox>\r\n </section>\r\n <footer class=\"mt-auto flex-shrink d-flex py-2 flex-row-reverse\">\r\n <ec-button id=\"saveConfirmButton\"\r\n class=\"ml-2\"\r\n [type]=\"context?.saveButtonType ? context?.saveButtonType : 'primary'\"\r\n [label]=\"context?.saveLabel ? context?.saveLabel : 'Save'\"\r\n [autofocus]=\"!context?.textboxType\"\r\n [isSubmit]=\"context?.saveOnEnter\"\r\n (clicked)=\"onSave('primary')\">\r\n </ec-button>\r\n <ec-button id=\"alternateSaveConfirmButton\"\r\n *ngIf=\"context?.alternateSaveLabel\"\r\n class=\"ml-2\"\r\n [type]=\"context?.alternateSaveButtonType ? context?.alternateSaveButtonType : 'primary'\"\r\n [label]=\"context?.alternateSaveLabel\"\r\n (clicked)=\"onSave('alternate')\">\r\n </ec-button>\r\n <ec-button *ngIf=\"!context?.hideCancel\"\r\n id=\"cancelConfirmButton\"\r\n class=\"ml-auto\"\r\n type=\"secondary\"\r\n [label]=\"context?.cancelLabel ? context?.cancelLabel : 'Cancel'\"\r\n (clicked)=\"onCancel()\">\r\n </ec-button>\r\n </footer>\r\n </form>\r\n</section>\r\n\r\n<ng-template #inlineConfirmResult>\r\n <section class=\"flex-grow align-self-stretch confirm-content text-body-1\">\r\n <div class=\"d-flex\">\r\n <i class=\"ec-icon {{status?.action?.icon}} {{status?.action?.classlist}} inline-confirm-result-icon\"></i>\r\n <div [innerHTML]=\"status?.message | translate\"></div>\r\n </div>\r\n <div class=\"d-flex pt-2 mt-auto\">\r\n <ec-button id=\"inlineConfirmClose\"\r\n label=\"Close\"\r\n type=\"secondary\"\r\n class=\"ml-auto\"\r\n (clicked)=\"status?.action?.onClick!()\"\r\n [autofocus]=\"true\">\r\n </ec-button>\r\n </div>\r\n </section>\r\n</ng-template>", styles: [":host{width:100%;display:flex}.confirm-content{padding:1.5rem;display:flex;flex-direction:column}.inline-confirm-result-icon{margin:.0625rem .25rem .0625rem 0}\n"] }]
|
5253
5283
|
}], ctorParameters: function () { return []; }, propDecorators: { context: [{
|
5254
5284
|
type: Input
|
5255
5285
|
}], onDialogSave: [{
|