@ng-matero/extensions
Version:
Angular Material Extensions
575 lines • 92.1 kB
JavaScript
import { coerceStringArray } from '@angular/cdk/coercion';
import { ESCAPE, hasModifierKey, UP_ARROW } from '@angular/cdk/keycodes';
import { Overlay, OverlayConfig, } from '@angular/cdk/overlay';
import { _getFocusedElementPierceShadowDom } from '@angular/cdk/platform';
import { CdkPortalOutlet, ComponentPortal, } from '@angular/cdk/portal';
import { DOCUMENT } from '@angular/common';
import { afterNextRender, booleanAttribute, ChangeDetectionStrategy, Component, EventEmitter, inject, Inject, InjectionToken, Injector, Input, Optional, Output, ViewChild, ViewEncapsulation, } from '@angular/core';
import { merge, Subject, Subscription } from 'rxjs';
import { filter, take } from 'rxjs/operators';
import { MtxCalendar } from './calendar';
import { mtxDatetimepickerAnimations } from './datetimepicker-animations';
import { createMissingDateImplError } from './datetimepicker-errors';
import * as i0 from "@angular/core";
import * as i1 from "@angular/cdk/overlay";
import * as i2 from "@ng-matero/extensions/core";
import * as i3 from "@angular/cdk/bidi";
/** Used to generate a unique ID for each datetimepicker instance. */
let datetimepickerUid = 0;
/** Injection token that determines the scroll handling while the calendar is open. */
export const MTX_DATETIMEPICKER_SCROLL_STRATEGY = new InjectionToken('mtx-datetimepicker-scroll-strategy', {
providedIn: 'root',
factory: () => {
const overlay = inject(Overlay);
return () => overlay.scrollStrategies.reposition();
},
});
export function MTX_DATETIMEPICKER_SCROLL_STRATEGY_FACTORY(overlay) {
return () => overlay.scrollStrategies.reposition();
}
export const MTX_DATETIMEPICKER_SCROLL_STRATEGY_FACTORY_PROVIDER = {
provide: MTX_DATETIMEPICKER_SCROLL_STRATEGY,
deps: [Overlay],
useFactory: MTX_DATETIMEPICKER_SCROLL_STRATEGY_FACTORY,
};
/**
* Component used as the content for the datetimepicker dialog and popup. We use this instead of
* using MtxCalendar directly as the content so we can control the initial focus. This also gives us
* a place to put additional features of the popup that are not part of the calendar itself in the
* future. (e.g. confirmation buttons).
* @docs-private
*/
export class MtxDatetimepickerContent {
constructor(_changeDetectorRef) {
this._changeDetectorRef = _changeDetectorRef;
/** Emits when an animation has finished. */
this._animationDone = new Subject();
/** Id of the label for the `role="dialog"` element. */
this._dialogLabelId = null;
/** Portal with projected action buttons. */
this._actionsPortal = null;
/** The display type of datetimepicker. */
this.type = 'datetime';
/** The view of the calendar. */
this.view = 'month';
}
_viewChanged(view) {
this.view = view;
}
ngOnInit() {
this._animationState = this.datetimepicker.touchUi ? 'enter-dialog' : 'enter-dropdown';
}
ngAfterContentInit() {
this._calendar._focusActiveCell();
}
ngOnDestroy() {
this._animationDone.complete();
}
_startExitAnimation() {
this._animationState = 'void';
this._changeDetectorRef.markForCheck();
}
_handleUserSelection() {
// Delegate closing the overlay to the actions.
if (!this._actionsPortal) {
this.datetimepicker.close();
}
}
/**
* Assigns a new portal containing the datetimepicker actions.
* @param portal Portal with the actions to be assigned.
* @param forceRerender Whether a re-render of the portal should be triggered.
*/
_assignActions(portal, forceRerender) {
this._actionsPortal = portal;
if (forceRerender) {
this._changeDetectorRef.detectChanges();
}
}
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: MtxDatetimepickerContent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.0", type: MtxDatetimepickerContent, isStandalone: true, selector: "mtx-datetimepicker-content", inputs: { color: "color" }, host: { listeners: { "@transformPanel.done": "_animationDone.next()" }, properties: { "class": "color ? \"mat-\" + color : \"\"", "class.mtx-datetimepicker-content-touch": "datetimepicker?.touchUi", "attr.mode": "datetimepicker.mode", "@transformPanel": "_animationState" }, classAttribute: "mtx-datetimepicker-content" }, viewQueries: [{ propertyName: "_calendar", first: true, predicate: MtxCalendar, descendants: true, static: true }], ngImport: i0, template: "<div cdkTrapFocus\n role=\"dialog\"\n [attr.aria-modal]=\"true\"\n [attr.aria-labelledby]=\"_dialogLabelId ?? undefined\"\n [attr.mode]=\"datetimepicker.mode\"\n class=\"mtx-datetimepicker-content-container\"\n [class.mtx-datetimepicker-content-container-with-custom-header]=\"datetimepicker.calendarHeaderComponent\"\n [class.mtx-datetimepicker-content-container-with-actions]=\"_actionsPortal\"\n [class.mtx-datetimepicker-content-container-with-time-input]=\"datetimepicker.timeInput\">\n <mtx-calendar [id]=\"datetimepicker.id\"\n [class]=\"datetimepicker.panelClass\"\n [attr.mode]=\"datetimepicker.mode\"\n [type]=\"datetimepicker.type\"\n [startAt]=\"datetimepicker.startAt\"\n [startView]=\"datetimepicker.startView\"\n [maxDate]=\"datetimepicker._maxDate\"\n [minDate]=\"datetimepicker._minDate\"\n [dateFilter]=\"datetimepicker._dateFilter\"\n [multiYearSelector]=\"datetimepicker.multiYearSelector\"\n [preventSameDateTimeSelection]=\"datetimepicker.preventSameDateTimeSelection\"\n [headerComponent]=\"datetimepicker.calendarHeaderComponent\"\n [timeInterval]=\"datetimepicker.timeInterval\"\n [twelvehour]=\"datetimepicker.twelvehour\"\n [selected]=\"datetimepicker._selected\"\n [timeInput]=\"datetimepicker.timeInput\"\n [actionsPortal]=\"_actionsPortal\"\n (selectedChange)=\"datetimepicker._select($event)\"\n (viewChanged)=\"datetimepicker._viewChanged($event)\"\n (viewChanged)=\"_viewChanged($event)\"\n (_userSelection)=\"_handleUserSelection()\"\n [@fadeInCalendar]=\"'enter'\">\n </mtx-calendar>\n\n <ng-template [cdkPortalOutlet]=\"_actionsPortal\"></ng-template>\n</div>\n", styles: [".mtx-datetimepicker-content{display:block;border-radius:var(--mtx-datetimepicker-container-shape, var(--mat-app-corner-large));background-color:var(--mtx-datetimepicker-container-background-color, var(--mat-app-surface-container-high));box-shadow:var(--mtx-datetimepicker-container-elevation-shadow);color:var(--mtx-datetimepicker-container-text-color, var(--mat-app-on-surface))}.mtx-datetimepicker-content .mtx-calendar{width:296px;height:424px}.mtx-datetimepicker-content .mtx-calendar.mtx-calendar-with-time-input{height:490px}.mtx-datetimepicker-content .mtx-datetimepicker-content-container-with-actions .mtx-calendar.mtx-calendar-with-time-input{height:442px}.mtx-datetimepicker-content-container{display:flex;flex-direction:column;justify-content:space-between}.mtx-datetimepicker-content[mode=landscape] .mtx-calendar{width:432px;height:328px}.mtx-datetimepicker-content[mode=landscape] .mtx-calendar.mtx-calendar-with-time-input{height:404px}.mtx-datetimepicker-content[mode=landscape] .mtx-datetimepicker-content-container-with-actions .mtx-calendar.mtx-calendar-with-time-input{height:356px}@media all and (orientation: landscape){.mtx-datetimepicker-content[mode=auto] .mtx-calendar{width:432px;height:328px}.mtx-datetimepicker-content[mode=auto] .mtx-calendar.mtx-calendar-with-time-input{height:404px}.mtx-datetimepicker-content[mode=auto] .mtx-datetimepicker-content-container-with-actions .mtx-calendar.mtx-calendar-with-time-input{height:356px}}.mtx-datetimepicker-content-touch{display:block;max-height:84vh;box-shadow:var(--mtx-datetimepicker-container-touch-elevation-shadow);border-radius:var(--mtx-datetimepicker-container-touch-shape, var(--mat-app-corner-extra-large));position:relative;overflow:visible}.mtx-datetimepicker-content-touch .mtx-datetimepicker-content-container{min-height:300px;max-height:850px;min-width:250px;max-width:750px}.mtx-datetimepicker-content-touch .mtx-calendar{width:100%;height:auto}.mtx-datetimepicker-content-touch .mtx-clock{width:50vh;max-width:80%;margin:12px auto}@media all and (orientation: landscape){.mtx-datetimepicker-content-touch .mtx-datetimepicker-content-container[mode=auto],.mtx-datetimepicker-content-touch .mtx-datetimepicker-content-container[mode=landscape]{width:120vh;height:80vh}.mtx-datetimepicker-content-touch .mtx-datetimepicker-content-container[mode=auto] .mtx-calendar,.mtx-datetimepicker-content-touch .mtx-datetimepicker-content-container[mode=auto].mtx-datetimepicker-content-container-with-actions .mtx-calendar.mtx-calendar-with-time-input,.mtx-datetimepicker-content-touch .mtx-datetimepicker-content-container[mode=landscape] .mtx-calendar,.mtx-datetimepicker-content-touch .mtx-datetimepicker-content-container[mode=landscape].mtx-datetimepicker-content-container-with-actions .mtx-calendar.mtx-calendar-with-time-input{width:auto;height:100%}.mtx-datetimepicker-content-touch .mtx-datetimepicker-content-container[mode=portrait]{width:64vh;height:80vh}.mtx-datetimepicker-content-touch .mtx-datetimepicker-content-container[mode=portrait] .mtx-calendar{width:100%;height:auto}}@media all and (orientation: portrait){.mtx-datetimepicker-content-touch .mtx-datetimepicker-content-container[mode=auto],.mtx-datetimepicker-content-touch .mtx-datetimepicker-content-container[mode=portrait]{width:80vw;height:120vw}.mtx-datetimepicker-content-touch .mtx-datetimepicker-content-container[mode=auto] .mtx-calendar,.mtx-datetimepicker-content-touch .mtx-datetimepicker-content-container[mode=portrait] .mtx-calendar{width:100%;height:auto}.mtx-datetimepicker-content-touch .mtx-datetimepicker-content-container[mode=auto].mtx-datetimepicker-content-container-with-actions,.mtx-datetimepicker-content-touch .mtx-datetimepicker-content-container[mode=auto].mtx-datetimepicker-content-container-with-time-input,.mtx-datetimepicker-content-touch .mtx-datetimepicker-content-container[mode=portrait].mtx-datetimepicker-content-container-with-actions,.mtx-datetimepicker-content-touch .mtx-datetimepicker-content-container[mode=portrait].mtx-datetimepicker-content-container-with-time-input{height:124vw}.mtx-datetimepicker-content-touch .mtx-datetimepicker-content-container[mode=landscape]{width:90vw;height:64vw}.mtx-datetimepicker-content-touch .mtx-datetimepicker-content-container[mode=landscape] .mtx-calendar{width:auto;height:100%}}\n"], dependencies: [{ kind: "component", type: MtxCalendar, selector: "mtx-calendar", inputs: ["multiYearSelector", "twelvehour", "startView", "timeInterval", "dateFilter", "preventSameDateTimeSelection", "headerComponent", "actionsPortal", "type", "startAt", "timeInput", "selected", "minDate", "maxDate"], outputs: ["selectedChange", "viewChanged", "_userSelection"], exportAs: ["mtxCalendar"] }, { kind: "directive", type: CdkPortalOutlet, selector: "[cdkPortalOutlet]", inputs: ["cdkPortalOutlet"], outputs: ["attached"], exportAs: ["cdkPortalOutlet"] }], animations: [
mtxDatetimepickerAnimations.transformPanel,
mtxDatetimepickerAnimations.fadeInCalendar,
], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: MtxDatetimepickerContent, decorators: [{
type: Component,
args: [{ selector: 'mtx-datetimepicker-content', host: {
'class': 'mtx-datetimepicker-content',
'[class]': 'color ? "mat-" + color : ""',
'[class.mtx-datetimepicker-content-touch]': 'datetimepicker?.touchUi',
'[attr.mode]': 'datetimepicker.mode',
'[@transformPanel]': '_animationState',
'(@transformPanel.done)': '_animationDone.next()',
}, animations: [
mtxDatetimepickerAnimations.transformPanel,
mtxDatetimepickerAnimations.fadeInCalendar,
], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [MtxCalendar, CdkPortalOutlet], template: "<div cdkTrapFocus\n role=\"dialog\"\n [attr.aria-modal]=\"true\"\n [attr.aria-labelledby]=\"_dialogLabelId ?? undefined\"\n [attr.mode]=\"datetimepicker.mode\"\n class=\"mtx-datetimepicker-content-container\"\n [class.mtx-datetimepicker-content-container-with-custom-header]=\"datetimepicker.calendarHeaderComponent\"\n [class.mtx-datetimepicker-content-container-with-actions]=\"_actionsPortal\"\n [class.mtx-datetimepicker-content-container-with-time-input]=\"datetimepicker.timeInput\">\n <mtx-calendar [id]=\"datetimepicker.id\"\n [class]=\"datetimepicker.panelClass\"\n [attr.mode]=\"datetimepicker.mode\"\n [type]=\"datetimepicker.type\"\n [startAt]=\"datetimepicker.startAt\"\n [startView]=\"datetimepicker.startView\"\n [maxDate]=\"datetimepicker._maxDate\"\n [minDate]=\"datetimepicker._minDate\"\n [dateFilter]=\"datetimepicker._dateFilter\"\n [multiYearSelector]=\"datetimepicker.multiYearSelector\"\n [preventSameDateTimeSelection]=\"datetimepicker.preventSameDateTimeSelection\"\n [headerComponent]=\"datetimepicker.calendarHeaderComponent\"\n [timeInterval]=\"datetimepicker.timeInterval\"\n [twelvehour]=\"datetimepicker.twelvehour\"\n [selected]=\"datetimepicker._selected\"\n [timeInput]=\"datetimepicker.timeInput\"\n [actionsPortal]=\"_actionsPortal\"\n (selectedChange)=\"datetimepicker._select($event)\"\n (viewChanged)=\"datetimepicker._viewChanged($event)\"\n (viewChanged)=\"_viewChanged($event)\"\n (_userSelection)=\"_handleUserSelection()\"\n [@fadeInCalendar]=\"'enter'\">\n </mtx-calendar>\n\n <ng-template [cdkPortalOutlet]=\"_actionsPortal\"></ng-template>\n</div>\n", styles: [".mtx-datetimepicker-content{display:block;border-radius:var(--mtx-datetimepicker-container-shape, var(--mat-app-corner-large));background-color:var(--mtx-datetimepicker-container-background-color, var(--mat-app-surface-container-high));box-shadow:var(--mtx-datetimepicker-container-elevation-shadow);color:var(--mtx-datetimepicker-container-text-color, var(--mat-app-on-surface))}.mtx-datetimepicker-content .mtx-calendar{width:296px;height:424px}.mtx-datetimepicker-content .mtx-calendar.mtx-calendar-with-time-input{height:490px}.mtx-datetimepicker-content .mtx-datetimepicker-content-container-with-actions .mtx-calendar.mtx-calendar-with-time-input{height:442px}.mtx-datetimepicker-content-container{display:flex;flex-direction:column;justify-content:space-between}.mtx-datetimepicker-content[mode=landscape] .mtx-calendar{width:432px;height:328px}.mtx-datetimepicker-content[mode=landscape] .mtx-calendar.mtx-calendar-with-time-input{height:404px}.mtx-datetimepicker-content[mode=landscape] .mtx-datetimepicker-content-container-with-actions .mtx-calendar.mtx-calendar-with-time-input{height:356px}@media all and (orientation: landscape){.mtx-datetimepicker-content[mode=auto] .mtx-calendar{width:432px;height:328px}.mtx-datetimepicker-content[mode=auto] .mtx-calendar.mtx-calendar-with-time-input{height:404px}.mtx-datetimepicker-content[mode=auto] .mtx-datetimepicker-content-container-with-actions .mtx-calendar.mtx-calendar-with-time-input{height:356px}}.mtx-datetimepicker-content-touch{display:block;max-height:84vh;box-shadow:var(--mtx-datetimepicker-container-touch-elevation-shadow);border-radius:var(--mtx-datetimepicker-container-touch-shape, var(--mat-app-corner-extra-large));position:relative;overflow:visible}.mtx-datetimepicker-content-touch .mtx-datetimepicker-content-container{min-height:300px;max-height:850px;min-width:250px;max-width:750px}.mtx-datetimepicker-content-touch .mtx-calendar{width:100%;height:auto}.mtx-datetimepicker-content-touch .mtx-clock{width:50vh;max-width:80%;margin:12px auto}@media all and (orientation: landscape){.mtx-datetimepicker-content-touch .mtx-datetimepicker-content-container[mode=auto],.mtx-datetimepicker-content-touch .mtx-datetimepicker-content-container[mode=landscape]{width:120vh;height:80vh}.mtx-datetimepicker-content-touch .mtx-datetimepicker-content-container[mode=auto] .mtx-calendar,.mtx-datetimepicker-content-touch .mtx-datetimepicker-content-container[mode=auto].mtx-datetimepicker-content-container-with-actions .mtx-calendar.mtx-calendar-with-time-input,.mtx-datetimepicker-content-touch .mtx-datetimepicker-content-container[mode=landscape] .mtx-calendar,.mtx-datetimepicker-content-touch .mtx-datetimepicker-content-container[mode=landscape].mtx-datetimepicker-content-container-with-actions .mtx-calendar.mtx-calendar-with-time-input{width:auto;height:100%}.mtx-datetimepicker-content-touch .mtx-datetimepicker-content-container[mode=portrait]{width:64vh;height:80vh}.mtx-datetimepicker-content-touch .mtx-datetimepicker-content-container[mode=portrait] .mtx-calendar{width:100%;height:auto}}@media all and (orientation: portrait){.mtx-datetimepicker-content-touch .mtx-datetimepicker-content-container[mode=auto],.mtx-datetimepicker-content-touch .mtx-datetimepicker-content-container[mode=portrait]{width:80vw;height:120vw}.mtx-datetimepicker-content-touch .mtx-datetimepicker-content-container[mode=auto] .mtx-calendar,.mtx-datetimepicker-content-touch .mtx-datetimepicker-content-container[mode=portrait] .mtx-calendar{width:100%;height:auto}.mtx-datetimepicker-content-touch .mtx-datetimepicker-content-container[mode=auto].mtx-datetimepicker-content-container-with-actions,.mtx-datetimepicker-content-touch .mtx-datetimepicker-content-container[mode=auto].mtx-datetimepicker-content-container-with-time-input,.mtx-datetimepicker-content-touch .mtx-datetimepicker-content-container[mode=portrait].mtx-datetimepicker-content-container-with-actions,.mtx-datetimepicker-content-touch .mtx-datetimepicker-content-container[mode=portrait].mtx-datetimepicker-content-container-with-time-input{height:124vw}.mtx-datetimepicker-content-touch .mtx-datetimepicker-content-container[mode=landscape]{width:90vw;height:64vw}.mtx-datetimepicker-content-touch .mtx-datetimepicker-content-container[mode=landscape] .mtx-calendar{width:auto;height:100%}}\n"] }]
}], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { _calendar: [{
type: ViewChild,
args: [MtxCalendar, { static: true }]
}], color: [{
type: Input
}] } });
export class MtxDatetimepicker {
/** Classes to be passed to the date picker panel. */
get panelClass() {
return this._panelClass;
}
set panelClass(value) {
this._panelClass = coerceStringArray(value);
}
/** Whether the calendar is open. */
get opened() {
return this._opened;
}
set opened(value) {
value ? this.open() : this.close();
}
/** Color palette to use on the datetimepicker's calendar. */
get color() {
return (this._color ||
(this.datetimepickerInput ? this.datetimepickerInput.getThemePalette() : undefined));
}
set color(value) {
this._color = value;
}
constructor(_overlay, _viewContainerRef, _scrollStrategy, _dateAdapter, _dir) {
this._overlay = _overlay;
this._viewContainerRef = _viewContainerRef;
this._scrollStrategy = _scrollStrategy;
this._dateAdapter = _dateAdapter;
this._dir = _dir;
this._document = inject(DOCUMENT);
this._injector = inject(Injector);
/** Whether to show multi-year view. */
this.multiYearSelector = false;
/** Whether the clock uses 12 hour format. */
this.twelvehour = false;
/** The view that the calendar should start in. */
this.startView = 'month';
/** The display mode of datetimepicker. */
this.mode = 'auto';
/** Step over minutes. */
this.timeInterval = 1;
/** Prevent user to select same date time */
this.preventSameDateTimeSelection = false;
/**
* Emits new selected date when selected date changes.
* @deprecated Switch to the `dateChange` and `dateInput` binding on the input element.
*/
this.selectedChanged = new EventEmitter();
/** Emits when the datetimepicker has been opened. */
this.openedStream = new EventEmitter();
/** Emits when the datetimepicker has been closed. */
this.closedStream = new EventEmitter();
/** Emits when the view has been changed. */
this.viewChanged = new EventEmitter();
this._opened = false;
/** The id for the datetimepicker calendar. */
this.id = `mtx-datetimepicker-${datetimepickerUid++}`;
/** Emits when the datetimepicker is disabled. */
this._disabledChange = new Subject();
this._validSelected = null;
/** The element that was focused before the datetimepicker was opened. */
this._focusedElementBeforeOpen = null;
/** Unique class that will be added to the backdrop so that the test harnesses can look it up. */
this._backdropHarnessClass = `${this.id}-backdrop`;
this._inputStateChanges = Subscription.EMPTY;
/** Portal with projected action buttons. */
this._actionsPortal = null;
/** Previous selected value. */
this.oldValue = null;
this._type = 'datetime';
/**
* Whether the calendar UI is in touch mode. In touch mode the calendar opens in a dialog rather
* than a popup and elements have more padding to allow for bigger touch targets.
*/
this.touchUi = false;
/**
* Whether the calendar is in time mode. In time mode the calendar clock gets time input
* elements rather then just clock. When `touchUi` is enabled this will be disabled.
*/
this.timeInput = false;
/** Preferred position of the datetimepicker in the X axis. */
this.xPosition = 'start';
/** Preferred position of the datetimepicker in the Y axis. */
this.yPosition = 'below';
/**
* Whether to restore focus to the previously-focused element when the panel is closed.
* Note that automatic focus restoration is an accessibility feature and it is recommended that
* you provide your own equivalent, if you decide to turn it off.
*/
this.restoreFocus = true;
if (!this._dateAdapter) {
throw createMissingDateImplError('DateAdapter');
}
}
/** The date to open the calendar to initially. */
get startAt() {
// If an explicit startAt is set we start there, otherwise we start at whatever the currently
// selected value is.
return this._startAt || (this.datetimepickerInput ? this.datetimepickerInput.value : null);
}
set startAt(date) {
this._startAt = this._dateAdapter.getValidDateOrNull(date);
}
/** The display type of datetimepicker. */
get type() {
return this._type;
}
set type(value) {
this._type = value || 'datetime';
}
/** Whether the datetimepicker pop-up should be disabled. */
get disabled() {
return this._disabled === undefined && this.datetimepickerInput
? this.datetimepickerInput.disabled
: !!this._disabled;
}
set disabled(value) {
if (value !== this._disabled) {
this._disabled = value;
this._disabledChange.next(value);
}
}
/** The currently selected date. */
get _selected() {
return this._validSelected;
}
set _selected(value) {
this._validSelected = value;
}
/** The minimum selectable date. */
get _minDate() {
return this.datetimepickerInput && this.datetimepickerInput.min;
}
/** The maximum selectable date. */
get _maxDate() {
return this.datetimepickerInput && this.datetimepickerInput.max;
}
get _dateFilter() {
return this.datetimepickerInput && this.datetimepickerInput._dateFilter;
}
_viewChanged(view) {
this.viewChanged.emit(view);
}
ngOnDestroy() {
this._destroyOverlay();
this.close();
this._inputStateChanges.unsubscribe();
this._disabledChange.complete();
}
/** Selects the given date */
_select(date) {
this.oldValue = this._selected;
this._selected = date;
if (!this._actionsPortal) {
if (!this._dateAdapter.sameDatetime(this.oldValue, this._selected)) {
this.selectedChanged.emit(date);
}
}
}
_selectManually() {
if (!this._selected) {
this._selected = this._dateAdapter.today();
this.selectedChanged.emit(this._selected);
}
else if (!this._dateAdapter.sameDatetime(this.oldValue, this._selected)) {
this.selectedChanged.emit(this._selected || this.oldValue);
}
this.close();
}
_clearSelected() {
this.oldValue = null;
this._selected = null;
this.selectedChanged.emit();
this.close();
}
/**
* Register an input with this datetimepicker.
* @param input The datetimepicker input to register with this datetimepicker.
*/
_registerInput(input) {
if (this.datetimepickerInput) {
throw Error('A MtxDatetimepicker can only be associated with a single input.');
}
this.datetimepickerInput = input;
this._inputStateChanges = this.datetimepickerInput._valueChange.subscribe((value) => (this._selected = value));
}
/** Open the calendar. */
open() {
if (this._opened || this.disabled) {
return;
}
if (!this.datetimepickerInput) {
throw Error('Attempted to open an MtxDatetimepicker with no associated input.');
}
this._focusedElementBeforeOpen = _getFocusedElementPierceShadowDom();
this._openOverlay();
this._opened = true;
this.openedStream.emit();
}
/** Close the calendar. */
close() {
if (!this._opened) {
return;
}
const canRestoreFocus = this.restoreFocus &&
this._focusedElementBeforeOpen &&
typeof this._focusedElementBeforeOpen.focus === 'function';
const completeClose = () => {
// The `_opened` could've been reset already if
// we got two events in quick succession.
if (this._opened) {
this._opened = false;
this.closedStream.emit();
}
};
if (this._componentRef) {
const { instance, location } = this._componentRef;
instance._startExitAnimation();
instance._animationDone.pipe(take(1)).subscribe(() => {
const activeElement = this._document.activeElement;
// Since we restore focus after the exit animation, we have to check that
// the user didn't move focus themselves inside the `close` handler.
if (canRestoreFocus &&
(!activeElement ||
activeElement === this._document.activeElement ||
location.nativeElement.contains(activeElement))) {
this._focusedElementBeforeOpen.focus();
}
this._focusedElementBeforeOpen = null;
this._destroyOverlay();
});
}
if (canRestoreFocus) {
// Because IE moves focus asynchronously, we can't count on it being restored before we've
// marked the datetimepicker as closed. If the event fires out of sequence and the element that
// we're refocusing opens the datetimepicker on focus, the user could be stuck with not being
// able to close the calendar at all. We work around it by making the logic, that marks
// the datetimepicker as closed, async as well.
setTimeout(completeClose);
}
else {
completeClose();
}
}
/**
* Forwards relevant values from the datetimepicker to the
* datetimepicker content inside the overlay.
*/
_forwardContentValues(instance) {
instance.datetimepicker = this;
instance.color = this.color;
instance._dialogLabelId = this.datetimepickerInput.getOverlayLabelId();
instance.type = this.type;
instance.view = this.startView;
instance._assignActions(this._actionsPortal, false);
}
/** Opens the overlay with the calendar. */
_openOverlay() {
this._destroyOverlay();
const isDialog = this.touchUi;
const labelId = this.datetimepickerInput.getOverlayLabelId();
const portal = new ComponentPortal(MtxDatetimepickerContent, this._viewContainerRef);
const overlayRef = (this._overlayRef = this._overlay.create(new OverlayConfig({
positionStrategy: isDialog ? this._getDialogStrategy() : this._getDropdownStrategy(),
hasBackdrop: true,
backdropClass: [
isDialog ? 'cdk-overlay-dark-backdrop' : 'mat-overlay-transparent-backdrop',
this._backdropHarnessClass,
],
direction: this._dir,
scrollStrategy: isDialog ? this._overlay.scrollStrategies.block() : this._scrollStrategy(),
panelClass: `mtx-datetimepicker-${isDialog ? 'dialog' : 'popup'}`,
})));
const overlayElement = overlayRef.overlayElement;
overlayElement.setAttribute('role', 'dialog');
if (labelId) {
overlayElement.setAttribute('aria-labelledby', labelId);
}
if (isDialog) {
overlayElement.setAttribute('aria-modal', 'true');
}
this._getCloseStream(overlayRef).subscribe(event => {
if (event) {
event.preventDefault();
}
this.close();
});
this._componentRef = overlayRef.attach(portal);
this._forwardContentValues(this._componentRef.instance);
// Update the position once the calendar has rendered. Only relevant in dropdown mode.
if (!isDialog) {
afterNextRender(() => {
overlayRef.updatePosition();
}, { injector: this._injector });
}
}
/** Destroys the current overlay. */
_destroyOverlay() {
if (this._overlayRef) {
this._overlayRef.dispose();
this._overlayRef = this._componentRef = null;
}
}
/** Gets a position strategy that will open the calendar as a dropdown. */
_getDialogStrategy() {
return this._overlay.position().global().centerHorizontally().centerVertically();
}
/** Gets a position strategy that will open the calendar as a dropdown. */
_getDropdownStrategy() {
const strategy = this._overlay
.position()
.flexibleConnectedTo(this.datetimepickerInput.getConnectedOverlayOrigin())
.withTransformOriginOn('.mtx-datetimepicker-content')
.withFlexibleDimensions(false)
.withViewportMargin(8)
.withLockedPosition();
return this._setConnectedPositions(strategy);
}
/**
* Sets the positions of the datetimepicker in dropdown mode based on the current configuration.
*/
_setConnectedPositions(strategy) {
const primaryX = this.xPosition === 'end' ? 'end' : 'start';
const secondaryX = primaryX === 'start' ? 'end' : 'start';
const primaryY = this.yPosition === 'above' ? 'bottom' : 'top';
const secondaryY = primaryY === 'top' ? 'bottom' : 'top';
return strategy.withPositions([
{
originX: primaryX,
originY: secondaryY,
overlayX: primaryX,
overlayY: primaryY,
},
{
originX: primaryX,
originY: primaryY,
overlayX: primaryX,
overlayY: secondaryY,
},
{
originX: secondaryX,
originY: secondaryY,
overlayX: secondaryX,
overlayY: primaryY,
},
{
originX: secondaryX,
originY: primaryY,
overlayX: secondaryX,
overlayY: secondaryY,
},
]);
}
/** Gets an observable that will emit when the overlay is supposed to be closed. */
_getCloseStream(overlayRef) {
return merge(overlayRef.backdropClick(), overlayRef.detachments(), overlayRef.keydownEvents().pipe(filter(event => {
// Closing on alt + up is only valid when there's an input associated with the
// datetimepicker.
return ((event.keyCode === ESCAPE && !hasModifierKey(event)) ||
(this.datetimepickerInput &&
hasModifierKey(event, 'altKey') &&
event.keyCode === UP_ARROW));
})));
}
/**
* Registers a portal containing action buttons with the datetimepicker.
* @param portal Portal to be registered.
*/
registerActions(portal) {
if (this._actionsPortal) {
throw Error('A MtxDatetimepicker can only be associated with a single actions row.');
}
this._actionsPortal = portal;
this._componentRef?.instance._assignActions(portal, true);
}
/**
* Removes a portal containing action buttons from the datetimepicker.
* @param portal Portal to be removed.
*/
removeActions(portal) {
if (portal === this._actionsPortal) {
this._actionsPortal = null;
this._componentRef?.instance._assignActions(null, true);
}
}
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: MtxDatetimepicker, deps: [{ token: i1.Overlay }, { token: i0.ViewContainerRef }, { token: MTX_DATETIMEPICKER_SCROLL_STRATEGY }, { token: i2.DatetimeAdapter, optional: true }, { token: i3.Directionality, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "18.2.0", type: MtxDatetimepicker, isStandalone: true, selector: "mtx-datetimepicker", inputs: { multiYearSelector: ["multiYearSelector", "multiYearSelector", booleanAttribute], twelvehour: ["twelvehour", "twelvehour", booleanAttribute], startView: "startView", mode: "mode", timeInterval: "timeInterval", preventSameDateTimeSelection: ["preventSameDateTimeSelection", "preventSameDateTimeSelection", booleanAttribute], calendarHeaderComponent: "calendarHeaderComponent", panelClass: "panelClass", opened: ["opened", "opened", booleanAttribute], color: "color", startAt: "startAt", type: "type", touchUi: ["touchUi", "touchUi", booleanAttribute], timeInput: ["timeInput", "timeInput", booleanAttribute], disabled: ["disabled", "disabled", booleanAttribute], xPosition: "xPosition", yPosition: "yPosition", restoreFocus: ["restoreFocus", "restoreFocus", booleanAttribute] }, outputs: { selectedChanged: "selectedChanged", openedStream: "opened", closedStream: "closed", viewChanged: "viewChanged" }, exportAs: ["mtxDatetimepicker"], ngImport: i0, template: '', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: MtxDatetimepicker, decorators: [{
type: Component,
args: [{
selector: 'mtx-datetimepicker',
exportAs: 'mtxDatetimepicker',
template: '',
changeDetection: ChangeDetectionStrategy.OnPush,
encapsulation: ViewEncapsulation.None,
preserveWhitespaces: false,
standalone: true,
}]
}], ctorParameters: () => [{ type: i1.Overlay }, { type: i0.ViewContainerRef }, { type: undefined, decorators: [{
type: Inject,
args: [MTX_DATETIMEPICKER_SCROLL_STRATEGY]
}] }, { type: i2.DatetimeAdapter, decorators: [{
type: Optional
}] }, { type: i3.Directionality, decorators: [{
type: Optional
}] }], propDecorators: { multiYearSelector: [{
type: Input,
args: [{ transform: booleanAttribute }]
}], twelvehour: [{
type: Input,
args: [{ transform: booleanAttribute }]
}], startView: [{
type: Input
}], mode: [{
type: Input
}], timeInterval: [{
type: Input
}], preventSameDateTimeSelection: [{
type: Input,
args: [{ transform: booleanAttribute }]
}], calendarHeaderComponent: [{
type: Input
}], selectedChanged: [{
type: Output
}], openedStream: [{
type: Output,
args: ['opened']
}], closedStream: [{
type: Output,
args: ['closed']
}], viewChanged: [{
type: Output
}], panelClass: [{
type: Input
}], opened: [{
type: Input,
args: [{ transform: booleanAttribute }]
}], color: [{
type: Input
}], startAt: [{
type: Input
}], type: [{
type: Input
}], touchUi: [{
type: Input,
args: [{ transform: booleanAttribute }]
}], timeInput: [{
type: Input,
args: [{ transform: booleanAttribute }]
}], disabled: [{
type: Input,
args: [{ transform: booleanAttribute }]
}], xPosition: [{
type: Input
}], yPosition: [{
type: Input
}], restoreFocus: [{
type: Input,
args: [{ transform: booleanAttribute }]
}] } });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZGF0ZXRpbWVwaWNrZXIuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi9wcm9qZWN0cy9leHRlbnNpb25zL2RhdGV0aW1lcGlja2VyL2RhdGV0aW1lcGlja2VyLnRzIiwiLi4vLi4vLi4vLi4vcHJvamVjdHMvZXh0ZW5zaW9ucy9kYXRldGltZXBpY2tlci9kYXRldGltZXBpY2tlci1jb250ZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQ0EsT0FBTyxFQUFFLGlCQUFpQixFQUFFLE1BQU0sdUJBQXVCLENBQUM7QUFDMUQsT0FBTyxFQUFFLE1BQU0sRUFBRSxjQUFjLEVBQUUsUUFBUSxFQUFFLE1BQU0sdUJBQXVCLENBQUM7QUFDekUsT0FBTyxFQUVMLE9BQU8sRUFDUCxhQUFhLEdBR2QsTUFBTSxzQkFBc0IsQ0FBQztBQUM5QixPQUFPLEVBQUUsaUNBQWlDLEVBQUUsTUFBTSx1QkFBdUIsQ0FBQztBQUMxRSxPQUFPLEVBQ0wsZUFBZSxFQUNmLGVBQWUsR0FHaEIsTUFBTSxxQkFBcUIsQ0FBQztBQUM3QixPQUFPLEVBQUUsUUFBUSxFQUFFLE1BQU0saUJBQWlCLENBQUM7QUFDM0MsT0FBTyxFQUVMLGVBQWUsRUFDZixnQkFBZ0IsRUFDaEIsdUJBQXVCLEVBRXZCLFNBQVMsRUFFVCxZQUFZLEVBQ1osTUFBTSxFQUNOLE1BQU0sRUFDTixjQUFjLEVBQ2QsUUFBUSxFQUNSLEtBQUssRUFHTCxRQUFRLEVBQ1IsTUFBTSxFQUNOLFNBQVMsRUFFVCxpQkFBaUIsR0FDbEIsTUFBTSxlQUFlLENBQUM7QUFFdkIsT0FBTyxFQUFFLEtBQUssRUFBRSxPQUFPLEVBQUUsWUFBWSxFQUFFLE1BQU0sTUFBTSxDQUFDO0FBQ3BELE9BQU8sRUFBRSxNQUFNLEVBQUUsSUFBSSxFQUFFLE1BQU0sZ0JBQWdCLENBQUM7QUFHOUMsT0FBTyxFQUFFLFdBQVcsRUFBRSxNQUFNLFlBQVksQ0FBQztBQUN6QyxPQUFPLEVBQUUsMkJBQTJCLEVBQUUs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