@quillsql/react 2.15.17 → 2.16.1

package/dist/index.cjs

@@ -646,12 +646,9 @@ var formatPercent = (value) => {
   return formatterPercent.format(Number(value));
 };
 var _getUTCDateHelper = (value, fmt) => {
-  if (value === null || value === void 0) {
-    return "-";
-  }
   const parsedDate = (0, import_date_fns.parse)(value, fmt, /* @__PURE__ */ new Date());
   const utcDate = (0, import_date_fns.isValid)(parsedDate) ? (0, import_date_fns_tz.utcToZonedTime)(parsedDate, "UTC") : (0, import_date_fns_tz.utcToZonedTime)(new Date(value), "UTC");
-  if (!(0, import_date_fns.isValid)(utcDate)) return "-";
+  if (!(0, import_date_fns.isValid)(utcDate)) return value;
   return (0, import_date_fns.format)(utcDate, fmt);
 };
 var format_YYYY = (value) => _getUTCDateHelper(value, "yyyy");
@@ -662,11 +659,8 @@ var format_MMM_dd_yyyy = (value) => {
   return _getUTCDateHelper(value, "dd MMM yyyy");
 };
 var format_MMM_d_MMM_d = (value, dateRange, databaseType) => {
-  if (value === null || value === void 0) {
-    return "-";
-  }
   const utcDate = (0, import_date_fns.parseISO)(value.split("T")[0]);
-  if (!(0, import_date_fns.isValid)(utcDate)) return "-";
+  if (!(0, import_date_fns.isValid)(utcDate)) return "Invalid date";
   let weekStartsOn = 1;
   if (databaseType && ["mssql"].includes(databaseType)) {
     weekStartsOn = 0;
@@ -697,21 +691,15 @@ var format_MMM_d_MMM_d = (value, dateRange, databaseType) => {
   }
 };
 var format_MMM_dd_hh_mm_ap_pm = (value) => {
-  if (value === null || value === void 0) {
-    return "-";
-  }
   const utcDate = (0, import_date_fns_tz.utcToZonedTime)(new Date(value), "UTC");
-  if (!(0, import_date_fns.isValid)(utcDate)) return "-";
+  if (!(0, import_date_fns.isValid)(utcDate)) return "Invalid date";
   const formatStr = utcDate.getMinutes() === 0 ? "MMM do h a" : "MMM do h:mm a";
   const res = (0, import_date_fns.format)(utcDate, formatStr);
   return res.slice(0, -2) + res.slice(-2).toLowerCase();
 };
 var format_wo_yyyy = (value) => {
-  if (value === null || value === void 0) {
-    return "-";
-  }
   const utcDate = (0, import_date_fns_tz.utcToZonedTime)(new Date(value), "UTC");
-  if (!(0, import_date_fns.isValid)(utcDate)) return "-";
+  if (!(0, import_date_fns.isValid)(utcDate)) return "Invalid date";
   return `${(0, import_date_fns.getWeek)(utcDate)},${utcDate.getFullYear()}`;
 };
 function parseNumber(value) {
@@ -28368,7 +28356,7 @@ var ChartTooltipPrimary = (props) => /* @__PURE__ */ (0, import_jsx_runtime31.js
             paddingTop: 2,
             paddingBottom: 2
           },
-          children: props.label && !isNaN(new Date(props.label)) && props.dateFormatter ? props.dateFormatter(props.label) : props.label && !isNaN(new Date(props.label)) ? (0, import_date_fns10.format)(new Date(props.label), "MMM yyyy") : props.label || "-"
+          children: !isNaN(new Date(props.label)) && props.dateFormatter ? props.dateFormatter(props.label) : !isNaN(new Date(props.label)) ? (0, import_date_fns10.format)(new Date(props.label), "MMM yyyy") : props.label
         }
       )
     }
@@ -28417,9 +28405,9 @@ function reformatComparisonPayload(props, primaryLabel, comparisonLabel) {
       const nameKey = isComparison ? `comparison_${props.xAxisField}` : props.xAxisField;
       const days = LABEL_TO_DAYS[primaryLabel] ?? 0;
       const primaryDate = item.payload[props.xAxisField] ?? 0;
-      const compDate = primaryDate ? (0, import_date_fns10.subDays)(new Date(primaryDate), days + 1) : /* @__PURE__ */ new Date();
+      const compDate = (0, import_date_fns10.subDays)(new Date(primaryDate), days + 1);
       const date = item.payload[nameKey] ?? (0, import_date_fns10.format)(compDate, props.xAxisFormat);
-      const name2 = props.dateFormatter ? props.dateFormatter(date) : date;
+      const name2 = props.dateFormatter(date);
       const color2 = item.color;
       const value = props.valueFormatter(item.value, item.name);
       if (!columnsByKey[""]) {
@@ -28451,7 +28439,7 @@ function reformatComparisonPayload(props, primaryLabel, comparisonLabel) {
   return columnsByKey;
 }
 function getTooltipLabel(props, altTooltipLabel, isDateXAxis) {
-  return props.payload.length <= 2 && altTooltipLabel && isDateXAxis ? altTooltipLabel && !isNaN(new Date(altTooltipLabel)) && props.dateFormatter ? props.dateFormatter(altTooltipLabel) : altTooltipLabel && !isNaN(new Date(altTooltipLabel)) ? (0, import_date_fns10.format)(new Date(altTooltipLabel), "MMM yyyy") : altTooltipLabel || "-" : props.label && !isNaN(new Date(props.label)) && props.dateFormatter ? props.dateFormatter(props.label) : props.label && !isNaN(new Date(props.label)) ? (0, import_date_fns10.format)(new Date(props.label), "MMM yyyy") : props.label || "-";
+  return props.payload.length <= 2 && altTooltipLabel && isDateXAxis ? !isNaN(new Date(altTooltipLabel)) && props.dateFormatter ? props.dateFormatter(altTooltipLabel) : !isNaN(new Date(altTooltipLabel)) ? (0, import_date_fns10.format)(new Date(altTooltipLabel), "MMM yyyy") : altTooltipLabel : !isNaN(new Date(props.label)) && props.dateFormatter ? props.dateFormatter(props.label) : !isNaN(new Date(props.label)) ? (0, import_date_fns10.format)(new Date(props.label), "MMM yyyy") : props.label;
 }
 function ChartTooltipComparison(props) {
   const isDateXAxis = isDateFormat(props.xAxisFormat);
@@ -31661,23 +31649,53 @@ function QuillMetricComponent({
                       width: "100%"
                     }
                   }
-                ) : !report?.rows?.[0] || report.rows[0][report.xAxisField] === null ? /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(
+                ) : !report?.rows || report?.rows?.length === 0 || report.rows[0]?.[report.xAxisField] === null || report.rows[0]?.[report.xAxisField] === void 0 ? /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(
                   "div",
                   {
                     style: {
-                      display: "flex",
-                      flex: "1 0 auto",
-                      // height: '100%',
-                      margin: "auto",
-                      justifyContent: "center",
-                      alignItems: "center",
-                      fontSize: 13,
-                      fontFamily: theme?.fontFamily,
-                      color: theme?.secondaryTextColor,
-                      maxWidth: "100%",
-                      width: "100%"
+                      padding: 0,
+                      height: "100%",
+                      width: "100%",
+                      boxSizing: "content-box",
+                      flex: 1
                     },
-                    children: "No results"
+                    children: /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(
+                      "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%",
+                          minHeight: "80px",
+                          display: "flex",
+                          width: "100%",
+                          flexDirection: "row",
+                          justifyContent: "center",
+                          alignItems: "center"
+                        },
+                        children: /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(
+                          "span",
+                          {
+                            style: {
+                              fontFamily: theme?.fontFamily,
+                              fontSize: 13,
+                              color: theme?.secondaryTextColor,
+                              fontWeight: "normal"
+                            },
+                            children: "No results"
+                          }
+                        )
+                      }
+                    )
                   }
                 ) : /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(
                   MetricDisplay,
@@ -32863,7 +32881,7 @@ function USMap({
     acc[curr[xAxisField]?.toString()] = curr;
     return acc;
   }, {});
-  const measureField = yAxisFields[0].field;
+  const measureField = yAxisFields[0]?.field;
   const [scaleLog, setScaleLog] = (0, import_react26.useState)(null);
   (0, import_react26.useEffect)(() => {
     import("d3-scale").then((scale) => {
@@ -32899,6 +32917,29 @@ function USMap({
   const hoveredValue = (0, import_react26.useMemo)(() => {
     return !hoveredState ? void 0 : mappedData[fipsToNames[hoveredState]?.abbreviation ?? ""]?.[measureField] ?? mappedData[fipsToNames[hoveredState]?.name ?? ""]?.[measureField] ?? mappedData[fipsToNames[hoveredState]?.abbreviation?.toLowerCase() ?? ""]?.[measureField] ?? mappedData[fipsToNames[hoveredState]?.name?.toLowerCase() ?? ""]?.[measureField];
   }, [hoveredState, mappedData, measureField]);
+  if (!measureField) {
+    return /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(
+      "div",
+      {
+        style: {
+          display: "flex",
+          flex: "1 0 auto",
+          marginLeft: "auto",
+          marginRight: "auto",
+          marginTop: "auto",
+          marginBottom: "auto",
+          justifyContent: "center",
+          alignItems: "center",
+          fontSize: 13,
+          color: theme?.secondaryTextColor,
+          fontFamily: theme?.fontFamily,
+          ...containerStyle
+        },
+        className,
+        children: "No results"
+      }
+    );
+  }
   return /* @__PURE__ */ (0, import_jsx_runtime45.jsxs)(
     "div",
     {
@@ -33031,7 +33072,7 @@ function WorldMap({
     acc[curr[xAxisField]?.toString()] = curr;
     return acc;
   }, {});
-  const measureField = yAxisFields[0].field;
+  const measureField = yAxisFields[0]?.field;
   const [scaleLog, setScaleLog] = (0, import_react26.useState)(null);
   (0, import_react26.useEffect)(() => {
     import("d3-scale").then((scale) => {
@@ -33067,6 +33108,29 @@ function WorldMap({
   const hoveredValue = (0, import_react26.useMemo)(() => {
     return !hoveredCountry ? void 0 : mappedData[isoToNames[hoveredCountry]?.abbreviation ?? ""]?.[measureField] ?? mappedData[isoToNames[hoveredCountry]?.name ?? ""]?.[measureField] ?? mappedData[isoToNames[hoveredCountry]?.abbreviation?.toLowerCase() ?? ""]?.[measureField] ?? mappedData[isoToNames[hoveredCountry]?.name?.toLowerCase() ?? ""]?.[measureField];
   }, [hoveredCountry, mappedData, measureField]);
+  if (!measureField) {
+    return /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(
+      "div",
+      {
+        style: {
+          display: "flex",
+          flex: "1 0 auto",
+          marginLeft: "auto",
+          marginRight: "auto",
+          marginTop: "auto",
+          marginBottom: "auto",
+          justifyContent: "center",
+          alignItems: "center",
+          fontSize: 13,
+          color: theme?.secondaryTextColor,
+          fontFamily: theme?.fontFamily,
+          ...containerStyle
+        },
+        className,
+        children: "No results"
+      }
+    );
+  }
   return /* @__PURE__ */ (0, import_jsx_runtime45.jsxs)(
     "div",
     {
@@ -35574,27 +35638,41 @@ var ChartDisplay = ({
     );
   }
   if (config?.chartType?.toLowerCase() === "metric") {
-    if (!config?.rows || config?.rows?.length === 0 || // @ts-ignore
-    config?.rows[0][config?.xAxisField] === null) {
+    if (!config?.rows || config?.rows?.length === 0 || config?.rows[0]?.[config?.xAxisField] === null || config?.rows[0]?.[config?.xAxisField] === void 0) {
       return /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(
         "div",
         {
           style: {
-            display: "flex",
-            flex: "1 0 auto",
-            // height: containerStyle?.height || '100%',
-            margin: "auto",
-            justifyContent: "center",
-            alignItems: "center",
-            fontSize: 13,
             fontFamily: theme?.fontFamily,
-            color: theme?.secondaryTextColor,
+            fontSize: 32,
+            color: theme?.primaryTextColor,
+            fontWeight: "600",
+            textOverflow: "ellipsis",
+            margin: 0,
+            whiteSpace: "nowrap",
+            boxSizing: "content-box",
             maxWidth: "100%",
+            textAlign: "left",
+            overflow: "hidden",
+            height: containerStyle?.height || "100%",
+            display: "flex",
             width: "100%",
+            flexDirection: "row",
+            alignItems: "center",
             ...containerStyle
           },
           className,
-          children: "No results"
+          children: /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(
+            "span",
+            {
+              style: {
+                fontFamily: theme?.fontFamily,
+                fontSize: 13,
+                color: theme?.secondaryTextColor
+              },
+              children: "No results"
+            }
+          )
         }
       );
     }
@@ -42482,15 +42560,19 @@ function ChartBuilderWithModal(props) {
       title: title || "Add to dashboard",
       width: isHorizontalView ? modalWidth : void 0,
       height: isHorizontalView ? modalHeight : void 0,
-      children: (props.reportId ? dashboard[props.reportId] ?? props.tempReport : props.tempReport) ? /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(
-        ChartBuilder,
-        {
-          ...props,
-          filtersEnabled: filtersEnabledState,
-          onFiltersEnabledChanged: setFiltersEnabledState,
-          runQueryOnMount: filtersEnabledState
-        }
-      ) : /* @__PURE__ */ (0, import_jsx_runtime65.jsx)("div", { style: { padding: 20 }, children: /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(QuillLoadingComponent, {}) })
+      children: (() => {
+        const resolvedReport = props.reportId ? dashboard[props.reportId] ?? props.tempReport : props.tempReport;
+        return resolvedReport ? /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(
+          ChartBuilder,
+          {
+            ...props,
+            tempReport: resolvedReport,
+            filtersEnabled: filtersEnabledState,
+            onFiltersEnabledChanged: setFiltersEnabledState,
+            runQueryOnMount: filtersEnabledState
+          }
+        ) : /* @__PURE__ */ (0, import_jsx_runtime65.jsx)("div", { style: { padding: 20 }, children: /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(QuillLoadingComponent, {}) });
+      })()
     }
   ) });
 }
@@ -42540,6 +42622,7 @@ function ChartBuilder({
   hideSubmitButton = false,
   hideDateRangeFilter = false,
   showTableFormatOptions,
+  showDashboardFilterFields,
   initialUniqueValues,
   initialUniqueValuesIsLoading,
   pivotRecommendationsEnabled = true,
@@ -42569,7 +42652,7 @@ function ChartBuilder({
   const { tenants, flags } = (0, import_react43.useContext)(TenantContext);
   const report = (0, import_react43.useMemo)(() => {
     return reportId && !tempReport ? allReportsById[reportId] : tempReport;
-  }, [reportId]);
+  }, [reportId, tempReport, allReportsById]);
   const [windowWidth, setWindowWidth] = (0, import_react43.useState)(1200);
   const [rows, setRows] = (0, import_react43.useState)(report?.rows ?? []);
   const [itemQuery, setItemQuery] = (0, import_react43.useState)(report?.itemQuery);
@@ -45062,7 +45145,7 @@ function ChartBuilder({
                           ]
                         }
                       ),
-                      specificDashboardFilters.length > 0 && isAdmin && /* @__PURE__ */ (0, import_jsx_runtime65.jsxs)(
+                      specificDashboardFilters.length > 0 && (showDashboardFilterFields || isAdmin) && /* @__PURE__ */ (0, import_jsx_runtime65.jsxs)(
                         "div",
                         {
                           style: {
@@ -45073,7 +45156,7 @@ function ChartBuilder({
                           },
                           children: [
                             /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(HeaderComponent, { label: "Dashboard filter fields" }),
-                            isAdmin && formData.dateField && dashboardConfig[formData.dashboardName ?? destinationDashboardName ?? ""]?.config.dateFilter?.label && /* @__PURE__ */ (0, import_jsx_runtime65.jsxs)(ChartBuilderInputRowContainer, { children: [
+                            (showDashboardFilterFields || isAdmin) && formData.dateField && dashboardConfig[formData.dashboardName ?? destinationDashboardName ?? ""]?.config.dateFilter?.label && /* @__PURE__ */ (0, import_jsx_runtime65.jsxs)(ChartBuilderInputRowContainer, { children: [
                               /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(
                                 TextInputComponent,
                                 {
@@ -46012,6 +46095,7 @@ function SQLEditor({
   CheckboxComponent = QuillChartBuilderCheckboxComponent,
   defaultQuery,
   destinationDashboard,
+  destinationSection,
   onChangeQuery,
   onChangeData,
   onChangeColumns,
@@ -46021,12 +46105,16 @@ function SQLEditor({
   onCloseChartBuilder,
   isChartBuilderEnabled = false,
   isAdminEnabled = false,
+  chartBuilderOptions,
   chartBuilderTitle,
   runQueryOnMount = false,
   onAddToDashboardComplete,
+  onSubmitCreateReport,
+  onSubmitEditReport,
   onSaveQueryComplete,
   addToDashboardButtonLabel = "Add to dashboard",
   report = void 0,
+  reportId = void 0,
   organizationName = void 0,
   isChartBuilderHorizontalView = true,
   containerStyle = { height: "100vh" },
@@ -46037,7 +46125,7 @@ function SQLEditor({
   const [sqlPrompt, setSqlPrompt] = (0, import_react45.useState)("");
   const [client] = (0, import_react45.useContext)(ClientContext);
   const [theme] = (0, import_react45.useContext)(ThemeContext);
-  const { tenants } = (0, import_react45.useContext)(TenantContext);
+  const { tenants, flags } = (0, import_react45.useContext)(TenantContext);
   const { dashboards } = useDashboards();
   const {
     data,
@@ -46046,6 +46134,7 @@ function SQLEditor({
   } = useDashboardInternal(destinationDashboard);
   const { getToken, quillFetchWithToken } = (0, import_react45.useContext)(FetchContext);
   const { eventTracking } = (0, import_react45.useContext)(EventTrackingContext);
+  const { allReportsById } = useAllReports();
   const destinationDashboardConfig = (0, import_react45.useMemo)(() => {
     return dashboards?.find((d) => d.name === destinationDashboard);
   }, [dashboards, destinationDashboard]);
@@ -46113,6 +46202,46 @@ function SQLEditor({
       reload();
     }
   }, [data, dashboardIsLoading]);
+  (0, import_react45.useEffect)(() => {
+    const loadReport = async () => {
+      let reportToLoad;
+      if (!client) {
+        return;
+      }
+      try {
+        if (!reportId) {
+          throw new Error("Report ID is required");
+        }
+        reportToLoad = allReportsById[reportId];
+        if (!reportToLoad) {
+          throw new Error("Report not found");
+        }
+        setQuery(reportToLoad.queryString || "");
+        setTempReport(reportToLoad);
+        if (reportToLoad.rows && reportToLoad.rows.length > 0) {
+          setRows(reportToLoad.rows);
+          setDisplayTable(true);
+        }
+      } catch (err) {
+        console.error(err);
+        eventTracking?.logError?.({
+          type: "bug",
+          severity: "high",
+          message: "Error loading report",
+          errorMessage: err.message,
+          errorStack: err.stack,
+          errorData: {
+            caller: "SQLEditor",
+            function: "loadReport"
+          }
+        });
+        setErrorMessage("Error when loading report");
+      }
+    };
+    if (reportId && client) {
+      loadReport();
+    }
+  }, [allReportsById[reportId || ""], client]);
   const dynamicHeight = tableRef.current ? tableRef.current.clientHeight : cachedHeight;
   const rowsPerPage = Math.max(
     DEFAULT_ROWS_PER_PAGE,
@@ -46931,13 +47060,38 @@ function SQLEditor({
             isHorizontalView: isChartBuilderHorizontalView,
             isOpen: isChartBuilderOpen,
             setIsOpen: setIsChartBuilderOpen,
-            onAddToDashboardComplete,
+            onAddToDashboardComplete: reportId || report?.id ? (data2) => {
+              if (onSubmitEditReport) {
+                onSubmitEditReport(data2);
+              } else if (onAddToDashboardComplete) {
+                onAddToDashboardComplete(data2);
+              }
+              if (!isAdminEnabled && destinationDashboard) {
+                reload(destinationDashboard, false, {
+                  report: data2,
+                  action: "upsert"
+                });
+              }
+            } : (data2) => {
+              if (onSubmitCreateReport) {
+                onSubmitCreateReport(data2);
+              } else if (onAddToDashboardComplete) {
+                onAddToDashboardComplete(data2);
+              }
+              if (!isAdminEnabled && destinationDashboard) {
+                reload(destinationDashboard, false, {
+                  report: data2,
+                  action: "upsert"
+                });
+              }
+            },
             destinationDashboard,
+            destinationSection,
             isAdmin: isAdminEnabled,
             title: chartBuilderTitle,
             buttonLabel: addToDashboardButtonLabel,
             tempReport,
-            reportId: report?.id,
+            reportId: reportId || report?.id,
             organizationName,
             CardComponent,
             TableComponent,
@@ -46962,6 +47116,8 @@ function SQLEditor({
             CheckboxComponent,
             hideDateRangeFilter: true,
             hideDeleteButton: true,
+            showTableFormatOptions: chartBuilderOptions?.showTableFormatOptions,
+            showDashboardFilterFields: chartBuilderOptions?.showDashboardFilterFields,
             onClickChartElement,
             isEditingMode: true
           }
@@ -46981,7 +47137,7 @@ function SQLEditor({
             isAdmin: false,
             title: "Save query",
             buttonLabel: "Save query",
-            tempReport,
+            tempReport: { ...tempReport, dashboardName: SAVED_QUERIES_DASHBOARD },
             reportId: report?.id,
             organizationName,
             CardComponent,
@@ -48744,7 +48900,6 @@ var useReportBuilderInternal = ({
         }
         report = allReportsById[reportId];
         if (!report) {
-          console.log("no report");
           throw new Error("Report not found");
         }
         const { ast: newAst, pivot: newPivot } = await fetchASTFromQuillReport(
@@ -51269,6 +51424,8 @@ var SaveReport = ({
   onSubmitEditReport = () => void 0,
   onSubmitCreateReport = () => void 0,
   destinationSection,
+  showTableFormatOptions,
+  showDashboardFilterFields,
   SelectComponent = QuillSelectComponent,
   TextInputComponent = QuillTextInput,
   ButtonComponent = MemoizedButton,
@@ -51301,6 +51458,7 @@ var SaveReport = ({
   ),
   submitButtonLabel
 }) => {
+  const { reload } = useDashboardInternal(reportBuilder.destinationDashboard ?? null);
   return /* @__PURE__ */ (0, import_jsx_runtime79.jsxs)("div", { children: [
     SaveTrigger,
     /* @__PURE__ */ (0, import_jsx_runtime79.jsx)(
@@ -51313,7 +51471,17 @@ var SaveReport = ({
         isHorizontalView: true,
         isOpen,
         setIsOpen,
-        onAddToDashboardComplete: reportBuilder.reportId ? onSubmitEditReport : onSubmitCreateReport,
+        onAddToDashboardComplete: reportBuilder.reportId ? (data) => {
+          onSubmitEditReport(data);
+          if (!isAdminEnabled && reportBuilder.destinationDashboard) {
+            reload(reportBuilder.destinationDashboard, false, { report: data, action: "upsert" });
+          }
+        } : (data) => {
+          onSubmitCreateReport(data);
+          if (!isAdminEnabled && reportBuilder.destinationDashboard) {
+            reload(reportBuilder.destinationDashboard, false, { report: data, action: "upsert" });
+          }
+        },
         destinationDashboard: reportBuilder.destinationDashboard,
         destinationSection,
         initialUniqueValues: reportBuilder.columnUniqueValues,
@@ -51342,6 +51510,8 @@ var SaveReport = ({
         FormContainer: ChartBuilderFormContainer,
         hideDateRangeFilter: true,
         hideDeleteButton: true,
+        showTableFormatOptions,
+        showDashboardFilterFields,
         buttonLabel: submitButtonLabel ?? (!!reportBuilder.reportId ? "Save changes" : "Add to dashboard"),
         onClickChartElement,
         isEditingMode: true
@@ -51437,6 +51607,7 @@ function ReportBuilder({
   containerStyle,
   className,
   pivotRecommendationsEnabled = true,
+  chartBuilderOptions,
   reportId,
   hideCopySQL = true,
   isChartBuilderHorizontalView = true,
@@ -51876,6 +52047,8 @@ function ReportBuilder({
             ErrorMessageComponent,
             PivotRowContainer,
             PivotColumnContainer,
+            showTableFormatOptions: chartBuilderOptions?.showTableFormatOptions,
+            showDashboardFilterFields: chartBuilderOptions?.showDashboardFilterFields,
             onClickChartElement,
             submitButtonLabel
           }
@@ -51896,7 +52069,7 @@ function ReportBuilder({
             isAdmin: false,
             title: "Save query",
             buttonLabel: "Save query",
-            tempReport,
+            tempReport: { ...tempReport, dashboardName: SAVED_QUERIES_DASHBOARD },
             reportId,
             organizationName,
             CardComponent,

package/dist/index.d.cts

@@ -1751,8 +1751,13 @@ interface SQLEditorProps {
     onCloseChartBuilder?: () => void;
     /**
      * A callback that is fired when a report has been added to a dashboard.
+     * @deprecated Use onSubmitCreateReport and onSubmitEditReport instead
      */
     onAddToDashboardComplete?: (report: QuillReport) => void;
+    /** A callback function that will trigger when a new chart is saved */
+    onSubmitCreateReport?: (report: QuillReport) => void;
+    /** A callback function that will trigger when a chart is edited */
+    onSubmitEditReport?: (report: QuillReport) => void;
     onSaveQueryComplete?: (report: QuillReport) => void;
     /** A callback function triggered when a chart element is clicked */
     onClickChartElement?: (event: any) => void;
@@ -1779,9 +1784,14 @@ interface SQLEditorProps {
      */
     isAdminEnabled?: boolean;
     /**
-     * Whether to show table format options.
+     * Options for the chart builder modal.
      */
-    showTableFormatOptions?: boolean;
+    chartBuilderOptions?: {
+        /** Whether to show table format options. */
+        showTableFormatOptions?: boolean;
+        /** Whether to show dashboard filter fields. */
+        showDashboardFilterFields?: boolean;
+    };
     /**
      * Whether to show date field options.
      */
@@ -1794,6 +1804,10 @@ interface SQLEditorProps {
      * A dashboard item.
      */
     report?: QuillReport;
+    /**
+     * A report id that the SQL Editor will query from and modify.
+     */
+    reportId?: string;
     /**
      * The default query to use as a placeholder.
      */
@@ -1802,6 +1816,10 @@ interface SQLEditorProps {
      * The default dashboard to add the query to.
      */
     destinationDashboard: string;
+    /**
+     * The section of the dashboard to add items to.
+     */
+    destinationSection?: string;
     /**
      * The title of the ChartBuilder dialog.
      */
@@ -1856,7 +1874,7 @@ interface SQLEditorProps {
  * ### SQLEditor API
  * @see https://docs.quillsql.com/components/sql-editor
  */
-declare function SQLEditor({ ButtonComponent, SecondaryButtonComponent, DeleteButtonComponent, TextInputComponent, SelectComponent, TableComponent, isNewQueryEnabled, LoadingComponent, ModalComponent, PopoverComponent, CardComponent, LabelComponent, HeaderComponent, SubHeaderComponent, TextComponent, ErrorMessageComponent, ChartBuilderInputRowContainer, ChartBuilderInputColumnContainer, PivotRowContainer, PivotColumnContainer, ChartBuilderFormContainer, CheckboxComponent, defaultQuery, destinationDashboard, onChangeQuery, onChangeData, onChangeColumns, onChangeFields, onDiscardChanges, onSaveChanges, onCloseChartBuilder, isChartBuilderEnabled, isAdminEnabled, chartBuilderTitle, runQueryOnMount, onAddToDashboardComplete, onSaveQueryComplete, addToDashboardButtonLabel, report, organizationName, isChartBuilderHorizontalView, containerStyle, className, onClickChartElement, onRequestAddVirtualTable, }: SQLEditorProps): react_jsx_runtime.JSX.Element;
+declare function SQLEditor({ ButtonComponent, SecondaryButtonComponent, DeleteButtonComponent, TextInputComponent, SelectComponent, TableComponent, isNewQueryEnabled, LoadingComponent, ModalComponent, PopoverComponent, CardComponent, LabelComponent, HeaderComponent, SubHeaderComponent, TextComponent, ErrorMessageComponent, ChartBuilderInputRowContainer, ChartBuilderInputColumnContainer, PivotRowContainer, PivotColumnContainer, ChartBuilderFormContainer, CheckboxComponent, defaultQuery, destinationDashboard, destinationSection, onChangeQuery, onChangeData, onChangeColumns, onChangeFields, onDiscardChanges, onSaveChanges, onCloseChartBuilder, isChartBuilderEnabled, isAdminEnabled, chartBuilderOptions, chartBuilderTitle, runQueryOnMount, onAddToDashboardComplete, onSubmitCreateReport, onSubmitEditReport, onSaveQueryComplete, addToDashboardButtonLabel, report, reportId, organizationName, isChartBuilderHorizontalView, containerStyle, className, onClickChartElement, onRequestAddVirtualTable, }: SQLEditorProps): react_jsx_runtime.JSX.Element;
 declare const SchemaListComponent: ({ schema, theme, loading, LoadingComponent, width, onClick, style, onRequestAddVirtualTable, ButtonComponent, }: {
     schema: any;
     theme: any;
@@ -2126,6 +2144,15 @@ interface ReportBuilderProps {
     isAIEnabled?: boolean;
     /** Whether the PivotModal's AI features are enabled. */
     pivotRecommendationsEnabled?: boolean;
+    /**
+     * Options for the chart builder modal.
+     */
+    chartBuilderOptions?: {
+        /** Whether to show table format options. */
+        showTableFormatOptions?: boolean;
+        /** Whether to show dashboard filter fields. */
+        showDashboardFilterFields?: boolean;
+    };
     /**
      * Applies the following classes to the ReportBuilder.
      *
@@ -2195,7 +2222,7 @@ interface ReportBuilderProps {
  * ### Report Builder API
  * @see https://docs.quillsql.com/components/report-builder
  */
-declare function ReportBuilder$1({ initialTableName, onSubmitEditReport, onSubmitCreateReport, onSubmitSaveQuery, onDiscardChanges, onSaveChanges, onCloseChartBuilder, destinationDashboard, destinationSection, chartBuilderTitle, organizationName, ButtonComponent, SecondaryButtonComponent, DeleteButtonComponent, ModalComponent, TextInputComponent, SelectComponent, MultiSelectComponent, TableComponent, PopoverComponent, TabsComponent, CheckboxComponent, SidebarComponent, ContainerComponent, SelectColumnComponent, DraggableColumnComponent, SidebarHeadingComponent, FilterPopoverComponent, SortPopoverComponent, LimitPopoverComponent, CardComponent, LabelComponent, HeaderComponent, SubHeaderComponent, TextComponent, ErrorMessageComponent, ChartBuilderInputRowContainer, ChartBuilderInputColumnContainer, PivotRowContainer, PivotColumnContainer, LoadingComponent, ColumnSearchEmptyState, ChartBuilderFormContainer, ChartBuilderModalComponent, isAdminEnabled, isAIEnabled, containerStyle, className, pivotRecommendationsEnabled, reportId, hideCopySQL, isChartBuilderHorizontalView, onClickChartElement, onRequestAddVirtualTable, submitButtonLabel, }: ReportBuilderProps): react_jsx_runtime.JSX.Element;
+declare function ReportBuilder$1({ initialTableName, onSubmitEditReport, onSubmitCreateReport, onSubmitSaveQuery, onDiscardChanges, onSaveChanges, onCloseChartBuilder, destinationDashboard, destinationSection, chartBuilderTitle, organizationName, ButtonComponent, SecondaryButtonComponent, DeleteButtonComponent, ModalComponent, TextInputComponent, SelectComponent, MultiSelectComponent, TableComponent, PopoverComponent, TabsComponent, CheckboxComponent, SidebarComponent, ContainerComponent, SelectColumnComponent, DraggableColumnComponent, SidebarHeadingComponent, FilterPopoverComponent, SortPopoverComponent, LimitPopoverComponent, CardComponent, LabelComponent, HeaderComponent, SubHeaderComponent, TextComponent, ErrorMessageComponent, ChartBuilderInputRowContainer, ChartBuilderInputColumnContainer, PivotRowContainer, PivotColumnContainer, LoadingComponent, ColumnSearchEmptyState, ChartBuilderFormContainer, ChartBuilderModalComponent, isAdminEnabled, isAIEnabled, containerStyle, className, pivotRecommendationsEnabled, chartBuilderOptions, reportId, hideCopySQL, isChartBuilderHorizontalView, onClickChartElement, onRequestAddVirtualTable, submitButtonLabel, }: ReportBuilderProps): react_jsx_runtime.JSX.Element;
 
 /**
  * Props for the Quill ChartEditor component.
@@ -3260,6 +3287,10 @@ interface SaveReportProps {
     onSubmitCreateReport?: (report: QuillReport) => void;
     /** The destination section for the report. */
     destinationSection?: string;
+    /** Whether to show table format options. */
+    showTableFormatOptions?: boolean;
+    /** Whether to show dashboard filter fields. */
+    showDashboardFilterFields?: boolean;
     /** A select component. */
     SelectComponent?: (props: {
         value: string | number | undefined | null;
@@ -3399,7 +3430,7 @@ interface SaveReportProps {
     /** The label for the submit button. */
     submitButtonLabel?: string;
 }
-declare const SaveReport: ({ reportBuilder, isOpen, setIsOpen, isAdminEnabled, chartBuilderTitle, onSubmitEditReport, onSubmitCreateReport, destinationSection, SelectComponent, TextInputComponent, ButtonComponent, SecondaryButtonComponent, HeaderComponent, SubHeaderComponent, LabelComponent, TextComponent, CardComponent, ModalComponent, PopoverComponent, TableComponent, DeleteButtonComponent, LoadingComponent, ChartBuilderInputRowContainer, ChartBuilderInputColumnContainer, PivotRowContainer, PivotColumnContainer, ErrorMessageComponent, CheckboxComponent, ChartBuilderFormContainer, onClickChartElement, SaveTrigger, submitButtonLabel, }: SaveReportProps) => react_jsx_runtime.JSX.Element;
+declare const SaveReport: ({ reportBuilder, isOpen, setIsOpen, isAdminEnabled, chartBuilderTitle, onSubmitEditReport, onSubmitCreateReport, destinationSection, showTableFormatOptions, showDashboardFilterFields, SelectComponent, TextInputComponent, ButtonComponent, SecondaryButtonComponent, HeaderComponent, SubHeaderComponent, LabelComponent, TextComponent, CardComponent, ModalComponent, PopoverComponent, TableComponent, DeleteButtonComponent, LoadingComponent, ChartBuilderInputRowContainer, ChartBuilderInputColumnContainer, PivotRowContainer, PivotColumnContainer, ErrorMessageComponent, CheckboxComponent, ChartBuilderFormContainer, onClickChartElement, SaveTrigger, submitButtonLabel, }: SaveReportProps) => react_jsx_runtime.JSX.Element;
 
 interface ReportTableProps {
     reportBuilder: ReportBuilder;