@dhis2-ui/table 9.10.3 → 9.11.1-beta.1

package/build/cjs/data-table/data-table-row/data-table-row.js

@@ -4,34 +4,20 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.DataTableRow = void 0;
-
 var _propTypes = require("@dhis2/prop-types");
-
 var _classnames = _interopRequireDefault(require("classnames"));
-
 var _propTypes2 = _interopRequireDefault(require("prop-types"));
-
 var _react = _interopRequireWildcard(require("react"));
-
 var _index = require("../table-elements/index.js");
-
 var _dataTableRowStyles = _interopRequireDefault(require("./data-table-row.styles.js"));
-
 var _dragHandleCell = require("./drag-handle-cell.js");
-
 var _expandHandleCell = require("./expand-handle-cell.js");
-
 var _expandedRow = require("./expanded-row.js");
-
-function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
-
-function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
-function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-
-const DataTableRow = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
+const DataTableRow = exports.DataTableRow = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
   let {
     children,
     className,
@@ -51,9 +37,7 @@ const DataTableRow = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
     draggable,
     isHoveringExpandedContent
   });
-
   const childCount = _react.default.Children.count(children);
-
   const colSpan = String(draggable || expandableContent ? childCount + 1 : childCount);
   return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_index.TableRow, _extends({
     ref: ref,
@@ -73,7 +57,6 @@ const DataTableRow = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
     selected: selected
   }, expandableContent));
 });
-exports.DataTableRow = DataTableRow;
 DataTableRow.displayName = 'DataTableRow';
 DataTableRow.defaultProps = {
   dataTest: 'dhis2-uicore-datatablerow'
@@ -83,20 +66,15 @@ DataTableRow.propTypes = {
   children: _propTypes2.default.node,
   className: _propTypes2.default.string,
   dataTest: _propTypes2.default.string,
-
   /** Renders and additional table cell with drag icon and applies draggable styles */
   draggable: _propTypes2.default.bool,
-
   /** This content will be rendered into an additional row with fullwidth cell and the presence of this prop will display an additional table cell with expand icon */
   expandableContent: (0, _propTypes.requiredIf)(props => props.onExpandToggle, _propTypes2.default.node),
-
   /** Toggles expand icon (up/down) and expandable content visibility */
   expanded: _propTypes2.default.bool,
   role: _propTypes2.default.string,
-
   /** Adds a green background color */
   selected: _propTypes2.default.bool,
-
   /** Callback for expand icon cell clicks */
   onExpandToggle: (0, _propTypes.requiredIf)(props => props.expandableContent, _propTypes2.default.func)
 };

package/build/cjs/data-table/data-table-row/data-table-row.styles.js

@@ -4,19 +4,13 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-
 var _style = _interopRequireDefault(require("styled-jsx/style"));
-
 var _react = _interopRequireDefault(require("react"));
-
 var _uiConstants = require("@dhis2/ui-constants");
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
-var _default = {
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+var _default = exports.default = {
   styles: /*#__PURE__*/_react.default.createElement(_style.default, {
     id: "1795567040"
-  }, ["tr.isHoveringExpandedContent.jsx-1795567040>td{background-color:".concat(_uiConstants.colors.grey100, ";}"), "tr.isHoveringExpandedContent.jsx-1795567040>th{background-color:".concat(_uiConstants.colors.grey300, ";}"), "tr.selected.isHoveringExpandedContent.jsx-1795567040>td{background-color:#cdeae8;}", "tr.expanded.jsx-1795567040>td{border-bottom-color:transparent;}", "tr.expanded.jsx-1795567040>td.bordered{border-bottom-color:".concat(_uiConstants.colors.grey300, ";}")]),
+  }, [`tr.isHoveringExpandedContent.jsx-1795567040>td{background-color:${_uiConstants.colors.grey100};}`, `tr.isHoveringExpandedContent.jsx-1795567040>th{background-color:${_uiConstants.colors.grey300};}`, "tr.selected.isHoveringExpandedContent.jsx-1795567040>td{background-color:#cdeae8;}", "tr.expanded.jsx-1795567040>td{border-bottom-color:transparent;}", `tr.expanded.jsx-1795567040>td.bordered{border-bottom-color:${_uiConstants.colors.grey300};}`]),
   className: "jsx-1795567040"
-};
-exports.default = _default;
+};

package/build/cjs/data-table/data-table-row/drag-handle-cell.js

@@ -4,17 +4,11 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.DragHandleCell = void 0;
-
 var _uiIcons = require("@dhis2/ui-icons");
-
 var _react = _interopRequireDefault(require("react"));
-
 var _index = require("../table-elements/index.js");
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 const DragHandleCell = () => /*#__PURE__*/_react.default.createElement(_index.TableDataCell, {
   width: "48px"
 }, /*#__PURE__*/_react.default.createElement(_uiIcons.IconDragHandle24, null));
-
 exports.DragHandleCell = DragHandleCell;

package/build/cjs/data-table/data-table-row/expand-handle-cell.js

@@ -4,28 +4,19 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.ExpandHandleCell = void 0;
-
 var _style = _interopRequireDefault(require("styled-jsx/style"));
-
 var _uiIcons = require("@dhis2/ui-icons");
-
 var _classnames = _interopRequireDefault(require("classnames"));
-
 var _propTypes = _interopRequireDefault(require("prop-types"));
-
 var _react = _interopRequireDefault(require("react"));
-
 var _index = require("../table-elements/index.js");
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 const pointer = {
   styles: /*#__PURE__*/_react.default.createElement(_style.default, {
     id: "927553068"
   }, ["td.jsx-927553068{cursor:pointer;}"]),
   className: "jsx-927553068"
 };
-
 const ExpandHandleCell = _ref => {
   let {
     expanded,
@@ -41,7 +32,6 @@ const ExpandHandleCell = _ref => {
     width: "48px"
   }, expanded ? /*#__PURE__*/_react.default.createElement(_uiIcons.IconChevronUp24, null) : /*#__PURE__*/_react.default.createElement(_uiIcons.IconChevronDown24, null), pointer.styles);
 };
-
 exports.ExpandHandleCell = ExpandHandleCell;
 ExpandHandleCell.propTypes = {
   expanded: _propTypes.default.bool,

package/build/cjs/data-table/data-table-row/expanded-row.js

@@ -4,31 +4,22 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.ExpandedRow = void 0;
-
 var _style = _interopRequireDefault(require("styled-jsx/style"));
-
 var _uiConstants = require("@dhis2/ui-constants");
-
 var _classnames = _interopRequireDefault(require("classnames"));
-
 var _propTypes = _interopRequireDefault(require("prop-types"));
-
 var _react = _interopRequireDefault(require("react"));
-
 var _index = require("../table-elements/index.js");
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 const {
   className: cellClassName,
   styles
 } = {
   styles: /*#__PURE__*/_react.default.createElement(_style.default, {
     id: "626485122"
-  }, ["tr.expanded:hover+tr>td.jsx-626485122{background-color:".concat(_uiConstants.colors.grey100, ";}"), "tr.expanded:active+tr>td.jsx-626485122{background-color:".concat(_uiConstants.colors.grey200, ";}"), "tr.selected.expanded:hover+tr.jsx-626485122>td.jsx-626485122{background-color:#cdeae8;}"]),
+  }, [`tr.expanded:hover+tr>td.jsx-626485122{background-color:${_uiConstants.colors.grey100};}`, `tr.expanded:active+tr>td.jsx-626485122{background-color:${_uiConstants.colors.grey200};}`, "tr.selected.expanded:hover+tr.jsx-626485122>td.jsx-626485122{background-color:#cdeae8;}"]),
   className: "jsx-626485122"
 };
-
 const ExpandedRow = _ref => {
   let {
     children,
@@ -42,16 +33,15 @@ const ExpandedRow = _ref => {
     onMouseOver: () => setIsHoveringExpandedContent(true),
     onMouseOut: () => setIsHoveringExpandedContent(false),
     className: (0, _classnames.default)({
-      ["".concat(className, "-expandedrow")]: !!className
+      [`${className}-expandedrow`]: !!className
     }),
     selected: selected,
-    dataTest: dataTest && "".concat(dataTest, "-expandedrow")
+    dataTest: dataTest && `${dataTest}-expandedrow`
   }, /*#__PURE__*/_react.default.createElement(_index.TableDataCell, {
     className: cellClassName,
     colSpan: colSpan
   }, children, styles));
 };
-
 exports.ExpandedRow = ExpandedRow;
 ExpandedRow.propTypes = {
   children: _propTypes.default.node,

package/build/cjs/data-table/data-table-toolbar.js

@@ -9,5 +9,4 @@ Object.defineProperty(exports, "DataTableToolbar", {
     return _index.TableToolbar;
   }
 });
-
 var _index = require("./table-elements/index.js");

package/build/cjs/data-table/{data-table.stories.e2e.js → data-table.e2e.stories.js}

@@ -4,29 +4,18 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = exports.FixedHeaderAndColumns = void 0;
-
 var _react = _interopRequireDefault(require("react"));
-
 var _dataTableBody = require("./data-table-body.js");
-
 var _dataTableCell = require("./data-table-cell.js");
-
 var _dataTableColumnHeader = require("./data-table-column-header/data-table-column-header.js");
-
 var _dataTableHead = require("./data-table-head.js");
-
 var _dataTableRow = require("./data-table-row/data-table-row.js");
-
 var _dataTable = require("./data-table.js");
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
-var _default = {
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+var _default = exports.default = {
   title: 'DataTable',
   component: _dataTable.DataTable
 };
-exports.default = _default;
-
 const FixedHeaderAndColumns = () => /*#__PURE__*/_react.default.createElement(_dataTable.DataTable, {
   layout: "fixed",
   width: "1000px",
@@ -130,5 +119,4 @@ const FixedHeaderAndColumns = () => /*#__PURE__*/_react.default.createElement(_d
   fixed: true,
   left: "120px"
 }, "fixed"), /*#__PURE__*/_react.default.createElement(_dataTableCell.DataTableCell, null, "scrolling bottom-left"), /*#__PURE__*/_react.default.createElement(_dataTableCell.DataTableCell, null, "..."), /*#__PURE__*/_react.default.createElement(_dataTableCell.DataTableCell, null, "..."), /*#__PURE__*/_react.default.createElement(_dataTableCell.DataTableCell, null, "..."), /*#__PURE__*/_react.default.createElement(_dataTableCell.DataTableCell, null, "..."), /*#__PURE__*/_react.default.createElement(_dataTableCell.DataTableCell, null, "scrolling bottom-right"))));
-
 exports.FixedHeaderAndColumns = FixedHeaderAndColumns;

package/build/cjs/data-table/data-table.js

@@ -4,22 +4,14 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.DataTable = void 0;
-
 var _classnames = _interopRequireDefault(require("classnames"));
-
 var _propTypes = _interopRequireDefault(require("prop-types"));
-
 var _react = _interopRequireWildcard(require("react"));
-
 var _index = require("./table-elements/index.js");
-
-function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
-
-function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
-const DataTable = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+const DataTable = exports.DataTable = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
   let {
     children,
     className,
@@ -31,7 +23,6 @@ const DataTable = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
     width
   } = _ref;
   const scrollable = !!(scrollHeight || scrollWidth);
-
   const table = /*#__PURE__*/_react.default.createElement(_index.Table, {
     borderless: scrollable,
     className: className,
@@ -41,15 +32,13 @@ const DataTable = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
     role: role,
     width: width
   }, children);
-
   return !scrollable ? table : /*#__PURE__*/_react.default.createElement(_index.TableScrollBox, {
     className: (0, _classnames.default)(className, 'tablescrollbox'),
-    dataTest: "".concat(dataTest, "-scrollbox"),
+    dataTest: `${dataTest}-scrollbox`,
     maxHeight: scrollHeight,
     maxWidth: scrollWidth
   }, table);
 });
-exports.DataTable = DataTable;
 DataTable.displayName = 'DataTable';
 DataTable.defaultProps = {
   dataTest: 'dhis2-uicore-datatable',
@@ -63,7 +52,6 @@ DataTable.propTypes = {
   children: _propTypes.default.node,
   className: _propTypes.default.string,
   dataTest: _propTypes.default.string,
-
   /**
    * Sets the `datatable-layout` property. Switching to `fixed` can prevent style
    * issues when dealing with a datatable with multiple frozen columns or when dealing
@@ -71,13 +59,10 @@ DataTable.propTypes = {
    */
   layout: _propTypes.default.oneOf(['auto', 'fixed', 'initial', 'inherit']),
   role: _propTypes.default.string,
-
   /** Sets max-height of scrollbox */
   scrollHeight: _propTypes.default.string,
-
   /** Sets max-width of scrollbox */
   scrollWidth: _propTypes.default.string,
-
   /**
    * Sets the `width` property. Providing an explicit width can prevent style
    * issues when dealing with horizontally scrolling datatables with a fixed layout.