@porscheinformatik/clr-addons 15.0.0 → 15.2.0
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/clr-addons.module.d.ts +2 -1
- package/datagrid/datagrid-state-persistence/datagrid-state-persistence-model.interface.d.ts +2 -0
- package/datagrid/datagrid-state-persistence/index.d.ts +1 -0
- package/datagrid/datagrid-state-persistence/state-persistence-key.directive.d.ts +13 -4
- package/datagrid/datagrid-state-persistence/state-persistence-options.interface.d.ts +8 -0
- package/daterangepicker/daterange.constants.d.ts +21 -0
- package/daterangepicker/daterangepicker.module.d.ts +17 -0
- package/daterangepicker/directives/abstract-container.component.d.ts +53 -0
- package/daterangepicker/directives/datepicker/datepicker.component.d.ts +65 -0
- package/daterangepicker/directives/daterangepicker/daterangepicker.directive.d.ts +127 -0
- package/daterangepicker/directives/daterangepicker-container/daterangepicker-container.component.d.ts +118 -0
- package/daterangepicker/directives/if-daterange-error.directive.d.ts +40 -0
- package/daterangepicker/index.d.ts +13 -0
- package/daterangepicker/interfaces/daterange-preset.interface.d.ts +8 -0
- package/daterangepicker/interfaces/daterange.interface.d.ts +12 -0
- package/daterangepicker/models/day.model.d.ts +80 -0
- package/daterangepicker/models/popover-positions.model.d.ts +20 -0
- package/daterangepicker/providers/daterange-control-state.service.d.ts +42 -0
- package/daterangepicker/providers/daterange-parsing.service.d.ts +66 -0
- package/daterangepicker/providers/daterange.service.d.ts +38 -0
- package/daterangepicker/providers/opened-datepickers-tracker.service.d.ts +20 -0
- package/daterangepicker/validators/daterange-max.validator.d.ts +32 -0
- package/daterangepicker/validators/daterange-min.validator.d.ts +32 -0
- package/daterangepicker/validators/daterange-order.validator.d.ts +29 -0
- package/daterangepicker/validators/daterange-required.validator.d.ts +29 -0
- package/esm2020/clr-addons.module.mjs +8 -4
- package/esm2020/datagrid/datagrid-state-persistence/column-hidden-state-persistence.directive.mjs +3 -2
- package/esm2020/datagrid/datagrid-state-persistence/datagrid-state-persistence-model.interface.mjs +1 -1
- package/esm2020/datagrid/datagrid-state-persistence/index.mjs +2 -1
- package/esm2020/datagrid/datagrid-state-persistence/state-persistence-key.directive.mjs +58 -12
- package/esm2020/datagrid/datagrid-state-persistence/state-persistence-options.interface.mjs +2 -0
- package/esm2020/daterangepicker/daterange.constants.mjs +27 -0
- package/esm2020/daterangepicker/daterangepicker.module.mjs +58 -0
- package/esm2020/daterangepicker/directives/abstract-container.component.mjs +104 -0
- package/esm2020/daterangepicker/directives/datepicker/datepicker.component.mjs +97 -0
- package/esm2020/daterangepicker/directives/daterangepicker/daterangepicker.directive.mjs +256 -0
- package/esm2020/daterangepicker/directives/daterangepicker-container/daterangepicker-container.component.mjs +251 -0
- package/esm2020/daterangepicker/directives/if-daterange-error.directive.mjs +94 -0
- package/esm2020/daterangepicker/index.mjs +14 -0
- package/esm2020/daterangepicker/interfaces/daterange-preset.interface.mjs +2 -0
- package/esm2020/daterangepicker/interfaces/daterange.interface.mjs +2 -0
- package/esm2020/daterangepicker/models/day.model.mjs +99 -0
- package/esm2020/daterangepicker/models/popover-positions.model.mjs +66 -0
- package/esm2020/daterangepicker/providers/daterange-control-state.service.mjs +62 -0
- package/esm2020/daterangepicker/providers/daterange-parsing.service.mjs +206 -0
- package/esm2020/daterangepicker/providers/daterange.service.mjs +54 -0
- package/esm2020/daterangepicker/providers/opened-datepickers-tracker.service.mjs +36 -0
- package/esm2020/daterangepicker/validators/daterange-max.validator.mjs +85 -0
- package/esm2020/daterangepicker/validators/daterange-min.validator.mjs +85 -0
- package/esm2020/daterangepicker/validators/daterange-order.validator.mjs +75 -0
- package/esm2020/daterangepicker/validators/daterange-required.validator.mjs +71 -0
- package/esm2020/index.mjs +3 -2
- package/esm2020/searchfield/search-field.mjs +7 -5
- package/fesm2015/clr-addons.mjs +1977 -270
- package/fesm2015/clr-addons.mjs.map +1 -1
- package/fesm2020/clr-addons.mjs +1858 -177
- package/fesm2020/clr-addons.mjs.map +1 -1
- package/index.d.ts +1 -0
- package/package.json +3 -3
- package/searchfield/search-field.d.ts +2 -2
- package/styles/clr-addons-phs.css +0 -13
- package/styles/clr-addons-phs.css.map +1 -1
- package/styles/clr-addons-phs.min.css +1 -1
- package/styles/clr-addons-phs.min.css.map +1 -1
package/clr-addons.module.d.ts
CHANGED
|
@@ -29,8 +29,9 @@ import * as i27 from "./dropdown/clr-dropdown-overflow.module";
|
|
|
29
29
|
import * as i28 from "./datagrid/datagrid-state-persistence/datagrid-state-persistence.module";
|
|
30
30
|
import * as i29 from "./datagrid/enum-filter/enum-filter.module";
|
|
31
31
|
import * as i30 from "./datagrid/date-filter/date-filter.module";
|
|
32
|
+
import * as i31 from "./daterangepicker/daterangepicker.module";
|
|
32
33
|
export declare class ClrAddonsModule {
|
|
33
34
|
static ɵfac: i0.ɵɵFactoryDeclaration<ClrAddonsModule, never>;
|
|
34
|
-
static ɵmod: i0.ɵɵNgModuleDeclaration<ClrAddonsModule, never, never, [typeof i1.ClrViewEditSectionModule, typeof i2.ClrPagerModule, typeof i3.ClrDotPagerModule, typeof i4.ClrPagedSearchResultListModule, typeof i5.ClrCollapseExpandSectionModule, typeof i6.ClrBreadcrumbModule, typeof i7.ClrMainNavGroupModule, typeof i8.ClrContentPanelModule, typeof i9.ClrNotificationModule, typeof i10.ClrFlowBarModule, typeof i11.ClrBackButtonModule, typeof i12.ClrNumericFieldModule, typeof i13.ClrSearchFieldModule, typeof i14.ClrTreetableModule, typeof i15.ClrProgressSpinnerModule, typeof i16.ClrDateTimeModule, typeof i17.ClrQuickListModule, typeof i18.ClrLetterAvatarModule, typeof i19.ClrMultilingualModule, typeof i20.ClrGenericQuickListModule, typeof i21.ClrDataListValidatorModule, typeof i22.ClrHistoryModule, typeof i23.ClrAutocompleteOffModule, typeof i24.ClrBrandAvatarModule, typeof i25.ClrLocationBarModule, typeof i26.ClrFormModule, typeof i27.ClrDropdownOverflowModule, typeof i28.ClrDatagridStatePersistenceModule, typeof i29.ClrEnumFilterModule, typeof i30.ClrDateFilterModule]>;
|
|
35
|
+
static ɵmod: i0.ɵɵNgModuleDeclaration<ClrAddonsModule, never, never, [typeof i1.ClrViewEditSectionModule, typeof i2.ClrPagerModule, typeof i3.ClrDotPagerModule, typeof i4.ClrPagedSearchResultListModule, typeof i5.ClrCollapseExpandSectionModule, typeof i6.ClrBreadcrumbModule, typeof i7.ClrMainNavGroupModule, typeof i8.ClrContentPanelModule, typeof i9.ClrNotificationModule, typeof i10.ClrFlowBarModule, typeof i11.ClrBackButtonModule, typeof i12.ClrNumericFieldModule, typeof i13.ClrSearchFieldModule, typeof i14.ClrTreetableModule, typeof i15.ClrProgressSpinnerModule, typeof i16.ClrDateTimeModule, typeof i17.ClrQuickListModule, typeof i18.ClrLetterAvatarModule, typeof i19.ClrMultilingualModule, typeof i20.ClrGenericQuickListModule, typeof i21.ClrDataListValidatorModule, typeof i22.ClrHistoryModule, typeof i23.ClrAutocompleteOffModule, typeof i24.ClrBrandAvatarModule, typeof i25.ClrLocationBarModule, typeof i26.ClrFormModule, typeof i27.ClrDropdownOverflowModule, typeof i28.ClrDatagridStatePersistenceModule, typeof i29.ClrEnumFilterModule, typeof i30.ClrDateFilterModule, typeof i31.ClrDaterangepickerModule]>;
|
|
35
36
|
static ɵinj: i0.ɵɵInjectorDeclaration<ClrAddonsModule>;
|
|
36
37
|
}
|
|
@@ -2,13 +2,18 @@ import { AfterContentInit, ElementRef, OnDestroy, QueryList } from '@angular/cor
|
|
|
2
2
|
import { ClrDatagrid, ClrDatagridFilter, ClrDatagridPagination } from '@clr/angular';
|
|
3
3
|
import { ClrDatagridStatePersistenceModel } from './datagrid-state-persistence-model.interface';
|
|
4
4
|
import { Subject } from 'rxjs';
|
|
5
|
+
import { StatePersistenceOptions } from './state-persistence-options.interface';
|
|
5
6
|
import * as i0 from "@angular/core";
|
|
6
7
|
export declare class StatePersistenceKeyDirective implements AfterContentInit, OnDestroy {
|
|
7
8
|
private datagrid;
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
9
|
+
/**
|
|
10
|
+
* Configuration options for the persistence.
|
|
11
|
+
* 'Key' represents the local storage key under which the persistence state is stored.
|
|
12
|
+
*
|
|
13
|
+
* Optional fields with the 'persist' prefix toggle the persistence of the respective datagrid functionality,
|
|
14
|
+
* the default value is always 'true'.
|
|
15
|
+
*/
|
|
16
|
+
options: StatePersistenceOptions;
|
|
12
17
|
useLocalStoreOnly: boolean;
|
|
13
18
|
paginationDescription: string;
|
|
14
19
|
pagination: ClrDatagridPagination;
|
|
@@ -29,7 +34,10 @@ export declare class StatePersistenceKeyDirective implements AfterContentInit, O
|
|
|
29
34
|
private initPageSizePersister;
|
|
30
35
|
private initCurrentPage;
|
|
31
36
|
private initFilter;
|
|
37
|
+
private initSorting;
|
|
32
38
|
private initDatagridPersister;
|
|
39
|
+
private persistFiltersAndCurrentPage;
|
|
40
|
+
private persistSorting;
|
|
33
41
|
/**
|
|
34
42
|
* Pagination description must be set by this directive,
|
|
35
43
|
* otherwise we can't update datagrid values from localStorage
|
|
@@ -52,6 +60,7 @@ export declare class StatePersistenceKeyDirective implements AfterContentInit, O
|
|
|
52
60
|
private parseFilterValue;
|
|
53
61
|
private getFilter;
|
|
54
62
|
private getFilterPropertyName;
|
|
63
|
+
private getSortProperty;
|
|
55
64
|
ngOnDestroy(): void;
|
|
56
65
|
static ɵfac: i0.ɵɵFactoryDeclaration<StatePersistenceKeyDirective, never>;
|
|
57
66
|
static ɵdir: i0.ɵɵDirectiveDeclaration<StatePersistenceKeyDirective, "[clrStatePersistenceKey]", never, { "options": "clrStatePersistenceKey"; "useLocalStoreOnly": "clrUseLocalStoreOnly"; "paginationDescription": "clrPaginationDescription"; }, {}, ["pagination", "paginationElem", "customFilters"], never, false, never>;
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
export declare const USER_INPUT_REGEX: RegExp;
|
|
2
|
+
export declare const LITTLE_ENDIAN_REGEX: RegExp;
|
|
3
|
+
export declare const MIDDLE_ENDIAN_REGEX: RegExp;
|
|
4
|
+
export declare const DELIMITER_REGEX: RegExp;
|
|
5
|
+
export declare const YEAR = "YYYY";
|
|
6
|
+
export declare const MONTH = "MM";
|
|
7
|
+
export declare const DATE = "DD";
|
|
8
|
+
export declare type FormatType = 'LITTLE_ENDIAN' | 'MIDDLE_ENDIAN' | 'BIG_ENDIAN';
|
|
9
|
+
export declare type InputDateDisplayFormat = {
|
|
10
|
+
readonly name: FormatType;
|
|
11
|
+
readonly format: [string, string, string];
|
|
12
|
+
};
|
|
13
|
+
export declare const LITTLE_ENDIAN: InputDateDisplayFormat;
|
|
14
|
+
export declare const MIDDLE_ENDIAN: InputDateDisplayFormat;
|
|
15
|
+
export declare const BIG_ENDIAN: InputDateDisplayFormat;
|
|
16
|
+
/** Default separator text. */
|
|
17
|
+
export declare const SEPARATOR_TEXT_DEFAULT = " - ";
|
|
18
|
+
export declare const TRANSLATIONS: {
|
|
19
|
+
from: string;
|
|
20
|
+
to: string;
|
|
21
|
+
};
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
import * as i0 from "@angular/core";
|
|
2
|
+
import * as i1 from "./directives/datepicker/datepicker.component";
|
|
3
|
+
import * as i2 from "./validators/daterange-max.validator";
|
|
4
|
+
import * as i3 from "./validators/daterange-min.validator";
|
|
5
|
+
import * as i4 from "./validators/daterange-order.validator";
|
|
6
|
+
import * as i5 from "./directives/daterangepicker-container/daterangepicker-container.component";
|
|
7
|
+
import * as i6 from "./directives/daterangepicker/daterangepicker.directive";
|
|
8
|
+
import * as i7 from "./validators/daterange-required.validator";
|
|
9
|
+
import * as i8 from "./directives/if-daterange-error.directive";
|
|
10
|
+
import * as i9 from "@angular/common";
|
|
11
|
+
import * as i10 from "@angular/forms";
|
|
12
|
+
import * as i11 from "@clr/angular";
|
|
13
|
+
export declare class ClrDaterangepickerModule {
|
|
14
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<ClrDaterangepickerModule, never>;
|
|
15
|
+
static ɵmod: i0.ɵɵNgModuleDeclaration<ClrDaterangepickerModule, [typeof i1.ClrDatepickerComponent, typeof i2.ClrDaterangeMaxValidator, typeof i3.ClrDaterangeMinValidator, typeof i4.ClrDaterangeOrderValidator, typeof i5.ClrDaterangepickerContainerComponent, typeof i6.ClrDaterangepickerDirective, typeof i7.ClrDaterangeRequiredValidator, typeof i8.ClrIfDaterangeErrorDirective], [typeof i9.CommonModule, typeof i10.FormsModule, typeof i11.ClarityModule, typeof i11.ClrDatepickerModule, typeof i11.ClrIconModule], [typeof i2.ClrDaterangeMaxValidator, typeof i3.ClrDaterangeMinValidator, typeof i4.ClrDaterangeOrderValidator, typeof i5.ClrDaterangepickerContainerComponent, typeof i6.ClrDaterangepickerDirective, typeof i7.ClrDaterangeRequiredValidator, typeof i8.ClrIfDaterangeErrorDirective]>;
|
|
16
|
+
static ɵinj: i0.ɵɵInjectorDeclaration<ClrDaterangepickerModule>;
|
|
17
|
+
}
|
|
@@ -0,0 +1,53 @@
|
|
|
1
|
+
import { ClrControlError, ClrControlHelper, ClrControlSuccess, ClrLabel, ClrLayout } from '@clr/angular';
|
|
2
|
+
import { DaterangeControlStateService } from '../providers/daterange-control-state.service';
|
|
3
|
+
import * as i0 from "@angular/core";
|
|
4
|
+
export declare abstract class ClrAbstractContainer {
|
|
5
|
+
protected readonly clrLayout: ClrLayout;
|
|
6
|
+
protected readonly daterangeControlStateService: DaterangeControlStateService;
|
|
7
|
+
protected readonly isFormControl = true;
|
|
8
|
+
/**
|
|
9
|
+
* Detect if container is not part of an vertical form to apply correct grid classes.
|
|
10
|
+
*/
|
|
11
|
+
get addLayoutGrid(): boolean;
|
|
12
|
+
/** Label component. */
|
|
13
|
+
protected labelComponent: ClrLabel;
|
|
14
|
+
/** Helper control component. */
|
|
15
|
+
protected controlHelperComponent: ClrControlHelper;
|
|
16
|
+
/** Error control component. */
|
|
17
|
+
protected controlErrorComponent: ClrControlError;
|
|
18
|
+
/** Success control component. */
|
|
19
|
+
protected controlSuccessComponent: ClrControlSuccess;
|
|
20
|
+
/**
|
|
21
|
+
* Wether to show the helper control.
|
|
22
|
+
* @returns Wether to show the helper control.
|
|
23
|
+
*/
|
|
24
|
+
protected get showHelper(): boolean;
|
|
25
|
+
/**
|
|
26
|
+
* Wether to show the valid control.
|
|
27
|
+
* @returns Wether to show the valid control.
|
|
28
|
+
*/
|
|
29
|
+
protected get showValid(): boolean;
|
|
30
|
+
/**
|
|
31
|
+
* Wether to show the invalid control.
|
|
32
|
+
* @returns Wether to show the invalid control.
|
|
33
|
+
*/
|
|
34
|
+
protected get showInvalid(): boolean;
|
|
35
|
+
/**
|
|
36
|
+
* Disabled state.
|
|
37
|
+
* @returns Disabled state.
|
|
38
|
+
*/
|
|
39
|
+
protected get disabled(): boolean;
|
|
40
|
+
/**
|
|
41
|
+
* If control is focused.
|
|
42
|
+
* @returns Wether control is focused.
|
|
43
|
+
*/
|
|
44
|
+
protected get focus(): boolean;
|
|
45
|
+
/**
|
|
46
|
+
* Wether control is invalid.
|
|
47
|
+
* @returns Wether control is invalid.
|
|
48
|
+
*/
|
|
49
|
+
protected get isInvalid(): boolean;
|
|
50
|
+
constructor(clrLayout: ClrLayout, daterangeControlStateService: DaterangeControlStateService);
|
|
51
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<ClrAbstractContainer, [{ optional: true; }, null]>;
|
|
52
|
+
static ɵdir: i0.ɵɵDirectiveDeclaration<ClrAbstractContainer, never, never, {}, {}, ["labelComponent", "controlHelperComponent", "controlErrorComponent", "controlSuccessComponent"], never, false, never>;
|
|
53
|
+
}
|
|
@@ -0,0 +1,65 @@
|
|
|
1
|
+
import { AfterViewInit, EventEmitter, OnDestroy } from '@angular/core';
|
|
2
|
+
import { DayModel, NullableDayModel } from '../../models/day.model';
|
|
3
|
+
import { OpenedDatepickersTrackerService } from '../../providers/opened-datepickers-tracker.service';
|
|
4
|
+
import * as i0 from "@angular/core";
|
|
5
|
+
export declare class ClrDatepickerComponent implements AfterViewInit, OnDestroy {
|
|
6
|
+
private readonly openedDatepickersTrackerService;
|
|
7
|
+
/**
|
|
8
|
+
* Input value.
|
|
9
|
+
*/
|
|
10
|
+
value: NullableDayModel;
|
|
11
|
+
/**
|
|
12
|
+
* Text label.
|
|
13
|
+
*/
|
|
14
|
+
label: string;
|
|
15
|
+
/**
|
|
16
|
+
* Minimum date that can be selected.
|
|
17
|
+
*/
|
|
18
|
+
minDate: NullableDayModel;
|
|
19
|
+
/**
|
|
20
|
+
* Maximum date that can be selected.
|
|
21
|
+
*/
|
|
22
|
+
maxDate: NullableDayModel;
|
|
23
|
+
/**
|
|
24
|
+
* Input control.
|
|
25
|
+
*/
|
|
26
|
+
private inputElm;
|
|
27
|
+
/**
|
|
28
|
+
* Clarity datepicker container.
|
|
29
|
+
*/
|
|
30
|
+
private clrDateContainer;
|
|
31
|
+
/**
|
|
32
|
+
* Event triggered when value changes.
|
|
33
|
+
*/
|
|
34
|
+
valueChange: EventEmitter<DayModel>;
|
|
35
|
+
/**
|
|
36
|
+
* Get date.
|
|
37
|
+
* @returns JavaScript Date object.
|
|
38
|
+
*/
|
|
39
|
+
protected get date(): Date | undefined | null;
|
|
40
|
+
/**
|
|
41
|
+
* Set date.
|
|
42
|
+
*/
|
|
43
|
+
protected set date(val: Date | undefined | null);
|
|
44
|
+
/**
|
|
45
|
+
* Minimum date as attribute string.
|
|
46
|
+
* @returns Minimum date as attribute string.
|
|
47
|
+
*/
|
|
48
|
+
protected get minDateAttr(): string | undefined | null;
|
|
49
|
+
/**
|
|
50
|
+
* Maximum date as attribute string.
|
|
51
|
+
* @returns Maximum date as attribute string.
|
|
52
|
+
*/
|
|
53
|
+
protected get maxDateAttr(): string | undefined | null;
|
|
54
|
+
/** List of subscriptions to later destroy. */
|
|
55
|
+
private subscriptions;
|
|
56
|
+
constructor(openedDatepickersTrackerService: OpenedDatepickersTrackerService);
|
|
57
|
+
ngAfterViewInit(): void;
|
|
58
|
+
ngOnDestroy(): void;
|
|
59
|
+
/**
|
|
60
|
+
* Focus input.
|
|
61
|
+
*/
|
|
62
|
+
focus(): void;
|
|
63
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<ClrDatepickerComponent, never>;
|
|
64
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<ClrDatepickerComponent, "clr-datepicker", never, { "value": "value"; "label": "label"; "minDate": "minDate"; "maxDate": "maxDate"; }, { "valueChange": "valueChange"; }, never, never, false, never>;
|
|
65
|
+
}
|
|
@@ -0,0 +1,127 @@
|
|
|
1
|
+
import { ElementRef, EventEmitter, OnDestroy, OnInit, Renderer2 } from '@angular/core';
|
|
2
|
+
import { ControlValueAccessor, NgControl } from '@angular/forms';
|
|
3
|
+
import { NullableDaterange } from '../../interfaces/daterange.interface';
|
|
4
|
+
import { DaterangeService } from '../../providers/daterange.service';
|
|
5
|
+
import { DaterangeParsingService } from '../../providers/daterange-parsing.service';
|
|
6
|
+
import { DaterangeControlStateService } from '../../providers/daterange-control-state.service';
|
|
7
|
+
import { ControlIdService } from '../../../abstract-form-component/control-id.service';
|
|
8
|
+
import * as i0 from "@angular/core";
|
|
9
|
+
/**
|
|
10
|
+
* Daterangepicker.
|
|
11
|
+
*/
|
|
12
|
+
export declare class ClrDaterangepickerDirective implements OnInit, OnDestroy, ControlValueAccessor {
|
|
13
|
+
private readonly control;
|
|
14
|
+
private readonly element;
|
|
15
|
+
private readonly renderer;
|
|
16
|
+
private readonly daterangeControlStateService;
|
|
17
|
+
private readonly controlIdService;
|
|
18
|
+
private readonly daterangeService;
|
|
19
|
+
private readonly daterangeParsingService;
|
|
20
|
+
/**
|
|
21
|
+
* Minimum date that can be selected.
|
|
22
|
+
*/
|
|
23
|
+
set min(value: string | undefined | null);
|
|
24
|
+
/**
|
|
25
|
+
* Maximum date that can be selected.
|
|
26
|
+
*/
|
|
27
|
+
set max(value: string | undefined | null);
|
|
28
|
+
/**
|
|
29
|
+
* Locale text between 'from' and 'to' dateranges.
|
|
30
|
+
*/
|
|
31
|
+
separatorText: string;
|
|
32
|
+
/**
|
|
33
|
+
* Placeholder text.
|
|
34
|
+
*
|
|
35
|
+
* It is recommend against overriding the automatically generated placeholder.
|
|
36
|
+
* Adding an incorrect placeholder will create confusion while entering the daterange in the input.
|
|
37
|
+
*/
|
|
38
|
+
placeholder: string;
|
|
39
|
+
get placeholderText(): string;
|
|
40
|
+
/**
|
|
41
|
+
* Id-attribute.
|
|
42
|
+
*/
|
|
43
|
+
get id(): string;
|
|
44
|
+
/**
|
|
45
|
+
* Id-attribute.
|
|
46
|
+
* @returns Id-attribute.
|
|
47
|
+
*/
|
|
48
|
+
set id(value: string);
|
|
49
|
+
/**
|
|
50
|
+
* Disable control.
|
|
51
|
+
*/
|
|
52
|
+
set disabled(value: boolean);
|
|
53
|
+
/**
|
|
54
|
+
* Disabled state.
|
|
55
|
+
* @returns Disabled state.
|
|
56
|
+
*/
|
|
57
|
+
get disabled(): boolean;
|
|
58
|
+
/**
|
|
59
|
+
* Event that is triggered when value changes.
|
|
60
|
+
*/
|
|
61
|
+
valueChange: EventEmitter<import("../../interfaces/daterange.interface").Daterange>;
|
|
62
|
+
/** Set the `type` attribute always to "text", to not get the native datepicker. */
|
|
63
|
+
inputType: string;
|
|
64
|
+
inputClass: boolean;
|
|
65
|
+
/** List of subscriptions to later destroy. */
|
|
66
|
+
private subscriptions;
|
|
67
|
+
constructor(control: NgControl, element: ElementRef, renderer: Renderer2, daterangeControlStateService: DaterangeControlStateService, controlIdService: ControlIdService, daterangeService: DaterangeService, daterangeParsingService: DaterangeParsingService);
|
|
68
|
+
ngOnInit(): void;
|
|
69
|
+
ngOnDestroy(): void;
|
|
70
|
+
/**
|
|
71
|
+
* Listen for daterange value changes.
|
|
72
|
+
*/
|
|
73
|
+
private listenForDaterangeValueChanges;
|
|
74
|
+
/**
|
|
75
|
+
* Listen for control status changes.
|
|
76
|
+
*/
|
|
77
|
+
private listenForControlStatusChanges;
|
|
78
|
+
/**
|
|
79
|
+
* Listen to manual changes to the input.
|
|
80
|
+
* @param target - Input element.
|
|
81
|
+
*/
|
|
82
|
+
onChangeEvent(target: HTMLInputElement): void;
|
|
83
|
+
/**
|
|
84
|
+
* Listen to focus event.
|
|
85
|
+
*/
|
|
86
|
+
focusEvent(): void;
|
|
87
|
+
/**
|
|
88
|
+
* Listen to blur event.
|
|
89
|
+
*/
|
|
90
|
+
blurEvent(): void;
|
|
91
|
+
/**
|
|
92
|
+
* Focus input.
|
|
93
|
+
*/
|
|
94
|
+
focus(): void;
|
|
95
|
+
/**
|
|
96
|
+
* Trigger events to notify form controls, trigger validation and update attributes/properties.
|
|
97
|
+
*/
|
|
98
|
+
private triggerChange;
|
|
99
|
+
/**
|
|
100
|
+
* Update input with friendly daterange text.
|
|
101
|
+
*/
|
|
102
|
+
private updateInput;
|
|
103
|
+
/**
|
|
104
|
+
* ControlValueAccessor method. Set value from NgModel.
|
|
105
|
+
* @param value - Daterange value.
|
|
106
|
+
*/
|
|
107
|
+
writeValue(value: NullableDaterange): void;
|
|
108
|
+
/**
|
|
109
|
+
* ControlValueAccessor method. Register change event. When value changes.
|
|
110
|
+
* @param fn - Change event.
|
|
111
|
+
*/
|
|
112
|
+
registerOnChange(fn: (value: NullableDaterange) => void): void;
|
|
113
|
+
private onChanged;
|
|
114
|
+
/**
|
|
115
|
+
* ControlValueAccessor method. Register touch event. When control is dirty.
|
|
116
|
+
* @param fn - Touch event.
|
|
117
|
+
*/
|
|
118
|
+
registerOnTouched(fn: (value: NullableDaterange) => void): void;
|
|
119
|
+
private onTouched;
|
|
120
|
+
/**
|
|
121
|
+
* ControlValueAccessor method. Set disabled state.
|
|
122
|
+
* @param disabled - Disabled state.
|
|
123
|
+
*/
|
|
124
|
+
setDisabledState(disabled: boolean): void;
|
|
125
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<ClrDaterangepickerDirective, [{ self: true; }, null, null, null, null, null, null]>;
|
|
126
|
+
static ɵdir: i0.ɵɵDirectiveDeclaration<ClrDaterangepickerDirective, "[clrDaterangepicker]", never, { "min": "min"; "max": "max"; "separatorText": "separatorText"; "placeholder": "placeholder"; "id": "id"; "disabled": "disabled"; }, { "valueChange": "valueChange"; }, never, never, false, never>;
|
|
127
|
+
}
|
|
@@ -0,0 +1,118 @@
|
|
|
1
|
+
import { AfterViewInit, OnDestroy } from '@angular/core';
|
|
2
|
+
import '@cds/core/icon/register.js';
|
|
3
|
+
import { ClrCommonStrings, ClrCommonStringsService, ClrLayout, ClrPopoverEventsService, ClrPopoverPosition, ClrPopoverToggleService } from '@clr/angular';
|
|
4
|
+
import { DaterangePreset } from '../../interfaces/daterange-preset.interface';
|
|
5
|
+
import { NullableDayModel } from '../../models/day.model';
|
|
6
|
+
import { DaterangeControlStateService } from '../../providers/daterange-control-state.service';
|
|
7
|
+
import { DaterangeParsingService } from '../../providers/daterange-parsing.service';
|
|
8
|
+
import { DaterangeService } from '../../providers/daterange.service';
|
|
9
|
+
import { OpenedDatepickersTrackerService } from '../../providers/opened-datepickers-tracker.service';
|
|
10
|
+
import { ClrAbstractContainer } from '../abstract-container.component';
|
|
11
|
+
import * as i0 from "@angular/core";
|
|
12
|
+
/**
|
|
13
|
+
* Daterangepicker container.
|
|
14
|
+
*/
|
|
15
|
+
export declare class ClrDaterangepickerContainerComponent extends ClrAbstractContainer implements AfterViewInit, OnDestroy {
|
|
16
|
+
private readonly clrPopoverEventsService;
|
|
17
|
+
private readonly clrPopoverToggleService;
|
|
18
|
+
private readonly clrCommonStringsService;
|
|
19
|
+
protected readonly clrLayout: ClrLayout;
|
|
20
|
+
protected readonly daterangeControlStateService: DaterangeControlStateService;
|
|
21
|
+
private readonly openedDatepickersTrackerService;
|
|
22
|
+
private readonly daterangeService;
|
|
23
|
+
private readonly daterangeParsingService;
|
|
24
|
+
/**
|
|
25
|
+
* List of presets.
|
|
26
|
+
*/
|
|
27
|
+
presets: Array<DaterangePreset>;
|
|
28
|
+
/**
|
|
29
|
+
* Set popover position.
|
|
30
|
+
*/
|
|
31
|
+
set clrPosition(position: string);
|
|
32
|
+
/**
|
|
33
|
+
* Text for the 'from' label.
|
|
34
|
+
*/
|
|
35
|
+
labelFrom: string;
|
|
36
|
+
/**
|
|
37
|
+
* Text for the 'to' label.
|
|
38
|
+
*/
|
|
39
|
+
labelTo: string;
|
|
40
|
+
/** List of datepicker components children. */
|
|
41
|
+
private datepickerComponents;
|
|
42
|
+
/** Daterangepicker directive. */
|
|
43
|
+
private daterangepickerDirective;
|
|
44
|
+
/** CSS classes. */
|
|
45
|
+
classes: string;
|
|
46
|
+
/**
|
|
47
|
+
* Popover open state.
|
|
48
|
+
*/
|
|
49
|
+
protected open: boolean;
|
|
50
|
+
/**
|
|
51
|
+
* Popover position config.
|
|
52
|
+
*/
|
|
53
|
+
protected popoverPosition: ClrPopoverPosition;
|
|
54
|
+
/**
|
|
55
|
+
* Date from.
|
|
56
|
+
* @returns Date from.
|
|
57
|
+
*/
|
|
58
|
+
protected get dateFrom(): import("../../models/day.model").DayModel;
|
|
59
|
+
/**
|
|
60
|
+
* Date to.
|
|
61
|
+
* @returns Date to.
|
|
62
|
+
*/
|
|
63
|
+
protected get dateTo(): import("../../models/day.model").DayModel;
|
|
64
|
+
/**
|
|
65
|
+
* Minimum date that can be selected.
|
|
66
|
+
* @returns Minimum date that can be selected.
|
|
67
|
+
*/
|
|
68
|
+
protected get minDate(): NullableDayModel;
|
|
69
|
+
/**
|
|
70
|
+
* Maximum date that can be selected.
|
|
71
|
+
* @returns Maximum date that can be selected.
|
|
72
|
+
*/
|
|
73
|
+
protected get maxDate(): NullableDayModel;
|
|
74
|
+
private _friendlyDaterange?;
|
|
75
|
+
/**
|
|
76
|
+
* Get friendly daterange text.
|
|
77
|
+
* @returns Friendly daterange text.
|
|
78
|
+
*/
|
|
79
|
+
protected get friendlyDaterange(): string;
|
|
80
|
+
/**
|
|
81
|
+
* List of common translation keys.
|
|
82
|
+
*/
|
|
83
|
+
protected get commonStrings(): Readonly<ClrCommonStrings>;
|
|
84
|
+
/** List of subscriptions to later destroy. */
|
|
85
|
+
private subscriptions;
|
|
86
|
+
constructor(clrPopoverEventsService: ClrPopoverEventsService, clrPopoverToggleService: ClrPopoverToggleService, clrCommonStringsService: ClrCommonStringsService, clrLayout: ClrLayout, daterangeControlStateService: DaterangeControlStateService, openedDatepickersTrackerService: OpenedDatepickersTrackerService, daterangeService: DaterangeService, daterangeParsingService: DaterangeParsingService);
|
|
87
|
+
ngAfterViewInit(): void;
|
|
88
|
+
ngOnDestroy(): void;
|
|
89
|
+
/**
|
|
90
|
+
* Listen for daterange value changes.
|
|
91
|
+
*/
|
|
92
|
+
private listenForDaterangeValueChanges;
|
|
93
|
+
/**
|
|
94
|
+
* Listen for any opened datepickers tracker state changes.
|
|
95
|
+
*/
|
|
96
|
+
private listenForOpenedDatepickersTrackerChanges;
|
|
97
|
+
/**
|
|
98
|
+
* Listen for popover toggle changes.
|
|
99
|
+
*/
|
|
100
|
+
private listenForPopoverToggleChanges;
|
|
101
|
+
/**
|
|
102
|
+
* Event triggered when date from changed.
|
|
103
|
+
* @param value - Date from.
|
|
104
|
+
*/
|
|
105
|
+
protected onDateFromChange(value: NullableDayModel): void;
|
|
106
|
+
/**
|
|
107
|
+
* Event triggered when date to changed.
|
|
108
|
+
* @param value - Date to.
|
|
109
|
+
*/
|
|
110
|
+
protected onDateToChange(value: NullableDayModel): void;
|
|
111
|
+
/**
|
|
112
|
+
* Apply selected preset.
|
|
113
|
+
* @param preset - Selected preset.
|
|
114
|
+
*/
|
|
115
|
+
protected applyPreset(preset: DaterangePreset): void;
|
|
116
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<ClrDaterangepickerContainerComponent, [null, null, null, { optional: true; }, null, null, null, null]>;
|
|
117
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<ClrDaterangepickerContainerComponent, "clr-daterangepicker-container", never, { "presets": "presets"; "clrPosition": "clrPosition"; "labelFrom": "labelFrom"; "labelTo": "labelTo"; }, {}, ["daterangepickerDirective"], ["label", "[clrDaterangepicker]", "clr-control-helper", "clr-control-error", "clr-control-success"], false, never>;
|
|
118
|
+
}
|
|
@@ -0,0 +1,40 @@
|
|
|
1
|
+
import { OnDestroy, TemplateRef, ViewContainerRef } from '@angular/core';
|
|
2
|
+
import { DaterangeControlStateService } from '../providers/daterange-control-state.service';
|
|
3
|
+
import { ClrDaterangepickerContainerComponent } from './daterangepicker-container/daterangepicker-container.component';
|
|
4
|
+
import * as i0 from "@angular/core";
|
|
5
|
+
/**
|
|
6
|
+
* Directive for multiple error messages.
|
|
7
|
+
* It works the same as Clarity `ClrIfError`, but for customized `ClrDaterangepickerContainerComponent`.
|
|
8
|
+
* Using Clarity `ClrIfError` requires the container to have service implemented that are not publicly exported.
|
|
9
|
+
*
|
|
10
|
+
* @see https://clarity.design/documentation/forms (section "Multiple error messages").
|
|
11
|
+
*
|
|
12
|
+
* Altered version from https://github.com/vmware-clarity/ng-clarity/blob/138a6dd95fdc4ffb67b054391c44ce5fa3c44660/projects/angular/src/forms/common/if-control-state/if-error.ts
|
|
13
|
+
*/
|
|
14
|
+
export declare class ClrIfDaterangeErrorDirective implements OnDestroy {
|
|
15
|
+
private readonly template;
|
|
16
|
+
private readonly container;
|
|
17
|
+
private readonly daterangeControlStateService;
|
|
18
|
+
private readonly daterangepickerContainerComponent;
|
|
19
|
+
/** Error name. */
|
|
20
|
+
clrIfDaterangeError: string;
|
|
21
|
+
/** Rendered view. */
|
|
22
|
+
private embeddedViewRef;
|
|
23
|
+
/** Flag to remember if content is displayed. */
|
|
24
|
+
protected displayedContent: boolean;
|
|
25
|
+
/** List of subscriptions to later destroy. */
|
|
26
|
+
private subscriptions;
|
|
27
|
+
constructor(template: TemplateRef<any>, container: ViewContainerRef, daterangeControlStateService: DaterangeControlStateService, daterangepickerContainerComponent: ClrDaterangepickerContainerComponent);
|
|
28
|
+
ngOnDestroy(): void;
|
|
29
|
+
/**
|
|
30
|
+
* Handle error depending on states.
|
|
31
|
+
*/
|
|
32
|
+
private handleState;
|
|
33
|
+
/**
|
|
34
|
+
* Display/hide error.
|
|
35
|
+
* @param displayError - Wether to show/hide error.
|
|
36
|
+
*/
|
|
37
|
+
private toggleErrorVisibility;
|
|
38
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<ClrIfDaterangeErrorDirective, [null, null, { optional: true; }, { optional: true; }]>;
|
|
39
|
+
static ɵdir: i0.ɵɵDirectiveDeclaration<ClrIfDaterangeErrorDirective, "[clrIfDaterangeError]", never, { "clrIfDaterangeError": "clrIfDaterangeError"; }, {}, never, never, false, never>;
|
|
40
|
+
}
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
export * from './daterange.constants';
|
|
2
|
+
export * from './daterangepicker.module';
|
|
3
|
+
export * from './directives/daterangepicker-container/daterangepicker-container.component';
|
|
4
|
+
export * from './directives/daterangepicker/daterangepicker.directive';
|
|
5
|
+
export * from './directives/if-daterange-error.directive';
|
|
6
|
+
export * from './interfaces/daterange-preset.interface';
|
|
7
|
+
export * from './interfaces/daterange.interface';
|
|
8
|
+
export * from './models/day.model';
|
|
9
|
+
export * from './models/popover-positions.model';
|
|
10
|
+
export * from './validators/daterange-max.validator';
|
|
11
|
+
export * from './validators/daterange-min.validator';
|
|
12
|
+
export * from './validators/daterange-order.validator';
|
|
13
|
+
export * from './validators/daterange-required.validator';
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
import { NullableDayModel } from '../models/day.model';
|
|
2
|
+
/**
|
|
3
|
+
* Daterange interface.
|
|
4
|
+
*/
|
|
5
|
+
export interface Daterange {
|
|
6
|
+
from: NullableDayModel;
|
|
7
|
+
to: NullableDayModel;
|
|
8
|
+
}
|
|
9
|
+
/**
|
|
10
|
+
* Daterange.
|
|
11
|
+
*/
|
|
12
|
+
export declare type NullableDaterange = Daterange | undefined | null;
|
|
@@ -0,0 +1,80 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Day model.
|
|
3
|
+
* Takes care of keeping records of full days, without the times & timezone issues.
|
|
4
|
+
*/
|
|
5
|
+
export declare class DayModel {
|
|
6
|
+
/** Year. */
|
|
7
|
+
private year;
|
|
8
|
+
/** Month, zero-indexed. */
|
|
9
|
+
private month;
|
|
10
|
+
/** Date of the month. */
|
|
11
|
+
private date;
|
|
12
|
+
/**
|
|
13
|
+
* Creates an day model.
|
|
14
|
+
* @param year - The full year.
|
|
15
|
+
* @param month - The month as a number between 0 and 11 (January to December).
|
|
16
|
+
* @param date - The date as a number between 1 and 31.
|
|
17
|
+
*/
|
|
18
|
+
constructor(year: number, month: number, date: number);
|
|
19
|
+
/**
|
|
20
|
+
* Creates an day model.
|
|
21
|
+
* @param date - Javascript Date object.
|
|
22
|
+
*/
|
|
23
|
+
constructor(date: Date);
|
|
24
|
+
/**
|
|
25
|
+
* Creates an day model.
|
|
26
|
+
* @param date - Date string in `yyyy-mm-dd` format.
|
|
27
|
+
*/
|
|
28
|
+
constructor(date: string);
|
|
29
|
+
/**
|
|
30
|
+
* Checks if the passed value is equal to current day model.
|
|
31
|
+
* @param value - Day model.
|
|
32
|
+
* @returns Wether value is equal to current day model.
|
|
33
|
+
*/
|
|
34
|
+
isEqual(value: DayModel): boolean;
|
|
35
|
+
/**
|
|
36
|
+
* Increment day model with date value.
|
|
37
|
+
* @param value - Incremental date value.
|
|
38
|
+
* @returns Updated day model with incremented date value.
|
|
39
|
+
*/
|
|
40
|
+
incrementBy(value: number): DayModel;
|
|
41
|
+
/**
|
|
42
|
+
* Checks if current day model is after value.
|
|
43
|
+
* @param value - Day model.
|
|
44
|
+
* @returns Wether current day model is after value.
|
|
45
|
+
*/
|
|
46
|
+
isAfter(value: DayModel): boolean;
|
|
47
|
+
/**
|
|
48
|
+
* Checks if current day model is before value.
|
|
49
|
+
* @param value - Day model.
|
|
50
|
+
* @returns Wether current day model is before value.
|
|
51
|
+
*/
|
|
52
|
+
isBefore(value: DayModel): boolean;
|
|
53
|
+
/**
|
|
54
|
+
* Clones the current day model.
|
|
55
|
+
* @returns Cloned day model.
|
|
56
|
+
*/
|
|
57
|
+
clone(): DayModel;
|
|
58
|
+
/**
|
|
59
|
+
* Convert to Javascript Date object.
|
|
60
|
+
* @returns Javascript Date object.
|
|
61
|
+
*/
|
|
62
|
+
toDate(): Date;
|
|
63
|
+
/**
|
|
64
|
+
* To HTML5 date spec string.
|
|
65
|
+
* See https://clarity.design/documentation/datepicker
|
|
66
|
+
* @returns Date as HTML5 spec string.
|
|
67
|
+
*/
|
|
68
|
+
toHTML5SpecDateString(): string;
|
|
69
|
+
/**
|
|
70
|
+
* String padding with zeros.
|
|
71
|
+
* @param num - Number to pad.
|
|
72
|
+
* @returns Padded string.
|
|
73
|
+
*/
|
|
74
|
+
private pad;
|
|
75
|
+
}
|
|
76
|
+
/**
|
|
77
|
+
* Day model.
|
|
78
|
+
* Takes care of keeping records of full days, without the times & timezone issues.
|
|
79
|
+
*/
|
|
80
|
+
export declare type NullableDayModel = DayModel | undefined | null;
|