@dereekb/dbx-form 9.24.0 → 9.24.2

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.
Files changed (26) hide show
  1. package/calendar/lib/calendar.schedule.selection.dialog.button.component.d.ts +4 -1
  2. package/calendar/lib/calendar.schedule.selection.dialog.component.d.ts +11 -4
  3. package/calendar/lib/field/schedule/calendar.schedule.field.component.d.ts +6 -1
  4. package/esm2020/calendar/lib/calendar.schedule.selection.dialog.button.component.mjs +5 -3
  5. package/esm2020/calendar/lib/calendar.schedule.selection.dialog.component.mjs +22 -7
  6. package/esm2020/calendar/lib/field/schedule/calendar.schedule.field.component.mjs +7 -4
  7. package/esm2020/calendar/lib/field/schedule/calendar.schedule.field.mjs +7 -4
  8. package/esm2020/lib/formly/field/selection/pickable/pickable.chip.field.component.mjs +1 -1
  9. package/esm2020/lib/formly/field/selection/pickable/pickable.list.field.component.mjs +2 -2
  10. package/esm2020/lib/formly/field/selection/searchable/searchable.chip.field.component.mjs +1 -1
  11. package/esm2020/lib/formly/field/selection/searchable/searchable.text.field.component.mjs +1 -1
  12. package/esm2020/lib/formly/field/selection/sourceselect/sourceselect.field.component.mjs +1 -1
  13. package/esm2020/lib/formly/field/value/date/fixeddaterange.field.component.mjs +25 -12
  14. package/esm2020/lib/formly/field/wrapper/working.wrapper.component.mjs +1 -1
  15. package/fesm2015/dereekb-dbx-form-calendar.mjs +38 -16
  16. package/fesm2015/dereekb-dbx-form-calendar.mjs.map +1 -1
  17. package/fesm2015/dereekb-dbx-form.mjs +32 -17
  18. package/fesm2015/dereekb-dbx-form.mjs.map +1 -1
  19. package/fesm2020/dereekb-dbx-form-calendar.mjs +38 -16
  20. package/fesm2020/dereekb-dbx-form-calendar.mjs.map +1 -1
  21. package/fesm2020/dereekb-dbx-form.mjs +30 -17
  22. package/fesm2020/dereekb-dbx-form.mjs.map +1 -1
  23. package/lib/extension/calendar/_calendar.scss +14 -0
  24. package/lib/formly/field/value/date/fixeddaterange.field.component.d.ts +9 -3
  25. package/mapbox/package.json +4 -4
  26. package/package.json +4 -4
@@ -3,12 +3,12 @@ import { formlyField, propsAndConfigForFieldConfig, flexLayoutWrapper, toggleFie
3
3
  import * as i1$1 from '@dereekb/dbx-web';
4
4
  import { AbstractPopoverDirective, AbstractDialogDirective, DbxActionModule, DbxButtonModule, DbxDialogInteractionModule, DbxPopoverInteractionModule, DbxTextModule } from '@dereekb/dbx-web';
5
5
  import * as i0 from '@angular/core';
6
- import { Injectable, SkipSelf, Directive, Injector, Optional, Component, Inject, Input, ElementRef, ViewChild, ChangeDetectionStrategy, EventEmitter, Output, NgModule } from '@angular/core';
6
+ import { Injectable, SkipSelf, Directive, Injector, Optional, Component, Inject, Input, ElementRef, ViewChild, ChangeDetectionStrategy, EventEmitter, Output, InjectionToken, NgModule } from '@angular/core';
7
7
  import { FieldType } from '@ngx-formly/material';
8
8
  import { switchMap, first, tap, map, distinctUntilChanged, shareReplay, combineLatestWith, BehaviorSubject, of, startWith, filter, throttleTime } from 'rxjs';
9
9
  import { filterMaybe, SubscriptionObject, asObservable } from '@dereekb/rxjs';
10
10
  import { DateScheduleDayCode, expandDateScheduleDayCodesToDayOfWeekSet, dateTimingRelativeIndexFactory, dateBlockDayOfWeekFactory, findMaxDate, findMinDate, isSameDateRange, isSameDateDay, isSameDate, isSameDateScheduleRange, dateTimingRelativeIndexArrayFactory, isInfiniteDateRange, copyDateScheduleDateFilterConfig, dateScheduleDateFilter, dateTimezoneUtcNormal, expandDateScheduleDayCodes, isDateInDateRangeFunction, isDateWithinDateBlockRangeFunction, copyHoursAndMinutesFromDate, dateScheduleEncodedWeek, dateBlockTimingDateFactory, enabledDaysFromDateScheduleDayCodes, dateScheduleDayCodesFromEnabledDays, formatToMonthDayString } from '@dereekb/date';
11
- import { setsAreEquivalent, unique, mergeArrays, iterableToArray, toggleInSet, addToSet, isIndexNumberInIndexRangeFunction, range, minAndMaxNumber, getDaysOfWeekNames } from '@dereekb/util';
11
+ import { setsAreEquivalent, unique, mergeArrays, iterableToArray, toggleInSet, addToSet, isIndexNumberInIndexRangeFunction, range, minAndMaxNumber, getDaysOfWeekNames, mergeObjects, KeyValueTypleValueFilter } from '@dereekb/util';
12
12
  import { ComponentStore } from '@ngrx/component-store';
13
13
  import { startOfDay, endOfDay, isBefore } from 'date-fns';
14
14
  import * as i1 from '@dereekb/dbx-web/calendar';
@@ -37,19 +37,22 @@ import { MatButtonToggleModule } from '@angular/material/button-toggle';
37
37
  import { FlexLayoutModule } from '@angular/flex-layout';
38
38
 
39
39
  function dateScheduleRangeField(config = {}) {
40
- const { key = 'schedule', filter, timezone, initialSelectionState, computeSelectionResultRelativeToFilter, exclusions, minMaxDateRange, cellContentFactory } = config;
40
+ const { key = 'schedule', appearance, hideCustomize, filter, timezone, initialSelectionState, computeSelectionResultRelativeToFilter, exclusions, minMaxDateRange, cellContentFactory, closeDialogConfig } = config;
41
41
  const fieldConfig = {
42
42
  ...formlyField({
43
43
  key,
44
44
  type: 'date-schedule-range',
45
45
  ...propsAndConfigForFieldConfig(config, {
46
46
  label: config.label ?? 'Schedule',
47
+ appearance,
48
+ hideCustomize,
49
+ timezone,
47
50
  minMaxDateRange,
48
51
  filter,
49
- timezone,
52
+ exclusions,
53
+ closeDialogConfig,
50
54
  computeSelectionResultRelativeToFilter,
51
55
  initialSelectionState,
52
- exclusions,
53
56
  cellContentFactory
54
57
  })
55
58
  })
@@ -1072,14 +1075,28 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImpo
1072
1075
  type: Input
1073
1076
  }] } });
1074
1077
 
1078
+ /**
1079
+ * Token used to configure the default DbxDialogContentFooterConfig for DbxScheduleSelectionCalendarDateDialogComponent.
1080
+ */
1081
+ const DEFAULT_DBX_SCHEDULE_SELECTION_CALENDAR_DATE_POPUP_CLOSE_CONFIG_TOKEN = new InjectionToken('DbxScheduleSelectionCalendarDatePopupCloseConfig');
1075
1082
  class DbxScheduleSelectionCalendarDateDialogComponent extends AbstractDialogDirective {
1076
- static openDialog(matDialog, { injector }) {
1083
+ get closeConfig() {
1084
+ return this.data.closeConfig;
1085
+ }
1086
+ static openDialog(matDialog, config) {
1087
+ const { injector, closeConfig: inputCloseConfig } = config;
1088
+ const defaultCloseConfig = injector.get(DEFAULT_DBX_SCHEDULE_SELECTION_CALENDAR_DATE_POPUP_CLOSE_CONFIG_TOKEN, null);
1089
+ const closeConfig = mergeObjects([defaultCloseConfig, inputCloseConfig], KeyValueTypleValueFilter.NULL);
1077
1090
  return matDialog.open(DbxScheduleSelectionCalendarDateDialogComponent, {
1078
1091
  injector,
1079
1092
  height: 'calc(var(--vh100) * 0.9)',
1080
1093
  minHeight: 400,
1081
1094
  width: '80vw',
1082
- minWidth: 360
1095
+ minWidth: 360,
1096
+ data: {
1097
+ config,
1098
+ closeConfig
1099
+ }
1083
1100
  });
1084
1101
  }
1085
1102
  }
@@ -1088,9 +1105,9 @@ DbxScheduleSelectionCalendarDateDialogComponent.ɵcmp = i0.ɵɵngDeclareComponen
1088
1105
  <dbx-dialog-content class="dbx-schedule-selection-calendar-date-dialog">
1089
1106
  <dbx-dialog-content-close (close)="close()"></dbx-dialog-content-close>
1090
1107
  <dbx-schedule-selection-calendar></dbx-schedule-selection-calendar>
1091
- <dbx-dialog-content-footer closeText="Close Calendar" (close)="close()"></dbx-dialog-content-footer>
1108
+ <dbx-dialog-content-footer [config]="closeConfig" (close)="close()"></dbx-dialog-content-footer>
1092
1109
  </dbx-dialog-content>
1093
- `, isInline: true, dependencies: [{ kind: "directive", type: i1$1.DbxDialogContentDirective, selector: "dbx-dialog-content,[dbxDialogContent].dbx-dialog-content", inputs: ["width"] }, { kind: "component", type: i1$1.DbxDialogContentFooterComponent, selector: "dbx-dialog-content-footer", inputs: ["closeText"], outputs: ["close"] }, { kind: "component", type: i1$1.DbxDialogContentCloseComponent, selector: "dbx-dialog-content-close", outputs: ["close"] }, { kind: "component", type: DbxScheduleSelectionCalendarComponent, selector: "dbx-schedule-selection-calendar", inputs: ["config"], outputs: ["clickEvent"] }] });
1110
+ `, isInline: true, dependencies: [{ kind: "directive", type: i1$1.DbxDialogContentDirective, selector: "dbx-dialog-content,[dbxDialogContent].dbx-dialog-content", inputs: ["width"] }, { kind: "component", type: i1$1.DbxDialogContentFooterComponent, selector: "dbx-dialog-content-footer", inputs: ["closeText", "buttonColor", "config"], outputs: ["close"] }, { kind: "component", type: i1$1.DbxDialogContentCloseComponent, selector: "dbx-dialog-content-close", outputs: ["close"] }, { kind: "component", type: DbxScheduleSelectionCalendarComponent, selector: "dbx-schedule-selection-calendar", inputs: ["config"], outputs: ["clickEvent"] }] });
1094
1111
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: DbxScheduleSelectionCalendarDateDialogComponent, decorators: [{
1095
1112
  type: Component,
1096
1113
  args: [{
@@ -1098,7 +1115,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImpo
1098
1115
  <dbx-dialog-content class="dbx-schedule-selection-calendar-date-dialog">
1099
1116
  <dbx-dialog-content-close (close)="close()"></dbx-dialog-content-close>
1100
1117
  <dbx-schedule-selection-calendar></dbx-schedule-selection-calendar>
1101
- <dbx-dialog-content-footer closeText="Close Calendar" (close)="close()"></dbx-dialog-content-footer>
1118
+ <dbx-dialog-content-footer [config]="closeConfig" (close)="close()"></dbx-dialog-content-footer>
1102
1119
  </dbx-dialog-content>
1103
1120
  `
1104
1121
  }]
@@ -1111,11 +1128,11 @@ class DbxScheduleSelectionCalendarDateDialogButtonComponent {
1111
1128
  this.buttonText = 'Customize';
1112
1129
  }
1113
1130
  clickCustomize() {
1114
- DbxScheduleSelectionCalendarDateDialogComponent.openDialog(this.matDialog, { injector: this.injector });
1131
+ DbxScheduleSelectionCalendarDateDialogComponent.openDialog(this.matDialog, { injector: this.injector, closeConfig: this.closeConfig });
1115
1132
  }
1116
1133
  }
1117
1134
  DbxScheduleSelectionCalendarDateDialogButtonComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: DbxScheduleSelectionCalendarDateDialogButtonComponent, deps: [{ token: i1$2.MatDialog }, { token: i0.Injector }], target: i0.ɵɵFactoryTarget.Component });
1118
- DbxScheduleSelectionCalendarDateDialogButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: DbxScheduleSelectionCalendarDateDialogButtonComponent, selector: "dbx-schedule-selection-calendar-date-dialog-button", inputs: { buttonText: "buttonText" }, ngImport: i0, template: `
1135
+ DbxScheduleSelectionCalendarDateDialogButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: DbxScheduleSelectionCalendarDateDialogButtonComponent, selector: "dbx-schedule-selection-calendar-date-dialog-button", inputs: { buttonText: "buttonText", closeConfig: "closeConfig" }, ngImport: i0, template: `
1119
1136
  <button mat-raised-button color="accent" (click)="clickCustomize()">{{ buttonText }}</button>
1120
1137
  `, isInline: true, dependencies: [{ kind: "component", type: i2.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button], button[mat-fab], button[mat-mini-fab], button[mat-stroked-button], button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }] });
1121
1138
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: DbxScheduleSelectionCalendarDateDialogButtonComponent, decorators: [{
@@ -1128,6 +1145,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImpo
1128
1145
  }]
1129
1146
  }], ctorParameters: function () { return [{ type: i1$2.MatDialog }, { type: i0.Injector }]; }, propDecorators: { buttonText: [{
1130
1147
  type: Input
1148
+ }], closeConfig: [{
1149
+ type: Input
1131
1150
  }] } });
1132
1151
 
1133
1152
  class DbxFormCalendarDateScheduleRangeFieldComponent extends FieldType {
@@ -1182,6 +1201,9 @@ class DbxFormCalendarDateScheduleRangeFieldComponent extends FieldType {
1182
1201
  get computeSelectionResultRelativeToFilter() {
1183
1202
  return this.props.computeSelectionResultRelativeToFilter;
1184
1203
  }
1204
+ get closeDialogConfig() {
1205
+ return this.props.closeDialogConfig;
1206
+ }
1185
1207
  get cellContentFactory() {
1186
1208
  return this.props.cellContentFactory;
1187
1209
  }
@@ -1231,17 +1253,17 @@ DbxFormCalendarDateScheduleRangeFieldComponent.ɵfac = i0.ɵɵngDeclareFactory({
1231
1253
  DbxFormCalendarDateScheduleRangeFieldComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: DbxFormCalendarDateScheduleRangeFieldComponent, selector: "ng-component", providers: [provideCalendarScheduleSelectionStoreIfParentIsUnavailable()], usesInheritance: true, ngImport: i0, template: `
1232
1254
  <div class="dbx-schedule-selection-field">
1233
1255
  <dbx-schedule-selection-calendar-date-range [showCustomize]="showCustomize" [required]="required" [disabled]="isReadonlyOrDisabled" [label]="label" [hint]="description">
1234
- <dbx-schedule-selection-calendar-date-dialog-button customizeButton></dbx-schedule-selection-calendar-date-dialog-button>
1256
+ <dbx-schedule-selection-calendar-date-dialog-button [closeConfig]="closeDialogConfig" customizeButton></dbx-schedule-selection-calendar-date-dialog-button>
1235
1257
  </dbx-schedule-selection-calendar-date-range>
1236
1258
  </div>
1237
- `, isInline: true, dependencies: [{ kind: "component", type: DbxScheduleSelectionCalendarDateRangeComponent, selector: "dbx-schedule-selection-calendar-date-range", inputs: ["label", "hint", "disabled", "showCustomize", "required"] }, { kind: "component", type: DbxScheduleSelectionCalendarDateDialogButtonComponent, selector: "dbx-schedule-selection-calendar-date-dialog-button", inputs: ["buttonText"] }] });
1259
+ `, isInline: true, dependencies: [{ kind: "component", type: DbxScheduleSelectionCalendarDateRangeComponent, selector: "dbx-schedule-selection-calendar-date-range", inputs: ["label", "hint", "disabled", "showCustomize", "required"] }, { kind: "component", type: DbxScheduleSelectionCalendarDateDialogButtonComponent, selector: "dbx-schedule-selection-calendar-date-dialog-button", inputs: ["buttonText", "closeConfig"] }] });
1238
1260
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: DbxFormCalendarDateScheduleRangeFieldComponent, decorators: [{
1239
1261
  type: Component,
1240
1262
  args: [{
1241
1263
  template: `
1242
1264
  <div class="dbx-schedule-selection-field">
1243
1265
  <dbx-schedule-selection-calendar-date-range [showCustomize]="showCustomize" [required]="required" [disabled]="isReadonlyOrDisabled" [label]="label" [hint]="description">
1244
- <dbx-schedule-selection-calendar-date-dialog-button customizeButton></dbx-schedule-selection-calendar-date-dialog-button>
1266
+ <dbx-schedule-selection-calendar-date-dialog-button [closeConfig]="closeDialogConfig" customizeButton></dbx-schedule-selection-calendar-date-dialog-button>
1245
1267
  </dbx-schedule-selection-calendar-date-range>
1246
1268
  </div>
1247
1269
  `,
@@ -1421,5 +1443,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImpo
1421
1443
  * Generated bundle index. Do not edit.
1422
1444
  */
1423
1445
 
1424
- 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, calendarScheduleMinAndMaxDateRange, calendarScheduleMinDate, calendarScheduleStartBeingUsedFromFilter, computeCalendarScheduleSelectionDateBlockRange, computeCalendarScheduleSelectionRange, computeScheduleSelectionRangeAndExclusion, computeScheduleSelectionValue, dateScheduleRangeField, dbxScheduleSelectionCalendarDateDaysFormDayFields, dbxScheduleSelectionCalendarDateDaysFormFields, defaultCalendarScheduleSelectionCellContentFactory, finalizeNewCalendarScheduleSelectionState, initialCalendarScheduleSelectionState, isEnabledDayInCalendarScheduleSelectionState, noSelectionCalendarScheduleSelectionState, provideCalendarScheduleSelectionStoreIfParentIsUnavailable, updateStateWithChangedDates, updateStateWithChangedRange, updateStateWithChangedScheduleDays, updateStateWithComputeSelectionResultRelativeToFilter, updateStateWithDateScheduleRangeValue, updateStateWithExclusions, updateStateWithFilter, updateStateWithInitialSelectionState, updateStateWithMinMaxDateRange, updateStateWithTimezoneValue };
1446
+ export { CalendarScheduleSelectionDayState, DEFAULT_DBX_SCHEDULE_SELECTION_CALENDAR_DATE_POPUP_CLOSE_CONFIG_TOKEN, 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, calendarScheduleMinAndMaxDateRange, calendarScheduleMinDate, calendarScheduleStartBeingUsedFromFilter, computeCalendarScheduleSelectionDateBlockRange, computeCalendarScheduleSelectionRange, computeScheduleSelectionRangeAndExclusion, computeScheduleSelectionValue, dateScheduleRangeField, dbxScheduleSelectionCalendarDateDaysFormDayFields, dbxScheduleSelectionCalendarDateDaysFormFields, defaultCalendarScheduleSelectionCellContentFactory, finalizeNewCalendarScheduleSelectionState, initialCalendarScheduleSelectionState, isEnabledDayInCalendarScheduleSelectionState, noSelectionCalendarScheduleSelectionState, provideCalendarScheduleSelectionStoreIfParentIsUnavailable, updateStateWithChangedDates, updateStateWithChangedRange, updateStateWithChangedScheduleDays, updateStateWithComputeSelectionResultRelativeToFilter, updateStateWithDateScheduleRangeValue, updateStateWithExclusions, updateStateWithFilter, updateStateWithInitialSelectionState, updateStateWithMinMaxDateRange, updateStateWithTimezoneValue };
1425
1447
  //# sourceMappingURL=dereekb-dbx-form-calendar.mjs.map