@progress/kendo-angular-pivotgrid 17.0.0-develop.2 → 17.0.0-develop.21
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/README.md +37 -15
- package/configurator/chip-menu/chip-menu.component.d.ts +6 -4
- package/configurator/configurator.component.d.ts +2 -5
- package/configurator/draggable.directive.d.ts +3 -4
- package/esm2020/configurator/chip-menu/chip-menu.component.mjs +16 -31
- package/esm2020/configurator/chip-menu/filtering/filter-menu-container.component.mjs +1 -1
- package/esm2020/configurator/configurator.component.mjs +89 -85
- package/esm2020/configurator/draggable.directive.mjs +4 -5
- 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 +119 -133
- package/fesm2020/progress-kendo-angular-pivotgrid.mjs +119 -131
- package/package.json +12 -12
- package/schematics/ngAdd/index.js +2 -2
|
@@ -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>
|
|
@@ -381,8 +360,10 @@ PivotGridConfiguratorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "
|
|
|
381
360
|
|
|
382
361
|
<kendo-chiplist
|
|
383
362
|
*ngIf="state.columnAxes && state.columnAxes.length; else noColumnAxes"
|
|
363
|
+
[navigable]="false"
|
|
384
364
|
#columnsChiplist
|
|
385
365
|
kendoDropTarget
|
|
366
|
+
class="k-column-fields"
|
|
386
367
|
axes="columnAxes"
|
|
387
368
|
[style.width.%]="100"
|
|
388
369
|
[attr.aria-labelledby]="headerTextId + ' ' + contentLabelId('columns')"
|
|
@@ -390,20 +371,25 @@ PivotGridConfiguratorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "
|
|
|
390
371
|
>
|
|
391
372
|
<ng-container *ngFor="let item of state.columnAxes">
|
|
392
373
|
<kendo-chip *ngIf="item.name.length === 1"
|
|
374
|
+
#chip
|
|
393
375
|
kendoChipDraggable
|
|
394
376
|
kendoDraggable
|
|
395
377
|
kendoDropTarget
|
|
396
378
|
kendoChipKeyboardNavigation
|
|
397
379
|
[item]="item"
|
|
380
|
+
[label]="getName(item.name)"
|
|
398
381
|
axes="columnAxes"
|
|
399
|
-
rounded="full"
|
|
400
382
|
[removable]="true"
|
|
383
|
+
[hasMenu]="true"
|
|
384
|
+
(menuToggle)="chipMenuColumns.toggle($event)"
|
|
401
385
|
(remove)="onChipRemove($event, item, 'column')"
|
|
402
386
|
(reorder)="onReorder($event, 'column', item)"
|
|
403
|
-
>
|
|
387
|
+
>
|
|
404
388
|
<kendo-pivot-chip-menu
|
|
405
|
-
|
|
406
|
-
|
|
389
|
+
#chipMenuColumns
|
|
390
|
+
[chip]="item"
|
|
391
|
+
[anchor]="chip"
|
|
392
|
+
></kendo-pivot-chip-menu>
|
|
407
393
|
</kendo-chip>
|
|
408
394
|
</ng-container>
|
|
409
395
|
</kendo-chiplist>
|
|
@@ -418,8 +404,10 @@ PivotGridConfiguratorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "
|
|
|
418
404
|
|
|
419
405
|
<kendo-chiplist
|
|
420
406
|
*ngIf="state.rowAxes && state.rowAxes.length; else noRowAxes"
|
|
407
|
+
[navigable]="false"
|
|
421
408
|
#rowsChiplist
|
|
422
409
|
kendoDropTarget
|
|
410
|
+
class="k-row-fields"
|
|
423
411
|
axes="rowAxes"
|
|
424
412
|
[attr.aria-labelledby]="headerTextId + ' ' + contentLabelId('rows')"
|
|
425
413
|
[ngStyle]="isHorizontal ? {'padding-top': 0, 'padding-left': '16px' } : null"
|
|
@@ -427,22 +415,25 @@ PivotGridConfiguratorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "
|
|
|
427
415
|
>
|
|
428
416
|
<ng-container *ngFor="let item of state.rowAxes">
|
|
429
417
|
<kendo-chip *ngIf="item.name.length === 1"
|
|
418
|
+
#chip
|
|
430
419
|
kendoChipDraggable
|
|
431
420
|
kendoDraggable
|
|
432
421
|
kendoDropTarget
|
|
433
422
|
kendoChipKeyboardNavigation
|
|
434
423
|
[item]="item"
|
|
424
|
+
[label]="getName(item.name)"
|
|
435
425
|
axes="rowAxes"
|
|
436
|
-
rounded="full"
|
|
437
426
|
[removable]="true"
|
|
427
|
+
[hasMenu]="true"
|
|
428
|
+
(menuToggle)="chipMenuRows.toggle($event)"
|
|
438
429
|
(remove)="onChipRemove($event, item, 'row')"
|
|
439
430
|
(reorder)="onReorder($event, 'row', item)"
|
|
440
431
|
>
|
|
441
|
-
{{ getName(item.name) }}
|
|
442
|
-
|
|
443
432
|
<kendo-pivot-chip-menu
|
|
444
|
-
|
|
445
|
-
|
|
433
|
+
#chipMenuRows
|
|
434
|
+
[chip]="item"
|
|
435
|
+
[anchor]="chip"
|
|
436
|
+
></kendo-pivot-chip-menu>
|
|
446
437
|
</kendo-chip>
|
|
447
438
|
</ng-container>
|
|
448
439
|
</kendo-chiplist>
|
|
@@ -463,30 +454,34 @@ PivotGridConfiguratorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "
|
|
|
463
454
|
|
|
464
455
|
<kendo-chiplist
|
|
465
456
|
*ngIf="state.measureAxes && state.measureAxes.length; else noMeasureAxes"
|
|
457
|
+
[navigable]="false"
|
|
466
458
|
kendoDropTarget
|
|
459
|
+
class="k-filter-fields"
|
|
467
460
|
axes="measureAxes"
|
|
468
461
|
[attr.aria-labelledby]="headerTextId + ' ' + contentLabelId('values')"
|
|
469
462
|
[ngStyle]="isHorizontal ? {'padding-top': 0, 'padding-left': '16px' } : null"
|
|
470
463
|
[style.width.%]="100"
|
|
471
464
|
>
|
|
472
465
|
<kendo-chip *ngFor="let item of state.measureAxes"
|
|
466
|
+
#chip
|
|
473
467
|
kendoChipDraggable
|
|
474
468
|
kendoDraggable
|
|
475
469
|
kendoDropTarget
|
|
476
470
|
kendoChipKeyboardNavigation
|
|
477
471
|
[item]="item"
|
|
472
|
+
[label]="getName(item.name)"
|
|
478
473
|
axes="measureAxes"
|
|
479
|
-
rounded="full"
|
|
480
474
|
[removable]="true"
|
|
475
|
+
[hasMenu]="true"
|
|
476
|
+
(menuToggle)="chipMenuValues.toggle($event)"
|
|
481
477
|
(remove)="onChipRemove($event, item, 'measure')"
|
|
482
478
|
(reorder)="onReorder($event, 'measure', item)"
|
|
483
479
|
>
|
|
484
|
-
|
|
485
|
-
|
|
486
|
-
|
|
487
|
-
|
|
488
|
-
|
|
489
|
-
</kendo-pivot-chip-menu>
|
|
480
|
+
<kendo-pivot-chip-menu
|
|
481
|
+
#chipMenuValues
|
|
482
|
+
[chip]="item"
|
|
483
|
+
[anchor]="chip"
|
|
484
|
+
></kendo-pivot-chip-menu>
|
|
490
485
|
</kendo-chip>
|
|
491
486
|
</kendo-chiplist>
|
|
492
487
|
|
|
@@ -497,12 +492,12 @@ PivotGridConfiguratorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "
|
|
|
497
492
|
|
|
498
493
|
</div>
|
|
499
494
|
</div>
|
|
500
|
-
<div class="k-pivotgrid-configurator-actions k-actions k-
|
|
495
|
+
<div class="k-pivotgrid-configurator-actions k-actions k-actions-end k-actions-horizontal">
|
|
501
496
|
<button kendoButton type="button" (click)="handleReset()">{{messageFor('configuratorCancelButtonText')}}</button>
|
|
502
497
|
<button kendoButton themeColor="primary" type="button" (click)="handleSubmit()">{{messageFor('configuratorApplyButtonText')}}</button>
|
|
503
498
|
</div>
|
|
504
499
|
</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:
|
|
500
|
+
`, 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", "avatarSettings", "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]", inputs: ["arrowIcon", "toggleable", "togglable", "selected", "tabIndex", "imageUrl", "iconClass", "icon", "disabled", "size", "rounded", "fillMode", "themeColor", "svgIcon", "primary", "look"], outputs: ["selectedChange", "click"], exportAs: ["kendoButton"] }] });
|
|
506
501
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: PivotGridConfiguratorComponent, decorators: [{
|
|
507
502
|
type: Component,
|
|
508
503
|
args: [{
|
|
@@ -527,7 +522,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
|
|
|
527
522
|
</div>
|
|
528
523
|
|
|
529
524
|
<div class="k-pivotgrid-configurator-content">
|
|
530
|
-
<div class="k-form" [class.k-form-horizontal]="isHorizontal" role="form">
|
|
525
|
+
<div class="k-form k-form-md" [class.k-form-horizontal]="isHorizontal" [class.k-form-vertical]="!isHorizontal" role="form">
|
|
531
526
|
<div class="k-form-field-wrapper" [ngStyle]="isHorizontal ? {'padding-left': 0 } : null">
|
|
532
527
|
<div class="k-form-field" [style]="'padding-top: 1em; margin-top: 0;'" [ngStyle]="isHorizontal ? {'padding-top': 0, 'padding-left': '16px' } : null">
|
|
533
528
|
<span [id]="contentLabelId('fields')" class="k-label">{{messageFor('configuratorFieldsText')}}</span>
|
|
@@ -542,21 +537,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
|
|
|
542
537
|
textField="caption"
|
|
543
538
|
[children]="children"
|
|
544
539
|
[hasChildren]="hasChildren"
|
|
540
|
+
kendoTreeViewCheckable
|
|
541
|
+
[hasCheckbox]="isSelectable"
|
|
542
|
+
[(checkedKeys)]="checked"
|
|
543
|
+
[checkBy]="checkItemBy"
|
|
544
|
+
(checkedChange)="handleCheckedChange($event)"
|
|
545
545
|
kendoTreeViewExpandable
|
|
546
546
|
(childrenLoaded)="handleChildrenLoaded($event)"
|
|
547
547
|
(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
548
|
</kendo-treeview>
|
|
561
549
|
|
|
562
550
|
</div>
|
|
@@ -574,8 +562,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
|
|
|
574
562
|
|
|
575
563
|
<kendo-chiplist
|
|
576
564
|
*ngIf="state.columnAxes && state.columnAxes.length; else noColumnAxes"
|
|
565
|
+
[navigable]="false"
|
|
577
566
|
#columnsChiplist
|
|
578
567
|
kendoDropTarget
|
|
568
|
+
class="k-column-fields"
|
|
579
569
|
axes="columnAxes"
|
|
580
570
|
[style.width.%]="100"
|
|
581
571
|
[attr.aria-labelledby]="headerTextId + ' ' + contentLabelId('columns')"
|
|
@@ -583,20 +573,25 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
|
|
|
583
573
|
>
|
|
584
574
|
<ng-container *ngFor="let item of state.columnAxes">
|
|
585
575
|
<kendo-chip *ngIf="item.name.length === 1"
|
|
576
|
+
#chip
|
|
586
577
|
kendoChipDraggable
|
|
587
578
|
kendoDraggable
|
|
588
579
|
kendoDropTarget
|
|
589
580
|
kendoChipKeyboardNavigation
|
|
590
581
|
[item]="item"
|
|
582
|
+
[label]="getName(item.name)"
|
|
591
583
|
axes="columnAxes"
|
|
592
|
-
rounded="full"
|
|
593
584
|
[removable]="true"
|
|
585
|
+
[hasMenu]="true"
|
|
586
|
+
(menuToggle)="chipMenuColumns.toggle($event)"
|
|
594
587
|
(remove)="onChipRemove($event, item, 'column')"
|
|
595
588
|
(reorder)="onReorder($event, 'column', item)"
|
|
596
|
-
>
|
|
589
|
+
>
|
|
597
590
|
<kendo-pivot-chip-menu
|
|
598
|
-
|
|
599
|
-
|
|
591
|
+
#chipMenuColumns
|
|
592
|
+
[chip]="item"
|
|
593
|
+
[anchor]="chip"
|
|
594
|
+
></kendo-pivot-chip-menu>
|
|
600
595
|
</kendo-chip>
|
|
601
596
|
</ng-container>
|
|
602
597
|
</kendo-chiplist>
|
|
@@ -611,8 +606,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
|
|
|
611
606
|
|
|
612
607
|
<kendo-chiplist
|
|
613
608
|
*ngIf="state.rowAxes && state.rowAxes.length; else noRowAxes"
|
|
609
|
+
[navigable]="false"
|
|
614
610
|
#rowsChiplist
|
|
615
611
|
kendoDropTarget
|
|
612
|
+
class="k-row-fields"
|
|
616
613
|
axes="rowAxes"
|
|
617
614
|
[attr.aria-labelledby]="headerTextId + ' ' + contentLabelId('rows')"
|
|
618
615
|
[ngStyle]="isHorizontal ? {'padding-top': 0, 'padding-left': '16px' } : null"
|
|
@@ -620,22 +617,25 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
|
|
|
620
617
|
>
|
|
621
618
|
<ng-container *ngFor="let item of state.rowAxes">
|
|
622
619
|
<kendo-chip *ngIf="item.name.length === 1"
|
|
620
|
+
#chip
|
|
623
621
|
kendoChipDraggable
|
|
624
622
|
kendoDraggable
|
|
625
623
|
kendoDropTarget
|
|
626
624
|
kendoChipKeyboardNavigation
|
|
627
625
|
[item]="item"
|
|
626
|
+
[label]="getName(item.name)"
|
|
628
627
|
axes="rowAxes"
|
|
629
|
-
rounded="full"
|
|
630
628
|
[removable]="true"
|
|
629
|
+
[hasMenu]="true"
|
|
630
|
+
(menuToggle)="chipMenuRows.toggle($event)"
|
|
631
631
|
(remove)="onChipRemove($event, item, 'row')"
|
|
632
632
|
(reorder)="onReorder($event, 'row', item)"
|
|
633
633
|
>
|
|
634
|
-
{{ getName(item.name) }}
|
|
635
|
-
|
|
636
634
|
<kendo-pivot-chip-menu
|
|
637
|
-
|
|
638
|
-
|
|
635
|
+
#chipMenuRows
|
|
636
|
+
[chip]="item"
|
|
637
|
+
[anchor]="chip"
|
|
638
|
+
></kendo-pivot-chip-menu>
|
|
639
639
|
</kendo-chip>
|
|
640
640
|
</ng-container>
|
|
641
641
|
</kendo-chiplist>
|
|
@@ -656,30 +656,34 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
|
|
|
656
656
|
|
|
657
657
|
<kendo-chiplist
|
|
658
658
|
*ngIf="state.measureAxes && state.measureAxes.length; else noMeasureAxes"
|
|
659
|
+
[navigable]="false"
|
|
659
660
|
kendoDropTarget
|
|
661
|
+
class="k-filter-fields"
|
|
660
662
|
axes="measureAxes"
|
|
661
663
|
[attr.aria-labelledby]="headerTextId + ' ' + contentLabelId('values')"
|
|
662
664
|
[ngStyle]="isHorizontal ? {'padding-top': 0, 'padding-left': '16px' } : null"
|
|
663
665
|
[style.width.%]="100"
|
|
664
666
|
>
|
|
665
667
|
<kendo-chip *ngFor="let item of state.measureAxes"
|
|
668
|
+
#chip
|
|
666
669
|
kendoChipDraggable
|
|
667
670
|
kendoDraggable
|
|
668
671
|
kendoDropTarget
|
|
669
672
|
kendoChipKeyboardNavigation
|
|
670
673
|
[item]="item"
|
|
674
|
+
[label]="getName(item.name)"
|
|
671
675
|
axes="measureAxes"
|
|
672
|
-
rounded="full"
|
|
673
676
|
[removable]="true"
|
|
677
|
+
[hasMenu]="true"
|
|
678
|
+
(menuToggle)="chipMenuValues.toggle($event)"
|
|
674
679
|
(remove)="onChipRemove($event, item, 'measure')"
|
|
675
680
|
(reorder)="onReorder($event, 'measure', item)"
|
|
676
681
|
>
|
|
677
|
-
|
|
678
|
-
|
|
679
|
-
|
|
680
|
-
|
|
681
|
-
|
|
682
|
-
</kendo-pivot-chip-menu>
|
|
682
|
+
<kendo-pivot-chip-menu
|
|
683
|
+
#chipMenuValues
|
|
684
|
+
[chip]="item"
|
|
685
|
+
[anchor]="chip"
|
|
686
|
+
></kendo-pivot-chip-menu>
|
|
683
687
|
</kendo-chip>
|
|
684
688
|
</kendo-chiplist>
|
|
685
689
|
|
|
@@ -690,7 +694,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
|
|
|
690
694
|
|
|
691
695
|
</div>
|
|
692
696
|
</div>
|
|
693
|
-
<div class="k-pivotgrid-configurator-actions k-actions k-
|
|
697
|
+
<div class="k-pivotgrid-configurator-actions k-actions k-actions-end k-actions-horizontal">
|
|
694
698
|
<button kendoButton type="button" (click)="handleReset()">{{messageFor('configuratorCancelButtonText')}}</button>
|
|
695
699
|
<button kendoButton themeColor="primary" type="button" (click)="handleSubmit()">{{messageFor('configuratorApplyButtonText')}}</button>
|
|
696
700
|
</div>
|
|
@@ -698,7 +702,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
|
|
|
698
702
|
`,
|
|
699
703
|
standalone: true,
|
|
700
704
|
imports: [
|
|
701
|
-
NgClass, NgStyle, TreeViewComponent, ExpandDirective, NodeTemplateDirective, NgIf,
|
|
705
|
+
NgClass, NgStyle, TreeViewComponent, ExpandDirective, CheckDirective, NodeTemplateDirective, NgIf, CheckBoxComponent,
|
|
702
706
|
NgTemplateOutlet, DropTargetDirective, ChipListComponent, NgFor, ChipComponent, DraggableChipDirective,
|
|
703
707
|
DraggableDirective, ChipKeyboardNavigationDirective, ChipMenuComponent, ButtonComponent
|
|
704
708
|
]
|
|
@@ -2,7 +2,7 @@
|
|
|
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 { Directive, Input, ElementRef, NgZone, Optional, HostBinding, Renderer2
|
|
5
|
+
import { Directive, Input, ElementRef, NgZone, Optional, HostBinding, Renderer2 } from '@angular/core';
|
|
6
6
|
import { DraggableDirective, isDocumentAvailable } from '@progress/kendo-angular-common';
|
|
7
7
|
import { PIVOT_CONFIGURATOR_ACTION } from '@progress/kendo-pivotgrid-common';
|
|
8
8
|
import { ConfiguratorService } from './configurator.service';
|
|
@@ -17,14 +17,13 @@ import * as i3 from "./drop-cue.service";
|
|
|
17
17
|
* @hidden
|
|
18
18
|
*/
|
|
19
19
|
export class DraggableChipDirective {
|
|
20
|
-
constructor(draggable, element, zone, service, cue, renderer
|
|
20
|
+
constructor(draggable, element, zone, service, cue, renderer) {
|
|
21
21
|
this.draggable = draggable;
|
|
22
22
|
this.element = element;
|
|
23
23
|
this.zone = zone;
|
|
24
24
|
this.service = service;
|
|
25
25
|
this.cue = cue;
|
|
26
26
|
this.renderer = renderer;
|
|
27
|
-
this.cdr = cdr;
|
|
28
27
|
this.touchActions = 'none';
|
|
29
28
|
this.initialX = {};
|
|
30
29
|
this.initialY = {};
|
|
@@ -103,7 +102,7 @@ export class DraggableChipDirective {
|
|
|
103
102
|
this.subs.unsubscribe();
|
|
104
103
|
}
|
|
105
104
|
}
|
|
106
|
-
DraggableChipDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: DraggableChipDirective, deps: [{ token: i1.DraggableDirective, optional: true }, { token: i0.ElementRef }, { token: i0.NgZone }, { token: i2.ConfiguratorService }, { token: i3.DropCueService }, { token: i0.Renderer2 }
|
|
105
|
+
DraggableChipDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: DraggableChipDirective, deps: [{ token: i1.DraggableDirective, optional: true }, { token: i0.ElementRef }, { token: i0.NgZone }, { token: i2.ConfiguratorService }, { token: i3.DropCueService }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Directive });
|
|
107
106
|
DraggableChipDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.10", type: DraggableChipDirective, isStandalone: true, selector: "[kendoChipDraggable]", inputs: { item: "item" }, host: { properties: { "style.pointerEvents": "this.pointerEvents", "style.touch-action": "this.touchActions" } }, ngImport: i0 });
|
|
108
107
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: DraggableChipDirective, decorators: [{
|
|
109
108
|
type: Directive,
|
|
@@ -113,7 +112,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
|
|
|
113
112
|
}]
|
|
114
113
|
}], ctorParameters: function () { return [{ type: i1.DraggableDirective, decorators: [{
|
|
115
114
|
type: Optional
|
|
116
|
-
}] }, { type: i0.ElementRef }, { type: i0.NgZone }, { type: i2.ConfiguratorService }, { type: i3.DropCueService }, { type: i0.Renderer2 }
|
|
115
|
+
}] }, { type: i0.ElementRef }, { type: i0.NgZone }, { type: i2.ConfiguratorService }, { type: i3.DropCueService }, { type: i0.Renderer2 }]; }, propDecorators: { pointerEvents: [{
|
|
117
116
|
type: HostBinding,
|
|
118
117
|
args: ['style.pointerEvents']
|
|
119
118
|
}], touchActions: [{
|
|
@@ -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: 1729874461,
|
|
13
|
+
version: '17.0.0-develop.21',
|
|
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
|
`,
|
|
@@ -9,7 +9,7 @@ import { CellTemplateDirective } from './templates/pivotgrid-cell-template.direc
|
|
|
9
9
|
import { ValueCellTemplateDirective } from './templates/pivotgrid-value-cell-template.directive';
|
|
10
10
|
import { RowHeaderCellTemplateDirective } from './templates/pivotgrid-row-header-cell-template.directive';
|
|
11
11
|
import { ColumnHeaderCellTemplateDirective } from './templates/pivotgrid-column-header-cell-template.directive';
|
|
12
|
-
import { NgIf } from '@angular/common';
|
|
12
|
+
import { NgClass, NgIf } from '@angular/common';
|
|
13
13
|
import { IconWrapperComponent } from '@progress/kendo-angular-icons';
|
|
14
14
|
import { EventsOutsideAngularDirective, TemplateContextDirective } from '@progress/kendo-angular-common';
|
|
15
15
|
import * as i0 from "@angular/core";
|
|
@@ -46,9 +46,10 @@ export class PivotGridCellDirective {
|
|
|
46
46
|
this.renderer.setAttribute(nativeElement, 'rowspan', this.kendoPivotGridCell.rowSpan || 1);
|
|
47
47
|
this.renderer.setAttribute(nativeElement, 'colspan', this.kendoPivotGridCell.colSpan || 1);
|
|
48
48
|
const classesToAdd = {
|
|
49
|
-
'k-pivotgrid-header-total': this.kendoPivotGridCell?.total
|
|
49
|
+
'k-pivotgrid-header-total': this.kendoPivotGridCell?.total,
|
|
50
|
+
'k-pivotgrid-total': this.tableType === 'values'
|
|
50
51
|
&& (this.dataService.rowHeaderLeaves[this.rowIndex].total ||
|
|
51
|
-
this.dataService.columnHeaderLeaves[this.colIndex].total)
|
|
52
|
+
this.dataService.columnHeaderLeaves[this.colIndex].total),
|
|
52
53
|
'k-pivotgrid-header-root': this.kendoPivotGridCell?.levelNum === 0,
|
|
53
54
|
'k-pivotgrid-expanded': this.kendoPivotGridCell?.hasChildren && this.kendoPivotGridCell.children.length,
|
|
54
55
|
'k-first': this.colIndex > 0
|
|
@@ -118,10 +119,10 @@ PivotGridCellDirective.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0",
|
|
|
118
119
|
}">
|
|
119
120
|
</ng-template>
|
|
120
121
|
<!--default cell content-->
|
|
121
|
-
<span *ngIf="!customCellTemplate && isNotProvidedCellTemplatePerType">
|
|
122
|
+
<span *ngIf="!customCellTemplate && isNotProvidedCellTemplatePerType" [ngClass]="{'k-pivotgrid-header-title': !kendoPivotGridCell.data, 'k-pivotgrid-content': kendoPivotGridCell.data}">
|
|
122
123
|
{{ kendoPivotGridCell.data ? kendoPivotGridCell.data.fmtValue : kendoPivotGridCell.caption }}
|
|
123
124
|
</span>
|
|
124
|
-
`, isInline: true, dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: IconWrapperComponent, selector: "kendo-icon-wrapper", inputs: ["name", "svgIcon", "innerCssClass", "customFontClass", "size"], exportAs: ["kendoIconWrapper"] }, { kind: "directive", type: EventsOutsideAngularDirective, selector: "[kendoEventsOutsideAngular]", inputs: ["kendoEventsOutsideAngular", "scope"] }, { kind: "directive", type: TemplateContextDirective, selector: "[templateContext]", inputs: ["templateContext"] }] });
|
|
125
|
+
`, isInline: true, dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: IconWrapperComponent, selector: "kendo-icon-wrapper", inputs: ["name", "svgIcon", "innerCssClass", "customFontClass", "size"], exportAs: ["kendoIconWrapper"] }, { kind: "directive", type: EventsOutsideAngularDirective, selector: "[kendoEventsOutsideAngular]", inputs: ["kendoEventsOutsideAngular", "scope"] }, { kind: "directive", type: TemplateContextDirective, selector: "[templateContext]", inputs: ["templateContext"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
|
|
125
126
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: PivotGridCellDirective, decorators: [{
|
|
126
127
|
type: Component,
|
|
127
128
|
args: [{
|
|
@@ -184,12 +185,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
|
|
|
184
185
|
}">
|
|
185
186
|
</ng-template>
|
|
186
187
|
<!--default cell content-->
|
|
187
|
-
<span *ngIf="!customCellTemplate && isNotProvidedCellTemplatePerType">
|
|
188
|
+
<span *ngIf="!customCellTemplate && isNotProvidedCellTemplatePerType" [ngClass]="{'k-pivotgrid-header-title': !kendoPivotGridCell.data, 'k-pivotgrid-content': kendoPivotGridCell.data}">
|
|
188
189
|
{{ kendoPivotGridCell.data ? kendoPivotGridCell.data.fmtValue : kendoPivotGridCell.caption }}
|
|
189
190
|
</span>
|
|
190
191
|
`,
|
|
191
192
|
standalone: true,
|
|
192
|
-
imports: [NgIf, IconWrapperComponent, EventsOutsideAngularDirective, TemplateContextDirective]
|
|
193
|
+
imports: [NgIf, IconWrapperComponent, EventsOutsideAngularDirective, TemplateContextDirective, NgClass]
|
|
193
194
|
}]
|
|
194
195
|
}], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.Renderer2 }, { type: i1.PivotGridDataService }]; }, propDecorators: { cellClass: [{
|
|
195
196
|
type: HostBinding,
|