@dereekb/dbx-form 9.25.6 → 9.25.8

package/fesm2020/dereekb-dbx-form.mjs

@@ -44,7 +44,7 @@ import * as i6 from '@angular/material/chips';
 import { MatChipsModule } from '@angular/material/chips';
 import { MatListModule } from '@angular/material/list';
 import { ENTER, COMMA } from '@angular/cdk/keycodes';
-import { skipUntilTimeElapsedAfterLastEmission, toJsDate, parseISO8601DayStringToDate, formatToISO8601DateString, formatToISO8601DayString, isSameDateHoursAndMinutes, safeToJsDate, guessCurrentTimezone, dateTimezoneUtcNormal, toLocalReadableTimeString, getTimezoneAbbreviation, isSameDateDay, utcDayForDate, readableTimeStringToDate, findMinDate, dateFromLogicalDate, findMaxDate, dateTimeMinuteDecisionFunction, DateTimeMinuteInstance, limitDateTimeInstance, isSameDateDayRange, dateRange, clampDateRangeToDateRange, isDateInDateRange, isSameDateRange, allTimezoneInfos, timezoneInfoForSystem, searchTimezoneInfos } from '@dereekb/date';
+import { skipUntilTimeElapsedAfterLastEmission, toJsDate, parseISO8601DayStringToDate, formatToISO8601DateString, formatToISO8601DayString, isSameDateHoursAndMinutes, safeToJsDate, guessCurrentTimezone, dateTimezoneUtcNormal, toJsDayDate, isSameDateDay, toLocalReadableTimeString, getTimezoneAbbreviation, utcDayForDate, readableTimeStringToDate, findMinDate, dateFromLogicalDate, findMaxDate, dateTimeMinuteDecisionFunction, DateTimeMinuteInstance, isSameDate, limitDateTimeInstance, isSameDateDayRange, dateRange, clampDateRangeToDateRange, isDateInDateRange, isSameDateRange, allTimezoneInfos, timezoneInfoForSystem, searchTimezoneInfos } from '@dereekb/date';
 import { FieldType as FieldType$2, FormlyMatFormFieldModule } from '@ngx-formly/material/form-field';
 import * as i3$3 from '@angular/material/select';
 import { MatSelectModule } from '@angular/material/select';
@@ -3827,6 +3827,7 @@ class DbxDateTimeFieldComponent extends FieldType$1 {
         this._config = new BehaviorSubject(undefined);
         this._syncConfigObs = new BehaviorSubject(undefined);
         this._defaultTimezone = new BehaviorSubject(undefined);
+        this._timeDate = new BehaviorSubject(undefined);
         this._presets = new BehaviorSubject(of([]));
         this._fullDayControlObs = new BehaviorSubject(undefined);
         this.fullDayControl$ = this._fullDayControlObs.pipe(filterMaybe());
@@ -3838,6 +3839,7 @@ class DbxDateTimeFieldComponent extends FieldType$1 {
             return defaultTimezone ?? guessCurrentTimezone();
         }), distinctUntilChanged(), shareReplay(1));
         this.timezoneInstance$ = this.timezone$.pipe(map((timezone) => (timezone ? dateTimezoneUtcNormal({ timezone }) : undefined)), shareReplay(1));
+        this.timeDate$ = this._timeDate.pipe(switchMapMaybeDefault(), map((x) => (x ? toJsDayDate(x) : undefined)), distinctUntilChanged(isSameDateDay), shareReplay(1));
         this.valueInSystemTimezone$ = this.formControl$.pipe(map((control) => control.valueChanges.pipe(startWith(control.value), shareReplay(1))), combineLatestWith(this.timezoneInstance$), switchMap(([x, timezoneInstance]) => {
             return x.pipe(map(dbxDateTimeInputValueParseFactory(this.valueMode, timezoneInstance)));
         }), throttleTime(20, undefined, { leading: false, trailing: true }), // throttle incoming values and timezone changes
@@ -3857,7 +3859,7 @@ class DbxDateTimeFieldComponent extends FieldType$1 {
         this.showTimeInput$ = this.fullDay$.pipe(map((x) => !x && this.timeMode !== DbxDateTimeFieldTimeMode.NONE));
         this.showAddTime$ = this.showTimeInput$.pipe(map((x) => !x && this.timeMode === DbxDateTimeFieldTimeMode.OPTIONAL), shareReplay(1));
         this.date$ = this.dateInputCtrl.valueChanges.pipe(startWith(this.dateInputCtrl.value), filterMaybe(), shareReplay(1));
-        this.timezoneAbbreviation$ = combineLatest([this.date$, this.timezone$]).pipe(map(([date, timezone]) => getTimezoneAbbreviation(timezone, date)), distinctUntilChanged(), shareReplay(1));
+        this.timezoneAbbreviation$ = combineLatest([this.date$, this.timezone$, this.timeDate$]).pipe(map(([date, timezone, timeDate]) => getTimezoneAbbreviation(timezone, timeDate ?? date)), distinctUntilChanged(), shareReplay(1));
         this.dateValue$ = merge(this.date$, this.valueInSystemTimezone$.pipe(skipFirstMaybe())).pipe(map((x) => (x ? startOfDay(x) : null)), distinctUntilChanged(isSameDateDay), shareReplay(1));
         this.timeInput$ = this._updateTime.pipe(debounceTime(5), map(() => this.timeInputCtrl.value || ''), distinctUntilChanged());
         this.syncConfigObs$ = this._syncConfigObs.pipe(switchMapMaybeDefault(), shareReplay(1));
@@ -3887,10 +3889,10 @@ class DbxDateTimeFieldComponent extends FieldType$1 {
         // TODO: Get min/max using the DateTimePickerConfiguration too
         this.dateInputMin$ = this.syncConfigBeforeValue$;
         this.dateInputMax$ = this.syncConfigAfterValue$;
-        this.rawDateTime$ = combineLatest([this.dateValue$, this.timeInput$.pipe(startWith(null)), this.fullDay$]).pipe(map(([date, timeString, fullDay]) => {
+        this.rawDateTime$ = combineLatest([this.dateValue$, this.timeInput$.pipe(startWith(null)), this.fullDay$, this.timeDate$]).pipe(map(([date, timeString, fullDay, timeDate]) => {
             let result;
-            if (!date && this.timeOnly) {
-                date = new Date();
+            if (!date || this.timeOnly) {
+                date = timeDate ?? new Date(); // use the time date, or default to the current day
             }
             if (date) {
                 if (fullDay) {
@@ -3908,7 +3910,7 @@ class DbxDateTimeFieldComponent extends FieldType$1 {
                             useSystemTimezone: true
                         }) ?? date;
                 }
-                else {
+                else if (!this.timeOnly) {
                     result = date;
                 }
             }
@@ -3948,7 +3950,7 @@ class DbxDateTimeFieldComponent extends FieldType$1 {
                     ...config,
                     roundDownToMinute: true
                 });
-                date = instance.limit(date);
+                date = instance.clamp(date);
                 const minutes = stepsOffset * 5;
                 date = addMinutes(date, minutes);
             }
@@ -4004,6 +4006,9 @@ class DbxDateTimeFieldComponent extends FieldType$1 {
     get timezone() {
         return this.field.props.timezone;
     }
+    get timeDate() {
+        return this.field.props.timeDate;
+    }
     get showTimezone() {
         return this.field.props.showTimezone ?? true;
     }
@@ -4024,17 +4029,35 @@ class DbxDateTimeFieldComponent extends FieldType$1 {
             this.formControl.markAsDirty();
             this.formControl.markAsTouched();
         });
+        let hasSetMidnightFromInput = false;
+        /*
         this._valueSub.subscription = this.timeString$.subscribe((x) => {
-            // Skip events where the timeInput value is cleared.
-            if (!this.timeInputCtrl.value && x === '12:00AM') {
+          this.setTime(x);
+        });
+        */
+        this._valueSub.subscription = this.valueInSystemTimezone$
+            .pipe(map((x) => (x ? isSameDate(x, startOfDay(x)) : false)), distinctUntilChanged(), switchMap((isInputValueAtMidnight) => {
+            hasSetMidnightFromInput = false;
+            return this.timeString$.pipe(
+            // skip(1),
+            map((timeString) => [timeString, isInputValueAtMidnight]));
+        }))
+            .subscribe(([x, isInputValueAtMidnight]) => {
+            // Skip events where the timeInput value is cleared, unless the input value is at midnight and we've already processed it being at midnight
+            if (!this.timeInputCtrl.value && x === '12:00AM' && (!isInputValueAtMidnight || (isInputValueAtMidnight && hasSetMidnightFromInput))) {
                 return;
             }
+            // update the has set flag
+            if (x === '12:00AM' && isInputValueAtMidnight) {
+                hasSetMidnightFromInput = true;
+            }
             this.setTime(x);
         });
         // Set default timezone if provided.
         if (this.timezone && !this.dateTimeField.fullDayInUTC) {
             this._defaultTimezone.next(asObservableFromGetter(this.timezone));
         }
+        this._timeDate.next(asObservableFromGetter(this.timeDate));
         // Watch for disabled changes so we can propogate them properly.
         this.formControl.registerOnDisabledChange((disabled) => {
             if (disabled) {
@@ -4084,6 +4107,7 @@ class DbxDateTimeFieldComponent extends FieldType$1 {
         this._valueSub.destroy();
         this._config.complete();
         this._defaultTimezone.complete();
+        this._timeDate.complete();
         this._presets.complete();
         this._fullDayControlObs.complete();
         this._offset.complete();
@@ -4121,9 +4145,11 @@ class DbxDateTimeFieldComponent extends FieldType$1 {
         this.setTime(timeString);
     }
     setTime(time) {
-        this.timeInputCtrl.setValue(time);
-        this._offset.next(0);
-        this._updateTime.next();
+        if (this.timeInputCtrl.value !== time) {
+            this.timeInputCtrl.setValue(time);
+            this._offset.next(0);
+            this._updateTime.next();
+        }
     }
     keydownOnDateInput(event) {
         let direction = 0;
@@ -4778,7 +4804,7 @@ function timeOnlyField(config = {}) {
     });
 }
 function dateTimeField(config = {}) {
-    const { key = 'date', dateLabel, timeLabel, allDayLabel, atTimeLabel, timezone, showTimezone, timeMode = DbxDateTimeFieldTimeMode.REQUIRED, valueMode, fullDayInUTC, fullDayFieldName, pickerConfig, getConfigObs, getSyncFieldsObs, hideDatePicker, hideDateHint, timeOnly = false, presets, materialFormField } = config;
+    const { key = 'date', dateLabel, timeLabel, allDayLabel, atTimeLabel, timeDate, timezone, showTimezone, timeMode = DbxDateTimeFieldTimeMode.REQUIRED, valueMode, fullDayInUTC, fullDayFieldName, pickerConfig, getConfigObs, getSyncFieldsObs, hideDatePicker, hideDateHint, timeOnly = false, presets, materialFormField } = config;
     const fieldConfig = formlyField({
         key,
         type: 'datetime',
@@ -4794,6 +4820,7 @@ function dateTimeField(config = {}) {
             presets,
             timeMode: timeOnly ? DbxDateTimeFieldTimeMode.REQUIRED : timeMode,
             timezone,
+            timeDate,
             showTimezone,
             fullDayFieldName,
             fullDayInUTC,
@@ -4809,7 +4836,7 @@ function dateTimeField(config = {}) {
     });
 }
 function dateRangeField(config = {}) {
-    const { required: inputRequired, start, end, timezone, showTimezone, presets } = config;
+    const { required: inputRequired, start, end, timeDate, timezone, showTimezone, presets } = config;
     const required = inputRequired ?? start?.required ?? false;
     const startFieldKey = start?.key ?? 'start';
     const endFieldKey = end?.key ?? 'end';
@@ -4819,9 +4846,10 @@ function dateRangeField(config = {}) {
         getSyncFieldsObs: () => of([{ syncWith: endFieldKey, syncType: 'after' }]),
         presets,
         allDayLabel: '',
-        ...start,
+        timeDate,
         timezone,
         showTimezone,
+        ...start,
         required,
         key: startFieldKey
     });
@@ -4831,9 +4859,10 @@ function dateRangeField(config = {}) {
         getSyncFieldsObs: () => of([{ syncWith: startFieldKey, syncType: 'before' }]),
         presets,
         allDayLabel: '',
-        ...end,
+        timeDate,
         timezone,
         showTimezone,
+        ...end,
         required,
         key: endFieldKey
     });
@@ -4843,7 +4872,7 @@ function dateRangeField(config = {}) {
     };
 }
 function dateTimeRangeField(inputConfig = {}) {
-    const { required = false, start: inputStart, end: inputEnd, timezone, showTimezone, presets } = inputConfig;
+    const { required = false, start: inputStart, end: inputEnd, timezone, timeDate, showTimezone, presets } = inputConfig;
     function dateTimeRangeFieldConfig(config) {
         return {
             ...config,
@@ -4868,6 +4897,7 @@ function dateTimeRangeField(inputConfig = {}) {
     };
     const config = {
         timezone,
+        timeDate,
         showTimezone,
         presets,
         start,