@dhis2-ui/table 8.2.0 → 8.2.3

package/build/es/data-table/table-elements/table-head.js

@@ -2,18 +2,21 @@ function _extends() { _extends = Object.assign || function (target) { for (var i
 
 import PropTypes from 'prop-types';
 import React, { forwardRef } from 'react';
-export const TableHead = /*#__PURE__*/forwardRef(({
-  children,
-  className,
-  dataTest,
-  role,
-  ...props
-}, ref) => /*#__PURE__*/React.createElement("thead", _extends({}, props, {
-  className: className,
-  "data-test": dataTest,
-  ref: ref,
-  role: role
-}), children));
+export const TableHead = /*#__PURE__*/forwardRef((_ref, ref) => {
+  let {
+    children,
+    className,
+    dataTest,
+    role,
+    ...props
+  } = _ref;
+  return /*#__PURE__*/React.createElement("thead", _extends({}, props, {
+    className: className,
+    "data-test": dataTest,
+    ref: ref,
+    role: role
+  }), children);
+});
 TableHead.displayName = 'TableHead';
 TableHead.defaultProps = {
   dataTest: 'dhis2-uicore-tablehead'

package/build/es/data-table/table-elements/table-header-cell/table-header-cell.js

@@ -8,53 +8,56 @@ import PropTypes from 'prop-types';
 import React, { forwardRef } from 'react';
 import styles from './table-header-cell.styles.js';
 const AUTO = 'auto';
-export const TableHeaderCell = /*#__PURE__*/forwardRef(({
-  active,
-  align,
-  bordered,
-  children,
-  className,
-  colSpan,
-  dataTest,
-  error,
-  fixed,
-  large,
-  left,
-  muted,
-  rowSpan,
-  role,
-  scope,
-  staticStyle,
-  top,
-  valid,
-  width,
-  onClick,
-  ...props
-}, ref) => /*#__PURE__*/React.createElement("th", _extends({}, props, {
-  ref: ref,
-  colSpan: colSpan,
-  rowSpan: rowSpan,
-  onClick: onClick,
-  "data-test": dataTest,
-  role: role,
-  scope: scope,
-  className: `jsx-${styles.__hash}` + " " + _JSXStyle.dynamic([["1837557188", [left, top, align, width]]]) + " " + (cx(className, {
+export const TableHeaderCell = /*#__PURE__*/forwardRef((_ref, ref) => {
+  let {
     active,
+    align,
     bordered,
+    children,
+    className,
+    colSpan,
+    dataTest,
     error,
     fixed,
-    fixedHorizontally: fixed && left !== AUTO,
     large,
+    left,
     muted,
+    rowSpan,
+    role,
+    scope,
     staticStyle,
-    valid
-  }) || "")
-}), children, /*#__PURE__*/React.createElement(_JSXStyle, {
-  id: styles.__hash
-}, styles), /*#__PURE__*/React.createElement(_JSXStyle, {
-  id: "1837557188",
-  dynamic: [left, top, align, width]
-}, [`th.__jsx-style-dynamic-selector{left:${left};top:${top};text-align:${align};width:${width};}`])));
+    top,
+    valid,
+    width,
+    onClick,
+    ...props
+  } = _ref;
+  return /*#__PURE__*/React.createElement("th", _extends({}, props, {
+    ref: ref,
+    colSpan: colSpan,
+    rowSpan: rowSpan,
+    onClick: onClick,
+    "data-test": dataTest,
+    role: role,
+    scope: scope,
+    className: "jsx-".concat(styles.__hash) + " " + _JSXStyle.dynamic([["1837557188", [left, top, align, width]]]) + " " + (cx(className, {
+      active,
+      bordered,
+      error,
+      fixed,
+      fixedHorizontally: fixed && left !== AUTO,
+      large,
+      muted,
+      staticStyle,
+      valid
+    }) || "")
+  }), children, /*#__PURE__*/React.createElement(_JSXStyle, {
+    id: styles.__hash
+  }, styles), /*#__PURE__*/React.createElement(_JSXStyle, {
+    id: "1837557188",
+    dynamic: [left, top, align, width]
+  }, ["th.__jsx-style-dynamic-selector{left:".concat(left, ";top:").concat(top, ";text-align:").concat(align, ";width:").concat(width, ";}")]));
+});
 TableHeaderCell.displayName = 'TableHeaderCell';
 TableHeaderCell.defaultProps = {
   align: 'left',

package/build/es/data-table/table-elements/table-header-cell/table-header-cell.styles.js

@@ -1,4 +1,4 @@
 import { colors } from '@dhis2/ui-constants';
-const _defaultExport = [`th.jsx-3777082606{padding:12px;border:1px solid transparant;border-bottom:1px solid ${colors.grey300};color:${colors.grey800};background-color:${colors.grey200};font-weight:normal;font-size:14px;vertical-align:top;}`, "thead th.jsx-3777082606{padding:8px 12px;font-size:13px;}", `th.jsx-3777082606:last-of-type{border-right:1px solid ${colors.grey300};}`, `th.active.jsx-3777082606{background-color:${colors.white};outline:2px solid ${colors.grey600};outline-offset:-2px;}`, `th.bordered.jsx-3777082606{border-right:1px solid ${colors.grey300};}`, "th.bordered.jsx-3777082606:last-child{border-right:1px solid transparent;}", `th.error.jsx-3777082606{color:${colors.red700};}`, `th.muted.jsx-3777082606{color:${colors.grey700};font-style:italic;}`, `th.valid.jsx-3777082606{color:${colors.green700};}`, "th.large.jsx-3777082606{padding:14px 12px;font-size:16px;}", "thead th.large.jsx-3777082606{padding:13px 12px;font-size:15px;}", "th.fixed.jsx-3777082606{position:-webkit-sticky;position:sticky;z-index:1;}", "thead th.fixed.jsx-3777082606{position:-webkit-sticky;position:sticky;z-index:2;}", `thead th.fixedHorizontally.jsx-3777082606{z-index:3;background-color:${colors.grey300};}`, "tr:last-child th.jsx-3777082606{border-bottom:1px solid transparent;}", `thead tr:last-child th.jsx-3777082606{border-bottom:1px solid ${colors.grey300};}`, `tbody>tr:hover>th.jsx-3777082606:not(.staticStyle),tfoot>tr:hover>th.jsx-3777082606:not(.staticStyle){background-color:${colors.grey300};}`, `tbody>tr:active>th.jsx-3777082606:not(.staticStyle){background-color:${colors.grey200};}`, `tfoot>tr:first-child th.jsx-3777082606{border-top:1px solid ${colors.grey300};}`];
+const _defaultExport = ["th.jsx-3777082606{padding:12px;border:1px solid transparant;border-bottom:1px solid ".concat(colors.grey300, ";color:").concat(colors.grey800, ";background-color:").concat(colors.grey200, ";font-weight:normal;font-size:14px;vertical-align:top;}"), "thead th.jsx-3777082606{padding:8px 12px;font-size:13px;}", "th.jsx-3777082606:last-of-type{border-right:1px solid ".concat(colors.grey300, ";}"), "th.active.jsx-3777082606{background-color:".concat(colors.white, ";outline:2px solid ").concat(colors.grey600, ";outline-offset:-2px;}"), "th.bordered.jsx-3777082606{border-right:1px solid ".concat(colors.grey300, ";}"), "th.bordered.jsx-3777082606:last-child{border-right:1px solid transparent;}", "th.error.jsx-3777082606{color:".concat(colors.red700, ";}"), "th.muted.jsx-3777082606{color:".concat(colors.grey700, ";font-style:italic;}"), "th.valid.jsx-3777082606{color:".concat(colors.green700, ";}"), "th.large.jsx-3777082606{padding:14px 12px;font-size:16px;}", "thead th.large.jsx-3777082606{padding:13px 12px;font-size:15px;}", "th.fixed.jsx-3777082606{position:-webkit-sticky;position:sticky;z-index:1;}", "thead th.fixed.jsx-3777082606{position:-webkit-sticky;position:sticky;z-index:2;}", "thead th.fixedHorizontally.jsx-3777082606{z-index:3;background-color:".concat(colors.grey300, ";}"), "tr:last-child th.jsx-3777082606{border-bottom:1px solid transparent;}", "thead tr:last-child th.jsx-3777082606{border-bottom:1px solid ".concat(colors.grey300, ";}"), "tbody>tr:hover>th.jsx-3777082606:not(.staticStyle),tfoot>tr:hover>th.jsx-3777082606:not(.staticStyle){background-color:".concat(colors.grey300, ";}"), "tbody>tr:active>th.jsx-3777082606:not(.staticStyle){background-color:".concat(colors.grey200, ";}"), "tfoot>tr:first-child th.jsx-3777082606{border-top:1px solid ".concat(colors.grey300, ";}")];
 _defaultExport.__hash = "3777082606";
 export default _defaultExport;

package/build/es/data-table/table-elements/table-header-cell-action.js

@@ -5,23 +5,26 @@ function _extends() { _extends = Object.assign || function (target) { for (var i
 import { colors } from '@dhis2/ui-constants';
 import PropTypes from 'prop-types';
 import React, { forwardRef } from 'react';
-export const TableHeaderCellAction = /*#__PURE__*/forwardRef(({
-  onClick,
-  children,
-  className,
-  dataTest,
-  title,
-  ...props
-}, ref) => /*#__PURE__*/React.createElement("button", _extends({}, props, {
-  "data-test": dataTest,
-  onClick: onClick,
-  title: title,
-  ref: ref,
-  className: _JSXStyle.dynamic([["997535212", [colors.grey400]]]) + " " + (className || "")
-}), children, /*#__PURE__*/React.createElement(_JSXStyle, {
-  id: "997535212",
-  dynamic: [colors.grey400]
-}, ["button.__jsx-style-dynamic-selector{border:none;padding:0;background:transparent;width:24px;height:24px;display:-webkit-inline-box;display:-webkit-inline-flex;display:-ms-inline-flexbox;display:inline-flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;-webkit-flex-shrink:0;-ms-flex-negative:0;flex-shrink:0;cursor:pointer;border-radius:4px;margin-left:2px;}", `button.__jsx-style-dynamic-selector:hover,button.__jsx-style-dynamic-selector:focus-visible{background:${colors.grey400};}`, "button.__jsx-style-dynamic-selector:active,button.__jsx-style-dynamic-selector:focus{outline:none;}"])));
+export const TableHeaderCellAction = /*#__PURE__*/forwardRef((_ref, ref) => {
+  let {
+    onClick,
+    children,
+    className,
+    dataTest,
+    title,
+    ...props
+  } = _ref;
+  return /*#__PURE__*/React.createElement("button", _extends({}, props, {
+    "data-test": dataTest,
+    onClick: onClick,
+    title: title,
+    ref: ref,
+    className: _JSXStyle.dynamic([["997535212", [colors.grey400]]]) + " " + (className || "")
+  }), children, /*#__PURE__*/React.createElement(_JSXStyle, {
+    id: "997535212",
+    dynamic: [colors.grey400]
+  }, ["button.__jsx-style-dynamic-selector{border:none;padding:0;background:transparent;width:24px;height:24px;display:-webkit-inline-box;display:-webkit-inline-flex;display:-ms-inline-flexbox;display:inline-flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;-webkit-flex-shrink:0;-ms-flex-negative:0;flex-shrink:0;cursor:pointer;border-radius:4px;margin-left:2px;}", "button.__jsx-style-dynamic-selector:hover,button.__jsx-style-dynamic-selector:focus-visible{background:".concat(colors.grey400, ";}"), "button.__jsx-style-dynamic-selector:active,button.__jsx-style-dynamic-selector:focus{outline:none;}"]));
+});
 TableHeaderCellAction.displayName = 'TableHeaderCellAction';
 TableHeaderCellAction.defaultProps = {
   dataTest: 'dhis2-uicore-tableheadercellaction'

package/build/es/data-table/table-elements/table-row.js

@@ -5,25 +5,28 @@ function _extends() { _extends = Object.assign || function (target) { for (var i
 import cx from 'classnames';
 import PropTypes from 'prop-types';
 import React, { forwardRef } from 'react';
-export const TableRow = /*#__PURE__*/forwardRef(({
-  children,
-  className,
-  dataTest,
-  draggable,
-  role,
-  selected,
-  ...props
-}, ref) => /*#__PURE__*/React.createElement("tr", _extends({}, props, {
-  ref: ref,
-  "data-test": dataTest,
-  role: role,
-  className: "jsx-1820444258" + " " + (cx(className, {
+export const TableRow = /*#__PURE__*/forwardRef((_ref, ref) => {
+  let {
+    children,
+    className,
+    dataTest,
+    draggable,
+    role,
     selected,
-    draggable
-  }) || "")
-}), children, /*#__PURE__*/React.createElement(_JSXStyle, {
-  id: "1820444258"
-}, ["tbody>tr.draggable.jsx-1820444258,tfoot>tr.draggable.jsx-1820444258{cursor:move;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;}"])));
+    ...props
+  } = _ref;
+  return /*#__PURE__*/React.createElement("tr", _extends({}, props, {
+    ref: ref,
+    "data-test": dataTest,
+    role: role,
+    className: "jsx-1820444258" + " " + (cx(className, {
+      selected,
+      draggable
+    }) || "")
+  }), children, /*#__PURE__*/React.createElement(_JSXStyle, {
+    id: "1820444258"
+  }, ["tbody>tr.draggable.jsx-1820444258,tfoot>tr.draggable.jsx-1820444258{cursor:move;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;}"]));
+});
 TableRow.displayName = 'TableRow';
 TableRow.defaultProps = {
   dataTest: 'dhis2-uicore-tablerow'

package/build/es/data-table/table-elements/table-scroll-box.js

@@ -5,21 +5,24 @@ function _extends() { _extends = Object.assign || function (target) { for (var i
 import { colors } from '@dhis2/ui-constants';
 import PropTypes from 'prop-types';
 import React, { forwardRef } from 'react';
-export const TableScrollBox = /*#__PURE__*/forwardRef(({
-  children,
-  className,
-  dataTest,
-  maxHeight,
-  maxWidth,
-  ...props
-}, ref) => /*#__PURE__*/React.createElement("div", _extends({}, props, {
-  "data-test": dataTest,
-  ref: ref,
-  className: _JSXStyle.dynamic([["2859562182", [colors.grey300, maxHeight, maxWidth]]]) + " " + (className || "")
-}), children, /*#__PURE__*/React.createElement(_JSXStyle, {
-  id: "2859562182",
-  dynamic: [colors.grey300, maxHeight, maxWidth]
-}, [`div.__jsx-style-dynamic-selector{border:1px solid ${colors.grey300};border-top:none;box-sizing:border-box;max-height:${maxHeight};max-width:${maxWidth};overflow:auto;}`])));
+export const TableScrollBox = /*#__PURE__*/forwardRef((_ref, ref) => {
+  let {
+    children,
+    className,
+    dataTest,
+    maxHeight,
+    maxWidth,
+    ...props
+  } = _ref;
+  return /*#__PURE__*/React.createElement("div", _extends({}, props, {
+    "data-test": dataTest,
+    ref: ref,
+    className: _JSXStyle.dynamic([["2859562182", [colors.grey300, maxHeight, maxWidth]]]) + " " + (className || "")
+  }), children, /*#__PURE__*/React.createElement(_JSXStyle, {
+    id: "2859562182",
+    dynamic: [colors.grey300, maxHeight, maxWidth]
+  }, ["div.__jsx-style-dynamic-selector{border:1px solid ".concat(colors.grey300, ";border-top:none;box-sizing:border-box;max-height:").concat(maxHeight, ";max-width:").concat(maxWidth, ";overflow:auto;}")]));
+});
 TableScrollBox.displayName = 'TableScrollBox';
 TableScrollBox.defaultProps = {
   dataTest: 'dhis2-uicore-tablescrollbox',

package/build/es/data-table/table-elements/table-toolbar.js

@@ -6,20 +6,23 @@ import { colors, spacers } from '@dhis2/ui-constants';
 import cx from 'classnames';
 import PropTypes from 'prop-types';
 import React, { forwardRef } from 'react';
-export const TableToolbar = /*#__PURE__*/forwardRef(({
-  children,
-  className,
-  dataTest,
-  position,
-  ...props
-}, ref) => /*#__PURE__*/React.createElement("div", _extends({}, props, {
-  "data-test": dataTest,
-  ref: ref,
-  className: _JSXStyle.dynamic([["247244135", [colors.grey300, spacers.dp12]]]) + " " + (cx(className, position) || "")
-}), children, /*#__PURE__*/React.createElement(_JSXStyle, {
-  id: "247244135",
-  dynamic: [colors.grey300, spacers.dp12]
-}, [`div.__jsx-style-dynamic-selector{width:100%;box-sizing:border-box;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;border:1px solid ${colors.grey300};padding:${spacers.dp12};}`, "div.top.__jsx-style-dynamic-selector{border-bottom:none;}", "div.bottom.__jsx-style-dynamic-selector{border-top:none;}"])));
+export const TableToolbar = /*#__PURE__*/forwardRef((_ref, ref) => {
+  let {
+    children,
+    className,
+    dataTest,
+    position,
+    ...props
+  } = _ref;
+  return /*#__PURE__*/React.createElement("div", _extends({}, props, {
+    "data-test": dataTest,
+    ref: ref,
+    className: _JSXStyle.dynamic([["247244135", [colors.grey300, spacers.dp12]]]) + " " + (cx(className, position) || "")
+  }), children, /*#__PURE__*/React.createElement(_JSXStyle, {
+    id: "247244135",
+    dynamic: [colors.grey300, spacers.dp12]
+  }, ["div.__jsx-style-dynamic-selector{width:100%;box-sizing:border-box;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;border:1px solid ".concat(colors.grey300, ";padding:").concat(spacers.dp12, ";}"), "div.top.__jsx-style-dynamic-selector{border-bottom:none;}", "div.bottom.__jsx-style-dynamic-selector{border-top:none;}"]));
+});
 TableToolbar.displayName = 'TableToolbar';
 TableToolbar.defaultProps = {
   dataTest: 'dhis2-uicore-tabletoolbar',

package/build/es/data-table/table-elements/table.js

@@ -6,26 +6,29 @@ import { colors } from '@dhis2/ui-constants';
 import cx from 'classnames';
 import PropTypes from 'prop-types';
 import React, { forwardRef } from 'react';
-export const Table = /*#__PURE__*/forwardRef(({
-  children,
-  className,
-  dataTest,
-  layout,
-  role,
-  borderless,
-  width,
-  ...props
-}, ref) => /*#__PURE__*/React.createElement("table", _extends({}, props, {
-  "data-test": dataTest,
-  ref: ref,
-  role: role,
-  className: _JSXStyle.dynamic([["3140496910", [layout, width, colors.grey300]]]) + " " + (cx(className, {
-    borderless
-  }) || "")
-}), children, /*#__PURE__*/React.createElement(_JSXStyle, {
-  id: "3140496910",
-  dynamic: [layout, width, colors.grey300]
-}, [`table.__jsx-style-dynamic-selector{table-layout:${layout};border-collapse:separate;border-spacing:0;width:${width};box-sizing:border-box;border:1px solid ${colors.grey300};}`, "table.borderless.__jsx-style-dynamic-selector{border:none;}"])));
+export const Table = /*#__PURE__*/forwardRef((_ref, ref) => {
+  let {
+    children,
+    className,
+    dataTest,
+    layout,
+    role,
+    borderless,
+    width,
+    ...props
+  } = _ref;
+  return /*#__PURE__*/React.createElement("table", _extends({}, props, {
+    "data-test": dataTest,
+    ref: ref,
+    role: role,
+    className: _JSXStyle.dynamic([["3140496910", [layout, width, colors.grey300]]]) + " " + (cx(className, {
+      borderless
+    }) || "")
+  }), children, /*#__PURE__*/React.createElement(_JSXStyle, {
+    id: "3140496910",
+    dynamic: [layout, width, colors.grey300]
+  }, ["table.__jsx-style-dynamic-selector{table-layout:".concat(layout, ";border-collapse:separate;border-spacing:0;width:").concat(width, ";box-sizing:border-box;border:1px solid ").concat(colors.grey300, ";}"), "table.borderless.__jsx-style-dynamic-selector{border:none;}"]));
+});
 Table.displayName = 'Table';
 Table.defaultProps = {
   dataTest: 'dhis2-uicore-table',