@cauca-911/material/fesm2022/cauca-911-material.mjs

Run `npm install @cauca-911/material --save` to add this library to your project

import * as i0 from '@angular/core';
import { Injectable, ChangeDetectionStrategy, Component, input, output, signal, inject, HostListener, model, computed, Injector, ElementRef, Directive, forwardRef, TemplateRef, Input, Optional, Self, ContentChild, ViewChild, resource, effect, DestroyRef, contentChild, contentChildren, ViewEncapsulation, NgModule, Pipe, EventEmitter, Output } from '@angular/core';
import { TranslatePipe, TranslateService, TranslateDirective } from '@ngx-translate/core';
import * as i1$4 from '@angular/material/dialog';
import { MatDialogRef, MAT_DIALOG_DATA, MatDialog, MatDialogModule, MatDialogTitle, MatDialogContent, MatDialogActions } from '@angular/material/dialog';
import * as i1$1 from '@angular/material/icon';
import { MatIconModule, MatIcon, MAT_ICON_DEFAULT_OPTIONS } from '@angular/material/icon';
import * as i3$1 from '@angular/material/input';
import { MatInputModule, MatInput } from '@angular/material/input';
import { provideNativeDateAdapter } from '@angular/material/core';
import * as i2 from '@angular/material/datepicker';
import { MatDatepickerModule } from '@angular/material/datepicker';
import * as i1$2 from '@angular/material/list';
import { MatListModule } from '@angular/material/list';
import * as i1 from '@angular/material/button';
import { MatButtonModule, MatButton, MatIconButton } from '@angular/material/button';
import * as i3 from '@angular/common';
import { CommonModule, DatePipe, NgClass } from '@angular/common';
import * as i1$3 from '@angular/material/form-field';
import { MatFormFieldModule, MatFormFieldControl, MAT_FORM_FIELD_DEFAULT_OPTIONS } from '@angular/material/form-field';
import * as i1$5 from '@angular/forms';
import { Validators, NgControl, FormControlName, ControlContainer, FormControl, NG_VALUE_ACCESSOR, UntypedFormBuilder, ReactiveFormsModule, FormsModule, FormGroup, NgForm, FormGroupDirective, FormControlDirective, UntypedFormControl } from '@angular/forms';
import { Clipboard } from '@angular/cdk/clipboard';
import { MatMenuItem, MatMenuTrigger } from '@angular/material/menu';
import { firstValueFrom, of, tap, mergeMap, catchError, finalize, throwError, filter, Subject, startWith, map, fromEvent, ReplaySubject, switchMap, EMPTY, combineLatest, distinctUntilChanged } from 'rxjs';
import { takeUntilDestroyed, toSignal } from '@angular/core/rxjs-interop';
import { BreakpointObserver } from '@angular/cdk/layout';
import * as i4 from '@angular/cdk/text-field';
import { MatProgressSpinner } from '@angular/material/progress-spinner';
import * as i1$6 from '@angular/material/chips';
import { MatChipsModule, MatChipGrid, MatChip, MatChipRemove, MatChipInput } from '@angular/material/chips';
import * as i1$7 from '@fortawesome/angular-fontawesome';
import { FontAwesomeModule } from '@fortawesome/angular-fontawesome';
import { coerceBooleanProperty } from '@angular/cdk/coercion';
import * as i2$1 from '@angular/material/autocomplete';
import { MatAutocompleteModule, MatAutocompleteTrigger } from '@angular/material/autocomplete';
import { toLowerCaseAndWithoutDiacritics, TranslateService as TranslateService$1, CaucaCoreService } from '@cauca-911/core';
import { ColorPickerDirective } from 'ngx-color-picker';
import * as i2$2 from '@angular/material/select';
import { MatSelectModule } from '@angular/material/select';
import * as i5 from 'ngx-mat-select-search';
import { NgxMatSelectSearchModule } from 'ngx-mat-select-search';
import * as i1$8 from '@angular/router';
import { Router, RouterModule } from '@angular/router';
import { MatTabGroup, MatTab } from '@angular/material/tabs';

class CaucaMaterialService {
    static { this.ɵfac = function CaucaMaterialService_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || CaucaMaterialService)(); }; }
    static { this.ɵprov = /*@__PURE__*/ i0.ɵɵdefineInjectable({ token: CaucaMaterialService, factory: CaucaMaterialService.ɵfac, providedIn: 'root' }); }
}
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(CaucaMaterialService, [{
        type: Injectable,
        args: [{
                providedIn: 'root'
            }]
    }], null, null); })();

class CaucaMaterialComponent {
    static { this.ɵfac = function CaucaMaterialComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || CaucaMaterialComponent)(); }; }
    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: CaucaMaterialComponent, selectors: [["cauca-material"]], decls: 3, vars: 3, template: function CaucaMaterialComponent_Template(rf, ctx) { if (rf & 1) {
            i0.ɵɵdomElementStart(0, "div");
            i0.ɵɵtext(1);
            i0.ɵɵpipe(2, "translate");
            i0.ɵɵdomElementEnd();
        } if (rf & 2) {
            i0.ɵɵadvance();
            i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(2, 1, "core.noGenericComponentOnThisLibrary"));
        } }, dependencies: [TranslatePipe], encapsulation: 2, changeDetection: 0 }); }
}
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(CaucaMaterialComponent, [{
        type: Component,
        args: [{ selector: 'cauca-material', imports: [TranslatePipe], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div>{{'core.noGenericComponentOnThisLibrary' | translate}}</div>" }]
    }], null, null); })();
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(CaucaMaterialComponent, { className: "CaucaMaterialComponent", filePath: "lib/cauca-material.component.ts", lineNumber: 11 }); })();

class MobileTimePickerComponent {
    constructor() {
        this.value = input.required(...(ngDevMode ? [{ debugName: "value" }] : []));
        this.options = input.required(...(ngDevMode ? [{ debugName: "options" }] : []));
        this.valueChange = output();
    }
    valueUp() {
        const currentIndex = this.options().indexOf(this.value());
        let newValue = 0;
        if (currentIndex === this.options().length - 1) {
            newValue = this.options()[0];
        }
        else {
            newValue = this.options()[currentIndex + 1];
        }
        this.valueChange.emit(newValue);
    }
    valueDown() {
        const currentIndex = this.options().indexOf(this.value());
        let newValue = 0;
        if (currentIndex === 0) {
            newValue = this.options()[this.options().length - 1];
        }
        else {
            newValue = this.options()[currentIndex - 1];
        }
        this.valueChange.emit(newValue);
    }
    static { this.ɵfac = function MobileTimePickerComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || MobileTimePickerComponent)(); }; }
    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: MobileTimePickerComponent, selectors: [["cauca-mobile-time-picker"]], inputs: { value: [1, "value"], options: [1, "options"] }, outputs: { valueChange: "valueChange" }, decls: 8, vars: 1, consts: [["mat-icon-button", "", 3, "click"]], template: function MobileTimePickerComponent_Template(rf, ctx) { if (rf & 1) {
            i0.ɵɵelementStart(0, "button", 0);
            i0.ɵɵlistener("click", function MobileTimePickerComponent_Template_button_click_0_listener() { return ctx.valueUp(); });
            i0.ɵɵelementStart(1, "mat-icon");
            i0.ɵɵtext(2, "keyboard_arrow_up");
            i0.ɵɵelementEnd()();
            i0.ɵɵelementStart(3, "div");
            i0.ɵɵtext(4);
            i0.ɵɵelementEnd();
            i0.ɵɵelementStart(5, "button", 0);
            i0.ɵɵlistener("click", function MobileTimePickerComponent_Template_button_click_5_listener() { return ctx.valueDown(); });
            i0.ɵɵelementStart(6, "mat-icon");
            i0.ɵɵtext(7, "keyboard_arrow_down");
            i0.ɵɵelementEnd()();
        } if (rf & 2) {
            i0.ɵɵadvance(4);
            i0.ɵɵtextInterpolate1("\n", (ctx.value() < 10 ? "0" : "") + ctx.value(), "\n");
        } }, dependencies: [MatButtonModule, i1.MatIconButton, MatIconModule, i1$1.MatIcon, MatFormFieldModule,
            MatInputModule], styles: ["[_nghost-%COMP%]{display:flex;flex-direction:column;align-items:center;justify-content:center;height:70px;font-family:var(--mat-form-field-container-text-font)}.mat-mdc-icon-button[_ngcontent-%COMP%]{height:24px;width:24px;line-height:24px;padding:0}"], changeDetection: 0 }); }
}
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(MobileTimePickerComponent, [{
        type: Component,
        args: [{ selector: 'cauca-mobile-time-picker', imports: [
                    MatButtonModule,
                    MatIconModule,
                    MatFormFieldModule,
                    MatInputModule
                ], changeDetection: ChangeDetectionStrategy.OnPush, template: "<button mat-icon-button (click)=\"valueUp()\">\r\n    <mat-icon>keyboard_arrow_up</mat-icon>\r\n</button>\r\n<div>\r\n{{(value() < 10 ? '0' : '' ) + value()}}\r\n</div>\r\n<button mat-icon-button (click)=\"valueDown()\">\r\n    <mat-icon>keyboard_arrow_down</mat-icon>\r\n</button>\r\n", styles: [":host{display:flex;flex-direction:column;align-items:center;justify-content:center;height:70px;font-family:var(--mat-form-field-container-text-font)}.mat-mdc-icon-button{height:24px;width:24px;line-height:24px;padding:0}\n"] }]
    }], null, { value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: true }] }], options: [{ type: i0.Input, args: [{ isSignal: true, alias: "options", required: true }] }], valueChange: [{ type: i0.Output, args: ["valueChange"] }] }); })();
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(MobileTimePickerComponent, { className: "MobileTimePickerComponent", filePath: "lib/components/cauca-date-time-picker/components/mobile-time-picker/mobile-time-picker.component.ts", lineNumber: 19 }); })();

function DesktopTimePickerComponent_For_2_Template(rf, ctx) { if (rf & 1) {
    const _r1 = i0.ɵɵgetCurrentView();
    i0.ɵɵelementStart(0, "mat-list-item", 2);
    i0.ɵɵlistener("click", function DesktopTimePickerComponent_For_2_Template_mat_list_item_click_0_listener() { const option_r2 = i0.ɵɵrestoreView(_r1).$implicit; const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.valueChange.emit(option_r2)); });
    i0.ɵɵtext(1);
    i0.ɵɵelementEnd();
} if (rf & 2) {
    let tmp_11_0;
    const option_r2 = ctx.$implicit;
    const ctx_r2 = i0.ɵɵnextContext();
    i0.ɵɵproperty("activated", ctx_r2.value() === option_r2)("disabled", (tmp_11_0 = ctx_r2.disabled()) == null ? null : tmp_11_0.someOptions == null ? null : tmp_11_0.someOptions.includes(option_r2));
    i0.ɵɵadvance();
    i0.ɵɵtextInterpolate((option_r2 < 10 ? "0" : "") + option_r2);
} }
class DesktopTimePickerComponent {
    constructor() {
        this.options = input([], ...(ngDevMode ? [{ debugName: "options" }] : []));
        this.value = input(...(ngDevMode ? [undefined, { debugName: "value" }] : []));
        this.disabled = input(...(ngDevMode ? [undefined, { debugName: "disabled" }] : []));
        this.valueChange = output();
    }
    static { this.ɵfac = function DesktopTimePickerComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || DesktopTimePickerComponent)(); }; }
    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: DesktopTimePickerComponent, selectors: [["cauca-desktop-time-picker"]], inputs: { options: [1, "options"], value: [1, "value"], disabled: [1, "disabled"] }, outputs: { valueChange: "valueChange" }, decls: 3, vars: 1, consts: [[3, "disabled"], [3, "activated", "disabled"], [3, "click", "activated", "disabled"]], template: function DesktopTimePickerComponent_Template(rf, ctx) { if (rf & 1) {
            i0.ɵɵelementStart(0, "mat-list", 0);
            i0.ɵɵrepeaterCreate(1, DesktopTimePickerComponent_For_2_Template, 2, 3, "mat-list-item", 1, i0.ɵɵrepeaterTrackByIdentity);
            i0.ɵɵelementEnd();
        } if (rf & 2) {
            let tmp_0_0;
            i0.ɵɵproperty("disabled", (tmp_0_0 = ctx.disabled()) == null ? null : tmp_0_0.all);
            i0.ɵɵadvance();
            i0.ɵɵrepeater(ctx.options());
        } }, dependencies: [MatListModule, i1$2.MatList, i1$2.MatListItem], styles: ["mat-list[_ngcontent-%COMP%]{width:50px;padding:0}mat-list[_ngcontent-%COMP%]   .mat-mdc-list-item[_ngcontent-%COMP%]:not(.mat-mdc-list-item-interactive){cursor:pointer} > div[_ngcontent-%COMP%]::-webkit-scrollbar{display:none}  .mdc-list-item__primary-text{font-family:var(--mat-datepicker-calendar-text-font);font-size:var(--mat-datepicker-calendar-text-size)}  .mdc-list-item--activated{background-color:var(--mat-datepicker-calendar-date-selected-state-background-color)}  .mdc-list-item--activated .mdc-list-item__primary-text{color:var(--mat-datepicker-calendar-date-selected-state-text-color)}"], changeDetection: 0 }); }
}
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(DesktopTimePickerComponent, [{
        type: Component,
        args: [{ selector: 'cauca-desktop-time-picker', changeDetection: ChangeDetectionStrategy.OnPush, imports: [
                    MatListModule
                ], template: "<mat-list [disabled]=\"disabled()?.all\">\r\n    @for (option of options(); track option) {\r\n    <mat-list-item [activated]=\"value() === option\" [disabled]=\"disabled()?.someOptions?.includes(option)\"\r\n        (click)=\"valueChange.emit(option)\">{{(option < 10 ? '0' : '' ) + option}}</mat-list-item>\r\n            }\r\n</mat-list>", styles: ["mat-list{width:50px;padding:0}mat-list .mat-mdc-list-item:not(.mat-mdc-list-item-interactive){cursor:pointer}>div::-webkit-scrollbar{display:none}::ng-deep .mdc-list-item__primary-text{font-family:var(--mat-datepicker-calendar-text-font);font-size:var(--mat-datepicker-calendar-text-size)}::ng-deep .mdc-list-item--activated{background-color:var(--mat-datepicker-calendar-date-selected-state-background-color)}::ng-deep .mdc-list-item--activated .mdc-list-item__primary-text{color:var(--mat-datepicker-calendar-date-selected-state-text-color)}\n"] }]
    }], null, { options: [{ type: i0.Input, args: [{ isSignal: true, alias: "options", required: false }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], valueChange: [{ type: i0.Output, args: ["valueChange"] }] }); })();
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(DesktopTimePickerComponent, { className: "DesktopTimePickerComponent", filePath: "lib/components/cauca-date-time-picker/components/desktop-time-picker/desktop-time-picker.component.ts", lineNumber: 13 }); })();

const _c0$e = (a0, a1) => ({ all: a0, someOptions: a1 });
function DialogDateTimePickerComponent_Conditional_4_Conditional_0_Template(rf, ctx) { if (rf & 1) {
    const _r1 = i0.ɵɵgetCurrentView();
    i0.ɵɵelementStart(0, "div", 8)(1, "cauca-desktop-time-picker", 13);
    i0.ɵɵlistener("valueChange", function DialogDateTimePickerComponent_Conditional_4_Conditional_0_Template_cauca_desktop_time_picker_valueChange_1_listener($event) { i0.ɵɵrestoreView(_r1); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.hourChanged($event)); });
    i0.ɵɵelementEnd()();
} if (rf & 2) {
    const ctx_r1 = i0.ɵɵnextContext(2);
    i0.ɵɵadvance();
    i0.ɵɵproperty("disabled", i0.ɵɵpureFunction2(3, _c0$e, ctx_r1.disabled.hours, ctx_r1.disabled.someHours))("options", ctx_r1.hours)("value", ctx_r1.selectedHour);
} }
function DialogDateTimePickerComponent_Conditional_4_Conditional_1_Template(rf, ctx) { if (rf & 1) {
    const _r3 = i0.ɵɵgetCurrentView();
    i0.ɵɵelementStart(0, "div", 8)(1, "cauca-mobile-time-picker", 14);
    i0.ɵɵlistener("valueChange", function DialogDateTimePickerComponent_Conditional_4_Conditional_1_Template_cauca_mobile_time_picker_valueChange_1_listener($event) { i0.ɵɵrestoreView(_r3); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.hourChanged($event)); });
    i0.ɵɵelementEnd()();
} if (rf & 2) {
    const ctx_r1 = i0.ɵɵnextContext(2);
    i0.ɵɵadvance();
    i0.ɵɵproperty("options", ctx_r1.hours)("value", ctx_r1.selectedHour);
} }
function DialogDateTimePickerComponent_Conditional_4_Conditional_2_Template(rf, ctx) { if (rf & 1) {
    i0.ɵɵelementStart(0, "div", 9);
    i0.ɵɵtext(1, ":");
    i0.ɵɵelementEnd();
} }
function DialogDateTimePickerComponent_Conditional_4_Conditional_3_Template(rf, ctx) { if (rf & 1) {
    const _r4 = i0.ɵɵgetCurrentView();
    i0.ɵɵelementStart(0, "div", 10)(1, "cauca-desktop-time-picker", 13);
    i0.ɵɵlistener("valueChange", function DialogDateTimePickerComponent_Conditional_4_Conditional_3_Template_cauca_desktop_time_picker_valueChange_1_listener($event) { i0.ɵɵrestoreView(_r4); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.minuteChanged($event)); });
    i0.ɵɵelementEnd()();
} if (rf & 2) {
    const ctx_r1 = i0.ɵɵnextContext(2);
    i0.ɵɵadvance();
    i0.ɵɵproperty("disabled", i0.ɵɵpureFunction2(3, _c0$e, ctx_r1.disabled.minutes, ctx_r1.disabled.someMinutes))("options", ctx_r1.minutes)("value", ctx_r1.selectedMinute);
} }
function DialogDateTimePickerComponent_Conditional_4_Conditional_4_Template(rf, ctx) { if (rf & 1) {
    const _r5 = i0.ɵɵgetCurrentView();
    i0.ɵɵelementStart(0, "div", 10)(1, "cauca-mobile-time-picker", 14);
    i0.ɵɵlistener("valueChange", function DialogDateTimePickerComponent_Conditional_4_Conditional_4_Template_cauca_mobile_time_picker_valueChange_1_listener($event) { i0.ɵɵrestoreView(_r5); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.minuteChanged($event)); });
    i0.ɵɵelementEnd()();
} if (rf & 2) {
    const ctx_r1 = i0.ɵɵnextContext(2);
    i0.ɵɵadvance();
    i0.ɵɵproperty("options", ctx_r1.minutes)("value", ctx_r1.selectedMinute);
} }
function DialogDateTimePickerComponent_Conditional_4_Conditional_5_Template(rf, ctx) { if (rf & 1) {
    i0.ɵɵelementStart(0, "div", 11);
    i0.ɵɵtext(1, ":");
    i0.ɵɵelementEnd();
} }
function DialogDateTimePickerComponent_Conditional_4_Conditional_6_Template(rf, ctx) { if (rf & 1) {
    const _r6 = i0.ɵɵgetCurrentView();
    i0.ɵɵelementStart(0, "div", 12)(1, "cauca-desktop-time-picker", 13);
    i0.ɵɵlistener("valueChange", function DialogDateTimePickerComponent_Conditional_4_Conditional_6_Template_cauca_desktop_time_picker_valueChange_1_listener($event) { i0.ɵɵrestoreView(_r6); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.secondChanged($event)); });
    i0.ɵɵelementEnd()();
} if (rf & 2) {
    const ctx_r1 = i0.ɵɵnextContext(2);
    i0.ɵɵadvance();
    i0.ɵɵproperty("disabled", i0.ɵɵpureFunction2(3, _c0$e, ctx_r1.disabled.seconds, ctx_r1.disabled.someSeconds))("options", ctx_r1.seconds)("value", ctx_r1.selectedSecond);
} }
function DialogDateTimePickerComponent_Conditional_4_Conditional_7_Template(rf, ctx) { if (rf & 1) {
    const _r7 = i0.ɵɵgetCurrentView();
    i0.ɵɵelementStart(0, "div", 12)(1, "cauca-mobile-time-picker", 14);
    i0.ɵɵlistener("valueChange", function DialogDateTimePickerComponent_Conditional_4_Conditional_7_Template_cauca_mobile_time_picker_valueChange_1_listener($event) { i0.ɵɵrestoreView(_r7); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.secondChanged($event)); });
    i0.ɵɵelementEnd()();
} if (rf & 2) {
    const ctx_r1 = i0.ɵɵnextContext(2);
    i0.ɵɵadvance();
    i0.ɵɵproperty("options", ctx_r1.seconds)("value", ctx_r1.selectedSecond);
} }
function DialogDateTimePickerComponent_Conditional_4_Template(rf, ctx) { if (rf & 1) {
    i0.ɵɵconditionalCreate(0, DialogDateTimePickerComponent_Conditional_4_Conditional_0_Template, 2, 6, "div", 8);
    i0.ɵɵconditionalCreate(1, DialogDateTimePickerComponent_Conditional_4_Conditional_1_Template, 2, 2, "div", 8);
    i0.ɵɵconditionalCreate(2, DialogDateTimePickerComponent_Conditional_4_Conditional_2_Template, 2, 0, "div", 9);
    i0.ɵɵconditionalCreate(3, DialogDateTimePickerComponent_Conditional_4_Conditional_3_Template, 2, 6, "div", 10);
    i0.ɵɵconditionalCreate(4, DialogDateTimePickerComponent_Conditional_4_Conditional_4_Template, 2, 2, "div", 10);
    i0.ɵɵconditionalCreate(5, DialogDateTimePickerComponent_Conditional_4_Conditional_5_Template, 2, 0, "div", 11);
    i0.ɵɵconditionalCreate(6, DialogDateTimePickerComponent_Conditional_4_Conditional_6_Template, 2, 6, "div", 12);
    i0.ɵɵconditionalCreate(7, DialogDateTimePickerComponent_Conditional_4_Conditional_7_Template, 2, 2, "div", 12);
} if (rf & 2) {
    const ctx_r1 = i0.ɵɵnextContext();
    i0.ɵɵconditional(!ctx_r1.showMobileUi ? 0 : -1);
    i0.ɵɵadvance();
    i0.ɵɵconditional(ctx_r1.showMobileUi ? 1 : -1);
    i0.ɵɵadvance();
    i0.ɵɵconditional(ctx_r1.showMobileUi ? 2 : -1);
    i0.ɵɵadvance();
    i0.ɵɵconditional(!ctx_r1.showMobileUi ? 3 : -1);
    i0.ɵɵadvance();
    i0.ɵɵconditional(ctx_r1.showMobileUi ? 4 : -1);
    i0.ɵɵadvance();
    i0.ɵɵconditional(ctx_r1.showSeconds() && ctx_r1.showMobileUi ? 5 : -1);
    i0.ɵɵadvance();
    i0.ɵɵconditional(ctx_r1.showSeconds() && !ctx_r1.showMobileUi ? 6 : -1);
    i0.ɵɵadvance();
    i0.ɵɵconditional(ctx_r1.showSeconds() && ctx_r1.showMobileUi ? 7 : -1);
} }
function DialogDateTimePickerComponent_Conditional_6_Conditional_1_Template(rf, ctx) { if (rf & 1) {
    i0.ɵɵelementStart(0, "mat-icon");
    i0.ɵɵtext(1, "clear");
    i0.ɵɵelementEnd();
} }
function DialogDateTimePickerComponent_Conditional_6_Template(rf, ctx) { if (rf & 1) {
    const _r8 = i0.ɵɵgetCurrentView();
    i0.ɵɵelementStart(0, "button", 15);
    i0.ɵɵlistener("click", function DialogDateTimePickerComponent_Conditional_6_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r8); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.clear()); });
    i0.ɵɵconditionalCreate(1, DialogDateTimePickerComponent_Conditional_6_Conditional_1_Template, 2, 0, "mat-icon");
    i0.ɵɵtext(2);
    i0.ɵɵpipe(3, "translate");
    i0.ɵɵelementEnd();
} if (rf & 2) {
    const ctx_r1 = i0.ɵɵnextContext();
    i0.ɵɵadvance();
    i0.ɵɵconditional(ctx_r1.showButtonIcons ? 1 : -1);
    i0.ɵɵadvance();
    i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind1(3, 2, "material.clear"), " ");
} }
function DialogDateTimePickerComponent_Conditional_8_Template(rf, ctx) { if (rf & 1) {
    i0.ɵɵelementStart(0, "mat-icon");
    i0.ɵɵtext(1, "cancel");
    i0.ɵɵelementEnd();
} }
function DialogDateTimePickerComponent_Conditional_12_Template(rf, ctx) { if (rf & 1) {
    i0.ɵɵelementStart(0, "mat-icon");
    i0.ɵɵtext(1, "check");
    i0.ɵɵelementEnd();
} }
class DialogDateTimePickerComponent {
    constructor() {
        this.selectedHour = 0;
        this.selectedMinute = 0;
        this.selectedSecond = 0;
        this.initialDate = null;
        this.selectedDate = null;
        this.minimumDate = new Date();
        this.maximumDate = new Date();
        this.showSeconds = signal(false, ...(ngDevMode ? [{ debugName: "showSeconds" }] : []));
        this.showClearButton = true;
        this.showButtonIcons = true;
        this.hours = [...Array(24).keys()];
        this.minutes = [...Array(60).keys()];
        this.seconds = [...Array(60).keys()];
        this.showMobileUi = false;
        this.showTime = signal(true, ...(ngDevMode ? [{ debugName: "showTime" }] : []));
        this.disabled = {
            hours: true,
            someHours: [],
            minutes: true,
            someMinutes: [],
            seconds: true,
            someSeconds: [],
        };
        this.step = {
            hours: 1,
            minutes: 1,
            seconds: 1,
        };
        this.dialogRef = inject(MatDialogRef);
        this.options = inject(MAT_DIALOG_DATA);
        const options = this.options;
        this.step = options.step || this.step;
        this.showSeconds.set(options.showSeconds);
        this.showButtonIcons = options.showButtonIcons ?? this.showButtonIcons;
        this.showClearButton = options.showClearButton ?? this.showClearButton;
        this.showTime.set(options.showTime ?? true);
        this.setListHoursMinutes();
        this.initialEachComponentValue(options);
    }
    ngOnInit() {
        this.onWindowWithChange(window.innerWidth);
    }
    onResize(event) {
        this.onWindowWithChange(event.target.innerWidth);
    }
    dateChanged(date) {
        if (date) {
            this.selectedDate = date;
            this.selectedDate.setHours(this.selectedHour);
            this.selectedDate.setMinutes(this.selectedMinute);
            this.selectedDate.setSeconds(this.selectedSecond);
            this.disabled.hours = false;
            this.disabled.someHours = this.hours.filter(hour => this.hourOfSelectedDateIsDisabled(hour));
        }
        else {
            this.selectedDate = null;
            this.disabled.hours = true;
        }
    }
    hourChanged(hour) {
        if (this.disabled.hours || this.disabled.someHours.includes(hour))
            return;
        this.selectedHour = hour;
        this.selectedDate.setHours(hour);
        this.disabled.minutes = false;
        this.disabled.someMinutes = this.minutes.filter(minute => this.minuteOfSelectedDateIsDisabled(minute));
    }
    minuteChanged(minute) {
        if (this.disabled.minutes || this.disabled.someMinutes.includes(minute))
            return;
        this.selectedMinute = minute;
        this.selectedDate.setMinutes(minute);
        this.disabled.seconds = false;
        this.disabled.someSeconds = this.seconds.filter(second => this.secondOfSelectedDateIsDisabled(second));
    }
    secondChanged(second) {
        if (this.disabled.seconds || this.disabled.someSeconds.includes(second))
            return;
        this.selectedSecond = second;
        this.selectedDate.setSeconds(second);
    }
    clear() {
        this.dialogRef.close({
            value: null
        });
    }
    cancel() {
        this.dialogRef.close({
            value: this.initialDate
        });
    }
    confirm() {
        this.dialogRef.close({
            value: this.selectedDate
        });
    }
    onWindowWithChange(width) {
        this.showMobileUi = width && width <= 555;
    }
    hourOfSelectedDateIsDisabled(hour) {
        if (this.selectedDateIsTheMinimumDate()) {
            return hour < this.minimumDate.getHours();
        }
        else if (this.selectedDateIsTheMaximumDate()) {
            return hour > this.maximumDate.getHours();
        }
        return false;
    }
    minuteOfSelectedDateIsDisabled(minute) {
        if (this.selectedDateIsTheMinimumDate() &&
            this.selectedDate.getHours() === this.minimumDate.getHours()) {
            return minute < this.minimumDate.getMinutes();
        }
        else if (this.selectedDateIsTheMaximumDate() &&
            this.selectedDate.getHours() === this.maximumDate.getHours()) {
            return minute > this.maximumDate.getMinutes();
        }
        return false;
    }
    secondOfSelectedDateIsDisabled(second) {
        if (this.selectedDateIsTheMinimumDate() &&
            this.selectedDate.getHours() === this.minimumDate.getHours() &&
            this.selectedDate.getMinutes() === this.minimumDate.getMinutes()) {
            return second < this.minimumDate.getSeconds();
        }
        else if (this.selectedDateIsTheMaximumDate() &&
            this.selectedDate.getMinutes() === this.maximumDate.getMinutes()) {
            return second > this.maximumDate.getSeconds();
        }
        return false;
    }
    initialEachComponentValue(options) {
        this.initialDate = options.selectedDate ? new Date(options.selectedDate) : null;
        this.minimumDate = options.minimumDate ? new Date(options.minimumDate) : null;
        this.maximumDate = options.maximumDate ? new Date(options.maximumDate) : null;
        this.selectedDate = options.selectedDate ? new Date(options.selectedDate) : new Date();
        this.dateChanged(options.selectedDate ? new Date(options.selectedDate) : null);
        this.hourChanged(options.selectedDate ? new Date(options.selectedDate).getHours() : 0);
        this.minuteChanged(options.selectedDate ? new Date(options.selectedDate).getMinutes() : 0);
        this.secondChanged(options.selectedDate ? new Date(options.selectedDate).getSeconds() : 0);
    }
    selectedDateIsTheMinimumDate() {
        return (this.minimumDate &&
            this.selectedDate.getFullYear() === this.minimumDate.getFullYear() &&
            this.selectedDate.getMonth() === this.minimumDate.getMonth() &&
            this.selectedDate.getDate() === this.minimumDate.getDate());
    }
    selectedDateIsTheMaximumDate() {
        return (this.maximumDate &&
            this.selectedDate.getFullYear() === this.maximumDate.getFullYear() &&
            this.selectedDate.getMonth() === this.maximumDate.getMonth() &&
            this.selectedDate.getDate() === this.maximumDate.getDate());
    }
    setListHoursMinutes() {
        this.hours = this.hours.filter(hour => hour % this.step.hours === 0);
        this.minutes = this.minutes.filter(minute => minute % this.step.minutes === 0);
        this.seconds = this.seconds.filter(seconde => seconde % this.step.seconds === 0);
    }
    static { this.ɵfac = function DialogDateTimePickerComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || DialogDateTimePickerComponent)(); }; }
    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: DialogDateTimePickerComponent, selectors: [["cauca-dialog-date-time-picker"]], hostBindings: function DialogDateTimePickerComponent_HostBindings(rf, ctx) { if (rf & 1) {
            i0.ɵɵlistener("resize", function DialogDateTimePickerComponent_resize_HostBindingHandler($event) { return ctx.onResize($event); }, i0.ɵɵresolveWindow);
        } }, features: [i0.ɵɵProvidersFeature([provideNativeDateAdapter()])], decls: 15, vars: 14, consts: [["mat-dialog-content", ""], [1, "date-time-picker", 3, "ngClass"], [1, "calendar"], [3, "selectedChange", "minDate", "maxDate", "selected"], ["mat-dialog-actions", "", "align", "end"], ["mat-stroked-button", ""], ["color", "primary", "mat-stroked-button", "", 3, "click"], ["color", "primary", "mat-raised-button", "", "cdkFocusInitial", "", 3, "click"], [1, "hours"], [1, "hour-and-minute-separator"], [1, "minutes"], [1, "minute-and-second-separator"], [1, "seconds"], [3, "valueChange", "disabled", "options", "value"], [3, "valueChange", "options", "value"], ["mat-stroked-button", "", 3, "click"]], template: function DialogDateTimePickerComponent_Template(rf, ctx) { if (rf & 1) {
            i0.ɵɵelementStart(0, "div", 0)(1, "div", 1)(2, "div", 2)(3, "mat-calendar", 3);
            i0.ɵɵlistener("selectedChange", function DialogDateTimePickerComponent_Template_mat_calendar_selectedChange_3_listener($event) { return ctx.dateChanged($event); });
            i0.ɵɵelementEnd()();
            i0.ɵɵconditionalCreate(4, DialogDateTimePickerComponent_Conditional_4_Template, 8, 8);
            i0.ɵɵelementEnd()();
            i0.ɵɵelementStart(5, "div", 4);
            i0.ɵɵconditionalCreate(6, DialogDateTimePickerComponent_Conditional_6_Template, 4, 4, "button", 5);
            i0.ɵɵelementStart(7, "button", 6);
            i0.ɵɵlistener("click", function DialogDateTimePickerComponent_Template_button_click_7_listener() { return ctx.cancel(); });
            i0.ɵɵconditionalCreate(8, DialogDateTimePickerComponent_Conditional_8_Template, 2, 0, "mat-icon");
            i0.ɵɵtext(9);
            i0.ɵɵpipe(10, "translate");
            i0.ɵɵelementEnd();
            i0.ɵɵelementStart(11, "button", 7);
            i0.ɵɵlistener("click", function DialogDateTimePickerComponent_Template_button_click_11_listener() { return ctx.confirm(); });
            i0.ɵɵconditionalCreate(12, DialogDateTimePickerComponent_Conditional_12_Template, 2, 0, "mat-icon");
            i0.ɵɵtext(13);
            i0.ɵɵpipe(14, "translate");
            i0.ɵɵelementEnd()();
        } if (rf & 2) {
            i0.ɵɵadvance();
            i0.ɵɵproperty("ngClass", ctx.showSeconds() ? "show-seconds" : "hide-seconds");
            i0.ɵɵadvance(2);
            i0.ɵɵproperty("minDate", ctx.minimumDate)("maxDate", ctx.maximumDate)("selected", ctx.selectedDate);
            i0.ɵɵadvance();
            i0.ɵɵconditional(ctx.showTime() ? 4 : -1);
            i0.ɵɵadvance(2);
            i0.ɵɵconditional(ctx.showClearButton ? 6 : -1);
            i0.ɵɵadvance(2);
            i0.ɵɵconditional(ctx.showButtonIcons ? 8 : -1);
            i0.ɵɵadvance();
            i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind1(10, 10, "material.cancel"), " ");
            i0.ɵɵadvance(3);
            i0.ɵɵconditional(ctx.showButtonIcons ? 12 : -1);
            i0.ɵɵadvance();
            i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind1(14, 12, "material.ok"), " ");
        } }, dependencies: [CommonModule, i3.NgClass, MatButtonModule, i1.MatButton, MatDatepickerModule, i2.MatCalendar, MatIconModule, i1$1.MatIcon, MatListModule,
            MobileTimePickerComponent,
            DesktopTimePickerComponent,
            TranslatePipe], styles: ["div[mat-dialog-actions][_ngcontent-%COMP%]{padding:8px;border-top:1px solid #ccc}div[mat-dialog-actions][_ngcontent-%COMP%]   button[_ngcontent-%COMP%]{margin:2px}.date-time-picker[_ngcontent-%COMP%]{display:grid;grid-template-areas:\"calendar hours minutes seconds\";height:350px;overflow:hidden;justify-content:center}.date-time-picker[_ngcontent-%COMP%] > div[_ngcontent-%COMP%]{overflow:auto;flex:1;max-width:50px;scrollbar-width:none;border-left:1px solid #ccc}.date-time-picker[_ngcontent-%COMP%] > div[_ngcontent-%COMP%]:first-child{flex:4;max-width:290px;border-left:none}.date-time-picker[_ngcontent-%COMP%] > div[_ngcontent-%COMP%]:first-child   mat-calendar[_ngcontent-%COMP%]{width:290px;height:350px}.date-time-picker[_ngcontent-%COMP%] > div[_ngcontent-%COMP%]::-webkit-scrollbar{display:none}.date-time-picker[_ngcontent-%COMP%]     .mdc-list-item__primary-text{font-family:var(--mat-datepicker-calendar-text-font);font-size:var(--mat-datepicker-calendar-text-size)}.date-time-picker[_ngcontent-%COMP%]     .mdc-list-item--activated{background-color:var(--mat-datepicker-calendar-date-selected-state-background-color)}.date-time-picker[_ngcontent-%COMP%]     .mdc-list-item--activated .mdc-list-item__primary-text{color:var(--mat-datepicker-calendar-date-selected-state-text-color)}.calendar[_ngcontent-%COMP%]{grid-area:calendar}.hours[_ngcontent-%COMP%]{grid-area:hours}.minutes[_ngcontent-%COMP%]{grid-area:minutes}.seconds[_ngcontent-%COMP%]{grid-area:seconds}.hour-and-minute-separator[_ngcontent-%COMP%]{grid-area:hour-and-minute-separator;display:flex;align-items:center;justify-content:center;font-weight:700}.minute-and-second-separator[_ngcontent-%COMP%]{grid-area:minute-and-second-separator;display:flex;align-items:center;justify-content:center;font-weight:700}@media only screen and (max-width:555px){.show-seconds[_ngcontent-%COMP%]{grid-template-areas:\"calendar calendar calendar calendar calendar calendar calendar\" \". hours hour-and-minute-separator minutes minute-and-second-separator seconds .\";grid-template-columns:auto 40px 2px 40px 2px 40px auto}.hide-seconds[_ngcontent-%COMP%]{grid-template-areas:\"calendar calendar calendar calendar calendar\" \". hours hour-and-minute-separator minutes .\";grid-template-columns:auto 40px 2px 40px auto}.date-time-picker[_ngcontent-%COMP%]{grid-template-rows:auto auto;height:450px}.date-time-picker[_ngcontent-%COMP%] > div[_ngcontent-%COMP%]{border-left:none}.date-time-picker[_ngcontent-%COMP%] > div[_ngcontent-%COMP%]:not(:first-child){height:70px}.date-time-picker[_ngcontent-%COMP%] > div[_ngcontent-%COMP%]:first-child{overflow:initial;flex:4;max-width:290px;border-left:none}}"], changeDetection: 0 }); }
}
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(DialogDateTimePickerComponent, [{
        type: Component,
        args: [{ selector: 'cauca-dialog-date-time-picker', imports: [
                    CommonModule,
                    TranslatePipe,
                    MatButtonModule,
                    MatDatepickerModule,
                    MatIconModule,
                    MatListModule,
                    MobileTimePickerComponent,
                    DesktopTimePickerComponent
                ], providers: [provideNativeDateAdapter()], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div mat-dialog-content>\r\n  <div [ngClass]=\"showSeconds() ? 'show-seconds' : 'hide-seconds'\" class=\"date-time-picker\">\r\n    <div class=\"calendar\">\r\n      <mat-calendar\r\n        [minDate]=\"minimumDate\"\r\n        [maxDate]=\"maximumDate\"\r\n        [selected]=\"selectedDate\"\r\n        (selectedChange)=\"dateChanged($event)\"\r\n      ></mat-calendar>\r\n    </div>\r\n\r\n    @if (showTime()) {\r\n      @if (!showMobileUi) {\r\n        <div class=\"hours\">\r\n          <cauca-desktop-time-picker [disabled]=\"{all: disabled.hours, someOptions: disabled.someHours}\" (valueChange)=\"hourChanged($event)\" [options]=\"hours\" [value]=\"selectedHour\"/>\r\n        </div>\r\n      }\r\n      @if (showMobileUi) {\r\n        <div class=\"hours\">\r\n          <cauca-mobile-time-picker (valueChange)=\"hourChanged($event)\" [options]=\"hours\" [value]=\"selectedHour\" />\r\n        </div>\r\n      }\r\n\r\n      @if (showMobileUi) {\r\n        <div class=\"hour-and-minute-separator\">:</div>\r\n      }\r\n\r\n      @if (!showMobileUi) {\r\n        <div class=\"minutes\">\r\n          <cauca-desktop-time-picker [disabled]=\"{all: disabled.minutes, someOptions: disabled.someMinutes}\" (valueChange)=\"minuteChanged($event)\" [options]=\"minutes\" [value]=\"selectedMinute\"/>\r\n        </div>\r\n      }\r\n      @if (showMobileUi) {\r\n        <div class=\"minutes\">\r\n          <cauca-mobile-time-picker (valueChange)=\"minuteChanged($event)\" [options]=\"minutes\" [value]=\"selectedMinute\" />\r\n        </div>\r\n      }\r\n\r\n      @if (showSeconds() && showMobileUi) {\r\n        <div class=\"minute-and-second-separator\">:</div>\r\n      }\r\n      @if (showSeconds() && !showMobileUi) {\r\n        <div class=\"seconds\">\r\n          <cauca-desktop-time-picker [disabled]=\"{all: disabled.seconds, someOptions: disabled.someSeconds}\" (valueChange)=\"secondChanged($event)\" [options]=\"seconds\" [value]=\"selectedSecond\"/>\r\n        </div>\r\n      }\r\n      @if (showSeconds() && showMobileUi) {\r\n        <div class=\"seconds\">\r\n          <cauca-mobile-time-picker (valueChange)=\"secondChanged($event)\" [options]=\"seconds\" [value]=\"selectedSecond\" />\r\n        </div>\r\n      }\r\n    }\r\n  </div>\r\n</div>\r\n\r\n<div mat-dialog-actions align=\"end\">\r\n  @if (showClearButton) {\r\n    <button mat-stroked-button (click)=\"clear()\">\r\n      @if (showButtonIcons) {\r\n        <mat-icon>clear</mat-icon>\r\n      }\r\n      {{'material.clear' | translate}}\r\n    </button>\r\n  }\r\n  <button color=\"primary\" mat-stroked-button (click)=\"cancel()\">\r\n    @if (showButtonIcons) {\r\n      <mat-icon>cancel</mat-icon>\r\n    }\r\n    {{'material.cancel' | translate}}\r\n  </button>\r\n  <button color=\"primary\" mat-raised-button cdkFocusInitial (click)=\"confirm()\">\r\n    @if (showButtonIcons) {\r\n      <mat-icon>check</mat-icon>\r\n    }\r\n    {{'material.ok' | translate}}\r\n  </button>\r\n</div>", styles: ["div[mat-dialog-actions]{padding:8px;border-top:1px solid #ccc}div[mat-dialog-actions] button{margin:2px}.date-time-picker{display:grid;grid-template-areas:\"calendar hours minutes seconds\";height:350px;overflow:hidden;justify-content:center}.date-time-picker>div{overflow:auto;flex:1;max-width:50px;scrollbar-width:none;border-left:1px solid #ccc}.date-time-picker>div:first-child{flex:4;max-width:290px;border-left:none}.date-time-picker>div:first-child mat-calendar{width:290px;height:350px}.date-time-picker>div::-webkit-scrollbar{display:none}.date-time-picker ::ng-deep .mdc-list-item__primary-text{font-family:var(--mat-datepicker-calendar-text-font);font-size:var(--mat-datepicker-calendar-text-size)}.date-time-picker ::ng-deep .mdc-list-item--activated{background-color:var(--mat-datepicker-calendar-date-selected-state-background-color)}.date-time-picker ::ng-deep .mdc-list-item--activated .mdc-list-item__primary-text{color:var(--mat-datepicker-calendar-date-selected-state-text-color)}.calendar{grid-area:calendar}.hours{grid-area:hours}.minutes{grid-area:minutes}.seconds{grid-area:seconds}.hour-and-minute-separator{grid-area:hour-and-minute-separator;display:flex;align-items:center;justify-content:center;font-weight:700}.minute-and-second-separator{grid-area:minute-and-second-separator;display:flex;align-items:center;justify-content:center;font-weight:700}@media only screen and (max-width:555px){.show-seconds{grid-template-areas:\"calendar calendar calendar calendar calendar calendar calendar\" \". hours hour-and-minute-separator minutes minute-and-second-separator seconds .\";grid-template-columns:auto 40px 2px 40px 2px 40px auto}.hide-seconds{grid-template-areas:\"calendar calendar calendar calendar calendar\" \". hours hour-and-minute-separator minutes .\";grid-template-columns:auto 40px 2px 40px auto}.date-time-picker{grid-template-rows:auto auto;height:450px}.date-time-picker>div{border-left:none}.date-time-picker>div:not(:first-child){height:70px}.date-time-picker>div:first-child{overflow:initial;flex:4;max-width:290px;border-left:none}}\n"] }]
    }], () => [], { onResize: [{
            type: HostListener,
            args: ['window:resize', ['$event']]
        }] }); })();
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(DialogDateTimePickerComponent, { className: "DialogDateTimePickerComponent", filePath: "lib/components/cauca-date-time-picker/components/dialog-date-time-picker/dialog-date-time-picker.component.ts", lineNumber: 31 }); })();

function CaucaDateTimePickerComponent_Conditional_1_Template(rf, ctx) { if (rf & 1) {
    i0.ɵɵelementStart(0, "mat-label");
    i0.ɵɵtext(1);
    i0.ɵɵpipe(2, "translate");
    i0.ɵɵelementEnd();
} if (rf & 2) {
    const ctx_r0 = i0.ɵɵnextContext();
    i0.ɵɵadvance();
    i0.ɵɵtextInterpolate2("", ctx_r0.translateLabel() ? i0.ɵɵpipeBind1(2, 2, ctx_r0.label()) : ctx_r0.label(), "", ctx_r0.isRequired() ? "*" : "");
} }
class CaucaDateTimePickerComponent {
    constructor() {
        this.value = model(null, ...(ngDevMode ? [{ debugName: "value" }] : []));
        this.subscriptSizing = input('fixed', ...(ngDevMode ? [{ debugName: "subscriptSizing" }] : []));
        this.showTime = input(true, ...(ngDevMode ? [{ debugName: "showTime" }] : []));
        this.label = input('', ...(ngDevMode ? [{ debugName: "label" }] : []));
        this.translateLabel = input(true, ...(ngDevMode ? [{ debugName: "translateLabel" }] : []));
        this.stepHours = input(1, ...(ngDevMode ? [{ debugName: "stepHours" }] : []));
        this.stepMinutes = input(1, ...(ngDevMode ? [{ debugName: "stepMinutes" }] : []));
        this.stepSecondes = input(1, ...(ngDevMode ? [{ debugName: "stepSecondes" }] : []));
        this.minimumDate = input(null, ...(ngDevMode ? [{ debugName: "minimumDate" }] : []));
        this.maximumDate = input(null, ...(ngDevMode ? [{ debugName: "maximumDate" }] : []));
        this.showSeconds = input(false, ...(ngDevMode ? [{ debugName: "showSeconds" }] : []));
        this.showFormat = input('yyyy/MM/dd, HH:mm', ...(ngDevMode ? [{ debugName: "showFormat" }] : []));
        this.showClearButton = input(true, ...(ngDevMode ? [{ debugName: "showClearButton" }] : []));
        this.showButtonIcons = input(true, ...(ngDevMode ? [{ debugName: "showButtonIcons" }] : []));
        this.selectedChange = output();
        this.stringDate = computed(() => this.value() ? this.stringifyDate(this.value()) : '', ...(ngDevMode ? [{ debugName: "stringDate" }] : []));
        this.isRequired = computed(() => Boolean(this.control?.hasValidator(Validators.required)), ...(ngDevMode ? [{ debugName: "isRequired" }] : []));
        this.injector = inject(Injector);
        this.elementRef = inject(ElementRef);
        this.dialog = inject(MatDialog);
        this.datePipe = inject(DatePipe);
        this.onChange = (value) => value;
        this.onTouched = () => { };
    }
    ngOnInit() {
        const ngControl = this.injector.get(NgControl, null, { self: true, optional: true });
        if (ngControl instanceof FormControlName) {
            const container = this.injector.get(ControlContainer).control;
            this.control = container.controls[ngControl.name];
        }
        else {
            this.control = new FormControl();
        }
    }
    showDialog() {
        const dialogRef = this.dialog.open(DialogDateTimePickerComponent, {
            position: this.getDialogPosition(),
            data: this.getDateTimePickerOptions(),
            maxWidth: '100vw',
        });
        dialogRef.afterClosed().subscribe((data) => {
            if (data) {
                this.value.set(data.value);
                this.selectedChange.emit(data.value);
                this.onChange(data.value);
            }
        });
    }
    writeValue(date) {
        this.value.set(date);
    }
    registerOnChange(fn) {
        this.onChange = fn;
    }
    registerOnTouched(fn) {
        this.onTouched = fn;
    }
    getDateTimePickerOptions() {
        return {
            selectedDate: this.value(),
            minimumDate: this.minimumDate(),
            maximumDate: this.maximumDate(),
            showSeconds: this.showSeconds(),
            showClearButton: this.showClearButton(),
            showButtonIcons: this.showButtonIcons(),
            showTime: this.showTime(),
            step: {
                hours: this.stepHours(),
                minutes: this.stepMinutes(),
                seconds: this.stepSecondes(),
            }
        };
    }
    stringifyDate(date) {
        return this.datePipe.transform(date, this.showFormat());
    }
    getDialogPosition() {
        const rect = this.elementRef.nativeElement.getBoundingClientRect();
        const top = rect.y + rect.height - 22;
        const bottom = window.innerHeight - rect.y;
        const minimumDialogHeight = 400;
        const minimumScreenSize = 800;
        if (window.innerHeight < minimumScreenSize || window.innerWidth < minimumScreenSize) {
            return null;
        }
        else if (window.innerHeight > (top + minimumDialogHeight)) {
            return {
                left: `${rect.x}px`,
                top: `${top}px`,
            };
        }
        return {
            left: `${rect.x}px`,
            bottom: `${bottom}px`,
        };
    }
    static { this.ɵfac = function CaucaDateTimePickerComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || CaucaDateTimePickerComponent)(); }; }
    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: CaucaDateTimePickerComponent, selectors: [["cauca-date-time-picker"]], inputs: { value: [1, "value"], subscriptSizing: [1, "subscriptSizing"], showTime: [1, "showTime"], label: [1, "label"], translateLabel: [1, "translateLabel"], stepHours: [1, "stepHours"], stepMinutes: [1, "stepMinutes"], stepSecondes: [1, "stepSecondes"], minimumDate: [1, "minimumDate"], maximumDate: [1, "maximumDate"], showSeconds: [1, "showSeconds"], showFormat: [1, "showFormat"], showClearButton: [1, "showClearButton"], showButtonIcons: [1, "showButtonIcons"] }, outputs: { value: "valueChange", selectedChange: "selectedChange" }, features: [i0.ɵɵProvidersFeature([
                DatePipe,
                {
                    provide: NG_VALUE_ACCESSOR,
                    multi: true,
                    useExisting: CaucaDateTimePickerComponent,
                }
            ])], decls: 6, vars: 3, consts: [[3, "subscriptSizing"], ["matInput", "", "readonly", "readonly", 3, "focusout", "value"], ["matSuffix", "", "mat-icon-button", "", 3, "click"]], template: function CaucaDateTimePickerComponent_Template(rf, ctx) { if (rf & 1) {
            i0.ɵɵelementStart(0, "mat-form-field", 0);
            i0.ɵɵconditionalCreate(1, CaucaDateTimePickerComponent_Conditional_1_Template, 3, 4, "mat-label");
            i0.ɵɵelementStart(2, "input", 1);
            i0.ɵɵlistener("focusout", function CaucaDateTimePickerComponent_Template_input_focusout_2_listener() { return ctx.onTouched(); });
            i0.ɵɵelementEnd();
            i0.ɵɵelementStart(3, "button", 2);
            i0.ɵɵlistener("click", function CaucaDateTimePickerComponent_Template_button_click_3_listener() { return ctx.showDialog(); });
            i0.ɵɵelementStart(4, "mat-icon");
            i0.ɵɵtext(5, "calendar_month");
            i0.ɵɵelementEnd()()();
        } if (rf & 2) {
            i0.ɵɵproperty("subscriptSizing", ctx.subscriptSizing());
            i0.ɵɵadvance();
            i0.ɵɵconditional(ctx.label() ? 1 : -1);
            i0.ɵɵadvance();
            i0.ɵɵproperty("value", ctx.stringDate());
        } }, dependencies: [MatButtonModule, i1.MatIconButton, MatIconModule, i1$1.MatIcon, MatInputModule, i3$1.MatInput, i1$3.MatFormField, i1$3.MatLabel, i1$3.MatSuffix, MatFormFieldModule,
            TranslatePipe], styles: ["[_nghost-%COMP%]{display:block}mat-form-field[_ngcontent-%COMP%]{width:100%}"], changeDetection: 0 }); }
}
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(CaucaDateTimePickerComponent, [{
        type: Component,
        args: [{ selector: 'cauca-date-time-picker', changeDetection: ChangeDetectionStrategy.OnPush, imports: [
                    TranslatePipe,
                    MatButtonModule,
                    MatIconModule,
                    MatInputModule,
                    MatFormFieldModule
                ], providers: [
                    DatePipe,
                    {
                        provide: NG_VALUE_ACCESSOR,
                        multi: true,
                        useExisting: CaucaDateT