@carbon/charts 0.30.24 → 0.30.25

package/components/essentials/tooltip-bar.js

@@ -36,8 +36,10 @@ var TooltipBar = /** @class */ (function (_super) {
         // listen to show-tooltip Custom Events to render the tooltip
         this.services.events.addEventListener(Events.Tooltip.SHOW, function (e) {
             // check the type of tooltip and that it is enabled
-            if ((e.detail.type === TooltipTypes.DATAPOINT && Tools.getProperty(_this.model.getOptions(), "tooltip", "datapoint", "enabled"))
-                || (e.detail.type === TooltipTypes.GRIDLINE && Tools.getProperty(_this.model.getOptions(), "tooltip", "gridline", "enabled"))) {
+            if ((e.detail.type === TooltipTypes.DATAPOINT &&
+                Tools.getProperty(_this.model.getOptions(), "tooltip", "datapoint", "enabled")) ||
+                (e.detail.type === TooltipTypes.GRIDLINE &&
+                    Tools.getProperty(_this.model.getOptions(), "tooltip", "gridline", "enabled"))) {
                 var data = e.detail.hoveredElement.datum();
                 var hoveredElement = e.detail.hoveredElement.node();
                 var defaultHTML = void 0;
@@ -57,7 +59,9 @@ var TooltipBar = /** @class */ (function (_super) {
                 }
                 // if there is a provided tooltip HTML function call it and pass the defaultHTML
                 if (Tools.getProperty(_this.model.getOptions(), "tooltip", "customHTML")) {
-                    tooltipTextContainer.html(_this.model.getOptions().tooltip.customHTML(data, defaultHTML));
+                    tooltipTextContainer.html(_this.model
+                        .getOptions()
+                        .tooltip.customHTML(data, defaultHTML));
                 }
                 else {
                     // default tooltip
@@ -71,7 +75,8 @@ var TooltipBar = /** @class */ (function (_super) {
                 // use the chart size to enforce a max width on the tooltip
                 var chart = DOMUtils.appendOrSelect(holder, "svg." + settings.prefix + "--" + chartprefix + "--chart-svg");
                 // use the configs to determine how large the tooltip should be
-                var tooltipMax = DOMUtils.getSVGElementSize(chart).width * Tools.getProperty(_this.model.getOptions(), "tooltip", "title", "width");
+                var tooltipMax = DOMUtils.getSVGElementSize(chart).width *
+                    Tools.getProperty(_this.model.getOptions(), "tooltip", "title", "width");
                 _this.tooltip.style("max-width", tooltipMax);
                 // use tooltip.ts to get the tooltip html for titles
                 tooltipTextContainer.html(_super.prototype.getTooltipHTML.call(_this, e.detail.hoveredElement, TooltipTypes.TITLE));
@@ -96,23 +101,29 @@ var TooltipBar = /** @class */ (function (_super) {
         if (data === undefined) {
             data = select(hoveredElement).datum();
         }
-        var holderPosition = select(this.services.domUtils.getHolder()).node().getBoundingClientRect();
+        var holderPosition = select(this.services.domUtils.getHolder())
+            .node()
+            .getBoundingClientRect();
         var barPosition = hoveredElement.getBoundingClientRect();
         var verticalOffset = this.model.getOptions().tooltip.datapoint.verticalOffset;
         // if there is a negative value bar chart, need to place the tooltip below the bar
         if (data.value <= 0) {
             // negative bars
             var tooltipPos = {
-                left: (barPosition.left - holderPosition.left) + barPosition.width / 2,
-                top: (barPosition.bottom - holderPosition.top) + verticalOffset
+                left: barPosition.left -
+                    holderPosition.left +
+                    barPosition.width / 2,
+                top: barPosition.bottom - holderPosition.top + verticalOffset
             };
             return { placement: TooltipPosition.BOTTOM, position: tooltipPos };
         }
         else {
             // positive bars
             var tooltipPos = {
-                left: (barPosition.left - holderPosition.left) + barPosition.width / 2,
-                top: (barPosition.top - holderPosition.top) - verticalOffset
+                left: barPosition.left -
+                    holderPosition.left +
+                    barPosition.width / 2,
+                top: barPosition.top - holderPosition.top - verticalOffset
             };
             return { placement: TooltipPosition.TOP, position: tooltipPos };
         }
@@ -122,8 +133,9 @@ var TooltipBar = /** @class */ (function (_super) {
      * @param data associated values for the hovered bar
      */
     TooltipBar.prototype.getTooltipHTML = function (data) {
-        var formattedValue = Tools.getProperty(this.model.getOptions(), "tooltip", "valueFormatter") ?
-            this.model.getOptions().tooltip.valueFormatter(data.value) : data.value.toLocaleString("en");
+        var formattedValue = Tools.getProperty(this.model.getOptions(), "tooltip", "valueFormatter")
+            ? this.model.getOptions().tooltip.valueFormatter(data.value)
+            : data.value.toLocaleString("en");
         return "<div class=\"datapoint-tooltip\"><p class=\"value\">" + formattedValue + "</p></div>";
     };
     /**
@@ -136,23 +148,30 @@ var TooltipBar = /** @class */ (function (_super) {
         points.reverse();
         // in a vertical bar chart the tooltip should display in order of the drawn bars
         // in horizontal stacked bar, the order of the segments from Left to Right are displayed top down in tooltip
-        if (this.services.cartesianScales.getOrientation() === CartesianOrientations.VERTICAL) {
+        if (this.services.cartesianScales.getOrientation() ===
+            CartesianOrientations.VERTICAL) {
             points.reverse();
         }
         // get the total for the stacked tooltip
         var total = points.reduce(function (sum, item) { return sum + item.value; }, 0);
         // format the total value
-        total = Tools.getProperty(this.model.getOptions(), "tooltip", "valueFormatter") ?
-            this.model.getOptions().tooltip.valueFormatter(total) : total.toLocaleString("en");
-        return "<ul class='multi-tooltip'>" +
-            points.map(function (datapoint) {
-                var formattedValue = Tools.getProperty(_this.model.getOptions(), "tooltip", "valueFormatter") ?
-                    _this.model.getOptions().tooltip.valueFormatter(datapoint.value) : datapoint.value.toLocaleString("en");
+        total = Tools.getProperty(this.model.getOptions(), "tooltip", "valueFormatter")
+            ? this.model.getOptions().tooltip.valueFormatter(total)
+            : total.toLocaleString("en");
+        return ("<ul class='multi-tooltip'>" +
+            points
+                .map(function (datapoint) {
+                var formattedValue = Tools.getProperty(_this.model.getOptions(), "tooltip", "valueFormatter")
+                    ? _this.model
+                        .getOptions()
+                        .tooltip.valueFormatter(datapoint.value)
+                    : datapoint.value.toLocaleString("en");
                 // For the tooltip color, we always want the normal stroke color, not dynamically determined by data value.
                 var indicatorColor = _this.model.getStrokeColor(datapoint.datasetLabel, datapoint.label);
                 return "\n\t\t\t\t<li>\n\t\t\t\t\t<div class=\"datapoint-tooltip\">\n\t\t\t\t\t\t<a style=\"background-color:" + indicatorColor + "\" class=\"tooltip-color\"></a>\n\t\t\t\t\t\t<p class=\"label\">" + datapoint.datasetLabel + "</p>\n\t\t\t\t\t\t<p class=\"value\">" + formattedValue + "</p>\n\t\t\t\t\t</div>\n\t\t\t\t</li>";
-            }).join("") +
-            ("<li>\n\t\t\t\t\t<div class='total-val'>\n\t\t\t\t\t\t<p class='label'>Total</p>\n\t\t\t\t\t\t<p class='value'>" + total + "</p>\n\t\t\t\t\t</div>\n\t\t\t\t</li>\n\t\t\t</ul>");
+            })
+                .join("") +
+            ("<li>\n\t\t\t\t\t<div class='total-val'>\n\t\t\t\t\t\t<p class='label'>Total</p>\n\t\t\t\t\t\t<p class='value'>" + total + "</p>\n\t\t\t\t\t</div>\n\t\t\t\t</li>\n\t\t\t</ul>"));
     };
     return TooltipBar;
 }(Tooltip));

package/components/essentials/tooltip-bar.js.map

@@ -1 +1 @@
-{"version":3,"file":"tooltip-bar.js","sourceRoot":"","sources":["tooltip-bar.ts"],"names":[],"mappings":"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","sourcesContent":["import { Tooltip } from \"./tooltip\";\nimport { Tools } from \"../../tools\";\nimport { DOMUtils } from \"../../services\";\nimport {\n\tTooltipPosition,\n\tTooltipTypes,\n\tCartesianOrientations,\n\tEvents\n} from \"./../../interfaces\";\n\n// import the settings for the css prefix\nimport settings from \"carbon-components/es/globals/js/settings\";\n\n// D3 Imports\nimport { select } from \"d3-selection\";\n\nexport class TooltipBar extends Tooltip {\n\tinit() {\n\t\t// Grab the tooltip element\n\t\tconst holder = select(this.services.domUtils.getHolder());\n\t\tconst chartprefix = Tools.getProperty(this.model.getOptions(), \"style\", \"prefix\");\n\t\tthis.tooltip = DOMUtils.appendOrSelect(holder, `div.${settings.prefix}--${chartprefix}--tooltip`);\n\n\t\t// Apply html content to the tooltip\n\t\tconst tooltipTextContainer = DOMUtils.appendOrSelect(this.tooltip, \"div.content-box\");\n\t\tthis.tooltip.style(\"max-width\", null);\n\n\t\t// listen to show-tooltip Custom Events to render the tooltip\n\t\tthis.services.events.addEventListener(Events.Tooltip.SHOW, e => {\n\t\t\t// check the type of tooltip and that it is enabled\n\t\t\tif ((e.detail.type === TooltipTypes.DATAPOINT && Tools.getProperty(this.model.getOptions(), \"tooltip\", \"datapoint\", \"enabled\"))\n\t\t\t\t|| (e.detail.type === TooltipTypes.GRIDLINE && Tools.getProperty(this.model.getOptions(), \"tooltip\", \"gridline\", \"enabled\")) ) {\n\n\t\t\t\tlet data = e.detail.hoveredElement.datum() as any;\n\t\t\t\tconst hoveredElement = e.detail.hoveredElement.node();\n\n\t\t\t\tlet defaultHTML;\n\t\t\t\tif (e.detail.multidata) {\n\t\t\t\t\t// multi tooltip\n\t\t\t\t\tdata = e.detail.multidata;\n\t\t\t\t\tdefaultHTML = this.getMultilineTooltipHTML(data);\n\t\t\t\t} else {\n\t\t\t\t\tif (e.detail.data) {\n\t\t\t\t\t\tdata = e.detail.data;\n\t\t\t\t\t} else {\n\t\t\t\t\t\tdata = e.detail.hoveredElement.datum();\n\t\t\t\t\t}\n\n\t\t\t\t\tdefaultHTML = this.getTooltipHTML(data);\n\t\t\t\t}\n\n\t\t\t\t// if there is a provided tooltip HTML function call it and pass the defaultHTML\n\t\t\t\tif (Tools.getProperty(this.model.getOptions(), \"tooltip\", \"customHTML\")) {\n\t\t\t\t\ttooltipTextContainer.html(this.model.getOptions().tooltip.customHTML(data, defaultHTML));\n\t\t\t\t} else {\n\t\t\t\t\t// default tooltip\n\t\t\t\t\ttooltipTextContainer.html(defaultHTML);\n\t\t\t\t}\n\n\t\t\t\tconst position = this.getTooltipPosition(hoveredElement, data);\n\t\t\t\t// Position the tooltip relative to the bars\n\t\t\t\tthis.positionTooltip(e.detail.multidata ? undefined : position );\n\n\t\t\t} else if (e.detail.type === TooltipTypes.TITLE) {\n\t\t\t\t// use the chart size to enforce a max width on the tooltip\n\t\t\t\tconst chart = DOMUtils.appendOrSelect(holder, `svg.${settings.prefix}--${chartprefix}--chart-svg`);\n\t\t\t\t// use the configs to determine how large the tooltip should be\n\t\t\t\tconst tooltipMax =  DOMUtils.getSVGElementSize(chart).width * Tools.getProperty(this.model.getOptions(), \"tooltip\", \"title\", \"width\");\n\t\t\t\tthis.tooltip.style(\"max-width\", tooltipMax);\n\n\t\t\t\t// use tooltip.ts to get the tooltip html for titles\n\t\t\t\ttooltipTextContainer.html(super.getTooltipHTML(e.detail.hoveredElement, TooltipTypes.TITLE));\n\n\t\t\t\t// get the position based on the title positioning (static)\n\t\t\t\tconst position = super.getTooltipPosition(e.detail.hoveredElement.node());\n\t\t\t\tthis.positionTooltip(position);\n\t\t\t}\n\n\t\t\t// Fade in\n\t\t\tthis.tooltip.classed(\"hidden\", false);\n\t\t});\n\n\t\t// listen to hide-tooltip Custom Events to hide the tooltip\n\t\tthis.services.events.addEventListener(Events.Tooltip.HIDE, () => {\n\t\t\tthis.tooltip.classed(\"hidden\", true);\n\t\t});\n\t}\n\n\t/**\n\t * Get the position of the tooltip relative to the active hovered bar. Tooltip should appear above\n\t * positive valued data and below negative value data.\n\t * @param hoveredElement\n\t */\n\tgetTooltipPosition(hoveredElement, data?: any) {\n\t\tif (data === undefined) {\n\t\t\tdata = select(hoveredElement).datum() as any;\n\t\t}\n\n\t\tconst holderPosition = select(this.services.domUtils.getHolder()).node().getBoundingClientRect();\n\t\tconst barPosition = hoveredElement.getBoundingClientRect();\n\n\t\tconst { verticalOffset } = this.model.getOptions().tooltip.datapoint;\n\t\t// if there is a negative value bar chart, need to place the tooltip below the bar\n\t\tif (data.value <= 0) {\n\t\t\t// negative bars\n\t\t\tconst tooltipPos = {\n\t\t\t\tleft: (barPosition.left - holderPosition.left) + barPosition.width / 2,\n\t\t\t\ttop: (barPosition.bottom - holderPosition.top) + verticalOffset\n\t\t\t};\n\n\t\t\treturn {placement: TooltipPosition.BOTTOM, position: tooltipPos};\n\t\t} else {\n\t\t\t// positive bars\n\t\t\tconst tooltipPos = {\n\t\t\t\tleft: (barPosition.left - holderPosition.left) + barPosition.width / 2,\n\t\t\t\ttop: (barPosition.top - holderPosition.top) - verticalOffset\n\t\t\t};\n\n\t\t\treturn {placement: TooltipPosition.TOP, position: tooltipPos};\n\t\t}\n\t}\n\n\t/**\n\t * Returns the html for the bar single point tooltip\n\t * @param data associated values for the hovered bar\n\t */\n\tgetTooltipHTML(data: any) {\n\t\tconst formattedValue = Tools.getProperty(this.model.getOptions(), \"tooltip\", \"valueFormatter\") ?\n\t\tthis.model.getOptions().tooltip.valueFormatter(data.value) : data.value.toLocaleString(\"en\");\n\n\t\treturn `<div class=\"datapoint-tooltip\"><p class=\"value\">${formattedValue}</p></div>`;\n\t}\n\n\t/**\n\t * Multip tooltips for bar charts include totals for each stack\n\t * @param data\n\t */\n\tgetMultilineTooltipHTML(data: any) {\n\t\tconst points = data;\n\n\t\tpoints.reverse();\n\t\t// in a vertical bar chart the tooltip should display in order of the drawn bars\n\t\t// in horizontal stacked bar, the order of the segments from Left to Right are displayed top down in tooltip\n\t\tif (this.services.cartesianScales.getOrientation() === CartesianOrientations.VERTICAL) {\n\t\t\tpoints.reverse();\n\t\t}\n\n\t\t// get the total for the stacked tooltip\n\t\tlet total = points.reduce((sum, item) => sum + item.value, 0);\n\n\t\t// format the total value\n\t\ttotal = Tools.getProperty(this.model.getOptions(), \"tooltip\", \"valueFormatter\") ?\n\t\tthis.model.getOptions().tooltip.valueFormatter(total) : total.toLocaleString(\"en\");\n\n\t\treturn  \"<ul class='multi-tooltip'>\" +\n\t\t\tpoints.map(datapoint => {\n\t\t\t\tconst formattedValue = Tools.getProperty(this.model.getOptions(), \"tooltip\", \"valueFormatter\") ?\n\t\t\t\tthis.model.getOptions().tooltip.valueFormatter(datapoint.value) : datapoint.value.toLocaleString(\"en\");\n\n\t\t\t\t// For the tooltip color, we always want the normal stroke color, not dynamically determined by data value.\n\t\t\t\tconst indicatorColor = this.model.getStrokeColor(datapoint.datasetLabel, datapoint.label);\n\n\t\t\t\treturn `\n\t\t\t\t<li>\n\t\t\t\t\t<div class=\"datapoint-tooltip\">\n\t\t\t\t\t\t<a style=\"background-color:${indicatorColor}\" class=\"tooltip-color\"></a>\n\t\t\t\t\t\t<p class=\"label\">${datapoint.datasetLabel}</p>\n\t\t\t\t\t\t<p class=\"value\">${formattedValue}</p>\n\t\t\t\t\t</div>\n\t\t\t\t</li>`;\n\t\t\t}).join(\"\") +\n\t\t\t\t`<li>\n\t\t\t\t\t<div class='total-val'>\n\t\t\t\t\t\t<p class='label'>Total</p>\n\t\t\t\t\t\t<p class='value'>${total}</p>\n\t\t\t\t\t</div>\n\t\t\t\t</li>\n\t\t\t</ul>`;\n\t}\n}\n"]}
+{"version":3,"file":"tooltip-bar.js","sourceRoot":"","sources":["tooltip-bar.ts"],"names":[],"mappings":"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","sourcesContent":["import { Tooltip } from \"./tooltip\";\nimport { Tools } from \"../../tools\";\nimport { DOMUtils } from \"../../services\";\nimport {\n\tTooltipPosition,\n\tTooltipTypes,\n\tCartesianOrientations,\n\tEvents\n} from \"./../../interfaces\";\n\n// import the settings for the css prefix\nimport settings from \"carbon-components/es/globals/js/settings\";\n\n// D3 Imports\nimport { select } from \"d3-selection\";\n\nexport class TooltipBar extends Tooltip {\n\tinit() {\n\t\t// Grab the tooltip element\n\t\tconst holder = select(this.services.domUtils.getHolder());\n\t\tconst chartprefix = Tools.getProperty(\n\t\t\tthis.model.getOptions(),\n\t\t\t\"style\",\n\t\t\t\"prefix\"\n\t\t);\n\t\tthis.tooltip = DOMUtils.appendOrSelect(\n\t\t\tholder,\n\t\t\t`div.${settings.prefix}--${chartprefix}--tooltip`\n\t\t);\n\n\t\t// Apply html content to the tooltip\n\t\tconst tooltipTextContainer = DOMUtils.appendOrSelect(\n\t\t\tthis.tooltip,\n\t\t\t\"div.content-box\"\n\t\t);\n\t\tthis.tooltip.style(\"max-width\", null);\n\n\t\t// listen to show-tooltip Custom Events to render the tooltip\n\t\tthis.services.events.addEventListener(Events.Tooltip.SHOW, e => {\n\t\t\t// check the type of tooltip and that it is enabled\n\t\t\tif (\n\t\t\t\t(e.detail.type === TooltipTypes.DATAPOINT &&\n\t\t\t\t\tTools.getProperty(\n\t\t\t\t\t\tthis.model.getOptions(),\n\t\t\t\t\t\t\"tooltip\",\n\t\t\t\t\t\t\"datapoint\",\n\t\t\t\t\t\t\"enabled\"\n\t\t\t\t\t)) ||\n\t\t\t\t(e.detail.type === TooltipTypes.GRIDLINE &&\n\t\t\t\t\tTools.getProperty(\n\t\t\t\t\t\tthis.model.getOptions(),\n\t\t\t\t\t\t\"tooltip\",\n\t\t\t\t\t\t\"gridline\",\n\t\t\t\t\t\t\"enabled\"\n\t\t\t\t\t))\n\t\t\t) {\n\t\t\t\tlet data = e.detail.hoveredElement.datum() as any;\n\t\t\t\tconst hoveredElement = e.detail.hoveredElement.node();\n\n\t\t\t\tlet defaultHTML;\n\t\t\t\tif (e.detail.multidata) {\n\t\t\t\t\t// multi tooltip\n\t\t\t\t\tdata = e.detail.multidata;\n\t\t\t\t\tdefaultHTML = this.getMultilineTooltipHTML(data);\n\t\t\t\t} else {\n\t\t\t\t\tif (e.detail.data) {\n\t\t\t\t\t\tdata = e.detail.data;\n\t\t\t\t\t} else {\n\t\t\t\t\t\tdata = e.detail.hoveredElement.datum();\n\t\t\t\t\t}\n\n\t\t\t\t\tdefaultHTML = this.getTooltipHTML(data);\n\t\t\t\t}\n\n\t\t\t\t// if there is a provided tooltip HTML function call it and pass the defaultHTML\n\t\t\t\tif (\n\t\t\t\t\tTools.getProperty(\n\t\t\t\t\t\tthis.model.getOptions(),\n\t\t\t\t\t\t\"tooltip\",\n\t\t\t\t\t\t\"customHTML\"\n\t\t\t\t\t)\n\t\t\t\t) {\n\t\t\t\t\ttooltipTextContainer.html(\n\t\t\t\t\t\tthis.model\n\t\t\t\t\t\t\t.getOptions()\n\t\t\t\t\t\t\t.tooltip.customHTML(data, defaultHTML)\n\t\t\t\t\t);\n\t\t\t\t} else {\n\t\t\t\t\t// default tooltip\n\t\t\t\t\ttooltipTextContainer.html(defaultHTML);\n\t\t\t\t}\n\n\t\t\t\tconst position = this.getTooltipPosition(hoveredElement, data);\n\t\t\t\t// Position the tooltip relative to the bars\n\t\t\t\tthis.positionTooltip(e.detail.multidata ? undefined : position);\n\t\t\t} else if (e.detail.type === TooltipTypes.TITLE) {\n\t\t\t\t// use the chart size to enforce a max width on the tooltip\n\t\t\t\tconst chart = DOMUtils.appendOrSelect(\n\t\t\t\t\tholder,\n\t\t\t\t\t`svg.${settings.prefix}--${chartprefix}--chart-svg`\n\t\t\t\t);\n\t\t\t\t// use the configs to determine how large the tooltip should be\n\t\t\t\tconst tooltipMax =\n\t\t\t\t\tDOMUtils.getSVGElementSize(chart).width *\n\t\t\t\t\tTools.getProperty(\n\t\t\t\t\t\tthis.model.getOptions(),\n\t\t\t\t\t\t\"tooltip\",\n\t\t\t\t\t\t\"title\",\n\t\t\t\t\t\t\"width\"\n\t\t\t\t\t);\n\t\t\t\tthis.tooltip.style(\"max-width\", tooltipMax);\n\n\t\t\t\t// use tooltip.ts to get the tooltip html for titles\n\t\t\t\ttooltipTextContainer.html(\n\t\t\t\t\tsuper.getTooltipHTML(\n\t\t\t\t\t\te.detail.hoveredElement,\n\t\t\t\t\t\tTooltipTypes.TITLE\n\t\t\t\t\t)\n\t\t\t\t);\n\n\t\t\t\t// get the position based on the title positioning (static)\n\t\t\t\tconst position = super.getTooltipPosition(\n\t\t\t\t\te.detail.hoveredElement.node()\n\t\t\t\t);\n\t\t\t\tthis.positionTooltip(position);\n\t\t\t}\n\n\t\t\t// Fade in\n\t\t\tthis.tooltip.classed(\"hidden\", false);\n\t\t});\n\n\t\t// listen to hide-tooltip Custom Events to hide the tooltip\n\t\tthis.services.events.addEventListener(Events.Tooltip.HIDE, () => {\n\t\t\tthis.tooltip.classed(\"hidden\", true);\n\t\t});\n\t}\n\n\t/**\n\t * Get the position of the tooltip relative to the active hovered bar. Tooltip should appear above\n\t * positive valued data and below negative value data.\n\t * @param hoveredElement\n\t */\n\tgetTooltipPosition(hoveredElement, data?: any) {\n\t\tif (data === undefined) {\n\t\t\tdata = select(hoveredElement).datum() as any;\n\t\t}\n\n\t\tconst holderPosition = select(this.services.domUtils.getHolder())\n\t\t\t.node()\n\t\t\t.getBoundingClientRect();\n\t\tconst barPosition = hoveredElement.getBoundingClientRect();\n\n\t\tconst { verticalOffset } = this.model.getOptions().tooltip.datapoint;\n\t\t// if there is a negative value bar chart, need to place the tooltip below the bar\n\t\tif (data.value <= 0) {\n\t\t\t// negative bars\n\t\t\tconst tooltipPos = {\n\t\t\t\tleft:\n\t\t\t\t\tbarPosition.left -\n\t\t\t\t\tholderPosition.left +\n\t\t\t\t\tbarPosition.width / 2,\n\t\t\t\ttop: barPosition.bottom - holderPosition.top + verticalOffset\n\t\t\t};\n\n\t\t\treturn { placement: TooltipPosition.BOTTOM, position: tooltipPos };\n\t\t} else {\n\t\t\t// positive bars\n\t\t\tconst tooltipPos = {\n\t\t\t\tleft:\n\t\t\t\t\tbarPosition.left -\n\t\t\t\t\tholderPosition.left +\n\t\t\t\t\tbarPosition.width / 2,\n\t\t\t\ttop: barPosition.top - holderPosition.top - verticalOffset\n\t\t\t};\n\n\t\t\treturn { placement: TooltipPosition.TOP, position: tooltipPos };\n\t\t}\n\t}\n\n\t/**\n\t * Returns the html for the bar single point tooltip\n\t * @param data associated values for the hovered bar\n\t */\n\tgetTooltipHTML(data: any) {\n\t\tconst formattedValue = Tools.getProperty(\n\t\t\tthis.model.getOptions(),\n\t\t\t\"tooltip\",\n\t\t\t\"valueFormatter\"\n\t\t)\n\t\t\t? this.model.getOptions().tooltip.valueFormatter(data.value)\n\t\t\t: data.value.toLocaleString(\"en\");\n\n\t\treturn `<div class=\"datapoint-tooltip\"><p class=\"value\">${formattedValue}</p></div>`;\n\t}\n\n\t/**\n\t * Multip tooltips for bar charts include totals for each stack\n\t * @param data\n\t */\n\tgetMultilineTooltipHTML(data: any) {\n\t\tconst points = data;\n\n\t\tpoints.reverse();\n\t\t// in a vertical bar chart the tooltip should display in order of the drawn bars\n\t\t// in horizontal stacked bar, the order of the segments from Left to Right are displayed top down in tooltip\n\t\tif (\n\t\t\tthis.services.cartesianScales.getOrientation() ===\n\t\t\tCartesianOrientations.VERTICAL\n\t\t) {\n\t\t\tpoints.reverse();\n\t\t}\n\n\t\t// get the total for the stacked tooltip\n\t\tlet total = points.reduce((sum, item) => sum + item.value, 0);\n\n\t\t// format the total value\n\t\ttotal = Tools.getProperty(\n\t\t\tthis.model.getOptions(),\n\t\t\t\"tooltip\",\n\t\t\t\"valueFormatter\"\n\t\t)\n\t\t\t? this.model.getOptions().tooltip.valueFormatter(total)\n\t\t\t: total.toLocaleString(\"en\");\n\n\t\treturn (\n\t\t\t\"<ul class='multi-tooltip'>\" +\n\t\t\tpoints\n\t\t\t\t.map(datapoint => {\n\t\t\t\t\tconst formattedValue = Tools.getProperty(\n\t\t\t\t\t\tthis.model.getOptions(),\n\t\t\t\t\t\t\"tooltip\",\n\t\t\t\t\t\t\"valueFormatter\"\n\t\t\t\t\t)\n\t\t\t\t\t\t? this.model\n\t\t\t\t\t\t\t\t.getOptions()\n\t\t\t\t\t\t\t\t.tooltip.valueFormatter(datapoint.value)\n\t\t\t\t\t\t: datapoint.value.toLocaleString(\"en\");\n\n\t\t\t\t\t// For the tooltip color, we always want the normal stroke color, not dynamically determined by data value.\n\t\t\t\t\tconst indicatorColor = this.model.getStrokeColor(\n\t\t\t\t\t\tdatapoint.datasetLabel,\n\t\t\t\t\t\tdatapoint.label\n\t\t\t\t\t);\n\n\t\t\t\t\treturn `\n\t\t\t\t<li>\n\t\t\t\t\t<div class=\"datapoint-tooltip\">\n\t\t\t\t\t\t<a style=\"background-color:${indicatorColor}\" class=\"tooltip-color\"></a>\n\t\t\t\t\t\t<p class=\"label\">${datapoint.datasetLabel}</p>\n\t\t\t\t\t\t<p class=\"value\">${formattedValue}</p>\n\t\t\t\t\t</div>\n\t\t\t\t</li>`;\n\t\t\t\t})\n\t\t\t\t.join(\"\") +\n\t\t\t`<li>\n\t\t\t\t\t<div class='total-val'>\n\t\t\t\t\t\t<p class='label'>Total</p>\n\t\t\t\t\t\t<p class='value'>${total}</p>\n\t\t\t\t\t</div>\n\t\t\t\t</li>\n\t\t\t</ul>`\n\t\t);\n\t}\n}\n"]}

package/components/essentials/tooltip-pie.js

@@ -28,11 +28,12 @@ var TooltipPie = /** @class */ (function (_super) {
         var dataVal = d.data;
         var groupMapsTo = this.model.getOptions().data.groupMapsTo;
         // format the value if needed
-        var formattedValue = Tools.getProperty(this.model.getOptions(), "tooltip", "valueFormatter") ?
-            this.model.getOptions().tooltip.valueFormatter(dataVal.value) : dataVal.value.toLocaleString("en");
+        var formattedValue = Tools.getProperty(this.model.getOptions(), "tooltip", "valueFormatter")
+            ? this.model.getOptions().tooltip.valueFormatter(dataVal.value)
+            : dataVal.value.toLocaleString("en");
         // pie charts don't have a dataset label since they only support one dataset
         var label = dataVal[groupMapsTo];
-        return ("<div class=\"datapoint-tooltip\">\n\t\t\t\t<p class=\"label\">" + label + "</p>\n\t\t\t\t<p class=\"value\">" + formattedValue + "</p>\n\t\t\t</div>");
+        return "<div class=\"datapoint-tooltip\">\n\t\t\t\t<p class=\"label\">" + label + "</p>\n\t\t\t\t<p class=\"value\">" + formattedValue + "</p>\n\t\t\t</div>";
     };
     return TooltipPie;
 }(Tooltip));

package/components/essentials/tooltip-pie.js.map

@@ -1 +1 @@
-{"version":3,"file":"tooltip-pie.js","sourceRoot":"","sources":["tooltip-pie.ts"],"names":[],"mappings":";;;;;;;;;;;;;AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AACpC,OAAO,EAAE,KAAK,EAAE,MAAM,aAAa,CAAC;AACpC,OAAO,EAAE,YAAY,EAAE,MAAM,kBAAkB,CAAC;AAEhD;IAAgC,8BAAO;IAAvC;;IAyBA,CAAC;IAxBA,mCAAc,GAAd,UAAe,CAAM,EAAE,IAAkB;QACxC,mDAAmD;QACnD,IAAI,IAAI,KAAK,YAAY,CAAC,KAAK,EAAE;YAChC,IAAM,KAAK,GAAG,IAAI,CAAC,KAAK,CAAC,UAAU,EAAE,CAAC,KAAK,CAAC;YAC5C,OAAO,wCAAoC,KAAK,kBAAe,CAAC;SAChE;QAED,IAAM,OAAO,GAAG,CAAC,CAAC,IAAI,CAAC;QACf,IAAA,sDAAW,CAAkC;QAErD,6BAA6B;QAC7B,IAAM,cAAc,GAAG,KAAK,CAAC,WAAW,CAAC,IAAI,CAAC,KAAK,CAAC,UAAU,EAAE,EAAE,SAAS,EAAE,gBAAgB,CAAC,CAAC,CAAC;YAChG,IAAI,CAAC,KAAK,CAAC,UAAU,EAAE,CAAC,OAAO,CAAC,cAAc,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC,KAAK,CAAC,cAAc,CAAC,IAAI,CAAC,CAAC;QAEnG,4EAA4E;QAC5E,IAAM,KAAK,GAAG,OAAO,CAAC,WAAW,CAAC,CAAC;QAEnC,OAAO,CACN,mEACoB,KAAK,yCACL,cAAc,uBAC3B,CACP,CAAC;IACH,CAAC;IACF,iBAAC;AAAD,CAAC,AAzBD,CAAgC,OAAO,GAyBtC","sourcesContent":["import { Tooltip } from \"./tooltip\";\nimport { Tools } from \"../../tools\";\nimport { TooltipTypes } from \"../../interfaces\";\n\nexport class TooltipPie extends Tooltip {\n\tgetTooltipHTML(d: any, type: TooltipTypes) {\n\t\t// check if it is getting styles for a tooltip type\n\t\tif (type === TooltipTypes.TITLE) {\n\t\t\tconst title = this.model.getOptions().title;\n\t\t\treturn `<div class=\"title-tooltip\"><text>${title}</text></div>`;\n\t\t}\n\n\t\tconst dataVal = d.data;\n\t\tconst { groupMapsTo } = this.model.getOptions().data;\n\n\t\t// format the value if needed\n\t\tconst formattedValue = Tools.getProperty(this.model.getOptions(), \"tooltip\", \"valueFormatter\") ?\n\t\tthis.model.getOptions().tooltip.valueFormatter(dataVal.value) : dataVal.value.toLocaleString(\"en\");\n\n\t\t// pie charts don't have a dataset label since they only support one dataset\n\t\tconst label = dataVal[groupMapsTo];\n\n\t\treturn (\n\t\t\t`<div class=\"datapoint-tooltip\">\n\t\t\t\t<p class=\"label\">${label}</p>\n\t\t\t\t<p class=\"value\">${formattedValue}</p>\n\t\t\t</div>`\n\t\t);\n\t}\n}\n"]}
+{"version":3,"file":"tooltip-pie.js","sourceRoot":"","sources":["tooltip-pie.ts"],"names":[],"mappings":";;;;;;;;;;;;;AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AACpC,OAAO,EAAE,KAAK,EAAE,MAAM,aAAa,CAAC;AACpC,OAAO,EAAE,YAAY,EAAE,MAAM,kBAAkB,CAAC;AAEhD;IAAgC,8BAAO;IAAvC;;IA4BA,CAAC;IA3BA,mCAAc,GAAd,UAAe,CAAM,EAAE,IAAkB;QACxC,mDAAmD;QACnD,IAAI,IAAI,KAAK,YAAY,CAAC,KAAK,EAAE;YAChC,IAAM,KAAK,GAAG,IAAI,CAAC,KAAK,CAAC,UAAU,EAAE,CAAC,KAAK,CAAC;YAC5C,OAAO,wCAAoC,KAAK,kBAAe,CAAC;SAChE;QAED,IAAM,OAAO,GAAG,CAAC,CAAC,IAAI,CAAC;QACf,IAAA,sDAAW,CAAkC;QAErD,6BAA6B;QAC7B,IAAM,cAAc,GAAG,KAAK,CAAC,WAAW,CACvC,IAAI,CAAC,KAAK,CAAC,UAAU,EAAE,EACvB,SAAS,EACT,gBAAgB,CAChB;YACA,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,UAAU,EAAE,CAAC,OAAO,CAAC,cAAc,CAAC,OAAO,CAAC,KAAK,CAAC;YAC/D,CAAC,CAAC,OAAO,CAAC,KAAK,CAAC,cAAc,CAAC,IAAI,CAAC,CAAC;QAEtC,4EAA4E;QAC5E,IAAM,KAAK,GAAG,OAAO,CAAC,WAAW,CAAC,CAAC;QAEnC,OAAO,mEACc,KAAK,yCACL,cAAc,uBAC3B,CAAC;IACV,CAAC;IACF,iBAAC;AAAD,CAAC,AA5BD,CAAgC,OAAO,GA4BtC","sourcesContent":["import { Tooltip } from \"./tooltip\";\nimport { Tools } from \"../../tools\";\nimport { TooltipTypes } from \"../../interfaces\";\n\nexport class TooltipPie extends Tooltip {\n\tgetTooltipHTML(d: any, type: TooltipTypes) {\n\t\t// check if it is getting styles for a tooltip type\n\t\tif (type === TooltipTypes.TITLE) {\n\t\t\tconst title = this.model.getOptions().title;\n\t\t\treturn `<div class=\"title-tooltip\"><text>${title}</text></div>`;\n\t\t}\n\n\t\tconst dataVal = d.data;\n\t\tconst { groupMapsTo } = this.model.getOptions().data;\n\n\t\t// format the value if needed\n\t\tconst formattedValue = Tools.getProperty(\n\t\t\tthis.model.getOptions(),\n\t\t\t\"tooltip\",\n\t\t\t\"valueFormatter\"\n\t\t)\n\t\t\t? this.model.getOptions().tooltip.valueFormatter(dataVal.value)\n\t\t\t: dataVal.value.toLocaleString(\"en\");\n\n\t\t// pie charts don't have a dataset label since they only support one dataset\n\t\tconst label = dataVal[groupMapsTo];\n\n\t\treturn `<div class=\"datapoint-tooltip\">\n\t\t\t\t<p class=\"label\">${label}</p>\n\t\t\t\t<p class=\"value\">${formattedValue}</p>\n\t\t\t</div>`;\n\t}\n}\n"]}

package/components/essentials/tooltip-radar.js

@@ -25,8 +25,9 @@ var TooltipRadar = /** @class */ (function (_super) {
         var _a = options.radar.axes, angle = _a.angle, value = _a.value;
         // sort them so they are in the same order as the graph
         data.sort(function (a, b) { return b[value] - a[value]; });
-        return "<ul class='multi-tooltip'>" +
-            data.map(function (datum) {
+        return ("<ul class='multi-tooltip'>" +
+            data
+                .map(function (datum) {
                 var userProvidedValueFormatter = Tools.getProperty(options, "tooltip", "valueFormatter");
                 var formattedValue = userProvidedValueFormatter
                     ? userProvidedValueFormatter(datum[value])
@@ -34,7 +35,9 @@ var TooltipRadar = /** @class */ (function (_super) {
                 // For the tooltip color, we always want the normal stroke color, not dynamically determined by data value.
                 var indicatorColor = _this.model.getStrokeColor(datum[groupMapsTo]);
                 return "\n\t\t\t\t<li>\n\t\t\t\t\t<div class=\"datapoint-tooltip\">\n\t\t\t\t\t\t<a style=\"background-color:" + indicatorColor + "\" class=\"tooltip-color\"></a>\n\t\t\t\t\t\t<p class=\"label\">" + datum[groupMapsTo] + "</p>\n\t\t\t\t\t\t<p class=\"value\">" + formattedValue + "</p>\n\t\t\t\t\t</div>\n\t\t\t\t</li>";
-            }).join("") + "</ul>";
+            })
+                .join("") +
+            "</ul>");
     };
     return TooltipRadar;
 }(Tooltip));

package/components/essentials/tooltip-radar.js.map

@@ -1 +1 @@
-{"version":3,"file":"tooltip-radar.js","sourceRoot":"","sources":["tooltip-radar.ts"],"names":[],"mappings":";;;;;;;;;;;;;AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AACpC,OAAO,EAAE,KAAK,EAAE,MAAM,aAAa,CAAC;AAEpC;IAAkC,gCAAO;IAAzC;;IA6BA,CAAC;IA5BA,8CAAuB,GAAvB,UAAwB,IAAS;QAAjC,iBA2BC;QA1BA,IAAM,OAAO,GAAG,IAAI,CAAC,KAAK,CAAC,UAAU,EAAE,CAAC;QAChC,IAAA,sCAAW,CAAkB;QAC/B,IAAA,uBAAqC,EAAnC,gBAAK,EAAE,gBAA4B,CAAC;QAE5C,uDAAuD;QACvD,IAAI,CAAC,IAAI,CAAC,UAAC,CAAC,EAAE,CAAC,IAAK,OAAA,CAAC,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,KAAK,CAAC,EAAnB,CAAmB,CAAC,CAAC;QAEzC,OAAQ,4BAA4B;YACnC,IAAI,CAAC,GAAG,CAAC,UAAA,KAAK;gBACb,IAAM,0BAA0B,GAAG,KAAK,CAAC,WAAW,CAAC,OAAO,EAAE,SAAS,EAAE,gBAAgB,CAAC,CAAC;gBAC3F,IAAM,cAAc,GAAG,0BAA0B;oBAChD,CAAC,CAAC,0BAA0B,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC;oBAC1C,CAAC,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC;gBAEhB,2GAA2G;gBAC3G,IAAM,cAAc,GAAG,KAAI,CAAC,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,WAAW,CAAC,CAAC,CAAC;gBAErE,OAAO,0GAGwB,cAAc,wEACxB,KAAK,CAAC,WAAW,CAAC,6CAClB,cAAc,0CAE7B,CAAC;YACR,CAAC,CAAC,CAAC,IAAI,CAAC,EAAE,CAAC,GAAG,OAAO,CAAC;IACxB,CAAC;IACF,mBAAC;AAAD,CAAC,AA7BD,CAAkC,OAAO,GA6BxC","sourcesContent":["import { Tooltip } from \"./tooltip\";\nimport { Tools } from \"../../tools\";\n\nexport class TooltipRadar extends Tooltip {\n\tgetMultilineTooltipHTML(data: any) {\n\t\tconst options = this.model.getOptions();\n\t\tconst { groupMapsTo } = options.data;\n\t\tconst { angle, value } = options.radar.axes;\n\n\t\t// sort them so they are in the same order as the graph\n\t\tdata.sort((a, b) => b[value] - a[value]);\n\n\t\treturn  \"<ul class='multi-tooltip'>\" +\n\t\t\tdata.map(datum => {\n\t\t\t\tconst userProvidedValueFormatter = Tools.getProperty(options, \"tooltip\", \"valueFormatter\");\n\t\t\t\tconst formattedValue = userProvidedValueFormatter\n\t\t\t\t\t? userProvidedValueFormatter(datum[value])\n\t\t\t\t\t: datum[value];\n\n\t\t\t\t// For the tooltip color, we always want the normal stroke color, not dynamically determined by data value.\n\t\t\t\tconst indicatorColor = this.model.getStrokeColor(datum[groupMapsTo]);\n\n\t\t\t\treturn `\n\t\t\t\t<li>\n\t\t\t\t\t<div class=\"datapoint-tooltip\">\n\t\t\t\t\t\t<a style=\"background-color:${indicatorColor}\" class=\"tooltip-color\"></a>\n\t\t\t\t\t\t<p class=\"label\">${datum[groupMapsTo]}</p>\n\t\t\t\t\t\t<p class=\"value\">${formattedValue}</p>\n\t\t\t\t\t</div>\n\t\t\t\t</li>`;\n\t\t\t}).join(\"\") + \"</ul>\";\n\t}\n}\n"]}
+{"version":3,"file":"tooltip-radar.js","sourceRoot":"","sources":["tooltip-radar.ts"],"names":[],"mappings":";;;;;;;;;;;;;AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AACpC,OAAO,EAAE,KAAK,EAAE,MAAM,aAAa,CAAC;AAEpC;IAAkC,gCAAO;IAAzC;;IAwCA,CAAC;IAvCA,8CAAuB,GAAvB,UAAwB,IAAS;QAAjC,iBAsCC;QArCA,IAAM,OAAO,GAAG,IAAI,CAAC,KAAK,CAAC,UAAU,EAAE,CAAC;QAChC,IAAA,sCAAW,CAAkB;QAC/B,IAAA,uBAAqC,EAAnC,gBAAK,EAAE,gBAA4B,CAAC;QAE5C,uDAAuD;QACvD,IAAI,CAAC,IAAI,CAAC,UAAC,CAAC,EAAE,CAAC,IAAK,OAAA,CAAC,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,KAAK,CAAC,EAAnB,CAAmB,CAAC,CAAC;QAEzC,OAAO,CACN,4BAA4B;YAC5B,IAAI;iBACF,GAAG,CAAC,UAAA,KAAK;gBACT,IAAM,0BAA0B,GAAG,KAAK,CAAC,WAAW,CACnD,OAAO,EACP,SAAS,EACT,gBAAgB,CAChB,CAAC;gBACF,IAAM,cAAc,GAAG,0BAA0B;oBAChD,CAAC,CAAC,0BAA0B,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC;oBAC1C,CAAC,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC;gBAEhB,2GAA2G;gBAC3G,IAAM,cAAc,GAAG,KAAI,CAAC,KAAK,CAAC,cAAc,CAC/C,KAAK,CAAC,WAAW,CAAC,CAClB,CAAC;gBAEF,OAAO,0GAGuB,cAAc,wEACxB,KAAK,CAAC,WAAW,CAAC,6CAClB,cAAc,0CAE7B,CAAC;YACP,CAAC,CAAC;iBACD,IAAI,CAAC,EAAE,CAAC;YACV,OAAO,CACP,CAAC;IACH,CAAC;IACF,mBAAC;AAAD,CAAC,AAxCD,CAAkC,OAAO,GAwCxC","sourcesContent":["import { Tooltip } from \"./tooltip\";\nimport { Tools } from \"../../tools\";\n\nexport class TooltipRadar extends Tooltip {\n\tgetMultilineTooltipHTML(data: any) {\n\t\tconst options = this.model.getOptions();\n\t\tconst { groupMapsTo } = options.data;\n\t\tconst { angle, value } = options.radar.axes;\n\n\t\t// sort them so they are in the same order as the graph\n\t\tdata.sort((a, b) => b[value] - a[value]);\n\n\t\treturn (\n\t\t\t\"<ul class='multi-tooltip'>\" +\n\t\t\tdata\n\t\t\t\t.map(datum => {\n\t\t\t\t\tconst userProvidedValueFormatter = Tools.getProperty(\n\t\t\t\t\t\toptions,\n\t\t\t\t\t\t\"tooltip\",\n\t\t\t\t\t\t\"valueFormatter\"\n\t\t\t\t\t);\n\t\t\t\t\tconst formattedValue = userProvidedValueFormatter\n\t\t\t\t\t\t? userProvidedValueFormatter(datum[value])\n\t\t\t\t\t\t: datum[value];\n\n\t\t\t\t\t// For the tooltip color, we always want the normal stroke color, not dynamically determined by data value.\n\t\t\t\t\tconst indicatorColor = this.model.getStrokeColor(\n\t\t\t\t\t\tdatum[groupMapsTo]\n\t\t\t\t\t);\n\n\t\t\t\t\treturn `\n\t\t\t\t<li>\n\t\t\t\t\t<div class=\"datapoint-tooltip\">\n\t\t\t\t\t\t<a style=\"background-color:${indicatorColor}\" class=\"tooltip-color\"></a>\n\t\t\t\t\t\t<p class=\"label\">${datum[groupMapsTo]}</p>\n\t\t\t\t\t\t<p class=\"value\">${formattedValue}</p>\n\t\t\t\t\t</div>\n\t\t\t\t</li>`;\n\t\t\t\t})\n\t\t\t\t.join(\"\") +\n\t\t\t\"</ul>\"\n\t\t);\n\t}\n}\n"]}

package/components/essentials/tooltip-scatter.js

@@ -27,7 +27,9 @@ var TooltipScatter = /** @class */ (function (_super) {
         var groupMapsTo = this.model.getOptions().data.groupMapsTo;
         var rangeIdentifier = this.services.cartesianScales.getRangeIdentifier();
         var userProvidedValueFormatter = Tools.getProperty(this.model.getOptions(), "tooltip", "valueFormatter");
-        var formattedValue = userProvidedValueFormatter ? userProvidedValueFormatter(datum[rangeIdentifier]) : datum[rangeIdentifier].toLocaleString("en");
+        var formattedValue = userProvidedValueFormatter
+            ? userProvidedValueFormatter(datum[rangeIdentifier])
+            : datum[rangeIdentifier].toLocaleString("en");
         // For the tooltip color, we always want the normal stroke color, not dynamically determined by data value.
         var indicatorColor = this.model.getStrokeColor(datum[groupMapsTo]);
         return "\n\t\t\t<div class=\"datapoint-tooltip\">\n\t\t\t\t<a style=\"background-color:" + indicatorColor + "\" class=\"tooltip-color\"></a>\n\t\t\t\t<p class=\"label\">" + datum[groupMapsTo] + "</p>\n\t\t\t\t<p class=\"value\">" + formattedValue + "</p>\n\t\t\t</div>";

package/components/essentials/tooltip-scatter.js.map

@@ -1 +1 @@
-{"version":3,"file":"tooltip-scatter.js","sourceRoot":"","sources":["tooltip-scatter.ts"],"names":[],"mappings":";;;;;;;;;;;;;AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AACpC,OAAO,EAAE,KAAK,EAAE,MAAM,aAAa,CAAC;AACpC,OAAO,EAAE,YAAY,EAAE,MAAM,oBAAoB,CAAC;AAElD;IAAoC,kCAAO;IAA3C;;IAuBA,CAAC;IAtBA,uCAAc,GAAd,UAAe,KAAU,EAAE,IAAkB;QAC5C,IAAI,IAAI,KAAK,YAAY,CAAC,KAAK,EAAE;YAChC,kDAAkD;YAClD,OAAO,iBAAM,cAAc,YAAC,KAAK,EAAE,IAAI,CAAC,CAAC;SACzC;QAEO,IAAA,sDAAW,CAAkC;QACrD,IAAM,eAAe,GAAG,IAAI,CAAC,QAAQ,CAAC,eAAe,CAAC,kBAAkB,EAAE,CAAC;QAE3E,IAAM,0BAA0B,GAAG,KAAK,CAAC,WAAW,CAAC,IAAI,CAAC,KAAK,CAAC,UAAU,EAAE,EAAE,SAAS,EAAE,gBAAgB,CAAC,CAAC;QAC3G,IAAM,cAAc,GAAG,0BAA0B,CAAC,CAAC,CAAC,0BAA0B,CAAC,KAAK,CAAC,eAAe,CAAC,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,eAAe,CAAC,CAAC,cAAc,CAAC,IAAI,CAAC,CAAC;QAErJ,2GAA2G;QAC3G,IAAM,cAAc,GAAG,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,WAAW,CAAC,CAAC,CAAC;QAErE,OAAO,oFAEwB,cAAc,oEACxB,KAAK,CAAC,WAAW,CAAC,yCAClB,cAAc,uBAC3B,CAAC;IACV,CAAC;IACF,qBAAC;AAAD,CAAC,AAvBD,CAAoC,OAAO,GAuB1C","sourcesContent":["import { Tooltip } from \"./tooltip\";\nimport { Tools } from \"../../tools\";\nimport { TooltipTypes } from \"./../../interfaces\";\n\nexport class TooltipScatter extends Tooltip {\n\tgetTooltipHTML(datum: any, type: TooltipTypes) {\n\t\tif (type === TooltipTypes.TITLE) {\n\t\t\t// the main tooltip component handles title styles\n\t\t\treturn super.getTooltipHTML(datum, type);\n\t\t}\n\n\t\tconst { groupMapsTo } = this.model.getOptions().data;\n\t\tconst rangeIdentifier = this.services.cartesianScales.getRangeIdentifier();\n\n\t\tconst userProvidedValueFormatter = Tools.getProperty(this.model.getOptions(), \"tooltip\", \"valueFormatter\");\n\t\tconst formattedValue = userProvidedValueFormatter ? userProvidedValueFormatter(datum[rangeIdentifier]) : datum[rangeIdentifier].toLocaleString(\"en\");\n\n\t\t// For the tooltip color, we always want the normal stroke color, not dynamically determined by data value.\n\t\tconst indicatorColor = this.model.getStrokeColor(datum[groupMapsTo]);\n\n\t\treturn `\n\t\t\t<div class=\"datapoint-tooltip\">\n\t\t\t\t<a style=\"background-color:${indicatorColor}\" class=\"tooltip-color\"></a>\n\t\t\t\t<p class=\"label\">${datum[groupMapsTo]}</p>\n\t\t\t\t<p class=\"value\">${formattedValue}</p>\n\t\t\t</div>`;\n\t}\n}\n"]}
+{"version":3,"file":"tooltip-scatter.js","sourceRoot":"","sources":["tooltip-scatter.ts"],"names":[],"mappings":";;;;;;;;;;;;;AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AACpC,OAAO,EAAE,KAAK,EAAE,MAAM,aAAa,CAAC;AACpC,OAAO,EAAE,YAAY,EAAE,MAAM,oBAAoB,CAAC;AAElD;IAAoC,kCAAO;IAA3C;;IA6BA,CAAC;IA5BA,uCAAc,GAAd,UAAe,KAAU,EAAE,IAAkB;QAC5C,IAAI,IAAI,KAAK,YAAY,CAAC,KAAK,EAAE;YAChC,kDAAkD;YAClD,OAAO,iBAAM,cAAc,YAAC,KAAK,EAAE,IAAI,CAAC,CAAC;SACzC;QAEO,IAAA,sDAAW,CAAkC;QACrD,IAAM,eAAe,GAAG,IAAI,CAAC,QAAQ,CAAC,eAAe,CAAC,kBAAkB,EAAE,CAAC;QAE3E,IAAM,0BAA0B,GAAG,KAAK,CAAC,WAAW,CACnD,IAAI,CAAC,KAAK,CAAC,UAAU,EAAE,EACvB,SAAS,EACT,gBAAgB,CAChB,CAAC;QACF,IAAM,cAAc,GAAG,0BAA0B;YAChD,CAAC,CAAC,0BAA0B,CAAC,KAAK,CAAC,eAAe,CAAC,CAAC;YACpD,CAAC,CAAC,KAAK,CAAC,eAAe,CAAC,CAAC,cAAc,CAAC,IAAI,CAAC,CAAC;QAE/C,2GAA2G;QAC3G,IAAM,cAAc,GAAG,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,WAAW,CAAC,CAAC,CAAC;QAErE,OAAO,oFAEwB,cAAc,oEACxB,KAAK,CAAC,WAAW,CAAC,yCAClB,cAAc,uBAC3B,CAAC;IACV,CAAC;IACF,qBAAC;AAAD,CAAC,AA7BD,CAAoC,OAAO,GA6B1C","sourcesContent":["import { Tooltip } from \"./tooltip\";\nimport { Tools } from \"../../tools\";\nimport { TooltipTypes } from \"./../../interfaces\";\n\nexport class TooltipScatter extends Tooltip {\n\tgetTooltipHTML(datum: any, type: TooltipTypes) {\n\t\tif (type === TooltipTypes.TITLE) {\n\t\t\t// the main tooltip component handles title styles\n\t\t\treturn super.getTooltipHTML(datum, type);\n\t\t}\n\n\t\tconst { groupMapsTo } = this.model.getOptions().data;\n\t\tconst rangeIdentifier = this.services.cartesianScales.getRangeIdentifier();\n\n\t\tconst userProvidedValueFormatter = Tools.getProperty(\n\t\t\tthis.model.getOptions(),\n\t\t\t\"tooltip\",\n\t\t\t\"valueFormatter\"\n\t\t);\n\t\tconst formattedValue = userProvidedValueFormatter\n\t\t\t? userProvidedValueFormatter(datum[rangeIdentifier])\n\t\t\t: datum[rangeIdentifier].toLocaleString(\"en\");\n\n\t\t// For the tooltip color, we always want the normal stroke color, not dynamically determined by data value.\n\t\tconst indicatorColor = this.model.getStrokeColor(datum[groupMapsTo]);\n\n\t\treturn `\n\t\t\t<div class=\"datapoint-tooltip\">\n\t\t\t\t<a style=\"background-color:${indicatorColor}\" class=\"tooltip-color\"></a>\n\t\t\t\t<p class=\"label\">${datum[groupMapsTo]}</p>\n\t\t\t\t<p class=\"value\">${formattedValue}</p>\n\t\t\t</div>`;\n\t}\n}\n"]}

package/components/essentials/tooltip.js

@@ -42,8 +42,10 @@ var Tooltip = /** @class */ (function (_super) {
         // listen to show-tooltip Custom Events to render the tooltip
         this.services.events.addEventListener(Events.Tooltip.SHOW, function (e) {
             // check the type of tooltip and that it is enabled
-            if ((e.detail.type === TooltipTypes.DATAPOINT && Tools.getProperty(_this.model.getOptions(), "tooltip", "datapoint", "enabled"))
-                || (e.detail.type === TooltipTypes.GRIDLINE && Tools.getProperty(_this.model.getOptions(), "tooltip", "gridline", "enabled"))) {
+            if ((e.detail.type === TooltipTypes.DATAPOINT &&
+                Tools.getProperty(_this.model.getOptions(), "tooltip", "datapoint", "enabled")) ||
+                (e.detail.type === TooltipTypes.GRIDLINE &&
+                    Tools.getProperty(_this.model.getOptions(), "tooltip", "gridline", "enabled"))) {
                 var data = select(event.target).datum();
                 // Generate default tooltip
                 var defaultHTML = void 0;
@@ -57,7 +59,9 @@ var Tooltip = /** @class */ (function (_super) {
                 }
                 // if there is a provided tooltip HTML function call it
                 if (Tools.getProperty(_this.model.getOptions(), "tooltip", "customHTML")) {
-                    tooltipTextContainer.html(_this.model.getOptions().tooltip.customHTML(data, defaultHTML));
+                    tooltipTextContainer.html(_this.model
+                        .getOptions()
+                        .tooltip.customHTML(data, defaultHTML));
                 }
                 else {
                     // Use default tooltip
@@ -68,7 +72,8 @@ var Tooltip = /** @class */ (function (_super) {
             }
             else if (e.detail.type === TooltipTypes.TITLE) {
                 var chart = DOMUtils.appendOrSelect(holder, "svg." + settings.prefix + "--" + chartprefix + "--chart-svg");
-                var chartWidth = DOMUtils.getSVGElementSize(chart).width * Tools.getProperty(_this.model.getOptions(), "tooltip", "title", "width");
+                var chartWidth = DOMUtils.getSVGElementSize(chart).width *
+                    Tools.getProperty(_this.model.getOptions(), "tooltip", "title", "width");
                 _this.tooltip.style("max-width", chartWidth);
                 tooltipTextContainer.html(_this.getTooltipHTML(e.detail.hoveredElement, TooltipTypes.TITLE));
                 // get the position based on the title positioning (static)
@@ -94,8 +99,11 @@ var Tooltip = /** @class */ (function (_super) {
         var groupMapsTo = this.model.getOptions().data.groupMapsTo;
         var rangeIdentifier = this.services.cartesianScales.getRangeIdentifier();
         // format the value if needed
-        var formattedValue = Tools.getProperty(this.model.getOptions(), "tooltip", "valueFormatter") ?
-            this.model.getOptions().tooltip.valueFormatter(dataVal[rangeIdentifier]) : dataVal[rangeIdentifier].toLocaleString("en");
+        var formattedValue = Tools.getProperty(this.model.getOptions(), "tooltip", "valueFormatter")
+            ? this.model
+                .getOptions()
+                .tooltip.valueFormatter(dataVal[rangeIdentifier])
+            : dataVal[rangeIdentifier].toLocaleString("en");
         // pie charts don't have a dataset label since they only support one dataset
         var label = dataVal[groupMapsTo];
         return "<div class=\"datapoint-tooltip\">\n\t\t\t\t\t<p class=\"label\">" + label + "</p>\n\t\t\t\t\t<p class=\"value\">" + formattedValue + "</p>\n\t\t\t\t</div>";
@@ -105,30 +113,40 @@ var Tooltip = /** @class */ (function (_super) {
         // sort them so they are in the same order as the graph
         data.sort(function (a, b) { return b.value - a.value; });
         // tells us which value to use
-        var scaleType = this.services.cartesianScales.getDomainScale().scaleType;
-        return "<ul class='multi-tooltip'>" +
-            data.map(function (datum) {
+        var scaleType = this.services.cartesianScales.getDomainScale()
+            .scaleType;
+        return ("<ul class='multi-tooltip'>" +
+            data
+                .map(function (datum) {
                 var groupMapsTo = _this.model.getOptions().data.groupMapsTo;
                 var rangeIdentifier = _this.services.cartesianScales.getRangeIdentifier();
                 var userProvidedValueFormatter = Tools.getProperty(_this.model.getOptions(), "tooltip", "valueFormatter");
-                var formattedValue = userProvidedValueFormatter ? userProvidedValueFormatter(datum[rangeIdentifier]) : datum[rangeIdentifier].toLocaleString("en");
+                var formattedValue = userProvidedValueFormatter
+                    ? userProvidedValueFormatter(datum[rangeIdentifier])
+                    : datum[rangeIdentifier].toLocaleString("en");
                 // For the tooltip color, we always want the normal stroke color, not dynamically determined by data value.
                 var indicatorColor = _this.model.getStrokeColor(datum[groupMapsTo]);
                 return "\n\t\t\t\t<li>\n\t\t\t\t\t<div class=\"datapoint-tooltip\">\n\t\t\t\t\t\t<a style=\"background-color:" + indicatorColor + "\" class=\"tooltip-color\"></a>\n\t\t\t\t\t\t<p class=\"label\">" + datum[groupMapsTo] + "</p>\n\t\t\t\t\t\t<p class=\"value\">" + formattedValue + "</p>\n\t\t\t\t\t</div>\n\t\t\t\t</li>";
-            }).join("") + "</ul>";
+            })
+                .join("") +
+            "</ul>");
     };
     Tooltip.prototype.render = function () {
         this.tooltip.classed("hidden", true);
     };
     // returns static position based on the element
     Tooltip.prototype.getTooltipPosition = function (hoveredElement) {
-        var holderPosition = select(this.services.domUtils.getHolder()).node().getBoundingClientRect();
+        var holderPosition = select(this.services.domUtils.getHolder())
+            .node()
+            .getBoundingClientRect();
         var elementPosition = hoveredElement.getBoundingClientRect();
         // get the vertical offset
         var verticalOffset = this.model.getOptions().tooltip.title.verticalOffset;
         var tooltipPos = {
-            left: (elementPosition.left - holderPosition.left) + elementPosition.width / 2,
-            top: (elementPosition.top - holderPosition.top - verticalOffset)
+            left: elementPosition.left -
+                holderPosition.left +
+                elementPosition.width / 2,
+            top: elementPosition.top - holderPosition.top - verticalOffset
         };
         return { placement: TooltipPosition.BOTTOM, position: tooltipPos };
     };
@@ -140,7 +158,9 @@ var Tooltip = /** @class */ (function (_super) {
         // override position to place tooltip at {placement:.., position:{top:.. , left:..}}
         if (positionOverride) {
             // placement determines whether the tooltip is centered above or below the position provided
-            var placement = positionOverride.placement === TooltipPosition.TOP ? PLACEMENTS.TOP : PLACEMENTS.BOTTOM;
+            var placement = positionOverride.placement === TooltipPosition.TOP
+                ? PLACEMENTS.TOP
+                : PLACEMENTS.BOTTOM;
             pos = this.positionService.findPositionAt(positionOverride.position, target, placement);
         }
         else {

package/components/essentials/tooltip.js.map

@@ -1 +1 @@
-{"version":3,"file":"tooltip.js","sourceRoot":"","sources":["tooltip.ts"],"names":[],"mappings":"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","sourcesContent":["import * as Configuration from \"../../configuration\";\nimport { Component } from \"../component\";\nimport { Tools } from \"../../tools\";\nimport { DOMUtils } from \"../../services\";\nimport { ChartModel } from \"../../model\";\n\n// Carbon position service\nimport Position, { PLACEMENTS } from \"@carbon/utils-position\";\n\n// import the settings for the css prefix\nimport settings from \"carbon-components/es/globals/js/settings\";\n\n// D3 Imports\nimport { select, mouse, event } from \"d3-selection\";\nimport { TooltipTypes, TooltipPosition, Events } from \"../../interfaces\";\n\nexport class Tooltip extends Component {\n\ttype = \"tooltip\";\n\n\ttooltip: any;\n\tpositionService = new Position();\n\n\tconstructor(model: ChartModel, services: any, configs?: any) {\n\t\tsuper(model, services, configs);\n\n\t\tthis.init();\n\t}\n\n\tinit() {\n\t\t// Grab the tooltip element\n\t\tconst holder = select(this.services.domUtils.getHolder());\n\t\tconst chartprefix = Tools.getProperty(this.model.getOptions(), \"style\", \"prefix\");\n\t\tthis.tooltip = DOMUtils.appendOrSelect(holder, `div.${settings.prefix}--${chartprefix}--tooltip`);\n\n\t\t// Apply html content to the tooltip\n\t\tconst tooltipTextContainer = DOMUtils.appendOrSelect(this.tooltip, \"div.content-box\");\n\t\tthis.tooltip.style(\"max-width\", null);\n\n\t\t// listen to show-tooltip Custom Events to render the tooltip\n\t\tthis.services.events.addEventListener(Events.Tooltip.SHOW, e => {\n\t\t\t// check the type of tooltip and that it is enabled\n\t\t\tif ((e.detail.type === TooltipTypes.DATAPOINT && Tools.getProperty(this.model.getOptions(), \"tooltip\", \"datapoint\", \"enabled\"))\n\t\t\t\t|| (e.detail.type === TooltipTypes.GRIDLINE && Tools.getProperty(this.model.getOptions(), \"tooltip\", \"gridline\", \"enabled\")) ) {\n\n\t\t\t\tlet data = select(event.target).datum() as any;\n\n\t\t\t\t// Generate default tooltip\n\t\t\t\tlet defaultHTML;\n\t\t\t\tif (e.detail.multidata) {\n\t\t\t\t\t// multi tooltip\n\t\t\t\t\tdata = e.detail.multidata;\n\t\t\t\t\tdefaultHTML = this.getMultilineTooltipHTML(data);\n\t\t\t\t} else {\n\t\t\t\t\tdefaultHTML = this.getTooltipHTML(data, TooltipTypes.DATAPOINT);\n\t\t\t\t}\n\n\t\t\t\t// if there is a provided tooltip HTML function call it\n\t\t\t\tif (Tools.getProperty(this.model.getOptions(), \"tooltip\", \"customHTML\")) {\n\t\t\t\t\ttooltipTextContainer.html(this.model.getOptions().tooltip.customHTML(data, defaultHTML));\n\t\t\t\t} else {\n\t\t\t\t\t// Use default tooltip\n\t\t\t\t\ttooltipTextContainer.html(defaultHTML);\n\t\t\t\t}\n\n\t\t\t\t// Position the tooltip\n\t\t\t\tthis.positionTooltip();\n\n\t\t\t} else if (e.detail.type === TooltipTypes.TITLE) {\n\t\t\t\tconst chart = DOMUtils.appendOrSelect(holder, `svg.${settings.prefix}--${chartprefix}--chart-svg`);\n\t\t\t\tconst chartWidth =  DOMUtils.getSVGElementSize(chart).width * Tools.getProperty(this.model.getOptions(), \"tooltip\", \"title\", \"width\");\n\n\t\t\t\tthis.tooltip.style(\"max-width\", chartWidth);\n\n\n\t\t\t\ttooltipTextContainer.html(this.getTooltipHTML(e.detail.hoveredElement, TooltipTypes.TITLE));\n\n\t\t\t\t// get the position based on the title positioning (static)\n\t\t\t\tconst position = this.getTooltipPosition(e.detail.hoveredElement.node());\n\t\t\t\tthis.positionTooltip(position);\n\n\t\t\t}\n\n\t\t\t// Fade in\n\t\t\tthis.tooltip.classed(\"hidden\", false);\n\t\t});\n\n\t\t// listen to hide-tooltip Custom Events to hide the tooltip\n\t\tthis.services.events.addEventListener(Events.Tooltip.HIDE, () => {\n\t\t\tthis.tooltip.classed(\"hidden\", true);\n\t\t});\n\t}\n\n\tgetTooltipHTML(data: any, type: TooltipTypes) {\n\t\t// check if it is getting styles for a tooltip type\n\t\tif (type === TooltipTypes.TITLE) {\n\t\t\tconst title = this.model.getOptions().title;\n\t\t\treturn `<div class=\"title-tooltip\"><text>${title}</text></div>`;\n\t\t}\n\t\t// this cleans up the data item, pie slices have the data within the data.data but other datapoints are self contained within data\n\t\tconst dataVal = Tools.getProperty(data, \"data\") ? data.data : data;\n\t\tconst { groupMapsTo } = this.model.getOptions().data;\n\t\tconst rangeIdentifier = this.services.cartesianScales.getRangeIdentifier();\n\n\t\t// format the value if needed\n\t\tconst formattedValue = Tools.getProperty(this.model.getOptions(), \"tooltip\", \"valueFormatter\") ?\n\t\tthis.model.getOptions().tooltip.valueFormatter(dataVal[rangeIdentifier]) : dataVal[rangeIdentifier].toLocaleString(\"en\");\n\n\t\t// pie charts don't have a dataset label since they only support one dataset\n\t\tconst label = dataVal[groupMapsTo];\n\n\t\treturn `<div class=\"datapoint-tooltip\">\n\t\t\t\t\t<p class=\"label\">${label}</p>\n\t\t\t\t\t<p class=\"value\">${formattedValue}</p>\n\t\t\t\t</div>`;\n\t}\n\n\tgetMultilineTooltipHTML(data: any) {\n\n\t\t// sort them so they are in the same order as the graph\n\t\tdata.sort((a, b) => b.value - a.value);\n\n\t\t// tells us which value to use\n\t\tconst scaleType = this.services.cartesianScales.getDomainScale().scaleType;\n\n\t\treturn  \"<ul class='multi-tooltip'>\" +\n\t\t\tdata.map(datum => {\n\t\t\t\tconst { groupMapsTo } = this.model.getOptions().data;\n\t\t\t\tconst rangeIdentifier = this.services.cartesianScales.getRangeIdentifier();\n\n\t\t\t\tconst userProvidedValueFormatter = Tools.getProperty(this.model.getOptions(), \"tooltip\", \"valueFormatter\");\n\t\t\t\tconst formattedValue = userProvidedValueFormatter ? userProvidedValueFormatter(datum[rangeIdentifier]) : datum[rangeIdentifier].toLocaleString(\"en\");\n\n\t\t\t\t// For the tooltip color, we always want the normal stroke color, not dynamically determined by data value.\n\t\t\t\tconst indicatorColor = this.model.getStrokeColor(datum[groupMapsTo]);\n\n\t\t\t\treturn `\n\t\t\t\t<li>\n\t\t\t\t\t<div class=\"datapoint-tooltip\">\n\t\t\t\t\t\t<a style=\"background-color:${indicatorColor}\" class=\"tooltip-color\"></a>\n\t\t\t\t\t\t<p class=\"label\">${datum[groupMapsTo]}</p>\n\t\t\t\t\t\t<p class=\"value\">${formattedValue}</p>\n\t\t\t\t\t</div>\n\t\t\t\t</li>`;\n\t\t\t}).join(\"\") + \"</ul>\";\n\t}\n\n\trender() {\n\t\tthis.tooltip.classed(\"hidden\", true);\n\t}\n\n\t// returns static position based on the element\n\tgetTooltipPosition(hoveredElement) {\n\t\tconst holderPosition = select(this.services.domUtils.getHolder()).node().getBoundingClientRect();\n\t\tconst elementPosition = hoveredElement.getBoundingClientRect();\n\n\t\t// get the vertical offset\n\t\tconst { verticalOffset } = this.model.getOptions().tooltip.title;\n\n\t\tconst tooltipPos = {\n\t\t\tleft: (elementPosition.left - holderPosition.left) + elementPosition.width / 2,\n\t\t\ttop: (elementPosition.top - holderPosition.top - verticalOffset)\n\t\t};\n\n\t\treturn { placement: TooltipPosition.BOTTOM, position: tooltipPos };\n\t}\n\n\tpositionTooltip(positionOverride?: any) {\n\t\tconst holder = this.services.domUtils.getHolder();\n\t\tconst target = this.tooltip.node();\n\t\tconst mouseRelativePos = mouse(holder);\n\t\tlet pos;\n\n\t\t// override position to place tooltip at {placement:.., position:{top:.. , left:..}}\n\t\tif (positionOverride) {\n\t\t\t// placement determines whether the tooltip is centered above or below the position provided\n\t\t\tconst placement = positionOverride.placement === TooltipPosition.TOP ? PLACEMENTS.TOP : PLACEMENTS.BOTTOM;\n\n\t\t\tpos = this.positionService.findPositionAt(\n\t\t\t\tpositionOverride.position,\n\t\t\t\ttarget,\n\t\t\t\tplacement\n\t\t\t);\n\t\t} else {\n\t\t\t// Find out whether tooltip should be shown on the left or right side\n\t\t\tconst bestPlacementOption = this.positionService.findBestPlacementAt(\n\t\t\t\t{\n\t\t\t\t\tleft: mouseRelativePos[0],\n\t\t\t\t\ttop: mouseRelativePos[1]\n\t\t\t\t},\n\t\t\t\ttarget,\n\t\t\t\t[\n\t\t\t\t\tPLACEMENTS.RIGHT,\n\t\t\t\t\tPLACEMENTS.LEFT,\n\t\t\t\t\tPLACEMENTS.TOP,\n\t\t\t\t\tPLACEMENTS.BOTTOM\n\t\t\t\t],\n\t\t\t\t() => ({\n\t\t\t\t\twidth: holder.offsetWidth,\n\t\t\t\t\theight: holder.offsetHeight\n\t\t\t\t})\n\t\t\t);\n\n\t\t\tlet { horizontalOffset } = this.model.getOptions().tooltip.datapoint;\n\t\t\tif (bestPlacementOption === PLACEMENTS.LEFT) {\n\t\t\t\thorizontalOffset *= -1;\n\t\t\t}\n\n\t\t\t// Get coordinates to where tooltip should be positioned\n\t\t\tpos = this.positionService.findPositionAt(\n\t\t\t\t{\n\t\t\t\t\tleft: mouseRelativePos[0] + horizontalOffset,\n\t\t\t\t\ttop: mouseRelativePos[1]\n\t\t\t\t},\n\t\t\t\ttarget,\n\t\t\t\tbestPlacementOption\n\t\t\t);\n\t\t}\n\n\t\tthis.positionService.setElement(target, pos);\n\t}\n}\n"]}
+{"version":3,"file":"tooltip.js","sourceRoot":"","sources":["tooltip.ts"],"names":[],"mappings":"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","sourcesContent":["import * as Configuration from \"../../configuration\";\nimport { Component } from \"../component\";\nimport { Tools } from \"../../tools\";\nimport { DOMUtils } from \"../../services\";\nimport { ChartModel } from \"../../model\";\n\n// Carbon position service\nimport Position, { PLACEMENTS } from \"@carbon/utils-position\";\n\n// import the settings for the css prefix\nimport settings from \"carbon-components/es/globals/js/settings\";\n\n// D3 Imports\nimport { select, mouse, event } from \"d3-selection\";\nimport { TooltipTypes, TooltipPosition, Events } from \"../../interfaces\";\n\nexport class Tooltip extends Component {\n\ttype = \"tooltip\";\n\n\ttooltip: any;\n\tpositionService = new Position();\n\n\tconstructor(model: ChartModel, services: any, configs?: any) {\n\t\tsuper(model, services, configs);\n\n\t\tthis.init();\n\t}\n\n\tinit() {\n\t\t// Grab the tooltip element\n\t\tconst holder = select(this.services.domUtils.getHolder());\n\t\tconst chartprefix = Tools.getProperty(\n\t\t\tthis.model.getOptions(),\n\t\t\t\"style\",\n\t\t\t\"prefix\"\n\t\t);\n\t\tthis.tooltip = DOMUtils.appendOrSelect(\n\t\t\tholder,\n\t\t\t`div.${settings.prefix}--${chartprefix}--tooltip`\n\t\t);\n\n\t\t// Apply html content to the tooltip\n\t\tconst tooltipTextContainer = DOMUtils.appendOrSelect(\n\t\t\tthis.tooltip,\n\t\t\t\"div.content-box\"\n\t\t);\n\t\tthis.tooltip.style(\"max-width\", null);\n\n\t\t// listen to show-tooltip Custom Events to render the tooltip\n\t\tthis.services.events.addEventListener(Events.Tooltip.SHOW, e => {\n\t\t\t// check the type of tooltip and that it is enabled\n\t\t\tif (\n\t\t\t\t(e.detail.type === TooltipTypes.DATAPOINT &&\n\t\t\t\t\tTools.getProperty(\n\t\t\t\t\t\tthis.model.getOptions(),\n\t\t\t\t\t\t\"tooltip\",\n\t\t\t\t\t\t\"datapoint\",\n\t\t\t\t\t\t\"enabled\"\n\t\t\t\t\t)) ||\n\t\t\t\t(e.detail.type === TooltipTypes.GRIDLINE &&\n\t\t\t\t\tTools.getProperty(\n\t\t\t\t\t\tthis.model.getOptions(),\n\t\t\t\t\t\t\"tooltip\",\n\t\t\t\t\t\t\"gridline\",\n\t\t\t\t\t\t\"enabled\"\n\t\t\t\t\t))\n\t\t\t) {\n\t\t\t\tlet data = select(event.target).datum() as any;\n\n\t\t\t\t// Generate default tooltip\n\t\t\t\tlet defaultHTML;\n\t\t\t\tif (e.detail.multidata) {\n\t\t\t\t\t// multi tooltip\n\t\t\t\t\tdata = e.detail.multidata;\n\t\t\t\t\tdefaultHTML = this.getMultilineTooltipHTML(data);\n\t\t\t\t} else {\n\t\t\t\t\tdefaultHTML = this.getTooltipHTML(\n\t\t\t\t\t\tdata,\n\t\t\t\t\t\tTooltipTypes.DATAPOINT\n\t\t\t\t\t);\n\t\t\t\t}\n\n\t\t\t\t// if there is a provided tooltip HTML function call it\n\t\t\t\tif (\n\t\t\t\t\tTools.getProperty(\n\t\t\t\t\t\tthis.model.getOptions(),\n\t\t\t\t\t\t\"tooltip\",\n\t\t\t\t\t\t\"customHTML\"\n\t\t\t\t\t)\n\t\t\t\t) {\n\t\t\t\t\ttooltipTextContainer.html(\n\t\t\t\t\t\tthis.model\n\t\t\t\t\t\t\t.getOptions()\n\t\t\t\t\t\t\t.tooltip.customHTML(data, defaultHTML)\n\t\t\t\t\t);\n\t\t\t\t} else {\n\t\t\t\t\t// Use default tooltip\n\t\t\t\t\ttooltipTextContainer.html(defaultHTML);\n\t\t\t\t}\n\n\t\t\t\t// Position the tooltip\n\t\t\t\tthis.positionTooltip();\n\t\t\t} else if (e.detail.type === TooltipTypes.TITLE) {\n\t\t\t\tconst chart = DOMUtils.appendOrSelect(\n\t\t\t\t\tholder,\n\t\t\t\t\t`svg.${settings.prefix}--${chartprefix}--chart-svg`\n\t\t\t\t);\n\t\t\t\tconst chartWidth =\n\t\t\t\t\tDOMUtils.getSVGElementSize(chart).width *\n\t\t\t\t\tTools.getProperty(\n\t\t\t\t\t\tthis.model.getOptions(),\n\t\t\t\t\t\t\"tooltip\",\n\t\t\t\t\t\t\"title\",\n\t\t\t\t\t\t\"width\"\n\t\t\t\t\t);\n\n\t\t\t\tthis.tooltip.style(\"max-width\", chartWidth);\n\n\t\t\t\ttooltipTextContainer.html(\n\t\t\t\t\tthis.getTooltipHTML(\n\t\t\t\t\t\te.detail.hoveredElement,\n\t\t\t\t\t\tTooltipTypes.TITLE\n\t\t\t\t\t)\n\t\t\t\t);\n\n\t\t\t\t// get the position based on the title positioning (static)\n\t\t\t\tconst position = this.getTooltipPosition(\n\t\t\t\t\te.detail.hoveredElement.node()\n\t\t\t\t);\n\t\t\t\tthis.positionTooltip(position);\n\t\t\t}\n\n\t\t\t// Fade in\n\t\t\tthis.tooltip.classed(\"hidden\", false);\n\t\t});\n\n\t\t// listen to hide-tooltip Custom Events to hide the tooltip\n\t\tthis.services.events.addEventListener(Events.Tooltip.HIDE, () => {\n\t\t\tthis.tooltip.classed(\"hidden\", true);\n\t\t});\n\t}\n\n\tgetTooltipHTML(data: any, type: TooltipTypes) {\n\t\t// check if it is getting styles for a tooltip type\n\t\tif (type === TooltipTypes.TITLE) {\n\t\t\tconst title = this.model.getOptions().title;\n\t\t\treturn `<div class=\"title-tooltip\"><text>${title}</text></div>`;\n\t\t}\n\t\t// this cleans up the data item, pie slices have the data within the data.data but other datapoints are self contained within data\n\t\tconst dataVal = Tools.getProperty(data, \"data\") ? data.data : data;\n\t\tconst { groupMapsTo } = this.model.getOptions().data;\n\t\tconst rangeIdentifier = this.services.cartesianScales.getRangeIdentifier();\n\n\t\t// format the value if needed\n\t\tconst formattedValue = Tools.getProperty(\n\t\t\tthis.model.getOptions(),\n\t\t\t\"tooltip\",\n\t\t\t\"valueFormatter\"\n\t\t)\n\t\t\t? this.model\n\t\t\t\t\t.getOptions()\n\t\t\t\t\t.tooltip.valueFormatter(dataVal[rangeIdentifier])\n\t\t\t: dataVal[rangeIdentifier].toLocaleString(\"en\");\n\n\t\t// pie charts don't have a dataset label since they only support one dataset\n\t\tconst label = dataVal[groupMapsTo];\n\n\t\treturn `<div class=\"datapoint-tooltip\">\n\t\t\t\t\t<p class=\"label\">${label}</p>\n\t\t\t\t\t<p class=\"value\">${formattedValue}</p>\n\t\t\t\t</div>`;\n\t}\n\n\tgetMultilineTooltipHTML(data: any) {\n\t\t// sort them so they are in the same order as the graph\n\t\tdata.sort((a, b) => b.value - a.value);\n\n\t\t// tells us which value to use\n\t\tconst scaleType = this.services.cartesianScales.getDomainScale()\n\t\t\t.scaleType;\n\n\t\treturn (\n\t\t\t\"<ul class='multi-tooltip'>\" +\n\t\t\tdata\n\t\t\t\t.map(datum => {\n\t\t\t\t\tconst { groupMapsTo } = this.model.getOptions().data;\n\t\t\t\t\tconst rangeIdentifier = this.services.cartesianScales.getRangeIdentifier();\n\n\t\t\t\t\tconst userProvidedValueFormatter = Tools.getProperty(\n\t\t\t\t\t\tthis.model.getOptions(),\n\t\t\t\t\t\t\"tooltip\",\n\t\t\t\t\t\t\"valueFormatter\"\n\t\t\t\t\t);\n\t\t\t\t\tconst formattedValue = userProvidedValueFormatter\n\t\t\t\t\t\t? userProvidedValueFormatter(datum[rangeIdentifier])\n\t\t\t\t\t\t: datum[rangeIdentifier].toLocaleString(\"en\");\n\n\t\t\t\t\t// For the tooltip color, we always want the normal stroke color, not dynamically determined by data value.\n\t\t\t\t\tconst indicatorColor = this.model.getStrokeColor(\n\t\t\t\t\t\tdatum[groupMapsTo]\n\t\t\t\t\t);\n\n\t\t\t\t\treturn `\n\t\t\t\t<li>\n\t\t\t\t\t<div class=\"datapoint-tooltip\">\n\t\t\t\t\t\t<a style=\"background-color:${indicatorColor}\" class=\"tooltip-color\"></a>\n\t\t\t\t\t\t<p class=\"label\">${datum[groupMapsTo]}</p>\n\t\t\t\t\t\t<p class=\"value\">${formattedValue}</p>\n\t\t\t\t\t</div>\n\t\t\t\t</li>`;\n\t\t\t\t})\n\t\t\t\t.join(\"\") +\n\t\t\t\"</ul>\"\n\t\t);\n\t}\n\n\trender() {\n\t\tthis.tooltip.classed(\"hidden\", true);\n\t}\n\n\t// returns static position based on the element\n\tgetTooltipPosition(hoveredElement) {\n\t\tconst holderPosition = select(this.services.domUtils.getHolder())\n\t\t\t.node()\n\t\t\t.getBoundingClientRect();\n\t\tconst elementPosition = hoveredElement.getBoundingClientRect();\n\n\t\t// get the vertical offset\n\t\tconst { verticalOffset } = this.model.getOptions().tooltip.title;\n\n\t\tconst tooltipPos = {\n\t\t\tleft:\n\t\t\t\telementPosition.left -\n\t\t\t\tholderPosition.left +\n\t\t\t\telementPosition.width / 2,\n\t\t\ttop: elementPosition.top - holderPosition.top - verticalOffset\n\t\t};\n\n\t\treturn { placement: TooltipPosition.BOTTOM, position: tooltipPos };\n\t}\n\n\tpositionTooltip(positionOverride?: any) {\n\t\tconst holder = this.services.domUtils.getHolder();\n\t\tconst target = this.tooltip.node();\n\t\tconst mouseRelativePos = mouse(holder);\n\t\tlet pos;\n\n\t\t// override position to place tooltip at {placement:.., position:{top:.. , left:..}}\n\t\tif (positionOverride) {\n\t\t\t// placement determines whether the tooltip is centered above or below the position provided\n\t\t\tconst placement =\n\t\t\t\tpositionOverride.placement === TooltipPosition.TOP\n\t\t\t\t\t? PLACEMENTS.TOP\n\t\t\t\t\t: PLACEMENTS.BOTTOM;\n\n\t\t\tpos = this.positionService.findPositionAt(\n\t\t\t\tpositionOverride.position,\n\t\t\t\ttarget,\n\t\t\t\tplacement\n\t\t\t);\n\t\t} else {\n\t\t\t// Find out whether tooltip should be shown on the left or right side\n\t\t\tconst bestPlacementOption = this.positionService.findBestPlacementAt(\n\t\t\t\t{\n\t\t\t\t\tleft: mouseRelativePos[0],\n\t\t\t\t\ttop: mouseRelativePos[1]\n\t\t\t\t},\n\t\t\t\ttarget,\n\t\t\t\t[\n\t\t\t\t\tPLACEMENTS.RIGHT,\n\t\t\t\t\tPLACEMENTS.LEFT,\n\t\t\t\t\tPLACEMENTS.TOP,\n\t\t\t\t\tPLACEMENTS.BOTTOM\n\t\t\t\t],\n\t\t\t\t() => ({\n\t\t\t\t\twidth: holder.offsetWidth,\n\t\t\t\t\theight: holder.offsetHeight\n\t\t\t\t})\n\t\t\t);\n\n\t\t\tlet {\n\t\t\t\thorizontalOffset\n\t\t\t} = this.model.getOptions().tooltip.datapoint;\n\t\t\tif (bestPlacementOption === PLACEMENTS.LEFT) {\n\t\t\t\thorizontalOffset *= -1;\n\t\t\t}\n\n\t\t\t// Get coordinates to where tooltip should be positioned\n\t\t\tpos = this.positionService.findPositionAt(\n\t\t\t\t{\n\t\t\t\t\tleft: mouseRelativePos[0] + horizontalOffset,\n\t\t\t\t\ttop: mouseRelativePos[1]\n\t\t\t\t},\n\t\t\t\ttarget,\n\t\t\t\tbestPlacementOption\n\t\t\t);\n\t\t}\n\n\t\tthis.positionService.setElement(target, pos);\n\t}\n}\n"]}