UNPKG

ngx-material-timepicker-decon

Version:
2 lines 56.2 kB
!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("rxjs"),require("rxjs/operators"),require("@angular/forms"),require("luxon"),require("@angular/animations"),require("@angular/platform-browser"),require("@angular/common"),require("@angular/core"),require("simple-keyboard")):"function"==typeof define&&define.amd?define("ngx-material-timepicker-decon",["exports","rxjs","rxjs/operators","@angular/forms","luxon","@angular/animations","@angular/platform-browser","@angular/common","@angular/core","simple-keyboard"],t):t(e["ngx-material-timepicker-decon"]={},e.rxjs,e.rxjs.operators,e.ng.forms,e.luxon,e.ng.animations,e.ng.platformBrowser,e.ng.common,e.ng.core,e.Keyboard)}(this,function(e,n,o,t,a,i,r,c,s,p){"use strict";p=p&&p.hasOwnProperty("default")?p["default"]:p;var u=function(e,t){return(u=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(e,t){e.__proto__=t}||function(e,t){for(var i in t)t.hasOwnProperty(i)&&(e[i]=t[i])})(e,t)};function l(e,t){function i(){this.constructor=e}u(e,t),e.prototype=null===t?Object.create(t):(i.prototype=t.prototype,new i)}var m=function(){return(m=Object.assign||function(e){for(var t,i=1,n=arguments.length;i<n;i++)for(var o in t=arguments[i])Object.prototype.hasOwnProperty.call(t,o)&&(e[o]=t[o]);return e}).apply(this,arguments)};var d={AM:"AM",PM:"PM"},f="hh:mm a",h="h:m a",g="HH:mm",y="H:m";function b(e,t,i){return void 0===i&&(i="minutes"),"hours"===i?e.hour>=t.hour:"minutes"===i?e.hasSame(t,i)||e.valueOf()>t.valueOf():void 0}function k(e,t,i){return void 0===i&&(i="minutes"),"hours"===i?e.hour<=t.hour:"minutes"===i?e.hasSame(t,i)||e.valueOf()<=t.valueOf():void 0}var v=function(){function e(){}return e.parseTime=function(e,t){if(void 0===t&&(t=12),-1===e.indexOf(":"))return"Invalid time";var i=e.trim().substr(e.length-2).toUpperCase(),n=i===d.AM||i===d.PM,o=function s(e,t){var i="function"==typeof Symbol&&e[Symbol.iterator];if(!i)return e;var n,o,r=i.call(e),a=[];try{for(;(void 0===t||0<t--)&&!(n=r.next()).done;)a.push(n.value)}catch(c){o={error:c}}finally{try{n&&!n.done&&(i=r["return"])&&i.call(r)}finally{if(o)throw o.error}}return a}(e.split(":"),2),r=o[0],a=o[1];if(24===t)return(n?this.formatHour(+r,12,i):+r)+":"+parseInt(a,10);var c=12<+r;return i=n?i:c?d.PM:d.AM,(c?+r-12:+r)+":"+parseInt(a,10)+" "+i},e.formatTime=function(e,t){void 0===t&&(t=12);var i=24===t?g:f,n=24===t?y:h;return a.DateTime.fromFormat(this.parseTime(e,t),n).toFormat(i).toLowerCase()},e.convertTimeToDateTime=function(e,t){void 0===t&&(t=12);var i=24===t?y:h;return a.DateTime.fromFormat(this.parseTime(e,t),i)},e.isTimeAvailable=function(e,t,i,n,o,r){if(e){var a=this.convertTimeToDateTime(e,r),c=a.minute;if(o&&c%o!=0)throw new Error("Your minutes - "+c+" doesn't match your minutesGap - "+o);var s=t&&!i&&b(a,t,n),p=i&&!t&&k(a,i,n),u=t&&i&&function l(e,t,i,n){return void 0===n&&(n="minutes"),"hours"===n?k(e,i,n)&&b(e,t,n):"minutes"===n?k(e,i)&&b(e,t):void 0}(a,t,i,n);return s||p||u||!t&&!i}},e.formatHour=function(e,t,i){if(24===t)return e;var n=i===d.AM?e:e+12;return i===d.AM&&12===n?0:i===d.PM&&24===n?12:n},e}(),x={time:12,angle:360},T={time:0,angle:360},_=function(){function e(){this.hourSubject=new n.BehaviorSubject(x),this.minuteSubject=new n.BehaviorSubject(T),this.periodSubject=new n.BehaviorSubject(d.AM),this.keyboardClick=new s.EventEmitter}return Object.defineProperty(e.prototype,"hour",{set:function(e){this.hourSubject.next(e)},enumerable:!0,configurable:!0}),Object.defineProperty(e.prototype,"selectedHour",{get:function(){return this.hourSubject.asObservable()},enumerable:!0,configurable:!0}),Object.defineProperty(e.prototype,"minute",{set:function(e){this.minuteSubject.next(e)},enumerable:!0,configurable:!0}),Object.defineProperty(e.prototype,"selectedMinute",{get:function(){return this.minuteSubject.asObservable()},enumerable:!0,configurable:!0}),Object.defineProperty(e.prototype,"period",{set:function(e){(e===d.AM||e===d.PM)&&this.periodSubject.next(e)},enumerable:!0,configurable:!0}),Object.defineProperty(e.prototype,"selectedPeriod",{get:function(){return this.periodSubject.asObservable()},enumerable:!0,configurable:!0}),e.prototype.setDefaultTimeIfAvailable=function(e,t,i,n,o){try{v.isTimeAvailable(e,t,i,"minutes",o)&&this.setDefaultTime(v.formatTime(e,n),n)}catch(r){console.error(r)}},e.prototype.getFullTime=function(e){var t=this.hourSubject.getValue().time,i=this.minuteSubject.getValue().time,n=12===e?this.periodSubject.getValue():"";return v.formatTime(t+":"+i+" "+n,e)},e.prototype.setDefaultTime=function(e,t){var i=v.convertTimeToDateTime(e,t).toJSDate();if(a.DateTime.fromJSDate(i).isValid){var n=e.substr(e.length-2).toUpperCase(),o=i.getHours();this.hour=m({},x,{time:function r(e,t){switch(t){case d.AM:return 0===e?12:e;case d.PM:return 12===e?12:e-12;default:return e}}(o,n)}),this.minute=m({},T,{time:i.getMinutes()}),this.period=n}else this.resetTime()},e.prototype.resetTime=function(){this.hour=m({},x),this.minute=m({},T),this.period=d.AM},e.decorators=[{type:s.Injectable,args:[{providedIn:"root"}]}],e.ngInjectableDef=s.defineInjectable({factory:function(){return new e},token:e,providedIn:"root"}),e}();var C={HOUR:0,MINUTE:1};C[C.HOUR]="HOUR",C[C.MINUTE]="MINUTE";var w=function(){function e(){this.backdropClickSubject=new n.Subject,this.keydownEventSubject=new n.Subject}return Object.defineProperty(e.prototype,"backdropClick",{get:function(){return this.backdropClickSubject.asObservable()},enumerable:!0,configurable:!0}),Object.defineProperty(e.prototype,"keydownEvent",{get:function(){return this.keydownEventSubject.asObservable()},enumerable:!0,configurable:!0}),e.prototype.dispatchEvent=function(e){switch(e.type){case"click":this.backdropClickSubject.next(e);break;case"keydown":this.keydownEventSubject.next(e);break;default:throw new Error("no such event type")}},e.decorators=[{type:s.Injectable,args:[{providedIn:"root"}]}],e.ngInjectableDef=s.defineInjectable({factory:function(){return new e},token:e,providedIn:"root"}),e}(),E={ENTER:"enter",LEAVE:"leave"},I={NUMPAD:0,CLOCK:1};I[I.NUMPAD]="NUMPAD",I[I.CLOCK]="CLOCK";var S=function(){function t(e,t){var i=this;this.timepickerService=e,this.eventService=t,this.timeUnit=C,this.activeTimeUnit=C.HOUR,this.isOpened=!1,this.keyboardTypes=I,this.isEsc=!0,this.keyboardType=I.NUMPAD,this.keyboardTypeChanged=new s.EventEmitter,this.timeSet=new s.EventEmitter,this.opened=new s.EventEmitter,this.closed=new s.EventEmitter,this.hourSelected=new s.EventEmitter,this.subscriptions=[],this.subscriptions.push(n.merge(this.eventService.backdropClick,this.eventService.keydownEvent.pipe(o.filter(function(e){return 27===e.keyCode&&i.isEsc}))).subscribe(function(){return i.close()}))}return Object.defineProperty(t.prototype,"minutesGap",{get:function(){return this._minutesGap},set:function(e){null!=e&&(e=Math.floor(e),this._minutesGap=e<=59?e:1)},enumerable:!0,configurable:!0}),Object.defineProperty(t.prototype,"defaultTime",{set:function(e){this.setDefaultTime(e)},enumerable:!0,configurable:!0}),t.blurAll=function(){var e=document.querySelector(".hidden-button");e&&e.focus()},Object.defineProperty(t.prototype,"minTime",{get:function(){return this.timepickerInput&&this.timepickerInput.min},enumerable:!0,configurable:!0}),Object.defineProperty(t.prototype,"maxTime",{get:function(){return this.timepickerInput&&this.timepickerInput.max},enumerable:!0,configurable:!0}),Object.defineProperty(t.prototype,"disabled",{get:function(){return this.timepickerInput&&this.timepickerInput.disabled},enumerable:!0,configurable:!0}),Object.defineProperty(t.prototype,"format",{get:function(){return this.timepickerInput&&this.timepickerInput.format},enumerable:!0,configurable:!0}),t.prototype.ngOnInit=function(){var t=this;this.subscriptions.push(this.timepickerService.selectedHour.subscribe(function(e){return t.selectedHour=e})),this.subscriptions.push(this.timepickerService.selectedMinute.subscribe(function(e){return t.selectedMinute=e})),this.subscriptions.push(this.timepickerService.selectedPeriod.subscribe(function(e){return t.selectedPeriod=e}))},t.prototype.changeKeyboardType=function(e){this.keyboardType=e,this.keyboardTypeChanged.emit(e)},t.prototype.registerInput=function(e){if(this.timepickerInput)throw Error("A Timepicker can only be associated with a single input.");this.timepickerInput=e},t.prototype.onHourChange=function(e){this.timepickerService.hour=e},t.prototype.onHourSelected=function(e){this.changeTimeUnit(C.MINUTE),this.hourSelected.next(e)},t.prototype.onMinuteChange=function(e){this.timepickerService.minute=e},t.prototype.changePeriod=function(e){this.timepickerService.period=e},t.prototype.changeTimeUnit=function(e){this.activeTimeUnit=e},t.prototype.setTime=function(){this.timeSet.next(this.timepickerService.getFullTime(this.format)),this.close()},t.prototype.setDefaultTime=function(e){this.timepickerService.setDefaultTimeIfAvailable(e,this.minTime,this.maxTime,this.format,this.minutesGap)},t.prototype.open=function(){this.isOpened=!0,this.disableAnimation||(this.animationState=E.ENTER),this.opened.next()},t.prototype.close=function(){this.disableAnimation?this.closeTimepicker():this.animationState=E.LEAVE},t.prototype.animationDone=function(e){"done"===e.phaseName&&e.toState===E.LEAVE&&this.closeTimepicker()},t.prototype.onKeydown=function(e){this.eventService.dispatchEvent(e),e.stopPropagation()},t.prototype.ngOnDestroy=function(){this.subscriptions.forEach(function(e){return e.unsubscribe()})},t.prototype.closeTimepicker=function(){this.isOpened=!1,this.activeTimeUnit=C.HOUR,this.closed.next()},t.prototype.numPadPressed=function(e){t.blurAll(),this.timepickerService.keyboardClick.emit(new KeyboardEvent("keypress",{ctrlKey:!0,key:e,charCode:"Backspace"===e?46:e.charCodeAt(0),keyCode:"Backspace"===e?46:e.charCodeAt(0)}))},t.decorators=[{type:s.Component,args:[{selector:"ngx-material-timepicker",template:'<div class="timepicker-backdrop-overlay" *ngIf="isOpened" [overlay]="preventOverlayClick"></div>\n<div class="timepicker-overlay" *ngIf="isOpened">\n    <div class="timepicker" [@timepicker]="animationState" (@timepicker.done)="animationDone($event)">\n        <header class="timepicker__header">\n            <button class="hidden-button"></button>\n            <button class="change-type-button" *ngIf="keyboardType === keyboardTypes.NUMPAD" (click)="changeKeyboardType(keyboardTypes.CLOCK)">\n                <i class="decontimepicker-clock"></i>\n            </button>\n            <button class="change-type-button" *ngIf="keyboardType === keyboardTypes.CLOCK" (click)="changeKeyboardType(keyboardTypes.NUMPAD)">\n                <i class="decontimepicker-keypad"></i>\n            </button>\n            <ngx-material-timepicker-dial [format]="format" [hour]="selectedHour?.time"\n                                          [minute]="selectedMinute?.time"\n                                          [period]="selectedPeriod" [activeTimeUnit]="activeTimeUnit"\n                                          [minTime]="minTime" [maxTime]="maxTime"\n                                          [isEditable]="enableKeyboardInput"\n                                          [editableHintTmpl]="editableHintTmpl"\n                                          [minutesGap]="minutesGap"\n                                          (periodChanged)="changePeriod($event)"\n                                          (timeUnitChanged)="changeTimeUnit($event)"\n                                          (hourChanged)="onHourChange($event)"\n                                          (minuteChanged)="onMinuteChange($event)"\n            ></ngx-material-timepicker-dial>\n        </header>\n        <div class="timepicker__main-content">\n            <div *ngIf="keyboardType === keyboardTypes.CLOCK">\n                <div class="timepicker__body" [ngSwitch]="activeTimeUnit">\n                    <div *ngSwitchCase="timeUnit.HOUR">\n                        <ngx-material-timepicker-24-hours-face *ngIf="format === 24;else ampmHours"\n                                                               (hourChange)="onHourChange($event)"\n                                                               [selectedHour]="selectedHour"\n                                                               [minTime]="minTime"\n                                                               [maxTime]="maxTime"\n                                                               [format]="format"\n                                                               (hourSelected)="onHourSelected($event)"></ngx-material-timepicker-24-hours-face>\n                        <ng-template #ampmHours>\n                            <ngx-material-timepicker-12-hours-face\n                                (hourChange)="onHourChange($event)"\n                                [selectedHour]="selectedHour"\n                                [period]="selectedPeriod"\n                                [minTime]="minTime"\n                                [maxTime]="maxTime"\n                                (hourSelected)="onHourSelected($event)"></ngx-material-timepicker-12-hours-face>\n                        </ng-template>\n                    </div>\n                    <ngx-material-timepicker-minutes-face *ngSwitchCase="timeUnit.MINUTE"\n                                                          [selectedMinute]="selectedMinute"\n                                                          [selectedHour]="selectedHour?.time"\n                                                          [minTime]="minTime"\n                                                          [maxTime]="maxTime"\n                                                          [format]="format"\n                                                          [period]="selectedPeriod"\n                                                          [minutesGap]="minutesGap"\n                                                          (minuteChange)="onMinuteChange($event)"></ngx-material-timepicker-minutes-face>\n                </div>\n            </div>\n            <div *ngIf="keyboardType === keyboardTypes.NUMPAD">\n                <timepicker-numpad (keyPressed)="numPadPressed($event)"></timepicker-numpad>\n            </div>\n            <div class="timepicker__actions">\n                <div (click)="close()">\n                    \x3c!--suppress HtmlUnknownAttribute --\x3e\n                    <ng-container *ngTemplateOutlet="cancelBtnTmpl ? cancelBtnTmpl : cancelBtnDefault"></ng-container>\n                </div>\n                <div (click)="setTime()">\n                    \x3c!--suppress HtmlUnknownAttribute --\x3e\n                    <ng-container\n                        *ngTemplateOutlet="confirmBtnTmpl ? confirmBtnTmpl : confirmBtnDefault"></ng-container>\n                </div>\n            </div>\n        </div>\n    </div>\n</div>\n<ng-template #cancelBtnDefault>\n    <ngx-material-timepicker-button>Cancel</ngx-material-timepicker-button>\n</ng-template>\n<ng-template #confirmBtnDefault>\n    <ngx-material-timepicker-button>Ok</ngx-material-timepicker-button>\n</ng-template>\n',animations:[i.trigger("timepicker",[i.transition("* => "+E.ENTER,[i.style({transform:"translateY(-30%)"}),i.animate("0.2s ease-out",i.style({transform:"translateY(0)"}))]),i.transition(E.ENTER+" => "+E.LEAVE,[i.style({transform:"translateY(0)",opacity:1}),i.animate("0.2s ease-out",i.style({transform:"translateY(-30%)",opacity:0}))])])],providers:[_],styles:[":host{--body-background-color:#fff;--primary-font-family:'Roboto',sans-serif;--button-color:deepskyblue;--dial-active-color:#fff;--dial-inactive-color:rgba(255, 255, 255, .5);--dial-background-color:deepskyblue;--clock-face-time-active-color:#fff;--clock-face-time-inactive-color:#6c6c6c;--clock-face-inner-time-inactive-color:#929292;--clock-face-time-disabled-color:#c5c5c5;--clock-face-background-color:#f0f0f0;--clock-hand-color:deepskyblue}@font-face{font-family:decontimepicker;src:url(../assets/icons/decontimepicker.eot);src:url(../assets/icons/decontimepicker.eot?#iefix) format(\"embedded-opentype\"),url(../assets/icons/decontimepicker.woff) format(\"woff\"),url(../assets/icons/decontimepicker.ttf) format(\"truetype\"),url(../assets/icons/decontimepicker.svg#decontimepicker) format(\"svg\");font-weight:400;font-style:normal}[class*=decontimepicker-]:before{display:inline-block;font-family:decontimepicker;font-style:normal;font-weight:400;line-height:1;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.decontimepicker-backspace:before{content:'\\0041'}.decontimepicker-clock:before{content:'\\0042'}.decontimepicker-keypad:before{content:'\\0043'}.timepicker-overlay::ng-deep [class*=decontimepicker-]:before{display:inline-block;font-family:decontimepicker;font-style:normal;font-weight:400;line-height:1;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.timepicker-overlay::ng-deep .decontimepicker-backspace:before{content:'\\0041'}.timepicker-overlay::ng-deep .decontimepicker-clock:before{content:'\\0042'}.timepicker-overlay::ng-deep .decontimepicker-keypad:before{content:'\\0043'}.simple-keyboard{font-family:HelveticaNeue-Light,Helvetica Neue Light,Helvetica Neue,Helvetica,Arial,Lucida Grande,sans-serif;width:100%;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;box-sizing:border-box;overflow:hidden;touch-action:manipulation}.simple-keyboard .hg-row{display:flex}.simple-keyboard .hg-row:not(:last-child){margin-bottom:5px}.simple-keyboard .hg-row .hg-button-container,.simple-keyboard .hg-row .hg-button:not(:last-child){margin-right:5px}.simple-keyboard .hg-row>div:last-child{margin-right:0}.simple-keyboard .hg-row .hg-button-container{display:flex}.simple-keyboard .hg-button{display:inline-block;flex-grow:1;cursor:pointer}.simple-keyboard .hg-button span{pointer-events:none}.simple-keyboard.hg-theme-default{background-color:rgba(0,0,0,.1);padding:5px;border-radius:5px}.simple-keyboard.hg-theme-default .hg-button{box-shadow:0 0 3px -1px rgba(0,0,0,.3);height:40px;border-radius:5px;box-sizing:border-box;padding:5px;background:#fff;border-bottom:1px solid #b5b5b5;cursor:pointer;display:flex;align-items:center;justify-content:center}.simple-keyboard button.hg-button{border-width:0;outline:0;font-size:inherit}.simple-keyboard.hg-theme-default:not(.hg-touch-events) .hg-button:active{background:#e4e4e4}.simple-keyboard.hg-theme-default.hg-layout-numeric .hg-button{width:33.3%;height:60px;align-items:center;display:flex;justify-content:center}.simple-keyboard.hg-theme-default .hg-button.hg-button-numpadadd,.simple-keyboard.hg-theme-default .hg-button.hg-button-numpadenter{height:85px}.simple-keyboard.hg-theme-default .hg-button.hg-button-numpad0{width:105px}.simple-keyboard.hg-theme-default .hg-button.hg-button-com{max-width:85px}.simple-keyboard.hg-theme-default .hg-button.hg-standardBtn.hg-button-at{max-width:45px}.simple-keyboard.hg-theme-default .hg-button.hg-selectedButton{background:rgba(5,25,70,.53);color:#fff}.simple-keyboard.hg-theme-default .hg-button.hg-standardBtn[data-skbtn=\".com\"]{max-width:82px}.simple-keyboard.hg-theme-default .hg-button.hg-standardBtn[data-skbtn=\"@\"]{max-width:60px}.hidden-button{display:block;visibility:hidden;height:1px;width:1px;overflow:hidden;border:0;position:fixed;top:-1px;left:-1px}.timepicker-backdrop-overlay{position:fixed;top:0;bottom:0;right:0;left:0;background-color:rgba(0,0,0,.3);z-index:999;pointer-events:auto}.timepicker-overlay{position:fixed;top:0;left:0;width:100%;height:100%;display:flex;justify-content:center;align-items:center;z-index:999;pointer-events:none}.timepicker{width:300px;border-radius:2px;box-shadow:rgba(0,0,0,.25) 0 14px 45px,rgba(0,0,0,.22) 0 10px 18px;outline:0;position:static;z-index:999;pointer-events:auto}.timepicker__header{color:#fff;padding:15px 30px;background-color:#00bfff}@supports (background-color:var(--dial-background-color)){.timepicker__header{background-color:var(--dial-background-color)}}.timepicker__body{padding:15px 5px;display:flex;justify-content:center;align-items:center;background-color:#fff}@supports (background-color:var(--body-background-color)){.timepicker__body{background-color:var(--body-background-color)}}.timepicker__actions{display:flex;justify-content:flex-end;padding:15px;background-color:#fff}@supports (background-color:var(--body-background-color)){.timepicker__actions{background-color:var(--body-background-color)}}@media (max-device-width:1023px) and (orientation:landscape){.timepicker{display:flex;width:515px}.timepicker__header{display:flex;align-items:center}.timepicker__main-content{display:flex;flex-direction:column;width:100%}.timepicker__actions{padding:5px;margin-top:-1px}}"]}]}],t.ctorParameters=function(){return[{type:_},{type:w}]},t.propDecorators={cancelBtnTmpl:[{type:s.Input}],editableHintTmpl:[{type:s.Input}],confirmBtnTmpl:[{type:s.Input}],isEsc:[{type:s.Input,args:["ESC"]}],enableKeyboardInput:[{type:s.Input}],preventOverlayClick:[{type:s.Input}],disableAnimation:[{type:s.Input}],keyboardType:[{type:s.Input}],keyboardTypeChanged:[{type:s.Output}],minutesGap:[{type:s.Input}],defaultTime:[{type:s.Input}],timeSet:[{type:s.Output}],opened:[{type:s.Output}],closed:[{type:s.Output}],hourSelected:[{type:s.Output}],timepickerComponent:[{type:s.ViewChild,args:["timepickerww"]}],onKeydown:[{type:s.HostListener,args:["keydown",["$event"]]}]},t}(),O=function(){function e(){}return e.decorators=[{type:s.Directive,args:[{selector:"[ngxMaterialTimepickerToggleIcon]"}]}],e}(),P=function(){function e(){}return Object.defineProperty(e.prototype,"disabled",{get:function(){return this._disabled===undefined?this.timepicker.disabled:this._disabled},set:function(e){this._disabled=e},enumerable:!0,configurable:!0}),e.prototype.open=function(e){this.timepicker&&(this.timepicker.open(),e.stopPropagation())},e.decorators=[{type:s.Component,args:[{selector:"ngx-material-timepicker-toggle",template:'<button class="ngx-material-timepicker-toggle" (click)="open($event)" [disabled]="disabled" type="button">\n    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24px" height="24px" *ngIf="!customIcon">\n        <path\n            d="M 12 2 C 6.4889971 2 2 6.4889971 2 12 C 2 17.511003                   6.4889971 22 12 22 C 17.511003 22 22 17.511003 22 12 C 22 6.4889971 17.511003 2 12 2 z M 12 4 C 16.430123 4 20 7.5698774 20 12 C 20 16.430123 16.430123 20 12 20 C 7.5698774 20 4 16.430123 4 12 C 4 7.5698774 7.5698774 4 12 4 z M 11 6 L 11 12.414062 L 15.292969 16.707031 L 16.707031 15.292969 L 13 11.585938 L 13 6 L 11 6 z"/>\n    </svg>\n\n    <ng-content select="[ngxMaterialTimepickerToggleIcon]"></ng-content>\n</button>\n',styles:[".ngx-material-timepicker-toggle{display:flex;justify-content:center;align-items:center;padding:4px;background-color:transparent;border-radius:50%;text-align:center;border:none;outline:0;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;transition:background-color .3s;cursor:pointer}.ngx-material-timepicker-toggle:focus{background-color:rgba(0,0,0,.07)}"]}]}],e.propDecorators={timepicker:[{type:s.Input,args:["for"]}],disabled:[{type:s.Input}],customIcon:[{type:s.ContentChild,args:[O]}]},e}(),H={provide:t.NG_VALUE_ACCESSOR,useExisting:s.forwardRef(function(){return M}),multi:!0},M=function(){function e(e){this.elementRef=e,this._format=12,this._value="",this.timepickerSubscriptions=[],this.onTouched=function(){},this.onChange=function(){}}return Object.defineProperty(e.prototype,"format",{get:function(){return this._format},set:function(e){this._format=24===e?24:12},enumerable:!0,configurable:!0}),Object.defineProperty(e.prototype,"min",{get:function(){return this._min},set:function(e){this._min="string"!=typeof e?e:v.convertTimeToDateTime(e,this._format)},enumerable:!0,configurable:!0}),Object.defineProperty(e.prototype,"max",{get:function(){return this._max},set:function(e){this._max="string"!=typeof e?e:v.convertTimeToDateTime(e,this._format)},enumerable:!0,configurable:!0}),Object.defineProperty(e.prototype,"timepicker",{set:function(e){this.registerTimepicker(e)},enumerable:!0,configurable:!0}),Object.defineProperty(e.prototype,"value",{get:function(){return this._value},set:function(e){if(!e)return this._value="",void this.updateInputValue();var t=v.formatTime(e,this._format);if(v.isTimeAvailable(t,this._min,this._max,"minutes",this._timepicker.minutesGap,this._format))return this._value=t,void this.updateInputValue();console.warn("Selected time doesn't match min or max value")},enumerable:!0,configurable:!0}),Object.defineProperty(e.prototype,"defaultTime",{set:function(e){this._timepicker.setDefaultTime(e)},enumerable:!0,configurable:!0}),e.prototype.onInput=function(e){this.value=e,this.onChange(e)},e.prototype.ngOnChanges=function(e){e.value&&e.value.currentValue&&(this.defaultTime=e.value.currentValue)},e.prototype.onClick=function(e){this.disableClick||(this._timepicker.open(),e.stopPropagation())},e.prototype.writeValue=function(e){this.value=e,this.defaultTime=e},e.prototype.registerOnChange=function(e){this.onChange=e},e.prototype.registerOnTouched=function(e){this.onTouched=e},e.prototype.setDisabledState=function(e){this.disabled=e},e.prototype.ngOnDestroy=function(){this.timepickerSubscriptions.forEach(function(e){return e.unsubscribe()})},e.prototype.registerTimepicker=function(e){var t=this;if(!e)throw new Error("NgxMaterialTimepickerComponent is not defined. Please make sure you passed the timepicker to ngxTimepicker directive");this._timepicker=e,this._timepicker.registerInput(this),this.timepickerSubscriptions.push(this._timepicker.timeSet.subscribe(function(e){t.value=e,t.onChange(t._value),t.onTouched()})),this.timepickerSubscriptions.push(this._timepicker.closed.subscribe(function(){return t.defaultTime=t._value}))},e.prototype.updateInputValue=function(){this.elementRef.nativeElement.value=this.value},e.decorators=[{type:s.Directive,args:[{selector:"[ngxTimepicker]",providers:[H],host:{"[disabled]":"disabled","(input)":"onInput($event.target.value)","(blur)":"onTouched()"}}]}],e.ctorParameters=function(){return[{type:s.ElementRef}]},e.propDecorators={format:[{type:s.Input}],min:[{type:s.Input}],max:[{type:s.Input}],timepicker:[{type:s.Input,args:["ngxTimepicker"]}],value:[{type:s.Input}],disabled:[{type:s.Input}],disableClick:[{type:s.Input}],onClick:[{type:s.HostListener,args:["click",["$event"]]}]},e}(),D=function(){function e(e){this.element=e.nativeElement}return e.prototype.ngAfterViewInit=function(){this.theme&&this.setTheme(this.theme)},e.prototype.setTheme=function(e){for(var t in e)if(e.hasOwnProperty(t)){if("string"==typeof e[t]){for(var i in e)e.hasOwnProperty(i)&&this.element.style.setProperty("--"+i.replace(/([a-z])([A-Z])/g,"$1-$2").toLowerCase(),e[i]);return}this.setTheme(e[t])}},e.decorators=[{type:s.Directive,args:[{selector:"[ngxMaterialTimepickerTheme]"}]}],e.ctorParameters=function(){return[{type:s.ElementRef}]},e.propDecorators={theme:[{type:s.Input,args:["ngxMaterialTimepickerTheme"]}]},e}();function U(e){return Array(e).fill(1).map(function(e,t){var i=e+t;return{time:24===i?0:i,angle:30*i}})}function j(e,n){return n.min||n.max?e.map(function(e){var t=24===n.format?e.time:v.formatHour(e.time,n.format,n.period),i=a.DateTime.fromObject({hour:t}).toFormat(f);return m({},e,{disabled:!v.isTimeAvailable(i,n.min,n.max,"hours")})}):e}function A(e){void 0===e&&(e=1);for(var t=[],i=0;i<60;i++){var n=6*i;i%e==0&&t.push({time:i,angle:0!==n?n:360})}return t}function L(e,t,i){if(i.min||i.max){var n=v.formatHour(t,i.format,i.period);return e.map(function(e){var t=a.DateTime.fromObject({hour:n,minute:e.time}).toFormat(f);return m({},e,{disabled:!v.isTimeAvailable(t,i.min,i.max,"minutes")})})}return e}var z=function(){function e(e){this.hourChange=new s.EventEmitter,this.hourSelected=new s.EventEmitter,this.hoursList=[],this.hoursList=U(e)}return e.prototype.onTimeSelected=function(e){this.hourSelected.next(e)},e.propDecorators={selectedHour:[{type:s.Input}],minTime:[{type:s.Input}],maxTime:[{type:s.Input}],format:[{type:s.Input}],hourChange:[{type:s.Output}],hourSelected:[{type:s.Output}]},e}(),F=function(e){function t(){return e.call(this,24)||this}return l(t,e),t.prototype.ngAfterContentInit=function(){this.hoursList=j(this.hoursList,{min:this.minTime,max:this.maxTime,format:this.format})},t.decorators=[{type:s.Component,args:[{selector:"ngx-material-timepicker-24-hours-face",template:'<ngx-material-timepicker-face [selectedTime]="selectedHour" [faceTime]="hoursList" [format]="format"\n                              (timeChange)="hourChange.next($event)"\n                              (timeSelected)="onTimeSelected($event)"></ngx-material-timepicker-face>\n'}]}],t.ctorParameters=function(){return[]},t}(z),N=function(e){function t(){return e.call(this,12)||this}return l(t,e),t.prototype.ngOnChanges=function(e){e.period&&e.period.currentValue&&(this.hoursList=j(this.hoursList,{min:this.minTime,max:this.maxTime,format:this.format,period:this.period}))},t.decorators=[{type:s.Component,args:[{selector:"ngx-material-timepicker-12-hours-face",template:'<ngx-material-timepicker-face [selectedTime]="selectedHour" [faceTime]="hoursList"\n                              (timeChange)="hourChange.next($event)" (timeSelected)="onTimeSelected($event)"></ngx-material-timepicker-face>\n'}]}],t.ctorParameters=function(){return[]},t.propDecorators={period:[{type:s.Input}]},t}(z),V=function(){function e(){this.minutesList=[],this.timeUnit=C,this.minuteChange=new s.EventEmitter}return e.prototype.ngOnChanges=function(e){if(e.period&&e.period.currentValue){var t=A(this.minutesGap);this.minutesList=L(t,this.selectedHour,{min:this.minTime,max:this.maxTime,format:this.format,period:this.period})}},e.decorators=[{type:s.Component,args:[{selector:"ngx-material-timepicker-minutes-face",template:'<ngx-material-timepicker-face [faceTime]="minutesList" [selectedTime]="selectedMinute"\n                              [minutesGap]="minutesGap"\n                              (timeChange)="minuteChange.next($event)" [unit]="timeUnit.MINUTE"></ngx-material-timepicker-face>\n'}]}],e.propDecorators={selectedMinute:[{type:s.Input}],selectedHour:[{type:s.Input}],period:[{type:s.Input}],minTime:[{type:s.Input}],maxTime:[{type:s.Input}],format:[{type:s.Input}],minutesGap:[{type:s.Input}],minuteChange:[{type:s.Output}]},e}(),$={height:"75px",top:"calc(50% - 75px)"},B={height:"103px",top:"calc(50% - 103px)"},R=function(){function e(){this.timeUnit=C,this.innerClockFaceSize=85,this.timeChange=new s.EventEmitter,this.timeSelected=new s.EventEmitter}return e.prototype.ngAfterViewInit=function(){this.setClockHandPosition(),this.addTouchEvents()},e.prototype.ngOnChanges=function(e){var t=this,i=e.faceTime,n=e.selectedTime;i&&i.currentValue&&n&&n.currentValue&&(this.selectedTime=this.faceTime.find(function(e){return e.time===t.selectedTime.time})),n&&n.currentValue&&this.setClockHandPosition(),i&&i.currentValue&&setTimeout(function(){return t.selectAvailableTime()})},e.prototype.trackByTime=function(e,t){return t.time},e.prototype.onMousedown=function(e){e.preventDefault(),this.isStarted=!0},e.prototype.selectTime=function(e){if(this.isStarted||!(e instanceof MouseEvent)||"click"===e.type){var t=this.clockFace.nativeElement.getBoundingClientRect(),i=t.left+t.width/2,n=t.top+t.height/2,o=180*Math.atan(Math.abs(e.clientX-i)/Math.abs(e.clientY-n))/Math.PI,r=function l(e,t,i,n,o){return t<n&&e<=i?180-o:t<n&&i<e?180+o:n<t&&i<e?360-o:o}(i,n,e.clientX,e.clientY,o),a=this.format&&this.isInnerClockFace(i,n,e.clientX,e.clientY),c=this.unit===C.MINUTE?6*(this.minutesGap||1):30,s=a?K(r,c)+360:K(r,c),p=0===s?360:s,u=this.faceTime.find(function(e){return e.angle===p});u&&!u.disabled&&(this.timeChange.next(u),this.isStarted||this.timeSelected.next(u.time))}},e.prototype.onMouseup=function(e){e.preventDefault(),this.isStarted=!1},e.prototype.isHourSelected=function(e){return e===this.selectedTime.time&&!this.isClockFaceDisabled},e.prototype.isMinuteSelected=function(e){return this.selectedTime.time===e&&e%(this.minutesGap||5)==0&&!this.isClockFaceDisabled},e.prototype.ngOnDestroy=function(){this.removeTouchEvents()},e.prototype.addTouchEvents=function(){this.touchStartHandler=this.onMousedown.bind(this),this.touchEndHandler=this.onMouseup.bind(this),this.clockFace.nativeElement.addEventListener("touchstart",this.touchStartHandler),this.clockFace.nativeElement.addEventListener("touchend",this.touchEndHandler)},e.prototype.removeTouchEvents=function(){this.clockFace.nativeElement.removeEventListener("touchstart",this.touchStartHandler),this.clockFace.nativeElement.removeEventListener("touchend",this.touchEndHandler)},e.prototype.setClockHandPosition=function(){24===this.format&&(12<this.selectedTime.time||0===this.selectedTime.time?this.decreaseClockHand():this.increaseClockHand()),this.clockHand.nativeElement.style.transform="rotate("+this.selectedTime.angle+"deg)"},e.prototype.selectAvailableTime=function(){var t=this,e=this.faceTime.find(function(e){return t.selectedTime.time===e.time});if(this.isClockFaceDisabled=this.faceTime.every(function(e){return e.disabled}),e&&e.disabled&&!this.isClockFaceDisabled){var i=this.faceTime.find(function(e){return!e.disabled});this.timeChange.next(i)}},e.prototype.isInnerClockFace=function(e,t,i,n){return Math.sqrt(Math.pow(i-e,2)+Math.pow(n-t,2))<this.innerClockFaceSize},e.prototype.decreaseClockHand=function(){this.clockHand.nativeElement.style.height=$.height,this.clockHand.nativeElement.style.top=$.top},e.prototype.increaseClockHand=function(){this.clockHand.nativeElement.style.height=B.height,this.clockHand.nativeElement.style.top=B.top},e.decorators=[{type:s.Component,args:[{selector:"ngx-material-timepicker-face",template:'<div class="clock-face" #clockFace>\n    <div *ngIf="unit !== timeUnit.MINUTE;else minutesFace" class="clock-face__container">\n        <div class="clock-face__number clock-face__number--outer"\n             [style.transform]="\'rotateZ(\'+ time.angle +\'deg) translateX(-50%)\' | styleSanitizer"\n             *ngFor="let time of faceTime.slice(0, 12); trackBy: trackByTime">\n\t\t\t<span [style.transform]="\'rotateZ(-\'+ time.angle +\'deg)\' | styleSanitizer"\n                  [ngClass]="{\'active\': isHourSelected(time.time), \'disabled\': time.disabled}">{{time.time}}</span>\n        </div>\n        <div class="clock-face__inner" *ngIf="faceTime.length > 12"\n             [style.top]="\'calc(50% - \' + innerClockFaceSize + \'px)\'">\n            <div class="clock-face__number clock-face__number--inner"\n                 [style.transform]="\'rotateZ(\'+ time.angle +\'deg) translateX(-50%)\' | styleSanitizer"\n                 [style.height.px]="innerClockFaceSize"\n                 *ngFor="let time of faceTime.slice(12, 24); trackBy: trackByTime">\n\t\t\t<span [style.transform]="\'rotateZ(-\'+ time.angle +\'deg)\' | styleSanitizer"\n                  [ngClass]="{\'active\': isHourSelected(time.time), \'disabled\': time.disabled}">\n                {{time.time === 0 ? \'00\' : time.time}}</span>\n            </div>\n        </div>\n    </div>\n\n    <span class="clock-face__clock-hand" [ngClass]="{\'clock-face__clock-hand_minute\': unit === timeUnit.MINUTE}"\n          #clockHand [hidden]="isClockFaceDisabled"></span>\n</div>\n<ng-template #minutesFace>\n    <div class="clock-face__container">\n        <div class="clock-face__number clock-face__number--outer"\n             [style.transform]="\'rotateZ(\'+ time.angle +\'deg) translateX(-50%)\' | styleSanitizer"\n             *ngFor="let time of faceTime; trackBy: trackByTime">\n\t<span [style.transform]="\'rotateZ(-\'+ time.angle +\'deg)\' | styleSanitizer"\n          [ngClass]="{\'active\': isMinuteSelected(time.time), \'disabled\': time.disabled}">\n\t{{time.time === 0 ? \'00\' : time.time | minutesFormatter: minutesGap}}</span>\n        </div>\n    </div>\n</ng-template>\n',changeDetection:s.ChangeDetectionStrategy.OnPush,styles:[".clock-face{width:290px;height:290px;border-radius:50%;position:relative;display:flex;justify-content:center;padding:20px;box-sizing:border-box;background-color:#f0f0f0}@supports (background-color:var(--clock-face-background-color)){.clock-face{background-color:var(--clock-face-background-color)}}.clock-face__inner{position:absolute}.clock-face__container{margin-left:-2px}.clock-face__number{position:absolute;-webkit-transform-origin:0 100%;transform-origin:0 100%;width:50px;text-align:center;z-index:2}.clock-face__number--outer{height:calc(290px / 2 - 20px)}.clock-face__number--outer>span{font-size:16px;color:#6c6c6c}@supports (color:var(--clock-face-time-inactive-color)){.clock-face__number--outer>span{color:var(--clock-face-time-inactive-color)}}.clock-face__number--inner>span{font-size:14px;color:#929292}@supports (color:var(--clock-face-inner-time-inactive-color)){.clock-face__number--inner>span{color:var(--clock-face-inner-time-inactive-color)}}.clock-face__number>span{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;width:30px;height:30px;display:flex;justify-content:center;align-items:center;margin:auto;border-radius:50%;font-weight:500;font-family:Roboto,sans-serif}@supports (font-family:var(--primary-font-family)){.clock-face__number>span{font-family:var(--primary-font-family)}}.clock-face__number>span.active{background-color:#00bfff;color:#fff}@supports (background-color:var(--clock-hand-color)){.clock-face__number>span.active{background-color:var(--clock-hand-color);color:var(--clock-face-time-active-color)}}.clock-face__number>span.disabled{color:#c5c5c5}@supports (color:var(--clock-face-time-disabled-color)){.clock-face__number>span.disabled{color:var(--clock-face-time-disabled-color)}}.clock-face__clock-hand{height:103px;width:2px;-webkit-transform-origin:0 100%;transform-origin:0 100%;position:absolute;top:calc(50% - 103px);z-index:1;background-color:#00bfff}@supports (background-color:var(--clock-hand-color)){.clock-face__clock-hand{background-color:var(--clock-hand-color)}}.clock-face__clock-hand:after{content:'';width:7px;height:7px;border-radius:50%;background-color:inherit;position:absolute;bottom:-3px;left:-3.5px}.clock-face__clock-hand_minute:before{content:'';width:7px;height:7px;background-color:#fff;border-radius:50%;position:absolute;top:-8px;left:calc(50% - 8px);box-sizing:content-box;border:4px solid #00bfff}@supports (border-color:var(--clock-hand-color)){.clock-face__clock-hand_minute:before{border-color:var(--clock-hand-color)}}@media (max-device-width:1023px) and (orientation:landscape){.clock-face{width:225px;height:225px;padding:5px}.clock-face__number--outer{height:calc(225px / 2 - 5px)}.clock-face__clock-hand_minute:before{top:0}}"]}]}],e.propDecorators={faceTime:[{type:s.Input}],selectedTime:[{type:s.Input}],unit:[{type:s.Input}],format:[{type:s.Input}],minutesGap:[{type:s.Input}],timeChange:[{type:s.Output}],timeSelected:[{type:s.Output}],clockFace:[{type:s.ViewChild,args:["clockFace"]}],clockHand:[{type:s.ViewChild,args:["clockHand"]}],onMousedown:[{type:s.HostListener,args:["mousedown",["$event"]]}],selectTime:[{type:s.HostListener,args:["click",["$event"]]},{type:s.HostListener,args:["touchmove",["$event.changedTouches[0]"]]},{type:s.HostListener,args:["touchend",["$event.changedTouches[0]"]]},{type:s.HostListener,args:["mousemove",["$event"]]}],onMouseup:[{type:s.HostListener,args:["mouseup",["$event"]]}]},e}();function K(e,t){return Math.round(e/t)*t}var G=function(){function e(){}return e.decorators=[{type:s.Component,args:[{selector:"ngx-material-timepicker-button",template:'<button class="timepicker-button" type="button">\n  <span><ng-content></ng-content></span>\n</button>\n',styles:[".timepicker-button{display:inline-block;height:36px;min-width:88px;line-height:36px;border:12px;border-radius:2px;background-color:transparent;text-align:center;transition:450ms cubic-bezier(.23,1,.32,1);overflow:hidden;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;position:relative;cursor:pointer;outline:0;color:#00bfff}@supports (color:var(--button-color)){.timepicker-button{color:var(--button-color)}}.timepicker-button:focus,.timepicker-button:hover{background-color:rgba(153,153,153,.2)}.timepicker-button>span{font-size:14px;text-transform:uppercase;font-weight:600;padding-left:16px;padding-right:16px;font-family:Roboto,sans-serif}@supports (font-family:var(--primary-font-family)){.timepicker-button>span{font-family:var(--primary-font-family)}}"]}]}],e}(),q=function(){function e(){this.timeUnit=C,this.periodChanged=new s.EventEmitter,this.timeUnitChanged=new s.EventEmitter,this.hourChanged=new s.EventEmitter,this.minuteChanged=new s.EventEmitter}return e.prototype.ngOnChanges=function(e){if(e.period&&e.period.currentValue||e.format&&e.format.currentValue){var t=U(this.format);this.hours=j(t,{min:this.minTime,max:this.maxTime,format:this.format,period:this.period})}if(e.period&&e.period.currentValue||e.hour&&e.hour.currentValue){var i=A(this.minutesGap);this.minutes=L(i,+this.hour,{min:this.minTime,max:this.maxTime,format:this.format,period:this.period})}},e.prototype.changeTimeUnit=function(e){this.timeUnitChanged.next(e)},e.prototype.changePeriod=function(e){this.periodChanged.next(e)},e.prototype.changeHour=function(e){this.hourChanged.next(e)},e.prototype.changeMinute=function(e){this.minuteChanged.next(e)},e.prototype.showHint=function(){this.isHintVisible=!0},e.prototype.hideHint=function(){this.isHintVisible=!1},e.decorators=[{type:s.Component,args:[{selector:"ngx-material-timepicker-dial",template:'<div class="timepicker-dial">\n    <div class="timepicker-dial__container">\n        <div class="timepicker-dial__time">\n            <ngx-material-timepicker-dial-control [timeList]="hours" [time]="hour" [timeUnit]="timeUnit.HOUR"\n                                                  [isActive]="activeTimeUnit === timeUnit.HOUR"\n                                                  [isEditable]="isEditable"\n                                                  (timeUnitChanged)="changeTimeUnit($event)"\n                                                  (timeChanged)="changeHour($event)"\n                                                  (focused)="showHint()"\n                                                  (unfocused)="hideHint()">\n\n            </ngx-material-timepicker-dial-control>\n            <span>:</span>\n            <ngx-material-timepicker-dial-control [timeList]="minutes" [time]="minute" [timeUnit]="timeUnit.MINUTE"\n                                                  [isActive]="activeTimeUnit === timeUnit.MINUTE"\n                                                  [isEditable]="isEditable"\n                                                  [minutesGap]="minutesGap"\n                                                  (timeUnitChanged)="changeTimeUnit($event)"\n                                                  (timeChanged)="changeMinute($event)"\n                                                  (focused)="showHint()"\n                                                  (unfocused)="hideHint()">\n\n            </ngx-material-timepicker-dial-control>\n        </div>\n        <ngx-material-timepicker-period class="timepicker-dial__period"\n                                        [ngClass]="{\'timepicker-dial__period--hidden\': format === 24}"\n                                        [selectedPeriod]="period" [activeTimeUnit]="activeTimeUnit"\n                                        [maxTime]="maxTime" [minTime]="minTime" [format]="format"\n                                        [hours]="hours" [minutes]="minutes" [selectedHour]="hour"\n                                        (periodChanged)="changePeriod($event)"></ngx-material-timepicker-period>\n    </div>\n</div>\n',changeDetection:s.ChangeDetectionStrategy.OnPush,styles:[".timepicker-dial{text-align:right}.timepicker-dial__container{display:flex;align-items:center;justify-content:flex-end;-webkit-tap-highlight-color:transparent}.timepicker-dial__time{display:flex;align-items:baseline;line-height:normal;font-size:50px;color:rgba(255,255,255,.5);font-family:Roboto,sans-serif}@supports (font-family:var(--primary-font-family)){.timepicker-dial__time{font-family:var(--primary-font-family);color:var(--dial-inactive-color)}}.timepicker-dial__period{display:block;margin-left:10px}.timepicker-dial__hint-container--hidden,.timepicker-dial__period--hidden{visibility:hidden}.timepicker-dial__hint{display:inline-block;font-size:10px;color:#fff}@supports (color:var(--dial-active-color)){.timepicker-dial__hint{color:var(--dial-active-color)}}.timepicker-dial__hint span{font-size:14px}@media (max-device-width:1023px) and (orientation:landscape){.timepicker-dial__container{flex-direction:column}.timepicker-dial__period{margin-left:0}}"]}]}],e.propDecorators={editableHintTmpl:[{type:s.Input}],hour:[{type:s.Input}],minute:[{type:s.Input}],format:[{type:s.Input}],period:[{type:s.Input}],activeTimeUnit:[{type:s.Input}],minTime:[{type:s.Input}],maxTime:[{type:s.Input}],isEditable:[{type:s.Input}],minutesGap:[{type:s.Input}],periodChanged:[{type:s.Output}],timeUnitChanged:[{type:s.Output}],hourChanged:[{type:s.Output}],minuteChanged:[{type:s.Output}]},e}(),Y=function(){function e(){}return e.prototype.transform=function(e,t){if(e===undefined)return e;switch(t){case C.HOUR:return a.DateTime.fromObject({hour:e}).toFormat("HH");case C.MINUTE:return a.DateTime.fromObject({minute:e}).toFormat("mm");default:throw new Error("no such time unit")}},e.decorators=[{type:s.Pipe,args:[{name:"timeFormatter"}]}],e}(),Z=function(){function e(e){var t=this;this.TimepickerService=e,this.shouldFocus=!1,this.timeUnitChanged=new s.EventEmitter,this.timeChanged=new s.EventEmitter,this.focused=new s.EventEmitter,this.unfocused=new s.EventEmitter,this.eventListener=this.TimepickerService.keyboardClick.subscribe(function(e){t.isActive&&t.isEditable&&t.onKeyDown(e)})}return e.prototype.blurAll=function(e){S.blurAll(),e.preventDefault()},Object.defineProperty(e.prototype,"selectedTime",{get:function(){var t=this;if(this.time)return this.timeList.find(function(e){return e.time===+t.time})},enumerable:!0,configurable:!0}),e.prototype.ngOnChanges=function(e){if(e.time&&e.time.currentValue!==undefined){if(this.isEditable&&!e.time.firstChange)return;this.time=(new Y).transform(+e.time.currentValue,this.timeUnit)}},e.prototype.saveTimeAndChangeTimeUnit=function(e,t){e.preventDefault(),this.previousTime=this.time,this.timeUnitChanged.next(t),this.focused.next()},e.prototype.updateTime=function(){this.time=parseInt(this.time,10).toString().padStart(2,"0");var e=this.selectedTime;e&&(this.timeChanged.next(e),this.previousTime=e.time)},e.prototype.formatTime=function(){if(this.isEditable){var e=this.time||this.previousTime;this.time=(new Y).transform(+e,this.timeUnit),this.unfocused.next()}},e.prototype.onKeyDown=function(i){var n=this,e=i.key||String.fromCharCode(i.which||i.keyCode);if(function r(t){if([46,8,9,27,13].some(function(e){return e===t.keyCode})||65==t.keyCode&&(!0===t.ctrlKey||!0===t.metaKey)||67==t.keyCode&&(!0===t.ctrlKey||!0===t.metaKey)||88==t.keyCode&&(!0===t.ctrlKey||!0===t.metaKey)||35<=t.keyCode&&t.keyCode<=40)return!0;return!((t.keyCode<48||57<t.keyCode)&&(t.keyCode<96||105<t.keyCode))}(i))if(46!==i.keyCode&&8!==i.keyCode||(this.time=(this.time+"").substr(0,this.time.length-1)||"0",e=""),function a(e,t,i){if(/\d/.test(t)){var n=e+t;return X(n,i)}}(this.time,e,this.timeList))X(e,this.timeList)||(i.preventDefault(),this.time=e,this.updateTime(),this.formatTime(),this.shouldFocus=!0);else{i.preventDefault(),this.time+=e,this.updateTime(),this.formatTime();var o=i.target||this.inputElement.nativeElement;(this.shouldFocus||9===i.keyCode)&&setTimeout(function(){try{var e=o.parentNode.nextSibling.nextSibling.childNodes.item(0);n.unfocused.emit(),e.focus()}catch(i){try{var t=o.parentNode.previousSibling.previousSibling.childNodes.item(0);n.unfocused.emit(),t.focus()}catch(i){}}n.formatTime()},0),this.shouldFocus=!1}else this.shouldFocus=!1,i.preventDefault()},e.prototype.ngOnDestroy=function(){this.eventListener.unsubscribe()},e.decorators=[{type:s.Component,args:[{selector:"ngx-material-timepicker-dial-control",template:'\x3c!--suppress HtmlFormInputWithoutLabel --\x3e\n<input #inputElement class="timepicker-dial__control timepicker-dial__item"\n       [ngClass]="{\'timepicker-dial__item_active\': isActive, \'timepicker-dial__control_editable\': isEditable}"\n       [(ngModel)]="time" (focus)="saveTimeAndChangeTimeUnit($event, timeUnit)" (focusin)="blurAll($event)"\n       (blur)="formatTime()" [timepickerAutofocus]="isActive" (keydown)="onKeyDown($event)" [readonly]="true">\n',styles:[".timepicker-dial__item{cursor:pointer;color:rgba(255,255,255,.5);font-family:Roboto,sans-serif}@supports (font-family:var(--primary-font-family)){.timepicker-dial__item{font-family:var(--primary-font-family);color:var(--dial-inactive-color)}}.timepicker-dial__item_active{color:#fff}@supports (color:var(--dial-active-color)){.timepicker-dial__item_active{color:var(--dial-active-color)}}.timepicker-dial__control{border:none;background-color:transparent;font-size:50px;width:60px;padding:0;border-radius:3px}.timepicker-dial__control_editable:focus{color:#00bfff;background-color:#fff;outline:#00bfff}"]}]}],e.ctorParameters=function(){return[{type:_}]},e.propDecorators={timeList:[{type:s.Input}],timeUnit:[{type:s.Input}],time:[{type:s.Input}],isActive:[{type:s.Input}],isEditable:[{type:s.Input}],minutesGap:[{type:s.Input}],timeUnitChanged:[{type:s.Output}],timeChanged:[{type:s.Output}],focused:[{type:s.Output}],unfocused:[{type:s.Output}],inputElement:[{type:s.ViewChild,args:["inputElement"]}]},e}();function X(t,e){var i=e.find(function(e){return e.time===+t});return!i||i&&i.disabled}var J=function(){function e(){this.timePeriod=d,this.isPeriodAvailable=!0,this.periodChanged=new s.EventEmitter}return e.prototype.changePeriod=function(e){this.isPeriodAvailable=this.isSwitchPeriodAvailable(e),this.isPeriodAvailable&&this.periodChanged.next(e)},e.prototype.animationDone=function(){this.isPeriodAvailable=!0},e.prototype.isSwitchPeriodAvailable=function(e){return!this.getDisabledTimeByPeriod(e).every(function(e){return e.disabled})},e.prototype.getDisabledTimeByPeriod=function(e){switch(this.activeTimeUnit){case C.HOUR:return j(this.hours,{min:this.minTime,max:this.maxTime,format:this.format,period:e});case C.MINUTE:return L(this.minutes,+this.selectedHour,{min:this.minTime,max:this.maxTime,format:this.format,period:e});default:throw new Error("no such TimeUnit")}},e.decorators=[{type:s.Component,args:[{selector:"ngx-material-timepicker-period",template:'<div class="timepicker-period">\n\t\t\t<button class="timepicker-dial__item timepicker-period__btn"\n                  [ngClass]="{\'timepicker-dial__item_active\': selectedPeriod === timePeriod.AM}"\n                  (click)="changePeriod(timePeriod.AM)"\n                  type="button">AM</button>\n    <button class="timepicker-dial__item timepicker-period__btn"\n          [ngClass]="{\'timepicker-dial__item_active\': selectedPeriod === timePeriod.PM}"\n          (click)="changePeriod(timePeriod.PM)"\n          type="button">PM</button>\n    <div class="timepicker-period__warning" [@scaleInOut] (@scaleInOut.done)="animationDone()" *ngIf="!isPeriodAvailable">\n        <p>Current time would be invalid in this period.</p>\n    </div>\n</div>\n',animations:[i.trigger("scaleInOut",[i.transition(":enter",[i.style({transform:"scale(0)"}),i.animate(".2s",i.style({transform:"scale(1)"})),i.sequence([i.animate("3s",i.style({opacity:1})),i.animate(".3s",i.style({opacity:0}))])])])],styles:[".timepicker-dial__item{cursor:pointer;color:rgba(255,255,255,.5);font-family:Roboto,sans-serif}@supports (font-family:var(--primary-font-family)){.timepicker-dial__item{font-family:var(--primary-font-family);color:var(--dial-inactive-color)}}.timepicker-dial__item_active{color:#fff}@supports (color:var(--dial-active-color)){.timepicker-dial__item_active{color:var(--dial-active-color)}}.timepicker-period{display:flex;flex-direction:column;position:relative}.timepicker-period__btn{padding:1px 3px;border:0;background-color:transparent;font-size:18px;font-weight:500;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;outline:0;border-radius:3px;transition:background-color .5s;font-family:Roboto,sans-serif}.timepicker-period__btn:focus{background-color:rgba(0,0,0,.07)}.timepicker-period__warning{padding:5px 10px;border-radius:3px;background-color:rgba(0,0,0,.55);color:#fff;position:absolute;width:200px;left:-20px;top:40px}.timepicker-period__warning>p{margin:0;font-size:12px;font-family:Roboto,sans-serif}@supports (font-family:var(--primary-font-family)){.timepicker-period__btn,.timepicker-period__warning>p{font-family:var(--primary-font-family)}}"]}]}],e.propDecorators={selectedPeriod:[{type:s.Input}],format:[{type:s.Input}],activeTimeUnit:[{type:s.Input}],hours:[{type:s.Input}],minutes:[{type:s.Input}],minTime:[{type:s.Input}],maxTime:[{type:s.Input}],selectedHour:[{type:s.Input}],periodChanged:[{type:s.Output}]},e}(),W=function(){function e(e){this.domSanitizer=e}return e.prototype.transform=function(e){return e?this.domSanitizer.bypassSecurityTrustStyle(e):e},e.decorators=[{type:s.Pipe,args:[{name:"styleSanitizer"}]}],e.ctorParameters=function(){return[{type:r.DomSanitizer}]},e}(),Q=function(){function e(e){this.eventService=e}return e.prototype.onClick=function(e){this.preventClick||this.eventService.dispatchEvent(e),e.preventDefault()},e.decorators=[{type:s.Directive,args:[{selector:"[overlay]"}]}],e.ctorParameters=function(){return[{type:w}]},e.propDecorators={preventClick:[{type:s.Input,args:["overlay"]}],onClick:[{type:s.HostListener,args:["click",["$event"]]}]},e}(),ee=function(){function e(){}return e.prototype.transform=function(e,t){return void 0===t&&(t=5),e?e%t==0?e:"":e},e.decorators=[{type:s.Pipe,args:[{name:"minutesFormatter"}]}],e}(),te=function(){function e(e,t){this.element=e,this.document=t,this.activeElement=this.document.activeElement}return e.prototype.ngOnChanges=function(){var e=this;this.isFocusActive&&setTimeout(function(){return e.element.nativeElement.focus()})},e.prototype.ngOnDestroy=function(){var e=this;setTimeout(function(){return e.activeElement.focus()})},e.decorators=[{type:s.Directive,args:[{selector:"[timepickerAutofocus]"}]}],e.ctorParameters=function(){return[{type:s.ElementRef},{type:undefined,decorators:[{type:s.Optional},{type:s.Inject,args:[c.DOCUMENT]}]}]},e.propDecorators={isFocusActive:[{type:s.Input,args:["timepickerAutofocus"]}]},e}(),ie=function(){function e(){var t=this;this.keyPressed=new s.EventEmitter,this.onKeyPress=function(e){t.keyPressed.emit(e)}}return e.prototype.ngAfterViewInit=function(){var t=this;this.keyboard=new p({onKeyPress:function(e){return t.onKeyPress(e)},layout:{"default":["1 2 3","4 5 6","7 8 9",". 0 Backspace"]},theme:"hg-theme-default hg-layout-numeric numeric-theme",display:{Backspace:'<i _ngcontent-c1 class="decontimepicker-backspace"></i>'}})},e.decorators=[{type:s.Component,args:[{selector:"timepicker-numpad",encapsulation:s.ViewEncapsulation.None,template:'<div style="text-align:center">\n    <div class="simple-keyboard"></div>\n</div>\n',styles:[".simple-keyboard{max-width:850px}"]}]}],e.ctorParameters=function(){return[]},e.propDecorators={keyPressed:[{type:s.Output}]},e}(),ne=function(){function e(){}return e.decorators=[{type:s.NgModule,args:[{imports:[c.CommonModule,t.FormsModule],exports:[S,P,M,O,D],declarations:[S,F,N,V,R,P,G,q,Z,J,ie,W,Y,M,Q,O,te,ee,D]}]}],e}();e.NgxMaterialTimepickerModule=ne,e.NgxMaterialTimepickerThemeDirective=D,e.NgxMaterialTimepickerToggleIconDirective=O,e.TimepickerDirective=M,e.AnimationState=E,e.KeyboardTypes=I,e.NgxMaterialTimepickerComponent=S,e.ɵf=N,e.ɵd=F,e.ɵi=G,e.ɵk=Z,e.ɵj=q,e.ɵh=R,e.ɵe=z,e.ɵg=V,e.ɵm=ie,e.ɵl=J,e.ɵc=P,e.ɵq=te,e.ɵp=Q,e.ɵr=ee,e.ɵn=W,e.ɵo=Y,e.ɵb=w,e.ɵa=_,Object.defineProperty(e,"__esModule",{value:!0})});
//# sourceMappingURL=ngx-material-timepicker-decon.umd.min.js.map