@haniffalab/cherita-react 1.4.4 → 1.4.6-dev.2026-01-12.f157a881

package/dist/cjs/components/obsm-list/ObsmList.js

@@ -14,11 +14,6 @@ var _requests = require("../../utils/requests");
 var _Skeleton = require("../../utils/Skeleton");
 var _jsxRuntime = require("react/jsx-runtime");
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-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); }
 function ObsmKeysList(_ref) {
   let {
     setHasObsm
@@ -27,18 +22,11 @@ function ObsmKeysList(_ref) {
   const dataset = (0, _DatasetContext.useDataset)();
   const settings = (0, _SettingsContext.useSettings)();
   const dispatch = (0, _SettingsContext.useSettingsDispatch)();
-  const [obsmKeysList, setObsmKeysList] = (0, _react.useState)([]);
+  const [keysList, setKeysList] = (0, _react.useState)([]);
   const [active, setActive] = (0, _react.useState)(null);
-  const [params, setParams] = (0, _react.useState)({
+  const params = (0, _react.useMemo)(() => ({
     url: dataset.url
-  });
-  (0, _react.useEffect)(() => {
-    setParams(p => {
-      return _objectSpread(_objectSpread({}, p), {}, {
-        url: dataset.url
-      });
-    });
-  }, [dataset.url]);
+  }), [dataset.url]);
   const {
     fetchedData,
     isPending,
@@ -48,17 +36,34 @@ function ObsmKeysList(_ref) {
   });
   (0, _react.useEffect)(() => {
     if (!isPending && !serverError) {
-      if (!fetchedData || !fetchedData.length) {
+      const obsmKeysArray = Array.isArray(fetchedData) ? fetchedData : [];
+      if (obsmKeysArray.length === 0) {
         setHasObsm(false);
+        setKeysList([]);
+        if (settings.selectedObsm) {
+          dispatch({
+            type: 'select.obsm',
+            obsm: null
+          });
+        }
       } else {
         setHasObsm(true);
-        setObsmKeysList(fetchedData);
-
-        // Set default obsm if in keys list and not selected
-        if (!settings.selectedObsm) {
+        setKeysList(obsmKeysArray);
+        if (settings.selectedObsm) {
+          // If selected obsm is not in keys list, reset to null
+          if (!_lodash.default.includes(obsmKeysArray, settings.selectedObsm)) {
+            dispatch({
+              type: 'select.obsm',
+              obsm: null
+            });
+          } else {
+            setActive(settings.selectedObsm);
+          }
+        } else {
+          // Set default obsm if in keys list and not selected
           // Follow DEFAULT_OBSM_KEYS order
           _lodash.default.each(_constants.DEFAULT_OBSM_KEYS, k => {
-            const defaultObsm = _lodash.default.find(fetchedData, item => item.toLowerCase() === k);
+            const defaultObsm = _lodash.default.find(obsmKeysArray, item => item.toLowerCase() === k);
             if (defaultObsm) {
               dispatch({
                 type: 'select.obsm',
@@ -69,20 +74,16 @@ function ObsmKeysList(_ref) {
           });
         }
       }
+    } else if (!isPending && serverError) {
       if (settings.selectedObsm) {
-        // If selected obsm is not in keys list, reset to null
-        if (!_lodash.default.includes(fetchedData || [], settings.selectedObsm)) {
-          dispatch({
-            type: 'select.obsm',
-            obsm: null
-          });
-        } else {
-          setActive(settings.selectedObsm);
-        }
+        dispatch({
+          type: 'select.obsm',
+          obsm: null
+        });
       }
     }
   }, [dispatch, fetchedData, isPending, serverError, setHasObsm, settings.selectedObsm]);
-  const obsmList = obsmKeysList.map(item => {
+  const obsmList = keysList.map(item => {
     return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactBootstrap.Dropdown.Item, {
       className: "custom ".concat(active === item && 'active'),
       onClick: () => {

package/dist/cjs/components/var-list/VarItem.js

@@ -165,13 +165,11 @@ function SelectionItem(_ref3) {
               selectVar();
             },
             disabled: isNotInData,
-            title: isNotInData ? 'Not present in data' : 'Set as color encoding',
-            children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactFontawesome.FontAwesomeIcon, {
+            title: isNotInData ? 'Not present in data' : isMultiple ? isActive ? 'Remove from plot' : 'Add to plot' : 'Set as color encoding',
+            children: [!isMultiple && /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactFontawesome.FontAwesomeIcon, {
               icon: _freeSolidSvgIcons.faDroplet
             }), isMultiple && /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactFontawesome.FontAwesomeIcon, {
-              icon: _freeSolidSvgIcons.faPlus,
-              size: "xs",
-              className: "ps-xs-1"
+              icon: _freeSolidSvgIcons.faCheck
             })]
           }, item.matrix_index), showRemove && /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactBootstrap.Button, {
             type: "button",

package/dist/cjs/components/var-list/VarSet.js

@@ -9,10 +9,10 @@ var _freeSolidSvgIcons = require("@fortawesome/free-solid-svg-icons");
 var _reactFontawesome = require("@fortawesome/react-fontawesome");
 var _lodash = _interopRequireDefault(require("lodash"));
 var _reactBootstrap = require("react-bootstrap");
-var _VarItem = require("./VarItem");
 var _constants = require("../../constants/constants");
 var _SettingsContext = require("../../context/SettingsContext");
 var _SearchBar = require("../search-bar/SearchBar");
+var _VarItem = require("./VarItem");
 var _jsxRuntime = require("react/jsx-runtime");
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 // @TODO: add button to score genes and plot
@@ -101,13 +101,11 @@ function SelectionSet(_ref) {
               selectSet();
             },
             disabled: !set.vars.length,
-            title: "Set as color encoding",
-            children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactFontawesome.FontAwesomeIcon, {
+            title: !set.vars.length ? 'No variables in set' : isMultiple ? isActive ? 'Remove from plot' : 'Add to plot' : 'Set as color encoding',
+            children: [!isMultiple && /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactFontawesome.FontAwesomeIcon, {
               icon: _freeSolidSvgIcons.faDroplet
             }), isMultiple && /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactFontawesome.FontAwesomeIcon, {
-              icon: _freeSolidSvgIcons.faPlus,
-              size: "xs",
-              className: "ps-xs-1"
+              icon: _freeSolidSvgIcons.faCheck
             })]
           }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactBootstrap.Button, {
             type: "button",

package/dist/cjs/context/DatasetContext.js

@@ -60,7 +60,7 @@ const persistOptions = {
       return false;
     }
   },
-  buster: "1.4.4" || '0.0.0'
+  buster: "1.4.6-dev.2026-01-12.f157a881" || '0.0.0'
   // @TODO: add maxAge and api version numbers as buster
 };
 const initialDataset = {

package/dist/cjs/context/SettingsContext.js

@@ -173,7 +173,7 @@ function SettingsProvider(_ref2) {
 
   // If the buster is not set or does not match the current package version,
   // reset localSettings to avoid stale data
-  if (!buster || buster !== "1.4.4") {
+  if (!buster || buster !== "1.4.6-dev.2026-01-12.f157a881") {
     localSettings = {};
   }
   const initSettings = (0, _react.useRef)(initializer({
@@ -198,7 +198,7 @@ function SettingsProvider(_ref2) {
     if (canOverrideSettings && settings) {
       try {
         localStorage.setItem(DATASET_STORAGE_KEY, JSON.stringify(_objectSpread({
-          buster: "1.4.4" || '0.0.0',
+          buster: "1.4.6-dev.2026-01-12.f157a881" || '0.0.0',
           timestamp: Date.now()
         }, _lodash.default.omit(settings, 'data'))));
       } catch (err) {

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

@@ -3,69 +3,60 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.useZarr = exports.useMultipleZarr = exports.ZarrHelper = exports.GET_OPTIONS = void 0;
+exports.useZarr = exports.useMultipleZarr = exports.ZarrHelper = void 0;
 var _react = require("react");
 var _reactQuery = require("@tanstack/react-query");
-var _zarr = require("zarr");
+var zarr = _interopRequireWildcard(require("zarrita"));
+var _ndarray = require("@zarrita/ndarray");
+var _ndarrayUnpack = _interopRequireDefault(require("ndarray-unpack"));
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
 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); }
-const GET_OPTIONS = exports.GET_OPTIONS = {
-  concurrencyLimit: 10,
-  // max number of concurrent requests (default 10)
-  progressCallback: _ref => {
-    let {
-      progress,
-      queueSize
-    } = _ref;
-    console.debug("".concat(progress / queueSize * 100, "% complete."));
-  } // callback executed after each request
-};
 class ZarrHelper {
   async open(url, path) {
-    const z = await (0, _zarr.openArray)({
-      store: url,
-      path: path,
-      mode: 'r'
-    });
+    const root = zarr.root(new zarr.FetchStore(url));
+    const z = await zarr.open(root.resolve(path));
     return z;
   }
 }
 exports.ZarrHelper = ZarrHelper;
-const fetchDataFromZarr = async (url, path, s, opts) => {
+const fetchDataFromZarr = async (url, path, s) => {
   try {
     const zarrHelper = new ZarrHelper();
     const z = await zarrHelper.open(url, path);
-    const result = await z.get(s, opts);
-    return result.data;
+    const result = await (0, _ndarray.get)(z, s);
+    if (result.dtype === 'bigint64') throw new Error('bigint64 dtype not supported');
+    const arr = (0, _ndarrayUnpack.default)(result);
+    return arr;
   } catch (error) {
-    if (error instanceof _zarr.ArrayNotFoundError || error instanceof _zarr.GroupNotFoundError) {
+    if (error instanceof zarr.NodeNotFoundError) {
       error.status = 404;
     }
     throw error;
   }
 };
-const useZarr = function (_ref2) {
+const useZarr = function (_ref) {
   let {
     url,
     path,
     s = null
-  } = _ref2;
-  let options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : GET_OPTIONS;
-  let opts = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
+  } = _ref;
+  let opts = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
   const {
     data = null,
     isLoading: isPending = false,
     error: serverError = null
   } = (0, _reactQuery.useQuery)(_objectSpread({
     queryKey: ['zarr', url, path, s],
-    queryFn: () => fetchDataFromZarr(url, path, s, options),
-    retry: (failureCount, _ref3) => {
+    queryFn: () => fetchDataFromZarr(url, path, s),
+    retry: (failureCount, _ref2) => {
       let {
         error
-      } = _ref3;
+      } = _ref2;
       if ([400, 401, 403, 404, 422].includes(error === null || error === void 0 ? void 0 : error.status)) return false;
       return failureCount < 3;
     }
@@ -86,9 +77,8 @@ const aggregateData = (inputs, data) => {
   return dataObject;
 };
 const useMultipleZarr = function (inputs) {
-  let options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : GET_OPTIONS;
-  let opts = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
-  let agg = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : aggregateData;
+  let opts = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
+  let agg = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : aggregateData;
   const combine = (0, _react.useCallback)(results => {
     return {
       data: agg(inputs, results.map(result => result.data)),
@@ -103,11 +93,11 @@ const useMultipleZarr = function (inputs) {
   } = (0, _reactQuery.useQueries)({
     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) => {
+      queryFn: () => fetchDataFromZarr(input.url, input.path, input.s),
+      retry: (failureCount, _ref3) => {
         let {
           error
-        } = _ref4;
+        } = _ref3;
         if ([400, 401, 403, 404, 422].includes(error === null || error === void 0 ? void 0 : error.status)) return false;
         return failureCount < 3;
       }

package/dist/cjs/utils/zarrData.js

@@ -6,7 +6,7 @@ Object.defineProperty(exports, "__esModule", {
 exports.useXData = exports.useObsmData = exports.useObsData = exports.useLabelObsData = void 0;
 var _react = require("react");
 var _lodash = _interopRequireDefault(require("lodash"));
-var _zarr = require("zarr");
+var _zarrita = require("zarrita");
 var _Resolver = require("./Resolver");
 var _constants = require("../constants/constants");
 var _DatasetContext = require("../context/DatasetContext");
@@ -22,9 +22,9 @@ const useObsmData = function () {
   const obsmParams = (0, _react.useMemo)(() => ({
     url: dataset.url,
     path: 'obsm/' + obsm,
-    s: [null, (0, _zarr.slice)(null, 2)] // load only [:, :2]
+    s: [null, (0, _zarrita.slice)(null, 2)] // load only [:, :2]
   }), [dataset.url, obsm]);
-  return (0, _zarrHelper.useZarr)(obsmParams, _zarrHelper.GET_OPTIONS, {
+  return (0, _zarrHelper.useZarr)(obsmParams, {
     enabled: !!obsm
   });
 };
@@ -52,7 +52,7 @@ const useXData = function () {
       s: [null, v.matrix_index]
     };
   }), [dataset.url, selectedVar]);
-  return (0, _zarrHelper.useMultipleZarr)(xParams, _zarrHelper.GET_OPTIONS, {
+  return (0, _zarrHelper.useMultipleZarr)(xParams, {
     enabled: !!xParams.length
   }, agg);
 };
@@ -70,7 +70,7 @@ const useObsData = function () {
       path: 'obs/' + ((_obs = obs) === null || _obs === void 0 ? void 0 : _obs.name) + (((_obs2 = obs) === null || _obs2 === void 0 ? void 0 : _obs2.type) === _constants.OBS_TYPES.CATEGORICAL ? '/codes' : '')
     };
   }, [dataset.url, (_obs3 = obs) === null || _obs3 === void 0 ? void 0 : _obs3.name, (_obs4 = obs) === null || _obs4 === void 0 ? void 0 : _obs4.type]);
-  return (0, _zarrHelper.useZarr)(obsParams, _zarrHelper.GET_OPTIONS, {
+  return (0, _zarrHelper.useZarr)(obsParams, {
     enabled: !!obs
   });
 };
@@ -86,7 +86,7 @@ const useLabelObsData = () => {
       key: obs.name
     };
   }), [dataset.url, settings.data.obs, settings.labelObs]);
-  return (0, _zarrHelper.useMultipleZarr)(labelObsParams, _zarrHelper.GET_OPTIONS, {
+  return (0, _zarrHelper.useMultipleZarr)(labelObsParams, {
     enabled: !!labelObsParams.length
   });
 };

package/dist/esm/components/obsm-list/ObsmList.js

@@ -1,9 +1,4 @@
-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 { useEffect, useState } from 'react';
+import { useEffect, useState, useMemo } from 'react';
 import _ from 'lodash';
 import { Button, ButtonGroup, Dropdown, DropdownButton, OverlayTrigger, Tooltip } from 'react-bootstrap';
 import { DEFAULT_OBSM_KEYS } from '../../constants/constants';
@@ -20,18 +15,11 @@ export function ObsmKeysList(_ref) {
   const dataset = useDataset();
   const settings = useSettings();
   const dispatch = useSettingsDispatch();
-  const [obsmKeysList, setObsmKeysList] = useState([]);
+  const [keysList, setKeysList] = useState([]);
   const [active, setActive] = useState(null);
-  const [params, setParams] = useState({
+  const params = useMemo(() => ({
     url: dataset.url
-  });
-  useEffect(() => {
-    setParams(p => {
-      return _objectSpread(_objectSpread({}, p), {}, {
-        url: dataset.url
-      });
-    });
-  }, [dataset.url]);
+  }), [dataset.url]);
   const {
     fetchedData,
     isPending,
@@ -41,17 +29,34 @@ export function ObsmKeysList(_ref) {
   });
   useEffect(() => {
     if (!isPending && !serverError) {
-      if (!fetchedData || !fetchedData.length) {
+      const obsmKeysArray = Array.isArray(fetchedData) ? fetchedData : [];
+      if (obsmKeysArray.length === 0) {
         setHasObsm(false);
+        setKeysList([]);
+        if (settings.selectedObsm) {
+          dispatch({
+            type: 'select.obsm',
+            obsm: null
+          });
+        }
       } else {
         setHasObsm(true);
-        setObsmKeysList(fetchedData);
-
-        // Set default obsm if in keys list and not selected
-        if (!settings.selectedObsm) {
+        setKeysList(obsmKeysArray);
+        if (settings.selectedObsm) {
+          // If selected obsm is not in keys list, reset to null
+          if (!_.includes(obsmKeysArray, settings.selectedObsm)) {
+            dispatch({
+              type: 'select.obsm',
+              obsm: null
+            });
+          } else {
+            setActive(settings.selectedObsm);
+          }
+        } else {
+          // Set default obsm if in keys list and not selected
           // Follow DEFAULT_OBSM_KEYS order
           _.each(DEFAULT_OBSM_KEYS, k => {
-            const defaultObsm = _.find(fetchedData, item => item.toLowerCase() === k);
+            const defaultObsm = _.find(obsmKeysArray, item => item.toLowerCase() === k);
             if (defaultObsm) {
               dispatch({
                 type: 'select.obsm',
@@ -62,20 +67,16 @@ export function ObsmKeysList(_ref) {
           });
         }
       }
+    } else if (!isPending && serverError) {
       if (settings.selectedObsm) {
-        // If selected obsm is not in keys list, reset to null
-        if (!_.includes(fetchedData || [], settings.selectedObsm)) {
-          dispatch({
-            type: 'select.obsm',
-            obsm: null
-          });
-        } else {
-          setActive(settings.selectedObsm);
-        }
+        dispatch({
+          type: 'select.obsm',
+          obsm: null
+        });
       }
     }
   }, [dispatch, fetchedData, isPending, serverError, setHasObsm, settings.selectedObsm]);
-  const obsmList = obsmKeysList.map(item => {
+  const obsmList = keysList.map(item => {
     return /*#__PURE__*/_jsx(Dropdown.Item, {
       className: "custom ".concat(active === item && 'active'),
       onClick: () => {

package/dist/esm/components/var-list/VarItem.js

@@ -4,7 +4,7 @@ function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object
 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 { useEffect, useState } from 'react';
-import { faDroplet, faPlus, faTrash } from '@fortawesome/free-solid-svg-icons';
+import { faCheck, faDroplet, faTrash } from '@fortawesome/free-solid-svg-icons';
 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
 import { MoreVert } from '@mui/icons-material';
 import _ from 'lodash';
@@ -156,13 +156,11 @@ export function SelectionItem(_ref3) {
               selectVar();
             },
             disabled: isNotInData,
-            title: isNotInData ? 'Not present in data' : 'Set as color encoding',
-            children: [/*#__PURE__*/_jsx(FontAwesomeIcon, {
+            title: isNotInData ? 'Not present in data' : isMultiple ? isActive ? 'Remove from plot' : 'Add to plot' : 'Set as color encoding',
+            children: [!isMultiple && /*#__PURE__*/_jsx(FontAwesomeIcon, {
               icon: faDroplet
             }), isMultiple && /*#__PURE__*/_jsx(FontAwesomeIcon, {
-              icon: faPlus,
-              size: "xs",
-              className: "ps-xs-1"
+              icon: faCheck
             })]
           }, item.matrix_index), showRemove && /*#__PURE__*/_jsx(Button, {
             type: "button",

package/dist/esm/components/var-list/VarSet.js

@@ -1,12 +1,12 @@
 import { useState } from 'react';
-import { faChevronDown, faChevronUp, faCircleInfo, faDroplet, faPlus, faTrash } from '@fortawesome/free-solid-svg-icons';
+import { faCheck, faChevronDown, faChevronUp, faCircleInfo, faDroplet, faPlus, faTrash } from '@fortawesome/free-solid-svg-icons';
 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
 import _ from 'lodash';
 import { Button, Collapse, ListGroup, OverlayTrigger, Tooltip } from 'react-bootstrap';
-import { SelectionItem } from './VarItem';
 import { COLOR_ENCODINGS, SELECTION_MODES } from '../../constants/constants';
 import { useSettings, useSettingsDispatch } from '../../context/SettingsContext';
 import { SearchModal } from '../search-bar/SearchBar';
+import { SelectionItem } from './VarItem';
 
 // @TODO: add button to score genes and plot
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
@@ -95,13 +95,11 @@ function SelectionSet(_ref) {
               selectSet();
             },
             disabled: !set.vars.length,
-            title: "Set as color encoding",
-            children: [/*#__PURE__*/_jsx(FontAwesomeIcon, {
+            title: !set.vars.length ? 'No variables in set' : isMultiple ? isActive ? 'Remove from plot' : 'Add to plot' : 'Set as color encoding',
+            children: [!isMultiple && /*#__PURE__*/_jsx(FontAwesomeIcon, {
               icon: faDroplet
             }), isMultiple && /*#__PURE__*/_jsx(FontAwesomeIcon, {
-              icon: faPlus,
-              size: "xs",
-              className: "ps-xs-1"
+              icon: faCheck
             })]
           }), /*#__PURE__*/_jsx(Button, {
             type: "button",

package/dist/esm/context/DatasetContext.js

@@ -51,7 +51,7 @@ const persistOptions = {
       return false;
     }
   },
-  buster: "1.4.4" || '0.0.0'
+  buster: "1.4.6-dev.2026-01-12.f157a881" || '0.0.0'
   // @TODO: add maxAge and api version numbers as buster
 };
 const initialDataset = {

package/dist/esm/context/SettingsContext.js

@@ -163,7 +163,7 @@ export function SettingsProvider(_ref2) {
 
   // If the buster is not set or does not match the current package version,
   // reset localSettings to avoid stale data
-  if (!buster || buster !== "1.4.4") {
+  if (!buster || buster !== "1.4.6-dev.2026-01-12.f157a881") {
     localSettings = {};
   }
   const initSettings = useRef(initializer({
@@ -188,7 +188,7 @@ export function SettingsProvider(_ref2) {
     if (canOverrideSettings && settings) {
       try {
         localStorage.setItem(DATASET_STORAGE_KEY, JSON.stringify(_objectSpread({
-          buster: "1.4.4" || '0.0.0',
+          buster: "1.4.6-dev.2026-01-12.f157a881" || '0.0.0',
           timestamp: Date.now()
         }, _.omit(settings, 'data'))));
       } catch (err) {

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

@@ -5,60 +5,49 @@ function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol"
 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';
-export const GET_OPTIONS = {
-  concurrencyLimit: 10,
-  // max number of concurrent requests (default 10)
-  progressCallback: _ref => {
-    let {
-      progress,
-      queueSize
-    } = _ref;
-    console.debug("".concat(progress / queueSize * 100, "% complete."));
-  } // callback executed after each request
-};
+import * as zarr from 'zarrita';
+import { get } from '@zarrita/ndarray';
+import unpack from 'ndarray-unpack';
 export class ZarrHelper {
   async open(url, path) {
-    const z = await openArray({
-      store: url,
-      path: path,
-      mode: 'r'
-    });
+    const root = zarr.root(new zarr.FetchStore(url));
+    const z = await zarr.open(root.resolve(path));
     return z;
   }
 }
-const fetchDataFromZarr = async (url, path, s, opts) => {
+const fetchDataFromZarr = async (url, path, s) => {
   try {
     const zarrHelper = new ZarrHelper();
     const z = await zarrHelper.open(url, path);
-    const result = await z.get(s, opts);
-    return result.data;
+    const result = await get(z, s);
+    if (result.dtype === 'bigint64') throw new Error('bigint64 dtype not supported');
+    const arr = unpack(result);
+    return arr;
   } catch (error) {
-    if (error instanceof ArrayNotFoundError || error instanceof GroupNotFoundError) {
+    if (error instanceof zarr.NodeNotFoundError) {
       error.status = 404;
     }
     throw error;
   }
 };
-export const useZarr = function (_ref2) {
+export const useZarr = function (_ref) {
   let {
     url,
     path,
     s = null
-  } = _ref2;
-  let options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : GET_OPTIONS;
-  let opts = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
+  } = _ref;
+  let opts = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
   const {
     data = null,
     isLoading: isPending = false,
     error: serverError = null
   } = useQuery(_objectSpread({
     queryKey: ['zarr', url, path, s],
-    queryFn: () => fetchDataFromZarr(url, path, s, options),
-    retry: (failureCount, _ref3) => {
+    queryFn: () => fetchDataFromZarr(url, path, s),
+    retry: (failureCount, _ref2) => {
       let {
         error
-      } = _ref3;
+      } = _ref2;
       if ([400, 401, 403, 404, 422].includes(error === null || error === void 0 ? void 0 : error.status)) return false;
       return failureCount < 3;
     }
@@ -78,9 +67,8 @@ const aggregateData = (inputs, data) => {
   return dataObject;
 };
 export const useMultipleZarr = function (inputs) {
-  let options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : GET_OPTIONS;
-  let opts = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
-  let agg = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : aggregateData;
+  let opts = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
+  let agg = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : aggregateData;
   const combine = useCallback(results => {
     return {
       data: agg(inputs, results.map(result => result.data)),
@@ -95,11 +83,11 @@ export const useMultipleZarr = function (inputs) {
   } = useQueries({
     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) => {
+      queryFn: () => fetchDataFromZarr(input.url, input.path, input.s),
+      retry: (failureCount, _ref3) => {
         let {
           error
-        } = _ref4;
+        } = _ref3;
         if ([400, 401, 403, 404, 422].includes(error === null || error === void 0 ? void 0 : error.status)) return false;
         return failureCount < 3;
       }

package/dist/esm/utils/zarrData.js

@@ -1,11 +1,11 @@
 import { useMemo } from 'react';
 import _ from 'lodash';
-import { slice } from 'zarr';
+import { slice } from 'zarrita';
 import { useSelectedObs, useSelectedVar } from './Resolver';
 import { OBS_TYPES } from '../constants/constants';
 import { useDataset } from '../context/DatasetContext';
 import { useSettings } from '../context/SettingsContext';
-import { GET_OPTIONS, useZarr, useMultipleZarr } from '../helpers/zarr-helper';
+import { useZarr, useMultipleZarr } from '../helpers/zarr-helper';
 
 // @TODO: support specifying slice to load from context
 export const useObsmData = function () {
@@ -18,7 +18,7 @@ export const useObsmData = function () {
     path: 'obsm/' + obsm,
     s: [null, slice(null, 2)] // load only [:, :2]
   }), [dataset.url, obsm]);
-  return useZarr(obsmParams, GET_OPTIONS, {
+  return useZarr(obsmParams, {
     enabled: !!obsm
   });
 };
@@ -45,7 +45,7 @@ export const useXData = function () {
       s: [null, v.matrix_index]
     };
   }), [dataset.url, selectedVar]);
-  return useMultipleZarr(xParams, GET_OPTIONS, {
+  return useMultipleZarr(xParams, {
     enabled: !!xParams.length
   }, agg);
 };
@@ -62,7 +62,7 @@ export const useObsData = function () {
       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' : '')
     };
   }, [dataset.url, (_obs3 = obs) === null || _obs3 === void 0 ? void 0 : _obs3.name, (_obs4 = obs) === null || _obs4 === void 0 ? void 0 : _obs4.type]);
-  return useZarr(obsParams, GET_OPTIONS, {
+  return useZarr(obsParams, {
     enabled: !!obs
   });
 };
@@ -77,7 +77,7 @@ export const useLabelObsData = () => {
       key: obs.name
     };
   }), [dataset.url, settings.data.obs, settings.labelObs]);
-  return useMultipleZarr(labelObsParams, GET_OPTIONS, {
+  return useMultipleZarr(labelObsParams, {
     enabled: !!labelObsParams.length
   });
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@haniffalab/cherita-react",
-  "version": "1.4.4",
+  "version": "1.4.6-dev.2026-01-12.f157a881",
   "author": "Haniffa Lab",
   "license": "MIT",
   "keywords": [
@@ -42,9 +42,11 @@
     "@tanstack/react-virtual": "^3.7.0",
     "@turf/turf": "^7.0.0",
     "@uidotdev/usehooks": "^2.4.1",
+    "@zarrita/ndarray": "^0.1.5",
     "bootstrap": "^5.3.3",
     "deck.gl": "8.8.27",
     "jquery": "^3.7.1",
+    "ndarray-unpack": "^1.0.0",
     "nebula.gl": "^1.0.4",
     "numbro": "^2.5.0",
     "plotly.js": "^2.23.2",
@@ -52,7 +54,7 @@
     "react-bootstrap": "^2.7.4",
     "react-plotly.js": "^2.6.0",
     "react-scripts": "^5.0.1",
-    "zarr": "^0.6.3"
+    "zarrita": "^0.5.4"
   },
   "peerDependencies": {
     "react": "^18.2.0",
@@ -139,5 +141,6 @@
   "bugs": {
     "url": "https://github.com/haniffalab/cherita-react/issues"
   },
-  "homepage": "https://github.com/haniffalab/cherita-react#readme"
-}
+  "homepage": "https://github.com/haniffalab/cherita-react#readme",
+  "prereleaseSha": "f157a88143d77d5a3d69296e84895802f0c39073"
+}