@elliemae/ds-datagrids 1.61.0 → 2.0.0-alpha.12

package/cjs/plugins/expandable-grid/ExpandablePlugin.js

@@ -3,8 +3,18 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 var _objectWithoutProperties = require('@babel/runtime/helpers/objectWithoutProperties');
-var _toConsumableArray = require('@babel/runtime/helpers/toConsumableArray');
+var _jsx = require('@babel/runtime/helpers/jsx');
 var _defineProperty = require('@babel/runtime/helpers/defineProperty');
+require('core-js/modules/esnext.async-iterator.some.js');
+require('core-js/modules/esnext.iterator.constructor.js');
+require('core-js/modules/esnext.iterator.some.js');
+require('core-js/modules/esnext.async-iterator.filter.js');
+require('core-js/modules/esnext.iterator.filter.js');
+require('core-js/modules/esnext.async-iterator.map.js');
+require('core-js/modules/esnext.iterator.map.js');
+require('core-js/modules/web.dom-collections.iterator.js');
+require('core-js/modules/esnext.async-iterator.for-each.js');
+require('core-js/modules/esnext.iterator.for-each.js');
 var React = require('react');
 var dsUtilities = require('@elliemae/ds-utilities');
 var reactWindow = require('react-window');
@@ -12,170 +22,130 @@ var dsIcons = require('@elliemae/ds-icons');
 var DSButton = require('@elliemae/ds-button');
 var createInstancePlugin = require('@elliemae/ds-shared/createDataInstance/createInstancePlugin');
 var initColumnDefinition = require('@elliemae/ds-shared/useDataGrid/initColumnDefinition');
-var plugins_expandableGrid_ExpandedRow = require('./ExpandedRow.js');
-var plugins_expandableGrid_ExpandedRowExtra = require('./ExpandedRowExtra.js');
+var ExpandedRow = require('./ExpandedRow.js');
+var ExpandedRowExtra = require('./ExpandedRowExtra.js');
 var rowSizes = require('../../rowSizes.js');
-var plugins_expandableGrid_useExpandGridState = require('./useExpandGridState.js');
-require('@elliemae/ds-separator');
-require('styled-components');
-require('@elliemae/ds-shared/defer-render-hoc');
-require('@elliemae/ds-shared/useDataGrid');
-require('../pagination/PaginationPlugin.js');
-require('@babel/runtime/helpers/extends');
-require('@elliemae/ds-shared/FocusGroup/FocusGrid');
-require('../pagination/helper.js');
-require('../pagination/usePaginationState.js');
-require('@babel/runtime/helpers/slicedToArray');
-require('../../components/NoResults.js');
-require('@elliemae/ds-system');
-require('../../components/BodyCell.js');
-require('prop-types');
-require('@elliemae/ds-shared/createDataInstance/utils');
-require('@elliemae/ds-truncated-tooltip-text');
-require('../../index-0be12eb8.js');
-require('../../components/renderers/defaultClassedRenderers.js');
-require('@elliemae/ds-classnames');
-require('../../blockNames.js');
-require('../../components/renderers/renderRowsLoader.js');
-require('../../components/RowsLoader.js');
-require('@elliemae/ds-spinner');
-require('../../components/TableBody.js');
-require('../../components/tableContext.js');
-require('../../components/Table.js');
-require('../../components/TableHeader.js');
-require('../../components/HeaderCell.js');
-require('../column-sizing/ColumnSizingPlugin.js');
-require('../column-sizing/useStylesheetHelpers.js');
-require('stylesheet-helpers');
-require('../column-sizing/getColumnNameFromProperty.js');
-require('../../utilities/getScrollbarSize.js');
-require('../column-sizing/useColumnSizeService.js');
-require('../column-sizing/utils.js');
-require('../column-sizing/ext-points/getTableProps.js');
-require('../column-sizing/ext-points/decorateColumn.js');
-require('../column-sizing/columnMeasurerTransformer.js');
+var useExpandGridState = require('./useExpandGridState.js');
+var jsxRuntime = require('react/jsx-runtime');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
 var _objectWithoutProperties__default = /*#__PURE__*/_interopDefaultLegacy(_objectWithoutProperties);
-var _toConsumableArray__default = /*#__PURE__*/_interopDefaultLegacy(_toConsumableArray);
+var _jsx__default = /*#__PURE__*/_interopDefaultLegacy(_jsx);
 var _defineProperty__default = /*#__PURE__*/_interopDefaultLegacy(_defineProperty);
-var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 var DSButton__default = /*#__PURE__*/_interopDefaultLegacy(DSButton);
 var createInstancePlugin__default = /*#__PURE__*/_interopDefaultLegacy(createInstancePlugin);
 
-var _excluded = ["isExpanded"];
+const _excluded = ["isExpanded"];
+
+var _ArrowheadDown, _ArrowheadRight;
 
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
 
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty__default['default'](target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty__default["default"](target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
 
-var getExpandedRowSizeBySubrows = function getExpandedRowSizeBySubrows(_ref) {
-  var totalAmount = _ref.totalAmount,
-      amountVisible = _ref.amountVisible,
-      isShowingAll = _ref.isShowingAll,
-      _ref$size = _ref.size,
-      size = _ref$size === void 0 ? 36 : _ref$size;
+const getExpandedRowSizeBySubrows = _ref => {
+  let {
+    totalAmount,
+    amountVisible,
+    isShowingAll,
+    size = 36
+  } = _ref;
   return isShowingAll ? size * (totalAmount + 1) - 6 : size * (amountVisible + 1) + 32;
 };
 
-var ExpandedRows = {
-  SingleColumn: plugins_expandableGrid_ExpandedRow,
-  Master: plugins_expandableGrid_ExpandedRowExtra
+const ExpandedRows = {
+  SingleColumn: ExpandedRow,
+  Master: ExpandedRowExtra
 };
 
-var createExpandedRow = function createExpandedRow(type) {
-  return ExpandedRows[type] || ExpandedRows.Master;
-};
+const createExpandedRow = type => ExpandedRows[type] || ExpandedRows.Master;
 
-var isExpandableSingleColumn = function isExpandableSingleColumn(columns) {
-  return columns.some(function (column) {
-    return column.expandableColumn;
-  });
-};
+const isExpandableSingleColumn = columns => columns.some(column => column.expandableColumn);
 
-var ExpandablePlugin = createInstancePlugin__default['default']('expandable', {
-  registerStateHook: plugins_expandableGrid_useExpandGridState.useExpandGridState,
-  decorateGrid: function decorateGrid(grid) {
-    var _grid$getInstance = grid.getInstance(),
-        decoratedColumns = _grid$getInstance.decoratedColumns,
-        columns = _grid$getInstance.columns;
+const ExpandablePlugin = createInstancePlugin__default["default"]('expandable', {
+  registerStateHook: useExpandGridState.useExpandGridState,
 
-    var detailColumns = React.useMemo(function () {
-      return decoratedColumns.map(function (column) {
-        return _objectSpread(_objectSpread({}, column), {}, {
-          customRenderer: column.detailCustomRenderer
-        });
-      }).filter(function (col) {
-        return !col.expandableColumn;
-      });
-    }, [columns]);
+  decorateGrid(grid) {
+    const {
+      decoratedColumns,
+      columns
+    } = grid.getInstance();
+    const detailColumns = React.useMemo(() => decoratedColumns.map(column => _objectSpread(_objectSpread({}, column), {}, {
+      customRenderer: column.detailCustomRenderer
+    })).filter(col => !col.expandableColumn), [columns]);
     return {
-      detailColumns: detailColumns
+      detailColumns
     };
   },
-  decorateColumns: function decorateColumns(columns, grid) {
+
+  decorateColumns(columns, grid) {
     if (isExpandableSingleColumn(columns)) return columns; // get first column from user
 
-    var firstColumnIndex = columns.findIndex(function (column) {
-      return column.isUserColumn;
-    });
-    var firstColumn = columns[firstColumnIndex];
+    const firstColumnIndex = columns.findIndex(column => column.isUserColumn);
+    const firstColumn = columns[firstColumnIndex];
     firstColumn.formatExpandable = true;
-    return [].concat(_toConsumableArray__default['default'](columns.slice(0, firstColumnIndex)), [initColumnDefinition.appendCellFormatter(function (value, _ref2) {
-      var isExpanded = _ref2.isExpanded,
-          rowData = _ref2.rowData;
-
-      var _grid$getInstance2 = grid.getInstance(),
-          toggleExpand = _grid$getInstance2.actions.toggleExpand;
+    return [...columns.slice(0, firstColumnIndex), initColumnDefinition.appendCellFormatter((value, _ref2) => {
+      let {
+        isExpanded,
+        rowData
+      } = _ref2;
+      const {
+        actions: {
+          toggleExpand
+        }
+      } = grid.getInstance();
       /*
        * should return only 2 elements ../custom-cell-renderer/addCustomRendererToCell.js
        * getRenderer it's checking that length to apply the custom render to value only
        */
 
-
-      return /*#__PURE__*/React__default['default'].createElement(React__default['default'].Fragment, null, /*#__PURE__*/React__default['default'].createElement(DSButton__default['default'], {
-        buttonType: "text",
-        className: "expandable-arrow",
-        icon: isExpanded ? /*#__PURE__*/React__default['default'].createElement(dsIcons.ArrowheadDown, null) : /*#__PURE__*/React__default['default'].createElement(dsIcons.ArrowheadRight, null),
-        onClick: function onClick(e) {
-          e.stopPropagation();
-          toggleExpand(rowData);
-        },
-        size: "s"
-      }), value);
-    }, firstColumn)], _toConsumableArray__default['default'](columns.slice(firstColumnIndex + 1)));
+      return /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
+        children: [/*#__PURE__*/_jsx__default["default"](DSButton__default["default"], {
+          buttonType: "text",
+          className: "expandable-arrow",
+          icon: isExpanded ? _ArrowheadDown || (_ArrowheadDown = /*#__PURE__*/_jsx__default["default"](dsIcons.ArrowheadDown, {})) : _ArrowheadRight || (_ArrowheadRight = /*#__PURE__*/_jsx__default["default"](dsIcons.ArrowheadRight, {})),
+          onClick: e => {
+            e.stopPropagation();
+            toggleExpand(rowData);
+          },
+          size: "s"
+        }), value]
+      });
+    }, firstColumn), ...columns.slice(firstColumnIndex + 1)];
   },
-  getBodyProps: function getBodyProps(bodyProps, grid) {
-    var _grid$getInstance3 = grid.getInstance(),
-        rows = _grid$getInstance3.composedRows,
-        _grid$getInstance3$pr = _grid$getInstance3.props,
-        rowKey = _grid$getInstance3$pr.rowKey,
-        getChildrenRows = _grid$getInstance3$pr.getChildrenRows,
-        _grid$getInstance3$pr2 = _grid$getInstance3$pr.rowSize,
-        rowSize = _grid$getInstance3$pr2 === void 0 ? 'normal' : _grid$getInstance3$pr2,
-        _grid$getInstance3$pr3 = _grid$getInstance3$pr.subrowSize,
-        subrowSize = _grid$getInstance3$pr3 === void 0 ? 'normal' : _grid$getInstance3$pr3,
-        getExpandedRowMinSize = _grid$getInstance3$pr.getExpandedRowMinSize,
-        getExpandedRowSize = _grid$getInstance3$pr.getExpandedRowSize,
-        expandableSubrowsVisible = _grid$getInstance3$pr.expandableSubrowsVisible,
-        expandedRows = _grid$getInstance3.state.expandedRows;
 
-    var rowSizePx = rowSizes.RowSizes[rowSize];
-    var subrowSizePx = rowSizes.RowSizes[subrowSize];
-    var listRef = React.useRef();
-    React.useEffect(function () {
+  getBodyProps(bodyProps, grid) {
+    const {
+      composedRows: rows,
+      props: {
+        rowKey,
+        getChildrenRows,
+        rowSize = 'normal',
+        subrowSize = 'normal',
+        getExpandedRowMinSize,
+        getExpandedRowSize,
+        expandableSubrowsVisible
+      },
+      state: {
+        expandedRows
+      }
+    } = grid.getInstance();
+    const rowSizePx = rowSizes.RowSizes[rowSize];
+    const subrowSizePx = rowSizes.RowSizes[subrowSize];
+    const listRef = React.useRef();
+    React.useEffect(() => {
       if (listRef.current) listRef.current.resetAfterIndex(0, true);
     }); // implementation of expandable row single column with aggregation
 
-    var getItemSize = function getItemSize(index) {
-      var rowData = rows[index];
-      var key = rowData[rowKey];
-      var children = getChildrenRows({
-        rowData: rowData
+    const getItemSize = index => {
+      const rowData = rows[index];
+      const key = rowData[rowKey];
+      const children = getChildrenRows({
+        rowData
       });
-      var expandedSize = getExpandedRowSize ? getExpandedRowSize(index, {
-        rowData: rowData
+      const expandedSize = getExpandedRowSize ? getExpandedRowSize(index, {
+        rowData
       }) // https://jira.elliemae.io/browse/PUI-1659
       : getExpandedRowSizeBySubrows({
         totalAmount: children.length,
@@ -183,7 +153,7 @@ var ExpandablePlugin = createInstancePlugin__default['default']('expandable', {
         isShowingAll: children.length < expandableSubrowsVisible || expandedRows[key] && expandedRows[key].showAllRows,
         size: subrowSizePx
       });
-      var expandedMinSize = dsUtilities.isFunction(getExpandedRowMinSize) && getExpandedRowMinSize(index); // eslint-disable-next-line no-nested-ternary
+      const expandedMinSize = dsUtilities.isFunction(getExpandedRowMinSize) && getExpandedRowMinSize(index); // eslint-disable-next-line no-nested-ternary
 
       return expandedRows[key] ? expandedMinSize > expandedSize ? expandedMinSize : expandedSize : rowSizePx;
     };
@@ -197,30 +167,34 @@ var ExpandablePlugin = createInstancePlugin__default['default']('expandable', {
       }
     });
   },
-  decorateRenderers: function decorateRenderers(renderers, grid) {
-    var Row = renderers.body.row;
-    var Cell = renderers.body.cell; // eslint-disable-next-line react/display-name
 
-    renderers.body.row = React.useMemo(function () {
+  decorateRenderers(renderers, grid) {
+    const Row = renderers.body.row;
+    const Cell = renderers.body.cell; // eslint-disable-next-line react/display-name
+
+    renderers.body.row = React.useMemo(() => {
       // todo: the expandable grid should be created from another specific grid component
-      var expandedRowType = isExpandableSingleColumn(grid.decoratedColumns) ? 'SingleColumn' : 'Master';
-      var ExpandedRowComponent = createExpandedRow(expandedRowType); // eslint-disable-next-line react/display-name
+      const expandedRowType = isExpandableSingleColumn(grid.decoratedColumns) ? 'SingleColumn' : 'Master';
+      const ExpandedRowComponent = createExpandedRow(expandedRowType); // eslint-disable-next-line react/display-name
 
-      return function (_ref3) {
-        var isExpanded = _ref3.isExpanded,
-            rowProps = _objectWithoutProperties__default['default'](_ref3, _excluded);
+      return _ref3 => {
+        let {
+          isExpanded
+        } = _ref3,
+            rowProps = _objectWithoutProperties__default["default"](_ref3, _excluded);
 
         if (isExpanded) {
-          var _grid$getInstance4 = grid.getInstance(),
-              _grid$getInstance4$pr = _grid$getInstance4.props,
-              detailColumns = _grid$getInstance4$pr.detailColumns,
-              getChildrenRows = _grid$getInstance4$pr.getChildrenRows,
-              renderRowDetails = _grid$getInstance4$pr.renderRowDetails,
-              composedRows = _grid$getInstance4.composedRows; // https://jira.elliemae.io/browse/PUI-1667
-
-
-          var rowData = composedRows[rowProps.index] ? composedRows[rowProps.index] : rowProps.rowData;
-          return /*#__PURE__*/React__default['default'].createElement(ExpandedRowComponent, {
+          const {
+            props: {
+              detailColumns,
+              getChildrenRows,
+              renderRowDetails
+            },
+            composedRows
+          } = grid.getInstance(); // https://jira.elliemae.io/browse/PUI-1667
+
+          const rowData = composedRows[rowProps.index] ? composedRows[rowProps.index] : rowProps.rowData;
+          return /*#__PURE__*/_jsx__default["default"](ExpandedRowComponent, {
             cellComponent: Cell,
             detailColumns: detailColumns,
             parentGrid: grid,
@@ -228,36 +202,42 @@ var ExpandablePlugin = createInstancePlugin__default['default']('expandable', {
             rowComponent: Row,
             rowData: rowData,
             rowProps: _objectSpread({
-              rowData: rowData,
-              isExpanded: isExpanded
+              rowData,
+              isExpanded
             }, rowProps),
             rows: getChildrenRows({
-              rowData: rowData
+              rowData
             })
-          }, rowProps.children);
+          }, void 0, rowProps.children);
         }
 
-        return /*#__PURE__*/React__default['default'].createElement(Row, rowProps);
+        return /*#__PURE__*/jsxRuntime.jsx(Row, _objectSpread({}, rowProps));
       };
     }, []);
     return renderers;
   },
-  getRowProps: function getRowProps(rowProps, grid, _ref4) {
-    var rowData = _ref4.rowData;
-
-    var _grid$getInstance5 = grid.getInstance(),
-        rowKey = _grid$getInstance5.props.rowKey,
-        expandedRows = _grid$getInstance5.state.expandedRows;
 
-    var key = rowData[rowKey];
-    var isExpanded = !!expandedRows[key];
+  getRowProps(rowProps, grid, _ref4) {
+    let {
+      rowData
+    } = _ref4;
+    const {
+      props: {
+        rowKey
+      },
+      state: {
+        expandedRows
+      }
+    } = grid.getInstance();
+    const key = rowData[rowKey];
+    const isExpanded = !!expandedRows[key];
     return _objectSpread(_objectSpread({}, rowProps), {}, {
       className: dsUtilities.cx(rowProps.className, Object.keys(expandedRows).length > 0 && 'expandable-row', isExpanded && 'expanded'),
-      isExpanded: isExpanded,
+      isExpanded,
       showAllRows: expandedRows[key] && expandedRows[key].showAllRows
     });
   }
+
 });
 
 exports.ExpandablePlugin = ExpandablePlugin;
-//# sourceMappingURL=ExpandablePlugin.js.map