@progress/kendo-angular-pivotgrid 17.0.0-develop.5 → 17.0.0-develop.7
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/configurator/chip-menu/chip-menu.component.d.ts +6 -4
- package/configurator/configurator.component.d.ts +2 -5
- package/esm2020/configurator/chip-menu/chip-menu.component.mjs +16 -31
- package/esm2020/configurator/configurator.component.mjs +83 -85
- package/esm2020/package-metadata.mjs +2 -2
- package/esm2020/pivotgrid.component.mjs +3 -3
- package/esm2020/rendering/pivotgrid-cell.directive.mjs +8 -7
- package/fesm2015/progress-kendo-angular-pivotgrid.mjs +109 -128
- package/fesm2020/progress-kendo-angular-pivotgrid.mjs +109 -126
- package/package.json +12 -12
- package/schematics/ngAdd/index.js +2 -2
@@ -2,12 +2,13 @@
|
|
2
2
|
* Copyright © 2024 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 { OnDestroy,
|
5
|
+
import { OnDestroy, Renderer2, TemplateRef } from '@angular/core';
|
6
6
|
import { SinglePopupService } from './single-popup.service';
|
7
7
|
import { ChipMenuService } from './chip-menu.service';
|
8
8
|
import { PivotLocalizationService } from '../../localization/pivot-localization.service';
|
9
9
|
import { AxisDescriptor } from '@progress/kendo-pivotgrid-common';
|
10
10
|
import { SVGIcon } from '@progress/kendo-svg-icons';
|
11
|
+
import { ChipComponent } from '@progress/kendo-angular-buttons';
|
11
12
|
import * as i0 from "@angular/core";
|
12
13
|
/**
|
13
14
|
* @hidden
|
@@ -25,15 +26,16 @@ export declare class ChipMenuComponent implements OnDestroy {
|
|
25
26
|
chip: AxisDescriptor;
|
26
27
|
tabIndex: string;
|
27
28
|
isMeasureField: boolean;
|
28
|
-
anchor:
|
29
|
+
anchor: ChipComponent;
|
30
|
+
template: TemplateRef<any>;
|
29
31
|
menuItemSVGIcon: SVGIcon;
|
30
32
|
private popupRef;
|
31
33
|
private closeSubscription;
|
32
34
|
constructor(popupService: SinglePopupService, localization: PivotLocalizationService, service: ChipMenuService, renderer: Renderer2);
|
33
35
|
ngOnDestroy(): void;
|
34
|
-
toggle(e: any
|
36
|
+
toggle(e: any): void;
|
35
37
|
close(): void;
|
36
38
|
get chipMenuTitle(): string;
|
37
39
|
static ɵfac: i0.ɵɵFactoryDeclaration<ChipMenuComponent, never>;
|
38
|
-
static ɵcmp: i0.ɵɵComponentDeclaration<ChipMenuComponent, "kendo-pivot-chip-menu", never, { "chip": "chip"; "tabIndex": "tabIndex"; "isMeasureField": "isMeasureField"; }, {}, never, never, true, never>;
|
40
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<ChipMenuComponent, "kendo-pivot-chip-menu", never, { "chip": "chip"; "tabIndex": "tabIndex"; "isMeasureField": "isMeasureField"; "anchor": "anchor"; }, {}, never, never, true, never>;
|
39
41
|
}
|
@@ -81,10 +81,7 @@ export declare class PivotGridConfiguratorComponent implements OnInit, OnChanges
|
|
81
81
|
* Child nodes are concatinated to the root level nodes.
|
82
82
|
*/
|
83
83
|
setChecked(fields?: any[]): void;
|
84
|
-
|
85
|
-
* A function which determines if a specific node is checked/
|
86
|
-
*/
|
87
|
-
isItemChecked(node: any): any;
|
84
|
+
checkItemBy: (context: any) => any;
|
88
85
|
/**
|
89
86
|
* Determines if a checkbox should be rendered.
|
90
87
|
*/
|
@@ -101,7 +98,7 @@ export declare class PivotGridConfiguratorComponent implements OnInit, OnChanges
|
|
101
98
|
children: TreeItem[];
|
102
99
|
item: TreeItem;
|
103
100
|
}): void;
|
104
|
-
handleCheckedChange(event: any
|
101
|
+
handleCheckedChange(event: any): void;
|
105
102
|
onTreeViewSelect(ev: Event): void;
|
106
103
|
onTreeViewEscape(ev: KeyboardEvent): void;
|
107
104
|
handleSubmit(): void;
|
@@ -4,7 +4,7 @@
|
|
4
4
|
*-------------------------------------------------------------------------------------------*/
|
5
5
|
/* eslint-disable @typescript-eslint/no-explicit-any */
|
6
6
|
import { MenuTabbingService } from './filtering/menu-tabbing.service';
|
7
|
-
import { Component, Input,
|
7
|
+
import { Component, Input, ViewChild, Renderer2, TemplateRef } from '@angular/core';
|
8
8
|
import { SinglePopupService } from './single-popup.service';
|
9
9
|
import { ChipMenuService } from './chip-menu.service';
|
10
10
|
import { PivotLocalizationService } from '../../localization/pivot-localization.service';
|
@@ -17,6 +17,7 @@ import { ChipMenuSortComponent } from './chip-menu-sort.component';
|
|
17
17
|
import { NgIf } from '@angular/common';
|
18
18
|
import { ChipMenuContainerComponent } from './chip-menu-container.component';
|
19
19
|
import { IconWrapperComponent } from '@progress/kendo-angular-icons';
|
20
|
+
import { ChipComponent } from '@progress/kendo-angular-buttons';
|
20
21
|
import * as i0 from "@angular/core";
|
21
22
|
import * as i1 from "./single-popup.service";
|
22
23
|
import * as i2 from "../../localization/pivot-localization.service";
|
@@ -42,22 +43,22 @@ export class ChipMenuComponent {
|
|
42
43
|
this.close();
|
43
44
|
this.closeSubscription.unsubscribe();
|
44
45
|
}
|
45
|
-
toggle(e
|
46
|
-
if (e) {
|
47
|
-
e.preventDefault();
|
48
|
-
e.stopImmediatePropagation();
|
46
|
+
toggle(e) {
|
47
|
+
if (e?.originalEvent) {
|
48
|
+
e.originalEvent.preventDefault();
|
49
|
+
e.originalEvent.stopImmediatePropagation();
|
49
50
|
}
|
50
|
-
const
|
51
|
-
this.popupRef = this.popupService.open(
|
51
|
+
const anchorElement = this.anchor.element.nativeElement;
|
52
|
+
this.popupRef = this.popupService.open(anchorElement, this.template, this.popupRef, POPUP_CLASS);
|
52
53
|
this.popupRef && this.renderer.setAttribute(this.popupRef.popupElement, 'dir', this.localization.rtl ? 'rtl' : 'ltr');
|
53
54
|
if (!this.popupRef) {
|
54
|
-
|
55
|
+
anchorElement.focus();
|
55
56
|
}
|
56
57
|
}
|
57
58
|
close() {
|
58
59
|
this.popupService.destroy();
|
59
60
|
this.popupRef = null;
|
60
|
-
this.anchor.nativeElement.closest('.k-chip').focus();
|
61
|
+
this.anchor.element.nativeElement.closest('.k-chip').focus();
|
61
62
|
}
|
62
63
|
get chipMenuTitle() {
|
63
64
|
const localizationMsg = this.localization.get('chipMenuIconTitle') || '';
|
@@ -66,19 +67,10 @@ export class ChipMenuComponent {
|
|
66
67
|
}
|
67
68
|
}
|
68
69
|
ChipMenuComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: ChipMenuComponent, deps: [{ token: i1.SinglePopupService }, { token: i2.PivotLocalizationService }, { token: i3.ChipMenuService }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component });
|
69
|
-
ChipMenuComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: ChipMenuComponent, isStandalone: true, selector: "kendo-pivot-chip-menu", inputs: { chip: "chip", tabIndex: "tabIndex", isMeasureField: "isMeasureField" }, providers: [
|
70
|
+
ChipMenuComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: ChipMenuComponent, isStandalone: true, selector: "kendo-pivot-chip-menu", inputs: { chip: "chip", tabIndex: "tabIndex", isMeasureField: "isMeasureField", anchor: "anchor" }, providers: [
|
70
71
|
ChipMenuService,
|
71
72
|
MenuTabbingService
|
72
|
-
], viewQueries: [{ propertyName: "
|
73
|
-
<kendo-icon-wrapper
|
74
|
-
#anchor
|
75
|
-
name="more-vertical"
|
76
|
-
[svgIcon]="menuItemSVGIcon"
|
77
|
-
(click)="toggle($event, template)"
|
78
|
-
[tabindex]="tabIndex"
|
79
|
-
[attr.title]="chipMenuTitle"
|
80
|
-
>
|
81
|
-
</kendo-icon-wrapper>
|
73
|
+
], viewQueries: [{ propertyName: "template", first: true, predicate: ["template"], descendants: true, static: true }], ngImport: i0, template: `
|
82
74
|
<ng-template #template>
|
83
75
|
<kendo-pivot-chipmenu-container
|
84
76
|
(keydown.escape)="close()"
|
@@ -107,7 +99,7 @@ ChipMenuComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", vers
|
|
107
99
|
[service]="service"></kendo-pivot-chipmenu-reorder>
|
108
100
|
</kendo-pivot-chipmenu-container>
|
109
101
|
</ng-template>
|
110
|
-
`, isInline: true, dependencies: [{ kind: "component", type:
|
102
|
+
`, isInline: true, dependencies: [{ kind: "component", type: ChipMenuContainerComponent, selector: "kendo-pivot-chipmenu-container" }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: ChipMenuSortComponent, selector: "kendo-pivot-chipmenu-sort", inputs: ["chip"] }, { kind: "directive", type: ChipMenuItemDirective, selector: "[kendoPivotChipMenuItem]", inputs: ["kendoPivotChipMenuItem"] }, { kind: "component", type: ChipMenuFilterComponent, selector: "kendo-pivot-chipmenu-filter", inputs: ["chip", "expanded", "isLast"], outputs: ["expand", "collapse"] }, { kind: "component", type: ChipMenuReorderComponent, selector: "kendo-pivot-chipmenu-reorder", inputs: ["chip"] }] });
|
111
103
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: ChipMenuComponent, decorators: [{
|
112
104
|
type: Component,
|
113
105
|
args: [{
|
@@ -117,15 +109,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
|
|
117
109
|
],
|
118
110
|
selector: 'kendo-pivot-chip-menu',
|
119
111
|
template: `
|
120
|
-
<kendo-icon-wrapper
|
121
|
-
#anchor
|
122
|
-
name="more-vertical"
|
123
|
-
[svgIcon]="menuItemSVGIcon"
|
124
|
-
(click)="toggle($event, template)"
|
125
|
-
[tabindex]="tabIndex"
|
126
|
-
[attr.title]="chipMenuTitle"
|
127
|
-
>
|
128
|
-
</kendo-icon-wrapper>
|
129
112
|
<ng-template #template>
|
130
113
|
<kendo-pivot-chipmenu-container
|
131
114
|
(keydown.escape)="close()"
|
@@ -165,6 +148,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
|
|
165
148
|
}], isMeasureField: [{
|
166
149
|
type: Input
|
167
150
|
}], anchor: [{
|
151
|
+
type: Input
|
152
|
+
}], template: [{
|
168
153
|
type: ViewChild,
|
169
|
-
args: ['
|
154
|
+
args: ['template', { static: true }]
|
170
155
|
}] } });
|
@@ -4,7 +4,7 @@
|
|
4
4
|
*-------------------------------------------------------------------------------------------*/
|
5
5
|
import { ChangeDetectorRef, Component, EventEmitter, HostBinding, Input, NgZone, Output, ViewChild } from '@angular/core';
|
6
6
|
import { ConfiguratorNavigation } from '@progress/kendo-pivotgrid-common';
|
7
|
-
import { ExpandDirective, NodeTemplateDirective, TreeViewComponent } from '@progress/kendo-angular-treeview';
|
7
|
+
import { CheckDirective, ExpandDirective, NodeTemplateDirective, TreeViewComponent } from '@progress/kendo-angular-treeview';
|
8
8
|
import { PivotGridDataService } from '../data-binding/pivotgrid-data.service';
|
9
9
|
import { ConfiguratorService } from './configurator.service';
|
10
10
|
import { DropCueService } from './drop-cue.service';
|
@@ -20,7 +20,7 @@ import { DraggableChipDirective } from './draggable.directive';
|
|
20
20
|
import { DropTargetDirective } from './drop-target.directive';
|
21
21
|
import { NgClass, NgStyle, NgIf, NgTemplateOutlet, NgFor } from '@angular/common';
|
22
22
|
import { DraggableDirective } from '@progress/kendo-angular-common';
|
23
|
-
import {
|
23
|
+
import { CheckBoxComponent } from '@progress/kendo-angular-inputs';
|
24
24
|
import * as i0 from "@angular/core";
|
25
25
|
import * as i1 from "../data-binding/pivotgrid-data.service";
|
26
26
|
import * as i2 from "@progress/kendo-angular-l10n";
|
@@ -47,6 +47,9 @@ export class PivotGridConfiguratorComponent {
|
|
47
47
|
* A function which determines if a specific node has child nodes.
|
48
48
|
*/
|
49
49
|
this.hasChildren = (node) => !('hierarchyUniqueName' in node) && !('aggregator' in node);
|
50
|
+
this.checkItemBy = (context) => {
|
51
|
+
return context.dataItem;
|
52
|
+
};
|
50
53
|
/**
|
51
54
|
* A function which provides the child nodes for a given parent node.
|
52
55
|
*/
|
@@ -201,16 +204,6 @@ export class PivotGridConfiguratorComponent {
|
|
201
204
|
].some((h) => (h === f.uniqueName || h === f.defaultHierarchy)));
|
202
205
|
this.checked = checked;
|
203
206
|
}
|
204
|
-
/**
|
205
|
-
* A function which determines if a specific node is checked/
|
206
|
-
*/
|
207
|
-
isItemChecked(node) {
|
208
|
-
const res = this.checked.some(s => node.defaultHierarchy
|
209
|
-
? s.defaultHierarchy === node.defaultHierarchy
|
210
|
-
: s.uniqueName === node.uniqueName)
|
211
|
-
|| (node.children?.length && node.children?.every((c) => c.checked));
|
212
|
-
return res || null;
|
213
|
-
}
|
214
207
|
/**
|
215
208
|
* Determines if a checkbox should be rendered.
|
216
209
|
*/
|
@@ -231,21 +224,14 @@ export class PivotGridConfiguratorComponent {
|
|
231
224
|
const fields = event.children.map(item => item.dataItem);
|
232
225
|
this.setChecked(fields);
|
233
226
|
}
|
234
|
-
handleCheckedChange(event
|
235
|
-
|
236
|
-
|
237
|
-
}
|
238
|
-
else {
|
239
|
-
const itemIndex = this.checked.findIndex(checkedItem => checkedItem.uniqueName === item.uniqueName);
|
240
|
-
this.checked.splice(itemIndex, 1);
|
241
|
-
}
|
227
|
+
handleCheckedChange(event) {
|
228
|
+
const itemIndex = this.checked.findIndex(checkedItem => checkedItem.uniqueName === event.item.dataItem.uniqueName);
|
229
|
+
this.checked.splice(itemIndex, 1);
|
242
230
|
const action = {
|
243
231
|
type: 'PIVOT_CONFIGURATOR_ACTION_TOGGLE_SELECTION',
|
244
|
-
payload: item
|
232
|
+
payload: event.item.dataItem
|
245
233
|
};
|
246
234
|
this.configuratorService.parseConfiguratorState(action);
|
247
|
-
const closestItem = event.target.closest('.k-treeview-item');
|
248
|
-
this.zone.runOutsideAngular(() => setTimeout(() => closestItem.focus()));
|
249
235
|
}
|
250
236
|
onTreeViewSelect(ev) {
|
251
237
|
const closestItem = ev.target.closest('.k-treeview-item');
|
@@ -334,7 +320,7 @@ PivotGridConfiguratorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "
|
|
334
320
|
</div>
|
335
321
|
|
336
322
|
<div class="k-pivotgrid-configurator-content">
|
337
|
-
<div class="k-form" [class.k-form-horizontal]="isHorizontal" role="form">
|
323
|
+
<div class="k-form k-form-md" [class.k-form-horizontal]="isHorizontal" [class.k-form-vertical]="!isHorizontal" role="form">
|
338
324
|
<div class="k-form-field-wrapper" [ngStyle]="isHorizontal ? {'padding-left': 0 } : null">
|
339
325
|
<div class="k-form-field" [style]="'padding-top: 1em; margin-top: 0;'" [ngStyle]="isHorizontal ? {'padding-top': 0, 'padding-left': '16px' } : null">
|
340
326
|
<span [id]="contentLabelId('fields')" class="k-label">{{messageFor('configuratorFieldsText')}}</span>
|
@@ -349,21 +335,14 @@ PivotGridConfiguratorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "
|
|
349
335
|
textField="caption"
|
350
336
|
[children]="children"
|
351
337
|
[hasChildren]="hasChildren"
|
338
|
+
kendoTreeViewCheckable
|
339
|
+
[hasCheckbox]="isSelectable"
|
340
|
+
[(checkedKeys)]="checked"
|
341
|
+
[checkBy]="checkItemBy"
|
342
|
+
(checkedChange)="handleCheckedChange($event)"
|
352
343
|
kendoTreeViewExpandable
|
353
344
|
(childrenLoaded)="handleChildrenLoaded($event)"
|
354
345
|
(keydown.space)="onTreeViewSelect($event)">
|
355
|
-
<ng-template kendoTreeViewNodeTemplate let-dataItem>
|
356
|
-
<input kendoCheckBox
|
357
|
-
*ngIf="isSelectable(dataItem)"
|
358
|
-
type="checkbox"
|
359
|
-
kendoCheckBox
|
360
|
-
tabindex="-1"
|
361
|
-
role="none"
|
362
|
-
aria-hidden="true"
|
363
|
-
[checked]="isItemChecked(dataItem)"
|
364
|
-
(change)="handleCheckedChange($event, dataItem)"/>
|
365
|
-
{{ dataItem.caption }}
|
366
|
-
</ng-template>
|
367
346
|
</kendo-treeview>
|
368
347
|
|
369
348
|
</div>
|
@@ -383,6 +362,7 @@ PivotGridConfiguratorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "
|
|
383
362
|
*ngIf="state.columnAxes && state.columnAxes.length; else noColumnAxes"
|
384
363
|
#columnsChiplist
|
385
364
|
kendoDropTarget
|
365
|
+
class="k-column-fields"
|
386
366
|
axes="columnAxes"
|
387
367
|
[style.width.%]="100"
|
388
368
|
[attr.aria-labelledby]="headerTextId + ' ' + contentLabelId('columns')"
|
@@ -390,20 +370,25 @@ PivotGridConfiguratorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "
|
|
390
370
|
>
|
391
371
|
<ng-container *ngFor="let item of state.columnAxes">
|
392
372
|
<kendo-chip *ngIf="item.name.length === 1"
|
373
|
+
#chip
|
393
374
|
kendoChipDraggable
|
394
375
|
kendoDraggable
|
395
376
|
kendoDropTarget
|
396
377
|
kendoChipKeyboardNavigation
|
397
378
|
[item]="item"
|
379
|
+
[label]="getName(item.name)"
|
398
380
|
axes="columnAxes"
|
399
|
-
rounded="full"
|
400
381
|
[removable]="true"
|
382
|
+
[hasMenu]="true"
|
383
|
+
(menuToggle)="chipMenuColumns.toggle($event)"
|
401
384
|
(remove)="onChipRemove($event, item, 'column')"
|
402
385
|
(reorder)="onReorder($event, 'column', item)"
|
403
|
-
>
|
386
|
+
>
|
404
387
|
<kendo-pivot-chip-menu
|
405
|
-
|
406
|
-
|
388
|
+
#chipMenuColumns
|
389
|
+
[chip]="item"
|
390
|
+
[anchor]="chip"
|
391
|
+
></kendo-pivot-chip-menu>
|
407
392
|
</kendo-chip>
|
408
393
|
</ng-container>
|
409
394
|
</kendo-chiplist>
|
@@ -420,6 +405,7 @@ PivotGridConfiguratorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "
|
|
420
405
|
*ngIf="state.rowAxes && state.rowAxes.length; else noRowAxes"
|
421
406
|
#rowsChiplist
|
422
407
|
kendoDropTarget
|
408
|
+
class="k-row-fields"
|
423
409
|
axes="rowAxes"
|
424
410
|
[attr.aria-labelledby]="headerTextId + ' ' + contentLabelId('rows')"
|
425
411
|
[ngStyle]="isHorizontal ? {'padding-top': 0, 'padding-left': '16px' } : null"
|
@@ -427,22 +413,25 @@ PivotGridConfiguratorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "
|
|
427
413
|
>
|
428
414
|
<ng-container *ngFor="let item of state.rowAxes">
|
429
415
|
<kendo-chip *ngIf="item.name.length === 1"
|
416
|
+
#chip
|
430
417
|
kendoChipDraggable
|
431
418
|
kendoDraggable
|
432
419
|
kendoDropTarget
|
433
420
|
kendoChipKeyboardNavigation
|
434
421
|
[item]="item"
|
422
|
+
[label]="getName(item.name)"
|
435
423
|
axes="rowAxes"
|
436
|
-
rounded="full"
|
437
424
|
[removable]="true"
|
425
|
+
[hasMenu]="true"
|
426
|
+
(menuToggle)="chipMenuRows.toggle($event)"
|
438
427
|
(remove)="onChipRemove($event, item, 'row')"
|
439
428
|
(reorder)="onReorder($event, 'row', item)"
|
440
429
|
>
|
441
|
-
{{ getName(item.name) }}
|
442
|
-
|
443
430
|
<kendo-pivot-chip-menu
|
444
|
-
|
445
|
-
|
431
|
+
#chipMenuRows
|
432
|
+
[chip]="item"
|
433
|
+
[anchor]="chip"
|
434
|
+
></kendo-pivot-chip-menu>
|
446
435
|
</kendo-chip>
|
447
436
|
</ng-container>
|
448
437
|
</kendo-chiplist>
|
@@ -464,29 +453,32 @@ PivotGridConfiguratorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "
|
|
464
453
|
<kendo-chiplist
|
465
454
|
*ngIf="state.measureAxes && state.measureAxes.length; else noMeasureAxes"
|
466
455
|
kendoDropTarget
|
456
|
+
class="k-filter-fields"
|
467
457
|
axes="measureAxes"
|
468
458
|
[attr.aria-labelledby]="headerTextId + ' ' + contentLabelId('values')"
|
469
459
|
[ngStyle]="isHorizontal ? {'padding-top': 0, 'padding-left': '16px' } : null"
|
470
460
|
[style.width.%]="100"
|
471
461
|
>
|
472
462
|
<kendo-chip *ngFor="let item of state.measureAxes"
|
463
|
+
#chip
|
473
464
|
kendoChipDraggable
|
474
465
|
kendoDraggable
|
475
466
|
kendoDropTarget
|
476
467
|
kendoChipKeyboardNavigation
|
477
468
|
[item]="item"
|
469
|
+
[label]="getName(item.name)"
|
478
470
|
axes="measureAxes"
|
479
|
-
rounded="full"
|
480
471
|
[removable]="true"
|
472
|
+
[hasMenu]="true"
|
473
|
+
(menuToggle)="chipMenuValues.toggle($event)"
|
481
474
|
(remove)="onChipRemove($event, item, 'measure')"
|
482
475
|
(reorder)="onReorder($event, 'measure', item)"
|
483
476
|
>
|
484
|
-
|
485
|
-
|
486
|
-
|
487
|
-
|
488
|
-
|
489
|
-
</kendo-pivot-chip-menu>
|
477
|
+
<kendo-pivot-chip-menu
|
478
|
+
#chipMenuValues
|
479
|
+
[chip]="item"
|
480
|
+
[anchor]="chip"
|
481
|
+
></kendo-pivot-chip-menu>
|
490
482
|
</kendo-chip>
|
491
483
|
</kendo-chiplist>
|
492
484
|
|
@@ -497,12 +489,12 @@ PivotGridConfiguratorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "
|
|
497
489
|
|
498
490
|
</div>
|
499
491
|
</div>
|
500
|
-
<div class="k-pivotgrid-configurator-actions k-actions k-
|
492
|
+
<div class="k-pivotgrid-configurator-actions k-actions k-actions-end k-actions-horizontal">
|
501
493
|
<button kendoButton type="button" (click)="handleReset()">{{messageFor('configuratorCancelButtonText')}}</button>
|
502
494
|
<button kendoButton themeColor="primary" type="button" (click)="handleSubmit()">{{messageFor('configuratorApplyButtonText')}}</button>
|
503
495
|
</div>
|
504
496
|
</div>
|
505
|
-
`, isInline: true, dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: TreeViewComponent, selector: "kendo-treeview", inputs: ["filterInputPlaceholder", "expandDisabledNodes", "animate", "nodeTemplate", "loadMoreButtonTemplate", "trackBy", "nodes", "textField", "hasChildren", "isChecked", "isDisabled", "hasCheckbox", "isExpanded", "isSelected", "isVisible", "navigable", "children", "loadOnDemand", "filterable", "filter", "size", "disableParentNodesOnly"], outputs: ["childrenLoaded", "blur", "focus", "expand", "collapse", "nodeDragStart", "nodeDrag", "filterStateChange", "nodeDrop", "nodeDragEnd", "addItem", "removeItem", "checkedChange", "selectionChange", "filterChange", "nodeClick", "nodeDblClick"], exportAs: ["kendoTreeView"] }, { kind: "directive", type: ExpandDirective, selector: "[kendoTreeViewExpandable]", inputs: ["isExpanded", "expandBy", "expandOnFilter", "expandedKeys"], outputs: ["expandedKeysChange"] }, { kind: "directive", type:
|
497
|
+
`, isInline: true, dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: TreeViewComponent, selector: "kendo-treeview", inputs: ["filterInputPlaceholder", "expandDisabledNodes", "animate", "nodeTemplate", "loadMoreButtonTemplate", "trackBy", "nodes", "textField", "hasChildren", "isChecked", "isDisabled", "hasCheckbox", "isExpanded", "isSelected", "isVisible", "navigable", "children", "loadOnDemand", "filterable", "filter", "size", "disableParentNodesOnly"], outputs: ["childrenLoaded", "blur", "focus", "expand", "collapse", "nodeDragStart", "nodeDrag", "filterStateChange", "nodeDrop", "nodeDragEnd", "addItem", "removeItem", "checkedChange", "selectionChange", "filterChange", "nodeClick", "nodeDblClick"], exportAs: ["kendoTreeView"] }, { kind: "directive", type: ExpandDirective, selector: "[kendoTreeViewExpandable]", inputs: ["isExpanded", "expandBy", "expandOnFilter", "expandedKeys"], outputs: ["expandedKeysChange"] }, { kind: "directive", type: CheckDirective, selector: "[kendoTreeViewCheckable]", inputs: ["isChecked", "checkBy", "checkedKeys", "kendoTreeViewCheckable"], outputs: ["checkedKeysChange"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: DropTargetDirective, selector: "[kendoDropTarget]", inputs: ["item", "axes"] }, { kind: "component", type: ChipListComponent, selector: "kendo-chiplist, kendo-chip-list", inputs: ["selection", "size", "role", "navigable"], outputs: ["selectedChange", "remove"] }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: ChipComponent, selector: "kendo-chip", inputs: ["label", "icon", "svgIcon", "iconClass", "avatarClass", "selected", "removable", "removeIcon", "removeSvgIcon", "hasMenu", "menuIcon", "menuSvgIcon", "disabled", "size", "rounded", "fillMode", "themeColor"], outputs: ["remove", "menuToggle", "contentClick"] }, { kind: "directive", type: DraggableChipDirective, selector: "[kendoChipDraggable]", inputs: ["item"] }, { kind: "directive", type: DraggableDirective, selector: "[kendoDraggable]", inputs: ["enableDrag"], outputs: ["kendoPress", "kendoDrag", "kendoRelease"] }, { kind: "directive", type: ChipKeyboardNavigationDirective, selector: "[kendoChipKeyboardNavigation]", outputs: ["reorder"] }, { kind: "component", type: ChipMenuComponent, selector: "kendo-pivot-chip-menu", inputs: ["chip", "tabIndex", "isMeasureField", "anchor"] }, { kind: "component", type: ButtonComponent, selector: "button[kendoButton], span[kendoButton], kendo-button", inputs: ["arrowIcon", "toggleable", "togglable", "selected", "tabIndex", "imageUrl", "iconClass", "icon", "disabled", "size", "rounded", "fillMode", "themeColor", "svgIcon", "role", "primary", "look"], outputs: ["selectedChange", "click"], exportAs: ["kendoButton"] }] });
|
506
498
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: PivotGridConfiguratorComponent, decorators: [{
|
507
499
|
type: Component,
|
508
500
|
args: [{
|
@@ -527,7 +519,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
|
|
527
519
|
</div>
|
528
520
|
|
529
521
|
<div class="k-pivotgrid-configurator-content">
|
530
|
-
<div class="k-form" [class.k-form-horizontal]="isHorizontal" role="form">
|
522
|
+
<div class="k-form k-form-md" [class.k-form-horizontal]="isHorizontal" [class.k-form-vertical]="!isHorizontal" role="form">
|
531
523
|
<div class="k-form-field-wrapper" [ngStyle]="isHorizontal ? {'padding-left': 0 } : null">
|
532
524
|
<div class="k-form-field" [style]="'padding-top: 1em; margin-top: 0;'" [ngStyle]="isHorizontal ? {'padding-top': 0, 'padding-left': '16px' } : null">
|
533
525
|
<span [id]="contentLabelId('fields')" class="k-label">{{messageFor('configuratorFieldsText')}}</span>
|
@@ -542,21 +534,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
|
|
542
534
|
textField="caption"
|
543
535
|
[children]="children"
|
544
536
|
[hasChildren]="hasChildren"
|
537
|
+
kendoTreeViewCheckable
|
538
|
+
[hasCheckbox]="isSelectable"
|
539
|
+
[(checkedKeys)]="checked"
|
540
|
+
[checkBy]="checkItemBy"
|
541
|
+
(checkedChange)="handleCheckedChange($event)"
|
545
542
|
kendoTreeViewExpandable
|
546
543
|
(childrenLoaded)="handleChildrenLoaded($event)"
|
547
544
|
(keydown.space)="onTreeViewSelect($event)">
|
548
|
-
<ng-template kendoTreeViewNodeTemplate let-dataItem>
|
549
|
-
<input kendoCheckBox
|
550
|
-
*ngIf="isSelectable(dataItem)"
|
551
|
-
type="checkbox"
|
552
|
-
kendoCheckBox
|
553
|
-
tabindex="-1"
|
554
|
-
role="none"
|
555
|
-
aria-hidden="true"
|
556
|
-
[checked]="isItemChecked(dataItem)"
|
557
|
-
(change)="handleCheckedChange($event, dataItem)"/>
|
558
|
-
{{ dataItem.caption }}
|
559
|
-
</ng-template>
|
560
545
|
</kendo-treeview>
|
561
546
|
|
562
547
|
</div>
|
@@ -576,6 +561,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
|
|
576
561
|
*ngIf="state.columnAxes && state.columnAxes.length; else noColumnAxes"
|
577
562
|
#columnsChiplist
|
578
563
|
kendoDropTarget
|
564
|
+
class="k-column-fields"
|
579
565
|
axes="columnAxes"
|
580
566
|
[style.width.%]="100"
|
581
567
|
[attr.aria-labelledby]="headerTextId + ' ' + contentLabelId('columns')"
|
@@ -583,20 +569,25 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
|
|
583
569
|
>
|
584
570
|
<ng-container *ngFor="let item of state.columnAxes">
|
585
571
|
<kendo-chip *ngIf="item.name.length === 1"
|
572
|
+
#chip
|
586
573
|
kendoChipDraggable
|
587
574
|
kendoDraggable
|
588
575
|
kendoDropTarget
|
589
576
|
kendoChipKeyboardNavigation
|
590
577
|
[item]="item"
|
578
|
+
[label]="getName(item.name)"
|
591
579
|
axes="columnAxes"
|
592
|
-
rounded="full"
|
593
580
|
[removable]="true"
|
581
|
+
[hasMenu]="true"
|
582
|
+
(menuToggle)="chipMenuColumns.toggle($event)"
|
594
583
|
(remove)="onChipRemove($event, item, 'column')"
|
595
584
|
(reorder)="onReorder($event, 'column', item)"
|
596
|
-
>
|
585
|
+
>
|
597
586
|
<kendo-pivot-chip-menu
|
598
|
-
|
599
|
-
|
587
|
+
#chipMenuColumns
|
588
|
+
[chip]="item"
|
589
|
+
[anchor]="chip"
|
590
|
+
></kendo-pivot-chip-menu>
|
600
591
|
</kendo-chip>
|
601
592
|
</ng-container>
|
602
593
|
</kendo-chiplist>
|
@@ -613,6 +604,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
|
|
613
604
|
*ngIf="state.rowAxes && state.rowAxes.length; else noRowAxes"
|
614
605
|
#rowsChiplist
|
615
606
|
kendoDropTarget
|
607
|
+
class="k-row-fields"
|
616
608
|
axes="rowAxes"
|
617
609
|
[attr.aria-labelledby]="headerTextId + ' ' + contentLabelId('rows')"
|
618
610
|
[ngStyle]="isHorizontal ? {'padding-top': 0, 'padding-left': '16px' } : null"
|
@@ -620,22 +612,25 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
|
|
620
612
|
>
|
621
613
|
<ng-container *ngFor="let item of state.rowAxes">
|
622
614
|
<kendo-chip *ngIf="item.name.length === 1"
|
615
|
+
#chip
|
623
616
|
kendoChipDraggable
|
624
617
|
kendoDraggable
|
625
618
|
kendoDropTarget
|
626
619
|
kendoChipKeyboardNavigation
|
627
620
|
[item]="item"
|
621
|
+
[label]="getName(item.name)"
|
628
622
|
axes="rowAxes"
|
629
|
-
rounded="full"
|
630
623
|
[removable]="true"
|
624
|
+
[hasMenu]="true"
|
625
|
+
(menuToggle)="chipMenuRows.toggle($event)"
|
631
626
|
(remove)="onChipRemove($event, item, 'row')"
|
632
627
|
(reorder)="onReorder($event, 'row', item)"
|
633
628
|
>
|
634
|
-
{{ getName(item.name) }}
|
635
|
-
|
636
629
|
<kendo-pivot-chip-menu
|
637
|
-
|
638
|
-
|
630
|
+
#chipMenuRows
|
631
|
+
[chip]="item"
|
632
|
+
[anchor]="chip"
|
633
|
+
></kendo-pivot-chip-menu>
|
639
634
|
</kendo-chip>
|
640
635
|
</ng-container>
|
641
636
|
</kendo-chiplist>
|
@@ -657,29 +652,32 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
|
|
657
652
|
<kendo-chiplist
|
658
653
|
*ngIf="state.measureAxes && state.measureAxes.length; else noMeasureAxes"
|
659
654
|
kendoDropTarget
|
655
|
+
class="k-filter-fields"
|
660
656
|
axes="measureAxes"
|
661
657
|
[attr.aria-labelledby]="headerTextId + ' ' + contentLabelId('values')"
|
662
658
|
[ngStyle]="isHorizontal ? {'padding-top': 0, 'padding-left': '16px' } : null"
|
663
659
|
[style.width.%]="100"
|
664
660
|
>
|
665
661
|
<kendo-chip *ngFor="let item of state.measureAxes"
|
662
|
+
#chip
|
666
663
|
kendoChipDraggable
|
667
664
|
kendoDraggable
|
668
665
|
kendoDropTarget
|
669
666
|
kendoChipKeyboardNavigation
|
670
667
|
[item]="item"
|
668
|
+
[label]="getName(item.name)"
|
671
669
|
axes="measureAxes"
|
672
|
-
rounded="full"
|
673
670
|
[removable]="true"
|
671
|
+
[hasMenu]="true"
|
672
|
+
(menuToggle)="chipMenuValues.toggle($event)"
|
674
673
|
(remove)="onChipRemove($event, item, 'measure')"
|
675
674
|
(reorder)="onReorder($event, 'measure', item)"
|
676
675
|
>
|
677
|
-
|
678
|
-
|
679
|
-
|
680
|
-
|
681
|
-
|
682
|
-
</kendo-pivot-chip-menu>
|
676
|
+
<kendo-pivot-chip-menu
|
677
|
+
#chipMenuValues
|
678
|
+
[chip]="item"
|
679
|
+
[anchor]="chip"
|
680
|
+
></kendo-pivot-chip-menu>
|
683
681
|
</kendo-chip>
|
684
682
|
</kendo-chiplist>
|
685
683
|
|
@@ -690,7 +688,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
|
|
690
688
|
|
691
689
|
</div>
|
692
690
|
</div>
|
693
|
-
<div class="k-pivotgrid-configurator-actions k-actions k-
|
691
|
+
<div class="k-pivotgrid-configurator-actions k-actions k-actions-end k-actions-horizontal">
|
694
692
|
<button kendoButton type="button" (click)="handleReset()">{{messageFor('configuratorCancelButtonText')}}</button>
|
695
693
|
<button kendoButton themeColor="primary" type="button" (click)="handleSubmit()">{{messageFor('configuratorApplyButtonText')}}</button>
|
696
694
|
</div>
|
@@ -698,7 +696,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
|
|
698
696
|
`,
|
699
697
|
standalone: true,
|
700
698
|
imports: [
|
701
|
-
NgClass, NgStyle, TreeViewComponent, ExpandDirective, NodeTemplateDirective, NgIf,
|
699
|
+
NgClass, NgStyle, TreeViewComponent, ExpandDirective, CheckDirective, NodeTemplateDirective, NgIf, CheckBoxComponent,
|
702
700
|
NgTemplateOutlet, DropTargetDirective, ChipListComponent, NgFor, ChipComponent, DraggableChipDirective,
|
703
701
|
DraggableDirective, ChipKeyboardNavigationDirective, ChipMenuComponent, ButtonComponent
|
704
702
|
]
|
@@ -9,7 +9,7 @@ export const packageMetadata = {
|
|
9
9
|
name: '@progress/kendo-angular-pivotgrid',
|
10
10
|
productName: 'Kendo UI for Angular',
|
11
11
|
productCodes: ['KENDOUIANGULAR', 'KENDOUICOMPLETE'],
|
12
|
-
publishDate:
|
13
|
-
version: '17.0.0-develop.
|
12
|
+
publishDate: 1729053110,
|
13
|
+
version: '17.0.0-develop.7',
|
14
14
|
licensingDocsUrl: 'https://www.telerik.com/kendo-angular-ui/my-license/?utm_medium=product&utm_source=kendoangular&utm_campaign=kendo-ui-angular-purchase-license-keys-warning'
|
15
15
|
};
|
@@ -105,7 +105,7 @@ export class PivotGridComponent {
|
|
105
105
|
this.scrollService.pivotGrid = this;
|
106
106
|
}
|
107
107
|
get rightPositionClass() {
|
108
|
-
return this.configuratorSettings
|
108
|
+
return !this.configuratorSettings || this.configuratorSettings.position === 'right';
|
109
109
|
}
|
110
110
|
get leftPositionClass() {
|
111
111
|
return this.configuratorSettings?.position === 'left';
|
@@ -433,7 +433,7 @@ PivotGridComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", ver
|
|
433
433
|
class="k-pivotgrid-configurator-button"
|
434
434
|
aria-hidden="true"
|
435
435
|
(click)="toggleConfigurator()">
|
436
|
-
<span>{{messageFor('configuratorButtonText')}}<kendo-icon-wrapper name="gear"
|
436
|
+
<span>{{messageFor('configuratorButtonText')}}<kendo-icon-wrapper name="gear" [svgIcon]="gearSVGIcon"></kendo-icon-wrapper>
|
437
437
|
</span>
|
438
438
|
</div>
|
439
439
|
`, isInline: true, dependencies: [{ kind: "directive", type: LocalizedMessagesDirective, selector: "[kendoPivotGridLocalizedMessages]" }, { kind: "component", type: PivotGridTableComponent, selector: "kendo-pivotgrid-table", inputs: ["tableType", "colWidth", "customCellTemplate", "valueCellTemplate", "rowHeaderCellTemplate", "columnHeaderCellTemplate", "scrollableSettings"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: LoaderComponent, selector: "kendo-loader", inputs: ["type", "themeColor", "size"] }, { kind: "component", type: PivotGridConfiguratorComponent, selector: "kendo-pivotgrid-configurator", inputs: ["orientation", "sort", "filter", "navigation"], outputs: ["close"] }, { kind: "component", type: IconWrapperComponent, selector: "kendo-icon-wrapper", inputs: ["name", "svgIcon", "innerCssClass", "customFontClass", "size"], exportAs: ["kendoIconWrapper"] }] });
|
@@ -606,7 +606,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
|
|
606
606
|
class="k-pivotgrid-configurator-button"
|
607
607
|
aria-hidden="true"
|
608
608
|
(click)="toggleConfigurator()">
|
609
|
-
<span>{{messageFor('configuratorButtonText')}}<kendo-icon-wrapper name="gear"
|
609
|
+
<span>{{messageFor('configuratorButtonText')}}<kendo-icon-wrapper name="gear" [svgIcon]="gearSVGIcon"></kendo-icon-wrapper>
|
610
610
|
</span>
|
611
611
|
</div>
|
612
612
|
`,
|