@energycap/components 0.42.4-esbuild.20250131-1510 → 0.43.1-ECAP-28460-autofocus-issue.20250221-1452
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 +3 -3
- package/esm2022/lib/components.module.mjs +4 -4
- package/esm2022/lib/controls/banner/banner.component.mjs +3 -3
- package/esm2022/lib/controls/button/button.component.mjs +3 -3
- package/esm2022/lib/controls/button/copy-button-base.directive.mjs +3 -3
- package/esm2022/lib/controls/button/copy-button.directive.mjs +3 -3
- package/esm2022/lib/controls/button/copy-table-button.directive.mjs +3 -3
- package/esm2022/lib/controls/calendar/calendar-item.component.mjs +3 -3
- package/esm2022/lib/controls/calendar/calendar.component.mjs +3 -3
- package/esm2022/lib/controls/checkbox/checkbox.component.mjs +3 -3
- package/esm2022/lib/controls/collapsible-toggle/collapsible-toggle.component.mjs +3 -3
- package/esm2022/lib/controls/combobox/combobox.component.mjs +3 -3
- package/esm2022/lib/controls/date-input/date-input.component.mjs +3 -3
- package/esm2022/lib/controls/date-input/date-input.types.mjs +2 -2
- package/esm2022/lib/controls/dropdown/dropdown.component.mjs +3 -3
- package/esm2022/lib/controls/file-upload/file-upload.component.mjs +3 -3
- package/esm2022/lib/controls/form-control/form-control.component.mjs +3 -3
- package/esm2022/lib/controls/form-control-base.mjs +3 -3
- package/esm2022/lib/controls/form-control-label/form-control-label.component.mjs +3 -3
- package/esm2022/lib/controls/form-group/form-group.component.mjs +3 -3
- package/esm2022/lib/controls/help-popover/help-popover.component.mjs +3 -3
- package/esm2022/lib/controls/item-picker/item-picker.component.mjs +3 -3
- package/esm2022/lib/controls/link-button/link-button.component.mjs +3 -3
- package/esm2022/lib/controls/menu/menu.component.mjs +3 -3
- package/esm2022/lib/controls/navigation/nav-item-active.directive.mjs +3 -3
- package/esm2022/lib/controls/numericbox/numericbox.component.mjs +3 -3
- package/esm2022/lib/controls/popover/popover.component.mjs +3 -3
- package/esm2022/lib/controls/radio-button/radio-button.component.mjs +3 -3
- package/esm2022/lib/controls/select/select.component.mjs +3 -3
- package/esm2022/lib/controls/tabs/tabs.component.mjs +3 -3
- package/esm2022/lib/controls/textbox/textbox.component.mjs +3 -3
- package/esm2022/lib/core/cache.service.mjs +3 -3
- package/esm2022/lib/core/date-time-helper.mjs +1 -5
- package/esm2022/lib/core/error.service.mjs +3 -3
- package/esm2022/lib/core/router-helper.service.mjs +3 -3
- package/esm2022/lib/core/scroll.service.mjs +3 -3
- package/esm2022/lib/core/telemetry-tracker.service.mjs +3 -3
- package/esm2022/lib/core/telemetry.service.mjs +3 -3
- package/esm2022/lib/core/validation-message.service.mjs +3 -3
- package/esm2022/lib/core/window.service.mjs +3 -3
- package/esm2022/lib/display/app-bar/app-bar.component.mjs +3 -3
- package/esm2022/lib/display/avatar/avatar.component.mjs +3 -3
- package/esm2022/lib/display/avatar/avatar.service.mjs +3 -3
- package/esm2022/lib/display/confirm/confirm.component.mjs +3 -3
- package/esm2022/lib/display/dialog/dialog-content.mjs +1 -1
- package/esm2022/lib/display/dialog/dialog-group/dialog-group.component.mjs +3 -3
- package/esm2022/lib/display/dialog/dialog.component.mjs +11 -5
- package/esm2022/lib/display/dialog/dialog.service.mjs +3 -3
- package/esm2022/lib/display/hierarchy/hierarchy-base.mjs +3 -3
- package/esm2022/lib/display/hierarchy/hierarchy-tree/hierarchy-tree.component.mjs +3 -3
- package/esm2022/lib/display/item-display/item-display.component.mjs +3 -3
- package/esm2022/lib/display/json-display/json-display.component.mjs +3 -3
- package/esm2022/lib/display/resizable/resizable-base.mjs +3 -3
- package/esm2022/lib/display/resizable/resizable.component.mjs +3 -3
- package/esm2022/lib/display/spinner/spinner.component.mjs +3 -3
- package/esm2022/lib/display/splash/splash.component.mjs +3 -3
- package/esm2022/lib/display/splash/splash.service.mjs +3 -3
- package/esm2022/lib/display/table/resizable-column.component.mjs +3 -3
- package/esm2022/lib/display/table/resizable-table.directive.mjs +3 -3
- package/esm2022/lib/display/table/searchable-table.component.mjs +3 -3
- package/esm2022/lib/display/table/table-detail-row.component.mjs +3 -3
- package/esm2022/lib/display/table/table-locked-column.component.mjs +3 -3
- package/esm2022/lib/display/table/table-master-header-row.component.mjs +3 -3
- package/esm2022/lib/display/table/table-master-row.component.mjs +3 -3
- package/esm2022/lib/display/table/table-pagination.component.mjs +3 -3
- package/esm2022/lib/display/table/table-selectable-row.component.mjs +3 -3
- package/esm2022/lib/display/table/table.component.mjs +3 -3
- package/esm2022/lib/display/tags/tags.component.mjs +3 -3
- package/esm2022/lib/display/toast/toast/toast.component.mjs +3 -3
- package/esm2022/lib/display/toast/toast.service.mjs +3 -3
- package/esm2022/lib/display/toast/toaster/toaster.component.mjs +3 -3
- package/esm2022/lib/display/tooltip/tooltip.component.mjs +3 -3
- package/esm2022/lib/display/tooltip/tooltip.service.mjs +3 -3
- package/esm2022/lib/display/tooltip-directive/tooltip.directive.mjs +3 -3
- package/esm2022/lib/display/tour/tour.component.mjs +3 -3
- package/esm2022/lib/display/tour/tour.service.mjs +3 -3
- package/esm2022/lib/display/tree/tree.component.mjs +3 -3
- package/esm2022/lib/display/view-overlay/view-overlay.component.mjs +3 -3
- package/esm2022/lib/shared/directives/click-area-for/click-area-for.directive.mjs +3 -3
- package/esm2022/lib/shared/directives/if-viewport-width/if-viewport-width.directive.mjs +3 -3
- package/esm2022/lib/shared/directives/keyboard-nav-container/keyboard-nav-container.directive.mjs +3 -3
- package/esm2022/lib/shared/directives/popup/popup-container.directive.mjs +3 -3
- package/esm2022/lib/shared/display/pipes/date-display.pipe.mjs +3 -3
- package/esm2022/lib/shared/display/pipes/highlight-text.pipe.mjs +3 -3
- package/esm2022/lib/shared/display/pipes/relative-date.pipe.mjs +3 -3
- package/esm2022/lib/shared/display/pipes/row-count.pipe.mjs +3 -3
- package/esm2022/lib/shared/display/pipes/time-display.pipe.mjs +3 -3
- package/esm2022/lib/shared/form-group.helper.mjs +3 -3
- package/esm2022/lib/shared/page/page-base/page-base.component.mjs +3 -3
- package/esm2022/lib/shared/page/page-title/page-title.component.mjs +3 -3
- package/esm2022/lib/shared/page/page-view/page-view.component.mjs +3 -3
- package/esm2022/lib/shared/testing/public-mocks.spec.mjs +9 -9
- package/esm2022/lib/shared/user-preference.service.mjs +3 -3
- package/esm2022/lib/shared/wizard/wizard-base/wizard-base.component.mjs +3 -3
- package/esm2022/lib/shared/wizard/wizard-buttons/wizard-buttons.component.mjs +3 -3
- package/esm2022/lib/shared/wizard/wizard-progress/wizard-progress.component.mjs +3 -3
- package/fesm2022/energycap-components.mjs +292 -290
- package/fesm2022/energycap-components.mjs.map +1 -1
- package/lib/core/date-time-helper.d.ts +2 -2
- package/lib/display/dialog/dialog-content.d.ts +1 -0
- package/lib/display/dialog/dialog.component.d.ts +4 -0
- package/package.json +6 -6
- package/schematics/collection.json +0 -5
- package/schematics/utilities/typescript.d.ts +1 -1
- package/schematics/utilities/typescript.js +9 -12
- package/schematics/utilities/typescript.js.map +1 -1
- package/src/assets/images/favicon-ech.svg +12 -5
- package/src/assets/images/favicon-eum.svg +11 -4
- package/src/assets/images/favicon.svg +10 -3
- package/src/assets/images/icon-ucp.svg +10 -3
- package/src/assets/images/icon.svg +9 -2
- package/src/assets/images/logo.svg +8 -1
- package/schematics/rxjs-7-upgrade/index.d.ts +0 -3
- package/schematics/rxjs-7-upgrade/index.js +0 -71
- package/schematics/rxjs-7-upgrade/index.js.map +0 -1
- package/schematics/rxjs-7-upgrade/schema.d.ts +0 -4
- package/schematics/rxjs-7-upgrade/schema.js +0 -3
- package/schematics/rxjs-7-upgrade/schema.js.map +0 -1
- package/schematics/rxjs-7-upgrade/schema.json +0 -14
|
@@ -426,10 +426,10 @@ export class DateInputComponent extends FormControlBase {
|
|
|
426
426
|
}
|
|
427
427
|
return null;
|
|
428
428
|
}
|
|
429
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
430
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: DateInputComponent, selector: "ec-date-input", inputs: { id: "id", formModel: "formModel", minDate: "minDate", maxDate: "maxDate", selectionMode: "selectionMode", selectionModeOptions: "selectionModeOptions", quickSelectDate: "quickSelectDate", enableSteppers: "enableSteppers" }, host: { properties: { "attr.id": "this.id" } }, providers: [DateInput.SelectionStrategies], viewQueries: [{ propertyName: "calendar", first: true, predicate: ["calendar"], descendants: true }, { propertyName: "controls", first: true, predicate: ["controls"], descendants: true }, { propertyName: "overlay", first: true, predicate: ["overlay"], descendants: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<label *ngIf=\"label\">\r\n <span>{{label | translate}}</span>\r\n <span *ngIf=\"validationErrors.length > 0 && formModel.touched && formModel.invalid\"> {{validationErrors}}</span>\r\n <ec-help-popover id=\"{{id}}_helpPopover\"\r\n *ngIf=\"helpPopover\"\r\n class=\"d-inline-block my-n3 mx-n1\"\r\n text=\"{{helpPopover | translate}}\"\r\n contentPosition=\"{{helpPopoverPosition}}\">\r\n </ec-help-popover>\r\n</label>\r\n\r\n<div class=\"d-flex align-items-center\"\r\n [ecKeyboardNavContainer]=\"isCalendarOpen\"\r\n #controls=\"ecKeyboardNavContainer\"\r\n (focusOutEnd)=\"onControlsFocusOutEnd()\">\r\n <ec-form-control id=\"{{id}}\"\r\n [required]=\"required\"\r\n [autofocus]=\"autofocus\"\r\n [pending]=\"pending\"\r\n [readonly]=\"readonly\"\r\n (actionClicked)=\"isCalendarOpen = !isCalendarOpen\"\r\n [showClear]=\"false\"\r\n actionIcon=\"icon-date\"\r\n cdkOverlayOrigin\r\n #overlayOrigin=\"cdkOverlayOrigin\"\r\n class=\"flex-grow\"\r\n style=\"height: 2rem;\">\r\n <input id=\"{{id}}_input\"\r\n type=\"text\"\r\n placeholder=\"{{placeholder}}\"\r\n [formControl]=\"textboxGroup.get('textbox')\"\r\n (blur)=\"onTextboxBlur()\">\r\n </ec-form-control>\r\n\r\n <ng-container *ngIf=\"selectionStrategy.showSecondaryTextbox\">\r\n <span class=\"flex-shrink mx-1\">–</span>\r\n <ec-form-control id=\"{{id}}_control2\"\r\n [required]=\"required\"\r\n [autofocus]=\"autofocus\"\r\n [pending]=\"pending\"\r\n [readonly]=\"readonly\"\r\n (actionClicked)=\"isCalendarOpen = !isCalendarOpen\"\r\n [showClear]=\"false\"\r\n actionIcon=\"icon-date\"\r\n class=\"flex-grow\"\r\n style=\"height: 2rem;\">\r\n <input id=\"{{id}}_input2\"\r\n type=\"text\"\r\n placeholder=\"{{placeholder}}\"\r\n [formControl]=\"textboxGroup.get('textbox2')\"\r\n (blur)=\"onTextbox2Blur()\">\r\n </ec-form-control>\r\n </ng-container>\r\n\r\n <div *ngIf=\"enableSteppers\"\r\n class=\"control-group ml-2\">\r\n <ec-button id=\"{{id}}_previousSelection\"\r\n type=\"secondary\"\r\n icon=\"icon-angle-down rotate-90\"\r\n (clicked)=\"previousSelection()\"\r\n [disabled]=\"isCalendarOpen || disableSteppers || formModel?.disabled\">\r\n </ec-button>\r\n <ec-button id=\"{{id}}_nextSelection\"\r\n type=\"secondary\"\r\n icon=\"icon-angle-down rotate-270\"\r\n (clicked)=\"nextSelection()\"\r\n [disabled]=\"isCalendarOpen || disableSteppers || formModel?.disabled\">\r\n </ec-button>\r\n </div>\r\n\r\n <ec-button *ngIf=\"quickSelectDate\"\r\n id=\"{{id}}_quickSelect\"\r\n icon=\"icon-day\"\r\n type=\"secondary\"\r\n title=\"{{'DateInput_LatestDataAvailableTitle' | translate}}\"\r\n (clicked)=\"goToQuickSelectDate()\"\r\n class=\"ml-2\">\r\n </ec-button>\r\n</div>\r\n\r\n<ng-template cdkConnectedOverlay\r\n #overlay=\"cdkConnectedOverlay\"\r\n [cdkConnectedOverlayOrigin]=\"overlayOrigin\"\r\n [cdkConnectedOverlayOpen]=\"isCalendarOpen\"\r\n [cdkConnectedOverlayScrollStrategy]=\"overlayScrollStrategy\"\r\n cdkConnectedOverlayPanelClass=\"my-1\"\r\n (overlayOutsideClick)=\"onOverlayOutsideClick($event)\"\r\n (detach)=\"isCalendarOpen = false\">\r\n <article id=\"{{id}}_datePicker\"\r\n class=\"card d-flex\"\r\n [ecKeyboardNavContainer]=\"isCalendarOpen\"\r\n #calendar=\"ecKeyboardNavContainer\"\r\n (focusOutStart)=\"onCalendarFocusOutStart()\"\r\n (focusOutEnd)=\"onCalendarFocusOutEnd()\">\r\n <ul *ngIf=\"selectionModeOptions.length > 1\"\r\n class=\"selection-mode-menu border-right p-1\">\r\n <li *ngFor=\"let option of selectionModeOptions\">\r\n <button id=\"{{id}}_selectionMode_{{option}}\"\r\n class=\"text-body-1\"\r\n [class.is-selected]=\"option === selectionMode\"\r\n (click)=\"onSelectionModeChange(option)\">\r\n {{'DateInputSelectionMode_' + option | translate}}\r\n </button>\r\n </li>\r\n </ul>\r\n\r\n <div>\r\n <div class=\"d-flex\">\r\n <ec-calendar id=\"{{id}}_calendar\"\r\n [view]=\"primaryCalendarView\"\r\n (viewChange)=\"onPrimaryCalendarViewChange($event)\"\r\n [selectionMode]=\"selectionMode\"\r\n [selection]=\"calendarSelection\"\r\n (dateSelected)=\"onCalendarDateSelected($event)\"\r\n [minDate]=\"minDate\"\r\n [maxDate]=\"selectionStrategy.showSecondaryCalendar ? primaryCalendarMaxDate : maxDate\">\r\n </ec-calendar>\r\n\r\n <ec-calendar *ngIf=\"selectionStrategy.showSecondaryCalendar\"\r\n id=\"{{id}}_secondaryCalendar\"\r\n [view]=\"secondaryCalendarView\"\r\n (viewChange)=\"onSecondaryCalendarViewChange($event)\"\r\n [selectionMode]=\"selectionMode\"\r\n [selection]=\"calendarSelection\"\r\n (dateSelected)=\"onCalendarDateSelected($event)\"\r\n [minDate]=\"secondaryCalendarMinDate\"\r\n [maxDate]=\"maxDate\">\r\n </ec-calendar>\r\n </div>\r\n\r\n <footer *ngIf=\"selectionStrategy.selectionViewMode === 'day'\"\r\n class=\"px-2 my-2 d-flex\">\r\n <button id=\"{{id}}_today_button\"\r\n ecLinkButton\r\n class=\"ml-auto d-inline-block\"\r\n (click)=\"goToToday()\"\r\n style=\"height: 1.75rem;\">\r\n {{'Today' | translate}}\r\n </button>\r\n </footer>\r\n </div>\r\n </article>\r\n</ng-template>\r\n", 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;background-color:transparent;width:100%;height:1.75rem}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:none;position:relative;z-index:1}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{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}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"], dependencies: [{ kind: "directive", type: i6.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i6.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i7.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i7.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i7.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i4.CdkConnectedOverlay, selector: "[cdk-connected-overlay], [connected-overlay], [cdkConnectedOverlay]", inputs: ["cdkConnectedOverlayOrigin", "cdkConnectedOverlayPositions", "cdkConnectedOverlayPositionStrategy", "cdkConnectedOverlayOffsetX", "cdkConnectedOverlayOffsetY", "cdkConnectedOverlayWidth", "cdkConnectedOverlayHeight", "cdkConnectedOverlayMinWidth", "cdkConnectedOverlayMinHeight", "cdkConnectedOverlayBackdropClass", "cdkConnectedOverlayPanelClass", "cdkConnectedOverlayViewportMargin", "cdkConnectedOverlayScrollStrategy", "cdkConnectedOverlayOpen", "cdkConnectedOverlayDisableClose", "cdkConnectedOverlayTransformOriginOn", "cdkConnectedOverlayHasBackdrop", "cdkConnectedOverlayLockPosition", "cdkConnectedOverlayFlexibleDimensions", "cdkConnectedOverlayGrowAfterOpen", "cdkConnectedOverlayPush", "cdkConnectedOverlayDisposeOnNavigation"], outputs: ["backdropClick", "positionChange", "attach", "detach", "overlayKeydown", "overlayOutsideClick"], exportAs: ["cdkConnectedOverlay"] }, { kind: "directive", type: i4.CdkOverlayOrigin, selector: "[cdk-overlay-origin], [overlay-origin], [cdkOverlayOrigin]", exportAs: ["cdkOverlayOrigin"] }, { kind: "component", type: i8.ButtonComponent, selector: "ec-button", inputs: ["id", "disabled", "icon", "label", "badge", "tabindex", "type", "pending", "pendingIcon", "customTemplate", "isSubmit", "autofocus"], outputs: ["clicked"] }, { kind: "component", type: i9.FormControlComponent, selector: "ec-form-control", inputs: ["id", "icon", "actionIcon", "showClear", "formModel", "autofocus", "pending", "required", "readonly"], outputs: ["actionClicked"] }, { kind: "component", type: i10.HelpPopoverComponent, selector: "ec-help-popover", inputs: ["id", "text", "contentPosition", "maxWidth"] }, { kind: "component", type: i11.LinkButtonComponent, selector: "button[ecLinkButton]" }, { kind: "component", type: i12.CalendarComponent, selector: "ec-calendar", inputs: ["id", "selection", "selectionMode", "minDate", "maxDate", "view"], outputs: ["dateSelected", "viewChange"] }, { kind: "directive", type: i13.KeyboardNavContainerDirective, selector: "[ecKeyboardNavContainer]", inputs: ["ecKeyboardNavContainer"], outputs: ["focusOutStart", "focusOutEnd"], exportAs: ["ecKeyboardNavContainer"] }, { kind: "pipe", type: i14.TranslatePipe, name: "translate" }] }); }
|
|
429
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: DateInputComponent, deps: [{ token: i1.ValidationMessageService }, { token: i2.FormGroupHelper }, { token: i3.UserPreferenceService }, { token: i0.ElementRef }, { token: i4.Overlay }, { token: i5.DateInput.SelectionStrategies }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
430
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: DateInputComponent, selector: "ec-date-input", inputs: { id: "id", formModel: "formModel", minDate: "minDate", maxDate: "maxDate", selectionMode: "selectionMode", selectionModeOptions: "selectionModeOptions", quickSelectDate: "quickSelectDate", enableSteppers: "enableSteppers" }, host: { properties: { "attr.id": "this.id" } }, providers: [DateInput.SelectionStrategies], viewQueries: [{ propertyName: "calendar", first: true, predicate: ["calendar"], descendants: true }, { propertyName: "controls", first: true, predicate: ["controls"], descendants: true }, { propertyName: "overlay", first: true, predicate: ["overlay"], descendants: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<label *ngIf=\"label\">\r\n <span>{{label | translate}}</span>\r\n <span *ngIf=\"validationErrors.length > 0 && formModel.touched && formModel.invalid\"> {{validationErrors}}</span>\r\n <ec-help-popover id=\"{{id}}_helpPopover\"\r\n *ngIf=\"helpPopover\"\r\n class=\"d-inline-block my-n3 mx-n1\"\r\n text=\"{{helpPopover | translate}}\"\r\n contentPosition=\"{{helpPopoverPosition}}\">\r\n </ec-help-popover>\r\n</label>\r\n\r\n<div class=\"d-flex align-items-center\"\r\n [ecKeyboardNavContainer]=\"isCalendarOpen\"\r\n #controls=\"ecKeyboardNavContainer\"\r\n (focusOutEnd)=\"onControlsFocusOutEnd()\">\r\n <ec-form-control id=\"{{id}}\"\r\n [required]=\"required\"\r\n [autofocus]=\"autofocus\"\r\n [pending]=\"pending\"\r\n [readonly]=\"readonly\"\r\n (actionClicked)=\"isCalendarOpen = !isCalendarOpen\"\r\n [showClear]=\"false\"\r\n actionIcon=\"icon-date\"\r\n cdkOverlayOrigin\r\n #overlayOrigin=\"cdkOverlayOrigin\"\r\n class=\"flex-grow\"\r\n style=\"height: 2rem;\">\r\n <input id=\"{{id}}_input\"\r\n type=\"text\"\r\n placeholder=\"{{placeholder}}\"\r\n [formControl]=\"textboxGroup.get('textbox')\"\r\n (blur)=\"onTextboxBlur()\">\r\n </ec-form-control>\r\n\r\n <ng-container *ngIf=\"selectionStrategy.showSecondaryTextbox\">\r\n <span class=\"flex-shrink mx-1\">–</span>\r\n <ec-form-control id=\"{{id}}_control2\"\r\n [required]=\"required\"\r\n [autofocus]=\"autofocus\"\r\n [pending]=\"pending\"\r\n [readonly]=\"readonly\"\r\n (actionClicked)=\"isCalendarOpen = !isCalendarOpen\"\r\n [showClear]=\"false\"\r\n actionIcon=\"icon-date\"\r\n class=\"flex-grow\"\r\n style=\"height: 2rem;\">\r\n <input id=\"{{id}}_input2\"\r\n type=\"text\"\r\n placeholder=\"{{placeholder}}\"\r\n [formControl]=\"textboxGroup.get('textbox2')\"\r\n (blur)=\"onTextbox2Blur()\">\r\n </ec-form-control>\r\n </ng-container>\r\n\r\n <div *ngIf=\"enableSteppers\"\r\n class=\"control-group ml-2\">\r\n <ec-button id=\"{{id}}_previousSelection\"\r\n type=\"secondary\"\r\n icon=\"icon-angle-down rotate-90\"\r\n (clicked)=\"previousSelection()\"\r\n [disabled]=\"isCalendarOpen || disableSteppers || formModel?.disabled\">\r\n </ec-button>\r\n <ec-button id=\"{{id}}_nextSelection\"\r\n type=\"secondary\"\r\n icon=\"icon-angle-down rotate-270\"\r\n (clicked)=\"nextSelection()\"\r\n [disabled]=\"isCalendarOpen || disableSteppers || formModel?.disabled\">\r\n </ec-button>\r\n </div>\r\n\r\n <ec-button *ngIf=\"quickSelectDate\"\r\n id=\"{{id}}_quickSelect\"\r\n icon=\"icon-day\"\r\n type=\"secondary\"\r\n title=\"{{'DateInput_LatestDataAvailableTitle' | translate}}\"\r\n (clicked)=\"goToQuickSelectDate()\"\r\n class=\"ml-2\">\r\n </ec-button>\r\n</div>\r\n\r\n<ng-template cdkConnectedOverlay\r\n #overlay=\"cdkConnectedOverlay\"\r\n [cdkConnectedOverlayOrigin]=\"overlayOrigin\"\r\n [cdkConnectedOverlayOpen]=\"isCalendarOpen\"\r\n [cdkConnectedOverlayScrollStrategy]=\"overlayScrollStrategy\"\r\n cdkConnectedOverlayPanelClass=\"my-1\"\r\n (overlayOutsideClick)=\"onOverlayOutsideClick($event)\"\r\n (detach)=\"isCalendarOpen = false\">\r\n <article id=\"{{id}}_datePicker\"\r\n class=\"card d-flex\"\r\n [ecKeyboardNavContainer]=\"isCalendarOpen\"\r\n #calendar=\"ecKeyboardNavContainer\"\r\n (focusOutStart)=\"onCalendarFocusOutStart()\"\r\n (focusOutEnd)=\"onCalendarFocusOutEnd()\">\r\n <ul *ngIf=\"selectionModeOptions.length > 1\"\r\n class=\"selection-mode-menu border-right p-1\">\r\n <li *ngFor=\"let option of selectionModeOptions\">\r\n <button id=\"{{id}}_selectionMode_{{option}}\"\r\n class=\"text-body-1\"\r\n [class.is-selected]=\"option === selectionMode\"\r\n (click)=\"onSelectionModeChange(option)\">\r\n {{'DateInputSelectionMode_' + option | translate}}\r\n </button>\r\n </li>\r\n </ul>\r\n\r\n <div>\r\n <div class=\"d-flex\">\r\n <ec-calendar id=\"{{id}}_calendar\"\r\n [view]=\"primaryCalendarView\"\r\n (viewChange)=\"onPrimaryCalendarViewChange($event)\"\r\n [selectionMode]=\"selectionMode\"\r\n [selection]=\"calendarSelection\"\r\n (dateSelected)=\"onCalendarDateSelected($event)\"\r\n [minDate]=\"minDate\"\r\n [maxDate]=\"selectionStrategy.showSecondaryCalendar ? primaryCalendarMaxDate : maxDate\">\r\n </ec-calendar>\r\n\r\n <ec-calendar *ngIf=\"selectionStrategy.showSecondaryCalendar\"\r\n id=\"{{id}}_secondaryCalendar\"\r\n [view]=\"secondaryCalendarView\"\r\n (viewChange)=\"onSecondaryCalendarViewChange($event)\"\r\n [selectionMode]=\"selectionMode\"\r\n [selection]=\"calendarSelection\"\r\n (dateSelected)=\"onCalendarDateSelected($event)\"\r\n [minDate]=\"secondaryCalendarMinDate\"\r\n [maxDate]=\"maxDate\">\r\n </ec-calendar>\r\n </div>\r\n\r\n <footer *ngIf=\"selectionStrategy.selectionViewMode === 'day'\"\r\n class=\"px-2 my-2 d-flex\">\r\n <button id=\"{{id}}_today_button\"\r\n ecLinkButton\r\n class=\"ml-auto d-inline-block\"\r\n (click)=\"goToToday()\"\r\n style=\"height: 1.75rem;\">\r\n {{'Today' | translate}}\r\n </button>\r\n </footer>\r\n </div>\r\n </article>\r\n</ng-template>\r\n", 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;background-color:transparent;width:100%;height:1.75rem}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:none;position:relative;z-index:1}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{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}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"], dependencies: [{ kind: "directive", type: i6.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i6.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i7.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i7.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i7.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i4.CdkConnectedOverlay, selector: "[cdk-connected-overlay], [connected-overlay], [cdkConnectedOverlay]", inputs: ["cdkConnectedOverlayOrigin", "cdkConnectedOverlayPositions", "cdkConnectedOverlayPositionStrategy", "cdkConnectedOverlayOffsetX", "cdkConnectedOverlayOffsetY", "cdkConnectedOverlayWidth", "cdkConnectedOverlayHeight", "cdkConnectedOverlayMinWidth", "cdkConnectedOverlayMinHeight", "cdkConnectedOverlayBackdropClass", "cdkConnectedOverlayPanelClass", "cdkConnectedOverlayViewportMargin", "cdkConnectedOverlayScrollStrategy", "cdkConnectedOverlayOpen", "cdkConnectedOverlayDisableClose", "cdkConnectedOverlayTransformOriginOn", "cdkConnectedOverlayHasBackdrop", "cdkConnectedOverlayLockPosition", "cdkConnectedOverlayFlexibleDimensions", "cdkConnectedOverlayGrowAfterOpen", "cdkConnectedOverlayPush", "cdkConnectedOverlayDisposeOnNavigation"], outputs: ["backdropClick", "positionChange", "attach", "detach", "overlayKeydown", "overlayOutsideClick"], exportAs: ["cdkConnectedOverlay"] }, { kind: "directive", type: i4.CdkOverlayOrigin, selector: "[cdk-overlay-origin], [overlay-origin], [cdkOverlayOrigin]", exportAs: ["cdkOverlayOrigin"] }, { kind: "component", type: i8.ButtonComponent, selector: "ec-button", inputs: ["id", "disabled", "icon", "label", "badge", "tabindex", "type", "pending", "pendingIcon", "customTemplate", "isSubmit", "autofocus"], outputs: ["clicked"] }, { kind: "component", type: i9.FormControlComponent, selector: "ec-form-control", inputs: ["id", "icon", "actionIcon", "showClear", "formModel", "autofocus", "pending", "required", "readonly"], outputs: ["actionClicked"] }, { kind: "component", type: i10.HelpPopoverComponent, selector: "ec-help-popover", inputs: ["id", "text", "contentPosition", "maxWidth"] }, { kind: "component", type: i11.LinkButtonComponent, selector: "button[ecLinkButton]" }, { kind: "component", type: i12.CalendarComponent, selector: "ec-calendar", inputs: ["id", "selection", "selectionMode", "minDate", "maxDate", "view"], outputs: ["dateSelected", "viewChange"] }, { kind: "directive", type: i13.KeyboardNavContainerDirective, selector: "[ecKeyboardNavContainer]", inputs: ["ecKeyboardNavContainer"], outputs: ["focusOutStart", "focusOutEnd"], exportAs: ["ecKeyboardNavContainer"] }, { kind: "pipe", type: i14.TranslatePipe, name: "translate" }] }); }
|
|
431
431
|
}
|
|
432
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
432
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: DateInputComponent, decorators: [{
|
|
433
433
|
type: Component,
|
|
434
434
|
args: [{ selector: 'ec-date-input', providers: [DateInput.SelectionStrategies], template: "<label *ngIf=\"label\">\r\n <span>{{label | translate}}</span>\r\n <span *ngIf=\"validationErrors.length > 0 && formModel.touched && formModel.invalid\"> {{validationErrors}}</span>\r\n <ec-help-popover id=\"{{id}}_helpPopover\"\r\n *ngIf=\"helpPopover\"\r\n class=\"d-inline-block my-n3 mx-n1\"\r\n text=\"{{helpPopover | translate}}\"\r\n contentPosition=\"{{helpPopoverPosition}}\">\r\n </ec-help-popover>\r\n</label>\r\n\r\n<div class=\"d-flex align-items-center\"\r\n [ecKeyboardNavContainer]=\"isCalendarOpen\"\r\n #controls=\"ecKeyboardNavContainer\"\r\n (focusOutEnd)=\"onControlsFocusOutEnd()\">\r\n <ec-form-control id=\"{{id}}\"\r\n [required]=\"required\"\r\n [autofocus]=\"autofocus\"\r\n [pending]=\"pending\"\r\n [readonly]=\"readonly\"\r\n (actionClicked)=\"isCalendarOpen = !isCalendarOpen\"\r\n [showClear]=\"false\"\r\n actionIcon=\"icon-date\"\r\n cdkOverlayOrigin\r\n #overlayOrigin=\"cdkOverlayOrigin\"\r\n class=\"flex-grow\"\r\n style=\"height: 2rem;\">\r\n <input id=\"{{id}}_input\"\r\n type=\"text\"\r\n placeholder=\"{{placeholder}}\"\r\n [formControl]=\"textboxGroup.get('textbox')\"\r\n (blur)=\"onTextboxBlur()\">\r\n </ec-form-control>\r\n\r\n <ng-container *ngIf=\"selectionStrategy.showSecondaryTextbox\">\r\n <span class=\"flex-shrink mx-1\">–</span>\r\n <ec-form-control id=\"{{id}}_control2\"\r\n [required]=\"required\"\r\n [autofocus]=\"autofocus\"\r\n [pending]=\"pending\"\r\n [readonly]=\"readonly\"\r\n (actionClicked)=\"isCalendarOpen = !isCalendarOpen\"\r\n [showClear]=\"false\"\r\n actionIcon=\"icon-date\"\r\n class=\"flex-grow\"\r\n style=\"height: 2rem;\">\r\n <input id=\"{{id}}_input2\"\r\n type=\"text\"\r\n placeholder=\"{{placeholder}}\"\r\n [formControl]=\"textboxGroup.get('textbox2')\"\r\n (blur)=\"onTextbox2Blur()\">\r\n </ec-form-control>\r\n </ng-container>\r\n\r\n <div *ngIf=\"enableSteppers\"\r\n class=\"control-group ml-2\">\r\n <ec-button id=\"{{id}}_previousSelection\"\r\n type=\"secondary\"\r\n icon=\"icon-angle-down rotate-90\"\r\n (clicked)=\"previousSelection()\"\r\n [disabled]=\"isCalendarOpen || disableSteppers || formModel?.disabled\">\r\n </ec-button>\r\n <ec-button id=\"{{id}}_nextSelection\"\r\n type=\"secondary\"\r\n icon=\"icon-angle-down rotate-270\"\r\n (clicked)=\"nextSelection()\"\r\n [disabled]=\"isCalendarOpen || disableSteppers || formModel?.disabled\">\r\n </ec-button>\r\n </div>\r\n\r\n <ec-button *ngIf=\"quickSelectDate\"\r\n id=\"{{id}}_quickSelect\"\r\n icon=\"icon-day\"\r\n type=\"secondary\"\r\n title=\"{{'DateInput_LatestDataAvailableTitle' | translate}}\"\r\n (clicked)=\"goToQuickSelectDate()\"\r\n class=\"ml-2\">\r\n </ec-button>\r\n</div>\r\n\r\n<ng-template cdkConnectedOverlay\r\n #overlay=\"cdkConnectedOverlay\"\r\n [cdkConnectedOverlayOrigin]=\"overlayOrigin\"\r\n [cdkConnectedOverlayOpen]=\"isCalendarOpen\"\r\n [cdkConnectedOverlayScrollStrategy]=\"overlayScrollStrategy\"\r\n cdkConnectedOverlayPanelClass=\"my-1\"\r\n (overlayOutsideClick)=\"onOverlayOutsideClick($event)\"\r\n (detach)=\"isCalendarOpen = false\">\r\n <article id=\"{{id}}_datePicker\"\r\n class=\"card d-flex\"\r\n [ecKeyboardNavContainer]=\"isCalendarOpen\"\r\n #calendar=\"ecKeyboardNavContainer\"\r\n (focusOutStart)=\"onCalendarFocusOutStart()\"\r\n (focusOutEnd)=\"onCalendarFocusOutEnd()\">\r\n <ul *ngIf=\"selectionModeOptions.length > 1\"\r\n class=\"selection-mode-menu border-right p-1\">\r\n <li *ngFor=\"let option of selectionModeOptions\">\r\n <button id=\"{{id}}_selectionMode_{{option}}\"\r\n class=\"text-body-1\"\r\n [class.is-selected]=\"option === selectionMode\"\r\n (click)=\"onSelectionModeChange(option)\">\r\n {{'DateInputSelectionMode_' + option | translate}}\r\n </button>\r\n </li>\r\n </ul>\r\n\r\n <div>\r\n <div class=\"d-flex\">\r\n <ec-calendar id=\"{{id}}_calendar\"\r\n [view]=\"primaryCalendarView\"\r\n (viewChange)=\"onPrimaryCalendarViewChange($event)\"\r\n [selectionMode]=\"selectionMode\"\r\n [selection]=\"calendarSelection\"\r\n (dateSelected)=\"onCalendarDateSelected($event)\"\r\n [minDate]=\"minDate\"\r\n [maxDate]=\"selectionStrategy.showSecondaryCalendar ? primaryCalendarMaxDate : maxDate\">\r\n </ec-calendar>\r\n\r\n <ec-calendar *ngIf=\"selectionStrategy.showSecondaryCalendar\"\r\n id=\"{{id}}_secondaryCalendar\"\r\n [view]=\"secondaryCalendarView\"\r\n (viewChange)=\"onSecondaryCalendarViewChange($event)\"\r\n [selectionMode]=\"selectionMode\"\r\n [selection]=\"calendarSelection\"\r\n (dateSelected)=\"onCalendarDateSelected($event)\"\r\n [minDate]=\"secondaryCalendarMinDate\"\r\n [maxDate]=\"maxDate\">\r\n </ec-calendar>\r\n </div>\r\n\r\n <footer *ngIf=\"selectionStrategy.selectionViewMode === 'day'\"\r\n class=\"px-2 my-2 d-flex\">\r\n <button id=\"{{id}}_today_button\"\r\n ecLinkButton\r\n class=\"ml-auto d-inline-block\"\r\n (click)=\"goToToday()\"\r\n style=\"height: 1.75rem;\">\r\n {{'Today' | translate}}\r\n </button>\r\n </footer>\r\n </div>\r\n </article>\r\n</ng-template>\r\n", 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;background-color:transparent;width:100%;height:1.75rem}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:none;position:relative;z-index:1}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{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}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"] }]
|
|
435
435
|
}], ctorParameters: () => [{ type: i1.ValidationMessageService }, { type: i2.FormGroupHelper }, { type: i3.UserPreferenceService }, { type: i0.ElementRef }, { type: i4.Overlay }, { type: i5.DateInput.SelectionStrategies }], propDecorators: { id: [{
|
|
@@ -36,8 +36,8 @@ export var DateInput;
|
|
|
36
36
|
get month() { return this._month; }
|
|
37
37
|
get quarter() { return this._quarter; }
|
|
38
38
|
get year() { return this._year; }
|
|
39
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
40
|
-
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "
|
|
39
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SelectionStrategies, deps: [{ token: i1.DateDisplayPipe }], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
40
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SelectionStrategies }); }
|
|
41
41
|
}
|
|
42
42
|
DateInput.SelectionStrategies = SelectionStrategies;
|
|
43
43
|
})(DateInput || (DateInput = {}));
|
|
@@ -173,10 +173,10 @@ export class DropdownComponent {
|
|
|
173
173
|
return;
|
|
174
174
|
}
|
|
175
175
|
}
|
|
176
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
177
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
176
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: DropdownComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
177
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: DropdownComponent, selector: "ec-dropdown", inputs: { id: "id", autofocus: "autofocus", status: "status", disabled: "disabled", label: "label", icon: "icon", buttonType: "buttonType", buttonAlignment: "buttonAlignment", buttonTitle: "buttonTitle", tabindex: "tabindex", showArrow: "showArrow", items: "items", menuTemplateType: "menuTemplateType", menuTitle: "menuTitle", menuHeight: "menuHeight", menuWidth: "menuWidth", menuMinWidth: "menuMinWidth", menuPosition: "menuPosition", menuFooter: "menuFooter", popupFixed: "popupFixed", buttonCustomTemplate: "buttonCustomTemplate", pending: "pending" }, outputs: { itemSelected: "itemSelected", popupOpened: "popupOpened" }, host: { properties: { "class.is-pending": "this.pending" } }, viewQueries: [{ propertyName: "menuEl", first: true, predicate: MenuComponent, descendants: true, read: ElementRef }, { propertyName: "popup", first: true, predicate: PopupContainerDirective, descendants: true, static: true }, { propertyName: "dropdownToggleButton", first: true, predicate: ["dropdownToggle"], descendants: true }], ngImport: i0, template: "<div class=\"control\">\r\n <ec-button [disabled]=\"disabled\"\r\n id=\"{{id}}_toggle\"\r\n #dropdownToggle\r\n [ngClass]=\"{'has-arrow':showArrow, 'active': menuStatus === 'visible', 'text-left': buttonAlignment === 'left', 'text-right': buttonAlignment === 'right'}\"\r\n *ecPopup=\"dropdownMenu\"\r\n [label]=\"label\"\r\n [icon]=\"icon\"\r\n [tabindex]=\"tabindex\"\r\n [type]=\"buttonType\"\r\n [customTemplate]=\"buttonCustomTemplate\"\r\n [pending]=\"pending\"\r\n title=\"{{buttonTitle}}\"\r\n (click)=\"toggleMenu($event)\"\r\n (keydown)=\"keyNavigate($event)\"\r\n [autofocus]=\"autofocus\">\r\n </ec-button>\r\n <span class=\"arrow is-{{buttonType}}\"\r\n *ngIf=\"showArrow\"\r\n [class.is-disabled]=\"disabled\">\r\n <i class=\"ec-icon icon-caret-down\" [class.flip-y]=\"menuStatus === 'visible'\"></i>\r\n </span>\r\n</div>\r\n\r\n<ng-template #dropdownMenu>\r\n <div id=\"{{id}}_popup\"\r\n class=\"popup\"\r\n ecOverlay\r\n [status]=\"status?.status\"\r\n [message]=\"status?.message\"\r\n [displayAsMask]=\"true\">\r\n <!-- Dropdown Menu Title -->\r\n <header id=\"{{id}}_title\"\r\n class=\"text-heading-2 px-2 my-2\"\r\n *ngIf=\"menuTitle\">{{menuTitle}}\r\n </header>\r\n <!-- Dropdown Menu -->\r\n <ec-menu id=\"{{id}}_menu\"\r\n [class.wrap-items]=\"menuWidth\"\r\n [templateType]=\"menuTemplateType\"\r\n [style.width]=\"menuWidth ? menuWidth + 'px' : 'auto'\"\r\n [style.min-width]=\"menuMinWidth ? menuMinWidth + 'px' : 'auto'\"\r\n [style.height]=\"menuHeight ? menuHeight + 'px' : 'auto'\"\r\n [items]=\"items\"\r\n [showNoItems]=\"true\"\r\n [enableKeyNav]=\"true\"\r\n [highlightedItem]=\"highlightedItem\"\r\n [dropdownToggleButton]=\"dropdownToggleButton.buttonElement\"\r\n (selectedChanged)=\"selectedChanged($event)\">\r\n </ec-menu>\r\n <footer *ngIf=\"menuFooter\">{{menuFooter}}</footer>\r\n </div>\r\n</ng-template>", styles: [":host{display:inline-block;box-sizing:border-box;vertical-align:top}:host(.font-size-inherit) ec-button{font-size:inherit}:host(.font-size-inherit) ec-button ::ng-deep button{font-size:inherit}:host(.fill){display:block;height:100%;width:100%}:host(.fill) .control{display:block;height:100%;width:100%}:host(.fill) .control ec-button{display:block;height:100%;width:100%}:host(.fill) .control ec-button ::ng-deep button{display:block;height:100%;width:100%;display:flex}:host(.fill) ec-menu{min-width:100%}:host(.td-fill){position:absolute;left:0;top:0}:host(.td-fill) ec-button ::ng-deep button{padding-left:.375rem;padding-right:.375rem;font-size:.75rem}:host(.is-action) ec-button,:host(.is-action) .arrow{color:var(--ec-color-interactive)}:host(.is-condensed) ec-button ::ng-deep button{height:1.5rem}:host(.is-condensed) ec-button.has-arrow ::ng-deep button{padding:0 1.125rem 0 .25rem}:host(.is-condensed) ec-button.has-arrow~.arrow{right:.375rem}:host(.d-block) ec-button{display:block}:host(.d-block) ec-button ::ng-deep button{width:100%}:host(.is-pending) .arrow{opacity:0}:host-context(th){color:var(--ec-color-primary-dark)}.control{position:relative}ec-button{display:block}ec-button.has-arrow~.arrow{position:absolute;top:0;right:.5rem;height:100%;display:flex;align-items:center;pointer-events:none;width:.625rem;z-index:1}ec-button.has-arrow~.arrow .ec-icon{color:var(--ec-color-icon);width:auto;transition:color .3s ease}ec-button.has-arrow~.arrow.is-link .ec-icon{color:var(--ec-button-color-text, var(--ec-color-link))}ec-button.has-arrow~.arrow.is-primary .ec-icon{color:var(--ec-button-color-primary, var(--ec-color-primary-light))}ec-button.has-arrow~.arrow.is-common .ec-icon,ec-button.has-arrow~.arrow.is-secondary .ec-icon{color:var(--ec-button-color-secondary, var(--ec-color-primary-dark))}ec-button.has-arrow~.arrow.is-text .ec-icon{color:var(--ec-button-color-text, var(--ec-color-primary-dark))}ec-button.has-arrow~.arrow.is-disabled .ec-icon{opacity:.5}ec-button.has-arrow.active~.arrow.is-primary .ec-icon,ec-button.has-arrow.active~.arrow.is-secondary .ec-icon,ec-button.has-arrow.active~.arrow.is-text .ec-icon,ec-button.has-arrow.active~.arrow.is-link .ec-icon{color:var(--ec-button-color-active, var(--ec-color-primary-dark))}ec-button.has-arrow ::ng-deep button{width:auto;padding-right:1.25rem}ec-button.has-arrow ::ng-deep button:not(.ec-button-custom){padding-left:.5rem}.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);text-align:start}.popup>header{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.popup footer{color:var(--ec-color-secondary-dark);font-size:var(--ec-font-size-label);border-top:var(--ec-border-width) solid var(--ec-border-color);padding:.1875rem .5rem;line-height:1.2}ec-menu ::ng-deep ul{max-height:50vh}ec-menu ::ng-deep li{white-space:nowrap}ec-menu.wrap-items ::ng-deep li{white-space:normal}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.ButtonComponent, selector: "ec-button", inputs: ["id", "disabled", "icon", "label", "badge", "tabindex", "type", "pending", "pendingIcon", "customTemplate", "isSubmit", "autofocus"], outputs: ["clicked"] }, { kind: "component", type: i3.ViewOverlayComponent, selector: "[ecOverlay]", inputs: ["status", "message", "action", "noDataTemplate", "displayAsMask", "overlayClassList"] }, { kind: "component", type: i4.MenuComponent, selector: "ec-menu", inputs: ["id", "items", "selected", "parent", "templateType", "customMenuTemplate", "title", "showNoItems", "noDataText", "enableKeyNav", "highlightedItem", "maintainSelectedItem", "truncateItems", "preserveIconSpace", "dropdownToggleButton"], outputs: ["selectedChanged", "menuClosed"] }, { kind: "directive", type: i5.PopupContainerDirective, selector: "[ecPopup]", inputs: ["ecPopup", "options"] }] }); }
|
|
178
178
|
}
|
|
179
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
179
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: DropdownComponent, decorators: [{
|
|
180
180
|
type: Component,
|
|
181
181
|
args: [{ selector: 'ec-dropdown', template: "<div class=\"control\">\r\n <ec-button [disabled]=\"disabled\"\r\n id=\"{{id}}_toggle\"\r\n #dropdownToggle\r\n [ngClass]=\"{'has-arrow':showArrow, 'active': menuStatus === 'visible', 'text-left': buttonAlignment === 'left', 'text-right': buttonAlignment === 'right'}\"\r\n *ecPopup=\"dropdownMenu\"\r\n [label]=\"label\"\r\n [icon]=\"icon\"\r\n [tabindex]=\"tabindex\"\r\n [type]=\"buttonType\"\r\n [customTemplate]=\"buttonCustomTemplate\"\r\n [pending]=\"pending\"\r\n title=\"{{buttonTitle}}\"\r\n (click)=\"toggleMenu($event)\"\r\n (keydown)=\"keyNavigate($event)\"\r\n [autofocus]=\"autofocus\">\r\n </ec-button>\r\n <span class=\"arrow is-{{buttonType}}\"\r\n *ngIf=\"showArrow\"\r\n [class.is-disabled]=\"disabled\">\r\n <i class=\"ec-icon icon-caret-down\" [class.flip-y]=\"menuStatus === 'visible'\"></i>\r\n </span>\r\n</div>\r\n\r\n<ng-template #dropdownMenu>\r\n <div id=\"{{id}}_popup\"\r\n class=\"popup\"\r\n ecOverlay\r\n [status]=\"status?.status\"\r\n [message]=\"status?.message\"\r\n [displayAsMask]=\"true\">\r\n <!-- Dropdown Menu Title -->\r\n <header id=\"{{id}}_title\"\r\n class=\"text-heading-2 px-2 my-2\"\r\n *ngIf=\"menuTitle\">{{menuTitle}}\r\n </header>\r\n <!-- Dropdown Menu -->\r\n <ec-menu id=\"{{id}}_menu\"\r\n [class.wrap-items]=\"menuWidth\"\r\n [templateType]=\"menuTemplateType\"\r\n [style.width]=\"menuWidth ? menuWidth + 'px' : 'auto'\"\r\n [style.min-width]=\"menuMinWidth ? menuMinWidth + 'px' : 'auto'\"\r\n [style.height]=\"menuHeight ? menuHeight + 'px' : 'auto'\"\r\n [items]=\"items\"\r\n [showNoItems]=\"true\"\r\n [enableKeyNav]=\"true\"\r\n [highlightedItem]=\"highlightedItem\"\r\n [dropdownToggleButton]=\"dropdownToggleButton.buttonElement\"\r\n (selectedChanged)=\"selectedChanged($event)\">\r\n </ec-menu>\r\n <footer *ngIf=\"menuFooter\">{{menuFooter}}</footer>\r\n </div>\r\n</ng-template>", styles: [":host{display:inline-block;box-sizing:border-box;vertical-align:top}:host(.font-size-inherit) ec-button{font-size:inherit}:host(.font-size-inherit) ec-button ::ng-deep button{font-size:inherit}:host(.fill){display:block;height:100%;width:100%}:host(.fill) .control{display:block;height:100%;width:100%}:host(.fill) .control ec-button{display:block;height:100%;width:100%}:host(.fill) .control ec-button ::ng-deep button{display:block;height:100%;width:100%;display:flex}:host(.fill) ec-menu{min-width:100%}:host(.td-fill){position:absolute;left:0;top:0}:host(.td-fill) ec-button ::ng-deep button{padding-left:.375rem;padding-right:.375rem;font-size:.75rem}:host(.is-action) ec-button,:host(.is-action) .arrow{color:var(--ec-color-interactive)}:host(.is-condensed) ec-button ::ng-deep button{height:1.5rem}:host(.is-condensed) ec-button.has-arrow ::ng-deep button{padding:0 1.125rem 0 .25rem}:host(.is-condensed) ec-button.has-arrow~.arrow{right:.375rem}:host(.d-block) ec-button{display:block}:host(.d-block) ec-button ::ng-deep button{width:100%}:host(.is-pending) .arrow{opacity:0}:host-context(th){color:var(--ec-color-primary-dark)}.control{position:relative}ec-button{display:block}ec-button.has-arrow~.arrow{position:absolute;top:0;right:.5rem;height:100%;display:flex;align-items:center;pointer-events:none;width:.625rem;z-index:1}ec-button.has-arrow~.arrow .ec-icon{color:var(--ec-color-icon);width:auto;transition:color .3s ease}ec-button.has-arrow~.arrow.is-link .ec-icon{color:var(--ec-button-color-text, var(--ec-color-link))}ec-button.has-arrow~.arrow.is-primary .ec-icon{color:var(--ec-button-color-primary, var(--ec-color-primary-light))}ec-button.has-arrow~.arrow.is-common .ec-icon,ec-button.has-arrow~.arrow.is-secondary .ec-icon{color:var(--ec-button-color-secondary, var(--ec-color-primary-dark))}ec-button.has-arrow~.arrow.is-text .ec-icon{color:var(--ec-button-color-text, var(--ec-color-primary-dark))}ec-button.has-arrow~.arrow.is-disabled .ec-icon{opacity:.5}ec-button.has-arrow.active~.arrow.is-primary .ec-icon,ec-button.has-arrow.active~.arrow.is-secondary .ec-icon,ec-button.has-arrow.active~.arrow.is-text .ec-icon,ec-button.has-arrow.active~.arrow.is-link .ec-icon{color:var(--ec-button-color-active, var(--ec-color-primary-dark))}ec-button.has-arrow ::ng-deep button{width:auto;padding-right:1.25rem}ec-button.has-arrow ::ng-deep button:not(.ec-button-custom){padding-left:.5rem}.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);text-align:start}.popup>header{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.popup footer{color:var(--ec-color-secondary-dark);font-size:var(--ec-font-size-label);border-top:var(--ec-border-width) solid var(--ec-border-color);padding:.1875rem .5rem;line-height:1.2}ec-menu ::ng-deep ul{max-height:50vh}ec-menu ::ng-deep li{white-space:nowrap}ec-menu.wrap-items ::ng-deep li{white-space:normal}\n"] }]
|
|
182
182
|
}], ctorParameters: () => [], propDecorators: { id: [{
|
|
@@ -224,10 +224,10 @@ export class FileUploadComponent extends FormControlBase {
|
|
|
224
224
|
await this.processFile(file);
|
|
225
225
|
}
|
|
226
226
|
}
|
|
227
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
228
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
227
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: FileUploadComponent, deps: [{ token: i1.ValidationMessageService }, { token: i2.FormGroupHelper }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
228
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: FileUploadComponent, selector: "ec-file-upload", inputs: { formModel: "formModel", placeholder: "placeholder", fileType: "fileType", fileOutput: "fileOutput", customExtensions: "customExtensions", onFileSelected: "onFileSelected", onMultipleFilesSelected: "onMultipleFilesSelected", displayType: "displayType", buttonLabel: "buttonLabel", buttonType: "buttonType", multiSelect: "multiSelect", validateBeforeUpload: "validateBeforeUpload" }, viewQueries: [{ propertyName: "fileInput", first: true, predicate: ["fileInput"], descendants: true, read: ElementRef, static: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<ec-form-group [label]=\"label\"\r\n [formGroup]=\"formModel\"\r\n [helpPopover]=\"helpPopover\"\r\n [helpPopoverPosition]=\"helpPopoverPosition\"\r\n class=\"mb-0\">\r\n <div class=\"d-flex control-group\">\r\n <div class=\"d-flex flex-grow position-relative\">\r\n <input #fileInput\r\n id=\"{{inputId}}_input\"\r\n type=\"file\"\r\n tabindex=\"-1\"\r\n [attr.accept]=\"fileTypeAccept\"\r\n (change)=\"fileChange($event.target.files)\"\r\n [class.has-value]=\"displayType === 'file' ? formModel?.get('name').value : undefined\"\r\n [attr.multiple]=\"multiSelect ? 'multiple' : undefined\">\r\n <ec-form-control *ngIf=\"displayType === 'file'\"\r\n id=\"{{inputId}}_formControl\"\r\n class=\"text-truncate\"\r\n [required]=\"required\"\r\n [pending]=\"pending || formModel?.pending\">\r\n <input id=\"{{inputId}}_name\"\r\n [formControl]=\"formModel?.get('name')\"\r\n type=\"text\"\r\n [placeholder]=\"placeholder\"\r\n [tabindex]=\"-1\">\r\n </ec-form-control>\r\n </div>\r\n <ec-button *ngIf=\"displayType === 'file'\"\r\n #browseBtn\r\n id=\"{{inputId}}_browseBtn\"\r\n (clicked)=\"fileInput.click()\"\r\n type=\"secondary\"\r\n [tabindex]=\"tabindex\"\r\n [disabled]=\"formModel?.get('name').disabled\"\r\n label=\"Browse\"\r\n [autofocus]=\"autofocus\">\r\n </ec-button>\r\n </div>\r\n <ec-button *ngIf=\"displayType === 'button'\"\r\n id=\"{{inputId}}_btn\"\r\n [pending]=\"pending\"\r\n [type]=\"buttonType\"\r\n [label]=\"buttonLabel ?? 'Browse_TC' | translate\"\r\n (clicked)=\"fileInput.click()\"\r\n style=\"width: 100%;\">\r\n </ec-button>\r\n</ec-form-group>", styles: [":host{display:block;margin-bottom:1rem}ec-form-control{margin-bottom:0}ec-form-control ::ng-deep>.ec-focus-ring{display:none!important}input[type=file]{opacity:0;display:block;position:absolute;top:0;left:0;width:100%;height:100%;z-index:1;cursor:pointer}input[type=file].has-value{width:calc(100% - 1.5rem)}ec-button{--ec-button-border-color-secondary: var(--ec-form-control-border-color);--ec-button-color-icon-secondary: var(--ec-color-icon)}\n"], dependencies: [{ kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i4.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "component", type: i5.ButtonComponent, selector: "ec-button", inputs: ["id", "disabled", "icon", "label", "badge", "tabindex", "type", "pending", "pendingIcon", "customTemplate", "isSubmit", "autofocus"], outputs: ["clicked"] }, { kind: "component", type: i6.FormControlComponent, selector: "ec-form-control", inputs: ["id", "icon", "actionIcon", "showClear", "formModel", "autofocus", "pending", "required", "readonly"], outputs: ["actionClicked"] }, { kind: "component", type: i7.FormGroupComponent, selector: "ec-form-group", inputs: ["id", "label", "formGroup", "labelPosition", "overrideValidationError", "hideValidationMessage", "helpPopover", "helpPopoverPosition"] }, { kind: "pipe", type: i8.TranslatePipe, name: "translate" }] }); }
|
|
229
229
|
}
|
|
230
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
230
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: FileUploadComponent, decorators: [{
|
|
231
231
|
type: Component,
|
|
232
232
|
args: [{ selector: "ec-file-upload", template: "<ec-form-group [label]=\"label\"\r\n [formGroup]=\"formModel\"\r\n [helpPopover]=\"helpPopover\"\r\n [helpPopoverPosition]=\"helpPopoverPosition\"\r\n class=\"mb-0\">\r\n <div class=\"d-flex control-group\">\r\n <div class=\"d-flex flex-grow position-relative\">\r\n <input #fileInput\r\n id=\"{{inputId}}_input\"\r\n type=\"file\"\r\n tabindex=\"-1\"\r\n [attr.accept]=\"fileTypeAccept\"\r\n (change)=\"fileChange($event.target.files)\"\r\n [class.has-value]=\"displayType === 'file' ? formModel?.get('name').value : undefined\"\r\n [attr.multiple]=\"multiSelect ? 'multiple' : undefined\">\r\n <ec-form-control *ngIf=\"displayType === 'file'\"\r\n id=\"{{inputId}}_formControl\"\r\n class=\"text-truncate\"\r\n [required]=\"required\"\r\n [pending]=\"pending || formModel?.pending\">\r\n <input id=\"{{inputId}}_name\"\r\n [formControl]=\"formModel?.get('name')\"\r\n type=\"text\"\r\n [placeholder]=\"placeholder\"\r\n [tabindex]=\"-1\">\r\n </ec-form-control>\r\n </div>\r\n <ec-button *ngIf=\"displayType === 'file'\"\r\n #browseBtn\r\n id=\"{{inputId}}_browseBtn\"\r\n (clicked)=\"fileInput.click()\"\r\n type=\"secondary\"\r\n [tabindex]=\"tabindex\"\r\n [disabled]=\"formModel?.get('name').disabled\"\r\n label=\"Browse\"\r\n [autofocus]=\"autofocus\">\r\n </ec-button>\r\n </div>\r\n <ec-button *ngIf=\"displayType === 'button'\"\r\n id=\"{{inputId}}_btn\"\r\n [pending]=\"pending\"\r\n [type]=\"buttonType\"\r\n [label]=\"buttonLabel ?? 'Browse_TC' | translate\"\r\n (clicked)=\"fileInput.click()\"\r\n style=\"width: 100%;\">\r\n </ec-button>\r\n</ec-form-group>", styles: [":host{display:block;margin-bottom:1rem}ec-form-control{margin-bottom:0}ec-form-control ::ng-deep>.ec-focus-ring{display:none!important}input[type=file]{opacity:0;display:block;position:absolute;top:0;left:0;width:100%;height:100%;z-index:1;cursor:pointer}input[type=file].has-value{width:calc(100% - 1.5rem)}ec-button{--ec-button-border-color-secondary: var(--ec-form-control-border-color);--ec-button-color-icon-secondary: var(--ec-color-icon)}\n"] }]
|
|
233
233
|
}], ctorParameters: () => [{ type: i1.ValidationMessageService }, { type: i2.FormGroupHelper }], propDecorators: { formModel: [{
|
|
@@ -43,10 +43,10 @@ export class FormControlComponent {
|
|
|
43
43
|
clear() {
|
|
44
44
|
this._formModel?.reset();
|
|
45
45
|
}
|
|
46
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
47
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
46
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: FormControlComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
47
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: FormControlComponent, selector: "ec-form-control", inputs: { id: "id", icon: "icon", actionIcon: "actionIcon", showClear: "showClear", formModelInput: ["formModel", "formModelInput"], autofocus: "autofocus", pending: "pending", required: "required", readonly: "readonly" }, outputs: { actionClicked: "actionClicked" }, host: { listeners: { "click": "onClick()" }, properties: { "class.is-pending": "this.pending", "class.is-required": "this.required", "class.is-readonly": "this.readonly", "class.is-empty": "this.empty", "class.is-invalid": "this.invalid", "class.is-disabled": "this.disabled" } }, queries: [{ propertyName: "formControlDirective", first: true, predicate: FormControlDirective, descendants: true }], ngImport: i0, template: "<ng-content></ng-content>\r\n<i id=\"{{id + '_icon'}}\" class=\"ec-form-control-icon ec-icon {{icon}}\"></i>\r\n<i id=\"{{id + '_loading'}}\" class=\"ec-form-control-icon ec-icon icon-loading\"></i>\r\n<i id=\"{{id + '_required'}}\" class=\"ec-form-control-icon ec-icon icon-required\"></i>\r\n<i id=\"{{id + '_invalid'}}\" class=\"ec-form-control-icon ec-icon icon-invalid\"></i>\r\n<button *ngIf=\"showClear\"\r\n id=\"{{id + '_clear'}}\"\r\n [attr.disabled]=\"disabled || undefined\"\r\n class=\"ec-form-control-clear\"\r\n (click)=\"clear()\">\r\n <i class=\"ec-icon icon-cancel\"></i>\r\n</button>\r\n<button *ngIf=\"actionIcon\"\r\n id=\"{{id + '_action'}}\"\r\n [attr.disabled]=\"disabled || undefined\"\r\n class=\"ec-form-control-action\"\r\n (click)=\"actionClicked.emit($event)\">\r\n <i class=\"ec-icon {{actionIcon}}\"></i>\r\n</button>\r\n<div class=\"ec-focus-ring\"></div>\r\n", 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-radius:var(--ec-border-radius);display:flex;cursor:pointer;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 .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:none;position:relative;z-index:1}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-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}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], encapsulation: i0.ViewEncapsulation.None }); }
|
|
48
48
|
}
|
|
49
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
49
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: FormControlComponent, decorators: [{
|
|
50
50
|
type: Component,
|
|
51
51
|
args: [{ selector: 'ec-form-control', encapsulation: ViewEncapsulation.None, template: "<ng-content></ng-content>\r\n<i id=\"{{id + '_icon'}}\" class=\"ec-form-control-icon ec-icon {{icon}}\"></i>\r\n<i id=\"{{id + '_loading'}}\" class=\"ec-form-control-icon ec-icon icon-loading\"></i>\r\n<i id=\"{{id + '_required'}}\" class=\"ec-form-control-icon ec-icon icon-required\"></i>\r\n<i id=\"{{id + '_invalid'}}\" class=\"ec-form-control-icon ec-icon icon-invalid\"></i>\r\n<button *ngIf=\"showClear\"\r\n id=\"{{id + '_clear'}}\"\r\n [attr.disabled]=\"disabled || undefined\"\r\n class=\"ec-form-control-clear\"\r\n (click)=\"clear()\">\r\n <i class=\"ec-icon icon-cancel\"></i>\r\n</button>\r\n<button *ngIf=\"actionIcon\"\r\n id=\"{{id + '_action'}}\"\r\n [attr.disabled]=\"disabled || undefined\"\r\n class=\"ec-form-control-action\"\r\n (click)=\"actionClicked.emit($event)\">\r\n <i class=\"ec-icon {{actionIcon}}\"></i>\r\n</button>\r\n<div class=\"ec-focus-ring\"></div>\r\n", 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-radius:var(--ec-border-radius);display:flex;cursor:pointer;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 .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:none;position:relative;z-index:1}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-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}\n"] }]
|
|
52
52
|
}], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { formControlDirective: [{
|
|
@@ -118,10 +118,10 @@ export class FormControlBase {
|
|
|
118
118
|
}
|
|
119
119
|
}
|
|
120
120
|
}
|
|
121
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
122
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "
|
|
121
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: FormControlBase, deps: [{ token: i1.ValidationMessageService }, { token: i2.FormGroupHelper }], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
122
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.13", type: FormControlBase, inputs: { autofocus: "autofocus", formModel: "formModel", label: "label", labelPosition: "labelPosition", id: "id", pending: "pending", required: "required", tabindex: "tabindex", readonly: "readonly", tooltip: "tooltip", helpPopover: "helpPopover", helpPopoverPosition: "helpPopoverPosition" }, usesOnChanges: true, ngImport: i0 }); }
|
|
123
123
|
}
|
|
124
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
124
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: FormControlBase, decorators: [{
|
|
125
125
|
type: Directive
|
|
126
126
|
}], ctorParameters: () => [{ type: i1.ValidationMessageService }, { type: i2.FormGroupHelper }], propDecorators: { autofocus: [{
|
|
127
127
|
type: Input
|
|
@@ -111,10 +111,10 @@ export class FormControlLabelComponent {
|
|
|
111
111
|
this.validationErrors = '';
|
|
112
112
|
}
|
|
113
113
|
}
|
|
114
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
115
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
114
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: FormControlLabelComponent, deps: [{ token: i1.ValidationMessageService }, { token: i2.TranslateService }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
115
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: FormControlLabelComponent, selector: "ec-form-control-label", inputs: { id: "id", label: "label", control: "control", labelPosition: "labelPosition", overrideValidationError: "overrideValidationError", hideValidationMessage: "hideValidationMessage" }, host: { properties: { "attr.id": "this.attrId" } }, ngImport: i0, template: "<div class=\"control control-label-{{labelPosition}}\" [class.ec-untouched]=\"control?.untouched\">\r\n <label *ngIf=\"label\" ngPreserveWhitespaces>\r\n\r\n <span id=\"{{id}}_label\">{{label | translate}}</span>\r\n\r\n <span *ngIf=\"!hideValidationMessage && validationErrors && control?.touched && control?.invalid\">{{validationErrors | translate}}</span>\r\n </label>\r\n</div>", styles: [":host{color:var(--ec-form-control-color);font-size:var(--ec-form-control-font-size);display:block;margin-bottom:1rem;width:100%}:host :host-context(.form-condensed){margin-bottom:.5rem}:host .control{width:100%;display:flex;flex-direction:column}:host .control.control-label-bottom{flex-direction:column-reverse}:host .control.control-label-left{flex-direction:row}:host .control.control-label-left label{margin-right:.25rem}:host .control.control-label-right{flex-direction:row-reverse}:host .control.control-label-right label{margin-left:.25rem}:host .control.control-label-left,:host .control.control-label-right{align-items:center}:host .control.control-label-left label,:host .control.control-label-right label{flex:1 1;margin-top:0;margin-bottom:0}:host .control.control-label-left .control-input,:host .control.control-label-right .control-input{flex:2 2}:host .control.is-readonly input,:host .control.is-readonly select,:host .control.is-readonly textarea{border-color:var(--ec-form-control-border-color-readonly);background-color:var(--ec-form-control-background-color-readonly);background-clip:border-box;background-image:none;color:var(--ec-form-control-color-readonly);opacity:1;-webkit-user-select:none;user-select:none;pointer-events:none;overflow:hidden;white-space:nowrap}:host .control.invalid .textbox-group-input ::ng-deep .control input.ng-invalid,:host .control.invalid .textbox-group-input ::ng-deep .control input.ng-valid{background-color:var(--ec-form-control-background-color-invalid);border-color:var(--ec-form-control-border-color-invalid);background-repeat:no-repeat;background-position:.5rem center;background-size:1rem,1rem;padding-left:1.75rem;background-image:none}:host .control.invalid .textbox-group-input ::ng-deep .control input.ng-invalid:focus,:host .control.invalid .textbox-group-input ::ng-deep .control input.ng-valid:focus{border-color:var(--ec-form-control-background-color-invalid)}:host .control.invalid .textbox-group-input ::ng-deep .control input.ng-invalid~.icon-invalid,:host .control.invalid .textbox-group-input ::ng-deep .control input.ng-valid~.icon-invalid{display:inline-flex;position:absolute;left:.5rem;top:.5rem;z-index:1}:host .control.invalid .textbox-group-input ::ng-deep .control input.ng-invalid~.icon-required,:host .control.invalid .textbox-group-input ::ng-deep .control input.ng-valid~.icon-required{display:none}:host .control.invalid:not(.open) .textbox-group-btn-right ::ng-deep button{background-color:var(--ec-form-control-background-color-invalid)}:host .control.invalid:not(.open) .textbox-group-btn-right ::ng-deep button:not(:focus){border-color:var(--ec-form-control-border-color-invalid)}:host .textbox-group{display:flex;position:relative}:host textarea:focus,:host input:focus,:host select:focus{outline:none}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}.control.ec-untouched ::ng-deep input.ng-invalid.ng-touched{background-image:none;padding-left:.5rem}.control.ec-untouched ::ng-deep input.ng-invalid.ng-touched:not(.is-empty)~.units-left{left:0}.control.ec-untouched ::ng-deep input:required:not(:disabled).is-empty{background-image:none;background-repeat:no-repeat;background-position:.5rem center;background-size:1rem,1rem;padding-left:1.75rem}.control.ec-untouched ::ng-deep input:required:not(:disabled).is-empty:focus{border-color:var(--ec-form-control-border-color-focus);box-shadow:var(--ec-form-control-box-shadow-focus);position:relative;z-index:1}.control-label-left{display:flex}\n"], dependencies: [{ kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }] }); }
|
|
116
116
|
}
|
|
117
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
117
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: FormControlLabelComponent, decorators: [{
|
|
118
118
|
type: Component,
|
|
119
119
|
args: [{ selector: 'ec-form-control-label', template: "<div class=\"control control-label-{{labelPosition}}\" [class.ec-untouched]=\"control?.untouched\">\r\n <label *ngIf=\"label\" ngPreserveWhitespaces>\r\n\r\n <span id=\"{{id}}_label\">{{label | translate}}</span>\r\n\r\n <span *ngIf=\"!hideValidationMessage && validationErrors && control?.touched && control?.invalid\">{{validationErrors | translate}}</span>\r\n </label>\r\n</div>", styles: [":host{color:var(--ec-form-control-color);font-size:var(--ec-form-control-font-size);display:block;margin-bottom:1rem;width:100%}:host :host-context(.form-condensed){margin-bottom:.5rem}:host .control{width:100%;display:flex;flex-direction:column}:host .control.control-label-bottom{flex-direction:column-reverse}:host .control.control-label-left{flex-direction:row}:host .control.control-label-left label{margin-right:.25rem}:host .control.control-label-right{flex-direction:row-reverse}:host .control.control-label-right label{margin-left:.25rem}:host .control.control-label-left,:host .control.control-label-right{align-items:center}:host .control.control-label-left label,:host .control.control-label-right label{flex:1 1;margin-top:0;margin-bottom:0}:host .control.control-label-left .control-input,:host .control.control-label-right .control-input{flex:2 2}:host .control.is-readonly input,:host .control.is-readonly select,:host .control.is-readonly textarea{border-color:var(--ec-form-control-border-color-readonly);background-color:var(--ec-form-control-background-color-readonly);background-clip:border-box;background-image:none;color:var(--ec-form-control-color-readonly);opacity:1;-webkit-user-select:none;user-select:none;pointer-events:none;overflow:hidden;white-space:nowrap}:host .control.invalid .textbox-group-input ::ng-deep .control input.ng-invalid,:host .control.invalid .textbox-group-input ::ng-deep .control input.ng-valid{background-color:var(--ec-form-control-background-color-invalid);border-color:var(--ec-form-control-border-color-invalid);background-repeat:no-repeat;background-position:.5rem center;background-size:1rem,1rem;padding-left:1.75rem;background-image:none}:host .control.invalid .textbox-group-input ::ng-deep .control input.ng-invalid:focus,:host .control.invalid .textbox-group-input ::ng-deep .control input.ng-valid:focus{border-color:var(--ec-form-control-background-color-invalid)}:host .control.invalid .textbox-group-input ::ng-deep .control input.ng-invalid~.icon-invalid,:host .control.invalid .textbox-group-input ::ng-deep .control input.ng-valid~.icon-invalid{display:inline-flex;position:absolute;left:.5rem;top:.5rem;z-index:1}:host .control.invalid .textbox-group-input ::ng-deep .control input.ng-invalid~.icon-required,:host .control.invalid .textbox-group-input ::ng-deep .control input.ng-valid~.icon-required{display:none}:host .control.invalid:not(.open) .textbox-group-btn-right ::ng-deep button{background-color:var(--ec-form-control-background-color-invalid)}:host .control.invalid:not(.open) .textbox-group-btn-right ::ng-deep button:not(:focus){border-color:var(--ec-form-control-border-color-invalid)}:host .textbox-group{display:flex;position:relative}:host textarea:focus,:host input:focus,:host select:focus{outline:none}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}.control.ec-untouched ::ng-deep input.ng-invalid.ng-touched{background-image:none;padding-left:.5rem}.control.ec-untouched ::ng-deep input.ng-invalid.ng-touched:not(.is-empty)~.units-left{left:0}.control.ec-untouched ::ng-deep input:required:not(:disabled).is-empty{background-image:none;background-repeat:no-repeat;background-position:.5rem center;background-size:1rem,1rem;padding-left:1.75rem}.control.ec-untouched ::ng-deep input:required:not(:disabled).is-empty:focus{border-color:var(--ec-form-control-border-color-focus);box-shadow:var(--ec-form-control-box-shadow-focus);position:relative;z-index:1}.control-label-left{display:flex}\n"] }]
|
|
120
120
|
}], ctorParameters: () => [{ type: i1.ValidationMessageService }, { type: i2.TranslateService }], propDecorators: { id: [{
|
|
@@ -232,10 +232,10 @@ export class FormGroupComponent {
|
|
|
232
232
|
this.validationErrors = '';
|
|
233
233
|
}
|
|
234
234
|
}
|
|
235
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
236
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
235
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: FormGroupComponent, deps: [{ token: i1.ValidationMessageService }, { token: i2.TranslateService }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
236
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: FormGroupComponent, selector: "ec-form-group", inputs: { id: "id", label: "label", formGroup: "formGroup", labelPosition: "labelPosition", overrideValidationError: "overrideValidationError", hideValidationMessage: "hideValidationMessage", helpPopover: "helpPopover", helpPopoverPosition: "helpPopoverPosition" }, host: { properties: { "attr.id": "this.attrId" } }, ngImport: i0, template: "<div class=\"control control-label-{{labelPosition}}\"\r\n [class.ec-untouched]=\"formGroup?.untouched\">\r\n\r\n <label *ngIf=\"label\">\r\n <span id=\"{{id}}_label\">{{label | translate}}</span>\r\n <span *ngIf=\"!hideValidationMessage && validationErrors && formGroup?.touched && formGroup?.invalid\"> {{validationErrors | translate}}</span>\r\n <ec-help-popover id=\"{{id}}_helpPopover\"\r\n *ngIf=\"helpPopover\"\r\n class=\"d-inline-block my-n3 mx-n1\"\r\n text=\"{{helpPopover | translate}}\"\r\n contentPosition=\"{{helpPopoverPosition}}\">\r\n </ec-help-popover>\r\n </label>\r\n\r\n <ng-content></ng-content>\r\n</div>", styles: [":host{color:var(--ec-form-control-color);font-size:var(--ec-form-control-font-size);display:block;margin-bottom:1rem;width:100%}:host :host-context(.form-condensed){margin-bottom:.5rem}:host .control{width:100%;display:flex;flex-direction:column}:host .control.control-label-bottom{flex-direction:column-reverse}:host .control.control-label-left{flex-direction:row}:host .control.control-label-left label{margin-right:.25rem}:host .control.control-label-right{flex-direction:row-reverse}:host .control.control-label-right label{margin-left:.25rem}:host .control.control-label-left,:host .control.control-label-right{align-items:center}:host .control.control-label-left label,:host .control.control-label-right label{flex:1 1;margin-top:0;margin-bottom:0}:host .control.control-label-left .control-input,:host .control.control-label-right .control-input{flex:2 2}:host .control.is-readonly input,:host .control.is-readonly select,:host .control.is-readonly textarea{border-color:var(--ec-form-control-border-color-readonly);background-color:var(--ec-form-control-background-color-readonly);background-clip:border-box;background-image:none;color:var(--ec-form-control-color-readonly);opacity:1;-webkit-user-select:none;user-select:none;pointer-events:none;overflow:hidden;white-space:nowrap}:host .control.invalid .textbox-group-input ::ng-deep .control input.ng-invalid,:host .control.invalid .textbox-group-input ::ng-deep .control input.ng-valid{background-color:var(--ec-form-control-background-color-invalid);border-color:var(--ec-form-control-border-color-invalid);background-repeat:no-repeat;background-position:.5rem center;background-size:1rem,1rem;padding-left:1.75rem;background-image:none}:host .control.invalid .textbox-group-input ::ng-deep .control input.ng-invalid:focus,:host .control.invalid .textbox-group-input ::ng-deep .control input.ng-valid:focus{border-color:var(--ec-form-control-background-color-invalid)}:host .control.invalid .textbox-group-input ::ng-deep .control input.ng-invalid~.icon-invalid,:host .control.invalid .textbox-group-input ::ng-deep .control input.ng-valid~.icon-invalid{display:inline-flex;position:absolute;left:.5rem;top:.5rem;z-index:1}:host .control.invalid .textbox-group-input ::ng-deep .control input.ng-invalid~.icon-required,:host .control.invalid .textbox-group-input ::ng-deep .control input.ng-valid~.icon-required{display:none}:host .control.invalid:not(.open) .textbox-group-btn-right ::ng-deep button{background-color:var(--ec-form-control-background-color-invalid)}:host .control.invalid:not(.open) .textbox-group-btn-right ::ng-deep button:not(:focus){border-color:var(--ec-form-control-border-color-invalid)}:host .textbox-group{display:flex;position:relative}:host textarea:focus,:host input:focus,:host select:focus{outline:none}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}.control.ec-untouched ::ng-deep input.ng-invalid.ng-touched{background-image:none;padding-left:.5rem}.control.ec-untouched ::ng-deep input.ng-invalid.ng-touched:not(.is-empty)~.units-left{left:0}.control.ec-untouched ::ng-deep input:required:not(:disabled).is-empty{background-image:none;background-repeat:no-repeat;background-position:.5rem center;background-size:1rem,1rem;padding-left:1.75rem}.control.ec-untouched ::ng-deep input:required:not(:disabled).is-empty:focus{border-color:var(--ec-form-control-border-color-focus);box-shadow:var(--ec-form-control-box-shadow-focus);position:relative;z-index:1}.control-label-left{display:flex}\n"], dependencies: [{ kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i4.HelpPopoverComponent, selector: "ec-help-popover", inputs: ["id", "text", "contentPosition", "maxWidth"] }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }] }); }
|
|
237
237
|
}
|
|
238
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
238
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: FormGroupComponent, decorators: [{
|
|
239
239
|
type: Component,
|
|
240
240
|
args: [{ selector: 'ec-form-group', template: "<div class=\"control control-label-{{labelPosition}}\"\r\n [class.ec-untouched]=\"formGroup?.untouched\">\r\n\r\n <label *ngIf=\"label\">\r\n <span id=\"{{id}}_label\">{{label | translate}}</span>\r\n <span *ngIf=\"!hideValidationMessage && validationErrors && formGroup?.touched && formGroup?.invalid\"> {{validationErrors | translate}}</span>\r\n <ec-help-popover id=\"{{id}}_helpPopover\"\r\n *ngIf=\"helpPopover\"\r\n class=\"d-inline-block my-n3 mx-n1\"\r\n text=\"{{helpPopover | translate}}\"\r\n contentPosition=\"{{helpPopoverPosition}}\">\r\n </ec-help-popover>\r\n </label>\r\n\r\n <ng-content></ng-content>\r\n</div>", styles: [":host{color:var(--ec-form-control-color);font-size:var(--ec-form-control-font-size);display:block;margin-bottom:1rem;width:100%}:host :host-context(.form-condensed){margin-bottom:.5rem}:host .control{width:100%;display:flex;flex-direction:column}:host .control.control-label-bottom{flex-direction:column-reverse}:host .control.control-label-left{flex-direction:row}:host .control.control-label-left label{margin-right:.25rem}:host .control.control-label-right{flex-direction:row-reverse}:host .control.control-label-right label{margin-left:.25rem}:host .control.control-label-left,:host .control.control-label-right{align-items:center}:host .control.control-label-left label,:host .control.control-label-right label{flex:1 1;margin-top:0;margin-bottom:0}:host .control.control-label-left .control-input,:host .control.control-label-right .control-input{flex:2 2}:host .control.is-readonly input,:host .control.is-readonly select,:host .control.is-readonly textarea{border-color:var(--ec-form-control-border-color-readonly);background-color:var(--ec-form-control-background-color-readonly);background-clip:border-box;background-image:none;color:var(--ec-form-control-color-readonly);opacity:1;-webkit-user-select:none;user-select:none;pointer-events:none;overflow:hidden;white-space:nowrap}:host .control.invalid .textbox-group-input ::ng-deep .control input.ng-invalid,:host .control.invalid .textbox-group-input ::ng-deep .control input.ng-valid{background-color:var(--ec-form-control-background-color-invalid);border-color:var(--ec-form-control-border-color-invalid);background-repeat:no-repeat;background-position:.5rem center;background-size:1rem,1rem;padding-left:1.75rem;background-image:none}:host .control.invalid .textbox-group-input ::ng-deep .control input.ng-invalid:focus,:host .control.invalid .textbox-group-input ::ng-deep .control input.ng-valid:focus{border-color:var(--ec-form-control-background-color-invalid)}:host .control.invalid .textbox-group-input ::ng-deep .control input.ng-invalid~.icon-invalid,:host .control.invalid .textbox-group-input ::ng-deep .control input.ng-valid~.icon-invalid{display:inline-flex;position:absolute;left:.5rem;top:.5rem;z-index:1}:host .control.invalid .textbox-group-input ::ng-deep .control input.ng-invalid~.icon-required,:host .control.invalid .textbox-group-input ::ng-deep .control input.ng-valid~.icon-required{display:none}:host .control.invalid:not(.open) .textbox-group-btn-right ::ng-deep button{background-color:var(--ec-form-control-background-color-invalid)}:host .control.invalid:not(.open) .textbox-group-btn-right ::ng-deep button:not(:focus){border-color:var(--ec-form-control-border-color-invalid)}:host .textbox-group{display:flex;position:relative}:host textarea:focus,:host input:focus,:host select:focus{outline:none}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}.control.ec-untouched ::ng-deep input.ng-invalid.ng-touched{background-image:none;padding-left:.5rem}.control.ec-untouched ::ng-deep input.ng-invalid.ng-touched:not(.is-empty)~.units-left{left:0}.control.ec-untouched ::ng-deep input:required:not(:disabled).is-empty{background-image:none;background-repeat:no-repeat;background-position:.5rem center;background-size:1rem,1rem;padding-left:1.75rem}.control.ec-untouched ::ng-deep input:required:not(:disabled).is-empty:focus{border-color:var(--ec-form-control-border-color-focus);box-shadow:var(--ec-form-control-box-shadow-focus);position:relative;z-index:1}.control-label-left{display:flex}\n"] }]
|
|
241
241
|
}], ctorParameters: () => [{ type: i1.ValidationMessageService }, { type: i2.TranslateService }], propDecorators: { id: [{
|
|
@@ -10,10 +10,10 @@ export class HelpPopoverComponent {
|
|
|
10
10
|
this.contentPosition = 'top-left';
|
|
11
11
|
this.maxWidth = '15rem';
|
|
12
12
|
}
|
|
13
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
14
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
13
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: HelpPopoverComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
14
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: HelpPopoverComponent, selector: "ec-help-popover", inputs: { id: "id", text: "text", contentPosition: "contentPosition", maxWidth: "maxWidth" }, host: { properties: { "attr.id": "this.id" } }, ngImport: i0, template: "<ec-popover id=\"{{id}}_popover\"\r\n icon=\"icon-help-circle\"\r\n [contentPosition]=\"contentPosition\"\r\n iconHoverClass=\"font-color-primary-light\">\r\n <div id=\"{{id}}_popoverContent\"\r\n class=\"popover-content-dark\"\r\n [class.is-right-positioned]=\"contentPosition == 'top-right' || contentPosition == 'bottom-right'\"\r\n [style.max-width]=\"maxWidth\">\r\n <div *ngIf=\"text\"\r\n [innerHTML]=\"text | translate\"></div>\r\n <ng-content></ng-content>\r\n </div>\r\n</ec-popover>", dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.PopoverComponent, selector: "ec-popover", inputs: ["icon", "tag", "tagHoverType", "contentPosition", "iconHoverClass"] }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }] }); }
|
|
15
15
|
}
|
|
16
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
16
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: HelpPopoverComponent, decorators: [{
|
|
17
17
|
type: Component,
|
|
18
18
|
args: [{ selector: 'ec-help-popover', template: "<ec-popover id=\"{{id}}_popover\"\r\n icon=\"icon-help-circle\"\r\n [contentPosition]=\"contentPosition\"\r\n iconHoverClass=\"font-color-primary-light\">\r\n <div id=\"{{id}}_popoverContent\"\r\n class=\"popover-content-dark\"\r\n [class.is-right-positioned]=\"contentPosition == 'top-right' || contentPosition == 'bottom-right'\"\r\n [style.max-width]=\"maxWidth\">\r\n <div *ngIf=\"text\"\r\n [innerHTML]=\"text | translate\"></div>\r\n <ng-content></ng-content>\r\n </div>\r\n</ec-popover>" }]
|
|
19
19
|
}], ctorParameters: () => [], propDecorators: { id: [{
|
|
@@ -278,10 +278,10 @@ export class ItemPickerComponent {
|
|
|
278
278
|
this.internalizedSelectedItemTemplate = this.defaultSelectedItemTemplate;
|
|
279
279
|
}
|
|
280
280
|
}
|
|
281
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
282
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: ItemPickerComponent, selector: "ec-item-picker", inputs: { id: "id", availableTitle: "availableTitle", availableTitleHelpPopover: "availableTitleHelpPopover", selectedTitle: "selectedTitle", itemName: "itemName", formModel: "formModel", customAvailableHeaderTemplate: "customAvailableHeaderTemplate", customAvailableItemTemplate: "customAvailableItemTemplate", customSelectedItemTemplate: "customSelectedItemTemplate", ready: "ready", getItems: "getItems", selectionContext: "selectionContext", noDataMessage: "noDataMessage", noSelectedItemsMessage: "noSelectedItemsMessage", enableSelectAllItems: "enableSelectAllItems", selectAllItemsMessage: "selectAllItemsMessage" }, viewQueries: [{ propertyName: "defaultAvailableHeaderTemplate", first: true, predicate: ["defaultAvailableHeaderTemplate"], descendants: true, static: true }, { propertyName: "defaultAvailableItemTemplate", first: true, predicate: ["defaultAvailableItemTemplate"], descendants: true, static: true }, { propertyName: "defaultSelectedItemTemplate", first: true, predicate: ["defaultSelectedItemTemplate"], descendants: true, static: true }], usesOnChanges: true, ngImport: i0, template: "<div ecOverlay\r\n class=\"d-flex flex-grow card\"\r\n [status]=\"tableStatus?.status\"\r\n [message]=\"tableStatus?.message\"\r\n [displayAsMask]=\"true\">\r\n <ec-searchable-table id=\"{{id}}_searchableTable\"\r\n class=\"flex-grow\"\r\n [fillParentHeight]=\"true\"\r\n [hideHeader]=\"true\"\r\n [hideSearchControl]=\"true\"\r\n [removeCard]=\"true\"\r\n [pageable]=\"true\"\r\n [pageSize]=\"50\"\r\n [objectType]=\"itemName\"\r\n [formModel]=\"formModel\"\r\n [ready]=\"ready\"\r\n [getItems]=\"getItems\"\r\n [selectable]=\"true\"\r\n [noDataMessage]=\"noDataMessage\"\r\n [selectionContext]=\"selectionContext\"\r\n [status]=\"tableStatus\"\r\n (itemsChange)=\"onItemsChange($event)\"\r\n [style.--ec-searchable-table-flex-properties]=\"(availableItems.length || tableStatus.status === 'pending' || tableStatus.status === 'error' ) ? '1 1 auto' : '0 1 auto'\"\r\n [style.--ec-searchable-table-height-caption-footer]=\"'calc(2.5rem + 1px)'\"\r\n [tableLayoutFixed]=\"true\"\r\n [disablePaginationControls]=\"disablePaginationControls\">\r\n <header *ngIf=\"customAvailableHeaderTemplate\"\r\n class=\"card-header flex-shrink\"\r\n style=\"height: 3rem;\">\r\n <h3 class=\"card-title\">{{availableTitle | translate}}\r\n <ec-help-popover id=\"availableTitle_helpPopover\"\r\n *ngIf=\"availableTitleHelpPopover\"\r\n class=\"d-inline-block my-n3 mx-n1\"\r\n text=\"{{availableTitleHelpPopover | translate}}\">\r\n </ec-help-popover>\r\n </h3>\r\n </header>\r\n <thead>\r\n <tr ecTableSelectableRow\r\n [selectionContext]=\"selectionContext\"\r\n class=\"border-bottom-0\">\r\n <ng-container *ngTemplateOutlet=\"internalizedAvailableHeaderTemplate;\"></ng-container>\r\n </tr>\r\n </thead>\r\n\r\n <tbody>\r\n <ng-container *ngFor=\"let item of availableItems; index as rowIndex; trackBy: trackByIndex\">\r\n <tr ecTableSelectableRow\r\n [selectionContext]=\"selectionContext\"\r\n [rowIndex]=\"rowIndex\"\r\n [isCheckboxDisabled]=\"item.preventRemove || selectionContext.isSelectingAllItems\"\r\n [isSelected]=\"selectionContext?.selectedItemsMap.has(item.id) || selectionContext.isSelectingAllItems\"\r\n [style.--ec-table-selectable-row-vertical-align-checkbox-td]=\"'middle'\">\r\n <ng-container *ngTemplateOutlet=\"internalizedAvailableItemTemplate; context: {$implicit: item}\">\r\n </ng-container>\r\n </tr>\r\n </ng-container>\r\n </tbody>\r\n </ec-searchable-table>\r\n\r\n <section id=\"{{id}}_selectedItems\"\r\n class=\"selected-items flex-grow d-flex flex-column\">\r\n <div *ngIf=\"selectionContext.isSelectingAllItems\"\r\n class=\"d-flex flex-column flex-grow\">\r\n <header class=\"d-flex align-items-center px-2 text-heading-2\"\r\n style=\"height: 3rem;\">\r\n <span class=\"flex-grow text-truncate\">{{selectedTitle | translate}}</span>\r\n <button *ngIf=\"selectedItemsClearable\"\r\n ecLinkButton\r\n id=\"{{id}}_clearSelection\"\r\n class=\"pl-2 ml-auto\"\r\n (click)=\"onClearSelectionClick()\"\r\n translate>ClearSelection_TC</button>\r\n </header>\r\n <div class=\"text-center border-top flex-grow d-flex align-items-center justify-content-center text-heading-2\"\r\n [style.padding-left.rem]=\"4\"\r\n [style.padding-right.rem]=\"4\"\r\n [innerHtml]=\"selectAllItemsMessage | translate\"></div>\r\n </div>\r\n <ec-table *ngIf=\"!selectionContext.isSelectingAllItems\"\r\n [scrollable]=\"true\"\r\n class=\"d-flex flex-grow is-fixed\">\r\n <colgroup>\r\n <col>\r\n <col style=\"width: 2rem;\">\r\n </colgroup>\r\n <thead>\r\n <tr style=\"height: 3rem;\">\r\n <th colspan=\"2\"\r\n class=\"p-2 border-bottom-0\">\r\n <div class=\"d-flex align-items-center text-heading-2\">\r\n <span class=\"flex-grow text-truncate\">{{selectedTitle | translate}}</span>\r\n <button *ngIf=\"selectedItemsClearable\"\r\n ecLinkButton\r\n id=\"{{id}}_clearSelection\"\r\n class=\"pl-2 ml-auto\"\r\n (click)=\"onClearSelectionClick()\"\r\n translate>ClearSelection_TC</button>\r\n </div>\r\n </th>\r\n </tr>\r\n </thead>\r\n\r\n <tbody>\r\n <ng-container *ngIf=\"selectedItems.length\">\r\n <tr *ngFor=\"let item of selectedItems; last as isLast\"\r\n id=\"selected_row_{{item.id}}\"\r\n [class.border-bottom]=\"!isLast\">\r\n <td class=\"p-2\">\r\n <ng-container\r\n *ngTemplateOutlet=\"internalizedSelectedItemTemplate; context: {$implicit: item}\">\r\n </ng-container>\r\n </td>\r\n\r\n <td class=\"actions-col text-right\"\r\n style=\"vertical-align: middle;\">\r\n <ec-button id=\"{{id}}_removeSelected_{{item.id}}\"\r\n *ngIf=\"!item.preventRemove\"\r\n type=\"icon\"\r\n icon=\"ec-icon icon-cancel\"\r\n (clicked)=\"removeSelectedItem(item)\">\r\n </ec-button>\r\n </td>\r\n </tr>\r\n </ng-container>\r\n <tr *ngIf=\"!selectedItems.length\">\r\n <td *ngIf=\"!noSelectedItemsMessage\"\r\n colspan=\"2\"\r\n class=\"p-2 no-data-message\"\r\n translate\r\n [translateParams]=\"{itemName: itemName | translate}\">ItemPickerNoItemsSelected_SC</td>\r\n <td *ngIf=\"noSelectedItemsMessage\"\r\n colspan=\"2\"\r\n class=\"p-2 no-data-message\"\r\n translate>{{noSelectedItemsMessage}}</td>\r\n </tr>\r\n </tbody>\r\n </ec-table>\r\n\r\n <footer id=\"selectedItemsFooter\"\r\n *ngIf=\"selectedItems.length && !selectionContext.isSelectingAllItems\"\r\n class=\"d-flex flex-shrink px-2 border-top align-items-center\">\r\n <div class=\"ml-auto my-2 d-flex align-items-center\"\r\n style=\"height: 1.75rem;\">\r\n <span class=\"text-caption-1 font-color-hint\">{{selectedItems.length}} {{itemName | translate}}</span>\r\n </div>\r\n </footer>\r\n </section>\r\n</div>\r\n\r\n<ng-template #defaultAvailableHeaderTemplate>\r\n <th class=\"text-heading-2 font-color-primary border-bottom-0\">\r\n <div class=\"d-flex align-items-center \">\r\n <div *ngIf=\"!availableCheckboxText\">\r\n <span class=\"text-truncate\">{{availableTitle | translate}}</span>\r\n <ec-help-popover id=\"availableTitle_helpPopover\"\r\n *ngIf=\"availableTitleHelpPopover\"\r\n class=\"d-inline-block my-n3 mx-n1\"\r\n text=\"{{availableTitleHelpPopover | translate}}\">\r\n </ec-help-popover>\r\n </div>\r\n <span *ngIf=\"availableCheckboxText\"\r\n id=\"selectedCount\">{{availableCheckboxText}}</span>\r\n <button *ngIf=\"showSelectAllItemsButton\"\r\n ecLinkButton\r\n id=\"selectAllItemsButton\"\r\n (click)=\"selectAllItems()\"\r\n class=\"ml-2\">\r\n {{ ('SelectAllItemPickerItems_TC') | translate:{ count: totalItemsBeforePaging, itemName: itemName } }}\r\n </button>\r\n </div>\r\n </th>\r\n</ng-template>\r\n\r\n<ng-template #defaultAvailableItemTemplate\r\n let-item>\r\n <td>{{item.label}}</td>\r\n</ng-template>\r\n\r\n<ng-template #defaultSelectedItemTemplate\r\n let-item>\r\n {{item.label}}\r\n</ng-template>", styles: [":host{display:flex}ec-searchable-table{border-right:2px solid var(--ec-border-color)}.selected-items{max-width:var(--ec-item-picker-max-width-selected-items, 50%)}.no-data-message{white-space:normal}\n"], dependencies: [{ kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1.TranslateDirective, selector: "[translate],[ngx-translate]", inputs: ["translate", "translateParams"] }, { kind: "component", type: i3.ButtonComponent, selector: "ec-button", inputs: ["id", "disabled", "icon", "label", "badge", "tabindex", "type", "pending", "pendingIcon", "customTemplate", "isSubmit", "autofocus"], outputs: ["clicked"] }, { kind: "component", type: i4.ViewOverlayComponent, selector: "[ecOverlay]", inputs: ["status", "message", "action", "noDataTemplate", "displayAsMask", "overlayClassList"] }, { kind: "component", type: i5.TableComponent, selector: "ec-table", inputs: ["id", "scrollable", "resizable", "condensed", "sortable", "selectionContext", "selectionToolbarTemplate", "selectable", "isForm", "sort", "resizableColumns"], outputs: ["sortChange"] }, { kind: "component", type: i6.SearchableTableComponent, selector: "ec-searchable-table", inputs: ["id", "resizable", "sortable", "sort", "autofocus", "tableClasses", "searchboxPlaceholder", "formModel", "noDataMessage", "noSearchResultsMessage", "ready", "getItems", "refresh", "status", "tableLayoutFixed", "searchboxTabIndex", "maxItemCount", "hideSearchControl", "hideHeader", "objectType", "hideFooter", "pageable", "pageSize", "maxTabs", "searchboxReadonly", "selectionContext", "selectionToolbarTemplate", "additionalCountText", "selectable", "customContentTemplate", "removeCard", "overlayClasses", "fillParentHeight", "disablePaginationControls"], outputs: ["sortChange", "pageChange", "itemsChange"] }, { kind: "component", type: i7.TableSelectableRowComponent, selector: "[ecTableSelectableRow]", inputs: ["id", "ecTableSelectableRow", "selectionContext", "rowIndex", "lockedColOptions", "isSelected", "isCheckboxDisabled"] }, { kind: "component", type: i8.HelpPopoverComponent, selector: "ec-help-popover", inputs: ["id", "text", "contentPosition", "maxWidth"] }, { kind: "component", type: i9.LinkButtonComponent, selector: "button[ecLinkButton]" }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }] }); }
|
|
281
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ItemPickerComponent, deps: [{ token: i1.TranslateService }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
282
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: ItemPickerComponent, selector: "ec-item-picker", inputs: { id: "id", availableTitle: "availableTitle", availableTitleHelpPopover: "availableTitleHelpPopover", selectedTitle: "selectedTitle", itemName: "itemName", formModel: "formModel", customAvailableHeaderTemplate: "customAvailableHeaderTemplate", customAvailableItemTemplate: "customAvailableItemTemplate", customSelectedItemTemplate: "customSelectedItemTemplate", ready: "ready", getItems: "getItems", selectionContext: "selectionContext", noDataMessage: "noDataMessage", noSelectedItemsMessage: "noSelectedItemsMessage", enableSelectAllItems: "enableSelectAllItems", selectAllItemsMessage: "selectAllItemsMessage" }, viewQueries: [{ propertyName: "defaultAvailableHeaderTemplate", first: true, predicate: ["defaultAvailableHeaderTemplate"], descendants: true, static: true }, { propertyName: "defaultAvailableItemTemplate", first: true, predicate: ["defaultAvailableItemTemplate"], descendants: true, static: true }, { propertyName: "defaultSelectedItemTemplate", first: true, predicate: ["defaultSelectedItemTemplate"], descendants: true, static: true }], usesOnChanges: true, ngImport: i0, template: "<div ecOverlay\r\n class=\"d-flex flex-grow card\"\r\n [status]=\"tableStatus?.status\"\r\n [message]=\"tableStatus?.message\"\r\n [displayAsMask]=\"true\">\r\n <ec-searchable-table id=\"{{id}}_searchableTable\"\r\n class=\"flex-grow\"\r\n [fillParentHeight]=\"true\"\r\n [hideHeader]=\"true\"\r\n [hideSearchControl]=\"true\"\r\n [removeCard]=\"true\"\r\n [pageable]=\"true\"\r\n [pageSize]=\"50\"\r\n [objectType]=\"itemName\"\r\n [formModel]=\"formModel\"\r\n [ready]=\"ready\"\r\n [getItems]=\"getItems\"\r\n [selectable]=\"true\"\r\n [noDataMessage]=\"noDataMessage\"\r\n [selectionContext]=\"selectionContext\"\r\n [status]=\"tableStatus\"\r\n (itemsChange)=\"onItemsChange($event)\"\r\n [style.--ec-searchable-table-flex-properties]=\"(availableItems.length || tableStatus.status === 'pending' || tableStatus.status === 'error' ) ? '1 1 auto' : '0 1 auto'\"\r\n [style.--ec-searchable-table-height-caption-footer]=\"'calc(2.5rem + 1px)'\"\r\n [tableLayoutFixed]=\"true\"\r\n [disablePaginationControls]=\"disablePaginationControls\">\r\n <header *ngIf=\"customAvailableHeaderTemplate\"\r\n class=\"card-header flex-shrink\"\r\n style=\"height: 3rem;\">\r\n <h3 class=\"card-title\">{{availableTitle | translate}}\r\n <ec-help-popover id=\"availableTitle_helpPopover\"\r\n *ngIf=\"availableTitleHelpPopover\"\r\n class=\"d-inline-block my-n3 mx-n1\"\r\n text=\"{{availableTitleHelpPopover | translate}}\">\r\n </ec-help-popover>\r\n </h3>\r\n </header>\r\n <thead>\r\n <tr ecTableSelectableRow\r\n [selectionContext]=\"selectionContext\"\r\n class=\"border-bottom-0\">\r\n <ng-container *ngTemplateOutlet=\"internalizedAvailableHeaderTemplate;\"></ng-container>\r\n </tr>\r\n </thead>\r\n\r\n <tbody>\r\n <ng-container *ngFor=\"let item of availableItems; index as rowIndex; trackBy: trackByIndex\">\r\n <tr ecTableSelectableRow\r\n [selectionContext]=\"selectionContext\"\r\n [rowIndex]=\"rowIndex\"\r\n [isCheckboxDisabled]=\"item.preventRemove || selectionContext.isSelectingAllItems\"\r\n [isSelected]=\"selectionContext?.selectedItemsMap.has(item.id) || selectionContext.isSelectingAllItems\"\r\n [style.--ec-table-selectable-row-vertical-align-checkbox-td]=\"'middle'\">\r\n <ng-container *ngTemplateOutlet=\"internalizedAvailableItemTemplate; context: {$implicit: item}\">\r\n </ng-container>\r\n </tr>\r\n </ng-container>\r\n </tbody>\r\n </ec-searchable-table>\r\n\r\n <section id=\"{{id}}_selectedItems\"\r\n class=\"selected-items flex-grow d-flex flex-column\">\r\n <div *ngIf=\"selectionContext.isSelectingAllItems\"\r\n class=\"d-flex flex-column flex-grow\">\r\n <header class=\"d-flex align-items-center px-2 text-heading-2\"\r\n style=\"height: 3rem;\">\r\n <span class=\"flex-grow text-truncate\">{{selectedTitle | translate}}</span>\r\n <button *ngIf=\"selectedItemsClearable\"\r\n ecLinkButton\r\n id=\"{{id}}_clearSelection\"\r\n class=\"pl-2 ml-auto\"\r\n (click)=\"onClearSelectionClick()\"\r\n translate>ClearSelection_TC</button>\r\n </header>\r\n <div class=\"text-center border-top flex-grow d-flex align-items-center justify-content-center text-heading-2\"\r\n [style.padding-left.rem]=\"4\"\r\n [style.padding-right.rem]=\"4\"\r\n [innerHtml]=\"selectAllItemsMessage | translate\"></div>\r\n </div>\r\n <ec-table *ngIf=\"!selectionContext.isSelectingAllItems\"\r\n [scrollable]=\"true\"\r\n class=\"d-flex flex-grow is-fixed\">\r\n <colgroup>\r\n <col>\r\n <col style=\"width: 2rem;\">\r\n </colgroup>\r\n <thead>\r\n <tr style=\"height: 3rem;\">\r\n <th colspan=\"2\"\r\n class=\"p-2 border-bottom-0\">\r\n <div class=\"d-flex align-items-center text-heading-2\">\r\n <span class=\"flex-grow text-truncate\">{{selectedTitle | translate}}</span>\r\n <button *ngIf=\"selectedItemsClearable\"\r\n ecLinkButton\r\n id=\"{{id}}_clearSelection\"\r\n class=\"pl-2 ml-auto\"\r\n (click)=\"onClearSelectionClick()\"\r\n translate>ClearSelection_TC</button>\r\n </div>\r\n </th>\r\n </tr>\r\n </thead>\r\n\r\n <tbody>\r\n <ng-container *ngIf=\"selectedItems.length\">\r\n <tr *ngFor=\"let item of selectedItems; last as isLast\"\r\n id=\"selected_row_{{item.id}}\"\r\n [class.border-bottom]=\"!isLast\">\r\n <td class=\"p-2\">\r\n <ng-container\r\n *ngTemplateOutlet=\"internalizedSelectedItemTemplate; context: {$implicit: item}\">\r\n </ng-container>\r\n </td>\r\n\r\n <td class=\"actions-col text-right\"\r\n style=\"vertical-align: middle;\">\r\n <ec-button id=\"{{id}}_removeSelected_{{item.id}}\"\r\n *ngIf=\"!item.preventRemove\"\r\n type=\"icon\"\r\n icon=\"ec-icon icon-cancel\"\r\n (clicked)=\"removeSelectedItem(item)\">\r\n </ec-button>\r\n </td>\r\n </tr>\r\n </ng-container>\r\n <tr *ngIf=\"!selectedItems.length\">\r\n <td *ngIf=\"!noSelectedItemsMessage\"\r\n colspan=\"2\"\r\n class=\"p-2 no-data-message\"\r\n translate\r\n [translateParams]=\"{itemName: itemName | translate}\">ItemPickerNoItemsSelected_SC</td>\r\n <td *ngIf=\"noSelectedItemsMessage\"\r\n colspan=\"2\"\r\n class=\"p-2 no-data-message\"\r\n translate>{{noSelectedItemsMessage}}</td>\r\n </tr>\r\n </tbody>\r\n </ec-table>\r\n\r\n <footer id=\"selectedItemsFooter\"\r\n *ngIf=\"selectedItems.length && !selectionContext.isSelectingAllItems\"\r\n class=\"d-flex flex-shrink px-2 border-top align-items-center\">\r\n <div class=\"ml-auto my-2 d-flex align-items-center\"\r\n style=\"height: 1.75rem;\">\r\n <span class=\"text-caption-1 font-color-hint\">{{selectedItems.length}} {{itemName | translate}}</span>\r\n </div>\r\n </footer>\r\n </section>\r\n</div>\r\n\r\n<ng-template #defaultAvailableHeaderTemplate>\r\n <th class=\"text-heading-2 font-color-primary border-bottom-0\">\r\n <div class=\"d-flex align-items-center \">\r\n <div *ngIf=\"!availableCheckboxText\">\r\n <span class=\"text-truncate\">{{availableTitle | translate}}</span>\r\n <ec-help-popover id=\"availableTitle_helpPopover\"\r\n *ngIf=\"availableTitleHelpPopover\"\r\n class=\"d-inline-block my-n3 mx-n1\"\r\n text=\"{{availableTitleHelpPopover | translate}}\">\r\n </ec-help-popover>\r\n </div>\r\n <span *ngIf=\"availableCheckboxText\"\r\n id=\"selectedCount\">{{availableCheckboxText}}</span>\r\n <button *ngIf=\"showSelectAllItemsButton\"\r\n ecLinkButton\r\n id=\"selectAllItemsButton\"\r\n (click)=\"selectAllItems()\"\r\n class=\"ml-2\">\r\n {{ ('SelectAllItemPickerItems_TC') | translate:{ count: totalItemsBeforePaging, itemName: itemName } }}\r\n </button>\r\n </div>\r\n </th>\r\n</ng-template>\r\n\r\n<ng-template #defaultAvailableItemTemplate\r\n let-item>\r\n <td>{{item.label}}</td>\r\n</ng-template>\r\n\r\n<ng-template #defaultSelectedItemTemplate\r\n let-item>\r\n {{item.label}}\r\n</ng-template>", styles: [":host{display:flex}ec-searchable-table{border-right:2px solid var(--ec-border-color)}.selected-items{max-width:var(--ec-item-picker-max-width-selected-items, 50%)}.no-data-message{white-space:normal}\n"], dependencies: [{ kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1.TranslateDirective, selector: "[translate],[ngx-translate]", inputs: ["translate", "translateParams"] }, { kind: "component", type: i3.ButtonComponent, selector: "ec-button", inputs: ["id", "disabled", "icon", "label", "badge", "tabindex", "type", "pending", "pendingIcon", "customTemplate", "isSubmit", "autofocus"], outputs: ["clicked"] }, { kind: "component", type: i4.ViewOverlayComponent, selector: "[ecOverlay]", inputs: ["status", "message", "action", "noDataTemplate", "displayAsMask", "overlayClassList"] }, { kind: "component", type: i5.TableComponent, selector: "ec-table", inputs: ["id", "scrollable", "resizable", "condensed", "sortable", "selectionContext", "selectionToolbarTemplate", "selectable", "isForm", "sort", "resizableColumns"], outputs: ["sortChange"] }, { kind: "component", type: i6.SearchableTableComponent, selector: "ec-searchable-table", inputs: ["id", "resizable", "sortable", "sort", "autofocus", "tableClasses", "searchboxPlaceholder", "formModel", "noDataMessage", "noSearchResultsMessage", "ready", "getItems", "refresh", "status", "tableLayoutFixed", "searchboxTabIndex", "maxItemCount", "hideSearchControl", "hideHeader", "objectType", "hideFooter", "pageable", "pageSize", "maxTabs", "searchboxReadonly", "selectionContext", "selectionToolbarTemplate", "additionalCountText", "selectable", "customContentTemplate", "removeCard", "overlayClasses", "fillParentHeight", "disablePaginationControls"], outputs: ["sortChange", "pageChange", "itemsChange"] }, { kind: "component", type: i7.TableSelectableRowComponent, selector: "[ecTableSelectableRow]", inputs: ["id", "ecTableSelectableRow", "selectionContext", "rowIndex", "lockedColOptions", "isSelected", "isCheckboxDisabled"] }, { kind: "component", type: i8.HelpPopoverComponent, selector: "ec-help-popover", inputs: ["id", "text", "contentPosition", "maxWidth"] }, { kind: "component", type: i9.LinkButtonComponent, selector: "button[ecLinkButton]" }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }] }); }
|
|
283
283
|
}
|
|
284
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
284
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ItemPickerComponent, decorators: [{
|
|
285
285
|
type: Component,
|
|
286
286
|
args: [{ selector: 'ec-item-picker', template: "<div ecOverlay\r\n class=\"d-flex flex-grow card\"\r\n [status]=\"tableStatus?.status\"\r\n [message]=\"tableStatus?.message\"\r\n [displayAsMask]=\"true\">\r\n <ec-searchable-table id=\"{{id}}_searchableTable\"\r\n class=\"flex-grow\"\r\n [fillParentHeight]=\"true\"\r\n [hideHeader]=\"true\"\r\n [hideSearchControl]=\"true\"\r\n [removeCard]=\"true\"\r\n [pageable]=\"true\"\r\n [pageSize]=\"50\"\r\n [objectType]=\"itemName\"\r\n [formModel]=\"formModel\"\r\n [ready]=\"ready\"\r\n [getItems]=\"getItems\"\r\n [selectable]=\"true\"\r\n [noDataMessage]=\"noDataMessage\"\r\n [selectionContext]=\"selectionContext\"\r\n [status]=\"tableStatus\"\r\n (itemsChange)=\"onItemsChange($event)\"\r\n [style.--ec-searchable-table-flex-properties]=\"(availableItems.length || tableStatus.status === 'pending' || tableStatus.status === 'error' ) ? '1 1 auto' : '0 1 auto'\"\r\n [style.--ec-searchable-table-height-caption-footer]=\"'calc(2.5rem + 1px)'\"\r\n [tableLayoutFixed]=\"true\"\r\n [disablePaginationControls]=\"disablePaginationControls\">\r\n <header *ngIf=\"customAvailableHeaderTemplate\"\r\n class=\"card-header flex-shrink\"\r\n style=\"height: 3rem;\">\r\n <h3 class=\"card-title\">{{availableTitle | translate}}\r\n <ec-help-popover id=\"availableTitle_helpPopover\"\r\n *ngIf=\"availableTitleHelpPopover\"\r\n class=\"d-inline-block my-n3 mx-n1\"\r\n text=\"{{availableTitleHelpPopover | translate}}\">\r\n </ec-help-popover>\r\n </h3>\r\n </header>\r\n <thead>\r\n <tr ecTableSelectableRow\r\n [selectionContext]=\"selectionContext\"\r\n class=\"border-bottom-0\">\r\n <ng-container *ngTemplateOutlet=\"internalizedAvailableHeaderTemplate;\"></ng-container>\r\n </tr>\r\n </thead>\r\n\r\n <tbody>\r\n <ng-container *ngFor=\"let item of availableItems; index as rowIndex; trackBy: trackByIndex\">\r\n <tr ecTableSelectableRow\r\n [selectionContext]=\"selectionContext\"\r\n [rowIndex]=\"rowIndex\"\r\n [isCheckboxDisabled]=\"item.preventRemove || selectionContext.isSelectingAllItems\"\r\n [isSelected]=\"selectionContext?.selectedItemsMap.has(item.id) || selectionContext.isSelectingAllItems\"\r\n [style.--ec-table-selectable-row-vertical-align-checkbox-td]=\"'middle'\">\r\n <ng-container *ngTemplateOutlet=\"internalizedAvailableItemTemplate; context: {$implicit: item}\">\r\n </ng-container>\r\n </tr>\r\n </ng-container>\r\n </tbody>\r\n </ec-searchable-table>\r\n\r\n <section id=\"{{id}}_selectedItems\"\r\n class=\"selected-items flex-grow d-flex flex-column\">\r\n <div *ngIf=\"selectionContext.isSelectingAllItems\"\r\n class=\"d-flex flex-column flex-grow\">\r\n <header class=\"d-flex align-items-center px-2 text-heading-2\"\r\n style=\"height: 3rem;\">\r\n <span class=\"flex-grow text-truncate\">{{selectedTitle | translate}}</span>\r\n <button *ngIf=\"selectedItemsClearable\"\r\n ecLinkButton\r\n id=\"{{id}}_clearSelection\"\r\n class=\"pl-2 ml-auto\"\r\n (click)=\"onClearSelectionClick()\"\r\n translate>ClearSelection_TC</button>\r\n </header>\r\n <div class=\"text-center border-top flex-grow d-flex align-items-center justify-content-center text-heading-2\"\r\n [style.padding-left.rem]=\"4\"\r\n [style.padding-right.rem]=\"4\"\r\n [innerHtml]=\"selectAllItemsMessage | translate\"></div>\r\n </div>\r\n <ec-table *ngIf=\"!selectionContext.isSelectingAllItems\"\r\n [scrollable]=\"true\"\r\n class=\"d-flex flex-grow is-fixed\">\r\n <colgroup>\r\n <col>\r\n <col style=\"width: 2rem;\">\r\n </colgroup>\r\n <thead>\r\n <tr style=\"height: 3rem;\">\r\n <th colspan=\"2\"\r\n class=\"p-2 border-bottom-0\">\r\n <div class=\"d-flex align-items-center text-heading-2\">\r\n <span class=\"flex-grow text-truncate\">{{selectedTitle | translate}}</span>\r\n <button *ngIf=\"selectedItemsClearable\"\r\n ecLinkButton\r\n id=\"{{id}}_clearSelection\"\r\n class=\"pl-2 ml-auto\"\r\n (click)=\"onClearSelectionClick()\"\r\n translate>ClearSelection_TC</button>\r\n </div>\r\n </th>\r\n </tr>\r\n </thead>\r\n\r\n <tbody>\r\n <ng-container *ngIf=\"selectedItems.length\">\r\n <tr *ngFor=\"let item of selectedItems; last as isLast\"\r\n id=\"selected_row_{{item.id}}\"\r\n [class.border-bottom]=\"!isLast\">\r\n <td class=\"p-2\">\r\n <ng-container\r\n *ngTemplateOutlet=\"internalizedSelectedItemTemplate; context: {$implicit: item}\">\r\n </ng-container>\r\n </td>\r\n\r\n <td class=\"actions-col text-right\"\r\n style=\"vertical-align: middle;\">\r\n <ec-button id=\"{{id}}_removeSelected_{{item.id}}\"\r\n *ngIf=\"!item.preventRemove\"\r\n type=\"icon\"\r\n icon=\"ec-icon icon-cancel\"\r\n (clicked)=\"removeSelectedItem(item)\">\r\n </ec-button>\r\n </td>\r\n </tr>\r\n </ng-container>\r\n <tr *ngIf=\"!selectedItems.length\">\r\n <td *ngIf=\"!noSelectedItemsMessage\"\r\n colspan=\"2\"\r\n class=\"p-2 no-data-message\"\r\n translate\r\n [translateParams]=\"{itemName: itemName | translate}\">ItemPickerNoItemsSelected_SC</td>\r\n <td *ngIf=\"noSelectedItemsMessage\"\r\n colspan=\"2\"\r\n class=\"p-2 no-data-message\"\r\n translate>{{noSelectedItemsMessage}}</td>\r\n </tr>\r\n </tbody>\r\n </ec-table>\r\n\r\n <footer id=\"selectedItemsFooter\"\r\n *ngIf=\"selectedItems.length && !selectionContext.isSelectingAllItems\"\r\n class=\"d-flex flex-shrink px-2 border-top align-items-center\">\r\n <div class=\"ml-auto my-2 d-flex align-items-center\"\r\n style=\"height: 1.75rem;\">\r\n <span class=\"text-caption-1 font-color-hint\">{{selectedItems.length}} {{itemName | translate}}</span>\r\n </div>\r\n </footer>\r\n </section>\r\n</div>\r\n\r\n<ng-template #defaultAvailableHeaderTemplate>\r\n <th class=\"text-heading-2 font-color-primary border-bottom-0\">\r\n <div class=\"d-flex align-items-center \">\r\n <div *ngIf=\"!availableCheckboxText\">\r\n <span class=\"text-truncate\">{{availableTitle | translate}}</span>\r\n <ec-help-popover id=\"availableTitle_helpPopover\"\r\n *ngIf=\"availableTitleHelpPopover\"\r\n class=\"d-inline-block my-n3 mx-n1\"\r\n text=\"{{availableTitleHelpPopover | translate}}\">\r\n </ec-help-popover>\r\n </div>\r\n <span *ngIf=\"availableCheckboxText\"\r\n id=\"selectedCount\">{{availableCheckboxText}}</span>\r\n <button *ngIf=\"showSelectAllItemsButton\"\r\n ecLinkButton\r\n id=\"selectAllItemsButton\"\r\n (click)=\"selectAllItems()\"\r\n class=\"ml-2\">\r\n {{ ('SelectAllItemPickerItems_TC') | translate:{ count: totalItemsBeforePaging, itemName: itemName } }}\r\n </button>\r\n </div>\r\n </th>\r\n</ng-template>\r\n\r\n<ng-template #defaultAvailableItemTemplate\r\n let-item>\r\n <td>{{item.label}}</td>\r\n</ng-template>\r\n\r\n<ng-template #defaultSelectedItemTemplate\r\n let-item>\r\n {{item.label}}\r\n</ng-template>", styles: [":host{display:flex}ec-searchable-table{border-right:2px solid var(--ec-border-color)}.selected-items{max-width:var(--ec-item-picker-max-width-selected-items, 50%)}.no-data-message{white-space:normal}\n"] }]
|
|
287
287
|
}], ctorParameters: () => [{ type: i1.TranslateService }], propDecorators: { id: [{
|