@libs-ui/components-datetime-input 0.1.1-1

package/esm2022/interfaces/function-control-event.interface.mjs

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZnVuY3Rpb24tY29udHJvbC1ldmVudC5pbnRlcmZhY2UuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi8uLi9saWJzLXVpL2NvbXBvbmVudHMvZGF0ZXRpbWUvaW5wdXQvc3JjL2ludGVyZmFjZXMvZnVuY3Rpb24tY29udHJvbC1ldmVudC5pbnRlcmZhY2UudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IiIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IElJbnB1dEZ1bmN0aW9uQ29udHJvbEV2ZW50IH0gZnJvbSAnQGxpYnMtdWkvY29tcG9uZW50cy1pbnB1dHMtaW5wdXQnO1xuXG5leHBvcnQgaW50ZXJmYWNlIElNdWx0aUZ1bmN0aW9uRGF0ZUlucHV0Q29udHJvbEV2ZW50IHtcbiAgZnJvbUhvdXJzPzogSUlucHV0RnVuY3Rpb25Db250cm9sRXZlbnQ7XG4gIHRvSG91cnM/OiBJSW5wdXRGdW5jdGlvbkNvbnRyb2xFdmVudDtcbiAgZnJvbU1pbnV0ZXM/OiBJSW5wdXRGdW5jdGlvbkNvbnRyb2xFdmVudDtcbiAgdG9NaW51dGVzPzogSUlucHV0RnVuY3Rpb25Db250cm9sRXZlbnQ7XG59XG5cbmV4cG9ydCBpbnRlcmZhY2UgSURhdGVUaW1lSW5wdXRGdW5jdGlvbkNvbnRyb2xFdmVudCB7XG4gIGNoZWNrSXNWYWxpZDogKCkgPT4gUHJvbWlzZTxib29sZWFuPjtcbiAgcmVzZXRFcnJvcjogKHJlc2V0QWxsPzogYm9vbGVhbikgPT4gUHJvbWlzZTx2b2lkPjtcbiAgc2V0TWVzc2FnZUVycm9yOiAobWVzc2FnZTogc3RyaW5nIHwgdW5kZWZpbmVkKSA9PiBQcm9taXNlPHZvaWQ+O1xufVxuIl19

package/esm2022/interfaces/index.mjs

@@ -0,0 +1,4 @@
+export * from './input.interface';
+export * from './function-control-event.interface';
+export * from './valid.interface';
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5kZXguanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi8uLi9saWJzLXVpL2NvbXBvbmVudHMvZGF0ZXRpbWUvaW5wdXQvc3JjL2ludGVyZmFjZXMvaW5kZXgudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsY0FBYyxtQkFBbUIsQ0FBQztBQUNsQyxjQUFjLG9DQUFvQyxDQUFDO0FBQ25ELGNBQWMsbUJBQW1CLENBQUMiLCJzb3VyY2VzQ29udGVudCI6WyJleHBvcnQgKiBmcm9tICcuL2lucHV0LmludGVyZmFjZSc7XG5leHBvcnQgKiBmcm9tICcuL2Z1bmN0aW9uLWNvbnRyb2wtZXZlbnQuaW50ZXJmYWNlJztcbmV4cG9ydCAqIGZyb20gJy4vdmFsaWQuaW50ZXJmYWNlJztcbiJdfQ==

package/esm2022/interfaces/input.interface.mjs

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5wdXQuaW50ZXJmYWNlLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vLi4vbGlicy11aS9jb21wb25lbnRzL2RhdGV0aW1lL2lucHV0L3NyYy9pbnRlcmZhY2VzL2lucHV0LmludGVyZmFjZS50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgV3JpdGFibGVTaWduYWwgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcblxuZXhwb3J0IGludGVyZmFjZSBJQ2hhbmdlRm9jdXNJbnB1dCB7XG4gIGhvdXJzRm9jdXM/OiBib29sZWFuO1xuICBtaW51dGVzRm9jdXM/OiBib29sZWFuO1xuICBjaGFuZ2VCb3JkZXI/OiBib29sZWFuO1xufVxuXG5leHBvcnQgaW50ZXJmYWNlIElTZWxlY3RlZE11bHRpVGltZSB7XG4gIGZyb20/OiBXcml0YWJsZVNpZ25hbDxJU2VsZWN0ZWRUaW1lSW5wdXQ+O1xuICB0bz86IFdyaXRhYmxlU2lnbmFsPElTZWxlY3RlZFRpbWVJbnB1dD47XG59XG5cbmV4cG9ydCBpbnRlcmZhY2UgSVNlbGVjdGVkVGltZUlucHV0IHtcbiAgaG91cnM/OiBzdHJpbmcgfCBudW1iZXI7XG4gIG1pbnV0ZT86IHN0cmluZyB8IG51bWJlcjtcbn1cbiJdfQ==

package/esm2022/interfaces/valid.interface.mjs

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidmFsaWQuaW50ZXJmYWNlLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vLi4vbGlicy11aS9jb21wb25lbnRzL2RhdGV0aW1lL2lucHV0L3NyYy9pbnRlcmZhY2VzL3ZhbGlkLmludGVyZmFjZS50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgSU1lc3NhZ2VUcmFuc2xhdGUgfSBmcm9tICdAbGlicy11aS9pbnRlcmZhY2VzLXR5cGVzJztcbmV4cG9ydCBpbnRlcmZhY2UgSVZhbGlkQ29tcGFyZSBleHRlbmRzIElNZXNzYWdlVHJhbnNsYXRlIHtcbiAgaXNDaGVja0Vycm9yVGltZUVuZEdyZWF0ZXJUaW1lU3RhcnQ/OiBib29sZWFuO1xuICBpc0NoZWNrRXJyb3JUaW1lRHVwbGljYXRlPzogYm9vbGVhbjtcbn1cbiJdfQ==

package/esm2022/libs-ui-components-datetime-input.mjs

@@ -0,0 +1,5 @@
+/**
+ * Generated bundle index. Do not edit.
+ */
+export * from './index';
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibGlicy11aS1jb21wb25lbnRzLWRhdGV0aW1lLWlucHV0LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vbGlicy11aS9jb21wb25lbnRzL2RhdGV0aW1lL2lucHV0L3NyYy9saWJzLXVpLWNvbXBvbmVudHMtZGF0ZXRpbWUtaW5wdXQudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUE7O0dBRUc7QUFFSCxjQUFjLFNBQVMsQ0FBQyIsInNvdXJjZXNDb250ZW50IjpbIi8qKlxuICogR2VuZXJhdGVkIGJ1bmRsZSBpbmRleC4gRG8gbm90IGVkaXQuXG4gKi9cblxuZXhwb3J0ICogZnJvbSAnLi9pbmRleCc7XG4iXX0=

package/fesm2022/libs-ui-components-datetime-input.mjs

@@ -0,0 +1,541 @@
+import * as i0 from '@angular/core';
+import { signal, input, output, effect, untracked, ChangeDetectionStrategy, Component } from '@angular/core';
+import { LibsUiComponentsInputsInputComponent } from '@libs-ui/components-inputs-input';
+import { LibsUiComponentsLabelComponent } from '@libs-ui/components-label';
+import { isNil, get, cloneDeep } from '@libs-ui/utils';
+import * as i1 from '@ngx-translate/core';
+import { TranslateModule } from '@ngx-translate/core';
+import { timer } from 'rxjs';
+
+const CheckTimeDisplay = (time) => {
+    const timeReturn = { hours: time.hours, minutes: time.minute };
+    if (Number(time.hours) > 23) {
+        timeReturn.hours = 23;
+    }
+    if (Number(time.minute) > 59) {
+        timeReturn.minutes = 59;
+    }
+    if (Number(time.hours) === 0 || Number(time.hours) < 0) {
+        timeReturn.hours = `00`;
+    }
+    if (Number(time.minute) === 0 || Number(time.minute) < 0) {
+        timeReturn.minutes = `00`;
+    }
+    if (Number(time.hours) && Number(time.hours) < 10) {
+        timeReturn.hours = `0${Number(time.hours)}`;
+    }
+    if (Number(time.minute) && Number(time.minute) < 10) {
+        timeReturn.minutes = `0${Number(time.minute)}`;
+    }
+    return timeReturn;
+};
+const CompareTime = (cloneDeepTime, time) => {
+    if (!cloneDeepTime && time) {
+        return true;
+    }
+    if (cloneDeepTime && !time) {
+        return false;
+    }
+    if (Number(cloneDeepTime?.from?.()?.hours) !== Number(time?.from?.()?.hours)) {
+        return true;
+    }
+    if (Number(cloneDeepTime?.from?.()?.minute) !== Number(time?.from?.()?.minute)) {
+        return true;
+    }
+    if (Number(cloneDeepTime?.to?.()?.hours) !== Number(time?.to?.()?.hours)) {
+        return true;
+    }
+    if (Number(cloneDeepTime?.to?.()?.minute) !== Number(time?.to?.()?.minute)) {
+        return true;
+    }
+    return false;
+};
+
+class LibsUiComponentsDatetimeInputComponent {
+    // #region PROPERTY
+    hours = signal(undefined);
+    minutes = signal(undefined);
+    toHours = signal(undefined);
+    toMinutes = signal(undefined);
+    isErrorRequired = signal(false);
+    isErrorMultiRequired = signal(false);
+    isErrorMultiValidCompareTime = signal(false);
+    focusInput = signal({});
+    cloneDeepTimeOutput = signal(undefined);
+    changeBorderFocus = signal({
+        changeBorder: false,
+        hoursFocus: false,
+        minutesFocus: false,
+    });
+    otherError = signal(undefined);
+    isZero = signal(false);
+    keyCodeBackspace = signal(false);
+    isSelected = signal(undefined);
+    writeDrownFromKeyboard = signal(undefined);
+    checkBackspaceFocusToHours = signal(1);
+    checkBackspaceFocusMinutes = signal(1);
+    checkBackspaceFocusToMinutes = signal(1);
+    multiTime = input(false);
+    selectedTime = input();
+    classIncludeBetweenTime = input(undefined);
+    fromAndToDateLabel = input();
+    resetInput = input(true);
+    disable = input(false);
+    readonly = input(false);
+    labelConfig = input(undefined);
+    validRequired = input(undefined);
+    validCompareTime = input(undefined);
+    ignoreBorder = input(false);
+    ignoreMultiIcon = input(false);
+    classDatePickerInput = input();
+    ignoreShowValid = input(false);
+    ignoreCheckValidWhenInput = input(false); // biến này dùng để có chạy validate ngay thời điểm khi nhập từ bán phím
+    ignoreAllowEqualTime = input(true); // biến này dùng để biết đc có cho 2 time bằng nhau hay không
+    emitDataSingleDataWhenUseMultiTime = input(false); // true khi muốn emit data riêng khi dùng dạng multi
+    classIncludeInput = input('', { transform: (value) => value ?? 'libs-ui-font-h5r' });
+    showBorderError = input(false);
+    defaultHeight = input(28);
+    ignoreWithDefault = input(false);
+    isEmitRealTime = input(false);
+    outEmitSingleTime = output();
+    outEmitMultiTime = output();
+    outClickButtonLabel = output();
+    outSwitchEventLabel = output();
+    outLabelRightClick = output();
+    outFunctionsControl = output();
+    outEmitValid = output();
+    outResetTime = output();
+    outEmitRealTime = output();
+    constructor() {
+        effect(() => {
+            const selectedTime = this.selectedTime();
+            if (!selectedTime) {
+                return;
+            }
+            untracked(() => this.formatSelectedTime(selectedTime));
+        });
+    }
+    // ngOnChanges(changes: SimpleChanges): void {
+    //   if (changes.selectedTime && changes.selectedTime.currentValue && CompareTimeOutPut(changes.selectedTime.previousValue, changes.selectedTime.currentValue)) {
+    //   }
+    // }
+    ngOnInit() {
+        this.outFunctionsControl.emit(this.FunctionsControl);
+        this.checkValid(true);
+    }
+    get FunctionsControl() {
+        return {
+            checkIsValid: this.checkValid.bind(this),
+            setMessageError: this.setMessageError.bind(this),
+            resetError: this.resetError.bind(this),
+        };
+    }
+    formatSelectedTime(data) {
+        const fromData = data.from?.();
+        const toData = data.to?.();
+        if (this.writeDrownFromKeyboard()) {
+            return;
+        }
+        if ((!fromData?.hours && fromData?.hours !== 0) || (!fromData?.minute && fromData?.minute !== 0) || (this.multiTime() && ((!toData?.hours && toData?.hours !== 0) || (!toData?.minute && toData?.minute !== 0)))) {
+            this.reset(this.multiTime());
+            this.isSelected.set(false);
+            return;
+        }
+        if (isNaN(Number(fromData?.hours)) || isNaN(Number(fromData?.minute)) || (this.multiTime() && (isNaN(Number(toData?.minute)) || isNaN(Number(toData?.minute))))) {
+            this.reset(this.multiTime());
+            this.isSelected.set(false);
+            return;
+        }
+        if (!fromData && !toData) {
+            this.reset(this.multiTime());
+            this.isSelected.set(false);
+            return;
+        }
+        if (fromData && !isNil(fromData.hours) && !isNil(fromData.minute)) {
+            const timeFromCheckValid = CheckTimeDisplay({ hours: fromData.hours, minute: fromData.minute });
+            this.hours.set(timeFromCheckValid.hours);
+            this.minutes.set(timeFromCheckValid.minutes);
+        }
+        if (toData && !isNil(toData.hours) && !isNil(toData.minute) && this.multiTime()) {
+            const timeToCheckValid = CheckTimeDisplay({ hours: toData.hours, minute: toData.minute });
+            this.toHours.set(timeToCheckValid.hours);
+            this.toMinutes.set(timeToCheckValid.minutes);
+        }
+        this.isSelected.set(true);
+    }
+    handlerFocusAndBlur(event, type) {
+        const eventInput = event.event;
+        const target = eventInput.target;
+        if (event.name === 'focus') {
+            this.changeBorderFocus.update((current) => {
+                current.changeBorder = true;
+                current.hoursFocus = true;
+                current.minutesFocus = false;
+                return current;
+            });
+            if (!get(this.getInstance(), type) && get(this.getInstance(), type) !== 0) {
+                this.isZero.set(false);
+            }
+            return;
+        }
+        this.changeBorderFocus.update((current) => {
+            current.hoursFocus = false;
+            return current;
+        });
+        timer(0)
+            .pipe()
+            .subscribe(() => {
+            if (!this.changeBorderFocus().hoursFocus && !this.changeBorderFocus().minutesFocus) {
+                this.changeBorderFocus.update((current) => {
+                    current.changeBorder = false;
+                    return current;
+                });
+            }
+        });
+        if (Number(get(this.getInstance(), type)) === 0) {
+            get(this.getInstance(), type, undefined, true).set('00');
+            target.value = get(this.getInstance(), type);
+            return;
+        }
+        if (Number(get(this.getInstance(), type)) && Number(get(this.getInstance(), type)) <= 2 && Number(get(this.getInstance(), type)) !== 0) {
+            get(this.getInstance(), type, undefined, true).set(`0${Number(get(this.getInstance(), type))}`);
+            target.value = get(this.getInstance(), type);
+        }
+    }
+    handlerFocusAndBlurMinutes(event, type) {
+        if (event.name === 'focus') {
+            this.changeBorderFocus.update((current) => {
+                current.changeBorder = true;
+                current.minutesFocus = true;
+                current.hoursFocus = false;
+                return current;
+            });
+            if (!get(this.getInstance(), type) && get(this.getInstance(), type) !== 0) {
+                this.isZero.set(false);
+            }
+            return;
+        }
+        this.changeBorderFocus.update((current) => {
+            current.minutesFocus = false;
+            return current;
+        });
+        timer(0)
+            .pipe()
+            .subscribe(() => {
+            if (!this.changeBorderFocus().hoursFocus && !this.changeBorderFocus().minutesFocus) {
+                this.changeBorderFocus.update((current) => {
+                    current.changeBorder = false;
+                    return current;
+                });
+            }
+        });
+        const eventInput = event.event;
+        const target = eventInput.target;
+        if (Number(get(this.getInstance(), type)) === 0) {
+            get(this.getInstance(), type, undefined, true).set('00');
+            target.value = get(this.getInstance(), type);
+            return;
+        }
+        if (Number(get(this.getInstance(), type)) && Number(get(this.getInstance(), type)) <= 5 && Number(get(this.getInstance(), type)) !== 0) {
+            get(this.getInstance(), type, undefined, true).set(`0${Number(get(this.getInstance(), type))}`);
+            target.value = get(this.getInstance(), type);
+        }
+    }
+    handlerValueHoursChange(data, type) {
+        data = data;
+        if (data === 0) {
+            this.isZero.set(true);
+        }
+        if (this.isSelected() || Number(get(this.getInstance(), type)) === Number(data)) {
+            if (data === 0 && !this.keyCodeBackspace() && get(this.getInstance(), type) !== '00') {
+                this.checkFocus(type);
+            }
+            return;
+        }
+        if (data === undefined) {
+            get(this.getInstance(), type, undefined, true).set(data);
+            this.isZero.set(false);
+            this.applyTime();
+            return;
+        }
+        get(this.getInstance(), type, undefined, true).set(data);
+        if (data === 0) {
+            get(this.getInstance(), type, undefined, true).set('0');
+        }
+        this.isSelected.set(false);
+        this.checkValid(this.ignoreCheckValidWhenInput());
+        if (data > 2 && data !== 0 && `${data}`.length < 2) {
+            get(this.getInstance(), type, undefined, true).set(`0${data}`);
+            this.checkFocus(type);
+        }
+        if (`${data}`.length === 2) {
+            this.checkFocus(type);
+        }
+        if (data <= 2 && data > 0 && this.isZero() && `${data}`.length === 1) {
+            get(this.getInstance(), type, undefined, true).set(`0${data}`);
+            this.checkFocus(type);
+        }
+        if (data !== 0) {
+            this.isZero.set(false);
+        }
+        this.applyTime();
+    }
+    handlerValueMinutesChange(data, type) {
+        data = data;
+        if (data === 0) {
+            this.isZero.set(true);
+        }
+        if (this.isSelected() || Number(get(this.getInstance(), type)) === Number(data)) {
+            if (data === 0 && !this.keyCodeBackspace() && get(this.getInstance(), type) !== '00') {
+                this.checkFocus(type);
+            }
+            return;
+        }
+        if (data === undefined) {
+            get(this.getInstance(), type, undefined, true).set(data);
+            this.isZero.set(false);
+            this.applyTime();
+            return;
+        }
+        get(this.getInstance(), type, undefined, true).set(data);
+        if (data === 0) {
+            get(this.getInstance(), type, undefined, true).set('0');
+        }
+        this.isSelected.set(false);
+        this.checkValid(this.ignoreCheckValidWhenInput());
+        if (`${data}`.length === 2) {
+            this.checkFocus(type);
+        }
+        if (data > 5 && `${data}`.length < 2) {
+            get(this.getInstance(), type, undefined, true).set(`0${data}`);
+            this.checkFocus(type);
+        }
+        if (data <= 5 && data > 0 && this.isZero() && `${data}`.length === 1) {
+            get(this.getInstance(), type, undefined, true).set(`0${data}`);
+            this.checkFocus(type);
+        }
+        if (data !== 0) {
+            this.isZero.set(false);
+        }
+        this.applyTime();
+    }
+    checkFocus(type) {
+        if (type === 'toMinutes' || this.keyCodeBackspace()) {
+            return;
+        }
+        switch (type) {
+            case 'hours':
+                this.focusInput().fromMinutes?.focus();
+                break;
+            case 'toHours':
+                this.focusInput().toMinutes?.focus();
+                break;
+            case 'minutes':
+                if (this.multiTime()) {
+                    this.focusInput().toHours?.focus();
+                }
+                break;
+        }
+    }
+    handlerClickButtonLabel(button) {
+        this.outClickButtonLabel.emit(button);
+    }
+    handlerSwitchLabel(toggleEvent) {
+        this.outSwitchEventLabel.emit(toggleEvent);
+    }
+    handlerEventLabelRightLabel() {
+        this.outLabelRightClick.emit(true);
+    }
+    async checkValid(isValidateDefault = false) {
+        if (this.disable() || this.readonly()) {
+            return true;
+        }
+        this.isErrorRequired.set(false);
+        this.isErrorMultiRequired.set(false);
+        this.isErrorMultiValidCompareTime.set(false);
+        let valid = true;
+        if (!isValidateDefault) {
+            if ((isNil(this.hours()) || isNil(this.minutes())) && this.validRequired()) {
+                this.isErrorRequired.set(true);
+                valid = false;
+            }
+            if (this.multiTime()) {
+                if (this.validRequired() && (isNil(this.toHours()) || isNil(this.toMinutes()))) {
+                    this.isErrorMultiRequired.set(true);
+                    valid = false;
+                }
+                if (this.hours() &&
+                    this.toHours() &&
+                    this.minutes() &&
+                    this.toMinutes() &&
+                    this.validCompareTime() &&
+                    this.validCompareTime()?.isCheckErrorTimeEndGreaterTimeStart &&
+                    (Number(this.hours()) > Number(this.toHours()) || (Number(this.hours()) === Number(this.toHours()) && (this.ignoreAllowEqualTime() ? Number(this.minutes()) >= Number(this.toMinutes()) : Number(this.minutes()) > Number(this.toMinutes()))))) {
+                    this.isErrorMultiValidCompareTime.set(true);
+                    valid = false;
+                }
+                if (this.hours() &&
+                    this.toHours() &&
+                    this.minutes() &&
+                    this.toMinutes() &&
+                    this.validCompareTime() &&
+                    this.validCompareTime()?.isCheckErrorTimeDuplicate &&
+                    Number(this.hours()) === Number(this.toHours()) &&
+                    Number(this.minutes()) === Number(this.toMinutes())) {
+                    this.isErrorMultiValidCompareTime.set(true);
+                    valid = false;
+                }
+            }
+        }
+        this.outEmitValid.emit({ validRequired: !(this.isErrorMultiRequired() || this.isErrorRequired()), validCompare: !this.isErrorMultiValidCompareTime() });
+        return valid;
+    }
+    emitRealTime() {
+        this.outEmitRealTime.emit({ from: signal({ hours: Number(this.hours()), minute: Number(this.minutes()) }), to: signal({ hours: Number(this.toHours()), minute: Number(this.toMinutes()) }) });
+    }
+    async applyTime() {
+        if (this.isEmitRealTime()) {
+            this.emitRealTime();
+        }
+        if (this.cloneDeepTimeOutput() && !CompareTime(this.cloneDeepTimeOutput(), { from: signal({ hours: this.hours(), minute: this.minutes() }), to: signal({ hours: this.toHours(), minute: this.toMinutes() }) })) {
+            return;
+        }
+        this.cloneDeepTimeOutput.set(cloneDeep({ from: signal({ hours: this.hours(), minute: this.minutes() }), to: signal({ hours: this.toHours(), minute: this.toMinutes() }) }));
+        if (this.multiTime()) {
+            if (this.emitDataSingleDataWhenUseMultiTime()) {
+                this.checkValid(this.ignoreCheckValidWhenInput());
+                const from = signal({});
+                const to = signal({});
+                if (!isNil(this.hours()) && !isNil(this.minutes()) && !this.isErrorRequired()) {
+                    from.set({ hours: Number(this.hours()), minute: Number(this.minutes()) });
+                }
+                if (!isNil(this.toHours()) && !isNil(this.toMinutes()) && !this.isErrorMultiRequired()) {
+                    to.set({ hours: Number(this.toHours()), minute: Number(this.toMinutes()) });
+                }
+                if (this.validCompareTime() && this.isErrorMultiValidCompareTime()) {
+                    return;
+                }
+                this.outEmitMultiTime.emit({ from: from, to: to });
+                return;
+            }
+            if (!isNil(this.hours()) && !isNil(this.minutes()) && !isNil(this.toMinutes()) && !isNil(this.toHours()) && (await this.checkValid(this.ignoreCheckValidWhenInput()))) {
+                this.outEmitMultiTime.emit({ from: signal({ hours: Number(this.hours()), minute: Number(this.minutes()) }), to: signal({ hours: Number(this.toHours()), minute: Number(this.toMinutes()) }) });
+                return;
+            }
+            if (isNil(this.hours()) && isNil(this.minutes()) && isNil(this.toMinutes()) && isNil(this.toHours())) {
+                this.outEmitMultiTime.emit({ from: signal({ hours: undefined, minute: undefined }), to: signal({ hours: undefined, minute: undefined }) });
+                return;
+            }
+        }
+        if (!isNil(this.hours()) && !isNil(this.minutes()) && (await this.checkValid(this.ignoreCheckValidWhenInput()))) {
+            this.outEmitSingleTime.emit({ hours: Number(this.hours()), minute: Number(this.minutes()) });
+        }
+    }
+    handlerFocus(event, type) {
+        this.focusInput.update((current) => {
+            current[type] = event;
+            return current;
+        });
+    }
+    eventInput(event, type) {
+        this.isSelected.set(false);
+        this.writeDrownFromKeyboard.set(true);
+        if (event.keyCode === 96 && Number(get(this.getInstance(), type)) === 0) {
+            this.isZero.set(true);
+        }
+        if (event.keyCode !== 8) {
+            if (event.keyCode) {
+                this.checkBackspaceFocusMinutes.set(1);
+                this.checkBackspaceFocusToHours.set(1);
+                this.checkBackspaceFocusToMinutes.set(1);
+            }
+            this.keyCodeBackspace.set(false);
+            return;
+        }
+        this.keyCodeBackspace.set(true);
+        switch (type) {
+            case 'minutes':
+                if (isNil(this.minutes())) {
+                    if (this.checkBackspaceFocusMinutes() === 1) {
+                        this.checkBackspaceFocusMinutes.update((current) => {
+                            current = current + 1;
+                            return current;
+                        });
+                        return;
+                    }
+                    this.checkBackspaceFocusMinutes.set(1);
+                    this.focusInput().fromHours?.focus();
+                }
+                break;
+            case 'toHours':
+                if (isNil(this.toHours())) {
+                    if (this.checkBackspaceFocusToHours() === 1) {
+                        this.checkBackspaceFocusToHours.update((current) => {
+                            current = current + 1;
+                            return current;
+                        });
+                        return;
+                    }
+                    this.checkBackspaceFocusToHours.set(1);
+                    this.focusInput().fromMinutes?.focus();
+                }
+                break;
+            case 'toMinutes':
+                if (isNil(this.toMinutes())) {
+                    if (this.checkBackspaceFocusToMinutes() === 1) {
+                        this.checkBackspaceFocusToMinutes.update((current) => {
+                            current = current + 1;
+                            return current;
+                        });
+                        return;
+                    }
+                    this.checkBackspaceFocusToMinutes.set(1);
+                    this.focusInput().toHours?.focus();
+                }
+                break;
+        }
+    }
+    reset(multiTime) {
+        this.hours.set(undefined);
+        this.minutes.set(undefined);
+        if (multiTime) {
+            this.toHours.set(undefined);
+            this.toMinutes.set(undefined);
+        }
+    }
+    handlerClickClear() {
+        this.checkValid(true);
+        this.hours.set(undefined);
+        this.minutes.set(undefined);
+        if (this.multiTime()) {
+            this.toHours.set(undefined);
+            this.toMinutes.set(undefined);
+        }
+        this.outResetTime.emit(undefined);
+        this.checkValid(this.ignoreCheckValidWhenInput());
+    }
+    async resetError() {
+        this.isErrorRequired.set(false);
+        this.isErrorMultiRequired.set(false);
+        this.isErrorMultiValidCompareTime.set(false);
+    }
+    async setMessageError(message) {
+        this.otherError.set({ message });
+    }
+    getInstance() {
+        return this;
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: LibsUiComponentsDatetimeInputComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: LibsUiComponentsDatetimeInputComponent, isStandalone: true, selector: "libs_ui-components-datetime-input", inputs: { multiTime: { classPropertyName: "multiTime", publicName: "multiTime", isSignal: true, isRequired: false, transformFunction: null }, selectedTime: { classPropertyName: "selectedTime", publicName: "selectedTime", isSignal: true, isRequired: false, transformFunction: null }, classIncludeBetweenTime: { classPropertyName: "classIncludeBetweenTime", publicName: "classIncludeBetweenTime", isSignal: true, isRequired: false, transformFunction: null }, fromAndToDateLabel: { classPropertyName: "fromAndToDateLabel", publicName: "fromAndToDateLabel", isSignal: true, isRequired: false, transformFunction: null }, resetInput: { classPropertyName: "resetInput", publicName: "resetInput", isSignal: true, isRequired: false, transformFunction: null }, disable: { classPropertyName: "disable", publicName: "disable", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, labelConfig: { classPropertyName: "labelConfig", publicName: "labelConfig", isSignal: true, isRequired: false, transformFunction: null }, validRequired: { classPropertyName: "validRequired", publicName: "validRequired", isSignal: true, isRequired: false, transformFunction: null }, validCompareTime: { classPropertyName: "validCompareTime", publicName: "validCompareTime", isSignal: true, isRequired: false, transformFunction: null }, ignoreBorder: { classPropertyName: "ignoreBorder", publicName: "ignoreBorder", isSignal: true, isRequired: false, transformFunction: null }, ignoreMultiIcon: { classPropertyName: "ignoreMultiIcon", publicName: "ignoreMultiIcon", isSignal: true, isRequired: false, transformFunction: null }, classDatePickerInput: { classPropertyName: "classDatePickerInput", publicName: "classDatePickerInput", isSignal: true, isRequired: false, transformFunction: null }, ignoreShowValid: { classPropertyName: "ignoreShowValid", publicName: "ignoreShowValid", isSignal: true, isRequired: false, transformFunction: null }, ignoreCheckValidWhenInput: { classPropertyName: "ignoreCheckValidWhenInput", publicName: "ignoreCheckValidWhenInput", isSignal: true, isRequired: false, transformFunction: null }, ignoreAllowEqualTime: { classPropertyName: "ignoreAllowEqualTime", publicName: "ignoreAllowEqualTime", isSignal: true, isRequired: false, transformFunction: null }, emitDataSingleDataWhenUseMultiTime: { classPropertyName: "emitDataSingleDataWhenUseMultiTime", publicName: "emitDataSingleDataWhenUseMultiTime", isSignal: true, isRequired: false, transformFunction: null }, classIncludeInput: { classPropertyName: "classIncludeInput", publicName: "classIncludeInput", isSignal: true, isRequired: false, transformFunction: null }, showBorderError: { classPropertyName: "showBorderError", publicName: "showBorderError", isSignal: true, isRequired: false, transformFunction: null }, defaultHeight: { classPropertyName: "defaultHeight", publicName: "defaultHeight", isSignal: true, isRequired: false, transformFunction: null }, ignoreWithDefault: { classPropertyName: "ignoreWithDefault", publicName: "ignoreWithDefault", isSignal: true, isRequired: false, transformFunction: null }, isEmitRealTime: { classPropertyName: "isEmitRealTime", publicName: "isEmitRealTime", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { outEmitSingleTime: "outEmitSingleTime", outEmitMultiTime: "outEmitMultiTime", outClickButtonLabel: "outClickButtonLabel", outSwitchEventLabel: "outSwitchEventLabel", outLabelRightClick: "outLabelRightClick", outFunctionsControl: "outFunctionsControl", outEmitValid: "outEmitValid", outResetTime: "outResetTime", outEmitRealTime: "outEmitRealTime" }, ngImport: i0, template: "@if (labelConfig(); as labelConfig) {\n  <libs_ui-components-label\n    [classInclude]=\"labelConfig.classInclude\"\n    [labelLeft]=\"labelConfig.labelLeft\"\n    [labelLeftClass]=\"labelConfig.labelLeftClass\"\n    [required]=\"labelConfig.required\"\n    [description]=\"labelConfig.description\"\n    [descriptionClass]=\"labelConfig.descriptionClass\"\n    [labelRight]=\"labelConfig.labelRight\"\n    [labelRightClass]=\"labelConfig.labelRightClass\"\n    [onlyShowCount]=\"labelConfig.onlyShowCount\"\n    [buttonsLeft]=\"labelConfig.buttonsLeft\"\n    [disableButtonsLeft]=\"labelConfig.disableButtonsLeft\"\n    [buttonsRight]=\"labelConfig.buttonsRight\"\n    [disableButtonsRight]=\"labelConfig.disableButtonsRight\"\n    [hasToggle]=\"labelConfig.hasToggle\"\n    [toggleActive]=\"labelConfig.toggleActive\"\n    [toggleDisable]=\"labelConfig.toggleDisable\"\n    [popover]=\"labelConfig.popover\"\n    [iconPopoverClass]=\"labelConfig.iconPopoverClass\"\n    [onlyShowCount]=\"labelConfig.onlyShowCount\"\n    [limitLength]=\"labelConfig.limitLength\"\n    [count]=\"labelConfig.count\"\n    (outClickButton)=\"handlerClickButtonLabel($event)\"\n    (outSwitchEvent)=\"handlerSwitchLabel($event)\"\n    (outLabelRightClick)=\"handlerEventLabelRightLabel()\" />\n}\n<div class=\"flex items-baseline\">\n  <div\n    class=\" libs-ui-date-time-input {{ classDatePickerInput() ?? '' }} relative\"\n    [class.!w-[123px]]=\"!ignoreWithDefault() && resetInput() && !multiTime()\"\n    [class.!w-[155px]]=\"!ignoreWithDefault() && !resetInput() && multiTime()\"\n    [class.!w-[99px]]=\"!ignoreWithDefault() && !resetInput() && !multiTime()\"\n    [class.!w-[179px]]=\"!ignoreWithDefault() && resetInput() && multiTime()\"\n    [class.!bg-[#f8f9fa]]=\"readonly()\"\n    [class.libs-ui-border-general]=\"!isErrorRequired() && !isErrorMultiValidCompareTime() && !ignoreBorder()\"\n    [class.!border]=\"changeBorderFocus().changeBorder && !ignoreBorder() && !(isErrorRequired() || isErrorMultiValidCompareTime())\"\n    [class.!border-[1px]]=\"changeBorderFocus().changeBorder && !ignoreBorder() && !(isErrorRequired() || isErrorMultiValidCompareTime())\"\n    [class.!border-[#4e8cf7]]=\"changeBorderFocus().changeBorder && !ignoreBorder() && !(isErrorRequired() || isErrorMultiValidCompareTime())\"\n    [class.libs-ui-border-error-general]=\"(isErrorRequired() || isErrorMultiValidCompareTime() || showBorderError()) && !ignoreBorder()\">\n    <div class=\"pr-[8px] pl-[16px] h-full flex items-center\">\n      <i\n        class=\"libs-ui-icon-clock text-[14px] text-[#9ca2ad]\"\n        [class.opacity-0.5]=\"disable()\"></i>\n    </div>\n    <div class=\"flex items-baseline\">\n      <div\n        [class.!w-[16px]]=\"hours()\"\n        [class.!w-[18px]]=\"!hours()\">\n        <libs_ui-components-inputs-input\n          classInclude=\"!p-0 w-full !border-none text-center text-[#333333] {{ classIncludeInput() }}\"\n          [dataType]=\"'int'\"\n          [autoAddZeroLessThan10InTypeInt]=\"true\"\n          [emitEmptyInDataTypeNumber]=\"true\"\n          [disable]=\"disable()\"\n          [defaultHeight]=\"defaultHeight()\"\n          [readonly]=\"readonly()\"\n          [maxValueNumber]=\"23\"\n          [minValueNumber]=\"0\"\n          [value]=\"hours() || ''\"\n          [placeholder]=\"'hh'\"\n          [focusTimeOut]=\"0\"\n          (outInputEvent)=\"eventInput($event, 'hours')\"\n          (outChange)=\"handlerValueHoursChange($event, 'hours')\"\n          (outFocusAndBlurEvent)=\"handlerFocusAndBlur($event, 'hours')\"\n          (outFunctionsControl)=\"handlerFocus($event, 'fromHours')\"\n          [maxLength]=\"2\" />\n      </div>\n      <div\n        class=\"libs-ui-font-h4r flex items-center\"\n        [class.!text-[#9ca2ad]]=\"!hours() && !minutes()\"\n        [class.!text-[#071631]]=\"hours() || minutes()\"\n        [class.opacity-0.5]=\"disable()\">\n        &colon;\n      </div>\n      <div\n        [class.w-[16px]]=\"minutes()\"\n        [class.w-[28px]]=\"!minutes()\">\n        <libs_ui-components-inputs-input\n          classInclude=\"w-full !p-0 !border-none text-center text-[#333333] {{ classIncludeInput() }}\"\n          [dataType]=\"'int'\"\n          [disable]=\"disable()\"\n          [defaultHeight]=\"defaultHeight()\"\n          [readonly]=\"readonly()\"\n          [placeholder]=\"'mm'\"\n          [autoAddZeroLessThan10InTypeInt]=\"true\"\n          [emitEmptyInDataTypeNumber]=\"true\"\n          [maxValueNumber]=\"59\"\n          [focusTimeOut]=\"0\"\n          (outInputEvent)=\"eventInput($event, 'minutes')\"\n          (outFunctionsControl)=\"handlerFocus($event, 'fromMinutes')\"\n          (outFocusAndBlurEvent)=\"handlerFocusAndBlurMinutes($event, 'minutes')\"\n          (outChange)=\"handlerValueMinutesChange($event, 'minutes')\"\n          [value]=\"minutes() || ''\"\n          [maxLength]=\"2\" />\n      </div>\n    </div>\n    @if (multiTime()) {\n      <div\n        class=\"ml-[4px] mr-[3px] h-full flex items-center pt-[1px] libs-ui-font-h6r\"\n        [class.text-[#9ca2ad]]=\"!hours() && !minutes() && !toHours() && !toMinutes()\"\n        [class.text-[#071631]]=\"hours() || minutes() || toHours() || toMinutes()\">\n        -\n      </div>\n      <div class=\"flex items-baseline\">\n        <div\n          [class.!w-[16px]]=\"toHours()\"\n          [class.!w-[18px]]=\"!toHours()\">\n          <libs_ui-components-inputs-input\n            classInclude=\"w-full !p-0 !border-none text-center text-[#333333] {{ classIncludeInput() }}\"\n            [dataType]=\"'int'\"\n            [disable]=\"disable()\"\n            [defaultHeight]=\"defaultHeight()\"\n            [readonly]=\"readonly()\"\n            [maxValueNumber]=\"23\"\n            [minValueNumber]=\"0\"\n            [autoAddZeroLessThan10InTypeInt]=\"true\"\n            [emitEmptyInDataTypeNumber]=\"true\"\n            [value]=\"toHours() || ''\"\n            [placeholder]=\"'hh'\"\n            [focusTimeOut]=\"0\"\n            (outInputEvent)=\"eventInput($event, 'toHours')\"\n            (outFunctionsControl)=\"handlerFocus($event, 'toHours')\"\n            (outFocusAndBlurEvent)=\"handlerFocusAndBlur($event, 'toHours')\"\n            (outChange)=\"handlerValueHoursChange($event, 'toHours')\"\n            [maxLength]=\"2\" />\n        </div>\n        <div\n          class=\"libs-ui-font-h4r flex items-center\"\n          [class.!text-[#9ca2ad]]=\"!toHours() && !toMinutes()\"\n          [class.!text-[#071631]]=\"toHours() || toMinutes()\"\n          [class.opacity-0.5]=\"disable()\">\n          &colon;\n        </div>\n        <div\n          [class.!w-[16px]]=\"toMinutes()\"\n          [class.!w-[28px]]=\"!toMinutes()\">\n          <libs_ui-components-inputs-input\n            classInclude=\"w-full !p-0 !border-none text-center text-[#333333] {{ classIncludeInput() }}\"\n            [dataType]=\"'int'\"\n            [defaultHeight]=\"defaultHeight()\"\n            [disable]=\"disable()\"\n            [readonly]=\"readonly()\"\n            [placeholder]=\"'mm'\"\n            [autoAddZeroLessThan10InTypeInt]=\"true\"\n            [emitEmptyInDataTypeNumber]=\"true\"\n            [maxValueNumber]=\"59\"\n            [focusTimeOut]=\"0\"\n            [value]=\"toMinutes() || ''\"\n            [maxLength]=\"2\"\n            (outInputEvent)=\"eventInput($event, 'toMinutes')\"\n            (outFunctionsControl)=\"handlerFocus($event, 'toMinutes')\"\n            (outFocusAndBlurEvent)=\"handlerFocusAndBlurMinutes($event, 'toMinutes')\"\n            (outChange)=\"handlerValueMinutesChange($event, 'toMinutes')\" />\n        </div>\n      </div>\n    }\n    @if (resetInput() && (hours() || minutes()) && !disable() && !readonly()) {\n      <div\n        class=\"h-full items-center flex ml-[2px] cursor-pointer absolute right-[10px] top-0\"\n        (click)=\"handlerClickClear()\">\n        <i class=\"libs-ui-icon-close-circle-solid !before:text-[8px] text-[#cdd0d6]\"></i>\n      </div>\n    }\n  </div>\n</div>\n@if (!ignoreShowValid() && !isErrorMultiValidCompareTime() && (isErrorMultiRequired() || isErrorRequired()) && !disable() && !readonly()) {\n  <div class=\"flex items-center mt-[8px] bottom-0\">\n    @let constHtmlMessage = validRequired()?.message || 'i18n_valid_empty_message';\n    <span\n      [class]=\"'libs-ui-message-error libs-ui-font-h7r libs-ui-text-error'\"\n      [innerHtml]=\"constHtmlMessage | translate: validRequired()?.interpolateParams\"></span>\n  </div>\n}\n@if (!ignoreShowValid() && isErrorMultiValidCompareTime() && !disable() && !readonly()) {\n  <div class=\"flex items-center mt-[8px] bottom-0\">\n    @let constHtmlMessage = validCompareTime()?.message || 'i18n_invalid_end_date_selected';\n    <span\n      class=\"libs-ui-message-error libs-ui-font-h7r libs-ui-text-error\"\n      [innerHtml]=\"constHtmlMessage | translate: validCompareTime()?.interpolateParams\"></span>\n  </div>\n}\n\n@if (!ignoreShowValid() && !isErrorMultiValidCompareTime() && !isErrorMultiRequired() && !isErrorRequired() && !disable() && !readonly() && otherError()?.message) {\n  <div class=\"flex items-center mt-[8px] bottom-0\">\n    @let constHtmlMessage = otherError()?.message || ' ';\n    <span\n      class=\"libs-ui-message-error libs-ui-font-h7r libs-ui-text-error\"\n      [innerHtml]=\"constHtmlMessage | translate: otherError()?.interpolateParams\"></span>\n  </div>\n}\n", styles: [".libs-ui-date-time-input{display:flex;align-items:center;height:32px;border-radius:4px;background-color:#fff}:host ::ng-deep ::-webkit-input-placeholder{color:#9ca2ad!important;text-indent:0}:host ::ng-deep ::-moz-placeholder{color:#9ca2ad!important;text-indent:0}:host ::ng-deep :-ms-input-placeholder{color:#9ca2ad!important;text-indent:0}:host ::ng-deep :-moz-placeholder{color:#9ca2ad!important;text-indent:0}\n"], dependencies: [{ kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }, { kind: "component", type: LibsUiComponentsLabelComponent, selector: "libs_ui-components-label", inputs: ["iconPopoverClass", "classInclude", "labelLeft", "labelLeftClass", "labelLeftBehindToggleButton", "popover", "required", "buttonsLeft", "disableButtonsLeft", "buttonsRight", "disableButtonsRight", "labelRight", "labelRightClass", "labelRightRequired", "hasToggle", "toggleSize", "toggleActive", "toggleDisable", "description", "descriptionClass", "buttonsDescription", "disableButtonsDescription", "buttonsDescriptionContainerClass", "onlyShowCount", "zIndexPopover", "timerDestroyPopover", "count", "limitLength"], outputs: ["outClickButton", "outSwitchEvent", "outLabelRightClick", "outLabelLeftClick"] }, { kind: "component", type: LibsUiComponentsInputsInputComponent, selector: "libs_ui-components-inputs-input", inputs: ["tagInput", "dataType", "typeInput", "modeInput", "tabInsertContentTagInput", "textAreaEnterNotNewLine", "emitEmptyInDataTypeNumber", "keepZeroInTypeInt", "autoAddZeroLessThan10InTypeInt", "ignoreBlockInputMaxValue", "maxValueNumber", "minValueNumber", "fixedFloat", "acceptNegativeValue", "valueUpDownNumber", "classInclude", "maxLength", "readonly", "disable", "noBorder", "backgroundNone", "borderError", "useColorModeExist", "placeholder", "keepPlaceholderOnly", "value", "autoRemoveEmoji", "defaultHeight", "minHeightTextArea", "maxHeightTextArea", "focusTimeOut", "selectAllTimeOut", "blurTimeOut", "zIndexPopoverContent", "classContainerInput", "showCount", "ignoreStopPropagationEvent", "resize", "templateLeftBottomInput", "templateRightBottomInput", "classContainerBottomInput", "ignoreWidthInput100", "iframeTextareaCustomStyle", "iconLeftClass", "popoverContentIconLeft", "iconRightClass", "popoverContentIconRight", "resetAutoCompletePassword", "acceptOnlyClickIcon", "setIconRightColorSameColorDisableReadOnly", "onlyAcceptNegativeValue", "maxLengthNumberCount", "focusInput"], outputs: ["maxValueNumberChange", "minValueNumberChange", "fixedFloatChange", "acceptNegativeValueChange", "maxLengthChange", "valueChange", "maxLengthNumberCountChange", "outHeightAreaChange", "outChange", "outFocusAndBlurEvent", "outEnterEvent", "outInputEvent", "outIconLeft", "outIconRight", "outFunctionsControl", "outFilesDrop", "outFileDrop", "outChangeValueByButtonUpDown"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: LibsUiComponentsDatetimeInputComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'libs_ui-components-datetime-input', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, imports: [TranslateModule, LibsUiComponentsLabelComponent, LibsUiComponentsInputsInputComponent], template: "@if (labelConfig(); as labelConfig) {\n  <libs_ui-components-label\n    [classInclude]=\"labelConfig.classInclude\"\n    [labelLeft]=\"labelConfig.labelLeft\"\n    [labelLeftClass]=\"labelConfig.labelLeftClass\"\n    [required]=\"labelConfig.required\"\n    [description]=\"labelConfig.description\"\n    [descriptionClass]=\"labelConfig.descriptionClass\"\n    [labelRight]=\"labelConfig.labelRight\"\n    [labelRightClass]=\"labelConfig.labelRightClass\"\n    [onlyShowCount]=\"labelConfig.onlyShowCount\"\n    [buttonsLeft]=\"labelConfig.buttonsLeft\"\n    [disableButtonsLeft]=\"labelConfig.disableButtonsLeft\"\n    [buttonsRight]=\"labelConfig.buttonsRight\"\n    [disableButtonsRight]=\"labelConfig.disableButtonsRight\"\n    [hasToggle]=\"labelConfig.hasToggle\"\n    [toggleActive]=\"labelConfig.toggleActive\"\n    [toggleDisable]=\"labelConfig.toggleDisable\"\n    [popover]=\"labelConfig.popover\"\n    [iconPopoverClass]=\"labelConfig.iconPopoverClass\"\n    [onlyShowCount]=\"labelConfig.onlyShowCount\"\n    [limitLength]=\"labelConfig.limitLength\"\n    [count]=\"labelConfig.count\"\n    (outClickButton)=\"handlerClickButtonLabel($event)\"\n    (outSwitchEvent)=\"handlerSwitchLabel($event)\"\n    (outLabelRightClick)=\"handlerEventLabelRightLabel()\" />\n}\n<div class=\"flex items-baseline\">\n  <div\n    class=\" libs-ui-date-time-input {{ classDatePickerInput() ?? '' }} relative\"\n    [class.!w-[123px]]=\"!ignoreWithDefault() && resetInput() && !multiTime()\"\n    [class.!w-[155px]]=\"!ignoreWithDefault() && !resetInput() && multiTime()\"\n    [class.!w-[99px]]=\"!ignoreWithDefault() && !resetInput() && !multiTime()\"\n    [class.!w-[179px]]=\"!ignoreWithDefault() && resetInput() && multiTime()\"\n    [class.!bg-[#f8f9fa]]=\"readonly()\"\n    [class.libs-ui-border-general]=\"!isErrorRequired() && !isErrorMultiValidCompareTime() && !ignoreBorder()\"\n    [class.!border]=\"changeBorderFocus().changeBorder && !ignoreBorder() && !(isErrorRequired() || isErrorMultiValidCompareTime())\"\n    [class.!border-[1px]]=\"changeBorderFocus().changeBorder && !ignoreBorder() && !(isErrorRequired() || isErrorMultiValidCompareTime())\"\n    [class.!border-[#4e8cf7]]=\"changeBorderFocus().changeBorder && !ignoreBorder() && !(isErrorRequired() || isErrorMultiValidCompareTime())\"\n    [class.libs-ui-border-error-general]=\"(isErrorRequired() || isErrorMultiValidCompareTime() || showBorderError()) && !ignoreBorder()\">\n    <div class=\"pr-[8px] pl-[16px] h-full flex items-center\">\n      <i\n        class=\"libs-ui-icon-clock text-[14px] text-[#9ca2ad]\"\n        [class.opacity-0.5]=\"disable()\"></i>\n    </div>\n    <div class=\"flex items-baseline\">\n      <div\n        [class.!w-[16px]]=\"hours()\"\n        [class.!w-[18px]]=\"!hours()\">\n        <libs_ui-components-inputs-input\n          classInclude=\"!p-0 w-full !border-none text-center text-[#333333] {{ classIncludeInput() }}\"\n          [dataType]=\"'int'\"\n          [autoAddZeroLessThan10InTypeInt]=\"true\"\n          [emitEmptyInDataTypeNumber]=\"true\"\n          [disable]=\"disable()\"\n          [defaultHeight]=\"defaultHeight()\"\n          [readonly]=\"readonly()\"\n          [maxValueNumber]=\"23\"\n          [minValueNumber]=\"0\"\n          [value]=\"hours() || ''\"\n          [placeholder]=\"'hh'\"\n          [focusTimeOut]=\"0\"\n          (outInputEvent)=\"eventInput($event, 'hours')\"\n          (outChange)=\"handlerValueHoursChange($event, 'hours')\"\n          (outFocusAndBlurEvent)=\"handlerFocusAndBlur($event, 'hours')\"\n          (outFunctionsControl)=\"handlerFocus($event, 'fromHours')\"\n          [maxLength]=\"2\" />\n      </div>\n      <div\n        class=\"libs-ui-font-h4r flex items-center\"\n        [class.!text-[#9ca2ad]]=\"!hours() && !minutes()\"\n        [class.!text-[#071631]]=\"hours() || minutes()\"\n        [class.opacity-0.5]=\"disable()\">\n        &colon;\n      </div>\n      <div\n        [class.w-[16px]]=\"minutes()\"\n        [class.w-[28px]]=\"!minutes()\">\n        <libs_ui-components-inputs-input\n          classInclude=\"w-full !p-0 !border-none text-center text-[#333333] {{ classIncludeInput() }}\"\n          [dataType]=\"'int'\"\n          [disable]=\"disable()\"\n          [defaultHeight]=\"defaultHeight()\"\n          [readonly]=\"readonly()\"\n          [placeholder]=\"'mm'\"\n          [autoAddZeroLessThan10InTypeInt]=\"true\"\n          [emitEmptyInDataTypeNumber]=\"true\"\n          [maxValueNumber]=\"59\"\n          [focusTimeOut]=\"0\"\n          (outInputEvent)=\"eventInput($event, 'minutes')\"\n          (outFunctionsControl)=\"handlerFocus($event, 'fromMinutes')\"\n          (outFocusAndBlurEvent)=\"handlerFocusAndBlurMinutes($event, 'minutes')\"\n          (outChange)=\"handlerValueMinutesChange($event, 'minutes')\"\n          [value]=\"minutes() || ''\"\n          [maxLength]=\"2\" />\n      </div>\n    </div>\n    @if (multiTime()) {\n      <div\n        class=\"ml-[4px] mr-[3px] h-full flex items-center pt-[1px] libs-ui-font-h6r\"\n        [class.text-[#9ca2ad]]=\"!hours() && !minutes() && !toHours() && !toMinutes()\"\n        [class.text-[#071631]]=\"hours() || minutes() || toHours() || toMinutes()\">\n        -\n      </div>\n      <div class=\"flex items-baseline\">\n        <div\n          [class.!w-[16px]]=\"toHours()\"\n          [class.!w-[18px]]=\"!toHours()\">\n          <libs_ui-components-inputs-input\n            classInclude=\"w-full !p-0 !border-none text-center text-[#333333] {{ classIncludeInput() }}\"\n            [dataType]=\"'int'\"\n            [disable]=\"disable()\"\n            [defaultHeight]=\"defaultHeight()\"\n            [readonly]=\"readonly()\"\n            [maxValueNumber]=\"23\"\n            [minValueNumber]=\"0\"\n            [autoAddZeroLessThan10InTypeInt]=\"true\"\n            [emitEmptyInDataTypeNumber]=\"true\"\n            [value]=\"toHours() || ''\"\n            [placeholder]=\"'hh'\"\n            [focusTimeOut]=\"0\"\n            (outInputEvent)=\"eventInput($event, 'toHours')\"\n            (outFunctionsControl)=\"handlerFocus($event, 'toHours')\"\n            (outFocusAndBlurEvent)=\"handlerFocusAndBlur($event, 'toHours')\"\n            (outChange)=\"handlerValueHoursChange($event, 'toHours')\"\n            [maxLength]=\"2\" />\n        </div>\n        <div\n          class=\"libs-ui-font-h4r flex items-center\"\n          [class.!text-[#9ca2ad]]=\"!toHours() && !toMinutes()\"\n          [class.!text-[#071631]]=\"toHours() || toMinutes()\"\n          [class.opacity-0.5]=\"disable()\">\n          &colon;\n        </div>\n        <div\n          [class.!w-[16px]]=\"toMinutes()\"\n          [class.!w-[28px]]=\"!toMinutes()\">\n          <libs_ui-components-inputs-input\n            classInclude=\"w-full !p-0 !border-none text-center text-[#333333] {{ classIncludeInput() }}\"\n            [dataType]=\"'int'\"\n            [defaultHeight]=\"defaultHeight()\"\n            [disable]=\"disable()\"\n            [readonly]=\"readonly()\"\n            [placeholder]=\"'mm'\"\n            [autoAddZeroLessThan10InTypeInt]=\"true\"\n            [emitEmptyInDataTypeNumber]=\"true\"\n            [maxValueNumber]=\"59\"\n            [focusTimeOut]=\"0\"\n            [value]=\"toMinutes() || ''\"\n            [maxLength]=\"2\"\n            (outInputEvent)=\"eventInput($event, 'toMinutes')\"\n            (outFunctionsControl)=\"handlerFocus($event, 'toMinutes')\"\n            (outFocusAndBlurEvent)=\"handlerFocusAndBlurMinutes($event, 'toMinutes')\"\n            (outChange)=\"handlerValueMinutesChange($event, 'toMinutes')\" />\n        </div>\n      </div>\n    }\n    @if (resetInput() && (hours() || minutes()) && !disable() && !readonly()) {\n      <div\n        class=\"h-full items-center flex ml-[2px] cursor-pointer absolute right-[10px] top-0\"\n        (click)=\"handlerClickClear()\">\n        <i class=\"libs-ui-icon-close-circle-solid !before:text-[8px] text-[#cdd0d6]\"></i>\n      </div>\n    }\n  </div>\n</div>\n@if (!ignoreShowValid() && !isErrorMultiValidCompareTime() && (isErrorMultiRequired() || isErrorRequired()) && !disable() && !readonly()) {\n  <div class=\"flex items-center mt-[8px] bottom-0\">\n    @let constHtmlMessage = validRequired()?.message || 'i18n_valid_empty_message';\n    <span\n      [class]=\"'libs-ui-message-error libs-ui-font-h7r libs-ui-text-error'\"\n      [innerHtml]=\"constHtmlMessage | translate: validRequired()?.interpolateParams\"></span>\n  </div>\n}\n@if (!ignoreShowValid() && isErrorMultiValidCompareTime() && !disable() && !readonly()) {\n  <div class=\"flex items-center mt-[8px] bottom-0\">\n    @let constHtmlMessage = validCompareTime()?.message || 'i18n_invalid_end_date_selected';\n    <span\n      class=\"libs-ui-message-error libs-ui-font-h7r libs-ui-text-error\"\n      [innerHtml]=\"constHtmlMessage | translate: validCompareTime()?.interpolateParams\"></span>\n  </div>\n}\n\n@if (!ignoreShowValid() && !isErrorMultiValidCompareTime() && !isErrorMultiRequired() && !isErrorRequired() && !disable() && !readonly() && otherError()?.message) {\n  <div class=\"flex items-center mt-[8px] bottom-0\">\n    @let constHtmlMessage = otherError()?.message || ' ';\n    <span\n      class=\"libs-ui-message-error libs-ui-font-h7r libs-ui-text-error\"\n      [innerHtml]=\"constHtmlMessage | translate: otherError()?.interpolateParams\"></span>\n  </div>\n}\n", styles: [".libs-ui-date-time-input{display:flex;align-items:center;height:32px;border-radius:4px;background-color:#fff}:host ::ng-deep ::-webkit-input-placeholder{color:#9ca2ad!important;text-indent:0}:host ::ng-deep ::-moz-placeholder{color:#9ca2ad!important;text-indent:0}:host ::ng-deep :-ms-input-placeholder{color:#9ca2ad!important;text-indent:0}:host ::ng-deep :-moz-placeholder{color:#9ca2ad!important;text-indent:0}\n"] }]
+        }], ctorParameters: () => [] });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { LibsUiComponentsDatetimeInputComponent };
+//# sourceMappingURL=libs-ui-components-datetime-input.mjs.map