@lemon-fe/components 0.1.153 → 1.1.0-alpha.0

package/es/data-grid/modules/row-grouping/rowGrouping/columnDropZones/dropZoneColumnComp.js

@@ -0,0 +1,367 @@
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, _toPropertyKey(descriptor.key), descriptor); } }
+function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, "prototype", { writable: false }); return Constructor; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
+function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); Object.defineProperty(subClass, "prototype", { writable: false }); if (superClass) _setPrototypeOf(subClass, superClass); }
+function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
+function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
+function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } else if (call !== void 0) { throw new TypeError("Derived constructors may only return object or undefined"); } return _assertThisInitialized(self); }
+function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
+function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
+function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf.bind() : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+var __decorate = this && this.__decorate || function (decorators, target, key, desc) {
+  var c = arguments.length,
+    r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc,
+    d;
+  if ((typeof Reflect === "undefined" ? "undefined" : _typeof(Reflect)) === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+  return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+import { DragSourceType, Component, Autowired, Events, TouchListener, DragAndDropService, PostConstruct, Column, RefSelector, Optional, VirtualList, KeyCode, _ } from "@ag-grid-community/core";
+export var DropZoneColumnComp = /*#__PURE__*/function (_Component) {
+  _inherits(DropZoneColumnComp, _Component);
+  var _super = _createSuper(DropZoneColumnComp);
+  function DropZoneColumnComp(column, dragSourceDropTarget, ghost, dropZonePurpose, horizontal) {
+    var _this;
+    _classCallCheck(this, DropZoneColumnComp);
+    _this = _super.call(this);
+    _this.column = column;
+    _this.dragSourceDropTarget = dragSourceDropTarget;
+    _this.ghost = ghost;
+    _this.dropZonePurpose = dropZonePurpose;
+    _this.horizontal = horizontal;
+    _this.popupShowing = false;
+    return _this;
+  }
+  _createClass(DropZoneColumnComp, [{
+    key: "init",
+    value: function init() {
+      var _this2 = this;
+      this.setTemplate(DropZoneColumnComp.TEMPLATE);
+      var eGui = this.getGui();
+      var isFunctionsReadOnly = this.gridOptionsService.is('functionsReadOnly');
+      this.addElementClasses(eGui);
+      this.addElementClasses(this.eDragHandle, 'drag-handle');
+      this.addElementClasses(this.eText, 'text');
+      this.addElementClasses(this.eButton, 'button');
+      this.eDragHandle.appendChild(_.createIconNoSpan('columnDrag', this.gridOptionsService));
+      this.eButton.appendChild(_.createIconNoSpan('cancel', this.gridOptionsService));
+      this.setupSort();
+      this.displayName = this.columnModel.getDisplayNameForColumn(this.column, 'columnDrop');
+      this.setupComponents();
+      if (!this.ghost && !isFunctionsReadOnly) {
+        this.addDragSource();
+      }
+      this.setupAria();
+      this.addManagedListener(this.eventService, Column.EVENT_SORT_CHANGED, function () {
+        _this2.setupAria();
+      });
+      this.setupTooltip();
+    }
+  }, {
+    key: "setupAria",
+    value: function setupAria() {
+      var translate = this.localeService.getLocaleTextFunc();
+      var _this$getColumnAndAgg = this.getColumnAndAggFuncName(),
+        name = _this$getColumnAndAgg.name,
+        aggFuncName = _this$getColumnAndAgg.aggFuncName;
+      var aggSeparator = translate('ariaDropZoneColumnComponentAggFuncSeperator', ' of ');
+      var sortDirection = {
+        asc: translate('ariaDropZoneColumnComponentSortAscending', 'ascending'),
+        desc: translate('ariaDropZoneColumnComponentSortDescending', 'descending')
+      };
+      var columnSort = this.column.getSort();
+      var isSortSuppressed = this.gridOptionsService.is('rowGroupPanelSuppressSort');
+      var ariaInstructions = [[aggFuncName && "".concat(aggFuncName).concat(aggSeparator), name, this.isGroupingZone() && !isSortSuppressed && columnSort && ", ".concat(sortDirection[columnSort])].filter(function (part) {
+        return !!part;
+      }).join('')];
+      var isFunctionsReadOnly = this.gridOptionsService.is('functionsReadOnly');
+      if (this.isAggregationZone() && !isFunctionsReadOnly) {
+        var aggregationMenuAria = translate('ariaDropZoneColumnValueItemDescription', 'Press ENTER to change the aggregation type');
+        ariaInstructions.push(aggregationMenuAria);
+      }
+      if (this.isGroupingZone() && this.column.getColDef().sortable && !isSortSuppressed) {
+        var sortProgressAria = translate('ariaDropZoneColumnGroupItemDescription', 'Press ENTER to sort');
+        ariaInstructions.push(sortProgressAria);
+      }
+      var deleteAria = translate('ariaDropZoneColumnComponentDescription', 'Press DELETE to remove');
+      ariaInstructions.push(deleteAria);
+      _.setAriaLabel(this.getGui(), ariaInstructions.join('. '));
+    }
+  }, {
+    key: "setupTooltip",
+    value: function setupTooltip() {
+      var _this3 = this;
+      var refresh = function refresh() {
+        var newTooltipText = _this3.column.getColDef().headerTooltip;
+        _this3.setTooltip(newTooltipText);
+      };
+      refresh();
+      this.addManagedListener(this.eventService, Events.EVENT_NEW_COLUMNS_LOADED, refresh);
+    }
+  }, {
+    key: "setupSort",
+    value: function setupSort() {
+      var _this4 = this;
+      var canSort = this.column.getColDef().sortable;
+      var isGroupingZone = this.isGroupingZone();
+      if (!canSort || !isGroupingZone) {
+        return;
+      }
+      if (!this.gridOptionsService.is('rowGroupPanelSuppressSort')) {
+        this.eSortIndicator.setupSort(this.column, true);
+        var performSort = function performSort(event) {
+          event.preventDefault();
+          var sortUsingCtrl = _this4.gridOptionsService.get('multiSortKey') === 'ctrl';
+          var multiSort = sortUsingCtrl ? event.ctrlKey || event.metaKey : event.shiftKey;
+          _this4.sortController.progressSort(_this4.column, multiSort, 'uiColumnSorted');
+        };
+        this.addGuiEventListener('click', performSort);
+        this.addGuiEventListener('keydown', function (e) {
+          var isEnter = e.key === KeyCode.ENTER;
+          if (isEnter && _this4.isGroupingZone()) {
+            performSort(e);
+          }
+        });
+      }
+    }
+  }, {
+    key: "addDragSource",
+    value: function addDragSource() {
+      var _this5 = this;
+      var dragSource = {
+        type: DragSourceType.ToolPanel,
+        eElement: this.eDragHandle,
+        defaultIconName: DragAndDropService.ICON_HIDE,
+        getDragItem: function getDragItem() {
+          return _this5.createDragItem();
+        },
+        dragItemName: this.displayName,
+        dragSourceDropTarget: this.dragSourceDropTarget
+      };
+      this.dragAndDropService.addDragSource(dragSource, true);
+      this.addDestroyFunc(function () {
+        return _this5.dragAndDropService.removeDragSource(dragSource);
+      });
+    }
+  }, {
+    key: "createDragItem",
+    value: function createDragItem() {
+      var visibleState = {};
+      visibleState[this.column.getId()] = this.column.isVisible();
+      return {
+        columns: [this.column],
+        visibleState: visibleState
+      };
+    }
+  }, {
+    key: "setupComponents",
+    value: function setupComponents() {
+      this.setTextValue();
+      this.setupRemove();
+      if (this.ghost) {
+        this.addCssClass('ag-column-drop-cell-ghost');
+      }
+      if (this.isAggregationZone() && !this.gridOptionsService.is('functionsReadOnly')) {
+        this.addGuiEventListener('click', this.onShowAggFuncSelection.bind(this));
+      }
+    }
+  }, {
+    key: "setupRemove",
+    value: function setupRemove() {
+      var _this6 = this;
+      _.setDisplayed(this.eButton, !this.gridOptionsService.is('functionsReadOnly'));
+      var agEvent = {
+        type: DropZoneColumnComp.EVENT_COLUMN_REMOVE
+      };
+      this.addGuiEventListener('keydown', function (e) {
+        var isEnter = e.key === KeyCode.ENTER;
+        var isDelete = e.key === KeyCode.DELETE;
+        if (isDelete) {
+          e.preventDefault();
+          _this6.dispatchEvent(agEvent);
+        }
+        if (isEnter && _this6.isAggregationZone() && !_this6.gridOptionsService.is('functionsReadOnly')) {
+          e.preventDefault();
+          _this6.onShowAggFuncSelection();
+        }
+      });
+      this.addManagedListener(this.eButton, 'click', function (mouseEvent) {
+        _this6.dispatchEvent(agEvent);
+        mouseEvent.stopPropagation();
+      });
+      var touchListener = new TouchListener(this.eButton);
+      this.addManagedListener(touchListener, TouchListener.EVENT_TAP, function () {
+        _this6.dispatchEvent(agEvent);
+      });
+      this.addDestroyFunc(touchListener.destroy.bind(touchListener));
+    }
+  }, {
+    key: "getColumnAndAggFuncName",
+    value: function getColumnAndAggFuncName() {
+      var name = this.displayName;
+      var aggFuncName = '';
+      if (this.isAggregationZone()) {
+        var aggFunc = this.column.getAggFunc();
+        // if aggFunc is a string, we can use it, but if it's a function, then we swap with 'func'
+        var aggFuncString = typeof aggFunc === 'string' ? aggFunc : 'agg';
+        var localeTextFunc = this.localeService.getLocaleTextFunc();
+        aggFuncName = localeTextFunc(aggFuncString, aggFuncString);
+      }
+      return {
+        name: name,
+        aggFuncName: aggFuncName
+      };
+    }
+  }, {
+    key: "setTextValue",
+    value: function setTextValue() {
+      var _this$getColumnAndAgg2 = this.getColumnAndAggFuncName(),
+        name = _this$getColumnAndAgg2.name,
+        aggFuncName = _this$getColumnAndAgg2.aggFuncName;
+      var displayValue = this.isAggregationZone() ? "".concat(aggFuncName, "(").concat(name, ")") : name;
+      var displayValueSanitised = _.escapeString(displayValue);
+      this.eText.innerHTML = displayValueSanitised;
+    }
+  }, {
+    key: "onShowAggFuncSelection",
+    value: function onShowAggFuncSelection() {
+      var _this7 = this;
+      if (this.popupShowing) {
+        return;
+      }
+      this.popupShowing = true;
+      var virtualList = new VirtualList('select-agg-func');
+      var rows = this.aggFuncService.getFuncNames(this.column);
+      var eGui = this.getGui();
+      var virtualListGui = virtualList.getGui();
+      virtualList.setModel({
+        getRow: function getRow(index) {
+          return rows[index];
+        },
+        getRowCount: function getRowCount() {
+          return rows.length;
+        }
+      });
+      this.getContext().createBean(virtualList);
+      var ePopup = _.loadTemplate( /* html*/"<div class=\"ag-select-agg-func-popup\"></div>");
+      ePopup.style.top = '0px';
+      ePopup.style.left = '0px';
+      ePopup.appendChild(virtualListGui);
+      // ePopup.style.height = this.gridOptionsService.getAggFuncPopupHeight() + 'px';
+      ePopup.style.width = "".concat(eGui.clientWidth, "px");
+      var popupHiddenFunc = function popupHiddenFunc() {
+        _this7.destroyBean(virtualList);
+        _this7.popupShowing = false;
+        eGui.focus();
+      };
+      var translate = this.localeService.getLocaleTextFunc();
+      var addPopupRes = this.popupService.addPopup({
+        modal: true,
+        eChild: ePopup,
+        closeOnEsc: true,
+        closedCallback: popupHiddenFunc,
+        ariaLabel: translate('ariaLabelAggregationFunction', 'Aggregation Function')
+      });
+      if (addPopupRes) {
+        virtualList.setComponentCreator(this.createAggSelect.bind(this, addPopupRes.hideFunc));
+      }
+      virtualList.addGuiEventListener('keydown', function (e) {
+        if (e.key === KeyCode.ENTER || e.key === KeyCode.SPACE) {
+          var row = virtualList.getLastFocusedRow();
+          if (row == null) {
+            return;
+          }
+          var comp = virtualList.getComponentAt(row);
+          if (comp) {
+            comp.selectItem();
+          }
+        }
+      });
+      this.popupService.positionPopupByComponent({
+        type: 'aggFuncSelect',
+        eventSource: eGui,
+        ePopup: ePopup,
+        keepWithinBounds: true,
+        column: this.column,
+        position: 'under'
+      });
+      virtualList.refresh();
+      var rowToFocus = rows.findIndex(function (r) {
+        return r === _this7.column.getAggFunc();
+      });
+      if (rowToFocus === -1) {
+        rowToFocus = 0;
+      }
+      virtualList.focusRow(rowToFocus);
+    }
+  }, {
+    key: "createAggSelect",
+    value: function createAggSelect(hidePopup, value) {
+      var _this8 = this;
+      var itemSelected = function itemSelected() {
+        hidePopup();
+        if (_this8.gridOptionsService.is('functionsPassive')) {
+          var event = {
+            type: Events.EVENT_COLUMN_AGG_FUNC_CHANGE_REQUEST,
+            columns: [_this8.column],
+            aggFunc: value
+          };
+          _this8.eventService.dispatchEvent(event);
+        } else {
+          _this8.columnModel.setColumnAggFunc(_this8.column, value, "toolPanelDragAndDrop");
+        }
+      };
+      var localeTextFunc = this.localeService.getLocaleTextFunc();
+      var aggFuncString = value.toString();
+      var aggFuncStringTranslated = localeTextFunc(aggFuncString, aggFuncString);
+      var comp = new AggItemComp(itemSelected, aggFuncStringTranslated);
+      return comp;
+    }
+  }, {
+    key: "addElementClasses",
+    value: function addElementClasses(el, suffix) {
+      suffix = suffix ? "-".concat(suffix) : '';
+      var direction = this.horizontal ? 'horizontal' : 'vertical';
+      el.classList.add("ag-column-drop-cell".concat(suffix), "ag-column-drop-".concat(direction, "-cell").concat(suffix));
+    }
+  }, {
+    key: "isAggregationZone",
+    value: function isAggregationZone() {
+      return this.dropZonePurpose === 'aggregation';
+    }
+  }, {
+    key: "isGroupingZone",
+    value: function isGroupingZone() {
+      return this.dropZonePurpose === 'rowGroup';
+    }
+  }]);
+  return DropZoneColumnComp;
+}(Component);
+DropZoneColumnComp.EVENT_COLUMN_REMOVE = 'columnRemove';
+DropZoneColumnComp.TEMPLATE = "<span role=\"option\" tabindex=\"0\">\n          <span ref=\"eDragHandle\" class=\"ag-drag-handle ag-column-drop-cell-drag-handle\" role=\"presentation\"></span>\n          <span ref=\"eText\" class=\"ag-column-drop-cell-text\" aria-hidden=\"true\"></span>\n          <ag-sort-indicator ref=\"eSortIndicator\"></ag-sort-indicator>\n          <span ref=\"eButton\" class=\"ag-column-drop-cell-button\" role=\"presentation\"></span>\n        </span>";
+__decorate([Autowired('dragAndDropService')], DropZoneColumnComp.prototype, "dragAndDropService", void 0);
+__decorate([Autowired('columnModel')], DropZoneColumnComp.prototype, "columnModel", void 0);
+__decorate([Autowired('popupService')], DropZoneColumnComp.prototype, "popupService", void 0);
+__decorate([Optional('aggFuncService')], DropZoneColumnComp.prototype, "aggFuncService", void 0);
+__decorate([Autowired('sortController')], DropZoneColumnComp.prototype, "sortController", void 0);
+__decorate([RefSelector('eText')], DropZoneColumnComp.prototype, "eText", void 0);
+__decorate([RefSelector('eDragHandle')], DropZoneColumnComp.prototype, "eDragHandle", void 0);
+__decorate([RefSelector('eButton')], DropZoneColumnComp.prototype, "eButton", void 0);
+__decorate([RefSelector('eSortIndicator')], DropZoneColumnComp.prototype, "eSortIndicator", void 0);
+__decorate([PostConstruct], DropZoneColumnComp.prototype, "init", null);
+var AggItemComp = /*#__PURE__*/function (_Component2) {
+  _inherits(AggItemComp, _Component2);
+  var _super2 = _createSuper(AggItemComp);
+  function AggItemComp(itemSelected, value) {
+    var _this9;
+    _classCallCheck(this, AggItemComp);
+    _this9 = _super2.call(this, /* html */"<div class=\"ag-select-agg-func-item\"/>");
+    _this9.selectItem = itemSelected;
+    _this9.getGui().innerText = value;
+    _this9.addGuiEventListener('click', _this9.selectItem);
+    return _this9;
+  }
+  return _createClass(AggItemComp);
+}(Component);

package/es/data-grid/modules/row-grouping/rowGrouping/columnDropZones/gridHeaderDropZones.d.ts

@@ -0,0 +1,11 @@
+import { Component } from "@ag-grid-community/core";
+export declare class GridHeaderDropZones extends Component {
+    private columnModel;
+    private rowGroupComp;
+    private pivotComp;
+    constructor();
+    private postConstruct;
+    private createNorthPanel;
+    private onDropPanelVisible;
+    private onRowGroupChanged;
+}

package/es/data-grid/modules/row-grouping/rowGrouping/columnDropZones/gridHeaderDropZones.js

@@ -0,0 +1,85 @@
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, _toPropertyKey(descriptor.key), descriptor); } }
+function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, "prototype", { writable: false }); return Constructor; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
+function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); Object.defineProperty(subClass, "prototype", { writable: false }); if (superClass) _setPrototypeOf(subClass, superClass); }
+function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
+function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
+function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } else if (call !== void 0) { throw new TypeError("Derived constructors may only return object or undefined"); } return _assertThisInitialized(self); }
+function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
+function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
+function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf.bind() : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+var __decorate = this && this.__decorate || function (decorators, target, key, desc) {
+  var c = arguments.length,
+    r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc,
+    d;
+  if ((typeof Reflect === "undefined" ? "undefined" : _typeof(Reflect)) === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+  return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+import { Autowired, Component, Events, PostConstruct, _ } from "@ag-grid-community/core";
+import { RowGroupDropZonePanel } from "./rowGroupDropZonePanel";
+import { PivotDropZonePanel } from "./pivotDropZonePanel";
+export var GridHeaderDropZones = /*#__PURE__*/function (_Component) {
+  _inherits(GridHeaderDropZones, _Component);
+  var _super = _createSuper(GridHeaderDropZones);
+  function GridHeaderDropZones() {
+    _classCallCheck(this, GridHeaderDropZones);
+    return _super.call(this);
+  }
+  _createClass(GridHeaderDropZones, [{
+    key: "postConstruct",
+    value: function postConstruct() {
+      this.setGui(this.createNorthPanel());
+      this.addManagedListener(this.eventService, Events.EVENT_COLUMN_ROW_GROUP_CHANGED, this.onRowGroupChanged.bind(this));
+      this.addManagedListener(this.eventService, Events.EVENT_NEW_COLUMNS_LOADED, this.onRowGroupChanged.bind(this));
+      this.addManagedPropertyListener('rowGroupPanelShow', this.onRowGroupChanged.bind(this));
+      this.onRowGroupChanged();
+    }
+  }, {
+    key: "createNorthPanel",
+    value: function createNorthPanel() {
+      var topPanelGui = document.createElement('div');
+      var dropPanelVisibleListener = this.onDropPanelVisible.bind(this);
+      topPanelGui.classList.add('ag-column-drop-wrapper');
+      _.setAriaRole(topPanelGui, 'presentation');
+      this.rowGroupComp = new RowGroupDropZonePanel(true);
+      this.createManagedBean(this.rowGroupComp);
+      this.pivotComp = new PivotDropZonePanel(true);
+      this.createManagedBean(this.pivotComp);
+      topPanelGui.appendChild(this.rowGroupComp.getGui());
+      topPanelGui.appendChild(this.pivotComp.getGui());
+      this.addManagedListener(this.rowGroupComp, Component.EVENT_DISPLAYED_CHANGED, dropPanelVisibleListener);
+      this.addManagedListener(this.pivotComp, Component.EVENT_DISPLAYED_CHANGED, dropPanelVisibleListener);
+      this.onDropPanelVisible();
+      return topPanelGui;
+    }
+  }, {
+    key: "onDropPanelVisible",
+    value: function onDropPanelVisible() {
+      var bothDisplayed = this.rowGroupComp.isDisplayed() && this.pivotComp.isDisplayed();
+      this.rowGroupComp.addOrRemoveCssClass('ag-column-drop-horizontal-half-width', bothDisplayed);
+      this.pivotComp.addOrRemoveCssClass('ag-column-drop-horizontal-half-width', bothDisplayed);
+    }
+  }, {
+    key: "onRowGroupChanged",
+    value: function onRowGroupChanged() {
+      if (!this.rowGroupComp) {
+        return;
+      }
+      var rowGroupPanelShow = this.gridOptionsService.get('rowGroupPanelShow');
+      if (rowGroupPanelShow === 'always') {
+        this.rowGroupComp.setDisplayed(true);
+      } else if (rowGroupPanelShow === 'onlyWhenGrouping') {
+        var grouping = !this.columnModel.isRowGroupEmpty();
+        this.rowGroupComp.setDisplayed(grouping);
+      } else {
+        this.rowGroupComp.setDisplayed(false);
+      }
+    }
+  }]);
+  return GridHeaderDropZones;
+}(Component);
+__decorate([Autowired('columnModel')], GridHeaderDropZones.prototype, "columnModel", void 0);
+__decorate([PostConstruct], GridHeaderDropZones.prototype, "postConstruct", null);

package/es/data-grid/modules/row-grouping/rowGrouping/columnDropZones/pivotDropZonePanel.d.ts

@@ -0,0 +1,17 @@
+import { Column, ITooltipParams, WithoutGridCommon } from "@ag-grid-community/core";
+import { BaseDropZonePanel } from "./baseDropZonePanel";
+export declare class PivotDropZonePanel extends BaseDropZonePanel {
+    private columnModel;
+    private loggerFactory;
+    private dragAndDropService;
+    constructor(horizontal: boolean);
+    private passBeansUp;
+    protected getAriaLabel(): string;
+    getTooltipParams(): WithoutGridCommon<ITooltipParams>;
+    private refresh;
+    private checkVisibility;
+    protected isColumnDroppable(column: Column): boolean;
+    protected updateColumns(columns: Column[]): void;
+    protected getIconName(): string;
+    protected getExistingColumns(): Column[];
+}

package/es/data-grid/modules/row-grouping/rowGrouping/columnDropZones/pivotDropZonePanel.js

@@ -0,0 +1,139 @@
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, _toPropertyKey(descriptor.key), descriptor); } }
+function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, "prototype", { writable: false }); return Constructor; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
+function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+function _get() { if (typeof Reflect !== "undefined" && Reflect.get) { _get = Reflect.get.bind(); } else { _get = function _get(target, property, receiver) { var base = _superPropBase(target, property); if (!base) return; var desc = Object.getOwnPropertyDescriptor(base, property); if (desc.get) { return desc.get.call(arguments.length < 3 ? target : receiver); } return desc.value; }; } return _get.apply(this, arguments); }
+function _superPropBase(object, property) { while (!Object.prototype.hasOwnProperty.call(object, property)) { object = _getPrototypeOf(object); if (object === null) break; } return object; }
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); Object.defineProperty(subClass, "prototype", { writable: false }); if (superClass) _setPrototypeOf(subClass, superClass); }
+function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
+function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
+function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } else if (call !== void 0) { throw new TypeError("Derived constructors may only return object or undefined"); } return _assertThisInitialized(self); }
+function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
+function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
+function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf.bind() : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+var __decorate = this && this.__decorate || function (decorators, target, key, desc) {
+  var c = arguments.length,
+    r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc,
+    d;
+  if ((typeof Reflect === "undefined" ? "undefined" : _typeof(Reflect)) === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+  return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+import { _, Autowired, DragAndDropService, Events, PostConstruct } from "@ag-grid-community/core";
+import { BaseDropZonePanel } from "./baseDropZonePanel";
+export var PivotDropZonePanel = /*#__PURE__*/function (_BaseDropZonePanel) {
+  _inherits(PivotDropZonePanel, _BaseDropZonePanel);
+  var _super = _createSuper(PivotDropZonePanel);
+  function PivotDropZonePanel(horizontal) {
+    _classCallCheck(this, PivotDropZonePanel);
+    return _super.call(this, horizontal, 'pivot');
+  }
+  _createClass(PivotDropZonePanel, [{
+    key: "passBeansUp",
+    value: function passBeansUp() {
+      _get(_getPrototypeOf(PivotDropZonePanel.prototype), "setBeans", this).call(this, {
+        gridOptionsService: this.gridOptionsService,
+        eventService: this.eventService,
+        context: this.getContext(),
+        loggerFactory: this.loggerFactory,
+        dragAndDropService: this.dragAndDropService
+      });
+      var localeTextFunc = this.localeService.getLocaleTextFunc();
+      var emptyMessage = localeTextFunc('pivotColumnsEmptyMessage', 'Drag here to set column labels');
+      var title = localeTextFunc('pivots', 'Column Labels');
+      _get(_getPrototypeOf(PivotDropZonePanel.prototype), "init", this).call(this, {
+        dragAndDropIcon: DragAndDropService.ICON_GROUP,
+        icon: _.createIconNoSpan('pivotPanel', this.gridOptionsService, null),
+        emptyMessage: emptyMessage,
+        title: title
+      });
+      this.addManagedListener(this.eventService, Events.EVENT_NEW_COLUMNS_LOADED, this.refresh.bind(this));
+      this.addManagedListener(this.eventService, Events.EVENT_COLUMN_PIVOT_CHANGED, this.refresh.bind(this));
+      this.addManagedListener(this.eventService, Events.EVENT_COLUMN_PIVOT_MODE_CHANGED, this.checkVisibility.bind(this));
+      this.refresh();
+    }
+  }, {
+    key: "getAriaLabel",
+    value: function getAriaLabel() {
+      var translate = this.localeService.getLocaleTextFunc();
+      var label = translate('ariaPivotDropZonePanelLabel', 'Column Labels');
+      return label;
+    }
+  }, {
+    key: "getTooltipParams",
+    value: function getTooltipParams() {
+      var res = _get(_getPrototypeOf(PivotDropZonePanel.prototype), "getTooltipParams", this).call(this);
+      res.location = 'pivotColumnsList';
+      return res;
+    }
+  }, {
+    key: "refresh",
+    value: function refresh() {
+      this.checkVisibility();
+      this.refreshGui();
+    }
+  }, {
+    key: "checkVisibility",
+    value: function checkVisibility() {
+      var pivotMode = this.columnModel.isPivotMode();
+      if (this.isHorizontal()) {
+        // what we do for horizontal (ie the pivot panel at the top) depends
+        // on the user property as well as pivotMode.
+        switch (this.gridOptionsService.get('pivotPanelShow')) {
+          case 'always':
+            this.setDisplayed(pivotMode);
+            break;
+          case 'onlyWhenPivoting':
+            var pivotActive = this.columnModel.isPivotActive();
+            this.setDisplayed(pivotMode && pivotActive);
+            break;
+          default:
+            // never show it
+            this.setDisplayed(false);
+            break;
+        }
+      } else {
+        // in toolPanel, the pivot panel is always shown when pivot mode is on
+        this.setDisplayed(pivotMode);
+      }
+    }
+  }, {
+    key: "isColumnDroppable",
+    value: function isColumnDroppable(column) {
+      // we never allow grouping of secondary columns
+      if (this.gridOptionsService.is('functionsReadOnly') || !column.isPrimary()) {
+        return false;
+      }
+      return column.isAllowPivot() && !column.isPivotActive();
+    }
+  }, {
+    key: "updateColumns",
+    value: function updateColumns(columns) {
+      if (this.gridOptionsService.is('functionsPassive')) {
+        var event = {
+          type: Events.EVENT_COLUMN_PIVOT_CHANGE_REQUEST,
+          columns: columns
+        };
+        this.eventService.dispatchEvent(event);
+      } else {
+        this.columnModel.setPivotColumns(columns, "toolPanelUi");
+      }
+    }
+  }, {
+    key: "getIconName",
+    value: function getIconName() {
+      return this.isPotentialDndColumns() ? DragAndDropService.ICON_PIVOT : DragAndDropService.ICON_NOT_ALLOWED;
+    }
+  }, {
+    key: "getExistingColumns",
+    value: function getExistingColumns() {
+      return this.columnModel.getPivotColumns();
+    }
+  }]);
+  return PivotDropZonePanel;
+}(BaseDropZonePanel);
+__decorate([Autowired('columnModel')], PivotDropZonePanel.prototype, "columnModel", void 0);
+__decorate([Autowired('loggerFactory')], PivotDropZonePanel.prototype, "loggerFactory", void 0);
+__decorate([Autowired('dragAndDropService')], PivotDropZonePanel.prototype, "dragAndDropService", void 0);
+__decorate([PostConstruct], PivotDropZonePanel.prototype, "passBeansUp", null);

package/es/data-grid/modules/row-grouping/rowGrouping/columnDropZones/rowGroupDropZonePanel.d.ts

@@ -0,0 +1,15 @@
+import { Column, ITooltipParams, WithoutGridCommon } from "@ag-grid-community/core";
+import { BaseDropZonePanel } from "./baseDropZonePanel";
+export declare class RowGroupDropZonePanel extends BaseDropZonePanel {
+    private columnModel;
+    private loggerFactory;
+    private dragAndDropService;
+    constructor(horizontal: boolean);
+    private passBeansUp;
+    protected getAriaLabel(): string;
+    getTooltipParams(): WithoutGridCommon<ITooltipParams>;
+    protected isColumnDroppable(column: Column): boolean;
+    protected updateColumns(columns: Column[]): void;
+    protected getIconName(): string;
+    protected getExistingColumns(): Column[];
+}