@hisptz/dhis2-analytics 1.0.4 → 1.0.6

package/build/cjs/components/Map/state/index.js

@@ -0,0 +1,23 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.MapPeriodContext = exports.MapOrgUnitContext = exports.MapLayersContext = void 0;
+var _react = require("react");
+const MapOrgUnitContext = /*#__PURE__*/(0, _react.createContext)({
+  orgUnitSelection: {
+    orgUnits: []
+  },
+  orgUnits: []
+});
+exports.MapOrgUnitContext = MapOrgUnitContext;
+const MapPeriodContext = /*#__PURE__*/(0, _react.createContext)({
+  periods: []
+});
+exports.MapPeriodContext = MapPeriodContext;
+const MapLayersContext = /*#__PURE__*/(0, _react.createContext)({
+  layers: [],
+  updateLayer: () => {}
+});
+exports.MapLayersContext = MapLayersContext;

package/build/cjs/components/Map/utils/colors.js

@@ -0,0 +1,78 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.isDarkColor = exports.getUniqueColor = exports.getContrastColor = exports.getColorScale = exports.getColorPalette = exports.getColorClasses = exports.defaultColorScaleName = exports.defaultColorScale = exports.defaultClasses = exports.cssColor = exports.colorScales = void 0;
+var _d3Color = require("d3-color");
+var _lodash = require("lodash");
+var _colors = require("../constants/colors");
+const colorbrewer = _colors.COLOR_PALETTES;
+
+// Returns a color brewer scale for a number of classes
+const getColorPalette = (scale, classes) => {
+  var _colorbrewer$scale;
+  return colorbrewer === null || colorbrewer === void 0 ? void 0 : (_colorbrewer$scale = colorbrewer[scale]) === null || _colorbrewer$scale === void 0 ? void 0 : _colorbrewer$scale[classes];
+};
+exports.getColorPalette = getColorPalette;
+const getColorClasses = palette => {
+  var _palette$split;
+  return palette === null || palette === void 0 ? void 0 : (_palette$split = palette.split(",")) === null || _palette$split === void 0 ? void 0 : _palette$split.length;
+};
+
+// Returns color scale name for a palette
+exports.getColorClasses = getColorClasses;
+const getColorScale = palette => {
+  const classes = palette.split(",").length;
+  return colorScales.find(name => {
+    var _colorbrewer$name$cla;
+    return ((_colorbrewer$name$cla = colorbrewer[name][classes]) === null || _colorbrewer$name$cla === void 0 ? void 0 : _colorbrewer$name$cla.join(",")) === palette;
+  });
+};
+exports.getColorScale = getColorScale;
+const defaultColorScaleName = "YlOrBr";
+exports.defaultColorScaleName = defaultColorScaleName;
+const defaultClasses = 5;
+exports.defaultClasses = defaultClasses;
+const defaultColorScale = getColorPalette(defaultColorScaleName, defaultClasses);
+
+// Correct colors not adhering to the css standard (add missing #)
+exports.defaultColorScale = defaultColorScale;
+const cssColor = color => {
+  if (!(0, _lodash.isString)(color)) {
+    return color;
+  } else if (color === "##normal") {
+    // ##normal is used in old map favorites
+    return null; // Will apply default color
+  }
+
+  return (/(^[0-9A-F]{6}$)|(^[0-9A-F]{3}$)/i.test(color) ? "#" : "") + color;
+};
+
+// Returns an unique color (first from an array, then random but still unique)
+exports.cssColor = cssColor;
+const getUniqueColor = defaultColors => {
+  const colors = [...defaultColors];
+  function randomColor() {
+    const color = "#000000".replace(/0/g, () => (~~(Math.random() * 16)).toString(16));
+
+    // Recursive until color is unique
+    if (colors.includes(color)) {
+      return randomColor();
+    }
+    colors.push(color);
+    return color;
+  }
+  return index => colors[index] || randomColor();
+};
+
+// Returns true if a color is dark
+exports.getUniqueColor = getUniqueColor;
+const isDarkColor = color => (0, _d3Color.hcl)(color).l < 70;
+
+// Returns constrasting color
+exports.isDarkColor = isDarkColor;
+const getContrastColor = color => isDarkColor(color) ? "#fff" : "#000";
+exports.getContrastColor = getContrastColor;
+const colorScales = ["YlOrBr", "Reds", "YlGn", "Greens", "Blues", "BuPu", "RdPu", "PuRd", "Greys", "YlOrBr_reverse", "Reds_reverse", "YlGn_reverse", "Greens_reverse", "Blues_reverse", "BuPu_reverse", "RdPu_reverse", "PuRd_reverse", "Greys_reverse", "PuOr", "BrBG", "PRGn", "PiYG", "RdBu", "RdGy", "RdYlBu", "Spectral", "RdYlGn", "Paired", "Pastel1", "Set1", "Set3"];
+exports.colorScales = colorScales;

package/build/cjs/components/Map/utils/helpers.js

@@ -0,0 +1,25 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.getIcon = getIcon;
+exports.getIconUrl = getIconUrl;
+exports.getLongestTextLength = void 0;
+var _leaflet = _interopRequireDefault(require("leaflet"));
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+// Get the longest text length from an object property in an array
+
+const getLongestTextLength = (array, key) => array.reduce((text, curr) => curr[key] && String(curr[key]).length > text.length ? String(curr[key]) : text, "").length;
+exports.getLongestTextLength = getLongestTextLength;
+function getIconUrl(icon, _ref) {
+  let {
+    baseUrl
+  } = _ref;
+  return `${baseUrl}/images/orgunitgroup/${icon !== null && icon !== void 0 ? icon : "01.png"}`;
+}
+function getIcon(url) {
+  return new _leaflet.default.Icon({
+    iconUrl: url
+  });
+}

package/build/cjs/components/Map/utils/map.js

@@ -0,0 +1,161 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.generateLegends = generateLegends;
+exports.getColorFromLegendSet = getColorFromLegendSet;
+exports.getLegendCount = getLegendCount;
+exports.getOrgUnitsSelection = getOrgUnitsSelection;
+exports.highlightFeature = highlightFeature;
+exports.resetHighlight = resetHighlight;
+exports.sanitizeDate = sanitizeDate;
+exports.sanitizeOrgUnits = sanitizeOrgUnits;
+exports.toGeoJson = toGeoJson;
+var _lodash = require("lodash");
+var _colors = require("./colors");
+function highlightFeature(e, style) {
+  const layer = e.target;
+  layer.setStyle(style);
+  // layer.bringToFront();
+}
+
+function resetHighlight(e, defaultStyle) {
+  const layer = e.target;
+  layer.setStyle(defaultStyle);
+  // layer.bringToBack();
+}
+
+function getColorFromLegendSet(legends, value) {
+  var _find;
+  if (!value) {
+    return "";
+  }
+  const legend = (_find = (0, _lodash.find)(legends !== null && legends !== void 0 ? legends : [], legend => (legend === null || legend === void 0 ? void 0 : legend.startValue) <= value && (legend === null || legend === void 0 ? void 0 : legend.endValue) >= value)) !== null && _find !== void 0 ? _find : {};
+  return legend.color ? legend.color : "transparent";
+}
+function getLegendCount(legend, data) {
+  const {
+    startValue,
+    endValue
+  } = legend;
+  return (0, _lodash.filter)(data, d => d.data >= startValue && d.data <= endValue).length;
+}
+function getOrgUnitsSelection(orgUnitSelection) {
+  var _orgUnitSelection$org, _orgUnitSelection$org2;
+  const orgUnits = [];
+  if (orgUnitSelection.userOrgUnit) {
+    orgUnits.push("USER_ORGUNIT");
+  }
+  if (orgUnitSelection.userSubUnit) {
+    orgUnits.push("USER_ORGUNIT_CHILDREN");
+  }
+  if (orgUnitSelection.userSubX2Unit) {
+    orgUnits.push("USER_ORGUNIT_GRANDCHILDREN");
+  }
+  if (!(0, _lodash.isEmpty)(orgUnitSelection.levels)) {
+    (0, _lodash.forEach)(orgUnitSelection.levels, level => orgUnits.push(`LEVEL-${level}`));
+  }
+  return [...orgUnits, ...((_orgUnitSelection$org = orgUnitSelection === null || orgUnitSelection === void 0 ? void 0 : (_orgUnitSelection$org2 = orgUnitSelection.orgUnits) === null || _orgUnitSelection$org2 === void 0 ? void 0 : _orgUnitSelection$org2.map(ou => `${ou.id}`)) !== null && _orgUnitSelection$org !== void 0 ? _orgUnitSelection$org : [])];
+}
+function sanitizeOrgUnits(metaData) {
+  if (metaData) {
+    var _metaData$dimensions, _metaData$dimensions$;
+    return metaData === null || metaData === void 0 ? void 0 : (_metaData$dimensions = metaData.dimensions) === null || _metaData$dimensions === void 0 ? void 0 : (_metaData$dimensions$ = _metaData$dimensions.ou) === null || _metaData$dimensions$ === void 0 ? void 0 : _metaData$dimensions$.map(ouId => {
+      var _metaData$items$ouId, _metaData$ouHierarchy;
+      return {
+        id: ouId,
+        name: metaData === null || metaData === void 0 ? void 0 : (_metaData$items$ouId = metaData.items[ouId]) === null || _metaData$items$ouId === void 0 ? void 0 : _metaData$items$ouId.name,
+        path: metaData === null || metaData === void 0 ? void 0 : (_metaData$ouHierarchy = metaData.ouHierarchy) === null || _metaData$ouHierarchy === void 0 ? void 0 : _metaData$ouHierarchy[ouId]
+      };
+    });
+  }
+  return [];
+}
+function toGeoJson(organisationUnits) {
+  return (0, _lodash.sortBy)(organisationUnits, "le").map(ou => {
+    try {
+      const coord = JSON.parse(ou.co);
+      let gpid = "";
+      let gppg = "";
+      let type = "Point";
+      if (ou.ty === 2) {
+        type = "Polygon";
+        if (ou.co.substring(0, 4) === "[[[[") {
+          type = "MultiPolygon";
+        }
+      }
+
+      // Grand parent
+      if ((0, _lodash.isString)(ou.pg) && ou.pg.length) {
+        const ids = (0, _lodash.compact)(ou.pg.split("/"));
+
+        // Grand parent id
+        if (ids.length >= 2) {
+          gpid = ids[ids.length - 2];
+        }
+
+        // Grand parent parent graph
+        if (ids.length > 2) {
+          gppg = "/" + ids.slice(0, ids.length - 2).join("/");
+        }
+      }
+      return {
+        type: "Feature",
+        id: ou.id,
+        geometry: {
+          type,
+          coordinates: coord
+        },
+        properties: {
+          type,
+          id: ou.id,
+          name: ou.na,
+          hasCoordinatesDown: ou.hcd,
+          hasCoordinatesUp: ou.hcu,
+          level: ou.le,
+          grandParentParentGraph: gppg,
+          grandParentId: gpid,
+          parentGraph: ou.pg,
+          parentId: ou.pi,
+          parentName: ou.pn,
+          dimensions: ou.dimensions
+        }
+      };
+    } catch (e) {
+      return {};
+    }
+  });
+}
+function sanitizeDate(startDate) {
+  var _startDate$split, _startDate$split$;
+  if ((startDate === null || startDate === void 0 ? void 0 : (_startDate$split = startDate.split("-")) === null || _startDate$split === void 0 ? void 0 : (_startDate$split$ = _startDate$split[0]) === null || _startDate$split$ === void 0 ? void 0 : _startDate$split$.length) < 4) {
+    var _startDate$split2, _startDate$split2$rev;
+    return startDate === null || startDate === void 0 ? void 0 : (_startDate$split2 = startDate.split("-")) === null || _startDate$split2 === void 0 ? void 0 : (_startDate$split2$rev = _startDate$split2.reverse()) === null || _startDate$split2$rev === void 0 ? void 0 : _startDate$split2$rev.join("-");
+  }
+  return startDate;
+}
+function generateLegends(maxValue, minValue, _ref) {
+  let {
+    classesCount,
+    colorClass
+  } = _ref;
+  const count = classesCount !== null && classesCount !== void 0 ? classesCount : _colors.defaultClasses;
+  const color = colorClass !== null && colorClass !== void 0 ? colorClass : _colors.defaultColorScaleName;
+  const colorScale = [...(0, _colors.getColorPalette)(color, count)].reverse();
+  const maxLegendValue = 5 * Math.ceil(maxValue / 5);
+  const range = maxLegendValue / count;
+  const values = [];
+  let legendColorsIterator = colorScale.length - 1;
+  for (let i = 0; i < maxLegendValue; i += range) {
+    const id = colorScale[legendColorsIterator];
+    values.push({
+      startValue: Math.floor(i),
+      endValue: Math.floor(i + range),
+      id,
+      color: id
+    });
+    legendColorsIterator--;
+  }
+  return values.reverse();
+}

package/build/cjs/components/SingleValueContainer/SingleValueContainer.stories.js

@@ -0,0 +1,127 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = exports.SingleValuesWithDecimalPlaces = exports.Default = exports.AnimatedSingleValue = exports.AnimatedAllValues = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _ = require(".");
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+const Template = args => /*#__PURE__*/_react.default.createElement(_.SingleValueContainer, args);
+const Default = Template.bind({});
+exports.Default = Default;
+Default.args = {
+  title: "PRIORITY INDICATORS",
+  singleValueItems: [{
+    label: "Total Bookings",
+    value: 136
+  }, {
+    label: "At least one dose",
+    value: 45,
+    percentage: 23,
+    color: "#0D47A1"
+  }, {
+    label: "Partially vaccinated",
+    value: 13,
+    percentage: 17,
+    color: "#0D47A1"
+  }, {
+    label: "Fully vaccinated",
+    value: 126,
+    percentage: 83,
+    color: "#0D47A1"
+  }, {
+    label: "Number of AEFI",
+    value: 26
+  }]
+};
+const AnimatedAllValues = Template.bind({});
+exports.AnimatedAllValues = AnimatedAllValues;
+AnimatedAllValues.args = {
+  title: "PRIORITY INDICATORS",
+  animationDuration: 1500,
+  animationDelay: 500,
+  singleValueItems: [{
+    label: "Total Bookings",
+    value: 136344
+  }, {
+    label: "At least one dose",
+    value: 4423,
+    percentage: 23,
+    color: "#0D47A1"
+  }, {
+    label: "Partially vaccinated",
+    value: 1394,
+    percentage: 17,
+    color: "#0D47A1"
+  }, {
+    label: "Fully vaccinated",
+    value: 12432,
+    percentage: 83,
+    color: "#0D47A1"
+  }, {
+    label: "Number of AEFI",
+    value: 26423
+  }]
+};
+const AnimatedSingleValue = Template.bind({});
+exports.AnimatedSingleValue = AnimatedSingleValue;
+AnimatedSingleValue.args = {
+  title: "PRIORITY INDICATORS",
+  singleValueItems: [{
+    label: "Total Bookings",
+    value: 13634244,
+    animationDuration: 1000,
+    animationDelay: 100
+  }, {
+    label: "At least one dose",
+    value: 45423,
+    percentage: 23,
+    color: "#0D47A1",
+    animationDuration: 1000,
+    animationDelay: 600
+  }, {
+    label: "Partially vaccinated",
+    value: 13434,
+    percentage: 17,
+    color: "#0D47A1",
+    animationDuration: 1000,
+    animationDelay: 1100
+  }, {
+    label: "Fully vaccinated",
+    value: 126432,
+    percentage: 83,
+    color: "#0D47A1",
+    animationDuration: 1000,
+    animationDelay: 1600
+  }, {
+    label: "Number of AEFI",
+    value: 268423,
+    animationDuration: 1000,
+    animationDelay: 2000
+  }]
+};
+const SingleValuesWithDecimalPlaces = Template.bind({});
+exports.SingleValuesWithDecimalPlaces = SingleValuesWithDecimalPlaces;
+SingleValuesWithDecimalPlaces.args = {
+  title: "ENROLLMENTS",
+  animationDuration: 1500,
+  animationDelay: 500,
+  singleValueItems: [{
+    label: "Number of Enrolled Clients",
+    value: 268423,
+    decimalPlaces: 3
+  }, {
+    label: "Number of Served Clients",
+    value: 268423,
+    decimalPlaces: 1
+  }]
+};
+var _default = {
+  title: "Components/Single Value Container",
+  component: _.SingleValueContainer,
+  decorators: [SingleValueStory => {
+    return /*#__PURE__*/_react.default.createElement(SingleValueStory, null);
+  }]
+};
+exports.default = _default;

package/build/cjs/components/SingleValueContainer/SingleValueContainer.test.js

@@ -0,0 +1,23 @@
+"use strict";
+
+var _react = require("@cypress/react");
+var _react2 = _interopRequireDefault(require("react"));
+var _ = require(".");
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+describe("Single Value Container Tests", () => {
+  it("should render", function () {
+    const arg = {
+      title: "PRIORITY INDICATORS",
+      singleValueItems: [{
+        label: "Total Bookings",
+        value: 136
+      }, {
+        label: "At least one dose",
+        value: 45,
+        percentage: 23,
+        color: "#0D47A1"
+      }]
+    };
+    (0, _react.mount)( /*#__PURE__*/_react2.default.createElement(_.SingleValueContainer, arg));
+  });
+});

package/build/cjs/components/SingleValueContainer/components/SingleValueItem/SingleValueItem.js

@@ -0,0 +1,54 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = SingleValueItem;
+var _ui = require("@dhis2/ui");
+var _lodash = require("lodash");
+var _react = _interopRequireDefault(require("react"));
+var _reactSpring = require("react-spring");
+var _SingleValueContainerModule = _interopRequireDefault(require("../../styles/SingleValueContainer.module.css"));
+var _SingleValuePercentage = _interopRequireDefault(require("./SingleValuePercentage"));
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function SingleValueItem(_ref) {
+  var _ref2, _ref3;
+  let {
+    label,
+    value,
+    color,
+    percentage,
+    animationDuration,
+    animationDelay,
+    globalAnimationDelay,
+    decimalPlaces,
+    globalAnimationDuration
+  } = _ref;
+  const numberFormatter = value => Intl.NumberFormat("en-US", {
+    notation: "compact",
+    maximumFractionDigits: decimalPlaces !== null && decimalPlaces !== void 0 ? decimalPlaces : 1
+  }).format(value);
+  const sanitizedValue = (0, _reactSpring.useSpring)({
+    val: value,
+    from: {
+      val: 0
+    },
+    config: {
+      duration: (_ref2 = animationDuration !== null && animationDuration !== void 0 ? animationDuration : globalAnimationDuration) !== null && _ref2 !== void 0 ? _ref2 : 1000
+    },
+    delay: (_ref3 = animationDelay !== null && animationDelay !== void 0 ? animationDelay : globalAnimationDelay) !== null && _ref3 !== void 0 ? _ref3 : 10
+  });
+  const tooltipContent = `${label}: ${value}`;
+  return /*#__PURE__*/_react.default.createElement("div", {
+    className: `${_SingleValueContainerModule.default["single-value-item"]} text-center`
+  }, /*#__PURE__*/_react.default.createElement("div", {
+    className: _SingleValueContainerModule.default["font-large"]
+  }, label), /*#__PURE__*/_react.default.createElement(_ui.Tooltip, {
+    content: (0, _lodash.capitalize)(tooltipContent)
+  }, /*#__PURE__*/_react.default.createElement(_reactSpring.animated.div, {
+    className: `${_SingleValueContainerModule.default["font-bold"]} ${_SingleValueContainerModule.default["font-xx-large"]} ${_SingleValueContainerModule.default["padding-top"]}`
+  }, sanitizedValue.val.to(value => numberFormatter(Math.floor(value))))), percentage ? /*#__PURE__*/_react.default.createElement(_SingleValuePercentage.default, {
+    color: color,
+    percentage: percentage
+  }) : /*#__PURE__*/_react.default.createElement("span", null));
+}

package/build/cjs/components/SingleValueContainer/components/SingleValueItem/SingleValuePercentage.js

@@ -0,0 +1,24 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = SingleValuePercentage;
+var _ui = require("@dhis2/ui");
+var _react = _interopRequireDefault(require("react"));
+var _SingleValueContainerModule = _interopRequireDefault(require("../../styles/SingleValueContainer.module.css"));
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function SingleValuePercentage(_ref) {
+  let {
+    percentage,
+    color
+  } = _ref;
+  const width = "100%";
+  return /*#__PURE__*/_react.default.createElement("div", {
+    className: "w-100"
+  }, /*#__PURE__*/_react.default.createElement(_ui.LinearLoader, {
+    className: _SingleValueContainerModule.default["percent-value"],
+    width: width,
+    amount: percentage
+  }));
+}

package/build/cjs/components/SingleValueContainer/index.js

@@ -0,0 +1,43 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.SingleValueContainer = SingleValueContainer;
+Object.defineProperty(exports, "SingleValueItem", {
+  enumerable: true,
+  get: function () {
+    return _SingleValueItem.default;
+  }
+});
+var _d2I18n = _interopRequireDefault(require("@dhis2/d2-i18n"));
+var _ui = require("@dhis2/ui");
+var _react = _interopRequireWildcard(require("react"));
+var _SingleValueItem = _interopRequireDefault(require("./components/SingleValueItem/SingleValueItem"));
+var _SingleValueContainerModule = _interopRequireDefault(require("./styles/SingleValueContainer.module.css"));
+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 ? 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); }
+function SingleValueContainer(_ref) {
+  let {
+    title,
+    singleValueItems,
+    animationDuration,
+    animationDelay
+  } = _ref;
+  return /*#__PURE__*/_react.default.createElement("div", {
+    className: "w-100 h-100"
+  }, /*#__PURE__*/_react.default.createElement(_ui.CssReset, null), /*#__PURE__*/_react.default.createElement(_react.Suspense, {
+    fallback: /*#__PURE__*/_react.default.createElement("div", null, _d2I18n.default.t("Loading ..."))
+  }, /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement("span", {
+    className: `${_SingleValueContainerModule.default["font-x-large"]} ${_SingleValueContainerModule.default["font-bold"]}`
+  }, title), /*#__PURE__*/_react.default.createElement("div", {
+    className: _SingleValueContainerModule.default["single-value-list"]
+  }, singleValueItems.map(singleValueItem => /*#__PURE__*/_react.default.createElement(_SingleValueItem.default, _extends({
+    key: `${singleValueItem.label}-${singleValueItem.value}`
+  }, singleValueItem, {
+    globalAnimationDuration: animationDuration,
+    globalAnimationDelay: animationDelay
+  })))))));
+}

package/build/cjs/components/SingleValueContainer/types/props.js

@@ -0,0 +1 @@
+"use strict";

package/build/cjs/dataProviders/map.js

@@ -0,0 +1,31 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = MapDataProvider;
+var _appRuntime = require("@dhis2/app-runtime");
+var _react = _interopRequireDefault(require("react"));
+var _map = _interopRequireDefault(require("../data/map.json"));
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function MapDataProvider(_ref) {
+  let {
+    children
+  } = _ref;
+  return /*#__PURE__*/_react.default.createElement(_appRuntime.CustomDataProvider, {
+    data: {
+      ..._map.default,
+      geoFeatures: async (type, query) => {
+        return _map.default.geoFeatures;
+      },
+      analytics: async (type, query) => {
+        var _query$params;
+        if (query !== null && query !== void 0 && (_query$params = query.params) !== null && _query$params !== void 0 && _query$params.skipData) {
+          return _map.default.analytics;
+        } else {
+          return _map.default.analyticsWithData;
+        }
+      }
+    }
+  }, children);
+}

package/build/cjs/index.js

@@ -0,0 +1,49 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+var _Map = require("./components/Map");
+Object.keys(_Map).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _Map[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _Map[key];
+    }
+  });
+});
+var _CircularProgressDashboard = require("./components/CircularProgressDashboard");
+Object.keys(_CircularProgressDashboard).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _CircularProgressDashboard[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _CircularProgressDashboard[key];
+    }
+  });
+});
+var _ChartAnalytics = require("./components/ChartAnalytics");
+Object.keys(_ChartAnalytics).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _ChartAnalytics[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _ChartAnalytics[key];
+    }
+  });
+});
+var _SingleValueContainer = require("./components/SingleValueContainer");
+Object.keys(_SingleValueContainer).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _SingleValueContainer[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _SingleValueContainer[key];
+    }
+  });
+});

package/build/cjs/index.test.js

@@ -0,0 +1,7 @@
+"use strict";
+
+describe('Just a test', function () {
+  test("", () => {
+    expect(true).toBe(true);
+  });
+});