@coreui/angular-pro 4.3.7 → 4.3.8
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/LICENSE +1 -1
- package/README.md +1 -1
- 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 +25 -4
- package/esm2020/lib/dropdown/dropdown/dropdown.component.mjs +23 -15
- package/esm2020/lib/multi-select/multi-select-tag/multi-select-tag.component.mjs +4 -23
- package/esm2020/lib/tabs/tab-content/tab-content.component.mjs +2 -2
- package/fesm2015/coreui-angular-pro.mjs +50 -42
- package/fesm2015/coreui-angular-pro.mjs.map +1 -1
- package/fesm2020/coreui-angular-pro.mjs +50 -42
- package/fesm2020/coreui-angular-pro.mjs.map +1 -1
- package/lib/date-range-picker/date-range-picker/date-range-picker.component.d.ts +10 -1
- package/lib/dropdown/dropdown/dropdown.component.d.ts +4 -3
- package/lib/multi-select/multi-select-tag/multi-select-tag.component.d.ts +3 -7
- package/lib/tabs/tab-content/tab-content.component.d.ts +1 -1
- package/package.json +1 -1
|
@@ -10,12 +10,12 @@ import { NavigationEnd, RouterModule } from '@angular/router';
|
|
|
10
10
|
import { BehaviorSubject, Observable, fromEvent, zipWith, withLatestFrom, Subject, distinctUntilChanged, takeUntil, map, debounceTime } from 'rxjs';
|
|
11
11
|
import { filter } from 'rxjs/operators';
|
|
12
12
|
import { isValid, format } from 'date-fns';
|
|
13
|
+
import { __classPrivateFieldSet, __classPrivateFieldGet, __rest } from 'tslib';
|
|
13
14
|
import * as i2 from '@angular/forms';
|
|
14
15
|
import { FormGroup, FormControl, Validators, NG_VALUE_ACCESSOR, ReactiveFormsModule, FormsModule } from '@angular/forms';
|
|
15
16
|
import * as i1$2 from '@angular/cdk/layout';
|
|
16
17
|
import { Breakpoints } from '@angular/cdk/layout';
|
|
17
18
|
import { createPopper } from '@popperjs/core';
|
|
18
|
-
import { __classPrivateFieldGet, __classPrivateFieldSet, __rest } from 'tslib';
|
|
19
19
|
import * as i1$3 from '@angular/cdk/a11y';
|
|
20
20
|
import { FocusKeyManager, A11yModule } from '@angular/cdk/a11y';
|
|
21
21
|
import * as i5 from '@coreui/icons-angular';
|
|
@@ -4134,6 +4134,7 @@ class DropdownComponent {
|
|
|
4134
4134
|
this.dropdownContext = { $implicit: this.visible };
|
|
4135
4135
|
this.activeTrap = false;
|
|
4136
4136
|
this.listeners = [];
|
|
4137
|
+
this.dropdownStateSubscribe();
|
|
4137
4138
|
}
|
|
4138
4139
|
/**
|
|
4139
4140
|
* Sets a darker color scheme to match a dark navbar.
|
|
@@ -4203,10 +4204,12 @@ class DropdownComponent {
|
|
|
4203
4204
|
*/
|
|
4204
4205
|
set visible(value) {
|
|
4205
4206
|
const _value = coerceBooleanProperty(value);
|
|
4206
|
-
this.
|
|
4207
|
-
|
|
4208
|
-
|
|
4209
|
-
|
|
4207
|
+
if (_value !== this._visible) {
|
|
4208
|
+
this.activeTrap = _value;
|
|
4209
|
+
this._visible = _value;
|
|
4210
|
+
_value ? this.createPopperInstance() : this.destroyPopperInstance();
|
|
4211
|
+
this.visibleChange.emit(_value);
|
|
4212
|
+
}
|
|
4210
4213
|
}
|
|
4211
4214
|
get visible() {
|
|
4212
4215
|
return this._visible;
|
|
@@ -4231,13 +4234,13 @@ class DropdownComponent {
|
|
|
4231
4234
|
dropdownStateSubscribe(subscribe = true) {
|
|
4232
4235
|
if (subscribe) {
|
|
4233
4236
|
this.dropdownStateSubscription =
|
|
4234
|
-
this.dropdownService.dropdownState$.
|
|
4235
|
-
|
|
4236
|
-
|
|
4237
|
-
|
|
4238
|
-
|
|
4239
|
-
|
|
4240
|
-
|
|
4237
|
+
this.dropdownService.dropdownState$.pipe(filter((state) => {
|
|
4238
|
+
return this === state.dropdown;
|
|
4239
|
+
})).subscribe((state) => {
|
|
4240
|
+
if ('visible' in state) {
|
|
4241
|
+
(state === null || state === void 0 ? void 0 : state.visible) === 'toggle'
|
|
4242
|
+
? this.toggleDropdown()
|
|
4243
|
+
: (this.visible = state.visible);
|
|
4241
4244
|
}
|
|
4242
4245
|
});
|
|
4243
4246
|
}
|
|
@@ -4260,9 +4263,13 @@ class DropdownComponent {
|
|
|
4260
4263
|
}
|
|
4261
4264
|
}
|
|
4262
4265
|
ngOnInit() {
|
|
4263
|
-
this.dropdownStateSubscribe();
|
|
4264
4266
|
this.setVisibleState(this.visible);
|
|
4265
4267
|
}
|
|
4268
|
+
ngOnChanges(changes) {
|
|
4269
|
+
if (changes['visible'] && !changes['visible'].firstChange) {
|
|
4270
|
+
this.setVisibleState(changes['visible'].currentValue);
|
|
4271
|
+
}
|
|
4272
|
+
}
|
|
4266
4273
|
ngOnDestroy() {
|
|
4267
4274
|
this.clearListeners();
|
|
4268
4275
|
this.dropdownStateSubscribe(false);
|
|
@@ -4343,7 +4350,7 @@ class DropdownComponent {
|
|
|
4343
4350
|
}
|
|
4344
4351
|
}
|
|
4345
4352
|
DropdownComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.0", ngImport: i0, type: DropdownComponent, deps: [{ token: DOCUMENT }, { token: i0.ElementRef }, { token: i0.Renderer2 }, { token: i0.NgZone }, { token: i0.ChangeDetectorRef }, { token: DropdownService }], target: i0.ɵɵFactoryTarget.Component });
|
|
4346
|
-
DropdownComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.1.0", type: DropdownComponent, selector: "c-dropdown", inputs: { alignment: "alignment", autoClose: "autoClose", dark: "dark", direction: "direction", placement: "placement", popper: "popper", popperOptions: "popperOptions", variant: "variant", visible: "visible" }, outputs: { visibleChange: "visibleChange" }, host: { listeners: { "click": "onHostClick($event)" }, properties: { "class": "this.hostClasses", "style": "this.hostStyle" } }, providers: [DropdownService], queries: [{ propertyName: "_toggler", first: true, predicate: DropdownToggleDirective, descendants: true }, { propertyName: "_menu", first: true, predicate: DropdownMenuDirective, descendants: true }, { propertyName: "_menuElementRef", first: true, predicate: DropdownMenuDirective, descendants: true, read: ElementRef }], exportAs: ["cDropdown"], ngImport: i0, template: '<ng-content></ng-content>', isInline: true, styles: [":host-context(.dropdown,.dropup):not(.btn-group){display:block}:host-context(.dropstart,.dropend):not(.btn-group){display:inline-flex}:host-context(html:not([dir=rtl])) :host-context(.input-group) :host:first-child::ng-deep :first-child{border-top-right-radius:0;border-bottom-right-radius:0}:host-context(html:not([dir=rtl])) :host-context(.input-group) :host:first-child::ng-deep :not(:first-child):not(.dropdown-menu){margin-left:-1px;border-top-left-radius:0;border-bottom-left-radius:0}:host-context(html:not([dir=rtl])) :host-context(.input-group) :host:first-child::ng-deep :not(:first-child):not(.dropdown-menu):not(:only-of-type){border-top-right-radius:0;border-bottom-right-radius:0}:host-context(html:not([dir=rtl])) :host-context(.input-group) :host:last-child::ng-deep :first-child{border-top-left-radius:0;border-bottom-left-radius:0}:host-context(html:not([dir=rtl])) :host-context(.input-group) :host:last-child::ng-deep :first-child:not(:only-of-type){border-top-right-radius:0;border-bottom-right-radius:0}:host-context(html:not([dir=rtl])) :host-context(.input-group) :host:last-child::ng-deep :not(:first-child):not(.dropdown-menu){margin-left:-1px;border-top-left-radius:0;border-bottom-left-radius:0}:host-context([dir=rtl] .input-group) :host{direction:rtl}:host-context([dir=rtl] .input-group) :host:first-child::ng-deep :first-child{border-top-left-radius:0;border-bottom-left-radius:0}:host-context([dir=rtl] .input-group) :host:first-child::ng-deep :not(:first-child):not(.dropdown-menu){margin-right:-1px;border-top-right-radius:0;border-bottom-right-radius:0}:host-context([dir=rtl] .input-group) :host:first-child::ng-deep :not(:first-child):not(.dropdown-menu):not(:only-of-type){border-top-left-radius:0;border-bottom-left-radius:0}:host-context([dir=rtl] .input-group) :host:last-child::ng-deep :first-child{border-top-right-radius:0;border-bottom-right-radius:0}:host-context([dir=rtl] .input-group) :host:last-child::ng-deep :first-child:not(:only-of-type){border-top-left-radius:0;border-bottom-left-radius:0}:host-context([dir=rtl] .input-group) :host:last-child::ng-deep :not(:first-child):not(.dropdown-menu){margin-right:-1px;border-top-right-radius:0;border-bottom-right-radius:0}\n"] });
|
|
4353
|
+
DropdownComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.1.0", type: DropdownComponent, selector: "c-dropdown", inputs: { alignment: "alignment", autoClose: "autoClose", dark: "dark", direction: "direction", placement: "placement", popper: "popper", popperOptions: "popperOptions", variant: "variant", visible: "visible" }, outputs: { visibleChange: "visibleChange" }, host: { listeners: { "click": "onHostClick($event)" }, properties: { "class": "this.hostClasses", "style": "this.hostStyle" } }, providers: [DropdownService], queries: [{ propertyName: "_toggler", first: true, predicate: DropdownToggleDirective, descendants: true }, { propertyName: "_menu", first: true, predicate: DropdownMenuDirective, descendants: true }, { propertyName: "_menuElementRef", first: true, predicate: DropdownMenuDirective, descendants: true, read: ElementRef }], exportAs: ["cDropdown"], usesOnChanges: true, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, styles: [":host-context(.dropdown,.dropup):not(.btn-group){display:block}:host-context(.dropstart,.dropend):not(.btn-group){display:inline-flex}:host-context(html:not([dir=rtl])) :host-context(.input-group) :host:first-child::ng-deep :first-child{border-top-right-radius:0;border-bottom-right-radius:0}:host-context(html:not([dir=rtl])) :host-context(.input-group) :host:first-child::ng-deep :not(:first-child):not(.dropdown-menu){margin-left:-1px;border-top-left-radius:0;border-bottom-left-radius:0}:host-context(html:not([dir=rtl])) :host-context(.input-group) :host:first-child::ng-deep :not(:first-child):not(.dropdown-menu):not(:only-of-type){border-top-right-radius:0;border-bottom-right-radius:0}:host-context(html:not([dir=rtl])) :host-context(.input-group) :host:last-child::ng-deep :first-child{border-top-left-radius:0;border-bottom-left-radius:0}:host-context(html:not([dir=rtl])) :host-context(.input-group) :host:last-child::ng-deep :first-child:not(:only-of-type){border-top-right-radius:0;border-bottom-right-radius:0}:host-context(html:not([dir=rtl])) :host-context(.input-group) :host:last-child::ng-deep :not(:first-child):not(.dropdown-menu){margin-left:-1px;border-top-left-radius:0;border-bottom-left-radius:0}:host-context([dir=rtl] .input-group) :host{direction:rtl}:host-context([dir=rtl] .input-group) :host:first-child::ng-deep :first-child{border-top-left-radius:0;border-bottom-left-radius:0}:host-context([dir=rtl] .input-group) :host:first-child::ng-deep :not(:first-child):not(.dropdown-menu){margin-right:-1px;border-top-right-radius:0;border-bottom-right-radius:0}:host-context([dir=rtl] .input-group) :host:first-child::ng-deep :not(:first-child):not(.dropdown-menu):not(:only-of-type){border-top-left-radius:0;border-bottom-left-radius:0}:host-context([dir=rtl] .input-group) :host:last-child::ng-deep :first-child{border-top-right-radius:0;border-bottom-right-radius:0}:host-context([dir=rtl] .input-group) :host:last-child::ng-deep :first-child:not(:only-of-type){border-top-left-radius:0;border-bottom-left-radius:0}:host-context([dir=rtl] .input-group) :host:last-child::ng-deep :not(:first-child):not(.dropdown-menu){margin-right:-1px;border-top-right-radius:0;border-bottom-right-radius:0}\n"] });
|
|
4347
4354
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.0", ngImport: i0, type: DropdownComponent, decorators: [{
|
|
4348
4355
|
type: Component,
|
|
4349
4356
|
args: [{ selector: 'c-dropdown', template: '<ng-content></ng-content>', exportAs: 'cDropdown', providers: [DropdownService], styles: [":host-context(.dropdown,.dropup):not(.btn-group){display:block}:host-context(.dropstart,.dropend):not(.btn-group){display:inline-flex}:host-context(html:not([dir=rtl])) :host-context(.input-group) :host:first-child::ng-deep :first-child{border-top-right-radius:0;border-bottom-right-radius:0}:host-context(html:not([dir=rtl])) :host-context(.input-group) :host:first-child::ng-deep :not(:first-child):not(.dropdown-menu){margin-left:-1px;border-top-left-radius:0;border-bottom-left-radius:0}:host-context(html:not([dir=rtl])) :host-context(.input-group) :host:first-child::ng-deep :not(:first-child):not(.dropdown-menu):not(:only-of-type){border-top-right-radius:0;border-bottom-right-radius:0}:host-context(html:not([dir=rtl])) :host-context(.input-group) :host:last-child::ng-deep :first-child{border-top-left-radius:0;border-bottom-left-radius:0}:host-context(html:not([dir=rtl])) :host-context(.input-group) :host:last-child::ng-deep :first-child:not(:only-of-type){border-top-right-radius:0;border-bottom-right-radius:0}:host-context(html:not([dir=rtl])) :host-context(.input-group) :host:last-child::ng-deep :not(:first-child):not(.dropdown-menu){margin-left:-1px;border-top-left-radius:0;border-bottom-left-radius:0}:host-context([dir=rtl] .input-group) :host{direction:rtl}:host-context([dir=rtl] .input-group) :host:first-child::ng-deep :first-child{border-top-left-radius:0;border-bottom-left-radius:0}:host-context([dir=rtl] .input-group) :host:first-child::ng-deep :not(:first-child):not(.dropdown-menu){margin-right:-1px;border-top-right-radius:0;border-bottom-right-radius:0}:host-context([dir=rtl] .input-group) :host:first-child::ng-deep :not(:first-child):not(.dropdown-menu):not(:only-of-type){border-top-left-radius:0;border-bottom-left-radius:0}:host-context([dir=rtl] .input-group) :host:last-child::ng-deep :first-child{border-top-right-radius:0;border-bottom-right-radius:0}:host-context([dir=rtl] .input-group) :host:last-child::ng-deep :first-child:not(:only-of-type){border-top-left-radius:0;border-bottom-left-radius:0}:host-context([dir=rtl] .input-group) :host:last-child::ng-deep :not(:first-child):not(.dropdown-menu){margin-right:-1px;border-top-right-radius:0;border-bottom-right-radius:0}\n"] }]
|
|
@@ -6038,6 +6045,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.0", ngImpor
|
|
|
6038
6045
|
args: [TemplateIdDirective, { descendants: true }]
|
|
6039
6046
|
}] } });
|
|
6040
6047
|
|
|
6048
|
+
var _DateRangePickerComponent_closeOnSelect;
|
|
6041
6049
|
/** Must be a valid date string */
|
|
6042
6050
|
// todo: validation
|
|
6043
6051
|
// export function invalidDateStringValidator(locale: string): ValidatorFn {
|
|
@@ -6065,6 +6073,7 @@ class DateRangePickerComponent {
|
|
|
6065
6073
|
this.dayFormat = 'numeric';
|
|
6066
6074
|
this._calendars = 2;
|
|
6067
6075
|
this._cleaner = true;
|
|
6076
|
+
_DateRangePickerComponent_closeOnSelect.set(this, false);
|
|
6068
6077
|
this._indicator = true;
|
|
6069
6078
|
this._inputReadOnly = false;
|
|
6070
6079
|
this._navYearFirst = false;
|
|
@@ -6167,6 +6176,17 @@ class DateRangePickerComponent {
|
|
|
6167
6176
|
get cleaner() {
|
|
6168
6177
|
return this._cleaner;
|
|
6169
6178
|
}
|
|
6179
|
+
/**
|
|
6180
|
+
* Determine if the dropdown should be closed after value setting.
|
|
6181
|
+
* @type boolean
|
|
6182
|
+
* @default false
|
|
6183
|
+
*/
|
|
6184
|
+
set closeOnSelect(value) {
|
|
6185
|
+
__classPrivateFieldSet(this, _DateRangePickerComponent_closeOnSelect, coerceBooleanProperty(value), "f");
|
|
6186
|
+
}
|
|
6187
|
+
get closeOnSelect() {
|
|
6188
|
+
return __classPrivateFieldGet(this, _DateRangePickerComponent_closeOnSelect, "f");
|
|
6189
|
+
}
|
|
6170
6190
|
/**
|
|
6171
6191
|
* Toggle visibility or set the content of the input indicator.
|
|
6172
6192
|
* @type boolean
|
|
@@ -6300,6 +6320,10 @@ class DateRangePickerComponent {
|
|
|
6300
6320
|
this.onChange(newValue);
|
|
6301
6321
|
this.onTouched();
|
|
6302
6322
|
this.valueChange.emit(this.value);
|
|
6323
|
+
if (this.closeOnSelect) {
|
|
6324
|
+
const hasValue = this.range ? !!(this.value.startDate && this.value.endDate) : !!this.value;
|
|
6325
|
+
this.visible = !hasValue;
|
|
6326
|
+
}
|
|
6303
6327
|
}
|
|
6304
6328
|
}
|
|
6305
6329
|
get value() {
|
|
@@ -6531,14 +6555,15 @@ class DateRangePickerComponent {
|
|
|
6531
6555
|
this.endDate = time !== null && time !== void 0 ? time : this.endDate;
|
|
6532
6556
|
}
|
|
6533
6557
|
}
|
|
6558
|
+
_DateRangePickerComponent_closeOnSelect = new WeakMap();
|
|
6534
6559
|
DateRangePickerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.0", ngImport: i0, type: DateRangePickerComponent, deps: [{ token: i1$2.BreakpointObserver }], target: i0.ɵɵFactoryTarget.Component });
|
|
6535
|
-
DateRangePickerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.1.0", type: DateRangePickerComponent, selector: "c-date-range-picker", inputs: { dayFormat: "dayFormat", calendars: "calendars", cleaner: "cleaner", format: "format", indicator: "indicator", inputReadOnly: "inputReadOnly", navYearFirst: "navYearFirst", placeholder: "placeholder", ranges: "ranges", rangesButtonsColor: "rangesButtonsColor", rangesButtonsSize: "rangesButtonsSize", rangesButtonsVariant: "rangesButtonsVariant", separator: "separator", size: "size", timepicker: "timepicker", valid: "valid", visible: "visible", startDate: "startDate", endDate: "endDate", calendarDate: "calendarDate", disabledDates: "disabledDates", firstDayOfWeek: "firstDayOfWeek", locale: "locale", maxDate: "maxDate", minDate: "minDate", navigation: "navigation", range: "range", dateFilter: "dateFilter", disabled: "disabled", value: "value", weekdayFormat: "weekdayFormat", popperjsOptions: ["popperOptions", "popperjsOptions"] }, outputs: { valueChange: "valueChange", calendarCellHover: "calendarCellHover", calendarDateChange: "calendarDateChange", endDateChange: "endDateChange", startDateChange: "startDateChange" }, host: { listeners: { "blur": "onBlur()" } }, providers: [
|
|
6560
|
+
DateRangePickerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.1.0", type: DateRangePickerComponent, selector: "c-date-range-picker", inputs: { dayFormat: "dayFormat", calendars: "calendars", cleaner: "cleaner", closeOnSelect: "closeOnSelect", format: "format", indicator: "indicator", inputReadOnly: "inputReadOnly", navYearFirst: "navYearFirst", placeholder: "placeholder", ranges: "ranges", rangesButtonsColor: "rangesButtonsColor", rangesButtonsSize: "rangesButtonsSize", rangesButtonsVariant: "rangesButtonsVariant", separator: "separator", size: "size", timepicker: "timepicker", valid: "valid", visible: "visible", startDate: "startDate", endDate: "endDate", calendarDate: "calendarDate", disabledDates: "disabledDates", firstDayOfWeek: "firstDayOfWeek", locale: "locale", maxDate: "maxDate", minDate: "minDate", navigation: "navigation", range: "range", dateFilter: "dateFilter", disabled: "disabled", value: "value", weekdayFormat: "weekdayFormat", popperjsOptions: ["popperOptions", "popperjsOptions"] }, outputs: { valueChange: "valueChange", calendarCellHover: "calendarCellHover", calendarDateChange: "calendarDateChange", endDateChange: "endDateChange", startDateChange: "startDateChange" }, host: { listeners: { "blur": "onBlur()" } }, providers: [
|
|
6536
6561
|
{
|
|
6537
6562
|
provide: NG_VALUE_ACCESSOR,
|
|
6538
6563
|
useExisting: forwardRef(() => DateRangePickerComponent),
|
|
6539
6564
|
multi: true
|
|
6540
6565
|
}
|
|
6541
|
-
], queries: [{ propertyName: "contentTemplates", predicate: TemplateIdDirective, descendants: true }], viewQueries: [{ 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\" [ngClass]=\"datePickerClasses\" [visible]=\"visible\" [popperOptions]=\"popperjsOptions\">\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 [valid]=\"range ? undefined : valid\"\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 [valid]=\"valid\"\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", "valid", "visible"], outputs: ["timeChange"], exportAs: ["cTimePicker"] }] });
|
|
6566
|
+
], queries: [{ propertyName: "contentTemplates", predicate: TemplateIdDirective, descendants: true }], viewQueries: [{ 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\" [ngClass]=\"datePickerClasses\" [(visible)]=\"visible\" [popperOptions]=\"popperjsOptions\">\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 [valid]=\"range ? undefined : valid\"\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 [valid]=\"valid\"\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", "valid", "visible"], outputs: ["timeChange"], exportAs: ["cTimePicker"] }] });
|
|
6542
6567
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.0", ngImport: i0, type: DateRangePickerComponent, decorators: [{
|
|
6543
6568
|
type: Component,
|
|
6544
6569
|
args: [{ selector: 'c-date-range-picker', exportAs: 'cDateRangePicker', providers: [
|
|
@@ -6547,13 +6572,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.0", ngImpor
|
|
|
6547
6572
|
useExisting: forwardRef(() => DateRangePickerComponent),
|
|
6548
6573
|
multi: true
|
|
6549
6574
|
}
|
|
6550
|
-
], template: "<c-dropdown #dropdown=\"cDropdown\" [autoClose]=\"'outside'\" class=\"date-picker picker\" [ngClass]=\"datePickerClasses\" [visible]=\"visible\" [popperOptions]=\"popperjsOptions\">\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 [valid]=\"range ? undefined : valid\"\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 [valid]=\"valid\"\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" }]
|
|
6575
|
+
], template: "<c-dropdown #dropdown=\"cDropdown\" [autoClose]=\"'outside'\" class=\"date-picker picker\" [ngClass]=\"datePickerClasses\" [(visible)]=\"visible\" [popperOptions]=\"popperjsOptions\">\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 [valid]=\"range ? undefined : valid\"\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 [valid]=\"valid\"\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" }]
|
|
6551
6576
|
}], ctorParameters: function () { return [{ type: i1$2.BreakpointObserver }]; }, propDecorators: { dayFormat: [{
|
|
6552
6577
|
type: Input
|
|
6553
6578
|
}], calendars: [{
|
|
6554
6579
|
type: Input
|
|
6555
6580
|
}], cleaner: [{
|
|
6556
6581
|
type: Input
|
|
6582
|
+
}], closeOnSelect: [{
|
|
6583
|
+
type: Input
|
|
6557
6584
|
}], format: [{
|
|
6558
6585
|
type: Input
|
|
6559
6586
|
}], indicator: [{
|
|
@@ -7146,7 +7173,7 @@ DatePickerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", ve
|
|
|
7146
7173
|
useExisting: forwardRef(() => DatePickerComponent),
|
|
7147
7174
|
multi: true
|
|
7148
7175
|
}
|
|
7149
|
-
], exportAs: ["cDatePicker"], usesInheritance: true, ngImport: i0, template: "<c-dropdown #dropdown=\"cDropdown\" [autoClose]=\"'outside'\" class=\"date-picker picker\" [ngClass]=\"datePickerClasses\" [visible]=\"visible\" [popperOptions]=\"popperjsOptions\">\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 [valid]=\"range ? undefined : valid\"\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 [valid]=\"valid\"\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", "valid", "visible"], outputs: ["timeChange"], exportAs: ["cTimePicker"] }] });
|
|
7176
|
+
], exportAs: ["cDatePicker"], usesInheritance: true, ngImport: i0, template: "<c-dropdown #dropdown=\"cDropdown\" [autoClose]=\"'outside'\" class=\"date-picker picker\" [ngClass]=\"datePickerClasses\" [(visible)]=\"visible\" [popperOptions]=\"popperjsOptions\">\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 [valid]=\"range ? undefined : valid\"\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 [valid]=\"valid\"\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", "valid", "visible"], outputs: ["timeChange"], exportAs: ["cTimePicker"] }] });
|
|
7150
7177
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.0", ngImport: i0, type: DatePickerComponent, decorators: [{
|
|
7151
7178
|
type: Component,
|
|
7152
7179
|
args: [{ selector: 'c-date-picker', exportAs: 'cDatePicker', providers: [
|
|
@@ -7155,7 +7182,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.0", ngImpor
|
|
|
7155
7182
|
useExisting: forwardRef(() => DatePickerComponent),
|
|
7156
7183
|
multi: true
|
|
7157
7184
|
}
|
|
7158
|
-
], template: "<c-dropdown #dropdown=\"cDropdown\" [autoClose]=\"'outside'\" class=\"date-picker picker\" [ngClass]=\"datePickerClasses\" [visible]=\"visible\" [popperOptions]=\"popperjsOptions\">\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 [valid]=\"range ? undefined : valid\"\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 [valid]=\"valid\"\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" }]
|
|
7185
|
+
], template: "<c-dropdown #dropdown=\"cDropdown\" [autoClose]=\"'outside'\" class=\"date-picker picker\" [ngClass]=\"datePickerClasses\" [(visible)]=\"visible\" [popperOptions]=\"popperjsOptions\">\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 [valid]=\"range ? undefined : valid\"\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 [valid]=\"valid\"\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" }]
|
|
7159
7186
|
}], ctorParameters: function () { return [{ type: i1$2.BreakpointObserver }]; }, propDecorators: { placeholder: [{
|
|
7160
7187
|
type: Input
|
|
7161
7188
|
}], startDateChange: [{
|
|
@@ -8567,7 +8594,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.0", ngImpor
|
|
|
8567
8594
|
class MultiSelectTagComponent {
|
|
8568
8595
|
constructor(multiSelectService) {
|
|
8569
8596
|
this.multiSelectService = multiSelectService;
|
|
8570
|
-
this.multiselectVisible =
|
|
8597
|
+
this.multiselectVisible$ = this.multiSelectService.multiSelectVisible$;
|
|
8571
8598
|
this.remove = new EventEmitter();
|
|
8572
8599
|
}
|
|
8573
8600
|
get hostClasses() {
|
|
@@ -8575,37 +8602,18 @@ class MultiSelectTagComponent {
|
|
|
8575
8602
|
'form-multi-select-tag': true
|
|
8576
8603
|
};
|
|
8577
8604
|
}
|
|
8578
|
-
ngOnInit() {
|
|
8579
|
-
this.multiselectSubscribe();
|
|
8580
|
-
}
|
|
8581
|
-
ngOnDestroy() {
|
|
8582
|
-
this.multiselectSubscribe(false);
|
|
8583
|
-
}
|
|
8584
8605
|
handleRemove($event) {
|
|
8585
8606
|
if (this.option) {
|
|
8586
8607
|
this.option.selected = false;
|
|
8587
8608
|
this.remove.emit(this.option);
|
|
8588
8609
|
}
|
|
8589
8610
|
}
|
|
8590
|
-
multiselectSubscribe(subscribe = true) {
|
|
8591
|
-
if (subscribe) {
|
|
8592
|
-
this.multiselectVisibleSubscription =
|
|
8593
|
-
this.multiSelectService.multiSelectVisible$.subscribe((visible) => {
|
|
8594
|
-
setTimeout(() => {
|
|
8595
|
-
this.multiselectVisible = visible;
|
|
8596
|
-
});
|
|
8597
|
-
});
|
|
8598
|
-
}
|
|
8599
|
-
else {
|
|
8600
|
-
this.multiselectVisibleSubscription.unsubscribe();
|
|
8601
|
-
}
|
|
8602
|
-
}
|
|
8603
8611
|
}
|
|
8604
8612
|
MultiSelectTagComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.0", ngImport: i0, type: MultiSelectTagComponent, deps: [{ token: MultiSelectService }], target: i0.ɵɵFactoryTarget.Component });
|
|
8605
|
-
MultiSelectTagComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.1.0", type: MultiSelectTagComponent, selector: "c-multi-select-tag", inputs: { option: "option" }, outputs: { remove: "remove" }, host: { properties: { "class": "this.hostClasses" } }, ngImport: i0, template: "<ng-template [ngIfElse]=\"elseContent\"\n [ngIf]=\"!!option\">{{option.label ?? option.value ?? 'undefined'}}</ng-template>\n<ng-template #elseContent>\n <ng-content></ng-content>\n</ng-template>\n<button (click)=\"handleRemove($event)\" *ngIf=\"!option?.disabled\"
|
|
8613
|
+
MultiSelectTagComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.1.0", type: MultiSelectTagComponent, selector: "c-multi-select-tag", inputs: { option: "option" }, outputs: { remove: "remove" }, host: { properties: { "class": "this.hostClasses" } }, ngImport: i0, template: "<ng-template [ngIfElse]=\"elseContent\"\n [ngIf]=\"!!option\">{{option.label ?? option.value ?? 'undefined'}}\n</ng-template>\n<ng-template #elseContent>\n <ng-content></ng-content>\n</ng-template>\n<button (click)=\"handleRemove($event)\" *ngIf=\"!option?.disabled\"\n [disabled]=\"((multiselectVisible$ | async) ?? false) === false\" aria-label=\"Clear\"\n class=\"form-multi-select-tag-delete close\" type=\"button\">\n <span aria-hidden=\"true\">\u00D7</span>\n</button>\n", styles: [":host .btn-xs{padding-left:.125rem;padding-right:.125rem;font-size:.575rem;border-radius:.2rem}:host.form-multi-select-tag{-webkit-user-select:none;user-select:none;pointer-events:all}\n"], dependencies: [{ kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i1$1.AsyncPipe, name: "async" }] });
|
|
8606
8614
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.0", ngImport: i0, type: MultiSelectTagComponent, decorators: [{
|
|
8607
8615
|
type: Component,
|
|
8608
|
-
args: [{ selector: 'c-multi-select-tag', template: "<ng-template [ngIfElse]=\"elseContent\"\n [ngIf]=\"!!option\">{{option.label ?? option.value ?? 'undefined'}}</ng-template>\n<ng-template #elseContent>\n <ng-content></ng-content>\n</ng-template>\n<button (click)=\"handleRemove($event)\" *ngIf=\"!option?.disabled\"
|
|
8616
|
+
args: [{ selector: 'c-multi-select-tag', template: "<ng-template [ngIfElse]=\"elseContent\"\n [ngIf]=\"!!option\">{{option.label ?? option.value ?? 'undefined'}}\n</ng-template>\n<ng-template #elseContent>\n <ng-content></ng-content>\n</ng-template>\n<button (click)=\"handleRemove($event)\" *ngIf=\"!option?.disabled\"\n [disabled]=\"((multiselectVisible$ | async) ?? false) === false\" aria-label=\"Clear\"\n class=\"form-multi-select-tag-delete close\" type=\"button\">\n <span aria-hidden=\"true\">\u00D7</span>\n</button>\n", styles: [":host .btn-xs{padding-left:.125rem;padding-right:.125rem;font-size:.575rem;border-radius:.2rem}:host.form-multi-select-tag{-webkit-user-select:none;user-select:none;pointer-events:all}\n"] }]
|
|
8609
8617
|
}], ctorParameters: function () { return [{ type: MultiSelectService }]; }, propDecorators: { option: [{
|
|
8610
8618
|
type: Input
|
|
8611
8619
|
}], remove: [{
|
|
@@ -14080,7 +14088,7 @@ class TabContentComponent {
|
|
|
14080
14088
|
this.tabService = tabService;
|
|
14081
14089
|
this._activeTabPaneIdx = -1;
|
|
14082
14090
|
/**
|
|
14083
|
-
* Event
|
|
14091
|
+
* Event emitted on the active tab pane index change.
|
|
14084
14092
|
*/
|
|
14085
14093
|
this.activeTabPaneIdxChange = new EventEmitter();
|
|
14086
14094
|
}
|