@quillsql/react 2.16.22 → 2.16.23

package/dist/index.js

@@ -1569,6 +1569,7 @@ var init_dateRangePickerUtils = __esm({
     };
     convertPresetOptionsToSelectableList = (customIntervals, defaultIntervals) => {
       const customLabelMap = /* @__PURE__ */ new Map();
+      const displayLabelByValue = /* @__PURE__ */ new Map();
       defaultIntervals.forEach((interval2) => {
         if (interval2.customLabel) {
           customLabelMap.set(interval2.label, interval2.customLabel);
@@ -1738,11 +1739,14 @@ var init_dateRangePickerUtils = __esm({
             }
           ];
         }
-        if (interval2.customLabel && createdIntervals.length > 0) {
-          return createdIntervals.map((i) => ({
-            ...i,
-            label: interval2.customLabel
-          }));
+        if (createdIntervals.length > 0) {
+          const displayLabel = interval2.customLabel ?? interval2.label;
+          createdIntervals.forEach((createdInterval) => {
+            const canonicalValue = getLabelForCustomInterval(createdInterval).toUpperCase().replace(/ /g, "_");
+            if (displayLabel && canonicalValue) {
+              displayLabelByValue.set(canonicalValue, displayLabel);
+            }
+          });
         }
         return createdIntervals;
       });
@@ -1798,9 +1802,10 @@ var init_dateRangePickerUtils = __esm({
                 customLabel2 = customLabelMap.get("This year") || customLabelMap.get("Yearly");
               }
             }
+            const value2 = getLabelForSubInterval(currentSubInterval).toUpperCase().replace(/ /g, "_") ?? "";
             presets.push({
-              label: customLabel2 || baseLabel,
-              value: getLabelForSubInterval(currentSubInterval).toUpperCase().replace(/ /g, "_") ?? "",
+              label: displayLabelByValue.get(value2) || customLabel2 || baseLabel,
+              value: value2,
               startDate: set(/* @__PURE__ */ new Date(), {
                 year: currentYear,
                 month: currentSubInterval.startDate.month - 1,
@@ -1832,13 +1837,14 @@ var init_dateRangePickerUtils = __esm({
         }
         const dateRange = convertCustomIntervalToDateRange(option);
         const generatedLabel = getLabelForCustomInterval(option);
+        const value = getLabelForCustomInterval(option).toUpperCase().replace(/ /g, "_") ?? "";
         const customLabel = customLabelMap.get(generatedLabel);
-        const finalLabel = customLabel || generatedLabel;
+        const finalLabel = displayLabelByValue.get(value) || customLabel || generatedLabel;
         return [
           {
             label: finalLabel,
             // Value is option label in uppercase with spaces replaced by underscores
-            value: getLabelForCustomInterval(option).toUpperCase().replace(/ /g, "_") ?? "",
+            value,
             startDate: dateRange.startDate,
             endDate: dateRange.endDate
           }
@@ -2034,7 +2040,10 @@ var init_dateRangePickerUtils = __esm({
     getRangeFromPresetOptions = (preset, presetOptions) => {
       const foundPreset = presetOptions.find((elem) => elem.value === preset);
       if (foundPreset) {
-        return { startDate: foundPreset?.startDate, endDate: foundPreset?.endDate };
+        return {
+          startDate: foundPreset.startDate ? startOfDay(foundPreset.startDate) : foundPreset.startDate,
+          endDate: foundPreset.endDate ? endOfDay(foundPreset.endDate) : foundPreset.endDate
+        };
       } else {
         return { startDate: null, endDate: null };
       }
@@ -32771,6 +32780,7 @@ import {
 import {
   startOfMonth as startOfMonth4,
   endOfMonth as endOfMonth2,
+  endOfDay as endOfDay4,
   format as format7,
   eachDayOfInterval,
   subMonths as subMonths5,
@@ -33601,24 +33611,24 @@ function DayPicker({
         if (localStartDate && !localEndDate) {
           setLocalEndDate(date);
           updateDateFilter({
-            startDate: localStartDate,
-            endDate: date
+            startDate: startOfDay6(localStartDate),
+            endDate: endOfDay4(date)
           });
           setLocalPreset("");
         }
         if (localStartDate && localEndDate && isAfter2(date, localStartDate)) {
           setLocalEndDate(date);
           updateDateFilter({
-            startDate: localStartDate,
-            endDate: date
+            startDate: startOfDay6(localStartDate),
+            endDate: endOfDay4(date)
           });
           setLocalPreset("");
         }
         if (localStartDate && localEndDate && isBefore2(date, localStartDate)) {
           setLocalStartDate(date);
           updateDateFilter({
-            startDate: date,
-            endDate: localEndDate
+            startDate: startOfDay6(date),
+            endDate: endOfDay4(localEndDate)
           });
           setLocalPreset("");
         }
@@ -36136,17 +36146,41 @@ var useReportInternal = (reportId) => {
 import equal3 from "fast-deep-equal";
 
 // src/components/Chart/MapChart.tsx
-import {
-  ComposableMap,
-  Geographies,
-  Geography,
-  useMapContext
-} from "react-simple-maps";
-import { useEffect as useEffect13, useMemo as useMemo12, useRef as useRef11, useState as useState16 } from "react";
+import React10, { useEffect as useEffect13, useMemo as useMemo12, useRef as useRef11, useState as useState16 } from "react";
 init_valueFormatter();
+import usStates10m from "us-atlas/states-10m.json";
+import worldCountries50m from "world-atlas/countries-50m.json";
 import { jsx as jsx46, jsxs as jsxs35 } from "react/jsx-runtime";
-var statesUrl = "https://cdn.jsdelivr.net/npm/us-atlas@3/states-10m.json";
-var countriesUrl = "https://cdn.jsdelivr.net/npm/world-atlas@2/countries-50m.json";
+var statesGeography = usStates10m;
+var countriesGeography = worldCountries50m;
+var getSimpleMapsImport = () => {
+  const majorVersion = Number.parseInt(React10.version.split(".")[0] ?? "18", 10);
+  if (majorVersion >= 19) {
+    const react19Maps = "@vnedyalk0v/react19-simple-maps";
+    return import(
+      /* @vite-ignore */
+      react19Maps
+    ).catch(() => {
+      return import("react-simple-maps");
+    });
+  }
+  return import("react-simple-maps");
+};
+var useSimpleMapsModule = () => {
+  const [simpleMapsModule, setSimpleMapsModule] = useState16();
+  useEffect13(() => {
+    let mounted = true;
+    getSimpleMapsImport().then((module) => {
+      if (mounted) {
+        setSimpleMapsModule(module);
+      }
+    });
+    return () => {
+      mounted = false;
+    };
+  }, []);
+  return simpleMapsModule;
+};
 var fipsToNames = {
   "01": { name: "Alabama", abbreviation: "AL" },
   "02": { name: "Alaska", abbreviation: "AK" },
@@ -36469,6 +36503,7 @@ function USMap({
   className,
   containerStyle
 }) {
+  const simpleMaps = useSimpleMapsModule();
   const containerRef = useRef11(null);
   const [hoveredState, setHoveredState] = useState16(
     void 0
@@ -36537,6 +36572,9 @@ function USMap({
       }
     );
   }
+  if (!simpleMaps) {
+    return null;
+  }
   return /* @__PURE__ */ jsxs35(
     "div",
     {
@@ -36551,9 +36589,10 @@ function USMap({
         position: "relative"
       },
       children: [
-        /* @__PURE__ */ jsx46(ComposableMap, { projection: "geoAlbersUsa", children: /* @__PURE__ */ jsx46(
+        /* @__PURE__ */ jsx46(simpleMaps.ComposableMap, { projection: "geoAlbersUsa", children: /* @__PURE__ */ jsx46(
           MapLayout,
           {
+            simpleMaps,
             hoveredRegion: hoveredState,
             setHoveredRegion: setHoveredState,
             setHoveredCoords,
@@ -36563,7 +36602,7 @@ function USMap({
             colorScale,
             onClickChartElement,
             regionNames: fipsToNames,
-            geographyUrl: statesUrl
+            geographyUrl: statesGeography
           }
         ) }),
         hoveredCoords && hoveredState && /* @__PURE__ */ jsx46(
@@ -36660,6 +36699,7 @@ function WorldMap({
   className,
   containerStyle
 }) {
+  const simpleMaps = useSimpleMapsModule();
   const containerRef = useRef11(null);
   const [hoveredCountry, setHoveredCountry] = useState16(
     void 0
@@ -36728,6 +36768,9 @@ function WorldMap({
       }
     );
   }
+  if (!simpleMaps) {
+    return null;
+  }
   return /* @__PURE__ */ jsxs35(
     "div",
     {
@@ -36743,9 +36786,10 @@ function WorldMap({
         position: "relative"
       },
       children: [
-        /* @__PURE__ */ jsx46(ComposableMap, { projection: "geoEqualEarth", children: /* @__PURE__ */ jsx46(
+        /* @__PURE__ */ jsx46(simpleMaps.ComposableMap, { projection: "geoEqualEarth", children: /* @__PURE__ */ jsx46(
           MapLayout,
           {
+            simpleMaps,
             hoveredRegion: hoveredCountry,
             setHoveredRegion: setHoveredCountry,
             setHoveredCoords,
@@ -36754,7 +36798,7 @@ function WorldMap({
             measureField,
             colorScale,
             onClickChartElement,
-            geographyUrl: countriesUrl,
+            geographyUrl: countriesGeography,
             regionNames: isoToNames
           }
         ) }),
@@ -36841,6 +36885,7 @@ function WorldMap({
   );
 }
 function MapLayout({
+  simpleMaps,
   geographyUrl,
   hoveredRegion,
   setHoveredRegion,
@@ -36852,19 +36897,19 @@ function MapLayout({
   onClickChartElement,
   regionNames
 }) {
-  const { projection } = useMapContext();
+  const { projection } = simpleMaps.useMapContext();
   const [geoCentroid, setGeoCentroid] = useState16(null);
   useEffect13(() => {
     import("d3-geo").then((geo) => {
       setGeoCentroid(() => geo.geoCentroid);
     });
   }, []);
-  return /* @__PURE__ */ jsx46(Geographies, { geography: geographyUrl, children: ({ geographies }) => geographies.map((geo, index) => {
+  return /* @__PURE__ */ jsx46(simpleMaps.Geographies, { geography: geographyUrl, children: ({ geographies }) => geographies.map((geo, index) => {
     const regionData = mappedData[geo.id] ?? mappedData[regionNames[geo.id]?.abbreviation ?? ""] ?? mappedData[regionNames[geo.id]?.name ?? ""] ?? mappedData[regionNames[geo.id]?.abbreviation?.toLowerCase() ?? ""] ?? mappedData[regionNames[geo.id]?.name?.toLowerCase() ?? ""];
     const value = regionData ? parseFloat(regionData[measureField]) : null;
     const fill = value != null ? colorScale(value) : "#D6D6DA";
     return /* @__PURE__ */ jsx46(
-      Geography,
+      simpleMaps.Geography,
       {
         geography: geo,
         fill,
@@ -41532,9 +41577,12 @@ function Dashboard({
     setFilterListAddFilterPopoverIsOpen
   ] = useState25(false);
   const presetOptions = useMemo16(() => {
-    return populatedDashboardFilters?.[0]?.filterType === "date_range" ? convertPresetOptionsToSelectableList(
-      populatedDashboardFilters[0].presetOptions ?? [],
-      populatedDashboardFilters[0].defaultPresetRanges ?? []
+    const dashboardDateFilter = populatedDashboardFilters?.find(
+      (filter) => filter.filterType === "date_range"
+    );
+    return dashboardDateFilter ? convertPresetOptionsToSelectableList(
+      dashboardDateFilter.presetOptions ?? [],
+      dashboardDateFilter.defaultPresetRanges ?? []
     ) : defaultOptionsV2;
   }, [populatedDashboardFilters]);
   const [filterValues, setFilterValues] = useState25({});
@@ -45633,7 +45681,7 @@ init_dataFetcher();
 init_dates();
 
 // src/components/QuillMultiSelectSectionList.tsx
-import React13, {
+import React14, {
   useContext as useContext25,
   useMemo as useMemo20,
   useRef as useRef18,
@@ -45659,7 +45707,7 @@ function QuillMultiSelectSectionList({
   const modalRef = useRef18(null);
   const buttonRef = useRef18(null);
   const debounceTimeoutId = useRef18(null);
-  const [searchQuery, setSearchQuery] = React13.useState("");
+  const [searchQuery, setSearchQuery] = React14.useState("");
   useOnClickOutside_default(
     modalRef,
     (event) => {
@@ -45676,10 +45724,10 @@ function QuillMultiSelectSectionList({
       onChange(updatedChangeEvent);
     }, 200);
   };
-  const optionsLength = React13.useMemo(() => {
+  const optionsLength = React14.useMemo(() => {
     return Object.values(options).reduce((a, b) => a + b.length, 0);
   }, [options]);
-  const filteredItems = React13.useMemo(() => {
+  const filteredItems = React14.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) {
@@ -45706,7 +45754,7 @@ function QuillMultiSelectSectionList({
       Object.entries(filteredOptions).filter(([, value2]) => !!value2?.length).sort(([key]) => key === owner ? -1 : 1)
     );
   }, [options, searchQuery]);
-  const filteredLength = React13.useMemo(() => {
+  const filteredLength = React14.useMemo(() => {
     return Object.values(filteredItems).reduce((a, b) => a + b.length, 0);
   }, [filteredItems]);
   const selectedOptionsLabel = useMemo20(() => {
@@ -49032,7 +49080,7 @@ function ChartBuilder({
                           )
                         }
                       ),
-                      (showTableFormatOptions || isAdmin) && /* @__PURE__ */ jsxs48(
+                      (showTableFormatOptions || isAdmin || formData.chartType === "table" && !hideTableView) && /* @__PURE__ */ jsxs48(
                         "div",
                         {
                           style: {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@quillsql/react",
-  "version": "2.16.22",
+  "version": "2.16.23",
   "type": "module",
   "exports": {
     ".": {
@@ -36,10 +36,12 @@
     "date-fns-tz": "^2.0.0",
     "fast-deep-equal": "^3.1.3",
     "idb": "^8.0.3",
-    "jspdf": "^3.0.1",
+    "jspdf": "^4.2.0",
     "react-day-picker": "^9.7.0",
     "react-simple-maps": "git+https://github.com/zcreativelabs/react-simple-maps.git#b322da59a76fa789de1de77165bbef6df9beb0ef",
-    "recharts": "^2.13.0"
+    "recharts": "^3.7.0",
+    "us-atlas": "^3.0.1",
+    "world-atlas": "^2.0.2"
   },
   "devDependencies": {
     "@babel/cli": "^7.25.7",
@@ -47,7 +49,7 @@
     "@babel/preset-env": "^7.25.8",
     "@babel/preset-react": "^7.25.7",
     "@babel/preset-typescript": "^7.25.7",
-    "@playwright/test": "^1.51.1",
+    "@playwright/test": "^1.55.1",
     "@repo/eslint-config": "*",
     "@repo/typescript-config": "*",
     "@types/big.js": "^6.2.2",
@@ -56,8 +58,8 @@
     "@types/eslint": "^8.56.1",
     "@types/node": "^20.10.6",
     "@types/pluralize": "^0.0.33",
-    "@types/react": "^18",
-    "@types/react-dom": "^18",
+    "@types/react": "^18 || ^19",
+    "@types/react-dom": "^18 || ^19",
     "@types/react-simple-maps": "^3.0.6",
     "babel-plugin-inline-dotenv": "^1.7.0",
     "concurrently": "^9.0.1",
@@ -66,8 +68,14 @@
     "typescript": "^5.3.3"
   },
   "peerDependencies": {
-    "react": "^18",
-    "react-dom": "^18"
+    "@vnedyalk0v/react19-simple-maps": "*",
+    "react": "^18 || ^19",
+    "react-dom": "^18 || ^19"
+  },
+  "peerDependenciesMeta": {
+    "@vnedyalk0v/react19-simple-maps": {
+      "optional": true
+    }
   },
   "access": "public"
 }