@elliemae/ds-datagrids 2.2.0-next.4 → 2.3.0-alpha.2

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

@@ -1,231 +1,152 @@
-import 'core-js/modules/esnext.async-iterator.for-each.js';
-import 'core-js/modules/esnext.iterator.for-each.js';
-import _objectWithoutProperties from '@babel/runtime/helpers/esm/objectWithoutProperties';
-import _jsx from '@babel/runtime/helpers/esm/jsx';
-import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
-import 'core-js/modules/esnext.async-iterator.some.js';
-import 'core-js/modules/esnext.iterator.constructor.js';
-import 'core-js/modules/esnext.iterator.some.js';
-import 'core-js/modules/esnext.async-iterator.filter.js';
-import 'core-js/modules/esnext.iterator.filter.js';
-import 'core-js/modules/esnext.async-iterator.map.js';
-import 'core-js/modules/esnext.iterator.map.js';
-import 'core-js/modules/web.dom-collections.iterator.js';
-import { useMemo, useRef, useEffect } from 'react';
-import { cx, isFunction } from '@elliemae/ds-utilities';
-import { VariableSizeList } from 'react-window';
-import { ArrowheadDown, ArrowheadRight } from '@elliemae/ds-icons';
-import DSButton from '@elliemae/ds-button';
-import createInstancePlugin from '@elliemae/ds-shared/createDataInstance/createInstancePlugin';
-import { appendCellFormatter } from '@elliemae/ds-shared/useDataGrid/initColumnDefinition';
-import ExpandedRow from './ExpandedRow.js';
-import ExpandedRowExtra from './ExpandedRowExtra.js';
-import { RowSizes } from '../../rowSizes.js';
-import { useExpandGridState } from './useExpandGridState.js';
-import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
-
-const _excluded = ["isExpanded"];
-
-var _ArrowheadDown, _ArrowheadRight;
-
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); 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 = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-
-const getExpandedRowSizeBySubrows = _ref => {
-  let {
-    totalAmount,
-    amountVisible,
-    isShowingAll,
-    size = 36
-  } = _ref;
-  return isShowingAll ? size * (totalAmount + 1) - 6 : size * (amountVisible + 1) + 32;
-};
-
+import * as React from "react";
+import React2, { useEffect, useMemo, useRef } from "react";
+import { cx, isFunction } from "@elliemae/ds-utilities";
+import { VariableSizeList } from "react-window";
+import { ArrowheadDown, ArrowheadRight } from "@elliemae/ds-icons";
+import { DSButton } from "@elliemae/ds-button";
+import { createInstancePlugin } from "@elliemae/ds-shared/createDataInstance/createInstancePlugin";
+import { appendCellFormatter } from "@elliemae/ds-shared/useDataGrid/initColumnDefinition";
+import { ExpandedRow } from "./ExpandedRow";
+import { ExpandedRowExtra } from "./ExpandedRowExtra";
+import { RowSizes } from "../../rowSizes";
+import { useExpandGridState } from "./useExpandGridState";
+const getExpandedRowSizeBySubrows = ({ totalAmount, amountVisible, isShowingAll, size = 36 }) => isShowingAll ? size * (totalAmount + 1) - 6 : size * (amountVisible + 1) + 32;
 const ExpandedRows = {
   SingleColumn: ExpandedRow,
   Master: ExpandedRowExtra
 };
-
-const createExpandedRow = type => ExpandedRows[type] || ExpandedRows.Master;
-
-const isExpandableSingleColumn = columns => columns.some(column => column.expandableColumn);
-
-const ExpandablePlugin = createInstancePlugin('expandable', {
+const createExpandedRow = (type) => ExpandedRows[type] || ExpandedRows.Master;
+const isExpandableSingleColumn = (columns) => columns.some((column) => column.expandableColumn);
+const ExpandablePlugin = createInstancePlugin("expandable", {
   registerStateHook: useExpandGridState,
-
   decorateGrid(grid) {
-    const {
-      decoratedColumns,
-      columns
-    } = grid.getInstance();
-    const detailColumns = useMemo(() => decoratedColumns.map(column => _objectSpread(_objectSpread({}, column), {}, {
+    const { decoratedColumns, columns } = grid.getInstance();
+    const detailColumns = useMemo(() => decoratedColumns.map((column) => ({
+      ...column,
       customRenderer: column.detailCustomRenderer
-    })).filter(col => !col.expandableColumn), [columns]);
+    })).filter((col) => !col.expandableColumn), [columns]);
     return {
       detailColumns
     };
   },
-
   decorateColumns(columns, grid) {
-    if (isExpandableSingleColumn(columns)) return columns; // get first column from user
-
-    const firstColumnIndex = columns.findIndex(column => column.isUserColumn);
+    if (isExpandableSingleColumn(columns))
+      return columns;
+    const firstColumnIndex = columns.findIndex((column) => column.isUserColumn);
     const firstColumn = columns[firstColumnIndex];
     firstColumn.formatExpandable = true;
-    return [...columns.slice(0, firstColumnIndex), 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__*/jsxs(Fragment, {
-        children: [/*#__PURE__*/_jsx(DSButton, {
+    return [
+      ...columns.slice(0, firstColumnIndex),
+      appendCellFormatter((value, { isExpanded, rowData }) => {
+        const {
+          actions: { toggleExpand }
+        } = grid.getInstance();
+        return /* @__PURE__ */ React2.createElement(React2.Fragment, null, /* @__PURE__ */ React2.createElement(DSButton, {
           buttonType: "text",
           className: "expandable-arrow",
-          icon: isExpanded ? _ArrowheadDown || (_ArrowheadDown = /*#__PURE__*/_jsx(ArrowheadDown, {})) : _ArrowheadRight || (_ArrowheadRight = /*#__PURE__*/_jsx(ArrowheadRight, {})),
-          onClick: e => {
+          icon: isExpanded ? /* @__PURE__ */ React2.createElement(ArrowheadDown, null) : /* @__PURE__ */ React2.createElement(ArrowheadRight, null),
+          onClick: (e) => {
             e.stopPropagation();
             toggleExpand(rowData);
           },
           size: "s"
-        }), value]
-      });
-    }, firstColumn), ...columns.slice(firstColumnIndex + 1)];
+        }), value);
+      }, firstColumn),
+      ...columns.slice(firstColumnIndex + 1)
+    ];
   },
-
   getBodyProps(bodyProps, grid) {
     const {
       composedRows: rows,
       props: {
         rowKey,
         getChildrenRows,
-        rowSize = 'normal',
-        subrowSize = 'normal',
+        rowSize = "normal",
+        subrowSize = "normal",
         getExpandedRowMinSize,
         getExpandedRowSize,
         expandableSubrowsVisible
       },
-      state: {
-        expandedRows
-      }
+      state: { expandedRows }
     } = grid.getInstance();
     const rowSizePx = RowSizes[rowSize];
     const subrowSizePx = RowSizes[subrowSize];
     const listRef = useRef();
     useEffect(() => {
-      if (listRef.current) listRef.current.resetAfterIndex(0, true);
-    }); // implementation of expandable row single column with aggregation
-
-    const getItemSize = index => {
+      if (listRef.current)
+        listRef.current.resetAfterIndex(0, true);
+    });
+    const getItemSize = (index) => {
       const rowData = rows[index];
       const key = rowData[rowKey];
-      const children = getChildrenRows({
-        rowData
-      });
-      const expandedSize = getExpandedRowSize ? getExpandedRowSize(index, {
-        rowData
-      }) // https://jira.elliemae.io/browse/PUI-1659
-      : getExpandedRowSizeBySubrows({
+      const children = getChildrenRows({ rowData });
+      const expandedSize = getExpandedRowSize ? getExpandedRowSize(index, { rowData }) : getExpandedRowSizeBySubrows({
         totalAmount: children.length,
         amountVisible: children.length > expandableSubrowsVisible ? expandableSubrowsVisible : children.length,
         isShowingAll: children.length < expandableSubrowsVisible || expandedRows[key] && expandedRows[key].showAllRows,
         size: subrowSizePx
       });
-      const expandedMinSize = isFunction(getExpandedRowMinSize) && getExpandedRowMinSize(index); // eslint-disable-next-line no-nested-ternary
-
+      const expandedMinSize = isFunction(getExpandedRowMinSize) && getExpandedRowMinSize(index);
       return expandedRows[key] ? expandedMinSize > expandedSize ? expandedMinSize : expandedSize : rowSizePx;
     };
-
-    return _objectSpread(_objectSpread({}, bodyProps), {}, {
-      className: cx(bodyProps.className, 'expandable'),
+    return {
+      ...bodyProps,
+      className: cx(bodyProps.className, "expandable"),
       listComponent: VariableSizeList,
-      listProps: {
-        ref: listRef,
-        itemSize: getItemSize
-      }
-    });
+      listProps: { ref: listRef, itemSize: getItemSize }
+    };
   },
-
   decorateRenderers(renderers, grid) {
     const Row = renderers.body.row;
-    const Cell = renderers.body.cell; // eslint-disable-next-line react/display-name
-
+    const Cell = renderers.body.cell;
     renderers.body.row = useMemo(() => {
-      // todo: the expandable grid should be created from another specific grid component
-      const expandedRowType = isExpandableSingleColumn(grid.decoratedColumns) ? 'SingleColumn' : 'Master';
-      const ExpandedRowComponent = createExpandedRow(expandedRowType); // eslint-disable-next-line react/display-name
-
-      return _ref3 => {
-        let {
-          isExpanded
-        } = _ref3,
-            rowProps = _objectWithoutProperties(_ref3, _excluded);
-
+      const expandedRowType = isExpandableSingleColumn(grid.decoratedColumns) ? "SingleColumn" : "Master";
+      const ExpandedRowComponent = createExpandedRow(expandedRowType);
+      return ({ isExpanded, ...rowProps }) => {
         if (isExpanded) {
           const {
-            props: {
-              detailColumns,
-              getChildrenRows,
-              renderRowDetails
-            },
+            props: { detailColumns, getChildrenRows, renderRowDetails },
             composedRows
-          } = grid.getInstance(); // https://jira.elliemae.io/browse/PUI-1667
-
+          } = grid.getInstance();
           const rowData = composedRows[rowProps.index] ? composedRows[rowProps.index] : rowProps.rowData;
-          return /*#__PURE__*/_jsx(ExpandedRowComponent, {
+          return /* @__PURE__ */ React2.createElement(ExpandedRowComponent, {
             cellComponent: Cell,
-            detailColumns: detailColumns,
+            detailColumns,
             parentGrid: grid,
-            renderRowDetails: renderRowDetails,
+            renderRowDetails,
             rowComponent: Row,
-            rowData: rowData,
-            rowProps: _objectSpread({
+            rowData,
+            rowProps: {
               rowData,
-              isExpanded
-            }, rowProps),
-            rows: getChildrenRows({
-              rowData
-            })
-          }, void 0, rowProps.children);
+              isExpanded,
+              ...rowProps
+            },
+            rows: getChildrenRows({ rowData })
+          }, rowProps.children);
         }
-
-        return /*#__PURE__*/jsx(Row, _objectSpread({}, rowProps));
+        return /* @__PURE__ */ React2.createElement(Row, {
+          ...rowProps
+        });
       };
     }, []);
     return renderers;
   },
-
-  getRowProps(rowProps, grid, _ref4) {
-    let {
-      rowData
-    } = _ref4;
+  getRowProps(rowProps, grid, { rowData }) {
     const {
-      props: {
-        rowKey
-      },
-      state: {
-        expandedRows
-      }
+      props: { rowKey },
+      state: { expandedRows }
     } = grid.getInstance();
     const key = rowData[rowKey];
     const isExpanded = !!expandedRows[key];
-    return _objectSpread(_objectSpread({}, rowProps), {}, {
-      className: cx(rowProps.className, Object.keys(expandedRows).length > 0 && 'expandable-row', isExpanded && 'expanded'),
+    return {
+      ...rowProps,
+      className: cx(rowProps.className, Object.keys(expandedRows).length > 0 && "expandable-row", isExpanded && "expanded"),
       isExpanded,
       showAllRows: expandedRows[key] && expandedRows[key].showAllRows
-    });
+    };
   }
-
 });
-
-export { ExpandablePlugin };
+export {
+  ExpandablePlugin
+};
+//# sourceMappingURL=ExpandablePlugin.js.map

package/esm/plugins/expandable-grid/ExpandablePlugin.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/plugins/expandable-grid/ExpandablePlugin.tsx"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable max-lines */\nimport React, { useEffect, useMemo, useRef } from 'react';\nimport { cx, isFunction } from '@elliemae/ds-utilities';\nimport { VariableSizeList } from 'react-window';\nimport { ArrowheadDown, ArrowheadRight } from '@elliemae/ds-icons';\nimport { DSButton } from '@elliemae/ds-button';\nimport { createInstancePlugin } from '@elliemae/ds-shared/createDataInstance/createInstancePlugin';\nimport { appendCellFormatter } from '@elliemae/ds-shared/useDataGrid/initColumnDefinition';\nimport { ExpandedRow } from './ExpandedRow';\nimport { ExpandedRowExtra } from './ExpandedRowExtra';\nimport { RowSizes } from '../../rowSizes';\nimport { useExpandGridState } from './useExpandGridState';\n\nconst getExpandedRowSizeBySubrows = ({ totalAmount, amountVisible, isShowingAll, size = 36 }) =>\n  isShowingAll ? size * (totalAmount + 1) - 6 : size * (amountVisible + 1) + 32;\n\nconst ExpandedRows = {\n  SingleColumn: ExpandedRow,\n  Master: ExpandedRowExtra,\n};\n\nconst createExpandedRow = (type) => ExpandedRows[type] || ExpandedRows.Master;\n\nconst isExpandableSingleColumn = (columns) => columns.some((column) => column.expandableColumn);\n\nexport const ExpandablePlugin = createInstancePlugin('expandable', {\n  registerStateHook: useExpandGridState,\n  decorateGrid(grid) {\n    const { decoratedColumns, columns } = grid.getInstance();\n    const detailColumns = useMemo(\n      () =>\n        decoratedColumns\n          .map((column) => ({\n            ...column,\n            customRenderer: column.detailCustomRenderer,\n          }))\n          .filter((col) => !col.expandableColumn),\n      [columns],\n    );\n    return {\n      detailColumns,\n    };\n  },\n\n  decorateColumns(columns, grid) {\n    if (isExpandableSingleColumn(columns)) return columns;\n    // get first column from user\n    const firstColumnIndex = columns.findIndex((column) => column.isUserColumn);\n    const firstColumn = columns[firstColumnIndex];\n    firstColumn.formatExpandable = true;\n\n    return [\n      ...columns.slice(0, firstColumnIndex),\n      appendCellFormatter((value, { isExpanded, rowData }) => {\n        const {\n          actions: { toggleExpand },\n        } = grid.getInstance();\n        /*\n         * should return only 2 elements ../custom-cell-renderer/addCustomRendererToCell.js\n         * getRenderer it's checking that length to apply the custom render to value only\n         */\n        return (\n          <>\n            <DSButton\n              buttonType=\"text\"\n              className=\"expandable-arrow\"\n              icon={isExpanded ? <ArrowheadDown /> : <ArrowheadRight />}\n              onClick={(e) => {\n                e.stopPropagation();\n                toggleExpand(rowData);\n              }}\n              size=\"s\"\n            />\n            {value}\n          </>\n        );\n      }, firstColumn),\n      ...columns.slice(firstColumnIndex + 1),\n    ];\n  },\n\n  getBodyProps(bodyProps, grid) {\n    const {\n      composedRows: rows,\n      props: {\n        rowKey,\n        getChildrenRows,\n        rowSize = 'normal',\n        subrowSize = 'normal',\n        getExpandedRowMinSize,\n        getExpandedRowSize,\n        expandableSubrowsVisible,\n      },\n      state: { expandedRows },\n    } = grid.getInstance();\n    const rowSizePx = RowSizes[rowSize];\n    const subrowSizePx = RowSizes[subrowSize];\n    const listRef = useRef();\n\n    useEffect(() => {\n      if (listRef.current) listRef.current.resetAfterIndex(0, true);\n    });\n\n    // implementation of expandable row single column with aggregation\n    const getItemSize = (index) => {\n      const rowData = rows[index];\n      const key = rowData[rowKey];\n      const children = getChildrenRows({ rowData });\n\n      const expandedSize = getExpandedRowSize\n        ? getExpandedRowSize(index, { rowData }) // https://jira.elliemae.io/browse/PUI-1659\n        : getExpandedRowSizeBySubrows({\n            totalAmount: children.length,\n            amountVisible: children.length > expandableSubrowsVisible ? expandableSubrowsVisible : children.length,\n            isShowingAll:\n              children.length < expandableSubrowsVisible || (expandedRows[key] && expandedRows[key].showAllRows),\n            size: subrowSizePx,\n          });\n\n      const expandedMinSize = isFunction(getExpandedRowMinSize) && getExpandedRowMinSize(index);\n\n      // eslint-disable-next-line no-nested-ternary\n      return expandedRows[key] ? (expandedMinSize > expandedSize ? expandedMinSize : expandedSize) : rowSizePx;\n    };\n\n    return {\n      ...bodyProps,\n      className: cx(bodyProps.className, 'expandable'),\n      listComponent: VariableSizeList,\n      listProps: { ref: listRef, itemSize: getItemSize },\n    };\n  },\n\n  decorateRenderers(renderers, grid) {\n    const Row = renderers.body.row;\n    const Cell = renderers.body.cell;\n\n    // eslint-disable-next-line react/display-name\n    renderers.body.row = useMemo(() => {\n      // todo: the expandable grid should be created from another specific grid component\n      const expandedRowType = isExpandableSingleColumn(grid.decoratedColumns) ? 'SingleColumn' : 'Master';\n      const ExpandedRowComponent = createExpandedRow(expandedRowType);\n      // eslint-disable-next-line react/display-name\n      return ({ isExpanded, ...rowProps }) => {\n        if (isExpanded) {\n          const {\n            props: { detailColumns, getChildrenRows, renderRowDetails },\n            composedRows,\n          } = grid.getInstance();\n          // https://jira.elliemae.io/browse/PUI-1667\n          const rowData = composedRows[rowProps.index] ? composedRows[rowProps.index] : rowProps.rowData;\n          return (\n            <ExpandedRowComponent\n              cellComponent={Cell}\n              detailColumns={detailColumns}\n              parentGrid={grid}\n              renderRowDetails={renderRowDetails}\n              rowComponent={Row}\n              rowData={rowData}\n              rowProps={{\n                rowData,\n                isExpanded,\n                ...rowProps,\n              }}\n              rows={getChildrenRows({ rowData })}\n            >\n              {rowProps.children}\n            </ExpandedRowComponent>\n          );\n        }\n        return <Row {...rowProps} />;\n      };\n    }, []);\n\n    return renderers;\n  },\n\n  getRowProps(rowProps, grid, { rowData }) {\n    const {\n      props: { rowKey },\n      state: { expandedRows },\n    } = grid.getInstance();\n    const key = rowData[rowKey];\n    const isExpanded = !!expandedRows[key];\n    return {\n      ...rowProps,\n      className: cx(\n        rowProps.className,\n        Object.keys(expandedRows).length > 0 && 'expandable-row',\n        isExpanded && 'expanded',\n      ),\n      isExpanded,\n      showAllRows: expandedRows[key] && expandedRows[key].showAllRows,\n    };\n  },\n});\n"],
+  "mappings": "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",
+  "names": []
+}

package/esm/plugins/expandable-grid/ExpandedRow.js

@@ -1,143 +1,105 @@
-import 'core-js/modules/esnext.async-iterator.for-each.js';
-import 'core-js/modules/esnext.iterator.for-each.js';
-import _jsx from '@babel/runtime/helpers/esm/jsx';
-import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
-import _objectWithoutProperties from '@babel/runtime/helpers/esm/objectWithoutProperties';
-import 'core-js/modules/esnext.async-iterator.map.js';
-import 'core-js/modules/esnext.iterator.map.js';
-import 'core-js/modules/esnext.async-iterator.filter.js';
-import 'core-js/modules/esnext.iterator.constructor.js';
-import 'core-js/modules/esnext.iterator.filter.js';
-import 'react';
-import DSSeparator from '@elliemae/ds-separator';
-import DSButton from '@elliemae/ds-button';
-import styled from 'styled-components';
-import { get } from '@elliemae/ds-utilities';
-import deferComponentRender from '@elliemae/ds-shared/defer-render-hoc';
-import useDataGrid from '@elliemae/ds-shared/useDataGrid';
-import { PaginationPlugin } from '../pagination/PaginationPlugin.js';
-import BodyCell from '../../components/BodyCell.js';
-import { defaultRenderers } from '../../components/renderers/index.js';
-import TableBody from '../../components/TableBody.js';
-import Table from '../../components/Table.js';
-import { ColumnSizingPlugin } from '../column-sizing/ColumnSizingPlugin.js';
-import { jsx, jsxs } from 'react/jsx-runtime';
-
-var _TableBody, _DSSeparator;
-
-const _excluded = ["instanceRef"],
-      _excluded2 = ["showAllRows"];
-
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); 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 = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-const DetailGrid = deferComponentRender(_ref => {
-  let {
-    parentGrid,
-    parentRowData,
-    rows
-  } = _ref;
-
-  const _parentGrid$props = parentGrid.props,
-        parentProps = _objectWithoutProperties(_parentGrid$props, _excluded);
-
-  const grid = useDataGrid(_objectSpread(_objectSpread({
-    uuid: parentGrid.getInstance().uuid
-  }, parentProps), {}, {
-    columns: parentGrid.getInstance().decoratedColumns.filter(col => !col.expandableColumn).map(c => _objectSpread(_objectSpread({}, c), {}, {
-      expandableColumn: false
-    })),
+import * as React from "react";
+import React2 from "react";
+import { DSSeparator } from "@elliemae/ds-separator";
+import { DSButton } from "@elliemae/ds-button";
+import styled from "styled-components";
+import { get } from "@elliemae/ds-utilities";
+import { deferComponentRender } from "@elliemae/ds-shared/defer-render-hoc";
+import { useDataGrid } from "@elliemae/ds-shared/useDataGrid";
+import { PaginationPlugin } from "../pagination";
+import { BodyCell } from "../../components/BodyCell";
+import { defaultRenderers } from "../../components/renderers";
+import { TableBody } from "../../components/TableBody";
+import { Table } from "../../components/Table";
+import { ColumnSizingPlugin } from "../column-sizing";
+const DetailGrid = deferComponentRender(({ parentGrid, parentRowData, rows }) => {
+  const { instanceRef, ...parentProps } = parentGrid.props;
+  const grid = useDataGrid({
+    uuid: parentGrid.getInstance().uuid,
+    ...parentProps,
+    columns: parentGrid.getInstance().decoratedColumns.filter((col) => !col.expandableColumn).map((c) => ({ ...c, expandableColumn: false })),
     rows,
     plugins: [ColumnSizingPlugin, PaginationPlugin],
     renderers: defaultRenderers,
     bindColumnsSizeTo: parentGrid.uuid,
-    numRowsVisible: 'all',
+    numRowsVisible: "all",
     paginated: true,
     pagination: {
       perPage: rows.length,
       conditionalPagination: true
     },
     parentRowData
-  }));
-  return /*#__PURE__*/jsx(Table, _objectSpread(_objectSpread({}, grid), {}, {
-    children: _TableBody || (_TableBody = /*#__PURE__*/_jsx(TableBody, {}))
-  }));
+  });
+  return /* @__PURE__ */ React2.createElement(Table, {
+    ...grid
+  }, /* @__PURE__ */ React2.createElement(TableBody, null));
 }, null);
-const DetailsWrapper = /*#__PURE__*/styled.span.withConfig({
-  componentId: "sc-1goa4zy-0"
-})(["flex:1;width:", "px;"], props => props.width);
-const DetailGridWrapper = /*#__PURE__*/styled.div.withConfig({
-  componentId: "sc-1goa4zy-1"
-})(["display:flex;height:calc(100% - ", "px);width:", "px;margin:12px 0;"], props => props.allRowsVisible ? 18 : 60, props => props.expandableGridDetailWidth);
-
-function ExpandedRow(_ref2) {
-  let {
-    parentGrid,
-    detailColumns,
-    rowData,
-    rows,
-    rowProps,
-    cellComponent: CellComponent,
-    rowComponent: RowComponent
-  } = _ref2;
+const DetailsWrapper = styled.span`
+  flex: 1;
+  width: ${(props) => props.width}px;
+`;
+const DetailGridWrapper = styled.div`
+  display: flex;
+  height: calc(100% - ${(props) => props.allRowsVisible ? 18 : 60}px);
+  width: ${(props) => props.expandableGridDetailWidth}px;
+  margin: 12px 0;
+`;
+function ExpandedRow({
+  parentGrid,
+  detailColumns,
+  rowData,
+  rows,
+  rowProps,
+  cellComponent: CellComponent,
+  rowComponent: RowComponent
+}) {
   const {
     decoratedColumns,
-    actions: {
-      toggleShowAllRows
-    },
-    state: {
-      expandedRows
-    },
+    actions: { toggleShowAllRows },
+    state: { expandedRows },
     props: {
       rowKey,
-      showMoreRowsText = 'SHOW ALL ROWS',
-      showLessRowsText = 'SHOW LESS ROWS',
+      showMoreRowsText = "SHOW ALL ROWS",
+      showLessRowsText = "SHOW LESS ROWS",
       expandableSubrowsVisible
     },
-    columnSizeService: {
-      expandableGridDetailWidth
-    }
+    columnSizeService: { expandableGridDetailWidth }
   } = parentGrid.getInstance();
-
-  const {
-    showAllRows
-  } = rowProps,
-        restRowProps = _objectWithoutProperties(rowProps, _excluded2);
-
-  return /*#__PURE__*/jsxs(RowComponent, _objectSpread(_objectSpread({}, restRowProps), {}, {
-    children: [/*#__PURE__*/_jsx(BodyCell, {
-      column: decoratedColumns[0],
-      columnIndex: 0,
-      component: CellComponent,
-      grid: parentGrid,
-      rowProps: _objectSpread({
-        rowData
-      }, rowProps)
-    }), /*#__PURE__*/_jsx(DetailsWrapper, {
-      width: expandableGridDetailWidth
-    }, void 0, /*#__PURE__*/_jsx(DetailGridWrapper, {
-      allRowsVisible: rows.length < expandableSubrowsVisible || get(expandedRows, [rowKey, 'showAllRows']),
-      expandableGridDetailWidth: expandableGridDetailWidth
-    }, void 0, _DSSeparator || (_DSSeparator = /*#__PURE__*/_jsx(DSSeparator, {
-      dashed: true,
-      orientation: "vertical"
-    })), /*#__PURE__*/_jsx(DetailGrid, {
-      detailColumns: detailColumns,
-      parentGrid: parentGrid.getInstance(),
-      parentRowData: rowData,
-      rows: showAllRows ? rows : (rows || []).slice(0, expandableSubrowsVisible)
-    })), rows.length > expandableSubrowsVisible && /*#__PURE__*/_jsx(DSButton, {
-      buttonType: "text",
-      labelText: showAllRows ? showLessRowsText : showMoreRowsText,
-      onClick: e => {
-        e.stopPropagation();
-        toggleShowAllRows(rowData);
-      },
-      style: {
-        marginBottom: '10px'
-      }
-    }))]
-  }));
+  const { showAllRows, ...restRowProps } = rowProps;
+  return /* @__PURE__ */ React2.createElement(RowComponent, {
+    ...restRowProps
+  }, /* @__PURE__ */ React2.createElement(BodyCell, {
+    column: decoratedColumns[0],
+    columnIndex: 0,
+    component: CellComponent,
+    grid: parentGrid,
+    rowProps: { rowData, ...rowProps }
+  }), /* @__PURE__ */ React2.createElement(DetailsWrapper, {
+    width: expandableGridDetailWidth
+  }, /* @__PURE__ */ React2.createElement(DetailGridWrapper, {
+    allRowsVisible: rows.length < expandableSubrowsVisible || get(expandedRows, [rowKey, "showAllRows"]),
+    expandableGridDetailWidth
+  }, /* @__PURE__ */ React2.createElement(DSSeparator, {
+    dashed: true,
+    orientation: "vertical"
+  }), /* @__PURE__ */ React2.createElement(DetailGrid, {
+    detailColumns,
+    parentGrid: parentGrid.getInstance(),
+    parentRowData: rowData,
+    rows: showAllRows ? rows : (rows || []).slice(0, expandableSubrowsVisible)
+  })), rows.length > expandableSubrowsVisible && /* @__PURE__ */ React2.createElement(DSButton, {
+    buttonType: "text",
+    labelText: showAllRows ? showLessRowsText : showMoreRowsText,
+    onClick: (e) => {
+      e.stopPropagation();
+      toggleShowAllRows(rowData);
+    },
+    style: { marginBottom: "10px" }
+  })));
 }
-
-export { ExpandedRow as default };
+var ExpandedRow_default = ExpandedRow;
+export {
+  ExpandedRow,
+  ExpandedRow_default as default
+};
+//# sourceMappingURL=ExpandedRow.js.map

package/esm/plugins/expandable-grid/ExpandedRow.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/plugins/expandable-grid/ExpandedRow.tsx"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable react/prop-types */\n/* eslint-disable max-lines */\nimport React from 'react';\nimport { DSSeparator } from '@elliemae/ds-separator';\nimport { DSButton } from '@elliemae/ds-button';\nimport styled from 'styled-components';\nimport { get } from '@elliemae/ds-utilities';\nimport { deferComponentRender } from '@elliemae/ds-shared/defer-render-hoc';\nimport { useDataGrid } from '@elliemae/ds-shared/useDataGrid';\nimport { PaginationPlugin } from '../pagination';\nimport { BodyCell } from '../../components/BodyCell';\nimport { defaultRenderers } from '../../components/renderers';\nimport { TableBody } from '../../components/TableBody';\nimport { Table } from '../../components/Table';\nimport { ColumnSizingPlugin } from '../column-sizing';\n\nconst DetailGrid = deferComponentRender(({ parentGrid, parentRowData, rows }) => {\n  const { instanceRef, ...parentProps } = parentGrid.props;\n  const grid = useDataGrid({\n    uuid: parentGrid.getInstance().uuid,\n    ...parentProps,\n    columns: parentGrid\n      .getInstance()\n      .decoratedColumns.filter((col) => !col.expandableColumn)\n      .map((c) => ({ ...c, expandableColumn: false })),\n    rows,\n    plugins: [ColumnSizingPlugin, PaginationPlugin],\n    renderers: defaultRenderers,\n    bindColumnsSizeTo: parentGrid.uuid,\n    numRowsVisible: 'all',\n    paginated: true,\n    pagination: {\n      perPage: rows.length,\n      conditionalPagination: true,\n    },\n    parentRowData,\n  });\n\n  return (\n    <Table {...grid}>\n      <TableBody />\n    </Table>\n  );\n}, null);\n\nconst DetailsWrapper = styled.span`\n  flex: 1;\n  width: ${(props) => props.width}px;\n`;\n\nconst DetailGridWrapper = styled.div`\n  display: flex;\n  height: calc(100% - ${(props) => (props.allRowsVisible ? 18 : 60)}px);\n  width: ${(props) => props.expandableGridDetailWidth}px;\n  margin: 12px 0;\n`;\n\nfunction ExpandedRow({\n  parentGrid,\n  detailColumns,\n  rowData,\n  rows,\n  rowProps,\n  cellComponent: CellComponent,\n  rowComponent: RowComponent,\n}) {\n  const {\n    decoratedColumns,\n    actions: { toggleShowAllRows },\n    state: { expandedRows },\n    props: {\n      rowKey,\n      showMoreRowsText = 'SHOW ALL ROWS',\n      showLessRowsText = 'SHOW LESS ROWS',\n      expandableSubrowsVisible,\n    },\n    columnSizeService: { expandableGridDetailWidth },\n  } = parentGrid.getInstance();\n\n  const { showAllRows, ...restRowProps } = rowProps;\n  return (\n    <RowComponent {...restRowProps}>\n      <BodyCell\n        column={decoratedColumns[0]}\n        columnIndex={0}\n        component={CellComponent}\n        grid={parentGrid}\n        rowProps={{ rowData, ...rowProps }}\n      />\n      <DetailsWrapper width={expandableGridDetailWidth}>\n        <DetailGridWrapper\n          allRowsVisible={rows.length < expandableSubrowsVisible || get(expandedRows, [rowKey, 'showAllRows'])}\n          expandableGridDetailWidth={expandableGridDetailWidth}\n        >\n          <DSSeparator dashed orientation=\"vertical\" />\n          <DetailGrid\n            detailColumns={detailColumns}\n            parentGrid={parentGrid.getInstance()}\n            parentRowData={rowData}\n            rows={showAllRows ? rows : (rows || []).slice(0, expandableSubrowsVisible)}\n          />\n        </DetailGridWrapper>\n        {rows.length > expandableSubrowsVisible && (\n          <DSButton\n            buttonType=\"text\"\n            labelText={showAllRows ? showLessRowsText : showMoreRowsText}\n            onClick={(e) => {\n              e.stopPropagation();\n              toggleShowAllRows(rowData);\n            }}\n            style={{ marginBottom: '10px' }}\n          />\n        )}\n      </DetailsWrapper>\n    </RowComponent>\n  );\n}\n\nexport { ExpandedRow };\nexport default ExpandedRow;\n"],
+  "mappings": "AAAA;ACEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA,MAAM,aAAa,qBAAqB,CAAC,EAAE,YAAY,eAAe,WAAW;AAC/E,QAAM,EAAE,gBAAgB,gBAAgB,WAAW;AACnD,QAAM,OAAO,YAAY;AAAA,IACvB,MAAM,WAAW,cAAc;AAAA,OAC5B;AAAA,IACH,SAAS,WACN,cACA,iBAAiB,OAAO,CAAC,QAAQ,CAAC,IAAI,kBACtC,IAAI,CAAC,MAAO,MAAK,GAAG,kBAAkB;AAAA,IACzC;AAAA,IACA,SAAS,CAAC,oBAAoB;AAAA,IAC9B,WAAW;AAAA,IACX,mBAAmB,WAAW;AAAA,IAC9B,gBAAgB;AAAA,IAChB,WAAW;AAAA,IACX,YAAY;AAAA,MACV,SAAS,KAAK;AAAA,MACd,uBAAuB;AAAA;AAAA,IAEzB;AAAA;AAGF,SACE,qCAAC,OAAD;AAAA,OAAW;AAAA,KACT,qCAAC,WAAD;AAAA,GAGH;AAEH,MAAM,iBAAiB,OAAO;AAAA;AAAA,WAEnB,CAAC,UAAU,MAAM;AAAA;AAG5B,MAAM,oBAAoB,OAAO;AAAA;AAAA,wBAET,CAAC,UAAW,MAAM,iBAAiB,KAAK;AAAA,WACrD,CAAC,UAAU,MAAM;AAAA;AAAA;AAI5B,qBAAqB;AAAA,EACnB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,eAAe;AAAA,EACf,cAAc;AAAA,GACb;AACD,QAAM;AAAA,IACJ;AAAA,IACA,SAAS,EAAE;AAAA,IACX,OAAO,EAAE;AAAA,IACT,OAAO;AAAA,MACL;AAAA,MACA,mBAAmB;AAAA,MACnB,mBAAmB;AAAA,MACnB;AAAA;AAAA,IAEF,mBAAmB,EAAE;AAAA,MACnB,WAAW;AAEf,QAAM,EAAE,gBAAgB,iBAAiB;AACzC,SACE,qCAAC,cAAD;AAAA,OAAkB;AAAA,KAChB,qCAAC,UAAD;AAAA,IACE,QAAQ,iBAAiB;AAAA,IACzB,aAAa;AAAA,IACb,WAAW;AAAA,IACX,MAAM;AAAA,IACN,UAAU,EAAE,YAAY;AAAA,MAE1B,qCAAC,gBAAD;AAAA,IAAgB,OAAO;AAAA,KACrB,qCAAC,mBAAD;AAAA,IACE,gBAAgB,KAAK,SAAS,4BAA4B,IAAI,cAAc,CAAC,QAAQ;AAAA,IACrF;AAAA,KAEA,qCAAC,aAAD;AAAA,IAAa,QAAM;AAAA,IAAC,aAAY;AAAA,MAChC,qCAAC,YAAD;AAAA,IACE;AAAA,IACA,YAAY,WAAW;AAAA,IACvB,eAAe;AAAA,IACf,MAAM,cAAc,OAAQ,SAAQ,IAAI,MAAM,GAAG;AAAA,OAGpD,KAAK,SAAS,4BACb,qCAAC,UAAD;AAAA,IACE,YAAW;AAAA,IACX,WAAW,cAAc,mBAAmB;AAAA,IAC5C,SAAS,CAAC,MAAM;AACd,QAAE;AACF,wBAAkB;AAAA;AAAA,IAEpB,OAAO,EAAE,cAAc;AAAA;AAAA;AASnC,IAAO,sBAAQ;",
+  "names": []
+}