@dereekb/dbx-form 9.23.10 → 9.23.12
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/calendar/lib/calendar.module.d.ts +14 -13
- package/calendar/lib/calendar.schedule.selection.store.d.ts +16 -3
- package/calendar/lib/calendar.schedule.selection.toggle.button.component.d.ts +19 -0
- package/calendar/lib/field/schedule/calendar.schedule.field.component.d.ts +5 -2
- package/calendar/lib/index.d.ts +1 -0
- package/esm2020/calendar/lib/calendar.module.mjs +8 -4
- package/esm2020/calendar/lib/calendar.schedule.selection.component.mjs +8 -6
- package/esm2020/calendar/lib/calendar.schedule.selection.range.component.mjs +3 -3
- package/esm2020/calendar/lib/calendar.schedule.selection.store.mjs +75 -16
- package/esm2020/calendar/lib/calendar.schedule.selection.toggle.button.component.mjs +55 -0
- package/esm2020/calendar/lib/field/schedule/calendar.schedule.field.component.mjs +12 -3
- package/esm2020/calendar/lib/field/schedule/calendar.schedule.field.mjs +4 -3
- package/esm2020/calendar/lib/index.mjs +2 -1
- package/fesm2015/dereekb-dbx-form-calendar.mjs +144 -28
- package/fesm2015/dereekb-dbx-form-calendar.mjs.map +1 -1
- package/fesm2020/dereekb-dbx-form-calendar.mjs +147 -28
- package/fesm2020/dereekb-dbx-form-calendar.mjs.map +1 -1
- package/mapbox/package.json +4 -4
- package/package.json +4 -4
|
@@ -5,10 +5,10 @@ import { AbstractPopoverDirective, AbstractDialogDirective, DbxActionModule, Dbx
|
|
|
5
5
|
import * as i0 from '@angular/core';
|
|
6
6
|
import { Injectable, SkipSelf, Directive, Injector, Optional, Component, Inject, Input, ElementRef, ViewChild, ChangeDetectionStrategy, EventEmitter, Output, NgModule } from '@angular/core';
|
|
7
7
|
import { FieldType } from '@ngx-formly/material';
|
|
8
|
-
import { map, distinctUntilChanged, shareReplay, BehaviorSubject,
|
|
8
|
+
import { switchMap, first, tap, map, distinctUntilChanged, shareReplay, BehaviorSubject, of, startWith, filter, throttleTime } from 'rxjs';
|
|
9
9
|
import { filterMaybe, SubscriptionObject, asObservable } from '@dereekb/rxjs';
|
|
10
|
-
import { DateScheduleDayCode, expandDateScheduleDayCodesToDayOfWeekSet, dateTimingRelativeIndexFactory, dateBlockDayOfWeekFactory, findMaxDate, findMinDate, isSameDate, isSameDateRange, isSameDateScheduleRange, isSameDateDay, copyDateScheduleDateFilterConfig, dateScheduleDateFilter, expandDateScheduleDayCodes, isDateInDateRangeFunction, isDateWithinDateBlockRangeFunction, dateScheduleEncodedWeek, dateBlockTimingDateFactory, enabledDaysFromDateScheduleDayCodes, dateScheduleDayCodesFromEnabledDays, formatToMonthDayString } from '@dereekb/date';
|
|
11
|
-
import { setsAreEquivalent,
|
|
10
|
+
import { DateScheduleDayCode, expandDateScheduleDayCodesToDayOfWeekSet, dateTimingRelativeIndexFactory, dateBlockDayOfWeekFactory, findMaxDate, findMinDate, isSameDate, isSameDateRange, isSameDateScheduleRange, isSameDateDay, dateTimingRelativeIndexArrayFactory, copyDateScheduleDateFilterConfig, dateScheduleDateFilter, expandDateScheduleDayCodes, isDateInDateRangeFunction, isDateWithinDateBlockRangeFunction, dateScheduleEncodedWeek, dateBlockTimingDateFactory, enabledDaysFromDateScheduleDayCodes, dateScheduleDayCodesFromEnabledDays, formatToMonthDayString } from '@dereekb/date';
|
|
11
|
+
import { setsAreEquivalent, unique, mergeArrays, iterableToArray, toggleInSet, addToSet, isIndexNumberInIndexRangeFunction, range, minAndMaxNumber, randomNumberFactory, getDaysOfWeekNames } from '@dereekb/util';
|
|
12
12
|
import { ComponentStore } from '@ngrx/component-store';
|
|
13
13
|
import { startOfDay } from 'date-fns';
|
|
14
14
|
import * as i1 from '@dereekb/dbx-web/calendar';
|
|
@@ -22,7 +22,7 @@ import { CommonModule } from '@angular/common';
|
|
|
22
22
|
import * as i7 from '@angular/material/datepicker';
|
|
23
23
|
import { MatDatepickerModule } from '@angular/material/datepicker';
|
|
24
24
|
import * as i1$2 from '@angular/material/dialog';
|
|
25
|
-
import * as
|
|
25
|
+
import * as i5$1 from 'angular-calendar';
|
|
26
26
|
import { CalendarModule, CalendarDayModule, CalendarWeekModule } from 'angular-calendar';
|
|
27
27
|
import * as i3$2 from '@dereekb/dbx-core';
|
|
28
28
|
import * as i3$3 from '@angular/material/icon';
|
|
@@ -36,7 +36,7 @@ import { MatButtonToggleModule } from '@angular/material/button-toggle';
|
|
|
36
36
|
import { FlexLayoutModule } from '@angular/flex-layout';
|
|
37
37
|
|
|
38
38
|
function dateScheduleRangeField(config = {}) {
|
|
39
|
-
const { key = 'schedule', filter, initialSelectionState, computeSelectionResultRelativeToFilter } = config;
|
|
39
|
+
const { key = 'schedule', filter, initialSelectionState, computeSelectionResultRelativeToFilter, exclusions } = config;
|
|
40
40
|
const fieldConfig = {
|
|
41
41
|
...formlyField({
|
|
42
42
|
key,
|
|
@@ -45,7 +45,8 @@ function dateScheduleRangeField(config = {}) {
|
|
|
45
45
|
label: config.label ?? 'Schedule',
|
|
46
46
|
filter,
|
|
47
47
|
computeSelectionResultRelativeToFilter,
|
|
48
|
-
initialSelectionState
|
|
48
|
+
initialSelectionState,
|
|
49
|
+
exclusions
|
|
49
50
|
})
|
|
50
51
|
})
|
|
51
52
|
};
|
|
@@ -83,9 +84,9 @@ const defaultCalendarScheduleSelectionCellContentFactory = (day) => {
|
|
|
83
84
|
};
|
|
84
85
|
|
|
85
86
|
function initialCalendarScheduleSelectionState() {
|
|
86
|
-
const start = startOfDay(new Date());
|
|
87
87
|
const scheduleDays = new Set([DateScheduleDayCode.WEEKDAY, DateScheduleDayCode.WEEKEND]);
|
|
88
88
|
const allowedDaysOfWeek = expandDateScheduleDayCodesToDayOfWeekSet(Array.from(scheduleDays));
|
|
89
|
+
const start = startOfDay(new Date());
|
|
89
90
|
const indexFactory = dateTimingRelativeIndexFactory({ start });
|
|
90
91
|
const indexDayOfWeek = dateBlockDayOfWeekFactory(start);
|
|
91
92
|
return {
|
|
@@ -118,8 +119,15 @@ function calendarScheduleMinAndMaxDate(x) {
|
|
|
118
119
|
class DbxCalendarScheduleSelectionStore extends ComponentStore {
|
|
119
120
|
constructor() {
|
|
120
121
|
super(initialCalendarScheduleSelectionState());
|
|
122
|
+
// MARK:
|
|
123
|
+
this.toggleSelection = this.effect((input) => {
|
|
124
|
+
return input.pipe(switchMap(() => this.nextToggleSelection$.pipe(first(), filterMaybe(), tap((x) => {
|
|
125
|
+
this.selectAllDates(x);
|
|
126
|
+
}))));
|
|
127
|
+
});
|
|
121
128
|
// MARK: Accessors
|
|
122
129
|
this.filter$ = this.state$.pipe(map((x) => x.filter), distinctUntilChanged(), shareReplay(1));
|
|
130
|
+
this.hasConfiguredMinMaxRange$ = this.state$.pipe(map((x) => Boolean(x.minDate && x.maxDate) || Boolean(x.filter && x.filter.start && x.filter.end)), distinctUntilChanged(), shareReplay(1));
|
|
123
131
|
this.inputStart$ = this.state$.pipe(map((x) => x.inputStart), distinctUntilChanged(isSameDate), shareReplay(1));
|
|
124
132
|
this.inputEnd$ = this.state$.pipe(map((x) => x.inputEnd), distinctUntilChanged(isSameDate), shareReplay(1));
|
|
125
133
|
this.currentInputRange$ = this.state$.pipe(map(({ inputStart, inputEnd }) => ({ inputStart, inputEnd })), distinctUntilChanged((a, b) => isSameDate(a.inputStart, b.inputStart) && isSameDate(a.inputEnd, b.inputEnd)), map((x) => {
|
|
@@ -140,6 +148,16 @@ class DbxCalendarScheduleSelectionStore extends ComponentStore {
|
|
|
140
148
|
this.dateRange$ = this.currentDateRange$.pipe(filterMaybe(), shareReplay(1));
|
|
141
149
|
this.scheduleDays$ = this.state$.pipe(map((x) => x.scheduleDays), distinctUntilChanged(setsAreEquivalent), shareReplay(1));
|
|
142
150
|
this.currentSelectionValue$ = this.state$.pipe(map((x) => x.currentSelectionValue), shareReplay(1));
|
|
151
|
+
this.nextToggleSelection$ = this.hasConfiguredMinMaxRange$.pipe(switchMap((hasConfiguredMinMaxRange) => {
|
|
152
|
+
let obs;
|
|
153
|
+
if (hasConfiguredMinMaxRange) {
|
|
154
|
+
obs = this.currentSelectionValue$.pipe(map((x) => (Boolean(x) ? 'none' : 'all')));
|
|
155
|
+
}
|
|
156
|
+
else {
|
|
157
|
+
obs = this.currentSelectionValue$.pipe(map((x) => (Boolean(x) ? 'none' : undefined)));
|
|
158
|
+
}
|
|
159
|
+
return obs;
|
|
160
|
+
}), shareReplay(1));
|
|
143
161
|
this.selectionValue$ = this.currentSelectionValue$.pipe(filterMaybe(), shareReplay(1));
|
|
144
162
|
this.currentDateScheduleRangeValue$ = this.currentSelectionValue$.pipe(map((x) => x?.dateScheduleRange), distinctUntilChanged(isSameDateScheduleRange), shareReplay(1));
|
|
145
163
|
this.dateScheduleRangeValue$ = this.currentDateScheduleRangeValue$.pipe(filterMaybe(), shareReplay(1));
|
|
@@ -149,6 +167,7 @@ class DbxCalendarScheduleSelectionStore extends ComponentStore {
|
|
|
149
167
|
this.isCustomized$ = this.state$.pipe(map((x) => x.selectedIndexes.size > 0), distinctUntilChanged(), shareReplay(1));
|
|
150
168
|
// MARK: State Changes
|
|
151
169
|
this.setFilter = this.updater((state, filter) => updateStateWithFilter(state, filter));
|
|
170
|
+
this.setExclusions = this.updater((state, exclusions) => updateStateWithExclusions(state, exclusions));
|
|
152
171
|
this.setComputeSelectionResultRelativeToFilter = this.updater((state, computeSelectionResultRelativeToFilter) => updateStateWithComputeSelectionResultRelativeToFilter(state, computeSelectionResultRelativeToFilter));
|
|
153
172
|
this.clearFilter = this.updater((state) => updateStateWithFilter(state, undefined));
|
|
154
173
|
this.setTimezone = this.updater((state, timezone) => ({ ...state, timezone }));
|
|
@@ -184,14 +203,50 @@ function updateStateWithComputeSelectionResultRelativeToFilter(currentState, com
|
|
|
184
203
|
}
|
|
185
204
|
return state;
|
|
186
205
|
}
|
|
206
|
+
function updateStateWithExclusions(state, inputExclusions) {
|
|
207
|
+
let computedExclusions;
|
|
208
|
+
if (inputExclusions) {
|
|
209
|
+
const { indexFactory } = state;
|
|
210
|
+
const indexArrayFactory = dateTimingRelativeIndexArrayFactory(indexFactory);
|
|
211
|
+
computedExclusions = indexArrayFactory(inputExclusions);
|
|
212
|
+
}
|
|
213
|
+
state = { ...state, inputExclusions, computedExclusions };
|
|
214
|
+
return updateStateWithFilter(state, state.filter);
|
|
215
|
+
}
|
|
187
216
|
function updateStateWithFilter(state, inputFilter) {
|
|
217
|
+
const { computedExclusions: exclusions } = state;
|
|
188
218
|
let isEnabledFilterDay = () => true;
|
|
189
219
|
let filter = null;
|
|
190
|
-
if (inputFilter) {
|
|
191
|
-
|
|
192
|
-
|
|
220
|
+
if (inputFilter || exclusions?.length) {
|
|
221
|
+
let enabledFilter;
|
|
222
|
+
if (inputFilter) {
|
|
223
|
+
filter = copyDateScheduleDateFilterConfig(inputFilter); // copy filter
|
|
224
|
+
if (exclusions?.length) {
|
|
225
|
+
enabledFilter = {
|
|
226
|
+
...filter,
|
|
227
|
+
ex: unique(mergeArrays([filter.ex, exclusions]))
|
|
228
|
+
};
|
|
229
|
+
}
|
|
230
|
+
else {
|
|
231
|
+
enabledFilter = filter;
|
|
232
|
+
}
|
|
233
|
+
}
|
|
234
|
+
else {
|
|
235
|
+
enabledFilter = {
|
|
236
|
+
w: '89',
|
|
237
|
+
ex: exclusions
|
|
238
|
+
};
|
|
239
|
+
}
|
|
240
|
+
isEnabledFilterDay = dateScheduleDateFilter(enabledFilter);
|
|
193
241
|
}
|
|
194
242
|
state = { ...state, filter, isEnabledFilterDay };
|
|
243
|
+
// If the input filter has a start date, use that as the relative start to ensure indexes are compared the same.
|
|
244
|
+
if (filter && filter.start) {
|
|
245
|
+
const start = filter.start;
|
|
246
|
+
state.start = start;
|
|
247
|
+
state.indexFactory = dateTimingRelativeIndexFactory({ start });
|
|
248
|
+
state.indexDayOfWeek = dateBlockDayOfWeekFactory(start);
|
|
249
|
+
}
|
|
195
250
|
// attempt to re-apply the initial selection state once filter is applied
|
|
196
251
|
if (state.initialSelectionState) {
|
|
197
252
|
state = updateStateWithInitialSelectionState(state, state.initialSelectionState);
|
|
@@ -231,8 +286,10 @@ function updateStateWithChangedScheduleDays(state, change) {
|
|
|
231
286
|
}
|
|
232
287
|
}
|
|
233
288
|
function updateStateWithChangedDates(state, change) {
|
|
234
|
-
const { indexFactory, allowedDaysOfWeek, indexDayOfWeek } = state;
|
|
289
|
+
const { indexFactory, allowedDaysOfWeek, indexDayOfWeek, inputStart: currentInputStart, inputEnd: currentInputEnd } = state;
|
|
235
290
|
const { minDate, maxDate } = calendarScheduleMinAndMaxDate(state);
|
|
291
|
+
let inputStart = currentInputStart;
|
|
292
|
+
let inputEnd = currentInputEnd;
|
|
236
293
|
let selectedIndexes;
|
|
237
294
|
if (change.reset || change.selectAll != null || change.set) {
|
|
238
295
|
let set = change.set ?? [];
|
|
@@ -240,12 +297,14 @@ function updateStateWithChangedDates(state, change) {
|
|
|
240
297
|
switch (selectAll) {
|
|
241
298
|
case 'all':
|
|
242
299
|
if (minDate != null && maxDate != null) {
|
|
243
|
-
|
|
244
|
-
|
|
245
|
-
set =
|
|
300
|
+
inputStart = minDate;
|
|
301
|
+
inputEnd = maxDate;
|
|
302
|
+
set = [];
|
|
246
303
|
}
|
|
247
304
|
break;
|
|
248
305
|
case 'none':
|
|
306
|
+
inputStart = null;
|
|
307
|
+
inputEnd = null;
|
|
249
308
|
set = [];
|
|
250
309
|
break;
|
|
251
310
|
}
|
|
@@ -266,7 +325,7 @@ function updateStateWithChangedDates(state, change) {
|
|
|
266
325
|
addToSet(selectedIndexes, iterableToArray(change.remove).map(indexFactory));
|
|
267
326
|
}
|
|
268
327
|
}
|
|
269
|
-
const nextState = { ...state, selectedIndexes };
|
|
328
|
+
const nextState = { ...state, inputStart, inputEnd, selectedIndexes };
|
|
270
329
|
nextState.isEnabledDay = isEnabledDayInCalendarScheduleSelectionState(nextState);
|
|
271
330
|
// Recalculate the range and simplified to exclusions
|
|
272
331
|
const rangeAndExclusion = computeScheduleSelectionRangeAndExclusion(nextState);
|
|
@@ -282,7 +341,7 @@ function noSelectionCalendarScheduleSelectionState(state) {
|
|
|
282
341
|
return finalizeNewCalendarScheduleSelectionState({ ...state, selectedIndexes: new Set(), inputStart: null, inputEnd: null });
|
|
283
342
|
}
|
|
284
343
|
function updateStateWithChangedRange(state, change) {
|
|
285
|
-
const { inputStart: currentInputStart, inputEnd: currentInputEnd, indexFactory, minDate, maxDate
|
|
344
|
+
const { inputStart: currentInputStart, inputEnd: currentInputEnd, indexFactory, minDate, maxDate } = state;
|
|
286
345
|
let inputStart = startOfDay(change.inputStart);
|
|
287
346
|
let inputEnd = startOfDay(change.inputEnd);
|
|
288
347
|
const isValidRange = minDate != null || maxDate != null ? isDateInDateRangeFunction({ start: minDate ?? undefined, end: maxDate ?? undefined }) : () => true;
|
|
@@ -290,12 +349,13 @@ function updateStateWithChangedRange(state, change) {
|
|
|
290
349
|
return state; // if no change, return the current state.
|
|
291
350
|
}
|
|
292
351
|
// retain all indexes that are within the new range
|
|
293
|
-
const minIndex =
|
|
352
|
+
const minIndex = indexFactory(inputStart);
|
|
294
353
|
const maxIndex = indexFactory(inputEnd) + 1;
|
|
295
354
|
const currentIndexes = Array.from(state.selectedIndexes);
|
|
296
355
|
const isInCurrentRange = isIndexNumberInIndexRangeFunction({ minIndex, maxIndex });
|
|
297
356
|
const excludedIndexesInNewRange = currentIndexes.filter(isInCurrentRange);
|
|
298
|
-
const
|
|
357
|
+
const selectedIndexes = new Set(excludedIndexesInNewRange);
|
|
358
|
+
const nextState = { ...state, selectedIndexes, inputStart, inputEnd };
|
|
299
359
|
return finalizeNewCalendarScheduleSelectionState(nextState);
|
|
300
360
|
}
|
|
301
361
|
function finalizeNewCalendarScheduleSelectionState(nextState) {
|
|
@@ -546,10 +606,10 @@ class DbxScheduleSelectionCalendarDateRangeComponent {
|
|
|
546
606
|
}
|
|
547
607
|
}
|
|
548
608
|
DbxScheduleSelectionCalendarDateRangeComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: DbxScheduleSelectionCalendarDateRangeComponent, deps: [{ token: i1.DbxCalendarStore }, { token: DbxCalendarScheduleSelectionStore }, { token: MAT_FORM_FIELD_DEFAULT_OPTIONS }], target: i0.ɵɵFactoryTarget.Component });
|
|
549
|
-
DbxScheduleSelectionCalendarDateRangeComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: DbxScheduleSelectionCalendarDateRangeComponent, selector: "dbx-schedule-selection-calendar-date-range", inputs: { required: "required", label: "label", hint: "hint", disabled: "disabled", showCustomize: "showCustomize" }, ngImport: i0, template: "<mat-form-field class=\"dbx-schedule-selection-calendar-date-range-field\">\n <mat-label *ngIf=\"label\">{{ label }}</mat-label>\n <div *ngIf=\"showCustomize && (isCustomized$ | async)\" class=\"date-range-field-customized\">\n <span class=\"dbx-accent-bg date-range-field-customized-text\">Custom</span>\n </div>\n <dbx-button-spacer></dbx-button-spacer>\n <mat-datepicker-toggle matIconSuffix [for]=\"picker\"></mat-datepicker-toggle>\n <dbx-button-spacer></dbx-button-spacer>\n <mat-date-range-input [required]=\"required\" [min]=\"minDate$ | async\" [max]=\"maxDate$ | async\" [formGroup]=\"range\" [rangePicker]=\"picker\">\n <input matStartDate formControlName=\"start\" placeholder=\"Start date\" />\n <input matEndDate formControlName=\"end\" placeholder=\"End date\" />\n </mat-date-range-input>\n <div *ngIf=\"showCustomize\">\n <dbx-button-spacer></dbx-button-spacer>\n <ng-content select=\"[customizeButton]\"></ng-content>\n </div>\n <mat-date-range-picker #picker (opened)=\"pickerOpened()\" (closed)=\"pickerClosed()\"></mat-date-range-picker>\n <mat-error *ngIf=\"range.controls.start.hasError('matStartDateInvalid')\">Invalid start date</mat-error>\n <mat-error *ngIf=\"range.controls.end.hasError('matEndDateInvalid')\">Invalid end date</mat-error>\n</mat-form-field>\n", dependencies: [{ kind: "directive", type: i3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i5.MatError, selector: "mat-error", inputs: ["id"] }, { kind: "component", type: i5.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i5.MatLabel, selector: "mat-label" }, { kind: "directive", type: i1$1.DbxButtonSpacerDirective, selector: "dbx-button-spacer,[dbxButtonSpacer]" }, { kind: "component", type: i7.MatDatepickerToggle, selector: "mat-datepicker-toggle", inputs: ["for", "tabIndex", "aria-label", "disabled", "disableRipple"], exportAs: ["matDatepickerToggle"] }, { kind: "component", type: i7.MatDateRangeInput, selector: "mat-date-range-input", inputs: ["rangePicker", "required", "dateFilter", "min", "max", "disabled", "separator", "comparisonStart", "comparisonEnd"], exportAs: ["matDateRangeInput"] }, { kind: "directive", type: i7.MatStartDate, selector: "input[matStartDate]", inputs: ["errorStateMatcher"], outputs: ["dateChange", "dateInput"] }, { kind: "directive", type: i7.MatEndDate, selector: "input[matEndDate]", inputs: ["errorStateMatcher"], outputs: ["dateChange", "dateInput"] }, { kind: "component", type: i7.MatDateRangePicker, selector: "mat-date-range-picker", exportAs: ["matDateRangePicker"] }, { kind: "pipe", type: i3$1.AsyncPipe, name: "async" }] });
|
|
609
|
+
DbxScheduleSelectionCalendarDateRangeComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: DbxScheduleSelectionCalendarDateRangeComponent, selector: "dbx-schedule-selection-calendar-date-range", inputs: { required: "required", label: "label", hint: "hint", disabled: "disabled", showCustomize: "showCustomize" }, ngImport: i0, template: "<mat-form-field class=\"dbx-schedule-selection-calendar-date-range-field\">\n <mat-label *ngIf=\"label\">{{ label }}</mat-label>\n <div *ngIf=\"showCustomize && (isCustomized$ | async)\" class=\"date-range-field-customized\">\n <span class=\"dbx-accent-bg date-range-field-customized-text\">Custom</span>\n </div>\n <dbx-button-spacer></dbx-button-spacer>\n <mat-datepicker-toggle matIconSuffix [for]=\"picker\"></mat-datepicker-toggle>\n <dbx-button-spacer></dbx-button-spacer>\n <mat-date-range-input [required]=\"required\" [min]=\"minDate$ | async\" [max]=\"maxDate$ | async\" [formGroup]=\"range\" [rangePicker]=\"picker\">\n <input matStartDate formControlName=\"start\" placeholder=\"Start date\" />\n <input matEndDate formControlName=\"end\" placeholder=\"End date\" />\n </mat-date-range-input>\n <div *ngIf=\"showCustomize\">\n <dbx-button-spacer></dbx-button-spacer>\n <ng-content select=\"[customizeButton]\"></ng-content>\n </div>\n <mat-date-range-picker #picker (opened)=\"pickerOpened()\" (closed)=\"pickerClosed()\"></mat-date-range-picker>\n <mat-error *ngIf=\"range.controls.start.hasError('matStartDateInvalid')\">Invalid start date</mat-error>\n <mat-error *ngIf=\"range.controls.end.hasError('matEndDateInvalid')\">Invalid end date</mat-error>\n <mat-hint>{{ hint }}</mat-hint>\n</mat-form-field>\n", dependencies: [{ kind: "directive", type: i3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i5.MatError, selector: "mat-error", inputs: ["id"] }, { kind: "component", type: i5.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i5.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i5.MatLabel, selector: "mat-label" }, { kind: "directive", type: i1$1.DbxButtonSpacerDirective, selector: "dbx-button-spacer,[dbxButtonSpacer]" }, { kind: "component", type: i7.MatDatepickerToggle, selector: "mat-datepicker-toggle", inputs: ["for", "tabIndex", "aria-label", "disabled", "disableRipple"], exportAs: ["matDatepickerToggle"] }, { kind: "component", type: i7.MatDateRangeInput, selector: "mat-date-range-input", inputs: ["rangePicker", "required", "dateFilter", "min", "max", "disabled", "separator", "comparisonStart", "comparisonEnd"], exportAs: ["matDateRangeInput"] }, { kind: "directive", type: i7.MatStartDate, selector: "input[matStartDate]", inputs: ["errorStateMatcher"], outputs: ["dateChange", "dateInput"] }, { kind: "directive", type: i7.MatEndDate, selector: "input[matEndDate]", inputs: ["errorStateMatcher"], outputs: ["dateChange", "dateInput"] }, { kind: "component", type: i7.MatDateRangePicker, selector: "mat-date-range-picker", exportAs: ["matDateRangePicker"] }, { kind: "pipe", type: i3$1.AsyncPipe, name: "async" }] });
|
|
550
610
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: DbxScheduleSelectionCalendarDateRangeComponent, decorators: [{
|
|
551
611
|
type: Component,
|
|
552
|
-
args: [{ selector: 'dbx-schedule-selection-calendar-date-range', template: "<mat-form-field class=\"dbx-schedule-selection-calendar-date-range-field\">\n <mat-label *ngIf=\"label\">{{ label }}</mat-label>\n <div *ngIf=\"showCustomize && (isCustomized$ | async)\" class=\"date-range-field-customized\">\n <span class=\"dbx-accent-bg date-range-field-customized-text\">Custom</span>\n </div>\n <dbx-button-spacer></dbx-button-spacer>\n <mat-datepicker-toggle matIconSuffix [for]=\"picker\"></mat-datepicker-toggle>\n <dbx-button-spacer></dbx-button-spacer>\n <mat-date-range-input [required]=\"required\" [min]=\"minDate$ | async\" [max]=\"maxDate$ | async\" [formGroup]=\"range\" [rangePicker]=\"picker\">\n <input matStartDate formControlName=\"start\" placeholder=\"Start date\" />\n <input matEndDate formControlName=\"end\" placeholder=\"End date\" />\n </mat-date-range-input>\n <div *ngIf=\"showCustomize\">\n <dbx-button-spacer></dbx-button-spacer>\n <ng-content select=\"[customizeButton]\"></ng-content>\n </div>\n <mat-date-range-picker #picker (opened)=\"pickerOpened()\" (closed)=\"pickerClosed()\"></mat-date-range-picker>\n <mat-error *ngIf=\"range.controls.start.hasError('matStartDateInvalid')\">Invalid start date</mat-error>\n <mat-error *ngIf=\"range.controls.end.hasError('matEndDateInvalid')\">Invalid end date</mat-error>\n</mat-form-field>\n" }]
|
|
612
|
+
args: [{ selector: 'dbx-schedule-selection-calendar-date-range', template: "<mat-form-field class=\"dbx-schedule-selection-calendar-date-range-field\">\n <mat-label *ngIf=\"label\">{{ label }}</mat-label>\n <div *ngIf=\"showCustomize && (isCustomized$ | async)\" class=\"date-range-field-customized\">\n <span class=\"dbx-accent-bg date-range-field-customized-text\">Custom</span>\n </div>\n <dbx-button-spacer></dbx-button-spacer>\n <mat-datepicker-toggle matIconSuffix [for]=\"picker\"></mat-datepicker-toggle>\n <dbx-button-spacer></dbx-button-spacer>\n <mat-date-range-input [required]=\"required\" [min]=\"minDate$ | async\" [max]=\"maxDate$ | async\" [formGroup]=\"range\" [rangePicker]=\"picker\">\n <input matStartDate formControlName=\"start\" placeholder=\"Start date\" />\n <input matEndDate formControlName=\"end\" placeholder=\"End date\" />\n </mat-date-range-input>\n <div *ngIf=\"showCustomize\">\n <dbx-button-spacer></dbx-button-spacer>\n <ng-content select=\"[customizeButton]\"></ng-content>\n </div>\n <mat-date-range-picker #picker (opened)=\"pickerOpened()\" (closed)=\"pickerClosed()\"></mat-date-range-picker>\n <mat-error *ngIf=\"range.controls.start.hasError('matStartDateInvalid')\">Invalid start date</mat-error>\n <mat-error *ngIf=\"range.controls.end.hasError('matEndDateInvalid')\">Invalid end date</mat-error>\n <mat-hint>{{ hint }}</mat-hint>\n</mat-form-field>\n" }]
|
|
553
613
|
}], ctorParameters: function () { return [{ type: i1.DbxCalendarStore }, { type: DbxCalendarScheduleSelectionStore }, { type: undefined, decorators: [{
|
|
554
614
|
type: Inject,
|
|
555
615
|
args: [MAT_FORM_FIELD_DEFAULT_OPTIONS]
|
|
@@ -761,6 +821,53 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImpo
|
|
|
761
821
|
type: Input
|
|
762
822
|
}] } });
|
|
763
823
|
|
|
824
|
+
/**
|
|
825
|
+
* Toggle button for selecting and clearing the current selection.
|
|
826
|
+
*/
|
|
827
|
+
class DbxScheduleSelectionCalendarSelectionToggleButtonComponent {
|
|
828
|
+
constructor(popoverService, dbxCalendarScheduleSelectionStore, injector) {
|
|
829
|
+
this.popoverService = popoverService;
|
|
830
|
+
this.dbxCalendarScheduleSelectionStore = dbxCalendarScheduleSelectionStore;
|
|
831
|
+
this.injector = injector;
|
|
832
|
+
this.disableButton$ = this.dbxCalendarScheduleSelectionStore.nextToggleSelection$.pipe(map((x) => !x));
|
|
833
|
+
this.buttonDisplay$ = this.dbxCalendarScheduleSelectionStore.nextToggleSelection$.pipe(map((x) => {
|
|
834
|
+
let buttonDisplay;
|
|
835
|
+
switch (x) {
|
|
836
|
+
case 'all':
|
|
837
|
+
buttonDisplay = {
|
|
838
|
+
icon: 'select_all',
|
|
839
|
+
text: 'Select All'
|
|
840
|
+
};
|
|
841
|
+
break;
|
|
842
|
+
default:
|
|
843
|
+
case 'none':
|
|
844
|
+
buttonDisplay = {
|
|
845
|
+
icon: 'clear',
|
|
846
|
+
text: 'Clear Selection'
|
|
847
|
+
};
|
|
848
|
+
break;
|
|
849
|
+
}
|
|
850
|
+
return buttonDisplay;
|
|
851
|
+
}), shareReplay(1));
|
|
852
|
+
}
|
|
853
|
+
toggleSelection() {
|
|
854
|
+
this.dbxCalendarScheduleSelectionStore.toggleSelection();
|
|
855
|
+
}
|
|
856
|
+
}
|
|
857
|
+
DbxScheduleSelectionCalendarSelectionToggleButtonComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: DbxScheduleSelectionCalendarSelectionToggleButtonComponent, deps: [{ token: i1$1.DbxPopoverService }, { token: DbxCalendarScheduleSelectionStore }, { token: i0.Injector }], target: i0.ɵɵFactoryTarget.Component });
|
|
858
|
+
DbxScheduleSelectionCalendarSelectionToggleButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: DbxScheduleSelectionCalendarSelectionToggleButtonComponent, selector: "dbx-schedule-selection-calendar-selection-toggle-button", ngImport: i0, template: `
|
|
859
|
+
<dbx-button [disabled]="disableButton$ | async" [buttonDisplay]="buttonDisplay$ | async" [raised]="true" (buttonClick)="toggleSelection()"></dbx-button>
|
|
860
|
+
`, isInline: true, dependencies: [{ kind: "component", type: i1$1.DbxButtonComponent, selector: "dbx-button", inputs: ["type", "raised", "stroked", "flat", "iconOnly", "color", "customButtonColor", "customTextColor", "customSpinnerColor"] }, { kind: "pipe", type: i3$1.AsyncPipe, name: "async" }] });
|
|
861
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: DbxScheduleSelectionCalendarSelectionToggleButtonComponent, decorators: [{
|
|
862
|
+
type: Component,
|
|
863
|
+
args: [{
|
|
864
|
+
selector: 'dbx-schedule-selection-calendar-selection-toggle-button',
|
|
865
|
+
template: `
|
|
866
|
+
<dbx-button [disabled]="disableButton$ | async" [buttonDisplay]="buttonDisplay$ | async" [raised]="true" (buttonClick)="toggleSelection()"></dbx-button>
|
|
867
|
+
`
|
|
868
|
+
}]
|
|
869
|
+
}], ctorParameters: function () { return [{ type: i1$1.DbxPopoverService }, { type: DbxCalendarScheduleSelectionStore }, { type: i0.Injector }]; } });
|
|
870
|
+
|
|
764
871
|
class DbxScheduleSelectionCalendarComponent {
|
|
765
872
|
constructor(calendarStore, dbxCalendarScheduleSelectionStore) {
|
|
766
873
|
this.calendarStore = calendarStore;
|
|
@@ -814,10 +921,10 @@ class DbxScheduleSelectionCalendarComponent {
|
|
|
814
921
|
}
|
|
815
922
|
}
|
|
816
923
|
DbxScheduleSelectionCalendarComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: DbxScheduleSelectionCalendarComponent, deps: [{ token: i1.DbxCalendarStore }, { token: DbxCalendarScheduleSelectionStore }], target: i0.ɵɵFactoryTarget.Component });
|
|
817
|
-
DbxScheduleSelectionCalendarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: DbxScheduleSelectionCalendarComponent, selector: "dbx-schedule-selection-calendar", outputs: { clickEvent: "clickEvent" }, providers: [DbxCalendarStore], ngImport: i0, template: "<dbx-calendar-base class=\"dbx-schedule-selection-calendar\">\n <ng-container controls>\n <dbx-schedule-selection-calendar-date-popover-button></dbx-schedule-selection-calendar-date-popover-button>\n </ng-container>\n <div class=\"dbx-calendar-content dbx-calendar-content-month\">\n <mwl-calendar-month-view [refresh]=\"refresh$\" [viewDate]=\"(viewDate$ | async)!\" [events]=\"(events$ | async)!\" (dayClicked)=\"dayClicked($event.day)\" (eventClicked)=\"eventClicked('Clicked', $event.event)\" (beforeViewRender)=\"beforeMonthViewRender($event)\" [cellTemplate]=\"monthDayCellTemplate\"></mwl-calendar-month-view>\n </div>\n</dbx-calendar-base>\n\n<!-- Cell -->\n<ng-template #monthDayCellTemplate let-day=\"day\" let-locale=\"locale\">\n <div class=\"cal-cell-top\">\n <span class=\"cal-day-badge\" *ngIf=\"day.badgeTotal > 0\">{{ day.badgeTotal }}</span>\n <span class=\"cal-day-number\">{{ day.date | calendarDate: 'monthViewDayNumber':locale }}</span>\n </div>\n <dbx-schedule-selection-calendar-cell [day]=\"day\"></dbx-schedule-selection-calendar-cell>\n</ng-template>\n", dependencies: [{ kind: "component", type: i1.DbxCalendarBaseComponent, selector: "dbx-calendar-base" }, { kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type:
|
|
924
|
+
DbxScheduleSelectionCalendarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: DbxScheduleSelectionCalendarComponent, selector: "dbx-schedule-selection-calendar", outputs: { clickEvent: "clickEvent" }, providers: [DbxCalendarStore], ngImport: i0, template: "<dbx-calendar-base class=\"dbx-schedule-selection-calendar\">\n <ng-container controls>\n <dbx-schedule-selection-calendar-selection-toggle-button></dbx-schedule-selection-calendar-selection-toggle-button>\n <dbx-button-spacer></dbx-button-spacer>\n <dbx-schedule-selection-calendar-date-popover-button></dbx-schedule-selection-calendar-date-popover-button>\n </ng-container>\n <div class=\"dbx-calendar-content dbx-calendar-content-month\">\n <mwl-calendar-month-view [refresh]=\"refresh$\" [viewDate]=\"(viewDate$ | async)!\" [events]=\"(events$ | async)!\" (dayClicked)=\"dayClicked($event.day)\" (eventClicked)=\"eventClicked('Clicked', $event.event)\" (beforeViewRender)=\"beforeMonthViewRender($event)\" [cellTemplate]=\"monthDayCellTemplate\"></mwl-calendar-month-view>\n </div>\n</dbx-calendar-base>\n\n<!-- Cell -->\n<ng-template #monthDayCellTemplate let-day=\"day\" let-locale=\"locale\">\n <div class=\"cal-cell-top\">\n <span class=\"cal-day-badge\" *ngIf=\"day.badgeTotal > 0\">{{ day.badgeTotal }}</span>\n <span class=\"cal-day-number\">{{ day.date | calendarDate: 'monthViewDayNumber':locale }}</span>\n </div>\n <dbx-schedule-selection-calendar-cell [day]=\"day\"></dbx-schedule-selection-calendar-cell>\n</ng-template>\n", dependencies: [{ kind: "component", type: i1.DbxCalendarBaseComponent, selector: "dbx-calendar-base" }, { kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.DbxButtonSpacerDirective, selector: "dbx-button-spacer,[dbxButtonSpacer]" }, { kind: "component", type: i5$1.CalendarMonthViewComponent, selector: "mwl-calendar-month-view", inputs: ["viewDate", "events", "excludeDays", "activeDayIsOpen", "activeDay", "refresh", "locale", "tooltipPlacement", "tooltipTemplate", "tooltipAppendToBody", "tooltipDelay", "weekStartsOn", "headerTemplate", "cellTemplate", "openDayEventsTemplate", "eventTitleTemplate", "eventActionsTemplate", "weekendDays"], outputs: ["beforeViewRender", "dayClicked", "eventClicked", "columnHeaderClicked", "eventTimesChanged"] }, { kind: "component", type: DbxScheduleSelectionCalendarDatePopoverButtonComponent, selector: "dbx-schedule-selection-calendar-date-popover-button" }, { kind: "component", type: DbxScheduleSelectionCalendarCellComponent, selector: "dbx-schedule-selection-calendar-cell", inputs: ["day"] }, { kind: "component", type: DbxScheduleSelectionCalendarSelectionToggleButtonComponent, selector: "dbx-schedule-selection-calendar-selection-toggle-button" }, { kind: "pipe", type: i3$1.AsyncPipe, name: "async" }, { kind: "pipe", type: i5$1.ɵCalendarDatePipe, name: "calendarDate" }] });
|
|
818
925
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: DbxScheduleSelectionCalendarComponent, decorators: [{
|
|
819
926
|
type: Component,
|
|
820
|
-
args: [{ selector: 'dbx-schedule-selection-calendar', providers: [DbxCalendarStore], template: "<dbx-calendar-base class=\"dbx-schedule-selection-calendar\">\n <ng-container controls>\n <dbx-schedule-selection-calendar-date-popover-button></dbx-schedule-selection-calendar-date-popover-button>\n </ng-container>\n <div class=\"dbx-calendar-content dbx-calendar-content-month\">\n <mwl-calendar-month-view [refresh]=\"refresh$\" [viewDate]=\"(viewDate$ | async)!\" [events]=\"(events$ | async)!\" (dayClicked)=\"dayClicked($event.day)\" (eventClicked)=\"eventClicked('Clicked', $event.event)\" (beforeViewRender)=\"beforeMonthViewRender($event)\" [cellTemplate]=\"monthDayCellTemplate\"></mwl-calendar-month-view>\n </div>\n</dbx-calendar-base>\n\n<!-- Cell -->\n<ng-template #monthDayCellTemplate let-day=\"day\" let-locale=\"locale\">\n <div class=\"cal-cell-top\">\n <span class=\"cal-day-badge\" *ngIf=\"day.badgeTotal > 0\">{{ day.badgeTotal }}</span>\n <span class=\"cal-day-number\">{{ day.date | calendarDate: 'monthViewDayNumber':locale }}</span>\n </div>\n <dbx-schedule-selection-calendar-cell [day]=\"day\"></dbx-schedule-selection-calendar-cell>\n</ng-template>\n" }]
|
|
927
|
+
args: [{ selector: 'dbx-schedule-selection-calendar', providers: [DbxCalendarStore], template: "<dbx-calendar-base class=\"dbx-schedule-selection-calendar\">\n <ng-container controls>\n <dbx-schedule-selection-calendar-selection-toggle-button></dbx-schedule-selection-calendar-selection-toggle-button>\n <dbx-button-spacer></dbx-button-spacer>\n <dbx-schedule-selection-calendar-date-popover-button></dbx-schedule-selection-calendar-date-popover-button>\n </ng-container>\n <div class=\"dbx-calendar-content dbx-calendar-content-month\">\n <mwl-calendar-month-view [refresh]=\"refresh$\" [viewDate]=\"(viewDate$ | async)!\" [events]=\"(events$ | async)!\" (dayClicked)=\"dayClicked($event.day)\" (eventClicked)=\"eventClicked('Clicked', $event.event)\" (beforeViewRender)=\"beforeMonthViewRender($event)\" [cellTemplate]=\"monthDayCellTemplate\"></mwl-calendar-month-view>\n </div>\n</dbx-calendar-base>\n\n<!-- Cell -->\n<ng-template #monthDayCellTemplate let-day=\"day\" let-locale=\"locale\">\n <div class=\"cal-cell-top\">\n <span class=\"cal-day-badge\" *ngIf=\"day.badgeTotal > 0\">{{ day.badgeTotal }}</span>\n <span class=\"cal-day-number\">{{ day.date | calendarDate: 'monthViewDayNumber':locale }}</span>\n </div>\n <dbx-schedule-selection-calendar-cell [day]=\"day\"></dbx-schedule-selection-calendar-cell>\n</ng-template>\n" }]
|
|
821
928
|
}], ctorParameters: function () { return [{ type: i1.DbxCalendarStore }, { type: DbxCalendarScheduleSelectionStore }]; }, propDecorators: { clickEvent: [{
|
|
822
929
|
type: Output
|
|
823
930
|
}] } });
|
|
@@ -889,6 +996,7 @@ class DbxFormCalendarDateScheduleRangeFieldComponent extends FieldType {
|
|
|
889
996
|
this._syncSub = new SubscriptionObject();
|
|
890
997
|
this._valueSub = new SubscriptionObject();
|
|
891
998
|
this._filterSub = new SubscriptionObject();
|
|
999
|
+
this._exclusionsSub = new SubscriptionObject();
|
|
892
1000
|
this._formControlObs = new BehaviorSubject(undefined);
|
|
893
1001
|
this.formControl$ = this._formControlObs.pipe(filterMaybe());
|
|
894
1002
|
this.value$ = this.formControl$.pipe(switchMap((control) => control.valueChanges.pipe(startWith(control.value))), shareReplay(1));
|
|
@@ -914,6 +1022,9 @@ class DbxFormCalendarDateScheduleRangeFieldComponent extends FieldType {
|
|
|
914
1022
|
get filter() {
|
|
915
1023
|
return this.props.filter;
|
|
916
1024
|
}
|
|
1025
|
+
get exclusions() {
|
|
1026
|
+
return this.props.exclusions;
|
|
1027
|
+
}
|
|
917
1028
|
get initialSelectionState() {
|
|
918
1029
|
return this.props.initialSelectionState;
|
|
919
1030
|
}
|
|
@@ -928,23 +1039,28 @@ class DbxFormCalendarDateScheduleRangeFieldComponent extends FieldType {
|
|
|
928
1039
|
this._valueSub.subscription = this.dbxCalendarScheduleSelectionStore.currentDateScheduleRangeValue$.subscribe((x) => {
|
|
929
1040
|
this.formControl.setValue(x);
|
|
930
1041
|
});
|
|
931
|
-
const filter = this
|
|
1042
|
+
const { filter, exclusions } = this;
|
|
932
1043
|
if (filter != null) {
|
|
933
1044
|
this._filterSub.subscription = this.dbxCalendarScheduleSelectionStore.setFilter(asObservable(filter));
|
|
934
1045
|
}
|
|
1046
|
+
if (exclusions != null) {
|
|
1047
|
+
this._exclusionsSub.subscription = this.dbxCalendarScheduleSelectionStore.setExclusions(asObservable(exclusions));
|
|
1048
|
+
}
|
|
935
1049
|
if (this.initialSelectionState !== undefined) {
|
|
936
1050
|
this.dbxCalendarScheduleSelectionStore.setInitialSelectionState(this.initialSelectionState);
|
|
937
1051
|
}
|
|
938
1052
|
if (this.computeSelectionResultRelativeToFilter != null) {
|
|
939
1053
|
this.dbxCalendarScheduleSelectionStore.setComputeSelectionResultRelativeToFilter(this.computeSelectionResultRelativeToFilter);
|
|
940
1054
|
}
|
|
1055
|
+
// TODO: Also add ability to set min/max dates independent of the filter
|
|
941
1056
|
}
|
|
942
1057
|
ngOnDestroy() {
|
|
943
1058
|
super.ngOnDestroy();
|
|
944
1059
|
this._syncSub.destroy();
|
|
945
1060
|
this._valueSub.destroy();
|
|
946
|
-
this._formControlObs.complete();
|
|
947
1061
|
this._filterSub.destroy();
|
|
1062
|
+
this._exclusionsSub.destroy();
|
|
1063
|
+
this._formControlObs.complete();
|
|
948
1064
|
}
|
|
949
1065
|
}
|
|
950
1066
|
DbxFormCalendarDateScheduleRangeFieldComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: DbxFormCalendarDateScheduleRangeFieldComponent, deps: [{ token: i1$1.CompactContextStore, optional: true }, { token: DbxCalendarScheduleSelectionStore }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component });
|
|
@@ -983,7 +1099,8 @@ const declarations = [
|
|
|
983
1099
|
DbxScheduleSelectionCalendarDatePopoverContentComponent,
|
|
984
1100
|
DbxCalendarScheduleSelectionStoreInjectionBlockDirective,
|
|
985
1101
|
DbxScheduleSelectionCalendarDateDialogComponent,
|
|
986
|
-
DbxScheduleSelectionCalendarDateDialogButtonComponent
|
|
1102
|
+
DbxScheduleSelectionCalendarDateDialogButtonComponent,
|
|
1103
|
+
DbxScheduleSelectionCalendarSelectionToggleButtonComponent
|
|
987
1104
|
];
|
|
988
1105
|
class DbxFormCalendarModule {
|
|
989
1106
|
}
|
|
@@ -1000,7 +1117,8 @@ DbxFormCalendarModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", v
|
|
|
1000
1117
|
DbxScheduleSelectionCalendarDatePopoverContentComponent,
|
|
1001
1118
|
DbxCalendarScheduleSelectionStoreInjectionBlockDirective,
|
|
1002
1119
|
DbxScheduleSelectionCalendarDateDialogComponent,
|
|
1003
|
-
DbxScheduleSelectionCalendarDateDialogButtonComponent
|
|
1120
|
+
DbxScheduleSelectionCalendarDateDialogButtonComponent,
|
|
1121
|
+
DbxScheduleSelectionCalendarSelectionToggleButtonComponent], imports: [
|
|
1004
1122
|
//
|
|
1005
1123
|
DbxActionModule,
|
|
1006
1124
|
DbxFormModule,
|
|
@@ -1032,7 +1150,8 @@ DbxFormCalendarModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", v
|
|
|
1032
1150
|
DbxScheduleSelectionCalendarDatePopoverContentComponent,
|
|
1033
1151
|
DbxCalendarScheduleSelectionStoreInjectionBlockDirective,
|
|
1034
1152
|
DbxScheduleSelectionCalendarDateDialogComponent,
|
|
1035
|
-
DbxScheduleSelectionCalendarDateDialogButtonComponent
|
|
1153
|
+
DbxScheduleSelectionCalendarDateDialogButtonComponent,
|
|
1154
|
+
DbxScheduleSelectionCalendarSelectionToggleButtonComponent] });
|
|
1036
1155
|
DbxFormCalendarModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: DbxFormCalendarModule, imports: [
|
|
1037
1156
|
//
|
|
1038
1157
|
DbxActionModule,
|
|
@@ -1132,5 +1251,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImpo
|
|
|
1132
1251
|
* Generated bundle index. Do not edit.
|
|
1133
1252
|
*/
|
|
1134
1253
|
|
|
1135
|
-
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 };
|
|
1254
|
+
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, DbxScheduleSelectionCalendarSelectionToggleButtonComponent, calendarScheduleMaxDate, calendarScheduleMinAndMaxDate, calendarScheduleMinDate, computeCalendarScheduleSelectionDateBlockRange, computeCalendarScheduleSelectionRange, computeScheduleSelectionRangeAndExclusion, computeScheduleSelectionValue, dateScheduleRangeField, dbxScheduleSelectionCalendarDateDaysFormDayFields, dbxScheduleSelectionCalendarDateDaysFormFields, defaultCalendarScheduleSelectionCellContentFactory, finalizeNewCalendarScheduleSelectionState, initialCalendarScheduleSelectionState, isEnabledDayInCalendarScheduleSelectionState, noSelectionCalendarScheduleSelectionState, provideCalendarScheduleSelectionStoreIfParentIsUnavailable, updateStateWithChangedDates, updateStateWithChangedRange, updateStateWithChangedScheduleDays, updateStateWithComputeSelectionResultRelativeToFilter, updateStateWithDateScheduleRangeValue, updateStateWithExclusions, updateStateWithFilter, updateStateWithInitialSelectionState };
|
|
1136
1255
|
//# sourceMappingURL=dereekb-dbx-form-calendar.mjs.map
|