@dereekb/dbx-form 9.24.35 → 9.24.37
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.schedule.selection.range.component.d.ts +3 -1
- package/calendar/lib/calendar.schedule.selection.store.d.ts +2 -2
- package/esm2020/calendar/lib/calendar.schedule.selection.range.component.mjs +11 -3
- package/esm2020/calendar/lib/calendar.schedule.selection.store.mjs +5 -5
- package/fesm2015/dereekb-dbx-form-calendar.mjs +14 -6
- package/fesm2015/dereekb-dbx-form-calendar.mjs.map +1 -1
- package/fesm2020/dereekb-dbx-form-calendar.mjs +14 -6
- package/fesm2020/dereekb-dbx-form-calendar.mjs.map +1 -1
- package/mapbox/package.json +4 -4
- package/package.json +4 -4
|
@@ -159,8 +159,8 @@ class DbxCalendarScheduleSelectionStore extends ComponentStore {
|
|
|
159
159
|
* @deprecated This is not the same as the current selection value. This is the set of manually togged off dates. It will be removed in a future update.
|
|
160
160
|
*/
|
|
161
161
|
this.selectedDates$ = this.state$.pipe(map((x) => x.toggledIndexes), distinctUntilChanged(), shareReplay(1));
|
|
162
|
-
this.isEnabledFilterDayFunction$ = this.state$.pipe(map((x) => x.isEnabledFilterDay), shareReplay(1));
|
|
163
|
-
this.isEnabledDayFunction$ = this.state$.pipe(map((x) => x.isEnabledDay), shareReplay(1));
|
|
162
|
+
this.isEnabledFilterDayFunction$ = this.state$.pipe(map((x) => x.isEnabledFilterDay), distinctUntilChanged(), shareReplay(1));
|
|
163
|
+
this.isEnabledDayFunction$ = this.state$.pipe(map((x) => x.isEnabledDay), distinctUntilChanged(), shareReplay(1));
|
|
164
164
|
this.currentDateRange$ = this.state$.pipe(map(computeCalendarScheduleSelectionRange), distinctUntilChanged((a, b) => isSameDateRange(a, b)), shareReplay(1));
|
|
165
165
|
this.computeSelectionResultRelativeToFilter$ = this.state$.pipe(map((x) => x.computeSelectionResultRelativeToFilter), shareReplay(1));
|
|
166
166
|
this.startBeingUsedFromFilter$ = this.state$.pipe(
|
|
@@ -612,8 +612,8 @@ function computeScheduleSelectionValue(state) {
|
|
|
612
612
|
};
|
|
613
613
|
}
|
|
614
614
|
function computeScheduleSelectionRangeAndExclusion(state) {
|
|
615
|
-
const { isEnabledDay, isEnabledFilterDay } = state;
|
|
616
|
-
const dateFactory = dateBlockTimingStartDateFactory(
|
|
615
|
+
const { start: currentStart, isEnabledDay, isEnabledFilterDay } = state;
|
|
616
|
+
const dateFactory = dateBlockTimingStartDateFactory({ start: currentStart }, { assertTimingMatchesTimezone: false, useSystemTimezone: true });
|
|
617
617
|
const dateBlockRange = computeCalendarScheduleSelectionDateBlockRange(state);
|
|
618
618
|
if (dateBlockRange == null) {
|
|
619
619
|
return null; // returns null if no items are selected.
|
|
@@ -795,6 +795,14 @@ class DbxScheduleSelectionCalendarDateRangeComponent {
|
|
|
795
795
|
return currentErrorMessage;
|
|
796
796
|
}), shareReplay(1));
|
|
797
797
|
this.pickerOpened$ = this._pickerOpened.asObservable();
|
|
798
|
+
this.defaultDatePickerFilter = () => true;
|
|
799
|
+
this.datePickerFilter$ = this.dbxCalendarScheduleSelectionStore.isEnabledFilterDayFunction$.pipe(map((isEnabled) => {
|
|
800
|
+
const fn = (date) => {
|
|
801
|
+
const result = date ? isEnabled(date) : true;
|
|
802
|
+
return result;
|
|
803
|
+
};
|
|
804
|
+
return fn;
|
|
805
|
+
}), shareReplay(1));
|
|
798
806
|
}
|
|
799
807
|
set disabled(disabled) {
|
|
800
808
|
if (disabled) {
|
|
@@ -869,10 +877,10 @@ class DbxScheduleSelectionCalendarDateRangeComponent {
|
|
|
869
877
|
}
|
|
870
878
|
}
|
|
871
879
|
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 });
|
|
872
|
-
DbxScheduleSelectionCalendarDateRangeComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: DbxScheduleSelectionCalendarDateRangeComponent, selector: "dbx-schedule-selection-calendar-date-range", inputs: { openPickerOnTextClick: "openPickerOnTextClick", label: "label", hint: "hint", disabled: "disabled", showCustomize: "showCustomize", required: "required" }, viewQueries: [{ propertyName: "picker", first: true, predicate: ["picker"], descendants: true }], ngImport: i0, template: "<mat-form-field class=\"dbx-schedule-selection-calendar-date-range-field\">\n <mat-label *ngIf=\"label\">{{ label }}</mat-label>\n <div class=\"dbx-schedule-selection-calendar-date-range-field-content\">\n <!-- Primary Content -->\n <div class=\"dbx-flex\">\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 class=\"mat-datepicker-button-highlight\" matIconSuffix [for]=\"picker\"></mat-datepicker-toggle>\n <dbx-button-spacer></dbx-button-spacer>\n <mat-date-range-input (click)=\"clickedDateRangeInput()\" [required]=\"required$ | async\" [
|
|
880
|
+
DbxScheduleSelectionCalendarDateRangeComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: DbxScheduleSelectionCalendarDateRangeComponent, selector: "dbx-schedule-selection-calendar-date-range", inputs: { openPickerOnTextClick: "openPickerOnTextClick", label: "label", hint: "hint", disabled: "disabled", showCustomize: "showCustomize", required: "required" }, viewQueries: [{ propertyName: "picker", first: true, predicate: ["picker"], descendants: true }], ngImport: i0, template: "<mat-form-field class=\"dbx-schedule-selection-calendar-date-range-field\">\n <mat-label *ngIf=\"label\">{{ label }}</mat-label>\n <div class=\"dbx-schedule-selection-calendar-date-range-field-content\">\n <!-- Primary Content -->\n <div class=\"dbx-flex\">\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 class=\"mat-datepicker-button-highlight\" matIconSuffix [for]=\"picker\"></mat-datepicker-toggle>\n <dbx-button-spacer></dbx-button-spacer>\n <mat-date-range-input (click)=\"clickedDateRangeInput()\" [required]=\"required$ | async\" [dateFilter]=\"(datePickerFilter$ | async) ?? defaultDatePickerFilter\" [formGroup]=\"range\" [rangePicker]=\"picker\">\n <input [errorStateMatcher]=\"errorStateMatcher\" matStartDate formControlName=\"start\" placeholder=\"Start date\" />\n <input [errorStateMatcher]=\"errorStateMatcher\" matEndDate formControlName=\"end\" placeholder=\"End date\" />\n </mat-date-range-input>\n <span *ngIf=\"timezone$ | async\" class=\"dbx-flex-bar dbx-faint dbx-nowrap dbx-icon-spacer\">{{ timezone$ | async | timezoneAbbreviation: (timezoneReleventDate$ | async) }}</span>\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 </div>\n <!-- Custom Content -->\n <div>\n <ng-content></ng-content>\n </div>\n </div>\n <mat-error *ngIf=\"currentErrorMessage$ | async\">{{ currentErrorMessage$ | async }}</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: i4.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: i4.AsyncPipe, name: "async" }, { kind: "pipe", type: i3$1.TimezoneAbbreviationPipe, name: "timezoneAbbreviation" }] });
|
|
873
881
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: DbxScheduleSelectionCalendarDateRangeComponent, decorators: [{
|
|
874
882
|
type: Component,
|
|
875
|
-
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 class=\"dbx-schedule-selection-calendar-date-range-field-content\">\n <!-- Primary Content -->\n <div class=\"dbx-flex\">\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 class=\"mat-datepicker-button-highlight\" matIconSuffix [for]=\"picker\"></mat-datepicker-toggle>\n <dbx-button-spacer></dbx-button-spacer>\n <mat-date-range-input (click)=\"clickedDateRangeInput()\" [required]=\"required$ | async\" [
|
|
883
|
+
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 class=\"dbx-schedule-selection-calendar-date-range-field-content\">\n <!-- Primary Content -->\n <div class=\"dbx-flex\">\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 class=\"mat-datepicker-button-highlight\" matIconSuffix [for]=\"picker\"></mat-datepicker-toggle>\n <dbx-button-spacer></dbx-button-spacer>\n <mat-date-range-input (click)=\"clickedDateRangeInput()\" [required]=\"required$ | async\" [dateFilter]=\"(datePickerFilter$ | async) ?? defaultDatePickerFilter\" [formGroup]=\"range\" [rangePicker]=\"picker\">\n <input [errorStateMatcher]=\"errorStateMatcher\" matStartDate formControlName=\"start\" placeholder=\"Start date\" />\n <input [errorStateMatcher]=\"errorStateMatcher\" matEndDate formControlName=\"end\" placeholder=\"End date\" />\n </mat-date-range-input>\n <span *ngIf=\"timezone$ | async\" class=\"dbx-flex-bar dbx-faint dbx-nowrap dbx-icon-spacer\">{{ timezone$ | async | timezoneAbbreviation: (timezoneReleventDate$ | async) }}</span>\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 </div>\n <!-- Custom Content -->\n <div>\n <ng-content></ng-content>\n </div>\n </div>\n <mat-error *ngIf=\"currentErrorMessage$ | async\">{{ currentErrorMessage$ | async }}</mat-error>\n <mat-hint>{{ hint }}</mat-hint>\n</mat-form-field>\n" }]
|
|
876
884
|
}], ctorParameters: function () { return [{ type: i1.DbxCalendarStore }, { type: DbxCalendarScheduleSelectionStore }, { type: undefined, decorators: [{
|
|
877
885
|
type: Inject,
|
|
878
886
|
args: [MAT_FORM_FIELD_DEFAULT_OPTIONS]
|