@fuentis/phoenix-ui 0.0.9-alpha.578 → 0.0.9-alpha.579

package/fesm2022/fuentis-phoenix-ui.mjs

@@ -5744,207 +5744,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
                     ] }]
         }], ctorParameters: () => [] });
 
-class MetaStartDueDateComponent {
-    control;
-    parentForm;
-    ctrl;
-    dr = inject(DestroyRef);
-    startDate = null;
-    endDate = null;
-    onChanged = () => { };
-    onTouched = () => { };
-    ngOnInit() {
-        this.ctrl = this.parentForm.get(this.control.configuration.key);
-        if (this.control.mandatory)
-            this.ctrl?.setValidators(this.ctrl?.validator);
-        this.parentForm
-            .get(this.control.configuration.key)
-            ?.valueChanges.pipe(takeUntilDestroyed(this.dr))
-            .subscribe(() => this.validateDates());
-        this.validateDates();
-    }
-    normalizeDateOnly(v) {
-        if (!v)
-            return null;
-        const d = v instanceof Date ? v : new Date(v);
-        if (isNaN(d.getTime()))
-            return null;
-        return new Date(d.getFullYear(), d.getMonth(), d.getDate(), 12, 0, 0, 0);
-    }
-    writeValue(obj) {
-        if (obj) {
-            this.startDate = this.normalizeDateOnly(obj.startDate);
-            this.endDate = this.normalizeDateOnly(obj.endDate);
-        }
-        else {
-            this.startDate = null;
-            this.endDate = null;
-        }
-        this.validateDates();
-    }
-    // Handle start date selection
-    onStartDateSelect(event) {
-        this.startDate = this.normalizeDateOnly(event);
-        this.onChanged({ startDate: this.startDate, endDate: this.endDate });
-        this.validateDates();
-    }
-    // Handle end date selection
-    onEndDateSelect(event) {
-        this.endDate = this.normalizeDateOnly(event);
-        this.onChanged({ startDate: this.startDate, endDate: this.endDate });
-        this.validateDates();
-    }
-    // Handle start date clear value
-    onStartDateClear() {
-        this.startDate = null;
-        this.onChanged({ startDate: this.startDate, endDate: this.endDate });
-        this.validateDates();
-    }
-    // Handle end date clear value
-    onEndDateClear() {
-        this.endDate = null;
-        this.onChanged({ startDate: this.startDate, endDate: this.endDate });
-        this.validateDates();
-    }
-    validateDates() {
-        const c = this.parentForm.get(this.control.configuration.key);
-        if (!c)
-            return;
-        // clear previous errors
-        c.setErrors(null);
-        // Both dates are mandatory
-        if (this.control.mandatory && (!this.startDate || !this.endDate)) {
-            c.setErrors({ required: true });
-            return;
-        }
-        if (this.startDate && this.endDate) {
-            const s = new Date(this.startDate.getFullYear(), this.startDate.getMonth(), this.startDate.getDate(), 12, 0, 0, 0).getTime();
-            const e = new Date(this.endDate.getFullYear(), this.endDate.getMonth(), this.endDate.getDate(), 12, 0, 0, 0).getTime();
-            if (s > e) {
-                c.setErrors({ dueDate: true });
-                return;
-            }
-        }
-    }
-    registerOnChange(fn) {
-        this.onChanged = fn;
-    }
-    registerOnTouched(fn) {
-        this.onTouched = fn;
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: MetaStartDueDateComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.16", type: MetaStartDueDateComponent, isStandalone: true, selector: "phoenix-meta-start-due-date", inputs: { control: "control", parentForm: "parentForm" }, providers: [
-            {
-                provide: NG_VALUE_ACCESSOR,
-                useExisting: forwardRef(() => MetaStartDueDateComponent),
-                multi: true,
-            },
-        ], ngImport: i0, template: `
-    <div [hidden]="control?.hidden">
-      <phoenix-meta-label [control]="control"></phoenix-meta-label>
-      <div class="flex">
-        <div class="flex-grow-1">
-          <p-datepicker
-            [attr.data-cy]="'start-date-' + control?.id"
-            (onSelect)="onStartDateSelect($event)"
-            (onClearClick)="onStartDateClear()"
-            [style]="{ width: '100%' }"
-            [(ngModel)]="startDate"
-            [readonlyInput]="true"
-            [showButtonBar]="true"
-            [showIcon]="true"
-            [placeholder]="'LABELS.PLANNED_START' | translate"
-            appendTo="body"
-          ></p-datepicker>
-        </div>
-        <div class=" flex align-items-center p-2 ">
-          <i
-            class="pi pi-arrow-right text-sm"
-            style="color: 'var(--surface-600)'"
-          ></i>
-        </div>
-        <div class="flex-grow-1">
-          <p-datepicker
-            [attr.data-cy]="'due-date-' + control?.id"
-            (onSelect)="onEndDateSelect($event)"
-            (onClearClick)="onEndDateClear()"
-            [style]="{ width: '100%' }"
-            [(ngModel)]="endDate"
-            [readonlyInput]="true"
-            [showButtonBar]="true"
-            [showIcon]="true"
-            [placeholder]="'LABELS.PLANNED_END' | translate"
-            appendTo="body"
-          ></p-datepicker>
-        </div>
-      </div>
-      <phoenix-inline-field-error [ctrl]="ctrl"></phoenix-inline-field-error>
-    </div>
-  `, isInline: true, styles: [""], dependencies: [{ kind: "ngmodule", type: DatePickerModule }, { kind: "component", type: i2$6.DatePicker, selector: "p-datePicker, p-datepicker, p-date-picker", inputs: ["iconDisplay", "styleClass", "inputStyle", "inputId", "inputStyleClass", "placeholder", "ariaLabelledBy", "ariaLabel", "iconAriaLabel", "dateFormat", "multipleSeparator", "rangeSeparator", "inline", "showOtherMonths", "selectOtherMonths", "showIcon", "icon", "readonlyInput", "shortYearCutoff", "hourFormat", "timeOnly", "stepHour", "stepMinute", "stepSecond", "showSeconds", "showOnFocus", "showWeek", "startWeekFromFirstDayOfYear", "showClear", "dataType", "selectionMode", "maxDateCount", "showButtonBar", "todayButtonStyleClass", "clearButtonStyleClass", "autofocus", "autoZIndex", "baseZIndex", "panelStyleClass", "panelStyle", "keepInvalid", "hideOnDateTimeSelect", "touchUI", "timeSeparator", "focusTrap", "showTransitionOptions", "hideTransitionOptions", "tabindex", "minDate", "maxDate", "disabledDates", "disabledDays", "showTime", "responsiveOptions", "numberOfMonths", "firstDayOfWeek", "view", "defaultDate", "appendTo"], outputs: ["onFocus", "onBlur", "onClose", "onSelect", "onClear", "onInput", "onTodayClick", "onClearClick", "onMonthChange", "onYearChange", "onClickOutside", "onShow"] }, { kind: "component", type: InlineFieldError, selector: "phoenix-inline-field-error", inputs: ["ctrl"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i2$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: MetaLabelComponent, selector: "phoenix-meta-label", inputs: ["control"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i3$1.TranslatePipe, name: "translate" }] });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: MetaStartDueDateComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'phoenix-meta-start-due-date', standalone: true, imports: [
-                        DatePickerModule,
-                        InlineFieldError,
-                        ReactiveFormsModule,
-                        FormsModule,
-                        MetaLabelComponent,
-                        TranslateModule,
-                    ], template: `
-    <div [hidden]="control?.hidden">
-      <phoenix-meta-label [control]="control"></phoenix-meta-label>
-      <div class="flex">
-        <div class="flex-grow-1">
-          <p-datepicker
-            [attr.data-cy]="'start-date-' + control?.id"
-            (onSelect)="onStartDateSelect($event)"
-            (onClearClick)="onStartDateClear()"
-            [style]="{ width: '100%' }"
-            [(ngModel)]="startDate"
-            [readonlyInput]="true"
-            [showButtonBar]="true"
-            [showIcon]="true"
-            [placeholder]="'LABELS.PLANNED_START' | translate"
-            appendTo="body"
-          ></p-datepicker>
-        </div>
-        <div class=" flex align-items-center p-2 ">
-          <i
-            class="pi pi-arrow-right text-sm"
-            style="color: 'var(--surface-600)'"
-          ></i>
-        </div>
-        <div class="flex-grow-1">
-          <p-datepicker
-            [attr.data-cy]="'due-date-' + control?.id"
-            (onSelect)="onEndDateSelect($event)"
-            (onClearClick)="onEndDateClear()"
-            [style]="{ width: '100%' }"
-            [(ngModel)]="endDate"
-            [readonlyInput]="true"
-            [showButtonBar]="true"
-            [showIcon]="true"
-            [placeholder]="'LABELS.PLANNED_END' | translate"
-            appendTo="body"
-          ></p-datepicker>
-        </div>
-      </div>
-      <phoenix-inline-field-error [ctrl]="ctrl"></phoenix-inline-field-error>
-    </div>
-  `, providers: [
-                        {
-                            provide: NG_VALUE_ACCESSOR,
-                            useExisting: forwardRef(() => MetaStartDueDateComponent),
-                            multi: true,
-                        },
-                    ] }]
-        }], propDecorators: { control: [{
-                type: Input
-            }], parentForm: [{
-                type: Input
-            }] } });
-
 class MetaSwitchComponent extends BaseMetaField {
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: MetaSwitchComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
     static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.16", type: MetaSwitchComponent, isStandalone: true, selector: "phoenix-meta-switch", providers: [
@@ -7424,6 +7223,208 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
                 args: ['fileInput']
             }] } });
 
+class MetaStartDueDateComponent {
+    control;
+    parentForm;
+    ctrl;
+    dr = inject(DestroyRef);
+    startDate;
+    endDate;
+    onChanged;
+    onTouched;
+    constructor() { }
+    ngOnInit() {
+        this.ctrl = this.parentForm.get(this.control.configuration.key);
+        this.ctrl = this.parentForm.get(this.control.configuration.key);
+        if (this.control.mandatory)
+            this.ctrl.setValidators(this.ctrl.validator);
+        this.parentForm
+            .get(this.control.configuration.key)
+            ?.valueChanges.pipe(takeUntilDestroyed(this.dr))
+            .subscribe((r) => {
+            this.validateDates();
+        });
+        this.validateDates();
+    }
+    writeValue(obj) {
+        if (obj) {
+            this.startDate = obj.startDate;
+            this.endDate = obj.endDate;
+        }
+        else {
+            this.startDate = null;
+            this.endDate = null;
+        }
+    }
+    // Handle start date selection
+    onStartDateSelect(event) {
+        this.startDate = event;
+        this.onChanged({ startDate: this.startDate, endDate: this.endDate });
+        this.validateDates();
+    }
+    // Handle end date selection
+    onEndDateSelect(event) {
+        this.endDate = event;
+        this.onChanged({ startDate: this.startDate, endDate: this.endDate });
+        this.validateDates();
+    }
+    // Handle start date clear value
+    onStartDateClear() {
+        this.startDate = null;
+        this.onChanged({ startDate: this.startDate, endDate: this.endDate });
+        this.validateDates();
+    }
+    // Handle end date clear value
+    onEndDateClear() {
+        this.endDate = null;
+        this.onChanged({ startDate: this.startDate, endDate: this.endDate });
+        this.validateDates();
+    }
+    validateDates() {
+        //Both dates are mandatory
+        if (this.control.mandatory && (!this.startDate || !this.endDate)) {
+            this.parentForm
+                .get(this.control.configuration.key)
+                ?.setErrors({ required: true });
+        }
+        else {
+            this.parentForm.get(this.control.configuration.key)?.setErrors(null);
+        }
+        // End date must be after start date
+        if (this.startDate &&
+            this.endDate &&
+            this.startDate.setHours(0, 0, 0, 0) > this.endDate.setHours(0, 0, 0, 0)) {
+            this.parentForm
+                .get(this.control.configuration.key)
+                ?.setErrors({ dueDate: true });
+        }
+        //TBD: Scenario if only one date is mandatory
+    }
+    registerOnChange(fn) {
+        this.onChanged = fn;
+    }
+    registerOnTouched(fn) {
+        this.onTouched = fn;
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: MetaStartDueDateComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.16", type: MetaStartDueDateComponent, isStandalone: true, selector: "phoenix-meta-start-due-date", inputs: { control: "control", parentForm: "parentForm" }, providers: [
+            {
+                provide: NG_VALUE_ACCESSOR,
+                useExisting: forwardRef(() => MetaStartDueDateComponent),
+                multi: true,
+            },
+        ], ngImport: i0, template: `
+    <div [hidden]="control?.hidden">
+  <phoenix-meta-label [control]="control"></phoenix-meta-label>
+
+  <div class="flex align-items-center gap-2">
+    <div class="flex-1">
+      <p-datepicker
+        [attr.data-cy]="'start-date-' + control?.id"
+        (onSelect)="onStartDateSelect($event)"
+        (onClearClick)="onStartDateClear()"
+        [style]="{ width: '100%' }"
+        [(ngModel)]="startDate"
+        [ngModelOptions]="{ standalone: true }"
+        [readonlyInput]="true"
+        [showButtonBar]="true"
+        [showIcon]="true"
+        [placeholder]="'LABELS.PLANNED_START' | translate"
+        appendTo="body"
+      ></p-datepicker>
+    </div>
+
+    <div class="flex align-items-center justify-content-center px-2" style="flex: 0 0 24px;">
+      <i class="pi pi-arrow-right text-sm" style="color: var(--surface-600)"></i>
+    </div>
+
+    <div class="flex-1">
+      <p-datepicker
+        [attr.data-cy]="'due-date-' + control?.id"
+        (onSelect)="onEndDateSelect($event)"
+        (onClearClick)="onEndDateClear()"
+        [style]="{ width: '100%' }"
+        [(ngModel)]="endDate"
+        [ngModelOptions]="{ standalone: true }"
+        [readonlyInput]="true"
+        [showButtonBar]="true"
+        [showIcon]="true"
+        [placeholder]="'LABELS.PLANNED_END' | translate"
+        appendTo="body"
+      ></p-datepicker>
+    </div>
+  </div>
+
+  <phoenix-inline-field-error [ctrl]="ctrl"></phoenix-inline-field-error>
+</div>
+  `, isInline: true, styles: [""], dependencies: [{ kind: "ngmodule", type: DatePickerModule }, { kind: "component", type: i2$6.DatePicker, selector: "p-datePicker, p-datepicker, p-date-picker", inputs: ["iconDisplay", "styleClass", "inputStyle", "inputId", "inputStyleClass", "placeholder", "ariaLabelledBy", "ariaLabel", "iconAriaLabel", "dateFormat", "multipleSeparator", "rangeSeparator", "inline", "showOtherMonths", "selectOtherMonths", "showIcon", "icon", "readonlyInput", "shortYearCutoff", "hourFormat", "timeOnly", "stepHour", "stepMinute", "stepSecond", "showSeconds", "showOnFocus", "showWeek", "startWeekFromFirstDayOfYear", "showClear", "dataType", "selectionMode", "maxDateCount", "showButtonBar", "todayButtonStyleClass", "clearButtonStyleClass", "autofocus", "autoZIndex", "baseZIndex", "panelStyleClass", "panelStyle", "keepInvalid", "hideOnDateTimeSelect", "touchUI", "timeSeparator", "focusTrap", "showTransitionOptions", "hideTransitionOptions", "tabindex", "minDate", "maxDate", "disabledDates", "disabledDays", "showTime", "responsiveOptions", "numberOfMonths", "firstDayOfWeek", "view", "defaultDate", "appendTo"], outputs: ["onFocus", "onBlur", "onClose", "onSelect", "onClear", "onInput", "onTodayClick", "onClearClick", "onMonthChange", "onYearChange", "onClickOutside", "onShow"] }, { kind: "component", type: InlineFieldError, selector: "phoenix-inline-field-error", inputs: ["ctrl"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i2$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: MetaLabelComponent, selector: "phoenix-meta-label", inputs: ["control"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i3$1.TranslatePipe, name: "translate" }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: MetaStartDueDateComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'phoenix-meta-start-due-date', standalone: true, imports: [
+                        DatePickerModule,
+                        InlineFieldError,
+                        ReactiveFormsModule,
+                        FormsModule,
+                        MetaLabelComponent,
+                        TranslateModule,
+                    ], template: `
+    <div [hidden]="control?.hidden">
+  <phoenix-meta-label [control]="control"></phoenix-meta-label>
+
+  <div class="flex align-items-center gap-2">
+    <div class="flex-1">
+      <p-datepicker
+        [attr.data-cy]="'start-date-' + control?.id"
+        (onSelect)="onStartDateSelect($event)"
+        (onClearClick)="onStartDateClear()"
+        [style]="{ width: '100%' }"
+        [(ngModel)]="startDate"
+        [ngModelOptions]="{ standalone: true }"
+        [readonlyInput]="true"
+        [showButtonBar]="true"
+        [showIcon]="true"
+        [placeholder]="'LABELS.PLANNED_START' | translate"
+        appendTo="body"
+      ></p-datepicker>
+    </div>
+
+    <div class="flex align-items-center justify-content-center px-2" style="flex: 0 0 24px;">
+      <i class="pi pi-arrow-right text-sm" style="color: var(--surface-600)"></i>
+    </div>
+
+    <div class="flex-1">
+      <p-datepicker
+        [attr.data-cy]="'due-date-' + control?.id"
+        (onSelect)="onEndDateSelect($event)"
+        (onClearClick)="onEndDateClear()"
+        [style]="{ width: '100%' }"
+        [(ngModel)]="endDate"
+        [ngModelOptions]="{ standalone: true }"
+        [readonlyInput]="true"
+        [showButtonBar]="true"
+        [showIcon]="true"
+        [placeholder]="'LABELS.PLANNED_END' | translate"
+        appendTo="body"
+      ></p-datepicker>
+    </div>
+  </div>
+
+  <phoenix-inline-field-error [ctrl]="ctrl"></phoenix-inline-field-error>
+</div>
+  `, providers: [
+                        {
+                            provide: NG_VALUE_ACCESSOR,
+                            useExisting: forwardRef(() => MetaStartDueDateComponent),
+                            multi: true,
+                        },
+                    ] }]
+        }], ctorParameters: () => [], propDecorators: { control: [{
+                type: Input
+            }], parentForm: [{
+                type: Input
+            }] } });
+
 class MetaFormComponent extends MetaFormAbstract {
     constructor(fb, metaService, translateService, http
     // env: EnvService
@@ -8753,8 +8754,8 @@ class MetaStartDueDateV2Component {
      * NOTE: "YYYY-MM-DD" strings are parsed as local dates to avoid timezone day-shifts.
      */
     writeValue(v) {
-        this.startDate = this.normalizeDateOnly(this.parseToDate(v?.startDate ?? null));
-        this.endDate = this.normalizeDateOnly(this.parseToDate(v?.endDate ?? null));
+        this.startDate = this.parseToDate(v?.startDate ?? null);
+        this.endDate = this.parseToDate(v?.endDate ?? null);
         // OnPush: ensure UI reflects external value writes (patchValue/setValue)
         this.cdr.markForCheck();
     }
@@ -8794,7 +8795,7 @@ class MetaStartDueDateV2Component {
     onStartChange(d) {
         if (this.disabled)
             return;
-        this.startDate = this.normalizeDateOnly(d ?? null);
+        this.startDate = d ?? null;
         this.emitChange();
     }
     /**
@@ -8804,7 +8805,7 @@ class MetaStartDueDateV2Component {
     onEndChange(d) {
         if (this.disabled)
             return;
-        this.endDate = this.normalizeDateOnly(d ?? null);
+        this.endDate = d ?? null;
         this.emitChange();
     }
     /**
@@ -8843,20 +8844,13 @@ class MetaStartDueDateV2Component {
             const y = Number(m[1]);
             const mo = Number(m[2]) - 1;
             const d = Number(m[3]);
-            const local = new Date(y, mo, d, 12, 0, 0, 0);
+            const local = new Date(y, mo, d);
             return isNaN(local.getTime()) ? null : local;
         }
         // ISO / other -> fallback
         const dt = new Date(s);
         return isNaN(dt.getTime()) ? null : dt;
     }
-    normalizeDateOnly(d) {
-        if (!d)
-            return null;
-        if (isNaN(d.getTime()))
-            return null;
-        return new Date(d.getFullYear(), d.getMonth(), d.getDate(), 12, 0, 0, 0);
-    }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: MetaStartDueDateV2Component, deps: [], target: i0.ɵɵFactoryTarget.Component });
     static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.16", type: MetaStartDueDateV2Component, isStandalone: true, selector: "phoenix-meta-start-due-date-v2", inputs: { dataCy: "dataCy", disable: "disable" }, providers: [
             {