@progress/kendo-angular-pivotgrid 21.4.1 → 22.0.0-develop.1

package/esm2022/configurator/chip-menu/filtering/filter-menu-container.component.mjs

@@ -1,186 +0,0 @@
-/**-----------------------------------------------------------------------------------------
-* Copyright © 2026 Progress Software Corporation. All rights reserved.
-* Licensed under commercial license. See LICENSE.md in the project root for more information
-*-------------------------------------------------------------------------------------------*/
-import { MenuTabbingService } from './menu-tabbing.service';
-import { Component, Input, Output, EventEmitter, ChangeDetectorRef, ElementRef, ViewChild } from '@angular/core';
-import { isNullOrEmptyString } from "../../../util";
-import { PivotLocalizationService } from '../../../localization/pivot-localization.service';
-import { ConfiguratorService } from '../../configurator.service';
-import { PIVOT_CONFIGURATOR_ACTION } from '@progress/kendo-pivotgrid-common';
-import { NgClass } from '@angular/common';
-import { StringFilterMenuComponent } from './string-filter-menu.component';
-import { ReactiveFormsModule, FormsModule } from '@angular/forms';
-import { ButtonComponent } from '@progress/kendo-angular-buttons';
-import * as i0 from "@angular/core";
-import * as i1 from "../../../localization/pivot-localization.service";
-import * as i2 from "./menu-tabbing.service";
-import * as i3 from "../../configurator.service";
-import * as i4 from "@angular/forms";
-const isNoValueOperator = operator => (operator === "isnull"
-    || operator === "isnotnull"
-    || operator === "isempty"
-    || operator === "isnotempty");
-const validFilter = ({ value, operator }) => !isNullOrEmptyString(value) || isNoValueOperator(operator);
-/**
- * @hidden
- */
-export class FilterMenuContainerComponent {
-    localization;
-    cd;
-    configuratorService;
-    close = new EventEmitter();
-    /**
-     * The field with which the filter is associated.
-     */
-    chip;
-    isLast;
-    isExpanded;
-    menuTabbingService;
-    actionsClass = 'k-action-buttons k-button-group';
-    filterDescriptorValue;
-    resetButton;
-    filterButton;
-    constructor(localization, cd, menuTabbingService, configuratorService) {
-        this.localization = localization;
-        this.cd = cd;
-        this.configuratorService = configuratorService;
-        this.menuTabbingService = menuTabbingService;
-    }
-    ngAfterViewChecked() {
-        if (this.isLast && this.isExpanded) {
-            this.menuTabbingService.lastFocusable = this.disabled ?
-                this.resetButton.nativeElement : this.filterButton.nativeElement;
-        }
-    }
-    ngOnDestroy() {
-        this.menuTabbingService.lastFocusable = null;
-    }
-    get disabled() {
-        return !(this.filterDescriptorValue && validFilter(this.filterDescriptorValue));
-    }
-    submit() {
-        const filterDescriptor = {
-            field: this.chip.name.toString(),
-            ...this.filterDescriptorValue
-        };
-        const payload = !this.configuratorService.state.filter ?
-            [filterDescriptor] :
-            [
-                ...this.configuratorService.state.filter.filter(descriptor => descriptor.field !== filterDescriptor.field),
-                filterDescriptor
-            ];
-        this.configuratorService.parseConfiguratorState({ type: PIVOT_CONFIGURATOR_ACTION.setFilter, payload: payload });
-        this.close.emit();
-        return false;
-    }
-    reset() {
-        const filters = this.configuratorService.state.filter.filter(descriptor => descriptor.field !== this.chip.name.toString());
-        this.configuratorService.parseConfiguratorState({ type: PIVOT_CONFIGURATOR_ACTION.setFilter, payload: filters });
-        this.close.emit();
-    }
-    onTab(e, buttonType) {
-        if (this.menuTabbingService.firstFocusable && this.isLast) {
-            e.preventDefault();
-            if (buttonType === 'reset') {
-                // eslint-disable-next-line no-unused-expressions
-                this.disabled ? this.menuTabbingService.firstFocusable.focus() : this.filterButton.nativeElement.focus();
-            }
-            else {
-                this.menuTabbingService.firstFocusable.focus();
-            }
-        }
-    }
-    /**
-     * Returns the localized message for a given token
-     */
-    messageFor(localizationToken) {
-        return this.localization.get(localizationToken);
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: FilterMenuContainerComponent, deps: [{ token: i1.PivotLocalizationService }, { token: i0.ChangeDetectorRef }, { token: i2.MenuTabbingService }, { token: i3.ConfiguratorService }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: FilterMenuContainerComponent, isStandalone: true, selector: "kendo-pivot-filter-menu-container", inputs: { chip: "chip", isLast: "isLast", isExpanded: "isExpanded", menuTabbingService: "menuTabbingService", actionsClass: "actionsClass" }, outputs: { close: "close" }, providers: [
-            MenuTabbingService
-        ], viewQueries: [{ propertyName: "resetButton", first: true, predicate: ["resetButton"], descendants: true }, { propertyName: "filterButton", first: true, predicate: ["filterButton"], descendants: true }], ngImport: i0, template: `
-        <form (submit)="submit()" (reset)="reset()"
-            class="k-filter-menu k-group k-reset k-state-border-up">
-            <div class="k-filter-menu-container">
-                <kendo-pivot-string-filter-menu
-                    [style]="'display: flex; flex-flow: column nowrap; align-items: stretch; gap: 8px;'"
-                    [(ngModel)]="filterDescriptorValue"
-                    name="'filterDescriptorValue'"
-                    [chip]="chip"
-                    [menuTabbingService]="menuTabbingService">
-                </kendo-pivot-string-filter-menu>
-                <div [ngClass]="actionsClass">
-                    <button
-                        #resetButton
-                        type="reset"
-                        kendoButton
-                        (keydown.tab)="onTab($event, 'reset')">{{messageFor('filterClearButton')}}</button>
-                    <button #filterButton
-                        type="submit"
-                        [disabled]="disabled"
-                        kendoButton
-                        themeColor="primary"
-                        (keydown.tab)="onTab($event, 'filter')">{{messageFor('filterFilterButton')}}</button>
-                </div>
-            </div>
-        </form>
-    `, isInline: true, dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i4.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i4.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "component", type: StringFilterMenuComponent, selector: "kendo-pivot-string-filter-menu", inputs: ["chip", "menuTabbingService"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { 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"] }] });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: FilterMenuContainerComponent, decorators: [{
-            type: Component,
-            args: [{
-                    providers: [
-                        MenuTabbingService
-                    ],
-                    selector: 'kendo-pivot-filter-menu-container',
-                    template: `
-        <form (submit)="submit()" (reset)="reset()"
-            class="k-filter-menu k-group k-reset k-state-border-up">
-            <div class="k-filter-menu-container">
-                <kendo-pivot-string-filter-menu
-                    [style]="'display: flex; flex-flow: column nowrap; align-items: stretch; gap: 8px;'"
-                    [(ngModel)]="filterDescriptorValue"
-                    name="'filterDescriptorValue'"
-                    [chip]="chip"
-                    [menuTabbingService]="menuTabbingService">
-                </kendo-pivot-string-filter-menu>
-                <div [ngClass]="actionsClass">
-                    <button
-                        #resetButton
-                        type="reset"
-                        kendoButton
-                        (keydown.tab)="onTab($event, 'reset')">{{messageFor('filterClearButton')}}</button>
-                    <button #filterButton
-                        type="submit"
-                        [disabled]="disabled"
-                        kendoButton
-                        themeColor="primary"
-                        (keydown.tab)="onTab($event, 'filter')">{{messageFor('filterFilterButton')}}</button>
-                </div>
-            </div>
-        </form>
-    `,
-                    standalone: true,
-                    imports: [ReactiveFormsModule, FormsModule, StringFilterMenuComponent, NgClass, ButtonComponent]
-                }]
-        }], ctorParameters: () => [{ type: i1.PivotLocalizationService }, { type: i0.ChangeDetectorRef }, { type: i2.MenuTabbingService }, { type: i3.ConfiguratorService }], propDecorators: { close: [{
-                type: Output
-            }], chip: [{
-                type: Input
-            }], isLast: [{
-                type: Input
-            }], isExpanded: [{
-                type: Input
-            }], menuTabbingService: [{
-                type: Input
-            }], actionsClass: [{
-                type: Input
-            }], resetButton: [{
-                type: ViewChild,
-                args: ['resetButton']
-            }], filterButton: [{
-                type: ViewChild,
-                args: ['filterButton']
-            }] } });

package/esm2022/configurator/chip-menu/filtering/filter-menu-dropdownlist.directive.mjs

@@ -1,44 +0,0 @@
-/**-----------------------------------------------------------------------------------------
-* Copyright © 2026 Progress Software Corporation. All rights reserved.
-* Licensed under commercial license. See LICENSE.md in the project root for more information
-*-------------------------------------------------------------------------------------------*/
-import { DropDownListComponent } from '@progress/kendo-angular-dropdowns';
-import { Directive, Input } from '@angular/core';
-import { Keys } from '@progress/kendo-angular-common';
-import * as i0 from "@angular/core";
-import * as i1 from "@progress/kendo-angular-dropdowns";
-/**
- * @hidden
- */
-export class FilterMenuDropDownListDirective {
-    host;
-    filterMenuDropDownLabel;
-    constructor(host) {
-        this.host = host;
-    }
-    ngAfterViewInit() {
-        const wrapperElement = this.host.wrapper.nativeElement;
-        wrapperElement.setAttribute('aria-label', this.filterMenuDropDownLabel);
-        wrapperElement.addEventListener('keydown', this.keydownHandler, true);
-    }
-    ngOnDestroy() {
-        this.host.wrapper.nativeElement.removeEventListener('keydown', this.keydownHandler);
-    }
-    keydownHandler = (e) => {
-        if (e.code === Keys.Escape && this.host.isOpen) {
-            e.stopPropagation();
-            this.host.toggle(false);
-        }
-    };
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: FilterMenuDropDownListDirective, deps: [{ token: i1.DropDownListComponent }], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.14", type: FilterMenuDropDownListDirective, isStandalone: true, selector: "[kendoFilterMenuDropDown]", inputs: { filterMenuDropDownLabel: "filterMenuDropDownLabel" }, ngImport: i0 });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: FilterMenuDropDownListDirective, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: '[kendoFilterMenuDropDown]',
-                    standalone: true
-                }]
-        }], ctorParameters: () => [{ type: i1.DropDownListComponent }], propDecorators: { filterMenuDropDownLabel: [{
-                type: Input
-            }] } });

package/esm2022/configurator/chip-menu/filtering/menu-tabbing.service.mjs

@@ -1,20 +0,0 @@
-/**-----------------------------------------------------------------------------------------
-* Copyright © 2026 Progress Software Corporation. All rights reserved.
-* Licensed under commercial license. See LICENSE.md in the project root for more information
-*-------------------------------------------------------------------------------------------*/
-import { Injectable } from '@angular/core';
-import * as i0 from "@angular/core";
-/**
- * @hidden
- */
-export class MenuTabbingService {
-    firstFocusable;
-    lastFocusable;
-    isPopupOpen = false;
-    lastMenuItem;
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: MenuTabbingService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: MenuTabbingService });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: MenuTabbingService, decorators: [{
-            type: Injectable
-        }] });

package/esm2022/configurator/chip-menu/filtering/string-filter-menu.component.mjs

@@ -1,148 +0,0 @@
-/**-----------------------------------------------------------------------------------------
-* Copyright © 2026 Progress Software Corporation. All rights reserved.
-* Licensed under commercial license. See LICENSE.md in the project root for more information
-*-------------------------------------------------------------------------------------------*/
-import { MenuTabbingService } from './menu-tabbing.service';
-import { Component, Input, forwardRef } from '@angular/core';
-import { PivotLocalizationService } from '../../../localization/pivot-localization.service';
-import { FormBuilder, NG_VALUE_ACCESSOR, ReactiveFormsModule } from '@angular/forms';
-import { ConfiguratorService } from '../../configurator.service';
-import { Subscription } from 'rxjs';
-import { FilterMenuDropDownListDirective } from './filter-menu-dropdownlist.directive';
-import { DropDownListComponent } from '@progress/kendo-angular-dropdowns';
-import { TextBoxDirective } from '@progress/kendo-angular-inputs';
-import { replaceMessagePlaceholder } from '@progress/kendo-angular-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 "@angular/forms";
-/**
- * @hidden
- */
-export const localizeOperators = operators => localization => Object.keys(operators).map(key => ({
-    text: localization.get(key),
-    value: operators[key]
-}));
-const stringOperators = localizeOperators({
-    "filterEqOperator": "eq",
-    "filterNotEqOperator": "neq",
-    "filterContainsOperator": "contains",
-    "filterNotContainsOperator": "doesnotcontain",
-    "filterStartsWithOperator": "startswith",
-    "filterEndsWithOperator": "endswith",
-    "filterIsNullOperator": "isnull",
-    "filterIsNotNullOperator": "isnotnull",
-    "filterIsEmptyOperator": "isempty",
-    "filterIsNotEmptyOperator": "isnotempty"
-});
-/**
- * @hidden
- *
- * Represents a string-filter menu component.
- */
-export class StringFilterMenuComponent {
-    localization;
-    configuratorService;
-    fb;
-    /**
-     * The field with which the filter is associated.
-     */
-    chip;
-    menuTabbingService;
-    operators;
-    filterFormGroup;
-    get currentFilter() {
-        const filterValue = this.configuratorService.state.filter?.filter(x => x.field === this.chip.name.toString());
-        return filterValue && filterValue[0];
-    }
-    subscription = new Subscription();
-    constructor(localization, configuratorService, fb) {
-        this.localization = localization;
-        this.configuratorService = configuratorService;
-        this.fb = fb;
-    }
-    // eslint-disable-next-line @typescript-eslint/no-empty-function
-    onTouched = () => { };
-    registerOnChange(fn) {
-        this.filterFormGroup.valueChanges.subscribe(fn);
-    }
-    registerOnTouched(fn) {
-        this.onTouched = fn;
-    }
-    writeValue(val) {
-        if (val) {
-            this.filterFormGroup.setValue(val, { emitEvent: false });
-        }
-    }
-    get filterMenuDropDownLabel() {
-        const localizationMsg = this.localization.get('filterOperatorsDropDownLabel') || '';
-        const chipName = this.chip.name.toString();
-        return replaceMessagePlaceholder(localizationMsg, 'fields', chipName);
-    }
-    ngOnInit() {
-        this.filterFormGroup = this.fb.group({
-            operator: [this.currentFilter ? this.currentFilter.operator : ''],
-            value: [this.currentFilter ? this.currentFilter.value : '']
-        });
-        this.operators = stringOperators(this.localization);
-    }
-    ngOnDestroy() {
-        this.subscription.unsubscribe();
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StringFilterMenuComponent, deps: [{ token: i1.PivotLocalizationService }, { token: i2.ConfiguratorService }, { token: i3.FormBuilder }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: StringFilterMenuComponent, isStandalone: true, selector: "kendo-pivot-string-filter-menu", inputs: { chip: "chip", menuTabbingService: "menuTabbingService" }, providers: [{
-                provide: NG_VALUE_ACCESSOR,
-                useExisting: forwardRef(() => StringFilterMenuComponent),
-                multi: true
-            }], ngImport: i0, template: `
-        <ng-container [formGroup]="filterFormGroup">
-            <kendo-dropdownlist
-                    kendoFilterMenuDropDown
-                    [filterMenuDropDownLabel]="filterMenuDropDownLabel"
-                    [data]="operators"
-                    formControlName="operator"
-                    [valuePrimitive]="true"
-                    textField="text"
-                    valueField="value">
-                </kendo-dropdownlist>
-                <input
-                    kendoTextBox
-                    formControlName="value"
-                />
-        </ng-container>
-    `, isInline: true, dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: DropDownListComponent, selector: "kendo-dropdownlist", inputs: ["customIconClass", "showStickyHeader", "icon", "svgIcon", "loading", "data", "value", "textField", "valueField", "adaptiveMode", "adaptiveTitle", "adaptiveSubtitle", "popupSettings", "listHeight", "defaultItem", "disabled", "itemDisabled", "readonly", "filterable", "virtual", "ignoreCase", "delay", "valuePrimitive", "tabindex", "tabIndex", "size", "rounded", "fillMode", "leftRightArrowsNavigation", "id"], outputs: ["valueChange", "filterChange", "selectionChange", "open", "opened", "close", "closed", "focus", "blur"], exportAs: ["kendoDropDownList"] }, { kind: "directive", type: FilterMenuDropDownListDirective, selector: "[kendoFilterMenuDropDown]", inputs: ["filterMenuDropDownLabel"] }, { kind: "directive", type: TextBoxDirective, selector: "input[kendoTextBox]", inputs: ["value"] }] });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: StringFilterMenuComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'kendo-pivot-string-filter-menu',
-                    providers: [{
-                            provide: NG_VALUE_ACCESSOR,
-                            useExisting: forwardRef(() => StringFilterMenuComponent),
-                            multi: true
-                        }],
-                    template: `
-        <ng-container [formGroup]="filterFormGroup">
-            <kendo-dropdownlist
-                    kendoFilterMenuDropDown
-                    [filterMenuDropDownLabel]="filterMenuDropDownLabel"
-                    [data]="operators"
-                    formControlName="operator"
-                    [valuePrimitive]="true"
-                    textField="text"
-                    valueField="value">
-                </kendo-dropdownlist>
-                <input
-                    kendoTextBox
-                    formControlName="value"
-                />
-        </ng-container>
-    `,
-                    standalone: true,
-                    imports: [ReactiveFormsModule, DropDownListComponent, FilterMenuDropDownListDirective, TextBoxDirective]
-                }]
-        }], ctorParameters: () => [{ type: i1.PivotLocalizationService }, { type: i2.ConfiguratorService }, { type: i3.FormBuilder }], propDecorators: { chip: [{
-                type: Input
-            }], menuTabbingService: [{
-                type: Input
-            }] } });

package/esm2022/configurator/chip-menu/single-popup.service.mjs

@@ -1,136 +0,0 @@
-/**-----------------------------------------------------------------------------------------
-* Copyright © 2026 Progress Software Corporation. All rights reserved.
-* Licensed under commercial license. See LICENSE.md in the project root for more information
-*-------------------------------------------------------------------------------------------*/
-import { PopupService } from '@progress/kendo-angular-popup';
-import { Injectable, Renderer2, NgZone } from '@angular/core';
-import { Subject, Subscription } from 'rxjs';
-import { PreventableEvent } from '@progress/kendo-angular-common';
-import { PivotLocalizationService } from '../../localization/pivot-localization.service';
-import { isPresent } from '../../util';
-import * as i0 from "@angular/core";
-import * as i1 from "@progress/kendo-angular-popup";
-import * as i2 from "../../localization/pivot-localization.service";
-const contains = (node, predicate) => {
-    while (node) {
-        if (predicate(node)) {
-            return true;
-        }
-        node = node.parentNode;
-    }
-    return false;
-};
-/**
- * @hidden
- * Arguments for the `close` event of the chip-menu popup.
- */
-export class PopupCloseEvent extends PreventableEvent {
-    /**
-     * The original DOM event that causes the popup to close.
-     */
-    originalEvent;
-    /**
-     * @hidden
-     */
-    constructor(e) {
-        super();
-        this.originalEvent = e;
-    }
-}
-const DEFAULT_POPUP_CLASS = 'k-grid-filter-popup';
-/**
- * @hidden
- * The service that is used for the popups of the chip menus.
- */
-export class SinglePopupService {
-    popupService;
-    renderer;
-    ngZone;
-    localization;
-    /**
-     * Fires when the chip menus are about to close because the user clicked outside their popups.
-     * Used to prevent the popup from closing.
-     */
-    onClose = new Subject();
-    removeClick;
-    pointerEventsSub = new Subscription();
-    popupRef;
-    scrollSubscription = new Subscription();
-    canClosePopup;
-    constructor(popupService, renderer, ngZone, localization) {
-        this.popupService = popupService;
-        this.renderer = renderer;
-        this.ngZone = ngZone;
-        this.localization = localization;
-    }
-    open(anchor, template, popupRef, popupClass = DEFAULT_POPUP_CLASS) {
-        const toggle = isPresent(popupRef) && this.popupRef === popupRef;
-        this.destroy();
-        if (!toggle) {
-            const direction = this.localization.rtl ? 'right' : 'left';
-            this.popupRef = this.popupService.open({
-                anchorAlign: { vertical: 'bottom', horizontal: direction },
-                popupAlign: { vertical: 'top', horizontal: direction },
-                anchor: anchor,
-                popupClass: popupClass,
-                content: template,
-                positionMode: "absolute"
-            });
-            this.renderer.setAttribute(this.popupRef.popupElement, 'dir', this.localization.rtl ? 'rtl' : 'ltr');
-            this.attachClose(anchor);
-        }
-        const popupEl = this.popupRef?.popupElement;
-        if (popupEl) {
-            this.attachMouseListeners(popupEl);
-        }
-        return this.popupRef;
-    }
-    destroy() {
-        if (this.popupRef) {
-            this.detachClose();
-            this.pointerEventsSub.unsubscribe();
-            this.pointerEventsSub = null;
-            this.popupRef.close();
-            this.popupRef = null;
-        }
-    }
-    ngOnDestroy() {
-        this.destroy();
-        this.scrollSubscription.unsubscribe();
-    }
-    detachClose() {
-        if (this.removeClick) {
-            this.removeClick();
-        }
-    }
-    attachClose(skipElement) {
-        this.detachClose();
-        this.ngZone.runOutsideAngular(() => this.removeClick = this.renderer.listen('document', 'click', (e) => {
-            if (!contains(e.target, x => this.popupRef.popupElement === x || x === skipElement)) {
-                const args = new PopupCloseEvent(e);
-                this.onClose.next(args);
-                if (!args.isDefaultPrevented() && this.canClosePopup) {
-                    this.destroy();
-                }
-                this.canClosePopup = true;
-            }
-        }));
-    }
-    attachMouseListeners(el) {
-        this.pointerEventsSub = new Subscription();
-        this.ngZone.runOutsideAngular(() => {
-            this.pointerEventsSub.add(this.renderer.listen(el, 'pointerdown', (e) => {
-                e.stopImmediatePropagation();
-                this.canClosePopup = false;
-            }));
-            this.pointerEventsSub.add(this.renderer.listen(el, 'pointerup', () => {
-                this.canClosePopup = true;
-            }));
-        });
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: SinglePopupService, deps: [{ token: i1.PopupService }, { token: i0.Renderer2 }, { token: i0.NgZone }, { token: i2.PivotLocalizationService }], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: SinglePopupService });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: SinglePopupService, decorators: [{
-            type: Injectable
-        }], ctorParameters: () => [{ type: i1.PopupService }, { type: i0.Renderer2 }, { type: i0.NgZone }, { type: i2.PivotLocalizationService }] });