@progress/kendo-angular-grid 19.0.0-develop.24 → 19.0.0-develop.25
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/column-menu/column-menu-item.component.d.ts +16 -3
- package/esm2022/adaptiveness/adaptive-renderer.component.mjs +1 -1
- package/esm2022/column-menu/column-menu-autosize-all.component.mjs +1 -1
- package/esm2022/column-menu/column-menu-autosize.component.mjs +1 -1
- package/esm2022/column-menu/column-menu-chooser.component.mjs +1 -1
- package/esm2022/column-menu/column-menu-filter.component.mjs +1 -1
- package/esm2022/column-menu/column-menu-item.component.mjs +33 -11
- package/esm2022/column-menu/column-menu-lock.component.mjs +1 -1
- package/esm2022/column-menu/column-menu-position.component.mjs +1 -1
- package/esm2022/column-menu/column-menu-sort.component.mjs +1 -1
- package/esm2022/column-menu/column-menu-stick.component.mjs +1 -1
- package/esm2022/grid.component.mjs +65 -9
- package/esm2022/package-metadata.mjs +2 -2
- package/esm2022/rendering/toolbar/tools/column-chooser-tool.directive.mjs +2 -0
- package/esm2022/rendering/toolbar/tools/filter-command-tool.directive.mjs +14 -3
- package/esm2022/rendering/toolbar/tools/filter-tool-wrapper.component.mjs +1 -0
- package/esm2022/rendering/toolbar/tools/filter-toolbar-tool.component.mjs +56 -8
- package/esm2022/rendering/toolbar/tools/sort-command-tool.directive.mjs +14 -4
- package/fesm2022/progress-kendo-angular-grid.mjs +192 -44
- package/grid.component.d.ts +13 -0
- package/package.json +21 -21
- package/rendering/toolbar/tools/filter-command-tool.directive.d.ts +5 -0
- package/rendering/toolbar/tools/filter-toolbar-tool.component.d.ts +10 -2
- package/rendering/toolbar/tools/sort-command-tool.directive.d.ts +5 -0
- package/schematics/ngAdd/index.js +4 -4
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
* Copyright © 2025 Progress Software Corporation. All rights reserved.
|
|
3
3
|
* Licensed under commercial license. See LICENSE.md in the project root for more information
|
|
4
4
|
*-------------------------------------------------------------------------------------------*/
|
|
5
|
-
import { EventEmitter, OnChanges, AfterViewInit, NgZone } from '@angular/core';
|
|
5
|
+
import { EventEmitter, OnChanges, AfterViewInit, NgZone, ElementRef } from '@angular/core';
|
|
6
6
|
import { ColumnMenuItemContentTemplateDirective } from './column-menu-item-content-template.directive';
|
|
7
7
|
import { SVGIcon } from '@progress/kendo-svg-icons';
|
|
8
8
|
import { ColumnMenuService } from './column-menu.service';
|
|
@@ -28,6 +28,7 @@ export declare class ColumnMenuItemComponent implements AfterViewInit, OnChanges
|
|
|
28
28
|
private ngZone;
|
|
29
29
|
ctx: ContextService;
|
|
30
30
|
adaptiveGridService: AdaptiveGridService;
|
|
31
|
+
element: ElementRef;
|
|
31
32
|
/**
|
|
32
33
|
* @hidden
|
|
33
34
|
*/
|
|
@@ -57,6 +58,14 @@ export declare class ColumnMenuItemComponent implements AfterViewInit, OnChanges
|
|
|
57
58
|
* Defines the [SVG icon](slug:svgicon_list) to be rendered within the item.
|
|
58
59
|
*/
|
|
59
60
|
svgIcon: SVGIcon;
|
|
61
|
+
/**
|
|
62
|
+
* @hidden
|
|
63
|
+
*/
|
|
64
|
+
indicatorIcon: string;
|
|
65
|
+
/**
|
|
66
|
+
* @hidden
|
|
67
|
+
*/
|
|
68
|
+
indicatorSVGIcon: SVGIcon;
|
|
60
69
|
/**
|
|
61
70
|
* Specifies the item text.
|
|
62
71
|
*/
|
|
@@ -73,6 +82,10 @@ export declare class ColumnMenuItemComponent implements AfterViewInit, OnChanges
|
|
|
73
82
|
* Specifies if the item is expanded.
|
|
74
83
|
*/
|
|
75
84
|
expanded: boolean;
|
|
85
|
+
/**
|
|
86
|
+
* @hidden
|
|
87
|
+
*/
|
|
88
|
+
focused: boolean;
|
|
76
89
|
/**
|
|
77
90
|
* Represents the [ColumnMenuService]({% slug api_grid_columnmenuservice %}) class.
|
|
78
91
|
* Required to include the item in the column menu keyboard navigation sequence.
|
|
@@ -95,7 +108,7 @@ export declare class ColumnMenuItemComponent implements AfterViewInit, OnChanges
|
|
|
95
108
|
get hasFilters(): boolean;
|
|
96
109
|
get expandedIcon(): string;
|
|
97
110
|
get expandedSvgIcon(): SVGIcon;
|
|
98
|
-
constructor(ngZone: NgZone, ctx: ContextService, adaptiveGridService: AdaptiveGridService);
|
|
111
|
+
constructor(ngZone: NgZone, ctx: ContextService, adaptiveGridService: AdaptiveGridService, element: ElementRef);
|
|
99
112
|
ngAfterViewInit(): void;
|
|
100
113
|
ngOnChanges(changes: any): void;
|
|
101
114
|
/**
|
|
@@ -116,5 +129,5 @@ export declare class ColumnMenuItemComponent implements AfterViewInit, OnChanges
|
|
|
116
129
|
onClick(e: any): void;
|
|
117
130
|
private updateContentState;
|
|
118
131
|
static ɵfac: i0.ɵɵFactoryDeclaration<ColumnMenuItemComponent, never>;
|
|
119
|
-
static ɵcmp: i0.ɵɵComponentDeclaration<ColumnMenuItemComponent, "kendo-grid-columnmenu-item", never, { "icon": { "alias": "icon"; "required": false; }; "svgIcon": { "alias": "svgIcon"; "required": false; }; "text": { "alias": "text"; "required": false; }; "selected": { "alias": "selected"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "expanded": { "alias": "expanded"; "required": false; }; "service": { "alias": "service"; "required": false; }; "column": { "alias": "column"; "required": false; }; }, { "itemClick": "itemClick"; "expand": "expand"; "collapse": "collapse"; }, ["contentTemplate"], never, true, never>;
|
|
132
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<ColumnMenuItemComponent, "kendo-grid-columnmenu-item", never, { "icon": { "alias": "icon"; "required": false; }; "svgIcon": { "alias": "svgIcon"; "required": false; }; "indicatorIcon": { "alias": "indicatorIcon"; "required": false; }; "indicatorSVGIcon": { "alias": "indicatorSVGIcon"; "required": false; }; "text": { "alias": "text"; "required": false; }; "selected": { "alias": "selected"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "expanded": { "alias": "expanded"; "required": false; }; "focused": { "alias": "focused"; "required": false; }; "service": { "alias": "service"; "required": false; }; "column": { "alias": "column"; "required": false; }; }, { "itemClick": "itemClick"; "expand": "expand"; "collapse": "collapse"; }, ["contentTemplate"], never, true, never>;
|
|
120
133
|
}
|
|
@@ -660,7 +660,7 @@ export class AdaptiveRendererComponent {
|
|
|
660
660
|
{{messageFor('filterFilterButton')}}
|
|
661
661
|
</button>
|
|
662
662
|
</ng-template>
|
|
663
|
-
`, isInline: true, dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: ActionSheetComponent, selector: "kendo-actionsheet", inputs: ["actions", "actionsLayout", "overlayClickClose", "title", "subtitle", "items", "cssClass", "cssStyle", "animation", "expanded", "titleId", "initialFocus"], outputs: ["expandedChange", "action", "expand", "collapse", "itemClick", "overlayClick"], exportAs: ["kendoActionSheet"] }, { kind: "component", type: ActionSheetViewComponent, selector: "kendo-actionsheet-view", inputs: ["title", "subtitle", "titleId"] }, { kind: "component", type: FilterToolbarToolComponent, selector: "kendo-filter-toolbar-tool", outputs: ["close"] }, { kind: "component", type: ButtonDirective, selector: "button[kendoButton]", inputs: ["arrowIcon", "toggleable", "togglable", "selected", "tabIndex", "imageUrl", "iconClass", "icon", "disabled", "size", "rounded", "fillMode", "themeColor", "svgIcon", "primary", "look"], outputs: ["selectedChange", "click"], exportAs: ["kendoButton"] }, { kind: "directive", type: ActionSheetHeaderTemplateDirective, selector: "[kendoActionSheetHeaderTemplate]" }, { kind: "directive", type: ActionSheetContentTemplateDirective, selector: "[kendoActionSheetContentTemplate]" }, { kind: "directive", type: ActionSheetFooterTemplateDirective, selector: "[kendoActionSheetFooterTemplate]" }, { kind: "component", type: ColumnMenuContainerComponent, selector: "kendo-grid-columnmenu-container" }, { kind: "component", type: ColumnMenuFilterComponent, selector: "kendo-grid-columnmenu-filter", inputs: ["expanded", "isLast"], outputs: ["expand", "collapse"] }, { kind: "component", type: ColumnMenuSortComponent, selector: "kendo-grid-columnmenu-sort" }, { kind: "component", type: ColumnMenuLockComponent, selector: "kendo-grid-columnmenu-lock" }, { kind: "component", type: ColumnMenuStickComponent, selector: "kendo-grid-columnmenu-stick" }, { kind: "component", type: ColumnMenuPositionComponent, selector: "kendo-grid-columnmenu-position", inputs: ["expanded", "showLock", "showStick", "isLast"], outputs: ["expand", "collapse"] }, { kind: "component", type: ColumnMenuChooserComponent, selector: "kendo-grid-columnmenu-chooser", inputs: ["expanded", "isLast"], outputs: ["expand", "collapse"] }, { kind: "component", type: ColumnMenuAutoSizeColumnComponent, selector: "kendo-grid-columnmenu-autosize-column", inputs: ["column"] }, { kind: "component", type: ColumnMenuAutoSizeAllColumnsComponent, selector: "kendo-grid-columnmenu-autosize-all-columns" }, { kind: "component", type: ColumnMenuItemComponent, selector: "kendo-grid-columnmenu-item", inputs: ["icon", "svgIcon", "text", "selected", "disabled", "expanded", "service", "column"], outputs: ["itemClick", "expand", "collapse"] }, { kind: "directive", type: ColumnMenuItemDirective, selector: "[kendoGridColumnMenuItem]", inputs: ["kendoGridColumnMenuItem"] }, { kind: "component", type: ColumnListComponent, selector: "kendo-grid-columnlist", inputs: ["columns", "showActions", "autoSync", "ariaLabel", "allowHideAll", "applyText", "resetText", "actionsClass", "isLast", "isExpanded", "service"], outputs: ["reset", "apply", "columnChange"] }, { kind: "component", type: FilterMenuContainerComponent, selector: "kendo-grid-filter-menu-container", inputs: ["column", "isLast", "isExpanded", "menuTabbingService", "filter", "actionsClass"], outputs: ["close"] }, { kind: "directive", type: EventsOutsideAngularDirective, selector: "[kendoEventsOutsideAngular]", inputs: ["kendoEventsOutsideAngular", "scope"] }, { kind: "component", type: FormComponent, selector: "kendo-grid-external-form", inputs: ["controls", "formSettings", "formGroup", "actionButtons"], outputs: ["formSubmit"] }] });
|
|
663
|
+
`, isInline: true, dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: ActionSheetComponent, selector: "kendo-actionsheet", inputs: ["actions", "actionsLayout", "overlayClickClose", "title", "subtitle", "items", "cssClass", "cssStyle", "animation", "expanded", "titleId", "initialFocus"], outputs: ["expandedChange", "action", "expand", "collapse", "itemClick", "overlayClick"], exportAs: ["kendoActionSheet"] }, { kind: "component", type: ActionSheetViewComponent, selector: "kendo-actionsheet-view", inputs: ["title", "subtitle", "titleId"] }, { kind: "component", type: FilterToolbarToolComponent, selector: "kendo-filter-toolbar-tool", outputs: ["close"] }, { kind: "component", type: ButtonDirective, selector: "button[kendoButton]", inputs: ["arrowIcon", "toggleable", "togglable", "selected", "tabIndex", "imageUrl", "iconClass", "icon", "disabled", "size", "rounded", "fillMode", "themeColor", "svgIcon", "primary", "look"], outputs: ["selectedChange", "click"], exportAs: ["kendoButton"] }, { kind: "directive", type: ActionSheetHeaderTemplateDirective, selector: "[kendoActionSheetHeaderTemplate]" }, { kind: "directive", type: ActionSheetContentTemplateDirective, selector: "[kendoActionSheetContentTemplate]" }, { kind: "directive", type: ActionSheetFooterTemplateDirective, selector: "[kendoActionSheetFooterTemplate]" }, { kind: "component", type: ColumnMenuContainerComponent, selector: "kendo-grid-columnmenu-container" }, { kind: "component", type: ColumnMenuFilterComponent, selector: "kendo-grid-columnmenu-filter", inputs: ["expanded", "isLast"], outputs: ["expand", "collapse"] }, { kind: "component", type: ColumnMenuSortComponent, selector: "kendo-grid-columnmenu-sort" }, { kind: "component", type: ColumnMenuLockComponent, selector: "kendo-grid-columnmenu-lock" }, { kind: "component", type: ColumnMenuStickComponent, selector: "kendo-grid-columnmenu-stick" }, { kind: "component", type: ColumnMenuPositionComponent, selector: "kendo-grid-columnmenu-position", inputs: ["expanded", "showLock", "showStick", "isLast"], outputs: ["expand", "collapse"] }, { kind: "component", type: ColumnMenuChooserComponent, selector: "kendo-grid-columnmenu-chooser", inputs: ["expanded", "isLast"], outputs: ["expand", "collapse"] }, { kind: "component", type: ColumnMenuAutoSizeColumnComponent, selector: "kendo-grid-columnmenu-autosize-column", inputs: ["column"] }, { kind: "component", type: ColumnMenuAutoSizeAllColumnsComponent, selector: "kendo-grid-columnmenu-autosize-all-columns" }, { kind: "component", type: ColumnMenuItemComponent, selector: "kendo-grid-columnmenu-item", inputs: ["icon", "svgIcon", "indicatorIcon", "indicatorSVGIcon", "text", "selected", "disabled", "expanded", "focused", "service", "column"], outputs: ["itemClick", "expand", "collapse"] }, { kind: "directive", type: ColumnMenuItemDirective, selector: "[kendoGridColumnMenuItem]", inputs: ["kendoGridColumnMenuItem"] }, { kind: "component", type: ColumnListComponent, selector: "kendo-grid-columnlist", inputs: ["columns", "showActions", "autoSync", "ariaLabel", "allowHideAll", "applyText", "resetText", "actionsClass", "isLast", "isExpanded", "service"], outputs: ["reset", "apply", "columnChange"] }, { kind: "component", type: FilterMenuContainerComponent, selector: "kendo-grid-filter-menu-container", inputs: ["column", "isLast", "isExpanded", "menuTabbingService", "filter", "actionsClass"], outputs: ["close"] }, { kind: "directive", type: EventsOutsideAngularDirective, selector: "[kendoEventsOutsideAngular]", inputs: ["kendoEventsOutsideAngular", "scope"] }, { kind: "component", type: FormComponent, selector: "kendo-grid-external-form", inputs: ["controls", "formSettings", "formGroup", "actionButtons"], outputs: ["formSubmit"] }] });
|
|
664
664
|
}
|
|
665
665
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: AdaptiveRendererComponent, decorators: [{
|
|
666
666
|
type: Component,
|
|
@@ -58,7 +58,7 @@ export class ColumnMenuAutoSizeAllColumnsComponent extends ColumnMenuItemBase {
|
|
|
58
58
|
[svgIcon]="displayInlineFlexIcon"
|
|
59
59
|
(itemClick)="autoSizeAllColumns()"
|
|
60
60
|
></kendo-grid-columnmenu-item>
|
|
61
|
-
`, isInline: true, dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: ColumnMenuItemComponent, selector: "kendo-grid-columnmenu-item", inputs: ["icon", "svgIcon", "text", "selected", "disabled", "expanded", "service", "column"], outputs: ["itemClick", "expand", "collapse"] }] });
|
|
61
|
+
`, isInline: true, dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: ColumnMenuItemComponent, selector: "kendo-grid-columnmenu-item", inputs: ["icon", "svgIcon", "indicatorIcon", "indicatorSVGIcon", "text", "selected", "disabled", "expanded", "focused", "service", "column"], outputs: ["itemClick", "expand", "collapse"] }] });
|
|
62
62
|
}
|
|
63
63
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ColumnMenuAutoSizeAllColumnsComponent, decorators: [{
|
|
64
64
|
type: Component,
|
|
@@ -64,7 +64,7 @@ export class ColumnMenuAutoSizeColumnComponent extends ColumnMenuItemBase {
|
|
|
64
64
|
[svgIcon]="maxWidthIcon"
|
|
65
65
|
(itemClick)="autoSizeColumn()"
|
|
66
66
|
></kendo-grid-columnmenu-item>
|
|
67
|
-
`, isInline: true, dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: ColumnMenuItemComponent, selector: "kendo-grid-columnmenu-item", inputs: ["icon", "svgIcon", "text", "selected", "disabled", "expanded", "service", "column"], outputs: ["itemClick", "expand", "collapse"] }] });
|
|
67
|
+
`, isInline: true, dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: ColumnMenuItemComponent, selector: "kendo-grid-columnmenu-item", inputs: ["icon", "svgIcon", "indicatorIcon", "indicatorSVGIcon", "text", "selected", "disabled", "expanded", "focused", "service", "column"], outputs: ["itemClick", "expand", "collapse"] }] });
|
|
68
68
|
}
|
|
69
69
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ColumnMenuAutoSizeColumnComponent, decorators: [{
|
|
70
70
|
type: Component,
|
|
@@ -118,7 +118,7 @@ export class ColumnMenuChooserComponent extends ColumnMenuItemBase {
|
|
|
118
118
|
</kendo-grid-columnlist>
|
|
119
119
|
</ng-template>
|
|
120
120
|
</kendo-grid-columnmenu-item>
|
|
121
|
-
`, isInline: true, dependencies: [{ kind: "component", type: ColumnMenuItemComponent, selector: "kendo-grid-columnmenu-item", inputs: ["icon", "svgIcon", "text", "selected", "disabled", "expanded", "service", "column"], outputs: ["itemClick", "expand", "collapse"] }, { kind: "directive", type: ColumnMenuItemContentTemplateDirective, selector: "[kendoGridColumnMenuItemContentTemplate]" }, { kind: "component", type: ColumnListComponent, selector: "kendo-grid-columnlist", inputs: ["columns", "showActions", "autoSync", "ariaLabel", "allowHideAll", "applyText", "resetText", "actionsClass", "isLast", "isExpanded", "service"], outputs: ["reset", "apply", "columnChange"] }] });
|
|
121
|
+
`, isInline: true, dependencies: [{ kind: "component", type: ColumnMenuItemComponent, selector: "kendo-grid-columnmenu-item", inputs: ["icon", "svgIcon", "indicatorIcon", "indicatorSVGIcon", "text", "selected", "disabled", "expanded", "focused", "service", "column"], outputs: ["itemClick", "expand", "collapse"] }, { kind: "directive", type: ColumnMenuItemContentTemplateDirective, selector: "[kendoGridColumnMenuItemContentTemplate]" }, { kind: "component", type: ColumnListComponent, selector: "kendo-grid-columnlist", inputs: ["columns", "showActions", "autoSync", "ariaLabel", "allowHideAll", "applyText", "resetText", "actionsClass", "isLast", "isExpanded", "service"], outputs: ["reset", "apply", "columnChange"] }] });
|
|
122
122
|
}
|
|
123
123
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ColumnMenuChooserComponent, decorators: [{
|
|
124
124
|
type: Component,
|
|
@@ -97,7 +97,7 @@ export class ColumnMenuFilterComponent extends ColumnMenuItemBase {
|
|
|
97
97
|
</kendo-grid-filter-menu-container>
|
|
98
98
|
</ng-template>
|
|
99
99
|
</kendo-grid-columnmenu-item>
|
|
100
|
-
`, isInline: true, dependencies: [{ kind: "component", type: ColumnMenuItemComponent, selector: "kendo-grid-columnmenu-item", inputs: ["icon", "svgIcon", "text", "selected", "disabled", "expanded", "service", "column"], outputs: ["itemClick", "expand", "collapse"] }, { kind: "directive", type: ColumnMenuItemContentTemplateDirective, selector: "[kendoGridColumnMenuItemContentTemplate]" }, { kind: "component", type: FilterMenuContainerComponent, selector: "kendo-grid-filter-menu-container", inputs: ["column", "isLast", "isExpanded", "menuTabbingService", "filter", "actionsClass"], outputs: ["close"] }] });
|
|
100
|
+
`, isInline: true, dependencies: [{ kind: "component", type: ColumnMenuItemComponent, selector: "kendo-grid-columnmenu-item", inputs: ["icon", "svgIcon", "indicatorIcon", "indicatorSVGIcon", "text", "selected", "disabled", "expanded", "focused", "service", "column"], outputs: ["itemClick", "expand", "collapse"] }, { kind: "directive", type: ColumnMenuItemContentTemplateDirective, selector: "[kendoGridColumnMenuItemContentTemplate]" }, { kind: "component", type: FilterMenuContainerComponent, selector: "kendo-grid-filter-menu-container", inputs: ["column", "isLast", "isExpanded", "menuTabbingService", "filter", "actionsClass"], outputs: ["close"] }] });
|
|
101
101
|
}
|
|
102
102
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ColumnMenuFilterComponent, decorators: [{
|
|
103
103
|
type: Component,
|
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
* Copyright © 2025 Progress Software Corporation. All rights reserved.
|
|
3
3
|
* Licensed under commercial license. See LICENSE.md in the project root for more information
|
|
4
4
|
*-------------------------------------------------------------------------------------------*/
|
|
5
|
-
import { Component, Input, Output, EventEmitter, ContentChild, NgZone } from '@angular/core';
|
|
5
|
+
import { Component, Input, Output, EventEmitter, ContentChild, NgZone, ElementRef } from '@angular/core';
|
|
6
6
|
import { trigger, transition, style, animate, state } from '@angular/animations';
|
|
7
7
|
import { ColumnMenuItemContentTemplateDirective } from './column-menu-item-content-template.directive';
|
|
8
8
|
import { chevronDownIcon, chevronRightIcon, chevronUpIcon, filterIcon, sortAscSmallIcon, sortDescSmallIcon } from '@progress/kendo-svg-icons';
|
|
@@ -37,6 +37,7 @@ export class ColumnMenuItemComponent {
|
|
|
37
37
|
ngZone;
|
|
38
38
|
ctx;
|
|
39
39
|
adaptiveGridService;
|
|
40
|
+
element;
|
|
40
41
|
/**
|
|
41
42
|
* @hidden
|
|
42
43
|
*/
|
|
@@ -66,6 +67,14 @@ export class ColumnMenuItemComponent {
|
|
|
66
67
|
* Defines the [SVG icon](slug:svgicon_list) to be rendered within the item.
|
|
67
68
|
*/
|
|
68
69
|
svgIcon;
|
|
70
|
+
/**
|
|
71
|
+
* @hidden
|
|
72
|
+
*/
|
|
73
|
+
indicatorIcon;
|
|
74
|
+
/**
|
|
75
|
+
* @hidden
|
|
76
|
+
*/
|
|
77
|
+
indicatorSVGIcon;
|
|
69
78
|
/**
|
|
70
79
|
* Specifies the item text.
|
|
71
80
|
*/
|
|
@@ -82,6 +91,10 @@ export class ColumnMenuItemComponent {
|
|
|
82
91
|
* Specifies if the item is expanded.
|
|
83
92
|
*/
|
|
84
93
|
expanded;
|
|
94
|
+
/**
|
|
95
|
+
* @hidden
|
|
96
|
+
*/
|
|
97
|
+
focused;
|
|
85
98
|
/**
|
|
86
99
|
* Represents the [ColumnMenuService]({% slug api_grid_columnmenuservice %}) class.
|
|
87
100
|
* Required to include the item in the column menu keyboard navigation sequence.
|
|
@@ -116,10 +129,11 @@ export class ColumnMenuItemComponent {
|
|
|
116
129
|
}
|
|
117
130
|
return this.expanded ? this.chevronUpIcon : this.chevronDownIcon;
|
|
118
131
|
}
|
|
119
|
-
constructor(ngZone, ctx, adaptiveGridService) {
|
|
132
|
+
constructor(ngZone, ctx, adaptiveGridService, element) {
|
|
120
133
|
this.ngZone = ngZone;
|
|
121
134
|
this.ctx = ctx;
|
|
122
135
|
this.adaptiveGridService = adaptiveGridService;
|
|
136
|
+
this.element = element;
|
|
123
137
|
}
|
|
124
138
|
ngAfterViewInit() {
|
|
125
139
|
this.ngZone.onStable.pipe(take(1)).subscribe(() => {
|
|
@@ -177,8 +191,8 @@ export class ColumnMenuItemComponent {
|
|
|
177
191
|
updateContentState() {
|
|
178
192
|
this.contentState = this.expanded ? 'expanded' : 'collapsed';
|
|
179
193
|
}
|
|
180
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ColumnMenuItemComponent, deps: [{ token: i0.NgZone }, { token: i1.ContextService }, { token: i2.AdaptiveGridService }], target: i0.ɵɵFactoryTarget.Component });
|
|
181
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: ColumnMenuItemComponent, isStandalone: true, selector: "kendo-grid-columnmenu-item", inputs: { icon: "icon", svgIcon: "svgIcon", text: "text", selected: "selected", disabled: "disabled", expanded: "expanded", service: "service", column: "column" }, outputs: { itemClick: "itemClick", expand: "expand", collapse: "collapse" }, queries: [{ propertyName: "contentTemplate", first: true, predicate: ColumnMenuItemContentTemplateDirective, descendants: true }], usesOnChanges: true, ngImport: i0, template: `
|
|
194
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ColumnMenuItemComponent, deps: [{ token: i0.NgZone }, { token: i1.ContextService }, { token: i2.AdaptiveGridService }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
195
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: ColumnMenuItemComponent, isStandalone: true, selector: "kendo-grid-columnmenu-item", inputs: { icon: "icon", svgIcon: "svgIcon", indicatorIcon: "indicatorIcon", indicatorSVGIcon: "indicatorSVGIcon", text: "text", selected: "selected", disabled: "disabled", expanded: "expanded", focused: "focused", service: "service", column: "column" }, outputs: { itemClick: "itemClick", expand: "expand", collapse: "collapse" }, queries: [{ propertyName: "contentTemplate", first: true, predicate: ColumnMenuItemContentTemplateDirective, descendants: true }], usesOnChanges: true, ngImport: i0, template: `
|
|
182
196
|
<div *ngIf="contentTemplate; else content" class="k-expander">
|
|
183
197
|
<ng-container [ngTemplateOutlet]="content"></ng-container>
|
|
184
198
|
</div>
|
|
@@ -190,6 +204,7 @@ export class ColumnMenuItemComponent {
|
|
|
190
204
|
(keydown.enter)="onClick($event)"
|
|
191
205
|
[class.k-selected]="selected"
|
|
192
206
|
[class.k-disabled]="disabled"
|
|
207
|
+
[class.k-focus]="focused"
|
|
193
208
|
role="button"
|
|
194
209
|
[attr.aria-expanded]="expanded"
|
|
195
210
|
[attr.aria-controls]="expanded ? contentId : undefined">
|
|
@@ -198,11 +213,11 @@ export class ColumnMenuItemComponent {
|
|
|
198
213
|
[name]="icon"
|
|
199
214
|
[svgIcon]="svgIcon"></kendo-icon-wrapper>
|
|
200
215
|
{{ text }}
|
|
201
|
-
<span *ngIf="ctx.grid.isActionSheetExpanded && adaptiveGridService.viewType === 'sortToolbarTool' && sortDescriptor(column.field).dir"
|
|
216
|
+
<span *ngIf="(ctx.grid.isActionSheetExpanded && adaptiveGridService.viewType === 'sortToolbarTool' && sortDescriptor(column.field).dir) || indicatorIcon || indicatorSVGIcon"
|
|
202
217
|
class="k-columnmenu-indicators">
|
|
203
218
|
<kendo-icon-wrapper
|
|
204
|
-
[name]="sortDescriptor(column.field).dir === 'asc' ? 'sort-asc-small' : 'sort-desc-small'"
|
|
205
|
-
[svgIcon]="sortDescriptor(column.field).dir === 'asc' ? sortAscSmallIcon : sortDescSmallIcon">
|
|
219
|
+
[name]="indicatorIcon ? indicatorIcon : sortDescriptor(column.field).dir === 'asc' ? 'sort-asc-small' : 'sort-desc-small'"
|
|
220
|
+
[svgIcon]="indicatorSVGIcon ? indicatorSVGIcon : sortDescriptor(column.field).dir === 'asc' ? sortAscSmallIcon : sortDescSmallIcon">
|
|
206
221
|
</kendo-icon-wrapper>
|
|
207
222
|
<span *ngIf="showSortNumbering(column)" class="k-sort-index">{{sortOrder(column.field)}}</span>
|
|
208
223
|
</span>
|
|
@@ -288,6 +303,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
|
|
|
288
303
|
(keydown.enter)="onClick($event)"
|
|
289
304
|
[class.k-selected]="selected"
|
|
290
305
|
[class.k-disabled]="disabled"
|
|
306
|
+
[class.k-focus]="focused"
|
|
291
307
|
role="button"
|
|
292
308
|
[attr.aria-expanded]="expanded"
|
|
293
309
|
[attr.aria-controls]="expanded ? contentId : undefined">
|
|
@@ -296,11 +312,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
|
|
|
296
312
|
[name]="icon"
|
|
297
313
|
[svgIcon]="svgIcon"></kendo-icon-wrapper>
|
|
298
314
|
{{ text }}
|
|
299
|
-
<span *ngIf="ctx.grid.isActionSheetExpanded && adaptiveGridService.viewType === 'sortToolbarTool' && sortDescriptor(column.field).dir"
|
|
315
|
+
<span *ngIf="(ctx.grid.isActionSheetExpanded && adaptiveGridService.viewType === 'sortToolbarTool' && sortDescriptor(column.field).dir) || indicatorIcon || indicatorSVGIcon"
|
|
300
316
|
class="k-columnmenu-indicators">
|
|
301
317
|
<kendo-icon-wrapper
|
|
302
|
-
[name]="sortDescriptor(column.field).dir === 'asc' ? 'sort-asc-small' : 'sort-desc-small'"
|
|
303
|
-
[svgIcon]="sortDescriptor(column.field).dir === 'asc' ? sortAscSmallIcon : sortDescSmallIcon">
|
|
318
|
+
[name]="indicatorIcon ? indicatorIcon : sortDescriptor(column.field).dir === 'asc' ? 'sort-asc-small' : 'sort-desc-small'"
|
|
319
|
+
[svgIcon]="indicatorSVGIcon ? indicatorSVGIcon : sortDescriptor(column.field).dir === 'asc' ? sortAscSmallIcon : sortDescSmallIcon">
|
|
304
320
|
</kendo-icon-wrapper>
|
|
305
321
|
<span *ngIf="showSortNumbering(column)" class="k-sort-index">{{sortOrder(column.field)}}</span>
|
|
306
322
|
</span>
|
|
@@ -327,7 +343,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
|
|
|
327
343
|
standalone: true,
|
|
328
344
|
imports: [IconWrapperComponent, NgIf, NgTemplateOutlet]
|
|
329
345
|
}]
|
|
330
|
-
}], ctorParameters: function () { return [{ type: i0.NgZone }, { type: i1.ContextService }, { type: i2.AdaptiveGridService }]; }, propDecorators: { itemClick: [{
|
|
346
|
+
}], ctorParameters: function () { return [{ type: i0.NgZone }, { type: i1.ContextService }, { type: i2.AdaptiveGridService }, { type: i0.ElementRef }]; }, propDecorators: { itemClick: [{
|
|
331
347
|
type: Output
|
|
332
348
|
}], expand: [{
|
|
333
349
|
type: Output
|
|
@@ -337,6 +353,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
|
|
|
337
353
|
type: Input
|
|
338
354
|
}], svgIcon: [{
|
|
339
355
|
type: Input
|
|
356
|
+
}], indicatorIcon: [{
|
|
357
|
+
type: Input
|
|
358
|
+
}], indicatorSVGIcon: [{
|
|
359
|
+
type: Input
|
|
340
360
|
}], text: [{
|
|
341
361
|
type: Input
|
|
342
362
|
}], selected: [{
|
|
@@ -345,6 +365,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
|
|
|
345
365
|
type: Input
|
|
346
366
|
}], expanded: [{
|
|
347
367
|
type: Input
|
|
368
|
+
}], focused: [{
|
|
369
|
+
type: Input
|
|
348
370
|
}], service: [{
|
|
349
371
|
type: Input
|
|
350
372
|
}], column: [{
|
|
@@ -89,7 +89,7 @@ export class ColumnMenuLockComponent extends ColumnMenuItemBase {
|
|
|
89
89
|
(itemClick)="toggleColumn()"
|
|
90
90
|
[disabled]="disabled">
|
|
91
91
|
</kendo-grid-columnmenu-item>
|
|
92
|
-
`, isInline: true, dependencies: [{ kind: "component", type: ColumnMenuItemComponent, selector: "kendo-grid-columnmenu-item", inputs: ["icon", "svgIcon", "text", "selected", "disabled", "expanded", "service", "column"], outputs: ["itemClick", "expand", "collapse"] }] });
|
|
92
|
+
`, isInline: true, dependencies: [{ kind: "component", type: ColumnMenuItemComponent, selector: "kendo-grid-columnmenu-item", inputs: ["icon", "svgIcon", "indicatorIcon", "indicatorSVGIcon", "text", "selected", "disabled", "expanded", "focused", "service", "column"], outputs: ["itemClick", "expand", "collapse"] }] });
|
|
93
93
|
}
|
|
94
94
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ColumnMenuLockComponent, decorators: [{
|
|
95
95
|
type: Component,
|
|
@@ -138,7 +138,7 @@ export class ColumnMenuPositionComponent extends ColumnMenuItemBase {
|
|
|
138
138
|
</kendo-grid-columnmenu-stick>
|
|
139
139
|
</ng-template>
|
|
140
140
|
</kendo-grid-columnmenu-item>
|
|
141
|
-
`, isInline: true, dependencies: [{ kind: "component", type: ColumnMenuItemComponent, selector: "kendo-grid-columnmenu-item", inputs: ["icon", "svgIcon", "text", "selected", "disabled", "expanded", "service", "column"], outputs: ["itemClick", "expand", "collapse"] }, { kind: "directive", type: ColumnMenuItemContentTemplateDirective, selector: "[kendoGridColumnMenuItemContentTemplate]" }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: ColumnMenuLockComponent, selector: "kendo-grid-columnmenu-lock" }, { kind: "component", type: ColumnMenuStickComponent, selector: "kendo-grid-columnmenu-stick" }] });
|
|
141
|
+
`, isInline: true, dependencies: [{ kind: "component", type: ColumnMenuItemComponent, selector: "kendo-grid-columnmenu-item", inputs: ["icon", "svgIcon", "indicatorIcon", "indicatorSVGIcon", "text", "selected", "disabled", "expanded", "focused", "service", "column"], outputs: ["itemClick", "expand", "collapse"] }, { kind: "directive", type: ColumnMenuItemContentTemplateDirective, selector: "[kendoGridColumnMenuItemContentTemplate]" }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: ColumnMenuLockComponent, selector: "kendo-grid-columnmenu-lock" }, { kind: "component", type: ColumnMenuStickComponent, selector: "kendo-grid-columnmenu-stick" }] });
|
|
142
142
|
}
|
|
143
143
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ColumnMenuPositionComponent, decorators: [{
|
|
144
144
|
type: Component,
|
|
@@ -91,7 +91,7 @@ export class ColumnMenuSortComponent extends ColumnMenuItemBase {
|
|
|
91
91
|
(itemClick)="toggleSort('desc')"
|
|
92
92
|
[selected]="sortedDesc">
|
|
93
93
|
</kendo-grid-columnmenu-item>
|
|
94
|
-
`, isInline: true, dependencies: [{ kind: "component", type: ColumnMenuItemComponent, selector: "kendo-grid-columnmenu-item", inputs: ["icon", "svgIcon", "text", "selected", "disabled", "expanded", "service", "column"], outputs: ["itemClick", "expand", "collapse"] }] });
|
|
94
|
+
`, isInline: true, dependencies: [{ kind: "component", type: ColumnMenuItemComponent, selector: "kendo-grid-columnmenu-item", inputs: ["icon", "svgIcon", "indicatorIcon", "indicatorSVGIcon", "text", "selected", "disabled", "expanded", "focused", "service", "column"], outputs: ["itemClick", "expand", "collapse"] }] });
|
|
95
95
|
}
|
|
96
96
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ColumnMenuSortComponent, decorators: [{
|
|
97
97
|
type: Component,
|
|
@@ -91,7 +91,7 @@ export class ColumnMenuStickComponent extends ColumnMenuItemBase {
|
|
|
91
91
|
(itemClick)="toggleColumn()"
|
|
92
92
|
[disabled]="disabled">
|
|
93
93
|
</kendo-grid-columnmenu-item>
|
|
94
|
-
`, isInline: true, dependencies: [{ kind: "component", type: ColumnMenuItemComponent, selector: "kendo-grid-columnmenu-item", inputs: ["icon", "svgIcon", "text", "selected", "disabled", "expanded", "service", "column"], outputs: ["itemClick", "expand", "collapse"] }] });
|
|
94
|
+
`, isInline: true, dependencies: [{ kind: "component", type: ColumnMenuItemComponent, selector: "kendo-grid-columnmenu-item", inputs: ["icon", "svgIcon", "indicatorIcon", "indicatorSVGIcon", "text", "selected", "disabled", "expanded", "focused", "service", "column"], outputs: ["itemClick", "expand", "collapse"] }] });
|
|
95
95
|
}
|
|
96
96
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ColumnMenuStickComponent, decorators: [{
|
|
97
97
|
type: Component,
|
|
@@ -915,6 +915,39 @@ export class GridComponent {
|
|
|
915
915
|
get scrollbarWidth() {
|
|
916
916
|
return this.supportService.scrollbarWidth;
|
|
917
917
|
}
|
|
918
|
+
get showPagerInput() {
|
|
919
|
+
return this._showPagerInput;
|
|
920
|
+
}
|
|
921
|
+
set showPagerInput(value) {
|
|
922
|
+
if (this._showPagerInput === value) {
|
|
923
|
+
return;
|
|
924
|
+
}
|
|
925
|
+
this._showPagerInput = value;
|
|
926
|
+
}
|
|
927
|
+
get showPagerPageText() {
|
|
928
|
+
return this._showPagerPageText;
|
|
929
|
+
}
|
|
930
|
+
set showPagerPageText(value) {
|
|
931
|
+
if (!this.normalizedPageableSettings?.responsive) {
|
|
932
|
+
this._showPagerPageText = true;
|
|
933
|
+
}
|
|
934
|
+
if (this._showPagerPageText === value) {
|
|
935
|
+
return;
|
|
936
|
+
}
|
|
937
|
+
this._showPagerPageText = value;
|
|
938
|
+
}
|
|
939
|
+
get showPagerItemsText() {
|
|
940
|
+
return this._showPagerItemsText;
|
|
941
|
+
}
|
|
942
|
+
set showPagerItemsText(value) {
|
|
943
|
+
if (!this.normalizedPageableSettings?.responsive) {
|
|
944
|
+
this._showPagerItemsText = true;
|
|
945
|
+
}
|
|
946
|
+
if (this._showPagerItemsText === value) {
|
|
947
|
+
return;
|
|
948
|
+
}
|
|
949
|
+
this._showPagerItemsText = value;
|
|
950
|
+
}
|
|
918
951
|
get headerPadding() {
|
|
919
952
|
if (isUniversal()) {
|
|
920
953
|
return '';
|
|
@@ -985,6 +1018,9 @@ export class GridComponent {
|
|
|
985
1018
|
_navigable = ['table', 'pager', 'toolbar'];
|
|
986
1019
|
_size = 'medium';
|
|
987
1020
|
_loading = false;
|
|
1021
|
+
_showPagerInput = true;
|
|
1022
|
+
_showPagerPageText = true;
|
|
1023
|
+
_showPagerItemsText = true;
|
|
988
1024
|
get isVirtual() {
|
|
989
1025
|
return this.scrollable === 'virtual';
|
|
990
1026
|
}
|
|
@@ -1627,6 +1663,12 @@ export class GridComponent {
|
|
|
1627
1663
|
}
|
|
1628
1664
|
this.pageChange.emit(event);
|
|
1629
1665
|
}
|
|
1666
|
+
/**
|
|
1667
|
+
* @hidden
|
|
1668
|
+
*/
|
|
1669
|
+
handlePagerVisibilityChange(prop, ev) {
|
|
1670
|
+
this[prop] = ev;
|
|
1671
|
+
}
|
|
1630
1672
|
/**
|
|
1631
1673
|
* @hidden
|
|
1632
1674
|
*/
|
|
@@ -2707,7 +2749,10 @@ export class GridComponent {
|
|
|
2707
2749
|
[pageSizeValues]="normalizedPageableSettings.pageSizes"
|
|
2708
2750
|
[previousNext]="normalizedPageableSettings.previousNext"
|
|
2709
2751
|
[type]="normalizedPageableSettings.type"
|
|
2710
|
-
(pageChange)="notifyPageChange('pager', $event)"
|
|
2752
|
+
(pageChange)="notifyPageChange('pager', $event)"
|
|
2753
|
+
(pagerInputVisibilityChange)="handlePagerVisibilityChange('showPagerInput', $event)"
|
|
2754
|
+
(pageTextVisibilityChange)="handlePagerVisibilityChange('showPagerPageText', $event)"
|
|
2755
|
+
(itemsTextVisibilityChange)="handlePagerVisibilityChange('showPagerItemsText', $event)">
|
|
2711
2756
|
<ng-template kendoPagerTemplate>
|
|
2712
2757
|
<ng-container
|
|
2713
2758
|
[ngTemplateOutlet]="pagerTemplate ? pagerTemplate?.templateRef : defaultPager"
|
|
@@ -3030,7 +3075,10 @@ export class GridComponent {
|
|
|
3030
3075
|
[pageSizeValues]="normalizedPageableSettings.pageSizes"
|
|
3031
3076
|
[previousNext]="normalizedPageableSettings.previousNext"
|
|
3032
3077
|
[type]="normalizedPageableSettings.type"
|
|
3033
|
-
(pageChange)="notifyPageChange('pager', $event)"
|
|
3078
|
+
(pageChange)="notifyPageChange('pager', $event)"
|
|
3079
|
+
(pagerInputVisibilityChange)="handlePagerVisibilityChange('showPagerInput', $event)"
|
|
3080
|
+
(pageTextVisibilityChange)="handlePagerVisibilityChange('showPagerPageText', $event)"
|
|
3081
|
+
(itemsTextVisibilityChange)="handlePagerVisibilityChange('showPagerItemsText', $event)">
|
|
3034
3082
|
<ng-template kendoPagerTemplate>
|
|
3035
3083
|
<ng-container
|
|
3036
3084
|
[ngTemplateOutlet]="pagerTemplate ? pagerTemplate?.templateRef : defaultPager"
|
|
@@ -3078,12 +3126,13 @@ export class GridComponent {
|
|
|
3078
3126
|
*ngIf="normalizedPageableSettings.type === 'numeric' && normalizedPageableSettings.buttonCount > 0"
|
|
3079
3127
|
[buttonCount]="normalizedPageableSettings.buttonCount">
|
|
3080
3128
|
</kendo-pager-numeric-buttons>
|
|
3081
|
-
<kendo-pager-input [size]="size" *ngIf="normalizedPageableSettings.type === 'input'"></kendo-pager-input>
|
|
3129
|
+
<kendo-pager-input [size]="size" *ngIf="normalizedPageableSettings.type === 'input' || showPagerInput" [showPageText]="showPagerPageText"></kendo-pager-input>
|
|
3082
3130
|
<kendo-pager-next-buttons [size]="size" *ngIf="normalizedPageableSettings.previousNext"></kendo-pager-next-buttons>
|
|
3083
3131
|
</div>
|
|
3084
3132
|
<kendo-pager-page-sizes *ngIf="normalizedPageableSettings.pageSizes"
|
|
3085
3133
|
[size]="size"
|
|
3086
|
-
[pageSizes]="normalizedPageableSettings.pageSizes"
|
|
3134
|
+
[pageSizes]="normalizedPageableSettings.pageSizes"
|
|
3135
|
+
[showItemsText]="showPagerItemsText">
|
|
3087
3136
|
</kendo-pager-page-sizes>
|
|
3088
3137
|
<kendo-pager-info *ngIf="normalizedPageableSettings.info">
|
|
3089
3138
|
</kendo-pager-info>
|
|
@@ -3093,7 +3142,7 @@ export class GridComponent {
|
|
|
3093
3142
|
<kendo-grid-adaptive-renderer *ngIf="isAdaptiveModeEnabled"></kendo-grid-adaptive-renderer>
|
|
3094
3143
|
|
|
3095
3144
|
<div kendoWatermarkOverlay *ngIf="showLicenseWatermark"></div>
|
|
3096
|
-
`, isInline: true, dependencies: [{ kind: "directive", type: LocalizedMessagesDirective, selector: "[kendoGridLocalizedMessages]" }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: GridToolbarComponent, selector: "kendo-grid-toolbar", inputs: ["position", "size", "navigable"] }, { kind: "component", type: GroupPanelComponent, selector: "kendo-grid-group-panel", inputs: ["text", "navigable", "groups"], outputs: ["change"] }, { kind: "directive", type: TableDirective, selector: "[kendoGridResizableTable]", inputs: ["locked", "virtualColumns"] }, { kind: "directive", type: GridTableDirective, selector: "[kendoGridTable]", inputs: ["size"] }, { kind: "component", type: ColGroupComponent, selector: "[kendoGridColGroup]", inputs: ["columns", "groups", "detailTemplate", "sort"] }, { kind: "component", type: HeaderComponent, selector: "[kendoGridHeader]", inputs: ["totalColumnLevels", "columns", "groups", "detailTemplate", "scrollable", "filterable", "sort", "filter", "sortable", "groupable", "lockedColumnsCount", "resizable", "reorderable", "columnMenu", "columnMenuTemplate", "totalColumnsCount", "totalColumns", "tabIndex", "size"] }, { kind: "directive", type: ResizableContainerDirective, selector: "[kendoGridResizableContainer]", inputs: ["lockedWidth", "kendoGridResizableContainer"] }, { kind: "component", type: ListComponent, selector: "kendo-grid-list", inputs: ["data", "groups", "total", "rowHeight", "stickyRowHeight", "detailRowHeight", "take", "skip", "columns", "detailTemplate", "noRecordsTemplate", "selectable", "groupable", "filterable", "rowClass", "rowSticky", "loading", "trackBy", "virtualColumns", "isVirtual", "cellLoadingTemplate", "loadingTemplate", "sort", "size"], outputs: ["contentScroll", "pageChange", "scrollBottom"] }, { kind: "directive", type: DragTargetContainerDirective, selector: "[kendoDragTargetContainer]", inputs: ["hint", "dragTargetFilter", "dragHandle", "dragDelay", "threshold", "dragTargetId", "dragData", "dragDisabled", "mode", "cursorStyle", "hintContext"], outputs: ["onDragReady", "onPress", "onDragStart", "onDrag", "onRelease", "onDragEnd"], exportAs: ["kendoDragTargetContainer"] }, { kind: "directive", type: DropTargetContainerDirective, selector: "[kendoDropTargetContainer]", inputs: ["dropTargetFilter", "dropDisabled"], outputs: ["onDragEnter", "onDragOver", "onDragLeave", "onDrop"], exportAs: ["kendoDropTargetContainer"] }, { kind: "directive", type: DraggableDirective, selector: "[kendoDraggable]", inputs: ["enableDrag"], outputs: ["kendoPress", "kendoDrag", "kendoRelease"] }, { kind: "directive", type: GridMarqueeDirective, selector: "[kendoGridSelectionMarquee]" }, { kind: "component", type: FooterComponent, selector: "[kendoGridFooter]", inputs: ["columns", "groups", "detailTemplate", "scrollable", "lockedColumnsCount", "logicalRowIndex", "totalColumns", "totalColumnsCount"] }, { kind: "component", type: TableBodyComponent, selector: "[kendoGridTableBody]", inputs: ["columns", "allColumns", "groups", "detailTemplate", "noRecordsTemplate", "data", "skip", "selectable", "filterable", "noRecordsText", "isLocked", "isLoading", "isVirtual", "cellLoadingTemplate", "skipGroupDecoration", "showGroupFooters", "lockedColumnsCount", "totalColumnsCount", "virtualColumns", "trackBy", "rowSticky", "totalColumns", "rowClass"] }, { kind: "component", type: LoadingComponent, selector: "[kendoGridLoading]", inputs: ["loadingTemplate"] }, { kind: "component", type: StatusBarComponent, selector: "kendo-grid-status-bar", inputs: ["statusBarTemplate"] }, { kind: "component", type: IconWrapperComponent, selector: "kendo-icon-wrapper", inputs: ["name", "svgIcon", "innerCssClass", "customFontClass", "size"], exportAs: ["kendoIconWrapper"] }, { kind: "component", type: WatermarkOverlayComponent, selector: "div[kendoWatermarkOverlay]" }, { kind: "component", type: i27.CustomMessagesComponent, selector: "kendo-datapager-messages, kendo-pager-messages" }, { kind: "component", type: i27.PagerInfoComponent, selector: "kendo-datapager-info, kendo-pager-info" }, { kind: "component", type: i27.PagerInputComponent, selector: "kendo-datapager-input, kendo-pager-input", inputs: ["showPageText", "size"] }, { kind: "component", type: i27.PagerNextButtonsComponent, selector: "kendo-datapager-next-buttons, kendo-pager-next-buttons", inputs: ["size"] }, { kind: "component", type: i27.PagerNumericButtonsComponent, selector: "kendo-datapager-numeric-buttons, kendo-pager-numeric-buttons", inputs: ["buttonCount", "size"] }, { kind: "component", type: i27.PagerPageSizesComponent, selector: "kendo-datapager-page-sizes, kendo-pager-page-sizes", inputs: ["showItemsText", "pageSizes", "size", "adaptiveMode"] }, { kind: "component", type: i27.PagerPrevButtonsComponent, selector: "kendo-datapager-prev-buttons, kendo-pager-prev-buttons", inputs: ["size"] }, { kind: "directive", type: i27.PagerTemplateDirective, selector: "[kendoDataPagerTemplate], [kendoPagerTemplate]" }, { kind: "component", type: i27.PagerComponent, selector: "kendo-datapager, kendo-pager", inputs: ["externalTemplate", "total", "skip", "pageSize", "buttonCount", "info", "type", "pageSizeValues", "previousNext", "navigable", "size", "responsive", "adaptiveMode"], outputs: ["pageChange", "pageSizeChange"], exportAs: ["kendoDataPager", "kendoPager"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: AdaptiveRendererComponent, selector: "kendo-grid-adaptive-renderer" }], encapsulation: i0.ViewEncapsulation.None });
|
|
3145
|
+
`, isInline: true, dependencies: [{ kind: "directive", type: LocalizedMessagesDirective, selector: "[kendoGridLocalizedMessages]" }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: GridToolbarComponent, selector: "kendo-grid-toolbar", inputs: ["position", "size", "navigable"] }, { kind: "component", type: GroupPanelComponent, selector: "kendo-grid-group-panel", inputs: ["text", "navigable", "groups"], outputs: ["change"] }, { kind: "directive", type: TableDirective, selector: "[kendoGridResizableTable]", inputs: ["locked", "virtualColumns"] }, { kind: "directive", type: GridTableDirective, selector: "[kendoGridTable]", inputs: ["size"] }, { kind: "component", type: ColGroupComponent, selector: "[kendoGridColGroup]", inputs: ["columns", "groups", "detailTemplate", "sort"] }, { kind: "component", type: HeaderComponent, selector: "[kendoGridHeader]", inputs: ["totalColumnLevels", "columns", "groups", "detailTemplate", "scrollable", "filterable", "sort", "filter", "sortable", "groupable", "lockedColumnsCount", "resizable", "reorderable", "columnMenu", "columnMenuTemplate", "totalColumnsCount", "totalColumns", "tabIndex", "size"] }, { kind: "directive", type: ResizableContainerDirective, selector: "[kendoGridResizableContainer]", inputs: ["lockedWidth", "kendoGridResizableContainer"] }, { kind: "component", type: ListComponent, selector: "kendo-grid-list", inputs: ["data", "groups", "total", "rowHeight", "stickyRowHeight", "detailRowHeight", "take", "skip", "columns", "detailTemplate", "noRecordsTemplate", "selectable", "groupable", "filterable", "rowClass", "rowSticky", "loading", "trackBy", "virtualColumns", "isVirtual", "cellLoadingTemplate", "loadingTemplate", "sort", "size"], outputs: ["contentScroll", "pageChange", "scrollBottom"] }, { kind: "directive", type: DragTargetContainerDirective, selector: "[kendoDragTargetContainer]", inputs: ["hint", "dragTargetFilter", "dragHandle", "dragDelay", "threshold", "dragTargetId", "dragData", "dragDisabled", "mode", "cursorStyle", "hintContext"], outputs: ["onDragReady", "onPress", "onDragStart", "onDrag", "onRelease", "onDragEnd"], exportAs: ["kendoDragTargetContainer"] }, { kind: "directive", type: DropTargetContainerDirective, selector: "[kendoDropTargetContainer]", inputs: ["dropTargetFilter", "dropDisabled"], outputs: ["onDragEnter", "onDragOver", "onDragLeave", "onDrop"], exportAs: ["kendoDropTargetContainer"] }, { kind: "directive", type: DraggableDirective, selector: "[kendoDraggable]", inputs: ["enableDrag"], outputs: ["kendoPress", "kendoDrag", "kendoRelease"] }, { kind: "directive", type: GridMarqueeDirective, selector: "[kendoGridSelectionMarquee]" }, { kind: "component", type: FooterComponent, selector: "[kendoGridFooter]", inputs: ["columns", "groups", "detailTemplate", "scrollable", "lockedColumnsCount", "logicalRowIndex", "totalColumns", "totalColumnsCount"] }, { kind: "component", type: TableBodyComponent, selector: "[kendoGridTableBody]", inputs: ["columns", "allColumns", "groups", "detailTemplate", "noRecordsTemplate", "data", "skip", "selectable", "filterable", "noRecordsText", "isLocked", "isLoading", "isVirtual", "cellLoadingTemplate", "skipGroupDecoration", "showGroupFooters", "lockedColumnsCount", "totalColumnsCount", "virtualColumns", "trackBy", "rowSticky", "totalColumns", "rowClass"] }, { kind: "component", type: LoadingComponent, selector: "[kendoGridLoading]", inputs: ["loadingTemplate"] }, { kind: "component", type: StatusBarComponent, selector: "kendo-grid-status-bar", inputs: ["statusBarTemplate"] }, { kind: "component", type: IconWrapperComponent, selector: "kendo-icon-wrapper", inputs: ["name", "svgIcon", "innerCssClass", "customFontClass", "size"], exportAs: ["kendoIconWrapper"] }, { kind: "component", type: WatermarkOverlayComponent, selector: "div[kendoWatermarkOverlay]" }, { kind: "component", type: i27.CustomMessagesComponent, selector: "kendo-datapager-messages, kendo-pager-messages" }, { kind: "component", type: i27.PagerInfoComponent, selector: "kendo-datapager-info, kendo-pager-info" }, { kind: "component", type: i27.PagerInputComponent, selector: "kendo-datapager-input, kendo-pager-input", inputs: ["showPageText", "size"] }, { kind: "component", type: i27.PagerNextButtonsComponent, selector: "kendo-datapager-next-buttons, kendo-pager-next-buttons", inputs: ["size"] }, { kind: "component", type: i27.PagerNumericButtonsComponent, selector: "kendo-datapager-numeric-buttons, kendo-pager-numeric-buttons", inputs: ["buttonCount", "size"] }, { kind: "component", type: i27.PagerPageSizesComponent, selector: "kendo-datapager-page-sizes, kendo-pager-page-sizes", inputs: ["showItemsText", "pageSizes", "size", "adaptiveMode"] }, { kind: "component", type: i27.PagerPrevButtonsComponent, selector: "kendo-datapager-prev-buttons, kendo-pager-prev-buttons", inputs: ["size"] }, { kind: "directive", type: i27.PagerTemplateDirective, selector: "[kendoDataPagerTemplate], [kendoPagerTemplate]" }, { kind: "component", type: i27.PagerComponent, selector: "kendo-datapager, kendo-pager", inputs: ["externalTemplate", "total", "skip", "pageSize", "buttonCount", "info", "type", "pageSizeValues", "previousNext", "navigable", "size", "responsive", "adaptiveMode"], outputs: ["pageChange", "pageSizeChange", "pagerInputVisibilityChange", "pageTextVisibilityChange", "itemsTextVisibilityChange"], exportAs: ["kendoDataPager", "kendoPager"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: AdaptiveRendererComponent, selector: "kendo-grid-adaptive-renderer" }], encapsulation: i0.ViewEncapsulation.None });
|
|
3097
3146
|
}
|
|
3098
3147
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: GridComponent, decorators: [{
|
|
3099
3148
|
type: Component,
|
|
@@ -3511,7 +3560,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
|
|
|
3511
3560
|
[pageSizeValues]="normalizedPageableSettings.pageSizes"
|
|
3512
3561
|
[previousNext]="normalizedPageableSettings.previousNext"
|
|
3513
3562
|
[type]="normalizedPageableSettings.type"
|
|
3514
|
-
(pageChange)="notifyPageChange('pager', $event)"
|
|
3563
|
+
(pageChange)="notifyPageChange('pager', $event)"
|
|
3564
|
+
(pagerInputVisibilityChange)="handlePagerVisibilityChange('showPagerInput', $event)"
|
|
3565
|
+
(pageTextVisibilityChange)="handlePagerVisibilityChange('showPagerPageText', $event)"
|
|
3566
|
+
(itemsTextVisibilityChange)="handlePagerVisibilityChange('showPagerItemsText', $event)">
|
|
3515
3567
|
<ng-template kendoPagerTemplate>
|
|
3516
3568
|
<ng-container
|
|
3517
3569
|
[ngTemplateOutlet]="pagerTemplate ? pagerTemplate?.templateRef : defaultPager"
|
|
@@ -3834,7 +3886,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
|
|
|
3834
3886
|
[pageSizeValues]="normalizedPageableSettings.pageSizes"
|
|
3835
3887
|
[previousNext]="normalizedPageableSettings.previousNext"
|
|
3836
3888
|
[type]="normalizedPageableSettings.type"
|
|
3837
|
-
(pageChange)="notifyPageChange('pager', $event)"
|
|
3889
|
+
(pageChange)="notifyPageChange('pager', $event)"
|
|
3890
|
+
(pagerInputVisibilityChange)="handlePagerVisibilityChange('showPagerInput', $event)"
|
|
3891
|
+
(pageTextVisibilityChange)="handlePagerVisibilityChange('showPagerPageText', $event)"
|
|
3892
|
+
(itemsTextVisibilityChange)="handlePagerVisibilityChange('showPagerItemsText', $event)">
|
|
3838
3893
|
<ng-template kendoPagerTemplate>
|
|
3839
3894
|
<ng-container
|
|
3840
3895
|
[ngTemplateOutlet]="pagerTemplate ? pagerTemplate?.templateRef : defaultPager"
|
|
@@ -3882,12 +3937,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
|
|
|
3882
3937
|
*ngIf="normalizedPageableSettings.type === 'numeric' && normalizedPageableSettings.buttonCount > 0"
|
|
3883
3938
|
[buttonCount]="normalizedPageableSettings.buttonCount">
|
|
3884
3939
|
</kendo-pager-numeric-buttons>
|
|
3885
|
-
<kendo-pager-input [size]="size" *ngIf="normalizedPageableSettings.type === 'input'"></kendo-pager-input>
|
|
3940
|
+
<kendo-pager-input [size]="size" *ngIf="normalizedPageableSettings.type === 'input' || showPagerInput" [showPageText]="showPagerPageText"></kendo-pager-input>
|
|
3886
3941
|
<kendo-pager-next-buttons [size]="size" *ngIf="normalizedPageableSettings.previousNext"></kendo-pager-next-buttons>
|
|
3887
3942
|
</div>
|
|
3888
3943
|
<kendo-pager-page-sizes *ngIf="normalizedPageableSettings.pageSizes"
|
|
3889
3944
|
[size]="size"
|
|
3890
|
-
[pageSizes]="normalizedPageableSettings.pageSizes"
|
|
3945
|
+
[pageSizes]="normalizedPageableSettings.pageSizes"
|
|
3946
|
+
[showItemsText]="showPagerItemsText">
|
|
3891
3947
|
</kendo-pager-page-sizes>
|
|
3892
3948
|
<kendo-pager-info *ngIf="normalizedPageableSettings.info">
|
|
3893
3949
|
</kendo-pager-info>
|
|
@@ -10,7 +10,7 @@ export const packageMetadata = {
|
|
|
10
10
|
productName: 'Kendo UI for Angular',
|
|
11
11
|
productCode: 'KENDOUIANGULAR',
|
|
12
12
|
productCodes: ['KENDOUIANGULAR'],
|
|
13
|
-
publishDate:
|
|
14
|
-
version: '19.0.0-develop.
|
|
13
|
+
publishDate: 1747671447,
|
|
14
|
+
version: '19.0.0-develop.25',
|
|
15
15
|
licensingDocsUrl: 'https://www.telerik.com/kendo-angular-ui/my-license/'
|
|
16
16
|
};
|
|
@@ -149,6 +149,7 @@ export class ColumnChooserToolbarDirective extends ToolbarToolBase {
|
|
|
149
149
|
this.renderer.setAttribute(popupAriaElement, 'role', 'dialog');
|
|
150
150
|
this.buttonElement?.setAttribute('aria-expanded', 'true');
|
|
151
151
|
this.buttonElement?.setAttribute('aria-controls', popupId);
|
|
152
|
+
this.host.selected = true;
|
|
152
153
|
const columnList = this.popupRef.content.instance;
|
|
153
154
|
columnList.isLast = true;
|
|
154
155
|
columnList.autoSync = this.autoSync;
|
|
@@ -180,6 +181,7 @@ export class ColumnChooserToolbarDirective extends ToolbarToolBase {
|
|
|
180
181
|
this.popupRef = null;
|
|
181
182
|
this.buttonElement?.setAttribute('aria-expanded', 'false');
|
|
182
183
|
this.buttonElement?.removeAttribute('aria-controls');
|
|
184
|
+
this.host.selected = false;
|
|
183
185
|
focusAnchor && this.buttonElement?.focus();
|
|
184
186
|
}
|
|
185
187
|
get buttonElement() {
|
|
@@ -53,6 +53,12 @@ export class FilterCommandToolbarDirective {
|
|
|
53
53
|
toolSubs = new Subscription();
|
|
54
54
|
popupSubs;
|
|
55
55
|
removeClickListener;
|
|
56
|
+
/**
|
|
57
|
+
* @hidden
|
|
58
|
+
*/
|
|
59
|
+
isFilterApplied(filter) {
|
|
60
|
+
return isPresent(filter) && filter.filters?.length > 0;
|
|
61
|
+
}
|
|
56
62
|
constructor(host, popupService, ctx, filterService, columnInfoService, ngZone, renderer, adaptiveGridService) {
|
|
57
63
|
this.host = host;
|
|
58
64
|
this.popupService = popupService;
|
|
@@ -66,8 +72,9 @@ export class FilterCommandToolbarDirective {
|
|
|
66
72
|
ngOnInit() {
|
|
67
73
|
this.toolSubs = this.host.click.subscribe(e => this.onClick(e));
|
|
68
74
|
this.toolSubs.add(this.filterService.changes.subscribe(filter => {
|
|
69
|
-
this.host.showBadge =
|
|
75
|
+
this.host.showBadge = this.isFilterApplied(filter);
|
|
70
76
|
}));
|
|
77
|
+
this.host.showBadge = this.isFilterApplied(this.ctx.grid.filter);
|
|
71
78
|
const hasToolbarIcon = isPresent(this.host.toolbarOptions.icon) && this.host.toolbarOptions.icon !== '';
|
|
72
79
|
const hasOverflowIcon = isPresent(this.host.overflowOptions.icon) && this.host.overflowOptions.icon !== '';
|
|
73
80
|
const hasIcon = hasToolbarIcon && hasOverflowIcon;
|
|
@@ -87,7 +94,7 @@ export class FilterCommandToolbarDirective {
|
|
|
87
94
|
}
|
|
88
95
|
this.buttonElement?.setAttribute('aria-haspopup', 'dialog');
|
|
89
96
|
this.buttonElement?.setAttribute('aria-expanded', 'false');
|
|
90
|
-
this.buttonElement?.setAttribute('title', this.ctx.localization.get('
|
|
97
|
+
this.buttonElement?.setAttribute('title', this.ctx.localization.get('filterToolbarToolText'));
|
|
91
98
|
}
|
|
92
99
|
ngOnDestroy() {
|
|
93
100
|
if (this.toolSubs) {
|
|
@@ -132,13 +139,16 @@ export class FilterCommandToolbarDirective {
|
|
|
132
139
|
});
|
|
133
140
|
this.adaptiveGridService.popupRef = this.popupRef;
|
|
134
141
|
this.setPopupAttributes();
|
|
142
|
+
this.host.selected = true;
|
|
135
143
|
this.ngZone.runOutsideAngular(() => {
|
|
136
144
|
if (!isDocumentAvailable()) {
|
|
137
145
|
return;
|
|
138
146
|
}
|
|
139
147
|
this.removeClickListener = this.renderer.listen('document', 'click', (e) => {
|
|
140
148
|
if (this.popupRef && !closest(e.target, node => node === this.popupRef.popupElement || node === this.buttonElement)) {
|
|
141
|
-
this.
|
|
149
|
+
this.ngZone.run(() => {
|
|
150
|
+
this.closePopup();
|
|
151
|
+
});
|
|
142
152
|
}
|
|
143
153
|
});
|
|
144
154
|
});
|
|
@@ -172,6 +182,7 @@ export class FilterCommandToolbarDirective {
|
|
|
172
182
|
closePopup() {
|
|
173
183
|
this.buttonElement?.setAttribute('aria-expanded', 'false');
|
|
174
184
|
this.buttonElement?.removeAttribute('aria-controls');
|
|
185
|
+
this.host.selected = false;
|
|
175
186
|
if (this.popupRef) {
|
|
176
187
|
this.popupRef.close();
|
|
177
188
|
this.popupRef = null;
|