@dhis2/analytics 26.0.8 → 26.0.9

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

@@ -4,43 +4,26 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = _default;
-
 var _arrayClean = _interopRequireDefault(require("d2-utilizr/lib/arrayClean"));
-
 var _objectClean = _interopRequireDefault(require("d2-utilizr/lib/objectClean"));
-
 var _index = _interopRequireDefault(require("../../../../../locales/index.js"));
-
 var _fontStyle = require("../../../../../modules/fontStyle.js");
-
 var _visTypes = require("../../../../../modules/visTypes.js");
-
 var _axes = require("../../../../util/axes.js");
-
 var _axisId = require("../../../../util/axisId.js");
-
 var _axis = require("../axis.js");
-
 var _customAxes = require("../customAxes.js");
-
 var _getAxisTitle = _interopRequireDefault(require("../getAxisTitle.js"));
-
 var _getSteps = _interopRequireDefault(require("../getSteps.js"));
-
 var _gauge = _interopRequireDefault(require("./gauge.js"));
-
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
 const AXIS_TYPE_RANGE = 'RANGE';
-
 function getDefault(layout, series, extraOptions) {
   var _extraOptions$outlier;
-
   const axes = [];
   const dataValues = series === null || series === void 0 ? void 0 : series.map(item => item.data).flat();
   const layoutAxes = [];
   let useMultiAxisMode = false;
-
   if ((0, _visTypes.isDualAxisType)(layout.type)) {
     const axisIdsMap = (0, _customAxes.getAxisIdsMap)(layout.series, series);
     const axisIds = [...new Set(Object.keys(axisIdsMap))].sort((a, b) => a - b);
@@ -49,44 +32,37 @@ function getDefault(layout, series, extraOptions) {
   } else {
     layoutAxes.push((0, _axes.getAxis)(layout.axes, AXIS_TYPE_RANGE, 0));
   }
-
   let extremeObj;
-
   if (layout.type === _visTypes.VIS_TYPE_SCATTER && (_extraOptions$outlier = extraOptions.outlierHelper) !== null && _extraOptions$outlier !== void 0 && _extraOptions$outlier.extremeLines) {
     extremeObj = extraOptions.outlierHelper.extremeLines[1];
   }
-
   layoutAxes.forEach(axis => {
     var _axis$title2, _axis$title3, _extraOptions$outlier2, _extraOptions$outlier3, _axis$title4;
-
-    const targetLine = { ...axis.targetLine
+    const targetLine = {
+      ...axis.targetLine
     };
-    const baseLine = { ...axis.baseLine
+    const baseLine = {
+      ...axis.baseLine
     };
-
     if (useMultiAxisMode) {
       const regressionLines = [targetLine, baseLine];
       regressionLines.forEach(rl => {
         var _rl$title;
-
         if ((_rl$title = rl.title) !== null && _rl$title !== void 0 && _rl$title.text) {
           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) || _index.default.t('Axis {{axisId}}', {
+          rl.title = {
+            ...rl.title,
+            text: `${rl.title.text} - ${((_axis$title = axis.title) === null || _axis$title === void 0 ? void 0 : _axis$title.text) || _index.default.t('Axis {{axisId}}', {
               axisId: axis.index + 1
-            }))
+            })}`
           };
         }
       });
     }
-
     let titleText = (_axis$title2 = axis.title) === null || _axis$title2 === void 0 ? void 0 : _axis$title2.text;
-
     if (((_axis$title3 = axis.title) === null || _axis$title3 === void 0 ? void 0 : _axis$title3.textMode) === 'AUTO') {
       if (layout.type === _visTypes.VIS_TYPE_SCATTER || series.length === 1) {
         var _series$;
-
         if ((_series$ = series[0]) !== null && _series$ !== void 0 && _series$.name) {
           titleText = series[0].name;
         }
@@ -102,7 +78,6 @@ function getDefault(layout, series, extraOptions) {
         });
       }
     }
-
     axes.push((0, _objectClean.default)({
       min: (0, _axis.getMinValue)(axis.minValue, dataValues, (_extraOptions$outlier2 = extraOptions.outlierHelper) === null || _extraOptions$outlier2 === void 0 ? void 0 : _extraOptions$outlier2.yAxisMin),
       max: (0, _axis.getMaxValue)(axis.maxValue, dataValues, (_extraOptions$outlier3 = extraOptions.outlierHelper) === null || _extraOptions$outlier3 === void 0 ? void 0 : _extraOptions$outlier3.yAxisMax),
@@ -131,18 +106,14 @@ function getDefault(layout, series, extraOptions) {
   });
   return axes;
 }
-
 function _default(layout, series, extraOptions) {
   let yAxis;
-
   switch (layout.type) {
     case _visTypes.VIS_TYPE_GAUGE:
       yAxis = (0, _gauge.default)(layout, series, extraOptions.legendSets[0]);
       break;
-
     default:
       yAxis = getDefault(layout, series, extraOptions);
   }
-
   return yAxis;
 }

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

@@ -4,13 +4,9 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-
 var _index = _interopRequireDefault(require("./dhis_dhis/index.js"));
-
 var _index2 = _interopRequireDefault(require("./dhis_highcharts/index.js"));
-
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
 var _default = {
   dhis_highcharts: _index2.default,
   dhis_dhis: _index.default

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

@@ -4,31 +4,23 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = _default;
-
 var _visTypes = require("../../../../modules/visTypes.js");
-
 var _singleValue = _interopRequireDefault(require("./singleValue.js"));
-
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
 function _default(config, parentEl, extraOptions) {
   if (config) {
     const node = typeof parentEl === 'object' ? parentEl : typeof parentEl === 'string' ? document.querySelector(parentEl) : null;
-
     if (node) {
       if (node.lastChild) {
         node.removeChild(node.lastChild);
       }
-
       let content;
-
       switch (config.type) {
         case _visTypes.VIS_TYPE_SINGLE_VALUE:
         default:
           content = (0, _singleValue.default)(config, node, extraOptions);
           break;
       }
-
       node.appendChild(content);
       return node.innerHTML;
     }

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

@@ -4,68 +4,67 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = _default;
-
 var _ui = require("@dhis2/ui");
-
 var _fontStyle = require("../../../../modules/fontStyle.js");
-
 var _legends = require("../../../../modules/legends.js");
+const svgNS = 'http://www.w3.org/2000/svg';
 
-const svgNS = 'http://www.w3.org/2000/svg'; // multiply text width with this factor
+// multiply text width with this factor
 // to get very close to actual text width
 // nb: dependent on viewbox etc
+const ACTUAL_TEXT_WIDTH_FACTOR = 0.9;
 
-const ACTUAL_TEXT_WIDTH_FACTOR = 0.9; // multiply value text size with this factor
+// multiply value text size with this factor
 // to get very close to the actual number height
 // as numbers don't go below the baseline like e.g. "j" and "g"
+const ACTUAL_NUMBER_HEIGHT_FACTOR = 0.67;
 
-const ACTUAL_NUMBER_HEIGHT_FACTOR = 0.67; // do not allow text width to exceed this threshold
+// do not allow text width to exceed this threshold
 // a threshold >1 does not really make sense but text width vs viewbox is complicated
+const TEXT_WIDTH_CONTAINER_WIDTH_FACTOR = 1.3;
 
-const TEXT_WIDTH_CONTAINER_WIDTH_FACTOR = 1.3; // do not allow text size to exceed this
-
+// do not allow text size to exceed this
 const TEXT_SIZE_CONTAINER_HEIGHT_FACTOR = 0.6;
-const TEXT_SIZE_MAX_THRESHOLD = 400; // multiply text size with this factor
-// to get an appropriate letter spacing
+const TEXT_SIZE_MAX_THRESHOLD = 400;
 
+// multiply text size with this factor
+// to get an appropriate letter spacing
 const LETTER_SPACING_TEXT_SIZE_FACTOR = 1 / 35 * -1;
 const LETTER_SPACING_MIN_THRESHOLD = -6;
-const LETTER_SPACING_MAX_THRESHOLD = -1; // fixed top margin above title/subtitle
+const LETTER_SPACING_MAX_THRESHOLD = -1;
 
-const TOP_MARGIN_FIXED = 16; // multiply text size with this factor
-// to get an appropriate sub text size
+// fixed top margin above title/subtitle
+const TOP_MARGIN_FIXED = 16;
 
+// multiply text size with this factor
+// to get an appropriate sub text size
 const SUB_TEXT_SIZE_FACTOR = 0.5;
 const SUB_TEXT_SIZE_MIN_THRESHOLD = 26;
-const SUB_TEXT_SIZE_MAX_THRESHOLD = 40; // multiply text size with this factor
+const SUB_TEXT_SIZE_MAX_THRESHOLD = 40;
+
+// multiply text size with this factor
 // to get an appropriate icon padding
+const ICON_PADDING_FACTOR = 0.3;
 
-const ICON_PADDING_FACTOR = 0.3; // Compute text width before rendering
+// Compute text width before rendering
 // Not exactly precise but close enough
-
 const getTextWidth = (text, font) => {
   const canvas = document.createElement('canvas');
   const context = canvas.getContext('2d');
   context.font = font;
   return Math.round(context.measureText(text).width * ACTUAL_TEXT_WIDTH_FACTOR);
 };
-
 const getTextHeightForNumbers = textSize => textSize * ACTUAL_NUMBER_HEIGHT_FACTOR;
-
 const getIconPadding = textSize => Math.round(textSize * ICON_PADDING_FACTOR);
-
 const getTextSize = (formattedValue, containerWidth, containerHeight, showIcon) => {
   let size = Math.min(Math.round(containerHeight * TEXT_SIZE_CONTAINER_HEIGHT_FACTOR), TEXT_SIZE_MAX_THRESHOLD);
   const widthThreshold = Math.round(containerWidth * TEXT_WIDTH_CONTAINER_WIDTH_FACTOR);
-  const textWidth = getTextWidth(formattedValue, "".concat(size, "px Roboto")) + (showIcon ? getIconPadding(size) : 0);
-
+  const textWidth = getTextWidth(formattedValue, `${size}px Roboto`) + (showIcon ? getIconPadding(size) : 0);
   if (textWidth > widthThreshold) {
     size = Math.round(size * (widthThreshold / textWidth));
   }
-
   return size;
 };
-
 const generateValueSVG = _ref => {
   let {
     formattedValue,
@@ -80,25 +79,24 @@ const generateValueSVG = _ref => {
   } = _ref;
   const showIcon = icon && formattedValue !== noData.text;
   const textSize = getTextSize(formattedValue, containerWidth, containerHeight, showIcon);
-  const textWidth = getTextWidth(formattedValue, "".concat(textSize, "px Roboto"));
+  const textWidth = getTextWidth(formattedValue, `${textSize}px Roboto`);
   const iconSize = textSize;
   const subTextSize = textSize * SUB_TEXT_SIZE_FACTOR > SUB_TEXT_SIZE_MAX_THRESHOLD ? SUB_TEXT_SIZE_MAX_THRESHOLD : textSize * SUB_TEXT_SIZE_FACTOR < SUB_TEXT_SIZE_MIN_THRESHOLD ? SUB_TEXT_SIZE_MIN_THRESHOLD : textSize * SUB_TEXT_SIZE_FACTOR;
   const svgValue = document.createElementNS(svgNS, 'svg');
-  svgValue.setAttribute('viewBox', "0 0 ".concat(containerWidth, " ").concat(containerHeight));
+  svgValue.setAttribute('viewBox', `0 0 ${containerWidth} ${containerHeight}`);
   svgValue.setAttribute('width', '50%');
   svgValue.setAttribute('height', '50%');
   svgValue.setAttribute('x', '50%');
   svgValue.setAttribute('y', '50%');
   svgValue.setAttribute('style', 'overflow: visible');
   let fillColor = _ui.colors.grey900;
-
   if (valueColor) {
     fillColor = valueColor;
   } else if (formattedValue === noData.text) {
     fillColor = _ui.colors.grey600;
-  } // show icon if configured in maintenance app
-
+  }
 
+  // show icon if configured in maintenance app
   if (showIcon) {
     // embed icon to allow changing color
     // (elements with fill need to use "currentColor" for this to work)
@@ -107,28 +105,26 @@ const generateValueSVG = _ref => {
     iconSvgNode.setAttribute('width', iconSize);
     iconSvgNode.setAttribute('height', iconSize);
     iconSvgNode.setAttribute('y', (iconSize / 2 - topMargin / 2) * -1);
-    iconSvgNode.setAttribute('x', "-".concat((iconSize + getIconPadding(textSize) + textWidth) / 2));
-    iconSvgNode.setAttribute('style', "color: ".concat(fillColor));
+    iconSvgNode.setAttribute('x', `-${(iconSize + getIconPadding(textSize) + textWidth) / 2}`);
+    iconSvgNode.setAttribute('style', `color: ${fillColor}`);
     iconSvgNode.setAttribute('data-test', 'visualization-icon');
     const parser = new DOMParser();
     const svgIconDocument = parser.parseFromString(icon, 'image/svg+xml');
     Array.from(svgIconDocument.documentElement.children).forEach(node => iconSvgNode.appendChild(node));
     svgValue.appendChild(iconSvgNode);
   }
-
   const letterSpacing = Math.round(textSize * LETTER_SPACING_TEXT_SIZE_FACTOR);
   const textNode = document.createElementNS(svgNS, 'text');
   textNode.setAttribute('font-size', textSize);
   textNode.setAttribute('font-weight', '300');
   textNode.setAttribute('letter-spacing', letterSpacing < LETTER_SPACING_MIN_THRESHOLD ? LETTER_SPACING_MIN_THRESHOLD : letterSpacing > LETTER_SPACING_MAX_THRESHOLD ? LETTER_SPACING_MAX_THRESHOLD : letterSpacing);
   textNode.setAttribute('text-anchor', 'middle');
-  textNode.setAttribute('x', showIcon ? "".concat((iconSize + getIconPadding(textSize)) / 2) : 0);
+  textNode.setAttribute('x', showIcon ? `${(iconSize + getIconPadding(textSize)) / 2}` : 0);
   textNode.setAttribute('y', topMargin / 2 + getTextHeightForNumbers(textSize) / 2);
   textNode.setAttribute('fill', fillColor);
   textNode.setAttribute('data-test', 'visualization-primary-value');
   textNode.appendChild(document.createTextNode(formattedValue));
   svgValue.appendChild(textNode);
-
   if (subText) {
     const subTextNode = document.createElementNS(svgNS, 'text');
     subTextNode.setAttribute('text-anchor', 'middle');
@@ -139,10 +135,8 @@ const generateValueSVG = _ref => {
     subTextNode.appendChild(document.createTextNode(subText));
     svgValue.appendChild(subTextNode);
   }
-
   return svgValue;
 };
-
 const generateDashboardItem = (config, _ref2) => {
   let {
     svgContainer,
@@ -165,55 +159,45 @@ const generateDashboardItem = (config, _ref2) => {
     containerHeight: height
   }));
   const container = document.createElement('div');
-  container.setAttribute('style', "display: flex; flex-direction: column; align-items: center; justify-content: center; width: 100%; height: 100%; padding-top: 8px; ".concat(backgroundColor ? "background-color:".concat(backgroundColor, ";") : ''));
-  const titleStyle = "padding: 0 8px; text-align: center; font-size: 12px; color: ".concat(titleColor || '#666', ";");
+  container.setAttribute('style', `display: flex; flex-direction: column; align-items: center; justify-content: center; width: 100%; height: 100%; padding-top: 8px; ${backgroundColor ? `background-color:${backgroundColor};` : ''}`);
+  const titleStyle = `padding: 0 8px; text-align: center; font-size: 12px; color: ${titleColor || '#666'};`;
   const title = document.createElement('span');
   title.setAttribute('style', titleStyle);
-
   if (config.title) {
     title.appendChild(document.createTextNode(config.title));
     container.appendChild(title);
   }
-
   if (config.subtitle) {
     const subtitle = document.createElement('span');
     subtitle.setAttribute('style', titleStyle + ' margin-top: 4px;');
     subtitle.appendChild(document.createTextNode(config.subtitle));
     container.appendChild(subtitle);
   }
-
   container.appendChild(svgContainer);
   return container;
 };
-
 const getTextAnchorFromTextAlign = textAlign => {
   switch (textAlign) {
     default:
     case _fontStyle.TEXT_ALIGN_LEFT:
       return 'start';
-
     case _fontStyle.TEXT_ALIGN_CENTER:
       return 'middle';
-
     case _fontStyle.TEXT_ALIGN_RIGHT:
       return 'end';
   }
 };
-
 const getXFromTextAlign = textAlign => {
   switch (textAlign) {
     default:
     case _fontStyle.TEXT_ALIGN_LEFT:
       return '1%';
-
     case _fontStyle.TEXT_ALIGN_CENTER:
       return '50%';
-
     case _fontStyle.TEXT_ALIGN_RIGHT:
       return '99%';
   }
 };
-
 const generateDVItem = (config, _ref3) => {
   let {
     svgContainer,
@@ -226,18 +210,17 @@ const generateDVItem = (config, _ref3) => {
     fontStyle,
     icon
   } = _ref3;
-
   if (backgroundColor) {
-    svgContainer.setAttribute('style', "background-color: ".concat(backgroundColor, ";"));
+    svgContainer.setAttribute('style', `background-color: ${backgroundColor};`);
     const background = document.createElementNS(svgNS, 'rect');
     background.setAttribute('width', '100%');
     background.setAttribute('height', '100%');
     background.setAttribute('fill', backgroundColor);
     svgContainer.appendChild(background);
   }
+  const svgWrapper = document.createElementNS(svgNS, 'svg');
 
-  const svgWrapper = document.createElementNS(svgNS, 'svg'); // title
-
+  // title
   const title = document.createElementNS(svgNS, 'text');
   const titleFontStyle = (0, _fontStyle.mergeFontStyleWithDefault)(fontStyle && fontStyle[_fontStyle.FONT_STYLE_VISUALIZATION_TITLE], _fontStyle.FONT_STYLE_VISUALIZATION_TITLE);
   const titleYPosition = TOP_MARGIN_FIXED + parseInt(titleFontStyle[_fontStyle.FONT_STYLE_OPTION_FONT_SIZE]) + 'px';
@@ -245,7 +228,7 @@ const generateDVItem = (config, _ref3) => {
     x: getXFromTextAlign(titleFontStyle[_fontStyle.FONT_STYLE_OPTION_TEXT_ALIGN]),
     y: titleYPosition,
     'text-anchor': getTextAnchorFromTextAlign(titleFontStyle[_fontStyle.FONT_STYLE_OPTION_TEXT_ALIGN]),
-    'font-size': "".concat(titleFontStyle[_fontStyle.FONT_STYLE_OPTION_FONT_SIZE], "px"),
+    'font-size': `${titleFontStyle[_fontStyle.FONT_STYLE_OPTION_FONT_SIZE]}px`,
     'font-weight': titleFontStyle[_fontStyle.FONT_STYLE_OPTION_BOLD] ? _fontStyle.FONT_STYLE_OPTION_BOLD : 'normal',
     'font-style': titleFontStyle[_fontStyle.FONT_STYLE_OPTION_ITALIC] ? _fontStyle.FONT_STYLE_OPTION_ITALIC : 'normal',
     'data-test': 'visualization-title',
@@ -255,21 +238,20 @@ const generateDVItem = (config, _ref3) => {
     let [key, value] = _ref4;
     return title.setAttribute(key, value);
   });
-
   if (config.title) {
     title.appendChild(document.createTextNode(config.title));
     svgWrapper.appendChild(title);
-  } // subtitle
-
+  }
 
+  // subtitle
   const subtitle = document.createElementNS(svgNS, 'text');
   const subtitleFontStyle = (0, _fontStyle.mergeFontStyleWithDefault)(fontStyle && fontStyle[_fontStyle.FONT_STYLE_VISUALIZATION_SUBTITLE], _fontStyle.FONT_STYLE_VISUALIZATION_SUBTITLE);
   const subtitleAttributes = {
     x: getXFromTextAlign(subtitleFontStyle[_fontStyle.FONT_STYLE_OPTION_TEXT_ALIGN]),
     y: titleYPosition,
-    dy: "".concat(subtitleFontStyle[_fontStyle.FONT_STYLE_OPTION_FONT_SIZE] + 10),
+    dy: `${subtitleFontStyle[_fontStyle.FONT_STYLE_OPTION_FONT_SIZE] + 10}`,
     'text-anchor': getTextAnchorFromTextAlign(subtitleFontStyle[_fontStyle.FONT_STYLE_OPTION_TEXT_ALIGN]),
-    'font-size': "".concat(subtitleFontStyle[_fontStyle.FONT_STYLE_OPTION_FONT_SIZE], "px"),
+    'font-size': `${subtitleFontStyle[_fontStyle.FONT_STYLE_OPTION_FONT_SIZE]}px`,
     'font-weight': subtitleFontStyle[_fontStyle.FONT_STYLE_OPTION_BOLD] ? _fontStyle.FONT_STYLE_OPTION_BOLD : 'normal',
     'font-style': subtitleFontStyle[_fontStyle.FONT_STYLE_OPTION_ITALIC] ? _fontStyle.FONT_STYLE_OPTION_ITALIC : 'normal',
     fill: titleColor && subtitleFontStyle[_fontStyle.FONT_STYLE_OPTION_TEXT_COLOR] === _fontStyle.defaultFontStyle[_fontStyle.FONT_STYLE_VISUALIZATION_SUBTITLE][_fontStyle.FONT_STYLE_OPTION_TEXT_COLOR] ? titleColor : subtitleFontStyle[_fontStyle.FONT_STYLE_OPTION_TEXT_COLOR],
@@ -279,12 +261,10 @@ const generateDVItem = (config, _ref3) => {
     let [key, value] = _ref5;
     return subtitle.setAttribute(key, value);
   });
-
   if (config.subtitle) {
     subtitle.appendChild(document.createTextNode(config.subtitle));
     svgWrapper.appendChild(subtitle);
   }
-
   svgContainer.appendChild(svgWrapper);
   svgContainer.appendChild(generateValueSVG({
     formattedValue: config.formattedValue,
@@ -299,29 +279,23 @@ const generateDVItem = (config, _ref3) => {
   }));
   return svgContainer;
 };
-
 const shouldUseContrastColor = function () {
   let inputColor = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : '';
   // based on https://stackoverflow.com/questions/3942878/how-to-decide-font-color-in-white-or-black-depending-on-background-color
   var color = inputColor.charAt(0) === '#' ? inputColor.substring(1, 7) : inputColor;
   var r = parseInt(color.substring(0, 2), 16); // hexToR
-
   var g = parseInt(color.substring(2, 4), 16); // hexToG
-
   var b = parseInt(color.substring(4, 6), 16); // hexToB
-
   var uicolors = [r / 255, g / 255, b / 255];
   var c = uicolors.map(col => {
     if (col <= 0.03928) {
       return col / 12.92;
     }
-
     return Math.pow((col + 0.055) / 1.055, 2.4);
   });
   var L = 0.2126 * c[0] + 0.7152 * c[1] + 0.0722 * c[2];
   return L <= 0.179;
 };
-
 function _default(config, parentEl, _ref6) {
   let {
     dashboard,
@@ -334,7 +308,6 @@ function _default(config, parentEl, _ref6) {
   const legendSet = legendOptions && legendSets[0];
   const legendColor = legendSet && (0, _legends.getColorByValueFromLegendSet)(legendSet, config.value);
   let valueColor, titleColor, backgroundColor;
-
   if (legendColor) {
     if (legendOptions.style === _legends.LEGEND_DISPLAY_STYLE_FILL) {
       backgroundColor = legendColor;
@@ -343,7 +316,6 @@ function _default(config, parentEl, _ref6) {
       valueColor = legendColor;
     }
   }
-
   parentEl.style.overflow = 'hidden';
   parentEl.style.display = 'flex';
   parentEl.style.justifyContent = 'center';
@@ -352,11 +324,10 @@ function _default(config, parentEl, _ref6) {
   const height = parentElBBox.height;
   const svgContainer = document.createElementNS(svgNS, 'svg');
   svgContainer.setAttribute('xmlns', svgNS);
-  svgContainer.setAttribute('viewBox', "0 0 ".concat(width, " ").concat(height));
+  svgContainer.setAttribute('viewBox', `0 0 ${width} ${height}`);
   svgContainer.setAttribute('width', dashboard ? '100%' : width);
   svgContainer.setAttribute('height', dashboard ? '100%' : height);
   svgContainer.setAttribute('data-test', 'visualization-container');
-
   if (dashboard) {
     parentEl.style.borderRadius = '3px';
     return generateDashboardItem(config, {
@@ -372,7 +343,7 @@ function _default(config, parentEl, _ref6) {
       } : {})
     });
   } else {
-    parentEl.style.height = "100%";
+    parentEl.style.height = `100%`;
     return generateDVItem(config, {
       svgContainer,
       width,

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

@@ -4,23 +4,14 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = _default;
-
 var _highcharts = _interopRequireDefault(require("highcharts"));
-
 var _highchartsMore = _interopRequireDefault(require("highcharts/highcharts-more"));
-
 var _boost = _interopRequireDefault(require("highcharts/modules/boost"));
-
 var _exporting = _interopRequireDefault(require("highcharts/modules/exporting"));
-
 var _noDataToDisplay = _interopRequireDefault(require("highcharts/modules/no-data-to-display"));
-
 var _patternFill = _interopRequireDefault(require("highcharts/modules/pattern-fill"));
-
 var _solidGauge = _interopRequireDefault(require("highcharts/modules/solid-gauge"));
-
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
 // apply
 (0, _highchartsMore.default)(_highcharts.default);
 (0, _solidGauge.default)(_highcharts.default);
@@ -28,20 +19,16 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
 (0, _exporting.default)(_highcharts.default);
 (0, _patternFill.default)(_highcharts.default);
 (0, _boost.default)(_highcharts.default);
-
 function drawLegendSymbolWrap() {
   const pick = _highcharts.default.pick;
-
   _highcharts.default.wrap(_highcharts.default.seriesTypes.column.prototype, 'drawLegendSymbol', function (proceed, legend, item) {
     var _this$options$legendS, _this$options$legendS2;
-
     if ((_this$options$legendS = this.options.legendSet) !== null && _this$options$legendS !== void 0 && (_this$options$legendS2 = _this$options$legendS.legends) !== null && _this$options$legendS2 !== void 0 && _this$options$legendS2.length) {
       const ys = legend.baseline - legend.symbolHeight + 1,
-            // y start
-      x = legend.symbolWidth / 2 > 8 ? legend.symbolWidth / 2 : 8,
-            // x start
-      ye = legend.symbolHeight + ys; // y end
-
+        // y start
+        x = legend.symbolWidth / 2 > 8 ? legend.symbolWidth / 2 : 8,
+        // x start
+        ye = legend.symbolHeight + ys; // y end
       const legends = this.options.legendSet.legends.sort((a, b) => a.startValue - b.startValue);
       this.chart.renderer.path(['M', x, ys, 'A', 1, 1, 0, 0, 0, x, ye, 'V', ys]).attr({
         fill: legends[legends.length >= 5 ? 1 : 0].color
@@ -51,30 +38,28 @@ function drawLegendSymbolWrap() {
       }).add(this.legendGroup);
     } else {
       var options = legend.options,
-          symbolHeight = legend.symbolHeight,
-          square = options.squareSymbol,
-          symbolWidth = square ? symbolHeight : legend.symbolWidth;
+        symbolHeight = legend.symbolHeight,
+        square = options.squareSymbol,
+        symbolWidth = square ? symbolHeight : legend.symbolWidth;
       item.legendSymbol = this.chart.renderer.rect(square ? (legend.symbolWidth - symbolHeight) / 2 : 0, legend.baseline - symbolHeight + 1, symbolWidth, symbolHeight, pick(legend.options.symbolRadius, symbolHeight / 2)).addClass('highcharts-point').attr({
         zIndex: 3
       }).add(item.legendGroup);
     }
   });
 }
-
 function _default(config, el) {
   if (config) {
-    config.chart.renderTo = el || config.chart.renderTo; // silence warning about accessibility
+    config.chart.renderTo = el || config.chart.renderTo;
 
+    // silence warning about accessibility
     config.accessibility = {
       enabled: false
     };
-
     if (config.lang) {
       _highcharts.default.setOptions({
         lang: config.lang
       });
     }
-
     drawLegendSymbolWrap();
     return new _highcharts.default.Chart(config);
   }

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

@@ -4,13 +4,9 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-
 var _index = _interopRequireDefault(require("./dhis/index.js"));
-
 var _index2 = _interopRequireDefault(require("./highcharts/index.js"));
-
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
 var _default = {
   highcharts: _index2.default,
   dhis: _index.default