@datawheel/data-explorer 1.0.14 → 1.0.16

package/dist/main.mjs

@@ -484,6 +484,7 @@ var vizbuilderTranslation = {
     total: "Total: {{value}}"
   },
   transient: {
+    title_one_row: "The dataset has only one row and can't be used to generate charts.",
     title_loading: "Generating charts...",
     title_empty: "No results",
     description_empty: "The selected combination of parameters can't be used to generate a meaningful set of charts. Try changing some parameters (maybe applying some restriction in a column) and generating charts again."
@@ -2598,10 +2599,10 @@ var DownloadQuery = ({ data }) => {
 };
 var mimeTypes = {
   csv: "text/csv",
-  json: "application/json",
+  jsonrecords: "application/json",
   tsv: "text/tab-separated-values",
-  txt: "text/plain",
-  xls: "application/vnd.ms-excel"
+  parquet: "application/octet-stream",
+  xlsx: "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet"
 };
 function useDownload(props) {
   const { provider } = props;
@@ -2637,12 +2638,13 @@ function useDownload(props) {
     }
   }, [error]);
   const onClick = useCallback(
-    (evt) => {
+    (evt, cb = () => {
+    }) => {
       evt.stopPropagation();
       evt.preventDefault();
-      return run(provider());
+      return run(provider()).then(cb);
     },
-    [run, provider]
+    [run]
   );
   return { onClick, isLoading, data: file, error };
 }
@@ -2659,14 +2661,13 @@ var ItemDownload = (props) => {
     {
       ...itemProps,
       icon: icon(isLoading),
-      onClick: (e) => {
-        e.preventDefault();
-        onClick(e).then(() => {
-          setOpened(false);
-        }).catch((error) => {
+      onClick: async (e) => {
+        try {
+          onClick(e, () => setOpened(false));
+        } catch (error) {
           console.error("Download error:", error);
           setOpened(false);
-        });
+        }
       }
     },
     /* @__PURE__ */ React13__default.createElement(Text, { fz: "sm" }, props.children)
@@ -2676,21 +2677,18 @@ function MenuOpts({ formats }) {
   const { translate: t } = useTranslation();
   const [opened, setOpened] = useState(false);
   const { mutateAsync: downloadQuery } = useDownloadQuery();
-  const buttons = useMemo(
-    () => formats.map((format2) => /* @__PURE__ */ React13__default.createElement(
-      ItemDownload,
-      {
-        component: "a",
-        key: format2,
-        provider: () => downloadQuery({ format: format2 }),
-        icon: (loading) => loading ? /* @__PURE__ */ React13__default.createElement(Loader, { size: 15 }) : /* @__PURE__ */ React13__default.createElement(IconDownload, { size: 15 }),
-        setOpened
-      },
-      /* @__PURE__ */ React13__default.createElement(Text, { size: "xs" }, t(`formats.${format2}`))
-    )),
-    [formats, t]
-  );
-  return /* @__PURE__ */ React13__default.createElement(Menu, { shadow: "md", width: 200, opened, onClose: () => setOpened(false) }, /* @__PURE__ */ React13__default.createElement(Menu.Target, null, /* @__PURE__ */ React13__default.createElement(
+  const buttons = formats.map((format2) => /* @__PURE__ */ React13__default.createElement(
+    ItemDownload,
+    {
+      component: "a",
+      key: format2,
+      provider: () => downloadQuery({ format: format2 }),
+      icon: (loading) => loading ? /* @__PURE__ */ React13__default.createElement(Loader, { size: 15 }) : /* @__PURE__ */ React13__default.createElement(IconDownload, { size: 15 }),
+      setOpened
+    },
+    /* @__PURE__ */ React13__default.createElement(Text, { size: "xs" }, t(`formats.${format2}`))
+  ));
+  return /* @__PURE__ */ React13__default.createElement(Menu, { shadow: "md", width: 200, opened }, /* @__PURE__ */ React13__default.createElement(Menu.Target, null, /* @__PURE__ */ React13__default.createElement(
     ActionIcon,
     {
       onClick: () => setOpened((o) => !o),
@@ -4923,6 +4921,7 @@ function SideBarItem({ children }) {
 function Auto() {
   const { translate: t } = useTranslation();
   const { expanded, input, setInput } = useSideBar();
+  const [inputValue, setInputValue] = useState(input);
   return /* @__PURE__ */ React13__default.createElement(
     Input,
     {
@@ -4931,8 +4930,11 @@ function Auto() {
       radius: "xl",
       size: "md",
       placeholder: t("params.label_search"),
-      defaultValue: input,
-      onInput: (e) => setInput(e.currentTarget.value),
+      value: inputValue,
+      onInput: (e) => {
+        setInputValue(e.currentTarget.value);
+        setInput(e.currentTarget.value);
+      },
       styles: {
         wrapper: {
           width: expanded ? "100%" : 0,
@@ -4947,7 +4949,10 @@ function Auto() {
         CloseButton,
         {
           "aria-label": "Clear input",
-          onClick: () => setInput(""),
+          onClick: () => {
+            setInput("");
+            setInputValue("");
+          },
           style: { display: input ? void 0 : "none" }
         }
       )
@@ -7552,6 +7557,9 @@ function NonIdealState2(props) {
     if (status === "loading") {
       return /* @__PURE__ */ React13__default.createElement(Flex, { justify: "center", align: "center", direction: "column" }, /* @__PURE__ */ React13__default.createElement(Loader, { size: "xl" }), /* @__PURE__ */ React13__default.createElement(Title, { mt: "md", order: 4 }, t("vizbuilder.transient.title_loading")));
     }
+    if (status === "one-row") {
+      return /* @__PURE__ */ React13__default.createElement(Flex, { justify: "center", align: "center", direction: "column", w: "50%" }, /* @__PURE__ */ React13__default.createElement(IconCircleOff, { size: 92 }), /* @__PURE__ */ React13__default.createElement(Title, { mt: "md", mb: "md", order: 4 }, t("vizbuilder.transient.title_one_row")));
+    }
     return /* @__PURE__ */ React13__default.createElement(Flex, { justify: "center", align: "center", direction: "column", w: "50%" }, /* @__PURE__ */ React13__default.createElement(IconCircleOff, { size: 92 }), /* @__PURE__ */ React13__default.createElement(Title, { mt: "md", mb: "md", order: 4 }, t("vizbuilder.transient.title_empty")), /* @__PURE__ */ React13__default.createElement(Text, null, t("vizbuilder.transient.description_empty")));
   }, [status, t]);
   return /* @__PURE__ */ React13__default.createElement(Center, { h: "100%" }, description);
@@ -7572,9 +7580,12 @@ function Vizbuilder(props) {
   const queryItem = useSelector$1(selectCurrentQueryItem);
   const currentChart = (queryItem == null ? void 0 : queryItem.chart) || "";
   const { actions: actions2 } = useSettings();
-  const setCurrentChart = useCallback((chart) => {
-    actions2.updateChart(chart);
-  }, [actions2]);
+  const setCurrentChart = useCallback(
+    (chart) => {
+      actions2.updateChart(chart);
+    },
+    [actions2]
+  );
   const getMeasureConfig = useMemo(() => {
     const config = measureConfig || {};
     return typeof config === "function" ? config : (item) => config[item.name];
@@ -7601,9 +7612,14 @@ function Vizbuilder(props) {
       console.debug("Loading datasets...", datasets);
       return /* @__PURE__ */ React13__default.createElement(Notice, { status: "loading" });
     }
-    const chartList = Object.values(charts);
+    let chartList = Object.values(charts);
+    if (chartList.length === 0 && !Array.isArray(datasets) && datasets.data.length === 1)
+      return /* @__PURE__ */ React13__default.createElement(Notice, { status: "one-row" });
     if (chartList.length === 0) return /* @__PURE__ */ React13__default.createElement(Notice, { status: "empty" });
     const isSingleChart = chartList.length === 1;
+    if (chartList.length > 10) {
+      chartList = chartList.slice(0, 10);
+    }
     return /* @__PURE__ */ React13__default.createElement(ErrorBoundary, null, /* @__PURE__ */ React13__default.createElement(
       SimpleGrid,
       {
@@ -7653,14 +7669,7 @@ function Vizbuilder(props) {
         isFullMode: true
       }
     );
-  }, [
-    charts,
-    currentChart,
-    downloadFormats,
-    getMeasureConfig,
-    showConfidenceInt,
-    userConfig
-  ]);
+  }, [charts, currentChart, downloadFormats, getMeasureConfig, showConfidenceInt, userConfig]);
   return /* @__PURE__ */ React13__default.createElement("div", { style: { height: "100%" }, className: clsx_m_default("vb-wrapper", props.className) }, props.customHeader, content, props.customFooter, /* @__PURE__ */ React13__default.createElement(
     Modal,
     {
@@ -7743,14 +7752,14 @@ function VizbuilderView(props) {
     data: (data == null ? void 0 : data.data) || [],
     locale: params.locale || "en"
   };
-  return !query.isLoading && /* @__PURE__ */ React13__default.createElement(
+  return !query.isLoading && /* @__PURE__ */ React13__default.createElement(React13__default.Fragment, null, /* @__PURE__ */ React13__default.createElement(
     Vizbuilder,
     {
       datasets: dataset,
       chartLimits: CHART_LIMITS,
       downloadFormats: DOWNLOAD_FORMATS
     }
-  );
+  ));
 }
 
 // src/components/RawResponseView.tsx

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@datawheel/data-explorer",
-  "version": "1.0.14",
+  "version": "1.0.16",
   "main": "./dist/main.mjs",
   "types": "./dist/main.d.mts",
   "files": [