@quillsql/react 2.16.4 → 2.16.5

package/dist/index.cjs

@@ -19415,10 +19415,10 @@ __export(index_exports, {
 module.exports = __toCommonJS(index_exports);
 
 // src/Dashboard.tsx
-var import_react37 = require("react");
+var import_react38 = require("react");
 
 // src/Chart.tsx
-var import_react29 = require("react");
+var import_react30 = require("react");
 
 // src/utils/csv.ts
 init_valueFormatter();
@@ -25544,11 +25544,11 @@ var PieChartWrapper = import_react5.default.forwardRef(
 var PieChart_default = PieChartWrapper;
 
 // src/components/QuillTable.tsx
-var import_react12 = require("react");
+var import_react13 = require("react");
 init_valueFormatter();
 
 // src/components/UiComponents.tsx
-var import_react11 = require("react");
+var import_react12 = require("react");
 
 // src/assets/ArrowDownHeadIcon.tsx
 var import_jsx_runtime5 = require("react/jsx-runtime");
@@ -25799,6 +25799,141 @@ var import_react9 = require("react");
 // src/hooks/useSelectOnKeyDown.tsx
 var import_react10 = require("react");
 
+// src/hooks/useResponsiveFirstChildWidth.ts
+var import_react11 = require("react");
+var DEFAULT_MIN_WIDTH = 0;
+var parseNumericValue = (value) => {
+  if (!value) {
+    return 0;
+  }
+  const parsed = parseFloat(value);
+  return Number.isFinite(parsed) ? parsed : 0;
+};
+var getHorizontalGap = (element, explicitGap) => {
+  if (typeof explicitGap === "number") {
+    return explicitGap;
+  }
+  const computedStyle = window.getComputedStyle(element);
+  const columnGap = parseNumericValue(computedStyle.columnGap);
+  if (columnGap > 0) {
+    return columnGap;
+  }
+  const genericGap = parseNumericValue(computedStyle.gap);
+  return genericGap;
+};
+var calculateFirstChildWidth = (element, options) => {
+  const { gap, minWidth, maxWidth } = options;
+  const computedStyle = window.getComputedStyle(element);
+  const horizontalPadding = parseNumericValue(computedStyle.paddingLeft) + parseNumericValue(computedStyle.paddingRight);
+  const availableWidth = Math.max(
+    0,
+    element.clientWidth - horizontalPadding
+  );
+  const children = Array.from(element.children);
+  if (!children.length) {
+    return Math.max(minWidth ?? DEFAULT_MIN_WIDTH, 0);
+  }
+  const siblings = children.slice(1);
+  const gapCount = Math.max(children.length - 1, 0);
+  const effectiveGap = getHorizontalGap(element, gap) * gapCount;
+  let siblingsWidth = 0;
+  siblings.forEach((child) => {
+    const rect = child.getBoundingClientRect();
+    const childStyle = window.getComputedStyle(child);
+    siblingsWidth += rect.width + parseNumericValue(childStyle.marginLeft) + parseNumericValue(childStyle.marginRight);
+  });
+  const rawWidth = Math.max(0, availableWidth - siblingsWidth - effectiveGap);
+  const min2 = Math.max(minWidth ?? DEFAULT_MIN_WIDTH, 0);
+  const max2 = typeof maxWidth === "number" && Number.isFinite(maxWidth) ? Math.max(maxWidth, min2) : void 0;
+  const clampedWidth = max2 !== void 0 ? Math.min(Math.max(rawWidth, min2), max2) : Math.max(rawWidth, min2);
+  return Math.floor(clampedWidth);
+};
+var useIsomorphicLayoutEffect = typeof window !== "undefined" ? import_react11.useLayoutEffect : import_react11.useEffect;
+var useResponsiveFirstChildWidth = (containerRef, options = {}) => {
+  const {
+    gap,
+    initialWidth = -1,
+    minWidth = DEFAULT_MIN_WIDTH,
+    maxWidth
+  } = options;
+  const [width, setWidth] = (0, import_react11.useState)(initialWidth);
+  const previousWidthRef = (0, import_react11.useRef)(initialWidth);
+  useIsomorphicLayoutEffect(() => {
+    const element = containerRef?.current ?? null;
+    if (!element || typeof window === "undefined") {
+      return;
+    }
+    let frameId = null;
+    const updateWidth = () => {
+      if (!element.isConnected) {
+        return;
+      }
+      const nextWidth = calculateFirstChildWidth(element, {
+        gap,
+        minWidth,
+        maxWidth
+      });
+      if (frameId !== null) {
+        cancelAnimationFrame(frameId);
+      }
+      frameId = window.requestAnimationFrame(() => {
+        frameId = null;
+        if (Math.abs(previousWidthRef.current - nextWidth) > 0.5) {
+          previousWidthRef.current = nextWidth;
+          setWidth(nextWidth);
+        }
+      });
+    };
+    if (typeof ResizeObserver === "undefined") {
+      updateWidth();
+      const handleResize = () => updateWidth();
+      window.addEventListener("resize", handleResize);
+      return () => {
+        if (frameId !== null) {
+          cancelAnimationFrame(frameId);
+        }
+        window.removeEventListener("resize", handleResize);
+      };
+    }
+    const resizeObserver = new ResizeObserver(() => {
+      updateWidth();
+    });
+    const observeChildren = () => {
+      resizeObserver.observe(element);
+      Array.from(element.children).forEach((child) => {
+        resizeObserver.observe(child);
+      });
+    };
+    observeChildren();
+    updateWidth();
+    const mutationObserver = new MutationObserver((mutations) => {
+      mutations.forEach((mutation) => {
+        mutation.addedNodes.forEach((node) => {
+          if (node instanceof HTMLElement) {
+            resizeObserver.observe(node);
+          }
+        });
+        mutation.removedNodes.forEach((node) => {
+          if (node instanceof HTMLElement) {
+            resizeObserver.unobserve(node);
+          }
+        });
+      });
+      updateWidth();
+    });
+    mutationObserver.observe(element, { childList: true });
+    return () => {
+      if (frameId !== null) {
+        cancelAnimationFrame(frameId);
+      }
+      resizeObserver.disconnect();
+      mutationObserver.disconnect();
+    };
+  }, [containerRef?.current, gap, minWidth, maxWidth]);
+  return width;
+};
+var useResponsiveFirstChildWidth_default = useResponsiveFirstChildWidth;
+
 // src/components/UiComponents.tsx
 var import_react_dom2 = require("react-dom");
 
@@ -25819,7 +25954,7 @@ var getScrollableParent = (element) => {
 
 // src/components/UiComponents.tsx
 var import_jsx_runtime26 = require("react/jsx-runtime");
-var QuillTextInput = (0, import_react11.forwardRef)(
+var QuillTextInput = (0, import_react12.forwardRef)(
   ({
     id: id2,
     value,
@@ -25829,15 +25964,20 @@ var QuillTextInput = (0, import_react11.forwardRef)(
     onChange,
     disabled
   }, ref) => {
-    const [theme] = (0, import_react11.useContext)(ThemeContext);
+    const [theme] = (0, import_react12.useContext)(ThemeContext);
+    const isNumericWidth = typeof width === "number";
+    const resolvedWidth = typeof width === "string" ? width : isNumericWidth ? width : "100%";
     return /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(
       "label",
       {
         style: {
           position: "relative",
           borderRadius: "6px",
-          width,
-          minWidth: width
+          display: "flex",
+          flexDirection: "column",
+          width: resolvedWidth,
+          minWidth: isNumericWidth ? width : 0,
+          flex: isNumericWidth ? "0 0 auto" : "1 1 auto"
         },
         children: [
           label && /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
@@ -25859,6 +25999,7 @@ var QuillTextInput = (0, import_react11.forwardRef)(
               ref,
               style: {
                 display: "flex",
+                flex: "1 1 auto",
                 height: 40,
                 minHeight: 40,
                 maxHeight: 40,
@@ -25870,8 +26011,8 @@ var QuillTextInput = (0, import_react11.forwardRef)(
                 backgroundColor: theme?.backgroundColor,
                 color: theme?.primaryTextColor,
                 fontFamily: theme?.fontFamily,
-                width,
-                minWidth: width
+                width: "100%",
+                minWidth: 0
               },
               id: id2,
               value,
@@ -25893,7 +26034,7 @@ var MemoizedButton = ({
   tooltipText,
   isLoading
 }) => {
-  const [theme] = (0, import_react11.useContext)(ThemeContext);
+  const [theme] = (0, import_react12.useContext)(ThemeContext);
   return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
     QuillToolTipPortal,
     {
@@ -25966,7 +26107,7 @@ var MemoizedSecondaryButton = ({
   tooltipText,
   width
 }) => {
-  const [theme] = (0, import_react11.useContext)(ThemeContext);
+  const [theme] = (0, import_react12.useContext)(ThemeContext);
   return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
     QuillToolTip,
     {
@@ -26040,7 +26181,7 @@ var MemoizedSecondaryButton = ({
   );
 };
 var MemoizedHeader = ({ label }) => {
-  const [theme] = (0, import_react11.useContext)(ThemeContext);
+  const [theme] = (0, import_react12.useContext)(ThemeContext);
   return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
     "h1",
     {
@@ -26058,7 +26199,7 @@ var MemoizedHeader = ({ label }) => {
   );
 };
 var MemoizedSubHeader = ({ label }) => {
-  const [theme] = (0, import_react11.useContext)(ThemeContext);
+  const [theme] = (0, import_react12.useContext)(ThemeContext);
   return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
     "h2",
     {
@@ -26077,7 +26218,7 @@ var MemoizedSubHeader = ({ label }) => {
   );
 };
 var MemoizedLabel = ({ label }) => {
-  const [theme] = (0, import_react11.useContext)(ThemeContext);
+  const [theme] = (0, import_react12.useContext)(ThemeContext);
   return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
     "h1",
     {
@@ -26100,7 +26241,7 @@ var MemoizedCheckbox = ({
   containerStyle,
   disabled
 }) => {
-  const [theme] = (0, import_react11.useContext)(ThemeContext);
+  const [theme] = (0, import_react12.useContext)(ThemeContext);
   return /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(
     "label",
     {
@@ -26209,7 +26350,7 @@ var QuillTabs = ({
   }
 );
 var MemoizedText = ({ label }) => {
-  const [theme] = (0, import_react11.useContext)(ThemeContext);
+  const [theme] = (0, import_react12.useContext)(ThemeContext);
   return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
     "p",
     {
@@ -26240,11 +26381,11 @@ var MemoizedPopover = ({
   horizontalPadding = 20,
   titlePaddingLeft = 0
 }) => {
-  const [theme] = (0, import_react11.useContext)(ThemeContext);
-  const [rightAlignment, setRightAlignment] = (0, import_react11.useState)("auto");
-  const modalRef = (0, import_react11.useRef)(null);
-  const popoverRef = (0, import_react11.useRef)(null);
-  (0, import_react11.useEffect)(() => {
+  const [theme] = (0, import_react12.useContext)(ThemeContext);
+  const [rightAlignment, setRightAlignment] = (0, import_react12.useState)("auto");
+  const modalRef = (0, import_react12.useRef)(null);
+  const popoverRef = (0, import_react12.useRef)(null);
+  (0, import_react12.useEffect)(() => {
     const listener = (event) => {
       const target = event.target;
       if (modalRef.current?.contains(target) || target.closest("[data-portal-ignore]") || ignoredRefs?.some(
@@ -26263,7 +26404,7 @@ var MemoizedPopover = ({
       document.removeEventListener("mousedown", listener);
     };
   }, [isOpen, ignoredRefs, setIsOpen, modalRef]);
-  (0, import_react11.useEffect)(() => {
+  (0, import_react12.useEffect)(() => {
     updatePopoverPosition();
     window.addEventListener("resize", updatePopoverPosition);
     return () => {
@@ -26338,7 +26479,7 @@ function MemoizedModal({
   width,
   height
 }) {
-  const [theme] = (0, import_react11.useContext)(ThemeContext);
+  const [theme] = (0, import_react12.useContext)(ThemeContext);
   if (!isOpen) {
     return null;
   }
@@ -26658,11 +26799,11 @@ var QuillModalComponent = ({
   triggerLabel,
   title
 }) => {
-  const [theme] = (0, import_react11.useContext)(ThemeContext);
-  const [rightAlignment, setRightAlignment] = (0, import_react11.useState)("auto");
-  const modalRef = (0, import_react11.useRef)(null);
-  const popoverRef = (0, import_react11.useRef)(null);
-  (0, import_react11.useEffect)(() => {
+  const [theme] = (0, import_react12.useContext)(ThemeContext);
+  const [rightAlignment, setRightAlignment] = (0, import_react12.useState)("auto");
+  const modalRef = (0, import_react12.useRef)(null);
+  const popoverRef = (0, import_react12.useRef)(null);
+  (0, import_react12.useEffect)(() => {
     const listener = (event) => {
       if (modalRef?.current && !modalRef?.current?.contains(event.target)) {
         if (setIsOpen) setIsOpen(false);
@@ -26677,7 +26818,7 @@ var QuillModalComponent = ({
       document.removeEventListener("mousedown", listener);
     };
   }, [modalRef, setIsOpen, isOpen]);
-  (0, import_react11.useEffect)(() => {
+  (0, import_react12.useEffect)(() => {
     updatePopoverPosition();
     window.addEventListener("resize", updatePopoverPosition);
     return () => {
@@ -26842,7 +26983,7 @@ var QuillErrorMessageComponent = ({
   errorMessage,
   containerStyle
 }) => {
-  const [theme] = (0, import_react11.useContext)(ThemeContext);
+  const [theme] = (0, import_react12.useContext)(ThemeContext);
   return /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(
     "div",
     {
@@ -26891,11 +27032,11 @@ var QuillErrorMessageComponent = ({
   );
 };
 var QuillColumnSearchEmptyState = () => {
-  const [theme] = (0, import_react11.useContext)(ThemeContext);
+  const [theme] = (0, import_react12.useContext)(ThemeContext);
   return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)("div", { style: { fontFamily: theme?.fontFamily }, children: "No results found" });
 };
 var QuillLoadingComponent = () => {
-  const [theme] = (0, import_react11.useContext)(ThemeContext);
+  const [theme] = (0, import_react12.useContext)(ThemeContext);
   return /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(
     "div",
     {
@@ -26974,9 +27115,9 @@ var OverflowContainer = ({
   children,
   style: style2
 }) => {
-  const containerRef = (0, import_react11.useRef)(null);
-  const [showTopShadow, setShowTopShadow] = (0, import_react11.useState)(false);
-  const [showBottomShadow, setShowBottomShadow] = (0, import_react11.useState)(false);
+  const containerRef = (0, import_react12.useRef)(null);
+  const [showTopShadow, setShowTopShadow] = (0, import_react12.useState)(false);
+  const [showBottomShadow, setShowBottomShadow] = (0, import_react12.useState)(false);
   const checkOverflow = () => {
     const container = containerRef.current;
     if (container) {
@@ -26987,7 +27128,7 @@ var OverflowContainer = ({
       );
     }
   };
-  (0, import_react11.useEffect)(() => {
+  (0, import_react12.useEffect)(() => {
     const container = containerRef.current;
     if (container) {
       checkOverflow();
@@ -27065,7 +27206,7 @@ var QuillToolTip = ({
   textStyle = {},
   displayBelow = false
 }) => {
-  const [theme] = (0, import_react11.useContext)(ThemeContext);
+  const [theme] = (0, import_react12.useContext)(ThemeContext);
   return enabled ? /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)("div", { className: "tooltip-container", style: { ...containerStyle }, children: [
     /* @__PURE__ */ (0, import_jsx_runtime26.jsx)("style", { children: `
         .tooltip-container {
@@ -27140,11 +27281,11 @@ var QuillToolTipPortal = ({
   textStyle = {},
   mirror = false
 }) => {
-  const [theme] = (0, import_react11.useContext)(ThemeContext);
-  const [isOpen, setIsOpen] = (0, import_react11.useState)(false);
-  const tooltipRef = (0, import_react11.useRef)(null);
-  const triggerRef = (0, import_react11.useRef)(null);
-  const [tooltipPosition, setTooltipPosition] = (0, import_react11.useState)(void 0);
+  const [theme] = (0, import_react12.useContext)(ThemeContext);
+  const [isOpen, setIsOpen] = (0, import_react12.useState)(false);
+  const tooltipRef = (0, import_react12.useRef)(null);
+  const triggerRef = (0, import_react12.useRef)(null);
+  const [tooltipPosition, setTooltipPosition] = (0, import_react12.useState)(void 0);
   const updatePosition = () => {
     if (triggerRef.current && tooltipRef.current) {
       const rect = triggerRef.current.getBoundingClientRect();
@@ -27169,7 +27310,7 @@ var QuillToolTipPortal = ({
       setTooltipPosition({ top, left });
     }
   };
-  (0, import_react11.useEffect)(() => {
+  (0, import_react12.useEffect)(() => {
     if (isOpen) {
       const timer2 = setTimeout(() => {
         updatePosition();
@@ -27273,7 +27414,7 @@ var QuillChartBuilderCheckboxComponent = ({
   disabled,
   containerStyle
 }) => {
-  const [theme] = (0, import_react11.useContext)(ThemeContext);
+  const [theme] = (0, import_react12.useContext)(ThemeContext);
   return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
     "div",
     {
@@ -27312,10 +27453,10 @@ var QuillPortal = ({
   showModal,
   setShowModal
 }) => {
-  const modalRef = (0, import_react11.useRef)(null);
-  const [popoverPosition, setPopoverPosition] = (0, import_react11.useState)(void 0);
-  const [z, setZ] = (0, import_react11.useState)(10);
-  const scrollableParentRef = (0, import_react11.useRef)(document.body);
+  const modalRef = (0, import_react12.useRef)(null);
+  const [popoverPosition, setPopoverPosition] = (0, import_react12.useState)(void 0);
+  const [z, setZ] = (0, import_react12.useState)(10);
+  const scrollableParentRef = (0, import_react12.useRef)(document.body);
   const updatePosition = () => {
     if (anchorRef.current) {
       requestAnimationFrame(() => {
@@ -27333,7 +27474,7 @@ var QuillPortal = ({
       });
     }
   };
-  (0, import_react11.useEffect)(() => {
+  (0, import_react12.useEffect)(() => {
     let resizeObserver;
     let mutationObserver;
     if (showModal && anchorRef.current) {
@@ -27430,18 +27571,18 @@ function QuillTable({
   hideLabels,
   disableSort
 }) {
-  const [activeRows, setActiveRows] = (0, import_react12.useState)([]);
-  const [maxPage, setMaxPage] = (0, import_react12.useState)(1);
-  const [sortColumn, setSortColumn] = (0, import_react12.useState)(sort?.field || "");
-  const [sortDirection, setSortDirection] = (0, import_react12.useState)(sort?.direction || "desc");
-  const [theme] = (0, import_react12.useContext)(ThemeContext);
-  const [isPaginating, setIsPaginating] = (0, import_react12.useState)(true);
-  const [initialLoad, setInitialLoad] = (0, import_react12.useState)(true);
-  (0, import_react12.useEffect)(() => {
+  const [activeRows, setActiveRows] = (0, import_react13.useState)([]);
+  const [maxPage, setMaxPage] = (0, import_react13.useState)(1);
+  const [sortColumn, setSortColumn] = (0, import_react13.useState)(sort?.field || "");
+  const [sortDirection, setSortDirection] = (0, import_react13.useState)(sort?.direction || "desc");
+  const [theme] = (0, import_react13.useContext)(ThemeContext);
+  const [isPaginating, setIsPaginating] = (0, import_react13.useState)(true);
+  const [initialLoad, setInitialLoad] = (0, import_react13.useState)(true);
+  (0, import_react13.useEffect)(() => {
     setSortColumn(sort?.field || "");
     setSortDirection(sort?.direction || "desc");
   }, [sort]);
-  (0, import_react12.useEffect)(() => {
+  (0, import_react13.useEffect)(() => {
     if (rows?.length === 0 && isLoading) {
       return;
     }
@@ -27473,7 +27614,7 @@ function QuillTable({
     rowCount,
     isLoading
   ]);
-  (0, import_react12.useEffect)(() => {
+  (0, import_react13.useEffect)(() => {
     if (rows.length <= currentPage * rowsPerPage) {
       onPageChange && onPageChange(0);
       setMaxPage(1);
@@ -28504,7 +28645,7 @@ function hashCode(obj) {
 }
 
 // src/components/Chart/LineChart.tsx
-var import_react14 = require("react");
+var import_react15 = require("react");
 
 // src/components/Chart/CustomReferenceLine.tsx
 init_constants();
@@ -28581,11 +28722,11 @@ function CustomReferenceLine({
 }
 
 // src/components/Chart/CustomLegend.tsx
-var import_react13 = require("react");
+var import_react14 = require("react");
 var import_jsx_runtime33 = require("react/jsx-runtime");
 var RenderLegend = (props) => {
   const { payload } = props;
-  const [theme] = (0, import_react13.useContext)(ThemeContext);
+  const [theme] = (0, import_react14.useContext)(ThemeContext);
   return /* @__PURE__ */ (0, import_jsx_runtime33.jsx)("div", { style: { display: "flex", justifyContent: "flex-start" }, children: payload.map((entry, index) => /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)(
     "div",
     {
@@ -28671,7 +28812,7 @@ function LineChart({
   referenceLines,
   showLegend = false
 }) {
-  const formattedData = (0, import_react14.useMemo)(() => {
+  const formattedData = (0, import_react15.useMemo)(() => {
     if (!data || data.length === 0) {
       return createLineForEmptyChart(
         yAxisFields,
@@ -28961,7 +29102,7 @@ var import_recharts3 = require("recharts");
 init_valueFormatter();
 
 // src/components/Chart/CustomBar.tsx
-var import_react15 = require("react");
+var import_react16 = require("react");
 var import_jsx_runtime35 = require("react/jsx-runtime");
 function isTopMostBarWithValue(yAxisFields, dataKey, payload) {
   if (!dataKey || !yAxisFields.length) return false;
@@ -28982,7 +29123,7 @@ function createRoundedPath(x, y, width, height, radius, roundTop) {
     return `M ${x} ${y} h ${width} v ${height - r} q 0 ${r} -${r} ${r} h -${width + 2 * r} q -${r} 0 -${r} -${r} v -${height - r} z`.replace(/\s+/g, " ").trim();
   }
 }
-var CustomBar = (0, import_react15.memo)((props) => {
+var CustomBar = (0, import_react16.memo)((props) => {
   const {
     x,
     y,
@@ -28998,10 +29139,10 @@ var CustomBar = (0, import_react15.memo)((props) => {
     return null;
   }
   const customCornerRadius = theme?.barChartCornerRadius ?? (theme?.barChartCornerRadiusRatio ? theme?.barChartCornerRadiusRatio * width : void 0);
-  const shouldRoundCorners = (0, import_react15.useMemo)(() => {
+  const shouldRoundCorners = (0, import_react16.useMemo)(() => {
     return customCornerRadius !== void 0 ? customCornerRadius > 0 : isTopMostBarWithValue(yAxisFields, dataKey, payload);
   }, [customCornerRadius, yAxisFields, dataKey, payload]);
-  const radius = (0, import_react15.useMemo)(() => {
+  const radius = (0, import_react16.useMemo)(() => {
     return shouldRoundCorners ? Math.min(
       customCornerRadius || width * 0.1,
       width / 2,
@@ -29012,7 +29153,7 @@ var CustomBar = (0, import_react15.memo)((props) => {
   const absHeight = Math.abs(height);
   const startY = isNegative ? y : y;
   const endY = isNegative ? y + height : y + height;
-  const path = (0, import_react15.useMemo)(() => {
+  const path = (0, import_react16.useMemo)(() => {
     if (isNegative) {
       return radius > 0 ? createRoundedPath(x, startY, width, absHeight, radius, false) : `M ${x} ${startY} h ${width} v ${height} h -${width} z`;
     } else {
@@ -29025,7 +29166,7 @@ CustomBar.displayName = "CustomBar";
 var CustomBar_default = CustomBar;
 
 // src/components/Chart/BarChart.tsx
-var import_react16 = require("react");
+var import_react17 = require("react");
 var import_jsx_runtime36 = require("react/jsx-runtime");
 var createCustomBar = (yAxisFields, theme) => {
   return (props) => /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(CustomBar_default, { ...props, yAxisFields, theme });
@@ -29070,7 +29211,7 @@ function BarChart({
     }
     return fields;
   };
-  const customBarShape = (0, import_react16.useMemo)(() => {
+  const customBarShape = (0, import_react17.useMemo)(() => {
     if (!theme?.barChartCornerRadius && !theme?.barChartCornerRadiusRatio)
       return void 0;
     return createCustomBar(sortYAxisFields([...yAxisFields]), theme);
@@ -29291,13 +29432,13 @@ function BarChart({
 }
 
 // src/components/Chart/ChartError.tsx
-var import_react17 = require("react");
+var import_react18 = require("react");
 var import_jsx_runtime37 = require("react/jsx-runtime");
 function ChartError({
   errorMessage = "Failed to fetch data.",
   containerStyle
 }) {
-  const [theme] = (0, import_react17.useContext)(ThemeContext);
+  const [theme] = (0, import_react18.useContext)(ThemeContext);
   return /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
     "div",
     {
@@ -29346,7 +29487,7 @@ function QuillChartErrorWithAction({
   onClick,
   ButtonComponent = MemoizedButton
 }) {
-  const [theme] = (0, import_react17.useContext)(ThemeContext);
+  const [theme] = (0, import_react18.useContext)(ThemeContext);
   return /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
     "div",
     {
@@ -29413,15 +29554,15 @@ init_Filter();
 init_filterProcessing();
 
 // src/components/Dashboard/DashboardFilter.tsx
-var import_react22 = require("react");
+var import_react23 = require("react");
 init_dateRangePickerUtils();
 
 // src/DateRangePicker/QuillDateRangePicker.tsx
-var import_react19 = require("react");
+var import_react20 = require("react");
 var import_date_fns11 = require("date-fns");
 
 // src/components/QuillSelect.tsx
-var import_react18 = require("react");
+var import_react19 = require("react");
 var import_react_dom3 = require("react-dom");
 var import_jsx_runtime38 = require("react/jsx-runtime");
 function QuillSelectComponent({
@@ -29434,10 +29575,10 @@ function QuillSelectComponent({
   disabled,
   hideEmptyOption
 }) {
-  const [theme] = (0, import_react18.useContext)(ThemeContext);
-  const [showModal, setShowModal] = (0, import_react18.useState)(false);
-  const modalRef = (0, import_react18.useRef)(null);
-  const buttonRef = (0, import_react18.useRef)(null);
+  const [theme] = (0, import_react19.useContext)(ThemeContext);
+  const [showModal, setShowModal] = (0, import_react19.useState)(false);
+  const modalRef = (0, import_react19.useRef)(null);
+  const buttonRef = (0, import_react19.useRef)(null);
   useOnClickOutside_default(
     modalRef,
     (event) => {
@@ -29446,7 +29587,7 @@ function QuillSelectComponent({
     },
     showModal
   );
-  const sortedItems = (0, import_react18.useMemo)(() => {
+  const sortedItems = (0, import_react19.useMemo)(() => {
     return options.sort((a, b) => {
       if (a.value === null) {
         return -1;
@@ -29457,12 +29598,12 @@ function QuillSelectComponent({
       return 0;
     });
   }, [options]);
-  const nullLabel = (0, import_react18.useMemo)(() => {
+  const nullLabel = (0, import_react19.useMemo)(() => {
     return sortedItems.some((item) => item.value === "-") ? "None" : "-";
   }, [sortedItems]);
-  const [popoverPosition, setPopoverPosition] = (0, import_react18.useState)(void 0);
-  const [z, setZ] = (0, import_react18.useState)(10);
-  const scrollableParentRef = (0, import_react18.useRef)(document.body);
+  const [popoverPosition, setPopoverPosition] = (0, import_react19.useState)(void 0);
+  const [z, setZ] = (0, import_react19.useState)(10);
+  const scrollableParentRef = (0, import_react19.useRef)(document.body);
   const updatePosition = () => {
     if (buttonRef.current) {
       requestAnimationFrame(() => {
@@ -29480,7 +29621,7 @@ function QuillSelectComponent({
       });
     }
   };
-  (0, import_react18.useEffect)(() => {
+  (0, import_react19.useEffect)(() => {
     let resizeObserver;
     let mutationObserver;
     if (showModal && buttonRef.current) {
@@ -29759,25 +29900,25 @@ function QuillDateRangePicker({
   hidePreset,
   disabled
 }) {
-  const [theme] = (0, import_react19.useContext)(ThemeContext);
-  const [client] = (0, import_react19.useContext)(ClientContext);
-  const [anchorStartDate, setAnchorStartDate] = (0, import_react19.useState)(
+  const [theme] = (0, import_react20.useContext)(ThemeContext);
+  const [client] = (0, import_react20.useContext)(ClientContext);
+  const [anchorStartDate, setAnchorStartDate] = (0, import_react20.useState)(
     getAnchorStartDate(dateRange.startDate, dateRange.endDate)
   );
-  const [anchorEndDate, setAnchorEndDate] = (0, import_react19.useState)(
+  const [anchorEndDate, setAnchorEndDate] = (0, import_react20.useState)(
     getAnchorEndDate(dateRange.startDate, dateRange.endDate)
   );
-  const [localStartDate, setLocalStartDate] = (0, import_react19.useState)(
+  const [localStartDate, setLocalStartDate] = (0, import_react20.useState)(
     dateRange.startDate
   );
-  const [localEndDate, setLocalEndDate] = (0, import_react19.useState)(
+  const [localEndDate, setLocalEndDate] = (0, import_react20.useState)(
     dateRange.endDate
   );
-  const [localPreset, setLocalPreset] = (0, import_react19.useState)(preset);
-  const [showModal, setShowModal] = (0, import_react19.useState)(false);
-  const buttonRef = (0, import_react19.useRef)(null);
-  const modalRef = (0, import_react19.useRef)(null);
-  (0, import_react19.useEffect)(() => {
+  const [localPreset, setLocalPreset] = (0, import_react20.useState)(preset);
+  const [showModal, setShowModal] = (0, import_react20.useState)(false);
+  const buttonRef = (0, import_react20.useRef)(null);
+  const modalRef = (0, import_react20.useRef)(null);
+  (0, import_react20.useEffect)(() => {
     setLocalEndDate(dateRange.endDate);
     setLocalStartDate(dateRange.startDate);
     setLocalPreset(preset || "");
@@ -30288,7 +30429,7 @@ function getAnchorEndDate(startDate, endDate) {
 }
 
 // src/components/QuillMultiSelectWithCombo.tsx
-var import_react20 = __toESM(require("react"), 1);
+var import_react21 = __toESM(require("react"), 1);
 var import_react_dom4 = require("react-dom");
 var import_jsx_runtime40 = require("react/jsx-runtime");
 function QuillMultiSelectComponentWithCombo({
@@ -30303,35 +30444,35 @@ function QuillMultiSelectComponentWithCombo({
   allSelectedLabel,
   style: style2
 }) {
-  const [theme] = (0, import_react20.useContext)(ThemeContext);
-  const [selectedOptions, setSelectedOptions] = (0, import_react20.useState)([]);
-  const [showModal, setShowModal] = (0, import_react20.useState)(false);
-  const modalRef = (0, import_react20.useRef)(null);
-  const buttonRef = (0, import_react20.useRef)(null);
-  const debounceTimeoutId = (0, import_react20.useRef)(null);
-  const [searchQuery, setSearchQuery] = import_react20.default.useState("");
-  const [exceedsLimit, setExceedsLimit] = (0, import_react20.useState)(false);
-  const [popoverPosition, setPopoverPosition] = (0, import_react20.useState)(void 0);
-  const [z, setZ] = (0, import_react20.useState)(10);
-  const scrollableParentRef = (0, import_react20.useRef)(document.body);
-  const selectAllRef = (0, import_react20.useRef)(null);
+  const [theme] = (0, import_react21.useContext)(ThemeContext);
+  const [selectedOptions, setSelectedOptions] = (0, import_react21.useState)([]);
+  const [showModal, setShowModal] = (0, import_react21.useState)(false);
+  const modalRef = (0, import_react21.useRef)(null);
+  const buttonRef = (0, import_react21.useRef)(null);
+  const debounceTimeoutId = (0, import_react21.useRef)(null);
+  const [searchQuery, setSearchQuery] = import_react21.default.useState("");
+  const [exceedsLimit, setExceedsLimit] = (0, import_react21.useState)(false);
+  const [popoverPosition, setPopoverPosition] = (0, import_react21.useState)(void 0);
+  const [z, setZ] = (0, import_react21.useState)(10);
+  const scrollableParentRef = (0, import_react21.useRef)(document.body);
+  const selectAllRef = (0, import_react21.useRef)(null);
   let CheckboxState;
   ((CheckboxState2) => {
     CheckboxState2[CheckboxState2["SELECTED"] = 0] = "SELECTED";
     CheckboxState2[CheckboxState2["UNSELECTED"] = 1] = "UNSELECTED";
     CheckboxState2[CheckboxState2["INDETERMINATE"] = 2] = "INDETERMINATE";
   })(CheckboxState || (CheckboxState = {}));
-  const optionValues = (0, import_react20.useMemo)(
+  const optionValues = (0, import_react21.useMemo)(
     () => new Set(options.map((opt) => opt.value ?? "")),
     [options]
   );
-  const potentialOptions = (0, import_react20.useMemo)(() => {
+  const potentialOptions = (0, import_react21.useMemo)(() => {
     return value.filter((opt) => !optionValues.has(opt ?? "")).map((opt) => ({
       label: opt === "" ? "-" : opt?.toString() ?? "-",
       value: opt ?? ""
     })).concat(options);
   }, [value, options]);
-  const selectedOptionsLabel = (0, import_react20.useMemo)(() => {
+  const selectedOptionsLabel = (0, import_react21.useMemo)(() => {
     if (!value || !value.length) {
       return "Select";
     }
@@ -30348,7 +30489,7 @@ function QuillMultiSelectComponentWithCombo({
       (elem) => elem.label ?? "-"
     ).join(", ");
   }, [options, value]);
-  const [selectAllCheckboxState, setSelectAllCheckboxState] = (0, import_react20.useState)(
+  const [selectAllCheckboxState, setSelectAllCheckboxState] = (0, import_react21.useState)(
     (() => {
       if (value.length === 0) {
         return 1 /* UNSELECTED */;
@@ -30359,12 +30500,12 @@ function QuillMultiSelectComponentWithCombo({
       return 2 /* INDETERMINATE */;
     })()
   );
-  (0, import_react20.useEffect)(() => {
+  (0, import_react21.useEffect)(() => {
     if (selectAllRef.current) {
       selectAllRef.current.indeterminate = selectAllCheckboxState === 2 /* INDETERMINATE */;
     }
   }, [selectAllCheckboxState, showModal]);
-  (0, import_react20.useEffect)(() => {
+  (0, import_react21.useEffect)(() => {
     if (options.length > 0 && options?.[0]?.value === "EXCEEDS_LIMIT") {
       setExceedsLimit(true);
     } else {
@@ -30379,7 +30520,7 @@ function QuillMultiSelectComponentWithCombo({
     },
     showModal
   );
-  (0, import_react20.useEffect)(() => {
+  (0, import_react21.useEffect)(() => {
     if (!value) {
       setSelectedOptions([]);
     } else {
@@ -30394,7 +30535,7 @@ function QuillMultiSelectComponentWithCombo({
       onChange(updatedChangeEvent);
     }, 200);
   };
-  const filteredItems = import_react20.default.useMemo(() => {
+  const filteredItems = import_react21.default.useMemo(() => {
     if (searchQuery === "") {
       return potentialOptions.sort((a, b) => {
         if (a.value === null) {
@@ -30424,7 +30565,7 @@ function QuillMultiSelectComponentWithCombo({
       return 0;
     }).slice(0, 20);
   }, [potentialOptions, searchQuery]);
-  const nullLabel = (0, import_react20.useMemo)(() => {
+  const nullLabel = (0, import_react21.useMemo)(() => {
     return filteredItems.some((item) => item.value === "-") ? "None" : "-";
   }, [filteredItems]);
   const updatePosition = () => {
@@ -30444,7 +30585,7 @@ function QuillMultiSelectComponentWithCombo({
       });
     }
   };
-  (0, import_react20.useEffect)(() => {
+  (0, import_react21.useEffect)(() => {
     let resizeObserver;
     let mutationObserver;
     if (showModal && buttonRef.current) {
@@ -30878,7 +31019,7 @@ var ListboxTextInput = ({
   onChange,
   placeholder
 }) => {
-  const [theme] = (0, import_react20.useContext)(ThemeContext);
+  const [theme] = (0, import_react21.useContext)(ThemeContext);
   return /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)(
     "div",
     {
@@ -30948,7 +31089,7 @@ var ListboxTextInput = ({
 };
 
 // src/components/QuillSelectWithCombo.tsx
-var import_react21 = __toESM(require("react"), 1);
+var import_react22 = __toESM(require("react"), 1);
 var import_jsx_runtime41 = require("react/jsx-runtime");
 function QuillSelectComponentWithCombo({
   options,
@@ -30960,12 +31101,12 @@ function QuillSelectComponentWithCombo({
   hideEmptyOption,
   disabled
 }) {
-  const [theme] = (0, import_react21.useContext)(ThemeContext);
-  const [showModal, setShowModal] = (0, import_react21.useState)(false);
-  const modalRef = (0, import_react21.useRef)(null);
-  const buttonRef = (0, import_react21.useRef)(null);
-  const [searchQuery, setSearchQuery] = import_react21.default.useState("");
-  const filteredItems = import_react21.default.useMemo(() => {
+  const [theme] = (0, import_react22.useContext)(ThemeContext);
+  const [showModal, setShowModal] = (0, import_react22.useState)(false);
+  const modalRef = (0, import_react22.useRef)(null);
+  const buttonRef = (0, import_react22.useRef)(null);
+  const [searchQuery, setSearchQuery] = import_react22.default.useState("");
+  const filteredItems = import_react22.default.useMemo(() => {
     if (searchQuery === "") {
       return options?.sort((a, b) => {
         if (a.value === null) {
@@ -30995,10 +31136,10 @@ function QuillSelectComponentWithCombo({
       return 0;
     })?.slice(0, 20) ?? [];
   }, [options, searchQuery]);
-  const nullLabel = (0, import_react21.useMemo)(() => {
+  const nullLabel = (0, import_react22.useMemo)(() => {
     return filteredItems.some((item) => item.value === "-") ? "None" : "-";
   }, [filteredItems]);
-  const selectedLabel = (0, import_react21.useMemo)(() => {
+  const selectedLabel = (0, import_react22.useMemo)(() => {
     const selectedOption = options?.find((elem) => elem.value === value);
     return selectedOption && selectedOption.label == "-" ? nullLabel : selectedOption?.label ?? "Select";
   }, [value, options, nullLabel]);
@@ -31266,7 +31407,7 @@ function DashboardFilter2({
   disabled,
   containerStyle
 }) {
-  const preset = (0, import_react22.useMemo)(() => {
+  const preset = (0, import_react23.useMemo)(() => {
     if (
       /*'preset' in filter && */
       "primaryRange" in filter
@@ -31467,7 +31608,7 @@ function DashboardFilter2({
 init_paginationProcessing();
 
 // src/components/Dashboard/MetricComponent.tsx
-var import_react23 = require("react");
+var import_react24 = require("react");
 init_dateRangePickerUtils();
 var import_jsx_runtime43 = require("react/jsx-runtime");
 function QuillMetricComponent({
@@ -31477,7 +31618,7 @@ function QuillMetricComponent({
   isLoading,
   children
 }) {
-  const [theme] = (0, import_react23.useContext)(ThemeContext);
+  const [theme] = (0, import_react24.useContext)(ThemeContext);
   const dateFilter = report?.filtersApplied?.find(
     (filter) => filter.filterType === "date_range"
   );
@@ -31751,7 +31892,7 @@ var MetricDisplay = ({
 };
 
 // src/components/Dashboard/DataLoader.tsx
-var import_react24 = require("react");
+var import_react25 = require("react");
 init_paginationProcessing();
 init_tableProcessing();
 var import_fast_deep_equal2 = __toESM(require("fast-deep-equal"), 1);
@@ -31852,29 +31993,29 @@ function DataLoader({
   dashboardName,
   propagateChanges
 }) {
-  const [client] = (0, import_react24.useContext)(ClientContext);
+  const [client] = (0, import_react25.useContext)(ClientContext);
   const {
     dashboardReports: dashboard,
     addReport,
     updateReport
   } = useDashboardReports(dashboardName);
-  const { dashboardFilters } = (0, import_react24.useContext)(DashboardFiltersContext);
-  const { tenants, flags } = (0, import_react24.useContext)(TenantContext);
-  const { reports, reportsDispatch, fetchIndividualReport } = (0, import_react24.useContext)(ReportsContext);
-  const { reportFilters } = (0, import_react24.useContext)(ReportFiltersContext);
-  const { getToken } = (0, import_react24.useContext)(FetchContext);
-  const { eventTracking } = (0, import_react24.useContext)(EventTrackingContext);
-  const contextFilters = (0, import_react24.useMemo)(() => {
+  const { dashboardFilters } = (0, import_react25.useContext)(DashboardFiltersContext);
+  const { tenants, flags } = (0, import_react25.useContext)(TenantContext);
+  const { reports, reportsDispatch, fetchIndividualReport } = (0, import_react25.useContext)(ReportsContext);
+  const { reportFilters } = (0, import_react25.useContext)(ReportFiltersContext);
+  const { getToken } = (0, import_react25.useContext)(FetchContext);
+  const { eventTracking } = (0, import_react25.useContext)(EventTrackingContext);
+  const contextFilters = (0, import_react25.useMemo)(() => {
     return dashboardName ? Object.values(dashboardFilters[dashboardName] ?? {}).map(
       (f) => f.filter
     ) : Object.values(reportFilters[item.id] ?? {}).map((f) => f.filter);
   }, [dashboardFilters, reportFilters, dashboardName, item.id]);
-  const [schemaData] = (0, import_react24.useContext)(SchemaDataContext);
-  const [loading, setLoading] = (0, import_react24.useState)(true);
-  const [error, setError] = (0, import_react24.useState)(void 0);
-  const [previousPage, setPreviousPage] = (0, import_react24.useState)(0);
-  const [additionalProcessing, setAdditionalProcessing] = (0, import_react24.useState)(defaultAdditionalProcessing);
-  const chartReport = (0, import_react24.useMemo)(() => {
+  const [schemaData] = (0, import_react25.useContext)(SchemaDataContext);
+  const [loading, setLoading] = (0, import_react25.useState)(true);
+  const [error, setError] = (0, import_react25.useState)(void 0);
+  const [previousPage, setPreviousPage] = (0, import_react25.useState)(0);
+  const [additionalProcessing, setAdditionalProcessing] = (0, import_react25.useState)(defaultAdditionalProcessing);
+  const chartReport = (0, import_react25.useMemo)(() => {
     const report = (dashboardName ? dashboard : reports)[item.id];
     if (report) {
       return convertInternalReportToReport(
@@ -31890,17 +32031,17 @@ function DataLoader({
     reportFilters,
     dashboardFilters
   ]);
-  const previousFilters = (0, import_react24.useRef)(filters);
-  const previousUserFilters = (0, import_react24.useRef)(userFilters);
-  const previousTenants = (0, import_react24.useRef)(tenants);
-  const previousCustomFields = (0, import_react24.useRef)(schemaData.customFields);
-  const [rowCountIsLoading, setRowCountIsLoading] = (0, import_react24.useState)(false);
-  const rowsRequestId = (0, import_react24.useRef)(0);
-  const rowsAbortController = (0, import_react24.useRef)(null);
-  const rowCountRequestId = (0, import_react24.useRef)(0);
-  const rowCountAbortController = (0, import_react24.useRef)(null);
-  const updateTableRowsRequestId = (0, import_react24.useRef)(0);
-  const updateTableRowsAbortController = (0, import_react24.useRef)(null);
+  const previousFilters = (0, import_react25.useRef)(filters);
+  const previousUserFilters = (0, import_react25.useRef)(userFilters);
+  const previousTenants = (0, import_react25.useRef)(tenants);
+  const previousCustomFields = (0, import_react25.useRef)(schemaData.customFields);
+  const [rowCountIsLoading, setRowCountIsLoading] = (0, import_react25.useState)(false);
+  const rowsRequestId = (0, import_react25.useRef)(0);
+  const rowsAbortController = (0, import_react25.useRef)(null);
+  const rowCountRequestId = (0, import_react25.useRef)(0);
+  const rowCountAbortController = (0, import_react25.useRef)(null);
+  const updateTableRowsRequestId = (0, import_react25.useRef)(0);
+  const updateTableRowsAbortController = (0, import_react25.useRef)(null);
   const fetchRowCount = async (processing) => {
     if (!client || !filters) {
       if (!rowCountAbortController.current) return;
@@ -32167,7 +32308,7 @@ function DataLoader({
       }
     }
   };
-  (0, import_react24.useEffect)(() => {
+  (0, import_react25.useEffect)(() => {
     if (schemaData.isSchemaLoading || filterValuesEquivalent(
       previousFilters.current ?? contextFilters,
       filters
@@ -32197,7 +32338,7 @@ function DataLoader({
     schemaData.customFields,
     schemaData.isSchemaLoading
   ]);
-  (0, import_react24.useEffect)(() => {
+  (0, import_react25.useEffect)(() => {
     const tempReport = (dashboardName ? dashboard : reports)[item.id];
     if (tempReport?.triggerReload) {
       fetchReportHelper(additionalProcessing);
@@ -32229,29 +32370,29 @@ var ChartDataLoader = ({
   propagateChanges
 }) => {
   const { dashboardReports: dashboard, addReport } = useDashboardReports(dashboardName);
-  const { dashboardFilters } = (0, import_react24.useContext)(DashboardFiltersContext);
-  const { reports, fetchIndividualReport } = (0, import_react24.useContext)(ReportsContext);
-  const { getToken } = (0, import_react24.useContext)(FetchContext);
-  const { eventTracking } = (0, import_react24.useContext)(EventTrackingContext);
-  const { reportFilters } = (0, import_react24.useContext)(ReportFiltersContext);
-  const { tenants, flags } = (0, import_react24.useContext)(TenantContext);
-  const contextFilters = (0, import_react24.useMemo)(() => {
+  const { dashboardFilters } = (0, import_react25.useContext)(DashboardFiltersContext);
+  const { reports, fetchIndividualReport } = (0, import_react25.useContext)(ReportsContext);
+  const { getToken } = (0, import_react25.useContext)(FetchContext);
+  const { eventTracking } = (0, import_react25.useContext)(EventTrackingContext);
+  const { reportFilters } = (0, import_react25.useContext)(ReportFiltersContext);
+  const { tenants, flags } = (0, import_react25.useContext)(TenantContext);
+  const contextFilters = (0, import_react25.useMemo)(() => {
     return dashboardName ? Object.values(dashboardFilters[dashboardName] ?? {}).map(
       (f) => f.filter
     ) : Object.values(reportFilters[item.id] ?? {}).map((f) => f.filter);
   }, [dashboardFilters, reportFilters, dashboardName, item.id]);
-  const [loading, setLoading] = (0, import_react24.useState)(true);
-  const [error, setError] = (0, import_react24.useState)(void 0);
-  const [client] = (0, import_react24.useContext)(ClientContext);
-  const [schemaData] = (0, import_react24.useContext)(SchemaDataContext);
-  const previousFilters = (0, import_react24.useRef)(filters);
-  const previousUserFilters = (0, import_react24.useRef)(userFilters);
-  const previousDateBucket = (0, import_react24.useRef)(dateBucket);
-  const previousTenants = (0, import_react24.useRef)(tenants);
-  const previousCustomFields = (0, import_react24.useRef)(schemaData.customFields);
-  const fetchReportAbortController = (0, import_react24.useRef)(null);
-  const rowsRequestId = (0, import_react24.useRef)(0);
-  const chartReport = (0, import_react24.useMemo)(() => {
+  const [loading, setLoading] = (0, import_react25.useState)(true);
+  const [error, setError] = (0, import_react25.useState)(void 0);
+  const [client] = (0, import_react25.useContext)(ClientContext);
+  const [schemaData] = (0, import_react25.useContext)(SchemaDataContext);
+  const previousFilters = (0, import_react25.useRef)(filters);
+  const previousUserFilters = (0, import_react25.useRef)(userFilters);
+  const previousDateBucket = (0, import_react25.useRef)(dateBucket);
+  const previousTenants = (0, import_react25.useRef)(tenants);
+  const previousCustomFields = (0, import_react25.useRef)(schemaData.customFields);
+  const fetchReportAbortController = (0, import_react25.useRef)(null);
+  const rowsRequestId = (0, import_react25.useRef)(0);
+  const chartReport = (0, import_react25.useMemo)(() => {
     const report = dashboardName ? dashboard[item.id] : reports[item.id];
     if (!report) {
       return constructReportFromItem(item);
@@ -32363,7 +32504,7 @@ var ChartDataLoader = ({
       }
     }
   };
-  (0, import_react24.useEffect)(() => {
+  (0, import_react25.useEffect)(() => {
     if (!filters) {
       return;
     }
@@ -32398,7 +32539,7 @@ var ChartDataLoader = ({
     schemaData.customFields,
     schemaData.isSchemaLoading
   ]);
-  (0, import_react24.useEffect)(() => {
+  (0, import_react25.useEffect)(() => {
     const tempReport = (dashboardName ? dashboard : reports)[item.id];
     if (tempReport && tempReport.triggerReload) {
       fetchReportHelper();
@@ -32421,9 +32562,9 @@ var ChartDataLoader = ({
 init_dateRangePickerUtils();
 
 // src/hooks/useReport.ts
-var import_react25 = require("react");
+var import_react26 = require("react");
 var useReports = () => {
-  const [dashboard, dispatch2] = (0, import_react25.useContext)(DashboardContext);
+  const [dashboard, dispatch2] = (0, import_react26.useContext)(DashboardContext);
   const reloadFilteredReports = (predicate) => {
     for (const dashboardName of Object.keys(dashboard)) {
       for (const id2 of Object.keys(dashboard[dashboardName])) {
@@ -32443,7 +32584,7 @@ var useReports = () => {
   };
 };
 var useReportInternal = (reportId) => {
-  const { loadFiltersForReport } = (0, import_react25.useContext)(ReportFiltersContext);
+  const { loadFiltersForReport } = (0, import_react26.useContext)(ReportFiltersContext);
   const { allReportsById } = useAllReports();
   const reload = async (overrideFilters, customFilters = [], initiator = "Chart") => {
     const dateFilter = overrideFilters.filters.find(
@@ -32475,7 +32616,7 @@ var import_fast_deep_equal3 = __toESM(require("fast-deep-equal"), 1);
 
 // src/components/Chart/MapChart.tsx
 var import_react_simple_maps = require("react-simple-maps");
-var import_react26 = require("react");
+var import_react27 = require("react");
 init_valueFormatter();
 var import_jsx_runtime45 = require("react/jsx-runtime");
 var statesUrl = "https://cdn.jsdelivr.net/npm/us-atlas@3/states-10m.json";
@@ -32802,23 +32943,23 @@ function USMap({
   className,
   containerStyle
 }) {
-  const containerRef = (0, import_react26.useRef)(null);
-  const [hoveredState, setHoveredState] = (0, import_react26.useState)(
+  const containerRef = (0, import_react27.useRef)(null);
+  const [hoveredState, setHoveredState] = (0, import_react27.useState)(
     void 0
   );
-  const [hoveredCoords, setHoveredCoords] = (0, import_react26.useState)(void 0);
+  const [hoveredCoords, setHoveredCoords] = (0, import_react27.useState)(void 0);
   const mappedData = data.reduce((acc, curr) => {
     acc[curr[xAxisField]?.toString()] = curr;
     return acc;
   }, {});
   const measureField = yAxisFields[0]?.field ?? xAxisField;
-  const [scaleLog, setScaleLog] = (0, import_react26.useState)(null);
-  (0, import_react26.useEffect)(() => {
+  const [scaleLog, setScaleLog] = (0, import_react27.useState)(null);
+  (0, import_react27.useEffect)(() => {
     import("d3-scale").then((scale) => {
       setScaleLog(() => scale.scaleLog);
     });
   }, []);
-  const colorScale = (0, import_react26.useMemo)(() => {
+  const colorScale = (0, import_react27.useMemo)(() => {
     if (!scaleLog) return () => "#FFFFFF";
     const values = Object.values(mappedData).map((d) => parseFloat(d[measureField])).filter((v) => !isNaN(v));
     const minValue = Math.min(...values);
@@ -32844,7 +32985,7 @@ function USMap({
     colors,
     scaleLog
   ]);
-  const hoveredValue = (0, import_react26.useMemo)(() => {
+  const hoveredValue = (0, import_react27.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) {
@@ -32993,23 +33134,23 @@ function WorldMap({
   className,
   containerStyle
 }) {
-  const containerRef = (0, import_react26.useRef)(null);
-  const [hoveredCountry, setHoveredCountry] = (0, import_react26.useState)(
+  const containerRef = (0, import_react27.useRef)(null);
+  const [hoveredCountry, setHoveredCountry] = (0, import_react27.useState)(
     void 0
   );
-  const [hoveredCoords, setHoveredCoords] = (0, import_react26.useState)(void 0);
+  const [hoveredCoords, setHoveredCoords] = (0, import_react27.useState)(void 0);
   const mappedData = data.reduce((acc, curr) => {
     acc[curr[xAxisField]?.toString()] = curr;
     return acc;
   }, {});
   const measureField = yAxisFields[0]?.field ?? xAxisField;
-  const [scaleLog, setScaleLog] = (0, import_react26.useState)(null);
-  (0, import_react26.useEffect)(() => {
+  const [scaleLog, setScaleLog] = (0, import_react27.useState)(null);
+  (0, import_react27.useEffect)(() => {
     import("d3-scale").then((scale) => {
       setScaleLog(() => scale.scaleLog);
     });
   }, []);
-  const colorScale = (0, import_react26.useMemo)(() => {
+  const colorScale = (0, import_react27.useMemo)(() => {
     if (!scaleLog) return () => "#FFFFFF";
     const values = Object.values(mappedData).map((d) => parseFloat(d[measureField])).filter((v) => !isNaN(v));
     const minValue = Math.min(...values);
@@ -33035,7 +33176,7 @@ function WorldMap({
     colors,
     scaleLog
   ]);
-  const hoveredValue = (0, import_react26.useMemo)(() => {
+  const hoveredValue = (0, import_react27.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) {
@@ -33186,8 +33327,8 @@ function MapLayout({
   regionNames
 }) {
   const { projection } = (0, import_react_simple_maps.useMapContext)();
-  const [geoCentroid, setGeoCentroid] = (0, import_react26.useState)(null);
-  (0, import_react26.useEffect)(() => {
+  const [geoCentroid, setGeoCentroid] = (0, import_react27.useState)(null);
+  (0, import_react27.useEffect)(() => {
     import("d3-geo").then((geo) => {
       setGeoCentroid(() => geo.geoCentroid);
     });
@@ -33239,7 +33380,7 @@ function MapLayout({
 }
 
 // src/components/Chart/GaugeChart.tsx
-var import_react27 = require("react");
+var import_react28 = require("react");
 
 // ../../node_modules/d3-transition/src/selection/index.js
 var import_d3_selection9 = require("d3-selection");
@@ -34513,20 +34654,20 @@ function D3Gauge({
   colors,
   isAnimationActive
 }) {
-  const containerRef = (0, import_react27.useRef)(null);
-  const svgRef = (0, import_react27.useRef)(null);
-  const gaugeGroupRef = (0, import_react27.useRef)(null);
-  const needleRef = (0, import_react27.useRef)(null);
-  const needleOutlineRef = (0, import_react27.useRef)(null);
-  const textRef = (0, import_react27.useRef)(null);
-  const previousPercentageRef = (0, import_react27.useRef)(0);
-  const firstMountRef = (0, import_react27.useRef)(true);
+  const containerRef = (0, import_react28.useRef)(null);
+  const svgRef = (0, import_react28.useRef)(null);
+  const gaugeGroupRef = (0, import_react28.useRef)(null);
+  const needleRef = (0, import_react28.useRef)(null);
+  const needleOutlineRef = (0, import_react28.useRef)(null);
+  const textRef = (0, import_react28.useRef)(null);
+  const previousPercentageRef = (0, import_react28.useRef)(0);
+  const firstMountRef = (0, import_react28.useRef)(true);
   const startAngle = -(3 * Math.PI) / 4;
   const totalAngle = 3 * Math.PI / 2;
-  const [arc, setArc] = (0, import_react27.useState)(null);
-  const [interpolate, setInterpolate] = (0, import_react27.useState)(null);
-  const [select, setSelect] = (0, import_react27.useState)(null);
-  (0, import_react27.useEffect)(() => {
+  const [arc, setArc] = (0, import_react28.useState)(null);
+  const [interpolate, setInterpolate] = (0, import_react28.useState)(null);
+  const [select, setSelect] = (0, import_react28.useState)(null);
+  (0, import_react28.useEffect)(() => {
     import("d3-shape").then(({ arc: arc2 }) => {
       setArc(() => arc2);
     });
@@ -34537,7 +34678,7 @@ function D3Gauge({
       setSelect(() => select2);
     });
   }, []);
-  (0, import_react27.useEffect)(() => {
+  (0, import_react28.useEffect)(() => {
     if (!containerRef.current || !select) return;
     const container = containerRef.current;
     select(container).select("svg").remove();
@@ -34554,7 +34695,7 @@ function D3Gauge({
       svgRef.current = null;
     };
   }, [colors, select]);
-  (0, import_react27.useEffect)(() => {
+  (0, import_react28.useEffect)(() => {
     if (!containerRef.current || !svgRef.current || !gaugeGroupRef.current || !needleRef.current || !needleOutlineRef.current || !textRef.current || !arc || !interpolate || !select)
       return;
     const rect = containerRef.current.getBoundingClientRect();
@@ -34654,7 +34795,7 @@ function D3Gauge({
     arc,
     interpolate
   ]);
-  (0, import_react27.useEffect)(() => {
+  (0, import_react28.useEffect)(() => {
     if (!containerRef.current) return;
     const observer = new ResizeObserver(() => {
       previousPercentageRef.current = percentage;
@@ -34672,7 +34813,7 @@ function D3Gauge({
 }
 
 // src/components/QuillComponentTables.tsx
-var import_react28 = require("react");
+var import_react29 = require("react");
 init_paginationProcessing();
 var import_jsx_runtime47 = require("react/jsx-runtime");
 var QuillTableSQLEditorComponent = ({
@@ -34689,8 +34830,8 @@ var QuillTableSQLEditorComponent = ({
   setCurrentPage,
   hideLabels
 }) => {
-  const [sort, setSort] = (0, import_react28.useState)({ field: "", direction: "" });
-  const [page, setPage] = (0, import_react28.useState)(0);
+  const [sort, setSort] = (0, import_react29.useState)({ field: "", direction: "" });
+  const [page, setPage] = (0, import_react29.useState)(0);
   return /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(
     QuillTable,
     {
@@ -34732,9 +34873,9 @@ var QuillTableReportBuilderComponent = ({
   setCurrentPage,
   disableSort
 }) => {
-  const [sort, setSort] = (0, import_react28.useState)({ field: "", direction: "" });
-  const [page, setPage] = (0, import_react28.useState)(0);
-  (0, import_react28.useEffect)(() => {
+  const [sort, setSort] = (0, import_react29.useState)({ field: "", direction: "" });
+  const [page, setPage] = (0, import_react29.useState)(0);
+  (0, import_react29.useEffect)(() => {
     if (disableSort) {
       setSort({ field: "", direction: "" });
     }
@@ -34778,15 +34919,15 @@ var QuillTableComponent = ({
   currentPage,
   hideLabels
 }) => {
-  const [sort, setSort] = (0, import_react28.useState)({ field: "", direction: "" });
-  const [page, setPage] = (0, import_react28.useState)(0);
-  const [initialLoad, setInitialLoad] = (0, import_react28.useState)(true);
-  (0, import_react28.useEffect)(() => {
+  const [sort, setSort] = (0, import_react29.useState)({ field: "", direction: "" });
+  const [page, setPage] = (0, import_react29.useState)(0);
+  const [initialLoad, setInitialLoad] = (0, import_react29.useState)(true);
+  (0, import_react29.useEffect)(() => {
     if (initialLoad && !isLoading) {
       setInitialLoad(false);
     }
   }, [isLoading]);
-  (0, import_react28.useEffect)(() => {
+  (0, import_react29.useEffect)(() => {
     setPage(currentPage || 0);
   }, [currentPage]);
   if (initialLoad) {
@@ -34839,16 +34980,16 @@ function QuillTableDashboardComponent({
   onSortChange,
   hideName
 }) {
-  const [theme] = (0, import_react28.useContext)(ThemeContext);
-  const [initialLoad, setInitialLoad] = (0, import_react28.useState)(true);
+  const [theme] = (0, import_react29.useContext)(ThemeContext);
+  const [initialLoad, setInitialLoad] = (0, import_react29.useState)(true);
   const { downloadCSV: downloadCSV2 } = useExport(report?.id);
-  const [page, setPage] = (0, import_react28.useState)(0);
-  (0, import_react28.useEffect)(() => {
+  const [page, setPage] = (0, import_react29.useState)(0);
+  (0, import_react29.useEffect)(() => {
     if (!isLoading) {
       setInitialLoad(false);
     }
   }, [isLoading]);
-  (0, import_react28.useEffect)(() => {
+  (0, import_react29.useEffect)(() => {
     if (rowCountIsLoading) {
       setPage(0);
     }
@@ -34984,50 +35125,50 @@ function Chart({
   dateBucket,
   propagateChanges
 }) {
-  const [schemaData] = (0, import_react29.useContext)(SchemaDataContext);
+  const [schemaData] = (0, import_react30.useContext)(SchemaDataContext);
   const { reload } = useReportInternal(reportId);
-  const { reports, reportsDispatch, fetchIndividualReport } = (0, import_react29.useContext)(ReportsContext);
+  const { reports, reportsDispatch, fetchIndividualReport } = (0, import_react30.useContext)(ReportsContext);
   const {
     reportFiltersDispatch,
     reportFilters,
     customReportFiltersDispatch,
     customReportFilters
-  } = (0, import_react29.useContext)(ReportFiltersContext);
-  const { eventTracking } = (0, import_react29.useContext)(EventTrackingContext);
-  const { isLoading: isDashboardsLoading } = (0, import_react29.useContext)(DashboardConfigContext);
-  const { dashboardCustomFilters } = (0, import_react29.useContext)(DashboardFiltersContext);
+  } = (0, import_react30.useContext)(ReportFiltersContext);
+  const { eventTracking } = (0, import_react30.useContext)(EventTrackingContext);
+  const { isLoading: isDashboardsLoading } = (0, import_react30.useContext)(DashboardConfigContext);
+  const { dashboardCustomFilters } = (0, import_react30.useContext)(DashboardFiltersContext);
   const { allReportsById } = useAllReports();
   const { dashboardFilters } = useDashboardInternal(
     allReportsById[reportId]?.dashboardName ?? null
   );
-  const specificReportFilters = (0, import_react29.useMemo)(() => {
+  const specificReportFilters = (0, import_react30.useMemo)(() => {
     const reportFilterValues = reportFilters[reportId];
     if (reportFilterValues && !hideFilters)
       return Object.values(reportFilterValues ?? {}).map((f) => f.filter);
     if (allReportsById[reportId]) return dashboardFilters ?? [];
     return [];
   }, [reportFilters[reportId], allReportsById[reportId], dashboardFilters]);
-  const reportDateFilter = (0, import_react29.useMemo)(() => {
+  const reportDateFilter = (0, import_react30.useMemo)(() => {
     return specificReportFilters.find((f) => f.filterType === "date_range");
   }, [specificReportFilters]);
-  const presetOptions = (0, import_react29.useMemo)(() => {
+  const presetOptions = (0, import_react30.useMemo)(() => {
     return reportDateFilter ? convertPresetOptionsToSelectableList(
       reportDateFilter.presetOptions ?? [],
       reportDateFilter.defaultPresetRanges ?? []
     ) : defaultOptionsV2;
   }, [reportDateFilter]);
-  const userFilters = (0, import_react29.useMemo)(() => {
+  const userFilters = (0, import_react30.useMemo)(() => {
     return filters?.filter((f) => f.filterType !== "date" /* Date */)?.map(convertCustomFilter) ?? dashboardCustomFilters[allReportsById[reportId]?.dashboardName ?? ""];
   }, [
     filters,
     dashboardCustomFilters[allReportsById[reportId]?.dashboardName ?? ""]
   ]);
-  const previousFilters = (0, import_react29.useRef)(void 0);
+  const previousFilters = (0, import_react30.useRef)(void 0);
   if (!(0, import_fast_deep_equal3.default)(previousFilters.current, filters)) {
     previousFilters.current = filters;
   }
-  const [filterValues, setFilterValues] = (0, import_react29.useState)({});
-  (0, import_react29.useEffect)(() => {
+  const [filterValues, setFilterValues] = (0, import_react30.useState)({});
+  (0, import_react30.useEffect)(() => {
     setFilterValues(
       Object.values(reportFilters[reportId] ?? {}).reduce((acc, f) => {
         acc[f.filter.label] = f.filter.filterType === "string" ? f.filter.stringFilterType === "multiselect" ? { values: f.filter.values, operator: "IN" } : { selectedValue: f.filter.selectedValue } : f.filter.filterType === "date_range" ? {
@@ -35042,7 +35183,7 @@ function Chart({
       }, {})
     );
   }, [reportFilters[reportId]]);
-  (0, import_react29.useEffect)(() => {
+  (0, import_react30.useEffect)(() => {
     if ((0, import_fast_deep_equal3.default)(customReportFilters[reportId] ?? [], filters ?? [])) {
       return;
     }
@@ -35058,7 +35199,7 @@ function Chart({
       });
     };
   }, [filters]);
-  (0, import_react29.useEffect)(() => {
+  (0, import_react30.useEffect)(() => {
     if (reportDateFilter) {
       const customDateFilter = previousFilters.current?.find(
         (f) => f.filterType === "date" /* Date */
@@ -35091,20 +35232,20 @@ function Chart({
       });
     }
   }, [previousFilters.current]);
-  const dashboardReport = (0, import_react29.useMemo)(
+  const dashboardReport = (0, import_react30.useMemo)(
     () => allReportsById[reportId],
     [reportId, allReportsById]
   );
-  const report = (0, import_react29.useMemo)(() => reports[reportId], [reports, reportId]);
-  const [loading, setLoading] = (0, import_react29.useState)(true);
-  const [theme] = (0, import_react29.useContext)(ThemeContext);
-  const colorMap = (0, import_react29.useMemo)(() => {
+  const report = (0, import_react30.useMemo)(() => reports[reportId], [reports, reportId]);
+  const [loading, setLoading] = (0, import_react30.useState)(true);
+  const [theme] = (0, import_react30.useContext)(ThemeContext);
+  const colorMap = (0, import_react30.useMemo)(() => {
     if (mapColorsToFields && report && theme) {
       return mapColorsToFields(report, theme);
     }
   }, [report, theme]);
-  const [client, clientLoading] = (0, import_react29.useContext)(ClientContext);
-  const [error, setError] = (0, import_react29.useState)(void 0);
+  const [client, clientLoading] = (0, import_react30.useContext)(ClientContext);
+  const [error, setError] = (0, import_react30.useState)(void 0);
   const updateFilter = (filter, value, comparison) => {
     let filterValue = {};
     if (filter.filterType === "string" /* String */) {
@@ -35214,7 +35355,7 @@ function Chart({
       setLoading(false);
     }
   };
-  (0, import_react29.useEffect)(() => {
+  (0, import_react30.useEffect)(() => {
     if (reportId === void 0 || reportId === "" || clientLoading || isDashboardsLoading) {
       return;
     }
@@ -35402,11 +35543,11 @@ var ChartDisplay = ({
   tableRowsLoading = false
 }) => {
   const { downloadCSV: downloadCSV2 } = useExport(reportId);
-  const [theme] = (0, import_react29.useContext)(ThemeContext);
-  const { reports } = (0, import_react29.useContext)(ReportsContext);
-  const { dashboardFilters } = (0, import_react29.useContext)(DashboardFiltersContext);
-  const { reportFilters } = (0, import_react29.useContext)(ReportFiltersContext);
-  const specificDashboardFilters = (0, import_react29.useMemo)(() => {
+  const [theme] = (0, import_react30.useContext)(ThemeContext);
+  const { reports } = (0, import_react30.useContext)(ReportsContext);
+  const { dashboardFilters } = (0, import_react30.useContext)(DashboardFiltersContext);
+  const { reportFilters } = (0, import_react30.useContext)(ReportFiltersContext);
+  const specificDashboardFilters = (0, import_react30.useMemo)(() => {
     if (!reportId) return [];
     const dashboardName = reports[reportId]?.dashboardName || config?.dashboardName;
     if (!dashboardName) return [];
@@ -35414,24 +35555,24 @@ var ChartDisplay = ({
       (f) => f.filter
     );
   }, [dashboardFilters, reportId, reports]);
-  const specificReportFilters = (0, import_react29.useMemo)(() => {
+  const specificReportFilters = (0, import_react30.useMemo)(() => {
     if (!reportId) return [];
     return Object.values(reportFilters[reportId] ?? []).map((f) => f.filter);
   }, [reportFilters, reportId]);
-  const chartColors = (0, import_react29.useMemo)(() => {
+  const chartColors = (0, import_react30.useMemo)(() => {
     if (overrideTheme && overrideTheme.chartColors) {
       return colors?.length ? colors : overrideTheme && overrideTheme.chartColors && overrideTheme.chartColors.length ? overrideTheme.chartColors : ["#4E80EE", "#E14F62", "#55B5A6", "#E9A23B", "#6466E9", "#55B685"];
     }
     return colors?.length ? colors : theme && theme.chartColors && theme.chartColors.length ? theme.chartColors : ["#4E80EE", "#E14F62", "#55B5A6", "#E9A23B", "#6466E9", "#55B685"];
   }, [colors]);
-  const dateFilter = (0, import_react29.useMemo)(() => {
+  const dateFilter = (0, import_react30.useMemo)(() => {
     const filters = specificReportFilters.length > 0 ? specificReportFilters : specificDashboardFilters;
     if (!hideDateRangeFilter && filters) {
       return findAndProcessDateFilter(filters.map((f) => f));
     }
     return void 0;
   }, [config, specificReportFilters, specificDashboardFilters]);
-  const [page, setPage] = (0, import_react29.useState)(0);
+  const [page, setPage] = (0, import_react30.useState)(0);
   if (loading) {
     return /* @__PURE__ */ (0, import_jsx_runtime48.jsx)("div", { className, style: containerStyle, children: /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(LoadingComponent, {}) });
   } else if (config && !["metric", "table", "gauge", "US map", "World map"].includes(
@@ -35749,7 +35890,7 @@ function DashboardSectionContainer({
 }
 
 // src/components/Dashboard/ChartComponent.tsx
-var import_react30 = require("react");
+var import_react31 = require("react");
 var import_jsx_runtime50 = require("react/jsx-runtime");
 function QuillChartComponent({
   report,
@@ -35758,7 +35899,7 @@ function QuillChartComponent({
   children,
   isLoading
 }) {
-  const [theme] = (0, import_react30.useContext)(ThemeContext);
+  const [theme] = (0, import_react31.useContext)(ThemeContext);
   return /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)(
     "div",
     {
@@ -35875,7 +36016,7 @@ function QuillChartComponent({
 }
 
 // src/components/Dashboard/TemplateChartComponent.tsx
-var import_react31 = require("react");
+var import_react32 = require("react");
 var import_jsx_runtime51 = require("react/jsx-runtime");
 function QuillTemplateChartComponent({
   report,
@@ -35883,7 +36024,7 @@ function QuillTemplateChartComponent({
   children,
   isLoading
 }) {
-  const [isSelected, setIsSelected] = (0, import_react31.useState)(false);
+  const [isSelected, setIsSelected] = (0, import_react32.useState)(false);
   return /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
     "div",
     {
@@ -35912,13 +36053,13 @@ function QuillTemplateChartComponent({
 }
 
 // src/components/Dashboard/DashboardSection.tsx
-var import_react32 = require("react");
+var import_react33 = require("react");
 var import_jsx_runtime52 = require("react/jsx-runtime");
 function DashboardSection({
   section,
   children
 }) {
-  const [theme] = (0, import_react32.useContext)(ThemeContext);
+  const [theme] = (0, import_react33.useContext)(ThemeContext);
   return /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)(import_jsx_runtime52.Fragment, { children: [
     section && /* @__PURE__ */ (0, import_jsx_runtime52.jsx)("div", { style: { display: "flex", flexDirection: "column" }, children: /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
       "h1",
@@ -35967,12 +36108,12 @@ init_tableProcessing();
 init_filterProcessing();
 
 // src/components/ReportBuilder/ui.tsx
-var import_react33 = require("react");
+var import_react34 = require("react");
 init_util();
 init_tableProcessing();
 var import_jsx_runtime53 = require("react/jsx-runtime");
 var QuillSecondaryButton = ({ children, ...props }) => {
-  const [theme] = (0, import_react33.useContext)(ThemeContext);
+  const [theme] = (0, import_react34.useContext)(ThemeContext);
   return /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
     "button",
     {
@@ -35998,9 +36139,9 @@ var QuillSecondaryButton = ({ children, ...props }) => {
     }
   );
 };
-var QuillTag = (0, import_react33.forwardRef)(
+var QuillTag = (0, import_react34.forwardRef)(
   ({ label, onClick, children, onClickDelete, hideDelete = false }, forwardedRef) => {
-    const [theme] = (0, import_react33.useContext)(ThemeContext);
+    const [theme] = (0, import_react34.useContext)(ThemeContext);
     return /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)(
       "div",
       {
@@ -36081,7 +36222,7 @@ var QuillTag = (0, import_react33.forwardRef)(
 var QuillSidebarHeading = ({
   label
 }) => {
-  const [theme] = (0, import_react33.useContext)(ThemeContext);
+  const [theme] = (0, import_react34.useContext)(ThemeContext);
   return /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
     "h1",
     {
@@ -36236,7 +36377,7 @@ var QuillSelectColumn = ({
   setSelected,
   DragHandle
 }) => {
-  const [theme] = (0, import_react33.useContext)(ThemeContext);
+  const [theme] = (0, import_react34.useContext)(ThemeContext);
   return /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)(
     "div",
     {
@@ -36275,7 +36416,7 @@ var QuillDraggableColumn = ({
   DragHandle,
   deleteDisabled
 }) => {
-  const [theme] = (0, import_react33.useContext)(ThemeContext);
+  const [theme] = (0, import_react34.useContext)(ThemeContext);
   return /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)(
     "div",
     {
@@ -36459,13 +36600,13 @@ var FilterPopoverWrapper = ({
   getToken,
   reportBuilderColumns
 }) => {
-  const { tenants } = (0, import_react33.useContext)(TenantContext);
-  const { eventTracking } = (0, import_react33.useContext)(EventTrackingContext);
-  const [isOpen, setIsOpen] = (0, import_react33.useState)(false);
-  const [uniqueValues, setUniqueValues] = (0, import_react33.useState)(void 0);
-  const [uniqueValuesIsLoading, setUniqueValuesIsLoading] = (0, import_react33.useState)(false);
-  const prevFiltersRef = (0, import_react33.useRef)("");
-  const columnInternals = (0, import_react33.useMemo)(() => {
+  const { tenants } = (0, import_react34.useContext)(TenantContext);
+  const { eventTracking } = (0, import_react34.useContext)(EventTrackingContext);
+  const [isOpen, setIsOpen] = (0, import_react34.useState)(false);
+  const [uniqueValues, setUniqueValues] = (0, import_react34.useState)(void 0);
+  const [uniqueValuesIsLoading, setUniqueValuesIsLoading] = (0, import_react34.useState)(false);
+  const prevFiltersRef = (0, import_react34.useRef)("");
+  const columnInternals = (0, import_react34.useMemo)(() => {
     if (!tables) {
       return null;
     }
@@ -36479,7 +36620,7 @@ var FilterPopoverWrapper = ({
     });
     return relevantColumns;
   }, [schema, tables]);
-  (0, import_react33.useEffect)(() => {
+  (0, import_react34.useEffect)(() => {
     const currentFiltersString = JSON.stringify(priorFilters);
     if (currentFiltersString !== prevFiltersRef.current) {
       prevFiltersRef.current = currentFiltersString;
@@ -36548,7 +36689,7 @@ var FilterPopoverWrapper = ({
 };
 
 // src/components/ReportBuilder/FilterModal.tsx
-var import_react34 = require("react");
+var import_react35 = require("react");
 init_Filter();
 var import_date_fns13 = require("date-fns");
 init_textProcessing();
@@ -36571,32 +36712,32 @@ function FilterModal({
   MultiSelectComponent,
   reportBuilderColumns
 }) {
-  const [field, setField] = (0, import_react34.useState)("");
-  const [fieldOptions, setFieldOptions] = (0, import_react34.useState)([]);
-  const [fieldValues, setFieldValues] = (0, import_react34.useState)([]);
-  const [type, setType] = (0, import_react34.useState)(null);
-  const [value, setValue] = (0, import_react34.useState)(void 0);
-  const [selectedOptions, setSelectedOptions] = (0, import_react34.useState)([]);
-  const [operator, setOperator] = (0, import_react34.useState)(
+  const [field, setField] = (0, import_react35.useState)("");
+  const [fieldOptions, setFieldOptions] = (0, import_react35.useState)([]);
+  const [fieldValues, setFieldValues] = (0, import_react35.useState)([]);
+  const [type, setType] = (0, import_react35.useState)(null);
+  const [value, setValue] = (0, import_react35.useState)(void 0);
+  const [selectedOptions, setSelectedOptions] = (0, import_react35.useState)([]);
+  const [operator, setOperator] = (0, import_react35.useState)(
     void 0
   );
-  const [operatorOptions, setOperatorOptions] = (0, import_react34.useState)([]);
-  const [unit, setUnit] = (0, import_react34.useState)("");
-  const [unitOptions, setUnitOptions] = (0, import_react34.useState)([]);
-  const [startDate, setStartDate] = (0, import_react34.useState)(
+  const [operatorOptions, setOperatorOptions] = (0, import_react35.useState)([]);
+  const [unit, setUnit] = (0, import_react35.useState)("");
+  const [unitOptions, setUnitOptions] = (0, import_react35.useState)([]);
+  const [startDate, setStartDate] = (0, import_react35.useState)(
     (0, import_date_fns13.startOfToday)().toISOString().substring(0, 10)
   );
-  const [endDate, setEndDate] = (0, import_react34.useState)(
+  const [endDate, setEndDate] = (0, import_react35.useState)(
     (0, import_date_fns13.startOfToday)().toISOString().substring(0, 10)
   );
-  const [filterInitialized, setFilterInitialized] = (0, import_react34.useState)(false);
-  const [table, setTable] = (0, import_react34.useState)(void 0);
-  const memoizedFieldValuesMap = (0, import_react34.useMemo)(
+  const [filterInitialized, setFilterInitialized] = (0, import_react35.useState)(false);
+  const [table, setTable] = (0, import_react35.useState)(void 0);
+  const memoizedFieldValuesMap = (0, import_react35.useMemo)(
     () => fieldValuesMap,
     [JSON.stringify(fieldValuesMap)]
   );
-  const memoizedFilter = (0, import_react34.useMemo)(() => filter, [JSON.stringify(filter)]);
-  (0, import_react34.useEffect)(() => {
+  const memoizedFilter = (0, import_react35.useMemo)(() => filter, [JSON.stringify(filter)]);
+  (0, import_react35.useEffect)(() => {
     if (!filter) {
       onFieldChange(field, fieldOptions, table);
     }
@@ -36641,7 +36782,7 @@ function FilterModal({
     ],
     [FieldType.Null]: [NullOperator.IsNotNull, NullOperator.IsNull]
   };
-  (0, import_react34.useEffect)(() => {
+  (0, import_react35.useEffect)(() => {
     if (filter) {
       setField(filter.field);
       setTable(filter.table);
@@ -36669,7 +36810,7 @@ function FilterModal({
       }
     }
   }, [memoizedFilter]);
-  (0, import_react34.useEffect)(() => {
+  (0, import_react35.useEffect)(() => {
     if (schema) {
       const fo = schema.flatMap((table2) => {
         if (tables && !tables.includes(table2.name)) {
@@ -37351,7 +37492,7 @@ function FilterModal({
 }
 
 // src/components/Dashboard/TemplateMetricComponent.tsx
-var import_react35 = require("react");
+var import_react36 = require("react");
 var import_jsx_runtime55 = require("react/jsx-runtime");
 function QuillTemplateMetricComponent({
   report,
@@ -37359,7 +37500,7 @@ function QuillTemplateMetricComponent({
   children,
   isLoading
 }) {
-  const [isSelected, setIsSelected] = (0, import_react35.useState)(false);
+  const [isSelected, setIsSelected] = (0, import_react36.useState)(false);
   return /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
     "div",
     {
@@ -37388,7 +37529,7 @@ function QuillTemplateMetricComponent({
 }
 
 // src/components/Dashboard/TemplateTableComponent.tsx
-var import_react36 = require("react");
+var import_react37 = require("react");
 var import_jsx_runtime56 = require("react/jsx-runtime");
 function QuillTemplateTableComponent({
   report,
@@ -37399,7 +37540,7 @@ function QuillTemplateTableComponent({
   onPageChange,
   onSortChange
 }) {
-  const [isSelected, setIsSelected] = (0, import_react36.useState)(false);
+  const [isSelected, setIsSelected] = (0, import_react37.useState)(false);
   return /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(
     "div",
     {
@@ -37614,14 +37755,14 @@ function Dashboard({
   templateDashboardName,
   pagination = { rowsPerPage: 10, rowsPerRequest: 50 }
 }) {
-  const [userFilters, setUserFilters] = (0, import_react37.useState)({});
-  const [selectedSection, setSelectedSection] = (0, import_react37.useState)("");
-  const dataLoaderUserFilters = (0, import_react37.useMemo)(() => {
+  const [userFilters, setUserFilters] = (0, import_react38.useState)({});
+  const [selectedSection, setSelectedSection] = (0, import_react38.useState)("");
+  const dataLoaderUserFilters = (0, import_react38.useMemo)(() => {
     return (filters?.map((f) => convertCustomFilter(f)) ?? []).concat(
       Object.values(userFilters)
     );
   }, [filters, userFilters]);
-  (0, import_react37.useEffect)(() => {
+  (0, import_react38.useEffect)(() => {
     onUserFiltersUpdated?.(Object.values(userFilters));
   }, [userFilters]);
   const {
@@ -37636,10 +37777,10 @@ function Dashboard({
       Object.values(userFilters) ?? []
     )
   );
-  const { getToken } = (0, import_react37.useContext)(FetchContext);
-  const { customFilterDispatch } = (0, import_react37.useContext)(DashboardFiltersContext);
-  const { eventTracking } = (0, import_react37.useContext)(EventTrackingContext);
-  const metrics = (0, import_react37.useMemo)(() => {
+  const { getToken } = (0, import_react38.useContext)(FetchContext);
+  const { customFilterDispatch } = (0, import_react38.useContext)(DashboardFiltersContext);
+  const { eventTracking } = (0, import_react38.useContext)(EventTrackingContext);
+  const metrics = (0, import_react38.useMemo)(() => {
     const map = {};
     Object.keys(data?.sections ?? {}).forEach((section) => {
       if (!data?.sections?.[section]) return;
@@ -37667,7 +37808,7 @@ function Dashboard({
     });
     return map;
   }, [data?.sections, data?.sectionOrder]);
-  const charts = (0, import_react37.useMemo)(() => {
+  const charts = (0, import_react38.useMemo)(() => {
     const map = {};
     Object.keys(data?.sections ?? {}).forEach((section) => {
       if (!data?.sections?.[section]) return;
@@ -37693,7 +37834,7 @@ function Dashboard({
     });
     return map;
   }, [data?.sections, data?.sectionOrder]);
-  const tables = (0, import_react37.useMemo)(() => {
+  const tables = (0, import_react38.useMemo)(() => {
     const map = {};
     Object.keys(data?.sections ?? {}).forEach((section) => {
       if (!data?.sections?.[section]) return;
@@ -37719,8 +37860,8 @@ function Dashboard({
     });
     return map;
   }, [data?.sections, data?.sectionOrder]);
-  const mounted = (0, import_react37.useRef)(false);
-  (0, import_react37.useEffect)(() => {
+  const mounted = (0, import_react38.useRef)(false);
+  (0, import_react38.useEffect)(() => {
     if (!mounted.current) {
       mounted.current = true;
       return;
@@ -37732,53 +37873,53 @@ function Dashboard({
       filters: populatedDashboardFilters ?? []
     });
   }, [filters, userFilters]);
-  (0, import_react37.useEffect)(() => {
+  (0, import_react38.useEffect)(() => {
     customFilterDispatch({
       type: "ADD_CUSTOM_DASHBOARD_FILTERS",
       dashboardName: name2,
       data: dataLoaderUserFilters
     });
   }, [dataLoaderUserFilters]);
-  const [client, isClientLoading] = (0, import_react37.useContext)(ClientContext);
-  const { tenants, flags } = (0, import_react37.useContext)(TenantContext);
-  const [theme] = (0, import_react37.useContext)(ThemeContext);
-  const [schemaData] = (0, import_react37.useContext)(SchemaDataContext);
-  const { dispatch: dashboardFiltersDispatch } = (0, import_react37.useContext)(
+  const [client, isClientLoading] = (0, import_react38.useContext)(ClientContext);
+  const { tenants, flags } = (0, import_react38.useContext)(TenantContext);
+  const [theme] = (0, import_react38.useContext)(ThemeContext);
+  const [schemaData] = (0, import_react38.useContext)(SchemaDataContext);
+  const { dispatch: dashboardFiltersDispatch } = (0, import_react38.useContext)(
     DashboardFiltersContext
   );
-  const [fieldValuesMap, setFieldValuesMap] = (0, import_react37.useState)({});
-  const [fieldValuesIsLoaded, setFieldValuesIsLoaded] = (0, import_react37.useState)(false);
-  const [addFilterPopoverIsOpen, setAddFilterPopoverIsOpen] = (0, import_react37.useState)(false);
-  const [filterListIsOpen, setFilterListIsOpen] = (0, import_react37.useState)(false);
+  const [fieldValuesMap, setFieldValuesMap] = (0, import_react38.useState)({});
+  const [fieldValuesIsLoaded, setFieldValuesIsLoaded] = (0, import_react38.useState)(false);
+  const [addFilterPopoverIsOpen, setAddFilterPopoverIsOpen] = (0, import_react38.useState)(false);
+  const [filterListIsOpen, setFilterListIsOpen] = (0, import_react38.useState)(false);
   const [
     filterListAddFilterPopoverIsOpen,
     setFilterListAddFilterPopoverIsOpen
-  ] = (0, import_react37.useState)(false);
-  const presetOptions = (0, import_react37.useMemo)(() => {
+  ] = (0, import_react38.useState)(false);
+  const presetOptions = (0, import_react38.useMemo)(() => {
     return populatedDashboardFilters?.[0]?.filterType === "date_range" ? convertPresetOptionsToSelectableList(
       populatedDashboardFilters[0].presetOptions ?? [],
       populatedDashboardFilters[0].defaultPresetRanges ?? []
     ) : defaultOptionsV2;
   }, [populatedDashboardFilters]);
-  const [filterValues, setFilterValues] = (0, import_react37.useState)({});
-  const prevNameRef = (0, import_react37.useRef)(name2);
-  const prevFlagsRef = (0, import_react37.useRef)(flags);
-  const prevClientRef = (0, import_react37.useRef)(client?.publicKey ?? "");
-  const addFilterPopoverButtonRef = (0, import_react37.useRef)(null);
-  const viewFiltersPopoverButtonRef = (0, import_react37.useRef)(null);
-  const previousFilters = (0, import_react37.useRef)(filters);
+  const [filterValues, setFilterValues] = (0, import_react38.useState)({});
+  const prevNameRef = (0, import_react38.useRef)(name2);
+  const prevFlagsRef = (0, import_react38.useRef)(flags);
+  const prevClientRef = (0, import_react38.useRef)(client?.publicKey ?? "");
+  const addFilterPopoverButtonRef = (0, import_react38.useRef)(null);
+  const viewFiltersPopoverButtonRef = (0, import_react38.useRef)(null);
+  const previousFilters = (0, import_react38.useRef)(filters);
   if (!(0, import_fast_deep_equal4.default)(previousFilters.current, filters)) {
     previousFilters.current = filters;
   }
-  const isInitialLoadOfDashboardRef = (0, import_react37.useRef)(false);
-  const referencedTables = (0, import_react37.useMemo)(() => {
+  const isInitialLoadOfDashboardRef = (0, import_react38.useRef)(false);
+  const referencedTables = (0, import_react38.useMemo)(() => {
     const sections = data?.sections || {};
     const tables2 = Object.values(sections).flatMap(
       (section) => section.map((chart) => chart.referencedTables)
     ).flat();
     return Array.from(new Set(tables2));
   }, [data?.sections]);
-  (0, import_react37.useEffect)(() => {
+  (0, import_react38.useEffect)(() => {
     if (prevNameRef.current === name2 && Object.values(data?.sections ?? {}).flat().length) {
       return;
     }
@@ -37798,8 +37939,8 @@ function Dashboard({
       prevFlagsRef.current = flags;
     });
   }, [name2, isClientLoading]);
-  const tenantMounted = (0, import_react37.useRef)(false);
-  (0, import_react37.useEffect)(() => {
+  const tenantMounted = (0, import_react38.useRef)(false);
+  (0, import_react38.useEffect)(() => {
     if (!tenantMounted.current) {
       tenantMounted.current = true;
       return;
@@ -37818,7 +37959,7 @@ function Dashboard({
       isInitialLoadOfDashboardRef.current = false;
     });
   }, [flags]);
-  (0, import_react37.useEffect)(() => {
+  (0, import_react38.useEffect)(() => {
     if (prevClientRef.current === client?.publicKey) {
       return;
     }
@@ -37833,7 +37974,7 @@ function Dashboard({
       isInitialLoadOfDashboardRef.current = false;
     });
   }, [client?.publicKey]);
-  (0, import_react37.useEffect)(() => {
+  (0, import_react38.useEffect)(() => {
     setFilterValues(
       Object.values(populatedDashboardFilters ?? {}).reduce((acc, f) => {
         acc[f.label] = f.filterType === "string" ? f.stringFilterType === "multiselect" ? { values: f.values, operator: "IN" } : { selectedValue: f.selectedValue } : f.filterType === "date_range" ? {
@@ -37848,7 +37989,7 @@ function Dashboard({
       }, {})
     );
   }, [populatedDashboardFilters]);
-  (0, import_react37.useEffect)(() => {
+  (0, import_react38.useEffect)(() => {
     const dashboardDateFilter = populatedDashboardFilters?.find(
       (f) => f.filterType === "date_range"
     );
@@ -37885,7 +38026,7 @@ function Dashboard({
       });
     }
   }, [previousFilters.current]);
-  (0, import_react37.useEffect)(() => {
+  (0, import_react38.useEffect)(() => {
     const fetchData = async () => {
       setFieldValuesIsLoaded(false);
       const newFieldValues = {};
@@ -38046,7 +38187,7 @@ function Dashboard({
       [filter.field]: filter
     }));
   };
-  (0, import_react37.useEffect)(() => {
+  (0, import_react38.useEffect)(() => {
     if (onChangeLoading && isLoading) {
       onChangeLoading(isLoading);
     }
@@ -38686,15 +38827,15 @@ function QuillDashboardTemplate({
   ButtonComponent
 }) {
   const { isLoading, data } = useDashboardInternal(name2 ?? "");
-  const { getToken } = (0, import_react37.useContext)(FetchContext);
-  const { eventTracking } = (0, import_react37.useContext)(EventTrackingContext);
-  const { dashboardConfig, dashboardConfigDispatch } = (0, import_react37.useContext)(
+  const { getToken } = (0, import_react38.useContext)(FetchContext);
+  const { eventTracking } = (0, import_react38.useContext)(EventTrackingContext);
+  const { dashboardConfig, dashboardConfigDispatch } = (0, import_react38.useContext)(
     DashboardConfigContext
   );
-  const [addItemModalIsOpen, setAddItemModalIsOpen] = (0, import_react37.useState)(false);
-  const [selectedTemplates, setSelectedTemplates] = (0, import_react37.useState)([]);
-  const [selectingTemplate, setSelectingTemplate] = (0, import_react37.useState)(false);
-  const [submittingTemplate, setSubmittingTemplate] = (0, import_react37.useState)(false);
+  const [addItemModalIsOpen, setAddItemModalIsOpen] = (0, import_react38.useState)(false);
+  const [selectedTemplates, setSelectedTemplates] = (0, import_react38.useState)([]);
+  const [selectingTemplate, setSelectingTemplate] = (0, import_react38.useState)(false);
+  const [submittingTemplate, setSubmittingTemplate] = (0, import_react38.useState)(false);
   const templateSections = data?.sections;
   const onSubmitTemplates = async () => {
     setSubmittingTemplate(true);
@@ -38837,7 +38978,7 @@ var QuillProvider = ({
 var QuillProvider_default = QuillProvider;
 
 // src/Table.tsx
-var import_react38 = require("react");
+var import_react39 = require("react");
 init_Filter();
 init_paginationProcessing();
 var import_jsx_runtime59 = require("react/jsx-runtime");
@@ -38846,26 +38987,26 @@ var Table = ({
   ...props
 }) => {
   const data = props;
-  const [dashboard] = (0, import_react38.useContext)(DashboardContext);
-  const { dashboardFilters, dashboardCustomFilters } = (0, import_react38.useContext)(
+  const [dashboard] = (0, import_react39.useContext)(DashboardContext);
+  const { dashboardFilters, dashboardCustomFilters } = (0, import_react39.useContext)(
     DashboardFiltersContext
   );
-  const [client, clientLoading] = (0, import_react38.useContext)(ClientContext);
-  const [schemaData] = (0, import_react38.useContext)(SchemaDataContext);
-  const { eventTracking } = (0, import_react38.useContext)(EventTrackingContext);
+  const [client, clientLoading] = (0, import_react39.useContext)(ClientContext);
+  const [schemaData] = (0, import_react39.useContext)(SchemaDataContext);
+  const { eventTracking } = (0, import_react39.useContext)(EventTrackingContext);
   const { allReportsById } = useAllReports();
-  const [loading, setLoading] = (0, import_react38.useState)(false);
-  const report = (0, import_react38.useMemo)(() => {
+  const [loading, setLoading] = (0, import_react39.useState)(false);
+  const report = (0, import_react39.useMemo)(() => {
     return props.reportId ? allReportsById[props.reportId] : null;
   }, [allReportsById[props.reportId ?? ""]]);
-  const { reportFilters, customReportFilters, reportFiltersDispatch } = (0, import_react38.useContext)(ReportFiltersContext);
-  const { reports, fetchIndividualReport, reportsDispatch } = (0, import_react38.useContext)(ReportsContext);
-  const specificReportFilters = (0, import_react38.useMemo)(() => {
+  const { reportFilters, customReportFilters, reportFiltersDispatch } = (0, import_react39.useContext)(ReportFiltersContext);
+  const { reports, fetchIndividualReport, reportsDispatch } = (0, import_react39.useContext)(ReportsContext);
+  const specificReportFilters = (0, import_react39.useMemo)(() => {
     return Object.values(
       reportFilters[props.reportId ?? ""] ?? (dashboard[report?.dashboardName ?? ""]?.[report?.id ?? ""] ? dashboardFilters[report.dashboardName] : null) ?? {}
     ).map((f) => f.filter);
   }, [reportFilters[props.reportId ?? ""]]);
-  const userFilters = (0, import_react38.useMemo)(() => {
+  const userFilters = (0, import_react39.useMemo)(() => {
     return (props.filters?.filter((f) => f.filterType !== "date" /* Date */)?.map(convertCustomFilter) ?? []).concat(
       customReportFilters[props.reportId ?? ""] ?? dashboardCustomFilters[report?.dashboardName ?? ""] ?? []
     );
@@ -38907,7 +39048,7 @@ var Table = ({
       setLoading(false);
     }
   };
-  (0, import_react38.useEffect)(() => {
+  (0, import_react39.useEffect)(() => {
     if (props.reportId === void 0 || props.reportId === "" || clientLoading) {
       return;
     }
@@ -38941,7 +39082,7 @@ var Table = ({
     clientLoading,
     !reports[props.reportId ?? ""]
   ]);
-  const [page, setPage] = (0, import_react38.useState)(0);
+  const [page, setPage] = (0, import_react39.useState)(0);
   if ("rows" in data && "columns" in data) {
     return /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(
       QuillTable,
@@ -39001,27 +39142,27 @@ var Table = ({
 var Table_default = Table;
 
 // src/SQLEditor.tsx
-var import_react45 = require("react");
-var import_react46 = __toESM(require("@monaco-editor/react"), 1);
+var import_react46 = require("react");
+var import_react47 = __toESM(require("@monaco-editor/react"), 1);
 
 // src/ChartBuilder.tsx
-var import_react43 = require("react");
+var import_react44 = require("react");
 var import_core = require("@dnd-kit/core");
 var import_sortable = require("@dnd-kit/sortable");
 var import_utilities = require("@dnd-kit/utilities");
 
 // src/internals/ReportBuilder/PivotModal.tsx
-var import_react40 = require("react");
+var import_react41 = require("react");
 
 // src/internals/ReportBuilder/PivotList.tsx
 init_valueFormatter();
 init_textProcessing();
 
 // src/components/QuillCard.tsx
-var import_react39 = require("react");
+var import_react40 = require("react");
 var import_jsx_runtime60 = require("react/jsx-runtime");
 function QuillCard({ children, onClick, onDelete }) {
-  const [theme] = (0, import_react39.useContext)(ThemeContext);
+  const [theme] = (0, import_react40.useContext)(ThemeContext);
   return /* @__PURE__ */ (0, import_jsx_runtime60.jsxs)(
     "div",
     {
@@ -39465,45 +39606,45 @@ var PivotModal = ({
   heightAdjustment = 0,
   reportBuilderState
 }) => {
-  const { getToken, quillFetchWithToken } = (0, import_react40.useContext)(FetchContext);
-  const [isLoading, setIsLoading] = (0, import_react40.useState)(false);
-  const [previewLoading, setPreviewLoading] = (0, import_react40.useState)(false);
-  const [selectedPivotType, setSelectedPivotType] = (0, import_react40.useState)("recommended");
-  const [errors, setErrors] = (0, import_react40.useState)([]);
-  const [client] = (0, import_react40.useContext)(ClientContext);
-  const [schemaData] = (0, import_react40.useContext)(SchemaDataContext);
-  const { tenants } = (0, import_react40.useContext)(TenantContext);
-  const { eventTracking } = (0, import_react40.useContext)(EventTrackingContext);
-  const rowFieldRef = (0, import_react40.useRef)(null);
-  const colFieldRef = (0, import_react40.useRef)(null);
-  const [pivotCardWidth, setPivotCardWidth] = (0, import_react40.useState)(420);
-  const [samplePivotTable, setSamplePivotTable] = (0, import_react40.useState)(null);
-  const [hasNoRecommendedPivots, sethasNoRecommendedPivots] = (0, import_react40.useState)(false);
-  const [isFetchingPivots, setIsFetchingPivots] = (0, import_react40.useState)(false);
-  const [allowedColumnFields, setAllowedColumnFields] = (0, import_react40.useState)([]);
-  const [allowedRowFields, setAllowedRowFields] = (0, import_react40.useState)([]);
-  const [allowedValueFields, setAllowedValueFields] = (0, import_react40.useState)([]);
-  const [uniqueValues, setUniqueValues] = (0, import_react40.useState)(initialUniqueValues);
-  const buttonRef = (0, import_react40.useRef)(null);
-  const [dateRanges, setDateRanges] = (0, import_react40.useState)({});
-  const [pivotError, setPivotError] = (0, import_react40.useState)("");
-  const [limitInput, setLimitInput] = (0, import_react40.useState)(
+  const { getToken, quillFetchWithToken } = (0, import_react41.useContext)(FetchContext);
+  const [isLoading, setIsLoading] = (0, import_react41.useState)(false);
+  const [previewLoading, setPreviewLoading] = (0, import_react41.useState)(false);
+  const [selectedPivotType, setSelectedPivotType] = (0, import_react41.useState)("recommended");
+  const [errors, setErrors] = (0, import_react41.useState)([]);
+  const [client] = (0, import_react41.useContext)(ClientContext);
+  const [schemaData] = (0, import_react41.useContext)(SchemaDataContext);
+  const { tenants } = (0, import_react41.useContext)(TenantContext);
+  const { eventTracking } = (0, import_react41.useContext)(EventTrackingContext);
+  const rowFieldRef = (0, import_react41.useRef)(null);
+  const colFieldRef = (0, import_react41.useRef)(null);
+  const [pivotCardWidth, setPivotCardWidth] = (0, import_react41.useState)(420);
+  const [samplePivotTable, setSamplePivotTable] = (0, import_react41.useState)(null);
+  const [hasNoRecommendedPivots, sethasNoRecommendedPivots] = (0, import_react41.useState)(false);
+  const [isFetchingPivots, setIsFetchingPivots] = (0, import_react41.useState)(false);
+  const [allowedColumnFields, setAllowedColumnFields] = (0, import_react41.useState)([]);
+  const [allowedRowFields, setAllowedRowFields] = (0, import_react41.useState)([]);
+  const [allowedValueFields, setAllowedValueFields] = (0, import_react41.useState)([]);
+  const [uniqueValues, setUniqueValues] = (0, import_react41.useState)(initialUniqueValues);
+  const buttonRef = (0, import_react41.useRef)(null);
+  const [dateRanges, setDateRanges] = (0, import_react41.useState)({});
+  const [pivotError, setPivotError] = (0, import_react41.useState)("");
+  const [limitInput, setLimitInput] = (0, import_react41.useState)(
     pivotLimit?.toString() ?? "100"
   );
-  const [sortFieldInput, setSortFieldInput] = (0, import_react40.useState)(
+  const [sortFieldInput, setSortFieldInput] = (0, import_react41.useState)(
     pivotSort?.sortField ?? ""
   );
-  const [sortDirectionInput, setSortDirectionInput] = (0, import_react40.useState)(
+  const [sortDirectionInput, setSortDirectionInput] = (0, import_react41.useState)(
     pivotSort?.sortDirection ?? "ASC"
   );
-  const [showLimitInput, setShowLimitInput] = (0, import_react40.useState)(!!pivotLimit);
-  const [showSortInput, setShowSortInput] = (0, import_react40.useState)(!!pivotSort);
-  const [availableHeight, setAvailableHeight] = (0, import_react40.useState)(0);
-  const [pivotModalTopHeight, setPivotModalTopHeight] = (0, import_react40.useState)(450);
-  const [popoverPosition, setPopoverPosition] = (0, import_react40.useState)(
+  const [showLimitInput, setShowLimitInput] = (0, import_react41.useState)(!!pivotLimit);
+  const [showSortInput, setShowSortInput] = (0, import_react41.useState)(!!pivotSort);
+  const [availableHeight, setAvailableHeight] = (0, import_react41.useState)(0);
+  const [pivotModalTopHeight, setPivotModalTopHeight] = (0, import_react41.useState)(450);
+  const [popoverPosition, setPopoverPosition] = (0, import_react41.useState)(
     "bottom"
   );
-  const popoverRef = (0, import_react40.useRef)(null);
+  const popoverRef = (0, import_react41.useRef)(null);
   const getDistinctValues = async (fetchDistinct) => {
     if (!client) {
       return {
@@ -39590,7 +39731,7 @@ var PivotModal = ({
       setDateRanges(dateRangeByColumn || {});
     }
   };
-  (0, import_react40.useEffect)(() => {
+  (0, import_react41.useEffect)(() => {
     const calculatePivotCardSize = () => {
       if (rowFieldRef.current && colFieldRef.current) {
         const rowFieldSize = rowFieldRef.current?.getBoundingClientRect();
@@ -39611,7 +39752,7 @@ var PivotModal = ({
       }, 500);
     }
   }, [showUpdatePivot, isOpen]);
-  (0, import_react40.useEffect)(() => {
+  (0, import_react41.useEffect)(() => {
     const fetchPivotData = async () => {
       if (pivotRowField && data && columns && pivotAggregations?.every((p) => p?.valueField && p?.aggregationType)) {
         const pivot = {
@@ -39757,7 +39898,7 @@ var PivotModal = ({
     };
     fetchPivotData();
   }, [initialSelectedPivotTable]);
-  (0, import_react40.useEffect)(() => {
+  (0, import_react41.useEffect)(() => {
     if (pivotRowField && data && columns) {
       getDistinctValues();
       getAllDateRangesByColumn();
@@ -39765,7 +39906,7 @@ var PivotModal = ({
       getDistinctValues();
     }
   }, [initialSelectedPivotTable, columns, data, pivotRowField]);
-  (0, import_react40.useEffect)(() => {
+  (0, import_react41.useEffect)(() => {
     setAllowedFields(initialUniqueValues || {});
     setUniqueValues(initialUniqueValues);
   }, [initialUniqueValues, columns]);
@@ -39776,20 +39917,20 @@ var PivotModal = ({
     setAllowedValueFields(possibleColumns.valueFields);
     return possibleColumns;
   };
-  const columnsToShow = (0, import_react40.useMemo)(() => {
+  const columnsToShow = (0, import_react41.useMemo)(() => {
     return (columns || []).reduce((map, col) => {
       map[col.field] = col.format;
       return map;
     }, {});
   }, [columns]);
-  const columnTypes = (0, import_react40.useMemo)(() => {
+  const columnTypes = (0, import_react41.useMemo)(() => {
     return (columns || []).reduce((map, col) => {
       map[col.field] = col.jsType;
       return map;
     }, {});
   }, [columns]);
-  const [selectedPivotTable, setSelectedPivotTable] = (0, import_react40.useState)(null);
-  (0, import_react40.useEffect)(() => {
+  const [selectedPivotTable, setSelectedPivotTable] = (0, import_react41.useState)(null);
+  (0, import_react41.useEffect)(() => {
     const fetchPivotTables = async () => {
       if (selectedPivotIndex === -1) {
         return null;
@@ -39841,8 +39982,8 @@ var PivotModal = ({
     };
     fetchPivotTables();
   }, [selectedPivotIndex, data, dateRange, createdPivots]);
-  const previousUniqueValuesRef = (0, import_react40.useRef)();
-  (0, import_react40.useEffect)(() => {
+  const previousUniqueValuesRef = (0, import_react41.useRef)();
+  (0, import_react41.useEffect)(() => {
     if (!uniqueValuesIsLoading && !(0, import_fast_deep_equal5.default)(uniqueValues, previousUniqueValuesRef.current)) {
       previousUniqueValuesRef.current = uniqueValues;
       setRecommendedPivotTables([]);
@@ -39879,7 +40020,7 @@ var PivotModal = ({
     setIsOpen(false);
     setPopUpTitle("Add pivot");
   };
-  const onCommitPivot = (0, import_react40.useCallback)(() => {
+  const onCommitPivot = (0, import_react41.useCallback)(() => {
     const errors2 = [];
     if ((pivotAggregations?.length ?? 0) === 0) {
       errors2.push("You must have at least one aggregation");
@@ -40021,7 +40162,7 @@ var PivotModal = ({
   const onEditRecommendedPivot = (pivot) => {
     onEditPivot(pivot, null);
   };
-  const refreshPivots = (0, import_react40.useCallback)(async () => {
+  const refreshPivots = (0, import_react41.useCallback)(async () => {
     if (!client) {
       return;
     }
@@ -40317,11 +40458,11 @@ var PivotModal = ({
       }
     }, 500);
   };
-  const [recommendedPivotTables, setRecommendedPivotTables] = (0, import_react40.useState)(
+  const [recommendedPivotTables, setRecommendedPivotTables] = (0, import_react41.useState)(
     []
   );
-  const [createdPivotTables, setCreatedPivotTables] = (0, import_react40.useState)([]);
-  (0, import_react40.useEffect)(() => {
+  const [createdPivotTables, setCreatedPivotTables] = (0, import_react41.useState)([]);
+  (0, import_react41.useEffect)(() => {
     const fetchPivotTables = async () => {
       const pts = await Promise.all(
         createdPivots.map(async (p) => {
@@ -40394,7 +40535,7 @@ var PivotModal = ({
       setPopoverPosition("bottom");
     }
   };
-  (0, import_react40.useEffect)(() => {
+  (0, import_react41.useEffect)(() => {
     handleResize();
     window.addEventListener("resize", handleResize);
     const parentElement = parentRef?.current;
@@ -41219,7 +41360,7 @@ var validateReport = (formData, dashboardData, defaultDateFilter, allTables) =>
 };
 
 // src/components/Chart/InternalChart.tsx
-var import_react41 = require("react");
+var import_react42 = require("react");
 var import_date_fns15 = require("date-fns");
 init_Filter();
 init_filterProcessing();
@@ -41333,10 +41474,10 @@ function InternalChart({
   filterToggleDisabled,
   layoutChanged
 }) {
-  const { reportFilters } = (0, import_react41.useContext)(ReportFiltersContext);
-  const { dashboardConfig } = (0, import_react41.useContext)(DashboardConfigContext);
-  const { eventTracking } = (0, import_react41.useContext)(EventTrackingContext);
-  const currentReportFilters = (0, import_react41.useMemo)(() => {
+  const { reportFilters } = (0, import_react42.useContext)(ReportFiltersContext);
+  const { dashboardConfig } = (0, import_react42.useContext)(DashboardConfigContext);
+  const { eventTracking } = (0, import_react42.useContext)(EventTrackingContext);
+  const currentReportFilters = (0, import_react42.useMemo)(() => {
     const dashFilters = dashboardConfig[report?.dashboardName ?? ""]?.config.filters;
     if (!dashFilters)
       return Object.values(reportFilters[report?.id ?? TEMP_REPORT_ID] ?? {});
@@ -41352,19 +41493,19 @@ function InternalChart({
       }
     });
   }, [reportFilters, report?.id]);
-  const reportDateFilter = (0, import_react41.useMemo)(() => {
+  const reportDateFilter = (0, import_react42.useMemo)(() => {
     return Object.values(
       reportFilters[report?.id ?? TEMP_REPORT_ID] ?? {}
     ).find((f) => f.filter.filterType === "date_range")?.filter;
   }, [reportFilters, report?.id]);
-  const presetOptions = (0, import_react41.useMemo)(() => {
+  const presetOptions = (0, import_react42.useMemo)(() => {
     return reportDateFilter ? convertPresetOptionsToSelectableList(
       reportDateFilter.presetOptions ?? [],
       reportDateFilter.defaultPresetRanges ?? []
     ) : defaultOptionsV2;
   }, [reportDateFilter]);
-  const [filterValues, setFilterValues] = (0, import_react41.useState)({});
-  (0, import_react41.useEffect)(() => {
+  const [filterValues, setFilterValues] = (0, import_react42.useState)({});
+  (0, import_react42.useEffect)(() => {
     if (reportDateFilter) {
       const customDateFilter = filters?.find(
         (f) => f.filterType === "date" /* Date */
@@ -41389,8 +41530,8 @@ function InternalChart({
       }));
     }
   }, [filters]);
-  const [theme] = (0, import_react41.useContext)(ThemeContext);
-  const colorMap = (0, import_react41.useMemo)(() => {
+  const [theme] = (0, import_react42.useContext)(ThemeContext);
+  const colorMap = (0, import_react42.useMemo)(() => {
     if (mapColorsToFields && report && theme) {
       return mapColorsToFields(report, theme);
     }
@@ -41472,10 +41613,10 @@ function InternalChart({
     }));
     onDashboardFilterChange(filter.label, filterValue);
   };
-  const [filtersExpanded, setFiltersExpanded] = (0, import_react41.useState)(false);
-  const filtersContainerRef = (0, import_react41.useRef)(null);
-  const [visibleFilters, setVisibleFilters] = (0, import_react41.useState)([]);
-  const filtersOverflowing = (0, import_react41.useMemo)(() => {
+  const [filtersExpanded, setFiltersExpanded] = (0, import_react42.useState)(false);
+  const filtersContainerRef = (0, import_react42.useRef)(null);
+  const [visibleFilters, setVisibleFilters] = (0, import_react42.useState)([]);
+  const filtersOverflowing = (0, import_react42.useMemo)(() => {
     return visibleFilters.some((visible) => visible);
   }, [visibleFilters]);
   const measureItems = () => {
@@ -41490,7 +41631,7 @@ function InternalChart({
     });
     setVisibleFilters(newVisibleItems);
   };
-  (0, import_react41.useLayoutEffect)(() => {
+  (0, import_react42.useLayoutEffect)(() => {
     requestAnimationFrame(() => measureItems());
     const handleResize = () => {
       measureItems();
@@ -41769,7 +41910,7 @@ init_dataFetcher();
 init_dates();
 
 // src/components/QuillMultiSelectSectionList.tsx
-var import_react42 = __toESM(require("react"), 1);
+var import_react43 = __toESM(require("react"), 1);
 var import_jsx_runtime64 = require("react/jsx-runtime");
 function QuillMultiSelectSectionList({
   options,
@@ -41785,12 +41926,12 @@ function QuillMultiSelectSectionList({
   style: style2,
   owner
 }) {
-  const [theme] = (0, import_react42.useContext)(ThemeContext);
-  const [showModal, setShowModal] = (0, import_react42.useState)(false);
-  const modalRef = (0, import_react42.useRef)(null);
-  const buttonRef = (0, import_react42.useRef)(null);
-  const debounceTimeoutId = (0, import_react42.useRef)(null);
-  const [searchQuery, setSearchQuery] = import_react42.default.useState("");
+  const [theme] = (0, import_react43.useContext)(ThemeContext);
+  const [showModal, setShowModal] = (0, import_react43.useState)(false);
+  const modalRef = (0, import_react43.useRef)(null);
+  const buttonRef = (0, import_react43.useRef)(null);
+  const debounceTimeoutId = (0, import_react43.useRef)(null);
+  const [searchQuery, setSearchQuery] = import_react43.default.useState("");
   useOnClickOutside_default(
     modalRef,
     (event) => {
@@ -41807,10 +41948,10 @@ function QuillMultiSelectSectionList({
       onChange(updatedChangeEvent);
     }, 200);
   };
-  const optionsLength = import_react42.default.useMemo(() => {
+  const optionsLength = import_react43.default.useMemo(() => {
     return Object.values(options).reduce((a, b) => a + b.length, 0);
   }, [options]);
-  const filteredItems = import_react42.default.useMemo(() => {
+  const filteredItems = import_react43.default.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 sample = Object.values(options).find((arr) => arr.length > 0)?.[0];
     if (!sample) {
@@ -41837,10 +41978,10 @@ function QuillMultiSelectSectionList({
       Object.entries(filteredOptions).filter(([, value2]) => !!value2?.length).sort(([key]) => key === owner ? -1 : 1)
     );
   }, [options, searchQuery]);
-  const filteredLength = import_react42.default.useMemo(() => {
+  const filteredLength = import_react43.default.useMemo(() => {
     return Object.values(filteredItems).reduce((a, b) => a + b.length, 0);
   }, [filteredItems]);
-  const selectedOptionsLabel = (0, import_react42.useMemo)(() => {
+  const selectedOptionsLabel = (0, import_react43.useMemo)(() => {
     const valuesLength = Object.values(value).reduce((a, b) => a + b.length, 0);
     if (!valuesLength) {
       return "Select";
@@ -42222,7 +42363,7 @@ var ListboxTextInput2 = ({
   onChange,
   placeholder
 }) => {
-  const [theme] = (0, import_react42.useContext)(ThemeContext);
+  const [theme] = (0, import_react43.useContext)(ThemeContext);
   return /* @__PURE__ */ (0, import_jsx_runtime64.jsxs)(
     "div",
     {
@@ -42571,18 +42712,18 @@ function createReportFromForm(formData, report, eventTracking, selectedPivotTabl
   return newReport;
 }
 function ChartBuilderWithModal(props) {
-  const parentRef = (0, import_react43.useRef)(null);
-  const [modalWidth, setModalWidth] = (0, import_react43.useState)(200);
-  const [modalHeight, setModalHeight] = (0, import_react43.useState)(200);
+  const parentRef = (0, import_react44.useRef)(null);
+  const [modalWidth, setModalWidth] = (0, import_react44.useState)(200);
+  const [modalHeight, setModalHeight] = (0, import_react44.useState)(200);
   const { isOpen, setIsOpen, title, isHorizontalView } = props;
   const Modal = props.ModalComponent ?? MemoizedModal;
   const { dashboardReports: dashboard } = useDashboardReports(
     props.destinationDashboard
   );
-  const [filtersEnabledState, setFiltersEnabledState] = (0, import_react43.useState)(
+  const [filtersEnabledState, setFiltersEnabledState] = (0, import_react44.useState)(
     !!props.reportId
   );
-  (0, import_react43.useEffect)(() => {
+  (0, import_react44.useEffect)(() => {
     function handleResize() {
       const screenSize = window.innerWidth;
       if (screenSize >= 1200) {
@@ -42687,33 +42828,33 @@ function ChartBuilder({
   disableSort = true,
   runQueryOnMount = false
 }) {
-  const [client] = (0, import_react43.useContext)(ClientContext);
-  const [theme] = (0, import_react43.useContext)(ThemeContext);
-  const [schemaData] = (0, import_react43.useContext)(SchemaDataContext);
-  const { getToken, quillFetchWithToken } = (0, import_react43.useContext)(FetchContext);
-  const { eventTracking } = (0, import_react43.useContext)(EventTrackingContext);
+  const [client] = (0, import_react44.useContext)(ClientContext);
+  const [theme] = (0, import_react44.useContext)(ThemeContext);
+  const [schemaData] = (0, import_react44.useContext)(SchemaDataContext);
+  const { getToken, quillFetchWithToken } = (0, import_react44.useContext)(FetchContext);
+  const { eventTracking } = (0, import_react44.useContext)(EventTrackingContext);
   const { addReport } = useDashboardReports(destinationDashboard);
   const { reload: reloadDashboard } = useDashboardInternal(destinationDashboard);
   const { allReportsById } = useAllReports();
-  const { dashboardConfig } = (0, import_react43.useContext)(DashboardConfigContext);
-  const { tenants, flags } = (0, import_react43.useContext)(TenantContext);
-  const report = (0, import_react43.useMemo)(() => {
+  const { dashboardConfig } = (0, import_react44.useContext)(DashboardConfigContext);
+  const { tenants, flags } = (0, import_react44.useContext)(TenantContext);
+  const report = (0, import_react44.useMemo)(() => {
     const resolvedReport = reportId && !tempReport ? allReportsById[reportId] : tempReport;
     return resolvedReport;
   }, [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);
-  const [rowCount, setRowCount] = (0, import_react43.useState)(report?.rowCount ?? 0);
-  const [maxPage, setMaxPage] = (0, import_react43.useState)(0);
-  const [isLoading, setIsLoading] = (0, import_react43.useState)(false);
-  const [rowCountIsLoading, setRowCountIsLoading] = (0, import_react43.useState)(false);
-  const [isSubmitting, setIsSubmitting] = (0, import_react43.useState)(false);
-  const MIN_FORM_WIDTH = 710;
-  const [pivotCardWidth, setPivotCardWidth] = (0, import_react43.useState)(MIN_FORM_WIDTH);
-  const [formWidth, setFormWidth] = (0, import_react43.useState)(MIN_FORM_WIDTH);
-  const inputRef = (0, import_react43.useRef)(null);
-  const selectRef = (0, import_react43.useRef)(null);
+  const [windowWidth, setWindowWidth] = (0, import_react44.useState)(1200);
+  const [rows, setRows] = (0, import_react44.useState)(report?.rows ?? []);
+  const [itemQuery, setItemQuery] = (0, import_react44.useState)(report?.itemQuery);
+  const [rowCount, setRowCount] = (0, import_react44.useState)(report?.rowCount ?? 0);
+  const [maxPage, setMaxPage] = (0, import_react44.useState)(0);
+  const [isLoading, setIsLoading] = (0, import_react44.useState)(false);
+  const [rowCountIsLoading, setRowCountIsLoading] = (0, import_react44.useState)(false);
+  const [isSubmitting, setIsSubmitting] = (0, import_react44.useState)(false);
+  const MIN_FORM_WIDTH = 700;
+  const [pivotCardWidth, setPivotCardWidth] = (0, import_react44.useState)(MIN_FORM_WIDTH);
+  const [formWidth, setFormWidth] = (0, import_react44.useState)(MIN_FORM_WIDTH);
+  const inputRef = (0, import_react44.useRef)(null);
+  const selectRef = (0, import_react44.useRef)(null);
   const processColumns = (columns2) => {
     if (schemaData.schemaWithCustomFields) {
       const newProcessedColumns = columns2?.map((col) => {
@@ -42743,16 +42884,16 @@ function ChartBuilder({
     }
     return columns2;
   };
-  const [processedColumns, setProcessedColumns] = (0, import_react43.useState)(
+  const [processedColumns, setProcessedColumns] = (0, import_react44.useState)(
     processColumns(report?.columnInternal ?? [])
   );
-  const [currentPage, setCurrentPage] = (0, import_react43.useState)(0);
-  const parentRef = (0, import_react43.useRef)(null);
-  const deleteRef = (0, import_react43.useRef)(null);
+  const [currentPage, setCurrentPage] = (0, import_react44.useState)(0);
+  const parentRef = (0, import_react44.useRef)(null);
+  const deleteRef = (0, import_react44.useRef)(null);
   const modalPadding = 20;
   const deleteButtonMargin = -12;
-  const { dashboardFilters } = (0, import_react43.useContext)(DashboardFiltersContext);
-  const specificDashboardFilters = (0, import_react43.useMemo)(() => {
+  const { dashboardFilters } = (0, import_react44.useContext)(DashboardFiltersContext);
+  const specificDashboardFilters = (0, import_react44.useMemo)(() => {
     return Object.values(
       dashboardFilters[report?.dashboardName ?? ""] ?? {}
     ).map((f) => f.filter);
@@ -42770,7 +42911,7 @@ function ChartBuilder({
       setFilterIssues([]);
     }
   };
-  (0, import_react43.useEffect)(() => {
+  (0, import_react44.useEffect)(() => {
     const handleResize = () => {
       setWindowWidth(window.innerWidth);
       if (inputRef.current && selectRef.current) {
@@ -42793,17 +42934,17 @@ function ChartBuilder({
       window.removeEventListener("resize", handleResize);
     };
   }, [isOpen]);
-  const [dashboardOptions, setDashboardOptions] = (0, import_react43.useState)([]);
+  const [dashboardOptions, setDashboardOptions] = (0, import_react44.useState)([]);
   const {
     reportFilters,
     loadFiltersForReport,
     reportFiltersDispatch,
     abortLoadingFilters
-  } = (0, import_react43.useContext)(ReportFiltersContext);
-  const { reportsDispatch } = (0, import_react43.useContext)(ReportsContext);
-  const initialFilters = (0, import_react43.useRef)(reportFilters[report?.id ?? TEMP_REPORT_ID]);
-  const [reportFiltersLoaded, setReportFiltersLoaded] = (0, import_react43.useState)(!filtersEnabled);
-  (0, import_react43.useEffect)(() => {
+  } = (0, import_react44.useContext)(ReportFiltersContext);
+  const { reportsDispatch } = (0, import_react44.useContext)(ReportsContext);
+  const initialFilters = (0, import_react44.useRef)(reportFilters[report?.id ?? TEMP_REPORT_ID]);
+  const [reportFiltersLoaded, setReportFiltersLoaded] = (0, import_react44.useState)(!filtersEnabled);
+  (0, import_react44.useEffect)(() => {
     if (!reportFilters[report?.id ?? TEMP_REPORT_ID]) {
       loadFiltersForReport(
         report?.id ?? TEMP_REPORT_ID,
@@ -42831,25 +42972,25 @@ function ChartBuilder({
       }
     };
   }, []);
-  const currentDashboardFilters = (0, import_react43.useMemo)(() => {
+  const currentDashboardFilters = (0, import_react44.useMemo)(() => {
     return Object.values(reportFilters[report?.id ?? TEMP_REPORT_ID] ?? {}).map(
       (f) => f.filter
     );
   }, [reportFilters, report?.id]);
-  const [showFilterModal, setShowFilterModal] = (0, import_react43.useState)(false);
-  const [filterIssues, setFilterIssues] = (0, import_react43.useState)([]);
-  const [showPivotPopover, setShowPivotPopover] = (0, import_react43.useState)(false);
-  const [isEdittingPivot, setIsEdittingPivot] = (0, import_react43.useState)(false);
-  const [selectedPivotIndex, setSelectedPivotIndex] = (0, import_react43.useState)(-1);
-  const [tableName, setTableName] = (0, import_react43.useState)(void 0);
-  const [includeCustomFields, setIncludeCustomFields] = (0, import_react43.useState)(
+  const [showFilterModal, setShowFilterModal] = (0, import_react44.useState)(false);
+  const [filterIssues, setFilterIssues] = (0, import_react44.useState)([]);
+  const [showPivotPopover, setShowPivotPopover] = (0, import_react44.useState)(false);
+  const [isEdittingPivot, setIsEdittingPivot] = (0, import_react44.useState)(false);
+  const [selectedPivotIndex, setSelectedPivotIndex] = (0, import_react44.useState)(-1);
+  const [tableName, setTableName] = (0, import_react44.useState)(void 0);
+  const [includeCustomFields, setIncludeCustomFields] = (0, import_react44.useState)(
     report ? !!report.includeCustomFields : !!client?.featureFlags?.customFieldsEnabled
   );
   const selectedTable = schemaData.schema?.find(
     (t) => t.displayName === tableName
   );
-  const [pivotPopUpTitle, setPivotPopUpTitle] = (0, import_react43.useState)("Add pivot");
-  const [pivotError, setPivotError] = (0, import_react43.useState)(void 0);
+  const [pivotPopUpTitle, setPivotPopUpTitle] = (0, import_react44.useState)("Add pivot");
+  const [pivotError, setPivotError] = (0, import_react44.useState)(void 0);
   const pivotData = report?.pivotRows && report?.pivotColumns ? {
     rows: report.pivotRows,
     columns: report.pivotColumns,
@@ -42860,19 +43001,19 @@ function ChartBuilder({
   const columns = report?.columnInternal ?? [];
   const destinationDashboardName = report?.dashboardName || destinationDashboard;
   const query = report?.queryString;
-  const [loadingFormData, setLoadingFormData] = (0, import_react43.useState)(false);
-  const [triggeredEditChart, setTriggeredEditChart] = (0, import_react43.useState)(false);
-  const [createdPivots, setCreatedPivots] = (0, import_react43.useState)(
+  const [loadingFormData, setLoadingFormData] = (0, import_react44.useState)(false);
+  const [triggeredEditChart, setTriggeredEditChart] = (0, import_react44.useState)(false);
+  const [createdPivots, setCreatedPivots] = (0, import_react44.useState)(
     report?.pivot ? [report.pivot] : cp
   );
-  const [recommendedPivots, setRecommendedPivots] = (0, import_react43.useState)(rp);
-  const [pivotRowField, setPivotRowField] = (0, import_react43.useState)(
+  const [recommendedPivots, setRecommendedPivots] = (0, import_react44.useState)(rp);
+  const [pivotRowField, setPivotRowField] = (0, import_react44.useState)(
     report?.pivot?.rowField
   );
-  const [pivotColumnField, setPivotColumnField] = (0, import_react43.useState)(
+  const [pivotColumnField, setPivotColumnField] = (0, import_react44.useState)(
     report?.pivot?.columnField
   );
-  const [pivotAggregations, setPivotAggregations] = (0, import_react43.useState)(
+  const [pivotAggregations, setPivotAggregations] = (0, import_react44.useState)(
     report?.pivot?.aggregations ?? [
       {
         valueField: report?.pivot?.valueField,
@@ -42881,10 +43022,10 @@ function ChartBuilder({
       }
     ]
   );
-  const [pivotLimit, setPivotLimit] = (0, import_react43.useState)(
+  const [pivotLimit, setPivotLimit] = (0, import_react44.useState)(
     report?.pivot?.rowLimit
   );
-  const [pivotSort, setPivotSort] = (0, import_react43.useState)(
+  const [pivotSort, setPivotSort] = (0, import_react44.useState)(
     report?.pivot?.sort && report?.pivot?.sortDirection && report?.pivot?.sortField ? {
       sortField: report.pivot.sortField,
       sortDirection: report.pivot.sortDirection
@@ -42897,27 +43038,28 @@ function ChartBuilder({
       rowsPerRequest: report?.chartType === "table" ? 50 : 500
     }
   };
-  const [currentProcessing, setCurrentProcessing] = (0, import_react43.useState)(baseProcessing);
-  const [customTenantAccess, setCustomTenantAccess] = (0, import_react43.useState)(
+  const [currentProcessing, setCurrentProcessing] = (0, import_react44.useState)(baseProcessing);
+  const [customTenantAccess, setCustomTenantAccess] = (0, import_react44.useState)(
     report?.flags === null ? false : !!Object.values(report?.flags ?? {}).length
   );
-  const [dateFieldOptions, setDateFieldOptions] = (0, import_react43.useState)([]);
-  const [allTables, setAllTables] = (0, import_react43.useState)([]);
-  const [customFieldTableRef, setCustomFieldTableRef] = (0, import_react43.useState)(false);
-  const [referencedColumns, setReferencedColumns] = (0, import_react43.useState)({});
-  const [referencedColumnsWithoutStar, setReferencedColumnsWithoutStar] = (0, import_react43.useState)({});
-  const [filterMap, setFilterMap] = (0, import_react43.useState)(report?.filterMap ?? {});
-  const canonicalFilterMap = (0, import_react43.useMemo)(() => {
+  const [dateFieldOptions, setDateFieldOptions] = (0, import_react44.useState)([]);
+  const [allTables, setAllTables] = (0, import_react44.useState)([]);
+  const [customFieldTableRef, setCustomFieldTableRef] = (0, import_react44.useState)(false);
+  const [referencedColumns, setReferencedColumns] = (0, import_react44.useState)({});
+  const [referencedColumnsWithoutStar, setReferencedColumnsWithoutStar] = (0, import_react44.useState)({});
+  const [referencedTablesLoaded, setReferencedTablesLoaded] = (0, import_react44.useState)(false);
+  const [filterMap, setFilterMap] = (0, import_react44.useState)(report?.filterMap ?? {});
+  const canonicalFilterMap = (0, import_react44.useMemo)(() => {
     return Object.fromEntries(
       Object.entries(filterMap).filter(
         (f) => f[1].table !== void 0 && f[1].field !== void 0
       )
     );
   }, [filterMap]);
-  const validFilter = (0, import_react43.useMemo)(() => {
+  const validFilter = (0, import_react44.useMemo)(() => {
     return specificDashboardFilters.reduce(
       (acc, filter) => {
-        if (filter.filterType === "date_range" || filter.filterType === "tenant") {
+        if (filter.filterType === "date_range" || filter.filterType === "tenant" || !referencedTablesLoaded) {
           acc[filter.label] = true;
           return acc;
         }
@@ -42932,8 +43074,8 @@ function ChartBuilder({
       },
       {}
     );
-  }, [specificDashboardFilters, filterMap, allTables]);
-  const [formFlags, setFormFlags] = (0, import_react43.useState)(
+  }, [specificDashboardFilters, filterMap, allTables, referencedTablesLoaded]);
+  const [formFlags, setFormFlags] = (0, import_react44.useState)(
     report?.flags ? Object.fromEntries(
       Object.entries(report.flags).map(([key, value]) => {
         if (value === ALL_TENANTS) {
@@ -42950,7 +43092,7 @@ function ChartBuilder({
       })
     ) : void 0
   );
-  const [defaultDateField, setDefaultDateField] = (0, import_react43.useState)({
+  const [defaultDateField, setDefaultDateField] = (0, import_react44.useState)({
     table: dateFieldOptions[0]?.name || "",
     field: dateFieldOptions[0]?.columns[0]?.field || ""
   });
@@ -43129,15 +43271,15 @@ function ChartBuilder({
     }
     return chartBuilderData;
   };
-  const [formData, setFormData] = (0, import_react43.useState)(
+  const [formData, setFormData] = (0, import_react44.useState)(
     formFormDataFromReport(report, destinationSection ?? getCurrentSection())
   );
-  const reportCustomFields = (0, import_react43.useMemo)(() => {
+  const reportCustomFields = (0, import_react44.useMemo)(() => {
     return report?.columnsWithCustomFields?.filter(
       (col) => !report?.columns?.some((c) => col.field === c.field)
     ) ?? [];
   }, [report?.columnsWithCustomFields, report?.columns]);
-  const referenceLineQueryResults = (0, import_react43.useMemo)(() => {
+  const referenceLineQueryResults = (0, import_react44.useMemo)(() => {
     return formData?.referenceLines?.map((line) => {
       if (line.label === REFERENCE_LINE) {
         return [Number(line.y1) || 0, Number(line.y2) || 0];
@@ -43151,10 +43293,10 @@ function ChartBuilder({
       );
     });
   }, [formData?.referenceLines]);
-  const currentDashboard = (0, import_react43.useMemo)(() => {
+  const currentDashboard = (0, import_react44.useMemo)(() => {
     return dashboardConfig[formData.dashboardName ?? report?.dashboardName ?? ""]?.config;
   }, [dashboardConfig, formData.dashboardName, report?.dashboardName]);
-  const currentDashboardTenants = (0, import_react43.useMemo)(() => {
+  const currentDashboardTenants = (0, import_react44.useMemo)(() => {
     return currentDashboard?.tenantKeys?.map(
       (tenantKey) => client?.allTenantTypes?.find(
         (t) => t.tenantField === tenantKey
@@ -43162,7 +43304,7 @@ function ChartBuilder({
     ) ?? [];
   }, [client?.allTenantTypes, currentDashboard?.tenantKeys]);
   const dashboardOwner = currentDashboardTenants?.[0];
-  const currentTenantAsFormFlags = (0, import_react43.useMemo)(() => {
+  const currentTenantAsFormFlags = (0, import_react44.useMemo)(() => {
     if (!tenants || !tenants.length) {
       return void 0;
     }
@@ -43173,7 +43315,7 @@ function ChartBuilder({
     const tenantIds = typeof tenants[0] !== "object" ? tenants : tenants[0]?.tenantIds;
     return { [tenantField]: tenantIds };
   }, [tenants, dashboardOwner]);
-  const invalidColumns = (0, import_react43.useMemo)(() => {
+  const invalidColumns = (0, import_react44.useMemo)(() => {
     if (!rows || !rows.length) {
       return [];
     }
@@ -43183,7 +43325,7 @@ function ChartBuilder({
     const columnsObservedInRows = rows[0] ? Object.keys(rows[0]) : [];
     return columns.filter((col) => !columnsObservedInRows.includes(col.field));
   }, [rows]);
-  const [chartTypes, setChartTypes] = (0, import_react43.useState)(
+  const [chartTypes, setChartTypes] = (0, import_react44.useState)(
     (() => {
       const data = formFormDataFromReport(
         report,
@@ -43195,7 +43337,7 @@ function ChartBuilder({
       );
     })()
   );
-  const reportContainsCustomFields = (0, import_react43.useMemo)(() => {
+  const reportContainsCustomFields = (0, import_react44.useMemo)(() => {
     const customFieldsMap = schemaData.customFields;
     const reportQueryContainsCustomFields = allTables.some((table) => {
       const tableColumns = referencedColumnsWithoutStar[table] ?? [];
@@ -43206,7 +43348,7 @@ function ChartBuilder({
     });
     return reportQueryContainsCustomFields;
   }, [allTables, referencedColumnsWithoutStar]);
-  const chartBuilderFormDataContainsCustomFields = (0, import_react43.useMemo)(() => {
+  const chartBuilderFormDataContainsCustomFields = (0, import_react44.useMemo)(() => {
     const customFields = allTables.map((table) => schemaData.customFields?.[table] ?? []).flat();
     const customFieldsMap = schemaData.customFields;
     const pivotContainsCustomFields = customFields.some(
@@ -43239,25 +43381,25 @@ function ChartBuilder({
     formData.dateField,
     canonicalFilterMap
   ]);
-  const customFieldsInTabularColumns = (0, import_react43.useMemo)(() => {
+  const customFieldsInTabularColumns = (0, import_react44.useMemo)(() => {
     const customFields = allTables.map((table) => schemaData.customFields?.[table] ?? []).flat();
     return formData.columns.some((col) => {
       return customFields.some((field) => field.field === col.field);
     });
   }, [allTables, formData.columns]);
-  const containsCustomFields = (0, import_react43.useMemo)(() => {
+  const containsCustomFields = (0, import_react44.useMemo)(() => {
     return reportContainsCustomFields || customFieldsInTabularColumns || chartBuilderFormDataContainsCustomFields;
   }, [
     reportContainsCustomFields,
     customFieldsInTabularColumns,
     chartBuilderFormDataContainsCustomFields
   ]);
-  (0, import_react43.useEffect)(() => {
+  (0, import_react44.useEffect)(() => {
     if (!loadingFormData && triggeredEditChart) {
       editChart();
     }
   }, [loadingFormData]);
-  (0, import_react43.useEffect)(() => {
+  (0, import_react44.useEffect)(() => {
     async function getFormData() {
       if (!client) {
         return;
@@ -43298,6 +43440,7 @@ function ChartBuilder({
         setLoadingFormData(false);
         return;
       }
+      setReferencedTablesLoaded(false);
       const result = await getReferencedTables(
         client,
         curSchemaData,
@@ -43375,18 +43518,19 @@ function ChartBuilder({
         curFormData.dateField ?? dateField,
         tableNames
       );
+      setReferencedTablesLoaded(true);
       setLoadingFormData(false);
     }
     getFormData();
   }, []);
-  const ranMountQuery = (0, import_react43.useRef)(false);
-  (0, import_react43.useEffect)(() => {
+  const ranMountQuery = (0, import_react44.useRef)(false);
+  (0, import_react44.useEffect)(() => {
     if (runQueryOnMount && reportFiltersLoaded && filtersEnabled && !ranMountQuery.current) {
       ranMountQuery.current = true;
       handleRunQuery(baseProcessing, currentDashboardFilters);
     }
   }, [runQueryOnMount, reportFiltersLoaded, filtersEnabled]);
-  const allTenantMap = (0, import_react43.useMemo)(() => {
+  const allTenantMap = (0, import_react44.useMemo)(() => {
     return client?.allTenantTypes?.reduce(
       (acc, tenantType) => {
         if (tenantType.scope === "database") {
@@ -43405,15 +43549,15 @@ function ChartBuilder({
       {}
     ) ?? {};
   }, [client?.allTenantTypes]);
-  const [selectedPivotTable, setSelectedPivotTable] = (0, import_react43.useState)(pivotData);
-  const pivotCardTable = (0, import_react43.useMemo)(() => {
+  const [selectedPivotTable, setSelectedPivotTable] = (0, import_react44.useState)(pivotData);
+  const pivotCardTable = (0, import_react44.useMemo)(() => {
     return {
       pivot: formData.pivot,
       rows: selectedPivotTable?.rows ?? [],
       columns: selectedPivotTable?.columns ?? []
     };
   }, [selectedPivotTable, formData.pivot]);
-  const chartData = (0, import_react43.useMemo)(() => {
+  const chartData = (0, import_react44.useMemo)(() => {
     const data = createReportFromForm(
       formData,
       report ? { ...report, rowCount } : tempReport,
@@ -43435,7 +43579,7 @@ function ChartBuilder({
     rowCount,
     currentDashboardFilters
   ]);
-  const xAxisFormatOptions = (0, import_react43.useMemo)(() => {
+  const xAxisFormatOptions = (0, import_react44.useMemo)(() => {
     return chartData?.chartType === "gauge" ? [
       { value: "whole_number", label: "whole number" },
       { value: "two_decimal_places", label: "two decimal places" },
@@ -43495,7 +43639,7 @@ function ChartBuilder({
       setSelectedPivotTable(void 0);
     }
   };
-  const formattedRows = (0, import_react43.useMemo)(() => {
+  const formattedRows = (0, import_react44.useMemo)(() => {
     if (selectedPivotTable && selectedPivotTable.columns && formData.chartType === "table") {
       const columns2 = selectedPivotTable.columns;
       columns2.forEach((col, index) => {
@@ -43590,8 +43734,8 @@ function ChartBuilder({
       handleRunQuery(baseProcessing, updatedFilters);
     });
   };
-  const filtersEnabledRef = (0, import_react43.useRef)(filtersEnabled);
-  (0, import_react43.useEffect)(() => {
+  const filtersEnabledRef = (0, import_react44.useRef)(filtersEnabled);
+  (0, import_react44.useEffect)(() => {
     if (filtersEnabledRef.current !== filtersEnabled) {
       filtersEnabledRef.current = filtersEnabled;
       setCurrentPage(0);
@@ -44153,7 +44297,7 @@ function ChartBuilder({
     setIsSubmitting(false);
     setTriggeredEditChart(false);
   };
-  const memoizedTooltipText = (0, import_react43.useMemo)(() => {
+  const memoizedTooltipText = (0, import_react44.useMemo)(() => {
     const getTooltipText = () => {
       if (formData.name === "") {
         return "Please enter a name for the chart";
@@ -45334,16 +45478,22 @@ function ChartBuilder({
                                   )
                                 }
                               ),
-                              (!formData.dateField?.table || !formData.dateField?.field) && /* @__PURE__ */ (0, import_jsx_runtime65.jsx)("div", { style: { marginBottom: 8, marginTop: "auto" }, children: /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(
-                                ExclamationFilledIcon_default,
+                              referencedTablesLoaded && (!formData.dateField?.table || !formData.dateField?.field) && /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(
+                                "div",
                                 {
-                                  height: 28,
-                                  width: 28,
-                                  style: {
-                                    color: "#dc143c"
-                                  }
+                                  style: { marginBottom: 8, marginTop: "auto" },
+                                  children: /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(
+                                    ExclamationFilledIcon_default,
+                                    {
+                                      height: 28,
+                                      width: 28,
+                                      style: {
+                                        color: "#dc143c"
+                                      }
+                                    }
+                                  )
                                 }
-                              ) })
+                              )
                             ] }),
                             specificDashboardFilters.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(
                               "div",
@@ -45414,10 +45564,13 @@ function ChartBuilder({
                                       hideEmptyOption: true
                                     }
                                   ),
-                                  !validFilter[filter.label] && /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(
+                                  referencedTablesLoaded && !validFilter[filter.label] && /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(
                                     "div",
                                     {
-                                      style: { marginBottom: 8, marginTop: "auto" },
+                                      style: {
+                                        marginBottom: 8,
+                                        marginTop: "auto"
+                                      },
                                       children: /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(
                                         ExclamationFilledIcon_default,
                                         {
@@ -45706,21 +45859,6 @@ function DashboardFilterModal({
   );
 }
 
-// src/utils/width.ts
-var updateFirstChildWidth = (containerRef, setState, options = { gap: 0 }) => {
-  if (containerRef.current) {
-    const element = containerRef.current;
-    const totalWidth = element.getBoundingClientRect().width;
-    const gapWidth = options.gap * (element.childElementCount - 1);
-    let siblingsWidth = 0;
-    const children = Array.from(containerRef.current.children);
-    for (let i = 1; i < children.length; i++) {
-      siblingsWidth += children[i].getBoundingClientRect().width;
-    }
-    setState(totalWidth - siblingsWidth - gapWidth);
-  }
-};
-
 // src/SQLEditor.tsx
 init_tableProcessing();
 init_queryConstructor();
@@ -46064,7 +46202,7 @@ init_astProcessing();
 init_constants();
 
 // src/hooks/useLongLoading.tsx
-var import_react44 = require("react");
+var import_react45 = require("react");
 function useLongLoading(isLoading, meta) {
   const {
     origin,
@@ -46072,10 +46210,10 @@ function useLongLoading(isLoading, meta) {
     abnormalLoadTime = 15e3,
     loadDescription
   } = meta;
-  const [isLongLoading, setIsLongLoading] = (0, import_react44.useState)(false);
-  const [isAbnormalLoading, setIsAbnormalLoading] = (0, import_react44.useState)(false);
-  const { eventTracking } = (0, import_react44.useContext)(EventTrackingContext);
-  (0, import_react44.useEffect)(() => {
+  const [isLongLoading, setIsLongLoading] = (0, import_react45.useState)(false);
+  const [isAbnormalLoading, setIsAbnormalLoading] = (0, import_react45.useState)(false);
+  const { eventTracking } = (0, import_react45.useContext)(EventTrackingContext);
+  (0, import_react45.useEffect)(() => {
     let longTimer = null;
     let abnormalTimer = null;
     if (isLoading) {
@@ -46237,7 +46375,7 @@ function SQLEditor({
   onDiscardChanges,
   onSaveChanges,
   onCloseChartBuilder,
-  isChartBuilderEnabled = false,
+  isChartBuilderEnabled = true,
   isAdminEnabled = false,
   chartBuilderOptions,
   chartBuilderTitle,
@@ -46257,67 +46395,69 @@ function SQLEditor({
   onRequestAddVirtualTable
 }) {
   const computedButtonLabel = addToDashboardButtonLabel === "Add to dashboard" ? reportId || report?.id ? "Save changes" : "Add to dashboard" : addToDashboardButtonLabel;
-  const [sqlPrompt, setSqlPrompt] = (0, import_react45.useState)("");
-  const [client] = (0, import_react45.useContext)(ClientContext);
-  const [theme] = (0, import_react45.useContext)(ThemeContext);
-  const { tenants, flags } = (0, import_react45.useContext)(TenantContext);
+  const [sqlPrompt, setSqlPrompt] = (0, import_react46.useState)("");
+  const sqlPromptFormRef = (0, import_react46.useRef)(null);
+  const sqlPromptInputWidth = useResponsiveFirstChildWidth_default(sqlPromptFormRef, {
+    gap: 12,
+    initialWidth: 320,
+    minWidth: 160
+  });
+  const normalizedSqlPromptWidth = sqlPromptInputWidth > 0 ? sqlPromptInputWidth : 160;
+  const [client] = (0, import_react46.useContext)(ClientContext);
+  const [theme] = (0, import_react46.useContext)(ThemeContext);
+  const { tenants, flags } = (0, import_react46.useContext)(TenantContext);
   const { dashboards } = useDashboards();
   const {
     data,
     isLoading: dashboardIsLoading,
     reload
   } = useDashboardInternal(destinationDashboard);
-  const { getToken, quillFetchWithToken } = (0, import_react45.useContext)(FetchContext);
-  const { eventTracking } = (0, import_react45.useContext)(EventTrackingContext);
+  const { getToken, quillFetchWithToken } = (0, import_react46.useContext)(FetchContext);
+  const { eventTracking } = (0, import_react46.useContext)(EventTrackingContext);
   const { allReportsById } = useAllReports();
-  const destinationDashboardConfig = (0, import_react45.useMemo)(() => {
+  const destinationDashboardConfig = (0, import_react46.useMemo)(() => {
     return dashboards?.find((d) => d.name === destinationDashboard);
   }, [dashboards, destinationDashboard]);
-  const [query, setQuery] = (0, import_react45.useState)(defaultQuery);
-  const [rows, setRows] = (0, import_react45.useState)([]);
-  const [columns, setColumns] = (0, import_react45.useState)([]);
-  const [schemaData] = (0, import_react45.useContext)(SchemaDataContext);
-  const { dashboardFilters } = (0, import_react45.useContext)(DashboardFiltersContext);
-  const specificDashboardFilters = (0, import_react45.useMemo)(() => {
+  const [query, setQuery] = (0, import_react46.useState)(defaultQuery);
+  const [rows, setRows] = (0, import_react46.useState)([]);
+  const [columns, setColumns] = (0, import_react46.useState)([]);
+  const [schemaData] = (0, import_react46.useContext)(SchemaDataContext);
+  const { dashboardFilters } = (0, import_react46.useContext)(DashboardFiltersContext);
+  const specificDashboardFilters = (0, import_react46.useMemo)(() => {
     return Object.values(
       dashboardFilters[report?.dashboardName ?? destinationDashboard ?? ""] ?? {}
     ).map((f) => f.filter);
   }, [dashboardFilters, destinationDashboard]);
-  const [errorMessage, setErrorMessage] = (0, import_react45.useState)("");
-  const [sqlResponseLoading, setSqlResponseLoading] = (0, import_react45.useState)(false);
+  const [errorMessage, setErrorMessage] = (0, import_react46.useState)("");
+  const [sqlResponseLoading, setSqlResponseLoading] = (0, import_react46.useState)(false);
   useLongLoading(sqlResponseLoading, {
     origin: "SQLEditor",
     loadDescription: "Loading SQL response"
   });
-  const [sqlQueryLoading, setSqlQueryLoading] = (0, import_react45.useState)(false);
+  const [sqlQueryLoading, setSqlQueryLoading] = (0, import_react46.useState)(false);
   useLongLoading(sqlQueryLoading, {
     origin: "SQLEditor",
     loadDescription: "Loading SQL query"
   });
-  const [isChartBuilderOpen, setIsChartBuilderOpen] = (0, import_react45.useState)(false);
-  const [displayTable, setDisplayTable] = (0, import_react45.useState)(false);
-  const [formattedRows, setFormattedRows] = (0, import_react45.useState)([]);
-  const formRef = (0, import_react45.useRef)(null);
-  const sidebarRef = (0, import_react45.useRef)(null);
-  const [searchBarWidth, setSearchBarWidth] = (0, import_react45.useState)(200);
-  const [showSearchBar, setShowSearchBar] = (0, import_react45.useState)(false);
-  const [filterBarWidth, setFilterBarWidth] = (0, import_react45.useState)(200);
-  const [rowCount, setRowCount] = (0, import_react45.useState)(void 0);
-  const [rowCountIsLoading, setRowCountIsLoading] = (0, import_react45.useState)(false);
-  const [maxPage, setMaxPage] = (0, import_react45.useState)(1);
-  const [tableSearchQuery, setTableSearchQuery] = (0, import_react45.useState)("");
-  const [lastSuccessfulQuery, setLastSuccessfulQuery] = (0, import_react45.useState)("");
-  const [isSaveQueryModalOpen, setIsSaveQueryModalOpen] = (0, import_react45.useState)(false);
-  const [tempReport, setTempReport] = (0, import_react45.useState)({
+  const [isChartBuilderOpen, setIsChartBuilderOpen] = (0, import_react46.useState)(false);
+  const [displayTable, setDisplayTable] = (0, import_react46.useState)(false);
+  const [formattedRows, setFormattedRows] = (0, import_react46.useState)([]);
+  const [rowCount, setRowCount] = (0, import_react46.useState)(void 0);
+  const [rowCountIsLoading, setRowCountIsLoading] = (0, import_react46.useState)(false);
+  const [maxPage, setMaxPage] = (0, import_react46.useState)(1);
+  const [tableSearchQuery, setTableSearchQuery] = (0, import_react46.useState)("");
+  const [lastSuccessfulQuery, setLastSuccessfulQuery] = (0, import_react46.useState)("");
+  const [isSaveQueryModalOpen, setIsSaveQueryModalOpen] = (0, import_react46.useState)(false);
+  const [tempReport, setTempReport] = (0, import_react46.useState)({
     ...EMPTY_INTERNAL_REPORT,
     ...report
   });
-  const tableRef = (0, import_react45.useRef)(null);
-  const [cachedHeight, setCachedHeight] = (0, import_react45.useState)(0);
+  const tableRef = (0, import_react46.useRef)(null);
+  const [cachedHeight, setCachedHeight] = (0, import_react46.useState)(0);
   const DEFAULT_ROWS_PER_PAGE = 5;
   const ROW_HEIGHT = 37;
   const TABLE_TAB_HEIGHT = 75;
-  const filteredSchema = (0, import_react45.useMemo)(() => {
+  const filteredSchema = (0, import_react46.useMemo)(() => {
     return schemaData.schemaWithCustomFields?.filter((table) => {
       return destinationDashboardConfig?.tenantKeys?.[0] === SINGLE_TENANT || !table.ownerTenantFields || table.ownerTenantFields?.length === 0 || table.ownerTenantFields?.includes(
         destinationDashboardConfig?.tenantKeys?.[0] ?? ""
@@ -46327,17 +46467,17 @@ function SQLEditor({
     schemaData.schemaWithCustomFields,
     destinationDashboardConfig?.tenantKeys
   ]);
-  (0, import_react45.useEffect)(() => {
+  (0, import_react46.useEffect)(() => {
     if (tableRef.current) {
       setCachedHeight(tableRef.current.clientHeight);
     }
   }, [tableRef.current?.clientHeight]);
-  (0, import_react45.useEffect)(() => {
+  (0, import_react46.useEffect)(() => {
     if (!data && !dashboardIsLoading) {
       reload();
     }
   }, [data, dashboardIsLoading]);
-  (0, import_react45.useEffect)(() => {
+  (0, import_react46.useEffect)(() => {
     const loadReport = async () => {
       let reportToLoad;
       if (!client) {
@@ -46390,9 +46530,9 @@ function SQLEditor({
       rowsPerPage * 10
     )
   };
-  const [currentPage, setCurrentPage] = (0, import_react45.useState)(0);
-  const [currentSort, setCurrentSort] = (0, import_react45.useState)(void 0);
-  const currentProcessing = (0, import_react45.useMemo)(() => {
+  const [currentPage, setCurrentPage] = (0, import_react46.useState)(0);
+  const [currentSort, setCurrentSort] = (0, import_react46.useState)(void 0);
+  const currentProcessing = (0, import_react46.useMemo)(() => {
     return {
       page: {
         currentPage,
@@ -46405,41 +46545,26 @@ function SQLEditor({
       sort: currentSort
     };
   }, [currentPage, rowsPerPage, currentSort]);
-  const displayedTableData = (0, import_react45.useMemo)(() => {
+  const displayedTableData = (0, import_react46.useMemo)(() => {
     return filteredSchema?.filter((table) => {
       return table.name?.toLowerCase()?.includes(tableSearchQuery.toLowerCase().trim()) || table.columns.some(
         (col) => col.field?.toLowerCase()?.includes(tableSearchQuery.toLowerCase().trim())
       );
     }) ?? [];
   }, [tableSearchQuery, schemaData.schemaWithCustomFields]);
-  (0, import_react45.useEffect)(() => {
-    function handleResize() {
-      updateFirstChildWidth(formRef, setSearchBarWidth, { gap: 12 });
-      updateFirstChildWidth(sidebarRef, setFilterBarWidth, { gap: 12 });
-      setShowSearchBar(true);
-    }
-    (async () => {
-      await new Promise((resolve) => setTimeout(resolve, 30));
-      handleResize();
-    })();
-    window.addEventListener("resize", handleResize);
-    return () => {
-      window.removeEventListener("resize", handleResize);
-    };
-  }, []);
-  (0, import_react45.useEffect)(() => {
+  (0, import_react46.useEffect)(() => {
     if (client) {
       setRows([]);
       setColumns([]);
       setDisplayTable(false);
     }
   }, [client?.publicKey]);
-  (0, import_react45.useEffect)(() => {
+  (0, import_react46.useEffect)(() => {
     if (isChartBuilderOpen === false) {
       onCloseChartBuilder && onCloseChartBuilder();
     }
   }, [isChartBuilderOpen]);
-  const handleRunSqlPrompt = (0, import_react45.useCallback)(async () => {
+  const handleRunSqlPrompt = (0, import_react46.useCallback)(async () => {
     if (!client || sqlResponseLoading) {
       return;
     }
@@ -46458,7 +46583,7 @@ function SQLEditor({
     setQuery(resp.message);
     setSqlResponseLoading(false);
   }, [sqlPrompt, sqlResponseLoading]);
-  const debounceRunSqlPrompt = (0, import_react45.useCallback)(
+  const debounceRunSqlPrompt = (0, import_react46.useCallback)(
     createDebounce(handleRunSqlPrompt, 500),
     [handleRunSqlPrompt]
   );
@@ -46695,7 +46820,7 @@ function SQLEditor({
     }
     return getTablesHelper(getSelectFromAST(resp.ast), dbTables, skipStar);
   };
-  (0, import_react45.useEffect)(() => {
+  (0, import_react46.useEffect)(() => {
     if (onChangeQuery) {
       onChangeQuery(query || "");
     }
@@ -46752,7 +46877,11 @@ function SQLEditor({
                                 style: {
                                   paddingTop: 16,
                                   paddingLeft: "20px",
-                                  paddingRight: "30px"
+                                  paddingRight: "30px",
+                                  width: "100%",
+                                  maxWidth: 350,
+                                  minWidth: 250,
+                                  boxSizing: "border-box"
                                 },
                                 children: /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
                                   TextInputComponent,
@@ -46763,7 +46892,7 @@ function SQLEditor({
                                     },
                                     value: tableSearchQuery,
                                     id: "edit-name",
-                                    width: filterBarWidth
+                                    width: "100%"
                                   }
                                 )
                               }
@@ -46783,7 +46912,7 @@ function SQLEditor({
                           ]
                         }
                       ),
-                      /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)(
+                      /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
                         "div",
                         {
                           style: {
@@ -46795,391 +46924,385 @@ function SQLEditor({
                             height: "100%",
                             overflowX: "hidden"
                           },
-                          children: [
-                            /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
-                              "div",
-                              {
-                                style: {
-                                  display: "flex",
-                                  flexDirection: "column",
-                                  overflow: addToDashboardButtonLabel === "Add to dashboard" ? "visible" : "auto",
-                                  height: "100%"
-                                },
-                                children: /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)(OverflowContainer, { children: [
-                                  /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)(
-                                    "form",
-                                    {
-                                      ref: formRef,
-                                      onSubmit: (e) => {
-                                        e.preventDefault();
-                                        if (sqlPrompt.trim().length > 500) {
-                                          return;
-                                        }
-                                        debounceRunSqlPrompt();
-                                      },
-                                      style: {
-                                        display: "flex",
-                                        visibility: showSearchBar ? "visible" : "hidden",
-                                        flexDirection: "row",
-                                        gap: 12,
-                                        paddingTop: 16,
-                                        paddingBottom: 16
-                                      },
-                                      children: [
-                                        /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
-                                          TextInputComponent,
-                                          {
-                                            id: "ai-search",
-                                            value: sqlPrompt,
-                                            width: searchBarWidth,
-                                            onChange: (e) => setSqlPrompt(e.target.value),
-                                            placeholder: "Ask a question..."
-                                          }
-                                        ),
-                                        /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
-                                          QuillToolTip,
-                                          {
-                                            text: "Prompt must be less than 500 characters",
-                                            enabled: sqlPrompt.trim().length > 500,
-                                            displayBelow: true,
-                                            textStyle: {
-                                              maxWidth: "77px",
-                                              whiteSpace: "normal"
-                                            },
-                                            children: /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
-                                              ButtonComponent,
-                                              {
-                                                onClick: debounceRunSqlPrompt,
-                                                label: "Ask AI",
-                                                isLoading: sqlResponseLoading,
-                                                disabled: sqlPrompt.trim().length > 500
-                                              }
-                                            )
-                                          }
-                                        )
-                                      ]
-                                    }
-                                  ),
-                                  /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
-                                    "div",
-                                    {
-                                      style: {
-                                        minHeight: "max(210px, 20vh)",
-                                        maxHeight: "30%",
-                                        height: "20vh"
-                                      },
-                                      children: /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
-                                        SQLEditorComponent,
+                          children: /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
+                            "div",
+                            {
+                              style: {
+                                display: "flex",
+                                flexDirection: "column",
+                                overflow: addToDashboardButtonLabel === "Add to dashboard" ? "visible" : "auto",
+                                height: "100%"
+                              },
+                              children: /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)(OverflowContainer, { children: [
+                                /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)(
+                                  "form",
+                                  {
+                                    ref: sqlPromptFormRef,
+                                    onSubmit: (e) => {
+                                      e.preventDefault();
+                                      if (sqlPrompt.trim().length > 500) {
+                                        return;
+                                      }
+                                      debounceRunSqlPrompt();
+                                    },
+                                    style: {
+                                      display: "flex",
+                                      flexDirection: "row",
+                                      gap: 12,
+                                      paddingTop: 16,
+                                      paddingBottom: 16,
+                                      flexWrap: "wrap",
+                                      alignItems: "stretch",
+                                      visibility: normalizedSqlPromptWidth > 0 ? "visible" : "hidden"
+                                    },
+                                    children: [
+                                      /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
+                                        TextInputComponent,
                                         {
-                                          query: query || "",
-                                          schema: filteredSchema,
-                                          databaseType: client?.databaseType ?? "postgresql",
-                                          clientName: client?.publicKey || "",
-                                          setQuery,
-                                          handleRunQuery: () => {
-                                            handleRunQuery(currentProcessing, true);
-                                          },
-                                          handleFixWithAI,
-                                          isNewQueryEnabled,
-                                          runQueryOnMount,
-                                          handleClearQuery,
-                                          theme,
-                                          defineEditorTheme,
-                                          setEditorTheme,
-                                          setEditorMounted: () => {
-                                          },
-                                          ButtonComponent,
-                                          SecondaryButtonComponent,
-                                          loading: sqlResponseLoading && schemaData.isSchemaLoading && dashboardIsLoading,
-                                          LoadingComponent
+                                          id: "ai-search",
+                                          value: sqlPrompt,
+                                          width: normalizedSqlPromptWidth,
+                                          onChange: (e) => setSqlPrompt(e.target.value),
+                                          placeholder: "Ask a question..."
                                         }
-                                      )
-                                    }
-                                  ),
-                                  /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
-                                    "div",
-                                    {
-                                      style: {
-                                        display: "flex",
-                                        flexDirection: "row",
-                                        width: "100%",
-                                        justifyContent: addToDashboardButtonLabel === "Add to dashboard" ? "flex-end" : "flex-start"
-                                      },
-                                      children: /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
-                                        "div",
+                                      ),
+                                      /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
+                                        QuillToolTip,
                                         {
-                                          style: {
-                                            display: "flex",
-                                            flexDirection: "row",
-                                            alignItems: "center",
-                                            height: 70
+                                          text: "Prompt must be less than 500 characters",
+                                          enabled: sqlPrompt.trim().length > 500,
+                                          displayBelow: true,
+                                          textStyle: {
+                                            maxWidth: "77px",
+                                            whiteSpace: "normal"
                                           },
-                                          children: /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)("div", { style: { display: "flex", gap: 12 }, children: [
-                                            computedButtonLabel === "Add to dashboard" ? /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
-                                              SecondaryButtonComponent,
-                                              {
-                                                onClick: () => {
-                                                  handleRunQuery(
-                                                    {
-                                                      page: pagination,
-                                                      sort: void 0
-                                                    },
-                                                    true,
-                                                    false,
-                                                    true
-                                                  );
-                                                },
-                                                label: "Run query"
-                                              }
-                                            ) : /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
-                                              ButtonComponent,
-                                              {
-                                                onClick: () => {
-                                                  handleRunQuery(
-                                                    {
-                                                      page: pagination,
-                                                      sort: void 0
-                                                    },
-                                                    true,
-                                                    false,
-                                                    true
-                                                  );
-                                                },
-                                                label: "Run query"
-                                              }
-                                            ),
-                                            isAdminEnabled && !report && /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
-                                              SecondaryButtonComponent,
-                                              {
-                                                disabled: !!errorMessage || !(lastSuccessfulQuery === query) || !query,
-                                                onClick: async () => {
-                                                  const isSelectStar = isSimpleSelectStarQuery(
-                                                    query ?? ""
-                                                  );
-                                                  let tables = [];
-                                                  let customFieldColumns = [];
-                                                  if (client && isSelectStar && schemaData.customFields) {
-                                                    const { referencedTablesAndColumns } = await getReferencedTables(
-                                                      client,
-                                                      query ?? "",
-                                                      schemaData.schemaWithCustomFields,
-                                                      isSelectStar
-                                                    );
-                                                    tables = referencedTablesAndColumns.map(
-                                                      (ref) => ref.name
-                                                    );
-                                                    customFieldColumns = tables.map((table) => {
-                                                      return (schemaData.customFields?.[table] ?? []).map((field) => field.field);
-                                                    }).flat();
-                                                  }
-                                                  setTempReport({
-                                                    ...tempReport,
-                                                    id: TEMP_REPORT_ID,
-                                                    rows,
-                                                    columns: isSelectStar ? (
-                                                      // so Automatic Custom Fields can be applied
-                                                      columns.filter(
-                                                        (col) => {
-                                                          return !customFieldColumns.includes(
-                                                            col.field
-                                                          );
-                                                        }
-                                                      )
-                                                    ) : columns,
-                                                    includeCustomFields: isSelectStar,
-                                                    columnInternal: columns,
-                                                    rowCount: rowCount ?? 0,
-                                                    queryString: query ?? "",
-                                                    chartType: "table",
-                                                    dashboardName: destinationDashboard
-                                                  });
-                                                  setIsSaveQueryModalOpen(true);
-                                                },
-                                                label: "Save query"
-                                              }
-                                            ),
-                                            isNewQueryEnabled && /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
-                                              SecondaryButtonComponent,
-                                              {
-                                                onClick: handleClearQuery,
-                                                label: "Clear query"
-                                              }
-                                            ),
-                                            computedButtonLabel === "Add to dashboard" && /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
-                                              ButtonComponent,
-                                              {
-                                                onClick: async () => {
-                                                  onSaveChanges && onSaveChanges();
-                                                  const isSelectStar = isSimpleSelectStarQuery(
-                                                    query ?? ""
-                                                  );
-                                                  let tables = [];
-                                                  let customFieldColumns = [];
-                                                  if (client && isSelectStar && schemaData.customFields) {
-                                                    const { referencedTablesAndColumns } = await getReferencedTables(
-                                                      client,
-                                                      query ?? "",
-                                                      filteredSchema,
-                                                      isSelectStar
-                                                    );
-                                                    tables = referencedTablesAndColumns.map(
-                                                      (ref) => ref.name
-                                                    );
-                                                    customFieldColumns = tables.map((table) => {
-                                                      return (schemaData.customFields?.[table] ?? []).map((field) => field.field);
-                                                    }).flat();
-                                                  }
-                                                  const newTempReport = {
-                                                    ...tempReport,
-                                                    id: reportId || report?.id || TEMP_REPORT_ID,
-                                                    rows,
-                                                    columns: isSelectStar ? (
-                                                      // so Automatic Custom Fields can be applied
-                                                      columns.filter(
-                                                        (col) => {
-                                                          return !customFieldColumns.includes(
-                                                            col.field
-                                                          );
-                                                        }
-                                                      )
-                                                    ) : columns,
-                                                    includeCustomFields: isSelectStar,
-                                                    columnInternal: columns,
-                                                    rowCount: rowCount ?? 0,
-                                                    queryString: query ?? "",
-                                                    dashboardName: report?.dashboardName ?? destinationDashboard
-                                                  };
-                                                  setTempReport(newTempReport);
-                                                  setIsChartBuilderOpen(true);
-                                                },
-                                                label: computedButtonLabel,
-                                                disabled: !!errorMessage || !(lastSuccessfulQuery === query) || !query,
-                                                tooltipText: !!errorMessage || !(lastSuccessfulQuery === query) ? "Please run a query" : ""
-                                              }
-                                            )
-                                          ] })
+                                          children: /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
+                                            ButtonComponent,
+                                            {
+                                              onClick: debounceRunSqlPrompt,
+                                              label: "Ask AI",
+                                              isLoading: sqlResponseLoading,
+                                              disabled: sqlPrompt.trim().length > 500
+                                            }
+                                          )
                                         }
                                       )
-                                    }
-                                  ),
-                                  /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)(
-                                    "div",
-                                    {
-                                      style: {
-                                        display: "flex",
-                                        flexDirection: "column",
-                                        // height: '100%',
-                                        padding: 0,
-                                        margin: 0,
-                                        border: "none",
-                                        outline: "none"
-                                      },
-                                      children: [
-                                        errorMessage && /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
+                                    ]
+                                  }
+                                ),
+                                /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
+                                  "div",
+                                  {
+                                    style: {
+                                      minHeight: "max(210px, 20vh)",
+                                      maxHeight: "30%",
+                                      height: "20vh"
+                                    },
+                                    children: /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
+                                      SQLEditorComponent,
+                                      {
+                                        query: query || "",
+                                        schema: filteredSchema,
+                                        databaseType: client?.databaseType ?? "postgresql",
+                                        clientName: client?.publicKey || "",
+                                        setQuery,
+                                        handleRunQuery: () => {
+                                          handleRunQuery(currentProcessing, true);
+                                        },
+                                        handleFixWithAI,
+                                        isNewQueryEnabled,
+                                        runQueryOnMount,
+                                        handleClearQuery,
+                                        theme,
+                                        defineEditorTheme,
+                                        setEditorTheme,
+                                        setEditorMounted: () => {
+                                        },
+                                        ButtonComponent,
+                                        SecondaryButtonComponent,
+                                        loading: sqlResponseLoading && schemaData.isSchemaLoading && dashboardIsLoading,
+                                        LoadingComponent
+                                      }
+                                    )
+                                  }
+                                ),
+                                /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
+                                  "div",
+                                  {
+                                    style: {
+                                      display: "flex",
+                                      flexDirection: "row",
+                                      width: "100%",
+                                      justifyContent: addToDashboardButtonLabel === "Add to dashboard" ? "flex-end" : "flex-start"
+                                    },
+                                    children: /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
+                                      "div",
+                                      {
+                                        style: {
+                                          display: "flex",
+                                          flexDirection: "row",
+                                          alignItems: "center",
+                                          height: 70
+                                        },
+                                        children: /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)(
                                           "div",
                                           {
                                             style: {
-                                              fontFamily: theme?.fontFamily,
-                                              color: theme?.primaryTextColor,
-                                              fontSize: 15,
-                                              fontWeight: "400",
-                                              width: "100%"
+                                              display: "flex",
+                                              gap: 12
                                             },
-                                            children: /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)(
-                                              "div",
-                                              {
-                                                style: {
-                                                  display: "flex",
-                                                  flexDirection: "row",
-                                                  justifyContent: "space-between",
-                                                  gap: 12,
-                                                  background: "rgba(0,0,0,0.02)",
-                                                  // TODO: change color
-                                                  color: theme?.primaryTextColor,
-                                                  fontFamily: theme?.fontFamily,
-                                                  borderRadius: 6,
-                                                  padding: 20,
-                                                  marginBottom: 15,
-                                                  width: "100%",
-                                                  alignItems: "center"
-                                                },
-                                                children: [
-                                                  errorMessage,
-                                                  errorMessage !== "No data found" && errorMessage !== "No query found" && /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
-                                                    SecondaryButtonComponent,
+                                            children: [
+                                              computedButtonLabel === "Add to dashboard" ? /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
+                                                SecondaryButtonComponent,
+                                                {
+                                                  onClick: () => {
+                                                    handleRunQuery(
+                                                      {
+                                                        page: pagination,
+                                                        sort: void 0
+                                                      },
+                                                      true,
+                                                      false,
+                                                      true
+                                                    );
+                                                  },
+                                                  label: "Run query"
+                                                }
+                                              ) : /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
+                                                SecondaryButtonComponent,
+                                                {
+                                                  onClick: () => {
+                                                    handleRunQuery(
+                                                      {
+                                                        page: pagination,
+                                                        sort: void 0
+                                                      },
+                                                      true,
+                                                      false,
+                                                      true
+                                                    );
+                                                  },
+                                                  label: "Run query"
+                                                }
+                                              ),
+                                              isChartBuilderEnabled && /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
+                                                "div",
+                                                {
+                                                  style: {
+                                                    display: "flex",
+                                                    flexDirection: "row",
+                                                    alignItems: "center",
+                                                    justifyContent: "flex-end",
+                                                    width: "100%"
+                                                  },
+                                                  children: computedButtonLabel !== "Add to dashboard" ? /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
+                                                    ButtonComponent,
+                                                    {
+                                                      onClick: async () => {
+                                                        onSaveChanges && onSaveChanges();
+                                                        setIsChartBuilderOpen(true);
+                                                      },
+                                                      label: computedButtonLabel,
+                                                      disabled: !!errorMessage || !(lastSuccessfulQuery === query)
+                                                    }
+                                                  ) : /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
+                                                    ButtonComponent,
                                                     {
-                                                      onClick: handleFixWithAI,
-                                                      label: "Fix with AI"
+                                                      onClick: async () => {
+                                                        onSaveChanges && onSaveChanges();
+                                                        const isSelectStar = isSimpleSelectStarQuery(query ?? "");
+                                                        let tables = [];
+                                                        let customFieldColumns = [];
+                                                        if (client && isSelectStar && schemaData.customFields) {
+                                                          const { referencedTablesAndColumns } = await getReferencedTables(
+                                                            client,
+                                                            query ?? "",
+                                                            filteredSchema,
+                                                            isSelectStar
+                                                          );
+                                                          tables = referencedTablesAndColumns.map(
+                                                            (ref) => ref.name
+                                                          );
+                                                          customFieldColumns = tables.map((table) => {
+                                                            return (schemaData.customFields?.[table] ?? []).map((field) => field.field);
+                                                          }).flat();
+                                                        }
+                                                        const newTempReport = {
+                                                          ...tempReport,
+                                                          id: reportId || report?.id || TEMP_REPORT_ID,
+                                                          rows,
+                                                          columns: isSelectStar ? (
+                                                            // so Automatic Custom Fields can be applied
+                                                            columns.filter(
+                                                              (col) => {
+                                                                return !customFieldColumns.includes(
+                                                                  col.field
+                                                                );
+                                                              }
+                                                            )
+                                                          ) : columns,
+                                                          includeCustomFields: isSelectStar,
+                                                          columnInternal: columns,
+                                                          rowCount: rowCount ?? 0,
+                                                          queryString: query ?? "",
+                                                          dashboardName: report?.dashboardName ?? destinationDashboard
+                                                        };
+                                                        setTempReport(newTempReport);
+                                                        setIsChartBuilderOpen(true);
+                                                      },
+                                                      label: computedButtonLabel,
+                                                      disabled: !!errorMessage || !(lastSuccessfulQuery === query) || !query,
+                                                      tooltipText: !!errorMessage || !(lastSuccessfulQuery === query) ? "Please run a query" : ""
                                                     }
                                                   )
-                                                ]
-                                              }
-                                            )
-                                          }
-                                        ),
-                                        errorMessage || !displayTable ? null : /* @__PURE__ */ (0, import_jsx_runtime66.jsx)("div", { ref: tableRef, children: /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
-                                          TableComponent,
-                                          {
-                                            isLoading: sqlQueryLoading,
-                                            rows: formattedRows,
-                                            columns,
-                                            rowCount,
-                                            rowsPerPage,
-                                            rowCountIsLoading,
-                                            onPageChange,
-                                            onSortChange,
-                                            containerStyle: {
-                                              height: "calc(100vh - max(210px, 20vh) - 310px)",
-                                              minHeight: `calc(${DEFAULT_ROWS_PER_PAGE} * ${ROW_HEIGHT}px + ${TABLE_TAB_HEIGHT}px)`,
-                                              // at least 10 rows tall
-                                              maxHeight: "calc(100vh - max(210px, 20vh) - 310px)"
-                                            },
-                                            currentPage,
-                                            setCurrentPage
+                                                }
+                                              ),
+                                              isAdminEnabled && !report && /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
+                                                SecondaryButtonComponent,
+                                                {
+                                                  disabled: !!errorMessage || !(lastSuccessfulQuery === query) || !query,
+                                                  onClick: async () => {
+                                                    const isSelectStar = isSimpleSelectStarQuery(
+                                                      query ?? ""
+                                                    );
+                                                    let tables = [];
+                                                    let customFieldColumns = [];
+                                                    if (client && isSelectStar && schemaData.customFields) {
+                                                      const { referencedTablesAndColumns } = await getReferencedTables(
+                                                        client,
+                                                        query ?? "",
+                                                        schemaData.schemaWithCustomFields,
+                                                        isSelectStar
+                                                      );
+                                                      tables = referencedTablesAndColumns.map(
+                                                        (ref) => ref.name
+                                                      );
+                                                      customFieldColumns = tables.map((table) => {
+                                                        return (schemaData.customFields?.[table] ?? []).map((field) => field.field);
+                                                      }).flat();
+                                                    }
+                                                    setTempReport({
+                                                      ...tempReport,
+                                                      id: TEMP_REPORT_ID,
+                                                      rows,
+                                                      columns: isSelectStar ? (
+                                                        // so Automatic Custom Fields can be applied
+                                                        columns.filter(
+                                                          (col) => {
+                                                            return !customFieldColumns.includes(
+                                                              col.field
+                                                            );
+                                                          }
+                                                        )
+                                                      ) : columns,
+                                                      includeCustomFields: isSelectStar,
+                                                      columnInternal: columns,
+                                                      rowCount: rowCount ?? 0,
+                                                      queryString: query ?? "",
+                                                      chartType: "table",
+                                                      dashboardName: destinationDashboard
+                                                    });
+                                                    setIsSaveQueryModalOpen(true);
+                                                  },
+                                                  label: "Save query"
+                                                }
+                                              ),
+                                              isNewQueryEnabled && /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
+                                                SecondaryButtonComponent,
+                                                {
+                                                  onClick: handleClearQuery,
+                                                  label: "Clear query"
+                                                }
+                                              )
+                                            ]
                                           }
-                                        ) })
-                                      ]
-                                    }
-                                  )
-                                ] })
-                              }
-                            ),
-                            isChartBuilderEnabled && /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)(
-                              "div",
-                              {
-                                style: {
-                                  display: "flex",
-                                  flexDirection: "row",
-                                  alignItems: "center",
-                                  justifyContent: "flex-end",
-                                  width: "100%",
-                                  gap: 12,
-                                  marginTop: 15,
-                                  marginBottom: 5
-                                },
-                                children: [
-                                  onDiscardChanges && /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
-                                    SecondaryButtonComponent,
-                                    {
-                                      onClick: onDiscardChanges,
-                                      label: "Discard changes"
-                                    }
-                                  ),
-                                  computedButtonLabel !== "Add to dashboard" && /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
-                                    ButtonComponent,
-                                    {
-                                      onClick: async () => {
-                                        onSaveChanges && onSaveChanges();
-                                        setIsChartBuilderOpen(true);
-                                      },
-                                      label: computedButtonLabel,
-                                      disabled: !!errorMessage || !(lastSuccessfulQuery === query)
-                                    }
-                                  )
-                                ]
-                              }
-                            )
-                          ]
+                                        )
+                                      }
+                                    )
+                                  }
+                                ),
+                                /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)(
+                                  "div",
+                                  {
+                                    style: {
+                                      display: "flex",
+                                      flexDirection: "column",
+                                      // height: '100%',
+                                      padding: 0,
+                                      margin: 0,
+                                      border: "none",
+                                      outline: "none"
+                                    },
+                                    children: [
+                                      errorMessage && /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
+                                        "div",
+                                        {
+                                          style: {
+                                            fontFamily: theme?.fontFamily,
+                                            color: theme?.primaryTextColor,
+                                            fontSize: 15,
+                                            fontWeight: "400",
+                                            width: "100%"
+                                          },
+                                          children: /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)(
+                                            "div",
+                                            {
+                                              style: {
+                                                display: "flex",
+                                                flexDirection: "row",
+                                                justifyContent: "space-between",
+                                                gap: 12,
+                                                background: "rgba(0,0,0,0.02)",
+                                                // TODO: change color
+                                                color: theme?.primaryTextColor,
+                                                fontFamily: theme?.fontFamily,
+                                                borderRadius: 6,
+                                                padding: 20,
+                                                marginBottom: 15,
+                                                width: "100%",
+                                                alignItems: "center"
+                                              },
+                                              children: [
+                                                errorMessage,
+                                                errorMessage !== "No data found" && errorMessage !== "No query found" && /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
+                                                  SecondaryButtonComponent,
+                                                  {
+                                                    onClick: handleFixWithAI,
+                                                    label: "Fix with AI"
+                                                  }
+                                                )
+                                              ]
+                                            }
+                                          )
+                                        }
+                                      ),
+                                      errorMessage || !displayTable ? null : /* @__PURE__ */ (0, import_jsx_runtime66.jsx)("div", { ref: tableRef, children: /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
+                                        TableComponent,
+                                        {
+                                          isLoading: sqlQueryLoading,
+                                          rows: formattedRows,
+                                          columns,
+                                          rowCount,
+                                          rowsPerPage,
+                                          rowCountIsLoading,
+                                          onPageChange,
+                                          onSortChange,
+                                          containerStyle: {
+                                            height: "calc(100vh - max(210px, 20vh) - 310px)",
+                                            minHeight: `calc(${DEFAULT_ROWS_PER_PAGE} * ${ROW_HEIGHT}px + ${TABLE_TAB_HEIGHT}px)`,
+                                            // at least 10 rows tall
+                                            maxHeight: "calc(100vh - max(210px, 20vh) - 310px)"
+                                          },
+                                          currentPage,
+                                          setCurrentPage
+                                        }
+                                      ) })
+                                    ]
+                                  }
+                                )
+                              ] })
+                            }
+                          )
                         }
                       )
                     ]
@@ -47323,10 +47446,10 @@ var SQLEditorComponent = ({
   loading,
   LoadingComponent = QuillLoadingComponent
 }) => {
-  const [editorKey, setEditorKey] = (0, import_react45.useState)(0);
-  const { eventTracking } = (0, import_react45.useContext)(EventTrackingContext);
-  const currentProvider = (0, import_react45.useRef)(null);
-  (0, import_react45.useEffect)(() => {
+  const [editorKey, setEditorKey] = (0, import_react46.useState)(0);
+  const { eventTracking } = (0, import_react46.useContext)(EventTrackingContext);
+  const currentProvider = (0, import_react46.useRef)(null);
+  (0, import_react46.useEffect)(() => {
     if (currentProvider.current) {
       currentProvider.current.dispose();
       if (schema && schema.length !== 0) {
@@ -47370,7 +47493,7 @@ var SQLEditorComponent = ({
           children: /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(LoadingComponent, {})
         }
       ) : /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
-        import_react46.default,
+        import_react47.default,
         {
           height: "100%",
           width: "100%",
@@ -47567,7 +47690,7 @@ function SchemaItem({
   index,
   onClick
 }) {
-  const [isOpen, setIsOpen] = (0, import_react45.useState)(index === 0);
+  const [isOpen, setIsOpen] = (0, import_react46.useState)(index === 0);
   const schemaContainerStyle = {
     display: "flex",
     flexDirection: "column"
@@ -47794,11 +47917,11 @@ function SchemaItem({
 }
 
 // src/ReportBuilder.tsx
-var import_react53 = require("react");
+var import_react54 = require("react");
 init_constants();
 
 // src/hooks/useReportBuilder.tsx
-var import_react47 = require("react");
+var import_react48 = require("react");
 init_tableProcessing();
 init_ReportBuilder();
 init_constants();
@@ -47818,19 +47941,19 @@ var useReportBuilderInternal = ({
   rowsPerRequest
 }) => {
   const { allReportsById } = useAllReports();
-  const [schemaData] = (0, import_react47.useContext)(SchemaDataContext);
+  const [schemaData] = (0, import_react48.useContext)(SchemaDataContext);
   const { dashboards } = useDashboards();
   const {
     data,
     isLoading: dashboardIsLoading,
     reload
   } = useDashboardInternal(destinationDashboard);
-  const { getToken } = (0, import_react47.useContext)(FetchContext);
-  const { eventTracking } = (0, import_react47.useContext)(EventTrackingContext);
-  const destinationDashboardConfig = (0, import_react47.useMemo)(() => {
+  const { getToken } = (0, import_react48.useContext)(FetchContext);
+  const { eventTracking } = (0, import_react48.useContext)(EventTrackingContext);
+  const destinationDashboardConfig = (0, import_react48.useMemo)(() => {
     return dashboards?.find((d) => d.name === destinationDashboard);
   }, [dashboards, destinationDashboard]);
-  const filteredSchema = (0, import_react47.useMemo)(() => {
+  const filteredSchema = (0, import_react48.useMemo)(() => {
     return schemaData.schemaWithCustomFields?.filter((table) => {
       return destinationDashboardConfig?.tenantKeys?.[0] === SINGLE_TENANT || !table.ownerTenantFields || table.ownerTenantFields?.length === 0 || table.ownerTenantFields?.includes(
         destinationDashboardConfig?.tenantKeys?.[0] ?? ""
@@ -47840,8 +47963,8 @@ var useReportBuilderInternal = ({
     schemaData.schemaWithCustomFields,
     destinationDashboardConfig?.tenantKeys
   ]);
-  const { tenants } = (0, import_react47.useContext)(TenantContext);
-  const [client] = (0, import_react47.useContext)(ClientContext);
+  const { tenants } = (0, import_react48.useContext)(TenantContext);
+  const [client] = (0, import_react48.useContext)(ClientContext);
   const _rowsPerRequest = rowsPerRequest ?? 100;
   const _rowsPerPage = Math.min(rowsPerPage ?? 20, _rowsPerRequest);
   const REPORT_BUILDER_PAGINATION = {
@@ -47849,19 +47972,19 @@ var useReportBuilderInternal = ({
     rowsPerPage: _rowsPerPage,
     rowsPerRequest: _rowsPerRequest
   };
-  const [openPopover, setOpenPopover] = (0, import_react47.useState)(null);
-  const [aiPrompt, setAiPrompt] = (0, import_react47.useState)("");
-  const [reportBuilderLoading, setReportBuilderLoading] = (0, import_react47.useState)(false);
-  const [tableLoading, setTableLoading] = (0, import_react47.useState)(false);
-  const [errorMessage, setErrorMessage] = (0, import_react47.useState)("");
-  const [unresolvedReportMessage, setUnresolvedReportMessage] = (0, import_react47.useState)("");
-  const [tables, setTables] = (0, import_react47.useState)([]);
-  const [columns, setColumns] = (0, import_react47.useState)([]);
-  const [filterStack, setFilterStack] = (0, import_react47.useState)([]);
-  const [pivot, setPivot] = (0, import_react47.useState)(null);
-  const [sort, setSort] = (0, import_react47.useState)([]);
-  const [limit, setLimit] = (0, import_react47.useState)(null);
-  const reportBuilderState = (0, import_react47.useMemo)(() => {
+  const [openPopover, setOpenPopover] = (0, import_react48.useState)(null);
+  const [aiPrompt, setAiPrompt] = (0, import_react48.useState)("");
+  const [reportBuilderLoading, setReportBuilderLoading] = (0, import_react48.useState)(false);
+  const [tableLoading, setTableLoading] = (0, import_react48.useState)(false);
+  const [errorMessage, setErrorMessage] = (0, import_react48.useState)("");
+  const [unresolvedReportMessage, setUnresolvedReportMessage] = (0, import_react48.useState)("");
+  const [tables, setTables] = (0, import_react48.useState)([]);
+  const [columns, setColumns] = (0, import_react48.useState)([]);
+  const [filterStack, setFilterStack] = (0, import_react48.useState)([]);
+  const [pivot, setPivot] = (0, import_react48.useState)(null);
+  const [sort, setSort] = (0, import_react48.useState)([]);
+  const [limit, setLimit] = (0, import_react48.useState)(null);
+  const reportBuilderState = (0, import_react48.useMemo)(() => {
     return {
       tables,
       columns,
@@ -47871,29 +47994,29 @@ var useReportBuilderInternal = ({
       limit
     };
   }, [columns, filterStack, limit, pivot, sort, tables]);
-  const [stateStack, setStateStack] = (0, import_react47.useState)([]);
-  const [poppedStateStack, setPoppedStateStack] = (0, import_react47.useState)([]);
-  const [unfilteredUniqueValues, setUnfilteredUniqueValues] = (0, import_react47.useState)({});
-  const [unfilteredUniqueValuesIsLoading, setUnfilteredUniqueValuesIsLoading] = (0, import_react47.useState)(false);
-  const [filteredUniqueValues, setFilteredUniqueValues] = (0, import_react47.useState)(null);
-  const [filteredUniqueValuesIsLoading, setFilteredUniqueValuesIsLoading] = (0, import_react47.useState)(false);
-  const [columnUniqueValues, setColumnUniqueValues] = (0, import_react47.useState)({});
-  const [dateRanges, setDateRanges] = (0, import_react47.useState)(null);
-  const [tempReport, setTempReport] = (0, import_react47.useState)({
+  const [stateStack, setStateStack] = (0, import_react48.useState)([]);
+  const [poppedStateStack, setPoppedStateStack] = (0, import_react48.useState)([]);
+  const [unfilteredUniqueValues, setUnfilteredUniqueValues] = (0, import_react48.useState)({});
+  const [unfilteredUniqueValuesIsLoading, setUnfilteredUniqueValuesIsLoading] = (0, import_react48.useState)(false);
+  const [filteredUniqueValues, setFilteredUniqueValues] = (0, import_react48.useState)(null);
+  const [filteredUniqueValuesIsLoading, setFilteredUniqueValuesIsLoading] = (0, import_react48.useState)(false);
+  const [columnUniqueValues, setColumnUniqueValues] = (0, import_react48.useState)({});
+  const [dateRanges, setDateRanges] = (0, import_react48.useState)(null);
+  const [tempReport, setTempReport] = (0, import_react48.useState)({
     ...EMPTY_INTERNAL_REPORT,
     pagination: REPORT_BUILDER_PAGINATION
   });
-  const [currentProcessing, setCurrentProcessing] = (0, import_react47.useState)({
+  const [currentProcessing, setCurrentProcessing] = (0, import_react48.useState)({
     page: REPORT_BUILDER_PAGINATION
   });
-  const [previousPage, setPreviousPage] = (0, import_react47.useState)(0);
-  const [reportColumns, setReportColumns] = (0, import_react47.useState)([]);
-  const [reportRows, setReportRows] = (0, import_react47.useState)([]);
-  const [formattedRows, setFormattedRows] = (0, import_react47.useState)([]);
-  const [pivotData, setPivotData] = (0, import_react47.useState)(null);
-  const [numberOfRows, setNumberOfRows] = (0, import_react47.useState)(0);
-  const [rowCountIsLoading, setRowCountIsLoading] = (0, import_react47.useState)(false);
-  const reportColumnsToStateColumns = (0, import_react47.useMemo)(() => {
+  const [previousPage, setPreviousPage] = (0, import_react48.useState)(0);
+  const [reportColumns, setReportColumns] = (0, import_react48.useState)([]);
+  const [reportRows, setReportRows] = (0, import_react48.useState)([]);
+  const [formattedRows, setFormattedRows] = (0, import_react48.useState)([]);
+  const [pivotData, setPivotData] = (0, import_react48.useState)(null);
+  const [numberOfRows, setNumberOfRows] = (0, import_react48.useState)(0);
+  const [rowCountIsLoading, setRowCountIsLoading] = (0, import_react48.useState)(false);
+  const reportColumnsToStateColumns = (0, import_react48.useMemo)(() => {
     const positionMap = {};
     columns.forEach((column, index) => {
       positionMap[column.field] = index;
@@ -47911,28 +48034,28 @@ var useReportBuilderInternal = ({
       }
     });
   }, [columns, reportColumns]);
-  const [pivotRowField, setPivotRowField] = (0, import_react47.useState)(
+  const [pivotRowField, setPivotRowField] = (0, import_react48.useState)(
     void 0
   );
-  const [pivotColumnField, setPivotColumnField] = (0, import_react47.useState)(
+  const [pivotColumnField, setPivotColumnField] = (0, import_react48.useState)(
     void 0
   );
-  const [pivotAggregations, setPivotAggregations] = (0, import_react47.useState)([]);
-  const [pivotLimit, setPivotLimit] = (0, import_react47.useState)(void 0);
-  const [pivotSort, setPivotSort] = (0, import_react47.useState)(void 0);
-  const [pivotHint, setPivotHint] = (0, import_react47.useState)("");
-  const [pivotError, setPivotError] = (0, import_react47.useState)("");
-  const [createdPivots, setCreatedPivots] = (0, import_react47.useState)([]);
-  const [recommendedPivots, setRecommendedPivots] = (0, import_react47.useState)([]);
-  const [pivotPopUpTitle, setPivotPopUpTitle] = (0, import_react47.useState)("Add pivot");
-  const [showPivotPopover, setShowPivotPopover] = (0, import_react47.useState)(false);
-  const [isEditingPivot, setIsEditingPivot] = (0, import_react47.useState)(false);
-  const [selectedPivotIndex, setSelectedPivotIndex] = (0, import_react47.useState)(-1);
+  const [pivotAggregations, setPivotAggregations] = (0, import_react48.useState)([]);
+  const [pivotLimit, setPivotLimit] = (0, import_react48.useState)(void 0);
+  const [pivotSort, setPivotSort] = (0, import_react48.useState)(void 0);
+  const [pivotHint, setPivotHint] = (0, import_react48.useState)("");
+  const [pivotError, setPivotError] = (0, import_react48.useState)("");
+  const [createdPivots, setCreatedPivots] = (0, import_react48.useState)([]);
+  const [recommendedPivots, setRecommendedPivots] = (0, import_react48.useState)([]);
+  const [pivotPopUpTitle, setPivotPopUpTitle] = (0, import_react48.useState)("Add pivot");
+  const [showPivotPopover, setShowPivotPopover] = (0, import_react48.useState)(false);
+  const [isEditingPivot, setIsEditingPivot] = (0, import_react48.useState)(false);
+  const [selectedPivotIndex, setSelectedPivotIndex] = (0, import_react48.useState)(-1);
   const [
     pivotRecommendationsEnabledState,
     setPivotRecommendationsEnabledState
-  ] = (0, import_react47.useState)(pivotRecommendationsEnabled);
-  const [askAILoading, setAskAILoading] = (0, import_react47.useState)(false);
+  ] = (0, import_react48.useState)(pivotRecommendationsEnabled);
+  const [askAILoading, setAskAILoading] = (0, import_react48.useState)(false);
   const loading = reportBuilderLoading || tableLoading;
   useLongLoading(reportBuilderLoading, {
     origin: "ReportBuilder",
@@ -47946,7 +48069,7 @@ var useReportBuilderInternal = ({
     origin: "ReportBuilder",
     loadDescription: "Loading ask AI"
   });
-  const isSelectStar = (0, import_react47.useMemo)(() => {
+  const isSelectStar = (0, import_react48.useMemo)(() => {
     if (tables.length === 1) {
       const totalColumnLength = tables.reduce((acc, table) => {
         const tableColumns = filteredSchema.find((t) => t.name === table.name)?.columns.length ?? 0;
@@ -47957,14 +48080,14 @@ var useReportBuilderInternal = ({
       return false;
     }
   }, [tables, columns, filteredSchema]);
-  const mssqlSortWarning = (0, import_react47.useMemo)(() => {
+  const mssqlSortWarning = (0, import_react48.useMemo)(() => {
     if (!client || client?.databaseType !== "mssql") {
       return void 0;
     } else if (!pivot && !limit) {
       return "Please add a limit.";
     }
   }, [client, limit, pivot]);
-  const foreignKeyMap = (0, import_react47.useMemo)(() => {
+  const foreignKeyMap = (0, import_react48.useMemo)(() => {
     return getSchemaForeignKeyMapping(filteredSchema);
   }, [filteredSchema]);
   const clearAllState = (resetStateStack = true) => {
@@ -49016,7 +49139,7 @@ var useReportBuilderInternal = ({
       flags: tempReport?.flags
     });
   };
-  (0, import_react47.useEffect)(() => {
+  (0, import_react48.useEffect)(() => {
     if (!client) {
       return;
     }
@@ -49029,7 +49152,7 @@ var useReportBuilderInternal = ({
       clearAllState();
     }
   }, [client]);
-  (0, import_react47.useEffect)(() => {
+  (0, import_react48.useEffect)(() => {
     const loadChart = async () => {
       let report;
       if (!client) {
@@ -49086,7 +49209,7 @@ var useReportBuilderInternal = ({
       loadChart();
     }
   }, [allReportsById[reportId || ""], client]);
-  (0, import_react47.useEffect)(() => {
+  (0, import_react48.useEffect)(() => {
     if (initialTableName) {
       const tableColumns = filteredSchema.find((table) => {
         return table.name === initialTableName;
@@ -49106,7 +49229,7 @@ var useReportBuilderInternal = ({
       }
     }
   }, [filteredSchema, initialTableName]);
-  (0, import_react47.useEffect)(() => {
+  (0, import_react48.useEffect)(() => {
     if (!data && !dashboardIsLoading) {
       reload();
     }
@@ -49268,7 +49391,7 @@ var useReportBuilder = ({
     reportBuilder.setAiPrompt(prompt);
     await reportBuilder.fetchAstFromPromptHelper(prompt);
   };
-  const cleanedSchema = (0, import_react47.useMemo)(() => {
+  const cleanedSchema = (0, import_react48.useMemo)(() => {
     return reportBuilder.filteredSchema.reduce(
       (acc, table) => {
         acc[table.name] = table.columns;
@@ -49277,7 +49400,7 @@ var useReportBuilder = ({
       {}
     );
   }, [reportBuilder.filteredSchema]);
-  const cleanedFilterStack = (0, import_react47.useMemo)(() => {
+  const cleanedFilterStack = (0, import_react48.useMemo)(() => {
     return reportBuilder.filterStack.map((filter) => {
       return filter.value ? convertInternalFilterToFilter(filter.value) : null;
     }).filter((filter) => filter !== null);
@@ -49314,7 +49437,7 @@ var useReportBuilder = ({
 init_ReportBuilder();
 
 // src/components/ReportBuilder/AddColumnModal.tsx
-var import_react48 = require("react");
+var import_react49 = require("react");
 var import_core2 = require("@dnd-kit/core");
 var import_sortable2 = require("@dnd-kit/sortable");
 var import_utilities2 = require("@dnd-kit/utilities");
@@ -49336,17 +49459,17 @@ function AddColumnModal({
   LoadingComponent = QuillLoadingComponent,
   onRequestAddVirtualTable
 }) {
-  const [primaryTable, setPrimaryTable] = (0, import_react48.useState)(
+  const [primaryTable, setPrimaryTable] = (0, import_react49.useState)(
     selectedTables[0]?.name
   );
-  const [theme] = (0, import_react48.useContext)(ThemeContext);
-  const [search, setSearch] = (0, import_react48.useState)("");
-  const [initialLoad, setInitialLoad] = (0, import_react48.useState)(true);
-  const textInputContainerRef = (0, import_react48.useRef)(null);
-  const [modalSelectedColumns, setModalSelectedColumns] = (0, import_react48.useState)(
+  const [theme] = (0, import_react49.useContext)(ThemeContext);
+  const [search, setSearch] = (0, import_react49.useState)("");
+  const [initialLoad, setInitialLoad] = (0, import_react49.useState)(true);
+  const textInputContainerRef = (0, import_react49.useRef)(null);
+  const [modalSelectedColumns, setModalSelectedColumns] = (0, import_react49.useState)(
     selectedColumns.map((col) => `${col.table}.${col.field}`)
   );
-  const columnOptions = (0, import_react48.useMemo)(() => {
+  const columnOptions = (0, import_react49.useMemo)(() => {
     return schema.filter((table) => {
       if (!primaryTable) return true;
       return table.name === primaryTable || foreignKeyMap[primaryTable]?.some(
@@ -49370,20 +49493,20 @@ function AddColumnModal({
       })
     );
   }, [schema, primaryTable]);
-  const [orderedColumnNames, setOrderedColumnNames] = (0, import_react48.useState)([]);
+  const [orderedColumnNames, setOrderedColumnNames] = (0, import_react49.useState)([]);
   const isSelectedAllColumns = columnOptions.length === modalSelectedColumns.length;
-  const searchResults = (0, import_react48.useMemo)(() => {
+  const searchResults = (0, import_react49.useMemo)(() => {
     return orderedColumnNames.filter((column) => {
       return columnOptions.includes(column) && (search.length === 0 || column.toLowerCase().includes(search.toLowerCase()) || snakeAndCamelCaseToTitleCase(column).toLowerCase().includes(search.toLowerCase()));
     });
   }, [search, columnOptions, orderedColumnNames]);
-  (0, import_react48.useEffect)(() => {
+  (0, import_react49.useEffect)(() => {
     const remainingColumns = columnOptions.filter(
       (col) => !modalSelectedColumns.includes(col)
     );
     setOrderedColumnNames([...modalSelectedColumns, ...remainingColumns]);
   }, [columnOptions]);
-  (0, import_react48.useEffect)(() => {
+  (0, import_react49.useEffect)(() => {
     if (!schemaLoading && initialLoad) {
       setTimeout(() => setInitialLoad(false), 200);
     }
@@ -49735,7 +49858,7 @@ function DraggableItem({
 
 // src/components/ReportBuilder/DraggableColumns.tsx
 var import_sortable4 = require("@dnd-kit/sortable");
-var import_react49 = require("react");
+var import_react50 = require("react");
 init_textProcessing();
 var import_jsx_runtime69 = require("react/jsx-runtime");
 function DraggableColumns({
@@ -49750,7 +49873,7 @@ function DraggableColumns({
       coordinateGetter: import_sortable4.sortableKeyboardCoordinates
     })
   );
-  const columnNames = (0, import_react49.useMemo)(() => {
+  const columnNames = (0, import_react50.useMemo)(() => {
     return columns.map(
       (col) => `${col.table}.${col.alias ?? col.field}`
     );
@@ -50254,7 +50377,7 @@ var AddFilters = ({
 };
 
 // src/internals/ReportBuilder/PivotForm.tsx
-var import_react50 = require("react");
+var import_react51 = require("react");
 init_textProcessing();
 init_pivotProcessing();
 var import_jsx_runtime73 = require("react/jsx-runtime");
@@ -50283,22 +50406,22 @@ function PivotForm({
   isLoading,
   pivotHint
 }) {
-  const [allowedColumnFields, setAllowedColumnFields] = (0, import_react50.useState)([]);
-  const [allowedRowFields, setAllowedRowFields] = (0, import_react50.useState)([]);
-  const [allowedValueFields, setAllowedValueFields] = (0, import_react50.useState)([]);
-  const [theme] = (0, import_react50.useContext)(ThemeContext);
-  const [limitInput, setLimitInput] = (0, import_react50.useState)(
+  const [allowedColumnFields, setAllowedColumnFields] = (0, import_react51.useState)([]);
+  const [allowedRowFields, setAllowedRowFields] = (0, import_react51.useState)([]);
+  const [allowedValueFields, setAllowedValueFields] = (0, import_react51.useState)([]);
+  const [theme] = (0, import_react51.useContext)(ThemeContext);
+  const [limitInput, setLimitInput] = (0, import_react51.useState)(
     pivotLimit?.toString() ?? ""
   );
-  const [sortFieldInput, setSortFieldInput] = (0, import_react50.useState)(
+  const [sortFieldInput, setSortFieldInput] = (0, import_react51.useState)(
     pivotSort?.sortField ?? ""
   );
-  const [sortDirectionInput, setSortDirectionInput] = (0, import_react50.useState)(
+  const [sortDirectionInput, setSortDirectionInput] = (0, import_react51.useState)(
     pivotSort?.sortDirection ?? ""
   );
-  const [showLimitInput, setShowLimitInput] = (0, import_react50.useState)(!!pivotLimit);
-  const [showSortInput, setShowSortInput] = (0, import_react50.useState)(!!pivotSort);
-  (0, import_react50.useEffect)(() => {
+  const [showLimitInput, setShowLimitInput] = (0, import_react51.useState)(!!pivotLimit);
+  const [showSortInput, setShowSortInput] = (0, import_react51.useState)(!!pivotSort);
+  (0, import_react51.useEffect)(() => {
     if (uniqueValues) {
       const possibleColumns = getPossiblePivotFieldOptions(
         columns,
@@ -50309,12 +50432,12 @@ function PivotForm({
       setAllowedValueFields(possibleColumns.valueFields);
     }
   }, [columns, uniqueValues]);
-  (0, import_react50.useEffect)(() => {
+  (0, import_react51.useEffect)(() => {
     setSortFieldInput(pivotSort?.sortField ?? "");
     setSortDirectionInput(pivotSort?.sortDirection ?? "");
     setShowSortInput(!!pivotSort);
   }, [pivotSort]);
-  (0, import_react50.useEffect)(() => {
+  (0, import_react51.useEffect)(() => {
     setLimitInput(pivotLimit?.toString() ?? "");
     setShowLimitInput(!!pivotLimit);
   }, [pivotLimit]);
@@ -50926,7 +51049,7 @@ var AddPivot = ({
 };
 
 // src/components/ReportBuilder/AddLimitPopover.tsx
-var import_react51 = require("react");
+var import_react52 = require("react");
 var import_jsx_runtime75 = require("react/jsx-runtime");
 var LimitSentence = ({
   limit,
@@ -50941,7 +51064,7 @@ var LimitSentence = ({
   SecondaryButton = MemoizedSecondaryButton,
   disabled = false
 }) => {
-  const [isOpen, setIsOpen] = (0, import_react51.useState)(false);
+  const [isOpen, setIsOpen] = (0, import_react52.useState)(false);
   const handleClickDelete = () => {
     setOpenPopover(null);
     handleDelete();
@@ -50983,7 +51106,7 @@ var AddLimitPopover = ({
   Button = MemoizedButton,
   SecondaryButton = MemoizedSecondaryButton
 }) => {
-  const [limit, setLimit] = (0, import_react51.useState)(initialLimit.toString());
+  const [limit, setLimit] = (0, import_react52.useState)(initialLimit.toString());
   const MAX_LIMIT = 2147483647;
   return /* @__PURE__ */ (0, import_jsx_runtime75.jsxs)("div", { style: { display: "flex", flexDirection: "column", gap: 12 }, children: [
     /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(
@@ -51224,7 +51347,7 @@ var AddLimit = ({
 };
 
 // src/components/ReportBuilder/AddSortPopover.tsx
-var import_react52 = require("react");
+var import_react53 = require("react");
 init_textProcessing();
 var import_jsx_runtime77 = require("react/jsx-runtime");
 var SORT_VALUE_TO_LABEL = {
@@ -51248,7 +51371,7 @@ var SortSentence = ({
   SecondaryButton = MemoizedSecondaryButton,
   disabled = false
 }) => {
-  const [isOpen, setIsOpen] = (0, import_react52.useState)(false);
+  const [isOpen, setIsOpen] = (0, import_react53.useState)(false);
   const handleSetIsOpen = (isOpen2) => {
     setIsOpen(isOpen2);
   };
@@ -51300,8 +51423,8 @@ var AddSortPopover = ({
   Button = MemoizedButton,
   SecondaryButton = MemoizedSecondaryButton
 }) => {
-  const [sortColumn, setSortColumn] = (0, import_react52.useState)(column || "");
-  const [sortDirection, setSortDirection] = (0, import_react52.useState)(
+  const [sortColumn, setSortColumn] = (0, import_react53.useState)(column || "");
+  const [sortDirection, setSortDirection] = (0, import_react53.useState)(
     direction || "ASC"
   );
   return /* @__PURE__ */ (0, import_jsx_runtime77.jsxs)("div", { style: { display: "flex", flexDirection: "column", gap: 12 }, children: [
@@ -51779,15 +51902,14 @@ function ReportBuilder({
   onRequestAddVirtualTable,
   submitButtonLabel
 }) {
-  const [theme] = (0, import_react53.useContext)(ThemeContext);
-  const [client] = (0, import_react53.useContext)(ClientContext);
-  const { getToken } = (0, import_react53.useContext)(FetchContext);
-  const parentRef = (0, import_react53.useRef)(null);
-  const askAIContainerRef = (0, import_react53.useRef)(null);
-  const [askAIInputWidth, setAskAIInputWidth] = (0, import_react53.useState)(-1);
-  const [isCopying, setIsCopying] = (0, import_react53.useState)(false);
-  const [isChartBuilderOpen, setIsChartBuilderOpen] = (0, import_react53.useState)(false);
-  const [isSaveQueryModalOpen, setIsSaveQueryModalOpen] = (0, import_react53.useState)(false);
+  const [theme] = (0, import_react54.useContext)(ThemeContext);
+  const [client] = (0, import_react54.useContext)(ClientContext);
+  const { getToken } = (0, import_react54.useContext)(FetchContext);
+  const parentRef = (0, import_react54.useRef)(null);
+  const askAIFormRef = (0, import_react54.useRef)(null);
+  const [isCopying, setIsCopying] = (0, import_react54.useState)(false);
+  const [isChartBuilderOpen, setIsChartBuilderOpen] = (0, import_react54.useState)(false);
+  const [isSaveQueryModalOpen, setIsSaveQueryModalOpen] = (0, import_react54.useState)(false);
   const reportBuilder = useReportBuilderInternal({
     reportId,
     initialTableName,
@@ -51827,6 +51949,12 @@ function ReportBuilder({
     onSaveQuery,
     onSaveReport
   } = reportBuilder;
+  const askAIInputWidth = useResponsiveFirstChildWidth_default(askAIFormRef, {
+    gap: 12,
+    initialWidth: 320,
+    minWidth: 160
+  });
+  const normalizedAskAIInputWidth = askAIInputWidth > 0 ? askAIInputWidth : 160;
   const copySQLToClipboard = async () => {
     let query = "";
     if (pivot && pivotData) {
@@ -51849,17 +51977,7 @@ function ReportBuilder({
       setTimeout(() => setIsCopying(false), 800);
     }
   };
-  (0, import_react53.useEffect)(() => {
-    function handleResize() {
-      updateFirstChildWidth(askAIContainerRef, setAskAIInputWidth, { gap: 12 });
-    }
-    handleResize();
-    window.addEventListener("resize", handleResize);
-    return () => {
-      window.removeEventListener("resize", handleResize);
-    };
-  }, []);
-  (0, import_react53.useEffect)(() => {
+  (0, import_react54.useEffect)(() => {
     if (isChartBuilderOpen === false) {
       onCloseChartBuilder && onCloseChartBuilder();
     }
@@ -51977,10 +52095,10 @@ function ReportBuilder({
                 /* @__PURE__ */ (0, import_jsx_runtime81.jsx)("div", { style: { width: "100%", minHeight: "30vh" } })
               ] }),
               /* @__PURE__ */ (0, import_jsx_runtime81.jsxs)(ContainerComponent, { children: [
-                isAIEnabled && /* @__PURE__ */ (0, import_jsx_runtime81.jsx)(
+                isAIEnabled && /* @__PURE__ */ (0, import_jsx_runtime81.jsxs)(
                   "form",
                   {
-                    ref: askAIContainerRef,
+                    ref: askAIFormRef,
                     onSubmit: (event) => {
                       event.preventDefault();
                     },
@@ -51988,15 +52106,17 @@ function ReportBuilder({
                       display: "flex",
                       flexDirection: "row",
                       gap: 12,
-                      visibility: askAIInputWidth === -1 ? "hidden" : "visible"
+                      flexWrap: "wrap",
+                      alignItems: "stretch",
+                      visibility: normalizedAskAIInputWidth > 0 ? "visible" : "hidden"
                     },
-                    children: /* @__PURE__ */ (0, import_jsx_runtime81.jsxs)(import_jsx_runtime81.Fragment, { children: [
+                    children: [
                       /* @__PURE__ */ (0, import_jsx_runtime81.jsx)(
                         TextInputComponent,
                         {
                           id: "ask_ai_input_bar",
                           value: aiPrompt,
-                          width: askAIInputWidth,
+                          width: normalizedAskAIInputWidth,
                           onChange: (e) => setAiPrompt(e.target.value),
                           placeholder: "Ask a question..."
                         }
@@ -52034,7 +52154,7 @@ function ReportBuilder({
                           disabled: columns.length === 0 || loading
                         }
                       )
-                    ] })
+                    ]
                   }
                 ),
                 columns.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime81.jsx)(
@@ -52289,7 +52409,7 @@ function ReportBuilder({
 }
 
 // src/ChartEditor.tsx
-var import_react54 = require("react");
+var import_react55 = require("react");
 var import_jsx_runtime82 = require("react/jsx-runtime");
 function ChartEditor({
   isOpen,
@@ -52336,19 +52456,19 @@ function ChartEditor({
   onClickChartElement,
   onClickChartError
 }) {
-  const parentRef = (0, import_react54.useRef)(null);
-  const [modalWidth, setModalWidth] = (0, import_react54.useState)(200);
-  const [modalHeight, setModalHeight] = (0, import_react54.useState)(200);
+  const parentRef = (0, import_react55.useRef)(null);
+  const [modalWidth, setModalWidth] = (0, import_react55.useState)(200);
+  const [modalHeight, setModalHeight] = (0, import_react55.useState)(200);
   const { addReport } = useDashboardReports(destinationDashboard);
   const { allReportsById } = useAllReports();
-  const { tenants, flags } = (0, import_react54.useContext)(TenantContext);
-  const { getToken } = (0, import_react54.useContext)(FetchContext);
+  const { tenants, flags } = (0, import_react55.useContext)(TenantContext);
+  const { getToken } = (0, import_react55.useContext)(FetchContext);
   const report = allReportsById[reportId];
-  const [client, isClientLoading] = (0, import_react54.useContext)(ClientContext);
-  const [schemaData] = (0, import_react54.useContext)(SchemaDataContext);
-  const { dashboardFilters } = (0, import_react54.useContext)(DashboardFiltersContext);
-  const { eventTracking } = (0, import_react54.useContext)(EventTrackingContext);
-  const specificDashboardFilters = (0, import_react54.useMemo)(() => {
+  const [client, isClientLoading] = (0, import_react55.useContext)(ClientContext);
+  const [schemaData] = (0, import_react55.useContext)(SchemaDataContext);
+  const { dashboardFilters } = (0, import_react55.useContext)(DashboardFiltersContext);
+  const { eventTracking } = (0, import_react55.useContext)(EventTrackingContext);
+  const specificDashboardFilters = (0, import_react55.useMemo)(() => {
     if (!report) {
       return [];
     }
@@ -52356,15 +52476,15 @@ function ChartEditor({
       (f) => f.filter
     );
   }, [dashboardFilters]);
-  const [filtersEnabled, setFiltersEnabled] = (0, import_react54.useState)(true);
-  const [chartBuilderKey, setChartBuilderKey] = (0, import_react54.useState)(0);
+  const [filtersEnabled, setFiltersEnabled] = (0, import_react55.useState)(true);
+  const [chartBuilderKey, setChartBuilderKey] = (0, import_react55.useState)(0);
   const dateFilter = Object.values(specificDashboardFilters).find(
     (filter) => filter.filterType === "date_range"
   );
-  const dateRange = (0, import_react54.useMemo)(() => {
+  const dateRange = (0, import_react55.useMemo)(() => {
     return dateFilter?.startDate ? { start: dateFilter.startDate, end: dateFilter.endDate } : void 0;
   }, [dateFilter]);
-  (0, import_react54.useEffect)(() => {
+  (0, import_react55.useEffect)(() => {
     function handleResize() {
       const screenSize = window.innerWidth;
       if (screenSize >= 1200) {
@@ -52412,7 +52532,7 @@ function ChartEditor({
     }
     addReport(report2);
   };
-  (0, import_react54.useEffect)(() => {
+  (0, import_react55.useEffect)(() => {
     if (!isClientLoading && !report) {
       fetchReportHelper();
     }
@@ -52560,7 +52680,7 @@ function StaticChart({
 init_valueFormatter();
 
 // src/hooks/useTenants.ts
-var import_react55 = require("react");
+var import_react56 = require("react");
 var useTenants = (dashboardName) => {
   const {
     tenants,
@@ -52573,13 +52693,13 @@ var useTenants = (dashboardName) => {
     fetchMappedTenantsForDashboard,
     getMappedTenantsForDashboard,
     getViewerTenantsByOwner
-  } = (0, import_react55.useContext)(TenantContext);
-  (0, import_react55.useEffect)(() => {
+  } = (0, import_react56.useContext)(TenantContext);
+  (0, import_react56.useEffect)(() => {
     if (dashboardName) {
       fetchViewerTenantsForDashboard(dashboardName);
     }
   }, [dashboardName, fetchViewerTenantsForDashboard]);
-  (0, import_react55.useEffect)(() => {
+  (0, import_react56.useEffect)(() => {
     if (dashboardName) {
       fetchMappedTenantsForDashboard(dashboardName);
     }
@@ -52598,33 +52718,33 @@ var useTenants = (dashboardName) => {
 };
 
 // src/hooks/useQuill.ts
-var import_react56 = require("react");
+var import_react57 = require("react");
 init_paginationProcessing();
 init_tableProcessing();
 init_dataProcessing();
 var useQuill = (reportId, pagination) => {
-  const { reports, reportsDispatch, fetchIndividualReport } = (0, import_react56.useContext)(ReportsContext);
+  const { reports, reportsDispatch, fetchIndividualReport } = (0, import_react57.useContext)(ReportsContext);
   const { allReportsById } = useAllReports();
-  const { getToken } = (0, import_react56.useContext)(FetchContext);
-  const dashboardReport = (0, import_react56.useMemo)(() => {
+  const { getToken } = (0, import_react57.useContext)(FetchContext);
+  const dashboardReport = (0, import_react57.useMemo)(() => {
     return allReportsById[reportId ?? ""];
   }, [allReportsById[reportId ?? ""]]);
-  const { dashboardFilters, dashboardCustomFilters } = (0, import_react56.useContext)(
+  const { dashboardFilters, dashboardCustomFilters } = (0, import_react57.useContext)(
     DashboardFiltersContext
   );
-  const { reportFilters, customReportFilters, reportFiltersDispatch } = (0, import_react56.useContext)(ReportFiltersContext);
-  const specificReportFilters = (0, import_react56.useMemo)(() => {
+  const { reportFilters, customReportFilters, reportFiltersDispatch } = (0, import_react57.useContext)(ReportFiltersContext);
+  const specificReportFilters = (0, import_react57.useMemo)(() => {
     if (!reportId) return null;
     return Object.values(reportFilters[reportId] ?? []).map((f) => f.filter);
   }, [reportFilters, reportId]);
-  const [schemaData] = (0, import_react56.useContext)(SchemaDataContext);
-  const [client, isClientLoading] = (0, import_react56.useContext)(ClientContext);
-  const { tenants } = (0, import_react56.useContext)(TenantContext);
-  const { eventTracking } = (0, import_react56.useContext)(EventTrackingContext);
-  const [loading, setLoading] = (0, import_react56.useState)(true);
-  const [error, setError] = (0, import_react56.useState)(void 0);
-  const [previousPage, setPreviousPage] = (0, import_react56.useState)(0);
-  const processedReport = (0, import_react56.useMemo)(() => {
+  const [schemaData] = (0, import_react57.useContext)(SchemaDataContext);
+  const [client, isClientLoading] = (0, import_react57.useContext)(ClientContext);
+  const { tenants } = (0, import_react57.useContext)(TenantContext);
+  const { eventTracking } = (0, import_react57.useContext)(EventTrackingContext);
+  const [loading, setLoading] = (0, import_react57.useState)(true);
+  const [error, setError] = (0, import_react57.useState)(void 0);
+  const [previousPage, setPreviousPage] = (0, import_react57.useState)(0);
+  const processedReport = (0, import_react57.useMemo)(() => {
     return reportId && allReportsById[reportId] ? convertInternalReportToReport(
       mergeComparisonRange(allReportsById[reportId]),
       specificReportFilters ?? [],
@@ -52632,7 +52752,7 @@ var useQuill = (reportId, pagination) => {
       "useQuill"
     ) : void 0;
   }, [reportId, reportId && allReportsById[reportId], specificReportFilters]);
-  const [additionalProcessing, setAdditionProcessing] = (0, import_react56.useState)(
+  const [additionalProcessing, setAdditionProcessing] = (0, import_react57.useState)(
     pagination ? {
       page: pagination
     } : void 0
@@ -52781,7 +52901,7 @@ var useQuill = (reportId, pagination) => {
       setLoading(false);
     }
   };
-  (0, import_react56.useEffect)(() => {
+  (0, import_react57.useEffect)(() => {
     if (isClientLoading) return;
     if (reportId && specificReportFilters) {
       fetchReportHelper(reportId, {
@@ -52821,10 +52941,10 @@ var useQuill = (reportId, pagination) => {
 
 // src/hooks/useFormat.ts
 init_valueFormatter();
-var import_react57 = require("react");
+var import_react58 = require("react");
 var useMemoizedRows = (reportId) => {
   const { data } = useQuill(reportId);
-  const formattedRows = (0, import_react57.useMemo)(() => {
+  const formattedRows = (0, import_react58.useMemo)(() => {
     if (!data || !data.rows || !data.columns)
       return { rows: [], loading: true };
     return {
@@ -52848,7 +52968,7 @@ var useMemoizedRows = (reportId) => {
 };
 
 // src/hooks/useAskQuill.tsx
-var import_react58 = require("react");
+var import_react59 = require("react");
 init_astProcessing();
 init_astFilterProcessing();
 init_pivotProcessing();
@@ -52876,13 +52996,13 @@ function convertColumnInternalToAskQuillColumn(columns) {
   });
 }
 var useAskQuill = (dashboardName) => {
-  const [client] = (0, import_react58.useContext)(ClientContext);
-  const [schemaData] = (0, import_react58.useContext)(SchemaDataContext);
-  const { tenants } = (0, import_react58.useContext)(TenantContext);
-  const { getToken } = (0, import_react58.useContext)(FetchContext);
-  const { eventTracking } = (0, import_react58.useContext)(EventTrackingContext);
-  const [astInfo, setAstInfo] = (0, import_react58.useState)(void 0);
-  const [data, setData] = (0, import_react58.useState)({
+  const [client] = (0, import_react59.useContext)(ClientContext);
+  const [schemaData] = (0, import_react59.useContext)(SchemaDataContext);
+  const { tenants } = (0, import_react59.useContext)(TenantContext);
+  const { getToken } = (0, import_react59.useContext)(FetchContext);
+  const { eventTracking } = (0, import_react59.useContext)(EventTrackingContext);
+  const [astInfo, setAstInfo] = (0, import_react59.useState)(void 0);
+  const [data, setData] = (0, import_react59.useState)({
     rows: [],
     columns: [],
     pivot: null,
@@ -52892,9 +53012,9 @@ var useAskQuill = (dashboardName) => {
     pivotColumnFields: [],
     pivotValueFields: []
   });
-  const [loading, setLoading] = (0, import_react58.useState)(false);
-  const [error, setError] = (0, import_react58.useState)(void 0);
-  const [ask, setAsk] = (0, import_react58.useState)(
+  const [loading, setLoading] = (0, import_react59.useState)(false);
+  const [error, setError] = (0, import_react59.useState)(void 0);
+  const [ask, setAsk] = (0, import_react59.useState)(
     async () => void 0
   );
   const askHelper = async (query) => {
@@ -53094,7 +53214,7 @@ var useAskQuill = (dashboardName) => {
     });
     setLoading(false);
   };
-  (0, import_react58.useEffect)(() => {
+  (0, import_react59.useEffect)(() => {
     setAsk(() => askHelper);
   }, [schemaData.schema]);
   return {
@@ -53108,13 +53228,13 @@ var useAskQuill = (dashboardName) => {
 };
 
 // src/hooks/useVirtualTables.tsx
-var import_react59 = require("react");
+var import_react60 = require("react");
 var useVirtualTables = () => {
-  const [schemaData, setSchemaData] = (0, import_react59.useContext)(SchemaDataContext);
-  const { tenants } = (0, import_react59.useContext)(TenantContext);
-  const { getToken, quillFetchWithToken } = (0, import_react59.useContext)(FetchContext);
-  const { eventTracking } = (0, import_react59.useContext)(EventTrackingContext);
-  const [loadingTables, setLoadingTables] = (0, import_react59.useState)({});
+  const [schemaData, setSchemaData] = (0, import_react60.useContext)(SchemaDataContext);
+  const { tenants } = (0, import_react60.useContext)(TenantContext);
+  const { getToken, quillFetchWithToken } = (0, import_react60.useContext)(FetchContext);
+  const { eventTracking } = (0, import_react60.useContext)(EventTrackingContext);
+  const [loadingTables, setLoadingTables] = (0, import_react60.useState)({});
   const handleReload = async (client, caller) => {
     setSchemaData({ ...schemaData, isSchemaLoading: true });
     setLoadingTables(