@quillsql/react 2.10.38 → 2.11.0

package/dist/cjs/SQLEditor.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SQLEditor.d.ts","sourceRoot":"","sources":["../../src/SQLEditor.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAmD,MAAM,OAAO,CAAC;AAQxE,OAAO,EAAE,mBAAmB,EAAE,MAAM,2BAA2B,CAAC;AAGhE,wBAAgB,qBAAqB,CAAC,MAAM,KAAA;;;;;EAwE3C;AA2BD,UAAU,oBAAoB;IAC5B,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,KAAK,EAAE,MAAM,CAAC;CACf;AAED,UAAU,cAAc;IACtB,cAAc,EAAE,KAAK,CAAC,aAAa,CAAC;IAEpC,eAAe,CAAC,EAAE,CAAC,KAAK,EAAE,oBAAoB,KAAK,GAAG,CAAC,OAAO,CAAC;IAC/D,wBAAwB,CAAC,EAAE,CAAC,KAAK,EAAE,oBAAoB,KAAK,GAAG,CAAC,OAAO,CAAC;IAExE,kBAAkB,CAAC,EAAE,CAAC,KAAK,EAAE,uBAAuB,KAAK,GAAG,CAAC,OAAO,CAAC;IACrE,cAAc,CAAC,EAAE,CAAC,KAAK,EAAE,mBAAmB,KAAK,GAAG,CAAC,OAAO,CAAC;IAC7D,gBAAgB,CAAC,EAAE,MAAM,GAAG,CAAC,OAAO,CAAC;IACrC,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACxC,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;IACxC,eAAe,CAAC,EAAE,CAAC,OAAO,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;IAC9C,cAAc,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;IAC5C,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAC9B,sBAAsB,CAAC,EAAE,OAAO,CAAC;IACjC,oBAAoB,CAAC,EAAE,OAAO,CAAC;IAC/B,wBAAwB,CAAC,EAAE,OAAO,CAAC;IACnC,oBAAoB,CAAC,EAAE,MAAM,CAAC;IAC9B,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,aAAa,CAAC,EAAE,GAAG,CAAC;IACpB,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,uBAAuB,CAAC,EAAE,MAAM,CAAC;IACjC,yBAAyB,CAAC,EAAE,MAAM,CAAC;IACnC,wBAAwB,CAAC,EAAE,MAAM,IAAI,CAAC;IACtC,gBAAgB,CAAC,EAAE,MAAM,CAAC;CAC3B;AAQD,UAAU,uBAAuB;IAC/B,QAAQ,EAAE,CAAC,CAAC,EAAE,GAAG,KAAK,IAAI,CAAC;IAC3B,KAAK,EAAE,MAAM,CAAC;IACd,EAAE,EAAE,MAAM,CAAC;IACX,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB;AA+ED,MAAM,CAAC,OAAO,UAAU,WAAW,CAAC,EAClC,cAAoC,EACpC,eAAe,EACf,wBAAwB,EACxB,kBAAkB,EAClB,cAA2B,EAC3B,eAAuB,EACvB,gBAAgB,EAChB,YAAY,EACZ,aAAa,EACb,YAAY,EACZ,eAAe,EACf,cAAc,EACd,UAAkB,EAClB,mBAA2B,EAC3B,sBAA8B,EAC9B,oBAA4B,EAC5B,wBAAgC,EAChC,oBAAoB,EACpB,iBAAiB,EACjB,uBAAuB,EACvB,wBAAwB,EACxB,yBAA8C,EAC9C,aAAyB,EACzB,gBAA4B,GAC7B,EAAE,cAAc,2CAyUhB;AA8LD,eAAO,MAAM,mBAAmB;;;;;;6CAqG/B,CAAC"}
+{"version":3,"file":"SQLEditor.d.ts","sourceRoot":"","sources":["../../src/SQLEditor.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAmD,MAAM,OAAO,CAAC;AAQxE,OAAO,EAAE,mBAAmB,EAAE,MAAM,2BAA2B,CAAC;AAGhE,wBAAgB,qBAAqB,CAAC,MAAM,KAAA;;;;;EAwE3C;AA2BD,UAAU,oBAAoB;IAC5B,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,KAAK,EAAE,MAAM,CAAC;CACf;AAED,UAAU,cAAc;IACtB,cAAc,EAAE,KAAK,CAAC,aAAa,CAAC;IAEpC,eAAe,CAAC,EAAE,CAAC,KAAK,EAAE,oBAAoB,KAAK,GAAG,CAAC,OAAO,CAAC;IAC/D,wBAAwB,CAAC,EAAE,CAAC,KAAK,EAAE,oBAAoB,KAAK,GAAG,CAAC,OAAO,CAAC;IAExE,kBAAkB,CAAC,EAAE,CAAC,KAAK,EAAE,uBAAuB,KAAK,GAAG,CAAC,OAAO,CAAC;IACrE,cAAc,CAAC,EAAE,CAAC,KAAK,EAAE,mBAAmB,KAAK,GAAG,CAAC,OAAO,CAAC;IAC7D,gBAAgB,CAAC,EAAE,MAAM,GAAG,CAAC,OAAO,CAAC;IACrC,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACxC,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;IACxC,eAAe,CAAC,EAAE,CAAC,OAAO,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;IAC9C,cAAc,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;IAC5C,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAC9B,sBAAsB,CAAC,EAAE,OAAO,CAAC;IACjC,oBAAoB,CAAC,EAAE,OAAO,CAAC;IAC/B,wBAAwB,CAAC,EAAE,OAAO,CAAC;IACnC,oBAAoB,CAAC,EAAE,MAAM,CAAC;IAC9B,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,aAAa,CAAC,EAAE,GAAG,CAAC;IACpB,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,uBAAuB,CAAC,EAAE,MAAM,CAAC;IACjC,yBAAyB,CAAC,EAAE,MAAM,CAAC;IACnC,wBAAwB,CAAC,EAAE,MAAM,IAAI,CAAC;IACtC,gBAAgB,CAAC,EAAE,MAAM,CAAC;CAC3B;AAQD,UAAU,uBAAuB;IAC/B,QAAQ,EAAE,CAAC,CAAC,EAAE,GAAG,KAAK,IAAI,CAAC;IAC3B,KAAK,EAAE,MAAM,CAAC;IACd,EAAE,EAAE,MAAM,CAAC;IACX,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB;AA+ED,MAAM,CAAC,OAAO,UAAU,WAAW,CAAC,EAClC,cAAoC,EACpC,eAAe,EACf,wBAAwB,EACxB,kBAAkB,EAClB,cAA2B,EAC3B,eAAuB,EACvB,gBAAgB,EAChB,YAAY,EACZ,aAAa,EACb,YAAY,EACZ,eAAe,EACf,cAAc,EACd,UAAkB,EAClB,mBAA2B,EAC3B,sBAA8B,EAC9B,oBAA4B,EAC5B,wBAAgC,EAChC,oBAAoB,EACpB,iBAAiB,EACjB,uBAAuB,EACvB,wBAAwB,EACxB,yBAA8C,EAC9C,aAAyB,EACzB,gBAA4B,GAC7B,EAAE,cAAc,2CAkVhB;AA8LD,eAAO,MAAM,mBAAmB;;;;;;6CAqG/B,CAAC"}

package/dist/cjs/SQLEditor.js

@@ -242,6 +242,15 @@ function QueryEditor({ containerStyle = { height: '100vh' }, ButtonComponent, Se
             if (resp.rows.length === 0) {
                 setErrorMessage('No data found');
             }
+            // stringify all rows that are either jsonb or json
+            resp.rows = resp.rows.map((row) => {
+                for (const key in row) {
+                    if (typeof row[key] === 'object') {
+                        row[key] = JSON.stringify(row[key]);
+                    }
+                }
+                return row;
+            });
             setRows(resp.rows && resp.rows.length ? resp.rows : []);
             if (onChangeData) {
                 onChangeData(resp.rows && resp.rows.length ? resp.rows : []);

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

@@ -1,5 +1,5 @@
 /// <reference types="react" />
-export default function LineChart({ colors, yAxisFields, data, containerStyle, xAxisField, xAxisFormat, theme, comparison, isAnimationActive, hideXAxis, hideYAxis, hideCartesianGrid, }: {
+export default function LineChart({ colors, yAxisFields, data, containerStyle, xAxisField, xAxisFormat, theme, comparison, isAnimationActive, hideXAxis, hideYAxis, hideCartesianGrid, dashedComparison, customPrimaryColor, customComparisonColor, singlePointStyle, }: {
     colors?: string[];
     yAxisFields: any[];
     data: any[];
@@ -13,5 +13,9 @@ export default function LineChart({ colors, yAxisFields, data, containerStyle, x
     hideXAxis: boolean;
     hideYAxis: boolean;
     hideCartesianGrid: boolean;
+    dashedComparison: boolean;
+    customPrimaryColor: string | undefined;
+    customComparisonColor: string | undefined;
+    singlePointStyle: 'dot' | 'line';
 }): import("react/jsx-runtime").JSX.Element | null;
 //# sourceMappingURL=LineChart.d.ts.map

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

@@ -1 +1 @@
-{"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,CAAC,EAAE,MAAM,EAAE,CAAC;IAClB,WAAW,EAAE,GAAG,EAAE,CAAC;IACnB,IAAI,EAAE,GAAG,EAAE,CAAC;IACZ,cAAc,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IACrC,UAAU,EAAE,MAAM,CAAC;IACnB,UAAU,EAAE,MAAM,CAAC;IACnB,WAAW,EAAE,MAAM,CAAC;IACpB,KAAK,EAAE,GAAG,CAAC;IACX,UAAU,EAAE,GAAG,CAAC;IAChB,iBAAiB,EAAE,OAAO,CAAC;IAC3B,SAAS,EAAE,OAAO,CAAC;IACnB,SAAS,EAAE,OAAO,CAAC;IACnB,iBAAiB,EAAE,OAAO,CAAC;CAC5B,kDAoMA"}
+{"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,EACzB,gBAAwB,EACxB,kBAA8B,EAC9B,qBAAiC,EACjC,gBAAwB,GACzB,EAAE;IACD,MAAM,CAAC,EAAE,MAAM,EAAE,CAAC;IAClB,WAAW,EAAE,GAAG,EAAE,CAAC;IACnB,IAAI,EAAE,GAAG,EAAE,CAAC;IACZ,cAAc,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IACrC,UAAU,EAAE,MAAM,CAAC;IACnB,UAAU,EAAE,MAAM,CAAC;IACnB,WAAW,EAAE,MAAM,CAAC;IACpB,KAAK,EAAE,GAAG,CAAC;IACX,UAAU,EAAE,GAAG,CAAC;IAChB,iBAAiB,EAAE,OAAO,CAAC;IAC3B,SAAS,EAAE,OAAO,CAAC;IACnB,SAAS,EAAE,OAAO,CAAC;IACnB,iBAAiB,EAAE,OAAO,CAAC;IAC3B,gBAAgB,EAAE,OAAO,CAAC;IAC1B,kBAAkB,EAAE,MAAM,GAAG,SAAS,CAAC;IACvC,qBAAqB,EAAE,MAAM,GAAG,SAAS,CAAC;IAC1C,gBAAgB,EAAE,KAAK,GAAG,MAAM,CAAC;CAClC,kDAyNA"}

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

@@ -12,7 +12,7 @@ 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, }) {
+function LineChart({ colors, yAxisFields, data, containerStyle, xAxisField, xAxisFormat, theme, comparison, isAnimationActive = true, hideXAxis = false, hideYAxis = false, hideCartesianGrid = false, dashedComparison = false, customPrimaryColor = undefined, customComparisonColor = undefined, singlePointStyle = 'dot', }) {
     const [formattedData, setFormattedData] = (0, react_1.useState)([]);
     if (!yAxisFields || !yAxisFields.length) {
         return null;
@@ -21,8 +21,9 @@ function LineChart({ colors, yAxisFields, data, containerStyle, xAxisField, xAxi
         if (!data || data.length === 0) {
             return;
         }
+        let newData = data;
         if (typeof data[0][xAxisField] === 'object') {
-            const curData = data.map((d) => {
+            newData = data.map((d) => {
                 const formatted = { ...d };
                 // NEED TO FORMAT FOR BIG QUERY
                 if (d[xAxisField] && typeof d[xAxisField] === 'object') {
@@ -30,11 +31,12 @@ function LineChart({ colors, yAxisFields, data, containerStyle, xAxisField, xAxi
                 }
                 return formatted;
             });
-            setFormattedData(curData);
         }
-        else {
-            setFormattedData(data);
+        if (singlePointStyle === 'line' && newData.length == 1) {
+            const point = { ...newData[0] };
+            newData.push(point);
         }
+        setFormattedData(newData);
     }, [data]);
     if (!data || data.length === 0) {
         return ((0, jsx_runtime_1.jsx)("div", { style: {
@@ -48,6 +50,16 @@ function LineChart({ colors, yAxisFields, data, containerStyle, xAxisField, xAxi
                 color: theme.secondaryTextColor,
             }, children: "No results found for specified time period." }));
     }
+    // Allows the users to override the color scheme on a per-chart basis.
+    const getCustomColor = (index) => {
+        if (index === 0 && customPrimaryColor) {
+            return customPrimaryColor;
+        }
+        if (index === 1 && comparison && customComparisonColor) {
+            return customComparisonColor;
+        }
+        return undefined; // use the default colors from the theme
+    };
     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 ||
@@ -92,6 +104,6 @@ function LineChart({ colors, yAxisFields, data, containerStyle, xAxisField, xAxi
                                         { 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)))] }) }) }));
+                        }, 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: getCustomColor(index) ?? (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: getCustomColor(index) ?? (0, color_1.selectColor)(elem, colors, index), fill: `url(#gradient${index})`, strokeWidth: 2, dot: false, strokeDasharray: comparison && dashedComparison && index > 0 ? '5 5' : undefined, isAnimationActive: isAnimationActive }, elem.field)))] }) }) }));
 }
 exports.default = LineChart;

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

@@ -1,3 +1,3 @@
 import { TableComponentProps } from './UiComponents';
-export default function QuillTable({ rows, columns, loading, showDownloadCSVButton, downloadFileName, containerStyle, downloadCSV, LoadingComponent, }: TableComponentProps): import("react/jsx-runtime").JSX.Element;
+export default function QuillTable({ rows, columns, loading, showDownloadCSVButton, downloadFileName, containerStyle, LoadingComponent, rowsPerPage, emptyStateLabel, downloadCSV, }: TableComponentProps): import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=QuillTable.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"QuillTable.d.ts","sourceRoot":"","sources":["../../../src/components/QuillTable.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,mBAAmB,EAAE,MAAM,gBAAgB,CAAC;AAMrD,MAAM,CAAC,OAAO,UAAU,UAAU,CAAC,EACjC,IAAI,EACJ,OAAO,EACP,OAAO,EACP,qBAAqB,EACrB,gBAAgB,EAChB,cAAc,EACd,WAAW,EACX,gBAA0C,GAC3C,EAAE,mBAAmB,2CAsZrB"}
+{"version":3,"file":"QuillTable.d.ts","sourceRoot":"","sources":["../../../src/components/QuillTable.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,mBAAmB,EAAE,MAAM,gBAAgB,CAAC;AAMrD,MAAM,CAAC,OAAO,UAAU,UAAU,CAAC,EACjC,IAAI,EACJ,OAAO,EACP,OAAO,EACP,qBAAqB,EACrB,gBAAgB,EAChB,cAAc,EACd,gBAA0C,EAC1C,WAAgB,EAChB,eAAwC,EACxC,WAAW,GACZ,EAAE,mBAAmB,2CAsZrB"}

package/dist/cjs/components/QuillTable.js

@@ -8,7 +8,7 @@ const react_1 = require("react");
 const valueFormatter_1 = require("../utils/valueFormatter");
 const Context_1 = require("../Context");
 const ChartSkeleton_1 = __importDefault(require("./Chart/ChartSkeleton"));
-function QuillTable({ rows, columns, loading, showDownloadCSVButton, downloadFileName, containerStyle, downloadCSV, LoadingComponent = () => (0, jsx_runtime_1.jsx)(ChartSkeleton_1.default, {}), }) {
+function QuillTable({ rows, columns, loading, showDownloadCSVButton, downloadFileName, containerStyle, LoadingComponent = () => (0, jsx_runtime_1.jsx)(ChartSkeleton_1.default, {}), rowsPerPage = 10, emptyStateLabel = 'No results returned.', downloadCSV, }) {
     const [activeRows, setActiveRows] = (0, react_1.useState)([]);
     const [page, setPage] = (0, react_1.useState)(1);
     const [maxPage, setMaxPage] = (0, react_1.useState)(1);
@@ -28,10 +28,10 @@ function QuillTable({ rows, columns, loading, showDownloadCSVButton, downloadFil
                 return sortDirection === 'asc' ? result : -result;
             });
         }
-        const start = (page - 1) * 10;
-        const end = page * 10;
+        const start = (page - 1) * rowsPerPage;
+        const end = page * rowsPerPage;
         if (sortedRows && sortedRows.length) {
-            setMaxPage(Math.ceil(sortedRows.length / 10));
+            setMaxPage(Math.ceil(sortedRows.length / rowsPerPage));
         }
         setActiveRows(sortedRows.slice(start, end));
         setIsPaginating(false);
@@ -62,175 +62,175 @@ function QuillTable({ rows, columns, loading, showDownloadCSVButton, downloadFil
                 ...containerStyle,
             }, children: (0, jsx_runtime_1.jsx)(LoadingComponent, {}) }));
     }
-    return ((0, jsx_runtime_1.jsxs)("div", { style: {
+    return ((0, jsx_runtime_1.jsx)("div", { style: {
             width: '100%',
             height: '100%',
             overflow: 'visible',
             display: 'flex',
             flexDirection: 'column',
             ...containerStyle,
-        }, children: [(0, jsx_runtime_1.jsx)("div", { style: {
-                    height: '100%',
+        }, children: (0, jsx_runtime_1.jsx)("div", { style: {
+                height: '100%',
+                width: '100%',
+                overflow: 'auto',
+                borderRadius: 6,
+                border: '1px solid rgb(229, 231, 235)',
+                padding: 0,
+                margin: 0,
+                boxSizing: 'border-box',
+                outline: 'none',
+            }, children: (0, jsx_runtime_1.jsxs)("div", { role: "table", className: "table", style: {
+                    display: 'flex',
+                    flexDirection: 'column',
+                    minWidth: '0px',
                     width: '100%',
-                    overflow: 'auto',
-                    borderRadius: 6,
-                    border: '1px solid rgb(229, 231, 235)',
-                    padding: 0,
-                    margin: 0,
-                    boxSizing: 'border-box',
-                    outline: 'none',
-                }, children: (0, jsx_runtime_1.jsxs)("div", { role: "table", className: "table", style: { minWidth: '0px', width: '100%', height: '100%' }, children: [(0, jsx_runtime_1.jsx)("div", { className: "thead", children: (0, jsx_runtime_1.jsx)("div", { role: "row", className: "tr", style: {
-                                    display: 'flex',
-                                    flex: '1 0 auto',
-                                    minWidth: '100px',
-                                    boxSizing: 'border-box',
-                                }, children: columns && columns.map((column, index) => ((0, jsx_runtime_1.jsxs)("div", { onClick: () => toggleSort(column), style: {
-                                        boxSizing: 'border-box',
-                                        flex: '150 0 auto',
-                                        minWidth: '50px',
-                                        width: '150px',
-                                        position: 'relative',
-                                        cursor: 'pointer',
-                                        background: 'rgb(249, 250, 251)',
-                                        borderRight: index + 1 === columns.length
-                                            ? '0px solid rgb(229, 231, 235)'
-                                            : '1px solid rgb(229, 231, 235)',
-                                        borderBottom: '1px solid rgb(229, 231, 235)',
-                                        whiteSpace: 'nowrap',
-                                        alignItems: 'center',
-                                        overflowX: 'visible',
-                                        margin: '0px',
-                                        textOverflow: 'ellipsis',
-                                        minHeight: '36px',
-                                        userSelect: 'none',
-                                        paddingLeft: 16,
-                                        paddingRight: 16,
+                    height: '100%',
+                }, children: [(0, jsx_runtime_1.jsxs)("div", { style: { overflow: 'auto', flexGrow: 1 }, children: [(0, jsx_runtime_1.jsx)("div", { className: "thead", children: (0, jsx_runtime_1.jsx)("div", { role: "row", className: "tr", style: {
                                         display: 'flex',
-                                        flexDirection: 'row',
-                                        justifyContent: 'space-between',
-                                    }, children: [(0, jsx_runtime_1.jsx)("div", { "aria-haspopup": "dialog", "aria-expanded": "false", "aria-controls": "mantine-r6-dropdown", style: {
-                                                // fontFamily:
-                                                //   'Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji"',
-                                                WebkitTapHighlightColor: 'transparent',
-                                                fontFamily: theme?.fontFamily,
-                                                // color: 'rgb(55, 65, 81)',
-                                                color: theme?.primaryTextColor,
-                                                textDecoration: 'none',
-                                                fontSize: theme?.fontSizeSmall || '14px',
-                                                fontWeight: theme?.fontWeightMedium || '500',
-                                                lineHeight: '20px', // 1.25rem * 16px = 20px
-                                                textOverflow: 'ellipsis',
+                                        flex: '1 0 auto',
+                                        minWidth: '100px',
+                                        boxSizing: 'border-box',
+                                    }, children: columns &&
+                                        columns.map((column, index) => ((0, jsx_runtime_1.jsxs)("div", { onClick: () => toggleSort(column), style: {
+                                                boxSizing: 'border-box',
+                                                flex: '150 0 auto',
+                                                minWidth: '50px',
+                                                width: '150px',
+                                                position: 'relative',
+                                                cursor: 'pointer',
+                                                background: 'rgb(249, 250, 251)',
+                                                borderRight: index + 1 === columns.length
+                                                    ? '0px solid rgb(229, 231, 235)'
+                                                    : '1px solid rgb(229, 231, 235)',
+                                                borderBottom: '1px solid rgb(229, 231, 235)',
                                                 whiteSpace: 'nowrap',
-                                                overflow: 'hidden',
-                                            }, children: column.label || column.field }), column.field === sortColumn && ((0, jsx_runtime_1.jsx)("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 20 20", fill: theme?.primaryTextColor, height: "14px", width: "14px", style: {
-                                                transform: sortDirection === 'desc'
-                                                    ? 'rotate(180deg)'
-                                                    : undefined,
-                                            }, children: (0, jsx_runtime_1.jsx)("path", { fillRule: "evenodd", d: "M10 3a.75.75 0 01.75.75v10.638l3.96-4.158a.75.75 0 111.08 1.04l-5.25 5.5a.75.75 0 01-1.08 0l-5.25-5.5a.75.75 0 111.08-1.04l3.96 4.158V3.75A.75.75 0 0110 3z", clipRule: "evenodd" }) }))] }, 'sqlcol' + index))) }) }), (activeRows && activeRows.length === 0) || (columns && columns.length === 0) ? ((0, jsx_runtime_1.jsx)("div", { style: {
-                                paddingTop: '60px',
-                                display: 'flex',
-                                flex: '1 0 auto',
-                                margin: 'auto',
-                                justifyContent: 'center',
-                                alignItems: 'center',
-                                fontSize: 13,
-                                color: theme?.secondaryTextColor || 'rgb(55, 65, 81)',
-                            }, children: "No results returned." })) : ((0, jsx_runtime_1.jsx)("div", { role: "rowgroup", className: "tbody", children: activeRows && activeRows.map((row, rowIndex) => ((0, jsx_runtime_1.jsx)("div", { role: "row", className: "tr", style: {
+                                                alignItems: 'center',
+                                                overflowX: 'visible',
+                                                margin: '0px',
+                                                textOverflow: 'ellipsis',
+                                                minHeight: '36px',
+                                                userSelect: 'none',
+                                                paddingLeft: 16,
+                                                paddingRight: 16,
+                                                display: 'flex',
+                                                flexDirection: 'row',
+                                                justifyContent: 'space-between',
+                                            }, children: [(0, jsx_runtime_1.jsx)("div", { "aria-haspopup": "dialog", "aria-expanded": "false", "aria-controls": "mantine-r6-dropdown", style: {
+                                                        // fontFamily:
+                                                        //   'Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji"',
+                                                        WebkitTapHighlightColor: 'transparent',
+                                                        fontFamily: theme?.fontFamily,
+                                                        // color: 'rgb(55, 65, 81)',
+                                                        color: theme?.primaryTextColor,
+                                                        textDecoration: 'none',
+                                                        fontSize: theme?.fontSizeSmall || '14px',
+                                                        fontWeight: theme?.fontWeightMedium || '500',
+                                                        lineHeight: '20px', // 1.25rem * 16px = 20px
+                                                        textOverflow: 'ellipsis',
+                                                        whiteSpace: 'nowrap',
+                                                        overflow: 'hidden',
+                                                    }, children: column.label || column.field }), column.field === sortColumn && ((0, jsx_runtime_1.jsx)("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 20 20", fill: theme?.primaryTextColor, height: "14px", width: "14px", style: {
+                                                        transform: sortDirection === 'desc'
+                                                            ? 'rotate(180deg)'
+                                                            : undefined,
+                                                    }, children: (0, jsx_runtime_1.jsx)("path", { fillRule: "evenodd", d: "M10 3a.75.75 0 01.75.75v10.638l3.96-4.158a.75.75 0 111.08 1.04l-5.25 5.5a.75.75 0 01-1.08 0l-5.25-5.5a.75.75 0 111.08-1.04l3.96 4.158V3.75A.75.75 0 0110 3z", clipRule: "evenodd" }) }))] }, 'sqlcol' + index))) }) }), (activeRows && activeRows.length === 0) ||
+                                (columns && columns.length === 0) ? ((0, jsx_runtime_1.jsx)("div", { style: {
+                                    padding: '60px 0',
                                     display: 'flex',
                                     flex: '1 0 auto',
-                                    minWidth: '100px',
-                                    boxSizing: 'border-box',
-                                }, children: columns.map((column, columnIndex) => ((0, jsx_runtime_1.jsx)("div", { role: "cell", style: {
-                                        boxSizing: 'border-box',
-                                        flex: '150 0 auto',
-                                        minWidth: '50px',
-                                        width: '150px',
-                                        display: 'flex',
-                                        margin: '0px',
-                                        textOverflow: 'ellipsis',
-                                        minHeight: '36px',
-                                        borderRight: columnIndex + 1 === columns.length
-                                            ? '0px solid rgb(229, 231, 235)'
-                                            : '1px solid rgb(229, 231, 235)',
-                                        overflow: 'hidden',
-                                        borderTop: rowIndex > 0
-                                            ? '1px solid rgb(229, 231, 235)'
-                                            : undefined,
-                                        borderBottom: rowIndex === rows.length - 1
-                                            ? '1px solid rgb(229, 231, 235)'
-                                            : undefined,
-                                        userSelect: 'none',
-                                    }, children: (0, jsx_runtime_1.jsx)("div", { style: {
-                                            lineHeight: '24px',
-                                            width: '100%',
+                                    margin: 'auto',
+                                    justifyContent: 'center',
+                                    alignItems: 'center',
+                                    fontSize: 13,
+                                    color: theme?.secondaryTextColor || 'rgb(55, 65, 81)',
+                                }, children: emptyStateLabel })) : ((0, jsx_runtime_1.jsx)("div", { role: "rowgroup", className: "tbody", children: activeRows &&
+                                    activeRows.map((row, rowIndex) => ((0, jsx_runtime_1.jsx)("div", { role: "row", className: "tr", style: {
                                             display: 'flex',
-                                            cursor: 'default',
-                                            position: 'relative',
-                                            userSelect: 'none',
-                                        }, "data-testid": "static-cell", children: (0, jsx_runtime_1.jsx)("div", { "aria-haspopup": "dialog", "aria-expanded": "false", style: {
-                                                fontFamily: theme?.fontFamily ||
-                                                    'Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji"',
-                                                WebkitTapHighlightColor: 'transparent',
-                                                // color: 'rgb(55, 65, 81)',
-                                                color: theme?.secondaryTextColor || 'rgb(55, 65, 81)',
-                                                textDecoration: 'none',
-                                                fontWeight: 400,
-                                                fontSize: theme?.fontSizeSmall || '14px',
-                                                lineHeight: '20px',
+                                            flex: '1 0 auto',
+                                            minWidth: '100px',
+                                            boxSizing: 'border-box',
+                                        }, children: columns.map((column, columnIndex) => ((0, jsx_runtime_1.jsx)("div", { role: "cell", style: {
+                                                boxSizing: 'border-box',
+                                                flex: '150 0 auto',
+                                                minWidth: '50px',
+                                                width: '150px',
+                                                display: 'flex',
+                                                margin: '0px',
                                                 textOverflow: 'ellipsis',
-                                                whiteSpace: 'nowrap',
+                                                minHeight: '36px',
+                                                borderRight: columnIndex + 1 === columns.length
+                                                    ? '0px solid rgb(229, 231, 235)'
+                                                    : '1px solid rgb(229, 231, 235)',
                                                 overflow: 'hidden',
-                                                padding: '8px 16px',
+                                                borderTop: rowIndex > 0
+                                                    ? '1px solid rgb(229, 231, 235)'
+                                                    : undefined,
+                                                borderBottom: rowIndex === rows.length - 1
+                                                    ? '1px solid rgb(229, 231, 235)'
+                                                    : undefined,
                                                 userSelect: 'none',
-                                            }, children: row[column.field] }) }) }, 'sqlcell' + columnIndex))) }, 'sqlrow' + rowIndex))) }))] }) }), (0, jsx_runtime_1.jsx)("div", { style: { position: 'relative' }, children: (0, jsx_runtime_1.jsx)("div", { style: {
-                        display: 'flex',
-                        flex: '1 0 auto',
-                        minWidth: '100px',
-                        boxSizing: 'border-box',
-                        position: 'absolute',
-                        bottom: 0,
-                        left: 0,
-                        right: 0,
-                        height: 38,
-                        background: '#F9FAFB',
-                        borderRight: '1px solid rgb(229, 231, 235)',
-                        borderLeft: '1px solid rgb(229, 231, 235)',
-                        borderBottom: '1px solid rgb(229, 231, 235)',
-                        borderTop: '1px solid rgb(229, 231, 235)',
-                        borderBottomRightRadius: 6,
-                        borderBottomLeftRadius: 6,
-                        width: '100%',
-                    }, children: (0, jsx_runtime_1.jsxs)("div", { style: {
+                                            }, children: (0, jsx_runtime_1.jsx)("div", { style: {
+                                                    lineHeight: '24px',
+                                                    width: '100%',
+                                                    display: 'flex',
+                                                    cursor: 'default',
+                                                    position: 'relative',
+                                                    userSelect: 'none',
+                                                }, "data-testid": "static-cell", children: (0, jsx_runtime_1.jsx)("div", { "aria-haspopup": "dialog", "aria-expanded": "false", style: {
+                                                        fontFamily: theme?.fontFamily ||
+                                                            'Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji"',
+                                                        WebkitTapHighlightColor: 'transparent',
+                                                        // color: 'rgb(55, 65, 81)',
+                                                        color: theme?.secondaryTextColor ||
+                                                            'rgb(55, 65, 81)',
+                                                        textDecoration: 'none',
+                                                        fontWeight: 400,
+                                                        fontSize: theme?.fontSizeSmall || '14px',
+                                                        lineHeight: '20px',
+                                                        textOverflow: 'ellipsis',
+                                                        whiteSpace: 'nowrap',
+                                                        overflow: 'hidden',
+                                                        padding: '8px 16px',
+                                                        userSelect: 'none',
+                                                    }, children: row[column.field] }) }) }, 'sqlcell' + columnIndex))) }, 'sqlrow' + rowIndex))) }))] }), (0, jsx_runtime_1.jsx)("div", { style: {
                             display: 'flex',
-                            flexDirection: 'row',
-                            alignItems: 'center',
-                            justifyContent: 'space-between',
+                            minWidth: '100px',
+                            height: 38,
+                            borderTop: '1px solid rgb(229, 231, 235)',
+                            background: '#F9FAFB',
                             width: '100%',
-                        }, children: [showDownloadCSVButton ? ((0, jsx_runtime_1.jsx)("button", { onClick: downloadCSV, style: {
-                                    fontSize: 14,
-                                    paddingLeft: 12,
-                                    fontFamily: theme?.fontFamily,
-                                    color: theme?.primaryTextColor,
-                                    background: 'transparent',
-                                    fontWeight: 500,
-                                    cursor: 'pointer',
-                                    border: 'none',
-                                }, children: "Download CSV" })) : ((0, jsx_runtime_1.jsx)("div", {})), (0, jsx_runtime_1.jsxs)("div", { style: {
-                                    display: 'flex',
-                                    flexDirection: 'row',
-                                    alignItems: 'center',
-                                }, children: [(0, jsx_runtime_1.jsxs)("div", { style: {
-                                            fontSize: 12,
-                                            fontFamily: theme?.fontFamily,
-                                            color: theme?.primaryTextColor,
-                                        }, children: [page, ' of ', maxPage] }), (0, jsx_runtime_1.jsx)("div", { style: { width: 8 } }), (0, jsx_runtime_1.jsx)("button", { onClick: decreasePage, style: {
-                                            cursor: 'pointer',
-                                            border: 'none',
-                                            background: 'transparent',
-                                        }, children: (0, jsx_runtime_1.jsx)("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 20 20", fill: theme?.chartLabelFontFamily || theme?.fontFamily, height: "16px", width: "16px", children: (0, jsx_runtime_1.jsx)("path", { fillRule: "evenodd", d: "M12.79 5.23a.75.75 0 01-.02 1.06L8.832 10l3.938 3.71a.75.75 0 11-1.04 1.08l-4.5-4.25a.75.75 0 010-1.08l4.5-4.25a.75.75 0 011.06.02z", clipRule: "evenodd" }) }) }), (0, jsx_runtime_1.jsx)("button", { onClick: increasePage, style: {
-                                            cursor: 'pointer',
-                                            border: 'none',
-                                            background: 'transparent',
-                                        }, children: (0, jsx_runtime_1.jsx)("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 20 20", fill: theme?.chartLabelFontFamily || theme?.fontFamily, height: "16px", width: "16px", children: (0, jsx_runtime_1.jsx)("path", { fillRule: "evenodd", d: "M7.21 14.77a.75.75 0 01.02-1.06L11.168 10 7.23 6.29a.75.75 0 111.04-1.08l4.5 4.25a.75.75 0 010 1.08l-4.5 4.25a.75.75 0 01-1.06-.02z", clipRule: "evenodd" }) }) }), (0, jsx_runtime_1.jsx)("div", { style: { width: 12 } })] })] }) }) })] }));
+                        }, children: (0, jsx_runtime_1.jsxs)("div", { style: {
+                                display: 'flex',
+                                flexDirection: 'row',
+                                alignItems: 'center',
+                                justifyContent: 'space-between',
+                                width: '100%',
+                                height: 37,
+                            }, children: [showDownloadCSVButton ? ((0, jsx_runtime_1.jsx)("button", { onClick: downloadCSV, style: {
+                                        fontSize: 14,
+                                        paddingLeft: 12,
+                                        fontFamily: theme?.fontFamily,
+                                        color: theme?.primaryTextColor,
+                                        background: 'transparent',
+                                        fontWeight: 500,
+                                        cursor: 'pointer',
+                                        border: 'none',
+                                    }, children: "Download CSV" })) : ((0, jsx_runtime_1.jsx)("div", {})), (0, jsx_runtime_1.jsxs)("div", { style: {
+                                        display: 'flex',
+                                        flexDirection: 'row',
+                                        alignItems: 'center',
+                                    }, children: [(0, jsx_runtime_1.jsxs)("div", { style: {
+                                                fontSize: 12,
+                                                fontFamily: theme?.fontFamily,
+                                                color: theme?.primaryTextColor,
+                                            }, children: [page, ' of ', maxPage] }), (0, jsx_runtime_1.jsx)("div", { style: { width: 8 } }), (0, jsx_runtime_1.jsx)("button", { onClick: decreasePage, style: {
+                                                cursor: 'pointer',
+                                                border: 'none',
+                                                background: 'transparent',
+                                            }, children: (0, jsx_runtime_1.jsx)("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 20 20", fill: theme?.chartLabelFontFamily || theme?.fontFamily, height: "16px", width: "16px", children: (0, jsx_runtime_1.jsx)("path", { fillRule: "evenodd", d: "M12.79 5.23a.75.75 0 01-.02 1.06L8.832 10l3.938 3.71a.75.75 0 11-1.04 1.08l-4.5-4.25a.75.75 0 010-1.08l4.5-4.25a.75.75 0 011.06.02z", clipRule: "evenodd" }) }) }), (0, jsx_runtime_1.jsx)("button", { onClick: increasePage, style: {
+                                                cursor: 'pointer',
+                                                border: 'none',
+                                                background: 'transparent',
+                                            }, children: (0, jsx_runtime_1.jsx)("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 20 20", fill: theme?.chartLabelFontFamily || theme?.fontFamily, height: "16px", width: "16px", children: (0, jsx_runtime_1.jsx)("path", { fillRule: "evenodd", d: "M7.21 14.77a.75.75 0 01.02-1.06L11.168 10 7.23 6.29a.75.75 0 111.04-1.08l4.5 4.25a.75.75 0 010 1.08l-4.5 4.25a.75.75 0 01-1.06-.02z", clipRule: "evenodd" }) }) }), (0, jsx_runtime_1.jsx)("div", { style: { width: 12 } })] })] }) })] }) }) }));
 }
 exports.default = QuillTable;

package/dist/cjs/components/ReportBuilder/AddColumnPopover.d.ts

@@ -0,0 +1,2 @@
+export default function AddColumnPopover({ onSave, orderedColumnNames, setOrderedColumnNames, selectedColumns, setSelectedColumns, isSelectedAllColumns, clearAllState, nameToColumn, baseAst, setBaseAst, pivot, initialTableName, defaultAST, defaultTable, setPivot, TextInput, SelectColumn, SecondaryButton, Button, HandleButton, }: any): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=AddColumnPopover.d.ts.map

package/dist/cjs/components/ReportBuilder/AddColumnPopover.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AddColumnPopover.d.ts","sourceRoot":"","sources":["../../../../src/components/ReportBuilder/AddColumnPopover.tsx"],"names":[],"mappings":"AAkBA,MAAM,CAAC,OAAO,UAAU,gBAAgB,CAAC,EACvC,MAAM,EACN,kBAAkB,EAClB,qBAAqB,EACrB,eAAe,EACf,kBAAkB,EAClB,oBAAoB,EACpB,aAAa,EACb,YAAY,EACZ,OAAO,EACP,UAAU,EACV,KAAK,EACL,gBAAgB,EAChB,UAAU,EACV,YAAY,EACZ,QAAQ,EACR,SAAS,EACT,YAAY,EACZ,eAAe,EACf,MAAM,EACN,YAAY,GACb,EAAE,GAAG,2CA4LL"}