@carbon/charts-vue 1.6.0 → 1.6.2

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.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
+
+
+
+
+
 # [1.6.0](https://github.com/carbon-design-system/carbon-charts/compare/v1.5.8...v1.6.0) (2022-09-27)
 
 **Note:** Version bump only for package @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,
@@ -36589,27 +36600,6 @@ var hover_axis_HoverAxis = /** @class */ (function (_super) {
                 .attr('width', width + configuration_non_customizable_axis.hover.rectanglePadding * 2)
                 .attr('height', height)
                 .lower();
-            // Add keyboard event listeners to each group element
-            g.on('keydown', function (event) {
-                // Choose specific arrow key depending on the axis
-                if (axisPosition === AxisPositions.LEFT ||
-                    axisPosition === AxisPositions.RIGHT) {
-                    if (event.key && event.key === 'ArrowUp') {
-                        self.goNext(this, event);
-                    }
-                    else if (event.key && event.key === 'ArrowDown') {
-                        self.goPrevious(this, event);
-                    }
-                }
-                else {
-                    if (event.key && event.key === 'ArrowLeft') {
-                        self.goPrevious(this, event);
-                    }
-                    else if (event.key && event.key === 'ArrowRight') {
-                        self.goNext(this, event);
-                    }
-                }
-            });
         });
         // Add event listeners to element group
         this.addEventListeners();
@@ -36698,6 +36688,35 @@ var hover_axis_HoverAxis = /** @class */ (function (_super) {
                 element: src_select(this),
                 datum: src_select(this).select('text').datum(),
             });
+        })
+            .on('keydown', function (event) {
+            // Hide the tooltip when `Escape` is pressed, but keep focus
+            if (event.key && event.key === 'Escape') {
+                self.services.events.dispatchEvent(Events.Tooltip.HIDE);
+                self.services.events.dispatchEvent(Events.Axis.LABEL_BLUR, {
+                    event: event,
+                    element: src_select(this),
+                    datum: src_select(this).select('text').datum(),
+                });
+            }
+            // Choose specific arrow key depending on the axis
+            if (axisPosition === AxisPositions.LEFT ||
+                axisPosition === AxisPositions.RIGHT) {
+                if (event.key && event.key === 'ArrowUp') {
+                    self.goNext(this, event);
+                }
+                else if (event.key && event.key === 'ArrowDown') {
+                    self.goPrevious(this, event);
+                }
+            }
+            else {
+                if (event.key && event.key === 'ArrowLeft') {
+                    self.goPrevious(this, event);
+                }
+                else if (event.key && event.key === 'ArrowRight') {
+                    self.goNext(this, event);
+                }
+            }
         });
     };
     // Focus on the next HTML element sibling