@eui/components 17.0.3-snapshot-1702889390678 → 17.0.3-snapshot-1703039070543
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/docs/components/EuiDatepickerComponent.html +416 -1547
- package/docs/dependencies.html +2 -2
- package/docs/js/search/search_index.js +2 -2
- package/esm2022/eui-datepicker/eui-datepicker.component.mjs +67 -105
- package/esm2022/layout/eui-app/eui-app-breadcrumb/breadcrumb.component.mjs +2 -2
- package/esm2022/layout/eui-breadcrumb/breadcrumb.component.mjs +2 -2
- package/esm2022/layout/eui-breadcrumb/collapsed-breadcrumb/collapsed-breadcrumb.component.mjs +2 -2
- package/esm2022/layout/eui-breadcrumb/item/breadcrumb-item.component.mjs +2 -2
- package/eui-datepicker/eui-datepicker.component.d.ts +28 -36
- package/eui-datepicker/eui-datepicker.component.d.ts.map +1 -1
- package/fesm2022/eui-components-eui-datepicker.mjs +66 -104
- package/fesm2022/eui-components-eui-datepicker.mjs.map +1 -1
- package/fesm2022/eui-components-layout.mjs +8 -8
- package/fesm2022/eui-components-layout.mjs.map +1 -1
- package/package.json +7 -7
|
@@ -1,12 +1,12 @@
|
|
|
1
1
|
import * as i0 from '@angular/core';
|
|
2
|
-
import { EventEmitter, Injector, forwardRef, Component, ViewEncapsulation, Optional, Inject, Self, ViewChild, ContentChild, Output, Input,
|
|
3
|
-
import * as
|
|
2
|
+
import { EventEmitter, Injector, forwardRef, booleanAttribute, Component, ViewEncapsulation, Optional, Inject, Self, HostBinding, ViewChild, ContentChild, Output, Input, Directive, NgModule } from '@angular/core';
|
|
3
|
+
import * as i6 from '@angular/common';
|
|
4
4
|
import { CommonModule } from '@angular/common';
|
|
5
|
-
import * as
|
|
5
|
+
import * as i7 from '@angular/material/datepicker';
|
|
6
6
|
import { MatDatepickerModule } from '@angular/material/datepicker';
|
|
7
7
|
import * as i1 from '@angular/material/core';
|
|
8
8
|
import { MAT_DATE_FORMATS, DateAdapter, MAT_DATE_LOCALE } from '@angular/material/core';
|
|
9
|
-
import * as
|
|
9
|
+
import * as i5 from '@angular/forms';
|
|
10
10
|
import { FormControl, FormsModule, ReactiveFormsModule } from '@angular/forms';
|
|
11
11
|
import * as i2 from '@ngx-translate/core';
|
|
12
12
|
import { TranslateModule } from '@ngx-translate/core';
|
|
@@ -18,81 +18,25 @@ import _rollupMoment from 'moment';
|
|
|
18
18
|
import { EuiTimepickerComponent, EuiTimepickerModule } from '@eui/components/eui-timepicker';
|
|
19
19
|
import * as i3 from '@eui/core';
|
|
20
20
|
import { DYNAMIC_COMPONENT_CONFIG } from '@eui/core';
|
|
21
|
-
import
|
|
22
|
-
import
|
|
21
|
+
import * as i4 from '@eui/components/shared';
|
|
22
|
+
import { BaseStatesDirective } from '@eui/components/shared';
|
|
23
|
+
import * as i8 from '@eui/components/eui-button';
|
|
23
24
|
import { EuiButtonModule } from '@eui/components/eui-button';
|
|
24
|
-
import * as
|
|
25
|
+
import * as i9 from '@eui/components/eui-icon';
|
|
25
26
|
import { EuiIconModule } from '@eui/components/eui-icon';
|
|
26
|
-
import * as
|
|
27
|
+
import * as i10 from '@eui/components/eui-input-text';
|
|
27
28
|
import { EuiInputTextModule } from '@eui/components/eui-input-text';
|
|
28
|
-
import * as
|
|
29
|
+
import * as i11 from '@eui/components/eui-input-group';
|
|
29
30
|
import { EuiInputGroupModule } from '@eui/components/eui-input-group';
|
|
30
31
|
|
|
31
32
|
/* eslint-disable @typescript-eslint/no-explicit-any */
|
|
32
33
|
const moment = _rollupMoment || _rollupMoment;
|
|
33
|
-
class EuiDatepickerComponent
|
|
34
|
-
get
|
|
35
|
-
return this.
|
|
36
|
-
}
|
|
37
|
-
set isDatetimepicker(value) {
|
|
38
|
-
this._isDatetimepicker = coerceBooleanProperty(value);
|
|
39
|
-
}
|
|
40
|
-
get hasSeconds() {
|
|
41
|
-
return this._hasSeconds;
|
|
42
|
-
}
|
|
43
|
-
set hasSeconds(value) {
|
|
44
|
-
this._hasSeconds = coerceBooleanProperty(value);
|
|
45
|
-
}
|
|
46
|
-
get isOneInputField() {
|
|
47
|
-
return this._isOneInputField;
|
|
48
|
-
}
|
|
49
|
-
set isOneInputField(value) {
|
|
50
|
-
this._isOneInputField = coerceBooleanProperty(value);
|
|
51
|
-
}
|
|
52
|
-
get hasNoButton() {
|
|
53
|
-
return this._hasNoButton;
|
|
54
|
-
}
|
|
55
|
-
set hasNoButton(value) {
|
|
56
|
-
this._hasNoButton = coerceBooleanProperty(value);
|
|
57
|
-
}
|
|
58
|
-
get isDatepickerBlock() {
|
|
59
|
-
return this._isDatepickerBlock;
|
|
60
|
-
}
|
|
61
|
-
set isDatepickerBlock(value) {
|
|
62
|
-
this._isDatepickerBlock = coerceBooleanProperty(value);
|
|
63
|
-
}
|
|
64
|
-
get isReadOnly() {
|
|
65
|
-
return this._isReadOnly;
|
|
66
|
-
}
|
|
67
|
-
set isReadOnly(value) {
|
|
68
|
-
this._isReadOnly = coerceBooleanProperty(value);
|
|
69
|
-
}
|
|
70
|
-
get isDisabled() {
|
|
71
|
-
return this._isDisabled;
|
|
72
|
-
}
|
|
73
|
-
set isDisabled(value) {
|
|
74
|
-
this._isDisabled = coerceBooleanProperty(value);
|
|
75
|
-
}
|
|
76
|
-
get isInputDisabled() {
|
|
77
|
-
return this._isInputDisabled;
|
|
78
|
-
}
|
|
79
|
-
set isInputDisabled(value) {
|
|
80
|
-
this._isInputDisabled = coerceBooleanProperty(value);
|
|
81
|
-
}
|
|
82
|
-
get isButtonDisabled() {
|
|
83
|
-
return this._isButtonDisabled;
|
|
84
|
-
}
|
|
85
|
-
set isButtonDisabled(value) {
|
|
86
|
-
this._isButtonDisabled = coerceBooleanProperty(value);
|
|
87
|
-
}
|
|
88
|
-
get isPickerDisabled() {
|
|
89
|
-
return this._isPickerDisabled;
|
|
90
|
-
}
|
|
91
|
-
set isPickerDisabled(value) {
|
|
92
|
-
this._isPickerDisabled = coerceBooleanProperty(value);
|
|
34
|
+
class EuiDatepickerComponent {
|
|
35
|
+
get cssClasses() {
|
|
36
|
+
return [this.baseStatesDirective.getCssClasses('eui-datepicker')].join(' ').trim();
|
|
93
37
|
}
|
|
94
38
|
get isClearable() {
|
|
95
|
-
return this._isClearable && !this.
|
|
39
|
+
return this._isClearable && !this.isReadOnly;
|
|
96
40
|
}
|
|
97
41
|
set isClearable(value) {
|
|
98
42
|
this._isClearable = coerceBooleanProperty(value);
|
|
@@ -116,11 +60,7 @@ class EuiDatepickerComponent extends BaseDirective {
|
|
|
116
60
|
console.error(e);
|
|
117
61
|
}
|
|
118
62
|
}
|
|
119
|
-
|
|
120
|
-
return [super.getCssClasses('eui-datepicker')].join(' ').trim();
|
|
121
|
-
}
|
|
122
|
-
constructor(adapter, translateService, localeService, EuiAppShellService, componentFactoryResolver, injector, appRef, viewContainerRef, euiLetterFormat, control, format) {
|
|
123
|
-
super();
|
|
63
|
+
constructor(adapter, translateService, localeService, EuiAppShellService, componentFactoryResolver, injector, appRef, viewContainerRef, baseStatesDirective, euiLetterFormat, control, format) {
|
|
124
64
|
this.adapter = adapter;
|
|
125
65
|
this.translateService = translateService;
|
|
126
66
|
this.localeService = localeService;
|
|
@@ -129,6 +69,7 @@ class EuiDatepickerComponent extends BaseDirective {
|
|
|
129
69
|
this.injector = injector;
|
|
130
70
|
this.appRef = appRef;
|
|
131
71
|
this.viewContainerRef = viewContainerRef;
|
|
72
|
+
this.baseStatesDirective = baseStatesDirective;
|
|
132
73
|
this.euiLetterFormat = euiLetterFormat;
|
|
133
74
|
this.control = control;
|
|
134
75
|
this.inputFormControl = new FormControl();
|
|
@@ -151,16 +92,16 @@ class EuiDatepickerComponent extends BaseDirective {
|
|
|
151
92
|
this.stepHours = 1;
|
|
152
93
|
this.stepMinutes = 1;
|
|
153
94
|
this.stepSeconds = 1;
|
|
154
|
-
this.
|
|
155
|
-
this.
|
|
156
|
-
this.
|
|
157
|
-
this.
|
|
158
|
-
this.
|
|
159
|
-
this.
|
|
160
|
-
this.
|
|
161
|
-
this.
|
|
162
|
-
this.
|
|
163
|
-
this.
|
|
95
|
+
this.isDatetimepicker = false;
|
|
96
|
+
this.hasSeconds = false;
|
|
97
|
+
this.isOneInputField = false;
|
|
98
|
+
this.hasNoButton = false;
|
|
99
|
+
this.isDatepickerBlock = false;
|
|
100
|
+
this.isReadOnly = false;
|
|
101
|
+
this.isDisabled = false;
|
|
102
|
+
this.isInputDisabled = false;
|
|
103
|
+
this.isButtonDisabled = false;
|
|
104
|
+
this.isPickerDisabled = false;
|
|
164
105
|
this._isClearable = false;
|
|
165
106
|
this.destroy$ = new Subject();
|
|
166
107
|
this.isNull = false;
|
|
@@ -623,25 +564,39 @@ class EuiDatepickerComponent extends BaseDirective {
|
|
|
623
564
|
date1.getMinutes() === date2.getMinutes() &&
|
|
624
565
|
date1.getSeconds() === date2.getSeconds());
|
|
625
566
|
}
|
|
626
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.6", ngImport: i0, type: EuiDatepickerComponent, deps: [{ token: i1.DateAdapter }, { token: i2.TranslateService }, { token: i3.LocaleService }, { token: i3.EuiAppShellService }, { token: i0.ComponentFactoryResolver }, { token: i0.Injector }, { token: i0.ApplicationRef }, { token: i0.ViewContainerRef }, { token: forwardRef(() => EuiLetterFormatDirective), optional: true }, { token:
|
|
627
|
-
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "
|
|
567
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.6", ngImport: i0, type: EuiDatepickerComponent, deps: [{ token: i1.DateAdapter }, { token: i2.TranslateService }, { token: i3.LocaleService }, { token: i3.EuiAppShellService }, { token: i0.ComponentFactoryResolver }, { token: i0.Injector }, { token: i0.ApplicationRef }, { token: i0.ViewContainerRef }, { token: i4.BaseStatesDirective }, { token: forwardRef(() => EuiLetterFormatDirective), optional: true }, { token: i5.NgControl, optional: true, self: true }, { token: MAT_DATE_FORMATS }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
568
|
+
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "17.0.6", type: EuiDatepickerComponent, selector: "eui-datepicker", inputs: { styleClass: "styleClass", value: "value", togglerIcon: "togglerIcon", togglerIconSvg: "togglerIconSvg", togglerLabel: "togglerLabel", placeholder: "placeholder", type: "type", startView: "startView", e2eAttr: "e2eAttr", minDate: "minDate", maxDate: "maxDate", datepickerFilter: "datepickerFilter", dateOutputFormat: "dateOutputFormat", customHeader: "customHeader", dateClass: "dateClass", stepHours: "stepHours", stepMinutes: "stepMinutes", stepSeconds: "stepSeconds", isDatetimepicker: ["isDatetimepicker", "isDatetimepicker", booleanAttribute], hasSeconds: ["hasSeconds", "hasSeconds", booleanAttribute], isOneInputField: ["isOneInputField", "isOneInputField", booleanAttribute], hasNoButton: ["hasNoButton", "hasNoButton", booleanAttribute], isDatepickerBlock: ["isDatepickerBlock", "isDatepickerBlock", booleanAttribute], isReadOnly: ["isReadOnly", "isReadOnly", booleanAttribute], isDisabled: ["isDisabled", "isDisabled", booleanAttribute], isInputDisabled: ["isInputDisabled", "isInputDisabled", booleanAttribute], isButtonDisabled: ["isButtonDisabled", "isButtonDisabled", booleanAttribute], isPickerDisabled: ["isPickerDisabled", "isPickerDisabled", booleanAttribute], isClearable: "isClearable", restrictToRegex: "restrictToRegex" }, outputs: { inputChange: "inputChange", dateSelect: "dateSelect" }, host: { properties: { "class": "this.cssClasses" } }, queries: [{ propertyName: "euiActionButtons", first: true, predicate: i0.forwardRef(() => EuiActionButtonsDirective), descendants: true }], viewQueries: [{ propertyName: "calendar", first: true, predicate: ["calendar"], descendants: true, static: true }, { propertyName: "templatePortalRef", first: true, predicate: ["templatePortalRef"], descendants: true }], usesOnChanges: true, hostDirectives: [{ directive: i4.BaseStatesDirective, inputs: ["euiSuccess", "euiSuccess", "euiInfo", "euiInfo", "euiWarning", "euiWarning", "euiDanger", "euiDanger", "euiVariant", "euiVariant"] }], ngImport: i0, template: "<div class=\"eui-datepicker__wrapper {{ styleClass }}\" [class.eui-datepicker__wrapper--responsive]=\"isDatepickerBlock\">\n <div euiInputGroup>\n <div class=\"eui-input-group-addon\">\n <input\n euiInputText\n [readonly]=\"isReadOnly\"\n [euiClearable]=\"isClearable\"\n (clear)=\"onClear()\"\n [class.eui-datepicker--no-button]=\"hasNoButton\"\n [class.eui-datepicker--long-format]=\"!isDatepickerBlock && (isDatetimepicker || euiLetterFormat)\"\n [class.eui-datepicker--block]=\"isDatepickerBlock\"\n [formControl]=\"inputFormControl\"\n [matDatepicker]=\"calendar\"\n placeholder=\"{{ placeholder }}\"\n (dateInput)=\"onDateInput($event)\"\n (dateChange)=\"onDateChange($event)\"\n [min]=\"minDate\"\n [max]=\"maxDate\"\n [matDatepickerFilter]=\"datepickerFilter\"\n (click)=\"openCalendar()\"\n autocomplete=\"off\"\n aria-label=\"Date Input Field\"\n (keypress)=\"onKeypress($event)\"\n (change)=\"isDatetimepicker ? changedInput($event) : null\" />\n <mat-datepicker\n #calendar\n panelClass=\"mat-calendar-{{ type }}\"\n [startView]=\"type === 'regular' ? (startView ? startView : convTypeToStartView(type)) : convTypeToStartView(type)\"\n (yearSelected)=\"type === 'year' ? chosenDateHandler($event, calendar) : null\"\n (monthSelected)=\"type === 'month' ? chosenDateHandler($event, calendar) : null\"\n [touchUi]=\"breakpointsValue.isTablet || breakpointsValue.isMobile\"\n [panelClass]=\"isDatetimepicker ? 'eui-datepicker--container-height-large' : null\"\n [disabled]=\"isPickerDisabled\"\n [calendarHeaderComponent]=\"customHeader\"\n [dateClass]=\"dateClass\"\n (opened)=\"onOpened()\">\n </mat-datepicker>\n <button\n *ngIf=\"!hasNoButton && showDateButton\"\n (click)=\"openCalendar()\"\n euiButton\n type=\"button\"\n euiSecondary\n [euiIconButton]=\"!togglerLabel\"\n [euiDisabled]=\"isButtonDisabled\"\n aria-haspopup=\"dialog\">\n <span *ngIf=\"!togglerLabel && togglerIcon\" euiIcon aria-label=\"Open Calendar\" iconClass=\"{{ togglerIcon }}\"></span>\n <ng-container *ngIf=\"!togglerLabel && !togglerIcon\">\n <eui-icon-svg icon=\"{{ togglerIconSvg }}\" aria-label=\"Open Calendar\"></eui-icon-svg>\n </ng-container>\n <span *ngIf=\"togglerLabel\">{{ togglerLabel }}</span>\n </button>\n </div>\n </div>\n</div>\n\n<ng-template #templatePortalRef>\n <ng-content select=\"eui-action-buttons\"></ng-content>\n</ng-template>\n", styles: [":host.eui-datepicker{display:flex;width:100%}.eui-datepicker{display:flex;width:100%}.eui-datepicker .eui-datepicker__wrapper:not(.eui-datepicker__wrapper--responsive) .eui-input-group{margin-bottom:0}.eui-datepicker .eui-datepicker__wrapper:not(.eui-datepicker__wrapper--responsive) .eui-input-group-addon{width:unset}.eui-datepicker .eui-datepicker__wrapper:not(.eui-datepicker__wrapper--responsive) input{border-bottom-right-radius:0;border-top-right-radius:0;width:calc(8.5 * var(--eui-base-spacing-m))}.eui-datepicker .eui-datepicker__wrapper:not(.eui-datepicker__wrapper--responsive) input.eui-input-text--clearable{width:calc(9 * var(--eui-base-spacing-m))}.eui-datepicker .eui-datepicker__wrapper:not(.eui-datepicker__wrapper--responsive) input.eui-datepicker--long-format{width:calc(12.5 * var(--eui-base-spacing-m))}.eui-datepicker .eui-datepicker__wrapper:not(.eui-datepicker__wrapper--responsive) input.eui-datepicker--block{width:100%}.eui-datepicker .eui-datepicker__wrapper:not(.eui-datepicker__wrapper--responsive) input.eui-datepicker--no-button{border-bottom-right-radius:var(--eui-base-border-radius);border-top-right-radius:var(--eui-base-border-radius)}.eui-datepicker .eui-datepicker__wrapper .eui-input-group{margin-bottom:0}.eui-datepicker .eui-datepicker__wrapper--responsive,.eui-datepicker .eui-datepicker__wrapper--responsive .eui-input-group-addon{width:100%}.eui-datepicker--container-height-large{height:auto!important}.eui-datepicker__action-buttons{display:flex;justify-content:flex-end;align-items:center;padding:0 var(--eui-base-spacing-xs) var(--eui-base-spacing-xs) var(--eui-base-spacing-xs)}.eui-datepicker__actions-cancel-button{margin-right:var(--eui-base-spacing-m)}.mat-calendar.mat-calendar-year .mat-calendar-period-button{display:none}.mat-datepicker-dialog .mat-datepicker-content-touch{max-height:none}.mat-datepicker-content-touch .mat-datepicker-content-container{height:auto!important;max-height:-moz-fit-content!important;max-height:fit-content!important}.mat-mdc-icon-button:disabled{color:var(--eui-base-color-grey-50)!important}.eui-datepicker--primary input{background-color:var(--eui-base-color-primary-10)}.eui-datepicker--secondary input{background-color:var(--eui-base-color-grey-10)}.eui-datepicker--info input{background-color:var(--eui-base-color-info-10)}.eui-datepicker--success input{background-color:var(--eui-base-color-success-10)}.eui-datepicker--warning input{background-color:var(--eui-base-color-warning-10)}.eui-datepicker--danger input{background-color:var(--eui-base-color-danger-10)}.eui-datepicker--accent input{background-color:var(--eui-base-color-accent-10)}\n"], dependencies: [{ kind: "directive", type: i6.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i5.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: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: i7.MatDatepicker, selector: "mat-datepicker", exportAs: ["matDatepicker"] }, { kind: "directive", type: i7.MatDatepickerInput, selector: "input[matDatepicker]", inputs: ["matDatepicker", "min", "max", "matDatepickerFilter"], exportAs: ["matDatepickerInput"] }, { kind: "component", type: i8.EuiButtonComponent, selector: "button[euiButton], a[euiButton]", inputs: ["e2eAttr", "id", "euiBasicButton", "euiButtonCall", "euiBlockButton", "isLoading", "euiIconButton", "euiLineWrap"], outputs: ["buttonClick"] }, { kind: "component", type: i9.EuiIconComponent, selector: "div[euiIcon], span[euiIcon], i[euiIcon], eui-icon", inputs: ["aria-label", "iconClass", "isLoading"] }, { kind: "component", type: i9.EuiIconSvgComponent, selector: "eui-icon-svg, span[euiIconSvg], i[euiIconSvg]", inputs: ["icon", "size", "fillColor", "set", "ariaLabelledby", "role", "style", "iconUrl", "transform", "aria-label", "ariaHidden", "focusable", "isLoading"] }, { kind: "component", type: i10.EuiInputTextComponent, selector: "input[euiInputText]", inputs: ["class", "isInvalid"] }, { kind: "component", type: i11.EuiInputGroupComponent, selector: "div[euiInputGroup]", inputs: ["e2eAttr", "styleClass"] }], encapsulation: i0.ViewEncapsulation.None }); }
|
|
628
569
|
}
|
|
629
570
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.6", ngImport: i0, type: EuiDatepickerComponent, decorators: [{
|
|
630
571
|
type: Component,
|
|
631
|
-
args: [{ selector: 'eui-datepicker', encapsulation: ViewEncapsulation.None,
|
|
632
|
-
|
|
572
|
+
args: [{ selector: 'eui-datepicker', encapsulation: ViewEncapsulation.None, hostDirectives: [
|
|
573
|
+
{
|
|
574
|
+
directive: BaseStatesDirective,
|
|
575
|
+
inputs: [
|
|
576
|
+
'euiSuccess',
|
|
577
|
+
'euiInfo',
|
|
578
|
+
'euiWarning',
|
|
579
|
+
'euiDanger',
|
|
580
|
+
'euiVariant',
|
|
581
|
+
],
|
|
582
|
+
},
|
|
583
|
+
], template: "<div class=\"eui-datepicker__wrapper {{ styleClass }}\" [class.eui-datepicker__wrapper--responsive]=\"isDatepickerBlock\">\n <div euiInputGroup>\n <div class=\"eui-input-group-addon\">\n <input\n euiInputText\n [readonly]=\"isReadOnly\"\n [euiClearable]=\"isClearable\"\n (clear)=\"onClear()\"\n [class.eui-datepicker--no-button]=\"hasNoButton\"\n [class.eui-datepicker--long-format]=\"!isDatepickerBlock && (isDatetimepicker || euiLetterFormat)\"\n [class.eui-datepicker--block]=\"isDatepickerBlock\"\n [formControl]=\"inputFormControl\"\n [matDatepicker]=\"calendar\"\n placeholder=\"{{ placeholder }}\"\n (dateInput)=\"onDateInput($event)\"\n (dateChange)=\"onDateChange($event)\"\n [min]=\"minDate\"\n [max]=\"maxDate\"\n [matDatepickerFilter]=\"datepickerFilter\"\n (click)=\"openCalendar()\"\n autocomplete=\"off\"\n aria-label=\"Date Input Field\"\n (keypress)=\"onKeypress($event)\"\n (change)=\"isDatetimepicker ? changedInput($event) : null\" />\n <mat-datepicker\n #calendar\n panelClass=\"mat-calendar-{{ type }}\"\n [startView]=\"type === 'regular' ? (startView ? startView : convTypeToStartView(type)) : convTypeToStartView(type)\"\n (yearSelected)=\"type === 'year' ? chosenDateHandler($event, calendar) : null\"\n (monthSelected)=\"type === 'month' ? chosenDateHandler($event, calendar) : null\"\n [touchUi]=\"breakpointsValue.isTablet || breakpointsValue.isMobile\"\n [panelClass]=\"isDatetimepicker ? 'eui-datepicker--container-height-large' : null\"\n [disabled]=\"isPickerDisabled\"\n [calendarHeaderComponent]=\"customHeader\"\n [dateClass]=\"dateClass\"\n (opened)=\"onOpened()\">\n </mat-datepicker>\n <button\n *ngIf=\"!hasNoButton && showDateButton\"\n (click)=\"openCalendar()\"\n euiButton\n type=\"button\"\n euiSecondary\n [euiIconButton]=\"!togglerLabel\"\n [euiDisabled]=\"isButtonDisabled\"\n aria-haspopup=\"dialog\">\n <span *ngIf=\"!togglerLabel && togglerIcon\" euiIcon aria-label=\"Open Calendar\" iconClass=\"{{ togglerIcon }}\"></span>\n <ng-container *ngIf=\"!togglerLabel && !togglerIcon\">\n <eui-icon-svg icon=\"{{ togglerIconSvg }}\" aria-label=\"Open Calendar\"></eui-icon-svg>\n </ng-container>\n <span *ngIf=\"togglerLabel\">{{ togglerLabel }}</span>\n </button>\n </div>\n </div>\n</div>\n\n<ng-template #templatePortalRef>\n <ng-content select=\"eui-action-buttons\"></ng-content>\n</ng-template>\n", styles: [":host.eui-datepicker{display:flex;width:100%}.eui-datepicker{display:flex;width:100%}.eui-datepicker .eui-datepicker__wrapper:not(.eui-datepicker__wrapper--responsive) .eui-input-group{margin-bottom:0}.eui-datepicker .eui-datepicker__wrapper:not(.eui-datepicker__wrapper--responsive) .eui-input-group-addon{width:unset}.eui-datepicker .eui-datepicker__wrapper:not(.eui-datepicker__wrapper--responsive) input{border-bottom-right-radius:0;border-top-right-radius:0;width:calc(8.5 * var(--eui-base-spacing-m))}.eui-datepicker .eui-datepicker__wrapper:not(.eui-datepicker__wrapper--responsive) input.eui-input-text--clearable{width:calc(9 * var(--eui-base-spacing-m))}.eui-datepicker .eui-datepicker__wrapper:not(.eui-datepicker__wrapper--responsive) input.eui-datepicker--long-format{width:calc(12.5 * var(--eui-base-spacing-m))}.eui-datepicker .eui-datepicker__wrapper:not(.eui-datepicker__wrapper--responsive) input.eui-datepicker--block{width:100%}.eui-datepicker .eui-datepicker__wrapper:not(.eui-datepicker__wrapper--responsive) input.eui-datepicker--no-button{border-bottom-right-radius:var(--eui-base-border-radius);border-top-right-radius:var(--eui-base-border-radius)}.eui-datepicker .eui-datepicker__wrapper .eui-input-group{margin-bottom:0}.eui-datepicker .eui-datepicker__wrapper--responsive,.eui-datepicker .eui-datepicker__wrapper--responsive .eui-input-group-addon{width:100%}.eui-datepicker--container-height-large{height:auto!important}.eui-datepicker__action-buttons{display:flex;justify-content:flex-end;align-items:center;padding:0 var(--eui-base-spacing-xs) var(--eui-base-spacing-xs) var(--eui-base-spacing-xs)}.eui-datepicker__actions-cancel-button{margin-right:var(--eui-base-spacing-m)}.mat-calendar.mat-calendar-year .mat-calendar-period-button{display:none}.mat-datepicker-dialog .mat-datepicker-content-touch{max-height:none}.mat-datepicker-content-touch .mat-datepicker-content-container{height:auto!important;max-height:-moz-fit-content!important;max-height:fit-content!important}.mat-mdc-icon-button:disabled{color:var(--eui-base-color-grey-50)!important}.eui-datepicker--primary input{background-color:var(--eui-base-color-primary-10)}.eui-datepicker--secondary input{background-color:var(--eui-base-color-grey-10)}.eui-datepicker--info input{background-color:var(--eui-base-color-info-10)}.eui-datepicker--success input{background-color:var(--eui-base-color-success-10)}.eui-datepicker--warning input{background-color:var(--eui-base-color-warning-10)}.eui-datepicker--danger input{background-color:var(--eui-base-color-danger-10)}.eui-datepicker--accent input{background-color:var(--eui-base-color-accent-10)}\n"] }]
|
|
584
|
+
}], ctorParameters: () => [{ type: i1.DateAdapter }, { type: i2.TranslateService }, { type: i3.LocaleService }, { type: i3.EuiAppShellService }, { type: i0.ComponentFactoryResolver }, { type: i0.Injector }, { type: i0.ApplicationRef }, { type: i0.ViewContainerRef }, { type: i4.BaseStatesDirective }, { type: EuiLetterFormatDirective, decorators: [{
|
|
633
585
|
type: Optional
|
|
634
586
|
}, {
|
|
635
587
|
type: Inject,
|
|
636
588
|
args: [forwardRef(() => EuiLetterFormatDirective)]
|
|
637
|
-
}] }, { type:
|
|
589
|
+
}] }, { type: i5.NgControl, decorators: [{
|
|
638
590
|
type: Self
|
|
639
591
|
}, {
|
|
640
592
|
type: Optional
|
|
641
593
|
}] }, { type: undefined, decorators: [{
|
|
642
594
|
type: Inject,
|
|
643
595
|
args: [MAT_DATE_FORMATS]
|
|
644
|
-
}] }], propDecorators: {
|
|
596
|
+
}] }], propDecorators: { cssClasses: [{
|
|
597
|
+
type: HostBinding,
|
|
598
|
+
args: ['class']
|
|
599
|
+
}], calendar: [{
|
|
645
600
|
type: ViewChild,
|
|
646
601
|
args: ['calendar', { static: true }]
|
|
647
602
|
}], templatePortalRef: [{
|
|
@@ -691,32 +646,39 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.6", ngImpor
|
|
|
691
646
|
}], stepSeconds: [{
|
|
692
647
|
type: Input
|
|
693
648
|
}], isDatetimepicker: [{
|
|
694
|
-
type: Input
|
|
649
|
+
type: Input,
|
|
650
|
+
args: [{ transform: booleanAttribute }]
|
|
695
651
|
}], hasSeconds: [{
|
|
696
|
-
type: Input
|
|
652
|
+
type: Input,
|
|
653
|
+
args: [{ transform: booleanAttribute }]
|
|
697
654
|
}], isOneInputField: [{
|
|
698
|
-
type: Input
|
|
655
|
+
type: Input,
|
|
656
|
+
args: [{ transform: booleanAttribute }]
|
|
699
657
|
}], hasNoButton: [{
|
|
700
|
-
type: Input
|
|
658
|
+
type: Input,
|
|
659
|
+
args: [{ transform: booleanAttribute }]
|
|
701
660
|
}], isDatepickerBlock: [{
|
|
702
|
-
type: Input
|
|
661
|
+
type: Input,
|
|
662
|
+
args: [{ transform: booleanAttribute }]
|
|
703
663
|
}], isReadOnly: [{
|
|
704
|
-
type: Input
|
|
664
|
+
type: Input,
|
|
665
|
+
args: [{ transform: booleanAttribute }]
|
|
705
666
|
}], isDisabled: [{
|
|
706
|
-
type: Input
|
|
667
|
+
type: Input,
|
|
668
|
+
args: [{ transform: booleanAttribute }]
|
|
707
669
|
}], isInputDisabled: [{
|
|
708
|
-
type: Input
|
|
670
|
+
type: Input,
|
|
671
|
+
args: [{ transform: booleanAttribute }]
|
|
709
672
|
}], isButtonDisabled: [{
|
|
710
|
-
type: Input
|
|
673
|
+
type: Input,
|
|
674
|
+
args: [{ transform: booleanAttribute }]
|
|
711
675
|
}], isPickerDisabled: [{
|
|
712
|
-
type: Input
|
|
676
|
+
type: Input,
|
|
677
|
+
args: [{ transform: booleanAttribute }]
|
|
713
678
|
}], isClearable: [{
|
|
714
679
|
type: Input
|
|
715
680
|
}], restrictToRegex: [{
|
|
716
681
|
type: Input
|
|
717
|
-
}], cssClasses: [{
|
|
718
|
-
type: HostBinding,
|
|
719
|
-
args: ['class']
|
|
720
682
|
}] } });
|
|
721
683
|
const LETTER_FORMAT = {
|
|
722
684
|
parse: {
|