@quillsql/react 2.11.5 → 2.11.8

package/dist/esm/PieChart.js

@@ -2,133 +2,9 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 /* eslint-disable @typescript-eslint/ban-ts-comment */
 /* eslint-disable react/display-name */
 // @ts-nocheck
-import React, { useRef, useState, useEffect } from 'react';
-import { Pie, PieChart, ResponsiveContainer, Tooltip, Legend } from 'recharts';
-// const data = [
-//   {
-//     name: 'Project Nile',
-//     pct_of_the_total: 0.208266213458027,
-//   },
-//   {
-//     name: 'GA_Columbus',
-//     pct_of_the_total: 0.102192710707096,
-//   },
-//   {
-//     name: 'IN_Indianapolis',
-//     pct_of_the_total: 0.0965229750772778,
-//   },
-//   {
-//     name: 'MO_St Louis',
-//     pct_of_the_total: 0.0732235559304729,
-//   },
-//   {
-//     name: 'AL_Birmingham',
-//     pct_of_the_total: 0.0555956813239389,
-//   },
-//   {
-//     name: 'FL_Fort Myers',
-//     pct_of_the_total: 0.0479532568651074,
-//   },
-//   {
-//     name: 'GA_Macon',
-//     pct_of_the_total: 0.0431507654834117,
-//   },
-//   {
-//     name: 'NC_Charlotte',
-//     pct_of_the_total: 0.034166792944838,
-//   },
-//   {
-//     name: 'AL_Montgomery',
-//     pct_of_the_total: 0.0298663023800594,
-//   },
-//   {
-//     name: 'TN_Memphis',
-//     pct_of_the_total: 0.0292140477651036,
-//   },
-//   {
-//     name: 'SC_Greenville',
-//     pct_of_the_total: 0.0288115667542858,
-//   },
-//   {
-//     name: 'SC_Columbia',
-//     pct_of_the_total: 0.0285805316472631,
-//   },
-//   {
-//     name: 'NC_Fayetteville',
-//     pct_of_the_total: 0.0279000448849207,
-//   },
-//   {
-//     name: 'SC_Spartanburg',
-//     pct_of_the_total: 0.0260196308313896,
-//   },
-//   {
-//     name: 'NC_Greensboro',
-//     pct_of_the_total: 0.0169521323221251,
-//   },
-//   {
-//     name: 'FL_Orlando',
-//     pct_of_the_total: 0.0167433815522564,
-//   },
-//   {
-//     name: 'FL_Tampa',
-//     pct_of_the_total: 0.0155513189530513,
-//   },
-//   {
-//     name: 'NC_Raleigh',
-//     pct_of_the_total: 0.0154308010765727,
-//   },
-//   {
-//     name: 'FL_Jacksonville',
-//     pct_of_the_total: 0.0152275224173022,
-//   },
-//   {
-//     name: 'GA_LaGrange',
-//     pct_of_the_total: 0.00867900369362145,
-//   },
-//   {
-//     name: 'GA_Augusta',
-//     pct_of_the_total: 0.0084582649800033,
-//   },
-//   {
-//     name: 'TX_San Antonio',
-//     pct_of_the_total: 0.00682971823492258,
-//   },
-//   {
-//     name: 'FL_North Port',
-//     pct_of_the_total: 0.00637954051173961,
-//   },
-//   {
-//     name: 'No Portfolio',
-//     pct_of_the_total: 0.00522734435854761,
-//   },
-// ];
-const useOnWindowResize = (handler, initialWindowSize) => {
-    const [windowSize, setWindowSize] = useState(initialWindowSize);
-    useEffect(() => {
-        const handleResize = () => {
-            setWindowSize(window.innerWidth);
-            handler();
-        };
-        handleResize();
-        window.addEventListener('resize', handleResize);
-        return () => window.removeEventListener('resize', handleResize);
-    }, [handler, windowSize]);
-};
-const ChartLegend = (categories, colors) => {
-    const legendRef = useRef(null);
-    //   useOnWindowResize(() => {
-    //     const calculateHeight = (height: number | undefined) =>
-    //       height
-    //         ? Number(height) + 20 // 20px extra padding
-    //         : 60; // default height
-    //     setLegendHeight(calculateHeight(legendRef.current?.clientHeight));
-    //   });
-    return (_jsx("div", { ref: legendRef, className: "qq-flex qq-items-center qq-justify-end", children: _jsx(Legend
-        // @ts-ignore
-        , { 
-            // @ts-ignore
-            categories: categories, colors: colors }) }));
-};
+import React from 'react';
+import { Pie, PieChart, ResponsiveContainer, Tooltip } from 'recharts';
+import { namedColorToHex, rgbToHsl as RGBToHSL, HSLtoRGB } from './utils/color';
 const iconVariantValues = [
     'simple',
     'light',
@@ -185,16 +61,6 @@ const alignItemsValues = [
 ];
 export const defaultValueFormatter = (value) => (value * 1).toFixed(1) + '%';
 export const sumNumericArray = (arr) => arr.reduce((prefixSum, num) => prefixSum + num, 0);
-// export const parseData = (data: any[], colors: any[]) =>
-//   data.map((dataPoint: any, idx: number) => {
-//     const baseColor = idx < colors.length ? colors[idx] : BaseColors.Gray;
-//     const hexCode = hexColors[baseColor ?? BaseColors.Gray];
-//     return {
-//       ...dataPoint,
-//       color: colors[idx],
-//       fill: colors[idx],
-//     };
-//   });
 // @ts-ignore
 export const parseData = (data, colors, categoryKey, valueKey) => {
     const maxItems = 20;
@@ -243,17 +109,14 @@ export const ChartTooltipFrame = ({ children, theme, }) => (_jsx("div", { style:
     }, children: children }));
 export const ChartTooltipRow = ({ value, name, color, theme, }) => (_jsxs("div", { style: {
         display: 'flex',
+        gap: 8,
         alignItems: 'center',
         justifyContent: 'space-between',
         minWidth: 120,
-        // minHeight: 27,
-        // margin: '0 2rem',
     }, children: [_jsxs("div", { style: {
                 display: 'flex',
                 alignItems: 'center',
                 justifyContent: 'space-between',
-                // margin: '0 0.5rem',
-                // minWidth: 120,
             }, children: [_jsx("span", { style: {
                         background: color,
                         borderWidth: 2,
@@ -264,12 +127,7 @@ export const ChartTooltipRow = ({ value, name, color, theme, }) => (_jsxs("div",
                         boxShadow: '0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06)',
                         borderRadius: '9999px',
                         marginRight: 5,
-                    } }), _jsx("p", { 
-                    // className={twMerge(
-                    //   'font-medium tabular-nums text-right whitespace-nowrap',
-                    //   'text-[#212121] !important'
-                    // )}
-                    style: {
+                    } }), _jsx("p", { style: {
                         marginTop: 0,
                         marginBottom: 0,
                         fontFamily: theme?.fontFamily,
@@ -293,10 +151,7 @@ export const ChartTooltipRow = ({ value, name, color, theme, }) => (_jsxs("div",
 export const DonutChartTooltip = ({ active, payload, valueFormatter, theme, }) => {
     if (active && payload[0]) {
         const payloadRow = payload[0];
-        return (_jsx(ChartTooltipFrame, { theme: theme, children: _jsx("div", { 
-                //   style={{ transform: 'translateX(-120px)' }}
-                // className={twMerge('qq-px-4', 'qq-py-2')}
-                style: {
+        return (_jsx(ChartTooltipFrame, { theme: theme, children: _jsx("div", { style: {
                     paddingLeft: '1rem',
                     paddingRight: '1rem',
                     paddingTop: '8px',
@@ -305,173 +160,105 @@ export const DonutChartTooltip = ({ active, payload, valueFormatter, theme, }) =
     }
     return null;
 };
-// @ts-ignore
-export function findComplementaryAndAnalogousColors(color1, color2) {
-    // Calculate the hue of the first color
-    const color1HSL = rgbToHsl(hexToRgb(color1));
-    const color2HSL = rgbToHsl(hexToRgb(color2));
-    const color1Hue = color1HSL.h;
-    // Calculate the complementary color of the first color
-    const complementaryHue = (color1Hue + 180) % 360;
-    const complementaryColor = hslToRgb({
-        h: complementaryHue,
-        s: color1HSL.s,
-        l: color1HSL.l,
-    });
-    // Find an analogous hue to the first color
-    const analogousHue1 = (color1Hue + 30) % 360;
-    const analogousHue2 = (color1Hue - 30 + 360) % 360;
-    // Convert the analogous hues back to RGB colors
-    const analogousColor1 = hslToRgb({
-        h: analogousHue1,
-        s: color1HSL.s,
-        l: color1HSL.l,
-    });
-    const analogousColor2 = hslToRgb({
-        h: analogousHue2,
-        s: color1HSL.s,
-        l: color1HSL.l,
-    });
-    // Calculate the average hue between the two colors
-    const avgHue = (color1HSL.h + color2HSL.h) / 2;
-    // Generate a new HSL object with the average hue and the same saturation and lightness as color1
-    const analogousHsl = { h: avgHue, s: color1HSL.s, l: color1HSL.l };
-    return [
-        color1,
-        color2,
-        rgbToHex(hslToRgb(analogousHsl)),
-        // rgbToHex(complementaryColor),
-        // rgbToHex(analogousColor1),
-        // rgbToHex(analogousColor2),
-    ];
-}
-// @ts-ignore
 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 };
 }
-// @ts-ignore
 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}`;
 }
-// @ts-ignore
-function rgbToHsl(rgb) {
-    const r = rgb.r / 255;
-    const g = rgb.g / 255;
-    const b = rgb.b / 255;
-    const max = Math.max(r, g, b);
-    const min = Math.min(r, g, b);
-    let h = 0, s = 0, l = (max + min) / 2;
-    if (max !== min) {
-        const d = max - min;
-        s = l > 0.5 ? d / (2 - max - min) : d / (max + min);
-        switch (max) {
-            case r:
-                h = (g - b) / d + (g < b ? 6 : 0);
-                break;
-            case g:
-                h = (b - r) / d + 2;
-                break;
-            case b:
-                h = (r - g) / d + 4;
-                break;
-        }
-        h /= 6;
-    }
-    return { h: h * 360, s: s * 100, l: l * 100 };
+function colorToHSL(color) {
+    const colorHex = namedColorToHex(color);
+    const { r, g, b } = hexToRgb(colorHex);
+    return RGBToHSL(r, g, b);
 }
-// @ts-ignore
-function hslToRgb(hsl) {
-    const h = hsl.h / 360;
-    const s = hsl.s / 100;
-    const l = hsl.l / 100;
-    let r, g, b;
-    if (s === 0) {
-        r = g = b = l;
-    }
-    else {
-        // @ts-ignore
-        const hue2rgb = (p, q, t) => {
-            if (t < 0)
-                t += 1;
-            if (t > 1)
-                t -= 1;
-            if (t < 1 / 6)
-                return p + (q - p) * 6 * t;
-            if (t < 1 / 2)
-                return q;
-            if (t < 2 / 3)
-                return p + (q - p) * (2 / 3 - t) * 6;
-            return p;
-        };
-        const q = l < 0.5 ? l * (1 + s) : l + s - l * s;
-        const p = 2 * l - q;
-        r = hue2rgb(p, q, h + 1 / 3);
-        g = hue2rgb(p, q, h);
-        b = hue2rgb(p, q, h - 1 / 3);
-    }
-    return {
-        r: Math.round(r * 255),
-        g: Math.round(g * 255),
-        b: Math.round(b * 255),
-    };
+/**
+ * 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) });
+    });
 }
-// @ts-ignore
-function generateColorGradientSteps(n, colors) {
-    const numColors = colors.length;
-    // If there are fewer than two colors, return the original array
-    if (numColors < 2) {
-        return colors;
+/**
+ * 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 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);
     }
-    // Initialize the output array with the first color
-    const output = [colors[0]];
-    // Calculate the number of gradient steps between each pair of colors
-    const stepsPerPair = Math.floor(n / (numColors - 1));
-    // Generate the gradient steps for each pair of colors
-    for (let i = 1; i < numColors; i++) {
-        const color1 = colors[i - 1];
-        const color2 = colors[i];
-        const gradientSteps = generateGradientSteps(color1, color2, stepsPerPair);
-        output.push(...gradientSteps);
+    if (colors.length === 1) {
+        return monochromaticInterpolation(colors[0], length);
     }
-    // If there are remaining steps, add the last color as a stopgap measure
-    while (output.length < n) {
-        output.push(colors[numColors - 1]);
+    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 output;
+    return result;
 }
-//@ts-ignore
-function generateGradientSteps(color1, color2, n) {
-    // Convert the colors to RGB objects
-    const rgb1 = hexToRgb(color1);
-    const rgb2 = hexToRgb(color2);
-    // Calculate the RGB color difference between the two colors
-    const diffR = rgb2.r - rgb1.r;
-    const diffG = rgb2.g - rgb1.g;
-    const diffB = rgb2.b - rgb1.b;
-    // Calculate the RGB gradient step size between the two colors
-    const stepR = diffR / (n + 1);
-    const stepG = diffG / (n + 1);
-    const stepB = diffB / (n + 1);
-    // Generate the RGB gradient steps
-    const gradientSteps = [];
-    for (let i = 1; i <= n; i++) {
-        const r = Math.round(rgb1.r + stepR * i);
-        const g = Math.round(rgb1.g + stepG * i);
-        const b = Math.round(rgb1.b + stepB * i);
-        gradientSteps.push(rgbToHex({ r, g, 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 gradientSteps;
+    return result;
 }
 const PieChartWrapper = React.forwardRef((props, ref) => {
-    const { category = 'pct_of_the_total', index = 'status', data, colors = [], variant = 'donut', valueFormatter = defaultValueFormatter, label, showLabel = true, showAnimation = true, showTooltip = true, className, containerStyle, theme, ...other } = props;
+    const { category = 'pct_of_the_total', index = 'status', data, colors = [], colorMap = {}, variant = 'donut', valueFormatter = defaultValueFormatter, label, showLabel = true, showAnimation = true, showTooltip = true, className, containerStyle, theme, ...other } = props;
     const isDonut = variant == 'donut';
-    const parsedLabelInput = parseLabelInput(label, valueFormatter, data, category);
     if (!data || data.length === 0) {
         return (_jsx("div", { style: {
                 display: 'flex',
@@ -482,52 +269,24 @@ const PieChartWrapper = React.forwardRef((props, ref) => {
                 alignItems: 'center',
                 fontSize: 13,
                 color: theme.secondaryTextColor,
+                ...containerStyle,
             }, children: "No results found for specified time period." }));
     }
-    // const newColors = generateColorGradientSteps(
-    //   data.length,
-    //   findComplementaryAndAnalogousColors(colors[0], colors[1])
-    // );
     return (_jsx("div", { ref: ref, style: {
-            ...containerStyle,
             width: '100%',
-            // height: '100%',
             display: 'flex',
             flexDirection: 'row',
             alignItems: 'center',
             boxSizing: 'content-box',
-        }, ...other, children: _jsx(ResponsiveContainer, { width: "100%", height: "100%", children: _jsxs(PieChart, { children: [_jsx(Pie
-                    //   style={{ transform: 'translateX(-120px)' }}
-                    , { 
-                        //   style={{ transform: 'translateX(-120px)' }}
-                        data: parseData(data, colors.length >= data.length
-                            ? colors
-                            : generateColorGradientSteps(Math.min(21, data.length), [
-                                ...findComplementaryAndAnalogousColors(colors[0], colors[1]),
-                                ...colors.slice(2),
-                            ]), index, category), cx: "50%", cy: "50%", startAngle: 90, endAngle: -270, innerRadius: isDonut ? '70%' : '0%', outerRadius: "100%", paddingAngle: 0, dataKey: category, nameKey: index, isAnimationActive: true }), _jsx(Tooltip, { wrapperStyle: {
+            ...containerStyle,
+        }, ...other, children: _jsx(ResponsiveContainer, { width: "100%", height: "100%", children: _jsxs(PieChart, { children: [_jsx(Pie, { data: parseData(data, (colorMap[category] &&
+                            generateArrayFromColor(colorMap[category], data.length)) ??
+                            (colors.length >= data.length
+                                ? colors
+                                : generateArrayFromColor(colors.slice(0, 2), data.length)), index, category), cx: "50%", cy: "50%", startAngle: 90, endAngle: -270, innerRadius: isDonut ? '70%' : '0%', outerRadius: "100%", paddingAngle: 0, dataKey: category, nameKey: index, isAnimationActive: true }), _jsx(Tooltip, { wrapperStyle: {
                             outline: 'none',
-                        }, content: ({ active, payload }) => (_jsx(DonutChartTooltip, { active: active, payload: payload, valueFormatter: valueFormatter, theme: theme })) })] }) }) }));
+                        }, content: ({ active, payload }) => {
+                            return (_jsx(DonutChartTooltip, { active: active, payload: payload, valueFormatter: valueFormatter, theme: theme }));
+                        } })] }) }) }));
 });
-function Legend2({ payload, colors }) {
-    return (_jsx("div", { children: payload.map((item, idx) => {
-            if (idx > 9) {
-                return null;
-            }
-            return (_jsxs("div", { children: [_jsx("div", { style: {
-                            height: 8,
-                            width: 8,
-                            borderRadius: 8,
-                            background: colors[idx],
-                            marginRight: 8,
-                            marginTop: 2,
-                        } }), _jsx("div", { style: {
-                            whiteSpace: 'nowrap',
-                            overflow: 'hidden',
-                            textOverflow: 'ellipsis',
-                            display: 'block',
-                            maxWidth: 120,
-                        }, children: item.value })] }, item.value));
-        }) }));
-}
 export default PieChartWrapper;

package/dist/esm/QuillProvider.d.ts

@@ -10,14 +10,12 @@ interface WithOrganizationId extends BaseQuillProviderProps {
     queryEndpoint?: never;
     queryHeaders?: never;
     withCredentials?: boolean;
-    databaseType: string;
 }
 interface WithQueryEndpoint extends BaseQuillProviderProps {
     organizationId?: string;
     queryEndpoint: string;
     queryHeaders: object;
     withCredentials?: boolean;
-    databaseType: string;
 }
 type QuillProviderProps = WithOrganizationId | WithQueryEndpoint;
 export interface QuillTheme {
@@ -57,6 +55,6 @@ export declare const defaultQuillTheme: {
     loadingStateBackgroundColor: string;
     hoverBackgroundColor: string;
 };
-declare const QuillProvider: ({ organizationId, publicKey, queryEndpoint, queryHeaders, environment, children, databaseType, theme, withCredentials, }: QuillProviderProps) => import("react/jsx-runtime").JSX.Element;
+declare const QuillProvider: ({ organizationId, publicKey, queryEndpoint, queryHeaders, environment, children, theme, withCredentials, }: QuillProviderProps) => import("react/jsx-runtime").JSX.Element;
 export default QuillProvider;
 //# sourceMappingURL=QuillProvider.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"QuillProvider.d.ts","sourceRoot":"","sources":["../../src/QuillProvider.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAgC,MAAM,OAAO,CAAC;AAGrD,UAAU,sBAAsB;IAC9B,SAAS,EAAE,MAAM,CAAC;IAClB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,KAAK,CAAC,EAAE,UAAU,CAAC;IACnB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AAED,UAAU,kBAAmB,SAAQ,sBAAsB;IACzD,cAAc,EAAE,MAAM,CAAC;IACvB,aAAa,CAAC,EAAE,KAAK,CAAC;IACtB,YAAY,CAAC,EAAE,KAAK,CAAC;IACrB,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,YAAY,EAAE,MAAM,CAAC;CACtB;AAED,UAAU,iBAAkB,SAAQ,sBAAsB;IACxD,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,aAAa,EAAE,MAAM,CAAC;IACtB,YAAY,EAAE,MAAM,CAAC;IACrB,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,YAAY,EAAE,MAAM,CAAC;CACtB;AAED,KAAK,kBAAkB,GAAG,kBAAkB,GAAG,iBAAiB,CAAC;AAEjE,MAAM,WAAW,UAAU;IACzB,UAAU,EAAE,MAAM,CAAC;IACnB,eAAe,EAAE,MAAM,CAAC;IACxB,oBAAoB,CAAC,EAAE,MAAM,CAAC;IAC9B,gBAAgB,EAAE,MAAM,CAAC;IACzB,kBAAkB,EAAE,MAAM,CAAC;IAC3B,oBAAoB,EAAE,MAAM,CAAC;IAC7B,eAAe,EAAE,MAAM,CAAC;IACxB,cAAc,EAAE,MAAM,CAAC;IACvB,WAAW,EAAE,MAAM,EAAE,CAAC;IACtB,WAAW,EAAE,MAAM,CAAC;IACpB,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,oBAAoB,CAAC,EAAE,MAAM,CAAC;IAC9B,WAAW,EAAE,MAAM,CAAC;IACpB,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,2BAA2B,CAAC,EAAE,MAAM,CAAC;CACtC;AAED,eAAO,MAAM,iBAAiB;;;;;;;;;;;;;;;;;CAwB7B,CAAC;AAEF,QAAA,MAAM,aAAa,6HAUhB,kBAAkB,4CAepB,CAAC;AAEF,eAAe,aAAa,CAAC"}
+{"version":3,"file":"QuillProvider.d.ts","sourceRoot":"","sources":["../../src/QuillProvider.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAgC,MAAM,OAAO,CAAC;AAGrD,UAAU,sBAAsB;IAC9B,SAAS,EAAE,MAAM,CAAC;IAClB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,KAAK,CAAC,EAAE,UAAU,CAAC;IACnB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AAED,UAAU,kBAAmB,SAAQ,sBAAsB;IACzD,cAAc,EAAE,MAAM,CAAC;IACvB,aAAa,CAAC,EAAE,KAAK,CAAC;IACtB,YAAY,CAAC,EAAE,KAAK,CAAC;IACrB,eAAe,CAAC,EAAE,OAAO,CAAC;CAC3B;AAED,UAAU,iBAAkB,SAAQ,sBAAsB;IACxD,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,aAAa,EAAE,MAAM,CAAC;IACtB,YAAY,EAAE,MAAM,CAAC;IACrB,eAAe,CAAC,EAAE,OAAO,CAAC;CAC3B;AAED,KAAK,kBAAkB,GAAG,kBAAkB,GAAG,iBAAiB,CAAC;AAEjE,MAAM,WAAW,UAAU;IACzB,UAAU,EAAE,MAAM,CAAC;IACnB,eAAe,EAAE,MAAM,CAAC;IACxB,oBAAoB,CAAC,EAAE,MAAM,CAAC;IAC9B,gBAAgB,EAAE,MAAM,CAAC;IACzB,kBAAkB,EAAE,MAAM,CAAC;IAC3B,oBAAoB,EAAE,MAAM,CAAC;IAC7B,eAAe,EAAE,MAAM,CAAC;IACxB,cAAc,EAAE,MAAM,CAAC;IACvB,WAAW,EAAE,MAAM,EAAE,CAAC;IACtB,WAAW,EAAE,MAAM,CAAC;IACpB,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,oBAAoB,CAAC,EAAE,MAAM,CAAC;IAC9B,WAAW,EAAE,MAAM,CAAC;IACpB,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,2BAA2B,CAAC,EAAE,MAAM,CAAC;CACtC;AAED,eAAO,MAAM,iBAAiB;;;;;;;;;;;;;;;;;CAwB7B,CAAC;AAEF,QAAA,MAAM,aAAa,+GAShB,kBAAkB,4CAcpB,CAAC;AAEF,eAAe,aAAa,CAAC"}

package/dist/esm/QuillProvider.js

@@ -25,7 +25,7 @@ export const defaultQuillTheme = {
     loadingStateBackgroundColor: '#F9F9FA',
     hoverBackgroundColor: '#F4F4F5',
 };
-const QuillProvider = ({ organizationId, publicKey, queryEndpoint = 'https://quill-344421.uc.r.appspot.com/cloud', queryHeaders, environment, children, databaseType, theme = defaultQuillTheme, withCredentials = false, }) => {
-    return (_jsx(ContextProvider, { initialTheme: theme, publicKey: publicKey, environment: environment, customerId: organizationId, queryEndpoint: queryEndpoint, queryHeaders: queryHeaders, withCredentials: withCredentials, databaseType: databaseType, children: children }));
+const QuillProvider = ({ organizationId, publicKey, queryEndpoint = 'https://quill-344421.uc.r.appspot.com/cloud', queryHeaders, environment, children, theme = defaultQuillTheme, withCredentials = false, }) => {
+    return (_jsx(ContextProvider, { initialTheme: theme, publicKey: publicKey, environment: environment, customerId: organizationId, queryEndpoint: queryEndpoint, queryHeaders: queryHeaders, withCredentials: withCredentials, children: children }));
 };
 export default QuillProvider;

package/dist/esm/ReportBuilder.d.ts

@@ -1,3 +1,5 @@
+/// <reference types="react" />
+import { ButtonComponentProps, HeaderProps, LabelProps, MemoizedPopoverProps, TextProps } from './components/UiComponents';
 /**
  * Quill Report Builder
  *
@@ -6,13 +8,13 @@
  * they can click a button and add that report to their dashboard or export it
  * as a CSV.
  */
-export default function ReportBuilder({ initialTableName, onAddToDashboardComplete, destinationDashboard, organizationName, Button, SecondaryButton, TextInput, Select, Table, Popover, Tabs, Checkbox, Sidebar, Container, HandleButton, SelectColumn, DraggableColumn, ButtonLoadingState, TableLoadingState, SidebarHeading, SidebarSubHeading, FilterPopover, admin, }: {
+export default function ReportBuilder({ initialTableName, onAddToDashboardComplete, destinationDashboard, organizationName, Button, SecondaryButton, TextInput, Select, Table, Popover, Tabs, Checkbox, Sidebar, Container, HandleButton, SelectColumn, DraggableColumn, ButtonLoadingState, TableLoadingState, SidebarHeading, SidebarSubHeading, FilterPopover, SortPopover, Label, Header, Text, PivotPopover, admin, hideAi, }: {
     initialTableName: string;
     onAddToDashboardComplete: () => void;
     destinationDashboard?: string;
     organizationName?: string;
-    Button?: any;
-    SecondaryButton?: any;
+    Button?: (props: ButtonComponentProps) => JSX.Element;
+    SecondaryButton?: (props: ButtonComponentProps) => JSX.Element;
     TextInput?: any;
     Select?: any;
     Table?: any;
@@ -29,6 +31,12 @@ export default function ReportBuilder({ initialTableName, onAddToDashboardComple
     SidebarHeading?: any;
     SidebarSubHeading?: any;
     FilterPopover?: any;
+    SortPopover?: any;
+    Label?: (props: LabelProps) => JSX.Element;
+    Header?: (props: HeaderProps) => JSX.Element;
+    Text?: (props: TextProps) => JSX.Element;
+    PivotPopover?: (props: MemoizedPopoverProps) => JSX.Element;
     admin?: boolean;
+    hideAi?: boolean;
 }): import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=ReportBuilder.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"ReportBuilder.d.ts","sourceRoot":"","sources":["../../src/ReportBuilder.tsx"],"names":[],"mappings":"AAwGA;;;;;;;GAOG;AACH,MAAM,CAAC,OAAO,UAAU,aAAa,CAAC,EACpC,gBAAqB,EACrB,wBAA0C,EAC1C,oBAAgC,EAChC,gBAAqB,EACrB,MAAoB,EACpB,eAAsC,EACtC,SAA0B,EAC1B,MAAoB,EACpB,KAA+B,EAC/B,OAAsB,EACtB,IAAgB,EAChB,QAA2B,EAC3B,OAAsB,EACtB,SAA2B,EAC3B,YAAgC,EAChC,YAAgC,EAChC,eAAsC,EACtC,kBAA4C,EAC5C,iBAA0C,EAC1C,cAAoC,EACpC,iBAA0C,EAC1C,aAAkC,EAClC,KAAa,GACd,EAAE;IACD,gBAAgB,EAAE,MAAM,CAAC;IACzB,wBAAwB,EAAE,MAAM,IAAI,CAAC;IACrC,oBAAoB,CAAC,EAAE,MAAM,CAAC;IAC9B,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,MAAM,CAAC,EAAE,GAAG,CAAC;IACb,eAAe,CAAC,EAAE,GAAG,CAAC;IACtB,SAAS,CAAC,EAAE,GAAG,CAAC;IAChB,MAAM,CAAC,EAAE,GAAG,CAAC;IACb,KAAK,CAAC,EAAE,GAAG,CAAC;IACZ,OAAO,CAAC,EAAE,GAAG,CAAC;IACd,IAAI,CAAC,EAAE,GAAG,CAAC;IACX,QAAQ,CAAC,EAAE,GAAG,CAAC;IACf,OAAO,CAAC,EAAE,GAAG,CAAC;IACd,SAAS,CAAC,EAAE,GAAG,CAAC;IAChB,YAAY,CAAC,EAAE,GAAG,CAAC;IACnB,YAAY,CAAC,EAAE,GAAG,CAAC;IACnB,eAAe,CAAC,EAAE,GAAG,CAAC;IACtB,kBAAkB,CAAC,EAAE,GAAG,CAAC;IACzB,iBAAiB,CAAC,EAAE,GAAG,CAAC;IACxB,cAAc,CAAC,EAAE,GAAG,CAAC;IACrB,iBAAiB,CAAC,EAAE,GAAG,CAAC;IACxB,aAAa,CAAC,EAAE,GAAG,CAAC;IACpB,KAAK,CAAC,EAAE,OAAO,CAAC;CACjB,2CAuhGA"}
+{"version":3,"file":"ReportBuilder.d.ts","sourceRoot":"","sources":["../../src/ReportBuilder.tsx"],"names":[],"mappings":";AACA,OAAO,EACL,oBAAoB,EACpB,WAAW,EACX,UAAU,EAMV,oBAAoB,EAIpB,SAAS,EACV,MAAM,2BAA2B,CAAC;AAqHnC;;;;;;;GAOG;AACH,MAAM,CAAC,OAAO,UAAU,aAAa,CAAC,EACpC,gBAAqB,EACrB,wBAA0C,EAC1C,oBAAgC,EAChC,gBAAqB,EACrB,MAAuB,EACvB,eAAyC,EACzC,SAA0B,EAC1B,MAAoB,EACpB,KAAkB,EAClB,OAAsB,EACtB,IAAgB,EAChB,QAA2B,EAC3B,OAAsB,EACtB,SAA2B,EAC3B,YAAgC,EAChC,YAAgC,EAChC,eAAsC,EACtC,kBAA4C,EAC5C,iBAA0C,EAC1C,cAAoC,EACpC,iBAA0C,EAC1C,aAAkC,EAClC,WAA8B,EAC9B,KAAqB,EACrB,MAAuB,EACvB,IAAmB,EACnB,YAA8B,EAC9B,KAAa,EACb,MAAc,GACf,EAAE;IACD,gBAAgB,EAAE,MAAM,CAAC;IACzB,wBAAwB,EAAE,MAAM,IAAI,CAAC;IACrC,oBAAoB,CAAC,EAAE,MAAM,CAAC;IAC9B,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,MAAM,CAAC,EAAE,CAAC,KAAK,EAAE,oBAAoB,KAAK,GAAG,CAAC,OAAO,CAAC;IACtD,eAAe,CAAC,EAAE,CAAC,KAAK,EAAE,oBAAoB,KAAK,GAAG,CAAC,OAAO,CAAC;IAC/D,SAAS,CAAC,EAAE,GAAG,CAAC;IAChB,MAAM,CAAC,EAAE,GAAG,CAAC;IACb,KAAK,CAAC,EAAE,GAAG,CAAC;IACZ,OAAO,CAAC,EAAE,GAAG,CAAC;IACd,IAAI,CAAC,EAAE,GAAG,CAAC;IACX,QAAQ,CAAC,EAAE,GAAG,CAAC;IACf,OAAO,CAAC,EAAE,GAAG,CAAC;IACd,SAAS,CAAC,EAAE,GAAG,CAAC;IAChB,YAAY,CAAC,EAAE,GAAG,CAAC;IACnB,YAAY,CAAC,EAAE,GAAG,CAAC;IACnB,eAAe,CAAC,EAAE,GAAG,CAAC;IACtB,kBAAkB,CAAC,EAAE,GAAG,CAAC;IACzB,iBAAiB,CAAC,EAAE,GAAG,CAAC;IACxB,cAAc,CAAC,EAAE,GAAG,CAAC;IACrB,iBAAiB,CAAC,EAAE,GAAG,CAAC;IACxB,aAAa,CAAC,EAAE,GAAG,CAAC;IACpB,WAAW,CAAC,EAAE,GAAG,CAAC;IAClB,KAAK,CAAC,EAAE,CAAC,KAAK,EAAE,UAAU,KAAK,GAAG,CAAC,OAAO,CAAC;IAC3C,MAAM,CAAC,EAAE,CAAC,KAAK,EAAE,WAAW,KAAK,GAAG,CAAC,OAAO,CAAC;IAC7C,IAAI,CAAC,EAAE,CAAC,KAAK,EAAE,SAAS,KAAK,GAAG,CAAC,OAAO,CAAC;IACzC,YAAY,CAAC,EAAE,CAAC,KAAK,EAAE,oBAAoB,KAAK,GAAG,CAAC,OAAO,CAAC;IAC5D,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,MAAM,CAAC,EAAE,OAAO,CAAC;CAClB,2CAsyGA"}