@quillsql/react 2.9.0 → 2.9.2

package/dist/components/Banner/index.js

@@ -1,8 +1,6 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-const jsx_runtime_1 = require("react/jsx-runtime");
-function Banner({ dashboardItemName, dashboardName, onExit, style, }) {
-    return ((0, jsx_runtime_1.jsx)("div", { id: "quill-edit-banner", style: {
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+export default function Banner({ dashboardItemName, dashboardName, onExit, style, }) {
+    return (_jsx("div", { id: "quill-edit-banner", style: {
             zIndex: 100,
             display: 'flex',
             paddingTop: '0.625rem',
@@ -12,17 +10,15 @@ function Banner({ dashboardItemName, dashboardName, onExit, style, }) {
             alignItems: 'center',
             backgroundColor: '#111827',
             ...style,
-        }, children: (0, jsx_runtime_1.jsxs)("p", { style: {
+        }, children: _jsxs("p", { style: {
                 fontSize: '14px',
                 color: '#ffffff',
-            }, children: [(0, jsx_runtime_1.jsx)("strong", { style: { fontWeight: 600 }, children: "Edit Mode" }), (0, jsx_runtime_1.jsx)("svg", { viewBox: "0 0 2 2", style: {
+            }, children: [_jsx("strong", { style: { fontWeight: 600 }, children: "Edit Mode" }), _jsx("svg", { viewBox: "0 0 2 2", style: {
                         display: 'inline',
                         marginLeft: '8px',
                         marginRight: '8px',
                         width: '2px',
                         height: '2px',
                         fill: 'currentColor',
-                    }, "aria-hidden": "true", children: (0, jsx_runtime_1.jsx)("circle", { cx: 1, cy: 1, r: 1 }) }), `You are currently editing `, (0, jsx_runtime_1.jsx)("strong", { style: { fontWeight: 600 }, children: dashboardItemName }), ` on the `, (0, jsx_runtime_1.jsx)("strong", { style: { fontWeight: 600 }, children: dashboardName }), ` dashboard.`] }) }));
+                    }, "aria-hidden": "true", children: _jsx("circle", { cx: 1, cy: 1, r: 1 }) }), `You are currently editing `, _jsx("strong", { style: { fontWeight: 600 }, children: dashboardItemName }), ` on the `, _jsx("strong", { style: { fontWeight: 600 }, children: dashboardName }), ` dashboard.`] }) }));
 }
-exports.default = Banner;
-//# sourceMappingURL=index.js.map

package/dist/components/BigModal/BigModal.js

@@ -1,39 +1,14 @@
-"use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-const jsx_runtime_1 = require("react/jsx-runtime");
+import { jsx as _jsx } from "react/jsx-runtime";
 // @ts-nocheck
 /* eslint-disable react/display-name */
-const react_1 = __importStar(require("react"));
-const hooks_1 = require("../../hooks");
-const lib_1 = require("../../lib");
-const BigModal = react_1.default.forwardRef((props, ref) => {
+import React, { useCallback, useEffect, useRef, useState } from 'react';
+import { useOnClickOutside, useOnWindowResize } from '../../hooks';
+import { mergeRefs } from '../../lib';
+const BigModal = React.forwardRef((props, ref) => {
     const { showModal, setShowModal, parentRef, width, maxHeight = '18rem', children, className, theme, ...other } = props;
-    const [modalExceedsWindow, setModalExceedsWindow] = (0, react_1.useState)(false);
-    const modalRef = (0, react_1.useRef)(null);
-    const checkModalExceedsWindow = (0, react_1.useCallback)((modalWidth, windowWidth) => {
+    const [modalExceedsWindow, setModalExceedsWindow] = useState(false);
+    const modalRef = useRef(null);
+    const checkModalExceedsWindow = useCallback((modalWidth, windowWidth) => {
         if (!parentRef.current) {
             return false;
         }
@@ -43,7 +18,7 @@ const BigModal = react_1.default.forwardRef((props, ref) => {
     const getAbsoluteSpacing = () => {
         return modalExceedsWindow ? '0' : '0';
     };
-    (0, hooks_1.useOnClickOutside)(modalRef, e => {
+    useOnClickOutside(modalRef, e => {
         // Exclude click on trigger button (e.g. Dropdown Button) from outside click handler
         const isTriggerElem = parentRef
             ? parentRef.current?.contains(e.target)
@@ -53,17 +28,17 @@ const BigModal = react_1.default.forwardRef((props, ref) => {
         }
     });
     // Execute only when modal is of absolute size
-    (0, react_1.useEffect)(() => {
+    useEffect(() => {
         if (width) {
             setModalExceedsWindow(checkModalExceedsWindow(width, window.innerWidth));
         }
     }, [checkModalExceedsWindow, parentRef, width]);
-    (0, hooks_1.useOnWindowResize)(() => {
+    useOnWindowResize(() => {
         if (width) {
             setModalExceedsWindow(checkModalExceedsWindow(width, window.innerWidth));
         }
     });
-    return showModal ? ((0, jsx_runtime_1.jsx)("div", { ref: (0, lib_1.mergeRefs)([modalRef, ref]), style: {
+    return showModal ? (_jsx("div", { ref: mergeRefs([modalRef, ref]), style: {
             position: 'absolute',
             zIndex: 10,
             overflowY: 'auto',
@@ -84,5 +59,4 @@ const BigModal = react_1.default.forwardRef((props, ref) => {
             transform: 'translate(-50%, -50%)',
         }, ...other, children: children })) : null;
 });
-exports.default = BigModal;
-//# sourceMappingURL=BigModal.js.map
+export default BigModal;

package/dist/components/Chart/BarChart.d.ts

@@ -0,0 +1,15 @@
+/// <reference types="react" />
+export default function BarChart({ colors, yAxisFields, data, containerStyle, xAxisField, xAxisFormat, theme, comparison, isStacked, isAnimationActive }: {
+    colors: string[];
+    yAxisFields: any[];
+    data: any[];
+    containerStyle?: React.CSSProperties;
+    xAxisField: string;
+    xAxisLabel: string;
+    xAxisFormat: string;
+    theme: any;
+    comparison: boolean;
+    isStacked: boolean;
+    isAnimationActive: boolean;
+}): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=BarChart.d.ts.map

package/dist/components/Chart/BarChart.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"BarChart.d.ts","sourceRoot":"","sources":["../../../src/components/Chart/BarChart.tsx"],"names":[],"mappings":";AAgBA,MAAM,CAAC,OAAO,UAAU,QAAQ,CAAC,EAC/B,MAAM,EACN,WAAW,EACX,IAAI,EACJ,cAAc,EACd,UAAU,EACV,WAAW,EACX,KAAK,EACL,UAAU,EACV,SAAS,EACT,iBAAwB,EACzB,EAAE;IACD,MAAM,EAAE,MAAM,EAAE,CAAC;IACjB,WAAW,EAAE,GAAG,EAAE,CAAC;IACnB,IAAI,EAAE,GAAG,EAAE,CAAC;IACZ,cAAc,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IACrC,UAAU,EAAE,MAAM,CAAC;IACnB,UAAU,EAAE,MAAM,CAAC;IACnB,WAAW,EAAE,MAAM,CAAC;IACpB,KAAK,EAAE,GAAG,CAAC;IACX,UAAU,EAAE,OAAO,CAAC;IACpB,SAAS,EAAE,OAAO,CAAC;IACnB,iBAAiB,EAAE,OAAO,CAAC;CAC5B,2CA6IA"}

package/dist/components/Chart/BarChart.js

@@ -0,0 +1,57 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+// @ts-nocheck
+import { CartesianGrid, ResponsiveContainer, Tooltip, XAxis, YAxis, Bar, BarChart as ReChartsBarChart, } from 'recharts';
+import { valueFormatter } from '../../utils/valueFormatter';
+import { axisFormatter } from '../../utils/axisFormatter';
+import { selectColor } from '../../utils/color';
+import ChartTooltip from '../../components/Chart/ChartTooltip';
+import getDomain from '../../utils/getDomain';
+export default function BarChart({ colors, yAxisFields, data, containerStyle, xAxisField, xAxisFormat, theme, comparison, isStacked, isAnimationActive = true }) {
+    if (!data || data.length === 0) {
+        return (_jsx("div", { style: {
+                display: 'flex',
+                flex: '1 0 auto',
+                height: '100%',
+                margin: 'auto',
+                justifyContent: 'center',
+                alignItems: 'center',
+                fontSize: 13,
+                color: theme.secondaryTextColor,
+            }, children: "No results found for specified time period." }));
+    }
+    return (_jsx("div", { style: {
+            ...containerStyle,
+            boxSizing: 'content-box',
+        }, children: _jsx(ResponsiveContainer, { width: "100%", height: '100%', children: _jsxs(ReChartsBarChart, { data: data, layout: 'horizontal', children: [_jsx(CartesianGrid, { strokeDasharray: "3 3", horizontal: true, vertical: false }), _jsx(YAxis, { width: 44, hide: false, axisLine: false, tickLine: false, type: "number", domain: getDomain(data, yAxisFields), tick: { transform: 'translate(-3, 0)' }, style: {
+                            fontSize: '12px',
+                            fontFamily: theme.chartLabelFontFamily,
+                        }, tickFormatter: (tick) => axisFormatter({
+                            value: tick,
+                            field: yAxisFields[0].field || 'what',
+                            fields: yAxisFields,
+                        }) }), _jsx(XAxis, { hide: false, dataKey: xAxisField, tick: { transform: 'translate(0, 6)' }, style: {
+                            fontSize: '12px',
+                            fontFamily: theme.chartLabelFontFamily,
+                            marginTop: '20px',
+                        }, tickLine: false, axisLine: false, tickFormatter: (tick) => axisFormatter({
+                            value: tick,
+                            field: xAxisField,
+                            fields: [{ field: xAxisField, format: xAxisFormat }],
+                        }) }), _jsx(Tooltip, { wrapperStyle: { outline: 'none', zIndex: 2 }, isAnimationActive: false, cursor: { fill: '#d1d5db', opacity: '0.15' }, content: ({ active, payload, label }) => {
+                            let label2;
+                            if (comparison &&
+                                payload?.length > 1 &&
+                                payload[0].payload[xAxisField + '2']) {
+                                label2 = payload[0].payload[xAxisField + '2'];
+                            }
+                            return (_jsx(ChartTooltip, { theme: theme, active: active, payload: payload, label: label, label2: label2, dateFormatter: (value) => valueFormatter({
+                                    value,
+                                    field: xAxisField,
+                                    fields: [{ field: xAxisField, format: xAxisFormat }],
+                                }), valueFormatter: (value) => valueFormatter({
+                                    value,
+                                    field: payload[0].dataKey,
+                                    fields: yAxisFields,
+                                }), xAxisFormat: xAxisFormat, xAxisField: xAxisField, colors: colors }));
+                        }, position: { y: 0 } }), yAxisFields.map((elem) => (_jsx(Bar, { name: elem.label, dataKey: elem.field, stackId: isStacked && (elem.field?.replace('comparison_', '') ?? "unknown"), type: "linear", fill: selectColor(elem, colors, yAxisFields.findIndex((field) => field.field === (elem.field?.replace('comparison_', '')))), isAnimationActive: isAnimationActive }, elem.field)))] }) }) }));
+}

package/dist/components/Chart/BarChart.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"BarChart.js","sourceRoot":"","sources":["../../../src/components/Chart/BarChart.tsx"],"names":[],"mappings":"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"}

package/dist/components/Chart/ChartTooltip.d.ts

@@ -0,0 +1,29 @@
+export interface ChartTooltipProps {
+    active: boolean | undefined;
+    payload: PayloadItem[];
+    label: string;
+    label2?: string;
+    colors: string[];
+    valueFormatter: any;
+    dateFormatter: any;
+    xAxisFormat: string;
+    xAxisField: string;
+    theme: any;
+}
+type PayloadItem = {
+    chartType: string | undefined;
+    color: string;
+    dataKey: string;
+    fill: string;
+    formatter: () => void;
+    name: string;
+    payload: {
+        [key: string]: any;
+    };
+    type: string;
+    unit: string;
+    value: any;
+};
+export default function ChartTooltip(props: ChartTooltipProps): import("react/jsx-runtime").JSX.Element | null;
+export {};
+//# sourceMappingURL=ChartTooltip.d.ts.map

package/dist/components/Chart/ChartTooltip.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ChartTooltip.d.ts","sourceRoot":"","sources":["../../../src/components/Chart/ChartTooltip.tsx"],"names":[],"mappings":"AAQA,MAAM,WAAW,iBAAiB;IAChC,MAAM,EAAE,OAAO,GAAG,SAAS,CAAC;IAC5B,OAAO,EAAE,WAAW,EAAE,CAAC;IACvB,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,MAAM,EAAE,MAAM,EAAE,CAAC;IACjB,cAAc,EAAE,GAAG,CAAC;IACpB,aAAa,EAAE,GAAG,CAAC;IACnB,WAAW,EAAE,MAAM,CAAC;IACpB,UAAU,EAAE,MAAM,CAAC;IACnB,KAAK,EAAE,GAAG,CAAC;CACZ;AAED,KAAK,WAAW,GAAG;IACjB,SAAS,EAAE,MAAM,GAAG,SAAS,CAAC;IAC9B,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,EAAE,MAAM,CAAC;IAChB,IAAI,EAAE,MAAM,CAAC;IACb,SAAS,EAAE,MAAM,IAAI,CAAC;IACtB,IAAI,EAAE,MAAM,CAAC;IACb,OAAO,EAAE;QAAE,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAA;KAAE,CAAC;IAChC,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,GAAG,CAAC;CACZ,CAAC;AAoUF,MAAM,CAAC,OAAO,UAAU,YAAY,CAAC,KAAK,EAAE,iBAAiB,kDAM5D"}

package/dist/components/Chart/ChartTooltip.js

@@ -0,0 +1,229 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { format, subDays } from 'date-fns';
+import ChartTooltipFrame from './ChartTooltipFrame';
+import ChartTooltipRow from './ChartTooltipRow';
+import { useComparisonRange, useDateFilter } from '../../Context';
+import ChartTooltipGroup from './ChartTooltipGroup';
+import { convertComparisonRange, isDateFormat } from '../../utils/dates';
+// The chart tooltip to display for primary labels (ie. not label2).
+const ChartTooltipPrimary = (props) => (_jsxs(ChartTooltipFrame, { theme: props.theme, children: [_jsx("div", { style: {
+                borderStyle: 'solid',
+                borderBottomColor: props.theme?.borderColor || '#E5E7EB',
+                background: props.theme?.backgroundColor || 'white',
+                borderTop: 'none',
+                borderLeft: 'none',
+                borderRight: 'none',
+                borderBottomWidth: 1,
+                display: 'flex',
+                flexDirection: 'column',
+                paddingLeft: '16px',
+                paddingRight: '16px',
+                paddingTop: '8px',
+                paddingBottom: '8px',
+            }, children: _jsx("p", { style: {
+                    textAlign: 'left',
+                    marginTop: 0,
+                    marginBottom: 0,
+                    fontFamily: props.theme?.fontFamily,
+                    color: props.theme?.primaryTextColor,
+                    fontSize: props.theme?.fontSizeSmall || '14px',
+                    fontWeight: props.theme?.boldFontWeight || '500',
+                    paddingTop: 2,
+                    paddingBottom: 2,
+                }, children: !isNaN(new Date(props.label)) && props.dateFormatter
+                    ? props.dateFormatter(props.label)
+                    : !isNaN(new Date(props.label))
+                        ? format(new Date(props.label), 'MMM yyyy')
+                        : props.label }) }), _jsx("div", { style: {
+                paddingRight: '16px',
+                paddingLeft: '16px',
+                paddingTop: '8px',
+                paddingBottom: '8px',
+            }, children: props.payload.map(({ color, value, name }, idx) => (_jsx(ChartTooltipRow, { value: props.valueFormatter(value), name: name, color: color, theme: props.theme }, `id-${idx}`))) })] }));
+// The chart tooltip to display for secondary labels (ie. label2).
+const ChartTooltipSecondary = (props) => (_jsx(ChartTooltipFrame, { theme: props.theme, children: props.payload.map(({ color, value, name }, idx) => (_jsxs(_Fragment, { children: [idx === 0 && (_jsx("div", { style: {
+                    borderStyle: 'solid',
+                    borderBottomColor: props.theme?.borderColor || '#E5E7EB',
+                    background: props.theme?.backgroundColor || 'white',
+                    borderTop: 'none',
+                    borderLeft: 'none',
+                    borderRight: 'none',
+                    borderBottomWidth: 1,
+                    display: 'flex',
+                    flexDirection: 'column',
+                    paddingLeft: '16px',
+                    paddingRight: '16px',
+                    paddingTop: '8px',
+                    paddingBottom: '8px',
+                }, children: _jsx("p", { style: {
+                        textAlign: 'left',
+                        marginTop: 0,
+                        marginBottom: 0,
+                        fontFamily: props.theme?.fontFamily,
+                        color: props.theme?.primaryTextColor,
+                        fontSize: props.theme?.fontSizeSmall || '14px',
+                        fontWeight: props.theme?.boldFontWeight || '500',
+                        paddingTop: 2,
+                        paddingBottom: 2,
+                    }, children: name }) })), _jsx("div", { style: {
+                    paddingRight: '16px',
+                    paddingLeft: '16px',
+                    paddingBottom: '8px',
+                    ...(idx === 0 && { paddingTop: '8px' }),
+                }, children: _jsx(ChartTooltipRow, { name: props.valueFormatter(value), value: !isNaN(new Date(idx === 0 ? props.label : props.label2)) &&
+                        props.dateFormatter
+                        ? props.dateFormatter(idx === 0 ? props.label : props.label2)
+                        : !isNaN(new Date(idx === 0 ? props.label : props.label2))
+                            ? format(new Date(idx === 0 ? props.label : props.label2), 'MMM yyyy')
+                            : idx === 0
+                                ? props.label
+                                : props.label2, color: color, theme: props.theme }, `id-${idx}`) })] }))) }));
+const LABEL_TO_DAYS = {
+    'This week': 7,
+    'This month': 30,
+    'This year': 365,
+    'Last 7 days': 7,
+    'Last 30 days': 30,
+    'Last 90 days': 90,
+    'Last 6 months': 180,
+    'All time': 0,
+};
+/**
+ * Transforms a list of payload items where some payload items have a dataKey
+ * prefixed with "comparison_" into an object where the keys are the grouped
+ * data keys (ie. "Fuel" and "comparison_Fuel" both map to the key "Fuel") and
+ * the values are a list of chart tooltip row items for that key.
+ *
+ * For example:
+ * [
+ *   { dataKey: "Fuel", value: 178 }
+ *   { dataKey: "Food", value: 58 }
+ *   { dataKey: "comparison_Fuel", value: 145 }
+ *   { dataKey: "comparison_Food", value: 72 }
+ * ]
+ *
+ * transforms into this
+ * {
+ *   "Fuel": [
+ *     { color: "blue", value: 178, name: "Last 6 months" }
+ *     { color: "blue", value: 145, name: "Previous Period" }
+ *   ]
+ *   "Food": [
+ *     { color: "red", value: 58, name: "Last 6 months" }
+ *     { color: "red", value: 72, name: "Previous Period" }
+ *   ]
+ * }
+ */
+function reformatComparisonPayload(props, primaryLabel, comparisonLabel) {
+    const columnsByKey = {};
+    const isDateXAxis = isDateFormat(props.xAxisFormat);
+    // When there is exactly one pair of entries for a comparison, we don't group
+    // them by section, and we flip things around so the label goes on top and the
+    // name of each colored tag is the date if the xAxis is a date format.
+    if (props.payload.length <= 2 && isDateXAxis) {
+        for (const item of props.payload) {
+            const isComparison = item.dataKey.includes('comparison_');
+            const nameKey = isComparison
+                ? `comparison_${props.xAxisField}`
+                : props.xAxisField;
+            const days = LABEL_TO_DAYS[primaryLabel] ?? 0;
+            const primaryDate = item.payload[props.xAxisField] ?? 0;
+            const compDate = subDays(new Date(primaryDate), days + 1);
+            const date = item.payload[nameKey] ?? format(compDate, props.xAxisFormat);
+            const name = props.dateFormatter(date);
+            const color = item.color;
+            const value = props.valueFormatter(item.value);
+            if (!columnsByKey['']) {
+                columnsByKey[''] = [];
+            }
+            columnsByKey[''].push({ color, name, value });
+        }
+        return columnsByKey;
+    }
+    // When there are more than one pair of entries in payload, we group them
+    // by the dataKey and use that key as the key in our map.
+    for (const item of props.payload) {
+        const key = item.dataKey.replace('comparison_', '');
+        const isComparison = item.dataKey.includes('comparison_');
+        const name = isComparison ? comparisonLabel : primaryLabel;
+        const color = item.color;
+        const value = props.valueFormatter(item.value);
+        if (!columnsByKey[key]) {
+            columnsByKey[key] = [];
+        }
+        columnsByKey[key].push({ color, name, value });
+    }
+    return columnsByKey;
+}
+/**
+ * Returns the label for the chart tooltip.
+ */
+function getTooltipLabel(props, altTooltipLabel, isDateXAxis) {
+    // TODO: clean me
+    return props.payload.length <= 2 && altTooltipLabel && isDateXAxis
+        ? !isNaN(new Date(altTooltipLabel)) && props.dateFormatter
+            ? props.dateFormatter(altTooltipLabel)
+            : !isNaN(new Date(altTooltipLabel))
+                ? format(new Date(altTooltipLabel), 'MMM yyyy')
+                : altTooltipLabel
+        : !isNaN(new Date(props.label)) && props.dateFormatter
+            ? props.dateFormatter(props.label)
+            : !isNaN(new Date(props.label))
+                ? format(new Date(props.label), 'MMM yyyy')
+                : props.label;
+}
+// The chart tooltip to display for comparison labels (eg. "previous period").
+function ChartTooltipComparison(props) {
+    const { comparisonRange } = useComparisonRange();
+    const { dateFilter } = useDateFilter();
+    const isDateXAxis = isDateFormat(props.xAxisFormat);
+    const altTooltipLabel = props.payload[0]?.dataKey
+        .replace('comparison_', '')
+        .replaceAll('_', ' ')
+        .toLowerCase();
+    const newRows = reformatComparisonPayload(props, dateFilter, convertComparisonRange(dateFilter, comparisonRange.text));
+    return (_jsxs(ChartTooltipFrame, { theme: props.theme, children: [_jsx("div", { style: {
+                    borderStyle: 'solid',
+                    borderBottomColor: props.theme?.borderColor || '#E5E7EB',
+                    background: props.theme?.backgroundColor || 'white',
+                    borderTop: 'none',
+                    borderLeft: 'none',
+                    borderRight: 'none',
+                    borderBottomWidth: 1,
+                    display: 'flex',
+                    flexDirection: 'column',
+                    paddingLeft: '16px',
+                    paddingRight: '16px',
+                    paddingTop: '8px',
+                    paddingBottom: '8px',
+                }, children: _jsx("p", { style: {
+                        textAlign: 'left',
+                        marginTop: 0,
+                        marginBottom: 0,
+                        fontFamily: props.theme?.fontFamily,
+                        color: props.theme?.primaryTextColor,
+                        fontSize: props.theme?.fontSizeSmall || '14px',
+                        fontWeight: props.theme?.boldFontWeight || '500',
+                        textTransform: 'capitalize',
+                        paddingTop: 2,
+                        paddingBottom: 2,
+                    }, children: getTooltipLabel(props, altTooltipLabel ?? "", isDateXAxis) }) }), _jsx("div", { style: {
+                    paddingRight: '16px',
+                    paddingLeft: '16px',
+                    paddingTop: '8px',
+                    paddingBottom: '8px',
+                    display: 'flex',
+                    flexDirection: 'column',
+                    gap: 4,
+                }, children: Object.entries(newRows).map(([key, value], index) => (_jsx(ChartTooltipGroup, { name: key, items: value, theme: props.theme }, `id_${index}`))) })] }));
+}
+export default function ChartTooltip(props) {
+    const { comparisonRange } = useComparisonRange();
+    if (!props.active || !props.payload)
+        return null;
+    if (comparisonRange)
+        return _jsx(ChartTooltipComparison, { ...props });
+    if (props.label2)
+        return _jsx(ChartTooltipSecondary, { ...props });
+    return _jsx(ChartTooltipPrimary, { ...props });
+}

package/dist/components/Chart/ChartTooltip.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ChartTooltip.js","sourceRoot":"","sources":["../../../src/components/Chart/ChartTooltip.tsx"],"names":[],"mappings":"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"}

package/dist/components/Chart/ChartTooltipFrame.d.ts

@@ -0,0 +1,6 @@
+/// <reference types="react" />
+export default function ChartTooltipFrame({ children, theme, }: {
+    children: React.ReactNode;
+    theme: any;
+}): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=ChartTooltipFrame.d.ts.map

package/dist/components/Chart/ChartTooltipFrame.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ChartTooltipFrame.d.ts","sourceRoot":"","sources":["../../../src/components/Chart/ChartTooltipFrame.tsx"],"names":[],"mappings":";AAAA,MAAM,CAAC,OAAO,UAAU,iBAAiB,CAAC,EACxC,QAAQ,EACR,KAAK,GACN,EAAE;IACD,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,KAAK,EAAE,GAAG,CAAC;CACZ,2CAiBA"}

package/dist/components/Chart/ChartTooltipFrame.js

@@ -0,0 +1,12 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+export default function ChartTooltipFrame({ children, theme, }) {
+    return (_jsx("div", { style: {
+            borderStyle: 'solid',
+            borderColor: theme?.borderColor || '#E5E7EB',
+            overflow: 'hidden',
+            borderWidth: 1,
+            background: theme?.backgroundColor || '#ffffff',
+            borderRadius: '6px',
+            boxShadow: '0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05)',
+        }, children: children }));
+}

package/dist/components/Chart/ChartTooltipFrame.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ChartTooltipFrame.js","sourceRoot":"","sources":["../../../src/components/Chart/ChartTooltipFrame.tsx"],"names":[],"mappings":";;;AAAA,SAAwB,iBAAiB,CAAC,EACxC,QAAQ,EACR,KAAK,GAIN;IACC,OAAO,CACL,gCACE,KAAK,EAAE;YACL,WAAW,EAAE,OAAO;YACpB,WAAW,EAAE,KAAK,EAAE,WAAW,IAAI,SAAS;YAC5C,QAAQ,EAAE,QAAQ;YAClB,WAAW,EAAE,CAAC;YACd,UAAU,EAAE,KAAK,EAAE,eAAe,IAAI,SAAS;YAC/C,YAAY,EAAE,KAAK;YACnB,SAAS,EACP,yEAAyE;SAC5E,YAEA,QAAQ,GACL,CACP,CAAC;AACJ,CAAC;AAvBD,oCAuBC"}

package/dist/components/Chart/ChartTooltipGroup.d.ts

@@ -0,0 +1,11 @@
+export interface ChartTooltipGroupProps {
+    name: string;
+    items: {
+        color: string;
+        name: string;
+        value: any;
+    }[];
+    theme: any;
+}
+export default function ChartTooltipGroup({ name, items, theme, }: ChartTooltipGroupProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=ChartTooltipGroup.d.ts.map

package/dist/components/Chart/ChartTooltipGroup.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ChartTooltipGroup.d.ts","sourceRoot":"","sources":["../../../src/components/Chart/ChartTooltipGroup.tsx"],"names":[],"mappings":"AAEA,MAAM,WAAW,sBAAsB;IACrC,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,IAAI,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,GAAG,CAAA;KAAE,EAAE,CAAC;IACrD,KAAK,EAAE,GAAG,CAAC;CACZ;AAED,MAAM,CAAC,OAAO,UAAU,iBAAiB,CAAC,EACxC,IAAI,EACJ,KAAK,EACL,KAAK,GACN,EAAE,sBAAsB,2CAuCxB"}

package/dist/components/Chart/ChartTooltipGroup.js

@@ -0,0 +1,23 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import ChartTooltipRow from './ChartTooltipRow';
+export default function ChartTooltipGroup({ name, items, theme, }) {
+    return (_jsxs("div", { style: {
+            display: 'flex',
+            flexDirection: 'column',
+            width: '100%',
+            paddingTop: 2,
+            paddingBottom: 2,
+            marginRight: '24px',
+        }, children: [_jsx("p", { style: {
+                    textAlign: 'left',
+                    marginTop: 0,
+                    marginBottom: 0,
+                    fontFamily: theme?.fontFamily,
+                    color: theme?.primaryTextColor,
+                    fontSize: theme?.fontSizeSmall || '14px',
+                    fontWeight: theme?.boldFontWeight || '500',
+                    paddingTop: 2,
+                    paddingBottom: 2,
+                    textTransform: 'capitalize',
+                }, children: name.replaceAll('_', ' ').toLowerCase() }), items.map(({ color, value, name }, idx) => (_jsx(ChartTooltipRow, { value: value, name: name, color: color, theme: theme }, `id-${idx}`)))] }));
+}

package/dist/components/Chart/ChartTooltipGroup.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ChartTooltipGroup.js","sourceRoot":"","sources":["../../../src/components/Chart/ChartTooltipGroup.tsx"],"names":[],"mappings":";;;;;;AAAA,wEAAgD;AAQhD,SAAwB,iBAAiB,CAAC,EACxC,IAAI,EACJ,KAAK,EACL,KAAK,GACkB;IACvB,OAAO,CACL,iCACE,KAAK,EAAE;YACL,OAAO,EAAE,MAAM;YACf,aAAa,EAAE,QAAQ;YACvB,KAAK,EAAE,MAAM;YACb,UAAU,EAAE,CAAC;YACb,aAAa,EAAE,CAAC;YAChB,WAAW,EAAE,MAAM;SACpB,aAED,8BACE,KAAK,EAAE;oBACL,SAAS,EAAE,MAAM;oBACjB,SAAS,EAAE,CAAC;oBACZ,YAAY,EAAE,CAAC;oBACf,UAAU,EAAE,KAAK,EAAE,UAAU;oBAC7B,KAAK,EAAE,KAAK,EAAE,gBAAgB;oBAC9B,QAAQ,EAAE,KAAK,EAAE,aAAa,IAAI,MAAM;oBACxC,UAAU,EAAE,KAAK,EAAE,cAAc,IAAI,KAAK;oBAC1C,UAAU,EAAE,CAAC;oBACb,aAAa,EAAE,CAAC;oBAChB,aAAa,EAAE,YAAY;iBAC5B,YAEA,IAAI,CAAC,UAAU,CAAC,GAAG,EAAE,GAAG,CAAC,CAAC,WAAW,EAAE,GACtC,EACH,KAAK,CAAC,GAAG,CAAC,CAAC,EAAE,KAAK,EAAE,KAAK,EAAE,IAAI,EAAE,EAAE,GAAW,EAAE,EAAE,CAAC,CAClD,uBAAC,yBAAe,IAEd,KAAK,EAAE,KAAK,EACZ,IAAI,EAAE,IAAI,EACV,KAAK,EAAE,KAAK,EACZ,KAAK,EAAE,KAAK,IAJP,MAAM,GAAG,EAAE,CAKhB,CACH,CAAC,IACE,CACP,CAAC;AACJ,CAAC;AA3CD,oCA2CC"}

package/dist/components/Chart/ChartTooltipRow.d.ts

@@ -0,0 +1,8 @@
+export interface ChartTooltipRowProps {
+    value: string;
+    name: string;
+    color: string;
+    theme: any;
+}
+export default function ChartTooltipRow({ value, name, color, theme, }: ChartTooltipRowProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=ChartTooltipRow.d.ts.map

package/dist/components/Chart/ChartTooltipRow.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ChartTooltipRow.d.ts","sourceRoot":"","sources":["../../../src/components/Chart/ChartTooltipRow.tsx"],"names":[],"mappings":"AAAA,MAAM,WAAW,oBAAoB;IACnC,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,GAAG,CAAC;CACZ;AAED,MAAM,CAAC,OAAO,UAAU,eAAe,CAAC,EACtC,KAAK,EACL,IAAI,EACJ,KAAK,EACL,KAAK,GACN,EAAE,oBAAoB,2CA2DtB"}

package/dist/components/Chart/ChartTooltipRow.js

@@ -0,0 +1,41 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+export default function ChartTooltipRow({ value, name, color, theme, }) {
+    return (_jsxs("div", { style: {
+            marginRight: '24px',
+            display: 'flex',
+            alignItems: 'center',
+            justifyContent: 'space-between',
+            width: '100%',
+            paddingTop: 2,
+            paddingBottom: 2,
+        }, children: [_jsxs("div", { style: { display: 'flex', alignItems: 'center' }, children: [_jsx("span", { style: {
+                            background: color,
+                            borderWidth: 2,
+                            borderStyle: 'solid',
+                            borderColor: 'white',
+                            boxShadow: '0 1px 2px 0 rgba(0, 0, 0, 0.05)',
+                            height: '12px',
+                            width: '12px',
+                            borderRadius: 100,
+                            marginRight: 6,
+                            boxSizing: 'border-box',
+                        } }), _jsx("p", { style: {
+                            marginTop: 0,
+                            marginBottom: 0,
+                            fontFamily: theme?.fontFamily,
+                            color: theme?.primaryTextColor,
+                            fontSize: theme?.fontSizeSmall || '14px',
+                            fontWeight: theme?.fontWeightMedium || '500',
+                        }, children: value })] }), _jsx("p", { style: {
+                    marginTop: 0,
+                    marginBottom: 0,
+                    fontFamily: theme?.fontFamily,
+                    color: theme?.secondaryTextColor,
+                    textAlign: 'right',
+                    whiteSpace: 'nowrap',
+                    overflow: 'hidden',
+                    textOverflow: 'ellipsis',
+                    fontSize: theme?.fontSizeSmall || '14px',
+                    fontWeight: theme?.fontWeightNormal || '400',
+                }, children: name })] }));
+}

package/dist/components/Chart/ChartTooltipRow.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ChartTooltipRow.js","sourceRoot":"","sources":["../../../src/components/Chart/ChartTooltipRow.tsx"],"names":[],"mappings":";;;AAOA,SAAwB,eAAe,CAAC,EACtC,KAAK,EACL,IAAI,EACJ,KAAK,EACL,KAAK,GACgB;IACrB,OAAO,CACL,iCACE,KAAK,EAAE;YACL,WAAW,EAAE,MAAM;YACnB,OAAO,EAAE,MAAM;YACf,UAAU,EAAE,QAAQ;YACpB,cAAc,EAAE,eAAe;YAC/B,KAAK,EAAE,MAAM;YACb,UAAU,EAAE,CAAC;YACb,aAAa,EAAE,CAAC;SACjB,aAED,iCAAK,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,UAAU,EAAE,QAAQ,EAAE,aACnD,iCACE,KAAK,EAAE;4BACL,UAAU,EAAE,KAAK;4BACjB,WAAW,EAAE,CAAC;4BACd,WAAW,EAAE,OAAO;4BACpB,WAAW,EAAE,OAAO;4BACpB,SAAS,EAAE,iCAAiC;4BAC5C,MAAM,EAAE,MAAM;4BACd,KAAK,EAAE,MAAM;4BACb,YAAY,EAAE,GAAG;4BACjB,WAAW,EAAE,CAAC;4BACd,SAAS,EAAE,YAAY;yBACxB,GACD,EACF,8BACE,KAAK,EAAE;4BACL,SAAS,EAAE,CAAC;4BACZ,YAAY,EAAE,CAAC;4BACf,UAAU,EAAE,KAAK,EAAE,UAAU;4BAC7B,KAAK,EAAE,KAAK,EAAE,gBAAgB;4BAC9B,QAAQ,EAAE,KAAK,EAAE,aAAa,IAAI,MAAM;4BACxC,UAAU,EAAE,KAAK,EAAE,gBAAgB,IAAI,KAAK;yBAC7C,YAEA,KAAK,GACJ,IACA,EACN,8BACE,KAAK,EAAE;oBACL,SAAS,EAAE,CAAC;oBACZ,YAAY,EAAE,CAAC;oBACf,UAAU,EAAE,KAAK,EAAE,UAAU;oBAC7B,KAAK,EAAE,KAAK,EAAE,kBAAkB;oBAChC,SAAS,EAAE,OAAO;oBAClB,UAAU,EAAE,QAAQ;oBACpB,QAAQ,EAAE,QAAQ;oBAClB,YAAY,EAAE,UAAU;oBACxB,QAAQ,EAAE,KAAK,EAAE,aAAa,IAAI,MAAM;oBACxC,UAAU,EAAE,KAAK,EAAE,gBAAgB,IAAI,KAAK;iBAC7C,YAEA,IAAI,GACH,IACA,CACP,CAAC;AACJ,CAAC;AAhED,kCAgEC"}