@taiga-ui/kit
Version:
Taiga UI Angular main components kit
49 lines • 10.1 kB
JavaScript
import { NgIf } from '@angular/common';
import { ChangeDetectionStrategy, Component, computed, inject, ViewEncapsulation, } from '@angular/core';
import { TuiControl } from '@taiga-ui/cdk/classes';
import { TuiTime } from '@taiga-ui/cdk/date-time';
import { tuiInjectElement } from '@taiga-ui/cdk/utils/dom';
import { TuiTextfieldContent, TuiTextfieldDirective, } from '@taiga-ui/core/components/textfield';
import { TuiInputTimeDirective } from './input-time.directive';
import * as i0 from "@angular/core";
class TuiInputTimeComponent {
constructor() {
this.control = inject(TuiControl);
this.list = tuiInjectElement().getAttribute('list');
this.host = inject(TuiInputTimeDirective);
this.textfield = inject(TuiTextfieldDirective);
this.value = computed((value = this.control.value()) => value
? value.toString(this.host.timeMode().replace(' AA', ''))
: '');
this.step = computed((mode = this.host.timeMode()) => {
switch (mode) {
case 'HH:MM:SS':
case 'HH:MM:SS AA':
return 1;
case 'HH:MM:SS.MSS':
case 'HH:MM:SS.MSS AA':
return 0.001;
default:
return 60;
}
});
}
setValue(value) {
const mode = this.host.timeMode();
const time = TuiTime.fromString(value);
this.control.onChange(time);
this.textfield.value.set(time.toString(mode));
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TuiInputTimeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: TuiInputTimeComponent, isStandalone: true, selector: "input[tuiInputTime][type=\"time\"]", host: { attributes: { "ngSkipHydration": "true" }, properties: { "type": "\"text\"", "attr.list": "null" } }, ngImport: i0, template: "<ng-container *ngIf=\"host.native\">\n <input\n *tuiTextfieldContent\n type=\"time\"\n [attr.list]=\"list\"\n [step]=\"step()\"\n [value]=\"value()\"\n (change)=\"setValue($any($event.target).value)\"\n />\n</ng-container>\n", styles: ["tui-textfield input[tuiInputTime]~.t-content input[type=time]{position:absolute;right:0;left:auto;inline-size:calc(var(--t-right) + var(--t-padding));opacity:0;margin:0;padding:0}tui-textfield input[tuiInputTime]~.t-content input[type=time]::-webkit-calendar-picker-indicator{position:absolute;top:0;left:0;inline-size:100%;block-size:100%}\n"], dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: TuiTextfieldContent, selector: "ng-template[tuiTextfieldContent]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
}
export { TuiInputTimeComponent };
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TuiInputTimeComponent, decorators: [{
type: Component,
args: [{ standalone: true, selector: 'input[tuiInputTime][type="time"]', imports: [NgIf, TuiTextfieldContent], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, host: {
ngSkipHydration: 'true',
'[type]': '"text"',
'[attr.list]': 'null',
}, template: "<ng-container *ngIf=\"host.native\">\n <input\n *tuiTextfieldContent\n type=\"time\"\n [attr.list]=\"list\"\n [step]=\"step()\"\n [value]=\"value()\"\n (change)=\"setValue($any($event.target).value)\"\n />\n</ng-container>\n", styles: ["tui-textfield input[tuiInputTime]~.t-content input[type=time]{position:absolute;right:0;left:auto;inline-size:calc(var(--t-right) + var(--t-padding));opacity:0;margin:0;padding:0}tui-textfield input[tuiInputTime]~.t-content input[type=time]::-webkit-calendar-picker-indicator{position:absolute;top:0;left:0;inline-size:100%;block-size:100%}\n"] }]
}] });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5wdXQtdGltZS5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9raXQvY29tcG9uZW50cy9pbnB1dC10aW1lL2lucHV0LXRpbWUuY29tcG9uZW50LnRzIiwiLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMva2l0L2NvbXBvbmVudHMvaW5wdXQtdGltZS9pbnB1dC10aW1lLnRlbXBsYXRlLmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFDLElBQUksRUFBQyxNQUFNLGlCQUFpQixDQUFDO0FBQ3JDLE9BQU8sRUFDSCx1QkFBdUIsRUFDdkIsU0FBUyxFQUNULFFBQVEsRUFDUixNQUFNLEVBQ04saUJBQWlCLEdBQ3BCLE1BQU0sZUFBZSxDQUFDO0FBRXZCLE9BQU8sRUFBQyxVQUFVLEVBQUMsTUFBTSx1QkFBdUIsQ0FBQztBQUNqRCxPQUFPLEVBQUMsT0FBTyxFQUFDLE1BQU0seUJBQXlCLENBQUM7QUFDaEQsT0FBTyxFQUFDLGdCQUFnQixFQUFDLE1BQU0seUJBQXlCLENBQUM7QUFDekQsT0FBTyxFQUNILG1CQUFtQixFQUNuQixxQkFBcUIsR0FDeEIsTUFBTSxxQ0FBcUMsQ0FBQztBQUU3QyxPQUFPLEVBQUMscUJBQXFCLEVBQUMsTUFBTSx3QkFBd0IsQ0FBQzs7QUFFN0QsTUFjYSxxQkFBcUI7SUFkbEM7UUFlcUIsWUFBTyxHQUErQixNQUFNLENBQUMsVUFBVSxDQUFDLENBQUM7UUFFdkQsU0FBSSxHQUFHLGdCQUFnQixFQUFFLENBQUMsWUFBWSxDQUFDLE1BQU0sQ0FBQyxDQUFDO1FBQy9DLFNBQUksR0FBRyxNQUFNLENBQUMscUJBQXFCLENBQUMsQ0FBQztRQUNyQyxjQUFTLEdBQUcsTUFBTSxDQUFDLHFCQUFxQixDQUFDLENBQUM7UUFDMUMsVUFBSyxHQUFHLFFBQVEsQ0FBQyxDQUFDLEtBQUssR0FBRyxJQUFJLENBQUMsT0FBTyxDQUFDLEtBQUssRUFBRSxFQUFFLEVBQUUsQ0FDakUsS0FBSztZQUNELENBQUMsQ0FBQyxLQUFLLENBQUMsUUFBUSxDQUFDLElBQUksQ0FBQyxJQUFJLENBQUMsUUFBUSxFQUFFLENBQUMsT0FBTyxDQUFDLEtBQUssRUFBRSxFQUFFLENBQW9CLENBQUM7WUFDNUUsQ0FBQyxDQUFDLEVBQUUsQ0FDWCxDQUFDO1FBRWlCLFNBQUksR0FBRyxRQUFRLENBQUMsQ0FBQyxJQUFJLEdBQUcsSUFBSSxDQUFDLElBQUksQ0FBQyxRQUFRLEVBQUUsRUFBRSxFQUFFO1lBQy9ELFFBQVEsSUFBSSxFQUFFO2dCQUNWLEtBQUssVUFBVSxDQUFDO2dCQUNoQixLQUFLLGFBQWE7b0JBQ2QsT0FBTyxDQUFDLENBQUM7Z0JBQ2IsS0FBSyxjQUFjLENBQUM7Z0JBQ3BCLEtBQUssaUJBQWlCO29CQUNsQixPQUFPLEtBQUssQ0FBQztnQkFDakI7b0JBQ0ksT0FBTyxFQUFFLENBQUM7YUFDakI7UUFDTCxDQUFDLENBQUMsQ0FBQztLQVNOO0lBUGEsUUFBUSxDQUFDLEtBQWE7UUFDNUIsTUFBTSxJQUFJLEdBQUcsSUFBSSxDQUFDLElBQUksQ0FBQyxRQUFRLEVBQUUsQ0FBQztRQUNsQyxNQUFNLElBQUksR0FBRyxPQUFPLENBQUMsVUFBVSxDQUFDLEtBQUssQ0FBQyxDQUFDO1FBRXZDLElBQUksQ0FBQyxPQUFPLENBQUMsUUFBUSxDQUFDLElBQUksQ0FBQyxDQUFDO1FBQzVCLElBQUksQ0FBQyxTQUFTLENBQUMsS0FBSyxDQUFDLEdBQUcsQ0FBQyxJQUFJLENBQUMsUUFBUSxDQUFDLElBQUksQ0FBQyxDQUFDLENBQUM7SUFDbEQsQ0FBQzsrR0EvQlEscUJBQXFCO21HQUFyQixxQkFBcUIsNE1DakNsQyxrUkFVQSxnWkRZYyxJQUFJLDZGQUFFLG1CQUFtQjs7U0FXMUIscUJBQXFCOzRGQUFyQixxQkFBcUI7a0JBZGpDLFNBQVM7aUNBQ00sSUFBSSxZQUNOLGtDQUFrQyxXQUNuQyxDQUFDLElBQUksRUFBRSxtQkFBbUIsQ0FBQyxpQkFHckIsaUJBQWlCLENBQUMsSUFBSSxtQkFDcEIsdUJBQXVCLENBQUMsTUFBTSxRQUN6Qzt3QkFDRixlQUFlLEVBQUUsTUFBTTt3QkFDdkIsUUFBUSxFQUFFLFFBQVE7d0JBQ2xCLGFBQWEsRUFBRSxNQUFNO3FCQUN4QiIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7TmdJZn0gZnJvbSAnQGFuZ3VsYXIvY29tbW9uJztcbmltcG9ydCB7XG4gICAgQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3ksXG4gICAgQ29tcG9uZW50LFxuICAgIGNvbXB1dGVkLFxuICAgIGluamVjdCxcbiAgICBWaWV3RW5jYXBzdWxhdGlvbixcbn0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQgdHlwZSB7TWFza2l0b1RpbWVNb2RlfSBmcm9tICdAbWFza2l0by9raXQnO1xuaW1wb3J0IHtUdWlDb250cm9sfSBmcm9tICdAdGFpZ2EtdWkvY2RrL2NsYXNzZXMnO1xuaW1wb3J0IHtUdWlUaW1lfSBmcm9tICdAdGFpZ2EtdWkvY2RrL2RhdGUtdGltZSc7XG5pbXBvcnQge3R1aUluamVjdEVsZW1lbnR9IGZyb20gJ0B0YWlnYS11aS9jZGsvdXRpbHMvZG9tJztcbmltcG9ydCB7XG4gICAgVHVpVGV4dGZpZWxkQ29udGVudCxcbiAgICBUdWlUZXh0ZmllbGREaXJlY3RpdmUsXG59IGZyb20gJ0B0YWlnYS11aS9jb3JlL2NvbXBvbmVudHMvdGV4dGZpZWxkJztcblxuaW1wb3J0IHtUdWlJbnB1dFRpbWVEaXJlY3RpdmV9IGZyb20gJy4vaW5wdXQtdGltZS5kaXJlY3RpdmUnO1xuXG5AQ29tcG9uZW50KHtcbiAgICBzdGFuZGFsb25lOiB0cnVlLFxuICAgIHNlbGVjdG9yOiAnaW5wdXRbdHVpSW5wdXRUaW1lXVt0eXBlPVwidGltZVwiXScsXG4gICAgaW1wb3J0czogW05nSWYsIFR1aVRleHRmaWVsZENvbnRlbnRdLFxuICAgIHRlbXBsYXRlVXJsOiAnLi9pbnB1dC10aW1lLnRlbXBsYXRlLmh0bWwnLFxuICAgIHN0eWxlVXJsczogWycuL2lucHV0LXRpbWUuc3R5bGUubGVzcyddLFxuICAgIGVuY2Fwc3VsYXRpb246IFZpZXdFbmNhcHN1bGF0aW9uLk5vbmUsXG4gICAgY2hhbmdlRGV0ZWN0aW9uOiBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneS5PblB1c2gsXG4gICAgaG9zdDoge1xuICAgICAgICBuZ1NraXBIeWRyYXRpb246ICd0cnVlJyxcbiAgICAgICAgJ1t0eXBlXSc6ICdcInRleHRcIicsXG4gICAgICAgICdbYXR0ci5saXN0XSc6ICdudWxsJyxcbiAgICB9LFxufSlcbmV4cG9ydCBjbGFzcyBUdWlJbnB1dFRpbWVDb21wb25lbnQge1xuICAgIHByaXZhdGUgcmVhZG9ubHkgY29udHJvbDogVHVpQ29udHJvbDxUdWlUaW1lIHwgbnVsbD4gPSBpbmplY3QoVHVpQ29udHJvbCk7XG5cbiAgICBwcm90ZWN0ZWQgcmVhZG9ubHkgbGlzdCA9IHR1aUluamVjdEVsZW1lbnQoKS5nZXRBdHRyaWJ1dGUoJ2xpc3QnKTtcbiAgICBwcm90ZWN0ZWQgcmVhZG9ubHkgaG9zdCA9IGluamVjdChUdWlJbnB1dFRpbWVEaXJlY3RpdmUpO1xuICAgIHByb3RlY3RlZCByZWFkb25seSB0ZXh0ZmllbGQgPSBpbmplY3QoVHVpVGV4dGZpZWxkRGlyZWN0aXZlKTtcbiAgICBwcm90ZWN0ZWQgcmVhZG9ubHkgdmFsdWUgPSBjb21wdXRlZCgodmFsdWUgPSB0aGlzLmNvbnRyb2wudmFsdWUoKSkgPT5cbiAgICAgICAgdmFsdWVcbiAgICAgICAgICAgID8gdmFsdWUudG9TdHJpbmcodGhpcy5ob3N0LnRpbWVNb2RlKCkucmVwbGFjZSgnIEFBJywgJycpIGFzIE1hc2tpdG9UaW1lTW9kZSlcbiAgICAgICAgICAgIDogJycsXG4gICAgKTtcblxuICAgIHByb3RlY3RlZCByZWFkb25seSBzdGVwID0gY29tcHV0ZWQoKG1vZGUgPSB0aGlzLmhvc3QudGltZU1vZGUoKSkgPT4ge1xuICAgICAgICBzd2l0Y2ggKG1vZGUpIHtcbiAgICAgICAgICAgIGNhc2UgJ0hIOk1NOlNTJzpcbiAgICAgICAgICAgIGNhc2UgJ0hIOk1NOlNTIEFBJzpcbiAgICAgICAgICAgICAgICByZXR1cm4gMTtcbiAgICAgICAgICAgIGNhc2UgJ0hIOk1NOlNTLk1TUyc6XG4gICAgICAgICAgICBjYXNlICdISDpNTTpTUy5NU1MgQUEnOlxuICAgICAgICAgICAgICAgIHJldHVybiAwLjAwMTtcbiAgICAgICAgICAgIGRlZmF1bHQ6XG4gICAgICAgICAgICAgICAgcmV0dXJuIDYwO1xuICAgICAgICB9XG4gICAgfSk7XG5cbiAgICBwcm90ZWN0ZWQgc2V0VmFsdWUodmFsdWU6IHN0cmluZyk6IHZvaWQge1xuICAgICAgICBjb25zdCBtb2RlID0gdGhpcy5ob3N0LnRpbWVNb2RlKCk7XG4gICAgICAgIGNvbnN0IHRpbWUgPSBUdWlUaW1lLmZyb21TdHJpbmcodmFsdWUpO1xuXG4gICAgICAgIHRoaXMuY29udHJvbC5vbkNoYW5nZSh0aW1lKTtcbiAgICAgICAgdGhpcy50ZXh0ZmllbGQudmFsdWUuc2V0KHRpbWUudG9TdHJpbmcobW9kZSkpO1xuICAgIH1cbn1cbiIsIjxuZy1jb250YWluZXIgKm5nSWY9XCJob3N0Lm5hdGl2ZVwiPlxuICAgIDxpbnB1dFxuICAgICAgICAqdHVpVGV4dGZpZWxkQ29udGVudFxuICAgICAgICB0eXBlPVwidGltZVwiXG4gICAgICAgIFthdHRyLmxpc3RdPVwibGlzdFwiXG4gICAgICAgIFtzdGVwXT1cInN0ZXAoKVwiXG4gICAgICAgIFt2YWx1ZV09XCJ2YWx1ZSgpXCJcbiAgICAgICAgKGNoYW5nZSk9XCJzZXRWYWx1ZSgkYW55KCRldmVudC50YXJnZXQpLnZhbHVlKVwiXG4gICAgLz5cbjwvbmctY29udGFpbmVyPlxuIl19