@dereekb/dbx-form 9.23.9 → 9.23.10

package/fesm2020/dereekb-dbx-form-calendar.mjs

@@ -7,10 +7,10 @@ import { Injectable, SkipSelf, Directive, Injector, Optional, Component, Inject,
 import { FieldType } from '@ngx-formly/material';
 import { map, distinctUntilChanged, shareReplay, BehaviorSubject, switchMap, of, startWith, filter, throttleTime, first } from 'rxjs';
 import { filterMaybe, SubscriptionObject, asObservable } from '@dereekb/rxjs';
-import { DateScheduleDayCode, expandDateScheduleDayCodesToDayOfWeekSet, dateTimingRelativeIndexFactory, dateBlockDayOfWeekFactory, isSameDate, isSameDateRange, isSameDateScheduleRange, findMaxDate, isSameDateDay, findMinDate, dateScheduleDateFilter, dateScheduleDayCodes, isDateInDateRangeFunction, isDateWithinDateBlockRangeFunction, dateScheduleEncodedWeek, dateBlockTimingDateFactory, enabledDaysFromDateScheduleDayCodes, dateScheduleDayCodesFromEnabledDays, formatToMonthDayString } from '@dereekb/date';
-import { setsAreEquivalent, iterableToArray, toggleInSet, addToSet, isIndexNumberInIndexRangeFunction, range, minAndMaxNumber, randomNumberFactory, getDaysOfWeekNames } from '@dereekb/util';
+import { DateScheduleDayCode, expandDateScheduleDayCodesToDayOfWeekSet, dateTimingRelativeIndexFactory, dateBlockDayOfWeekFactory, findMaxDate, findMinDate, isSameDate, isSameDateRange, isSameDateScheduleRange, isSameDateDay, copyDateScheduleDateFilterConfig, dateScheduleDateFilter, expandDateScheduleDayCodes, isDateInDateRangeFunction, isDateWithinDateBlockRangeFunction, dateScheduleEncodedWeek, dateBlockTimingDateFactory, enabledDaysFromDateScheduleDayCodes, dateScheduleDayCodesFromEnabledDays, formatToMonthDayString } from '@dereekb/date';
+import { setsAreEquivalent, range, iterableToArray, toggleInSet, addToSet, isIndexNumberInIndexRangeFunction, minAndMaxNumber, randomNumberFactory, getDaysOfWeekNames } from '@dereekb/util';
 import { ComponentStore } from '@ngrx/component-store';
-import { startOfDay, startOfYear, addYears } from 'date-fns';
+import { startOfDay } from 'date-fns';
 import * as i1 from '@dereekb/dbx-web/calendar';
 import { prepareAndSortCalendarEvents, DbxCalendarStore, DbxCalendarModule } from '@dereekb/dbx-web/calendar';
 import * as i3 from '@angular/forms';
@@ -36,14 +36,16 @@ import { MatButtonToggleModule } from '@angular/material/button-toggle';
 import { FlexLayoutModule } from '@angular/flex-layout';
 
 function dateScheduleRangeField(config = {}) {
-    const { key = 'schedule', filter } = config;
+    const { key = 'schedule', filter, initialSelectionState, computeSelectionResultRelativeToFilter } = config;
     const fieldConfig = {
         ...formlyField({
             key,
             type: 'date-schedule-range',
             ...propsAndConfigForFieldConfig(config, {
                 label: config.label ?? 'Schedule',
-                filter
+                filter,
+                computeSelectionResultRelativeToFilter,
+                initialSelectionState
             })
         })
     };
@@ -95,11 +97,24 @@ function initialCalendarScheduleSelectionState() {
         indexDayOfWeek,
         isEnabledFilterDay: () => true,
         isEnabledDay: () => false,
-        minDate: new Date(0),
-        maxDate: startOfYear(addYears(new Date(), 100)),
+        minDate: null,
+        maxDate: null,
+        computeSelectionResultRelativeToFilter: true,
         cellContentFactory: defaultCalendarScheduleSelectionCellContentFactory
     };
 }
+function calendarScheduleMinDate(x) {
+    return findMaxDate([x.filter?.start, x.minDate]);
+}
+function calendarScheduleMaxDate(x) {
+    return findMinDate([x.filter?.end, x.maxDate]);
+}
+function calendarScheduleMinAndMaxDate(x) {
+    return {
+        minDate: calendarScheduleMinDate(x),
+        maxDate: calendarScheduleMaxDate(x)
+    };
+}
 class DbxCalendarScheduleSelectionStore extends ComponentStore {
     constructor() {
         super(initialCalendarScheduleSelectionState());
@@ -120,18 +135,21 @@ class DbxCalendarScheduleSelectionStore extends ComponentStore {
         this.isEnabledFilterDayFunction$ = this.state$.pipe(map((x) => x.isEnabledFilterDay), shareReplay(1));
         this.isEnabledDayFunction$ = this.state$.pipe(map((x) => x.isEnabledDay), shareReplay(1));
         this.currentDateRange$ = this.state$.pipe(map(computeCalendarScheduleSelectionRange), distinctUntilChanged((a, b) => isSameDateRange(a, b)), shareReplay(1));
+        this.computeSelectionResultRelativeToFilter$ = this.state$.pipe(map((x) => x.computeSelectionResultRelativeToFilter), shareReplay(1));
+        this.startBeingUsedFromFilter$ = this.state$.pipe(map((x) => x.computeSelectionResultRelativeToFilter && x.filter?.start != null), shareReplay(1));
         this.dateRange$ = this.currentDateRange$.pipe(filterMaybe(), shareReplay(1));
         this.scheduleDays$ = this.state$.pipe(map((x) => x.scheduleDays), distinctUntilChanged(setsAreEquivalent), shareReplay(1));
         this.currentSelectionValue$ = this.state$.pipe(map((x) => x.currentSelectionValue), shareReplay(1));
         this.selectionValue$ = this.currentSelectionValue$.pipe(filterMaybe(), shareReplay(1));
         this.currentDateScheduleRangeValue$ = this.currentSelectionValue$.pipe(map((x) => x?.dateScheduleRange), distinctUntilChanged(isSameDateScheduleRange), shareReplay(1));
         this.dateScheduleRangeValue$ = this.currentDateScheduleRangeValue$.pipe(filterMaybe(), shareReplay(1));
-        this.minDate$ = this.state$.pipe(map((x) => findMaxDate([x.filter?.start, x.minDate])), distinctUntilChanged(isSameDateDay), shareReplay(1));
-        this.maxDate$ = this.state$.pipe(map((x) => findMinDate([x.filter?.end, x.maxDate])), distinctUntilChanged(isSameDateDay), shareReplay(1));
+        this.minDate$ = this.state$.pipe(map(calendarScheduleMinDate), distinctUntilChanged(isSameDateDay), shareReplay(1));
+        this.maxDate$ = this.state$.pipe(map(calendarScheduleMaxDate), distinctUntilChanged(isSameDateDay), shareReplay(1));
         this.cellContentFactory$ = this.state$.pipe(map((x) => x.cellContentFactory), distinctUntilChanged(), shareReplay(1));
         this.isCustomized$ = this.state$.pipe(map((x) => x.selectedIndexes.size > 0), distinctUntilChanged(), shareReplay(1));
         // MARK: State Changes
         this.setFilter = this.updater((state, filter) => updateStateWithFilter(state, filter));
+        this.setComputeSelectionResultRelativeToFilter = this.updater((state, computeSelectionResultRelativeToFilter) => updateStateWithComputeSelectionResultRelativeToFilter(state, computeSelectionResultRelativeToFilter));
         this.clearFilter = this.updater((state) => updateStateWithFilter(state, undefined));
         this.setTimezone = this.updater((state, timezone) => ({ ...state, timezone }));
         this.setInputRange = this.updater((state, range) => updateStateWithChangedRange(state, range));
@@ -139,6 +157,8 @@ class DbxCalendarScheduleSelectionStore extends ComponentStore {
         this.addSelectedDates = this.updater((state, add) => updateStateWithChangedDates(state, { add }));
         this.removeSelectedDates = this.updater((state, remove) => updateStateWithChangedDates(state, { remove }));
         this.setSelectedDates = this.updater((state, set) => updateStateWithChangedDates(state, { set }));
+        this.selectAllDates = this.updater((state, selectAll = 'all') => updateStateWithChangedDates(state, { selectAll }));
+        this.setInitialSelectionState = this.updater((state, initialSelectionState) => updateStateWithInitialSelectionState(state, initialSelectionState));
         this.setScheduleDays = this.updater((state, scheduleDays) => updateStateWithChangedScheduleDays(state, scheduleDays));
         this.setAllowAllScheduleDays = this.updater((state) => updateStateWithChangedScheduleDays(state, null));
         this.setDateScheduleRangeValue = this.updater((state, value) => updateStateWithDateScheduleRangeValue(state, value));
@@ -150,12 +170,38 @@ DbxCalendarScheduleSelectionStore.ɵprov = i0.ɵɵngDeclareInjectable({ minVersi
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: DbxCalendarScheduleSelectionStore, decorators: [{
             type: Injectable
         }], ctorParameters: function () { return []; } });
-function updateStateWithFilter(state, filter) {
+function updateStateWithInitialSelectionState(state, initialSelectionState) {
+    const { selectedIndexes } = state;
+    if (selectedIndexes.size === 0 && initialSelectionState === 'all') {
+        state = updateStateWithChangedDates(state, { selectAll: initialSelectionState });
+    }
+    return { ...state, initialSelectionState };
+}
+function updateStateWithComputeSelectionResultRelativeToFilter(currentState, computeSelectionResultRelativeToFilter) {
+    let state = { ...currentState, computeSelectionResultRelativeToFilter };
+    if (Boolean(currentState.computeSelectionResultRelativeToFilter) !== Boolean(computeSelectionResultRelativeToFilter)) {
+        state = updateStateWithChangedDates(state, {}); // recalculate if change occurs as it will affect the output value
+    }
+    return state;
+}
+function updateStateWithFilter(state, inputFilter) {
     let isEnabledFilterDay = () => true;
-    if (filter) {
+    let filter = null;
+    if (inputFilter) {
+        filter = copyDateScheduleDateFilterConfig(inputFilter); // copy filter
         isEnabledFilterDay = dateScheduleDateFilter(filter);
     }
-    return { ...state, filter, isEnabledFilterDay };
+    state = { ...state, filter, isEnabledFilterDay };
+    // attempt to re-apply the initial selection state once filter is applied
+    if (state.initialSelectionState) {
+        state = updateStateWithInitialSelectionState(state, state.initialSelectionState);
+    }
+    // re-calculate the selection given the filter
+    const { inputStart, inputEnd } = state;
+    if (inputStart && inputEnd) {
+        state = updateStateWithChangedRange(state, { inputStart, inputEnd });
+    }
+    return state;
 }
 function updateStateWithDateScheduleRangeValue(state, change) {
     const isSameValue = isSameDateScheduleRange(state.currentSelectionValue?.dateScheduleRange, change);
@@ -165,7 +211,7 @@ function updateStateWithDateScheduleRangeValue(state, change) {
     else {
         if (change != null) {
             const nextState = { ...state, inputStart: change.start, inputEnd: change.end, selectedIndexes: new Set(change.ex) };
-            return updateStateWithChangedScheduleDays(finalizeNewCalendarScheduleSelectionState(nextState), dateScheduleDayCodes(change.w));
+            return updateStateWithChangedScheduleDays(finalizeNewCalendarScheduleSelectionState(nextState), expandDateScheduleDayCodes(change.w));
         }
         else {
             return noSelectionCalendarScheduleSelectionState(state); // clear selection, retain disabled days
@@ -186,9 +232,24 @@ function updateStateWithChangedScheduleDays(state, change) {
 }
 function updateStateWithChangedDates(state, change) {
     const { indexFactory, allowedDaysOfWeek, indexDayOfWeek } = state;
+    const { minDate, maxDate } = calendarScheduleMinAndMaxDate(state);
     let selectedIndexes;
-    if (change.set) {
-        selectedIndexes = new Set(iterableToArray(change.set).map(indexFactory));
+    if (change.reset || change.selectAll != null || change.set) {
+        let set = change.set ?? [];
+        let selectAll = change.reset === true ? state.initialSelectionState : change.selectAll;
+        switch (selectAll) {
+            case 'all':
+                if (minDate != null && maxDate != null) {
+                    const minIndex = indexFactory(minDate);
+                    const maxIndex = indexFactory(maxDate);
+                    set = range(minIndex, maxIndex);
+                }
+                break;
+            case 'none':
+                set = [];
+                break;
+        }
+        selectedIndexes = new Set(iterableToArray(set).map(indexFactory));
     }
     else {
         selectedIndexes = new Set(state.selectedIndexes);
@@ -214,22 +275,22 @@ function updateStateWithChangedDates(state, change) {
     }
     else {
         // no selected days
-        return noSelectionCalendarScheduleSelectionState(state);
+        return noSelectionCalendarScheduleSelectionState(nextState);
     }
 }
 function noSelectionCalendarScheduleSelectionState(state) {
     return finalizeNewCalendarScheduleSelectionState({ ...state, selectedIndexes: new Set(), inputStart: null, inputEnd: null });
 }
 function updateStateWithChangedRange(state, change) {
-    const { inputStart: currentInputStart, inputEnd: currentInputEnd, indexFactory, minDate, maxDate } = state;
-    const inputStart = startOfDay(change.inputStart);
-    const inputEnd = startOfDay(change.inputEnd);
+    const { inputStart: currentInputStart, inputEnd: currentInputEnd, indexFactory, minDate, maxDate, filter, computeSelectionResultRelativeToFilter } = state;
+    let inputStart = startOfDay(change.inputStart);
+    let inputEnd = startOfDay(change.inputEnd);
     const isValidRange = minDate != null || maxDate != null ? isDateInDateRangeFunction({ start: minDate ?? undefined, end: maxDate ?? undefined }) : () => true;
     if (!isValidRange(inputStart) || !isValidRange(inputEnd) || (isSameDateDay(inputStart, currentInputStart) && isSameDateDay(inputEnd, currentInputEnd))) {
         return state; // if no change, return the current state.
     }
     // retain all indexes that are within the new range
-    const minIndex = indexFactory(inputStart);
+    const minIndex = computeSelectionResultRelativeToFilter && filter?.start ? indexFactory(filter?.start) : indexFactory(inputStart);
     const maxIndex = indexFactory(inputEnd) + 1;
     const currentIndexes = Array.from(state.selectedIndexes);
     const isInCurrentRange = isIndexNumberInIndexRangeFunction({ minIndex, maxIndex });
@@ -262,19 +323,30 @@ function isEnabledDayInCalendarScheduleSelectionState(state) {
     };
 }
 function computeScheduleSelectionValue(state) {
-    const { scheduleDays, allowedDaysOfWeek, indexDayOfWeek } = state;
+    const { indexFactory, scheduleDays, allowedDaysOfWeek, indexDayOfWeek, computeSelectionResultRelativeToFilter, filter } = state;
     const rangeAndExclusion = computeScheduleSelectionRangeAndExclusion(state);
     if (rangeAndExclusion == null) {
         return null;
     }
-    const { start, end, excluded, dateBlockRange } = rangeAndExclusion;
-    const indexOffset = dateBlockRange.i;
-    const ex = excluded
-        .filter((x) => {
-        const isExcludedIndex = allowedDaysOfWeek.has(indexDayOfWeek(x));
-        return isExcludedIndex;
-    })
-        .map((x) => x - indexOffset); // set to the proper offset
+    const { start: rangeStart, end, excluded: allExcluded, dateBlockRange } = rangeAndExclusion;
+    let filterOffsetExcludedRange = [];
+    let indexOffset = dateBlockRange.i;
+    let start = rangeStart;
+    // If computeSelectionResultRelativeToFilter is true, then we need to offset the values to be relative to that start.
+    if (computeSelectionResultRelativeToFilter && filter?.start) {
+        start = filter.start;
+        const filterStartIndexOffset = indexFactory(rangeStart) - indexFactory(start);
+        filterOffsetExcludedRange = range(0, filterStartIndexOffset);
+        indexOffset = indexOffset - filterStartIndexOffset;
+    }
+    const excluded = computeSelectionResultRelativeToFilter
+        ? allExcluded.filter((x) => {
+            const isExcludedIndex = allowedDaysOfWeek.has(indexDayOfWeek(x)); // ???
+            return isExcludedIndex;
+        })
+        : allExcluded;
+    const offsetExcluded = excluded.map((x) => x - indexOffset); // set to the proper offset
+    const ex = [...filterOffsetExcludedRange, ...offsetExcluded];
     const w = dateScheduleEncodedWeek(scheduleDays);
     const d = []; // "included" blocks are never used/calculated.
     const dateScheduleRange = {
@@ -290,7 +362,7 @@ function computeScheduleSelectionValue(state) {
     };
 }
 function computeScheduleSelectionRangeAndExclusion(state) {
-    const { isEnabledDay } = state;
+    const { isEnabledDay, isEnabledFilterDay } = state;
     const dateFactory = dateBlockTimingDateFactory(state);
     const dateBlockRange = computeCalendarScheduleSelectionDateBlockRange(state);
     if (dateBlockRange == null) {
@@ -299,7 +371,7 @@ function computeScheduleSelectionRangeAndExclusion(state) {
     const start = dateFactory(dateBlockRange.i);
     const end = dateFactory(dateBlockRange.to);
     const excluded = range(dateBlockRange.i, dateBlockRange.to + 1).filter((x) => {
-        const isExcludedIndex = !isEnabledDay(x);
+        const isExcludedIndex = !isEnabledDay(x) || !isEnabledFilterDay(x);
         return isExcludedIndex;
     });
     const result = {
@@ -313,12 +385,8 @@ function computeScheduleSelectionRangeAndExclusion(state) {
 function computeCalendarScheduleSelectionRange(state) {
     const dateFactory = dateBlockTimingDateFactory(state);
     const dateBlockRange = computeCalendarScheduleSelectionDateBlockRange(state);
-    if (dateBlockRange != null) {
-        return { start: dateFactory(dateBlockRange.i), end: dateFactory(dateBlockRange.to) };
-    }
-    else {
-        return undefined;
-    }
+    const dateRange = dateBlockRange != null ? { start: dateFactory(dateBlockRange.i), end: dateFactory(dateBlockRange.to) } : undefined;
+    return dateRange;
 }
 function computeCalendarScheduleSelectionDateBlockRange(state) {
     const { indexFactory, inputStart, inputEnd, allowedDaysOfWeek, indexDayOfWeek, isEnabledDay, isEnabledFilterDay } = state;
@@ -846,6 +914,12 @@ class DbxFormCalendarDateScheduleRangeFieldComponent extends FieldType {
     get filter() {
         return this.props.filter;
     }
+    get initialSelectionState() {
+        return this.props.initialSelectionState;
+    }
+    get computeSelectionResultRelativeToFilter() {
+        return this.props.computeSelectionResultRelativeToFilter;
+    }
     ngOnInit() {
         this._formControlObs.next(this.formControl);
         this._syncSub.subscription = this.value$.pipe(distinctUntilChanged(isSameDateScheduleRange)).subscribe((x) => {
@@ -858,6 +932,12 @@ class DbxFormCalendarDateScheduleRangeFieldComponent extends FieldType {
         if (filter != null) {
             this._filterSub.subscription = this.dbxCalendarScheduleSelectionStore.setFilter(asObservable(filter));
         }
+        if (this.initialSelectionState !== undefined) {
+            this.dbxCalendarScheduleSelectionStore.setInitialSelectionState(this.initialSelectionState);
+        }
+        if (this.computeSelectionResultRelativeToFilter != null) {
+            this.dbxCalendarScheduleSelectionStore.setComputeSelectionResultRelativeToFilter(this.computeSelectionResultRelativeToFilter);
+        }
     }
     ngOnDestroy() {
         super.ngOnDestroy();
@@ -1052,5 +1132,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImpo
  * Generated bundle index. Do not edit.
  */
 
-export { CalendarScheduleSelectionDayState, DEFAULT_SCHEDULE_SELECTION_CALENDAR_DATE_POPOVER_KEY, DbxCalendarScheduleSelectionStore, DbxCalendarScheduleSelectionStoreInjectionBlockDirective, DbxCalendarScheduleSelectionStoreProviderBlock, DbxFormCalendarDateScheduleRangeFieldComponent, DbxFormCalendarModule, DbxFormDateScheduleRangeFieldModule, DbxScheduleSelectionCalendarCellComponent, DbxScheduleSelectionCalendarComponent, DbxScheduleSelectionCalendarDateDaysComponent, DbxScheduleSelectionCalendarDateDaysFormComponent, DbxScheduleSelectionCalendarDateDialogButtonComponent, DbxScheduleSelectionCalendarDateDialogComponent, DbxScheduleSelectionCalendarDatePopoverButtonComponent, DbxScheduleSelectionCalendarDatePopoverComponent, DbxScheduleSelectionCalendarDatePopoverContentComponent, DbxScheduleSelectionCalendarDateRangeComponent, computeCalendarScheduleSelectionDateBlockRange, computeCalendarScheduleSelectionRange, computeScheduleSelectionRangeAndExclusion, computeScheduleSelectionValue, dateScheduleRangeField, dbxScheduleSelectionCalendarDateDaysFormDayFields, dbxScheduleSelectionCalendarDateDaysFormFields, defaultCalendarScheduleSelectionCellContentFactory, finalizeNewCalendarScheduleSelectionState, initialCalendarScheduleSelectionState, isEnabledDayInCalendarScheduleSelectionState, noSelectionCalendarScheduleSelectionState, provideCalendarScheduleSelectionStoreIfParentIsUnavailable, updateStateWithChangedDates, updateStateWithChangedRange, updateStateWithChangedScheduleDays, updateStateWithDateScheduleRangeValue, updateStateWithFilter };
+export { CalendarScheduleSelectionDayState, DEFAULT_SCHEDULE_SELECTION_CALENDAR_DATE_POPOVER_KEY, DbxCalendarScheduleSelectionStore, DbxCalendarScheduleSelectionStoreInjectionBlockDirective, DbxCalendarScheduleSelectionStoreProviderBlock, DbxFormCalendarDateScheduleRangeFieldComponent, DbxFormCalendarModule, DbxFormDateScheduleRangeFieldModule, DbxScheduleSelectionCalendarCellComponent, DbxScheduleSelectionCalendarComponent, DbxScheduleSelectionCalendarDateDaysComponent, DbxScheduleSelectionCalendarDateDaysFormComponent, DbxScheduleSelectionCalendarDateDialogButtonComponent, DbxScheduleSelectionCalendarDateDialogComponent, DbxScheduleSelectionCalendarDatePopoverButtonComponent, DbxScheduleSelectionCalendarDatePopoverComponent, DbxScheduleSelectionCalendarDatePopoverContentComponent, DbxScheduleSelectionCalendarDateRangeComponent, calendarScheduleMaxDate, calendarScheduleMinAndMaxDate, calendarScheduleMinDate, computeCalendarScheduleSelectionDateBlockRange, computeCalendarScheduleSelectionRange, computeScheduleSelectionRangeAndExclusion, computeScheduleSelectionValue, dateScheduleRangeField, dbxScheduleSelectionCalendarDateDaysFormDayFields, dbxScheduleSelectionCalendarDateDaysFormFields, defaultCalendarScheduleSelectionCellContentFactory, finalizeNewCalendarScheduleSelectionState, initialCalendarScheduleSelectionState, isEnabledDayInCalendarScheduleSelectionState, noSelectionCalendarScheduleSelectionState, provideCalendarScheduleSelectionStoreIfParentIsUnavailable, updateStateWithChangedDates, updateStateWithChangedRange, updateStateWithChangedScheduleDays, updateStateWithComputeSelectionResultRelativeToFilter, updateStateWithDateScheduleRangeValue, updateStateWithFilter, updateStateWithInitialSelectionState };
 //# sourceMappingURL=dereekb-dbx-form-calendar.mjs.map