@fundamental-ngx/core 0.43.16 → 0.43.17
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/calendar/calendar-directives.d.ts +11 -9
- package/calendar/calendar-header/calendar-header.component.d.ts +5 -23
- package/calendar/calendar-views/calendar-aggregated-year-view/calendar-aggregated-year-view.component.d.ts +1 -20
- package/calendar/calendar-views/calendar-day-view/calendar-day-view.component.d.ts +3 -41
- package/calendar/calendar-views/calendar-month-view/calendar-month-view.component.d.ts +1 -20
- package/calendar/calendar-views/calendar-year-view/calendar-year-view.component.d.ts +1 -20
- package/calendar/calendar.module.d.ts +2 -1
- package/calendar/i18n/calendar-i18n-labels.d.ts +20 -22
- package/calendar/patch-deprecated-i18n-labels.d.ts +6 -0
- package/combobox/combobox.component.d.ts +9 -7
- package/esm2020/calendar/calendar-directives.mjs +27 -20
- package/esm2020/calendar/calendar-header/calendar-header.component.mjs +30 -60
- package/esm2020/calendar/calendar-views/calendar-aggregated-year-view/calendar-aggregated-year-view.component.mjs +9 -34
- package/esm2020/calendar/calendar-views/calendar-day-view/calendar-day-view.component.mjs +10 -62
- package/esm2020/calendar/calendar-views/calendar-month-view/calendar-month-view.component.mjs +9 -34
- package/esm2020/calendar/calendar-views/calendar-year-view/calendar-year-view.component.mjs +9 -34
- package/esm2020/calendar/calendar.component.mjs +13 -3
- package/esm2020/calendar/calendar.module.mjs +5 -4
- package/esm2020/calendar/i18n/calendar-i18n-labels.mjs +22 -28
- package/esm2020/calendar/patch-deprecated-i18n-labels.mjs +26 -0
- package/esm2020/combobox/combobox.component.mjs +20 -9
- package/esm2020/date-picker/date-picker.component.mjs +1 -1
- package/esm2020/datetime-picker/datetime-picker.component.mjs +1 -1
- package/esm2020/input-group/input-group.component.mjs +6 -4
- package/esm2020/multi-combobox/multi-combobox.component.mjs +15 -17
- package/esm2020/multi-input/multi-input.component.mjs +13 -11
- package/esm2020/popover/base/base-popover.class.mjs +2 -2
- package/esm2020/popover/popover-body/popover-body.component.mjs +2 -2
- package/esm2020/select/select.component.mjs +3 -3
- package/esm2020/table/table-wrapper.component.mjs +2 -2
- package/esm2020/table/table.component.mjs +2 -2
- package/esm2020/time-picker/time-picker.component.mjs +1 -1
- package/esm2020/token/token.component.mjs +10 -8
- package/esm2020/token/tokenizer.component.mjs +5 -4
- package/fesm2015/fundamental-ngx-core-calendar.mjs +156 -282
- package/fesm2015/fundamental-ngx-core-calendar.mjs.map +1 -1
- package/fesm2015/fundamental-ngx-core-combobox.mjs +16 -6
- package/fesm2015/fundamental-ngx-core-combobox.mjs.map +1 -1
- package/fesm2015/fundamental-ngx-core-date-picker.mjs +1 -1
- package/fesm2015/fundamental-ngx-core-date-picker.mjs.map +1 -1
- package/fesm2015/fundamental-ngx-core-datetime-picker.mjs +1 -1
- package/fesm2015/fundamental-ngx-core-datetime-picker.mjs.map +1 -1
- package/fesm2015/fundamental-ngx-core-input-group.mjs +5 -3
- package/fesm2015/fundamental-ngx-core-input-group.mjs.map +1 -1
- package/fesm2015/fundamental-ngx-core-multi-combobox.mjs +10 -13
- package/fesm2015/fundamental-ngx-core-multi-combobox.mjs.map +1 -1
- package/fesm2015/fundamental-ngx-core-multi-input.mjs +11 -9
- package/fesm2015/fundamental-ngx-core-multi-input.mjs.map +1 -1
- package/fesm2015/fundamental-ngx-core-popover.mjs +2 -2
- package/fesm2015/fundamental-ngx-core-popover.mjs.map +1 -1
- package/fesm2015/fundamental-ngx-core-select.mjs +2 -2
- package/fesm2015/fundamental-ngx-core-select.mjs.map +1 -1
- package/fesm2015/fundamental-ngx-core-table.mjs +4 -4
- package/fesm2015/fundamental-ngx-core-table.mjs.map +1 -1
- package/fesm2015/fundamental-ngx-core-time-picker.mjs +1 -1
- package/fesm2015/fundamental-ngx-core-time-picker.mjs.map +1 -1
- package/fesm2015/fundamental-ngx-core-token.mjs +11 -9
- package/fesm2015/fundamental-ngx-core-token.mjs.map +1 -1
- package/fesm2020/fundamental-ngx-core-calendar.mjs +162 -282
- package/fesm2020/fundamental-ngx-core-calendar.mjs.map +1 -1
- package/fesm2020/fundamental-ngx-core-combobox.mjs +18 -7
- package/fesm2020/fundamental-ngx-core-combobox.mjs.map +1 -1
- package/fesm2020/fundamental-ngx-core-date-picker.mjs +1 -1
- package/fesm2020/fundamental-ngx-core-date-picker.mjs.map +1 -1
- package/fesm2020/fundamental-ngx-core-datetime-picker.mjs +1 -1
- package/fesm2020/fundamental-ngx-core-datetime-picker.mjs.map +1 -1
- package/fesm2020/fundamental-ngx-core-input-group.mjs +5 -3
- package/fesm2020/fundamental-ngx-core-input-group.mjs.map +1 -1
- package/fesm2020/fundamental-ngx-core-multi-combobox.mjs +10 -12
- package/fesm2020/fundamental-ngx-core-multi-combobox.mjs.map +1 -1
- package/fesm2020/fundamental-ngx-core-multi-input.mjs +11 -9
- package/fesm2020/fundamental-ngx-core-multi-input.mjs.map +1 -1
- package/fesm2020/fundamental-ngx-core-popover.mjs +2 -2
- package/fesm2020/fundamental-ngx-core-popover.mjs.map +1 -1
- package/fesm2020/fundamental-ngx-core-select.mjs +2 -2
- package/fesm2020/fundamental-ngx-core-select.mjs.map +1 -1
- package/fesm2020/fundamental-ngx-core-table.mjs +4 -4
- package/fesm2020/fundamental-ngx-core-table.mjs.map +1 -1
- package/fesm2020/fundamental-ngx-core-time-picker.mjs +1 -1
- package/fesm2020/fundamental-ngx-core-time-picker.mjs.map +1 -1
- package/fesm2020/fundamental-ngx-core-token.mjs +11 -9
- package/fesm2020/fundamental-ngx-core-token.mjs.map +1 -1
- package/fundamental-ngx-core-v0.43.17.tgz +0 -0
- package/input-group/input-group.component.d.ts +7 -1
- package/multi-combobox/multi-combobox.component.d.ts +1 -1
- package/multi-input/multi-input.component.d.ts +5 -3
- package/package.json +3 -3
- package/schematics/add-dependencies/index.js +4 -4
- package/token/token.component.d.ts +4 -2
- package/fundamental-ngx-core-v0.43.16.tgz +0 -0
|
@@ -1,74 +1,24 @@
|
|
|
1
1
|
import * as i0 from '@angular/core';
|
|
2
|
-
import { Injectable, Optional, Directive, Attribute, EventEmitter, ElementRef, Component, ViewEncapsulation, ChangeDetectionStrategy, Input, Output, ViewChild,
|
|
3
|
-
import * as
|
|
2
|
+
import { Injectable, Optional, Directive, Attribute, Inject, EventEmitter, ElementRef, Component, ViewEncapsulation, ChangeDetectionStrategy, Input, Output, ViewChild, inject, forwardRef, HostBinding, NgModule } from '@angular/core';
|
|
3
|
+
import * as i3 from '@angular/common';
|
|
4
4
|
import { CommonModule } from '@angular/common';
|
|
5
5
|
import { IconModule } from '@fundamental-ngx/core/icon';
|
|
6
|
-
import * as
|
|
6
|
+
import * as i4 from '@fundamental-ngx/core/button';
|
|
7
7
|
import { ButtonModule } from '@fundamental-ngx/core/button';
|
|
8
8
|
import { takeUntil } from 'rxjs/operators';
|
|
9
|
-
import
|
|
10
|
-
import
|
|
9
|
+
import * as i2 from 'rxjs';
|
|
10
|
+
import { Subject, map, switchMap, of, startWith, Subscription } from 'rxjs';
|
|
11
|
+
import * as i2$1 from '@fundamental-ngx/core/datetime';
|
|
11
12
|
import { DATE_TIME_FORMATS } from '@fundamental-ngx/core/datetime';
|
|
12
13
|
import * as i1 from '@fundamental-ngx/cdk/utils';
|
|
14
|
+
import { DestroyedService } from '@fundamental-ngx/cdk/utils';
|
|
15
|
+
import * as i5 from '@fundamental-ngx/i18n';
|
|
16
|
+
import { FD_LANGUAGE, FD_LANGUAGE_ENGLISH, I18nModule } from '@fundamental-ngx/i18n';
|
|
13
17
|
import equal from 'fast-deep-equal';
|
|
14
18
|
import { NG_VALUE_ACCESSOR, NG_VALIDATORS } from '@angular/forms';
|
|
15
19
|
import * as i1$1 from '@fundamental-ngx/core/content-density';
|
|
16
20
|
import { contentDensityObserverProviders, DeprecatedCompactDirective, CONTENT_DENSITY_DIRECTIVE, ContentDensityModule } from '@fundamental-ngx/core/content-density';
|
|
17
21
|
|
|
18
|
-
/**
|
|
19
|
-
* Provides i18n support for labels inside the calendar component.
|
|
20
|
-
*/
|
|
21
|
-
class CalendarI18nLabels {
|
|
22
|
-
constructor() {
|
|
23
|
-
/** This is event that should be called, when labels are changed, to let component detect an changes. */
|
|
24
|
-
this.labelsChange = new Subject();
|
|
25
|
-
/** Year selection aria label. Used on the button to navigate to the years view. */
|
|
26
|
-
this.yearSelectionLabel = 'Select year';
|
|
27
|
-
/** Years range selection aria label. Used on the button to navigate to the years range view. */
|
|
28
|
-
this.yearsRangeSelectionLabel = 'Select years range';
|
|
29
|
-
/** Month selection aria label. Used on the button to navigate to the months view. */
|
|
30
|
-
this.monthSelectionLabel = 'Select month';
|
|
31
|
-
/** Day selection aria label. Used on the button to navigate to the day view. */
|
|
32
|
-
this.dateSelectionLabel = 'Select date';
|
|
33
|
-
/** Previous year aria label. Used on the button to switch to a previous year in the years view. */
|
|
34
|
-
this.previousYearLabel = 'Previous year';
|
|
35
|
-
/** Next year aria label. Used on the button to switch to a next year in the years view. */
|
|
36
|
-
this.nextYearLabel = 'Next year';
|
|
37
|
-
/** Previous month aria label. Used on the button to switch to a previous month in the months view. */
|
|
38
|
-
this.previousMonthLabel = 'Previous month';
|
|
39
|
-
/** Next month aria label. Used on the button to switch to a next month in the months view. */
|
|
40
|
-
this.nextMonthLabel = 'Next month';
|
|
41
|
-
/** Week number column label */
|
|
42
|
-
this.weekColumnLabel = 'Calendar week';
|
|
43
|
-
/** Selected date label. Used on the selected day/month/year cell. */
|
|
44
|
-
this.dateSelectedLabel = 'Selected date';
|
|
45
|
-
/** Is used to describe present date */
|
|
46
|
-
this.todayLabel = 'Today';
|
|
47
|
-
/** Range start label. Used for date range selection */
|
|
48
|
-
this.rangeStartLabel = 'Range start';
|
|
49
|
-
/** Range end label. Used for date range selection */
|
|
50
|
-
this.rangeEndLabel = 'Range end';
|
|
51
|
-
/** Past days aria label. Used when days in the past are accessed */
|
|
52
|
-
this.dayInPastLabel = 'Past days';
|
|
53
|
-
/** Past days aria label. Used when days in the past are accessed */
|
|
54
|
-
this.closeCalendarLabel = 'Close calendar';
|
|
55
|
-
/** Calendar day view aria role description. */
|
|
56
|
-
this.calendarDayViewDescription = 'Calendar';
|
|
57
|
-
/** Calendar month view aria role description. */
|
|
58
|
-
this.calendarMonthViewDescription = 'Month picker';
|
|
59
|
-
/** Calendar years view aria role description. */
|
|
60
|
-
this.calendarYearsViewDescription = 'Year picker';
|
|
61
|
-
/** Calendar years range view aria role description. */
|
|
62
|
-
this.calendarYearsRangeViewDescription = 'Years range picker';
|
|
63
|
-
}
|
|
64
|
-
}
|
|
65
|
-
CalendarI18nLabels.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: CalendarI18nLabels, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
|
|
66
|
-
CalendarI18nLabels.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: CalendarI18nLabels, providedIn: 'root' });
|
|
67
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: CalendarI18nLabels, decorators: [{
|
|
68
|
-
type: Injectable,
|
|
69
|
-
args: [{ providedIn: 'root' }]
|
|
70
|
-
}] });
|
|
71
|
-
|
|
72
22
|
class CalendarService {
|
|
73
23
|
/** @hidden */
|
|
74
24
|
constructor(_rtlService) {
|
|
@@ -205,22 +155,21 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImpor
|
|
|
205
155
|
|
|
206
156
|
class CalendarCloseButtonDirective {
|
|
207
157
|
/** @hidden */
|
|
208
|
-
|
|
209
|
-
return this._originalAriaLabel || this._calendarI18nLabels.closeCalendarLabel;
|
|
210
|
-
}
|
|
211
|
-
/** @hidden */
|
|
212
|
-
get _title() {
|
|
213
|
-
return this._originalTitle || this._calendarI18nLabels.closeCalendarLabel;
|
|
214
|
-
}
|
|
215
|
-
/** @hidden */
|
|
216
|
-
constructor(_originalAriaLabel, _originalTitle, _calendarI18nLabels) {
|
|
158
|
+
constructor(_originalAriaLabel, _originalTitle, lang$, _changeDetectorRef, _destroyed$) {
|
|
217
159
|
this._originalAriaLabel = _originalAriaLabel;
|
|
218
160
|
this._originalTitle = _originalTitle;
|
|
219
|
-
this.
|
|
161
|
+
this._changeDetectorRef = _changeDetectorRef;
|
|
162
|
+
this._destroyed$ = _destroyed$;
|
|
163
|
+
lang$
|
|
164
|
+
.pipe(map((l) => l.coreCalendar.closeCalendarLabel), takeUntil(this._destroyed$))
|
|
165
|
+
.subscribe((closeCalendarLabel) => {
|
|
166
|
+
this._closeCalendarLabel = closeCalendarLabel;
|
|
167
|
+
this._changeDetectorRef.markForCheck();
|
|
168
|
+
});
|
|
220
169
|
}
|
|
221
170
|
}
|
|
222
|
-
CalendarCloseButtonDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: CalendarCloseButtonDirective, deps: [{ token: 'aria-label', attribute: true }, { token: 'title', attribute: true }, { token:
|
|
223
|
-
CalendarCloseButtonDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.9", type: CalendarCloseButtonDirective, selector: "[fd-calendar-close-button]", host: { properties: { "attr.aria-label": "
|
|
171
|
+
CalendarCloseButtonDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: CalendarCloseButtonDirective, deps: [{ token: 'aria-label', attribute: true }, { token: 'title', attribute: true }, { token: FD_LANGUAGE }, { token: i0.ChangeDetectorRef }, { token: i1.DestroyedService }], target: i0.ɵɵFactoryTarget.Directive });
|
|
172
|
+
CalendarCloseButtonDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.9", type: CalendarCloseButtonDirective, selector: "[fd-calendar-close-button]", host: { properties: { "attr.aria-label": "_originalAriaLabel || _closeCalendarLabel", "attr.title": "_originalTitle || _closeCalendarLabel" }, classAttribute: "fd-calendar__close-button" }, providers: [DestroyedService], ngImport: i0 });
|
|
224
173
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: CalendarCloseButtonDirective, decorators: [{
|
|
225
174
|
type: Directive,
|
|
226
175
|
args: [{
|
|
@@ -228,9 +177,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImpor
|
|
|
228
177
|
selector: '[fd-calendar-close-button]',
|
|
229
178
|
host: {
|
|
230
179
|
class: 'fd-calendar__close-button',
|
|
231
|
-
'[attr.aria-label]': '
|
|
232
|
-
'[attr.title]': '
|
|
233
|
-
}
|
|
180
|
+
'[attr.aria-label]': '_originalAriaLabel || _closeCalendarLabel',
|
|
181
|
+
'[attr.title]': '_originalTitle || _closeCalendarLabel'
|
|
182
|
+
},
|
|
183
|
+
providers: [DestroyedService]
|
|
234
184
|
}]
|
|
235
185
|
}], ctorParameters: function () { return [{ type: undefined, decorators: [{
|
|
236
186
|
type: Attribute,
|
|
@@ -238,7 +188,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImpor
|
|
|
238
188
|
}] }, { type: undefined, decorators: [{
|
|
239
189
|
type: Attribute,
|
|
240
190
|
args: ['title']
|
|
241
|
-
}] }, { type:
|
|
191
|
+
}] }, { type: i2.Observable, decorators: [{
|
|
192
|
+
type: Inject,
|
|
193
|
+
args: [FD_LANGUAGE]
|
|
194
|
+
}] }, { type: i0.ChangeDetectorRef }, { type: i1.DestroyedService }]; } });
|
|
242
195
|
|
|
243
196
|
/**
|
|
244
197
|
* Internal use only.
|
|
@@ -252,6 +205,24 @@ class CalendarHeaderComponent {
|
|
|
252
205
|
this._amountOfYearsPerPeriod = yearGrid.cols * yearGrid.rows - 1;
|
|
253
206
|
this._calculateSelectAggregatedYearLabel();
|
|
254
207
|
}
|
|
208
|
+
/** Aria label for the previous button. Depends on the active view. */
|
|
209
|
+
get previousAriaLabel() {
|
|
210
|
+
return this.isOnDayView ? 'coreCalendar.previousMonthLabel' : 'coreCalendar.previousYearLabel';
|
|
211
|
+
}
|
|
212
|
+
/** Aria label for the next button. Depends on the active view. */
|
|
213
|
+
get nextAriaLabel() {
|
|
214
|
+
return this.isOnDayView ? 'coreCalendar.nextMonthLabel' : 'coreCalendar.nextYearLabel';
|
|
215
|
+
}
|
|
216
|
+
/** Button aria label to open month selection view. */
|
|
217
|
+
get selectMonthAriaLabel() {
|
|
218
|
+
return this.isOnMonthView ? 'coreCalendar.dateSelectionLabel' : 'coreCalendar.monthSelectionLabel';
|
|
219
|
+
}
|
|
220
|
+
/** Button aria label to open aggregated years selection view. */
|
|
221
|
+
get selectAggregatedYearAriaLabel() {
|
|
222
|
+
return this.isOnAggregatedYearsView
|
|
223
|
+
? 'coreCalendar.dateSelectionLabel'
|
|
224
|
+
: 'coreCalendar.yearsRangeSelectionLabel';
|
|
225
|
+
}
|
|
255
226
|
/** Get information is calendar is on aggregated years view */
|
|
256
227
|
get isOnAggregatedYearsView() {
|
|
257
228
|
return this.activeView === 'aggregatedYear';
|
|
@@ -331,8 +302,7 @@ class CalendarHeaderComponent {
|
|
|
331
302
|
return this.viewId + '-select-years-range-aria-label';
|
|
332
303
|
}
|
|
333
304
|
/** @hidden */
|
|
334
|
-
constructor(
|
|
335
|
-
this._calendarI18nLabels = _calendarI18nLabels;
|
|
305
|
+
constructor(_changeDetRef, _calendarService, _dateTimeAdapter) {
|
|
336
306
|
this._changeDetRef = _changeDetRef;
|
|
337
307
|
this._calendarService = _calendarService;
|
|
338
308
|
this._dateTimeAdapter = _dateTimeAdapter;
|
|
@@ -363,7 +333,6 @@ class CalendarHeaderComponent {
|
|
|
363
333
|
if ((changes.currentlyDisplayed && !changes.currentlyDisplayed.firstChange) ||
|
|
364
334
|
(changes.activeView && !changes.activeView.firstChange)) {
|
|
365
335
|
this._calculateLabels();
|
|
366
|
-
this._calculateAriaLabels();
|
|
367
336
|
}
|
|
368
337
|
}
|
|
369
338
|
/** @hidden */
|
|
@@ -371,9 +340,7 @@ class CalendarHeaderComponent {
|
|
|
371
340
|
this._calendarService.leftArrowId = this._prevButtonId;
|
|
372
341
|
this._calculateMonthNames();
|
|
373
342
|
this._calculateLabels();
|
|
374
|
-
this._calculateAriaLabels();
|
|
375
343
|
this._listenToLocaleChanges();
|
|
376
|
-
this._listenToCalendarLabelsChanges();
|
|
377
344
|
}
|
|
378
345
|
/**
|
|
379
346
|
* Focus on focusable control within the header
|
|
@@ -402,55 +369,12 @@ class CalendarHeaderComponent {
|
|
|
402
369
|
});
|
|
403
370
|
}
|
|
404
371
|
/** @hidden */
|
|
405
|
-
_listenToCalendarLabelsChanges() {
|
|
406
|
-
this._calendarI18nLabels.labelsChange.pipe(takeUntil(this._onDestroy$)).subscribe(() => {
|
|
407
|
-
this._calculateAriaLabels();
|
|
408
|
-
this._changeDetRef.markForCheck();
|
|
409
|
-
});
|
|
410
|
-
}
|
|
411
|
-
/** @hidden */
|
|
412
|
-
_calculateAriaLabels() {
|
|
413
|
-
this._calculatePreviousAriaLabel();
|
|
414
|
-
this._calculateNextAriaLabel();
|
|
415
|
-
this._calculateSelectMonthAriaLabel();
|
|
416
|
-
this._calculateSelectYearAriaLabel();
|
|
417
|
-
this._calculateSelectAggregatedYearAriaLabel();
|
|
418
|
-
}
|
|
419
|
-
/** @hidden */
|
|
420
372
|
_calculateLabels() {
|
|
421
373
|
this._calculateSelectMonthLabel();
|
|
422
374
|
this._calculateSelectYearLabel();
|
|
423
375
|
this._calculateSelectAggregatedYearLabel();
|
|
424
376
|
}
|
|
425
377
|
/** @hidden */
|
|
426
|
-
_calculatePreviousAriaLabel() {
|
|
427
|
-
this.previousAriaLabel = this.isOnDayView
|
|
428
|
-
? this._calendarI18nLabels.previousMonthLabel
|
|
429
|
-
: this._calendarI18nLabels.previousYearLabel;
|
|
430
|
-
}
|
|
431
|
-
/** @hidden */
|
|
432
|
-
_calculateNextAriaLabel() {
|
|
433
|
-
this.nextAriaLabel = this.isOnDayView
|
|
434
|
-
? this._calendarI18nLabels.nextMonthLabel
|
|
435
|
-
: this._calendarI18nLabels.nextYearLabel;
|
|
436
|
-
}
|
|
437
|
-
/** @hidden */
|
|
438
|
-
_calculateSelectMonthAriaLabel() {
|
|
439
|
-
this.selectMonthAriaLabel = this.isOnMonthView
|
|
440
|
-
? this._calendarI18nLabels.dateSelectionLabel
|
|
441
|
-
: this._calendarI18nLabels.monthSelectionLabel;
|
|
442
|
-
}
|
|
443
|
-
/** @hidden */
|
|
444
|
-
_calculateSelectYearAriaLabel() {
|
|
445
|
-
this.selectYearAriaLabel = this._calendarI18nLabels.yearSelectionLabel;
|
|
446
|
-
}
|
|
447
|
-
/** @hidden */
|
|
448
|
-
_calculateSelectAggregatedYearAriaLabel() {
|
|
449
|
-
this.selectAggregatedYearAriaLabel = this.isOnAggregatedYearsView
|
|
450
|
-
? this._calendarI18nLabels.dateSelectionLabel
|
|
451
|
-
: this._calendarI18nLabels.yearsRangeSelectionLabel;
|
|
452
|
-
}
|
|
453
|
-
/** @hidden */
|
|
454
378
|
_calculateSelectMonthLabel() {
|
|
455
379
|
this.selectMonthLabel = this._monthNames[this.currentlyDisplayed.month - 1];
|
|
456
380
|
}
|
|
@@ -471,14 +395,14 @@ class CalendarHeaderComponent {
|
|
|
471
395
|
return this._dateTimeAdapter.getYearName(this._dateTimeAdapter.createDate(year, 1, 1));
|
|
472
396
|
}
|
|
473
397
|
}
|
|
474
|
-
CalendarHeaderComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: CalendarHeaderComponent, deps: [{ token:
|
|
475
|
-
CalendarHeaderComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: CalendarHeaderComponent, selector: "fd-calendar-header", inputs: { activeView: "activeView", currentlyDisplayed: "currentlyDisplayed", previousButtonDisabled: "previousButtonDisabled", nextButtonDisabled: "nextButtonDisabled", calendarYearGrid: "calendarYearGrid", id: "id", mobileLandscape: "mobileLandscape" }, outputs: { activeViewChange: "activeViewChange", previousClicked: "previousClicked", nextClicked: "nextClicked", closeClicked: "closeClicked" }, host: { properties: { "attr.id": "viewId" } }, viewQueries: [{ propertyName: "_prevButtonComponent", first: true, predicate: ["prevButton"], descendants: true, read: ElementRef }], usesOnChanges: true, ngImport: i0, template: "<header class=\"fd-calendar__header\">\n <div class=\"fd-calendar__navigation\" [class.fd-calendar__navigation--main]=\"mobileLandscape\">\n <div class=\"fd-calendar__action fd-calendar__action--arrow-left\">\n <button\n #prevButton\n fd-button\n fdType=\"transparent\"\n glyph=\"slim-arrow-left\"\n [attr.id]=\"_prevButtonId\"\n [disabled]=\"previousButtonDisabled\"\n [attr.title]=\"previousAriaLabel\"\n [ariaLabel]=\"previousAriaLabel\"\n type=\"button\"\n (click)=\"previousClicked.emit()\"\n ></button>\n </div>\n <ng-container *ngIf=\"isOnDayView || isOnMonthView\">\n <div class=\"fd-calendar__action\">\n <!-- Select month button -->\n <button\n fd-button\n type=\"button\"\n fdType=\"transparent\"\n [attr.aria-labelledby]=\"_monthButtonLabelId + ' ' + _selectMonthButtonAriaLabelId\"\n [attr.data-fd-calendar-month]=\"currentlyDisplayed.month\"\n (click)=\"_processViewChange('month', $event)\"\n >\n <span [attr.id]=\"_monthButtonLabelId\">{{ selectMonthLabel }}</span>\n </button>\n </div>\n <div class=\"fd-calendar__action\">\n <!-- Select year button -->\n <button\n fd-button\n type=\"button\"\n fdType=\"transparent\"\n [attr.aria-labelledby]=\"_yearButtonLabelId + ' ' + _selectYearButtonAriaLabelId\"\n [attr.data-fd-calendar-year]=\"currentlyDisplayed.year\"\n (click)=\"_processViewChange('year', $event)\"\n >\n <span [attr.id]=\"_yearButtonLabelId\">{{ selectYearLabel }}</span>\n </button>\n </div>\n </ng-container>\n <ng-container *ngIf=\"isOnAggregatedYearsView || isOnYearView\">\n <div class=\"fd-calendar__action\" aria-live=\"polite\">\n <button\n fd-button\n fdType=\"transparent\"\n [attr.aria-labelledby]=\"_yearsRangeButtonLabelId + ' ' + _selectYearsRangeButtonAriaLabelId\"\n (click)=\"_processViewChange('aggregatedYear', $event)\"\n type=\"button\"\n >\n <span [attr.id]=\"_yearsRangeButtonLabelId\">{{ selectAggregatedYearLabel }}</span>\n </button>\n </div>\n </ng-container>\n <div class=\"fd-calendar__action fd-calendar__action--arrow-right\">\n <button\n fd-button\n fdType=\"transparent\"\n glyph=\"slim-arrow-right\"\n [attr.id]=\"_nextButtonId\"\n [disabled]=\"nextButtonDisabled\"\n [attr.title]=\"nextAriaLabel\"\n [ariaLabel]=\"nextAriaLabel\"\n (click)=\"nextClicked.emit()\"\n type=\"button\"\n ></button>\n </div>\n <button\n *ngIf=\"mobileLandscape\"\n fd-button\n fd-calendar-close-button\n class=\"fd-calendar__close-button--navigation\"\n type=\"button\"\n glyph=\"decline\"\n fdType=\"transparent\"\n (click)=\"_emitClose()\"\n ></button>\n </div>\n\n <!-- Hidden elements for aria purposes -->\n <div hidden aria-hidden=\"true\">\n <div [attr.id]=\"_selectMonthButtonAriaLabelId\">{{ selectMonthAriaLabel }}</div>\n <div [attr.id]=\"_selectYearButtonAriaLabelId\">{{
|
|
398
|
+
CalendarHeaderComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: CalendarHeaderComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: CalendarService }, { token: i2$1.DatetimeAdapter }], target: i0.ɵɵFactoryTarget.Component });
|
|
399
|
+
CalendarHeaderComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: CalendarHeaderComponent, selector: "fd-calendar-header", inputs: { activeView: "activeView", currentlyDisplayed: "currentlyDisplayed", previousButtonDisabled: "previousButtonDisabled", nextButtonDisabled: "nextButtonDisabled", calendarYearGrid: "calendarYearGrid", id: "id", mobileLandscape: "mobileLandscape" }, outputs: { activeViewChange: "activeViewChange", previousClicked: "previousClicked", nextClicked: "nextClicked", closeClicked: "closeClicked" }, host: { properties: { "attr.id": "viewId" } }, viewQueries: [{ propertyName: "_prevButtonComponent", first: true, predicate: ["prevButton"], descendants: true, read: ElementRef }], usesOnChanges: true, ngImport: i0, template: "<header class=\"fd-calendar__header\">\n <div class=\"fd-calendar__navigation\" [class.fd-calendar__navigation--main]=\"mobileLandscape\">\n <div class=\"fd-calendar__action fd-calendar__action--arrow-left\">\n <button\n #prevButton\n fd-button\n fdType=\"transparent\"\n glyph=\"slim-arrow-left\"\n [attr.id]=\"_prevButtonId\"\n [disabled]=\"previousButtonDisabled\"\n [attr.title]=\"previousAriaLabel | fdTranslate\"\n [ariaLabel]=\"previousAriaLabel | fdTranslate\"\n type=\"button\"\n (click)=\"previousClicked.emit()\"\n ></button>\n </div>\n <ng-container *ngIf=\"isOnDayView || isOnMonthView\">\n <div class=\"fd-calendar__action\">\n <!-- Select month button -->\n <button\n fd-button\n type=\"button\"\n fdType=\"transparent\"\n [attr.aria-labelledby]=\"_monthButtonLabelId + ' ' + _selectMonthButtonAriaLabelId\"\n [attr.data-fd-calendar-month]=\"currentlyDisplayed.month\"\n (click)=\"_processViewChange('month', $event)\"\n >\n <span [attr.id]=\"_monthButtonLabelId\">{{ selectMonthLabel }}</span>\n </button>\n </div>\n <div class=\"fd-calendar__action\">\n <!-- Select year button -->\n <button\n fd-button\n type=\"button\"\n fdType=\"transparent\"\n [attr.aria-labelledby]=\"_yearButtonLabelId + ' ' + _selectYearButtonAriaLabelId\"\n [attr.data-fd-calendar-year]=\"currentlyDisplayed.year\"\n (click)=\"_processViewChange('year', $event)\"\n >\n <span [attr.id]=\"_yearButtonLabelId\">{{ selectYearLabel }}</span>\n </button>\n </div>\n </ng-container>\n <ng-container *ngIf=\"isOnAggregatedYearsView || isOnYearView\">\n <div class=\"fd-calendar__action\" aria-live=\"polite\">\n <button\n fd-button\n fdType=\"transparent\"\n [attr.aria-labelledby]=\"_yearsRangeButtonLabelId + ' ' + _selectYearsRangeButtonAriaLabelId\"\n (click)=\"_processViewChange('aggregatedYear', $event)\"\n type=\"button\"\n >\n <span [attr.id]=\"_yearsRangeButtonLabelId\">{{ selectAggregatedYearLabel }}</span>\n </button>\n </div>\n </ng-container>\n <div class=\"fd-calendar__action fd-calendar__action--arrow-right\">\n <button\n fd-button\n fdType=\"transparent\"\n glyph=\"slim-arrow-right\"\n [attr.id]=\"_nextButtonId\"\n [disabled]=\"nextButtonDisabled\"\n [attr.title]=\"nextAriaLabel | fdTranslate\"\n [ariaLabel]=\"nextAriaLabel | fdTranslate\"\n (click)=\"nextClicked.emit()\"\n type=\"button\"\n ></button>\n </div>\n <button\n *ngIf=\"mobileLandscape\"\n fd-button\n fd-calendar-close-button\n class=\"fd-calendar__close-button--navigation\"\n type=\"button\"\n glyph=\"decline\"\n fdType=\"transparent\"\n (click)=\"_emitClose()\"\n ></button>\n </div>\n\n <!-- Hidden elements for aria purposes -->\n <div hidden aria-hidden=\"true\">\n <div [attr.id]=\"_selectMonthButtonAriaLabelId\">{{ selectMonthAriaLabel | fdTranslate }}</div>\n <div [attr.id]=\"_selectYearButtonAriaLabelId\">{{ 'coreCalendar.yearSelectionLabel' | fdTranslate }}</div>\n <div [attr.id]=\"_selectYearsRangeButtonAriaLabelId\">{{ selectAggregatedYearAriaLabel | fdTranslate }}</div>\n </div>\n</header>\n", styles: [""], dependencies: [{ kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i4.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "directive", type: CalendarCloseButtonDirective, selector: "[fd-calendar-close-button]" }, { kind: "pipe", type: i5.FdTranslatePipe, name: "fdTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
476
400
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: CalendarHeaderComponent, decorators: [{
|
|
477
401
|
type: Component,
|
|
478
402
|
args: [{ selector: 'fd-calendar-header', encapsulation: ViewEncapsulation.None, host: {
|
|
479
403
|
'[attr.id]': 'viewId'
|
|
480
|
-
}, changeDetection: ChangeDetectionStrategy.OnPush, template: "<header class=\"fd-calendar__header\">\n <div class=\"fd-calendar__navigation\" [class.fd-calendar__navigation--main]=\"mobileLandscape\">\n <div class=\"fd-calendar__action fd-calendar__action--arrow-left\">\n <button\n #prevButton\n fd-button\n fdType=\"transparent\"\n glyph=\"slim-arrow-left\"\n [attr.id]=\"_prevButtonId\"\n [disabled]=\"previousButtonDisabled\"\n [attr.title]=\"previousAriaLabel\"\n [ariaLabel]=\"previousAriaLabel\"\n type=\"button\"\n (click)=\"previousClicked.emit()\"\n ></button>\n </div>\n <ng-container *ngIf=\"isOnDayView || isOnMonthView\">\n <div class=\"fd-calendar__action\">\n <!-- Select month button -->\n <button\n fd-button\n type=\"button\"\n fdType=\"transparent\"\n [attr.aria-labelledby]=\"_monthButtonLabelId + ' ' + _selectMonthButtonAriaLabelId\"\n [attr.data-fd-calendar-month]=\"currentlyDisplayed.month\"\n (click)=\"_processViewChange('month', $event)\"\n >\n <span [attr.id]=\"_monthButtonLabelId\">{{ selectMonthLabel }}</span>\n </button>\n </div>\n <div class=\"fd-calendar__action\">\n <!-- Select year button -->\n <button\n fd-button\n type=\"button\"\n fdType=\"transparent\"\n [attr.aria-labelledby]=\"_yearButtonLabelId + ' ' + _selectYearButtonAriaLabelId\"\n [attr.data-fd-calendar-year]=\"currentlyDisplayed.year\"\n (click)=\"_processViewChange('year', $event)\"\n >\n <span [attr.id]=\"_yearButtonLabelId\">{{ selectYearLabel }}</span>\n </button>\n </div>\n </ng-container>\n <ng-container *ngIf=\"isOnAggregatedYearsView || isOnYearView\">\n <div class=\"fd-calendar__action\" aria-live=\"polite\">\n <button\n fd-button\n fdType=\"transparent\"\n [attr.aria-labelledby]=\"_yearsRangeButtonLabelId + ' ' + _selectYearsRangeButtonAriaLabelId\"\n (click)=\"_processViewChange('aggregatedYear', $event)\"\n type=\"button\"\n >\n <span [attr.id]=\"_yearsRangeButtonLabelId\">{{ selectAggregatedYearLabel }}</span>\n </button>\n </div>\n </ng-container>\n <div class=\"fd-calendar__action fd-calendar__action--arrow-right\">\n <button\n fd-button\n fdType=\"transparent\"\n glyph=\"slim-arrow-right\"\n [attr.id]=\"_nextButtonId\"\n [disabled]=\"nextButtonDisabled\"\n [attr.title]=\"nextAriaLabel\"\n [ariaLabel]=\"nextAriaLabel\"\n (click)=\"nextClicked.emit()\"\n type=\"button\"\n ></button>\n </div>\n <button\n *ngIf=\"mobileLandscape\"\n fd-button\n fd-calendar-close-button\n class=\"fd-calendar__close-button--navigation\"\n type=\"button\"\n glyph=\"decline\"\n fdType=\"transparent\"\n (click)=\"_emitClose()\"\n ></button>\n </div>\n\n <!-- Hidden elements for aria purposes -->\n <div hidden aria-hidden=\"true\">\n <div [attr.id]=\"_selectMonthButtonAriaLabelId\">{{ selectMonthAriaLabel }}</div>\n <div [attr.id]=\"_selectYearButtonAriaLabelId\">{{
|
|
481
|
-
}], ctorParameters: function () { return [{ type:
|
|
404
|
+
}, changeDetection: ChangeDetectionStrategy.OnPush, template: "<header class=\"fd-calendar__header\">\n <div class=\"fd-calendar__navigation\" [class.fd-calendar__navigation--main]=\"mobileLandscape\">\n <div class=\"fd-calendar__action fd-calendar__action--arrow-left\">\n <button\n #prevButton\n fd-button\n fdType=\"transparent\"\n glyph=\"slim-arrow-left\"\n [attr.id]=\"_prevButtonId\"\n [disabled]=\"previousButtonDisabled\"\n [attr.title]=\"previousAriaLabel | fdTranslate\"\n [ariaLabel]=\"previousAriaLabel | fdTranslate\"\n type=\"button\"\n (click)=\"previousClicked.emit()\"\n ></button>\n </div>\n <ng-container *ngIf=\"isOnDayView || isOnMonthView\">\n <div class=\"fd-calendar__action\">\n <!-- Select month button -->\n <button\n fd-button\n type=\"button\"\n fdType=\"transparent\"\n [attr.aria-labelledby]=\"_monthButtonLabelId + ' ' + _selectMonthButtonAriaLabelId\"\n [attr.data-fd-calendar-month]=\"currentlyDisplayed.month\"\n (click)=\"_processViewChange('month', $event)\"\n >\n <span [attr.id]=\"_monthButtonLabelId\">{{ selectMonthLabel }}</span>\n </button>\n </div>\n <div class=\"fd-calendar__action\">\n <!-- Select year button -->\n <button\n fd-button\n type=\"button\"\n fdType=\"transparent\"\n [attr.aria-labelledby]=\"_yearButtonLabelId + ' ' + _selectYearButtonAriaLabelId\"\n [attr.data-fd-calendar-year]=\"currentlyDisplayed.year\"\n (click)=\"_processViewChange('year', $event)\"\n >\n <span [attr.id]=\"_yearButtonLabelId\">{{ selectYearLabel }}</span>\n </button>\n </div>\n </ng-container>\n <ng-container *ngIf=\"isOnAggregatedYearsView || isOnYearView\">\n <div class=\"fd-calendar__action\" aria-live=\"polite\">\n <button\n fd-button\n fdType=\"transparent\"\n [attr.aria-labelledby]=\"_yearsRangeButtonLabelId + ' ' + _selectYearsRangeButtonAriaLabelId\"\n (click)=\"_processViewChange('aggregatedYear', $event)\"\n type=\"button\"\n >\n <span [attr.id]=\"_yearsRangeButtonLabelId\">{{ selectAggregatedYearLabel }}</span>\n </button>\n </div>\n </ng-container>\n <div class=\"fd-calendar__action fd-calendar__action--arrow-right\">\n <button\n fd-button\n fdType=\"transparent\"\n glyph=\"slim-arrow-right\"\n [attr.id]=\"_nextButtonId\"\n [disabled]=\"nextButtonDisabled\"\n [attr.title]=\"nextAriaLabel | fdTranslate\"\n [ariaLabel]=\"nextAriaLabel | fdTranslate\"\n (click)=\"nextClicked.emit()\"\n type=\"button\"\n ></button>\n </div>\n <button\n *ngIf=\"mobileLandscape\"\n fd-button\n fd-calendar-close-button\n class=\"fd-calendar__close-button--navigation\"\n type=\"button\"\n glyph=\"decline\"\n fdType=\"transparent\"\n (click)=\"_emitClose()\"\n ></button>\n </div>\n\n <!-- Hidden elements for aria purposes -->\n <div hidden aria-hidden=\"true\">\n <div [attr.id]=\"_selectMonthButtonAriaLabelId\">{{ selectMonthAriaLabel | fdTranslate }}</div>\n <div [attr.id]=\"_selectYearButtonAriaLabelId\">{{ 'coreCalendar.yearSelectionLabel' | fdTranslate }}</div>\n <div [attr.id]=\"_selectYearsRangeButtonAriaLabelId\">{{ selectAggregatedYearAriaLabel | fdTranslate }}</div>\n </div>\n</header>\n" }]
|
|
405
|
+
}], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: CalendarService }, { type: i2$1.DatetimeAdapter }]; }, propDecorators: { activeView: [{
|
|
482
406
|
type: Input
|
|
483
407
|
}], currentlyDisplayed: [{
|
|
484
408
|
type: Input
|
|
@@ -608,13 +532,12 @@ class CalendarDayViewComponent {
|
|
|
608
532
|
return this._selectedRangeDate;
|
|
609
533
|
}
|
|
610
534
|
/** @hidden */
|
|
611
|
-
constructor(eRef, changeDetRef, calendarService, _dateTimeFormats, _dateTimeAdapter
|
|
535
|
+
constructor(eRef, changeDetRef, calendarService, _dateTimeFormats, _dateTimeAdapter) {
|
|
612
536
|
this.eRef = eRef;
|
|
613
537
|
this.changeDetRef = changeDetRef;
|
|
614
538
|
this.calendarService = calendarService;
|
|
615
539
|
this._dateTimeFormats = _dateTimeFormats;
|
|
616
540
|
this._dateTimeAdapter = _dateTimeAdapter;
|
|
617
|
-
this._calendarI18nLabels = _calendarI18nLabels;
|
|
618
541
|
/** The type of calendar, 'single' for single date selection or 'range' for a range of dates. */
|
|
619
542
|
this.calType = 'single';
|
|
620
543
|
/**
|
|
@@ -691,6 +614,7 @@ class CalendarDayViewComponent {
|
|
|
691
614
|
/**
|
|
692
615
|
* Function for selecting a date on the calendar. Typically called when a date is clicked, but can also be called programmatically.
|
|
693
616
|
* @param day CalendarDay object to be selected.
|
|
617
|
+
* @param event
|
|
694
618
|
*/
|
|
695
619
|
selectDate(day, event) {
|
|
696
620
|
if (event) {
|
|
@@ -820,57 +744,6 @@ class CalendarDayViewComponent {
|
|
|
820
744
|
return totalCalendarRows.concat(calendarRow);
|
|
821
745
|
});
|
|
822
746
|
}
|
|
823
|
-
/**
|
|
824
|
-
* @hidden
|
|
825
|
-
* Today cell label.
|
|
826
|
-
* Is used in conjunction with cell date itself
|
|
827
|
-
*/
|
|
828
|
-
get _todayAriaLabel() {
|
|
829
|
-
return this._calendarI18nLabels.todayLabel;
|
|
830
|
-
}
|
|
831
|
-
/**
|
|
832
|
-
* @hidden
|
|
833
|
-
* Selected date cell label.
|
|
834
|
-
* Is used in conjunction with cell date itself
|
|
835
|
-
*/
|
|
836
|
-
get _selectedDateAriaLabel() {
|
|
837
|
-
return this._calendarI18nLabels.dateSelectedLabel;
|
|
838
|
-
}
|
|
839
|
-
/**
|
|
840
|
-
* @hidden
|
|
841
|
-
* column label
|
|
842
|
-
*/
|
|
843
|
-
get _weekColumnLabelAriaLabel() {
|
|
844
|
-
return this._calendarI18nLabels.weekColumnLabel;
|
|
845
|
-
}
|
|
846
|
-
/**
|
|
847
|
-
* @hidden
|
|
848
|
-
* Range start label
|
|
849
|
-
*/
|
|
850
|
-
get _rangeStartAriaLabel() {
|
|
851
|
-
return this._calendarI18nLabels.rangeStartLabel;
|
|
852
|
-
}
|
|
853
|
-
/**
|
|
854
|
-
* @hidden
|
|
855
|
-
* Range end label
|
|
856
|
-
*/
|
|
857
|
-
get _rangeEndAriaLabel() {
|
|
858
|
-
return this._calendarI18nLabels.rangeEndLabel;
|
|
859
|
-
}
|
|
860
|
-
/**
|
|
861
|
-
* @hidden
|
|
862
|
-
* Date in past label
|
|
863
|
-
*/
|
|
864
|
-
get _dateInPastAriaLabel() {
|
|
865
|
-
return this._calendarI18nLabels.dayInPastLabel;
|
|
866
|
-
}
|
|
867
|
-
/**
|
|
868
|
-
* @hidden
|
|
869
|
-
* View description
|
|
870
|
-
*/
|
|
871
|
-
get _viewRoleDescription() {
|
|
872
|
-
return this._calendarI18nLabels.calendarDayViewDescription;
|
|
873
|
-
}
|
|
874
747
|
/**
|
|
875
748
|
* View ID
|
|
876
749
|
*/
|
|
@@ -924,7 +797,7 @@ class CalendarDayViewComponent {
|
|
|
924
797
|
* Method that handles day cells keydown events,
|
|
925
798
|
* @param event KeyboardEvent
|
|
926
799
|
* @param cell CalendarDay
|
|
927
|
-
* @param
|
|
800
|
+
* @param index
|
|
928
801
|
*/
|
|
929
802
|
_onKeydownDayHandler(event, cell, index) {
|
|
930
803
|
if (event.key === 'Tab' && !event.shiftKey) {
|
|
@@ -1324,18 +1197,18 @@ class CalendarDayViewComponent {
|
|
|
1324
1197
|
this._focusElementBySelector(`#${this._getCellIdByIndex(index)}`);
|
|
1325
1198
|
}
|
|
1326
1199
|
}
|
|
1327
|
-
CalendarDayViewComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: CalendarDayViewComponent, deps: [{ token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: CalendarService }, { token: DATE_TIME_FORMATS }, { token: i2.DatetimeAdapter }
|
|
1328
|
-
CalendarDayViewComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: CalendarDayViewComponent, selector: "fd-calendar-day-view", inputs: { currentlyDisplayed: "currentlyDisplayed", selectedDate: "selectedDate", selectedRangeDate: "selectedRangeDate", startingDayOfWeek: "startingDayOfWeek", calType: "calType", id: "id", rangeHoverEffect: "rangeHoverEffect", markWeekends: "markWeekends", showWeekNumbers: "showWeekNumbers", focusEscapeFunction: "focusEscapeFunction", specialDaysRules: "specialDaysRules", disableFunction: "disableFunction", disableRangeStartFunction: "disableRangeStartFunction", disableRangeEndFunction: "disableRangeEndFunction" }, outputs: { selectedRangeDateChange: "selectedRangeDateChange", nextMonthSelect: "nextMonthSelect", previousMonthSelect: "previousMonthSelect", selectedDateChange: "selectedDateChange" }, host: { properties: { "attr.id": "viewId" }, classAttribute: "fd-calendar__dates" }, usesOnChanges: true, ngImport: i0, template: "<table
|
|
1200
|
+
CalendarDayViewComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: CalendarDayViewComponent, deps: [{ token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: CalendarService }, { token: DATE_TIME_FORMATS }, { token: i2$1.DatetimeAdapter }], target: i0.ɵɵFactoryTarget.Component });
|
|
1201
|
+
CalendarDayViewComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: CalendarDayViewComponent, selector: "fd-calendar-day-view", inputs: { currentlyDisplayed: "currentlyDisplayed", selectedDate: "selectedDate", selectedRangeDate: "selectedRangeDate", startingDayOfWeek: "startingDayOfWeek", calType: "calType", id: "id", rangeHoverEffect: "rangeHoverEffect", markWeekends: "markWeekends", showWeekNumbers: "showWeekNumbers", focusEscapeFunction: "focusEscapeFunction", specialDaysRules: "specialDaysRules", disableFunction: "disableFunction", disableRangeStartFunction: "disableRangeStartFunction", disableRangeEndFunction: "disableRangeEndFunction" }, outputs: { selectedRangeDateChange: "selectedRangeDateChange", nextMonthSelect: "nextMonthSelect", previousMonthSelect: "previousMonthSelect", selectedDateChange: "selectedDateChange" }, host: { properties: { "attr.id": "viewId" }, classAttribute: "fd-calendar__dates" }, usesOnChanges: true, ngImport: i0, template: "<table\n class=\"fd-calendar__table\"\n role=\"grid\"\n [attr.aria-roledescription]=\"'coreCalendar.calendarDayViewDescription' | fdTranslate\"\n>\n <thead class=\"fd-calendar__group\" role=\"rowgroup\">\n <tr class=\"fd-calendar__row\" role=\"row\">\n <th\n *ngIf=\"showWeekNumbers\"\n class=\"fd-calendar__item fd-calendar__item--side-helper\"\n role=\"columnheader\"\n [attr.id]=\"_weekNumbersColumnHeaderId\"\n [attr.aria-label]=\"'coreCalendar.weekColumnLabel' | fdTranslate\"\n ></th>\n <th\n class=\"fd-calendar__item fd-calendar__item--side-helper\"\n role=\"columnheader\"\n *ngFor=\"let day of shortWeekDays; index as i\"\n [attr.aria-label]=\"longWeekDays[i]\"\n >\n <span class=\"fd-calendar__text\">{{ day }}</span>\n </th>\n </tr>\n </thead>\n <tbody class=\"fd-calendar__group\" role=\"rowgroup\">\n <tr class=\"fd-calendar__row\" role=\"row\" *ngFor=\"let row of _dayViewGrid; let rowIndex = index\">\n <th\n *ngIf=\"showWeekNumbers\"\n class=\"fd-calendar__item fd-calendar__item--side-helper\"\n role=\"rowheader\"\n scope=\"row\"\n [attr.data-fd-calendar-week]=\"_weeks[rowIndex]\"\n [attr.id]=\"viewId + '-week-' + _weeks[rowIndex]\"\n [attr.aria-labelledby]=\"_weekNumbersColumnHeaderId + ' ' + (viewId + '-week-' + _weeks[rowIndex])\"\n >\n <span *ngIf=\"_weeks && _weeks[rowIndex]\" class=\"fd-calendar__text\">\n {{ _weeks[rowIndex] }}\n </span>\n </th>\n\n <td\n class=\"fd-calendar__item\"\n role=\"gridcell\"\n *ngFor=\"let cell of row; let cellIndex = index\"\n [class.is-active]=\"cell.selectedFirst || cell.selectedLast || cell.selected\"\n [class.fd-calendar__item--range]=\"\n (cell.selectedRange || cell.hoverRange) && !cell.selectedFirst && !cell.selectedLast\n \"\n [class.fd-calendar__item--current]=\"cell.current\"\n [class.fd-calendar__item--weekend]=\"cell.weekend && markWeekends && cell.monthStatus === 'current'\"\n [class.fd-calendar__item--other-month]=\"cell.monthStatus !== 'current'\"\n [class.is-disabled]=\"cell.disabled\"\n [class]=\"cell.specialNumber ? 'fd-calendar__special-day--' + cell.specialNumber : ''\"\n [attr.id]=\"cell.id\"\n [attr.data-fd-calendar-date-day]=\"cell.label\"\n [attr.data-fd-calendar-day]=\"cell.index\"\n [attr.aria-selected]=\"cell.selected\"\n [attr.aria-disabled]=\"cell.disabled\"\n [attr.tabindex]=\"cell.isTabIndexed ? 0 : -1\"\n (click)=\"selectDate(cell, $event)\"\n (mouseenter)=\"_refreshHoverRange(cell)\"\n (keydown)=\"_onKeydownDayHandler($event, cell, _getIndex(rowIndex, cellIndex))\"\n >\n <span\n class=\"fd-calendar__text\"\n role=\"button\"\n [attr.aria-labelledby]=\"\n cell.id +\n '-aria-label ' +\n (cell.selectedFirst ? _dateRangeStartLabelId + ' ' : '') +\n (cell.selectedLast ? _dateRangeEndLabelId + ' ' : '') +\n (cell.current ? _todayLabelId + ' ' : '') +\n (cell.selected && calType === 'single' ? _selectedDateLabelId + ' ' : '') +\n (cell.past ? _dateInPastLabelId : '')\n \"\n >{{ cell.label }}</span\n >\n <span hidden aria-hidden=\"true\" [attr.id]=\"cell.id + '-aria-label'\">\n {{ cell.ariaLabel }}\n </span>\n </td>\n </tr>\n <tr class=\"fd-calendar__row\" *ngIf=\"_dayViewGrid.length <= 5\">\n <td class=\"fd-calendar__item hidden-day\"></td>\n </tr>\n <tr class=\"fd-calendar__row\" *ngIf=\"_dayViewGrid.length === 4\">\n <td class=\"fd-calendar__item hidden-day\"></td>\n </tr>\n </tbody>\n</table>\n\n<!-- Hidden elements for aria purposes -->\n<div hidden aria-hidden=\"true\">\n <div [attr.id]=\"_todayLabelId\">{{ 'coreCalendar.todayLabel' | fdTranslate }}</div>\n <div [attr.id]=\"_selectedDateLabelId\">{{ 'coreCalendar.dateSelectedLabel' | fdTranslate }}</div>\n <div [attr.id]=\"_dateRangeStartLabelId\">{{ 'coreCalendar.rangeStartLabel' | fdTranslate }}</div>\n <div [attr.id]=\"_dateRangeEndLabelId\">{{ 'coreCalendar.rangeEndLabel' | fdTranslate }}</div>\n <div [attr.id]=\"_dateInPastLabelId\">{{ 'coreCalendar.dayInPastLabel' | fdTranslate }}</div>\n</div>\n", styles: [".hidden-day{visibility:hidden}\n"], dependencies: [{ kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i5.FdTranslatePipe, name: "fdTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
1329
1202
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: CalendarDayViewComponent, decorators: [{
|
|
1330
1203
|
type: Component,
|
|
1331
1204
|
args: [{ selector: 'fd-calendar-day-view', encapsulation: ViewEncapsulation.None, host: {
|
|
1332
1205
|
'[attr.id]': 'viewId',
|
|
1333
1206
|
class: 'fd-calendar__dates'
|
|
1334
|
-
}, changeDetection: ChangeDetectionStrategy.OnPush, template: "<table
|
|
1207
|
+
}, changeDetection: ChangeDetectionStrategy.OnPush, template: "<table\n class=\"fd-calendar__table\"\n role=\"grid\"\n [attr.aria-roledescription]=\"'coreCalendar.calendarDayViewDescription' | fdTranslate\"\n>\n <thead class=\"fd-calendar__group\" role=\"rowgroup\">\n <tr class=\"fd-calendar__row\" role=\"row\">\n <th\n *ngIf=\"showWeekNumbers\"\n class=\"fd-calendar__item fd-calendar__item--side-helper\"\n role=\"columnheader\"\n [attr.id]=\"_weekNumbersColumnHeaderId\"\n [attr.aria-label]=\"'coreCalendar.weekColumnLabel' | fdTranslate\"\n ></th>\n <th\n class=\"fd-calendar__item fd-calendar__item--side-helper\"\n role=\"columnheader\"\n *ngFor=\"let day of shortWeekDays; index as i\"\n [attr.aria-label]=\"longWeekDays[i]\"\n >\n <span class=\"fd-calendar__text\">{{ day }}</span>\n </th>\n </tr>\n </thead>\n <tbody class=\"fd-calendar__group\" role=\"rowgroup\">\n <tr class=\"fd-calendar__row\" role=\"row\" *ngFor=\"let row of _dayViewGrid; let rowIndex = index\">\n <th\n *ngIf=\"showWeekNumbers\"\n class=\"fd-calendar__item fd-calendar__item--side-helper\"\n role=\"rowheader\"\n scope=\"row\"\n [attr.data-fd-calendar-week]=\"_weeks[rowIndex]\"\n [attr.id]=\"viewId + '-week-' + _weeks[rowIndex]\"\n [attr.aria-labelledby]=\"_weekNumbersColumnHeaderId + ' ' + (viewId + '-week-' + _weeks[rowIndex])\"\n >\n <span *ngIf=\"_weeks && _weeks[rowIndex]\" class=\"fd-calendar__text\">\n {{ _weeks[rowIndex] }}\n </span>\n </th>\n\n <td\n class=\"fd-calendar__item\"\n role=\"gridcell\"\n *ngFor=\"let cell of row; let cellIndex = index\"\n [class.is-active]=\"cell.selectedFirst || cell.selectedLast || cell.selected\"\n [class.fd-calendar__item--range]=\"\n (cell.selectedRange || cell.hoverRange) && !cell.selectedFirst && !cell.selectedLast\n \"\n [class.fd-calendar__item--current]=\"cell.current\"\n [class.fd-calendar__item--weekend]=\"cell.weekend && markWeekends && cell.monthStatus === 'current'\"\n [class.fd-calendar__item--other-month]=\"cell.monthStatus !== 'current'\"\n [class.is-disabled]=\"cell.disabled\"\n [class]=\"cell.specialNumber ? 'fd-calendar__special-day--' + cell.specialNumber : ''\"\n [attr.id]=\"cell.id\"\n [attr.data-fd-calendar-date-day]=\"cell.label\"\n [attr.data-fd-calendar-day]=\"cell.index\"\n [attr.aria-selected]=\"cell.selected\"\n [attr.aria-disabled]=\"cell.disabled\"\n [attr.tabindex]=\"cell.isTabIndexed ? 0 : -1\"\n (click)=\"selectDate(cell, $event)\"\n (mouseenter)=\"_refreshHoverRange(cell)\"\n (keydown)=\"_onKeydownDayHandler($event, cell, _getIndex(rowIndex, cellIndex))\"\n >\n <span\n class=\"fd-calendar__text\"\n role=\"button\"\n [attr.aria-labelledby]=\"\n cell.id +\n '-aria-label ' +\n (cell.selectedFirst ? _dateRangeStartLabelId + ' ' : '') +\n (cell.selectedLast ? _dateRangeEndLabelId + ' ' : '') +\n (cell.current ? _todayLabelId + ' ' : '') +\n (cell.selected && calType === 'single' ? _selectedDateLabelId + ' ' : '') +\n (cell.past ? _dateInPastLabelId : '')\n \"\n >{{ cell.label }}</span\n >\n <span hidden aria-hidden=\"true\" [attr.id]=\"cell.id + '-aria-label'\">\n {{ cell.ariaLabel }}\n </span>\n </td>\n </tr>\n <tr class=\"fd-calendar__row\" *ngIf=\"_dayViewGrid.length <= 5\">\n <td class=\"fd-calendar__item hidden-day\"></td>\n </tr>\n <tr class=\"fd-calendar__row\" *ngIf=\"_dayViewGrid.length === 4\">\n <td class=\"fd-calendar__item hidden-day\"></td>\n </tr>\n </tbody>\n</table>\n\n<!-- Hidden elements for aria purposes -->\n<div hidden aria-hidden=\"true\">\n <div [attr.id]=\"_todayLabelId\">{{ 'coreCalendar.todayLabel' | fdTranslate }}</div>\n <div [attr.id]=\"_selectedDateLabelId\">{{ 'coreCalendar.dateSelectedLabel' | fdTranslate }}</div>\n <div [attr.id]=\"_dateRangeStartLabelId\">{{ 'coreCalendar.rangeStartLabel' | fdTranslate }}</div>\n <div [attr.id]=\"_dateRangeEndLabelId\">{{ 'coreCalendar.rangeEndLabel' | fdTranslate }}</div>\n <div [attr.id]=\"_dateInPastLabelId\">{{ 'coreCalendar.dayInPastLabel' | fdTranslate }}</div>\n</div>\n", styles: [".hidden-day{visibility:hidden}\n"] }]
|
|
1335
1208
|
}], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.ChangeDetectorRef }, { type: CalendarService }, { type: undefined, decorators: [{
|
|
1336
1209
|
type: Inject,
|
|
1337
1210
|
args: [DATE_TIME_FORMATS]
|
|
1338
|
-
}] }, { type: i2.DatetimeAdapter }
|
|
1211
|
+
}] }, { type: i2$1.DatetimeAdapter }]; }, propDecorators: { currentlyDisplayed: [{
|
|
1339
1212
|
type: Input
|
|
1340
1213
|
}], selectedDate: [{
|
|
1341
1214
|
type: Input
|
|
@@ -1376,13 +1249,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImpor
|
|
|
1376
1249
|
/** Component representing the month view of the calendar. */
|
|
1377
1250
|
class CalendarMonthViewComponent {
|
|
1378
1251
|
/** @hidden */
|
|
1379
|
-
constructor(_eRef, _changeDetectorRef, _calendarService, _dateTimeFormats, _dateTimeAdapter
|
|
1252
|
+
constructor(_eRef, _changeDetectorRef, _calendarService, _dateTimeFormats, _dateTimeAdapter) {
|
|
1380
1253
|
this._eRef = _eRef;
|
|
1381
1254
|
this._changeDetectorRef = _changeDetectorRef;
|
|
1382
1255
|
this._calendarService = _calendarService;
|
|
1383
1256
|
this._dateTimeFormats = _dateTimeFormats;
|
|
1384
1257
|
this._dateTimeAdapter = _dateTimeAdapter;
|
|
1385
|
-
this._calendarI18nLabels = _calendarI18nLabels;
|
|
1386
1258
|
/** An event fired when a new month is selected */
|
|
1387
1259
|
this.monthClicked = new EventEmitter();
|
|
1388
1260
|
/**
|
|
@@ -1435,29 +1307,6 @@ class CalendarMonthViewComponent {
|
|
|
1435
1307
|
get viewId() {
|
|
1436
1308
|
return this.id + '-month-view';
|
|
1437
1309
|
}
|
|
1438
|
-
/**
|
|
1439
|
-
* @hidden
|
|
1440
|
-
* Today cell label.
|
|
1441
|
-
* Is used in conjunction with cell date itself
|
|
1442
|
-
*/
|
|
1443
|
-
get _todayAriaLabel() {
|
|
1444
|
-
return this._calendarI18nLabels.todayLabel;
|
|
1445
|
-
}
|
|
1446
|
-
/**
|
|
1447
|
-
* @hidden
|
|
1448
|
-
* Selected date cell label.
|
|
1449
|
-
* Is used in conjunction with cell date itself
|
|
1450
|
-
*/
|
|
1451
|
-
get _selectedDateAriaLabel() {
|
|
1452
|
-
return this._calendarI18nLabels.dateSelectedLabel;
|
|
1453
|
-
}
|
|
1454
|
-
/**
|
|
1455
|
-
* @hidden
|
|
1456
|
-
* View description
|
|
1457
|
-
*/
|
|
1458
|
-
get _viewRoleDescription() {
|
|
1459
|
-
return this._calendarI18nLabels.calendarMonthViewDescription;
|
|
1460
|
-
}
|
|
1461
1310
|
/**
|
|
1462
1311
|
* @hidden
|
|
1463
1312
|
* Today cell label ID
|
|
@@ -1593,17 +1442,17 @@ class CalendarMonthViewComponent {
|
|
|
1593
1442
|
this._focusElementBySelector(`#${this._getId(index)}`);
|
|
1594
1443
|
}
|
|
1595
1444
|
}
|
|
1596
|
-
CalendarMonthViewComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: CalendarMonthViewComponent, deps: [{ token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: CalendarService }, { token: DATE_TIME_FORMATS }, { token: i2.DatetimeAdapter }
|
|
1597
|
-
CalendarMonthViewComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: CalendarMonthViewComponent, selector: "fd-calendar-month-view", inputs: { id: "id", monthSelected: "monthSelected", focusEscapeFunction: "focusEscapeFunction", year: "year" }, outputs: { monthClicked: "monthClicked" }, host: { properties: { "attr.id": "viewId" } }, usesOnChanges: true, ngImport: i0, template: "<div class=\"fd-calendar__months\">\n <table
|
|
1445
|
+
CalendarMonthViewComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: CalendarMonthViewComponent, deps: [{ token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: CalendarService }, { token: DATE_TIME_FORMATS }, { token: i2$1.DatetimeAdapter }], target: i0.ɵɵFactoryTarget.Component });
|
|
1446
|
+
CalendarMonthViewComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: CalendarMonthViewComponent, selector: "fd-calendar-month-view", inputs: { id: "id", monthSelected: "monthSelected", focusEscapeFunction: "focusEscapeFunction", year: "year" }, outputs: { monthClicked: "monthClicked" }, host: { properties: { "attr.id": "viewId" } }, usesOnChanges: true, ngImport: i0, template: "<div class=\"fd-calendar__months\">\n <table\n class=\"fd-calendar__table\"\n role=\"grid\"\n [attr.aria-roledescription]=\"'coreCalendar.calendarMonthViewDescription' | fdTranslate\"\n >\n <tbody class=\"fd-calendar__group\" role=\"rowgroup\">\n <tr\n class=\"fd-calendar__row\"\n role=\"row\"\n *ngFor=\"let colMonths of _calendarMonthListGrid; let rowIndex = index\"\n >\n <td\n class=\"fd-calendar__item\"\n role=\"gridcell\"\n *ngFor=\"let monthCell of colMonths; let colIndex = index\"\n [class.fd-calendar__item--current]=\"monthCell.current\"\n [class.is-active]=\"monthCell.selected\"\n [attr.tabIndex]=\"monthCell.tabIndex\"\n [attr.id]=\"monthCell.id\"\n [attr.aria-selected]=\"monthCell.selected\"\n [attr.aria-disabled]=\"monthCell.disabled\"\n [attr.data-fd-calendar-month]=\"monthCell.month\"\n (keydown)=\"_onKeydownMonthHandler($event, monthCell.index)\"\n (click)=\"selectMonth(monthCell, $event)\"\n >\n <button\n fd-button\n fdType=\"transparent\"\n class=\"fd-calendar__item-button\"\n [class.is-active]=\"monthCell.current\"\n tabindex=\"-1\"\n >\n <span\n class=\"fd-calendar__text\"\n [attr.aria-labelledby]=\"\n monthCell.id +\n '-aria-label ' +\n (monthCell.current ? _todayLabelId + ' ' : '') +\n (monthCell.selected ? _selectedDateLabelId : '')\n \"\n >\n {{ monthCell.label }}\n </span>\n </button>\n\n <span hidden aria-hidden=\"true\" [attr.id]=\"monthCell.id + '-aria-label'\">\n {{ monthCell.ariaLabel }}\n </span>\n </td>\n </tr>\n </tbody>\n </table>\n\n <!-- Hidden elements for aria purposes -->\n <div hidden aria-hidden=\"true\">\n <div [attr.id]=\"_todayLabelId\">{{ 'coreCalendar.todayLabel' | fdTranslate }}</div>\n <div [attr.id]=\"_selectedDateLabelId\">{{ 'coreCalendar.dateSelectedLabel' | fdTranslate }}</div>\n </div>\n</div>\n", styles: [""], dependencies: [{ kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: i4.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "pipe", type: i5.FdTranslatePipe, name: "fdTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
1598
1447
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: CalendarMonthViewComponent, decorators: [{
|
|
1599
1448
|
type: Component,
|
|
1600
1449
|
args: [{ selector: 'fd-calendar-month-view', encapsulation: ViewEncapsulation.None, host: {
|
|
1601
1450
|
'[attr.id]': 'viewId'
|
|
1602
|
-
}, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"fd-calendar__months\">\n <table
|
|
1451
|
+
}, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"fd-calendar__months\">\n <table\n class=\"fd-calendar__table\"\n role=\"grid\"\n [attr.aria-roledescription]=\"'coreCalendar.calendarMonthViewDescription' | fdTranslate\"\n >\n <tbody class=\"fd-calendar__group\" role=\"rowgroup\">\n <tr\n class=\"fd-calendar__row\"\n role=\"row\"\n *ngFor=\"let colMonths of _calendarMonthListGrid; let rowIndex = index\"\n >\n <td\n class=\"fd-calendar__item\"\n role=\"gridcell\"\n *ngFor=\"let monthCell of colMonths; let colIndex = index\"\n [class.fd-calendar__item--current]=\"monthCell.current\"\n [class.is-active]=\"monthCell.selected\"\n [attr.tabIndex]=\"monthCell.tabIndex\"\n [attr.id]=\"monthCell.id\"\n [attr.aria-selected]=\"monthCell.selected\"\n [attr.aria-disabled]=\"monthCell.disabled\"\n [attr.data-fd-calendar-month]=\"monthCell.month\"\n (keydown)=\"_onKeydownMonthHandler($event, monthCell.index)\"\n (click)=\"selectMonth(monthCell, $event)\"\n >\n <button\n fd-button\n fdType=\"transparent\"\n class=\"fd-calendar__item-button\"\n [class.is-active]=\"monthCell.current\"\n tabindex=\"-1\"\n >\n <span\n class=\"fd-calendar__text\"\n [attr.aria-labelledby]=\"\n monthCell.id +\n '-aria-label ' +\n (monthCell.current ? _todayLabelId + ' ' : '') +\n (monthCell.selected ? _selectedDateLabelId : '')\n \"\n >\n {{ monthCell.label }}\n </span>\n </button>\n\n <span hidden aria-hidden=\"true\" [attr.id]=\"monthCell.id + '-aria-label'\">\n {{ monthCell.ariaLabel }}\n </span>\n </td>\n </tr>\n </tbody>\n </table>\n\n <!-- Hidden elements for aria purposes -->\n <div hidden aria-hidden=\"true\">\n <div [attr.id]=\"_todayLabelId\">{{ 'coreCalendar.todayLabel' | fdTranslate }}</div>\n <div [attr.id]=\"_selectedDateLabelId\">{{ 'coreCalendar.dateSelectedLabel' | fdTranslate }}</div>\n </div>\n</div>\n" }]
|
|
1603
1452
|
}], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.ChangeDetectorRef }, { type: CalendarService }, { type: undefined, decorators: [{
|
|
1604
1453
|
type: Inject,
|
|
1605
1454
|
args: [DATE_TIME_FORMATS]
|
|
1606
|
-
}] }, { type: i2.DatetimeAdapter }
|
|
1455
|
+
}] }, { type: i2$1.DatetimeAdapter }]; }, propDecorators: { id: [{
|
|
1607
1456
|
type: Input
|
|
1608
1457
|
}], monthSelected: [{
|
|
1609
1458
|
type: Input
|
|
@@ -1617,29 +1466,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImpor
|
|
|
1617
1466
|
|
|
1618
1467
|
/** Component representing the YearView of the Calendar Component. */
|
|
1619
1468
|
class CalendarYearViewComponent {
|
|
1620
|
-
/**
|
|
1621
|
-
* @hidden
|
|
1622
|
-
* Today cell label.
|
|
1623
|
-
* Is used in conjunction with cell date itself
|
|
1624
|
-
*/
|
|
1625
|
-
get _todayAriaLabel() {
|
|
1626
|
-
return this._calendarI18nLabels.todayLabel;
|
|
1627
|
-
}
|
|
1628
|
-
/**
|
|
1629
|
-
* @hidden
|
|
1630
|
-
* Selected date cell label.
|
|
1631
|
-
* Is used in conjunction with cell date itself
|
|
1632
|
-
*/
|
|
1633
|
-
get _selectedDateAriaLabel() {
|
|
1634
|
-
return this._calendarI18nLabels.dateSelectedLabel;
|
|
1635
|
-
}
|
|
1636
|
-
/**
|
|
1637
|
-
* @hidden
|
|
1638
|
-
* View description
|
|
1639
|
-
*/
|
|
1640
|
-
get _viewRoleDescription() {
|
|
1641
|
-
return this._calendarI18nLabels.calendarYearsViewDescription;
|
|
1642
|
-
}
|
|
1643
1469
|
/** View ID */
|
|
1644
1470
|
get viewId() {
|
|
1645
1471
|
return this.id + '-year-view';
|
|
@@ -1659,13 +1485,12 @@ class CalendarYearViewComponent {
|
|
|
1659
1485
|
return this.viewId + '-selected-date-label';
|
|
1660
1486
|
}
|
|
1661
1487
|
/** @hidden */
|
|
1662
|
-
constructor(_eRef, _changeDetectorRef, _calendarService, _dateTimeAdapter, _dateTimeFormats
|
|
1488
|
+
constructor(_eRef, _changeDetectorRef, _calendarService, _dateTimeAdapter, _dateTimeFormats) {
|
|
1663
1489
|
this._eRef = _eRef;
|
|
1664
1490
|
this._changeDetectorRef = _changeDetectorRef;
|
|
1665
1491
|
this._calendarService = _calendarService;
|
|
1666
1492
|
this._dateTimeAdapter = _dateTimeAdapter;
|
|
1667
1493
|
this._dateTimeFormats = _dateTimeFormats;
|
|
1668
|
-
this._calendarI18nLabels = _calendarI18nLabels;
|
|
1669
1494
|
/** Event fired when a year is selected. */
|
|
1670
1495
|
this.yearClicked = new EventEmitter();
|
|
1671
1496
|
/**
|
|
@@ -1879,17 +1704,17 @@ class CalendarYearViewComponent {
|
|
|
1879
1704
|
this._focusElementBySelector(`#${this._getId(index)}`);
|
|
1880
1705
|
}
|
|
1881
1706
|
}
|
|
1882
|
-
CalendarYearViewComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: CalendarYearViewComponent, deps: [{ token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: CalendarService }, { token: i2.DatetimeAdapter }, { token: DATE_TIME_FORMATS }
|
|
1883
|
-
CalendarYearViewComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: CalendarYearViewComponent, selector: "fd-calendar-year-view", inputs: { id: "id", focusEscapeFunction: "focusEscapeFunction", yearSelected: "yearSelected", yearViewGrid: "yearViewGrid" }, outputs: { yearClicked: "yearClicked" }, host: { properties: { "attr.id": "viewId" } }, usesOnChanges: true, ngImport: i0, template: "<div class=\"fd-calendar__years\">\n <table
|
|
1707
|
+
CalendarYearViewComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: CalendarYearViewComponent, deps: [{ token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: CalendarService }, { token: i2$1.DatetimeAdapter }, { token: DATE_TIME_FORMATS }], target: i0.ɵɵFactoryTarget.Component });
|
|
1708
|
+
CalendarYearViewComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: CalendarYearViewComponent, selector: "fd-calendar-year-view", inputs: { id: "id", focusEscapeFunction: "focusEscapeFunction", yearSelected: "yearSelected", yearViewGrid: "yearViewGrid" }, outputs: { yearClicked: "yearClicked" }, host: { properties: { "attr.id": "viewId" } }, usesOnChanges: true, ngImport: i0, template: "<div class=\"fd-calendar__years\">\n <table\n class=\"fd-calendar__table\"\n role=\"grid\"\n [attr.aria-roledescription]=\"'coreCalendar.calendarYearsViewDescription' | fdTranslate\"\n >\n <tbody class=\"fd-calendar__group\" role=\"rowgroup\">\n <tr\n class=\"fd-calendar__row\"\n role=\"row\"\n *ngFor=\"let colYears of _calendarYearListGrid; let rowIndex = index\"\n >\n <td\n class=\"fd-button fd-button--transparent fd-calendar__item\"\n role=\"gridcell\"\n *ngFor=\"let yearCell of colYears; let colIndex = index\"\n [class.fd-calendar__item--current]=\"yearCell.current\"\n [class.is-active]=\"yearCell.selected\"\n [attr.id]=\"yearCell.id\"\n [attr.tabindex]=\"yearCell.tabIndex\"\n [attr.aria-selected]=\"yearCell.selected\"\n [attr.aria-disabled]=\"yearCell.disabled\"\n [attr.data-fd-calendar-year]=\"yearCell.year\"\n (keydown)=\"_onKeydownYearHandler($event, yearCell.index)\"\n (click)=\"selectYear(yearCell, $event)\"\n >\n <button\n fd-button\n fdType=\"transparent\"\n class=\"fd-calendar__item-button\"\n [class.is-active]=\"yearCell.current\"\n tabindex=\"-1\"\n >\n <span\n class=\"fd-calendar__text\"\n [attr.aria-labelledby]=\"\n yearCell.id +\n '-aria-label ' +\n (yearCell.current ? _todayLabelId + ' ' : '') +\n (yearCell.selected ? _selectedDateLabelId : '')\n \"\n >\n {{ yearCell.label }}\n </span>\n </button>\n\n <span hidden aria-hidden=\"true\" [attr.id]=\"yearCell.id + '-aria-label'\">\n {{ yearCell.ariaLabel }}\n </span>\n </td>\n </tr>\n </tbody>\n </table>\n\n <!-- Hidden elements for aria purposes -->\n <div hidden aria-hidden=\"true\">\n <div [attr.id]=\"_todayLabelId\">{{ 'coreCalendar.todayLabel' | fdTranslate }}</div>\n <div [attr.id]=\"_selectedDateLabelId\">{{ 'coreCalendar.dateSelectedLabel' | fdTranslate }}</div>\n </div>\n</div>\n", styles: [""], dependencies: [{ kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: i4.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "pipe", type: i5.FdTranslatePipe, name: "fdTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
1884
1709
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: CalendarYearViewComponent, decorators: [{
|
|
1885
1710
|
type: Component,
|
|
1886
1711
|
args: [{ selector: 'fd-calendar-year-view', encapsulation: ViewEncapsulation.None, host: {
|
|
1887
1712
|
'[attr.id]': 'viewId'
|
|
1888
|
-
}, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"fd-calendar__years\">\n <table
|
|
1889
|
-
}], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.ChangeDetectorRef }, { type: CalendarService }, { type: i2.DatetimeAdapter }, { type: undefined, decorators: [{
|
|
1713
|
+
}, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"fd-calendar__years\">\n <table\n class=\"fd-calendar__table\"\n role=\"grid\"\n [attr.aria-roledescription]=\"'coreCalendar.calendarYearsViewDescription' | fdTranslate\"\n >\n <tbody class=\"fd-calendar__group\" role=\"rowgroup\">\n <tr\n class=\"fd-calendar__row\"\n role=\"row\"\n *ngFor=\"let colYears of _calendarYearListGrid; let rowIndex = index\"\n >\n <td\n class=\"fd-button fd-button--transparent fd-calendar__item\"\n role=\"gridcell\"\n *ngFor=\"let yearCell of colYears; let colIndex = index\"\n [class.fd-calendar__item--current]=\"yearCell.current\"\n [class.is-active]=\"yearCell.selected\"\n [attr.id]=\"yearCell.id\"\n [attr.tabindex]=\"yearCell.tabIndex\"\n [attr.aria-selected]=\"yearCell.selected\"\n [attr.aria-disabled]=\"yearCell.disabled\"\n [attr.data-fd-calendar-year]=\"yearCell.year\"\n (keydown)=\"_onKeydownYearHandler($event, yearCell.index)\"\n (click)=\"selectYear(yearCell, $event)\"\n >\n <button\n fd-button\n fdType=\"transparent\"\n class=\"fd-calendar__item-button\"\n [class.is-active]=\"yearCell.current\"\n tabindex=\"-1\"\n >\n <span\n class=\"fd-calendar__text\"\n [attr.aria-labelledby]=\"\n yearCell.id +\n '-aria-label ' +\n (yearCell.current ? _todayLabelId + ' ' : '') +\n (yearCell.selected ? _selectedDateLabelId : '')\n \"\n >\n {{ yearCell.label }}\n </span>\n </button>\n\n <span hidden aria-hidden=\"true\" [attr.id]=\"yearCell.id + '-aria-label'\">\n {{ yearCell.ariaLabel }}\n </span>\n </td>\n </tr>\n </tbody>\n </table>\n\n <!-- Hidden elements for aria purposes -->\n <div hidden aria-hidden=\"true\">\n <div [attr.id]=\"_todayLabelId\">{{ 'coreCalendar.todayLabel' | fdTranslate }}</div>\n <div [attr.id]=\"_selectedDateLabelId\">{{ 'coreCalendar.dateSelectedLabel' | fdTranslate }}</div>\n </div>\n</div>\n" }]
|
|
1714
|
+
}], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.ChangeDetectorRef }, { type: CalendarService }, { type: i2$1.DatetimeAdapter }, { type: undefined, decorators: [{
|
|
1890
1715
|
type: Inject,
|
|
1891
1716
|
args: [DATE_TIME_FORMATS]
|
|
1892
|
-
}] }
|
|
1717
|
+
}] }]; }, propDecorators: { id: [{
|
|
1893
1718
|
type: Input
|
|
1894
1719
|
}], focusEscapeFunction: [{
|
|
1895
1720
|
type: Input
|
|
@@ -1909,29 +1734,6 @@ function createMissingDateImplementationError(provider) {
|
|
|
1909
1734
|
}
|
|
1910
1735
|
|
|
1911
1736
|
class CalendarAggregatedYearViewComponent {
|
|
1912
|
-
/**
|
|
1913
|
-
* @hidden
|
|
1914
|
-
* Today cell label.
|
|
1915
|
-
* Is used in conjunction with cell date itself
|
|
1916
|
-
*/
|
|
1917
|
-
get _todayAriaLabel() {
|
|
1918
|
-
return this._calendarI18nLabels.todayLabel;
|
|
1919
|
-
}
|
|
1920
|
-
/**
|
|
1921
|
-
* @hidden
|
|
1922
|
-
* Selected date cell label.
|
|
1923
|
-
* Is used in conjunction with cell date itself
|
|
1924
|
-
*/
|
|
1925
|
-
get _selectedDateAriaLabel() {
|
|
1926
|
-
return this._calendarI18nLabels.dateSelectedLabel;
|
|
1927
|
-
}
|
|
1928
|
-
/**
|
|
1929
|
-
* @hidden
|
|
1930
|
-
* View description
|
|
1931
|
-
*/
|
|
1932
|
-
get _viewRoleDescription() {
|
|
1933
|
-
return this._calendarI18nLabels.calendarYearsRangeViewDescription;
|
|
1934
|
-
}
|
|
1935
1737
|
/**
|
|
1936
1738
|
* View ID
|
|
1937
1739
|
*/
|
|
@@ -1953,13 +1755,12 @@ class CalendarAggregatedYearViewComponent {
|
|
|
1953
1755
|
return this.viewId + '-selected-date-label';
|
|
1954
1756
|
}
|
|
1955
1757
|
/** @hidden */
|
|
1956
|
-
constructor(_eRef, _changeDetectorRef, _calendarService, _dateTimeAdapter, _dateTimeFormats
|
|
1758
|
+
constructor(_eRef, _changeDetectorRef, _calendarService, _dateTimeAdapter, _dateTimeFormats) {
|
|
1957
1759
|
this._eRef = _eRef;
|
|
1958
1760
|
this._changeDetectorRef = _changeDetectorRef;
|
|
1959
1761
|
this._calendarService = _calendarService;
|
|
1960
1762
|
this._dateTimeAdapter = _dateTimeAdapter;
|
|
1961
1763
|
this._dateTimeFormats = _dateTimeFormats;
|
|
1962
|
-
this._calendarI18nLabels = _calendarI18nLabels;
|
|
1963
1764
|
/** Event fired when a year is selected. */
|
|
1964
1765
|
this.yearsClicked = new EventEmitter();
|
|
1965
1766
|
/**
|
|
@@ -2202,17 +2003,17 @@ class CalendarAggregatedYearViewComponent {
|
|
|
2202
2003
|
this._focusElementBySelector(`#${this._getId(index)}`);
|
|
2203
2004
|
}
|
|
2204
2005
|
}
|
|
2205
|
-
CalendarAggregatedYearViewComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: CalendarAggregatedYearViewComponent, deps: [{ token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: CalendarService }, { token: i2.DatetimeAdapter }, { token: DATE_TIME_FORMATS }
|
|
2206
|
-
CalendarAggregatedYearViewComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: CalendarAggregatedYearViewComponent, selector: "fd-calendar-aggregated-year-view", inputs: { id: "id", focusEscapeFunction: "focusEscapeFunction", yearSelected: "yearSelected", aggregatedYearsViewGrid: "aggregatedYearsViewGrid", yearViewGrid: "yearViewGrid" }, outputs: { yearsClicked: "yearsClicked" }, host: { properties: { "attr.id": "viewId" } }, usesOnChanges: true, ngImport: i0, template: "<div class=\"fd-calendar__years\">\n <table
|
|
2006
|
+
CalendarAggregatedYearViewComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: CalendarAggregatedYearViewComponent, deps: [{ token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: CalendarService }, { token: i2$1.DatetimeAdapter }, { token: DATE_TIME_FORMATS }], target: i0.ɵɵFactoryTarget.Component });
|
|
2007
|
+
CalendarAggregatedYearViewComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: CalendarAggregatedYearViewComponent, selector: "fd-calendar-aggregated-year-view", inputs: { id: "id", focusEscapeFunction: "focusEscapeFunction", yearSelected: "yearSelected", aggregatedYearsViewGrid: "aggregatedYearsViewGrid", yearViewGrid: "yearViewGrid" }, outputs: { yearsClicked: "yearsClicked" }, host: { properties: { "attr.id": "viewId" } }, usesOnChanges: true, ngImport: i0, template: "<div class=\"fd-calendar__years\">\n <table\n class=\"fd-calendar__table\"\n role=\"grid\"\n [attr.aria-roledescription]=\"'coreCalendar.calendarYearsRangeViewDescription' | fdTranslate\"\n >\n <tbody class=\"fd-calendar__group\" role=\"rowgroup\">\n <tr class=\"fd-calendar__row\" *ngFor=\"let colYears of _calendarYearListGrid; let rowIndex = index\">\n <td\n class=\"fd-calendar__item\"\n role=\"gridcell\"\n *ngFor=\"let cell of colYears; let colIndex = index\"\n [class.fd-calendar__item--current]=\"cell.current\"\n [class.is-active]=\"cell.selected\"\n [attr.id]=\"cell.id\"\n [attr.tabindex]=\"cell.tabIndex\"\n [attr.data-fd-calendar-years]=\"cell.years.startYear + '-' + cell.years.endYear\"\n (keydown)=\"_onKeydownYearHandler($event, cell.index)\"\n (click)=\"selectYear(cell, $event)\"\n >\n <button\n fd-button\n fdType=\"transparent\"\n class=\"fd-calendar__item-button\"\n [class.is-active]=\"cell.current\"\n tabindex=\"-1\"\n >\n <span\n class=\"fd-calendar__text\"\n [attr.aria-labelledby]=\"\n cell.id +\n '-aria-label ' +\n (cell.current ? _todayLabelId + ' ' : '') +\n (cell.selected ? _selectedDateLabelId : '')\n \"\n >\n {{ cell.label }}\n </span>\n </button>\n\n <span hidden aria-hidden=\"true\" [attr.id]=\"cell.id + '-aria-label'\">\n {{ cell.ariaLabel }}\n </span>\n </td>\n </tr>\n </tbody>\n </table>\n\n <!-- Hidden elements for aria purposes -->\n <div hidden aria-hidden=\"true\">\n <div [attr.id]=\"_todayLabelId\">{{ 'coreCalendar.todayLabel' | fdTranslate }}</div>\n <div [attr.id]=\"_selectedDateLabelId\">{{ 'coreCalendar.dateSelectedLabel' | fdTranslate }}</div>\n </div>\n</div>\n", styles: [""], dependencies: [{ kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: i4.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "pipe", type: i5.FdTranslatePipe, name: "fdTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
2207
2008
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: CalendarAggregatedYearViewComponent, decorators: [{
|
|
2208
2009
|
type: Component,
|
|
2209
2010
|
args: [{ selector: 'fd-calendar-aggregated-year-view', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, host: {
|
|
2210
2011
|
'[attr.id]': 'viewId'
|
|
2211
|
-
}, template: "<div class=\"fd-calendar__years\">\n <table
|
|
2212
|
-
}], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.ChangeDetectorRef }, { type: CalendarService }, { type: i2.DatetimeAdapter }, { type: undefined, decorators: [{
|
|
2012
|
+
}, template: "<div class=\"fd-calendar__years\">\n <table\n class=\"fd-calendar__table\"\n role=\"grid\"\n [attr.aria-roledescription]=\"'coreCalendar.calendarYearsRangeViewDescription' | fdTranslate\"\n >\n <tbody class=\"fd-calendar__group\" role=\"rowgroup\">\n <tr class=\"fd-calendar__row\" *ngFor=\"let colYears of _calendarYearListGrid; let rowIndex = index\">\n <td\n class=\"fd-calendar__item\"\n role=\"gridcell\"\n *ngFor=\"let cell of colYears; let colIndex = index\"\n [class.fd-calendar__item--current]=\"cell.current\"\n [class.is-active]=\"cell.selected\"\n [attr.id]=\"cell.id\"\n [attr.tabindex]=\"cell.tabIndex\"\n [attr.data-fd-calendar-years]=\"cell.years.startYear + '-' + cell.years.endYear\"\n (keydown)=\"_onKeydownYearHandler($event, cell.index)\"\n (click)=\"selectYear(cell, $event)\"\n >\n <button\n fd-button\n fdType=\"transparent\"\n class=\"fd-calendar__item-button\"\n [class.is-active]=\"cell.current\"\n tabindex=\"-1\"\n >\n <span\n class=\"fd-calendar__text\"\n [attr.aria-labelledby]=\"\n cell.id +\n '-aria-label ' +\n (cell.current ? _todayLabelId + ' ' : '') +\n (cell.selected ? _selectedDateLabelId : '')\n \"\n >\n {{ cell.label }}\n </span>\n </button>\n\n <span hidden aria-hidden=\"true\" [attr.id]=\"cell.id + '-aria-label'\">\n {{ cell.ariaLabel }}\n </span>\n </td>\n </tr>\n </tbody>\n </table>\n\n <!-- Hidden elements for aria purposes -->\n <div hidden aria-hidden=\"true\">\n <div [attr.id]=\"_todayLabelId\">{{ 'coreCalendar.todayLabel' | fdTranslate }}</div>\n <div [attr.id]=\"_selectedDateLabelId\">{{ 'coreCalendar.dateSelectedLabel' | fdTranslate }}</div>\n </div>\n</div>\n" }]
|
|
2013
|
+
}], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.ChangeDetectorRef }, { type: CalendarService }, { type: i2$1.DatetimeAdapter }, { type: undefined, decorators: [{
|
|
2213
2014
|
type: Inject,
|
|
2214
2015
|
args: [DATE_TIME_FORMATS]
|
|
2215
|
-
}] }
|
|
2016
|
+
}] }]; }, propDecorators: { id: [{
|
|
2216
2017
|
type: Input
|
|
2217
2018
|
}], focusEscapeFunction: [{
|
|
2218
2019
|
type: Input
|
|
@@ -2226,6 +2027,77 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImpor
|
|
|
2226
2027
|
type: Output
|
|
2227
2028
|
}] } });
|
|
2228
2029
|
|
|
2030
|
+
/**
|
|
2031
|
+
* Provides i18n support for labels inside the calendar component.
|
|
2032
|
+
* @deprecated use i18n `coreCalendar` key instead
|
|
2033
|
+
*/
|
|
2034
|
+
class CalendarI18nLabels {
|
|
2035
|
+
constructor() {
|
|
2036
|
+
/** This is event that should be called, when labels are changed, to let component detect an changes. */
|
|
2037
|
+
this.labelsChange = new Subject();
|
|
2038
|
+
/** Year selection aria label. Used on the button to navigate to the years view. */
|
|
2039
|
+
this.yearSelectionLabel = FD_LANGUAGE_ENGLISH.coreCalendar.yearSelectionLabel;
|
|
2040
|
+
/** Years range selection aria label. Used on the button to navigate to the years range view. */
|
|
2041
|
+
this.yearsRangeSelectionLabel = FD_LANGUAGE_ENGLISH.coreCalendar.yearsRangeSelectionLabel;
|
|
2042
|
+
/** Month selection aria label. Used on the button to navigate to the months view. */
|
|
2043
|
+
this.monthSelectionLabel = FD_LANGUAGE_ENGLISH.coreCalendar.monthSelectionLabel;
|
|
2044
|
+
/** Day selection aria label. Used on the button to navigate to the day view. */
|
|
2045
|
+
this.dateSelectionLabel = FD_LANGUAGE_ENGLISH.coreCalendar.dateSelectionLabel;
|
|
2046
|
+
/** Previous year aria label. Used on the button to switch to a previous year in the years view. */
|
|
2047
|
+
this.previousYearLabel = FD_LANGUAGE_ENGLISH.coreCalendar.previousYearLabel;
|
|
2048
|
+
/** Next year aria label. Used on the button to switch to a next year in the years view. */
|
|
2049
|
+
this.nextYearLabel = FD_LANGUAGE_ENGLISH.coreCalendar.nextYearLabel;
|
|
2050
|
+
/** Previous month aria label. Used on the button to switch to a previous month in the months view. */
|
|
2051
|
+
this.previousMonthLabel = FD_LANGUAGE_ENGLISH.coreCalendar.previousMonthLabel;
|
|
2052
|
+
/** Next month aria label. Used on the button to switch to a next month in the months view. */
|
|
2053
|
+
this.nextMonthLabel = FD_LANGUAGE_ENGLISH.coreCalendar.nextMonthLabel;
|
|
2054
|
+
/** Week number column label */
|
|
2055
|
+
this.weekColumnLabel = FD_LANGUAGE_ENGLISH.coreCalendar.weekColumnLabel;
|
|
2056
|
+
/** Selected date label. Used on the selected day/month/year cell. */
|
|
2057
|
+
this.dateSelectedLabel = FD_LANGUAGE_ENGLISH.coreCalendar.dateSelectedLabel;
|
|
2058
|
+
/** Is used to describe present date */
|
|
2059
|
+
this.todayLabel = FD_LANGUAGE_ENGLISH.coreCalendar.todayLabel;
|
|
2060
|
+
/** Range start label. Used for date range selection */
|
|
2061
|
+
this.rangeStartLabel = FD_LANGUAGE_ENGLISH.coreCalendar.rangeStartLabel;
|
|
2062
|
+
/** Range end label. Used for date range selection */
|
|
2063
|
+
this.rangeEndLabel = FD_LANGUAGE_ENGLISH.coreCalendar.rangeEndLabel;
|
|
2064
|
+
/** Past days aria label. Used when days in the past are accessed */
|
|
2065
|
+
this.dayInPastLabel = FD_LANGUAGE_ENGLISH.coreCalendar.dayInPastLabel;
|
|
2066
|
+
/** Past days aria label. Used when days in the past are accessed */
|
|
2067
|
+
this.closeCalendarLabel = FD_LANGUAGE_ENGLISH.coreCalendar.closeCalendarLabel;
|
|
2068
|
+
/** Calendar day view aria role description. */
|
|
2069
|
+
this.calendarDayViewDescription = FD_LANGUAGE_ENGLISH.coreCalendar.calendarDayViewDescription;
|
|
2070
|
+
/** Calendar month view aria role description. */
|
|
2071
|
+
this.calendarMonthViewDescription = FD_LANGUAGE_ENGLISH.coreCalendar.calendarMonthViewDescription;
|
|
2072
|
+
/** Calendar years view aria role description. */
|
|
2073
|
+
this.calendarYearsViewDescription = FD_LANGUAGE_ENGLISH.coreCalendar.calendarYearsViewDescription;
|
|
2074
|
+
/** Calendar years range view aria role description. */
|
|
2075
|
+
this.calendarYearsRangeViewDescription = FD_LANGUAGE_ENGLISH.coreCalendar.calendarYearsRangeViewDescription;
|
|
2076
|
+
}
|
|
2077
|
+
}
|
|
2078
|
+
|
|
2079
|
+
/**
|
|
2080
|
+
* Use deprecated `CalendarI18nLabels` to patch `FD_LANGUAGE` observable
|
|
2081
|
+
*/
|
|
2082
|
+
function patchDeprecatedI18nLabels() {
|
|
2083
|
+
const deprecatedSymbol = inject(CalendarI18nLabels, { optional: true });
|
|
2084
|
+
if (deprecatedSymbol) {
|
|
2085
|
+
return inject(FD_LANGUAGE, { skipSelf: true }).pipe(switchMap((existingLang) => {
|
|
2086
|
+
if (!deprecatedSymbol.labelsChange) {
|
|
2087
|
+
return of(existingLang);
|
|
2088
|
+
}
|
|
2089
|
+
return deprecatedSymbol.labelsChange.pipe(startWith(null), map(() => existingLang));
|
|
2090
|
+
}), map((existingLang) => ({
|
|
2091
|
+
...existingLang,
|
|
2092
|
+
coreCalendar: {
|
|
2093
|
+
...existingLang.coreCalendar,
|
|
2094
|
+
...deprecatedSymbol
|
|
2095
|
+
}
|
|
2096
|
+
})));
|
|
2097
|
+
}
|
|
2098
|
+
return inject(FD_LANGUAGE, { skipSelf: true });
|
|
2099
|
+
}
|
|
2100
|
+
|
|
2229
2101
|
let calendarUniqueId = 0;
|
|
2230
2102
|
/**
|
|
2231
2103
|
* Months: 1 = January, 12 = december.
|
|
@@ -2697,7 +2569,7 @@ class CalendarComponent {
|
|
|
2697
2569
|
}
|
|
2698
2570
|
}
|
|
2699
2571
|
}
|
|
2700
|
-
CalendarComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: CalendarComponent, deps: [{ token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: i1$1.ContentDensityObserver }, { token: i2.DatetimeAdapter, optional: true }, { token: DATE_TIME_FORMATS, optional: true }], target: i0.ɵɵFactoryTarget.Component });
|
|
2572
|
+
CalendarComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: CalendarComponent, deps: [{ token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: i1$1.ContentDensityObserver }, { token: i2$1.DatetimeAdapter, optional: true }, { token: DATE_TIME_FORMATS, optional: true }], target: i0.ɵɵFactoryTarget.Component });
|
|
2701
2573
|
CalendarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: CalendarComponent, selector: "fd-calendar", inputs: { selectedDate: "selectedDate", markWeekends: "markWeekends", showWeekNumbers: "showWeekNumbers", mobileLandscape: "mobileLandscape", mobilePortrait: "mobilePortrait", selectedRangeDate: "selectedRangeDate", activeView: "activeView", startingDayOfWeek: "startingDayOfWeek", calType: "calType", id: "id", specialDaysRules: "specialDaysRules", yearGrid: "yearGrid", aggregatedYearGrid: "aggregatedYearGrid", rangeHoverEffect: "rangeHoverEffect", previousButtonDisableFunction: "previousButtonDisableFunction", nextButtonDisableFunction: "nextButtonDisableFunction", escapeFocusFunction: "escapeFocusFunction", disableFunction: "disableFunction", disableRangeStartFunction: "disableRangeStartFunction", disableRangeEndFunction: "disableRangeEndFunction" }, outputs: { activeViewChange: "activeViewChange", selectedDateChange: "selectedDateChange", selectedRangeDateChange: "selectedRangeDateChange", isValidDateChange: "isValidDateChange", closeCalendar: "closeCalendar", closeClicked: "closeClicked" }, host: { listeners: { "focusout": "_focusOut($event)" }, properties: { "attr.id": "id", "class.fd-calendar--mobile-landscape": "this.mobileLandscape", "class.fd-calendar--mobile-portrait": "this.mobilePortrait" }, classAttribute: "fd-calendar fd-has-display-block" }, providers: [
|
|
2702
2574
|
{
|
|
2703
2575
|
provide: NG_VALUE_ACCESSOR,
|
|
@@ -2710,8 +2582,12 @@ CalendarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", vers
|
|
|
2710
2582
|
multi: true
|
|
2711
2583
|
},
|
|
2712
2584
|
CalendarService,
|
|
2713
|
-
contentDensityObserverProviders()
|
|
2714
|
-
], viewQueries: [{ propertyName: "_dayViewComponent", first: true, predicate: CalendarDayViewComponent, descendants: true }, { propertyName: "_monthViewComponent", first: true, predicate: CalendarMonthViewComponent, descendants: true }, { propertyName: "_yearViewComponent", first: true, predicate: CalendarYearViewComponent, descendants: true }, { propertyName: "_aggregatedYearViewComponent", first: true, predicate: CalendarAggregatedYearViewComponent, descendants: true }, { propertyName: "_calendarHeaderComponent", first: true, predicate: CalendarHeaderComponent, descendants: true }], usesOnChanges: true, ngImport: i0, template: "<fd-calendar-header\n [currentlyDisplayed]=\"_currentlyDisplayed\"\n [activeView]=\"activeView\"\n [id]=\"id\"\n [calendarYearGrid]=\"yearGrid\"\n [mobileLandscape]=\"mobileLandscape\"\n (closeClicked)=\"closeClicked.emit()\"\n (nextClicked)=\"handleNextArrowClick()\"\n (previousClicked)=\"handlePreviousArrowClick()\"\n [previousButtonDisabled]=\"previousButtonDisabled\"\n [nextButtonDisabled]=\"nextButtonDisabled\"\n (activeViewChange)=\"handleActiveViewChange($event)\"\n></fd-calendar-header>\n<ng-container [ngSwitch]=\"activeView\" *ngIf=\"_currentlyDisplayed\">\n <div\n class=\"fd-calendar__content\"\n [class.fd-calendar__content--dates]=\"activeView === 'day'\"\n [class.fd-calendar__content--months]=\"activeView === 'month'\"\n [class.fd-calendar__content--years]=\"activeView === 'year' || activeView === 'aggregatedYear'\"\n >\n <fd-calendar-day-view\n *ngSwitchCase=\"'day'\"\n [selectedDate]=\"selectedDate\"\n [showWeekNumbers]=\"showWeekNumbers\"\n [markWeekends]=\"markWeekends\"\n (selectedDateChange)=\"selectedDateChanged($event)\"\n [selectedRangeDate]=\"selectedRangeDate\"\n (selectedRangeDateChange)=\"selectedRangeDateChanged($event)\"\n [currentlyDisplayed]=\"_currentlyDisplayed\"\n [startingDayOfWeek]=\"getWeekStartDay()\"\n [disableFunction]=\"disableFunction\"\n [disableRangeEndFunction]=\"disableRangeEndFunction\"\n [disableRangeStartFunction]=\"disableRangeStartFunction\"\n [calType]=\"calType\"\n [id]=\"id\"\n [rangeHoverEffect]=\"rangeHoverEffect\"\n [specialDaysRules]=\"specialDaysRules\"\n [focusEscapeFunction]=\"escapeFocusFunction\"\n (nextMonthSelect)=\"displayNextMonth()\"\n (previousMonthSelect)=\"displayPreviousMonth()\"\n ></fd-calendar-day-view>\n <fd-calendar-month-view\n *ngSwitchCase=\"'month'\"\n [monthSelected]=\"_currentlyDisplayed.month\"\n [year]=\"_currentlyDisplayed.year\"\n [id]=\"id\"\n [focusEscapeFunction]=\"escapeFocusFunction\"\n (monthClicked)=\"handleMonthViewChange($event)\"\n ></fd-calendar-month-view>\n <fd-calendar-year-view\n *ngSwitchCase=\"'year'\"\n [yearSelected]=\"_currentlyDisplayed.year\"\n [yearViewGrid]=\"yearGrid\"\n [id]=\"id\"\n [focusEscapeFunction]=\"escapeFocusFunction\"\n (yearClicked)=\"selectedYear($event)\"\n >\n </fd-calendar-year-view>\n <fd-calendar-aggregated-year-view\n *ngSwitchCase=\"'aggregatedYear'\"\n (yearsClicked)=\"selectedYears($event)\"\n [yearSelected]=\"_currentlyDisplayed.year\"\n [yearViewGrid]=\"yearGrid\"\n [aggregatedYearsViewGrid]=\"aggregatedYearGrid\"\n [id]=\"id\"\n [focusEscapeFunction]=\"escapeFocusFunction\"\n >\n </fd-calendar-aggregated-year-view>\n </div>\n</ng-container>\n", styles: ["/*!\n * Fundamental Library Styles v0.28.3\n * Copyright (c) 2023 SAP SE or an SAP affiliate company.\n * Licensed under Apache License 2.0 (https://github.com/SAP/fundamental-styles/blob/main/LICENSE)\n *//*!\n.fd-calendar+(--compact, --mobile-landscape, --mobile-portrait)\n .fd-calendar__header\n .fd-calendar__navigation(--main-navigation)\n .fd-calendar__action(+[--arrow-left, --arrow-right])\n .fd-calendar__close-button--navigation\n .fd-calendar__content(+[--months, --years])\n .fd-calendar__table\n .fd-calendar__group\n .fd-calendar__row\n .fd-calendar__item(+[--other-month, --current, --side-helper, --weekend, --range],\n +[(.is-disabled | [aria-disabled=true]), (.is-focus | [aria-focus=true]), (.is-active | [aria-active=true])])\n .fd-calendar__special-day(+[--1, --2, ..., --19, --20])\n .fd-calendar__text\n*/:root{--fdCalendar_Padding:1rem;--fdCalendar_Item_Width:2.125rem;--fdCalendar_Item_Height:2.75rem;--fdCalendar_Action_Padding:.5rem;--fdCalendar_Item_Spacing:.0625rem;--fdCalendar_Button_Horizontal_Space:.25rem;--fdCalendar_Width:20rem;--fdCalendar_Item_Inner_Border_Size:calc(100% - .125rem);--fdCalendar_Action_Width:auto}.fd-calendar .fd-calendar__item{-webkit-box-sizing:border-box;-webkit-box-flex:1;-ms-flex:1 1 .375rem;background-color:var(--sapLegend_WorkingBackground);border:0;border-radius:var(--fdCalendar_Border_Radius);box-sizing:border-box;color:var(--sapTextColor);cursor:pointer;flex:1 1 .375rem;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;height:var(--fdCalendar_Item_Height);line-height:var(--sapContent_LineHeight);margin:.0625rem;min-width:var(--fdCalendar_Item_Width);overflow:hidden;padding:0;position:relative}.fd-calendar .fd-calendar__item:after,.fd-calendar .fd-calendar__item:before{box-sizing:inherit;font-size:inherit}.fd-calendar .fd-calendar__item:hover,.fd-calendar .is-hover.fd-calendar__item{background-color:var(--sapList_Hover_Background)}.fd-calendar__content--dates .fd-calendar__item--side-helper{align-self:center;background-color:var(--sapList_Background);height:var(--fdCalendar_Item_Side_Helper, 1.875rem);pointer-events:none}.fd-calendar__content--dates .fd-calendar__item--other-month{background-color:var(--sapList_Background)}.fd-calendar__content--dates .fd-calendar__item--other-month:hover,.fd-calendar__content--dates .is-hover.fd-calendar__item--other-month{background-color:var(--sapList_Hover_Background)}.fd-calendar__content--dates .fd-calendar__item--weekend{background-color:var(--sapLegend_NonWorkingBackground)}.fd-calendar__content--dates .fd-calendar__item--weekend:hover,.fd-calendar__content--dates .is-hover.fd-calendar__item--weekend{background-color:var(--sapList_Hover_Background)}.fd-calendar .fd-calendar__item--current,.fd-calendar__content--dates .fd-calendar__item--range.fd-calendar__item--current{border:solid var(--sapLegend_CurrentDateTime)!important}.fd-calendar .fd-calendar__item--current:active:after,.fd-calendar .is-active.fd-calendar__item--current:after,.fd-calendar__content--dates .fd-calendar__item--range.fd-calendar__item--current:active:after,.fd-calendar__content--dates .is-active.fd-calendar__item--range.fd-calendar__item--current:after{border:var(--fdCalendar_Active_Item_Border);border-radius:calc(var(--fdCalendar_Border_Radius) / 2);bottom:.0625rem;content:\" \";height:var(--fdCalendar_Item_Inner_Border_Size);left:.0625rem;position:absolute;right:auto;width:var(--fdCalendar_Item_Inner_Border_Size)}.fd-calendar .fd-calendar__item--current:active:after[dir=rtl],.fd-calendar .is-active.fd-calendar__item--current:after[dir=rtl],.fd-calendar [dir=rtl] .fd-calendar__item--current:active:after,.fd-calendar [dir=rtl] .is-active.fd-calendar__item--current:after,.fd-calendar__content--dates .fd-calendar__item--range.fd-calendar__item--current:active:after[dir=rtl],.fd-calendar__content--dates .is-active.fd-calendar__item--range.fd-calendar__item--current:after[dir=rtl],.fd-calendar__content--dates [dir=rtl] .fd-calendar__item--range.fd-calendar__item--current:active:after,.fd-calendar__content--dates [dir=rtl] .is-active.fd-calendar__item--range.fd-calendar__item--current:after,[dir=rtl] .fd-calendar .fd-calendar__item--current:active:after,[dir=rtl] .fd-calendar .is-active.fd-calendar__item--current:after,[dir=rtl] .fd-calendar__content--dates .fd-calendar__item--range.fd-calendar__item--current:active:after,[dir=rtl] .fd-calendar__content--dates .is-active.fd-calendar__item--range.fd-calendar__item--current:after{left:auto;right:.0625rem}.fd-calendar__content--dates .fd-calendar__item.is-active,.fd-calendar__content--dates .fd-calendar__item:active{background-color:var(--sapContent_Selected_Background);border:var(--fdCalendar_Active_Item_Border);font-weight:var(--fdCalendar_Active_Item_Font_Weight)}.fd-calendar__content--dates .fd-calendar__item.is-active:hover,.fd-calendar__content--dates .fd-calendar__item:hover:active,.fd-calendar__content--dates .is-hover.fd-calendar__item.is-active,.fd-calendar__content--dates .is-hover.fd-calendar__item:active{background-color:var(--fdCalendar_Item_Active_Background_Hover)}.fd-calendar__content--dates .fd-calendar__item.is-active:focus,.fd-calendar__content--dates .fd-calendar__item:focus:active,.fd-calendar__content--dates .is-focus.fd-calendar__item.is-active,.fd-calendar__content--dates .is-focus.fd-calendar__item:active{box-shadow:none;outline-color:var(--fdCalendar_Active_Focus_Item_Outline_Color);z-index:5}.fd-calendar__content--dates .fd-calendar__item--range{background-color:var(--sapList_SelectionBackgroundColor);border:.0625rem solid var(--sapList_SelectionBorderColor)}.fd-calendar__content--dates .fd-calendar__item--range:hover,.fd-calendar__content--dates .is-hover.fd-calendar__item--range{background-color:var(--sapList_Hover_SelectionBackground)}.fd-calendar__content--dates .fd-calendar__item.is-disabled,.fd-calendar__content--dates .fd-calendar__item:disabled,.fd-calendar__content--dates .fd-calendar__item[aria-disabled=true]{opacity:.4;pointer-events:none}.fd-calendar__content--dates .fd-calendar__item.is-disabled:hover,.fd-calendar__content--dates .fd-calendar__item:hover:disabled,.fd-calendar__content--dates .fd-calendar__item[aria-disabled=true]:hover{cursor:not-allowed}.fd-calendar__content--dates .fd-calendar__item.is-focus,.fd-calendar__content--dates .fd-calendar__item:focus{box-shadow:none;outline:var(--sapContent_FocusColor) var(--sapContent_FocusStyle) var(--sapContent_FocusWidth);outline-offset:-.1875rem}.fd-calendar__text{-webkit-box-sizing:border-box;-webkit-box-pack:center;-ms-flex-pack:center;align-items:center;border:0;box-sizing:border-box;color:var(--sapTextColor);display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;height:100%;justify-content:center;line-height:var(--sapContent_LineHeight);margin:0;padding:0;text-shadow:var(--fdCalendar_Text_Shadow)}.fd-calendar__text:after,.fd-calendar__text:before{box-sizing:inherit;font-size:inherit}.fd-calendar{-webkit-box-sizing:border-box;background-color:var(--sapList_Background);border:0;border-radius:var(--fdCalendar_Border_Radius);box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:var(--sapContent_LineHeight);margin:0;padding:0;padding:var(--fdCalendar_Padding);width:var(--fdCalendar_Width)}.fd-calendar:after,.fd-calendar:before{box-sizing:inherit;font-size:inherit}.fd-calendar__header{-webkit-box-sizing:border-box;border:0;box-sizing:border-box;color:var(--sapTextColor);display:flex;flex-direction:column;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:var(--sapContent_LineHeight);margin:0;padding:0;position:relative}.fd-calendar__header:after,.fd-calendar__header:before{box-sizing:inherit;font-size:inherit}.fd-calendar__navigation{-webkit-box-sizing:border-box;-webkit-box-pack:center;-ms-flex-pack:center;border:0;box-sizing:border-box;color:var(--sapTextColor);display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;justify-content:center;line-height:var(--sapContent_LineHeight);margin:0;padding:0;padding-bottom:var(--fdCalendar_Button_Horizontal_Space);padding-top:var(--fdCalendar_Button_Horizontal_Space);width:100%}.fd-calendar__navigation:after,.fd-calendar__navigation:before{box-sizing:inherit;font-size:inherit}.fd-calendar__action{-webkit-box-sizing:border-box;-webkit-box-flex:1;-ms-flex-positive:1;border:0;box-sizing:border-box;color:var(--sapTextColor);flex-grow:1;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:var(--sapContent_LineHeight);margin:0;padding:0}.fd-calendar__action:after,.fd-calendar__action:before{box-sizing:inherit;font-size:inherit}.fd-calendar__action:not(:last-child):not(:first-child){margin-left:.25rem;margin-right:.25rem}.fd-calendar__action:first-child{margin-right:.25rem}.fd-calendar__action:last-child{margin-left:.25rem}.fd-calendar__action>[type=button]{width:100%}.fd-calendar__action--arrow-left,.fd-calendar__action--arrow-right{flex-grow:0;width:var(--fdCalendar_Action_Width)}.fd-calendar__action--arrow-left+.fd-calendar__action--arrow-right{margin-left:auto}.fd-calendar__action--arrow-left+.fd-calendar__action--arrow-right[dir=rtl],[dir=rtl] .fd-calendar__action--arrow-left+.fd-calendar__action--arrow-right{margin-left:0;margin-right:auto}.fd-calendar__action [class*=sap-icon][dir=rtl],[dir=rtl] .fd-calendar__action [class*=sap-icon]{transform:scaleX(-1)}.fd-calendar__content{-webkit-box-sizing:border-box;border:0;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:var(--sapContent_LineHeight);margin:0;padding:0}.fd-calendar__content:after,.fd-calendar__content:before{box-sizing:inherit;font-size:inherit}.fd-calendar__content--months,.fd-calendar__content--years{padding-top:1.875rem}.fd-calendar__content--months .fd-calendar__item,.fd-calendar__content--years .fd-calendar__item{background-color:transparent;max-height:var(--fdCalendar_Item_Height)}.fd-calendar__content--months .fd-calendar__item-button,.fd-calendar__content--years .fd-calendar__item-button{min-height:100%;min-width:100%;padding:0}.fd-calendar__content--months .fd-calendar__item--current .fd-calendar__item-button,.fd-calendar__content--years .fd-calendar__item--current .fd-calendar__item-button{-webkit-box-shadow:none;border:none;border-radius:var(--fdCalendar_Month_Year_Item_Border_Radius);box-shadow:none}.fd-calendar__content--months .fd-calendar__item .fd-calendar__text,.fd-calendar__content--years .fd-calendar__item .fd-calendar__text{color:inherit}.fd-calendar__content--dates .fd-calendar__item.is-focus,.fd-calendar__content--dates .fd-calendar__item:focus{z-index:5}.fd-calendar__content--dates .fd-calendar__item.is-active .fd-calendar__text,.fd-calendar__content--dates .fd-calendar__item:active .fd-calendar__text{color:var(--sapContent_Selected_TextColor)}.fd-calendar__content--dates .fd-calendar__item--side-helper .fd-calendar__text{color:var(--sapContent_LabelColor);font-size:var(--sapFontSmallSize)}.fd-calendar__content--dates .fd-calendar__item--other-month .fd-calendar__text{color:var(--sapContent_LabelColor)}.fd-calendar__content--screen-reader-only{clip:rect(0 0 0 0);border:0;height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}.fd-calendar__table{-webkit-box-sizing:border-box;border:0;border-spacing:0;box-sizing:border-box;color:var(--sapTextColor);display:table;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:var(--sapContent_LineHeight);margin:0;padding:0;width:100%}.fd-calendar__table:after,.fd-calendar__table:before{box-sizing:inherit;font-size:inherit}.fd-calendar__group{-webkit-box-sizing:border-box;border:0;box-sizing:border-box;color:var(--sapTextColor);display:table-row-group;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:var(--sapContent_LineHeight);margin:0;padding:0}.fd-calendar__group:after,.fd-calendar__group:before{box-sizing:inherit;font-size:inherit}.fd-calendar__row{-webkit-box-sizing:border-box;border:0;box-sizing:border-box;color:var(--sapTextColor);display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:var(--sapContent_LineHeight);margin:0;padding:0}.fd-calendar__row:after,.fd-calendar__row:before{box-sizing:inherit;font-size:inherit}.fd-calendar .fd-calendar__item{display:inline-block}.fd-calendar .fd-calendar__item--current .fd-calendar__text:before{border:var(--fdCalendar_Item_Current_Border);border-radius:calc(var(--sapElement_BorderCornerRadius) / 2);content:\"\";inset:0;position:absolute;z-index:1}.fd-calendar__special-day--1 .fd-calendar__text:after{-webkit-box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor1);bottom:0;box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor1);content:\"\";height:var(--fdCalendar_Special_Day_Marker_Height);left:0;position:absolute;right:0}.fd-calendar__special-day--1.is-active .fd-calendar__text:after,.fd-calendar__special-day--1:active .fd-calendar__text:after{box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor1),inset 0 -.33rem 0 var(--fdCalendar_Item_Current_Inner_Border_Color);height:calc(var(--fdCalendar_Special_Day_Marker_Height) + .0625rem)}.fd-calendar__special-day--1.fd-calendar__item--current.is-active .fd-calendar__text:after,.fd-calendar__special-day--1.fd-calendar__item--current:active .fd-calendar__text:after{bottom:var(--fdCalendar_Item_Current_Active_Special_Day_Bottom);height:var(--fdCalendar_Item_Current_Active_Special_Day_Height);left:var(--fdCalendar_Item_Current_Active_Special_Day_Left);right:var(--fdCalendar_Item_Current_Active_Special_Day_Right);width:var(--fdCalendar_Item_Current_Active_Special_Day_Width)}.fd-calendar__special-day--2 .fd-calendar__text:after{-webkit-box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor2);bottom:0;box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor2);content:\"\";height:var(--fdCalendar_Special_Day_Marker_Height);left:0;position:absolute;right:0}.fd-calendar__special-day--2.is-active .fd-calendar__text:after,.fd-calendar__special-day--2:active .fd-calendar__text:after{box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor2),inset 0 -.33rem 0 var(--fdCalendar_Item_Current_Inner_Border_Color);height:calc(var(--fdCalendar_Special_Day_Marker_Height) + .0625rem)}.fd-calendar__special-day--2.fd-calendar__item--current.is-active .fd-calendar__text:after,.fd-calendar__special-day--2.fd-calendar__item--current:active .fd-calendar__text:after{bottom:var(--fdCalendar_Item_Current_Active_Special_Day_Bottom);height:var(--fdCalendar_Item_Current_Active_Special_Day_Height);left:var(--fdCalendar_Item_Current_Active_Special_Day_Left);right:var(--fdCalendar_Item_Current_Active_Special_Day_Right);width:var(--fdCalendar_Item_Current_Active_Special_Day_Width)}.fd-calendar__special-day--3 .fd-calendar__text:after{-webkit-box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor3);bottom:0;box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor3);content:\"\";height:var(--fdCalendar_Special_Day_Marker_Height);left:0;position:absolute;right:0}.fd-calendar__special-day--3.is-active .fd-calendar__text:after,.fd-calendar__special-day--3:active .fd-calendar__text:after{box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor3),inset 0 -.33rem 0 var(--fdCalendar_Item_Current_Inner_Border_Color);height:calc(var(--fdCalendar_Special_Day_Marker_Height) + .0625rem)}.fd-calendar__special-day--3.fd-calendar__item--current.is-active .fd-calendar__text:after,.fd-calendar__special-day--3.fd-calendar__item--current:active .fd-calendar__text:after{bottom:var(--fdCalendar_Item_Current_Active_Special_Day_Bottom);height:var(--fdCalendar_Item_Current_Active_Special_Day_Height);left:var(--fdCalendar_Item_Current_Active_Special_Day_Left);right:var(--fdCalendar_Item_Current_Active_Special_Day_Right);width:var(--fdCalendar_Item_Current_Active_Special_Day_Width)}.fd-calendar__special-day--4 .fd-calendar__text:after{-webkit-box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor4);bottom:0;box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor4);content:\"\";height:var(--fdCalendar_Special_Day_Marker_Height);left:0;position:absolute;right:0}.fd-calendar__special-day--4.is-active .fd-calendar__text:after,.fd-calendar__special-day--4:active .fd-calendar__text:after{box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor4),inset 0 -.33rem 0 var(--fdCalendar_Item_Current_Inner_Border_Color);height:calc(var(--fdCalendar_Special_Day_Marker_Height) + .0625rem)}.fd-calendar__special-day--4.fd-calendar__item--current.is-active .fd-calendar__text:after,.fd-calendar__special-day--4.fd-calendar__item--current:active .fd-calendar__text:after{bottom:var(--fdCalendar_Item_Current_Active_Special_Day_Bottom);height:var(--fdCalendar_Item_Current_Active_Special_Day_Height);left:var(--fdCalendar_Item_Current_Active_Special_Day_Left);right:var(--fdCalendar_Item_Current_Active_Special_Day_Right);width:var(--fdCalendar_Item_Current_Active_Special_Day_Width)}.fd-calendar__special-day--5 .fd-calendar__text:after{-webkit-box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor5);bottom:0;box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor5);content:\"\";height:var(--fdCalendar_Special_Day_Marker_Height);left:0;position:absolute;right:0}.fd-calendar__special-day--5.is-active .fd-calendar__text:after,.fd-calendar__special-day--5:active .fd-calendar__text:after{box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor5),inset 0 -.33rem 0 var(--fdCalendar_Item_Current_Inner_Border_Color);height:calc(var(--fdCalendar_Special_Day_Marker_Height) + .0625rem)}.fd-calendar__special-day--5.fd-calendar__item--current.is-active .fd-calendar__text:after,.fd-calendar__special-day--5.fd-calendar__item--current:active .fd-calendar__text:after{bottom:var(--fdCalendar_Item_Current_Active_Special_Day_Bottom);height:var(--fdCalendar_Item_Current_Active_Special_Day_Height);left:var(--fdCalendar_Item_Current_Active_Special_Day_Left);right:var(--fdCalendar_Item_Current_Active_Special_Day_Right);width:var(--fdCalendar_Item_Current_Active_Special_Day_Width)}.fd-calendar__special-day--6 .fd-calendar__text:after{-webkit-box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor6);bottom:0;box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor6);content:\"\";height:var(--fdCalendar_Special_Day_Marker_Height);left:0;position:absolute;right:0}.fd-calendar__special-day--6.is-active .fd-calendar__text:after,.fd-calendar__special-day--6:active .fd-calendar__text:after{box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor6),inset 0 -.33rem 0 var(--fdCalendar_Item_Current_Inner_Border_Color);height:calc(var(--fdCalendar_Special_Day_Marker_Height) + .0625rem)}.fd-calendar__special-day--6.fd-calendar__item--current.is-active .fd-calendar__text:after,.fd-calendar__special-day--6.fd-calendar__item--current:active .fd-calendar__text:after{bottom:var(--fdCalendar_Item_Current_Active_Special_Day_Bottom);height:var(--fdCalendar_Item_Current_Active_Special_Day_Height);left:var(--fdCalendar_Item_Current_Active_Special_Day_Left);right:var(--fdCalendar_Item_Current_Active_Special_Day_Right);width:var(--fdCalendar_Item_Current_Active_Special_Day_Width)}.fd-calendar__special-day--7 .fd-calendar__text:after{-webkit-box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor7);bottom:0;box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor7);content:\"\";height:var(--fdCalendar_Special_Day_Marker_Height);left:0;position:absolute;right:0}.fd-calendar__special-day--7.is-active .fd-calendar__text:after,.fd-calendar__special-day--7:active .fd-calendar__text:after{box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor7),inset 0 -.33rem 0 var(--fdCalendar_Item_Current_Inner_Border_Color);height:calc(var(--fdCalendar_Special_Day_Marker_Height) + .0625rem)}.fd-calendar__special-day--7.fd-calendar__item--current.is-active .fd-calendar__text:after,.fd-calendar__special-day--7.fd-calendar__item--current:active .fd-calendar__text:after{bottom:var(--fdCalendar_Item_Current_Active_Special_Day_Bottom);height:var(--fdCalendar_Item_Current_Active_Special_Day_Height);left:var(--fdCalendar_Item_Current_Active_Special_Day_Left);right:var(--fdCalendar_Item_Current_Active_Special_Day_Right);width:var(--fdCalendar_Item_Current_Active_Special_Day_Width)}.fd-calendar__special-day--8 .fd-calendar__text:after{-webkit-box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor8);bottom:0;box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor8);content:\"\";height:var(--fdCalendar_Special_Day_Marker_Height);left:0;position:absolute;right:0}.fd-calendar__special-day--8.is-active .fd-calendar__text:after,.fd-calendar__special-day--8:active .fd-calendar__text:after{box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor8),inset 0 -.33rem 0 var(--fdCalendar_Item_Current_Inner_Border_Color);height:calc(var(--fdCalendar_Special_Day_Marker_Height) + .0625rem)}.fd-calendar__special-day--8.fd-calendar__item--current.is-active .fd-calendar__text:after,.fd-calendar__special-day--8.fd-calendar__item--current:active .fd-calendar__text:after{bottom:var(--fdCalendar_Item_Current_Active_Special_Day_Bottom);height:var(--fdCalendar_Item_Current_Active_Special_Day_Height);left:var(--fdCalendar_Item_Current_Active_Special_Day_Left);right:var(--fdCalendar_Item_Current_Active_Special_Day_Right);width:var(--fdCalendar_Item_Current_Active_Special_Day_Width)}.fd-calendar__special-day--9 .fd-calendar__text:after{-webkit-box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor9);bottom:0;box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor9);content:\"\";height:var(--fdCalendar_Special_Day_Marker_Height);left:0;position:absolute;right:0}.fd-calendar__special-day--9.is-active .fd-calendar__text:after,.fd-calendar__special-day--9:active .fd-calendar__text:after{box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor9),inset 0 -.33rem 0 var(--fdCalendar_Item_Current_Inner_Border_Color);height:calc(var(--fdCalendar_Special_Day_Marker_Height) + .0625rem)}.fd-calendar__special-day--9.fd-calendar__item--current.is-active .fd-calendar__text:after,.fd-calendar__special-day--9.fd-calendar__item--current:active .fd-calendar__text:after{bottom:var(--fdCalendar_Item_Current_Active_Special_Day_Bottom);height:var(--fdCalendar_Item_Current_Active_Special_Day_Height);left:var(--fdCalendar_Item_Current_Active_Special_Day_Left);right:var(--fdCalendar_Item_Current_Active_Special_Day_Right);width:var(--fdCalendar_Item_Current_Active_Special_Day_Width)}.fd-calendar__special-day--10 .fd-calendar__text:after{-webkit-box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor10);bottom:0;box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor10);content:\"\";height:var(--fdCalendar_Special_Day_Marker_Height);left:0;position:absolute;right:0}.fd-calendar__special-day--10.is-active .fd-calendar__text:after,.fd-calendar__special-day--10:active .fd-calendar__text:after{box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor10),inset 0 -.33rem 0 var(--fdCalendar_Item_Current_Inner_Border_Color);height:calc(var(--fdCalendar_Special_Day_Marker_Height) + .0625rem)}.fd-calendar__special-day--10.fd-calendar__item--current.is-active .fd-calendar__text:after,.fd-calendar__special-day--10.fd-calendar__item--current:active .fd-calendar__text:after{bottom:var(--fdCalendar_Item_Current_Active_Special_Day_Bottom);height:var(--fdCalendar_Item_Current_Active_Special_Day_Height);left:var(--fdCalendar_Item_Current_Active_Special_Day_Left);right:var(--fdCalendar_Item_Current_Active_Special_Day_Right);width:var(--fdCalendar_Item_Current_Active_Special_Day_Width)}.fd-calendar__special-day--11 .fd-calendar__text:after{-webkit-box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor11);bottom:0;box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor11);content:\"\";height:var(--fdCalendar_Special_Day_Marker_Height);left:0;position:absolute;right:0}.fd-calendar__special-day--11.is-active .fd-calendar__text:after,.fd-calendar__special-day--11:active .fd-calendar__text:after{box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor11),inset 0 -.33rem 0 var(--fdCalendar_Item_Current_Inner_Border_Color);height:calc(var(--fdCalendar_Special_Day_Marker_Height) + .0625rem)}.fd-calendar__special-day--11.fd-calendar__item--current.is-active .fd-calendar__text:after,.fd-calendar__special-day--11.fd-calendar__item--current:active .fd-calendar__text:after{bottom:var(--fdCalendar_Item_Current_Active_Special_Day_Bottom);height:var(--fdCalendar_Item_Current_Active_Special_Day_Height);left:var(--fdCalendar_Item_Current_Active_Special_Day_Left);right:var(--fdCalendar_Item_Current_Active_Special_Day_Right);width:var(--fdCalendar_Item_Current_Active_Special_Day_Width)}.fd-calendar__special-day--12 .fd-calendar__text:after{-webkit-box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor12);bottom:0;box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor12);content:\"\";height:var(--fdCalendar_Special_Day_Marker_Height);left:0;position:absolute;right:0}.fd-calendar__special-day--12.is-active .fd-calendar__text:after,.fd-calendar__special-day--12:active .fd-calendar__text:after{box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor12),inset 0 -.33rem 0 var(--fdCalendar_Item_Current_Inner_Border_Color);height:calc(var(--fdCalendar_Special_Day_Marker_Height) + .0625rem)}.fd-calendar__special-day--12.fd-calendar__item--current.is-active .fd-calendar__text:after,.fd-calendar__special-day--12.fd-calendar__item--current:active .fd-calendar__text:after{bottom:var(--fdCalendar_Item_Current_Active_Special_Day_Bottom);height:var(--fdCalendar_Item_Current_Active_Special_Day_Height);left:var(--fdCalendar_Item_Current_Active_Special_Day_Left);right:var(--fdCalendar_Item_Current_Active_Special_Day_Right);width:var(--fdCalendar_Item_Current_Active_Special_Day_Width)}.fd-calendar__special-day--13 .fd-calendar__text:after{-webkit-box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor13);bottom:0;box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor13);content:\"\";height:var(--fdCalendar_Special_Day_Marker_Height);left:0;position:absolute;right:0}.fd-calendar__special-day--13.is-active .fd-calendar__text:after,.fd-calendar__special-day--13:active .fd-calendar__text:after{box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor13),inset 0 -.33rem 0 var(--fdCalendar_Item_Current_Inner_Border_Color);height:calc(var(--fdCalendar_Special_Day_Marker_Height) + .0625rem)}.fd-calendar__special-day--13.fd-calendar__item--current.is-active .fd-calendar__text:after,.fd-calendar__special-day--13.fd-calendar__item--current:active .fd-calendar__text:after{bottom:var(--fdCalendar_Item_Current_Active_Special_Day_Bottom);height:var(--fdCalendar_Item_Current_Active_Special_Day_Height);left:var(--fdCalendar_Item_Current_Active_Special_Day_Left);right:var(--fdCalendar_Item_Current_Active_Special_Day_Right);width:var(--fdCalendar_Item_Current_Active_Special_Day_Width)}.fd-calendar__special-day--14 .fd-calendar__text:after{-webkit-box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor14);bottom:0;box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor14);content:\"\";height:var(--fdCalendar_Special_Day_Marker_Height);left:0;position:absolute;right:0}.fd-calendar__special-day--14.is-active .fd-calendar__text:after,.fd-calendar__special-day--14:active .fd-calendar__text:after{box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor14),inset 0 -.33rem 0 var(--fdCalendar_Item_Current_Inner_Border_Color);height:calc(var(--fdCalendar_Special_Day_Marker_Height) + .0625rem)}.fd-calendar__special-day--14.fd-calendar__item--current.is-active .fd-calendar__text:after,.fd-calendar__special-day--14.fd-calendar__item--current:active .fd-calendar__text:after{bottom:var(--fdCalendar_Item_Current_Active_Special_Day_Bottom);height:var(--fdCalendar_Item_Current_Active_Special_Day_Height);left:var(--fdCalendar_Item_Current_Active_Special_Day_Left);right:var(--fdCalendar_Item_Current_Active_Special_Day_Right);width:var(--fdCalendar_Item_Current_Active_Special_Day_Width)}.fd-calendar__special-day--15 .fd-calendar__text:after{-webkit-box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor15);bottom:0;box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor15);content:\"\";height:var(--fdCalendar_Special_Day_Marker_Height);left:0;position:absolute;right:0}.fd-calendar__special-day--15.is-active .fd-calendar__text:after,.fd-calendar__special-day--15:active .fd-calendar__text:after{box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor15),inset 0 -.33rem 0 var(--fdCalendar_Item_Current_Inner_Border_Color);height:calc(var(--fdCalendar_Special_Day_Marker_Height) + .0625rem)}.fd-calendar__special-day--15.fd-calendar__item--current.is-active .fd-calendar__text:after,.fd-calendar__special-day--15.fd-calendar__item--current:active .fd-calendar__text:after{bottom:var(--fdCalendar_Item_Current_Active_Special_Day_Bottom);height:var(--fdCalendar_Item_Current_Active_Special_Day_Height);left:var(--fdCalendar_Item_Current_Active_Special_Day_Left);right:var(--fdCalendar_Item_Current_Active_Special_Day_Right);width:var(--fdCalendar_Item_Current_Active_Special_Day_Width)}.fd-calendar__special-day--16 .fd-calendar__text:after{-webkit-box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor16);bottom:0;box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor16);content:\"\";height:var(--fdCalendar_Special_Day_Marker_Height);left:0;position:absolute;right:0}.fd-calendar__special-day--16.is-active .fd-calendar__text:after,.fd-calendar__special-day--16:active .fd-calendar__text:after{box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor16),inset 0 -.33rem 0 var(--fdCalendar_Item_Current_Inner_Border_Color);height:calc(var(--fdCalendar_Special_Day_Marker_Height) + .0625rem)}.fd-calendar__special-day--16.fd-calendar__item--current.is-active .fd-calendar__text:after,.fd-calendar__special-day--16.fd-calendar__item--current:active .fd-calendar__text:after{bottom:var(--fdCalendar_Item_Current_Active_Special_Day_Bottom);height:var(--fdCalendar_Item_Current_Active_Special_Day_Height);left:var(--fdCalendar_Item_Current_Active_Special_Day_Left);right:var(--fdCalendar_Item_Current_Active_Special_Day_Right);width:var(--fdCalendar_Item_Current_Active_Special_Day_Width)}.fd-calendar__special-day--17 .fd-calendar__text:after{-webkit-box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor17);bottom:0;box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor17);content:\"\";height:var(--fdCalendar_Special_Day_Marker_Height);left:0;position:absolute;right:0}.fd-calendar__special-day--17.is-active .fd-calendar__text:after,.fd-calendar__special-day--17:active .fd-calendar__text:after{box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor17),inset 0 -.33rem 0 var(--fdCalendar_Item_Current_Inner_Border_Color);height:calc(var(--fdCalendar_Special_Day_Marker_Height) + .0625rem)}.fd-calendar__special-day--17.fd-calendar__item--current.is-active .fd-calendar__text:after,.fd-calendar__special-day--17.fd-calendar__item--current:active .fd-calendar__text:after{bottom:var(--fdCalendar_Item_Current_Active_Special_Day_Bottom);height:var(--fdCalendar_Item_Current_Active_Special_Day_Height);left:var(--fdCalendar_Item_Current_Active_Special_Day_Left);right:var(--fdCalendar_Item_Current_Active_Special_Day_Right);width:var(--fdCalendar_Item_Current_Active_Special_Day_Width)}.fd-calendar__special-day--18 .fd-calendar__text:after{-webkit-box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor18);bottom:0;box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor18);content:\"\";height:var(--fdCalendar_Special_Day_Marker_Height);left:0;position:absolute;right:0}.fd-calendar__special-day--18.is-active .fd-calendar__text:after,.fd-calendar__special-day--18:active .fd-calendar__text:after{box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor18),inset 0 -.33rem 0 var(--fdCalendar_Item_Current_Inner_Border_Color);height:calc(var(--fdCalendar_Special_Day_Marker_Height) + .0625rem)}.fd-calendar__special-day--18.fd-calendar__item--current.is-active .fd-calendar__text:after,.fd-calendar__special-day--18.fd-calendar__item--current:active .fd-calendar__text:after{bottom:var(--fdCalendar_Item_Current_Active_Special_Day_Bottom);height:var(--fdCalendar_Item_Current_Active_Special_Day_Height);left:var(--fdCalendar_Item_Current_Active_Special_Day_Left);right:var(--fdCalendar_Item_Current_Active_Special_Day_Right);width:var(--fdCalendar_Item_Current_Active_Special_Day_Width)}.fd-calendar__special-day--19 .fd-calendar__text:after{-webkit-box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor19);bottom:0;box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor19);content:\"\";height:var(--fdCalendar_Special_Day_Marker_Height);left:0;position:absolute;right:0}.fd-calendar__special-day--19.is-active .fd-calendar__text:after,.fd-calendar__special-day--19:active .fd-calendar__text:after{box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor19),inset 0 -.33rem 0 var(--fdCalendar_Item_Current_Inner_Border_Color);height:calc(var(--fdCalendar_Special_Day_Marker_Height) + .0625rem)}.fd-calendar__special-day--19.fd-calendar__item--current.is-active .fd-calendar__text:after,.fd-calendar__special-day--19.fd-calendar__item--current:active .fd-calendar__text:after{bottom:var(--fdCalendar_Item_Current_Active_Special_Day_Bottom);height:var(--fdCalendar_Item_Current_Active_Special_Day_Height);left:var(--fdCalendar_Item_Current_Active_Special_Day_Left);right:var(--fdCalendar_Item_Current_Active_Special_Day_Right);width:var(--fdCalendar_Item_Current_Active_Special_Day_Width)}.fd-calendar__special-day--20 .fd-calendar__text:after{-webkit-box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor20);bottom:0;box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor20);content:\"\";height:var(--fdCalendar_Special_Day_Marker_Height);left:0;position:absolute;right:0}.fd-calendar__special-day--20.is-active .fd-calendar__text:after,.fd-calendar__special-day--20:active .fd-calendar__text:after{box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor20),inset 0 -.33rem 0 var(--fdCalendar_Item_Current_Inner_Border_Color);height:calc(var(--fdCalendar_Special_Day_Marker_Height) + .0625rem)}.fd-calendar__special-day--20.fd-calendar__item--current.is-active .fd-calendar__text:after,.fd-calendar__special-day--20.fd-calendar__item--current:active .fd-calendar__text:after{bottom:var(--fdCalendar_Item_Current_Active_Special_Day_Bottom);height:var(--fdCalendar_Item_Current_Active_Special_Day_Height);left:var(--fdCalendar_Item_Current_Active_Special_Day_Left);right:var(--fdCalendar_Item_Current_Active_Special_Day_Right);width:var(--fdCalendar_Item_Current_Active_Special_Day_Width)}.fd-calendar .fd-calendar__close-button--navigation{-webkit-transform:translateY(-50%);position:absolute;right:0;top:50%;transform:translateY(-50%)}.fd-calendar .fd-calendar__close-button--navigation[dir=rtl],[dir=rtl] .fd-calendar .fd-calendar__close-button--navigation{left:0;right:auto}.fd-calendar[class*=-compact],.fd-calendar[class*=-condensed],[class*=-compact] .fd-calendar:not([class*=-cozy]),[class*=-condensed] .fd-calendar:not([class*=-cozy]){--fdCalendar_Width:17rem;--fdCalendar_Padding:.5rem;--fdCalendar_Item_Height:1.875rem;--fdCalendar_Button_Horizontal_Space:.1875rem;--fdCalendar_Action_Width:1.875rem;--fdCalendar_Item_Width:1.875rem;--fdCalendar_Item_Inner_Border_Size:calc(100% - .125rem)}.fd-calendar--mobile-landscape,.fd-calendar--mobile-portrait{height:100%;width:100%}.fd-calendar--mobile-landscape{--fdCalendar_Padding:0;--fdCalendar_Item_Side_Helper:1.625rem}.fd-calendar--mobile-landscape .fd-calendar__navigation--main{max-width:20rem}.fd-calendar--mobile-portrait{--fdCalendar_Padding:1rem 0 0 0}.fd-has-display-block{display:block}\n"], dependencies: [{ kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i4.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i4.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "component", type: CalendarHeaderComponent, selector: "fd-calendar-header", inputs: ["activeView", "currentlyDisplayed", "previousButtonDisabled", "nextButtonDisabled", "calendarYearGrid", "id", "mobileLandscape"], outputs: ["activeViewChange", "previousClicked", "nextClicked", "closeClicked"] }, { kind: "component", type: CalendarDayViewComponent, selector: "fd-calendar-day-view", inputs: ["currentlyDisplayed", "selectedDate", "selectedRangeDate", "startingDayOfWeek", "calType", "id", "rangeHoverEffect", "markWeekends", "showWeekNumbers", "focusEscapeFunction", "specialDaysRules", "disableFunction", "disableRangeStartFunction", "disableRangeEndFunction"], outputs: ["selectedRangeDateChange", "nextMonthSelect", "previousMonthSelect", "selectedDateChange"] }, { kind: "component", type: CalendarMonthViewComponent, selector: "fd-calendar-month-view", inputs: ["id", "monthSelected", "focusEscapeFunction", "year"], outputs: ["monthClicked"] }, { kind: "component", type: CalendarYearViewComponent, selector: "fd-calendar-year-view", inputs: ["id", "focusEscapeFunction", "yearSelected", "yearViewGrid"], outputs: ["yearClicked"] }, { kind: "component", type: CalendarAggregatedYearViewComponent, selector: "fd-calendar-aggregated-year-view", inputs: ["id", "focusEscapeFunction", "yearSelected", "aggregatedYearsViewGrid", "yearViewGrid"], outputs: ["yearsClicked"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
2585
|
+
contentDensityObserverProviders(),
|
|
2586
|
+
{
|
|
2587
|
+
provide: FD_LANGUAGE,
|
|
2588
|
+
useFactory: patchDeprecatedI18nLabels
|
|
2589
|
+
}
|
|
2590
|
+
], viewQueries: [{ propertyName: "_dayViewComponent", first: true, predicate: CalendarDayViewComponent, descendants: true }, { propertyName: "_monthViewComponent", first: true, predicate: CalendarMonthViewComponent, descendants: true }, { propertyName: "_yearViewComponent", first: true, predicate: CalendarYearViewComponent, descendants: true }, { propertyName: "_aggregatedYearViewComponent", first: true, predicate: CalendarAggregatedYearViewComponent, descendants: true }, { propertyName: "_calendarHeaderComponent", first: true, predicate: CalendarHeaderComponent, descendants: true }], usesOnChanges: true, ngImport: i0, template: "<fd-calendar-header\n [currentlyDisplayed]=\"_currentlyDisplayed\"\n [activeView]=\"activeView\"\n [id]=\"id\"\n [calendarYearGrid]=\"yearGrid\"\n [mobileLandscape]=\"mobileLandscape\"\n (closeClicked)=\"closeClicked.emit()\"\n (nextClicked)=\"handleNextArrowClick()\"\n (previousClicked)=\"handlePreviousArrowClick()\"\n [previousButtonDisabled]=\"previousButtonDisabled\"\n [nextButtonDisabled]=\"nextButtonDisabled\"\n (activeViewChange)=\"handleActiveViewChange($event)\"\n></fd-calendar-header>\n<ng-container [ngSwitch]=\"activeView\" *ngIf=\"_currentlyDisplayed\">\n <div\n class=\"fd-calendar__content\"\n [class.fd-calendar__content--dates]=\"activeView === 'day'\"\n [class.fd-calendar__content--months]=\"activeView === 'month'\"\n [class.fd-calendar__content--years]=\"activeView === 'year' || activeView === 'aggregatedYear'\"\n >\n <fd-calendar-day-view\n *ngSwitchCase=\"'day'\"\n [selectedDate]=\"selectedDate\"\n [showWeekNumbers]=\"showWeekNumbers\"\n [markWeekends]=\"markWeekends\"\n (selectedDateChange)=\"selectedDateChanged($event)\"\n [selectedRangeDate]=\"selectedRangeDate\"\n (selectedRangeDateChange)=\"selectedRangeDateChanged($event)\"\n [currentlyDisplayed]=\"_currentlyDisplayed\"\n [startingDayOfWeek]=\"getWeekStartDay()\"\n [disableFunction]=\"disableFunction\"\n [disableRangeEndFunction]=\"disableRangeEndFunction\"\n [disableRangeStartFunction]=\"disableRangeStartFunction\"\n [calType]=\"calType\"\n [id]=\"id\"\n [rangeHoverEffect]=\"rangeHoverEffect\"\n [specialDaysRules]=\"specialDaysRules\"\n [focusEscapeFunction]=\"escapeFocusFunction\"\n (nextMonthSelect)=\"displayNextMonth()\"\n (previousMonthSelect)=\"displayPreviousMonth()\"\n ></fd-calendar-day-view>\n <fd-calendar-month-view\n *ngSwitchCase=\"'month'\"\n [monthSelected]=\"_currentlyDisplayed.month\"\n [year]=\"_currentlyDisplayed.year\"\n [id]=\"id\"\n [focusEscapeFunction]=\"escapeFocusFunction\"\n (monthClicked)=\"handleMonthViewChange($event)\"\n ></fd-calendar-month-view>\n <fd-calendar-year-view\n *ngSwitchCase=\"'year'\"\n [yearSelected]=\"_currentlyDisplayed.year\"\n [yearViewGrid]=\"yearGrid\"\n [id]=\"id\"\n [focusEscapeFunction]=\"escapeFocusFunction\"\n (yearClicked)=\"selectedYear($event)\"\n >\n </fd-calendar-year-view>\n <fd-calendar-aggregated-year-view\n *ngSwitchCase=\"'aggregatedYear'\"\n (yearsClicked)=\"selectedYears($event)\"\n [yearSelected]=\"_currentlyDisplayed.year\"\n [yearViewGrid]=\"yearGrid\"\n [aggregatedYearsViewGrid]=\"aggregatedYearGrid\"\n [id]=\"id\"\n [focusEscapeFunction]=\"escapeFocusFunction\"\n >\n </fd-calendar-aggregated-year-view>\n </div>\n</ng-container>\n", styles: ["/*!\n * Fundamental Library Styles v0.28.3\n * Copyright (c) 2023 SAP SE or an SAP affiliate company.\n * Licensed under Apache License 2.0 (https://github.com/SAP/fundamental-styles/blob/main/LICENSE)\n *//*!\n.fd-calendar+(--compact, --mobile-landscape, --mobile-portrait)\n .fd-calendar__header\n .fd-calendar__navigation(--main-navigation)\n .fd-calendar__action(+[--arrow-left, --arrow-right])\n .fd-calendar__close-button--navigation\n .fd-calendar__content(+[--months, --years])\n .fd-calendar__table\n .fd-calendar__group\n .fd-calendar__row\n .fd-calendar__item(+[--other-month, --current, --side-helper, --weekend, --range],\n +[(.is-disabled | [aria-disabled=true]), (.is-focus | [aria-focus=true]), (.is-active | [aria-active=true])])\n .fd-calendar__special-day(+[--1, --2, ..., --19, --20])\n .fd-calendar__text\n*/:root{--fdCalendar_Padding:1rem;--fdCalendar_Item_Width:2.125rem;--fdCalendar_Item_Height:2.75rem;--fdCalendar_Action_Padding:.5rem;--fdCalendar_Item_Spacing:.0625rem;--fdCalendar_Button_Horizontal_Space:.25rem;--fdCalendar_Width:20rem;--fdCalendar_Item_Inner_Border_Size:calc(100% - .125rem);--fdCalendar_Action_Width:auto}.fd-calendar .fd-calendar__item{-webkit-box-sizing:border-box;-webkit-box-flex:1;-ms-flex:1 1 .375rem;background-color:var(--sapLegend_WorkingBackground);border:0;border-radius:var(--fdCalendar_Border_Radius);box-sizing:border-box;color:var(--sapTextColor);cursor:pointer;flex:1 1 .375rem;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;height:var(--fdCalendar_Item_Height);line-height:var(--sapContent_LineHeight);margin:.0625rem;min-width:var(--fdCalendar_Item_Width);overflow:hidden;padding:0;position:relative}.fd-calendar .fd-calendar__item:after,.fd-calendar .fd-calendar__item:before{box-sizing:inherit;font-size:inherit}.fd-calendar .fd-calendar__item:hover,.fd-calendar .is-hover.fd-calendar__item{background-color:var(--sapList_Hover_Background)}.fd-calendar__content--dates .fd-calendar__item--side-helper{align-self:center;background-color:var(--sapList_Background);height:var(--fdCalendar_Item_Side_Helper, 1.875rem);pointer-events:none}.fd-calendar__content--dates .fd-calendar__item--other-month{background-color:var(--sapList_Background)}.fd-calendar__content--dates .fd-calendar__item--other-month:hover,.fd-calendar__content--dates .is-hover.fd-calendar__item--other-month{background-color:var(--sapList_Hover_Background)}.fd-calendar__content--dates .fd-calendar__item--weekend{background-color:var(--sapLegend_NonWorkingBackground)}.fd-calendar__content--dates .fd-calendar__item--weekend:hover,.fd-calendar__content--dates .is-hover.fd-calendar__item--weekend{background-color:var(--sapList_Hover_Background)}.fd-calendar .fd-calendar__item--current,.fd-calendar__content--dates .fd-calendar__item--range.fd-calendar__item--current{border:solid var(--sapLegend_CurrentDateTime)!important}.fd-calendar .fd-calendar__item--current:active:after,.fd-calendar .is-active.fd-calendar__item--current:after,.fd-calendar__content--dates .fd-calendar__item--range.fd-calendar__item--current:active:after,.fd-calendar__content--dates .is-active.fd-calendar__item--range.fd-calendar__item--current:after{border:var(--fdCalendar_Active_Item_Border);border-radius:calc(var(--fdCalendar_Border_Radius) / 2);bottom:.0625rem;content:\" \";height:var(--fdCalendar_Item_Inner_Border_Size);left:.0625rem;position:absolute;right:auto;width:var(--fdCalendar_Item_Inner_Border_Size)}.fd-calendar .fd-calendar__item--current:active:after[dir=rtl],.fd-calendar .is-active.fd-calendar__item--current:after[dir=rtl],.fd-calendar [dir=rtl] .fd-calendar__item--current:active:after,.fd-calendar [dir=rtl] .is-active.fd-calendar__item--current:after,.fd-calendar__content--dates .fd-calendar__item--range.fd-calendar__item--current:active:after[dir=rtl],.fd-calendar__content--dates .is-active.fd-calendar__item--range.fd-calendar__item--current:after[dir=rtl],.fd-calendar__content--dates [dir=rtl] .fd-calendar__item--range.fd-calendar__item--current:active:after,.fd-calendar__content--dates [dir=rtl] .is-active.fd-calendar__item--range.fd-calendar__item--current:after,[dir=rtl] .fd-calendar .fd-calendar__item--current:active:after,[dir=rtl] .fd-calendar .is-active.fd-calendar__item--current:after,[dir=rtl] .fd-calendar__content--dates .fd-calendar__item--range.fd-calendar__item--current:active:after,[dir=rtl] .fd-calendar__content--dates .is-active.fd-calendar__item--range.fd-calendar__item--current:after{left:auto;right:.0625rem}.fd-calendar__content--dates .fd-calendar__item.is-active,.fd-calendar__content--dates .fd-calendar__item:active{background-color:var(--sapContent_Selected_Background);border:var(--fdCalendar_Active_Item_Border);font-weight:var(--fdCalendar_Active_Item_Font_Weight)}.fd-calendar__content--dates .fd-calendar__item.is-active:hover,.fd-calendar__content--dates .fd-calendar__item:hover:active,.fd-calendar__content--dates .is-hover.fd-calendar__item.is-active,.fd-calendar__content--dates .is-hover.fd-calendar__item:active{background-color:var(--fdCalendar_Item_Active_Background_Hover)}.fd-calendar__content--dates .fd-calendar__item.is-active:focus,.fd-calendar__content--dates .fd-calendar__item:focus:active,.fd-calendar__content--dates .is-focus.fd-calendar__item.is-active,.fd-calendar__content--dates .is-focus.fd-calendar__item:active{box-shadow:none;outline-color:var(--fdCalendar_Active_Focus_Item_Outline_Color);z-index:5}.fd-calendar__content--dates .fd-calendar__item--range{background-color:var(--sapList_SelectionBackgroundColor);border:.0625rem solid var(--sapList_SelectionBorderColor)}.fd-calendar__content--dates .fd-calendar__item--range:hover,.fd-calendar__content--dates .is-hover.fd-calendar__item--range{background-color:var(--sapList_Hover_SelectionBackground)}.fd-calendar__content--dates .fd-calendar__item.is-disabled,.fd-calendar__content--dates .fd-calendar__item:disabled,.fd-calendar__content--dates .fd-calendar__item[aria-disabled=true]{opacity:.4;pointer-events:none}.fd-calendar__content--dates .fd-calendar__item.is-disabled:hover,.fd-calendar__content--dates .fd-calendar__item:hover:disabled,.fd-calendar__content--dates .fd-calendar__item[aria-disabled=true]:hover{cursor:not-allowed}.fd-calendar__content--dates .fd-calendar__item.is-focus,.fd-calendar__content--dates .fd-calendar__item:focus{box-shadow:none;outline:var(--sapContent_FocusColor) var(--sapContent_FocusStyle) var(--sapContent_FocusWidth);outline-offset:-.1875rem}.fd-calendar__text{-webkit-box-sizing:border-box;-webkit-box-pack:center;-ms-flex-pack:center;align-items:center;border:0;box-sizing:border-box;color:var(--sapTextColor);display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;height:100%;justify-content:center;line-height:var(--sapContent_LineHeight);margin:0;padding:0;text-shadow:var(--fdCalendar_Text_Shadow)}.fd-calendar__text:after,.fd-calendar__text:before{box-sizing:inherit;font-size:inherit}.fd-calendar{-webkit-box-sizing:border-box;background-color:var(--sapList_Background);border:0;border-radius:var(--fdCalendar_Border_Radius);box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:var(--sapContent_LineHeight);margin:0;padding:0;padding:var(--fdCalendar_Padding);width:var(--fdCalendar_Width)}.fd-calendar:after,.fd-calendar:before{box-sizing:inherit;font-size:inherit}.fd-calendar__header{-webkit-box-sizing:border-box;border:0;box-sizing:border-box;color:var(--sapTextColor);display:flex;flex-direction:column;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:var(--sapContent_LineHeight);margin:0;padding:0;position:relative}.fd-calendar__header:after,.fd-calendar__header:before{box-sizing:inherit;font-size:inherit}.fd-calendar__navigation{-webkit-box-sizing:border-box;-webkit-box-pack:center;-ms-flex-pack:center;border:0;box-sizing:border-box;color:var(--sapTextColor);display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;justify-content:center;line-height:var(--sapContent_LineHeight);margin:0;padding:0;padding-bottom:var(--fdCalendar_Button_Horizontal_Space);padding-top:var(--fdCalendar_Button_Horizontal_Space);width:100%}.fd-calendar__navigation:after,.fd-calendar__navigation:before{box-sizing:inherit;font-size:inherit}.fd-calendar__action{-webkit-box-sizing:border-box;-webkit-box-flex:1;-ms-flex-positive:1;border:0;box-sizing:border-box;color:var(--sapTextColor);flex-grow:1;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:var(--sapContent_LineHeight);margin:0;padding:0}.fd-calendar__action:after,.fd-calendar__action:before{box-sizing:inherit;font-size:inherit}.fd-calendar__action:not(:last-child):not(:first-child){margin-left:.25rem;margin-right:.25rem}.fd-calendar__action:first-child{margin-right:.25rem}.fd-calendar__action:last-child{margin-left:.25rem}.fd-calendar__action>[type=button]{width:100%}.fd-calendar__action--arrow-left,.fd-calendar__action--arrow-right{flex-grow:0;width:var(--fdCalendar_Action_Width)}.fd-calendar__action--arrow-left+.fd-calendar__action--arrow-right{margin-left:auto}.fd-calendar__action--arrow-left+.fd-calendar__action--arrow-right[dir=rtl],[dir=rtl] .fd-calendar__action--arrow-left+.fd-calendar__action--arrow-right{margin-left:0;margin-right:auto}.fd-calendar__action [class*=sap-icon][dir=rtl],[dir=rtl] .fd-calendar__action [class*=sap-icon]{transform:scaleX(-1)}.fd-calendar__content{-webkit-box-sizing:border-box;border:0;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:var(--sapContent_LineHeight);margin:0;padding:0}.fd-calendar__content:after,.fd-calendar__content:before{box-sizing:inherit;font-size:inherit}.fd-calendar__content--months,.fd-calendar__content--years{padding-top:1.875rem}.fd-calendar__content--months .fd-calendar__item,.fd-calendar__content--years .fd-calendar__item{background-color:transparent;max-height:var(--fdCalendar_Item_Height)}.fd-calendar__content--months .fd-calendar__item-button,.fd-calendar__content--years .fd-calendar__item-button{min-height:100%;min-width:100%;padding:0}.fd-calendar__content--months .fd-calendar__item--current .fd-calendar__item-button,.fd-calendar__content--years .fd-calendar__item--current .fd-calendar__item-button{-webkit-box-shadow:none;border:none;border-radius:var(--fdCalendar_Month_Year_Item_Border_Radius);box-shadow:none}.fd-calendar__content--months .fd-calendar__item .fd-calendar__text,.fd-calendar__content--years .fd-calendar__item .fd-calendar__text{color:inherit}.fd-calendar__content--dates .fd-calendar__item.is-focus,.fd-calendar__content--dates .fd-calendar__item:focus{z-index:5}.fd-calendar__content--dates .fd-calendar__item.is-active .fd-calendar__text,.fd-calendar__content--dates .fd-calendar__item:active .fd-calendar__text{color:var(--sapContent_Selected_TextColor)}.fd-calendar__content--dates .fd-calendar__item--side-helper .fd-calendar__text{color:var(--sapContent_LabelColor);font-size:var(--sapFontSmallSize)}.fd-calendar__content--dates .fd-calendar__item--other-month .fd-calendar__text{color:var(--sapContent_LabelColor)}.fd-calendar__content--screen-reader-only{clip:rect(0 0 0 0);border:0;height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}.fd-calendar__table{-webkit-box-sizing:border-box;border:0;border-spacing:0;box-sizing:border-box;color:var(--sapTextColor);display:table;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:var(--sapContent_LineHeight);margin:0;padding:0;width:100%}.fd-calendar__table:after,.fd-calendar__table:before{box-sizing:inherit;font-size:inherit}.fd-calendar__group{-webkit-box-sizing:border-box;border:0;box-sizing:border-box;color:var(--sapTextColor);display:table-row-group;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:var(--sapContent_LineHeight);margin:0;padding:0}.fd-calendar__group:after,.fd-calendar__group:before{box-sizing:inherit;font-size:inherit}.fd-calendar__row{-webkit-box-sizing:border-box;border:0;box-sizing:border-box;color:var(--sapTextColor);display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:var(--sapContent_LineHeight);margin:0;padding:0}.fd-calendar__row:after,.fd-calendar__row:before{box-sizing:inherit;font-size:inherit}.fd-calendar .fd-calendar__item{display:inline-block}.fd-calendar .fd-calendar__item--current .fd-calendar__text:before{border:var(--fdCalendar_Item_Current_Border);border-radius:calc(var(--sapElement_BorderCornerRadius) / 2);content:\"\";inset:0;position:absolute;z-index:1}.fd-calendar__special-day--1 .fd-calendar__text:after{-webkit-box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor1);bottom:0;box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor1);content:\"\";height:var(--fdCalendar_Special_Day_Marker_Height);left:0;position:absolute;right:0}.fd-calendar__special-day--1.is-active .fd-calendar__text:after,.fd-calendar__special-day--1:active .fd-calendar__text:after{box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor1),inset 0 -.33rem 0 var(--fdCalendar_Item_Current_Inner_Border_Color);height:calc(var(--fdCalendar_Special_Day_Marker_Height) + .0625rem)}.fd-calendar__special-day--1.fd-calendar__item--current.is-active .fd-calendar__text:after,.fd-calendar__special-day--1.fd-calendar__item--current:active .fd-calendar__text:after{bottom:var(--fdCalendar_Item_Current_Active_Special_Day_Bottom);height:var(--fdCalendar_Item_Current_Active_Special_Day_Height);left:var(--fdCalendar_Item_Current_Active_Special_Day_Left);right:var(--fdCalendar_Item_Current_Active_Special_Day_Right);width:var(--fdCalendar_Item_Current_Active_Special_Day_Width)}.fd-calendar__special-day--2 .fd-calendar__text:after{-webkit-box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor2);bottom:0;box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor2);content:\"\";height:var(--fdCalendar_Special_Day_Marker_Height);left:0;position:absolute;right:0}.fd-calendar__special-day--2.is-active .fd-calendar__text:after,.fd-calendar__special-day--2:active .fd-calendar__text:after{box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor2),inset 0 -.33rem 0 var(--fdCalendar_Item_Current_Inner_Border_Color);height:calc(var(--fdCalendar_Special_Day_Marker_Height) + .0625rem)}.fd-calendar__special-day--2.fd-calendar__item--current.is-active .fd-calendar__text:after,.fd-calendar__special-day--2.fd-calendar__item--current:active .fd-calendar__text:after{bottom:var(--fdCalendar_Item_Current_Active_Special_Day_Bottom);height:var(--fdCalendar_Item_Current_Active_Special_Day_Height);left:var(--fdCalendar_Item_Current_Active_Special_Day_Left);right:var(--fdCalendar_Item_Current_Active_Special_Day_Right);width:var(--fdCalendar_Item_Current_Active_Special_Day_Width)}.fd-calendar__special-day--3 .fd-calendar__text:after{-webkit-box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor3);bottom:0;box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor3);content:\"\";height:var(--fdCalendar_Special_Day_Marker_Height);left:0;position:absolute;right:0}.fd-calendar__special-day--3.is-active .fd-calendar__text:after,.fd-calendar__special-day--3:active .fd-calendar__text:after{box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor3),inset 0 -.33rem 0 var(--fdCalendar_Item_Current_Inner_Border_Color);height:calc(var(--fdCalendar_Special_Day_Marker_Height) + .0625rem)}.fd-calendar__special-day--3.fd-calendar__item--current.is-active .fd-calendar__text:after,.fd-calendar__special-day--3.fd-calendar__item--current:active .fd-calendar__text:after{bottom:var(--fdCalendar_Item_Current_Active_Special_Day_Bottom);height:var(--fdCalendar_Item_Current_Active_Special_Day_Height);left:var(--fdCalendar_Item_Current_Active_Special_Day_Left);right:var(--fdCalendar_Item_Current_Active_Special_Day_Right);width:var(--fdCalendar_Item_Current_Active_Special_Day_Width)}.fd-calendar__special-day--4 .fd-calendar__text:after{-webkit-box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor4);bottom:0;box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor4);content:\"\";height:var(--fdCalendar_Special_Day_Marker_Height);left:0;position:absolute;right:0}.fd-calendar__special-day--4.is-active .fd-calendar__text:after,.fd-calendar__special-day--4:active .fd-calendar__text:after{box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor4),inset 0 -.33rem 0 var(--fdCalendar_Item_Current_Inner_Border_Color);height:calc(var(--fdCalendar_Special_Day_Marker_Height) + .0625rem)}.fd-calendar__special-day--4.fd-calendar__item--current.is-active .fd-calendar__text:after,.fd-calendar__special-day--4.fd-calendar__item--current:active .fd-calendar__text:after{bottom:var(--fdCalendar_Item_Current_Active_Special_Day_Bottom);height:var(--fdCalendar_Item_Current_Active_Special_Day_Height);left:var(--fdCalendar_Item_Current_Active_Special_Day_Left);right:var(--fdCalendar_Item_Current_Active_Special_Day_Right);width:var(--fdCalendar_Item_Current_Active_Special_Day_Width)}.fd-calendar__special-day--5 .fd-calendar__text:after{-webkit-box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor5);bottom:0;box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor5);content:\"\";height:var(--fdCalendar_Special_Day_Marker_Height);left:0;position:absolute;right:0}.fd-calendar__special-day--5.is-active .fd-calendar__text:after,.fd-calendar__special-day--5:active .fd-calendar__text:after{box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor5),inset 0 -.33rem 0 var(--fdCalendar_Item_Current_Inner_Border_Color);height:calc(var(--fdCalendar_Special_Day_Marker_Height) + .0625rem)}.fd-calendar__special-day--5.fd-calendar__item--current.is-active .fd-calendar__text:after,.fd-calendar__special-day--5.fd-calendar__item--current:active .fd-calendar__text:after{bottom:var(--fdCalendar_Item_Current_Active_Special_Day_Bottom);height:var(--fdCalendar_Item_Current_Active_Special_Day_Height);left:var(--fdCalendar_Item_Current_Active_Special_Day_Left);right:var(--fdCalendar_Item_Current_Active_Special_Day_Right);width:var(--fdCalendar_Item_Current_Active_Special_Day_Width)}.fd-calendar__special-day--6 .fd-calendar__text:after{-webkit-box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor6);bottom:0;box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor6);content:\"\";height:var(--fdCalendar_Special_Day_Marker_Height);left:0;position:absolute;right:0}.fd-calendar__special-day--6.is-active .fd-calendar__text:after,.fd-calendar__special-day--6:active .fd-calendar__text:after{box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor6),inset 0 -.33rem 0 var(--fdCalendar_Item_Current_Inner_Border_Color);height:calc(var(--fdCalendar_Special_Day_Marker_Height) + .0625rem)}.fd-calendar__special-day--6.fd-calendar__item--current.is-active .fd-calendar__text:after,.fd-calendar__special-day--6.fd-calendar__item--current:active .fd-calendar__text:after{bottom:var(--fdCalendar_Item_Current_Active_Special_Day_Bottom);height:var(--fdCalendar_Item_Current_Active_Special_Day_Height);left:var(--fdCalendar_Item_Current_Active_Special_Day_Left);right:var(--fdCalendar_Item_Current_Active_Special_Day_Right);width:var(--fdCalendar_Item_Current_Active_Special_Day_Width)}.fd-calendar__special-day--7 .fd-calendar__text:after{-webkit-box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor7);bottom:0;box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor7);content:\"\";height:var(--fdCalendar_Special_Day_Marker_Height);left:0;position:absolute;right:0}.fd-calendar__special-day--7.is-active .fd-calendar__text:after,.fd-calendar__special-day--7:active .fd-calendar__text:after{box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor7),inset 0 -.33rem 0 var(--fdCalendar_Item_Current_Inner_Border_Color);height:calc(var(--fdCalendar_Special_Day_Marker_Height) + .0625rem)}.fd-calendar__special-day--7.fd-calendar__item--current.is-active .fd-calendar__text:after,.fd-calendar__special-day--7.fd-calendar__item--current:active .fd-calendar__text:after{bottom:var(--fdCalendar_Item_Current_Active_Special_Day_Bottom);height:var(--fdCalendar_Item_Current_Active_Special_Day_Height);left:var(--fdCalendar_Item_Current_Active_Special_Day_Left);right:var(--fdCalendar_Item_Current_Active_Special_Day_Right);width:var(--fdCalendar_Item_Current_Active_Special_Day_Width)}.fd-calendar__special-day--8 .fd-calendar__text:after{-webkit-box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor8);bottom:0;box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor8);content:\"\";height:var(--fdCalendar_Special_Day_Marker_Height);left:0;position:absolute;right:0}.fd-calendar__special-day--8.is-active .fd-calendar__text:after,.fd-calendar__special-day--8:active .fd-calendar__text:after{box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor8),inset 0 -.33rem 0 var(--fdCalendar_Item_Current_Inner_Border_Color);height:calc(var(--fdCalendar_Special_Day_Marker_Height) + .0625rem)}.fd-calendar__special-day--8.fd-calendar__item--current.is-active .fd-calendar__text:after,.fd-calendar__special-day--8.fd-calendar__item--current:active .fd-calendar__text:after{bottom:var(--fdCalendar_Item_Current_Active_Special_Day_Bottom);height:var(--fdCalendar_Item_Current_Active_Special_Day_Height);left:var(--fdCalendar_Item_Current_Active_Special_Day_Left);right:var(--fdCalendar_Item_Current_Active_Special_Day_Right);width:var(--fdCalendar_Item_Current_Active_Special_Day_Width)}.fd-calendar__special-day--9 .fd-calendar__text:after{-webkit-box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor9);bottom:0;box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor9);content:\"\";height:var(--fdCalendar_Special_Day_Marker_Height);left:0;position:absolute;right:0}.fd-calendar__special-day--9.is-active .fd-calendar__text:after,.fd-calendar__special-day--9:active .fd-calendar__text:after{box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor9),inset 0 -.33rem 0 var(--fdCalendar_Item_Current_Inner_Border_Color);height:calc(var(--fdCalendar_Special_Day_Marker_Height) + .0625rem)}.fd-calendar__special-day--9.fd-calendar__item--current.is-active .fd-calendar__text:after,.fd-calendar__special-day--9.fd-calendar__item--current:active .fd-calendar__text:after{bottom:var(--fdCalendar_Item_Current_Active_Special_Day_Bottom);height:var(--fdCalendar_Item_Current_Active_Special_Day_Height);left:var(--fdCalendar_Item_Current_Active_Special_Day_Left);right:var(--fdCalendar_Item_Current_Active_Special_Day_Right);width:var(--fdCalendar_Item_Current_Active_Special_Day_Width)}.fd-calendar__special-day--10 .fd-calendar__text:after{-webkit-box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor10);bottom:0;box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor10);content:\"\";height:var(--fdCalendar_Special_Day_Marker_Height);left:0;position:absolute;right:0}.fd-calendar__special-day--10.is-active .fd-calendar__text:after,.fd-calendar__special-day--10:active .fd-calendar__text:after{box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor10),inset 0 -.33rem 0 var(--fdCalendar_Item_Current_Inner_Border_Color);height:calc(var(--fdCalendar_Special_Day_Marker_Height) + .0625rem)}.fd-calendar__special-day--10.fd-calendar__item--current.is-active .fd-calendar__text:after,.fd-calendar__special-day--10.fd-calendar__item--current:active .fd-calendar__text:after{bottom:var(--fdCalendar_Item_Current_Active_Special_Day_Bottom);height:var(--fdCalendar_Item_Current_Active_Special_Day_Height);left:var(--fdCalendar_Item_Current_Active_Special_Day_Left);right:var(--fdCalendar_Item_Current_Active_Special_Day_Right);width:var(--fdCalendar_Item_Current_Active_Special_Day_Width)}.fd-calendar__special-day--11 .fd-calendar__text:after{-webkit-box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor11);bottom:0;box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor11);content:\"\";height:var(--fdCalendar_Special_Day_Marker_Height);left:0;position:absolute;right:0}.fd-calendar__special-day--11.is-active .fd-calendar__text:after,.fd-calendar__special-day--11:active .fd-calendar__text:after{box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor11),inset 0 -.33rem 0 var(--fdCalendar_Item_Current_Inner_Border_Color);height:calc(var(--fdCalendar_Special_Day_Marker_Height) + .0625rem)}.fd-calendar__special-day--11.fd-calendar__item--current.is-active .fd-calendar__text:after,.fd-calendar__special-day--11.fd-calendar__item--current:active .fd-calendar__text:after{bottom:var(--fdCalendar_Item_Current_Active_Special_Day_Bottom);height:var(--fdCalendar_Item_Current_Active_Special_Day_Height);left:var(--fdCalendar_Item_Current_Active_Special_Day_Left);right:var(--fdCalendar_Item_Current_Active_Special_Day_Right);width:var(--fdCalendar_Item_Current_Active_Special_Day_Width)}.fd-calendar__special-day--12 .fd-calendar__text:after{-webkit-box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor12);bottom:0;box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor12);content:\"\";height:var(--fdCalendar_Special_Day_Marker_Height);left:0;position:absolute;right:0}.fd-calendar__special-day--12.is-active .fd-calendar__text:after,.fd-calendar__special-day--12:active .fd-calendar__text:after{box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor12),inset 0 -.33rem 0 var(--fdCalendar_Item_Current_Inner_Border_Color);height:calc(var(--fdCalendar_Special_Day_Marker_Height) + .0625rem)}.fd-calendar__special-day--12.fd-calendar__item--current.is-active .fd-calendar__text:after,.fd-calendar__special-day--12.fd-calendar__item--current:active .fd-calendar__text:after{bottom:var(--fdCalendar_Item_Current_Active_Special_Day_Bottom);height:var(--fdCalendar_Item_Current_Active_Special_Day_Height);left:var(--fdCalendar_Item_Current_Active_Special_Day_Left);right:var(--fdCalendar_Item_Current_Active_Special_Day_Right);width:var(--fdCalendar_Item_Current_Active_Special_Day_Width)}.fd-calendar__special-day--13 .fd-calendar__text:after{-webkit-box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor13);bottom:0;box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor13);content:\"\";height:var(--fdCalendar_Special_Day_Marker_Height);left:0;position:absolute;right:0}.fd-calendar__special-day--13.is-active .fd-calendar__text:after,.fd-calendar__special-day--13:active .fd-calendar__text:after{box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor13),inset 0 -.33rem 0 var(--fdCalendar_Item_Current_Inner_Border_Color);height:calc(var(--fdCalendar_Special_Day_Marker_Height) + .0625rem)}.fd-calendar__special-day--13.fd-calendar__item--current.is-active .fd-calendar__text:after,.fd-calendar__special-day--13.fd-calendar__item--current:active .fd-calendar__text:after{bottom:var(--fdCalendar_Item_Current_Active_Special_Day_Bottom);height:var(--fdCalendar_Item_Current_Active_Special_Day_Height);left:var(--fdCalendar_Item_Current_Active_Special_Day_Left);right:var(--fdCalendar_Item_Current_Active_Special_Day_Right);width:var(--fdCalendar_Item_Current_Active_Special_Day_Width)}.fd-calendar__special-day--14 .fd-calendar__text:after{-webkit-box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor14);bottom:0;box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor14);content:\"\";height:var(--fdCalendar_Special_Day_Marker_Height);left:0;position:absolute;right:0}.fd-calendar__special-day--14.is-active .fd-calendar__text:after,.fd-calendar__special-day--14:active .fd-calendar__text:after{box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor14),inset 0 -.33rem 0 var(--fdCalendar_Item_Current_Inner_Border_Color);height:calc(var(--fdCalendar_Special_Day_Marker_Height) + .0625rem)}.fd-calendar__special-day--14.fd-calendar__item--current.is-active .fd-calendar__text:after,.fd-calendar__special-day--14.fd-calendar__item--current:active .fd-calendar__text:after{bottom:var(--fdCalendar_Item_Current_Active_Special_Day_Bottom);height:var(--fdCalendar_Item_Current_Active_Special_Day_Height);left:var(--fdCalendar_Item_Current_Active_Special_Day_Left);right:var(--fdCalendar_Item_Current_Active_Special_Day_Right);width:var(--fdCalendar_Item_Current_Active_Special_Day_Width)}.fd-calendar__special-day--15 .fd-calendar__text:after{-webkit-box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor15);bottom:0;box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor15);content:\"\";height:var(--fdCalendar_Special_Day_Marker_Height);left:0;position:absolute;right:0}.fd-calendar__special-day--15.is-active .fd-calendar__text:after,.fd-calendar__special-day--15:active .fd-calendar__text:after{box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor15),inset 0 -.33rem 0 var(--fdCalendar_Item_Current_Inner_Border_Color);height:calc(var(--fdCalendar_Special_Day_Marker_Height) + .0625rem)}.fd-calendar__special-day--15.fd-calendar__item--current.is-active .fd-calendar__text:after,.fd-calendar__special-day--15.fd-calendar__item--current:active .fd-calendar__text:after{bottom:var(--fdCalendar_Item_Current_Active_Special_Day_Bottom);height:var(--fdCalendar_Item_Current_Active_Special_Day_Height);left:var(--fdCalendar_Item_Current_Active_Special_Day_Left);right:var(--fdCalendar_Item_Current_Active_Special_Day_Right);width:var(--fdCalendar_Item_Current_Active_Special_Day_Width)}.fd-calendar__special-day--16 .fd-calendar__text:after{-webkit-box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor16);bottom:0;box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor16);content:\"\";height:var(--fdCalendar_Special_Day_Marker_Height);left:0;position:absolute;right:0}.fd-calendar__special-day--16.is-active .fd-calendar__text:after,.fd-calendar__special-day--16:active .fd-calendar__text:after{box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor16),inset 0 -.33rem 0 var(--fdCalendar_Item_Current_Inner_Border_Color);height:calc(var(--fdCalendar_Special_Day_Marker_Height) + .0625rem)}.fd-calendar__special-day--16.fd-calendar__item--current.is-active .fd-calendar__text:after,.fd-calendar__special-day--16.fd-calendar__item--current:active .fd-calendar__text:after{bottom:var(--fdCalendar_Item_Current_Active_Special_Day_Bottom);height:var(--fdCalendar_Item_Current_Active_Special_Day_Height);left:var(--fdCalendar_Item_Current_Active_Special_Day_Left);right:var(--fdCalendar_Item_Current_Active_Special_Day_Right);width:var(--fdCalendar_Item_Current_Active_Special_Day_Width)}.fd-calendar__special-day--17 .fd-calendar__text:after{-webkit-box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor17);bottom:0;box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor17);content:\"\";height:var(--fdCalendar_Special_Day_Marker_Height);left:0;position:absolute;right:0}.fd-calendar__special-day--17.is-active .fd-calendar__text:after,.fd-calendar__special-day--17:active .fd-calendar__text:after{box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor17),inset 0 -.33rem 0 var(--fdCalendar_Item_Current_Inner_Border_Color);height:calc(var(--fdCalendar_Special_Day_Marker_Height) + .0625rem)}.fd-calendar__special-day--17.fd-calendar__item--current.is-active .fd-calendar__text:after,.fd-calendar__special-day--17.fd-calendar__item--current:active .fd-calendar__text:after{bottom:var(--fdCalendar_Item_Current_Active_Special_Day_Bottom);height:var(--fdCalendar_Item_Current_Active_Special_Day_Height);left:var(--fdCalendar_Item_Current_Active_Special_Day_Left);right:var(--fdCalendar_Item_Current_Active_Special_Day_Right);width:var(--fdCalendar_Item_Current_Active_Special_Day_Width)}.fd-calendar__special-day--18 .fd-calendar__text:after{-webkit-box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor18);bottom:0;box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor18);content:\"\";height:var(--fdCalendar_Special_Day_Marker_Height);left:0;position:absolute;right:0}.fd-calendar__special-day--18.is-active .fd-calendar__text:after,.fd-calendar__special-day--18:active .fd-calendar__text:after{box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor18),inset 0 -.33rem 0 var(--fdCalendar_Item_Current_Inner_Border_Color);height:calc(var(--fdCalendar_Special_Day_Marker_Height) + .0625rem)}.fd-calendar__special-day--18.fd-calendar__item--current.is-active .fd-calendar__text:after,.fd-calendar__special-day--18.fd-calendar__item--current:active .fd-calendar__text:after{bottom:var(--fdCalendar_Item_Current_Active_Special_Day_Bottom);height:var(--fdCalendar_Item_Current_Active_Special_Day_Height);left:var(--fdCalendar_Item_Current_Active_Special_Day_Left);right:var(--fdCalendar_Item_Current_Active_Special_Day_Right);width:var(--fdCalendar_Item_Current_Active_Special_Day_Width)}.fd-calendar__special-day--19 .fd-calendar__text:after{-webkit-box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor19);bottom:0;box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor19);content:\"\";height:var(--fdCalendar_Special_Day_Marker_Height);left:0;position:absolute;right:0}.fd-calendar__special-day--19.is-active .fd-calendar__text:after,.fd-calendar__special-day--19:active .fd-calendar__text:after{box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor19),inset 0 -.33rem 0 var(--fdCalendar_Item_Current_Inner_Border_Color);height:calc(var(--fdCalendar_Special_Day_Marker_Height) + .0625rem)}.fd-calendar__special-day--19.fd-calendar__item--current.is-active .fd-calendar__text:after,.fd-calendar__special-day--19.fd-calendar__item--current:active .fd-calendar__text:after{bottom:var(--fdCalendar_Item_Current_Active_Special_Day_Bottom);height:var(--fdCalendar_Item_Current_Active_Special_Day_Height);left:var(--fdCalendar_Item_Current_Active_Special_Day_Left);right:var(--fdCalendar_Item_Current_Active_Special_Day_Right);width:var(--fdCalendar_Item_Current_Active_Special_Day_Width)}.fd-calendar__special-day--20 .fd-calendar__text:after{-webkit-box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor20);bottom:0;box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor20);content:\"\";height:var(--fdCalendar_Special_Day_Marker_Height);left:0;position:absolute;right:0}.fd-calendar__special-day--20.is-active .fd-calendar__text:after,.fd-calendar__special-day--20:active .fd-calendar__text:after{box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor20),inset 0 -.33rem 0 var(--fdCalendar_Item_Current_Inner_Border_Color);height:calc(var(--fdCalendar_Special_Day_Marker_Height) + .0625rem)}.fd-calendar__special-day--20.fd-calendar__item--current.is-active .fd-calendar__text:after,.fd-calendar__special-day--20.fd-calendar__item--current:active .fd-calendar__text:after{bottom:var(--fdCalendar_Item_Current_Active_Special_Day_Bottom);height:var(--fdCalendar_Item_Current_Active_Special_Day_Height);left:var(--fdCalendar_Item_Current_Active_Special_Day_Left);right:var(--fdCalendar_Item_Current_Active_Special_Day_Right);width:var(--fdCalendar_Item_Current_Active_Special_Day_Width)}.fd-calendar .fd-calendar__close-button--navigation{-webkit-transform:translateY(-50%);position:absolute;right:0;top:50%;transform:translateY(-50%)}.fd-calendar .fd-calendar__close-button--navigation[dir=rtl],[dir=rtl] .fd-calendar .fd-calendar__close-button--navigation{left:0;right:auto}.fd-calendar[class*=-compact],.fd-calendar[class*=-condensed],[class*=-compact] .fd-calendar:not([class*=-cozy]),[class*=-condensed] .fd-calendar:not([class*=-cozy]){--fdCalendar_Width:17rem;--fdCalendar_Padding:.5rem;--fdCalendar_Item_Height:1.875rem;--fdCalendar_Button_Horizontal_Space:.1875rem;--fdCalendar_Action_Width:1.875rem;--fdCalendar_Item_Width:1.875rem;--fdCalendar_Item_Inner_Border_Size:calc(100% - .125rem)}.fd-calendar--mobile-landscape,.fd-calendar--mobile-portrait{height:100%;width:100%}.fd-calendar--mobile-landscape{--fdCalendar_Padding:0;--fdCalendar_Item_Side_Helper:1.625rem}.fd-calendar--mobile-landscape .fd-calendar__navigation--main{max-width:20rem}.fd-calendar--mobile-portrait{--fdCalendar_Padding:1rem 0 0 0}.fd-has-display-block{display:block}\n"], dependencies: [{ kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i3.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "component", type: CalendarHeaderComponent, selector: "fd-calendar-header", inputs: ["activeView", "currentlyDisplayed", "previousButtonDisabled", "nextButtonDisabled", "calendarYearGrid", "id", "mobileLandscape"], outputs: ["activeViewChange", "previousClicked", "nextClicked", "closeClicked"] }, { kind: "component", type: CalendarDayViewComponent, selector: "fd-calendar-day-view", inputs: ["currentlyDisplayed", "selectedDate", "selectedRangeDate", "startingDayOfWeek", "calType", "id", "rangeHoverEffect", "markWeekends", "showWeekNumbers", "focusEscapeFunction", "specialDaysRules", "disableFunction", "disableRangeStartFunction", "disableRangeEndFunction"], outputs: ["selectedRangeDateChange", "nextMonthSelect", "previousMonthSelect", "selectedDateChange"] }, { kind: "component", type: CalendarMonthViewComponent, selector: "fd-calendar-month-view", inputs: ["id", "monthSelected", "focusEscapeFunction", "year"], outputs: ["monthClicked"] }, { kind: "component", type: CalendarYearViewComponent, selector: "fd-calendar-year-view", inputs: ["id", "focusEscapeFunction", "yearSelected", "yearViewGrid"], outputs: ["yearClicked"] }, { kind: "component", type: CalendarAggregatedYearViewComponent, selector: "fd-calendar-aggregated-year-view", inputs: ["id", "focusEscapeFunction", "yearSelected", "aggregatedYearsViewGrid", "yearViewGrid"], outputs: ["yearsClicked"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
2715
2591
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: CalendarComponent, decorators: [{
|
|
2716
2592
|
type: Component,
|
|
2717
2593
|
args: [{ selector: 'fd-calendar', encapsulation: ViewEncapsulation.None, providers: [
|
|
@@ -2726,13 +2602,17 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImpor
|
|
|
2726
2602
|
multi: true
|
|
2727
2603
|
},
|
|
2728
2604
|
CalendarService,
|
|
2729
|
-
contentDensityObserverProviders()
|
|
2605
|
+
contentDensityObserverProviders(),
|
|
2606
|
+
{
|
|
2607
|
+
provide: FD_LANGUAGE,
|
|
2608
|
+
useFactory: patchDeprecatedI18nLabels
|
|
2609
|
+
}
|
|
2730
2610
|
], host: {
|
|
2731
2611
|
'(focusout)': '_focusOut($event)',
|
|
2732
2612
|
'[attr.id]': 'id',
|
|
2733
2613
|
class: 'fd-calendar fd-has-display-block'
|
|
2734
2614
|
}, changeDetection: ChangeDetectionStrategy.OnPush, template: "<fd-calendar-header\n [currentlyDisplayed]=\"_currentlyDisplayed\"\n [activeView]=\"activeView\"\n [id]=\"id\"\n [calendarYearGrid]=\"yearGrid\"\n [mobileLandscape]=\"mobileLandscape\"\n (closeClicked)=\"closeClicked.emit()\"\n (nextClicked)=\"handleNextArrowClick()\"\n (previousClicked)=\"handlePreviousArrowClick()\"\n [previousButtonDisabled]=\"previousButtonDisabled\"\n [nextButtonDisabled]=\"nextButtonDisabled\"\n (activeViewChange)=\"handleActiveViewChange($event)\"\n></fd-calendar-header>\n<ng-container [ngSwitch]=\"activeView\" *ngIf=\"_currentlyDisplayed\">\n <div\n class=\"fd-calendar__content\"\n [class.fd-calendar__content--dates]=\"activeView === 'day'\"\n [class.fd-calendar__content--months]=\"activeView === 'month'\"\n [class.fd-calendar__content--years]=\"activeView === 'year' || activeView === 'aggregatedYear'\"\n >\n <fd-calendar-day-view\n *ngSwitchCase=\"'day'\"\n [selectedDate]=\"selectedDate\"\n [showWeekNumbers]=\"showWeekNumbers\"\n [markWeekends]=\"markWeekends\"\n (selectedDateChange)=\"selectedDateChanged($event)\"\n [selectedRangeDate]=\"selectedRangeDate\"\n (selectedRangeDateChange)=\"selectedRangeDateChanged($event)\"\n [currentlyDisplayed]=\"_currentlyDisplayed\"\n [startingDayOfWeek]=\"getWeekStartDay()\"\n [disableFunction]=\"disableFunction\"\n [disableRangeEndFunction]=\"disableRangeEndFunction\"\n [disableRangeStartFunction]=\"disableRangeStartFunction\"\n [calType]=\"calType\"\n [id]=\"id\"\n [rangeHoverEffect]=\"rangeHoverEffect\"\n [specialDaysRules]=\"specialDaysRules\"\n [focusEscapeFunction]=\"escapeFocusFunction\"\n (nextMonthSelect)=\"displayNextMonth()\"\n (previousMonthSelect)=\"displayPreviousMonth()\"\n ></fd-calendar-day-view>\n <fd-calendar-month-view\n *ngSwitchCase=\"'month'\"\n [monthSelected]=\"_currentlyDisplayed.month\"\n [year]=\"_currentlyDisplayed.year\"\n [id]=\"id\"\n [focusEscapeFunction]=\"escapeFocusFunction\"\n (monthClicked)=\"handleMonthViewChange($event)\"\n ></fd-calendar-month-view>\n <fd-calendar-year-view\n *ngSwitchCase=\"'year'\"\n [yearSelected]=\"_currentlyDisplayed.year\"\n [yearViewGrid]=\"yearGrid\"\n [id]=\"id\"\n [focusEscapeFunction]=\"escapeFocusFunction\"\n (yearClicked)=\"selectedYear($event)\"\n >\n </fd-calendar-year-view>\n <fd-calendar-aggregated-year-view\n *ngSwitchCase=\"'aggregatedYear'\"\n (yearsClicked)=\"selectedYears($event)\"\n [yearSelected]=\"_currentlyDisplayed.year\"\n [yearViewGrid]=\"yearGrid\"\n [aggregatedYearsViewGrid]=\"aggregatedYearGrid\"\n [id]=\"id\"\n [focusEscapeFunction]=\"escapeFocusFunction\"\n >\n </fd-calendar-aggregated-year-view>\n </div>\n</ng-container>\n", styles: ["/*!\n * Fundamental Library Styles v0.28.3\n * Copyright (c) 2023 SAP SE or an SAP affiliate company.\n * Licensed under Apache License 2.0 (https://github.com/SAP/fundamental-styles/blob/main/LICENSE)\n *//*!\n.fd-calendar+(--compact, --mobile-landscape, --mobile-portrait)\n .fd-calendar__header\n .fd-calendar__navigation(--main-navigation)\n .fd-calendar__action(+[--arrow-left, --arrow-right])\n .fd-calendar__close-button--navigation\n .fd-calendar__content(+[--months, --years])\n .fd-calendar__table\n .fd-calendar__group\n .fd-calendar__row\n .fd-calendar__item(+[--other-month, --current, --side-helper, --weekend, --range],\n +[(.is-disabled | [aria-disabled=true]), (.is-focus | [aria-focus=true]), (.is-active | [aria-active=true])])\n .fd-calendar__special-day(+[--1, --2, ..., --19, --20])\n .fd-calendar__text\n*/:root{--fdCalendar_Padding:1rem;--fdCalendar_Item_Width:2.125rem;--fdCalendar_Item_Height:2.75rem;--fdCalendar_Action_Padding:.5rem;--fdCalendar_Item_Spacing:.0625rem;--fdCalendar_Button_Horizontal_Space:.25rem;--fdCalendar_Width:20rem;--fdCalendar_Item_Inner_Border_Size:calc(100% - .125rem);--fdCalendar_Action_Width:auto}.fd-calendar .fd-calendar__item{-webkit-box-sizing:border-box;-webkit-box-flex:1;-ms-flex:1 1 .375rem;background-color:var(--sapLegend_WorkingBackground);border:0;border-radius:var(--fdCalendar_Border_Radius);box-sizing:border-box;color:var(--sapTextColor);cursor:pointer;flex:1 1 .375rem;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;height:var(--fdCalendar_Item_Height);line-height:var(--sapContent_LineHeight);margin:.0625rem;min-width:var(--fdCalendar_Item_Width);overflow:hidden;padding:0;position:relative}.fd-calendar .fd-calendar__item:after,.fd-calendar .fd-calendar__item:before{box-sizing:inherit;font-size:inherit}.fd-calendar .fd-calendar__item:hover,.fd-calendar .is-hover.fd-calendar__item{background-color:var(--sapList_Hover_Background)}.fd-calendar__content--dates .fd-calendar__item--side-helper{align-self:center;background-color:var(--sapList_Background);height:var(--fdCalendar_Item_Side_Helper, 1.875rem);pointer-events:none}.fd-calendar__content--dates .fd-calendar__item--other-month{background-color:var(--sapList_Background)}.fd-calendar__content--dates .fd-calendar__item--other-month:hover,.fd-calendar__content--dates .is-hover.fd-calendar__item--other-month{background-color:var(--sapList_Hover_Background)}.fd-calendar__content--dates .fd-calendar__item--weekend{background-color:var(--sapLegend_NonWorkingBackground)}.fd-calendar__content--dates .fd-calendar__item--weekend:hover,.fd-calendar__content--dates .is-hover.fd-calendar__item--weekend{background-color:var(--sapList_Hover_Background)}.fd-calendar .fd-calendar__item--current,.fd-calendar__content--dates .fd-calendar__item--range.fd-calendar__item--current{border:solid var(--sapLegend_CurrentDateTime)!important}.fd-calendar .fd-calendar__item--current:active:after,.fd-calendar .is-active.fd-calendar__item--current:after,.fd-calendar__content--dates .fd-calendar__item--range.fd-calendar__item--current:active:after,.fd-calendar__content--dates .is-active.fd-calendar__item--range.fd-calendar__item--current:after{border:var(--fdCalendar_Active_Item_Border);border-radius:calc(var(--fdCalendar_Border_Radius) / 2);bottom:.0625rem;content:\" \";height:var(--fdCalendar_Item_Inner_Border_Size);left:.0625rem;position:absolute;right:auto;width:var(--fdCalendar_Item_Inner_Border_Size)}.fd-calendar .fd-calendar__item--current:active:after[dir=rtl],.fd-calendar .is-active.fd-calendar__item--current:after[dir=rtl],.fd-calendar [dir=rtl] .fd-calendar__item--current:active:after,.fd-calendar [dir=rtl] .is-active.fd-calendar__item--current:after,.fd-calendar__content--dates .fd-calendar__item--range.fd-calendar__item--current:active:after[dir=rtl],.fd-calendar__content--dates .is-active.fd-calendar__item--range.fd-calendar__item--current:after[dir=rtl],.fd-calendar__content--dates [dir=rtl] .fd-calendar__item--range.fd-calendar__item--current:active:after,.fd-calendar__content--dates [dir=rtl] .is-active.fd-calendar__item--range.fd-calendar__item--current:after,[dir=rtl] .fd-calendar .fd-calendar__item--current:active:after,[dir=rtl] .fd-calendar .is-active.fd-calendar__item--current:after,[dir=rtl] .fd-calendar__content--dates .fd-calendar__item--range.fd-calendar__item--current:active:after,[dir=rtl] .fd-calendar__content--dates .is-active.fd-calendar__item--range.fd-calendar__item--current:after{left:auto;right:.0625rem}.fd-calendar__content--dates .fd-calendar__item.is-active,.fd-calendar__content--dates .fd-calendar__item:active{background-color:var(--sapContent_Selected_Background);border:var(--fdCalendar_Active_Item_Border);font-weight:var(--fdCalendar_Active_Item_Font_Weight)}.fd-calendar__content--dates .fd-calendar__item.is-active:hover,.fd-calendar__content--dates .fd-calendar__item:hover:active,.fd-calendar__content--dates .is-hover.fd-calendar__item.is-active,.fd-calendar__content--dates .is-hover.fd-calendar__item:active{background-color:var(--fdCalendar_Item_Active_Background_Hover)}.fd-calendar__content--dates .fd-calendar__item.is-active:focus,.fd-calendar__content--dates .fd-calendar__item:focus:active,.fd-calendar__content--dates .is-focus.fd-calendar__item.is-active,.fd-calendar__content--dates .is-focus.fd-calendar__item:active{box-shadow:none;outline-color:var(--fdCalendar_Active_Focus_Item_Outline_Color);z-index:5}.fd-calendar__content--dates .fd-calendar__item--range{background-color:var(--sapList_SelectionBackgroundColor);border:.0625rem solid var(--sapList_SelectionBorderColor)}.fd-calendar__content--dates .fd-calendar__item--range:hover,.fd-calendar__content--dates .is-hover.fd-calendar__item--range{background-color:var(--sapList_Hover_SelectionBackground)}.fd-calendar__content--dates .fd-calendar__item.is-disabled,.fd-calendar__content--dates .fd-calendar__item:disabled,.fd-calendar__content--dates .fd-calendar__item[aria-disabled=true]{opacity:.4;pointer-events:none}.fd-calendar__content--dates .fd-calendar__item.is-disabled:hover,.fd-calendar__content--dates .fd-calendar__item:hover:disabled,.fd-calendar__content--dates .fd-calendar__item[aria-disabled=true]:hover{cursor:not-allowed}.fd-calendar__content--dates .fd-calendar__item.is-focus,.fd-calendar__content--dates .fd-calendar__item:focus{box-shadow:none;outline:var(--sapContent_FocusColor) var(--sapContent_FocusStyle) var(--sapContent_FocusWidth);outline-offset:-.1875rem}.fd-calendar__text{-webkit-box-sizing:border-box;-webkit-box-pack:center;-ms-flex-pack:center;align-items:center;border:0;box-sizing:border-box;color:var(--sapTextColor);display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;height:100%;justify-content:center;line-height:var(--sapContent_LineHeight);margin:0;padding:0;text-shadow:var(--fdCalendar_Text_Shadow)}.fd-calendar__text:after,.fd-calendar__text:before{box-sizing:inherit;font-size:inherit}.fd-calendar{-webkit-box-sizing:border-box;background-color:var(--sapList_Background);border:0;border-radius:var(--fdCalendar_Border_Radius);box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:var(--sapContent_LineHeight);margin:0;padding:0;padding:var(--fdCalendar_Padding);width:var(--fdCalendar_Width)}.fd-calendar:after,.fd-calendar:before{box-sizing:inherit;font-size:inherit}.fd-calendar__header{-webkit-box-sizing:border-box;border:0;box-sizing:border-box;color:var(--sapTextColor);display:flex;flex-direction:column;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:var(--sapContent_LineHeight);margin:0;padding:0;position:relative}.fd-calendar__header:after,.fd-calendar__header:before{box-sizing:inherit;font-size:inherit}.fd-calendar__navigation{-webkit-box-sizing:border-box;-webkit-box-pack:center;-ms-flex-pack:center;border:0;box-sizing:border-box;color:var(--sapTextColor);display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;justify-content:center;line-height:var(--sapContent_LineHeight);margin:0;padding:0;padding-bottom:var(--fdCalendar_Button_Horizontal_Space);padding-top:var(--fdCalendar_Button_Horizontal_Space);width:100%}.fd-calendar__navigation:after,.fd-calendar__navigation:before{box-sizing:inherit;font-size:inherit}.fd-calendar__action{-webkit-box-sizing:border-box;-webkit-box-flex:1;-ms-flex-positive:1;border:0;box-sizing:border-box;color:var(--sapTextColor);flex-grow:1;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:var(--sapContent_LineHeight);margin:0;padding:0}.fd-calendar__action:after,.fd-calendar__action:before{box-sizing:inherit;font-size:inherit}.fd-calendar__action:not(:last-child):not(:first-child){margin-left:.25rem;margin-right:.25rem}.fd-calendar__action:first-child{margin-right:.25rem}.fd-calendar__action:last-child{margin-left:.25rem}.fd-calendar__action>[type=button]{width:100%}.fd-calendar__action--arrow-left,.fd-calendar__action--arrow-right{flex-grow:0;width:var(--fdCalendar_Action_Width)}.fd-calendar__action--arrow-left+.fd-calendar__action--arrow-right{margin-left:auto}.fd-calendar__action--arrow-left+.fd-calendar__action--arrow-right[dir=rtl],[dir=rtl] .fd-calendar__action--arrow-left+.fd-calendar__action--arrow-right{margin-left:0;margin-right:auto}.fd-calendar__action [class*=sap-icon][dir=rtl],[dir=rtl] .fd-calendar__action [class*=sap-icon]{transform:scaleX(-1)}.fd-calendar__content{-webkit-box-sizing:border-box;border:0;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:var(--sapContent_LineHeight);margin:0;padding:0}.fd-calendar__content:after,.fd-calendar__content:before{box-sizing:inherit;font-size:inherit}.fd-calendar__content--months,.fd-calendar__content--years{padding-top:1.875rem}.fd-calendar__content--months .fd-calendar__item,.fd-calendar__content--years .fd-calendar__item{background-color:transparent;max-height:var(--fdCalendar_Item_Height)}.fd-calendar__content--months .fd-calendar__item-button,.fd-calendar__content--years .fd-calendar__item-button{min-height:100%;min-width:100%;padding:0}.fd-calendar__content--months .fd-calendar__item--current .fd-calendar__item-button,.fd-calendar__content--years .fd-calendar__item--current .fd-calendar__item-button{-webkit-box-shadow:none;border:none;border-radius:var(--fdCalendar_Month_Year_Item_Border_Radius);box-shadow:none}.fd-calendar__content--months .fd-calendar__item .fd-calendar__text,.fd-calendar__content--years .fd-calendar__item .fd-calendar__text{color:inherit}.fd-calendar__content--dates .fd-calendar__item.is-focus,.fd-calendar__content--dates .fd-calendar__item:focus{z-index:5}.fd-calendar__content--dates .fd-calendar__item.is-active .fd-calendar__text,.fd-calendar__content--dates .fd-calendar__item:active .fd-calendar__text{color:var(--sapContent_Selected_TextColor)}.fd-calendar__content--dates .fd-calendar__item--side-helper .fd-calendar__text{color:var(--sapContent_LabelColor);font-size:var(--sapFontSmallSize)}.fd-calendar__content--dates .fd-calendar__item--other-month .fd-calendar__text{color:var(--sapContent_LabelColor)}.fd-calendar__content--screen-reader-only{clip:rect(0 0 0 0);border:0;height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}.fd-calendar__table{-webkit-box-sizing:border-box;border:0;border-spacing:0;box-sizing:border-box;color:var(--sapTextColor);display:table;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:var(--sapContent_LineHeight);margin:0;padding:0;width:100%}.fd-calendar__table:after,.fd-calendar__table:before{box-sizing:inherit;font-size:inherit}.fd-calendar__group{-webkit-box-sizing:border-box;border:0;box-sizing:border-box;color:var(--sapTextColor);display:table-row-group;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:var(--sapContent_LineHeight);margin:0;padding:0}.fd-calendar__group:after,.fd-calendar__group:before{box-sizing:inherit;font-size:inherit}.fd-calendar__row{-webkit-box-sizing:border-box;border:0;box-sizing:border-box;color:var(--sapTextColor);display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:var(--sapContent_LineHeight);margin:0;padding:0}.fd-calendar__row:after,.fd-calendar__row:before{box-sizing:inherit;font-size:inherit}.fd-calendar .fd-calendar__item{display:inline-block}.fd-calendar .fd-calendar__item--current .fd-calendar__text:before{border:var(--fdCalendar_Item_Current_Border);border-radius:calc(var(--sapElement_BorderCornerRadius) / 2);content:\"\";inset:0;position:absolute;z-index:1}.fd-calendar__special-day--1 .fd-calendar__text:after{-webkit-box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor1);bottom:0;box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor1);content:\"\";height:var(--fdCalendar_Special_Day_Marker_Height);left:0;position:absolute;right:0}.fd-calendar__special-day--1.is-active .fd-calendar__text:after,.fd-calendar__special-day--1:active .fd-calendar__text:after{box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor1),inset 0 -.33rem 0 var(--fdCalendar_Item_Current_Inner_Border_Color);height:calc(var(--fdCalendar_Special_Day_Marker_Height) + .0625rem)}.fd-calendar__special-day--1.fd-calendar__item--current.is-active .fd-calendar__text:after,.fd-calendar__special-day--1.fd-calendar__item--current:active .fd-calendar__text:after{bottom:var(--fdCalendar_Item_Current_Active_Special_Day_Bottom);height:var(--fdCalendar_Item_Current_Active_Special_Day_Height);left:var(--fdCalendar_Item_Current_Active_Special_Day_Left);right:var(--fdCalendar_Item_Current_Active_Special_Day_Right);width:var(--fdCalendar_Item_Current_Active_Special_Day_Width)}.fd-calendar__special-day--2 .fd-calendar__text:after{-webkit-box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor2);bottom:0;box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor2);content:\"\";height:var(--fdCalendar_Special_Day_Marker_Height);left:0;position:absolute;right:0}.fd-calendar__special-day--2.is-active .fd-calendar__text:after,.fd-calendar__special-day--2:active .fd-calendar__text:after{box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor2),inset 0 -.33rem 0 var(--fdCalendar_Item_Current_Inner_Border_Color);height:calc(var(--fdCalendar_Special_Day_Marker_Height) + .0625rem)}.fd-calendar__special-day--2.fd-calendar__item--current.is-active .fd-calendar__text:after,.fd-calendar__special-day--2.fd-calendar__item--current:active .fd-calendar__text:after{bottom:var(--fdCalendar_Item_Current_Active_Special_Day_Bottom);height:var(--fdCalendar_Item_Current_Active_Special_Day_Height);left:var(--fdCalendar_Item_Current_Active_Special_Day_Left);right:var(--fdCalendar_Item_Current_Active_Special_Day_Right);width:var(--fdCalendar_Item_Current_Active_Special_Day_Width)}.fd-calendar__special-day--3 .fd-calendar__text:after{-webkit-box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor3);bottom:0;box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor3);content:\"\";height:var(--fdCalendar_Special_Day_Marker_Height);left:0;position:absolute;right:0}.fd-calendar__special-day--3.is-active .fd-calendar__text:after,.fd-calendar__special-day--3:active .fd-calendar__text:after{box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor3),inset 0 -.33rem 0 var(--fdCalendar_Item_Current_Inner_Border_Color);height:calc(var(--fdCalendar_Special_Day_Marker_Height) + .0625rem)}.fd-calendar__special-day--3.fd-calendar__item--current.is-active .fd-calendar__text:after,.fd-calendar__special-day--3.fd-calendar__item--current:active .fd-calendar__text:after{bottom:var(--fdCalendar_Item_Current_Active_Special_Day_Bottom);height:var(--fdCalendar_Item_Current_Active_Special_Day_Height);left:var(--fdCalendar_Item_Current_Active_Special_Day_Left);right:var(--fdCalendar_Item_Current_Active_Special_Day_Right);width:var(--fdCalendar_Item_Current_Active_Special_Day_Width)}.fd-calendar__special-day--4 .fd-calendar__text:after{-webkit-box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor4);bottom:0;box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor4);content:\"\";height:var(--fdCalendar_Special_Day_Marker_Height);left:0;position:absolute;right:0}.fd-calendar__special-day--4.is-active .fd-calendar__text:after,.fd-calendar__special-day--4:active .fd-calendar__text:after{box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor4),inset 0 -.33rem 0 var(--fdCalendar_Item_Current_Inner_Border_Color);height:calc(var(--fdCalendar_Special_Day_Marker_Height) + .0625rem)}.fd-calendar__special-day--4.fd-calendar__item--current.is-active .fd-calendar__text:after,.fd-calendar__special-day--4.fd-calendar__item--current:active .fd-calendar__text:after{bottom:var(--fdCalendar_Item_Current_Active_Special_Day_Bottom);height:var(--fdCalendar_Item_Current_Active_Special_Day_Height);left:var(--fdCalendar_Item_Current_Active_Special_Day_Left);right:var(--fdCalendar_Item_Current_Active_Special_Day_Right);width:var(--fdCalendar_Item_Current_Active_Special_Day_Width)}.fd-calendar__special-day--5 .fd-calendar__text:after{-webkit-box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor5);bottom:0;box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor5);content:\"\";height:var(--fdCalendar_Special_Day_Marker_Height);left:0;position:absolute;right:0}.fd-calendar__special-day--5.is-active .fd-calendar__text:after,.fd-calendar__special-day--5:active .fd-calendar__text:after{box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor5),inset 0 -.33rem 0 var(--fdCalendar_Item_Current_Inner_Border_Color);height:calc(var(--fdCalendar_Special_Day_Marker_Height) + .0625rem)}.fd-calendar__special-day--5.fd-calendar__item--current.is-active .fd-calendar__text:after,.fd-calendar__special-day--5.fd-calendar__item--current:active .fd-calendar__text:after{bottom:var(--fdCalendar_Item_Current_Active_Special_Day_Bottom);height:var(--fdCalendar_Item_Current_Active_Special_Day_Height);left:var(--fdCalendar_Item_Current_Active_Special_Day_Left);right:var(--fdCalendar_Item_Current_Active_Special_Day_Right);width:var(--fdCalendar_Item_Current_Active_Special_Day_Width)}.fd-calendar__special-day--6 .fd-calendar__text:after{-webkit-box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor6);bottom:0;box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor6);content:\"\";height:var(--fdCalendar_Special_Day_Marker_Height);left:0;position:absolute;right:0}.fd-calendar__special-day--6.is-active .fd-calendar__text:after,.fd-calendar__special-day--6:active .fd-calendar__text:after{box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor6),inset 0 -.33rem 0 var(--fdCalendar_Item_Current_Inner_Border_Color);height:calc(var(--fdCalendar_Special_Day_Marker_Height) + .0625rem)}.fd-calendar__special-day--6.fd-calendar__item--current.is-active .fd-calendar__text:after,.fd-calendar__special-day--6.fd-calendar__item--current:active .fd-calendar__text:after{bottom:var(--fdCalendar_Item_Current_Active_Special_Day_Bottom);height:var(--fdCalendar_Item_Current_Active_Special_Day_Height);left:var(--fdCalendar_Item_Current_Active_Special_Day_Left);right:var(--fdCalendar_Item_Current_Active_Special_Day_Right);width:var(--fdCalendar_Item_Current_Active_Special_Day_Width)}.fd-calendar__special-day--7 .fd-calendar__text:after{-webkit-box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor7);bottom:0;box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor7);content:\"\";height:var(--fdCalendar_Special_Day_Marker_Height);left:0;position:absolute;right:0}.fd-calendar__special-day--7.is-active .fd-calendar__text:after,.fd-calendar__special-day--7:active .fd-calendar__text:after{box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor7),inset 0 -.33rem 0 var(--fdCalendar_Item_Current_Inner_Border_Color);height:calc(var(--fdCalendar_Special_Day_Marker_Height) + .0625rem)}.fd-calendar__special-day--7.fd-calendar__item--current.is-active .fd-calendar__text:after,.fd-calendar__special-day--7.fd-calendar__item--current:active .fd-calendar__text:after{bottom:var(--fdCalendar_Item_Current_Active_Special_Day_Bottom);height:var(--fdCalendar_Item_Current_Active_Special_Day_Height);left:var(--fdCalendar_Item_Current_Active_Special_Day_Left);right:var(--fdCalendar_Item_Current_Active_Special_Day_Right);width:var(--fdCalendar_Item_Current_Active_Special_Day_Width)}.fd-calendar__special-day--8 .fd-calendar__text:after{-webkit-box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor8);bottom:0;box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor8);content:\"\";height:var(--fdCalendar_Special_Day_Marker_Height);left:0;position:absolute;right:0}.fd-calendar__special-day--8.is-active .fd-calendar__text:after,.fd-calendar__special-day--8:active .fd-calendar__text:after{box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor8),inset 0 -.33rem 0 var(--fdCalendar_Item_Current_Inner_Border_Color);height:calc(var(--fdCalendar_Special_Day_Marker_Height) + .0625rem)}.fd-calendar__special-day--8.fd-calendar__item--current.is-active .fd-calendar__text:after,.fd-calendar__special-day--8.fd-calendar__item--current:active .fd-calendar__text:after{bottom:var(--fdCalendar_Item_Current_Active_Special_Day_Bottom);height:var(--fdCalendar_Item_Current_Active_Special_Day_Height);left:var(--fdCalendar_Item_Current_Active_Special_Day_Left);right:var(--fdCalendar_Item_Current_Active_Special_Day_Right);width:var(--fdCalendar_Item_Current_Active_Special_Day_Width)}.fd-calendar__special-day--9 .fd-calendar__text:after{-webkit-box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor9);bottom:0;box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor9);content:\"\";height:var(--fdCalendar_Special_Day_Marker_Height);left:0;position:absolute;right:0}.fd-calendar__special-day--9.is-active .fd-calendar__text:after,.fd-calendar__special-day--9:active .fd-calendar__text:after{box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor9),inset 0 -.33rem 0 var(--fdCalendar_Item_Current_Inner_Border_Color);height:calc(var(--fdCalendar_Special_Day_Marker_Height) + .0625rem)}.fd-calendar__special-day--9.fd-calendar__item--current.is-active .fd-calendar__text:after,.fd-calendar__special-day--9.fd-calendar__item--current:active .fd-calendar__text:after{bottom:var(--fdCalendar_Item_Current_Active_Special_Day_Bottom);height:var(--fdCalendar_Item_Current_Active_Special_Day_Height);left:var(--fdCalendar_Item_Current_Active_Special_Day_Left);right:var(--fdCalendar_Item_Current_Active_Special_Day_Right);width:var(--fdCalendar_Item_Current_Active_Special_Day_Width)}.fd-calendar__special-day--10 .fd-calendar__text:after{-webkit-box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor10);bottom:0;box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor10);content:\"\";height:var(--fdCalendar_Special_Day_Marker_Height);left:0;position:absolute;right:0}.fd-calendar__special-day--10.is-active .fd-calendar__text:after,.fd-calendar__special-day--10:active .fd-calendar__text:after{box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor10),inset 0 -.33rem 0 var(--fdCalendar_Item_Current_Inner_Border_Color);height:calc(var(--fdCalendar_Special_Day_Marker_Height) + .0625rem)}.fd-calendar__special-day--10.fd-calendar__item--current.is-active .fd-calendar__text:after,.fd-calendar__special-day--10.fd-calendar__item--current:active .fd-calendar__text:after{bottom:var(--fdCalendar_Item_Current_Active_Special_Day_Bottom);height:var(--fdCalendar_Item_Current_Active_Special_Day_Height);left:var(--fdCalendar_Item_Current_Active_Special_Day_Left);right:var(--fdCalendar_Item_Current_Active_Special_Day_Right);width:var(--fdCalendar_Item_Current_Active_Special_Day_Width)}.fd-calendar__special-day--11 .fd-calendar__text:after{-webkit-box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor11);bottom:0;box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor11);content:\"\";height:var(--fdCalendar_Special_Day_Marker_Height);left:0;position:absolute;right:0}.fd-calendar__special-day--11.is-active .fd-calendar__text:after,.fd-calendar__special-day--11:active .fd-calendar__text:after{box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor11),inset 0 -.33rem 0 var(--fdCalendar_Item_Current_Inner_Border_Color);height:calc(var(--fdCalendar_Special_Day_Marker_Height) + .0625rem)}.fd-calendar__special-day--11.fd-calendar__item--current.is-active .fd-calendar__text:after,.fd-calendar__special-day--11.fd-calendar__item--current:active .fd-calendar__text:after{bottom:var(--fdCalendar_Item_Current_Active_Special_Day_Bottom);height:var(--fdCalendar_Item_Current_Active_Special_Day_Height);left:var(--fdCalendar_Item_Current_Active_Special_Day_Left);right:var(--fdCalendar_Item_Current_Active_Special_Day_Right);width:var(--fdCalendar_Item_Current_Active_Special_Day_Width)}.fd-calendar__special-day--12 .fd-calendar__text:after{-webkit-box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor12);bottom:0;box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor12);content:\"\";height:var(--fdCalendar_Special_Day_Marker_Height);left:0;position:absolute;right:0}.fd-calendar__special-day--12.is-active .fd-calendar__text:after,.fd-calendar__special-day--12:active .fd-calendar__text:after{box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor12),inset 0 -.33rem 0 var(--fdCalendar_Item_Current_Inner_Border_Color);height:calc(var(--fdCalendar_Special_Day_Marker_Height) + .0625rem)}.fd-calendar__special-day--12.fd-calendar__item--current.is-active .fd-calendar__text:after,.fd-calendar__special-day--12.fd-calendar__item--current:active .fd-calendar__text:after{bottom:var(--fdCalendar_Item_Current_Active_Special_Day_Bottom);height:var(--fdCalendar_Item_Current_Active_Special_Day_Height);left:var(--fdCalendar_Item_Current_Active_Special_Day_Left);right:var(--fdCalendar_Item_Current_Active_Special_Day_Right);width:var(--fdCalendar_Item_Current_Active_Special_Day_Width)}.fd-calendar__special-day--13 .fd-calendar__text:after{-webkit-box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor13);bottom:0;box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor13);content:\"\";height:var(--fdCalendar_Special_Day_Marker_Height);left:0;position:absolute;right:0}.fd-calendar__special-day--13.is-active .fd-calendar__text:after,.fd-calendar__special-day--13:active .fd-calendar__text:after{box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor13),inset 0 -.33rem 0 var(--fdCalendar_Item_Current_Inner_Border_Color);height:calc(var(--fdCalendar_Special_Day_Marker_Height) + .0625rem)}.fd-calendar__special-day--13.fd-calendar__item--current.is-active .fd-calendar__text:after,.fd-calendar__special-day--13.fd-calendar__item--current:active .fd-calendar__text:after{bottom:var(--fdCalendar_Item_Current_Active_Special_Day_Bottom);height:var(--fdCalendar_Item_Current_Active_Special_Day_Height);left:var(--fdCalendar_Item_Current_Active_Special_Day_Left);right:var(--fdCalendar_Item_Current_Active_Special_Day_Right);width:var(--fdCalendar_Item_Current_Active_Special_Day_Width)}.fd-calendar__special-day--14 .fd-calendar__text:after{-webkit-box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor14);bottom:0;box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor14);content:\"\";height:var(--fdCalendar_Special_Day_Marker_Height);left:0;position:absolute;right:0}.fd-calendar__special-day--14.is-active .fd-calendar__text:after,.fd-calendar__special-day--14:active .fd-calendar__text:after{box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor14),inset 0 -.33rem 0 var(--fdCalendar_Item_Current_Inner_Border_Color);height:calc(var(--fdCalendar_Special_Day_Marker_Height) + .0625rem)}.fd-calendar__special-day--14.fd-calendar__item--current.is-active .fd-calendar__text:after,.fd-calendar__special-day--14.fd-calendar__item--current:active .fd-calendar__text:after{bottom:var(--fdCalendar_Item_Current_Active_Special_Day_Bottom);height:var(--fdCalendar_Item_Current_Active_Special_Day_Height);left:var(--fdCalendar_Item_Current_Active_Special_Day_Left);right:var(--fdCalendar_Item_Current_Active_Special_Day_Right);width:var(--fdCalendar_Item_Current_Active_Special_Day_Width)}.fd-calendar__special-day--15 .fd-calendar__text:after{-webkit-box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor15);bottom:0;box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor15);content:\"\";height:var(--fdCalendar_Special_Day_Marker_Height);left:0;position:absolute;right:0}.fd-calendar__special-day--15.is-active .fd-calendar__text:after,.fd-calendar__special-day--15:active .fd-calendar__text:after{box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor15),inset 0 -.33rem 0 var(--fdCalendar_Item_Current_Inner_Border_Color);height:calc(var(--fdCalendar_Special_Day_Marker_Height) + .0625rem)}.fd-calendar__special-day--15.fd-calendar__item--current.is-active .fd-calendar__text:after,.fd-calendar__special-day--15.fd-calendar__item--current:active .fd-calendar__text:after{bottom:var(--fdCalendar_Item_Current_Active_Special_Day_Bottom);height:var(--fdCalendar_Item_Current_Active_Special_Day_Height);left:var(--fdCalendar_Item_Current_Active_Special_Day_Left);right:var(--fdCalendar_Item_Current_Active_Special_Day_Right);width:var(--fdCalendar_Item_Current_Active_Special_Day_Width)}.fd-calendar__special-day--16 .fd-calendar__text:after{-webkit-box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor16);bottom:0;box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor16);content:\"\";height:var(--fdCalendar_Special_Day_Marker_Height);left:0;position:absolute;right:0}.fd-calendar__special-day--16.is-active .fd-calendar__text:after,.fd-calendar__special-day--16:active .fd-calendar__text:after{box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor16),inset 0 -.33rem 0 var(--fdCalendar_Item_Current_Inner_Border_Color);height:calc(var(--fdCalendar_Special_Day_Marker_Height) + .0625rem)}.fd-calendar__special-day--16.fd-calendar__item--current.is-active .fd-calendar__text:after,.fd-calendar__special-day--16.fd-calendar__item--current:active .fd-calendar__text:after{bottom:var(--fdCalendar_Item_Current_Active_Special_Day_Bottom);height:var(--fdCalendar_Item_Current_Active_Special_Day_Height);left:var(--fdCalendar_Item_Current_Active_Special_Day_Left);right:var(--fdCalendar_Item_Current_Active_Special_Day_Right);width:var(--fdCalendar_Item_Current_Active_Special_Day_Width)}.fd-calendar__special-day--17 .fd-calendar__text:after{-webkit-box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor17);bottom:0;box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor17);content:\"\";height:var(--fdCalendar_Special_Day_Marker_Height);left:0;position:absolute;right:0}.fd-calendar__special-day--17.is-active .fd-calendar__text:after,.fd-calendar__special-day--17:active .fd-calendar__text:after{box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor17),inset 0 -.33rem 0 var(--fdCalendar_Item_Current_Inner_Border_Color);height:calc(var(--fdCalendar_Special_Day_Marker_Height) + .0625rem)}.fd-calendar__special-day--17.fd-calendar__item--current.is-active .fd-calendar__text:after,.fd-calendar__special-day--17.fd-calendar__item--current:active .fd-calendar__text:after{bottom:var(--fdCalendar_Item_Current_Active_Special_Day_Bottom);height:var(--fdCalendar_Item_Current_Active_Special_Day_Height);left:var(--fdCalendar_Item_Current_Active_Special_Day_Left);right:var(--fdCalendar_Item_Current_Active_Special_Day_Right);width:var(--fdCalendar_Item_Current_Active_Special_Day_Width)}.fd-calendar__special-day--18 .fd-calendar__text:after{-webkit-box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor18);bottom:0;box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor18);content:\"\";height:var(--fdCalendar_Special_Day_Marker_Height);left:0;position:absolute;right:0}.fd-calendar__special-day--18.is-active .fd-calendar__text:after,.fd-calendar__special-day--18:active .fd-calendar__text:after{box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor18),inset 0 -.33rem 0 var(--fdCalendar_Item_Current_Inner_Border_Color);height:calc(var(--fdCalendar_Special_Day_Marker_Height) + .0625rem)}.fd-calendar__special-day--18.fd-calendar__item--current.is-active .fd-calendar__text:after,.fd-calendar__special-day--18.fd-calendar__item--current:active .fd-calendar__text:after{bottom:var(--fdCalendar_Item_Current_Active_Special_Day_Bottom);height:var(--fdCalendar_Item_Current_Active_Special_Day_Height);left:var(--fdCalendar_Item_Current_Active_Special_Day_Left);right:var(--fdCalendar_Item_Current_Active_Special_Day_Right);width:var(--fdCalendar_Item_Current_Active_Special_Day_Width)}.fd-calendar__special-day--19 .fd-calendar__text:after{-webkit-box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor19);bottom:0;box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor19);content:\"\";height:var(--fdCalendar_Special_Day_Marker_Height);left:0;position:absolute;right:0}.fd-calendar__special-day--19.is-active .fd-calendar__text:after,.fd-calendar__special-day--19:active .fd-calendar__text:after{box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor19),inset 0 -.33rem 0 var(--fdCalendar_Item_Current_Inner_Border_Color);height:calc(var(--fdCalendar_Special_Day_Marker_Height) + .0625rem)}.fd-calendar__special-day--19.fd-calendar__item--current.is-active .fd-calendar__text:after,.fd-calendar__special-day--19.fd-calendar__item--current:active .fd-calendar__text:after{bottom:var(--fdCalendar_Item_Current_Active_Special_Day_Bottom);height:var(--fdCalendar_Item_Current_Active_Special_Day_Height);left:var(--fdCalendar_Item_Current_Active_Special_Day_Left);right:var(--fdCalendar_Item_Current_Active_Special_Day_Right);width:var(--fdCalendar_Item_Current_Active_Special_Day_Width)}.fd-calendar__special-day--20 .fd-calendar__text:after{-webkit-box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor20);bottom:0;box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor20);content:\"\";height:var(--fdCalendar_Special_Day_Marker_Height);left:0;position:absolute;right:0}.fd-calendar__special-day--20.is-active .fd-calendar__text:after,.fd-calendar__special-day--20:active .fd-calendar__text:after{box-shadow:inset 0 calc(var(--fdCalendar_Special_Day_Marker_Height) * -1) 0 var(--sapLegendColor20),inset 0 -.33rem 0 var(--fdCalendar_Item_Current_Inner_Border_Color);height:calc(var(--fdCalendar_Special_Day_Marker_Height) + .0625rem)}.fd-calendar__special-day--20.fd-calendar__item--current.is-active .fd-calendar__text:after,.fd-calendar__special-day--20.fd-calendar__item--current:active .fd-calendar__text:after{bottom:var(--fdCalendar_Item_Current_Active_Special_Day_Bottom);height:var(--fdCalendar_Item_Current_Active_Special_Day_Height);left:var(--fdCalendar_Item_Current_Active_Special_Day_Left);right:var(--fdCalendar_Item_Current_Active_Special_Day_Right);width:var(--fdCalendar_Item_Current_Active_Special_Day_Width)}.fd-calendar .fd-calendar__close-button--navigation{-webkit-transform:translateY(-50%);position:absolute;right:0;top:50%;transform:translateY(-50%)}.fd-calendar .fd-calendar__close-button--navigation[dir=rtl],[dir=rtl] .fd-calendar .fd-calendar__close-button--navigation{left:0;right:auto}.fd-calendar[class*=-compact],.fd-calendar[class*=-condensed],[class*=-compact] .fd-calendar:not([class*=-cozy]),[class*=-condensed] .fd-calendar:not([class*=-cozy]){--fdCalendar_Width:17rem;--fdCalendar_Padding:.5rem;--fdCalendar_Item_Height:1.875rem;--fdCalendar_Button_Horizontal_Space:.1875rem;--fdCalendar_Action_Width:1.875rem;--fdCalendar_Item_Width:1.875rem;--fdCalendar_Item_Inner_Border_Size:calc(100% - .125rem)}.fd-calendar--mobile-landscape,.fd-calendar--mobile-portrait{height:100%;width:100%}.fd-calendar--mobile-landscape{--fdCalendar_Padding:0;--fdCalendar_Item_Side_Helper:1.625rem}.fd-calendar--mobile-landscape .fd-calendar__navigation--main{max-width:20rem}.fd-calendar--mobile-portrait{--fdCalendar_Padding:1rem 0 0 0}.fd-has-display-block{display:block}\n"] }]
|
|
2735
|
-
}], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.ChangeDetectorRef }, { type: i1$1.ContentDensityObserver }, { type: i2.DatetimeAdapter, decorators: [{
|
|
2615
|
+
}], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.ChangeDetectorRef }, { type: i1$1.ContentDensityObserver }, { type: i2$1.DatetimeAdapter, decorators: [{
|
|
2736
2616
|
type: Optional
|
|
2737
2617
|
}] }, { type: undefined, decorators: [{
|
|
2738
2618
|
type: Optional
|
|
@@ -2851,7 +2731,7 @@ CalendarModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version:
|
|
|
2851
2731
|
CalendarYearViewComponent,
|
|
2852
2732
|
CalendarAggregatedYearViewComponent,
|
|
2853
2733
|
CalendarCloseButtonDirective,
|
|
2854
|
-
DeprecatedCalendarContentDensityDirective], imports: [CommonModule, IconModule, ButtonModule, ContentDensityModule], exports: [CalendarComponent,
|
|
2734
|
+
DeprecatedCalendarContentDensityDirective], imports: [CommonModule, IconModule, ButtonModule, ContentDensityModule, I18nModule], exports: [CalendarComponent,
|
|
2855
2735
|
CalendarDayViewComponent,
|
|
2856
2736
|
CalendarHeaderComponent,
|
|
2857
2737
|
CalendarYearViewComponent,
|
|
@@ -2860,7 +2740,7 @@ CalendarModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version:
|
|
|
2860
2740
|
CalendarCloseButtonDirective,
|
|
2861
2741
|
DeprecatedCalendarContentDensityDirective,
|
|
2862
2742
|
ContentDensityModule] });
|
|
2863
|
-
CalendarModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: CalendarModule, imports: [CommonModule, IconModule, ButtonModule, ContentDensityModule, ContentDensityModule] });
|
|
2743
|
+
CalendarModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: CalendarModule, imports: [CommonModule, IconModule, ButtonModule, ContentDensityModule, I18nModule, ContentDensityModule] });
|
|
2864
2744
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: CalendarModule, decorators: [{
|
|
2865
2745
|
type: NgModule,
|
|
2866
2746
|
args: [{
|
|
@@ -2874,7 +2754,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImpor
|
|
|
2874
2754
|
CalendarCloseButtonDirective,
|
|
2875
2755
|
DeprecatedCalendarContentDensityDirective
|
|
2876
2756
|
],
|
|
2877
|
-
imports: [CommonModule, IconModule, ButtonModule, ContentDensityModule],
|
|
2757
|
+
imports: [CommonModule, IconModule, ButtonModule, ContentDensityModule, I18nModule],
|
|
2878
2758
|
exports: [
|
|
2879
2759
|
CalendarComponent,
|
|
2880
2760
|
CalendarDayViewComponent,
|