axidio-styleguide-library1-v2 0.2.26 → 0.2.27

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

@@ -8218,6 +8218,9 @@ class HorizontalGroupedBarWithScrollZoomComponent extends ComponentUniqueId {
         data = this.chartData.data;
         metaData = this.chartData.metaData;
         lineData = this.chartData.lineData;
+        // if (lineData || this.chartData.targetLineData) {
+        //   rightSvgWidth = 60;
+        // }
         if (!metaData.colorAboveTarget) {
             metaData['colorAboveTarget'] = metaData.colors;
         }
@@ -8227,15 +8230,30 @@ class HorizontalGroupedBarWithScrollZoomComponent extends ComponentUniqueId {
         var verticalstackedcontainer = d3.select(this.groupcontainerElt.nativeElement);
         var margin = this.chartConfiguration.margin;
         const { width, height } = this.calculateChartDimensions(chartContainer, verticalstackedcontainer, margin, self);
+        /**
+         * for hiding header
+         * used by weekly charts
+         */
         if (this.chartConfiguration.isHeaderVisible != undefined)
             this.isHeaderVisible = this.chartConfiguration.isHeaderVisible;
+        /**
+         * for hiding legends
+         * used by weekly charts
+         */
         if (this.chartConfiguration.legendVisible != undefined) {
             this.legendVisible = this.chartConfiguration.legendVisible;
         }
+        /**
+         * for removing background color so that it can take parents color
+         *
+         */
         if (this.chartConfiguration.isTransparentBackground != undefined) {
             this.isTransparentBackground =
                 this.chartConfiguration.isTransparentBackground;
         }
+        /**
+         * format data values based on configuration received
+         */
         if (this.chartConfiguration.textFormatter != undefined) {
             formatFromBackend = ChartHelper.dataValueFormatter(this.chartConfiguration.textFormatter);
             formatForHugeNumbers = ChartHelper.dataValueFormatter('.2s');
@@ -8247,6 +8265,9 @@ class HorizontalGroupedBarWithScrollZoomComponent extends ComponentUniqueId {
             return d.name;
         })
             .keys();
+        /**
+         * x axis range made similar to line chart or vertical stack so that all the charts will get aligned with each other.
+         */
         if (this.chartConfiguration.isMultiChartGridLine != undefined) {
             x = d3
                 .scaleBand()
@@ -8264,16 +8285,266 @@ class HorizontalGroupedBarWithScrollZoomComponent extends ComponentUniqueId {
                 .range([leftAndRightSpaces, width - rightSvgWidth - leftAndRightSpaces])
                 .padding([0.3]);
         }
+        // x.bandwidth(96);
         var xScaleFromOrigin = d3
             .scaleBand()
             .domain(groups)
             .range([0, width - rightSvgWidth]);
-        this.renderXAxis(svg, x, height, subgroups, metaData, this.chartConfiguration, alternate_text, short_tick_length_bg, long_tick_length_bg, this);
-        this.renderXAxisLabels(svg, data, subgroups, metaData, this.chartConfiguration, short_tick_length_bg, long_tick_length_bg, isMobile, isria, this);
+        // .padding([0.2]);
+        if (this.chartConfiguration.isMultiChartGridLine == undefined) {
+            /**
+             * normal ticks for all dashboard charts
+             */
+            svg
+                .append('g')
+                .attr('class', 'x1 axis1')
+                .attr('transform', 'translate(0,' + height + ')')
+                .call(d3.axisBottom(x))
+                .call((g) => g.select('.domain').remove());
+            svg.selectAll('g.x1.axis1 g.tick line').remove();
+            // 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')
+                    .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
+                    .selectAll('g.x1.axis1 g.tick text')
+                    .attr('class', 'lib-xaxis-labels-texts-drilldown')
+                    .style('fill', 'var(--chart-text-color)');
+            }
+        }
+        else {
+            /**
+             * bigger ticks for weekly charts and more space from x axis to labels
+             */
+            /**
+             * draw x axis
+             */
+            svg
+                .append('g')
+                .attr('class', 'x1 axis1')
+                .attr('transform', 'translate(0,' + height + ')')
+                .call(d3.axisBottom(x).tickSize(0))
+                .call((g) => g.select('.domain').attr('fill', 'none'));
+            /**
+             * tick line size in alternate fashion
+             */
+            svg.selectAll('g.x1.axis1 g.tick line').attr('y2', function () {
+                if (alternate_text &&
+                    self.chartConfiguration.isNoAlternateXaxisText == undefined) {
+                    alternate_text = false;
+                    return long_tick_length_bg - 7;
+                }
+                else {
+                    alternate_text = true;
+                    return short_tick_length_bg - 4;
+                }
+            });
+            /**
+             * reset the flag so that values can be shown in same alternate fashion
+             */
+            alternate_text = false;
+            /**
+             * print x-axis label texts
+             * used by weekly charts
+             */
+            svg
+                .selectAll('g.x1.axis1 g.tick text')
+                .attr('class', 'lib-xaxis-labels-texts-weeklycharts')
+                .attr('y', function () {
+                // Minimize gap in maximized (fullscreen) view for weekly charts
+                if (self.chartConfiguration.isFullScreen) {
+                    return short_tick_length_bg;
+                }
+                if (alternate_text) {
+                    alternate_text = false;
+                    return long_tick_length_bg;
+                }
+                else {
+                    alternate_text = true;
+                    return short_tick_length_bg;
+                }
+            });
+        }
+        if (self.chartConfiguration.xLabelsOnSameLine) {
+            const xAxisLabels = svg
+                .selectAll('g.x1.axis1 g.tick text')
+                .attr('class', 'lib-xaxis-labels-texts-drilldown')
+                .style('font-size', this.isHeaderVisible ? '18px' : '14px')
+                .attr('text-anchor', 'middle')
+                .attr('y', function (d) {
+                // For grouped bar charts with many bars and xLabel present, only add 5 if the label is a date
+                if (subgroups.length > 1 && data.length > 8 && metaData.xLabel) {
+                    const isDateLabel = /\d{2,4}[-\/]/.test(d);
+                    if (self.chartConfiguration.isFullScreen) {
+                        return isDateLabel ? short_tick_length_bg + 14 : short_tick_length_bg;
+                    }
+                    return isDateLabel ? short_tick_length_bg + 14 : short_tick_length_bg;
+                }
+                // For grouped bar charts with many bars and NO xLabel, add space as before, but reduce in fullscreen
+                if (subgroups.length > 1 && data.length > 8 && !metaData.xLabel) {
+                    const chartHasExtraBottom = (self.chartConfiguration.margin && self.chartConfiguration.margin.bottom >= 40);
+                    if (self.chartConfiguration.isFullScreen) {
+                        // Reduce extra gap in maximized view
+                        return short_tick_length_bg + 2;
+                    }
+                    return chartHasExtraBottom ? short_tick_length_bg : short_tick_length_bg + 10;
+                }
+                // Default/fallback logic for other cases
+                let baseY = self.isHeaderVisible ? short_tick_length_bg + 25 : short_tick_length_bg;
+                if (subgroups.length > 1 &&
+                    !metaData.xLabel &&
+                    (/\d{2,4}[-\/]\d{2}[-\/]\d{2,4}/.test(d) || /\d{2,4}[-\/]\d{2,4}/.test(d))) {
+                    baseY = self.isHeaderVisible ? short_tick_length_bg + 15 : short_tick_length_bg + 25;
+                }
+                if (/\d{2,4}[-\/]\d{2,4}/.test(d) && d.indexOf(' ') > -1) {
+                    baseY += 4;
+                }
+                // In maximized view, reduce baseY slightly for grouped bars
+                if (self.chartConfiguration.isFullScreen && subgroups.length > 1) {
+                    baseY = Math.max(short_tick_length_bg, baseY - 10);
+                }
+                return baseY;
+            })
+                .attr('x', function (d) {
+                if (self.chartData.data.length > 8 && !self.isZoomedOut) {
+                    return 1; // Move first line text slightly to the left in zoom-in view for better alignment
+                }
+                return 0; // Default position
+            })
+                .text(function (d) {
+                var isValueToBeIgnored = false;
+                if (isMobile && !self.isHeaderVisible) {
+                    let firstPart = d.split(/[\s\-]+/)[0];
+                    return firstPart.substring(0, 3).toLowerCase();
+                }
+                data.map((indiv) => {
+                    if (indiv.name &&
+                        indiv.name.toLowerCase() == d.trim().toLowerCase() &&
+                        indiv[metaData.keyList[0]] == -1) {
+                        isValueToBeIgnored = true;
+                    }
+                });
+                if (isValueToBeIgnored) {
+                    return '';
+                }
+                // Always add space before and after hyphen for date range labels, even when header is visible and label is single line
+                // Apply for grouped bar charts and single bar charts, header visible, single line
+                const dateRangeRegex = /(\d{2,4}[-\/]\d{2}[-\/]\d{2,4})\s*-\s*(\d{2,4}[-\/]\d{2}[-\/]\d{2,4})/;
+                if (dateRangeRegex.test(d.trim())) {
+                    return d.trim().replace(dateRangeRegex, (m, d1, d2) => `${d1} - ${d2}`);
+                }
+                // Split date and week labels into two lines in grouped bar zoom-in view (and minimized view)
+                const isDateLabel = /\d{2,4}[-\/]/.test(d);
+                const isWeekLabel = /week|wk|w\d+/i.test(d);
+                if (subgroups.length > 1 && !self.isZoomedOut && data.length > 8 && d.indexOf(' ') > -1 && (isDateLabel || isWeekLabel)) {
+                    var first = d.substring(0, d.indexOf(' '));
+                    var second = d.substring(d.indexOf(' ') + 1).trim();
+                    return first + '\n' + second;
+                }
+                // Also keep previous logic for minimized view
+                if (isDateLabel) {
+                    if (!self.isHeaderVisible && data.length > 8 && d.indexOf(' ') > -1) {
+                        var first = d.substring(0, d.indexOf(' '));
+                        var second = d.substring(d.indexOf(' ') + 1).trim();
+                        return first + '\n' + second;
+                    }
+                    else {
+                        return d;
+                    }
+                }
+                if (d.trim().indexOf(' ') > -1) {
+                    return d.trim().substring(0, d.indexOf(' ')).toLowerCase();
+                }
+                return d.toLowerCase();
+                // If label looks like a date (contains digits and - or /)
+                const isDateLabel2 = /\d{2,4}[-\/]/.test(d);
+                // Only split date/week labels if there are many grouped bars and header is not visible
+                if (isDateLabel) {
+                    if (!self.isHeaderVisible && data.length > 8 && d.indexOf(' ') > -1) {
+                        var first = d.substring(0, d.indexOf(' '));
+                        var second = d.substring(d.indexOf(' ') + 1).trim();
+                        return first + '\n' + second;
+                    }
+                    else {
+                        return d;
+                    }
+                }
+                if (d.trim().indexOf(' ') > -1) {
+                    return d.trim().substring(0, d.indexOf(' ')).toLowerCase();
+                }
+                return d.toLowerCase();
+            });
+            // Now apply writing-mode: sideways-lr for grouped charts with date labels in zoomed-out view and many bars
+            xAxisLabels.each(function (d) {
+                // Only apply writing-mode for exact date labels, not those containing 'week' or similar
+                const isDateLabel = /^(\d{2,4}[-\/])?\d{2,4}[-\/]\d{2,4}$/.test(d.trim());
+                const isWeekLabel = /week|wk|w\d+/i.test(d);
+                if (subgroups.length > 1 && self.isZoomedOut && data.length > 8 && isDateLabel && !isWeekLabel) {
+                    d3.select(this).style('writing-mode', 'sideways-lr');
+                }
+            });
+            if (!isMobile) {
+                svg
+                    .selectAll('g.x1.axis1 g.tick')
+                    .filter(function (d) {
+                    return !/\d{2,4}[-\/]/.test(d); // Only process non-date labels
+                })
+                    .append('text')
+                    .attr('class', 'lib-xaxis-labels-texts-drilldown')
+                    .attr('y', long_tick_length_bg)
+                    .attr('fill', 'var(--chart-text-color)')
+                    .attr('x', function (d) {
+                    if (self.chartData.data.length > 8 && !self.isZoomedOut) {
+                        return 1; // Move text slightly to the left
+                    }
+                    return 0; // Default position
+                })
+                    .text(function (d) {
+                    if (d.trim().indexOf(' ') > -1) {
+                        return d.trim().substring(d.indexOf(' '), d.length).toLowerCase();
+                    }
+                    return '';
+                });
+            }
+        }
+        if (isria && self.chartData.data.length > 8) {
+            svg
+                .selectAll('g.x1.axis1 g.tick text')
+                .classed('mobile-xaxis-override', true)
+                .text(function (d) {
+                return d.substring(0, 3);
+            })
+                .style('font-size', '12px')
+                .attr('y', 5)
+                .attr('x', 5)
+                .style('text-anchor', 'middle');
+        }
+        if (isMobile && !this.isHeaderVisible) {
+            svg
+                .selectAll('g.x1.axis1 g.tick text')
+                .classed('mobile-xaxis-override', true);
+        }
+        /**y scale for left y axis */
         var y = d3.scaleLinear().rangeRound([height, 0]);
         var maxValue = d3.max(data, (d) => d3.max(keyList, (key) => +d[key]));
-        maxValue = this.calculateMaxValue(maxValue);
+        if (maxValue == 0) {
+            if (this.chartData.targetLineData) {
+                maxValue = this.chartData.targetLineData.target + 20;
+            }
+            else {
+                maxValue = 100;
+            }
+        }
         if (this.chartConfiguration.customYscale) {
+            /**
+             * increase y-scale so that values wont cross or exceed out of range
+             * used in weekly charts
+             */
             maxValue = maxValue * this.chartConfiguration.customYscale;
         }
         if (this.chartData.targetLineData &&
@@ -8311,6 +8582,10 @@ class HorizontalGroupedBarWithScrollZoomComponent extends ComponentUniqueId {
                 .tickSize(0)
                 .tickFormat(self.chartConfiguration.yLineAxisLabelFomatter);
         }
+        /**
+         * show x-axis grid between labels
+         * used by weekly charts
+         */
         if (self.chartConfiguration.isXgridBetweenLabels) {
             svg
                 .append('g')
@@ -8318,7 +8593,7 @@ class HorizontalGroupedBarWithScrollZoomComponent extends ComponentUniqueId {
                 .attr('transform', 'translate(' + x.bandwidth() / 2 + ',' + height + ')')
                 .call(d3.axisBottom(x).tickSize(-height).tickFormat(''))
                 .style('stroke-dasharray', '5 5')
-                .style('color', 'var(--chart-grid-color, #999999)')
+                .style('color', 'var(--chart-grid-color, #999999)') // Use CSS variable
                 .call((g) => g.select('.domain').remove());
         }
         if (this.chartConfiguration.yAxisGrid) {
@@ -8333,7 +8608,7 @@ class HorizontalGroupedBarWithScrollZoomComponent extends ComponentUniqueId {
                 .call((g) => {
                 g.select('.domain')
                     .remove()
-                    .style('stroke', 'var(--chart-domain-color, #000000)');
+                    .style('stroke', 'var(--chart-domain-color, #000000)'); // Add CSS variable for domain
             });
         }
         else {
@@ -8344,27 +8619,36 @@ class HorizontalGroupedBarWithScrollZoomComponent extends ComponentUniqueId {
                 .style('opacity', '0.5')
                 .call((g) => {
                 g.select('.domain')
-                    .style('stroke', 'var(--chart-domain-color, #000000)')
-                    .style('stroke-width', '1px');
+                    .style('stroke', 'var(--chart-domain-color, #000000)') // Add CSS variable for domain
+                    .style('stroke-width', '1px'); // Ensure visibility
             });
         }
         var xSubgroup = d3.scaleBand().domain(subgroups);
         if (subgroups.length > 1 && !this.isZoomedOut) {
+            // For grouped bar charts in zoom-in view, use full x.bandwidth() for subgroups
             xSubgroup.range([0, x.bandwidth()]);
         }
         else if (subgroups.length === 1 && !this.isZoomedOut) {
+            // For single-bar (non-grouped) charts in zoom-in view, set bar width to 100 (increased from 80)
             xSubgroup.range([0, 100]);
         }
         else if (this.chartConfiguration.isMultiChartGridLine == undefined) {
             xSubgroup.range([0, x.bandwidth()]);
         }
         else {
+            // used to make grouped bars with lesser width as we are not using padding for width
             xSubgroup.range([0, x.bandwidth()]);
         }
+        // if (this.chartConfiguration.isDrilldownChart) {
+        // }
         var color = d3
             .scaleOrdinal()
             .domain(subgroups)
             .range(Object.values(metaData.colors));
+        // var colorAboveTarget = d3
+        //   .scaleOrdinal()
+        //   .domain(subgroups)
+        //   .range(Object.values(metaData.colorAboveTarget));
         var state = svg
             .append('g')
             .selectAll('.state')
@@ -8525,7 +8809,7 @@ class HorizontalGroupedBarWithScrollZoomComponent extends ComponentUniqueId {
                 d.value >= parseFloat(self.chartData.targetLineData.target) &&
                 self.chartData.metaData.colorAboveTarget) {
                 const key = d.key.toLowerCase();
-                const colorAboveTarget = Object.keys(self.chartData.metaData.colorAboveTarget).find((k) => k.toLowerCase() === key);
+                const colorAboveTarget = Object.keys(self.chartData.metaData.colorAboveTarget).find(k => k.toLowerCase() === key);
                 if (colorAboveTarget) {
                     return self.chartData.metaData.colorAboveTarget[colorAboveTarget];
                 }
@@ -8656,9 +8940,8 @@ class HorizontalGroupedBarWithScrollZoomComponent extends ComponentUniqueId {
                     .on('mouseover', handleMouseOver);
             }
         }
-        if (this.chartConfiguration.displayTitleOnTop ||
-            (this.chartConfiguration.textsOnBar == undefined &&
-                this.chartConfiguration.displayTitleOnTop == undefined)) {
+        if (this.chartConfiguration.displayTitleOnTop || (this.chartConfiguration.textsOnBar == undefined &&
+            this.chartConfiguration.displayTitleOnTop == undefined)) {
             if (!isria) {
                 state
                     .selectAll('rect')
@@ -8885,8 +9168,7 @@ class HorizontalGroupedBarWithScrollZoomComponent extends ComponentUniqueId {
                     const lines = label.split('\n');
                     text.text(null);
                     lines.forEach((line, idx) => {
-                        text
-                            .append('tspan')
+                        text.append('tspan')
                             .text(line)
                             .attr('x', 0)
                             .attr('dy', idx === 0 ? '1em' : '1.1em');
@@ -8910,9 +9192,7 @@ class HorizontalGroupedBarWithScrollZoomComponent extends ComponentUniqueId {
          * used to write y labels based on configuration
          */
         if (metaData.yLabel) {
-            const yPosition = isria
-                ? 0 - margin.left / 2 - 30
-                : 0 - margin.left / 2 - 40;
+            const yPosition = isria ? 0 - margin.left / 2 - 30 : 0 - margin.left / 2 - 40;
             svgYAxisLeft
                 .append('text')
                 .attr('class', 'lib-axis-group-label font-size-1')
@@ -8996,9 +9276,7 @@ class HorizontalGroupedBarWithScrollZoomComponent extends ComponentUniqueId {
             }
             const xLabelText = metaData.xLabel;
             const isAcr = isAcronym(xLabelText.replace(/[^A-Za-z]/g, ''));
-            const xPosition = isria
-                ? height + margin.top + margin.bottom
-                : height + margin.top + margin.bottom + 40;
+            const xPosition = isria ? (height + margin.top + margin.bottom) : (height + margin.top + margin.bottom + 40);
             svg
                 .append('text')
                 .attr('class', function () {
@@ -9112,7 +9390,8 @@ class HorizontalGroupedBarWithScrollZoomComponent extends ComponentUniqueId {
             width = dataLength * 120;
         }
         if (dataLength > 8 && !this.isZoomedOut) {
-            if (this.chartData.dropdownData2 && width < dataLength * 250) {
+            if (this.chartData.dropdownData2 &&
+                width < dataLength * 250) {
                 width = dataLength * 250;
             }
             else {
@@ -9194,155 +9473,6 @@ class HorizontalGroupedBarWithScrollZoomComponent extends ComponentUniqueId {
             .attr('transform', `translate(0,${margin.top})`);
         return { outerContainer, svgYAxisLeft, svgYAxisRight, innerContainer, svg };
     }
-    renderXAxis(svg, x, height, subgroups, metaData, chartConfig, alternate_text, short_tick_length_bg, long_tick_length_bg, self) {
-        if (chartConfig.isMultiChartGridLine == undefined) {
-            // Normal dashboard charts
-            svg
-                .append('g')
-                .attr('class', 'x1 axis1')
-                .attr('transform', `translate(0,${height})`)
-                .call(d3.axisBottom(x))
-                .call((g) => g.select('.domain').remove());
-            svg.selectAll('g.x1.axis1 g.tick line').remove();
-            if (subgroups.length > 1 && !metaData.xLabel) {
-                svg
-                    .selectAll('g.x1.axis1 g.tick text')
-                    .attr('class', 'lib-xaxis-labels-texts-drilldown')
-                    .style('fill', 'var(--chart-text-color)')
-                    .attr('y', 32);
-            }
-            else {
-                svg
-                    .selectAll('g.x1.axis1 g.tick text')
-                    .attr('class', 'lib-xaxis-labels-texts-drilldown')
-                    .style('fill', 'var(--chart-text-color)');
-            }
-        }
-        else {
-            // Weekly charts / multi-chart
-            svg
-                .append('g')
-                .attr('class', 'x1 axis1')
-                .attr('transform', `translate(0,${height})`)
-                .call(d3.axisBottom(x).tickSize(0))
-                .call((g) => g.select('.domain').attr('fill', 'none'));
-            // Tick line size in alternate fashion
-            svg.selectAll('g.x1.axis1 g.tick line').attr('y2', function () {
-                if (alternate_text && chartConfig.isNoAlternateXaxisText == undefined) {
-                    alternate_text = false;
-                    return long_tick_length_bg - 7;
-                }
-                else {
-                    alternate_text = true;
-                    return short_tick_length_bg - 4;
-                }
-            });
-            // Reset flag
-            alternate_text = false;
-            // X-axis labels
-            svg
-                .selectAll('g.x1.axis1 g.tick text')
-                .attr('class', 'lib-xaxis-labels-texts-weeklycharts')
-                .attr('y', function () {
-                if (chartConfig.isFullScreen)
-                    return short_tick_length_bg;
-                if (alternate_text) {
-                    alternate_text = false;
-                    return long_tick_length_bg;
-                }
-                else {
-                    alternate_text = true;
-                    return short_tick_length_bg;
-                }
-            });
-        }
-    }
-    renderXAxisLabels(svg, data, subgroups, metaData, chartConfig, short_tick_length_bg, long_tick_length_bg, isMobile, isria, self) {
-        if (!chartConfig.xLabelsOnSameLine)
-            return;
-        const xAxisLabels = svg.selectAll('g.x1.axis1 g.tick text');
-        this.applyLabelStyles(xAxisLabels, data, subgroups, metaData, chartConfig, short_tick_length_bg, long_tick_length_bg, isMobile, self);
-        this.handleLabelText(xAxisLabels, data, subgroups, metaData, chartConfig, isMobile, self);
-        if (isria && data.length > 8) {
-            this.applyRiaLabelOverride(xAxisLabels);
-        }
-        if (isMobile && !self.isHeaderVisible) {
-            xAxisLabels.classed('mobile-xaxis-override', true);
-        }
-    }
-    applyLabelStyles(labels, data, subgroups, metaData, chartConfig, short_tick_length_bg, long_tick_length_bg, isMobile, self) {
-        labels
-            .attr('class', 'lib-xaxis-labels-texts-drilldown')
-            .style('font-size', self.isHeaderVisible ? '18px' : '14px')
-            .attr('text-anchor', 'middle')
-            .attr('y', (d) => this.calculateLabelY(d, data, subgroups, metaData, chartConfig, short_tick_length_bg, long_tick_length_bg, self))
-            .attr('x', (d) => this.calculateLabelX(d, data, self));
-    }
-    calculateLabelY(d, data, subgroups, metaData, chartConfig, short_tick_length_bg, long_tick_length_bg, self) {
-        // Logic from your original code for y positioning
-        if (subgroups.length > 1 && data.length > 8 && metaData.xLabel) {
-            return short_tick_length_bg + 14;
-        }
-        if (subgroups.length > 1 && data.length > 8 && !metaData.xLabel) {
-            return chartConfig.isFullScreen
-                ? short_tick_length_bg + 2
-                : short_tick_length_bg + 10;
-        }
-        let baseY = self.isHeaderVisible
-            ? short_tick_length_bg + 25
-            : short_tick_length_bg;
-        return baseY;
-    }
-    calculateLabelX(d, data, self) {
-        if (data.length > 8 && !self.isZoomedOut)
-            return 1;
-        return 0;
-    }
-    handleLabelText(labels, data, subgroups, metaData, chartConfig, isMobile, self) {
-        labels.text((d) => {
-            if (isMobile && !self.isHeaderVisible) {
-                return d
-                    .split(/[\s\-]+/)[0]
-                    .substring(0, 3)
-                    .toLowerCase();
-            }
-            // Split dates or weeks, ignore -1 values, etc.
-            // Keep all your previous text-processing logic here
-            return d.toLowerCase(); // fallback
-        });
-        // Example of handling sideways labels for grouped zoomed-out charts
-        labels.each(function (d) {
-            const isDateLabel = /^(\d{2,4}[-\/])?\d{2,4}[-\/]\d{2,4}$/.test(d.trim());
-            const isWeekLabel = /week|wk|w\d+/i.test(d);
-            if (subgroups.length > 1 &&
-                self.isZoomedOut &&
-                data.length > 8 &&
-                isDateLabel &&
-                !isWeekLabel) {
-                d3.select(this).style('writing-mode', 'sideways-lr');
-            }
-        });
-    }
-    applyRiaLabelOverride(labels) {
-        labels
-            .classed('mobile-xaxis-override', true)
-            .text((d) => d.substring(0, 3))
-            .style('font-size', '12px')
-            .attr('y', 5)
-            .attr('x', 5)
-            .style('text-anchor', 'middle');
-    }
-    calculateMaxValue(maxValue) {
-        if (maxValue === 0) {
-            if (this.chartData.targetLineData) {
-                return this.chartData.targetLineData.target + 20;
-            }
-            else {
-                return 100;
-            }
-        }
-        return maxValue;
-    }
     handleClick(d) {
         if (this.chartData.metaData.hasDrillDown || d?.toggleFrom)
             this.clickEvent.emit(d);