@cauca-911/material 21.0.3 → 21.0.5

package/fesm2022/cauca-911-material.mjs

@@ -1,5 +1,5 @@
 import * as i0 from '@angular/core';
-import { Injectable, ChangeDetectionStrategy, Component, input, output, signal, inject, HostListener, computed, Injector, ElementRef, Directive, forwardRef, model, TemplateRef, Input, Optional, Self, ContentChild, ViewChild, resource, effect, NgModule, EventEmitter, Output } 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, NgModule, EventEmitter, Output } from '@angular/core';
 import * as i1 from '@ngx-translate/core';
 import { TranslateModule, TranslatePipe, TranslateService } from '@ngx-translate/core';
 import * as i1$5 from '@angular/material/dialog';
@@ -538,6 +538,7 @@ function CaucaDateTimePickerComponent_Conditional_1_Template(rf, ctx) { if (rf &
 } }
 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" }] : []));
@@ -552,7 +553,7 @@ class CaucaDateTimePickerComponent {
         this.showClearButton = input(true, ...(ngDevMode ? [{ debugName: "showClearButton" }] : []));
         this.showButtonIcons = input(true, ...(ngDevMode ? [{ debugName: "showButtonIcons" }] : []));
         this.selectedChange = output();
-        this.stringDate = signal('', ...(ngDevMode ? [{ debugName: "stringDate" }] : []));
+        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);
@@ -561,12 +562,6 @@ class CaucaDateTimePickerComponent {
         this.onChange = (value) => value;
         this.onTouched = () => { };
     }
-    set value(value) {
-        if (value) {
-            this.stringDate.set(this.stringifyDate(value));
-            this.selectedDate = value;
-        }
-    }
     ngOnInit() {
         const ngControl = this.injector.get(NgControl, null, { self: true, optional: true });
         if (ngControl instanceof FormControlName) {
@@ -585,15 +580,14 @@ class CaucaDateTimePickerComponent {
         });
         dialogRef.afterClosed().subscribe((data) => {
             if (data) {
-                this.stringDate.set(this.stringifyDate(data.value));
-                this.selectedDate = data.value;
+                this.value.set(data.value);
                 this.selectedChange.emit(data.value);
                 this.onChange(data.value);
             }
         });
     }
     writeValue(date) {
-        this.value = date;
+        this.value.set(date);
     }
     registerOnChange(fn) {
         this.onChange = fn;
@@ -603,7 +597,7 @@ class CaucaDateTimePickerComponent {
     }
     getDateTimePickerOptions() {
         return {
-            selectedDate: this.selectedDate,
+            selectedDate: this.value(),
             minimumDate: this.minimumDate(),
             maximumDate: this.maximumDate(),
             showSeconds: this.showSeconds(),
@@ -641,7 +635,7 @@ class CaucaDateTimePickerComponent {
         };
     }
     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: { 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: { selectedChange: "selectedChange" }, features: [i0.ɵɵProvidersFeature([
+    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,
@@ -684,7 +678,7 @@ class CaucaDateTimePickerComponent {
                         useExisting: CaucaDateTimePickerComponent,
                     }
                 ], template: "<mat-form-field [subscriptSizing]=\"subscriptSizing()\">\n    @if (label()) {\n        <mat-label>{{ translateLabel() ? (label() | translate) : label() }}{{isRequired() ? '*' : ''}}</mat-label>\n    }\n    <input (focusout)=\"onTouched()\" matInput [value]=\"stringDate()\" readonly=\"readonly\">\n    <button matSuffix mat-icon-button (click)=\"showDialog()\">\n        <mat-icon>calendar_month</mat-icon>\n    </button>\n</mat-form-field>", styles: [":host{display:block}mat-form-field{width:100%}\n"] }]
-    }], null, { subscriptSizing: [{ type: i0.Input, args: [{ isSignal: true, alias: "subscriptSizing", required: false }] }], showTime: [{ type: i0.Input, args: [{ isSignal: true, alias: "showTime", required: false }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], translateLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "translateLabel", required: false }] }], stepHours: [{ type: i0.Input, args: [{ isSignal: true, alias: "stepHours", required: false }] }], stepMinutes: [{ type: i0.Input, args: [{ isSignal: true, alias: "stepMinutes", required: false }] }], stepSecondes: [{ type: i0.Input, args: [{ isSignal: true, alias: "stepSecondes", required: false }] }], minimumDate: [{ type: i0.Input, args: [{ isSignal: true, alias: "minimumDate", required: false }] }], maximumDate: [{ type: i0.Input, args: [{ isSignal: true, alias: "maximumDate", required: false }] }], showSeconds: [{ type: i0.Input, args: [{ isSignal: true, alias: "showSeconds", required: false }] }], showFormat: [{ type: i0.Input, args: [{ isSignal: true, alias: "showFormat", required: false }] }], showClearButton: [{ type: i0.Input, args: [{ isSignal: true, alias: "showClearButton", required: false }] }], showButtonIcons: [{ type: i0.Input, args: [{ isSignal: true, alias: "showButtonIcons", required: false }] }], selectedChange: [{ type: i0.Output, args: ["selectedChange"] }] }); })();
+    }], null, { value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }, { type: i0.Output, args: ["valueChange"] }], subscriptSizing: [{ type: i0.Input, args: [{ isSignal: true, alias: "subscriptSizing", required: false }] }], showTime: [{ type: i0.Input, args: [{ isSignal: true, alias: "showTime", required: false }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], translateLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "translateLabel", required: false }] }], stepHours: [{ type: i0.Input, args: [{ isSignal: true, alias: "stepHours", required: false }] }], stepMinutes: [{ type: i0.Input, args: [{ isSignal: true, alias: "stepMinutes", required: false }] }], stepSecondes: [{ type: i0.Input, args: [{ isSignal: true, alias: "stepSecondes", required: false }] }], minimumDate: [{ type: i0.Input, args: [{ isSignal: true, alias: "minimumDate", required: false }] }], maximumDate: [{ type: i0.Input, args: [{ isSignal: true, alias: "maximumDate", required: false }] }], showSeconds: [{ type: i0.Input, args: [{ isSignal: true, alias: "showSeconds", required: false }] }], showFormat: [{ type: i0.Input, args: [{ isSignal: true, alias: "showFormat", required: false }] }], showClearButton: [{ type: i0.Input, args: [{ isSignal: true, alias: "showClearButton", required: false }] }], showButtonIcons: [{ type: i0.Input, args: [{ isSignal: true, alias: "showButtonIcons", required: false }] }], selectedChange: [{ type: i0.Output, args: ["selectedChange"] }] }); })();
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(CaucaDateTimePickerComponent, { className: "CaucaDateTimePickerComponent", filePath: "lib/components/cauca-date-time-picker/cauca-date-time-picker.component.ts", lineNumber: 34 }); })();
 
 class BaseButton {