axidio-styleguide-library1-v2 0.2.88 → 0.2.90

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

@@ -7858,7 +7858,7 @@ class HorizontalGroupedBarWithScrollZoomComponent extends ComponentUniqueId {
                 .style('text-anchor', 'middle');
         }
         // Mobile/tablet override - check for single-group date charts first
-        if (isMobile || isTablet) {
+        if (isMobile) {
             const textNodes = svg.selectAll('g.x1.axis1 g.tick text');
             const groupsCount = data.length || 0;
             // Check if we have dates in x-axis and single group
@@ -7886,15 +7886,6 @@ class HorizontalGroupedBarWithScrollZoomComponent extends ComponentUniqueId {
                 // Default mobile behavior for non-date or multi-group
                 textNodes.classed('mobile-xaxis-override', true);
             }
-            // If there are many groups on mobile/tablet AND this is a grouped chart,
-            // rotate labels to sideways to avoid overlapping and make them readable.
-            // Do NOT rotate for single-bar charts on tablet/mobile.
-            if (groupsCount > 3 && subgroups && subgroups.length < 3) {
-                svg.selectAll('g.x1.axis1 g.tick text')
-                    .style('writing-mode', 'sideways-lr')
-                    .style('text-anchor', 'middle')
-                    .attr('y', 0);
-            }
         }
     }
     applyXLabelsOnSameLine(svg, subgroups, data, metaData, self, shortTickLengthBg, isMobile, isria) {
@@ -7962,6 +7953,19 @@ class HorizontalGroupedBarWithScrollZoomComponent extends ComponentUniqueId {
         // Check if we're on mobile or tablet
         const isSmallScreen = window.innerWidth < 992; // Less than 992px (mobile or tablet)
         // Check if label contains both date and week information
+        const formatDatePart = (dateStr) => {
+            // Match different date formats: MM/DD/YYYY, YYYY/MM/DD, etc.
+            const match = dateStr.match(/(\d{1,4})[-\/](\d{1,2})[-\/](\d{1,4})/);
+            if (!match)
+                return dateStr;
+            const [_, part1, part2, part3] = match;
+            // Check if year is first (YYYY/MM/DD)
+            if (part1.length === 4) {
+                return `${part2}/${part3}`; // Return MM/DD
+            }
+            // For MM/DD/YYYY format
+            return `${part1}/${part2}`; // Return MM/DD
+        };
         const hasDateAndTime = (text) => {
             const dateMatch = /\d{2,4}[-\/]\d{1,2}[-\/]\d{1,4}/.test(text) || !isNaN(Date.parse(text));
             const weekMatch = /week|wk|w\d+/i.test(text);
@@ -7971,7 +7975,10 @@ class HorizontalGroupedBarWithScrollZoomComponent extends ComponentUniqueId {
         // Apply date-week trimming only for mobile and tablet screens
         if (isSmallScreen && labelInfo.isDate && labelInfo.isWeek) {
             const datePart = d.match(/\d{2,4}[-\/]\d{1,2}[-\/]\d{1,4}/);
-            return datePart ? datePart[0] : d;
+            if (datePart) {
+                return formatDatePart(datePart[0]);
+            }
+            return d;
         }
         // Mobile handling: keep date labels intact for single-series charts (do not trim)
         if (isMobile) {