@quillsql/react 2.8.8 → 2.8.9

package/dist/BarList.js

@@ -1,14 +1,8 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.hexToRgbaWith10PercentAlpha = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 /* eslint-disable react/display-name */
 // @ts-nocheck
-const react_1 = __importDefault(require("react"));
-const Chart_1 = require("./Chart");
+import React from 'react';
+import { valueFormatter } from './utils/valueFormatter';
 const getWidthsFromValues = (dataValues) => {
     let maxValue = -Infinity;
     dataValues.forEach(value => {
@@ -29,7 +23,7 @@ function makeBarListClassName(componentName) {
 // return '$ ' + Intl.NumberFormat('us').format(number).toString();
 //   return number.toFixed(0);
 // };
-function hexToRgbaWith10PercentAlpha(hex) {
+export function hexToRgbaWith10PercentAlpha(hex) {
     // Convert the hex color to RGB
     const r = parseInt(hex.slice(1, 3), 16);
     const g = parseInt(hex.slice(3, 5), 16);
@@ -39,8 +33,7 @@ function hexToRgbaWith10PercentAlpha(hex) {
     // Return the color as an rgba string
     return `rgba(${r}, ${g}, ${b}, ${alpha})`;
 }
-exports.hexToRgbaWith10PercentAlpha = hexToRgbaWith10PercentAlpha;
-const BarList = react_1.default.forwardRef((props, ref) => {
+const BarList = React.forwardRef((props, ref) => {
     const { data = [], yAxisFields, xAxisField, xAxisFormat, colors, 
     // valueFormatter = (value: any) => value,valueFormatter
     showAnimation = true, className, containerStyle, theme, ...other } = props;
@@ -48,7 +41,7 @@ const BarList = react_1.default.forwardRef((props, ref) => {
     const NUM_TO_SHOW = Math.floor(containerStyle?.height / 40) - 1;
     if (yAxisFields.length > 1) {
         const widths2 = getWidthsFromValues(data.map(item => item[yAxisFields[1].field]));
-        return ((0, jsx_runtime_1.jsxs)("div", { ref: ref, style: {
+        return (_jsxs("div", { ref: ref, style: {
                 ...containerStyle,
                 // width: '100%',
                 // height: '100%',
@@ -65,7 +58,7 @@ const BarList = react_1.default.forwardRef((props, ref) => {
                 justifyContent: 'space-between',
                 // marginLeft: '24px',
                 // width: 'calc(100% - 24px)',
-            }, ...other, children: [(0, jsx_runtime_1.jsxs)("div", { 
+            }, ...other, children: [_jsxs("div", { 
                     //   className={twMerge(makeBarListClassName('bars'), 'relative w-full')}
                     // className="qq-relative-w-full"
                     style: {
@@ -77,19 +70,19 @@ const BarList = react_1.default.forwardRef((props, ref) => {
                     }, children: [data.slice(0, Math.floor(NUM_TO_SHOW / 2)).map((item, idx) => {
                             //   const Icon = item.icon;
                             const Icon = null;
-                            return ((0, jsx_runtime_1.jsxs)("div", { style: {
+                            return (_jsxs("div", { style: {
                                     boxSizing: 'content-box',
                                     display: 'flex',
                                     flexDirection: 'row',
                                     alignItems: 'center',
                                     width: '100%',
-                                }, children: [(0, jsx_runtime_1.jsx)("div", { title: item[xAxisField], style: {
+                                }, children: [_jsx("div", { title: item[xAxisField], style: {
                                             maxWidth: 130,
                                             boxSizing: 'content-box',
                                             minWidth: 130,
                                             overflow: 'hidden',
                                             width: '100%',
-                                        }, children: (0, jsx_runtime_1.jsx)("p", { style: {
+                                        }, children: _jsx("p", { style: {
                                                 color: theme?.chartLabelColor,
                                                 boxSizing: 'content-box',
                                                 whiteSpace: 'nowrap',
@@ -97,17 +90,17 @@ const BarList = react_1.default.forwardRef((props, ref) => {
                                                 textOverflow: 'ellipsis',
                                                 fontFamily: theme?.chartLabelFontFamily || theme?.fontFamily,
                                                 fontSize: theme?.fontSizeSmall || '14px',
-                                            }, children: (0, Chart_1.valueFormatter)({
+                                            }, children: valueFormatter({
                                                 value: item[xAxisField],
                                                 field: xAxisField,
                                                 fields: [{ field: xAxisField, format: xAxisFormat }],
-                                            }) }) }), (0, jsx_runtime_1.jsxs)("div", { style: {
+                                            }) }) }), _jsxs("div", { style: {
                                             width: '100%',
                                             height: '100%',
                                             boxSizing: 'content-box',
                                             display: 'flex',
                                             flexDirection: 'column',
-                                        }, children: [(0, jsx_runtime_1.jsx)("div", { 
+                                        }, children: [_jsx("div", { 
                                                 // className={`qq-flex qq-items-center qq-h-9 qq-rounded qq-mb-2`}
                                                 style: {
                                                     display: 'flex',
@@ -119,13 +112,13 @@ const BarList = react_1.default.forwardRef((props, ref) => {
                                                     transition: showAnimation ? 'all 2s' : '',
                                                     backgroundColor: hexToRgbaWith10PercentAlpha(colors[0]),
                                                     boxSizing: 'content-box',
-                                                }, children: (0, jsx_runtime_1.jsx)("div", { style: {
+                                                }, children: _jsx("div", { style: {
                                                         position: 'absolute',
                                                         display: 'flex',
                                                         maxWidth: '100%',
                                                         boxSizing: 'content-box',
                                                         marginLeft: '8px',
-                                                    }, children: (0, jsx_runtime_1.jsx)("p", { style: {
+                                                    }, children: _jsx("p", { style: {
                                                             color: theme?.chartLabelColor,
                                                             fontFamily: theme?.chartLabelFontFamily || theme?.fontFamily,
                                                             boxSizing: 'content-box',
@@ -133,7 +126,7 @@ const BarList = react_1.default.forwardRef((props, ref) => {
                                                             overflow: 'hidden',
                                                             textOverflow: 'ellipsis',
                                                             fontSize: theme?.fontSizeSmall || '14px',
-                                                        }, children: yAxisFields[0].label }) }) }), (0, jsx_runtime_1.jsx)("div", { 
+                                                        }, children: yAxisFields[0].label }) }) }), _jsx("div", { 
                                                 // className={`qq-flex qq-items-center qq-h-9 qq-rounded qq-mb-2`}
                                                 style: {
                                                     display: 'flex',
@@ -145,13 +138,13 @@ const BarList = react_1.default.forwardRef((props, ref) => {
                                                     transition: showAnimation ? 'all 2s' : '',
                                                     backgroundColor: hexToRgbaWith10PercentAlpha(colors[1]),
                                                     boxSizing: 'content-box',
-                                                }, children: (0, jsx_runtime_1.jsx)("div", { style: {
+                                                }, children: _jsx("div", { style: {
                                                         boxSizing: 'content-box',
                                                         position: 'absolute',
                                                         maxWidth: '100%',
                                                         display: 'flex',
                                                         marginLeft: '8px',
-                                                    }, children: (0, jsx_runtime_1.jsx)("p", { style: {
+                                                    }, children: _jsx("p", { style: {
                                                             color: theme?.chartLabelColor,
                                                             boxSizing: 'content-box',
                                                             whiteSpace: 'nowrap',
@@ -160,24 +153,24 @@ const BarList = react_1.default.forwardRef((props, ref) => {
                                                             fontFamily: theme?.chartLabelFontFamily || theme?.fontFamily,
                                                             fontSize: theme?.fontSizeSmall || '14px',
                                                         }, children: yAxisFields[1].label }) }) })] })] }, item[xAxisField] + idx));
-                        }), data.length > NUM_TO_SHOW && ((0, jsx_runtime_1.jsxs)("div", { style: {
+                        }), data.length > NUM_TO_SHOW && (_jsxs("div", { style: {
                                 color: theme?.chartLabelColor,
                                 boxSizing: 'content-box',
                                 fontFamily: theme?.chartLabelFontFamily || theme?.fontFamily,
                                 fontSize: theme?.fontSizeSmall || '14px',
-                            }, children: ["...", data.length - NUM_TO_SHOW, " more"] }))] }), (0, jsx_runtime_1.jsx)("div", { style: {
+                            }, children: ["...", data.length - NUM_TO_SHOW, " more"] }))] }), _jsx("div", { style: {
                         boxSizing: 'content-box',
                         minWidth: 'min-content',
                         textAlign: 'right',
                         paddingLeft: 10,
-                    }, children: data.slice(0, NUM_TO_SHOW).map((item, idx) => ((0, jsx_runtime_1.jsx)("div", { style: {
+                    }, children: data.slice(0, NUM_TO_SHOW).map((item, idx) => (_jsx("div", { style: {
                             boxSizing: 'content-box',
                             display: 'flex',
                             justifyContent: 'flex-end',
                             alignItems: 'center',
                             marginBottom: idx === data.length - 1 ? 0 : '8px',
                             height: '36px',
-                        }, children: (0, jsx_runtime_1.jsx)("p", { style: {
+                        }, children: _jsx("p", { style: {
                                 color: theme?.chartLabelColor,
                                 boxSizing: 'content-box',
                                 fontFamily: theme?.chartLabelFontFamily || theme?.fontFamily,
@@ -185,13 +178,13 @@ const BarList = react_1.default.forwardRef((props, ref) => {
                                 overflow: 'hidden',
                                 textOverflow: 'ellipsis',
                                 fontSize: theme?.fontSizeSmall || '14px',
-                            }, children: (0, Chart_1.valueFormatter)({
+                            }, children: valueFormatter({
                                 value: item[yAxisFields[0].field],
                                 field: yAxisFields[0].field,
                                 fields: yAxisFields,
                             }) }) }, item[xAxisField] + 'label' + idx))) })] }));
     }
-    return ((0, jsx_runtime_1.jsx)("div", { ref: ref, style: {
+    return (_jsx("div", { ref: ref, style: {
             ...containerStyle,
             // width: '100%',
             boxSizing: 'content-box',
@@ -201,7 +194,7 @@ const BarList = react_1.default.forwardRef((props, ref) => {
             // background: 'red',
             // paddingRight: 25,
             // paddingRight: 25,
-        }, ...other, children: (0, jsx_runtime_1.jsxs)("div", { style: {
+        }, ...other, children: _jsxs("div", { style: {
                 display: 'flex',
                 justifyContent: 'space-between',
                 // paddingTop: 20,
@@ -209,7 +202,7 @@ const BarList = react_1.default.forwardRef((props, ref) => {
                 boxSizing: 'content-box',
                 overflow: 'hidden',
                 width: '100%',
-            }, children: [(0, jsx_runtime_1.jsxs)("div", { 
+            }, children: [_jsxs("div", { 
                     //   className={twMerge(makeBarListClassName('bars'), 'relative w-full')}
                     // className="qq-relative-w-full"
                     style: {
@@ -221,7 +214,7 @@ const BarList = react_1.default.forwardRef((props, ref) => {
                     }, children: [data.slice(0, NUM_TO_SHOW).map((item, idx) => {
                             //   const Icon = item.icon;
                             const Icon = null;
-                            return ((0, jsx_runtime_1.jsx)("div", { 
+                            return (_jsx("div", { 
                                 // className={`qq-flex qq-items-center qq-h-9 qq-rounded qq-mb-2`}
                                 style: {
                                     width: `${widths[idx]}%`,
@@ -233,13 +226,13 @@ const BarList = react_1.default.forwardRef((props, ref) => {
                                     height: '36px',
                                     marginBottom: '8px',
                                     borderRadius: '4px',
-                                }, children: (0, jsx_runtime_1.jsx)("div", { style: {
+                                }, children: _jsx("div", { style: {
                                         boxSizing: 'content-box',
                                         position: 'absolute',
                                         maxWidth: '100%',
                                         display: 'flex',
                                         marginLeft: '8px',
-                                    }, children: (0, jsx_runtime_1.jsx)("p", { style: {
+                                    }, children: _jsx("p", { style: {
                                             color: theme?.chartLabelColor,
                                             boxSizing: 'content-box',
                                             whiteSpace: 'nowrap',
@@ -247,29 +240,29 @@ const BarList = react_1.default.forwardRef((props, ref) => {
                                             textOverflow: 'ellipsis',
                                             fontFamily: theme?.chartLabelFontFamily || theme?.fontFamily,
                                             fontSize: theme?.fontSizeSmall || '14px',
-                                        }, children: (0, Chart_1.valueFormatter)({
+                                        }, children: valueFormatter({
                                             value: item[xAxisField],
                                             field: xAxisField,
                                             fields: [{ field: xAxisField, format: xAxisFormat }],
                                         }) }) }) }, item[xAxisField] + 'label' + idx));
-                        }), data.length > NUM_TO_SHOW && ((0, jsx_runtime_1.jsxs)("div", { style: {
+                        }), data.length > NUM_TO_SHOW && (_jsxs("div", { style: {
                                 color: theme?.chartLabelColor,
                                 boxSizing: 'content-box',
                                 fontFamily: theme?.chartLabelFontFamily || theme?.fontFamily,
                                 fontSize: theme?.fontSizeSmall || '14px',
-                            }, children: ["...", data.length - NUM_TO_SHOW, " more"] }))] }), (0, jsx_runtime_1.jsx)("div", { style: {
+                            }, children: ["...", data.length - NUM_TO_SHOW, " more"] }))] }), _jsx("div", { style: {
                         boxSizing: 'content-box',
                         textAlign: 'right',
                         minWidth: 'min-content',
                         paddingLeft: 10,
-                    }, children: data.slice(0, NUM_TO_SHOW).map((item, idx) => ((0, jsx_runtime_1.jsx)("div", { style: {
+                    }, children: data.slice(0, NUM_TO_SHOW).map((item, idx) => (_jsx("div", { style: {
                             boxSizing: 'content-box',
                             display: 'flex',
                             alignItems: 'center',
                             justifyContent: 'flex-end',
                             marginBottom: idx === data.length - 1 ? 0 : '8px',
                             height: '36px',
-                        }, children: (0, jsx_runtime_1.jsx)("p", { style: {
+                        }, children: _jsx("p", { style: {
                                 color: theme?.chartLabelColor,
                                 boxSizing: 'content-box',
                                 fontFamily: theme?.chartLabelFontFamily || theme?.fontFamily,
@@ -277,11 +270,10 @@ const BarList = react_1.default.forwardRef((props, ref) => {
                                 overflow: 'hidden',
                                 textOverflow: 'ellipsis',
                                 fontSize: theme?.fontSizeSmall || '14px',
-                            }, children: (0, Chart_1.valueFormatter)({
+                            }, children: valueFormatter({
                                 value: item[yAxisFields[0].field],
                                 field: yAxisFields[0].field,
                                 fields: yAxisFields,
                             }) }) }, item[xAxisField] + 'value' + idx))) })] }) }));
 });
-exports.default = BarList;
-//# sourceMappingURL=BarList.js.map
+export default BarList;

package/dist/Chart.d.ts

@@ -1,11 +1,6 @@
 import React from 'react';
 declare const colorValues: readonly ["slate", "silver", "zinc", "neutral", "stone", "red", "orange", "amber", "yellow", "lime", "green", "emerald", "teal", "cyan", "sky", "blue", "indigo", "violet", "purple", "fuchsia", "pink", "rose"];
 export type Color = (typeof colorValues)[number];
-export declare const valueFormatter: ({ value, field, fields }: {
-    value: any;
-    field: any;
-    fields: any;
-}) => any;
 export declare const ChartTooltipFrame: ({ children, theme, }: {
     children: React.ReactNode;
 }) => import("react/jsx-runtime").JSX.Element;

package/dist/Chart.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Chart.d.ts","sourceRoot":"","sources":["../src/Chart.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAmD,MAAM,OAAO,CAAC;AA4CxE,QAAA,MAAM,WAAW,kNAuBP,CAAC;AAEX,MAAM,MAAM,KAAK,GAAG,CAAC,OAAO,WAAW,CAAC,CAAC,MAAM,CAAC,CAAC;AA2GjD,eAAO,MAAM,cAAc;;;;SAgK1B,CAAC;AAYF,eAAO,MAAM,iBAAiB;cAIlB,MAAM,SAAS;6CAgB1B,CAAC;AAEF,MAAM,WAAW,oBAAoB;IACnC,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,KAAK,CAAC;IACb,IAAI,EAAE,GAAG,CAAC;CACX;AAED,eAAO,MAAM,eAAe,mCAKzB,oBAAoB,4CA0FtB,CAAC;AAEF,MAAM,WAAW,iBAAiB;IAChC,MAAM,EAAE,OAAO,GAAG,SAAS,CAAC;IAC5B,OAAO,EAAE,GAAG,CAAC;IACb,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,MAAM,EAAE,MAAM,EAAE,CAAC;IACjB,cAAc,EAAE,GAAG,CAAC;IACpB,KAAK,EAAE,GAAG,CAAC;CACZ;AA+SD,QAAA,MAAM,KAAK;aAUA,MAAM;aACN,GAAG;;;;;6CAyDb,CAAC;AA0uCF,eAAe,KAAK,CAAC"}
+{"version":3,"file":"Chart.d.ts","sourceRoot":"","sources":["../src/Chart.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAmD,MAAM,OAAO,CAAC;AA8CxE,QAAA,MAAM,WAAW,kNAuBP,CAAC;AAEX,MAAM,MAAM,KAAK,GAAG,CAAC,OAAO,WAAW,CAAC,CAAC,MAAM,CAAC,CAAC;AAqHjD,eAAO,MAAM,iBAAiB;cAIlB,MAAM,SAAS;6CAgB1B,CAAC;AAEF,MAAM,WAAW,oBAAoB;IACnC,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,KAAK,CAAC;IACb,IAAI,EAAE,GAAG,CAAC;CACX;AAED,eAAO,MAAM,eAAe,mCAKzB,oBAAoB,4CA0FtB,CAAC;AAEF,MAAM,WAAW,iBAAiB;IAChC,MAAM,EAAE,OAAO,GAAG,SAAS,CAAC;IAC5B,OAAO,EAAE,GAAG,CAAC;IACb,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,MAAM,EAAE,MAAM,EAAE,CAAC;IACjB,cAAc,EAAE,GAAG,CAAC;IACpB,KAAK,EAAE,GAAG,CAAC;CACZ;AA+SD,QAAA,MAAM,KAAK;aAUA,MAAM;aACN,GAAG;;;;;6CAyDb,CAAC;AA2uCF,eAAe,KAAK,CAAC"}