@dhutaryan/ngx-mat-timepicker 18.0.1 → 18.0.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.
- package/esm2022/lib/time-period.mjs +15 -13
- package/esm2022/lib/timepicker-intl.mjs +5 -1
- package/fesm2022/dhutaryan-ngx-mat-timepicker.mjs +22 -17
- package/fesm2022/dhutaryan-ngx-mat-timepicker.mjs.map +1 -1
- package/lib/time-period.d.ts +3 -0
- package/lib/timepicker-intl.d.ts +4 -0
- package/package.json +9 -8
- package/themes/m2/_theme.scss +1 -1
|
@@ -3,15 +3,10 @@ import { coerceBooleanProperty } from '@angular/cdk/coercion';
|
|
|
3
3
|
import { MatDividerModule } from '@angular/material/divider';
|
|
4
4
|
import { MatRippleModule } from '@angular/material/core';
|
|
5
5
|
import * as i0 from "@angular/core";
|
|
6
|
-
import * as i1 from "
|
|
7
|
-
import * as i2 from "@angular/material/
|
|
6
|
+
import * as i1 from "./timepicker-intl";
|
|
7
|
+
import * as i2 from "@angular/material/divider";
|
|
8
|
+
import * as i3 from "@angular/material/core";
|
|
8
9
|
export class MatTimePeriod {
|
|
9
|
-
constructor() {
|
|
10
|
-
this._vertical = true;
|
|
11
|
-
this._period = 'am';
|
|
12
|
-
this._disabledPeriod = null;
|
|
13
|
-
this.periodChanged = new EventEmitter();
|
|
14
|
-
}
|
|
15
10
|
/** Whether the time period is vertically aligned. */
|
|
16
11
|
get vertical() {
|
|
17
12
|
return this._vertical;
|
|
@@ -31,6 +26,13 @@ export class MatTimePeriod {
|
|
|
31
26
|
set disabledPeriod(value) {
|
|
32
27
|
this._disabledPeriod = value;
|
|
33
28
|
}
|
|
29
|
+
constructor(_intl) {
|
|
30
|
+
this._intl = _intl;
|
|
31
|
+
this._vertical = true;
|
|
32
|
+
this._period = 'am';
|
|
33
|
+
this._disabledPeriod = null;
|
|
34
|
+
this.periodChanged = new EventEmitter();
|
|
35
|
+
}
|
|
34
36
|
setPeriod(event, period) {
|
|
35
37
|
event.preventDefault();
|
|
36
38
|
this.period = period;
|
|
@@ -42,8 +44,8 @@ export class MatTimePeriod {
|
|
|
42
44
|
}
|
|
43
45
|
return this.disabledPeriod === period;
|
|
44
46
|
}
|
|
45
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.4", ngImport: i0, type: MatTimePeriod, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
46
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.4", type: MatTimePeriod, isStandalone: true, selector: "mat-time-period", inputs: { vertical: "vertical", period: "period", disabledPeriod: "disabledPeriod" }, outputs: { periodChanged: "periodChanged" }, host: { properties: { "class.mat-time-period-vertical": "vertical", "class.mat-time-period-horizontal": "!vertical", "attr.aria-orientation": "vertical ? \"vertical\" : \"horizontal\"" }, classAttribute: "mat-time-period" }, ngImport: i0, template: "<div\n tabindex=\"0\"\n class=\"mat-time-period-item\"\n matRipple\n [class.mat-time-period-item-active]=\"period === 'am'\"\n [class.mat-time-period-item-disabled]=\"_isPeriodDisabled('am')\"\n (click)=\"setPeriod($event,'am')\"\n (keydown.space)=\"setPeriod($event, 'am')\"\n>\n
|
|
47
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.4", ngImport: i0, type: MatTimePeriod, deps: [{ token: i1.MatTimepickerIntl }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
48
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.4", type: MatTimePeriod, isStandalone: true, selector: "mat-time-period", inputs: { vertical: "vertical", period: "period", disabledPeriod: "disabledPeriod" }, outputs: { periodChanged: "periodChanged" }, host: { properties: { "class.mat-time-period-vertical": "vertical", "class.mat-time-period-horizontal": "!vertical", "attr.aria-orientation": "vertical ? \"vertical\" : \"horizontal\"" }, classAttribute: "mat-time-period" }, ngImport: i0, template: "<div\n tabindex=\"0\"\n class=\"mat-time-period-item\"\n matRipple\n [class.mat-time-period-item-active]=\"period === 'am'\"\n [class.mat-time-period-item-disabled]=\"_isPeriodDisabled('am')\"\n (click)=\"setPeriod($event, 'am')\"\n (keydown.space)=\"setPeriod($event, 'am')\"\n>\n {{ _intl.am }}\n</div>\n<mat-divider [vertical]=\"!vertical\"></mat-divider>\n<div\n tabindex=\"0\"\n class=\"mat-time-period-item\"\n matRipple\n [class.mat-time-period-item-active]=\"period === 'pm'\"\n [class.mat-time-period-item-disabled]=\"_isPeriodDisabled('pm')\"\n (click)=\"setPeriod($event, 'pm')\"\n (keydown.space)=\"setPeriod($event, 'pm')\"\n>\n {{ _intl.pm }}\n</div>\n", styles: [".mat-time-period{display:flex;text-align:center;border-width:1px;border-style:solid;border-radius:.25rem;box-sizing:border-box}.mat-time-period-vertical{flex-direction:column;width:3.25rem;height:4.5rem}.mat-time-period-vertical .mat-time-period-item:first-child{border-top-left-radius:inherit;border-top-right-radius:inherit}.mat-time-period-vertical .mat-time-period-item:last-child{border-bottom-left-radius:inherit;border-bottom-right-radius:inherit}.mat-time-period-horizontal{flex-direction:row;max-width:13.5rem;width:100%;height:2.5rem}.mat-time-period-horizontal .mat-time-period-item:first-child{border-top-left-radius:inherit;border-bottom-left-radius:inherit}.mat-time-period-horizontal .mat-time-period-item:last-child{border-top-right-radius:inherit;border-bottom-right-radius:inherit}.mat-time-period-item{display:flex;flex-direction:column;justify-content:center;flex-grow:1;height:100%;font-size:.875rem;font-weight:500;cursor:pointer}.mat-time-period-item-disabled{pointer-events:none}\n"], dependencies: [{ kind: "ngmodule", type: MatDividerModule }, { kind: "component", type: i2.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { kind: "ngmodule", type: MatRippleModule }, { kind: "directive", type: i3.MatRipple, selector: "[mat-ripple], [matRipple]", inputs: ["matRippleColor", "matRippleUnbounded", "matRippleCentered", "matRippleRadius", "matRippleAnimation", "matRippleDisabled", "matRippleTrigger"], exportAs: ["matRipple"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
47
49
|
}
|
|
48
50
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.4", ngImport: i0, type: MatTimePeriod, decorators: [{
|
|
49
51
|
type: Component,
|
|
@@ -52,8 +54,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.4", ngImpor
|
|
|
52
54
|
'[class.mat-time-period-vertical]': 'vertical',
|
|
53
55
|
'[class.mat-time-period-horizontal]': '!vertical',
|
|
54
56
|
'[attr.aria-orientation]': 'vertical ? "vertical" : "horizontal"',
|
|
55
|
-
}, template: "<div\n tabindex=\"0\"\n class=\"mat-time-period-item\"\n matRipple\n [class.mat-time-period-item-active]=\"period === 'am'\"\n [class.mat-time-period-item-disabled]=\"_isPeriodDisabled('am')\"\n (click)=\"setPeriod($event,'am')\"\n (keydown.space)=\"setPeriod($event, 'am')\"\n>\n
|
|
56
|
-
}], propDecorators: { vertical: [{
|
|
57
|
+
}, template: "<div\n tabindex=\"0\"\n class=\"mat-time-period-item\"\n matRipple\n [class.mat-time-period-item-active]=\"period === 'am'\"\n [class.mat-time-period-item-disabled]=\"_isPeriodDisabled('am')\"\n (click)=\"setPeriod($event, 'am')\"\n (keydown.space)=\"setPeriod($event, 'am')\"\n>\n {{ _intl.am }}\n</div>\n<mat-divider [vertical]=\"!vertical\"></mat-divider>\n<div\n tabindex=\"0\"\n class=\"mat-time-period-item\"\n matRipple\n [class.mat-time-period-item-active]=\"period === 'pm'\"\n [class.mat-time-period-item-disabled]=\"_isPeriodDisabled('pm')\"\n (click)=\"setPeriod($event, 'pm')\"\n (keydown.space)=\"setPeriod($event, 'pm')\"\n>\n {{ _intl.pm }}\n</div>\n", styles: [".mat-time-period{display:flex;text-align:center;border-width:1px;border-style:solid;border-radius:.25rem;box-sizing:border-box}.mat-time-period-vertical{flex-direction:column;width:3.25rem;height:4.5rem}.mat-time-period-vertical .mat-time-period-item:first-child{border-top-left-radius:inherit;border-top-right-radius:inherit}.mat-time-period-vertical .mat-time-period-item:last-child{border-bottom-left-radius:inherit;border-bottom-right-radius:inherit}.mat-time-period-horizontal{flex-direction:row;max-width:13.5rem;width:100%;height:2.5rem}.mat-time-period-horizontal .mat-time-period-item:first-child{border-top-left-radius:inherit;border-bottom-left-radius:inherit}.mat-time-period-horizontal .mat-time-period-item:last-child{border-top-right-radius:inherit;border-bottom-right-radius:inherit}.mat-time-period-item{display:flex;flex-direction:column;justify-content:center;flex-grow:1;height:100%;font-size:.875rem;font-weight:500;cursor:pointer}.mat-time-period-item-disabled{pointer-events:none}\n"] }]
|
|
58
|
+
}], ctorParameters: () => [{ type: i1.MatTimepickerIntl }], propDecorators: { vertical: [{
|
|
57
59
|
type: Input
|
|
58
60
|
}], period: [{
|
|
59
61
|
type: Input
|
|
@@ -62,4 +64,4 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.4", ngImpor
|
|
|
62
64
|
}], periodChanged: [{
|
|
63
65
|
type: Output
|
|
64
66
|
}] } });
|
|
65
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
67
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidGltZS1wZXJpb2QuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi9wcm9qZWN0cy9tYXQtdGltZXBpY2tlci9zcmMvbGliL3RpbWUtcGVyaW9kLnRzIiwiLi4vLi4vLi4vLi4vcHJvamVjdHMvbWF0LXRpbWVwaWNrZXIvc3JjL2xpYi90aW1lLXBlcmlvZC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFDTCxTQUFTLEVBQ1QsdUJBQXVCLEVBQ3ZCLGlCQUFpQixFQUNqQixLQUFLLEVBQ0wsTUFBTSxFQUNOLFlBQVksR0FDYixNQUFNLGVBQWUsQ0FBQztBQUN2QixPQUFPLEVBQWdCLHFCQUFxQixFQUFFLE1BQU0sdUJBQXVCLENBQUM7QUFDNUUsT0FBTyxFQUFFLGdCQUFnQixFQUFFLE1BQU0sMkJBQTJCLENBQUM7QUFDN0QsT0FBTyxFQUFFLGVBQWUsRUFBRSxNQUFNLHdCQUF3QixDQUFDOzs7OztBQXFCekQsTUFBTSxPQUFPLGFBQWE7SUFDeEIscURBQXFEO0lBQ3JELElBQ0ksUUFBUTtRQUNWLE9BQU8sSUFBSSxDQUFDLFNBQVMsQ0FBQztJQUN4QixDQUFDO0lBQ0QsSUFBSSxRQUFRLENBQUMsS0FBbUI7UUFDOUIsSUFBSSxDQUFDLFNBQVMsR0FBRyxxQkFBcUIsQ0FBQyxLQUFLLENBQUMsQ0FBQztJQUNoRCxDQUFDO0lBR0QsSUFDSSxNQUFNO1FBQ1IsT0FBTyxJQUFJLENBQUMsT0FBTyxDQUFDO0lBQ3RCLENBQUM7SUFDRCxJQUFJLE1BQU0sQ0FBQyxLQUF3QjtRQUNqQyxJQUFJLENBQUMsT0FBTyxHQUFHLEtBQUssSUFBSSxJQUFJLENBQUM7SUFDL0IsQ0FBQztJQUdELElBQ0ksY0FBYztRQUNoQixPQUFPLElBQUksQ0FBQyxlQUFlLENBQUM7SUFDOUIsQ0FBQztJQUNELElBQUksY0FBYyxDQUFDLEtBQStCO1FBQ2hELElBQUksQ0FBQyxlQUFlLEdBQUcsS0FBSyxDQUFDO0lBQy9CLENBQUM7SUFLRCxZQUFtQixLQUF3QjtRQUF4QixVQUFLLEdBQUwsS0FBSyxDQUFtQjtRQXRCbkMsY0FBUyxHQUFZLElBQUksQ0FBQztRQVMxQixZQUFPLEdBQXNCLElBQUksQ0FBQztRQVNsQyxvQkFBZSxHQUE2QixJQUFJLENBQUM7UUFFL0Msa0JBQWEsR0FBRyxJQUFJLFlBQVksRUFBcUIsQ0FBQztJQUVsQixDQUFDO0lBRS9DLFNBQVMsQ0FBQyxLQUFZLEVBQUUsTUFBeUI7UUFDL0MsS0FBSyxDQUFDLGNBQWMsRUFBRSxDQUFDO1FBQ3ZCLElBQUksQ0FBQyxNQUFNLEdBQUcsTUFBTSxDQUFDO1FBQ3JCLElBQUksQ0FBQyxhQUFhLENBQUMsSUFBSSxDQUFDLE1BQU0sQ0FBQyxDQUFDO0lBQ2xDLENBQUM7SUFFRCxpQkFBaUIsQ0FBQyxNQUF5QjtRQUN6QyxJQUFJLENBQUMsSUFBSSxDQUFDLGNBQWMsRUFBRSxDQUFDO1lBQ3pCLE9BQU8sS0FBSyxDQUFDO1FBQ2YsQ0FBQztRQUVELE9BQU8sSUFBSSxDQUFDLGNBQWMsS0FBSyxNQUFNLENBQUM7SUFDeEMsQ0FBQzs4R0E3Q1UsYUFBYTtrR0FBYixhQUFhLCthQy9CMUIsNHFCQXVCQSxzaUNESlksZ0JBQWdCLGtJQUFFLGVBQWU7OzJGQVloQyxhQUFhO2tCQWZ6QixTQUFTOytCQUNFLGlCQUFpQixjQUNmLElBQUksV0FDUCxDQUFDLGdCQUFnQixFQUFFLGVBQWUsQ0FBQyxtQkFHM0IsdUJBQXVCLENBQUMsTUFBTSxpQkFDaEMsaUJBQWlCLENBQUMsSUFBSSxRQUMvQjt3QkFDSixLQUFLLEVBQUUsaUJBQWlCO3dCQUN4QixrQ0FBa0MsRUFBRSxVQUFVO3dCQUM5QyxvQ0FBb0MsRUFBRSxXQUFXO3dCQUNqRCx5QkFBeUIsRUFBRSxzQ0FBc0M7cUJBQ2xFO3NGQUtHLFFBQVE7c0JBRFgsS0FBSztnQkFVRixNQUFNO3NCQURULEtBQUs7Z0JBVUYsY0FBYztzQkFEakIsS0FBSztnQkFTSSxhQUFhO3NCQUF0QixNQUFNIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHtcbiAgQ29tcG9uZW50LFxuICBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneSxcbiAgVmlld0VuY2Fwc3VsYXRpb24sXG4gIElucHV0LFxuICBPdXRwdXQsXG4gIEV2ZW50RW1pdHRlcixcbn0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQgeyBCb29sZWFuSW5wdXQsIGNvZXJjZUJvb2xlYW5Qcm9wZXJ0eSB9IGZyb20gJ0Bhbmd1bGFyL2Nkay9jb2VyY2lvbic7XG5pbXBvcnQgeyBNYXREaXZpZGVyTW9kdWxlIH0gZnJvbSAnQGFuZ3VsYXIvbWF0ZXJpYWwvZGl2aWRlcic7XG5pbXBvcnQgeyBNYXRSaXBwbGVNb2R1bGUgfSBmcm9tICdAYW5ndWxhci9tYXRlcmlhbC9jb3JlJztcblxuaW1wb3J0IHsgTWF0VGltZXBpY2tlckludGwgfSBmcm9tICcuL3RpbWVwaWNrZXItaW50bCc7XG5cbmV4cG9ydCB0eXBlIE1hdFRpbWVQZXJpb2RUeXBlID0gJ2FtJyB8ICdwbSc7XG5cbkBDb21wb25lbnQoe1xuICBzZWxlY3RvcjogJ21hdC10aW1lLXBlcmlvZCcsXG4gIHN0YW5kYWxvbmU6IHRydWUsXG4gIGltcG9ydHM6IFtNYXREaXZpZGVyTW9kdWxlLCBNYXRSaXBwbGVNb2R1bGVdLFxuICB0ZW1wbGF0ZVVybDogJy4vdGltZS1wZXJpb2QuaHRtbCcsXG4gIHN0eWxlVXJsczogWycuL3RpbWUtcGVyaW9kLnNjc3MnXSxcbiAgY2hhbmdlRGV0ZWN0aW9uOiBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneS5PblB1c2gsXG4gIGVuY2Fwc3VsYXRpb246IFZpZXdFbmNhcHN1bGF0aW9uLk5vbmUsXG4gIGhvc3Q6IHtcbiAgICBjbGFzczogJ21hdC10aW1lLXBlcmlvZCcsXG4gICAgJ1tjbGFzcy5tYXQtdGltZS1wZXJpb2QtdmVydGljYWxdJzogJ3ZlcnRpY2FsJyxcbiAgICAnW2NsYXNzLm1hdC10aW1lLXBlcmlvZC1ob3Jpem9udGFsXSc6ICchdmVydGljYWwnLFxuICAgICdbYXR0ci5hcmlhLW9yaWVudGF0aW9uXSc6ICd2ZXJ0aWNhbCA/IFwidmVydGljYWxcIiA6IFwiaG9yaXpvbnRhbFwiJyxcbiAgfSxcbn0pXG5leHBvcnQgY2xhc3MgTWF0VGltZVBlcmlvZCB7XG4gIC8qKiBXaGV0aGVyIHRoZSB0aW1lIHBlcmlvZCBpcyB2ZXJ0aWNhbGx5IGFsaWduZWQuICovXG4gIEBJbnB1dCgpXG4gIGdldCB2ZXJ0aWNhbCgpOiBib29sZWFuIHtcbiAgICByZXR1cm4gdGhpcy5fdmVydGljYWw7XG4gIH1cbiAgc2V0IHZlcnRpY2FsKHZhbHVlOiBCb29sZWFuSW5wdXQpIHtcbiAgICB0aGlzLl92ZXJ0aWNhbCA9IGNvZXJjZUJvb2xlYW5Qcm9wZXJ0eSh2YWx1ZSk7XG4gIH1cbiAgcHJpdmF0ZSBfdmVydGljYWw6IGJvb2xlYW4gPSB0cnVlO1xuXG4gIEBJbnB1dCgpXG4gIGdldCBwZXJpb2QoKTogTWF0VGltZVBlcmlvZFR5cGUge1xuICAgIHJldHVybiB0aGlzLl9wZXJpb2Q7XG4gIH1cbiAgc2V0IHBlcmlvZCh2YWx1ZTogTWF0VGltZVBlcmlvZFR5cGUpIHtcbiAgICB0aGlzLl9wZXJpb2QgPSB2YWx1ZSB8fCAnYW0nO1xuICB9XG4gIHByaXZhdGUgX3BlcmlvZDogTWF0VGltZVBlcmlvZFR5cGUgPSAnYW0nO1xuXG4gIEBJbnB1dCgpXG4gIGdldCBkaXNhYmxlZFBlcmlvZCgpOiBNYXRUaW1lUGVyaW9kVHlwZSB8IG51bGwge1xuICAgIHJldHVybiB0aGlzLl9kaXNhYmxlZFBlcmlvZDtcbiAgfVxuICBzZXQgZGlzYWJsZWRQZXJpb2QodmFsdWU6IE1hdFRpbWVQZXJpb2RUeXBlIHwgbnVsbCkge1xuICAgIHRoaXMuX2Rpc2FibGVkUGVyaW9kID0gdmFsdWU7XG4gIH1cbiAgcHJpdmF0ZSBfZGlzYWJsZWRQZXJpb2Q6IE1hdFRpbWVQZXJpb2RUeXBlIHwgbnVsbCA9IG51bGw7XG5cbiAgQE91dHB1dCgpIHBlcmlvZENoYW5nZWQgPSBuZXcgRXZlbnRFbWl0dGVyPE1hdFRpbWVQZXJpb2RUeXBlPigpO1xuXG4gIGNvbnN0cnVjdG9yKHB1YmxpYyBfaW50bDogTWF0VGltZXBpY2tlckludGwpIHt9XG5cbiAgc2V0UGVyaW9kKGV2ZW50OiBFdmVudCwgcGVyaW9kOiBNYXRUaW1lUGVyaW9kVHlwZSk6IHZvaWQge1xuICAgIGV2ZW50LnByZXZlbnREZWZhdWx0KCk7XG4gICAgdGhpcy5wZXJpb2QgPSBwZXJpb2Q7XG4gICAgdGhpcy5wZXJpb2RDaGFuZ2VkLmVtaXQocGVyaW9kKTtcbiAgfVxuXG4gIF9pc1BlcmlvZERpc2FibGVkKHBlcmlvZDogTWF0VGltZVBlcmlvZFR5cGUpOiBib29sZWFuIHtcbiAgICBpZiAoIXRoaXMuZGlzYWJsZWRQZXJpb2QpIHtcbiAgICAgIHJldHVybiBmYWxzZTtcbiAgICB9XG5cbiAgICByZXR1cm4gdGhpcy5kaXNhYmxlZFBlcmlvZCA9PT0gcGVyaW9kO1xuICB9XG59XG4iLCI8ZGl2XG4gIHRhYmluZGV4PVwiMFwiXG4gIGNsYXNzPVwibWF0LXRpbWUtcGVyaW9kLWl0ZW1cIlxuICBtYXRSaXBwbGVcbiAgW2NsYXNzLm1hdC10aW1lLXBlcmlvZC1pdGVtLWFjdGl2ZV09XCJwZXJpb2QgPT09ICdhbSdcIlxuICBbY2xhc3MubWF0LXRpbWUtcGVyaW9kLWl0ZW0tZGlzYWJsZWRdPVwiX2lzUGVyaW9kRGlzYWJsZWQoJ2FtJylcIlxuICAoY2xpY2spPVwic2V0UGVyaW9kKCRldmVudCwgJ2FtJylcIlxuICAoa2V5ZG93bi5zcGFjZSk9XCJzZXRQZXJpb2QoJGV2ZW50LCAnYW0nKVwiXG4+XG4gIHt7IF9pbnRsLmFtIH19XG48L2Rpdj5cbjxtYXQtZGl2aWRlciBbdmVydGljYWxdPVwiIXZlcnRpY2FsXCI+PC9tYXQtZGl2aWRlcj5cbjxkaXZcbiAgdGFiaW5kZXg9XCIwXCJcbiAgY2xhc3M9XCJtYXQtdGltZS1wZXJpb2QtaXRlbVwiXG4gIG1hdFJpcHBsZVxuICBbY2xhc3MubWF0LXRpbWUtcGVyaW9kLWl0ZW0tYWN0aXZlXT1cInBlcmlvZCA9PT0gJ3BtJ1wiXG4gIFtjbGFzcy5tYXQtdGltZS1wZXJpb2QtaXRlbS1kaXNhYmxlZF09XCJfaXNQZXJpb2REaXNhYmxlZCgncG0nKVwiXG4gIChjbGljayk9XCJzZXRQZXJpb2QoJGV2ZW50LCAncG0nKVwiXG4gIChrZXlkb3duLnNwYWNlKT1cInNldFBlcmlvZCgkZXZlbnQsICdwbScpXCJcbj5cbiAge3sgX2ludGwucG0gfX1cbjwvZGl2PlxuIl19
|
|
@@ -18,6 +18,10 @@ export class MatTimepickerIntl {
|
|
|
18
18
|
this.okButton = 'OK';
|
|
19
19
|
/** A label for cancel button to close timepicker. */
|
|
20
20
|
this.cancelButton = 'Cancel';
|
|
21
|
+
/** A label for am text. */
|
|
22
|
+
this.am = 'AM';
|
|
23
|
+
/** A label for am text. */
|
|
24
|
+
this.pm = 'PM';
|
|
21
25
|
}
|
|
22
26
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.4", ngImport: i0, type: MatTimepickerIntl, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
23
27
|
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.0.4", ngImport: i0, type: MatTimepickerIntl, providedIn: 'root' }); }
|
|
@@ -26,4 +30,4 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.4", ngImpor
|
|
|
26
30
|
type: Injectable,
|
|
27
31
|
args: [{ providedIn: 'root' }]
|
|
28
32
|
}] });
|
|
29
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
33
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidGltZXBpY2tlci1pbnRsLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vcHJvamVjdHMvbWF0LXRpbWVwaWNrZXIvc3JjL2xpYi90aW1lcGlja2VyLWludGwudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLFVBQVUsRUFBRSxNQUFNLGVBQWUsQ0FBQzs7QUFHM0MsTUFBTSxPQUFPLGlCQUFpQjtJQUQ5QjtRQUVFLGdDQUFnQztRQUNoQyxnQkFBVyxHQUFHLFlBQVksQ0FBQztRQUUzQiwrQkFBK0I7UUFDL0IsZUFBVSxHQUFHLGFBQWEsQ0FBQztRQUUzQixtQ0FBbUM7UUFDbkMsa0JBQWEsR0FBRyxNQUFNLENBQUM7UUFFdkIscUNBQXFDO1FBQ3JDLG9CQUFlLEdBQUcsUUFBUSxDQUFDO1FBRTNCLHVGQUF1RjtRQUN2Rix3QkFBbUIsR0FBRyxpQkFBaUIsQ0FBQztRQUV4Qyx3RkFBd0Y7UUFDeEYseUJBQW9CLEdBQUcsa0JBQWtCLENBQUM7UUFFMUMsMkNBQTJDO1FBQzNDLGFBQVEsR0FBRyxJQUFJLENBQUM7UUFFaEIscURBQXFEO1FBQ3JELGlCQUFZLEdBQUcsUUFBUSxDQUFDO1FBRXhCLDJCQUEyQjtRQUMzQixPQUFFLEdBQUcsSUFBSSxDQUFDO1FBRVYsMkJBQTJCO1FBQzNCLE9BQUUsR0FBRyxJQUFJLENBQUM7S0FDWDs4R0E5QlksaUJBQWlCO2tIQUFqQixpQkFBaUIsY0FESixNQUFNOzsyRkFDbkIsaUJBQWlCO2tCQUQ3QixVQUFVO21CQUFDLEVBQUUsVUFBVSxFQUFFLE1BQU0sRUFBRSIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IEluamVjdGFibGUgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcblxuQEluamVjdGFibGUoeyBwcm92aWRlZEluOiAncm9vdCcgfSlcbmV4cG9ydCBjbGFzcyBNYXRUaW1lcGlja2VySW50bCB7XG4gIC8qKiBBIGxhYmVsIGZvciBpbnB1dHMgdGl0bGUuICovXG4gIGlucHV0c1RpdGxlID0gJ0VudGVyIHRpbWUnO1xuXG4gIC8qKiBBIGxhYmVsIGZvciBkaWFscyB0aXRsZS4gKi9cbiAgZGlhbHNUaXRsZSA9ICdTZWxlY3QgdGltZSc7XG5cbiAgLyoqIEEgbGFiZWwgZm9yIGhvdXIgaW5wdXQgaGludC4gKi9cbiAgaG91cklucHV0SGludCA9ICdIb3VyJztcblxuICAvKiogQSBsYWJlbCBmb3IgbWludXRlIGlucHV0IGhpbnQuICovXG4gIG1pbnV0ZUlucHV0SGludCA9ICdNaW51dGUnO1xuXG4gIC8qKiBMYWJlbCBmb3IgdGhlIGJ1dHRvbiB1c2VkIHRvIG9wZW4gdGhlIHRpbWVwaWNrZXIgcG9wdXAgKHVzZWQgYnkgc2NyZWVuIHJlYWRlcnMpLiAqL1xuICBvcGVuVGltZXBpY2tlckxhYmVsID0gJ09wZW4gdGltZXBpY2tlcic7XG5cbiAgLyoqIExhYmVsIGZvciB0aGUgYnV0dG9uIHVzZWQgdG8gY2xvc2UgdGhlIHRpbWVwaWNrZXIgcG9wdXAgKHVzZWQgYnkgc2NyZWVuIHJlYWRlcnMpLiAqL1xuICBjbG9zZVRpbWVwaWNrZXJMYWJlbCA9ICdDbG9zZSB0aW1lcGlja2VyJztcblxuICAvKiogQSBsYWJlbCBmb3IgT0sgYnV0dG9uIHRvIGFwcGx5IHRpbWUuICovXG4gIG9rQnV0dG9uID0gJ09LJztcblxuICAvKiogQSBsYWJlbCBmb3IgY2FuY2VsIGJ1dHRvbiB0byBjbG9zZSB0aW1lcGlja2VyLiAqL1xuICBjYW5jZWxCdXR0b24gPSAnQ2FuY2VsJztcblxuICAvKiogQSBsYWJlbCBmb3IgYW0gdGV4dC4gKi9cbiAgYW0gPSAnQU0nO1xuXG4gIC8qKiBBIGxhYmVsIGZvciBhbSB0ZXh0LiAqL1xuICBwbSA9ICdQTSc7XG59XG4iXX0=
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import * as i0 from '@angular/core';
|
|
2
2
|
import { InjectionToken, Injectable, Directive, Component, ViewEncapsulation, ChangeDetectionStrategy, Attribute, Input, ContentChild, EventEmitter, Inject, Output, inject, LOCALE_ID, Optional, NgModule, HostListener, SkipSelf, ViewChild, booleanAttribute, forwardRef, TemplateRef } from '@angular/core';
|
|
3
|
-
import * as i1$
|
|
3
|
+
import * as i1$1 from '@angular/cdk/overlay';
|
|
4
4
|
import { Overlay, FlexibleConnectedPositionStrategy, OverlayConfig, OverlayModule } from '@angular/cdk/overlay';
|
|
5
|
-
import * as i3 from '@angular/cdk/portal';
|
|
5
|
+
import * as i3$1 from '@angular/cdk/portal';
|
|
6
6
|
import { PortalModule, ComponentPortal, TemplatePortal } from '@angular/cdk/portal';
|
|
7
7
|
import { CdkScrollableModule } from '@angular/cdk/scrolling';
|
|
8
8
|
import * as i4$1 from '@angular/cdk/a11y';
|
|
@@ -15,10 +15,10 @@ import { coerceBooleanProperty, coerceNumberProperty } from '@angular/cdk/coerci
|
|
|
15
15
|
import { Subscription, of, merge, fromEvent, debounceTime, take, BehaviorSubject, Subject, first, filter } from 'rxjs';
|
|
16
16
|
import { PlatformModule, _getFocusedElementPierceShadowDom } from '@angular/cdk/platform';
|
|
17
17
|
import { DOWN_ARROW, UP_ARROW, PAGE_UP, PAGE_DOWN, ESCAPE, hasModifierKey } from '@angular/cdk/keycodes';
|
|
18
|
-
import * as
|
|
18
|
+
import * as i3 from '@angular/material/core';
|
|
19
19
|
import { MatRippleModule, mixinColor } from '@angular/material/core';
|
|
20
20
|
import { trigger, transition, animate, keyframes, style, state } from '@angular/animations';
|
|
21
|
-
import * as
|
|
21
|
+
import * as i2$1 from '@angular/material/divider';
|
|
22
22
|
import { MatDividerModule } from '@angular/material/divider';
|
|
23
23
|
import * as i4 from '@angular/material/form-field';
|
|
24
24
|
import { MatFormFieldModule, MAT_FORM_FIELD } from '@angular/material/form-field';
|
|
@@ -57,6 +57,10 @@ class MatTimepickerIntl {
|
|
|
57
57
|
this.okButton = 'OK';
|
|
58
58
|
/** A label for cancel button to close timepicker. */
|
|
59
59
|
this.cancelButton = 'Cancel';
|
|
60
|
+
/** A label for am text. */
|
|
61
|
+
this.am = 'AM';
|
|
62
|
+
/** A label for am text. */
|
|
63
|
+
this.pm = 'PM';
|
|
60
64
|
}
|
|
61
65
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.4", ngImport: i0, type: MatTimepickerIntl, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
62
66
|
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.0.4", ngImport: i0, type: MatTimepickerIntl, providedIn: 'root' }); }
|
|
@@ -1215,12 +1219,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.4", ngImpor
|
|
|
1215
1219
|
}] } });
|
|
1216
1220
|
|
|
1217
1221
|
class MatTimePeriod {
|
|
1218
|
-
constructor() {
|
|
1219
|
-
this._vertical = true;
|
|
1220
|
-
this._period = 'am';
|
|
1221
|
-
this._disabledPeriod = null;
|
|
1222
|
-
this.periodChanged = new EventEmitter();
|
|
1223
|
-
}
|
|
1224
1222
|
/** Whether the time period is vertically aligned. */
|
|
1225
1223
|
get vertical() {
|
|
1226
1224
|
return this._vertical;
|
|
@@ -1240,6 +1238,13 @@ class MatTimePeriod {
|
|
|
1240
1238
|
set disabledPeriod(value) {
|
|
1241
1239
|
this._disabledPeriod = value;
|
|
1242
1240
|
}
|
|
1241
|
+
constructor(_intl) {
|
|
1242
|
+
this._intl = _intl;
|
|
1243
|
+
this._vertical = true;
|
|
1244
|
+
this._period = 'am';
|
|
1245
|
+
this._disabledPeriod = null;
|
|
1246
|
+
this.periodChanged = new EventEmitter();
|
|
1247
|
+
}
|
|
1243
1248
|
setPeriod(event, period) {
|
|
1244
1249
|
event.preventDefault();
|
|
1245
1250
|
this.period = period;
|
|
@@ -1251,8 +1256,8 @@ class MatTimePeriod {
|
|
|
1251
1256
|
}
|
|
1252
1257
|
return this.disabledPeriod === period;
|
|
1253
1258
|
}
|
|
1254
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.4", ngImport: i0, type: MatTimePeriod, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1255
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.4", type: MatTimePeriod, isStandalone: true, selector: "mat-time-period", inputs: { vertical: "vertical", period: "period", disabledPeriod: "disabledPeriod" }, outputs: { periodChanged: "periodChanged" }, host: { properties: { "class.mat-time-period-vertical": "vertical", "class.mat-time-period-horizontal": "!vertical", "attr.aria-orientation": "vertical ? \"vertical\" : \"horizontal\"" }, classAttribute: "mat-time-period" }, ngImport: i0, template: "<div\n tabindex=\"0\"\n class=\"mat-time-period-item\"\n matRipple\n [class.mat-time-period-item-active]=\"period === 'am'\"\n [class.mat-time-period-item-disabled]=\"_isPeriodDisabled('am')\"\n (click)=\"setPeriod($event,'am')\"\n (keydown.space)=\"setPeriod($event, 'am')\"\n>\n
|
|
1259
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.4", ngImport: i0, type: MatTimePeriod, deps: [{ token: MatTimepickerIntl }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1260
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.4", type: MatTimePeriod, isStandalone: true, selector: "mat-time-period", inputs: { vertical: "vertical", period: "period", disabledPeriod: "disabledPeriod" }, outputs: { periodChanged: "periodChanged" }, host: { properties: { "class.mat-time-period-vertical": "vertical", "class.mat-time-period-horizontal": "!vertical", "attr.aria-orientation": "vertical ? \"vertical\" : \"horizontal\"" }, classAttribute: "mat-time-period" }, ngImport: i0, template: "<div\n tabindex=\"0\"\n class=\"mat-time-period-item\"\n matRipple\n [class.mat-time-period-item-active]=\"period === 'am'\"\n [class.mat-time-period-item-disabled]=\"_isPeriodDisabled('am')\"\n (click)=\"setPeriod($event, 'am')\"\n (keydown.space)=\"setPeriod($event, 'am')\"\n>\n {{ _intl.am }}\n</div>\n<mat-divider [vertical]=\"!vertical\"></mat-divider>\n<div\n tabindex=\"0\"\n class=\"mat-time-period-item\"\n matRipple\n [class.mat-time-period-item-active]=\"period === 'pm'\"\n [class.mat-time-period-item-disabled]=\"_isPeriodDisabled('pm')\"\n (click)=\"setPeriod($event, 'pm')\"\n (keydown.space)=\"setPeriod($event, 'pm')\"\n>\n {{ _intl.pm }}\n</div>\n", styles: [".mat-time-period{display:flex;text-align:center;border-width:1px;border-style:solid;border-radius:.25rem;box-sizing:border-box}.mat-time-period-vertical{flex-direction:column;width:3.25rem;height:4.5rem}.mat-time-period-vertical .mat-time-period-item:first-child{border-top-left-radius:inherit;border-top-right-radius:inherit}.mat-time-period-vertical .mat-time-period-item:last-child{border-bottom-left-radius:inherit;border-bottom-right-radius:inherit}.mat-time-period-horizontal{flex-direction:row;max-width:13.5rem;width:100%;height:2.5rem}.mat-time-period-horizontal .mat-time-period-item:first-child{border-top-left-radius:inherit;border-bottom-left-radius:inherit}.mat-time-period-horizontal .mat-time-period-item:last-child{border-top-right-radius:inherit;border-bottom-right-radius:inherit}.mat-time-period-item{display:flex;flex-direction:column;justify-content:center;flex-grow:1;height:100%;font-size:.875rem;font-weight:500;cursor:pointer}.mat-time-period-item-disabled{pointer-events:none}\n"], dependencies: [{ kind: "ngmodule", type: MatDividerModule }, { kind: "component", type: i2$1.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { kind: "ngmodule", type: MatRippleModule }, { kind: "directive", type: i3.MatRipple, selector: "[mat-ripple], [matRipple]", inputs: ["matRippleColor", "matRippleUnbounded", "matRippleCentered", "matRippleRadius", "matRippleAnimation", "matRippleDisabled", "matRippleTrigger"], exportAs: ["matRipple"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
1256
1261
|
}
|
|
1257
1262
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.4", ngImport: i0, type: MatTimePeriod, decorators: [{
|
|
1258
1263
|
type: Component,
|
|
@@ -1261,8 +1266,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.4", ngImpor
|
|
|
1261
1266
|
'[class.mat-time-period-vertical]': 'vertical',
|
|
1262
1267
|
'[class.mat-time-period-horizontal]': '!vertical',
|
|
1263
1268
|
'[attr.aria-orientation]': 'vertical ? "vertical" : "horizontal"',
|
|
1264
|
-
}, template: "<div\n tabindex=\"0\"\n class=\"mat-time-period-item\"\n matRipple\n [class.mat-time-period-item-active]=\"period === 'am'\"\n [class.mat-time-period-item-disabled]=\"_isPeriodDisabled('am')\"\n (click)=\"setPeriod($event,'am')\"\n (keydown.space)=\"setPeriod($event, 'am')\"\n>\n
|
|
1265
|
-
}], propDecorators: { vertical: [{
|
|
1269
|
+
}, template: "<div\n tabindex=\"0\"\n class=\"mat-time-period-item\"\n matRipple\n [class.mat-time-period-item-active]=\"period === 'am'\"\n [class.mat-time-period-item-disabled]=\"_isPeriodDisabled('am')\"\n (click)=\"setPeriod($event, 'am')\"\n (keydown.space)=\"setPeriod($event, 'am')\"\n>\n {{ _intl.am }}\n</div>\n<mat-divider [vertical]=\"!vertical\"></mat-divider>\n<div\n tabindex=\"0\"\n class=\"mat-time-period-item\"\n matRipple\n [class.mat-time-period-item-active]=\"period === 'pm'\"\n [class.mat-time-period-item-disabled]=\"_isPeriodDisabled('pm')\"\n (click)=\"setPeriod($event, 'pm')\"\n (keydown.space)=\"setPeriod($event, 'pm')\"\n>\n {{ _intl.pm }}\n</div>\n", styles: [".mat-time-period{display:flex;text-align:center;border-width:1px;border-style:solid;border-radius:.25rem;box-sizing:border-box}.mat-time-period-vertical{flex-direction:column;width:3.25rem;height:4.5rem}.mat-time-period-vertical .mat-time-period-item:first-child{border-top-left-radius:inherit;border-top-right-radius:inherit}.mat-time-period-vertical .mat-time-period-item:last-child{border-bottom-left-radius:inherit;border-bottom-right-radius:inherit}.mat-time-period-horizontal{flex-direction:row;max-width:13.5rem;width:100%;height:2.5rem}.mat-time-period-horizontal .mat-time-period-item:first-child{border-top-left-radius:inherit;border-bottom-left-radius:inherit}.mat-time-period-horizontal .mat-time-period-item:last-child{border-top-right-radius:inherit;border-bottom-right-radius:inherit}.mat-time-period-item{display:flex;flex-direction:column;justify-content:center;flex-grow:1;height:100%;font-size:.875rem;font-weight:500;cursor:pointer}.mat-time-period-item-disabled{pointer-events:none}\n"] }]
|
|
1270
|
+
}], ctorParameters: () => [{ type: MatTimepickerIntl }], propDecorators: { vertical: [{
|
|
1266
1271
|
type: Input
|
|
1267
1272
|
}], period: [{
|
|
1268
1273
|
type: Input
|
|
@@ -1666,7 +1671,7 @@ class MatTimepickerContent extends _MatTimepickerContentBase {
|
|
|
1666
1671
|
this._model.add(value);
|
|
1667
1672
|
}
|
|
1668
1673
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.4", ngImport: i0, type: MatTimepickerContent, deps: [{ token: i0.ElementRef }, { token: MatTimepickerIntl }, { token: MatTimeSelectionModel }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1669
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.4", type: MatTimepickerContent, isStandalone: true, selector: "mat-timepicker-content", host: { listeners: { "@transformPanel.start": "_handleAnimationEvent($event)", "@transformPanel.done": "_handleAnimationEvent($event)" }, properties: { "@transformPanel": "_animationState", "class.mat-timepicker-content-touch": "timepicker.touchUi" }, classAttribute: "mat-timepicker-content" }, viewQueries: [{ propertyName: "_dials", first: true, predicate: MatClockDials, descendants: true }, { propertyName: "_inputs", first: true, predicate: MatTimeInputs, descendants: true }], exportAs: ["matTimepickerContent"], usesInheritance: true, ngImport: i0, template: "<div\n cdkTrapFocus\n role=\"dialog\"\n class=\"mat-timepicker-content-container\"\n [attr.aria-modal]=\"true\"\n [attr.aria-labelledby]=\"_dialogLabelId ?? undefined\"\n>\n @switch (mode) {\n @case ('input') {\n <mat-time-inputs\n [id]=\"timepicker.id\"\n [color]=\"color\"\n [isMeridiem]=\"isMeridiem\"\n [selected]=\"_getSelected()\"\n [minTime]=\"timepicker._getMinTime()\"\n [maxTime]=\"timepicker._getMaxTime()\"\n [minuteInterval]=\"minuteInterval\"\n (_userSelection)=\"_handleUserSelection($event)\"\n ></mat-time-inputs>\n\n <div class=\"mat-timepicker-content-actions\">\n @if (showToggleModeButton) {\n <button\n class=\"mat-time-toggle-mode-button\"\n mat-icon-button\n (click)=\"onToggleMode('dial')\"\n >\n <svg xmlns=\"http://www.w3.org/2000/svg\" height=\"24\" width=\"24\" viewBox=\"0 0 24 24\">\n <path\n d=\"m15.175 16.625 1.475-1.45-3.6-3.6V7.1h-2.075v5.3ZM12 21.95q-2.075 0-3.887-.787-1.813-.788-3.15-2.125-1.338-1.338-2.125-3.151Q2.05 14.075 2.05 12t.788-3.887q.787-1.813 2.125-3.15Q6.3 3.625 8.113 2.837 9.925 2.05 12 2.05t3.887.787q1.813.788 3.151 2.126 1.337 1.337 2.125 3.15.787 1.812.787 3.887t-.787 3.887q-.788 1.813-2.125 3.151-1.338 1.337-3.151 2.125-1.812.787-3.887.787ZM12 12Zm0 7.8q3.225 0 5.513-2.275Q19.8 15.25 19.8 12q0-3.25-2.287-5.525Q15.225 4.2 12 4.2T6.488 6.475Q4.2 8.75 4.2 12q0 3.25 2.288 5.525Q8.775 19.8 12 19.8Z\"\n />\n </svg>\n </button>\n }\n\n <ng-template [cdkPortalOutlet]=\"_actionsPortal\"></ng-template>\n </div>\n }\n\n @case ('dial') {\n <mat-clock-dials\n [id]=\"timepicker.id\"\n [color]=\"color\"\n [isMeridiem]=\"isMeridiem\"\n [selected]=\"_getSelected()\"\n [minTime]=\"timepicker._getMinTime()\"\n [maxTime]=\"timepicker._getMaxTime()\"\n [minuteInterval]=\"minuteInterval\"\n [orientation]=\"orientation\"\n [touchUi]=\"timepicker.touchUi\"\n (_userSelection)=\"_handleUserSelection($event)\"\n ></mat-clock-dials>\n\n <div class=\"mat-timepicker-content-actions\">\n @if (showToggleModeButton) {\n <button\n class=\"mat-time-toggle-mode-button\"\n mat-icon-button\n (click)=\"onToggleMode('input')\"\n >\n <svg xmlns=\"http://www.w3.org/2000/svg\" height=\"24\" width=\"24\" viewBox=\"0 0 24 24\">\n <path\n d=\"M4 19q-.825 0-1.412-.587Q2 17.825 2 17V7q0-.825.588-1.412Q3.175 5 4 5h16q.825 0 1.413.588Q22 6.175 22 7v10q0 .825-.587 1.413Q20.825 19 20 19Zm0-2h16V7H4v10Zm4-1h8v-2H8Zm-3-3h2v-2H5Zm3 0h2v-2H8Zm3 0h2v-2h-2Zm3 0h2v-2h-2Zm3 0h2v-2h-2ZM5 10h2V8H5Zm3 0h2V8H8Zm3 0h2V8h-2Zm3 0h2V8h-2Zm3 0h2V8h-2ZM4 17V7v10Z\"\n />\n </svg>\n </button>\n }\n\n <ng-template [cdkPortalOutlet]=\"_actionsPortal\"></ng-template>\n </div>\n }\n }\n\n <!-- Invisible close button for screen reader users. -->\n <button\n type=\"button\"\n class=\"mat-timepicker-close-button\"\n mat-raised-button\n [color]=\"color || 'primary'\"\n [class.cdk-visually-hidden]=\"!_closeButtonFocused\"\n (focus)=\"_closeButtonFocused = true\"\n (blur)=\"_closeButtonFocused = false\"\n (click)=\"timepicker.close()\"\n >\n {{ _closeButtonText }}\n </button>\n</div>\n", styles: [".mat-timepicker-content{display:block}.mat-timepicker-content-container{position:relative;display:flex;flex-direction:column;padding:1rem 1.5rem}.mat-timepicker-content-actions{display:flex;justify-content:space-between;margin-right:-1rem;margin-top:1.5rem}.mat-time-toggle-mode-button{width:3.25rem;height:3.25rem;margin-left:-.75rem;margin-bottom:-.25rem}button.mat-timepicker-close-button{position:absolute;top:100%;left:0;margin-top:.5rem}.ng-animating button.mat-timepicker-close-button{display:none}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: PortalModule }, { kind: "directive", type: i3.CdkPortalOutlet, selector: "[cdkPortalOutlet]", inputs: ["cdkPortalOutlet"], outputs: ["attached"], exportAs: ["cdkPortalOutlet"] }, { kind: "ngmodule", type: A11yModule }, { kind: "directive", type: i4$1.CdkTrapFocus, selector: "[cdkTrapFocus]", inputs: ["cdkTrapFocus", "cdkTrapFocusAutoCapture"], exportAs: ["cdkTrapFocus"] }, { kind: "component", type: MatTimeInputs, selector: "mat-time-inputs" }, { kind: "component", type: MatClockDials, selector: "mat-clock-dials", inputs: ["orientation", "touchUi"], exportAs: ["matClockDials"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i2.MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", exportAs: ["matButton"] }, { kind: "component", type: i2.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }], animations: [
|
|
1674
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.4", type: MatTimepickerContent, isStandalone: true, selector: "mat-timepicker-content", host: { listeners: { "@transformPanel.start": "_handleAnimationEvent($event)", "@transformPanel.done": "_handleAnimationEvent($event)" }, properties: { "@transformPanel": "_animationState", "class.mat-timepicker-content-touch": "timepicker.touchUi" }, classAttribute: "mat-timepicker-content" }, viewQueries: [{ propertyName: "_dials", first: true, predicate: MatClockDials, descendants: true }, { propertyName: "_inputs", first: true, predicate: MatTimeInputs, descendants: true }], exportAs: ["matTimepickerContent"], usesInheritance: true, ngImport: i0, template: "<div\n cdkTrapFocus\n role=\"dialog\"\n class=\"mat-timepicker-content-container\"\n [attr.aria-modal]=\"true\"\n [attr.aria-labelledby]=\"_dialogLabelId ?? undefined\"\n>\n @switch (mode) {\n @case ('input') {\n <mat-time-inputs\n [id]=\"timepicker.id\"\n [color]=\"color\"\n [isMeridiem]=\"isMeridiem\"\n [selected]=\"_getSelected()\"\n [minTime]=\"timepicker._getMinTime()\"\n [maxTime]=\"timepicker._getMaxTime()\"\n [minuteInterval]=\"minuteInterval\"\n (_userSelection)=\"_handleUserSelection($event)\"\n ></mat-time-inputs>\n\n <div class=\"mat-timepicker-content-actions\">\n @if (showToggleModeButton) {\n <button\n class=\"mat-time-toggle-mode-button\"\n mat-icon-button\n (click)=\"onToggleMode('dial')\"\n >\n <svg xmlns=\"http://www.w3.org/2000/svg\" height=\"24\" width=\"24\" viewBox=\"0 0 24 24\">\n <path\n d=\"m15.175 16.625 1.475-1.45-3.6-3.6V7.1h-2.075v5.3ZM12 21.95q-2.075 0-3.887-.787-1.813-.788-3.15-2.125-1.338-1.338-2.125-3.151Q2.05 14.075 2.05 12t.788-3.887q.787-1.813 2.125-3.15Q6.3 3.625 8.113 2.837 9.925 2.05 12 2.05t3.887.787q1.813.788 3.151 2.126 1.337 1.337 2.125 3.15.787 1.812.787 3.887t-.787 3.887q-.788 1.813-2.125 3.151-1.338 1.337-3.151 2.125-1.812.787-3.887.787ZM12 12Zm0 7.8q3.225 0 5.513-2.275Q19.8 15.25 19.8 12q0-3.25-2.287-5.525Q15.225 4.2 12 4.2T6.488 6.475Q4.2 8.75 4.2 12q0 3.25 2.288 5.525Q8.775 19.8 12 19.8Z\"\n />\n </svg>\n </button>\n }\n\n <ng-template [cdkPortalOutlet]=\"_actionsPortal\"></ng-template>\n </div>\n }\n\n @case ('dial') {\n <mat-clock-dials\n [id]=\"timepicker.id\"\n [color]=\"color\"\n [isMeridiem]=\"isMeridiem\"\n [selected]=\"_getSelected()\"\n [minTime]=\"timepicker._getMinTime()\"\n [maxTime]=\"timepicker._getMaxTime()\"\n [minuteInterval]=\"minuteInterval\"\n [orientation]=\"orientation\"\n [touchUi]=\"timepicker.touchUi\"\n (_userSelection)=\"_handleUserSelection($event)\"\n ></mat-clock-dials>\n\n <div class=\"mat-timepicker-content-actions\">\n @if (showToggleModeButton) {\n <button\n class=\"mat-time-toggle-mode-button\"\n mat-icon-button\n (click)=\"onToggleMode('input')\"\n >\n <svg xmlns=\"http://www.w3.org/2000/svg\" height=\"24\" width=\"24\" viewBox=\"0 0 24 24\">\n <path\n d=\"M4 19q-.825 0-1.412-.587Q2 17.825 2 17V7q0-.825.588-1.412Q3.175 5 4 5h16q.825 0 1.413.588Q22 6.175 22 7v10q0 .825-.587 1.413Q20.825 19 20 19Zm0-2h16V7H4v10Zm4-1h8v-2H8Zm-3-3h2v-2H5Zm3 0h2v-2H8Zm3 0h2v-2h-2Zm3 0h2v-2h-2Zm3 0h2v-2h-2ZM5 10h2V8H5Zm3 0h2V8H8Zm3 0h2V8h-2Zm3 0h2V8h-2Zm3 0h2V8h-2ZM4 17V7v10Z\"\n />\n </svg>\n </button>\n }\n\n <ng-template [cdkPortalOutlet]=\"_actionsPortal\"></ng-template>\n </div>\n }\n }\n\n <!-- Invisible close button for screen reader users. -->\n <button\n type=\"button\"\n class=\"mat-timepicker-close-button\"\n mat-raised-button\n [color]=\"color || 'primary'\"\n [class.cdk-visually-hidden]=\"!_closeButtonFocused\"\n (focus)=\"_closeButtonFocused = true\"\n (blur)=\"_closeButtonFocused = false\"\n (click)=\"timepicker.close()\"\n >\n {{ _closeButtonText }}\n </button>\n</div>\n", styles: [".mat-timepicker-content{display:block}.mat-timepicker-content-container{position:relative;display:flex;flex-direction:column;padding:1rem 1.5rem}.mat-timepicker-content-actions{display:flex;justify-content:space-between;margin-right:-1rem;margin-top:1.5rem}.mat-time-toggle-mode-button{width:3.25rem;height:3.25rem;margin-left:-.75rem;margin-bottom:-.25rem}button.mat-timepicker-close-button{position:absolute;top:100%;left:0;margin-top:.5rem}.ng-animating button.mat-timepicker-close-button{display:none}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: PortalModule }, { kind: "directive", type: i3$1.CdkPortalOutlet, selector: "[cdkPortalOutlet]", inputs: ["cdkPortalOutlet"], outputs: ["attached"], exportAs: ["cdkPortalOutlet"] }, { kind: "ngmodule", type: A11yModule }, { kind: "directive", type: i4$1.CdkTrapFocus, selector: "[cdkTrapFocus]", inputs: ["cdkTrapFocus", "cdkTrapFocusAutoCapture"], exportAs: ["cdkTrapFocus"] }, { kind: "component", type: MatTimeInputs, selector: "mat-time-inputs" }, { kind: "component", type: MatClockDials, selector: "mat-clock-dials", inputs: ["orientation", "touchUi"], exportAs: ["matClockDials"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i2.MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", exportAs: ["matButton"] }, { kind: "component", type: i2.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }], animations: [
|
|
1670
1675
|
matTimepickerAnimations.transformPanel,
|
|
1671
1676
|
matTimepickerAnimations.fadeInTimepicker,
|
|
1672
1677
|
], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
@@ -2092,12 +2097,12 @@ class MatTimepickerBase {
|
|
|
2092
2097
|
event.keyCode === UP_ARROW));
|
|
2093
2098
|
})));
|
|
2094
2099
|
}
|
|
2095
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.4", ngImport: i0, type: MatTimepickerBase, deps: [{ token: i0.ViewContainerRef }, { token: i1$
|
|
2100
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.4", ngImport: i0, type: MatTimepickerBase, deps: [{ token: i0.ViewContainerRef }, { token: i1$1.Overlay }, { token: i0.NgZone }, { token: MAT_TIMEPICKER_SCROLL_STRATEGY }, { token: MAT_DEFAULT_ACITONS }, { token: MatTimeSelectionModel }, { token: MAT_TIMEPICKER_DEFAULT_OPTIONS, optional: true }], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
2096
2101
|
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "16.1.0", version: "18.0.4", type: MatTimepickerBase, inputs: { disabled: "disabled", opened: "opened", openAs: "openAs", color: "color", mode: "mode", format: "format", showToggleModeButton: "showToggleModeButton", minuteInterval: "minuteInterval", orientation: "orientation", touchUi: ["touchUi", "touchUi", booleanAttribute], xPosition: "xPosition", yPosition: "yPosition", restoreFocus: ["restoreFocus", "restoreFocus", booleanAttribute] }, outputs: { openedStream: "opened", closedStream: "closed" }, usesOnChanges: true, ngImport: i0 }); }
|
|
2097
2102
|
}
|
|
2098
2103
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.4", ngImport: i0, type: MatTimepickerBase, decorators: [{
|
|
2099
2104
|
type: Directive
|
|
2100
|
-
}], ctorParameters: () => [{ type: i0.ViewContainerRef }, { type: i1$
|
|
2105
|
+
}], ctorParameters: () => [{ type: i0.ViewContainerRef }, { type: i1$1.Overlay }, { type: i0.NgZone }, { type: undefined, decorators: [{
|
|
2101
2106
|
type: Inject,
|
|
2102
2107
|
args: [MAT_TIMEPICKER_SCROLL_STRATEGY]
|
|
2103
2108
|
}] }, { type: undefined, decorators: [{
|