@ardium-ui/ui 5.0.0-alpha.57 → 5.0.0-alpha.59

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.
Files changed (10) hide show
  1. package/fesm2022/ardium-ui-ui.mjs +107 -61
  2. package/fesm2022/ardium-ui-ui.mjs.map +1 -1
  3. package/lib/calendar/abstract-calendar.d.ts +3 -2
  4. package/lib/calendar/calendar.defaults.d.ts +4 -0
  5. package/lib/calendar/calendar.types.d.ts +3 -1
  6. package/lib/calendar/views/years-view/years-view.component.d.ts +2 -1
  7. package/lib/select/select.types.d.ts +2 -0
  8. package/package.json +1 -1
  9. package/prebuilt-themes/default/calendar.css +1 -1
  10. package/themes/default/calendar.scss +1 -1
package/fesm2022/ardium-ui-ui.mjs CHANGED
@@ -11,7 +11,7 @@ import { resolvePath } from 'resolve-object-path';
11
11
  import { TakeChance } from 'take-chance';
12
12
  import { isEqual } from 'lodash';
13
13
  import * as i1 from '@angular/common';
14
- import { CommonModule, DatePipe, UpperCasePipe, TitleCasePipe, DOCUMENT, DecimalPipe, AsyncPipe } from '@angular/common';
14
+ import { CommonModule, DatePipe, UpperCasePipe, TitleCasePipe, DATE_PIPE_DEFAULT_OPTIONS, DOCUMENT, DecimalPipe, AsyncPipe } from '@angular/common';
15
15
  import { AutofillMonitor, CdkAutofill } from '@angular/cdk/text-field';
16
16
  import { Subject, isObservable, firstValueFrom, merge, takeUntil, startWith, filter, map, BehaviorSubject } from 'rxjs';
17
17
  import { roundToMultiple, roundFromZero, roundToPrecision } from 'more-rounding';
@@ -3933,6 +3933,8 @@ class ArdiumSelectComponent extends _FormFieldComponentBase {
3933
3933
  unselect: () => {
3934
3934
  this.unselectItem(item);
3935
3935
  },
3936
+ itemsSelectedCount: this.itemStorage.selectedItems().length,
3937
+ totalItemsCount: this.itemStorage.items().length,
3936
3938
  }));
3937
3939
  this.groupContextGenerator = computed(() => group => ({
3938
3940
  $implicit: group,
@@ -6175,7 +6177,9 @@ class _AbstractDateInput extends _FormFieldComponentBase {
6175
6177
  this.UTC = input(this._DEFAULTS.UTC, { transform: v => coerceBooleanProperty(v) });
6176
6178
  this._UTCAfterInit = signal(this._DEFAULTS.UTC);
6177
6179
  this.filter = input(this._DEFAULTS.filter);
6178
- this.hideFloatingMonth = input(this._DEFAULTS.hideFloatingMonth, { transform: v => coerceBooleanProperty(v) });
6180
+ this.hideFloatingMonth = input(this._DEFAULTS.hideFloatingMonth, {
6181
+ transform: v => coerceBooleanProperty(v),
6182
+ });
6179
6183
  //! calendar outputs
6180
6184
  this.yearSelect = output();
6181
6185
  this.monthSelect = output();
@@ -6389,6 +6393,12 @@ class DateRange {
6389
6393
  this.to = to;
6390
6394
  }
6391
6395
  }
6396
+ function isDateRange(v) {
6397
+ return !!v && typeof v === 'object' && 'from' in v && isDate(v.from) && 'to' in v && (isNull(v.to) || isDate(v.to));
6398
+ }
6399
+ function isYearRange(v) {
6400
+ return !!v && typeof v === 'object' && 'from' in v && isNumber(v.from) && 'to' in v && isNumber(v.to);
6401
+ }
6392
6402
 
6393
6403
  class ArdCalendarDaysViewHeaderTemplateDirective {
6394
6404
  constructor(template) {
@@ -6677,10 +6687,32 @@ class _AbstractCalendar extends _FormFieldComponentBase {
6677
6687
  return value;
6678
6688
  },
6679
6689
  });
6690
+ this.multipleYearOffset = input(this._DEFAULTS.multipleYearOffset, {
6691
+ transform: v => {
6692
+ const value = coerceNumberProperty(v, this._DEFAULTS.multipleYearOffset);
6693
+ if (!Number.isInteger(value) || value < 0) {
6694
+ console.error(new Error(`ARD-NF${this.componentId}3: [multipleYearOffset] must be a non-negative integer, got "${value}". Using default value instead.`));
6695
+ return this._DEFAULTS.multipleYearOffset;
6696
+ }
6697
+ return value;
6698
+ },
6699
+ });
6700
+ this.multipleYearPageSize = input(this._DEFAULTS.multipleYearPageSize, {
6701
+ transform: v => {
6702
+ const value = coerceNumberProperty(v, this._DEFAULTS.multipleYearPageSize);
6703
+ if (!Number.isInteger(value) || value < 1) {
6704
+ console.error(new Error(`ARD-NF${this.componentId}5: [multipleYearPageSize] must be a positive integer, got "${value}". Using default value instead.`));
6705
+ return this._DEFAULTS.multipleYearPageSize;
6706
+ }
6707
+ return value;
6708
+ },
6709
+ });
6680
6710
  this.multiCalendarLocation = input(this._DEFAULTS.multiCalendarLocation);
6681
6711
  this.autoFocus = input(this._DEFAULTS.autoFocus, { transform: v => coerceBooleanProperty(v) });
6682
- this.staticHeight = input(false, { transform: v => coerceBooleanProperty(v) });
6683
- this.hideFloatingMonth = input(false, { transform: v => coerceBooleanProperty(v) });
6712
+ this.staticHeight = input(this._DEFAULTS.staticHeight, { transform: v => coerceBooleanProperty(v) });
6713
+ this.hideFloatingMonth = input(this._DEFAULTS.hideFloatingMonth, {
6714
+ transform: v => coerceBooleanProperty(v),
6715
+ });
6684
6716
  //! value
6685
6717
  this.selectionStart = signal(null);
6686
6718
  this.selectionEnd = signal(null);
@@ -6710,9 +6742,10 @@ class _AbstractCalendar extends _FormFieldComponentBase {
6710
6742
  this.__highlightedYear = signal(null);
6711
6743
  this.highlightedYear = this.__highlightedYear.asReadonly();
6712
6744
  this.currentYearRangeStart = linkedSignal(() => {
6713
- const rangeStartForCurrentYear = this.TODAY().getFullYear() - (this.TODAY().getFullYear() % 4) - 8; // current year always in 3rd row
6745
+ // align to a multiple of 4 and subtract offset
6746
+ const rangeStartForCurrentYear = this.TODAY().getFullYear() - (this.TODAY().getFullYear() % 4) - this.multipleYearOffset() * 4;
6714
6747
  const activeYear = this.activeYear();
6715
- const offset = roundToMultiple(activeYear - rangeStartForCurrentYear + 1, 24, 'up') - 24; // check how many 24-year pages need to be turned
6748
+ const offset = roundToMultiple(activeYear - rangeStartForCurrentYear + 1, this.multipleYearPageSize(), 'up') - this.multipleYearPageSize(); // check how many n-year pages need to be turned
6716
6749
  return rangeStartForCurrentYear + offset;
6717
6750
  });
6718
6751
  //! internals
@@ -6738,15 +6771,6 @@ class _AbstractCalendar extends _FormFieldComponentBase {
6738
6771
  this.yearDateFormat = input(this._DEFAULTS.yearDateFormat); // 'YYYY'
6739
6772
  this.monthDateFormat = input(this._DEFAULTS.monthDateFormat); // 'MMM'
6740
6773
  this.dayDateFormat = input(this._DEFAULTS.dayDateFormat); // 'D'
6741
- effect(() => {
6742
- const value = this.selectionStart();
6743
- if (isDefined(value)) {
6744
- if (this._isHoursSetInDate(value)) {
6745
- console.warn(`ARD-W${this.componentId}5: <ard-${this.componentName}> value contains time information (HH:MM:SS.ms). This will be ignored and only the date part will be used.`);
6746
- this.selectionStart.set(createDate(value.getFullYear(), value.getMonth(), value.getDate(), this.UTC()));
6747
- }
6748
- }
6749
- });
6750
6774
  }
6751
6775
  onTriggerOpenDaysView() {
6752
6776
  this.activeView.set(ArdCalendarView.Days);
@@ -6760,14 +6784,6 @@ class _AbstractCalendar extends _FormFieldComponentBase {
6760
6784
  _emitChange() {
6761
6785
  this._onChangeRegistered?.(this.value());
6762
6786
  }
6763
- _isHoursSetInDate(date) {
6764
- if (!isDefined(date))
6765
- return false;
6766
- if (this.UTC()) {
6767
- return (date.getUTCHours() !== 0 || date.getUTCMinutes() !== 0 || date.getUTCSeconds() !== 0 || date.getUTCMilliseconds() !== 0);
6768
- }
6769
- return date.getHours() !== 0 || date.getMinutes() !== 0 || date.getSeconds() !== 0 || date.getMilliseconds() !== 0;
6770
- }
6771
6787
  ngOnChanges(changes) {
6772
6788
  if (changes['UTC']) {
6773
6789
  if (changes['UTC'].firstChange) {
@@ -7076,15 +7092,15 @@ class _AbstractCalendar extends _FormFieldComponentBase {
7076
7092
  }
7077
7093
  const newYear = date.getFullYear();
7078
7094
  this.__highlightedYear.update(() => newYear);
7079
- if (newYear < this.currentYearRangeStart() || newYear >= this.currentYearRangeStart() + 24) {
7095
+ if (newYear < this.currentYearRangeStart() || newYear >= this.currentYearRangeStart() + this.multipleYearPageSize()) {
7080
7096
  // round the offset away from zero: 0.1 -> 1, -0.1 -> -1
7081
- // this is to ensure the range start is always shifted by 24 years
7082
- const offset = roundFromZero((newYear - this.currentYearRangeStart()) / 24);
7083
- this.currentYearRangeStart.update(v => v + offset * 24);
7097
+ // this is to ensure the range start is always shifted by n years
7098
+ const offset = roundFromZero((newYear - this.currentYearRangeStart()) / this.multipleYearPageSize());
7099
+ this.currentYearRangeStart.update(v => v + offset * this.multipleYearPageSize());
7084
7100
  }
7085
7101
  }
7086
7102
  changeYearsViewPage(offset) {
7087
- const newYearRangeStart = this.currentYearRangeStart() + offset * 24;
7103
+ const newYearRangeStart = this.currentYearRangeStart() + offset * this.multipleYearPageSize();
7088
7104
  this.currentYearRangeStart.set(newYearRangeStart);
7089
7105
  }
7090
7106
  _highlightMinYear() {
@@ -7111,15 +7127,15 @@ class _AbstractCalendar extends _FormFieldComponentBase {
7111
7127
  this.setHighlightedYear(this.currentYearRangeStart());
7112
7128
  }
7113
7129
  highlightLastYear() {
7114
- this.setHighlightedYear(this.currentYearRangeStart() + 23); // 24 years per page
7130
+ this.setHighlightedYear(this.currentYearRangeStart() + this.multipleYearPageSize() - 1);
7115
7131
  }
7116
7132
  highlightSameYearNextPage(multiple) {
7117
7133
  const year = this.highlightedYear() ?? this.currentYearRangeStart();
7118
- this.setHighlightedYear(year + (multiple ? 60 : 24));
7134
+ this.setHighlightedYear(year + (multiple ? this.multipleYearPageChangeModifier() : 1) * this.multipleYearPageSize());
7119
7135
  }
7120
7136
  highlightSameYearPreviousPage(multiple) {
7121
7137
  const year = this.highlightedYear() ?? this.currentYearRangeStart();
7122
- this.setHighlightedYear(year - (multiple ? 60 : 24));
7138
+ this.setHighlightedYear(year - (multiple ? this.multipleYearPageChangeModifier() : 1) * this.multipleYearPageSize());
7123
7139
  }
7124
7140
  onDocumentMousemove() {
7125
7141
  this._isUsingKeyboard.set(false);
@@ -7128,7 +7144,7 @@ class _AbstractCalendar extends _FormFieldComponentBase {
7128
7144
  this._isUsingKeyboard.set(true);
7129
7145
  }
7130
7146
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: _AbstractCalendar, deps: "invalid", target: i0.ɵɵFactoryTarget.Directive }); }
7131
- static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.2.0", version: "19.2.15", type: _AbstractCalendar, isStandalone: true, inputs: { color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, activeView: { classPropertyName: "activeView", publicName: "activeView", isSignal: true, isRequired: false, transformFunction: null }, activeYear: { classPropertyName: "activeYear", publicName: "activeYear", isSignal: true, isRequired: false, transformFunction: null }, activeMonth: { classPropertyName: "activeMonth", publicName: "activeMonth", isSignal: true, isRequired: false, transformFunction: null }, firstWeekday: { classPropertyName: "firstWeekday", publicName: "firstWeekday", isSignal: true, isRequired: false, transformFunction: null }, multipleYearPageChangeModifier: { classPropertyName: "multipleYearPageChangeModifier", publicName: "multipleYearPageChangeModifier", isSignal: true, isRequired: false, transformFunction: null }, multiCalendarLocation: { classPropertyName: "multiCalendarLocation", publicName: "multiCalendarLocation", isSignal: true, isRequired: false, transformFunction: null }, autoFocus: { classPropertyName: "autoFocus", publicName: "autoFocus", isSignal: true, isRequired: false, transformFunction: null }, staticHeight: { classPropertyName: "staticHeight", publicName: "staticHeight", isSignal: true, isRequired: false, transformFunction: null }, hideFloatingMonth: { classPropertyName: "hideFloatingMonth", publicName: "hideFloatingMonth", isSignal: true, isRequired: false, transformFunction: null }, min: { classPropertyName: "min", publicName: "min", isSignal: true, isRequired: false, transformFunction: null }, max: { classPropertyName: "max", publicName: "max", isSignal: true, isRequired: false, transformFunction: null }, UTC: { classPropertyName: "UTC", publicName: "UTC", isSignal: true, isRequired: false, transformFunction: null }, filter: { classPropertyName: "filter", publicName: "filter", isSignal: true, isRequired: false, transformFunction: null }, highlightedDay: { classPropertyName: "highlightedDay", publicName: "highlightedDay", isSignal: true, isRequired: false, transformFunction: null }, daysViewHeaderDateFormat: { classPropertyName: "daysViewHeaderDateFormat", publicName: "daysViewHeaderDateFormat", isSignal: true, isRequired: false, transformFunction: null }, yearsViewHeaderDateFormat: { classPropertyName: "yearsViewHeaderDateFormat", publicName: "yearsViewHeaderDateFormat", isSignal: true, isRequired: false, transformFunction: null }, monthsViewHeaderDateFormat: { classPropertyName: "monthsViewHeaderDateFormat", publicName: "monthsViewHeaderDateFormat", isSignal: true, isRequired: false, transformFunction: null }, weekdayDateFormat: { classPropertyName: "weekdayDateFormat", publicName: "weekdayDateFormat", isSignal: true, isRequired: false, transformFunction: null }, weekdayTitleDateFormat: { classPropertyName: "weekdayTitleDateFormat", publicName: "weekdayTitleDateFormat", isSignal: true, isRequired: false, transformFunction: null }, floatingMonthDateFormat: { classPropertyName: "floatingMonthDateFormat", publicName: "floatingMonthDateFormat", isSignal: true, isRequired: false, transformFunction: null }, floatingMonthTitleDateFormat: { classPropertyName: "floatingMonthTitleDateFormat", publicName: "floatingMonthTitleDateFormat", isSignal: true, isRequired: false, transformFunction: null }, yearDateFormat: { classPropertyName: "yearDateFormat", publicName: "yearDateFormat", isSignal: true, isRequired: false, transformFunction: null }, monthDateFormat: { classPropertyName: "monthDateFormat", publicName: "monthDateFormat", isSignal: true, isRequired: false, transformFunction: null }, dayDateFormat: { classPropertyName: "dayDateFormat", publicName: "dayDateFormat", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { activeView: "activeViewChange", activeYear: "activeYearChange", activeMonth: "activeMonthChange", activePageChange: "activePageChange", yearSelect: "yearSelect", monthSelect: "monthSelect", highlightedDay: "highlightedDayChange", highlightDayEvent: "highlightDay" }, host: { listeners: { "document:mousemove": "onDocumentMousemove()", "document:keydown": "onDocumentKeydown()" } }, queries: [{ propertyName: "templateRepository", first: true, predicate: _CalendarTemplateRepositoryDirective, descendants: true, isSignal: true }, { propertyName: "yearsViewHeaderTemplate", first: true, predicate: ArdCalendarYearsViewHeaderTemplateDirective, descendants: true, isSignal: true }, { propertyName: "monthsViewHeaderTemplate", first: true, predicate: ArdCalendarMonthsViewHeaderTemplateDirective, descendants: true, isSignal: true }, { propertyName: "daysViewHeaderTemplate", first: true, predicate: ArdCalendarDaysViewHeaderTemplateDirective, descendants: true, isSignal: true }, { propertyName: "floatingMonthTemplate", first: true, predicate: ArdCalendarFloatingMonthTemplateDirective, descendants: true, isSignal: true }, { propertyName: "yearTemplate", first: true, predicate: ArdCalendarYearTemplateDirective, descendants: true, isSignal: true }, { propertyName: "monthTemplate", first: true, predicate: ArdCalendarMonthTemplateDirective, descendants: true, isSignal: true }, { propertyName: "dayTemplate", first: true, predicate: ArdCalendarDayTemplateDirective, descendants: true, isSignal: true }, { propertyName: "weekdayTemplate", first: true, predicate: ArdCalendarWeekdayTemplateDirective, descendants: true, isSignal: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0 }); }
7147
+ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.2.0", version: "19.2.15", type: _AbstractCalendar, isStandalone: true, inputs: { color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, activeView: { classPropertyName: "activeView", publicName: "activeView", isSignal: true, isRequired: false, transformFunction: null }, activeYear: { classPropertyName: "activeYear", publicName: "activeYear", isSignal: true, isRequired: false, transformFunction: null }, activeMonth: { classPropertyName: "activeMonth", publicName: "activeMonth", isSignal: true, isRequired: false, transformFunction: null }, firstWeekday: { classPropertyName: "firstWeekday", publicName: "firstWeekday", isSignal: true, isRequired: false, transformFunction: null }, multipleYearPageChangeModifier: { classPropertyName: "multipleYearPageChangeModifier", publicName: "multipleYearPageChangeModifier", isSignal: true, isRequired: false, transformFunction: null }, multipleYearOffset: { classPropertyName: "multipleYearOffset", publicName: "multipleYearOffset", isSignal: true, isRequired: false, transformFunction: null }, multipleYearPageSize: { classPropertyName: "multipleYearPageSize", publicName: "multipleYearPageSize", isSignal: true, isRequired: false, transformFunction: null }, multiCalendarLocation: { classPropertyName: "multiCalendarLocation", publicName: "multiCalendarLocation", isSignal: true, isRequired: false, transformFunction: null }, autoFocus: { classPropertyName: "autoFocus", publicName: "autoFocus", isSignal: true, isRequired: false, transformFunction: null }, staticHeight: { classPropertyName: "staticHeight", publicName: "staticHeight", isSignal: true, isRequired: false, transformFunction: null }, hideFloatingMonth: { classPropertyName: "hideFloatingMonth", publicName: "hideFloatingMonth", isSignal: true, isRequired: false, transformFunction: null }, min: { classPropertyName: "min", publicName: "min", isSignal: true, isRequired: false, transformFunction: null }, max: { classPropertyName: "max", publicName: "max", isSignal: true, isRequired: false, transformFunction: null }, UTC: { classPropertyName: "UTC", publicName: "UTC", isSignal: true, isRequired: false, transformFunction: null }, filter: { classPropertyName: "filter", publicName: "filter", isSignal: true, isRequired: false, transformFunction: null }, highlightedDay: { classPropertyName: "highlightedDay", publicName: "highlightedDay", isSignal: true, isRequired: false, transformFunction: null }, daysViewHeaderDateFormat: { classPropertyName: "daysViewHeaderDateFormat", publicName: "daysViewHeaderDateFormat", isSignal: true, isRequired: false, transformFunction: null }, yearsViewHeaderDateFormat: { classPropertyName: "yearsViewHeaderDateFormat", publicName: "yearsViewHeaderDateFormat", isSignal: true, isRequired: false, transformFunction: null }, monthsViewHeaderDateFormat: { classPropertyName: "monthsViewHeaderDateFormat", publicName: "monthsViewHeaderDateFormat", isSignal: true, isRequired: false, transformFunction: null }, weekdayDateFormat: { classPropertyName: "weekdayDateFormat", publicName: "weekdayDateFormat", isSignal: true, isRequired: false, transformFunction: null }, weekdayTitleDateFormat: { classPropertyName: "weekdayTitleDateFormat", publicName: "weekdayTitleDateFormat", isSignal: true, isRequired: false, transformFunction: null }, floatingMonthDateFormat: { classPropertyName: "floatingMonthDateFormat", publicName: "floatingMonthDateFormat", isSignal: true, isRequired: false, transformFunction: null }, floatingMonthTitleDateFormat: { classPropertyName: "floatingMonthTitleDateFormat", publicName: "floatingMonthTitleDateFormat", isSignal: true, isRequired: false, transformFunction: null }, yearDateFormat: { classPropertyName: "yearDateFormat", publicName: "yearDateFormat", isSignal: true, isRequired: false, transformFunction: null }, monthDateFormat: { classPropertyName: "monthDateFormat", publicName: "monthDateFormat", isSignal: true, isRequired: false, transformFunction: null }, dayDateFormat: { classPropertyName: "dayDateFormat", publicName: "dayDateFormat", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { activeView: "activeViewChange", activeYear: "activeYearChange", activeMonth: "activeMonthChange", activePageChange: "activePageChange", yearSelect: "yearSelect", monthSelect: "monthSelect", highlightedDay: "highlightedDayChange", highlightDayEvent: "highlightDay" }, host: { listeners: { "document:mousemove": "onDocumentMousemove()", "document:keydown": "onDocumentKeydown()" } }, queries: [{ propertyName: "templateRepository", first: true, predicate: _CalendarTemplateRepositoryDirective, descendants: true, isSignal: true }, { propertyName: "yearsViewHeaderTemplate", first: true, predicate: ArdCalendarYearsViewHeaderTemplateDirective, descendants: true, isSignal: true }, { propertyName: "monthsViewHeaderTemplate", first: true, predicate: ArdCalendarMonthsViewHeaderTemplateDirective, descendants: true, isSignal: true }, { propertyName: "daysViewHeaderTemplate", first: true, predicate: ArdCalendarDaysViewHeaderTemplateDirective, descendants: true, isSignal: true }, { propertyName: "floatingMonthTemplate", first: true, predicate: ArdCalendarFloatingMonthTemplateDirective, descendants: true, isSignal: true }, { propertyName: "yearTemplate", first: true, predicate: ArdCalendarYearTemplateDirective, descendants: true, isSignal: true }, { propertyName: "monthTemplate", first: true, predicate: ArdCalendarMonthTemplateDirective, descendants: true, isSignal: true }, { propertyName: "dayTemplate", first: true, predicate: ArdCalendarDayTemplateDirective, descendants: true, isSignal: true }, { propertyName: "weekdayTemplate", first: true, predicate: ArdCalendarWeekdayTemplateDirective, descendants: true, isSignal: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0 }); }
7132
7148
  }
7133
7149
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: _AbstractCalendar, decorators: [{
7134
7150
  type: Directive,
@@ -7149,6 +7165,10 @@ const _calendarDefaults = {
7149
7165
  activeMonth: new Date().getMonth(),
7150
7166
  firstWeekday: 1,
7151
7167
  multipleYearPageChangeModifier: 5,
7168
+ multipleYearOffset: 2,
7169
+ multipleYearPageSize: 24,
7170
+ staticHeight: false,
7171
+ hideFloatingMonth: false,
7152
7172
  autoFocus: false,
7153
7173
  multiCalendarLocation: ArdMultiCalendarLocation.Only,
7154
7174
  min: null,
@@ -7320,12 +7340,12 @@ class DaysViewComponent {
7320
7340
  this.multiCalendarLocation() === ArdMultiCalendarLocation.Inner,
7321
7341
  year: this.activeYear(),
7322
7342
  month: this.activeMonth(),
7323
- $implicit: new Date(this.activeYear(), this.activeMonth(), 2, 0, 0, 0, 0), // second day of month to prevent timezone issues
7343
+ $implicit: getUTCDate(this.activeYear(), this.activeMonth(), 2), // second day of month to prevent timezone issues
7324
7344
  }));
7325
7345
  this.weekdayContext = computed(() => (dayIndex) => {
7326
7346
  // create a date object for the given day index (0 = Sunday, 1 = Monday, etc.)
7327
7347
  // add 4 because January 4, 1970 is a Sunday
7328
- const date = new Date(1970, 0, 4 + dayIndex);
7348
+ const date = getUTCDate(1970, 0, 4 + dayIndex);
7329
7349
  return {
7330
7350
  dayIndex,
7331
7351
  date,
@@ -7333,7 +7353,7 @@ class DaysViewComponent {
7333
7353
  };
7334
7354
  });
7335
7355
  this.floatingMonthContext = computed(() => {
7336
- const date = new Date(this.activeYear(), this.activeMonth(), 2, 0, 0, 0, 0); // second day of month to prevent timezone issues
7356
+ const date = getUTCDate(this.activeYear(), this.activeMonth(), 2); // second day of month to prevent timezone issues
7337
7357
  return {
7338
7358
  month: this.activeMonth(),
7339
7359
  date,
@@ -7341,7 +7361,7 @@ class DaysViewComponent {
7341
7361
  };
7342
7362
  });
7343
7363
  this.dayContext = computed(() => (day) => {
7344
- const date = new Date(this.activeYear(), this.activeMonth(), day);
7364
+ const date = getUTCDate(this.activeYear(), this.activeMonth(), day);
7345
7365
  return {
7346
7366
  value: day,
7347
7367
  date,
@@ -7638,11 +7658,11 @@ class MonthsViewComponent {
7638
7658
  hidePreviousPageButton: this.multiCalendarLocation() === ArdMultiCalendarLocation.Right ||
7639
7659
  this.multiCalendarLocation() === ArdMultiCalendarLocation.Inner,
7640
7660
  year: this.activeYear(),
7641
- date: new Date(this.activeYear(), 0, 1),
7661
+ date: getUTCDate(this.activeYear(), 0, 2), // second day of month to prevent timezone issues
7642
7662
  $implicit: this.activeYear(),
7643
7663
  }));
7644
7664
  this.monthContext = computed(() => (month) => {
7645
- const date = new Date(this.activeYear(), month, 2); // second day of month to prevent timezone issues
7665
+ const date = getUTCDate(this.activeYear(), month, 2); // second day of month to prevent timezone issues
7646
7666
  return {
7647
7667
  month,
7648
7668
  date,
@@ -7847,11 +7867,11 @@ class MonthsViewComponent {
7847
7867
  return isYearOutOfRange(year, this.min(), this.max());
7848
7868
  }
7849
7869
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: MonthsViewComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
7850
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.15", type: MonthsViewComponent, isStandalone: false, selector: "ard-months-view", inputs: { tabIndex: { classPropertyName: "tabIndex", publicName: "tabIndex", isSignal: true, isRequired: true, transformFunction: null }, readOnly: { classPropertyName: "readOnly", publicName: "readOnly", isSignal: true, isRequired: true, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: true, transformFunction: null }, autoFocus: { classPropertyName: "autoFocus", publicName: "autoFocus", isSignal: true, isRequired: true, transformFunction: null }, _isUsingKeyboard: { classPropertyName: "_isUsingKeyboard", publicName: "_isUsingKeyboard", isSignal: true, isRequired: true, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: true, transformFunction: null }, activeYear: { classPropertyName: "activeYear", publicName: "activeYear", isSignal: true, isRequired: true, transformFunction: null }, activeMonth: { classPropertyName: "activeMonth", publicName: "activeMonth", isSignal: true, isRequired: true, transformFunction: null }, selectedDate: { classPropertyName: "selectedDate", publicName: "selectedDate", isSignal: true, isRequired: true, transformFunction: null }, selectedDateEnd: { classPropertyName: "selectedDateEnd", publicName: "selectedDateEnd", isSignal: true, isRequired: true, transformFunction: null }, rangeSelectionMode: { classPropertyName: "rangeSelectionMode", publicName: "rangeSelectionMode", isSignal: true, isRequired: true, transformFunction: null }, UTC: { classPropertyName: "UTC", publicName: "UTC", isSignal: true, isRequired: true, transformFunction: null }, min: { classPropertyName: "min", publicName: "min", isSignal: true, isRequired: true, transformFunction: null }, max: { classPropertyName: "max", publicName: "max", isSignal: true, isRequired: true, transformFunction: null }, multiCalendarLocation: { classPropertyName: "multiCalendarLocation", publicName: "multiCalendarLocation", isSignal: true, isRequired: true, transformFunction: null }, highlightedMonth: { classPropertyName: "highlightedMonth", publicName: "highlightedMonth", isSignal: true, isRequired: true, transformFunction: null }, monthsViewHeaderTemplate: { classPropertyName: "monthsViewHeaderTemplate", publicName: "monthsViewHeaderTemplate", isSignal: true, isRequired: true, transformFunction: null }, monthTemplate: { classPropertyName: "monthTemplate", publicName: "monthTemplate", isSignal: true, isRequired: true, transformFunction: null }, monthsViewHeaderDateFormat: { classPropertyName: "monthsViewHeaderDateFormat", publicName: "monthsViewHeaderDateFormat", isSignal: true, isRequired: true, transformFunction: null }, monthDateFormat: { classPropertyName: "monthDateFormat", publicName: "monthDateFormat", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { triggerOpenYearsView: "triggerOpenYearsView", triggerOpenDaysView: "triggerOpenDaysView", focusEvent: "focus", blurEvent: "blur", triggerSelectMonth: "triggerSelectMonth", triggeChangeYear: "triggeChangeYear", triggerHighlightMonth: "triggerHighlightMonth", triggerHighlightNextMonth: "triggerHighlightNextMonth", triggerHighlightPreviousMonth: "triggerHighlightPreviousMonth", triggerHighlightFirstMonth: "triggerHighlightFirstMonth", triggerHighlightLastMonth: "triggerHighlightLastMonth", triggerHighlightSameMonthPreviousPage: "triggerHighlightSameMonthPreviousPage", triggerHighlightSameMonthNextPage: "triggerHighlightSameMonthNextPage" }, host: { listeners: { "mousemove": "onMouseMove()" } }, viewQueries: [{ propertyName: "focusableElement", first: true, predicate: ["focusableElement"], descendants: true, isSignal: true }], ngImport: i0, template: "<div class=\"ard-months-view\">\r\n @if (!readOnly()) {\r\n <div class=\"ard-calendar__top-toolbar\">\r\n <ng-template\r\n #defaultMonthsViewHeaderTemplate\r\n let-date=\"date\"\r\n let-nextPage=\"nextPage\"\r\n let-prevPage=\"prevPage\"\r\n let-canGoToNextPage=\"canGoToNextPage\"\r\n let-canGoToPreviousPage=\"canGoToPreviousPage\"\r\n let-hideNextPageButton=\"hideNextPageButton\"\r\n let-hidePreviousPageButton=\"hidePreviousPageButton\"\r\n let-openDaysView=\"openDaysView\"\r\n >\r\n <div class=\"ard-calendar__calendar-header\">\r\n <div>\r\n @if (!hidePreviousPageButton) {\r\n <ard-icon-button\r\n size=\"small\"\r\n appearance=\"transparent\"\r\n color=\"none\"\r\n (click)=\"prevPage()\"\r\n [tabIndex]=\"tabIndex()\"\r\n [disabled]=\"!canGoToPreviousPage\"\r\n >\r\n <ard-icon>chevron_left</ard-icon>\r\n </ard-icon-button>\r\n }\r\n </div>\r\n <ard-button\r\n class=\"ard-calendar__header-button\"\r\n appearance=\"transparent\"\r\n [color]=\"color()\"\r\n [tabIndex]=\"tabIndex()\"\r\n (click)=\"openDaysView()\"\r\n >\r\n {{ date | date : monthsViewHeaderDateFormat() }}\r\n <div class=\"ard-dropdown-arrow\"></div>\r\n </ard-button>\r\n <div>\r\n @if (!hideNextPageButton) {\r\n <ard-icon-button\r\n size=\"small\"\r\n appearance=\"transparent\"\r\n color=\"none\"\r\n (click)=\"nextPage()\"\r\n [tabIndex]=\"tabIndex()\"\r\n [disabled]=\"!canGoToNextPage\"\r\n >\r\n <ard-icon>chevron_right</ard-icon>\r\n </ard-icon-button>\r\n }\r\n </div>\r\n </div>\r\n </ng-template>\r\n\r\n <ng-template\r\n [ngTemplateOutlet]=\"monthsViewHeaderTemplate() || defaultMonthsViewHeaderTemplate\"\r\n [ngTemplateOutletContext]=\"monthsViewHeaderContext()\"\r\n />\r\n </div>\r\n }\r\n <div\r\n #focusableElement\r\n class=\"ard-calendar__simple-grid\"\r\n [tabindex]=\"tabIndex()\"\r\n [ariaLabel]=\"currentAriaLabel()\"\r\n (focus)=\"focusEvent.emit($event)\"\r\n (focus)=\"onMonthGridFocus()\"\r\n (blur)=\"blurEvent.emit($event)\"\r\n (blur)=\"onMonthGridBlur()\"\r\n (click)=\"onMonthGridClick()\"\r\n (keydown)=\"onMainGridKeydown($event)\"\r\n role=\"grid\"\r\n >\r\n @for (month of monthsArray(); track $index) {\r\n <div\r\n class=\"ard-calendar__entry\"\r\n [class.ard-calendar__entry-highlighted]=\"highlightedMonth() === month.value\"\r\n [class.ard-calendar__entry-highlighted-in-range]=\"isMonthBetweenSelectedHighlighted(month.value)\"\r\n [class.ard-calendar__entry-disabled]=\"month.disabled\"\r\n [class.ard-calendar__entry-selected]=\"isMonthSelected(month.value)\"\r\n [class.ard-calendar__entry-selected-start]=\"isMonthSelectedStart(month.value)\"\r\n [class.ard-calendar__entry-selected-end]=\"isMonthSelectedEnd(month.value)\"\r\n [class.ard-calendar__entry-selected-in-range]=\"isMonthBetweenSelectedRange(month.value)\"\r\n [class.ard-calendar-today]=\"isMonthToday(month.value)\"\r\n (click)=\"onCalendarMonthClick(month.value)\"\r\n (mousemove)=\"$event.stopPropagation()\"\r\n (mouseover)=\"onCalendarMonthMouseover(month.value)\"\r\n role=\"gridcell\"\r\n >\r\n <button\r\n type=\"button\"\r\n class=\"ard-calendar__entry-button\"\r\n tabindex=\"-1\"\r\n >\r\n <div class=\"ard-range-overlay\"></div>\r\n <div class=\"ard-focus-overlay\"></div>\r\n <div class=\"ard-button-content\">\r\n <ng-template\r\n #defaultMonthTemplate\r\n let-month\r\n >\r\n {{ month | date : monthDateFormat() : '+0000' | uppercase }}\r\n </ng-template>\r\n <ng-template\r\n [ngTemplateOutlet]=\"monthTemplate() || defaultMonthTemplate\"\r\n [ngTemplateOutletContext]=\"monthContext()(month.value)\"\r\n />\r\n </div>\r\n </button>\r\n </div>\r\n }\r\n </div>\r\n</div>\r\n", styles: [""], dependencies: [{ kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: ArdiumIconButtonComponent, selector: "ard-icon-button", inputs: ["wrapperClasses", "type", "ariaLabel", "color", "lightColoring", "compact", "pointerEventsWhenDisabled"] }, { kind: "component", type: ArdiumIconComponent, selector: "ard-icon", inputs: ["ariaLabel", "icon", "filled", "weight", "grade", "opticalSize"] }, { kind: "component", type: ArdiumButtonComponent, selector: "ard-button", inputs: ["variant", "vertical"], outputs: ["focus", "blur"] }, { kind: "pipe", type: i1.UpperCasePipe, name: "uppercase" }, { kind: "pipe", type: i1.DatePipe, name: "date" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
7870
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.15", type: MonthsViewComponent, isStandalone: false, selector: "ard-months-view", inputs: { tabIndex: { classPropertyName: "tabIndex", publicName: "tabIndex", isSignal: true, isRequired: true, transformFunction: null }, readOnly: { classPropertyName: "readOnly", publicName: "readOnly", isSignal: true, isRequired: true, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: true, transformFunction: null }, autoFocus: { classPropertyName: "autoFocus", publicName: "autoFocus", isSignal: true, isRequired: true, transformFunction: null }, _isUsingKeyboard: { classPropertyName: "_isUsingKeyboard", publicName: "_isUsingKeyboard", isSignal: true, isRequired: true, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: true, transformFunction: null }, activeYear: { classPropertyName: "activeYear", publicName: "activeYear", isSignal: true, isRequired: true, transformFunction: null }, activeMonth: { classPropertyName: "activeMonth", publicName: "activeMonth", isSignal: true, isRequired: true, transformFunction: null }, selectedDate: { classPropertyName: "selectedDate", publicName: "selectedDate", isSignal: true, isRequired: true, transformFunction: null }, selectedDateEnd: { classPropertyName: "selectedDateEnd", publicName: "selectedDateEnd", isSignal: true, isRequired: true, transformFunction: null }, rangeSelectionMode: { classPropertyName: "rangeSelectionMode", publicName: "rangeSelectionMode", isSignal: true, isRequired: true, transformFunction: null }, UTC: { classPropertyName: "UTC", publicName: "UTC", isSignal: true, isRequired: true, transformFunction: null }, min: { classPropertyName: "min", publicName: "min", isSignal: true, isRequired: true, transformFunction: null }, max: { classPropertyName: "max", publicName: "max", isSignal: true, isRequired: true, transformFunction: null }, multiCalendarLocation: { classPropertyName: "multiCalendarLocation", publicName: "multiCalendarLocation", isSignal: true, isRequired: true, transformFunction: null }, highlightedMonth: { classPropertyName: "highlightedMonth", publicName: "highlightedMonth", isSignal: true, isRequired: true, transformFunction: null }, monthsViewHeaderTemplate: { classPropertyName: "monthsViewHeaderTemplate", publicName: "monthsViewHeaderTemplate", isSignal: true, isRequired: true, transformFunction: null }, monthTemplate: { classPropertyName: "monthTemplate", publicName: "monthTemplate", isSignal: true, isRequired: true, transformFunction: null }, monthsViewHeaderDateFormat: { classPropertyName: "monthsViewHeaderDateFormat", publicName: "monthsViewHeaderDateFormat", isSignal: true, isRequired: true, transformFunction: null }, monthDateFormat: { classPropertyName: "monthDateFormat", publicName: "monthDateFormat", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { triggerOpenYearsView: "triggerOpenYearsView", triggerOpenDaysView: "triggerOpenDaysView", focusEvent: "focus", blurEvent: "blur", triggerSelectMonth: "triggerSelectMonth", triggeChangeYear: "triggeChangeYear", triggerHighlightMonth: "triggerHighlightMonth", triggerHighlightNextMonth: "triggerHighlightNextMonth", triggerHighlightPreviousMonth: "triggerHighlightPreviousMonth", triggerHighlightFirstMonth: "triggerHighlightFirstMonth", triggerHighlightLastMonth: "triggerHighlightLastMonth", triggerHighlightSameMonthPreviousPage: "triggerHighlightSameMonthPreviousPage", triggerHighlightSameMonthNextPage: "triggerHighlightSameMonthNextPage" }, host: { listeners: { "mousemove": "onMouseMove()" } }, viewQueries: [{ propertyName: "focusableElement", first: true, predicate: ["focusableElement"], descendants: true, isSignal: true }], ngImport: i0, template: "<div class=\"ard-months-view\">\r\n @if (!readOnly()) {\r\n <div class=\"ard-calendar__top-toolbar\">\r\n <ng-template\r\n #defaultMonthsViewHeaderTemplate\r\n let-date=\"date\"\r\n let-nextPage=\"nextPage\"\r\n let-prevPage=\"prevPage\"\r\n let-canGoToNextPage=\"canGoToNextPage\"\r\n let-canGoToPreviousPage=\"canGoToPreviousPage\"\r\n let-hideNextPageButton=\"hideNextPageButton\"\r\n let-hidePreviousPageButton=\"hidePreviousPageButton\"\r\n let-openDaysView=\"openDaysView\"\r\n >\r\n <div class=\"ard-calendar__calendar-header\">\r\n <div>\r\n @if (!hidePreviousPageButton) {\r\n <ard-icon-button\r\n size=\"small\"\r\n appearance=\"transparent\"\r\n color=\"none\"\r\n (click)=\"prevPage()\"\r\n [tabIndex]=\"tabIndex()\"\r\n [disabled]=\"!canGoToPreviousPage\"\r\n >\r\n <ard-icon>chevron_left</ard-icon>\r\n </ard-icon-button>\r\n }\r\n </div>\r\n <ard-button\r\n class=\"ard-calendar__header-button\"\r\n appearance=\"transparent\"\r\n color=\"none\"\r\n variant=\"pill\"\r\n [color]=\"color()\"\r\n [tabIndex]=\"tabIndex()\"\r\n (click)=\"openDaysView()\"\r\n >\r\n {{ date | date : monthsViewHeaderDateFormat() }}\r\n <div class=\"ard-dropdown-arrow\"></div>\r\n </ard-button>\r\n <div>\r\n @if (!hideNextPageButton) {\r\n <ard-icon-button\r\n size=\"small\"\r\n appearance=\"transparent\"\r\n color=\"none\"\r\n (click)=\"nextPage()\"\r\n [tabIndex]=\"tabIndex()\"\r\n [disabled]=\"!canGoToNextPage\"\r\n >\r\n <ard-icon>chevron_right</ard-icon>\r\n </ard-icon-button>\r\n }\r\n </div>\r\n </div>\r\n </ng-template>\r\n\r\n <ng-template\r\n [ngTemplateOutlet]=\"monthsViewHeaderTemplate() || defaultMonthsViewHeaderTemplate\"\r\n [ngTemplateOutletContext]=\"monthsViewHeaderContext()\"\r\n />\r\n </div>\r\n }\r\n <div\r\n #focusableElement\r\n class=\"ard-calendar__simple-grid\"\r\n [tabindex]=\"tabIndex()\"\r\n [ariaLabel]=\"currentAriaLabel()\"\r\n (focus)=\"focusEvent.emit($event)\"\r\n (focus)=\"onMonthGridFocus()\"\r\n (blur)=\"blurEvent.emit($event)\"\r\n (blur)=\"onMonthGridBlur()\"\r\n (click)=\"onMonthGridClick()\"\r\n (keydown)=\"onMainGridKeydown($event)\"\r\n role=\"grid\"\r\n >\r\n @for (month of monthsArray(); track $index) {\r\n <div\r\n class=\"ard-calendar__entry\"\r\n [class.ard-calendar__entry-highlighted]=\"highlightedMonth() === month.value\"\r\n [class.ard-calendar__entry-highlighted-in-range]=\"isMonthBetweenSelectedHighlighted(month.value)\"\r\n [class.ard-calendar__entry-disabled]=\"month.disabled\"\r\n [class.ard-calendar__entry-selected]=\"isMonthSelected(month.value)\"\r\n [class.ard-calendar__entry-selected-start]=\"isMonthSelectedStart(month.value)\"\r\n [class.ard-calendar__entry-selected-end]=\"isMonthSelectedEnd(month.value)\"\r\n [class.ard-calendar__entry-selected-in-range]=\"isMonthBetweenSelectedRange(month.value)\"\r\n [class.ard-calendar-today]=\"isMonthToday(month.value)\"\r\n (click)=\"onCalendarMonthClick(month.value)\"\r\n (mousemove)=\"$event.stopPropagation()\"\r\n (mouseover)=\"onCalendarMonthMouseover(month.value)\"\r\n role=\"gridcell\"\r\n >\r\n <button\r\n type=\"button\"\r\n class=\"ard-calendar__entry-button\"\r\n tabindex=\"-1\"\r\n >\r\n <div class=\"ard-range-overlay\"></div>\r\n <div class=\"ard-focus-overlay\"></div>\r\n <div class=\"ard-button-content\">\r\n <ng-template\r\n #defaultMonthTemplate\r\n let-month\r\n >\r\n {{ month | date : monthDateFormat() : '+0000' | uppercase }}\r\n </ng-template>\r\n <ng-template\r\n [ngTemplateOutlet]=\"monthTemplate() || defaultMonthTemplate\"\r\n [ngTemplateOutletContext]=\"monthContext()(month.value)\"\r\n />\r\n </div>\r\n </button>\r\n </div>\r\n }\r\n </div>\r\n</div>\r\n", styles: [""], dependencies: [{ kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: ArdiumIconButtonComponent, selector: "ard-icon-button", inputs: ["wrapperClasses", "type", "ariaLabel", "color", "lightColoring", "compact", "pointerEventsWhenDisabled"] }, { kind: "component", type: ArdiumIconComponent, selector: "ard-icon", inputs: ["ariaLabel", "icon", "filled", "weight", "grade", "opticalSize"] }, { kind: "component", type: ArdiumButtonComponent, selector: "ard-button", inputs: ["variant", "vertical"], outputs: ["focus", "blur"] }, { kind: "pipe", type: i1.UpperCasePipe, name: "uppercase" }, { kind: "pipe", type: i1.DatePipe, name: "date" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
7851
7871
  }
7852
7872
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: MonthsViewComponent, decorators: [{
7853
7873
  type: Component,
7854
- args: [{ standalone: false, selector: 'ard-months-view', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"ard-months-view\">\r\n @if (!readOnly()) {\r\n <div class=\"ard-calendar__top-toolbar\">\r\n <ng-template\r\n #defaultMonthsViewHeaderTemplate\r\n let-date=\"date\"\r\n let-nextPage=\"nextPage\"\r\n let-prevPage=\"prevPage\"\r\n let-canGoToNextPage=\"canGoToNextPage\"\r\n let-canGoToPreviousPage=\"canGoToPreviousPage\"\r\n let-hideNextPageButton=\"hideNextPageButton\"\r\n let-hidePreviousPageButton=\"hidePreviousPageButton\"\r\n let-openDaysView=\"openDaysView\"\r\n >\r\n <div class=\"ard-calendar__calendar-header\">\r\n <div>\r\n @if (!hidePreviousPageButton) {\r\n <ard-icon-button\r\n size=\"small\"\r\n appearance=\"transparent\"\r\n color=\"none\"\r\n (click)=\"prevPage()\"\r\n [tabIndex]=\"tabIndex()\"\r\n [disabled]=\"!canGoToPreviousPage\"\r\n >\r\n <ard-icon>chevron_left</ard-icon>\r\n </ard-icon-button>\r\n }\r\n </div>\r\n <ard-button\r\n class=\"ard-calendar__header-button\"\r\n appearance=\"transparent\"\r\n [color]=\"color()\"\r\n [tabIndex]=\"tabIndex()\"\r\n (click)=\"openDaysView()\"\r\n >\r\n {{ date | date : monthsViewHeaderDateFormat() }}\r\n <div class=\"ard-dropdown-arrow\"></div>\r\n </ard-button>\r\n <div>\r\n @if (!hideNextPageButton) {\r\n <ard-icon-button\r\n size=\"small\"\r\n appearance=\"transparent\"\r\n color=\"none\"\r\n (click)=\"nextPage()\"\r\n [tabIndex]=\"tabIndex()\"\r\n [disabled]=\"!canGoToNextPage\"\r\n >\r\n <ard-icon>chevron_right</ard-icon>\r\n </ard-icon-button>\r\n }\r\n </div>\r\n </div>\r\n </ng-template>\r\n\r\n <ng-template\r\n [ngTemplateOutlet]=\"monthsViewHeaderTemplate() || defaultMonthsViewHeaderTemplate\"\r\n [ngTemplateOutletContext]=\"monthsViewHeaderContext()\"\r\n />\r\n </div>\r\n }\r\n <div\r\n #focusableElement\r\n class=\"ard-calendar__simple-grid\"\r\n [tabindex]=\"tabIndex()\"\r\n [ariaLabel]=\"currentAriaLabel()\"\r\n (focus)=\"focusEvent.emit($event)\"\r\n (focus)=\"onMonthGridFocus()\"\r\n (blur)=\"blurEvent.emit($event)\"\r\n (blur)=\"onMonthGridBlur()\"\r\n (click)=\"onMonthGridClick()\"\r\n (keydown)=\"onMainGridKeydown($event)\"\r\n role=\"grid\"\r\n >\r\n @for (month of monthsArray(); track $index) {\r\n <div\r\n class=\"ard-calendar__entry\"\r\n [class.ard-calendar__entry-highlighted]=\"highlightedMonth() === month.value\"\r\n [class.ard-calendar__entry-highlighted-in-range]=\"isMonthBetweenSelectedHighlighted(month.value)\"\r\n [class.ard-calendar__entry-disabled]=\"month.disabled\"\r\n [class.ard-calendar__entry-selected]=\"isMonthSelected(month.value)\"\r\n [class.ard-calendar__entry-selected-start]=\"isMonthSelectedStart(month.value)\"\r\n [class.ard-calendar__entry-selected-end]=\"isMonthSelectedEnd(month.value)\"\r\n [class.ard-calendar__entry-selected-in-range]=\"isMonthBetweenSelectedRange(month.value)\"\r\n [class.ard-calendar-today]=\"isMonthToday(month.value)\"\r\n (click)=\"onCalendarMonthClick(month.value)\"\r\n (mousemove)=\"$event.stopPropagation()\"\r\n (mouseover)=\"onCalendarMonthMouseover(month.value)\"\r\n role=\"gridcell\"\r\n >\r\n <button\r\n type=\"button\"\r\n class=\"ard-calendar__entry-button\"\r\n tabindex=\"-1\"\r\n >\r\n <div class=\"ard-range-overlay\"></div>\r\n <div class=\"ard-focus-overlay\"></div>\r\n <div class=\"ard-button-content\">\r\n <ng-template\r\n #defaultMonthTemplate\r\n let-month\r\n >\r\n {{ month | date : monthDateFormat() : '+0000' | uppercase }}\r\n </ng-template>\r\n <ng-template\r\n [ngTemplateOutlet]=\"monthTemplate() || defaultMonthTemplate\"\r\n [ngTemplateOutletContext]=\"monthContext()(month.value)\"\r\n />\r\n </div>\r\n </button>\r\n </div>\r\n }\r\n </div>\r\n</div>\r\n" }]
7874
+ args: [{ standalone: false, selector: 'ard-months-view', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"ard-months-view\">\r\n @if (!readOnly()) {\r\n <div class=\"ard-calendar__top-toolbar\">\r\n <ng-template\r\n #defaultMonthsViewHeaderTemplate\r\n let-date=\"date\"\r\n let-nextPage=\"nextPage\"\r\n let-prevPage=\"prevPage\"\r\n let-canGoToNextPage=\"canGoToNextPage\"\r\n let-canGoToPreviousPage=\"canGoToPreviousPage\"\r\n let-hideNextPageButton=\"hideNextPageButton\"\r\n let-hidePreviousPageButton=\"hidePreviousPageButton\"\r\n let-openDaysView=\"openDaysView\"\r\n >\r\n <div class=\"ard-calendar__calendar-header\">\r\n <div>\r\n @if (!hidePreviousPageButton) {\r\n <ard-icon-button\r\n size=\"small\"\r\n appearance=\"transparent\"\r\n color=\"none\"\r\n (click)=\"prevPage()\"\r\n [tabIndex]=\"tabIndex()\"\r\n [disabled]=\"!canGoToPreviousPage\"\r\n >\r\n <ard-icon>chevron_left</ard-icon>\r\n </ard-icon-button>\r\n }\r\n </div>\r\n <ard-button\r\n class=\"ard-calendar__header-button\"\r\n appearance=\"transparent\"\r\n color=\"none\"\r\n variant=\"pill\"\r\n [color]=\"color()\"\r\n [tabIndex]=\"tabIndex()\"\r\n (click)=\"openDaysView()\"\r\n >\r\n {{ date | date : monthsViewHeaderDateFormat() }}\r\n <div class=\"ard-dropdown-arrow\"></div>\r\n </ard-button>\r\n <div>\r\n @if (!hideNextPageButton) {\r\n <ard-icon-button\r\n size=\"small\"\r\n appearance=\"transparent\"\r\n color=\"none\"\r\n (click)=\"nextPage()\"\r\n [tabIndex]=\"tabIndex()\"\r\n [disabled]=\"!canGoToNextPage\"\r\n >\r\n <ard-icon>chevron_right</ard-icon>\r\n </ard-icon-button>\r\n }\r\n </div>\r\n </div>\r\n </ng-template>\r\n\r\n <ng-template\r\n [ngTemplateOutlet]=\"monthsViewHeaderTemplate() || defaultMonthsViewHeaderTemplate\"\r\n [ngTemplateOutletContext]=\"monthsViewHeaderContext()\"\r\n />\r\n </div>\r\n }\r\n <div\r\n #focusableElement\r\n class=\"ard-calendar__simple-grid\"\r\n [tabindex]=\"tabIndex()\"\r\n [ariaLabel]=\"currentAriaLabel()\"\r\n (focus)=\"focusEvent.emit($event)\"\r\n (focus)=\"onMonthGridFocus()\"\r\n (blur)=\"blurEvent.emit($event)\"\r\n (blur)=\"onMonthGridBlur()\"\r\n (click)=\"onMonthGridClick()\"\r\n (keydown)=\"onMainGridKeydown($event)\"\r\n role=\"grid\"\r\n >\r\n @for (month of monthsArray(); track $index) {\r\n <div\r\n class=\"ard-calendar__entry\"\r\n [class.ard-calendar__entry-highlighted]=\"highlightedMonth() === month.value\"\r\n [class.ard-calendar__entry-highlighted-in-range]=\"isMonthBetweenSelectedHighlighted(month.value)\"\r\n [class.ard-calendar__entry-disabled]=\"month.disabled\"\r\n [class.ard-calendar__entry-selected]=\"isMonthSelected(month.value)\"\r\n [class.ard-calendar__entry-selected-start]=\"isMonthSelectedStart(month.value)\"\r\n [class.ard-calendar__entry-selected-end]=\"isMonthSelectedEnd(month.value)\"\r\n [class.ard-calendar__entry-selected-in-range]=\"isMonthBetweenSelectedRange(month.value)\"\r\n [class.ard-calendar-today]=\"isMonthToday(month.value)\"\r\n (click)=\"onCalendarMonthClick(month.value)\"\r\n (mousemove)=\"$event.stopPropagation()\"\r\n (mouseover)=\"onCalendarMonthMouseover(month.value)\"\r\n role=\"gridcell\"\r\n >\r\n <button\r\n type=\"button\"\r\n class=\"ard-calendar__entry-button\"\r\n tabindex=\"-1\"\r\n >\r\n <div class=\"ard-range-overlay\"></div>\r\n <div class=\"ard-focus-overlay\"></div>\r\n <div class=\"ard-button-content\">\r\n <ng-template\r\n #defaultMonthTemplate\r\n let-month\r\n >\r\n {{ month | date : monthDateFormat() : '+0000' | uppercase }}\r\n </ng-template>\r\n <ng-template\r\n [ngTemplateOutlet]=\"monthTemplate() || defaultMonthTemplate\"\r\n [ngTemplateOutletContext]=\"monthContext()(month.value)\"\r\n />\r\n </div>\r\n </button>\r\n </div>\r\n }\r\n </div>\r\n</div>\r\n" }]
7855
7875
  }], propDecorators: { onMouseMove: [{
7856
7876
  type: HostListener,
7857
7877
  args: ['mousemove']
@@ -7873,7 +7893,8 @@ class YearsViewComponent {
7873
7893
  this.max = input.required();
7874
7894
  this.multiCalendarLocation = input.required();
7875
7895
  this.currentYearRangeStart = input.required();
7876
- this.yearsArray = computed(() => getCalendarYearsArray(this.currentYearRangeStart(), 24, this.min(), this.max()));
7896
+ this.multipleYearPageSize = input.required();
7897
+ this.yearsArray = computed(() => getCalendarYearsArray(this.currentYearRangeStart(), this.multipleYearPageSize(), this.min(), this.max()));
7877
7898
  this.currentAriaLabel = computed(() => {
7878
7899
  return this.highlightedYear()?.toString() ?? '';
7879
7900
  });
@@ -7911,8 +7932,8 @@ class YearsViewComponent {
7911
7932
  this.yearsViewHeaderContext = computed(() => {
7912
7933
  const yearRangeStart = this.currentYearRangeStart();
7913
7934
  const yearRangeEnd = yearRangeStart + 23;
7914
- const dateRange = new DateRange(new Date(yearRangeStart, 0, 2), // second day of month to prevent timezone issues
7915
- new Date(yearRangeEnd, 0, 2));
7935
+ const dateRange = new DateRange(getUTCDate(yearRangeStart, 0, 2), // second day of month to prevent timezone issues
7936
+ getUTCDate(yearRangeEnd, 0, 2));
7916
7937
  const yearRange = {
7917
7938
  from: yearRangeStart,
7918
7939
  to: yearRangeEnd,
@@ -7943,7 +7964,7 @@ class YearsViewComponent {
7943
7964
  });
7944
7965
  this.yearContext = computed(() => {
7945
7966
  return (year) => {
7946
- const date = new Date(year, 1, 2); // second day of month to prevent timezone issues
7967
+ const date = getUTCDate(year, 1, 2); // second day of month to prevent timezone issues
7947
7968
  return {
7948
7969
  value: year,
7949
7970
  date,
@@ -8145,11 +8166,11 @@ class YearsViewComponent {
8145
8166
  this.triggerHighlightSameYearNextPage.emit(event.altKey);
8146
8167
  }
8147
8168
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: YearsViewComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
8148
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.15", type: YearsViewComponent, isStandalone: false, selector: "ard-years-view", inputs: { tabIndex: { classPropertyName: "tabIndex", publicName: "tabIndex", isSignal: true, isRequired: true, transformFunction: null }, readOnly: { classPropertyName: "readOnly", publicName: "readOnly", isSignal: true, isRequired: true, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: true, transformFunction: null }, autoFocus: { classPropertyName: "autoFocus", publicName: "autoFocus", isSignal: true, isRequired: true, transformFunction: null }, _isUsingKeyboard: { classPropertyName: "_isUsingKeyboard", publicName: "_isUsingKeyboard", isSignal: true, isRequired: true, transformFunction: null }, selectedDate: { classPropertyName: "selectedDate", publicName: "selectedDate", isSignal: true, isRequired: true, transformFunction: null }, selectedDateEnd: { classPropertyName: "selectedDateEnd", publicName: "selectedDateEnd", isSignal: true, isRequired: true, transformFunction: null }, rangeSelectionMode: { classPropertyName: "rangeSelectionMode", publicName: "rangeSelectionMode", isSignal: true, isRequired: true, transformFunction: null }, UTC: { classPropertyName: "UTC", publicName: "UTC", isSignal: true, isRequired: true, transformFunction: null }, min: { classPropertyName: "min", publicName: "min", isSignal: true, isRequired: true, transformFunction: null }, max: { classPropertyName: "max", publicName: "max", isSignal: true, isRequired: true, transformFunction: null }, multiCalendarLocation: { classPropertyName: "multiCalendarLocation", publicName: "multiCalendarLocation", isSignal: true, isRequired: true, transformFunction: null }, currentYearRangeStart: { classPropertyName: "currentYearRangeStart", publicName: "currentYearRangeStart", isSignal: true, isRequired: true, transformFunction: null }, highlightedYear: { classPropertyName: "highlightedYear", publicName: "highlightedYear", isSignal: true, isRequired: true, transformFunction: null }, yearsViewHeaderTemplate: { classPropertyName: "yearsViewHeaderTemplate", publicName: "yearsViewHeaderTemplate", isSignal: true, isRequired: true, transformFunction: null }, yearTemplate: { classPropertyName: "yearTemplate", publicName: "yearTemplate", isSignal: true, isRequired: true, transformFunction: null }, yearsViewHeaderDateFormat: { classPropertyName: "yearsViewHeaderDateFormat", publicName: "yearsViewHeaderDateFormat", isSignal: true, isRequired: true, transformFunction: null }, yearDateFormat: { classPropertyName: "yearDateFormat", publicName: "yearDateFormat", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { triggerOpenMonthsView: "triggerOpenMonthsView", triggerOpenDaysView: "triggerOpenDaysView", focusEvent: "focus", blurEvent: "blur", triggerSelectYear: "triggerSelectYear", triggerChangeYearsViewPage: "triggerChangeYearsViewPage", triggerHighlightYear: "triggerHighlightYear", triggerHighlightNextYear: "triggerHighlightNextYear", triggerHighlightPreviousYear: "triggerHighlightPreviousYear", triggerHighlightFirstYear: "triggerHighlightFirstYear", triggerHighlightLastYear: "triggerHighlightLastYear", triggerHighlightSameYearPreviousPage: "triggerHighlightSameYearPreviousPage", triggerHighlightSameYearNextPage: "triggerHighlightSameYearNextPage" }, host: { listeners: { "mousemove": "onMouseMove()" } }, viewQueries: [{ propertyName: "focusableElement", first: true, predicate: ["focusableElement"], descendants: true, isSignal: true }], ngImport: i0, template: "<div class=\"ard-years-view\">\r\n @if (!readOnly()) {\r\n <div class=\"ard-calendar__top-toolbar\">\r\n <ng-template\r\n #defaultYearsViewHeaderTemplate\r\n let-dateRange=\"dateRange\"\r\n let-nextPage=\"nextPage\"\r\n let-prevPage=\"prevPage\"\r\n let-canGoToNextPage=\"canGoToNextPage\"\r\n let-canGoToPreviousPage=\"canGoToPreviousPage\"\r\n let-hideNextPageButton=\"hideNextPageButton\"\r\n let-hidePreviousPageButton=\"hidePreviousPageButton\"\r\n let-openDaysView=\"openDaysView\"\r\n >\r\n <div class=\"ard-calendar__calendar-header\">\r\n <div>\r\n @if (!hidePreviousPageButton) {\r\n <ard-icon-button\r\n size=\"small\"\r\n appearance=\"transparent\"\r\n color=\"none\"\r\n (click)=\"prevPage()\"\r\n [tabIndex]=\"tabIndex()\"\r\n [disabled]=\"!canGoToPreviousPage\"\r\n >\r\n <ard-icon>chevron_left</ard-icon>\r\n </ard-icon-button>\r\n }\r\n </div>\r\n <ard-button\r\n class=\"ard-calendar__header-button\"\r\n appearance=\"transparent\"\r\n color=\"none\"\r\n [tabIndex]=\"tabIndex()\"\r\n (click)=\"openDaysView()\"\r\n variant=\"pill\"\r\n >\r\n {{ dateRange.from | date : yearsViewHeaderDateFormat() }}\r\n &mdash;\r\n {{ dateRange.to | date : yearsViewHeaderDateFormat() }}\r\n <div class=\"ard-dropdown-arrow\"></div>\r\n </ard-button>\r\n <div>\r\n @if (!hideNextPageButton) {\r\n <ard-icon-button\r\n size=\"small\"\r\n appearance=\"transparent\"\r\n color=\"none\"\r\n (click)=\"nextPage()\"\r\n [tabIndex]=\"tabIndex()\"\r\n [disabled]=\"!canGoToNextPage\"\r\n >\r\n <ard-icon>chevron_right</ard-icon>\r\n </ard-icon-button>\r\n }\r\n </div>\r\n </div>\r\n </ng-template>\r\n\r\n <ng-template\r\n [ngTemplateOutlet]=\"yearsViewHeaderTemplate() || defaultYearsViewHeaderTemplate\"\r\n [ngTemplateOutletContext]=\"yearsViewHeaderContext()\"\r\n />\r\n </div>\r\n }\r\n <div\r\n #focusableElement\r\n class=\"ard-calendar__simple-grid\"\r\n [tabindex]=\"tabIndex()\"\r\n [ariaLabel]=\"currentAriaLabel()\"\r\n (focus)=\"focusEvent.emit($event)\"\r\n (focus)=\"onYearGridFocus()\"\r\n (blur)=\"blurEvent.emit($event)\"\r\n (blur)=\"onYearGridBlur()\"\r\n (click)=\"onYearGridClick()\"\r\n (keydown)=\"onMainGridKeydown($event)\"\r\n role=\"grid\"\r\n >\r\n @for (year of yearsArray(); track year) {\r\n <div\r\n class=\"ard-calendar__entry\"\r\n [class.ard-calendar__entry-highlighted]=\"highlightedYear() === year.value\"\r\n [class.ard-calendar__entry-highlighted-in-range]=\"isYearBetweenSelectedHighlighted(year.value)\"\r\n [class.ard-calendar__entry-disabled]=\"year.disabled\"\r\n [class.ard-calendar__entry-selected]=\"isYearSelected(year.value)\"\r\n [class.ard-calendar__entry-selected-start]=\"isYearSelectedStart(year.value)\"\r\n [class.ard-calendar__entry-selected-end]=\"isYearSelectedEnd(year.value)\"\r\n [class.ard-calendar__entry-selected-in-range]=\"isYearBetweenSelectedRange(year.value)\"\r\n [class.ard-calendar-today]=\"isYearToday(year.value)\"\r\n (click)=\"onCalendarYearClick(year.value)\"\r\n (mousemove)=\"$event.stopPropagation()\"\r\n (mouseover)=\"onCalendarYearMouseover(year.value)\"\r\n role=\"gridcell\"\r\n >\r\n <button\r\n type=\"button\"\r\n class=\"ard-calendar__entry-button\"\r\n tabindex=\"-1\"\r\n aria-hidden=\"true\"\r\n >\r\n <div class=\"ard-range-overlay\"></div>\r\n <div class=\"ard-focus-overlay\"></div>\r\n <div class=\"ard-button-content\">\r\n <ng-template\r\n #defaultYearTemplate\r\n let-year\r\n >\r\n {{ year | date : yearDateFormat() }}\r\n </ng-template>\r\n <ng-template\r\n [ngTemplateOutlet]=\"yearTemplate() || defaultYearTemplate\"\r\n [ngTemplateOutletContext]=\"yearContext()(year.value)\"\r\n />\r\n </div>\r\n </button>\r\n </div>\r\n }\r\n </div>\r\n</div>\r\n", styles: [""], dependencies: [{ kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: ArdiumIconButtonComponent, selector: "ard-icon-button", inputs: ["wrapperClasses", "type", "ariaLabel", "color", "lightColoring", "compact", "pointerEventsWhenDisabled"] }, { kind: "component", type: ArdiumIconComponent, selector: "ard-icon", inputs: ["ariaLabel", "icon", "filled", "weight", "grade", "opticalSize"] }, { kind: "component", type: ArdiumButtonComponent, selector: "ard-button", inputs: ["variant", "vertical"], outputs: ["focus", "blur"] }, { kind: "pipe", type: i1.DatePipe, name: "date" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
8169
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.15", type: YearsViewComponent, isStandalone: false, selector: "ard-years-view", inputs: { tabIndex: { classPropertyName: "tabIndex", publicName: "tabIndex", isSignal: true, isRequired: true, transformFunction: null }, readOnly: { classPropertyName: "readOnly", publicName: "readOnly", isSignal: true, isRequired: true, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: true, transformFunction: null }, autoFocus: { classPropertyName: "autoFocus", publicName: "autoFocus", isSignal: true, isRequired: true, transformFunction: null }, _isUsingKeyboard: { classPropertyName: "_isUsingKeyboard", publicName: "_isUsingKeyboard", isSignal: true, isRequired: true, transformFunction: null }, selectedDate: { classPropertyName: "selectedDate", publicName: "selectedDate", isSignal: true, isRequired: true, transformFunction: null }, selectedDateEnd: { classPropertyName: "selectedDateEnd", publicName: "selectedDateEnd", isSignal: true, isRequired: true, transformFunction: null }, rangeSelectionMode: { classPropertyName: "rangeSelectionMode", publicName: "rangeSelectionMode", isSignal: true, isRequired: true, transformFunction: null }, UTC: { classPropertyName: "UTC", publicName: "UTC", isSignal: true, isRequired: true, transformFunction: null }, min: { classPropertyName: "min", publicName: "min", isSignal: true, isRequired: true, transformFunction: null }, max: { classPropertyName: "max", publicName: "max", isSignal: true, isRequired: true, transformFunction: null }, multiCalendarLocation: { classPropertyName: "multiCalendarLocation", publicName: "multiCalendarLocation", isSignal: true, isRequired: true, transformFunction: null }, currentYearRangeStart: { classPropertyName: "currentYearRangeStart", publicName: "currentYearRangeStart", isSignal: true, isRequired: true, transformFunction: null }, multipleYearPageSize: { classPropertyName: "multipleYearPageSize", publicName: "multipleYearPageSize", isSignal: true, isRequired: true, transformFunction: null }, highlightedYear: { classPropertyName: "highlightedYear", publicName: "highlightedYear", isSignal: true, isRequired: true, transformFunction: null }, yearsViewHeaderTemplate: { classPropertyName: "yearsViewHeaderTemplate", publicName: "yearsViewHeaderTemplate", isSignal: true, isRequired: true, transformFunction: null }, yearTemplate: { classPropertyName: "yearTemplate", publicName: "yearTemplate", isSignal: true, isRequired: true, transformFunction: null }, yearsViewHeaderDateFormat: { classPropertyName: "yearsViewHeaderDateFormat", publicName: "yearsViewHeaderDateFormat", isSignal: true, isRequired: true, transformFunction: null }, yearDateFormat: { classPropertyName: "yearDateFormat", publicName: "yearDateFormat", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { triggerOpenMonthsView: "triggerOpenMonthsView", triggerOpenDaysView: "triggerOpenDaysView", focusEvent: "focus", blurEvent: "blur", triggerSelectYear: "triggerSelectYear", triggerChangeYearsViewPage: "triggerChangeYearsViewPage", triggerHighlightYear: "triggerHighlightYear", triggerHighlightNextYear: "triggerHighlightNextYear", triggerHighlightPreviousYear: "triggerHighlightPreviousYear", triggerHighlightFirstYear: "triggerHighlightFirstYear", triggerHighlightLastYear: "triggerHighlightLastYear", triggerHighlightSameYearPreviousPage: "triggerHighlightSameYearPreviousPage", triggerHighlightSameYearNextPage: "triggerHighlightSameYearNextPage" }, host: { listeners: { "mousemove": "onMouseMove()" } }, viewQueries: [{ propertyName: "focusableElement", first: true, predicate: ["focusableElement"], descendants: true, isSignal: true }], ngImport: i0, template: "<div class=\"ard-years-view\">\r\n @if (!readOnly()) {\r\n <div class=\"ard-calendar__top-toolbar\">\r\n <ng-template\r\n #defaultYearsViewHeaderTemplate\r\n let-dateRange=\"dateRange\"\r\n let-nextPage=\"nextPage\"\r\n let-prevPage=\"prevPage\"\r\n let-canGoToNextPage=\"canGoToNextPage\"\r\n let-canGoToPreviousPage=\"canGoToPreviousPage\"\r\n let-hideNextPageButton=\"hideNextPageButton\"\r\n let-hidePreviousPageButton=\"hidePreviousPageButton\"\r\n let-openDaysView=\"openDaysView\"\r\n >\r\n <div class=\"ard-calendar__calendar-header\">\r\n <div>\r\n @if (!hidePreviousPageButton) {\r\n <ard-icon-button\r\n size=\"small\"\r\n appearance=\"transparent\"\r\n color=\"none\"\r\n (click)=\"prevPage()\"\r\n [tabIndex]=\"tabIndex()\"\r\n [disabled]=\"!canGoToPreviousPage\"\r\n >\r\n <ard-icon>chevron_left</ard-icon>\r\n </ard-icon-button>\r\n }\r\n </div>\r\n <ard-button\r\n class=\"ard-calendar__header-button\"\r\n appearance=\"transparent\"\r\n color=\"none\"\r\n variant=\"pill\"\r\n [tabIndex]=\"tabIndex()\"\r\n (click)=\"openDaysView()\"\r\n >\r\n {{ dateRange.from | date : yearsViewHeaderDateFormat() }}\r\n &mdash;\r\n {{ dateRange.to | date : yearsViewHeaderDateFormat() }}\r\n <div class=\"ard-dropdown-arrow\"></div>\r\n </ard-button>\r\n <div>\r\n @if (!hideNextPageButton) {\r\n <ard-icon-button\r\n size=\"small\"\r\n appearance=\"transparent\"\r\n color=\"none\"\r\n (click)=\"nextPage()\"\r\n [tabIndex]=\"tabIndex()\"\r\n [disabled]=\"!canGoToNextPage\"\r\n >\r\n <ard-icon>chevron_right</ard-icon>\r\n </ard-icon-button>\r\n }\r\n </div>\r\n </div>\r\n </ng-template>\r\n\r\n <ng-template\r\n [ngTemplateOutlet]=\"yearsViewHeaderTemplate() || defaultYearsViewHeaderTemplate\"\r\n [ngTemplateOutletContext]=\"yearsViewHeaderContext()\"\r\n />\r\n </div>\r\n }\r\n <div\r\n #focusableElement\r\n class=\"ard-calendar__simple-grid\"\r\n [tabindex]=\"tabIndex()\"\r\n [ariaLabel]=\"currentAriaLabel()\"\r\n (focus)=\"focusEvent.emit($event)\"\r\n (focus)=\"onYearGridFocus()\"\r\n (blur)=\"blurEvent.emit($event)\"\r\n (blur)=\"onYearGridBlur()\"\r\n (click)=\"onYearGridClick()\"\r\n (keydown)=\"onMainGridKeydown($event)\"\r\n role=\"grid\"\r\n >\r\n @for (year of yearsArray(); track year) {\r\n <div\r\n class=\"ard-calendar__entry\"\r\n [class.ard-calendar__entry-highlighted]=\"highlightedYear() === year.value\"\r\n [class.ard-calendar__entry-highlighted-in-range]=\"isYearBetweenSelectedHighlighted(year.value)\"\r\n [class.ard-calendar__entry-disabled]=\"year.disabled\"\r\n [class.ard-calendar__entry-selected]=\"isYearSelected(year.value)\"\r\n [class.ard-calendar__entry-selected-start]=\"isYearSelectedStart(year.value)\"\r\n [class.ard-calendar__entry-selected-end]=\"isYearSelectedEnd(year.value)\"\r\n [class.ard-calendar__entry-selected-in-range]=\"isYearBetweenSelectedRange(year.value)\"\r\n [class.ard-calendar-today]=\"isYearToday(year.value)\"\r\n (click)=\"onCalendarYearClick(year.value)\"\r\n (mousemove)=\"$event.stopPropagation()\"\r\n (mouseover)=\"onCalendarYearMouseover(year.value)\"\r\n role=\"gridcell\"\r\n >\r\n <button\r\n type=\"button\"\r\n class=\"ard-calendar__entry-button\"\r\n tabindex=\"-1\"\r\n aria-hidden=\"true\"\r\n >\r\n <div class=\"ard-range-overlay\"></div>\r\n <div class=\"ard-focus-overlay\"></div>\r\n <div class=\"ard-button-content\">\r\n <ng-template\r\n #defaultYearTemplate\r\n let-year\r\n >\r\n {{ year | date : yearDateFormat() }}\r\n </ng-template>\r\n <ng-template\r\n [ngTemplateOutlet]=\"yearTemplate() || defaultYearTemplate\"\r\n [ngTemplateOutletContext]=\"yearContext()(year.value)\"\r\n />\r\n </div>\r\n </button>\r\n </div>\r\n }\r\n </div>\r\n</div>\r\n", styles: [""], dependencies: [{ kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: ArdiumIconButtonComponent, selector: "ard-icon-button", inputs: ["wrapperClasses", "type", "ariaLabel", "color", "lightColoring", "compact", "pointerEventsWhenDisabled"] }, { kind: "component", type: ArdiumIconComponent, selector: "ard-icon", inputs: ["ariaLabel", "icon", "filled", "weight", "grade", "opticalSize"] }, { kind: "component", type: ArdiumButtonComponent, selector: "ard-button", inputs: ["variant", "vertical"], outputs: ["focus", "blur"] }, { kind: "pipe", type: i1.DatePipe, name: "date" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
8149
8170
  }
8150
8171
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: YearsViewComponent, decorators: [{
8151
8172
  type: Component,
8152
- args: [{ standalone: false, selector: 'ard-years-view', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"ard-years-view\">\r\n @if (!readOnly()) {\r\n <div class=\"ard-calendar__top-toolbar\">\r\n <ng-template\r\n #defaultYearsViewHeaderTemplate\r\n let-dateRange=\"dateRange\"\r\n let-nextPage=\"nextPage\"\r\n let-prevPage=\"prevPage\"\r\n let-canGoToNextPage=\"canGoToNextPage\"\r\n let-canGoToPreviousPage=\"canGoToPreviousPage\"\r\n let-hideNextPageButton=\"hideNextPageButton\"\r\n let-hidePreviousPageButton=\"hidePreviousPageButton\"\r\n let-openDaysView=\"openDaysView\"\r\n >\r\n <div class=\"ard-calendar__calendar-header\">\r\n <div>\r\n @if (!hidePreviousPageButton) {\r\n <ard-icon-button\r\n size=\"small\"\r\n appearance=\"transparent\"\r\n color=\"none\"\r\n (click)=\"prevPage()\"\r\n [tabIndex]=\"tabIndex()\"\r\n [disabled]=\"!canGoToPreviousPage\"\r\n >\r\n <ard-icon>chevron_left</ard-icon>\r\n </ard-icon-button>\r\n }\r\n </div>\r\n <ard-button\r\n class=\"ard-calendar__header-button\"\r\n appearance=\"transparent\"\r\n color=\"none\"\r\n [tabIndex]=\"tabIndex()\"\r\n (click)=\"openDaysView()\"\r\n variant=\"pill\"\r\n >\r\n {{ dateRange.from | date : yearsViewHeaderDateFormat() }}\r\n &mdash;\r\n {{ dateRange.to | date : yearsViewHeaderDateFormat() }}\r\n <div class=\"ard-dropdown-arrow\"></div>\r\n </ard-button>\r\n <div>\r\n @if (!hideNextPageButton) {\r\n <ard-icon-button\r\n size=\"small\"\r\n appearance=\"transparent\"\r\n color=\"none\"\r\n (click)=\"nextPage()\"\r\n [tabIndex]=\"tabIndex()\"\r\n [disabled]=\"!canGoToNextPage\"\r\n >\r\n <ard-icon>chevron_right</ard-icon>\r\n </ard-icon-button>\r\n }\r\n </div>\r\n </div>\r\n </ng-template>\r\n\r\n <ng-template\r\n [ngTemplateOutlet]=\"yearsViewHeaderTemplate() || defaultYearsViewHeaderTemplate\"\r\n [ngTemplateOutletContext]=\"yearsViewHeaderContext()\"\r\n />\r\n </div>\r\n }\r\n <div\r\n #focusableElement\r\n class=\"ard-calendar__simple-grid\"\r\n [tabindex]=\"tabIndex()\"\r\n [ariaLabel]=\"currentAriaLabel()\"\r\n (focus)=\"focusEvent.emit($event)\"\r\n (focus)=\"onYearGridFocus()\"\r\n (blur)=\"blurEvent.emit($event)\"\r\n (blur)=\"onYearGridBlur()\"\r\n (click)=\"onYearGridClick()\"\r\n (keydown)=\"onMainGridKeydown($event)\"\r\n role=\"grid\"\r\n >\r\n @for (year of yearsArray(); track year) {\r\n <div\r\n class=\"ard-calendar__entry\"\r\n [class.ard-calendar__entry-highlighted]=\"highlightedYear() === year.value\"\r\n [class.ard-calendar__entry-highlighted-in-range]=\"isYearBetweenSelectedHighlighted(year.value)\"\r\n [class.ard-calendar__entry-disabled]=\"year.disabled\"\r\n [class.ard-calendar__entry-selected]=\"isYearSelected(year.value)\"\r\n [class.ard-calendar__entry-selected-start]=\"isYearSelectedStart(year.value)\"\r\n [class.ard-calendar__entry-selected-end]=\"isYearSelectedEnd(year.value)\"\r\n [class.ard-calendar__entry-selected-in-range]=\"isYearBetweenSelectedRange(year.value)\"\r\n [class.ard-calendar-today]=\"isYearToday(year.value)\"\r\n (click)=\"onCalendarYearClick(year.value)\"\r\n (mousemove)=\"$event.stopPropagation()\"\r\n (mouseover)=\"onCalendarYearMouseover(year.value)\"\r\n role=\"gridcell\"\r\n >\r\n <button\r\n type=\"button\"\r\n class=\"ard-calendar__entry-button\"\r\n tabindex=\"-1\"\r\n aria-hidden=\"true\"\r\n >\r\n <div class=\"ard-range-overlay\"></div>\r\n <div class=\"ard-focus-overlay\"></div>\r\n <div class=\"ard-button-content\">\r\n <ng-template\r\n #defaultYearTemplate\r\n let-year\r\n >\r\n {{ year | date : yearDateFormat() }}\r\n </ng-template>\r\n <ng-template\r\n [ngTemplateOutlet]=\"yearTemplate() || defaultYearTemplate\"\r\n [ngTemplateOutletContext]=\"yearContext()(year.value)\"\r\n />\r\n </div>\r\n </button>\r\n </div>\r\n }\r\n </div>\r\n</div>\r\n" }]
8173
+ args: [{ standalone: false, selector: 'ard-years-view', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"ard-years-view\">\r\n @if (!readOnly()) {\r\n <div class=\"ard-calendar__top-toolbar\">\r\n <ng-template\r\n #defaultYearsViewHeaderTemplate\r\n let-dateRange=\"dateRange\"\r\n let-nextPage=\"nextPage\"\r\n let-prevPage=\"prevPage\"\r\n let-canGoToNextPage=\"canGoToNextPage\"\r\n let-canGoToPreviousPage=\"canGoToPreviousPage\"\r\n let-hideNextPageButton=\"hideNextPageButton\"\r\n let-hidePreviousPageButton=\"hidePreviousPageButton\"\r\n let-openDaysView=\"openDaysView\"\r\n >\r\n <div class=\"ard-calendar__calendar-header\">\r\n <div>\r\n @if (!hidePreviousPageButton) {\r\n <ard-icon-button\r\n size=\"small\"\r\n appearance=\"transparent\"\r\n color=\"none\"\r\n (click)=\"prevPage()\"\r\n [tabIndex]=\"tabIndex()\"\r\n [disabled]=\"!canGoToPreviousPage\"\r\n >\r\n <ard-icon>chevron_left</ard-icon>\r\n </ard-icon-button>\r\n }\r\n </div>\r\n <ard-button\r\n class=\"ard-calendar__header-button\"\r\n appearance=\"transparent\"\r\n color=\"none\"\r\n variant=\"pill\"\r\n [tabIndex]=\"tabIndex()\"\r\n (click)=\"openDaysView()\"\r\n >\r\n {{ dateRange.from | date : yearsViewHeaderDateFormat() }}\r\n &mdash;\r\n {{ dateRange.to | date : yearsViewHeaderDateFormat() }}\r\n <div class=\"ard-dropdown-arrow\"></div>\r\n </ard-button>\r\n <div>\r\n @if (!hideNextPageButton) {\r\n <ard-icon-button\r\n size=\"small\"\r\n appearance=\"transparent\"\r\n color=\"none\"\r\n (click)=\"nextPage()\"\r\n [tabIndex]=\"tabIndex()\"\r\n [disabled]=\"!canGoToNextPage\"\r\n >\r\n <ard-icon>chevron_right</ard-icon>\r\n </ard-icon-button>\r\n }\r\n </div>\r\n </div>\r\n </ng-template>\r\n\r\n <ng-template\r\n [ngTemplateOutlet]=\"yearsViewHeaderTemplate() || defaultYearsViewHeaderTemplate\"\r\n [ngTemplateOutletContext]=\"yearsViewHeaderContext()\"\r\n />\r\n </div>\r\n }\r\n <div\r\n #focusableElement\r\n class=\"ard-calendar__simple-grid\"\r\n [tabindex]=\"tabIndex()\"\r\n [ariaLabel]=\"currentAriaLabel()\"\r\n (focus)=\"focusEvent.emit($event)\"\r\n (focus)=\"onYearGridFocus()\"\r\n (blur)=\"blurEvent.emit($event)\"\r\n (blur)=\"onYearGridBlur()\"\r\n (click)=\"onYearGridClick()\"\r\n (keydown)=\"onMainGridKeydown($event)\"\r\n role=\"grid\"\r\n >\r\n @for (year of yearsArray(); track year) {\r\n <div\r\n class=\"ard-calendar__entry\"\r\n [class.ard-calendar__entry-highlighted]=\"highlightedYear() === year.value\"\r\n [class.ard-calendar__entry-highlighted-in-range]=\"isYearBetweenSelectedHighlighted(year.value)\"\r\n [class.ard-calendar__entry-disabled]=\"year.disabled\"\r\n [class.ard-calendar__entry-selected]=\"isYearSelected(year.value)\"\r\n [class.ard-calendar__entry-selected-start]=\"isYearSelectedStart(year.value)\"\r\n [class.ard-calendar__entry-selected-end]=\"isYearSelectedEnd(year.value)\"\r\n [class.ard-calendar__entry-selected-in-range]=\"isYearBetweenSelectedRange(year.value)\"\r\n [class.ard-calendar-today]=\"isYearToday(year.value)\"\r\n (click)=\"onCalendarYearClick(year.value)\"\r\n (mousemove)=\"$event.stopPropagation()\"\r\n (mouseover)=\"onCalendarYearMouseover(year.value)\"\r\n role=\"gridcell\"\r\n >\r\n <button\r\n type=\"button\"\r\n class=\"ard-calendar__entry-button\"\r\n tabindex=\"-1\"\r\n aria-hidden=\"true\"\r\n >\r\n <div class=\"ard-range-overlay\"></div>\r\n <div class=\"ard-focus-overlay\"></div>\r\n <div class=\"ard-button-content\">\r\n <ng-template\r\n #defaultYearTemplate\r\n let-year\r\n >\r\n {{ year | date : yearDateFormat() }}\r\n </ng-template>\r\n <ng-template\r\n [ngTemplateOutlet]=\"yearTemplate() || defaultYearTemplate\"\r\n [ngTemplateOutletContext]=\"yearContext()(year.value)\"\r\n />\r\n </div>\r\n </button>\r\n </div>\r\n }\r\n </div>\r\n</div>\r\n" }]
8153
8174
  }], propDecorators: { onMouseMove: [{
8154
8175
  type: HostListener,
8155
8176
  args: ['mousemove']
@@ -8194,7 +8215,7 @@ class ArdiumCalendarComponent extends _AbstractCalendar {
8194
8215
  provide: ARD_FORM_FIELD_CONTROL,
8195
8216
  useExisting: ArdiumCalendarComponent,
8196
8217
  },
8197
- ], usesInheritance: true, ngImport: i0, template: "<div\r\n class=\"ard-calendar\"\r\n [ngClass]=\"ngClasses()\"\r\n>\r\n @switch (activeView()) { @case ('days') {\r\n <ard-days-view\r\n [tabIndex]=\"tabIndex()\"\r\n [readOnly]=\"readonly()\"\r\n [disabled]=\"disabled()\"\r\n [autoFocus]=\"autoFocus()\"\r\n [_isUsingKeyboard]=\"_isUsingKeyboard()\"\r\n [activeMonth]=\"activeMonth()\"\r\n [activeYear]=\"activeYear()\"\r\n [selectedDate]=\"selectionStart()\"\r\n [selectedDateEnd]=\"endDate()\"\r\n [rangeSelectionMode]=\"isRangeSelector\"\r\n [firstWeekday]=\"firstWeekday()\"\r\n [staticHeight]=\"staticHeight()\"\r\n [highlightedDay]=\"highlightedDay()\"\r\n [UTC]=\"UTC()\"\r\n [min]=\"min()\"\r\n [max]=\"max()\"\r\n [multiCalendarLocation]=\"multiCalendarLocation()\"\r\n [hideFloatingMonth]=\"hideFloatingMonth()\"\r\n [isDayFilteredOut]=\"isDayFilteredOut()\"\r\n [daysViewHeaderTemplate]=\"daysViewHeaderTemplate()?.template ?? templateRepository()?.daysViewHeaderTmp()?.template\"\r\n [floatingMonthTemplate]=\"floatingMonthTemplate()?.template ?? templateRepository()?.floatingMonthTmp()?.template\"\r\n [weekdayTemplate]=\"weekdayTemplate()?.template ?? templateRepository()?.weekdayTmp()?.template\"\r\n [dayTemplate]=\"dayTemplate()?.template ?? templateRepository()?.dayTmp()?.template\"\r\n [daysViewHeaderDateFormat]=\"daysViewHeaderDateFormat()\"\r\n [weekdayDateFormat]=\"weekdayDateFormat()\"\r\n [weekdayTitleDateFormat]=\"weekdayTitleDateFormat()\"\r\n [floatingMonthDateFormat]=\"floatingMonthDateFormat()\"\r\n [floatingMonthTitleDateFormat]=\"floatingMonthTitleDateFormat()\"\r\n [dayDateFormat]=\"dayDateFormat()\"\r\n (focus)=\"onFocus($event)\"\r\n (blur)=\"onBlur($event)\"\r\n (triggerOpenMonthsView)=\"onTriggerOpenMonthsView()\"\r\n (triggerOpenYearsView)=\"onTriggerOpenYearsView()\"\r\n (triggerChangeMonth)=\"changeMonth($event)\"\r\n (triggerChangeYear)=\"changeYear($event)\"\r\n (triggerHighlightDay)=\"setHighlightedDay($event)\"\r\n (triggerHighlightFirstDay)=\"highlightFirstDay()\"\r\n (triggerHighlightLastDay)=\"highlightLastDay()\"\r\n (triggerHighlightNextDay)=\"highlightNextDay($event)\"\r\n (triggerHighlightPreviousDay)=\"highlightPreviousDay($event)\"\r\n (triggerHighlightSameDayNextPage)=\"$event ? highlightSameDayNextYear() : highlightSameDayNextMonth()\"\r\n (triggerHighlightSameDayPreviousPage)=\"$event ? highlightSameDayPreviousYear() : highlightSameDayPreviousMonth()\"\r\n (triggerSelectDay)=\"selectDay($event)\"\r\n />\r\n } @case ('months') {\r\n <ard-months-view\r\n [tabIndex]=\"tabIndex()\"\r\n [readOnly]=\"readonly()\"\r\n [disabled]=\"disabled()\"\r\n [autoFocus]=\"autoFocus()\"\r\n [_isUsingKeyboard]=\"_isUsingKeyboard()\"\r\n [color]=\"color()\"\r\n [activeMonth]=\"activeMonth()\"\r\n [activeYear]=\"activeYear()\"\r\n [selectedDate]=\"selectionStart()\"\r\n [selectedDateEnd]=\"endDate()\"\r\n [rangeSelectionMode]=\"isRangeSelector\"\r\n [UTC]=\"UTC()\"\r\n [min]=\"min()\"\r\n [max]=\"max()\"\r\n [multiCalendarLocation]=\"multiCalendarLocation()\"\r\n [highlightedMonth]=\"highlightedMonth()\"\r\n [monthsViewHeaderTemplate]=\"monthsViewHeaderTemplate()?.template ?? templateRepository()?.monthsViewHeaderTmp()?.template\"\r\n [monthTemplate]=\"monthTemplate()?.template ?? templateRepository()?.monthTmp()?.template\"\r\n [monthsViewHeaderDateFormat]=\"monthsViewHeaderDateFormat()\"\r\n [monthDateFormat]=\"monthDateFormat()\"\r\n (focus)=\"onFocus($event)\"\r\n (blur)=\"onBlur($event)\"\r\n (triggerOpenDaysView)=\"onTriggerOpenDaysView()\"\r\n (triggerOpenYearsView)=\"onTriggerOpenYearsView()\"\r\n (triggeChangeYear)=\"changeYear($event)\"\r\n (triggerSelectMonth)=\"selectMonth($event)\"\r\n (triggerHighlightMonth)=\"setHighlightedMonth($event)\"\r\n (triggerHighlightFirstMonth)=\"highlightFirstMonth()\"\r\n (triggerHighlightLastMonth)=\"highlightLastMonth()\"\r\n (triggerHighlightNextMonth)=\"highlightNextMonth($event)\"\r\n (triggerHighlightPreviousMonth)=\"highlightPreviousMonth($event)\"\r\n (triggerHighlightSameMonthNextPage)=\"highlightSameMonthNextYear($event)\"\r\n (triggerHighlightSameMonthPreviousPage)=\"highlightSameMonthPreviousYear($event)\"\r\n />\r\n } @case ('years') {\r\n <ard-years-view\r\n [tabIndex]=\"tabIndex()\"\r\n [readOnly]=\"readonly()\"\r\n [disabled]=\"disabled()\"\r\n [autoFocus]=\"autoFocus()\"\r\n [_isUsingKeyboard]=\"_isUsingKeyboard()\"\r\n [highlightedYear]=\"highlightedYear()\"\r\n [currentYearRangeStart]=\"currentYearRangeStart()\"\r\n [selectedDate]=\"selectionStart()\"\r\n [selectedDateEnd]=\"endDate()\"\r\n [rangeSelectionMode]=\"isRangeSelector\"\r\n [UTC]=\"UTC()\"\r\n [min]=\"min()\"\r\n [max]=\"max()\"\r\n [multiCalendarLocation]=\"multiCalendarLocation()\"\r\n [yearsViewHeaderTemplate]=\"yearsViewHeaderTemplate()?.template ?? templateRepository()?.yearsViewHeaderTmp()?.template\"\r\n [yearTemplate]=\"yearTemplate()?.template ?? templateRepository()?.yearTmp()?.template\"\r\n [yearsViewHeaderDateFormat]=\"yearsViewHeaderDateFormat()\"\r\n [yearDateFormat]=\"yearDateFormat()\"\r\n (focus)=\"onFocus($event)\"\r\n (blur)=\"onBlur($event)\"\r\n (triggerOpenDaysView)=\"onTriggerOpenDaysView()\"\r\n (triggerOpenMonthsView)=\"onTriggerOpenMonthsView()\"\r\n (triggerSelectYear)=\"selectYear($event)\"\r\n (triggerChangeYearsViewPage)=\"changeYearsViewPage($event)\"\r\n (triggerHighlightYear)=\"setHighlightedYear($event)\"\r\n (triggerHighlightFirstYear)=\"highlightFirstYear()\"\r\n (triggerHighlightLastYear)=\"highlightLastYear()\"\r\n (triggerHighlightNextYear)=\"highlightNextYear($event)\"\r\n (triggerHighlightPreviousYear)=\"highlightPreviousYear($event)\"\r\n (triggerHighlightSameYearNextPage)=\"highlightSameYearNextPage($event)\"\r\n (triggerHighlightSameYearPreviousPage)=\"highlightSameYearPreviousPage($event)\"\r\n />\r\n } }\r\n</div>\r\n", styles: [""], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: DaysViewComponent, selector: "ard-days-view", inputs: ["tabIndex", "readOnly", "disabled", "autoFocus", "_isUsingKeyboard", "activeYear", "activeMonth", "selectedDate", "selectedDateEnd", "rangeSelectionMode", "UTC", "min", "max", "multiCalendarLocation", "isDayFilteredOut", "highlightedDay", "firstWeekday", "staticHeight", "hideFloatingMonth", "daysViewHeaderTemplate", "floatingMonthTemplate", "weekdayTemplate", "dayTemplate", "daysViewHeaderDateFormat", "weekdayDateFormat", "weekdayTitleDateFormat", "floatingMonthDateFormat", "floatingMonthTitleDateFormat", "dayDateFormat"], outputs: ["triggerOpenYearsView", "triggerOpenMonthsView", "triggerSelectDay", "triggerChangeMonth", "triggerChangeYear", "triggerHighlightDay", "triggerHighlightNextDay", "triggerHighlightPreviousDay", "triggerHighlightFirstDay", "triggerHighlightLastDay", "triggerHighlightSameDayPreviousPage", "triggerHighlightSameDayNextPage", "focus", "blur"] }, { kind: "component", type: MonthsViewComponent, selector: "ard-months-view", inputs: ["tabIndex", "readOnly", "disabled", "autoFocus", "_isUsingKeyboard", "color", "activeYear", "activeMonth", "selectedDate", "selectedDateEnd", "rangeSelectionMode", "UTC", "min", "max", "multiCalendarLocation", "highlightedMonth", "monthsViewHeaderTemplate", "monthTemplate", "monthsViewHeaderDateFormat", "monthDateFormat"], outputs: ["triggerOpenYearsView", "triggerOpenDaysView", "focus", "blur", "triggerSelectMonth", "triggeChangeYear", "triggerHighlightMonth", "triggerHighlightNextMonth", "triggerHighlightPreviousMonth", "triggerHighlightFirstMonth", "triggerHighlightLastMonth", "triggerHighlightSameMonthPreviousPage", "triggerHighlightSameMonthNextPage"] }, { kind: "component", type: YearsViewComponent, selector: "ard-years-view", inputs: ["tabIndex", "readOnly", "disabled", "autoFocus", "_isUsingKeyboard", "selectedDate", "selectedDateEnd", "rangeSelectionMode", "UTC", "min", "max", "multiCalendarLocation", "currentYearRangeStart", "highlightedYear", "yearsViewHeaderTemplate", "yearTemplate", "yearsViewHeaderDateFormat", "yearDateFormat"], outputs: ["triggerOpenMonthsView", "triggerOpenDaysView", "focus", "blur", "triggerSelectYear", "triggerChangeYearsViewPage", "triggerHighlightYear", "triggerHighlightNextYear", "triggerHighlightPreviousYear", "triggerHighlightFirstYear", "triggerHighlightLastYear", "triggerHighlightSameYearPreviousPage", "triggerHighlightSameYearNextPage"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
8218
+ ], usesInheritance: true, ngImport: i0, template: "<div\r\n class=\"ard-calendar\"\r\n [ngClass]=\"ngClasses()\"\r\n>\r\n @switch (activeView()) { @case ('days') {\r\n <ard-days-view\r\n [tabIndex]=\"tabIndex()\"\r\n [readOnly]=\"readonly()\"\r\n [disabled]=\"disabled()\"\r\n [autoFocus]=\"autoFocus()\"\r\n [_isUsingKeyboard]=\"_isUsingKeyboard()\"\r\n [activeMonth]=\"activeMonth()\"\r\n [activeYear]=\"activeYear()\"\r\n [selectedDate]=\"selectionStart()\"\r\n [selectedDateEnd]=\"endDate()\"\r\n [rangeSelectionMode]=\"isRangeSelector\"\r\n [firstWeekday]=\"firstWeekday()\"\r\n [staticHeight]=\"staticHeight()\"\r\n [highlightedDay]=\"highlightedDay()\"\r\n [UTC]=\"UTC()\"\r\n [min]=\"min()\"\r\n [max]=\"max()\"\r\n [multiCalendarLocation]=\"multiCalendarLocation()\"\r\n [hideFloatingMonth]=\"hideFloatingMonth()\"\r\n [isDayFilteredOut]=\"isDayFilteredOut()\"\r\n [daysViewHeaderTemplate]=\"daysViewHeaderTemplate()?.template ?? templateRepository()?.daysViewHeaderTmp()?.template\"\r\n [floatingMonthTemplate]=\"floatingMonthTemplate()?.template ?? templateRepository()?.floatingMonthTmp()?.template\"\r\n [weekdayTemplate]=\"weekdayTemplate()?.template ?? templateRepository()?.weekdayTmp()?.template\"\r\n [dayTemplate]=\"dayTemplate()?.template ?? templateRepository()?.dayTmp()?.template\"\r\n [daysViewHeaderDateFormat]=\"daysViewHeaderDateFormat()\"\r\n [weekdayDateFormat]=\"weekdayDateFormat()\"\r\n [weekdayTitleDateFormat]=\"weekdayTitleDateFormat()\"\r\n [floatingMonthDateFormat]=\"floatingMonthDateFormat()\"\r\n [floatingMonthTitleDateFormat]=\"floatingMonthTitleDateFormat()\"\r\n [dayDateFormat]=\"dayDateFormat()\"\r\n (focus)=\"onFocus($event)\"\r\n (blur)=\"onBlur($event)\"\r\n (triggerOpenMonthsView)=\"onTriggerOpenMonthsView()\"\r\n (triggerOpenYearsView)=\"onTriggerOpenYearsView()\"\r\n (triggerChangeMonth)=\"changeMonth($event)\"\r\n (triggerChangeYear)=\"changeYear($event)\"\r\n (triggerHighlightDay)=\"setHighlightedDay($event)\"\r\n (triggerHighlightFirstDay)=\"highlightFirstDay()\"\r\n (triggerHighlightLastDay)=\"highlightLastDay()\"\r\n (triggerHighlightNextDay)=\"highlightNextDay($event)\"\r\n (triggerHighlightPreviousDay)=\"highlightPreviousDay($event)\"\r\n (triggerHighlightSameDayNextPage)=\"$event ? highlightSameDayNextYear() : highlightSameDayNextMonth()\"\r\n (triggerHighlightSameDayPreviousPage)=\"$event ? highlightSameDayPreviousYear() : highlightSameDayPreviousMonth()\"\r\n (triggerSelectDay)=\"selectDay($event)\"\r\n />\r\n } @case ('months') {\r\n <ard-months-view\r\n [tabIndex]=\"tabIndex()\"\r\n [readOnly]=\"readonly()\"\r\n [disabled]=\"disabled()\"\r\n [autoFocus]=\"autoFocus()\"\r\n [_isUsingKeyboard]=\"_isUsingKeyboard()\"\r\n [color]=\"color()\"\r\n [activeMonth]=\"activeMonth()\"\r\n [activeYear]=\"activeYear()\"\r\n [selectedDate]=\"selectionStart()\"\r\n [selectedDateEnd]=\"endDate()\"\r\n [rangeSelectionMode]=\"isRangeSelector\"\r\n [UTC]=\"UTC()\"\r\n [min]=\"min()\"\r\n [max]=\"max()\"\r\n [multiCalendarLocation]=\"multiCalendarLocation()\"\r\n [highlightedMonth]=\"highlightedMonth()\"\r\n [monthsViewHeaderTemplate]=\"monthsViewHeaderTemplate()?.template ?? templateRepository()?.monthsViewHeaderTmp()?.template\"\r\n [monthTemplate]=\"monthTemplate()?.template ?? templateRepository()?.monthTmp()?.template\"\r\n [monthsViewHeaderDateFormat]=\"monthsViewHeaderDateFormat()\"\r\n [monthDateFormat]=\"monthDateFormat()\"\r\n (focus)=\"onFocus($event)\"\r\n (blur)=\"onBlur($event)\"\r\n (triggerOpenDaysView)=\"onTriggerOpenDaysView()\"\r\n (triggerOpenYearsView)=\"onTriggerOpenYearsView()\"\r\n (triggeChangeYear)=\"changeYear($event)\"\r\n (triggerSelectMonth)=\"selectMonth($event)\"\r\n (triggerHighlightMonth)=\"setHighlightedMonth($event)\"\r\n (triggerHighlightFirstMonth)=\"highlightFirstMonth()\"\r\n (triggerHighlightLastMonth)=\"highlightLastMonth()\"\r\n (triggerHighlightNextMonth)=\"highlightNextMonth($event)\"\r\n (triggerHighlightPreviousMonth)=\"highlightPreviousMonth($event)\"\r\n (triggerHighlightSameMonthNextPage)=\"highlightSameMonthNextYear($event)\"\r\n (triggerHighlightSameMonthPreviousPage)=\"highlightSameMonthPreviousYear($event)\"\r\n />\r\n } @case ('years') {\r\n <ard-years-view\r\n [tabIndex]=\"tabIndex()\"\r\n [readOnly]=\"readonly()\"\r\n [disabled]=\"disabled()\"\r\n [autoFocus]=\"autoFocus()\"\r\n [_isUsingKeyboard]=\"_isUsingKeyboard()\"\r\n [highlightedYear]=\"highlightedYear()\"\r\n [currentYearRangeStart]=\"currentYearRangeStart()\"\r\n [multipleYearPageSize]=\"multipleYearPageSize()\"\r\n [selectedDate]=\"selectionStart()\"\r\n [selectedDateEnd]=\"endDate()\"\r\n [rangeSelectionMode]=\"isRangeSelector\"\r\n [UTC]=\"UTC()\"\r\n [min]=\"min()\"\r\n [max]=\"max()\"\r\n [multiCalendarLocation]=\"multiCalendarLocation()\"\r\n [yearsViewHeaderTemplate]=\"yearsViewHeaderTemplate()?.template ?? templateRepository()?.yearsViewHeaderTmp()?.template\"\r\n [yearTemplate]=\"yearTemplate()?.template ?? templateRepository()?.yearTmp()?.template\"\r\n [yearsViewHeaderDateFormat]=\"yearsViewHeaderDateFormat()\"\r\n [yearDateFormat]=\"yearDateFormat()\"\r\n (focus)=\"onFocus($event)\"\r\n (blur)=\"onBlur($event)\"\r\n (triggerOpenDaysView)=\"onTriggerOpenDaysView()\"\r\n (triggerOpenMonthsView)=\"onTriggerOpenMonthsView()\"\r\n (triggerSelectYear)=\"selectYear($event)\"\r\n (triggerChangeYearsViewPage)=\"changeYearsViewPage($event)\"\r\n (triggerHighlightYear)=\"setHighlightedYear($event)\"\r\n (triggerHighlightFirstYear)=\"highlightFirstYear()\"\r\n (triggerHighlightLastYear)=\"highlightLastYear()\"\r\n (triggerHighlightNextYear)=\"highlightNextYear($event)\"\r\n (triggerHighlightPreviousYear)=\"highlightPreviousYear($event)\"\r\n (triggerHighlightSameYearNextPage)=\"highlightSameYearNextPage($event)\"\r\n (triggerHighlightSameYearPreviousPage)=\"highlightSameYearPreviousPage($event)\"\r\n />\r\n } }\r\n</div>\r\n", styles: [""], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: DaysViewComponent, selector: "ard-days-view", inputs: ["tabIndex", "readOnly", "disabled", "autoFocus", "_isUsingKeyboard", "activeYear", "activeMonth", "selectedDate", "selectedDateEnd", "rangeSelectionMode", "UTC", "min", "max", "multiCalendarLocation", "isDayFilteredOut", "highlightedDay", "firstWeekday", "staticHeight", "hideFloatingMonth", "daysViewHeaderTemplate", "floatingMonthTemplate", "weekdayTemplate", "dayTemplate", "daysViewHeaderDateFormat", "weekdayDateFormat", "weekdayTitleDateFormat", "floatingMonthDateFormat", "floatingMonthTitleDateFormat", "dayDateFormat"], outputs: ["triggerOpenYearsView", "triggerOpenMonthsView", "triggerSelectDay", "triggerChangeMonth", "triggerChangeYear", "triggerHighlightDay", "triggerHighlightNextDay", "triggerHighlightPreviousDay", "triggerHighlightFirstDay", "triggerHighlightLastDay", "triggerHighlightSameDayPreviousPage", "triggerHighlightSameDayNextPage", "focus", "blur"] }, { kind: "component", type: MonthsViewComponent, selector: "ard-months-view", inputs: ["tabIndex", "readOnly", "disabled", "autoFocus", "_isUsingKeyboard", "color", "activeYear", "activeMonth", "selectedDate", "selectedDateEnd", "rangeSelectionMode", "UTC", "min", "max", "multiCalendarLocation", "highlightedMonth", "monthsViewHeaderTemplate", "monthTemplate", "monthsViewHeaderDateFormat", "monthDateFormat"], outputs: ["triggerOpenYearsView", "triggerOpenDaysView", "focus", "blur", "triggerSelectMonth", "triggeChangeYear", "triggerHighlightMonth", "triggerHighlightNextMonth", "triggerHighlightPreviousMonth", "triggerHighlightFirstMonth", "triggerHighlightLastMonth", "triggerHighlightSameMonthPreviousPage", "triggerHighlightSameMonthNextPage"] }, { kind: "component", type: YearsViewComponent, selector: "ard-years-view", inputs: ["tabIndex", "readOnly", "disabled", "autoFocus", "_isUsingKeyboard", "selectedDate", "selectedDateEnd", "rangeSelectionMode", "UTC", "min", "max", "multiCalendarLocation", "currentYearRangeStart", "multipleYearPageSize", "highlightedYear", "yearsViewHeaderTemplate", "yearTemplate", "yearsViewHeaderDateFormat", "yearDateFormat"], outputs: ["triggerOpenMonthsView", "triggerOpenDaysView", "focus", "blur", "triggerSelectYear", "triggerChangeYearsViewPage", "triggerHighlightYear", "triggerHighlightNextYear", "triggerHighlightPreviousYear", "triggerHighlightFirstYear", "triggerHighlightLastYear", "triggerHighlightSameYearPreviousPage", "triggerHighlightSameYearNextPage"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
8198
8219
  }
8199
8220
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: ArdiumCalendarComponent, decorators: [{
8200
8221
  type: Component,
@@ -8208,7 +8229,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImpo
8208
8229
  provide: ARD_FORM_FIELD_CONTROL,
8209
8230
  useExisting: ArdiumCalendarComponent,
8210
8231
  },
8211
- ], template: "<div\r\n class=\"ard-calendar\"\r\n [ngClass]=\"ngClasses()\"\r\n>\r\n @switch (activeView()) { @case ('days') {\r\n <ard-days-view\r\n [tabIndex]=\"tabIndex()\"\r\n [readOnly]=\"readonly()\"\r\n [disabled]=\"disabled()\"\r\n [autoFocus]=\"autoFocus()\"\r\n [_isUsingKeyboard]=\"_isUsingKeyboard()\"\r\n [activeMonth]=\"activeMonth()\"\r\n [activeYear]=\"activeYear()\"\r\n [selectedDate]=\"selectionStart()\"\r\n [selectedDateEnd]=\"endDate()\"\r\n [rangeSelectionMode]=\"isRangeSelector\"\r\n [firstWeekday]=\"firstWeekday()\"\r\n [staticHeight]=\"staticHeight()\"\r\n [highlightedDay]=\"highlightedDay()\"\r\n [UTC]=\"UTC()\"\r\n [min]=\"min()\"\r\n [max]=\"max()\"\r\n [multiCalendarLocation]=\"multiCalendarLocation()\"\r\n [hideFloatingMonth]=\"hideFloatingMonth()\"\r\n [isDayFilteredOut]=\"isDayFilteredOut()\"\r\n [daysViewHeaderTemplate]=\"daysViewHeaderTemplate()?.template ?? templateRepository()?.daysViewHeaderTmp()?.template\"\r\n [floatingMonthTemplate]=\"floatingMonthTemplate()?.template ?? templateRepository()?.floatingMonthTmp()?.template\"\r\n [weekdayTemplate]=\"weekdayTemplate()?.template ?? templateRepository()?.weekdayTmp()?.template\"\r\n [dayTemplate]=\"dayTemplate()?.template ?? templateRepository()?.dayTmp()?.template\"\r\n [daysViewHeaderDateFormat]=\"daysViewHeaderDateFormat()\"\r\n [weekdayDateFormat]=\"weekdayDateFormat()\"\r\n [weekdayTitleDateFormat]=\"weekdayTitleDateFormat()\"\r\n [floatingMonthDateFormat]=\"floatingMonthDateFormat()\"\r\n [floatingMonthTitleDateFormat]=\"floatingMonthTitleDateFormat()\"\r\n [dayDateFormat]=\"dayDateFormat()\"\r\n (focus)=\"onFocus($event)\"\r\n (blur)=\"onBlur($event)\"\r\n (triggerOpenMonthsView)=\"onTriggerOpenMonthsView()\"\r\n (triggerOpenYearsView)=\"onTriggerOpenYearsView()\"\r\n (triggerChangeMonth)=\"changeMonth($event)\"\r\n (triggerChangeYear)=\"changeYear($event)\"\r\n (triggerHighlightDay)=\"setHighlightedDay($event)\"\r\n (triggerHighlightFirstDay)=\"highlightFirstDay()\"\r\n (triggerHighlightLastDay)=\"highlightLastDay()\"\r\n (triggerHighlightNextDay)=\"highlightNextDay($event)\"\r\n (triggerHighlightPreviousDay)=\"highlightPreviousDay($event)\"\r\n (triggerHighlightSameDayNextPage)=\"$event ? highlightSameDayNextYear() : highlightSameDayNextMonth()\"\r\n (triggerHighlightSameDayPreviousPage)=\"$event ? highlightSameDayPreviousYear() : highlightSameDayPreviousMonth()\"\r\n (triggerSelectDay)=\"selectDay($event)\"\r\n />\r\n } @case ('months') {\r\n <ard-months-view\r\n [tabIndex]=\"tabIndex()\"\r\n [readOnly]=\"readonly()\"\r\n [disabled]=\"disabled()\"\r\n [autoFocus]=\"autoFocus()\"\r\n [_isUsingKeyboard]=\"_isUsingKeyboard()\"\r\n [color]=\"color()\"\r\n [activeMonth]=\"activeMonth()\"\r\n [activeYear]=\"activeYear()\"\r\n [selectedDate]=\"selectionStart()\"\r\n [selectedDateEnd]=\"endDate()\"\r\n [rangeSelectionMode]=\"isRangeSelector\"\r\n [UTC]=\"UTC()\"\r\n [min]=\"min()\"\r\n [max]=\"max()\"\r\n [multiCalendarLocation]=\"multiCalendarLocation()\"\r\n [highlightedMonth]=\"highlightedMonth()\"\r\n [monthsViewHeaderTemplate]=\"monthsViewHeaderTemplate()?.template ?? templateRepository()?.monthsViewHeaderTmp()?.template\"\r\n [monthTemplate]=\"monthTemplate()?.template ?? templateRepository()?.monthTmp()?.template\"\r\n [monthsViewHeaderDateFormat]=\"monthsViewHeaderDateFormat()\"\r\n [monthDateFormat]=\"monthDateFormat()\"\r\n (focus)=\"onFocus($event)\"\r\n (blur)=\"onBlur($event)\"\r\n (triggerOpenDaysView)=\"onTriggerOpenDaysView()\"\r\n (triggerOpenYearsView)=\"onTriggerOpenYearsView()\"\r\n (triggeChangeYear)=\"changeYear($event)\"\r\n (triggerSelectMonth)=\"selectMonth($event)\"\r\n (triggerHighlightMonth)=\"setHighlightedMonth($event)\"\r\n (triggerHighlightFirstMonth)=\"highlightFirstMonth()\"\r\n (triggerHighlightLastMonth)=\"highlightLastMonth()\"\r\n (triggerHighlightNextMonth)=\"highlightNextMonth($event)\"\r\n (triggerHighlightPreviousMonth)=\"highlightPreviousMonth($event)\"\r\n (triggerHighlightSameMonthNextPage)=\"highlightSameMonthNextYear($event)\"\r\n (triggerHighlightSameMonthPreviousPage)=\"highlightSameMonthPreviousYear($event)\"\r\n />\r\n } @case ('years') {\r\n <ard-years-view\r\n [tabIndex]=\"tabIndex()\"\r\n [readOnly]=\"readonly()\"\r\n [disabled]=\"disabled()\"\r\n [autoFocus]=\"autoFocus()\"\r\n [_isUsingKeyboard]=\"_isUsingKeyboard()\"\r\n [highlightedYear]=\"highlightedYear()\"\r\n [currentYearRangeStart]=\"currentYearRangeStart()\"\r\n [selectedDate]=\"selectionStart()\"\r\n [selectedDateEnd]=\"endDate()\"\r\n [rangeSelectionMode]=\"isRangeSelector\"\r\n [UTC]=\"UTC()\"\r\n [min]=\"min()\"\r\n [max]=\"max()\"\r\n [multiCalendarLocation]=\"multiCalendarLocation()\"\r\n [yearsViewHeaderTemplate]=\"yearsViewHeaderTemplate()?.template ?? templateRepository()?.yearsViewHeaderTmp()?.template\"\r\n [yearTemplate]=\"yearTemplate()?.template ?? templateRepository()?.yearTmp()?.template\"\r\n [yearsViewHeaderDateFormat]=\"yearsViewHeaderDateFormat()\"\r\n [yearDateFormat]=\"yearDateFormat()\"\r\n (focus)=\"onFocus($event)\"\r\n (blur)=\"onBlur($event)\"\r\n (triggerOpenDaysView)=\"onTriggerOpenDaysView()\"\r\n (triggerOpenMonthsView)=\"onTriggerOpenMonthsView()\"\r\n (triggerSelectYear)=\"selectYear($event)\"\r\n (triggerChangeYearsViewPage)=\"changeYearsViewPage($event)\"\r\n (triggerHighlightYear)=\"setHighlightedYear($event)\"\r\n (triggerHighlightFirstYear)=\"highlightFirstYear()\"\r\n (triggerHighlightLastYear)=\"highlightLastYear()\"\r\n (triggerHighlightNextYear)=\"highlightNextYear($event)\"\r\n (triggerHighlightPreviousYear)=\"highlightPreviousYear($event)\"\r\n (triggerHighlightSameYearNextPage)=\"highlightSameYearNextPage($event)\"\r\n (triggerHighlightSameYearPreviousPage)=\"highlightSameYearPreviousPage($event)\"\r\n />\r\n } }\r\n</div>\r\n" }]
8232
+ ], template: "<div\r\n class=\"ard-calendar\"\r\n [ngClass]=\"ngClasses()\"\r\n>\r\n @switch (activeView()) { @case ('days') {\r\n <ard-days-view\r\n [tabIndex]=\"tabIndex()\"\r\n [readOnly]=\"readonly()\"\r\n [disabled]=\"disabled()\"\r\n [autoFocus]=\"autoFocus()\"\r\n [_isUsingKeyboard]=\"_isUsingKeyboard()\"\r\n [activeMonth]=\"activeMonth()\"\r\n [activeYear]=\"activeYear()\"\r\n [selectedDate]=\"selectionStart()\"\r\n [selectedDateEnd]=\"endDate()\"\r\n [rangeSelectionMode]=\"isRangeSelector\"\r\n [firstWeekday]=\"firstWeekday()\"\r\n [staticHeight]=\"staticHeight()\"\r\n [highlightedDay]=\"highlightedDay()\"\r\n [UTC]=\"UTC()\"\r\n [min]=\"min()\"\r\n [max]=\"max()\"\r\n [multiCalendarLocation]=\"multiCalendarLocation()\"\r\n [hideFloatingMonth]=\"hideFloatingMonth()\"\r\n [isDayFilteredOut]=\"isDayFilteredOut()\"\r\n [daysViewHeaderTemplate]=\"daysViewHeaderTemplate()?.template ?? templateRepository()?.daysViewHeaderTmp()?.template\"\r\n [floatingMonthTemplate]=\"floatingMonthTemplate()?.template ?? templateRepository()?.floatingMonthTmp()?.template\"\r\n [weekdayTemplate]=\"weekdayTemplate()?.template ?? templateRepository()?.weekdayTmp()?.template\"\r\n [dayTemplate]=\"dayTemplate()?.template ?? templateRepository()?.dayTmp()?.template\"\r\n [daysViewHeaderDateFormat]=\"daysViewHeaderDateFormat()\"\r\n [weekdayDateFormat]=\"weekdayDateFormat()\"\r\n [weekdayTitleDateFormat]=\"weekdayTitleDateFormat()\"\r\n [floatingMonthDateFormat]=\"floatingMonthDateFormat()\"\r\n [floatingMonthTitleDateFormat]=\"floatingMonthTitleDateFormat()\"\r\n [dayDateFormat]=\"dayDateFormat()\"\r\n (focus)=\"onFocus($event)\"\r\n (blur)=\"onBlur($event)\"\r\n (triggerOpenMonthsView)=\"onTriggerOpenMonthsView()\"\r\n (triggerOpenYearsView)=\"onTriggerOpenYearsView()\"\r\n (triggerChangeMonth)=\"changeMonth($event)\"\r\n (triggerChangeYear)=\"changeYear($event)\"\r\n (triggerHighlightDay)=\"setHighlightedDay($event)\"\r\n (triggerHighlightFirstDay)=\"highlightFirstDay()\"\r\n (triggerHighlightLastDay)=\"highlightLastDay()\"\r\n (triggerHighlightNextDay)=\"highlightNextDay($event)\"\r\n (triggerHighlightPreviousDay)=\"highlightPreviousDay($event)\"\r\n (triggerHighlightSameDayNextPage)=\"$event ? highlightSameDayNextYear() : highlightSameDayNextMonth()\"\r\n (triggerHighlightSameDayPreviousPage)=\"$event ? highlightSameDayPreviousYear() : highlightSameDayPreviousMonth()\"\r\n (triggerSelectDay)=\"selectDay($event)\"\r\n />\r\n } @case ('months') {\r\n <ard-months-view\r\n [tabIndex]=\"tabIndex()\"\r\n [readOnly]=\"readonly()\"\r\n [disabled]=\"disabled()\"\r\n [autoFocus]=\"autoFocus()\"\r\n [_isUsingKeyboard]=\"_isUsingKeyboard()\"\r\n [color]=\"color()\"\r\n [activeMonth]=\"activeMonth()\"\r\n [activeYear]=\"activeYear()\"\r\n [selectedDate]=\"selectionStart()\"\r\n [selectedDateEnd]=\"endDate()\"\r\n [rangeSelectionMode]=\"isRangeSelector\"\r\n [UTC]=\"UTC()\"\r\n [min]=\"min()\"\r\n [max]=\"max()\"\r\n [multiCalendarLocation]=\"multiCalendarLocation()\"\r\n [highlightedMonth]=\"highlightedMonth()\"\r\n [monthsViewHeaderTemplate]=\"monthsViewHeaderTemplate()?.template ?? templateRepository()?.monthsViewHeaderTmp()?.template\"\r\n [monthTemplate]=\"monthTemplate()?.template ?? templateRepository()?.monthTmp()?.template\"\r\n [monthsViewHeaderDateFormat]=\"monthsViewHeaderDateFormat()\"\r\n [monthDateFormat]=\"monthDateFormat()\"\r\n (focus)=\"onFocus($event)\"\r\n (blur)=\"onBlur($event)\"\r\n (triggerOpenDaysView)=\"onTriggerOpenDaysView()\"\r\n (triggerOpenYearsView)=\"onTriggerOpenYearsView()\"\r\n (triggeChangeYear)=\"changeYear($event)\"\r\n (triggerSelectMonth)=\"selectMonth($event)\"\r\n (triggerHighlightMonth)=\"setHighlightedMonth($event)\"\r\n (triggerHighlightFirstMonth)=\"highlightFirstMonth()\"\r\n (triggerHighlightLastMonth)=\"highlightLastMonth()\"\r\n (triggerHighlightNextMonth)=\"highlightNextMonth($event)\"\r\n (triggerHighlightPreviousMonth)=\"highlightPreviousMonth($event)\"\r\n (triggerHighlightSameMonthNextPage)=\"highlightSameMonthNextYear($event)\"\r\n (triggerHighlightSameMonthPreviousPage)=\"highlightSameMonthPreviousYear($event)\"\r\n />\r\n } @case ('years') {\r\n <ard-years-view\r\n [tabIndex]=\"tabIndex()\"\r\n [readOnly]=\"readonly()\"\r\n [disabled]=\"disabled()\"\r\n [autoFocus]=\"autoFocus()\"\r\n [_isUsingKeyboard]=\"_isUsingKeyboard()\"\r\n [highlightedYear]=\"highlightedYear()\"\r\n [currentYearRangeStart]=\"currentYearRangeStart()\"\r\n [multipleYearPageSize]=\"multipleYearPageSize()\"\r\n [selectedDate]=\"selectionStart()\"\r\n [selectedDateEnd]=\"endDate()\"\r\n [rangeSelectionMode]=\"isRangeSelector\"\r\n [UTC]=\"UTC()\"\r\n [min]=\"min()\"\r\n [max]=\"max()\"\r\n [multiCalendarLocation]=\"multiCalendarLocation()\"\r\n [yearsViewHeaderTemplate]=\"yearsViewHeaderTemplate()?.template ?? templateRepository()?.yearsViewHeaderTmp()?.template\"\r\n [yearTemplate]=\"yearTemplate()?.template ?? templateRepository()?.yearTmp()?.template\"\r\n [yearsViewHeaderDateFormat]=\"yearsViewHeaderDateFormat()\"\r\n [yearDateFormat]=\"yearDateFormat()\"\r\n (focus)=\"onFocus($event)\"\r\n (blur)=\"onBlur($event)\"\r\n (triggerOpenDaysView)=\"onTriggerOpenDaysView()\"\r\n (triggerOpenMonthsView)=\"onTriggerOpenMonthsView()\"\r\n (triggerSelectYear)=\"selectYear($event)\"\r\n (triggerChangeYearsViewPage)=\"changeYearsViewPage($event)\"\r\n (triggerHighlightYear)=\"setHighlightedYear($event)\"\r\n (triggerHighlightFirstYear)=\"highlightFirstYear()\"\r\n (triggerHighlightLastYear)=\"highlightLastYear()\"\r\n (triggerHighlightNextYear)=\"highlightNextYear($event)\"\r\n (triggerHighlightPreviousYear)=\"highlightPreviousYear($event)\"\r\n (triggerHighlightSameYearNextPage)=\"highlightSameYearNextPage($event)\"\r\n (triggerHighlightSameYearPreviousPage)=\"highlightSameYearPreviousPage($event)\"\r\n />\r\n } }\r\n</div>\r\n" }]
8212
8233
  }], ctorParameters: () => [{ type: undefined, decorators: [{
8213
8234
  type: Inject,
8214
8235
  args: [ARD_CALENDAR_DEFAULTS]
@@ -8263,7 +8284,9 @@ class ArdiumCalendarModule {
8263
8284
  ArdCalendarYearTemplateDirective,
8264
8285
  ArdCalendarMonthTemplateDirective,
8265
8286
  ArdCalendarDayTemplateDirective] }); }
8266
- static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: ArdiumCalendarModule, imports: [CommonModule, _CalendarViewsModule] }); }
8287
+ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: ArdiumCalendarModule, providers: [
8288
+ { provide: DATE_PIPE_DEFAULT_OPTIONS, useValue: { timezone: '+0000' } },
8289
+ ], imports: [CommonModule, _CalendarViewsModule] }); }
8267
8290
  }
8268
8291
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: ArdiumCalendarModule, decorators: [{
8269
8292
  type: NgModule,
@@ -8293,6 +8316,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImpo
8293
8316
  ArdCalendarMonthTemplateDirective,
8294
8317
  ArdCalendarDayTemplateDirective,
8295
8318
  ],
8319
+ providers: [
8320
+ { provide: DATE_PIPE_DEFAULT_OPTIONS, useValue: { timezone: '+0000' } },
8321
+ ],
8296
8322
  }]
8297
8323
  }] });
8298
8324
 
@@ -8348,7 +8374,7 @@ class ArdiumRangeCalendarComponent extends _AbstractCalendar {
8348
8374
  provide: ARD_FORM_FIELD_CONTROL,
8349
8375
  useExisting: ArdiumRangeCalendarComponent,
8350
8376
  },
8351
- ], usesInheritance: true, ngImport: i0, template: "<div\r\n class=\"ard-calendar\"\r\n [ngClass]=\"ngClasses()\"\r\n>\r\n @switch (activeView()) { @case ('days') {\r\n <ard-days-view\r\n [tabIndex]=\"tabIndex()\"\r\n [readOnly]=\"readonly()\"\r\n [disabled]=\"disabled()\"\r\n [autoFocus]=\"autoFocus()\"\r\n [_isUsingKeyboard]=\"_isUsingKeyboard()\"\r\n [activeMonth]=\"activeMonth()\"\r\n [activeYear]=\"activeYear()\"\r\n [selectedDate]=\"selectionStart()\"\r\n [selectedDateEnd]=\"endDate()\"\r\n [rangeSelectionMode]=\"isRangeSelector\"\r\n [firstWeekday]=\"firstWeekday()\"\r\n [staticHeight]=\"staticHeight()\"\r\n [highlightedDay]=\"highlightedDay()\"\r\n [UTC]=\"UTC()\"\r\n [min]=\"min()\"\r\n [max]=\"max()\"\r\n [multiCalendarLocation]=\"multiCalendarLocation()\"\r\n [hideFloatingMonth]=\"hideFloatingMonth()\"\r\n [isDayFilteredOut]=\"isDayFilteredOut()\"\r\n [daysViewHeaderTemplate]=\"daysViewHeaderTemplate()?.template ?? templateRepository()?.daysViewHeaderTmp()?.template\"\r\n [floatingMonthTemplate]=\"floatingMonthTemplate()?.template ?? templateRepository()?.floatingMonthTmp()?.template\"\r\n [weekdayTemplate]=\"weekdayTemplate()?.template ?? templateRepository()?.weekdayTmp()?.template\"\r\n [dayTemplate]=\"dayTemplate()?.template ?? templateRepository()?.dayTmp()?.template\"\r\n [daysViewHeaderDateFormat]=\"daysViewHeaderDateFormat()\"\r\n [weekdayDateFormat]=\"weekdayDateFormat()\"\r\n [weekdayTitleDateFormat]=\"weekdayTitleDateFormat()\"\r\n [floatingMonthDateFormat]=\"floatingMonthDateFormat()\"\r\n [floatingMonthTitleDateFormat]=\"floatingMonthTitleDateFormat()\"\r\n [dayDateFormat]=\"dayDateFormat()\"\r\n (focus)=\"onFocus($event)\"\r\n (blur)=\"onBlur($event)\"\r\n (triggerOpenMonthsView)=\"onTriggerOpenMonthsView()\"\r\n (triggerOpenYearsView)=\"onTriggerOpenYearsView()\"\r\n (triggerChangeMonth)=\"changeMonth($event)\"\r\n (triggerChangeYear)=\"changeYear($event)\"\r\n (triggerHighlightDay)=\"setHighlightedDay($event)\"\r\n (triggerHighlightFirstDay)=\"highlightFirstDay()\"\r\n (triggerHighlightLastDay)=\"highlightLastDay()\"\r\n (triggerHighlightNextDay)=\"highlightNextDay($event)\"\r\n (triggerHighlightPreviousDay)=\"highlightPreviousDay($event)\"\r\n (triggerHighlightSameDayNextPage)=\"$event ? highlightSameDayNextYear() : highlightSameDayNextMonth()\"\r\n (triggerHighlightSameDayPreviousPage)=\"$event ? highlightSameDayPreviousYear() : highlightSameDayPreviousMonth()\"\r\n (triggerSelectDay)=\"selectDay($event)\"\r\n />\r\n } @case ('months') {\r\n <ard-months-view\r\n [tabIndex]=\"tabIndex()\"\r\n [readOnly]=\"readonly()\"\r\n [disabled]=\"disabled()\"\r\n [autoFocus]=\"autoFocus()\"\r\n [_isUsingKeyboard]=\"_isUsingKeyboard()\"\r\n [color]=\"color()\"\r\n [activeMonth]=\"activeMonth()\"\r\n [activeYear]=\"activeYear()\"\r\n [selectedDate]=\"selectionStart()\"\r\n [selectedDateEnd]=\"endDate()\"\r\n [rangeSelectionMode]=\"isRangeSelector\"\r\n [UTC]=\"UTC()\"\r\n [min]=\"min()\"\r\n [max]=\"max()\"\r\n [multiCalendarLocation]=\"multiCalendarLocation()\"\r\n [highlightedMonth]=\"highlightedMonth()\"\r\n [monthsViewHeaderTemplate]=\"monthsViewHeaderTemplate()?.template ?? templateRepository()?.monthsViewHeaderTmp()?.template\"\r\n [monthTemplate]=\"monthTemplate()?.template ?? templateRepository()?.monthTmp()?.template\"\r\n [monthsViewHeaderDateFormat]=\"monthsViewHeaderDateFormat()\"\r\n [monthDateFormat]=\"monthDateFormat()\"\r\n (focus)=\"onFocus($event)\"\r\n (blur)=\"onBlur($event)\"\r\n (triggerOpenDaysView)=\"onTriggerOpenDaysView()\"\r\n (triggerOpenYearsView)=\"onTriggerOpenYearsView()\"\r\n (triggeChangeYear)=\"changeYear($event)\"\r\n (triggerSelectMonth)=\"selectMonth($event)\"\r\n (triggerHighlightMonth)=\"setHighlightedMonth($event)\"\r\n (triggerHighlightFirstMonth)=\"highlightFirstMonth()\"\r\n (triggerHighlightLastMonth)=\"highlightLastMonth()\"\r\n (triggerHighlightNextMonth)=\"highlightNextMonth($event)\"\r\n (triggerHighlightPreviousMonth)=\"highlightPreviousMonth($event)\"\r\n (triggerHighlightSameMonthNextPage)=\"highlightSameMonthNextYear($event)\"\r\n (triggerHighlightSameMonthPreviousPage)=\"highlightSameMonthPreviousYear($event)\"\r\n />\r\n } @case ('years') {\r\n <ard-years-view\r\n [tabIndex]=\"tabIndex()\"\r\n [readOnly]=\"readonly()\"\r\n [disabled]=\"disabled()\"\r\n [autoFocus]=\"autoFocus()\"\r\n [_isUsingKeyboard]=\"_isUsingKeyboard()\"\r\n [highlightedYear]=\"highlightedYear()\"\r\n [currentYearRangeStart]=\"currentYearRangeStart()\"\r\n [selectedDate]=\"selectionStart()\"\r\n [selectedDateEnd]=\"endDate()\"\r\n [rangeSelectionMode]=\"isRangeSelector\"\r\n [UTC]=\"UTC()\"\r\n [min]=\"min()\"\r\n [max]=\"max()\"\r\n [multiCalendarLocation]=\"multiCalendarLocation()\"\r\n [yearsViewHeaderTemplate]=\"yearsViewHeaderTemplate()?.template ?? templateRepository()?.yearsViewHeaderTmp()?.template\"\r\n [yearTemplate]=\"yearTemplate()?.template ?? templateRepository()?.yearTmp()?.template\"\r\n [yearsViewHeaderDateFormat]=\"yearsViewHeaderDateFormat()\"\r\n [yearDateFormat]=\"yearDateFormat()\"\r\n (focus)=\"onFocus($event)\"\r\n (blur)=\"onBlur($event)\"\r\n (triggerOpenDaysView)=\"onTriggerOpenDaysView()\"\r\n (triggerOpenMonthsView)=\"onTriggerOpenMonthsView()\"\r\n (triggerSelectYear)=\"selectYear($event)\"\r\n (triggerChangeYearsViewPage)=\"changeYearsViewPage($event)\"\r\n (triggerHighlightYear)=\"setHighlightedYear($event)\"\r\n (triggerHighlightFirstYear)=\"highlightFirstYear()\"\r\n (triggerHighlightLastYear)=\"highlightLastYear()\"\r\n (triggerHighlightNextYear)=\"highlightNextYear($event)\"\r\n (triggerHighlightPreviousYear)=\"highlightPreviousYear($event)\"\r\n (triggerHighlightSameYearNextPage)=\"highlightSameYearNextPage($event)\"\r\n (triggerHighlightSameYearPreviousPage)=\"highlightSameYearPreviousPage($event)\"\r\n />\r\n } }\r\n</div>\r\n", styles: [""], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: DaysViewComponent, selector: "ard-days-view", inputs: ["tabIndex", "readOnly", "disabled", "autoFocus", "_isUsingKeyboard", "activeYear", "activeMonth", "selectedDate", "selectedDateEnd", "rangeSelectionMode", "UTC", "min", "max", "multiCalendarLocation", "isDayFilteredOut", "highlightedDay", "firstWeekday", "staticHeight", "hideFloatingMonth", "daysViewHeaderTemplate", "floatingMonthTemplate", "weekdayTemplate", "dayTemplate", "daysViewHeaderDateFormat", "weekdayDateFormat", "weekdayTitleDateFormat", "floatingMonthDateFormat", "floatingMonthTitleDateFormat", "dayDateFormat"], outputs: ["triggerOpenYearsView", "triggerOpenMonthsView", "triggerSelectDay", "triggerChangeMonth", "triggerChangeYear", "triggerHighlightDay", "triggerHighlightNextDay", "triggerHighlightPreviousDay", "triggerHighlightFirstDay", "triggerHighlightLastDay", "triggerHighlightSameDayPreviousPage", "triggerHighlightSameDayNextPage", "focus", "blur"] }, { kind: "component", type: MonthsViewComponent, selector: "ard-months-view", inputs: ["tabIndex", "readOnly", "disabled", "autoFocus", "_isUsingKeyboard", "color", "activeYear", "activeMonth", "selectedDate", "selectedDateEnd", "rangeSelectionMode", "UTC", "min", "max", "multiCalendarLocation", "highlightedMonth", "monthsViewHeaderTemplate", "monthTemplate", "monthsViewHeaderDateFormat", "monthDateFormat"], outputs: ["triggerOpenYearsView", "triggerOpenDaysView", "focus", "blur", "triggerSelectMonth", "triggeChangeYear", "triggerHighlightMonth", "triggerHighlightNextMonth", "triggerHighlightPreviousMonth", "triggerHighlightFirstMonth", "triggerHighlightLastMonth", "triggerHighlightSameMonthPreviousPage", "triggerHighlightSameMonthNextPage"] }, { kind: "component", type: YearsViewComponent, selector: "ard-years-view", inputs: ["tabIndex", "readOnly", "disabled", "autoFocus", "_isUsingKeyboard", "selectedDate", "selectedDateEnd", "rangeSelectionMode", "UTC", "min", "max", "multiCalendarLocation", "currentYearRangeStart", "highlightedYear", "yearsViewHeaderTemplate", "yearTemplate", "yearsViewHeaderDateFormat", "yearDateFormat"], outputs: ["triggerOpenMonthsView", "triggerOpenDaysView", "focus", "blur", "triggerSelectYear", "triggerChangeYearsViewPage", "triggerHighlightYear", "triggerHighlightNextYear", "triggerHighlightPreviousYear", "triggerHighlightFirstYear", "triggerHighlightLastYear", "triggerHighlightSameYearPreviousPage", "triggerHighlightSameYearNextPage"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
8377
+ ], usesInheritance: true, ngImport: i0, template: "<div\r\n class=\"ard-calendar\"\r\n [ngClass]=\"ngClasses()\"\r\n>\r\n @switch (activeView()) { @case ('days') {\r\n <ard-days-view\r\n [tabIndex]=\"tabIndex()\"\r\n [readOnly]=\"readonly()\"\r\n [disabled]=\"disabled()\"\r\n [autoFocus]=\"autoFocus()\"\r\n [_isUsingKeyboard]=\"_isUsingKeyboard()\"\r\n [activeMonth]=\"activeMonth()\"\r\n [activeYear]=\"activeYear()\"\r\n [selectedDate]=\"selectionStart()\"\r\n [selectedDateEnd]=\"endDate()\"\r\n [rangeSelectionMode]=\"isRangeSelector\"\r\n [firstWeekday]=\"firstWeekday()\"\r\n [staticHeight]=\"staticHeight()\"\r\n [highlightedDay]=\"highlightedDay()\"\r\n [UTC]=\"UTC()\"\r\n [min]=\"min()\"\r\n [max]=\"max()\"\r\n [multiCalendarLocation]=\"multiCalendarLocation()\"\r\n [hideFloatingMonth]=\"hideFloatingMonth()\"\r\n [isDayFilteredOut]=\"isDayFilteredOut()\"\r\n [daysViewHeaderTemplate]=\"daysViewHeaderTemplate()?.template ?? templateRepository()?.daysViewHeaderTmp()?.template\"\r\n [floatingMonthTemplate]=\"floatingMonthTemplate()?.template ?? templateRepository()?.floatingMonthTmp()?.template\"\r\n [weekdayTemplate]=\"weekdayTemplate()?.template ?? templateRepository()?.weekdayTmp()?.template\"\r\n [dayTemplate]=\"dayTemplate()?.template ?? templateRepository()?.dayTmp()?.template\"\r\n [daysViewHeaderDateFormat]=\"daysViewHeaderDateFormat()\"\r\n [weekdayDateFormat]=\"weekdayDateFormat()\"\r\n [weekdayTitleDateFormat]=\"weekdayTitleDateFormat()\"\r\n [floatingMonthDateFormat]=\"floatingMonthDateFormat()\"\r\n [floatingMonthTitleDateFormat]=\"floatingMonthTitleDateFormat()\"\r\n [dayDateFormat]=\"dayDateFormat()\"\r\n (focus)=\"onFocus($event)\"\r\n (blur)=\"onBlur($event)\"\r\n (triggerOpenMonthsView)=\"onTriggerOpenMonthsView()\"\r\n (triggerOpenYearsView)=\"onTriggerOpenYearsView()\"\r\n (triggerChangeMonth)=\"changeMonth($event)\"\r\n (triggerChangeYear)=\"changeYear($event)\"\r\n (triggerHighlightDay)=\"setHighlightedDay($event)\"\r\n (triggerHighlightFirstDay)=\"highlightFirstDay()\"\r\n (triggerHighlightLastDay)=\"highlightLastDay()\"\r\n (triggerHighlightNextDay)=\"highlightNextDay($event)\"\r\n (triggerHighlightPreviousDay)=\"highlightPreviousDay($event)\"\r\n (triggerHighlightSameDayNextPage)=\"$event ? highlightSameDayNextYear() : highlightSameDayNextMonth()\"\r\n (triggerHighlightSameDayPreviousPage)=\"$event ? highlightSameDayPreviousYear() : highlightSameDayPreviousMonth()\"\r\n (triggerSelectDay)=\"selectDay($event)\"\r\n />\r\n } @case ('months') {\r\n <ard-months-view\r\n [tabIndex]=\"tabIndex()\"\r\n [readOnly]=\"readonly()\"\r\n [disabled]=\"disabled()\"\r\n [autoFocus]=\"autoFocus()\"\r\n [_isUsingKeyboard]=\"_isUsingKeyboard()\"\r\n [color]=\"color()\"\r\n [activeMonth]=\"activeMonth()\"\r\n [activeYear]=\"activeYear()\"\r\n [selectedDate]=\"selectionStart()\"\r\n [selectedDateEnd]=\"endDate()\"\r\n [rangeSelectionMode]=\"isRangeSelector\"\r\n [UTC]=\"UTC()\"\r\n [min]=\"min()\"\r\n [max]=\"max()\"\r\n [multiCalendarLocation]=\"multiCalendarLocation()\"\r\n [highlightedMonth]=\"highlightedMonth()\"\r\n [monthsViewHeaderTemplate]=\"monthsViewHeaderTemplate()?.template ?? templateRepository()?.monthsViewHeaderTmp()?.template\"\r\n [monthTemplate]=\"monthTemplate()?.template ?? templateRepository()?.monthTmp()?.template\"\r\n [monthsViewHeaderDateFormat]=\"monthsViewHeaderDateFormat()\"\r\n [monthDateFormat]=\"monthDateFormat()\"\r\n (focus)=\"onFocus($event)\"\r\n (blur)=\"onBlur($event)\"\r\n (triggerOpenDaysView)=\"onTriggerOpenDaysView()\"\r\n (triggerOpenYearsView)=\"onTriggerOpenYearsView()\"\r\n (triggeChangeYear)=\"changeYear($event)\"\r\n (triggerSelectMonth)=\"selectMonth($event)\"\r\n (triggerHighlightMonth)=\"setHighlightedMonth($event)\"\r\n (triggerHighlightFirstMonth)=\"highlightFirstMonth()\"\r\n (triggerHighlightLastMonth)=\"highlightLastMonth()\"\r\n (triggerHighlightNextMonth)=\"highlightNextMonth($event)\"\r\n (triggerHighlightPreviousMonth)=\"highlightPreviousMonth($event)\"\r\n (triggerHighlightSameMonthNextPage)=\"highlightSameMonthNextYear($event)\"\r\n (triggerHighlightSameMonthPreviousPage)=\"highlightSameMonthPreviousYear($event)\"\r\n />\r\n } @case ('years') {\r\n <ard-years-view\r\n [tabIndex]=\"tabIndex()\"\r\n [readOnly]=\"readonly()\"\r\n [disabled]=\"disabled()\"\r\n [autoFocus]=\"autoFocus()\"\r\n [_isUsingKeyboard]=\"_isUsingKeyboard()\"\r\n [highlightedYear]=\"highlightedYear()\"\r\n [currentYearRangeStart]=\"currentYearRangeStart()\"\r\n [multipleYearPageSize]=\"multipleYearPageSize()\"\r\n [selectedDate]=\"selectionStart()\"\r\n [selectedDateEnd]=\"endDate()\"\r\n [rangeSelectionMode]=\"isRangeSelector\"\r\n [UTC]=\"UTC()\"\r\n [min]=\"min()\"\r\n [max]=\"max()\"\r\n [multiCalendarLocation]=\"multiCalendarLocation()\"\r\n [yearsViewHeaderTemplate]=\"yearsViewHeaderTemplate()?.template ?? templateRepository()?.yearsViewHeaderTmp()?.template\"\r\n [yearTemplate]=\"yearTemplate()?.template ?? templateRepository()?.yearTmp()?.template\"\r\n [yearsViewHeaderDateFormat]=\"yearsViewHeaderDateFormat()\"\r\n [yearDateFormat]=\"yearDateFormat()\"\r\n (focus)=\"onFocus($event)\"\r\n (blur)=\"onBlur($event)\"\r\n (triggerOpenDaysView)=\"onTriggerOpenDaysView()\"\r\n (triggerOpenMonthsView)=\"onTriggerOpenMonthsView()\"\r\n (triggerSelectYear)=\"selectYear($event)\"\r\n (triggerChangeYearsViewPage)=\"changeYearsViewPage($event)\"\r\n (triggerHighlightYear)=\"setHighlightedYear($event)\"\r\n (triggerHighlightFirstYear)=\"highlightFirstYear()\"\r\n (triggerHighlightLastYear)=\"highlightLastYear()\"\r\n (triggerHighlightNextYear)=\"highlightNextYear($event)\"\r\n (triggerHighlightPreviousYear)=\"highlightPreviousYear($event)\"\r\n (triggerHighlightSameYearNextPage)=\"highlightSameYearNextPage($event)\"\r\n (triggerHighlightSameYearPreviousPage)=\"highlightSameYearPreviousPage($event)\"\r\n />\r\n } }\r\n</div>\r\n", styles: [""], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: DaysViewComponent, selector: "ard-days-view", inputs: ["tabIndex", "readOnly", "disabled", "autoFocus", "_isUsingKeyboard", "activeYear", "activeMonth", "selectedDate", "selectedDateEnd", "rangeSelectionMode", "UTC", "min", "max", "multiCalendarLocation", "isDayFilteredOut", "highlightedDay", "firstWeekday", "staticHeight", "hideFloatingMonth", "daysViewHeaderTemplate", "floatingMonthTemplate", "weekdayTemplate", "dayTemplate", "daysViewHeaderDateFormat", "weekdayDateFormat", "weekdayTitleDateFormat", "floatingMonthDateFormat", "floatingMonthTitleDateFormat", "dayDateFormat"], outputs: ["triggerOpenYearsView", "triggerOpenMonthsView", "triggerSelectDay", "triggerChangeMonth", "triggerChangeYear", "triggerHighlightDay", "triggerHighlightNextDay", "triggerHighlightPreviousDay", "triggerHighlightFirstDay", "triggerHighlightLastDay", "triggerHighlightSameDayPreviousPage", "triggerHighlightSameDayNextPage", "focus", "blur"] }, { kind: "component", type: MonthsViewComponent, selector: "ard-months-view", inputs: ["tabIndex", "readOnly", "disabled", "autoFocus", "_isUsingKeyboard", "color", "activeYear", "activeMonth", "selectedDate", "selectedDateEnd", "rangeSelectionMode", "UTC", "min", "max", "multiCalendarLocation", "highlightedMonth", "monthsViewHeaderTemplate", "monthTemplate", "monthsViewHeaderDateFormat", "monthDateFormat"], outputs: ["triggerOpenYearsView", "triggerOpenDaysView", "focus", "blur", "triggerSelectMonth", "triggeChangeYear", "triggerHighlightMonth", "triggerHighlightNextMonth", "triggerHighlightPreviousMonth", "triggerHighlightFirstMonth", "triggerHighlightLastMonth", "triggerHighlightSameMonthPreviousPage", "triggerHighlightSameMonthNextPage"] }, { kind: "component", type: YearsViewComponent, selector: "ard-years-view", inputs: ["tabIndex", "readOnly", "disabled", "autoFocus", "_isUsingKeyboard", "selectedDate", "selectedDateEnd", "rangeSelectionMode", "UTC", "min", "max", "multiCalendarLocation", "currentYearRangeStart", "multipleYearPageSize", "highlightedYear", "yearsViewHeaderTemplate", "yearTemplate", "yearsViewHeaderDateFormat", "yearDateFormat"], outputs: ["triggerOpenMonthsView", "triggerOpenDaysView", "focus", "blur", "triggerSelectYear", "triggerChangeYearsViewPage", "triggerHighlightYear", "triggerHighlightNextYear", "triggerHighlightPreviousYear", "triggerHighlightFirstYear", "triggerHighlightLastYear", "triggerHighlightSameYearPreviousPage", "triggerHighlightSameYearNextPage"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
8352
8378
  }
8353
8379
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: ArdiumRangeCalendarComponent, decorators: [{
8354
8380
  type: Component,
@@ -8362,7 +8388,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImpo
8362
8388
  provide: ARD_FORM_FIELD_CONTROL,
8363
8389
  useExisting: ArdiumRangeCalendarComponent,
8364
8390
  },
8365
- ], template: "<div\r\n class=\"ard-calendar\"\r\n [ngClass]=\"ngClasses()\"\r\n>\r\n @switch (activeView()) { @case ('days') {\r\n <ard-days-view\r\n [tabIndex]=\"tabIndex()\"\r\n [readOnly]=\"readonly()\"\r\n [disabled]=\"disabled()\"\r\n [autoFocus]=\"autoFocus()\"\r\n [_isUsingKeyboard]=\"_isUsingKeyboard()\"\r\n [activeMonth]=\"activeMonth()\"\r\n [activeYear]=\"activeYear()\"\r\n [selectedDate]=\"selectionStart()\"\r\n [selectedDateEnd]=\"endDate()\"\r\n [rangeSelectionMode]=\"isRangeSelector\"\r\n [firstWeekday]=\"firstWeekday()\"\r\n [staticHeight]=\"staticHeight()\"\r\n [highlightedDay]=\"highlightedDay()\"\r\n [UTC]=\"UTC()\"\r\n [min]=\"min()\"\r\n [max]=\"max()\"\r\n [multiCalendarLocation]=\"multiCalendarLocation()\"\r\n [hideFloatingMonth]=\"hideFloatingMonth()\"\r\n [isDayFilteredOut]=\"isDayFilteredOut()\"\r\n [daysViewHeaderTemplate]=\"daysViewHeaderTemplate()?.template ?? templateRepository()?.daysViewHeaderTmp()?.template\"\r\n [floatingMonthTemplate]=\"floatingMonthTemplate()?.template ?? templateRepository()?.floatingMonthTmp()?.template\"\r\n [weekdayTemplate]=\"weekdayTemplate()?.template ?? templateRepository()?.weekdayTmp()?.template\"\r\n [dayTemplate]=\"dayTemplate()?.template ?? templateRepository()?.dayTmp()?.template\"\r\n [daysViewHeaderDateFormat]=\"daysViewHeaderDateFormat()\"\r\n [weekdayDateFormat]=\"weekdayDateFormat()\"\r\n [weekdayTitleDateFormat]=\"weekdayTitleDateFormat()\"\r\n [floatingMonthDateFormat]=\"floatingMonthDateFormat()\"\r\n [floatingMonthTitleDateFormat]=\"floatingMonthTitleDateFormat()\"\r\n [dayDateFormat]=\"dayDateFormat()\"\r\n (focus)=\"onFocus($event)\"\r\n (blur)=\"onBlur($event)\"\r\n (triggerOpenMonthsView)=\"onTriggerOpenMonthsView()\"\r\n (triggerOpenYearsView)=\"onTriggerOpenYearsView()\"\r\n (triggerChangeMonth)=\"changeMonth($event)\"\r\n (triggerChangeYear)=\"changeYear($event)\"\r\n (triggerHighlightDay)=\"setHighlightedDay($event)\"\r\n (triggerHighlightFirstDay)=\"highlightFirstDay()\"\r\n (triggerHighlightLastDay)=\"highlightLastDay()\"\r\n (triggerHighlightNextDay)=\"highlightNextDay($event)\"\r\n (triggerHighlightPreviousDay)=\"highlightPreviousDay($event)\"\r\n (triggerHighlightSameDayNextPage)=\"$event ? highlightSameDayNextYear() : highlightSameDayNextMonth()\"\r\n (triggerHighlightSameDayPreviousPage)=\"$event ? highlightSameDayPreviousYear() : highlightSameDayPreviousMonth()\"\r\n (triggerSelectDay)=\"selectDay($event)\"\r\n />\r\n } @case ('months') {\r\n <ard-months-view\r\n [tabIndex]=\"tabIndex()\"\r\n [readOnly]=\"readonly()\"\r\n [disabled]=\"disabled()\"\r\n [autoFocus]=\"autoFocus()\"\r\n [_isUsingKeyboard]=\"_isUsingKeyboard()\"\r\n [color]=\"color()\"\r\n [activeMonth]=\"activeMonth()\"\r\n [activeYear]=\"activeYear()\"\r\n [selectedDate]=\"selectionStart()\"\r\n [selectedDateEnd]=\"endDate()\"\r\n [rangeSelectionMode]=\"isRangeSelector\"\r\n [UTC]=\"UTC()\"\r\n [min]=\"min()\"\r\n [max]=\"max()\"\r\n [multiCalendarLocation]=\"multiCalendarLocation()\"\r\n [highlightedMonth]=\"highlightedMonth()\"\r\n [monthsViewHeaderTemplate]=\"monthsViewHeaderTemplate()?.template ?? templateRepository()?.monthsViewHeaderTmp()?.template\"\r\n [monthTemplate]=\"monthTemplate()?.template ?? templateRepository()?.monthTmp()?.template\"\r\n [monthsViewHeaderDateFormat]=\"monthsViewHeaderDateFormat()\"\r\n [monthDateFormat]=\"monthDateFormat()\"\r\n (focus)=\"onFocus($event)\"\r\n (blur)=\"onBlur($event)\"\r\n (triggerOpenDaysView)=\"onTriggerOpenDaysView()\"\r\n (triggerOpenYearsView)=\"onTriggerOpenYearsView()\"\r\n (triggeChangeYear)=\"changeYear($event)\"\r\n (triggerSelectMonth)=\"selectMonth($event)\"\r\n (triggerHighlightMonth)=\"setHighlightedMonth($event)\"\r\n (triggerHighlightFirstMonth)=\"highlightFirstMonth()\"\r\n (triggerHighlightLastMonth)=\"highlightLastMonth()\"\r\n (triggerHighlightNextMonth)=\"highlightNextMonth($event)\"\r\n (triggerHighlightPreviousMonth)=\"highlightPreviousMonth($event)\"\r\n (triggerHighlightSameMonthNextPage)=\"highlightSameMonthNextYear($event)\"\r\n (triggerHighlightSameMonthPreviousPage)=\"highlightSameMonthPreviousYear($event)\"\r\n />\r\n } @case ('years') {\r\n <ard-years-view\r\n [tabIndex]=\"tabIndex()\"\r\n [readOnly]=\"readonly()\"\r\n [disabled]=\"disabled()\"\r\n [autoFocus]=\"autoFocus()\"\r\n [_isUsingKeyboard]=\"_isUsingKeyboard()\"\r\n [highlightedYear]=\"highlightedYear()\"\r\n [currentYearRangeStart]=\"currentYearRangeStart()\"\r\n [selectedDate]=\"selectionStart()\"\r\n [selectedDateEnd]=\"endDate()\"\r\n [rangeSelectionMode]=\"isRangeSelector\"\r\n [UTC]=\"UTC()\"\r\n [min]=\"min()\"\r\n [max]=\"max()\"\r\n [multiCalendarLocation]=\"multiCalendarLocation()\"\r\n [yearsViewHeaderTemplate]=\"yearsViewHeaderTemplate()?.template ?? templateRepository()?.yearsViewHeaderTmp()?.template\"\r\n [yearTemplate]=\"yearTemplate()?.template ?? templateRepository()?.yearTmp()?.template\"\r\n [yearsViewHeaderDateFormat]=\"yearsViewHeaderDateFormat()\"\r\n [yearDateFormat]=\"yearDateFormat()\"\r\n (focus)=\"onFocus($event)\"\r\n (blur)=\"onBlur($event)\"\r\n (triggerOpenDaysView)=\"onTriggerOpenDaysView()\"\r\n (triggerOpenMonthsView)=\"onTriggerOpenMonthsView()\"\r\n (triggerSelectYear)=\"selectYear($event)\"\r\n (triggerChangeYearsViewPage)=\"changeYearsViewPage($event)\"\r\n (triggerHighlightYear)=\"setHighlightedYear($event)\"\r\n (triggerHighlightFirstYear)=\"highlightFirstYear()\"\r\n (triggerHighlightLastYear)=\"highlightLastYear()\"\r\n (triggerHighlightNextYear)=\"highlightNextYear($event)\"\r\n (triggerHighlightPreviousYear)=\"highlightPreviousYear($event)\"\r\n (triggerHighlightSameYearNextPage)=\"highlightSameYearNextPage($event)\"\r\n (triggerHighlightSameYearPreviousPage)=\"highlightSameYearPreviousPage($event)\"\r\n />\r\n } }\r\n</div>\r\n" }]
8391
+ ], template: "<div\r\n class=\"ard-calendar\"\r\n [ngClass]=\"ngClasses()\"\r\n>\r\n @switch (activeView()) { @case ('days') {\r\n <ard-days-view\r\n [tabIndex]=\"tabIndex()\"\r\n [readOnly]=\"readonly()\"\r\n [disabled]=\"disabled()\"\r\n [autoFocus]=\"autoFocus()\"\r\n [_isUsingKeyboard]=\"_isUsingKeyboard()\"\r\n [activeMonth]=\"activeMonth()\"\r\n [activeYear]=\"activeYear()\"\r\n [selectedDate]=\"selectionStart()\"\r\n [selectedDateEnd]=\"endDate()\"\r\n [rangeSelectionMode]=\"isRangeSelector\"\r\n [firstWeekday]=\"firstWeekday()\"\r\n [staticHeight]=\"staticHeight()\"\r\n [highlightedDay]=\"highlightedDay()\"\r\n [UTC]=\"UTC()\"\r\n [min]=\"min()\"\r\n [max]=\"max()\"\r\n [multiCalendarLocation]=\"multiCalendarLocation()\"\r\n [hideFloatingMonth]=\"hideFloatingMonth()\"\r\n [isDayFilteredOut]=\"isDayFilteredOut()\"\r\n [daysViewHeaderTemplate]=\"daysViewHeaderTemplate()?.template ?? templateRepository()?.daysViewHeaderTmp()?.template\"\r\n [floatingMonthTemplate]=\"floatingMonthTemplate()?.template ?? templateRepository()?.floatingMonthTmp()?.template\"\r\n [weekdayTemplate]=\"weekdayTemplate()?.template ?? templateRepository()?.weekdayTmp()?.template\"\r\n [dayTemplate]=\"dayTemplate()?.template ?? templateRepository()?.dayTmp()?.template\"\r\n [daysViewHeaderDateFormat]=\"daysViewHeaderDateFormat()\"\r\n [weekdayDateFormat]=\"weekdayDateFormat()\"\r\n [weekdayTitleDateFormat]=\"weekdayTitleDateFormat()\"\r\n [floatingMonthDateFormat]=\"floatingMonthDateFormat()\"\r\n [floatingMonthTitleDateFormat]=\"floatingMonthTitleDateFormat()\"\r\n [dayDateFormat]=\"dayDateFormat()\"\r\n (focus)=\"onFocus($event)\"\r\n (blur)=\"onBlur($event)\"\r\n (triggerOpenMonthsView)=\"onTriggerOpenMonthsView()\"\r\n (triggerOpenYearsView)=\"onTriggerOpenYearsView()\"\r\n (triggerChangeMonth)=\"changeMonth($event)\"\r\n (triggerChangeYear)=\"changeYear($event)\"\r\n (triggerHighlightDay)=\"setHighlightedDay($event)\"\r\n (triggerHighlightFirstDay)=\"highlightFirstDay()\"\r\n (triggerHighlightLastDay)=\"highlightLastDay()\"\r\n (triggerHighlightNextDay)=\"highlightNextDay($event)\"\r\n (triggerHighlightPreviousDay)=\"highlightPreviousDay($event)\"\r\n (triggerHighlightSameDayNextPage)=\"$event ? highlightSameDayNextYear() : highlightSameDayNextMonth()\"\r\n (triggerHighlightSameDayPreviousPage)=\"$event ? highlightSameDayPreviousYear() : highlightSameDayPreviousMonth()\"\r\n (triggerSelectDay)=\"selectDay($event)\"\r\n />\r\n } @case ('months') {\r\n <ard-months-view\r\n [tabIndex]=\"tabIndex()\"\r\n [readOnly]=\"readonly()\"\r\n [disabled]=\"disabled()\"\r\n [autoFocus]=\"autoFocus()\"\r\n [_isUsingKeyboard]=\"_isUsingKeyboard()\"\r\n [color]=\"color()\"\r\n [activeMonth]=\"activeMonth()\"\r\n [activeYear]=\"activeYear()\"\r\n [selectedDate]=\"selectionStart()\"\r\n [selectedDateEnd]=\"endDate()\"\r\n [rangeSelectionMode]=\"isRangeSelector\"\r\n [UTC]=\"UTC()\"\r\n [min]=\"min()\"\r\n [max]=\"max()\"\r\n [multiCalendarLocation]=\"multiCalendarLocation()\"\r\n [highlightedMonth]=\"highlightedMonth()\"\r\n [monthsViewHeaderTemplate]=\"monthsViewHeaderTemplate()?.template ?? templateRepository()?.monthsViewHeaderTmp()?.template\"\r\n [monthTemplate]=\"monthTemplate()?.template ?? templateRepository()?.monthTmp()?.template\"\r\n [monthsViewHeaderDateFormat]=\"monthsViewHeaderDateFormat()\"\r\n [monthDateFormat]=\"monthDateFormat()\"\r\n (focus)=\"onFocus($event)\"\r\n (blur)=\"onBlur($event)\"\r\n (triggerOpenDaysView)=\"onTriggerOpenDaysView()\"\r\n (triggerOpenYearsView)=\"onTriggerOpenYearsView()\"\r\n (triggeChangeYear)=\"changeYear($event)\"\r\n (triggerSelectMonth)=\"selectMonth($event)\"\r\n (triggerHighlightMonth)=\"setHighlightedMonth($event)\"\r\n (triggerHighlightFirstMonth)=\"highlightFirstMonth()\"\r\n (triggerHighlightLastMonth)=\"highlightLastMonth()\"\r\n (triggerHighlightNextMonth)=\"highlightNextMonth($event)\"\r\n (triggerHighlightPreviousMonth)=\"highlightPreviousMonth($event)\"\r\n (triggerHighlightSameMonthNextPage)=\"highlightSameMonthNextYear($event)\"\r\n (triggerHighlightSameMonthPreviousPage)=\"highlightSameMonthPreviousYear($event)\"\r\n />\r\n } @case ('years') {\r\n <ard-years-view\r\n [tabIndex]=\"tabIndex()\"\r\n [readOnly]=\"readonly()\"\r\n [disabled]=\"disabled()\"\r\n [autoFocus]=\"autoFocus()\"\r\n [_isUsingKeyboard]=\"_isUsingKeyboard()\"\r\n [highlightedYear]=\"highlightedYear()\"\r\n [currentYearRangeStart]=\"currentYearRangeStart()\"\r\n [multipleYearPageSize]=\"multipleYearPageSize()\"\r\n [selectedDate]=\"selectionStart()\"\r\n [selectedDateEnd]=\"endDate()\"\r\n [rangeSelectionMode]=\"isRangeSelector\"\r\n [UTC]=\"UTC()\"\r\n [min]=\"min()\"\r\n [max]=\"max()\"\r\n [multiCalendarLocation]=\"multiCalendarLocation()\"\r\n [yearsViewHeaderTemplate]=\"yearsViewHeaderTemplate()?.template ?? templateRepository()?.yearsViewHeaderTmp()?.template\"\r\n [yearTemplate]=\"yearTemplate()?.template ?? templateRepository()?.yearTmp()?.template\"\r\n [yearsViewHeaderDateFormat]=\"yearsViewHeaderDateFormat()\"\r\n [yearDateFormat]=\"yearDateFormat()\"\r\n (focus)=\"onFocus($event)\"\r\n (blur)=\"onBlur($event)\"\r\n (triggerOpenDaysView)=\"onTriggerOpenDaysView()\"\r\n (triggerOpenMonthsView)=\"onTriggerOpenMonthsView()\"\r\n (triggerSelectYear)=\"selectYear($event)\"\r\n (triggerChangeYearsViewPage)=\"changeYearsViewPage($event)\"\r\n (triggerHighlightYear)=\"setHighlightedYear($event)\"\r\n (triggerHighlightFirstYear)=\"highlightFirstYear()\"\r\n (triggerHighlightLastYear)=\"highlightLastYear()\"\r\n (triggerHighlightNextYear)=\"highlightNextYear($event)\"\r\n (triggerHighlightPreviousYear)=\"highlightPreviousYear($event)\"\r\n (triggerHighlightSameYearNextPage)=\"highlightSameYearNextPage($event)\"\r\n (triggerHighlightSameYearPreviousPage)=\"highlightSameYearPreviousPage($event)\"\r\n />\r\n } }\r\n</div>\r\n" }]
8366
8392
  }], ctorParameters: () => [{ type: undefined, decorators: [{
8367
8393
  type: Inject,
8368
8394
  args: [ARD_CALENDAR_DEFAULTS]
@@ -8502,7 +8528,9 @@ class ArdiumRangeCalendarModule {
8502
8528
  ArdRangeCalendarYearTemplateDirective,
8503
8529
  ArdRangeCalendarMonthTemplateDirective,
8504
8530
  ArdRangeCalendarDayTemplateDirective] }); }
8505
- static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: ArdiumRangeCalendarModule, imports: [CommonModule, _CalendarViewsModule] }); }
8531
+ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: ArdiumRangeCalendarModule, providers: [
8532
+ { provide: DATE_PIPE_DEFAULT_OPTIONS, useValue: { timezone: '+0000' } },
8533
+ ], imports: [CommonModule, _CalendarViewsModule] }); }
8506
8534
  }
8507
8535
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: ArdiumRangeCalendarModule, decorators: [{
8508
8536
  type: NgModule,
@@ -8532,6 +8560,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImpo
8532
8560
  ArdRangeCalendarMonthTemplateDirective,
8533
8561
  ArdRangeCalendarDayTemplateDirective,
8534
8562
  ],
8563
+ providers: [
8564
+ { provide: DATE_PIPE_DEFAULT_OPTIONS, useValue: { timezone: '+0000' } },
8565
+ ],
8535
8566
  }]
8536
8567
  }] });
8537
8568
 
@@ -8544,7 +8575,7 @@ const DEFAULT_DATE_INPUT_SERIALIZE_FN = (value) => {
8544
8575
  return '';
8545
8576
  };
8546
8577
  const DEFAULT_DATE_RANGE_INPUT_SERIALIZE_FN = (value) => {
8547
- if (value instanceof DateRange) {
8578
+ if (isDateRange(value)) {
8548
8579
  const from = `${value.from.getDate().toString().padStart(2, '0')}/${(value.from.getMonth() + 1)
8549
8580
  .toString()
8550
8581
  .padStart(2, '0')}/${value.from.getFullYear()}`;
@@ -8849,7 +8880,9 @@ class ArdiumDateInputModule {
8849
8880
  ArdDateInputWeekdayTemplateDirective,
8850
8881
  ArdDateInputYearsViewHeaderTemplateDirective,
8851
8882
  ArdDateInputYearTemplateDirective] }); }
8852
- static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: ArdiumDateInputModule, imports: [CommonModule,
8883
+ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: ArdiumDateInputModule, providers: [
8884
+ { provide: DATE_PIPE_DEFAULT_OPTIONS, useValue: { timezone: '+0000' } },
8885
+ ], imports: [CommonModule,
8853
8886
  ArdiumFormFieldFrameModule,
8854
8887
  ArdiumDropdownPanelModule,
8855
8888
  ArdiumClickOutsideModule,
@@ -8906,6 +8939,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImpo
8906
8939
  ArdDateInputYearsViewHeaderTemplateDirective,
8907
8940
  ArdDateInputYearTemplateDirective,
8908
8941
  ],
8942
+ providers: [
8943
+ { provide: DATE_PIPE_DEFAULT_OPTIONS, useValue: { timezone: '+0000' } },
8944
+ ],
8909
8945
  }]
8910
8946
  }] });
8911
8947
 
@@ -9089,7 +9125,7 @@ class ArdiumDateRangeInputComponent extends _AbstractDateInput {
9089
9125
  return isNull(this.value());
9090
9126
  });
9091
9127
  this.shouldDisplayValue = computed(() => {
9092
- return this.value() instanceof DateRange;
9128
+ return isDateRange(this.value());
9093
9129
  });
9094
9130
  this.shouldDisplayDateInput = computed(() => false);
9095
9131
  this.calendarDaysViewHeaderTemplate = contentChild(ArdDateRangeInputDaysViewHeaderTemplateDirective);
@@ -9185,7 +9221,9 @@ class ArdiumDateRangeInputModule {
9185
9221
  ArdDateRangeInputWeekdayTemplateDirective,
9186
9222
  ArdDateRangeInputYearsViewHeaderTemplateDirective,
9187
9223
  ArdDateRangeInputYearTemplateDirective] }); }
9188
- static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: ArdiumDateRangeInputModule, imports: [CommonModule,
9224
+ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: ArdiumDateRangeInputModule, providers: [
9225
+ { provide: DATE_PIPE_DEFAULT_OPTIONS, useValue: { timezone: '+0000' } },
9226
+ ], imports: [CommonModule,
9189
9227
  ArdiumFormFieldFrameModule,
9190
9228
  ArdiumDropdownPanelModule,
9191
9229
  ArdiumClickOutsideModule,
@@ -9242,6 +9280,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImpo
9242
9280
  ArdDateRangeInputYearsViewHeaderTemplateDirective,
9243
9281
  ArdDateRangeInputYearTemplateDirective,
9244
9282
  ],
9283
+ providers: [
9284
+ { provide: DATE_PIPE_DEFAULT_OPTIONS, useValue: { timezone: '+0000' } },
9285
+ ],
9245
9286
  }]
9246
9287
  }] });
9247
9288
 
@@ -9466,7 +9507,7 @@ class ArdiumMultipageDateRangeInputComponent extends _AbstractDateInput {
9466
9507
  return isNull(this.value());
9467
9508
  });
9468
9509
  this.shouldDisplayValue = computed(() => {
9469
- return this.value() instanceof DateRange;
9510
+ return isDateRange(this.value());
9470
9511
  });
9471
9512
  this.shouldDisplayDateInput = computed(() => false);
9472
9513
  this.calendarDaysViewHeaderTemplate = contentChild(ArdMultipageDateRangeInputDaysViewHeaderTemplateDirective);
@@ -9512,7 +9553,7 @@ class ArdiumMultipageDateRangeInputComponent extends _AbstractDateInput {
9512
9553
  provide: ARD_FORM_FIELD_CONTROL,
9513
9554
  useExisting: ArdiumMultipageDateRangeInputComponent,
9514
9555
  },
9515
- ], queries: [{ propertyName: "calendarDaysViewHeaderTemplate", first: true, predicate: ArdMultipageDateRangeInputDaysViewHeaderTemplateDirective, descendants: true, isSignal: true }, { propertyName: "calendarYearsViewHeaderTemplate", first: true, predicate: ArdMultipageDateRangeInputYearsViewHeaderTemplateDirective, descendants: true, isSignal: true }, { propertyName: "calendarMonthsViewHeaderTemplate", first: true, predicate: ArdMultipageDateRangeInputMonthsViewHeaderTemplateDirective, descendants: true, isSignal: true }, { propertyName: "calendarWeekdayTemplate", first: true, predicate: ArdMultipageDateRangeInputWeekdayTemplateDirective, descendants: true, isSignal: true }, { propertyName: "calendarFloatingMonthTemplate", first: true, predicate: ArdMultipageDateRangeInputFloatingMonthTemplateDirective, descendants: true, isSignal: true }, { propertyName: "calendarYearTemplate", first: true, predicate: ArdMultipageDateRangeInputYearTemplateDirective, descendants: true, isSignal: true }, { propertyName: "calendarMonthTemplate", first: true, predicate: ArdMultipageDateRangeInputMonthTemplateDirective, descendants: true, isSignal: true }, { propertyName: "calendarDayTemplate", first: true, predicate: ArdMultipageDateRangeInputDayTemplateDirective, descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<ard-form-field-frame\r\n [appearance]=\"appearance()\"\r\n [variant]=\"variant()\"\r\n [compact]=\"compact()\"\r\n [readonly]=\"readonly()\"\r\n [isFocused]=\"isFocused()\"\r\n [hasError]=\"hasError()\"\r\n [isSuccess]=\"isSuccess()\"\r\n [prefixTemplate]=\"prefixTemplate()?.template\"\r\n [suffixTemplate]=\"suffixTemplate()?.template\"\r\n>\r\n <div\r\n class=\"ard-date-input ard-multipage-date-range-input\"\r\n #dropdownHost\r\n (click)=\"onGeneralClick($event)\"\r\n [class.ard-has-value]=\"!!value()\"\r\n [ngClass]=\"ngClasses()\"\r\n >\r\n <div class=\"ard-date-input__value-container ard-input-container\">\r\n <div\r\n class=\"ard-date-input__placeholder ard-placeholder\"\r\n [class.ard-date-input__placeholder-hidden]=\"!shouldDisplayPlaceholder()\"\r\n >\r\n {{ placeholder() }}\r\n </div>\r\n <div\r\n class=\"ard-date-input__value\"\r\n [class.ard-date-input__value-hidden]=\"!shouldDisplayValue()\"\r\n >\r\n <ng-template\r\n #defaultValueTemplate\r\n let-date\r\n >\r\n {{ date }}\r\n </ng-template>\r\n\r\n <ng-template\r\n [ngTemplateOutlet]=\"valueTemplate()?.template || defaultValueTemplate\"\r\n [ngTemplateOutletContext]=\"valueContext()\"\r\n />\r\n </div>\r\n </div>\r\n\r\n @if (!calendarHidden()) {\r\n <ard-icon-button\r\n color=\"none\"\r\n [disabled]=\"calendarDisabled()\"\r\n (click)=\"onCalendarButtonClick($event)\"\r\n >\r\n <ng-template\r\n #defaultCalendarIconTemplate\r\n let-date\r\n >\r\n <ard-icon filled>today</ard-icon>\r\n </ng-template>\r\n\r\n <ng-template [ngTemplateOutlet]=\"calendarIconTemplate()?.template || defaultCalendarIconTemplate\" />\r\n </ard-icon-button>\r\n }\r\n </div>\r\n</ard-form-field-frame>\r\n\r\n<ng-template #dropdownTemplate>\r\n <ard-dropdown-panel\r\n class=\"ard-dropdown-panel ard-date-input__dropdown-panel\"\r\n [appearance]=\"dropdownAppearanceOrDefault()\"\r\n [variant]=\"dropdownVariantOrDefault()\"\r\n [isOpen]=\"true\"\r\n [panelId]=\"htmlId()\"\r\n [compact]=\"compact()\"\r\n (ardClickOutside)=\"onOutsideClick($event)\"\r\n >\r\n <div class=\"ard-date-input__multipage-wrapper\">\r\n @for (calendarData of calendarDataArray(); track $index) {\r\n\r\n <ard-range-calendar\r\n class=\"ard-date-input__calendar\"\r\n [activeMonth]=\"calendarData.activeDate.getMonth()\"\r\n [activeYear]=\"calendarData.activeDate.getFullYear()\"\r\n (activePageChange)=\"onActivePageChange($event, $index)\"\r\n (highlightDay)=\"onHighlightDate($event)\"\r\n [highlightedDay]=\"calendarData.highlightedDay\"\r\n [(activeView)]=\"activeView\"\r\n [firstWeekday]=\"firstWeekday()\"\r\n [min]=\"min()\"\r\n [max]=\"max()\"\r\n [UTC]=\"_UTCAfterInit()\"\r\n [autoFocus]=\"$index === 0\"\r\n hideFloatingMonth\r\n staticHeight\r\n [multipleYearPageChangeModifier]=\"multipleYearPageChangeModifier()\"\r\n [color]=\"color()\"\r\n [disabled]=\"disabled() || calendarDisabled()\"\r\n [tabIndex]=\"tabIndex()\"\r\n [value]=\"value()\"\r\n [multiCalendarLocation]=\"calendarData.location\"\r\n [daysViewHeaderDateFormat]=\"calendarDaysViewHeaderDateFormat()\"\r\n [yearsViewHeaderDateFormat]=\"calendarYearsViewHeaderDateFormat()\"\r\n [monthsViewHeaderDateFormat]=\"calendarMonthsViewHeaderDateFormat()\"\r\n [weekdayDateFormat]=\"calendarWeekdayDateFormat()\"\r\n [weekdayTitleDateFormat]=\"calendarWeekdayTitleDateFormat()\"\r\n [yearDateFormat]=\"calendarYearDateFormat()\"\r\n [monthDateFormat]=\"calendarMonthDateFormat()\"\r\n [dayDateFormat]=\"calendarDayDateFormat()\"\r\n (valueChange)=\"onCalendarSelectedChange($event)\"\r\n (yearSelect)=\"yearSelect.emit($event)\"\r\n (monthSelect)=\"monthSelect.emit($event)\"\r\n >\r\n <ng-template\r\n _ard-tmp-repository\r\n [daysViewHeaderTmp]=\"calendarDaysViewHeaderTemplate() ?? { template: defaultDaysViewHeaderTemplate }\"\r\n [yearsViewHeaderTmp]=\"calendarYearsViewHeaderTemplate()\"\r\n [monthsViewHeaderTmp]=\"calendarMonthsViewHeaderTemplate()\"\r\n [weekdayTmp]=\"calendarWeekdayTemplate()\"\r\n [floatingMonthTmp]=\"calendarFloatingMonthTemplate()\"\r\n [yearTmp]=\"calendarYearTemplate()\"\r\n [monthTmp]=\"calendarMonthTemplate()\"\r\n [dayTmp]=\"calendarDayTemplate()\"\r\n />\r\n </ard-range-calendar>\r\n }\r\n </div>\r\n @if (useAcceptButtonToSelect()) {\r\n <div class=\"ard-date-input__accept-buttons-container\">\r\n <ng-template\r\n #defaultAcceptButtonsTemplate\r\n let-accept=\"accept\"\r\n let-cancel=\"cancel\"\r\n let-disabled=\"disabled\"\r\n >\r\n <ard-button\r\n appearance=\"outlined\"\r\n color=\"none\"\r\n [disabled]=\"disabled\"\r\n (click)=\"cancel()\"\r\n >\r\n {{ cancelButtonText() }}\r\n </ard-button>\r\n <ard-button\r\n appearance=\"raised\"\r\n [color]=\"color()\"\r\n [disabled]=\"disabled\"\r\n (click)=\"accept()\"\r\n >\r\n {{ acceptButtonText() }}\r\n </ard-button>\r\n </ng-template>\r\n\r\n <ng-template\r\n [ngTemplateOutlet]=\"acceptButtonsTemplate()?.template || defaultAcceptButtonsTemplate\"\r\n [ngTemplateOutletContext]=\"acceptButtonsContext()\"\r\n />\r\n </div>\r\n }\r\n </ard-dropdown-panel>\r\n</ng-template>\r\n\r\n<ng-template\r\n #defaultDaysViewHeaderTemplate\r\n let-currDate\r\n let-nextMonth=\"nextMonth\"\r\n let-prevMonth=\"prevMonth\"\r\n let-canGoToNextMonth=\"canGoToNextPage\"\r\n let-canGoToPreviousMonth=\"canGoToPreviousPage\"\r\n let-hideNextPageButton=\"hideNextPageButton\"\r\n let-hidePreviousPageButton=\"hidePreviousPageButton\"\r\n>\r\n <div class=\"ard-calendar__calendar-header\">\r\n <div>\r\n @if (!hidePreviousPageButton) {\r\n <ard-icon-button\r\n size=\"small\"\r\n appearance=\"transparent\"\r\n color=\"none\"\r\n (click)=\"prevMonth()\"\r\n [tabIndex]=\"tabIndex()\"\r\n [disabled]=\"!canGoToPreviousMonth\"\r\n >\r\n <ard-icon>chevron_left</ard-icon>\r\n </ard-icon-button>\r\n }\r\n </div>\r\n <span class=\"ard-calendar__header-button\">\r\n {{ currDate | date : calendarDaysViewHeaderDateFormat() | uppercase }}\r\n </span>\r\n <div>\r\n @if (!hideNextPageButton) {\r\n <ard-icon-button\r\n size=\"small\"\r\n appearance=\"transparent\"\r\n color=\"none\"\r\n (click)=\"nextMonth()\"\r\n [tabIndex]=\"tabIndex()\"\r\n [disabled]=\"!canGoToNextMonth\"\r\n >\r\n <ard-icon>chevron_right</ard-icon>\r\n </ard-icon-button>\r\n }\r\n </div>\r\n </div>\r\n</ng-template>\r\n", styles: [".ard-date-input .ard-date-input__placeholder.ard-date-input__placeholder-hidden,.ard-date-input .ard-date-input__value.ard-date-input__value-hidden{display:none}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: ArdiumFormFieldFrameComponent, selector: "ard-form-field-frame", inputs: ["hasError", "isSuccess", "isFocused", "appearance", "variant", "compact", "prefixTemplate", "suffixTemplate"] }, { kind: "component", type: ArdiumDropdownPanelComponent, selector: "ard-dropdown-panel", inputs: ["panelId", "headerTemplate", "footerTemplate", "filterValue", "appearance", "variant", "compact", "isOpen"], outputs: ["scroll", "scrollToEnd"] }, { kind: "directive", type: i4.ArdiumClickOutsideDirective, selector: "[ardClickOutside]", outputs: ["ardClickOutside"] }, { kind: "component", type: ArdiumRangeCalendarComponent, selector: "ard-range-calendar", inputs: ["value"], outputs: ["valueChange", "startSelection"] }, { kind: "component", type: ArdiumIconButtonComponent, selector: "ard-icon-button", inputs: ["wrapperClasses", "type", "ariaLabel", "color", "lightColoring", "compact", "pointerEventsWhenDisabled"] }, { kind: "component", type: ArdiumButtonComponent, selector: "ard-button", inputs: ["variant", "vertical"], outputs: ["focus", "blur"] }, { kind: "component", type: ArdiumIconComponent, selector: "ard-icon", inputs: ["ariaLabel", "icon", "filled", "weight", "grade", "opticalSize"] }, { kind: "directive", type: _CalendarTemplateRepositoryDirective, selector: "ard-calendar > ng-template[_ard-tmp-repository]", inputs: ["daysViewHeaderTmp", "yearsViewHeaderTmp", "monthsViewHeaderTmp", "weekdayTmp", "floatingMonthTmp", "yearTmp", "monthTmp", "dayTmp"] }, { kind: "pipe", type: i1.UpperCasePipe, name: "uppercase" }, { kind: "pipe", type: i1.DatePipe, name: "date" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
9556
+ ], queries: [{ propertyName: "calendarDaysViewHeaderTemplate", first: true, predicate: ArdMultipageDateRangeInputDaysViewHeaderTemplateDirective, descendants: true, isSignal: true }, { propertyName: "calendarYearsViewHeaderTemplate", first: true, predicate: ArdMultipageDateRangeInputYearsViewHeaderTemplateDirective, descendants: true, isSignal: true }, { propertyName: "calendarMonthsViewHeaderTemplate", first: true, predicate: ArdMultipageDateRangeInputMonthsViewHeaderTemplateDirective, descendants: true, isSignal: true }, { propertyName: "calendarWeekdayTemplate", first: true, predicate: ArdMultipageDateRangeInputWeekdayTemplateDirective, descendants: true, isSignal: true }, { propertyName: "calendarFloatingMonthTemplate", first: true, predicate: ArdMultipageDateRangeInputFloatingMonthTemplateDirective, descendants: true, isSignal: true }, { propertyName: "calendarYearTemplate", first: true, predicate: ArdMultipageDateRangeInputYearTemplateDirective, descendants: true, isSignal: true }, { propertyName: "calendarMonthTemplate", first: true, predicate: ArdMultipageDateRangeInputMonthTemplateDirective, descendants: true, isSignal: true }, { propertyName: "calendarDayTemplate", first: true, predicate: ArdMultipageDateRangeInputDayTemplateDirective, descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<ard-form-field-frame\r\n [appearance]=\"appearance()\"\r\n [variant]=\"variant()\"\r\n [compact]=\"compact()\"\r\n [readonly]=\"readonly()\"\r\n [isFocused]=\"isFocused()\"\r\n [hasError]=\"hasError()\"\r\n [isSuccess]=\"isSuccess()\"\r\n [prefixTemplate]=\"prefixTemplate()?.template\"\r\n [suffixTemplate]=\"suffixTemplate()?.template\"\r\n>\r\n <div\r\n class=\"ard-date-input ard-multipage-date-range-input\"\r\n #dropdownHost\r\n (click)=\"onGeneralClick($event)\"\r\n [class.ard-has-value]=\"!!value()\"\r\n [ngClass]=\"ngClasses()\"\r\n >\r\n <div class=\"ard-date-input__value-container ard-input-container\">\r\n <div\r\n class=\"ard-date-input__placeholder ard-placeholder\"\r\n [class.ard-date-input__placeholder-hidden]=\"!shouldDisplayPlaceholder()\"\r\n >\r\n {{ placeholder() }}\r\n </div>\r\n <div\r\n class=\"ard-date-input__value\"\r\n [class.ard-date-input__value-hidden]=\"!shouldDisplayValue()\"\r\n >\r\n <ng-template\r\n #defaultValueTemplate\r\n let-date\r\n >\r\n {{ date }}\r\n </ng-template>\r\n\r\n <ng-template\r\n [ngTemplateOutlet]=\"valueTemplate()?.template || defaultValueTemplate\"\r\n [ngTemplateOutletContext]=\"valueContext()\"\r\n />\r\n </div>\r\n </div>\r\n\r\n @if (!calendarHidden()) {\r\n <ard-icon-button\r\n color=\"none\"\r\n [disabled]=\"calendarDisabled()\"\r\n (click)=\"onCalendarButtonClick($event)\"\r\n >\r\n <ng-template\r\n #defaultCalendarIconTemplate\r\n let-date\r\n >\r\n <ard-icon filled>today</ard-icon>\r\n </ng-template>\r\n\r\n <ng-template [ngTemplateOutlet]=\"calendarIconTemplate()?.template || defaultCalendarIconTemplate\" />\r\n </ard-icon-button>\r\n }\r\n </div>\r\n</ard-form-field-frame>\r\n\r\n<ng-template #dropdownTemplate>\r\n <ard-dropdown-panel\r\n class=\"ard-dropdown-panel ard-date-input__dropdown-panel\"\r\n [appearance]=\"dropdownAppearanceOrDefault()\"\r\n [variant]=\"dropdownVariantOrDefault()\"\r\n [isOpen]=\"true\"\r\n [panelId]=\"htmlId()\"\r\n [compact]=\"compact()\"\r\n (ardClickOutside)=\"onOutsideClick($event)\"\r\n >\r\n <div class=\"ard-date-input__multipage-wrapper\">\r\n @for (calendarData of calendarDataArray(); track $index) {\r\n <ard-range-calendar\r\n class=\"ard-date-input__calendar\"\r\n [activeMonth]=\"calendarData.activeDate.getMonth()\"\r\n [activeYear]=\"calendarData.activeDate.getFullYear()\"\r\n (activePageChange)=\"onActivePageChange($event, $index)\"\r\n (highlightDay)=\"onHighlightDate($event)\"\r\n [highlightedDay]=\"calendarData.highlightedDay\"\r\n [(activeView)]=\"activeView\"\r\n [firstWeekday]=\"firstWeekday()\"\r\n [min]=\"min()\"\r\n [max]=\"max()\"\r\n [UTC]=\"_UTCAfterInit()\"\r\n [autoFocus]=\"$index === 0\"\r\n hideFloatingMonth\r\n staticHeight\r\n [multipleYearPageChangeModifier]=\"multipleYearPageChangeModifier()\"\r\n [color]=\"color()\"\r\n [disabled]=\"disabled() || calendarDisabled()\"\r\n [tabIndex]=\"tabIndex()\"\r\n [value]=\"value()\"\r\n [multiCalendarLocation]=\"calendarData.location\"\r\n [daysViewHeaderDateFormat]=\"calendarDaysViewHeaderDateFormat()\"\r\n [yearsViewHeaderDateFormat]=\"calendarYearsViewHeaderDateFormat()\"\r\n [monthsViewHeaderDateFormat]=\"calendarMonthsViewHeaderDateFormat()\"\r\n [weekdayDateFormat]=\"calendarWeekdayDateFormat()\"\r\n [weekdayTitleDateFormat]=\"calendarWeekdayTitleDateFormat()\"\r\n [yearDateFormat]=\"calendarYearDateFormat()\"\r\n [monthDateFormat]=\"calendarMonthDateFormat()\"\r\n [dayDateFormat]=\"calendarDayDateFormat()\"\r\n (valueChange)=\"onCalendarSelectedChange($event)\"\r\n (yearSelect)=\"yearSelect.emit($event)\"\r\n (monthSelect)=\"monthSelect.emit($event)\"\r\n >\r\n <ng-template\r\n _ard-tmp-repository\r\n [daysViewHeaderTmp]=\"calendarDaysViewHeaderTemplate() ?? { template: defaultDaysViewHeaderTemplate }\"\r\n [yearsViewHeaderTmp]=\"calendarYearsViewHeaderTemplate()\"\r\n [monthsViewHeaderTmp]=\"calendarMonthsViewHeaderTemplate()\"\r\n [weekdayTmp]=\"calendarWeekdayTemplate()\"\r\n [floatingMonthTmp]=\"calendarFloatingMonthTemplate()\"\r\n [yearTmp]=\"calendarYearTemplate()\"\r\n [monthTmp]=\"calendarMonthTemplate()\"\r\n [dayTmp]=\"calendarDayTemplate()\"\r\n />\r\n </ard-range-calendar>\r\n }\r\n </div>\r\n @if (useAcceptButtonToSelect()) {\r\n <div class=\"ard-date-input__accept-buttons-container\">\r\n <ng-template\r\n #defaultAcceptButtonsTemplate\r\n let-accept=\"accept\"\r\n let-cancel=\"cancel\"\r\n let-disabled=\"disabled\"\r\n >\r\n <ard-button\r\n appearance=\"outlined\"\r\n color=\"none\"\r\n [disabled]=\"disabled\"\r\n (click)=\"cancel()\"\r\n >\r\n {{ cancelButtonText() }}\r\n </ard-button>\r\n <ard-button\r\n appearance=\"raised\"\r\n [color]=\"color()\"\r\n [disabled]=\"disabled\"\r\n (click)=\"accept()\"\r\n >\r\n {{ acceptButtonText() }}\r\n </ard-button>\r\n </ng-template>\r\n\r\n <ng-template\r\n [ngTemplateOutlet]=\"acceptButtonsTemplate()?.template || defaultAcceptButtonsTemplate\"\r\n [ngTemplateOutletContext]=\"acceptButtonsContext()\"\r\n />\r\n </div>\r\n }\r\n </ard-dropdown-panel>\r\n</ng-template>\r\n\r\n<ng-template\r\n #defaultDaysViewHeaderTemplate\r\n let-currDate\r\n let-nextMonth=\"nextMonth\"\r\n let-prevMonth=\"prevMonth\"\r\n let-canGoToNextMonth=\"canGoToNextPage\"\r\n let-canGoToPreviousMonth=\"canGoToPreviousPage\"\r\n let-hideNextPageButton=\"hideNextPageButton\"\r\n let-hidePreviousPageButton=\"hidePreviousPageButton\"\r\n>\r\n <div class=\"ard-calendar__calendar-header\">\r\n <div>\r\n @if (!hidePreviousPageButton) {\r\n <ard-icon-button\r\n size=\"small\"\r\n appearance=\"transparent\"\r\n color=\"none\"\r\n (click)=\"prevMonth()\"\r\n [tabIndex]=\"tabIndex()\"\r\n [disabled]=\"!canGoToPreviousMonth\"\r\n >\r\n <ard-icon>chevron_left</ard-icon>\r\n </ard-icon-button>\r\n }\r\n </div>\r\n <span class=\"ard-calendar__header-button\">\r\n {{ currDate | date : calendarDaysViewHeaderDateFormat() | uppercase }}\r\n </span>\r\n <div>\r\n @if (!hideNextPageButton) {\r\n <ard-icon-button\r\n size=\"small\"\r\n appearance=\"transparent\"\r\n color=\"none\"\r\n (click)=\"nextMonth()\"\r\n [tabIndex]=\"tabIndex()\"\r\n [disabled]=\"!canGoToNextMonth\"\r\n >\r\n <ard-icon>chevron_right</ard-icon>\r\n </ard-icon-button>\r\n }\r\n </div>\r\n </div>\r\n</ng-template>\r\n", styles: [".ard-date-input .ard-date-input__placeholder.ard-date-input__placeholder-hidden,.ard-date-input .ard-date-input__value.ard-date-input__value-hidden{display:none}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: ArdiumFormFieldFrameComponent, selector: "ard-form-field-frame", inputs: ["hasError", "isSuccess", "isFocused", "appearance", "variant", "compact", "prefixTemplate", "suffixTemplate"] }, { kind: "component", type: ArdiumDropdownPanelComponent, selector: "ard-dropdown-panel", inputs: ["panelId", "headerTemplate", "footerTemplate", "filterValue", "appearance", "variant", "compact", "isOpen"], outputs: ["scroll", "scrollToEnd"] }, { kind: "directive", type: i4.ArdiumClickOutsideDirective, selector: "[ardClickOutside]", outputs: ["ardClickOutside"] }, { kind: "component", type: ArdiumRangeCalendarComponent, selector: "ard-range-calendar", inputs: ["value"], outputs: ["valueChange", "startSelection"] }, { kind: "component", type: ArdiumIconButtonComponent, selector: "ard-icon-button", inputs: ["wrapperClasses", "type", "ariaLabel", "color", "lightColoring", "compact", "pointerEventsWhenDisabled"] }, { kind: "component", type: ArdiumButtonComponent, selector: "ard-button", inputs: ["variant", "vertical"], outputs: ["focus", "blur"] }, { kind: "component", type: ArdiumIconComponent, selector: "ard-icon", inputs: ["ariaLabel", "icon", "filled", "weight", "grade", "opticalSize"] }, { kind: "directive", type: _CalendarTemplateRepositoryDirective, selector: "ard-calendar > ng-template[_ard-tmp-repository]", inputs: ["daysViewHeaderTmp", "yearsViewHeaderTmp", "monthsViewHeaderTmp", "weekdayTmp", "floatingMonthTmp", "yearTmp", "monthTmp", "dayTmp"] }, { kind: "pipe", type: i1.UpperCasePipe, name: "uppercase" }, { kind: "pipe", type: i1.DatePipe, name: "date" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
9516
9557
  }
9517
9558
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: ArdiumMultipageDateRangeInputComponent, decorators: [{
9518
9559
  type: Component,
@@ -9526,7 +9567,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImpo
9526
9567
  provide: ARD_FORM_FIELD_CONTROL,
9527
9568
  useExisting: ArdiumMultipageDateRangeInputComponent,
9528
9569
  },
9529
- ], template: "<ard-form-field-frame\r\n [appearance]=\"appearance()\"\r\n [variant]=\"variant()\"\r\n [compact]=\"compact()\"\r\n [readonly]=\"readonly()\"\r\n [isFocused]=\"isFocused()\"\r\n [hasError]=\"hasError()\"\r\n [isSuccess]=\"isSuccess()\"\r\n [prefixTemplate]=\"prefixTemplate()?.template\"\r\n [suffixTemplate]=\"suffixTemplate()?.template\"\r\n>\r\n <div\r\n class=\"ard-date-input ard-multipage-date-range-input\"\r\n #dropdownHost\r\n (click)=\"onGeneralClick($event)\"\r\n [class.ard-has-value]=\"!!value()\"\r\n [ngClass]=\"ngClasses()\"\r\n >\r\n <div class=\"ard-date-input__value-container ard-input-container\">\r\n <div\r\n class=\"ard-date-input__placeholder ard-placeholder\"\r\n [class.ard-date-input__placeholder-hidden]=\"!shouldDisplayPlaceholder()\"\r\n >\r\n {{ placeholder() }}\r\n </div>\r\n <div\r\n class=\"ard-date-input__value\"\r\n [class.ard-date-input__value-hidden]=\"!shouldDisplayValue()\"\r\n >\r\n <ng-template\r\n #defaultValueTemplate\r\n let-date\r\n >\r\n {{ date }}\r\n </ng-template>\r\n\r\n <ng-template\r\n [ngTemplateOutlet]=\"valueTemplate()?.template || defaultValueTemplate\"\r\n [ngTemplateOutletContext]=\"valueContext()\"\r\n />\r\n </div>\r\n </div>\r\n\r\n @if (!calendarHidden()) {\r\n <ard-icon-button\r\n color=\"none\"\r\n [disabled]=\"calendarDisabled()\"\r\n (click)=\"onCalendarButtonClick($event)\"\r\n >\r\n <ng-template\r\n #defaultCalendarIconTemplate\r\n let-date\r\n >\r\n <ard-icon filled>today</ard-icon>\r\n </ng-template>\r\n\r\n <ng-template [ngTemplateOutlet]=\"calendarIconTemplate()?.template || defaultCalendarIconTemplate\" />\r\n </ard-icon-button>\r\n }\r\n </div>\r\n</ard-form-field-frame>\r\n\r\n<ng-template #dropdownTemplate>\r\n <ard-dropdown-panel\r\n class=\"ard-dropdown-panel ard-date-input__dropdown-panel\"\r\n [appearance]=\"dropdownAppearanceOrDefault()\"\r\n [variant]=\"dropdownVariantOrDefault()\"\r\n [isOpen]=\"true\"\r\n [panelId]=\"htmlId()\"\r\n [compact]=\"compact()\"\r\n (ardClickOutside)=\"onOutsideClick($event)\"\r\n >\r\n <div class=\"ard-date-input__multipage-wrapper\">\r\n @for (calendarData of calendarDataArray(); track $index) {\r\n\r\n <ard-range-calendar\r\n class=\"ard-date-input__calendar\"\r\n [activeMonth]=\"calendarData.activeDate.getMonth()\"\r\n [activeYear]=\"calendarData.activeDate.getFullYear()\"\r\n (activePageChange)=\"onActivePageChange($event, $index)\"\r\n (highlightDay)=\"onHighlightDate($event)\"\r\n [highlightedDay]=\"calendarData.highlightedDay\"\r\n [(activeView)]=\"activeView\"\r\n [firstWeekday]=\"firstWeekday()\"\r\n [min]=\"min()\"\r\n [max]=\"max()\"\r\n [UTC]=\"_UTCAfterInit()\"\r\n [autoFocus]=\"$index === 0\"\r\n hideFloatingMonth\r\n staticHeight\r\n [multipleYearPageChangeModifier]=\"multipleYearPageChangeModifier()\"\r\n [color]=\"color()\"\r\n [disabled]=\"disabled() || calendarDisabled()\"\r\n [tabIndex]=\"tabIndex()\"\r\n [value]=\"value()\"\r\n [multiCalendarLocation]=\"calendarData.location\"\r\n [daysViewHeaderDateFormat]=\"calendarDaysViewHeaderDateFormat()\"\r\n [yearsViewHeaderDateFormat]=\"calendarYearsViewHeaderDateFormat()\"\r\n [monthsViewHeaderDateFormat]=\"calendarMonthsViewHeaderDateFormat()\"\r\n [weekdayDateFormat]=\"calendarWeekdayDateFormat()\"\r\n [weekdayTitleDateFormat]=\"calendarWeekdayTitleDateFormat()\"\r\n [yearDateFormat]=\"calendarYearDateFormat()\"\r\n [monthDateFormat]=\"calendarMonthDateFormat()\"\r\n [dayDateFormat]=\"calendarDayDateFormat()\"\r\n (valueChange)=\"onCalendarSelectedChange($event)\"\r\n (yearSelect)=\"yearSelect.emit($event)\"\r\n (monthSelect)=\"monthSelect.emit($event)\"\r\n >\r\n <ng-template\r\n _ard-tmp-repository\r\n [daysViewHeaderTmp]=\"calendarDaysViewHeaderTemplate() ?? { template: defaultDaysViewHeaderTemplate }\"\r\n [yearsViewHeaderTmp]=\"calendarYearsViewHeaderTemplate()\"\r\n [monthsViewHeaderTmp]=\"calendarMonthsViewHeaderTemplate()\"\r\n [weekdayTmp]=\"calendarWeekdayTemplate()\"\r\n [floatingMonthTmp]=\"calendarFloatingMonthTemplate()\"\r\n [yearTmp]=\"calendarYearTemplate()\"\r\n [monthTmp]=\"calendarMonthTemplate()\"\r\n [dayTmp]=\"calendarDayTemplate()\"\r\n />\r\n </ard-range-calendar>\r\n }\r\n </div>\r\n @if (useAcceptButtonToSelect()) {\r\n <div class=\"ard-date-input__accept-buttons-container\">\r\n <ng-template\r\n #defaultAcceptButtonsTemplate\r\n let-accept=\"accept\"\r\n let-cancel=\"cancel\"\r\n let-disabled=\"disabled\"\r\n >\r\n <ard-button\r\n appearance=\"outlined\"\r\n color=\"none\"\r\n [disabled]=\"disabled\"\r\n (click)=\"cancel()\"\r\n >\r\n {{ cancelButtonText() }}\r\n </ard-button>\r\n <ard-button\r\n appearance=\"raised\"\r\n [color]=\"color()\"\r\n [disabled]=\"disabled\"\r\n (click)=\"accept()\"\r\n >\r\n {{ acceptButtonText() }}\r\n </ard-button>\r\n </ng-template>\r\n\r\n <ng-template\r\n [ngTemplateOutlet]=\"acceptButtonsTemplate()?.template || defaultAcceptButtonsTemplate\"\r\n [ngTemplateOutletContext]=\"acceptButtonsContext()\"\r\n />\r\n </div>\r\n }\r\n </ard-dropdown-panel>\r\n</ng-template>\r\n\r\n<ng-template\r\n #defaultDaysViewHeaderTemplate\r\n let-currDate\r\n let-nextMonth=\"nextMonth\"\r\n let-prevMonth=\"prevMonth\"\r\n let-canGoToNextMonth=\"canGoToNextPage\"\r\n let-canGoToPreviousMonth=\"canGoToPreviousPage\"\r\n let-hideNextPageButton=\"hideNextPageButton\"\r\n let-hidePreviousPageButton=\"hidePreviousPageButton\"\r\n>\r\n <div class=\"ard-calendar__calendar-header\">\r\n <div>\r\n @if (!hidePreviousPageButton) {\r\n <ard-icon-button\r\n size=\"small\"\r\n appearance=\"transparent\"\r\n color=\"none\"\r\n (click)=\"prevMonth()\"\r\n [tabIndex]=\"tabIndex()\"\r\n [disabled]=\"!canGoToPreviousMonth\"\r\n >\r\n <ard-icon>chevron_left</ard-icon>\r\n </ard-icon-button>\r\n }\r\n </div>\r\n <span class=\"ard-calendar__header-button\">\r\n {{ currDate | date : calendarDaysViewHeaderDateFormat() | uppercase }}\r\n </span>\r\n <div>\r\n @if (!hideNextPageButton) {\r\n <ard-icon-button\r\n size=\"small\"\r\n appearance=\"transparent\"\r\n color=\"none\"\r\n (click)=\"nextMonth()\"\r\n [tabIndex]=\"tabIndex()\"\r\n [disabled]=\"!canGoToNextMonth\"\r\n >\r\n <ard-icon>chevron_right</ard-icon>\r\n </ard-icon-button>\r\n }\r\n </div>\r\n </div>\r\n</ng-template>\r\n", styles: [".ard-date-input .ard-date-input__placeholder.ard-date-input__placeholder-hidden,.ard-date-input .ard-date-input__value.ard-date-input__value-hidden{display:none}\n"] }]
9570
+ ], template: "<ard-form-field-frame\r\n [appearance]=\"appearance()\"\r\n [variant]=\"variant()\"\r\n [compact]=\"compact()\"\r\n [readonly]=\"readonly()\"\r\n [isFocused]=\"isFocused()\"\r\n [hasError]=\"hasError()\"\r\n [isSuccess]=\"isSuccess()\"\r\n [prefixTemplate]=\"prefixTemplate()?.template\"\r\n [suffixTemplate]=\"suffixTemplate()?.template\"\r\n>\r\n <div\r\n class=\"ard-date-input ard-multipage-date-range-input\"\r\n #dropdownHost\r\n (click)=\"onGeneralClick($event)\"\r\n [class.ard-has-value]=\"!!value()\"\r\n [ngClass]=\"ngClasses()\"\r\n >\r\n <div class=\"ard-date-input__value-container ard-input-container\">\r\n <div\r\n class=\"ard-date-input__placeholder ard-placeholder\"\r\n [class.ard-date-input__placeholder-hidden]=\"!shouldDisplayPlaceholder()\"\r\n >\r\n {{ placeholder() }}\r\n </div>\r\n <div\r\n class=\"ard-date-input__value\"\r\n [class.ard-date-input__value-hidden]=\"!shouldDisplayValue()\"\r\n >\r\n <ng-template\r\n #defaultValueTemplate\r\n let-date\r\n >\r\n {{ date }}\r\n </ng-template>\r\n\r\n <ng-template\r\n [ngTemplateOutlet]=\"valueTemplate()?.template || defaultValueTemplate\"\r\n [ngTemplateOutletContext]=\"valueContext()\"\r\n />\r\n </div>\r\n </div>\r\n\r\n @if (!calendarHidden()) {\r\n <ard-icon-button\r\n color=\"none\"\r\n [disabled]=\"calendarDisabled()\"\r\n (click)=\"onCalendarButtonClick($event)\"\r\n >\r\n <ng-template\r\n #defaultCalendarIconTemplate\r\n let-date\r\n >\r\n <ard-icon filled>today</ard-icon>\r\n </ng-template>\r\n\r\n <ng-template [ngTemplateOutlet]=\"calendarIconTemplate()?.template || defaultCalendarIconTemplate\" />\r\n </ard-icon-button>\r\n }\r\n </div>\r\n</ard-form-field-frame>\r\n\r\n<ng-template #dropdownTemplate>\r\n <ard-dropdown-panel\r\n class=\"ard-dropdown-panel ard-date-input__dropdown-panel\"\r\n [appearance]=\"dropdownAppearanceOrDefault()\"\r\n [variant]=\"dropdownVariantOrDefault()\"\r\n [isOpen]=\"true\"\r\n [panelId]=\"htmlId()\"\r\n [compact]=\"compact()\"\r\n (ardClickOutside)=\"onOutsideClick($event)\"\r\n >\r\n <div class=\"ard-date-input__multipage-wrapper\">\r\n @for (calendarData of calendarDataArray(); track $index) {\r\n <ard-range-calendar\r\n class=\"ard-date-input__calendar\"\r\n [activeMonth]=\"calendarData.activeDate.getMonth()\"\r\n [activeYear]=\"calendarData.activeDate.getFullYear()\"\r\n (activePageChange)=\"onActivePageChange($event, $index)\"\r\n (highlightDay)=\"onHighlightDate($event)\"\r\n [highlightedDay]=\"calendarData.highlightedDay\"\r\n [(activeView)]=\"activeView\"\r\n [firstWeekday]=\"firstWeekday()\"\r\n [min]=\"min()\"\r\n [max]=\"max()\"\r\n [UTC]=\"_UTCAfterInit()\"\r\n [autoFocus]=\"$index === 0\"\r\n hideFloatingMonth\r\n staticHeight\r\n [multipleYearPageChangeModifier]=\"multipleYearPageChangeModifier()\"\r\n [color]=\"color()\"\r\n [disabled]=\"disabled() || calendarDisabled()\"\r\n [tabIndex]=\"tabIndex()\"\r\n [value]=\"value()\"\r\n [multiCalendarLocation]=\"calendarData.location\"\r\n [daysViewHeaderDateFormat]=\"calendarDaysViewHeaderDateFormat()\"\r\n [yearsViewHeaderDateFormat]=\"calendarYearsViewHeaderDateFormat()\"\r\n [monthsViewHeaderDateFormat]=\"calendarMonthsViewHeaderDateFormat()\"\r\n [weekdayDateFormat]=\"calendarWeekdayDateFormat()\"\r\n [weekdayTitleDateFormat]=\"calendarWeekdayTitleDateFormat()\"\r\n [yearDateFormat]=\"calendarYearDateFormat()\"\r\n [monthDateFormat]=\"calendarMonthDateFormat()\"\r\n [dayDateFormat]=\"calendarDayDateFormat()\"\r\n (valueChange)=\"onCalendarSelectedChange($event)\"\r\n (yearSelect)=\"yearSelect.emit($event)\"\r\n (monthSelect)=\"monthSelect.emit($event)\"\r\n >\r\n <ng-template\r\n _ard-tmp-repository\r\n [daysViewHeaderTmp]=\"calendarDaysViewHeaderTemplate() ?? { template: defaultDaysViewHeaderTemplate }\"\r\n [yearsViewHeaderTmp]=\"calendarYearsViewHeaderTemplate()\"\r\n [monthsViewHeaderTmp]=\"calendarMonthsViewHeaderTemplate()\"\r\n [weekdayTmp]=\"calendarWeekdayTemplate()\"\r\n [floatingMonthTmp]=\"calendarFloatingMonthTemplate()\"\r\n [yearTmp]=\"calendarYearTemplate()\"\r\n [monthTmp]=\"calendarMonthTemplate()\"\r\n [dayTmp]=\"calendarDayTemplate()\"\r\n />\r\n </ard-range-calendar>\r\n }\r\n </div>\r\n @if (useAcceptButtonToSelect()) {\r\n <div class=\"ard-date-input__accept-buttons-container\">\r\n <ng-template\r\n #defaultAcceptButtonsTemplate\r\n let-accept=\"accept\"\r\n let-cancel=\"cancel\"\r\n let-disabled=\"disabled\"\r\n >\r\n <ard-button\r\n appearance=\"outlined\"\r\n color=\"none\"\r\n [disabled]=\"disabled\"\r\n (click)=\"cancel()\"\r\n >\r\n {{ cancelButtonText() }}\r\n </ard-button>\r\n <ard-button\r\n appearance=\"raised\"\r\n [color]=\"color()\"\r\n [disabled]=\"disabled\"\r\n (click)=\"accept()\"\r\n >\r\n {{ acceptButtonText() }}\r\n </ard-button>\r\n </ng-template>\r\n\r\n <ng-template\r\n [ngTemplateOutlet]=\"acceptButtonsTemplate()?.template || defaultAcceptButtonsTemplate\"\r\n [ngTemplateOutletContext]=\"acceptButtonsContext()\"\r\n />\r\n </div>\r\n }\r\n </ard-dropdown-panel>\r\n</ng-template>\r\n\r\n<ng-template\r\n #defaultDaysViewHeaderTemplate\r\n let-currDate\r\n let-nextMonth=\"nextMonth\"\r\n let-prevMonth=\"prevMonth\"\r\n let-canGoToNextMonth=\"canGoToNextPage\"\r\n let-canGoToPreviousMonth=\"canGoToPreviousPage\"\r\n let-hideNextPageButton=\"hideNextPageButton\"\r\n let-hidePreviousPageButton=\"hidePreviousPageButton\"\r\n>\r\n <div class=\"ard-calendar__calendar-header\">\r\n <div>\r\n @if (!hidePreviousPageButton) {\r\n <ard-icon-button\r\n size=\"small\"\r\n appearance=\"transparent\"\r\n color=\"none\"\r\n (click)=\"prevMonth()\"\r\n [tabIndex]=\"tabIndex()\"\r\n [disabled]=\"!canGoToPreviousMonth\"\r\n >\r\n <ard-icon>chevron_left</ard-icon>\r\n </ard-icon-button>\r\n }\r\n </div>\r\n <span class=\"ard-calendar__header-button\">\r\n {{ currDate | date : calendarDaysViewHeaderDateFormat() | uppercase }}\r\n </span>\r\n <div>\r\n @if (!hideNextPageButton) {\r\n <ard-icon-button\r\n size=\"small\"\r\n appearance=\"transparent\"\r\n color=\"none\"\r\n (click)=\"nextMonth()\"\r\n [tabIndex]=\"tabIndex()\"\r\n [disabled]=\"!canGoToNextMonth\"\r\n >\r\n <ard-icon>chevron_right</ard-icon>\r\n </ard-icon-button>\r\n }\r\n </div>\r\n </div>\r\n</ng-template>\r\n", styles: [".ard-date-input .ard-date-input__placeholder.ard-date-input__placeholder-hidden,.ard-date-input .ard-date-input__value.ard-date-input__value-hidden{display:none}\n"] }]
9530
9571
  }], ctorParameters: () => [{ type: undefined, decorators: [{
9531
9572
  type: Inject,
9532
9573
  args: [ARD_DATE_INPUT_DEFAULTS]
@@ -9571,7 +9612,9 @@ class ArdiumMultipageDateRangeInputModule {
9571
9612
  ArdMultipageDateRangeInputWeekdayTemplateDirective,
9572
9613
  ArdMultipageDateRangeInputYearsViewHeaderTemplateDirective,
9573
9614
  ArdMultipageDateRangeInputYearTemplateDirective] }); }
9574
- static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: ArdiumMultipageDateRangeInputModule, imports: [CommonModule,
9615
+ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: ArdiumMultipageDateRangeInputModule, providers: [
9616
+ { provide: DATE_PIPE_DEFAULT_OPTIONS, useValue: { timezone: '+0000' } },
9617
+ ], imports: [CommonModule,
9575
9618
  ArdiumFormFieldFrameModule,
9576
9619
  ArdiumDropdownPanelModule,
9577
9620
  ArdiumClickOutsideModule,
@@ -9628,6 +9671,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImpo
9628
9671
  ArdMultipageDateRangeInputYearsViewHeaderTemplateDirective,
9629
9672
  ArdMultipageDateRangeInputYearTemplateDirective,
9630
9673
  ],
9674
+ providers: [
9675
+ { provide: DATE_PIPE_DEFAULT_OPTIONS, useValue: { timezone: '+0000' } },
9676
+ ],
9631
9677
  }]
9632
9678
  }] });
9633
9679
 
@@ -17346,5 +17392,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImpo
17346
17392
  * Generated bundle index. Do not edit.
17347
17393
  */
17348
17394
 
17349
- export { ARD_BADGE_DEFAULTS, ARD_BREAKPOINTS, ARD_BUTTON_DEFAULTS, ARD_CALENDAR_DEFAULTS, ARD_CARD_DEFAULTS, ARD_CHECKBOX_DEFAULTS, ARD_CHECKBOX_LIST_DEFAULTS, ARD_CHIP_DEFAULTS, ARD_DATE_INPUT_DEFAULTS, ARD_DELETABLE_CHIP_DEFAULTS, ARD_DIALOG_DEFAULTS, ARD_DIGIT_INPUT_DEFAULTS, ARD_DIVIDER_DEFAULTS, ARD_DROPDOWN_PANEL_DEFAULTS, ARD_ERROR_MAP, ARD_FAB_DEFAULTS, ARD_FILE_DROP_AREA_DEFAULTS, ARD_FILE_INPUT_DEFAULTS, ARD_FORM_FIELD_CONTROL, ARD_FORM_FIELD_DEFAULTS, ARD_FORM_FIELD_FRAME_DEFAULTS, ARD_GRID_DEFAULTS, ARD_HEX_INPUT_DEFAULTS, ARD_ICON_BUTTON_DEFAULTS, ARD_ICON_DEFAULTS, ARD_KBD_DEFAULTS, ARD_KBD_SHORTCUT_DEFAULTS, ARD_MODAL_DEFAULTS, ARD_NUMBER_INPUT_DEFAULTS, ARD_PASSWORD_INPUT_DEFAULTS, ARD_PROGRESS_BAR_DEFAULTS, ARD_PROGRESS_CIRCLE_DEFAULTS, ARD_RADIO_DEFAULTS, ARD_RATING_DISPLAY_DEFAULTS, ARD_RATING_INPUT_DEFAULTS, ARD_SEGMENT_DEFAULTS, ARD_SELECTABLE_CHIP_DEFAULTS, ARD_SELECT_DEFAULTS, ARD_SIMPLE_INPUT_DEFAULTS, ARD_SLIDER_DEFAULTS, ARD_SLIDE_TOGGLE_DEFAULTS, ARD_SNACKBAR_ANIMATION_LENGTH, ARD_SNACKBAR_DATA, ARD_SNACKBAR_DEFAULTS, ARD_SPINNER_DEFAULTS, ARD_STAR_BUTTON_DEFAULTS, ARD_STAR_DEFAULTS, ARD_STATEBOX_DEFAULTS, ARD_TABBER_DEFAULTS, ARD_TABLE_DEFAULTS, ARD_TABLE_FROM_CSV_DEFAULTS, ARD_TABLE_PAGINATION_DEFAULTS, ArdAddCustomTemplateDirective, ArdAutocompleteInputLoadingTemplateDirective, ArdAutocompleteInputPlaceholderTemplateDirective, ArdAutocompleteInputPrefixTemplateDirective, ArdAutocompleteInputSuffixTemplateDirective, ArdAutocompleteInputSuggestionTemplateDirective, ArdCalendarDayTemplateDirective, ArdCalendarDaysViewHeaderTemplateDirective, ArdCalendarFloatingMonthTemplateDirective, ArdCalendarMonthTemplateDirective, ArdCalendarMonthsViewHeaderTemplateDirective, ArdCalendarView, ArdCalendarWeekdayTemplateDirective, ArdCalendarYearTemplateDirective, ArdCalendarYearsViewHeaderTemplateDirective, ArdCheckboxListCheckboxTemplateDirective, ArdCheckboxListLabelTemplateDirective, ArdCheckboxTemplateDirective, ArdDateInputAcceptButtonsTemplateDirective, ArdDateInputCalendarIconTemplateDirective, ArdDateInputDayTemplateDirective, ArdDateInputDaysViewHeaderTemplateDirective, ArdDateInputFloatingMonthTemplateDirective, ArdDateInputMinMaxStrategy, ArdDateInputMonthTemplateDirective, ArdDateInputMonthsViewHeaderTemplateDirective, ArdDateInputPrefixTemplateDirective, ArdDateInputSuffixTemplateDirective, ArdDateInputValueTemplateDirective, ArdDateInputWeekdayTemplateDirective, ArdDateInputYearTemplateDirective, ArdDateInputYearsViewHeaderTemplateDirective, ArdDateRangeInputAcceptButtonsTemplateDirective, ArdDateRangeInputCalendarIconTemplateDirective, ArdDateRangeInputDayTemplateDirective, ArdDateRangeInputDaysViewHeaderTemplateDirective, ArdDateRangeInputFloatingMonthTemplateDirective, ArdDateRangeInputMonthTemplateDirective, ArdDateRangeInputMonthsViewHeaderTemplateDirective, ArdDateRangeInputPrefixTemplateDirective, ArdDateRangeInputSuffixTemplateDirective, ArdDateRangeInputValueTemplateDirective, ArdDateRangeInputWeekdayTemplateDirective, ArdDateRangeInputYearTemplateDirective, ArdDateRangeInputYearsViewHeaderTemplateDirective, ArdDialogActionType, ArdDialogButtonsTemplateDirective, ArdDialogCloseIconTemplateDirective, ArdDialogResult, ArdDropdownFooterTemplateDirective, ArdDropdownHeaderTemplateDirective, ArdFileInputPlaceholderTemplateDirective, ArdFileInputPrefixTemplateDirective, ArdFileInputSuffixTemplateDirective, ArdFormFieldPrefixTemplateDirective, ArdFormFieldSuffixTemplateDirective, ArdGridAlign, ArdGridDirection, ArdGridJustify, ArdGridSize, ArdGridWrap, ArdHexInputPlaceholderTemplateDirective, ArdHexInputPrefixTemplateDirective, ArdHexInputSuffixTemplateDirective, ArdInputPlaceholderTemplateDirective, ArdInputPrefixTemplateDirective, ArdInputSuffixTemplateDirective, ArdItemDisplayLimitTemplateDirective, ArdItemLimitReachedTemplateDirective, ArdLoadingPlaceholderTemplateDirective, ArdLoadingSpinnerTemplateDirective, ArdModalCloseIconTemplateDirective, ArdMultiCalendarLocation, ArdMultipageDateRangeInputAcceptButtonsTemplateDirective, ArdMultipageDateRangeInputCalendarIconTemplateDirective, ArdMultipageDateRangeInputDayTemplateDirective, ArdMultipageDateRangeInputDaysViewHeaderTemplateDirective, ArdMultipageDateRangeInputFloatingMonthTemplateDirective, ArdMultipageDateRangeInputMonthTemplateDirective, ArdMultipageDateRangeInputMonthsViewHeaderTemplateDirective, ArdMultipageDateRangeInputPrefixTemplateDirective, ArdMultipageDateRangeInputSuffixTemplateDirective, ArdMultipageDateRangeInputValueTemplateDirective, ArdMultipageDateRangeInputWeekdayTemplateDirective, ArdMultipageDateRangeInputYearTemplateDirective, ArdMultipageDateRangeInputYearsViewHeaderTemplateDirective, ArdNoItemsFoundTemplateDirective, ArdNumberInputPlaceholderTemplateDirective, ArdNumberInputPrefixTemplateDirective, ArdNumberInputSuffixTemplateDirective, ArdOptgroupTemplateDirective, ArdOptionTemplateDirective, ArdPanelPosition, ArdPasswordInputPlaceholderTemplateDirective, ArdPasswordInputPrefixTemplateDirective, ArdPasswordInputRevealButtonTemplateDirective, ArdPasswordInputSuffixTemplateDirective, ArdProgressBarValueTemplateDirective, ArdProgressCircleValueTemplateDirective, ArdRangeCalendarDayTemplateDirective, ArdRangeCalendarDaysViewHeaderTemplateDirective, ArdRangeCalendarFloatingMonthTemplateDirective, ArdRangeCalendarMonthTemplateDirective, ArdRangeCalendarMonthsViewHeaderTemplateDirective, ArdRangeCalendarWeekdayTemplateDirective, ArdRangeCalendarYearTemplateDirective, ArdRangeCalendarYearsViewHeaderTemplateDirective, ArdRangeSelectionBehavior, ArdRatingDisplayStarTemplateDirective, ArdRatingInputStarButtonTemplateDirective, searchFunctions as ArdSearchFunction, ArdSegmentOptionTemplateDirective, ArdSelectDropdownArrowTemplateDirective, ArdSelectPlaceholderTemplateDirective, ArdSelectPrefixTemplateDirective, ArdSelectSuffixTemplateDirective, ArdSlideToggleAppearance, ArdSliderTooltipDirective, ArdSnackbarAlignment, ArdSnackbarOriginRelation, ArdSnackbarQueueHandling, ArdSnackbarRef, ArdSnackbarType, ArdStarButtonStarTemplateDirective, ArdStarIconTemplateDirective, ArdTabberLabelTemplateDirective, ArdValueChipTemplateDirective, ArdValueTemplateDirective, ArdiumAutoErrorComponent, ArdiumAutocompleteInputComponent, ArdiumAutocompleteInputModule, ArdiumBadgeDirective, ArdiumBadgeModule, ArdiumBreakpointService, ArdiumButtonComponent, ArdiumButtonDirective, ArdiumButtonModule, ArdiumCalendarComponent, ArdiumCalendarModule, ArdiumCardActionButtonsDirective, ArdiumCardAvatarDirective, ArdiumCardComponent, ArdiumCardContentDirective, ArdiumCardDirective, ArdiumCardFooterDirective, ArdiumCardHeaderComponent, ArdiumCardImageDirective, ArdiumCardModule, ArdiumCardSubtitleDirective, ArdiumCardTitleDirective, ArdiumCheckboxComponent, ArdiumCheckboxListComponent, ArdiumCheckboxListModule, ArdiumCheckboxModule, ArdiumChipComponent, ArdiumChipModule, ArdiumDateInputComponent, ArdiumDateInputModule, ArdiumDateRangeInputComponent, ArdiumDateRangeInputModule, ArdiumDeletableChipComponent, ArdiumDialogComponent, ArdiumDialogModule, ArdiumDigitInputComponent, ArdiumDigitInputModule, ArdiumDividerComponent, ArdiumDividerModule, ArdiumDropdownPanelComponent, ArdiumDropdownPanelModule, ArdiumErrorComponent, ArdiumErrorDirective, ArdiumFabComponent, ArdiumFabModule, ArdiumFileDropAreaComponent, ArdiumFileDropAreaDragoverContentTemplateDirective, ArdiumFileDropAreaIdleContentTemplateDirective, ArdiumFileDropAreaModule, ArdiumFileDropAreaUploadedContentTemplateDirective, ArdiumFileInputComponent, ArdiumFileInputDragoverContentTemplateDirective, ArdiumFileInputFolderIconTemplateDirective, ArdiumFileInputIdleContentTemplateDirective, ArdiumFileInputModule, ArdiumFileInputUploadedContentTemplateDirective, ArdiumFormFieldComponent, ArdiumFormFieldFrameComponent, ArdiumFormFieldFrameModule, ArdiumFormFieldModule, ArdiumFormFieldNativeInputAdapterDirective, ArdiumGridComponent, ArdiumGridModule, ArdiumHexInputComponent, ArdiumHexInputModule, ArdiumHintComponent, ArdiumHintDirective, ArdiumHintErrorComponent, ArdiumHintErrorDirective, ArdiumHorizontalFormFieldComponent, ArdiumIconButtonComponent, ArdiumIconButtonModule, ArdiumIconComponent, ArdiumIconModule, ArdiumIconPipe, ArdiumInputComponent, ArdiumInputModule, ArdiumKbdComponent, ArdiumKbdDirective, ArdiumKbdModule, ArdiumKbdPipe, ArdiumKbdShortcutComponent, ArdiumKbdShortcutModule, ArdiumLabelComponent, ArdiumModalComponent, ArdiumModalModule, ArdiumMultipageDateRangeInputComponent, ArdiumMultipageDateRangeInputModule, ArdiumNumberInputComponent, ArdiumNumberInputModule, ArdiumOptionComponent, ArdiumOptionModule, ArdiumPasswordInputComponent, ArdiumPasswordInputModule, ArdiumProgressBarComponent, ArdiumProgressBarModule, ArdiumProgressCircleComponent, ArdiumProgressCircleModule, ArdiumRadioComponent, ArdiumRadioGroupComponent, ArdiumRadioModule, ArdiumRangeCalendarComponent, ArdiumRangeCalendarModule, ArdiumRangeSliderComponent, ArdiumRangeSliderModule, ArdiumRatingDisplayComponent, ArdiumRatingDisplayModule, ArdiumRatingInputComponent, ArdiumRatingInputModule, ArdiumSegmentComponent, ArdiumSegmentModule, ArdiumSelectComponent, ArdiumSelectModule, ArdiumSelectableChipComponent, ArdiumSlideToggleComponent, ArdiumSlideToggleModule, ArdiumSliderComponent, ArdiumSliderModule, ArdiumSnackbarService, ArdiumSpinnerComponent, ArdiumSpinnerModule, ArdiumStarButtonComponent, ArdiumStarButtonModule, ArdiumStarComponent, ArdiumStarModule, ArdiumStateboxComponent, ArdiumStateboxModule, ArdiumTabComponent, ArdiumTabberComponent, ArdiumTabberModule, ArdiumTableCaptionTemplateDirective, ArdiumTableCheckboxTemplateDirective, ArdiumTableComponent, ArdiumTableFromCsvComponent, ArdiumTableFromCsvModule, ArdiumTableHeaderCheckboxTemplateDirective, ArdiumTableModule, ArdiumTablePaginationComponent, ArdiumTablePaginationModule, ArdiumTablePaginationTemplateDirective, ArdiumTableTemplateDirective, ArdiumTextListComponent, ArdiumTextListModule, ArdiumTextListPipe, BadgePosition, BadgeSize, ButtonAppearance, ButtonVariant, CardAppearance, CardVariant, CheckboxListAlignType, CheckboxState, ClickStrategy, ComponentColor, DateRange, DecorationElementAppearance, DigitInputPrimitiveOption, DigitInputShape, DropdownPanelAppearance, DropdownPanelVariant, FabSize, FormElementAppearance, FormElementVariant, OneAxisAlignment, OutlinedAppearance, PaginationAlign, PanelAppearance, PanelVariant, ProgressBarAppearance, ProgressBarMode, ProgressBarSize, ProgressBarVariant, ProgressCircleAppearance, ProgressCircleVariant, SegmentAppearance, SegmentVariant, SimpleComponentColor, SimpleOneAxisAlignment, SliderDecorationPosition, SliderTooltipBehavior, SortType, StarColor, StarFillMode, TableAlignType, TableAppearance, TablePaginationStrategy, TableVariant, TransformType, _chipDefaults, _modalDefaults, isArdGridAlign, isArdGridDirection, isArdGridJustify, isArdGridSize, isArdGridWrap, provideBadgeDefaults, provideBreakpoints, provideButtonDefaults, provideCalendarDefaults, provideCardDefaults, provideCheckboxDefaults, provideCheckboxListDefaults, provideChipDefaults, provideDateInputDefaults, provideDeletableChipDefaults, provideDialogDefaults, provideDigitInputDefaults, provideDividerDefaults, provideDropdownPanelDefaults, provideErrorMap, provideFabDefaults, provideFileDropAreaDefaults, provideFileInputDefaults, provideFormFieldDefaults, provideFormFieldFrameDefaults, provideGridDefaults, provideHexInputDefaults, provideIconButtonDefaults, provideIconDefaults, provideInputDefaults, provideKbdDefaults, provideKbdShortcutDefaults, provideModalDefaults, provideNumberInputDefaults, providePasswordInputDefaults, provideProgressBarDefaults, provideProgressCircleDefaults, provideRadioDefaults, provideRatingDisplayDefaults, provideRatingInputDefaults, provideSegmentDefaults, provideSelectDefaults, provideSelectableChipDefaults, provideSlideToggleDefaults, provideSliderDefaults, provideSnackbarDefaults, provideSpinnerDefaults, provideStarButtonDefaults, provideStarDefaults, provideStateboxDefaults, provideTabberDefaults, provideTableDefaults, provideTableFromCsvDefaults, provideTablePaginationDefaults, searchInString, trackFormControl };
17395
+ export { ARD_BADGE_DEFAULTS, ARD_BREAKPOINTS, ARD_BUTTON_DEFAULTS, ARD_CALENDAR_DEFAULTS, ARD_CARD_DEFAULTS, ARD_CHECKBOX_DEFAULTS, ARD_CHECKBOX_LIST_DEFAULTS, ARD_CHIP_DEFAULTS, ARD_DATE_INPUT_DEFAULTS, ARD_DELETABLE_CHIP_DEFAULTS, ARD_DIALOG_DEFAULTS, ARD_DIGIT_INPUT_DEFAULTS, ARD_DIVIDER_DEFAULTS, ARD_DROPDOWN_PANEL_DEFAULTS, ARD_ERROR_MAP, ARD_FAB_DEFAULTS, ARD_FILE_DROP_AREA_DEFAULTS, ARD_FILE_INPUT_DEFAULTS, ARD_FORM_FIELD_CONTROL, ARD_FORM_FIELD_DEFAULTS, ARD_FORM_FIELD_FRAME_DEFAULTS, ARD_GRID_DEFAULTS, ARD_HEX_INPUT_DEFAULTS, ARD_ICON_BUTTON_DEFAULTS, ARD_ICON_DEFAULTS, ARD_KBD_DEFAULTS, ARD_KBD_SHORTCUT_DEFAULTS, ARD_MODAL_DEFAULTS, ARD_NUMBER_INPUT_DEFAULTS, ARD_PASSWORD_INPUT_DEFAULTS, ARD_PROGRESS_BAR_DEFAULTS, ARD_PROGRESS_CIRCLE_DEFAULTS, ARD_RADIO_DEFAULTS, ARD_RATING_DISPLAY_DEFAULTS, ARD_RATING_INPUT_DEFAULTS, ARD_SEGMENT_DEFAULTS, ARD_SELECTABLE_CHIP_DEFAULTS, ARD_SELECT_DEFAULTS, ARD_SIMPLE_INPUT_DEFAULTS, ARD_SLIDER_DEFAULTS, ARD_SLIDE_TOGGLE_DEFAULTS, ARD_SNACKBAR_ANIMATION_LENGTH, ARD_SNACKBAR_DATA, ARD_SNACKBAR_DEFAULTS, ARD_SPINNER_DEFAULTS, ARD_STAR_BUTTON_DEFAULTS, ARD_STAR_DEFAULTS, ARD_STATEBOX_DEFAULTS, ARD_TABBER_DEFAULTS, ARD_TABLE_DEFAULTS, ARD_TABLE_FROM_CSV_DEFAULTS, ARD_TABLE_PAGINATION_DEFAULTS, ArdAddCustomTemplateDirective, ArdAutocompleteInputLoadingTemplateDirective, ArdAutocompleteInputPlaceholderTemplateDirective, ArdAutocompleteInputPrefixTemplateDirective, ArdAutocompleteInputSuffixTemplateDirective, ArdAutocompleteInputSuggestionTemplateDirective, ArdCalendarDayTemplateDirective, ArdCalendarDaysViewHeaderTemplateDirective, ArdCalendarFloatingMonthTemplateDirective, ArdCalendarMonthTemplateDirective, ArdCalendarMonthsViewHeaderTemplateDirective, ArdCalendarView, ArdCalendarWeekdayTemplateDirective, ArdCalendarYearTemplateDirective, ArdCalendarYearsViewHeaderTemplateDirective, ArdCheckboxListCheckboxTemplateDirective, ArdCheckboxListLabelTemplateDirective, ArdCheckboxTemplateDirective, ArdDateInputAcceptButtonsTemplateDirective, ArdDateInputCalendarIconTemplateDirective, ArdDateInputDayTemplateDirective, ArdDateInputDaysViewHeaderTemplateDirective, ArdDateInputFloatingMonthTemplateDirective, ArdDateInputMinMaxStrategy, ArdDateInputMonthTemplateDirective, ArdDateInputMonthsViewHeaderTemplateDirective, ArdDateInputPrefixTemplateDirective, ArdDateInputSuffixTemplateDirective, ArdDateInputValueTemplateDirective, ArdDateInputWeekdayTemplateDirective, ArdDateInputYearTemplateDirective, ArdDateInputYearsViewHeaderTemplateDirective, ArdDateRangeInputAcceptButtonsTemplateDirective, ArdDateRangeInputCalendarIconTemplateDirective, ArdDateRangeInputDayTemplateDirective, ArdDateRangeInputDaysViewHeaderTemplateDirective, ArdDateRangeInputFloatingMonthTemplateDirective, ArdDateRangeInputMonthTemplateDirective, ArdDateRangeInputMonthsViewHeaderTemplateDirective, ArdDateRangeInputPrefixTemplateDirective, ArdDateRangeInputSuffixTemplateDirective, ArdDateRangeInputValueTemplateDirective, ArdDateRangeInputWeekdayTemplateDirective, ArdDateRangeInputYearTemplateDirective, ArdDateRangeInputYearsViewHeaderTemplateDirective, ArdDialogActionType, ArdDialogButtonsTemplateDirective, ArdDialogCloseIconTemplateDirective, ArdDialogResult, ArdDropdownFooterTemplateDirective, ArdDropdownHeaderTemplateDirective, ArdFileInputPlaceholderTemplateDirective, ArdFileInputPrefixTemplateDirective, ArdFileInputSuffixTemplateDirective, ArdFormFieldPrefixTemplateDirective, ArdFormFieldSuffixTemplateDirective, ArdGridAlign, ArdGridDirection, ArdGridJustify, ArdGridSize, ArdGridWrap, ArdHexInputPlaceholderTemplateDirective, ArdHexInputPrefixTemplateDirective, ArdHexInputSuffixTemplateDirective, ArdInputPlaceholderTemplateDirective, ArdInputPrefixTemplateDirective, ArdInputSuffixTemplateDirective, ArdItemDisplayLimitTemplateDirective, ArdItemLimitReachedTemplateDirective, ArdLoadingPlaceholderTemplateDirective, ArdLoadingSpinnerTemplateDirective, ArdModalCloseIconTemplateDirective, ArdMultiCalendarLocation, ArdMultipageDateRangeInputAcceptButtonsTemplateDirective, ArdMultipageDateRangeInputCalendarIconTemplateDirective, ArdMultipageDateRangeInputDayTemplateDirective, ArdMultipageDateRangeInputDaysViewHeaderTemplateDirective, ArdMultipageDateRangeInputFloatingMonthTemplateDirective, ArdMultipageDateRangeInputMonthTemplateDirective, ArdMultipageDateRangeInputMonthsViewHeaderTemplateDirective, ArdMultipageDateRangeInputPrefixTemplateDirective, ArdMultipageDateRangeInputSuffixTemplateDirective, ArdMultipageDateRangeInputValueTemplateDirective, ArdMultipageDateRangeInputWeekdayTemplateDirective, ArdMultipageDateRangeInputYearTemplateDirective, ArdMultipageDateRangeInputYearsViewHeaderTemplateDirective, ArdNoItemsFoundTemplateDirective, ArdNumberInputPlaceholderTemplateDirective, ArdNumberInputPrefixTemplateDirective, ArdNumberInputSuffixTemplateDirective, ArdOptgroupTemplateDirective, ArdOptionTemplateDirective, ArdPanelPosition, ArdPasswordInputPlaceholderTemplateDirective, ArdPasswordInputPrefixTemplateDirective, ArdPasswordInputRevealButtonTemplateDirective, ArdPasswordInputSuffixTemplateDirective, ArdProgressBarValueTemplateDirective, ArdProgressCircleValueTemplateDirective, ArdRangeCalendarDayTemplateDirective, ArdRangeCalendarDaysViewHeaderTemplateDirective, ArdRangeCalendarFloatingMonthTemplateDirective, ArdRangeCalendarMonthTemplateDirective, ArdRangeCalendarMonthsViewHeaderTemplateDirective, ArdRangeCalendarWeekdayTemplateDirective, ArdRangeCalendarYearTemplateDirective, ArdRangeCalendarYearsViewHeaderTemplateDirective, ArdRangeSelectionBehavior, ArdRatingDisplayStarTemplateDirective, ArdRatingInputStarButtonTemplateDirective, searchFunctions as ArdSearchFunction, ArdSegmentOptionTemplateDirective, ArdSelectDropdownArrowTemplateDirective, ArdSelectPlaceholderTemplateDirective, ArdSelectPrefixTemplateDirective, ArdSelectSuffixTemplateDirective, ArdSlideToggleAppearance, ArdSliderTooltipDirective, ArdSnackbarAlignment, ArdSnackbarOriginRelation, ArdSnackbarQueueHandling, ArdSnackbarRef, ArdSnackbarType, ArdStarButtonStarTemplateDirective, ArdStarIconTemplateDirective, ArdTabberLabelTemplateDirective, ArdValueChipTemplateDirective, ArdValueTemplateDirective, ArdiumAutoErrorComponent, ArdiumAutocompleteInputComponent, ArdiumAutocompleteInputModule, ArdiumBadgeDirective, ArdiumBadgeModule, ArdiumBreakpointService, ArdiumButtonComponent, ArdiumButtonDirective, ArdiumButtonModule, ArdiumCalendarComponent, ArdiumCalendarModule, ArdiumCardActionButtonsDirective, ArdiumCardAvatarDirective, ArdiumCardComponent, ArdiumCardContentDirective, ArdiumCardDirective, ArdiumCardFooterDirective, ArdiumCardHeaderComponent, ArdiumCardImageDirective, ArdiumCardModule, ArdiumCardSubtitleDirective, ArdiumCardTitleDirective, ArdiumCheckboxComponent, ArdiumCheckboxListComponent, ArdiumCheckboxListModule, ArdiumCheckboxModule, ArdiumChipComponent, ArdiumChipModule, ArdiumDateInputComponent, ArdiumDateInputModule, ArdiumDateRangeInputComponent, ArdiumDateRangeInputModule, ArdiumDeletableChipComponent, ArdiumDialogComponent, ArdiumDialogModule, ArdiumDigitInputComponent, ArdiumDigitInputModule, ArdiumDividerComponent, ArdiumDividerModule, ArdiumDropdownPanelComponent, ArdiumDropdownPanelModule, ArdiumErrorComponent, ArdiumErrorDirective, ArdiumFabComponent, ArdiumFabModule, ArdiumFileDropAreaComponent, ArdiumFileDropAreaDragoverContentTemplateDirective, ArdiumFileDropAreaIdleContentTemplateDirective, ArdiumFileDropAreaModule, ArdiumFileDropAreaUploadedContentTemplateDirective, ArdiumFileInputComponent, ArdiumFileInputDragoverContentTemplateDirective, ArdiumFileInputFolderIconTemplateDirective, ArdiumFileInputIdleContentTemplateDirective, ArdiumFileInputModule, ArdiumFileInputUploadedContentTemplateDirective, ArdiumFormFieldComponent, ArdiumFormFieldFrameComponent, ArdiumFormFieldFrameModule, ArdiumFormFieldModule, ArdiumFormFieldNativeInputAdapterDirective, ArdiumGridComponent, ArdiumGridModule, ArdiumHexInputComponent, ArdiumHexInputModule, ArdiumHintComponent, ArdiumHintDirective, ArdiumHintErrorComponent, ArdiumHintErrorDirective, ArdiumHorizontalFormFieldComponent, ArdiumIconButtonComponent, ArdiumIconButtonModule, ArdiumIconComponent, ArdiumIconModule, ArdiumIconPipe, ArdiumInputComponent, ArdiumInputModule, ArdiumKbdComponent, ArdiumKbdDirective, ArdiumKbdModule, ArdiumKbdPipe, ArdiumKbdShortcutComponent, ArdiumKbdShortcutModule, ArdiumLabelComponent, ArdiumModalComponent, ArdiumModalModule, ArdiumMultipageDateRangeInputComponent, ArdiumMultipageDateRangeInputModule, ArdiumNumberInputComponent, ArdiumNumberInputModule, ArdiumOptionComponent, ArdiumOptionModule, ArdiumPasswordInputComponent, ArdiumPasswordInputModule, ArdiumProgressBarComponent, ArdiumProgressBarModule, ArdiumProgressCircleComponent, ArdiumProgressCircleModule, ArdiumRadioComponent, ArdiumRadioGroupComponent, ArdiumRadioModule, ArdiumRangeCalendarComponent, ArdiumRangeCalendarModule, ArdiumRangeSliderComponent, ArdiumRangeSliderModule, ArdiumRatingDisplayComponent, ArdiumRatingDisplayModule, ArdiumRatingInputComponent, ArdiumRatingInputModule, ArdiumSegmentComponent, ArdiumSegmentModule, ArdiumSelectComponent, ArdiumSelectModule, ArdiumSelectableChipComponent, ArdiumSlideToggleComponent, ArdiumSlideToggleModule, ArdiumSliderComponent, ArdiumSliderModule, ArdiumSnackbarService, ArdiumSpinnerComponent, ArdiumSpinnerModule, ArdiumStarButtonComponent, ArdiumStarButtonModule, ArdiumStarComponent, ArdiumStarModule, ArdiumStateboxComponent, ArdiumStateboxModule, ArdiumTabComponent, ArdiumTabberComponent, ArdiumTabberModule, ArdiumTableCaptionTemplateDirective, ArdiumTableCheckboxTemplateDirective, ArdiumTableComponent, ArdiumTableFromCsvComponent, ArdiumTableFromCsvModule, ArdiumTableHeaderCheckboxTemplateDirective, ArdiumTableModule, ArdiumTablePaginationComponent, ArdiumTablePaginationModule, ArdiumTablePaginationTemplateDirective, ArdiumTableTemplateDirective, ArdiumTextListComponent, ArdiumTextListModule, ArdiumTextListPipe, BadgePosition, BadgeSize, ButtonAppearance, ButtonVariant, CardAppearance, CardVariant, CheckboxListAlignType, CheckboxState, ClickStrategy, ComponentColor, DateRange, DecorationElementAppearance, DigitInputPrimitiveOption, DigitInputShape, DropdownPanelAppearance, DropdownPanelVariant, FabSize, FormElementAppearance, FormElementVariant, OneAxisAlignment, OutlinedAppearance, PaginationAlign, PanelAppearance, PanelVariant, ProgressBarAppearance, ProgressBarMode, ProgressBarSize, ProgressBarVariant, ProgressCircleAppearance, ProgressCircleVariant, SegmentAppearance, SegmentVariant, SimpleComponentColor, SimpleOneAxisAlignment, SliderDecorationPosition, SliderTooltipBehavior, SortType, StarColor, StarFillMode, TableAlignType, TableAppearance, TablePaginationStrategy, TableVariant, TransformType, _chipDefaults, _modalDefaults, isArdGridAlign, isArdGridDirection, isArdGridJustify, isArdGridSize, isArdGridWrap, isDateRange, isYearRange, provideBadgeDefaults, provideBreakpoints, provideButtonDefaults, provideCalendarDefaults, provideCardDefaults, provideCheckboxDefaults, provideCheckboxListDefaults, provideChipDefaults, provideDateInputDefaults, provideDeletableChipDefaults, provideDialogDefaults, provideDigitInputDefaults, provideDividerDefaults, provideDropdownPanelDefaults, provideErrorMap, provideFabDefaults, provideFileDropAreaDefaults, provideFileInputDefaults, provideFormFieldDefaults, provideFormFieldFrameDefaults, provideGridDefaults, provideHexInputDefaults, provideIconButtonDefaults, provideIconDefaults, provideInputDefaults, provideKbdDefaults, provideKbdShortcutDefaults, provideModalDefaults, provideNumberInputDefaults, providePasswordInputDefaults, provideProgressBarDefaults, provideProgressCircleDefaults, provideRadioDefaults, provideRatingDisplayDefaults, provideRatingInputDefaults, provideSegmentDefaults, provideSelectDefaults, provideSelectableChipDefaults, provideSlideToggleDefaults, provideSliderDefaults, provideSnackbarDefaults, provideSpinnerDefaults, provideStarButtonDefaults, provideStarDefaults, provideStateboxDefaults, provideTabberDefaults, provideTableDefaults, provideTableFromCsvDefaults, provideTablePaginationDefaults, searchInString, trackFormControl };
17350
17396
  //# sourceMappingURL=ardium-ui-ui.mjs.map