@progress/kendo-angular-grid 7.0.0-dev.202201261657 → 7.0.0-next.202204010918

package/esm2015/columns/span-column.component.js

@@ -0,0 +1,275 @@
+/**-----------------------------------------------------------------------------------------
+* Copyright © 2021 Progress Software Corporation. All rights reserved.
+* Licensed under commercial license. See LICENSE.md in the project root for more information
+*-------------------------------------------------------------------------------------------*/
+import { forwardRef, Component, SkipSelf, Host, Optional, QueryList, ContentChildren, Input } from '@angular/core';
+import { CellTemplateDirective } from '../rendering/cell-template.directive';
+import { EditTemplateDirective } from '../editing/edit-template.directive';
+import { ColumnBase } from './column-base';
+import { ColumnComponent } from "./column.component";
+import { isPresent } from "../utils";
+import * as i0 from "@angular/core";
+import * as i1 from "./column-base";
+import * as i2 from "../common/id.service";
+/**
+ * @hidden
+ */
+export function isSpanColumnComponent(column) {
+    return column.isSpanColumn;
+}
+/**
+ * Represents a column which can be spanned over multiple data cells while the individual
+ * header and footer cells are retained ([see example]({% slug spanned_columns_grid %})).
+ * Enables you to achieve more flexible layout while keeping the built-in UI element for
+ * [sorting]({% slug sorting_grid %}), [filtering]({% slug filtering_grid %}), and
+ * [grouping]({% slug groupingbasics_grid %}). Wrap the columns that will be
+ * merged inside the `<kendo-grid-span-column>` tag.
+ *
+ * @example
+ * ```ts-preview
+ *
+ * _@Component({
+ *    selector: 'my-app',
+ *    template: `
+ *        <kendo-grid
+ *              [sortable]="true"
+ *              [filterable]="true"
+ *              [kendoGridBinding]="products">
+ *          <kendo-grid-column field="ProductID" title="Product ID" [width]="120">
+ *          </kendo-grid-column>
+ *          <kendo-grid-span-column>
+ *              <kendo-grid-column field="ProductName" title="Product Name">
+ *              </kendo-grid-column>
+ *              <kendo-grid-column field="UnitPrice" title="Unit Price" filter="numeric" [width]="180" format="{0:c}">
+ *              </kendo-grid-column>
+ *          </kendo-grid-span-column>
+ *          <kendo-grid-column field="Discontinued" [width]="120" filter="boolean">
+ *              <ng-template kendoGridCellTemplate let-dataItem>
+ *                  <input type="checkbox" [checked]="dataItem.Discontinued" disabled/>
+ *              </ng-template>
+ *          </kendo-grid-column>
+ *        </kendo-grid>
+ *    `
+ * })
+ *
+ * class AppComponent {
+ *   public products = [{
+ *      "ProductID": 1,
+ *      "ProductName": "Chai",
+ *      "UnitPrice": 18.0000,
+ *      "Discontinued": true
+ *    }, {
+ *      "ProductID": 2,
+ *      "ProductName": "Chang",
+ *      "UnitPrice": 19.0000,
+ *      "Discontinued": false
+ *    }
+ *   ];
+ * }
+ *
+ * ```
+ *
+ * By default, the data cell displays the data for the specified fields. To further customize
+ * the span-column functionality, use a [cell template]({% slug api_grid_celltemplatedirective %}).
+ *
+ * ```html-no-run
+ * <kendo-grid-span-column>
+ *  <kendo-grid-column field="field1" title="Field 1"></kendo-grid-column>
+ *  <kendo-grid-column field="field2" title="Field 2"></kendo-grid-column>
+ *    <ng-template kendoGridCellTemplate let-dataItem>
+ *        <h5>{{ dataItem.field1 }}</h5>
+ *        <p>{{ dataItem.field2 }}</p>
+ *    </ng-template>
+ *  </kendo-grid-span-column>
+ * ```
+ */
+export class SpanColumnComponent extends ColumnBase {
+    constructor(parent, idService) {
+        super(parent, idService);
+        /*
+         * @hidden
+         */
+        this.isSpanColumn = true;
+        this.template = new QueryList();
+        this.editTemplate = new QueryList();
+        /**
+         * @hidden
+         */
+        this.childColumns = new QueryList();
+        /**
+         * @hidden
+         */
+        this.includeInChooser = false;
+        this._editable = true;
+        if (parent && parent.isSpanColumn) {
+            throw new Error('SpanColumn cannot be nested inside another SpanColumn');
+        }
+    }
+    /**
+     * Defines whether the edit template of the column will be rendered. The default value is `false`.
+     *
+     * > To enable the editing functionality for a spanned column, set an edit template for it.
+     *
+     * @example
+     * ```html-no-run
+     * <kendo-grid>
+     *    <kendo-grid-span-column [editable]="false">
+     *      <kendo-grid-column field="UnitPrice">
+     *      </kendo-grid-column>
+     *      <kendo-grid-column field="ProductName">
+     *      </kendo-grid-column>
+     *      <ng-template kendoGridEditTemplate>
+     *         .....
+     *      </ng-template>
+     *    </kendo-grid-span-column>
+     * </kendo-grid>
+     * ```
+     */
+    set editable(value) {
+        this._editable = value;
+    }
+    get editable() {
+        return isPresent(this.editTemplateRef) && this._editable;
+    }
+    /**
+     * @hidden
+     * added for backwards compitability
+     */
+    set width(_value) {
+    }
+    get width() {
+        return this.childColumns.reduce((total, column) => total + column.width, 0);
+    }
+    /**
+     * @hidden
+     */
+    get leafIndex() {
+        return this.childColumns.first.leafIndex;
+    }
+    /**
+     * @hidden
+     */
+    get templateRef() {
+        const template = this.template.first;
+        return template ? template.templateRef : undefined;
+    }
+    /**
+     * @hidden
+     */
+    get editTemplateRef() {
+        const editTemplate = this.editTemplate.first;
+        return editTemplate ? editTemplate.templateRef : undefined;
+    }
+    /**
+     * @hidden
+     */
+    get colspan() {
+        return this.childColumns.filter(c => c.isVisible).length;
+    }
+    /**
+     * Toggles the locked (frozen) state of the columns. Locked columns are visible
+     * at all times during the horizontal scrolling of the Grid.
+     *
+     * For the option to work properly, make sure that:
+     * - Scrolling is enabled.
+     * - The `height` option of the Grid is set.
+     * - The widths of all Grid columns are explicitly set in pixels. In this way,
+     * the Grid adjusts the layout of the locked and unlocked columns.
+     *
+     * @default false
+     *
+     * @example
+     * ```ts
+     * _@Component({
+     *    selector: 'my-app',
+     *    template: `
+     *        <kendo-grid [data]="gridData" [scrollable]="scrollable" style="height: 200px">
+     *          <kendo-grid-span-column [locked]="true">
+     *             <kendo-grid-column field="ProductID" title="Product ID" [width]="120">
+     *             </kendo-grid-column>
+     *             <kendo-grid-column field="ProductName" title="Product Name" [width]="200">
+     *             </kendo-grid-column>
+     *          </kendo-grid-span-column>
+     *          <kendo-grid-column field="UnitPrice" title="Unit Price" [width]="230">
+     *          </kendo-grid-column>
+     *        </kendo-grid>
+     *    `
+     * })
+     *
+     * class AppComponent {
+     *    public gridData: any[];
+     *
+     *    constructor() {
+     *        this.gridData = products;
+     *    }
+     * }
+     *
+     * const products = [{
+     *    "ProductID": 1,
+     *    "ProductName": "Chai",
+     *    "UnitPrice": 18.0000,
+     *    "Discontinued": true
+     *  }, {
+     *    "ProductID": 2,
+     *    "ProductName": "Chang",
+     *    "UnitPrice": 19.0000,
+     *    "Discontinued": false
+     *  }
+     * ];
+     *
+     * ```
+     */
+    set locked(value) {
+        this._locked = value;
+    }
+    get locked() {
+        return this._locked || this.childColumns.some(c => c.locked);
+    }
+    get childrenArray() {
+        return this.childColumns.toArray();
+    }
+    get hasChildren() {
+        return this.childColumns.length > 0;
+    }
+}
+SpanColumnComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: SpanColumnComponent, deps: [{ token: i1.ColumnBase, host: true, optional: true, skipSelf: true }, { token: i2.IdService, optional: true }], target: i0.ɵɵFactoryTarget.Component });
+SpanColumnComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: SpanColumnComponent, selector: "kendo-grid-span-column", inputs: { editable: "editable", locked: "locked" }, providers: [
+        {
+            provide: ColumnBase,
+            useExisting: forwardRef(() => SpanColumnComponent)
+        }
+    ], queries: [{ propertyName: "template", predicate: CellTemplateDirective }, { propertyName: "editTemplate", predicate: EditTemplateDirective }, { propertyName: "childColumns", predicate: ColumnComponent }], usesInheritance: true, ngImport: i0, template: ``, isInline: true });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: SpanColumnComponent, decorators: [{
+            type: Component,
+            args: [{
+                    providers: [
+                        {
+                            provide: ColumnBase,
+                            useExisting: forwardRef(() => SpanColumnComponent)
+                        }
+                    ],
+                    selector: 'kendo-grid-span-column',
+                    template: ``
+                }]
+        }], ctorParameters: function () { return [{ type: i1.ColumnBase, decorators: [{
+                    type: SkipSelf
+                }, {
+                    type: Host
+                }, {
+                    type: Optional
+                }] }, { type: i2.IdService, decorators: [{
+                    type: Optional
+                }] }]; }, propDecorators: { template: [{
+                type: ContentChildren,
+                args: [CellTemplateDirective, { descendants: false }]
+            }], editTemplate: [{
+                type: ContentChildren,
+                args: [EditTemplateDirective, { descendants: false }]
+            }], childColumns: [{
+                type: ContentChildren,
+                args: [ColumnComponent]
+            }], editable: [{
+                type: Input
+            }], locked: [{
+                type: Input
+            }] } });

package/esm2015/common/cell-click-event-args.interface.js

@@ -0,0 +1,5 @@
+/**-----------------------------------------------------------------------------------------
+* Copyright © 2021 Progress Software Corporation. All rights reserved.
+* Licensed under commercial license. See LICENSE.md in the project root for more information
+*-------------------------------------------------------------------------------------------*/
+export {};

package/esm2015/common/column-info.service.js

@@ -0,0 +1,91 @@
+/**-----------------------------------------------------------------------------------------
+* Copyright © 2021 Progress Software Corporation. All rights reserved.
+* Licensed under commercial license. See LICENSE.md in the project root for more information
+*-------------------------------------------------------------------------------------------*/
+import { Injectable, EventEmitter } from "@angular/core";
+import { ColumnsContainer } from "../columns/columns-container";
+import { expandColumns } from "../columns/column-common";
+import { orderBy } from '@progress/kendo-data-query';
+import * as i0 from "@angular/core";
+const NO_STICKY = { left: '0px', right: '0px' };
+/**
+ * @hidden
+ */
+export class ColumnInfoService {
+    constructor() {
+        this.visibilityChange = new EventEmitter();
+        this.lockedChange = new EventEmitter();
+        this.stickyChange = new EventEmitter();
+        this.columnRangeChange = new EventEmitter();
+        this.columnsContainer = new ColumnsContainer(() => []);
+    }
+    get lockedLeafColumns() {
+        return this.columnsContainer.lockedLeafColumns;
+    }
+    get nonLockedLeafColumns() {
+        return this.columnsContainer.nonLockedLeafColumns;
+    }
+    get isLocked() {
+        return this.lockedLeafColumns.length > 0;
+    }
+    get totalLevels() {
+        return this.columnsContainer.totalLevels;
+    }
+    get hiddenColumns() {
+        if (!this.list) {
+            return [];
+        }
+        return this.list().filter(column => !column.isVisible);
+    }
+    get leafNamedColumns() {
+        const columns = expandColumns(this.list().filterSort(column => !column.isColumnGroup))
+            .filter(column => column.matchesMedia && column.displayTitle);
+        return orderBy(columns, [{ field: 'locked', dir: 'desc' }]);
+    }
+    get unlockedRootCount() {
+        return this.list().rootColumns().filter(column => !column.locked && column.isVisible).length;
+    }
+    stickyColumnsStyles(column) {
+        if (!this.stickyColumns) {
+            this.stickyColumns = this.list().rootColumns().filter(column => column.sticky && !column.locked && column.isVisible);
+        }
+        if (this.stickyColumns.length === 0) {
+            return NO_STICKY;
+        }
+        const result = this.stickyColumns.reduce((acc, curr) => {
+            if (curr.leafIndex < column.leafIndex) {
+                acc.left += curr.width;
+            }
+            else if (curr.leafIndex > column.leafIndex) {
+                acc.right += curr.width;
+            }
+            return acc;
+        }, { left: 0, right: 0 });
+        return {
+            left: `${result.left}px`,
+            right: `${result.right}px`
+        };
+    }
+    init(columns, list) {
+        this.columnsContainer = columns;
+        this.list = list;
+        this.stickyColumns = null;
+    }
+    changeVisibility(columns) {
+        this.stickyColumns = null;
+        this.visibilityChange.emit(columns);
+    }
+    changeLocked(columns) {
+        this.stickyColumns = null;
+        this.lockedChange.emit(columns);
+    }
+    changeStuck(columns) {
+        this.stickyColumns = null;
+        this.stickyChange.emit(columns);
+    }
+}
+ColumnInfoService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: ColumnInfoService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+ColumnInfoService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: ColumnInfoService });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: ColumnInfoService, decorators: [{
+            type: Injectable
+        }] });

package/esm2015/common/create-form-group.js

@@ -0,0 +1,5 @@
+/**-----------------------------------------------------------------------------------------
+* Copyright © 2021 Progress Software Corporation. All rights reserved.
+* Licensed under commercial license. See LICENSE.md in the project root for more information
+*-------------------------------------------------------------------------------------------*/
+export {};

package/esm2015/common/dom-events.service.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 { Injectable, EventEmitter } from '@angular/core';
+import * as i0 from "@angular/core";
+/**
+ * @hidden
+ */
+export class DomEventsService {
+    constructor() {
+        this.cellClick = new EventEmitter();
+        this.cellMousedown = new EventEmitter();
+        this.cellMouseup = new EventEmitter();
+        this.click = new EventEmitter();
+        this.keydown = new EventEmitter();
+        this.focus = new EventEmitter();
+        this.focusIn = new EventEmitter();
+        this.focusOut = new EventEmitter();
+        this.windowBlur = new EventEmitter();
+    }
+}
+DomEventsService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: DomEventsService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+DomEventsService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: DomEventsService });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: DomEventsService, decorators: [{
+            type: Injectable
+        }] });

package/esm2015/common/fetch-data-callback.js

@@ -0,0 +1,5 @@
+/**-----------------------------------------------------------------------------------------
+* Copyright © 2021 Progress Software Corporation. All rights reserved.
+* Licensed under commercial license. See LICENSE.md in the project root for more information
+*-------------------------------------------------------------------------------------------*/
+export {};

package/esm2015/common/filter-descriptor-differ.js

@@ -0,0 +1,69 @@
+/**-----------------------------------------------------------------------------------------
+* Copyright © 2021 Progress Software Corporation. All rights reserved.
+* Licensed under commercial license. See LICENSE.md in the project root for more information
+*-------------------------------------------------------------------------------------------*/
+import { isPresent } from "../utils";
+import { isCompositeFilterDescriptor } from "@progress/kendo-data-query";
+const areDifferent = (a, b) => a.field !== b.field || a.operator !== b.operator || a.value !== b.value;
+const isChanged = (a, b) => {
+    if (a.length !== b.length) {
+        return true;
+    }
+    for (let idx = 0, len = a.length; idx < len; idx++) {
+        const prev = a[idx];
+        const curr = b[idx];
+        if (isCompositeFilterDescriptor(prev)) {
+            if (diffFilters(prev, curr[idx])) {
+                return true;
+            }
+        }
+        else if (areDifferent(prev, curr)) {
+            return true;
+        }
+    }
+    return false;
+};
+const copyObject = (obj) => {
+    const result = {};
+    Object.assign(result, obj);
+    if (obj.constructor !== Object) {
+        const proto = obj.constructor.prototype;
+        Object.getOwnPropertyNames(proto).forEach((property) => {
+            if (property !== 'constructor' && proto.hasOwnProperty(property)) {
+                result[property] = obj[property];
+            }
+        });
+    }
+    return result;
+};
+const cloneFilter = (filter) => copyObject(filter);
+/**
+ * @hidden
+ */
+export const cloneFilters = (filter) => {
+    if (!filter) {
+        return;
+    }
+    if (isCompositeFilterDescriptor(filter)) {
+        return {
+            filters: cloneFilters(filter.filters),
+            logic: filter.logic
+        };
+    }
+    else if (Array.isArray(filter)) {
+        return filter.map(cloneFilters);
+    }
+    return cloneFilter(filter);
+};
+/**
+ * @hidden
+ */
+export const diffFilters = (a, b) => {
+    if (isPresent(a) && !isPresent(b)) {
+        return true;
+    }
+    if (!isPresent(a) && isPresent(b)) {
+        return true;
+    }
+    return isPresent(a) && isPresent(b) && isChanged(a.filters, b.filters);
+};

package/esm2015/common/filter-operator.interface.js

@@ -0,0 +1,5 @@
+/**-----------------------------------------------------------------------------------------
+* Copyright © 2021 Progress Software Corporation. All rights reserved.
+* Licensed under commercial license. See LICENSE.md in the project root for more information
+*-------------------------------------------------------------------------------------------*/
+export {};

package/esm2015/common/id.service.js

@@ -0,0 +1,33 @@
+/**-----------------------------------------------------------------------------------------
+* Copyright © 2021 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";
+// Incremented each time the service is instantiated.
+let sequence = 0;
+/**
+ * @hidden
+ */
+export class IdService {
+    constructor() {
+        this.prefix = `k-grid${sequence++}`;
+    }
+    gridId() {
+        return this.prefix;
+    }
+    cellId(rowIndex, colIndex) {
+        return `${this.prefix}-r${rowIndex}c${colIndex}`;
+    }
+    selectionCheckboxId(itemIndex) {
+        return `${this.prefix}-checkbox${itemIndex}`;
+    }
+    selectAllCheckboxId() {
+        return `${this.prefix}-select-all`;
+    }
+}
+IdService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: IdService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+IdService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: IdService });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: IdService, decorators: [{
+            type: Injectable
+        }], ctorParameters: function () { return []; } });

package/esm2015/common/provider.service.js

@@ -0,0 +1,16 @@
+/**-----------------------------------------------------------------------------------------
+* Copyright © 2021 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 ProviderService {
+}
+ProviderService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: ProviderService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+ProviderService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: ProviderService });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: ProviderService, decorators: [{
+            type: Injectable
+        }] });

package/esm2015/common/remove-confirmation.js

@@ -0,0 +1,5 @@
+/**-----------------------------------------------------------------------------------------
+* Copyright © 2021 Progress Software Corporation. All rights reserved.
+* Licensed under commercial license. See LICENSE.md in the project root for more information
+*-------------------------------------------------------------------------------------------*/
+export {};

package/esm2015/common/single-popup.service.js

@@ -0,0 +1,106 @@
+/**-----------------------------------------------------------------------------------------
+* Copyright © 2021 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 { isPresent } from '../utils';
+import { PreventableEvent } from './preventable-event';
+import { Subject } from 'rxjs';
+import * as i0 from "@angular/core";
+import * as i1 from "@progress/kendo-angular-popup";
+import * as i2 from "../scrolling/scroll-sync.service";
+import * as i3 from "@progress/kendo-angular-l10n";
+const contains = (node, predicate) => {
+    while (node) {
+        if (predicate(node)) {
+            return true;
+        }
+        node = node.parentNode;
+    }
+    return false;
+};
+/**
+ * Arguments for the `close` event of the filter and column-menu popup.
+ */
+export class PopupCloseEvent extends PreventableEvent {
+    constructor(e) {
+        super();
+        this.originalEvent = e;
+    }
+}
+const DEFAULT_POPUP_CLASS = 'k-grid-filter-popup';
+/**
+ * The service that is used for the popups of the filter and column menus
+ * ([see example]({% slug reusablecustomfilters_grid %}#toc-filter-menu-with-popup)).
+ */
+export class SinglePopupService {
+    constructor(popupService, renderer, ngZone, scrollSyncService, localization) {
+        this.popupService = popupService;
+        this.renderer = renderer;
+        this.ngZone = ngZone;
+        this.localization = localization;
+        /**
+         * Fires when the filter or column menus are about to close because the user clicked outside their popups.
+         * Used to prevent the popup from closing.
+         */
+        this.onClose = new Subject();
+        this.scrollSubscription = scrollSyncService.changes.subscribe(() => this.destroy());
+    }
+    /**
+     * @hidden
+     */
+    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);
+        }
+        return this.popupRef;
+    }
+    /**
+     * @hidden
+     */
+    destroy() {
+        if (this.popupRef) {
+            this.detachClose();
+            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.destroy();
+                }
+            }
+        }));
+    }
+}
+SinglePopupService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: SinglePopupService, deps: [{ token: i1.PopupService }, { token: i0.Renderer2 }, { token: i0.NgZone }, { token: i2.ScrollSyncService }, { token: i3.LocalizationService }], target: i0.ɵɵFactoryTarget.Injectable });
+SinglePopupService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: SinglePopupService });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: SinglePopupService, decorators: [{
+            type: Injectable
+        }], ctorParameters: function () { return [{ type: i1.PopupService }, { type: i0.Renderer2 }, { type: i0.NgZone }, { type: i2.ScrollSyncService }, { type: i3.LocalizationService }]; } });

package/esm2015/data/change-event-args.interface.js

@@ -0,0 +1,5 @@
+/**-----------------------------------------------------------------------------------------
+* Copyright © 2021 Progress Software Corporation. All rights reserved.
+* Licensed under commercial license. See LICENSE.md in the project root for more information
+*-------------------------------------------------------------------------------------------*/
+export {};