@quillsql/react 2.10.30 → 2.10.31

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

@@ -1,235 +0,0 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-const jsx_runtime_1 = require("react/jsx-runtime");
-const date_fns_1 = require("date-fns");
-const ChartTooltipFrame_1 = __importDefault(require("./ChartTooltipFrame"));
-const ChartTooltipRow_1 = __importDefault(require("./ChartTooltipRow"));
-const Context_1 = require("../../Context");
-const ChartTooltipGroup_1 = __importDefault(require("./ChartTooltipGroup"));
-const dates_1 = require("../../utils/dates");
-// The chart tooltip to display for primary labels (ie. not label2).
-const ChartTooltipPrimary = (props) => ((0, jsx_runtime_1.jsxs)(ChartTooltipFrame_1.default, { theme: props.theme, children: [(0, jsx_runtime_1.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: (0, jsx_runtime_1.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))
-                        ? (0, date_fns_1.format)(new Date(props.label), 'MMM yyyy')
-                        : props.label }) }), (0, jsx_runtime_1.jsx)("div", { style: {
-                paddingRight: '16px',
-                paddingLeft: '16px',
-                paddingTop: '8px',
-                paddingBottom: '8px',
-            }, children: props.payload.map(({ color, value, name }, idx) => ((0, jsx_runtime_1.jsx)(ChartTooltipRow_1.default, { 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) => ((0, jsx_runtime_1.jsx)(ChartTooltipFrame_1.default, { theme: props.theme, children: props.payload.map(({ color, value, name }, idx) => ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [idx === 0 && ((0, jsx_runtime_1.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: (0, jsx_runtime_1.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 }) })), (0, jsx_runtime_1.jsx)("div", { style: {
-                    paddingRight: '16px',
-                    paddingLeft: '16px',
-                    paddingBottom: '8px',
-                    ...(idx === 0 && { paddingTop: '8px' }),
-                }, children: (0, jsx_runtime_1.jsx)(ChartTooltipRow_1.default, { 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))
-                            ? (0, date_fns_1.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 = (0, dates_1.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 = (0, date_fns_1.subDays)(new Date(primaryDate), days + 1);
-            const date = item.payload[nameKey] ?? (0, date_fns_1.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))
-                ? (0, date_fns_1.format)(new Date(altTooltipLabel), 'MMM yyyy')
-                : altTooltipLabel
-        : !isNaN(new Date(props.label)) && props.dateFormatter
-            ? props.dateFormatter(props.label)
-            : !isNaN(new Date(props.label))
-                ? (0, date_fns_1.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 } = (0, Context_1.useComparisonRange)();
-    const { dateFilter } = (0, Context_1.useDateFilter)();
-    const isDateXAxis = (0, dates_1.isDateFormat)(props.xAxisFormat);
-    const altTooltipLabel = props.payload[0]?.dataKey
-        .replace('comparison_', '')
-        .replaceAll('_', ' ')
-        .toLowerCase();
-    const newRows = reformatComparisonPayload(props, dateFilter, (0, dates_1.convertComparisonRange)(dateFilter, comparisonRange.text));
-    return ((0, jsx_runtime_1.jsxs)(ChartTooltipFrame_1.default, { theme: props.theme, children: [(0, jsx_runtime_1.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: (0, jsx_runtime_1.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) }) }), (0, jsx_runtime_1.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) => ((0, jsx_runtime_1.jsx)(ChartTooltipGroup_1.default, { name: key, items: value, theme: props.theme }, `id_${index}`))) })] }));
-}
-function ChartTooltip(props) {
-    const { comparisonRange } = (0, Context_1.useComparisonRange)();
-    if (!props.active || !props.payload)
-        return null;
-    if (comparisonRange)
-        return (0, jsx_runtime_1.jsx)(ChartTooltipComparison, { ...props });
-    if (props.label2)
-        return (0, jsx_runtime_1.jsx)(ChartTooltipSecondary, { ...props });
-    return (0, jsx_runtime_1.jsx)(ChartTooltipPrimary, { ...props });
-}
-exports.default = ChartTooltip;

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

@@ -1,6 +0,0 @@
-/// <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/cjs/components/Chart/ChartTooltipFrame.d.ts.map

@@ -1 +0,0 @@
-{"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,2CAkBA"}

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

@@ -1,16 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-const jsx_runtime_1 = require("react/jsx-runtime");
-function ChartTooltipFrame({ children, theme, }) {
-    return ((0, jsx_runtime_1.jsx)("div", { style: {
-            borderStyle: 'solid',
-            borderColor: theme?.borderColor || '#E5E7EB',
-            overflow: 'hidden',
-            borderWidth: 1,
-            background: theme?.backgroundColor || '#ffffff',
-            borderRadius: '6px',
-            zIndex: 40,
-            boxShadow: '0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05)',
-        }, children: children }));
-}
-exports.default = ChartTooltipFrame;

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

@@ -1,11 +0,0 @@
-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/cjs/components/Chart/ChartTooltipGroup.d.ts.map

@@ -1 +0,0 @@
-{"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/cjs/components/Chart/ChartTooltipGroup.js

@@ -1,29 +0,0 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-const jsx_runtime_1 = require("react/jsx-runtime");
-const ChartTooltipRow_1 = __importDefault(require("./ChartTooltipRow"));
-function ChartTooltipGroup({ name, items, theme, }) {
-    return ((0, jsx_runtime_1.jsxs)("div", { style: {
-            display: 'flex',
-            flexDirection: 'column',
-            width: '100%',
-            paddingTop: 2,
-            paddingBottom: 2,
-            marginRight: '24px',
-        }, children: [(0, jsx_runtime_1.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) => ((0, jsx_runtime_1.jsx)(ChartTooltipRow_1.default, { value: value, name: name, color: color, theme: theme }, `id-${idx}`)))] }));
-}
-exports.default = ChartTooltipGroup;

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

@@ -1,8 +0,0 @@
-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/cjs/components/Chart/ChartTooltipRow.d.ts.map

@@ -1 +0,0 @@
-{"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/cjs/components/Chart/ChartTooltipRow.js

@@ -1,44 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-const jsx_runtime_1 = require("react/jsx-runtime");
-function ChartTooltipRow({ value, name, color, theme, }) {
-    return ((0, jsx_runtime_1.jsxs)("div", { style: {
-            marginRight: '24px',
-            display: 'flex',
-            alignItems: 'center',
-            justifyContent: 'space-between',
-            width: '100%',
-            paddingTop: 2,
-            paddingBottom: 2,
-        }, children: [(0, jsx_runtime_1.jsxs)("div", { style: { display: 'flex', alignItems: 'center' }, children: [(0, jsx_runtime_1.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',
-                        } }), (0, jsx_runtime_1.jsx)("p", { style: {
-                            marginTop: 0,
-                            marginBottom: 0,
-                            fontFamily: theme?.fontFamily,
-                            color: theme?.primaryTextColor,
-                            fontSize: theme?.fontSizeSmall || '14px',
-                            fontWeight: theme?.fontWeightMedium || '500',
-                        }, children: value })] }), (0, jsx_runtime_1.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 })] }));
-}
-exports.default = ChartTooltipRow;

package/dist/cjs/components/Chart/LineChart.d.ts

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

package/dist/cjs/components/Chart/LineChart.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"LineChart.d.ts","sourceRoot":"","sources":["../../../../src/components/Chart/LineChart.tsx"],"names":[],"mappings":";AAiBA,MAAM,CAAC,OAAO,UAAU,SAAS,CAAC,EAChC,MAAM,EACN,WAAW,EACX,IAAI,EACJ,cAAc,EACd,UAAU,EACV,WAAW,EACX,KAAK,EACL,UAAU,EACV,iBAAwB,EACxB,SAAiB,EACjB,SAAiB,EACjB,iBAAyB,GAC1B,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,iBAAiB,EAAE,OAAO,CAAC;IAC3B,SAAS,EAAE,OAAO,CAAC;IACnB,SAAS,EAAE,OAAO,CAAC;IACnB,iBAAiB,EAAE,OAAO,CAAC;CAC5B,kDAoMA"}

package/dist/cjs/components/Chart/LineChart.js

@@ -1,97 +0,0 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-const jsx_runtime_1 = require("react/jsx-runtime");
-// @ts-nocheck
-const recharts_1 = require("recharts");
-const valueFormatter_1 = require("../../utils/valueFormatter");
-const axisFormatter_1 = require("../../utils/axisFormatter");
-const color_1 = require("../../utils/color");
-const ChartTooltip_1 = __importDefault(require("../../components/Chart/ChartTooltip"));
-const getDomain_1 = __importDefault(require("../../utils/getDomain"));
-const react_1 = require("react");
-function LineChart({ colors, yAxisFields, data, containerStyle, xAxisField, xAxisFormat, theme, comparison, isAnimationActive = true, hideXAxis = false, hideYAxis = false, hideCartesianGrid = false, }) {
-    const [formattedData, setFormattedData] = (0, react_1.useState)([]);
-    if (!yAxisFields || !yAxisFields.length) {
-        return null;
-    }
-    (0, react_1.useEffect)(() => {
-        if (!data || data.length === 0) {
-            return;
-        }
-        if (typeof data[0][xAxisField] === 'object') {
-            const curData = data.map((d) => {
-                const formatted = { ...d };
-                // NEED TO FORMAT FOR BIG QUERY
-                if (d[xAxisField] && typeof d[xAxisField] === 'object') {
-                    formatted[xAxisField] = d[xAxisField].value;
-                }
-                return formatted;
-            });
-            setFormattedData(curData);
-        }
-        else {
-            setFormattedData(data);
-        }
-    }, [data]);
-    if (!data || data.length === 0) {
-        return ((0, jsx_runtime_1.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 ((0, jsx_runtime_1.jsx)("div", { style: { ...containerStyle }, children: (0, jsx_runtime_1.jsx)(recharts_1.ResponsiveContainer, { width: "100%", height: '100%', children: (0, jsx_runtime_1.jsxs)(recharts_1.ComposedChart, { data: formattedData, children: [!hideCartesianGrid && ((0, jsx_runtime_1.jsx)(recharts_1.CartesianGrid, { horizontal: true, vertical: false, stroke: "#e5e7eb" })), (0, jsx_runtime_1.jsx)(recharts_1.XAxis, { dataKey: xAxisField, hide: hideXAxis, tick: { transform: 'translate(0, 6)' }, style: {
-                            fontSize: '12px',
-                            fontFamily: theme?.chartLabelFontFamily ||
-                                theme?.fontFamily ||
-                                'Inter; Helvetica',
-                            color: theme?.chartLabelColor || '#666666',
-                        }, interval: "preserveStartEnd", tickLine: false, axisLine: false, padding: { left: 10, right: 10 }, minTickGap: 5, tickFormatter: (tick) => {
-                            return (0, axisFormatter_1.axisFormatter)({
-                                value: tick,
-                                field: xAxisField,
-                                fields: [{ field: xAxisField, format: xAxisFormat }],
-                            });
-                        } }), (0, jsx_runtime_1.jsx)(recharts_1.YAxis, { hide: hideYAxis, width: 44, axisLine: false, tickLine: false, type: "number", domain: (0, getDomain_1.default)(data, yAxisFields), tick: { transform: 'translate(-3, 0)' }, style: {
-                            fontSize: '12px',
-                            fontFamily: theme?.chartLabelFontFamily ||
-                                theme?.fontFamily ||
-                                'Inter; Helvetica',
-                            color: theme?.chartLabelColor || '#666666',
-                        }, tickFormatter: (value) => (0, axisFormatter_1.axisFormatter)({
-                            value,
-                            field: yAxisFields[0].field,
-                            fields: [
-                                ...yAxisFields,
-                                { field: xAxisField, format: xAxisFormat },
-                            ],
-                        }) }), (0, jsx_runtime_1.jsx)(recharts_1.Tooltip, { wrapperStyle: { outline: 'none' }, isAnimationActive: false, cursor: { stroke: '#d1d5db', strokeWidth: 1 }, content: ({ active, payload, label }) => {
-                            let label2;
-                            if (comparison &&
-                                payload?.length > 1 &&
-                                payload[0].payload[xAxisField + '2']) {
-                                label2 = payload[0].payload[xAxisField + '2'];
-                            }
-                            return ((0, jsx_runtime_1.jsx)(ChartTooltip_1.default, { active: active, payload: payload, label: label, label2: label2, dateFormatter: (value) => (0, valueFormatter_1.valueFormatter)({
-                                    value,
-                                    field: xAxisField,
-                                    fields: [{ field: xAxisField, format: xAxisFormat }],
-                                }), valueFormatter: (value) => (0, valueFormatter_1.valueFormatter)({
-                                    value,
-                                    field: payload[0].dataKey,
-                                    fields: [
-                                        ...yAxisFields,
-                                        { field: xAxisField, format: xAxisFormat },
-                                    ],
-                                }), xAxisFormat: xAxisFormat, xAxisField: xAxisField, colors: colors, theme: theme }));
-                        }, position: { y: 0 } }), yAxisFields.map((elem, index) => ((0, jsx_runtime_1.jsx)("defs", { children: (0, jsx_runtime_1.jsxs)("linearGradient", { id: `gradient${index}`, x1: "0", y1: "0", x2: "0", y2: "1", children: [(0, jsx_runtime_1.jsx)("stop", { offset: "5%", stopColor: (0, color_1.selectColor)(elem, colors, index), stopOpacity: 0.4 }), (0, jsx_runtime_1.jsx)("stop", { offset: "95%", stopColor: 'rgba(0,0,0,0)', stopOpacity: 0 })] }) }, `defs${elem.field + index}`))), yAxisFields.map((elem, index) => ((0, jsx_runtime_1.jsx)(recharts_1.Area, { name: elem.label, type: "linear", dataKey: elem.field, stroke: (0, color_1.selectColor)(elem, colors, index), fill: `url(#gradient${index})`, strokeWidth: 2, dot: false, isAnimationActive: isAnimationActive }, elem.field)))] }) }) }));
-}
-exports.default = LineChart;

package/dist/cjs/components/Dashboard/ChartComponent.d.ts

@@ -1,3 +0,0 @@
-/// <reference types="react" />
-export default function DashboardItem({ dashboardItem, onClickDashboardItem, theme, style, children, }: any): JSX.Element;
-//# sourceMappingURL=ChartComponent.d.ts.map

package/dist/cjs/components/Dashboard/ChartComponent.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"ChartComponent.d.ts","sourceRoot":"","sources":["../../../../src/components/Dashboard/ChartComponent.tsx"],"names":[],"mappings":";AAAA,MAAM,CAAC,OAAO,UAAU,aAAa,CAAC,EACpC,aAAa,EACb,oBAAoB,EACpB,KAAK,EACL,KAAK,EACL,QAAQ,GACT,EAAE,GAAG,GAAG,GAAG,CAAC,OAAO,CAqGnB"}

package/dist/cjs/components/Dashboard/ChartComponent.js

@@ -1,64 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-const jsx_runtime_1 = require("react/jsx-runtime");
-function DashboardItem({ dashboardItem, onClickDashboardItem, theme, style, children, }) {
-    return ((0, jsx_runtime_1.jsx)("div", { onClick: onClickDashboardItem
-            ? () => onClickDashboardItem(dashboardItem)
-            : () => { }, style: {
-            // height: '100%',
-            cursor: 'pointer',
-            boxSizing: 'content-box',
-            paddingRight: 25,
-            minHeight: 400,
-            borderRadius: 8,
-            paddingTop: 20,
-            ...style,
-        }, children: (0, jsx_runtime_1.jsx)("div", { style: {
-                width: '100%',
-                height: '100%',
-                boxSizing: 'content-box',
-            }, children: (0, jsx_runtime_1.jsx)("div", { style: {
-                    width: '100%',
-                    height: '100%',
-                    boxSizing: 'content-box',
-                }, children: (0, jsx_runtime_1.jsxs)("div", { style: {
-                        display: 'flex',
-                        flexDirection: 'column',
-                        justifyContent: 'space-between',
-                        height: '100%',
-                        boxSizing: 'content-box',
-                    }, children: [(0, jsx_runtime_1.jsxs)("div", { style: {
-                                display: 'flex',
-                                flexDirection: 'row',
-                                justifyContent: 'space-between',
-                                boxSizing: 'content-box',
-                                paddingBottom: 20,
-                            }, children: [(0, jsx_runtime_1.jsx)("div", { style: {
-                                        fontFamily: theme.fontFamily,
-                                        color: theme.primaryTextColor,
-                                        boxSizing: 'content-box',
-                                        fontSize: 18,
-                                        fontWeight: '500',
-                                        textOverflow: 'ellipsis',
-                                        padding: 0,
-                                        whiteSpace: 'nowrap',
-                                        display: 'block',
-                                        maxWidth: '100%',
-                                        overflow: 'hidden',
-                                    }, children: dashboardItem?.name }), onClickDashboardItem ? ((0, jsx_runtime_1.jsx)("div", { style: {
-                                        fontFamily: theme.fontFamily,
-                                        color: theme.primaryTextColor,
-                                        boxSizing: 'content-box',
-                                        fontWeight: '500',
-                                        fontSize: 14,
-                                        minWidth: 14 * 7,
-                                        display: 'flex',
-                                        alignItems: 'center',
-                                        justifyContent: 'flex-end',
-                                    }, children: 'view report →' })) : null] }), (0, jsx_runtime_1.jsx)("div", { style: {
-                                padding: 0,
-                                height: '100%',
-                                boxSizing: 'content-box',
-                            }, children: children })] }) }) }) }, dashboardItem?.name));
-}
-exports.default = DashboardItem;

package/dist/cjs/components/Dashboard/DashboardSection.d.ts

@@ -1,3 +0,0 @@
-/// <reference types="react" />
-export default function DashboardSection({ style, children, ...props }: any): JSX.Element;
-//# sourceMappingURL=DashboardSection.d.ts.map

package/dist/cjs/components/Dashboard/DashboardSection.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"DashboardSection.d.ts","sourceRoot":"","sources":["../../../../src/components/Dashboard/DashboardSection.tsx"],"names":[],"mappings":";AAAA,MAAM,CAAC,OAAO,UAAU,gBAAgB,CAAC,EACvC,KAAK,EACL,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,GAAG,GAAG,GAAG,CAAC,OAAO,CAmBnB"}

package/dist/cjs/components/Dashboard/DashboardSection.js

@@ -1,17 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-const jsx_runtime_1 = require("react/jsx-runtime");
-function DashboardSection({ style, children, ...props }) {
-    return ((0, jsx_runtime_1.jsx)("div", { style: {
-            boxSizing: 'content-box',
-            width: '100%',
-            // height: '100%',
-            listStyleType: 'none',
-            display: 'grid',
-            gap: 20,
-            gridTemplateColumns: `repeat(auto-fill,minmax(400px, 1fr))`,
-            gridTemplateRows: `repeat(${170}px)`,
-            ...style,
-        }, ...props, children: children }));
-}
-exports.default = DashboardSection;

package/dist/cjs/components/Dashboard/DashboardSectionContainer.d.ts

@@ -1,3 +0,0 @@
-/// <reference types="react" />
-export default function DashboardSectionContainer({ style, children, ...props }: any): JSX.Element;
-//# sourceMappingURL=DashboardSectionContainer.d.ts.map

package/dist/cjs/components/Dashboard/DashboardSectionContainer.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"DashboardSectionContainer.d.ts","sourceRoot":"","sources":["../../../../src/components/Dashboard/DashboardSectionContainer.tsx"],"names":[],"mappings":";AAAA,MAAM,CAAC,OAAO,UAAU,yBAAyB,CAAC,EAChD,KAAK,EACL,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,GAAG,GAAG,GAAG,CAAC,OAAO,CAenB"}

package/dist/cjs/components/Dashboard/DashboardSectionContainer.js

@@ -1,13 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-const jsx_runtime_1 = require("react/jsx-runtime");
-function DashboardSectionContainer({ style, children, ...props }) {
-    return ((0, jsx_runtime_1.jsx)("div", { style: {
-            width: '100%',
-            display: 'flex',
-            flexDirection: 'column',
-            gap: 20,
-            ...style,
-        }, ...props, children: children }));
-}
-exports.default = DashboardSectionContainer;

package/dist/cjs/components/Dashboard/DataLoader.d.ts

@@ -1,3 +0,0 @@
-/// <reference types="react" />
-export default function DataLoader({ id, SkeletonComponent, handleOnClickDashboardItem, onClickDashboardItem, TableComponent, name, theme, }: any): JSX.Element;
-//# sourceMappingURL=DataLoader.d.ts.map

package/dist/cjs/components/Dashboard/DataLoader.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"DataLoader.d.ts","sourceRoot":"","sources":["../../../../src/components/Dashboard/DataLoader.tsx"],"names":[],"mappings":";AAWA,MAAM,CAAC,OAAO,UAAU,UAAU,CAAC,EACjC,EAAE,EACF,iBAAiB,EACjB,0BAA0B,EAC1B,oBAAoB,EACpB,cAAc,EACd,IAAI,EACJ,KAAK,GACN,EAAE,GAAG,GAAG,GAAG,CAAC,OAAO,CAsFnB"}