@haniffalab/cherita-react 1.2.0-dev.2025-05-21.31931945 → 1.2.0-dev.2025-05-21.e57ef5f2

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 {
@@ -47,18 +52,17 @@ export const useZarr = function (_ref2) {
     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 {

package/dist/esm/utils/Filter.js

@@ -15,7 +15,7 @@ const isInBins = (v, binEdges, indices) => {
   return _.some(ranges, range => _.inRange(v, ...range));
 };
 const isInPolygons = (polygons, positions, index) => {
-  if (!polygons?.length || !positions?.length) {
+  if (!(polygons !== null && polygons !== void 0 && polygons.length) || !(positions !== null && positions !== void 0 && positions.length)) {
     return false;
   }
   return _.some(polygons, (_f, i) => {
@@ -23,12 +23,13 @@ const isInPolygons = (polygons, positions, index) => {
   });
 };
 const isInValues = (omit, value) => {
-  if (!omit?.length) {
+  if (!(omit !== null && omit !== void 0 && omit.length)) {
     return true;
   }
   return !_.includes(omit, value);
 };
 export const useFilter = data => {
+  var _settings$selectedObs, _settings$selectedObs2, _settings$selectedObs3, _settings$selectedObs4, _settings$selectedObs7, _settings$selectedObs8;
   const settings = useSettings();
   const filterDataDispatch = useFilteredDataDispatch();
   const {
@@ -38,24 +39,26 @@ export const useFilter = data => {
     isPending,
     serverError
   } = data;
-  const isCategorical = settings.selectedObs?.type === OBS_TYPES.CATEGORICAL || settings.selectedObs?.type === OBS_TYPES.BOOLEAN;
-  const isContinuous = settings.selectedObs?.type === OBS_TYPES.CONTINUOUS;
-  const sliceByObs = settings.colorEncoding === COLOR_ENCODINGS.OBS && !!settings.selectedObs?.omit.length || settings.sliceBy.obs;
+  const isCategorical = ((_settings$selectedObs = settings.selectedObs) === null || _settings$selectedObs === void 0 ? void 0 : _settings$selectedObs.type) === OBS_TYPES.CATEGORICAL || ((_settings$selectedObs2 = settings.selectedObs) === null || _settings$selectedObs2 === void 0 ? void 0 : _settings$selectedObs2.type) === OBS_TYPES.BOOLEAN;
+  const isContinuous = ((_settings$selectedObs3 = settings.selectedObs) === null || _settings$selectedObs3 === void 0 ? void 0 : _settings$selectedObs3.type) === OBS_TYPES.CONTINUOUS;
+  const sliceByObs = settings.colorEncoding === COLOR_ENCODINGS.OBS && !!((_settings$selectedObs4 = settings.selectedObs) !== null && _settings$selectedObs4 !== void 0 && _settings$selectedObs4.omit.length) || settings.sliceBy.obs;
   const isInObsSlice = useCallback((index, values) => {
     let inSlice = true;
     if (values && sliceByObs) {
       if (isCategorical) {
-        inSlice &= isInValues(settings.selectedObs?.omit, values[index]);
+        var _settings$selectedObs5;
+        inSlice &= isInValues((_settings$selectedObs5 = settings.selectedObs) === null || _settings$selectedObs5 === void 0 ? void 0 : _settings$selectedObs5.omit, values[index]);
       } else if (isContinuous) {
         if (isNaN(values[index])) {
-          inSlice &= isInValues(settings.selectedObs?.omit, -1);
+          var _settings$selectedObs6;
+          inSlice &= isInValues((_settings$selectedObs6 = settings.selectedObs) === null || _settings$selectedObs6 === void 0 ? void 0 : _settings$selectedObs6.omit, -1);
         } else {
           inSlice &= isInBins(values[index], settings.selectedObs.bins.binEdges, _.without(settings.selectedObs.omit, -1));
         }
       }
     }
     return inSlice;
-  }, [settings.selectedObs?.bins?.binEdges, settings.selectedObs?.omit, isCategorical, isContinuous, sliceByObs]);
+  }, [(_settings$selectedObs7 = settings.selectedObs) === null || _settings$selectedObs7 === void 0 || (_settings$selectedObs7 = _settings$selectedObs7.bins) === null || _settings$selectedObs7 === void 0 ? void 0 : _settings$selectedObs7.binEdges, (_settings$selectedObs8 = settings.selectedObs) === null || _settings$selectedObs8 === void 0 ? void 0 : _settings$selectedObs8.omit, isCategorical, isContinuous, sliceByObs]);
   const isInPolygonsSlice = useCallback((index, positions) => {
     let inSlice = true;
     if (settings.sliceBy.polygons && positions) {
@@ -121,11 +124,12 @@ export const useFilter = data => {
         slicedLength: filtered.length
       };
     } else {
+      var _obsData$data;
       return {
         filteredIndices: null,
         valueMin: _.min(obsData.data),
         valueMax: _.max(obsData.data),
-        slicedLength: obsData.data?.length
+        slicedLength: (_obsData$data = obsData.data) === null || _obsData$data === void 0 ? void 0 : _obsData$data.length
       };
     }
   }, [settings.colorEncoding, isContinuous, isInSlice, isPending, obsData.data, obsmData.data, serverError, xData.data]);

package/dist/esm/utils/Histogram.js

@@ -4,6 +4,7 @@ import _ from "lodash";
 import { LoadingLinear } from "./LoadingIndicators";
 import { formatNumerical, FORMATS } from "./string";
 export function Histogram(_ref) {
+  var _data$bin_edges;
   let {
     data,
     isPending,
@@ -29,11 +30,11 @@ export function Histogram(_ref) {
       let {
         dataIndex
       } = _ref2;
-      return `${formatNumerical(data.hist[dataIndex])}`;
+      return "".concat(formatNumerical(data.hist[dataIndex]));
     },
     xAxis: {
-      data: _.range(data.bin_edges?.length) || null,
-      valueFormatter: v => `Bin [${formatNumerical(data.bin_edges[v][0], FORMATS.EXPONENTIAL)}, ${formatNumerical(data.bin_edges[v][1], FORMATS.EXPONENTIAL)}${v === data.bin_edges.length - 1 ? "]" : ")"}`
+      data: _.range((_data$bin_edges = data.bin_edges) === null || _data$bin_edges === void 0 ? void 0 : _data$bin_edges.length) || null,
+      valueFormatter: v => "Bin [".concat(formatNumerical(data.bin_edges[v][0], FORMATS.EXPONENTIAL), ", ").concat(formatNumerical(data.bin_edges[v][1], FORMATS.EXPONENTIAL)).concat(v === data.bin_edges.length - 1 ? "]" : ")")
     },
     slotProps: {
       popper: {

package/dist/esm/utils/Legend.js

@@ -35,6 +35,7 @@ export function Legend(_ref) {
     });
   }, [colorscale, getColor, isCategorical]);
   if (settings.colorEncoding && !isCategorical) {
+    var _settings$selectedVar, _settings$selectedObs;
     return /*#__PURE__*/React.createElement("div", {
       className: "cherita-legend"
     }, /*#__PURE__*/React.createElement("div", {
@@ -44,7 +45,7 @@ export function Legend(_ref) {
     }, /*#__PURE__*/React.createElement(FontAwesomeIcon, {
       icon: faDroplet,
       className: "me-1"
-    }), (settings.colorEncoding === COLOR_ENCODINGS.VAR ? settings.selectedVar?.name : settings.selectedObs?.name) + addText), spanList, /*#__PURE__*/React.createElement("span", {
+    }), (settings.colorEncoding === COLOR_ENCODINGS.VAR ? (_settings$selectedVar = settings.selectedVar) === null || _settings$selectedVar === void 0 ? void 0 : _settings$selectedVar.name : (_settings$selectedObs = settings.selectedObs) === null || _settings$selectedObs === void 0 ? void 0 : _settings$selectedObs.name) + addText), spanList, /*#__PURE__*/React.createElement("span", {
       className: "domain-min"
     }, formatNumerical(min, FORMATS.EXPONENTIAL)), /*#__PURE__*/React.createElement("span", {
       className: "domain-med"

package/dist/esm/utils/LoadingIndicators.js

@@ -9,7 +9,7 @@ export const LoadingSpinner = _ref => {
     className: "loading-spinner"
   }, /*#__PURE__*/React.createElement(CircularProgress, {
     disableShrink: disableShrink
-  }), text?.length && /*#__PURE__*/React.createElement("span", {
+  }), (text === null || text === void 0 ? void 0 : text.length) && /*#__PURE__*/React.createElement("span", {
     className: "visually-hidden"
   }, text));
 };

package/dist/esm/utils/VirtualizedList.js

@@ -1,16 +1,20 @@
+const _excluded = ["getDataAtIndex", "count", "ItemComponent", "estimateSize", "overscan", "maxHeight"];
 function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
+function _objectWithoutProperties(e, t) { if (null == e) return {}; var o, r, i = _objectWithoutPropertiesLoose(e, t); if (Object.getOwnPropertySymbols) { var n = Object.getOwnPropertySymbols(e); for (r = 0; r < n.length; r++) o = n[r], -1 === t.indexOf(o) && {}.propertyIsEnumerable.call(e, o) && (i[o] = e[o]); } return i; }
+function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (-1 !== e.indexOf(n)) continue; t[n] = r[n]; } return t; }
 import React, { useCallback, useEffect, useState } from "react";
 import { useVirtualizer } from "@tanstack/react-virtual";
 export function VirtualizedList(_ref) {
+  var _virtualItems$0$start, _virtualItems$;
   let {
-    getDataAtIndex,
-    count,
-    ItemComponent,
-    estimateSize = 45,
-    overscan = 25,
-    maxHeight = "65vh",
-    ...props
-  } = _ref;
+      getDataAtIndex,
+      count,
+      ItemComponent,
+      estimateSize = 45,
+      overscan = 25,
+      maxHeight = "65vh"
+    } = _ref,
+    props = _objectWithoutProperties(_ref, _excluded);
   const [parentNode, setParentNode] = useState(null);
   const itemVirtualizer = useVirtualizer({
     count: count,
@@ -24,7 +28,7 @@ export function VirtualizedList(_ref) {
   const virtualItems = itemVirtualizer.getVirtualItems();
   useEffect(() => {
     itemVirtualizer.measure();
-  }, [itemVirtualizer, parentNode?.clientHeight, getDataAtIndex]);
+  }, [itemVirtualizer, parentNode === null || parentNode === void 0 ? void 0 : parentNode.clientHeight, getDataAtIndex]);
   return /*#__PURE__*/React.createElement("div", {
     ref: refCallback,
     style: {
@@ -34,7 +38,7 @@ export function VirtualizedList(_ref) {
     className: "modern-scrollbars"
   }, /*#__PURE__*/React.createElement("div", {
     style: {
-      height: `${itemVirtualizer.getTotalSize()}px`,
+      height: "".concat(itemVirtualizer.getTotalSize(), "px"),
       width: "100%",
       position: "relative",
       willChange: "transform"
@@ -45,7 +49,7 @@ export function VirtualizedList(_ref) {
       top: 0,
       left: 0,
       width: "100%",
-      transform: `translateY(${virtualItems[0]?.start ?? 0}px)`
+      transform: "translateY(".concat((_virtualItems$0$start = (_virtualItems$ = virtualItems[0]) === null || _virtualItems$ === void 0 ? void 0 : _virtualItems$.start) !== null && _virtualItems$0$start !== void 0 ? _virtualItems$0$start : 0, "px)")
     }
   }, virtualItems.map(virtualItem => /*#__PURE__*/React.createElement("div", {
     key: virtualItem.key,

package/dist/esm/utils/errors.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); }
 export const parseError = err => {
   if (err === DOMException.TIMEOUT_ERR) {
     return {
@@ -5,42 +10,35 @@ export const parseError = err => {
       name: err
     };
   }
-  switch (err?.name) {
+  switch (err === null || err === void 0 ? void 0 : err.name) {
     case "TypeError":
-      return {
-        ...err,
+      return _objectSpread(_objectSpread({}, err), {}, {
         message: "Failed to fetch data from server"
-      };
+      });
     case "ReadZarrError":
-      return {
-        ...err,
+      return _objectSpread(_objectSpread({}, err), {}, {
         message: "Failed to read AnnData-Zarr"
-      };
+      });
     case "InvalidObs":
-      return {
-        ...err,
+      return _objectSpread(_objectSpread({}, err), {}, {
         message: "Observation not found in dataset"
-      };
+      });
     case "InvalidVar":
-      return {
-        ...err,
+      return _objectSpread(_objectSpread({}, err), {}, {
         message: "Feature not found in dataset"
-      };
+      });
     case "InvalidKey":
-      return {
-        ...err,
+      return _objectSpread(_objectSpread({}, err), {}, {
         message: "Key not found in datset"
-      };
+      });
     case "BadRequest":
-      return {
-        ...err,
+      return _objectSpread(_objectSpread({}, err), {}, {
         message: "Invalid request to server"
-      };
+      });
     case "InternalServerError":
-      return {
-        ...err,
+      return _objectSpread(_objectSpread({}, err), {}, {
         message: "Server error"
-      };
+      });
     default:
       return err;
   }

package/dist/esm/utils/requests.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 { useQuery } from "@tanstack/react-query";
 import { useDebounce } from "@uidotdev/usehooks";
 import { parseError } from "./errors";
@@ -42,7 +47,7 @@ export const useFetch = function (endpoint, params) {
     data: fetchedData = null,
     isLoading: isPending = false,
     error: serverError = null
-  } = useQuery({
+  } = useQuery(_objectSpread({
     queryKey: [endpoint, params],
     queryFn: _ref => {
       let {
@@ -54,11 +59,10 @@ export const useFetch = function (endpoint, params) {
       let {
         error
       } = _ref2;
-      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 {
     fetchedData,
     isPending,
@@ -77,7 +81,7 @@ export const useDebouncedFetch = function (endpoint, params) {
     data: fetchedData = null,
     isLoading: isPending = false,
     error: serverError = null
-  } = useQuery({
+  } = useQuery(_objectSpread({
     queryKey: [endpoint, debouncedParams],
     queryFn: _ref3 => {
       let {
@@ -89,11 +93,10 @@ export const useDebouncedFetch = function (endpoint, params) {
       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));
   return {
     fetchedData,
     isPending,

package/dist/esm/utils/zarrData.js

@@ -37,14 +37,15 @@ const meanData = (_i, data) => {
   });
 };
 export const useXData = function () {
+  var _settings$selectedVar, _settings$selectedVar2, _settings$selectedVar3;
   let agg = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : meanData;
   const dataset = useDataset();
   const settings = useSettings();
-  const [xParams, setXParams] = useState(!settings.selectedVar ? [] : !settings.selectedVar?.isSet ? [{
+  const [xParams, setXParams] = useState(!settings.selectedVar ? [] : !((_settings$selectedVar = settings.selectedVar) !== null && _settings$selectedVar !== void 0 && _settings$selectedVar.isSet) ? [{
     url: dataset.url,
     path: "X",
-    s: [null, settings.selectedVar?.matrix_index]
-  }] : _.map(settings.selectedVar?.vars, v => {
+    s: [null, (_settings$selectedVar2 = settings.selectedVar) === null || _settings$selectedVar2 === void 0 ? void 0 : _settings$selectedVar2.matrix_index]
+  }] : _.map((_settings$selectedVar3 = settings.selectedVar) === null || _settings$selectedVar3 === void 0 ? void 0 : _settings$selectedVar3.vars, v => {
     return {
       url: dataset.url,
       path: "X",
@@ -52,11 +53,12 @@ export const useXData = function () {
     };
   }));
   useEffect(() => {
-    setXParams(!settings.selectedVar ? [] : !settings.selectedVar?.isSet ? [{
+    var _settings$selectedVar4, _settings$selectedVar5, _settings$selectedVar6;
+    setXParams(!settings.selectedVar ? [] : !((_settings$selectedVar4 = settings.selectedVar) !== null && _settings$selectedVar4 !== void 0 && _settings$selectedVar4.isSet) ? [{
       url: dataset.url,
       path: "X",
-      s: [null, settings.selectedVar?.matrix_index]
-    }] : _.map(settings.selectedVar?.vars, v => {
+      s: [null, (_settings$selectedVar5 = settings.selectedVar) === null || _settings$selectedVar5 === void 0 ? void 0 : _settings$selectedVar5.matrix_index]
+    }] : _.map((_settings$selectedVar6 = settings.selectedVar) === null || _settings$selectedVar6 === void 0 ? void 0 : _settings$selectedVar6.vars, v => {
       return {
         url: dataset.url,
         path: "X",
@@ -69,18 +71,20 @@ export const useXData = function () {
   }, agg);
 };
 export const useObsData = function () {
+  var _obs, _obs2;
   let obs = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : null;
   const dataset = useDataset();
   const settings = useSettings();
   obs = obs || settings.selectedObs;
   const [obsParams, setObsParams] = useState({
     url: dataset.url,
-    path: "obs/" + obs?.name + (obs?.type === OBS_TYPES.CATEGORICAL ? "/codes" : "")
+    path: "obs/" + ((_obs = obs) === null || _obs === void 0 ? void 0 : _obs.name) + (((_obs2 = obs) === null || _obs2 === void 0 ? void 0 : _obs2.type) === OBS_TYPES.CATEGORICAL ? "/codes" : "")
   });
   useEffect(() => {
+    var _obs3, _obs4;
     setObsParams({
       url: dataset.url,
-      path: "obs/" + obs?.name + (obs?.type === OBS_TYPES.CATEGORICAL ? "/codes" : "")
+      path: "obs/" + ((_obs3 = obs) === null || _obs3 === void 0 ? void 0 : _obs3.name) + (((_obs4 = obs) === null || _obs4 === void 0 ? void 0 : _obs4.type) === OBS_TYPES.CATEGORICAL ? "/codes" : "")
     });
   }, [dataset.url, obs]);
   return useZarr(obsParams, GET_OPTIONS, {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@haniffalab/cherita-react",
-  "version": "1.2.0-dev.2025-05-21.31931945",
+  "version": "1.2.0-dev.2025-05-21.e57ef5f2",
   "author": "Haniffa Lab",
   "license": "MIT",
   "keywords": [
@@ -77,6 +77,8 @@
     "jest": "^29.7.0",
     "jest-environment-jsdom": "^29.7.0",
     "prettier": "^3.5.3",
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0",
     "sass": "1.77.6",
     "stylelint": "^16.10.0",
     "stylelint-config-prettier": "^9.0.5",
@@ -124,5 +126,5 @@
     "url": "https://github.com/haniffalab/cherita-react/issues"
   },
   "homepage": "https://github.com/haniffalab/cherita-react#readme",
-  "prereleaseSha": "3193194575e897f284c3f74b00f33e159844c988"
+  "prereleaseSha": "e57ef5f2c023e4400ae9f7dbcb1495778ba11e29"
 }

package/scss/cherita.scss

@@ -281,6 +281,11 @@ $gauge-padding: 0.15rem;
   font-size: 0.85rem !important;
 }
 
+.feature-disease-info-list {
+  max-height: 300px;
+  overflow-y: auto;
+}
+
 .feature-disease-info {
   font-weight: 300;
   padding-left: 0 !important;

package/scss/components/layouts.scss

@@ -106,4 +106,8 @@
 .search-modal-info {
   overflow-y: auto;
   border-left: 1px solid #dee2e6;
+}
+
+.ps-xs-1 {
+  padding-left: 0.15rem !important;
 }

package/scss/components/lists.scss

@@ -29,9 +29,8 @@
   border-radius: var(--#{$prefix}border-radius);
 }
 
-.cherita-list.var-set-list {
-  .list-group-item {
-    padding-right: 0;
-    padding-left: 0.35rem;
-  }
+.cherita-list.var-set-list > .list-group-item {
+  filter: brightness(0.95); // darken background
+  padding-right: 0;
+  padding-left: 0.35rem;
 }