@coreui/angular-pro 4.2.0-next.3 → 4.2.0-next.4
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/esm2020/lib/calendar/calendar/calendar.component.mjs +22 -14
- package/esm2020/lib/date-picker/date-picker.component.mjs +3 -3
- package/esm2020/lib/date-range-picker/date-range-picker/date-range-picker.component.mjs +26 -17
- package/esm2020/lib/date-range-picker/date-range-picker.module.mjs +3 -9
- package/fesm2015/coreui-angular-pro.mjs +53 -67
- package/fesm2015/coreui-angular-pro.mjs.map +1 -1
- package/fesm2020/coreui-angular-pro.mjs +50 -63
- package/fesm2020/coreui-angular-pro.mjs.map +1 -1
- package/lib/date-range-picker/date-range-picker/date-range-picker.component.d.ts +5 -6
- package/lib/date-range-picker/date-range-picker.module.d.ts +9 -11
- package/package.json +1 -1
- package/esm2020/lib/date-range-picker/end-date.directive.mjs +0 -17
- package/esm2020/lib/date-range-picker/start-date.directive.mjs +0 -17
- package/lib/date-range-picker/end-date.directive.d.ts +0 -8
- package/lib/date-range-picker/start-date.directive.d.ts +0 -8
|
@@ -2356,6 +2356,9 @@ class CalendarComponent {
|
|
|
2356
2356
|
set startDate(value) {
|
|
2357
2357
|
this._startDate = !!value ? tryDate(value, 'startDate') : null;
|
|
2358
2358
|
this.calendarService.update({ startDate: this._startDate });
|
|
2359
|
+
if (!this.range || !this._startDate || (this.endDate && this._startDate > this.endDate)) {
|
|
2360
|
+
this.endDate = null;
|
|
2361
|
+
}
|
|
2359
2362
|
}
|
|
2360
2363
|
get startDate() {
|
|
2361
2364
|
return this._startDate;
|
|
@@ -2366,10 +2369,11 @@ class CalendarComponent {
|
|
|
2366
2369
|
*/
|
|
2367
2370
|
set endDate(value) {
|
|
2368
2371
|
this._endDate = !!value ? tryDate(value, 'endDate') : null;
|
|
2372
|
+
this._endDate = this.range ? this._endDate : null;
|
|
2369
2373
|
this.calendarService.update({ endDate: this._endDate });
|
|
2370
2374
|
}
|
|
2371
2375
|
get endDate() {
|
|
2372
|
-
return this._endDate;
|
|
2376
|
+
return this.range ? this._endDate : null;
|
|
2373
2377
|
}
|
|
2374
2378
|
/**
|
|
2375
2379
|
* Sets the day of start week.
|
|
@@ -2509,17 +2513,20 @@ class CalendarComponent {
|
|
|
2509
2513
|
for (const key of keys) {
|
|
2510
2514
|
if (key in this) {
|
|
2511
2515
|
// @ts-ignore
|
|
2512
|
-
this[key]
|
|
2513
|
-
|
|
2514
|
-
|
|
2515
|
-
|
|
2516
|
-
|
|
2517
|
-
|
|
2518
|
-
|
|
2519
|
-
|
|
2520
|
-
|
|
2521
|
-
|
|
2522
|
-
|
|
2516
|
+
if (this[key] !== state[key]) {
|
|
2517
|
+
// @ts-ignore
|
|
2518
|
+
this[key] = state[key];
|
|
2519
|
+
if (key === 'startDate') {
|
|
2520
|
+
setTimeout(() => {
|
|
2521
|
+
this.startDateChange.emit(this._startDate);
|
|
2522
|
+
});
|
|
2523
|
+
continue;
|
|
2524
|
+
}
|
|
2525
|
+
if (key === 'endDate') {
|
|
2526
|
+
setTimeout(() => {
|
|
2527
|
+
this.endDateChange.emit(this._endDate);
|
|
2528
|
+
});
|
|
2529
|
+
}
|
|
2523
2530
|
}
|
|
2524
2531
|
}
|
|
2525
2532
|
}
|
|
@@ -2568,7 +2575,8 @@ class CalendarComponent {
|
|
|
2568
2575
|
* @type void
|
|
2569
2576
|
*/
|
|
2570
2577
|
clearDates() {
|
|
2571
|
-
this.calendarService.update({
|
|
2578
|
+
this.calendarService.update({ endDate: null });
|
|
2579
|
+
this.calendarService.update({ startDate: null });
|
|
2572
2580
|
}
|
|
2573
2581
|
}
|
|
2574
2582
|
CalendarComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.2", ngImport: i0, type: CalendarComponent, deps: [{ token: CalendarService }], target: i0.ɵɵFactoryTarget.Component });
|
|
@@ -3714,36 +3722,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.2", ngImpor
|
|
|
3714
3722
|
}]
|
|
3715
3723
|
}] });
|
|
3716
3724
|
|
|
3717
|
-
class StartDateDirective {
|
|
3718
|
-
constructor(elementRef) {
|
|
3719
|
-
this.elementRef = elementRef;
|
|
3720
|
-
}
|
|
3721
|
-
}
|
|
3722
|
-
StartDateDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.2", ngImport: i0, type: StartDateDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
|
|
3723
|
-
StartDateDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "14.1.2", type: StartDateDirective, selector: "[cStartDate]", exportAs: ["cStartDate"], ngImport: i0 });
|
|
3724
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.2", ngImport: i0, type: StartDateDirective, decorators: [{
|
|
3725
|
-
type: Directive,
|
|
3726
|
-
args: [{
|
|
3727
|
-
selector: '[cStartDate]',
|
|
3728
|
-
exportAs: 'cStartDate'
|
|
3729
|
-
}]
|
|
3730
|
-
}], ctorParameters: function () { return [{ type: i0.ElementRef }]; } });
|
|
3731
|
-
|
|
3732
|
-
class EndDateDirective {
|
|
3733
|
-
constructor(elementRef) {
|
|
3734
|
-
this.elementRef = elementRef;
|
|
3735
|
-
}
|
|
3736
|
-
}
|
|
3737
|
-
EndDateDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.2", ngImport: i0, type: EndDateDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
|
|
3738
|
-
EndDateDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "14.1.2", type: EndDateDirective, selector: "[cEndDate]", exportAs: ["cEndDate"], ngImport: i0 });
|
|
3739
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.2", ngImport: i0, type: EndDateDirective, decorators: [{
|
|
3740
|
-
type: Directive,
|
|
3741
|
-
args: [{
|
|
3742
|
-
selector: '[cEndDate]',
|
|
3743
|
-
exportAs: 'cEndDate'
|
|
3744
|
-
}]
|
|
3745
|
-
}], ctorParameters: function () { return [{ type: i0.ElementRef }]; } });
|
|
3746
|
-
|
|
3747
3725
|
class FormControlDirective {
|
|
3748
3726
|
constructor(hostElement) {
|
|
3749
3727
|
this.hostElement = hostElement;
|
|
@@ -5716,6 +5694,7 @@ class DateRangePickerComponent {
|
|
|
5716
5694
|
return;
|
|
5717
5695
|
}
|
|
5718
5696
|
elementRef.nativeElement.value = date?.toLocaleDateString(this.locale) ?? '';
|
|
5697
|
+
// elementRef.nativeElement.valueAsDate = date;
|
|
5719
5698
|
return;
|
|
5720
5699
|
};
|
|
5721
5700
|
this.onChange = (value) => { };
|
|
@@ -5916,6 +5895,18 @@ class DateRangePickerComponent {
|
|
|
5916
5895
|
});
|
|
5917
5896
|
});
|
|
5918
5897
|
}
|
|
5898
|
+
ngOnChanges(changes) {
|
|
5899
|
+
if (changes['date']) {
|
|
5900
|
+
// for date-picker component
|
|
5901
|
+
this.startDateValue = changes['date']?.currentValue?.toLocaleDateString(this.locale) ?? '';
|
|
5902
|
+
}
|
|
5903
|
+
if (changes['startDate']) {
|
|
5904
|
+
this.startDateValue = changes['startDate']?.currentValue?.toLocaleDateString(this.locale) ?? '';
|
|
5905
|
+
}
|
|
5906
|
+
if (changes['endDate']) {
|
|
5907
|
+
this.endDateValue = changes['endDate']?.currentValue?.toLocaleDateString(this.locale) ?? '';
|
|
5908
|
+
}
|
|
5909
|
+
}
|
|
5919
5910
|
getCustomRangeKey(customRange) {
|
|
5920
5911
|
return customRange[0];
|
|
5921
5912
|
}
|
|
@@ -5927,12 +5918,12 @@ class DateRangePickerComponent {
|
|
|
5927
5918
|
handleCalendarCellHover($event) {
|
|
5928
5919
|
this.calendarCellHover.emit($event);
|
|
5929
5920
|
if (!this.startDate) {
|
|
5930
|
-
this.setInputValue(this.
|
|
5921
|
+
this.setInputValue(this.startDateElementRef, $event);
|
|
5931
5922
|
this.inputStartHoverValue = $event;
|
|
5932
5923
|
return;
|
|
5933
5924
|
}
|
|
5934
5925
|
if (!this.endDate) {
|
|
5935
|
-
this.setInputValue(this.
|
|
5926
|
+
this.setInputValue(this.endDateElementRef, $event);
|
|
5936
5927
|
this.inputEndHoverValue = $event;
|
|
5937
5928
|
return;
|
|
5938
5929
|
}
|
|
@@ -5957,12 +5948,12 @@ class DateRangePickerComponent {
|
|
|
5957
5948
|
// }
|
|
5958
5949
|
}
|
|
5959
5950
|
handleClear($event) {
|
|
5960
|
-
this.calendarComponent
|
|
5951
|
+
this.calendarComponent.clearDates();
|
|
5961
5952
|
}
|
|
5962
5953
|
handleStartDateInputChange($event) {
|
|
5963
5954
|
const date = getLocalDateFromString($event.target?.value, this.locale, this.timepicker);
|
|
5964
5955
|
if (!date) {
|
|
5965
|
-
this.calendarComponent
|
|
5956
|
+
this.calendarComponent.clearDates();
|
|
5966
5957
|
}
|
|
5967
5958
|
if (date instanceof Date && date.getTime()) {
|
|
5968
5959
|
if (!(this.forbiddenDate(date) || (this.endDate && this.endDate < date))) {
|
|
@@ -5970,7 +5961,7 @@ class DateRangePickerComponent {
|
|
|
5970
5961
|
this.startDate = date;
|
|
5971
5962
|
}
|
|
5972
5963
|
}
|
|
5973
|
-
this.
|
|
5964
|
+
this.handleStartDateChange(this.startDate ?? null);
|
|
5974
5965
|
}
|
|
5975
5966
|
handleEndDateInputChange($event) {
|
|
5976
5967
|
const date = getLocalDateFromString($event.target?.value, this.locale, this.timepicker);
|
|
@@ -5983,7 +5974,7 @@ class DateRangePickerComponent {
|
|
|
5983
5974
|
this.endDate = date;
|
|
5984
5975
|
}
|
|
5985
5976
|
}
|
|
5986
|
-
this.
|
|
5977
|
+
this.handleEndDateChange(this.endDate ?? null);
|
|
5987
5978
|
}
|
|
5988
5979
|
forbiddenDate(date) {
|
|
5989
5980
|
return isDateDisabled(date, this.minDate, this.maxDate, this.disabledDates) || (this.dateFilter ? !this.dateFilter(date) : false);
|
|
@@ -6016,7 +6007,7 @@ DateRangePickerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0
|
|
|
6016
6007
|
useExisting: forwardRef(() => DateRangePickerComponent),
|
|
6017
6008
|
multi: true
|
|
6018
6009
|
}
|
|
6019
|
-
], queries: [{ propertyName: "contentTemplates", predicate: TemplateIdDirective, descendants: true }], viewQueries: [{ propertyName: "calendarComponent", first: true, predicate: CalendarComponent, descendants: true }, { propertyName: "
|
|
6010
|
+
], queries: [{ propertyName: "contentTemplates", predicate: TemplateIdDirective, descendants: true }], viewQueries: [{ propertyName: "calendarComponent", first: true, predicate: CalendarComponent, descendants: true }, { propertyName: "startDateElementRef", first: true, predicate: ["startDateElementRef"], descendants: true }, { propertyName: "endDateElementRef", first: true, predicate: ["endDateElementRef"], descendants: true }], exportAs: ["cDateRangePicker"], usesOnChanges: true, ngImport: i0, template: "<c-dropdown #dropdown=\"cDropdown\" [autoClose]=\"'outside'\" class=\"date-picker picker\" [visible]=\"visible\">\n <c-input-group [caret]=\"false\"\n [disabled]=\"disabled ?? dropdown.visible\"\n [sizing]=\"size ?? ''\"\n cDropdownToggle\n class=\"picker-input-group\"\n >\n <input (change)=\"handleStartDateInputChange($event)\"\n [formControl]=\"startDateInput\"\n [ngClass]=\"{hover: !!inputStartHoverValue}\"\n [placeholder]=\"startDatePlaceholder ?? placeholder[0]\"\n cFormControl\n #startDateElementRef\n [attr.tabindex]=\"disabled ? -1 : 0\"\n [attr.disabled]=\"disabled ? '' : null\"\n pattern=\"[1-9]*\"\n [readonly]=\"inputReadOnly ?? null\"\n >\n <span *ngIf=\"range && separator !== false\" cInputGroupText>\n <span class=\"picker-input-group-icon date-picker-arrow-icon\"></span>\n </span>\n <input (change)=\"handleEndDateInputChange($event)\"\n *ngIf=\"range\"\n [formControl]=\"endDateInput\"\n [ngClass]=\"{hover: !!inputEndHoverValue}\"\n [placeholder]=\"endDatePlaceholder ?? placeholder[1]\"\n cFormControl\n #endDateElementRef\n [attr.tabindex]=\"disabled ? -1 : 0\"\n [attr.disabled]=\"disabled ? '' : null\"\n pattern=\"[1-9]*\"\n [readonly]=\"(inputReadOnly || !startDate) ?? null\"\n >\n <span *ngIf=\"indicator || cleaner\" cInputGroupText>\n <span *ngIf=\"indicator\" class=\"picker-input-group-indicator\">\n <span class=\"picker-input-group-icon date-picker-input-icon\"></span>\n </span>\n <span (click)=\"!disabled && handleClear($event)\" *ngIf=\"cleaner && startDate &&!disabled\" class=\"picker-input-group-cleaner\" role=\"button\">\n <span class=\"picker-input-group-icon date-picker-cleaner-icon\"></span>\n </span>\n </span>\n\n </c-input-group>\n <div cDropdownMenu>\n <div class=\"date-picker-body\">\n <ng-template [ngIf]=\"!isMobile\">\n <div *ngIf=\"ranges\" class=\"date-picker-ranges\">\n <button (click)=\"setCustomRange(customRange)\"\n *ngFor=\"let customRange of customRanges\"\n [color]=\"rangesButtonsColor\"\n [size]=\"rangesButtonsSize\"\n [variant]=\"rangesButtonsVariant\"\n cButton>\n {{getCustomRangeKey(customRange)}}\n </button>\n </div>\n </ng-template>\n <c-calendar\n (calendarCellHover)=\"handleCalendarCellHover($event)\"\n (calendarDateChange)=\"handleCalendarDateChange($event)\"\n (endDateChange)=\"handleEndDateChange($event)\"\n (startDateChange)=\"handleStartDateChange($event)\"\n [calendarDate]=\"calendarDate\"\n [calendars]=\"isMobile ? 1 : calendars\"\n [dateFilter]=\"dateFilter\"\n [disabledDates]=\"disabledDates\"\n [endDate]=\"endDate\"\n [firstDayOfWeek]=\"firstDayOfWeek\"\n [locale]=\"locale\"\n [maxDate]=\"maxDate\"\n [minDate]=\"minDate\"\n [navigation]=\"navigation\"\n [range]=\"range\"\n [startDate]=\"startDate\"\n [navYearFirst]=\"navYearFirst\"\n [dayFormat]=\"dayFormat\"\n [weekdayFormat]=\"weekdayFormat\"\n class=\"date-picker-calendars\"\n ></c-calendar>\n <div *ngIf=\"false && timepicker\" class=\"date-picker-timepickers\">\n <!-- todo-->\n <c-time-picker\n variant=\"select\"\n [locale]=\"locale\"\n [disabled]=\"!startDate\"\n [time]=\"startDate ?? undefined\"\n (timeChange)=\"handleStartTimeChange($event)\"\n ></c-time-picker>\n <c-time-picker\n *ngIf=\"range\"\n variant=\"select\"\n [locale]=\"locale\"\n [disabled]=\"!endDate\"\n [time]=\"endDate ?? undefined\"\n (timeChange)=\"handleEndTimeChange($event)\"\n ></c-time-picker>\n </div>\n </div>\n <div *ngIf=\"templates?.datePickerFooter\" class=\"picker-footer\">\n <ng-container *ngTemplateOutlet=\"templates?.datePickerFooter; context: {$implicit: dropdown}\"></ng-container>\n </div>\n </div>\n <ng-content></ng-content>\n</c-dropdown>\n", styles: [""], dependencies: [{ kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.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: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.PatternValidator, selector: "[pattern][formControlName],[pattern][formControl],[pattern][ngModel]", inputs: ["pattern"] }, { kind: "directive", type: i2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: ButtonDirective, selector: "[cButton]", inputs: ["active", "color", "disabled", "shape", "size", "type", "variant"], exportAs: ["cButton"] }, { kind: "component", type: CalendarComponent, selector: "c-calendar", inputs: ["calendarDate", "calendars", "dayFormat", "disabledDates", "startDate", "endDate", "firstDayOfWeek", "locale", "maxDate", "minDate", "navigation", "navYearFirst", "range", "view", "weekdayFormat", "dateFilter"], outputs: ["calendarCellHover", "calendarDateChange", "endDateChange", "startDateChange", "viewChange"], exportAs: ["cCalendar"] }, { kind: "directive", type: FormControlDirective, selector: "input[cFormControl], textarea[cFormControl]", inputs: ["sizing", "valid", "type", "plaintext"] }, { kind: "component", type: InputGroupComponent, selector: "c-input-group", inputs: ["sizing"] }, { kind: "directive", type: InputGroupTextDirective, selector: "[cInputGroupText]" }, { kind: "component", type: DropdownComponent, selector: "c-dropdown", inputs: ["alignment", "autoClose", "dark", "direction", "placement", "popper", "popperOptions", "variant", "visible"], outputs: ["visibleChange"], exportAs: ["cDropdown"] }, { kind: "directive", type: DropdownToggleDirective, selector: "[cDropdownToggle]", inputs: ["dropdownComponent", "disabled", "caret", "split"], exportAs: ["cDropdownToggle"] }, { kind: "directive", type: DropdownMenuDirective, selector: "[cDropdownMenu]", inputs: ["alignment", "visible", "dark"], exportAs: ["cDropdownMenu"] }, { kind: "component", type: TimePickerComponent, selector: "c-time-picker", inputs: ["cleaner", "dateTimeFormatOptions", "disabled", "filterHours", "filterMinutes", "filterSeconds", "indicator", "inputReadOnly", "locale", "placeholder", "seconds", "size", "time", "variant", "visible"], outputs: ["timeChange"], exportAs: ["cTimePicker"] }] });
|
|
6020
6011
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.2", ngImport: i0, type: DateRangePickerComponent, decorators: [{
|
|
6021
6012
|
type: Component,
|
|
6022
6013
|
args: [{ selector: 'c-date-range-picker', exportAs: 'cDateRangePicker', providers: [
|
|
@@ -6025,7 +6016,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.2", ngImpor
|
|
|
6025
6016
|
useExisting: forwardRef(() => DateRangePickerComponent),
|
|
6026
6017
|
multi: true
|
|
6027
6018
|
}
|
|
6028
|
-
], template: "<c-dropdown #dropdown=\"cDropdown\" [autoClose]=\"'outside'\" class=\"date-picker picker\" [visible]=\"visible\">\
|
|
6019
|
+
], template: "<c-dropdown #dropdown=\"cDropdown\" [autoClose]=\"'outside'\" class=\"date-picker picker\" [visible]=\"visible\">\n <c-input-group [caret]=\"false\"\n [disabled]=\"disabled ?? dropdown.visible\"\n [sizing]=\"size ?? ''\"\n cDropdownToggle\n class=\"picker-input-group\"\n >\n <input (change)=\"handleStartDateInputChange($event)\"\n [formControl]=\"startDateInput\"\n [ngClass]=\"{hover: !!inputStartHoverValue}\"\n [placeholder]=\"startDatePlaceholder ?? placeholder[0]\"\n cFormControl\n #startDateElementRef\n [attr.tabindex]=\"disabled ? -1 : 0\"\n [attr.disabled]=\"disabled ? '' : null\"\n pattern=\"[1-9]*\"\n [readonly]=\"inputReadOnly ?? null\"\n >\n <span *ngIf=\"range && separator !== false\" cInputGroupText>\n <span class=\"picker-input-group-icon date-picker-arrow-icon\"></span>\n </span>\n <input (change)=\"handleEndDateInputChange($event)\"\n *ngIf=\"range\"\n [formControl]=\"endDateInput\"\n [ngClass]=\"{hover: !!inputEndHoverValue}\"\n [placeholder]=\"endDatePlaceholder ?? placeholder[1]\"\n cFormControl\n #endDateElementRef\n [attr.tabindex]=\"disabled ? -1 : 0\"\n [attr.disabled]=\"disabled ? '' : null\"\n pattern=\"[1-9]*\"\n [readonly]=\"(inputReadOnly || !startDate) ?? null\"\n >\n <span *ngIf=\"indicator || cleaner\" cInputGroupText>\n <span *ngIf=\"indicator\" class=\"picker-input-group-indicator\">\n <span class=\"picker-input-group-icon date-picker-input-icon\"></span>\n </span>\n <span (click)=\"!disabled && handleClear($event)\" *ngIf=\"cleaner && startDate &&!disabled\" class=\"picker-input-group-cleaner\" role=\"button\">\n <span class=\"picker-input-group-icon date-picker-cleaner-icon\"></span>\n </span>\n </span>\n\n </c-input-group>\n <div cDropdownMenu>\n <div class=\"date-picker-body\">\n <ng-template [ngIf]=\"!isMobile\">\n <div *ngIf=\"ranges\" class=\"date-picker-ranges\">\n <button (click)=\"setCustomRange(customRange)\"\n *ngFor=\"let customRange of customRanges\"\n [color]=\"rangesButtonsColor\"\n [size]=\"rangesButtonsSize\"\n [variant]=\"rangesButtonsVariant\"\n cButton>\n {{getCustomRangeKey(customRange)}}\n </button>\n </div>\n </ng-template>\n <c-calendar\n (calendarCellHover)=\"handleCalendarCellHover($event)\"\n (calendarDateChange)=\"handleCalendarDateChange($event)\"\n (endDateChange)=\"handleEndDateChange($event)\"\n (startDateChange)=\"handleStartDateChange($event)\"\n [calendarDate]=\"calendarDate\"\n [calendars]=\"isMobile ? 1 : calendars\"\n [dateFilter]=\"dateFilter\"\n [disabledDates]=\"disabledDates\"\n [endDate]=\"endDate\"\n [firstDayOfWeek]=\"firstDayOfWeek\"\n [locale]=\"locale\"\n [maxDate]=\"maxDate\"\n [minDate]=\"minDate\"\n [navigation]=\"navigation\"\n [range]=\"range\"\n [startDate]=\"startDate\"\n [navYearFirst]=\"navYearFirst\"\n [dayFormat]=\"dayFormat\"\n [weekdayFormat]=\"weekdayFormat\"\n class=\"date-picker-calendars\"\n ></c-calendar>\n <div *ngIf=\"false && timepicker\" class=\"date-picker-timepickers\">\n <!-- todo-->\n <c-time-picker\n variant=\"select\"\n [locale]=\"locale\"\n [disabled]=\"!startDate\"\n [time]=\"startDate ?? undefined\"\n (timeChange)=\"handleStartTimeChange($event)\"\n ></c-time-picker>\n <c-time-picker\n *ngIf=\"range\"\n variant=\"select\"\n [locale]=\"locale\"\n [disabled]=\"!endDate\"\n [time]=\"endDate ?? undefined\"\n (timeChange)=\"handleEndTimeChange($event)\"\n ></c-time-picker>\n </div>\n </div>\n <div *ngIf=\"templates?.datePickerFooter\" class=\"picker-footer\">\n <ng-container *ngTemplateOutlet=\"templates?.datePickerFooter; context: {$implicit: dropdown}\"></ng-container>\n </div>\n </div>\n <ng-content></ng-content>\n</c-dropdown>\n" }]
|
|
6029
6020
|
}], ctorParameters: function () { return [{ type: i1$2.BreakpointObserver }]; }, propDecorators: { dayFormat: [{
|
|
6030
6021
|
type: Input
|
|
6031
6022
|
}], calendars: [{
|
|
@@ -6107,12 +6098,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.2", ngImpor
|
|
|
6107
6098
|
}], calendarComponent: [{
|
|
6108
6099
|
type: ViewChild,
|
|
6109
6100
|
args: [CalendarComponent]
|
|
6110
|
-
}],
|
|
6101
|
+
}], startDateElementRef: [{
|
|
6111
6102
|
type: ViewChild,
|
|
6112
|
-
args: [
|
|
6113
|
-
}],
|
|
6103
|
+
args: ['startDateElementRef']
|
|
6104
|
+
}], endDateElementRef: [{
|
|
6114
6105
|
type: ViewChild,
|
|
6115
|
-
args: [
|
|
6106
|
+
args: ['endDateElementRef']
|
|
6116
6107
|
}], contentTemplates: [{
|
|
6117
6108
|
type: ContentChildren,
|
|
6118
6109
|
args: [TemplateIdDirective, { descendants: true }]
|
|
@@ -6807,9 +6798,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.2", ngImpor
|
|
|
6807
6798
|
class DateRangePickerModule {
|
|
6808
6799
|
}
|
|
6809
6800
|
DateRangePickerModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.2", ngImport: i0, type: DateRangePickerModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
6810
|
-
DateRangePickerModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.1.2", ngImport: i0, type: DateRangePickerModule, declarations: [DateRangePickerComponent,
|
|
6811
|
-
StartDateDirective,
|
|
6812
|
-
EndDateDirective], imports: [CommonModule,
|
|
6801
|
+
DateRangePickerModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.1.2", ngImport: i0, type: DateRangePickerModule, declarations: [DateRangePickerComponent], imports: [CommonModule,
|
|
6813
6802
|
FormsModule,
|
|
6814
6803
|
ReactiveFormsModule,
|
|
6815
6804
|
ButtonModule,
|
|
@@ -6831,9 +6820,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.2", ngImpor
|
|
|
6831
6820
|
type: NgModule,
|
|
6832
6821
|
args: [{
|
|
6833
6822
|
declarations: [
|
|
6834
|
-
DateRangePickerComponent
|
|
6835
|
-
StartDateDirective,
|
|
6836
|
-
EndDateDirective
|
|
6823
|
+
DateRangePickerComponent
|
|
6837
6824
|
],
|
|
6838
6825
|
imports: [
|
|
6839
6826
|
CommonModule,
|
|
@@ -6874,10 +6861,10 @@ class DatePickerComponent extends DateRangePickerComponent {
|
|
|
6874
6861
|
}
|
|
6875
6862
|
}
|
|
6876
6863
|
DatePickerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.2", ngImport: i0, type: DatePickerComponent, deps: [{ token: i1$2.BreakpointObserver }], target: i0.ɵɵFactoryTarget.Component });
|
|
6877
|
-
DatePickerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.2", type: DatePickerComponent, selector: "c-date-picker", inputs: { placeholder: "placeholder", date: "date" }, outputs: { startDateChange: "dateChange" }, exportAs: ["cDatePicker"], usesInheritance: true, ngImport: i0, template: "<c-dropdown #dropdown=\"cDropdown\" [autoClose]=\"'outside'\" class=\"date-picker picker\" [visible]=\"visible\">\
|
|
6864
|
+
DatePickerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.2", type: DatePickerComponent, selector: "c-date-picker", inputs: { placeholder: "placeholder", date: "date" }, outputs: { startDateChange: "dateChange" }, exportAs: ["cDatePicker"], usesInheritance: true, ngImport: i0, template: "<c-dropdown #dropdown=\"cDropdown\" [autoClose]=\"'outside'\" class=\"date-picker picker\" [visible]=\"visible\">\n <c-input-group [caret]=\"false\"\n [disabled]=\"disabled ?? dropdown.visible\"\n [sizing]=\"size ?? ''\"\n cDropdownToggle\n class=\"picker-input-group\"\n >\n <input (change)=\"handleStartDateInputChange($event)\"\n [formControl]=\"startDateInput\"\n [ngClass]=\"{hover: !!inputStartHoverValue}\"\n [placeholder]=\"startDatePlaceholder ?? placeholder[0]\"\n cFormControl\n #startDateElementRef\n [attr.tabindex]=\"disabled ? -1 : 0\"\n [attr.disabled]=\"disabled ? '' : null\"\n pattern=\"[1-9]*\"\n [readonly]=\"inputReadOnly ?? null\"\n >\n <span *ngIf=\"range && separator !== false\" cInputGroupText>\n <span class=\"picker-input-group-icon date-picker-arrow-icon\"></span>\n </span>\n <input (change)=\"handleEndDateInputChange($event)\"\n *ngIf=\"range\"\n [formControl]=\"endDateInput\"\n [ngClass]=\"{hover: !!inputEndHoverValue}\"\n [placeholder]=\"endDatePlaceholder ?? placeholder[1]\"\n cFormControl\n #endDateElementRef\n [attr.tabindex]=\"disabled ? -1 : 0\"\n [attr.disabled]=\"disabled ? '' : null\"\n pattern=\"[1-9]*\"\n [readonly]=\"(inputReadOnly || !startDate) ?? null\"\n >\n <span *ngIf=\"indicator || cleaner\" cInputGroupText>\n <span *ngIf=\"indicator\" class=\"picker-input-group-indicator\">\n <span class=\"picker-input-group-icon date-picker-input-icon\"></span>\n </span>\n <span (click)=\"!disabled && handleClear($event)\" *ngIf=\"cleaner && startDate &&!disabled\" class=\"picker-input-group-cleaner\" role=\"button\">\n <span class=\"picker-input-group-icon date-picker-cleaner-icon\"></span>\n </span>\n </span>\n\n </c-input-group>\n <div cDropdownMenu>\n <div class=\"date-picker-body\">\n <ng-template [ngIf]=\"!isMobile\">\n <div *ngIf=\"ranges\" class=\"date-picker-ranges\">\n <button (click)=\"setCustomRange(customRange)\"\n *ngFor=\"let customRange of customRanges\"\n [color]=\"rangesButtonsColor\"\n [size]=\"rangesButtonsSize\"\n [variant]=\"rangesButtonsVariant\"\n cButton>\n {{getCustomRangeKey(customRange)}}\n </button>\n </div>\n </ng-template>\n <c-calendar\n (calendarCellHover)=\"handleCalendarCellHover($event)\"\n (calendarDateChange)=\"handleCalendarDateChange($event)\"\n (endDateChange)=\"handleEndDateChange($event)\"\n (startDateChange)=\"handleStartDateChange($event)\"\n [calendarDate]=\"calendarDate\"\n [calendars]=\"isMobile ? 1 : calendars\"\n [dateFilter]=\"dateFilter\"\n [disabledDates]=\"disabledDates\"\n [endDate]=\"endDate\"\n [firstDayOfWeek]=\"firstDayOfWeek\"\n [locale]=\"locale\"\n [maxDate]=\"maxDate\"\n [minDate]=\"minDate\"\n [navigation]=\"navigation\"\n [range]=\"range\"\n [startDate]=\"startDate\"\n [navYearFirst]=\"navYearFirst\"\n [dayFormat]=\"dayFormat\"\n [weekdayFormat]=\"weekdayFormat\"\n class=\"date-picker-calendars\"\n ></c-calendar>\n <div *ngIf=\"false && timepicker\" class=\"date-picker-timepickers\">\n <!-- todo-->\n <c-time-picker\n variant=\"select\"\n [locale]=\"locale\"\n [disabled]=\"!startDate\"\n [time]=\"startDate ?? undefined\"\n (timeChange)=\"handleStartTimeChange($event)\"\n ></c-time-picker>\n <c-time-picker\n *ngIf=\"range\"\n variant=\"select\"\n [locale]=\"locale\"\n [disabled]=\"!endDate\"\n [time]=\"endDate ?? undefined\"\n (timeChange)=\"handleEndTimeChange($event)\"\n ></c-time-picker>\n </div>\n </div>\n <div *ngIf=\"templates?.datePickerFooter\" class=\"picker-footer\">\n <ng-container *ngTemplateOutlet=\"templates?.datePickerFooter; context: {$implicit: dropdown}\"></ng-container>\n </div>\n </div>\n <ng-content></ng-content>\n</c-dropdown>\n", styles: [""], dependencies: [{ kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.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: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.PatternValidator, selector: "[pattern][formControlName],[pattern][formControl],[pattern][ngModel]", inputs: ["pattern"] }, { kind: "directive", type: i2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: ButtonDirective, selector: "[cButton]", inputs: ["active", "color", "disabled", "shape", "size", "type", "variant"], exportAs: ["cButton"] }, { kind: "component", type: CalendarComponent, selector: "c-calendar", inputs: ["calendarDate", "calendars", "dayFormat", "disabledDates", "startDate", "endDate", "firstDayOfWeek", "locale", "maxDate", "minDate", "navigation", "navYearFirst", "range", "view", "weekdayFormat", "dateFilter"], outputs: ["calendarCellHover", "calendarDateChange", "endDateChange", "startDateChange", "viewChange"], exportAs: ["cCalendar"] }, { kind: "directive", type: FormControlDirective, selector: "input[cFormControl], textarea[cFormControl]", inputs: ["sizing", "valid", "type", "plaintext"] }, { kind: "component", type: InputGroupComponent, selector: "c-input-group", inputs: ["sizing"] }, { kind: "directive", type: InputGroupTextDirective, selector: "[cInputGroupText]" }, { kind: "component", type: DropdownComponent, selector: "c-dropdown", inputs: ["alignment", "autoClose", "dark", "direction", "placement", "popper", "popperOptions", "variant", "visible"], outputs: ["visibleChange"], exportAs: ["cDropdown"] }, { kind: "directive", type: DropdownToggleDirective, selector: "[cDropdownToggle]", inputs: ["dropdownComponent", "disabled", "caret", "split"], exportAs: ["cDropdownToggle"] }, { kind: "directive", type: DropdownMenuDirective, selector: "[cDropdownMenu]", inputs: ["alignment", "visible", "dark"], exportAs: ["cDropdownMenu"] }, { kind: "component", type: TimePickerComponent, selector: "c-time-picker", inputs: ["cleaner", "dateTimeFormatOptions", "disabled", "filterHours", "filterMinutes", "filterSeconds", "indicator", "inputReadOnly", "locale", "placeholder", "seconds", "size", "time", "variant", "visible"], outputs: ["timeChange"], exportAs: ["cTimePicker"] }] });
|
|
6878
6865
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.2", ngImport: i0, type: DatePickerComponent, decorators: [{
|
|
6879
6866
|
type: Component,
|
|
6880
|
-
args: [{ selector: 'c-date-picker', exportAs: 'cDatePicker', template: "<c-dropdown #dropdown=\"cDropdown\" [autoClose]=\"'outside'\" class=\"date-picker picker\" [visible]=\"visible\">\
|
|
6867
|
+
args: [{ selector: 'c-date-picker', exportAs: 'cDatePicker', template: "<c-dropdown #dropdown=\"cDropdown\" [autoClose]=\"'outside'\" class=\"date-picker picker\" [visible]=\"visible\">\n <c-input-group [caret]=\"false\"\n [disabled]=\"disabled ?? dropdown.visible\"\n [sizing]=\"size ?? ''\"\n cDropdownToggle\n class=\"picker-input-group\"\n >\n <input (change)=\"handleStartDateInputChange($event)\"\n [formControl]=\"startDateInput\"\n [ngClass]=\"{hover: !!inputStartHoverValue}\"\n [placeholder]=\"startDatePlaceholder ?? placeholder[0]\"\n cFormControl\n #startDateElementRef\n [attr.tabindex]=\"disabled ? -1 : 0\"\n [attr.disabled]=\"disabled ? '' : null\"\n pattern=\"[1-9]*\"\n [readonly]=\"inputReadOnly ?? null\"\n >\n <span *ngIf=\"range && separator !== false\" cInputGroupText>\n <span class=\"picker-input-group-icon date-picker-arrow-icon\"></span>\n </span>\n <input (change)=\"handleEndDateInputChange($event)\"\n *ngIf=\"range\"\n [formControl]=\"endDateInput\"\n [ngClass]=\"{hover: !!inputEndHoverValue}\"\n [placeholder]=\"endDatePlaceholder ?? placeholder[1]\"\n cFormControl\n #endDateElementRef\n [attr.tabindex]=\"disabled ? -1 : 0\"\n [attr.disabled]=\"disabled ? '' : null\"\n pattern=\"[1-9]*\"\n [readonly]=\"(inputReadOnly || !startDate) ?? null\"\n >\n <span *ngIf=\"indicator || cleaner\" cInputGroupText>\n <span *ngIf=\"indicator\" class=\"picker-input-group-indicator\">\n <span class=\"picker-input-group-icon date-picker-input-icon\"></span>\n </span>\n <span (click)=\"!disabled && handleClear($event)\" *ngIf=\"cleaner && startDate &&!disabled\" class=\"picker-input-group-cleaner\" role=\"button\">\n <span class=\"picker-input-group-icon date-picker-cleaner-icon\"></span>\n </span>\n </span>\n\n </c-input-group>\n <div cDropdownMenu>\n <div class=\"date-picker-body\">\n <ng-template [ngIf]=\"!isMobile\">\n <div *ngIf=\"ranges\" class=\"date-picker-ranges\">\n <button (click)=\"setCustomRange(customRange)\"\n *ngFor=\"let customRange of customRanges\"\n [color]=\"rangesButtonsColor\"\n [size]=\"rangesButtonsSize\"\n [variant]=\"rangesButtonsVariant\"\n cButton>\n {{getCustomRangeKey(customRange)}}\n </button>\n </div>\n </ng-template>\n <c-calendar\n (calendarCellHover)=\"handleCalendarCellHover($event)\"\n (calendarDateChange)=\"handleCalendarDateChange($event)\"\n (endDateChange)=\"handleEndDateChange($event)\"\n (startDateChange)=\"handleStartDateChange($event)\"\n [calendarDate]=\"calendarDate\"\n [calendars]=\"isMobile ? 1 : calendars\"\n [dateFilter]=\"dateFilter\"\n [disabledDates]=\"disabledDates\"\n [endDate]=\"endDate\"\n [firstDayOfWeek]=\"firstDayOfWeek\"\n [locale]=\"locale\"\n [maxDate]=\"maxDate\"\n [minDate]=\"minDate\"\n [navigation]=\"navigation\"\n [range]=\"range\"\n [startDate]=\"startDate\"\n [navYearFirst]=\"navYearFirst\"\n [dayFormat]=\"dayFormat\"\n [weekdayFormat]=\"weekdayFormat\"\n class=\"date-picker-calendars\"\n ></c-calendar>\n <div *ngIf=\"false && timepicker\" class=\"date-picker-timepickers\">\n <!-- todo-->\n <c-time-picker\n variant=\"select\"\n [locale]=\"locale\"\n [disabled]=\"!startDate\"\n [time]=\"startDate ?? undefined\"\n (timeChange)=\"handleStartTimeChange($event)\"\n ></c-time-picker>\n <c-time-picker\n *ngIf=\"range\"\n variant=\"select\"\n [locale]=\"locale\"\n [disabled]=\"!endDate\"\n [time]=\"endDate ?? undefined\"\n (timeChange)=\"handleEndTimeChange($event)\"\n ></c-time-picker>\n </div>\n </div>\n <div *ngIf=\"templates?.datePickerFooter\" class=\"picker-footer\">\n <ng-container *ngTemplateOutlet=\"templates?.datePickerFooter; context: {$implicit: dropdown}\"></ng-container>\n </div>\n </div>\n <ng-content></ng-content>\n</c-dropdown>\n" }]
|
|
6881
6868
|
}], ctorParameters: function () { return [{ type: i1$2.BreakpointObserver }]; }, propDecorators: { placeholder: [{
|
|
6882
6869
|
type: Input
|
|
6883
6870
|
}], date: [{
|