@haniffalab/cherita-react 1.2.0 → 1.3.0-dev.2025-05-29.ee7e9b72

package/dist/esm/context/SettingsContext.js

@@ -0,0 +1,528 @@
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == typeof i ? i : i + ""; }
+function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != typeof i) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+import React, { createContext, useContext, useEffect, useReducer } from "react";
+import _ from "lodash";
+import { COLOR_ENCODINGS, DOTPLOT_SCALES, LOCAL_STORAGE_KEY, MATRIXPLOT_SCALES, OBS_TYPES, PSEUDOSPATIAL_CATEGORICAL_MODES, VAR_SORT, VAR_SORT_ORDER, VIOLINPLOT_SCALES } from "../constants/constants";
+export const SettingsContext = /*#__PURE__*/createContext(null);
+export const SettingsDispatchContext = /*#__PURE__*/createContext(null);
+const initialSettings = {
+  selectedObs: null,
+  selectedVar: null,
+  selectedObsm: null,
+  selectedMultiObs: [],
+  selectedMultiVar: [],
+  colorEncoding: null,
+  labelObs: [],
+  vars: [],
+  sliceBy: {
+    obs: false,
+    polygons: false
+  },
+  polygons: {},
+  controls: {
+    colorScale: "Viridis",
+    valueRange: [0, 1],
+    range: [0, 1],
+    colorAxis: {
+      dmin: 0,
+      dmax: 1,
+      cmin: 0,
+      cmax: 1
+    },
+    scale: {
+      dotplot: DOTPLOT_SCALES.NONE.value,
+      matrixplot: MATRIXPLOT_SCALES.NONE.value,
+      violinplot: VIOLINPLOT_SCALES.WIDTH.value
+    },
+    meanOnlyExpressed: false,
+    expressionCutoff: 0.0
+  },
+  varSort: {
+    var: {
+      sort: VAR_SORT.NONE,
+      sortOrder: VAR_SORT_ORDER.ASC
+    },
+    disease: {
+      sort: VAR_SORT.NONE,
+      sortOrder: VAR_SORT_ORDER.ASC
+    }
+  },
+  pseudospatial: {
+    maskSet: null,
+    maskValues: null,
+    categoricalMode: PSEUDOSPATIAL_CATEGORICAL_MODES.ACROSS.value
+  }
+};
+const initializer = _ref => {
+  let {
+    canOverrideSettings,
+    defaultSettings,
+    localSettings
+  } = _ref;
+  return canOverrideSettings ? _.assign({}, initialSettings, defaultSettings, localSettings) : _.assign({}, initialSettings, defaultSettings);
+};
+export function SettingsProvider(_ref2) {
+  let {
+    dataset_url,
+    defaultSettings,
+    canOverrideSettings,
+    children
+  } = _ref2;
+  const DATASET_STORAGE_KEY = "".concat(LOCAL_STORAGE_KEY, "-").concat(dataset_url);
+  // Use localStorage directly instead of useLocalStorage due to unnecessary re-renders
+  // https://github.com/uidotdev/usehooks/issues/157
+  const localSettings = JSON.parse(localStorage.getItem(DATASET_STORAGE_KEY)) || {};
+  const [settings, dispatch] = useReducer(settingsReducer, {
+    canOverrideSettings,
+    defaultSettings,
+    localSettings
+  }, initializer);
+  useEffect(() => {
+    if (canOverrideSettings) {
+      try {
+        localStorage.setItem(DATASET_STORAGE_KEY, JSON.stringify(settings));
+      } catch (err) {
+        if (err.code === 22 || err.code === 1014 || err.name === "QuotaExceededError" || err.name === "NS_ERROR_DOM_QUOTA_REACHED") {
+          console.err("Browser storage quota exceeded");
+        } else {
+          console.err(err);
+        }
+      }
+    }
+  }, [DATASET_STORAGE_KEY, canOverrideSettings, settings]);
+  return /*#__PURE__*/React.createElement(SettingsContext.Provider, {
+    value: settings
+  }, /*#__PURE__*/React.createElement(SettingsDispatchContext.Provider, {
+    value: dispatch
+  }, children));
+}
+export function useSettings() {
+  return useContext(SettingsContext);
+}
+export function useSettingsDispatch() {
+  return useContext(SettingsDispatchContext);
+}
+function settingsReducer(settings, action) {
+  switch (action.type) {
+    case "select.obs":
+      {
+        var _action$obs;
+        return _objectSpread(_objectSpread({}, settings), {}, {
+          selectedObs: action.obs,
+          controls: _objectSpread(_objectSpread({}, settings.controls), {}, {
+            range: ((_action$obs = action.obs) === null || _action$obs === void 0 ? void 0 : _action$obs.type) === OBS_TYPES.CATEGORICAL ? [0, 1] : settings.controls.range
+          }),
+          colorEncoding: settings.colorEncoding === COLOR_ENCODINGS.OBS && !action.obs ? null : settings.colorEncoding,
+          sliceBy: _objectSpread(_objectSpread({}, settings.sliceBy), {}, {
+            obs: action.obs ? settings.sliceBy.obs : false
+          })
+        });
+      }
+    case "select.obsm":
+      {
+        return _objectSpread(_objectSpread({}, settings), {}, {
+          selectedObsm: action.obsm
+        });
+      }
+    case "select.var":
+      {
+        if (settings.vars.find(v => _.isEqual(v, action.var))) {
+          return _objectSpread(_objectSpread({}, settings), {}, {
+            selectedVar: action.var
+          });
+        } else {
+          return _objectSpread(_objectSpread({}, settings), {}, {
+            selectedVar: action.var,
+            vars: [...settings.vars, action.var]
+          });
+        }
+      }
+    case "select.multivar":
+      {
+        const vars = settings.vars.find(v => _.isEqual(v, action.var)) ? settings.vars : [...settings.vars, action.var];
+        if (settings.selectedMultiVar.find(v => _.isEqual(v, action.var))) {
+          return _objectSpread(_objectSpread({}, settings), {}, {
+            vars: vars
+          });
+        } else {
+          return _objectSpread(_objectSpread({}, settings), {}, {
+            selectedMultiVar: [...settings.selectedMultiVar, action.var],
+            vars: vars
+          });
+        }
+      }
+    case "deselect.multivar":
+      {
+        return _objectSpread(_objectSpread({}, settings), {}, {
+          selectedMultiVar: settings.selectedMultiVar.filter(v => v !== action.var.name)
+        });
+      }
+    case "toggle.multivar":
+      {
+        const inMultiVar = settings.selectedMultiVar.some(v => v.name === action.var.name);
+        if (inMultiVar) {
+          return _objectSpread(_objectSpread({}, settings), {}, {
+            selectedMultiVar: settings.selectedMultiVar.filter(v => v.name !== action.var.name)
+          });
+        } else {
+          return _objectSpread(_objectSpread({}, settings), {}, {
+            selectedMultiVar: [...settings.selectedMultiVar, action.var]
+          });
+        }
+      }
+    case "set.colorEncoding":
+      {
+        return _objectSpread(_objectSpread({}, settings), {}, {
+          colorEncoding: action.value
+        });
+      }
+    case "reset.vars":
+      {
+        return _objectSpread(_objectSpread({}, settings), {}, {
+          vars: [],
+          selectedVar: null,
+          selectedMultiVar: []
+        });
+      }
+    case "reset.multiVar":
+      {
+        return _objectSpread(_objectSpread({}, settings), {}, {
+          selectedMultiVar: [],
+          colorEncoding: settings.colorEncoding === COLOR_ENCODINGS.VAR ? null : settings.colorEncoding
+        });
+      }
+    case "reset.var":
+      {
+        return _objectSpread(_objectSpread({}, settings), {}, {
+          selectedVar: null,
+          colorEncoding: settings.colorEncoding === COLOR_ENCODINGS.VAR ? null : settings.colorEncoding
+        });
+      }
+    case "add.var":
+      {
+        if (settings.vars.find(v => v.name === action.var.name)) {
+          return settings;
+        } else {
+          return _objectSpread(_objectSpread({}, settings), {}, {
+            vars: [...settings.vars, action.var]
+          });
+        }
+      }
+    case "remove.var":
+      {
+        var _settings$selectedVar;
+        const selectedVar = ((_settings$selectedVar = settings.selectedVar) === null || _settings$selectedVar === void 0 ? void 0 : _settings$selectedVar.name) === action.var.name ? null : settings.selectedVar;
+        const selectedMultiVar = settings.selectedMultiVar.filter(v => v.name !== action.var.name);
+        return _objectSpread(_objectSpread({}, settings), {}, {
+          vars: settings.vars.filter(a => a.name !== action.var.name),
+          selectedVar: selectedVar,
+          selectedMultiVar: selectedMultiVar
+        });
+      }
+    case "add.varSet.var":
+      {
+        const varSet = settings.vars.find(s => s.isSet && s.name === action.varSet.name);
+        if (!varSet) {
+          return settings;
+        }
+        if (varSet.vars.some(v => v.name === action.var.name)) {
+          return settings;
+        } else {
+          var _settings$selectedVar2;
+          const varSetVars = [...varSet.vars, action.var];
+          const vars = settings.vars.map(v => {
+            if (v.name === varSet.name) {
+              return _objectSpread(_objectSpread({}, v), {}, {
+                vars: varSetVars
+              });
+            } else {
+              return v;
+            }
+          });
+          const selectedVar = ((_settings$selectedVar2 = settings.selectedVar) === null || _settings$selectedVar2 === void 0 ? void 0 : _settings$selectedVar2.name) === action.varSet.name ? _objectSpread(_objectSpread({}, varSet), {}, {
+            vars: varSetVars
+          }) : settings.selectedVar;
+          const selectedMultiVar = settings.selectedMultiVar.map(v => {
+            if (v.name === varSet.name) {
+              return _objectSpread(_objectSpread({}, v), {}, {
+                vars: varSetVars
+              });
+            } else {
+              return v;
+            }
+          });
+          return _objectSpread(_objectSpread({}, settings), {}, {
+            vars: vars,
+            selectedVar: selectedVar,
+            selectedMultiVar: selectedMultiVar
+          });
+        }
+      }
+    case "remove.varSet.var":
+      {
+        const varSet = settings.vars.find(s => s.isSet && s.name === action.varSet.name);
+        if (!varSet) {
+          return settings;
+        }
+        if (!varSet.vars.some(v => v.name === action.var.name)) {
+          return settings;
+        } else {
+          const varSetVars = varSet.vars.filter(v => v.name !== action.var.name);
+          const vars = settings.vars.map(v => {
+            if (v.name === varSet.name) {
+              return _objectSpread(_objectSpread({}, v), {}, {
+                vars: varSetVars
+              });
+            } else {
+              return v;
+            }
+          });
+          // Remove from selected if varSet vars is empty
+          if (!varSetVars.length) {
+            var _settings$selectedVar3;
+            const selectedVar = ((_settings$selectedVar3 = settings.selectedVar) === null || _settings$selectedVar3 === void 0 ? void 0 : _settings$selectedVar3.name) === action.varSet.name ? null : settings.selectedVar;
+            const selectedMultiVar = settings.selectedMultiVar.filter(v => v.name !== action.varSet.name);
+            return _objectSpread(_objectSpread({}, settings), {}, {
+              vars: vars,
+              selectedVar: selectedVar,
+              selectedMultiVar: selectedMultiVar
+            });
+          } else {
+            var _settings$selectedVar4;
+            // Update selected if varSet is selected
+            const selectedVar = ((_settings$selectedVar4 = settings.selectedVar) === null || _settings$selectedVar4 === void 0 ? void 0 : _settings$selectedVar4.name) === action.varSet.name ? _objectSpread(_objectSpread({}, varSet), {}, {
+              vars: varSetVars
+            }) : settings.selectedVar;
+            const selectedMultiVar = settings.selectedMultiVar.map(v => {
+              if (v.name === varSet.name) {
+                return _objectSpread(_objectSpread({}, v), {}, {
+                  vars: varSetVars
+                });
+              } else {
+                return v;
+              }
+            });
+            return _objectSpread(_objectSpread({}, settings), {}, {
+              vars: vars,
+              selectedVar: selectedVar,
+              selectedMultiVar: selectedMultiVar
+            });
+          }
+        }
+      }
+    case "set.controls.colorScale":
+      {
+        return _objectSpread(_objectSpread({}, settings), {}, {
+          controls: _objectSpread(_objectSpread({}, settings.controls), {}, {
+            colorScale: action.colorScale
+          })
+        });
+      }
+    case "set.controls.valueRange":
+      {
+        return _objectSpread(_objectSpread({}, settings), {}, {
+          controls: _objectSpread(_objectSpread({}, settings.controls), {}, {
+            valueRange: action.valueRange
+          })
+        });
+      }
+    case "set.controls.range":
+      {
+        return _objectSpread(_objectSpread({}, settings), {}, {
+          controls: _objectSpread(_objectSpread({}, settings.controls), {}, {
+            range: action.range
+          })
+        });
+      }
+    case "set.controls.colorAxis":
+      {
+        return _objectSpread(_objectSpread({}, settings), {}, {
+          controls: _objectSpread(_objectSpread({}, settings.controls), {}, {
+            colorAxis: action.colorAxis
+          })
+        });
+      }
+    case "set.controls.colorAxis.crange":
+      {
+        return _objectSpread(_objectSpread({}, settings), {}, {
+          controls: _objectSpread(_objectSpread({}, settings.controls), {}, {
+            colorAxis: _objectSpread(_objectSpread({}, settings.controls.colorAxis), {}, {
+              cmin: action.cmin,
+              cmax: action.cmax
+            })
+          })
+        });
+      }
+    case "set.controls.colorAxis.cmin":
+      {
+        return _objectSpread(_objectSpread({}, settings), {}, {
+          controls: _objectSpread(_objectSpread({}, settings.controls), {}, {
+            colorAxis: _objectSpread(_objectSpread({}, settings.controls.colorAxis), {}, {
+              cmin: action.cmin
+            })
+          })
+        });
+      }
+    case "set.controls.colorAxis.cmax":
+      {
+        return _objectSpread(_objectSpread({}, settings), {}, {
+          controls: _objectSpread(_objectSpread({}, settings.controls), {}, {
+            colorAxis: _objectSpread(_objectSpread({}, settings.controls.colorAxis), {}, {
+              cmax: action.cmax
+            })
+          })
+        });
+      }
+    case "set.controls.scale":
+      {
+        return _objectSpread(_objectSpread({}, settings), {}, {
+          controls: _objectSpread(_objectSpread({}, settings.controls), {}, {
+            scale: _objectSpread(_objectSpread({}, settings.controls.scale), {}, {
+              [action.plot]: action.scale
+            })
+          })
+        });
+      }
+    case "set.controls.meanOnlyExpressed":
+      {
+        return _objectSpread(_objectSpread({}, settings), {}, {
+          controls: _objectSpread(_objectSpread({}, settings.controls), {}, {
+            meanOnlyExpressed: action.meanOnlyExpressed
+          })
+        });
+      }
+    case "set.controls.expressionCutoff":
+      {
+        return _objectSpread(_objectSpread({}, settings), {}, {
+          controls: _objectSpread(_objectSpread({}, settings.controls), {}, {
+            expressionCutoff: action.expressionCutoff
+          })
+        });
+      }
+    case "toggle.slice.obs":
+      {
+        if (_.isEqual(settings.selectedObs, action.obs)) {
+          return _objectSpread(_objectSpread({}, settings), {}, {
+            sliceBy: _objectSpread(_objectSpread({}, settings.sliceBy), {}, {
+              obs: !settings.sliceBy.obs
+            })
+          });
+        } else {
+          return _objectSpread(_objectSpread({}, settings), {}, {
+            selectedObs: action.obs,
+            sliceBy: _objectSpread(_objectSpread({}, settings.sliceBy), {}, {
+              obs: true
+            })
+          });
+        }
+      }
+    case "toggle.slice.polygons":
+      {
+        return _objectSpread(_objectSpread({}, settings), {}, {
+          sliceBy: _objectSpread(_objectSpread({}, settings.sliceBy), {}, {
+            polygons: !settings.sliceBy.polygons
+          })
+        });
+      }
+    case "disable.slice.polygons":
+      {
+        return _objectSpread(_objectSpread({}, settings), {}, {
+          sliceBy: _objectSpread(_objectSpread({}, settings.sliceBy), {}, {
+            polygons: false
+          })
+        });
+      }
+    case "add.label.obs":
+      {
+        if (settings.labelObs.find(i => _.isEqual(i, action.obs))) {
+          return settings;
+        } else {
+          return _objectSpread(_objectSpread({}, settings), {}, {
+            labelObs: [...settings.labelObs, action.obs]
+          });
+        }
+      }
+    case "remove.label.obs":
+      {
+        return _objectSpread(_objectSpread({}, settings), {}, {
+          labelObs: settings.labelObs.filter(a => a.name !== action.obsName)
+        });
+      }
+    case "reset.label.obs":
+      {
+        return _objectSpread(_objectSpread({}, settings), {}, {
+          labelObs: []
+        });
+      }
+    case "set.varSort":
+      {
+        return _objectSpread(_objectSpread({}, settings), {}, {
+          varSort: _objectSpread(_objectSpread({}, settings.varSort), {}, {
+            [action.var]: {
+              sort: action.sort,
+              sortOrder: action.sortOrder
+            }
+          })
+        });
+      }
+    case "set.varSort.sort":
+      {
+        return _objectSpread(_objectSpread({}, settings), {}, {
+          varSort: _objectSpread(_objectSpread({}, settings.varSort), {}, {
+            [action.var]: _objectSpread(_objectSpread({}, settings.varSort[action.var]), {}, {
+              sort: action.sort
+            })
+          })
+        });
+      }
+    case "set.varSort.sortOrder":
+      {
+        return _objectSpread(_objectSpread({}, settings), {}, {
+          varSort: _objectSpread(_objectSpread({}, settings.varSort), {}, {
+            [action.var]: _objectSpread(_objectSpread({}, settings.varSort[action.var]), {}, {
+              sortOrder: action.sortOrder
+            })
+          })
+        });
+      }
+    case "set.polygons":
+      {
+        return _objectSpread(_objectSpread({}, settings), {}, {
+          polygons: _objectSpread(_objectSpread({}, settings.polygons), {}, {
+            [action.obsm]: action.polygons
+          })
+        });
+      }
+    case "set.pseudospatial.maskSet":
+      {
+        return _objectSpread(_objectSpread({}, settings), {}, {
+          pseudospatial: _objectSpread(_objectSpread({}, settings.pseudospatial), {}, {
+            maskSet: action.maskSet
+          })
+        });
+      }
+    case "set.pseudospatial.maskValues":
+      {
+        return _objectSpread(_objectSpread({}, settings), {}, {
+          pseudospatial: _objectSpread(_objectSpread({}, settings.pseudospatial), {}, {
+            maskValues: action.maskValues
+          })
+        });
+      }
+    case "set.pseudospatial.categoricalMode":
+      {
+        return _objectSpread(_objectSpread({}, settings), {}, {
+          pseudospatial: _objectSpread(_objectSpread({}, settings.pseudospatial), {}, {
+            categoricalMode: action.categoricalMode
+          })
+        });
+      }
+    default:
+      {
+        throw Error("Unknown action: " + action.type);
+      }
+  }
+}

package/dist/esm/helpers/color-helper.js

@@ -1,11 +1,11 @@
 import { useCallback } from "react";
 import { COLORSCALES } from "../constants/colorscales";
-import { useDataset } from "../context/DatasetContext";
+import { useSettings } from "../context/SettingsContext";
 const GRAY = [214, 212, 212];
 const parseHexColor = color => {
-  const r = parseInt(color?.substring(1, 3), 16);
-  const g = parseInt(color?.substring(3, 5), 16);
-  const b = parseInt(color?.substring(5, 7), 16);
+  const r = parseInt(color === null || color === void 0 ? void 0 : color.substring(1, 3), 16);
+  const g = parseInt(color === null || color === void 0 ? void 0 : color.substring(3, 5), 16);
+  const b = parseInt(color === null || color === void 0 ? void 0 : color.substring(5, 7), 16);
   return [r, g, b];
 };
 const interpolateColor = (color1, color2, factor) => {
@@ -34,7 +34,7 @@ export const rgbToHex = color => {
   return "#" + ((1 << 24) + (r << 16) + (g << 8) + b).toString(16).slice(1);
 };
 export const useColor = () => {
-  const dataset = useDataset();
+  const settings = useSettings();
   const getColor = useCallback(_ref => {
     let {
       value,
@@ -44,10 +44,10 @@ export const useColor = () => {
         alpha = 0.75,
         gray = 0.95
       } = {},
-      colorEncoding = dataset.colorEncoding,
+      colorEncoding = settings.colorEncoding,
       colorscale = null
     } = _ref;
-    const colormap = colorscale || COLORSCALES[categorical ? "Accent" : dataset.controls.colorScale];
+    const colormap = colorscale || COLORSCALES[categorical ? "Accent" : settings.controls.colorScale];
     if (colorEncoding) {
       if (grayOut) {
         // Mix color with gray manually instead of chroma.mix to get better performance with deck.gl
@@ -59,7 +59,7 @@ export const useColor = () => {
     } else {
       return null;
     }
-  }, [dataset.colorEncoding, dataset.controls.colorScale]);
+  }, [settings.colorEncoding, settings.controls.colorScale]);
   return {
     getColor
   };

package/dist/esm/helpers/zarr-helper.js

@@ -1,3 +1,8 @@
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == typeof i ? i : i + ""; }
+function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != typeof i) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
 import { useCallback } from "react";
 import { useQueries, useQuery } from "@tanstack/react-query";
 import { ArrayNotFoundError, GroupNotFoundError, openArray } from "zarr";
@@ -9,7 +14,7 @@ export const GET_OPTIONS = {
       progress,
       queueSize
     } = _ref;
-    console.debug(`${progress / queueSize * 100}% complete.`);
+    console.debug("".concat(progress / queueSize * 100, "% complete."));
   } // callback executed after each request
 };
 export class ZarrHelper {
@@ -38,27 +43,26 @@ const fetchDataFromZarr = async (url, path, s, opts) => {
 export const useZarr = function (_ref2) {
   let {
     url,
-    path
+    path,
+    s = null
   } = _ref2;
-  let s = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : null;
-  let options = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : GET_OPTIONS;
-  let opts = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : {};
+  let options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : GET_OPTIONS;
+  let opts = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
   const {
     data = null,
     isLoading: isPending = false,
     error: serverError = null
-  } = useQuery({
+  } = useQuery(_objectSpread({
     queryKey: ["zarr", url, path, s],
     queryFn: () => fetchDataFromZarr(url, path, s, options),
     retry: (failureCount, _ref3) => {
       let {
         error
       } = _ref3;
-      if ([400, 401, 403, 404, 422].includes(error?.status)) return false;
+      if ([400, 401, 403, 404, 422].includes(error === null || error === void 0 ? void 0 : error.status)) return false;
       return failureCount < 3;
-    },
-    ...opts
-  });
+    }
+  }, opts));
   return {
     data,
     isPending,
@@ -69,7 +73,7 @@ const aggregateData = (inputs, data) => {
   const dataObject = {};
   inputs.forEach((input, index) => {
     const key = input.key;
-    dataObject[key] = data?.[index];
+    dataObject[key] = data === null || data === void 0 ? void 0 : data[index];
   });
   return dataObject;
 };
@@ -89,18 +93,17 @@ export const useMultipleZarr = function (inputs) {
     isLoading: isPending = false,
     serverError = null
   } = useQueries({
-    queries: inputs.map(input => ({
+    queries: inputs.map(input => _objectSpread({
       queryKey: ["zarr", input.url, input.path, input.s],
       queryFn: () => fetchDataFromZarr(input.url, input.path, input.s, options),
       retry: (failureCount, _ref4) => {
         let {
           error
         } = _ref4;
-        if ([400, 401, 403, 404, 422].includes(error?.status)) return false;
+        if ([400, 401, 403, 404, 422].includes(error === null || error === void 0 ? void 0 : error.status)) return false;
         return failureCount < 3;
-      },
-      ...opts
-    })),
+      }
+    }, opts)),
     combine
   });
   return {