@coreui/angular-pro 4.2.0-next.6 → 4.2.0-next.7

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.
@@ -5280,7 +5280,11 @@ class TimePickerComponent {
5280
5280
  */
5281
5281
  set time(value) {
5282
5282
  if (value && isValidTime(value)) {
5283
- const time = new Date(value);
5283
+ const time = convertTimeToDate(value);
5284
+ if (!time) {
5285
+ this.clearTime();
5286
+ return;
5287
+ }
5284
5288
  this.dayPeriod = getAmPm(time, this.locale);
5285
5289
  if (this._time?.getTime() !== time.getTime()) {
5286
5290
  this._time = new Date(time.getTime());
@@ -5520,6 +5524,7 @@ class TimePickerComponent {
5520
5524
  }
5521
5525
  writeValue(value) {
5522
5526
  this.time = value;
5527
+ this.updateSelectTime();
5523
5528
  }
5524
5529
  registerOnChange(fn) {
5525
5530
  this.onChange = fn;
@@ -5672,6 +5677,7 @@ class DateRangePickerComponent {
5672
5677
  this.endDateChange = new EventEmitter();
5673
5678
  this.startDateChange = new EventEmitter();
5674
5679
  this.templates = {};
5680
+ this.dateChangeSubscriptions = [];
5675
5681
  this.isMobile = true;
5676
5682
  this._startDateValue = this.startDate?.toLocaleDateString(this.locale) ?? '';
5677
5683
  this._endDateValue = this.endDate?.toLocaleDateString(this.locale) ?? '';
@@ -5788,6 +5794,26 @@ class DateRangePickerComponent {
5788
5794
  get visible() {
5789
5795
  return this._visible;
5790
5796
  }
5797
+ set startDate(value) {
5798
+ const prevDate = this._startDate ? new Date(this._startDate) : null;
5799
+ this._startDate = value;
5800
+ if (prevDate?.getTime() !== this._startDate?.getTime()) {
5801
+ this.startDateChange.emit(this._startDate);
5802
+ }
5803
+ }
5804
+ get startDate() {
5805
+ return this._startDate;
5806
+ }
5807
+ set endDate(value) {
5808
+ const prevDate = this._endDate ? new Date(this._endDate ?? 0) : null;
5809
+ this._endDate = value;
5810
+ if (prevDate?.getTime() !== this._endDate?.getTime()) {
5811
+ this.endDateChange.emit(this._endDate);
5812
+ }
5813
+ }
5814
+ get endDate() {
5815
+ return this._endDate;
5816
+ }
5791
5817
  set firstDayOfWeek(value) {
5792
5818
  this._firstDayOfWeek = coerceNumberProperty(value);
5793
5819
  }
@@ -5829,6 +5855,23 @@ class DateRangePickerComponent {
5829
5855
  get value() {
5830
5856
  return this._value;
5831
5857
  }
5858
+ subscribeDateChange(subscribe = true) {
5859
+ if (subscribe) {
5860
+ // todo
5861
+ // this.dateChangeSubscriptions.push(this.startDateChange.subscribe(next => {
5862
+ // this.startDate = next;
5863
+ // this.onChange(next);
5864
+ // }));
5865
+ // this.dateChangeSubscriptions.push(this.startDateChange.subscribe(next => {
5866
+ // this.endDate = next;
5867
+ // this.onChange(next);
5868
+ // }));
5869
+ return;
5870
+ }
5871
+ this.dateChangeSubscriptions.forEach(subscription => {
5872
+ subscription.unsubscribe();
5873
+ });
5874
+ }
5832
5875
  onBlur() {
5833
5876
  this.onTouched();
5834
5877
  }
@@ -5883,9 +5926,11 @@ class DateRangePickerComponent {
5883
5926
  this.customRanges = this.ranges ? Object.entries(this.ranges) : [];
5884
5927
  this.startDateValue = this.startDate?.toLocaleDateString(this.locale) ?? '';
5885
5928
  this.endDateValue = this.endDate?.toLocaleDateString(this.locale) ?? '';
5929
+ this.subscribeDateChange();
5886
5930
  }
5887
5931
  ngOnDestroy() {
5888
5932
  this.layoutChanges.unsubscribe();
5933
+ this.subscribeDateChange(false);
5889
5934
  }
5890
5935
  ngAfterViewInit() {
5891
5936
  setTimeout(() => {
@@ -5933,7 +5978,6 @@ class DateRangePickerComponent {
5933
5978
  handleStartDateChange(date) {
5934
5979
  // if (date?.getTime() !== this.startDate?.getTime()) {
5935
5980
  this.startDate = date ?? null;
5936
- this.startDateChange.emit(date);
5937
5981
  this.startDateValue = date ? date.toLocaleDateString(this.locale) : '';
5938
5982
  this.inputStartHoverValue = null;
5939
5983
  this.value = this.startDate && this.endDate ? [this.startDate, this.endDate] : [];
@@ -5942,7 +5986,6 @@ class DateRangePickerComponent {
5942
5986
  handleEndDateChange(date) {
5943
5987
  // if (date?.getTime() !== this.endDate?.getTime()) {
5944
5988
  this.endDate = date ?? null;
5945
- this.endDateChange.emit(date);
5946
5989
  this.endDateValue = date ? date.toLocaleDateString(this.locale) : '';
5947
5990
  this.inputEndHoverValue = null;
5948
5991
  this.value = this.startDate && this.endDate ? [this.startDate, this.endDate] : [];
@@ -5992,6 +6035,8 @@ class DateRangePickerComponent {
5992
6035
  writeValue(value) {
5993
6036
  if (value !== null) {
5994
6037
  this.value = value;
6038
+ this.startDate = value[0];
6039
+ this.endDate = value[1];
5995
6040
  }
5996
6041
  }
5997
6042
  handleStartTimeChange(time) {
@@ -6835,7 +6880,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.3", ngImpor
6835
6880
  class DatePickerComponent extends DateRangePickerComponent {
6836
6881
  constructor(breakpointObserver) {
6837
6882
  super(breakpointObserver);
6838
- this.endDate = null;
6839
6883
  this.placeholder = 'Select date';
6840
6884
  // @ts-ignore
6841
6885
  this.startDateChange = new EventEmitter();
@@ -6846,25 +6890,57 @@ class DatePickerComponent extends DateRangePickerComponent {
6846
6890
  get calendars() {
6847
6891
  return 1;
6848
6892
  }
6849
- set date(value) {
6850
- this.startDate = value;
6893
+ get endDate() {
6894
+ return null;
6851
6895
  }
6852
6896
  get date() {
6853
6897
  return this.startDate;
6854
6898
  }
6899
+ set date(value) {
6900
+ this.startDate = value;
6901
+ }
6902
+ // @ts-ignore
6903
+ writeValue(value) {
6904
+ this.date = value;
6905
+ this.startDateValue = this.date ? this.date.toLocaleDateString(this.locale) : '';
6906
+ }
6907
+ subscribeDateChange(subscribe = true) {
6908
+ if (subscribe) {
6909
+ this.dateChangeSubscriptions.push(this.startDateChange.subscribe(next => {
6910
+ this.date = next;
6911
+ this.onChange(next);
6912
+ }));
6913
+ return;
6914
+ }
6915
+ this.dateChangeSubscriptions.forEach(subscription => {
6916
+ subscription.unsubscribe();
6917
+ });
6918
+ }
6855
6919
  }
6856
6920
  DatePickerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.3", ngImport: i0, type: DatePickerComponent, deps: [{ token: i1$2.BreakpointObserver }], target: i0.ɵɵFactoryTarget.Component });
6857
- DatePickerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.3", 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 ?? 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 && startDateElementRef.value && !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"] }] });
6921
+ DatePickerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.3", type: DatePickerComponent, selector: "c-date-picker", inputs: { placeholder: "placeholder", date: "date" }, outputs: { startDateChange: "dateChange" }, providers: [
6922
+ {
6923
+ provide: NG_VALUE_ACCESSOR,
6924
+ useExisting: forwardRef(() => DatePickerComponent),
6925
+ multi: true
6926
+ }
6927
+ ], 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 ?? 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 && startDateElementRef.value && !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"] }] });
6858
6928
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.3", ngImport: i0, type: DatePickerComponent, decorators: [{
6859
6929
  type: Component,
6860
- 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 ?? 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 && startDateElementRef.value && !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" }]
6930
+ args: [{ selector: 'c-date-picker', exportAs: 'cDatePicker', providers: [
6931
+ {
6932
+ provide: NG_VALUE_ACCESSOR,
6933
+ useExisting: forwardRef(() => DatePickerComponent),
6934
+ multi: true
6935
+ }
6936
+ ], 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 ?? 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 && startDateElementRef.value && !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" }]
6861
6937
  }], ctorParameters: function () { return [{ type: i1$2.BreakpointObserver }]; }, propDecorators: { placeholder: [{
6862
6938
  type: Input
6863
- }], date: [{
6864
- type: Input
6865
6939
  }], startDateChange: [{
6866
6940
  type: Output,
6867
6941
  args: ['dateChange']
6942
+ }], date: [{
6943
+ type: Input
6868
6944
  }] } });
6869
6945
 
6870
6946
  class DatePickerModule {
@@ -12704,6 +12780,17 @@ class SmartTableComponent {
12704
12780
  get sorterValue() {
12705
12781
  return this._sorterValue;
12706
12782
  }
12783
+ set tableFilter(filter) {
12784
+ this._tableFilter = filter;
12785
+ if (typeof filter === 'object') {
12786
+ this.tableFilterLabel = typeof filter.label === 'string' ? filter.label : this.tableFilterLabel;
12787
+ this.tableFilterPlaceholder = typeof filter.placeholder === 'string' ? filter.placeholder : this.tableFilterPlaceholder;
12788
+ this.tableFilterValue = typeof filter.value === 'string' ? filter.value : this.tableFilterValue;
12789
+ }
12790
+ }
12791
+ get tableFilter() {
12792
+ return this._tableFilter;
12793
+ }
12707
12794
  set tableFilterValue(value) {
12708
12795
  if (this._tableFilterValue !== value) {
12709
12796
  this._tableFilterValue = value;