axidio-styleguide-library1-v2 0.0.805 → 0.0.806

package/fesm2022/axidio-styleguide-library1-v2.mjs

@@ -8150,8 +8150,11 @@ class HorizontalBarsWithScrollZoomComponent extends ComponentUniqueId {
                 .style('stroke-width', '1px');
         }
         styleAxisDomain();
+        // Always render y-axis label after axis/grid so it is visible
         if (metaData.yLabel) {
+            // Remove any previous y-axis label to avoid duplicates
             svgYAxisLeft.selectAll('.lib-axis-group-label, .lib-ylabel-drilldowncharts, .lib-ylabel-weeklyCharts').remove();
+            // Helper to check if label is an acronym (all uppercase or <=4 chars and all letters)
             function isAcronym(label) {
                 return (label.length <= 4 && /^[A-Z]+$/.test(label)) || (label === label.toUpperCase() && /[A-Z]/.test(label));
             }
@@ -8237,28 +8240,9 @@ class HorizontalBarsWithScrollZoomComponent extends ComponentUniqueId {
                 .text(metaData.lineyLabel);
         }
         if (metaData.xLabel) {
-            function isAcronym(label) {
-                return (label.length <= 4 && /^[A-Z]+$/.test(label)) || (label === label.toUpperCase() && /[A-Z]/.test(label));
-            }
-            const xLabelText = metaData.xLabel;
-            const isAcr = isAcronym(xLabelText.replace(/[^A-Za-z]/g, ''));
             svg
                 .append('text')
-                .attr('class', function () {
-                let baseClass = 'lib-axis-group-label';
-                if (self.chartConfiguration.isDrilldownChart)
-                    return baseClass + ' lib-xlabel-drilldowncharts';
-                if (self.chartConfiguration.isMultiChartGridLine != undefined)
-                    return baseClass + ' lib-xlabel-weeklyCharts';
-                return baseClass + ' lib-axis-waterfall-label font-size-1';
-            })
-                .attr('style', self.chartConfiguration.xAxisCustomlabelStyles)
-                .attr('transform', 'translate(' + width / 2 + ' ,' + (height + margin.top + 40) + ')')
-                .style('text-anchor', 'middle')
-                .style('fill', 'var(--chart-text-color)')
-                .style('color', 'var(--chart-text-color)')
-                .text(isAcr ? xLabelText.toUpperCase() : xLabelText.toLowerCase())
-                .style('text-transform', isAcr ? 'none' : 'capitalize');
+                .attr('class', 'lib-axis-waterfall-label');
         }
         if (lineData && colors) {
             var dataGroup = d3
@@ -9042,9 +9026,13 @@ class HorizontalGroupedBarWithScrollZoomComponent extends ComponentUniqueId {
                         }
                     }
                 });
-                return tempScale.bandwidth();
+                return self.isZoomedOut
+                    ? tempScale.bandwidth() * 0.5
+                    : tempScale.bandwidth();
             }
-            return xSubgroup.bandwidth();
+            return self.isZoomedOut
+                ? xSubgroup.bandwidth() * 0.5
+                : xSubgroup.bandwidth();
         })
             .attr('height', function (d) {
             if (d.value == -1) {
@@ -9323,7 +9311,7 @@ class HorizontalGroupedBarWithScrollZoomComponent extends ComponentUniqueId {
                 .on('mouseout', function (d) {
                 state.selectAll('.barstext').remove();
             })
-                .on('mouseover', (d1) => {
+                .on('mouseover', function (d1) {
                 state
                     .selectAll('text')
                     .data(function (d) {
@@ -9353,10 +9341,9 @@ class HorizontalGroupedBarWithScrollZoomComponent extends ComponentUniqueId {
                     .style('fill', function (d) {
                     return metaData.colors[d.key];
                 })
-                    // .attr('width', xSubgroup.bandwidth())
-                    // .attr('width', this.isZoomedOut ? xSubgroup.bandwidth() : xSubgroup.bandwidth() * 0.6)
-                    .attr('x', (d) => xSubgroup(d.key) +
-                    (this.isZoomedOut ? 0 : (xSubgroup.bandwidth() * 0.4) / 2))
+                    .attr('width', self.isZoomedOut
+                    ? xSubgroup.bandwidth()
+                    : xSubgroup.bandwidth() * 0.8)
                     .text(function (d) {
                     return d.value;
                 });
@@ -9588,30 +9575,6 @@ class HorizontalGroupedBarWithScrollZoomComponent extends ComponentUniqueId {
                 .style('font-size', 'smaller')
                 .text(metaData.lineyLabel);
         }
-        if (metaData.xLabel) {
-            function isAcronym(label) {
-                return (label.length <= 4 && /^[A-Z]+$/.test(label)) || (label === label.toUpperCase() && /[A-Z]/.test(label));
-            }
-            const xLabelText = metaData.xLabel;
-            const isAcr = isAcronym(xLabelText.replace(/[^A-Za-z]/g, ''));
-            svg
-                .append('text')
-                .attr('class', function () {
-                let baseClass = 'lib-axis-group-label';
-                if (self.chartConfiguration.isDrilldownChart)
-                    return baseClass + ' lib-xlabel-drilldowncharts';
-                if (self.chartConfiguration.isMultiChartGridLine != undefined)
-                    return baseClass + ' lib-xlabel-weeklyCharts';
-                return baseClass + ' lib-axis-waterfall-label font-size-1';
-            })
-                .attr('style', self.chartConfiguration.xAxisCustomlabelStyles)
-                .attr('transform', 'translate(' + width / 2 + ' ,' + (height + margin.top + 40) + ')')
-                .style('text-anchor', 'middle')
-                .style('fill', 'var(--chart-text-color)')
-                .style('color', 'var(--chart-text-color)')
-                .text(isAcr ? xLabelText.toUpperCase() : xLabelText.toLowerCase())
-                .style('text-transform', isAcr ? 'none' : 'capitalize');
-        }
         if (lineData) {
             svg
                 .append('path')