@ptsecurity/mosaic 14.3.0 → 14.4.0

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 (79) hide show
  1. package/_theming.scss +13 -4
  2. package/_visual.scss +8 -3
  3. package/core/formatters/date/formatter.pipe.d.ts +79 -66
  4. package/core/formatters/number/formatter.d.ts +13 -3
  5. package/datepicker/datepicker-input.directive.d.ts +1 -0
  6. package/design-tokens/legacy-2017/tokens/components/datepicker.json5 +15 -6
  7. package/design-tokens/legacy-2017/tokens/components/popup.json5 +1 -1
  8. package/design-tokens/legacy-2017/tokens.d.ts +9 -3
  9. package/design-tokens/pt-2022/tokens/components/datepicker.json5 +13 -4
  10. package/design-tokens/pt-2022/tokens/components/popup.json5 +1 -1
  11. package/design-tokens/pt-2022/tokens/components/sidepanel.json5 +1 -2
  12. package/design-tokens/pt-2022/tokens.d.ts +8 -3
  13. package/esm2020/core/formatters/date/formatter.pipe.mjs +87 -54
  14. package/esm2020/core/formatters/number/formatter.mjs +26 -10
  15. package/esm2020/core/select/constants.mjs +1 -1
  16. package/esm2020/core/version.mjs +2 -2
  17. package/esm2020/datepicker/calendar-body.component.mjs +2 -2
  18. package/esm2020/datepicker/datepicker-input.directive.mjs +9 -6
  19. package/esm2020/datepicker/datepicker.component.mjs +3 -3
  20. package/esm2020/design-tokens/legacy-2017/tokens.mjs +10 -4
  21. package/esm2020/design-tokens/pt-2022/tokens.mjs +9 -4
  22. package/esm2020/form-field/form-field.mjs +50 -9
  23. package/esm2020/form-field/form-field.module.mjs +10 -6
  24. package/esm2020/form-field/password-hint.mjs +4 -4
  25. package/esm2020/input/input.mjs +10 -21
  26. package/esm2020/progress-spinner/progress-spinner.component.mjs +2 -2
  27. package/esm2020/select/select.component.mjs +10 -2
  28. package/esm2020/sidepanel/sidepanel-container.component.mjs +3 -3
  29. package/esm2020/sidepanel/sidepanel-directives.mjs +16 -11
  30. package/esm2020/tags/tag-input.mjs +19 -7
  31. package/esm2020/toast/toast.service.mjs +5 -4
  32. package/fesm2015/ptsecurity-mosaic-core.mjs +110 -60
  33. package/fesm2015/ptsecurity-mosaic-core.mjs.map +1 -1
  34. package/fesm2015/ptsecurity-mosaic-datepicker.mjs +12 -9
  35. package/fesm2015/ptsecurity-mosaic-datepicker.mjs.map +1 -1
  36. package/fesm2015/ptsecurity-mosaic-design-tokens.mjs +26 -9
  37. package/fesm2015/ptsecurity-mosaic-design-tokens.mjs.map +1 -1
  38. package/fesm2015/ptsecurity-mosaic-form-field.mjs +62 -15
  39. package/fesm2015/ptsecurity-mosaic-form-field.mjs.map +1 -1
  40. package/fesm2015/ptsecurity-mosaic-input.mjs +10 -20
  41. package/fesm2015/ptsecurity-mosaic-input.mjs.map +1 -1
  42. package/fesm2015/ptsecurity-mosaic-progress-spinner.mjs +2 -2
  43. package/fesm2015/ptsecurity-mosaic-progress-spinner.mjs.map +1 -1
  44. package/fesm2015/ptsecurity-mosaic-select.mjs +9 -1
  45. package/fesm2015/ptsecurity-mosaic-select.mjs.map +1 -1
  46. package/fesm2015/ptsecurity-mosaic-sidepanel.mjs +18 -13
  47. package/fesm2015/ptsecurity-mosaic-sidepanel.mjs.map +1 -1
  48. package/fesm2015/ptsecurity-mosaic-tags.mjs +19 -8
  49. package/fesm2015/ptsecurity-mosaic-tags.mjs.map +1 -1
  50. package/fesm2015/ptsecurity-mosaic-toast.mjs +4 -3
  51. package/fesm2015/ptsecurity-mosaic-toast.mjs.map +1 -1
  52. package/fesm2020/ptsecurity-mosaic-core.mjs +110 -63
  53. package/fesm2020/ptsecurity-mosaic-core.mjs.map +1 -1
  54. package/fesm2020/ptsecurity-mosaic-datepicker.mjs +12 -9
  55. package/fesm2020/ptsecurity-mosaic-datepicker.mjs.map +1 -1
  56. package/fesm2020/ptsecurity-mosaic-design-tokens.mjs +26 -9
  57. package/fesm2020/ptsecurity-mosaic-design-tokens.mjs.map +1 -1
  58. package/fesm2020/ptsecurity-mosaic-form-field.mjs +60 -17
  59. package/fesm2020/ptsecurity-mosaic-form-field.mjs.map +1 -1
  60. package/fesm2020/ptsecurity-mosaic-input.mjs +9 -20
  61. package/fesm2020/ptsecurity-mosaic-input.mjs.map +1 -1
  62. package/fesm2020/ptsecurity-mosaic-progress-spinner.mjs +2 -2
  63. package/fesm2020/ptsecurity-mosaic-progress-spinner.mjs.map +1 -1
  64. package/fesm2020/ptsecurity-mosaic-select.mjs +9 -1
  65. package/fesm2020/ptsecurity-mosaic-select.mjs.map +1 -1
  66. package/fesm2020/ptsecurity-mosaic-sidepanel.mjs +18 -13
  67. package/fesm2020/ptsecurity-mosaic-sidepanel.mjs.map +1 -1
  68. package/fesm2020/ptsecurity-mosaic-tags.mjs +16 -5
  69. package/fesm2020/ptsecurity-mosaic-tags.mjs.map +1 -1
  70. package/fesm2020/ptsecurity-mosaic-toast.mjs +4 -3
  71. package/fesm2020/ptsecurity-mosaic-toast.mjs.map +1 -1
  72. package/form-field/form-field.d.ts +12 -2
  73. package/form-field/form-field.module.d.ts +1 -1
  74. package/input/input.d.ts +1 -2
  75. package/package.json +4 -4
  76. package/prebuilt-themes/dark-theme.css +1 -1
  77. package/prebuilt-themes/default-theme.css +1 -1
  78. package/select/select.component.d.ts +2 -0
  79. package/tags/tag-input.d.ts +5 -2
@@ -98,14 +98,14 @@ class McCalendarBody {
98
98
  }
99
99
  }
100
100
  /** @nocollapse */ McCalendarBody.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.5", ngImport: i0, type: McCalendarBody, deps: [{ token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component });
101
- /** @nocollapse */ McCalendarBody.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.5", type: McCalendarBody, selector: "[mc-calendar-body]", inputs: { label: "label", rows: "rows", todayValue: "todayValue", selectedValue: "selectedValue", labelMinRequiredCells: "labelMinRequiredCells", numCols: "numCols", activeCell: "activeCell", cellAspectRatio: "cellAspectRatio" }, outputs: { selectedValueChange: "selectedValueChange" }, host: { attributes: { "role": "grid", "aria-readonly": "true" }, classAttribute: "mc-calendar__body" }, exportAs: ["mcCalendarBody"], usesOnChanges: true, ngImport: i0, template: "<!--\n If there's not enough space in the first row, create a separate label row. We mark this row as\n aria-hidden because we don't want it to be read out as one of the weeks in the month.\n-->\n<tr *ngIf=\"firstRowOffset < labelMinRequiredCells\">\n <td class=\"mc-calendar__body-label\" [attr.colspan]=\"numCols\">\n {{ label }}\n </td>\n</tr>\n\n<!-- Create the first row separately so we can include a special spacer cell. -->\n<tr *ngFor=\"let row of rows; let rowIndex = index\">\n <!--\n We mark this cell as aria-hidden so it doesn't get read out as one of the days in the week.\n The aspect ratio of the table cells is maintained by setting the top and bottom padding as a\n percentage of the width (a variant of the trick described here:\n https://www.w3schools.com/howto/howto_css_aspect_ratio.asp).\n -->\n <td *ngIf=\"rowIndex === 0 && firstRowOffset\"\n class=\"mc-calendar__body-label\"\n [attr.colspan]=\"firstRowOffset\">\n {{ firstRowOffset >= labelMinRequiredCells ? label : '' }}\n </td>\n <td *ngFor=\"let item of row; let colIndex = index\"\n class=\"mc-calendar__body-cell\"\n [ngClass]=\"item.cssClasses!\"\n [tabindex]=\"isActiveCell(rowIndex, colIndex) ? 0 : -1\"\n [class.mc-calendar__body_disabled]=\"!item.enabled\"\n [class.mc-calendar__body_active]=\"isActiveCell(rowIndex, colIndex)\"\n (click)=\"cellClicked(item)\"\n [style.width]=\"cellWidth\"\n [style.paddingTop]=\"cellPadding\"\n [style.paddingBottom]=\"cellPadding\">\n <div class=\"mc-calendar__body-cell-content\"\n [class.mc-selected]=\"selectedValue === item.value\"\n [class.mc-calendar__body-today]=\"todayValue === item.value\">\n {{ item.displayValue }}\n </div>\n </td>\n</tr>\n", styles: [".mc-calendar__body{min-width:224px;min-width:calc(7 * var(--mc-datepicker-body-size-cell-min-size, 32px))}.mc-calendar__body-label{text-align:left;padding:8px 28px 12px 12px;padding:var(--mc-datepicker-body-size-label-paddings, 8px 28px 12px 12px)}.mc-calendar__body-cell{position:relative;height:0;line-height:0;text-align:center;outline:none;cursor:pointer}.mc-calendar__body_disabled{cursor:default}.mc-calendar__body-cell-content{position:absolute;top:5%;top:var(--mc-datepicker-body-size-cell-margin, 5%);left:5%;left:var(--mc-datepicker-body-size-cell-margin, 5%);padding:8px;padding:var(--mc-datepicker-body-size-cell-padding, 8px);display:flex;align-items:center;justify-content:center;box-sizing:border-box;width:90%;height:90%;line-height:1;border-width:1px;border-width:var(--mc-datepicker-body-size-cell-border-width, 1px);border-style:solid}.cdk-high-contrast-active .mc-calendar__body-cell-content{border:none}.cdk-high-contrast-active :host .mc-calendar__body-cell-content{border:none}mc-month-view .mc-calendar__body-cell-content{justify-content:flex-end}mc-multi-year-view .mc-calendar__body-cell-content,mc-year-view .mc-calendar__body-cell-content{justify-content:center}.cdk-high-contrast-active .mc-datepicker__popup:not(:empty),.cdk-high-contrast-active .mc-selected{outline:solid 1px}.cdk-high-contrast-active .mc-calendar__body-today{outline:dotted 1px}.cdk-high-contrast-active :host .mc-datepicker__popup:not(:empty),.cdk-high-contrast-active :host .mc-selected{outline:solid 1px}.cdk-high-contrast-active :host .mc-calendar__body-today{outline:dotted 1px}[dir=rtl] .mc-calendar__body-label{text-align:right}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
101
+ /** @nocollapse */ McCalendarBody.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.5", type: McCalendarBody, selector: "[mc-calendar-body]", inputs: { label: "label", rows: "rows", todayValue: "todayValue", selectedValue: "selectedValue", labelMinRequiredCells: "labelMinRequiredCells", numCols: "numCols", activeCell: "activeCell", cellAspectRatio: "cellAspectRatio" }, outputs: { selectedValueChange: "selectedValueChange" }, host: { attributes: { "role": "grid", "aria-readonly": "true" }, classAttribute: "mc-calendar__body" }, exportAs: ["mcCalendarBody"], usesOnChanges: true, ngImport: i0, template: "<!--\n If there's not enough space in the first row, create a separate label row. We mark this row as\n aria-hidden because we don't want it to be read out as one of the weeks in the month.\n-->\n<tr *ngIf=\"firstRowOffset < labelMinRequiredCells\">\n <td class=\"mc-calendar__body-label\" [attr.colspan]=\"numCols\">\n {{ label }}\n </td>\n</tr>\n\n<!-- Create the first row separately so we can include a special spacer cell. -->\n<tr *ngFor=\"let row of rows; let rowIndex = index\">\n <!--\n We mark this cell as aria-hidden so it doesn't get read out as one of the days in the week.\n The aspect ratio of the table cells is maintained by setting the top and bottom padding as a\n percentage of the width (a variant of the trick described here:\n https://www.w3schools.com/howto/howto_css_aspect_ratio.asp).\n -->\n <td *ngIf=\"rowIndex === 0 && firstRowOffset\"\n class=\"mc-calendar__body-label\"\n [attr.colspan]=\"firstRowOffset\">\n {{ firstRowOffset >= labelMinRequiredCells ? label : '' }}\n </td>\n <td *ngFor=\"let item of row; let colIndex = index\"\n class=\"mc-calendar__body-cell\"\n [ngClass]=\"item.cssClasses!\"\n [tabindex]=\"isActiveCell(rowIndex, colIndex) ? 0 : -1\"\n [class.mc-calendar__body_disabled]=\"!item.enabled\"\n [class.mc-calendar__body_active]=\"isActiveCell(rowIndex, colIndex)\"\n (click)=\"cellClicked(item)\"\n [style.width]=\"cellWidth\"\n [style.paddingTop]=\"cellPadding\"\n [style.paddingBottom]=\"cellPadding\">\n <div class=\"mc-calendar__body-cell-content\"\n [class.mc-selected]=\"selectedValue === item.value\"\n [class.mc-calendar__body-today]=\"todayValue === item.value\">\n {{ item.displayValue }}\n </div>\n </td>\n</tr>\n", styles: [".mc-calendar__body{min-width:224px;min-width:calc(7 * var(--mc-datepicker-body-size-cell-min-size, 32px))}.mc-calendar__body-label{text-align:left;padding:8px 28px 12px 12px;padding:var(--mc-datepicker-body-size-label-paddings, 8px 28px 12px 12px)}.mc-calendar__body-cell{position:relative;height:0;line-height:0;text-align:center;outline:none;cursor:pointer}.mc-calendar__body_disabled{cursor:default}.mc-calendar__body-cell-content{position:absolute;top:5%;top:var(--mc-datepicker-body-size-cell-margin, 5%);left:5%;left:var(--mc-datepicker-body-size-cell-margin, 5%);padding:8px;padding:var(--mc-datepicker-body-size-cell-padding, 8px);display:flex;align-items:center;justify-content:center;box-sizing:border-box;width:90%;height:90%;line-height:1;border-width:1px;border-width:var(--mc-datepicker-body-size-cell-border-width, 1px);border-radius:0;border-radius:var(--mc-datepicker-body-size-cell-border-radius, 0);border-style:solid}.cdk-high-contrast-active .mc-calendar__body-cell-content{border:none}.cdk-high-contrast-active :host .mc-calendar__body-cell-content{border:none}mc-month-view .mc-calendar__body-cell-content{justify-content:flex-end}mc-multi-year-view .mc-calendar__body-cell-content,mc-year-view .mc-calendar__body-cell-content{justify-content:center}.cdk-high-contrast-active .mc-datepicker__popup:not(:empty),.cdk-high-contrast-active .mc-selected{outline:solid 1px}.cdk-high-contrast-active .mc-calendar__body-today{outline:dotted 1px}.cdk-high-contrast-active :host .mc-datepicker__popup:not(:empty),.cdk-high-contrast-active :host .mc-selected{outline:solid 1px}.cdk-high-contrast-active :host .mc-calendar__body-today{outline:dotted 1px}[dir=rtl] .mc-calendar__body-label{text-align:right}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
102
102
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.5", ngImport: i0, type: McCalendarBody, decorators: [{
103
103
  type: Component,
104
104
  args: [{ selector: '[mc-calendar-body]', exportAs: 'mcCalendarBody', host: {
105
105
  class: 'mc-calendar__body',
106
106
  role: 'grid',
107
107
  'aria-readonly': 'true'
108
- }, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<!--\n If there's not enough space in the first row, create a separate label row. We mark this row as\n aria-hidden because we don't want it to be read out as one of the weeks in the month.\n-->\n<tr *ngIf=\"firstRowOffset < labelMinRequiredCells\">\n <td class=\"mc-calendar__body-label\" [attr.colspan]=\"numCols\">\n {{ label }}\n </td>\n</tr>\n\n<!-- Create the first row separately so we can include a special spacer cell. -->\n<tr *ngFor=\"let row of rows; let rowIndex = index\">\n <!--\n We mark this cell as aria-hidden so it doesn't get read out as one of the days in the week.\n The aspect ratio of the table cells is maintained by setting the top and bottom padding as a\n percentage of the width (a variant of the trick described here:\n https://www.w3schools.com/howto/howto_css_aspect_ratio.asp).\n -->\n <td *ngIf=\"rowIndex === 0 && firstRowOffset\"\n class=\"mc-calendar__body-label\"\n [attr.colspan]=\"firstRowOffset\">\n {{ firstRowOffset >= labelMinRequiredCells ? label : '' }}\n </td>\n <td *ngFor=\"let item of row; let colIndex = index\"\n class=\"mc-calendar__body-cell\"\n [ngClass]=\"item.cssClasses!\"\n [tabindex]=\"isActiveCell(rowIndex, colIndex) ? 0 : -1\"\n [class.mc-calendar__body_disabled]=\"!item.enabled\"\n [class.mc-calendar__body_active]=\"isActiveCell(rowIndex, colIndex)\"\n (click)=\"cellClicked(item)\"\n [style.width]=\"cellWidth\"\n [style.paddingTop]=\"cellPadding\"\n [style.paddingBottom]=\"cellPadding\">\n <div class=\"mc-calendar__body-cell-content\"\n [class.mc-selected]=\"selectedValue === item.value\"\n [class.mc-calendar__body-today]=\"todayValue === item.value\">\n {{ item.displayValue }}\n </div>\n </td>\n</tr>\n", styles: [".mc-calendar__body{min-width:224px;min-width:calc(7 * var(--mc-datepicker-body-size-cell-min-size, 32px))}.mc-calendar__body-label{text-align:left;padding:8px 28px 12px 12px;padding:var(--mc-datepicker-body-size-label-paddings, 8px 28px 12px 12px)}.mc-calendar__body-cell{position:relative;height:0;line-height:0;text-align:center;outline:none;cursor:pointer}.mc-calendar__body_disabled{cursor:default}.mc-calendar__body-cell-content{position:absolute;top:5%;top:var(--mc-datepicker-body-size-cell-margin, 5%);left:5%;left:var(--mc-datepicker-body-size-cell-margin, 5%);padding:8px;padding:var(--mc-datepicker-body-size-cell-padding, 8px);display:flex;align-items:center;justify-content:center;box-sizing:border-box;width:90%;height:90%;line-height:1;border-width:1px;border-width:var(--mc-datepicker-body-size-cell-border-width, 1px);border-style:solid}.cdk-high-contrast-active .mc-calendar__body-cell-content{border:none}.cdk-high-contrast-active :host .mc-calendar__body-cell-content{border:none}mc-month-view .mc-calendar__body-cell-content{justify-content:flex-end}mc-multi-year-view .mc-calendar__body-cell-content,mc-year-view .mc-calendar__body-cell-content{justify-content:center}.cdk-high-contrast-active .mc-datepicker__popup:not(:empty),.cdk-high-contrast-active .mc-selected{outline:solid 1px}.cdk-high-contrast-active .mc-calendar__body-today{outline:dotted 1px}.cdk-high-contrast-active :host .mc-datepicker__popup:not(:empty),.cdk-high-contrast-active :host .mc-selected{outline:solid 1px}.cdk-high-contrast-active :host .mc-calendar__body-today{outline:dotted 1px}[dir=rtl] .mc-calendar__body-label{text-align:right}\n"] }]
108
+ }, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<!--\n If there's not enough space in the first row, create a separate label row. We mark this row as\n aria-hidden because we don't want it to be read out as one of the weeks in the month.\n-->\n<tr *ngIf=\"firstRowOffset < labelMinRequiredCells\">\n <td class=\"mc-calendar__body-label\" [attr.colspan]=\"numCols\">\n {{ label }}\n </td>\n</tr>\n\n<!-- Create the first row separately so we can include a special spacer cell. -->\n<tr *ngFor=\"let row of rows; let rowIndex = index\">\n <!--\n We mark this cell as aria-hidden so it doesn't get read out as one of the days in the week.\n The aspect ratio of the table cells is maintained by setting the top and bottom padding as a\n percentage of the width (a variant of the trick described here:\n https://www.w3schools.com/howto/howto_css_aspect_ratio.asp).\n -->\n <td *ngIf=\"rowIndex === 0 && firstRowOffset\"\n class=\"mc-calendar__body-label\"\n [attr.colspan]=\"firstRowOffset\">\n {{ firstRowOffset >= labelMinRequiredCells ? label : '' }}\n </td>\n <td *ngFor=\"let item of row; let colIndex = index\"\n class=\"mc-calendar__body-cell\"\n [ngClass]=\"item.cssClasses!\"\n [tabindex]=\"isActiveCell(rowIndex, colIndex) ? 0 : -1\"\n [class.mc-calendar__body_disabled]=\"!item.enabled\"\n [class.mc-calendar__body_active]=\"isActiveCell(rowIndex, colIndex)\"\n (click)=\"cellClicked(item)\"\n [style.width]=\"cellWidth\"\n [style.paddingTop]=\"cellPadding\"\n [style.paddingBottom]=\"cellPadding\">\n <div class=\"mc-calendar__body-cell-content\"\n [class.mc-selected]=\"selectedValue === item.value\"\n [class.mc-calendar__body-today]=\"todayValue === item.value\">\n {{ item.displayValue }}\n </div>\n </td>\n</tr>\n", styles: [".mc-calendar__body{min-width:224px;min-width:calc(7 * var(--mc-datepicker-body-size-cell-min-size, 32px))}.mc-calendar__body-label{text-align:left;padding:8px 28px 12px 12px;padding:var(--mc-datepicker-body-size-label-paddings, 8px 28px 12px 12px)}.mc-calendar__body-cell{position:relative;height:0;line-height:0;text-align:center;outline:none;cursor:pointer}.mc-calendar__body_disabled{cursor:default}.mc-calendar__body-cell-content{position:absolute;top:5%;top:var(--mc-datepicker-body-size-cell-margin, 5%);left:5%;left:var(--mc-datepicker-body-size-cell-margin, 5%);padding:8px;padding:var(--mc-datepicker-body-size-cell-padding, 8px);display:flex;align-items:center;justify-content:center;box-sizing:border-box;width:90%;height:90%;line-height:1;border-width:1px;border-width:var(--mc-datepicker-body-size-cell-border-width, 1px);border-radius:0;border-radius:var(--mc-datepicker-body-size-cell-border-radius, 0);border-style:solid}.cdk-high-contrast-active .mc-calendar__body-cell-content{border:none}.cdk-high-contrast-active :host .mc-calendar__body-cell-content{border:none}mc-month-view .mc-calendar__body-cell-content{justify-content:flex-end}mc-multi-year-view .mc-calendar__body-cell-content,mc-year-view .mc-calendar__body-cell-content{justify-content:center}.cdk-high-contrast-active .mc-datepicker__popup:not(:empty),.cdk-high-contrast-active .mc-selected{outline:solid 1px}.cdk-high-contrast-active .mc-calendar__body-today{outline:dotted 1px}.cdk-high-contrast-active :host .mc-datepicker__popup:not(:empty),.cdk-high-contrast-active :host .mc-selected{outline:solid 1px}.cdk-high-contrast-active :host .mc-calendar__body-today{outline:dotted 1px}[dir=rtl] .mc-calendar__body-label{text-align:right}\n"] }]
109
109
  }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.NgZone }]; }, propDecorators: { label: [{
110
110
  type: Input
111
111
  }], rows: [{
@@ -1282,7 +1282,7 @@ class McDatepickerContent {
1282
1282
  }
1283
1283
  }
1284
1284
  /** @nocollapse */ McDatepickerContent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.5", ngImport: i0, type: McDatepickerContent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
1285
- /** @nocollapse */ McDatepickerContent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.5", type: McDatepickerContent, selector: "mc-datepicker__content", host: { listeners: { "@transformPanel.done": "animationDone.next()" }, properties: { "@transformPanel": "animationState" }, classAttribute: "mc-datepicker__content" }, viewQueries: [{ propertyName: "calendar", first: true, predicate: McCalendar, descendants: true }], exportAs: ["mcDatepickerContent"], ngImport: i0, template: "<mc-calendar [id]=\"datepicker.id\"\n [ngClass]=\"datepicker.panelClass\"\n [startAt]=\"datepicker.startAt\"\n [startView]=\"datepicker.startView\"\n [minDate]=\"datepicker.minDate\"\n [maxDate]=\"datepicker.maxDate\"\n [dateFilter]=\"datepicker.dateFilter\"\n [headerComponent]=\"datepicker.calendarHeaderComponent\"\n [selected]=\"datepicker.selected\"\n [dateClass]=\"datepicker.dateClass\"\n [@fadeInCalendar]=\"'enter'\"\n (selectedChange)=\"datepicker.select($event)\"\n (yearSelected)=\"datepicker.selectYear($event)\"\n (monthSelected)=\"datepicker.selectMonth($event)\"\n (userSelection)=\"datepicker.close()\">\n</mc-calendar>\n", styles: [".mc-datepicker__content{display:block;border-width:1px;border-style:solid}.mc-datepicker__content .mc-calendar{width:296px;height:348px}.mc-datepicker__content .mc-calendar__next-button[disabled],.mc-datepicker__content .mc-calendar__previous-button[disabled]{border:0}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: McCalendar, selector: "mc-calendar", inputs: ["startAt", "selected", "minDate", "maxDate", "headerComponent", "startView", "dateFilter", "dateClass"], outputs: ["selectedChange", "yearSelected", "monthSelected", "userSelection"], exportAs: ["mcCalendar"] }], animations: [
1285
+ /** @nocollapse */ McDatepickerContent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.5", type: McDatepickerContent, selector: "mc-datepicker__content", host: { listeners: { "@transformPanel.done": "animationDone.next()" }, properties: { "@transformPanel": "animationState" }, classAttribute: "mc-datepicker__content" }, viewQueries: [{ propertyName: "calendar", first: true, predicate: McCalendar, descendants: true }], exportAs: ["mcDatepickerContent"], ngImport: i0, template: "<mc-calendar [id]=\"datepicker.id\"\n [ngClass]=\"datepicker.panelClass\"\n [startAt]=\"datepicker.startAt\"\n [startView]=\"datepicker.startView\"\n [minDate]=\"datepicker.minDate\"\n [maxDate]=\"datepicker.maxDate\"\n [dateFilter]=\"datepicker.dateFilter\"\n [headerComponent]=\"datepicker.calendarHeaderComponent\"\n [selected]=\"datepicker.selected\"\n [dateClass]=\"datepicker.dateClass\"\n [@fadeInCalendar]=\"'enter'\"\n (selectedChange)=\"datepicker.select($event)\"\n (yearSelected)=\"datepicker.selectYear($event)\"\n (monthSelected)=\"datepicker.selectMonth($event)\"\n (userSelection)=\"datepicker.close()\">\n</mc-calendar>\n", styles: [".mc-datepicker__content{display:block;border-width:1px;border-style:solid;border-radius:0;border-radius:var(--mc-datepicker-calendar-size-border-radius, 0)}.mc-datepicker__content .mc-calendar{width:296px;height:348px}.mc-datepicker__content .mc-calendar__next-button[disabled],.mc-datepicker__content .mc-calendar__previous-button[disabled]{border:0}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: McCalendar, selector: "mc-calendar", inputs: ["startAt", "selected", "minDate", "maxDate", "headerComponent", "startView", "dateFilter", "dateClass"], outputs: ["selectedChange", "yearSelected", "monthSelected", "userSelection"], exportAs: ["mcCalendar"] }], animations: [
1286
1286
  mcDatepickerAnimations.transformPanel,
1287
1287
  mcDatepickerAnimations.fadeInCalendar
1288
1288
  ], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
@@ -1295,7 +1295,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.5", ngImpor
1295
1295
  }, animations: [
1296
1296
  mcDatepickerAnimations.transformPanel,
1297
1297
  mcDatepickerAnimations.fadeInCalendar
1298
- ], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<mc-calendar [id]=\"datepicker.id\"\n [ngClass]=\"datepicker.panelClass\"\n [startAt]=\"datepicker.startAt\"\n [startView]=\"datepicker.startView\"\n [minDate]=\"datepicker.minDate\"\n [maxDate]=\"datepicker.maxDate\"\n [dateFilter]=\"datepicker.dateFilter\"\n [headerComponent]=\"datepicker.calendarHeaderComponent\"\n [selected]=\"datepicker.selected\"\n [dateClass]=\"datepicker.dateClass\"\n [@fadeInCalendar]=\"'enter'\"\n (selectedChange)=\"datepicker.select($event)\"\n (yearSelected)=\"datepicker.selectYear($event)\"\n (monthSelected)=\"datepicker.selectMonth($event)\"\n (userSelection)=\"datepicker.close()\">\n</mc-calendar>\n", styles: [".mc-datepicker__content{display:block;border-width:1px;border-style:solid}.mc-datepicker__content .mc-calendar{width:296px;height:348px}.mc-datepicker__content .mc-calendar__next-button[disabled],.mc-datepicker__content .mc-calendar__previous-button[disabled]{border:0}\n"] }]
1298
+ ], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<mc-calendar [id]=\"datepicker.id\"\n [ngClass]=\"datepicker.panelClass\"\n [startAt]=\"datepicker.startAt\"\n [startView]=\"datepicker.startView\"\n [minDate]=\"datepicker.minDate\"\n [maxDate]=\"datepicker.maxDate\"\n [dateFilter]=\"datepicker.dateFilter\"\n [headerComponent]=\"datepicker.calendarHeaderComponent\"\n [selected]=\"datepicker.selected\"\n [dateClass]=\"datepicker.dateClass\"\n [@fadeInCalendar]=\"'enter'\"\n (selectedChange)=\"datepicker.select($event)\"\n (yearSelected)=\"datepicker.selectYear($event)\"\n (monthSelected)=\"datepicker.selectMonth($event)\"\n (userSelection)=\"datepicker.close()\">\n</mc-calendar>\n", styles: [".mc-datepicker__content{display:block;border-width:1px;border-style:solid;border-radius:0;border-radius:var(--mc-datepicker-calendar-size-border-radius, 0)}.mc-datepicker__content .mc-calendar{width:296px;height:348px}.mc-datepicker__content .mc-calendar__next-button[disabled],.mc-datepicker__content .mc-calendar__previous-button[disabled]{border:0}\n"] }]
1299
1299
  }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }]; }, propDecorators: { calendar: [{
1300
1300
  type: ViewChild,
1301
1301
  args: [McCalendar]
@@ -1809,10 +1809,7 @@ class McDatepickerInput {
1809
1809
  this._value = null;
1810
1810
  return setTimeout(() => this.control.updateValueAndValidity());
1811
1811
  }
1812
- if (Object.values(date).some(isNaN)) {
1813
- return;
1814
- }
1815
- const newTimeObj = this.getValidDateOrNull(this.dateAdapter.createDateTime(date.year, date.month - 1, date.date, date.hours, date.minutes, date.seconds, date.milliseconds));
1812
+ const newTimeObj = this.createDateTime(date);
1816
1813
  if (!newTimeObj) {
1817
1814
  this.lastValueValid = false;
1818
1815
  this._value = null;
@@ -2241,7 +2238,7 @@ class McDatepickerInput {
2241
2238
  else {
2242
2239
  return null;
2243
2240
  }
2244
- return this.getValidDateOrNull(this.dateAdapter.createDateTime(date.year, date.month - 1, date.date, date.hours, date.minutes, date.seconds, date.milliseconds));
2241
+ return this.createDateTime(date);
2245
2242
  }
2246
2243
  getDefaultValue() {
2247
2244
  const defaultValue = this.value || this.dateAdapter.today();
@@ -2456,6 +2453,12 @@ class McDatepickerInput {
2456
2453
  createDate(year, month, day) {
2457
2454
  return this.dateAdapter.createDateTime(year, month, day, this.dateAdapter.getHours(this.value), this.dateAdapter.getMinutes(this.value), this.dateAdapter.getSeconds(this.value), this.dateAdapter.getMilliseconds(this.value));
2458
2455
  }
2456
+ createDateTime(value) {
2457
+ if (Object.values(value).some(isNaN)) {
2458
+ return null;
2459
+ }
2460
+ return this.getValidDateOrNull(this.dateAdapter.createDateTime(value.year, value.month - 1, value.date, value.hours, value.minutes, value.seconds, value.milliseconds));
2461
+ }
2459
2462
  correctCursorPosition() {
2460
2463
  if (this.selectionStart && this.separatorPositions.includes(this.selectionStart)) {
2461
2464
  this.selectionStart = this.selectionStart - 1;