ngnz-time-input/ngnz-time-input.metadata.json

Material design time input for Angular 8

{"__symbolic":"module","version":4,"metadata":{"TimeValueType":{"__symbolic":"interface"},"TimeValue":{"__symbolic":"class","members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","name":"TimeInputMode"}]}],"setHours":[{"__symbolic":"method"}],"setMinutes":[{"__symbolic":"method"}],"setSeconds":[{"__symbolic":"method"}],"setValue":[{"__symbolic":"method"}],"_setPart":[{"__symbolic":"method"}]}},"TimeInputMode":{"Circular":0,"CircularForwarding":1,"Limit":2},"NgnzTimeInputInlineComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":40,"character":1},"arguments":[{"selector":"ngnz-time-input-inline","changeDetection":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectionStrategy","line":44,"character":21},"member":"OnPush"},"providers":[{"provide":{"__symbolic":"reference","module":"@angular/material","name":"MatFormFieldControl","line":47,"character":21},"useExisting":{"__symbolic":"reference","name":"NgnzTimeInputInlineComponent"}}],"template":"<div class=\"ngnz-time-group\" [formGroup]=\"parts\">\n    &nbsp;\n    <div class=\"ngnz-hours-block\">\n        <button\n            *ngIf=\"showButtons || (!noButtons && focused)\"\n            class=\"ngnz-button\"\n            [ngClass]=\"buttonDecreaseClassesConf\"\n            (click)=\"btnDecrease($event, 'hours')\"\n        >\n            <mat-icon class=\"ngnz-square-1em\">{{\n                decreaseBtnIconName\n            }}</mat-icon>\n        </button>\n        <input\n            #hours\n            class=\"ngnz-hours ngnz-width-2em\"\n            formControlName=\"hours\"\n            readonly\n            [matTooltip]=\"focused ? 'используйте колесо прокрутки' : ''\"\n            [ngClass]=\"inputClassesConf\"\n            (wheel)=\"wheel($event, 'hours')\"\n        />\n        <button\n            *ngIf=\"showButtons || (!noButtons && focused)\"\n            class=\"ngnz-button\"\n            [ngClass]=\"buttonIncreaseClassesConf\"\n            (click)=\"btnIncrease($event, 'hours')\"\n        >\n            <mat-icon class=\"ngnz-square-1em\">{{\n                increaseBtnIconName\n            }}</mat-icon>\n        </button>\n    </div>\n\n    <div class=\"ngnz-splitter\">{{ splitter }}</div>\n\n    <div class=\"ngnz-minutes-block\">\n        <button\n            *ngIf=\"showButtons || (!noButtons && focused)\"\n            class=\"ngnz-button\"\n            [ngClass]=\"buttonDecreaseClassesConf\"\n            (click)=\"btnDecrease($event, 'minutes')\"\n        >\n            <mat-icon class=\"ngnz-square-1em\">{{\n                decreaseBtnIconName\n            }}</mat-icon>\n        </button>\n        <input\n            #minutes\n            class=\"ngnz-minutes ngnz-width-2em\"\n            formControlName=\"minutes\"\n            readonly\n            [matTooltip]=\"focused ? 'используйте колесо прокрутки' : ''\"\n            [ngClass]=\"inputClassesConf\"\n            (wheel)=\"wheel($event, 'minutes')\"\n        />\n        <button\n            *ngIf=\"showButtons || (!noButtons && focused)\"\n            class=\"ngnz-button\"\n            [ngClass]=\"buttonIncreaseClassesConf\"\n            (click)=\"btnIncrease($event, 'minutes')\"\n        >\n            <mat-icon class=\"ngnz-square-1em\">{{\n                increaseBtnIconName\n            }}</mat-icon>\n        </button>\n    </div>\n\n    <div class=\"ngnz-splitter\" *ngIf=\"!noSeconds\">{{ splitter }}</div>\n\n    <div class=\"ngnz-seconds-block\" *ngIf=\"!noSeconds\">\n        <button\n            *ngIf=\"showButtons || (!noButtons && focused)\"\n            class=\"ngnz-button\"\n            [ngClass]=\"buttonDecreaseClassesConf\"\n            (click)=\"btnDecrease($event, 'seconds')\"\n        >\n            <mat-icon class=\"ngnz-square-1em\">{{\n                decreaseBtnIconName\n            }}</mat-icon>\n        </button>\n        <input\n            #seconds\n            class=\"ngnz-seconds ngnz-width-2em\"\n            formControlName=\"seconds\"\n            readonly\n            [matTooltip]=\"focused ? 'используйте колесо прокрутки' : ''\"\n            [ngClass]=\"inputClassesConf\"\n            (wheel)=\"wheel($event, 'seconds')\"\n        />\n        <button\n            *ngIf=\"showButtons || (!noButtons && focused)\"\n            class=\"ngnz-button\"\n            [ngClass]=\"buttonIncreaseClassesConf\"\n            (click)=\"btnIncrease($event, 'seconds')\"\n        >\n            <mat-icon class=\"ngnz-square-1em\">{{\n                increaseBtnIconName\n            }}</mat-icon>\n        </button>\n    </div>\n    &nbsp;\n</div>\n","styles":[".ngnz-time-group{display:flex!important;justify-content:center!important;align-items:center!important;padding:0!important}.ngnz-time-group .ngnz-hours-block,.ngnz-time-group .ngnz-minutes-block,.ngnz-time-group .ngnz-seconds-block,.ngnz-time-group .ngnz-splitter{display:flex!important;align-items:center!important;justify-content:center!important;flex-direction:row!important}.ngnz-time-group .ngnz-hours-block .ngnz-hours,.ngnz-time-group .ngnz-hours-block .ngnz-minutes,.ngnz-time-group .ngnz-hours-block .ngnz-seconds,.ngnz-time-group .ngnz-minutes-block .ngnz-hours,.ngnz-time-group .ngnz-minutes-block .ngnz-minutes,.ngnz-time-group .ngnz-minutes-block .ngnz-seconds,.ngnz-time-group .ngnz-seconds-block .ngnz-hours,.ngnz-time-group .ngnz-seconds-block .ngnz-minutes,.ngnz-time-group .ngnz-seconds-block .ngnz-seconds,.ngnz-time-group .ngnz-splitter .ngnz-hours,.ngnz-time-group .ngnz-splitter .ngnz-minutes,.ngnz-time-group .ngnz-splitter .ngnz-seconds{color:inherit;border:none;outline:0;font:inherit;text-align:center!important;vertical-align:middle!important;padding:0!important}.ngnz-time-group .ngnz-hours-block .ngnz-button,.ngnz-time-group .ngnz-minutes-block .ngnz-button,.ngnz-time-group .ngnz-seconds-block .ngnz-button,.ngnz-time-group .ngnz-splitter .ngnz-button{cursor:pointer;padding:0!important;font-weight:700;display:flex!important;justify-content:center!important;align-items:center!important;line-height:inherit!important;font-size:inherit!important;box-sizing:border-box;position:relative;top:0}.ngnz-time-group .ngnz-hours-block .ngnz-button ::ng-deep .mat-button-wrapper,.ngnz-time-group .ngnz-minutes-block .ngnz-button ::ng-deep .mat-button-wrapper,.ngnz-time-group .ngnz-seconds-block .ngnz-button ::ng-deep .mat-button-wrapper,.ngnz-time-group .ngnz-splitter .ngnz-button ::ng-deep .mat-button-wrapper{line-height:inherit!important;padding:0!important}.ngnz-time-group .ngnz-hours-block .ngnz-button ::ng-deep .mat-button-base,.ngnz-time-group .ngnz-minutes-block .ngnz-button ::ng-deep .mat-button-base,.ngnz-time-group .ngnz-seconds-block .ngnz-button ::ng-deep .mat-button-base,.ngnz-time-group .ngnz-splitter .ngnz-button ::ng-deep .mat-button-base{min-width:inherit!important}.ngnz-time-group .ngnz-splitter{opacity:0;min-width:1em!important;transition:opacity .2s!important}:host.floating .ngnz-splitter{opacity:1}.ngnz-lr-margin-1em{margin-left:1em;margin-right:1em}.ngnz-square-1em,.ngnz-time-group .ngnz-hours-block .ngnz-button,.ngnz-time-group .ngnz-minutes-block .ngnz-button,.ngnz-time-group .ngnz-seconds-block .ngnz-button,.ngnz-time-group .ngnz-splitter .ngnz-button,.ngnz-width-1em{width:1em!important;min-width:1em!important}.ngnz-height-1em,.ngnz-square-1em,.ngnz-time-group .ngnz-hours-block .ngnz-button,.ngnz-time-group .ngnz-minutes-block .ngnz-button,.ngnz-time-group .ngnz-seconds-block .ngnz-button,.ngnz-time-group .ngnz-splitter .ngnz-button{height:1em!important;min-height:1em!important}.ngnz-width-2em{width:2em!important;min-width:2em!important}.ngnz-height-2em{height:2em!important;min-height:2em!important}.material-icons{font-size:inherit!important}"]}]}],"members":{"id":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostBinding","line":95,"character":5}}]}],"describedBy":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostBinding","line":99,"character":5},"arguments":["attr.aria-describedby"]}]}],"shouldLabelFloat":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostBinding","line":100,"character":5},"arguments":["class.floating"]}]}],"color":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":106,"character":5}}]}],"buttonMatType":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":110,"character":5}}]}],"inputClasses":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":115,"character":5}}]}],"buttonsClasses":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":120,"character":5}}]}],"buttonDecreaseClasses":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":123,"character":5}}]}],"buttonIncreaseClasses":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":126,"character":5}}]}],"placeholder":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":134,"character":5}}]}],"inputMode":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":144,"character":5}}]}],"value":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":146,"character":5}}]}],"required":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":166,"character":5}}]}],"disabled":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":174,"character":5}}]}],"splitter":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":185,"character":5}}]}],"noButtons":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":195,"character":5}}]}],"showButtons":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":198,"character":5}}]}],"noSeconds":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":201,"character":5}}]}],"decreaseBtnIconName":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":204,"character":5}}]}],"increaseBtnIconName":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":207,"character":5}}]}],"timeChange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":209,"character":5}}]}],"_onChange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostListener","line":216,"character":5},"arguments":["timeChange",["$event"]]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostListener","line":217,"character":5},"arguments":["change",["$event"]]}]}],"__ctor__":[{"__symbolic":"constructor","parameterDecorators":[null,null,null,[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Optional","line":225,"character":9}},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Self","line":225,"character":21}}]],"parameters":[{"__symbolic":"reference","module":"@angular/cdk/a11y","name":"FocusMonitor","line":222,"character":23},{"__symbolic":"reference","name":"ElementRef","module":"@angular/core","arguments":[{"__symbolic":"error","message":"Could not resolve type","line":223,"character":37,"context":{"typeName":"HTMLElement"},"module":"./lib/components/ngnz-time-input-inline/ngnz-time-input-inline.component"}]},{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectorRef","line":224,"character":31},{"__symbolic":"reference","module":"@angular/forms","name":"NgControl","line":225,"character":46}]}],"ngOnInit":[{"__symbolic":"method"}],"ngDoCheck":[{"__symbolic":"method"}],"ngOnDestroy":[{"__symbolic":"method"}],"detectChangies":[{"__symbolic":"method"}],"setDescribedByIds":[{"__symbolic":"method"}],"onContainerClick":[{"__symbolic":"method"}],"writeValue":[{"__symbolic":"method"}],"registerOnChange":[{"__symbolic":"method"}],"registerOnTouched":[{"__symbolic":"method"}],"setDisabledState":[{"__symbolic":"method"}],"btnsAction":[{"__symbolic":"method"}],"btnIncrease":[{"__symbolic":"method"}],"btnDecrease":[{"__symbolic":"method"}],"padNumber":[{"__symbolic":"method"}],"wheel":[{"__symbolic":"method"}],"_cssClassChange":[{"__symbolic":"method"}],"_defineMatButtonType":[{"__symbolic":"method"}],"_defineMatButtonColor":[{"__symbolic":"method"}],"_defineCssButtons":[{"__symbolic":"method"}],"_defineCssInputs":[{"__symbolic":"method"}]},"statics":{"nextId":0}},"NgnzTimeInputInlineModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule","line":10,"character":1},"arguments":[{"declarations":[{"__symbolic":"reference","name":"NgnzTimeInputInlineComponent"}],"imports":[{"__symbolic":"reference","module":"@angular/common","name":"CommonModule","line":13,"character":8},{"__symbolic":"reference","module":"@angular/forms","name":"ReactiveFormsModule","line":14,"character":8},{"__symbolic":"reference","module":"@angular/material/button","name":"MatButtonModule","line":15,"character":8},{"__symbolic":"reference","module":"@angular/material/form-field","name":"MatFormFieldModule","line":16,"character":8},{"__symbolic":"reference","module":"@angular/material/input","name":"MatInputModule","line":17,"character":8},{"__symbolic":"reference","module":"@angular/material","name":"MatCommonModule","line":18,"character":8},{"__symbolic":"reference","module":"@angular/material","name":"MatIconModule","line":19,"character":8},{"__symbolic":"reference","module":"@angular/material","name":"MatTooltipModule","line":20,"character":8}],"exports":[{"__symbolic":"reference","name":"NgnzTimeInputInlineComponent"}]}]}],"members":{}},"CssClasses":{"__symbolic":"interface"},"CssClassesDefinition":{"__symbolic":"interface"},"BooleanFunction":{"__symbolic":"interface"},"BooleanTrigger":{"__symbolic":"interface"}},"origins":{"TimeValueType":"./lib/interfaces/time-value-type","TimeValue":"./lib/classes/time-value/time-value","TimeInputMode":"./lib/datatypes/time-input-mode.enum","NgnzTimeInputInlineComponent":"./lib/components/ngnz-time-input-inline/ngnz-time-input-inline.component","NgnzTimeInputInlineModule":"./lib/components/ngnz-time-input-inline/ngnz-time-input-inline.module","CssClasses":"./lib/datatypes/css-classes","CssClassesDefinition":"./lib/datatypes/css-classes-definition","BooleanFunction":"./lib/datatypes/boolean-function","BooleanTrigger":"./lib/datatypes/boolean-trigger"},"importAs":"ngnz-time-input"}