@dhutaryan/ngx-mat-timepicker 12.3.0 → 12.3.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +1 -0
- package/bundles/dhutaryan-ngx-mat-timepicker.umd.js +6 -4
- package/bundles/dhutaryan-ngx-mat-timepicker.umd.js.map +1 -1
- package/esm2015/lib/clock-dials.js +4 -3
- package/esm2015/lib/time-period.js +4 -3
- package/fesm2015/dhutaryan-ngx-mat-timepicker.js +6 -4
- package/fesm2015/dhutaryan-ngx-mat-timepicker.js.map +1 -1
- package/lib/clock-dials.d.ts +1 -1
- package/lib/time-period.d.ts +1 -1
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -3,6 +3,7 @@
|
|
|
3
3
|
[](https://www.npmjs.com/package/@dhutaryan/ngx-mat-timepicker)
|
|
4
4
|
[](https://www.codefactor.io/repository/github/dhutaryan/ngx-mat-timepicker)
|
|
5
5
|
[](https://github.com/dgutoryan/ngx-timepicker/blob/master/LICENSE)
|
|
6
|
+

|
|
6
7
|
|
|
7
8
|
The timepicker module using Angular material.
|
|
8
9
|
|
|
@@ -1616,7 +1616,8 @@
|
|
|
1616
1616
|
enumerable: false,
|
|
1617
1617
|
configurable: true
|
|
1618
1618
|
});
|
|
1619
|
-
MatTimePeriod.prototype.setPeriod = function (period) {
|
|
1619
|
+
MatTimePeriod.prototype.setPeriod = function (event, period) {
|
|
1620
|
+
event.preventDefault();
|
|
1620
1621
|
this.period = period;
|
|
1621
1622
|
this.periodChanged.emit(period);
|
|
1622
1623
|
};
|
|
@@ -1629,7 +1630,7 @@
|
|
|
1629
1630
|
return MatTimePeriod;
|
|
1630
1631
|
}());
|
|
1631
1632
|
MatTimePeriod.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: MatTimePeriod, deps: [], target: i0__namespace.ɵɵFactoryTarget.Component });
|
|
1632
|
-
MatTimePeriod.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: MatTimePeriod, 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__namespace, 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('am')\"\n (
|
|
1633
|
+
MatTimePeriod.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: MatTimePeriod, 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__namespace, 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 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 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.375rem}.mat-time-period-horizontal{flex-direction:row;max-width:13.5rem;width:100%;height:2.5rem}.mat-time-period-item{display:flex;flex-direction:column;justify-content:center;flex-grow:1;height:100%;font-weight:500;cursor:pointer}.mat-time-period-item-disabled{pointer-events:none}\n"], components: [{ type: i1__namespace$1.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }], directives: [{ type: i2__namespace.MatRipple, selector: "[mat-ripple], [matRipple]", inputs: ["matRippleRadius", "matRippleDisabled", "matRippleTrigger", "matRippleColor", "matRippleUnbounded", "matRippleCentered", "matRippleAnimation"], exportAs: ["matRipple"] }], changeDetection: i0__namespace.ChangeDetectionStrategy.OnPush, encapsulation: i0__namespace.ViewEncapsulation.None });
|
|
1633
1634
|
i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: MatTimePeriod, decorators: [{
|
|
1634
1635
|
type: i0.Component,
|
|
1635
1636
|
args: [{
|
|
@@ -1678,7 +1679,8 @@
|
|
|
1678
1679
|
this._viewSubscription = null;
|
|
1679
1680
|
};
|
|
1680
1681
|
/** Changes clock dial view. */
|
|
1681
|
-
MatClockDials.prototype.onViewChange = function (view) {
|
|
1682
|
+
MatClockDials.prototype.onViewChange = function (event, view) {
|
|
1683
|
+
event.preventDefault();
|
|
1682
1684
|
this._view.next(view);
|
|
1683
1685
|
};
|
|
1684
1686
|
MatClockDials.prototype.focusActiveCell = function () {
|
|
@@ -1717,7 +1719,7 @@
|
|
|
1717
1719
|
return MatClockDials;
|
|
1718
1720
|
}(MatTimeFaceBase));
|
|
1719
1721
|
MatClockDials.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: MatClockDials, deps: [{ token: MatTimepickerIntl }, { token: TimeAdapter, optional: true }, { token: i0__namespace.NgZone }, { token: i0__namespace.ElementRef }], target: i0__namespace.ɵɵFactoryTarget.Component });
|
|
1720
|
-
MatClockDials.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: MatClockDials, selector: "mat-clock-dials", inputs: { orientation: "orientation" }, host: { attributes: { "role": "dial" }, classAttribute: "mat-clock-dials" }, exportAs: ["matClockDials"], usesInheritance: true, ngImport: i0__namespace, template: "<mat-timepicker-content-layout\n [title]=\"_intl.dialsTitle\"\n [orientation]=\"orientation\"\n>\n <div\n tabindex=\"0\"\n class=\"mat-clock-dial-value\"\n hours\n [class.mat-clock-dial-value-active]=\"isHoursView\"\n (click)=\"onViewChange('hours')\"\n (
|
|
1722
|
+
MatClockDials.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: MatClockDials, selector: "mat-clock-dials", inputs: { orientation: "orientation" }, host: { attributes: { "role": "dial" }, classAttribute: "mat-clock-dials" }, exportAs: ["matClockDials"], usesInheritance: true, ngImport: i0__namespace, template: "<mat-timepicker-content-layout\n [title]=\"_intl.dialsTitle\"\n [orientation]=\"orientation\"\n>\n <div\n tabindex=\"0\"\n class=\"mat-clock-dial-value\"\n hours\n [class.mat-clock-dial-value-active]=\"isHoursView\"\n (click)=\"onViewChange($event,'hours')\"\n (keydown.space)=\"onViewChange($event, 'hours')\"\n >\n {{ _withZeroPrefix(selectedHour) }}\n </div>\n <div\n tabindex=\"0\"\n class=\"mat-clock-dial-value\"\n minutes\n [class.mat-clock-dial-value-active]=\"!isHoursView\"\n (click)=\"onViewChange($event,'minutes')\"\n (keydown.space)=\"onViewChange($event,'minutes')\"\n >\n {{ _withZeroPrefix(selectedMinute) }}\n </div>\n\n <ng-template mat-time-period [ngIf]=\"isMeridiem\">\n <mat-time-period\n [period]=\"period\"\n [disabledPeriod]=\"disabledPeriod\"\n [vertical]=\"orientation === 'vertical'\"\n (periodChanged)=\"_onPeriodChanged($event)\"\n ></mat-time-period>\n </ng-template>\n\n <div\n class=\"mat-clock-dial-faces\"\n [class.mat-clock-dial-faces-horizontal]=\"orientation === 'horizontal'\"\n >\n <ng-template [ngIf]=\"isHoursView\">\n <mat-hours-clock-dial\n [@enterLeaveAnimation]\n [color]=\"color\"\n [selectedHour]=\"selectedHour\"\n [isMeridiem]=\"isMeridiem\"\n [availableHours]=\"_getAvailableHours()\"\n (selectedChange)=\"_onHourChanged($event)\"\n (keydown)=\"_onKeydown($event, 'hour')\"\n ></mat-hours-clock-dial>\n </ng-template>\n <ng-template [ngIf]=\"!isHoursView\">\n <mat-minutes-clock-dial\n [@enterLeaveAnimation]\n [color]=\"color\"\n [selectedMinute]=\"selectedMinute\"\n [interval]=\"minuteInterval\"\n [availableMinutes]=\"availableMinutes\"\n (selectedChange)=\"_onMinuteSelected($event)\"\n (keydown)=\"_onKeydown($event, 'minute')\"\n ></mat-minutes-clock-dial>\n </ng-template>\n </div>\n</mat-timepicker-content-layout>\n", styles: [".mat-clock-dial-values{display:flex;width:100%}.mat-clock-dial-value{display:flex;align-items:center;justify-content:center;height:4.375rem;border-radius:.25rem;cursor:pointer}.mat-clock-dial-faces{margin-top:2.25rem}.mat-clock-dial-faces.mat-clock-dial-faces-horizontal{margin-top:0}\n"], components: [{ type: MatTimepickerContentLayout, selector: "mat-timepicker-content-layout", inputs: ["title", "orientation"], exportAs: ["matTimepickerContent"] }, { type: MatTimePeriod, selector: "mat-time-period", inputs: ["vertical", "period", "disabledPeriod"], outputs: ["periodChanged"] }, { type: MatHoursClockDial, selector: "mat-hours-clock-dial", inputs: ["selectedHour", "isMeridiem", "availableHours", "color"], outputs: ["selectedChange"], exportAs: ["matHoursClockDial"] }, { type: MatMinutesClockDial, selector: "mat-minutes-clock-dial", inputs: ["selectedMinute", "interval", "availableMinutes", "color"], outputs: ["selectedChange"], exportAs: ["matMinutesClockDial"] }], directives: [{ type: i7__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], animations: [enterLeaveAnimation], changeDetection: i0__namespace.ChangeDetectionStrategy.OnPush, encapsulation: i0__namespace.ViewEncapsulation.None });
|
|
1721
1723
|
i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: MatClockDials, decorators: [{
|
|
1722
1724
|
type: i0.Component,
|
|
1723
1725
|
args: [{
|