@progress/kendo-angular-pivotgrid 0.2.0-dev.202209020712 → 0.2.0-dev.202209020832

package/esm2015/configurator/chip-menu/chip-menu-filter.component.js

@@ -0,0 +1,112 @@
+/**-----------------------------------------------------------------------------------------
+* Copyright © 2021 Progress Software Corporation. All rights reserved.
+* Licensed under commercial license. See LICENSE.md in the project root for more information
+*-------------------------------------------------------------------------------------------*/
+import { Component, Input, Output, EventEmitter } from '@angular/core';
+import { ChipMenuItemBase } from './chip-menu-item-base';
+import * as i0 from "@angular/core";
+import * as i1 from "../../localization/pivot-localization.service";
+import * as i2 from "./chip-menu-item.component";
+import * as i3 from "./filtering/filter-menu-container.component";
+import * as i4 from "./chip-menu-item-content-template.directive";
+/**
+ * @hidden
+ * Represents the component for setting field filters in the PivotGrid.
+ */
+export class ChipMenuFilterComponent extends ChipMenuItemBase {
+    constructor(localization, hostElement) {
+        super();
+        this.localization = localization;
+        this.hostElement = hostElement;
+        /**
+         * Fires when the content is expanded.
+         */
+        this.expand = new EventEmitter();
+        /**
+         * Fires when the content is collapsed.
+         */
+        this.collapse = new EventEmitter();
+        /**
+         * Specifies if the content is expanded.
+         */
+        this.expanded = false;
+        this.isLast = false;
+        this.actionsClass = 'k-columnmenu-actions';
+    }
+    onCollapse() {
+        this.expanded = false;
+        if (this.isLast) {
+            this.service.menuTabbingService.lastFocusable = this.hostElement.nativeElement.querySelector('.k-columnmenu-item');
+        }
+        this.collapse.emit();
+    }
+    onExpand() {
+        this.expanded = true;
+        this.expand.emit();
+    }
+    /**
+     * Returns the localized message for a given token
+     */
+    messageFor(localizationToken) {
+        return this.localization.get(localizationToken);
+    }
+}
+ChipMenuFilterComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: ChipMenuFilterComponent, deps: [{ token: i1.PivotLocalizationService }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
+ChipMenuFilterComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: ChipMenuFilterComponent, selector: "kendo-pivot-chipmenu-filter", inputs: { chip: "chip", expanded: "expanded", isLast: "isLast" }, outputs: { expand: "expand", collapse: "collapse" }, usesInheritance: true, ngImport: i0, template: `
+        <kendo-pivot-chipmenu-item
+            classs="k-widget k-expander"
+            [text]="messageFor('fieldMenuFilterItemLabel')"
+            icon="filter"
+            [expanded]="expanded"
+            (collapse)="onCollapse()"
+            (expand)="onExpand()">
+            <ng-template kendoPivotChipMenuItemContentTemplate>
+                <kendo-pivot-filter-menu-container
+                    [chip]="chip"
+                    [menuTabbingService]="service.menuTabbingService"
+                    [actionsClass]="actionsClass"
+                    [isLast]="isLast"
+                    [isExpanded]="expanded"
+                    (keydown.shift.tab)="$event.stopImmediatePropagation()"
+                    (close)="close()">
+                </kendo-pivot-filter-menu-container>
+            </ng-template>
+        </kendo-pivot-chipmenu-item>
+    `, isInline: true, components: [{ type: i2.ChipMenuItemComponent, selector: "kendo-pivot-chipmenu-item", inputs: ["icon", "text", "selected", "expanded"], outputs: ["itemClick", "expand", "collapse"] }, { type: i3.FilterMenuContainerComponent, selector: "kendo-pivot-filter-menu-container", inputs: ["chip", "isLast", "isExpanded", "menuTabbingService", "actionsClass"], outputs: ["close"] }], directives: [{ type: i4.ChipMenuItemContentTemplateDirective, selector: "[kendoPivotChipMenuItemContentTemplate]" }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: ChipMenuFilterComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'kendo-pivot-chipmenu-filter',
+                    template: `
+        <kendo-pivot-chipmenu-item
+            classs="k-widget k-expander"
+            [text]="messageFor('fieldMenuFilterItemLabel')"
+            icon="filter"
+            [expanded]="expanded"
+            (collapse)="onCollapse()"
+            (expand)="onExpand()">
+            <ng-template kendoPivotChipMenuItemContentTemplate>
+                <kendo-pivot-filter-menu-container
+                    [chip]="chip"
+                    [menuTabbingService]="service.menuTabbingService"
+                    [actionsClass]="actionsClass"
+                    [isLast]="isLast"
+                    [isExpanded]="expanded"
+                    (keydown.shift.tab)="$event.stopImmediatePropagation()"
+                    (close)="close()">
+                </kendo-pivot-filter-menu-container>
+            </ng-template>
+        </kendo-pivot-chipmenu-item>
+    `
+                }]
+        }], ctorParameters: function () { return [{ type: i1.PivotLocalizationService }, { type: i0.ElementRef }]; }, propDecorators: { expand: [{
+                type: Output
+            }], collapse: [{
+                type: Output
+            }], chip: [{
+                type: Input
+            }], expanded: [{
+                type: Input
+            }], isLast: [{
+                type: Input
+            }] } });

package/esm2015/configurator/chip-menu/chip-menu-item-base.js

@@ -0,0 +1,36 @@
+/**-----------------------------------------------------------------------------------------
+* Copyright © 2021 Progress Software Corporation. All rights reserved.
+* Licensed under commercial license. See LICENSE.md in the project root for more information
+*-------------------------------------------------------------------------------------------*/
+import { Input, isDevMode, HostBinding, Component } from '@angular/core';
+import * as i0 from "@angular/core";
+/**
+ * @hidden
+ */
+export class ChipMenuItemBase {
+    constructor() {
+        this.hostClass = true;
+    }
+    ngOnInit() {
+        if (isDevMode() && !this.service) {
+            throw new Error('The service input of the host chip menu components (e.g. ChipMenuSortComponent) is mandatory.');
+        }
+    }
+    close() {
+        this.service.close();
+    }
+}
+ChipMenuItemBase.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: ChipMenuItemBase, deps: [], target: i0.ɵɵFactoryTarget.Component });
+ChipMenuItemBase.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: ChipMenuItemBase, selector: "kendo-pivot-chip-menu-item-base", inputs: { service: "service" }, host: { properties: { "class.k-columnmenu-item-wrapper": "this.hostClass" } }, ngImport: i0, template: ``, isInline: true });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: ChipMenuItemBase, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'kendo-pivot-chip-menu-item-base',
+                    template: ``
+                }]
+        }], propDecorators: { service: [{
+                type: Input
+            }], hostClass: [{
+                type: HostBinding,
+                args: ['class.k-columnmenu-item-wrapper']
+            }] } });

package/esm2015/configurator/chip-menu/chip-menu-item-content-template.directive.js

@@ -0,0 +1,27 @@
+/**-----------------------------------------------------------------------------------------
+* Copyright © 2021 Progress Software Corporation. All rights reserved.
+* Licensed under commercial license. See LICENSE.md in the project root for more information
+*-------------------------------------------------------------------------------------------*/
+import { Directive, Optional } from '@angular/core';
+import * as i0 from "@angular/core";
+/**
+ * @hidden
+ *
+ * Represents the content template of the ChipMenuItemComponent.
+ * Provides an option for specifying the content of a chip menu item..
+ */
+export class ChipMenuItemContentTemplateDirective {
+    constructor(templateRef) {
+        this.templateRef = templateRef;
+    }
+}
+ChipMenuItemContentTemplateDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: ChipMenuItemContentTemplateDirective, deps: [{ token: i0.TemplateRef, optional: true }], target: i0.ɵɵFactoryTarget.Directive });
+ChipMenuItemContentTemplateDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.16", type: ChipMenuItemContentTemplateDirective, selector: "[kendoPivotChipMenuItemContentTemplate]", ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: ChipMenuItemContentTemplateDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[kendoPivotChipMenuItemContentTemplate]'
+                }]
+        }], ctorParameters: function () { return [{ type: i0.TemplateRef, decorators: [{
+                    type: Optional
+                }] }]; } });

package/esm2015/configurator/chip-menu/chip-menu-item.component.js

@@ -0,0 +1,157 @@
+/**-----------------------------------------------------------------------------------------
+* Copyright © 2021 Progress Software Corporation. All rights reserved.
+* Licensed under commercial license. See LICENSE.md in the project root for more information
+*-------------------------------------------------------------------------------------------*/
+import { Component, Input, Output, EventEmitter, ContentChild } from '@angular/core';
+import { trigger, transition, style, animate, state } from '@angular/animations';
+import { ChipMenuItemContentTemplateDirective } from './chip-menu-item-content-template.directive';
+import * as i0 from "@angular/core";
+import * as i1 from "@angular/common";
+/**
+ * @hidden
+ *
+ */
+export class ChipMenuItemComponent {
+    constructor() {
+        /**
+         * Fires when the item is clicked.
+         */
+        this.itemClick = new EventEmitter();
+        /**
+         * Fires when the content is expanded.
+         */
+        this.expand = new EventEmitter();
+        /**
+         * Fires when the content is collapsed.
+         */
+        this.collapse = new EventEmitter();
+        this.contentState = 'collapsed';
+    }
+    get iconClass() {
+        return `k-i-${this.icon}`;
+    }
+    ngOnChanges(changes) {
+        if (changes.expanded) {
+            this.updateContentState();
+        }
+    }
+    onClick(e) {
+        this.itemClick.emit(e);
+        if (this.contentTemplate) {
+            this.expanded = !this.expanded;
+            this.updateContentState();
+            if (this.expanded) {
+                this.expand.emit();
+            }
+            else {
+                this.collapse.emit();
+            }
+        }
+    }
+    updateContentState() {
+        this.contentState = this.expanded ? 'expanded' : 'collapsed';
+    }
+}
+ChipMenuItemComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: ChipMenuItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+ChipMenuItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: ChipMenuItemComponent, selector: "kendo-pivot-chipmenu-item", inputs: { icon: "icon", text: "text", selected: "selected", expanded: "expanded" }, outputs: { itemClick: "itemClick", expand: "expand", collapse: "collapse" }, queries: [{ propertyName: "contentTemplate", first: true, predicate: ChipMenuItemContentTemplateDirective, descendants: true }], usesOnChanges: true, ngImport: i0, template: `
+        <div
+            class="k-columnmenu-item"
+            (click)="onClick($event)"
+            (keydown.enter)="onClick($event)"
+            [class.k-selected]="selected"
+            role="button"
+            [attr.aria-expanded]="expanded">
+           <span *ngIf="icon" class="k-icon" [ngClass]="iconClass">
+           </span>
+           {{ text }}
+        </div>
+        <div *ngIf="contentTemplate" [@state]="contentState" style="overflow:hidden;" class="k-columnmenu-item-content">
+            <ng-container [ngTemplateOutlet]="contentTemplate.templateRef">
+            </ng-container>
+        <div>
+    `, isInline: true, directives: [{ type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }], animations: [
+        trigger('state', [
+            state('collapsed', style({ display: 'none' })),
+            state('expanded', style({ display: 'block' })),
+            transition('collapsed => expanded', [
+                style({
+                    height: '0px',
+                    display: 'block'
+                }),
+                animate('100ms ease-in', style({
+                    height: '*'
+                }))
+            ]),
+            transition('expanded => collapsed', [
+                style({
+                    height: '*'
+                }),
+                animate('100ms ease-in', style({
+                    height: '0px'
+                }))
+            ])
+        ])
+    ] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: ChipMenuItemComponent, decorators: [{
+            type: Component,
+            args: [{
+                    animations: [
+                        trigger('state', [
+                            state('collapsed', style({ display: 'none' })),
+                            state('expanded', style({ display: 'block' })),
+                            transition('collapsed => expanded', [
+                                style({
+                                    height: '0px',
+                                    display: 'block'
+                                }),
+                                animate('100ms ease-in', style({
+                                    height: '*'
+                                }))
+                            ]),
+                            transition('expanded => collapsed', [
+                                style({
+                                    height: '*'
+                                }),
+                                animate('100ms ease-in', style({
+                                    height: '0px'
+                                }))
+                            ])
+                        ])
+                    ],
+                    selector: 'kendo-pivot-chipmenu-item',
+                    template: `
+        <div
+            class="k-columnmenu-item"
+            (click)="onClick($event)"
+            (keydown.enter)="onClick($event)"
+            [class.k-selected]="selected"
+            role="button"
+            [attr.aria-expanded]="expanded">
+           <span *ngIf="icon" class="k-icon" [ngClass]="iconClass">
+           </span>
+           {{ text }}
+        </div>
+        <div *ngIf="contentTemplate" [@state]="contentState" style="overflow:hidden;" class="k-columnmenu-item-content">
+            <ng-container [ngTemplateOutlet]="contentTemplate.templateRef">
+            </ng-container>
+        <div>
+    `
+                }]
+        }], propDecorators: { itemClick: [{
+                type: Output
+            }], expand: [{
+                type: Output
+            }], collapse: [{
+                type: Output
+            }], icon: [{
+                type: Input
+            }], text: [{
+                type: Input
+            }], selected: [{
+                type: Input
+            }], expanded: [{
+                type: Input
+            }], contentTemplate: [{
+                type: ContentChild,
+                args: [ChipMenuItemContentTemplateDirective, { static: false }]
+            }] } });

package/esm2015/configurator/chip-menu/chip-menu-item.directive.js

@@ -0,0 +1,88 @@
+/**-----------------------------------------------------------------------------------------
+* Copyright © 2021 Progress Software Corporation. All rights reserved.
+* Licensed under commercial license. See LICENSE.md in the project root for more information
+*-------------------------------------------------------------------------------------------*/
+import { Directive, Input } from '@angular/core';
+import { Subscription } from 'rxjs';
+import { Keys } from '@progress/kendo-angular-common';
+import * as i0 from "@angular/core";
+/**
+ * @hidden
+ */
+export class ChipMenuItemDirective {
+    constructor(hostElement, renderer, ngZone) {
+        this.hostElement = hostElement;
+        this.renderer = renderer;
+        this.ngZone = ngZone;
+        this._isFirst = false;
+        this._isLast = false;
+        this.subs = new Subscription();
+        this.onTab = (e) => {
+            if (e.keyCode !== Keys.Tab) {
+                return;
+            }
+            if (this.isFirst && e.shiftKey && e.target === this.chipMenuItems[0]) {
+                e.preventDefault();
+                this.menuItemComponent.service.menuTabbingService.lastFocusable.focus();
+            }
+            if (this.isLast && !e.shiftKey) {
+                const lastColumnMenuItem = this.getLastColumnMenuItem();
+                const isExpanded = this.menuItemComponent.expanded;
+                if (lastColumnMenuItem === e.target && !isExpanded) {
+                    e.preventDefault();
+                    this.menuItemComponent.service.menuTabbingService.firstFocusable.focus();
+                }
+            }
+        };
+    }
+    set isFirst(value) {
+        if (value) {
+            const focusableElement = this.chipMenuItems[0];
+            this.menuItemComponent.service.menuTabbingService.firstFocusable = focusableElement;
+            this.ngZone.runOutsideAngular(() => {
+                const firstItemKeydownSub = this.renderer.listen(focusableElement, 'keydown', this.onTab);
+                this.subs.add(firstItemKeydownSub);
+            });
+        }
+        this._isFirst = value;
+    }
+    get isFirst() {
+        return this._isFirst;
+    }
+    set isLast(value) {
+        if (!this.chipMenuItems) {
+            return;
+        }
+        if (value) {
+            const lastFocusableElement = this.getLastColumnMenuItem();
+            this.menuItemComponent.service.menuTabbingService.lastFocusable = lastFocusableElement;
+            this.ngZone.runOutsideAngular(() => {
+                const lastItemKeydownSub = this.renderer.listen(lastFocusableElement, 'keydown', this.onTab);
+                this.subs.add(lastItemKeydownSub);
+            });
+        }
+        this._isLast = value;
+    }
+    get isLast() {
+        return this._isLast;
+    }
+    ngAfterViewInit() {
+        this.chipMenuItems = this.hostElement.nativeElement.querySelectorAll('.k-columnmenu-item');
+        this.chipMenuItems.forEach(el => this.renderer.setAttribute(el, 'tabindex', '0'));
+    }
+    ngOnDestroy() {
+        this.subs.unsubscribe();
+    }
+    getLastColumnMenuItem() {
+        return (this.chipMenuItems.length === 1 ? this.chipMenuItems[0] : this.chipMenuItems[1]);
+    }
+}
+ChipMenuItemDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: ChipMenuItemDirective, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Directive });
+ChipMenuItemDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.16", type: ChipMenuItemDirective, selector: "[kendoPivotChipMenuItem]", inputs: { menuItemComponent: ["kendoPivotChipMenuItem", "menuItemComponent"] }, ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: ChipMenuItemDirective, decorators: [{
+            type: Directive,
+            args: [{ selector: '[kendoPivotChipMenuItem]' }]
+        }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.Renderer2 }, { type: i0.NgZone }]; }, propDecorators: { menuItemComponent: [{
+                type: Input,
+                args: ['kendoPivotChipMenuItem']
+            }] } });

package/esm2015/configurator/chip-menu/chip-menu-sort.component.js

@@ -0,0 +1,89 @@
+/**-----------------------------------------------------------------------------------------
+* Copyright © 2021 Progress Software Corporation. All rights reserved.
+* Licensed under commercial license. See LICENSE.md in the project root for more information
+*-------------------------------------------------------------------------------------------*/
+import { Component, Input } from '@angular/core';
+import { ChipMenuItemBase } from './chip-menu-item-base';
+import { PIVOT_CONFIGURATOR_ACTION } from '@progress/kendo-pivotgrid-common';
+import * as i0 from "@angular/core";
+import * as i1 from "../../localization/pivot-localization.service";
+import * as i2 from "../configurator.service";
+import * as i3 from "./chip-menu-item.component";
+/**
+ * @hidden
+ *
+ * Represents a chip-menu item for sorting PivotGrid fields.
+ * Allows the user to sort the PivotGrid.
+ */
+export class ChipMenuSortComponent extends ChipMenuItemBase {
+    constructor(localization, renderer, configuratorService) {
+        super();
+        this.localization = localization;
+        this.renderer = renderer;
+        this.configuratorService = configuratorService;
+    }
+    get sortedAsc() {
+        const descriptor = this.descriptor;
+        return descriptor && (!descriptor.dir || descriptor.dir === 'asc');
+    }
+    get sortedDesc() {
+        const descriptor = this.descriptor;
+        return descriptor && descriptor.dir === 'desc';
+    }
+    /**
+     * Returns the localized message for a given token
+     */
+    messageFor(localizationToken) {
+        return this.localization.get(localizationToken);
+    }
+    toggleSort(dir) {
+        const field = this.chip.name.toString();
+        const descriptor = this.descriptor;
+        const sort = this.configuratorService.state.sort.filter(s => s.field !== field);
+        if (!descriptor || descriptor.dir !== dir) {
+            sort.push({ field, dir });
+        }
+        this.configuratorService.parseConfiguratorState({ type: PIVOT_CONFIGURATOR_ACTION.setSort, payload: sort });
+        this.close();
+    }
+    get descriptor() {
+        return [].concat(this.configuratorService.state.sort || []).find(s => s.field === this.chip.name.toString());
+    }
+}
+ChipMenuSortComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: ChipMenuSortComponent, deps: [{ token: i1.PivotLocalizationService }, { token: i0.Renderer2 }, { token: i2.ConfiguratorService }], target: i0.ɵɵFactoryTarget.Component });
+ChipMenuSortComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: ChipMenuSortComponent, selector: "kendo-pivot-chipmenu-sort", inputs: { chip: "chip" }, usesInheritance: true, ngImport: i0, template: `
+        <kendo-pivot-chipmenu-item
+            [text]="messageFor('fieldMenuSortAscendingItemLabel')"
+            icon="sort-asc-small"
+            (itemClick)="toggleSort('asc')"
+            [selected]="sortedAsc">
+        </kendo-pivot-chipmenu-item>
+        <kendo-pivot-chipmenu-item
+            [text]="messageFor('fieldMenuSortDescendingItemLabel')"
+            icon="sort-desc-small"
+            (itemClick)="toggleSort('desc')"
+            [selected]="sortedDesc">
+        </kendo-pivot-chipmenu-item>
+    `, isInline: true, components: [{ type: i3.ChipMenuItemComponent, selector: "kendo-pivot-chipmenu-item", inputs: ["icon", "text", "selected", "expanded"], outputs: ["itemClick", "expand", "collapse"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: ChipMenuSortComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'kendo-pivot-chipmenu-sort',
+                    template: `
+        <kendo-pivot-chipmenu-item
+            [text]="messageFor('fieldMenuSortAscendingItemLabel')"
+            icon="sort-asc-small"
+            (itemClick)="toggleSort('asc')"
+            [selected]="sortedAsc">
+        </kendo-pivot-chipmenu-item>
+        <kendo-pivot-chipmenu-item
+            [text]="messageFor('fieldMenuSortDescendingItemLabel')"
+            icon="sort-desc-small"
+            (itemClick)="toggleSort('desc')"
+            [selected]="sortedDesc">
+        </kendo-pivot-chipmenu-item>
+    `
+                }]
+        }], ctorParameters: function () { return [{ type: i1.PivotLocalizationService }, { type: i0.Renderer2 }, { type: i2.ConfiguratorService }]; }, propDecorators: { chip: [{
+                type: Input
+            }] } });

package/esm2015/configurator/chip-menu/chip-menu.component.js

@@ -0,0 +1,130 @@
+/**-----------------------------------------------------------------------------------------
+* Copyright © 2021 Progress Software Corporation. All rights reserved.
+* Licensed under commercial license. See LICENSE.md in the project root for more information
+*-------------------------------------------------------------------------------------------*/
+import { MenuTabbingService } from './filtering/menu-tabbing.service';
+import { Component, Input, ViewChild } from '@angular/core';
+import { ChipMenuService } from './chip-menu.service';
+import { replaceMessagePlaceholder } from '../../util';
+import * as i0 from "@angular/core";
+import * as i1 from "./single-popup.service";
+import * as i2 from "../../localization/pivot-localization.service";
+import * as i3 from "./chip-menu.service";
+import * as i4 from "./chip-menu-container.component";
+import * as i5 from "./chip-menu-sort.component";
+import * as i6 from "./chip-menu-filter.component";
+import * as i7 from "./chip-menu-item.directive";
+const POPUP_CLASS = 'k-column-menu';
+/**
+ * @hidden
+ *
+ * Represents the field chip menu component.
+ */
+export class ChipMenuComponent {
+    constructor(popupService, localization, service) {
+        this.popupService = popupService;
+        this.localization = localization;
+        this.service = service;
+        this.tabIndex = '-1';
+        this.closeSubscription = service.closeMenu.subscribe(this.close.bind(this));
+    }
+    ngOnDestroy() {
+        this.close();
+        this.closeSubscription.unsubscribe();
+    }
+    toggle(e, anchor, template) {
+        if (e) {
+            e.preventDefault();
+            e.stopImmediatePropagation();
+        }
+        this.popupRef = this.popupService.open(anchor, template, this.popupRef, POPUP_CLASS);
+        if (!this.popupRef) {
+            this.anchor.nativeElement.focus();
+        }
+    }
+    close() {
+        this.popupService.destroy();
+        this.popupRef = null;
+        this.anchor.nativeElement.focus();
+    }
+    get chipMenuTitle() {
+        const localizationMsg = this.localization.get('chipMenuIconTitle') || '';
+        const chipName = this.chip.name.toString();
+        return replaceMessagePlaceholder(localizationMsg, 'fieldName', chipName);
+    }
+}
+ChipMenuComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: ChipMenuComponent, deps: [{ token: i1.SinglePopupService }, { token: i2.PivotLocalizationService }, { token: i3.ChipMenuService }], target: i0.ɵɵFactoryTarget.Component });
+ChipMenuComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: ChipMenuComponent, selector: "kendo-pivot-chip-menu", inputs: { chip: "chip", tabIndex: "tabIndex" }, providers: [
+        ChipMenuService,
+        MenuTabbingService
+    ], viewQueries: [{ propertyName: "anchor", first: true, predicate: ["anchor"], descendants: true, static: true }], ngImport: i0, template: `
+        <span #anchor
+            class="k-icon k-i-more-vertical"
+            (click)="toggle($event, anchor, template)"
+            [tabindex]="tabIndex"
+            [attr.title]="chipMenuTitle">
+        </span>
+        <ng-template #template>
+            <kendo-pivot-chipmenu-container
+                (keydown.escape)="close()"
+                (keydown.enter)="$event.stopImmediatePropagation()">
+                <kendo-pivot-chipmenu-sort
+                    #sortItem
+                    [chip]="chip"
+                    [kendoPivotChipMenuItem]="sortItem"
+                    [service]="service">
+                </kendo-pivot-chipmenu-sort>
+
+                <kendo-pivot-chipmenu-filter
+                    #filterItem
+                    [chip]="chip"
+                    [kendoPivotChipMenuItem]="filterItem"
+                    [service]="service">
+                </kendo-pivot-chipmenu-filter>
+            </kendo-pivot-chipmenu-container>
+        </ng-template>
+    `, isInline: true, components: [{ type: i4.ChipMenuContainerComponent, selector: "kendo-pivot-chipmenu-container" }, { type: i5.ChipMenuSortComponent, selector: "kendo-pivot-chipmenu-sort", inputs: ["chip"] }, { type: i6.ChipMenuFilterComponent, selector: "kendo-pivot-chipmenu-filter", inputs: ["chip", "expanded", "isLast"], outputs: ["expand", "collapse"] }], directives: [{ type: i7.ChipMenuItemDirective, selector: "[kendoPivotChipMenuItem]", inputs: ["kendoPivotChipMenuItem"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: ChipMenuComponent, decorators: [{
+            type: Component,
+            args: [{
+                    providers: [
+                        ChipMenuService,
+                        MenuTabbingService
+                    ],
+                    selector: 'kendo-pivot-chip-menu',
+                    template: `
+        <span #anchor
+            class="k-icon k-i-more-vertical"
+            (click)="toggle($event, anchor, template)"
+            [tabindex]="tabIndex"
+            [attr.title]="chipMenuTitle">
+        </span>
+        <ng-template #template>
+            <kendo-pivot-chipmenu-container
+                (keydown.escape)="close()"
+                (keydown.enter)="$event.stopImmediatePropagation()">
+                <kendo-pivot-chipmenu-sort
+                    #sortItem
+                    [chip]="chip"
+                    [kendoPivotChipMenuItem]="sortItem"
+                    [service]="service">
+                </kendo-pivot-chipmenu-sort>
+
+                <kendo-pivot-chipmenu-filter
+                    #filterItem
+                    [chip]="chip"
+                    [kendoPivotChipMenuItem]="filterItem"
+                    [service]="service">
+                </kendo-pivot-chipmenu-filter>
+            </kendo-pivot-chipmenu-container>
+        </ng-template>
+    `
+                }]
+        }], ctorParameters: function () { return [{ type: i1.SinglePopupService }, { type: i2.PivotLocalizationService }, { type: i3.ChipMenuService }]; }, propDecorators: { chip: [{
+                type: Input
+            }], tabIndex: [{
+                type: Input
+            }], anchor: [{
+                type: ViewChild,
+                args: ['anchor', { static: true }]
+            }] } });