@licklist/design 0.78.5-dev.88 → 0.78.5-dev.9

package/dist/v2/dashboard-analytics/chart/Chart.js

@@ -1,733 +0,0 @@
-import { jsxs, jsx } from 'react/jsx-runtime';
-import React__default from 'react';
-import { ResponsiveContainer, AreaChart, CartesianGrid, XAxis, YAxis, Tooltip, ReferenceLine, Area } from 'recharts';
-import { TrendingUp, TrendingDown } from 'lucide-react';
-import './Chart.scss.js';
-
-function _array_like_to_array(arr, len) {
-    if (len == null || len > arr.length) len = arr.length;
-    for(var i = 0, arr2 = new Array(len); i < len; i++)arr2[i] = arr[i];
-    return arr2;
-}
-function _array_with_holes(arr) {
-    if (Array.isArray(arr)) return arr;
-}
-function _array_without_holes(arr) {
-    if (Array.isArray(arr)) return _array_like_to_array(arr);
-}
-function _iterable_to_array(iter) {
-    if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter);
-}
-function _iterable_to_array_limit(arr, i) {
-    var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"];
-    if (_i == null) return;
-    var _arr = [];
-    var _n = true;
-    var _d = false;
-    var _s, _e;
-    try {
-        for(_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true){
-            _arr.push(_s.value);
-            if (i && _arr.length === i) break;
-        }
-    } catch (err) {
-        _d = true;
-        _e = err;
-    } finally{
-        try {
-            if (!_n && _i["return"] != null) _i["return"]();
-        } finally{
-            if (_d) throw _e;
-        }
-    }
-    return _arr;
-}
-function _non_iterable_rest() {
-    throw new TypeError("Invalid attempt to destructure non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
-}
-function _non_iterable_spread() {
-    throw new TypeError("Invalid attempt to spread non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
-}
-function _sliced_to_array(arr, i) {
-    return _array_with_holes(arr) || _iterable_to_array_limit(arr, i) || _unsupported_iterable_to_array(arr, i) || _non_iterable_rest();
-}
-function _to_consumable_array(arr) {
-    return _array_without_holes(arr) || _iterable_to_array(arr) || _unsupported_iterable_to_array(arr) || _non_iterable_spread();
-}
-function _unsupported_iterable_to_array(o, minLen) {
-    if (!o) return;
-    if (typeof o === "string") return _array_like_to_array(o, minLen);
-    var n = Object.prototype.toString.call(o).slice(8, -1);
-    if (n === "Object" && o.constructor) n = o.constructor.name;
-    if (n === "Map" || n === "Set") return Array.from(n);
-    if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _array_like_to_array(o, minLen);
-}
-var Chart = function(param) {
-    var title = param.title, subtitle = param.subtitle, data = param.data, _param_isRevenue = param.isRevenue, isRevenue = _param_isRevenue === void 0 ? false : _param_isRevenue, _param_className = param.className, className = _param_className === void 0 ? '' : _param_className, _param_period = param.period, period = _param_period === void 0 ? 'today' : _param_period; param.bookingType; var tmp = param.isFullWidth, propIsFullWidth = tmp === void 0 ? false : tmp, _param_isLoading = param.isLoading, isLoading = _param_isLoading === void 0 ? false : _param_isLoading, _param_isRefreshing = param.isRefreshing, isRefreshing = _param_isRefreshing === void 0 ? false : _param_isRefreshing;
-    var _Math;
-    var _React_useState = _sliced_to_array(React__default.useState(0), 2), animationKey = _React_useState[0], setAnimationKey = _React_useState[1];
-    var _React_useState1 = _sliced_to_array(React__default.useState(false), 2), isAnimating = _React_useState1[0], setIsAnimating = _React_useState1[1];
-    var _React_useState2 = _sliced_to_array(React__default.useState(0), 2), forceResize = _React_useState2[0], setForceResize = _React_useState2[1];
-    var prevDataRef = React__default.useRef(data);
-    var prevPeriodRef = React__default.useRef(period);
-    React__default.useEffect(function() {
-        var dataChanged = JSON.stringify(prevDataRef.current) !== JSON.stringify(data);
-        var periodChanged = prevPeriodRef.current !== period;
-        if (dataChanged || periodChanged) {
-            setIsAnimating(true);
-            setAnimationKey(function(prev) {
-                return prev + 1;
-            });
-            if (periodChanged) {
-                setForceResize(function(prev) {
-                    return prev + 1;
-                });
-                prevPeriodRef.current = period;
-            }
-            prevDataRef.current = data;
-            var timer = setTimeout(function() {
-                setIsAnimating(false);
-            }, 800);
-            return function() {
-                return clearTimeout(timer);
-            };
-        }
-    }, [
-        data,
-        period
-    ]);
-    var _React_useState3 = _sliced_to_array(React__default.useState(false), 2), isMobile = _React_useState3[0], setIsMobile = _React_useState3[1];
-    var _React_useState4 = _sliced_to_array(React__default.useState(false), 2), isTablet = _React_useState4[0], setIsTablet = _React_useState4[1];
-    var _React_useState5 = _sliced_to_array(React__default.useState(false), 2), detectedFullWidth = _React_useState5[0], setDetectedFullWidth = _React_useState5[1];
-    var _React_useState6 = _sliced_to_array(React__default.useState({
-        width: 0,
-        height: 0
-    }), 2); _React_useState6[0]; var setDimensions = _React_useState6[1];
-    var chartRef = React__default.useRef(null);
-    var isFullWidth = propIsFullWidth || detectedFullWidth;
-    React__default.useEffect(function() {
-        var checkScreenSize = function() {
-            setIsMobile(window.innerWidth < 480);
-            setIsTablet(window.innerWidth >= 480 && window.innerWidth < 768);
-            if (chartRef.current) {
-                var rect = chartRef.current.getBoundingClientRect();
-                setDimensions({
-                    width: rect.width,
-                    height: rect.height
-                });
-            }
-        };
-        checkScreenSize();
-        window.addEventListener('resize', checkScreenSize);
-        return function() {
-            return window.removeEventListener('resize', checkScreenSize);
-        };
-    }, []);
-    var useChartRecalculation = function() {
-        var forceRecalculation = React__default.useCallback(function() {
-            if (chartRef.current) {
-                var resizeObserver = new ResizeObserver(function() {});
-                resizeObserver.observe(chartRef.current);
-                setTimeout(function() {
-                    resizeObserver.disconnect();
-                }, 100);
-                setTimeout(function() {
-                    window.dispatchEvent(new Event('resize'));
-                }, 50);
-            }
-        }, []);
-        return forceRecalculation;
-    };
-    var forceRecalculation = useChartRecalculation();
-    React__default.useEffect(function() {
-        forceRecalculation();
-    }, [
-        period,
-        forceRecalculation
-    ]);
-    React__default.useEffect(function() {
-        if (propIsFullWidth !== undefined) return;
-        var checkChartWidth = function() {
-            if (chartRef.current) {
-                var chartWidth = chartRef.current.offsetWidth;
-                var viewportWidth = window.innerWidth;
-                var isWide = chartWidth > viewportWidth * 0.65;
-                setDetectedFullWidth(isWide);
-            }
-        };
-        var timeoutId = setTimeout(checkChartWidth, 100);
-        window.addEventListener('resize', checkChartWidth);
-        var resizeObserver = new ResizeObserver(function() {
-            setTimeout(checkChartWidth, 50);
-        });
-        if (chartRef.current) {
-            resizeObserver.observe(chartRef.current);
-        }
-        return function() {
-            clearTimeout(timeoutId);
-            window.removeEventListener('resize', checkChartWidth);
-            resizeObserver.disconnect();
-        };
-    }, [
-        propIsFullWidth,
-        forceResize
-    ]);
-    React__default.useEffect(function() {
-        if (chartRef.current) {
-            var resizeEvent = new Event('resize');
-            window.dispatchEvent(resizeEvent);
-            var currentRef = chartRef.current;
-            var display = currentRef.style.display;
-            currentRef.style.display = 'none';
-            currentRef.offsetHeight;
-            currentRef.style.display = display;
-            setTimeout(function() {
-                var rect = currentRef.getBoundingClientRect();
-                setDimensions({
-                    width: rect.width,
-                    height: rect.height
-                });
-            }, 10);
-        }
-    }, [
-        period,
-        forceResize,
-        animationKey
-    ]);
-    var processedData = React__default.useMemo(function() {
-        var transformXAxisForPeriod = function(data, period) {
-            if (period === 'week') {
-                var days = [
-                    'Mon',
-                    'Tue',
-                    'Wed',
-                    'Thu',
-                    'Fri',
-                    'Sat',
-                    'Sun'
-                ];
-                return days.map(function(day, index) {
-                    var hourIndex = index * 3;
-                    var dayData = data[hourIndex] || {
-                        time: '',
-                        value: 0,
-                        participants: 0
-                    };
-                    return {
-                        time: day,
-                        value: dayData.value,
-                        participants: dayData.participants || 0
-                    };
-                });
-            }
-            if (isFullWidth) {
-                if (data.length > 8) {
-                    return data.length <= 24 ? data : data.filter(function(_, index) {
-                        return index % 2 === 0;
-                    });
-                }
-                return data;
-            }
-            if (period === 'today' && data.length > 12) {
-                return data.filter(function(_, index) {
-                    return index % 3 === 0;
-                });
-            }
-            return data;
-        };
-        var transformed = transformXAxisForPeriod(data, period);
-        var months = [
-            'Jan',
-            'Feb',
-            'Mar',
-            'Apr',
-            'May',
-            'Jun',
-            'Jul',
-            'Aug',
-            'Sep',
-            'Oct',
-            'Nov',
-            'Dec'
-        ];
-        var isMonthlyData = transformed.some(function(item) {
-            return months.some(function(month) {
-                return item.time.includes(month);
-            });
-        });
-        if (isMonthlyData) {
-            var last12Months = transformed.slice(-12);
-            return last12Months;
-        }
-        return transformed;
-    }, [
-        data,
-        period,
-        isFullWidth
-    ]);
-    var maxValue = (_Math = Math).max.apply(_Math, _to_consumable_array(processedData.map(function(d) {
-        return d.value;
-    })));
-    var yAxisMax;
-    var yAxisMin = 0;
-    var calculateOptimalScale = function(max) {
-        if (max === 0) return isRevenue ? 10 : 5;
-        var bufferedMax = max * (isRevenue ? 1.15 : 1.1);
-        if (isRevenue) {
-            if (bufferedMax <= 1) return 1;
-            if (bufferedMax <= 2) return 2;
-            if (bufferedMax <= 5) return 5;
-            if (bufferedMax <= 10) return 10;
-            if (bufferedMax <= 20) return 20;
-            if (bufferedMax <= 25) return 25;
-            if (bufferedMax <= 50) return 50;
-            if (bufferedMax <= 100) return 100;
-            if (bufferedMax <= 250) return 250;
-            if (bufferedMax <= 500) return 500;
-            if (bufferedMax <= 1000) return 1000;
-            var magnitude = Math.pow(10, Math.floor(Math.log10(bufferedMax)));
-            var normalized = bufferedMax / magnitude;
-            if (normalized <= 1) return magnitude;
-            if (normalized <= 2) return 2 * magnitude;
-            if (normalized <= 2.5) return 2.5 * magnitude;
-            if (normalized <= 5) return 5 * magnitude;
-            return 10 * magnitude;
-        } else {
-            if (bufferedMax <= 1) return 2;
-            if (bufferedMax <= 2) return 3;
-            if (bufferedMax <= 3) return 4;
-            if (bufferedMax <= 5) return 6;
-            if (bufferedMax <= 8) return 10;
-            if (bufferedMax <= 12) return 15;
-            if (bufferedMax <= 20) return 25;
-            if (bufferedMax <= 40) return 50;
-            if (bufferedMax <= 80) return 100;
-            var magnitude1 = Math.pow(10, Math.floor(Math.log10(bufferedMax)));
-            var normalized1 = bufferedMax / magnitude1;
-            if (normalized1 <= 1) return magnitude1;
-            if (normalized1 <= 2) return 2 * magnitude1;
-            if (normalized1 <= 5) return 5 * magnitude1;
-            return 10 * magnitude1;
-        }
-    };
-    yAxisMax = calculateOptimalScale(maxValue);
-    var getTickInterval = function(max) {
-        var targetTickCount = 5;
-        if (isRevenue) {
-            if (max <= 1) return 0.25;
-            if (max <= 2) return 0.5;
-            if (max <= 5) return 1;
-            if (max <= 10) return 2;
-            if (max <= 20) return 5;
-            if (max <= 25) return 5;
-            if (max <= 50) return 10;
-            if (max <= 100) return 20;
-            if (max <= 250) return 50;
-            if (max <= 500) return 100;
-            if (max <= 1000) return 200;
-            var roughInterval = max / targetTickCount;
-            var magnitude = Math.pow(10, Math.floor(Math.log10(roughInterval)));
-            var normalized = roughInterval / magnitude;
-            if (normalized <= 1) return magnitude;
-            if (normalized <= 2) return 2 * magnitude;
-            if (normalized <= 2.5) return 2.5 * magnitude;
-            if (normalized <= 5) return 5 * magnitude;
-            return 10 * magnitude;
-        } else {
-            if (max <= 2) return 1;
-            if (max <= 3) return 1;
-            if (max <= 6) return 2;
-            if (max <= 10) return 2;
-            if (max <= 15) return 3;
-            if (max <= 25) return 5;
-            if (max <= 50) return 10;
-            if (max <= 100) return 20;
-            var roughInterval1 = max / targetTickCount;
-            var magnitude1 = Math.pow(10, Math.floor(Math.log10(roughInterval1)));
-            var normalized1 = roughInterval1 / magnitude1;
-            if (normalized1 <= 1) return magnitude1;
-            if (normalized1 <= 2) return 2 * magnitude1;
-            if (normalized1 <= 5) return 5 * magnitude1;
-            return 10 * magnitude1;
-        }
-    };
-    var tickInterval = getTickInterval(yAxisMax);
-    var ticks = [];
-    for(var i = yAxisMin; i <= yAxisMax; i += tickInterval){
-        var tick = Math.round(i * 100) / 100;
-        ticks.push(tick);
-    }
-    if (ticks[ticks.length - 1] > yAxisMax) {
-        ticks.pop();
-    }
-    if (ticks[ticks.length - 1] < yAxisMax) {
-        ticks.push(yAxisMax);
-    }
-    var getXAxisInterval = function(dataLength) {
-        var isMonthly = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : false, isWeekly = arguments.length > 2 && arguments[2] !== void 0 ? arguments[2] : false, isHourly = arguments.length > 3 && arguments[3] !== void 0 ? arguments[3] : false;
-        if (isMobile) {
-            if (isFullWidth) {
-                if (dataLength <= 6) return 0;
-                if (dataLength <= 10) return 1;
-                return Math.floor(dataLength / 5);
-            }
-            if (isMonthly && dataLength <= 12) return 2;
-            if (isWeekly && dataLength <= 7) return 0;
-            if (isHourly && dataLength <= 12) return 3;
-            if (dataLength <= 4) return 0;
-            if (dataLength <= 7) return 1;
-            if (dataLength <= 12) return 2;
-            return Math.floor(dataLength / 3);
-        }
-        if (isTablet) {
-            if (isFullWidth) {
-                if (isMonthly && dataLength <= 12) return 0;
-                if (isWeekly && dataLength <= 7) return 0;
-                if (isHourly && dataLength <= 16) return 0;
-                if (dataLength <= 10) return 0;
-                if (dataLength <= 20) return 1;
-                return Math.floor(dataLength / 10);
-            }
-            if (isMonthly && dataLength <= 12) return 0;
-            if (isWeekly && dataLength <= 7) return 0;
-            if (isHourly && dataLength <= 12) return 1;
-            if (dataLength <= 4) return 0;
-            if (dataLength <= 7) return 0;
-            if (dataLength <= 12) return 1;
-            return Math.floor(dataLength / 5);
-        }
-        if (isFullWidth) {
-            if (isMonthly && dataLength <= 12) return 0;
-            if (isWeekly && dataLength <= 7) return 0;
-            if (isHourly && dataLength <= 24) return 1;
-            if (dataLength <= 10) return 0;
-            if (dataLength <= 20) return 1;
-            return Math.floor(dataLength / 12);
-        }
-        if (isMonthly && dataLength <= 12) return 0;
-        if (isWeekly && dataLength <= 7) return 0;
-        if (isHourly && dataLength <= 12) return 1;
-        if (dataLength <= 4) return 0;
-        if (dataLength <= 7) return 0;
-        if (dataLength <= 12) return 2;
-        return Math.floor(dataLength / 6);
-    };
-    var months = [
-        'Jan',
-        'Feb',
-        'Mar',
-        'Apr',
-        'May',
-        'Jun',
-        'Jul',
-        'Aug',
-        'Sep',
-        'Oct',
-        'Nov',
-        'Dec'
-    ];
-    var days = [
-        'Mon',
-        'Tue',
-        'Wed',
-        'Thu',
-        'Fri',
-        'Sat',
-        'Sun'
-    ];
-    var isMonthlyData = processedData.some(function(item) {
-        return months.some(function(month) {
-            return item.time.includes(month);
-        });
-    });
-    var isWeeklyData = processedData.some(function(item) {
-        return days.some(function(day) {
-            return item.time === day;
-        });
-    });
-    var isHourlyData = processedData.some(function(item) {
-        return item.time.includes(':');
-    });
-    var xAxisInterval = getXAxisInterval(processedData.length, isMonthlyData, isWeeklyData, isHourlyData);
-    var getCurrentTimeReference = function() {
-        if (subtitle && subtitle.includes('Yesterday')) return null;
-        var now = new Date();
-        if (subtitle === 'Today') {
-            return "".concat(now.getHours().toString().padStart(2, '0'), ":00");
-        }
-        if (subtitle && subtitle.includes(' - ') && (subtitle.includes('Mon') || subtitle.includes('Tue') || subtitle.includes('Wed') || subtitle.includes('Thu') || subtitle.includes('Fri') || subtitle.includes('Sat') || subtitle.includes('Sun'))) {
-            var dayNames = [
-                'Mon',
-                'Tue',
-                'Wed',
-                'Thu',
-                'Fri',
-                'Sat',
-                'Sun'
-            ];
-            return dayNames[now.getDay() === 0 ? 6 : now.getDay() - 1];
-        }
-        if (subtitle && /^[A-Z][a-z]+ \d{4}$/.test(subtitle)) {
-            var dayOfMonth = now.getDate();
-            var weekNumber = Math.ceil(dayOfMonth / 7);
-            var weekStart = (weekNumber - 1) * 7 + 1;
-            var weekEnd = Math.min(weekNumber * 7, new Date(now.getFullYear(), now.getMonth() + 1, 0).getDate());
-            var formatOrdinal = function(n) {
-                var suffix = n % 10 === 1 && n !== 11 ? 'st' : n % 10 === 2 && n !== 12 ? 'nd' : n % 10 === 3 && n !== 13 ? 'rd' : 'th';
-                return "".concat(n).concat(suffix);
-            };
-            return "".concat(formatOrdinal(weekStart), " - ").concat(formatOrdinal(weekEnd));
-        }
-        if (subtitle && /^\d{4}$/.test(subtitle)) {
-            var months = [
-                'Jan',
-                'Feb',
-                'Mar',
-                'Apr',
-                'May',
-                'Jun',
-                'Jul',
-                'Aug',
-                'Sep',
-                'Oct',
-                'Nov',
-                'Dec'
-            ];
-            return months[now.getMonth()];
-        }
-        return null;
-    };
-    var currentTimeRef = getCurrentTimeReference();
-    var CustomTooltip = function(param) {
-        var active = param.active, payload = param.payload, label = param.label;
-        if (active && payload && payload.length) {
-            var currentValue = payload[0].value;
-            var currentIndex = processedData.findIndex(function(d) {
-                return d.time === label;
-            });
-            var trend = null;
-            if (currentIndex >= 0 && currentIndex > 0) {
-                var prevValue = processedData[currentIndex - 1].value;
-                var prevTime = processedData[currentIndex - 1].time;
-                var change = currentValue - prevValue;
-                if (typeof prevValue === 'number' && typeof currentValue === 'number') {
-                    var previousValue = prevValue === 0 ? 0.1 : Math.abs(prevValue);
-                    var percentChange = change / previousValue * 100;
-                    if (!isNaN(percentChange) && isFinite(percentChange)) {
-                        trend = {
-                            change: change,
-                            percentChange: Math.abs(percentChange).toFixed(1),
-                            isPositive: change > 0,
-                            isEqual: change === 0,
-                            comparisonText: "vs ".concat(prevTime),
-                            previousValue: prevValue
-                        };
-                    }
-                }
-            }
-            var formatValue = function(value) {
-                if (isRevenue) {
-                    return "\xa3".concat(value.toLocaleString("en-GB", {
-                        minimumFractionDigits: 2,
-                        maximumFractionDigits: 2
-                    }));
-                }
-                return value.toLocaleString();
-            };
-            return /*#__PURE__*/ jsxs("div", {
-                className: "chart__tooltip",
-                children: [
-                    /*#__PURE__*/ jsx("div", {
-                        className: "chart__tooltip-label",
-                        children: label
-                    }),
-                    /*#__PURE__*/ jsx("div", {
-                        className: "chart__tooltip-value",
-                        children: isRevenue ? formatValue(currentValue) : "".concat(currentValue, " ").concat(currentValue === 1 ? 'Booking' : 'Bookings')
-                    }),
-                    !isRevenue && payload && payload[0] && payload[0].payload.participants !== undefined && /*#__PURE__*/ jsxs("div", {
-                        className: "chart__tooltip-participants",
-                        children: [
-                            payload[0].payload.participants,
-                            " people"
-                        ]
-                    }),
-                    trend && !trend.isEqual && /*#__PURE__*/ jsx("div", {
-                        className: "chart__tooltip-trend ".concat(trend.isEqual ? 'neutral' : trend.isPositive ? 'positive' : 'negative'),
-                        children: /*#__PURE__*/ jsxs("div", {
-                            className: "chart__tooltip-trend-content",
-                            children: [
-                                trend.isPositive ? /*#__PURE__*/ jsx(TrendingUp, {
-                                    size: 12,
-                                    className: "chart__tooltip-trend-icon"
-                                }) : /*#__PURE__*/ jsx(TrendingDown, {
-                                    size: 12,
-                                    className: "chart__tooltip-trend-icon"
-                                }),
-                                /*#__PURE__*/ jsx("span", {
-                                    className: "chart__tooltip-trend-value",
-                                    children: (trend.isPositive ? '+' : '') + (isRevenue ? "\xa3".concat(Math.abs(trend.change).toFixed(2)) : "".concat(trend.change, " ").concat(Math.abs(trend.change) === 1 ? 'Booking' : 'Bookings'))
-                                })
-                            ]
-                        })
-                    }),
-                    trend && !trend.isEqual && /*#__PURE__*/ jsx("div", {
-                        className: "chart__tooltip-comparison",
-                        children: trend.comparisonText
-                    })
-                ]
-            });
-        }
-        return null;
-    };
-    return /*#__PURE__*/ jsxs("section", {
-        ref: chartRef,
-        className: "chart ".concat(className, " ").concat(isLoading || isAnimating ? 'chart--loading' : '', " ").concat(isRefreshing ? 'chart--refreshing' : '').trim(),
-        "data-full-width": isFullWidth,
-        children: [
-            /*#__PURE__*/ jsxs("header", {
-                className: "chart__header",
-                children: [
-                    /*#__PURE__*/ jsxs("h2", {
-                        className: "chart__title",
-                        children: [
-                            title,
-                            isRefreshing && !isLoading && /*#__PURE__*/ jsx("span", {
-                                className: "chart__title-refresh-indicator",
-                                children: "⟳"
-                            })
-                        ]
-                    }),
-                    /*#__PURE__*/ jsx("p", {
-                        className: "chart__subtitle",
-                        children: subtitle
-                    })
-                ]
-            }),
-            /*#__PURE__*/ jsxs("div", {
-                className: "chart__container",
-                children: [
-                    isLoading && /*#__PURE__*/ jsx("div", {
-                        className: "chart__loading-overlay",
-                        children: /*#__PURE__*/ jsx("div", {
-                            className: "chart__loading-spinner"
-                        })
-                    }),
-                    /*#__PURE__*/ jsx("div", {
-                        className: "chart__wrapper ".concat(isAnimating ? 'chart__wrapper--recalculating' : ''),
-                        children: /*#__PURE__*/ jsx(ResponsiveContainer, {
-                            width: "100%",
-                            height: "100%",
-                            debounce: 1,
-                            children: /*#__PURE__*/ jsxs(AreaChart, {
-                                data: processedData,
-                                margin: {
-                                    top: 10,
-                                    right: 10,
-                                    left: 10,
-                                    bottom: 16
-                                },
-                                children: [
-                                    /*#__PURE__*/ jsx("defs", {
-                                        children: /*#__PURE__*/ jsxs("linearGradient", {
-                                            id: "chartGradient",
-                                            x1: "0",
-                                            y1: "0",
-                                            x2: "0",
-                                            y2: "1",
-                                            children: [
-                                                /*#__PURE__*/ jsx("stop", {
-                                                    offset: "0%",
-                                                    stopColor: "#1F9AB5",
-                                                    stopOpacity: 0.5
-                                                }),
-                                                /*#__PURE__*/ jsx("stop", {
-                                                    offset: "100%",
-                                                    stopColor: "#1F9AB5",
-                                                    stopOpacity: 0
-                                                })
-                                            ]
-                                        })
-                                    }),
-                                    /*#__PURE__*/ jsx(CartesianGrid, {
-                                        strokeDasharray: "3 3",
-                                        stroke: "#E8E9EF"
-                                    }),
-                                    /*#__PURE__*/ jsx(XAxis, {
-                                        dataKey: "time",
-                                        type: "category",
-                                        axisLine: false,
-                                        tickLine: false,
-                                        tick: {
-                                            fontSize: isMobile ? 9 : isTablet ? 10 : 11,
-                                            fill: '#626A90'
-                                        },
-                                        tickMargin: isMobile ? 5 : 10,
-                                        interval: xAxisInterval
-                                    }),
-                                    /*#__PURE__*/ jsx(YAxis, {
-                                        domain: [
-                                            yAxisMin,
-                                            yAxisMax
-                                        ],
-                                        ticks: ticks,
-                                        axisLine: false,
-                                        tickLine: false,
-                                        tick: {
-                                            fontSize: isMobile ? 9 : isTablet ? 10 : 11,
-                                            fill: '#626A90'
-                                        },
-                                        tickFormatter: function(value) {
-                                            if (isRevenue) {
-                                                return isMobile ? "\xa3".concat(Math.round(value)) : "\xa3".concat(value);
-                                            }
-                                            return value.toString();
-                                        },
-                                        tickMargin: isMobile ? 3 : 5,
-                                        width: isMobile ? 30 : isTablet ? 35 : 40
-                                    }),
-                                    /*#__PURE__*/ jsx(Tooltip, {
-                                        content: CustomTooltip
-                                    }),
-                                    currentTimeRef && /*#__PURE__*/ jsx(ReferenceLine, {
-                                        x: currentTimeRef,
-                                        stroke: "#7C3AED",
-                                        strokeWidth: 2,
-                                        strokeDasharray: "6 4"
-                                    }),
-                                    /*#__PURE__*/ jsx(Area, {
-                                        type: "monotone",
-                                        dataKey: "value",
-                                        stroke: "#1F9AB5",
-                                        strokeWidth: isMobile ? 1.5 : 2,
-                                        fill: "url(#chartGradient)",
-                                        dot: {
-                                            fill: '#1F9AB5',
-                                            strokeWidth: 0,
-                                            r: isMobile ? 3 : isTablet ? 3.5 : 4,
-                                            fillOpacity: 1
-                                        },
-                                        activeDot: {
-                                            r: isMobile ? 5 : isTablet ? 5.5 : 6,
-                                            stroke: '#1F9AB5',
-                                            strokeWidth: 2,
-                                            fill: '#fff',
-                                            fillOpacity: 1,
-                                            strokeOpacity: 1
-                                        },
-                                        animationBegin: 0,
-                                        animationDuration: 800,
-                                        animationEasing: "ease-out",
-                                        isAnimationActive: true
-                                    })
-                                ]
-                            }, "chart-".concat(animationKey, "-").concat(forceResize))
-                        }, "responsive-".concat(animationKey, "-").concat(forceResize))
-                    })
-                ]
-            })
-        ]
-    });
-};
-
-export { Chart };