@quillsql/react 2.12.26 → 2.12.27

package/dist/cjs/Chart.d.ts

@@ -1,7 +1,9 @@
-/// <reference types="react" />
+import { ReactNode } from 'react';
 import { QuillTheme } from './QuillProvider';
 import { type QuillReport } from './Dashboard';
 import { Filter } from './models/Filter';
+import { MultiSelectComponentProps, SelectComponentProps } from './components/UiComponents';
+import { DateRangePickerComponentProps } from './DateRangePicker/QuillDateRangePicker';
 interface BaseChartProps {
     colors?: string[];
     containerStyle?: React.CSSProperties;
@@ -99,6 +101,8 @@ export interface ChartProps {
      * Whether the date range filter has been disabled.
      */
     hideDateRangeFilter?: boolean;
+    /** Whether to hide the table filters component, deafulted to true */
+    hideFilters?: boolean;
     /**
      * Whether the comparison range shows as dashed for date comparison line
      * charts (as opposed to the default solid line).
@@ -143,6 +147,16 @@ export interface ChartProps {
      * A loading component to show when the chart is loading.
      */
     LoadingComponent?: () => JSX.Element;
+    /** A select component prop for the table filters */
+    SelectComponent?: (props: SelectComponentProps) => JSX.Element;
+    /** A multi select component prop for the table filters */
+    MultiSelectComponent?: (props: MultiSelectComponentProps) => JSX.Element;
+    /** A date range picker component prop for the table filters */
+    DateRangePickerComponent?: (props: DateRangePickerComponentProps) => JSX.Element;
+    /** A filter container component component prop for the table filters */
+    FilterContainerComponent?: ({ children, }: {
+        children: ReactNode;
+    }) => JSX.Element;
     /**
      * Styles the top-level container of the Chart.
      *
@@ -199,7 +213,8 @@ interface ChartDisplayProps extends WithConfig {
     onClickChartElement?: (data: any) => void;
     dateBucket?: string;
     overrideTheme?: QuillTheme;
+    initialDateFilter?: any;
 }
-export declare const ChartDisplay: ({ reportId, config, colors, className, containerStyle, hideXAxis, hideYAxis, hideCartesianGrid, hideDateRangeFilter, hideHorizontalCartesianGrid, hideVerticalCartesianGrid, hideSubsequentXAxisTicks, cartesianGridLineStyle, cartesianGridLineColor, comparisonLineStyle, isAnimationActive, loading, paginating, error, isComparison, colorMap, LoadingComponent, onPageChange, onSortChange, onClickChartElement, dateBucket, overrideTheme, }: ChartDisplayProps) => import("react/jsx-runtime").JSX.Element;
+export declare const ChartDisplay: ({ reportId, config, colors, className, containerStyle, hideXAxis, hideYAxis, hideCartesianGrid, hideDateRangeFilter, hideHorizontalCartesianGrid, hideVerticalCartesianGrid, hideSubsequentXAxisTicks, cartesianGridLineStyle, cartesianGridLineColor, comparisonLineStyle, isAnimationActive, loading, paginating, error, isComparison, colorMap, LoadingComponent, onPageChange, onSortChange, onClickChartElement, dateBucket, overrideTheme, initialDateFilter, }: ChartDisplayProps) => import("react/jsx-runtime").JSX.Element;
 export default Chart;
 //# sourceMappingURL=Chart.d.ts.map

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

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

package/dist/cjs/Chart.js

@@ -26,6 +26,11 @@ const useTheme_1 = __importDefault(require("./hooks/useTheme"));
 const errorProcessing_1 = require("./utils/errorProcessing");
 const filterProcessing_1 = require("./utils/filterProcessing");
 const dashboard_1 = require("./utils/dashboard");
+const UiComponents_1 = require("./components/UiComponents");
+const DashboardFilter_1 = require("./components/Dashboard/DashboardFilter");
+const QuillSelect_1 = require("./components/QuillSelect");
+const QuillMultiSelect_1 = require("./components/QuillMultiSelect");
+const QuillDateRangePicker_1 = require("./DateRangePicker/QuillDateRangePicker");
 const MAX_ROWS_FOR_GENERIC_TABLE = 300;
 // @ts-ignore
 function sumByKey(arr, key) {
@@ -156,17 +161,11 @@ const Chart = (props) => {
                 ? theme.chartColors
                 : ['#4E80EE', '#E14F62', '#55B5A6', '#E9A23B', '#6466E9', '#55B685'];
     }, [data.colors]);
-    return ((0, jsx_runtime_1.jsx)(ChartUpdater, { reportId: data.reportId, className: data.className, containerStyle: data.containerStyle, colors: chartColors, isAnimationActive: data.isAnimationActive, hideXAxis: data.hideXAxis, hideYAxis: data.hideYAxis, hideCartesianGrid: data.hideCartesianGrid, hideHorizontalCartesianGrid: data.hideHorizontalCartesianGrid, hideVerticalCartesianGrid: data.hideVerticalCartesianGrid, hideSubsequentXAxisTicks: data.hideSubsequentXAxisTicks, hideDateRangeFilter: data.hideDateRangeFilter, cartesianGridLineStyle: data.cartesianGridLineStyle, cartesianGridLineColor: data.cartesianGridLineColor, comparisonLineStyle: data.comparisonLineStyle, mapColorsToFields: data.mapColorsToFields ?? fallbackMapColorsToFields, LoadingComponent: data.LoadingComponent, filters: data.filters, onClickChartElement: props.onClickChartElement }));
+    return ((0, jsx_runtime_1.jsx)(ChartUpdater, { reportId: data.reportId, className: data.className, containerStyle: data.containerStyle, colors: chartColors, isAnimationActive: data.isAnimationActive, hideXAxis: data.hideXAxis, hideYAxis: data.hideYAxis, hideCartesianGrid: data.hideCartesianGrid, hideHorizontalCartesianGrid: data.hideHorizontalCartesianGrid, hideVerticalCartesianGrid: data.hideVerticalCartesianGrid, hideSubsequentXAxisTicks: data.hideSubsequentXAxisTicks, hideDateRangeFilter: data.hideDateRangeFilter, cartesianGridLineStyle: data.cartesianGridLineStyle, cartesianGridLineColor: data.cartesianGridLineColor, comparisonLineStyle: data.comparisonLineStyle, mapColorsToFields: data.mapColorsToFields ?? fallbackMapColorsToFields, LoadingComponent: data.LoadingComponent, filters: data.filters, onClickChartElement: props.onClickChartElement, SelectComponent: data.SelectComponent, MultiSelectComponent: data.MultiSelectComponent, DateRangePickerComponent: data.DateRangePickerComponent, FilterContainerComponent: data.FilterContainerComponent, hideFilters: data.hideFilters }));
 };
-const ChartUpdater = ({ colors, reportId, className, containerStyle, isAnimationActive, hideXAxis, hideYAxis, hideCartesianGrid, hideHorizontalCartesianGrid = false, hideVerticalCartesianGrid = true, hideSubsequentXAxisTicks = false, cartesianGridLineStyle = 'solid', cartesianGridLineColor, comparisonLineStyle, hideDateRangeFilter = false, mapColorsToFields, LoadingComponent = ChartSkeleton_1.QuillLoadingSkeleton, filters, onClickChartElement, }) => {
+const ChartUpdater = ({ colors, reportId, className, containerStyle, isAnimationActive, hideXAxis, hideYAxis, hideCartesianGrid, hideHorizontalCartesianGrid = false, hideVerticalCartesianGrid = true, hideSubsequentXAxisTicks = false, cartesianGridLineStyle = 'solid', cartesianGridLineColor, comparisonLineStyle, hideDateRangeFilter = false, hideFilters = false, mapColorsToFields, LoadingComponent = ChartSkeleton_1.QuillLoadingSkeleton, SelectComponent = QuillSelect_1.QuillSelectComponent, MultiSelectComponent = QuillMultiSelect_1.QuillMultiSelectComponent, DateRangePickerComponent = QuillDateRangePicker_1.QuillDateRangePicker, FilterContainerComponent = UiComponents_1.QuillFilterContainerComponent, filters, onClickChartElement, }) => {
     const { dispatch, dashboard } = (0, react_1.useContext)(Context_1.DashboardContext);
-    const { dashboardFilters } = (0, react_1.useContext)(Context_1.DashboardFiltersContext);
-    const specificDashboardFilter = (0, react_1.useMemo)(() => {
-        return dashboardFilters.filter((f) => dashboard &&
-            dashboard[reportId] &&
-            f &&
-            f.dashboardName === dashboard[reportId].dashboardName);
-    }, [dashboardFilters, dashboard]);
+    const { reportFiltersDispatch, reportFilters } = (0, react_1.useContext)(Context_1.ReportFiltersContext);
     const [initialLoad, setInitialLoad] = (0, react_1.useState)(true);
     const [loading, setLoading] = (0, react_1.useState)(true);
     const [paginating, setPaginating] = (0, react_1.useState)(false);
@@ -179,7 +178,10 @@ const ChartUpdater = ({ colors, reportId, className, containerStyle, isAnimation
         page: 0,
     });
     const [report, setReport] = (0, react_1.useState)(undefined);
+    const [dateFilter, setDateFilter] = (0, react_1.useState)(undefined);
+    const [chartFilters, setChartFilters] = (0, react_1.useState)([]);
     const [previousPage, setPreviousPage] = (0, react_1.useState)(0);
+    const [filterUpdateIndex, setFilterUpdateIndex] = (0, react_1.useState)(-1);
     const theme = (0, useTheme_1.default)();
     const onPageChange = (page) => {
         if ((previousPage < page.currentPage &&
@@ -196,10 +198,6 @@ const ChartUpdater = ({ colors, reportId, className, containerStyle, isAnimation
     };
     const getChartDataPaginate = async (processing) => {
         setPaginating(true);
-        if (!didFiltersChange(dashboard[reportId], specificDashboardFilter)) {
-            setPaginating(false);
-            return;
-        }
         try {
             let updatedProcessing = { ...additionalProcessing, ...processing };
             if (processing && processing.sort) {
@@ -210,8 +208,8 @@ const ChartUpdater = ({ colors, reportId, className, containerStyle, isAnimation
             }
             // Remove extra fields on each filter so we don't confuse the backend.
             const allowDateRange = !hideDateRangeFilter;
-            const minimalFilters = Object.values(specificDashboardFilter).length
-                ? Object.values(specificDashboardFilter)
+            const minimalFilters = Object.values(dashboard.filters).length
+                ? Object.values(chartFilters)
                     .filter((f) => allowDateRange || f.filterType !== 'date_range')
                     .map((filter) => {
                     const newFilter = { ...filter };
@@ -257,11 +255,6 @@ const ChartUpdater = ({ colors, reportId, className, containerStyle, isAnimation
                 };
                 const cleanedReport = await (0, dashboard_1.cleanDashboardItem)(dashboardItem, filters);
                 setReport(cleanedReport);
-                dispatch({
-                    type: 'UPDATE_DASHBOARD_ITEM',
-                    id: reportId,
-                    data: cleanedReport,
-                });
                 if (mapColorsToFields) {
                     setColorMap(mapColorsToFields(cleanedReport, theme));
                 }
@@ -279,85 +272,68 @@ const ChartUpdater = ({ colors, reportId, className, containerStyle, isAnimation
             setPaginating(false);
         }
     };
-    const getChartData = async (processing) => {
-        setLoading(true);
-        if (!didFiltersChange(dashboard[reportId], specificDashboardFilter)) {
-            setLoading(false);
-            return;
-        }
+    const getChartData = async (reportFilterInfo) => {
         try {
-            let updatedProcessing = { ...additionalProcessing, ...processing };
-            if (processing && processing.sort) {
-                if (!updatedProcessing.page) {
-                    updatedProcessing.page = {};
-                }
-                updatedProcessing.page.currentPage = 0;
-            }
-            // Remove extra fields on each filter so we don't confuse the backend.
-            const allowDateRange = !hideDateRangeFilter;
-            const minimalFilters = Object.values(specificDashboardFilter).length
-                ? Object.values(specificDashboardFilter)
-                    .filter((f) => allowDateRange || f.filterType !== 'date_range')
-                    .map((filter) => {
-                    const newFilter = { ...filter };
-                    if (newFilter.filterType === 'date_range') {
-                        delete newFilter['field'];
-                        delete newFilter['options'];
-                        delete newFilter['selectedValue'];
-                    }
-                    return newFilter;
-                })
-                : [];
-            if (filters) {
-                minimalFilters.push(...filters);
+            if (filterUpdateIndex === reportFilterInfo.updateIndex) {
+                return;
             }
+            const filters = reportFilterInfo.filters;
+            setLoading(true);
             const hostedBody = {
                 metadata: {
                     dashboardItemId: reportId,
                     orgId: client.customerId || '*',
                     clientId: client.publicKey,
                     task: 'item',
-                    databaseType: client.databaseType,
-                    filters: minimalFilters.filter((f) => f.dashboardName === dashboard[reportId].dashboardName),
+                    getDefaultDashboardFilters: filters ? false : true,
+                    databaseType: client?.databaseType,
                     customFields,
-                    additionalProcessing: updatedProcessing,
-                    paginateTable: true,
+                    filters,
                 },
             };
             const cloudBody = {
                 id: reportId,
-                filters: minimalFilters.filter((f) => f.dashboardName === dashboard[reportId].dashboardName),
             };
-            setError(undefined);
-            const resp = await (0, dataFetcher_1.getData)(client, 'itempost', 'omit', hostedBody, cloudBody);
+            const resp = await (0, dataFetcher_1.getData)(client, 'itempost', 'same-origin', hostedBody, cloudBody);
             (0, errorProcessing_1.processFilterErrorList)(resp);
             if (resp && resp.name !== 'error' && !resp.errorMessage) {
                 setIsComparison(!!resp.compareRows?.length);
                 if (resp.compareRows) {
                     (0, merge_1.mergeComparisonRange)(resp);
                 }
-                const dashboardItem = {
-                    ...resp,
-                    filtersApplied: minimalFilters.filter((f) => f.dashboardName === dashboard[reportId].dashboardName),
-                };
-                const cleanedReport = await (0, dashboard_1.cleanDashboardItem)(dashboardItem, filters);
+                const cleanedReport = await (0, dashboard_1.cleanDashboardItem)(resp, filters ? filters : resp.filters);
                 if (cleanedReport.chartType === 'table' && cleanedReport.pivot) {
                     cleanedReport.columns = cleanedReport.yAxisFields;
                 }
                 setReport(cleanedReport);
-                dispatch({
-                    type: 'UPDATE_DASHBOARD_ITEM',
-                    id: reportId,
-                    data: dashboardItem,
+                let filterArray = filters;
+                // THIS SHOULD ONLY BE UNDEFINED ON INITIAL LOAD
+                if (!filterArray) {
+                    filterArray = resp.filters.map((filter) => {
+                        return (0, filterProcessing_1.processFilterFromBackend)(filter, resp.rows);
+                    });
+                    reportFiltersDispatch({
+                        type: 'UPDATE_REPORT_FILTER',
+                        id: reportId,
+                        data: {
+                            filters: filterArray,
+                            updateIndex: reportFilterInfo.updateIndex,
+                        },
+                    });
+                }
+                const dateFilter = filterArray.find((filter) => {
+                    return filter.filterType === 'date_range';
                 });
+                setFilterUpdateIndex(reportFilterInfo.updateIndex);
+                setDateFilter(dateFilter);
+                setChartFilters(filterArray);
                 if (mapColorsToFields) {
-                    setColorMap(mapColorsToFields(dashboardItem, theme));
+                    setColorMap(mapColorsToFields(resp, theme));
                 }
             }
             else {
                 setError(resp?.errorMessage);
             }
-            setAdditionProcessing(updatedProcessing);
             setLoading(false);
         }
         catch (e) {
@@ -366,12 +342,60 @@ const ChartUpdater = ({ colors, reportId, className, containerStyle, isAnimation
         }
     };
     (0, react_1.useEffect)(() => {
+        // IF WE HAVE THE DATA IN DASHBOARD CONTEXT AND IT IS THE INITIAL LAOD DON'T FETCH DATA
+        if (initialLoad && dashboard[reportId]) {
+            setInitialLoad(false);
+            return;
+        }
+        setInitialLoad(false);
+        let parsedReportFilters = reportFilters[reportId]
+            ? reportFilters[reportId]
+            : { updateIndex: 0 };
+        getChartData(parsedReportFilters);
+    }, [client.customerId, reportId, reportFilters[reportId]?.updateIndex]);
+    (0, react_1.useEffect)(() => {
+        if (!dashboard || !dashboard[reportId]) {
+            return;
+        }
         setInitialLoad(false);
-        getChartData();
-    }, [specificDashboardFilter, client, reportId]);
-    return ((0, jsx_runtime_1.jsx)(exports.ChartDisplay, { config: report, reportId: reportId, colors: colors, className: className, containerStyle: containerStyle, hideXAxis: hideXAxis, hideYAxis: hideYAxis, hideCartesianGrid: hideCartesianGrid, hideHorizontalCartesianGrid: hideHorizontalCartesianGrid, hideVerticalCartesianGrid: hideVerticalCartesianGrid, hideSubsequentXAxisTicks: hideSubsequentXAxisTicks, cartesianGridLineStyle: cartesianGridLineStyle, cartesianGridLineColor: cartesianGridLineColor, hideDateRangeFilter: hideDateRangeFilter, comparisonLineStyle: comparisonLineStyle, isAnimationActive: isAnimationActive, isComparison: isComparison, loading: loading || initialLoad, paginating: paginating, error: error, colorMap: colorMap, LoadingComponent: LoadingComponent, onPageChange: onPageChange, onSortChange: onSortChange, onClickChartElement: onClickChartElement }));
+        setLoading(false);
+        setReport(dashboard[reportId]);
+        setChartFilters(dashboard[reportId].filtersApplied);
+        const dateFilter = dashboard[reportId].filtersApplied.find((filter) => {
+            return filter.filterType === 'date_range';
+        });
+        setDateFilter(dateFilter);
+    }, []);
+    return ((0, jsx_runtime_1.jsxs)("div", { children: [!hideFilters && ((0, jsx_runtime_1.jsx)("div", { style: {
+                    display: 'flex',
+                    boxSizing: 'content-box',
+                    flexDirection: 'row',
+                    alignItems: 'center',
+                }, children: (0, jsx_runtime_1.jsx)(FilterContainerComponent, { children: chartFilters.map((filter, index) => ((0, jsx_runtime_1.jsx)(DashboardFilter_1.DashboardFilter, { filter: filter, onChangeFilter: (filter, value = null, comparison = null) => {
+                            const updatedFilters = chartFilters.map((f) => {
+                                if (f.field === filter.field ||
+                                    (f.filterType === 'date_range' &&
+                                        filter.filterType === 'date_range')) {
+                                    return (0, filterProcessing_1.updateFilter)(f, value, comparison);
+                                }
+                                return f;
+                            });
+                            setChartFilters(updatedFilters);
+                            getChartData({
+                                filters: updatedFilters,
+                                updateIndex: filterUpdateIndex + 1,
+                            });
+                            reportFiltersDispatch({
+                                type: 'UPDATE_REPORT_FILTER',
+                                id: reportId,
+                                data: {
+                                    filters: updatedFilters,
+                                    updateIndex: filterUpdateIndex + 1,
+                                },
+                            });
+                        }, theme: theme, SelectComponent: SelectComponent, MultiSelectComponent: MultiSelectComponent, DateRangePickerComponent: DateRangePickerComponent }, index))) }) })), (0, jsx_runtime_1.jsx)(exports.ChartDisplay, { config: report, reportId: reportId, colors: colors, className: className, containerStyle: containerStyle, hideXAxis: hideXAxis, hideYAxis: hideYAxis, hideCartesianGrid: hideCartesianGrid, hideHorizontalCartesianGrid: hideHorizontalCartesianGrid, hideVerticalCartesianGrid: hideVerticalCartesianGrid, hideSubsequentXAxisTicks: hideSubsequentXAxisTicks, cartesianGridLineStyle: cartesianGridLineStyle, cartesianGridLineColor: cartesianGridLineColor, hideDateRangeFilter: hideDateRangeFilter, comparisonLineStyle: comparisonLineStyle, isAnimationActive: isAnimationActive, isComparison: isComparison, loading: loading || initialLoad, paginating: paginating, error: error, colorMap: colorMap, LoadingComponent: LoadingComponent, onPageChange: onPageChange, onSortChange: onSortChange, onClickChartElement: onClickChartElement, initialDateFilter: dateFilter })] }));
 };
-const ChartDisplay = ({ reportId, config, colors, className, containerStyle, hideXAxis, hideYAxis, hideCartesianGrid, hideDateRangeFilter = false, hideHorizontalCartesianGrid = false, hideVerticalCartesianGrid = true, hideSubsequentXAxisTicks = false, cartesianGridLineStyle = 'solid', cartesianGridLineColor, comparisonLineStyle, isAnimationActive, loading = false, paginating = false, error = undefined, isComparison = false, colorMap, LoadingComponent = ChartSkeleton_1.QuillLoadingSkeleton, onPageChange, onSortChange, onClickChartElement, dateBucket, overrideTheme, }) => {
+const ChartDisplay = ({ reportId, config, colors, className, containerStyle, hideXAxis, hideYAxis, hideCartesianGrid, hideDateRangeFilter = false, hideHorizontalCartesianGrid = false, hideVerticalCartesianGrid = true, hideSubsequentXAxisTicks = false, cartesianGridLineStyle = 'solid', cartesianGridLineColor, comparisonLineStyle, isAnimationActive, loading = false, paginating = false, error = undefined, isComparison = false, colorMap, LoadingComponent = ChartSkeleton_1.QuillLoadingSkeleton, onPageChange, onSortChange, onClickChartElement, dateBucket, overrideTheme, initialDateFilter, }) => {
     const { dashboardFilters } = (0, react_1.useContext)(Context_1.DashboardFiltersContext);
     const specificDashboardFilter = (0, react_1.useMemo)(() => {
         if (!dashboardFilters) {
@@ -389,9 +413,14 @@ const ChartDisplay = ({ reportId, config, colors, className, containerStyle, hid
                 : ['#4E80EE', '#E14F62', '#55B5A6', '#E9A23B', '#6466E9', '#55B685'];
     }, [colors]);
     const rows = config?.pivotRows ?? config?.rows ?? [];
-    const dateFilter = !hideDateRangeFilter &&
-        (0, filterProcessing_1.findAndProcessDateFilter)(Object.values(specificDashboardFilter ?? []));
-    const getYAxisFields = () => {
+    const getDateFilter = () => {
+        if (!hideDateRangeFilter) {
+            return (0, filterProcessing_1.findAndProcessDateFilter)(Object.values(specificDashboardFilter));
+        }
+        return undefined;
+    };
+    const [dateFilter, setDateFilter] = (0, react_1.useState)(initialDateFilter ?? getDateFilter());
+    const getYAxisFields = (curDateFilter) => {
         if (config && config.pivot && config.pivot.columnField) {
             return (config?.pivotColumns
                 .slice(1)
@@ -411,8 +440,8 @@ const ChartDisplay = ({ reportId, config, colors, className, containerStyle, hid
             }) ?? []);
         }
         else {
-            if (dateFilter?.comparison &&
-                dateFilter.comparisonRange.value !== 'NO_COMPARISON') {
+            if (curDateFilter?.comparison &&
+                curDateFilter.comparisonRange.value !== 'NO_COMPARISON') {
                 const comparisonYAxisFields = config?.yAxisFields?.map((field) => {
                     return {
                         ...field,
@@ -429,10 +458,11 @@ const ChartDisplay = ({ reportId, config, colors, className, containerStyle, hid
             return config?.pivotColumns ?? config?.yAxisFields ?? [];
         }
     };
-    const [yAxisFields, setYAxisFields] = (0, react_1.useState)(getYAxisFields());
+    const [yAxisFields, setYAxisFields] = (0, react_1.useState)(getYAxisFields(dateFilter ?? getDateFilter()));
     (0, react_1.useEffect)(() => {
-        setYAxisFields(getYAxisFields());
-    }, [config, specificDashboardFilter]);
+        setYAxisFields(getYAxisFields(initialDateFilter ?? getDateFilter()));
+        setDateFilter(initialDateFilter ?? getDateFilter());
+    }, [config, specificDashboardFilter, initialDateFilter]);
     if (error) {
         return (0, jsx_runtime_1.jsx)(ChartError_1.default, { className: className, containerStyle: containerStyle });
     }

package/dist/cjs/Context.d.ts

@@ -19,6 +19,7 @@ export declare const ReportBuilderQueryContext: React.Context<any>;
 export declare const SavedReportsQueryContext: React.Context<any>;
 export declare const DashboardContext: React.Context<any>;
 export declare const DashboardFiltersContext: React.Context<any>;
+export declare const ReportFiltersContext: React.Context<any>;
 export declare const ChartDateFiltersContext: React.Context<any>;
 export declare const useChartDateFilters: () => {
     getChartDateFilterById: (id: string) => any;

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

@@ -1 +1 @@
-{"version":3,"file":"Context.d.ts","sourceRoot":"","sources":["../../src/Context.tsx"],"names":[],"mappings":"AAAA,OAAO,KAMN,MAAM,OAAO,CAAC;AAMf,eAAO,MAAM,iBAAiB,oBAAwC,CAAC;AACvE,eAAO,MAAM,aAAa,oBAAwC,CAAC;AACnE,eAAO,MAAM,kBAAkB,oBAAwC,CAAC;AACxE,eAAO,MAAM,cAAc,oBAA0C,CAAC;AACtE,eAAO,MAAM,WAAW,oBAA0C,CAAC;AACnE,eAAO,MAAM,2BAA2B,oBAAuC,CAAC;AAChF,eAAO,MAAM,cAAc,oBAAwC,CAAC;AACpE,eAAO,MAAM,mBAAmB,oBAAwC,CAAC;AACzE,eAAO,MAAM,2BAA2B,oBAGtC,CAAC;AACH,eAAO,MAAM,kBAAkB,oBAAwC,CAAC;AACxE,eAAO,MAAM,YAAY,oBAA0C,CAAC;AACpE,eAAO,MAAM,aAAa,oBAA0C,CAAC;AACrE,eAAO,MAAM,sCAAsC,oBAGjD,CAAC;AACH,eAAO,MAAM,0BAA0B,oBAGrC,CAAC;AACH,eAAO,MAAM,0BAA0B,oBAGrC,CAAC;AACH,eAAO,MAAM,oCAAoC,oBAG/C,CAAC;AACH,eAAO,MAAM,yBAAyB,oBAAwC,CAAC;AAC/E,eAAO,MAAM,wBAAwB,oBAAwC,CAAC;AAC9E,eAAO,MAAM,gBAAgB,oBAAwC,CAAC;AACtE,eAAO,MAAM,uBAAuB,oBAAwC,CAAC;AAC7E,eAAO,MAAM,uBAAuB,oBAAwC,CAAC;AAE7E,eAAO,MAAM,mBAAmB;iCAKM,MAAM;6BACV,MAAM,cAAc,GAAG;CAQxD,CAAC;AAkDF,eAAO,MAAM,eAAe,qIAWzB,GAAG,mDAuPL,CAAC"}
+{"version":3,"file":"Context.d.ts","sourceRoot":"","sources":["../../src/Context.tsx"],"names":[],"mappings":"AAAA,OAAO,KAMN,MAAM,OAAO,CAAC;AAMf,eAAO,MAAM,iBAAiB,oBAAwC,CAAC;AACvE,eAAO,MAAM,aAAa,oBAAwC,CAAC;AACnE,eAAO,MAAM,kBAAkB,oBAAwC,CAAC;AACxE,eAAO,MAAM,cAAc,oBAA0C,CAAC;AACtE,eAAO,MAAM,WAAW,oBAA0C,CAAC;AACnE,eAAO,MAAM,2BAA2B,oBAAuC,CAAC;AAChF,eAAO,MAAM,cAAc,oBAAwC,CAAC;AACpE,eAAO,MAAM,mBAAmB,oBAAwC,CAAC;AACzE,eAAO,MAAM,2BAA2B,oBAGtC,CAAC;AACH,eAAO,MAAM,kBAAkB,oBAAwC,CAAC;AACxE,eAAO,MAAM,YAAY,oBAA0C,CAAC;AACpE,eAAO,MAAM,aAAa,oBAA0C,CAAC;AACrE,eAAO,MAAM,sCAAsC,oBAGjD,CAAC;AACH,eAAO,MAAM,0BAA0B,oBAGrC,CAAC;AACH,eAAO,MAAM,0BAA0B,oBAGrC,CAAC;AACH,eAAO,MAAM,oCAAoC,oBAG/C,CAAC;AACH,eAAO,MAAM,yBAAyB,oBAAwC,CAAC;AAC/E,eAAO,MAAM,wBAAwB,oBAAwC,CAAC;AAC9E,eAAO,MAAM,gBAAgB,oBAAwC,CAAC;AACtE,eAAO,MAAM,uBAAuB,oBAAwC,CAAC;AAC7E,eAAO,MAAM,oBAAoB,oBAAwC,CAAC;AAC1E,eAAO,MAAM,uBAAuB,oBAAwC,CAAC;AAE7E,eAAO,MAAM,mBAAmB;iCAKM,MAAM;6BACV,MAAM,cAAc,GAAG;CAQxD,CAAC;AA6DF,eAAO,MAAM,eAAe,qIAWzB,GAAG,mDAkQL,CAAC"}

package/dist/cjs/Context.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.ContextProvider = exports.useChartDateFilters = exports.ChartDateFiltersContext = exports.DashboardFiltersContext = exports.DashboardContext = exports.SavedReportsQueryContext = exports.ReportBuilderQueryContext = exports.EditVisualizationModalVisibleContext = exports.QueryResultsLoadingContext = exports.ActiveVisualizationContext = exports.CreateVisualizationModalVisibleContext = exports.ClientContext = exports.ThemeContext = exports.EditorQueryContext = exports.SaveQueryModalStatusContext = exports.SavedQueriesContext = exports.HistoryContext = exports.SelectedSidebarIndexContext = exports.RowsContext = exports.ColumnsContext = exports.CustomFieldContext = exports.SchemaContext = exports.DateFilterContext = void 0;
+exports.ContextProvider = exports.useChartDateFilters = exports.ChartDateFiltersContext = exports.ReportFiltersContext = exports.DashboardFiltersContext = exports.DashboardContext = exports.SavedReportsQueryContext = exports.ReportBuilderQueryContext = exports.EditVisualizationModalVisibleContext = exports.QueryResultsLoadingContext = exports.ActiveVisualizationContext = exports.CreateVisualizationModalVisibleContext = exports.ClientContext = exports.ThemeContext = exports.EditorQueryContext = exports.SaveQueryModalStatusContext = exports.SavedQueriesContext = exports.HistoryContext = exports.SelectedSidebarIndexContext = exports.RowsContext = exports.ColumnsContext = exports.CustomFieldContext = exports.SchemaContext = exports.DateFilterContext = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
 const react_1 = require("react");
 const schema_1 = require("./utils/schema");
@@ -40,6 +40,7 @@ exports.ReportBuilderQueryContext = (0, react_1.createContext)(['', dummySetter]
 exports.SavedReportsQueryContext = (0, react_1.createContext)(['', dummySetter]);
 exports.DashboardContext = (0, react_1.createContext)([{}, dummySetter]);
 exports.DashboardFiltersContext = (0, react_1.createContext)([[], dummySetter]);
+exports.ReportFiltersContext = (0, react_1.createContext)([{}, dummySetter]);
 exports.ChartDateFiltersContext = (0, react_1.createContext)([{}, dummySetter]);
 const useChartDateFilters = () => {
     const { chartDateFilters, setChartDateFilters } = (0, react_1.useContext)(exports.ChartDateFiltersContext);
@@ -74,6 +75,16 @@ const dashboardReducer = (state, action) => {
             return state;
     }
 };
+const reportFiltersReducer = (state, action) => {
+    switch (action.type) {
+        case 'UPDATE_REPORT_FILTER':
+            return { ...state, [action.id]: action.data };
+        case 'CLEAR_REPORT_FILTERS':
+            return {};
+        default:
+            return state;
+    }
+};
 const dashboardFiltersReducer = (state, action) => {
     switch (action.type) {
         case 'UPDATE_DASHBOARD_FILTER':
@@ -116,6 +127,7 @@ const ContextProvider = ({ children, initialTheme, publicKey, environment, authT
     const [editVisualizationModalVisible, setEditVisualizationModalVisible] = (0, react_1.useState)(false);
     const [dashboard, dispatch] = (0, react_1.useReducer)(dashboardReducer, {});
     const [dashboardFilters, dashboardFiltersDispatch] = (0, react_1.useReducer)(dashboardFiltersReducer, []);
+    const [reportFilters, reportFiltersDispatch] = (0, react_1.useReducer)(reportFiltersReducer, {});
     const customFieldHelper = async (client) => {
         const customFields = await (0, schema_1.getCustomFieldInfo)(client, 'context');
         setCustomFields(customFields);
@@ -258,6 +270,9 @@ const ContextProvider = ({ children, initialTheme, publicKey, environment, authT
                                                                         ], children: (0, jsx_runtime_1.jsx)(exports.DashboardContext.Provider, { value: { dashboard, dispatch }, children: (0, jsx_runtime_1.jsx)(exports.DashboardFiltersContext.Provider, { value: {
                                                                                     dashboardFilters,
                                                                                     dashboardFiltersDispatch,
-                                                                                }, children: children }) }) }) }) }) }) }) }) }) }) }) }) }) }) }) }) }) }) }));
+                                                                                }, children: (0, jsx_runtime_1.jsx)(exports.ReportFiltersContext.Provider, { value: {
+                                                                                        reportFilters,
+                                                                                        reportFiltersDispatch,
+                                                                                    }, children: children }) }) }) }) }) }) }) }) }) }) }) }) }) }) }) }) }) }) }) }));
 };
 exports.ContextProvider = ContextProvider;

package/dist/cjs/Table.d.ts

@@ -1,4 +1,6 @@
-import React from 'react';
+import React, { ReactNode } from 'react';
+import { MultiSelectComponentProps, SelectComponentProps } from './components/UiComponents';
+import { DateRangePickerComponentProps } from './DateRangePicker/QuillDateRangePicker';
 export interface TableColumn {
     label: string;
     field: string;
@@ -78,6 +80,8 @@ export interface TableProps {
      * Whether to show the download csv button.
      */
     hideCSVDownloadButton?: boolean;
+    /** Whether to hide the table filters component, deafulted to true */
+    hideFilters?: boolean;
     /**
      * Whether this table component is loading.
      */
@@ -90,6 +94,16 @@ export interface TableProps {
      * A loading component to show when the table is loading.
      */
     LoadingComponent?: () => JSX.Element;
+    /** A select component prop for the table filters */
+    SelectComponent?: (props: SelectComponentProps) => JSX.Element;
+    /** A multi select component prop for the table filters */
+    MultiSelectComponent?: (props: MultiSelectComponentProps) => JSX.Element;
+    /** A date range picker component prop for the table filters */
+    DateRangePickerComponent?: (props: DateRangePickerComponentProps) => JSX.Element;
+    /** A filter container component component prop for the table filters */
+    FilterContainerComponent?: ({ children, }: {
+        children: ReactNode;
+    }) => JSX.Element;
     /**
      * Styles the top-level container of the Table.
      *

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

@@ -1 +1 @@
-{"version":3,"file":"Table.d.ts","sourceRoot":"","sources":["../../src/Table.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAyC,MAAM,OAAO,CAAC;AAe9D,MAAM,WAAW,WAAW;IAC1B,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;CACf;AAyBD;;GAEG;AACH,MAAM,WAAW,UAAU;IACzB;;;;;;;;OAQG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAElB;;;;;;;;;;;;;;;;;;;;;;OAsBG;IACH,IAAI,CAAC,EAAE;QAAE,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAA;KAAE,EAAE,CAAC;IAEhC;;;;;;;;;;;;;;;;;;;;;;OAsBG;IACH,OAAO,CAAC,EAAE;QACR,KAAK,EAAE,MAAM,CAAC;QACd,KAAK,EAAE,MAAM,CAAC;KACf,EAAE,CAAC;IAEJ;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IAErB;;OAEG;IACH,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAEhC;;OAEG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IAEpB;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,IAAI,CAAC;IAEzB;;OAEG;IACH,gBAAgB,CAAC,EAAE,MAAM,GAAG,CAAC,OAAO,CAAC;IAErC;;;;OAIG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB;;OAEG;IACH,cAAc,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;CACtC;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA8BG;AACH,QAAA,MAAM,KAAK,UAAW,UAAU,4CAkC/B,CAAC;AA+GF,eAAe,KAAK,CAAC"}
+{"version":3,"file":"Table.d.ts","sourceRoot":"","sources":["../../src/Table.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EACZ,SAAS,EAKV,MAAM,OAAO,CAAC;AAuBf,OAAO,EACL,yBAAyB,EAEzB,oBAAoB,EACrB,MAAM,2BAA2B,CAAC;AAInC,OAAO,EACL,6BAA6B,EAE9B,MAAM,wCAAwC,CAAC;AAGhD,MAAM,WAAW,WAAW;IAC1B,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;CACf;AAoCD;;GAEG;AACH,MAAM,WAAW,UAAU;IACzB;;;;;;;;OAQG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAElB;;;;;;;;;;;;;;;;;;;;;;OAsBG;IACH,IAAI,CAAC,EAAE;QAAE,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAA;KAAE,EAAE,CAAC;IAEhC;;;;;;;;;;;;;;;;;;;;;;OAsBG;IACH,OAAO,CAAC,EAAE;QACR,KAAK,EAAE,MAAM,CAAC;QACd,KAAK,EAAE,MAAM,CAAC;KACf,EAAE,CAAC;IAEJ;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IAErB;;OAEG;IACH,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAEhC,qEAAqE;IACrE,WAAW,CAAC,EAAE,OAAO,CAAC;IAEtB;;OAEG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IAEpB;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,IAAI,CAAC;IAEzB;;OAEG;IACH,gBAAgB,CAAC,EAAE,MAAM,GAAG,CAAC,OAAO,CAAC;IAErC,oDAAoD;IACpD,eAAe,CAAC,EAAE,CAAC,KAAK,EAAE,oBAAoB,KAAK,GAAG,CAAC,OAAO,CAAC;IAE/D,0DAA0D;IAC1D,oBAAoB,CAAC,EAAE,CAAC,KAAK,EAAE,yBAAyB,KAAK,GAAG,CAAC,OAAO,CAAC;IAEzE,+DAA+D;IAC/D,wBAAwB,CAAC,EAAE,CACzB,KAAK,EAAE,6BAA6B,KACjC,GAAG,CAAC,OAAO,CAAC;IAEjB,wEAAwE;IACxE,wBAAwB,CAAC,EAAE,CAAC,EAC1B,QAAQ,GACT,EAAE;QACD,QAAQ,EAAE,SAAS,CAAC;KACrB,KAAK,GAAG,CAAC,OAAO,CAAC;IAElB;;;;OAIG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB;;OAEG;IACH,cAAc,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;CACtC;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA8BG;AACH,QAAA,MAAM,KAAK,UAAW,UAAU,4CAuC/B,CAAC;AA8OF,eAAe,KAAK,CAAC"}