@ngx-mce/datetime-picker 21.2.0-next.1 → 21.2.0-next.3
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.
|
@@ -21,7 +21,6 @@ import * as i2$2 from '@angular/material/form-field';
|
|
|
21
21
|
import { MAT_FORM_FIELD, MatFormFieldControl, MatFormFieldModule, MatFormField } from '@angular/material/form-field';
|
|
22
22
|
import * as i5$1 from '@angular/cdk/overlay';
|
|
23
23
|
import { Overlay, FlexibleConnectedPositionStrategy, OverlayConfig } from '@angular/cdk/overlay';
|
|
24
|
-
import { trigger, state, style, transition, animate, keyframes } from '@angular/animations';
|
|
25
24
|
import * as i5 from '@angular/material/icon';
|
|
26
25
|
import { MatIconModule } from '@angular/material/icon';
|
|
27
26
|
import * as i3 from '@angular/material/input';
|
|
@@ -3466,33 +3465,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImpor
|
|
|
3466
3465
|
args: [NgxMatEndDate]
|
|
3467
3466
|
}] } });
|
|
3468
3467
|
|
|
3469
|
-
/**
|
|
3470
|
-
* Animations used by the Material datepicker.
|
|
3471
|
-
* @docs-private
|
|
3472
|
-
*/
|
|
3473
|
-
const ngxMatDatepickerAnimations = {
|
|
3474
|
-
/** Transforms the height of the datepicker's calendar. */
|
|
3475
|
-
transformPanel: trigger('transformPanel', [
|
|
3476
|
-
transition('void => enter-dropdown', animate('120ms cubic-bezier(0, 0, 0.2, 1)', keyframes([
|
|
3477
|
-
style({ opacity: 0, transform: 'scale(1, 0.8)' }),
|
|
3478
|
-
style({ opacity: 1, transform: 'scale(1, 1)' }),
|
|
3479
|
-
]))),
|
|
3480
|
-
transition('void => enter-dialog', animate('150ms cubic-bezier(0, 0, 0.2, 1)', keyframes([
|
|
3481
|
-
style({ opacity: 0, transform: 'scale(0.7)' }),
|
|
3482
|
-
style({ transform: 'none', opacity: 1 }),
|
|
3483
|
-
]))),
|
|
3484
|
-
transition('* => void', animate('100ms linear', style({ opacity: 0 }))),
|
|
3485
|
-
]),
|
|
3486
|
-
/** Fades in the content of the calendar. */
|
|
3487
|
-
fadeInCalendar: trigger('fadeInCalendar', [
|
|
3488
|
-
state('void', style({ opacity: 0 })),
|
|
3489
|
-
state('enter', style({ opacity: 1 })),
|
|
3490
|
-
// TODO(crisbeto): this animation should be removed since it isn't quite on spec, but we
|
|
3491
|
-
// need to keep it until #12440 gets in, otherwise the exit animation will look glitchy.
|
|
3492
|
-
transition('void => *', animate('120ms 100ms cubic-bezier(0.55, 0, 0.55, 0.2)')),
|
|
3493
|
-
]),
|
|
3494
|
-
};
|
|
3495
|
-
|
|
3496
3468
|
const LIMIT_TIMES = {
|
|
3497
3469
|
minHour: 0,
|
|
3498
3470
|
maxHour: 24,
|
|
@@ -3802,11 +3774,12 @@ class NgxMatDatepickerContent {
|
|
|
3802
3774
|
/** Whether the datepicker is above or below the input. */
|
|
3803
3775
|
_isAbove = false;
|
|
3804
3776
|
/** Current state of the animation. */
|
|
3805
|
-
|
|
3777
|
+
_isLeaving = false;
|
|
3778
|
+
_panelEnterClass = null;
|
|
3806
3779
|
/** Emits when an animation has finished. */
|
|
3807
3780
|
_animationDone = new Subject();
|
|
3808
3781
|
/** Whether there is an in-progress animation. */
|
|
3809
|
-
_isAnimating = false;
|
|
3782
|
+
_isAnimating = false; // used by parent to prevent overlapping
|
|
3810
3783
|
/** Text for the close button. */
|
|
3811
3784
|
_closeButtonText;
|
|
3812
3785
|
/** Whether the close button currently has focus. */
|
|
@@ -3825,6 +3798,16 @@ class NgxMatDatepickerContent {
|
|
|
3825
3798
|
get isWarn() {
|
|
3826
3799
|
return this.color === 'warn';
|
|
3827
3800
|
}
|
|
3801
|
+
// Host bindings for animation classes
|
|
3802
|
+
get isEnterDropdown() {
|
|
3803
|
+
return !this._isLeaving && this._panelEnterClass === 'enter-dropdown';
|
|
3804
|
+
}
|
|
3805
|
+
get isEnterDialog() {
|
|
3806
|
+
return !this._isLeaving && this._panelEnterClass === 'enter-dialog';
|
|
3807
|
+
}
|
|
3808
|
+
get isLeavingClass() {
|
|
3809
|
+
return this._isLeaving;
|
|
3810
|
+
}
|
|
3828
3811
|
get isViewMonth() {
|
|
3829
3812
|
if (!this._calendar() || this._calendar().currentView == null)
|
|
3830
3813
|
return true;
|
|
@@ -3845,7 +3828,8 @@ class NgxMatDatepickerContent {
|
|
|
3845
3828
|
});
|
|
3846
3829
|
}
|
|
3847
3830
|
ngOnInit() {
|
|
3848
|
-
|
|
3831
|
+
// Set the appropriate enter class based on touchUI mode
|
|
3832
|
+
this._panelEnterClass = this.datepicker.touchUi ? 'enter-dialog' : 'enter-dropdown';
|
|
3849
3833
|
}
|
|
3850
3834
|
ngAfterViewInit() {
|
|
3851
3835
|
this._subscriptions.add(this.datepicker.stateChanges.subscribe(() => {
|
|
@@ -3898,12 +3882,14 @@ class NgxMatDatepickerContent {
|
|
|
3898
3882
|
this._model?.updateSelection(event.value, this);
|
|
3899
3883
|
}
|
|
3900
3884
|
_startExitAnimation() {
|
|
3901
|
-
this.
|
|
3885
|
+
this._isAnimating = true;
|
|
3886
|
+
this._isLeaving = true;
|
|
3902
3887
|
this._changeDetectorRef.markForCheck();
|
|
3903
3888
|
}
|
|
3904
|
-
|
|
3905
|
-
|
|
3906
|
-
if (
|
|
3889
|
+
_onAnimationEnd(event) {
|
|
3890
|
+
// When the leave animation finishes, emit that we're done
|
|
3891
|
+
if (event.animationName === 'panelLeave') {
|
|
3892
|
+
this._isAnimating = false;
|
|
3907
3893
|
this._animationDone.next();
|
|
3908
3894
|
}
|
|
3909
3895
|
}
|
|
@@ -3938,24 +3924,16 @@ class NgxMatDatepickerContent {
|
|
|
3938
3924
|
}
|
|
3939
3925
|
}
|
|
3940
3926
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: NgxMatDatepickerContent, deps: [{ token: i0.ChangeDetectorRef }, { token: NgxMatDateSelectionModel }, { token: i1.DateAdapter }, { token: NGX_MAT_DATE_RANGE_SELECTION_STRATEGY, optional: true }, { token: NgxMatDatepickerIntl }], target: i0.ɵɵFactoryTarget.Component });
|
|
3941
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.5", type: NgxMatDatepickerContent, isStandalone: true, selector: "ngx-mat-datepicker-content", inputs: { color: "color" }, host: { listeners: { "
|
|
3942
|
-
ngxMatDatepickerAnimations.transformPanel,
|
|
3943
|
-
ngxMatDatepickerAnimations.fadeInCalendar,
|
|
3944
|
-
], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
3927
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.5", 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 [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: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2$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 });
|
|
3945
3928
|
}
|
|
3946
3929
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImport: i0, type: NgxMatDatepickerContent, decorators: [{
|
|
3947
3930
|
type: Component,
|
|
3948
3931
|
args: [{ selector: 'ngx-mat-datepicker-content', host: {
|
|
3949
3932
|
class: 'mat-datepicker-content',
|
|
3950
|
-
'[@transformPanel]': '_animationState',
|
|
3951
|
-
'(@transformPanel.start)': '_handleAnimationEvent($event)',
|
|
3952
|
-
'(@transformPanel.done)': '_handleAnimationEvent($event)',
|
|
3953
3933
|
'[class.mat-datepicker-content-touch]': 'datepicker!.touchUi',
|
|
3954
3934
|
'[class.mat-datepicker-content-touch-with-time]': '!datepicker!.hideTime',
|
|
3955
|
-
|
|
3956
|
-
|
|
3957
|
-
ngxMatDatepickerAnimations.fadeInCalendar,
|
|
3958
|
-
], exportAs: 'ngxMatDatepickerContent', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, inputs: ['color'], imports: [
|
|
3935
|
+
'(animationend)': '_onAnimationEnd($event)' // listen for native animation end
|
|
3936
|
+
}, exportAs: 'ngxMatDatepickerContent', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, inputs: ['color'], imports: [
|
|
3959
3937
|
CdkTrapFocus,
|
|
3960
3938
|
NgxMatCalendar,
|
|
3961
3939
|
NgClass,
|
|
@@ -3964,7 +3942,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImpor
|
|
|
3964
3942
|
FormsModule,
|
|
3965
3943
|
CdkPortalOutlet,
|
|
3966
3944
|
MatButton,
|
|
3967
|
-
], 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 [
|
|
3945
|
+
], 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 [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"] }]
|
|
3968
3946
|
}], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: NgxMatDateSelectionModel }, { type: i1.DateAdapter }, { type: undefined, decorators: [{
|
|
3969
3947
|
type: Optional
|
|
3970
3948
|
}, {
|
|
@@ -3981,6 +3959,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.5", ngImpor
|
|
|
3981
3959
|
}], isWarn: [{
|
|
3982
3960
|
type: HostBinding,
|
|
3983
3961
|
args: ['class.mat-warn']
|
|
3962
|
+
}], isEnterDropdown: [{
|
|
3963
|
+
type: HostBinding,
|
|
3964
|
+
args: ['class.panel-enter-dropdown']
|
|
3965
|
+
}], isEnterDialog: [{
|
|
3966
|
+
type: HostBinding,
|
|
3967
|
+
args: ['class.panel-enter-dialog']
|
|
3968
|
+
}], isLeavingClass: [{
|
|
3969
|
+
type: HostBinding,
|
|
3970
|
+
args: ['class.panel-leave']
|
|
3984
3971
|
}] } });
|
|
3985
3972
|
/** Base class for a datepicker. */
|
|
3986
3973
|
class NgxMatDatepickerBase {
|