@datawheel/data-explorer 1.0.18 → 1.0.19

package/dist/main.d.mts

@@ -1194,6 +1194,7 @@ type TableView = {
     table: MRT_TableInstance<TData>;
     getColumn(id: string): AnyResultColumn | undefined;
     columns: AnyResultColumn[];
+    setPagination: (pagination: MRT_PaginationState) => void;
 } & ViewProps;
 declare function TableView({ table, isError, isLoading, data, pagination, setPagination, result }: TableView): React.JSX.Element;
 declare namespace TableView {

package/dist/main.mjs

@@ -1879,7 +1879,8 @@ function useUpdateUrl() {
   return useCallback(
     (query) => {
       const currPermalink = window.location.search.slice(1);
-      const nextPermalink = serializePermalink(query || queryItem);
+      const q = query != null ? query : queryItem;
+      const nextPermalink = serializePermalink(q);
       if (currPermalink !== nextPermalink) {
         navigate(`?${nextPermalink}`, { replace: true });
       }
@@ -2153,61 +2154,6 @@ function useAsync(initialState4) {
   };
 }
 
-// src/components/Select.tsx
-init_esm_shims();
-var SelectObject = forwardRef(function(props, ref) {
-  var _a;
-  const {
-    getLabel,
-    getValue = identity,
-    items,
-    onItemSelect,
-    selectedItem,
-    selectProps = {}
-  } = props;
-  const [itemList, itemMap] = useMemo(() => {
-    const valueAccessor = accesorFactory(getValue);
-    const labelAccessor = getLabel ? accesorFactory(getLabel) : valueAccessor;
-    const list = items.map((item) => ({
-      label: labelAccessor(item),
-      value: valueAccessor(item),
-      item
-    }));
-    return [list, keyBy(list, (option) => option.value)];
-  }, [items, getLabel, getValue]);
-  const selected = useMemo(() => {
-    if (selectedItem == null) return null;
-    if (typeof selectedItem === "string") return selectedItem;
-    const valueAccessor = accesorFactory(getValue);
-    return valueAccessor(selectedItem);
-  }, [selectedItem, getValue]);
-  const itemSelectHandler = (value) => {
-    onItemSelect && onItemSelect(itemMap[value].item);
-  };
-  if (items.length === 0 || !selected) {
-    return null;
-  }
-  return /* @__PURE__ */ React13__default.createElement(
-    Select,
-    {
-      ref,
-      data: itemList,
-      disabled: props.loading || props.disabled,
-      hidden: props.hidden,
-      label: props.label,
-      onChange: itemSelectHandler,
-      onClick: inputFocusHandler,
-      onFocus: inputFocusHandler,
-      searchable: (_a = props.searchable) != null ? _a : props.items.length > 6,
-      value: selected,
-      ...selectProps
-    }
-  );
-});
-function inputFocusHandler(event) {
-  if (event.target instanceof HTMLInputElement) event.target.select();
-}
-
 // src/components/CubeSource.tsx
 init_esm_shims();
 
@@ -2420,6 +2366,61 @@ function CubeSource() {
 
 // src/components/LocaleSelector.tsx
 init_esm_shims();
+
+// src/components/Select.tsx
+init_esm_shims();
+var SelectObject = forwardRef(function(props, ref) {
+  var _a;
+  const {
+    getLabel,
+    getValue = identity,
+    items,
+    onItemSelect,
+    selectedItem,
+    selectProps = {}
+  } = props;
+  const [itemList, itemMap] = useMemo(() => {
+    const valueAccessor = accesorFactory(getValue);
+    const labelAccessor = getLabel ? accesorFactory(getLabel) : valueAccessor;
+    const list = items.map((item) => ({
+      label: labelAccessor(item),
+      value: valueAccessor(item),
+      item
+    }));
+    return [list, keyBy(list, (option) => option.value)];
+  }, [items, getLabel, getValue]);
+  const selected = useMemo(() => {
+    if (selectedItem == null) return null;
+    if (typeof selectedItem === "string") return selectedItem;
+    const valueAccessor = accesorFactory(getValue);
+    return valueAccessor(selectedItem);
+  }, [selectedItem, getValue]);
+  const itemSelectHandler = (value) => {
+    onItemSelect && onItemSelect(itemMap[value].item);
+  };
+  if (items.length === 0 || !selected) {
+    return null;
+  }
+  return /* @__PURE__ */ React13__default.createElement(
+    Select,
+    {
+      ref,
+      data: itemList,
+      disabled: props.loading || props.disabled,
+      hidden: props.hidden,
+      label: props.label,
+      onChange: itemSelectHandler,
+      onClick: inputFocusHandler,
+      onFocus: inputFocusHandler,
+      searchable: (_a = props.searchable) != null ? _a : props.items.length > 6,
+      value: selected,
+      ...selectProps
+    }
+  );
+});
+function inputFocusHandler(event) {
+  if (event.target instanceof HTMLInputElement) event.target.select();
+}
 var localeSelectorStyle = (theme) => ({
   input: {
     border: "none",
@@ -2506,10 +2507,12 @@ var formatter = new Intl.NumberFormat("en-US", {
 });
 function TableFooter(props) {
   const { paginationConfig } = useSettings();
-  const { table, data = [], isLoading, pagination, setPagination, url } = props;
+  const { table, data = [], isLoading, pagination, url } = props;
   const { translate: t } = useTranslation();
   const { copy, copied } = useClipboard({ timeout: 1e3 });
   const copyHandler = useCallback(() => copy(url), [url]);
+  const updateURL = useUpdateUrl();
+  const queryItem = useSelector(selectCurrentQueryItem);
   const totalRowCount = table.options.rowCount;
   const {
     pagination: { pageSize }
@@ -2525,22 +2528,19 @@ function TableFooter(props) {
     },
     [paginationConfig == null ? void 0 : paginationConfig.rowsLimits]
   );
-  const selectedItem = useMemo(
-    () => items.find((item) => Number(item.value) === pageSize),
-    [items, pageSize]
-  );
   const onItemSelect = useCallback(
     (item) => {
       const newPageSize = Number(item.value);
-      if (setPagination) {
-        setPagination({
-          ...pagination,
-          pageSize: newPageSize,
-          pageIndex: 0
-        });
-      }
+      updateURL({
+        ...queryItem,
+        params: {
+          ...queryItem.params,
+          pagiOffset: 0,
+          pagiLimit: newPageSize
+        }
+      });
     },
-    [pagination, setPagination]
+    [pagination]
   );
   return /* @__PURE__ */ React13__default.createElement(Box, { w: "100%", sx: { flex: "0 0 70px" } }, /* @__PURE__ */ React13__default.createElement(
     Flex,
@@ -2553,13 +2553,14 @@ function TableFooter(props) {
     },
     /* @__PURE__ */ React13__default.createElement(CubeSource, null),
     !isLoading && /* @__PURE__ */ React13__default.createElement(Group, { position: "right", spacing: "sm" }, /* @__PURE__ */ React13__default.createElement(LocaleSelector, null), /* @__PURE__ */ React13__default.createElement(Box, { maw: "7rem", miw: "fit" }, /* @__PURE__ */ React13__default.createElement(
-      SelectObject,
+      Select,
       {
-        getValue: (item) => item.value,
-        getLabel: (item) => item.label,
-        items,
-        selectedItem,
-        onItemSelect
+        data: items,
+        defaultValue: String(queryItem.params.pagiLimit),
+        onChange: (value) => {
+          const item = items.find((i) => i.value === value);
+          if (item) onItemSelect(item);
+        }
       }
     )), totalRowCount && /* @__PURE__ */ React13__default.createElement(Text, { c: "dimmed" }, t("results.count_rows_plural", { n: formatter.format(totalRowCount) })), showPagination && /* @__PURE__ */ React13__default.createElement(MRT_TablePagination, { table }), /* @__PURE__ */ React13__default.createElement(ApiAndCsvButtons, { copied, copyHandler, url, data }))
   ));
@@ -3042,13 +3043,12 @@ function useTable({
   const { limit, offset } = useSelector$1(selectPaginationParams);
   const queryItem = useSelector$1(selectCurrentQueryItem);
   const updateURL = useUpdateUrl();
-  const [pagination, setPagination] = useState({
+  const pagination = {
     pageIndex: Math.floor(offset / (limit || 1)),
     pageSize: limit
-  });
+  };
   const handlePaginationChange = (updatedPagination) => {
     const paginationUpdated = updatedPagination(pagination);
-    setPagination(updatedPagination);
     actions2.updatePagination({
       limit: paginationUpdated.pageSize,
       offset: paginationUpdated.pageIndex * paginationUpdated.pageSize
@@ -3268,7 +3268,6 @@ function useTable({
         showRowsPerPage: false
       },
       paginationDisplayMode: "pages",
-      enableRowVirtualization: false,
       globalFilterFn: "contains",
       initialState: {
         density: "xs"
@@ -3354,8 +3353,7 @@ function useTable({
     isFetching,
     data: tableData,
     columns,
-    pagination,
-    setPagination: handlePaginationChange
+    pagination
   };
 }
 function TableView({
@@ -3731,7 +3729,7 @@ function LevelItem({
   const actions2 = useActions();
   const cutItems = useSelector$1(selectCutItems);
   let drilldowns = useSelector$1(selectDrilldownMap);
-  const ditems = useSelector$1(selectDrilldownItems);
+  useSelector$1(selectDrilldownItems);
   const { idFormatters } = useidFormatters();
   const label = useMemo(() => {
     const captions = [
@@ -3749,49 +3747,28 @@ function LevelItem({
       level: captions[2]
     });
   }, [locale, dimension, hierarchy, level, isSubMenu, t]);
-  const createCutHandler = useCallback((level2) => {
-    const cutItem = buildCut({ ...level2, members: [], active: false });
-    actions2.updateCut(cutItem);
-  }, []);
-  function createDrilldown(level2, cuts) {
-    const drilldown = buildDrilldown({ ...level2, key: level2.name, active: false });
-    actions2.updateDrilldown(drilldown);
-    const cut2 = cuts.find((cut3) => cut3.level === drilldown.level);
-    if (!cut2) {
-      createCutHandler(level2);
-    }
-    return drilldown;
-  }
   const currentDrilldown = drilldowns[level.name];
   const isOtherHierarchySelected = activeItems.some(
     (activeItem) => activeItem.dimension === dimension.name && activeItem.hierarchy !== hierarchy.name
   );
-  useLayoutEffect(() => {
-    if (!drilldowns[level.name] && !ditems.find((d) => d.level === level.name)) {
-      createDrilldown(level, cutItems);
-    }
-  }, [level, ditems]);
   const cut = cutItems.find((cut2) => {
     return cut2.level === (currentDrilldown == null ? void 0 : currentDrilldown.level);
   });
-  const updatecutHandler = React13__default.useCallback((item, members) => {
+  const updatecutHandler = (item, members) => {
     actions2.updateCut({ ...item, members });
-  }, []);
+  };
+  console.log(isOtherHierarchySelected, "isOtherHierarchySelected");
   const checked = activeItems.map((i) => i.level).includes(level.name);
   const disableUncheck = activeItems.length === 1 && checked;
   const isDisabled = isOtherHierarchySelected && !checked;
   if (!currentDrilldown) return;
   const paddingLeft = `${5 * depth + 5}px`;
-  const properities = currentDrilldown.properties.length ? currentDrilldown.properties : null;
+  const properties = currentDrilldown.properties.length ? currentDrilldown.properties : null;
   return currentDrilldown && /* @__PURE__ */ React13__default.createElement(React13__default.Fragment, null, /* @__PURE__ */ React13__default.createElement(Group, { className: "dex-level-control", mt: "sm", position: "apart", key: level.name, noWrap: true }, /* @__PURE__ */ React13__default.createElement(
     Checkbox,
     {
       sx: { cursor: "pointer", paddingLeft },
       onChange: () => {
-        if (cut) {
-          const active = checked ? false : !!cut.members.length;
-          actions2.updateCut({ ...cut, active });
-        }
         actions2.updateDrilldown({
           ...currentDrilldown,
           active: !currentDrilldown.active
@@ -3811,7 +3788,7 @@ function LevelItem({
       disabled: isDisabled
     },
     activeFilter ? /* @__PURE__ */ React13__default.createElement(IconFilterOff, null) : /* @__PURE__ */ React13__default.createElement(IconFilter, null)
-  ), properities && /* @__PURE__ */ React13__default.createElement(Tooltip, { label: t("params.add_metadata") }, /* @__PURE__ */ React13__default.createElement(ActionIcon, { onClick: () => setActiveProperties((value) => !value) }, /* @__PURE__ */ React13__default.createElement(IconAdjustments, null))), /* @__PURE__ */ React13__default.createElement(ThemeIcon, { size: "xs", color: "gray", variant: "light", bg: "transparent" }, /* @__PURE__ */ React13__default.createElement(StackSVG, null)))), activeFilter && /* @__PURE__ */ React13__default.createElement(Box, { pt: "md" }, /* @__PURE__ */ React13__default.createElement(
+  ), properties && /* @__PURE__ */ React13__default.createElement(Tooltip, { label: t("params.add_metadata") }, /* @__PURE__ */ React13__default.createElement(ActionIcon, { onClick: () => setActiveProperties((value) => !value) }, /* @__PURE__ */ React13__default.createElement(IconAdjustments, null))), /* @__PURE__ */ React13__default.createElement(ThemeIcon, { size: "xs", color: "gray", variant: "light", bg: "transparent" }, /* @__PURE__ */ React13__default.createElement(StackSVG, null)))), activeFilter && /* @__PURE__ */ React13__default.createElement(Box, { pt: "md" }, /* @__PURE__ */ React13__default.createElement(
     MultiSelect,
     {
       sx: { flex: "1 1 100%" },
@@ -4272,8 +4249,13 @@ function QueryProvider({ children, defaultCube }) {
   const { tesseract } = useLogicLayer();
   const location2 = useLocation();
   const { updateCurrentQuery } = useActions();
-  const { paginationConfig, measuresActive, serverURL, defaultLocale } = useSettings();
-  const { data: schema, isLoading: schemaLoading, isError: schemaError } = useServerSchema();
+  const { measuresActive, serverURL, defaultLocale } = useSettings();
+  const {
+    data: schema,
+    isLoading: schemaLoading,
+    isFetching: schemaFetching,
+    isError: schemaError
+  } = useServerSchema();
   const updateUrl = useUpdateUrl();
   const queryItem = useSelector$1(selectCurrentQueryItem);
   const prevLocaleRef = useRef();
@@ -4294,7 +4276,7 @@ function QueryProvider({ children, defaultCube }) {
     const searchParams = new URLSearchParams(location2.search);
     const cube = searchParams.get("cube");
     const cubeMap = (schema == null ? void 0 : schema.cubeMap) || void 0;
-    if (cube && cubeMap && serverURL && cubeMap[cube] && (schema == null ? void 0 : schema.online)) {
+    if (cube && cubeMap && serverURL && cubeMap[cube] && (schema == null ? void 0 : schema.online) && !schemaFetching) {
       let newQuery = parsePermalink(cubeMap[cube], searchParams);
       newQuery = isValidQuery(newQuery == null ? void 0 : newQuery.params) ? newQuery : buildQuery({ params: { cube } });
       newQuery.params.locale = defaultLocale || newQuery.params.locale;
@@ -4321,7 +4303,8 @@ function QueryProvider({ children, defaultCube }) {
           key: lvl.name,
           dimension: dimensions[name4],
           hierarchy: hierarchies[name4],
-          level: name4
+          level: name4,
+          properties: lvl.properties.map((prop) => buildProperty({ level: lvl.name, name: prop.name }))
         });
       });
       if (newQuery) {
@@ -4329,7 +4312,7 @@ function QueryProvider({ children, defaultCube }) {
           (dd) => {
             const currentDrilldown = queryItem.params.drilldowns[dd.key];
             const localeChanged = prevLocaleRef.current !== (newQuery == null ? void 0 : newQuery.params.locale);
-            if (currentDrilldown && currentDrilldown.members && currentDrilldown.members.length > 0 && !localeChanged) {
+            if (currentDrilldown && currentDrilldown.members && currentDrilldown.members.length > 0 && !localeChanged && cube === queryItem.params.cube) {
               return Promise.resolve({
                 drilldown: currentDrilldown,
                 cut: buildCut({ ...currentDrilldown, active: false })
@@ -4371,7 +4354,15 @@ function QueryProvider({ children, defaultCube }) {
       const cubeDefault = defaultCube && hasProperty(cubeMap, defaultCube) ? defaultCube : Object.keys(cubeMap)[0];
       setDefaultValues(cubeMap[cubeDefault]);
     }
-  }, [location2.search, runFetchMembers, schema, schemaLoading, serverURL, defaultLocale]);
+  }, [
+    location2.search,
+    runFetchMembers,
+    schema,
+    schemaLoading,
+    schemaFetching,
+    serverURL,
+    defaultLocale
+  ]);
   const onChangeCube = (table, subtopic) => {
     const locale = defaultLocale || queryItem.params.locale;
     const cubeMap = (schema == null ? void 0 : schema.cubeMap) || {};
@@ -4416,18 +4407,16 @@ function QueryProvider({ children, defaultCube }) {
     });
     updateUrl(query);
   }
-  return /* @__PURE__ */ React13__default.createElement(
-    QueryContext.Provider,
-    {
-      value: {
-        onChangeCube,
-        schemaLoading,
-        membersLoading,
-        transintionLocaleLoading
-      }
-    },
-    children
+  const contextValue = React13__default.useMemo(
+    () => ({
+      onChangeCube,
+      schemaLoading,
+      membersLoading,
+      transintionLocaleLoading
+    }),
+    [onChangeCube, schemaLoading, membersLoading, transintionLocaleLoading]
   );
+  return /* @__PURE__ */ React13__default.createElement(QueryContext.Provider, { value: contextValue }, children);
 }
 function useQueryItem() {
   const context = useContext(QueryContext);
@@ -4545,7 +4534,7 @@ function SuccessResult(props) {
     actions2.switchPanel(newTab);
     updateUrl({ ...queryItem, panel: newTab });
   };
-  const { table, isError, isLoading, data, columns, result, pagination, isFetching, setPagination } = useTable({
+  const { table, isError, isLoading, data, columns, result, pagination, isFetching } = useTable({
     cube
   });
   if ((data == null ? void 0 : data.length) === 0 && !isLoading && !isError) {
@@ -4611,7 +4600,6 @@ function SuccessResult(props) {
             isLoading,
             columns,
             pagination,
-            setPagination,
             isFetching
           }
         ))))

package/package.json

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