axidio-styleguide-library1-v2 0.0.925 → 0.0.926

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

@@ -8728,25 +8728,13 @@ class HorizontalGroupedBarWithScrollZoomComponent extends ComponentUniqueId {
                 .call(d3.axisBottom(x))
                 .call((g) => g.select('.domain').remove());
             svg.selectAll('g.x1.axis1 g.tick line').remove();
-            // Move x-axis date label down only for grouped bar chart
-            if (subgroups.length > 1 // grouped bar chart
-            ) {
+            // Only move x-axis labels further down for grouped charts if there is no xLabel
+            if (subgroups.length > 1 && !metaData.xLabel) {
                 svg
                     .selectAll('g.x1.axis1 g.tick text')
-                    .each(function (d) {
-                    // Check if label is a date (e.g., 08/04/25 or 2025-08-04)
-                    if (/\d{2,4}[-\/]\d{2}[-\/]\d{2,4}/.test(d) || /\d{2,4}[-\/]\d{2,4}/.test(d)) {
-                        d3.select(this)
-                            .attr('class', 'lib-xaxis-labels-texts-drilldown')
-                            .style('fill', 'var(--chart-text-color)')
-                            .attr('y', 32); // Move date label down
-                    }
-                    else {
-                        d3.select(this)
-                            .attr('class', 'lib-xaxis-labels-texts-drilldown')
-                            .style('fill', 'var(--chart-text-color)');
-                    }
-                });
+                    .attr('class', 'lib-xaxis-labels-texts-drilldown')
+                    .style('fill', 'var(--chart-text-color)')
+                    .attr('y', 32); // Increase distance from bars (default is ~9)
             }
             else {
                 svg
@@ -8818,9 +8806,15 @@ class HorizontalGroupedBarWithScrollZoomComponent extends ComponentUniqueId {
                 .selectAll('g.x1.axis1 g.tick text')
                 .attr('class', 'lib-xaxis-labels-texts-drilldown')
                 .style('font-size', this.isHeaderVisible ? '18px' : '14px')
-                .attr('y', this.isHeaderVisible
-                ? short_tick_length_bg + 25
-                : short_tick_length_bg)
+                .attr('y', function (d) {
+                // If grouped chart, no xLabel, and label is a date, add +25
+                if (subgroups.length > 1 &&
+                    !metaData.xLabel &&
+                    (/\d{2,4}[-\/]\d{2}[-\/]\d{2,4}/.test(d) || /\d{2,4}[-\/]\d{2,4}/.test(d))) {
+                    return (self.isHeaderVisible ? short_tick_length_bg + 25 : short_tick_length_bg) + 25;
+                }
+                return self.isHeaderVisible ? short_tick_length_bg + 25 : short_tick_length_bg;
+            })
                 .attr('x', function (d) {
                 if (self.chartData.data.length > 8 && !self.isZoomedOut) {
                     return -25; // Move first line text slightly to the left too