@ngx-mce/datetime-picker 21.3.3 → 21.3.4-next.1
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.
|
@@ -76,10 +76,10 @@ class NgxMatDateSelectionModel {
|
|
|
76
76
|
_isValidDateInstance(date) {
|
|
77
77
|
return this._adapter.isDateInstance(date) && this._adapter.isValid(date);
|
|
78
78
|
}
|
|
79
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
80
|
-
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "
|
|
79
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.0", ngImport: i0, type: NgxMatDateSelectionModel, deps: "invalid", target: i0.ɵɵFactoryTarget.Injectable });
|
|
80
|
+
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "22.0.0", ngImport: i0, type: NgxMatDateSelectionModel });
|
|
81
81
|
}
|
|
82
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
82
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.0", ngImport: i0, type: NgxMatDateSelectionModel, decorators: [{
|
|
83
83
|
type: Injectable
|
|
84
84
|
}], ctorParameters: () => [{ type: i1.DateAdapter }, { type: undefined }] });
|
|
85
85
|
/**
|
|
@@ -114,10 +114,10 @@ class NgxMatSingleDateSelectionModel extends NgxMatDateSelectionModel {
|
|
|
114
114
|
clone.updateSelection(this.selection, this);
|
|
115
115
|
return clone;
|
|
116
116
|
}
|
|
117
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
118
|
-
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "
|
|
117
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.0", ngImport: i0, type: NgxMatSingleDateSelectionModel, deps: [{ token: i1.DateAdapter }], target: i0.ɵɵFactoryTarget.Injectable });
|
|
118
|
+
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "22.0.0", ngImport: i0, type: NgxMatSingleDateSelectionModel });
|
|
119
119
|
}
|
|
120
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
120
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.0", ngImport: i0, type: NgxMatSingleDateSelectionModel, decorators: [{
|
|
121
121
|
type: Injectable
|
|
122
122
|
}], ctorParameters: () => [{ type: i1.DateAdapter }] });
|
|
123
123
|
/**
|
|
@@ -177,10 +177,10 @@ class NgxMatRangeDateSelectionModel extends NgxMatDateSelectionModel {
|
|
|
177
177
|
clone.updateSelection(this.selection, this);
|
|
178
178
|
return clone;
|
|
179
179
|
}
|
|
180
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
181
|
-
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "
|
|
180
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.0", ngImport: i0, type: NgxMatRangeDateSelectionModel, deps: [{ token: i1.DateAdapter }], target: i0.ɵɵFactoryTarget.Injectable });
|
|
181
|
+
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "22.0.0", ngImport: i0, type: NgxMatRangeDateSelectionModel });
|
|
182
182
|
}
|
|
183
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
183
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.0", ngImport: i0, type: NgxMatRangeDateSelectionModel, decorators: [{
|
|
184
184
|
type: Injectable
|
|
185
185
|
}], ctorParameters: () => [{ type: i1.DateAdapter }] });
|
|
186
186
|
/** @docs-private */
|
|
@@ -266,10 +266,10 @@ class NgxMatDatepickerIntl {
|
|
|
266
266
|
formatYearRangeLabel(start, end) {
|
|
267
267
|
return `${start} to ${end}`;
|
|
268
268
|
}
|
|
269
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
270
|
-
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "
|
|
269
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.0", ngImport: i0, type: NgxMatDatepickerIntl, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
|
|
270
|
+
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "22.0.0", ngImport: i0, type: NgxMatDatepickerIntl, providedIn: 'root' });
|
|
271
271
|
}
|
|
272
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
272
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.0", ngImport: i0, type: NgxMatDatepickerIntl, decorators: [{
|
|
273
273
|
type: Injectable,
|
|
274
274
|
args: [{ providedIn: 'root' }]
|
|
275
275
|
}] });
|
|
@@ -309,21 +309,29 @@ class NgxMatCalendarBody {
|
|
|
309
309
|
*/
|
|
310
310
|
_focusActiveCellAfterViewChecked = false;
|
|
311
311
|
/** The label for the table. (e.g. "Jan 2017"). */
|
|
312
|
-
label = input(
|
|
312
|
+
label = input(/* @ts-ignore */
|
|
313
|
+
...(ngDevMode ? [undefined, { debugName: "label" }] : /* istanbul ignore next */ []));
|
|
313
314
|
/** The cells to display in the table. */
|
|
314
|
-
rows = input(
|
|
315
|
+
rows = input(/* @ts-ignore */
|
|
316
|
+
...(ngDevMode ? [undefined, { debugName: "rows" }] : /* istanbul ignore next */ []));
|
|
315
317
|
/** The value in the table that corresponds to today. */
|
|
316
|
-
todayValue = input(
|
|
318
|
+
todayValue = input(/* @ts-ignore */
|
|
319
|
+
...(ngDevMode ? [undefined, { debugName: "todayValue" }] : /* istanbul ignore next */ []));
|
|
317
320
|
/** Start value of the selected date range. */
|
|
318
|
-
startValue = input(
|
|
321
|
+
startValue = input(/* @ts-ignore */
|
|
322
|
+
...(ngDevMode ? [undefined, { debugName: "startValue" }] : /* istanbul ignore next */ []));
|
|
319
323
|
/** End value of the selected date range. */
|
|
320
|
-
endValue = input(
|
|
324
|
+
endValue = input(/* @ts-ignore */
|
|
325
|
+
...(ngDevMode ? [undefined, { debugName: "endValue" }] : /* istanbul ignore next */ []));
|
|
321
326
|
/** The minimum number of free cells needed to fit the label in the first row. */
|
|
322
|
-
labelMinRequiredCells = input(
|
|
327
|
+
labelMinRequiredCells = input(/* @ts-ignore */
|
|
328
|
+
...(ngDevMode ? [undefined, { debugName: "labelMinRequiredCells" }] : /* istanbul ignore next */ []));
|
|
323
329
|
/** The number of columns in the table. */
|
|
324
|
-
numCols = input(7,
|
|
330
|
+
numCols = input(7, /* @ts-ignore */
|
|
331
|
+
...(ngDevMode ? [{ debugName: "numCols" }] : /* istanbul ignore next */ []));
|
|
325
332
|
/** The cell number of the active cell in the table. */
|
|
326
|
-
activeCell = input(0,
|
|
333
|
+
activeCell = input(0, /* @ts-ignore */
|
|
334
|
+
...(ngDevMode ? [{ debugName: "activeCell" }] : /* istanbul ignore next */ []));
|
|
327
335
|
ngAfterViewChecked() {
|
|
328
336
|
if (this._focusActiveCellAfterViewChecked) {
|
|
329
337
|
this._focusActiveCell();
|
|
@@ -331,24 +339,32 @@ class NgxMatCalendarBody {
|
|
|
331
339
|
}
|
|
332
340
|
}
|
|
333
341
|
/** Whether a range is being selected. */
|
|
334
|
-
isRange = input(false,
|
|
342
|
+
isRange = input(false, /* @ts-ignore */
|
|
343
|
+
...(ngDevMode ? [{ debugName: "isRange" }] : /* istanbul ignore next */ []));
|
|
335
344
|
/**
|
|
336
345
|
* The aspect ratio (width / height) to use for the cells in the table. This aspect ratio will be
|
|
337
346
|
* maintained even as the table resizes.
|
|
338
347
|
*/
|
|
339
|
-
cellAspectRatio = input(1,
|
|
348
|
+
cellAspectRatio = input(1, /* @ts-ignore */
|
|
349
|
+
...(ngDevMode ? [{ debugName: "cellAspectRatio" }] : /* istanbul ignore next */ []));
|
|
340
350
|
/** Start of the comparison range. */
|
|
341
|
-
comparisonStart = input(
|
|
351
|
+
comparisonStart = input(/* @ts-ignore */
|
|
352
|
+
...(ngDevMode ? [undefined, { debugName: "comparisonStart" }] : /* istanbul ignore next */ []));
|
|
342
353
|
/** End of the comparison range. */
|
|
343
|
-
comparisonEnd = input(
|
|
354
|
+
comparisonEnd = input(/* @ts-ignore */
|
|
355
|
+
...(ngDevMode ? [undefined, { debugName: "comparisonEnd" }] : /* istanbul ignore next */ []));
|
|
344
356
|
/** Start of the preview range. */
|
|
345
|
-
previewStart = input(null,
|
|
357
|
+
previewStart = input(null, /* @ts-ignore */
|
|
358
|
+
...(ngDevMode ? [{ debugName: "previewStart" }] : /* istanbul ignore next */ []));
|
|
346
359
|
/** End of the preview range. */
|
|
347
|
-
previewEnd = input(null,
|
|
360
|
+
previewEnd = input(null, /* @ts-ignore */
|
|
361
|
+
...(ngDevMode ? [{ debugName: "previewEnd" }] : /* istanbul ignore next */ []));
|
|
348
362
|
/** ARIA Accessible name of the `<input matStartDate/>` */
|
|
349
|
-
startDateAccessibleName = input(
|
|
363
|
+
startDateAccessibleName = input(/* @ts-ignore */
|
|
364
|
+
...(ngDevMode ? [undefined, { debugName: "startDateAccessibleName" }] : /* istanbul ignore next */ []));
|
|
350
365
|
/** ARIA Accessible name of the `<input matEndDate/>` */
|
|
351
|
-
endDateAccessibleName = input(
|
|
366
|
+
endDateAccessibleName = input(/* @ts-ignore */
|
|
367
|
+
...(ngDevMode ? [undefined, { debugName: "endDateAccessibleName" }] : /* istanbul ignore next */ []));
|
|
352
368
|
/** Emits when a new value is selected. */
|
|
353
369
|
selectedValueChange = output();
|
|
354
370
|
/** Emits when the preview has changed as a result of a user action. */
|
|
@@ -363,17 +379,20 @@ class NgxMatCalendarBody {
|
|
|
363
379
|
const rows = this.rows();
|
|
364
380
|
const numCols = this.numCols();
|
|
365
381
|
return rows && rows.length && rows[0].length ? numCols - rows[0].length : 0;
|
|
366
|
-
},
|
|
382
|
+
}, /* @ts-ignore */
|
|
383
|
+
...(ngDevMode ? [{ debugName: "_firstRowOffset" }] : /* istanbul ignore next */ []));
|
|
367
384
|
/** Padding for the individual date cells. */
|
|
368
385
|
_cellPadding = computed(() => {
|
|
369
386
|
const numCols = this.numCols();
|
|
370
387
|
const cellAspectRatio = this.cellAspectRatio();
|
|
371
388
|
return `${(50 * cellAspectRatio) / numCols}%`;
|
|
372
|
-
},
|
|
389
|
+
}, /* @ts-ignore */
|
|
390
|
+
...(ngDevMode ? [{ debugName: "_cellPadding" }] : /* istanbul ignore next */ []));
|
|
373
391
|
/** Width of an individual cell. */
|
|
374
392
|
_cellWidth = computed(() => {
|
|
375
393
|
return `${100 / this.numCols()}%`;
|
|
376
|
-
},
|
|
394
|
+
}, /* @ts-ignore */
|
|
395
|
+
...(ngDevMode ? [{ debugName: "_cellWidth" }] : /* istanbul ignore next */ []));
|
|
377
396
|
_didDragSinceMouseDown = false;
|
|
378
397
|
_elementRef = inject((ElementRef));
|
|
379
398
|
_ngZone = inject(NgZone);
|
|
@@ -653,10 +672,10 @@ class NgxMatCalendarBody {
|
|
|
653
672
|
_id = `mat-calendar-body-${calendarBodyId++}`;
|
|
654
673
|
_startDateLabelId = `${this._id}-start-date`;
|
|
655
674
|
_endDateLabelId = `${this._id}-end-date`;
|
|
656
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
657
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.14", type: NgxMatCalendarBody, isStandalone: true, selector: "[ngx-mat-calendar-body]", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, rows: { classPropertyName: "rows", publicName: "rows", isSignal: true, isRequired: false, transformFunction: null }, todayValue: { classPropertyName: "todayValue", publicName: "todayValue", isSignal: true, isRequired: false, transformFunction: null }, startValue: { classPropertyName: "startValue", publicName: "startValue", isSignal: true, isRequired: false, transformFunction: null }, endValue: { classPropertyName: "endValue", publicName: "endValue", isSignal: true, isRequired: false, transformFunction: null }, labelMinRequiredCells: { classPropertyName: "labelMinRequiredCells", publicName: "labelMinRequiredCells", isSignal: true, isRequired: false, transformFunction: null }, numCols: { classPropertyName: "numCols", publicName: "numCols", isSignal: true, isRequired: false, transformFunction: null }, activeCell: { classPropertyName: "activeCell", publicName: "activeCell", isSignal: true, isRequired: false, transformFunction: null }, isRange: { classPropertyName: "isRange", publicName: "isRange", isSignal: true, isRequired: false, transformFunction: null }, cellAspectRatio: { classPropertyName: "cellAspectRatio", publicName: "cellAspectRatio", isSignal: true, isRequired: false, transformFunction: null }, comparisonStart: { classPropertyName: "comparisonStart", publicName: "comparisonStart", isSignal: true, isRequired: false, transformFunction: null }, comparisonEnd: { classPropertyName: "comparisonEnd", publicName: "comparisonEnd", isSignal: true, isRequired: false, transformFunction: null }, previewStart: { classPropertyName: "previewStart", publicName: "previewStart", isSignal: true, isRequired: false, transformFunction: null }, previewEnd: { classPropertyName: "previewEnd", publicName: "previewEnd", isSignal: true, isRequired: false, transformFunction: null }, startDateAccessibleName: { classPropertyName: "startDateAccessibleName", publicName: "startDateAccessibleName", isSignal: true, isRequired: false, transformFunction: null }, endDateAccessibleName: { classPropertyName: "endDateAccessibleName", publicName: "endDateAccessibleName", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { selectedValueChange: "selectedValueChange", previewChange: "previewChange", activeDateChange: "activeDateChange", dragStarted: "dragStarted", dragEnded: "dragEnded" }, host: { classAttribute: "ngx-mat-calendar-body" }, exportAs: ["matCalendarBody"], ngImport: i0, template: "<!--\nIf there's not enough space in the first row, create a separate label row. We mark this row as\naria-hidden because we don't want it to be read out as one of the weeks in the month.\n-->\n@if (_firstRowOffset()! < labelMinRequiredCells()!) {\n <tr aria-hidden=\"true\">\n <td\n class=\"mat-calendar-body-label\"\n [attr.colspan]=\"numCols()\"\n [style.paddingTop]=\"_cellPadding()\"\n [style.paddingBottom]=\"_cellPadding()\">\n {{ label() }}\n </td>\n </tr>\n}\n\n<!-- Create the first row separately so we can include a special spacer cell. -->\n@for (row of rows(); track rowIndex; let rowIndex = $index) {\n <tr role=\"row\">\n <!--\n This cell is purely decorative, but we can't put `aria-hidden` or `role=\"presentation\"` on it,\n because it throws off the week days for the rest of the row on NVDA. The aspect ratio of the\n table cells is maintained by setting the top and bottom padding as a percentage of the width\n (a variant of the trick described here: https://www.w3schools.com/howto/howto_css_aspect_ratio.asp).\n -->\n @if (rowIndex === 0 && _firstRowOffset()) {\n <td\n class=\"mat-calendar-body-label\"\n [attr.colspan]=\"_firstRowOffset()\"\n [style.paddingTop]=\"_cellPadding()\"\n [style.paddingBottom]=\"_cellPadding()\">\n {{ _firstRowOffset()! >= labelMinRequiredCells()! ? label() : '' }}\n </td>\n }\n <!--\n Each gridcell in the calendar contains a button, which signals to assistive technology that the\n cell is interactable, as well as the selection state via `aria-pressed`. See #23476 for\n background.\n -->\n @for (item of row; track colIndex; let colIndex = $index) {\n <td\n role=\"gridcell\"\n class=\"mat-calendar-body-cell-container\"\n [style.width]=\"_cellWidth()\"\n [style.paddingTop]=\"_cellPadding()\"\n [style.paddingBottom]=\"_cellPadding()\"\n [attr.data-mat-row]=\"rowIndex\"\n [attr.data-mat-col]=\"colIndex\">\n <button\n type=\"button\"\n class=\"mat-calendar-body-cell\"\n [ngClass]=\"item.cssClasses\"\n [tabindex]=\"_isActiveCell(rowIndex, colIndex) ? 0 : -1\"\n [class.mat-calendar-body-disabled]=\"!item.enabled\"\n [class.mat-calendar-body-active]=\"_isActiveCell(rowIndex, colIndex)\"\n [class.mat-calendar-body-range-start]=\"_isRangeStart(item.compareValue)\"\n [class.mat-calendar-body-range-end]=\"_isRangeEnd(item.compareValue)\"\n [class.mat-calendar-body-in-range]=\"_isInRange(item.compareValue)\"\n [class.mat-calendar-body-comparison-bridge-start]=\"\n _isComparisonBridgeStart(item.compareValue, rowIndex, colIndex)\n \"\n [class.mat-calendar-body-comparison-bridge-end]=\"\n _isComparisonBridgeEnd(item.compareValue, rowIndex, colIndex)\n \"\n [class.mat-calendar-body-comparison-start]=\"_isComparisonStart(item.compareValue)\"\n [class.mat-calendar-body-comparison-end]=\"_isComparisonEnd(item.compareValue)\"\n [class.mat-calendar-body-in-comparison-range]=\"_isInComparisonRange(item.compareValue)\"\n [class.mat-calendar-body-preview-start]=\"_isPreviewStart(item.compareValue)\"\n [class.mat-calendar-body-preview-end]=\"_isPreviewEnd(item.compareValue)\"\n [class.mat-calendar-body-in-preview]=\"_isInPreview(item.compareValue)\"\n [attr.aria-label]=\"item.ariaLabel\"\n [attr.aria-disabled]=\"!item.enabled || null\"\n [attr.aria-pressed]=\"_isSelected(item.compareValue)\"\n [attr.aria-current]=\"todayValue() === item.compareValue ? 'date' : null\"\n [attr.aria-describedby]=\"_getDescribedby(item.compareValue)\"\n (click)=\"_cellClicked(item, $event)\"\n (focus)=\"_emitActiveDateChange(item, $event)\">\n <span\n class=\"mat-calendar-body-cell-content mat-focus-indicator\"\n [class.mat-calendar-body-selected]=\"_isSelected(item.compareValue)\"\n [class.mat-calendar-body-comparison-identical]=\"\n _isComparisonIdentical(item.compareValue)\n \"\n [class.mat-calendar-body-today]=\"todayValue() === item.compareValue\">\n {{ item.displayValue }}\n </span>\n <span class=\"mat-calendar-body-cell-preview\" aria-hidden=\"true\"></span>\n </button>\n </td>\n }\n </tr>\n}\n\n<label [id]=\"_startDateLabelId\" class=\"mat-calendar-body-hidden-label\">\n {{ startDateAccessibleName() }}\n</label>\n<label [id]=\"_endDateLabelId\" class=\"mat-calendar-body-hidden-label\">\n {{ endDateAccessibleName() }}\n</label>\n", styles: [".mat-calendar-body{min-width:224px}.mat-calendar-body-label{height:0;line-height:0;padding-left:4.7142857143%;padding-right:4.7142857143%;text-align:start;font-size:var(--mat-datepicker-calendar-body-label-text-size, var(--mat-sys-title-small-size));font-weight:var(--mat-datepicker-calendar-body-label-text-weight, var(--mat-sys-title-small-weight));color:var(--mat-datepicker-calendar-body-label-text-color, var(--mat-sys-on-surface))}.mat-calendar-body-hidden-label{display:none}.mat-calendar-body-cell-container{position:relative;height:0;line-height:0}.mat-calendar-body-cell-container .mat-calendar-body-cell:not(.mat-calendar-body-disabled):hover>.mat-calendar-body-cell-content:not(.mat-calendar-body-selected):not(.mat-calendar-body-comparison-identical){background-color:var(--mat-datepicker-calendar-date-hover-state-background-color, color-mix(in srgb, var(--mat-sys-on-surface) calc(var(--mat-sys-hover-state-layer-opacity) * 100%), transparent))}.mat-calendar-body-disabled>.mat-calendar-body-cell-content:not(.mat-calendar-body-selected):not(.mat-calendar-body-comparison-identical){color:var(--mat-datepicker-calendar-date-disabled-state-text-color, color-mix(in srgb, var(--mat-sys-on-surface) 38%, transparent))}.mat-calendar-body-cell{-webkit-user-select:none;user-select:none;cursor:pointer;outline:none;border:none;-webkit-tap-highlight-color:transparent}.mat-calendar-body-cell::-moz-focus-inner{border:0}.mat-calendar-body-cell{position:absolute;top:0;left:0;width:100%;height:100%;background:none;text-align:center;outline:none;font-family:var(--mat-datepicker-calendar-text-font, var(--mat-sys-body-medium-font));font-size:var(--mat-datepicker-calendar-text-size, var(--mat-sys-body-medium-size));margin:0}.mat-calendar-body-cell:before,.mat-calendar-body-cell:after,.mat-calendar-body-cell-preview{content:\"\";position:absolute;top:5%;left:0;z-index:0;box-sizing:border-box;display:block;height:90%;width:100%}.mat-calendar-body-range-start:not(.mat-calendar-body-in-comparison-range):before,.mat-calendar-body-range-start:after,.mat-calendar-body-comparison-start:not(.mat-calendar-body-comparison-bridge-start):before,.mat-calendar-body-comparison-start:after,.mat-calendar-body-preview-start .mat-calendar-body-cell-preview{left:5%;width:95%;border-top-left-radius:999px;border-bottom-left-radius:999px}[dir=rtl] .mat-calendar-body-range-start:not(.mat-calendar-body-in-comparison-range):before,[dir=rtl] .mat-calendar-body-range-start:after,[dir=rtl] .mat-calendar-body-comparison-start:not(.mat-calendar-body-comparison-bridge-start):before,[dir=rtl] .mat-calendar-body-comparison-start:after,[dir=rtl] .mat-calendar-body-preview-start .mat-calendar-body-cell-preview{left:0;border-radius:0 999px 999px 0}.mat-calendar-body-range-end:not(.mat-calendar-body-in-comparison-range):before,.mat-calendar-body-range-end:after,.mat-calendar-body-comparison-end:not(.mat-calendar-body-comparison-bridge-end):before,.mat-calendar-body-comparison-end:after,.mat-calendar-body-preview-end .mat-calendar-body-cell-preview{width:95%;border-top-right-radius:999px;border-bottom-right-radius:999px}[dir=rtl] .mat-calendar-body-range-end:not(.mat-calendar-body-in-comparison-range):before,[dir=rtl] .mat-calendar-body-range-end:after,[dir=rtl] .mat-calendar-body-comparison-end:not(.mat-calendar-body-comparison-bridge-end):before,[dir=rtl] .mat-calendar-body-comparison-end:after,[dir=rtl] .mat-calendar-body-preview-end .mat-calendar-body-cell-preview{left:5%;border-radius:999px 0 0 999px}[dir=rtl] .mat-calendar-body-comparison-bridge-start.mat-calendar-body-range-end:after,[dir=rtl] .mat-calendar-body-comparison-bridge-end.mat-calendar-body-range-start:after{width:95%;border-top-right-radius:999px;border-bottom-right-radius:999px}.mat-calendar-body-comparison-start.mat-calendar-body-range-end:after,[dir=rtl] .mat-calendar-body-comparison-start.mat-calendar-body-range-end:after,.mat-calendar-body-comparison-end.mat-calendar-body-range-start:after,[dir=rtl] .mat-calendar-body-comparison-end.mat-calendar-body-range-start:after{width:90%}.mat-calendar-body-in-preview .mat-calendar-body-cell-preview{border-top:dashed 1px;border-bottom:dashed 1px}.mat-calendar-body-preview-start .mat-calendar-body-cell-preview{border-left:dashed 1px}[dir=rtl] .mat-calendar-body-preview-start .mat-calendar-body-cell-preview{border-left:0;border-right:dashed 1px}.mat-calendar-body-preview-end .mat-calendar-body-cell-preview{border-right:dashed 1px}[dir=rtl] .mat-calendar-body-preview-end .mat-calendar-body-cell-preview{border-right:0;border-left:dashed 1px}.mat-calendar-body-disabled{cursor:default}@media(forced-colors:active){.mat-calendar-body-disabled{opacity:.5}}.mat-calendar-body-cell-content{top:5%;left:5%;z-index:1;display:flex;align-items:center;justify-content:center;box-sizing:border-box;width:90%;height:90%;line-height:1;border-width:1px;border-style:solid;border-radius:999px;color:var(--mat-datepicker-calendar-date-text-color, var(--mat-sys-on-surface));border-color:var(--mat-datepicker-calendar-date-outline-color, transparent)}.mat-calendar-body-cell-content.mat-calendar-body-selected{background-color:var(--mat-datepicker-calendar-date-selected-state-background-color, var(--mat-sys-primary));color:var(--mat-datepicker-calendar-date-selected-state-text-color, var(--mat-sys-on-primary))}.mat-calendar-body-cell-content.mat-calendar-body-today:not(.mat-calendar-body-selected):not(.mat-calendar-body-comparison-identical){border-color:var(--mat-datepicker-calendar-date-today-outline-color, var(--mat-sys-primary))}.mat-calendar-body-cell-content.mat-focus-indicator{position:absolute}@media(forced-colors:active){.mat-calendar-body-cell-content{border:none}}@media(forced-colors:active){.mat-datepicker-popup:not(:empty),.mat-calendar-body-cell:not(.mat-calendar-body-in-range) .mat-calendar-body-selected{outline:solid 1px}.mat-calendar-body-today{outline:dotted 1px}.mat-calendar-body-cell:before,.mat-calendar-body-cell:after,.mat-calendar-body-selected{background:none}.mat-calendar-body-in-range:before,.mat-calendar-body-comparison-bridge-start:before,.mat-calendar-body-comparison-bridge-end:before{border-top:solid 1px;border-bottom:solid 1px}.mat-calendar-body-range-start:before{border-left:solid 1px}[dir=rtl] .mat-calendar-body-range-start:before{border-left:0;border-right:solid 1px}.mat-calendar-body-range-end:before{border-right:solid 1px}[dir=rtl] .mat-calendar-body-range-end:before{border-right:0;border-left:solid 1px}.mat-calendar-body-in-comparison-range:before{border-top:dashed 1px;border-bottom:dashed 1px}.mat-calendar-body-comparison-start:before{border-left:dashed 1px}[dir=rtl] .mat-calendar-body-comparison-start:before{border-left:0;border-right:dashed 1px}.mat-calendar-body-comparison-end:before{border-right:dashed 1px}[dir=rtl] .mat-calendar-body-comparison-end:before{border-right:0;border-left:dashed 1px}}[dir=rtl] .mat-calendar-body-label{text-align:right}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
675
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.0", ngImport: i0, type: NgxMatCalendarBody, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
676
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.0", type: NgxMatCalendarBody, isStandalone: true, selector: "[ngx-mat-calendar-body]", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, rows: { classPropertyName: "rows", publicName: "rows", isSignal: true, isRequired: false, transformFunction: null }, todayValue: { classPropertyName: "todayValue", publicName: "todayValue", isSignal: true, isRequired: false, transformFunction: null }, startValue: { classPropertyName: "startValue", publicName: "startValue", isSignal: true, isRequired: false, transformFunction: null }, endValue: { classPropertyName: "endValue", publicName: "endValue", isSignal: true, isRequired: false, transformFunction: null }, labelMinRequiredCells: { classPropertyName: "labelMinRequiredCells", publicName: "labelMinRequiredCells", isSignal: true, isRequired: false, transformFunction: null }, numCols: { classPropertyName: "numCols", publicName: "numCols", isSignal: true, isRequired: false, transformFunction: null }, activeCell: { classPropertyName: "activeCell", publicName: "activeCell", isSignal: true, isRequired: false, transformFunction: null }, isRange: { classPropertyName: "isRange", publicName: "isRange", isSignal: true, isRequired: false, transformFunction: null }, cellAspectRatio: { classPropertyName: "cellAspectRatio", publicName: "cellAspectRatio", isSignal: true, isRequired: false, transformFunction: null }, comparisonStart: { classPropertyName: "comparisonStart", publicName: "comparisonStart", isSignal: true, isRequired: false, transformFunction: null }, comparisonEnd: { classPropertyName: "comparisonEnd", publicName: "comparisonEnd", isSignal: true, isRequired: false, transformFunction: null }, previewStart: { classPropertyName: "previewStart", publicName: "previewStart", isSignal: true, isRequired: false, transformFunction: null }, previewEnd: { classPropertyName: "previewEnd", publicName: "previewEnd", isSignal: true, isRequired: false, transformFunction: null }, startDateAccessibleName: { classPropertyName: "startDateAccessibleName", publicName: "startDateAccessibleName", isSignal: true, isRequired: false, transformFunction: null }, endDateAccessibleName: { classPropertyName: "endDateAccessibleName", publicName: "endDateAccessibleName", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { selectedValueChange: "selectedValueChange", previewChange: "previewChange", activeDateChange: "activeDateChange", dragStarted: "dragStarted", dragEnded: "dragEnded" }, host: { classAttribute: "ngx-mat-calendar-body" }, exportAs: ["matCalendarBody"], ngImport: i0, template: "<!--\nIf there's not enough space in the first row, create a separate label row. We mark this row as\naria-hidden because we don't want it to be read out as one of the weeks in the month.\n-->\n@if (_firstRowOffset()! < labelMinRequiredCells()!) {\n <tr aria-hidden=\"true\">\n <td\n class=\"mat-calendar-body-label\"\n [attr.colspan]=\"numCols()\"\n [style.paddingTop]=\"_cellPadding()\"\n [style.paddingBottom]=\"_cellPadding()\">\n {{ label() }}\n </td>\n </tr>\n}\n\n<!-- Create the first row separately so we can include a special spacer cell. -->\n@for (row of rows(); track rowIndex; let rowIndex = $index) {\n <tr role=\"row\">\n <!--\n This cell is purely decorative, but we can't put `aria-hidden` or `role=\"presentation\"` on it,\n because it throws off the week days for the rest of the row on NVDA. The aspect ratio of the\n table cells is maintained by setting the top and bottom padding as a percentage of the width\n (a variant of the trick described here: https://www.w3schools.com/howto/howto_css_aspect_ratio.asp).\n -->\n @if (rowIndex === 0 && _firstRowOffset()) {\n <td\n class=\"mat-calendar-body-label\"\n [attr.colspan]=\"_firstRowOffset()\"\n [style.paddingTop]=\"_cellPadding()\"\n [style.paddingBottom]=\"_cellPadding()\">\n {{ _firstRowOffset()! >= labelMinRequiredCells()! ? label() : '' }}\n </td>\n }\n <!--\n Each gridcell in the calendar contains a button, which signals to assistive technology that the\n cell is interactable, as well as the selection state via `aria-pressed`. See #23476 for\n background.\n -->\n @for (item of row; track colIndex; let colIndex = $index) {\n <td\n role=\"gridcell\"\n class=\"mat-calendar-body-cell-container\"\n [style.width]=\"_cellWidth()\"\n [style.paddingTop]=\"_cellPadding()\"\n [style.paddingBottom]=\"_cellPadding()\"\n [attr.data-mat-row]=\"rowIndex\"\n [attr.data-mat-col]=\"colIndex\">\n <button\n type=\"button\"\n class=\"mat-calendar-body-cell\"\n [ngClass]=\"item.cssClasses\"\n [tabindex]=\"_isActiveCell(rowIndex, colIndex) ? 0 : -1\"\n [class.mat-calendar-body-disabled]=\"!item.enabled\"\n [class.mat-calendar-body-active]=\"_isActiveCell(rowIndex, colIndex)\"\n [class.mat-calendar-body-range-start]=\"_isRangeStart(item.compareValue)\"\n [class.mat-calendar-body-range-end]=\"_isRangeEnd(item.compareValue)\"\n [class.mat-calendar-body-in-range]=\"_isInRange(item.compareValue)\"\n [class.mat-calendar-body-comparison-bridge-start]=\"\n _isComparisonBridgeStart(item.compareValue, rowIndex, colIndex)\n \"\n [class.mat-calendar-body-comparison-bridge-end]=\"\n _isComparisonBridgeEnd(item.compareValue, rowIndex, colIndex)\n \"\n [class.mat-calendar-body-comparison-start]=\"_isComparisonStart(item.compareValue)\"\n [class.mat-calendar-body-comparison-end]=\"_isComparisonEnd(item.compareValue)\"\n [class.mat-calendar-body-in-comparison-range]=\"_isInComparisonRange(item.compareValue)\"\n [class.mat-calendar-body-preview-start]=\"_isPreviewStart(item.compareValue)\"\n [class.mat-calendar-body-preview-end]=\"_isPreviewEnd(item.compareValue)\"\n [class.mat-calendar-body-in-preview]=\"_isInPreview(item.compareValue)\"\n [attr.aria-label]=\"item.ariaLabel\"\n [attr.aria-disabled]=\"!item.enabled || null\"\n [attr.aria-pressed]=\"_isSelected(item.compareValue)\"\n [attr.aria-current]=\"todayValue() === item.compareValue ? 'date' : null\"\n [attr.aria-describedby]=\"_getDescribedby(item.compareValue)\"\n (click)=\"_cellClicked(item, $event)\"\n (focus)=\"_emitActiveDateChange(item, $event)\">\n <span\n class=\"mat-calendar-body-cell-content mat-focus-indicator\"\n [class.mat-calendar-body-selected]=\"_isSelected(item.compareValue)\"\n [class.mat-calendar-body-comparison-identical]=\"\n _isComparisonIdentical(item.compareValue)\n \"\n [class.mat-calendar-body-today]=\"todayValue() === item.compareValue\">\n {{ item.displayValue }}\n </span>\n <span class=\"mat-calendar-body-cell-preview\" aria-hidden=\"true\"></span>\n </button>\n </td>\n }\n </tr>\n}\n\n<label [id]=\"_startDateLabelId\" class=\"mat-calendar-body-hidden-label\">\n {{ startDateAccessibleName() }}\n</label>\n<label [id]=\"_endDateLabelId\" class=\"mat-calendar-body-hidden-label\">\n {{ endDateAccessibleName() }}\n</label>\n", styles: [".mat-calendar-body{min-width:224px}.mat-calendar-body-label{height:0;line-height:0;padding-left:4.7142857143%;padding-right:4.7142857143%;text-align:start;font-size:var(--mat-datepicker-calendar-body-label-text-size, var(--mat-sys-title-small-size));font-weight:var(--mat-datepicker-calendar-body-label-text-weight, var(--mat-sys-title-small-weight));color:var(--mat-datepicker-calendar-body-label-text-color, var(--mat-sys-on-surface))}.mat-calendar-body-hidden-label{display:none}.mat-calendar-body-cell-container{position:relative;height:0;line-height:0}.mat-calendar-body-cell-container .mat-calendar-body-cell:not(.mat-calendar-body-disabled):hover>.mat-calendar-body-cell-content:not(.mat-calendar-body-selected):not(.mat-calendar-body-comparison-identical){background-color:var(--mat-datepicker-calendar-date-hover-state-background-color, color-mix(in srgb, var(--mat-sys-on-surface) calc(var(--mat-sys-hover-state-layer-opacity) * 100%), transparent))}.mat-calendar-body-disabled>.mat-calendar-body-cell-content:not(.mat-calendar-body-selected):not(.mat-calendar-body-comparison-identical){color:var(--mat-datepicker-calendar-date-disabled-state-text-color, color-mix(in srgb, var(--mat-sys-on-surface) 38%, transparent))}.mat-calendar-body-cell{-webkit-user-select:none;user-select:none;cursor:pointer;outline:none;border:none;-webkit-tap-highlight-color:transparent}.mat-calendar-body-cell::-moz-focus-inner{border:0}.mat-calendar-body-cell{position:absolute;top:0;left:0;width:100%;height:100%;background:none;text-align:center;outline:none;font-family:var(--mat-datepicker-calendar-text-font, var(--mat-sys-body-medium-font));font-size:var(--mat-datepicker-calendar-text-size, var(--mat-sys-body-medium-size));margin:0}.mat-calendar-body-cell:before,.mat-calendar-body-cell:after,.mat-calendar-body-cell-preview{content:\"\";position:absolute;top:5%;left:0;z-index:0;box-sizing:border-box;display:block;height:90%;width:100%}.mat-calendar-body-range-start:not(.mat-calendar-body-in-comparison-range):before,.mat-calendar-body-range-start:after,.mat-calendar-body-comparison-start:not(.mat-calendar-body-comparison-bridge-start):before,.mat-calendar-body-comparison-start:after,.mat-calendar-body-preview-start .mat-calendar-body-cell-preview{left:5%;width:95%;border-top-left-radius:999px;border-bottom-left-radius:999px}[dir=rtl] .mat-calendar-body-range-start:not(.mat-calendar-body-in-comparison-range):before,[dir=rtl] .mat-calendar-body-range-start:after,[dir=rtl] .mat-calendar-body-comparison-start:not(.mat-calendar-body-comparison-bridge-start):before,[dir=rtl] .mat-calendar-body-comparison-start:after,[dir=rtl] .mat-calendar-body-preview-start .mat-calendar-body-cell-preview{left:0;border-radius:0 999px 999px 0}.mat-calendar-body-range-end:not(.mat-calendar-body-in-comparison-range):before,.mat-calendar-body-range-end:after,.mat-calendar-body-comparison-end:not(.mat-calendar-body-comparison-bridge-end):before,.mat-calendar-body-comparison-end:after,.mat-calendar-body-preview-end .mat-calendar-body-cell-preview{width:95%;border-top-right-radius:999px;border-bottom-right-radius:999px}[dir=rtl] .mat-calendar-body-range-end:not(.mat-calendar-body-in-comparison-range):before,[dir=rtl] .mat-calendar-body-range-end:after,[dir=rtl] .mat-calendar-body-comparison-end:not(.mat-calendar-body-comparison-bridge-end):before,[dir=rtl] .mat-calendar-body-comparison-end:after,[dir=rtl] .mat-calendar-body-preview-end .mat-calendar-body-cell-preview{left:5%;border-radius:999px 0 0 999px}[dir=rtl] .mat-calendar-body-comparison-bridge-start.mat-calendar-body-range-end:after,[dir=rtl] .mat-calendar-body-comparison-bridge-end.mat-calendar-body-range-start:after{width:95%;border-top-right-radius:999px;border-bottom-right-radius:999px}.mat-calendar-body-comparison-start.mat-calendar-body-range-end:after,[dir=rtl] .mat-calendar-body-comparison-start.mat-calendar-body-range-end:after,.mat-calendar-body-comparison-end.mat-calendar-body-range-start:after,[dir=rtl] .mat-calendar-body-comparison-end.mat-calendar-body-range-start:after{width:90%}.mat-calendar-body-in-preview .mat-calendar-body-cell-preview{border-top:dashed 1px;border-bottom:dashed 1px}.mat-calendar-body-preview-start .mat-calendar-body-cell-preview{border-left:dashed 1px}[dir=rtl] .mat-calendar-body-preview-start .mat-calendar-body-cell-preview{border-left:0;border-right:dashed 1px}.mat-calendar-body-preview-end .mat-calendar-body-cell-preview{border-right:dashed 1px}[dir=rtl] .mat-calendar-body-preview-end .mat-calendar-body-cell-preview{border-right:0;border-left:dashed 1px}.mat-calendar-body-disabled{cursor:default}@media(forced-colors:active){.mat-calendar-body-disabled{opacity:.5}}.mat-calendar-body-cell-content{top:5%;left:5%;z-index:1;display:flex;align-items:center;justify-content:center;box-sizing:border-box;width:90%;height:90%;line-height:1;border-width:1px;border-style:solid;border-radius:999px;color:var(--mat-datepicker-calendar-date-text-color, var(--mat-sys-on-surface));border-color:var(--mat-datepicker-calendar-date-outline-color, transparent)}.mat-calendar-body-cell-content.mat-calendar-body-selected{background-color:var(--mat-datepicker-calendar-date-selected-state-background-color, var(--mat-sys-primary));color:var(--mat-datepicker-calendar-date-selected-state-text-color, var(--mat-sys-on-primary))}.mat-calendar-body-cell-content.mat-calendar-body-today:not(.mat-calendar-body-selected):not(.mat-calendar-body-comparison-identical){border-color:var(--mat-datepicker-calendar-date-today-outline-color, var(--mat-sys-primary))}.mat-calendar-body-cell-content.mat-focus-indicator{position:absolute}@media(forced-colors:active){.mat-calendar-body-cell-content{border:none}}@media(forced-colors:active){.mat-datepicker-popup:not(:empty),.mat-calendar-body-cell:not(.mat-calendar-body-in-range) .mat-calendar-body-selected{outline:solid 1px}.mat-calendar-body-today{outline:dotted 1px}.mat-calendar-body-cell:before,.mat-calendar-body-cell:after,.mat-calendar-body-selected{background:none}.mat-calendar-body-in-range:before,.mat-calendar-body-comparison-bridge-start:before,.mat-calendar-body-comparison-bridge-end:before{border-top:solid 1px;border-bottom:solid 1px}.mat-calendar-body-range-start:before{border-left:solid 1px}[dir=rtl] .mat-calendar-body-range-start:before{border-left:0;border-right:solid 1px}.mat-calendar-body-range-end:before{border-right:solid 1px}[dir=rtl] .mat-calendar-body-range-end:before{border-right:0;border-left:solid 1px}.mat-calendar-body-in-comparison-range:before{border-top:dashed 1px;border-bottom:dashed 1px}.mat-calendar-body-comparison-start:before{border-left:dashed 1px}[dir=rtl] .mat-calendar-body-comparison-start:before{border-left:0;border-right:dashed 1px}.mat-calendar-body-comparison-end:before{border-right:dashed 1px}[dir=rtl] .mat-calendar-body-comparison-end:before{border-right:0;border-left:dashed 1px}}[dir=rtl] .mat-calendar-body-label{text-align:right}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
658
677
|
}
|
|
659
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
678
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.0", ngImport: i0, type: NgxMatCalendarBody, decorators: [{
|
|
660
679
|
type: Component,
|
|
661
680
|
args: [{ selector: '[ngx-mat-calendar-body]', host: {
|
|
662
681
|
class: 'ngx-mat-calendar-body',
|
|
@@ -775,10 +794,10 @@ class DefaultNgxMatCalendarRangeStrategy {
|
|
|
775
794
|
}
|
|
776
795
|
return new NgxDateRange(start, end);
|
|
777
796
|
}
|
|
778
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
779
|
-
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "
|
|
797
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.0", ngImport: i0, type: DefaultNgxMatCalendarRangeStrategy, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
|
|
798
|
+
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "22.0.0", ngImport: i0, type: DefaultNgxMatCalendarRangeStrategy });
|
|
780
799
|
}
|
|
781
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
800
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.0", ngImport: i0, type: DefaultNgxMatCalendarRangeStrategy, decorators: [{
|
|
782
801
|
type: Injectable
|
|
783
802
|
}] });
|
|
784
803
|
/** @docs-private */
|
|
@@ -857,19 +876,26 @@ class NgxMatMonthView {
|
|
|
857
876
|
}
|
|
858
877
|
_maxDate = null;
|
|
859
878
|
/** Function used to filter which dates are selectable. */
|
|
860
|
-
dateFilter = input(
|
|
879
|
+
dateFilter = input(/* @ts-ignore */
|
|
880
|
+
...(ngDevMode ? [undefined, { debugName: "dateFilter" }] : /* istanbul ignore next */ []));
|
|
861
881
|
/** Function that can be used to add custom CSS classes to dates. */
|
|
862
|
-
dateClass = input(
|
|
882
|
+
dateClass = input(/* @ts-ignore */
|
|
883
|
+
...(ngDevMode ? [undefined, { debugName: "dateClass" }] : /* istanbul ignore next */ []));
|
|
863
884
|
/** Start of the comparison range. */
|
|
864
|
-
comparisonStart = input(
|
|
885
|
+
comparisonStart = input(/* @ts-ignore */
|
|
886
|
+
...(ngDevMode ? [undefined, { debugName: "comparisonStart" }] : /* istanbul ignore next */ []));
|
|
865
887
|
/** End of the comparison range. */
|
|
866
|
-
comparisonEnd = input(
|
|
888
|
+
comparisonEnd = input(/* @ts-ignore */
|
|
889
|
+
...(ngDevMode ? [undefined, { debugName: "comparisonEnd" }] : /* istanbul ignore next */ []));
|
|
867
890
|
/** ARIA Accessible name of the `<input matStartDate/>` */
|
|
868
|
-
startDateAccessibleName = input(
|
|
891
|
+
startDateAccessibleName = input(/* @ts-ignore */
|
|
892
|
+
...(ngDevMode ? [undefined, { debugName: "startDateAccessibleName" }] : /* istanbul ignore next */ []));
|
|
869
893
|
/** ARIA Accessible name of the `<input matEndDate/>` */
|
|
870
|
-
endDateAccessibleName = input(
|
|
894
|
+
endDateAccessibleName = input(/* @ts-ignore */
|
|
895
|
+
...(ngDevMode ? [undefined, { debugName: "endDateAccessibleName" }] : /* istanbul ignore next */ []));
|
|
871
896
|
/** Origin of active drag, or null when dragging is not active. */
|
|
872
|
-
activeDrag = input(null,
|
|
897
|
+
activeDrag = input(null, /* @ts-ignore */
|
|
898
|
+
...(ngDevMode ? [{ debugName: "activeDrag" }] : /* istanbul ignore next */ []));
|
|
873
899
|
/** Emits when a new date is selected. */
|
|
874
900
|
selectedChange = output();
|
|
875
901
|
/** Emits when any date is selected. */
|
|
@@ -884,7 +910,8 @@ class NgxMatMonthView {
|
|
|
884
910
|
/** Emits when any date is activated. */
|
|
885
911
|
activeDateChange = output();
|
|
886
912
|
/** The body of calendar table */
|
|
887
|
-
_matCalendarBody = viewChild(NgxMatCalendarBody,
|
|
913
|
+
_matCalendarBody = viewChild(NgxMatCalendarBody, /* @ts-ignore */
|
|
914
|
+
...(ngDevMode ? [{ debugName: "_matCalendarBody" }] : /* istanbul ignore next */ []));
|
|
888
915
|
/** The label for this month (e.g. "January 2017"). */
|
|
889
916
|
_monthLabel = "";
|
|
890
917
|
/** Grid of calendar cells representing the dates of the month. */
|
|
@@ -1245,10 +1272,10 @@ class NgxMatMonthView {
|
|
|
1245
1272
|
_clearPreview() {
|
|
1246
1273
|
this._previewStart = this._previewEnd = null;
|
|
1247
1274
|
}
|
|
1248
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1249
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
1275
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.0", ngImport: i0, type: NgxMatMonthView, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1276
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.0", type: NgxMatMonthView, isStandalone: true, selector: "ngx-mat-month-view", inputs: { activeDate: { classPropertyName: "activeDate", publicName: "activeDate", isSignal: false, isRequired: false, transformFunction: null }, selected: { classPropertyName: "selected", publicName: "selected", isSignal: false, isRequired: false, transformFunction: null }, minDate: { classPropertyName: "minDate", publicName: "minDate", isSignal: false, isRequired: false, transformFunction: null }, maxDate: { classPropertyName: "maxDate", publicName: "maxDate", isSignal: false, isRequired: false, transformFunction: null }, dateFilter: { classPropertyName: "dateFilter", publicName: "dateFilter", isSignal: true, isRequired: false, transformFunction: null }, dateClass: { classPropertyName: "dateClass", publicName: "dateClass", isSignal: true, isRequired: false, transformFunction: null }, comparisonStart: { classPropertyName: "comparisonStart", publicName: "comparisonStart", isSignal: true, isRequired: false, transformFunction: null }, comparisonEnd: { classPropertyName: "comparisonEnd", publicName: "comparisonEnd", isSignal: true, isRequired: false, transformFunction: null }, startDateAccessibleName: { classPropertyName: "startDateAccessibleName", publicName: "startDateAccessibleName", isSignal: true, isRequired: false, transformFunction: null }, endDateAccessibleName: { classPropertyName: "endDateAccessibleName", publicName: "endDateAccessibleName", isSignal: true, isRequired: false, transformFunction: null }, activeDrag: { classPropertyName: "activeDrag", publicName: "activeDrag", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { selectedChange: "selectedChange", _userSelection: "_userSelection", dragStarted: "dragStarted", dragEnded: "dragEnded", activeDateChange: "activeDateChange" }, viewQueries: [{ propertyName: "_matCalendarBody", first: true, predicate: NgxMatCalendarBody, descendants: true, isSignal: true }], exportAs: ["ngxMatMonthView"], usesOnChanges: true, ngImport: i0, template: "<table class=\"mat-calendar-table\" role=\"grid\">\n <thead class=\"mat-calendar-table-header\">\n <tr>\n @for (day of _weekdays; track $index) {\n <th scope=\"col\">\n <span class=\"cdk-visually-hidden\">{{ day.long }}</span>\n <span aria-hidden=\"true\">{{ day.narrow }}</span>\n </th>\n }\n </tr>\n <tr>\n <th\n aria-hidden=\"true\"\n class=\"mat-calendar-table-header-divider\"\n colspan=\"7\"\n ></th>\n </tr>\n </thead>\n <tbody\n ngx-mat-calendar-body\n [label]=\"_monthLabel\"\n [rows]=\"_weeks\"\n [todayValue]=\"_todayDate!\"\n [startValue]=\"_rangeStart!\"\n [endValue]=\"_rangeEnd!\"\n [comparisonStart]=\"_comparisonRangeStart\"\n [comparisonEnd]=\"_comparisonRangeEnd\"\n [previewStart]=\"_previewStart\"\n [previewEnd]=\"_previewEnd\"\n [isRange]=\"_isRange\"\n [labelMinRequiredCells]=\"3\"\n [activeCell]=\"_dateAdapter ? _dateAdapter.getDate(activeDate) - 1 : 0\"\n [startDateAccessibleName]=\"startDateAccessibleName()\"\n [endDateAccessibleName]=\"endDateAccessibleName()\"\n (selectedValueChange)=\"_dateSelected($event)\"\n (activeDateChange)=\"_updateActiveDate($event)\"\n (previewChange)=\"_previewChanged($event)\"\n (dragStarted)=\"dragStarted.emit($event)\"\n (dragEnded)=\"_dragEnded($event)\"\n (keyup)=\"_handleCalendarBodyKeyup($event)\"\n (keydown)=\"_handleCalendarBodyKeydown($event)\"\n ></tbody>\n</table>\n", dependencies: [{ kind: "component", type: NgxMatCalendarBody, selector: "[ngx-mat-calendar-body]", inputs: ["label", "rows", "todayValue", "startValue", "endValue", "labelMinRequiredCells", "numCols", "activeCell", "isRange", "cellAspectRatio", "comparisonStart", "comparisonEnd", "previewStart", "previewEnd", "startDateAccessibleName", "endDateAccessibleName"], outputs: ["selectedValueChange", "previewChange", "activeDateChange", "dragStarted", "dragEnded"], exportAs: ["matCalendarBody"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
1250
1277
|
}
|
|
1251
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1278
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.0", ngImport: i0, type: NgxMatMonthView, decorators: [{
|
|
1252
1279
|
type: Component,
|
|
1253
1280
|
args: [{ selector: 'ngx-mat-month-view', exportAs: 'ngxMatMonthView', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, imports: [NgxMatCalendarBody], template: "<table class=\"mat-calendar-table\" role=\"grid\">\n <thead class=\"mat-calendar-table-header\">\n <tr>\n @for (day of _weekdays; track $index) {\n <th scope=\"col\">\n <span class=\"cdk-visually-hidden\">{{ day.long }}</span>\n <span aria-hidden=\"true\">{{ day.narrow }}</span>\n </th>\n }\n </tr>\n <tr>\n <th\n aria-hidden=\"true\"\n class=\"mat-calendar-table-header-divider\"\n colspan=\"7\"\n ></th>\n </tr>\n </thead>\n <tbody\n ngx-mat-calendar-body\n [label]=\"_monthLabel\"\n [rows]=\"_weeks\"\n [todayValue]=\"_todayDate!\"\n [startValue]=\"_rangeStart!\"\n [endValue]=\"_rangeEnd!\"\n [comparisonStart]=\"_comparisonRangeStart\"\n [comparisonEnd]=\"_comparisonRangeEnd\"\n [previewStart]=\"_previewStart\"\n [previewEnd]=\"_previewEnd\"\n [isRange]=\"_isRange\"\n [labelMinRequiredCells]=\"3\"\n [activeCell]=\"_dateAdapter ? _dateAdapter.getDate(activeDate) - 1 : 0\"\n [startDateAccessibleName]=\"startDateAccessibleName()\"\n [endDateAccessibleName]=\"endDateAccessibleName()\"\n (selectedValueChange)=\"_dateSelected($event)\"\n (activeDateChange)=\"_updateActiveDate($event)\"\n (previewChange)=\"_previewChanged($event)\"\n (dragStarted)=\"dragStarted.emit($event)\"\n (dragEnded)=\"_dragEnded($event)\"\n (keyup)=\"_handleCalendarBodyKeyup($event)\"\n (keydown)=\"_handleCalendarBodyKeydown($event)\"\n ></tbody>\n</table>\n" }]
|
|
1254
1281
|
}], ctorParameters: () => [], propDecorators: { activeDate: [{
|
|
@@ -1326,9 +1353,11 @@ class NgxMatMultiYearView {
|
|
|
1326
1353
|
}
|
|
1327
1354
|
_maxDate = null;
|
|
1328
1355
|
/** A function used to filter which dates are selectable. */
|
|
1329
|
-
dateFilter = input(
|
|
1356
|
+
dateFilter = input(/* @ts-ignore */
|
|
1357
|
+
...(ngDevMode ? [undefined, { debugName: "dateFilter" }] : /* istanbul ignore next */ []));
|
|
1330
1358
|
/** Function that can be used to add custom CSS classes to date cells. */
|
|
1331
|
-
dateClass = input(
|
|
1359
|
+
dateClass = input(/* @ts-ignore */
|
|
1360
|
+
...(ngDevMode ? [undefined, { debugName: "dateClass" }] : /* istanbul ignore next */ []));
|
|
1332
1361
|
/** Emits when a new year is selected. */
|
|
1333
1362
|
selectedChange = output();
|
|
1334
1363
|
/** Emits the selected year. This doesn't imply a change on the selected date */
|
|
@@ -1336,7 +1365,8 @@ class NgxMatMultiYearView {
|
|
|
1336
1365
|
/** Emits when any date is activated. */
|
|
1337
1366
|
activeDateChange = output();
|
|
1338
1367
|
/** The body of calendar table */
|
|
1339
|
-
_matCalendarBody = viewChild(NgxMatCalendarBody,
|
|
1368
|
+
_matCalendarBody = viewChild(NgxMatCalendarBody, /* @ts-ignore */
|
|
1369
|
+
...(ngDevMode ? [{ debugName: "_matCalendarBody" }] : /* istanbul ignore next */ []));
|
|
1340
1370
|
/** Grid of calendar cells representing the currently displayed years. */
|
|
1341
1371
|
_years = null;
|
|
1342
1372
|
/** The year that today falls on. */
|
|
@@ -1552,10 +1582,10 @@ class NgxMatMultiYearView {
|
|
|
1552
1582
|
this._selectedYear = this._dateAdapter.getYear(value);
|
|
1553
1583
|
}
|
|
1554
1584
|
}
|
|
1555
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1556
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "
|
|
1585
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.0", ngImport: i0, type: NgxMatMultiYearView, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1586
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "22.0.0", type: NgxMatMultiYearView, isStandalone: true, selector: "ngx-mat-multi-year-view", inputs: { activeDate: { classPropertyName: "activeDate", publicName: "activeDate", isSignal: false, isRequired: false, transformFunction: null }, selected: { classPropertyName: "selected", publicName: "selected", isSignal: false, isRequired: false, transformFunction: null }, minDate: { classPropertyName: "minDate", publicName: "minDate", isSignal: false, isRequired: false, transformFunction: null }, maxDate: { classPropertyName: "maxDate", publicName: "maxDate", isSignal: false, isRequired: false, transformFunction: null }, dateFilter: { classPropertyName: "dateFilter", publicName: "dateFilter", isSignal: true, isRequired: false, transformFunction: null }, dateClass: { classPropertyName: "dateClass", publicName: "dateClass", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { selectedChange: "selectedChange", yearSelected: "yearSelected", activeDateChange: "activeDateChange" }, viewQueries: [{ propertyName: "_matCalendarBody", first: true, predicate: NgxMatCalendarBody, descendants: true, isSignal: true }], exportAs: ["ngxMatMultiYearView"], ngImport: i0, template: "<table class=\"mat-calendar-table\" role=\"grid\">\n <thead aria-hidden=\"true\" class=\"mat-calendar-table-header\">\n <tr>\n <th class=\"mat-calendar-table-header-divider\" colspan=\"4\"></th>\n </tr>\n </thead>\n <tbody\n ngx-mat-calendar-body\n [rows]=\"_years\"\n [todayValue]=\"_todayYear\"\n [startValue]=\"_selectedYear!\"\n [endValue]=\"_selectedYear!\"\n [numCols]=\"4\"\n [cellAspectRatio]=\"4 / 7\"\n [activeCell]=\"_getActiveCell()\"\n (selectedValueChange)=\"_yearSelected($event)\"\n (activeDateChange)=\"_updateActiveDate($event)\"\n (keyup)=\"_handleCalendarBodyKeyup($event)\"\n (keydown)=\"_handleCalendarBodyKeydown($event)\"\n ></tbody>\n</table>\n", dependencies: [{ kind: "component", type: NgxMatCalendarBody, selector: "[ngx-mat-calendar-body]", inputs: ["label", "rows", "todayValue", "startValue", "endValue", "labelMinRequiredCells", "numCols", "activeCell", "isRange", "cellAspectRatio", "comparisonStart", "comparisonEnd", "previewStart", "previewEnd", "startDateAccessibleName", "endDateAccessibleName"], outputs: ["selectedValueChange", "previewChange", "activeDateChange", "dragStarted", "dragEnded"], exportAs: ["matCalendarBody"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
1557
1587
|
}
|
|
1558
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1588
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.0", ngImport: i0, type: NgxMatMultiYearView, decorators: [{
|
|
1559
1589
|
type: Component,
|
|
1560
1590
|
args: [{ selector: 'ngx-mat-multi-year-view', exportAs: 'ngxMatMultiYearView', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, imports: [NgxMatCalendarBody], template: "<table class=\"mat-calendar-table\" role=\"grid\">\n <thead aria-hidden=\"true\" class=\"mat-calendar-table-header\">\n <tr>\n <th class=\"mat-calendar-table-header-divider\" colspan=\"4\"></th>\n </tr>\n </thead>\n <tbody\n ngx-mat-calendar-body\n [rows]=\"_years\"\n [todayValue]=\"_todayYear\"\n [startValue]=\"_selectedYear!\"\n [endValue]=\"_selectedYear!\"\n [numCols]=\"4\"\n [cellAspectRatio]=\"4 / 7\"\n [activeCell]=\"_getActiveCell()\"\n (selectedValueChange)=\"_yearSelected($event)\"\n (activeDateChange)=\"_updateActiveDate($event)\"\n (keyup)=\"_handleCalendarBodyKeyup($event)\"\n (keydown)=\"_handleCalendarBodyKeydown($event)\"\n ></tbody>\n</table>\n" }]
|
|
1561
1591
|
}], ctorParameters: () => [], propDecorators: { activeDate: [{
|
|
@@ -1668,9 +1698,11 @@ class NgxMatYearView {
|
|
|
1668
1698
|
}
|
|
1669
1699
|
_maxDate = null;
|
|
1670
1700
|
/** A function used to filter which dates are selectable. */
|
|
1671
|
-
dateFilter = input(
|
|
1701
|
+
dateFilter = input(/* @ts-ignore */
|
|
1702
|
+
...(ngDevMode ? [undefined, { debugName: "dateFilter" }] : /* istanbul ignore next */ []));
|
|
1672
1703
|
/** Function that can be used to add custom CSS classes to date cells. */
|
|
1673
|
-
dateClass = input(
|
|
1704
|
+
dateClass = input(/* @ts-ignore */
|
|
1705
|
+
...(ngDevMode ? [undefined, { debugName: "dateClass" }] : /* istanbul ignore next */ []));
|
|
1674
1706
|
/** Emits when a new month is selected. */
|
|
1675
1707
|
selectedChange = output();
|
|
1676
1708
|
/** Emits the selected month. This doesn't imply a change on the selected date */
|
|
@@ -1678,7 +1710,8 @@ class NgxMatYearView {
|
|
|
1678
1710
|
/** Emits when any date is activated. */
|
|
1679
1711
|
activeDateChange = output();
|
|
1680
1712
|
/** The body of calendar table */
|
|
1681
|
-
_matCalendarBody = viewChild(NgxMatCalendarBody,
|
|
1713
|
+
_matCalendarBody = viewChild(NgxMatCalendarBody, /* @ts-ignore */
|
|
1714
|
+
...(ngDevMode ? [{ debugName: "_matCalendarBody" }] : /* istanbul ignore next */ []));
|
|
1682
1715
|
/** Grid of calendar cells representing the months of the year. */
|
|
1683
1716
|
_months = null;
|
|
1684
1717
|
/** The label for this year (e.g. "2017"). */
|
|
@@ -1921,10 +1954,10 @@ class NgxMatYearView {
|
|
|
1921
1954
|
this._selectedMonth = this._getMonthInCurrentYear(value);
|
|
1922
1955
|
}
|
|
1923
1956
|
}
|
|
1924
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1925
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "
|
|
1957
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.0", ngImport: i0, type: NgxMatYearView, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1958
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "22.0.0", type: NgxMatYearView, isStandalone: true, selector: "ngx-mat-year-view", inputs: { activeDate: { classPropertyName: "activeDate", publicName: "activeDate", isSignal: false, isRequired: false, transformFunction: null }, selected: { classPropertyName: "selected", publicName: "selected", isSignal: false, isRequired: false, transformFunction: null }, minDate: { classPropertyName: "minDate", publicName: "minDate", isSignal: false, isRequired: false, transformFunction: null }, maxDate: { classPropertyName: "maxDate", publicName: "maxDate", isSignal: false, isRequired: false, transformFunction: null }, dateFilter: { classPropertyName: "dateFilter", publicName: "dateFilter", isSignal: true, isRequired: false, transformFunction: null }, dateClass: { classPropertyName: "dateClass", publicName: "dateClass", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { selectedChange: "selectedChange", monthSelected: "monthSelected", activeDateChange: "activeDateChange" }, viewQueries: [{ propertyName: "_matCalendarBody", first: true, predicate: NgxMatCalendarBody, descendants: true, isSignal: true }], exportAs: ["ngxMatYearView"], ngImport: i0, template: "<table class=\"mat-calendar-table\" role=\"grid\">\n <thead aria-hidden=\"true\" class=\"mat-calendar-table-header\">\n <tr>\n <th class=\"mat-calendar-table-header-divider\" colspan=\"4\"></th>\n </tr>\n </thead>\n <tbody\n ngx-mat-calendar-body\n [label]=\"_yearLabel\"\n [rows]=\"_months\"\n [todayValue]=\"_todayMonth!\"\n [startValue]=\"_selectedMonth!\"\n [endValue]=\"_selectedMonth!\"\n [labelMinRequiredCells]=\"2\"\n [numCols]=\"4\"\n [cellAspectRatio]=\"4 / 7\"\n [activeCell]=\"_dateAdapter ? _dateAdapter.getMonth(activeDate) : 0\"\n (selectedValueChange)=\"_monthSelected($event)\"\n (activeDateChange)=\"_updateActiveDate($event)\"\n (keyup)=\"_handleCalendarBodyKeyup($event)\"\n (keydown)=\"_handleCalendarBodyKeydown($event)\"></tbody>\n</table>\n", dependencies: [{ kind: "component", type: NgxMatCalendarBody, selector: "[ngx-mat-calendar-body]", inputs: ["label", "rows", "todayValue", "startValue", "endValue", "labelMinRequiredCells", "numCols", "activeCell", "isRange", "cellAspectRatio", "comparisonStart", "comparisonEnd", "previewStart", "previewEnd", "startDateAccessibleName", "endDateAccessibleName"], outputs: ["selectedValueChange", "previewChange", "activeDateChange", "dragStarted", "dragEnded"], exportAs: ["matCalendarBody"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
1926
1959
|
}
|
|
1927
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1960
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.0", ngImport: i0, type: NgxMatYearView, decorators: [{
|
|
1928
1961
|
type: Component,
|
|
1929
1962
|
args: [{ selector: 'ngx-mat-year-view', exportAs: 'ngxMatYearView', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, imports: [NgxMatCalendarBody], template: "<table class=\"mat-calendar-table\" role=\"grid\">\n <thead aria-hidden=\"true\" class=\"mat-calendar-table-header\">\n <tr>\n <th class=\"mat-calendar-table-header-divider\" colspan=\"4\"></th>\n </tr>\n </thead>\n <tbody\n ngx-mat-calendar-body\n [label]=\"_yearLabel\"\n [rows]=\"_months\"\n [todayValue]=\"_todayMonth!\"\n [startValue]=\"_selectedMonth!\"\n [endValue]=\"_selectedMonth!\"\n [labelMinRequiredCells]=\"2\"\n [numCols]=\"4\"\n [cellAspectRatio]=\"4 / 7\"\n [activeCell]=\"_dateAdapter ? _dateAdapter.getMonth(activeDate) : 0\"\n (selectedValueChange)=\"_monthSelected($event)\"\n (activeDateChange)=\"_updateActiveDate($event)\"\n (keyup)=\"_handleCalendarBodyKeyup($event)\"\n (keydown)=\"_handleCalendarBodyKeydown($event)\"></tbody>\n</table>\n" }]
|
|
1930
1963
|
}], ctorParameters: () => [], propDecorators: { activeDate: [{
|
|
@@ -2068,17 +2101,18 @@ class NgxMatCalendarHeader {
|
|
|
2068
2101
|
}
|
|
2069
2102
|
_id = `mat-calendar-header-${calendarHeaderId++}`;
|
|
2070
2103
|
_periodButtonLabelId = `${this._id}-period-label`;
|
|
2071
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
2072
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
2104
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.0", ngImport: i0, type: NgxMatCalendarHeader, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2105
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.0.0", type: NgxMatCalendarHeader, isStandalone: true, selector: "ngx-mat-calendar-header", exportAs: ["ngxMatCalendarHeader"], ngImport: i0, template: "<div class=\"mat-calendar-header\">\n <div class=\"mat-calendar-controls\">\n <button\n mat-button\n type=\"button\"\n class=\"mat-calendar-period-button\"\n (click)=\"currentPeriodClicked()\"\n [attr.aria-label]=\"periodButtonLabel\"\n [attr.aria-describedby]=\"_periodButtonLabelId\"\n aria-live=\"polite\">\n <span aria-hidden=\"true\">{{ periodButtonText }}</span>\n <svg\n class=\"mat-calendar-arrow\"\n [class.mat-calendar-invert]=\"calendar.currentView() !== 'month'\"\n viewBox=\"0 0 10 5\"\n focusable=\"false\"\n aria-hidden=\"true\">\n <polygon points=\"0,0 5,5 10,0\" />\n </svg>\n </button>\n\n <div class=\"mat-calendar-spacer\"></div>\n\n <ng-content></ng-content>\n\n <button\n mat-icon-button\n type=\"button\"\n class=\"mat-calendar-previous-button\"\n [disabled]=\"!previousEnabled()\"\n (click)=\"previousClicked()\"\n [attr.aria-label]=\"prevButtonLabel\"></button>\n\n <button\n mat-icon-button\n type=\"button\"\n class=\"mat-calendar-next-button\"\n [disabled]=\"!nextEnabled()\"\n (click)=\"nextClicked()\"\n [attr.aria-label]=\"nextButtonLabel\"></button>\n </div>\n</div>\n<label [id]=\"_periodButtonLabelId\" class=\"mat-calendar-hidden-label\">{{\n periodButtonDescription\n}}</label>\n", dependencies: [{ kind: "component", type: MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
2073
2106
|
}
|
|
2074
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
2107
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.0", ngImport: i0, type: NgxMatCalendarHeader, decorators: [{
|
|
2075
2108
|
type: Component,
|
|
2076
2109
|
args: [{ selector: 'ngx-mat-calendar-header', exportAs: 'ngxMatCalendarHeader', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, imports: [MatButton, MatIconButton], template: "<div class=\"mat-calendar-header\">\n <div class=\"mat-calendar-controls\">\n <button\n mat-button\n type=\"button\"\n class=\"mat-calendar-period-button\"\n (click)=\"currentPeriodClicked()\"\n [attr.aria-label]=\"periodButtonLabel\"\n [attr.aria-describedby]=\"_periodButtonLabelId\"\n aria-live=\"polite\">\n <span aria-hidden=\"true\">{{ periodButtonText }}</span>\n <svg\n class=\"mat-calendar-arrow\"\n [class.mat-calendar-invert]=\"calendar.currentView() !== 'month'\"\n viewBox=\"0 0 10 5\"\n focusable=\"false\"\n aria-hidden=\"true\">\n <polygon points=\"0,0 5,5 10,0\" />\n </svg>\n </button>\n\n <div class=\"mat-calendar-spacer\"></div>\n\n <ng-content></ng-content>\n\n <button\n mat-icon-button\n type=\"button\"\n class=\"mat-calendar-previous-button\"\n [disabled]=\"!previousEnabled()\"\n (click)=\"previousClicked()\"\n [attr.aria-label]=\"prevButtonLabel\"></button>\n\n <button\n mat-icon-button\n type=\"button\"\n class=\"mat-calendar-next-button\"\n [disabled]=\"!nextEnabled()\"\n (click)=\"nextClicked()\"\n [attr.aria-label]=\"nextButtonLabel\"></button>\n </div>\n</div>\n<label [id]=\"_periodButtonLabelId\" class=\"mat-calendar-hidden-label\">{{\n periodButtonDescription\n}}</label>\n" }]
|
|
2077
2110
|
}], ctorParameters: () => [] });
|
|
2078
2111
|
/** A calendar that is used as part of the datepicker. */
|
|
2079
2112
|
class NgxMatCalendar {
|
|
2080
2113
|
/** An input indicating the type of the header component, if set. */
|
|
2081
|
-
headerComponent = input(
|
|
2114
|
+
headerComponent = input(/* @ts-ignore */
|
|
2115
|
+
...(ngDevMode ? [undefined, { debugName: "headerComponent" }] : /* istanbul ignore next */ []));
|
|
2082
2116
|
/** A portal containing the header component type for this calendar. */
|
|
2083
2117
|
_calendarHeaderPortal = null;
|
|
2084
2118
|
_intlChanges;
|
|
@@ -2087,7 +2121,8 @@ class NgxMatCalendar {
|
|
|
2087
2121
|
* We need to schedule it, rather than do it immediately, because we have to wait
|
|
2088
2122
|
* for Angular to re-evaluate the view children.
|
|
2089
2123
|
*/
|
|
2090
|
-
_moveFocusOnNextTick = linkedSignal(() => !!this.currentView(),
|
|
2124
|
+
_moveFocusOnNextTick = linkedSignal(() => !!this.currentView(), /* @ts-ignore */
|
|
2125
|
+
...(ngDevMode ? [{ debugName: "_moveFocusOnNextTick" }] : /* istanbul ignore next */ []));
|
|
2091
2126
|
/** A date representing the period (month or year) to start the calendar in. */
|
|
2092
2127
|
get startAt() {
|
|
2093
2128
|
return this._startAt;
|
|
@@ -2099,7 +2134,8 @@ class NgxMatCalendar {
|
|
|
2099
2134
|
}
|
|
2100
2135
|
_startAt = null;
|
|
2101
2136
|
/** Whether the calendar should be started in month or year view. */
|
|
2102
|
-
startView = input('month',
|
|
2137
|
+
startView = input('month', /* @ts-ignore */
|
|
2138
|
+
...(ngDevMode ? [{ debugName: "startView" }] : /* istanbul ignore next */ []));
|
|
2103
2139
|
/** The currently selected date. */
|
|
2104
2140
|
get selected() {
|
|
2105
2141
|
return this._selected;
|
|
@@ -2138,18 +2174,25 @@ class NgxMatCalendar {
|
|
|
2138
2174
|
}
|
|
2139
2175
|
_maxDate = null;
|
|
2140
2176
|
/** Function used to filter which dates are selectable. */
|
|
2141
|
-
dateFilter = input(
|
|
2177
|
+
dateFilter = input(/* @ts-ignore */
|
|
2178
|
+
...(ngDevMode ? [undefined, { debugName: "dateFilter" }] : /* istanbul ignore next */ []));
|
|
2142
2179
|
/** Function that can be used to add custom CSS classes to dates. */
|
|
2143
|
-
dateClass = input(
|
|
2180
|
+
dateClass = input(/* @ts-ignore */
|
|
2181
|
+
...(ngDevMode ? [undefined, { debugName: "dateClass" }] : /* istanbul ignore next */ []));
|
|
2144
2182
|
/** Start of the comparison range. */
|
|
2145
|
-
comparisonStart = input(
|
|
2183
|
+
comparisonStart = input(/* @ts-ignore */
|
|
2184
|
+
...(ngDevMode ? [undefined, { debugName: "comparisonStart" }] : /* istanbul ignore next */ []));
|
|
2146
2185
|
/** End of the comparison range. */
|
|
2147
|
-
comparisonEnd = input(
|
|
2186
|
+
comparisonEnd = input(/* @ts-ignore */
|
|
2187
|
+
...(ngDevMode ? [undefined, { debugName: "comparisonEnd" }] : /* istanbul ignore next */ []));
|
|
2148
2188
|
/** ARIA Accessible name of the `<input matStartDate/>` */
|
|
2149
|
-
startDateAccessibleName = input(
|
|
2189
|
+
startDateAccessibleName = input(/* @ts-ignore */
|
|
2190
|
+
...(ngDevMode ? [undefined, { debugName: "startDateAccessibleName" }] : /* istanbul ignore next */ []));
|
|
2150
2191
|
/** ARIA Accessible name of the `<input matEndDate/>` */
|
|
2151
|
-
endDateAccessibleName = input(
|
|
2152
|
-
|
|
2192
|
+
endDateAccessibleName = input(/* @ts-ignore */
|
|
2193
|
+
...(ngDevMode ? [undefined, { debugName: "endDateAccessibleName" }] : /* istanbul ignore next */ []));
|
|
2194
|
+
currentView = linkedSignal(() => this.startView(), /* @ts-ignore */
|
|
2195
|
+
...(ngDevMode ? [{ debugName: "currentView" }] : /* istanbul ignore next */ []));
|
|
2153
2196
|
/** Emits when the currently selected date changes. */
|
|
2154
2197
|
selectedChange = output();
|
|
2155
2198
|
/**
|
|
@@ -2171,11 +2214,14 @@ class NgxMatCalendar {
|
|
|
2171
2214
|
/** Emits a new date range value when the user completes a drag drop operation. */
|
|
2172
2215
|
_userDragDrop = output();
|
|
2173
2216
|
/** Reference to the current month view component. */
|
|
2174
|
-
monthView = viewChild(NgxMatMonthView,
|
|
2217
|
+
monthView = viewChild(NgxMatMonthView, /* @ts-ignore */
|
|
2218
|
+
...(ngDevMode ? [{ debugName: "monthView" }] : /* istanbul ignore next */ []));
|
|
2175
2219
|
/** Reference to the current year view component. */
|
|
2176
|
-
yearView = viewChild(NgxMatYearView,
|
|
2220
|
+
yearView = viewChild(NgxMatYearView, /* @ts-ignore */
|
|
2221
|
+
...(ngDevMode ? [{ debugName: "yearView" }] : /* istanbul ignore next */ []));
|
|
2177
2222
|
/** Reference to the current multi-year view component. */
|
|
2178
|
-
multiYearView = viewChild(NgxMatMultiYearView,
|
|
2223
|
+
multiYearView = viewChild(NgxMatMultiYearView, /* @ts-ignore */
|
|
2224
|
+
...(ngDevMode ? [{ debugName: "multiYearView" }] : /* istanbul ignore next */ []));
|
|
2179
2225
|
/**
|
|
2180
2226
|
* The current active date. This determines which time period is shown and which date is
|
|
2181
2227
|
* highlighted when using keyboard navigation.
|
|
@@ -2319,10 +2365,10 @@ class NgxMatCalendar {
|
|
|
2319
2365
|
// only the first component type. See https://github.com/angular/components/issues/22996.
|
|
2320
2366
|
return this.monthView() || this.yearView() || this.multiYearView();
|
|
2321
2367
|
}
|
|
2322
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
2323
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
2368
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.0", ngImport: i0, type: NgxMatCalendar, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2369
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.0", type: NgxMatCalendar, isStandalone: true, selector: "ngx-mat-calendar", inputs: { headerComponent: { classPropertyName: "headerComponent", publicName: "headerComponent", isSignal: true, isRequired: false, transformFunction: null }, startAt: { classPropertyName: "startAt", publicName: "startAt", isSignal: false, isRequired: false, transformFunction: null }, startView: { classPropertyName: "startView", publicName: "startView", isSignal: true, isRequired: false, transformFunction: null }, selected: { classPropertyName: "selected", publicName: "selected", isSignal: false, isRequired: false, transformFunction: null }, minDate: { classPropertyName: "minDate", publicName: "minDate", isSignal: false, isRequired: false, transformFunction: null }, maxDate: { classPropertyName: "maxDate", publicName: "maxDate", isSignal: false, isRequired: false, transformFunction: null }, dateFilter: { classPropertyName: "dateFilter", publicName: "dateFilter", isSignal: true, isRequired: false, transformFunction: null }, dateClass: { classPropertyName: "dateClass", publicName: "dateClass", isSignal: true, isRequired: false, transformFunction: null }, comparisonStart: { classPropertyName: "comparisonStart", publicName: "comparisonStart", isSignal: true, isRequired: false, transformFunction: null }, comparisonEnd: { classPropertyName: "comparisonEnd", publicName: "comparisonEnd", isSignal: true, isRequired: false, transformFunction: null }, startDateAccessibleName: { classPropertyName: "startDateAccessibleName", publicName: "startDateAccessibleName", isSignal: true, isRequired: false, transformFunction: null }, endDateAccessibleName: { classPropertyName: "endDateAccessibleName", publicName: "endDateAccessibleName", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { selectedChange: "selectedChange", yearSelected: "yearSelected", monthSelected: "monthSelected", viewChanged: "viewChanged", _userSelection: "_userSelection", _userDragDrop: "_userDragDrop" }, host: { classAttribute: "mat-calendar" }, providers: [NGX_MAT_SINGLE_DATE_SELECTION_MODEL_PROVIDER], viewQueries: [{ propertyName: "monthView", first: true, predicate: NgxMatMonthView, descendants: true, isSignal: true }, { propertyName: "yearView", first: true, predicate: NgxMatYearView, descendants: true, isSignal: true }, { propertyName: "multiYearView", first: true, predicate: NgxMatMultiYearView, descendants: true, isSignal: true }], exportAs: ["ngxMatCalendar"], usesOnChanges: true, ngImport: i0, template: "<ng-template [cdkPortalOutlet]=\"_calendarHeaderPortal\" />\n\n<div class=\"mat-calendar-content\" cdkMonitorSubtreeFocus tabindex=\"-1\">\n @switch (currentView()) {\n @case ('month') {\n <ngx-mat-month-view\n [activeDate]=\"activeDate\"\n [selected]=\"selected\"\n [dateFilter]=\"dateFilter()\"\n [maxDate]=\"maxDate\"\n [minDate]=\"minDate\"\n [dateClass]=\"dateClass()\"\n [comparisonStart]=\"comparisonStart()\"\n [comparisonEnd]=\"comparisonEnd()\"\n [startDateAccessibleName]=\"startDateAccessibleName()\"\n [endDateAccessibleName]=\"endDateAccessibleName()\"\n (_userSelection)=\"_dateSelected($event)\"\n (dragStarted)=\"_dragStarted($event)\"\n (dragEnded)=\"_dragEnded($event)\"\n [activeDrag]=\"_activeDrag\" />\n }\n @case ('year') {\n <ngx-mat-year-view\n [activeDate]=\"activeDate\"\n [selected]=\"selected\"\n [dateFilter]=\"dateFilter()\"\n [maxDate]=\"maxDate\"\n [minDate]=\"minDate\"\n [dateClass]=\"dateClass()\"\n (monthSelected)=\"_monthSelectedInYearView($event)\"\n (selectedChange)=\"_goToDateInView($event, 'month')\" />\n }\n @case ('multi-year') {\n <ngx-mat-multi-year-view\n [activeDate]=\"activeDate\"\n [selected]=\"selected\"\n [dateFilter]=\"dateFilter()\"\n [maxDate]=\"maxDate\"\n [minDate]=\"minDate\"\n [dateClass]=\"dateClass()\"\n (yearSelected)=\"_yearSelectedInMultiYearView($event)\"\n (selectedChange)=\"_goToDateInView($event, 'year')\" />\n }\n }\n</div>\n", styles: [".mat-calendar{display:block}.mat-calendar-header{padding:8px 8px 0}.mat-calendar-content{padding:0 8px 8px;outline:none}.mat-calendar-controls{display:flex;align-items:center;margin:5% calc(4.7142857143% - 16px)}.mat-calendar-spacer{flex:1 1 auto}.mat-calendar-period-button{min-width:0;margin:0 8px}.mat-calendar-arrow{display:inline-block;width:10px;height:5px;margin:0 0 0 5px;vertical-align:middle}.mat-calendar-arrow.mat-calendar-invert{transform:rotate(180deg)}[dir=rtl] .mat-calendar-arrow{margin:0 5px 0 0}@media(forced-colors:active){.mat-calendar-arrow{fill:CanvasText}}.mat-calendar-previous-button,.mat-calendar-next-button{position:relative}.mat-calendar-previous-button:after,.mat-calendar-next-button:after{inset:0;position:absolute;content:\"\";margin:15.5px;border:0 solid currentColor;border-top-width:2px}[dir=rtl] .mat-calendar-previous-button,[dir=rtl] .mat-calendar-next-button{transform:rotate(180deg)}.mat-calendar-previous-button:after{border-left-width:2px;transform:translate(2px) rotate(-45deg)}.mat-calendar-next-button:after{border-right-width:2px;transform:translate(-2px) rotate(45deg)}.mat-calendar-table{border-spacing:0;border-collapse:collapse;width:100%}.mat-calendar-table-header th{text-align:center;padding:0 0 8px;color:var(--mat-datepicker-calendar-header-text-color, var(--mat-sys-on-surface-variant));font-size:var(--mat-datepicker-calendar-header-text-size, var(--mat-sys-title-small-size));font-weight:var(--mat-datepicker-calendar-header-text-weight, var(--mat-sys-title-small-weight))}.mat-calendar-table-header-divider{position:relative;height:1px}.mat-calendar-table-header-divider:after{content:\"\";position:absolute;top:0;left:-8px;right:-8px;height:1px}.mat-calendar-body-cell-content:before{margin:calc(calc(var(--mat-focus-indicator-border-width, 3px) + 3px) * -1)}.mat-calendar-body-cell:focus .mat-focus-indicator:before{content:\"\"}.mat-calendar-hidden-label{display:none}\n"], dependencies: [{ kind: "directive", type: CdkPortalOutlet, selector: "[cdkPortalOutlet]", inputs: ["cdkPortalOutlet"], outputs: ["attached"], exportAs: ["cdkPortalOutlet"] }, { kind: "directive", type: CdkMonitorFocus, selector: "[cdkMonitorElementFocus], [cdkMonitorSubtreeFocus]", outputs: ["cdkFocusChange"], exportAs: ["cdkMonitorFocus"] }, { kind: "component", type: NgxMatMonthView, selector: "ngx-mat-month-view", inputs: ["activeDate", "selected", "minDate", "maxDate", "dateFilter", "dateClass", "comparisonStart", "comparisonEnd", "startDateAccessibleName", "endDateAccessibleName", "activeDrag"], outputs: ["selectedChange", "_userSelection", "dragStarted", "dragEnded", "activeDateChange"], exportAs: ["ngxMatMonthView"] }, { kind: "component", type: NgxMatYearView, selector: "ngx-mat-year-view", inputs: ["activeDate", "selected", "minDate", "maxDate", "dateFilter", "dateClass"], outputs: ["selectedChange", "monthSelected", "activeDateChange"], exportAs: ["ngxMatYearView"] }, { kind: "component", type: NgxMatMultiYearView, selector: "ngx-mat-multi-year-view", inputs: ["activeDate", "selected", "minDate", "maxDate", "dateFilter", "dateClass"], outputs: ["selectedChange", "yearSelected", "activeDateChange"], exportAs: ["ngxMatMultiYearView"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
2324
2370
|
}
|
|
2325
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
2371
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.0", ngImport: i0, type: NgxMatCalendar, decorators: [{
|
|
2326
2372
|
type: Component,
|
|
2327
2373
|
args: [{ selector: 'ngx-mat-calendar', host: {
|
|
2328
2374
|
class: 'mat-calendar',
|
|
@@ -2783,10 +2829,10 @@ class NgxMatDatepickerInputBase {
|
|
|
2783
2829
|
const filter = this._getDateFilter();
|
|
2784
2830
|
return !filter || filter(value);
|
|
2785
2831
|
}
|
|
2786
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
2787
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "
|
|
2832
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.0", ngImport: i0, type: NgxMatDatepickerInputBase, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
2833
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.0.0", type: NgxMatDatepickerInputBase, isStandalone: true, inputs: { value: "value", disabled: "disabled" }, outputs: { dateChange: "dateChange", dateInput: "dateInput" }, usesOnChanges: true, ngImport: i0 });
|
|
2788
2834
|
}
|
|
2789
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
2835
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.0", ngImport: i0, type: NgxMatDatepickerInputBase, decorators: [{
|
|
2790
2836
|
type: Directive
|
|
2791
2837
|
}], ctorParameters: () => [], propDecorators: { value: [{
|
|
2792
2838
|
type: Input
|
|
@@ -2919,10 +2965,10 @@ class NgxMatDateRangeInputPartBase extends NgxMatDatepickerInputBase {
|
|
|
2919
2965
|
_getAccessibleName() {
|
|
2920
2966
|
return _computeAriaAccessibleName(this._elementRef.nativeElement);
|
|
2921
2967
|
}
|
|
2922
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
2923
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "
|
|
2968
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.0", ngImport: i0, type: NgxMatDateRangeInputPartBase, deps: null, target: i0.ɵɵFactoryTarget.Directive });
|
|
2969
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.0.0", type: NgxMatDateRangeInputPartBase, isStandalone: true, inputs: { errorStateMatcher: "errorStateMatcher" }, usesInheritance: true, ngImport: i0 });
|
|
2924
2970
|
}
|
|
2925
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
2971
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.0", ngImport: i0, type: NgxMatDateRangeInputPartBase, decorators: [{
|
|
2926
2972
|
type: Directive
|
|
2927
2973
|
}], propDecorators: { errorStateMatcher: [{
|
|
2928
2974
|
type: Input
|
|
@@ -2984,13 +3030,13 @@ class NgxMatStartDate extends NgxMatDateRangeInputPartBase {
|
|
|
2984
3030
|
super._onKeydown(event);
|
|
2985
3031
|
}
|
|
2986
3032
|
}
|
|
2987
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
2988
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "
|
|
3033
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.0", ngImport: i0, type: NgxMatStartDate, deps: null, target: i0.ɵɵFactoryTarget.Directive });
|
|
3034
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.0.0", type: NgxMatStartDate, isStandalone: true, selector: "input[ngxMatStartDate]", inputs: { errorStateMatcher: "errorStateMatcher" }, outputs: { dateChange: "dateChange", dateInput: "dateInput" }, host: { attributes: { "type": "text" }, listeners: { "input": "_onInput($event)", "change": "_onChange()", "keydown": "_onKeydown($event)", "blur": "_onBlur()" }, properties: { "disabled": "disabled", "attr.aria-haspopup": "_rangeInput.rangePicker ? \"dialog\" : null", "attr.aria-owns": "(_rangeInput.rangePicker?.opened && _rangeInput.rangePicker.id) || null", "attr.min": "_dateAdapter && _getMinDate() ? _dateAdapter.toIso8601(_getMinDate()!) : null", "attr.max": "_dateAdapter && _getMaxDate() ? _dateAdapter.toIso8601(_getMaxDate()!) : null" }, classAttribute: "mat-start-date mat-date-range-input-inner" }, providers: [
|
|
2989
3035
|
{ provide: NG_VALUE_ACCESSOR, useExisting: NgxMatStartDate, multi: true },
|
|
2990
3036
|
{ provide: NG_VALIDATORS, useExisting: NgxMatStartDate, multi: true },
|
|
2991
3037
|
], usesInheritance: true, ngImport: i0 });
|
|
2992
3038
|
}
|
|
2993
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
3039
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.0", ngImport: i0, type: NgxMatStartDate, decorators: [{
|
|
2994
3040
|
type: Directive,
|
|
2995
3041
|
args: [{
|
|
2996
3042
|
selector: 'input[ngxMatStartDate]',
|
|
@@ -3074,13 +3120,13 @@ class NgxMatEndDate extends NgxMatDateRangeInputPartBase {
|
|
|
3074
3120
|
super._onKeydown(event);
|
|
3075
3121
|
}
|
|
3076
3122
|
}
|
|
3077
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
3078
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "
|
|
3123
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.0", ngImport: i0, type: NgxMatEndDate, deps: null, target: i0.ɵɵFactoryTarget.Directive });
|
|
3124
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.0.0", type: NgxMatEndDate, isStandalone: true, selector: "input[ngxMatEndDate]", inputs: { errorStateMatcher: "errorStateMatcher" }, outputs: { dateChange: "dateChange", dateInput: "dateInput" }, host: { attributes: { "type": "text" }, listeners: { "input": "_onInput($event)", "change": "_onChange()", "keydown": "_onKeydown($event)", "blur": "_onBlur()" }, properties: { "disabled": "disabled", "attr.aria-haspopup": "_rangeInput.rangePicker ? \"dialog\" : null", "attr.aria-owns": "(_rangeInput.rangePicker?.opened && _rangeInput.rangePicker.id) || null", "attr.min": "_dateAdapter && _getMinDate() ? _dateAdapter.toIso8601(_getMinDate()!) : null", "attr.max": "_dateAdapter && _getMaxDate() ? _dateAdapter.toIso8601(_getMaxDate()!) : null" }, classAttribute: "mat-end-date mat-date-range-input-inner" }, providers: [
|
|
3079
3125
|
{ provide: NG_VALUE_ACCESSOR, useExisting: NgxMatEndDate, multi: true },
|
|
3080
3126
|
{ provide: NG_VALIDATORS, useExisting: NgxMatEndDate, multi: true },
|
|
3081
3127
|
], usesInheritance: true, ngImport: i0 });
|
|
3082
3128
|
}
|
|
3083
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
3129
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.0", ngImport: i0, type: NgxMatEndDate, decorators: [{
|
|
3084
3130
|
type: Directive,
|
|
3085
3131
|
args: [{
|
|
3086
3132
|
selector: 'input[ngxMatEndDate]',
|
|
@@ -3404,8 +3450,8 @@ class NgxMatDateRangeInput {
|
|
|
3404
3450
|
_isTargetRequired(target) {
|
|
3405
3451
|
return target?.ngControl?.control?.hasValidator(Validators.required);
|
|
3406
3452
|
}
|
|
3407
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
3408
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
3453
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.0", ngImport: i0, type: NgxMatDateRangeInput, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
3454
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.0.0", type: NgxMatDateRangeInput, isStandalone: true, selector: "ngx-mat-date-range-input", inputs: { rangePicker: "rangePicker", required: "required", dateFilter: "dateFilter", min: "min", max: "max", disabled: "disabled", separator: "separator", comparisonStart: "comparisonStart", comparisonEnd: "comparisonEnd" }, host: { attributes: { "role": "group" }, properties: { "class.mat-date-range-input-hide-placeholders": "_shouldHidePlaceholders()", "class.mat-date-range-input-required": "required", "attr.id": "id", "attr.aria-labelledby": "_getAriaLabelledby()", "attr.aria-describedby": "_ariaDescribedBy", "attr.data-mat-calendar": "rangePicker ? rangePicker.id : null" }, classAttribute: "mat-date-range-input" }, providers: [
|
|
3409
3455
|
{ provide: MatFormFieldControl, useExisting: NgxMatDateRangeInput },
|
|
3410
3456
|
{
|
|
3411
3457
|
provide: NGX_MAT_DATE_RANGE_INPUT_PARENT,
|
|
@@ -3413,7 +3459,7 @@ class NgxMatDateRangeInput {
|
|
|
3413
3459
|
},
|
|
3414
3460
|
], queries: [{ propertyName: "_startInput", first: true, predicate: NgxMatStartDate, descendants: true }, { propertyName: "_endInput", first: true, predicate: NgxMatEndDate, descendants: true }], exportAs: ["ngxMatDateRangeInput"], usesOnChanges: true, ngImport: i0, template: "<div\n class=\"mat-date-range-input-container\"\n cdkMonitorSubtreeFocus\n (cdkFocusChange)=\"_updateFocus($event)\"\n>\n <div class=\"mat-date-range-input-wrapper\">\n <ng-content select=\"input[matStartDate]\"></ng-content>\n <span class=\"mat-date-range-input-mirror\" aria-hidden=\"true\">{{\n _getInputMirrorValue(\"start\")\n }}</span>\n </div>\n\n <span\n class=\"mat-date-range-input-separator\"\n [class.mat-date-range-input-separator-hidden]=\"_shouldHideSeparator()\"\n >{{ separator }}</span\n >\n\n <div class=\"mat-date-range-input-wrapper mat-date-range-input-end-wrapper\">\n <ng-content select=\"input[matEndDate]\"></ng-content>\n <span class=\"mat-date-range-input-mirror\" aria-hidden=\"true\">{{\n _getInputMirrorValue(\"end\")\n }}</span>\n </div>\n</div>\n", styles: [".mat-date-range-input{display:block;width:100%}.mat-date-range-input-container{display:flex;align-items:center}.mat-date-range-input-separator{transition:opacity .4s .1333333333333s cubic-bezier(.25,.8,.25,1);margin:0 4px}._mat-animation-noopable .mat-date-range-input-separator{transition:none}.mat-date-range-input-separator-hidden{-webkit-user-select:none;user-select:none;opacity:0;transition:none}.mat-date-range-input-wrapper{position:relative;overflow:hidden;max-width:calc(50% - 4px)}.mat-date-range-input-end-wrapper{flex-grow:1}.mat-date-range-input-inner{position:absolute;top:0;left:0;font:inherit;background:transparent;color:currentColor;border:none;outline:none;padding:0;margin:0;vertical-align:bottom;text-align:inherit;appearance:none;width:100%;height:100%}.mat-date-range-input-inner:-moz-ui-invalid{box-shadow:none}.mat-form-field-hide-placeholder .mat-date-range-input-inner::placeholder,.mat-date-range-input-hide-placeholders .mat-date-range-input-inner::placeholder{-webkit-user-select:none;user-select:none;color:transparent!important;-webkit-text-fill-color:transparent;transition:none}@media(forced-colors:active){.mat-form-field-hide-placeholder .mat-date-range-input-inner::placeholder,.mat-date-range-input-hide-placeholders .mat-date-range-input-inner::placeholder{opacity:0}}.mat-form-field-hide-placeholder .mat-date-range-input-inner::-moz-placeholder,.mat-date-range-input-hide-placeholders .mat-date-range-input-inner::-moz-placeholder{-webkit-user-select:none;user-select:none;color:transparent!important;-webkit-text-fill-color:transparent;transition:none}@media(forced-colors:active){.mat-form-field-hide-placeholder .mat-date-range-input-inner::-moz-placeholder,.mat-date-range-input-hide-placeholders .mat-date-range-input-inner::-moz-placeholder{opacity:0}}.mat-form-field-hide-placeholder .mat-date-range-input-inner::-webkit-input-placeholder,.mat-date-range-input-hide-placeholders .mat-date-range-input-inner::-webkit-input-placeholder{-webkit-user-select:none;user-select:none;color:transparent!important;-webkit-text-fill-color:transparent;transition:none}@media(forced-colors:active){.mat-form-field-hide-placeholder .mat-date-range-input-inner::-webkit-input-placeholder,.mat-date-range-input-hide-placeholders .mat-date-range-input-inner::-webkit-input-placeholder{opacity:0}}.mat-form-field-hide-placeholder .mat-date-range-input-inner:-ms-input-placeholder,.mat-date-range-input-hide-placeholders .mat-date-range-input-inner:-ms-input-placeholder{-webkit-user-select:none;user-select:none;color:transparent!important;-webkit-text-fill-color:transparent;transition:none}@media(forced-colors:active){.mat-form-field-hide-placeholder .mat-date-range-input-inner:-ms-input-placeholder,.mat-date-range-input-hide-placeholders .mat-date-range-input-inner:-ms-input-placeholder{opacity:0}}._mat-animation-noopable .mat-date-range-input-inner::placeholder{transition:none}._mat-animation-noopable .mat-date-range-input-inner::-moz-placeholder{transition:none}._mat-animation-noopable .mat-date-range-input-inner::-webkit-input-placeholder{transition:none}._mat-animation-noopable .mat-date-range-input-inner:-ms-input-placeholder{transition:none}.mat-date-range-input-mirror{-webkit-user-select:none;user-select:none;visibility:hidden;white-space:nowrap;display:inline-block;min-width:2px}.mat-mdc-form-field-type-mat-date-range-input .mat-mdc-form-field-infix{width:200px}\n"], dependencies: [{ kind: "directive", type: CdkMonitorFocus, selector: "[cdkMonitorElementFocus], [cdkMonitorSubtreeFocus]", outputs: ["cdkFocusChange"], exportAs: ["cdkMonitorFocus"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
3415
3461
|
}
|
|
3416
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
3462
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.0", ngImport: i0, type: NgxMatDateRangeInput, decorators: [{
|
|
3417
3463
|
type: Component,
|
|
3418
3464
|
args: [{ selector: 'ngx-mat-date-range-input', exportAs: 'ngxMatDateRangeInput', host: {
|
|
3419
3465
|
class: 'mat-date-range-input',
|
|
@@ -3495,19 +3541,30 @@ var MERIDIANS;
|
|
|
3495
3541
|
class NgxMatTimepickerComponent {
|
|
3496
3542
|
formBuilder = inject(FormBuilder);
|
|
3497
3543
|
_dateAdapter = inject((DateAdapter), { optional: true });
|
|
3498
|
-
disabled = input(false,
|
|
3499
|
-
|
|
3500
|
-
|
|
3501
|
-
|
|
3502
|
-
|
|
3503
|
-
|
|
3504
|
-
|
|
3505
|
-
|
|
3506
|
-
|
|
3507
|
-
|
|
3544
|
+
disabled = input(false, /* @ts-ignore */
|
|
3545
|
+
...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
|
|
3546
|
+
showSpinners = input(true, /* @ts-ignore */
|
|
3547
|
+
...(ngDevMode ? [{ debugName: "showSpinners" }] : /* istanbul ignore next */ []));
|
|
3548
|
+
stepHour = input(DEFAULT_STEP, /* @ts-ignore */
|
|
3549
|
+
...(ngDevMode ? [{ debugName: "stepHour" }] : /* istanbul ignore next */ []));
|
|
3550
|
+
stepMinute = input(DEFAULT_STEP, /* @ts-ignore */
|
|
3551
|
+
...(ngDevMode ? [{ debugName: "stepMinute" }] : /* istanbul ignore next */ []));
|
|
3552
|
+
stepSecond = input(DEFAULT_STEP, /* @ts-ignore */
|
|
3553
|
+
...(ngDevMode ? [{ debugName: "stepSecond" }] : /* istanbul ignore next */ []));
|
|
3554
|
+
showSeconds = input(false, /* @ts-ignore */
|
|
3555
|
+
...(ngDevMode ? [{ debugName: "showSeconds" }] : /* istanbul ignore next */ []));
|
|
3556
|
+
disableMinute = input(false, /* @ts-ignore */
|
|
3557
|
+
...(ngDevMode ? [{ debugName: "disableMinute" }] : /* istanbul ignore next */ []));
|
|
3558
|
+
enableMeridian = input(false, /* @ts-ignore */
|
|
3559
|
+
...(ngDevMode ? [{ debugName: "enableMeridian" }] : /* istanbul ignore next */ []));
|
|
3560
|
+
defaultTime = input(/* @ts-ignore */
|
|
3561
|
+
...(ngDevMode ? [undefined, { debugName: "defaultTime" }] : /* istanbul ignore next */ []));
|
|
3562
|
+
color = input('primary', /* @ts-ignore */
|
|
3563
|
+
...(ngDevMode ? [{ debugName: "color" }] : /* istanbul ignore next */ []));
|
|
3508
3564
|
pattern = PATTERN_INPUT_HOUR;
|
|
3509
3565
|
meridianInput = input(MERIDIANS.AM, { ...(ngDevMode ? { debugName: "meridianInput" } : /* istanbul ignore next */ {}), alias: 'meridian' });
|
|
3510
|
-
meridian = linkedSignal(() => this.meridianInput(),
|
|
3566
|
+
meridian = linkedSignal(() => this.meridianInput(), /* @ts-ignore */
|
|
3567
|
+
...(ngDevMode ? [{ debugName: "meridian" }] : /* istanbul ignore next */ []));
|
|
3511
3568
|
form = this.formBuilder.group({
|
|
3512
3569
|
hour: new FormControl(this.defaultTime()?.[0] ? String(this.defaultTime()[0]) : null, {
|
|
3513
3570
|
validators: [Validators.required, Validators.pattern(PATTERN_INPUT_HOUR)],
|
|
@@ -3528,7 +3585,8 @@ class NgxMatTimepickerComponent {
|
|
|
3528
3585
|
_onTouched = () => {
|
|
3529
3586
|
// Intentionally left empty.
|
|
3530
3587
|
};
|
|
3531
|
-
value = model(
|
|
3588
|
+
value = model(/* @ts-ignore */
|
|
3589
|
+
...(ngDevMode ? [undefined, { debugName: "value" }] : /* istanbul ignore next */ []));
|
|
3532
3590
|
/** Hour */
|
|
3533
3591
|
get hour() {
|
|
3534
3592
|
const val = Number(this.form.controls['hour'].getRawValue());
|
|
@@ -3700,16 +3758,16 @@ class NgxMatTimepickerComponent {
|
|
|
3700
3758
|
}
|
|
3701
3759
|
}
|
|
3702
3760
|
}
|
|
3703
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
3704
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
3761
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.0", ngImport: i0, type: NgxMatTimepickerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
3762
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.0", type: NgxMatTimepickerComponent, isStandalone: true, selector: "ngx-mat-timepicker", inputs: { disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, showSpinners: { classPropertyName: "showSpinners", publicName: "showSpinners", isSignal: true, isRequired: false, transformFunction: null }, stepHour: { classPropertyName: "stepHour", publicName: "stepHour", isSignal: true, isRequired: false, transformFunction: null }, stepMinute: { classPropertyName: "stepMinute", publicName: "stepMinute", isSignal: true, isRequired: false, transformFunction: null }, stepSecond: { classPropertyName: "stepSecond", publicName: "stepSecond", isSignal: true, isRequired: false, transformFunction: null }, showSeconds: { classPropertyName: "showSeconds", publicName: "showSeconds", isSignal: true, isRequired: false, transformFunction: null }, disableMinute: { classPropertyName: "disableMinute", publicName: "disableMinute", isSignal: true, isRequired: false, transformFunction: null }, enableMeridian: { classPropertyName: "enableMeridian", publicName: "enableMeridian", isSignal: true, isRequired: false, transformFunction: null }, defaultTime: { classPropertyName: "defaultTime", publicName: "defaultTime", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, meridianInput: { classPropertyName: "meridianInput", publicName: "meridian", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange" }, host: { classAttribute: "ngx-mat-timepicker" }, providers: [
|
|
3705
3763
|
{
|
|
3706
3764
|
provide: NG_VALUE_ACCESSOR,
|
|
3707
3765
|
useExisting: forwardRef(() => NgxMatTimepickerComponent),
|
|
3708
3766
|
multi: true,
|
|
3709
3767
|
},
|
|
3710
|
-
], exportAs: ["ngxMatTimepicker"], ngImport: i0, template: "<form [formGroup]=\"form\">\n <table class=\"ngx-mat-timepicker-table\">\n <tbody class=\"ngx-mat-timepicker-tbody\">\n @if (showSpinners()) {\n <tr>\n <td>\n <button\n type=\"button\"\n mat-icon-button\n aria-label=\"expand_less icon\"\n (click)=\"change('hour', true)\"\n [disabled]=\"disabled()\">\n <mat-icon>\n <svg\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n stroke=\"currentColor\"\n stroke-width=\"2\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\">\n <path d=\"M18 15l-6-6-6 6\" />\n </svg>\n </mat-icon>\n </button>\n </td>\n <td></td>\n <td>\n <button\n type=\"button\"\n mat-icon-button\n aria-label=\"expand_less icon\"\n (click)=\"change('minute', true)\"\n [disabled]=\"disabled() || disableMinute()\">\n <mat-icon\n ><svg\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n stroke=\"currentColor\"\n stroke-width=\"2\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\">\n <path d=\"M18 15l-6-6-6 6\" /></svg\n ></mat-icon>\n </button>\n </td>\n <td></td>\n @if (showSeconds()) {\n <td>\n <button\n type=\"button\"\n mat-icon-button\n aria-label=\"expand_less icon\"\n (click)=\"change('second', true)\"\n [disabled]=\"disabled() || disableMinute()\">\n <mat-icon\n ><svg\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n stroke=\"currentColor\"\n stroke-width=\"2\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\">\n <path d=\"M18 15l-6-6-6 6\" /></svg\n ></mat-icon>\n </button>\n </td>\n }\n @if (enableMeridian()) {\n <td class=\"ngx-mat-timepicker-spacer\"></td>\n <td></td>\n }\n </tr>\n }\n\n <tr>\n <td>\n <mat-form-field appearance=\"fill\" [color]=\"color()\">\n <input\n type=\"text\"\n matInput\n (input)=\"formatInput($any($event).target)\"\n maxlength=\"2\"\n formControlName=\"hour\"\n (keydown.ArrowUp)=\"change('hour', true); $event.preventDefault()\"\n (keydown.ArrowDown)=\"change('hour', false); $event.preventDefault()\"\n (blur)=\"change('hour')\" />\n </mat-form-field>\n </td>\n <td class=\"ngx-mat-timepicker-spacer\">:</td>\n <td>\n <mat-form-field appearance=\"fill\" [color]=\"color()\">\n <input\n type=\"text\"\n matInput\n (input)=\"formatInput($any($event).target)\"\n maxlength=\"2\"\n formControlName=\"minute\"\n (keydown.ArrowUp)=\"change('minute', true); $event.preventDefault()\"\n (keydown.ArrowDown)=\"change('minute', false); $event.preventDefault()\"\n (blur)=\"change('minute')\" />\n </mat-form-field>\n </td>\n @if (showSeconds()) {\n <td class=\"ngx-mat-timepicker-spacer\">:</td>\n <td>\n <mat-form-field appearance=\"fill\" [color]=\"color()\">\n <input\n type=\"text\"\n matInput\n (input)=\"formatInput($any($event).target)\"\n maxlength=\"2\"\n formControlName=\"second\"\n (keydown.ArrowUp)=\"change('second', true); $event.preventDefault()\"\n (keydown.ArrowDown)=\"change('second', false); $event.preventDefault()\"\n (blur)=\"change('second')\" />\n </mat-form-field>\n </td>\n }\n\n @if (enableMeridian()) {\n <td class=\"ngx-mat-timepicker-spacer\"></td>\n\n <td class=\"ngx-mat-timepicker-meridian\">\n <button\n mat-button\n (click)=\"toggleMeridian()\"\n mat-stroked-button\n [color]=\"color()\"\n [disabled]=\"disabled()\">\n {{ meridian() }}\n </button>\n </td>\n }\n </tr>\n\n @if (showSpinners()) {\n <tr>\n <td>\n <button\n type=\"button\"\n mat-icon-button\n aria-label=\"keyboard_arrow_down icon\"\n (click)=\"change('hour', false)\"\n [disabled]=\"disabled()\">\n <mat-icon>\n <svg\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n stroke=\"currentColor\"\n stroke-width=\"2\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\">\n <path d=\"M6 9l6 6 6-6\" />\n </svg>\n </mat-icon>\n </button>\n </td>\n <td></td>\n <td>\n <button\n type=\"button\"\n mat-icon-button\n aria-label=\"keyboard_arrow_down icon\"\n (click)=\"change('minute', false)\"\n [disabled]=\"disabled() || disableMinute()\">\n <mat-icon\n ><svg\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n stroke=\"currentColor\"\n stroke-width=\"2\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\">\n <path d=\"M6 9l6 6 6-6\" /></svg\n ></mat-icon>\n </button>\n </td>\n @if (showSeconds()) {\n <td></td>\n\n <td>\n <button\n type=\"button\"\n mat-icon-button\n aria-label=\"keyboard_arrow_down icon\"\n (click)=\"change('second', false)\"\n [disabled]=\"disabled() || disableMinute()\">\n <mat-icon\n ><svg\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n stroke=\"currentColor\"\n stroke-width=\"2\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\">\n <path d=\"M6 9l6 6 6-6\" /></svg\n ></mat-icon>\n </button>\n </td>\n }\n\n @if (enableMeridian()) {\n <td class=\"ngx-mat-timepicker-spacer\"></td>\n <td></td>\n }\n </tr>\n }\n </tbody>\n </table>\n</form>\n", styles: [".ngx-mat-timepicker form .ngx-mat-timepicker-table .ngx-mat-timepicker-tbody tr td{text-align:center}.ngx-mat-timepicker form .ngx-mat-timepicker-table .ngx-mat-timepicker-tbody tr td.ngx-mat-timepicker-spacer{font-weight:700}.ngx-mat-timepicker form .ngx-mat-timepicker-table .ngx-mat-timepicker-tbody tr td.ngx-mat-timepicker-meridian .mdc-button{min-width:64px;line-height:36px;min-width:0;border-radius:50%;width:36px;height:36px;padding:0;flex-shrink:0}.ngx-mat-timepicker form .ngx-mat-timepicker-table .ngx-mat-timepicker-tbody tr td .mat-mdc-icon-button{display:inline-flex;align-items:center;justify-content:center;height:var(--mat-icon-button-state-layer-size, 40px);width:var(--mdc-icon-button-state-layer-size, 40px);line-height:var(--mdc-icon-button-state-layer-size, 40px);font-size:var(--mdc-icon-button-icon-size, 24px);color:var(--mdc-icon-button-icon-color, var(--mat-sys-on-surface-variant));padding:calc((var(--mdc-icon-button-state-layer-size, 40px) - var(--mdc-icon-button-icon-size, 24px)) / 2)}.ngx-mat-timepicker form .ngx-mat-timepicker-table .ngx-mat-timepicker-tbody tr td .mat-mdc-icon-button .mat-icon{font-size:var(--mdc-icon-button-icon-size, 24px)}.ngx-mat-timepicker form .ngx-mat-timepicker-table .ngx-mat-timepicker-tbody tr td .mat-mdc-icon-button svg{width:var(--mdc-icon-button-icon-size, 24px);height:var(--mdc-icon-button-icon-size, 24px);vertical-align:baseline}.ngx-mat-timepicker form .ngx-mat-timepicker-table .ngx-mat-timepicker-tbody tr td .mat-mdc-icon-button:disabled,.ngx-mat-timepicker form .ngx-mat-timepicker-table .ngx-mat-timepicker-tbody tr td .mat-mdc-icon-button.mat-mdc-button-disabled{cursor:default;pointer-events:none;color:var(--mdc-icon-button-disabled-icon-color, color-mix(in srgb, var(--mat-sys-on-surface) 38%, transparent))}.ngx-mat-timepicker form .ngx-mat-timepicker-table .ngx-mat-timepicker-tbody tr td .mat-mdc-form-field{width:24px;max-width:24px;text-align:center}.ngx-mat-timepicker form .ngx-mat-timepicker-table .ngx-mat-timepicker-tbody tr td .mat-mdc-form-field.mat-focused .mdc-text-field--filled .mat-mdc-form-field-focus-overlay,.ngx-mat-timepicker form .ngx-mat-timepicker-table .ngx-mat-timepicker-tbody tr td .mat-mdc-form-field:hover .mdc-text-field--filled .mat-mdc-form-field-focus-overlay{background-color:transparent}.ngx-mat-timepicker form .ngx-mat-timepicker-table .ngx-mat-timepicker-tbody tr td .mat-mdc-form-field .mdc-text-field--filled{background-color:transparent!important;padding:0!important}.ngx-mat-timepicker form .ngx-mat-timepicker-table .ngx-mat-timepicker-tbody tr td .mat-mdc-form-field .mdc-text-field--filled .mat-mdc-form-field-infix{padding:4px 0;min-height:1px!important}.ngx-mat-timepicker form .ngx-mat-timepicker-table .ngx-mat-timepicker-tbody tr td .mat-mdc-form-field .mdc-text-field--filled .mat-mdc-form-field-infix input{text-align:center;font-size:14px}\n"], dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i3.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i4.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: i4.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
3768
|
+
], exportAs: ["ngxMatTimepicker"], ngImport: i0, template: "<form [formGroup]=\"form\">\n <table class=\"ngx-mat-timepicker-table\">\n <tbody class=\"ngx-mat-timepicker-tbody\">\n @if (showSpinners()) {\n <tr>\n <td>\n <button\n type=\"button\"\n mat-icon-button\n aria-label=\"expand_less icon\"\n (click)=\"change('hour', true)\"\n [disabled]=\"disabled()\">\n <mat-icon>\n <svg\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n stroke=\"currentColor\"\n stroke-width=\"2\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\">\n <path d=\"M18 15l-6-6-6 6\" />\n </svg>\n </mat-icon>\n </button>\n </td>\n <td></td>\n <td>\n <button\n type=\"button\"\n mat-icon-button\n aria-label=\"expand_less icon\"\n (click)=\"change('minute', true)\"\n [disabled]=\"disabled() || disableMinute()\">\n <mat-icon\n ><svg\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n stroke=\"currentColor\"\n stroke-width=\"2\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\">\n <path d=\"M18 15l-6-6-6 6\" /></svg\n ></mat-icon>\n </button>\n </td>\n <td></td>\n @if (showSeconds()) {\n <td>\n <button\n type=\"button\"\n mat-icon-button\n aria-label=\"expand_less icon\"\n (click)=\"change('second', true)\"\n [disabled]=\"disabled() || disableMinute()\">\n <mat-icon\n ><svg\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n stroke=\"currentColor\"\n stroke-width=\"2\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\">\n <path d=\"M18 15l-6-6-6 6\" /></svg\n ></mat-icon>\n </button>\n </td>\n }\n @if (enableMeridian()) {\n <td class=\"ngx-mat-timepicker-spacer\"></td>\n <td></td>\n }\n </tr>\n }\n\n <tr>\n <td>\n <mat-form-field appearance=\"fill\" [color]=\"color()\">\n <input\n type=\"text\"\n matInput\n (input)=\"formatInput($any($event).target)\"\n maxlength=\"2\"\n formControlName=\"hour\"\n (keydown.ArrowUp)=\"change('hour', true); $event.preventDefault()\"\n (keydown.ArrowDown)=\"change('hour', false); $event.preventDefault()\"\n (blur)=\"change('hour')\" />\n </mat-form-field>\n </td>\n <td class=\"ngx-mat-timepicker-spacer\">:</td>\n <td>\n <mat-form-field appearance=\"fill\" [color]=\"color()\">\n <input\n type=\"text\"\n matInput\n (input)=\"formatInput($any($event).target)\"\n maxlength=\"2\"\n formControlName=\"minute\"\n (keydown.ArrowUp)=\"change('minute', true); $event.preventDefault()\"\n (keydown.ArrowDown)=\"change('minute', false); $event.preventDefault()\"\n (blur)=\"change('minute')\" />\n </mat-form-field>\n </td>\n @if (showSeconds()) {\n <td class=\"ngx-mat-timepicker-spacer\">:</td>\n <td>\n <mat-form-field appearance=\"fill\" [color]=\"color()\">\n <input\n type=\"text\"\n matInput\n (input)=\"formatInput($any($event).target)\"\n maxlength=\"2\"\n formControlName=\"second\"\n (keydown.ArrowUp)=\"change('second', true); $event.preventDefault()\"\n (keydown.ArrowDown)=\"change('second', false); $event.preventDefault()\"\n (blur)=\"change('second')\" />\n </mat-form-field>\n </td>\n }\n\n @if (enableMeridian()) {\n <td class=\"ngx-mat-timepicker-spacer\"></td>\n\n <td class=\"ngx-mat-timepicker-meridian\">\n <button\n mat-button\n (click)=\"toggleMeridian()\"\n mat-stroked-button\n [color]=\"color()\"\n [disabled]=\"disabled()\">\n {{ meridian() }}\n </button>\n </td>\n }\n </tr>\n\n @if (showSpinners()) {\n <tr>\n <td>\n <button\n type=\"button\"\n mat-icon-button\n aria-label=\"keyboard_arrow_down icon\"\n (click)=\"change('hour', false)\"\n [disabled]=\"disabled()\">\n <mat-icon>\n <svg\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n stroke=\"currentColor\"\n stroke-width=\"2\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\">\n <path d=\"M6 9l6 6 6-6\" />\n </svg>\n </mat-icon>\n </button>\n </td>\n <td></td>\n <td>\n <button\n type=\"button\"\n mat-icon-button\n aria-label=\"keyboard_arrow_down icon\"\n (click)=\"change('minute', false)\"\n [disabled]=\"disabled() || disableMinute()\">\n <mat-icon\n ><svg\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n stroke=\"currentColor\"\n stroke-width=\"2\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\">\n <path d=\"M6 9l6 6 6-6\" /></svg\n ></mat-icon>\n </button>\n </td>\n @if (showSeconds()) {\n <td></td>\n\n <td>\n <button\n type=\"button\"\n mat-icon-button\n aria-label=\"keyboard_arrow_down icon\"\n (click)=\"change('second', false)\"\n [disabled]=\"disabled() || disableMinute()\">\n <mat-icon\n ><svg\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n stroke=\"currentColor\"\n stroke-width=\"2\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\">\n <path d=\"M6 9l6 6 6-6\" /></svg\n ></mat-icon>\n </button>\n </td>\n }\n\n @if (enableMeridian()) {\n <td class=\"ngx-mat-timepicker-spacer\"></td>\n <td></td>\n }\n </tr>\n }\n </tbody>\n </table>\n</form>\n", styles: [".ngx-mat-timepicker form .ngx-mat-timepicker-table .ngx-mat-timepicker-tbody tr td{text-align:center}.ngx-mat-timepicker form .ngx-mat-timepicker-table .ngx-mat-timepicker-tbody tr td.ngx-mat-timepicker-spacer{font-weight:700}.ngx-mat-timepicker form .ngx-mat-timepicker-table .ngx-mat-timepicker-tbody tr td.ngx-mat-timepicker-meridian .mdc-button{min-width:64px;line-height:36px;min-width:0;border-radius:50%;width:36px;height:36px;padding:0;flex-shrink:0}.ngx-mat-timepicker form .ngx-mat-timepicker-table .ngx-mat-timepicker-tbody tr td .mat-mdc-icon-button{display:inline-flex;align-items:center;justify-content:center;height:var(--mat-icon-button-state-layer-size, 40px);width:var(--mdc-icon-button-state-layer-size, 40px);line-height:var(--mdc-icon-button-state-layer-size, 40px);font-size:var(--mdc-icon-button-icon-size, 24px);color:var(--mdc-icon-button-icon-color, var(--mat-sys-on-surface-variant));padding:calc((var(--mdc-icon-button-state-layer-size, 40px) - var(--mdc-icon-button-icon-size, 24px)) / 2)}.ngx-mat-timepicker form .ngx-mat-timepicker-table .ngx-mat-timepicker-tbody tr td .mat-mdc-icon-button .mat-icon{font-size:var(--mdc-icon-button-icon-size, 24px)}.ngx-mat-timepicker form .ngx-mat-timepicker-table .ngx-mat-timepicker-tbody tr td .mat-mdc-icon-button svg{width:var(--mdc-icon-button-icon-size, 24px);height:var(--mdc-icon-button-icon-size, 24px);vertical-align:baseline}.ngx-mat-timepicker form .ngx-mat-timepicker-table .ngx-mat-timepicker-tbody tr td .mat-mdc-icon-button:disabled,.ngx-mat-timepicker form .ngx-mat-timepicker-table .ngx-mat-timepicker-tbody tr td .mat-mdc-icon-button.mat-mdc-button-disabled{cursor:default;pointer-events:none;color:var(--mdc-icon-button-disabled-icon-color, color-mix(in srgb, var(--mat-sys-on-surface) 38%, transparent))}.ngx-mat-timepicker form .ngx-mat-timepicker-table .ngx-mat-timepicker-tbody tr td .mat-mdc-form-field{width:24px;max-width:24px;text-align:center}.ngx-mat-timepicker form .ngx-mat-timepicker-table .ngx-mat-timepicker-tbody tr td .mat-mdc-form-field.mat-focused .mdc-text-field--filled .mat-mdc-form-field-focus-overlay,.ngx-mat-timepicker form .ngx-mat-timepicker-table .ngx-mat-timepicker-tbody tr td .mat-mdc-form-field:hover .mdc-text-field--filled .mat-mdc-form-field-focus-overlay{background-color:transparent}.ngx-mat-timepicker form .ngx-mat-timepicker-table .ngx-mat-timepicker-tbody tr td .mat-mdc-form-field .mdc-text-field--filled{background-color:transparent!important;padding:0!important}.ngx-mat-timepicker form .ngx-mat-timepicker-table .ngx-mat-timepicker-tbody tr td .mat-mdc-form-field .mdc-text-field--filled .mat-mdc-form-field-infix{padding:4px 0;min-height:1px!important}.ngx-mat-timepicker form .ngx-mat-timepicker-table .ngx-mat-timepicker-tbody tr td .mat-mdc-form-field .mdc-text-field--filled .mat-mdc-form-field-infix input{text-align:center;font-size:14px}\n"], dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox]):not([ngNoCva])[formControlName],textarea:not([ngNoCva])[formControlName],input:not([type=checkbox]):not([ngNoCva])[formControl],textarea:not([ngNoCva])[formControl],input:not([type=checkbox]):not([ngNoCva])[ngModel],textarea:not([ngNoCva])[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i3.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i4.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: i4.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
3711
3769
|
}
|
|
3712
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
3770
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.0", ngImport: i0, type: NgxMatTimepickerComponent, decorators: [{
|
|
3713
3771
|
type: Component,
|
|
3714
3772
|
args: [{ selector: 'ngx-mat-timepicker', host: {
|
|
3715
3773
|
class: 'ngx-mat-timepicker',
|
|
@@ -3918,10 +3976,10 @@ class NgxMatDatepickerContent {
|
|
|
3918
3976
|
this._changeDetectorRef.detectChanges();
|
|
3919
3977
|
}
|
|
3920
3978
|
}
|
|
3921
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
3922
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
3979
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.0", ngImport: i0, type: NgxMatDatepickerContent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
3980
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.0", type: NgxMatDatepickerContent, isStandalone: true, selector: "ngx-mat-datepicker-content", inputs: { color: "color" }, host: { listeners: { "animationend": "_onAnimationEnd($event)" }, properties: { "class.mat-datepicker-content-touch": "datepicker!.touchUi", "class.mat-datepicker-content-touch-with-time": "!datepicker!.hideTime", "class.mat-primary": "this.isPrimary", "class.mat-accent": "this.isAccent", "class.mat-warn": "this.isWarn", "class.panel-enter-dropdown": "this.isEnterDropdown", "class.panel-enter-dialog": "this.isEnterDialog", "class.panel-leave": "this.isLeavingClass" }, classAttribute: "mat-datepicker-content" }, viewQueries: [{ propertyName: "_calendar", first: true, predicate: NgxMatCalendar, descendants: true, isSignal: true }], exportAs: ["ngxMatDatepickerContent"], ngImport: i0, template: "<div\n cdkTrapFocus\n role=\"dialog\"\n [attr.aria-modal]=\"true\"\n [attr.aria-labelledby]=\"_dialogLabelId ?? undefined\"\n class=\"mat-datepicker-content-container\"\n [class.mat-datepicker-content-container-with-custom-header]=\"\n datepicker?.calendarHeaderComponent()\n \"\n [class.mat-datepicker-content-container-with-actions]=\"_actionsPortal\"\n [class.mat-datepicker-content-container-with-time]=\"!datepicker!._hideTime\"\n>\n <ngx-mat-calendar\n [id]=\"datepicker!.id\"\n [ngClass]=\"datepicker!.panelClass\"\n [startAt]=\"datepicker!.startAt\"\n [startView]=\"datepicker!.startView()\"\n [minDate]=\"datepicker!._getMinDate()\"\n [maxDate]=\"datepicker!._getMaxDate()\"\n [dateFilter]=\"datepicker!._getDateFilter()\"\n [headerComponent]=\"datepicker!.calendarHeaderComponent()\"\n [selected]=\"_getSelected()\"\n [dateClass]=\"datepicker!.dateClass()\"\n [comparisonStart]=\"comparisonStart\"\n [comparisonEnd]=\"comparisonEnd\"\n [class.calendar-fade-enter]=\"false\"\n [startDateAccessibleName]=\"startDateAccessibleName\"\n [endDateAccessibleName]=\"endDateAccessibleName\"\n (yearSelected)=\"datepicker!._selectYear($event)\"\n (monthSelected)=\"datepicker!._selectMonth($event)\"\n (viewChanged)=\"datepicker!._viewChanged($event)\"\n (_userSelection)=\"_handleUserSelection($event)\"\n (_userDragDrop)=\"_handleUserDragDrop($event)\"\n />\n\n @if (isViewMonth) {\n @if (!datepicker!._hideTime) {\n <div\n class=\"time-container\"\n [ngClass]=\"datepicker!.panelClass\"\n [class.disable-seconds]=\"!datepicker!._showSeconds\"\n >\n <ngx-mat-timepicker\n [showSpinners]=\"datepicker!._showSpinners\"\n [showSeconds]=\"datepicker!._showSeconds\"\n [disabled]=\"datepicker!._disabled || !_modelTime\"\n [stepHour]=\"datepicker!._stepHour\"\n [stepMinute]=\"datepicker!._stepMinute\"\n [stepSecond]=\"datepicker!._stepSecond\"\n [(ngModel)]=\"_modelTime\"\n [color]=\"datepicker!._color\"\n [enableMeridian]=\"datepicker!._enableMeridian\"\n [disableMinute]=\"datepicker!._disableMinute\"\n (ngModelChange)=\"onTimeChanged($event)\"\n />\n </div>\n }\n }\n\n <ng-template [cdkPortalOutlet]=\"_actionsPortal\" />\n\n <!-- Invisible close button for screen reader users. -->\n <button\n type=\"button\"\n mat-raised-button\n [color]=\"color || 'primary'\"\n class=\"mat-datepicker-close-button\"\n [class.cdk-visually-hidden]=\"!_closeButtonFocused\"\n (focus)=\"_closeButtonFocused = true\"\n (blur)=\"_closeButtonFocused = false\"\n (click)=\"datepicker?.close()\"\n >\n {{ _closeButtonText }}\n </button>\n</div>\n", styles: ["@keyframes panelDropdownEnter{0%{opacity:0;transform:scaleY(.8)}to{opacity:1;transform:scale(1)}}@keyframes panelDialogEnter{0%{opacity:0;transform:scale(.7)}to{opacity:1;transform:none}}@keyframes panelLeave{0%{opacity:1}to{opacity:0}}.panel-enter-dropdown{animation:panelDropdownEnter .12s cubic-bezier(0,0,.2,1)}.panel-enter-dialog{animation:panelDialogEnter .15s cubic-bezier(0,0,.2,1)}.panel-leave{animation:panelLeave .1s linear forwards;pointer-events:none}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.calendar-fade-enter{animation:fadeIn .12s .1s cubic-bezier(.55,0,.55,.2) forwards}\n", ".mat-datepicker-content{display:block;border-radius:var(--mat-datepicker-calendar-container-shape, var(--mat-sys-corner-large, 4px));background-color:var(--mat-datepicker-calendar-container-background-color, var(--mat-sys-surface-container-high));color:var(--mat-datepicker-calendar-container-text-color, var(--mat-sys-on-surface));box-shadow:var(--mat-datepicker-calendar-container-elevation-shadow, 0px 0px 0px 0px rgba(0, 0, 0, .2), 0px 0px 0px 0px rgba(0, 0, 0, .14), 0px 0px 0px 0px rgba(0, 0, 0, .12))}.mat-datepicker-content .mat-calendar{font-family:var(--mat-datepicker-calendar-text-font, var(--mat-sys-body-medium-font));font-size:var(--mat-datepicker-calendar-text-size, var(--mat-sys-body-medium-size));width:296px;height:354px}.mat-datepicker-content .mat-datepicker-content-container-with-custom-header .mat-calendar{height:auto}.mat-datepicker-content .mat-datepicker-close-button{position:absolute;top:100%;left:0;margin-top:8px}.ng-animating .mat-datepicker-content .mat-datepicker-close-button{display:none}.mat-datepicker-content-container{display:flex;flex-direction:column;justify-content:space-between}.time-container{display:flex;position:relative;padding-top:5px;justify-content:center}.time-container.disable-seconds .ngx-mat-timepicker .table{margin-left:9px}.time-container:before{content:\"\";position:absolute;top:0;left:0;right:0;height:1px;background-color:#0000001f}.mat-datepicker-content-touch{display:block;max-height:90vh;position:relative;overflow:visible}.mat-datepicker-content-touch .mat-datepicker-content-container{min-height:312px;max-height:815px;min-width:250px;max-width:750px}.mat-datepicker-content-touch .mat-calendar{width:100%;height:auto}@media all and (orientation:landscape){.mat-datepicker-content-touch .mat-datepicker-content-container{width:64vh;height:90vh}.mat-datepicker-content-touch .mat-datepicker-content-container.mat-datepicker-content-container-with-time{height:auto;max-height:none}}@media all and (orientation:portrait){.mat-datepicker-content-touch{max-height:100vh}.mat-datepicker-content-touch .mat-datepicker-content-container{width:80vw;height:100vw}.mat-datepicker-content-touch .mat-datepicker-content-container.mat-datepicker-content-container-with-time{height:auto;max-height:870px}.mat-datepicker-content-touch .mat-datepicker-content-container.mat-datepicker-content-container-with-time.mat-datepicker-content-container-with-actions{max-height:none!important}.mat-datepicker-content-touch .mat-datepicker-content-container-with-actions{height:115vw}}\n"], dependencies: [{ kind: "directive", type: CdkTrapFocus, selector: "[cdkTrapFocus]", inputs: ["cdkTrapFocus", "cdkTrapFocusAutoCapture"], exportAs: ["cdkTrapFocus"] }, { kind: "component", type: NgxMatCalendar, selector: "ngx-mat-calendar", inputs: ["headerComponent", "startAt", "startView", "selected", "minDate", "maxDate", "dateFilter", "dateClass", "comparisonStart", "comparisonEnd", "startDateAccessibleName", "endDateAccessibleName"], outputs: ["selectedChange", "yearSelected", "monthSelected", "viewChanged", "_userSelection", "_userDragDrop"], exportAs: ["ngxMatCalendar"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: NgxMatTimepickerComponent, selector: "ngx-mat-timepicker", inputs: ["disabled", "showSpinners", "stepHour", "stepMinute", "stepSecond", "showSeconds", "disableMinute", "enableMeridian", "defaultTime", "color", "meridian", "value"], outputs: ["valueChange"], exportAs: ["ngxMatTimepicker"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: CdkPortalOutlet, selector: "[cdkPortalOutlet]", inputs: ["cdkPortalOutlet"], outputs: ["attached"], exportAs: ["cdkPortalOutlet"] }, { kind: "component", type: MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
3923
3981
|
}
|
|
3924
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
3982
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.0", ngImport: i0, type: NgxMatDatepickerContent, decorators: [{
|
|
3925
3983
|
type: Component,
|
|
3926
3984
|
args: [{ selector: 'ngx-mat-datepicker-content', host: {
|
|
3927
3985
|
class: 'mat-datepicker-content',
|
|
@@ -3964,7 +4022,8 @@ class NgxMatDatepickerBase {
|
|
|
3964
4022
|
_inputStateChanges = Subscription.EMPTY;
|
|
3965
4023
|
_document = inject(DOCUMENT);
|
|
3966
4024
|
/** An input indicating the type of the custom header component for the calendar, if set. */
|
|
3967
|
-
calendarHeaderComponent = input(
|
|
4025
|
+
calendarHeaderComponent = input(/* @ts-ignore */
|
|
4026
|
+
...(ngDevMode ? [undefined, { debugName: "calendarHeaderComponent" }] : /* istanbul ignore next */ []));
|
|
3968
4027
|
/** The date to open the calendar to initially. */
|
|
3969
4028
|
get startAt() {
|
|
3970
4029
|
// If an explicit startAt is set we start there, otherwise we start at whatever the currently
|
|
@@ -3978,7 +4037,8 @@ class NgxMatDatepickerBase {
|
|
|
3978
4037
|
}
|
|
3979
4038
|
_startAt = null;
|
|
3980
4039
|
/** The view that the calendar should start in. */
|
|
3981
|
-
startView = input('month',
|
|
4040
|
+
startView = input('month', /* @ts-ignore */
|
|
4041
|
+
...(ngDevMode ? [{ debugName: "startView" }] : /* istanbul ignore next */ []));
|
|
3982
4042
|
/** Color palette to use on the datepicker's calendar. */
|
|
3983
4043
|
get color() {
|
|
3984
4044
|
return (this._color || (this.datepickerInput ? this.datepickerInput.getThemePalette() : undefined));
|
|
@@ -4020,9 +4080,11 @@ class NgxMatDatepickerBase {
|
|
|
4020
4080
|
}
|
|
4021
4081
|
_disabled = false;
|
|
4022
4082
|
/** Preferred position of the datepicker in the X axis. */
|
|
4023
|
-
xPosition = input('start',
|
|
4083
|
+
xPosition = input('start', /* @ts-ignore */
|
|
4084
|
+
...(ngDevMode ? [{ debugName: "xPosition" }] : /* istanbul ignore next */ []));
|
|
4024
4085
|
/** Preferred position of the datepicker in the Y axis. */
|
|
4025
|
-
yPosition = input('below',
|
|
4086
|
+
yPosition = input('below', /* @ts-ignore */
|
|
4087
|
+
...(ngDevMode ? [{ debugName: "yPosition" }] : /* istanbul ignore next */ []));
|
|
4026
4088
|
/**
|
|
4027
4089
|
* Whether to restore focus to the previously-focused element when the calendar is closed.
|
|
4028
4090
|
* Note that automatic focus restoration is an accessibility feature and it is recommended that
|
|
@@ -4050,7 +4112,8 @@ class NgxMatDatepickerBase {
|
|
|
4050
4112
|
*/
|
|
4051
4113
|
viewChanged = output();
|
|
4052
4114
|
/** Function that can be used to add custom CSS classes to dates. */
|
|
4053
|
-
dateClass = input(
|
|
4115
|
+
dateClass = input(/* @ts-ignore */
|
|
4116
|
+
...(ngDevMode ? [undefined, { debugName: "dateClass" }] : /* istanbul ignore next */ []));
|
|
4054
4117
|
/** Emits when the datepicker has been opened. */
|
|
4055
4118
|
openedStream = new EventEmitter();
|
|
4056
4119
|
/** Emits when the datepicker has been closed. */
|
|
@@ -4437,10 +4500,10 @@ class NgxMatDatepickerBase {
|
|
|
4437
4500
|
ctrlShiftMetaModifiers.every((modifier) => !hasModifierKey(event, modifier))));
|
|
4438
4501
|
})));
|
|
4439
4502
|
}
|
|
4440
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
4441
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "
|
|
4503
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.0", ngImport: i0, type: NgxMatDatepickerBase, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
4504
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.0.0", type: NgxMatDatepickerBase, isStandalone: true, inputs: { calendarHeaderComponent: { classPropertyName: "calendarHeaderComponent", publicName: "calendarHeaderComponent", isSignal: true, isRequired: false, transformFunction: null }, startAt: { classPropertyName: "startAt", publicName: "startAt", isSignal: false, isRequired: false, transformFunction: null }, startView: { classPropertyName: "startView", publicName: "startView", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: false, isRequired: false, transformFunction: null }, touchUi: { classPropertyName: "touchUi", publicName: "touchUi", isSignal: false, isRequired: false, transformFunction: null }, hideTime: { classPropertyName: "hideTime", publicName: "hideTime", isSignal: false, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: false, isRequired: false, transformFunction: null }, xPosition: { classPropertyName: "xPosition", publicName: "xPosition", isSignal: true, isRequired: false, transformFunction: null }, yPosition: { classPropertyName: "yPosition", publicName: "yPosition", isSignal: true, isRequired: false, transformFunction: null }, restoreFocus: { classPropertyName: "restoreFocus", publicName: "restoreFocus", isSignal: false, isRequired: false, transformFunction: null }, dateClass: { classPropertyName: "dateClass", publicName: "dateClass", isSignal: true, isRequired: false, transformFunction: null }, panelClass: { classPropertyName: "panelClass", publicName: "panelClass", isSignal: false, isRequired: false, transformFunction: null }, opened: { classPropertyName: "opened", publicName: "opened", isSignal: false, isRequired: false, transformFunction: null }, showSpinners: { classPropertyName: "showSpinners", publicName: "showSpinners", isSignal: false, isRequired: false, transformFunction: null }, showSeconds: { classPropertyName: "showSeconds", publicName: "showSeconds", isSignal: false, isRequired: false, transformFunction: null }, stepHour: { classPropertyName: "stepHour", publicName: "stepHour", isSignal: false, isRequired: false, transformFunction: null }, stepMinute: { classPropertyName: "stepMinute", publicName: "stepMinute", isSignal: false, isRequired: false, transformFunction: null }, stepSecond: { classPropertyName: "stepSecond", publicName: "stepSecond", isSignal: false, isRequired: false, transformFunction: null }, enableMeridian: { classPropertyName: "enableMeridian", publicName: "enableMeridian", isSignal: false, isRequired: false, transformFunction: null }, disableMinute: { classPropertyName: "disableMinute", publicName: "disableMinute", isSignal: false, isRequired: false, transformFunction: null }, defaultTime: { classPropertyName: "defaultTime", publicName: "defaultTime", isSignal: false, isRequired: false, transformFunction: null } }, outputs: { yearSelected: "yearSelected", monthSelected: "monthSelected", viewChanged: "viewChanged", openedStream: "opened", closedStream: "closed" }, usesOnChanges: true, ngImport: i0 });
|
|
4442
4505
|
}
|
|
4443
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
4506
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.0", ngImport: i0, type: NgxMatDatepickerBase, decorators: [{
|
|
4444
4507
|
type: Directive
|
|
4445
4508
|
}], ctorParameters: () => [], propDecorators: { calendarHeaderComponent: [{ type: i0.Input, args: [{ isSignal: true, alias: "calendarHeaderComponent", required: false }] }], startAt: [{
|
|
4446
4509
|
type: Input
|
|
@@ -4497,14 +4560,14 @@ class NgxMatDateRangePicker extends NgxMatDatepickerBase {
|
|
|
4497
4560
|
instance.endDateAccessibleName = input._getEndDateAccessibleName();
|
|
4498
4561
|
}
|
|
4499
4562
|
}
|
|
4500
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
4501
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
4563
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.0", ngImport: i0, type: NgxMatDateRangePicker, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
4564
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.0.0", type: NgxMatDateRangePicker, isStandalone: true, selector: "ngx-mat-date-range-picker", providers: [
|
|
4502
4565
|
NGX_MAT_RANGE_DATE_SELECTION_MODEL_PROVIDER,
|
|
4503
4566
|
NGX_MAT_CALENDAR_RANGE_STRATEGY_PROVIDER,
|
|
4504
4567
|
{ provide: NgxMatDatepickerBase, useExisting: NgxMatDateRangePicker },
|
|
4505
4568
|
], exportAs: ["ngxMatDateRangePicker"], usesInheritance: true, ngImport: i0, template: '', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
4506
4569
|
}
|
|
4507
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
4570
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.0", ngImport: i0, type: NgxMatDateRangePicker, decorators: [{
|
|
4508
4571
|
type: Component,
|
|
4509
4572
|
args: [{
|
|
4510
4573
|
selector: 'ngx-mat-date-range-picker',
|
|
@@ -4525,14 +4588,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImpo
|
|
|
4525
4588
|
// if angular adds support for `exportAs: '$implicit'` on directives.
|
|
4526
4589
|
/** Component responsible for managing the datepicker popup/dialog. */
|
|
4527
4590
|
class NgxMatDatetimepicker extends NgxMatDatepickerBase {
|
|
4528
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
4529
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
4591
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.0", ngImport: i0, type: NgxMatDatetimepicker, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
4592
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.0.0", type: NgxMatDatetimepicker, isStandalone: true, selector: "ngx-mat-datetime-picker", providers: [
|
|
4530
4593
|
NGX_MAT_SINGLE_DATE_SELECTION_MODEL_PROVIDER,
|
|
4531
4594
|
NGX_MAT_DATEPICKER_SCROLL_STRATEGY_FACTORY_PROVIDER,
|
|
4532
4595
|
{ provide: NgxMatDatepickerBase, useExisting: NgxMatDatetimepicker },
|
|
4533
4596
|
], exportAs: ["ngxMatDatetimePicker"], usesInheritance: true, ngImport: i0, template: '', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
4534
4597
|
}
|
|
4535
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
4598
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.0", ngImport: i0, type: NgxMatDatetimepicker, decorators: [{
|
|
4536
4599
|
type: Component,
|
|
4537
4600
|
args: [{
|
|
4538
4601
|
selector: 'ngx-mat-datetime-picker',
|
|
@@ -4555,10 +4618,10 @@ class NgxMatDatepickerApply {
|
|
|
4555
4618
|
this._datepicker._applyPendingSelection();
|
|
4556
4619
|
this._datepicker.close();
|
|
4557
4620
|
}
|
|
4558
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
4559
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "
|
|
4621
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.0", ngImport: i0, type: NgxMatDatepickerApply, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
4622
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.0.0", type: NgxMatDatepickerApply, isStandalone: true, selector: "[ngxMatDatepickerApply], [ngxMatDateRangePickerApply]", host: { listeners: { "click": "_applySelection()" } }, ngImport: i0 });
|
|
4560
4623
|
}
|
|
4561
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
4624
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.0", ngImport: i0, type: NgxMatDatepickerApply, decorators: [{
|
|
4562
4625
|
type: Directive,
|
|
4563
4626
|
args: [{
|
|
4564
4627
|
selector: '[ngxMatDatepickerApply], [ngxMatDateRangePickerApply]',
|
|
@@ -4574,10 +4637,10 @@ class NgxMatDatepickerClear {
|
|
|
4574
4637
|
this._datepicker.close();
|
|
4575
4638
|
}
|
|
4576
4639
|
}
|
|
4577
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
4578
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "16.1.0", version: "
|
|
4640
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.0", ngImport: i0, type: NgxMatDatepickerClear, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
4641
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "16.1.0", version: "22.0.0", type: NgxMatDatepickerClear, isStandalone: true, selector: "[ngxMatDatepickerClear], [ngxMatDateRangePickerClear]", inputs: { close: ["close", "close", booleanAttribute] }, host: { listeners: { "click": "_clearSelection()" } }, ngImport: i0 });
|
|
4579
4642
|
}
|
|
4580
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
4643
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.0", ngImport: i0, type: NgxMatDatepickerClear, decorators: [{
|
|
4581
4644
|
type: Directive,
|
|
4582
4645
|
args: [{
|
|
4583
4646
|
selector: '[ngxMatDatepickerClear], [ngxMatDateRangePickerClear]',
|
|
@@ -4592,10 +4655,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImpo
|
|
|
4592
4655
|
/** Button that will close the datepicker and discard the current selection. */
|
|
4593
4656
|
class NgxMatDatepickerCancel {
|
|
4594
4657
|
_datepicker = inject((NgxMatDatepickerBase));
|
|
4595
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
4596
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "
|
|
4658
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.0", ngImport: i0, type: NgxMatDatepickerCancel, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
4659
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.0.0", type: NgxMatDatepickerCancel, isStandalone: true, selector: "[ngxMatDatepickerCancel], [ngxMatDateRangePickerCancel]", host: { listeners: { "click": "_datepicker.close()" } }, ngImport: i0 });
|
|
4597
4660
|
}
|
|
4598
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
4661
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.0", ngImport: i0, type: NgxMatDatepickerCancel, decorators: [{
|
|
4599
4662
|
type: Directive,
|
|
4600
4663
|
args: [{
|
|
4601
4664
|
selector: '[ngxMatDatepickerCancel], [ngxMatDateRangePickerCancel]',
|
|
@@ -4607,7 +4670,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImpo
|
|
|
4607
4670
|
* to the bottom of a datepicker or date range picker.
|
|
4608
4671
|
*/
|
|
4609
4672
|
class NgxMatDatepickerActions {
|
|
4610
|
-
_template = viewChild(TemplateRef,
|
|
4673
|
+
_template = viewChild(TemplateRef, /* @ts-ignore */
|
|
4674
|
+
...(ngDevMode ? [{ debugName: "_template" }] : /* istanbul ignore next */ []));
|
|
4611
4675
|
_portal = null;
|
|
4612
4676
|
_datepicker = inject((NgxMatDatepickerBase));
|
|
4613
4677
|
_viewContainerRef = inject(ViewContainerRef);
|
|
@@ -4622,8 +4686,8 @@ class NgxMatDatepickerActions {
|
|
|
4622
4686
|
this._portal?.detach();
|
|
4623
4687
|
}
|
|
4624
4688
|
}
|
|
4625
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
4626
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "
|
|
4689
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.0", ngImport: i0, type: NgxMatDatepickerActions, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
4690
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "22.0.0", type: NgxMatDatepickerActions, isStandalone: true, selector: "ngx-mat-datepicker-actions, ngx-mat-date-range-picker-actions", viewQueries: [{ propertyName: "_template", first: true, predicate: TemplateRef, descendants: true, isSignal: true }], ngImport: i0, template: `
|
|
4627
4691
|
<ng-template>
|
|
4628
4692
|
<div class="mat-datepicker-actions">
|
|
4629
4693
|
<ng-content></ng-content>
|
|
@@ -4631,7 +4695,7 @@ class NgxMatDatepickerActions {
|
|
|
4631
4695
|
</ng-template>
|
|
4632
4696
|
`, isInline: true, styles: [".mat-datepicker-actions{display:flex;justify-content:flex-end;align-items:center;padding:8px}.mat-datepicker-actions .mat-mdc-button-base+.mat-mdc-button-base{margin-left:8px}[dir=rtl] .mat-datepicker-actions .mat-mdc-button-base+.mat-mdc-button-base{margin-left:0;margin-right:8px}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
4633
4697
|
}
|
|
4634
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
4698
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.0", ngImport: i0, type: NgxMatDatepickerActions, decorators: [{
|
|
4635
4699
|
type: Component,
|
|
4636
4700
|
args: [{ selector: 'ngx-mat-datepicker-actions, ngx-mat-date-range-picker-actions', template: `
|
|
4637
4701
|
<ng-template>
|
|
@@ -4772,14 +4836,14 @@ class NgxMatDatepickerInput extends NgxMatDatepickerInputBase {
|
|
|
4772
4836
|
_shouldHandleChangeEvent(event) {
|
|
4773
4837
|
return event.source !== this;
|
|
4774
4838
|
}
|
|
4775
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
4776
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "
|
|
4839
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.0", ngImport: i0, type: NgxMatDatepickerInput, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
4840
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.0.0", type: NgxMatDatepickerInput, isStandalone: true, selector: "input[ngxMatDatetimePicker]", inputs: { ngxMatDatetimePicker: "ngxMatDatetimePicker", min: "min", max: "max", dateFilter: ["matDatepickerFilter", "dateFilter"] }, host: { listeners: { "input": "_onInput($event)", "change": "_onChange()", "blur": "_onBlur()", "keydown": "_onKeydown($event)" }, properties: { "attr.aria-haspopup": "_datepicker ? \"dialog\" : null", "attr.aria-owns": "(_datepicker?.opened && _datepicker?.id) || null", "attr.min": "_dateAdapter && min ? _dateAdapter.toIso8601(min) : null", "attr.max": "_dateAdapter && max ? _dateAdapter.toIso8601(max) : null", "attr.data-mat-calendar": "_datepicker ? _datepicker.id : null", "disabled": "disabled" }, classAttribute: "mat-datepicker-input" }, providers: [
|
|
4777
4841
|
NGX_MAT_DATEPICKER_VALUE_ACCESSOR,
|
|
4778
4842
|
NGX_MAT_DATEPICKER_VALIDATORS,
|
|
4779
4843
|
{ provide: MAT_INPUT_VALUE_ACCESSOR, useExisting: NgxMatDatepickerInput },
|
|
4780
4844
|
], exportAs: ["ngxMatDatepickerInput"], usesInheritance: true, ngImport: i0 });
|
|
4781
4845
|
}
|
|
4782
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
4846
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.0", ngImport: i0, type: NgxMatDatepickerInput, decorators: [{
|
|
4783
4847
|
type: Directive,
|
|
4784
4848
|
args: [{
|
|
4785
4849
|
selector: 'input[ngxMatDatetimePicker]',
|
|
@@ -4818,10 +4882,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImpo
|
|
|
4818
4882
|
|
|
4819
4883
|
/** Can be used to override the icon of a `matDatepickerToggle`. */
|
|
4820
4884
|
class NgxMatDatepickerToggleIcon {
|
|
4821
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
4822
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "
|
|
4885
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.0", ngImport: i0, type: NgxMatDatepickerToggleIcon, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
4886
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.0.0", type: NgxMatDatepickerToggleIcon, isStandalone: true, selector: "[ngxMatDatepickerToggleIcon]", ngImport: i0 });
|
|
4823
4887
|
}
|
|
4824
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
4888
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.0", ngImport: i0, type: NgxMatDatepickerToggleIcon, decorators: [{
|
|
4825
4889
|
type: Directive,
|
|
4826
4890
|
args: [{
|
|
4827
4891
|
selector: '[ngxMatDatepickerToggleIcon]',
|
|
@@ -4847,9 +4911,11 @@ class NgxMatDatepickerToggle {
|
|
|
4847
4911
|
}
|
|
4848
4912
|
_disabled = false;
|
|
4849
4913
|
/** Whether ripples on the toggle should be disabled. */
|
|
4850
|
-
disableRipple = input(
|
|
4914
|
+
disableRipple = input(/* @ts-ignore */
|
|
4915
|
+
...(ngDevMode ? [undefined, { debugName: "disableRipple" }] : /* istanbul ignore next */ []));
|
|
4851
4916
|
/** Underlying button element. */
|
|
4852
|
-
_button = viewChild('button',
|
|
4917
|
+
_button = viewChild('button', /* @ts-ignore */
|
|
4918
|
+
...(ngDevMode ? [{ debugName: "_button" }] : /* istanbul ignore next */ []));
|
|
4853
4919
|
_intl = inject(NgxMatDatepickerIntl);
|
|
4854
4920
|
_changeDetectorRef = inject(ChangeDetectorRef);
|
|
4855
4921
|
constructor(defaultTabIndex) {
|
|
@@ -4885,10 +4951,10 @@ class NgxMatDatepickerToggle {
|
|
|
4885
4951
|
this._stateChanges.unsubscribe();
|
|
4886
4952
|
this._stateChanges = merge(this._intl.changes, datepickerStateChanged, inputStateChanged, datepickerToggled).subscribe(() => this._changeDetectorRef.markForCheck());
|
|
4887
4953
|
}
|
|
4888
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
4889
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "
|
|
4954
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.0", ngImport: i0, type: NgxMatDatepickerToggle, deps: [{ token: 'tabindex', attribute: true }], target: i0.ɵɵFactoryTarget.Component });
|
|
4955
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "22.0.0", type: NgxMatDatepickerToggle, isStandalone: true, selector: "ngx-mat-datepicker-toggle", inputs: { datepicker: { classPropertyName: "datepicker", publicName: "for", isSignal: true, isRequired: false, transformFunction: null }, tabIndex: { classPropertyName: "tabIndex", publicName: "tabIndex", isSignal: false, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "aria-label", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: false, isRequired: false, transformFunction: null }, disableRipple: { classPropertyName: "disableRipple", publicName: "disableRipple", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "click": "_open($event)" }, properties: { "attr.tabindex": "null", "class.mat-datepicker-toggle-active": "datepicker()?.opened", "class.mat-accent": "datepicker()?.color === \"accent\"", "class.mat-warn": "datepicker()?.color === \"warn\"", "attr.data-mat-calendar": "datepicker()?.id" }, classAttribute: "mat-datepicker-toggle" }, viewQueries: [{ propertyName: "_button", first: true, predicate: ["button"], descendants: true, isSignal: true }], exportAs: ["ngxMatDatepickerToggle"], ngImport: i0, template: "<button\n #button\n mat-icon-button\n type=\"button\"\n [attr.aria-haspopup]=\"datepicker() ? 'dialog' : null\"\n [attr.aria-label]=\"ariaLabel() || _intl.openCalendarLabel\"\n [attr.tabindex]=\"disabled ? -1 : tabIndex\"\n [disabled]=\"disabled\"\n [disableRipple]=\"disableRipple()\"\n>\n <ng-content select=\"[ngxMatDatepickerToggleIcon]\">\n <svg\n class=\"mat-datepicker-toggle-default-icon\"\n viewBox=\"0 0 24 24\"\n width=\"24px\"\n height=\"24px\"\n fill=\"currentColor\"\n focusable=\"false\"\n >\n <path\n d=\"M19 3h-1V1h-2v2H8V1H6v2H5c-1.11 0-1.99.9-1.99 2L3 19c0 1.1.89 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm0 16H5V8h14v11zM7 10h5v5H7z\"\n />\n </svg>\n </ng-content>\n</button>\n", styles: [".mat-datepicker-toggle{pointer-events:auto;color:var(--mat-datepicker-toggle-icon-color, var(--mat-sys-on-surface-variant))}@media(forced-colors:active){.mat-datepicker-toggle-default-icon{color:CanvasText}}\n"], dependencies: [{ kind: "component", type: MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
4890
4956
|
}
|
|
4891
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
4957
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.0", ngImport: i0, type: NgxMatDatepickerToggle, decorators: [{
|
|
4892
4958
|
type: Component,
|
|
4893
4959
|
args: [{ selector: 'ngx-mat-datepicker-toggle', host: {
|
|
4894
4960
|
class: 'mat-datepicker-toggle',
|
|
@@ -4920,8 +4986,10 @@ class NgxMatDatetimePickerContentV2 {
|
|
|
4920
4986
|
_dateAdapter = inject((DateAdapter));
|
|
4921
4987
|
_destroyed = new Subject();
|
|
4922
4988
|
// Signals for reactive state management
|
|
4923
|
-
selectedDate = signal(this.data.value || null,
|
|
4924
|
-
|
|
4989
|
+
selectedDate = signal(this.data.value || null, /* @ts-ignore */
|
|
4990
|
+
...(ngDevMode ? [{ debugName: "selectedDate" }] : /* istanbul ignore next */ []));
|
|
4991
|
+
selectedDateTime = signal(this.data.value || null, /* @ts-ignore */
|
|
4992
|
+
...(ngDevMode ? [{ debugName: "selectedDateTime" }] : /* istanbul ignore next */ []));
|
|
4925
4993
|
constructor() {
|
|
4926
4994
|
// Initialize values once without effects to avoid reset loops
|
|
4927
4995
|
const initialValue = this.data.value;
|
|
@@ -5033,8 +5101,8 @@ class NgxMatDatetimePickerContentV2 {
|
|
|
5033
5101
|
dateObj.setMilliseconds(0);
|
|
5034
5102
|
return this._dateAdapter.deserialize(dateObj.toISOString());
|
|
5035
5103
|
}
|
|
5036
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
5037
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
5104
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.0", ngImport: i0, type: NgxMatDatetimePickerContentV2, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
5105
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.0", type: NgxMatDatetimePickerContentV2, isStandalone: true, selector: "ngx-mat-datetime-picker-content-v2", host: { properties: { "class.ngx-mat-datetime-picker-content-touch": "data.touchUi" }, classAttribute: "ngx-mat-datetime-picker-content-v2" }, viewQueries: [{ propertyName: "calendar", first: true, predicate: ["calendar"], descendants: true, static: true }, { propertyName: "timepicker", first: true, predicate: ["timepicker"], descendants: true }], ngImport: i0, template: `
|
|
5038
5106
|
<div
|
|
5039
5107
|
class="ngx-mat-datetime-picker-content"
|
|
5040
5108
|
[class.ngx-mat-datetime-picker-content-touch]="data.touchUi">
|
|
@@ -5090,7 +5158,7 @@ class NgxMatDatetimePickerContentV2 {
|
|
|
5090
5158
|
</div>
|
|
5091
5159
|
`, isInline: true, styles: [".ngx-mat-datetime-picker-content-v2{display:flex;flex-direction:column;max-height:90vh;min-width:296px}.ngx-mat-datetime-picker-content-v2 .ngx-mat-datetime-picker-content{display:flex;flex-direction:column}.ngx-mat-datetime-picker-content-v2 .ngx-mat-datetime-picker-time{padding:16px;border-top:1px solid rgba(0,0,0,.12)}.mat-dark .ngx-mat-datetime-picker-content-v2 .ngx-mat-datetime-picker-time{border-top-color:#ffffff1f}.ngx-mat-datetime-picker-content-v2 .ngx-mat-datetime-picker-actions{display:flex;justify-content:flex-end;gap:8px;padding:8px 16px 16px;border-top:1px solid rgba(0,0,0,.12)}.mat-dark .ngx-mat-datetime-picker-content-v2 .ngx-mat-datetime-picker-actions{border-top-color:#ffffff1f}.ngx-mat-datetime-picker-content-v2.ngx-mat-datetime-picker-content-touch{min-width:320px}.ngx-mat-datetime-picker-content-v2.ngx-mat-datetime-picker-content-touch .ngx-mat-datetime-picker-time{padding:24px}.ngx-mat-datetime-picker-content-v2.ngx-mat-datetime-picker-content-touch .ngx-mat-datetime-picker-actions{padding:16px 24px 24px}.ngx-mat-datetime-picker-content-v2 mat-calendar{display:block}.ngx-mat-datetime-picker-content-v2 mat-calendar .mat-calendar-header{padding:8px 8px 0}.ngx-mat-datetime-picker-content-v2 mat-calendar .mat-calendar-content{padding:0 8px 8px}.ngx-mat-datetime-picker-content-v2 ngx-mat-timepicker{width:100%;display:flex;justify-content:center;align-items:center}.ngx-mat-datetime-picker-content-v2 ngx-mat-timepicker .ngx-mat-timepicker-container{justify-content:center}.ngx-mat-datetime-picker-content-enter{opacity:0;transform:scale(.9);transition:opacity .15s cubic-bezier(.25,.8,.25,1),transform .15s cubic-bezier(.25,.8,.25,1)}.ngx-mat-datetime-picker-content-enter-active{opacity:1;transform:scale(1)}.ngx-mat-datetime-picker-content-exit{opacity:1;transform:scale(1);transition:opacity .15s cubic-bezier(.4,0,.2,1),transform .15s cubic-bezier(.4,0,.2,1)}.ngx-mat-datetime-picker-content-exit-active{opacity:0;transform:scale(.9)}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: MatCalendar, selector: "mat-calendar", inputs: ["headerComponent", "startAt", "startView", "selected", "minDate", "maxDate", "dateFilter", "dateClass", "comparisonStart", "comparisonEnd", "startDateAccessibleName", "endDateAccessibleName"], outputs: ["selectedChange", "yearSelected", "monthSelected", "viewChanged", "_userSelection", "_userDragDrop"], exportAs: ["matCalendar"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i4.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: NgxMatTimepickerComponent, selector: "ngx-mat-timepicker", inputs: ["disabled", "showSpinners", "stepHour", "stepMinute", "stepSecond", "showSeconds", "disableMinute", "enableMeridian", "defaultTime", "color", "meridian", "value"], outputs: ["valueChange"], exportAs: ["ngxMatTimepicker"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
5092
5160
|
}
|
|
5093
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
5161
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.0", ngImport: i0, type: NgxMatDatetimePickerContentV2, decorators: [{
|
|
5094
5162
|
type: Component,
|
|
5095
5163
|
args: [{ selector: 'ngx-mat-datetime-picker-content-v2', template: `
|
|
5096
5164
|
<div
|
|
@@ -5183,7 +5251,8 @@ class NgxMatDatetimePickerInputV2 {
|
|
|
5183
5251
|
set value(value) {
|
|
5184
5252
|
this._assignValue(value);
|
|
5185
5253
|
}
|
|
5186
|
-
_value = signal(null,
|
|
5254
|
+
_value = signal(null, /* @ts-ignore */
|
|
5255
|
+
...(ngDevMode ? [{ debugName: "_value" }] : /* istanbul ignore next */ []));
|
|
5187
5256
|
/** The minimum valid date. */
|
|
5188
5257
|
get min() {
|
|
5189
5258
|
return this._min();
|
|
@@ -5193,7 +5262,8 @@ class NgxMatDatetimePickerInputV2 {
|
|
|
5193
5262
|
this._min.set(validValue);
|
|
5194
5263
|
this._validatorOnChange();
|
|
5195
5264
|
}
|
|
5196
|
-
_min = signal(null,
|
|
5265
|
+
_min = signal(null, /* @ts-ignore */
|
|
5266
|
+
...(ngDevMode ? [{ debugName: "_min" }] : /* istanbul ignore next */ []));
|
|
5197
5267
|
/** The maximum valid date. */
|
|
5198
5268
|
get max() {
|
|
5199
5269
|
return this._max();
|
|
@@ -5203,7 +5273,8 @@ class NgxMatDatetimePickerInputV2 {
|
|
|
5203
5273
|
this._max.set(validValue);
|
|
5204
5274
|
this._validatorOnChange();
|
|
5205
5275
|
}
|
|
5206
|
-
_max = signal(null,
|
|
5276
|
+
_max = signal(null, /* @ts-ignore */
|
|
5277
|
+
...(ngDevMode ? [{ debugName: "_max" }] : /* istanbul ignore next */ []));
|
|
5207
5278
|
/** Function that can be used to filter out dates within the datepicker. */
|
|
5208
5279
|
get dateFilter() {
|
|
5209
5280
|
return this._dateFilter();
|
|
@@ -5215,7 +5286,8 @@ class NgxMatDatetimePickerInputV2 {
|
|
|
5215
5286
|
this._validatorOnChange();
|
|
5216
5287
|
}
|
|
5217
5288
|
}
|
|
5218
|
-
_dateFilter = signal(() => true,
|
|
5289
|
+
_dateFilter = signal(() => true, /* @ts-ignore */
|
|
5290
|
+
...(ngDevMode ? [{ debugName: "_dateFilter" }] : /* istanbul ignore next */ []));
|
|
5219
5291
|
/** Whether the datepicker-input is disabled. */
|
|
5220
5292
|
get disabled() {
|
|
5221
5293
|
return this._disabled();
|
|
@@ -5228,7 +5300,8 @@ class NgxMatDatetimePickerInputV2 {
|
|
|
5228
5300
|
}
|
|
5229
5301
|
this.stateChanges.next();
|
|
5230
5302
|
}
|
|
5231
|
-
_disabled = signal(false,
|
|
5303
|
+
_disabled = signal(false, /* @ts-ignore */
|
|
5304
|
+
...(ngDevMode ? [{ debugName: "_disabled" }] : /* istanbul ignore next */ []));
|
|
5232
5305
|
/** Emits when a `change` event is fired on this `<input>`. */
|
|
5233
5306
|
dateChange = new EventEmitter();
|
|
5234
5307
|
/** Emits when an `input` event is fired on this `<input>`. */
|
|
@@ -5299,7 +5372,8 @@ class NgxMatDatetimePickerInputV2 {
|
|
|
5299
5372
|
this._required.set(coerceBooleanProperty(value));
|
|
5300
5373
|
this.stateChanges.next();
|
|
5301
5374
|
}
|
|
5302
|
-
_required = signal(false,
|
|
5375
|
+
_required = signal(false, /* @ts-ignore */
|
|
5376
|
+
...(ngDevMode ? [{ debugName: "_required" }] : /* istanbul ignore next */ []));
|
|
5303
5377
|
get placeholder() {
|
|
5304
5378
|
return this._placeholder();
|
|
5305
5379
|
}
|
|
@@ -5307,11 +5381,13 @@ class NgxMatDatetimePickerInputV2 {
|
|
|
5307
5381
|
this._placeholder.set(value);
|
|
5308
5382
|
this.stateChanges.next();
|
|
5309
5383
|
}
|
|
5310
|
-
_placeholder = signal('',
|
|
5384
|
+
_placeholder = signal('', /* @ts-ignore */
|
|
5385
|
+
...(ngDevMode ? [{ debugName: "_placeholder" }] : /* istanbul ignore next */ []));
|
|
5311
5386
|
get errorState() {
|
|
5312
5387
|
return this._errorState();
|
|
5313
5388
|
}
|
|
5314
|
-
_errorState = signal(false,
|
|
5389
|
+
_errorState = signal(false, /* @ts-ignore */
|
|
5390
|
+
...(ngDevMode ? [{ debugName: "_errorState" }] : /* istanbul ignore next */ []));
|
|
5315
5391
|
// Unique ID for this input
|
|
5316
5392
|
id = `ngx-mat-datetime-picker-input-${Math.random().toString(36).substr(2, 9)}`;
|
|
5317
5393
|
constructor() {
|
|
@@ -5471,14 +5547,14 @@ class NgxMatDatetimePickerInputV2 {
|
|
|
5471
5547
|
getOverlayLabelId() {
|
|
5472
5548
|
return this.id;
|
|
5473
5549
|
}
|
|
5474
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
5475
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "
|
|
5550
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.0", ngImport: i0, type: NgxMatDatetimePickerInputV2, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
5551
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.0.0", type: NgxMatDatetimePickerInputV2, isStandalone: true, selector: "input[ngxMatDatetimePicker]", inputs: { ngxMatDatetimePicker: "ngxMatDatetimePicker", value: "value", min: "min", max: "max", dateFilter: "dateFilter", disabled: "disabled" }, outputs: { dateChange: "dateChange", dateInput: "dateInput" }, host: { listeners: { "input": "_onInput($event)", "change": "_onChange()", "blur": "_onBlur()", "keydown": "_onKeydown($event)", "click": "_onClick($event)" }, properties: { "attr.aria-haspopup": "ngxMatDatetimePicker ? \"dialog\" : null", "attr.aria-owns": "(ngxMatDatetimePicker?.opened && ngxMatDatetimePicker?.id) || null", "attr.min": "min ? _dateAdapter?.toIso8601(min) : null", "attr.max": "max ? _dateAdapter?.toIso8601(max) : null", "attr.data-mat-calendar": "ngxMatDatetimePicker ? ngxMatDatetimePicker.id : null", "disabled": "disabled" }, classAttribute: "ngx-mat-datetime-picker-input" }, providers: [
|
|
5476
5552
|
NGX_MAT_DATETIME_PICKER_VALUE_ACCESSOR,
|
|
5477
5553
|
NGX_MAT_DATETIME_PICKER_VALIDATORS,
|
|
5478
5554
|
{ provide: MatFormFieldControl, useExisting: NgxMatDatetimePickerInputV2 },
|
|
5479
5555
|
], ngImport: i0 });
|
|
5480
5556
|
}
|
|
5481
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
5557
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.0", ngImport: i0, type: NgxMatDatetimePickerInputV2, decorators: [{
|
|
5482
5558
|
type: Directive,
|
|
5483
5559
|
args: [{
|
|
5484
5560
|
selector: 'input[ngxMatDatetimePicker]',
|
|
@@ -5553,23 +5629,39 @@ class NgxMatDatetimePickerV2 {
|
|
|
5553
5629
|
/** Emits when the datepicker has been closed. */
|
|
5554
5630
|
closedStream = new EventEmitter();
|
|
5555
5631
|
// Configuration inputs
|
|
5556
|
-
startView = input('month',
|
|
5557
|
-
|
|
5558
|
-
|
|
5559
|
-
|
|
5560
|
-
|
|
5561
|
-
|
|
5562
|
-
|
|
5563
|
-
|
|
5564
|
-
|
|
5565
|
-
|
|
5566
|
-
|
|
5567
|
-
|
|
5568
|
-
|
|
5569
|
-
|
|
5570
|
-
|
|
5632
|
+
startView = input('month', /* @ts-ignore */
|
|
5633
|
+
...(ngDevMode ? [{ debugName: "startView" }] : /* istanbul ignore next */ []));
|
|
5634
|
+
color = input('primary', /* @ts-ignore */
|
|
5635
|
+
...(ngDevMode ? [{ debugName: "color" }] : /* istanbul ignore next */ []));
|
|
5636
|
+
touchUi = input(false, /* @ts-ignore */
|
|
5637
|
+
...(ngDevMode ? [{ debugName: "touchUi" }] : /* istanbul ignore next */ []));
|
|
5638
|
+
disabled = input(false, /* @ts-ignore */
|
|
5639
|
+
...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
|
|
5640
|
+
hideTime = input(false, /* @ts-ignore */
|
|
5641
|
+
...(ngDevMode ? [{ debugName: "hideTime" }] : /* istanbul ignore next */ []));
|
|
5642
|
+
showSpinners = input(true, /* @ts-ignore */
|
|
5643
|
+
...(ngDevMode ? [{ debugName: "showSpinners" }] : /* istanbul ignore next */ []));
|
|
5644
|
+
showSeconds = input(false, /* @ts-ignore */
|
|
5645
|
+
...(ngDevMode ? [{ debugName: "showSeconds" }] : /* istanbul ignore next */ []));
|
|
5646
|
+
stepHour = input(DEFAULT_STEP, /* @ts-ignore */
|
|
5647
|
+
...(ngDevMode ? [{ debugName: "stepHour" }] : /* istanbul ignore next */ []));
|
|
5648
|
+
stepMinute = input(DEFAULT_STEP, /* @ts-ignore */
|
|
5649
|
+
...(ngDevMode ? [{ debugName: "stepMinute" }] : /* istanbul ignore next */ []));
|
|
5650
|
+
stepSecond = input(DEFAULT_STEP, /* @ts-ignore */
|
|
5651
|
+
...(ngDevMode ? [{ debugName: "stepSecond" }] : /* istanbul ignore next */ []));
|
|
5652
|
+
enableMeridian = input(false, /* @ts-ignore */
|
|
5653
|
+
...(ngDevMode ? [{ debugName: "enableMeridian" }] : /* istanbul ignore next */ []));
|
|
5654
|
+
disableMinute = input(false, /* @ts-ignore */
|
|
5655
|
+
...(ngDevMode ? [{ debugName: "disableMinute" }] : /* istanbul ignore next */ []));
|
|
5656
|
+
defaultTime = input(/* @ts-ignore */
|
|
5657
|
+
...(ngDevMode ? [undefined, { debugName: "defaultTime" }] : /* istanbul ignore next */ []));
|
|
5658
|
+
startAt = input(null, /* @ts-ignore */
|
|
5659
|
+
...(ngDevMode ? [{ debugName: "startAt" }] : /* istanbul ignore next */ []));
|
|
5660
|
+
panelClass = input([], /* @ts-ignore */
|
|
5661
|
+
...(ngDevMode ? [{ debugName: "panelClass" }] : /* istanbul ignore next */ []));
|
|
5571
5662
|
// Internal state
|
|
5572
|
-
_opened = signal(false,
|
|
5663
|
+
_opened = signal(false, /* @ts-ignore */
|
|
5664
|
+
...(ngDevMode ? [{ debugName: "_opened" }] : /* istanbul ignore next */ []));
|
|
5573
5665
|
opened = this._opened.asReadonly();
|
|
5574
5666
|
constructor() {
|
|
5575
5667
|
if (!this._dateAdapter) {
|
|
@@ -5692,10 +5784,10 @@ class NgxMatDatetimePickerV2 {
|
|
|
5692
5784
|
this.close();
|
|
5693
5785
|
});
|
|
5694
5786
|
}
|
|
5695
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
5696
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "
|
|
5787
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.0", ngImport: i0, type: NgxMatDatetimePickerV2, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
5788
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.0.0", type: NgxMatDatetimePickerV2, isStandalone: true, selector: "ngx-mat-datetime-picker", inputs: { startView: { classPropertyName: "startView", publicName: "startView", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, touchUi: { classPropertyName: "touchUi", publicName: "touchUi", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, hideTime: { classPropertyName: "hideTime", publicName: "hideTime", isSignal: true, isRequired: false, transformFunction: null }, showSpinners: { classPropertyName: "showSpinners", publicName: "showSpinners", isSignal: true, isRequired: false, transformFunction: null }, showSeconds: { classPropertyName: "showSeconds", publicName: "showSeconds", isSignal: true, isRequired: false, transformFunction: null }, stepHour: { classPropertyName: "stepHour", publicName: "stepHour", isSignal: true, isRequired: false, transformFunction: null }, stepMinute: { classPropertyName: "stepMinute", publicName: "stepMinute", isSignal: true, isRequired: false, transformFunction: null }, stepSecond: { classPropertyName: "stepSecond", publicName: "stepSecond", isSignal: true, isRequired: false, transformFunction: null }, enableMeridian: { classPropertyName: "enableMeridian", publicName: "enableMeridian", isSignal: true, isRequired: false, transformFunction: null }, disableMinute: { classPropertyName: "disableMinute", publicName: "disableMinute", isSignal: true, isRequired: false, transformFunction: null }, defaultTime: { classPropertyName: "defaultTime", publicName: "defaultTime", isSignal: true, isRequired: false, transformFunction: null }, startAt: { classPropertyName: "startAt", publicName: "startAt", isSignal: true, isRequired: false, transformFunction: null }, panelClass: { classPropertyName: "panelClass", publicName: "panelClass", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { openedStream: "openedStream", closedStream: "closedStream" }, providers: [NGX_MAT_SINGLE_DATE_SELECTION_MODEL_PROVIDER], exportAs: ["ngxMatDatetimePicker"], ngImport: i0, template: '', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
5697
5789
|
}
|
|
5698
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
5790
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.0", ngImport: i0, type: NgxMatDatetimePickerV2, decorators: [{
|
|
5699
5791
|
type: Component,
|
|
5700
5792
|
args: [{
|
|
5701
5793
|
selector: 'ngx-mat-datetime-picker',
|