@haiilo/catalyst-angular 10.19.0 → 10.19.2

package/fesm2020/haiilo-catalyst-angular.mjs

@@ -1,5 +1,5 @@
 import * as i0 from '@angular/core';
-import { InjectionToken, Component, ChangeDetectionStrategy, ViewEncapsulation, Input, EventEmitter, Inject, Output, ContentChild, Directive, HostListener, Self, Optional, Host, SkipSelf, NgModule, Injectable } from '@angular/core';
+import { InjectionToken, Directive, HostListener, Component, ViewEncapsulation, ContentChild, Input, ChangeDetectionStrategy, EventEmitter, Inject, Output, Self, Optional, Host, SkipSelf, NgModule, Injectable } from '@angular/core';
 import * as i3 from '@haiilo/catalyst';
 import { catI18nRegistry, catIconRegistry, catNotificationService } from '@haiilo/catalyst';
 import log from 'loglevel';
@@ -8,10 +8,10 @@ import { DialogModule } from '@angular/cdk/dialog';
 import * as i1 from '@angular/common';
 import { CommonModule } from '@angular/common';
 import { defineCustomElements } from '@haiilo/catalyst/loader';
-import { __decorate } from 'tslib';
-import { fromEvent } from 'rxjs';
 import * as i1$2 from '@angular/forms';
 import { NG_VALUE_ACCESSOR, Validators } from '@angular/forms';
+import { __decorate } from 'tslib';
+import { fromEvent } from 'rxjs';
 
 // It is important to declare the InjectionTokens first
 const CAT_LOG_TOKEN = new InjectionToken('CAT_LOG', {
@@ -31,6 +31,288 @@ const CAT_NOTIFICATION_SERVICE_TOKEN = new InjectionToken('CAT_NOTIFICATION_SERV
     factory: () => catNotificationService
 });
 
+class ValueAccessor {
+    constructor(el) {
+        this.el = el;
+        this.onChange = () => { };
+        this.onTouched = () => { };
+    }
+    writeValue(value) {
+        this.el.nativeElement.value = this.lastValue = value == null ? '' : value;
+    }
+    handleChangeEvent(value) {
+        if (value !== this.lastValue) {
+            this.lastValue = value;
+            this.onChange(value);
+        }
+    }
+    _handleBlurEvent() {
+        this.onTouched();
+    }
+    registerOnChange(fn) {
+        this.onChange = fn;
+    }
+    registerOnTouched(fn) {
+        this.onTouched = fn;
+    }
+    setDisabledState(isDisabled) {
+        this.el.nativeElement.disabled = isDisabled;
+    }
+}
+ValueAccessor.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ValueAccessor, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
+ValueAccessor.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "14.3.0", type: ValueAccessor, host: { listeners: { "focusout": "_handleBlurEvent()" } }, ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ValueAccessor, decorators: [{
+            type: Directive,
+            args: [{}]
+        }], ctorParameters: function () { return [{ type: i0.ElementRef }]; }, propDecorators: { _handleBlurEvent: [{
+                type: HostListener,
+                args: ['focusout']
+            }] } });
+
+class DateValueAccessor extends ValueAccessor {
+    constructor(el) {
+        super(el);
+    }
+    get nativeElement() {
+        return this.el.nativeElement;
+    }
+    writeValue(value) {
+        if (!this.el.nativeElement.range) {
+            return super.writeValue(this.toISO(value));
+        }
+        else if (value instanceof Array) {
+            const data = [this.toISO(value[0]), this.toISO(value[1])];
+            return super.writeValue(JSON.stringify(data));
+        }
+        return super.writeValue(undefined);
+    }
+    handleChangeEvent(value) {
+        if (!this.el.nativeElement.range) {
+            return super.handleChangeEvent(this.toDate(value));
+        }
+        else if (typeof value === 'string') {
+            const data = JSON.parse(value).map(this.toDate);
+            data[1]?.setHours(23, 59, 59, 999);
+            return super.handleChangeEvent(data);
+        }
+        super.handleChangeEvent(null);
+    }
+    toISO(value) {
+        if (value instanceof Date) {
+            const year = value.getFullYear();
+            const month = (value.getMonth() + 1).toString().padStart(2, '0');
+            const day = value.getDate().toString().padStart(2, '0');
+            return `${year}-${month}-${day}`;
+        }
+        return undefined;
+    }
+    toDate(value) {
+        const [match, year, month, day] = value?.match(/^(\d{4})-(\d{2})-(\d{2})/) ?? [];
+        return match ? new Date(Number(year), Number(month) - 1, Number(day)) : null;
+    }
+}
+DateValueAccessor.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: DateValueAccessor, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
+DateValueAccessor.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "14.3.0", type: DateValueAccessor, selector: "cat-date, cat-date-inline", host: { listeners: { "catChange": "handleChangeEvent($event.target.value)" } }, providers: [
+        {
+            provide: NG_VALUE_ACCESSOR,
+            useExisting: DateValueAccessor,
+            multi: true
+        }
+    ], usesInheritance: true, ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: DateValueAccessor, decorators: [{
+            type: Directive,
+            args: [{
+                    /* tslint:disable-next-line:directive-selector */
+                    selector: 'cat-date, cat-date-inline',
+                    host: {
+                        '(catChange)': 'handleChangeEvent($event.target.value)'
+                    },
+                    providers: [
+                        {
+                            provide: NG_VALUE_ACCESSOR,
+                            useExisting: DateValueAccessor,
+                            multi: true
+                        }
+                    ]
+                }]
+        }], ctorParameters: function () { return [{ type: i0.ElementRef }]; } });
+
+class TimeValueAccessor extends ValueAccessor {
+    constructor(el) {
+        super(el);
+    }
+    get nativeElement() {
+        return this.el.nativeElement;
+    }
+    writeValue(value) {
+        if (value && value instanceof Date) {
+            const hours = value.getHours().toString().padStart(2, '0');
+            const mins = value.getMinutes().toString().padStart(2, '0');
+            return super.writeValue(`${hours}:${mins}`);
+        }
+        return super.writeValue(undefined);
+    }
+    handleChangeEvent(value) {
+        const [match, hours, mins] = value?.match(/^(\d{2}):(\d{2})/) ?? [];
+        if (match) {
+            const date = new Date();
+            date.setHours(Number(hours), Number(mins), 0, 0);
+            return super.handleChangeEvent(date);
+        }
+        return super.handleChangeEvent(null);
+    }
+}
+TimeValueAccessor.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: TimeValueAccessor, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
+TimeValueAccessor.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "14.3.0", type: TimeValueAccessor, selector: "cat-time", host: { listeners: { "catChange": "handleChangeEvent($event.target.value)" } }, providers: [
+        {
+            provide: NG_VALUE_ACCESSOR,
+            useExisting: TimeValueAccessor,
+            multi: true
+        }
+    ], usesInheritance: true, ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: TimeValueAccessor, decorators: [{
+            type: Directive,
+            args: [{
+                    /* tslint:disable-next-line:directive-selector */
+                    selector: 'cat-time',
+                    host: {
+                        '(catChange)': 'handleChangeEvent($event.target.value)'
+                    },
+                    providers: [
+                        {
+                            provide: NG_VALUE_ACCESSOR,
+                            useExisting: TimeValueAccessor,
+                            multi: true
+                        }
+                    ]
+                }]
+        }], ctorParameters: function () { return [{ type: i0.ElementRef }]; } });
+
+class DatetimeComponent {
+    get min() {
+        return this._min ?? null;
+    }
+    set min(value) {
+        this._min = value;
+        setTimeout(() => {
+            const min = value ? this.toLocalISODate(value) : undefined;
+            this.dateInput?.nativeElement.setAttribute('min', min);
+            this.limitTime('min');
+        });
+    }
+    get max() {
+        return this._max ?? null;
+    }
+    set max(value) {
+        this._max = value;
+        setTimeout(() => {
+            const max = value ? this.toLocalISODate(value) : undefined;
+            this.dateInput?.nativeElement.setAttribute('max', max);
+            this.limitTime('max');
+        });
+    }
+    ngAfterContentInit() {
+        if (!this.dateInput) {
+            throw new Error('Missing child element <cat-date></cat-date>');
+        }
+        if (!this.timeInput) {
+            throw new Error('Missing child element <cat-time></cat-time>');
+        }
+    }
+    writeValue(value) {
+        this.lastValue = this.lastDateValue = this.lastTimeValue = value;
+        setTimeout(() => {
+            this.dateInput?.writeValue(value);
+            this.timeInput?.writeValue(value);
+        });
+    }
+    registerOnChange(fn) {
+        setTimeout(() => {
+            this.dateInput?.registerOnChange((value) => {
+                this.lastDateValue = value;
+                this.limitTime('min');
+                this.limitTime('max');
+                fn(this.value);
+            });
+            this.timeInput?.registerOnChange((value) => {
+                this.lastTimeValue = value;
+                fn(this.value);
+            });
+        });
+    }
+    registerOnTouched(fn) {
+        setTimeout(() => {
+            this.dateInput?.registerOnTouched(fn);
+            this.timeInput?.registerOnTouched(fn);
+        });
+    }
+    setDisabledState(isDisabled) {
+        setTimeout(() => {
+            this.dateInput?.setDisabledState(isDisabled);
+            this.timeInput?.setDisabledState(isDisabled);
+        });
+    }
+    get value() {
+        if (this.lastDateValue && this.lastTimeValue) {
+            const result = new Date(this.lastDateValue);
+            result.setHours(this.lastTimeValue.getHours(), this.lastTimeValue.getMinutes(), this.lastTimeValue.getSeconds(), this.lastTimeValue.getMilliseconds());
+            return result;
+        }
+        return null;
+    }
+    limitTime(mode) {
+        const limit = mode === 'min' ? this.min : this.max;
+        const limitIso = limit ? this.toLocalISODate(limit) : undefined;
+        const dateIso = this.lastDateValue ? this.toLocalISODate(this.lastDateValue) : undefined;
+        const attr = limit && limitIso === dateIso ? this.toLocalISOTime(limit) : undefined;
+        if (attr) {
+            this.timeInput?.nativeElement.setAttribute(mode, attr);
+        }
+        else {
+            this.timeInput?.nativeElement.removeAttribute(mode);
+        }
+    }
+    toLocalISODate(value) {
+        const year = value.getFullYear();
+        const month = (value.getMonth() + 1).toString().padStart(2, '0');
+        const day = value.getDate().toString().padStart(2, '0');
+        return `${year}-${month}-${day}`;
+    }
+    toLocalISOTime(value) {
+        const hours = value.getHours().toString().padStart(2, '0');
+        const mins = value.getMinutes().toString().padStart(2, '0');
+        return `${hours}:${mins}`;
+    }
+}
+DatetimeComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: DatetimeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+DatetimeComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: DatetimeComponent, selector: "cat-datetime", inputs: { min: "min", max: "max" }, providers: [
+        {
+            provide: NG_VALUE_ACCESSOR,
+            useExisting: DatetimeComponent,
+            multi: true
+        }
+    ], queries: [{ propertyName: "dateInput", first: true, predicate: DateValueAccessor, descendants: true }, { propertyName: "timeInput", first: true, predicate: TimeValueAccessor, descendants: true }], ngImport: i0, template: '<ng-content></ng-content>', isInline: true, styles: ["cat-datetime{display:contents}\n"], encapsulation: i0.ViewEncapsulation.None });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: DatetimeComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'cat-datetime', template: '<ng-content></ng-content>', encapsulation: ViewEncapsulation.None, providers: [
+                        {
+                            provide: NG_VALUE_ACCESSOR,
+                            useExisting: DatetimeComponent,
+                            multi: true
+                        }
+                    ], styles: ["cat-datetime{display:contents}\n"] }]
+        }], propDecorators: { dateInput: [{
+                type: ContentChild,
+                args: [DateValueAccessor]
+            }], timeInput: [{
+                type: ContentChild,
+                args: [TimeValueAccessor]
+            }], min: [{
+                type: Input
+            }], max: [{
+                type: Input
+            }] } });
+
 /**
  * The bottom actions of a dialog.
  */
@@ -908,56 +1190,18 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImpor
             type: Component,
             args: [{ selector: 'cat-dialog', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, host: {
                         class: 'cat-dialog'
-                    }, template: "<ng-content select=\"cat-dialog-header\"></ng-content>\n<cat-scrollable\n  [noOverscroll]=\"noOverscroll\"\n  [noScrolledInit]=\"noScrolledInit\"\n  [scrolledBuffer]=\"scrolledBuffer\"\n  (scrolledBottom)=\"scrolledBottom.emit()\"\n>\n  <div class=\"cat-dialog-content\">\n    <ng-content></ng-content>\n  </div>\n</cat-scrollable>\n<ng-content select=\"cat-dialog-actions\"></ng-content>\n", styles: [".cdk-overlay-container,.cdk-global-overlay-wrapper{pointer-events:none;top:0;left:0;height:100%;width:100%}.cdk-overlay-container{position:fixed;z-index:1000}.cdk-overlay-container:empty{display:none}.cdk-global-overlay-wrapper{display:flex;position:absolute;z-index:1000}.cdk-overlay-pane{position:absolute;pointer-events:auto;box-sizing:border-box;z-index:1000;display:flex;max-width:100%;max-height:100%}.cdk-overlay-backdrop{position:absolute;inset:0;z-index:1000;pointer-events:auto;-webkit-tap-highlight-color:transparent;transition:opacity .4s cubic-bezier(.25,.8,.25,1);opacity:0}.cdk-overlay-backdrop.cdk-overlay-backdrop-showing{opacity:1}.cdk-high-contrast-active .cdk-overlay-backdrop.cdk-overlay-backdrop-showing{opacity:.6}.cdk-overlay-dark-backdrop{background:rgba(0,0,0,.32)}.cdk-overlay-transparent-backdrop{transition:visibility 1ms linear,opacity 1ms linear;visibility:hidden;opacity:1}.cdk-overlay-transparent-backdrop.cdk-overlay-backdrop-showing{opacity:0;visibility:visible}.cdk-overlay-backdrop-noop-animation{transition:none}.cdk-overlay-connected-position-bounding-box{position:absolute;z-index:1000;display:flex;flex-direction:column;min-width:1px;min-height:1px}.cdk-global-scrollblock{position:fixed;width:100%;overflow-y:scroll}.cat-backdrop{transition-duration:.5s}.cat-dialog-pane .cdk-dialog-container>*:only-child{display:block;width:100%;height:100%;min-height:inherit;max-height:inherit}.cat-dialog{width:100%;height:100%;min-height:inherit;max-height:inherit;animation:cat-dialog-enter .25s ease}@keyframes cat-dialog-enter{0%{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}\n"] }]
-        }], ctorParameters: function () { return [{ type: i1$1.DialogRef }]; }, propDecorators: { noOverscroll: [{
-                type: Input
-            }], noScrolledInit: [{
-                type: Input
-            }], scrolledBuffer: [{
-                type: Input
-            }], scrolledBottom: [{
-                type: Output
-            }], header: [{
-                type: ContentChild,
-                args: [CatDialogHeaderComponent]
-            }] } });
-
-class ValueAccessor {
-    constructor(el) {
-        this.el = el;
-        this.onChange = () => { };
-        this.onTouched = () => { };
-    }
-    writeValue(value) {
-        this.el.nativeElement.value = this.lastValue = value == null ? '' : value;
-    }
-    handleChangeEvent(value) {
-        if (value !== this.lastValue) {
-            this.lastValue = value;
-            this.onChange(value);
-        }
-    }
-    _handleBlurEvent() {
-        this.onTouched();
-    }
-    registerOnChange(fn) {
-        this.onChange = fn;
-    }
-    registerOnTouched(fn) {
-        this.onTouched = fn;
-    }
-    setDisabledState(isDisabled) {
-        this.el.nativeElement.disabled = isDisabled;
-    }
-}
-ValueAccessor.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ValueAccessor, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
-ValueAccessor.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "14.3.0", type: ValueAccessor, host: { listeners: { "focusout": "_handleBlurEvent()" } }, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ValueAccessor, decorators: [{
-            type: Directive,
-            args: [{}]
-        }], ctorParameters: function () { return [{ type: i0.ElementRef }]; }, propDecorators: { _handleBlurEvent: [{
-                type: HostListener,
-                args: ['focusout']
+                    }, template: "<ng-content select=\"cat-dialog-header\"></ng-content>\n<cat-scrollable\n  [noOverscroll]=\"noOverscroll\"\n  [noScrolledInit]=\"noScrolledInit\"\n  [scrolledBuffer]=\"scrolledBuffer\"\n  (scrolledBottom)=\"scrolledBottom.emit()\"\n>\n  <div class=\"cat-dialog-content\">\n    <ng-content></ng-content>\n  </div>\n</cat-scrollable>\n<ng-content select=\"cat-dialog-actions\"></ng-content>\n", styles: [".cdk-overlay-container,.cdk-global-overlay-wrapper{pointer-events:none;top:0;left:0;height:100%;width:100%}.cdk-overlay-container{position:fixed;z-index:1000}.cdk-overlay-container:empty{display:none}.cdk-global-overlay-wrapper{display:flex;position:absolute;z-index:1000}.cdk-overlay-pane{position:absolute;pointer-events:auto;box-sizing:border-box;z-index:1000;display:flex;max-width:100%;max-height:100%}.cdk-overlay-backdrop{position:absolute;inset:0;z-index:1000;pointer-events:auto;-webkit-tap-highlight-color:transparent;transition:opacity .4s cubic-bezier(.25,.8,.25,1);opacity:0}.cdk-overlay-backdrop.cdk-overlay-backdrop-showing{opacity:1}.cdk-high-contrast-active .cdk-overlay-backdrop.cdk-overlay-backdrop-showing{opacity:.6}.cdk-overlay-dark-backdrop{background:rgba(0,0,0,.32)}.cdk-overlay-transparent-backdrop{transition:visibility 1ms linear,opacity 1ms linear;visibility:hidden;opacity:1}.cdk-overlay-transparent-backdrop.cdk-overlay-backdrop-showing{opacity:0;visibility:visible}.cdk-overlay-backdrop-noop-animation{transition:none}.cdk-overlay-connected-position-bounding-box{position:absolute;z-index:1000;display:flex;flex-direction:column;min-width:1px;min-height:1px}.cdk-global-scrollblock{position:fixed;width:100%;overflow-y:scroll}.cat-backdrop{transition-duration:.5s}.cat-dialog-pane .cdk-dialog-container>*:only-child{display:block;width:100%;height:100%;min-height:inherit;max-height:inherit}.cat-dialog{width:100%;height:100%;min-height:inherit;max-height:inherit;animation:cat-dialog-enter .25s ease}@keyframes cat-dialog-enter{0%{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}\n"] }]
+        }], ctorParameters: function () { return [{ type: i1$1.DialogRef }]; }, propDecorators: { noOverscroll: [{
+                type: Input
+            }], noScrolledInit: [{
+                type: Input
+            }], scrolledBuffer: [{
+                type: Input
+            }], scrolledBottom: [{
+                type: Output
+            }], header: [{
+                type: ContentChild,
+                args: [CatDialogHeaderComponent]
             }] } });
 
 class BooleanValueAccessor extends ValueAccessor {
@@ -994,74 +1238,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImpor
                 }]
         }], ctorParameters: function () { return [{ type: i0.ElementRef }]; } });
 
-class DateValueAccessor extends ValueAccessor {
-    constructor(el) {
-        super(el);
-    }
-    get nativeElement() {
-        return this.el.nativeElement;
-    }
-    writeValue(value) {
-        if (!this.el.nativeElement.range) {
-            return super.writeValue(this.toISO(value));
-        }
-        else if (value instanceof Array) {
-            const data = [this.toISO(value[0]), this.toISO(value[1])];
-            return super.writeValue(JSON.stringify(data));
-        }
-        return super.writeValue(undefined);
-    }
-    handleChangeEvent(value) {
-        if (!this.el.nativeElement.range) {
-            return super.handleChangeEvent(this.toDate(value));
-        }
-        else if (typeof value === 'string') {
-            const data = JSON.parse(value).map(this.toDate);
-            data[1]?.setHours(23, 59, 59, 999);
-            return super.handleChangeEvent(data);
-        }
-        super.handleChangeEvent(null);
-    }
-    toISO(value) {
-        if (value instanceof Date) {
-            const year = value.getFullYear();
-            const month = (value.getMonth() + 1).toString().padStart(2, '0');
-            const day = value.getDate().toString().padStart(2, '0');
-            return `${year}-${month}-${day}`;
-        }
-        return undefined;
-    }
-    toDate(value) {
-        const [match, year, month, day] = value?.match(/^(\d{4})-(\d{2})-(\d{2})/) ?? [];
-        return match ? new Date(Number(year), Number(month) - 1, Number(day)) : null;
-    }
-}
-DateValueAccessor.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: DateValueAccessor, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
-DateValueAccessor.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "14.3.0", type: DateValueAccessor, selector: "cat-date, cat-date-inline", host: { listeners: { "catChange": "handleChangeEvent($event.target.value)" } }, providers: [
-        {
-            provide: NG_VALUE_ACCESSOR,
-            useExisting: DateValueAccessor,
-            multi: true
-        }
-    ], usesInheritance: true, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: DateValueAccessor, decorators: [{
-            type: Directive,
-            args: [{
-                    /* tslint:disable-next-line:directive-selector */
-                    selector: 'cat-date, cat-date-inline',
-                    host: {
-                        '(catChange)': 'handleChangeEvent($event.target.value)'
-                    },
-                    providers: [
-                        {
-                            provide: NG_VALUE_ACCESSOR,
-                            useExisting: DateValueAccessor,
-                            multi: true
-                        }
-                    ]
-                }]
-        }], ctorParameters: function () { return [{ type: i0.ElementRef }]; } });
-
 class RadioValueAccessor extends ValueAccessor {
     constructor(el) {
         super(el);
@@ -1177,57 +1353,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImpor
                 }]
         }], ctorParameters: function () { return [{ type: i0.ElementRef }]; } });
 
-class TimeValueAccessor extends ValueAccessor {
-    constructor(el) {
-        super(el);
-    }
-    get nativeElement() {
-        return this.el.nativeElement;
-    }
-    writeValue(value) {
-        if (value && value instanceof Date) {
-            const hours = value.getHours().toString().padStart(2, '0');
-            const mins = value.getMinutes().toString().padStart(2, '0');
-            return super.writeValue(`${hours}:${mins}`);
-        }
-        return super.writeValue(undefined);
-    }
-    handleChangeEvent(value) {
-        const [match, hours, mins] = value?.match(/^(\d{2}):(\d{2})/) ?? [];
-        if (match) {
-            const date = new Date();
-            date.setHours(Number(hours), Number(mins), 0, 0);
-            return super.handleChangeEvent(date);
-        }
-        return super.handleChangeEvent(null);
-    }
-}
-TimeValueAccessor.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: TimeValueAccessor, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
-TimeValueAccessor.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "14.3.0", type: TimeValueAccessor, selector: "cat-time", host: { listeners: { "catChange": "handleChangeEvent($event.target.value)" } }, providers: [
-        {
-            provide: NG_VALUE_ACCESSOR,
-            useExisting: TimeValueAccessor,
-            multi: true
-        }
-    ], usesInheritance: true, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: TimeValueAccessor, decorators: [{
-            type: Directive,
-            args: [{
-                    /* tslint:disable-next-line:directive-selector */
-                    selector: 'cat-time',
-                    host: {
-                        '(catChange)': 'handleChangeEvent($event.target.value)'
-                    },
-                    providers: [
-                        {
-                            provide: NG_VALUE_ACCESSOR,
-                            useExisting: TimeValueAccessor,
-                            multi: true
-                        }
-                    ]
-                }]
-        }], ctorParameters: function () { return [{ type: i0.ElementRef }]; } });
-
 class ValueAccessorDecorator {
     constructor(el, controlDirective, controlContainer) {
         this.el = el;
@@ -1279,131 +1404,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImpor
                 type: Input
             }] } });
 
-class DatetimeComponent {
-    get min() {
-        return this._min ?? null;
-    }
-    set min(value) {
-        this._min = value;
-        setTimeout(() => {
-            const min = value ? this.toLocalISODate(value) : undefined;
-            this.dateInput?.nativeElement.setAttribute('min', min);
-            this.limitTime('min');
-        });
-    }
-    get max() {
-        return this._max ?? null;
-    }
-    set max(value) {
-        this._max = value;
-        setTimeout(() => {
-            const max = value ? this.toLocalISODate(value) : undefined;
-            this.dateInput?.nativeElement.setAttribute('max', max);
-            this.limitTime('max');
-        });
-    }
-    ngAfterContentInit() {
-        if (!this.dateInput) {
-            throw new Error('Missing child element <cat-date></cat-date>');
-        }
-        if (!this.timeInput) {
-            throw new Error('Missing child element <cat-time></cat-time>');
-        }
-    }
-    writeValue(value) {
-        this.lastValue = this.lastDateValue = this.lastTimeValue = value;
-        setTimeout(() => {
-            this.dateInput?.writeValue(value);
-            this.timeInput?.writeValue(value);
-        });
-    }
-    registerOnChange(fn) {
-        setTimeout(() => {
-            this.dateInput?.registerOnChange((value) => {
-                this.lastDateValue = value;
-                this.limitTime('min');
-                this.limitTime('max');
-                fn(this.value);
-            });
-            this.timeInput?.registerOnChange((value) => {
-                this.lastTimeValue = value;
-                fn(this.value);
-            });
-        });
-    }
-    registerOnTouched(fn) {
-        setTimeout(() => {
-            this.dateInput?.registerOnTouched(fn);
-            this.timeInput?.registerOnTouched(fn);
-        });
-    }
-    setDisabledState(isDisabled) {
-        setTimeout(() => {
-            this.dateInput?.setDisabledState(isDisabled);
-            this.timeInput?.setDisabledState(isDisabled);
-        });
-    }
-    get value() {
-        if (this.lastDateValue && this.lastTimeValue) {
-            const result = new Date(this.lastDateValue);
-            result.setHours(this.lastTimeValue.getHours(), this.lastTimeValue.getMinutes(), this.lastTimeValue.getSeconds(), this.lastTimeValue.getMilliseconds());
-            return result;
-        }
-        return null;
-    }
-    limitTime(mode) {
-        const limit = mode === 'min' ? this.min : this.max;
-        const limitIso = limit ? this.toLocalISODate(limit) : undefined;
-        const dateIso = this.lastDateValue ? this.toLocalISODate(this.lastDateValue) : undefined;
-        const attr = limit && limitIso === dateIso ? this.toLocalISOTime(limit) : undefined;
-        if (attr) {
-            this.timeInput?.nativeElement.setAttribute(mode, attr);
-        }
-        else {
-            this.timeInput?.nativeElement.removeAttribute(mode);
-        }
-    }
-    toLocalISODate(value) {
-        const year = value.getFullYear();
-        const month = (value.getMonth() + 1).toString().padStart(2, '0');
-        const day = value.getDate().toString().padStart(2, '0');
-        return `${year}-${month}-${day}`;
-    }
-    toLocalISOTime(value) {
-        const hours = value.getHours().toString().padStart(2, '0');
-        const mins = value.getMinutes().toString().padStart(2, '0');
-        return `${hours}:${mins}`;
-    }
-}
-DatetimeComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: DatetimeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-DatetimeComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: DatetimeComponent, selector: "cat-datetime", inputs: { min: "min", max: "max" }, providers: [
-        {
-            provide: NG_VALUE_ACCESSOR,
-            useExisting: DatetimeComponent,
-            multi: true
-        }
-    ], queries: [{ propertyName: "dateInput", first: true, predicate: DateValueAccessor, descendants: true }, { propertyName: "timeInput", first: true, predicate: TimeValueAccessor, descendants: true }], ngImport: i0, template: '<ng-content></ng-content>', isInline: true, styles: ["cat-datetime{display:contents}\n"], encapsulation: i0.ViewEncapsulation.None });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: DatetimeComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'cat-datetime', template: '<ng-content></ng-content>', encapsulation: ViewEncapsulation.None, providers: [
-                        {
-                            provide: NG_VALUE_ACCESSOR,
-                            useExisting: DatetimeComponent,
-                            multi: true
-                        }
-                    ], styles: ["cat-datetime{display:contents}\n"] }]
-        }], propDecorators: { dateInput: [{
-                type: ContentChild,
-                args: [DateValueAccessor]
-            }], timeInput: [{
-                type: ContentChild,
-                args: [TimeValueAccessor]
-            }], min: [{
-                type: Input
-            }], max: [{
-                type: Input
-            }] } });
-
 const CatComponents = [
     CatAlert,
     CatAvatar,
@@ -1429,6 +1429,7 @@ const CatComponents = [
     CatTab,
     CatTabs,
     CatTextarea,
+    CatTime,
     CatToggle,
     CatTooltip
 ];
@@ -1452,7 +1453,7 @@ class CatalystModule {
     }
 }
 CatalystModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: CatalystModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-CatalystModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.3.0", ngImport: i0, type: CatalystModule, declarations: [CatAlert, CatAvatar, CatBadge, CatButton, CatButtonGroup, CatCard, CatCheckbox, CatDate, CatDateInline, CatDatepicker, CatDropdown, CatFormGroup, CatIcon, CatInput, CatPagination, CatRadio, CatRadioGroup, CatScrollable, CatSelect, CatSkeleton, CatSpinner, CatTab, CatTabs, CatTextarea, CatToggle, CatTooltip, BooleanValueAccessor,
+CatalystModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.3.0", ngImport: i0, type: CatalystModule, declarations: [CatAlert, CatAvatar, CatBadge, CatButton, CatButtonGroup, CatCard, CatCheckbox, CatDate, CatDateInline, CatDatepicker, CatDropdown, CatFormGroup, CatIcon, CatInput, CatPagination, CatRadio, CatRadioGroup, CatScrollable, CatSelect, CatSkeleton, CatSpinner, CatTab, CatTabs, CatTextarea, CatTime, CatToggle, CatTooltip, BooleanValueAccessor,
         DateValueAccessor,
         RadioValueAccessor,
         SelectValueAccessor,
@@ -1462,7 +1463,7 @@ CatalystModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version:
         ValueAccessorDecorator,
         DatetimeComponent, CatDialogComponent,
         CatDialogHeaderComponent,
-        CatDialogActionsComponent], imports: [CommonModule, DialogModule], exports: [CatAlert, CatAvatar, CatBadge, CatButton, CatButtonGroup, CatCard, CatCheckbox, CatDate, CatDateInline, CatDatepicker, CatDropdown, CatFormGroup, CatIcon, CatInput, CatPagination, CatRadio, CatRadioGroup, CatScrollable, CatSelect, CatSkeleton, CatSpinner, CatTab, CatTabs, CatTextarea, CatToggle, CatTooltip, BooleanValueAccessor,
+        CatDialogActionsComponent], imports: [CommonModule, DialogModule], exports: [CatAlert, CatAvatar, CatBadge, CatButton, CatButtonGroup, CatCard, CatCheckbox, CatDate, CatDateInline, CatDatepicker, CatDropdown, CatFormGroup, CatIcon, CatInput, CatPagination, CatRadio, CatRadioGroup, CatScrollable, CatSelect, CatSkeleton, CatSpinner, CatTab, CatTabs, CatTextarea, CatTime, CatToggle, CatTooltip, BooleanValueAccessor,
         DateValueAccessor,
         RadioValueAccessor,
         SelectValueAccessor,