@quillsql/react 2.13.39 → 2.13.41

package/dist/esm/components/Dashboard/DataLoader.js

@@ -29,7 +29,16 @@ const constructReportFromItem = (item) => {
 };
 function filterValuesEquivalent(filters1, filters2) {
     if (filters1.length !== filters2.length) {
-        return false;
+        // Find the odd filters out and return false ONLY if they have a selected value
+        const filters1Labels = filters1.map((f) => f.label);
+        const filters2Labels = filters2.map((f) => f.label);
+        const oddFilters = filters1Labels.filter((label) => !filters2Labels.includes(label));
+        for (const filter of oddFilters) {
+            const filter1 = filters1.find((f) => f.label === filter);
+            if (filter1?.selectedValue) {
+                return false;
+            }
+        }
     }
     // The two filters arrays aren't necessarily in the same order
     // we can build two dictionaries of [label, filter] and compare them
@@ -123,6 +132,9 @@ function tenantsEquivalent(tenants1, tenants2) {
     }
     return true;
 }
+function customFieldsEquivalent(customFields1, customFields2) {
+    return equal(customFields1, customFields2);
+}
 export default function DataLoader({ item, children, filters, userFilters, additionalProcessing: defaultAdditionalProcessing, reportMode = false, }) {
     const [client] = useContext(ClientContext);
     const [dashboard, dispatch] = useContext(DashboardContext);
@@ -153,9 +165,10 @@ export default function DataLoader({ item, children, filters, userFilters, addit
         reportFilters,
         dashboardFilters,
     ]);
-    const previousTenants = useRef(null);
-    const previousFilters = useRef(null);
-    const previousUserFilters = useRef(null);
+    const previousFilters = useRef(filters);
+    const previousUserFilters = useRef(userFilters);
+    const previousTenants = useRef(tenants);
+    const previousCustomFields = useRef(schemaData.customFields);
     const [rowCountIsLoading, setRowCountIsLoading] = useState(false);
     const rowsRequestId = useRef(0);
     const rowsAbortController = useRef(null);
@@ -348,13 +361,22 @@ export default function DataLoader({ item, children, filters, userFilters, addit
         setLoading(true);
         const fetchRowsRequestId = rowsRequestId.current + 1;
         rowsRequestId.current = fetchRowsRequestId;
-        previousUserFilters.current = userFilters ?? null;
+        previousUserFilters.current = userFilters;
         rowsAbortController.current?.abort();
         rowsAbortController.current = new AbortController();
         try {
             if (reportMode) {
                 try {
-                    await fetchIndividualReport(item.id, 'Chart', true, filters, userFilters, processing, undefined, rowsAbortController.current);
+                    await fetchIndividualReport({
+                        reportId: item.id,
+                        initiator: 'Chart',
+                        fetchRows: true,
+                        dashboardFilters: filters,
+                        customFilters: userFilters,
+                        additionalProcessing: processing,
+                        reportAbortController: rowsAbortController.current,
+                        customFields: schemaData.customFields,
+                    });
                     rowsAbortController.current = null;
                     setError(undefined);
                 }
@@ -363,7 +385,19 @@ export default function DataLoader({ item, children, filters, userFilters, addit
                 }
             }
             else {
-                const { report: fetchedReport, error } = await fetchReport(item.id, client, tenants, flags, true, filters.concat(userFilters ?? []), processing, undefined, schemaData.customFields, true, false, rowsAbortController.current.signal);
+                const { report: fetchedReport, error } = await fetchReport({
+                    reportId: item.id,
+                    client,
+                    tenants,
+                    flags,
+                    useReportTask: true,
+                    filters: filters.concat(userFilters ?? []),
+                    additionalProcessing: processing,
+                    customFields: schemaData.customFields,
+                    rowsOnly: true,
+                    rowCountOnly: false,
+                    abortSignal: rowsAbortController.current.signal,
+                });
                 dispatch({
                     type: 'ADD_DASHBOARD_ITEM',
                     id: item.id,
@@ -398,23 +432,30 @@ export default function DataLoader({ item, children, filters, userFilters, addit
     // TODO: this is getting ridiculous
     // we should be fetching this data directly when mutating filters/tenants rather than using a magical effect
     useEffect(() => {
-        if ((previousFilters.current ||
-            (reportMode ? reports : dashboard)[item.id]?.rows?.length) &&
-            filterValuesEquivalent(previousFilters.current ?? contextFilters(), filters) &&
-            userFilterValuesEquivalent(previousUserFilters.current ?? [], userFilters ?? []) &&
-            // !didFiltersChange(dashboard[item.id], filters) &&
-            tenantsEquivalent(previousTenants.current ?? [], tenants ?? [])) {
-            if (!rowsAbortController.current)
+        if (schemaData.isSchemaLoading ||
+            (filterValuesEquivalent(previousFilters.current ?? contextFilters(), filters) &&
+                userFilterValuesEquivalent(previousUserFilters.current ?? [], userFilters ?? []) &&
+                tenantsEquivalent(previousTenants.current ?? [], tenants ?? []) &&
+                customFieldsEquivalent(previousCustomFields.current, schemaData.customFields) &&
+                ((reportMode ? reports : dashboard)[item.id]?.rows?.length || rowsAbortController.current))) {
+            if (!rowsAbortController.current && !schemaData.isSchemaLoading)
                 setLoading(false);
-            previousFilters.current = filters;
             return;
         }
         previousFilters.current = filters;
         previousUserFilters.current = userFilters ?? [];
-        previousTenants.current = tenants ?? null;
+        previousTenants.current = tenants;
+        previousCustomFields.current = schemaData.customFields;
         setPreviousPage(0);
         fetchReportHelper(additionalProcessing);
-    }, [filters, userFilters, item.id, tenants]);
+    }, [
+        filters,
+        userFilters,
+        item.id,
+        tenants,
+        schemaData.customFields,
+        schemaData.isSchemaLoading,
+    ]);
     useEffect(() => {
         const tempReport = (reportMode ? reports : dashboard)[item.id];
         if (tempReport?.triggerReload) {
@@ -423,7 +464,7 @@ export default function DataLoader({ item, children, filters, userFilters, addit
         else if (tempReport?.error) {
             setError(tempReport.error);
         }
-    }, [(reportMode ? reports : dashboard)[item.id]]);
+    }, [(reportMode ? reports : dashboard)[item.id]?.triggerReload, (reportMode ? reports : dashboard)[item.id]?.error]);
     return (_jsx(_Fragment, { children: children({
             isLoading: loading,
             error,
@@ -451,10 +492,11 @@ export const ChartDataLoader = ({ item, children, dateBucket, additionalProcessi
     const [error, setError] = useState(undefined);
     const [client] = useContext(ClientContext);
     const [schemaData] = useContext(SchemaDataContext);
-    const previousFilters = useRef(null);
-    const previousUserFilters = useRef(null);
-    const previousDateBucket = useRef(undefined);
-    const previousTenants = useRef(null);
+    const previousFilters = useRef(filters);
+    const previousUserFilters = useRef(userFilters);
+    const previousDateBucket = useRef(dateBucket);
+    const previousTenants = useRef(tenants);
+    const previousCustomFields = useRef(schemaData.customFields);
     const fetchReportAbortController = useRef(null);
     const rowsRequestId = useRef(0);
     const chartReport = useMemo(() => {
@@ -476,7 +518,7 @@ export const ChartDataLoader = ({ item, children, dateBucket, additionalProcessi
         }
         const fetchRowsRequestId = rowsRequestId.current + 1;
         rowsRequestId.current = fetchRowsRequestId;
-        previousUserFilters.current = userFilters ?? null;
+        previousUserFilters.current = userFilters;
         previousDateBucket.current = dateBucket;
         setLoading(true);
         fetchReportAbortController.current?.abort();
@@ -484,10 +526,20 @@ export const ChartDataLoader = ({ item, children, dateBucket, additionalProcessi
         try {
             if (reportMode) {
                 try {
-                    await fetchIndividualReport(item.id, 'Chart', true, filters, userFilters, {
-                        ...additionalProcessing,
-                        ...{ page: DEFAULT_PAGINATION },
-                    }, dateBucket, fetchReportAbortController.current);
+                    await fetchIndividualReport({
+                        reportId: item.id,
+                        initiator: 'Chart',
+                        fetchRows: true,
+                        dashboardFilters: filters,
+                        customFilters: userFilters,
+                        additionalProcessing: {
+                            ...additionalProcessing,
+                            ...{ page: DEFAULT_PAGINATION },
+                        },
+                        dateBucket,
+                        reportAbortController: fetchReportAbortController.current,
+                        customFields: schemaData.customFields,
+                    });
                     setError(undefined);
                 }
                 catch (e) {
@@ -495,10 +547,21 @@ export const ChartDataLoader = ({ item, children, dateBucket, additionalProcessi
                 }
             }
             else {
-                const { report, error } = await fetchReport(item.id, client, tenants, flags, useReportTask, filters.concat(userFilters ?? []), {
-                    ...additionalProcessing,
-                    ...{ page: DEFAULT_PAGINATION },
-                }, dateBucket, schemaData.customFields, undefined, undefined, fetchReportAbortController.current.signal);
+                const { report, error } = await fetchReport({
+                    reportId: item.id,
+                    client,
+                    tenants,
+                    flags,
+                    useReportTask,
+                    filters: filters.concat(userFilters ?? []),
+                    additionalProcessing: {
+                        ...additionalProcessing,
+                        ...{ page: DEFAULT_PAGINATION },
+                    },
+                    dateBucket,
+                    customFields: schemaData.customFields,
+                    abortSignal: fetchReportAbortController.current.signal,
+                });
                 dispatch({
                     type: 'ADD_DASHBOARD_ITEM',
                     id: item.id,
@@ -529,23 +592,32 @@ export const ChartDataLoader = ({ item, children, dateBucket, additionalProcessi
         if (!filters) {
             return;
         }
-        if ((previousFilters.current ||
-            (reportMode ? reports : dashboard)[item.id]?.rows?.length) &&
-            filterValuesEquivalent(previousFilters.current ?? contextFilters(), filters) &&
-            userFilterValuesEquivalent(previousUserFilters.current ?? [], userFilters ?? []) &&
-            tenantsEquivalent(tenants ?? [], previousTenants.current ?? []) &&
-            previousDateBucket.current === dateBucket) {
-            previousFilters.current = filters;
-            if (!fetchReportAbortController.current)
+        if (schemaData.isSchemaLoading ||
+            (filterValuesEquivalent(previousFilters.current ?? contextFilters(), filters) &&
+                userFilterValuesEquivalent(previousUserFilters.current ?? [], userFilters ?? []) &&
+                tenantsEquivalent(tenants ?? [], previousTenants.current ?? []) &&
+                previousDateBucket.current === dateBucket &&
+                customFieldsEquivalent(previousCustomFields.current, schemaData.customFields) &&
+                ((reportMode ? reports : dashboard)[item.id]?.rows?.length || fetchReportAbortController.current))) {
+            if (!fetchReportAbortController.current && !schemaData.isSchemaLoading)
                 setLoading(false);
             return;
         }
         previousDateBucket.current = dateBucket;
         previousUserFilters.current = userFilters ?? [];
-        previousTenants.current = tenants ?? null;
+        previousTenants.current = tenants;
         previousFilters.current = filters;
+        previousCustomFields.current = schemaData.customFields;
         fetchReportHelper();
-    }, [filters, userFilters, item.id, dateBucket]);
+    }, [
+        filters,
+        userFilters,
+        item.id,
+        dateBucket,
+        tenants,
+        schemaData.customFields,
+        schemaData.isSchemaLoading,
+    ]);
     useEffect(() => {
         const tempReport = (reportMode ? reports : dashboard)[item.id];
         if (tempReport && tempReport.triggerReload) {
@@ -554,7 +626,7 @@ export const ChartDataLoader = ({ item, children, dateBucket, additionalProcessi
         else if (tempReport?.error) {
             setError(tempReport.error);
         }
-    }, [(reportMode ? reports : dashboard)[item.id]]);
+    }, [(reportMode ? reports : dashboard)[item.id]?.triggerReload, (reportMode ? reports : dashboard)[item.id]?.error]);
     return children({
         isLoading: !chartReport || loading,
         data: chartReport,

package/dist/esm/components/Dashboard/MetricComponent.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"MetricComponent.d.ts","sourceRoot":"","sources":["../../../../src/components/Dashboard/MetricComponent.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,gBAAgB,EAAE,MAAM,iBAAiB,CAAC;AAMnD,MAAM,CAAC,OAAO,UAAU,oBAAoB,CAAC,EAC3C,MAAM,EACN,OAAO,EACP,KAAK,EACL,SAAS,EACT,QAAQ,GACT,EAAE,gBAAgB,GAAG,GAAG,CAAC,OAAO,CA+MhC"}
+{"version":3,"file":"MetricComponent.d.ts","sourceRoot":"","sources":["../../../../src/components/Dashboard/MetricComponent.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,gBAAgB,EAAE,MAAM,iBAAiB,CAAC;AAMnD,MAAM,CAAC,OAAO,UAAU,oBAAoB,CAAC,EAC3C,MAAM,EACN,OAAO,EACP,KAAK,EACL,SAAS,EACT,QAAQ,GACT,EAAE,gBAAgB,GAAG,GAAG,CAAC,OAAO,CA4HhC"}

package/dist/esm/components/Dashboard/MetricComponent.js

@@ -14,7 +14,7 @@ export default function QuillMetricComponent({ report, onClick, error, isLoading
             cursor: !onClick ? 'default' : 'pointer',
             boxSizing: 'content-box',
             borderRadius: 8,
-            paddingBottom: isLoading ? 0 : 30,
+            paddingBottom: 0,
             width: '100%',
         }, children: _jsx("div", { style: {
                 width: '100%',
@@ -70,58 +70,61 @@ export default function QuillMetricComponent({ report, onClick, error, isLoading
                             color: theme?.secondaryTextColor,
                             maxWidth: '100%',
                             width: '100%',
-                        }, children: "No results" })) : (_jsx("div", { style: {
-                            padding: 0,
-                            height: '100%',
-                            width: '100%',
-                            boxSizing: 'content-box',
-                        }, children: _jsxs("div", { style: {
+                        }, children: "No results" })) : (_jsx(MetricDisplay, { dateFilter: dateFilter, primaryMetricLabel: primaryMetricLabel, comparisonLabel: comparisonLabel, theme: theme, children: children }))] }) }) }, report?.name));
+}
+const MetricDisplay = ({ children, dateFilter, primaryMetricLabel, comparisonLabel, theme, }) => {
+    return _jsx("div", { style: {
+            padding: 0,
+            height: '100%',
+            width: '100%',
+            boxSizing: 'content-box',
+        }, children: _jsxs("div", { style: {
+                fontFamily: theme?.fontFamily,
+                fontSize: 32,
+                color: theme?.primaryTextColor,
+                fontWeight: '600',
+                textOverflow: 'ellipsis',
+                margin: 0,
+                whiteSpace: 'nowrap',
+                boxSizing: 'content-box',
+                maxWidth: '100%',
+                textAlign: 'left',
+                overflow: 'hidden',
+                height: '100%',
+                display: 'flex',
+                width: '100%',
+                flexDirection: 'row',
+            }, children: [_jsxs("div", { style: {
+                        display: 'flex',
+                        gap: 4,
+                        alignItems: 'baseline',
+                        marginRight: 'auto',
+                    }, children: [_jsx("span", { children: children }), dateFilter?.comparison && (_jsx("span", { style: {
+                                fontSize: 13,
+                                fontWeight: '500',
                                 fontFamily: theme?.fontFamily,
-                                fontSize: 32,
                                 color: theme?.primaryTextColor,
-                                fontWeight: '600',
-                                textOverflow: 'ellipsis',
-                                margin: 0,
-                                whiteSpace: 'nowrap',
-                                boxSizing: 'content-box',
-                                maxWidth: '100%',
-                                textAlign: 'left',
-                                overflow: 'hidden',
-                                height: '100%',
-                                display: 'flex',
-                                width: '100%',
-                                flexDirection: 'row',
-                            }, children: [_jsxs("div", { style: {
-                                        display: 'flex',
-                                        gap: 4,
-                                        alignItems: 'baseline',
-                                        marginRight: 'auto',
-                                    }, children: [_jsx("span", { children: children }), dateFilter?.comparison && (_jsx("span", { style: {
-                                                fontSize: 13,
-                                                fontWeight: '500',
-                                                fontFamily: theme?.fontFamily,
-                                                color: theme?.primaryTextColor,
-                                                marginLeft: 2,
-                                            }, children: primaryMetricLabel
-                                                ? `in ${primaryMetricLabel.toLowerCase()}`
-                                                : 'this period' }))] }), dateFilter?.comparison && (_jsxs("div", { style: {
-                                        display: 'flex',
-                                        gap: 4,
-                                        alignItems: 'baseline',
-                                        paddingTop: 4,
-                                        color: theme?.secondaryTextColor,
-                                    }, children: [_jsx("span", { style: {
-                                                fontSize: 28,
-                                                fontWeight: '500',
-                                                fontFamily: theme?.fontFamily,
-                                                color: theme?.secondaryTextColor,
-                                            }, children: children }), _jsx("span", { style: {
-                                                fontSize: 13,
-                                                fontWeight: '500',
-                                                fontFamily: theme?.fontFamily,
-                                                color: theme?.secondaryTextColor,
-                                                marginLeft: 2,
-                                            }, children: comparisonLabel
-                                                ? 'in ' + comparisonLabel.toLowerCase()
-                                                : 'previous period' })] }))] }) }))] }) }) }, report?.name));
-}
+                                marginLeft: 2,
+                            }, children: primaryMetricLabel
+                                ? `in ${primaryMetricLabel.toLowerCase()}`
+                                : 'this period' }))] }), dateFilter?.comparison && (_jsxs("div", { style: {
+                        display: 'flex',
+                        gap: 4,
+                        alignItems: 'baseline',
+                        paddingTop: 4,
+                        color: theme?.secondaryTextColor,
+                    }, children: [_jsx("span", { style: {
+                                fontSize: 28,
+                                fontWeight: '500',
+                                fontFamily: theme?.fontFamily,
+                                color: theme?.secondaryTextColor,
+                            }, children: children }), _jsx("span", { style: {
+                                fontSize: 13,
+                                fontWeight: '500',
+                                fontFamily: theme?.fontFamily,
+                                color: theme?.secondaryTextColor,
+                                marginLeft: 2,
+                            }, children: comparisonLabel
+                                ? 'in ' + comparisonLabel.toLowerCase()
+                                : 'previous period' })] }))] }) });
+};

package/dist/esm/components/Dashboard/TableComponent.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"TableComponent.d.ts","sourceRoot":"","sources":["../../../../src/components/Dashboard/TableComponent.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,WAAW,EAAE,MAAM,qBAAqB,CAAC;AAKlD,MAAM,CAAC,OAAO,UAAU,mBAAmB,CAAC,EAC1C,MAAM,EACN,OAAO,EACP,SAAS,EACT,KAAK,EACL,QAAQ,EACR,iBAAiB,EACjB,YAAY,EACZ,YAAY,EACZ,QAAQ,GACT,EAAE;IACD,MAAM,EAAE,WAAW,CAAC;IACpB,OAAO,CAAC,EAAE,CAAC,MAAM,EAAE,WAAW,KAAK,IAAI,CAAC;IACxC,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IACtC,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,SAAS,EAAE,MAAM,CAAA;KAAE,KAAK,IAAI,CAAC;IACpE,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB,GAAG,GAAG,CAAC,OAAO,CAkGd"}
+{"version":3,"file":"TableComponent.d.ts","sourceRoot":"","sources":["../../../../src/components/Dashboard/TableComponent.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,WAAW,EAAE,MAAM,qBAAqB,CAAC;AAKlD,MAAM,CAAC,OAAO,UAAU,mBAAmB,CAAC,EAC1C,MAAM,EACN,OAAO,EACP,SAAS,EACT,KAAK,EACL,QAAQ,EACR,iBAAiB,EACjB,YAAY,EACZ,YAAY,EACZ,QAAQ,GACT,EAAE;IACD,MAAM,EAAE,WAAW,CAAC;IACpB,OAAO,CAAC,EAAE,CAAC,MAAM,EAAE,WAAW,KAAK,IAAI,CAAC;IACxC,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IACtC,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,SAAS,EAAE,MAAM,CAAA;KAAE,KAAK,IAAI,CAAC;IACpE,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB,GAAG,GAAG,CAAC,OAAO,CA0Gd"}

package/dist/esm/components/Dashboard/TableComponent.js

@@ -46,7 +46,11 @@ export default function QuillTableComponent({ report, onClick, isLoading, error,
                 } })) : error ? (_jsx("div", { style: {
                     width: '100%',
                     height: '400px',
-                }, children: _jsx(ChartError, { errorMessage: error }) })) : (_jsx(QuillTable, { isLoading: isLoading, rows: report.rows ?? [], rowCount: rowCount, rowCountIsLoading: rowCountIsLoading, columns: report.columns, rowsPerPage: report.pagination?.rowsPerPage ?? DEFAULT_PAGINATION.rowsPerPage, containerStyle: {
+                }, children: _jsx(ChartError, { errorMessage: error }) })) : (_jsx(QuillTable, { isLoading: isLoading, rows: report.rows ?? [], rowCount: rowCount, rowCountIsLoading: rowCountIsLoading, columns: report.includeCustomFields &&
+                    report.columnsWithCustomFields &&
+                    !report.pivot
+                    ? report.columnsWithCustomFields
+                    : report.columns, rowsPerPage: report.pagination?.rowsPerPage ?? DEFAULT_PAGINATION.rowsPerPage, containerStyle: {
                     width: '100%',
                     height: '400px',
                 }, downloadCSV: () => {

package/dist/esm/components/QuillMultiSelectSectionList.js

@@ -188,7 +188,7 @@ export function QuillMultiSelectSectionList({ options, width, onChange, label, s
                                     whiteSpace: 'nowrap',
                                     overflow: 'hidden',
                                     cursor: 'default',
-                                }, children: emptyLabel ?? 'No options available' })] })), !isLoading ? Object.keys(filteredItems).map((key) => (_jsxs(_Fragment, { children: [_jsxs("button", { style: {
+                                }, children: emptyLabel ?? 'No options available' })] })), !isLoading ? Object.keys(filteredItems).map((key) => (_jsxs("div", { children: [_jsxs("button", { style: {
                                     display: 'flex',
                                     alignItems: 'center',
                                     padding: 8,
@@ -207,8 +207,8 @@ export function QuillMultiSelectSectionList({ options, width, onChange, label, s
                                     gap: 6,
                                     overflow: 'hidden',
                                 }, className: "quill-option", onClick: () => {
-                                    const updatedValue = filteredItems[key]?.length === value[key]?.length
-                                        ? [] : filteredItems[key]?.map((option) => option.value) ?? [];
+                                    const updatedValue = options[key]?.length === value[key]?.length
+                                        ? [] : options[key]?.map((option) => option.value) ?? [];
                                     const updatedChangeEvent = {
                                         target: {
                                             value: {
@@ -226,7 +226,7 @@ export function QuillMultiSelectSectionList({ options, width, onChange, label, s
                   .quill-option:hover {
                     background: #F4F4F5;
                   }
-                ` }), _jsx("input", { type: "checkbox", checked: filteredItems[key]?.length === value[key]?.length, style: { width: '14px', height: '14px', margin: 'auto 0' }, readOnly: true }), _jsx("span", { style: {
+                ` }), _jsx("input", { type: "checkbox", checked: options[key]?.length === value[key]?.length, style: { width: '14px', height: '14px', margin: 'auto 0' }, readOnly: true }), _jsx("span", { style: {
                                             textOverflow: 'ellipsis',
                                             whiteSpace: 'nowrap',
                                             overflow: 'hidden',
@@ -280,7 +280,7 @@ export function QuillMultiSelectSectionList({ options, width, onChange, label, s
                                             textOverflow: 'ellipsis',
                                             whiteSpace: 'nowrap',
                                             overflow: 'hidden',
-                                        }, children: option.label })] }, "v-" + key + "-" + option.value)))] }))) : (_jsx("div", { children: _jsx(LoadingSpinner, {}) }))] }))] }));
+                                        }, children: option.label })] }, "v-" + key + "-" + option.value)))] }, 'sp-' + key))) : (_jsx("div", { children: _jsx(LoadingSpinner, {}) }))] }))] }));
 }
 export const ListboxTextInput = ({ value, onChange, placeholder, }) => {
     return (_jsxs("div", { style: {

package/dist/esm/components/QuillMultiSelectWithCombo.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"QuillMultiSelectWithCombo.d.ts","sourceRoot":"","sources":["../../../src/components/QuillMultiSelectWithCombo.tsx"],"names":[],"mappings":"AACA,OAAO,EAAkB,yBAAyB,EAAE,MAAM,gBAAgB,CAAC;AAC3E,OAAc,EAEZ,aAAa,EAMd,MAAM,OAAO,CAAC;AAGf;;GAEG;AACH,wBAAgB,kCAAkC,CAAC,EACjD,OAAO,EACP,KAAK,EACL,QAAQ,EACR,KAAK,EACL,KAAK,EACL,SAAS,EACT,QAAQ,EACR,UAAU,EACV,gBAAgB,EAChB,KAAK,GACN,EAAE,yBAAyB,GAAG;IAAE,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAAC,KAAK,CAAC,EAAE,aAAa,CAAA;CAAE,2CA4flF;AAED,eAAO,MAAM,gBAAgB,sCAI1B;IACD,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,CAAC,CAAC,EAAE,MAAM,KAAK,IAAI,CAAC;IAC9B,WAAW,EAAE,MAAM,CAAC;CACrB,4CAwDA,CAAC"}
+{"version":3,"file":"QuillMultiSelectWithCombo.d.ts","sourceRoot":"","sources":["../../../src/components/QuillMultiSelectWithCombo.tsx"],"names":[],"mappings":"AACA,OAAO,EAAkB,yBAAyB,EAAE,MAAM,gBAAgB,CAAC;AAC3E,OAAc,EAEZ,aAAa,EAMd,MAAM,OAAO,CAAC;AAGf;;GAEG;AACH,wBAAgB,kCAAkC,CAAC,EACjD,OAAO,EACP,KAAK,EACL,QAAQ,EACR,KAAK,EACL,KAAK,EACL,SAAS,EACT,QAAQ,EACR,UAAU,EACV,gBAAgB,EAChB,KAAK,GACN,EAAE,yBAAyB,GAAG;IAAE,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAAC,KAAK,CAAC,EAAE,aAAa,CAAA;CAAE,2CA6flF;AAED,eAAO,MAAM,gBAAgB,sCAI1B;IACD,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,CAAC,CAAC,EAAE,MAAM,KAAK,IAAI,CAAC;IAC9B,WAAW,EAAE,MAAM,CAAC;CACrB,4CAwDA,CAAC"}

package/dist/esm/components/QuillMultiSelectWithCombo.js

@@ -93,9 +93,6 @@ export function QuillMultiSelectComponentWithCombo({ options, width, onChange, l
     // FIXME: Hacked this to display selected options that have been filtered out, which is good
     // But they don't have their proper labels, since we haven't stored/passed in the label
     const filteredItems = React.useMemo(() => {
-        const uuidRegex = /^[0-9a-fA-F]{8}-[0-9a-fA-F]{4}-[1-5][0-9a-fA-F]{3}-[89abAB][0-9a-fA-F]{3}-[0-9a-fA-F]{12}$/;
-        const isUuid = potentialOptions?.[0]?.value?.toString()?.match(uuidRegex);
-        const isNumber = !isNaN(parseInt(potentialOptions?.[0]?.value ?? ''));
         // Sort null to top
         if (searchQuery === '') {
             return potentialOptions
@@ -110,16 +107,20 @@ export function QuillMultiSelectComponentWithCombo({ options, width, onChange, l
             })
                 .slice(0, 20);
         }
+        const uuidRegex = /^[0-9a-fA-F]{8}-[0-9a-fA-F]{4}-[1-5][0-9a-fA-F]{3}-[89abAB][0-9a-fA-F]{3}-[0-9a-fA-F]{12}$/;
+        const isUuid = potentialOptions?.[0]?.value?.toString()?.match(uuidRegex);
+        const isNumber = typeof potentialOptions?.[0]?.value === 'number';
         return potentialOptions
             .filter((option) => {
             if (!option) {
                 return false;
             }
             return option.label
+                .toString()
                 .toLowerCase()
                 .replace(/\s+/g, '')
                 .includes(searchQuery.toLowerCase().replace(/\s+/g, ''))
-                || (isNumber || isUuid ? option.value
+                || (isNumber || isUuid ? option.value.toString()
                     .toLowerCase()
                     .replace(/\s+/g, '')
                     .includes(searchQuery.toLowerCase().replace(/\s+/g, '')) : false);

package/dist/esm/components/QuillSelectWithCombo.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"QuillSelectWithCombo.d.ts","sourceRoot":"","sources":["../../../src/components/QuillSelectWithCombo.tsx"],"names":[],"mappings":"AACA,OAAO,EAAkB,oBAAoB,EAAE,MAAM,gBAAgB,CAAC;AAWtE;;GAEG;AACH,wBAAgB,6BAA6B,CAAC,EAC5C,OAAO,EACP,KAAK,EACL,KAAK,EACL,QAAQ,EACR,KAAK,EACL,SAAS,EACT,eAAe,EACf,QAAQ,GACT,EAAE,oBAAoB,2CAkTtB"}
+{"version":3,"file":"QuillSelectWithCombo.d.ts","sourceRoot":"","sources":["../../../src/components/QuillSelectWithCombo.tsx"],"names":[],"mappings":"AACA,OAAO,EAAkB,oBAAoB,EAAE,MAAM,gBAAgB,CAAC;AAWtE;;GAEG;AACH,wBAAgB,6BAA6B,CAAC,EAC5C,OAAO,EACP,KAAK,EACL,KAAK,EACL,QAAQ,EACR,KAAK,EACL,SAAS,EACT,eAAe,EACf,QAAQ,GACT,EAAE,oBAAoB,2CA+StB"}

package/dist/esm/components/QuillSelectWithCombo.js

@@ -16,13 +16,9 @@ export function QuillSelectComponentWithCombo({ options, value, width, onChange,
     // FIXME: Hacked this to display the option that has been filtered out, which is good
     // But it doesn't have its proper label, since we haven't stored/passed in the label
     const filteredItems = React.useMemo(() => {
-        const optionValues = new Set(options.map((opt) => opt.value));
         // Sort null to top
         if (searchQuery === '') {
-            return (optionValues.has(value ?? '') || value === undefined
-                ? []
-                : [{ label: value === '' ? '-' : (value ?? '-'), value: value ?? '' }])
-                .concat(options)
+            return options
                 .sort((a, b) => {
                 if (a.value === null) {
                     return -1;
@@ -34,18 +30,23 @@ export function QuillSelectComponentWithCombo({ options, value, width, onChange,
             })
                 .slice(0, 20);
         }
-        return (optionValues.has(value ?? '')
-            ? [{ label: value ?? '-', value: value ?? '' }]
-            : [])
-            .concat(options)
+        const uuidRegex = /^[0-9a-fA-F]{8}-[0-9a-fA-F]{4}-[1-5][0-9a-fA-F]{3}-[89abAB][0-9a-fA-F]{3}-[0-9a-fA-F]{12}$/;
+        const isUuid = options?.[0]?.value?.toString()?.match(uuidRegex);
+        const isNumber = typeof options?.[0]?.value === 'number';
+        return options
             .filter((option) => {
             if (!option) {
                 return false;
             }
-            return option.value
+            return option.label
+                .toString()
                 .toLowerCase()
                 .replace(/\s+/g, '')
-                .includes(searchQuery.toLowerCase().replace(/\s+/g, ''));
+                .includes(searchQuery.toLowerCase().replace(/\s+/g, ''))
+                || (isNumber || isUuid ? option.value.toString()
+                    .toLowerCase()
+                    .replace(/\s+/g, '')
+                    .includes(searchQuery.toLowerCase().replace(/\s+/g, '')) : false);
         })
             .sort((a, b) => {
             if (a.value === null) {

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

@@ -1 +1 @@
-{"version":3,"file":"AddColumnModal.d.ts","sourceRoot":"","sources":["../../../../src/components/ReportBuilder/AddColumnModal.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAsC,MAAM,OAAO,CAAC;AAiB3D,OAAO,EAGL,uBAAuB,EACxB,MAAM,iBAAiB,CAAC;AAGzB,MAAM,CAAC,OAAO,UAAU,cAAc,CAAC,EACrC,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,aAAa,EACb,kBAAkB,EAClB,YAAY,EACZ,eAAe,EACf,MAAM,EACN,sBAAoD,EACpD,gBAAwC,GACzC,EAAE;IACD,MAAM,EAAE,GAAG,CAAC;IACZ,kBAAkB,EAAE,GAAG,CAAC;IACxB,qBAAqB,EAAE,GAAG,CAAC;IAC3B,eAAe,EAAE,GAAG,CAAC;IACrB,kBAAkB,EAAE,GAAG,CAAC;IACxB,oBAAoB,EAAE,GAAG,CAAC;IAC1B,aAAa,EAAE,GAAG,CAAC;IACnB,YAAY,EAAE,GAAG,CAAC;IAClB,OAAO,EAAE,GAAG,CAAC;IACb,UAAU,EAAE,GAAG,CAAC;IAChB,KAAK,EAAE,GAAG,CAAC;IACX,gBAAgB,EAAE,GAAG,CAAC;IACtB,UAAU,EAAE,GAAG,CAAC;IAChB,YAAY,EAAE,GAAG,CAAC;IAClB,QAAQ,EAAE,GAAG,CAAC;IACd,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,kBAAkB,EACd,CAAC,CAAC,KAAK,EAAE,uBAAuB,KAAK,GAAG,CAAC,OAAO,CAAC,GACjD,KAAK,CAAC,yBAAyB,CAC7B,uBAAuB,GAAG,KAAK,CAAC,aAAa,CAAC,gBAAgB,CAAC,CAChE,CAAC;IACN,YAAY,EAAE,CAAC,KAAK,EAAE;QACpB,KAAK,EAAE,MAAM,CAAC;QACd,UAAU,EAAE,OAAO,CAAC;QACpB,WAAW,EAAE,MAAM,IAAI,CAAC;QACxB,UAAU,EAAE,CAAC,EAAE,QAAQ,EAAE,EAAE;YAAE,QAAQ,EAAE,MAAM,GAAG,CAAC,OAAO,CAAA;SAAE,KAAK,GAAG,CAAC,OAAO,CAAC;KAC5E,KAAK,GAAG,CAAC,OAAO,CAAC;IAClB,eAAe,EAAE,GAAG,CAAC;IACrB,MAAM,EAAE,GAAG,CAAC;IACZ,sBAAsB,EAAE,MAAM,GAAG,CAAC,OAAO,CAAC;IAC1C,gBAAgB,EAAE,MAAM,GAAG,CAAC,OAAO,CAAC;CACrC,2CAqNA"}
+{"version":3,"file":"AddColumnModal.d.ts","sourceRoot":"","sources":["../../../../src/components/ReportBuilder/AddColumnModal.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAsC,MAAM,OAAO,CAAC;AAiB3D,OAAO,EAGL,uBAAuB,EACxB,MAAM,iBAAiB,CAAC;AAGzB,MAAM,CAAC,OAAO,UAAU,cAAc,CAAC,EACrC,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,aAAa,EACb,kBAAkB,EAClB,YAAY,EACZ,eAAe,EACf,MAAM,EACN,sBAAoD,EACpD,gBAAwC,GACzC,EAAE;IACD,MAAM,EAAE,GAAG,CAAC;IACZ,kBAAkB,EAAE,GAAG,CAAC;IACxB,qBAAqB,EAAE,GAAG,CAAC;IAC3B,eAAe,EAAE,GAAG,CAAC;IACrB,kBAAkB,EAAE,GAAG,CAAC;IACxB,oBAAoB,EAAE,GAAG,CAAC;IAC1B,aAAa,EAAE,GAAG,CAAC;IACnB,YAAY,EAAE,GAAG,CAAC;IAClB,OAAO,EAAE,GAAG,CAAC;IACb,UAAU,EAAE,GAAG,CAAC;IAChB,KAAK,EAAE,GAAG,CAAC;IACX,gBAAgB,EAAE,GAAG,CAAC;IACtB,UAAU,EAAE,GAAG,CAAC;IAChB,YAAY,EAAE,GAAG,CAAC;IAClB,QAAQ,EAAE,GAAG,CAAC;IACd,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,kBAAkB,EACd,CAAC,CAAC,KAAK,EAAE,uBAAuB,KAAK,GAAG,CAAC,OAAO,CAAC,GACjD,KAAK,CAAC,yBAAyB,CAC7B,uBAAuB,GAAG,KAAK,CAAC,aAAa,CAAC,gBAAgB,CAAC,CAChE,CAAC;IACN,YAAY,EAAE,CAAC,KAAK,EAAE;QACpB,KAAK,EAAE,MAAM,CAAC;QACd,UAAU,EAAE,OAAO,CAAC;QACpB,WAAW,EAAE,MAAM,IAAI,CAAC;QACxB,UAAU,EAAE,CAAC,EAAE,QAAQ,EAAE,EAAE;YAAE,QAAQ,EAAE,MAAM,GAAG,CAAC,OAAO,CAAA;SAAE,KAAK,GAAG,CAAC,OAAO,CAAC;KAC5E,KAAK,GAAG,CAAC,OAAO,CAAC;IAClB,eAAe,EAAE,GAAG,CAAC;IACrB,MAAM,EAAE,GAAG,CAAC;IACZ,sBAAsB,EAAE,MAAM,GAAG,CAAC,OAAO,CAAC;IAC1C,gBAAgB,EAAE,MAAM,GAAG,CAAC,OAAO,CAAC;CACrC,2CAsNA"}

package/dist/esm/components/ReportBuilder/AddColumnModal.js

@@ -86,7 +86,8 @@ export default function AddColumnModal({ onSave, orderedColumnNames, setOrderedC
                             let tableName = initialTableName;
                             const orderedSelectedColumns = [];
                             for (const value of orderedColumnNames) {
-                                const [table, column] = value.split('.');
+                                const [table, ...rest] = value.split('.');
+                                const column = rest.join('.');
                                 if (selectedColumns.includes(value)) {
                                     tableName = table;
                                     orderedSelectedColumns.push(column);