@progress/kendo-angular-pivotgrid 1.0.1 → 1.0.2-dev.202209261139

package/fesm2015/kendo-angular-pivotgrid.js

@@ -38,7 +38,7 @@ const packageMetadata = {
     name: '@progress/kendo-angular-pivotgrid',
     productName: 'Kendo UI for Angular',
     productCodes: ['KENDOUIANGULAR', 'KENDOUICOMPLETE'],
-    publishDate: 1663138494,
+    publishDate: 1664192350,
     version: '',
     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'
 };
@@ -165,8 +165,7 @@ const position = (target, before) => {
     const { offsetWidth, offsetHeight } = target;
     const left = targetRect.left + (before ? 0 : offsetWidth);
     const top = targetRect.top + offsetHeight / 2;
-    const height = offsetHeight;
-    return { left, top, height };
+    return { left, top };
 };
 /**
  * @hidden
@@ -541,11 +540,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
 /**
  * @hidden
  */
-const append = (element) => {
+const append = (element, container) => {
     let appended = false;
     return () => {
         if (!appended) {
-            document.body.appendChild(element);
+            container.appendChild(element);
             appended = true;
         }
         return element;
@@ -557,7 +556,6 @@ const append = (element) => {
 class DropCueService {
     create() {
         this.dom = document.createElement('span');
-        this.dom.style.position = 'absolute';
         const wrapper = document.createElement('div');
         wrapper.classList.add('k-drop-hint', 'k-drop-hint-v');
         const hintStart = document.createElement('div');
@@ -570,25 +568,34 @@ class DropCueService {
         this.dom.append(wrapper);
         this.hide();
     }
-    attach() {
-        return append(this.dom)();
+    attach(container) {
+        return append(this.dom, container)();
     }
-    remove() {
-        if (this.dom && this.dom.parentElement) {
-            document.body.removeChild(this.dom);
+    remove(container) {
+        if (this.dom && this.dom.parentElement && container.contains(this.dom)) {
+            container.removeChild(this.dom);
             this.dom = null;
         }
     }
     hide() {
-        this.dom.style.display = "none";
+        this.dom.style.display = 'none';
     }
-    position({ left, top, height }) {
-        this.dom.style.display = 'block';
-        this.dom.style.height = height + 'px';
-        this.dom.style.top = top + 'px';
-        this.dom.style.zIndex = '1000';
-        const width = this.dom.offsetWidth / 2;
-        this.dom.style.left = left - width + 'px';
+    show(direction, container, target) {
+        if (!this.dom) {
+            this.create();
+        }
+        if (direction === 'before') {
+            container.insertBefore(this.dom, target);
+        }
+        else {
+            if (target.classList.contains('k-chip') && target.matches(':last-child')) {
+                container.insertBefore(this.dom, target);
+                return;
+            }
+            // eslint-disable-next-line no-unused-expressions
+            target.classList.contains('k-chip') ? target.after(this.dom) : container.appendChild(this.dom);
+        }
+        this.dom.style.display = '';
     }
 }
 DropCueService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: DropCueService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
@@ -1683,49 +1690,144 @@ class DropTargetDirective {
         this.subs = new Subscription();
     }
     ngOnInit() {
+        var _a;
         const element = this.element.nativeElement;
-        this.elementType = element.nodeName === 'KENDO-CHIP' ? 'chip' : 'container';
-        this.zone.runOutsideAngular(() => {
-            this.subs.add(this.renderer.listen(element, 'mouseenter', this.handleMouseEnter.bind(this)));
-            this.subs.add(this.renderer.listen(element, 'mousemove', this.handleMouseMove.bind(this)));
-            this.subs.add(this.renderer.listen(element, 'mouseleave', this.handleMouseLeave.bind(this)));
-        });
+        this.elementType = this.getElementType(element);
+        this.elementSectionType = (_a = element.getAttribute('axes')) === null || _a === void 0 ? void 0 : _a.split('Axes')[0];
+        this.subs.add(this.renderer.listen(element, 'mouseenter', this.handleMouseEnter.bind(this)));
+        this.subs.add(this.renderer.listen(element, 'mousemove', this.handleMouseMove.bind(this)));
+        this.subs.add(this.renderer.listen(element, 'mouseleave', this.handleMouseLeave.bind(this)));
     }
     ngOnDestroy() {
         this.subs.unsubscribe();
     }
     handleMouseEnter(event) {
-        if (this.configuratorService.state.dragItem) {
-            if (this.elementType === 'chip') {
+        this.zone.runOutsideAngular(() => {
+            if (this.configuratorService.state.dragItem) {
+                this.configuratorService.dropTargetElement = this.element.nativeElement;
+                if (this.configuratorService.draggedElement && !this.isDropAllowed(this.configuratorService.draggedElement.fromSection)) {
+                    return;
+                }
                 this.configuratorService.parseConfiguratorState({ type: PIVOT_CONFIGURATOR_ACTION.setDropTarget, payload: this.item });
-                this.targetElement = event.target;
-                this.cue.position(position(event.target, this.configuratorService.state.dropDirection === 'before'));
+                this.targetElement = this.elementType === 'header' ? event.target.nextElementSibling : event.target;
+                // eslint-disable-next-line no-unused-expressions
+                this.cue.dom && this.cue.remove(this.getCueContainer());
+                this.cue.create();
+                this.cue.attach(this.getCueContainer());
+                this.configuratorService.parseConfiguratorState({ type: PIVOT_CONFIGURATOR_ACTION.setDropZone, payload: this.axes });
             }
-            this.configuratorService.parseConfiguratorState({ type: PIVOT_CONFIGURATOR_ACTION.setDropZone, payload: this.axes });
-        }
+        });
     }
-    handleMouseMove($event) {
-        if (this.configuratorService.state.dragItem) {
-            if (this.elementType !== 'chip') {
-                return;
-            }
-            if (this.element.nativeElement) {
-                const rect = this.element.nativeElement.getBoundingClientRect();
-                const x = $event.clientX - rect.left;
-                const direction = x < rect.width / 2 ? 'before' : 'after';
-                if ((direction !== this.configuratorService.state.dropDirection) && this.targetElement) {
-                    this.cue.position(position(this.targetElement, direction === 'before'));
+    handleMouseMove(event) {
+        this.zone.runOutsideAngular(() => {
+            var _a;
+            event.stopImmediatePropagation();
+            if (this.configuratorService.state.dragItem) {
+                if (this.configuratorService.draggedElement && !this.isDropAllowed(this.configuratorService.draggedElement.fromSection)) {
+                    this.renderer.setStyle(this.element.nativeElement, 'cursor', 'not-allowed');
+                    return;
+                }
+                this.renderer.setStyle(this.element.nativeElement, 'cursor', 'pointer');
+                const singleOrNoChip = ((_a = this.targetElement) === null || _a === void 0 ? void 0 : _a.querySelectorAll('.k-chip').length) < 2;
+                const isInOwnContainer = this.elementSectionType === this.configuratorService.draggedElement.fromSection;
+                if (!this.targetElement) {
+                    return;
+                }
+                switch (this.elementType) {
+                    case 'chip':
+                        const rect = this.element.nativeElement.getBoundingClientRect();
+                        const x = event.clientX - rect.left;
+                        const direction = x < rect.width / 2 ? 'before' : 'after';
+                        this.cue.show(direction, this.configuratorService.cueContainer, this.targetElement);
+                        if (direction !== this.configuratorService.state.dropDirection) {
+                            this.configuratorService.parseConfiguratorState({ type: PIVOT_CONFIGURATOR_ACTION.setDropDirection, payload: direction });
+                        }
+                        break;
+                    case 'container':
+                    case 'header':
+                        if (singleOrNoChip && isInOwnContainer) {
+                            return;
+                        }
+                        if (isInOwnContainer) {
+                            const draggedElement = this.configuratorService.draggedElement.element;
+                            const nextChip = this.getNextChip(draggedElement);
+                            if (!nextChip) {
+                                this.cue.show('before', this.configuratorService.cueContainer, draggedElement);
+                                if (this.configuratorService.state.dropDirection !== 'before') {
+                                    this.configuratorService.parseConfiguratorState({ type: PIVOT_CONFIGURATOR_ACTION.setDropDirection, payload: 'before' });
+                                }
+                                return;
+                            }
+                            const isVertical = this.configuratorService.orientation === 'vertical';
+                            if (!isPresent(this.nextChipOffset)) {
+                                this.nextChipOffset = isVertical ? nextChip.getBoundingClientRect().left : nextChip.getBoundingClientRect().top;
+                            }
+                            const isBefore = isVertical ? event.clientX < this.nextChipOffset : event.clientY < this.nextChipOffset;
+                            if (isBefore) {
+                                this.cue.show('after', this.configuratorService.cueContainer, draggedElement);
+                                return;
+                            }
+                        }
+                        if (this.configuratorService.state.dropDirection !== 'after') {
+                            this.configuratorService.parseConfiguratorState({ type: PIVOT_CONFIGURATOR_ACTION.setDropDirection, payload: 'after' });
+                        }
+                        this.cue.show('after', this.configuratorService.cueContainer, this.targetElement);
+                        break;
+                    default:
                 }
-                this.configuratorService.parseConfiguratorState({ type: PIVOT_CONFIGURATOR_ACTION.setDropDirection, payload: direction });
             }
-        }
+        });
     }
-    handleMouseLeave() {
-        if (this.elementType === 'chip') {
+    handleMouseLeave(event) {
+        this.renderer.removeStyle(this.element.nativeElement, 'cursor');
+        if (!this.configuratorService.draggedElement) {
             return;
         }
-        if (this.configuratorService.state.dragItem) {
-            this.configuratorService.parseConfiguratorState({ type: PIVOT_CONFIGURATOR_ACTION.setDropZone, payload: null });
+        this.zone.runOutsideAngular(() => {
+            event.stopImmediatePropagation();
+            this.configuratorService.dropTargetElement = null;
+            this.cue.remove(this.getCueContainer());
+            if (this.elementType === 'chip') {
+                return;
+            }
+            if (this.configuratorService.state.dragItem) {
+                this.configuratorService.parseConfiguratorState({ type: PIVOT_CONFIGURATOR_ACTION.setDropZone, payload: null });
+            }
+        });
+    }
+    isDropAllowed(fromSection) {
+        const element = this.element.nativeElement;
+        const fromRowsOrColsToMeasures = (fromSection === 'row' || fromSection === 'column') && element.closest('[axes=measureAxes]');
+        const fromMeasuresToRowsOrCols = fromSection === 'measure' && (element.closest('[axes=rowAxes]') || element.closest('[axes=columnAxes]'));
+        return !(fromRowsOrColsToMeasures || fromMeasuresToRowsOrCols);
+    }
+    getElementType(element) {
+        return {
+            'KENDO-CHIP': 'chip',
+            'KENDO-CHIPLIST': 'container',
+            'DIV': 'header'
+        }[element.tagName];
+    }
+    getCueContainer() {
+        const element = this.element.nativeElement;
+        const cueContainer = {
+            chip: element.parentElement,
+            container: element,
+            header: element.classList.contains('k-settings-description') ? element : element.nextElementSibling
+        }[this.elementType];
+        this.configuratorService.cueContainer = cueContainer;
+        return cueContainer;
+    }
+    getNextChip(draggedElement) {
+        let nextChip = draggedElement.nextElementSibling;
+        if (nextChip && nextChip.matches('.k-chip')) {
+            return nextChip;
+        }
+        while (nextChip) {
+            nextChip = nextChip.nextElementSibling;
+            if (nextChip === null || nextChip.matches('.k-chip')) {
+                return nextChip;
+            }
         }
     }
 }
@@ -1746,12 +1848,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
  * @hidden
  */
 class DraggableChipDirective {
-    constructor(draggable, element, zone, service, cue) {
+    constructor(draggable, element, zone, service, cue, renderer) {
         this.draggable = draggable;
         this.element = element;
         this.zone = zone;
         this.service = service;
         this.cue = cue;
+        this.renderer = renderer;
         this.touchActions = 'none';
         this.initialX = {};
         this.initialY = {};
@@ -1761,52 +1864,70 @@ class DraggableChipDirective {
         return this.drag ? 'none' : undefined;
     }
     ngOnInit() {
-        this.zone.runOutsideAngular(() => this.subs.add(this.draggable.kendoPress
-            .subscribe((event) => {
-            if (isDocumentAvailable()) {
-                this.cue.create();
-                this.cue.attach();
-                this.initialX.current = event.clientX;
-                this.initialY.current = event.clientY;
-            }
-        })));
-        this.zone.runOutsideAngular(() => this.subs.add(this.draggable.kendoDrag
+        this.subs.add(this.draggable.kendoPress
             .subscribe((event) => {
-            if (isDocumentAvailable()) {
-                if (Math.abs(this.initialX.current - event.clientX) < 10 &&
-                    Math.abs(this.initialY.current - event.clientY) < 10) {
-                    return;
+            this.zone.runOutsideAngular(() => {
+                if (isDocumentAvailable()) {
+                    this.initialX.current = event.clientX;
+                    this.initialY.current = event.clientY;
+                    const element = this.element.nativeElement;
+                    this.renderer.setStyle(element, 'z-index', 1);
+                    this.service.parseConfiguratorState({ type: PIVOT_CONFIGURATOR_ACTION.setDragItem, payload: this.item });
+                    this.service.draggedElement = {
+                        element,
+                        fromSection: element.closest('.k-chip-list').getAttribute('axes').split('Axes')[0]
+                    };
                 }
-                if (this.element.nativeElement) {
-                    this.element.nativeElement.style.transform = `translate(${event.clientX - this.initialX.current}px, ${event.clientY - this.initialY.current}px)`;
+            });
+        }));
+        this.subs.add(this.draggable.kendoDrag
+            .subscribe((event) => {
+            this.zone.runOutsideAngular(() => {
+                var _a;
+                if (isDocumentAvailable()) {
+                    const isDragging = Math.abs(this.initialX.current - event.clientX) > 5 ||
+                        Math.abs(this.initialY.current - event.clientY) > 5;
+                    if (!isDragging) {
+                        return;
+                    }
+                    this.drag = true;
+                    if (!((_a = document.elementFromPoint(event.clientX, event.clientY)) === null || _a === void 0 ? void 0 : _a.closest('.k-pivotgrid-configurator [kendodroptarget]'))) {
+                        return;
+                    }
+                    this.renderer.setStyle(this.element.nativeElement, 'transform', `translate(${event.clientX - this.initialX.current}px, ${event.clientY - this.initialY.current}px)`);
                 }
-            }
-            this.drag = true;
-            this.service.parseConfiguratorState({ type: PIVOT_CONFIGURATOR_ACTION.setDragItem, payload: this.item });
-        })));
-        this.zone.runOutsideAngular(() => this.subs.add(this.draggable.kendoRelease
+            });
+        }));
+        this.subs.add(this.draggable.kendoRelease
             .subscribe(() => {
-            this.drag = false;
-            if (this.service.state.dragItem) {
-                if (isDocumentAvailable()) {
-                    if (this.element.nativeElement) {
-                        this.element.nativeElement.style.transform = '';
+            this.zone.runOutsideAngular(() => {
+                this.drag = false;
+                if (this.service.state.dragItem) {
+                    const element = this.element.nativeElement;
+                    if (isDocumentAvailable()) {
+                        this.renderer.removeStyle(element, 'transform');
+                        this.cue.remove(this.service.cueContainer);
+                    }
+                    this.service.parseConfiguratorState({ type: PIVOT_CONFIGURATOR_ACTION.drop, payload: this.item });
+                    this.service.state.dragItem = null;
+                    this.service.state.dropDirection = null;
+                    this.service.state.dropTarget = null;
+                    this.service.state.dropZone = null;
+                    this.renderer.removeStyle(element, 'z-index');
+                    this.service.draggedElement = null;
+                    if (this.service.dropTargetElement) {
+                        this.renderer.removeStyle(this.service.dropTargetElement, 'cursor');
+                        this.service.dropTargetElement = null;
                     }
-                    this.cue.remove();
                 }
-                this.service.parseConfiguratorState({ type: PIVOT_CONFIGURATOR_ACTION.drop, payload: this.item });
-                this.service.state.dragItem = null;
-                this.service.state.dropDirection = null;
-                this.service.state.dropTarget = null;
-                this.service.state.dropZone = null;
-            }
-        })));
+            });
+        }));
     }
     ngOnDestroy() {
         this.subs.unsubscribe();
     }
 }
-DraggableChipDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: DraggableChipDirective, deps: [{ token: i3.DraggableDirective, optional: true }, { token: i0.ElementRef }, { token: i0.NgZone }, { token: ConfiguratorService }, { token: DropCueService }], target: i0.ɵɵFactoryTarget.Directive });
+DraggableChipDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: DraggableChipDirective, deps: [{ token: i3.DraggableDirective, optional: true }, { token: i0.ElementRef }, { token: i0.NgZone }, { token: ConfiguratorService }, { token: DropCueService }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Directive });
 DraggableChipDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.16", type: DraggableChipDirective, selector: "[kendoChipDraggable]", inputs: { item: "item" }, host: { properties: { "style.pointerEvents": "this.pointerEvents", "style.touch-action": "this.touchActions" } }, ngImport: i0 });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: DraggableChipDirective, decorators: [{
             type: Directive,
@@ -1815,7 +1936,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
                 }]
         }], ctorParameters: function () { return [{ type: i3.DraggableDirective, decorators: [{
                     type: Optional
-                }] }, { type: i0.ElementRef }, { type: i0.NgZone }, { type: ConfiguratorService }, { type: DropCueService }]; }, propDecorators: { pointerEvents: [{
+                }] }, { type: i0.ElementRef }, { type: i0.NgZone }, { type: ConfiguratorService }, { type: DropCueService }, { type: i0.Renderer2 }]; }, propDecorators: { pointerEvents: [{
                 type: HostBinding,
                 args: ['style.pointerEvents']
             }], touchActions: [{
@@ -1873,7 +1994,7 @@ class PivotGridConfiguratorComponent {
         this.subs.add(this.configuratorService.configuratorStateChange
             .subscribe(res => {
             this.state = res;
-            this.dataService.state = this.dataService.state = {
+            this.dataService.state = {
                 columnAxes: res.columnAxes,
                 rowAxes: res.rowAxes,
                 measureAxes: res.measureAxes,
@@ -1886,6 +2007,11 @@ class PivotGridConfiguratorComponent {
     ngOnDestroy() {
         this.subs.unsubscribe();
     }
+    ngOnChanges(changes) {
+        if (changes.orientation) {
+            this.configuratorService.orientation = this.orientation;
+        }
+    }
     getName(name) {
         return name.toString();
     }
@@ -2033,7 +2159,7 @@ PivotGridConfiguratorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "
         ConfiguratorService,
         DropCueService,
         SinglePopupService
-    ], ngImport: i0, template: `
+    ], usesOnChanges: true, ngImport: i0, template: `
         <div 
             class="k-pivotgrid-configurator-panel k-pivotgrid-configurator-push"
             [ngClass]="{
@@ -2187,7 +2313,7 @@ PivotGridConfiguratorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "
                 <button kendoButton themeColor="primary" type="button" (click)="handleSubmit()">{{messageFor('configuratorApplyButtonText')}}</button>
             </div>
         </div>
-   `, isInline: true, styles: ["\n        .k-form .k-chip-list {\n            width: 100%;\n        }\n   "], components: [{ type: i4.TreeViewComponent, selector: "kendo-treeview", inputs: ["filterInputPlaceholder", "expandDisabledNodes", "animate", "nodeTemplate", "loadMoreButtonTemplate", "trackBy", "nodes", "textField", "hasChildren", "isChecked", "isDisabled", "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"] }, { type: i5.ChipListComponent, selector: "kendo-chiplist, kendo-chip-list", inputs: ["selection", "size"], outputs: ["selectedChange", "remove"] }, { type: i5.ChipComponent, selector: "kendo-chip", inputs: ["label", "icon", "iconClass", "avatarClass", "selected", "removable", "removeIcon", "disabled", "size", "rounded", "fillMode", "themeColor"], outputs: ["remove", "contentClick"] }, { type: ChipMenuComponent, selector: "kendo-pivot-chip-menu", inputs: ["chip", "tabIndex"] }], directives: [{ type: i7.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i4.ExpandDirective, selector: "[kendoTreeViewExpandable]", inputs: ["isExpanded", "expandBy", "expandOnFilter", "expandedKeys"], outputs: ["expandedKeysChange"] }, { type: i4.NodeTemplateDirective, selector: "[kendoTreeViewNodeTemplate]" }, { type: i7.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i6.CheckBoxDirective, selector: "input[kendoCheckBox]", inputs: ["size", "rounded"] }, { type: i7.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: DropTargetDirective, selector: "[kendoDropTarget]", inputs: ["item", "axes"] }, { type: i7.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: DraggableChipDirective, selector: "[kendoChipDraggable]", inputs: ["item"] }, { type: i3.DraggableDirective, selector: "[kendoDraggable]", inputs: ["enableDrag"], outputs: ["kendoPress", "kendoDrag", "kendoRelease"] }, { type: i5.ButtonDirective, selector: "button[kendoButton], span[kendoButton]", inputs: ["toggleable", "togglable", "selected", "tabIndex", "icon", "iconClass", "imageUrl", "disabled", "size", "rounded", "fillMode", "themeColor", "role", "primary", "look"], outputs: ["selectedChange", "click"], exportAs: ["kendoButton"] }] });
+   `, isInline: true, styles: ["\n        .k-form .k-chip-list {\n            width: 100%;\n        }\n\n        .k-form .k-form-field,\n        .k-form .k-settings-description {\n            padding-top: 1em;\n            margin-top: 0;\n        }\n\n        .k-form.k-form-horizontal .k-form-field,\n        .k-form.k-form-horizontal .k-chip-list {\n            padding-top: 0;\n            padding-left: 16px;\n        }\n\n        .k-form.k-form-horizontal .k-form-field-wrapper {\n            padding-left: 0;\n        }\n   "], components: [{ type: i4.TreeViewComponent, selector: "kendo-treeview", inputs: ["filterInputPlaceholder", "expandDisabledNodes", "animate", "nodeTemplate", "loadMoreButtonTemplate", "trackBy", "nodes", "textField", "hasChildren", "isChecked", "isDisabled", "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"] }, { type: i5.ChipListComponent, selector: "kendo-chiplist, kendo-chip-list", inputs: ["selection", "size"], outputs: ["selectedChange", "remove"] }, { type: i5.ChipComponent, selector: "kendo-chip", inputs: ["label", "icon", "iconClass", "avatarClass", "selected", "removable", "removeIcon", "disabled", "size", "rounded", "fillMode", "themeColor"], outputs: ["remove", "contentClick"] }, { type: ChipMenuComponent, selector: "kendo-pivot-chip-menu", inputs: ["chip", "tabIndex"] }], directives: [{ type: i7.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i4.ExpandDirective, selector: "[kendoTreeViewExpandable]", inputs: ["isExpanded", "expandBy", "expandOnFilter", "expandedKeys"], outputs: ["expandedKeysChange"] }, { type: i4.NodeTemplateDirective, selector: "[kendoTreeViewNodeTemplate]" }, { type: i7.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i6.CheckBoxDirective, selector: "input[kendoCheckBox]", inputs: ["size", "rounded"] }, { type: i7.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: DropTargetDirective, selector: "[kendoDropTarget]", inputs: ["item", "axes"] }, { type: i7.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: DraggableChipDirective, selector: "[kendoChipDraggable]", inputs: ["item"] }, { type: i3.DraggableDirective, selector: "[kendoDraggable]", inputs: ["enableDrag"], outputs: ["kendoPress", "kendoDrag", "kendoRelease"] }, { type: i5.ButtonDirective, selector: "button[kendoButton], span[kendoButton]", inputs: ["toggleable", "togglable", "selected", "tabIndex", "icon", "iconClass", "imageUrl", "disabled", "size", "rounded", "fillMode", "themeColor", "role", "primary", "look"], outputs: ["selectedChange", "click"], exportAs: ["kendoButton"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: PivotGridConfiguratorComponent, decorators: [{
             type: Component,
             args: [{
@@ -2356,6 +2482,22 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImpo
         .k-form .k-chip-list {
             width: 100%;
         }
+
+        .k-form .k-form-field,
+        .k-form .k-settings-description {
+            padding-top: 1em;
+            margin-top: 0;
+        }
+
+        .k-form.k-form-horizontal .k-form-field,
+        .k-form.k-form-horizontal .k-chip-list {
+            padding-top: 0;
+            padding-left: 16px;
+        }
+
+        .k-form.k-form-horizontal .k-form-field-wrapper {
+            padding-left: 0;
+        }
    `]
                 }]
         }], ctorParameters: function () { return [{ type: PivotGridDataService }, { type: i1.LocalizationService }, { type: ConfiguratorService }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { hostClass: [{

package/main.d.ts

@@ -18,4 +18,6 @@ export { PivotDataRowItem } from './models/data-row-item';
 export { ConfiguratorSettings } from './models/configurator-settings';
 export { PivotGridConfiguratorPosition } from './models/configurator-position';
 export { PivotGridConfiguratorOrientation } from './models/configurator-orientation';
+export { DropTargetType } from './models/drop-target';
+export { DropSectionType } from './models/drop-section';
 export { PivotGridAxis, PivotGridField, AxisDataItem, DimensionField, HierarchyField, KPIField, KPIMeasureField, LevelField, MeasureField, MemberField, PivotDataItem, sumAggregate, averageAggregate, minAggregate, maxAggregate, Aggregate, Dimension, Measure } from '@progress/kendo-pivotgrid-common';

package/models/drop-section.d.ts

@@ -0,0 +1,8 @@
+/**-----------------------------------------------------------------------------------------
+* Copyright © 2021 Progress Software Corporation. All rights reserved.
+* Licensed under commercial license. See LICENSE.md in the project root for more information
+*-------------------------------------------------------------------------------------------*/
+/**
+ * @hidden
+ */
+export declare type DropSectionType = 'column' | 'row' | 'measure';

package/models/drop-target.d.ts

@@ -0,0 +1,8 @@
+/**-----------------------------------------------------------------------------------------
+* Copyright © 2021 Progress Software Corporation. All rights reserved.
+* Licensed under commercial license. See LICENSE.md in the project root for more information
+*-------------------------------------------------------------------------------------------*/
+/**
+ * @hidden
+ */
+export declare type DropTargetType = 'chip' | 'container' | 'header';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@progress/kendo-angular-pivotgrid",
-  "version": "1.0.1",
+  "version": "1.0.2-dev.202209261139",
   "description": "PivotGrid package for Angular",
   "license": "SEE LICENSE IN LICENSE.md",
   "author": "Progress",

package/util.d.ts

@@ -49,7 +49,6 @@ export declare const matchAriaAttributes: (wrapper: Element) => void;
 export declare const position: (target: any, before: any) => {
     left: any;
     top: number;
-    height: any;
 };
 /**
  * @hidden