@dhis2/analytics 20.6.4 → 21.0.0-alpha.3

package/build/cjs/locales/en/translations.json

@@ -101,6 +101,21 @@
     "Options": "Options",
     "Hide": "Hide",
     "Update": "Update",
+    "{{count}} org units": "{{count}} org unit",
+    "{{count}} org units_plural": "{{count}} org units",
+    "{{count}} levels": "{{count}} level",
+    "{{count}} levels_plural": "{{count}} levels",
+    "{{count}} groups": "{{count}} group",
+    "{{count}} groups_plural": "{{count}} groups",
+    "{{count}} user org units": "{{count}} user org unit",
+    "{{count}} user org units_plural": "{{count}} user org units",
+    "Nothing selected": "Nothing selected",
+    "User organisation unit": "User organisation unit",
+    "User sub-units": "User sub-units",
+    "User sub-x2-units": "User sub-x2-units",
+    "Select a level": "Select a level",
+    "Select a group": "Select a group",
+    "Deselect all": "Deselect all",
     "Period type": "Period type",
     "Year": "Year",
     "Select year": "Select year",

package/build/cjs/locales/ru/translations.json

@@ -76,7 +76,7 @@
     "There was a problem loading items. Try again or contact your system administrator.": "",
     "No items found. Create a new to get started.": "",
     "No items found. Try adjusting your search or filter options to find what you're looking for.": "",
-    "Create new": "",
+    "Create new": "Создать новый",
     "Open a visualization": "",
     "Loading visualizations": "",
     "Couldn't load visualizations": "",

package/build/cjs/modules/axis.js

@@ -44,7 +44,7 @@ const getAxisNameByLayoutType = (axisId, layoutType) => {
   const name = getAxisNamesByLayoutType(layoutType)[axisId];
 
   if (!name) {
-    throw new Error("".concat(axisId, " is not a valid axis id"));
+    throw new Error(`${axisId} is not a valid axis id`);
   }
 
   return name;

package/build/cjs/modules/layoutUiRules/rules.js

@@ -111,7 +111,7 @@ const getRulesByVisType = visType => {
   const rules = visTypeToRules[visType];
 
   if (!rules) {
-    throw new Error("".concat(visType, " is not a known visualization type"));
+    throw new Error(`${visType} is not a known visualization type`);
   }
 
   return rules;

package/build/cjs/modules/ouIdHelper/index.js

@@ -3,9 +3,15 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.ouIdHelper = void 0;
+exports.ouIdHelper = exports.USER_ORG_UNIT_GRANDCHILDREN = exports.USER_ORG_UNIT_CHILDREN = exports.USER_ORG_UNIT = void 0;
 const LEVEL_ID_PREFIX = 'LEVEL';
 const GROUP_ID_PREFIX = 'OU_GROUP';
+const USER_ORG_UNIT = 'USER_ORGUNIT';
+exports.USER_ORG_UNIT = USER_ORG_UNIT;
+const USER_ORG_UNIT_CHILDREN = 'USER_ORGUNIT_CHILDREN';
+exports.USER_ORG_UNIT_CHILDREN = USER_ORG_UNIT_CHILDREN;
+const USER_ORG_UNIT_GRANDCHILDREN = 'USER_ORGUNIT_GRANDCHILDREN';
+exports.USER_ORG_UNIT_GRANDCHILDREN = USER_ORG_UNIT_GRANDCHILDREN;
 
 const hasGroupPrefix = id => id.substr(0, GROUP_ID_PREFIX.length) === GROUP_ID_PREFIX;
 
@@ -18,8 +24,8 @@ const stripGroupPrefix = id => hasGroupPrefix(id) ? id.substr(GROUP_ID_PREFIX.le
 const removePrefix = id => stripGroupPrefix(stripLevelPrefix(id));
 
 const ouIdHelper = Object.freeze({
-  addLevelPrefix: id => "".concat(LEVEL_ID_PREFIX, "-").concat(removePrefix(id)),
-  addGroupPrefix: id => "".concat(GROUP_ID_PREFIX, "-").concat(removePrefix(id)),
+  addLevelPrefix: id => `${LEVEL_ID_PREFIX}-${removePrefix(id)}`,
+  addGroupPrefix: id => `${GROUP_ID_PREFIX}-${removePrefix(id)}`,
   removePrefix,
   hasGroupPrefix,
   hasLevelPrefix

package/build/cjs/modules/pivotTable/PivotTableEngine.js

@@ -369,7 +369,7 @@ class PivotTableEngine {
     }
 
     if (rowLevel === lastRowLevel && this.dimensionLookup.rows[lastRowLevel] && columnLevel === lastColumnLevel && this.dimensionLookup.columns[lastColumnLevel]) {
-      return "".concat(this.dimensionLookup.rows[lastRowLevel].meta.name, " / ").concat(this.dimensionLookup.columns[lastColumnLevel].meta.name);
+      return `${this.dimensionLookup.rows[lastRowLevel].meta.name} / ${this.dimensionLookup.columns[lastColumnLevel].meta.name}`;
     }
 
     if (lastRowLevel === -1) {
@@ -963,12 +963,12 @@ class PivotTableEngine {
 
   sort(column, order) {
     if (order !== _pivotTableConstants.SORT_ORDER_ASCENDING && order !== _pivotTableConstants.SORT_ORDER_DESCENDING) {
-      console.warn("Invalid sort order ".concat(order));
+      console.warn(`Invalid sort order ${order}`);
       return;
     }
 
     if (!this.isSortable(column)) {
-      console.warn("Invalid sort column ".concat(column));
+      console.warn(`Invalid sort column ${column}`);
       return;
     }
 

package/build/cjs/modules/pivotTable/measureText.js

@@ -15,7 +15,7 @@ const getContext = fontSize => {
   }
 
   const ctx = canvas.getContext('2d');
-  ctx.font = "".concat(fontSize, "px Roboto, Arial, sans-serif");
+  ctx.font = `${fontSize}px Roboto, Arial, sans-serif`;
   return ctx;
 };
 

package/build/cjs/modules/relativeItems/index.js

@@ -11,6 +11,6 @@ var _ouIdHelper = require("../ouIdHelper");
 
 var _predefinedDimensions = require("../predefinedDimensions");
 
-const hasRelativeItems = (dimension, itemIds = []) => dimension === _predefinedDimensions.DIMENSION_ID_ASSIGNED_CATEGORIES || dimension === _predefinedDimensions.DIMENSION_ID_ORGUNIT && Array.isArray(itemIds) && itemIds.some(id => _ouIdHelper.ouIdHelper.hasLevelPrefix(id) || _ouIdHelper.ouIdHelper.hasGroupPrefix(id) || ['USER_ORGUNIT', 'USER_ORGUNIT_CHILDREN', 'USER_ORGUNIT_GRAND_CHILDREN'].includes(id)) || dimension === _predefinedDimensions.DIMENSION_ID_PERIOD && Array.isArray(itemIds) && itemIds.some(id => (0, _relativePeriods.getRelativePeriodIds)().includes(id));
+const hasRelativeItems = (dimension, itemIds = []) => dimension === _predefinedDimensions.DIMENSION_ID_ASSIGNED_CATEGORIES || dimension === _predefinedDimensions.DIMENSION_ID_ORGUNIT && Array.isArray(itemIds) && itemIds.some(id => _ouIdHelper.ouIdHelper.hasLevelPrefix(id) || _ouIdHelper.ouIdHelper.hasGroupPrefix(id) || [_ouIdHelper.USER_ORG_UNIT, _ouIdHelper.USER_ORG_UNIT_CHILDREN, _ouIdHelper.USER_ORG_UNIT_GRANDCHILDREN].includes(id)) || dimension === _predefinedDimensions.DIMENSION_ID_PERIOD && Array.isArray(itemIds) && itemIds.some(id => (0, _relativePeriods.getRelativePeriodIds)().includes(id));
 
 exports.hasRelativeItems = hasRelativeItems;

package/build/cjs/modules/visTypes.js

@@ -102,7 +102,7 @@ const getDisplayNameByVisType = visType => {
   const displayName = visTypeDisplayNames[visType];
 
   if (!displayName) {
-    throw new Error("".concat(visType, " is not a valid visualization type"));
+    throw new Error(`${visType} is not a valid visualization type`);
   }
 
   return displayName;

package/build/cjs/visualizations/config/adapters/dhis_highcharts/addTrendLines.js

@@ -97,7 +97,7 @@ function getTwoCategoryTrendLines(layout, series, isStacked) {
     });
   } else {
     series.forEach(seriesObj => {
-      const trendlineSerieId = "trendline-".concat(seriesObj.id);
+      const trendlineSerieId = `trendline-${seriesObj.id}`;
       newSeries.push(seriesObj);
 
       if (!seriesObj.custom.isTwoCategoryFakeSerie) {

package/build/cjs/visualizations/config/adapters/dhis_highcharts/axis.js

@@ -34,7 +34,7 @@ const getPlotLineLabelStyle = fontStyle => ({
   y: -7,
   style: {
     color: fontStyle[_fontStyle.FONT_STYLE_OPTION_TEXT_COLOR],
-    fontSize: "".concat(fontStyle[_fontStyle.FONT_STYLE_OPTION_FONT_SIZE], "px"),
+    fontSize: `${fontStyle[_fontStyle.FONT_STYLE_OPTION_FONT_SIZE]}px`,
     fontWeight: fontStyle[_fontStyle.FONT_STYLE_OPTION_BOLD] ? _fontStyle.FONT_STYLE_OPTION_BOLD : 'normal',
     fontStyle: fontStyle[_fontStyle.FONT_STYLE_OPTION_ITALIC] ? _fontStyle.FONT_STYLE_OPTION_ITALIC : 'normal'
   }
@@ -128,7 +128,7 @@ const getLabels = axis => {
   return {
     style: {
       color: fontStyle[_fontStyle.FONT_STYLE_OPTION_TEXT_COLOR],
-      fontSize: "".concat(fontStyle[_fontStyle.FONT_STYLE_OPTION_FONT_SIZE], "px"),
+      fontSize: `${fontStyle[_fontStyle.FONT_STYLE_OPTION_FONT_SIZE]}px`,
       fontWeight: fontStyle[_fontStyle.FONT_STYLE_OPTION_BOLD] ? _fontStyle.FONT_STYLE_OPTION_BOLD : 'normal',
       fontStyle: fontStyle[_fontStyle.FONT_STYLE_OPTION_ITALIC] ? _fontStyle.FONT_STYLE_OPTION_ITALIC : 'normal'
     },

package/build/cjs/visualizations/config/adapters/dhis_highcharts/getAxisTitle.js

@@ -20,7 +20,7 @@ const getTitleStyle = (fontStyle, titleType, visType) => fontStyle ? {
   margin: 15,
   style: {
     color: fontStyle[_fontStyle.FONT_STYLE_OPTION_TEXT_COLOR],
-    fontSize: "".concat(fontStyle[_fontStyle.FONT_STYLE_OPTION_FONT_SIZE], "px"),
+    fontSize: `${fontStyle[_fontStyle.FONT_STYLE_OPTION_FONT_SIZE]}px`,
     fontWeight: fontStyle[_fontStyle.FONT_STYLE_OPTION_BOLD] ? _fontStyle.FONT_STYLE_OPTION_BOLD : 'normal',
     fontStyle: fontStyle[_fontStyle.FONT_STYLE_OPTION_ITALIC] ? _fontStyle.FONT_STYLE_OPTION_ITALIC : 'normal'
   }

package/build/cjs/visualizations/config/adapters/dhis_highcharts/index.js

@@ -47,9 +47,9 @@ var _xAxis = _interopRequireDefault(require("./xAxis"));
 
 var _yAxis = _interopRequireDefault(require("./yAxis"));
 
-function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function () { return cache; }; return cache; }
+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) { if (obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (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 _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 }; }
 

package/build/cjs/visualizations/config/adapters/dhis_highcharts/legend.js

@@ -35,7 +35,7 @@ function getItemStyle(fontStyle, dashboard) {
       fontWeight: 'normal'
     }, dashboard ? DASHBOARD_ITEM_STYLE : {
       color: fontStyle[_fontStyle.FONT_STYLE_OPTION_TEXT_COLOR],
-      fontSize: "".concat(fontStyle[_fontStyle.FONT_STYLE_OPTION_FONT_SIZE], "px"),
+      fontSize: `${fontStyle[_fontStyle.FONT_STYLE_OPTION_FONT_SIZE]}px`,
       fontWeight: fontStyle[_fontStyle.FONT_STYLE_OPTION_BOLD] ? _fontStyle.FONT_STYLE_OPTION_BOLD : 'normal',
       fontStyle: fontStyle[_fontStyle.FONT_STYLE_OPTION_ITALIC] ? _fontStyle.FONT_STYLE_OPTION_ITALIC : 'normal'
     })
@@ -86,22 +86,33 @@ const formatLabel = ({
 
   if ((!seriesId || seriesId.startsWith('trendline')) && seriesType === (0, _type.default)(_visTypes.VIS_TYPE_LINE).type) {
     // trendline
-    result.push("<span style=\"height: ".concat(fontStyle[_fontStyle.FONT_STYLE_OPTION_FONT_SIZE] / 6.5, "px; width: ").concat(fontStyle[_fontStyle.FONT_STYLE_OPTION_FONT_SIZE], "px; background-color: ").concat(seriesColor, "; display: inline-block;\"></span>"));
-    result.push("<span style=\"margin-left: 8px\" class=\"data-test-series-key-item-name\">".concat(seriesName, "</span>"));
+    result.push(`<span style="height: ${fontStyle[_fontStyle.FONT_STYLE_OPTION_FONT_SIZE] / 6.5}px; width: ${fontStyle[_fontStyle.FONT_STYLE_OPTION_FONT_SIZE]}px; background-color: ${seriesColor}; display: inline-block;"></span>`);
+    result.push(`<span style="margin-left: 8px" class="data-test-series-key-item-name">${seriesName}</span>`);
   } else if (legendSet !== null && legendSet !== void 0 && (_legendSet$legends = legendSet.legends) !== null && _legendSet$legends !== void 0 && _legendSet$legends.length && (0, _visTypes.isLegendSetType)(visType) && seriesType !== (0, _type.default)(_visTypes.VIS_TYPE_LINE).type) {
     // item with legend set
-    legendSet.legends.sort((a, b) => a.startValue - b.startValue).forEach((legend, index) => result.push("<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"".concat(fontStyle[_fontStyle.FONT_STYLE_OPTION_FONT_SIZE], "\" height=\"").concat(fontStyle[_fontStyle.FONT_STYLE_OPTION_FONT_SIZE], "\" version=\"1.1\"  style=\"margin-right:-5px; z-index: ").concat(legendSet.legends.length - index, "\" class=\"data-test-series-key-item-bullet\">\n                    <circle cx=\"").concat(fontStyle[_fontStyle.FONT_STYLE_OPTION_FONT_SIZE] / 2, "\" cy=\"").concat(fontStyle[_fontStyle.FONT_STYLE_OPTION_FONT_SIZE] / 2, "\" r=\"").concat(fontStyle[_fontStyle.FONT_STYLE_OPTION_FONT_SIZE] / 2, "\" fill=\"").concat(legend.color, "\"></circle>\n                    </svg>")));
-    result.push("<span style=\"margin-left: 8px\" class=\"data-test-series-key-item-name\">".concat(seriesName, "</span>"));
+    legendSet.legends.sort((a, b) => a.startValue - b.startValue).forEach((legend, index) => result.push(`<svg xmlns="http://www.w3.org/2000/svg" width="${fontStyle[_fontStyle.FONT_STYLE_OPTION_FONT_SIZE]}" height="${fontStyle[_fontStyle.FONT_STYLE_OPTION_FONT_SIZE]}" version="1.1"  style="margin-right:-5px; z-index: ${legendSet.legends.length - index}" class="data-test-series-key-item-bullet">
+                    <circle cx="${fontStyle[_fontStyle.FONT_STYLE_OPTION_FONT_SIZE] / 2}" cy="${fontStyle[_fontStyle.FONT_STYLE_OPTION_FONT_SIZE] / 2}" r="${fontStyle[_fontStyle.FONT_STYLE_OPTION_FONT_SIZE] / 2}" fill="${legend.color}"></circle>
+                    </svg>`));
+    result.push(`<span style="margin-left: 8px" class="data-test-series-key-item-name">${seriesName}</span>`);
   } else {
     // regular item (not a trendline, no applied legend set)
     if ((seriesColor === null || seriesColor === void 0 ? void 0 : seriesColor.patternIndex) !== undefined) {
       const pattern = _colorSets.colorSets[_colorSets.COLOR_SET_PATTERNS].patterns[seriesColor.patternIndex];
-      result.push("<svg xmlns=\"http://www.w3.org/2000/svg\" style=\"height: ".concat(fontStyle[_fontStyle.FONT_STYLE_OPTION_FONT_SIZE], "px; width: ").concat(fontStyle[_fontStyle.FONT_STYLE_OPTION_FONT_SIZE], "px; display: inline-block; margin-right:5px\" class=\"data-test-series-key-item-bullet\">\n                <defs>\n                  <pattern id=\"pattern").concat(seriesColor.patternIndex, "\" patternUnits=\"userSpaceOnUse\" width=\"").concat(pattern.width, "\" height=\"").concat(pattern.height, "\">\n                    <path stroke=\"").concat(pattern.color, "\" d=\"").concat(pattern.path, "\"/>\n                  </pattern>\n                </defs>\n                <circle cx=\"").concat(fontStyle[_fontStyle.FONT_STYLE_OPTION_FONT_SIZE] / 2, "\" cy=\"").concat(fontStyle[_fontStyle.FONT_STYLE_OPTION_FONT_SIZE] / 2, "\" r=\"").concat(fontStyle[_fontStyle.FONT_STYLE_OPTION_FONT_SIZE] / 2, "\" fill=\"url(#pattern").concat(seriesColor.patternIndex, ")\"/>\n              </svg>"));
+      result.push(`<svg xmlns="http://www.w3.org/2000/svg" style="height: ${fontStyle[_fontStyle.FONT_STYLE_OPTION_FONT_SIZE]}px; width: ${fontStyle[_fontStyle.FONT_STYLE_OPTION_FONT_SIZE]}px; display: inline-block; margin-right:5px" class="data-test-series-key-item-bullet">
+                <defs>
+                  <pattern id="pattern${seriesColor.patternIndex}" patternUnits="userSpaceOnUse" width="${pattern.width}" height="${pattern.height}">
+                    <path stroke="${pattern.color}" d="${pattern.path}"/>
+                  </pattern>
+                </defs>
+                <circle cx="${fontStyle[_fontStyle.FONT_STYLE_OPTION_FONT_SIZE] / 2}" cy="${fontStyle[_fontStyle.FONT_STYLE_OPTION_FONT_SIZE] / 2}" r="${fontStyle[_fontStyle.FONT_STYLE_OPTION_FONT_SIZE] / 2}" fill="url(#pattern${seriesColor.patternIndex})"/>
+              </svg>`);
     } else {
-      result.push("<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"".concat(fontStyle[_fontStyle.FONT_STYLE_OPTION_FONT_SIZE], "\" height=\"").concat(fontStyle[_fontStyle.FONT_STYLE_OPTION_FONT_SIZE], "\" version=\"1.1\"  style=\"margin-right:5px\" class=\"data-test-series-key-item-bullet\">\n                    <circle cx=\"").concat(fontStyle[_fontStyle.FONT_STYLE_OPTION_FONT_SIZE] / 2, "\" cy=\"").concat(fontStyle[_fontStyle.FONT_STYLE_OPTION_FONT_SIZE] / 2, "\" r=\"").concat(fontStyle[_fontStyle.FONT_STYLE_OPTION_FONT_SIZE] / 2, "\" fill=\"").concat(seriesColor, "\"></circle>\n                    </svg>"));
+      result.push(`<svg xmlns="http://www.w3.org/2000/svg" width="${fontStyle[_fontStyle.FONT_STYLE_OPTION_FONT_SIZE]}" height="${fontStyle[_fontStyle.FONT_STYLE_OPTION_FONT_SIZE]}" version="1.1"  style="margin-right:5px" class="data-test-series-key-item-bullet">
+                    <circle cx="${fontStyle[_fontStyle.FONT_STYLE_OPTION_FONT_SIZE] / 2}" cy="${fontStyle[_fontStyle.FONT_STYLE_OPTION_FONT_SIZE] / 2}" r="${fontStyle[_fontStyle.FONT_STYLE_OPTION_FONT_SIZE] / 2}" fill="${seriesColor}"></circle>
+                    </svg>`);
     }
 
-    result.push("<span class=\"data-test-series-key-item-name\">".concat(seriesName, "</span>"));
+    result.push(`<span class="data-test-series-key-item-name">${seriesName}</span>`);
   }
 
   result.push('</div>');

package/build/cjs/visualizations/config/adapters/dhis_highcharts/legendSet.js

@@ -43,7 +43,7 @@ exports.applyLegendSet = applyLegendSet;
 
 const getLegendSetTooltip = () => ({
   pointFormatter: function () {
-    return "<span style=\"color:".concat(this.color, "\">\u25CF</span> ").concat(this.series.name, ": <b>").concat(this.y, "</b><br>") + (this.legend ? "".concat(this.legendSet, ": <b>").concat(this.legend, "</b>") : "".concat(_index.default.t('No legend for this series')));
+    return `<span style="color:${this.color}">●</span> ${this.series.name}: <b>${this.y}</b><br>` + (this.legend ? `${this.legendSet}: <b>${this.legend}</b>` : `${_index.default.t('No legend for this series')}`);
   }
 });
 

package/build/cjs/visualizations/config/adapters/dhis_highcharts/plotOptions.js

@@ -41,7 +41,7 @@ var _default = ({
       }));
     }
 
-    return "".concat(labels.map(label => "<b>".concat(label, "</b><br>")).join('')).concat(yAxisName, ": ").concat(y, "<br>").concat(xAxisName, ": ").concat(x);
+    return `${labels.map(label => `<b>${label}</b><br>`).join('')}${yAxisName}: ${y}<br>${xAxisName}: ${x}`;
   };
 
   switch (visType) {

package/build/cjs/visualizations/config/adapters/dhis_highcharts/subtitle/index.js

@@ -73,7 +73,7 @@ function _default(series, layout, metaData, dashboard) {
     style: {
       // DHIS2-578: dynamically truncate subtitle when it's taking more than 1 line
       color: fontStyle[_fontStyle.FONT_STYLE_OPTION_TEXT_COLOR],
-      fontSize: "".concat(fontStyle[_fontStyle.FONT_STYLE_OPTION_FONT_SIZE], "px"),
+      fontSize: `${fontStyle[_fontStyle.FONT_STYLE_OPTION_FONT_SIZE]}px`,
       fontWeight: fontStyle[_fontStyle.FONT_STYLE_OPTION_BOLD] ? _fontStyle.FONT_STYLE_OPTION_BOLD : 'normal',
       fontStyle: fontStyle[_fontStyle.FONT_STYLE_OPTION_ITALIC] ? _fontStyle.FONT_STYLE_OPTION_ITALIC : 'normal',
       whiteSpace: 'nowrap',

package/build/cjs/visualizations/config/adapters/dhis_highcharts/title/index.js

@@ -77,7 +77,7 @@ function _default(layout, metaData, dashboard) {
     align: (0, _getTextAlignOption.getTextAlignOption)(fontStyle[_fontStyle.FONT_STYLE_OPTION_TEXT_ALIGN], _fontStyle.FONT_STYLE_VISUALIZATION_TITLE, (0, _visTypes.isVerticalType)(layout.type)),
     style: {
       color: fontStyle[_fontStyle.FONT_STYLE_OPTION_TEXT_COLOR],
-      fontSize: "".concat(fontStyle[_fontStyle.FONT_STYLE_OPTION_FONT_SIZE], "px"),
+      fontSize: `${fontStyle[_fontStyle.FONT_STYLE_OPTION_FONT_SIZE]}px`,
       fontWeight: fontStyle[_fontStyle.FONT_STYLE_OPTION_BOLD] ? _fontStyle.FONT_STYLE_OPTION_BOLD : 'normal',
       fontStyle: fontStyle[_fontStyle.FONT_STYLE_OPTION_ITALIC] ? _fontStyle.FONT_STYLE_OPTION_ITALIC : 'normal',
       whiteSpace: 'nowrap',

package/build/cjs/visualizations/config/adapters/dhis_highcharts/title/scatter.js

@@ -14,6 +14,6 @@ function _default(layout, metaData, dashboard) {
 
   if ((_layout$rows = layout.rows) !== null && _layout$rows !== void 0 && _layout$rows.length && (_layout$columns = layout.columns) !== null && _layout$columns !== void 0 && _layout$columns.length && !dashboard) {
     const columns = (0, _getFilterText.default)(layout.columns, metaData).split(', ');
-    return "".concat((0, _getFilterText.default)(layout.rows, metaData), ": ").concat(columns[0], " - ").concat(columns[1]);
+    return `${(0, _getFilterText.default)(layout.rows, metaData)}: ${columns[0]} - ${columns[1]}`;
   }
 }

package/build/cjs/visualizations/config/adapters/dhis_highcharts/xAxis/index.js

@@ -44,7 +44,7 @@ const getLabels = axis => {
   return {
     style: {
       color: fontStyle[_fontStyle.FONT_STYLE_OPTION_TEXT_COLOR],
-      fontSize: "".concat(fontStyle[_fontStyle.FONT_STYLE_OPTION_FONT_SIZE], "px"),
+      fontSize: `${fontStyle[_fontStyle.FONT_STYLE_OPTION_FONT_SIZE]}px`,
       fontWeight: fontStyle[_fontStyle.FONT_STYLE_OPTION_BOLD] ? _fontStyle.FONT_STYLE_OPTION_BOLD : 'normal',
       fontStyle: fontStyle[_fontStyle.FONT_STYLE_OPTION_ITALIC] ? _fontStyle.FONT_STYLE_OPTION_ITALIC : 'normal'
     },

package/build/cjs/visualizations/config/adapters/dhis_highcharts/yAxis/gauge.js

@@ -68,12 +68,12 @@ function getPlotLine(regressionLine = {}, defaultLabel) {
     color: fontStyle[_fontStyle.FONT_STYLE_OPTION_TEXT_COLOR] || '#000',
     ...(label && {
       label: {
-        text: "".concat(label, ": ").concat(value),
+        text: `${label}: ${value}`,
         verticalAlign,
         y,
         style: {
           color: fontStyle[_fontStyle.FONT_STYLE_OPTION_TEXT_COLOR],
-          fontSize: "".concat(fontStyle[_fontStyle.FONT_STYLE_OPTION_FONT_SIZE], "px"),
+          fontSize: `${fontStyle[_fontStyle.FONT_STYLE_OPTION_FONT_SIZE]}px`,
           fontWeight: fontStyle[_fontStyle.FONT_STYLE_OPTION_BOLD] ? _fontStyle.FONT_STYLE_OPTION_BOLD : 'normal',
           fontStyle: fontStyle[_fontStyle.FONT_STYLE_OPTION_ITALIC] ? _fontStyle.FONT_STYLE_OPTION_ITALIC : 'normal'
         }
@@ -90,7 +90,7 @@ const getLabels = axis => {
     y: parseInt(fontStyle[_fontStyle.FONT_STYLE_OPTION_FONT_SIZE], 10) + 7,
     style: {
       color: fontStyle[_fontStyle.FONT_STYLE_OPTION_TEXT_COLOR],
-      fontSize: "".concat(fontStyle[_fontStyle.FONT_STYLE_OPTION_FONT_SIZE], "px"),
+      fontSize: `${fontStyle[_fontStyle.FONT_STYLE_OPTION_FONT_SIZE]}px`,
       fontWeight: fontStyle[_fontStyle.FONT_STYLE_OPTION_BOLD] ? _fontStyle.FONT_STYLE_OPTION_BOLD : 'normal',
       fontStyle: fontStyle[_fontStyle.FONT_STYLE_OPTION_ITALIC] ? _fontStyle.FONT_STYLE_OPTION_ITALIC : 'normal'
     }

package/build/cjs/visualizations/config/adapters/dhis_highcharts/yAxis/index.js

@@ -73,9 +73,9 @@ function getDefault(layout, series, extraOptions) {
           var _axis$title;
 
           rl.title = { ...rl.title,
-            text: "".concat(rl.title.text, " - ").concat(((_axis$title = axis.title) === null || _axis$title === void 0 ? void 0 : _axis$title.text) || _locales.default.t('Axis {{axisId}}', {
+            text: `${rl.title.text} - ${((_axis$title = axis.title) === null || _axis$title === void 0 ? void 0 : _axis$title.text) || _locales.default.t('Axis {{axisId}}', {
               axisId: axis.index + 1
-            }))
+            })}`
           };
         }
       });

package/build/cjs/visualizations/config/generators/dhis/singleValue.js

@@ -24,7 +24,7 @@ const generateValueSVG = ({
   const textSize = 300;
   const svgValue = document.createElementNS(svgNS, 'svg');
   svgValue.setAttribute('xmlns', svgNS);
-  svgValue.setAttribute('viewBox', "0 -".concat(textSize + 50, " ").concat(textSize * 0.75 * formattedValue.length, " ").concat(textSize + 200));
+  svgValue.setAttribute('viewBox', `0 -${textSize + 50} ${textSize * 0.75 * formattedValue.length} ${textSize + 200}`);
 
   if (y) {
     svgValue.setAttribute('y', y);
@@ -52,7 +52,7 @@ const generateValueSVG = ({
   if (subText) {
     const svgSubText = document.createElementNS(svgNS, 'svg');
     const subTextSize = 40;
-    svgSubText.setAttribute('viewBox', "0 -50 ".concat(textSize * 0.75 * formattedValue.length, " ").concat(textSize + 200));
+    svgSubText.setAttribute('viewBox', `0 -50 ${textSize * 0.75 * formattedValue.length} ${textSize + 200}`);
 
     if (y) {
       svgSubText.setAttribute('y', y);
@@ -146,7 +146,7 @@ const generateDVItem = (config, {
   const svgNS = 'http://www.w3.org/2000/svg';
   const svg = document.createElementNS(svgNS, 'svg');
   svg.setAttribute('xmlns', svgNS);
-  svg.setAttribute('viewBox', "0 0 ".concat(width, " ").concat(height));
+  svg.setAttribute('viewBox', `0 0 ${width} ${height}`);
   svg.setAttribute('width', '100%');
   svg.setAttribute('height', '100%');
   svg.setAttribute('data-test', 'visualization-container');
@@ -155,7 +155,7 @@ const generateDVItem = (config, {
   title.setAttribute('x', getXFromTextAlign(titleFontStyle[_fontStyle.FONT_STYLE_OPTION_TEXT_ALIGN]));
   title.setAttribute('y', 28);
   title.setAttribute('text-anchor', getTextAnchorFromTextAlign(titleFontStyle[_fontStyle.FONT_STYLE_OPTION_TEXT_ALIGN]));
-  title.setAttribute('font-size', "".concat(titleFontStyle[_fontStyle.FONT_STYLE_OPTION_FONT_SIZE], "px"));
+  title.setAttribute('font-size', `${titleFontStyle[_fontStyle.FONT_STYLE_OPTION_FONT_SIZE]}px`);
   title.setAttribute('font-weight', titleFontStyle[_fontStyle.FONT_STYLE_OPTION_BOLD] ? _fontStyle.FONT_STYLE_OPTION_BOLD : 'normal');
   title.setAttribute('font-style', titleFontStyle[_fontStyle.FONT_STYLE_OPTION_ITALIC] ? _fontStyle.FONT_STYLE_OPTION_ITALIC : 'normal');
   title.setAttribute('fill', titleFontStyle[_fontStyle.FONT_STYLE_OPTION_TEXT_COLOR]);
@@ -172,7 +172,7 @@ const generateDVItem = (config, {
   subtitle.setAttribute('y', 28);
   subtitle.setAttribute('dy', 22);
   subtitle.setAttribute('text-anchor', getTextAnchorFromTextAlign(subtitleFontStyle[_fontStyle.FONT_STYLE_OPTION_TEXT_ALIGN]));
-  subtitle.setAttribute('font-size', "".concat(subtitleFontStyle[_fontStyle.FONT_STYLE_OPTION_FONT_SIZE], "px"));
+  subtitle.setAttribute('font-size', `${subtitleFontStyle[_fontStyle.FONT_STYLE_OPTION_FONT_SIZE]}px`);
   subtitle.setAttribute('font-weight', subtitleFontStyle[_fontStyle.FONT_STYLE_OPTION_BOLD] ? _fontStyle.FONT_STYLE_OPTION_BOLD : 'normal');
   subtitle.setAttribute('font-style', subtitleFontStyle[_fontStyle.FONT_STYLE_OPTION_ITALIC] ? _fontStyle.FONT_STYLE_OPTION_ITALIC : 'normal');
   subtitle.setAttribute('fill', subtitleFontStyle[_fontStyle.FONT_STYLE_OPTION_TEXT_COLOR]);

package/build/cjs/visualizations/config/index.js

@@ -34,15 +34,15 @@ function _default({
   const _generator = _generators.default[outputFormat];
 
   if (_validator === _validators.default.noValidation) {
-    onWarning("No validation implementation for config input format \"".concat(inputFormat, "\""));
+    onWarning(`No validation implementation for config input format "${inputFormat}"`);
   }
 
   if (!_adapter) {
-    onError("No config tranformation implementation for format \"".concat(inputFormat, "\" to format \"").concat(outputFormat, "\""));
+    onError(`No config tranformation implementation for format "${inputFormat}" to format "${outputFormat}"`);
   }
 
   if (!_generator) {
-    onError("No visualization implementation for format ".concat(outputFormat));
+    onError(`No visualization implementation for format ${outputFormat}`);
   }
 
   const DEFAULT_EXTRA_OPTIONS = {

package/build/cjs/visualizations/store/adapters/dhis_dhis/index.js

@@ -41,7 +41,7 @@ function getDefault(acc, seriesIds, categoryIds, idValueMap, metaData) {
   seriesIds.forEach(seriesId => {
     const serieData = [];
     categoryIds.forEach(categoryId => {
-      const value = idValueMap.get("".concat(seriesId, "-").concat(categoryId)); // DHIS2-1261: 0 is a valid value
+      const value = idValueMap.get(`${seriesId}-${categoryId}`); // DHIS2-1261: 0 is a valid value
       // undefined value means the key was not found within the rows
       // in that case null is returned as value in the serie
 

package/build/cjs/visualizations/store/adapters/dhis_highcharts/index.js

@@ -56,7 +56,7 @@ function getDefault(acc, series, categories, idValueMap, metaData) {
   series[0].forEach(serieItemId => {
     const serieData = [];
     categories[0].forEach(categoryItemId => {
-      const value = idValueMap.get("".concat(serieItemId, "-").concat(categoryItemId)); // DHIS2-1261: 0 is a valid value
+      const value = idValueMap.get(`${serieItemId}-${categoryItemId}`); // DHIS2-1261: 0 is a valid value
       // undefined value means the key was not found within the rows
       // in that case null is returned as value in the serie
       // this is to keep the correct indexes for the values within the serie array

package/build/cjs/visualizations/store/adapters/dhis_highcharts/twoCategory.js

@@ -16,7 +16,7 @@ function _default(acc, series, categories, idValueMap, metaData) {
     categories[0].forEach(category1ItemId => {
       const groupData = [];
       categories[1].forEach(category2ItemId => {
-        const value = idValueMap.get("".concat(seriesItemId, "-").concat(category1ItemId, "-").concat(category2ItemId));
+        const value = idValueMap.get(`${seriesItemId}-${category1ItemId}-${category2ItemId}`);
         groupData.push(value === undefined ? null : parseFloat(value));
       });
       groupedData.push(groupData);

package/build/cjs/visualizations/store/index.js

@@ -25,11 +25,11 @@ function _default({
   const _adapter = _adapters.default[inputFormat + '_' + outputFormat];
 
   if (_validator === _validators.default.noValidation) {
-    warning("Validation not supported for data input format \"".concat(inputFormat, "\""));
+    warning(`Validation not supported for data input format "${inputFormat}"`);
   }
 
   if (!_adapter) {
-    error("Data tranformation from \"".concat(inputFormat, "\" to \"").concat(outputFormat, "\" is not supported"));
+    error(`Data tranformation from "${inputFormat}" to "${outputFormat}" is not supported`);
   }
 
   this.data = data;

package/build/cjs/visualizations/util/axisId.js

@@ -6,6 +6,6 @@ Object.defineProperty(exports, "__esModule", {
 exports.getAxisStringFromId = void 0;
 const AXIS_ID_PREFIX = 'AXIS_';
 
-const getAxisStringFromId = id => "".concat(AXIS_ID_PREFIX).concat(id);
+const getAxisStringFromId = id => `${AXIS_ID_PREFIX}${id}`;
 
 exports.getAxisStringFromId = getAxisStringFromId;

package/build/cjs/visualizations/util/getFilterText.js

@@ -54,9 +54,9 @@ function _default(filters, metaData) {
           } // otherwise use the values directly
           // this is a temporary fix to avoid app crashing when using filters with data items in EV
           else {
-              sectionParts.push(metaData.items[filter.dimension].name + ': ' + filterItems.join(', '));
-              break;
-            }
+            sectionParts.push(metaData.items[filter.dimension].name + ': ' + filterItems.join(', '));
+            break;
+          }
         }
 
         titleFragments.push(sectionParts.join(', '));

package/build/es/__demo__/OpenFileDialog.stories.js

@@ -12,7 +12,7 @@ const user = {
   username: 'admin'
 };
 
-const onFileSelect = id => alert("Opening ".concat(id));
+const onFileSelect = id => alert(`Opening ${id}`);
 
 storiesOf('OpenFileDialog', module).add('List of visualizations', () => /*#__PURE__*/React.createElement(Provider, {
   config: configMock

package/build/es/__demo__/OrgUnitDimension.stories.js

@@ -0,0 +1,93 @@
+import { DataProvider } from '@dhis2/app-runtime';
+import { storiesOf } from '@storybook/react';
+import React, { useState } from 'react';
+import OrgUnitDimension from '../components/OrgUnitDimension/OrgUnitDimension';
+
+const Wrapper = story => /*#__PURE__*/React.createElement(DataProvider, {
+  baseUrl: "http://localhost:8080/",
+  apiVersion: ""
+}, story());
+
+const defaultRootOrgUnits = ['ImspTQPwCqd']; // Sierra Leone
+
+storiesOf('OrgUnitDimension', module).addDecorator(Wrapper).add('None selected', () => {
+  const [selected, setSelected] = useState([]);
+  return /*#__PURE__*/React.createElement(OrgUnitDimension, {
+    selected: selected,
+    onSelect: response => setSelected(response.items),
+    roots: defaultRootOrgUnits
+  });
+});
+storiesOf('OrgUnitDimension', module).addDecorator(Wrapper).add('Root selected', () => {
+  const [selected, setSelected] = useState([{
+    id: 'ImspTQPwCqd',
+    path: '/ImspTQPwCqd',
+    name: 'Sierra Leone'
+  }]);
+  return /*#__PURE__*/React.createElement(OrgUnitDimension, {
+    selected: selected,
+    onSelect: response => setSelected(response.items),
+    roots: defaultRootOrgUnits
+  });
+});
+storiesOf('OrgUnitDimension', module).addDecorator(Wrapper).add('Single level 2 child selected', () => {
+  const [selected, setSelected] = useState([{
+    id: 'fdc6uOvgoji',
+    path: '/ImspTQPwCqd/fdc6uOvgoji',
+    name: 'Bombali'
+  }]);
+  return /*#__PURE__*/React.createElement(OrgUnitDimension, {
+    selected: selected,
+    onSelect: response => setSelected(response.items),
+    roots: defaultRootOrgUnits
+  });
+});
+storiesOf('OrgUnitDimension', module).addDecorator(Wrapper).add('Multiple level 2 children selected', () => {
+  const [selected, setSelected] = useState([{
+    id: 'O6uvpzGd5pu',
+    path: '/ImspTQPwCqd/O6uvpzGd5pu',
+    name: 'Bo'
+  }, {
+    id: 'fdc6uOvgoji',
+    path: '/ImspTQPwCqd/fdc6uOvgoji',
+    name: 'Bombali'
+  }, {
+    id: 'lc3eMKXaEfw',
+    path: '/ImspTQPwCqd/lc3eMKXaEfw',
+    name: 'Bonthe'
+  }]);
+  return /*#__PURE__*/React.createElement(OrgUnitDimension, {
+    selected: selected,
+    onSelect: response => setSelected(response.items),
+    roots: defaultRootOrgUnits
+  });
+});
+storiesOf('OrgUnitDimension', module).addDecorator(Wrapper).add('Multiple selected across different levels', () => {
+  const [selected, setSelected] = useState([{
+    id: 'fdc6uOvgoji',
+    path: '/ImspTQPwCqd/fdc6uOvgoji',
+    name: 'Bombali'
+  }, {
+    id: 'KKkLOTpMXGV',
+    path: '/ImspTQPwCqd/fdc6uOvgoji/KKkLOTpMXGV',
+    name: 'Bombali Sebora'
+  }, {
+    id: 'GQcsUZf81vP',
+    path: '/ImspTQPwCqd/fdc6uOvgoji/KKkLOTpMXGV/GQcsUZf81vP',
+    name: 'Govt. Hosp. Makeni'
+  }]);
+  return /*#__PURE__*/React.createElement(OrgUnitDimension, {
+    selected: selected,
+    onSelect: response => setSelected(response.items),
+    roots: defaultRootOrgUnits
+  });
+});
+storiesOf('OrgUnitDimension', module).addDecorator(Wrapper).add('Multiple roots', () => {
+  const [selected, setSelected] = useState([]);
+  return /*#__PURE__*/React.createElement(OrgUnitDimension, {
+    selected: selected,
+    onSelect: response => setSelected(response.items),
+    roots: ['O6uvpzGd5pu', 'fdc6uOvgoji'] // Bo + Bombali
+
+  });
+});

package/build/es/api/analytics/AnalyticsBase.js

@@ -76,7 +76,7 @@ const generateDimensionStrings = (dimensions = [], options) => {
         items.sort();
       }
 
-      return "".concat(dimension, ":").concat(items.join(';'));
+      return `${dimension}:${items.join(';')}`;
     }
 
     return dimension;

package/build/es/api/analytics/AnalyticsRequest.js

@@ -46,7 +46,7 @@ class AnalyticsRequest extends AnalyticsRequestDimensionsMixin(AnalyticsRequestF
       let dimension = d.dimension;
 
       if (d.filter) {
-        dimension += ":".concat(d.filter);
+        dimension += `:${d.filter}`;
       }
 
       request = request.addDimension(dimension, d.items.map(item => item.id));