@dhis2-ui/table 8.1.10 → 8.2.1

package/build/es/stacked-table/stacked-table.stories.js

@@ -8,29 +8,12 @@ import { StackedTableHead } from './stacked-table-head.js';
 import { StackedTableRowHead } from './stacked-table-row-head.js';
 import { StackedTableRow } from './stacked-table-row.js';
 import { StackedTable } from './stacked-table.js';
-const description = `
-Expresses tabular data such that each 'row' becomes a table section with the 'column' header in each cell. Multiple rows become multiple sections.
-
-Compose with StackedTable child components, as seen in the examples.
-
-\`\`\`js
-import {
-    StackedTable,
-    StackedTableBody,
-    StackedTableCell,
-    StackedTableCellHead,
-    StackedTableFoot,
-    StackedTableHead,
-    StackedTableRow,
-    StackedTableRowHead,
-} from 'dhis2/ui'
-\`\`\`
-`;
+const description = "\nExpresses tabular data such that each 'row' becomes a table section with the 'column' header in each cell. Multiple rows become multiple sections.\n\nCompose with StackedTable child components, as seen in the examples.\n\n```js\nimport {\n    StackedTable,\n    StackedTableBody,\n    StackedTableCell,\n    StackedTableCellHead,\n    StackedTableFoot,\n    StackedTableHead,\n    StackedTableRow,\n    StackedTableRowHead,\n} from 'dhis2/ui'\n```\n";
 
 const CustomCell = props => /*#__PURE__*/React.createElement("td", null, "Received props:", /*#__PURE__*/React.createElement("code", null, /*#__PURE__*/React.createElement("pre", null, JSON.stringify(props, null, 2))));
 
 export default {
-  title: 'Data Display/Stacked Table',
+  title: 'Stacked Table',
   component: StackedTable,
   parameters: {
     docs: {

package/build/es/stacked-table/stacked-table.test.js

@@ -11,20 +11,29 @@ import { StackedTableRowHead } from './stacked-table-row-head.js';
 import { StackedTableRow } from './stacked-table-row.js';
 import { StackedTable } from './stacked-table.js';
 
-const Table = ({
-  headerLabels,
-  bodyLabels
-}) => /*#__PURE__*/React.createElement(StackedTable, null, /*#__PURE__*/React.createElement(StackedTableHead, null, /*#__PURE__*/React.createElement(StackedTableRowHead, null, headerLabels.map(({
-  label,
-  ...props
-}, index) => /*#__PURE__*/React.createElement(StackedTableCellHead, _extends({}, props, {
-  key: label + index
-}), label)))), /*#__PURE__*/React.createElement(StackedTableBody, null, /*#__PURE__*/React.createElement(StackedTableRow, null, bodyLabels.map(({
-  label,
-  ...props
-}) => /*#__PURE__*/React.createElement(StackedTableCell, _extends({}, props, {
-  key: label
-}), label)))));
+const Table = _ref => {
+  let {
+    headerLabels,
+    bodyLabels
+  } = _ref;
+  return /*#__PURE__*/React.createElement(StackedTable, null, /*#__PURE__*/React.createElement(StackedTableHead, null, /*#__PURE__*/React.createElement(StackedTableRowHead, null, headerLabels.map((_ref2, index) => {
+    let {
+      label,
+      ...props
+    } = _ref2;
+    return /*#__PURE__*/React.createElement(StackedTableCellHead, _extends({}, props, {
+      key: label + index
+    }), label);
+  }))), /*#__PURE__*/React.createElement(StackedTableBody, null, /*#__PURE__*/React.createElement(StackedTableRow, null, bodyLabels.map(_ref3 => {
+    let {
+      label,
+      ...props
+    } = _ref3;
+    return /*#__PURE__*/React.createElement(StackedTableCell, _extends({}, props, {
+      key: label
+    }), label);
+  }))));
+};
 
 describe('StackedTable', () => {
   const headerLabels = [{
@@ -98,7 +107,7 @@ describe('StackedTable', () => {
     const colSpan = 3;
     const originalHeaderLabel = headerLabels[indexWithColspan];
     const headerLabelsWithColspan = [...headerLabels.slice(0, indexWithColspan), { ...originalHeaderLabel,
-      colSpan: `${colSpan}`
+      colSpan: "".concat(colSpan)
     }, ...headerLabels.slice(indexWithColspan + colSpan)];
     const table = mount( /*#__PURE__*/React.createElement(Table, {
       headerLabels: headerLabelsWithColspan,

package/build/es/stacked-table/table.js

@@ -2,17 +2,20 @@ import _JSXStyle from "styled-jsx/style";
 import { colors } from '@dhis2/ui-constants';
 import PropTypes from 'prop-types';
 import React from 'react';
-export const Table = ({
-  children,
-  className,
-  dataTest
-}) => /*#__PURE__*/React.createElement("table", {
-  "data-test": dataTest,
-  className: _JSXStyle.dynamic([["4278890465", [colors.white, colors.grey900]]]) + " " + (className || "")
-}, children, /*#__PURE__*/React.createElement(_JSXStyle, {
-  id: "4278890465",
-  dynamic: [colors.white, colors.grey900]
-}, [`table.__jsx-style-dynamic-selector{display:block;border:0;background-color:${colors.white};min-width:100%;text-align:left;border-collapse:collapse;vertical-align:top;color:${colors.grey900};}`]));
+export const Table = _ref => {
+  let {
+    children,
+    className,
+    dataTest
+  } = _ref;
+  return /*#__PURE__*/React.createElement("table", {
+    "data-test": dataTest,
+    className: _JSXStyle.dynamic([["4278890465", [colors.white, colors.grey900]]]) + " " + (className || "")
+  }, children, /*#__PURE__*/React.createElement(_JSXStyle, {
+    id: "4278890465",
+    dynamic: [colors.white, colors.grey900]
+  }, ["table.__jsx-style-dynamic-selector{display:block;border:0;background-color:".concat(colors.white, ";min-width:100%;text-align:left;border-collapse:collapse;vertical-align:top;color:").concat(colors.grey900, ";}")]));
+};
 Table.propTypes = {
   children: PropTypes.node.isRequired,
   className: PropTypes.string,

package/build/es/table/table-body.js

@@ -1,15 +1,18 @@
 import PropTypes from 'prop-types';
 import React from 'react';
-export const TableBody = ({
-  children,
-  className,
-  dataTest,
-  role
-}) => /*#__PURE__*/React.createElement("tbody", {
-  className: className,
-  "data-test": dataTest,
-  role: role
-}, children);
+export const TableBody = _ref => {
+  let {
+    children,
+    className,
+    dataTest,
+    role
+  } = _ref;
+  return /*#__PURE__*/React.createElement("tbody", {
+    className: className,
+    "data-test": dataTest,
+    role: role
+  }, children);
+};
 TableBody.defaultProps = {
   dataTest: 'dhis2-uicore-tablebody'
 };

package/build/es/table/table-cell-head.js

@@ -4,25 +4,28 @@ import PropTypes from 'prop-types';
 import React from 'react';
 const tableCellHeadStyles = ["th.jsx-1796049005{border-bottom:1px solid #e8edf2;font-size:14px;line-height:18px;padding:13px 12px;height:45px;}", ".dense.jsx-1796049005{padding:9px 12px;height:36px;}"];
 tableCellHeadStyles.__hash = "1796049005";
-export const TableCellHead = ({
-  role,
-  colSpan,
-  rowSpan,
-  dense,
-  children,
-  className,
-  dataTest
-}) => /*#__PURE__*/React.createElement("th", {
-  colSpan: colSpan,
-  rowSpan: rowSpan,
-  "data-test": dataTest,
-  role: role,
-  className: `jsx-${tableCellHeadStyles.__hash}` + " " + (cx({
-    dense
-  }, className) || "")
-}, children, /*#__PURE__*/React.createElement(_JSXStyle, {
-  id: tableCellHeadStyles.__hash
-}, tableCellHeadStyles));
+export const TableCellHead = _ref => {
+  let {
+    role,
+    colSpan,
+    rowSpan,
+    dense,
+    children,
+    className,
+    dataTest
+  } = _ref;
+  return /*#__PURE__*/React.createElement("th", {
+    colSpan: colSpan,
+    rowSpan: rowSpan,
+    "data-test": dataTest,
+    role: role,
+    className: "jsx-".concat(tableCellHeadStyles.__hash) + " " + (cx({
+      dense
+    }, className) || "")
+  }, children, /*#__PURE__*/React.createElement(_JSXStyle, {
+    id: tableCellHeadStyles.__hash
+  }, tableCellHeadStyles));
+};
 TableCellHead.defaultProps = {
   dataTest: 'dhis2-uicore-tablecellhead'
 };

package/build/es/table/table-cell.js

@@ -4,25 +4,28 @@ import PropTypes from 'prop-types';
 import React from 'react';
 const tableCellStyles = ["td.jsx-996330601{border-bottom:1px solid #e8edf2;font-size:14px;line-height:18px;padding:13px 12px;height:45px;}", ".dense.jsx-996330601{padding:9px 12px;height:36px;}"];
 tableCellStyles.__hash = "996330601";
-export const TableCell = ({
-  role,
-  className,
-  children,
-  colSpan,
-  rowSpan,
-  dense,
-  dataTest
-}) => /*#__PURE__*/React.createElement("td", {
-  colSpan: colSpan,
-  rowSpan: rowSpan,
-  "data-test": dataTest,
-  role: role,
-  className: `jsx-${tableCellStyles.__hash}` + " " + (cx({
-    dense
-  }, className) || "")
-}, children, /*#__PURE__*/React.createElement(_JSXStyle, {
-  id: tableCellStyles.__hash
-}, tableCellStyles));
+export const TableCell = _ref => {
+  let {
+    role,
+    className,
+    children,
+    colSpan,
+    rowSpan,
+    dense,
+    dataTest
+  } = _ref;
+  return /*#__PURE__*/React.createElement("td", {
+    colSpan: colSpan,
+    rowSpan: rowSpan,
+    "data-test": dataTest,
+    role: role,
+    className: "jsx-".concat(tableCellStyles.__hash) + " " + (cx({
+      dense
+    }, className) || "")
+  }, children, /*#__PURE__*/React.createElement(_JSXStyle, {
+    id: tableCellStyles.__hash
+  }, tableCellStyles));
+};
 TableCell.defaultProps = {
   dataTest: 'dhis2-uicore-tablecell'
 };

package/build/es/table/table-foot.js

@@ -1,15 +1,18 @@
 import PropTypes from 'prop-types';
 import React from 'react';
-export const TableFoot = ({
-  children,
-  className,
-  dataTest,
-  role
-}) => /*#__PURE__*/React.createElement("tfoot", {
-  className: className,
-  "data-test": dataTest,
-  role: role
-}, children);
+export const TableFoot = _ref => {
+  let {
+    children,
+    className,
+    dataTest,
+    role
+  } = _ref;
+  return /*#__PURE__*/React.createElement("tfoot", {
+    className: className,
+    "data-test": dataTest,
+    role: role
+  }, children);
+};
 TableFoot.defaultProps = {
   dataTest: 'dhis2-uicore-tablefoot'
 };

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

@@ -1,15 +1,18 @@
 import PropTypes from 'prop-types';
 import React from 'react';
-export const TableHead = ({
-  children,
-  className,
-  dataTest,
-  role
-}) => /*#__PURE__*/React.createElement("thead", {
-  className: className,
-  "data-test": dataTest,
-  role: role
-}, children);
+export const TableHead = _ref => {
+  let {
+    children,
+    className,
+    dataTest,
+    role
+  } = _ref;
+  return /*#__PURE__*/React.createElement("thead", {
+    className: className,
+    "data-test": dataTest,
+    role: role
+  }, children);
+};
 TableHead.defaultProps = {
   dataTest: 'dhis2-uicore-tablehead'
 };

package/build/es/table/table-row-head.js

@@ -1,18 +1,21 @@
 import PropTypes from 'prop-types';
 import React from 'react';
 import { TableRow } from './table-row.js';
-export const TableRowHead = ({
-  role,
-  children,
-  className,
-  dataTest,
-  suppressZebraStriping
-}) => /*#__PURE__*/React.createElement(TableRow, {
-  className: className,
-  dataTest: dataTest,
-  suppressZebraStriping: suppressZebraStriping,
-  role: role
-}, children);
+export const TableRowHead = _ref => {
+  let {
+    role,
+    children,
+    className,
+    dataTest,
+    suppressZebraStriping
+  } = _ref;
+  return /*#__PURE__*/React.createElement(TableRow, {
+    className: className,
+    dataTest: dataTest,
+    suppressZebraStriping: suppressZebraStriping,
+    role: role
+  }, children);
+};
 TableRowHead.defaultProps = {
   dataTest: 'dhis2-uicore-tablerowhead'
 };

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

@@ -5,13 +5,14 @@ import React, { useContext } from 'react';
 import { TableContext } from './table-context.js';
 const tableRowStyles = [".zebraStriping.jsx-3124144591:nth-child(even){background:#fbfcfd;}"];
 tableRowStyles.__hash = "3124144591";
-export const TableRow = ({
-  role,
-  children,
-  className,
-  dataTest,
-  suppressZebraStriping
-}) => {
+export const TableRow = _ref => {
+  let {
+    role,
+    children,
+    className,
+    dataTest,
+    suppressZebraStriping
+  } = _ref;
   const {
     suppressZebraStriping: suppressZebraStripingFromContext
   } = useContext(TableContext);
@@ -19,7 +20,7 @@ export const TableRow = ({
   return /*#__PURE__*/React.createElement("tr", {
     "data-test": dataTest,
     role: role,
-    className: `jsx-${tableRowStyles.__hash}` + " " + (cx(className, {
+    className: "jsx-".concat(tableRowStyles.__hash) + " " + (cx(className, {
       zebraStriping
     }) || "")
   }, children, /*#__PURE__*/React.createElement(_JSXStyle, {

package/build/es/table/table.js

@@ -4,23 +4,26 @@ import React from 'react';
 import { Provider } from './table-context.js';
 const tableStyles = ["table.jsx-2430604489{border:1px solid #e8edf2;background-color:#ffffff;min-width:100%;text-align:left;border-collapse:collapse;vertical-align:top;}"];
 tableStyles.__hash = "2430604489";
-export const Table = ({
-  role,
-  children,
-  className,
-  dataTest,
-  suppressZebraStriping
-}) => /*#__PURE__*/React.createElement(Provider, {
-  value: {
+export const Table = _ref => {
+  let {
+    role,
+    children,
+    className,
+    dataTest,
     suppressZebraStriping
-  }
-}, /*#__PURE__*/React.createElement("table", {
-  "data-test": dataTest,
-  role: role,
-  className: `jsx-${tableStyles.__hash}` + " " + (className || "")
-}, children, /*#__PURE__*/React.createElement(_JSXStyle, {
-  id: tableStyles.__hash
-}, tableStyles)));
+  } = _ref;
+  return /*#__PURE__*/React.createElement(Provider, {
+    value: {
+      suppressZebraStriping
+    }
+  }, /*#__PURE__*/React.createElement("table", {
+    "data-test": dataTest,
+    role: role,
+    className: "jsx-".concat(tableStyles.__hash) + " " + (className || "")
+  }, children, /*#__PURE__*/React.createElement(_JSXStyle, {
+    id: tableStyles.__hash
+  }, tableStyles)));
+};
 Table.defaultProps = {
   dataTest: 'dhis2-uicore-table'
 };

package/build/es/table/table.stories.js

@@ -10,22 +10,7 @@ import { TableRowHead } from './table-row-head.js';
 import { TableRow } from './table-row.js';
 import { Table } from './table.js';
 const subtitle = 'Used to display information in a standard, effective way.';
-const description = `
-Should be used with multiple Table-related child components - see the table and examples below.
-
-\`\`\`js
-import {
-    Table,
-    TableBody,
-    TableCell,
-    TableCellHead,
-    TableFoot,
-    TableHead,
-    TableRow,
-    TableRowHead,
-} from '@dhis2/ui'
-\`\`\`
-`;
+const description = "\nShould be used with multiple Table-related child components - see the table and examples below.\n\n```js\nimport {\n    Table,\n    TableBody,\n    TableCell,\n    TableCellHead,\n    TableFoot,\n    TableHead,\n    TableRow,\n    TableRowHead,\n} from '@dhis2/ui'\n```\n";
 
 const TableFooterButton = () => /*#__PURE__*/React.createElement("div", {
   className: "jsx-3056176987"
@@ -40,7 +25,7 @@ const TableButton = () => /*#__PURE__*/React.createElement(Button, {
 }, "Table button");
 
 export default {
-  title: 'Data Display/Table',
+  title: 'Table',
   component: Table,
   // Add subcomponents to the args table
   subcomponents: {

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@dhis2-ui/table",
-    "version": "8.1.10",
+    "version": "8.2.1",
     "description": "UI Table",
     "repository": {
         "type": "git",
@@ -33,8 +33,8 @@
     },
     "dependencies": {
         "@dhis2/prop-types": "^3.0.0-beta.1",
-        "@dhis2/ui-constants": "8.1.10",
-        "@dhis2/ui-icons": "8.1.10",
+        "@dhis2/ui-constants": "8.2.1",
+        "@dhis2/ui-icons": "8.2.1",
         "classnames": "^2.3.1",
         "prop-types": "^15.7.2"
     },