@quillsql/react 2.16.21 → 2.16.22

package/dist/index.cjs

@@ -263,6 +263,9 @@ var init_valueFormatter = __esm({
       maximumFractionDigits: 2
     });
     formatPercent = (value) => {
+      if (typeof value === "string" && /^\s*[+-]?(?:\d+(?:\.\d+)?|\.\d+)\s*%\s*$/.test(value)) {
+        return value;
+      }
       return formatterPercent.format(Number(value));
     };
     _getUTCDateHelper = (value, fmt) => {
@@ -19879,11 +19882,12 @@ async function cleanDashboardItem({
       page: DEFAULT_PAGINATION
     };
     if (item.pivot && skipPivotFetch && item.rows && item.fields) {
+      const pivotSourceRows = item.rows.map((row) => ({ ...row }));
       const dateFilter = dashboardFilters?.find(
         (filter) => filter.filterType === "date_range"
       );
       pivotTable = processPivotData({
-        rows: item.rows,
+        rows: pivotSourceRows,
         fields: item.fields,
         pivot: {
           ...item.pivot,
@@ -22145,7 +22149,20 @@ var applyFiltersInMemory = (rows, filters, options) => {
 // src/utils/inMemoryPivotEngine.ts
 init_columnType();
 var MS_IN_DAY = 24 * 60 * 60 * 1e3;
-var MONTHS = ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"];
+var MONTHS = [
+  "Jan",
+  "Feb",
+  "Mar",
+  "Apr",
+  "May",
+  "Jun",
+  "Jul",
+  "Aug",
+  "Sep",
+  "Oct",
+  "Nov",
+  "Dec"
+];
 var INVALID_DATE_KEY = "-2026";
 function singleAggToMultiAgg(pivot) {
   if (pivot.aggregations) {
@@ -22153,7 +22170,12 @@ function singleAggToMultiAgg(pivot) {
   }
   const newPivot = { ...pivot };
   const newAgg = { aggregationType: pivot.aggregationType };
-  const fieldsToCopy = ["valueField", "valueFieldType", "valueField2", "valueField2Type"];
+  const fieldsToCopy = [
+    "valueField",
+    "valueFieldType",
+    "valueField2",
+    "valueField2Type"
+  ];
   fieldsToCopy.forEach((x) => {
     if (pivot[x]) {
       newAgg[x] = pivot[x];
@@ -22184,6 +22206,12 @@ function isValidDate3(date) {
     return false;
   }
 }
+function isDateLikeType(fieldType) {
+  if (!fieldType) {
+    return false;
+  }
+  return isDateType(fieldType) || isDateFormat2(fieldType);
+}
 function inferDateBucketFromFilters(pivot, filters) {
   if (!pivot?.rowFieldType) {
     return void 0;
@@ -22327,8 +22355,12 @@ function getDateRangeFromFilters(filters) {
 }
 function generateBucketKeys(start2, end, bucket) {
   const keys = /* @__PURE__ */ new Set();
-  const startDay = new Date(Date.UTC(start2.getUTCFullYear(), start2.getUTCMonth(), start2.getUTCDate()));
-  const endDay = new Date(Date.UTC(end.getUTCFullYear(), end.getUTCMonth(), end.getUTCDate()));
+  const startDay = new Date(
+    Date.UTC(start2.getUTCFullYear(), start2.getUTCMonth(), start2.getUTCDate())
+  );
+  const endDay = new Date(
+    Date.UTC(end.getUTCFullYear(), end.getUTCMonth(), end.getUTCDate())
+  );
   const cur = new Date(startDay);
   while (cur <= endDay) {
     keys.add(getDateKey(cur, bucket));
@@ -22352,7 +22384,9 @@ function getBucketRange(dateKey, bucket) {
   let end = new Date(d);
   switch (bucket) {
     case "day":
-      start2 = new Date(Date.UTC(d.getUTCFullYear(), d.getUTCMonth(), d.getUTCDate()));
+      start2 = new Date(
+        Date.UTC(d.getUTCFullYear(), d.getUTCMonth(), d.getUTCDate())
+      );
       end = new Date(start2);
       break;
     case "week":
@@ -22394,10 +22428,18 @@ function getDateKey(date, bucket) {
   }
   switch (bucket) {
     case "day":
-      return Date.UTC(date.getUTCFullYear(), date.getUTCMonth(), date.getUTCDate()).toString();
+      return Date.UTC(
+        date.getUTCFullYear(),
+        date.getUTCMonth(),
+        date.getUTCDate()
+      ).toString();
     case "week": {
       const day = date.getUTCDay();
-      const mondayUtc = Date.UTC(date.getUTCFullYear(), date.getUTCMonth(), date.getUTCDate() - (day + 6) % 7);
+      const mondayUtc = Date.UTC(
+        date.getUTCFullYear(),
+        date.getUTCMonth(),
+        date.getUTCDate() - (day + 6) % 7
+      );
       return mondayUtc.toString();
     }
     case "month":
@@ -22461,7 +22503,11 @@ function assembleFinalRows(seen, rowKey, dateBucket, dateRange) {
         if (bucketEnd > dateRange.end) bucketEnd = dateRange.end;
       }
       return {
-        [rowKey]: formatBucketNameFromRange(bucketStart, bucketEnd, dateBucket),
+        [rowKey]: formatBucketNameFromRange(
+          bucketStart,
+          bucketEnd,
+          dateBucket
+        ),
         ...filled[k],
         __quillRawDate: bucketStart.toISOString()
       };
@@ -22620,7 +22666,13 @@ function aggregateWithColumn(rows, colKey, aggregations, getGroupKey) {
   const seen = {};
   const multiAgg = aggregations.length > 1;
   aggregations.forEach((agg) => {
-    const { aggregationType: type, valueField, valueFieldType, valueField2, valueField2Type } = agg;
+    const {
+      aggregationType: type,
+      valueField,
+      valueFieldType,
+      valueField2,
+      valueField2Type
+    } = agg;
     if (!valueField) {
       if (type !== "count" && type !== "percentage") return;
     }
@@ -22653,7 +22705,10 @@ function aggregateWithColumn(rows, colKey, aggregations, getGroupKey) {
     });
     Object.keys(accs).forEach((groupKey) => {
       if (!seen[groupKey]) seen[groupKey] = {};
-      const sumOfDenom = Object.values(accs[groupKey]).reduce((t, a) => t + a.count, 0);
+      const sumOfDenom = Object.values(accs[groupKey]).reduce(
+        (t, a) => t + a.count,
+        0
+      );
       Object.keys(accs[groupKey]).forEach((colVal) => {
         const acc = accs[groupKey][colVal];
         const finalKey = `${colVal}` + (multiAgg ? `_${type}` : "");
@@ -22675,7 +22730,13 @@ function aggregateWithoutColumn(rows, aggregations, getGroupKey) {
   const seen = {};
   const multiAgg = aggregations.length > 1;
   aggregations.forEach((agg) => {
-    const { aggregationType: type, valueField, valueFieldType, valueField2, valueField2Type } = agg;
+    const {
+      aggregationType: type,
+      valueField,
+      valueFieldType,
+      valueField2,
+      valueField2Type
+    } = agg;
     if (!valueField) {
       if (type !== "count" && type !== "percentage") return;
     }
@@ -22706,7 +22767,10 @@ function aggregateWithoutColumn(rows, aggregations, getGroupKey) {
       }
       updateAccumulator(acc, row, agg, false);
     });
-    const sumOfDenom = Object.values(accs).reduce((t, a) => t + a.count, 0);
+    const sumOfDenom = Object.values(accs).reduce(
+      (t, a) => t + a.count,
+      0
+    );
     Object.keys(accs).forEach((k) => {
       const acc = accs[k];
       seen[k][finalKey] = getFinalAggregationValue({
@@ -22734,13 +22798,18 @@ function applyPivotInMemory(rows, pivot, filters) {
   const dateRange = dateBucket ? getDateRangeFromFilters(filters) : void 0;
   const getRowKey = dateBucket ? (row) => {
     const rawValue = row[rowField];
-    const rawDateValue = rawValue !== null && typeof rawValue === "object" && rawValue.value ? rawValue.value : rawValue;
+    const rawDateFromQuill = row.__quillRawDate;
+    const rawDateValue = rawDateFromQuill ?? (rawValue !== null && typeof rawValue === "object" && rawValue.value ? rawValue.value : rawValue);
     return getDateKey(new Date(rawDateValue), dateBucket);
   } : (row) => row[rowField];
   const aggregated = columnField ? aggregateWithColumn(rows, columnField, aggregations, getRowKey) : aggregateWithoutColumn(rows, aggregations, getRowKey);
   const aggregatedRows = aggregated || {};
   if (rows.length === 0 && dateBucket && dateRange && !columnField) {
-    const bucketKeys = generateBucketKeys(dateRange.start, dateRange.end, dateBucket);
+    const bucketKeys = generateBucketKeys(
+      dateRange.start,
+      dateRange.end,
+      dateBucket
+    );
     const emptyAgg = buildEmptyAggRow(aggregations);
     bucketKeys.forEach((k) => {
       aggregatedRows[k] = { ...emptyAgg };
@@ -22758,6 +22827,61 @@ function applyPivotInMemory(rows, pivot, filters) {
   }
   return sorted;
 }
+function generatePivotColumnsInMemory({
+  pivot,
+  pivotRows,
+  sourceColumns
+}) {
+  if (!pivot?.rowField || !Array.isArray(pivotRows) || pivotRows.length === 0) {
+    return void 0;
+  }
+  const columns = Array.isArray(sourceColumns) ? sourceColumns : [];
+  const rowSource = columns.find((col) => col.field === pivot.rowField);
+  const isRowFieldDate = isDateLikeType(pivot.rowFieldType);
+  const rowFieldType = rowSource?.fieldType ?? pivot.rowFieldType ?? "string";
+  const rowColumn = {
+    field: pivot.rowField,
+    label: rowSource?.label ?? pivot.rowField,
+    format: isRowFieldDate ? "string" : rowSource?.format ?? "string",
+    fieldType: rowFieldType,
+    dataTypeID: rowSource?.dataTypeID ?? 1043,
+    jsType: rowSource?.jsType ?? (isRowFieldDate ? "date" : "string")
+  };
+  const valueFieldFormat = (valueField) => columns.find((col) => col.field === valueField)?.format ?? "whole_number";
+  const multiAgg = (pivot.aggregations?.length ?? 0) > 1;
+  const aggregationBySuffix = new Map(
+    (pivot.aggregations ?? []).map((agg) => [
+      multiAgg ? `_${agg.aggregationType}` : "",
+      agg
+    ])
+  );
+  const valueKeys = Array.from(
+    new Set(
+      pivotRows.flatMap(
+        (row) => Object.keys(row).filter(
+          (key) => key !== pivot.rowField && key !== "__quillRawDate"
+        )
+      )
+    )
+  );
+  const valueColumns = valueKeys.map((key) => {
+    const matchingSuffix = Array.from(aggregationBySuffix.keys()).find(
+      (suffix) => suffix && key.endsWith(suffix)
+    );
+    const matchedAgg = matchingSuffix ? aggregationBySuffix.get(matchingSuffix) : pivot.aggregations?.[0];
+    const format9 = matchedAgg?.aggregationType === "percentage" ? "percent" : valueFieldFormat(matchedAgg?.valueField);
+    const valueFieldType = matchedAgg?.valueFieldType ?? "number";
+    return {
+      field: key,
+      label: key,
+      format: format9,
+      fieldType: valueFieldType,
+      jsType: valueFieldType,
+      dataTypeID: columns.find((col) => col.field === matchedAgg?.valueField)?.dataTypeID ?? 20
+    };
+  });
+  return [rowColumn, ...valueColumns];
+}
 
 // src/utils/cacheCab.ts
 var import_idb = require("idb");
@@ -22875,7 +22999,12 @@ var CacheCab = class {
       }
       const newRows = await this.applyPivotsAndFilters(result, dashboardFilters, customFilters, pivot, tenantPart, false);
       if (pivot) {
-        return { ...result, pivotRows: newRows, pivotRowCount: newRows.length };
+        const pivotColumns = generatePivotColumnsInMemory({
+          pivot,
+          pivotRows: newRows,
+          sourceColumns: result.columnInternal ?? result.columns
+        });
+        return { ...result, pivotRows: newRows, pivotColumns: pivotColumns ?? result.pivotColumns, pivotRowCount: newRows.length };
       }
       return { ...result, rows: newRows, rowCount: newRows.length };
     } else {
@@ -22961,7 +23090,12 @@ var CacheCab = class {
       await this.persistMetaToStorage();
       const newRows = await this.applyPivotsAndFilters(merged, dashboardFilters, customFilters, pivot, tenantPart, false);
       if (pivot) {
-        return { ...merged, pivotRows: newRows, pivotRowCount: newRows.length };
+        const pivotColumns = generatePivotColumnsInMemory({
+          pivot,
+          pivotRows: newRows,
+          sourceColumns: merged.columnInternal ?? merged.columns
+        });
+        return { ...merged, pivotRows: newRows, pivotColumns: pivotColumns ?? merged.pivotColumns, pivotRowCount: newRows.length };
       }
       return { ...merged, rows: newRows, rowCount: newRows.length };
     }
@@ -22989,7 +23123,12 @@ var CacheCab = class {
       const tenantPart = tenants ? JSON.stringify(tenants) : "";
       const newRows = await this.applyPivotsAndFilters(parsed, dashboardFilters, customFilters, pivot, tenantPart);
       if (pivot) {
-        return { ...parsed, pivotRows: newRows, pivotRowCount: newRows.length };
+        const pivotColumns = generatePivotColumnsInMemory({
+          pivot,
+          pivotRows: newRows,
+          sourceColumns: parsed.columnInternal ?? parsed.columns
+        });
+        return { ...parsed, pivotRows: newRows, pivotColumns: pivotColumns ?? parsed.pivotColumns, pivotRowCount: newRows.length };
       }
       return { ...parsed, rows: newRows, rowCount: newRows.length };
     } catch (err) {
@@ -26359,6 +26498,29 @@ var useDashboard = (dashboardName, config) => {
         };
         const usePivotTask = !cacheEnabled && !!reportInfo.pivot;
         const allFilters = dashboardFilters2.concat(customFilters).concat(customReportFiltersArray);
+        const applyInMemoryPivotIfNeeded = (report2) => {
+          const pivotToApply = reportInfo.pivot ?? report2.pivot;
+          if (!pivotToApply || usePivotTask) {
+            return report2;
+          }
+          const pivotRows = applyPivotInMemory(
+            report2.rows ?? [],
+            pivotToApply,
+            allFilters
+          );
+          const pivotColumns = generatePivotColumnsInMemory({
+            pivot: pivotToApply,
+            pivotRows,
+            sourceColumns: report2.columnInternal ?? report2.columns
+          });
+          return {
+            ...report2,
+            pivot: pivotToApply,
+            pivotRows,
+            pivotColumns: pivotColumns ?? report2.pivotColumns,
+            pivotRowCount: pivotRows.length
+          };
+        };
         if (cacheEnabled && cacheCab.isCacheable(reportId)) {
           const report2 = await cacheCab.get(reportId, dashboardFilters2, customFilters.concat(customReportFiltersArray), reportInfo.pivot, client, tenants, flags, pageSize, getToken, eventTracking, forceCacheToRefresh);
           if (reportRequestIds.current[reportId] !== requestId) {
@@ -26416,11 +26578,12 @@ var useDashboard = (dashboardName, config) => {
             if (reportRequestIds.current[reportId] !== requestId) {
               return null;
             }
+            const uncacheableReportWithPivot = applyInMemoryPivotIfNeeded(uncacheableReport);
             reportsDispatch({
               type: "UPDATE_REPORT",
               id: reportId,
               data: {
-                ...uncacheableReport,
+                ...uncacheableReportWithPivot,
                 pagination,
                 triggerReload: false
               }
@@ -26471,7 +26634,7 @@ var useDashboard = (dashboardName, config) => {
                 console.error("Failed to fetch background rows", e);
               });
             }
-            return uncacheableReport;
+            return uncacheableReportWithPivot;
           } catch (error2) {
             console.error(error2);
             return null;
@@ -38684,13 +38847,28 @@ function Chart({
     return /* @__PURE__ */ (0, import_jsx_runtime49.jsx)("div", { style: containerStyle, className, children: /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(ChartError, { errorMessage: report?.error ?? error }) });
   }
   if (isMissingDateField) {
-    return /* @__PURE__ */ (0, import_jsx_runtime49.jsx)("div", { style: containerStyle, className, children: /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(ChartError, { errorMessage: `The query for this report is missing dashboard date filter field ${report?.dateField?.field}, which is necessary for date filtering on this dashboard when the cache is enabled.` }) });
+    return /* @__PURE__ */ (0, import_jsx_runtime49.jsx)("div", { style: containerStyle, className, children: /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(
+      ChartError,
+      {
+        errorMessage: `The query for this report is missing dashboard date filter field ${report?.dateField?.field}, which is necessary for date filtering on this dashboard when the cache is enabled.`
+      }
+    ) });
   }
   if (usesLimitInQuery) {
-    return /* @__PURE__ */ (0, import_jsx_runtime49.jsx)("div", { style: containerStyle, className, children: /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(ChartError, { errorMessage: `The query for this report uses the LIMIT keyword, which is not supported when the cache is enabled.` }) });
+    return /* @__PURE__ */ (0, import_jsx_runtime49.jsx)("div", { style: containerStyle, className, children: /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(
+      ChartError,
+      {
+        errorMessage: `The query for this report uses the LIMIT keyword, which is not supported when the cache is enabled.`
+      }
+    ) });
   }
   if (missingDashboardFilterFields.length) {
-    return /* @__PURE__ */ (0, import_jsx_runtime49.jsx)("div", { style: containerStyle, className, children: /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(ChartError, { errorMessage: `The query for this report is missing dashboard filter fields: ${missingDashboardFilterFields.join(", ")}` }) });
+    return /* @__PURE__ */ (0, import_jsx_runtime49.jsx)("div", { style: containerStyle, className, children: /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(
+      ChartError,
+      {
+        errorMessage: `The query for this report is missing dashboard filter fields: ${missingDashboardFilterFields.join(", ")}`
+      }
+    ) });
   }
   return /* @__PURE__ */ (0, import_jsx_runtime49.jsxs)(
     "div",
@@ -56520,10 +56698,29 @@ function StaticChart(props) {
     ...report,
     ...report.pivot ? formattedPivotRowsAndColumns(report) : {}
   } : void 0;
+  const patchedConfig = config && config.pivot ? {
+    ...config,
+    yAxisFields: config.columns?.slice(1).map((col) => ({
+      field: col.field,
+      label: col.label ?? col.field,
+      format: col.format ?? "number"
+    })) ?? config.yAxisFields
+  } : config;
+  if (patchedConfig) {
+    const sample = (patchedConfig.pivotRows ?? patchedConfig.rows ?? []).slice(0, 1).map((row) => {
+      const field = patchedConfig.yAxisFields?.[0]?.field;
+      return {
+        ...row,
+        _firstField: field,
+        _firstFieldType: field ? typeof row[field] : void 0
+      };
+    });
+  }
   return /* @__PURE__ */ (0, import_jsx_runtime84.jsx)(
     ChartDisplay,
     {
-      config,
+      reportId,
+      config: patchedConfig,
       onClickChartElement,
       loading,
       className,

package/dist/index.js

@@ -277,6 +277,9 @@ var init_valueFormatter = __esm({
       maximumFractionDigits: 2
     });
     formatPercent = (value) => {
+      if (typeof value === "string" && /^\s*[+-]?(?:\d+(?:\.\d+)?|\.\d+)\s*%\s*$/.test(value)) {
+        return value;
+      }
       return formatterPercent.format(Number(value));
     };
     _getUTCDateHelper = (value, fmt) => {
@@ -19893,11 +19896,12 @@ async function cleanDashboardItem({
       page: DEFAULT_PAGINATION
     };
     if (item.pivot && skipPivotFetch && item.rows && item.fields) {
+      const pivotSourceRows = item.rows.map((row) => ({ ...row }));
       const dateFilter = dashboardFilters?.find(
         (filter) => filter.filterType === "date_range"
       );
       pivotTable = processPivotData({
-        rows: item.rows,
+        rows: pivotSourceRows,
         fields: item.fields,
         pivot: {
           ...item.pivot,
@@ -22177,7 +22181,20 @@ var applyFiltersInMemory = (rows, filters, options) => {
 // src/utils/inMemoryPivotEngine.ts
 init_columnType();
 var MS_IN_DAY = 24 * 60 * 60 * 1e3;
-var MONTHS = ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"];
+var MONTHS = [
+  "Jan",
+  "Feb",
+  "Mar",
+  "Apr",
+  "May",
+  "Jun",
+  "Jul",
+  "Aug",
+  "Sep",
+  "Oct",
+  "Nov",
+  "Dec"
+];
 var INVALID_DATE_KEY = "-2026";
 function singleAggToMultiAgg(pivot) {
   if (pivot.aggregations) {
@@ -22185,7 +22202,12 @@ function singleAggToMultiAgg(pivot) {
   }
   const newPivot = { ...pivot };
   const newAgg = { aggregationType: pivot.aggregationType };
-  const fieldsToCopy = ["valueField", "valueFieldType", "valueField2", "valueField2Type"];
+  const fieldsToCopy = [
+    "valueField",
+    "valueFieldType",
+    "valueField2",
+    "valueField2Type"
+  ];
   fieldsToCopy.forEach((x) => {
     if (pivot[x]) {
       newAgg[x] = pivot[x];
@@ -22216,6 +22238,12 @@ function isValidDate3(date) {
     return false;
   }
 }
+function isDateLikeType(fieldType) {
+  if (!fieldType) {
+    return false;
+  }
+  return isDateType(fieldType) || isDateFormat2(fieldType);
+}
 function inferDateBucketFromFilters(pivot, filters) {
   if (!pivot?.rowFieldType) {
     return void 0;
@@ -22359,8 +22387,12 @@ function getDateRangeFromFilters(filters) {
 }
 function generateBucketKeys(start2, end, bucket) {
   const keys = /* @__PURE__ */ new Set();
-  const startDay = new Date(Date.UTC(start2.getUTCFullYear(), start2.getUTCMonth(), start2.getUTCDate()));
-  const endDay = new Date(Date.UTC(end.getUTCFullYear(), end.getUTCMonth(), end.getUTCDate()));
+  const startDay = new Date(
+    Date.UTC(start2.getUTCFullYear(), start2.getUTCMonth(), start2.getUTCDate())
+  );
+  const endDay = new Date(
+    Date.UTC(end.getUTCFullYear(), end.getUTCMonth(), end.getUTCDate())
+  );
   const cur = new Date(startDay);
   while (cur <= endDay) {
     keys.add(getDateKey(cur, bucket));
@@ -22384,7 +22416,9 @@ function getBucketRange(dateKey, bucket) {
   let end = new Date(d);
   switch (bucket) {
     case "day":
-      start2 = new Date(Date.UTC(d.getUTCFullYear(), d.getUTCMonth(), d.getUTCDate()));
+      start2 = new Date(
+        Date.UTC(d.getUTCFullYear(), d.getUTCMonth(), d.getUTCDate())
+      );
       end = new Date(start2);
       break;
     case "week":
@@ -22426,10 +22460,18 @@ function getDateKey(date, bucket) {
   }
   switch (bucket) {
     case "day":
-      return Date.UTC(date.getUTCFullYear(), date.getUTCMonth(), date.getUTCDate()).toString();
+      return Date.UTC(
+        date.getUTCFullYear(),
+        date.getUTCMonth(),
+        date.getUTCDate()
+      ).toString();
     case "week": {
       const day = date.getUTCDay();
-      const mondayUtc = Date.UTC(date.getUTCFullYear(), date.getUTCMonth(), date.getUTCDate() - (day + 6) % 7);
+      const mondayUtc = Date.UTC(
+        date.getUTCFullYear(),
+        date.getUTCMonth(),
+        date.getUTCDate() - (day + 6) % 7
+      );
       return mondayUtc.toString();
     }
     case "month":
@@ -22493,7 +22535,11 @@ function assembleFinalRows(seen, rowKey, dateBucket, dateRange) {
         if (bucketEnd > dateRange.end) bucketEnd = dateRange.end;
       }
       return {
-        [rowKey]: formatBucketNameFromRange(bucketStart, bucketEnd, dateBucket),
+        [rowKey]: formatBucketNameFromRange(
+          bucketStart,
+          bucketEnd,
+          dateBucket
+        ),
         ...filled[k],
         __quillRawDate: bucketStart.toISOString()
       };
@@ -22652,7 +22698,13 @@ function aggregateWithColumn(rows, colKey, aggregations, getGroupKey) {
   const seen = {};
   const multiAgg = aggregations.length > 1;
   aggregations.forEach((agg) => {
-    const { aggregationType: type, valueField, valueFieldType, valueField2, valueField2Type } = agg;
+    const {
+      aggregationType: type,
+      valueField,
+      valueFieldType,
+      valueField2,
+      valueField2Type
+    } = agg;
     if (!valueField) {
       if (type !== "count" && type !== "percentage") return;
     }
@@ -22685,7 +22737,10 @@ function aggregateWithColumn(rows, colKey, aggregations, getGroupKey) {
     });
     Object.keys(accs).forEach((groupKey) => {
       if (!seen[groupKey]) seen[groupKey] = {};
-      const sumOfDenom = Object.values(accs[groupKey]).reduce((t, a) => t + a.count, 0);
+      const sumOfDenom = Object.values(accs[groupKey]).reduce(
+        (t, a) => t + a.count,
+        0
+      );
       Object.keys(accs[groupKey]).forEach((colVal) => {
         const acc = accs[groupKey][colVal];
         const finalKey = `${colVal}` + (multiAgg ? `_${type}` : "");
@@ -22707,7 +22762,13 @@ function aggregateWithoutColumn(rows, aggregations, getGroupKey) {
   const seen = {};
   const multiAgg = aggregations.length > 1;
   aggregations.forEach((agg) => {
-    const { aggregationType: type, valueField, valueFieldType, valueField2, valueField2Type } = agg;
+    const {
+      aggregationType: type,
+      valueField,
+      valueFieldType,
+      valueField2,
+      valueField2Type
+    } = agg;
     if (!valueField) {
       if (type !== "count" && type !== "percentage") return;
     }
@@ -22738,7 +22799,10 @@ function aggregateWithoutColumn(rows, aggregations, getGroupKey) {
       }
       updateAccumulator(acc, row, agg, false);
     });
-    const sumOfDenom = Object.values(accs).reduce((t, a) => t + a.count, 0);
+    const sumOfDenom = Object.values(accs).reduce(
+      (t, a) => t + a.count,
+      0
+    );
     Object.keys(accs).forEach((k) => {
       const acc = accs[k];
       seen[k][finalKey] = getFinalAggregationValue({
@@ -22766,13 +22830,18 @@ function applyPivotInMemory(rows, pivot, filters) {
   const dateRange = dateBucket ? getDateRangeFromFilters(filters) : void 0;
   const getRowKey = dateBucket ? (row) => {
     const rawValue = row[rowField];
-    const rawDateValue = rawValue !== null && typeof rawValue === "object" && rawValue.value ? rawValue.value : rawValue;
+    const rawDateFromQuill = row.__quillRawDate;
+    const rawDateValue = rawDateFromQuill ?? (rawValue !== null && typeof rawValue === "object" && rawValue.value ? rawValue.value : rawValue);
     return getDateKey(new Date(rawDateValue), dateBucket);
   } : (row) => row[rowField];
   const aggregated = columnField ? aggregateWithColumn(rows, columnField, aggregations, getRowKey) : aggregateWithoutColumn(rows, aggregations, getRowKey);
   const aggregatedRows = aggregated || {};
   if (rows.length === 0 && dateBucket && dateRange && !columnField) {
-    const bucketKeys = generateBucketKeys(dateRange.start, dateRange.end, dateBucket);
+    const bucketKeys = generateBucketKeys(
+      dateRange.start,
+      dateRange.end,
+      dateBucket
+    );
     const emptyAgg = buildEmptyAggRow(aggregations);
     bucketKeys.forEach((k) => {
       aggregatedRows[k] = { ...emptyAgg };
@@ -22790,6 +22859,61 @@ function applyPivotInMemory(rows, pivot, filters) {
   }
   return sorted;
 }
+function generatePivotColumnsInMemory({
+  pivot,
+  pivotRows,
+  sourceColumns
+}) {
+  if (!pivot?.rowField || !Array.isArray(pivotRows) || pivotRows.length === 0) {
+    return void 0;
+  }
+  const columns = Array.isArray(sourceColumns) ? sourceColumns : [];
+  const rowSource = columns.find((col) => col.field === pivot.rowField);
+  const isRowFieldDate = isDateLikeType(pivot.rowFieldType);
+  const rowFieldType = rowSource?.fieldType ?? pivot.rowFieldType ?? "string";
+  const rowColumn = {
+    field: pivot.rowField,
+    label: rowSource?.label ?? pivot.rowField,
+    format: isRowFieldDate ? "string" : rowSource?.format ?? "string",
+    fieldType: rowFieldType,
+    dataTypeID: rowSource?.dataTypeID ?? 1043,
+    jsType: rowSource?.jsType ?? (isRowFieldDate ? "date" : "string")
+  };
+  const valueFieldFormat = (valueField) => columns.find((col) => col.field === valueField)?.format ?? "whole_number";
+  const multiAgg = (pivot.aggregations?.length ?? 0) > 1;
+  const aggregationBySuffix = new Map(
+    (pivot.aggregations ?? []).map((agg) => [
+      multiAgg ? `_${agg.aggregationType}` : "",
+      agg
+    ])
+  );
+  const valueKeys = Array.from(
+    new Set(
+      pivotRows.flatMap(
+        (row) => Object.keys(row).filter(
+          (key) => key !== pivot.rowField && key !== "__quillRawDate"
+        )
+      )
+    )
+  );
+  const valueColumns = valueKeys.map((key) => {
+    const matchingSuffix = Array.from(aggregationBySuffix.keys()).find(
+      (suffix) => suffix && key.endsWith(suffix)
+    );
+    const matchedAgg = matchingSuffix ? aggregationBySuffix.get(matchingSuffix) : pivot.aggregations?.[0];
+    const format9 = matchedAgg?.aggregationType === "percentage" ? "percent" : valueFieldFormat(matchedAgg?.valueField);
+    const valueFieldType = matchedAgg?.valueFieldType ?? "number";
+    return {
+      field: key,
+      label: key,
+      format: format9,
+      fieldType: valueFieldType,
+      jsType: valueFieldType,
+      dataTypeID: columns.find((col) => col.field === matchedAgg?.valueField)?.dataTypeID ?? 20
+    };
+  });
+  return [rowColumn, ...valueColumns];
+}
 
 // src/utils/cacheCab.ts
 import { openDB } from "idb";
@@ -22907,7 +23031,12 @@ var CacheCab = class {
       }
       const newRows = await this.applyPivotsAndFilters(result, dashboardFilters, customFilters, pivot, tenantPart, false);
       if (pivot) {
-        return { ...result, pivotRows: newRows, pivotRowCount: newRows.length };
+        const pivotColumns = generatePivotColumnsInMemory({
+          pivot,
+          pivotRows: newRows,
+          sourceColumns: result.columnInternal ?? result.columns
+        });
+        return { ...result, pivotRows: newRows, pivotColumns: pivotColumns ?? result.pivotColumns, pivotRowCount: newRows.length };
       }
       return { ...result, rows: newRows, rowCount: newRows.length };
     } else {
@@ -22993,7 +23122,12 @@ var CacheCab = class {
       await this.persistMetaToStorage();
       const newRows = await this.applyPivotsAndFilters(merged, dashboardFilters, customFilters, pivot, tenantPart, false);
       if (pivot) {
-        return { ...merged, pivotRows: newRows, pivotRowCount: newRows.length };
+        const pivotColumns = generatePivotColumnsInMemory({
+          pivot,
+          pivotRows: newRows,
+          sourceColumns: merged.columnInternal ?? merged.columns
+        });
+        return { ...merged, pivotRows: newRows, pivotColumns: pivotColumns ?? merged.pivotColumns, pivotRowCount: newRows.length };
       }
       return { ...merged, rows: newRows, rowCount: newRows.length };
     }
@@ -23021,7 +23155,12 @@ var CacheCab = class {
       const tenantPart = tenants ? JSON.stringify(tenants) : "";
       const newRows = await this.applyPivotsAndFilters(parsed, dashboardFilters, customFilters, pivot, tenantPart);
       if (pivot) {
-        return { ...parsed, pivotRows: newRows, pivotRowCount: newRows.length };
+        const pivotColumns = generatePivotColumnsInMemory({
+          pivot,
+          pivotRows: newRows,
+          sourceColumns: parsed.columnInternal ?? parsed.columns
+        });
+        return { ...parsed, pivotRows: newRows, pivotColumns: pivotColumns ?? parsed.pivotColumns, pivotRowCount: newRows.length };
       }
       return { ...parsed, rows: newRows, rowCount: newRows.length };
     } catch (err) {
@@ -26397,6 +26536,29 @@ var useDashboard = (dashboardName, config) => {
         };
         const usePivotTask = !cacheEnabled && !!reportInfo.pivot;
         const allFilters = dashboardFilters2.concat(customFilters).concat(customReportFiltersArray);
+        const applyInMemoryPivotIfNeeded = (report2) => {
+          const pivotToApply = reportInfo.pivot ?? report2.pivot;
+          if (!pivotToApply || usePivotTask) {
+            return report2;
+          }
+          const pivotRows = applyPivotInMemory(
+            report2.rows ?? [],
+            pivotToApply,
+            allFilters
+          );
+          const pivotColumns = generatePivotColumnsInMemory({
+            pivot: pivotToApply,
+            pivotRows,
+            sourceColumns: report2.columnInternal ?? report2.columns
+          });
+          return {
+            ...report2,
+            pivot: pivotToApply,
+            pivotRows,
+            pivotColumns: pivotColumns ?? report2.pivotColumns,
+            pivotRowCount: pivotRows.length
+          };
+        };
         if (cacheEnabled && cacheCab.isCacheable(reportId)) {
           const report2 = await cacheCab.get(reportId, dashboardFilters2, customFilters.concat(customReportFiltersArray), reportInfo.pivot, client, tenants, flags, pageSize, getToken, eventTracking, forceCacheToRefresh);
           if (reportRequestIds.current[reportId] !== requestId) {
@@ -26454,11 +26616,12 @@ var useDashboard = (dashboardName, config) => {
             if (reportRequestIds.current[reportId] !== requestId) {
               return null;
             }
+            const uncacheableReportWithPivot = applyInMemoryPivotIfNeeded(uncacheableReport);
             reportsDispatch({
               type: "UPDATE_REPORT",
               id: reportId,
               data: {
-                ...uncacheableReport,
+                ...uncacheableReportWithPivot,
                 pagination,
                 triggerReload: false
               }
@@ -26509,7 +26672,7 @@ var useDashboard = (dashboardName, config) => {
                 console.error("Failed to fetch background rows", e);
               });
             }
-            return uncacheableReport;
+            return uncacheableReportWithPivot;
           } catch (error2) {
             console.error(error2);
             return null;
@@ -38793,13 +38956,28 @@ function Chart({
     return /* @__PURE__ */ jsx49("div", { style: containerStyle, className, children: /* @__PURE__ */ jsx49(ChartError, { errorMessage: report?.error ?? error }) });
   }
   if (isMissingDateField) {
-    return /* @__PURE__ */ jsx49("div", { style: containerStyle, className, children: /* @__PURE__ */ jsx49(ChartError, { errorMessage: `The query for this report is missing dashboard date filter field ${report?.dateField?.field}, which is necessary for date filtering on this dashboard when the cache is enabled.` }) });
+    return /* @__PURE__ */ jsx49("div", { style: containerStyle, className, children: /* @__PURE__ */ jsx49(
+      ChartError,
+      {
+        errorMessage: `The query for this report is missing dashboard date filter field ${report?.dateField?.field}, which is necessary for date filtering on this dashboard when the cache is enabled.`
+      }
+    ) });
   }
   if (usesLimitInQuery) {
-    return /* @__PURE__ */ jsx49("div", { style: containerStyle, className, children: /* @__PURE__ */ jsx49(ChartError, { errorMessage: `The query for this report uses the LIMIT keyword, which is not supported when the cache is enabled.` }) });
+    return /* @__PURE__ */ jsx49("div", { style: containerStyle, className, children: /* @__PURE__ */ jsx49(
+      ChartError,
+      {
+        errorMessage: `The query for this report uses the LIMIT keyword, which is not supported when the cache is enabled.`
+      }
+    ) });
   }
   if (missingDashboardFilterFields.length) {
-    return /* @__PURE__ */ jsx49("div", { style: containerStyle, className, children: /* @__PURE__ */ jsx49(ChartError, { errorMessage: `The query for this report is missing dashboard filter fields: ${missingDashboardFilterFields.join(", ")}` }) });
+    return /* @__PURE__ */ jsx49("div", { style: containerStyle, className, children: /* @__PURE__ */ jsx49(
+      ChartError,
+      {
+        errorMessage: `The query for this report is missing dashboard filter fields: ${missingDashboardFilterFields.join(", ")}`
+      }
+    ) });
   }
   return /* @__PURE__ */ jsxs37(
     "div",
@@ -56731,10 +56909,29 @@ function StaticChart(props) {
     ...report,
     ...report.pivot ? formattedPivotRowsAndColumns(report) : {}
   } : void 0;
+  const patchedConfig = config && config.pivot ? {
+    ...config,
+    yAxisFields: config.columns?.slice(1).map((col) => ({
+      field: col.field,
+      label: col.label ?? col.field,
+      format: col.format ?? "number"
+    })) ?? config.yAxisFields
+  } : config;
+  if (patchedConfig) {
+    const sample = (patchedConfig.pivotRows ?? patchedConfig.rows ?? []).slice(0, 1).map((row) => {
+      const field = patchedConfig.yAxisFields?.[0]?.field;
+      return {
+        ...row,
+        _firstField: field,
+        _firstFieldType: field ? typeof row[field] : void 0
+      };
+    });
+  }
   return /* @__PURE__ */ jsx84(
     ChartDisplay,
     {
-      config,
+      reportId,
+      config: patchedConfig,
       onClickChartElement,
       loading,
       className,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@quillsql/react",
-  "version": "2.16.21",
+  "version": "2.16.22",
   "type": "module",
   "exports": {
     ".": {