@quillsql/react 2.11.20 → 2.11.21

package/dist/cjs/components/UiComponents.d.ts

@@ -59,19 +59,18 @@ export interface ContainerComponentProps {
  */
 export declare const QuillTextInput: ({ id, value, width, placeholder, onChange, }: TextInputComponentProps) => import("react/jsx-runtime").JSX.Element;
 export declare const MemoizedTextInput: ({ value, onChange, placeholder, id, }: TextInputComponentProps) => import("react/jsx-runtime").JSX.Element;
-export declare const MemoizedButton: ({ label, onClick, primary, isLoading, }: {
-    label: any;
-    onClick: any;
-    primary?: boolean | undefined;
-    isLoading?: boolean | undefined;
+export declare const MemoizedButton: ({ label, onClick, }: {
+    label: string;
+    onClick: () => void;
 }) => import("react/jsx-runtime").JSX.Element;
-export declare const MemoizedSecondaryButton: ({ label, onClick }: {
-    label: any;
-    onClick: any;
+export declare const MemoizedSecondaryButton: ({ label, onClick, }: {
+    label: string;
+    onClick: () => void;
 }) => import("react/jsx-runtime").JSX.Element;
 export interface SelectComponentProps {
     value: string;
     label?: string;
+    width: number;
     options: {
         value: string;
         label: string;
@@ -88,9 +87,10 @@ export interface LabelComponentProps {
 export declare const MemoizedLabel: ({ label }: LabelComponentProps) => import("react/jsx-runtime").JSX.Element;
 export interface CheckboxComponentProps {
     isChecked: boolean;
+    label: string;
     onChange: (event: ChangeEvent<HTMLInputElement>) => void;
 }
-export declare const MemoizedCheckbox: ({ isChecked, onChange, }: CheckboxComponentProps) => import("react/jsx-runtime").JSX.Element;
+export declare const MemoizedCheckbox: ({ isChecked, label, onChange, }: CheckboxComponentProps) => import("react/jsx-runtime").JSX.Element;
 export declare const DEFAULT_TAB_OPTIONS: {
     label: string;
     value: string;

package/dist/cjs/components/UiComponents.d.ts.map

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

package/dist/cjs/components/UiComponents.js

@@ -9,6 +9,7 @@ const jsx_runtime_1 = require("react/jsx-runtime");
 const react_1 = require("react");
 const assets_1 = require("../assets");
 const Context_1 = require("../Context");
+const hooks_1 = require("../hooks");
 const QuillTable_1 = __importDefault(require("./QuillTable"));
 /**
  * The fallback TextInput element for Quill.
@@ -54,7 +55,7 @@ const MemoizedTextInput = ({ value, onChange, placeholder, id, }) => {
     }` }), (0, jsx_runtime_1.jsx)("input", { id: id, className: "quill-text-input", type: "text", value: value, onChange: onChange, placeholder: placeholder, style: { fontFamily: theme?.fontFamily } })] }));
 };
 exports.MemoizedTextInput = MemoizedTextInput;
-const MemoizedButton = ({ label, onClick, primary = true, isLoading = false, }) => {
+const MemoizedButton = ({ label, onClick, }) => {
     const [theme] = (0, react_1.useContext)(Context_1.ThemeContext);
     return ((0, jsx_runtime_1.jsxs)("button", { className: "quill-button", onClick: onClick, style: { fontFamily: theme?.fontFamily }, children: [(0, jsx_runtime_1.jsx)("style", { children: `
     .quill-button {
@@ -74,10 +75,10 @@ const MemoizedButton = ({ label, onClick, primary = true, isLoading = false, })
     .quill-button:hover {
       background-color: rgba(56, 65, 81, 0.9);
       border-radius: 6px;
-    }` }), isLoading ? ((0, jsx_runtime_1.jsx)("div", { style: { padding: '0px 16px' }, children: (0, jsx_runtime_1.jsx)(exports.LoadingSpinner, {}) })) : (label)] }));
+    }` }), label] }));
 };
 exports.MemoizedButton = MemoizedButton;
-const MemoizedSecondaryButton = ({ label, onClick }) => {
+const MemoizedSecondaryButton = ({ label, onClick, }) => {
     const [theme] = (0, react_1.useContext)(Context_1.ThemeContext);
     return ((0, jsx_runtime_1.jsxs)("button", { className: "quill-secondary-button", onClick: onClick, style: { fontFamily: theme?.fontFamily }, children: [(0, jsx_runtime_1.jsx)("style", { children: `
     .quill-secondary-button {
@@ -120,12 +121,31 @@ const MemoizedLabel = ({ label }) => {
             fontFamily: theme?.fontFamily,
             color: theme?.secondaryTextColor || '#575E6A',
             userSelect: 'none',
-            paddingBottom: 5,
             margin: 0,
         }, children: label }));
 };
 exports.MemoizedLabel = MemoizedLabel;
-const MemoizedCheckbox = ({ isChecked, onChange, }) => ((0, jsx_runtime_1.jsx)("input", { type: "checkbox", checked: isChecked, onChange: onChange, style: { width: '14px', height: '14px', margin: 'auto 0' } }));
+const MemoizedCheckbox = ({ isChecked, label, onChange, }) => {
+    const theme = (0, hooks_1.useTheme)();
+    return ((0, jsx_runtime_1.jsxs)("label", { style: {
+            display: 'flex',
+            width: '100%',
+            whiteSpace: 'nowrap',
+            textOverflow: 'ellipsis',
+            overflow: 'hidden',
+            gap: 4,
+        }, children: [(0, jsx_runtime_1.jsx)("input", { type: "checkbox", checked: isChecked, onChange: onChange, style: { width: '14px', height: '14px', margin: 'auto 0' } }), (0, jsx_runtime_1.jsx)("span", { style: {
+                    display: 'block',
+                    marginTop: 'auto',
+                    marginBottom: 'auto',
+                    marginLeft: '6px',
+                    whiteSpace: 'nowrap',
+                    textOverflow: 'ellipsis',
+                    overflow: 'hidden',
+                    fontFamily: theme?.fontFamily,
+                    color: theme?.primaryTextColor,
+                }, children: label })] }));
+};
 exports.MemoizedCheckbox = MemoizedCheckbox;
 exports.DEFAULT_TAB_OPTIONS = [
     { label: 'or', value: 'OR' },
@@ -147,14 +167,12 @@ const QuillTabs = ({ options = exports.DEFAULT_TAB_OPTIONS, value, onChange, })
             outlineStyle: 'none',
             transitionProperty: 'background-color, border-color, color, fill, stroke, opacity, box-shadow, transform',
             transitionTimingFunction: 'cubic-bezier(0.4, 0, 0.2, 1)',
-            transitionDuration: ['300ms', '300ms'],
-            borderColor: '#e7e7e7',
+            transitionDuration: '300ms',
             margin: '0px',
             paddingTop: '0.375rem',
             paddingBottom: '0.375rem',
             paddingLeft: '0.75rem',
             paddingRight: '0.75rem',
-            color: '12px',
             ...(option.value === value
                 ? {
                     fontWeight: 700,
@@ -260,16 +278,10 @@ function MemoizedModal({ isOpen, setIsOpen, title, children, width, height, }) {
                 }, children: (0, jsx_runtime_1.jsxs)("div", { style: {
                         width: '100%',
                         height: '100%',
-                        maxWidth: 'calc(100vw - 82px)',
-                        maxHeight: 'calc(100vh - 82px)',
                         overflowY: 'scroll',
-                        // maxWidth: "700px",
                         backgroundColor: '#ffffff',
-                        // padding: "20px",
-                        // borderRadius: "8px",
                         display: 'flex',
                         flexDirection: 'column',
-                        // alignItems: 'center',
                         position: 'relative',
                         fontFamily: theme?.fontFamily,
                     }, children: [(0, jsx_runtime_1.jsxs)("div", { id: "quill-modal-header", style: {
@@ -278,15 +290,18 @@ function MemoizedModal({ isOpen, setIsOpen, title, children, width, height, }) {
                                 width: '100%',
                                 justifyContent: 'space-between',
                                 alignItems: 'center',
+                                padding: 10,
                             }, children: [(0, jsx_runtime_1.jsx)("h2", { style: {
                                         fontSize: 18,
                                         fontWeight: '600',
-                                        marginLeft: 20,
                                         // width: '90%',
                                         textAlign: 'left',
-                                        paddingTop: 18,
+                                        paddingLeft: 10,
                                         color: theme?.primaryTextColor,
-                                    }, children: title }), (0, jsx_runtime_1.jsx)("div", { style: { marginRight: 10, marginTop: 10 }, children: (0, jsx_runtime_1.jsx)(exports.MemoizedDeleteButton, { onClick: () => setIsOpen(false) }) })] }), children] }) })] }));
+                                    }, children: title }), (0, jsx_runtime_1.jsx)(exports.MemoizedDeleteButton, { onClick: () => setIsOpen(false) })] }), (0, jsx_runtime_1.jsx)("div", { style: {
+                                height: 'calc(100% - 60px)', // full height minus title
+                                width: '100%', // full width minus margin
+                            }, children: children })] }) })] }));
 }
 exports.MemoizedModal = MemoizedModal;
 const MemoizedDeleteButton = ({ onClick, }) => ((0, jsx_runtime_1.jsxs)("button", { className: "quill-delete-button", type: "button", onClick: onClick, style: {

package/dist/cjs/internals/ReportBuilder/PivotList.d.ts

@@ -9,7 +9,7 @@ export declare const PivotCard: ({ pivotTable, theme, index, onSelectPivot, sele
     ButtonComponent: any;
     showEdit?: boolean | undefined;
     clickable?: boolean | undefined;
-    onClose?: (() => void) | undefined;
+    onClose: any;
     minHeight?: number | undefined;
     CardComponent?: typeof QuillCard | undefined;
     LabelComponent: any;

package/dist/cjs/internals/ReportBuilder/PivotList.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"PivotList.d.ts","sourceRoot":"","sources":["../../../../src/internals/ReportBuilder/PivotList.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,SAAS,EAAE,MAAM,4BAA4B,CAAC;AAEvD,eAAO,MAAM,SAAS;;;;;;;;;;;;;;;;6CAiNrB,CAAC;AAEF,eAAO,MAAM,SAAS;;;;;;;;;;;;;;;;;6CAqFrB,CAAC"}
+{"version":3,"file":"PivotList.d.ts","sourceRoot":"","sources":["../../../../src/internals/ReportBuilder/PivotList.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,SAAS,EAAE,MAAM,4BAA4B,CAAC;AAEvD,eAAO,MAAM,SAAS;;;;;;;;;;;;;;;;6CAmNrB,CAAC;AAEF,eAAO,MAAM,SAAS;;;;;;;;;;;;;;;;;6CAqFrB,CAAC"}

package/dist/cjs/internals/ReportBuilder/PivotList.js

@@ -6,9 +6,9 @@ const jsx_runtime_1 = require("react/jsx-runtime");
 const valueFormatter_1 = require("../../utils/valueFormatter");
 const textProcessing_1 = require("../../utils/textProcessing");
 const QuillCard_1 = require("../../components/QuillCard");
-const PivotCard = ({ pivotTable, theme, index, onSelectPivot, selectedPivotIndex, onEditPivot, ButtonComponent, showEdit = false, clickable = true, onClose = () => { }, minHeight = 0, CardComponent = QuillCard_1.QuillCard, LabelComponent, TextComponent, HeaderComponent, }) => {
+const PivotCard = ({ pivotTable, theme, index, onSelectPivot, selectedPivotIndex, onEditPivot, ButtonComponent, showEdit = false, clickable = true, onClose, minHeight = 0, CardComponent = QuillCard_1.QuillCard, LabelComponent, TextComponent, HeaderComponent, }) => {
     const maxRowsInPivotPeak = 5;
-    return ((0, jsx_runtime_1.jsx)(CardComponent, { onClick: () => onSelectPivot(pivotTable.pivot, index), onDelete: onClose, children: (0, jsx_runtime_1.jsxs)("div", { style: {
+    return ((0, jsx_runtime_1.jsx)(CardComponent, { onClick: onSelectPivot ? () => onSelectPivot(pivotTable.pivot, index) : undefined, onDelete: onClose, children: (0, jsx_runtime_1.jsxs)("div", { style: {
                 fontSize: 14,
                 display: 'flex',
                 flexDirection: 'column',
@@ -88,6 +88,6 @@ const PivotList = ({ recommendedPivotTables, createdPivotTables, onSelectRecomme
                             justifyContent: 'center',
                             alignItems: 'center',
                             width: '100%',
-                        }, children: "Create pivot +" }) }))] }) }));
+                        }, children: (0, jsx_runtime_1.jsx)(LabelComponent, { label: "Create pivot +" }) }) }))] }) }));
 };
 exports.PivotList = PivotList;

package/dist/cjs/internals/ReportBuilder/PivotModal.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"PivotModal.d.ts","sourceRoot":"","sources":["../../../../src/internals/ReportBuilder/PivotModal.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"PivotModal.d.ts","sourceRoot":"","sources":["../../../../src/internals/ReportBuilder/PivotModal.tsx"],"names":[],"mappings":"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"}

package/dist/cjs/internals/ReportBuilder/PivotModal.js

@@ -251,11 +251,17 @@ const PivotModal = ({ pivotRowField, setPivotRowField, pivotColumnField, setPivo
                             setPopUpTitle('Add Pivot');
                         }
                         setIsOpen(isOpen);
-                    }, popoverChildren: (0, jsx_runtime_1.jsx)("div", { children: showUpdatePivot ? ((0, jsx_runtime_1.jsxs)("div", { className: "ref-in-use", ref: editModalRef, style: {
+                    }, popoverTitle: showUpdatePivot ? popUpTitle : 'Recommended pivots', popoverChildren: (0, jsx_runtime_1.jsx)("div", { style: {
+                            paddingTop: showUpdatePivot ? 0 : 20,
+                            position: 'relative',
+                        }, children: showUpdatePivot ? ((0, jsx_runtime_1.jsxs)("div", { className: "ref-in-use", ref: editModalRef, style: {
                                 backgroundColor: 'rgb(255, 255, 255)',
                                 display: 'flex',
                                 flexDirection: 'column',
-                            }, children: [(0, jsx_runtime_1.jsx)(HeaderComponent, { label: popUpTitle }), (0, jsx_runtime_1.jsx)("div", { style: { height: 12 } }), (0, jsx_runtime_1.jsxs)("div", { style: {
+                            }, children: [(0, jsx_runtime_1.jsx)("div", { style: { height: 12 } }), (0, jsx_runtime_1.jsx)("div", { style: { width: divWidth }, children: samplePivotTable && ((0, jsx_runtime_1.jsx)("div", { style: {
+                                            marginBottom: 20,
+                                            minHeight: 160,
+                                        }, children: (0, jsx_runtime_1.jsx)(PivotList_1.PivotCard, { pivotTable: samplePivotTable, theme: theme, index: 0, selectedPivotIndex: -1, onEditPivot: () => { }, ButtonComponent: ButtonComponent, showEdit: false, clickable: false, minHeight: 140, LabelComponent: LabelComponent, TextComponent: TextComponent, HeaderComponent: HeaderComponent }) })) }), (0, jsx_runtime_1.jsxs)("div", { style: {
                                         display: 'flex',
                                         flexDirection: 'column',
                                         gap: 10,
@@ -277,7 +283,7 @@ const PivotModal = ({ pivotRowField, setPivotRowField, pivotColumnField, setPivo
                                                                         ChartBuilder_1.dateFormatOptions.includes(format) ||
                                                                         (0, util_1.isIdColumn)(option.value));
                                                                 }),
-                                                            ] })] }), (0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)(LabelComponent, { label: "Column Field" }), (0, jsx_runtime_1.jsx)(SelectComponent, { id: "pivot-row-field", value: pivotColumnField, onChange: (e) => {
+                                                            ], width: 200 })] }), (0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)(LabelComponent, { label: "Column Field" }), (0, jsx_runtime_1.jsx)(SelectComponent, { id: "pivot-row-field", value: pivotColumnField, onChange: (e) => {
                                                                 setPivotColumnField(e.target.value === ''
                                                                     ? undefined
                                                                     : e.target.value);
@@ -285,7 +291,7 @@ const PivotModal = ({ pivotRowField, setPivotRowField, pivotColumnField, setPivo
                                                                 ...columnSelectOptions.filter((option) => {
                                                                     return (columns.find((col) => col.field === option.value)?.format === 'string');
                                                                 }),
-                                                            ] })] })] }), (0, jsx_runtime_1.jsxs)("div", { style: {
+                                                            ], width: 200 })] })] }), (0, jsx_runtime_1.jsxs)("div", { style: {
                                                 display: 'flex',
                                                 flexDirection: 'row',
                                                 gap: 20,
@@ -300,7 +306,7 @@ const PivotModal = ({ pivotRowField, setPivotRowField, pivotColumnField, setPivo
                                                                         ChartBuilder_1.numberFormatOptions.includes(columns.find((col) => col.field === option.value)?.format)) &&
                                                                         !(0, util_1.isIdColumn)(option.value));
                                                                 }),
-                                                            ] })] }), (0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)(LabelComponent, { label: "Aggregation Type" }), (0, jsx_runtime_1.jsx)(SelectComponent, { id: "pivot-row-field", value: pivotAggregation, onChange: (e) => {
+                                                            ], width: 200 })] }), (0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)(LabelComponent, { label: "Aggregation Type" }), (0, jsx_runtime_1.jsx)(SelectComponent, { id: "pivot-row-field", value: pivotAggregation, onChange: (e) => {
                                                                 if (e.target.value !== 'count' &&
                                                                     pivotValueField &&
                                                                     !ChartBuilder_1.numberFormatOptions.includes(columns.find((col) => col.field === pivotValueField)?.format)) {
@@ -313,7 +319,7 @@ const PivotModal = ({ pivotRowField, setPivotRowField, pivotColumnField, setPivo
                                                                 ...['sum', 'average', 'count', 'max', 'min'].map((option) => {
                                                                     return { label: option, value: option };
                                                                 }),
-                                                            ] })] })] })] }), (0, jsx_runtime_1.jsx)("div", { children: (0, jsx_runtime_1.jsx)(ButtonComponent, { id: "custom-button", onClick: () => {
+                                                            ], width: 200 })] })] })] }), (0, jsx_runtime_1.jsx)("div", { children: (0, jsx_runtime_1.jsx)(ButtonComponent, { id: "custom-button", onClick: () => {
                                             const errors = [];
                                             if (!pivotValueField && pivotAggregation !== 'count') {
                                                 errors.push("Value field cannot be empty when aggregation is not 'count'");
@@ -369,24 +375,19 @@ const PivotModal = ({ pivotRowField, setPivotRowField, pivotColumnField, setPivo
                                             columns: selectedPivotTable?.columns,
                                         }, theme: theme, index: 0, onSelectPivot: () => { }, selectedPivotIndex: -1, onEditPivot: () => { }, ButtonComponent: ButtonComponent, showEdit: false, onClose: () => {
                                             removePivot();
-                                        }, clickable: true, minHeight: 180, CardComponent: CardComponent, LabelComponent: LabelComponent, TextComponent: TextComponent, HeaderComponent: HeaderComponent }) }) })) : ((0, jsx_runtime_1.jsxs)("div", { style: { display: 'flex', flexDirection: 'column' }, children: [(0, jsx_runtime_1.jsxs)("div", { style: {
-                                            display: 'flex',
-                                            flexDirection: 'row',
-                                            width: '100%',
-                                            alignItems: 'center',
-                                            justifyContent: 'space-between',
-                                            paddingBottom: 12,
-                                        }, children: [(0, jsx_runtime_1.jsx)("div", { style: {
-                                                    fontWeight: '600',
-                                                    fontSize: 18,
-                                                }, children: "Recommended pivots" }), (0, jsx_runtime_1.jsx)("div", { children: (0, jsx_runtime_1.jsx)(SecondaryButtonComponent, { onClick: refreshPivots, label: (0, jsx_runtime_1.jsxs)("div", { style: {
-                                                            display: 'flex',
-                                                            flexDirection: 'row',
-                                                            whiteSpace: 'nowrap',
-                                                            alignItems: 'center',
-                                                            gap: 6,
-                                                            fontSize: 14,
-                                                        }, children: [(0, jsx_runtime_1.jsx)("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "currentColor", style: { width: 16, height: 16 }, children: (0, jsx_runtime_1.jsx)("path", { fillRule: "evenodd", d: "M9 4.5a.75.75 0 0 1 .721.544l.813 2.846a3.75 3.75 0 0 0 2.576 2.576l2.846.813a.75.75 0 0 1 0 1.442l-2.846.813a3.75 3.75 0 0 0-2.576 2.576l-.813 2.846a.75.75 0 0 1-1.442 0l-.813-2.846a3.75 3.75 0 0 0-2.576-2.576l-2.846-.813a.75.75 0 0 1 0-1.442l2.846-.813A3.75 3.75 0 0 0 7.466 7.89l.813-2.846A.75.75 0 0 1 9 4.5ZM18 1.5a.75.75 0 0 1 .728.568l.258 1.036c.236.94.97 1.674 1.91 1.91l1.036.258a.75.75 0 0 1 0 1.456l-1.036.258c-.94.236-1.674.97-1.91 1.91l-.258 1.036a.75.75 0 0 1-1.456 0l-.258-1.036a2.625 2.625 0 0 0-1.91-1.91l-1.036-.258a.75.75 0 0 1 0-1.456l1.036-.258a2.625 2.625 0 0 0 1.91-1.91l.258-1.036A.75.75 0 0 1 18 1.5ZM16.5 15a.75.75 0 0 1 .712.513l.394 1.183c.15.447.5.799.948.948l1.183.395a.75.75 0 0 1 0 1.422l-1.183.395c-.447.15-.799.5-.948.948l-.395 1.183a.75.75 0 0 1-1.422 0l-.395-1.183a1.5 1.5 0 0 0-.948-.948l-1.183-.395a.75.75 0 0 1 0-1.422l1.183-.395c.447-.15.799-.5.948-.948l.395-1.183A.75.75 0 0 1 16.5 15Z", clipRule: "evenodd" }) }), "Regenerate"] }) }) })] }), isLoading ? ((0, jsx_runtime_1.jsxs)("div", { style: {
+                                        }, clickable: true, minHeight: 180, CardComponent: CardComponent, LabelComponent: LabelComponent, TextComponent: TextComponent, HeaderComponent: HeaderComponent }) }) })) : ((0, jsx_runtime_1.jsxs)("div", { style: { display: 'flex', flexDirection: 'column' }, children: [(0, jsx_runtime_1.jsx)("div", { style: {
+                                            // position button inline with the popover title
+                                            position: 'absolute',
+                                            top: -36,
+                                            right: 0,
+                                        }, children: (0, jsx_runtime_1.jsx)(SecondaryButtonComponent, { onClick: refreshPivots, label: (0, jsx_runtime_1.jsxs)("div", { style: {
+                                                    display: 'flex',
+                                                    flexDirection: 'row',
+                                                    whiteSpace: 'nowrap',
+                                                    alignItems: 'center',
+                                                    gap: 6,
+                                                    fontSize: 14,
+                                                }, children: [(0, jsx_runtime_1.jsx)("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "currentColor", style: { width: 16, height: 16 }, children: (0, jsx_runtime_1.jsx)("path", { fillRule: "evenodd", d: "M9 4.5a.75.75 0 0 1 .721.544l.813 2.846a3.75 3.75 0 0 0 2.576 2.576l2.846.813a.75.75 0 0 1 0 1.442l-2.846.813a3.75 3.75 0 0 0-2.576 2.576l-.813 2.846a.75.75 0 0 1-1.442 0l-.813-2.846a3.75 3.75 0 0 0-2.576-2.576l-2.846-.813a.75.75 0 0 1 0-1.442l2.846-.813A3.75 3.75 0 0 0 7.466 7.89l.813-2.846A.75.75 0 0 1 9 4.5ZM18 1.5a.75.75 0 0 1 .728.568l.258 1.036c.236.94.97 1.674 1.91 1.91l1.036.258a.75.75 0 0 1 0 1.456l-1.036.258c-.94.236-1.674.97-1.91 1.91l-.258 1.036a.75.75 0 0 1-1.456 0l-.258-1.036a2.625 2.625 0 0 0-1.91-1.91l-1.036-.258a.75.75 0 0 1 0-1.456l1.036-.258a2.625 2.625 0 0 0 1.91-1.91l.258-1.036A.75.75 0 0 1 18 1.5ZM16.5 15a.75.75 0 0 1 .712.513l.394 1.183c.15.447.5.799.948.948l1.183.395a.75.75 0 0 1 0 1.422l-1.183.395c-.447.15-.799.5-.948.948l-.395 1.183a.75.75 0 0 1-1.422 0l-.395-1.183a1.5 1.5 0 0 0-.948-.948l-1.183-.395a.75.75 0 0 1 0-1.422l1.183-.395c.447-.15.799-.5.948-.948l.395-1.183A.75.75 0 0 1 16.5 15Z", clipRule: "evenodd" }) }), "Regenerate"] }) }) }), isLoading ? ((0, jsx_runtime_1.jsxs)("div", { style: {
                                             background: theme.backgroundColor,
                                             width: 250,
                                             minWidth: 250,

package/dist/cjs/utils/color.d.ts

@@ -1,3 +1,9 @@
+/**
+ * Generates an array of colors by interpolating between colors in the given array.
+ * @param colors - The array of colors to interpolate between.
+ * @param length - The desired length of the resulting array.
+ */
+export declare function generateArrayFromColor(colors: string | string[], length: number): string[];
 declare const colorValues: readonly ["red", "orange", "amber", "yellow", "lime", "green", "emerald", "teal", "cyan", "sky", "blue", "indigo", "violet", "purple", "fuchsia", "pink", "rose"];
 export type Color = (typeof colorValues)[number];
 /**

package/dist/cjs/utils/color.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"color.d.ts","sourceRoot":"","sources":["../../../src/utils/color.ts"],"names":[],"mappings":"AAAA,QAAA,MAAM,WAAW,mKAkBP,CAAC;AAEX,MAAM,MAAM,KAAK,GAAG,CAAC,OAAO,WAAW,CAAC,CAAC,MAAM,CAAC,CAAC;AAEjD;;;;;;;GAOG;AACH,wBAAgB,WAAW,CAAC,OAAO,EAAE,GAAG,EAAE,MAAM,EAAE,MAAM,EAAE,EAAE,KAAK,EAAE,MAAM,UAuBxE;AAyDD,wBAAgB,eAAe,CAAC,KAAK,EAAE,MAAM,UAK5C;AAwJD;;;;;;;;;;GAUG;AACH,wBAAgB,QAAQ,CAAC,CAAC,EAAE,GAAG,EAAE,CAAC,EAAE,GAAG,EAAE,CAAC,EAAE,GAAG,YA4B9C;AAED;;;;;;;;;;GAUG;AACH,wBAAgB,QAAQ,CAAC,CAAC,EAAE,GAAG,EAAE,CAAC,EAAE,GAAG,EAAE,CAAC,EAAE,GAAG,YAuB9C"}
+{"version":3,"file":"color.d.ts","sourceRoot":"","sources":["../../../src/utils/color.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AACH,wBAAgB,sBAAsB,CACpC,MAAM,EAAE,MAAM,GAAG,MAAM,EAAE,EACzB,MAAM,EAAE,MAAM,GACb,MAAM,EAAE,CAwBV;AA6ED,QAAA,MAAM,WAAW,mKAkBP,CAAC;AAEX,MAAM,MAAM,KAAK,GAAG,CAAC,OAAO,WAAW,CAAC,CAAC,MAAM,CAAC,CAAC;AAEjD;;;;;;;GAOG;AACH,wBAAgB,WAAW,CAAC,OAAO,EAAE,GAAG,EAAE,MAAM,EAAE,MAAM,EAAE,EAAE,KAAK,EAAE,MAAM,UAuBxE;AAyDD,wBAAgB,eAAe,CAAC,KAAK,EAAE,MAAM,UAK5C;AAwJD;;;;;;;;;;GAUG;AACH,wBAAgB,QAAQ,CAAC,CAAC,EAAE,GAAG,EAAE,CAAC,EAAE,GAAG,EAAE,CAAC,EAAE,GAAG,YA4B9C;AAED;;;;;;;;;;GAUG;AACH,wBAAgB,QAAQ,CAAC,CAAC,EAAE,GAAG,EAAE,CAAC,EAAE,GAAG,EAAE,CAAC,EAAE,GAAG,YAuB9C"}

package/dist/cjs/utils/color.js

@@ -1,6 +1,103 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.HSLtoRGB = exports.rgbToHsl = exports.namedColorToHex = exports.selectColor = void 0;
+exports.HSLtoRGB = exports.rgbToHsl = exports.namedColorToHex = exports.selectColor = exports.generateArrayFromColor = void 0;
+/**
+ * Generates an array of colors by interpolating between colors in the given array.
+ * @param colors - The array of colors to interpolate between.
+ * @param length - The desired length of the resulting array.
+ */
+function generateArrayFromColor(colors, length) {
+    if (typeof colors === 'string') {
+        return monochromaticInterpolation(colors, length);
+    }
+    if (colors.length === 1) {
+        return monochromaticInterpolation(colors[0], length);
+    }
+    const pairs = colors.length - 1;
+    const needed = length - colors.length;
+    const baseAmount = Math.floor(needed / pairs);
+    const extras = needed % pairs;
+    let result = [];
+    let i = 0;
+    let j = 1;
+    while (j < colors.length) {
+        const additional = i < extras ? 1 : 0;
+        const interpLength = 2 + baseAmount + additional;
+        const interp = interpolateBetween(colors[i], colors[j], interpLength);
+        const lastIndex = j === colors.length - 1 ? undefined : -1;
+        result = result.concat(interp.slice(0, lastIndex));
+        i++;
+        j++;
+    }
+    return result;
+}
+exports.generateArrayFromColor = generateArrayFromColor;
+function hexToRgb(hex) {
+    const r = parseInt(hex.substring(1, 3), 16);
+    const g = parseInt(hex.substring(3, 5), 16);
+    const b = parseInt(hex.substring(5, 7), 16);
+    return { r, g, b };
+}
+function rgbToHex(rgb) {
+    const rHex = rgb.r.toString(16).padStart(2, '0');
+    const gHex = rgb.g.toString(16).padStart(2, '0');
+    const bHex = rgb.b.toString(16).padStart(2, '0');
+    return `#${rHex}${gHex}${bHex}`;
+}
+function colorToHSL(color) {
+    const colorHex = namedColorToHex(color);
+    const { r, g, b } = hexToRgb(colorHex);
+    return rgbToHsl(r, g, b);
+}
+/**
+ * Interpolates between two colors using HSL color space.
+ * @param leftColor - The left color in hexadecimal format.
+ * @param rightColor - The right color in hexadecimal format.
+ * @param length - The number of interpolated colors to generate between the
+ * left and right colors.
+ */
+function interpolateBetween(leftColor, rightColor, length = 3) {
+    const [h, s, _l] = colorToHSL(leftColor);
+    const [h2, s2, _l2] = colorToHSL(rightColor);
+    const hues = linspace(h, h2, length);
+    const saturations = linspace(s, s2, length);
+    const lightnesses = linspace(_l, _l2, length);
+    return Array.from({ length }).map((_, i) => {
+        const [r, g, b] = HSLtoRGB(hues[i], saturations[i], lightnesses[i]);
+        return rgbToHex({ r: Math.round(r), g: Math.round(g), b: Math.round(b) });
+    });
+}
+/**
+ * Generates monochromatic interpolation of a given color.
+ * @param color - The base color in hexadecimal format.
+ * @param length - The number of interpolated colors to generate.
+ */
+function monochromaticInterpolation(color, length) {
+    const [h, s, _l] = colorToHSL(color);
+    const hues = linspace(h, h, length);
+    const saturations = linspace(s, s, length);
+    const lightnesses = linspace(0.6, 0.9, length);
+    return Array.from({ length }).map((_, i) => {
+        const [r, g, b] = HSLtoRGB(hues[i], saturations[i], lightnesses[i]);
+        return rgbToHex({ r: Math.round(r), g: Math.round(g), b: Math.round(b) });
+    });
+}
+/**
+ * Generates an array of numbers linearly spaced between start and end.
+ * @param start - The starting number of the sequence.
+ * @param end - The end number of the sequence.
+ * @param num - The number of samples to generate.
+ */
+function linspace(start, end, num) {
+    if (num <= 1)
+        return [start];
+    const step = (end - start) / (num - 1);
+    const result = new Array(num);
+    for (let i = 0; i < num; i++) {
+        result[i] = start + step * i;
+    }
+    return result;
+}
 const colorValues = [
     'red',
     'orange',

package/dist/cjs/utils/valueFormatter.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"valueFormatter.d.ts","sourceRoot":"","sources":["../../../src/utils/valueFormatter.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,KAAK,UAAU,EAAE,MAAM,cAAc,CAAC;AAE/C,KAAK,KAAK,GAAG;IACX,GAAG,EAAE,MAAM,CAAC;IACZ,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,UAAU,CAAC;CACpB,CAAC;AAEF,KAAK,KAAK,GAAG;IACX,KAAK,EAAE,GAAG,CAAC;IACX,KAAK,EAAE,MAAM,GAAG,SAAS,GAAG,IAAI,CAAC;IACjC,MAAM,EAAE,KAAK,EAAE,CAAC;CACjB,CAAC;AAEF,eAAO,MAAM,iBAAiB,UAQ7B,CAAC;AAEF;;GAEG;AACH,eAAO,MAAM,cAAc,6BAA8B,KAAK,KAAG,MAwChE,CAAC;AAEF,eAAO,MAAM,WAAW;WAIf,GAAG;YACF,MAAM;MACZ,MAoCH,CAAC;AAmJF,eAAO,MAAM,aAAa;;;;WAGhB,MAAM,KACb,MA2BF,CAAC"}
+{"version":3,"file":"valueFormatter.d.ts","sourceRoot":"","sources":["../../../src/utils/valueFormatter.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,KAAK,UAAU,EAAE,MAAM,cAAc,CAAC;AAE/C,KAAK,KAAK,GAAG;IACX,GAAG,EAAE,MAAM,CAAC;IACZ,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,UAAU,CAAC;CACpB,CAAC;AAEF,KAAK,KAAK,GAAG;IACX,KAAK,EAAE,GAAG,CAAC;IACX,KAAK,EAAE,MAAM,GAAG,SAAS,GAAG,IAAI,CAAC;IACjC,MAAM,EAAE,KAAK,EAAE,CAAC;CACjB,CAAC;AAEF,eAAO,MAAM,iBAAiB,UAQ7B,CAAC;AAEF;;GAEG;AACH,eAAO,MAAM,cAAc,6BAA8B,KAAK,KAAG,MAwChE,CAAC;AAEF,eAAO,MAAM,WAAW;WAIf,GAAG;YACF,MAAM;MACZ,MAoCH,CAAC;AAyKF,eAAO,MAAM,aAAa;;;;WAGhB,MAAM,KACb,MAoCF,CAAC"}

package/dist/cjs/utils/valueFormatter.js

@@ -223,6 +223,26 @@ const format_wo_yyyy = (value) => {
         return 'Invalid date';
     return `${(0, date_fns_1.getWeek)(utcDate)},${utcDate.getFullYear()}`;
 };
+/**
+ * Parses a numeric string back into a number, taking into account that
+ * users in different locales will format numbers differently (eg. 1,234 means
+ * something different from 1.234 in different countries).
+ *
+ * see: https://stackoverflow.com/a/45309230/9566888
+ */
+function parseNumber(value) {
+    if (typeof value === 'number')
+        return value;
+    if (typeof value !== 'string')
+        return Number.NaN;
+    const example = localeFormatter.format(1.1);
+    const cleanPattern = new RegExp(`[^-+0-9${example.charAt(1)}]`, 'g');
+    const cleaned = value.replace(cleanPattern, '');
+    const normalized = cleaned.replace(example.charAt(1), '.');
+    return parseFloat(normalized);
+}
+// Moved this out of parseNumber for perf reasons
+const localeFormatter = Intl.NumberFormat(typeof navigator !== 'undefined' ? navigator.language : 'en-US');
 const compareValues = (a, b, column) => {
     const valueA = a[column];
     const valueB = b[column];
@@ -236,9 +256,19 @@ const compareValues = (a, b, column) => {
     else if (valueB === null) {
         return 1; // ValueB is null, consider it smaller
     }
+    // Undefined checks
+    if (valueA === undefined && valueB === undefined) {
+        return 0; // Both values are undefined, consider them equal
+    }
+    else if (valueA === undefined) {
+        return -1; // ValueA is undefined, consider it smaller
+    }
+    else if (valueB === undefined) {
+        return 1; // ValueB is undefined, consider it smaller
+    }
     // For numbers
-    if (!isNaN(valueA) && !isNaN(valueB)) {
-        return valueA - valueB;
+    if (!isNaN(parseNumber(valueA)) && !isNaN(parseNumber(valueB))) {
+        return parseNumber(valueA) - parseNumber(valueB);
     }
     // For dates
     const dateA = new Date(valueA);

package/dist/esm/Chart.d.ts

@@ -94,6 +94,12 @@ export interface ChartProps {
      * ```
      */
     mapColorsToFields?: (dashboardItem: DashboardItem, theme: QuillTheme) => ColorMapType;
+    /**
+     * Styles the top-level container of the Chart.
+     *
+     * This can be useful for TailwindCSS-style classname strings.
+     */
+    className?: string;
     /**
      * Styles the top-level container of the Chart.
      */

package/dist/esm/Chart.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Chart.d.ts","sourceRoot":"","sources":["../../src/Chart.tsx"],"names":[],"mappings":";AAWA,OAAO,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAC;AAgB7C,OAAO,EAAE,KAAK,aAAa,EAAE,MAAM,aAAa,CAAC;AA+FjD,wBAAgB,gBAAgB,CAAC,aAAa,EAAE,GAAG,EAAE,OAAO,EAAE,GAAG,WAQhE;AAED,MAAM,MAAM,YAAY,GAAG;IACzB,CAAC,GAAG,EAAE,MAAM,GAAG;QACb,OAAO,EAAE,MAAM,CAAC;QAChB,UAAU,CAAC,EAAE,MAAM,CAAC;QACpB,oBAAoB,CAAC,EAAE,MAAM,CAAC;QAC9B,mBAAmB,CAAC,EAAE,MAAM,CAAC;QAC7B,uBAAuB,CAAC,EAAE,MAAM,CAAC;QACjC,sBAAsB,CAAC,EAAE,MAAM,CAAC;KACjC,CAAC;CACH,CAAC;AAeF;;GAEG;AACH,MAAM,WAAW,UAAU;IACzB;;;;;;;OAOG;IACH,MAAM,CAAC,EAAE,aAAa,GAAG,GAAG,CAAC;IAE7B;;;;;;;;OAQG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IAEjB;;;;;OAKG;IACH,MAAM,CAAC,EAAE,MAAM,EAAE,CAAC;IAElB;;OAEG;IACH,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAE5B;;OAEG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IAEpB;;OAEG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IAEpB;;OAEG;IACH,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAE5B;;OAEG;IACH,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAE9B;;;OAGG;IACH,mBAAmB,CAAC,EAAE,OAAO,GAAG,QAAQ,CAAC;IAEzC;;;;;;;;;;;;;;;;;;;;;;;;;OAyBG;IACH,iBAAiB,CAAC,EAAE,CAClB,aAAa,EAAE,aAAa,EAC5B,KAAK,EAAE,UAAU,KACd,YAAY,CAAC;IAElB;;OAEG;IACH,cAAc,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;CACtC;AAED;;;;;;;;;;;;;;;;;;;GAmBG;AACH,QAAA,MAAM,KAAK,UAAW,UAAU,4CAqC/B,CAAC;AA+hBF,eAAe,KAAK,CAAC"}
+{"version":3,"file":"Chart.d.ts","sourceRoot":"","sources":["../../src/Chart.tsx"],"names":[],"mappings":";AAWA,OAAO,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAC;AAgB7C,OAAO,EAAE,KAAK,aAAa,EAAE,MAAM,aAAa,CAAC;AAgGjD,wBAAgB,gBAAgB,CAAC,aAAa,EAAE,GAAG,EAAE,OAAO,EAAE,GAAG,WAQhE;AAED,MAAM,MAAM,YAAY,GAAG;IACzB,CAAC,GAAG,EAAE,MAAM,GAAG;QACb,OAAO,EAAE,MAAM,CAAC;QAChB,UAAU,CAAC,EAAE,MAAM,CAAC;QACpB,oBAAoB,CAAC,EAAE,MAAM,CAAC;QAC9B,mBAAmB,CAAC,EAAE,MAAM,CAAC;QAC7B,uBAAuB,CAAC,EAAE,MAAM,CAAC;QACjC,sBAAsB,CAAC,EAAE,MAAM,CAAC;KACjC,CAAC;CACH,CAAC;AAeF;;GAEG;AACH,MAAM,WAAW,UAAU;IACzB;;;;;;;OAOG;IACH,MAAM,CAAC,EAAE,aAAa,GAAG,GAAG,CAAC;IAE7B;;;;;;;;OAQG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IAEjB;;;;;OAKG;IACH,MAAM,CAAC,EAAE,MAAM,EAAE,CAAC;IAElB;;OAEG;IACH,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAE5B;;OAEG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IAEpB;;OAEG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IAEpB;;OAEG;IACH,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAE5B;;OAEG;IACH,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAE9B;;;OAGG;IACH,mBAAmB,CAAC,EAAE,OAAO,GAAG,QAAQ,CAAC;IAEzC;;;;;;;;;;;;;;;;;;;;;;;;;OAyBG;IACH,iBAAiB,CAAC,EAAE,CAClB,aAAa,EAAE,aAAa,EAC5B,KAAK,EAAE,UAAU,KACd,YAAY,CAAC;IAElB;;;;OAIG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB;;OAEG;IACH,cAAc,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;CACtC;AAED;;;;;;;;;;;;;;;;;;;GAmBG;AACH,QAAA,MAAM,KAAK,UAAW,UAAU,4CAsC/B,CAAC;AAyiBF,eAAe,KAAK,CAAC"}