@hisptz/dhis2-analytics 1.0.9 → 1.0.11

package/build/cjs/components/PivotTable/components/PivotTableCell.js

@@ -0,0 +1,40 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.PivotTableCell = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _PivotTableEngineContext = require("./PivotTableEngineContext.js");
+var _ui = require("@dhis2/ui");
+var _pivotTable = require("../constants/pivotTable");
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function _extends() { _extends = Object.assign ? Object.assign.bind() : 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 PivotTableCell = /*#__PURE__*/_react.default.forwardRef((_ref, ref) => {
+  let {
+    classes,
+    isHeader = false,
+    index,
+    isSortable,
+    sortBy,
+    children,
+    dataTest,
+    onSortClick,
+    style = {},
+    ...props
+  } = _ref;
+  const engine = (0, _PivotTableEngineContext.usePivotTableEngine)();
+  if (!engine) {
+    return null;
+  }
+  style.width = style.minWidth = style.maxWidth = style.width;
+  style.height = style.minHeight = style.maxHeight = style.height || engine.fontSize + engine.cellPadding * 2 + 2;
+  return isHeader ? /*#__PURE__*/_react.default.createElement(_ui.DataTableColumnHeader, _extends({
+    onSortIconClick: isSortable ? onSortClick : undefined,
+    sortDirection: isSortable ? (sortBy === null || sortBy === void 0 ? void 0 : sortBy.column) === index ? (sortBy === null || sortBy === void 0 ? void 0 : sortBy.order) === _pivotTable.SORT_ORDER_DESCENDING ? "desc" : sortBy.order === _pivotTable.SORT_ORDER_ASCENDING ? "asc" : "default" : undefined : undefined
+  }, props), children) : /*#__PURE__*/_react.default.createElement(_ui.DataTableCell, {
+    ref: ref
+  }, children);
+});
+exports.PivotTableCell = PivotTableCell;
+PivotTableCell.displayName = "PivotTableCell";

package/build/cjs/components/PivotTable/components/PivotTableClippedAxis.js

@@ -0,0 +1,26 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.PivotTableClippedAxis = void 0;
+var _react = _interopRequireDefault(require("react"));
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+const PivotTableClippedAxis = _ref => {
+  let {
+    axisClippingResult,
+    EmptyComponent,
+    ItemComponent
+  } = _ref;
+  return [axisClippingResult.pre ? /*#__PURE__*/_react.default.createElement(EmptyComponent, {
+    key: "pre",
+    size: axisClippingResult.pre
+  }) : null, axisClippingResult.indices.map(index => /*#__PURE__*/_react.default.createElement(ItemComponent, {
+    key: index,
+    index: index
+  })), axisClippingResult.post ? /*#__PURE__*/_react.default.createElement(EmptyComponent, {
+    key: "post",
+    size: axisClippingResult.post
+  }) : null];
+};
+exports.PivotTableClippedAxis = PivotTableClippedAxis;

package/build/cjs/components/PivotTable/components/PivotTableColumnHeaderCell.js

@@ -0,0 +1,71 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.PivotTableColumnHeaderCell = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _PivotTableCell = require("./PivotTableCell");
+var _PivotTableEngineContext = require("./PivotTableEngineContext");
+var _PivotTableHeaderCell = require("./PivotTableHeaderCell");
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+// @ts-nocheck
+
+const PivotTableColumnHeaderCell = _ref => {
+  var _engine$adaptiveClipp;
+  let {
+    clippingResult,
+    index,
+    level,
+    onSortByColumn,
+    sortBy
+  } = _ref;
+  const engine = (0, _PivotTableEngineContext.usePivotTableEngine)();
+  if (!engine) {
+    return null;
+  }
+  const width = (_engine$adaptiveClipp = engine.adaptiveClippingController.columns.sizes[engine.columnMap[index]]) === null || _engine$adaptiveClipp === void 0 ? void 0 : _engine$adaptiveClipp.size;
+  const height = engine.adaptiveClippingController.rows.headerSizes[level];
+  return /*#__PURE__*/_react.default.createElement(_PivotTableHeaderCell.PivotTableHeaderCell, {
+    axisClippingResult: clippingResult.columns,
+    index: index,
+    level: level,
+    getHeader: idx => engine.getColumnHeader(idx),
+    showHierarchy: engine.visualization.showHierarchy,
+    render: header => {
+      const isSortable = level === engine.columnDepth - 1 && header.span === 1 && engine.isSortable(index);
+      const style = {
+        cursor: isSortable ? "pointer" : "default",
+        width,
+        height,
+        whiteSpace: level === engine.columnDepth - 1 ? "pre-line" : "nowrap"
+      };
+      if (engine.options.fixColumnHeaders) {
+        style.top = level * (engine.fontSize + engine.cellPadding * 2 + 2);
+        // left value for the column header cells should be sum of row headers' width when engine.options.fixRowHeaders is true
+        style.left = engine.options.fixRowHeaders ? engine.rowHeaderPixelWidth : 0;
+      }
+      return /*#__PURE__*/_react.default.createElement(_PivotTableCell.PivotTableCell, {
+        index: index,
+        isSortable: isSortable,
+        sortOrder: sortBy,
+        onSortClick: isSortable ? () => onSortByColumn(index) : undefined,
+        isHeader: true,
+        classes: [header.label && header.label !== "Total" && header.label !== "Subtotal" // TODO: Actually look up the column type!
+        ? "column-header" : "empty-header", {
+          "fixed-header": engine.options.fixColumnHeaders
+        }],
+        colSpan: header.span,
+        title: header.label,
+        style: style,
+        onClick: isSortable ? () => onSortByColumn(index) : undefined
+      }, /*#__PURE__*/_react.default.createElement("div", {
+        className: "column-header-inner"
+      }, /*#__PURE__*/_react.default.createElement("span", {
+        className: "column-header-label",
+        "data-test": "visualization-column-header"
+      }, header.label)));
+    }
+  });
+};
+exports.PivotTableColumnHeaderCell = PivotTableColumnHeaderCell;

package/build/cjs/components/PivotTable/components/PivotTableColumnHeaders.js

@@ -0,0 +1,60 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.PivotTableColumnHeaders = void 0;
+var _times = _interopRequireDefault(require("lodash/times"));
+var _react = _interopRequireDefault(require("react"));
+var _PivotTableClippedAxis = require("./PivotTableClippedAxis");
+var _PivotTableColumnHeaderCell = require("./PivotTableColumnHeaderCell");
+var _PivotTableDimensionLabelCell = require("./PivotTableDimensionLabelCell");
+var _PivotTableEmptyCell = require("./PivotTableEmptyCell");
+var _PivotTableEngineContext = require("./PivotTableEngineContext");
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+const PivotTableColumnHeaders = _ref => {
+  let {
+    clippingResult,
+    onSortByColumn,
+    sortBy
+  } = _ref;
+  const engine = (0, _PivotTableEngineContext.usePivotTableEngine)();
+  if (!engine) {
+    return null;
+  }
+  const columns = (0, _times.default)(engine.columnDepth, x => x);
+  const rows = (0, _times.default)(engine.rowDepth, x => x);
+  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, columns.map(columnLevel => /*#__PURE__*/_react.default.createElement("tr", {
+    key: columnLevel
+  }, rows.map(rowLevel => /*#__PURE__*/_react.default.createElement(_PivotTableDimensionLabelCell.PivotTableDimensionLabelCell, {
+    key: rowLevel,
+    rowLevel: rowLevel,
+    columnLevel: columnLevel
+  })), /*#__PURE__*/_react.default.createElement(_PivotTableClippedAxis.PivotTableClippedAxis, {
+    axisClippingResult: clippingResult.columns,
+    EmptyComponent: _ref2 => {
+      let {
+        size
+      } = _ref2;
+      return /*#__PURE__*/_react.default.createElement(_PivotTableEmptyCell.PivotTableEmptyCell, {
+        classes: "column-header",
+        style: {
+          minWidth: size
+        }
+      });
+    },
+    ItemComponent: _ref3 => {
+      let {
+        index
+      } = _ref3;
+      return /*#__PURE__*/_react.default.createElement(_PivotTableColumnHeaderCell.PivotTableColumnHeaderCell, {
+        clippingResult: clippingResult,
+        index: index,
+        level: columnLevel,
+        onSortByColumn: onSortByColumn,
+        sortBy: sortBy
+      });
+    }
+  }))));
+};
+exports.PivotTableColumnHeaders = PivotTableColumnHeaders;

package/build/cjs/components/PivotTable/components/PivotTableContainer.js

@@ -0,0 +1,33 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.PivotTableContainer = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _PivotTableEngineContext = require("./PivotTableEngineContext");
+var _ui = require("@dhis2/ui");
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+const PivotTableContainer = /*#__PURE__*/_react.default.forwardRef((_ref, ref) => {
+  let {
+    width,
+    height,
+    children,
+    tableProps
+  } = _ref;
+  const engine = (0, _PivotTableEngineContext.usePivotTableEngine)();
+  if (!engine) {
+    return null;
+  }
+  return /*#__PURE__*/_react.default.createElement("div", {
+    className: "pivot-table-container",
+    style: {
+      width,
+      height
+    },
+    ref: ref,
+    "data-test": "visualization-container"
+  }, width === 0 || height === 0 ? null : /*#__PURE__*/_react.default.createElement(_ui.DataTable, tableProps !== null && tableProps !== void 0 ? tableProps : {}, children));
+});
+exports.PivotTableContainer = PivotTableContainer;
+PivotTableContainer.displayName = "PivotTableContainer";

package/build/cjs/components/PivotTable/components/PivotTableDimensionLabelCell.js

@@ -0,0 +1,77 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.PivotTableDimensionLabelCell = void 0;
+var _propTypes = _interopRequireDefault(require("prop-types"));
+var _react = _interopRequireDefault(require("react"));
+var _PivotTableCell = require("./PivotTableCell");
+var _PivotTableEngineContext = require("./PivotTableEngineContext");
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+// @ts-nocheck
+
+const PivotTableDimensionLabelCell = _ref => {
+  let {
+    rowLevel,
+    columnLevel
+  } = _ref;
+  const engine = (0, _PivotTableEngineContext.usePivotTableEngine)();
+  if (!engine) {
+    return null;
+  }
+  const colCount = engine.rowDepth;
+  const rowCount = engine.columnDepth;
+  let colSpan = 1,
+    rowSpan = 1,
+    label;
+  if (!engine.visualization.showDimensionLabels) {
+    if (rowLevel > 0 || columnLevel > 0) {
+      colSpan = rowSpan = 0;
+    } else {
+      colSpan = colCount;
+      rowSpan = rowCount;
+    }
+  } else {
+    label = engine.getDimensionLabel(rowLevel, columnLevel);
+    if (!label) {
+      if (rowLevel > 0 || columnLevel > 0) {
+        colSpan = rowSpan = 0;
+      } else {
+        colSpan = colCount - 1;
+        rowSpan = rowCount - 1;
+      }
+    }
+  }
+  if (!colSpan || !rowSpan) {
+    return null;
+  }
+  const width = engine.adaptiveClippingController.columns.headerSizes[rowLevel];
+  const height = engine.adaptiveClippingController.rows.headerSizes[columnLevel];
+  const style = {
+    width,
+    height
+  };
+  if (engine.options.fixColumnHeaders || engine.options.fixRowHeaders) {
+    style.zIndex = engine.options.fixColumnHeaders && engine.options.fixRowHeaders ? 2 : 1;
+    style.top = engine.options.fixColumnHeaders ? columnLevel * (engine.fontSize + engine.cellPadding * 2 + 2) : 0;
+    style.left = engine.options.fixRowHeaders ?
+    // calculate the width of all row header cells on the left of current cell
+    engine.adaptiveClippingController.columns.headerSizes.slice(0, rowLevel).reduce((width, acc) => acc += width, 0) : 0;
+  }
+  return /*#__PURE__*/_react.default.createElement(_PivotTableCell.PivotTableCell, {
+    isHeader: true,
+    classes: ["empty-header", "column-header", {
+      "fixed-header": engine.options.fixColumnHeaders || engine.options.fixRowHeaders
+    }],
+    colSpan: colSpan,
+    rowSpan: rowSpan,
+    title: label,
+    style: style
+  }, label);
+};
+exports.PivotTableDimensionLabelCell = PivotTableDimensionLabelCell;
+PivotTableDimensionLabelCell.propTypes = {
+  columnLevel: _propTypes.default.number.isRequired,
+  rowLevel: _propTypes.default.number.isRequired
+};

package/build/cjs/components/PivotTable/components/PivotTableEmptyCell.js

@@ -0,0 +1,22 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.PivotTableEmptyCell = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _PivotTableCell = require("./PivotTableCell");
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function _extends() { _extends = Object.assign ? Object.assign.bind() : 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 PivotTableEmptyCell = /*#__PURE__*/_react.default.forwardRef((_ref, ref) => {
+  let {
+    onClick,
+    classes,
+    ...props
+  } = _ref;
+  return /*#__PURE__*/_react.default.createElement(_PivotTableCell.PivotTableCell, _extends({
+    ref: ref
+  }, props));
+});
+exports.PivotTableEmptyCell = PivotTableEmptyCell;
+PivotTableEmptyCell.displayName = "PivotTableEmptyCell";

package/build/cjs/components/PivotTable/components/PivotTableEmptyRow.js

@@ -0,0 +1,33 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.PivotTableEmptyRow = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _PivotTableCell = require("./PivotTableCell");
+var _PivotTableEngineContext = require("./PivotTableEngineContext");
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+const PivotTableEmptyRow = _ref => {
+  let {
+    height,
+    columns
+  } = _ref;
+  const engine = (0, _PivotTableEngineContext.usePivotTableEngine)();
+  if (!engine) {
+    return null;
+  }
+  return /*#__PURE__*/_react.default.createElement("tr", null, /*#__PURE__*/_react.default.createElement(_PivotTableCell.PivotTableCell, {
+    isHeader: true,
+    colSpan: engine.rowDepth,
+    style: {
+      height
+    },
+    classes: ["row-header", {
+      "fixed-header": engine.options.fixRowHeaders
+    }]
+  }), columns.map(i => /*#__PURE__*/_react.default.createElement(_PivotTableCell.PivotTableCell, {
+    key: i
+  })));
+};
+exports.PivotTableEmptyRow = PivotTableEmptyRow;

package/build/cjs/components/PivotTable/components/PivotTableEngineContext.js

@@ -0,0 +1,25 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.usePivotTableEngine = exports.Provider = exports.PivotTableEngineContext = void 0;
+var _react = _interopRequireWildcard(require("react"));
+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; }
+const PivotTableEngineContext = /*#__PURE__*/(0, _react.createContext)(null);
+exports.PivotTableEngineContext = PivotTableEngineContext;
+const Provider = _ref => {
+  let {
+    engine,
+    children
+  } = _ref;
+  return /*#__PURE__*/_react.default.createElement(PivotTableEngineContext.Provider, {
+    value: engine
+  }, children);
+};
+exports.Provider = Provider;
+const usePivotTableEngine = () => {
+  return (0, _react.useContext)(PivotTableEngineContext);
+};
+exports.usePivotTableEngine = usePivotTableEngine;

package/build/cjs/components/PivotTable/components/PivotTableHead.js

@@ -0,0 +1,35 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.PivotTableHead = void 0;
+var _propTypes = _interopRequireDefault(require("prop-types"));
+var _react = _interopRequireDefault(require("react"));
+var _PivotTableColumnHeaders = require("./PivotTableColumnHeaders.js");
+var _PivotTableTitleRows = require("./PivotTableTitleRows");
+var _ui = require("@dhis2/ui");
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+const PivotTableHead = _ref => {
+  let {
+    clippingResult,
+    width,
+    sortBy,
+    onSortByColumn
+  } = _ref;
+  return /*#__PURE__*/_react.default.createElement(_ui.TableHead, null, /*#__PURE__*/_react.default.createElement(_PivotTableTitleRows.PivotTableTitleRows, {
+    clippingResult: clippingResult,
+    width: width
+  }), /*#__PURE__*/_react.default.createElement(_PivotTableColumnHeaders.PivotTableColumnHeaders, {
+    clippingResult: clippingResult,
+    sortBy: sortBy,
+    onSortByColumn: onSortByColumn
+  }));
+};
+exports.PivotTableHead = PivotTableHead;
+PivotTableHead.propTypes = {
+  clippingResult: _propTypes.default.object.isRequired,
+  width: _propTypes.default.number.isRequired,
+  onSortByColumn: _propTypes.default.func.isRequired,
+  sortBy: _propTypes.default.object
+};

package/build/cjs/components/PivotTable/components/PivotTableHeaderCell.js

@@ -0,0 +1,37 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.PivotTableHeaderCell = void 0;
+var _propTypes = _interopRequireDefault(require("prop-types"));
+var _utils = require("../utils");
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+const PivotTableHeaderCell = _ref => {
+  let {
+    axisClippingResult,
+    index,
+    level,
+    getHeader,
+    render,
+    showHierarchy
+  } = _ref;
+  const header = (0, _utils.getHeaderForDisplay)({
+    start: axisClippingResult.indices[0],
+    count: axisClippingResult.indices.length,
+    index,
+    dimensionLevel: level,
+    getHeader,
+    showHierarchy
+  });
+  return !header ? null : render(header);
+};
+exports.PivotTableHeaderCell = PivotTableHeaderCell;
+PivotTableHeaderCell.propTypes = {
+  axisClippingResult: _propTypes.default.object.isRequired,
+  getHeader: _propTypes.default.func.isRequired,
+  index: _propTypes.default.number.isRequired,
+  level: _propTypes.default.number.isRequired,
+  render: _propTypes.default.func.isRequired,
+  showHierarchy: _propTypes.default.bool.isRequired
+};

package/build/cjs/components/PivotTable/components/PivotTableRow.js

@@ -0,0 +1,65 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.PivotTableRow = void 0;
+var _times = _interopRequireDefault(require("lodash/times"));
+var _propTypes = _interopRequireDefault(require("prop-types"));
+var _react = _interopRequireDefault(require("react"));
+var _PivotTableClippedAxis = require("./PivotTableClippedAxis.js");
+var _PivotTableEmptyCell = require("./PivotTableEmptyCell");
+var _PivotTableEngineContext = require("./PivotTableEngineContext");
+var _PivotTableRowHeaderCell = require("./PivotTableRowHeaderCell.js");
+var _PivotTableValueCell = require("./PivotTableValueCell");
+var _ui = require("@dhis2/ui");
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+const PivotTableRow = _ref => {
+  let {
+    clippingResult,
+    rowIndex,
+    onToggleContextualMenu
+  } = _ref;
+  const engine = (0, _PivotTableEngineContext.usePivotTableEngine)();
+  if (!engine) {
+    return null;
+  }
+  return /*#__PURE__*/_react.default.createElement(_ui.DataTableRow, null, (0, _times.default)(engine.rowDepth, x => x).map(rowLevel => /*#__PURE__*/_react.default.createElement(_PivotTableRowHeaderCell.PivotTableRowHeaderCell, {
+    key: rowLevel,
+    clippingResult: clippingResult,
+    rowIndex: rowIndex,
+    rowLevel: rowLevel
+  })), /*#__PURE__*/_react.default.createElement(_PivotTableClippedAxis.PivotTableClippedAxis, {
+    axisClippingResult: clippingResult.columns,
+    EmptyComponent: _ref2 => {
+      let {
+        size
+      } = _ref2;
+      return /*#__PURE__*/_react.default.createElement(_PivotTableEmptyCell.PivotTableEmptyCell, {
+        classes: "value",
+        style: {
+          width: size
+        }
+      });
+    },
+    ItemComponent: _ref3 => {
+      let {
+        index: columnIndex
+      } = _ref3;
+      return /*#__PURE__*/_react.default.createElement(_PivotTableValueCell.PivotTableValueCell, {
+        row: rowIndex,
+        column: columnIndex,
+        onToggleContextualMenu: onToggleContextualMenu
+      });
+    }
+  }));
+};
+exports.PivotTableRow = PivotTableRow;
+PivotTableRow.propTypes = {
+  clippingResult: _propTypes.default.shape({
+    columns: _propTypes.default.object.isRequired,
+    rows: _propTypes.default.object.isRequired
+  }).isRequired,
+  rowIndex: _propTypes.default.number.isRequired,
+  onToggleContextualMenu: _propTypes.default.func
+};

package/build/cjs/components/PivotTable/components/PivotTableRowHeaderCell.js

@@ -0,0 +1,49 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.PivotTableRowHeaderCell = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _PivotTableCell = require("./PivotTableCell");
+var _PivotTableEngineContext = require("./PivotTableEngineContext");
+var _PivotTableHeaderCell = require("./PivotTableHeaderCell.js");
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+const PivotTableRowHeaderCell = _ref => {
+  var _engine$adaptiveClipp;
+  let {
+    clippingResult,
+    rowIndex,
+    rowLevel
+  } = _ref;
+  const engine = (0, _PivotTableEngineContext.usePivotTableEngine)();
+  if (!engine) {
+    return null;
+  }
+  const width = engine.adaptiveClippingController.columns.headerSizes[rowLevel];
+  const height = (_engine$adaptiveClipp = engine.adaptiveClippingController.rows.sizes[engine.rowMap[rowIndex]]) === null || _engine$adaptiveClipp === void 0 ? void 0 : _engine$adaptiveClipp.size;
+  return /*#__PURE__*/_react.default.createElement(_PivotTableHeaderCell.PivotTableHeaderCell, {
+    axisClippingResult: clippingResult.rows,
+    index: rowIndex,
+    level: rowLevel,
+    getHeader: idx => engine.getRowHeader(idx),
+    showHierarchy: engine.visualization.showHierarchy,
+    render: header => /*#__PURE__*/_react.default.createElement(_PivotTableCell.PivotTableCell, {
+      isHeader: true,
+      classes: [header.label && header.label !== "Total" && header.label !== "Subtotal" ? "row-header" : "empty-header", header.includesHierarchy && "row-header-hierarchy", {
+        "fixed-header": engine.options.fixRowHeaders
+      }],
+      rowSpan: header.span,
+      title: header.label,
+      style: {
+        width,
+        height,
+        left: rowLevel > 0 ?
+        // calculate the width of all row header cells on the left of current cell
+        engine.adaptiveClippingController.columns.headerSizes.slice(0, rowLevel).reduce((width, acc) => acc += width, 0) : 0
+      },
+      dataTest: "visualization-row-header"
+    }, header.label)
+  });
+};
+exports.PivotTableRowHeaderCell = PivotTableRowHeaderCell;

package/build/cjs/components/PivotTable/components/PivotTableTitleRow.js

@@ -0,0 +1,52 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.PivotTableTitleRow = void 0;
+var _propTypes = _interopRequireDefault(require("prop-types"));
+var _react = _interopRequireWildcard(require("react"));
+var _PivotTableCell = require("./PivotTableCell");
+var _PivotTableEngineContext = require("./PivotTableEngineContext");
+var _ui = require("@dhis2/ui");
+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 PivotTableTitleRow = _ref => {
+  let {
+    title,
+    scrollPosition,
+    containerWidth,
+    totalWidth
+  } = _ref;
+  const engine = (0, _PivotTableEngineContext.usePivotTableEngine)();
+  if (!engine) {
+    return null;
+  }
+  const columnCount = engine.width + engine.rowDepth;
+  const [position, setPosition] = (0, _react.useState)(scrollPosition.x);
+  (0, _react.useEffect)(() => {
+    setPosition(Math.max(0, Math.min(scrollPosition.x, totalWidth - containerWidth)));
+  }, [containerWidth, scrollPosition.x, totalWidth]);
+  return /*#__PURE__*/_react.default.createElement(_ui.DataTableRow, null, /*#__PURE__*/_react.default.createElement(_PivotTableCell.PivotTableCell, {
+    isHeader: true,
+    classes: ["column-header", "title"],
+    colSpan: columnCount
+  }, /*#__PURE__*/_react.default.createElement("div", {
+    style: {
+      marginLeft: position,
+      maxWidth: containerWidth,
+      textAlign: "center"
+    },
+    "data-test": "visualization-title"
+  }, title)));
+};
+exports.PivotTableTitleRow = PivotTableTitleRow;
+PivotTableTitleRow.propTypes = {
+  containerWidth: _propTypes.default.number.isRequired,
+  scrollPosition: _propTypes.default.shape({
+    x: _propTypes.default.number.isRequired
+  }).isRequired,
+  title: _propTypes.default.string.isRequired,
+  totalWidth: _propTypes.default.number.isRequired
+};