@energycap/components 0.39.9-schematics.20240307-1726 → 0.39.9
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/controls/combobox/combobox.component.mjs +1 -1
- package/esm2020/lib/controls/form-control/form-control.component.mjs +2 -2
- package/esm2020/lib/controls/select/select.component.mjs +2 -2
- package/esm2020/lib/display/confirm/confirm.component.mjs +5 -3
- package/esm2020/lib/shared/page/page-view/page-view.component.mjs +7 -3
- package/fesm2015/energycap-components.mjs +14 -8
- package/fesm2015/energycap-components.mjs.map +1 -1
- package/fesm2020/energycap-components.mjs +14 -8
- package/fesm2020/energycap-components.mjs.map +1 -1
- package/lib/display/confirm/confirm.component.d.ts +2 -0
- package/lib/shared/page/page-view/page-view.component.d.ts +3 -1
- package/package.json +2 -3
- package/schematics/collection.json +0 -9
- package/schematics/ng-generate/rxjs-7-upgrade/index.d.ts +0 -2
- package/schematics/ng-generate/rxjs-7-upgrade/index.js +0 -140
- package/schematics/ng-generate/rxjs-7-upgrade/index.js.map +0 -1
|
@@ -3481,10 +3481,10 @@ class FormControlComponent {
|
|
|
3481
3481
|
}
|
|
3482
3482
|
}
|
|
3483
3483
|
FormControlComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: FormControlComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
3484
|
-
FormControlComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: FormControlComponent, selector: "ec-form-control", inputs: { id: "id", icon: "icon", actionIcon: "actionIcon", showClear: "showClear", pending: "pending", required: "required", readonly: "readonly" }, outputs: { actionClicked: "actionClicked" }, host: { listeners: { "click": "onClick()" }, properties: { "class.is-pending": "this.pending", "class.is-required": "this.required", "class.is-readonly": "this.readonly", "class.is-empty": "this.empty", "class.is-invalid": "this.invalid", "class.is-disabled": "this.disabled" } }, queries: [{ propertyName: "formModel", first: true, predicate: FormControlDirective, descendants: true }], ngImport: i0, template: "<ng-content></ng-content>\r\n<i id=\"{{id + '_icon'}}\" class=\"ec-form-control-icon ec-icon {{icon}}\"></i>\r\n<i id=\"{{id + '_loading'}}\" class=\"ec-form-control-icon ec-icon icon-loading\"></i>\r\n<i id=\"{{id + '_required'}}\" class=\"ec-form-control-icon ec-icon icon-required\"></i>\r\n<i id=\"{{id + '_invalid'}}\" class=\"ec-form-control-icon ec-icon icon-invalid\"></i>\r\n<i id=\"{{id + '_clear'}}\" *ngIf=\"showClear\" class=\"ec-form-control-clear ec-icon icon-cancel\" (click)=\"clear()\"></i>\r\n<i id=\"{{id + '_action'}}\" *ngIf=\"actionIcon\" class=\"ec-form-control-action ec-icon {{actionIcon}}\" (click)=\"actionClicked.emit()\"></i>\r\n<div class=\"ec-focus-ring\"></div>", styles: ["ec-form-control{background-color:var(--ec-form-control-background-color);background-clip:padding-box;border:1px solid var(--ec-form-control-border-color);border-radius:var(--ec-border-radius);padding:0 .5rem;position:relative;color:var(--ec-form-control-color);display:flex;font-size:var(--ec-form-control-font-size);min-height:2rem;width:100%}ec-form-control>input,ec-form-control>select,ec-form-control>textarea{color:inherit;flex:1 1;min-width:0;border:0;background-color:transparent;order:2}ec-form-control>input::selection,ec-form-control>select::selection,ec-form-control>textarea::selection{background-color:var(--ec-form-control-background-color-selection);color:var(--ec-form-control-color-selection)}ec-form-control>input::-webkit-input-placeholder,ec-form-control>select::-webkit-input-placeholder,ec-form-control>textarea::-webkit-input-placeholder{color:var(--ec-form-control-color-placeholder)}ec-form-control>input::-moz-placeholder,ec-form-control>select::-moz-placeholder,ec-form-control>textarea::-moz-placeholder{color:var(--ec-form-control-color-placeholder);opacity:1}ec-form-control>input:-ms-input-placeholder,ec-form-control>select:-ms-input-placeholder,ec-form-control>textarea:-ms-input-placeholder{color:var(--ec-form-control-color-placeholder)}ec-form-control>input:-moz-placeholder,ec-form-control>select:-moz-placeholder,ec-form-control>textarea:-moz-placeholder{color:var(--ec-form-control-color-placeholder);opacity:1}ec-form-control>input:focus,ec-form-control>select:focus,ec-form-control>textarea:focus{outline:none}ec-form-control>input:focus~.ec-focus-ring,ec-form-control>select:focus~.ec-focus-ring,ec-form-control>textarea:focus~.ec-focus-ring{display:block}ec-form-control>input,ec-form-control>textarea,ec-form-control>select,ec-form-control .ec-form-control-prefix,ec-form-control .ec-form-control-suffix{padding:calc((1.875rem - var(--ec-font-size-body) * 1.25) / 2) 0;line-height:1.25;font-size:inherit}ec-form-control>textarea{resize:none;padding:.3125rem 0}ec-form-control .ec-form-control-icon{margin-top:.4375rem;margin-right:.25rem;order:1}ec-form-control .ec-form-control-icon:not([class*=icon-]){display:none}ec-form-control .icon-required,ec-form-control .icon-invalid{color:var(--ec-form-control-border-color-invalid)}ec-form-control .ec-form-control-clear,ec-form-control .ec-form-control-action{cursor:pointer;flex:none;height:1.875rem;width:2rem;order:3}ec-form-control .ec-form-control-clear:last-of-type,ec-form-control .ec-form-control-action:last-of-type{margin-right:-.5rem}ec-form-control .ec-form-control-clear:hover,ec-form-control .ec-form-control-action:hover{background-color:var(--ec-background-color-hover)}ec-form-control .ec-form-control-clear{width:1.5rem}ec-form-control .ec-form-control-prefix,ec-form-control .ec-form-control-suffix{color:var(--ec-color-secondary-dark);flex:none;cursor:default}ec-form-control .ec-form-control-prefix{margin-right:.125rem;order:2}ec-form-control .ec-form-control-suffix{margin-left:.125rem;order:3}ec-form-control .ec-focus-ring{position:absolute;inset:-1px;border:.125rem solid var(--ec-form-control-border-color-focus);pointer-events:none;display:none;border-radius:var(--ec-form-control-border-radius);z-index:1}ec-form-control.is-pending .icon-invalid,ec-form-control.is-pending .icon-required{display:none}ec-form-control.is-invalid{border-color:var(--ec-form-control-border-color-invalid);background-color:var(--ec-form-control-background-color-invalid)}ec-form-control.is-invalid .icon-required{display:none}ec-form-control.is-empty .ec-form-control-clear{display:none}ec-form-control.is-required.is-empty .ec-form-control-icon:first-of-type{display:none}ec-form-control:not(.is-pending) .icon-loading{display:none}ec-form-control:not(.is-required) .icon-required,ec-form-control:not(.is-empty) .icon-required{display:none}ec-form-control:not(.is-invalid) .icon-invalid{display:none}ec-form-control.is-readonly,ec-form-control.is-disabled{background-color:var(--ec-form-control-background-color-disabled)}ec-form-control.is-readonly .icon-loading,ec-form-control.is-readonly .icon-invalid,ec-form-control.is-readonly .icon-required,ec-form-control.is-readonly .ec-form-control-clear,ec-form-control.is-disabled .icon-loading,ec-form-control.is-disabled .icon-invalid,ec-form-control.is-disabled .icon-required,ec-form-control.is-disabled .ec-form-control-clear{display:none}ec-form-control.is-readonly{border-color:var(--ec-form-control-border-color-readonly);color:var(--ec-form-control-color-readonly)}ec-form-control.is-readonly .ec-form-control-action{display:none}ec-form-control.is-disabled:not(.is-readonly){color:var(--ec-form-control-color-disabled);opacity:.6}ec-form-control.is-disabled:not(.is-readonly) .ec-form-control-prefix,ec-form-control.is-disabled:not(.is-readonly) .ec-form-control-suffix{color:inherit}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], encapsulation: i0.ViewEncapsulation.None });
|
|
3484
|
+
FormControlComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: FormControlComponent, selector: "ec-form-control", inputs: { id: "id", icon: "icon", actionIcon: "actionIcon", showClear: "showClear", pending: "pending", required: "required", readonly: "readonly" }, outputs: { actionClicked: "actionClicked" }, host: { listeners: { "click": "onClick()" }, properties: { "class.is-pending": "this.pending", "class.is-required": "this.required", "class.is-readonly": "this.readonly", "class.is-empty": "this.empty", "class.is-invalid": "this.invalid", "class.is-disabled": "this.disabled" } }, queries: [{ propertyName: "formModel", first: true, predicate: FormControlDirective, descendants: true }], ngImport: i0, template: "<ng-content></ng-content>\r\n<i id=\"{{id + '_icon'}}\" class=\"ec-form-control-icon ec-icon {{icon}}\"></i>\r\n<i id=\"{{id + '_loading'}}\" class=\"ec-form-control-icon ec-icon icon-loading\"></i>\r\n<i id=\"{{id + '_required'}}\" class=\"ec-form-control-icon ec-icon icon-required\"></i>\r\n<i id=\"{{id + '_invalid'}}\" class=\"ec-form-control-icon ec-icon icon-invalid\"></i>\r\n<i id=\"{{id + '_clear'}}\" *ngIf=\"showClear\" class=\"ec-form-control-clear ec-icon icon-cancel\" (click)=\"clear()\"></i>\r\n<i id=\"{{id + '_action'}}\" *ngIf=\"actionIcon\" class=\"ec-form-control-action ec-icon {{actionIcon}}\" (click)=\"actionClicked.emit()\"></i>\r\n<div class=\"ec-focus-ring\"></div>", styles: ["ec-form-control{background-color:var(--ec-form-control-background-color);background-clip:padding-box;border:1px solid var(--ec-form-control-border-color);border-radius:var(--ec-border-radius);padding:0 .5rem;position:relative;color:var(--ec-form-control-color);display:flex;font-size:var(--ec-form-control-font-size);min-height:2rem;width:100%}ec-form-control>input,ec-form-control>select,ec-form-control>textarea{color:inherit;flex:1 1;min-width:0;border:0;background-color:transparent;order:2}ec-form-control>input::selection,ec-form-control>select::selection,ec-form-control>textarea::selection{background-color:var(--ec-form-control-background-color-selection);color:var(--ec-form-control-color-selection)}ec-form-control>input::-webkit-input-placeholder,ec-form-control>select::-webkit-input-placeholder,ec-form-control>textarea::-webkit-input-placeholder{color:var(--ec-form-control-color-placeholder)}ec-form-control>input::-moz-placeholder,ec-form-control>select::-moz-placeholder,ec-form-control>textarea::-moz-placeholder{color:var(--ec-form-control-color-placeholder);opacity:1}ec-form-control>input:-ms-input-placeholder,ec-form-control>select:-ms-input-placeholder,ec-form-control>textarea:-ms-input-placeholder{color:var(--ec-form-control-color-placeholder)}ec-form-control>input:-moz-placeholder,ec-form-control>select:-moz-placeholder,ec-form-control>textarea:-moz-placeholder{color:var(--ec-form-control-color-placeholder);opacity:1}ec-form-control>input:focus,ec-form-control>select:focus,ec-form-control>textarea:focus{outline:none}ec-form-control>input:focus~.ec-focus-ring,ec-form-control>select:focus~.ec-focus-ring,ec-form-control>textarea:focus~.ec-focus-ring{display:block}ec-form-control>input,ec-form-control>textarea,ec-form-control>select,ec-form-control .ec-form-control-prefix,ec-form-control .ec-form-control-suffix{padding:calc((1.875rem - (var(--ec-font-size-body) * 1.25)) / 2) 0;line-height:1.25;font-size:inherit}ec-form-control>textarea{resize:none;padding:.3125rem 0}ec-form-control .ec-form-control-icon{margin-top:.4375rem;margin-right:.25rem;order:1}ec-form-control .ec-form-control-icon:not([class*=icon-]){display:none}ec-form-control .icon-required,ec-form-control .icon-invalid{color:var(--ec-form-control-border-color-invalid)}ec-form-control .ec-form-control-clear,ec-form-control .ec-form-control-action{cursor:pointer;flex:none;height:1.875rem;width:2rem;order:3}ec-form-control .ec-form-control-clear:last-of-type,ec-form-control .ec-form-control-action:last-of-type{margin-right:-.5rem}ec-form-control .ec-form-control-clear:hover,ec-form-control .ec-form-control-action:hover{background-color:var(--ec-background-color-hover)}ec-form-control .ec-form-control-clear{width:1.5rem}ec-form-control .ec-form-control-prefix,ec-form-control .ec-form-control-suffix{color:var(--ec-color-secondary-dark);flex:none;cursor:default}ec-form-control .ec-form-control-prefix{margin-right:.125rem;order:2}ec-form-control .ec-form-control-suffix{margin-left:.125rem;order:3}ec-form-control .ec-focus-ring{position:absolute;inset:-1px;border:.125rem solid var(--ec-form-control-border-color-focus);pointer-events:none;display:none;border-radius:var(--ec-form-control-border-radius);z-index:1}ec-form-control.is-pending .icon-invalid,ec-form-control.is-pending .icon-required{display:none}ec-form-control.is-invalid{border-color:var(--ec-form-control-border-color-invalid);background-color:var(--ec-form-control-background-color-invalid)}ec-form-control.is-invalid .icon-required{display:none}ec-form-control.is-empty .ec-form-control-clear{display:none}ec-form-control.is-required.is-empty .ec-form-control-icon:first-of-type{display:none}ec-form-control:not(.is-pending) .icon-loading{display:none}ec-form-control:not(.is-required) .icon-required,ec-form-control:not(.is-empty) .icon-required{display:none}ec-form-control:not(.is-invalid) .icon-invalid{display:none}ec-form-control.is-readonly,ec-form-control.is-disabled{background-color:var(--ec-form-control-background-color-disabled)}ec-form-control.is-readonly .icon-loading,ec-form-control.is-readonly .icon-invalid,ec-form-control.is-readonly .icon-required,ec-form-control.is-readonly .ec-form-control-clear,ec-form-control.is-disabled .icon-loading,ec-form-control.is-disabled .icon-invalid,ec-form-control.is-disabled .icon-required,ec-form-control.is-disabled .ec-form-control-clear{display:none}ec-form-control.is-readonly{border-color:var(--ec-form-control-border-color-readonly);color:var(--ec-form-control-color-readonly)}ec-form-control.is-readonly .ec-form-control-action{display:none}ec-form-control.is-disabled:not(.is-readonly){color:var(--ec-form-control-color-disabled);opacity:.6}ec-form-control.is-disabled:not(.is-readonly) .ec-form-control-prefix,ec-form-control.is-disabled:not(.is-readonly) .ec-form-control-suffix{color:inherit}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], encapsulation: i0.ViewEncapsulation.None });
|
|
3485
3485
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: FormControlComponent, decorators: [{
|
|
3486
3486
|
type: Component,
|
|
3487
|
-
args: [{ selector: 'ec-form-control', encapsulation: ViewEncapsulation.None, template: "<ng-content></ng-content>\r\n<i id=\"{{id + '_icon'}}\" class=\"ec-form-control-icon ec-icon {{icon}}\"></i>\r\n<i id=\"{{id + '_loading'}}\" class=\"ec-form-control-icon ec-icon icon-loading\"></i>\r\n<i id=\"{{id + '_required'}}\" class=\"ec-form-control-icon ec-icon icon-required\"></i>\r\n<i id=\"{{id + '_invalid'}}\" class=\"ec-form-control-icon ec-icon icon-invalid\"></i>\r\n<i id=\"{{id + '_clear'}}\" *ngIf=\"showClear\" class=\"ec-form-control-clear ec-icon icon-cancel\" (click)=\"clear()\"></i>\r\n<i id=\"{{id + '_action'}}\" *ngIf=\"actionIcon\" class=\"ec-form-control-action ec-icon {{actionIcon}}\" (click)=\"actionClicked.emit()\"></i>\r\n<div class=\"ec-focus-ring\"></div>", styles: ["ec-form-control{background-color:var(--ec-form-control-background-color);background-clip:padding-box;border:1px solid var(--ec-form-control-border-color);border-radius:var(--ec-border-radius);padding:0 .5rem;position:relative;color:var(--ec-form-control-color);display:flex;font-size:var(--ec-form-control-font-size);min-height:2rem;width:100%}ec-form-control>input,ec-form-control>select,ec-form-control>textarea{color:inherit;flex:1 1;min-width:0;border:0;background-color:transparent;order:2}ec-form-control>input::selection,ec-form-control>select::selection,ec-form-control>textarea::selection{background-color:var(--ec-form-control-background-color-selection);color:var(--ec-form-control-color-selection)}ec-form-control>input::-webkit-input-placeholder,ec-form-control>select::-webkit-input-placeholder,ec-form-control>textarea::-webkit-input-placeholder{color:var(--ec-form-control-color-placeholder)}ec-form-control>input::-moz-placeholder,ec-form-control>select::-moz-placeholder,ec-form-control>textarea::-moz-placeholder{color:var(--ec-form-control-color-placeholder);opacity:1}ec-form-control>input:-ms-input-placeholder,ec-form-control>select:-ms-input-placeholder,ec-form-control>textarea:-ms-input-placeholder{color:var(--ec-form-control-color-placeholder)}ec-form-control>input:-moz-placeholder,ec-form-control>select:-moz-placeholder,ec-form-control>textarea:-moz-placeholder{color:var(--ec-form-control-color-placeholder);opacity:1}ec-form-control>input:focus,ec-form-control>select:focus,ec-form-control>textarea:focus{outline:none}ec-form-control>input:focus~.ec-focus-ring,ec-form-control>select:focus~.ec-focus-ring,ec-form-control>textarea:focus~.ec-focus-ring{display:block}ec-form-control>input,ec-form-control>textarea,ec-form-control>select,ec-form-control .ec-form-control-prefix,ec-form-control .ec-form-control-suffix{padding:calc((1.875rem - var(--ec-font-size-body) * 1.25) / 2) 0;line-height:1.25;font-size:inherit}ec-form-control>textarea{resize:none;padding:.3125rem 0}ec-form-control .ec-form-control-icon{margin-top:.4375rem;margin-right:.25rem;order:1}ec-form-control .ec-form-control-icon:not([class*=icon-]){display:none}ec-form-control .icon-required,ec-form-control .icon-invalid{color:var(--ec-form-control-border-color-invalid)}ec-form-control .ec-form-control-clear,ec-form-control .ec-form-control-action{cursor:pointer;flex:none;height:1.875rem;width:2rem;order:3}ec-form-control .ec-form-control-clear:last-of-type,ec-form-control .ec-form-control-action:last-of-type{margin-right:-.5rem}ec-form-control .ec-form-control-clear:hover,ec-form-control .ec-form-control-action:hover{background-color:var(--ec-background-color-hover)}ec-form-control .ec-form-control-clear{width:1.5rem}ec-form-control .ec-form-control-prefix,ec-form-control .ec-form-control-suffix{color:var(--ec-color-secondary-dark);flex:none;cursor:default}ec-form-control .ec-form-control-prefix{margin-right:.125rem;order:2}ec-form-control .ec-form-control-suffix{margin-left:.125rem;order:3}ec-form-control .ec-focus-ring{position:absolute;inset:-1px;border:.125rem solid var(--ec-form-control-border-color-focus);pointer-events:none;display:none;border-radius:var(--ec-form-control-border-radius);z-index:1}ec-form-control.is-pending .icon-invalid,ec-form-control.is-pending .icon-required{display:none}ec-form-control.is-invalid{border-color:var(--ec-form-control-border-color-invalid);background-color:var(--ec-form-control-background-color-invalid)}ec-form-control.is-invalid .icon-required{display:none}ec-form-control.is-empty .ec-form-control-clear{display:none}ec-form-control.is-required.is-empty .ec-form-control-icon:first-of-type{display:none}ec-form-control:not(.is-pending) .icon-loading{display:none}ec-form-control:not(.is-required) .icon-required,ec-form-control:not(.is-empty) .icon-required{display:none}ec-form-control:not(.is-invalid) .icon-invalid{display:none}ec-form-control.is-readonly,ec-form-control.is-disabled{background-color:var(--ec-form-control-background-color-disabled)}ec-form-control.is-readonly .icon-loading,ec-form-control.is-readonly .icon-invalid,ec-form-control.is-readonly .icon-required,ec-form-control.is-readonly .ec-form-control-clear,ec-form-control.is-disabled .icon-loading,ec-form-control.is-disabled .icon-invalid,ec-form-control.is-disabled .icon-required,ec-form-control.is-disabled .ec-form-control-clear{display:none}ec-form-control.is-readonly{border-color:var(--ec-form-control-border-color-readonly);color:var(--ec-form-control-color-readonly)}ec-form-control.is-readonly .ec-form-control-action{display:none}ec-form-control.is-disabled:not(.is-readonly){color:var(--ec-form-control-color-disabled);opacity:.6}ec-form-control.is-disabled:not(.is-readonly) .ec-form-control-prefix,ec-form-control.is-disabled:not(.is-readonly) .ec-form-control-suffix{color:inherit}\n"] }]
|
|
3487
|
+
args: [{ selector: 'ec-form-control', encapsulation: ViewEncapsulation.None, template: "<ng-content></ng-content>\r\n<i id=\"{{id + '_icon'}}\" class=\"ec-form-control-icon ec-icon {{icon}}\"></i>\r\n<i id=\"{{id + '_loading'}}\" class=\"ec-form-control-icon ec-icon icon-loading\"></i>\r\n<i id=\"{{id + '_required'}}\" class=\"ec-form-control-icon ec-icon icon-required\"></i>\r\n<i id=\"{{id + '_invalid'}}\" class=\"ec-form-control-icon ec-icon icon-invalid\"></i>\r\n<i id=\"{{id + '_clear'}}\" *ngIf=\"showClear\" class=\"ec-form-control-clear ec-icon icon-cancel\" (click)=\"clear()\"></i>\r\n<i id=\"{{id + '_action'}}\" *ngIf=\"actionIcon\" class=\"ec-form-control-action ec-icon {{actionIcon}}\" (click)=\"actionClicked.emit()\"></i>\r\n<div class=\"ec-focus-ring\"></div>", styles: ["ec-form-control{background-color:var(--ec-form-control-background-color);background-clip:padding-box;border:1px solid var(--ec-form-control-border-color);border-radius:var(--ec-border-radius);padding:0 .5rem;position:relative;color:var(--ec-form-control-color);display:flex;font-size:var(--ec-form-control-font-size);min-height:2rem;width:100%}ec-form-control>input,ec-form-control>select,ec-form-control>textarea{color:inherit;flex:1 1;min-width:0;border:0;background-color:transparent;order:2}ec-form-control>input::selection,ec-form-control>select::selection,ec-form-control>textarea::selection{background-color:var(--ec-form-control-background-color-selection);color:var(--ec-form-control-color-selection)}ec-form-control>input::-webkit-input-placeholder,ec-form-control>select::-webkit-input-placeholder,ec-form-control>textarea::-webkit-input-placeholder{color:var(--ec-form-control-color-placeholder)}ec-form-control>input::-moz-placeholder,ec-form-control>select::-moz-placeholder,ec-form-control>textarea::-moz-placeholder{color:var(--ec-form-control-color-placeholder);opacity:1}ec-form-control>input:-ms-input-placeholder,ec-form-control>select:-ms-input-placeholder,ec-form-control>textarea:-ms-input-placeholder{color:var(--ec-form-control-color-placeholder)}ec-form-control>input:-moz-placeholder,ec-form-control>select:-moz-placeholder,ec-form-control>textarea:-moz-placeholder{color:var(--ec-form-control-color-placeholder);opacity:1}ec-form-control>input:focus,ec-form-control>select:focus,ec-form-control>textarea:focus{outline:none}ec-form-control>input:focus~.ec-focus-ring,ec-form-control>select:focus~.ec-focus-ring,ec-form-control>textarea:focus~.ec-focus-ring{display:block}ec-form-control>input,ec-form-control>textarea,ec-form-control>select,ec-form-control .ec-form-control-prefix,ec-form-control .ec-form-control-suffix{padding:calc((1.875rem - (var(--ec-font-size-body) * 1.25)) / 2) 0;line-height:1.25;font-size:inherit}ec-form-control>textarea{resize:none;padding:.3125rem 0}ec-form-control .ec-form-control-icon{margin-top:.4375rem;margin-right:.25rem;order:1}ec-form-control .ec-form-control-icon:not([class*=icon-]){display:none}ec-form-control .icon-required,ec-form-control .icon-invalid{color:var(--ec-form-control-border-color-invalid)}ec-form-control .ec-form-control-clear,ec-form-control .ec-form-control-action{cursor:pointer;flex:none;height:1.875rem;width:2rem;order:3}ec-form-control .ec-form-control-clear:last-of-type,ec-form-control .ec-form-control-action:last-of-type{margin-right:-.5rem}ec-form-control .ec-form-control-clear:hover,ec-form-control .ec-form-control-action:hover{background-color:var(--ec-background-color-hover)}ec-form-control .ec-form-control-clear{width:1.5rem}ec-form-control .ec-form-control-prefix,ec-form-control .ec-form-control-suffix{color:var(--ec-color-secondary-dark);flex:none;cursor:default}ec-form-control .ec-form-control-prefix{margin-right:.125rem;order:2}ec-form-control .ec-form-control-suffix{margin-left:.125rem;order:3}ec-form-control .ec-focus-ring{position:absolute;inset:-1px;border:.125rem solid var(--ec-form-control-border-color-focus);pointer-events:none;display:none;border-radius:var(--ec-form-control-border-radius);z-index:1}ec-form-control.is-pending .icon-invalid,ec-form-control.is-pending .icon-required{display:none}ec-form-control.is-invalid{border-color:var(--ec-form-control-border-color-invalid);background-color:var(--ec-form-control-background-color-invalid)}ec-form-control.is-invalid .icon-required{display:none}ec-form-control.is-empty .ec-form-control-clear{display:none}ec-form-control.is-required.is-empty .ec-form-control-icon:first-of-type{display:none}ec-form-control:not(.is-pending) .icon-loading{display:none}ec-form-control:not(.is-required) .icon-required,ec-form-control:not(.is-empty) .icon-required{display:none}ec-form-control:not(.is-invalid) .icon-invalid{display:none}ec-form-control.is-readonly,ec-form-control.is-disabled{background-color:var(--ec-form-control-background-color-disabled)}ec-form-control.is-readonly .icon-loading,ec-form-control.is-readonly .icon-invalid,ec-form-control.is-readonly .icon-required,ec-form-control.is-readonly .ec-form-control-clear,ec-form-control.is-disabled .icon-loading,ec-form-control.is-disabled .icon-invalid,ec-form-control.is-disabled .icon-required,ec-form-control.is-disabled .ec-form-control-clear{display:none}ec-form-control.is-readonly{border-color:var(--ec-form-control-border-color-readonly);color:var(--ec-form-control-color-readonly)}ec-form-control.is-readonly .ec-form-control-action{display:none}ec-form-control.is-disabled:not(.is-readonly){color:var(--ec-form-control-color-disabled);opacity:.6}ec-form-control.is-disabled:not(.is-readonly) .ec-form-control-prefix,ec-form-control.is-disabled:not(.is-readonly) .ec-form-control-suffix{color:inherit}\n"] }]
|
|
3488
3488
|
}], ctorParameters: function () { return [{ type: i0.ElementRef }]; }, propDecorators: { formModel: [{
|
|
3489
3489
|
type: ContentChild,
|
|
3490
3490
|
args: [FormControlDirective]
|
|
@@ -4800,10 +4800,10 @@ class SelectComponent extends FormControlBase {
|
|
|
4800
4800
|
}
|
|
4801
4801
|
}
|
|
4802
4802
|
SelectComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SelectComponent, deps: [{ token: ValidationMessageService }, { token: FormGroupHelper }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
4803
|
-
SelectComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: SelectComponent, selector: "ec-select", inputs: { placeholder: "placeholder", options: "options", autoDefault: "autoDefault" }, usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<div class=\"control\"\r\n [ngClass]=\"{'is-readonly': readonly, 'is-disabled': formModel.disabled}\">\r\n <label for=\"{{id}}_select\"\r\n *ngIf=\"label\"\r\n ngPreserveWhitespaces>{{label|translate}}</label>\r\n <select [attr.id]=\"inputId\"\r\n tabindex=\"{{tabindex}}\"\r\n [formControl]=\"formModel\"\r\n [attr.required]=\"required\"\r\n [attr.cdkFocusInitial]=\"autofocus || null\">\r\n <option *ngIf=\"!required\"\r\n [ngValue]=\"null\">{{placeholder}}</option>\r\n <option *ngFor=\"let option of options\"\r\n [ngValue]=\"option.value\">{{option.label}}</option>\r\n </select>\r\n <i class=\"ec-icon icon-caret-down\"></i>\r\n</div>", styles: [":host{color:var(--ec-form-control-color);font-size:var(--ec-form-control-font-size);display:block;margin-bottom:1rem;width:100%}:host :host-context(.form-condensed){margin-bottom:.5rem}:host .control{width:100%;display:flex;flex-direction:column}:host .control.control-label-bottom{flex-direction:column-reverse}:host .control.control-label-left{flex-direction:row}:host .control.control-label-left label{margin-right:.25rem}:host .control.control-label-right{flex-direction:row-reverse}:host .control.control-label-right label{margin-left:.25rem}:host .control.control-label-left,:host .control.control-label-right{align-items:center}:host .control.control-label-left label,:host .control.control-label-right label{flex:1 1;margin-top:0;margin-bottom:0}:host .control.control-label-left .control-input,:host .control.control-label-right .control-input{flex:2 2}:host .control.is-readonly input,:host .control.is-readonly select,:host .control.is-readonly textarea{border-color:var(--ec-form-control-border-color-readonly);background-color:var(--ec-form-control-background-color-readonly);background-clip:border-box;background-image:none;color:var(--ec-form-control-color-readonly);opacity:1;-webkit-user-select:none;user-select:none;pointer-events:none;overflow:hidden;white-space:nowrap}:host .control.invalid .textbox-group-input ::ng-deep .control input.ng-invalid,:host .control.invalid .textbox-group-input ::ng-deep .control input.ng-valid{background-color:var(--ec-form-control-background-color-invalid);border-color:var(--ec-form-control-border-color-invalid);background-repeat:no-repeat;background-position:.5rem center;background-size:1rem,1rem;padding-left:1.75rem;background-image:none}:host .control.invalid .textbox-group-input ::ng-deep .control input.ng-invalid:focus,:host .control.invalid .textbox-group-input ::ng-deep .control input.ng-valid:focus{border-color:var(--ec-form-control-background-color-invalid)}:host .control.invalid .textbox-group-input ::ng-deep .control input.ng-invalid~.icon-invalid,:host .control.invalid .textbox-group-input ::ng-deep .control input.ng-valid~.icon-invalid{display:inline-flex;position:absolute;left:.5rem;top:.5rem;z-index:1}:host .control.invalid .textbox-group-input ::ng-deep .control input.ng-invalid~.icon-required,:host .control.invalid .textbox-group-input ::ng-deep .control input.ng-valid~.icon-required{display:none}:host .control.invalid:not(.open) .textbox-group-btn-right ::ng-deep button{background-color:var(--ec-form-control-background-color-invalid)}:host .control.invalid:not(.open) .textbox-group-btn-right ::ng-deep button:not(:focus){border-color:var(--ec-form-control-border-color-invalid)}:host .textbox-group{display:flex;position:relative}:host textarea:focus,:host input:focus,:host select:focus{outline:none}:host .control{position:relative}:host label{color:var(--ec-form-control-label-color, var(--ec-color-secondary-dark));display:block;font-size:var(--ec-font-size-label);line-height:1;margin:calc(var(--ec-font-size-label) / 2) 0}:host select{appearance:none;background-color:var(--ec-form-control-background-color);border:1px solid var(--ec-form-control-border-color);border-radius:var(--ec-border-radius);background-image:none;background-clip:padding-box;width:100%;line-height:1.25rem;padding:.3125rem 1.5rem .3125rem .5rem;height:2rem}:host select::selection{background-color:var(--ec-form-control-background-color-selection);color:var(--ec-form-control-color-selection)}:host select::-webkit-input-placeholder{color:var(--ec-form-control-color-placeholder)}:host select::-moz-placeholder{color:var(--ec-form-control-color-placeholder);opacity:1}:host select:-ms-input-placeholder{color:var(--ec-form-control-color-placeholder)}:host select:-moz-placeholder{color:var(--ec-form-control-color-placeholder);opacity:1}:host select~.icon-required,:host select~.icon-invalid{color:var(--ec-form-control-border-color-invalid)}:host select:required.is-empty{background-image:none;background-repeat:no-repeat;background-position:.5rem center;background-size:1rem,1rem;padding-left:1.75rem}:host select.ng-invalid.ng-touched{background-color:var(--ec-form-control-background-color-invalid);border-color:var(--ec-form-control-border-color-invalid);background-image:none;background-repeat:no-repeat;background-position:.5rem center;background-size:1rem,1rem;padding-left:1.75rem}:host select.ng-invalid.ng-touched:focus{border-color:var(--ec-form-control-background-color-invalid)}:host select.is-pending.ng-valid,:host select.is-pending.ng-invalid,:host select.is-pending.ng-pending{background-image:\"\";background-repeat:no-repeat;background-position:.5rem center;background-size:1rem,1rem;padding-left:1.75rem}:host select:focus,:host select:focus.is-empty{border-color:var(--ec-form-control-border-color-focus);box-shadow:var(--ec-form-control-box-shadow-focus);position:relative;z-index:1}:host select:disabled{background-color:var(--ec-form-control-background-color-disabled);border-color:var(--ec-form-control-border-color-disabled);color:var(--ec-form-control-color-disabled);opacity:var(--ec-form-control-opacity-disabled)}:host select:disabled:required,:host select:disabled:required.is-empty{background-image:none;padding-left:.5rem;background-color:var(--ec-form-control-background-color-disabled);border-color:var(--ec-form-control-border-color-disabled)}:host select:disabled:required+.icon-required,:host select:disabled:required.is-empty+.icon-required{display:none}:host select.is-uppercase:not(.is-empty){text-transform:uppercase}:host select:focus{position:static}:host .icon-caret-down{position:absolute;right:.5rem;bottom:.5625rem;z-index:1;pointer-events:none}:host select:disabled~.icon-caret-down{opacity:var(--ec-form-control-opacity-disabled)}:host .is-readonly .icon-caret-down{display:none}\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: i4.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i4.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i4.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }] });
|
|
4803
|
+
SelectComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: SelectComponent, selector: "ec-select", inputs: { placeholder: "placeholder", options: "options", autoDefault: "autoDefault" }, usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<div class=\"control\"\r\n [ngClass]=\"{'is-readonly': readonly, 'is-disabled': formModel.disabled}\">\r\n <label for=\"{{id}}_select\"\r\n *ngIf=\"label\"\r\n ngPreserveWhitespaces>{{label|translate}}</label>\r\n <select [attr.id]=\"inputId\"\r\n tabindex=\"{{tabindex}}\"\r\n [formControl]=\"formModel\"\r\n [attr.required]=\"required\"\r\n [attr.cdkFocusInitial]=\"autofocus || null\">\r\n <option *ngIf=\"!required\"\r\n [ngValue]=\"null\">{{placeholder}}</option>\r\n <option *ngFor=\"let option of options\"\r\n [ngValue]=\"option.value\">{{option.label}}</option>\r\n </select>\r\n <i class=\"ec-icon icon-caret-down\"></i>\r\n</div>", styles: [":host{color:var(--ec-form-control-color);font-size:var(--ec-form-control-font-size);display:block;margin-bottom:1rem;width:100%}:host :host-context(.form-condensed){margin-bottom:.5rem}:host .control{width:100%;display:flex;flex-direction:column}:host .control.control-label-bottom{flex-direction:column-reverse}:host .control.control-label-left{flex-direction:row}:host .control.control-label-left label{margin-right:.25rem}:host .control.control-label-right{flex-direction:row-reverse}:host .control.control-label-right label{margin-left:.25rem}:host .control.control-label-left,:host .control.control-label-right{align-items:center}:host .control.control-label-left label,:host .control.control-label-right label{flex:1 1;margin-top:0;margin-bottom:0}:host .control.control-label-left .control-input,:host .control.control-label-right .control-input{flex:2 2}:host .control.is-readonly input,:host .control.is-readonly select,:host .control.is-readonly textarea{border-color:var(--ec-form-control-border-color-readonly);background-color:var(--ec-form-control-background-color-readonly);background-clip:border-box;background-image:none;color:var(--ec-form-control-color-readonly);opacity:1;-webkit-user-select:none;user-select:none;pointer-events:none;overflow:hidden;white-space:nowrap}:host .control.invalid .textbox-group-input ::ng-deep .control input.ng-invalid,:host .control.invalid .textbox-group-input ::ng-deep .control input.ng-valid{background-color:var(--ec-form-control-background-color-invalid);border-color:var(--ec-form-control-border-color-invalid);background-repeat:no-repeat;background-position:.5rem center;background-size:1rem,1rem;padding-left:1.75rem;background-image:none}:host .control.invalid .textbox-group-input ::ng-deep .control input.ng-invalid:focus,:host .control.invalid .textbox-group-input ::ng-deep .control input.ng-valid:focus{border-color:var(--ec-form-control-background-color-invalid)}:host .control.invalid .textbox-group-input ::ng-deep .control input.ng-invalid~.icon-invalid,:host .control.invalid .textbox-group-input ::ng-deep .control input.ng-valid~.icon-invalid{display:inline-flex;position:absolute;left:.5rem;top:.5rem;z-index:1}:host .control.invalid .textbox-group-input ::ng-deep .control input.ng-invalid~.icon-required,:host .control.invalid .textbox-group-input ::ng-deep .control input.ng-valid~.icon-required{display:none}:host .control.invalid:not(.open) .textbox-group-btn-right ::ng-deep button{background-color:var(--ec-form-control-background-color-invalid)}:host .control.invalid:not(.open) .textbox-group-btn-right ::ng-deep button:not(:focus){border-color:var(--ec-form-control-border-color-invalid)}:host .textbox-group{display:flex;position:relative}:host textarea:focus,:host input:focus,:host select:focus{outline:none}:host .control{position:relative}:host label{color:var(--ec-form-control-label-color, var(--ec-color-secondary-dark));display:block;font-size:var(--ec-font-size-label);line-height:1;margin:calc(var(--ec-font-size-label) / 2) 0}:host select{-webkit-appearance:none;appearance:none;background-color:var(--ec-form-control-background-color);border:1px solid var(--ec-form-control-border-color);border-radius:var(--ec-border-radius);background-image:none;background-clip:padding-box;width:100%;line-height:1.25rem;padding:.3125rem 1.5rem .3125rem .5rem;height:2rem}:host select::selection{background-color:var(--ec-form-control-background-color-selection);color:var(--ec-form-control-color-selection)}:host select::-webkit-input-placeholder{color:var(--ec-form-control-color-placeholder)}:host select::-moz-placeholder{color:var(--ec-form-control-color-placeholder);opacity:1}:host select:-ms-input-placeholder{color:var(--ec-form-control-color-placeholder)}:host select:-moz-placeholder{color:var(--ec-form-control-color-placeholder);opacity:1}:host select~.icon-required,:host select~.icon-invalid{color:var(--ec-form-control-border-color-invalid)}:host select:required.is-empty{background-image:none;background-repeat:no-repeat;background-position:.5rem center;background-size:1rem,1rem;padding-left:1.75rem}:host select.ng-invalid.ng-touched{background-color:var(--ec-form-control-background-color-invalid);border-color:var(--ec-form-control-border-color-invalid);background-image:none;background-repeat:no-repeat;background-position:.5rem center;background-size:1rem,1rem;padding-left:1.75rem}:host select.ng-invalid.ng-touched:focus{border-color:var(--ec-form-control-background-color-invalid)}:host select.is-pending.ng-valid,:host select.is-pending.ng-invalid,:host select.is-pending.ng-pending{background-image:\"\";background-repeat:no-repeat;background-position:.5rem center;background-size:1rem,1rem;padding-left:1.75rem}:host select:focus,:host select:focus.is-empty{border-color:var(--ec-form-control-border-color-focus);box-shadow:var(--ec-form-control-box-shadow-focus);position:relative;z-index:1}:host select:disabled{background-color:var(--ec-form-control-background-color-disabled);border-color:var(--ec-form-control-border-color-disabled);color:var(--ec-form-control-color-disabled);opacity:var(--ec-form-control-opacity-disabled)}:host select:disabled:required,:host select:disabled:required.is-empty{background-image:none;padding-left:.5rem;background-color:var(--ec-form-control-background-color-disabled);border-color:var(--ec-form-control-border-color-disabled)}:host select:disabled:required+.icon-required,:host select:disabled:required.is-empty+.icon-required{display:none}:host select.is-uppercase:not(.is-empty){text-transform:uppercase}:host select:focus{position:static}:host .icon-caret-down{position:absolute;right:.5rem;bottom:.5625rem;z-index:1;pointer-events:none}:host select:disabled~.icon-caret-down{opacity:var(--ec-form-control-opacity-disabled)}:host .is-readonly .icon-caret-down{display:none}\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: i4.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i4.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i4.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }] });
|
|
4804
4804
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SelectComponent, decorators: [{
|
|
4805
4805
|
type: Component,
|
|
4806
|
-
args: [{ selector: 'ec-select', template: "<div class=\"control\"\r\n [ngClass]=\"{'is-readonly': readonly, 'is-disabled': formModel.disabled}\">\r\n <label for=\"{{id}}_select\"\r\n *ngIf=\"label\"\r\n ngPreserveWhitespaces>{{label|translate}}</label>\r\n <select [attr.id]=\"inputId\"\r\n tabindex=\"{{tabindex}}\"\r\n [formControl]=\"formModel\"\r\n [attr.required]=\"required\"\r\n [attr.cdkFocusInitial]=\"autofocus || null\">\r\n <option *ngIf=\"!required\"\r\n [ngValue]=\"null\">{{placeholder}}</option>\r\n <option *ngFor=\"let option of options\"\r\n [ngValue]=\"option.value\">{{option.label}}</option>\r\n </select>\r\n <i class=\"ec-icon icon-caret-down\"></i>\r\n</div>", styles: [":host{color:var(--ec-form-control-color);font-size:var(--ec-form-control-font-size);display:block;margin-bottom:1rem;width:100%}:host :host-context(.form-condensed){margin-bottom:.5rem}:host .control{width:100%;display:flex;flex-direction:column}:host .control.control-label-bottom{flex-direction:column-reverse}:host .control.control-label-left{flex-direction:row}:host .control.control-label-left label{margin-right:.25rem}:host .control.control-label-right{flex-direction:row-reverse}:host .control.control-label-right label{margin-left:.25rem}:host .control.control-label-left,:host .control.control-label-right{align-items:center}:host .control.control-label-left label,:host .control.control-label-right label{flex:1 1;margin-top:0;margin-bottom:0}:host .control.control-label-left .control-input,:host .control.control-label-right .control-input{flex:2 2}:host .control.is-readonly input,:host .control.is-readonly select,:host .control.is-readonly textarea{border-color:var(--ec-form-control-border-color-readonly);background-color:var(--ec-form-control-background-color-readonly);background-clip:border-box;background-image:none;color:var(--ec-form-control-color-readonly);opacity:1;-webkit-user-select:none;user-select:none;pointer-events:none;overflow:hidden;white-space:nowrap}:host .control.invalid .textbox-group-input ::ng-deep .control input.ng-invalid,:host .control.invalid .textbox-group-input ::ng-deep .control input.ng-valid{background-color:var(--ec-form-control-background-color-invalid);border-color:var(--ec-form-control-border-color-invalid);background-repeat:no-repeat;background-position:.5rem center;background-size:1rem,1rem;padding-left:1.75rem;background-image:none}:host .control.invalid .textbox-group-input ::ng-deep .control input.ng-invalid:focus,:host .control.invalid .textbox-group-input ::ng-deep .control input.ng-valid:focus{border-color:var(--ec-form-control-background-color-invalid)}:host .control.invalid .textbox-group-input ::ng-deep .control input.ng-invalid~.icon-invalid,:host .control.invalid .textbox-group-input ::ng-deep .control input.ng-valid~.icon-invalid{display:inline-flex;position:absolute;left:.5rem;top:.5rem;z-index:1}:host .control.invalid .textbox-group-input ::ng-deep .control input.ng-invalid~.icon-required,:host .control.invalid .textbox-group-input ::ng-deep .control input.ng-valid~.icon-required{display:none}:host .control.invalid:not(.open) .textbox-group-btn-right ::ng-deep button{background-color:var(--ec-form-control-background-color-invalid)}:host .control.invalid:not(.open) .textbox-group-btn-right ::ng-deep button:not(:focus){border-color:var(--ec-form-control-border-color-invalid)}:host .textbox-group{display:flex;position:relative}:host textarea:focus,:host input:focus,:host select:focus{outline:none}:host .control{position:relative}:host label{color:var(--ec-form-control-label-color, var(--ec-color-secondary-dark));display:block;font-size:var(--ec-font-size-label);line-height:1;margin:calc(var(--ec-font-size-label) / 2) 0}:host select{appearance:none;background-color:var(--ec-form-control-background-color);border:1px solid var(--ec-form-control-border-color);border-radius:var(--ec-border-radius);background-image:none;background-clip:padding-box;width:100%;line-height:1.25rem;padding:.3125rem 1.5rem .3125rem .5rem;height:2rem}:host select::selection{background-color:var(--ec-form-control-background-color-selection);color:var(--ec-form-control-color-selection)}:host select::-webkit-input-placeholder{color:var(--ec-form-control-color-placeholder)}:host select::-moz-placeholder{color:var(--ec-form-control-color-placeholder);opacity:1}:host select:-ms-input-placeholder{color:var(--ec-form-control-color-placeholder)}:host select:-moz-placeholder{color:var(--ec-form-control-color-placeholder);opacity:1}:host select~.icon-required,:host select~.icon-invalid{color:var(--ec-form-control-border-color-invalid)}:host select:required.is-empty{background-image:none;background-repeat:no-repeat;background-position:.5rem center;background-size:1rem,1rem;padding-left:1.75rem}:host select.ng-invalid.ng-touched{background-color:var(--ec-form-control-background-color-invalid);border-color:var(--ec-form-control-border-color-invalid);background-image:none;background-repeat:no-repeat;background-position:.5rem center;background-size:1rem,1rem;padding-left:1.75rem}:host select.ng-invalid.ng-touched:focus{border-color:var(--ec-form-control-background-color-invalid)}:host select.is-pending.ng-valid,:host select.is-pending.ng-invalid,:host select.is-pending.ng-pending{background-image:\"\";background-repeat:no-repeat;background-position:.5rem center;background-size:1rem,1rem;padding-left:1.75rem}:host select:focus,:host select:focus.is-empty{border-color:var(--ec-form-control-border-color-focus);box-shadow:var(--ec-form-control-box-shadow-focus);position:relative;z-index:1}:host select:disabled{background-color:var(--ec-form-control-background-color-disabled);border-color:var(--ec-form-control-border-color-disabled);color:var(--ec-form-control-color-disabled);opacity:var(--ec-form-control-opacity-disabled)}:host select:disabled:required,:host select:disabled:required.is-empty{background-image:none;padding-left:.5rem;background-color:var(--ec-form-control-background-color-disabled);border-color:var(--ec-form-control-border-color-disabled)}:host select:disabled:required+.icon-required,:host select:disabled:required.is-empty+.icon-required{display:none}:host select.is-uppercase:not(.is-empty){text-transform:uppercase}:host select:focus{position:static}:host .icon-caret-down{position:absolute;right:.5rem;bottom:.5625rem;z-index:1;pointer-events:none}:host select:disabled~.icon-caret-down{opacity:var(--ec-form-control-opacity-disabled)}:host .is-readonly .icon-caret-down{display:none}\n"] }]
|
|
4806
|
+
args: [{ selector: 'ec-select', template: "<div class=\"control\"\r\n [ngClass]=\"{'is-readonly': readonly, 'is-disabled': formModel.disabled}\">\r\n <label for=\"{{id}}_select\"\r\n *ngIf=\"label\"\r\n ngPreserveWhitespaces>{{label|translate}}</label>\r\n <select [attr.id]=\"inputId\"\r\n tabindex=\"{{tabindex}}\"\r\n [formControl]=\"formModel\"\r\n [attr.required]=\"required\"\r\n [attr.cdkFocusInitial]=\"autofocus || null\">\r\n <option *ngIf=\"!required\"\r\n [ngValue]=\"null\">{{placeholder}}</option>\r\n <option *ngFor=\"let option of options\"\r\n [ngValue]=\"option.value\">{{option.label}}</option>\r\n </select>\r\n <i class=\"ec-icon icon-caret-down\"></i>\r\n</div>", styles: [":host{color:var(--ec-form-control-color);font-size:var(--ec-form-control-font-size);display:block;margin-bottom:1rem;width:100%}:host :host-context(.form-condensed){margin-bottom:.5rem}:host .control{width:100%;display:flex;flex-direction:column}:host .control.control-label-bottom{flex-direction:column-reverse}:host .control.control-label-left{flex-direction:row}:host .control.control-label-left label{margin-right:.25rem}:host .control.control-label-right{flex-direction:row-reverse}:host .control.control-label-right label{margin-left:.25rem}:host .control.control-label-left,:host .control.control-label-right{align-items:center}:host .control.control-label-left label,:host .control.control-label-right label{flex:1 1;margin-top:0;margin-bottom:0}:host .control.control-label-left .control-input,:host .control.control-label-right .control-input{flex:2 2}:host .control.is-readonly input,:host .control.is-readonly select,:host .control.is-readonly textarea{border-color:var(--ec-form-control-border-color-readonly);background-color:var(--ec-form-control-background-color-readonly);background-clip:border-box;background-image:none;color:var(--ec-form-control-color-readonly);opacity:1;-webkit-user-select:none;user-select:none;pointer-events:none;overflow:hidden;white-space:nowrap}:host .control.invalid .textbox-group-input ::ng-deep .control input.ng-invalid,:host .control.invalid .textbox-group-input ::ng-deep .control input.ng-valid{background-color:var(--ec-form-control-background-color-invalid);border-color:var(--ec-form-control-border-color-invalid);background-repeat:no-repeat;background-position:.5rem center;background-size:1rem,1rem;padding-left:1.75rem;background-image:none}:host .control.invalid .textbox-group-input ::ng-deep .control input.ng-invalid:focus,:host .control.invalid .textbox-group-input ::ng-deep .control input.ng-valid:focus{border-color:var(--ec-form-control-background-color-invalid)}:host .control.invalid .textbox-group-input ::ng-deep .control input.ng-invalid~.icon-invalid,:host .control.invalid .textbox-group-input ::ng-deep .control input.ng-valid~.icon-invalid{display:inline-flex;position:absolute;left:.5rem;top:.5rem;z-index:1}:host .control.invalid .textbox-group-input ::ng-deep .control input.ng-invalid~.icon-required,:host .control.invalid .textbox-group-input ::ng-deep .control input.ng-valid~.icon-required{display:none}:host .control.invalid:not(.open) .textbox-group-btn-right ::ng-deep button{background-color:var(--ec-form-control-background-color-invalid)}:host .control.invalid:not(.open) .textbox-group-btn-right ::ng-deep button:not(:focus){border-color:var(--ec-form-control-border-color-invalid)}:host .textbox-group{display:flex;position:relative}:host textarea:focus,:host input:focus,:host select:focus{outline:none}:host .control{position:relative}:host label{color:var(--ec-form-control-label-color, var(--ec-color-secondary-dark));display:block;font-size:var(--ec-font-size-label);line-height:1;margin:calc(var(--ec-font-size-label) / 2) 0}:host select{-webkit-appearance:none;appearance:none;background-color:var(--ec-form-control-background-color);border:1px solid var(--ec-form-control-border-color);border-radius:var(--ec-border-radius);background-image:none;background-clip:padding-box;width:100%;line-height:1.25rem;padding:.3125rem 1.5rem .3125rem .5rem;height:2rem}:host select::selection{background-color:var(--ec-form-control-background-color-selection);color:var(--ec-form-control-color-selection)}:host select::-webkit-input-placeholder{color:var(--ec-form-control-color-placeholder)}:host select::-moz-placeholder{color:var(--ec-form-control-color-placeholder);opacity:1}:host select:-ms-input-placeholder{color:var(--ec-form-control-color-placeholder)}:host select:-moz-placeholder{color:var(--ec-form-control-color-placeholder);opacity:1}:host select~.icon-required,:host select~.icon-invalid{color:var(--ec-form-control-border-color-invalid)}:host select:required.is-empty{background-image:none;background-repeat:no-repeat;background-position:.5rem center;background-size:1rem,1rem;padding-left:1.75rem}:host select.ng-invalid.ng-touched{background-color:var(--ec-form-control-background-color-invalid);border-color:var(--ec-form-control-border-color-invalid);background-image:none;background-repeat:no-repeat;background-position:.5rem center;background-size:1rem,1rem;padding-left:1.75rem}:host select.ng-invalid.ng-touched:focus{border-color:var(--ec-form-control-background-color-invalid)}:host select.is-pending.ng-valid,:host select.is-pending.ng-invalid,:host select.is-pending.ng-pending{background-image:\"\";background-repeat:no-repeat;background-position:.5rem center;background-size:1rem,1rem;padding-left:1.75rem}:host select:focus,:host select:focus.is-empty{border-color:var(--ec-form-control-border-color-focus);box-shadow:var(--ec-form-control-box-shadow-focus);position:relative;z-index:1}:host select:disabled{background-color:var(--ec-form-control-background-color-disabled);border-color:var(--ec-form-control-border-color-disabled);color:var(--ec-form-control-color-disabled);opacity:var(--ec-form-control-opacity-disabled)}:host select:disabled:required,:host select:disabled:required.is-empty{background-image:none;padding-left:.5rem;background-color:var(--ec-form-control-background-color-disabled);border-color:var(--ec-form-control-border-color-disabled)}:host select:disabled:required+.icon-required,:host select:disabled:required.is-empty+.icon-required{display:none}:host select.is-uppercase:not(.is-empty){text-transform:uppercase}:host select:focus{position:static}:host .icon-caret-down{position:absolute;right:.5rem;bottom:.5625rem;z-index:1;pointer-events:none}:host select:disabled~.icon-caret-down{opacity:var(--ec-form-control-opacity-disabled)}:host .is-readonly .icon-caret-down{display:none}\n"] }]
|
|
4807
4807
|
}], ctorParameters: function () { return [{ type: ValidationMessageService }, { type: FormGroupHelper }, { type: i0.ElementRef }]; }, propDecorators: { placeholder: [{
|
|
4808
4808
|
type: Input
|
|
4809
4809
|
}], options: [{
|
|
@@ -5080,6 +5080,8 @@ class ConfirmDialogContext {
|
|
|
5080
5080
|
this.saveButtonType = 'primary';
|
|
5081
5081
|
/** Optional cancel button label */
|
|
5082
5082
|
this.cancelLabel = 'Cancel'; // LOCO
|
|
5083
|
+
/** Optional flag for hiding the cancel (secondary) button */
|
|
5084
|
+
this.hideCancel = false;
|
|
5083
5085
|
/** When true, adds the submit tag to the save button so hitting enter triggers the save */
|
|
5084
5086
|
this.saveOnEnter = false;
|
|
5085
5087
|
/** Optional alternate save button label */
|
|
@@ -5167,10 +5169,10 @@ class ConfirmComponent {
|
|
|
5167
5169
|
}
|
|
5168
5170
|
}
|
|
5169
5171
|
ConfirmComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: ConfirmComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
5170
|
-
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
|
|
5172
|
+
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: i2.TranslatePipe, name: "translate" }] });
|
|
5171
5173
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: ConfirmComponent, decorators: [{
|
|
5172
5174
|
type: Component,
|
|
5173
|
-
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
|
|
5175
|
+
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"] }]
|
|
5174
5176
|
}], ctorParameters: function () { return []; }, propDecorators: { context: [{
|
|
5175
5177
|
type: Input
|
|
5176
5178
|
}], onDialogSave: [{
|
|
@@ -8440,6 +8442,8 @@ class PageViewComponent {
|
|
|
8440
8442
|
*/
|
|
8441
8443
|
this.secondaryActionLabel = 'Cancel';
|
|
8442
8444
|
this.hideSecondaryAction = false;
|
|
8445
|
+
/** Flag for hiding the tiny close button in the top-right corner of dialog while in pending state only */
|
|
8446
|
+
this.hideCloseOnPending = false;
|
|
8443
8447
|
/**
|
|
8444
8448
|
* Label for the primary button in the header. Default is 'Save'
|
|
8445
8449
|
*/
|
|
@@ -8473,12 +8477,12 @@ class PageViewComponent {
|
|
|
8473
8477
|
}
|
|
8474
8478
|
}
|
|
8475
8479
|
PageViewComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: PageViewComponent, deps: [{ token: DialogService }], target: i0.ɵɵFactoryTarget.Component });
|
|
8476
|
-
PageViewComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: PageViewComponent, selector: "ec-page-view", inputs: { isDialog: "isDialog", readonly: "readonly", status: "status", showHeader: "showHeader", errors: "errors", breadcrumbs: "breadcrumbs", title: "title", titleIcon: "titleIcon", subTitle: "subTitle", subTitleUrl: "subTitleUrl", moreActionsLabel: "moreActionsLabel", moreActions: "moreActions", secondaryActionLabel: "secondaryActionLabel", hideSecondaryAction: "hideSecondaryAction", primaryActionLabel: "primaryActionLabel", hidePrimaryAction: "hidePrimaryAction", customTitleTemplate: "customTitleTemplate", customActionsTemplate: "customActionsTemplate", customHeaderTemplate: "customHeaderTemplate", footerTemplate: "footerTemplate", customErrorBannerTemplate: "customErrorBannerTemplate", stickyFooter: "stickyFooter", fitContent: "fitContent", bgContent: "bgContent" }, outputs: { onPrimaryAction: "onPrimaryAction", onSecondaryAction: "onSecondaryAction" }, host: { properties: { "class.bg-content": "this.bgContent" }, classAttribute: "flex-grow" }, ngImport: i0, template: "<div ecOverlay\r\n [status]=\"status?.status\"\r\n [message]=\"status?.message\"\r\n [displayAsMask]=\"true\"\r\n class=\"flex-grow d-flex\"\r\n [ngClass]=\"{'bg-body': !bgContent, 'bg-content': bgContent}\">\r\n <div id=\"PageViewScrollContainer\"\r\n class=\"d-flex flex-column flex-grow scroll-y\"\r\n [class.is-dialog]=\"isDialog\"\r\n [class.fit-content]=\"fitContent\"\r\n [class.sticky-footer]=\"stickyFooter && !!footerTemplate\"\r\n [class.overlay-visible]=\"status?.status !== 'hasData'\"\r\n [class.footer-visible]=\"!!footerTemplate\">\r\n <section>\r\n <ng-content></ng-content>\r\n </section>\r\n\r\n <footer *ngIf=\"footerTemplate\">\r\n <ng-container *ngTemplateOutlet=\"footerTemplate\"></ng-container>\r\n </footer>\r\n\r\n <header *ngIf=\"showHeader\">\r\n <ol id=\"breadcrumbs\"\r\n *ngIf=\"breadcrumbs?.length && !isDialog\">\r\n <li *ngFor=\"let crumb of breadcrumbs; last as isLast\">\r\n <a *ngIf=\"crumb.url; else label\"\r\n [routerLink]=\"crumb.url\">\r\n <ng-container *ngTemplateOutlet=\"label\"></ng-container>\r\n </a>\r\n <ng-template #label>{{crumb.label}}</ng-template>\r\n </li>\r\n </ol>\r\n\r\n <div class=\"titlebar\">\r\n <app-page-title *ngIf=\"!customTitleTemplate; else customTitle\"\r\n [title]=\"title\"\r\n [subTitle]=\"subTitle\"\r\n [subTitleUrl]=\"subTitleUrl\"\r\n [titleIcon]=\"titleIcon\"\r\n class=\"title text-truncate\">\r\n </app-page-title>\r\n\r\n <ng-template #customTitle>\r\n <div class=\"title\">\r\n <ng-container *ngTemplateOutlet=\"customTitleTemplate\"></ng-container>\r\n </div>\r\n </ng-template>\r\n\r\n <div class=\"actions\">\r\n <ec-button id=\"primaryAction\"\r\n class=\"ml-2\"\r\n *ngIf=\"!hidePrimaryAction && onPrimaryAction.observers?.length && !readonly\"\r\n [disabled]=\"status?.status === 'pending'\"\r\n type=\"primary\"\r\n [label]=\"primaryActionLabel\"\r\n (clicked)=\"primaryAction($event)\">\r\n </ec-button>\r\n <ec-button id=\"secondaryAction\"\r\n class=\"ml-2\"\r\n *ngIf=\"!hideSecondaryAction && onSecondaryAction.observers?.length\"\r\n type=\"secondary\"\r\n [label]=\"readonly ? 'Close' : secondaryActionLabel\"\r\n (clicked)=\"secondaryAction($event)\">\r\n </ec-button>\r\n <ec-dropdown id=\"moreActions\"\r\n *ngIf=\"moreActions?.length && !readonly\"\r\n [disabled]=\"status?.status === 'pending'\"\r\n class=\"ml-2\"\r\n buttonType=\"text\"\r\n [label]=\"moreActionsLabel\"\r\n [items]=\"moreActions\">\r\n </ec-dropdown>\r\n <ng-container *ngTemplateOutlet=\"customActionsTemplate\"></ng-container>\r\n </div>\r\n </div>\r\n\r\n <div *ngIf=\"customHeaderTemplate\"\r\n class=\"page-header\">\r\n <ng-container *ngTemplateOutlet=\"customHeaderTemplate\"></ng-container>\r\n </div>\r\n\r\n <ec-banner *ngIf=\"!customErrorBannerTemplate && errors; else customErrorBannerOutlet\"\r\n id=\"pageViewErrors\"\r\n [class.border-bottom-0]=\"!isDialog\">\r\n <div [innerHtml]=\"errors\"></div>\r\n </ec-banner>\r\n\r\n <ng-template #customErrorBannerOutlet>\r\n <ec-banner *ngIf=\"errors\"\r\n id=\"pageViewErrors\"\r\n [class.border-bottom-0]=\"!isDialog\">\r\n <ng-container *ngTemplateOutlet=\"customErrorBannerTemplate\"></ng-container>\r\n </ec-banner>\r\n </ng-template>\r\n </header>\r\n </div>\r\n\r\n <ec-button *ngIf=\"isDialog && (status?.status === 'pending' || status?.status === 'error')\"\r\n id=\"pageViewDialogClose\"\r\n type=\"icon\"\r\n icon=\"icon-cancel\"\r\n (clicked)=\"closeDialog()\">\r\n </ec-button>\r\n</div>", styles: [":host{flex:1 1;min-height:0;display:flex}header{background-color:var(--ec-background-color-body);position:sticky;top:0;order:1;padding:1rem 1.5rem .5rem;flex:none;z-index:var(--ec-z-index-sticky-page-header)}ol{font-size:var(--ec-font-size-label);line-height:1rem;grid-column:1/3;grid-row:1/2;list-style:none;padding:0;margin:0 0 .25rem}ol li{display:inline}ol li:not(:last-child):after{content:\" / \";display:inline;color:var(--ec-color-secondary-dark)}div[ecOverlay]{position:relative}.titlebar{display:grid;grid-template-columns:auto max-content;grid-template-rows:max-content max-content;gap:0 1rem}.title{grid-column:1/2;grid-row:2/3;align-self:center}.actions{grid-column:2/3;grid-row:2/3;display:flex;flex-direction:row-reverse}ec-banner{margin-top:1rem}section{padding:var(--ec-page-view-padding-section, .5rem 1.5rem 2rem);order:2;flex:1 0 auto;min-height:0}:not(.is-dialog)>section{z-index:0}footer{background-color:var(--ec-background-color-body);order:3;padding:0 1.5rem;height:4.5rem;flex:none;display:flex;align-items:center}.is-dialog header{padding:0}.is-dialog .titlebar{background-color:var(--ec-background-color);padding:1rem}.is-dialog ec-banner{margin:0}.is-dialog section{padding:var(--ec-page-view-padding-section, 1rem 1rem 1.5rem)}.sticky-footer section{padding-bottom:4.5rem}.sticky-footer footer{position:sticky;bottom:0;z-index:var(--ec-z-index-sticky-page-header)}.fit-content>section{flex:1 1;display:flex}.footer-visible section{padding-bottom:0}.overlay-visible header{z-index:var(--ec-z-index-overlay)1}.overlay-visible ec-banner{display:none}:host(.bg-content) header{background-color:var(--ec-background-color)}:host(.bg-content) section{background-color:var(--ec-background-color)}:host(.bg-content) footer{background-color:var(--ec-background-color)}#pageViewDialogClose{position:absolute;top:1rem;right:1rem;z-index:calc(var(--ec-z-index-overlay) + 1)}\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$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { 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: 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: DropdownComponent, selector: "ec-dropdown", inputs: ["id", "autofocus", "status", "disabled", "label", "icon", "buttonType", "buttonAlignment", "buttonTitle", "tabindex", "showArrow", "items", "menuTemplateType", "menuTitle", "menuHeight", "menuWidth", "menuMinWidth", "menuPosition", "menuFooter", "popupFixed", "buttonCustomTemplate", "pending"], outputs: ["itemSelected", "popupOpened"] }, { kind: "component", type: PageTitleComponent, selector: "app-page-title", inputs: ["title", "titleIcon", "subTitle", "subTitleUrl"] }] });
|
|
8480
|
+
PageViewComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: PageViewComponent, selector: "ec-page-view", inputs: { isDialog: "isDialog", readonly: "readonly", status: "status", showHeader: "showHeader", errors: "errors", breadcrumbs: "breadcrumbs", title: "title", titleIcon: "titleIcon", subTitle: "subTitle", subTitleUrl: "subTitleUrl", moreActionsLabel: "moreActionsLabel", moreActions: "moreActions", secondaryActionLabel: "secondaryActionLabel", hideSecondaryAction: "hideSecondaryAction", hideCloseOnPending: "hideCloseOnPending", primaryActionLabel: "primaryActionLabel", hidePrimaryAction: "hidePrimaryAction", customTitleTemplate: "customTitleTemplate", customActionsTemplate: "customActionsTemplate", customHeaderTemplate: "customHeaderTemplate", footerTemplate: "footerTemplate", customErrorBannerTemplate: "customErrorBannerTemplate", stickyFooter: "stickyFooter", fitContent: "fitContent", bgContent: "bgContent" }, outputs: { onPrimaryAction: "onPrimaryAction", onSecondaryAction: "onSecondaryAction" }, host: { properties: { "class.bg-content": "this.bgContent" }, classAttribute: "flex-grow" }, ngImport: i0, template: "<div ecOverlay\r\n [status]=\"status?.status\"\r\n [message]=\"status?.message\"\r\n [displayAsMask]=\"true\"\r\n class=\"flex-grow d-flex\"\r\n [ngClass]=\"{'bg-body': !bgContent, 'bg-content': bgContent}\">\r\n <div id=\"PageViewScrollContainer\"\r\n class=\"d-flex flex-column flex-grow scroll-y\"\r\n [class.is-dialog]=\"isDialog\"\r\n [class.fit-content]=\"fitContent\"\r\n [class.sticky-footer]=\"stickyFooter && !!footerTemplate\"\r\n [class.overlay-visible]=\"status?.status !== 'hasData'\"\r\n [class.footer-visible]=\"!!footerTemplate\">\r\n <section>\r\n <ng-content></ng-content>\r\n </section>\r\n\r\n <footer *ngIf=\"footerTemplate\">\r\n <ng-container *ngTemplateOutlet=\"footerTemplate\"></ng-container>\r\n </footer>\r\n\r\n <header *ngIf=\"showHeader\">\r\n <ol id=\"breadcrumbs\"\r\n *ngIf=\"breadcrumbs?.length && !isDialog\">\r\n <li *ngFor=\"let crumb of breadcrumbs; last as isLast\">\r\n <a *ngIf=\"crumb.url; else label\"\r\n [routerLink]=\"crumb.url\">\r\n <ng-container *ngTemplateOutlet=\"label\"></ng-container>\r\n </a>\r\n <ng-template #label>{{crumb.label}}</ng-template>\r\n </li>\r\n </ol>\r\n\r\n <div class=\"titlebar\">\r\n <app-page-title *ngIf=\"!customTitleTemplate; else customTitle\"\r\n [title]=\"title\"\r\n [subTitle]=\"subTitle\"\r\n [subTitleUrl]=\"subTitleUrl\"\r\n [titleIcon]=\"titleIcon\"\r\n class=\"title text-truncate\">\r\n </app-page-title>\r\n\r\n <ng-template #customTitle>\r\n <div class=\"title\">\r\n <ng-container *ngTemplateOutlet=\"customTitleTemplate\"></ng-container>\r\n </div>\r\n </ng-template>\r\n\r\n <div class=\"actions\">\r\n <ec-button id=\"primaryAction\"\r\n class=\"ml-2\"\r\n *ngIf=\"!hidePrimaryAction && onPrimaryAction.observers?.length && !readonly\"\r\n [disabled]=\"status?.status === 'pending'\"\r\n type=\"primary\"\r\n [label]=\"primaryActionLabel\"\r\n (clicked)=\"primaryAction($event)\">\r\n </ec-button>\r\n <ec-button id=\"secondaryAction\"\r\n class=\"ml-2\"\r\n *ngIf=\"!hideSecondaryAction && onSecondaryAction.observers?.length\"\r\n type=\"secondary\"\r\n [label]=\"readonly ? 'Close' : secondaryActionLabel\"\r\n (clicked)=\"secondaryAction($event)\">\r\n </ec-button>\r\n <ec-dropdown id=\"moreActions\"\r\n *ngIf=\"moreActions?.length && !readonly\"\r\n [disabled]=\"status?.status === 'pending'\"\r\n class=\"ml-2\"\r\n buttonType=\"text\"\r\n [label]=\"moreActionsLabel\"\r\n [items]=\"moreActions\">\r\n </ec-dropdown>\r\n <ng-container *ngTemplateOutlet=\"customActionsTemplate\"></ng-container>\r\n </div>\r\n </div>\r\n\r\n <div *ngIf=\"customHeaderTemplate\"\r\n class=\"page-header\">\r\n <ng-container *ngTemplateOutlet=\"customHeaderTemplate\"></ng-container>\r\n </div>\r\n\r\n <ec-banner *ngIf=\"!customErrorBannerTemplate && errors; else customErrorBannerOutlet\"\r\n id=\"pageViewErrors\"\r\n [class.border-bottom-0]=\"!isDialog\">\r\n <div [innerHtml]=\"errors\"></div>\r\n </ec-banner>\r\n\r\n <ng-template #customErrorBannerOutlet>\r\n <ec-banner *ngIf=\"errors\"\r\n id=\"pageViewErrors\"\r\n [class.border-bottom-0]=\"!isDialog\">\r\n <ng-container *ngTemplateOutlet=\"customErrorBannerTemplate\"></ng-container>\r\n </ec-banner>\r\n </ng-template>\r\n </header>\r\n </div>\r\n\r\n <ec-button *ngIf=\"isDialog && ( (status?.status === 'pending' && !hideCloseOnPending) || status?.status === 'error')\"\r\n id=\"pageViewDialogClose\"\r\n type=\"icon\"\r\n icon=\"icon-cancel\"\r\n (clicked)=\"closeDialog()\">\r\n </ec-button>\r\n</div>", styles: [":host{flex:1 1;min-height:0;display:flex}header{background-color:var(--ec-background-color-body);position:sticky;top:0;order:1;padding:1rem 1.5rem .5rem;flex:none;z-index:var(--ec-z-index-sticky-page-header)}ol{font-size:var(--ec-font-size-label);line-height:1rem;grid-column:1/3;grid-row:1/2;list-style:none;padding:0;margin:0 0 .25rem}ol li{display:inline}ol li:not(:last-child):after{content:\" / \";display:inline;color:var(--ec-color-secondary-dark)}div[ecOverlay]{position:relative}.titlebar{display:grid;grid-template-columns:auto max-content;grid-template-rows:max-content max-content;gap:0 1rem}.title{grid-column:1/2;grid-row:2/3;align-self:center}.actions{grid-column:2/3;grid-row:2/3;display:flex;flex-direction:row-reverse}ec-banner{margin-top:1rem}section{padding:var(--ec-page-view-padding-section, .5rem 1.5rem 2rem);order:2;flex:1 0 auto;min-height:0}:not(.is-dialog)>section{z-index:0}footer{background-color:var(--ec-background-color-body);order:3;padding:0 1.5rem;height:4.5rem;flex:none;display:flex;align-items:center}.is-dialog header{padding:0}.is-dialog .titlebar{background-color:var(--ec-background-color);padding:1rem}.is-dialog ec-banner{margin:0}.is-dialog section{padding:var(--ec-page-view-padding-section, 1rem 1rem 1.5rem)}.sticky-footer section{padding-bottom:4.5rem}.sticky-footer footer{position:sticky;bottom:0;z-index:var(--ec-z-index-sticky-page-header)}.fit-content>section{flex:1 1;display:flex}.footer-visible section{padding-bottom:0}.overlay-visible header{z-index:var(--ec-z-index-overlay)1}.overlay-visible ec-banner{display:none}:host(.bg-content) header{background-color:var(--ec-background-color)}:host(.bg-content) section{background-color:var(--ec-background-color)}:host(.bg-content) footer{background-color:var(--ec-background-color)}#pageViewDialogClose{position:absolute;top:1rem;right:1rem;z-index:calc(var(--ec-z-index-overlay) + 1)}\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$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { 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: 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: DropdownComponent, selector: "ec-dropdown", inputs: ["id", "autofocus", "status", "disabled", "label", "icon", "buttonType", "buttonAlignment", "buttonTitle", "tabindex", "showArrow", "items", "menuTemplateType", "menuTitle", "menuHeight", "menuWidth", "menuMinWidth", "menuPosition", "menuFooter", "popupFixed", "buttonCustomTemplate", "pending"], outputs: ["itemSelected", "popupOpened"] }, { kind: "component", type: PageTitleComponent, selector: "app-page-title", inputs: ["title", "titleIcon", "subTitle", "subTitleUrl"] }] });
|
|
8477
8481
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: PageViewComponent, decorators: [{
|
|
8478
8482
|
type: Component,
|
|
8479
8483
|
args: [{ selector: 'ec-page-view', host: {
|
|
8480
8484
|
class: "flex-grow"
|
|
8481
|
-
}, template: "<div ecOverlay\r\n [status]=\"status?.status\"\r\n [message]=\"status?.message\"\r\n [displayAsMask]=\"true\"\r\n class=\"flex-grow d-flex\"\r\n [ngClass]=\"{'bg-body': !bgContent, 'bg-content': bgContent}\">\r\n <div id=\"PageViewScrollContainer\"\r\n class=\"d-flex flex-column flex-grow scroll-y\"\r\n [class.is-dialog]=\"isDialog\"\r\n [class.fit-content]=\"fitContent\"\r\n [class.sticky-footer]=\"stickyFooter && !!footerTemplate\"\r\n [class.overlay-visible]=\"status?.status !== 'hasData'\"\r\n [class.footer-visible]=\"!!footerTemplate\">\r\n <section>\r\n <ng-content></ng-content>\r\n </section>\r\n\r\n <footer *ngIf=\"footerTemplate\">\r\n <ng-container *ngTemplateOutlet=\"footerTemplate\"></ng-container>\r\n </footer>\r\n\r\n <header *ngIf=\"showHeader\">\r\n <ol id=\"breadcrumbs\"\r\n *ngIf=\"breadcrumbs?.length && !isDialog\">\r\n <li *ngFor=\"let crumb of breadcrumbs; last as isLast\">\r\n <a *ngIf=\"crumb.url; else label\"\r\n [routerLink]=\"crumb.url\">\r\n <ng-container *ngTemplateOutlet=\"label\"></ng-container>\r\n </a>\r\n <ng-template #label>{{crumb.label}}</ng-template>\r\n </li>\r\n </ol>\r\n\r\n <div class=\"titlebar\">\r\n <app-page-title *ngIf=\"!customTitleTemplate; else customTitle\"\r\n [title]=\"title\"\r\n [subTitle]=\"subTitle\"\r\n [subTitleUrl]=\"subTitleUrl\"\r\n [titleIcon]=\"titleIcon\"\r\n class=\"title text-truncate\">\r\n </app-page-title>\r\n\r\n <ng-template #customTitle>\r\n <div class=\"title\">\r\n <ng-container *ngTemplateOutlet=\"customTitleTemplate\"></ng-container>\r\n </div>\r\n </ng-template>\r\n\r\n <div class=\"actions\">\r\n <ec-button id=\"primaryAction\"\r\n class=\"ml-2\"\r\n *ngIf=\"!hidePrimaryAction && onPrimaryAction.observers?.length && !readonly\"\r\n [disabled]=\"status?.status === 'pending'\"\r\n type=\"primary\"\r\n [label]=\"primaryActionLabel\"\r\n (clicked)=\"primaryAction($event)\">\r\n </ec-button>\r\n <ec-button id=\"secondaryAction\"\r\n class=\"ml-2\"\r\n *ngIf=\"!hideSecondaryAction && onSecondaryAction.observers?.length\"\r\n type=\"secondary\"\r\n [label]=\"readonly ? 'Close' : secondaryActionLabel\"\r\n (clicked)=\"secondaryAction($event)\">\r\n </ec-button>\r\n <ec-dropdown id=\"moreActions\"\r\n *ngIf=\"moreActions?.length && !readonly\"\r\n [disabled]=\"status?.status === 'pending'\"\r\n class=\"ml-2\"\r\n buttonType=\"text\"\r\n [label]=\"moreActionsLabel\"\r\n [items]=\"moreActions\">\r\n </ec-dropdown>\r\n <ng-container *ngTemplateOutlet=\"customActionsTemplate\"></ng-container>\r\n </div>\r\n </div>\r\n\r\n <div *ngIf=\"customHeaderTemplate\"\r\n class=\"page-header\">\r\n <ng-container *ngTemplateOutlet=\"customHeaderTemplate\"></ng-container>\r\n </div>\r\n\r\n <ec-banner *ngIf=\"!customErrorBannerTemplate && errors; else customErrorBannerOutlet\"\r\n id=\"pageViewErrors\"\r\n [class.border-bottom-0]=\"!isDialog\">\r\n <div [innerHtml]=\"errors\"></div>\r\n </ec-banner>\r\n\r\n <ng-template #customErrorBannerOutlet>\r\n <ec-banner *ngIf=\"errors\"\r\n id=\"pageViewErrors\"\r\n [class.border-bottom-0]=\"!isDialog\">\r\n <ng-container *ngTemplateOutlet=\"customErrorBannerTemplate\"></ng-container>\r\n </ec-banner>\r\n </ng-template>\r\n </header>\r\n </div>\r\n\r\n <ec-button *ngIf=\"isDialog && (status?.status === 'pending' || status?.status === 'error')\"\r\n id=\"pageViewDialogClose\"\r\n type=\"icon\"\r\n icon=\"icon-cancel\"\r\n (clicked)=\"closeDialog()\">\r\n </ec-button>\r\n</div>", styles: [":host{flex:1 1;min-height:0;display:flex}header{background-color:var(--ec-background-color-body);position:sticky;top:0;order:1;padding:1rem 1.5rem .5rem;flex:none;z-index:var(--ec-z-index-sticky-page-header)}ol{font-size:var(--ec-font-size-label);line-height:1rem;grid-column:1/3;grid-row:1/2;list-style:none;padding:0;margin:0 0 .25rem}ol li{display:inline}ol li:not(:last-child):after{content:\" / \";display:inline;color:var(--ec-color-secondary-dark)}div[ecOverlay]{position:relative}.titlebar{display:grid;grid-template-columns:auto max-content;grid-template-rows:max-content max-content;gap:0 1rem}.title{grid-column:1/2;grid-row:2/3;align-self:center}.actions{grid-column:2/3;grid-row:2/3;display:flex;flex-direction:row-reverse}ec-banner{margin-top:1rem}section{padding:var(--ec-page-view-padding-section, .5rem 1.5rem 2rem);order:2;flex:1 0 auto;min-height:0}:not(.is-dialog)>section{z-index:0}footer{background-color:var(--ec-background-color-body);order:3;padding:0 1.5rem;height:4.5rem;flex:none;display:flex;align-items:center}.is-dialog header{padding:0}.is-dialog .titlebar{background-color:var(--ec-background-color);padding:1rem}.is-dialog ec-banner{margin:0}.is-dialog section{padding:var(--ec-page-view-padding-section, 1rem 1rem 1.5rem)}.sticky-footer section{padding-bottom:4.5rem}.sticky-footer footer{position:sticky;bottom:0;z-index:var(--ec-z-index-sticky-page-header)}.fit-content>section{flex:1 1;display:flex}.footer-visible section{padding-bottom:0}.overlay-visible header{z-index:var(--ec-z-index-overlay)1}.overlay-visible ec-banner{display:none}:host(.bg-content) header{background-color:var(--ec-background-color)}:host(.bg-content) section{background-color:var(--ec-background-color)}:host(.bg-content) footer{background-color:var(--ec-background-color)}#pageViewDialogClose{position:absolute;top:1rem;right:1rem;z-index:calc(var(--ec-z-index-overlay) + 1)}\n"] }]
|
|
8485
|
+
}, template: "<div ecOverlay\r\n [status]=\"status?.status\"\r\n [message]=\"status?.message\"\r\n [displayAsMask]=\"true\"\r\n class=\"flex-grow d-flex\"\r\n [ngClass]=\"{'bg-body': !bgContent, 'bg-content': bgContent}\">\r\n <div id=\"PageViewScrollContainer\"\r\n class=\"d-flex flex-column flex-grow scroll-y\"\r\n [class.is-dialog]=\"isDialog\"\r\n [class.fit-content]=\"fitContent\"\r\n [class.sticky-footer]=\"stickyFooter && !!footerTemplate\"\r\n [class.overlay-visible]=\"status?.status !== 'hasData'\"\r\n [class.footer-visible]=\"!!footerTemplate\">\r\n <section>\r\n <ng-content></ng-content>\r\n </section>\r\n\r\n <footer *ngIf=\"footerTemplate\">\r\n <ng-container *ngTemplateOutlet=\"footerTemplate\"></ng-container>\r\n </footer>\r\n\r\n <header *ngIf=\"showHeader\">\r\n <ol id=\"breadcrumbs\"\r\n *ngIf=\"breadcrumbs?.length && !isDialog\">\r\n <li *ngFor=\"let crumb of breadcrumbs; last as isLast\">\r\n <a *ngIf=\"crumb.url; else label\"\r\n [routerLink]=\"crumb.url\">\r\n <ng-container *ngTemplateOutlet=\"label\"></ng-container>\r\n </a>\r\n <ng-template #label>{{crumb.label}}</ng-template>\r\n </li>\r\n </ol>\r\n\r\n <div class=\"titlebar\">\r\n <app-page-title *ngIf=\"!customTitleTemplate; else customTitle\"\r\n [title]=\"title\"\r\n [subTitle]=\"subTitle\"\r\n [subTitleUrl]=\"subTitleUrl\"\r\n [titleIcon]=\"titleIcon\"\r\n class=\"title text-truncate\">\r\n </app-page-title>\r\n\r\n <ng-template #customTitle>\r\n <div class=\"title\">\r\n <ng-container *ngTemplateOutlet=\"customTitleTemplate\"></ng-container>\r\n </div>\r\n </ng-template>\r\n\r\n <div class=\"actions\">\r\n <ec-button id=\"primaryAction\"\r\n class=\"ml-2\"\r\n *ngIf=\"!hidePrimaryAction && onPrimaryAction.observers?.length && !readonly\"\r\n [disabled]=\"status?.status === 'pending'\"\r\n type=\"primary\"\r\n [label]=\"primaryActionLabel\"\r\n (clicked)=\"primaryAction($event)\">\r\n </ec-button>\r\n <ec-button id=\"secondaryAction\"\r\n class=\"ml-2\"\r\n *ngIf=\"!hideSecondaryAction && onSecondaryAction.observers?.length\"\r\n type=\"secondary\"\r\n [label]=\"readonly ? 'Close' : secondaryActionLabel\"\r\n (clicked)=\"secondaryAction($event)\">\r\n </ec-button>\r\n <ec-dropdown id=\"moreActions\"\r\n *ngIf=\"moreActions?.length && !readonly\"\r\n [disabled]=\"status?.status === 'pending'\"\r\n class=\"ml-2\"\r\n buttonType=\"text\"\r\n [label]=\"moreActionsLabel\"\r\n [items]=\"moreActions\">\r\n </ec-dropdown>\r\n <ng-container *ngTemplateOutlet=\"customActionsTemplate\"></ng-container>\r\n </div>\r\n </div>\r\n\r\n <div *ngIf=\"customHeaderTemplate\"\r\n class=\"page-header\">\r\n <ng-container *ngTemplateOutlet=\"customHeaderTemplate\"></ng-container>\r\n </div>\r\n\r\n <ec-banner *ngIf=\"!customErrorBannerTemplate && errors; else customErrorBannerOutlet\"\r\n id=\"pageViewErrors\"\r\n [class.border-bottom-0]=\"!isDialog\">\r\n <div [innerHtml]=\"errors\"></div>\r\n </ec-banner>\r\n\r\n <ng-template #customErrorBannerOutlet>\r\n <ec-banner *ngIf=\"errors\"\r\n id=\"pageViewErrors\"\r\n [class.border-bottom-0]=\"!isDialog\">\r\n <ng-container *ngTemplateOutlet=\"customErrorBannerTemplate\"></ng-container>\r\n </ec-banner>\r\n </ng-template>\r\n </header>\r\n </div>\r\n\r\n <ec-button *ngIf=\"isDialog && ( (status?.status === 'pending' && !hideCloseOnPending) || status?.status === 'error')\"\r\n id=\"pageViewDialogClose\"\r\n type=\"icon\"\r\n icon=\"icon-cancel\"\r\n (clicked)=\"closeDialog()\">\r\n </ec-button>\r\n</div>", styles: [":host{flex:1 1;min-height:0;display:flex}header{background-color:var(--ec-background-color-body);position:sticky;top:0;order:1;padding:1rem 1.5rem .5rem;flex:none;z-index:var(--ec-z-index-sticky-page-header)}ol{font-size:var(--ec-font-size-label);line-height:1rem;grid-column:1/3;grid-row:1/2;list-style:none;padding:0;margin:0 0 .25rem}ol li{display:inline}ol li:not(:last-child):after{content:\" / \";display:inline;color:var(--ec-color-secondary-dark)}div[ecOverlay]{position:relative}.titlebar{display:grid;grid-template-columns:auto max-content;grid-template-rows:max-content max-content;gap:0 1rem}.title{grid-column:1/2;grid-row:2/3;align-self:center}.actions{grid-column:2/3;grid-row:2/3;display:flex;flex-direction:row-reverse}ec-banner{margin-top:1rem}section{padding:var(--ec-page-view-padding-section, .5rem 1.5rem 2rem);order:2;flex:1 0 auto;min-height:0}:not(.is-dialog)>section{z-index:0}footer{background-color:var(--ec-background-color-body);order:3;padding:0 1.5rem;height:4.5rem;flex:none;display:flex;align-items:center}.is-dialog header{padding:0}.is-dialog .titlebar{background-color:var(--ec-background-color);padding:1rem}.is-dialog ec-banner{margin:0}.is-dialog section{padding:var(--ec-page-view-padding-section, 1rem 1rem 1.5rem)}.sticky-footer section{padding-bottom:4.5rem}.sticky-footer footer{position:sticky;bottom:0;z-index:var(--ec-z-index-sticky-page-header)}.fit-content>section{flex:1 1;display:flex}.footer-visible section{padding-bottom:0}.overlay-visible header{z-index:var(--ec-z-index-overlay)1}.overlay-visible ec-banner{display:none}:host(.bg-content) header{background-color:var(--ec-background-color)}:host(.bg-content) section{background-color:var(--ec-background-color)}:host(.bg-content) footer{background-color:var(--ec-background-color)}#pageViewDialogClose{position:absolute;top:1rem;right:1rem;z-index:calc(var(--ec-z-index-overlay) + 1)}\n"] }]
|
|
8482
8486
|
}], ctorParameters: function () { return [{ type: DialogService }]; }, propDecorators: { isDialog: [{
|
|
8483
8487
|
type: Input
|
|
8484
8488
|
}], readonly: [{
|
|
@@ -8507,6 +8511,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImpor
|
|
|
8507
8511
|
type: Input
|
|
8508
8512
|
}], hideSecondaryAction: [{
|
|
8509
8513
|
type: Input
|
|
8514
|
+
}], hideCloseOnPending: [{
|
|
8515
|
+
type: Input
|
|
8510
8516
|
}], primaryActionLabel: [{
|
|
8511
8517
|
type: Input
|
|
8512
8518
|
}], hidePrimaryAction: [{
|