@energycap/components 0.47.1 → 0.47.2-AppDarkMode.20261013-1459
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/README.md +14 -0
- package/energycap-components.min.css +2 -2
- package/fesm2022/energycap-components.mjs +199 -34
- package/fesm2022/energycap-components.mjs.map +1 -1
- package/package.json +1 -1
- package/src/assets/images/icon-carbonhub-dark.svg +6 -0
- package/src/assets/images/icon-dark.svg +11 -0
- package/src/styles/_global-variables.scss +19 -1
- package/src/styles/_theme-dark.scss +109 -0
- package/src/styles/index.scss +1 -0
- package/src/styles/mixins/_button-base.scss +1 -0
- package/src/styles/mixins/_form-control-base.scss +1 -0
- package/src/styles/mixins/_table-base.scss +1 -1
- package/src/styles/mixins/_tags-base.scss +11 -11
- package/types/energycap-components.d.ts +81 -8
|
@@ -14,7 +14,7 @@ import { ActivatedRoute, NavigationEnd, NavigationStart, Router, RouterModule, c
|
|
|
14
14
|
import * as i2 from "@ngx-translate/core";
|
|
15
15
|
import { TranslateModule, TranslateService } from "@ngx-translate/core";
|
|
16
16
|
import { ClipboardService } from "ngx-clipboard";
|
|
17
|
-
import { EMPTY, ReplaySubject, Subject, forkJoin, fromEvent, interval, lastValueFrom, merge, of, race, timer } from "rxjs";
|
|
17
|
+
import { BehaviorSubject, EMPTY, ReplaySubject, Subject, forkJoin, fromEvent, interval, lastValueFrom, merge, of, race, timer } from "rxjs";
|
|
18
18
|
import { catchError, debounceTime, delay, distinctUntilChanged, filter, map, pluck, skipUntil, skipWhile, switchMap, take, takeUntil, tap } from "rxjs/operators";
|
|
19
19
|
import { DateTime, Info } from "luxon";
|
|
20
20
|
import { cloneDeep, get, isEqual, orderBy, range, sortBy, uniqueId, upperFirst } from "lodash-es";
|
|
@@ -192,6 +192,7 @@ var ButtonComponent = class ButtonComponent {
|
|
|
192
192
|
iconColor: "iconColor",
|
|
193
193
|
label: "label",
|
|
194
194
|
ariaLabel: "ariaLabel",
|
|
195
|
+
ariaPressed: "ariaPressed",
|
|
195
196
|
ariaExpanded: "ariaExpanded",
|
|
196
197
|
ariaHaspopup: "ariaHaspopup",
|
|
197
198
|
ariaActivedescendant: "ariaActivedescendant",
|
|
@@ -216,8 +217,8 @@ var ButtonComponent = class ButtonComponent {
|
|
|
216
217
|
}],
|
|
217
218
|
usesOnChanges: true,
|
|
218
219
|
ngImport: i0,
|
|
219
|
-
template: "<button id=\"{{id}}_button\"\n class=\"ec-button-{{customTemplate ? 'custom' : type}}\"\n [class.has-badge]=\"badge !== undefined\"\n [class.icon-only]=\"icon && !label\"\n [class.locked]=\"lockButton\"\n [class.has-custom-icon-color]=\"iconColor\"\n [style.--ec-button-custom-icon-color]=\"iconColor\"\n tabindex=\"{{tabindex}}\"\n [type]=\"type === 'submit' || isSubmit ? 'submit' : 'button'\"\n [disabled]=\"disabled\"\n
|
|
220
|
-
styles: [":host{display:inline-block;vertical-align:top}:host(.font-size-inherit){font-size:inherit}:host(.font-size-inherit) button{font-size:inherit}:host(.text-left) button{justify-content:flex-start}:host(.text-right) button{justify-content:flex-end}:host(.active) .ec-button-icon,:host(.active) .ec-button-text,:host(.active) .ec-button-link,:host(.active) .ec-button-danger-text,:host(.active) .ec-button-custom,:host(.active) .ec-button-secondary,:host(.active) .ec-button-primary{background-color:var(--ec-background-color-selected);color:var(--ec-button-color-active)}:host(.active) .ec-button-icon .ec-icon,:host(.active) .ec-button-text .ec-icon,:host(.active) .ec-button-link .ec-icon,:host(.active) .ec-button-danger-text .ec-icon,:host(.active) .ec-button-custom .ec-icon,:host(.active) .ec-button-secondary .ec-icon,:host(.active) .ec-button-primary .ec-icon{color:var(--ec-button-color-icon-active, var(--ec-color-icon))}:host(.d-block) button{width:100%}:host(.border-0) button:not(:focus){border-color:transparent}:host(.is-action-icon) .ec-button-icon{color:var(--ec-color-interactive)}:host(.is-success) .ec-button-icon,:host(.is-success) .ec-button-secondary,:host(.is-success) .ec-button-text{color:var(--ec-color-success)}:host(.is-error) .ec-button-icon,:host(.is-error) .ec-button-secondary,:host(.is-error) .ec-button-text{color:var(--ec-color-danger)}:host-context(.btn-stack) button{height:1rem}:host-context(.btn-stack) .ec-icon{width:.0625rem;height:.0625rem}:host-context(.actions-col) button{border-radius:0}.ec-button-primary,.ec-button-submit{background-color:var(--ec-button-background-color-primary, var(--ec-color-gray-8));color:var(--ec-button-color-primary, var(--ec-color-primary-light))}.ec-button-primary:active:not(:disabled),.ec-button-submit:active:not(:disabled){background-color:var(--ec-button-background-color-active, var(--ec-background-color-selected));color:var(--ec-button-color-active, var(--ec-color-primary-dark));box-shadow:var(--ec-button-box-shadow-active, 0 0 0 2px var(--ec-border-color-focus))}.ec-button-primary:focus,.ec-button-submit:focus{box-shadow:var(--ec-button-box-shadow-focus-primary, 0 0 0 2px var(--ec-color-interactive), inset 0 0 0 2px var(--ec-color-white))}.ec-button-primary .ec-icon,.ec-button-submit .ec-icon{color:var(--ec-button-color-icon-primary, var(--ec-color-primary-light))}.ec-button-primary.locked:hover,.ec-button-primary.locked:active,.ec-button-primary.locked:focus,.ec-button-submit.locked:hover,.ec-button-submit.locked:active,.ec-button-submit.locked:focus{background-color:var(--ec-button-background-color-primary, var(--ec-color-gray-8))!important;color:var(--ec-button-color-primary, var(--ec-color-primary-light))!important;border-color:initial!important;box-shadow:none!important;outline:none!important}.ec-button-primary.locked:hover .ec-icon,.ec-button-primary.locked:active .ec-icon,.ec-button-primary.locked:focus .ec-icon,.ec-button-submit.locked:hover .ec-icon,.ec-button-submit.locked:active .ec-icon,.ec-button-submit.locked:focus .ec-icon{color:var(--ec-button-color-icon-primary, var(--ec-color-primary-light))!important}.ec-button-secondary{background-color:var(--ec-button-background-color-secondary, var(--ec-background-color));border:1px solid var(--ec-button-border-color-secondary, var(--ec-color-gray-8));color:var(--ec-button-color-secondary, var(--ec-color-primary-dark))}.ec-button-secondary:active:not(:disabled){background-color:var(--ec-button-background-color-active, var(--ec-background-color-selected));color:var(--ec-button-color-active, var(--ec-color-primary-dark));box-shadow:var(--ec-button-box-shadow-active, 0 0 0 2px var(--ec-border-color-focus));border-color:transparent}.ec-button-secondary:focus{box-shadow:var(--ec-button-box-shadow-focus-secondary, 0 0 0 2px var(--ec-border-color-focus));border-color:var(--ec-button-border-color-secondary-focus, transparent)}.ec-button-secondary .ec-icon{color:var(--ec-button-color-icon-secondary, var(--ec-color-icon))}.ec-button-secondary.locked:hover,.ec-button-secondary.locked:active,.ec-button-secondary.locked:focus{background-color:var(--ec-button-background-color-secondary, var(--ec-background-color))!important;border:1px solid var(--ec-button-border-color-secondary, var(--ec-color-gray-8))!important;color:var(--ec-button-color-secondary, var(--ec-color-primary-dark))!important;box-shadow:none!important;outline:none!important}.ec-button-secondary.locked:hover .ec-icon,.ec-button-secondary.locked:active .ec-icon,.ec-button-secondary.locked:focus .ec-icon{color:var(--ec-button-color-icon-secondary, var(--ec-color-icon))!important}.ec-button-common{background-color:var(--ec-button-background-color-secondary, var(--ec-background-color));border:1px solid var(--ec-button-border-color-secondary, var(--ec-color-gray-8));color:var(--ec-button-color-secondary, var(--ec-color-primary-dark))}.ec-button-common:active:not(:disabled){background-color:var(--ec-button-background-color-active, var(--ec-background-color-selected));color:var(--ec-button-color-active, var(--ec-color-primary-dark));box-shadow:var(--ec-button-box-shadow-active, 0 0 0 2px var(--ec-border-color-focus));border-color:transparent}.ec-button-common:focus{box-shadow:var(--ec-button-box-shadow-focus-secondary, 0 0 0 2px var(--ec-border-color-focus));border-color:var(--ec-button-border-color-secondary-focus, transparent)}.ec-button-common .ec-icon{color:var(--ec-button-color-icon-secondary, var(--ec-color-icon))}.ec-button-common.locked:hover,.ec-button-common.locked:active,.ec-button-common.locked:focus{background-color:var(--ec-button-background-color-secondary, var(--ec-background-color))!important;border:1px solid var(--ec-button-border-color-secondary, var(--ec-color-gray-8))!important;color:var(--ec-button-color-secondary, var(--ec-color-primary-dark))!important;box-shadow:none!important;outline:none!important}.ec-button-common.locked:hover .ec-icon,.ec-button-common.locked:active .ec-icon,.ec-button-common.locked:focus .ec-icon{color:var(--ec-button-color-icon-secondary, var(--ec-color-icon))!important}.ec-button-icon{background-color:transparent;color:var(--ec-button-color-icon, var(--ec-color-icon));width:2rem;padding:0}.ec-button-icon .ec-icon{height:1rem;margin:0;padding:0;color:inherit}.ec-button-icon:hover:not(:disabled){background-color:var(--ec-background-color-hover)}.ec-button-icon:hover:not(:disabled) .ec-icon{color:var(--ec-button-color-icon-hover, var(--ec-button-color-icon, var(--ec-color-icon)))}.ec-button-icon:active:not(:disabled),.ec-button-icon:focus{box-shadow:var(--ec-button-box-shadow-active, 0 0 0 2px var(--ec-border-color-focus))}.ec-button-icon:active:not(:disabled){background-color:var(--ec-background-color-selected)}.ec-button-icon:disabled{background-color:transparent;border-color:transparent}.ec-button-icon:disabled .ec-icon{color:var(--ec-color-disabled-dark)}.ec-button-icon.has-badge{width:auto;min-width:2rem;padding-right:0;padding-left:.375rem}.ec-button-icon .badge{margin-left:-.5rem}.ec-button-icon.locked:hover,.ec-button-icon.locked:active,.ec-button-icon.locked:focus{background-color:transparent!important;color:var(--ec-button-color-icon, var(--ec-color-icon))!important;border-color:transparent!important;box-shadow:none!important;outline:none!important}.ec-button-icon.locked:hover .ec-icon,.ec-button-icon.locked:active .ec-icon,.ec-button-icon.locked:focus .ec-icon{color:var(--ec-button-color-icon, var(--ec-color-icon))!important}.ec-button-text{background-color:transparent;color:var(--ec-button-color-text, var(--ec-color-primary-dark))}.ec-button-text .ec-icon{color:var(--ec-button-color-icon-text, inherit)}.ec-button-text:active:not(:disabled),.ec-button-text:focus{box-shadow:var(--ec-button-box-shadow-active, 0 0 0 2px var(--ec-border-color-focus))}.ec-button-text:disabled{background-color:transparent;border-color:transparent}.ec-button-text.locked:hover,.ec-button-text.locked:active,.ec-button-text.locked:focus{background-color:transparent!important;color:var(--ec-button-color-text, var(--ec-color-primary-dark))!important;border-color:transparent!important;box-shadow:none!important;outline:none!important}.ec-button-text.locked:hover .ec-icon,.ec-button-text.locked:active .ec-icon,.ec-button-text.locked:focus .ec-icon{color:var(--ec-button-color-icon-text, inherit)!important}.ec-button-link{background-color:transparent;color:var(--ec-button-color-text, var(--ec-color-link))}.ec-button-link .ec-icon{color:var(--ec-button-color-icon-link, inherit)}.ec-button-link:active:not(:disabled),.ec-button-link:focus{box-shadow:var(--ec-button-box-shadow-active, 0 0 0 2px var(--ec-border-color-focus))}.ec-button-link:disabled{background-color:transparent;border-color:transparent}.ec-button-link.locked:hover,.ec-button-link.locked:active,.ec-button-link.locked:focus{background-color:transparent!important;color:var(--ec-color-link)!important;border-color:transparent!important;box-shadow:none!important;outline:none!important}.ec-button-link.locked:hover .ec-icon,.ec-button-link.locked:active .ec-icon,.ec-button-link.locked:focus .ec-icon{color:var(--ec-button-color-icon-link, inherit)!important}.ec-button-danger{background-color:var(--ec-color-danger);color:var(--ec-color-primary-light)}.ec-button-danger .ec-icon{color:var(--ec-button-color-icon, inherit)}.ec-button-danger:active:not(:disabled){background-color:var(--ec-button-background-color-active, var(--ec-background-color-selected));color:var(--ec-button-color-active, var(--ec-color-primary-dark));box-shadow:var(--ec-button-box-shadow-active, 0 0 0 2px var(--ec-border-color-focus))}.ec-button-danger:focus{box-shadow:var(--ec-button-box-shadow-focus-primary, 0 0 0 2px var(--ec-border-color-focus), inset 0 0 0 2px var(--ec-color-white))}.ec-button-danger.locked:hover,.ec-button-danger.locked:active,.ec-button-danger.locked:focus{background-color:var(--ec-color-danger)!important;color:var(--ec-color-primary-light)!important;border-color:initial!important;box-shadow:none!important;outline:none!important}.ec-button-danger.locked:hover .ec-icon,.ec-button-danger.locked:active .ec-icon,.ec-button-danger.locked:focus .ec-icon{color:var(--ec-button-color-icon, inherit)!important}.ec-button-danger-text{background-color:transparent;color:var(--ec-button-color-text, var(--ec-color-danger))}.ec-button-danger-text .ec-icon{color:var(--ec-button-color-icon-danger-text, inherit)}.ec-button-danger-text:active:not(:disabled),.ec-button-danger-text:focus{box-shadow:var(--ec-button-box-shadow-active, 0 0 0 2px var(--ec-border-color-focus))}.ec-button-danger-text:disabled{background-color:transparent;border-color:transparent}.ec-button-danger-text.locked:hover,.ec-button-danger-text.locked:active,.ec-button-danger-text.locked:focus{background-color:transparent!important;color:var(--ec-color-danger)!important;border-color:transparent!important;box-shadow:none!important;outline:none!important}.ec-button-danger-text.locked:hover .ec-icon,.ec-button-danger-text.locked:active .ec-icon,.ec-button-danger-text.locked:focus .ec-icon{color:var(--ec-button-color-icon-danger-text, inherit)!important}.ec-button-card{background-color:var(--ec-button-background-color-secondary, var(--ec-background-color));border:1px solid var(--ec-button-border-color-secondary, var(--ec-color-gray-8));color:var(--ec-button-color-secondary, var(--ec-color-primary-dark))}.ec-button-card:active:not(:disabled){background-color:var(--ec-button-background-color-active, var(--ec-background-color-selected));color:var(--ec-button-color-active, var(--ec-color-primary-dark));box-shadow:var(--ec-button-box-shadow-active, 0 0 0 2px var(--ec-border-color-focus));border-color:transparent}.ec-button-card:focus{box-shadow:var(--ec-button-box-shadow-focus-secondary, 0 0 0 2px var(--ec-border-color-focus));border-color:var(--ec-button-border-color-secondary-focus, transparent)}.ec-button-card .ec-icon{color:var(--ec-button-color-icon-secondary, var(--ec-color-icon))}.ec-button-card{color:var(--ec-color-primary-dark);font-size:var(--ec-font-size);font-weight:var(--ec-font-weight-normal);line-height:1.285714286;margin:0;padding:1rem;height:auto;border:1px solid var(--ec-border-color);border-radius:var(--ec-border-radius);text-align:start}.ec-button-card:hover:not(:disabled):not(:focus){box-shadow:none;border-color:var(--ec-border-color-control-hover)}.ec-button-card{height:100%;width:100%}.ec-button-card.locked:hover,.ec-button-card.locked:active,.ec-button-card.locked:focus{background-color:var(--ec-button-background-color-secondary, var(--ec-background-color))!important;border:1px solid var(--ec-border-color)!important;color:var(--ec-button-color-secondary, var(--ec-color-primary-dark))!important;box-shadow:none!important;outline:none!important}.ec-button-card.locked:hover .ec-icon,.ec-button-card.locked:active .ec-icon,.ec-button-card.locked:focus .ec-icon{color:var(--ec-button-color-icon-secondary, var(--ec-color-icon))!important}.ec-button-custom{padding:0;background-color:transparent;height:auto}.ec-button-custom:disabled{background-color:transparent;border:0}button{font-size:var(--ec-font-size-action);height:2rem;line-height:1.25rem;padding:.3125rem .5rem;border:0;border-radius:var(--ec-border-radius);display:flex;align-items:center;justify-content:center;cursor:pointer}button .label{display:flex;align-items:center;justify-content:center;white-space:nowrap;flex:auto}button .ec-icon{flex:none}button .ec-icon+.label{flex:none;margin-left:.25rem}button.has-badge{padding-right:.0625rem}button:focus{outline:2px solid transparent;outline-offset:2px;position:relative;z-index:1}button:focus-visible{outline-color:var(--ec-border-color-focus)}button:disabled{background-color:var(--ec-background-color-disabled);border:1px solid var(--ec-form-control-border-color-disabled);color:var(--ec-color-disabled-dark);opacity:var(--ec-form-control-opacity-disabled);cursor:default}button:disabled .ec-icon{color:var(--ec-color-disabled-dark)}button{position:relative}button.icon-only{padding:0;width:2rem}button.locked{cursor:default!important}button.locked:hover,button.locked:active,button.locked:focus{transform:none!important;transition:none!important;animation:none!important}button.locked:hover .label,button.locked:active .label,button.locked:focus .label{color:inherit!important}button.locked:hover .badge,button.locked:active .badge,button.locked:focus .badge{color:inherit!important;background-color:inherit!important}button.has-custom-icon-color .ec-icon,button.has-custom-icon-color .pending-container .ec-icon{color:var(--ec-button-custom-icon-color)!important}button.has-custom-icon-color.locked:hover .ec-icon,button.has-custom-icon-color.locked:active .ec-icon,button.has-custom-icon-color.locked:focus .ec-icon{color:var(--ec-button-custom-icon-color)!important}:host(.textbox-group-btn-right){position:relative}:host(.textbox-group-btn-right) button{padding-left:.4375rem;padding-right:.4375rem;border-bottom-left-radius:0;border-top-left-radius:0;margin-left:-1px}:host(.is-tab) button{padding-left:.5rem;padding-right:.5rem;border-radius:var(--ec-border-radius);border:1px solid var(--ec-tab-border-color, var(--ec-border-color));align-items:center;color:var(--ec-tab-color, var(--ec-color-secondary-dark));cursor:pointer;font-size:var(--ec-tab-font-size, var(--ec-font-size-label));display:flex;height:1.75rem;min-width:1.75rem;justify-content:center}:host(.is-tab) button.active{color:var(--ec-tab-color-active, var(--ec-color-interactive));background-color:var(--ec-tab-background-color-active, var(--ec-background-color))}:host(.is-tab) button:hover,:host(.is-tab) button:focus{border-color:var(--ec-tab-border-color-active, var(--ec-border-color-focus));box-shadow:0 0 0 1px var(--ec-tab-border-color-active, var(--ec-border-color-focus));position:relative;z-index:1}:host(.is-tab) button:focus{outline:2px solid transparent;outline-offset:-2px}:host(.is-tab) button:focus-visible{outline-color:var(--ec-border-color-focus)}:host(.is-tab) button.is-disabled{opacity:var(--ec-form-control-opacity-disabled);cursor:default;pointer-events:none}:host(.is-tab) button.ec-button-icon{padding:0;justify-content:center}:host(.is-tab) button.ec-button-icon .ec-icon{color:inherit}:host(.is-tab) button.ec-button-icon{width:auto}:host(.is-tab) button:hover{background-color:transparent}:host(.is-tab).active button{color:var(--ec-tab-color-active, var(--ec-color-interactive));background-color:var(--ec-tab-background-color-active, var(--ec-background-color))}.pending-container{display:flex;align-items:center;justify-content:center;position:absolute;inset:0;z-index:1}.pending-container>.ec-icon{flex:none;color:inherit}.pending-container~.ec-icon,.pending-container~.label,.pending-container~.badge{opacity:0}.badge{margin-left:-.25rem;margin-top:-.75rem}\n"],
|
|
220
|
+
template: "<button id=\"{{id}}_button\"\n class=\"ec-button-{{customTemplate ? 'custom' : type}}\"\n [class.has-badge]=\"badge !== undefined\"\n [class.icon-only]=\"icon && !label\"\n [class.locked]=\"lockButton\"\n [class.has-custom-icon-color]=\"iconColor\"\n [style.--ec-button-custom-icon-color]=\"iconColor\"\n tabindex=\"{{tabindex}}\"\n [type]=\"type === 'submit' || isSubmit ? 'submit' : 'button'\"\n [disabled]=\"disabled\"\n [attr.aria-label]=\"ariaLabel && !label ? (ariaLabel | translate) : null\"\n [attr.aria-pressed]=\"ariaPressed !== undefined ? ariaPressed : null\"\n [attr.aria-expanded]=\"ariaExpanded !== undefined ? ariaExpanded : null\"\n [attr.aria-haspopup]=\"ariaHaspopup || null\"\n [attr.aria-activedescendant]=\"ariaActivedescendant || null\"\n [attr.aria-controls]=\"ariaControls || null\"\n (click)=\"onClick($event)\"\n #element\n [attr.cdkFocusInitial]=\"autofocus || null\">\n @if (customTemplate) {\n <ng-container *ngTemplateOutlet=\"customTemplate\"></ng-container>\n } @else {\n <!-- Hidden when the button is not pending -->\n @if (pending) {\n <div class=\"pending-container\">\n <i class=\"ec-icon {{pendingIcon}}\"\n id=\"{{id}}_pending\"\n [attr.aria-hidden]=\"hasExplicitAccessibleName ? 'true' : null\"></i>\n </div>\n }\n @if (icon) {\n <i class=\"ec-icon {{icon}}\"\n id=\"{{id}}_icon\"\n [attr.aria-hidden]=\"hasExplicitAccessibleName ? 'true' : null\"></i>\n }\n @if (label) {\n <span id=\"{{id}}_label\"\n class=\"label\">{{label | translate}}</span>\n }\n @if (badge !== undefined) {\n <span id=\"{{id}}_badge\"\n class=\"badge\">{{badge}}</span>\n }\n }\n <ng-content></ng-content>\n</button>",
|
|
221
|
+
styles: [":host{display:inline-block;vertical-align:top}:host(.font-size-inherit){font-size:inherit}:host(.font-size-inherit) button{font-size:inherit}:host(.text-left) button{justify-content:flex-start}:host(.text-right) button{justify-content:flex-end}:host(.active) .ec-button-icon,:host(.active) .ec-button-text,:host(.active) .ec-button-link,:host(.active) .ec-button-danger-text,:host(.active) .ec-button-custom,:host(.active) .ec-button-secondary,:host(.active) .ec-button-primary{background-color:var(--ec-background-color-selected);color:var(--ec-button-color-active)}:host(.active) .ec-button-icon .ec-icon,:host(.active) .ec-button-text .ec-icon,:host(.active) .ec-button-link .ec-icon,:host(.active) .ec-button-danger-text .ec-icon,:host(.active) .ec-button-custom .ec-icon,:host(.active) .ec-button-secondary .ec-icon,:host(.active) .ec-button-primary .ec-icon{color:var(--ec-button-color-icon-active, var(--ec-color-icon))}:host(.d-block) button{width:100%}:host(.border-0) button:not(:focus){border-color:transparent}:host(.is-action-icon) .ec-button-icon{color:var(--ec-color-interactive)}:host(.is-success) .ec-button-icon,:host(.is-success) .ec-button-secondary,:host(.is-success) .ec-button-text{color:var(--ec-color-success)}:host(.is-error) .ec-button-icon,:host(.is-error) .ec-button-secondary,:host(.is-error) .ec-button-text{color:var(--ec-color-danger)}:host-context(.btn-stack) button{height:1rem}:host-context(.btn-stack) .ec-icon{width:.0625rem;height:.0625rem}:host-context(.actions-col) button{border-radius:0}.ec-button-primary,.ec-button-submit{background-color:var(--ec-button-background-color-primary, var(--ec-color-gray-8));color:var(--ec-button-color-primary, var(--ec-color-primary-light))}.ec-button-primary:active:not(:disabled),.ec-button-submit:active:not(:disabled){background-color:var(--ec-button-background-color-active, var(--ec-background-color-selected));color:var(--ec-button-color-active, var(--ec-color-primary-dark));box-shadow:var(--ec-button-box-shadow-active, 0 0 0 2px var(--ec-border-color-focus))}.ec-button-primary:focus,.ec-button-submit:focus{box-shadow:var(--ec-button-box-shadow-focus-primary, 0 0 0 2px var(--ec-color-interactive), inset 0 0 0 2px var(--ec-color-white))}.ec-button-primary .ec-icon,.ec-button-submit .ec-icon{color:var(--ec-button-color-icon-primary, var(--ec-color-primary-light))}.ec-button-primary.locked:hover,.ec-button-primary.locked:active,.ec-button-primary.locked:focus,.ec-button-submit.locked:hover,.ec-button-submit.locked:active,.ec-button-submit.locked:focus{background-color:var(--ec-button-background-color-primary, var(--ec-color-gray-8))!important;color:var(--ec-button-color-primary, var(--ec-color-primary-light))!important;border-color:initial!important;box-shadow:none!important;outline:none!important}.ec-button-primary.locked:hover .ec-icon,.ec-button-primary.locked:active .ec-icon,.ec-button-primary.locked:focus .ec-icon,.ec-button-submit.locked:hover .ec-icon,.ec-button-submit.locked:active .ec-icon,.ec-button-submit.locked:focus .ec-icon{color:var(--ec-button-color-icon-primary, var(--ec-color-primary-light))!important}.ec-button-secondary{background-color:var(--ec-button-background-color-secondary, var(--ec-background-color));border:1px solid var(--ec-button-border-color-secondary, var(--ec-color-gray-8));color:var(--ec-button-color-secondary, var(--ec-color-primary-dark))}.ec-button-secondary:active:not(:disabled){background-color:var(--ec-button-background-color-active, var(--ec-background-color-selected));color:var(--ec-button-color-active, var(--ec-color-primary-dark));box-shadow:var(--ec-button-box-shadow-active, 0 0 0 2px var(--ec-border-color-focus));border-color:transparent}.ec-button-secondary:focus{box-shadow:var(--ec-button-box-shadow-focus-secondary, 0 0 0 2px var(--ec-border-color-focus));border-color:var(--ec-button-border-color-secondary-focus, transparent)}.ec-button-secondary .ec-icon{color:var(--ec-button-color-icon-secondary, var(--ec-color-icon))}.ec-button-secondary.locked:hover,.ec-button-secondary.locked:active,.ec-button-secondary.locked:focus{background-color:var(--ec-button-background-color-secondary, var(--ec-background-color))!important;border:1px solid var(--ec-button-border-color-secondary, var(--ec-color-gray-8))!important;color:var(--ec-button-color-secondary, var(--ec-color-primary-dark))!important;box-shadow:none!important;outline:none!important}.ec-button-secondary.locked:hover .ec-icon,.ec-button-secondary.locked:active .ec-icon,.ec-button-secondary.locked:focus .ec-icon{color:var(--ec-button-color-icon-secondary, var(--ec-color-icon))!important}.ec-button-common{background-color:var(--ec-button-background-color-secondary, var(--ec-background-color));border:1px solid var(--ec-button-border-color-secondary, var(--ec-color-gray-8));color:var(--ec-button-color-secondary, var(--ec-color-primary-dark))}.ec-button-common:active:not(:disabled){background-color:var(--ec-button-background-color-active, var(--ec-background-color-selected));color:var(--ec-button-color-active, var(--ec-color-primary-dark));box-shadow:var(--ec-button-box-shadow-active, 0 0 0 2px var(--ec-border-color-focus));border-color:transparent}.ec-button-common:focus{box-shadow:var(--ec-button-box-shadow-focus-secondary, 0 0 0 2px var(--ec-border-color-focus));border-color:var(--ec-button-border-color-secondary-focus, transparent)}.ec-button-common .ec-icon{color:var(--ec-button-color-icon-secondary, var(--ec-color-icon))}.ec-button-common.locked:hover,.ec-button-common.locked:active,.ec-button-common.locked:focus{background-color:var(--ec-button-background-color-secondary, var(--ec-background-color))!important;border:1px solid var(--ec-button-border-color-secondary, var(--ec-color-gray-8))!important;color:var(--ec-button-color-secondary, var(--ec-color-primary-dark))!important;box-shadow:none!important;outline:none!important}.ec-button-common.locked:hover .ec-icon,.ec-button-common.locked:active .ec-icon,.ec-button-common.locked:focus .ec-icon{color:var(--ec-button-color-icon-secondary, var(--ec-color-icon))!important}.ec-button-icon{background-color:transparent;color:var(--ec-button-color-icon, var(--ec-color-icon));width:2rem;padding:0}.ec-button-icon .ec-icon{height:1rem;margin:0;padding:0;color:inherit}.ec-button-icon:hover:not(:disabled){background-color:var(--ec-background-color-hover)}.ec-button-icon:hover:not(:disabled) .ec-icon{color:var(--ec-button-color-icon-hover, var(--ec-button-color-icon, var(--ec-color-icon)))}.ec-button-icon:active:not(:disabled),.ec-button-icon:focus{box-shadow:var(--ec-button-box-shadow-active, 0 0 0 2px var(--ec-border-color-focus))}.ec-button-icon:active:not(:disabled){background-color:var(--ec-background-color-selected)}.ec-button-icon:disabled{background-color:transparent;border-color:transparent}.ec-button-icon:disabled .ec-icon{color:var(--ec-color-disabled-dark)}.ec-button-icon.has-badge{width:auto;min-width:2rem;padding-right:0;padding-left:.375rem}.ec-button-icon .badge{margin-left:-.5rem}.ec-button-icon.locked:hover,.ec-button-icon.locked:active,.ec-button-icon.locked:focus{background-color:transparent!important;color:var(--ec-button-color-icon, var(--ec-color-icon))!important;border-color:transparent!important;box-shadow:none!important;outline:none!important}.ec-button-icon.locked:hover .ec-icon,.ec-button-icon.locked:active .ec-icon,.ec-button-icon.locked:focus .ec-icon{color:var(--ec-button-color-icon, var(--ec-color-icon))!important}.ec-button-text{background-color:transparent;color:var(--ec-button-color-text, var(--ec-color-primary-dark))}.ec-button-text .ec-icon{color:var(--ec-button-color-icon-text, inherit)}.ec-button-text:active:not(:disabled),.ec-button-text:focus{box-shadow:var(--ec-button-box-shadow-active, 0 0 0 2px var(--ec-border-color-focus))}.ec-button-text:disabled{background-color:transparent;border-color:transparent}.ec-button-text.locked:hover,.ec-button-text.locked:active,.ec-button-text.locked:focus{background-color:transparent!important;color:var(--ec-button-color-text, var(--ec-color-primary-dark))!important;border-color:transparent!important;box-shadow:none!important;outline:none!important}.ec-button-text.locked:hover .ec-icon,.ec-button-text.locked:active .ec-icon,.ec-button-text.locked:focus .ec-icon{color:var(--ec-button-color-icon-text, inherit)!important}.ec-button-link{background-color:transparent;color:var(--ec-button-color-text, var(--ec-color-link))}.ec-button-link .ec-icon{color:var(--ec-button-color-icon-link, inherit)}.ec-button-link:active:not(:disabled),.ec-button-link:focus{box-shadow:var(--ec-button-box-shadow-active, 0 0 0 2px var(--ec-border-color-focus))}.ec-button-link:disabled{background-color:transparent;border-color:transparent}.ec-button-link.locked:hover,.ec-button-link.locked:active,.ec-button-link.locked:focus{background-color:transparent!important;color:var(--ec-color-link)!important;border-color:transparent!important;box-shadow:none!important;outline:none!important}.ec-button-link.locked:hover .ec-icon,.ec-button-link.locked:active .ec-icon,.ec-button-link.locked:focus .ec-icon{color:var(--ec-button-color-icon-link, inherit)!important}.ec-button-danger{background-color:var(--ec-color-danger);color:var(--ec-color-primary-light)}.ec-button-danger .ec-icon{color:var(--ec-button-color-icon, inherit)}.ec-button-danger:active:not(:disabled){background-color:var(--ec-button-background-color-active, var(--ec-background-color-selected));color:var(--ec-button-color-active, var(--ec-color-primary-dark));box-shadow:var(--ec-button-box-shadow-active, 0 0 0 2px var(--ec-border-color-focus))}.ec-button-danger:focus{box-shadow:var(--ec-button-box-shadow-focus-primary, 0 0 0 2px var(--ec-border-color-focus), inset 0 0 0 2px var(--ec-color-white))}.ec-button-danger.locked:hover,.ec-button-danger.locked:active,.ec-button-danger.locked:focus{background-color:var(--ec-color-danger)!important;color:var(--ec-color-primary-light)!important;border-color:initial!important;box-shadow:none!important;outline:none!important}.ec-button-danger.locked:hover .ec-icon,.ec-button-danger.locked:active .ec-icon,.ec-button-danger.locked:focus .ec-icon{color:var(--ec-button-color-icon, inherit)!important}.ec-button-danger-text{background-color:transparent;color:var(--ec-button-color-text, var(--ec-color-danger))}.ec-button-danger-text .ec-icon{color:var(--ec-button-color-icon-danger-text, inherit)}.ec-button-danger-text:active:not(:disabled),.ec-button-danger-text:focus{box-shadow:var(--ec-button-box-shadow-active, 0 0 0 2px var(--ec-border-color-focus))}.ec-button-danger-text:disabled{background-color:transparent;border-color:transparent}.ec-button-danger-text.locked:hover,.ec-button-danger-text.locked:active,.ec-button-danger-text.locked:focus{background-color:transparent!important;color:var(--ec-color-danger)!important;border-color:transparent!important;box-shadow:none!important;outline:none!important}.ec-button-danger-text.locked:hover .ec-icon,.ec-button-danger-text.locked:active .ec-icon,.ec-button-danger-text.locked:focus .ec-icon{color:var(--ec-button-color-icon-danger-text, inherit)!important}.ec-button-card{background-color:var(--ec-button-background-color-secondary, var(--ec-background-color));border:1px solid var(--ec-button-border-color-secondary, var(--ec-color-gray-8));color:var(--ec-button-color-secondary, var(--ec-color-primary-dark))}.ec-button-card:active:not(:disabled){background-color:var(--ec-button-background-color-active, var(--ec-background-color-selected));color:var(--ec-button-color-active, var(--ec-color-primary-dark));box-shadow:var(--ec-button-box-shadow-active, 0 0 0 2px var(--ec-border-color-focus));border-color:transparent}.ec-button-card:focus{box-shadow:var(--ec-button-box-shadow-focus-secondary, 0 0 0 2px var(--ec-border-color-focus));border-color:var(--ec-button-border-color-secondary-focus, transparent)}.ec-button-card .ec-icon{color:var(--ec-button-color-icon-secondary, var(--ec-color-icon))}.ec-button-card{color:var(--ec-color-primary-dark);font-size:var(--ec-font-size);font-weight:var(--ec-font-weight-normal);line-height:1.285714286;margin:0;padding:1rem;height:auto;border:1px solid var(--ec-border-color);border-radius:var(--ec-border-radius);text-align:start}.ec-button-card:hover:not(:disabled):not(:focus){box-shadow:none;border-color:var(--ec-border-color-control-hover)}.ec-button-card{height:100%;width:100%}.ec-button-card.locked:hover,.ec-button-card.locked:active,.ec-button-card.locked:focus{background-color:var(--ec-button-background-color-secondary, var(--ec-background-color))!important;border:1px solid var(--ec-border-color)!important;color:var(--ec-button-color-secondary, var(--ec-color-primary-dark))!important;box-shadow:none!important;outline:none!important}.ec-button-card.locked:hover .ec-icon,.ec-button-card.locked:active .ec-icon,.ec-button-card.locked:focus .ec-icon{color:var(--ec-button-color-icon-secondary, var(--ec-color-icon))!important}.ec-button-custom{padding:0;background-color:transparent;height:auto}.ec-button-custom:disabled{background-color:transparent;border:0}button{font-size:var(--ec-font-size-action);height:2rem;line-height:1.25rem;padding:.3125rem .5rem;border:0;border-radius:var(--ec-border-radius);color:inherit;display:flex;align-items:center;justify-content:center;cursor:pointer}button .label{display:flex;align-items:center;justify-content:center;white-space:nowrap;flex:auto}button .ec-icon{flex:none}button .ec-icon+.label{flex:none;margin-left:.25rem}button.has-badge{padding-right:.0625rem}button:focus{outline:2px solid transparent;outline-offset:2px;position:relative;z-index:1}button:focus-visible{outline-color:var(--ec-border-color-focus)}button:disabled{background-color:var(--ec-background-color-disabled);border:1px solid var(--ec-form-control-border-color-disabled);color:var(--ec-color-disabled-dark);opacity:var(--ec-form-control-opacity-disabled);cursor:default}button:disabled .ec-icon{color:var(--ec-color-disabled-dark)}button{position:relative}button.icon-only{padding:0;width:2rem}button.locked{cursor:default!important}button.locked:hover,button.locked:active,button.locked:focus{transform:none!important;transition:none!important;animation:none!important}button.locked:hover .label,button.locked:active .label,button.locked:focus .label{color:inherit!important}button.locked:hover .badge,button.locked:active .badge,button.locked:focus .badge{color:inherit!important;background-color:inherit!important}button.has-custom-icon-color .ec-icon,button.has-custom-icon-color .pending-container .ec-icon{color:var(--ec-button-custom-icon-color)!important}button.has-custom-icon-color.locked:hover .ec-icon,button.has-custom-icon-color.locked:active .ec-icon,button.has-custom-icon-color.locked:focus .ec-icon{color:var(--ec-button-custom-icon-color)!important}:host(.textbox-group-btn-right){position:relative}:host(.textbox-group-btn-right) button{padding-left:.4375rem;padding-right:.4375rem;border-bottom-left-radius:0;border-top-left-radius:0;margin-left:-1px}:host(.is-tab) button{padding-left:.5rem;padding-right:.5rem;border-radius:var(--ec-border-radius);border:1px solid var(--ec-tab-border-color, var(--ec-border-color));align-items:center;color:var(--ec-tab-color, var(--ec-color-secondary-dark));cursor:pointer;font-size:var(--ec-tab-font-size, var(--ec-font-size-label));display:flex;height:1.75rem;min-width:1.75rem;justify-content:center}:host(.is-tab) button.active{color:var(--ec-tab-color-active, var(--ec-color-interactive));background-color:var(--ec-tab-background-color-active, var(--ec-background-color))}:host(.is-tab) button:hover,:host(.is-tab) button:focus{border-color:var(--ec-tab-border-color-active, var(--ec-border-color-focus));box-shadow:0 0 0 1px var(--ec-tab-border-color-active, var(--ec-border-color-focus));position:relative;z-index:1}:host(.is-tab) button:focus{outline:2px solid transparent;outline-offset:-2px}:host(.is-tab) button:focus-visible{outline-color:var(--ec-border-color-focus)}:host(.is-tab) button.is-disabled{opacity:var(--ec-form-control-opacity-disabled);cursor:default;pointer-events:none}:host(.is-tab) button.ec-button-icon{padding:0;justify-content:center}:host(.is-tab) button.ec-button-icon .ec-icon{color:inherit}:host(.is-tab) button.ec-button-icon{width:auto}:host(.is-tab) button:hover{background-color:transparent}:host(.is-tab).active button{color:var(--ec-tab-color-active, var(--ec-color-interactive));background-color:var(--ec-tab-background-color-active, var(--ec-background-color))}.pending-container{display:flex;align-items:center;justify-content:center;position:absolute;inset:0;z-index:1}.pending-container>.ec-icon{flex:none;color:inherit}.pending-container~.ec-icon,.pending-container~.label,.pending-container~.badge{opacity:0}.badge{margin-left:-.25rem;margin-top:-.75rem}\n"],
|
|
221
222
|
dependencies: [{
|
|
222
223
|
kind: "directive",
|
|
223
224
|
type: i1$3.NgTemplateOutlet,
|
|
@@ -247,8 +248,8 @@ i0.ɵɵngDeclareClassMetadata({
|
|
|
247
248
|
selector: "ec-button",
|
|
248
249
|
changeDetection: ChangeDetectionStrategy.Eager,
|
|
249
250
|
standalone: false,
|
|
250
|
-
template: "<button id=\"{{id}}_button\"\n class=\"ec-button-{{customTemplate ? 'custom' : type}}\"\n [class.has-badge]=\"badge !== undefined\"\n [class.icon-only]=\"icon && !label\"\n [class.locked]=\"lockButton\"\n [class.has-custom-icon-color]=\"iconColor\"\n [style.--ec-button-custom-icon-color]=\"iconColor\"\n tabindex=\"{{tabindex}}\"\n [type]=\"type === 'submit' || isSubmit ? 'submit' : 'button'\"\n [disabled]=\"disabled\"\n
|
|
251
|
-
styles: [":host{display:inline-block;vertical-align:top}:host(.font-size-inherit){font-size:inherit}:host(.font-size-inherit) button{font-size:inherit}:host(.text-left) button{justify-content:flex-start}:host(.text-right) button{justify-content:flex-end}:host(.active) .ec-button-icon,:host(.active) .ec-button-text,:host(.active) .ec-button-link,:host(.active) .ec-button-danger-text,:host(.active) .ec-button-custom,:host(.active) .ec-button-secondary,:host(.active) .ec-button-primary{background-color:var(--ec-background-color-selected);color:var(--ec-button-color-active)}:host(.active) .ec-button-icon .ec-icon,:host(.active) .ec-button-text .ec-icon,:host(.active) .ec-button-link .ec-icon,:host(.active) .ec-button-danger-text .ec-icon,:host(.active) .ec-button-custom .ec-icon,:host(.active) .ec-button-secondary .ec-icon,:host(.active) .ec-button-primary .ec-icon{color:var(--ec-button-color-icon-active, var(--ec-color-icon))}:host(.d-block) button{width:100%}:host(.border-0) button:not(:focus){border-color:transparent}:host(.is-action-icon) .ec-button-icon{color:var(--ec-color-interactive)}:host(.is-success) .ec-button-icon,:host(.is-success) .ec-button-secondary,:host(.is-success) .ec-button-text{color:var(--ec-color-success)}:host(.is-error) .ec-button-icon,:host(.is-error) .ec-button-secondary,:host(.is-error) .ec-button-text{color:var(--ec-color-danger)}:host-context(.btn-stack) button{height:1rem}:host-context(.btn-stack) .ec-icon{width:.0625rem;height:.0625rem}:host-context(.actions-col) button{border-radius:0}.ec-button-primary,.ec-button-submit{background-color:var(--ec-button-background-color-primary, var(--ec-color-gray-8));color:var(--ec-button-color-primary, var(--ec-color-primary-light))}.ec-button-primary:active:not(:disabled),.ec-button-submit:active:not(:disabled){background-color:var(--ec-button-background-color-active, var(--ec-background-color-selected));color:var(--ec-button-color-active, var(--ec-color-primary-dark));box-shadow:var(--ec-button-box-shadow-active, 0 0 0 2px var(--ec-border-color-focus))}.ec-button-primary:focus,.ec-button-submit:focus{box-shadow:var(--ec-button-box-shadow-focus-primary, 0 0 0 2px var(--ec-color-interactive), inset 0 0 0 2px var(--ec-color-white))}.ec-button-primary .ec-icon,.ec-button-submit .ec-icon{color:var(--ec-button-color-icon-primary, var(--ec-color-primary-light))}.ec-button-primary.locked:hover,.ec-button-primary.locked:active,.ec-button-primary.locked:focus,.ec-button-submit.locked:hover,.ec-button-submit.locked:active,.ec-button-submit.locked:focus{background-color:var(--ec-button-background-color-primary, var(--ec-color-gray-8))!important;color:var(--ec-button-color-primary, var(--ec-color-primary-light))!important;border-color:initial!important;box-shadow:none!important;outline:none!important}.ec-button-primary.locked:hover .ec-icon,.ec-button-primary.locked:active .ec-icon,.ec-button-primary.locked:focus .ec-icon,.ec-button-submit.locked:hover .ec-icon,.ec-button-submit.locked:active .ec-icon,.ec-button-submit.locked:focus .ec-icon{color:var(--ec-button-color-icon-primary, var(--ec-color-primary-light))!important}.ec-button-secondary{background-color:var(--ec-button-background-color-secondary, var(--ec-background-color));border:1px solid var(--ec-button-border-color-secondary, var(--ec-color-gray-8));color:var(--ec-button-color-secondary, var(--ec-color-primary-dark))}.ec-button-secondary:active:not(:disabled){background-color:var(--ec-button-background-color-active, var(--ec-background-color-selected));color:var(--ec-button-color-active, var(--ec-color-primary-dark));box-shadow:var(--ec-button-box-shadow-active, 0 0 0 2px var(--ec-border-color-focus));border-color:transparent}.ec-button-secondary:focus{box-shadow:var(--ec-button-box-shadow-focus-secondary, 0 0 0 2px var(--ec-border-color-focus));border-color:var(--ec-button-border-color-secondary-focus, transparent)}.ec-button-secondary .ec-icon{color:var(--ec-button-color-icon-secondary, var(--ec-color-icon))}.ec-button-secondary.locked:hover,.ec-button-secondary.locked:active,.ec-button-secondary.locked:focus{background-color:var(--ec-button-background-color-secondary, var(--ec-background-color))!important;border:1px solid var(--ec-button-border-color-secondary, var(--ec-color-gray-8))!important;color:var(--ec-button-color-secondary, var(--ec-color-primary-dark))!important;box-shadow:none!important;outline:none!important}.ec-button-secondary.locked:hover .ec-icon,.ec-button-secondary.locked:active .ec-icon,.ec-button-secondary.locked:focus .ec-icon{color:var(--ec-button-color-icon-secondary, var(--ec-color-icon))!important}.ec-button-common{background-color:var(--ec-button-background-color-secondary, var(--ec-background-color));border:1px solid var(--ec-button-border-color-secondary, var(--ec-color-gray-8));color:var(--ec-button-color-secondary, var(--ec-color-primary-dark))}.ec-button-common:active:not(:disabled){background-color:var(--ec-button-background-color-active, var(--ec-background-color-selected));color:var(--ec-button-color-active, var(--ec-color-primary-dark));box-shadow:var(--ec-button-box-shadow-active, 0 0 0 2px var(--ec-border-color-focus));border-color:transparent}.ec-button-common:focus{box-shadow:var(--ec-button-box-shadow-focus-secondary, 0 0 0 2px var(--ec-border-color-focus));border-color:var(--ec-button-border-color-secondary-focus, transparent)}.ec-button-common .ec-icon{color:var(--ec-button-color-icon-secondary, var(--ec-color-icon))}.ec-button-common.locked:hover,.ec-button-common.locked:active,.ec-button-common.locked:focus{background-color:var(--ec-button-background-color-secondary, var(--ec-background-color))!important;border:1px solid var(--ec-button-border-color-secondary, var(--ec-color-gray-8))!important;color:var(--ec-button-color-secondary, var(--ec-color-primary-dark))!important;box-shadow:none!important;outline:none!important}.ec-button-common.locked:hover .ec-icon,.ec-button-common.locked:active .ec-icon,.ec-button-common.locked:focus .ec-icon{color:var(--ec-button-color-icon-secondary, var(--ec-color-icon))!important}.ec-button-icon{background-color:transparent;color:var(--ec-button-color-icon, var(--ec-color-icon));width:2rem;padding:0}.ec-button-icon .ec-icon{height:1rem;margin:0;padding:0;color:inherit}.ec-button-icon:hover:not(:disabled){background-color:var(--ec-background-color-hover)}.ec-button-icon:hover:not(:disabled) .ec-icon{color:var(--ec-button-color-icon-hover, var(--ec-button-color-icon, var(--ec-color-icon)))}.ec-button-icon:active:not(:disabled),.ec-button-icon:focus{box-shadow:var(--ec-button-box-shadow-active, 0 0 0 2px var(--ec-border-color-focus))}.ec-button-icon:active:not(:disabled){background-color:var(--ec-background-color-selected)}.ec-button-icon:disabled{background-color:transparent;border-color:transparent}.ec-button-icon:disabled .ec-icon{color:var(--ec-color-disabled-dark)}.ec-button-icon.has-badge{width:auto;min-width:2rem;padding-right:0;padding-left:.375rem}.ec-button-icon .badge{margin-left:-.5rem}.ec-button-icon.locked:hover,.ec-button-icon.locked:active,.ec-button-icon.locked:focus{background-color:transparent!important;color:var(--ec-button-color-icon, var(--ec-color-icon))!important;border-color:transparent!important;box-shadow:none!important;outline:none!important}.ec-button-icon.locked:hover .ec-icon,.ec-button-icon.locked:active .ec-icon,.ec-button-icon.locked:focus .ec-icon{color:var(--ec-button-color-icon, var(--ec-color-icon))!important}.ec-button-text{background-color:transparent;color:var(--ec-button-color-text, var(--ec-color-primary-dark))}.ec-button-text .ec-icon{color:var(--ec-button-color-icon-text, inherit)}.ec-button-text:active:not(:disabled),.ec-button-text:focus{box-shadow:var(--ec-button-box-shadow-active, 0 0 0 2px var(--ec-border-color-focus))}.ec-button-text:disabled{background-color:transparent;border-color:transparent}.ec-button-text.locked:hover,.ec-button-text.locked:active,.ec-button-text.locked:focus{background-color:transparent!important;color:var(--ec-button-color-text, var(--ec-color-primary-dark))!important;border-color:transparent!important;box-shadow:none!important;outline:none!important}.ec-button-text.locked:hover .ec-icon,.ec-button-text.locked:active .ec-icon,.ec-button-text.locked:focus .ec-icon{color:var(--ec-button-color-icon-text, inherit)!important}.ec-button-link{background-color:transparent;color:var(--ec-button-color-text, var(--ec-color-link))}.ec-button-link .ec-icon{color:var(--ec-button-color-icon-link, inherit)}.ec-button-link:active:not(:disabled),.ec-button-link:focus{box-shadow:var(--ec-button-box-shadow-active, 0 0 0 2px var(--ec-border-color-focus))}.ec-button-link:disabled{background-color:transparent;border-color:transparent}.ec-button-link.locked:hover,.ec-button-link.locked:active,.ec-button-link.locked:focus{background-color:transparent!important;color:var(--ec-color-link)!important;border-color:transparent!important;box-shadow:none!important;outline:none!important}.ec-button-link.locked:hover .ec-icon,.ec-button-link.locked:active .ec-icon,.ec-button-link.locked:focus .ec-icon{color:var(--ec-button-color-icon-link, inherit)!important}.ec-button-danger{background-color:var(--ec-color-danger);color:var(--ec-color-primary-light)}.ec-button-danger .ec-icon{color:var(--ec-button-color-icon, inherit)}.ec-button-danger:active:not(:disabled){background-color:var(--ec-button-background-color-active, var(--ec-background-color-selected));color:var(--ec-button-color-active, var(--ec-color-primary-dark));box-shadow:var(--ec-button-box-shadow-active, 0 0 0 2px var(--ec-border-color-focus))}.ec-button-danger:focus{box-shadow:var(--ec-button-box-shadow-focus-primary, 0 0 0 2px var(--ec-border-color-focus), inset 0 0 0 2px var(--ec-color-white))}.ec-button-danger.locked:hover,.ec-button-danger.locked:active,.ec-button-danger.locked:focus{background-color:var(--ec-color-danger)!important;color:var(--ec-color-primary-light)!important;border-color:initial!important;box-shadow:none!important;outline:none!important}.ec-button-danger.locked:hover .ec-icon,.ec-button-danger.locked:active .ec-icon,.ec-button-danger.locked:focus .ec-icon{color:var(--ec-button-color-icon, inherit)!important}.ec-button-danger-text{background-color:transparent;color:var(--ec-button-color-text, var(--ec-color-danger))}.ec-button-danger-text .ec-icon{color:var(--ec-button-color-icon-danger-text, inherit)}.ec-button-danger-text:active:not(:disabled),.ec-button-danger-text:focus{box-shadow:var(--ec-button-box-shadow-active, 0 0 0 2px var(--ec-border-color-focus))}.ec-button-danger-text:disabled{background-color:transparent;border-color:transparent}.ec-button-danger-text.locked:hover,.ec-button-danger-text.locked:active,.ec-button-danger-text.locked:focus{background-color:transparent!important;color:var(--ec-color-danger)!important;border-color:transparent!important;box-shadow:none!important;outline:none!important}.ec-button-danger-text.locked:hover .ec-icon,.ec-button-danger-text.locked:active .ec-icon,.ec-button-danger-text.locked:focus .ec-icon{color:var(--ec-button-color-icon-danger-text, inherit)!important}.ec-button-card{background-color:var(--ec-button-background-color-secondary, var(--ec-background-color));border:1px solid var(--ec-button-border-color-secondary, var(--ec-color-gray-8));color:var(--ec-button-color-secondary, var(--ec-color-primary-dark))}.ec-button-card:active:not(:disabled){background-color:var(--ec-button-background-color-active, var(--ec-background-color-selected));color:var(--ec-button-color-active, var(--ec-color-primary-dark));box-shadow:var(--ec-button-box-shadow-active, 0 0 0 2px var(--ec-border-color-focus));border-color:transparent}.ec-button-card:focus{box-shadow:var(--ec-button-box-shadow-focus-secondary, 0 0 0 2px var(--ec-border-color-focus));border-color:var(--ec-button-border-color-secondary-focus, transparent)}.ec-button-card .ec-icon{color:var(--ec-button-color-icon-secondary, var(--ec-color-icon))}.ec-button-card{color:var(--ec-color-primary-dark);font-size:var(--ec-font-size);font-weight:var(--ec-font-weight-normal);line-height:1.285714286;margin:0;padding:1rem;height:auto;border:1px solid var(--ec-border-color);border-radius:var(--ec-border-radius);text-align:start}.ec-button-card:hover:not(:disabled):not(:focus){box-shadow:none;border-color:var(--ec-border-color-control-hover)}.ec-button-card{height:100%;width:100%}.ec-button-card.locked:hover,.ec-button-card.locked:active,.ec-button-card.locked:focus{background-color:var(--ec-button-background-color-secondary, var(--ec-background-color))!important;border:1px solid var(--ec-border-color)!important;color:var(--ec-button-color-secondary, var(--ec-color-primary-dark))!important;box-shadow:none!important;outline:none!important}.ec-button-card.locked:hover .ec-icon,.ec-button-card.locked:active .ec-icon,.ec-button-card.locked:focus .ec-icon{color:var(--ec-button-color-icon-secondary, var(--ec-color-icon))!important}.ec-button-custom{padding:0;background-color:transparent;height:auto}.ec-button-custom:disabled{background-color:transparent;border:0}button{font-size:var(--ec-font-size-action);height:2rem;line-height:1.25rem;padding:.3125rem .5rem;border:0;border-radius:var(--ec-border-radius);display:flex;align-items:center;justify-content:center;cursor:pointer}button .label{display:flex;align-items:center;justify-content:center;white-space:nowrap;flex:auto}button .ec-icon{flex:none}button .ec-icon+.label{flex:none;margin-left:.25rem}button.has-badge{padding-right:.0625rem}button:focus{outline:2px solid transparent;outline-offset:2px;position:relative;z-index:1}button:focus-visible{outline-color:var(--ec-border-color-focus)}button:disabled{background-color:var(--ec-background-color-disabled);border:1px solid var(--ec-form-control-border-color-disabled);color:var(--ec-color-disabled-dark);opacity:var(--ec-form-control-opacity-disabled);cursor:default}button:disabled .ec-icon{color:var(--ec-color-disabled-dark)}button{position:relative}button.icon-only{padding:0;width:2rem}button.locked{cursor:default!important}button.locked:hover,button.locked:active,button.locked:focus{transform:none!important;transition:none!important;animation:none!important}button.locked:hover .label,button.locked:active .label,button.locked:focus .label{color:inherit!important}button.locked:hover .badge,button.locked:active .badge,button.locked:focus .badge{color:inherit!important;background-color:inherit!important}button.has-custom-icon-color .ec-icon,button.has-custom-icon-color .pending-container .ec-icon{color:var(--ec-button-custom-icon-color)!important}button.has-custom-icon-color.locked:hover .ec-icon,button.has-custom-icon-color.locked:active .ec-icon,button.has-custom-icon-color.locked:focus .ec-icon{color:var(--ec-button-custom-icon-color)!important}:host(.textbox-group-btn-right){position:relative}:host(.textbox-group-btn-right) button{padding-left:.4375rem;padding-right:.4375rem;border-bottom-left-radius:0;border-top-left-radius:0;margin-left:-1px}:host(.is-tab) button{padding-left:.5rem;padding-right:.5rem;border-radius:var(--ec-border-radius);border:1px solid var(--ec-tab-border-color, var(--ec-border-color));align-items:center;color:var(--ec-tab-color, var(--ec-color-secondary-dark));cursor:pointer;font-size:var(--ec-tab-font-size, var(--ec-font-size-label));display:flex;height:1.75rem;min-width:1.75rem;justify-content:center}:host(.is-tab) button.active{color:var(--ec-tab-color-active, var(--ec-color-interactive));background-color:var(--ec-tab-background-color-active, var(--ec-background-color))}:host(.is-tab) button:hover,:host(.is-tab) button:focus{border-color:var(--ec-tab-border-color-active, var(--ec-border-color-focus));box-shadow:0 0 0 1px var(--ec-tab-border-color-active, var(--ec-border-color-focus));position:relative;z-index:1}:host(.is-tab) button:focus{outline:2px solid transparent;outline-offset:-2px}:host(.is-tab) button:focus-visible{outline-color:var(--ec-border-color-focus)}:host(.is-tab) button.is-disabled{opacity:var(--ec-form-control-opacity-disabled);cursor:default;pointer-events:none}:host(.is-tab) button.ec-button-icon{padding:0;justify-content:center}:host(.is-tab) button.ec-button-icon .ec-icon{color:inherit}:host(.is-tab) button.ec-button-icon{width:auto}:host(.is-tab) button:hover{background-color:transparent}:host(.is-tab).active button{color:var(--ec-tab-color-active, var(--ec-color-interactive));background-color:var(--ec-tab-background-color-active, var(--ec-background-color))}.pending-container{display:flex;align-items:center;justify-content:center;position:absolute;inset:0;z-index:1}.pending-container>.ec-icon{flex:none;color:inherit}.pending-container~.ec-icon,.pending-container~.label,.pending-container~.badge{opacity:0}.badge{margin-left:-.25rem;margin-top:-.75rem}\n"]
|
|
251
|
+
template: "<button id=\"{{id}}_button\"\n class=\"ec-button-{{customTemplate ? 'custom' : type}}\"\n [class.has-badge]=\"badge !== undefined\"\n [class.icon-only]=\"icon && !label\"\n [class.locked]=\"lockButton\"\n [class.has-custom-icon-color]=\"iconColor\"\n [style.--ec-button-custom-icon-color]=\"iconColor\"\n tabindex=\"{{tabindex}}\"\n [type]=\"type === 'submit' || isSubmit ? 'submit' : 'button'\"\n [disabled]=\"disabled\"\n [attr.aria-label]=\"ariaLabel && !label ? (ariaLabel | translate) : null\"\n [attr.aria-pressed]=\"ariaPressed !== undefined ? ariaPressed : null\"\n [attr.aria-expanded]=\"ariaExpanded !== undefined ? ariaExpanded : null\"\n [attr.aria-haspopup]=\"ariaHaspopup || null\"\n [attr.aria-activedescendant]=\"ariaActivedescendant || null\"\n [attr.aria-controls]=\"ariaControls || null\"\n (click)=\"onClick($event)\"\n #element\n [attr.cdkFocusInitial]=\"autofocus || null\">\n @if (customTemplate) {\n <ng-container *ngTemplateOutlet=\"customTemplate\"></ng-container>\n } @else {\n <!-- Hidden when the button is not pending -->\n @if (pending) {\n <div class=\"pending-container\">\n <i class=\"ec-icon {{pendingIcon}}\"\n id=\"{{id}}_pending\"\n [attr.aria-hidden]=\"hasExplicitAccessibleName ? 'true' : null\"></i>\n </div>\n }\n @if (icon) {\n <i class=\"ec-icon {{icon}}\"\n id=\"{{id}}_icon\"\n [attr.aria-hidden]=\"hasExplicitAccessibleName ? 'true' : null\"></i>\n }\n @if (label) {\n <span id=\"{{id}}_label\"\n class=\"label\">{{label | translate}}</span>\n }\n @if (badge !== undefined) {\n <span id=\"{{id}}_badge\"\n class=\"badge\">{{badge}}</span>\n }\n }\n <ng-content></ng-content>\n</button>",
|
|
252
|
+
styles: [":host{display:inline-block;vertical-align:top}:host(.font-size-inherit){font-size:inherit}:host(.font-size-inherit) button{font-size:inherit}:host(.text-left) button{justify-content:flex-start}:host(.text-right) button{justify-content:flex-end}:host(.active) .ec-button-icon,:host(.active) .ec-button-text,:host(.active) .ec-button-link,:host(.active) .ec-button-danger-text,:host(.active) .ec-button-custom,:host(.active) .ec-button-secondary,:host(.active) .ec-button-primary{background-color:var(--ec-background-color-selected);color:var(--ec-button-color-active)}:host(.active) .ec-button-icon .ec-icon,:host(.active) .ec-button-text .ec-icon,:host(.active) .ec-button-link .ec-icon,:host(.active) .ec-button-danger-text .ec-icon,:host(.active) .ec-button-custom .ec-icon,:host(.active) .ec-button-secondary .ec-icon,:host(.active) .ec-button-primary .ec-icon{color:var(--ec-button-color-icon-active, var(--ec-color-icon))}:host(.d-block) button{width:100%}:host(.border-0) button:not(:focus){border-color:transparent}:host(.is-action-icon) .ec-button-icon{color:var(--ec-color-interactive)}:host(.is-success) .ec-button-icon,:host(.is-success) .ec-button-secondary,:host(.is-success) .ec-button-text{color:var(--ec-color-success)}:host(.is-error) .ec-button-icon,:host(.is-error) .ec-button-secondary,:host(.is-error) .ec-button-text{color:var(--ec-color-danger)}:host-context(.btn-stack) button{height:1rem}:host-context(.btn-stack) .ec-icon{width:.0625rem;height:.0625rem}:host-context(.actions-col) button{border-radius:0}.ec-button-primary,.ec-button-submit{background-color:var(--ec-button-background-color-primary, var(--ec-color-gray-8));color:var(--ec-button-color-primary, var(--ec-color-primary-light))}.ec-button-primary:active:not(:disabled),.ec-button-submit:active:not(:disabled){background-color:var(--ec-button-background-color-active, var(--ec-background-color-selected));color:var(--ec-button-color-active, var(--ec-color-primary-dark));box-shadow:var(--ec-button-box-shadow-active, 0 0 0 2px var(--ec-border-color-focus))}.ec-button-primary:focus,.ec-button-submit:focus{box-shadow:var(--ec-button-box-shadow-focus-primary, 0 0 0 2px var(--ec-color-interactive), inset 0 0 0 2px var(--ec-color-white))}.ec-button-primary .ec-icon,.ec-button-submit .ec-icon{color:var(--ec-button-color-icon-primary, var(--ec-color-primary-light))}.ec-button-primary.locked:hover,.ec-button-primary.locked:active,.ec-button-primary.locked:focus,.ec-button-submit.locked:hover,.ec-button-submit.locked:active,.ec-button-submit.locked:focus{background-color:var(--ec-button-background-color-primary, var(--ec-color-gray-8))!important;color:var(--ec-button-color-primary, var(--ec-color-primary-light))!important;border-color:initial!important;box-shadow:none!important;outline:none!important}.ec-button-primary.locked:hover .ec-icon,.ec-button-primary.locked:active .ec-icon,.ec-button-primary.locked:focus .ec-icon,.ec-button-submit.locked:hover .ec-icon,.ec-button-submit.locked:active .ec-icon,.ec-button-submit.locked:focus .ec-icon{color:var(--ec-button-color-icon-primary, var(--ec-color-primary-light))!important}.ec-button-secondary{background-color:var(--ec-button-background-color-secondary, var(--ec-background-color));border:1px solid var(--ec-button-border-color-secondary, var(--ec-color-gray-8));color:var(--ec-button-color-secondary, var(--ec-color-primary-dark))}.ec-button-secondary:active:not(:disabled){background-color:var(--ec-button-background-color-active, var(--ec-background-color-selected));color:var(--ec-button-color-active, var(--ec-color-primary-dark));box-shadow:var(--ec-button-box-shadow-active, 0 0 0 2px var(--ec-border-color-focus));border-color:transparent}.ec-button-secondary:focus{box-shadow:var(--ec-button-box-shadow-focus-secondary, 0 0 0 2px var(--ec-border-color-focus));border-color:var(--ec-button-border-color-secondary-focus, transparent)}.ec-button-secondary .ec-icon{color:var(--ec-button-color-icon-secondary, var(--ec-color-icon))}.ec-button-secondary.locked:hover,.ec-button-secondary.locked:active,.ec-button-secondary.locked:focus{background-color:var(--ec-button-background-color-secondary, var(--ec-background-color))!important;border:1px solid var(--ec-button-border-color-secondary, var(--ec-color-gray-8))!important;color:var(--ec-button-color-secondary, var(--ec-color-primary-dark))!important;box-shadow:none!important;outline:none!important}.ec-button-secondary.locked:hover .ec-icon,.ec-button-secondary.locked:active .ec-icon,.ec-button-secondary.locked:focus .ec-icon{color:var(--ec-button-color-icon-secondary, var(--ec-color-icon))!important}.ec-button-common{background-color:var(--ec-button-background-color-secondary, var(--ec-background-color));border:1px solid var(--ec-button-border-color-secondary, var(--ec-color-gray-8));color:var(--ec-button-color-secondary, var(--ec-color-primary-dark))}.ec-button-common:active:not(:disabled){background-color:var(--ec-button-background-color-active, var(--ec-background-color-selected));color:var(--ec-button-color-active, var(--ec-color-primary-dark));box-shadow:var(--ec-button-box-shadow-active, 0 0 0 2px var(--ec-border-color-focus));border-color:transparent}.ec-button-common:focus{box-shadow:var(--ec-button-box-shadow-focus-secondary, 0 0 0 2px var(--ec-border-color-focus));border-color:var(--ec-button-border-color-secondary-focus, transparent)}.ec-button-common .ec-icon{color:var(--ec-button-color-icon-secondary, var(--ec-color-icon))}.ec-button-common.locked:hover,.ec-button-common.locked:active,.ec-button-common.locked:focus{background-color:var(--ec-button-background-color-secondary, var(--ec-background-color))!important;border:1px solid var(--ec-button-border-color-secondary, var(--ec-color-gray-8))!important;color:var(--ec-button-color-secondary, var(--ec-color-primary-dark))!important;box-shadow:none!important;outline:none!important}.ec-button-common.locked:hover .ec-icon,.ec-button-common.locked:active .ec-icon,.ec-button-common.locked:focus .ec-icon{color:var(--ec-button-color-icon-secondary, var(--ec-color-icon))!important}.ec-button-icon{background-color:transparent;color:var(--ec-button-color-icon, var(--ec-color-icon));width:2rem;padding:0}.ec-button-icon .ec-icon{height:1rem;margin:0;padding:0;color:inherit}.ec-button-icon:hover:not(:disabled){background-color:var(--ec-background-color-hover)}.ec-button-icon:hover:not(:disabled) .ec-icon{color:var(--ec-button-color-icon-hover, var(--ec-button-color-icon, var(--ec-color-icon)))}.ec-button-icon:active:not(:disabled),.ec-button-icon:focus{box-shadow:var(--ec-button-box-shadow-active, 0 0 0 2px var(--ec-border-color-focus))}.ec-button-icon:active:not(:disabled){background-color:var(--ec-background-color-selected)}.ec-button-icon:disabled{background-color:transparent;border-color:transparent}.ec-button-icon:disabled .ec-icon{color:var(--ec-color-disabled-dark)}.ec-button-icon.has-badge{width:auto;min-width:2rem;padding-right:0;padding-left:.375rem}.ec-button-icon .badge{margin-left:-.5rem}.ec-button-icon.locked:hover,.ec-button-icon.locked:active,.ec-button-icon.locked:focus{background-color:transparent!important;color:var(--ec-button-color-icon, var(--ec-color-icon))!important;border-color:transparent!important;box-shadow:none!important;outline:none!important}.ec-button-icon.locked:hover .ec-icon,.ec-button-icon.locked:active .ec-icon,.ec-button-icon.locked:focus .ec-icon{color:var(--ec-button-color-icon, var(--ec-color-icon))!important}.ec-button-text{background-color:transparent;color:var(--ec-button-color-text, var(--ec-color-primary-dark))}.ec-button-text .ec-icon{color:var(--ec-button-color-icon-text, inherit)}.ec-button-text:active:not(:disabled),.ec-button-text:focus{box-shadow:var(--ec-button-box-shadow-active, 0 0 0 2px var(--ec-border-color-focus))}.ec-button-text:disabled{background-color:transparent;border-color:transparent}.ec-button-text.locked:hover,.ec-button-text.locked:active,.ec-button-text.locked:focus{background-color:transparent!important;color:var(--ec-button-color-text, var(--ec-color-primary-dark))!important;border-color:transparent!important;box-shadow:none!important;outline:none!important}.ec-button-text.locked:hover .ec-icon,.ec-button-text.locked:active .ec-icon,.ec-button-text.locked:focus .ec-icon{color:var(--ec-button-color-icon-text, inherit)!important}.ec-button-link{background-color:transparent;color:var(--ec-button-color-text, var(--ec-color-link))}.ec-button-link .ec-icon{color:var(--ec-button-color-icon-link, inherit)}.ec-button-link:active:not(:disabled),.ec-button-link:focus{box-shadow:var(--ec-button-box-shadow-active, 0 0 0 2px var(--ec-border-color-focus))}.ec-button-link:disabled{background-color:transparent;border-color:transparent}.ec-button-link.locked:hover,.ec-button-link.locked:active,.ec-button-link.locked:focus{background-color:transparent!important;color:var(--ec-color-link)!important;border-color:transparent!important;box-shadow:none!important;outline:none!important}.ec-button-link.locked:hover .ec-icon,.ec-button-link.locked:active .ec-icon,.ec-button-link.locked:focus .ec-icon{color:var(--ec-button-color-icon-link, inherit)!important}.ec-button-danger{background-color:var(--ec-color-danger);color:var(--ec-color-primary-light)}.ec-button-danger .ec-icon{color:var(--ec-button-color-icon, inherit)}.ec-button-danger:active:not(:disabled){background-color:var(--ec-button-background-color-active, var(--ec-background-color-selected));color:var(--ec-button-color-active, var(--ec-color-primary-dark));box-shadow:var(--ec-button-box-shadow-active, 0 0 0 2px var(--ec-border-color-focus))}.ec-button-danger:focus{box-shadow:var(--ec-button-box-shadow-focus-primary, 0 0 0 2px var(--ec-border-color-focus), inset 0 0 0 2px var(--ec-color-white))}.ec-button-danger.locked:hover,.ec-button-danger.locked:active,.ec-button-danger.locked:focus{background-color:var(--ec-color-danger)!important;color:var(--ec-color-primary-light)!important;border-color:initial!important;box-shadow:none!important;outline:none!important}.ec-button-danger.locked:hover .ec-icon,.ec-button-danger.locked:active .ec-icon,.ec-button-danger.locked:focus .ec-icon{color:var(--ec-button-color-icon, inherit)!important}.ec-button-danger-text{background-color:transparent;color:var(--ec-button-color-text, var(--ec-color-danger))}.ec-button-danger-text .ec-icon{color:var(--ec-button-color-icon-danger-text, inherit)}.ec-button-danger-text:active:not(:disabled),.ec-button-danger-text:focus{box-shadow:var(--ec-button-box-shadow-active, 0 0 0 2px var(--ec-border-color-focus))}.ec-button-danger-text:disabled{background-color:transparent;border-color:transparent}.ec-button-danger-text.locked:hover,.ec-button-danger-text.locked:active,.ec-button-danger-text.locked:focus{background-color:transparent!important;color:var(--ec-color-danger)!important;border-color:transparent!important;box-shadow:none!important;outline:none!important}.ec-button-danger-text.locked:hover .ec-icon,.ec-button-danger-text.locked:active .ec-icon,.ec-button-danger-text.locked:focus .ec-icon{color:var(--ec-button-color-icon-danger-text, inherit)!important}.ec-button-card{background-color:var(--ec-button-background-color-secondary, var(--ec-background-color));border:1px solid var(--ec-button-border-color-secondary, var(--ec-color-gray-8));color:var(--ec-button-color-secondary, var(--ec-color-primary-dark))}.ec-button-card:active:not(:disabled){background-color:var(--ec-button-background-color-active, var(--ec-background-color-selected));color:var(--ec-button-color-active, var(--ec-color-primary-dark));box-shadow:var(--ec-button-box-shadow-active, 0 0 0 2px var(--ec-border-color-focus));border-color:transparent}.ec-button-card:focus{box-shadow:var(--ec-button-box-shadow-focus-secondary, 0 0 0 2px var(--ec-border-color-focus));border-color:var(--ec-button-border-color-secondary-focus, transparent)}.ec-button-card .ec-icon{color:var(--ec-button-color-icon-secondary, var(--ec-color-icon))}.ec-button-card{color:var(--ec-color-primary-dark);font-size:var(--ec-font-size);font-weight:var(--ec-font-weight-normal);line-height:1.285714286;margin:0;padding:1rem;height:auto;border:1px solid var(--ec-border-color);border-radius:var(--ec-border-radius);text-align:start}.ec-button-card:hover:not(:disabled):not(:focus){box-shadow:none;border-color:var(--ec-border-color-control-hover)}.ec-button-card{height:100%;width:100%}.ec-button-card.locked:hover,.ec-button-card.locked:active,.ec-button-card.locked:focus{background-color:var(--ec-button-background-color-secondary, var(--ec-background-color))!important;border:1px solid var(--ec-border-color)!important;color:var(--ec-button-color-secondary, var(--ec-color-primary-dark))!important;box-shadow:none!important;outline:none!important}.ec-button-card.locked:hover .ec-icon,.ec-button-card.locked:active .ec-icon,.ec-button-card.locked:focus .ec-icon{color:var(--ec-button-color-icon-secondary, var(--ec-color-icon))!important}.ec-button-custom{padding:0;background-color:transparent;height:auto}.ec-button-custom:disabled{background-color:transparent;border:0}button{font-size:var(--ec-font-size-action);height:2rem;line-height:1.25rem;padding:.3125rem .5rem;border:0;border-radius:var(--ec-border-radius);color:inherit;display:flex;align-items:center;justify-content:center;cursor:pointer}button .label{display:flex;align-items:center;justify-content:center;white-space:nowrap;flex:auto}button .ec-icon{flex:none}button .ec-icon+.label{flex:none;margin-left:.25rem}button.has-badge{padding-right:.0625rem}button:focus{outline:2px solid transparent;outline-offset:2px;position:relative;z-index:1}button:focus-visible{outline-color:var(--ec-border-color-focus)}button:disabled{background-color:var(--ec-background-color-disabled);border:1px solid var(--ec-form-control-border-color-disabled);color:var(--ec-color-disabled-dark);opacity:var(--ec-form-control-opacity-disabled);cursor:default}button:disabled .ec-icon{color:var(--ec-color-disabled-dark)}button{position:relative}button.icon-only{padding:0;width:2rem}button.locked{cursor:default!important}button.locked:hover,button.locked:active,button.locked:focus{transform:none!important;transition:none!important;animation:none!important}button.locked:hover .label,button.locked:active .label,button.locked:focus .label{color:inherit!important}button.locked:hover .badge,button.locked:active .badge,button.locked:focus .badge{color:inherit!important;background-color:inherit!important}button.has-custom-icon-color .ec-icon,button.has-custom-icon-color .pending-container .ec-icon{color:var(--ec-button-custom-icon-color)!important}button.has-custom-icon-color.locked:hover .ec-icon,button.has-custom-icon-color.locked:active .ec-icon,button.has-custom-icon-color.locked:focus .ec-icon{color:var(--ec-button-custom-icon-color)!important}:host(.textbox-group-btn-right){position:relative}:host(.textbox-group-btn-right) button{padding-left:.4375rem;padding-right:.4375rem;border-bottom-left-radius:0;border-top-left-radius:0;margin-left:-1px}:host(.is-tab) button{padding-left:.5rem;padding-right:.5rem;border-radius:var(--ec-border-radius);border:1px solid var(--ec-tab-border-color, var(--ec-border-color));align-items:center;color:var(--ec-tab-color, var(--ec-color-secondary-dark));cursor:pointer;font-size:var(--ec-tab-font-size, var(--ec-font-size-label));display:flex;height:1.75rem;min-width:1.75rem;justify-content:center}:host(.is-tab) button.active{color:var(--ec-tab-color-active, var(--ec-color-interactive));background-color:var(--ec-tab-background-color-active, var(--ec-background-color))}:host(.is-tab) button:hover,:host(.is-tab) button:focus{border-color:var(--ec-tab-border-color-active, var(--ec-border-color-focus));box-shadow:0 0 0 1px var(--ec-tab-border-color-active, var(--ec-border-color-focus));position:relative;z-index:1}:host(.is-tab) button:focus{outline:2px solid transparent;outline-offset:-2px}:host(.is-tab) button:focus-visible{outline-color:var(--ec-border-color-focus)}:host(.is-tab) button.is-disabled{opacity:var(--ec-form-control-opacity-disabled);cursor:default;pointer-events:none}:host(.is-tab) button.ec-button-icon{padding:0;justify-content:center}:host(.is-tab) button.ec-button-icon .ec-icon{color:inherit}:host(.is-tab) button.ec-button-icon{width:auto}:host(.is-tab) button:hover{background-color:transparent}:host(.is-tab).active button{color:var(--ec-tab-color-active, var(--ec-color-interactive));background-color:var(--ec-tab-background-color-active, var(--ec-background-color))}.pending-container{display:flex;align-items:center;justify-content:center;position:absolute;inset:0;z-index:1}.pending-container>.ec-icon{flex:none;color:inherit}.pending-container~.ec-icon,.pending-container~.label,.pending-container~.badge{opacity:0}.badge{margin-left:-.25rem;margin-top:-.75rem}\n"]
|
|
252
253
|
}]
|
|
253
254
|
}],
|
|
254
255
|
ctorParameters: () => [],
|
|
@@ -263,6 +264,7 @@ i0.ɵɵngDeclareClassMetadata({
|
|
|
263
264
|
iconColor: [{ type: Input }],
|
|
264
265
|
label: [{ type: Input }],
|
|
265
266
|
ariaLabel: [{ type: Input }],
|
|
267
|
+
ariaPressed: [{ type: Input }],
|
|
266
268
|
ariaExpanded: [{ type: Input }],
|
|
267
269
|
ariaHaspopup: [{ type: Input }],
|
|
268
270
|
ariaActivedescendant: [{ type: Input }],
|
|
@@ -353,7 +355,7 @@ var BannerComponent = class BannerComponent {
|
|
|
353
355
|
usesOnChanges: true,
|
|
354
356
|
ngImport: i0,
|
|
355
357
|
template: "<div id=\"banner_{{id}}\" \n class=\"banner {{type}} {{bannerStyle}}\"\n [attr.role]=\"type === 'error' || type === 'warning' ? 'alert' : (type === 'info' || type === 'success' ? 'status' : null)\">\n @if (showCloseBtn) {\n <ec-button id=\"banner{{id}}_close\"\n type=\"icon\"\n icon=\"icon-cancel\"\n ariaLabel=\"Banner_CloseButtonLabel\"\n (clicked)=\"close()\">\n </ec-button>\n }\n <div class=\"banner-content d-flex text-body-1\">\n <i class=\"ec-icon {{icon}}\" aria-hidden=\"true\"></i>\n <div class=\"ml-2\">\n @if (title) {\n <p class=\"title mb-0\">\n {{title}}\n </p>\n }\n @if (text) {\n <p class=\"text mb-0\">{{text}}</p>\n }\n\n @if (list?.length) {\n <ul class=\"list mb-0\">\n @for (item of list; track item) {\n <li>{{item}}</li>\n }\n </ul>\n }\n <ng-content></ng-content>\n </div>\n </div>\n\n</div>\n",
|
|
356
|
-
styles: [":host{display:flex}:host(.border-bottom-0) .banner{border-bottom:0;border-radius:var(--ec-border-radius-card)}.banner{display:flex;flex-direction:column;flex:1 1;min-height:2.5rem;position:relative;overflow-y:auto;background-color:var(--ec-banner-background-color, var(--ec-background-color-info));border-radius:var(--ec-banner-border-radius, var(--ec-border-radius-card));border:1px solid var(--ec-banner-border-color, var(--ec-color-info))}.banner-content{align-items:var(--ec-banner-align-items-content, normal);padding:.5rem 1rem;flex:none;margin:auto 0;color:var(--ec-banner-color, var(--ec-color-secondary-dark))}.banner-content ::ng-deep p{line-height:inherit}.ec-icon{color:var(--ec-banner-icon-color, var(--ec-color-info));font-size:1.125rem}ec-button{--ec-button-color-icon-hover: var(--ec-color-primary-dark);--ec-background-color-hover:
|
|
358
|
+
styles: [":host{display:flex}:host(.border-bottom-0) .banner{border-bottom:0;border-radius:var(--ec-border-radius-card)}.banner{display:flex;flex-direction:column;flex:1 1;min-height:2.5rem;position:relative;overflow-y:auto;background-color:var(--ec-banner-background-color, var(--ec-background-color-info));border-radius:var(--ec-banner-border-radius, var(--ec-border-radius-card));border:1px solid var(--ec-banner-border-color, var(--ec-color-info))}.banner-content{align-items:var(--ec-banner-align-items-content, normal);padding:.5rem 1rem;flex:none;margin:auto 0;color:var(--ec-banner-color, var(--ec-color-secondary-dark))}.banner-content ::ng-deep p{line-height:inherit}.ec-icon{color:var(--ec-banner-icon-color, var(--ec-color-info));font-size:1.125rem}ec-button{--ec-button-color-icon-hover: var(--ec-color-primary-dark);--ec-background-color-hover: var(--ec-overlay-color-hover);position:absolute;top:.1875rem;right:.25rem}ec-button+.banner-content{padding-right:2.75rem}.title{font-weight:700}.list{margin:0;padding-left:2em}.text+.list{margin-top:1em}.info:not(.toast){--ec-banner-background-color: var(--ec-background-color-info);--ec-banner-border-color: var(--ec-color-info);--ec-banner-icon-color: var(--ec-color-info)}.warning:not(.toast){--ec-banner-background-color: var(--ec-background-color-caution);--ec-banner-border-color: var(--ec-color-caution);--ec-banner-icon-color: var(--ec-color-caution)}.success:not(.toast){--ec-banner-background-color: var(--ec-background-color-success);--ec-banner-border-color: var(--ec-color-success);--ec-banner-icon-color: var(--ec-color-success)}.error:not(.toast){--ec-banner-background-color: var(--ec-background-color-danger);--ec-banner-border-color: var(--ec-color-danger);--ec-banner-icon-color: var(--ec-color-danger)}.pinned{border-radius:0;border-left:0;border-right:0}.promo:not(.toast){--ec-banner-color: var(--ec-color-primary-light);--ec-banner-icon-color: var(--ec-color-secondary-light);--ec-color-link: var(--ec-color-link-light);border:none;background:var(--ec-background-color-promo)}.promo:not(.toast) ec-button{--ec-button-color-icon: var(--ec-color-secondary-light);--ec-button-color-icon-hover: var(--ec-color-primary-light);--ec-background-color-hover: rgba(255,255,255,.15)}.instructional:not(.toast){--ec-banner-color: var(--ec-color-primary-light);--ec-banner-icon-color: var(--ec-color-secondary-light);--ec-color-link: var(--ec-color-link-light);border:none;background:var(--ec-background-color-instructional)}.instructional:not(.toast) ec-button{--ec-button-color-icon: var(--ec-color-secondary-light);--ec-button-color-icon-hover: var(--ec-color-primary-light);--ec-background-color-hover: rgba(255,255,255,.15)}.toast{--ec-banner-background-color: var(--ec-button-background-color-primary, var(--ec-color-gray-8));--ec-banner-color: var(--ec-color-primary-light);--ec-banner-icon-color: var(--ec-color-primary-light);--ec-color-link: var(--ec-color-link-light);border:0;box-shadow:var(--ec-box-shadow)}.toast ec-button{--ec-button-color-icon: var(--ec-color-secondary-light);--ec-button-color-icon-hover: var(--ec-color-primary-light);--ec-background-color-hover: rgba(255,255,255,.15);top:.25rem;right:.25rem}\n"],
|
|
357
359
|
dependencies: [{
|
|
358
360
|
kind: "component",
|
|
359
361
|
type: ButtonComponent,
|
|
@@ -366,6 +368,7 @@ var BannerComponent = class BannerComponent {
|
|
|
366
368
|
"iconColor",
|
|
367
369
|
"label",
|
|
368
370
|
"ariaLabel",
|
|
371
|
+
"ariaPressed",
|
|
369
372
|
"ariaExpanded",
|
|
370
373
|
"ariaHaspopup",
|
|
371
374
|
"ariaActivedescendant",
|
|
@@ -397,7 +400,7 @@ i0.ɵɵngDeclareClassMetadata({
|
|
|
397
400
|
changeDetection: ChangeDetectionStrategy.Eager,
|
|
398
401
|
standalone: false,
|
|
399
402
|
template: "<div id=\"banner_{{id}}\" \n class=\"banner {{type}} {{bannerStyle}}\"\n [attr.role]=\"type === 'error' || type === 'warning' ? 'alert' : (type === 'info' || type === 'success' ? 'status' : null)\">\n @if (showCloseBtn) {\n <ec-button id=\"banner{{id}}_close\"\n type=\"icon\"\n icon=\"icon-cancel\"\n ariaLabel=\"Banner_CloseButtonLabel\"\n (clicked)=\"close()\">\n </ec-button>\n }\n <div class=\"banner-content d-flex text-body-1\">\n <i class=\"ec-icon {{icon}}\" aria-hidden=\"true\"></i>\n <div class=\"ml-2\">\n @if (title) {\n <p class=\"title mb-0\">\n {{title}}\n </p>\n }\n @if (text) {\n <p class=\"text mb-0\">{{text}}</p>\n }\n\n @if (list?.length) {\n <ul class=\"list mb-0\">\n @for (item of list; track item) {\n <li>{{item}}</li>\n }\n </ul>\n }\n <ng-content></ng-content>\n </div>\n </div>\n\n</div>\n",
|
|
400
|
-
styles: [":host{display:flex}:host(.border-bottom-0) .banner{border-bottom:0;border-radius:var(--ec-border-radius-card)}.banner{display:flex;flex-direction:column;flex:1 1;min-height:2.5rem;position:relative;overflow-y:auto;background-color:var(--ec-banner-background-color, var(--ec-background-color-info));border-radius:var(--ec-banner-border-radius, var(--ec-border-radius-card));border:1px solid var(--ec-banner-border-color, var(--ec-color-info))}.banner-content{align-items:var(--ec-banner-align-items-content, normal);padding:.5rem 1rem;flex:none;margin:auto 0;color:var(--ec-banner-color, var(--ec-color-secondary-dark))}.banner-content ::ng-deep p{line-height:inherit}.ec-icon{color:var(--ec-banner-icon-color, var(--ec-color-info));font-size:1.125rem}ec-button{--ec-button-color-icon-hover: var(--ec-color-primary-dark);--ec-background-color-hover:
|
|
403
|
+
styles: [":host{display:flex}:host(.border-bottom-0) .banner{border-bottom:0;border-radius:var(--ec-border-radius-card)}.banner{display:flex;flex-direction:column;flex:1 1;min-height:2.5rem;position:relative;overflow-y:auto;background-color:var(--ec-banner-background-color, var(--ec-background-color-info));border-radius:var(--ec-banner-border-radius, var(--ec-border-radius-card));border:1px solid var(--ec-banner-border-color, var(--ec-color-info))}.banner-content{align-items:var(--ec-banner-align-items-content, normal);padding:.5rem 1rem;flex:none;margin:auto 0;color:var(--ec-banner-color, var(--ec-color-secondary-dark))}.banner-content ::ng-deep p{line-height:inherit}.ec-icon{color:var(--ec-banner-icon-color, var(--ec-color-info));font-size:1.125rem}ec-button{--ec-button-color-icon-hover: var(--ec-color-primary-dark);--ec-background-color-hover: var(--ec-overlay-color-hover);position:absolute;top:.1875rem;right:.25rem}ec-button+.banner-content{padding-right:2.75rem}.title{font-weight:700}.list{margin:0;padding-left:2em}.text+.list{margin-top:1em}.info:not(.toast){--ec-banner-background-color: var(--ec-background-color-info);--ec-banner-border-color: var(--ec-color-info);--ec-banner-icon-color: var(--ec-color-info)}.warning:not(.toast){--ec-banner-background-color: var(--ec-background-color-caution);--ec-banner-border-color: var(--ec-color-caution);--ec-banner-icon-color: var(--ec-color-caution)}.success:not(.toast){--ec-banner-background-color: var(--ec-background-color-success);--ec-banner-border-color: var(--ec-color-success);--ec-banner-icon-color: var(--ec-color-success)}.error:not(.toast){--ec-banner-background-color: var(--ec-background-color-danger);--ec-banner-border-color: var(--ec-color-danger);--ec-banner-icon-color: var(--ec-color-danger)}.pinned{border-radius:0;border-left:0;border-right:0}.promo:not(.toast){--ec-banner-color: var(--ec-color-primary-light);--ec-banner-icon-color: var(--ec-color-secondary-light);--ec-color-link: var(--ec-color-link-light);border:none;background:var(--ec-background-color-promo)}.promo:not(.toast) ec-button{--ec-button-color-icon: var(--ec-color-secondary-light);--ec-button-color-icon-hover: var(--ec-color-primary-light);--ec-background-color-hover: rgba(255,255,255,.15)}.instructional:not(.toast){--ec-banner-color: var(--ec-color-primary-light);--ec-banner-icon-color: var(--ec-color-secondary-light);--ec-color-link: var(--ec-color-link-light);border:none;background:var(--ec-background-color-instructional)}.instructional:not(.toast) ec-button{--ec-button-color-icon: var(--ec-color-secondary-light);--ec-button-color-icon-hover: var(--ec-color-primary-light);--ec-background-color-hover: rgba(255,255,255,.15)}.toast{--ec-banner-background-color: var(--ec-button-background-color-primary, var(--ec-color-gray-8));--ec-banner-color: var(--ec-color-primary-light);--ec-banner-icon-color: var(--ec-color-primary-light);--ec-color-link: var(--ec-color-link-light);border:0;box-shadow:var(--ec-box-shadow)}.toast ec-button{--ec-button-color-icon: var(--ec-color-secondary-light);--ec-button-color-icon-hover: var(--ec-color-primary-light);--ec-background-color-hover: rgba(255,255,255,.15);top:.25rem;right:.25rem}\n"]
|
|
401
404
|
}]
|
|
402
405
|
}],
|
|
403
406
|
ctorParameters: () => [{ type: CacheService }],
|
|
@@ -1645,7 +1648,7 @@ var CalendarItemComponent = class CalendarItemComponent {
|
|
|
1645
1648
|
ngImport: i0,
|
|
1646
1649
|
template: "<ng-content></ng-content>",
|
|
1647
1650
|
isInline: true,
|
|
1648
|
-
styles: [":host{font-size:var(--ec-font-size-action);height:2rem;line-height:1.25rem;padding:.3125rem .5rem;border:0;border-radius:var(--ec-border-radius);display:flex;align-items:center;justify-content:center;cursor:pointer}:host .label{display:flex;align-items:center;justify-content:center;white-space:nowrap;flex:auto}:host .ec-icon{flex:none}:host .ec-icon+.label{flex:none;margin-left:.25rem}:host.has-badge{padding-right:.0625rem}:host:focus{outline:2px solid transparent;outline-offset:2px;position:relative;z-index:1}:host:focus-visible{outline-color:var(--ec-border-color-focus)}:host:disabled{background-color:var(--ec-background-color-disabled);border:1px solid var(--ec-form-control-border-color-disabled);color:var(--ec-color-disabled-dark);opacity:var(--ec-form-control-opacity-disabled);cursor:default}:host:disabled .ec-icon{color:var(--ec-color-disabled-dark)}:host{background-color:transparent}:host:disabled{background-color:transparent;border-color:transparent;color:var(--ec-color-hint-dark);--ec-color-icon: var(--ec-color-hint-dark)}:host:hover:not(:disabled){background-color:var(--ec-background-color-hover)}:host:active:not(:disabled){background-color:var(--ec-background-color-selected);font-weight:700}:host:focus:not(:disabled){box-shadow:var(--ec-button-box-shadow-active, 0 0 0 2px var(--ec-border-color-focus))}:host.is-selected{background-color:var(--ec-background-color-selected);font-weight:700}:host{line-height:1.125rem}:host.is-selected,:host.is-selected:disabled{background-color:var(--ec-background-color-selected);font-weight:700}:host.is-today{position:relative}:host.is-today:after{content:\"\";position:absolute;top:50%;left:50%;width:1.75rem;height:1.75rem;transform:translate(-50%,-50%);border:1px solid;border-radius:50%;pointer-events:none}:host.is-outside-active-month{color:var(--ec-color-hint-dark)}:host.is-hidden{opacity:0!important}\n"],
|
|
1651
|
+
styles: [":host{font-size:var(--ec-font-size-action);height:2rem;line-height:1.25rem;padding:.3125rem .5rem;border:0;border-radius:var(--ec-border-radius);color:inherit;display:flex;align-items:center;justify-content:center;cursor:pointer}:host .label{display:flex;align-items:center;justify-content:center;white-space:nowrap;flex:auto}:host .ec-icon{flex:none}:host .ec-icon+.label{flex:none;margin-left:.25rem}:host.has-badge{padding-right:.0625rem}:host:focus{outline:2px solid transparent;outline-offset:2px;position:relative;z-index:1}:host:focus-visible{outline-color:var(--ec-border-color-focus)}:host:disabled{background-color:var(--ec-background-color-disabled);border:1px solid var(--ec-form-control-border-color-disabled);color:var(--ec-color-disabled-dark);opacity:var(--ec-form-control-opacity-disabled);cursor:default}:host:disabled .ec-icon{color:var(--ec-color-disabled-dark)}:host{background-color:transparent}:host:disabled{background-color:transparent;border-color:transparent;color:var(--ec-color-hint-dark);--ec-color-icon: var(--ec-color-hint-dark)}:host:hover:not(:disabled){background-color:var(--ec-background-color-hover)}:host:active:not(:disabled){background-color:var(--ec-background-color-selected);font-weight:700}:host:focus:not(:disabled){box-shadow:var(--ec-button-box-shadow-active, 0 0 0 2px var(--ec-border-color-focus))}:host.is-selected{background-color:var(--ec-background-color-selected);font-weight:700}:host{line-height:1.125rem}:host.is-selected,:host.is-selected:disabled{background-color:var(--ec-background-color-selected);font-weight:700}:host.is-today{position:relative}:host.is-today:after{content:\"\";position:absolute;top:50%;left:50%;width:1.75rem;height:1.75rem;transform:translate(-50%,-50%);border:1px solid;border-radius:50%;pointer-events:none}:host.is-outside-active-month{color:var(--ec-color-hint-dark)}:host.is-hidden{opacity:0!important}\n"],
|
|
1649
1652
|
changeDetection: i0.ChangeDetectionStrategy.OnPush
|
|
1650
1653
|
});
|
|
1651
1654
|
}
|
|
@@ -1662,7 +1665,7 @@ i0.ɵɵngDeclareClassMetadata({
|
|
|
1662
1665
|
template: "<ng-content></ng-content>",
|
|
1663
1666
|
changeDetection: ChangeDetectionStrategy.OnPush,
|
|
1664
1667
|
standalone: false,
|
|
1665
|
-
styles: [":host{font-size:var(--ec-font-size-action);height:2rem;line-height:1.25rem;padding:.3125rem .5rem;border:0;border-radius:var(--ec-border-radius);display:flex;align-items:center;justify-content:center;cursor:pointer}:host .label{display:flex;align-items:center;justify-content:center;white-space:nowrap;flex:auto}:host .ec-icon{flex:none}:host .ec-icon+.label{flex:none;margin-left:.25rem}:host.has-badge{padding-right:.0625rem}:host:focus{outline:2px solid transparent;outline-offset:2px;position:relative;z-index:1}:host:focus-visible{outline-color:var(--ec-border-color-focus)}:host:disabled{background-color:var(--ec-background-color-disabled);border:1px solid var(--ec-form-control-border-color-disabled);color:var(--ec-color-disabled-dark);opacity:var(--ec-form-control-opacity-disabled);cursor:default}:host:disabled .ec-icon{color:var(--ec-color-disabled-dark)}:host{background-color:transparent}:host:disabled{background-color:transparent;border-color:transparent;color:var(--ec-color-hint-dark);--ec-color-icon: var(--ec-color-hint-dark)}:host:hover:not(:disabled){background-color:var(--ec-background-color-hover)}:host:active:not(:disabled){background-color:var(--ec-background-color-selected);font-weight:700}:host:focus:not(:disabled){box-shadow:var(--ec-button-box-shadow-active, 0 0 0 2px var(--ec-border-color-focus))}:host.is-selected{background-color:var(--ec-background-color-selected);font-weight:700}:host{line-height:1.125rem}:host.is-selected,:host.is-selected:disabled{background-color:var(--ec-background-color-selected);font-weight:700}:host.is-today{position:relative}:host.is-today:after{content:\"\";position:absolute;top:50%;left:50%;width:1.75rem;height:1.75rem;transform:translate(-50%,-50%);border:1px solid;border-radius:50%;pointer-events:none}:host.is-outside-active-month{color:var(--ec-color-hint-dark)}:host.is-hidden{opacity:0!important}\n"]
|
|
1668
|
+
styles: [":host{font-size:var(--ec-font-size-action);height:2rem;line-height:1.25rem;padding:.3125rem .5rem;border:0;border-radius:var(--ec-border-radius);color:inherit;display:flex;align-items:center;justify-content:center;cursor:pointer}:host .label{display:flex;align-items:center;justify-content:center;white-space:nowrap;flex:auto}:host .ec-icon{flex:none}:host .ec-icon+.label{flex:none;margin-left:.25rem}:host.has-badge{padding-right:.0625rem}:host:focus{outline:2px solid transparent;outline-offset:2px;position:relative;z-index:1}:host:focus-visible{outline-color:var(--ec-border-color-focus)}:host:disabled{background-color:var(--ec-background-color-disabled);border:1px solid var(--ec-form-control-border-color-disabled);color:var(--ec-color-disabled-dark);opacity:var(--ec-form-control-opacity-disabled);cursor:default}:host:disabled .ec-icon{color:var(--ec-color-disabled-dark)}:host{background-color:transparent}:host:disabled{background-color:transparent;border-color:transparent;color:var(--ec-color-hint-dark);--ec-color-icon: var(--ec-color-hint-dark)}:host:hover:not(:disabled){background-color:var(--ec-background-color-hover)}:host:active:not(:disabled){background-color:var(--ec-background-color-selected);font-weight:700}:host:focus:not(:disabled){box-shadow:var(--ec-button-box-shadow-active, 0 0 0 2px var(--ec-border-color-focus))}:host.is-selected{background-color:var(--ec-background-color-selected);font-weight:700}:host{line-height:1.125rem}:host.is-selected,:host.is-selected:disabled{background-color:var(--ec-background-color-selected);font-weight:700}:host.is-today{position:relative}:host.is-today:after{content:\"\";position:absolute;top:50%;left:50%;width:1.75rem;height:1.75rem;transform:translate(-50%,-50%);border:1px solid;border-radius:50%;pointer-events:none}:host.is-outside-active-month{color:var(--ec-color-hint-dark)}:host.is-hidden{opacity:0!important}\n"]
|
|
1666
1669
|
}]
|
|
1667
1670
|
}],
|
|
1668
1671
|
ctorParameters: () => [],
|
|
@@ -1917,7 +1920,7 @@ var CalendarComponent = class CalendarComponent {
|
|
|
1917
1920
|
usesOnChanges: true,
|
|
1918
1921
|
ngImport: i0,
|
|
1919
1922
|
template: "<header class=\"d-flex align-items-center mt-1 mb-2 px-1\">\n <button id=\"{{id}}_prev_button\"\n class=\"mr-auto\"\n (click)=\"onPreviousClick()\"\n [disabled]=\"disablePreviousButton\"\n tabindex=\"{{tabindex}}\">\n <i class=\"ec-icon icon-angle-down rotate-90\"></i>\n </button>\n\n @if (view.mode === 'day') {\n <button\n id=\"{{id}}_month_button\"\n class=\"text-body-1 font-weight-bold\"\n (click)=\"onMonthClick()\"\n tabindex=\"{{tabindex}}\">\n {{month}}\n </button>\n }\n\n @if (view.mode !== 'year') {\n <button\n id=\"{{id}}_year_button\"\n class=\"text-body-1 font-weight-bold\"\n (click)=\"onYearClick()\"\n tabindex=\"{{tabindex}}\">\n {{year}}\n </button>\n }\n\n @if (view.mode === 'year') {\n <div id=\"{{id}}_year_range\"\n class=\"text-body-1 font-weight-bold\"\n [innerHTML]=\"yearRange\">\n </div>\n }\n\n <button id=\"{{id}}_next_button\"\n class=\"ml-auto\"\n (click)=\"onNextClick()\"\n [disabled]=\"disableNextButton\"\n tabindex=\"{{tabindex}}\">\n <i class=\"ec-icon icon-angle-down rotate-270\"></i>\n </button>\n</header>\n\n@if (view.mode === 'day') {\n <div\n class=\"mb-1 px-2 d-flex\">\n @for (day of weekDays; track day) {\n <h3\n class=\"text-heading-3 d-flex justify-content-center align-items-center\"\n style=\"width: 2rem; height: 1.75rem;\">{{day}}</h3>\n }\n </div>\n}\n\n@for (row of calendarItems; track trackByDateRow($index, row); let isLast = $last) {\n <div\n class=\"px-2 d-flex {{view.mode}}-view\"\n [class.mb-1]=\"!isLast\"\n [class.mb-2]=\"isLast\">\n @for (item of row; track trackByDate($index, item)) {\n <button\n id=\"{{id}}_item_{{item.date | date:'MM_dd_yyyy'}}\"\n ec-calendar-item\n [item]=\"item\"\n [selection]=\"selection\"\n [view]=\"view\"\n (click)=\"onItemSelected(item)\"\n [innerHTML]=\"item.label\"\n [minDate]=\"minDate\"\n [maxDate]=\"maxDate\"\n tabindex=\"{{tabindex}}\">\n </button>\n }\n </div>\n}\n",
|
|
1920
|
-
styles: [":host{display:inline-block}button{font-size:var(--ec-font-size-action);height:2rem;line-height:1.25rem;padding:.3125rem .5rem;border:0;border-radius:var(--ec-border-radius);display:flex;align-items:center;justify-content:center;cursor:pointer}button .label{display:flex;align-items:center;justify-content:center;white-space:nowrap;flex:auto}button .ec-icon{flex:none}button .ec-icon+.label{flex:none;margin-left:.25rem}button.has-badge{padding-right:.0625rem}button:focus{outline:2px solid transparent;outline-offset:2px;position:relative;z-index:1}button:focus-visible{outline-color:var(--ec-border-color-focus)}button:disabled{background-color:var(--ec-background-color-disabled);border:1px solid var(--ec-form-control-border-color-disabled);color:var(--ec-color-disabled-dark);opacity:var(--ec-form-control-opacity-disabled);cursor:default}button:disabled .ec-icon{color:var(--ec-color-disabled-dark)}button{background-color:transparent}button:disabled{background-color:transparent;border-color:transparent;color:var(--ec-color-hint-dark);--ec-color-icon: var(--ec-color-hint-dark)}button:hover:not(:disabled){background-color:var(--ec-background-color-hover)}button:active:not(:disabled){background-color:var(--ec-background-color-selected);font-weight:700}button:focus:not(:disabled){box-shadow:var(--ec-button-box-shadow-active, 0 0 0 2px var(--ec-border-color-focus))}button.is-selected{background-color:var(--ec-background-color-selected);font-weight:700}.day-view button{width:2rem;height:1.75rem}.month-view button{width:4.67rem;height:3.25rem}.quarter-view button{width:7rem;height:6.75rem}.year-view button{width:3.5rem;height:3.25rem}.is-selected:has(+.is-selected:not(:disabled)){border-top-right-radius:0;border-bottom-right-radius:0}.is-selected:not(:disabled)+.is-selected{border-top-left-radius:0;border-bottom-left-radius:0}\n"],
|
|
1923
|
+
styles: [":host{display:inline-block}button{font-size:var(--ec-font-size-action);height:2rem;line-height:1.25rem;padding:.3125rem .5rem;border:0;border-radius:var(--ec-border-radius);color:inherit;display:flex;align-items:center;justify-content:center;cursor:pointer}button .label{display:flex;align-items:center;justify-content:center;white-space:nowrap;flex:auto}button .ec-icon{flex:none}button .ec-icon+.label{flex:none;margin-left:.25rem}button.has-badge{padding-right:.0625rem}button:focus{outline:2px solid transparent;outline-offset:2px;position:relative;z-index:1}button:focus-visible{outline-color:var(--ec-border-color-focus)}button:disabled{background-color:var(--ec-background-color-disabled);border:1px solid var(--ec-form-control-border-color-disabled);color:var(--ec-color-disabled-dark);opacity:var(--ec-form-control-opacity-disabled);cursor:default}button:disabled .ec-icon{color:var(--ec-color-disabled-dark)}button{background-color:transparent}button:disabled{background-color:transparent;border-color:transparent;color:var(--ec-color-hint-dark);--ec-color-icon: var(--ec-color-hint-dark)}button:hover:not(:disabled){background-color:var(--ec-background-color-hover)}button:active:not(:disabled){background-color:var(--ec-background-color-selected);font-weight:700}button:focus:not(:disabled){box-shadow:var(--ec-button-box-shadow-active, 0 0 0 2px var(--ec-border-color-focus))}button.is-selected{background-color:var(--ec-background-color-selected);font-weight:700}.day-view button{width:2rem;height:1.75rem}.month-view button{width:4.67rem;height:3.25rem}.quarter-view button{width:7rem;height:6.75rem}.year-view button{width:3.5rem;height:3.25rem}.is-selected:has(+.is-selected:not(:disabled)){border-top-right-radius:0;border-bottom-right-radius:0}.is-selected:not(:disabled)+.is-selected{border-top-left-radius:0;border-bottom-left-radius:0}\n"],
|
|
1921
1924
|
dependencies: [{
|
|
1922
1925
|
kind: "component",
|
|
1923
1926
|
type: CalendarItemComponent,
|
|
@@ -1950,7 +1953,7 @@ i0.ɵɵngDeclareClassMetadata({
|
|
|
1950
1953
|
changeDetection: ChangeDetectionStrategy.OnPush,
|
|
1951
1954
|
standalone: false,
|
|
1952
1955
|
template: "<header class=\"d-flex align-items-center mt-1 mb-2 px-1\">\n <button id=\"{{id}}_prev_button\"\n class=\"mr-auto\"\n (click)=\"onPreviousClick()\"\n [disabled]=\"disablePreviousButton\"\n tabindex=\"{{tabindex}}\">\n <i class=\"ec-icon icon-angle-down rotate-90\"></i>\n </button>\n\n @if (view.mode === 'day') {\n <button\n id=\"{{id}}_month_button\"\n class=\"text-body-1 font-weight-bold\"\n (click)=\"onMonthClick()\"\n tabindex=\"{{tabindex}}\">\n {{month}}\n </button>\n }\n\n @if (view.mode !== 'year') {\n <button\n id=\"{{id}}_year_button\"\n class=\"text-body-1 font-weight-bold\"\n (click)=\"onYearClick()\"\n tabindex=\"{{tabindex}}\">\n {{year}}\n </button>\n }\n\n @if (view.mode === 'year') {\n <div id=\"{{id}}_year_range\"\n class=\"text-body-1 font-weight-bold\"\n [innerHTML]=\"yearRange\">\n </div>\n }\n\n <button id=\"{{id}}_next_button\"\n class=\"ml-auto\"\n (click)=\"onNextClick()\"\n [disabled]=\"disableNextButton\"\n tabindex=\"{{tabindex}}\">\n <i class=\"ec-icon icon-angle-down rotate-270\"></i>\n </button>\n</header>\n\n@if (view.mode === 'day') {\n <div\n class=\"mb-1 px-2 d-flex\">\n @for (day of weekDays; track day) {\n <h3\n class=\"text-heading-3 d-flex justify-content-center align-items-center\"\n style=\"width: 2rem; height: 1.75rem;\">{{day}}</h3>\n }\n </div>\n}\n\n@for (row of calendarItems; track trackByDateRow($index, row); let isLast = $last) {\n <div\n class=\"px-2 d-flex {{view.mode}}-view\"\n [class.mb-1]=\"!isLast\"\n [class.mb-2]=\"isLast\">\n @for (item of row; track trackByDate($index, item)) {\n <button\n id=\"{{id}}_item_{{item.date | date:'MM_dd_yyyy'}}\"\n ec-calendar-item\n [item]=\"item\"\n [selection]=\"selection\"\n [view]=\"view\"\n (click)=\"onItemSelected(item)\"\n [innerHTML]=\"item.label\"\n [minDate]=\"minDate\"\n [maxDate]=\"maxDate\"\n tabindex=\"{{tabindex}}\">\n </button>\n }\n </div>\n}\n",
|
|
1953
|
-
styles: [":host{display:inline-block}button{font-size:var(--ec-font-size-action);height:2rem;line-height:1.25rem;padding:.3125rem .5rem;border:0;border-radius:var(--ec-border-radius);display:flex;align-items:center;justify-content:center;cursor:pointer}button .label{display:flex;align-items:center;justify-content:center;white-space:nowrap;flex:auto}button .ec-icon{flex:none}button .ec-icon+.label{flex:none;margin-left:.25rem}button.has-badge{padding-right:.0625rem}button:focus{outline:2px solid transparent;outline-offset:2px;position:relative;z-index:1}button:focus-visible{outline-color:var(--ec-border-color-focus)}button:disabled{background-color:var(--ec-background-color-disabled);border:1px solid var(--ec-form-control-border-color-disabled);color:var(--ec-color-disabled-dark);opacity:var(--ec-form-control-opacity-disabled);cursor:default}button:disabled .ec-icon{color:var(--ec-color-disabled-dark)}button{background-color:transparent}button:disabled{background-color:transparent;border-color:transparent;color:var(--ec-color-hint-dark);--ec-color-icon: var(--ec-color-hint-dark)}button:hover:not(:disabled){background-color:var(--ec-background-color-hover)}button:active:not(:disabled){background-color:var(--ec-background-color-selected);font-weight:700}button:focus:not(:disabled){box-shadow:var(--ec-button-box-shadow-active, 0 0 0 2px var(--ec-border-color-focus))}button.is-selected{background-color:var(--ec-background-color-selected);font-weight:700}.day-view button{width:2rem;height:1.75rem}.month-view button{width:4.67rem;height:3.25rem}.quarter-view button{width:7rem;height:6.75rem}.year-view button{width:3.5rem;height:3.25rem}.is-selected:has(+.is-selected:not(:disabled)){border-top-right-radius:0;border-bottom-right-radius:0}.is-selected:not(:disabled)+.is-selected{border-top-left-radius:0;border-bottom-left-radius:0}\n"]
|
|
1956
|
+
styles: [":host{display:inline-block}button{font-size:var(--ec-font-size-action);height:2rem;line-height:1.25rem;padding:.3125rem .5rem;border:0;border-radius:var(--ec-border-radius);color:inherit;display:flex;align-items:center;justify-content:center;cursor:pointer}button .label{display:flex;align-items:center;justify-content:center;white-space:nowrap;flex:auto}button .ec-icon{flex:none}button .ec-icon+.label{flex:none;margin-left:.25rem}button.has-badge{padding-right:.0625rem}button:focus{outline:2px solid transparent;outline-offset:2px;position:relative;z-index:1}button:focus-visible{outline-color:var(--ec-border-color-focus)}button:disabled{background-color:var(--ec-background-color-disabled);border:1px solid var(--ec-form-control-border-color-disabled);color:var(--ec-color-disabled-dark);opacity:var(--ec-form-control-opacity-disabled);cursor:default}button:disabled .ec-icon{color:var(--ec-color-disabled-dark)}button{background-color:transparent}button:disabled{background-color:transparent;border-color:transparent;color:var(--ec-color-hint-dark);--ec-color-icon: var(--ec-color-hint-dark)}button:hover:not(:disabled){background-color:var(--ec-background-color-hover)}button:active:not(:disabled){background-color:var(--ec-background-color-selected);font-weight:700}button:focus:not(:disabled){box-shadow:var(--ec-button-box-shadow-active, 0 0 0 2px var(--ec-border-color-focus))}button.is-selected{background-color:var(--ec-background-color-selected);font-weight:700}.day-view button{width:2rem;height:1.75rem}.month-view button{width:4.67rem;height:3.25rem}.quarter-view button{width:7rem;height:6.75rem}.year-view button{width:3.5rem;height:3.25rem}.is-selected:has(+.is-selected:not(:disabled)){border-top-right-radius:0;border-bottom-right-radius:0}.is-selected:not(:disabled)+.is-selected{border-top-left-radius:0;border-bottom-left-radius:0}\n"]
|
|
1954
1957
|
}]
|
|
1955
1958
|
}],
|
|
1956
1959
|
propDecorators: {
|
|
@@ -2308,7 +2311,7 @@ var TooltipComponent = class TooltipComponent {
|
|
|
2308
2311
|
} },
|
|
2309
2312
|
ngImport: i0,
|
|
2310
2313
|
template: "<article id=\"{{id}}\" role=\"tooltip\" class=\"py-3 position-{{position}}\" [class.show-arrow]=\"!hideArrow\">\n @if (title || subtitle) {\n <header class=\"mb-3\">\n <h1 class=\"text-heading-2 px-3 mb-0\">{{title}}</h1>\n <p class=\"text-caption-1 px-3 mb-0\">{{subtitle}}</p>\n </header>\n }\n\n @if (customContent) {\n <ng-container *ngTemplateOutlet=\"customContent\"></ng-container>\n } @else {\n <div class=\"text-body-1 px-3\" [innerHTML]=\"text\"></div>\n }\n\n\n @if (dismissible) {\n <ec-button id=\"tooltipDismiss\" type=\"icon\" icon=\"icon-cancel\" ariaLabel=\"Tooltip_DismissButton_SC\" (clicked)=\"hide()\"></ec-button>\n }\n</article>\n",
|
|
2311
|
-
styles: [":host{display:block;padding:.75rem}article{background-color:var(--ec-tooltip-background-color,
|
|
2314
|
+
styles: [":host{display:block;padding:.75rem}article{background-color:var(--ec-tooltip-background-color, var(--ec-color-gray-8));color:var(--ec-tooltip-color, var(--ec-color-primary-light));border-radius:var(--ec-border-radius-card);position:relative;box-shadow:var(--ec-box-shadow-overlay);--ec-color-link: var(--ec-color-link-light)}article.show-arrow:after{content:\"\";height:0;width:0;border:.625rem solid transparent;display:block;position:absolute;pointer-events:none}article.show-arrow.position-top-left:after,article.show-arrow.position-top-center:after,article.show-arrow.position-top-right:after{bottom:-1.25rem;border-top-color:var(--ec-tooltip-background-color, var(--ec-color-gray-8))}article.show-arrow.position-bottom-left:after,article.show-arrow.position-bottom-center:after,article.show-arrow.position-bottom-right:after{top:-1.25rem;border-bottom-color:var(--ec-tooltip-background-color, var(--ec-color-gray-8))}article.show-arrow.position-top-left:after,article.show-arrow.position-bottom-left:after{right:1rem}article.show-arrow.position-top-right:after,article.show-arrow.position-bottom-right:after{left:1rem}article.show-arrow.position-top-center:after,article.show-arrow.position-bottom-center:after{right:50%;transform:translate(50%)}article.show-arrow.position-right-top:after,article.show-arrow.position-right-center:after,article.show-arrow.position-right-bottom:after{left:-1.25rem;border-right-color:var(--ec-tooltip-background-color, var(--ec-color-gray-8))}article.show-arrow.position-left-top:after,article.show-arrow.position-left-center:after,article.show-arrow.position-left-bottom:after{right:-1.25rem;border-left-color:var(--ec-tooltip-background-color, var(--ec-color-gray-8))}article.show-arrow.position-left-top:after,article.show-arrow.position-right-top:after{top:1rem}article.show-arrow.position-left-bottom:after,article.show-arrow.position-right-bottom:after{bottom:1rem}article.show-arrow.position-left-center:after,article.show-arrow.position-right-center:after{bottom:50%;transform:translateY(50%)}.text-heading-2{color:var(--ec-tooltip-color-title, var(--ec-color-primary-light))}.text-body-1{color:var(--ec-color-primary-light)}.text-body-1 ::ng-deep p:last-child{margin-bottom:0}.text-body-1 ::ng-deep a{font-weight:var(--ec-font-weight-bold)}.text-caption-1{color:var(--ec-color-secondary-light)}ec-button{--ec-button-color-icon: var(--ec-color-secondary-light);--ec-button-color-icon-hover: var(--ec-color-primary-light);--ec-background-color-hover: rgba(255,255,255,.15);position:absolute;top:.25rem;right:.25rem}\n"],
|
|
2312
2315
|
dependencies: [{
|
|
2313
2316
|
kind: "directive",
|
|
2314
2317
|
type: i1$3.NgTemplateOutlet,
|
|
@@ -2330,6 +2333,7 @@ var TooltipComponent = class TooltipComponent {
|
|
|
2330
2333
|
"iconColor",
|
|
2331
2334
|
"label",
|
|
2332
2335
|
"ariaLabel",
|
|
2336
|
+
"ariaPressed",
|
|
2333
2337
|
"ariaExpanded",
|
|
2334
2338
|
"ariaHaspopup",
|
|
2335
2339
|
"ariaActivedescendant",
|
|
@@ -2361,7 +2365,7 @@ i0.ɵɵngDeclareClassMetadata({
|
|
|
2361
2365
|
changeDetection: ChangeDetectionStrategy.Eager,
|
|
2362
2366
|
standalone: false,
|
|
2363
2367
|
template: "<article id=\"{{id}}\" role=\"tooltip\" class=\"py-3 position-{{position}}\" [class.show-arrow]=\"!hideArrow\">\n @if (title || subtitle) {\n <header class=\"mb-3\">\n <h1 class=\"text-heading-2 px-3 mb-0\">{{title}}</h1>\n <p class=\"text-caption-1 px-3 mb-0\">{{subtitle}}</p>\n </header>\n }\n\n @if (customContent) {\n <ng-container *ngTemplateOutlet=\"customContent\"></ng-container>\n } @else {\n <div class=\"text-body-1 px-3\" [innerHTML]=\"text\"></div>\n }\n\n\n @if (dismissible) {\n <ec-button id=\"tooltipDismiss\" type=\"icon\" icon=\"icon-cancel\" ariaLabel=\"Tooltip_DismissButton_SC\" (clicked)=\"hide()\"></ec-button>\n }\n</article>\n",
|
|
2364
|
-
styles: [":host{display:block;padding:.75rem}article{background-color:var(--ec-tooltip-background-color,
|
|
2368
|
+
styles: [":host{display:block;padding:.75rem}article{background-color:var(--ec-tooltip-background-color, var(--ec-color-gray-8));color:var(--ec-tooltip-color, var(--ec-color-primary-light));border-radius:var(--ec-border-radius-card);position:relative;box-shadow:var(--ec-box-shadow-overlay);--ec-color-link: var(--ec-color-link-light)}article.show-arrow:after{content:\"\";height:0;width:0;border:.625rem solid transparent;display:block;position:absolute;pointer-events:none}article.show-arrow.position-top-left:after,article.show-arrow.position-top-center:after,article.show-arrow.position-top-right:after{bottom:-1.25rem;border-top-color:var(--ec-tooltip-background-color, var(--ec-color-gray-8))}article.show-arrow.position-bottom-left:after,article.show-arrow.position-bottom-center:after,article.show-arrow.position-bottom-right:after{top:-1.25rem;border-bottom-color:var(--ec-tooltip-background-color, var(--ec-color-gray-8))}article.show-arrow.position-top-left:after,article.show-arrow.position-bottom-left:after{right:1rem}article.show-arrow.position-top-right:after,article.show-arrow.position-bottom-right:after{left:1rem}article.show-arrow.position-top-center:after,article.show-arrow.position-bottom-center:after{right:50%;transform:translate(50%)}article.show-arrow.position-right-top:after,article.show-arrow.position-right-center:after,article.show-arrow.position-right-bottom:after{left:-1.25rem;border-right-color:var(--ec-tooltip-background-color, var(--ec-color-gray-8))}article.show-arrow.position-left-top:after,article.show-arrow.position-left-center:after,article.show-arrow.position-left-bottom:after{right:-1.25rem;border-left-color:var(--ec-tooltip-background-color, var(--ec-color-gray-8))}article.show-arrow.position-left-top:after,article.show-arrow.position-right-top:after{top:1rem}article.show-arrow.position-left-bottom:after,article.show-arrow.position-right-bottom:after{bottom:1rem}article.show-arrow.position-left-center:after,article.show-arrow.position-right-center:after{bottom:50%;transform:translateY(50%)}.text-heading-2{color:var(--ec-tooltip-color-title, var(--ec-color-primary-light))}.text-body-1{color:var(--ec-color-primary-light)}.text-body-1 ::ng-deep p:last-child{margin-bottom:0}.text-body-1 ::ng-deep a{font-weight:var(--ec-font-weight-bold)}.text-caption-1{color:var(--ec-color-secondary-light)}ec-button{--ec-button-color-icon: var(--ec-color-secondary-light);--ec-button-color-icon-hover: var(--ec-color-primary-light);--ec-background-color-hover: rgba(255,255,255,.15);position:absolute;top:.25rem;right:.25rem}\n"]
|
|
2365
2369
|
}]
|
|
2366
2370
|
}],
|
|
2367
2371
|
propDecorators: {
|
|
@@ -2668,7 +2672,7 @@ var TagsComponent = class TagsComponent {
|
|
|
2668
2672
|
usesOnChanges: true,
|
|
2669
2673
|
ngImport: i0,
|
|
2670
2674
|
template: "<ul class=\"tags\"\n [class.is-wrapped]=\"wrap\">\n @for (tag of tagsArray; track tag; let i = $index) {\n <li\n id=\"{{id}}_tag_{{i}}\"\n class=\"tag is-{{tag.type}} {{tag.classList}} mr-1\"\n [class.is-condensed]=\"isCondensed\"\n [class.is-subtle]=\"isSubtle\"\n title=\"{{(tag.tooltip ?? '') | translate}}\">\n @if (tag.icon) {\n <i\n class=\"ec-icon {{tag.icon}} ec-icon-sm\" aria-hidden=\"true\"></i>\n }\n @if (!tag.url) {\n <span [innerHtml]=\"tag.label | translate | highlightText:highlightText:highlightNormalizePattern\"></span>\n }\n @if (tag.url) {\n <a\n id=\"{{id}}_tag_{{i}}_link\"\n class=\"font-weight-bold\"\n href=\"{{tag.url}}\"\n target=\"{{tag.target}}\">{{tag.label | translate}}</a>\n }\n @if (tag.isDismissable) {\n <button id=\"{{id}}_tag_{{i}}_dismissButton\"\n (click)=\"closeTag(tag)\"\n [attr.aria-label]=\"'Dismiss ' + (tag.label | translate)\"\n class=\"tag-close-btn\">\n <i class=\"ec-icon ec-icon-sm icon-cancel\" aria-hidden=\"true\"></i>\n </button>\n }\n </li>\n }\n</ul>",
|
|
2671
|
-
styles: ["@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(1turn)}}:host{display:block}.tags{padding:0;margin:0;list-style:none;display:flex}.tags.is-wrapped{flex-wrap:wrap;margin-top:.25rem}.tags.is-wrapped>.tag{margin-bottom:.25rem}.tag a[target=_blank]{color:var(--ec-color-
|
|
2675
|
+
styles: ["@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(1turn)}}:host{display:block}.tags{padding:0;margin:0;list-style:none;display:flex}.tags.is-wrapped{flex-wrap:wrap;margin-top:.25rem}.tags.is-wrapped>.tag{margin-bottom:.25rem}.tag a[target=_blank]{color:var(--ec-color-primary-dark)}\n"],
|
|
2672
2676
|
dependencies: [{
|
|
2673
2677
|
kind: "pipe",
|
|
2674
2678
|
type: i2.TranslatePipe,
|
|
@@ -2694,7 +2698,7 @@ i0.ɵɵngDeclareClassMetadata({
|
|
|
2694
2698
|
changeDetection: ChangeDetectionStrategy.Eager,
|
|
2695
2699
|
standalone: false,
|
|
2696
2700
|
template: "<ul class=\"tags\"\n [class.is-wrapped]=\"wrap\">\n @for (tag of tagsArray; track tag; let i = $index) {\n <li\n id=\"{{id}}_tag_{{i}}\"\n class=\"tag is-{{tag.type}} {{tag.classList}} mr-1\"\n [class.is-condensed]=\"isCondensed\"\n [class.is-subtle]=\"isSubtle\"\n title=\"{{(tag.tooltip ?? '') | translate}}\">\n @if (tag.icon) {\n <i\n class=\"ec-icon {{tag.icon}} ec-icon-sm\" aria-hidden=\"true\"></i>\n }\n @if (!tag.url) {\n <span [innerHtml]=\"tag.label | translate | highlightText:highlightText:highlightNormalizePattern\"></span>\n }\n @if (tag.url) {\n <a\n id=\"{{id}}_tag_{{i}}_link\"\n class=\"font-weight-bold\"\n href=\"{{tag.url}}\"\n target=\"{{tag.target}}\">{{tag.label | translate}}</a>\n }\n @if (tag.isDismissable) {\n <button id=\"{{id}}_tag_{{i}}_dismissButton\"\n (click)=\"closeTag(tag)\"\n [attr.aria-label]=\"'Dismiss ' + (tag.label | translate)\"\n class=\"tag-close-btn\">\n <i class=\"ec-icon ec-icon-sm icon-cancel\" aria-hidden=\"true\"></i>\n </button>\n }\n </li>\n }\n</ul>",
|
|
2697
|
-
styles: ["@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(1turn)}}:host{display:block}.tags{padding:0;margin:0;list-style:none;display:flex}.tags.is-wrapped{flex-wrap:wrap;margin-top:.25rem}.tags.is-wrapped>.tag{margin-bottom:.25rem}.tag a[target=_blank]{color:var(--ec-color-
|
|
2701
|
+
styles: ["@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(1turn)}}:host{display:block}.tags{padding:0;margin:0;list-style:none;display:flex}.tags.is-wrapped{flex-wrap:wrap;margin-top:.25rem}.tags.is-wrapped>.tag{margin-bottom:.25rem}.tag a[target=_blank]{color:var(--ec-color-primary-dark)}\n"]
|
|
2698
2702
|
}]
|
|
2699
2703
|
}],
|
|
2700
2704
|
ctorParameters: () => [],
|
|
@@ -2841,7 +2845,7 @@ var PopoverComponent = class PopoverComponent {
|
|
|
2841
2845
|
}],
|
|
2842
2846
|
ngImport: i0,
|
|
2843
2847
|
template: "<!-- Before hover state -->\n<div class=\"p-2\"\n role=\"button\"\n tabindex=\"0\"\n [attr.aria-label]=\"resolvedAriaLabel\"\n [attr.aria-describedby]=\"isVisible ? contentId : null\"\n (keydown)=\"onTriggerKeydown($event)\">\n @if (!tag) {\n <i class=\"ec-icon {{icon}} ec-icon-sm\" aria-hidden=\"true\"></i>\n }\n @if (tag) {\n <ec-tags\n [isCondensed] = \"true\"\n [tags]=\"tag\">\n </ec-tags>\n }\n</div>\n<!-- ./Before hover state -->\n\n<!-- Hover state -->\n<ng-template #content>\n <article class=\"popover-content\"\n role=\"tooltip\"\n [id]=\"contentId\"\n (document:mousemove)=\"onMouseMove($event)\">\n <ng-content></ng-content>\n </article>\n <div class=\"p-2 {{contentPosition}}\">\n @if (!tag) {\n <i class=\"ec-icon {{icon}} ec-icon-sm {{iconHoverClass}}\" aria-hidden=\"true\"></i>\n }\n @if (tag) {\n <ec-tags\n [isCondensed]=\"true\"\n [tags]=\"hoverTag\">\n </ec-tags>\n }\n </div>\n</ng-template>\n<!-- ./Hover state -->\n",
|
|
2844
|
-
styles: [":host{line-height:.75rem;display:inline-block}:host>div{border-radius:var(--ec-border-radius)}:host>div:focus-visible{outline:.125rem solid var(--ec-color-interactive);outline-offset:-.125rem}.popover-content{border-radius:var(--ec-border-radius);box-shadow:0 3px 6px
|
|
2848
|
+
styles: [":host{line-height:.75rem;display:inline-block}:host>div{border-radius:var(--ec-border-radius)}:host>div:focus-visible{outline:.125rem solid var(--ec-color-interactive);outline-offset:-.125rem}.popover-content{--ec-color-primary-dark: var(--ec-color-black);color:var(--ec-color-primary-dark);border-radius:var(--ec-border-radius);box-shadow:0 3px 6px 0 var(--ec-color-shadow-overlay);overflow:hidden;position:relative}.popover-content+div{position:absolute;line-height:.75rem}.popover-content+div.top-left{top:0;left:0}.popover-content+div.top-right{top:0;right:0}.popover-content+div.bottom-right{bottom:0;right:0}.popover-content+div.bottom-left{bottom:0;left:0}\n"],
|
|
2845
2849
|
dependencies: [{
|
|
2846
2850
|
kind: "component",
|
|
2847
2851
|
type: TagsComponent,
|
|
@@ -2873,7 +2877,7 @@ i0.ɵɵngDeclareClassMetadata({
|
|
|
2873
2877
|
changeDetection: ChangeDetectionStrategy.Eager,
|
|
2874
2878
|
standalone: false,
|
|
2875
2879
|
template: "<!-- Before hover state -->\n<div class=\"p-2\"\n role=\"button\"\n tabindex=\"0\"\n [attr.aria-label]=\"resolvedAriaLabel\"\n [attr.aria-describedby]=\"isVisible ? contentId : null\"\n (keydown)=\"onTriggerKeydown($event)\">\n @if (!tag) {\n <i class=\"ec-icon {{icon}} ec-icon-sm\" aria-hidden=\"true\"></i>\n }\n @if (tag) {\n <ec-tags\n [isCondensed] = \"true\"\n [tags]=\"tag\">\n </ec-tags>\n }\n</div>\n<!-- ./Before hover state -->\n\n<!-- Hover state -->\n<ng-template #content>\n <article class=\"popover-content\"\n role=\"tooltip\"\n [id]=\"contentId\"\n (document:mousemove)=\"onMouseMove($event)\">\n <ng-content></ng-content>\n </article>\n <div class=\"p-2 {{contentPosition}}\">\n @if (!tag) {\n <i class=\"ec-icon {{icon}} ec-icon-sm {{iconHoverClass}}\" aria-hidden=\"true\"></i>\n }\n @if (tag) {\n <ec-tags\n [isCondensed]=\"true\"\n [tags]=\"hoverTag\">\n </ec-tags>\n }\n </div>\n</ng-template>\n<!-- ./Hover state -->\n",
|
|
2876
|
-
styles: [":host{line-height:.75rem;display:inline-block}:host>div{border-radius:var(--ec-border-radius)}:host>div:focus-visible{outline:.125rem solid var(--ec-color-interactive);outline-offset:-.125rem}.popover-content{border-radius:var(--ec-border-radius);box-shadow:0 3px 6px
|
|
2880
|
+
styles: [":host{line-height:.75rem;display:inline-block}:host>div{border-radius:var(--ec-border-radius)}:host>div:focus-visible{outline:.125rem solid var(--ec-color-interactive);outline-offset:-.125rem}.popover-content{--ec-color-primary-dark: var(--ec-color-black);color:var(--ec-color-primary-dark);border-radius:var(--ec-border-radius);box-shadow:0 3px 6px 0 var(--ec-color-shadow-overlay);overflow:hidden;position:relative}.popover-content+div{position:absolute;line-height:.75rem}.popover-content+div.top-left{top:0;left:0}.popover-content+div.top-right{top:0;right:0}.popover-content+div.bottom-right{bottom:0;right:0}.popover-content+div.bottom-left{bottom:0;left:0}\n"]
|
|
2877
2881
|
}]
|
|
2878
2882
|
}],
|
|
2879
2883
|
ctorParameters: () => [
|
|
@@ -3219,6 +3223,7 @@ var CollapsibleToggleComponent = class CollapsibleToggleComponent {
|
|
|
3219
3223
|
"iconColor",
|
|
3220
3224
|
"label",
|
|
3221
3225
|
"ariaLabel",
|
|
3226
|
+
"ariaPressed",
|
|
3222
3227
|
"ariaExpanded",
|
|
3223
3228
|
"ariaHaspopup",
|
|
3224
3229
|
"ariaActivedescendant",
|
|
@@ -4330,7 +4335,7 @@ var TextboxComponent = class TextboxComponent extends FormControlBase {
|
|
|
4330
4335
|
usesOnChanges: true,
|
|
4331
4336
|
ngImport: i0,
|
|
4332
4337
|
template: "<div class=\"control control-label-{{labelPosition}}\"\n [ngClass]=\"{'is-readonly': readonly}\">\n\n @if (label) {\n <label>\n <span>{{label | translate}}</span>\n @if (validationErrors.length > 0 && formModel.touched && formModel.invalid) {\n <span> {{validationErrors |\n translate}}</span>\n }\n @if (helpPopover) {\n <ec-help-popover id=\"{{id}}_helpPopover\"\n class=\"d-inline-block my-n3 mx-n1\"\n text=\"{{helpPopover | translate}}\"\n contentPosition=\"{{helpPopoverPosition}}\">\n </ec-help-popover>\n }\n </label>\n }\n\n <div class=\"input-wrapper control-input\">\n @if (type !== 'multi_line') {\n <input\n #textboxInput\n email=\"{{type === 'email' ? true : false}}\"\n pattern=\"{{validationPattern}}\"\n type=\"{{type}}\"\n tabindex=\"{{tabindex}}\"\n title=\"{{tooltip}}\"\n [attr.id]=\"inputId\"\n [attr.autocomplete]=\"autocomplete\"\n [attr.placeholder]=\"placeholder\"\n [attr.maxlength]=\"maxlength\"\n [attr.minlength]=\"minlength\"\n [attr.required]=\"required ? required : null\"\n [formControl]=\"formModel\"\n [ngClass]=\"{'is-empty': !formModel?.value, 'is-pending': pending, 'is-uppercase': upperCase}\"\n (focusout)=\"focusOutEvent()\"\n [attr.cdkFocusInitial]=\"autofocus || null\">\n }\n\n @if (type === 'multi_line') {\n <textarea\n [attr.rows]=\"rows\"\n #textboxInput\n tabindex=\"{{tabindex}}\"\n [attr.id]=\"inputId\"\n [attr.placeholder]=\"placeholder\"\n [attr.maxlength]=\"maxlength\"\n [attr.minlength]=\"minlength\"\n [attr.required]=\"required ? required : null\"\n [formControl]=\"formModel\"\n [ngClass]=\"{'is-empty': formModel?.value === '', 'is-pending': pending}\"\n [attr.cdkFocusInitial]=\"autofocus || null\">\n </textarea>\n }\n\n <i class=\"ec-icon icon-required\"></i>\n <i class=\"ec-icon icon-invalid\"></i>\n <i class=\"ec-icon icon-loading\"></i>\n </div>\n</div>",
|
|
4333
|
-
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)}: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:hover:not(:disabled):not(:focus),:host .control.invalid .textbox-group-input ::ng-deep .control input.ng-valid:hover:not(:disabled):not(:focus){border-color:var(--ec-form-control-border-color-hover)}: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-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~.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:not(:focus){border-color:var(--ec-form-control-border-color-invalid)}: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:hover:not(:disabled):not(:focus){border-color:var(--ec-form-control-border-color-hover)}:host .textbox-group{display:flex;position:relative}:host textarea:focus,:host input:focus,:host select:focus{outline:2px solid transparent;outline-offset:2px}:host textarea:focus-visible,:host input:focus-visible,:host select:focus-visible{outline-color:var(--ec-border-color-focus)}:host .sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}: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 input::selection{background-color:var(--ec-form-control-background-color-selection);color:var(--ec-form-control-color-selection)}:host input::-webkit-input-placeholder{color:var(--ec-form-control-color-placeholder)}:host input::-moz-placeholder{color:var(--ec-form-control-color-placeholder);opacity:1}:host input:-ms-input-placeholder{color:var(--ec-form-control-color-placeholder)}:host input:-moz-placeholder{color:var(--ec-form-control-color-placeholder);opacity:1}:host input{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 .5rem;height:2rem}:host input~.icon-required,:host input~.icon-invalid{color:var(--ec-form-control-border-color-invalid)}:host input:required.is-empty{background-repeat:no-repeat;background-position:.5rem center;background-size:1rem,1rem;padding-left:1.75rem;background-image:none}:host input:required.is-empty~.icon-required{display:inline-flex;position:absolute;left:.5rem;top:.5rem;z-index:1}:host input.ng-invalid.ng-touched{background-color:var(--ec-form-control-background-color-invalid);border-color:var(--ec-form-control-border-color-invalid)}:host input.ng-invalid.ng-touched:focus{border-color:var(--ec-form-control-background-color-invalid)}:host input.ng-invalid.ng-touched:hover:not(:disabled):not(:focus){border-color:var(--ec-form-control-border-color-hover)}:host input.ng-invalid.ng-touched{background-repeat:no-repeat;background-position:.5rem center;background-size:1rem,1rem;padding-left:1.75rem;background-image:none}:host input.ng-invalid.ng-touched~.icon-invalid{display:inline-flex;position:absolute;left:.5rem;top:.5rem;z-index:1}:host input.ng-invalid.ng-touched~.icon-required{display:none}:host input.is-pending.ng-valid,:host input.is-pending.ng-invalid,:host input.is-pending.ng-pending{background-image:\"\";background-repeat:no-repeat;background-position:.5rem center;background-size:1rem,1rem;padding-left:1.75rem}:host input.is-pending.ng-valid~.icon-loading,:host input.is-pending.ng-invalid~.icon-loading,:host input.is-pending.ng-pending~.icon-loading{display:inline-flex;position:absolute;left:.5rem;top:.5rem;z-index:1}:host input.is-pending.ng-valid~.icon-required,:host input.is-pending.ng-valid~.icon-invalid,:host input.is-pending.ng-invalid~.icon-required,:host input.is-pending.ng-invalid~.icon-invalid,:host input.is-pending.ng-pending~.icon-required,:host input.is-pending.ng-pending~.icon-invalid{display:none}:host input:focus,:host input:focus.is-empty{border-color:var(--ec-form-control-border-color-focus);box-shadow:var(--ec-form-control-box-shadow-focus);outline:2px solid transparent;outline-offset:2px;position:relative;z-index:1}:host input: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 input:disabled:required,:host input: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 input:disabled:required+.icon-required,:host input:disabled:required.is-empty+.icon-required{display:none}:host input:hover:not(:disabled):not(:focus){border-color:var(--ec-form-control-border-color-hover)}:host input.is-uppercase:not(.is-empty){text-transform:uppercase}:host textarea::selection{background-color:var(--ec-form-control-background-color-selection);color:var(--ec-form-control-color-selection)}:host textarea::-webkit-input-placeholder{color:var(--ec-form-control-color-placeholder)}:host textarea::-moz-placeholder{color:var(--ec-form-control-color-placeholder);opacity:1}:host textarea:-ms-input-placeholder{color:var(--ec-form-control-color-placeholder)}:host textarea:-moz-placeholder{color:var(--ec-form-control-color-placeholder);opacity:1}:host textarea{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 .5rem;height:auto}:host textarea~.icon-required,:host textarea~.icon-invalid{color:var(--ec-form-control-border-color-invalid)}:host textarea:required.is-empty{background-repeat:no-repeat;background-position:.5rem .5rem;background-size:1rem,1rem;padding-left:1.75rem;background-image:none}:host textarea:required.is-empty~.icon-required{display:inline-flex;position:absolute;left:.5rem;top:.5rem;z-index:1}:host textarea.ng-invalid.ng-touched{background-color:var(--ec-form-control-background-color-invalid);border-color:var(--ec-form-control-border-color-invalid)}:host textarea.ng-invalid.ng-touched:focus{border-color:var(--ec-form-control-background-color-invalid)}:host textarea.ng-invalid.ng-touched:hover:not(:disabled):not(:focus){border-color:var(--ec-form-control-border-color-hover)}:host textarea.ng-invalid.ng-touched{background-repeat:no-repeat;background-position:.5rem .5rem;background-size:1rem,1rem;padding-left:1.75rem;background-image:none}:host textarea.ng-invalid.ng-touched~.icon-invalid{display:inline-flex;position:absolute;left:.5rem;top:.5rem;z-index:1}:host textarea.ng-invalid.ng-touched~.icon-required{display:none}:host textarea.is-pending.ng-valid,:host textarea.is-pending.ng-invalid,:host textarea.is-pending.ng-pending{background-image:\"\";background-repeat:no-repeat;background-position:.5rem .5rem;background-size:1rem,1rem;padding-left:1.75rem}:host textarea.is-pending.ng-valid~.icon-loading,:host textarea.is-pending.ng-invalid~.icon-loading,:host textarea.is-pending.ng-pending~.icon-loading{display:inline-flex;position:absolute;left:.5rem;top:.5rem;z-index:1}:host textarea.is-pending.ng-valid~.icon-required,:host textarea.is-pending.ng-valid~.icon-invalid,:host textarea.is-pending.ng-invalid~.icon-required,:host textarea.is-pending.ng-invalid~.icon-invalid,:host textarea.is-pending.ng-pending~.icon-required,:host textarea.is-pending.ng-pending~.icon-invalid{display:none}:host textarea:focus,:host textarea:focus.is-empty{border-color:var(--ec-form-control-border-color-focus);box-shadow:var(--ec-form-control-box-shadow-focus);outline:2px solid transparent;outline-offset:2px;position:relative;z-index:1}:host textarea: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 textarea:disabled:required,:host textarea: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 textarea:disabled:required+.icon-required,:host textarea:disabled:required.is-empty+.icon-required{display:none}:host textarea:hover:not(:disabled):not(:focus){border-color:var(--ec-form-control-border-color-hover)}:host textarea.is-uppercase:not(.is-empty){text-transform:uppercase}:host textarea{resize:none;display:block}.input-wrapper{position:relative}.input-wrapper>.ec-icon{display:none}:host(.textbox-group-input:not(:last-child)){flex:1 1 0%;width:1px}:host(.textbox-group-input:not(:last-child)) .control{margin-bottom:0}:host(.textbox-group-input:not(:last-child)) .control.is-readonly input{border-right-width:1px}:host(.textbox-group-input:not(:last-child)) input{border-top-right-radius:0;border-bottom-right-radius:0;border-right-width:0}:host(.textbox-group-input:not(:last-child)) input:focus,:host(.textbox-group-input:not(:last-child)) input:hover:not(:disabled){position:relative;z-index:1;border-right-width:1px}:host(.text-truncate) input{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}:host(.is-monospace) input,:host(.is-monospace) textarea,:host-context(.is-monospace) input,:host-context(.is-monospace) textarea{font-family:var(--ec-font-family-monospace)}\n"],
|
|
4338
|
+
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)}: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:hover:not(:disabled):not(:focus),:host .control.invalid .textbox-group-input ::ng-deep .control input.ng-valid:hover:not(:disabled):not(:focus){border-color:var(--ec-form-control-border-color-hover)}: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-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~.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:not(:focus){border-color:var(--ec-form-control-border-color-invalid)}: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:hover:not(:disabled):not(:focus){border-color:var(--ec-form-control-border-color-hover)}:host .textbox-group{display:flex;position:relative}:host textarea:focus,:host input:focus,:host select:focus{outline:2px solid transparent;outline-offset:2px}:host textarea:focus-visible,:host input:focus-visible,:host select:focus-visible{outline-color:var(--ec-border-color-focus)}:host .sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}: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 input::selection{background-color:var(--ec-form-control-background-color-selection);color:var(--ec-form-control-color-selection)}:host input::-webkit-input-placeholder{color:var(--ec-form-control-color-placeholder)}:host input::-moz-placeholder{color:var(--ec-form-control-color-placeholder);opacity:1}:host input:-ms-input-placeholder{color:var(--ec-form-control-color-placeholder)}:host input:-moz-placeholder{color:var(--ec-form-control-color-placeholder);opacity:1}:host input{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;color:inherit;width:100%;line-height:1.25rem;padding:.3125rem .5rem;height:2rem}:host input~.icon-required,:host input~.icon-invalid{color:var(--ec-form-control-border-color-invalid)}:host input:required.is-empty{background-repeat:no-repeat;background-position:.5rem center;background-size:1rem,1rem;padding-left:1.75rem;background-image:none}:host input:required.is-empty~.icon-required{display:inline-flex;position:absolute;left:.5rem;top:.5rem;z-index:1}:host input.ng-invalid.ng-touched{background-color:var(--ec-form-control-background-color-invalid);border-color:var(--ec-form-control-border-color-invalid)}:host input.ng-invalid.ng-touched:focus{border-color:var(--ec-form-control-background-color-invalid)}:host input.ng-invalid.ng-touched:hover:not(:disabled):not(:focus){border-color:var(--ec-form-control-border-color-hover)}:host input.ng-invalid.ng-touched{background-repeat:no-repeat;background-position:.5rem center;background-size:1rem,1rem;padding-left:1.75rem;background-image:none}:host input.ng-invalid.ng-touched~.icon-invalid{display:inline-flex;position:absolute;left:.5rem;top:.5rem;z-index:1}:host input.ng-invalid.ng-touched~.icon-required{display:none}:host input.is-pending.ng-valid,:host input.is-pending.ng-invalid,:host input.is-pending.ng-pending{background-image:\"\";background-repeat:no-repeat;background-position:.5rem center;background-size:1rem,1rem;padding-left:1.75rem}:host input.is-pending.ng-valid~.icon-loading,:host input.is-pending.ng-invalid~.icon-loading,:host input.is-pending.ng-pending~.icon-loading{display:inline-flex;position:absolute;left:.5rem;top:.5rem;z-index:1}:host input.is-pending.ng-valid~.icon-required,:host input.is-pending.ng-valid~.icon-invalid,:host input.is-pending.ng-invalid~.icon-required,:host input.is-pending.ng-invalid~.icon-invalid,:host input.is-pending.ng-pending~.icon-required,:host input.is-pending.ng-pending~.icon-invalid{display:none}:host input:focus,:host input:focus.is-empty{border-color:var(--ec-form-control-border-color-focus);box-shadow:var(--ec-form-control-box-shadow-focus);outline:2px solid transparent;outline-offset:2px;position:relative;z-index:1}:host input: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 input:disabled:required,:host input: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 input:disabled:required+.icon-required,:host input:disabled:required.is-empty+.icon-required{display:none}:host input:hover:not(:disabled):not(:focus){border-color:var(--ec-form-control-border-color-hover)}:host input.is-uppercase:not(.is-empty){text-transform:uppercase}:host textarea::selection{background-color:var(--ec-form-control-background-color-selection);color:var(--ec-form-control-color-selection)}:host textarea::-webkit-input-placeholder{color:var(--ec-form-control-color-placeholder)}:host textarea::-moz-placeholder{color:var(--ec-form-control-color-placeholder);opacity:1}:host textarea:-ms-input-placeholder{color:var(--ec-form-control-color-placeholder)}:host textarea:-moz-placeholder{color:var(--ec-form-control-color-placeholder);opacity:1}:host textarea{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;color:inherit;width:100%;line-height:1.25rem;padding:.3125rem .5rem;height:auto}:host textarea~.icon-required,:host textarea~.icon-invalid{color:var(--ec-form-control-border-color-invalid)}:host textarea:required.is-empty{background-repeat:no-repeat;background-position:.5rem .5rem;background-size:1rem,1rem;padding-left:1.75rem;background-image:none}:host textarea:required.is-empty~.icon-required{display:inline-flex;position:absolute;left:.5rem;top:.5rem;z-index:1}:host textarea.ng-invalid.ng-touched{background-color:var(--ec-form-control-background-color-invalid);border-color:var(--ec-form-control-border-color-invalid)}:host textarea.ng-invalid.ng-touched:focus{border-color:var(--ec-form-control-background-color-invalid)}:host textarea.ng-invalid.ng-touched:hover:not(:disabled):not(:focus){border-color:var(--ec-form-control-border-color-hover)}:host textarea.ng-invalid.ng-touched{background-repeat:no-repeat;background-position:.5rem .5rem;background-size:1rem,1rem;padding-left:1.75rem;background-image:none}:host textarea.ng-invalid.ng-touched~.icon-invalid{display:inline-flex;position:absolute;left:.5rem;top:.5rem;z-index:1}:host textarea.ng-invalid.ng-touched~.icon-required{display:none}:host textarea.is-pending.ng-valid,:host textarea.is-pending.ng-invalid,:host textarea.is-pending.ng-pending{background-image:\"\";background-repeat:no-repeat;background-position:.5rem .5rem;background-size:1rem,1rem;padding-left:1.75rem}:host textarea.is-pending.ng-valid~.icon-loading,:host textarea.is-pending.ng-invalid~.icon-loading,:host textarea.is-pending.ng-pending~.icon-loading{display:inline-flex;position:absolute;left:.5rem;top:.5rem;z-index:1}:host textarea.is-pending.ng-valid~.icon-required,:host textarea.is-pending.ng-valid~.icon-invalid,:host textarea.is-pending.ng-invalid~.icon-required,:host textarea.is-pending.ng-invalid~.icon-invalid,:host textarea.is-pending.ng-pending~.icon-required,:host textarea.is-pending.ng-pending~.icon-invalid{display:none}:host textarea:focus,:host textarea:focus.is-empty{border-color:var(--ec-form-control-border-color-focus);box-shadow:var(--ec-form-control-box-shadow-focus);outline:2px solid transparent;outline-offset:2px;position:relative;z-index:1}:host textarea: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 textarea:disabled:required,:host textarea: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 textarea:disabled:required+.icon-required,:host textarea:disabled:required.is-empty+.icon-required{display:none}:host textarea:hover:not(:disabled):not(:focus){border-color:var(--ec-form-control-border-color-hover)}:host textarea.is-uppercase:not(.is-empty){text-transform:uppercase}:host textarea{resize:none;display:block}.input-wrapper{position:relative}.input-wrapper>.ec-icon{display:none}:host(.textbox-group-input:not(:last-child)){flex:1 1 0%;width:1px}:host(.textbox-group-input:not(:last-child)) .control{margin-bottom:0}:host(.textbox-group-input:not(:last-child)) .control.is-readonly input{border-right-width:1px}:host(.textbox-group-input:not(:last-child)) input{border-top-right-radius:0;border-bottom-right-radius:0;border-right-width:0}:host(.textbox-group-input:not(:last-child)) input:focus,:host(.textbox-group-input:not(:last-child)) input:hover:not(:disabled){position:relative;z-index:1;border-right-width:1px}:host(.text-truncate) input{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}:host(.is-monospace) input,:host(.is-monospace) textarea,:host-context(.is-monospace) input,:host-context(.is-monospace) textarea{font-family:var(--ec-font-family-monospace)}\n"],
|
|
4334
4339
|
dependencies: [
|
|
4335
4340
|
{
|
|
4336
4341
|
kind: "directive",
|
|
@@ -4405,7 +4410,7 @@ i0.ɵɵngDeclareClassMetadata({
|
|
|
4405
4410
|
changeDetection: ChangeDetectionStrategy.Eager,
|
|
4406
4411
|
standalone: false,
|
|
4407
4412
|
template: "<div class=\"control control-label-{{labelPosition}}\"\n [ngClass]=\"{'is-readonly': readonly}\">\n\n @if (label) {\n <label>\n <span>{{label | translate}}</span>\n @if (validationErrors.length > 0 && formModel.touched && formModel.invalid) {\n <span> {{validationErrors |\n translate}}</span>\n }\n @if (helpPopover) {\n <ec-help-popover id=\"{{id}}_helpPopover\"\n class=\"d-inline-block my-n3 mx-n1\"\n text=\"{{helpPopover | translate}}\"\n contentPosition=\"{{helpPopoverPosition}}\">\n </ec-help-popover>\n }\n </label>\n }\n\n <div class=\"input-wrapper control-input\">\n @if (type !== 'multi_line') {\n <input\n #textboxInput\n email=\"{{type === 'email' ? true : false}}\"\n pattern=\"{{validationPattern}}\"\n type=\"{{type}}\"\n tabindex=\"{{tabindex}}\"\n title=\"{{tooltip}}\"\n [attr.id]=\"inputId\"\n [attr.autocomplete]=\"autocomplete\"\n [attr.placeholder]=\"placeholder\"\n [attr.maxlength]=\"maxlength\"\n [attr.minlength]=\"minlength\"\n [attr.required]=\"required ? required : null\"\n [formControl]=\"formModel\"\n [ngClass]=\"{'is-empty': !formModel?.value, 'is-pending': pending, 'is-uppercase': upperCase}\"\n (focusout)=\"focusOutEvent()\"\n [attr.cdkFocusInitial]=\"autofocus || null\">\n }\n\n @if (type === 'multi_line') {\n <textarea\n [attr.rows]=\"rows\"\n #textboxInput\n tabindex=\"{{tabindex}}\"\n [attr.id]=\"inputId\"\n [attr.placeholder]=\"placeholder\"\n [attr.maxlength]=\"maxlength\"\n [attr.minlength]=\"minlength\"\n [attr.required]=\"required ? required : null\"\n [formControl]=\"formModel\"\n [ngClass]=\"{'is-empty': formModel?.value === '', 'is-pending': pending}\"\n [attr.cdkFocusInitial]=\"autofocus || null\">\n </textarea>\n }\n\n <i class=\"ec-icon icon-required\"></i>\n <i class=\"ec-icon icon-invalid\"></i>\n <i class=\"ec-icon icon-loading\"></i>\n </div>\n</div>",
|
|
4408
|
-
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)}: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:hover:not(:disabled):not(:focus),:host .control.invalid .textbox-group-input ::ng-deep .control input.ng-valid:hover:not(:disabled):not(:focus){border-color:var(--ec-form-control-border-color-hover)}: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-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~.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:not(:focus){border-color:var(--ec-form-control-border-color-invalid)}: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:hover:not(:disabled):not(:focus){border-color:var(--ec-form-control-border-color-hover)}:host .textbox-group{display:flex;position:relative}:host textarea:focus,:host input:focus,:host select:focus{outline:2px solid transparent;outline-offset:2px}:host textarea:focus-visible,:host input:focus-visible,:host select:focus-visible{outline-color:var(--ec-border-color-focus)}:host .sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}: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 input::selection{background-color:var(--ec-form-control-background-color-selection);color:var(--ec-form-control-color-selection)}:host input::-webkit-input-placeholder{color:var(--ec-form-control-color-placeholder)}:host input::-moz-placeholder{color:var(--ec-form-control-color-placeholder);opacity:1}:host input:-ms-input-placeholder{color:var(--ec-form-control-color-placeholder)}:host input:-moz-placeholder{color:var(--ec-form-control-color-placeholder);opacity:1}:host input{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 .5rem;height:2rem}:host input~.icon-required,:host input~.icon-invalid{color:var(--ec-form-control-border-color-invalid)}:host input:required.is-empty{background-repeat:no-repeat;background-position:.5rem center;background-size:1rem,1rem;padding-left:1.75rem;background-image:none}:host input:required.is-empty~.icon-required{display:inline-flex;position:absolute;left:.5rem;top:.5rem;z-index:1}:host input.ng-invalid.ng-touched{background-color:var(--ec-form-control-background-color-invalid);border-color:var(--ec-form-control-border-color-invalid)}:host input.ng-invalid.ng-touched:focus{border-color:var(--ec-form-control-background-color-invalid)}:host input.ng-invalid.ng-touched:hover:not(:disabled):not(:focus){border-color:var(--ec-form-control-border-color-hover)}:host input.ng-invalid.ng-touched{background-repeat:no-repeat;background-position:.5rem center;background-size:1rem,1rem;padding-left:1.75rem;background-image:none}:host input.ng-invalid.ng-touched~.icon-invalid{display:inline-flex;position:absolute;left:.5rem;top:.5rem;z-index:1}:host input.ng-invalid.ng-touched~.icon-required{display:none}:host input.is-pending.ng-valid,:host input.is-pending.ng-invalid,:host input.is-pending.ng-pending{background-image:\"\";background-repeat:no-repeat;background-position:.5rem center;background-size:1rem,1rem;padding-left:1.75rem}:host input.is-pending.ng-valid~.icon-loading,:host input.is-pending.ng-invalid~.icon-loading,:host input.is-pending.ng-pending~.icon-loading{display:inline-flex;position:absolute;left:.5rem;top:.5rem;z-index:1}:host input.is-pending.ng-valid~.icon-required,:host input.is-pending.ng-valid~.icon-invalid,:host input.is-pending.ng-invalid~.icon-required,:host input.is-pending.ng-invalid~.icon-invalid,:host input.is-pending.ng-pending~.icon-required,:host input.is-pending.ng-pending~.icon-invalid{display:none}:host input:focus,:host input:focus.is-empty{border-color:var(--ec-form-control-border-color-focus);box-shadow:var(--ec-form-control-box-shadow-focus);outline:2px solid transparent;outline-offset:2px;position:relative;z-index:1}:host input: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 input:disabled:required,:host input: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 input:disabled:required+.icon-required,:host input:disabled:required.is-empty+.icon-required{display:none}:host input:hover:not(:disabled):not(:focus){border-color:var(--ec-form-control-border-color-hover)}:host input.is-uppercase:not(.is-empty){text-transform:uppercase}:host textarea::selection{background-color:var(--ec-form-control-background-color-selection);color:var(--ec-form-control-color-selection)}:host textarea::-webkit-input-placeholder{color:var(--ec-form-control-color-placeholder)}:host textarea::-moz-placeholder{color:var(--ec-form-control-color-placeholder);opacity:1}:host textarea:-ms-input-placeholder{color:var(--ec-form-control-color-placeholder)}:host textarea:-moz-placeholder{color:var(--ec-form-control-color-placeholder);opacity:1}:host textarea{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 .5rem;height:auto}:host textarea~.icon-required,:host textarea~.icon-invalid{color:var(--ec-form-control-border-color-invalid)}:host textarea:required.is-empty{background-repeat:no-repeat;background-position:.5rem .5rem;background-size:1rem,1rem;padding-left:1.75rem;background-image:none}:host textarea:required.is-empty~.icon-required{display:inline-flex;position:absolute;left:.5rem;top:.5rem;z-index:1}:host textarea.ng-invalid.ng-touched{background-color:var(--ec-form-control-background-color-invalid);border-color:var(--ec-form-control-border-color-invalid)}:host textarea.ng-invalid.ng-touched:focus{border-color:var(--ec-form-control-background-color-invalid)}:host textarea.ng-invalid.ng-touched:hover:not(:disabled):not(:focus){border-color:var(--ec-form-control-border-color-hover)}:host textarea.ng-invalid.ng-touched{background-repeat:no-repeat;background-position:.5rem .5rem;background-size:1rem,1rem;padding-left:1.75rem;background-image:none}:host textarea.ng-invalid.ng-touched~.icon-invalid{display:inline-flex;position:absolute;left:.5rem;top:.5rem;z-index:1}:host textarea.ng-invalid.ng-touched~.icon-required{display:none}:host textarea.is-pending.ng-valid,:host textarea.is-pending.ng-invalid,:host textarea.is-pending.ng-pending{background-image:\"\";background-repeat:no-repeat;background-position:.5rem .5rem;background-size:1rem,1rem;padding-left:1.75rem}:host textarea.is-pending.ng-valid~.icon-loading,:host textarea.is-pending.ng-invalid~.icon-loading,:host textarea.is-pending.ng-pending~.icon-loading{display:inline-flex;position:absolute;left:.5rem;top:.5rem;z-index:1}:host textarea.is-pending.ng-valid~.icon-required,:host textarea.is-pending.ng-valid~.icon-invalid,:host textarea.is-pending.ng-invalid~.icon-required,:host textarea.is-pending.ng-invalid~.icon-invalid,:host textarea.is-pending.ng-pending~.icon-required,:host textarea.is-pending.ng-pending~.icon-invalid{display:none}:host textarea:focus,:host textarea:focus.is-empty{border-color:var(--ec-form-control-border-color-focus);box-shadow:var(--ec-form-control-box-shadow-focus);outline:2px solid transparent;outline-offset:2px;position:relative;z-index:1}:host textarea: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 textarea:disabled:required,:host textarea: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 textarea:disabled:required+.icon-required,:host textarea:disabled:required.is-empty+.icon-required{display:none}:host textarea:hover:not(:disabled):not(:focus){border-color:var(--ec-form-control-border-color-hover)}:host textarea.is-uppercase:not(.is-empty){text-transform:uppercase}:host textarea{resize:none;display:block}.input-wrapper{position:relative}.input-wrapper>.ec-icon{display:none}:host(.textbox-group-input:not(:last-child)){flex:1 1 0%;width:1px}:host(.textbox-group-input:not(:last-child)) .control{margin-bottom:0}:host(.textbox-group-input:not(:last-child)) .control.is-readonly input{border-right-width:1px}:host(.textbox-group-input:not(:last-child)) input{border-top-right-radius:0;border-bottom-right-radius:0;border-right-width:0}:host(.textbox-group-input:not(:last-child)) input:focus,:host(.textbox-group-input:not(:last-child)) input:hover:not(:disabled){position:relative;z-index:1;border-right-width:1px}:host(.text-truncate) input{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}:host(.is-monospace) input,:host(.is-monospace) textarea,:host-context(.is-monospace) input,:host-context(.is-monospace) textarea{font-family:var(--ec-font-family-monospace)}\n"]
|
|
4413
|
+
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)}: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:hover:not(:disabled):not(:focus),:host .control.invalid .textbox-group-input ::ng-deep .control input.ng-valid:hover:not(:disabled):not(:focus){border-color:var(--ec-form-control-border-color-hover)}: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-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~.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:not(:focus){border-color:var(--ec-form-control-border-color-invalid)}: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:hover:not(:disabled):not(:focus){border-color:var(--ec-form-control-border-color-hover)}:host .textbox-group{display:flex;position:relative}:host textarea:focus,:host input:focus,:host select:focus{outline:2px solid transparent;outline-offset:2px}:host textarea:focus-visible,:host input:focus-visible,:host select:focus-visible{outline-color:var(--ec-border-color-focus)}:host .sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}: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 input::selection{background-color:var(--ec-form-control-background-color-selection);color:var(--ec-form-control-color-selection)}:host input::-webkit-input-placeholder{color:var(--ec-form-control-color-placeholder)}:host input::-moz-placeholder{color:var(--ec-form-control-color-placeholder);opacity:1}:host input:-ms-input-placeholder{color:var(--ec-form-control-color-placeholder)}:host input:-moz-placeholder{color:var(--ec-form-control-color-placeholder);opacity:1}:host input{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;color:inherit;width:100%;line-height:1.25rem;padding:.3125rem .5rem;height:2rem}:host input~.icon-required,:host input~.icon-invalid{color:var(--ec-form-control-border-color-invalid)}:host input:required.is-empty{background-repeat:no-repeat;background-position:.5rem center;background-size:1rem,1rem;padding-left:1.75rem;background-image:none}:host input:required.is-empty~.icon-required{display:inline-flex;position:absolute;left:.5rem;top:.5rem;z-index:1}:host input.ng-invalid.ng-touched{background-color:var(--ec-form-control-background-color-invalid);border-color:var(--ec-form-control-border-color-invalid)}:host input.ng-invalid.ng-touched:focus{border-color:var(--ec-form-control-background-color-invalid)}:host input.ng-invalid.ng-touched:hover:not(:disabled):not(:focus){border-color:var(--ec-form-control-border-color-hover)}:host input.ng-invalid.ng-touched{background-repeat:no-repeat;background-position:.5rem center;background-size:1rem,1rem;padding-left:1.75rem;background-image:none}:host input.ng-invalid.ng-touched~.icon-invalid{display:inline-flex;position:absolute;left:.5rem;top:.5rem;z-index:1}:host input.ng-invalid.ng-touched~.icon-required{display:none}:host input.is-pending.ng-valid,:host input.is-pending.ng-invalid,:host input.is-pending.ng-pending{background-image:\"\";background-repeat:no-repeat;background-position:.5rem center;background-size:1rem,1rem;padding-left:1.75rem}:host input.is-pending.ng-valid~.icon-loading,:host input.is-pending.ng-invalid~.icon-loading,:host input.is-pending.ng-pending~.icon-loading{display:inline-flex;position:absolute;left:.5rem;top:.5rem;z-index:1}:host input.is-pending.ng-valid~.icon-required,:host input.is-pending.ng-valid~.icon-invalid,:host input.is-pending.ng-invalid~.icon-required,:host input.is-pending.ng-invalid~.icon-invalid,:host input.is-pending.ng-pending~.icon-required,:host input.is-pending.ng-pending~.icon-invalid{display:none}:host input:focus,:host input:focus.is-empty{border-color:var(--ec-form-control-border-color-focus);box-shadow:var(--ec-form-control-box-shadow-focus);outline:2px solid transparent;outline-offset:2px;position:relative;z-index:1}:host input: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 input:disabled:required,:host input: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 input:disabled:required+.icon-required,:host input:disabled:required.is-empty+.icon-required{display:none}:host input:hover:not(:disabled):not(:focus){border-color:var(--ec-form-control-border-color-hover)}:host input.is-uppercase:not(.is-empty){text-transform:uppercase}:host textarea::selection{background-color:var(--ec-form-control-background-color-selection);color:var(--ec-form-control-color-selection)}:host textarea::-webkit-input-placeholder{color:var(--ec-form-control-color-placeholder)}:host textarea::-moz-placeholder{color:var(--ec-form-control-color-placeholder);opacity:1}:host textarea:-ms-input-placeholder{color:var(--ec-form-control-color-placeholder)}:host textarea:-moz-placeholder{color:var(--ec-form-control-color-placeholder);opacity:1}:host textarea{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;color:inherit;width:100%;line-height:1.25rem;padding:.3125rem .5rem;height:auto}:host textarea~.icon-required,:host textarea~.icon-invalid{color:var(--ec-form-control-border-color-invalid)}:host textarea:required.is-empty{background-repeat:no-repeat;background-position:.5rem .5rem;background-size:1rem,1rem;padding-left:1.75rem;background-image:none}:host textarea:required.is-empty~.icon-required{display:inline-flex;position:absolute;left:.5rem;top:.5rem;z-index:1}:host textarea.ng-invalid.ng-touched{background-color:var(--ec-form-control-background-color-invalid);border-color:var(--ec-form-control-border-color-invalid)}:host textarea.ng-invalid.ng-touched:focus{border-color:var(--ec-form-control-background-color-invalid)}:host textarea.ng-invalid.ng-touched:hover:not(:disabled):not(:focus){border-color:var(--ec-form-control-border-color-hover)}:host textarea.ng-invalid.ng-touched{background-repeat:no-repeat;background-position:.5rem .5rem;background-size:1rem,1rem;padding-left:1.75rem;background-image:none}:host textarea.ng-invalid.ng-touched~.icon-invalid{display:inline-flex;position:absolute;left:.5rem;top:.5rem;z-index:1}:host textarea.ng-invalid.ng-touched~.icon-required{display:none}:host textarea.is-pending.ng-valid,:host textarea.is-pending.ng-invalid,:host textarea.is-pending.ng-pending{background-image:\"\";background-repeat:no-repeat;background-position:.5rem .5rem;background-size:1rem,1rem;padding-left:1.75rem}:host textarea.is-pending.ng-valid~.icon-loading,:host textarea.is-pending.ng-invalid~.icon-loading,:host textarea.is-pending.ng-pending~.icon-loading{display:inline-flex;position:absolute;left:.5rem;top:.5rem;z-index:1}:host textarea.is-pending.ng-valid~.icon-required,:host textarea.is-pending.ng-valid~.icon-invalid,:host textarea.is-pending.ng-invalid~.icon-required,:host textarea.is-pending.ng-invalid~.icon-invalid,:host textarea.is-pending.ng-pending~.icon-required,:host textarea.is-pending.ng-pending~.icon-invalid{display:none}:host textarea:focus,:host textarea:focus.is-empty{border-color:var(--ec-form-control-border-color-focus);box-shadow:var(--ec-form-control-box-shadow-focus);outline:2px solid transparent;outline-offset:2px;position:relative;z-index:1}:host textarea: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 textarea:disabled:required,:host textarea: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 textarea:disabled:required+.icon-required,:host textarea:disabled:required.is-empty+.icon-required{display:none}:host textarea:hover:not(:disabled):not(:focus){border-color:var(--ec-form-control-border-color-hover)}:host textarea.is-uppercase:not(.is-empty){text-transform:uppercase}:host textarea{resize:none;display:block}.input-wrapper{position:relative}.input-wrapper>.ec-icon{display:none}:host(.textbox-group-input:not(:last-child)){flex:1 1 0%;width:1px}:host(.textbox-group-input:not(:last-child)) .control{margin-bottom:0}:host(.textbox-group-input:not(:last-child)) .control.is-readonly input{border-right-width:1px}:host(.textbox-group-input:not(:last-child)) input{border-top-right-radius:0;border-bottom-right-radius:0;border-right-width:0}:host(.textbox-group-input:not(:last-child)) input:focus,:host(.textbox-group-input:not(:last-child)) input:hover:not(:disabled){position:relative;z-index:1;border-right-width:1px}:host(.text-truncate) input{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}:host(.is-monospace) input,:host(.is-monospace) textarea,:host-context(.is-monospace) input,:host-context(.is-monospace) textarea{font-family:var(--ec-font-family-monospace)}\n"]
|
|
4409
4414
|
}]
|
|
4410
4415
|
}],
|
|
4411
4416
|
ctorParameters: () => [
|
|
@@ -4558,6 +4563,7 @@ var ViewOverlayComponent = class ViewOverlayComponent {
|
|
|
4558
4563
|
"iconColor",
|
|
4559
4564
|
"label",
|
|
4560
4565
|
"ariaLabel",
|
|
4566
|
+
"ariaPressed",
|
|
4561
4567
|
"ariaExpanded",
|
|
4562
4568
|
"ariaHaspopup",
|
|
4563
4569
|
"ariaActivedescendant",
|
|
@@ -5032,6 +5038,7 @@ var ComboboxComponent = class ComboboxComponent extends FormControlBase {
|
|
|
5032
5038
|
"iconColor",
|
|
5033
5039
|
"label",
|
|
5034
5040
|
"ariaLabel",
|
|
5041
|
+
"ariaPressed",
|
|
5035
5042
|
"ariaExpanded",
|
|
5036
5043
|
"ariaHaspopup",
|
|
5037
5044
|
"ariaActivedescendant",
|
|
@@ -5285,7 +5292,7 @@ var FormControlComponent = class FormControlComponent {
|
|
|
5285
5292
|
usesOnChanges: true,
|
|
5286
5293
|
ngImport: i0,
|
|
5287
5294
|
template: "<ng-content></ng-content>\n<i id=\"{{id + '_icon'}}\" class=\"ec-form-control-icon ec-icon {{icon}}\"></i>\n<i id=\"{{id + '_loading'}}\" class=\"ec-form-control-icon ec-icon icon-loading\"></i>\n<i id=\"{{id + '_required'}}\" class=\"ec-form-control-icon ec-icon icon-required\"></i>\n<i id=\"{{id + '_invalid'}}\" class=\"ec-form-control-icon ec-icon icon-invalid\"></i>\n@if (showClear) {\n <button\n id=\"{{id + '_clear'}}\"\n [attr.disabled]=\"disabled || undefined\"\n class=\"ec-form-control-clear\"\n (click)=\"clear()\"\n tabindex=\"{{tabindex}}\">\n <i class=\"ec-icon icon-cancel\"></i>\n </button>\n}\n@if (actionIcon) {\n <button\n id=\"{{id + '_action'}}\"\n [attr.disabled]=\"disabled || undefined\"\n class=\"ec-form-control-action\"\n (click)=\"actionClicked.emit($event)\"\n tabindex=\"{{tabindex}}\">\n <i class=\"ec-icon {{actionIcon}}\"></i>\n </button>\n}\n<div class=\"ec-focus-ring\"></div>\n",
|
|
5288
|
-
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,ec-form-control>div[contenteditable=true]{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,ec-form-control>div[contenteditable=true]::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,ec-form-control>div[contenteditable=true]::-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,ec-form-control>div[contenteditable=true]::-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,ec-form-control>div[contenteditable=true]:-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,ec-form-control>div[contenteditable=true]:-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,ec-form-control>div[contenteditable=true]: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,ec-form-control>div[contenteditable=true]:focus~.ec-focus-ring{display:block}ec-form-control>input,ec-form-control>textarea,ec-form-control>select,ec-form-control>div[contenteditable=true],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{font-size:var(--ec-font-size-action);height:2rem;line-height:1.25rem;padding:.3125rem .5rem;border:0;border-radius:var(--ec-border-radius);display:flex;align-items:center;justify-content:center;cursor:pointer}ec-form-control .ec-form-control-clear .label,ec-form-control .ec-form-control-action .label{display:flex;align-items:center;justify-content:center;white-space:nowrap;flex:auto}ec-form-control .ec-form-control-clear .ec-icon,ec-form-control .ec-form-control-action .ec-icon{flex:none}ec-form-control .ec-form-control-clear .ec-icon+.label,ec-form-control .ec-form-control-action .ec-icon+.label{flex:none;margin-left:.25rem}ec-form-control .ec-form-control-clear.has-badge,ec-form-control .ec-form-control-action.has-badge{padding-right:.0625rem}ec-form-control .ec-form-control-clear:focus,ec-form-control .ec-form-control-action:focus{outline:2px solid transparent;outline-offset:2px;position:relative;z-index:1}ec-form-control .ec-form-control-clear:focus-visible,ec-form-control .ec-form-control-action:focus-visible{outline-color:var(--ec-border-color-focus)}ec-form-control .ec-form-control-clear:disabled,ec-form-control .ec-form-control-action:disabled{background-color:var(--ec-background-color-disabled);border:1px solid var(--ec-form-control-border-color-disabled);color:var(--ec-color-disabled-dark);opacity:var(--ec-form-control-opacity-disabled);cursor:default}ec-form-control .ec-form-control-clear:disabled .ec-icon,ec-form-control .ec-form-control-action:disabled .ec-icon{color:var(--ec-color-disabled-dark)}ec-form-control .ec-form-control-clear,ec-form-control .ec-form-control-action{flex:none;height:1.875rem;width:2rem;order:3;background-color:transparent;border:0;border-radius:0;display:inline-flex;align-items:center;justify-content:center;outline:none}ec-form-control .ec-form-control-clear:disabled,ec-form-control .ec-form-control-action:disabled{border:0;background-color:transparent;border-color:transparent}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:not(:disabled),ec-form-control .ec-form-control-action:hover:not(:disabled){cursor:pointer;background-color:var(--ec-background-color-hover)}ec-form-control .ec-form-control-clear:active:not(:disabled),ec-form-control .ec-form-control-action:active:not(:disabled){background-color:var(--ec-background-color-selected);font-weight:700}ec-form-control .ec-form-control-clear:focus:not(:disabled),ec-form-control .ec-form-control-action:focus:not(:disabled){box-shadow:var(--ec-button-box-shadow-active, 0 0 0 2px var(--ec-border-color-focus))}ec-form-control button:last-of-type{border-top-right-radius:calc(var(--ec-form-control-border-radius) - .0625rem);border-bottom-right-radius:calc(var(--ec-form-control-border-radius) - .0625rem)}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-color-interactive);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}ec-form-control:hover:not(.is-disabled):not(.is-readonly){border-color:var(--ec-form-control-border-color-hover)}\n"],
|
|
5295
|
+
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,ec-form-control>div[contenteditable=true]{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,ec-form-control>div[contenteditable=true]::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,ec-form-control>div[contenteditable=true]::-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,ec-form-control>div[contenteditable=true]::-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,ec-form-control>div[contenteditable=true]:-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,ec-form-control>div[contenteditable=true]:-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,ec-form-control>div[contenteditable=true]: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,ec-form-control>div[contenteditable=true]:focus~.ec-focus-ring{display:block}ec-form-control>input,ec-form-control>textarea,ec-form-control>select,ec-form-control>div[contenteditable=true],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{font-size:var(--ec-font-size-action);height:2rem;line-height:1.25rem;padding:.3125rem .5rem;border:0;border-radius:var(--ec-border-radius);color:inherit;display:flex;align-items:center;justify-content:center;cursor:pointer}ec-form-control .ec-form-control-clear .label,ec-form-control .ec-form-control-action .label{display:flex;align-items:center;justify-content:center;white-space:nowrap;flex:auto}ec-form-control .ec-form-control-clear .ec-icon,ec-form-control .ec-form-control-action .ec-icon{flex:none}ec-form-control .ec-form-control-clear .ec-icon+.label,ec-form-control .ec-form-control-action .ec-icon+.label{flex:none;margin-left:.25rem}ec-form-control .ec-form-control-clear.has-badge,ec-form-control .ec-form-control-action.has-badge{padding-right:.0625rem}ec-form-control .ec-form-control-clear:focus,ec-form-control .ec-form-control-action:focus{outline:2px solid transparent;outline-offset:2px;position:relative;z-index:1}ec-form-control .ec-form-control-clear:focus-visible,ec-form-control .ec-form-control-action:focus-visible{outline-color:var(--ec-border-color-focus)}ec-form-control .ec-form-control-clear:disabled,ec-form-control .ec-form-control-action:disabled{background-color:var(--ec-background-color-disabled);border:1px solid var(--ec-form-control-border-color-disabled);color:var(--ec-color-disabled-dark);opacity:var(--ec-form-control-opacity-disabled);cursor:default}ec-form-control .ec-form-control-clear:disabled .ec-icon,ec-form-control .ec-form-control-action:disabled .ec-icon{color:var(--ec-color-disabled-dark)}ec-form-control .ec-form-control-clear,ec-form-control .ec-form-control-action{flex:none;height:1.875rem;width:2rem;order:3;background-color:transparent;border:0;border-radius:0;display:inline-flex;align-items:center;justify-content:center;outline:none}ec-form-control .ec-form-control-clear:disabled,ec-form-control .ec-form-control-action:disabled{border:0;background-color:transparent;border-color:transparent}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:not(:disabled),ec-form-control .ec-form-control-action:hover:not(:disabled){cursor:pointer;background-color:var(--ec-background-color-hover)}ec-form-control .ec-form-control-clear:active:not(:disabled),ec-form-control .ec-form-control-action:active:not(:disabled){background-color:var(--ec-background-color-selected);font-weight:700}ec-form-control .ec-form-control-clear:focus:not(:disabled),ec-form-control .ec-form-control-action:focus:not(:disabled){box-shadow:var(--ec-button-box-shadow-active, 0 0 0 2px var(--ec-border-color-focus))}ec-form-control button:last-of-type{border-top-right-radius:calc(var(--ec-form-control-border-radius) - .0625rem);border-bottom-right-radius:calc(var(--ec-form-control-border-radius) - .0625rem)}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-color-interactive);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}ec-form-control:hover:not(.is-disabled):not(.is-readonly){border-color:var(--ec-form-control-border-color-hover)}\n"],
|
|
5289
5296
|
changeDetection: i0.ChangeDetectionStrategy.Eager,
|
|
5290
5297
|
encapsulation: i0.ViewEncapsulation.None
|
|
5291
5298
|
});
|
|
@@ -5304,7 +5311,7 @@ i0.ɵɵngDeclareClassMetadata({
|
|
|
5304
5311
|
changeDetection: ChangeDetectionStrategy.Eager,
|
|
5305
5312
|
standalone: false,
|
|
5306
5313
|
template: "<ng-content></ng-content>\n<i id=\"{{id + '_icon'}}\" class=\"ec-form-control-icon ec-icon {{icon}}\"></i>\n<i id=\"{{id + '_loading'}}\" class=\"ec-form-control-icon ec-icon icon-loading\"></i>\n<i id=\"{{id + '_required'}}\" class=\"ec-form-control-icon ec-icon icon-required\"></i>\n<i id=\"{{id + '_invalid'}}\" class=\"ec-form-control-icon ec-icon icon-invalid\"></i>\n@if (showClear) {\n <button\n id=\"{{id + '_clear'}}\"\n [attr.disabled]=\"disabled || undefined\"\n class=\"ec-form-control-clear\"\n (click)=\"clear()\"\n tabindex=\"{{tabindex}}\">\n <i class=\"ec-icon icon-cancel\"></i>\n </button>\n}\n@if (actionIcon) {\n <button\n id=\"{{id + '_action'}}\"\n [attr.disabled]=\"disabled || undefined\"\n class=\"ec-form-control-action\"\n (click)=\"actionClicked.emit($event)\"\n tabindex=\"{{tabindex}}\">\n <i class=\"ec-icon {{actionIcon}}\"></i>\n </button>\n}\n<div class=\"ec-focus-ring\"></div>\n",
|
|
5307
|
-
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,ec-form-control>div[contenteditable=true]{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,ec-form-control>div[contenteditable=true]::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,ec-form-control>div[contenteditable=true]::-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,ec-form-control>div[contenteditable=true]::-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,ec-form-control>div[contenteditable=true]:-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,ec-form-control>div[contenteditable=true]:-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,ec-form-control>div[contenteditable=true]: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,ec-form-control>div[contenteditable=true]:focus~.ec-focus-ring{display:block}ec-form-control>input,ec-form-control>textarea,ec-form-control>select,ec-form-control>div[contenteditable=true],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{font-size:var(--ec-font-size-action);height:2rem;line-height:1.25rem;padding:.3125rem .5rem;border:0;border-radius:var(--ec-border-radius);display:flex;align-items:center;justify-content:center;cursor:pointer}ec-form-control .ec-form-control-clear .label,ec-form-control .ec-form-control-action .label{display:flex;align-items:center;justify-content:center;white-space:nowrap;flex:auto}ec-form-control .ec-form-control-clear .ec-icon,ec-form-control .ec-form-control-action .ec-icon{flex:none}ec-form-control .ec-form-control-clear .ec-icon+.label,ec-form-control .ec-form-control-action .ec-icon+.label{flex:none;margin-left:.25rem}ec-form-control .ec-form-control-clear.has-badge,ec-form-control .ec-form-control-action.has-badge{padding-right:.0625rem}ec-form-control .ec-form-control-clear:focus,ec-form-control .ec-form-control-action:focus{outline:2px solid transparent;outline-offset:2px;position:relative;z-index:1}ec-form-control .ec-form-control-clear:focus-visible,ec-form-control .ec-form-control-action:focus-visible{outline-color:var(--ec-border-color-focus)}ec-form-control .ec-form-control-clear:disabled,ec-form-control .ec-form-control-action:disabled{background-color:var(--ec-background-color-disabled);border:1px solid var(--ec-form-control-border-color-disabled);color:var(--ec-color-disabled-dark);opacity:var(--ec-form-control-opacity-disabled);cursor:default}ec-form-control .ec-form-control-clear:disabled .ec-icon,ec-form-control .ec-form-control-action:disabled .ec-icon{color:var(--ec-color-disabled-dark)}ec-form-control .ec-form-control-clear,ec-form-control .ec-form-control-action{flex:none;height:1.875rem;width:2rem;order:3;background-color:transparent;border:0;border-radius:0;display:inline-flex;align-items:center;justify-content:center;outline:none}ec-form-control .ec-form-control-clear:disabled,ec-form-control .ec-form-control-action:disabled{border:0;background-color:transparent;border-color:transparent}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:not(:disabled),ec-form-control .ec-form-control-action:hover:not(:disabled){cursor:pointer;background-color:var(--ec-background-color-hover)}ec-form-control .ec-form-control-clear:active:not(:disabled),ec-form-control .ec-form-control-action:active:not(:disabled){background-color:var(--ec-background-color-selected);font-weight:700}ec-form-control .ec-form-control-clear:focus:not(:disabled),ec-form-control .ec-form-control-action:focus:not(:disabled){box-shadow:var(--ec-button-box-shadow-active, 0 0 0 2px var(--ec-border-color-focus))}ec-form-control button:last-of-type{border-top-right-radius:calc(var(--ec-form-control-border-radius) - .0625rem);border-bottom-right-radius:calc(var(--ec-form-control-border-radius) - .0625rem)}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-color-interactive);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}ec-form-control:hover:not(.is-disabled):not(.is-readonly){border-color:var(--ec-form-control-border-color-hover)}\n"]
|
|
5314
|
+
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,ec-form-control>div[contenteditable=true]{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,ec-form-control>div[contenteditable=true]::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,ec-form-control>div[contenteditable=true]::-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,ec-form-control>div[contenteditable=true]::-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,ec-form-control>div[contenteditable=true]:-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,ec-form-control>div[contenteditable=true]:-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,ec-form-control>div[contenteditable=true]: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,ec-form-control>div[contenteditable=true]:focus~.ec-focus-ring{display:block}ec-form-control>input,ec-form-control>textarea,ec-form-control>select,ec-form-control>div[contenteditable=true],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{font-size:var(--ec-font-size-action);height:2rem;line-height:1.25rem;padding:.3125rem .5rem;border:0;border-radius:var(--ec-border-radius);color:inherit;display:flex;align-items:center;justify-content:center;cursor:pointer}ec-form-control .ec-form-control-clear .label,ec-form-control .ec-form-control-action .label{display:flex;align-items:center;justify-content:center;white-space:nowrap;flex:auto}ec-form-control .ec-form-control-clear .ec-icon,ec-form-control .ec-form-control-action .ec-icon{flex:none}ec-form-control .ec-form-control-clear .ec-icon+.label,ec-form-control .ec-form-control-action .ec-icon+.label{flex:none;margin-left:.25rem}ec-form-control .ec-form-control-clear.has-badge,ec-form-control .ec-form-control-action.has-badge{padding-right:.0625rem}ec-form-control .ec-form-control-clear:focus,ec-form-control .ec-form-control-action:focus{outline:2px solid transparent;outline-offset:2px;position:relative;z-index:1}ec-form-control .ec-form-control-clear:focus-visible,ec-form-control .ec-form-control-action:focus-visible{outline-color:var(--ec-border-color-focus)}ec-form-control .ec-form-control-clear:disabled,ec-form-control .ec-form-control-action:disabled{background-color:var(--ec-background-color-disabled);border:1px solid var(--ec-form-control-border-color-disabled);color:var(--ec-color-disabled-dark);opacity:var(--ec-form-control-opacity-disabled);cursor:default}ec-form-control .ec-form-control-clear:disabled .ec-icon,ec-form-control .ec-form-control-action:disabled .ec-icon{color:var(--ec-color-disabled-dark)}ec-form-control .ec-form-control-clear,ec-form-control .ec-form-control-action{flex:none;height:1.875rem;width:2rem;order:3;background-color:transparent;border:0;border-radius:0;display:inline-flex;align-items:center;justify-content:center;outline:none}ec-form-control .ec-form-control-clear:disabled,ec-form-control .ec-form-control-action:disabled{border:0;background-color:transparent;border-color:transparent}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:not(:disabled),ec-form-control .ec-form-control-action:hover:not(:disabled){cursor:pointer;background-color:var(--ec-background-color-hover)}ec-form-control .ec-form-control-clear:active:not(:disabled),ec-form-control .ec-form-control-action:active:not(:disabled){background-color:var(--ec-background-color-selected);font-weight:700}ec-form-control .ec-form-control-clear:focus:not(:disabled),ec-form-control .ec-form-control-action:focus:not(:disabled){box-shadow:var(--ec-button-box-shadow-active, 0 0 0 2px var(--ec-border-color-focus))}ec-form-control button:last-of-type{border-top-right-radius:calc(var(--ec-form-control-border-radius) - .0625rem);border-bottom-right-radius:calc(var(--ec-form-control-border-radius) - .0625rem)}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-color-interactive);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}ec-form-control:hover:not(.is-disabled):not(.is-readonly){border-color:var(--ec-form-control-border-color-hover)}\n"]
|
|
5308
5315
|
}]
|
|
5309
5316
|
}],
|
|
5310
5317
|
ctorParameters: () => [{ type: i0.ElementRef }],
|
|
@@ -5823,7 +5830,7 @@ var DateInputComponent = class DateInputComponent extends FormControlBase {
|
|
|
5823
5830
|
usesOnChanges: true,
|
|
5824
5831
|
ngImport: i0,
|
|
5825
5832
|
template: "@if (label) {\n <label>\n <span>{{label | translate}}</span>\n @if (validationErrors.length > 0 && formModel.touched && formModel.invalid) {\n <span> {{validationErrors}}</span>\n }\n @if (helpPopover) {\n <ec-help-popover id=\"{{id}}_helpPopover\"\n class=\"d-inline-block my-n3 mx-n1\"\n text=\"{{helpPopover | translate}}\"\n contentPosition=\"{{helpPopoverPosition}}\">\n </ec-help-popover>\n }\n </label>\n}\n\n<div class=\"d-flex align-items-center\"\n [ecKeyboardNavContainer]=\"isCalendarOpen\"\n [tabindex]=\"tabindex\"\n #controls=\"ecKeyboardNavContainer\"\n (focusOutEnd)=\"onControlsFocusOutEnd()\">\n <ec-form-control id=\"{{id}}\"\n [required]=\"required\"\n [autofocus]=\"autofocus\"\n [pending]=\"pending\"\n [readonly]=\"readonly\"\n (actionClicked)=\"isCalendarOpen = !isCalendarOpen\"\n [showClear]=\"false\"\n [tabindex]=\"tabindex\"\n actionIcon=\"icon-date\"\n cdkOverlayOrigin\n #overlayOrigin=\"cdkOverlayOrigin\"\n class=\"flex-grow\"\n style=\"height: 2rem;\">\n <input id=\"{{id}}_input\"\n type=\"text\"\n placeholder=\"{{placeholder}}\"\n tabindex=\"{{tabindex}}\"\n [formControl]=\"textboxGroup.get('textbox')\"\n (blur)=\"onTextboxBlur()\">\n </ec-form-control>\n\n @if (selectionStrategy.showSecondaryTextbox) {\n <span class=\"flex-shrink mx-1\">–</span>\n <ec-form-control id=\"{{id}}_control2\"\n [required]=\"required\"\n [autofocus]=\"autofocus\"\n [pending]=\"pending\"\n [readonly]=\"readonly\"\n (actionClicked)=\"isCalendarOpen = !isCalendarOpen\"\n [showClear]=\"false\"\n [tabindex]=\"tabindex\"\n actionIcon=\"icon-date\"\n class=\"flex-grow\"\n style=\"height: 2rem;\">\n <input id=\"{{id}}_input2\"\n type=\"text\"\n placeholder=\"{{placeholder}}\"\n tabindex=\"{{tabindex}}\"\n [formControl]=\"textboxGroup.get('textbox2')\"\n (blur)=\"onTextbox2Blur()\">\n </ec-form-control>\n }\n\n @if (enableSteppers) {\n <div\n class=\"control-group ml-2\">\n <ec-button id=\"{{id}}_previousSelection\"\n type=\"secondary\"\n icon=\"icon-angle-down rotate-90\"\n (clicked)=\"previousSelection()\"\n [disabled]=\"isCalendarOpen || disableSteppers || formModel?.disabled\"\n [tabindex]=\"tabindex\">\n </ec-button>\n <ec-button id=\"{{id}}_nextSelection\"\n type=\"secondary\"\n icon=\"icon-angle-down rotate-270\"\n (clicked)=\"nextSelection()\"\n [disabled]=\"isCalendarOpen || disableSteppers || formModel?.disabled\"\n [tabindex]=\"tabindex\">\n </ec-button>\n </div>\n }\n\n @if (quickSelectDate) {\n <ec-button\n id=\"{{id}}_quickSelect\"\n icon=\"icon-day\"\n type=\"secondary\"\n title=\"{{'DateInput_LatestDataAvailableTitle' | translate}}\"\n (clicked)=\"goToQuickSelectDate()\"\n [tabindex]=\"tabindex\"\n class=\"ml-2\">\n </ec-button>\n }\n </div>\n\n <ng-template cdkConnectedOverlay\n #overlay=\"cdkConnectedOverlay\"\n [cdkConnectedOverlayOrigin]=\"overlayOrigin\"\n [cdkConnectedOverlayOpen]=\"isCalendarOpen\"\n [cdkConnectedOverlayScrollStrategy]=\"overlayScrollStrategy\"\n cdkConnectedOverlayPanelClass=\"my-1\"\n (overlayOutsideClick)=\"onOverlayOutsideClick($event)\"\n (detach)=\"isCalendarOpen = false\">\n <article id=\"{{id}}_datePicker\"\n class=\"card d-flex\"\n [ecKeyboardNavContainer]=\"isCalendarOpen\"\n [tabindex]=\"tabindex\"\n #calendar=\"ecKeyboardNavContainer\"\n (focusOutStart)=\"onCalendarFocusOutStart()\"\n (focusOutEnd)=\"onCalendarFocusOutEnd()\">\n @if (selectionModeOptions.length > 1) {\n <ul\n class=\"selection-mode-menu border-right p-1\">\n @for (option of selectionModeOptions; track option) {\n <li>\n <button id=\"{{id}}_selectionMode_{{option}}\"\n class=\"text-body-1\"\n [class.is-selected]=\"option === selectionMode\"\n (click)=\"onSelectionModeChange(option)\"\n tabindex=\"{{tabindex}}\">\n {{'DateInputSelectionMode_' + option | translate}}\n </button>\n </li>\n }\n </ul>\n }\n\n <div>\n <div class=\"d-flex\">\n <ec-calendar id=\"{{id}}_calendar\"\n [view]=\"primaryCalendarView\"\n (viewChange)=\"onPrimaryCalendarViewChange($event)\"\n [selectionMode]=\"selectionMode\"\n [selection]=\"calendarSelection\"\n (dateSelected)=\"onCalendarDateSelected($event)\"\n [minDate]=\"minDate\"\n [maxDate]=\"selectionStrategy.showSecondaryCalendar ? primaryCalendarMaxDate : maxDate\"\n [tabindex]=\"tabindex\">\n </ec-calendar>\n\n @if (selectionStrategy.showSecondaryCalendar) {\n <ec-calendar\n id=\"{{id}}_secondaryCalendar\"\n [view]=\"secondaryCalendarView\"\n (viewChange)=\"onSecondaryCalendarViewChange($event)\"\n [selectionMode]=\"selectionMode\"\n [selection]=\"calendarSelection\"\n (dateSelected)=\"onCalendarDateSelected($event)\"\n [minDate]=\"secondaryCalendarMinDate\"\n [maxDate]=\"maxDate\"\n [tabindex]=\"tabindex\">\n </ec-calendar>\n }\n </div>\n\n @if (selectionStrategy.selectionViewMode === 'day') {\n <footer\n class=\"px-2 my-2 d-flex\">\n <ec-button id=\"{{id}}_today_button\"\n label=\"{{'DateInput_CalendarTodayButton_Label' | translate}}\"\n class=\"ml-auto\"\n (clicked)=\"goToToday()\"\n tabindex=\"{{tabindex}}\"\n type=\"text\">\n </ec-button>\n @if (selectionStrategy.showSecondaryTextbox) {\n <ec-button\n id=\"{{id}}_close_button\"\n label=\"{{'DateInput_CalendarCloseButton_Label' | translate}}\"\n class=\"ml-2\"\n (clicked)=\"closeCalendarAndFocusInput()\"\n tabindex=\"{{tabindex}}\"\n type=\"primary\">\n </ec-button>\n }\n </footer>\n }\n </div>\n </article>\n </ng-template>\n",
|
|
5826
|
-
styles: [":host{display:block}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}.date-picker{display:grid;grid-template-areas:\"menu calendar calendar\" \"menu footer footer\"}.date-picker footer{grid-area:footer}ul.selection-mode-menu{grid-area:menu;list-style:none;padding:0;margin:0;min-width:7rem}ul.selection-mode-menu li{margin-bottom:.25rem}ul.selection-mode-menu li button{font-size:var(--ec-font-size-action);height:2rem;line-height:1.25rem;padding:.3125rem .5rem;border:0;border-radius:var(--ec-border-radius);display:flex;align-items:center;justify-content:center;cursor:pointer}ul.selection-mode-menu li button .label{display:flex;align-items:center;justify-content:center;white-space:nowrap;flex:auto}ul.selection-mode-menu li button .ec-icon{flex:none}ul.selection-mode-menu li button .ec-icon+.label{flex:none;margin-left:.25rem}ul.selection-mode-menu li button.has-badge{padding-right:.0625rem}ul.selection-mode-menu li button:focus{outline:2px solid transparent;outline-offset:2px;position:relative;z-index:1}ul.selection-mode-menu li button:focus-visible{outline-color:var(--ec-border-color-focus)}ul.selection-mode-menu li button:disabled{background-color:var(--ec-background-color-disabled);border:1px solid var(--ec-form-control-border-color-disabled);color:var(--ec-color-disabled-dark);opacity:var(--ec-form-control-opacity-disabled);cursor:default}ul.selection-mode-menu li button:disabled .ec-icon{color:var(--ec-color-disabled-dark)}ul.selection-mode-menu li button{background-color:transparent}ul.selection-mode-menu li button:disabled{background-color:transparent;border-color:transparent;color:var(--ec-color-hint-dark);--ec-color-icon: var(--ec-color-hint-dark)}ul.selection-mode-menu li button:hover:not(:disabled){background-color:var(--ec-background-color-hover)}ul.selection-mode-menu li button:active:not(:disabled){background-color:var(--ec-background-color-selected);font-weight:700}ul.selection-mode-menu li button:focus:not(:disabled){box-shadow:var(--ec-button-box-shadow-active, 0 0 0 2px var(--ec-border-color-focus))}ul.selection-mode-menu li button.is-selected{background-color:var(--ec-background-color-selected);font-weight:700}ul.selection-mode-menu li button{width:100%;height:1.75rem}ec-button{--ec-button-border-color-secondary: var(--ec-border-color-control)}.control-group ec-button:has(+ec-button) ::ng-deep button{border-right:0}.control-group ec-button+ec-button ::ng-deep button{border-left:0}\n"],
|
|
5833
|
+
styles: [":host{display:block}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}.date-picker{display:grid;grid-template-areas:\"menu calendar calendar\" \"menu footer footer\"}.date-picker footer{grid-area:footer}ul.selection-mode-menu{grid-area:menu;list-style:none;padding:0;margin:0;min-width:7rem}ul.selection-mode-menu li{margin-bottom:.25rem}ul.selection-mode-menu li button{font-size:var(--ec-font-size-action);height:2rem;line-height:1.25rem;padding:.3125rem .5rem;border:0;border-radius:var(--ec-border-radius);color:inherit;display:flex;align-items:center;justify-content:center;cursor:pointer}ul.selection-mode-menu li button .label{display:flex;align-items:center;justify-content:center;white-space:nowrap;flex:auto}ul.selection-mode-menu li button .ec-icon{flex:none}ul.selection-mode-menu li button .ec-icon+.label{flex:none;margin-left:.25rem}ul.selection-mode-menu li button.has-badge{padding-right:.0625rem}ul.selection-mode-menu li button:focus{outline:2px solid transparent;outline-offset:2px;position:relative;z-index:1}ul.selection-mode-menu li button:focus-visible{outline-color:var(--ec-border-color-focus)}ul.selection-mode-menu li button:disabled{background-color:var(--ec-background-color-disabled);border:1px solid var(--ec-form-control-border-color-disabled);color:var(--ec-color-disabled-dark);opacity:var(--ec-form-control-opacity-disabled);cursor:default}ul.selection-mode-menu li button:disabled .ec-icon{color:var(--ec-color-disabled-dark)}ul.selection-mode-menu li button{background-color:transparent}ul.selection-mode-menu li button:disabled{background-color:transparent;border-color:transparent;color:var(--ec-color-hint-dark);--ec-color-icon: var(--ec-color-hint-dark)}ul.selection-mode-menu li button:hover:not(:disabled){background-color:var(--ec-background-color-hover)}ul.selection-mode-menu li button:active:not(:disabled){background-color:var(--ec-background-color-selected);font-weight:700}ul.selection-mode-menu li button:focus:not(:disabled){box-shadow:var(--ec-button-box-shadow-active, 0 0 0 2px var(--ec-border-color-focus))}ul.selection-mode-menu li button.is-selected{background-color:var(--ec-background-color-selected);font-weight:700}ul.selection-mode-menu li button{width:100%;height:1.75rem}ec-button{--ec-button-border-color-secondary: var(--ec-border-color-control)}.control-group ec-button:has(+ec-button) ::ng-deep button{border-right:0}.control-group ec-button+ec-button ::ng-deep button{border-left:0}\n"],
|
|
5827
5834
|
dependencies: [
|
|
5828
5835
|
{
|
|
5829
5836
|
kind: "directive",
|
|
@@ -5906,6 +5913,7 @@ var DateInputComponent = class DateInputComponent extends FormControlBase {
|
|
|
5906
5913
|
"iconColor",
|
|
5907
5914
|
"label",
|
|
5908
5915
|
"ariaLabel",
|
|
5916
|
+
"ariaPressed",
|
|
5909
5917
|
"ariaExpanded",
|
|
5910
5918
|
"ariaHaspopup",
|
|
5911
5919
|
"ariaActivedescendant",
|
|
@@ -5996,7 +6004,7 @@ i0.ɵɵngDeclareClassMetadata({
|
|
|
5996
6004
|
changeDetection: ChangeDetectionStrategy.Eager,
|
|
5997
6005
|
standalone: false,
|
|
5998
6006
|
template: "@if (label) {\n <label>\n <span>{{label | translate}}</span>\n @if (validationErrors.length > 0 && formModel.touched && formModel.invalid) {\n <span> {{validationErrors}}</span>\n }\n @if (helpPopover) {\n <ec-help-popover id=\"{{id}}_helpPopover\"\n class=\"d-inline-block my-n3 mx-n1\"\n text=\"{{helpPopover | translate}}\"\n contentPosition=\"{{helpPopoverPosition}}\">\n </ec-help-popover>\n }\n </label>\n}\n\n<div class=\"d-flex align-items-center\"\n [ecKeyboardNavContainer]=\"isCalendarOpen\"\n [tabindex]=\"tabindex\"\n #controls=\"ecKeyboardNavContainer\"\n (focusOutEnd)=\"onControlsFocusOutEnd()\">\n <ec-form-control id=\"{{id}}\"\n [required]=\"required\"\n [autofocus]=\"autofocus\"\n [pending]=\"pending\"\n [readonly]=\"readonly\"\n (actionClicked)=\"isCalendarOpen = !isCalendarOpen\"\n [showClear]=\"false\"\n [tabindex]=\"tabindex\"\n actionIcon=\"icon-date\"\n cdkOverlayOrigin\n #overlayOrigin=\"cdkOverlayOrigin\"\n class=\"flex-grow\"\n style=\"height: 2rem;\">\n <input id=\"{{id}}_input\"\n type=\"text\"\n placeholder=\"{{placeholder}}\"\n tabindex=\"{{tabindex}}\"\n [formControl]=\"textboxGroup.get('textbox')\"\n (blur)=\"onTextboxBlur()\">\n </ec-form-control>\n\n @if (selectionStrategy.showSecondaryTextbox) {\n <span class=\"flex-shrink mx-1\">–</span>\n <ec-form-control id=\"{{id}}_control2\"\n [required]=\"required\"\n [autofocus]=\"autofocus\"\n [pending]=\"pending\"\n [readonly]=\"readonly\"\n (actionClicked)=\"isCalendarOpen = !isCalendarOpen\"\n [showClear]=\"false\"\n [tabindex]=\"tabindex\"\n actionIcon=\"icon-date\"\n class=\"flex-grow\"\n style=\"height: 2rem;\">\n <input id=\"{{id}}_input2\"\n type=\"text\"\n placeholder=\"{{placeholder}}\"\n tabindex=\"{{tabindex}}\"\n [formControl]=\"textboxGroup.get('textbox2')\"\n (blur)=\"onTextbox2Blur()\">\n </ec-form-control>\n }\n\n @if (enableSteppers) {\n <div\n class=\"control-group ml-2\">\n <ec-button id=\"{{id}}_previousSelection\"\n type=\"secondary\"\n icon=\"icon-angle-down rotate-90\"\n (clicked)=\"previousSelection()\"\n [disabled]=\"isCalendarOpen || disableSteppers || formModel?.disabled\"\n [tabindex]=\"tabindex\">\n </ec-button>\n <ec-button id=\"{{id}}_nextSelection\"\n type=\"secondary\"\n icon=\"icon-angle-down rotate-270\"\n (clicked)=\"nextSelection()\"\n [disabled]=\"isCalendarOpen || disableSteppers || formModel?.disabled\"\n [tabindex]=\"tabindex\">\n </ec-button>\n </div>\n }\n\n @if (quickSelectDate) {\n <ec-button\n id=\"{{id}}_quickSelect\"\n icon=\"icon-day\"\n type=\"secondary\"\n title=\"{{'DateInput_LatestDataAvailableTitle' | translate}}\"\n (clicked)=\"goToQuickSelectDate()\"\n [tabindex]=\"tabindex\"\n class=\"ml-2\">\n </ec-button>\n }\n </div>\n\n <ng-template cdkConnectedOverlay\n #overlay=\"cdkConnectedOverlay\"\n [cdkConnectedOverlayOrigin]=\"overlayOrigin\"\n [cdkConnectedOverlayOpen]=\"isCalendarOpen\"\n [cdkConnectedOverlayScrollStrategy]=\"overlayScrollStrategy\"\n cdkConnectedOverlayPanelClass=\"my-1\"\n (overlayOutsideClick)=\"onOverlayOutsideClick($event)\"\n (detach)=\"isCalendarOpen = false\">\n <article id=\"{{id}}_datePicker\"\n class=\"card d-flex\"\n [ecKeyboardNavContainer]=\"isCalendarOpen\"\n [tabindex]=\"tabindex\"\n #calendar=\"ecKeyboardNavContainer\"\n (focusOutStart)=\"onCalendarFocusOutStart()\"\n (focusOutEnd)=\"onCalendarFocusOutEnd()\">\n @if (selectionModeOptions.length > 1) {\n <ul\n class=\"selection-mode-menu border-right p-1\">\n @for (option of selectionModeOptions; track option) {\n <li>\n <button id=\"{{id}}_selectionMode_{{option}}\"\n class=\"text-body-1\"\n [class.is-selected]=\"option === selectionMode\"\n (click)=\"onSelectionModeChange(option)\"\n tabindex=\"{{tabindex}}\">\n {{'DateInputSelectionMode_' + option | translate}}\n </button>\n </li>\n }\n </ul>\n }\n\n <div>\n <div class=\"d-flex\">\n <ec-calendar id=\"{{id}}_calendar\"\n [view]=\"primaryCalendarView\"\n (viewChange)=\"onPrimaryCalendarViewChange($event)\"\n [selectionMode]=\"selectionMode\"\n [selection]=\"calendarSelection\"\n (dateSelected)=\"onCalendarDateSelected($event)\"\n [minDate]=\"minDate\"\n [maxDate]=\"selectionStrategy.showSecondaryCalendar ? primaryCalendarMaxDate : maxDate\"\n [tabindex]=\"tabindex\">\n </ec-calendar>\n\n @if (selectionStrategy.showSecondaryCalendar) {\n <ec-calendar\n id=\"{{id}}_secondaryCalendar\"\n [view]=\"secondaryCalendarView\"\n (viewChange)=\"onSecondaryCalendarViewChange($event)\"\n [selectionMode]=\"selectionMode\"\n [selection]=\"calendarSelection\"\n (dateSelected)=\"onCalendarDateSelected($event)\"\n [minDate]=\"secondaryCalendarMinDate\"\n [maxDate]=\"maxDate\"\n [tabindex]=\"tabindex\">\n </ec-calendar>\n }\n </div>\n\n @if (selectionStrategy.selectionViewMode === 'day') {\n <footer\n class=\"px-2 my-2 d-flex\">\n <ec-button id=\"{{id}}_today_button\"\n label=\"{{'DateInput_CalendarTodayButton_Label' | translate}}\"\n class=\"ml-auto\"\n (clicked)=\"goToToday()\"\n tabindex=\"{{tabindex}}\"\n type=\"text\">\n </ec-button>\n @if (selectionStrategy.showSecondaryTextbox) {\n <ec-button\n id=\"{{id}}_close_button\"\n label=\"{{'DateInput_CalendarCloseButton_Label' | translate}}\"\n class=\"ml-2\"\n (clicked)=\"closeCalendarAndFocusInput()\"\n tabindex=\"{{tabindex}}\"\n type=\"primary\">\n </ec-button>\n }\n </footer>\n }\n </div>\n </article>\n </ng-template>\n",
|
|
5999
|
-
styles: [":host{display:block}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}.date-picker{display:grid;grid-template-areas:\"menu calendar calendar\" \"menu footer footer\"}.date-picker footer{grid-area:footer}ul.selection-mode-menu{grid-area:menu;list-style:none;padding:0;margin:0;min-width:7rem}ul.selection-mode-menu li{margin-bottom:.25rem}ul.selection-mode-menu li button{font-size:var(--ec-font-size-action);height:2rem;line-height:1.25rem;padding:.3125rem .5rem;border:0;border-radius:var(--ec-border-radius);display:flex;align-items:center;justify-content:center;cursor:pointer}ul.selection-mode-menu li button .label{display:flex;align-items:center;justify-content:center;white-space:nowrap;flex:auto}ul.selection-mode-menu li button .ec-icon{flex:none}ul.selection-mode-menu li button .ec-icon+.label{flex:none;margin-left:.25rem}ul.selection-mode-menu li button.has-badge{padding-right:.0625rem}ul.selection-mode-menu li button:focus{outline:2px solid transparent;outline-offset:2px;position:relative;z-index:1}ul.selection-mode-menu li button:focus-visible{outline-color:var(--ec-border-color-focus)}ul.selection-mode-menu li button:disabled{background-color:var(--ec-background-color-disabled);border:1px solid var(--ec-form-control-border-color-disabled);color:var(--ec-color-disabled-dark);opacity:var(--ec-form-control-opacity-disabled);cursor:default}ul.selection-mode-menu li button:disabled .ec-icon{color:var(--ec-color-disabled-dark)}ul.selection-mode-menu li button{background-color:transparent}ul.selection-mode-menu li button:disabled{background-color:transparent;border-color:transparent;color:var(--ec-color-hint-dark);--ec-color-icon: var(--ec-color-hint-dark)}ul.selection-mode-menu li button:hover:not(:disabled){background-color:var(--ec-background-color-hover)}ul.selection-mode-menu li button:active:not(:disabled){background-color:var(--ec-background-color-selected);font-weight:700}ul.selection-mode-menu li button:focus:not(:disabled){box-shadow:var(--ec-button-box-shadow-active, 0 0 0 2px var(--ec-border-color-focus))}ul.selection-mode-menu li button.is-selected{background-color:var(--ec-background-color-selected);font-weight:700}ul.selection-mode-menu li button{width:100%;height:1.75rem}ec-button{--ec-button-border-color-secondary: var(--ec-border-color-control)}.control-group ec-button:has(+ec-button) ::ng-deep button{border-right:0}.control-group ec-button+ec-button ::ng-deep button{border-left:0}\n"]
|
|
6007
|
+
styles: [":host{display:block}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}.date-picker{display:grid;grid-template-areas:\"menu calendar calendar\" \"menu footer footer\"}.date-picker footer{grid-area:footer}ul.selection-mode-menu{grid-area:menu;list-style:none;padding:0;margin:0;min-width:7rem}ul.selection-mode-menu li{margin-bottom:.25rem}ul.selection-mode-menu li button{font-size:var(--ec-font-size-action);height:2rem;line-height:1.25rem;padding:.3125rem .5rem;border:0;border-radius:var(--ec-border-radius);color:inherit;display:flex;align-items:center;justify-content:center;cursor:pointer}ul.selection-mode-menu li button .label{display:flex;align-items:center;justify-content:center;white-space:nowrap;flex:auto}ul.selection-mode-menu li button .ec-icon{flex:none}ul.selection-mode-menu li button .ec-icon+.label{flex:none;margin-left:.25rem}ul.selection-mode-menu li button.has-badge{padding-right:.0625rem}ul.selection-mode-menu li button:focus{outline:2px solid transparent;outline-offset:2px;position:relative;z-index:1}ul.selection-mode-menu li button:focus-visible{outline-color:var(--ec-border-color-focus)}ul.selection-mode-menu li button:disabled{background-color:var(--ec-background-color-disabled);border:1px solid var(--ec-form-control-border-color-disabled);color:var(--ec-color-disabled-dark);opacity:var(--ec-form-control-opacity-disabled);cursor:default}ul.selection-mode-menu li button:disabled .ec-icon{color:var(--ec-color-disabled-dark)}ul.selection-mode-menu li button{background-color:transparent}ul.selection-mode-menu li button:disabled{background-color:transparent;border-color:transparent;color:var(--ec-color-hint-dark);--ec-color-icon: var(--ec-color-hint-dark)}ul.selection-mode-menu li button:hover:not(:disabled){background-color:var(--ec-background-color-hover)}ul.selection-mode-menu li button:active:not(:disabled){background-color:var(--ec-background-color-selected);font-weight:700}ul.selection-mode-menu li button:focus:not(:disabled){box-shadow:var(--ec-button-box-shadow-active, 0 0 0 2px var(--ec-border-color-focus))}ul.selection-mode-menu li button.is-selected{background-color:var(--ec-background-color-selected);font-weight:700}ul.selection-mode-menu li button{width:100%;height:1.75rem}ec-button{--ec-button-border-color-secondary: var(--ec-border-color-control)}.control-group ec-button:has(+ec-button) ::ng-deep button{border-right:0}.control-group ec-button+ec-button ::ng-deep button{border-left:0}\n"]
|
|
6000
6008
|
}]
|
|
6001
6009
|
}],
|
|
6002
6010
|
ctorParameters: () => [
|
|
@@ -6201,6 +6209,7 @@ var DropdownComponent = class DropdownComponent {
|
|
|
6201
6209
|
"iconColor",
|
|
6202
6210
|
"label",
|
|
6203
6211
|
"ariaLabel",
|
|
6212
|
+
"ariaPressed",
|
|
6204
6213
|
"ariaExpanded",
|
|
6205
6214
|
"ariaHaspopup",
|
|
6206
6215
|
"ariaActivedescendant",
|
|
@@ -6725,6 +6734,7 @@ var FileUploadComponent = class FileUploadComponent extends FormControlBase {
|
|
|
6725
6734
|
"iconColor",
|
|
6726
6735
|
"label",
|
|
6727
6736
|
"ariaLabel",
|
|
6737
|
+
"ariaPressed",
|
|
6728
6738
|
"ariaExpanded",
|
|
6729
6739
|
"ariaHaspopup",
|
|
6730
6740
|
"ariaActivedescendant",
|
|
@@ -9137,6 +9147,7 @@ var ItemPickerComponent = class ItemPickerComponent {
|
|
|
9137
9147
|
"iconColor",
|
|
9138
9148
|
"label",
|
|
9139
9149
|
"ariaLabel",
|
|
9150
|
+
"ariaPressed",
|
|
9140
9151
|
"ariaExpanded",
|
|
9141
9152
|
"ariaHaspopup",
|
|
9142
9153
|
"ariaActivedescendant",
|
|
@@ -9847,7 +9858,7 @@ var MultiselectComponent = class MultiselectComponent extends FormControlBase {
|
|
|
9847
9858
|
usesOnChanges: true,
|
|
9848
9859
|
ngImport: i0,
|
|
9849
9860
|
template: "<div class=\"control control-label-{{labelPosition}}\"\n [ngClass]=\"{'invalid': formModel.touched && formModel.invalid,\n 'is-readonly': readonly,\n 'is-disabled': formModel.disabled,\n 'open': menuStatus === 'visible'}\">\n\n @if (label) {\n <label [attr.id]=\"id + '_label'\" [attr.for]=\"id + '_filter'\">\n <span>{{label | translate}}</span>\n @if (validationErrors.length > 0 && formModel.touched && formModel.invalid) {\n <span> {{validationErrors}}</span>\n }\n @if (helpPopover) {\n <ec-help-popover id=\"{{id}}_helpPopover\"\n class=\"d-inline-block my-n3 mx-n1\"\n text=\"{{helpPopover | translate}}\"\n contentPosition=\"{{helpPopoverPosition}}\">\n </ec-help-popover>\n }\n </label>\n }\n\n <div class=\"textbox-group control-input\"\n *ecPopup=\"dropdownmenu\">\n <div class=\"multiselect-input\"\n [attr.id]=\"id + '_input_container'\"\n role=\"combobox\"\n [attr.aria-expanded]=\"menuStatus === 'visible'\"\n aria-haspopup=\"listbox\"\n [attr.aria-owns]=\"id + '_menu_list'\"\n [class.is-focused]=\"menuStatus === 'visible'\"\n [class.is-disabled]=\"formModel.disabled\"\n [class.is-empty]=\"selectedItems.length === 0\"\n [class.is-required]=\"required\"\n [class.has-selections]=\"selectedItems.length > 0\"\n (click)=\"toggleMenu($event)\">\n\n <!-- Selected tags -->\n @if (selectedTags.length > 0) {\n <ec-tags\n id=\"{{id}}_tags\"\n [tags]=\"selectedTags\"\n [wrap]=\"true\"\n [isCondensed]=\"false\"\n [isSubtle]=\"true\"\n (tagClosed)=\"removeTag($event)\"\n (click)=\"$event.stopPropagation()\">\n </ec-tags>\n }\n\n <!-- Filter input -->\n <input\n #filterInput\n class=\"multiselect-filter-input\"\n type=\"text\"\n [id]=\"id + '_filter'\"\n [formControl]=\"filterFormModel\"\n [placeholder]=\"effectivePlaceholder\"\n [tabindex]=\"tabindex\"\n (input)=\"onFilterInput()\"\n (keydown)=\"keyNavigate($event)\"\n (focusout)=\"onBlur()\"\n (click)=\"menuStatus === 'visible' ? $event.stopPropagation() : null\"\n autocomplete=\"off\"\n [attr.cdkFocusInitial]=\"autofocus || null\"\n aria-autocomplete=\"list\"\n [attr.aria-controls]=\"menuStatus === 'visible' ? id + '_menu_list' : null\"\n [attr.aria-activedescendant]=\"activeDescendantId\"\n [attr.aria-labelledby]=\"label ? id + '_label' : null\"\n [attr.aria-label]=\"!label ? effectivePlaceholder : null\"\n [attr.aria-describedby]=\"selectedItems.length > 0 ? id + '_selection_status' : null\" />\n\n <i class=\"ec-icon icon-required\"></i>\n <i class=\"ec-icon icon-invalid\"></i>\n </div>\n\n <!-- Live region for selection announcements -->\n <span [id]=\"id + '_selection_status'\"\n class=\"sr-only\"\n aria-live=\"polite\"\n aria-atomic=\"true\">\n {{ 'Multiselect_LiveRegion_Status_SC' | translate:{ count: selectedItems.length } }}\n </span>\n\n <!-- Clear button -->\n @if (selectedItems.length > 0 && !formModel.disabled && !readonly) {\n <ec-button class=\"multiselect-clear-btn\"\n [id]=\"id + '_clear'\"\n icon=\"icon-cancel\"\n type=\"secondary\"\n [tabindex]=\"0\"\n attr.aria-label=\"{{'ClearAllSelections_SC' | translate}}\"\n (click)=\"clearAll(); $event.stopPropagation()\">\n </ec-button>\n }\n\n <!-- Toggle button -->\n <ec-button class=\"textbox-group-btn-right\"\n [id]=\"id + '_button'\"\n [disabled]=\"formModel.disabled\"\n icon=\"icon-caret-down\"\n [tabindex]=\"-1\"\n type=\"secondary\"\n [attr.aria-label]=\"'Toggle dropdown'\"\n [attr.aria-expanded]=\"menuStatus === 'visible'\"\n (click)=\"toggleMenu($event)\"\n [class.active]=\"menuStatus === 'visible'\">\n </ec-button>\n </div>\n</div>\n\n<ng-template #dropdownmenu>\n <div class=\"popup\"\n ecOverlay\n role=\"listbox\"\n [attr.id]=\"id + '_listbox'\"\n [attr.aria-label]=\"label ? (label | translate) : effectivePlaceholder\"\n aria-multiselectable=\"true\"\n [status]=\"pending ? 'pending' : 'hasData'\">\n\n <ec-menu id=\"{{id}}_menu\"\n [class.border-top-0]=\"!filteredOptions.length && hideNoMatches && !showAddCustomOption\"\n [templateType]=\"'checkAndLabel'\"\n [customMenuTemplate]=\"checkboxMenuTemplate\"\n [showNoItems]=\"!hideNoMatches && !showAddCustomOption\"\n [noDataText]=\"noMatchesText\"\n [items]=\"filteredOptions\"\n [selected]=\"highlightedItem\"\n (selectedChanged)=\"onItemSelected($event)\"\n [truncateItems]=\"truncateItems\"\n [maintainSelectedItem]=\"false\">\n </ec-menu>\n\n @if (showAddCustomOption) {\n <div class=\"add-custom-option\"\n role=\"option\"\n attr.aria-label=\"{{'AddCustomItem_TC' | translate:{ customItem: filterFormModel.value } }}\"\n tabindex=\"-1\"\n (click)=\"addCustomItem()\">\n <i class=\"ec-icon icon-plus pr-2\" aria-hidden=\"true\"></i>\n <span class=\"label\">{{ 'AddCustomItem_TC' | translate:{ customItem: filterFormModel.value } }}</span>\n </div>\n }\n\n @if (showTotalRecordsFooter) {\n <footer [attr.id]=\"id + '_footer'\">\n <span>{{visibleOptionCount}} {{'of' | translate}} {{totalRecords}}</span>\n </footer>\n }\n </div>\n</ng-template>\n\n<!-- Custom checkbox menu item template -->\n<ng-template #checkboxMenuTemplate let-item>\n <div class=\"multiselect-item-row d-flex\"\n role=\"option\"\n [attr.aria-selected]=\"!!item.checked\"\n [attr.aria-label]=\"item.label\">\n @if (item === selectAllItem) {\n <ec-checkbox\n id=\"{{id}}_selectAll_checkbox\"\n class=\"m-0 pr-3\"\n [formModel]=\"selectAllFormControl\"\n [dependentCheckboxesGroup]=\"selectAllDependentGroup\"\n [label]=\"item.label\"\n (click)=\"$event.stopPropagation()\">\n </ec-checkbox>\n } @else {\n @if (item.display !== 'heading' && item.display !== 'heading-divided-section') {\n <!-- The checkbox is always ours; with a custom template it renders bare and the host owns the rest of the row. -->\n <ec-checkbox\n id=\"{{item.id || id + '_checkbox_' + item.label}}\"\n class=\"m-0\"\n [class.pr-3]=\"!customMenuTemplate\"\n [class.w-auto]=\"!!customMenuTemplate\"\n [formModel]=\"getCheckboxFormControl(item)\"\n [attr.aria-label]=\"item.label\"\n [label]=\"customMenuTemplate ? undefined : item.label\"\n [icon]=\"customMenuTemplate ? undefined : item.icon\"\n (click)=\"$event.stopPropagation()\">\n </ec-checkbox>\n @if (customMenuTemplate) {\n <!-- Host-owned row content. Clicks here bubble to the row and toggle the item unless the host stops them. -->\n <div class=\"multiselect-item-content\"\n [attr.id]=\"(item.id || id + '_checkbox_' + item.label) + '_content'\">\n <ng-container *ngTemplateOutlet=\"customMenuTemplate; context: { $implicit: item }\"></ng-container>\n </div>\n }\n } @else {\n <span>{{item.label}}</span>\n }\n }\n </div>\n</ng-template>\n",
|
|
9850
|
-
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)}: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:hover:not(:disabled):not(:focus),:host .control.invalid .textbox-group-input ::ng-deep .control input.ng-valid:hover:not(:disabled):not(:focus){border-color:var(--ec-form-control-border-color-hover)}: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-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~.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:not(:focus){border-color:var(--ec-form-control-border-color-invalid)}: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:hover:not(:disabled):not(:focus){border-color:var(--ec-form-control-border-color-hover)}:host .textbox-group{display:flex;position:relative}:host textarea:focus,:host input:focus,:host select:focus{outline:2px solid transparent;outline-offset:2px}:host textarea:focus-visible,:host input:focus-visible,:host select:focus-visible{outline-color:var(--ec-border-color-focus)}:host .sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.control.invalid .multiselect-input{background-color:var(--ec-form-control-background-color-invalid);border-color:var(--ec-form-control-border-color-invalid)}.control.invalid .multiselect-input:focus-within:not(.is-focused){border-color:var(--ec-form-control-background-color-invalid)}.control.invalid .multiselect-input .icon-invalid{display:inline-flex;position:absolute;left:.5rem;top:.5rem;z-index:1}.control.invalid .multiselect-input .icon-required{display:none}.control.invalid:not(.open) .textbox-group-btn-right ::ng-deep button:not(:focus){border-color:var(--ec-form-control-border-color-invalid)}.control.invalid:not(.open) .textbox-group-btn-right ::ng-deep button{background-color:var(--ec-form-control-background-color-invalid)}.control.invalid:not(.open) .multiselect-clear-btn ::ng-deep button:not(:focus){border-color:var(--ec-form-control-border-color-invalid)}.control.invalid:not(.open) .multiselect-clear-btn ::ng-deep button{background-color:var(--ec-form-control-background-color-invalid)}.control.invalid:not(.open) .textbox-group:hover .multiselect-input:not(.is-focused):not(:focus-within){border-color:var(--ec-form-control-border-color-hover)}.control.invalid:not(.open) .textbox-group:hover .multiselect-clear-btn ::ng-deep button:not(:focus){border-color:var(--ec-form-control-border-color-hover)}.control.invalid:not(.open) .textbox-group:hover .textbox-group-btn-right ::ng-deep button:not(:disabled):not(:focus){border-color:var(--ec-form-control-border-color-hover)}.control{position:relative}.control.is-disabled:not(.is-readonly) .multiselect-input{opacity:var(--ec-form-control-opacity-disabled);background-color:var(--ec-form-control-background-color-disabled);border-color:var(--ec-form-control-border-color-disabled);pointer-events:none}.control.is-readonly .multiselect-input{border-right:1px solid var(--ec-form-control-border-color-readonly);border-top-right-radius:var(--ec-border-radius);border-bottom-right-radius:var(--ec-border-radius);background-color:var(--ec-form-control-background-color-readonly);border-color:var(--ec-form-control-border-color-readonly);color:var(--ec-form-control-color-readonly);cursor:default}.control.is-readonly .multiselect-input .multiselect-filter-input{color:var(--ec-form-control-color-readonly)}.control.is-readonly .multiselect-input .multiselect-filter-input::placeholder{color:var(--ec-form-control-color-readonly)}.control.is-readonly ec-button{display:none}.control.open .textbox-group ec-button.multiselect-clear-btn{--ec-button-background-color-secondary: var(--ec-form-control-background-color)}.control:not(.is-disabled):not(.is-readonly) .textbox-group:hover .multiselect-input:not(.is-focused):not(:focus-within){border-color:var(--ec-form-control-border-color-hover)}.control:not(.is-disabled):not(.is-readonly) .textbox-group:hover .multiselect-clear-btn{--ec-button-border-color-secondary: var(--ec-form-control-border-color-hover)}.control:not(.is-disabled):not(.is-readonly) .textbox-group:hover ec-button.textbox-group-btn-right{--ec-button-border-color-secondary: var(--ec-form-control-border-color-hover)}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}.textbox-group{align-items:stretch}.multiselect-input{display:flex;flex-wrap:wrap;align-items:center;min-height:2rem;max-height:6rem;overflow-y:auto;padding:0 .5rem;background-color:var(--ec-form-control-background-color);border:1px solid var(--ec-form-control-border-color);border-top-left-radius:var(--ec-border-radius);border-bottom-left-radius:var(--ec-border-radius);border-right:0;cursor:text;flex:1 1;box-sizing:border-box;position:relative}.multiselect-input .icon-required,.multiselect-input .icon-invalid{display:none;color:var(--ec-form-control-border-color-invalid)}.multiselect-input.is-required.is-empty{padding-left:1.75rem}.multiselect-input.is-required.is-empty .icon-required{display:inline-flex;position:absolute;left:.5rem;top:.5rem;z-index:1}.multiselect-input:focus-within:not(.is-focused){border-color:var(--ec-form-control-border-color-focus);box-shadow:var(--ec-form-control-box-shadow-focus);outline:2px solid transparent;outline-offset:2px;position:relative;z-index:1;border-right:1px solid var(--ec-form-control-border-color-focus)}.multiselect-input.is-focused{border-right:1px solid var(--ec-form-control-border-color);z-index:1}.multiselect-filter-input{border:0;outline:none;background:transparent}.multiselect-input .multiselect-filter-input:focus,.multiselect-input .multiselect-filter-input:focus-visible{outline:none;box-shadow:none}.multiselect-filter-input{flex:1 1 100%;min-width:4rem;height:1.625rem;padding:0;font-size:var(--ec-form-control-font-size);color:var(--ec-form-control-color);line-height:1.25rem;overflow:hidden;text-overflow:ellipsis}.multiselect-filter-input::placeholder{color:var(--ec-form-control-color-placeholder);text-overflow:ellipsis}.has-selections:not(.is-focused) .multiselect-filter-input{width:0;min-width:0;flex:0 0 0;height:0;overflow:hidden;padding:0;margin:0}.popup{background-color:var(--ec-background-color);border-radius:var(--ec-border-radius-card);box-shadow:var(--ec-box-shadow-overlay);margin-top:.25rem;overflow:hidden;z-index:var(--ec-z-index-popup)}ec-menu{display:block}ec-menu ::ng-deep ul{max-height:30vh}ec-menu ::ng-deep ul li{white-space:nowrap}ec-menu ::ng-deep ul li.is-checked .icon-check{opacity:1;color:var(--ec-color-interactive)}ec-menu ::ng-deep ul li.select-all-item{font-weight:600}ec-menu ::ng-deep ul li .multiselect-item-row{flex:1 1 auto;align-items:center;min-width:0}ec-menu ::ng-deep ul li .multiselect-item-content{display:flex;align-items:center;flex:1 1 auto;min-width:0;margin-left:.5rem}ec-menu ::ng-deep ul li .multiselect-item-hover-only{opacity:0;transition:opacity .1s ease-in-out}ec-menu ::ng-deep ul li:hover .multiselect-item-hover-only,ec-menu ::ng-deep ul li.is-highlighted .multiselect-item-hover-only,ec-menu ::ng-deep ul li .multiselect-item-hover-only:focus-within{opacity:1}.multiselect-clear-btn{--ec-button-border-color-secondary: var(--ec-form-control-border-color);--ec-button-border-color-secondary-focus: transparent;--ec-button-color-icon-secondary: var(--ec-color-icon)}.multiselect-clear-btn ::ng-deep button{height:100%;border-left:0;border-right:0;border-radius:0;padding:0 .375rem}.multiselect-clear-btn ::ng-deep button:hover{background-color:var(--ec-background-color-hover)}.multiselect-clear-btn ::ng-deep button:focus-visible{outline-color:transparent}.multiselect-clear-btn ::ng-deep button .ec-icon{font-size:.75rem}ec-button.textbox-group-btn-right{--ec-button-border-color-secondary: var(--ec-form-control-border-color);--ec-button-border-color-secondary-focus: var(--ec-form-control-border-color);--ec-button-box-shadow-focus-secondary: none;--ec-button-color-icon-secondary: var(--ec-color-icon)}ec-button.textbox-group-btn-right ::ng-deep button{height:100%;border-top-right-radius:var(--ec-border-radius);border-bottom-right-radius:var(--ec-border-radius)}ec-button.textbox-group-btn-right ::ng-deep button:focus-visible{outline-color:transparent}.open .textbox-group ec-textbox{--ec-form-control-box-shadow-focus: none;--ec-form-control-border-color-focus: var(--ec-form-control-border-color)}.open .textbox-group ec-button{--ec-button-box-shadow-focus-secondary: none;--ec-button-background-color-secondary: var(--ec-background-color-selected)}.add-custom-option{display:flex;align-items:center;padding:.5rem .75rem;cursor:pointer;border-top:1px solid var(--ec-form-control-border-color, #ccc);color:var(--ec-color-text);font-size:.875rem}.add-custom-option:hover{background-color:var(--ec-color-background-hover, #f5f5f5)}.add-custom-option .label{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}footer{padding:.5rem;border-top:1px solid var(--ec-border-color);color:var(--ec-color-hint-dark);font-size:var(--ec-font-size-label);text-align:right;line-height:1}\n"],
|
|
9861
|
+
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)}: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:hover:not(:disabled):not(:focus),:host .control.invalid .textbox-group-input ::ng-deep .control input.ng-valid:hover:not(:disabled):not(:focus){border-color:var(--ec-form-control-border-color-hover)}: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-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~.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:not(:focus){border-color:var(--ec-form-control-border-color-invalid)}: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:hover:not(:disabled):not(:focus){border-color:var(--ec-form-control-border-color-hover)}:host .textbox-group{display:flex;position:relative}:host textarea:focus,:host input:focus,:host select:focus{outline:2px solid transparent;outline-offset:2px}:host textarea:focus-visible,:host input:focus-visible,:host select:focus-visible{outline-color:var(--ec-border-color-focus)}:host .sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.control.invalid .multiselect-input{background-color:var(--ec-form-control-background-color-invalid);border-color:var(--ec-form-control-border-color-invalid)}.control.invalid .multiselect-input:focus-within:not(.is-focused){border-color:var(--ec-form-control-background-color-invalid)}.control.invalid .multiselect-input .icon-invalid{display:inline-flex;position:absolute;left:.5rem;top:.5rem;z-index:1}.control.invalid .multiselect-input .icon-required{display:none}.control.invalid:not(.open) .textbox-group-btn-right ::ng-deep button:not(:focus){border-color:var(--ec-form-control-border-color-invalid)}.control.invalid:not(.open) .textbox-group-btn-right ::ng-deep button{background-color:var(--ec-form-control-background-color-invalid)}.control.invalid:not(.open) .multiselect-clear-btn ::ng-deep button:not(:focus){border-color:var(--ec-form-control-border-color-invalid)}.control.invalid:not(.open) .multiselect-clear-btn ::ng-deep button{background-color:var(--ec-form-control-background-color-invalid)}.control.invalid:not(.open) .textbox-group:hover .multiselect-input:not(.is-focused):not(:focus-within){border-color:var(--ec-form-control-border-color-hover)}.control.invalid:not(.open) .textbox-group:hover .multiselect-clear-btn ::ng-deep button:not(:focus){border-color:var(--ec-form-control-border-color-hover)}.control.invalid:not(.open) .textbox-group:hover .textbox-group-btn-right ::ng-deep button:not(:disabled):not(:focus){border-color:var(--ec-form-control-border-color-hover)}.control{position:relative}.control.is-disabled:not(.is-readonly) .multiselect-input{opacity:var(--ec-form-control-opacity-disabled);background-color:var(--ec-form-control-background-color-disabled);border-color:var(--ec-form-control-border-color-disabled);pointer-events:none}.control.is-readonly .multiselect-input{border-right:1px solid var(--ec-form-control-border-color-readonly);border-top-right-radius:var(--ec-border-radius);border-bottom-right-radius:var(--ec-border-radius);background-color:var(--ec-form-control-background-color-readonly);border-color:var(--ec-form-control-border-color-readonly);color:var(--ec-form-control-color-readonly);cursor:default}.control.is-readonly .multiselect-input .multiselect-filter-input{color:var(--ec-form-control-color-readonly)}.control.is-readonly .multiselect-input .multiselect-filter-input::placeholder{color:var(--ec-form-control-color-readonly)}.control.is-readonly ec-button{display:none}.control.open .textbox-group ec-button.multiselect-clear-btn{--ec-button-background-color-secondary: var(--ec-form-control-background-color)}.control:not(.is-disabled):not(.is-readonly) .textbox-group:hover .multiselect-input:not(.is-focused):not(:focus-within){border-color:var(--ec-form-control-border-color-hover)}.control:not(.is-disabled):not(.is-readonly) .textbox-group:hover .multiselect-clear-btn{--ec-button-border-color-secondary: var(--ec-form-control-border-color-hover)}.control:not(.is-disabled):not(.is-readonly) .textbox-group:hover ec-button.textbox-group-btn-right{--ec-button-border-color-secondary: var(--ec-form-control-border-color-hover)}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}.textbox-group{align-items:stretch}.multiselect-input{display:flex;flex-wrap:wrap;align-items:center;min-height:2rem;max-height:6rem;overflow-y:auto;padding:0 .5rem;background-color:var(--ec-form-control-background-color);border:1px solid var(--ec-form-control-border-color);border-top-left-radius:var(--ec-border-radius);border-bottom-left-radius:var(--ec-border-radius);border-right:0;cursor:text;flex:1 1;box-sizing:border-box;position:relative}.multiselect-input .icon-required,.multiselect-input .icon-invalid{display:none;color:var(--ec-form-control-border-color-invalid)}.multiselect-input.is-required.is-empty{padding-left:1.75rem}.multiselect-input.is-required.is-empty .icon-required{display:inline-flex;position:absolute;left:.5rem;top:.5rem;z-index:1}.multiselect-input:focus-within:not(.is-focused){border-color:var(--ec-form-control-border-color-focus);box-shadow:var(--ec-form-control-box-shadow-focus);outline:2px solid transparent;outline-offset:2px;position:relative;z-index:1;border-right:1px solid var(--ec-form-control-border-color-focus)}.multiselect-input.is-focused{border-right:1px solid var(--ec-form-control-border-color);z-index:1}.multiselect-filter-input{border:0;outline:none;background:transparent}.multiselect-input .multiselect-filter-input:focus,.multiselect-input .multiselect-filter-input:focus-visible{outline:none;box-shadow:none}.multiselect-filter-input{flex:1 1 100%;min-width:4rem;height:1.625rem;padding:0;font-size:var(--ec-form-control-font-size);color:var(--ec-form-control-color);line-height:1.25rem;overflow:hidden;text-overflow:ellipsis}.multiselect-filter-input::placeholder{color:var(--ec-form-control-color-placeholder);text-overflow:ellipsis}.has-selections:not(.is-focused) .multiselect-filter-input{width:0;min-width:0;flex:0 0 0;height:0;overflow:hidden;padding:0;margin:0}.popup{background-color:var(--ec-background-color);border-radius:var(--ec-border-radius-card);box-shadow:var(--ec-box-shadow-overlay);margin-top:.25rem;overflow:hidden;z-index:var(--ec-z-index-popup)}ec-menu{display:block}ec-menu ::ng-deep ul{max-height:30vh}ec-menu ::ng-deep ul li{white-space:nowrap}ec-menu ::ng-deep ul li.is-checked .icon-check{opacity:1;color:var(--ec-color-interactive)}ec-menu ::ng-deep ul li.select-all-item{font-weight:600}ec-menu ::ng-deep ul li .multiselect-item-row{flex:1 1 auto;align-items:center;min-width:0}ec-menu ::ng-deep ul li .multiselect-item-content{display:flex;align-items:center;flex:1 1 auto;min-width:0;margin-left:.5rem}ec-menu ::ng-deep ul li .multiselect-item-hover-only{opacity:0;transition:opacity .1s ease-in-out}ec-menu ::ng-deep ul li:hover .multiselect-item-hover-only,ec-menu ::ng-deep ul li.is-highlighted .multiselect-item-hover-only,ec-menu ::ng-deep ul li .multiselect-item-hover-only:focus-within{opacity:1}.multiselect-clear-btn{--ec-button-border-color-secondary: var(--ec-form-control-border-color);--ec-button-border-color-secondary-focus: transparent;--ec-button-color-icon-secondary: var(--ec-color-icon)}.multiselect-clear-btn ::ng-deep button{height:100%;border-left:0;border-right:0;border-radius:0;padding:0 .375rem}.multiselect-clear-btn ::ng-deep button:hover{background-color:var(--ec-background-color-hover)}.multiselect-clear-btn ::ng-deep button:focus-visible{outline-color:transparent}.multiselect-clear-btn ::ng-deep button .ec-icon{font-size:.75rem}ec-button.textbox-group-btn-right{--ec-button-border-color-secondary: var(--ec-form-control-border-color);--ec-button-border-color-secondary-focus: var(--ec-form-control-border-color);--ec-button-box-shadow-focus-secondary: none;--ec-button-color-icon-secondary: var(--ec-color-icon)}ec-button.textbox-group-btn-right ::ng-deep button{height:100%;border-top-right-radius:var(--ec-border-radius);border-bottom-right-radius:var(--ec-border-radius)}ec-button.textbox-group-btn-right ::ng-deep button:focus-visible{outline-color:transparent}.open .textbox-group ec-textbox{--ec-form-control-box-shadow-focus: none;--ec-form-control-border-color-focus: var(--ec-form-control-border-color)}.open .textbox-group ec-button{--ec-button-box-shadow-focus-secondary: none;--ec-button-background-color-secondary: var(--ec-background-color-selected)}.add-custom-option{display:flex;align-items:center;padding:.5rem .75rem;cursor:pointer;border-top:1px solid var(--ec-form-control-border-color);color:var(--ec-color-primary-dark);font-size:.875rem}.add-custom-option:hover{background-color:var(--ec-background-color-hover)}.add-custom-option .label{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}footer{padding:.5rem;border-top:1px solid var(--ec-border-color);color:var(--ec-color-hint-dark);font-size:var(--ec-font-size-label);text-align:right;line-height:1}\n"],
|
|
9851
9862
|
dependencies: [
|
|
9852
9863
|
{
|
|
9853
9864
|
kind: "directive",
|
|
@@ -9899,6 +9910,7 @@ var MultiselectComponent = class MultiselectComponent extends FormControlBase {
|
|
|
9899
9910
|
"iconColor",
|
|
9900
9911
|
"label",
|
|
9901
9912
|
"ariaLabel",
|
|
9913
|
+
"ariaPressed",
|
|
9902
9914
|
"ariaExpanded",
|
|
9903
9915
|
"ariaHaspopup",
|
|
9904
9916
|
"ariaActivedescendant",
|
|
@@ -10020,7 +10032,7 @@ i0.ɵɵngDeclareClassMetadata({
|
|
|
10020
10032
|
changeDetection: ChangeDetectionStrategy.Eager,
|
|
10021
10033
|
standalone: false,
|
|
10022
10034
|
template: "<div class=\"control control-label-{{labelPosition}}\"\n [ngClass]=\"{'invalid': formModel.touched && formModel.invalid,\n 'is-readonly': readonly,\n 'is-disabled': formModel.disabled,\n 'open': menuStatus === 'visible'}\">\n\n @if (label) {\n <label [attr.id]=\"id + '_label'\" [attr.for]=\"id + '_filter'\">\n <span>{{label | translate}}</span>\n @if (validationErrors.length > 0 && formModel.touched && formModel.invalid) {\n <span> {{validationErrors}}</span>\n }\n @if (helpPopover) {\n <ec-help-popover id=\"{{id}}_helpPopover\"\n class=\"d-inline-block my-n3 mx-n1\"\n text=\"{{helpPopover | translate}}\"\n contentPosition=\"{{helpPopoverPosition}}\">\n </ec-help-popover>\n }\n </label>\n }\n\n <div class=\"textbox-group control-input\"\n *ecPopup=\"dropdownmenu\">\n <div class=\"multiselect-input\"\n [attr.id]=\"id + '_input_container'\"\n role=\"combobox\"\n [attr.aria-expanded]=\"menuStatus === 'visible'\"\n aria-haspopup=\"listbox\"\n [attr.aria-owns]=\"id + '_menu_list'\"\n [class.is-focused]=\"menuStatus === 'visible'\"\n [class.is-disabled]=\"formModel.disabled\"\n [class.is-empty]=\"selectedItems.length === 0\"\n [class.is-required]=\"required\"\n [class.has-selections]=\"selectedItems.length > 0\"\n (click)=\"toggleMenu($event)\">\n\n <!-- Selected tags -->\n @if (selectedTags.length > 0) {\n <ec-tags\n id=\"{{id}}_tags\"\n [tags]=\"selectedTags\"\n [wrap]=\"true\"\n [isCondensed]=\"false\"\n [isSubtle]=\"true\"\n (tagClosed)=\"removeTag($event)\"\n (click)=\"$event.stopPropagation()\">\n </ec-tags>\n }\n\n <!-- Filter input -->\n <input\n #filterInput\n class=\"multiselect-filter-input\"\n type=\"text\"\n [id]=\"id + '_filter'\"\n [formControl]=\"filterFormModel\"\n [placeholder]=\"effectivePlaceholder\"\n [tabindex]=\"tabindex\"\n (input)=\"onFilterInput()\"\n (keydown)=\"keyNavigate($event)\"\n (focusout)=\"onBlur()\"\n (click)=\"menuStatus === 'visible' ? $event.stopPropagation() : null\"\n autocomplete=\"off\"\n [attr.cdkFocusInitial]=\"autofocus || null\"\n aria-autocomplete=\"list\"\n [attr.aria-controls]=\"menuStatus === 'visible' ? id + '_menu_list' : null\"\n [attr.aria-activedescendant]=\"activeDescendantId\"\n [attr.aria-labelledby]=\"label ? id + '_label' : null\"\n [attr.aria-label]=\"!label ? effectivePlaceholder : null\"\n [attr.aria-describedby]=\"selectedItems.length > 0 ? id + '_selection_status' : null\" />\n\n <i class=\"ec-icon icon-required\"></i>\n <i class=\"ec-icon icon-invalid\"></i>\n </div>\n\n <!-- Live region for selection announcements -->\n <span [id]=\"id + '_selection_status'\"\n class=\"sr-only\"\n aria-live=\"polite\"\n aria-atomic=\"true\">\n {{ 'Multiselect_LiveRegion_Status_SC' | translate:{ count: selectedItems.length } }}\n </span>\n\n <!-- Clear button -->\n @if (selectedItems.length > 0 && !formModel.disabled && !readonly) {\n <ec-button class=\"multiselect-clear-btn\"\n [id]=\"id + '_clear'\"\n icon=\"icon-cancel\"\n type=\"secondary\"\n [tabindex]=\"0\"\n attr.aria-label=\"{{'ClearAllSelections_SC' | translate}}\"\n (click)=\"clearAll(); $event.stopPropagation()\">\n </ec-button>\n }\n\n <!-- Toggle button -->\n <ec-button class=\"textbox-group-btn-right\"\n [id]=\"id + '_button'\"\n [disabled]=\"formModel.disabled\"\n icon=\"icon-caret-down\"\n [tabindex]=\"-1\"\n type=\"secondary\"\n [attr.aria-label]=\"'Toggle dropdown'\"\n [attr.aria-expanded]=\"menuStatus === 'visible'\"\n (click)=\"toggleMenu($event)\"\n [class.active]=\"menuStatus === 'visible'\">\n </ec-button>\n </div>\n</div>\n\n<ng-template #dropdownmenu>\n <div class=\"popup\"\n ecOverlay\n role=\"listbox\"\n [attr.id]=\"id + '_listbox'\"\n [attr.aria-label]=\"label ? (label | translate) : effectivePlaceholder\"\n aria-multiselectable=\"true\"\n [status]=\"pending ? 'pending' : 'hasData'\">\n\n <ec-menu id=\"{{id}}_menu\"\n [class.border-top-0]=\"!filteredOptions.length && hideNoMatches && !showAddCustomOption\"\n [templateType]=\"'checkAndLabel'\"\n [customMenuTemplate]=\"checkboxMenuTemplate\"\n [showNoItems]=\"!hideNoMatches && !showAddCustomOption\"\n [noDataText]=\"noMatchesText\"\n [items]=\"filteredOptions\"\n [selected]=\"highlightedItem\"\n (selectedChanged)=\"onItemSelected($event)\"\n [truncateItems]=\"truncateItems\"\n [maintainSelectedItem]=\"false\">\n </ec-menu>\n\n @if (showAddCustomOption) {\n <div class=\"add-custom-option\"\n role=\"option\"\n attr.aria-label=\"{{'AddCustomItem_TC' | translate:{ customItem: filterFormModel.value } }}\"\n tabindex=\"-1\"\n (click)=\"addCustomItem()\">\n <i class=\"ec-icon icon-plus pr-2\" aria-hidden=\"true\"></i>\n <span class=\"label\">{{ 'AddCustomItem_TC' | translate:{ customItem: filterFormModel.value } }}</span>\n </div>\n }\n\n @if (showTotalRecordsFooter) {\n <footer [attr.id]=\"id + '_footer'\">\n <span>{{visibleOptionCount}} {{'of' | translate}} {{totalRecords}}</span>\n </footer>\n }\n </div>\n</ng-template>\n\n<!-- Custom checkbox menu item template -->\n<ng-template #checkboxMenuTemplate let-item>\n <div class=\"multiselect-item-row d-flex\"\n role=\"option\"\n [attr.aria-selected]=\"!!item.checked\"\n [attr.aria-label]=\"item.label\">\n @if (item === selectAllItem) {\n <ec-checkbox\n id=\"{{id}}_selectAll_checkbox\"\n class=\"m-0 pr-3\"\n [formModel]=\"selectAllFormControl\"\n [dependentCheckboxesGroup]=\"selectAllDependentGroup\"\n [label]=\"item.label\"\n (click)=\"$event.stopPropagation()\">\n </ec-checkbox>\n } @else {\n @if (item.display !== 'heading' && item.display !== 'heading-divided-section') {\n <!-- The checkbox is always ours; with a custom template it renders bare and the host owns the rest of the row. -->\n <ec-checkbox\n id=\"{{item.id || id + '_checkbox_' + item.label}}\"\n class=\"m-0\"\n [class.pr-3]=\"!customMenuTemplate\"\n [class.w-auto]=\"!!customMenuTemplate\"\n [formModel]=\"getCheckboxFormControl(item)\"\n [attr.aria-label]=\"item.label\"\n [label]=\"customMenuTemplate ? undefined : item.label\"\n [icon]=\"customMenuTemplate ? undefined : item.icon\"\n (click)=\"$event.stopPropagation()\">\n </ec-checkbox>\n @if (customMenuTemplate) {\n <!-- Host-owned row content. Clicks here bubble to the row and toggle the item unless the host stops them. -->\n <div class=\"multiselect-item-content\"\n [attr.id]=\"(item.id || id + '_checkbox_' + item.label) + '_content'\">\n <ng-container *ngTemplateOutlet=\"customMenuTemplate; context: { $implicit: item }\"></ng-container>\n </div>\n }\n } @else {\n <span>{{item.label}}</span>\n }\n }\n </div>\n</ng-template>\n",
|
|
10023
|
-
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)}: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:hover:not(:disabled):not(:focus),:host .control.invalid .textbox-group-input ::ng-deep .control input.ng-valid:hover:not(:disabled):not(:focus){border-color:var(--ec-form-control-border-color-hover)}: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-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~.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:not(:focus){border-color:var(--ec-form-control-border-color-invalid)}: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:hover:not(:disabled):not(:focus){border-color:var(--ec-form-control-border-color-hover)}:host .textbox-group{display:flex;position:relative}:host textarea:focus,:host input:focus,:host select:focus{outline:2px solid transparent;outline-offset:2px}:host textarea:focus-visible,:host input:focus-visible,:host select:focus-visible{outline-color:var(--ec-border-color-focus)}:host .sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.control.invalid .multiselect-input{background-color:var(--ec-form-control-background-color-invalid);border-color:var(--ec-form-control-border-color-invalid)}.control.invalid .multiselect-input:focus-within:not(.is-focused){border-color:var(--ec-form-control-background-color-invalid)}.control.invalid .multiselect-input .icon-invalid{display:inline-flex;position:absolute;left:.5rem;top:.5rem;z-index:1}.control.invalid .multiselect-input .icon-required{display:none}.control.invalid:not(.open) .textbox-group-btn-right ::ng-deep button:not(:focus){border-color:var(--ec-form-control-border-color-invalid)}.control.invalid:not(.open) .textbox-group-btn-right ::ng-deep button{background-color:var(--ec-form-control-background-color-invalid)}.control.invalid:not(.open) .multiselect-clear-btn ::ng-deep button:not(:focus){border-color:var(--ec-form-control-border-color-invalid)}.control.invalid:not(.open) .multiselect-clear-btn ::ng-deep button{background-color:var(--ec-form-control-background-color-invalid)}.control.invalid:not(.open) .textbox-group:hover .multiselect-input:not(.is-focused):not(:focus-within){border-color:var(--ec-form-control-border-color-hover)}.control.invalid:not(.open) .textbox-group:hover .multiselect-clear-btn ::ng-deep button:not(:focus){border-color:var(--ec-form-control-border-color-hover)}.control.invalid:not(.open) .textbox-group:hover .textbox-group-btn-right ::ng-deep button:not(:disabled):not(:focus){border-color:var(--ec-form-control-border-color-hover)}.control{position:relative}.control.is-disabled:not(.is-readonly) .multiselect-input{opacity:var(--ec-form-control-opacity-disabled);background-color:var(--ec-form-control-background-color-disabled);border-color:var(--ec-form-control-border-color-disabled);pointer-events:none}.control.is-readonly .multiselect-input{border-right:1px solid var(--ec-form-control-border-color-readonly);border-top-right-radius:var(--ec-border-radius);border-bottom-right-radius:var(--ec-border-radius);background-color:var(--ec-form-control-background-color-readonly);border-color:var(--ec-form-control-border-color-readonly);color:var(--ec-form-control-color-readonly);cursor:default}.control.is-readonly .multiselect-input .multiselect-filter-input{color:var(--ec-form-control-color-readonly)}.control.is-readonly .multiselect-input .multiselect-filter-input::placeholder{color:var(--ec-form-control-color-readonly)}.control.is-readonly ec-button{display:none}.control.open .textbox-group ec-button.multiselect-clear-btn{--ec-button-background-color-secondary: var(--ec-form-control-background-color)}.control:not(.is-disabled):not(.is-readonly) .textbox-group:hover .multiselect-input:not(.is-focused):not(:focus-within){border-color:var(--ec-form-control-border-color-hover)}.control:not(.is-disabled):not(.is-readonly) .textbox-group:hover .multiselect-clear-btn{--ec-button-border-color-secondary: var(--ec-form-control-border-color-hover)}.control:not(.is-disabled):not(.is-readonly) .textbox-group:hover ec-button.textbox-group-btn-right{--ec-button-border-color-secondary: var(--ec-form-control-border-color-hover)}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}.textbox-group{align-items:stretch}.multiselect-input{display:flex;flex-wrap:wrap;align-items:center;min-height:2rem;max-height:6rem;overflow-y:auto;padding:0 .5rem;background-color:var(--ec-form-control-background-color);border:1px solid var(--ec-form-control-border-color);border-top-left-radius:var(--ec-border-radius);border-bottom-left-radius:var(--ec-border-radius);border-right:0;cursor:text;flex:1 1;box-sizing:border-box;position:relative}.multiselect-input .icon-required,.multiselect-input .icon-invalid{display:none;color:var(--ec-form-control-border-color-invalid)}.multiselect-input.is-required.is-empty{padding-left:1.75rem}.multiselect-input.is-required.is-empty .icon-required{display:inline-flex;position:absolute;left:.5rem;top:.5rem;z-index:1}.multiselect-input:focus-within:not(.is-focused){border-color:var(--ec-form-control-border-color-focus);box-shadow:var(--ec-form-control-box-shadow-focus);outline:2px solid transparent;outline-offset:2px;position:relative;z-index:1;border-right:1px solid var(--ec-form-control-border-color-focus)}.multiselect-input.is-focused{border-right:1px solid var(--ec-form-control-border-color);z-index:1}.multiselect-filter-input{border:0;outline:none;background:transparent}.multiselect-input .multiselect-filter-input:focus,.multiselect-input .multiselect-filter-input:focus-visible{outline:none;box-shadow:none}.multiselect-filter-input{flex:1 1 100%;min-width:4rem;height:1.625rem;padding:0;font-size:var(--ec-form-control-font-size);color:var(--ec-form-control-color);line-height:1.25rem;overflow:hidden;text-overflow:ellipsis}.multiselect-filter-input::placeholder{color:var(--ec-form-control-color-placeholder);text-overflow:ellipsis}.has-selections:not(.is-focused) .multiselect-filter-input{width:0;min-width:0;flex:0 0 0;height:0;overflow:hidden;padding:0;margin:0}.popup{background-color:var(--ec-background-color);border-radius:var(--ec-border-radius-card);box-shadow:var(--ec-box-shadow-overlay);margin-top:.25rem;overflow:hidden;z-index:var(--ec-z-index-popup)}ec-menu{display:block}ec-menu ::ng-deep ul{max-height:30vh}ec-menu ::ng-deep ul li{white-space:nowrap}ec-menu ::ng-deep ul li.is-checked .icon-check{opacity:1;color:var(--ec-color-interactive)}ec-menu ::ng-deep ul li.select-all-item{font-weight:600}ec-menu ::ng-deep ul li .multiselect-item-row{flex:1 1 auto;align-items:center;min-width:0}ec-menu ::ng-deep ul li .multiselect-item-content{display:flex;align-items:center;flex:1 1 auto;min-width:0;margin-left:.5rem}ec-menu ::ng-deep ul li .multiselect-item-hover-only{opacity:0;transition:opacity .1s ease-in-out}ec-menu ::ng-deep ul li:hover .multiselect-item-hover-only,ec-menu ::ng-deep ul li.is-highlighted .multiselect-item-hover-only,ec-menu ::ng-deep ul li .multiselect-item-hover-only:focus-within{opacity:1}.multiselect-clear-btn{--ec-button-border-color-secondary: var(--ec-form-control-border-color);--ec-button-border-color-secondary-focus: transparent;--ec-button-color-icon-secondary: var(--ec-color-icon)}.multiselect-clear-btn ::ng-deep button{height:100%;border-left:0;border-right:0;border-radius:0;padding:0 .375rem}.multiselect-clear-btn ::ng-deep button:hover{background-color:var(--ec-background-color-hover)}.multiselect-clear-btn ::ng-deep button:focus-visible{outline-color:transparent}.multiselect-clear-btn ::ng-deep button .ec-icon{font-size:.75rem}ec-button.textbox-group-btn-right{--ec-button-border-color-secondary: var(--ec-form-control-border-color);--ec-button-border-color-secondary-focus: var(--ec-form-control-border-color);--ec-button-box-shadow-focus-secondary: none;--ec-button-color-icon-secondary: var(--ec-color-icon)}ec-button.textbox-group-btn-right ::ng-deep button{height:100%;border-top-right-radius:var(--ec-border-radius);border-bottom-right-radius:var(--ec-border-radius)}ec-button.textbox-group-btn-right ::ng-deep button:focus-visible{outline-color:transparent}.open .textbox-group ec-textbox{--ec-form-control-box-shadow-focus: none;--ec-form-control-border-color-focus: var(--ec-form-control-border-color)}.open .textbox-group ec-button{--ec-button-box-shadow-focus-secondary: none;--ec-button-background-color-secondary: var(--ec-background-color-selected)}.add-custom-option{display:flex;align-items:center;padding:.5rem .75rem;cursor:pointer;border-top:1px solid var(--ec-form-control-border-color, #ccc);color:var(--ec-color-text);font-size:.875rem}.add-custom-option:hover{background-color:var(--ec-color-background-hover, #f5f5f5)}.add-custom-option .label{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}footer{padding:.5rem;border-top:1px solid var(--ec-border-color);color:var(--ec-color-hint-dark);font-size:var(--ec-font-size-label);text-align:right;line-height:1}\n"]
|
|
10035
|
+
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)}: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:hover:not(:disabled):not(:focus),:host .control.invalid .textbox-group-input ::ng-deep .control input.ng-valid:hover:not(:disabled):not(:focus){border-color:var(--ec-form-control-border-color-hover)}: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-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~.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:not(:focus){border-color:var(--ec-form-control-border-color-invalid)}: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:hover:not(:disabled):not(:focus){border-color:var(--ec-form-control-border-color-hover)}:host .textbox-group{display:flex;position:relative}:host textarea:focus,:host input:focus,:host select:focus{outline:2px solid transparent;outline-offset:2px}:host textarea:focus-visible,:host input:focus-visible,:host select:focus-visible{outline-color:var(--ec-border-color-focus)}:host .sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.control.invalid .multiselect-input{background-color:var(--ec-form-control-background-color-invalid);border-color:var(--ec-form-control-border-color-invalid)}.control.invalid .multiselect-input:focus-within:not(.is-focused){border-color:var(--ec-form-control-background-color-invalid)}.control.invalid .multiselect-input .icon-invalid{display:inline-flex;position:absolute;left:.5rem;top:.5rem;z-index:1}.control.invalid .multiselect-input .icon-required{display:none}.control.invalid:not(.open) .textbox-group-btn-right ::ng-deep button:not(:focus){border-color:var(--ec-form-control-border-color-invalid)}.control.invalid:not(.open) .textbox-group-btn-right ::ng-deep button{background-color:var(--ec-form-control-background-color-invalid)}.control.invalid:not(.open) .multiselect-clear-btn ::ng-deep button:not(:focus){border-color:var(--ec-form-control-border-color-invalid)}.control.invalid:not(.open) .multiselect-clear-btn ::ng-deep button{background-color:var(--ec-form-control-background-color-invalid)}.control.invalid:not(.open) .textbox-group:hover .multiselect-input:not(.is-focused):not(:focus-within){border-color:var(--ec-form-control-border-color-hover)}.control.invalid:not(.open) .textbox-group:hover .multiselect-clear-btn ::ng-deep button:not(:focus){border-color:var(--ec-form-control-border-color-hover)}.control.invalid:not(.open) .textbox-group:hover .textbox-group-btn-right ::ng-deep button:not(:disabled):not(:focus){border-color:var(--ec-form-control-border-color-hover)}.control{position:relative}.control.is-disabled:not(.is-readonly) .multiselect-input{opacity:var(--ec-form-control-opacity-disabled);background-color:var(--ec-form-control-background-color-disabled);border-color:var(--ec-form-control-border-color-disabled);pointer-events:none}.control.is-readonly .multiselect-input{border-right:1px solid var(--ec-form-control-border-color-readonly);border-top-right-radius:var(--ec-border-radius);border-bottom-right-radius:var(--ec-border-radius);background-color:var(--ec-form-control-background-color-readonly);border-color:var(--ec-form-control-border-color-readonly);color:var(--ec-form-control-color-readonly);cursor:default}.control.is-readonly .multiselect-input .multiselect-filter-input{color:var(--ec-form-control-color-readonly)}.control.is-readonly .multiselect-input .multiselect-filter-input::placeholder{color:var(--ec-form-control-color-readonly)}.control.is-readonly ec-button{display:none}.control.open .textbox-group ec-button.multiselect-clear-btn{--ec-button-background-color-secondary: var(--ec-form-control-background-color)}.control:not(.is-disabled):not(.is-readonly) .textbox-group:hover .multiselect-input:not(.is-focused):not(:focus-within){border-color:var(--ec-form-control-border-color-hover)}.control:not(.is-disabled):not(.is-readonly) .textbox-group:hover .multiselect-clear-btn{--ec-button-border-color-secondary: var(--ec-form-control-border-color-hover)}.control:not(.is-disabled):not(.is-readonly) .textbox-group:hover ec-button.textbox-group-btn-right{--ec-button-border-color-secondary: var(--ec-form-control-border-color-hover)}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}.textbox-group{align-items:stretch}.multiselect-input{display:flex;flex-wrap:wrap;align-items:center;min-height:2rem;max-height:6rem;overflow-y:auto;padding:0 .5rem;background-color:var(--ec-form-control-background-color);border:1px solid var(--ec-form-control-border-color);border-top-left-radius:var(--ec-border-radius);border-bottom-left-radius:var(--ec-border-radius);border-right:0;cursor:text;flex:1 1;box-sizing:border-box;position:relative}.multiselect-input .icon-required,.multiselect-input .icon-invalid{display:none;color:var(--ec-form-control-border-color-invalid)}.multiselect-input.is-required.is-empty{padding-left:1.75rem}.multiselect-input.is-required.is-empty .icon-required{display:inline-flex;position:absolute;left:.5rem;top:.5rem;z-index:1}.multiselect-input:focus-within:not(.is-focused){border-color:var(--ec-form-control-border-color-focus);box-shadow:var(--ec-form-control-box-shadow-focus);outline:2px solid transparent;outline-offset:2px;position:relative;z-index:1;border-right:1px solid var(--ec-form-control-border-color-focus)}.multiselect-input.is-focused{border-right:1px solid var(--ec-form-control-border-color);z-index:1}.multiselect-filter-input{border:0;outline:none;background:transparent}.multiselect-input .multiselect-filter-input:focus,.multiselect-input .multiselect-filter-input:focus-visible{outline:none;box-shadow:none}.multiselect-filter-input{flex:1 1 100%;min-width:4rem;height:1.625rem;padding:0;font-size:var(--ec-form-control-font-size);color:var(--ec-form-control-color);line-height:1.25rem;overflow:hidden;text-overflow:ellipsis}.multiselect-filter-input::placeholder{color:var(--ec-form-control-color-placeholder);text-overflow:ellipsis}.has-selections:not(.is-focused) .multiselect-filter-input{width:0;min-width:0;flex:0 0 0;height:0;overflow:hidden;padding:0;margin:0}.popup{background-color:var(--ec-background-color);border-radius:var(--ec-border-radius-card);box-shadow:var(--ec-box-shadow-overlay);margin-top:.25rem;overflow:hidden;z-index:var(--ec-z-index-popup)}ec-menu{display:block}ec-menu ::ng-deep ul{max-height:30vh}ec-menu ::ng-deep ul li{white-space:nowrap}ec-menu ::ng-deep ul li.is-checked .icon-check{opacity:1;color:var(--ec-color-interactive)}ec-menu ::ng-deep ul li.select-all-item{font-weight:600}ec-menu ::ng-deep ul li .multiselect-item-row{flex:1 1 auto;align-items:center;min-width:0}ec-menu ::ng-deep ul li .multiselect-item-content{display:flex;align-items:center;flex:1 1 auto;min-width:0;margin-left:.5rem}ec-menu ::ng-deep ul li .multiselect-item-hover-only{opacity:0;transition:opacity .1s ease-in-out}ec-menu ::ng-deep ul li:hover .multiselect-item-hover-only,ec-menu ::ng-deep ul li.is-highlighted .multiselect-item-hover-only,ec-menu ::ng-deep ul li .multiselect-item-hover-only:focus-within{opacity:1}.multiselect-clear-btn{--ec-button-border-color-secondary: var(--ec-form-control-border-color);--ec-button-border-color-secondary-focus: transparent;--ec-button-color-icon-secondary: var(--ec-color-icon)}.multiselect-clear-btn ::ng-deep button{height:100%;border-left:0;border-right:0;border-radius:0;padding:0 .375rem}.multiselect-clear-btn ::ng-deep button:hover{background-color:var(--ec-background-color-hover)}.multiselect-clear-btn ::ng-deep button:focus-visible{outline-color:transparent}.multiselect-clear-btn ::ng-deep button .ec-icon{font-size:.75rem}ec-button.textbox-group-btn-right{--ec-button-border-color-secondary: var(--ec-form-control-border-color);--ec-button-border-color-secondary-focus: var(--ec-form-control-border-color);--ec-button-box-shadow-focus-secondary: none;--ec-button-color-icon-secondary: var(--ec-color-icon)}ec-button.textbox-group-btn-right ::ng-deep button{height:100%;border-top-right-radius:var(--ec-border-radius);border-bottom-right-radius:var(--ec-border-radius)}ec-button.textbox-group-btn-right ::ng-deep button:focus-visible{outline-color:transparent}.open .textbox-group ec-textbox{--ec-form-control-box-shadow-focus: none;--ec-form-control-border-color-focus: var(--ec-form-control-border-color)}.open .textbox-group ec-button{--ec-button-box-shadow-focus-secondary: none;--ec-button-background-color-secondary: var(--ec-background-color-selected)}.add-custom-option{display:flex;align-items:center;padding:.5rem .75rem;cursor:pointer;border-top:1px solid var(--ec-form-control-border-color);color:var(--ec-color-primary-dark);font-size:.875rem}.add-custom-option:hover{background-color:var(--ec-background-color-hover)}.add-custom-option .label{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}footer{padding:.5rem;border-top:1px solid var(--ec-border-color);color:var(--ec-color-hint-dark);font-size:var(--ec-font-size-label);text-align:right;line-height:1}\n"]
|
|
10024
10036
|
}]
|
|
10025
10037
|
}],
|
|
10026
10038
|
ctorParameters: () => [
|
|
@@ -10563,7 +10575,7 @@ var SelectComponent = class SelectComponent extends FormControlBase {
|
|
|
10563
10575
|
usesOnChanges: true,
|
|
10564
10576
|
ngImport: i0,
|
|
10565
10577
|
template: "<div class=\"control\"\n [ngClass]=\"{'is-readonly': readonly, 'is-disabled': formModel.disabled}\">\n\n @if (label) {\n <label\n for=\"{{id}}_select\">\n <span>{{label | translate}}</span>\n @if (helpPopover) {\n <ec-help-popover id=\"{{id}}_helpPopover\"\n class=\"d-inline-block my-n3 mx-n1\"\n text=\"{{helpPopover | translate}}\"\n contentPosition=\"{{helpPopoverPosition}}\">\n </ec-help-popover>\n }\n </label>\n }\n\n <select [attr.id]=\"inputId\"\n tabindex=\"{{tabindex}}\"\n [formControl]=\"formModel\"\n [attr.required]=\"required\"\n [attr.cdkFocusInitial]=\"autofocus || null\">\n @if (!required) {\n <option\n [ngValue]=\"null\">{{placeholder}}</option>\n }\n @for (option of options; track option) {\n <option\n [ngValue]=\"option.value\">{{option.label}}</option>\n }\n </select>\n <i class=\"ec-icon icon-caret-down\" aria-hidden=\"true\"></i>\n</div>",
|
|
10566
|
-
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)}: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:hover:not(:disabled):not(:focus),:host .control.invalid .textbox-group-input ::ng-deep .control input.ng-valid:hover:not(:disabled):not(:focus){border-color:var(--ec-form-control-border-color-hover)}: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-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~.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:not(:focus){border-color:var(--ec-form-control-border-color-invalid)}: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:hover:not(:disabled):not(:focus){border-color:var(--ec-form-control-border-color-hover)}:host .textbox-group{display:flex;position:relative}:host textarea:focus,:host input:focus,:host select:focus{outline:2px solid transparent;outline-offset:2px}:host textarea:focus-visible,:host input:focus-visible,:host select:focus-visible{outline-color:var(--ec-border-color-focus)}:host .sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}: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;-moz-appearance:none;appearance:none}: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{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 .5rem;height:2rem}: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)}:host select.ng-invalid.ng-touched:focus{border-color:var(--ec-form-control-background-color-invalid)}:host select.ng-invalid.ng-touched:hover:not(:disabled):not(:focus){border-color:var(--ec-form-control-border-color-hover)}:host select.ng-invalid.ng-touched{background-image:none;background-repeat:no-repeat;background-position:.5rem center;background-size:1rem,1rem;padding-left:1.75rem}: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);outline:2px solid transparent;outline-offset:2px;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:hover:not(:disabled):not(:focus){border-color:var(--ec-form-control-border-color-hover)}:host select.is-uppercase:not(.is-empty){text-transform:uppercase}:host select{padding-right:1.5rem}: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"],
|
|
10578
|
+
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)}: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:hover:not(:disabled):not(:focus),:host .control.invalid .textbox-group-input ::ng-deep .control input.ng-valid:hover:not(:disabled):not(:focus){border-color:var(--ec-form-control-border-color-hover)}: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-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~.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:not(:focus){border-color:var(--ec-form-control-border-color-invalid)}: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:hover:not(:disabled):not(:focus){border-color:var(--ec-form-control-border-color-hover)}:host .textbox-group{display:flex;position:relative}:host textarea:focus,:host input:focus,:host select:focus{outline:2px solid transparent;outline-offset:2px}:host textarea:focus-visible,:host input:focus-visible,:host select:focus-visible{outline-color:var(--ec-border-color-focus)}:host .sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}: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;-moz-appearance:none;appearance:none}: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{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;color:inherit;width:100%;line-height:1.25rem;padding:.3125rem .5rem;height:2rem}: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)}:host select.ng-invalid.ng-touched:focus{border-color:var(--ec-form-control-background-color-invalid)}:host select.ng-invalid.ng-touched:hover:not(:disabled):not(:focus){border-color:var(--ec-form-control-border-color-hover)}:host select.ng-invalid.ng-touched{background-image:none;background-repeat:no-repeat;background-position:.5rem center;background-size:1rem,1rem;padding-left:1.75rem}: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);outline:2px solid transparent;outline-offset:2px;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:hover:not(:disabled):not(:focus){border-color:var(--ec-form-control-border-color-hover)}:host select.is-uppercase:not(.is-empty){text-transform:uppercase}:host select{padding-right:1.5rem}: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"],
|
|
10567
10579
|
dependencies: [
|
|
10568
10580
|
{
|
|
10569
10581
|
kind: "directive",
|
|
@@ -10639,7 +10651,7 @@ i0.ɵɵngDeclareClassMetadata({
|
|
|
10639
10651
|
changeDetection: ChangeDetectionStrategy.Eager,
|
|
10640
10652
|
standalone: false,
|
|
10641
10653
|
template: "<div class=\"control\"\n [ngClass]=\"{'is-readonly': readonly, 'is-disabled': formModel.disabled}\">\n\n @if (label) {\n <label\n for=\"{{id}}_select\">\n <span>{{label | translate}}</span>\n @if (helpPopover) {\n <ec-help-popover id=\"{{id}}_helpPopover\"\n class=\"d-inline-block my-n3 mx-n1\"\n text=\"{{helpPopover | translate}}\"\n contentPosition=\"{{helpPopoverPosition}}\">\n </ec-help-popover>\n }\n </label>\n }\n\n <select [attr.id]=\"inputId\"\n tabindex=\"{{tabindex}}\"\n [formControl]=\"formModel\"\n [attr.required]=\"required\"\n [attr.cdkFocusInitial]=\"autofocus || null\">\n @if (!required) {\n <option\n [ngValue]=\"null\">{{placeholder}}</option>\n }\n @for (option of options; track option) {\n <option\n [ngValue]=\"option.value\">{{option.label}}</option>\n }\n </select>\n <i class=\"ec-icon icon-caret-down\" aria-hidden=\"true\"></i>\n</div>",
|
|
10642
|
-
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)}: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:hover:not(:disabled):not(:focus),:host .control.invalid .textbox-group-input ::ng-deep .control input.ng-valid:hover:not(:disabled):not(:focus){border-color:var(--ec-form-control-border-color-hover)}: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-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~.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:not(:focus){border-color:var(--ec-form-control-border-color-invalid)}: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:hover:not(:disabled):not(:focus){border-color:var(--ec-form-control-border-color-hover)}:host .textbox-group{display:flex;position:relative}:host textarea:focus,:host input:focus,:host select:focus{outline:2px solid transparent;outline-offset:2px}:host textarea:focus-visible,:host input:focus-visible,:host select:focus-visible{outline-color:var(--ec-border-color-focus)}:host .sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}: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;-moz-appearance:none;appearance:none}: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{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 .5rem;height:2rem}: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)}:host select.ng-invalid.ng-touched:focus{border-color:var(--ec-form-control-background-color-invalid)}:host select.ng-invalid.ng-touched:hover:not(:disabled):not(:focus){border-color:var(--ec-form-control-border-color-hover)}:host select.ng-invalid.ng-touched{background-image:none;background-repeat:no-repeat;background-position:.5rem center;background-size:1rem,1rem;padding-left:1.75rem}: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);outline:2px solid transparent;outline-offset:2px;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:hover:not(:disabled):not(:focus){border-color:var(--ec-form-control-border-color-hover)}:host select.is-uppercase:not(.is-empty){text-transform:uppercase}:host select{padding-right:1.5rem}: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"]
|
|
10654
|
+
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)}: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:hover:not(:disabled):not(:focus),:host .control.invalid .textbox-group-input ::ng-deep .control input.ng-valid:hover:not(:disabled):not(:focus){border-color:var(--ec-form-control-border-color-hover)}: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-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~.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:not(:focus){border-color:var(--ec-form-control-border-color-invalid)}: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:hover:not(:disabled):not(:focus){border-color:var(--ec-form-control-border-color-hover)}:host .textbox-group{display:flex;position:relative}:host textarea:focus,:host input:focus,:host select:focus{outline:2px solid transparent;outline-offset:2px}:host textarea:focus-visible,:host input:focus-visible,:host select:focus-visible{outline-color:var(--ec-border-color-focus)}:host .sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}: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;-moz-appearance:none;appearance:none}: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{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;color:inherit;width:100%;line-height:1.25rem;padding:.3125rem .5rem;height:2rem}: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)}:host select.ng-invalid.ng-touched:focus{border-color:var(--ec-form-control-background-color-invalid)}:host select.ng-invalid.ng-touched:hover:not(:disabled):not(:focus){border-color:var(--ec-form-control-border-color-hover)}:host select.ng-invalid.ng-touched{background-image:none;background-repeat:no-repeat;background-position:.5rem center;background-size:1rem,1rem;padding-left:1.75rem}: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);outline:2px solid transparent;outline-offset:2px;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:hover:not(:disabled):not(:focus){border-color:var(--ec-form-control-border-color-hover)}:host select.is-uppercase:not(.is-empty){text-transform:uppercase}:host select{padding-right:1.5rem}: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"]
|
|
10643
10655
|
}]
|
|
10644
10656
|
}],
|
|
10645
10657
|
ctorParameters: () => [
|
|
@@ -10653,6 +10665,149 @@ i0.ɵɵngDeclareClassMetadata({
|
|
|
10653
10665
|
autoDefault: [{ type: Input }]
|
|
10654
10666
|
}
|
|
10655
10667
|
});
|
|
10668
|
+
const THEME_STORAGE_KEY = "ec-theme";
|
|
10669
|
+
const THEME_ATTRIBUTE = "data-theme";
|
|
10670
|
+
var ThemeService = class ThemeService {
|
|
10671
|
+
constructor(cacheService) {
|
|
10672
|
+
this.cacheService = cacheService;
|
|
10673
|
+
this.themeSubject = new BehaviorSubject("light");
|
|
10674
|
+
this.theme$ = this.themeSubject.asObservable();
|
|
10675
|
+
}
|
|
10676
|
+
get currentTheme() {
|
|
10677
|
+
return this.themeSubject.value;
|
|
10678
|
+
}
|
|
10679
|
+
init() {
|
|
10680
|
+
this.setTheme(this.getStoredTheme(), false);
|
|
10681
|
+
}
|
|
10682
|
+
toggle() {
|
|
10683
|
+
this.setTheme(this.currentTheme === "dark" ? "light" : "dark");
|
|
10684
|
+
}
|
|
10685
|
+
setTheme(theme, persist = true) {
|
|
10686
|
+
this.applyTheme(theme);
|
|
10687
|
+
if (persist) this.cacheService.setItem(THEME_STORAGE_KEY, { theme });
|
|
10688
|
+
if (theme !== this.themeSubject.value) this.themeSubject.next(theme);
|
|
10689
|
+
}
|
|
10690
|
+
applyTheme(theme) {
|
|
10691
|
+
const root = document.documentElement;
|
|
10692
|
+
if (theme === "light") root.removeAttribute(THEME_ATTRIBUTE);
|
|
10693
|
+
else root.setAttribute(THEME_ATTRIBUTE, theme);
|
|
10694
|
+
}
|
|
10695
|
+
getStoredTheme() {
|
|
10696
|
+
try {
|
|
10697
|
+
return this.cacheService.getItem(THEME_STORAGE_KEY)?.theme === "dark" ? "dark" : "light";
|
|
10698
|
+
} catch {
|
|
10699
|
+
return "light";
|
|
10700
|
+
}
|
|
10701
|
+
}
|
|
10702
|
+
static {
|
|
10703
|
+
this.ɵfac = i0.ɵɵngDeclareFactory({
|
|
10704
|
+
minVersion: "12.0.0",
|
|
10705
|
+
version: "22.2.0",
|
|
10706
|
+
ngImport: i0,
|
|
10707
|
+
type: ThemeService,
|
|
10708
|
+
deps: [{ token: CacheService }],
|
|
10709
|
+
target: i0.ɵɵFactoryTarget.Injectable
|
|
10710
|
+
});
|
|
10711
|
+
}
|
|
10712
|
+
static {
|
|
10713
|
+
this.ɵprov = i0.ɵɵngDeclareInjectable({
|
|
10714
|
+
minVersion: "12.0.0",
|
|
10715
|
+
version: "22.2.0",
|
|
10716
|
+
ngImport: i0,
|
|
10717
|
+
type: ThemeService,
|
|
10718
|
+
providedIn: "root"
|
|
10719
|
+
});
|
|
10720
|
+
}
|
|
10721
|
+
};
|
|
10722
|
+
i0.ɵɵngDeclareClassMetadata({
|
|
10723
|
+
minVersion: "12.0.0",
|
|
10724
|
+
version: "22.2.0",
|
|
10725
|
+
ngImport: i0,
|
|
10726
|
+
type: ThemeService,
|
|
10727
|
+
decorators: [{
|
|
10728
|
+
type: Injectable,
|
|
10729
|
+
args: [{ providedIn: "root" }]
|
|
10730
|
+
}],
|
|
10731
|
+
ctorParameters: () => [{ type: CacheService }]
|
|
10732
|
+
});
|
|
10733
|
+
var ThemeToggleComponent = class ThemeToggleComponent {
|
|
10734
|
+
constructor(themeService) {
|
|
10735
|
+
this.themeService = themeService;
|
|
10736
|
+
this.viewModel$ = this.themeService.theme$.pipe(map((theme) => ({
|
|
10737
|
+
icon: theme === "dark" ? "icon-moon" : "icon-sun-bright",
|
|
10738
|
+
ariaLabel: theme === "dark" ? "Switch to light mode" : "Switch to dark mode",
|
|
10739
|
+
ariaPressed: theme === "dark"
|
|
10740
|
+
})));
|
|
10741
|
+
}
|
|
10742
|
+
static {
|
|
10743
|
+
this.ɵfac = i0.ɵɵngDeclareFactory({
|
|
10744
|
+
minVersion: "12.0.0",
|
|
10745
|
+
version: "22.2.0",
|
|
10746
|
+
ngImport: i0,
|
|
10747
|
+
type: ThemeToggleComponent,
|
|
10748
|
+
deps: [{ token: ThemeService }],
|
|
10749
|
+
target: i0.ɵɵFactoryTarget.Component
|
|
10750
|
+
});
|
|
10751
|
+
}
|
|
10752
|
+
static {
|
|
10753
|
+
this.ɵcmp = i0.ɵɵngDeclareComponent({
|
|
10754
|
+
minVersion: "17.0.0",
|
|
10755
|
+
version: "22.2.0",
|
|
10756
|
+
type: ThemeToggleComponent,
|
|
10757
|
+
isStandalone: false,
|
|
10758
|
+
selector: "ec-theme-toggle",
|
|
10759
|
+
ngImport: i0,
|
|
10760
|
+
template: "@if (viewModel$ | async; as viewModel) {\n <ec-button\n type=\"icon\"\n [icon]=\"viewModel.icon\"\n [ariaLabel]=\"viewModel.ariaLabel\"\n [ariaPressed]=\"viewModel.ariaPressed\"\n (clicked)=\"themeService.toggle()\">\n </ec-button>\n}\n",
|
|
10761
|
+
dependencies: [{
|
|
10762
|
+
kind: "component",
|
|
10763
|
+
type: ButtonComponent,
|
|
10764
|
+
selector: "ec-button",
|
|
10765
|
+
inputs: [
|
|
10766
|
+
"id",
|
|
10767
|
+
"disabled",
|
|
10768
|
+
"lockButton",
|
|
10769
|
+
"icon",
|
|
10770
|
+
"iconColor",
|
|
10771
|
+
"label",
|
|
10772
|
+
"ariaLabel",
|
|
10773
|
+
"ariaPressed",
|
|
10774
|
+
"ariaExpanded",
|
|
10775
|
+
"ariaHaspopup",
|
|
10776
|
+
"ariaActivedescendant",
|
|
10777
|
+
"ariaControls",
|
|
10778
|
+
"badge",
|
|
10779
|
+
"tabindex",
|
|
10780
|
+
"type",
|
|
10781
|
+
"pending",
|
|
10782
|
+
"pendingIcon",
|
|
10783
|
+
"customTemplate",
|
|
10784
|
+
"isSubmit",
|
|
10785
|
+
"autofocus"
|
|
10786
|
+
],
|
|
10787
|
+
outputs: ["clicked"]
|
|
10788
|
+
}, {
|
|
10789
|
+
kind: "pipe",
|
|
10790
|
+
type: i1$3.AsyncPipe,
|
|
10791
|
+
name: "async"
|
|
10792
|
+
}]
|
|
10793
|
+
});
|
|
10794
|
+
}
|
|
10795
|
+
};
|
|
10796
|
+
i0.ɵɵngDeclareClassMetadata({
|
|
10797
|
+
minVersion: "12.0.0",
|
|
10798
|
+
version: "22.2.0",
|
|
10799
|
+
ngImport: i0,
|
|
10800
|
+
type: ThemeToggleComponent,
|
|
10801
|
+
decorators: [{
|
|
10802
|
+
type: Component,
|
|
10803
|
+
args: [{
|
|
10804
|
+
selector: "ec-theme-toggle",
|
|
10805
|
+
standalone: false,
|
|
10806
|
+
template: "@if (viewModel$ | async; as viewModel) {\n <ec-button\n type=\"icon\"\n [icon]=\"viewModel.icon\"\n [ariaLabel]=\"viewModel.ariaLabel\"\n [ariaPressed]=\"viewModel.ariaPressed\"\n (clicked)=\"themeService.toggle()\">\n </ec-button>\n}\n"
|
|
10807
|
+
}]
|
|
10808
|
+
}],
|
|
10809
|
+
ctorParameters: () => [{ type: ThemeService }]
|
|
10810
|
+
});
|
|
10656
10811
|
var AvatarService = class AvatarService {
|
|
10657
10812
|
getAvatarLabels(user) {
|
|
10658
10813
|
let full = void 0;
|
|
@@ -10848,13 +11003,14 @@ var AppBarComponent = class AppBarComponent {
|
|
|
10848
11003
|
userMenuMinWidth: "userMenuMinWidth",
|
|
10849
11004
|
userMenuTabindex: "userMenuTabindex",
|
|
10850
11005
|
iconPath: "iconPath",
|
|
11006
|
+
darkIconPath: "darkIconPath",
|
|
10851
11007
|
iconLink: "iconLink",
|
|
10852
11008
|
hideAppIcon: "hideAppIcon"
|
|
10853
11009
|
},
|
|
10854
11010
|
usesOnChanges: true,
|
|
10855
11011
|
ngImport: i0,
|
|
10856
|
-
template: "<section class=\"logo-container\">\n @if(!hideAppIcon) {\n
|
|
10857
|
-
styles: [":host{display:flex;height:3rem;align-items:center;width:100%;padding:0 .75rem 0 1rem;background-color:var(--ec-background-color);position:relative;z-index:var(--ec-z-index-navbar)}:host ::ng-deep .app-bar-actions{display:flex;align-items:center;justify-content:flex-end;margin-right:.25rem}section{flex:1 1}.logo-container img{width:2rem;height:2rem}.app-bar-icon-link{display:flex;align-items:center}.title-container{text-align:center}.actions-container{display:flex;justify-content:flex-end}#AppBarUserMenu ::ng-deep ec-button{--ec-border-radius: 50%}#AppBarUserMenu ::ng-deep ec-button.active>.ec-button-custom{background-color:transparent;border-color:var(--ec-color-primary-light)}#AppBarUserMenu ::ng-deep ec-button .ec-button-custom:focus{background-color:var(--ec-background-color)}\n"],
|
|
11012
|
+
template: "<section class=\"logo-container\">\n @if(!hideAppIcon) {\n <ng-template #appIcon>\n <span class=\"app-bar-icon\" [class.has-dark-icon]=\"darkIconPath\">\n <img class=\"app-bar-icon-light\" [src]=\"iconPath\" alt=\"EnergyCAP Platform\">\n @if (darkIconPath) {\n <img class=\"app-bar-icon-dark\" [src]=\"darkIconPath\" alt=\"EnergyCAP Platform\">\n }\n </span>\n </ng-template>\n @if(iconLink) {\n <a [routerLink]=\"iconLink\" class=\"app-bar-icon-link\">\n <ng-container *ngTemplateOutlet=\"appIcon\"></ng-container>\n </a>\n } @else {\n <ng-container *ngTemplateOutlet=\"appIcon\"></ng-container>\n }\n }\n <ng-content select=\".app-bar-logo\"></ng-content>\n</section>\n\n<section class=\"title-container\">\n <ng-content select=\".app-bar-title\"></ng-content>\n</section>\n\n<section class=\"actions-container\">\n <ng-content select=\".app-bar-actions\"></ng-content>\n <ng-template #avatar>\n <ec-avatar [user]=\"user\"></ec-avatar>\n </ng-template>\n @if (userMenuItems.length) {\n <ec-dropdown id=\"AppBarUserMenu\"\n [items]=\"menuItems\"\n [buttonCustomTemplate]=\"avatar\"\n [showArrow]=\"false\"\n [menuWidth]=\"userMenuWidth\"\n [menuMinWidth]=\"userMenuMinWidth\"\n [tabindex]=\"userMenuTabindex\"></ec-dropdown>\n } @else {\n <ng-container *ngTemplateOutlet=\"avatar\"></ng-container>\n }\n</section>\n\n",
|
|
11013
|
+
styles: [":host{display:flex;height:3rem;align-items:center;width:100%;padding:0 .75rem 0 1rem;background-color:var(--ec-background-color);position:relative;z-index:var(--ec-z-index-navbar)}:host ::ng-deep .app-bar-actions{display:flex;align-items:center;justify-content:flex-end;margin-right:.25rem}section{flex:1 1}.app-bar-icon{display:inline-block}.app-bar-icon img{width:2rem;height:2rem}.app-bar-icon-dark{display:none}:host-context(:root[data-theme=dark]) .app-bar-icon.has-dark-icon .app-bar-icon-light{display:none}:host-context(:root[data-theme=dark]) .app-bar-icon.has-dark-icon .app-bar-icon-dark{display:block}.logo-container img{width:2rem;height:2rem}.app-bar-icon-link{display:flex;align-items:center}.title-container{text-align:center}.actions-container{display:flex;justify-content:flex-end}#AppBarUserMenu ::ng-deep ec-button{--ec-border-radius: 50%}#AppBarUserMenu ::ng-deep ec-button.active>.ec-button-custom{background-color:transparent;border-color:var(--ec-color-primary-light)}#AppBarUserMenu ::ng-deep ec-button .ec-button-custom:focus{background-color:var(--ec-background-color)}\n"],
|
|
10858
11014
|
dependencies: [
|
|
10859
11015
|
{
|
|
10860
11016
|
kind: "directive",
|
|
@@ -10938,8 +11094,8 @@ i0.ɵɵngDeclareClassMetadata({
|
|
|
10938
11094
|
selector: "ec-app-bar",
|
|
10939
11095
|
changeDetection: ChangeDetectionStrategy.Eager,
|
|
10940
11096
|
standalone: false,
|
|
10941
|
-
template: "<section class=\"logo-container\">\n @if(!hideAppIcon) {\n
|
|
10942
|
-
styles: [":host{display:flex;height:3rem;align-items:center;width:100%;padding:0 .75rem 0 1rem;background-color:var(--ec-background-color);position:relative;z-index:var(--ec-z-index-navbar)}:host ::ng-deep .app-bar-actions{display:flex;align-items:center;justify-content:flex-end;margin-right:.25rem}section{flex:1 1}.logo-container img{width:2rem;height:2rem}.app-bar-icon-link{display:flex;align-items:center}.title-container{text-align:center}.actions-container{display:flex;justify-content:flex-end}#AppBarUserMenu ::ng-deep ec-button{--ec-border-radius: 50%}#AppBarUserMenu ::ng-deep ec-button.active>.ec-button-custom{background-color:transparent;border-color:var(--ec-color-primary-light)}#AppBarUserMenu ::ng-deep ec-button .ec-button-custom:focus{background-color:var(--ec-background-color)}\n"]
|
|
11097
|
+
template: "<section class=\"logo-container\">\n @if(!hideAppIcon) {\n <ng-template #appIcon>\n <span class=\"app-bar-icon\" [class.has-dark-icon]=\"darkIconPath\">\n <img class=\"app-bar-icon-light\" [src]=\"iconPath\" alt=\"EnergyCAP Platform\">\n @if (darkIconPath) {\n <img class=\"app-bar-icon-dark\" [src]=\"darkIconPath\" alt=\"EnergyCAP Platform\">\n }\n </span>\n </ng-template>\n @if(iconLink) {\n <a [routerLink]=\"iconLink\" class=\"app-bar-icon-link\">\n <ng-container *ngTemplateOutlet=\"appIcon\"></ng-container>\n </a>\n } @else {\n <ng-container *ngTemplateOutlet=\"appIcon\"></ng-container>\n }\n }\n <ng-content select=\".app-bar-logo\"></ng-content>\n</section>\n\n<section class=\"title-container\">\n <ng-content select=\".app-bar-title\"></ng-content>\n</section>\n\n<section class=\"actions-container\">\n <ng-content select=\".app-bar-actions\"></ng-content>\n <ng-template #avatar>\n <ec-avatar [user]=\"user\"></ec-avatar>\n </ng-template>\n @if (userMenuItems.length) {\n <ec-dropdown id=\"AppBarUserMenu\"\n [items]=\"menuItems\"\n [buttonCustomTemplate]=\"avatar\"\n [showArrow]=\"false\"\n [menuWidth]=\"userMenuWidth\"\n [menuMinWidth]=\"userMenuMinWidth\"\n [tabindex]=\"userMenuTabindex\"></ec-dropdown>\n } @else {\n <ng-container *ngTemplateOutlet=\"avatar\"></ng-container>\n }\n</section>\n\n",
|
|
11098
|
+
styles: [":host{display:flex;height:3rem;align-items:center;width:100%;padding:0 .75rem 0 1rem;background-color:var(--ec-background-color);position:relative;z-index:var(--ec-z-index-navbar)}:host ::ng-deep .app-bar-actions{display:flex;align-items:center;justify-content:flex-end;margin-right:.25rem}section{flex:1 1}.app-bar-icon{display:inline-block}.app-bar-icon img{width:2rem;height:2rem}.app-bar-icon-dark{display:none}:host-context(:root[data-theme=dark]) .app-bar-icon.has-dark-icon .app-bar-icon-light{display:none}:host-context(:root[data-theme=dark]) .app-bar-icon.has-dark-icon .app-bar-icon-dark{display:block}.logo-container img{width:2rem;height:2rem}.app-bar-icon-link{display:flex;align-items:center}.title-container{text-align:center}.actions-container{display:flex;justify-content:flex-end}#AppBarUserMenu ::ng-deep ec-button{--ec-border-radius: 50%}#AppBarUserMenu ::ng-deep ec-button.active>.ec-button-custom{background-color:transparent;border-color:var(--ec-color-primary-light)}#AppBarUserMenu ::ng-deep ec-button .ec-button-custom:focus{background-color:var(--ec-background-color)}\n"]
|
|
10943
11099
|
}]
|
|
10944
11100
|
}],
|
|
10945
11101
|
ctorParameters: () => [{ type: AvatarService }],
|
|
@@ -10950,6 +11106,7 @@ i0.ɵɵngDeclareClassMetadata({
|
|
|
10950
11106
|
userMenuMinWidth: [{ type: Input }],
|
|
10951
11107
|
userMenuTabindex: [{ type: Input }],
|
|
10952
11108
|
iconPath: [{ type: Input }],
|
|
11109
|
+
darkIconPath: [{ type: Input }],
|
|
10953
11110
|
iconLink: [{ type: Input }],
|
|
10954
11111
|
hideAppIcon: [{ type: Input }]
|
|
10955
11112
|
}
|
|
@@ -11105,6 +11262,7 @@ var ConfirmComponent = class ConfirmComponent {
|
|
|
11105
11262
|
"iconColor",
|
|
11106
11263
|
"label",
|
|
11107
11264
|
"ariaLabel",
|
|
11265
|
+
"ariaPressed",
|
|
11108
11266
|
"ariaExpanded",
|
|
11109
11267
|
"ariaHaspopup",
|
|
11110
11268
|
"ariaActivedescendant",
|
|
@@ -12162,6 +12320,7 @@ var JsonDisplayComponent = class JsonDisplayComponent {
|
|
|
12162
12320
|
"iconColor",
|
|
12163
12321
|
"label",
|
|
12164
12322
|
"ariaLabel",
|
|
12323
|
+
"ariaPressed",
|
|
12165
12324
|
"ariaExpanded",
|
|
12166
12325
|
"ariaHaspopup",
|
|
12167
12326
|
"ariaActivedescendant",
|
|
@@ -13788,6 +13947,7 @@ var PageViewComponent = class PageViewComponent {
|
|
|
13788
13947
|
"iconColor",
|
|
13789
13948
|
"label",
|
|
13790
13949
|
"ariaLabel",
|
|
13950
|
+
"ariaPressed",
|
|
13791
13951
|
"ariaExpanded",
|
|
13792
13952
|
"ariaHaspopup",
|
|
13793
13953
|
"ariaActivedescendant",
|
|
@@ -14284,6 +14444,7 @@ var WizardButtonsComponent = class WizardButtonsComponent {
|
|
|
14284
14444
|
"iconColor",
|
|
14285
14445
|
"label",
|
|
14286
14446
|
"ariaLabel",
|
|
14447
|
+
"ariaPressed",
|
|
14287
14448
|
"ariaExpanded",
|
|
14288
14449
|
"ariaHaspopup",
|
|
14289
14450
|
"ariaActivedescendant",
|
|
@@ -14490,7 +14651,8 @@ var ComponentsModule = class ComponentsModule {
|
|
|
14490
14651
|
KeyboardNavContainerDirective,
|
|
14491
14652
|
DateDisplayPipe2,
|
|
14492
14653
|
DateDisplayPipe3,
|
|
14493
|
-
MultiselectComponent
|
|
14654
|
+
MultiselectComponent,
|
|
14655
|
+
ThemeToggleComponent
|
|
14494
14656
|
],
|
|
14495
14657
|
imports: [
|
|
14496
14658
|
CommonModule,
|
|
@@ -14569,6 +14731,7 @@ var ComponentsModule = class ComponentsModule {
|
|
|
14569
14731
|
DateInputComponent,
|
|
14570
14732
|
KeyboardNavContainerDirective,
|
|
14571
14733
|
DateDisplayPipe2,
|
|
14734
|
+
ThemeToggleComponent,
|
|
14572
14735
|
DateDisplayPipe3
|
|
14573
14736
|
]
|
|
14574
14737
|
});
|
|
@@ -14686,7 +14849,8 @@ i0.ɵɵngDeclareClassMetadata({
|
|
|
14686
14849
|
KeyboardNavContainerDirective,
|
|
14687
14850
|
DateDisplayPipe2,
|
|
14688
14851
|
DateDisplayPipe3,
|
|
14689
|
-
MultiselectComponent
|
|
14852
|
+
MultiselectComponent,
|
|
14853
|
+
ThemeToggleComponent
|
|
14690
14854
|
],
|
|
14691
14855
|
imports: [
|
|
14692
14856
|
CommonModule,
|
|
@@ -14777,6 +14941,7 @@ i0.ɵɵngDeclareClassMetadata({
|
|
|
14777
14941
|
DateInputComponent,
|
|
14778
14942
|
KeyboardNavContainerDirective,
|
|
14779
14943
|
DateDisplayPipe2,
|
|
14944
|
+
ThemeToggleComponent,
|
|
14780
14945
|
DateDisplayPipe3
|
|
14781
14946
|
]
|
|
14782
14947
|
}]
|
|
@@ -15482,6 +15647,6 @@ i0.ɵɵngDeclareClassMetadata({
|
|
|
15482
15647
|
decorators: [{ type: Directive }],
|
|
15483
15648
|
ctorParameters: () => [{ type: i0.Injector }]
|
|
15484
15649
|
});
|
|
15485
|
-
export { AppBarComponent, AvatarComponent, BannerComponent, ButtonComponent, CacheService, CalendarComponent, CheckboxComponent, ClickAreaForDirective, CollapsibleToggleComponent, ComboboxComponent, ComponentsModule, ConfirmComponent, ConfirmDialogContext, CopyButtonBaseTestInjectorFactory, CopyButtonDirective, CopyTableButtonDirective, CustomValidators, DateDisplayPipe, DateDisplayPipe2, DateDisplayPipe3, DateInput, DateInputComponent, DateTimeHelper, DialogCloseDuration, DialogCloseEvent, DialogCloseLatestEvent, DialogComponent, DialogEvent, DialogGroupComponent, DialogOpenDuration, DialogOpenEndEvent, DialogOpenStartEvent, DialogResult, DialogService, DropdownComponent, ErrorService, FileTypeExtensions, FileUploadComponent, FormControlBase, FormControlComponent, FormControlLabelComponent, FormGroupComponent, FormGroupHelper, HelpPopoverComponent, HierarchyBase, HierarchyBaseTestInjectorFactory, HierarchyItem, HierarchyMocks, HierarchyTreeComponent, HighlightTextPipe, IfViewportWidthDirective, ItemDisplayComponent, ItemPickerComponent, ItemPickerSelectableContext, JsonDisplayComponent, JsonHelper, KeyboardNavContainerDirective, LinkButtonComponent, MenuComponent, MockActivatedRoute, MockDateDisplayPipe, MockDialog, MockDialogContent, MockTranslateService, MockTranslationHelperService, MultiselectComponent, NavGroup, NavItemActiveDirective, NumericboxComponent, Overlay, PageBaseComponent, PageBaseComponentTestHelper, PageBaseComponentTestInjectorFactory, PageInitResult, PageStatus, PageStatuses, PageTitleComponent, PageViewComponent, PanelCloseDuration, PanelOpenDuration, PopoverComponent, PopupContainerDirective, RadioButtonComponent, RadioButtonOption, RelativeDatePipe, ResizableBase, ResizableColumnComponent, ResizableComponent, RouterHelper, RowCountPipe, ScrollService, SearchableTableComponent, SelectComponent, SpinnerComponent, SplashComponent, SplashService, SpyFactory, TableComponent, TableLockedColumnComponent, TableMasterHeaderRowComponent, TableMasterRowComponent, TablePaginationComponent, TableSelectableRowComponent, TableSelectableRowContext, TabsComponent, Tag, TagsComponent, TelemetryService, TelemetryTrackerService, TextboxComponent, TimeDisplayPipe, ToastComponent, ToastEvent, ToastService, ToasterComponent, TooltipComponent, TooltipDirective, TooltipService, TreeComponent, UnicodeStrings, UserPreferenceService, ValidationMessageService, ViewOverlayComponent, WindowService, WizardBaseComponent, WizardButtonsComponent, WizardProgressComponent, canadianPostalCodeRegex, clickEvent, dateInputFormatRegex, domainPattern, findAllSpacesPattern, forEachFormControl, getApiError, getControlValue, getDecimalPattern, handleKeyNavigate, integerPattern, isApiError, menuAnimationSpeed, mockRouterFactory, mockRouterHelperFactory, numericboxValidation, orderByIgnoreCase, otherZipCodeRegex, phoneNumberValidationPattern, sortByIgnoreCase, textboxValidation, unitedStatesZipCodeRegex, urlValidationPattern, validateFormGroupValuesAreUnique };
|
|
15650
|
+
export { AppBarComponent, AvatarComponent, BannerComponent, ButtonComponent, CacheService, CalendarComponent, CheckboxComponent, ClickAreaForDirective, CollapsibleToggleComponent, ComboboxComponent, ComponentsModule, ConfirmComponent, ConfirmDialogContext, CopyButtonBaseTestInjectorFactory, CopyButtonDirective, CopyTableButtonDirective, CustomValidators, DateDisplayPipe, DateDisplayPipe2, DateDisplayPipe3, DateInput, DateInputComponent, DateTimeHelper, DialogCloseDuration, DialogCloseEvent, DialogCloseLatestEvent, DialogComponent, DialogEvent, DialogGroupComponent, DialogOpenDuration, DialogOpenEndEvent, DialogOpenStartEvent, DialogResult, DialogService, DropdownComponent, ErrorService, FileTypeExtensions, FileUploadComponent, FormControlBase, FormControlComponent, FormControlLabelComponent, FormGroupComponent, FormGroupHelper, HelpPopoverComponent, HierarchyBase, HierarchyBaseTestInjectorFactory, HierarchyItem, HierarchyMocks, HierarchyTreeComponent, HighlightTextPipe, IfViewportWidthDirective, ItemDisplayComponent, ItemPickerComponent, ItemPickerSelectableContext, JsonDisplayComponent, JsonHelper, KeyboardNavContainerDirective, LinkButtonComponent, MenuComponent, MockActivatedRoute, MockDateDisplayPipe, MockDialog, MockDialogContent, MockTranslateService, MockTranslationHelperService, MultiselectComponent, NavGroup, NavItemActiveDirective, NumericboxComponent, Overlay, PageBaseComponent, PageBaseComponentTestHelper, PageBaseComponentTestInjectorFactory, PageInitResult, PageStatus, PageStatuses, PageTitleComponent, PageViewComponent, PanelCloseDuration, PanelOpenDuration, PopoverComponent, PopupContainerDirective, RadioButtonComponent, RadioButtonOption, RelativeDatePipe, ResizableBase, ResizableColumnComponent, ResizableComponent, RouterHelper, RowCountPipe, ScrollService, SearchableTableComponent, SelectComponent, SpinnerComponent, SplashComponent, SplashService, SpyFactory, THEME_STORAGE_KEY, TableComponent, TableLockedColumnComponent, TableMasterHeaderRowComponent, TableMasterRowComponent, TablePaginationComponent, TableSelectableRowComponent, TableSelectableRowContext, TabsComponent, Tag, TagsComponent, TelemetryService, TelemetryTrackerService, TextboxComponent, ThemeService, ThemeToggleComponent, TimeDisplayPipe, ToastComponent, ToastEvent, ToastService, ToasterComponent, TooltipComponent, TooltipDirective, TooltipService, TreeComponent, UnicodeStrings, UserPreferenceService, ValidationMessageService, ViewOverlayComponent, WindowService, WizardBaseComponent, WizardButtonsComponent, WizardProgressComponent, canadianPostalCodeRegex, clickEvent, dateInputFormatRegex, domainPattern, findAllSpacesPattern, forEachFormControl, getApiError, getControlValue, getDecimalPattern, handleKeyNavigate, integerPattern, isApiError, menuAnimationSpeed, mockRouterFactory, mockRouterHelperFactory, numericboxValidation, orderByIgnoreCase, otherZipCodeRegex, phoneNumberValidationPattern, sortByIgnoreCase, textboxValidation, unitedStatesZipCodeRegex, urlValidationPattern, validateFormGroupValuesAreUnique };
|
|
15486
15651
|
|
|
15487
15652
|
//# sourceMappingURL=energycap-components.mjs.map
|