@haniffalab/cherita-react 1.2.0-dev.2025-05-21.e8f5ce54 → 1.2.0-dev.2025-05-21.6154c7e3

package/dist/esm/components/obs-list/ObsList.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 React, { useContext, useEffect, useMemo, useState } from "react";
 import { faChevronDown, faChevronRight } from "@fortawesome/free-solid-svg-icons";
 import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
@@ -29,7 +34,7 @@ const ObsAccordionToggle = _ref => {
     handleAccordionToggle(eventKey, isCurrentEventKey);
   });
   return /*#__PURE__*/React.createElement("div", {
-    className: `obs-accordion-header ${isCurrentEventKey ? "active" : ""}`,
+    className: "obs-accordion-header ".concat(isCurrentEventKey ? "active" : ""),
     onClick: decoratedOnClick
   }, /*#__PURE__*/React.createElement("span", {
     className: "obs-accordion-header-chevron"
@@ -40,6 +45,7 @@ const ObsAccordionToggle = _ref => {
   }, children));
 };
 export function ObsColsList(_ref2) {
+  var _settings$selectedObs;
   let {
     showColor = true,
     enableObsGroups = true
@@ -50,20 +56,21 @@ export function ObsColsList(_ref2) {
   const dispatch = useSettingsDispatch();
   const [enableGroups, setEnableGroups] = useState(enableObsGroups);
   const [obsCols, setObsCols] = useState(null);
-  const [active, setActive] = useState([...[settings.selectedObs?.name]]);
+  const [active, setActive] = useState([...[(_settings$selectedObs = settings.selectedObs) === null || _settings$selectedObs === void 0 ? void 0 : _settings$selectedObs.name]]);
   const [params, setParams] = useState({
     url: dataset.url
   });
-  const obsGroups = useMemo(() => ({
-    default: _.union(DEFAULT_OBS_GROUP, dataset.obsGroups?.default),
-    ..._.omit(dataset.obsGroups, "default")
-  }), [dataset.obsGroups]);
+  const obsGroups = useMemo(() => {
+    var _dataset$obsGroups;
+    return _objectSpread({
+      default: _.union(DEFAULT_OBS_GROUP, (_dataset$obsGroups = dataset.obsGroups) === null || _dataset$obsGroups === void 0 ? void 0 : _dataset$obsGroups.default)
+    }, _.omit(dataset.obsGroups, "default"));
+  }, [dataset.obsGroups]);
   useEffect(() => {
     setParams(p => {
-      return {
-        ...p,
+      return _objectSpread(_objectSpread({}, p), {}, {
         url: dataset.url
-      };
+      });
     });
   }, [dataset.url]);
   const {
@@ -84,7 +91,7 @@ export function ObsColsList(_ref2) {
         });
         if (!!filteredData.length && !groupFiltered.length) {
           setEnableGroups(false);
-          console.warn(`No obs found in obsGroups ${JSON.stringify(obsGroups)}, disabling obsGroups`);
+          console.warn("No obs found in obsGroups ".concat(JSON.stringify(obsGroups), ", disabling obsGroups"));
         } else {
           filteredData = groupFiltered;
         }
@@ -95,17 +102,17 @@ export function ObsColsList(_ref2) {
         return d.type !== OBS_TYPES.DISCRETE;
       });
       setObsCols(_.keyBy(_.map(filteredData, d => {
-        return {
-          ...d,
+        return _objectSpread(_objectSpread({}, d), {}, {
           codesMap: _.invert(d.codes),
           omit: []
-        };
+        });
       }), "name"));
     }
   }, [fetchedData, isPending, obsGroups, serverError, enableGroups]);
   useEffect(() => {
     if (obsCols) {
-      if (!obsCols[settings.selectedObs?.name]) {
+      var _settings$selectedObs2;
+      if (!obsCols[(_settings$selectedObs2 = settings.selectedObs) === null || _settings$selectedObs2 === void 0 ? void 0 : _settings$selectedObs2.name]) {
         setActive([]);
         dispatch({
           type: "select.obs",
@@ -122,23 +129,21 @@ export function ObsColsList(_ref2) {
     }
   };
   const toggleAll = item => {
+    var _settings$selectedObs3;
     const omit = item.omit.length ? [] : _.map(item.values, v => item.codes[v]);
     setObsCols(o => {
-      return {
-        ...o,
-        [item.name]: {
-          ...item,
+      return _objectSpread(_objectSpread({}, o), {}, {
+        [item.name]: _objectSpread(_objectSpread({}, item), {}, {
           omit: omit
-        }
-      };
+        })
+      });
     });
-    if (settings.selectedObs?.name === item.name) {
+    if (((_settings$selectedObs3 = settings.selectedObs) === null || _settings$selectedObs3 === void 0 ? void 0 : _settings$selectedObs3.name) === item.name) {
       dispatch({
         type: "select.obs",
-        obs: {
-          ...item,
+        obs: _objectSpread(_objectSpread({}, item), {}, {
           omit: omit
-        }
+        })
       });
     }
   };
@@ -177,6 +182,7 @@ export function ObsColsList(_ref2) {
     });
   };
   const toggleObs = (item, value) => {
+    var _settings$selectedObs4;
     let omit;
     if (_.includes(item.omit, item.codes[value])) {
       omit = item.omit.filter(i => i !== item.codes[value]);
@@ -184,25 +190,23 @@ export function ObsColsList(_ref2) {
       omit = [...item.omit, item.codes[value]];
     }
     setObsCols(o => {
-      return {
-        ...o,
-        [item.name]: {
-          ...item,
+      return _objectSpread(_objectSpread({}, o), {}, {
+        [item.name]: _objectSpread(_objectSpread({}, item), {}, {
           omit: omit
-        }
-      };
+        })
+      });
     });
-    if (settings.selectedObs?.name === item.name) {
+    if (((_settings$selectedObs4 = settings.selectedObs) === null || _settings$selectedObs4 === void 0 ? void 0 : _settings$selectedObs4.name) === item.name) {
       dispatch({
         type: "select.obs",
-        obs: {
-          ...item,
+        obs: _objectSpread(_objectSpread({}, item), {}, {
           omit: omit
-        }
+        })
       });
     }
   };
   const obsItem = item => {
+    var _settings$selectedObs5, _settings$selectedObs6;
     if (!item) {
       return null;
     }
@@ -210,8 +214,8 @@ export function ObsColsList(_ref2) {
       return null;
     }
     const inLabelObs = _.some(settings.labelObs, i => i.name === item.name);
-    const inSliceObs = settings.sliceBy.obs && settings.selectedObs?.name === item.name;
-    const isColorEncoding = settings.colorEncoding === COLOR_ENCODINGS.OBS && settings.selectedObs?.name === item.name;
+    const inSliceObs = settings.sliceBy.obs && ((_settings$selectedObs5 = settings.selectedObs) === null || _settings$selectedObs5 === void 0 ? void 0 : _settings$selectedObs5.name) === item.name;
+    const isColorEncoding = settings.colorEncoding === COLOR_ENCODINGS.OBS && ((_settings$selectedObs6 = settings.selectedObs) === null || _settings$selectedObs6 === void 0 ? void 0 : _settings$selectedObs6.name) === item.name;
     return /*#__PURE__*/React.createElement("div", {
       className: "accordion-item",
       key: item.name
@@ -219,21 +223,21 @@ export function ObsColsList(_ref2) {
       eventKey: item.name,
       handleAccordionToggle: handleAccordionToggle
     }, /*#__PURE__*/React.createElement("div", null, item.name), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("span", {
-      className: `mx-1 cursor-pointer ${inLabelObs ? "active-icon" : "text-muted opacity-50"}`,
+      className: "mx-1 cursor-pointer ".concat(inLabelObs ? "active-icon" : "text-muted opacity-50"),
       onClick: event => {
         event.stopPropagation();
         toggleLabel(item);
       },
       title: "Add to tooltip"
     }, /*#__PURE__*/React.createElement(CommentIcon, null)), /*#__PURE__*/React.createElement("span", {
-      className: `mx-1 cursor-pointer ${inSliceObs ? "active-icon" : "text-muted opacity-50"}`,
+      className: "mx-1 cursor-pointer ".concat(inSliceObs ? "active-icon" : "text-muted opacity-50"),
       onClick: event => {
         event.stopPropagation();
         toggleSlice(item);
       },
       title: "Filter applied"
     }, /*#__PURE__*/React.createElement(JoinInnerIcon, null)), /*#__PURE__*/React.createElement("span", {
-      className: `mx-1 cursor-pointer ${isColorEncoding ? "active-icon" : "text-muted opacity-50"}`,
+      className: "mx-1 cursor-pointer ".concat(isColorEncoding ? "active-icon" : "text-muted opacity-50"),
       onClick: event => {
         event.stopPropagation();
         toggleColor(item);
@@ -263,9 +267,9 @@ export function ObsColsList(_ref2) {
     })))));
   };
   const groupList = _.map(_.keys(obsGroups), group => {
-    const key = `group-${group}`;
+    const key = "group-".concat(group);
     const groupItems = _.compact(_.map(_.sortBy(obsGroups[group], o => _.lowerCase(o.name)), item => {
-      return obsItem(obsCols?.[item]);
+      return obsItem(obsCols === null || obsCols === void 0 ? void 0 : obsCols[item]);
     }));
     if (group === "default") {
       return groupItems;
@@ -282,7 +286,7 @@ export function ObsColsList(_ref2) {
     }
   });
   const obsList = enableGroups ? /*#__PURE__*/React.createElement(React.Fragment, null, groupList) : _.map(_.sortBy(obsCols, o => _.lowerCase(o.name)), item => obsItem(item));
-  const defaultActiveGroup = enableGroups ? `group-${_.findKey(obsGroups, g => g.includes(active?.[0]))}` : null;
+  const defaultActiveGroup = enableGroups ? "group-".concat(_.findKey(obsGroups, g => g.includes(active === null || active === void 0 ? void 0 : active[0]))) : null;
   if (!serverError) {
     return /*#__PURE__*/React.createElement("div", {
       className: "position-relative h-100"

package/dist/esm/components/obsm-list/ObsmList.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 React, { useEffect, useState } from "react";
 import { Button, ButtonGroup, Dropdown, DropdownButton, OverlayTrigger, Tooltip } from "react-bootstrap";
 import { useDataset } from "../../context/DatasetContext";
@@ -16,10 +21,9 @@ export function ObsmKeysList() {
   });
   useEffect(() => {
     setParams(p => {
-      return {
-        ...p,
+      return _objectSpread(_objectSpread({}, p), {}, {
         url: dataset.url
-      };
+      });
     });
   }, [dataset.url]);
   const {
@@ -42,7 +46,7 @@ export function ObsmKeysList() {
   const obsmList = obsmKeysList.map(item => {
     return /*#__PURE__*/React.createElement(Dropdown.Item, {
       key: item,
-      className: `custom ${active === item && "active"}`,
+      className: "custom ".concat(active === item && "active"),
       onClick: () => {
         dispatch({
           type: "select.obsm",

package/dist/esm/components/offcanvas/index.js

@@ -1,3 +1,7 @@
+const _excluded = ["show", "handleClose"],
+  _excluded2 = ["show", "handleClose", "Controls"];
+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 from "react";
 import Offcanvas from "react-bootstrap/Offcanvas";
 import { SELECTION_MODES } from "../../constants/constants";
@@ -7,10 +11,10 @@ import { SearchBar } from "../search-bar/SearchBar";
 import { VarNamesList } from "../var-list/VarList";
 export function OffcanvasObs(_ref) {
   let {
-    show,
-    handleClose,
-    ...props
-  } = _ref;
+      show,
+      handleClose
+    } = _ref,
+    props = _objectWithoutProperties(_ref, _excluded);
   return /*#__PURE__*/React.createElement(Offcanvas, {
     show: show,
     onHide: handleClose,
@@ -52,11 +56,11 @@ export function OffcanvasVars(_ref3) {
 }
 export function OffcanvasControls(_ref4) {
   let {
-    show,
-    handleClose,
-    Controls,
-    ...props
-  } = _ref4;
+      show,
+      handleClose,
+      Controls
+    } = _ref4,
+    props = _objectWithoutProperties(_ref4, _excluded2);
   return /*#__PURE__*/React.createElement(Offcanvas, {
     show: show,
     onHide: handleClose

package/dist/esm/components/pseudospatial/Pseudospatial.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 React, { useCallback, useEffect, useMemo, useRef, useState } from "react";
 import { library } from "@fortawesome/fontawesome-svg-core";
 import { faSliders } from "@fortawesome/free-solid-svg-icons";
@@ -15,6 +20,7 @@ import { LoadingSpinner } from "../../utils/LoadingIndicators";
 import { useDebouncedFetch } from "../../utils/requests";
 library.add(faSliders);
 function usePseudospatialData(plotType) {
+  var _settings$selectedVar5, _settings$selectedVar6, _settings$selectedVar7, _settings$selectedVar8;
   const ENDPOINT = "pseudospatial";
   const dataset = useDataset();
   const settings = useSettings();
@@ -35,40 +41,49 @@ function usePseudospatialData(plotType) {
   }, [dataset.url, settings.pseudospatial.maskSet, settings.pseudospatial.maskValues, dataset.varNamesCol, isSliced, obsIndices]);
   const getPlotParams = useCallback(() => {
     if (plotType === PLOT_TYPES.GENE) {
-      return {
-        varKey: settings.selectedVar?.isSet ? {
-          name: settings.selectedVar?.name,
-          indices: settings.selectedVar?.vars.map(v => v.index)
-        } : settings.selectedVar?.index,
-        ...(settings.sliceBy.obs ? {
-          obsCol: settings.selectedObs,
-          obsValues: !settings.selectedObs?.omit.length ? null : _.difference(_.values(settings.selectedObs?.codes), settings.selectedObs?.omit).map(c => settings.selectedObs?.codesMap[c])
-        } : {})
-      };
+      var _settings$selectedVar, _settings$selectedVar2, _settings$selectedVar3, _settings$selectedVar4, _settings$selectedObs, _settings$selectedObs2, _settings$selectedObs3;
+      return _objectSpread({
+        varKey: (_settings$selectedVar = settings.selectedVar) !== null && _settings$selectedVar !== void 0 && _settings$selectedVar.isSet ? {
+          name: (_settings$selectedVar2 = settings.selectedVar) === null || _settings$selectedVar2 === void 0 ? void 0 : _settings$selectedVar2.name,
+          indices: (_settings$selectedVar3 = settings.selectedVar) === null || _settings$selectedVar3 === void 0 ? void 0 : _settings$selectedVar3.vars.map(v => v.index)
+        } : (_settings$selectedVar4 = settings.selectedVar) === null || _settings$selectedVar4 === void 0 ? void 0 : _settings$selectedVar4.index
+      }, settings.sliceBy.obs ? {
+        obsCol: settings.selectedObs,
+        obsValues: !((_settings$selectedObs = settings.selectedObs) !== null && _settings$selectedObs !== void 0 && _settings$selectedObs.omit.length) ? null : _.difference(_.values((_settings$selectedObs2 = settings.selectedObs) === null || _settings$selectedObs2 === void 0 ? void 0 : _settings$selectedObs2.codes), (_settings$selectedObs3 = settings.selectedObs) === null || _settings$selectedObs3 === void 0 ? void 0 : _settings$selectedObs3.omit).map(c => {
+          var _settings$selectedObs4;
+          return (_settings$selectedObs4 = settings.selectedObs) === null || _settings$selectedObs4 === void 0 ? void 0 : _settings$selectedObs4.codesMap[c];
+        })
+      } : {});
     } else if (plotType === PLOT_TYPES.CATEGORICAL) {
+      var _settings$selectedObs5, _settings$selectedObs6, _settings$selectedObs7;
       return {
         obsCol: settings.selectedObs,
-        obsValues: !settings.selectedObs?.omit.length ? null : _.difference(_.values(settings.selectedObs?.codes), settings.selectedObs?.omit).map(c => settings.selectedObs?.codesMap[c]),
+        obsValues: !((_settings$selectedObs5 = settings.selectedObs) !== null && _settings$selectedObs5 !== void 0 && _settings$selectedObs5.omit.length) ? null : _.difference(_.values((_settings$selectedObs6 = settings.selectedObs) === null || _settings$selectedObs6 === void 0 ? void 0 : _settings$selectedObs6.codes), (_settings$selectedObs7 = settings.selectedObs) === null || _settings$selectedObs7 === void 0 ? void 0 : _settings$selectedObs7.omit).map(c => {
+          var _settings$selectedObs8;
+          return (_settings$selectedObs8 = settings.selectedObs) === null || _settings$selectedObs8 === void 0 ? void 0 : _settings$selectedObs8.codesMap[c];
+        }),
         mode: settings.pseudospatial.categoricalMode
       };
     } else if (plotType === "continuous") {
+      var _settings$selectedObs9, _settings$selectedObs0, _settings$selectedObs1;
       return {
         obsCol: settings.selectedObs,
-        obsValues: !settings.selectedObs?.omit.length ? null : _.difference(_.values(settings.selectedObs?.codes), settings.selectedObs?.omit).map(c => settings.selectedObs?.codesMap[c])
+        obsValues: !((_settings$selectedObs9 = settings.selectedObs) !== null && _settings$selectedObs9 !== void 0 && _settings$selectedObs9.omit.length) ? null : _.difference(_.values((_settings$selectedObs0 = settings.selectedObs) === null || _settings$selectedObs0 === void 0 ? void 0 : _settings$selectedObs0.codes), (_settings$selectedObs1 = settings.selectedObs) === null || _settings$selectedObs1 === void 0 ? void 0 : _settings$selectedObs1.omit).map(c => {
+          var _settings$selectedObs10;
+          return (_settings$selectedObs10 = settings.selectedObs) === null || _settings$selectedObs10 === void 0 ? void 0 : _settings$selectedObs10.codesMap[c];
+        })
       };
     }
-  }, [settings.pseudospatial.categoricalMode, settings.selectedObs, settings.selectedVar?.index, settings.selectedVar?.isSet, settings.selectedVar?.name, settings.selectedVar?.vars, settings.sliceBy.obs, plotType]);
+  }, [settings.pseudospatial.categoricalMode, settings.selectedObs, (_settings$selectedVar5 = settings.selectedVar) === null || _settings$selectedVar5 === void 0 ? void 0 : _settings$selectedVar5.index, (_settings$selectedVar6 = settings.selectedVar) === null || _settings$selectedVar6 === void 0 ? void 0 : _settings$selectedVar6.isSet, (_settings$selectedVar7 = settings.selectedVar) === null || _settings$selectedVar7 === void 0 ? void 0 : _settings$selectedVar7.name, (_settings$selectedVar8 = settings.selectedVar) === null || _settings$selectedVar8 === void 0 ? void 0 : _settings$selectedVar8.vars, settings.sliceBy.obs, plotType]);
   const params = useMemo(() => {
-    return {
-      ...baseParams,
-      ...getPlotParams()
-    };
+    return _objectSpread(_objectSpread({}, baseParams), getPlotParams());
   }, [baseParams, getPlotParams]);
   return useDebouncedFetch(ENDPOINT + "/" + plotType, params, 500, {
     enabled: !!plotType && !!settings.pseudospatial.maskSet
   });
 }
 export function Pseudospatial(_ref) {
+  var _settings$selectedObs14, _layout$coloraxis3, _layout$coloraxis4;
   let {
     showLegend = true,
     sharedScaleRange = false,
@@ -85,21 +100,21 @@ export function Pseudospatial(_ref) {
   } = useColor();
   const colorscale = useRef(settings.controls.colorScale);
   useEffect(() => {
-    setPlotType(settings.colorEncoding === COLOR_ENCODINGS.VAR ? PLOT_TYPES.GENE : settings.selectedObs?.type === OBS_TYPES.CATEGORICAL || settings.selectedObs?.type === OBS_TYPES.BOOLEAN ? PLOT_TYPES.CATEGORICAL : settings.selectedObs?.type === OBS_TYPES.CONTINUOUS ? PLOT_TYPES.CONTINUOUS : PLOT_TYPES.MASKS);
-  }, [settings.colorEncoding, settings.selectedObs?.type, setPlotType]);
+    var _settings$selectedObs11, _settings$selectedObs12, _settings$selectedObs13;
+    setPlotType(settings.colorEncoding === COLOR_ENCODINGS.VAR ? PLOT_TYPES.GENE : ((_settings$selectedObs11 = settings.selectedObs) === null || _settings$selectedObs11 === void 0 ? void 0 : _settings$selectedObs11.type) === OBS_TYPES.CATEGORICAL || ((_settings$selectedObs12 = settings.selectedObs) === null || _settings$selectedObs12 === void 0 ? void 0 : _settings$selectedObs12.type) === OBS_TYPES.BOOLEAN ? PLOT_TYPES.CATEGORICAL : ((_settings$selectedObs13 = settings.selectedObs) === null || _settings$selectedObs13 === void 0 ? void 0 : _settings$selectedObs13.type) === OBS_TYPES.CONTINUOUS ? PLOT_TYPES.CONTINUOUS : PLOT_TYPES.MASKS);
+  }, [settings.colorEncoding, (_settings$selectedObs14 = settings.selectedObs) === null || _settings$selectedObs14 === void 0 ? void 0 : _settings$selectedObs14.type, setPlotType]);
   const updateColorscale = useCallback(colorscale => {
     setLayout(l => {
-      return {
-        ...l,
-        coloraxis: {
-          ...l.coloraxis,
+      return _objectSpread(_objectSpread({}, l), {}, {
+        coloraxis: _objectSpread(_objectSpread({}, l.coloraxis), {}, {
           colorscale: colorscale
-        }
-      };
+        })
+      });
     });
     setData(d => {
-      const min = layout?.coloraxis?.cmin;
-      const max = layout?.coloraxis?.cmax;
+      var _layout$coloraxis, _layout$coloraxis2;
+      const min = layout === null || layout === void 0 || (_layout$coloraxis = layout.coloraxis) === null || _layout$coloraxis === void 0 ? void 0 : _layout$coloraxis.cmin;
+      const max = layout === null || layout === void 0 || (_layout$coloraxis2 = layout.coloraxis) === null || _layout$coloraxis2 === void 0 ? void 0 : _layout$coloraxis2.cmax;
       return _.map(d, trace => {
         const v = trace.meta.value;
         if (v === null) {
@@ -108,17 +123,15 @@ export function Pseudospatial(_ref) {
         const color = rgbToHex(getColor({
           value: (v - min) / (max - min)
         }));
-        return {
-          ...trace,
+        return _objectSpread(_objectSpread({}, trace), {}, {
           fillcolor: color,
-          line: {
-            ...trace.line,
+          line: _objectSpread(_objectSpread({}, trace.line), {}, {
             color: color
-          }
-        };
+          })
+        });
       });
     });
-  }, [getColor, layout?.coloraxis?.cmax, layout?.coloraxis?.cmin]);
+  }, [getColor, layout === null || layout === void 0 || (_layout$coloraxis3 = layout.coloraxis) === null || _layout$coloraxis3 === void 0 ? void 0 : _layout$coloraxis3.cmax, layout === null || layout === void 0 || (_layout$coloraxis4 = layout.coloraxis) === null || _layout$coloraxis4 === void 0 ? void 0 : _layout$coloraxis4.cmin]);
   const {
     fetchedData,
     isPending,
@@ -153,40 +166,36 @@ export function Pseudospatial(_ref) {
           const color = rgbToHex(getColor({
             value: (v - min) / (max - min)
           }));
-          return {
-            ...trace,
+          return _objectSpread(_objectSpread({}, trace), {}, {
             fillcolor: color,
-            line: {
-              ...trace.line,
+            line: _objectSpread(_objectSpread({}, trace.line), {}, {
               color: color
-            }
-          };
+            })
+          });
         });
       });
       setLayout(l => {
-        return {
-          ...l,
-          coloraxis: {
-            ...l.coloraxis,
+        return _objectSpread(_objectSpread({}, l), {}, {
+          coloraxis: _objectSpread(_objectSpread({}, l.coloraxis), {}, {
             cmin: min,
             cmax: max
-          }
-        };
+          })
+        });
       });
     }
   }, [settings.controls.range, settings.controls.valueMax, settings.controls.valueMin, settings.controls.valueRange, getColor, sharedScaleRange]);
   const hasSelections = !!plotType && !!settings.pseudospatial.maskSet;
   const faSlidersPath = faSliders.icon[4];
   if (!serverError) {
+    var _layout$coloraxis5, _layout$coloraxis6;
     return /*#__PURE__*/React.createElement("div", {
       className: "cherita-pseudospatial"
     }, /*#__PURE__*/React.createElement(React.Fragment, null, hasSelections && isPending && /*#__PURE__*/React.createElement(LoadingSpinner, null), hasSelections && /*#__PURE__*/React.createElement(Plot, {
       data: data,
-      layout: {
-        ...layout,
+      layout: _objectSpread(_objectSpread({}, layout), {}, {
         autosize: true,
         height: height
-      },
+      }),
       useResizeHandler: true,
       className: "cherita-pseudospatial-plot",
       config: {
@@ -205,8 +214,8 @@ export function Pseudospatial(_ref) {
         }]
       }
     }), hasSelections && showLegend && /*#__PURE__*/React.createElement(Legend, {
-      min: layout?.coloraxis?.cmin,
-      max: layout?.coloraxis?.cmax,
+      min: layout === null || layout === void 0 || (_layout$coloraxis5 = layout.coloraxis) === null || _layout$coloraxis5 === void 0 ? void 0 : _layout$coloraxis5.cmin,
+      max: layout === null || layout === void 0 || (_layout$coloraxis6 = layout.coloraxis) === null || _layout$coloraxis6 === void 0 ? void 0 : _layout$coloraxis6.cmax,
       addText: plotType === PLOT_TYPES.GENE ? " - Mean expression" : plotType === PLOT_TYPES.CATEGORICAL ? " - %" : plotType === PLOT_TYPES.CONTINUOUS ? " - Mean value" : ""
     })));
   } else {

package/dist/esm/components/pseudospatial/PseudospatialToolbar.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 React, { useEffect, useState } from "react";
 import _ from "lodash";
 import { ButtonGroup, Dropdown, Form } from "react-bootstrap";
@@ -26,6 +31,7 @@ function CategoricalMode() {
   }, _.capitalize(mode.name)), /*#__PURE__*/React.createElement(Dropdown.Menu, null, modeList));
 }
 function MaskSet() {
+  var _settings$pseudospati5, _settings$pseudospati6, _maskSets$settings$ps2, _settings$pseudospati7, _settings$pseudospati8, _maskSets$settings$ps3, _settings$pseudospati9;
   const ENDPOINT = "masks";
   const dataset = useDataset();
   const settings = useSettings();
@@ -36,10 +42,9 @@ function MaskSet() {
   });
   useEffect(() => {
     setParams(p => {
-      return {
-        ...p,
+      return _objectSpread(_objectSpread({}, p), {}, {
         url: dataset.url
-      };
+      });
     });
   }, [dataset.url]);
   const {
@@ -65,9 +70,10 @@ function MaskSet() {
     }
   }, _.capitalize(key)));
   const handleMaskChange = mask => {
-    let newMasks = settings.pseudospatial.maskValues || maskSets?.[settings.pseudospatial?.maskSet];
+    var _settings$pseudospati, _settings$pseudospati2;
+    let newMasks = settings.pseudospatial.maskValues || (maskSets === null || maskSets === void 0 ? void 0 : maskSets[(_settings$pseudospati = settings.pseudospatial) === null || _settings$pseudospati === void 0 ? void 0 : _settings$pseudospati.maskSet]);
     newMasks = newMasks.includes(mask) ? newMasks.filter(m => m !== mask) : [...newMasks, mask];
-    if (!_.difference(maskSets?.[settings.pseudospatial?.maskSet], newMasks).length) {
+    if (!_.difference(maskSets === null || maskSets === void 0 ? void 0 : maskSets[(_settings$pseudospati2 = settings.pseudospatial) === null || _settings$pseudospati2 === void 0 ? void 0 : _settings$pseudospati2.maskSet], newMasks).length) {
       newMasks = null;
     }
     dispatch({
@@ -76,7 +82,8 @@ function MaskSet() {
     });
   };
   const toggleMasks = () => {
-    if (!settings.pseudospatial.maskValues || settings.pseudospatial.maskValues?.length === maskSets?.[settings.pseudospatial?.maskSet]?.length) {
+    var _settings$pseudospati3, _maskSets$settings$ps, _settings$pseudospati4;
+    if (!settings.pseudospatial.maskValues || ((_settings$pseudospati3 = settings.pseudospatial.maskValues) === null || _settings$pseudospati3 === void 0 ? void 0 : _settings$pseudospati3.length) === (maskSets === null || maskSets === void 0 || (_maskSets$settings$ps = maskSets[(_settings$pseudospati4 = settings.pseudospatial) === null || _settings$pseudospati4 === void 0 ? void 0 : _settings$pseudospati4.maskSet]) === null || _maskSets$settings$ps === void 0 ? void 0 : _maskSets$settings$ps.length)) {
       dispatch({
         type: "set.pseudospatial.maskValues",
         maskValues: []
@@ -88,7 +95,7 @@ function MaskSet() {
       });
     }
   };
-  const masksList = _.map(maskSets?.[settings.pseudospatial?.maskSet], mask => /*#__PURE__*/React.createElement(Dropdown.ItemText, {
+  const masksList = _.map(maskSets === null || maskSets === void 0 ? void 0 : maskSets[(_settings$pseudospati5 = settings.pseudospatial) === null || _settings$pseudospati5 === void 0 ? void 0 : _settings$pseudospati5.maskSet], mask => /*#__PURE__*/React.createElement(Dropdown.ItemText, {
     key: mask
   }, /*#__PURE__*/React.createElement(Form.Check, {
     type: "checkbox",
@@ -96,8 +103,8 @@ function MaskSet() {
     checked: !settings.pseudospatial.maskValues || settings.pseudospatial.maskValues.includes(mask),
     onChange: () => handleMaskChange(mask)
   })));
-  const nMasks = settings.pseudospatial.maskValues ? settings.pseudospatial.maskValues?.length : maskSets?.[settings.pseudospatial?.maskSet]?.length || "No";
-  const toggleAllChecked = !settings.pseudospatial.maskValues || settings.pseudospatial.maskValues?.length === maskSets?.[settings.pseudospatial?.maskSet]?.length;
+  const nMasks = settings.pseudospatial.maskValues ? (_settings$pseudospati6 = settings.pseudospatial.maskValues) === null || _settings$pseudospati6 === void 0 ? void 0 : _settings$pseudospati6.length : (maskSets === null || maskSets === void 0 || (_maskSets$settings$ps2 = maskSets[(_settings$pseudospati7 = settings.pseudospatial) === null || _settings$pseudospati7 === void 0 ? void 0 : _settings$pseudospati7.maskSet]) === null || _maskSets$settings$ps2 === void 0 ? void 0 : _maskSets$settings$ps2.length) || "No";
+  const toggleAllChecked = !settings.pseudospatial.maskValues || ((_settings$pseudospati8 = settings.pseudospatial.maskValues) === null || _settings$pseudospati8 === void 0 ? void 0 : _settings$pseudospati8.length) === (maskSets === null || maskSets === void 0 || (_maskSets$settings$ps3 = maskSets[(_settings$pseudospati9 = settings.pseudospatial) === null || _settings$pseudospati9 === void 0 ? void 0 : _settings$pseudospati9.maskSet]) === null || _maskSets$settings$ps3 === void 0 ? void 0 : _maskSets$settings$ps3.length);
   return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Dropdown, null, /*#__PURE__*/React.createElement(Dropdown.Toggle, {
     variant: "light"
   }, _.capitalize(settings.pseudospatial.maskSet || "Select a mask set")), /*#__PURE__*/React.createElement(Dropdown.Menu, null, /*#__PURE__*/React.createElement(Dropdown.Header, null, "Mask set"), maskSetList)), /*#__PURE__*/React.createElement(Dropdown, null, /*#__PURE__*/React.createElement(Dropdown.Toggle, {