@carbon/charts-vue 1.6.1 → 1.6.3

package/CHANGELOG.md

@@ -3,6 +3,22 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [1.6.3](https://github.com/carbon-design-system/carbon-charts/compare/v1.6.2...v1.6.3) (2022-12-23)
+
+**Note:** Version bump only for package @carbon/charts-vue
+
+
+
+
+
+## [1.6.2](https://github.com/carbon-design-system/carbon-charts/compare/v1.6.1...v1.6.2) (2022-12-06)
+
+**Note:** Version bump only for package @carbon/charts-vue
+
+
+
+
+
 ## [1.6.1](https://github.com/carbon-design-system/carbon-charts/compare/v1.6.0...v1.6.1) (2022-10-20)
 
 **Note:** Version bump only for package @carbon/charts-vue

package/README.md

@@ -1,6 +1,6 @@
 # Notice
 
-### This version is in beta & relies on **Carbon v11**. If you're using Carbon v10, [see the legacy demo site](https://carbon-charts-0x.netlify.app)
+### This version relies on **Carbon v11**. If you're using Carbon v10, [see the legacy demo site](https://carbon-charts-0x.netlify.app)
 
 ## `@carbon/charts-vue`
 

package/charts-vue.common.js

@@ -20756,7 +20756,6 @@ var legend_Legend = /** @class */ (function (_super) {
         var truncationThreshold = tools_Tools.getProperty(truncationOptions, 'threshold');
         var truncationNumCharacter = tools_Tools.getProperty(truncationOptions, 'numCharacter');
         var addedLegendItemsText = svg.selectAll('div.legend-item p');
-        var self = this;
         // Add an ID for the checkbox to use through `aria-labelledby`
         addedLegendItemsText.attr('id', function (d, i) {
             var elementToReference = this.parentNode.querySelector('div.checkbox') ||
@@ -20783,7 +20782,7 @@ var legend_Legend = /** @class */ (function (_super) {
         var svg = this.getComponentContainer();
         var options = this.getOptions();
         var legendOptions = tools_Tools.getProperty(options, 'legend');
-        var truncationThreshold = tools_Tools.getProperty(legendOptions, 'truncation', 'threshold');
+        var truncation = tools_Tools.getProperty(legendOptions, 'truncation');
         svg.selectAll('div.legend-item')
             .on('mouseover', function (event) {
             self.services.events.dispatchEvent(Events.Legend.ITEM_HOVER, {
@@ -20791,8 +20790,10 @@ var legend_Legend = /** @class */ (function (_super) {
             });
             var hoveredItem = src_select(this);
             hoveredItem.select('div.checkbox').classed('hovered', true);
+            // Show tooltip if character length is greater than threshold & there is no truncation
             var hoveredItemData = hoveredItem.datum();
-            if (hoveredItemData.name.length > truncationThreshold) {
+            if (hoveredItemData.name.length > truncation.threshold &&
+                truncation.type !== TruncationTypes.NONE) {
                 self.services.events.dispatchEvent(Events.Tooltip.SHOW, {
                     event: event,
                     hoveredElement: hoveredItem,
@@ -20801,9 +20802,14 @@ var legend_Legend = /** @class */ (function (_super) {
             }
         })
             .on('mousemove', function (event) {
-            self.services.events.dispatchEvent(Events.Tooltip.MOVE, {
-                event: event,
-            });
+            // Emit tooltip move event only if tooltip is shown
+            var hoveredItemData = src_select(this).datum();
+            if (hoveredItemData.name.length > truncation.threshold &&
+                truncation.type !== TruncationTypes.NONE) {
+                self.services.events.dispatchEvent(Events.Tooltip.MOVE, {
+                    event: event,
+                });
+            }
         })
             .on('click', function () {
             self.services.events.dispatchEvent(Events.Legend.ITEM_CLICK, {
@@ -20816,7 +20822,12 @@ var legend_Legend = /** @class */ (function (_super) {
             .on('mouseout', function () {
             var hoveredItem = src_select(this);
             hoveredItem.select('div.checkbox').classed('hovered', false);
-            self.services.events.dispatchEvent(Events.Tooltip.HIDE);
+            // Emit tooltip hide event only if tooltip is shown
+            var hoveredItemData = hoveredItem.datum();
+            if (hoveredItemData.name.length > truncation.threshold &&
+                truncation.type !== TruncationTypes.NONE) {
+                self.services.events.dispatchEvent(Events.Tooltip.HIDE);
+            }
             self.services.events.dispatchEvent(Events.Legend.ITEM_MOUSEOUT, {
                 hoveredElement: hoveredItem,
             });
@@ -20844,7 +20855,7 @@ var legend_Legend = /** @class */ (function (_super) {
         svg.selectAll('g.additional-item').on('mouseover', function (event) {
             var hoveredItem = src_select(this);
             var hoveredItemData = hoveredItem.datum();
-            if (hoveredItemData.name.length > truncationThreshold) {
+            if (hoveredItemData.name.length > truncation.threshold) {
                 self.services.events.dispatchEvent(Events.Tooltip.SHOW, {
                     event: event,
                     hoveredElement: hoveredItem,
@@ -24241,7 +24252,8 @@ var tooltip_Tooltip = /** @class */ (function (_super) {
         }
         try {
             // it's a correct ISO format Date string
-            if (typeof value === 'string' && (/\d{4}-\d{2}-\d{2}T\d{2}:\d{2}:\d{2}.\d{3}Z/.test(value))) {
+            if (typeof value === 'string' &&
+                /\d{4}-\d{2}-\d{2}T\d{2}:\d{2}:\d{2}.\d{3}Z/.test(value)) {
                 return format_format(Date.parse(value), 'MMM d, yyyy');
             }
         }
@@ -35279,7 +35291,7 @@ var alluvial_Alluvial = /** @class */ (function (_super) {
         links.forEach(function (element) { return _this.traverse(direction, element, visited); });
     };
     Alluvial.prototype.getRightArrowIcon = function () {
-        return "\n\t\t<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"32\" height=\"32\" viewBox=\"0 0 32 32\">\n\t\t\t<polygon points=\"18 6 16.57 7.393 24.15 15 4 15 4 17 24.15 17 16.57 24.573 18 26 28 16 18 6\"/>\n\t\t\t<rect  data-name=\"&lt;Transparent Rectangle&gt;\" style=\"fill: none;\" width=\"32\" height=\"32\"/>\n\t\t</svg>";
+        return "\n\t\t<svg xmlns=\"http://www.w3.org/2000/svg\" class=\"arrow-right\" width=\"32\" height=\"32\" viewBox=\"0 0 32 32\">\n\t\t\t<polygon points=\"18 6 16.57 7.393 24.15 15 4 15 4 17 24.15 17 16.57 24.573 18 26 28 16 18 6\"/>\n\t\t\t<rect width=\"32\" height=\"32\"/>\n\t\t</svg>";
     };
     // Remove event listeners
     Alluvial.prototype.destroy = function () {
@@ -39754,11 +39766,18 @@ var toolbar_Toolbar = /** @class */ (function (_super) {
                 .classed('disabled', function (d) { return d.shouldBeDisabled(); })
                 .attr('aria-disabled', function (d) { return d.shouldBeDisabled(); })
                 .attr('aria-label', function (d) { return d.title; })
-                .html(function (d) { return "\n\t\t\t<button\n\t\t\t\tclass=\"cds--overflow-menu__trigger cds--overflow-menu__trigger\"\n\t\t\t\taria-haspopup=\"true\" aria-expanded=\"false\" id=\"" + _this.services.domUtils.generateElementIDString("control-" + d.id) + "\" aria-label=\"" + d.title + "\">\n\t\t\t\t<svg focusable=\"false\" preserveAspectRatio=\"xMidYMid meet\" style=\"will-change: transform; width: " + (d.iconSVG.width !== undefined ? d.iconSVG.width : '20px') + "; height: " + (d.iconSVG.height !== undefined
-                ? d.iconSVG.height
-                : '20px') + "\" xmlns=\"http://www.w3.org/2000/svg\" class=\"cds--overflow-menu__icon cds--overflow-menu__icon\" viewBox=\"0 0 32 32\" aria-hidden=\"true\">\n\t\t\t\t\t" + d.iconSVG.content + "\n\t\t\t\t</svg>\n\t\t\t</button>"; })
+                .html(function (d) { return "\n\t\t\t<button\n\t\t\t\tclass=\"cds--overflow-menu__trigger cds--overflow-menu__trigger\"\n\t\t\t\taria-haspopup=\"true\" aria-expanded=\"false\" id=\"" + _this.services.domUtils.generateElementIDString("control-" + d.id) + "\" aria-label=\"" + d.title + "\">\n\t\t\t\t<svg focusable=\"false\" preserveAspectRatio=\"xMidYMid meet\" xmlns=\"http://www.w3.org/2000/svg\" class=\"cds--overflow-menu__icon cds--overflow-menu__icon\" viewBox=\"0 0 32 32\" aria-hidden=\"true\">\n\t\t\t\t\t" + d.iconSVG.content + "\n\t\t\t\t</svg>\n\t\t\t</button>"; })
                 .each(function (d, index) {
                 var _this = this;
+                src_select(this)
+                    .select('svg')
+                    .style('will-change', 'transform')
+                    .style('width', d.iconSVG.width !== undefined
+                    ? d.iconSVG.width
+                    : '20px')
+                    .style('height', d.iconSVG.height !== undefined
+                    ? d.iconSVG.height
+                    : '20px');
                 src_select(this)
                     .select('button')
                     .on('click', function (event) {