@haniffalab/cherita-react 1.4.1-dev.2025-10-22.61540191 → 1.4.1-dev.2025-10-23.3179e534

package/dist/esm/components/obs-list/ObsList.js

@@ -3,7 +3,7 @@ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t =
 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 { useContext, useEffect, useMemo, useState } from "react";
 import { faChevronDown, faChevronRight } from "@fortawesome/free-solid-svg-icons";
 import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
 import CommentIcon from "@mui/icons-material/Comment";
@@ -20,6 +20,7 @@ import { useDataset } from "../../context/DatasetContext";
 import { useSettings, useSettingsDispatch } from "../../context/SettingsContext";
 import { LoadingSpinner } from "../../utils/LoadingIndicators";
 import { useFetch } from "../../utils/requests";
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 const ObsAccordionToggle = _ref => {
   let {
     children,
@@ -33,16 +34,19 @@ const ObsAccordionToggle = _ref => {
   const decoratedOnClick = useAccordionButton(eventKey, () => {
     handleAccordionToggle(eventKey, isCurrentEventKey);
   });
-  return /*#__PURE__*/React.createElement("div", {
+  return /*#__PURE__*/_jsxs("div", {
     className: "obs-accordion-header ".concat(isCurrentEventKey ? "active" : ""),
-    onClick: decoratedOnClick
-  }, /*#__PURE__*/React.createElement("span", {
-    className: "obs-accordion-header-chevron"
-  }, /*#__PURE__*/React.createElement(FontAwesomeIcon, {
-    icon: isCurrentEventKey ? faChevronDown : faChevronRight
-  })), /*#__PURE__*/React.createElement("span", {
-    className: "obs-accordion-header-span"
-  }, children));
+    onClick: decoratedOnClick,
+    children: [/*#__PURE__*/_jsx("span", {
+      className: "obs-accordion-header-chevron",
+      children: /*#__PURE__*/_jsx(FontAwesomeIcon, {
+        icon: isCurrentEventKey ? faChevronDown : faChevronRight
+      })
+    }), /*#__PURE__*/_jsx("span", {
+      className: "obs-accordion-header-span",
+      children: children
+    })]
+  });
 };
 export function ObsColsList(_ref2) {
   var _settings$selectedObs, _settings$selectedObs3, _settings$selectedObs4;
@@ -223,61 +227,67 @@ export function ObsColsList(_ref2) {
     const inLabelObs = _.includes(settings.labelObs, item.name);
     const inSliceObs = settings.sliceBy.obs && ((_settings$selectedObs8 = settings.selectedObs) === null || _settings$selectedObs8 === void 0 ? void 0 : _settings$selectedObs8.name) === item.name;
     const isColorEncoding = (showSelectedAsActive || settings.colorEncoding === COLOR_ENCODINGS.OBS) && ((_settings$selectedObs9 = settings.selectedObs) === null || _settings$selectedObs9 === void 0 ? void 0 : _settings$selectedObs9.name) === item.name;
-    return /*#__PURE__*/React.createElement("div", {
+    return /*#__PURE__*/_jsxs("div", {
       className: "accordion-item",
-      key: item.name
-    }, /*#__PURE__*/React.createElement(ObsAccordionToggle, {
-      eventKey: item.name,
-      handleAccordionToggle: handleAccordionToggle
-    }, /*#__PURE__*/React.createElement("div", {
-      className: "accordion-header-title"
-    }, item.name), /*#__PURE__*/React.createElement("div", {
-      className: "accordion-header-toolbar"
-    }, /*#__PURE__*/React.createElement("span", {
-      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 ".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 ".concat(isColorEncoding ? "active-icon" : "text-muted opacity-50"),
-      onClick: event => {
-        event.stopPropagation();
-        toggleColor(item);
-      },
-      title: showSelectedAsActive ? "Is selected" : "Is color encoding"
-    }, /*#__PURE__*/React.createElement(WaterDropIcon, null)))), /*#__PURE__*/React.createElement(Accordion.Collapse, {
-      eventKey: item.name
-    }, /*#__PURE__*/React.createElement("div", {
-      className: "obs-accordion-body"
-    }, active.includes(item.name) && (item.type === OBS_TYPES.CATEGORICAL || item.type === OBS_TYPES.BOOLEAN ? /*#__PURE__*/React.createElement(CategoricalObs, {
-      key: item.name,
-      obs: item,
-      toggleAll: () => toggleAll(item),
-      toggleObs: value => toggleObs(item, value),
-      toggleLabel: () => toggleLabel(item),
-      toggleSlice: () => toggleSlice(item),
-      toggleColor: () => toggleColor(item),
-      showColor: showColor && isColorEncoding,
-      showHistograms: showHistograms
-    }) : /*#__PURE__*/React.createElement(ContinuousObs, {
-      key: item.name,
-      obs: item,
-      toggleAll: () => toggleAll(item),
-      toggleObs: value => toggleObs(item, value),
-      toggleLabel: () => toggleLabel(item),
-      toggleSlice: () => toggleSlice(item),
-      toggleColor: () => toggleColor(item),
-      showHistograms: showHistograms
-    })))));
+      children: [/*#__PURE__*/_jsxs(ObsAccordionToggle, {
+        eventKey: item.name,
+        handleAccordionToggle: handleAccordionToggle,
+        children: [/*#__PURE__*/_jsx("div", {
+          className: "accordion-header-title",
+          children: item.name
+        }), /*#__PURE__*/_jsxs("div", {
+          className: "accordion-header-toolbar",
+          children: [/*#__PURE__*/_jsx("span", {
+            className: "mx-1 cursor-pointer ".concat(inLabelObs ? "active-icon" : "text-muted opacity-50"),
+            onClick: event => {
+              event.stopPropagation();
+              toggleLabel(item);
+            },
+            title: "Add to tooltip",
+            children: /*#__PURE__*/_jsx(CommentIcon, {})
+          }), /*#__PURE__*/_jsx("span", {
+            className: "mx-1 cursor-pointer ".concat(inSliceObs ? "active-icon" : "text-muted opacity-50"),
+            onClick: event => {
+              event.stopPropagation();
+              toggleSlice(item);
+            },
+            title: "Filter applied",
+            children: /*#__PURE__*/_jsx(JoinInnerIcon, {})
+          }), /*#__PURE__*/_jsx("span", {
+            className: "mx-1 cursor-pointer ".concat(isColorEncoding ? "active-icon" : "text-muted opacity-50"),
+            onClick: event => {
+              event.stopPropagation();
+              toggleColor(item);
+            },
+            title: showSelectedAsActive ? "Is selected" : "Is color encoding",
+            children: /*#__PURE__*/_jsx(WaterDropIcon, {})
+          })]
+        })]
+      }), /*#__PURE__*/_jsx(Accordion.Collapse, {
+        eventKey: item.name,
+        children: /*#__PURE__*/_jsx("div", {
+          className: "obs-accordion-body",
+          children: active.includes(item.name) && (item.type === OBS_TYPES.CATEGORICAL || item.type === OBS_TYPES.BOOLEAN ? /*#__PURE__*/_jsx(CategoricalObs, {
+            obs: item,
+            toggleAll: () => toggleAll(item),
+            toggleObs: value => toggleObs(item, value),
+            toggleLabel: () => toggleLabel(item),
+            toggleSlice: () => toggleSlice(item),
+            toggleColor: () => toggleColor(item),
+            showColor: showColor && isColorEncoding,
+            showHistograms: showHistograms
+          }, item.name) : /*#__PURE__*/_jsx(ContinuousObs, {
+            obs: item,
+            toggleAll: () => toggleAll(item),
+            toggleObs: value => toggleObs(item, value),
+            toggleLabel: () => toggleLabel(item),
+            toggleSlice: () => toggleSlice(item),
+            toggleColor: () => toggleColor(item),
+            showHistograms: showHistograms
+          }, item.name))
+        })
+      })]
+    }, item.name);
   };
   const groupList = _.map(_.keys(obsGroups), group => {
     const key = "group-".concat(group);
@@ -287,33 +297,43 @@ export function ObsColsList(_ref2) {
     if (group === "default") {
       return groupItems;
     } else {
-      return /*#__PURE__*/React.createElement(Accordion.Item, {
-        key: key,
+      return /*#__PURE__*/_jsxs(Accordion.Item, {
         eventKey: key,
-        className: "obs-group-accordion-item"
-      }, /*#__PURE__*/React.createElement(Accordion.Header, {
-        className: "obs-group-accordion-header"
-      }, group), /*#__PURE__*/React.createElement(Accordion.Body, {
-        className: "obs-group-accordion-body"
-      }, groupItems));
+        className: "obs-group-accordion-item",
+        children: [/*#__PURE__*/_jsx(Accordion.Header, {
+          className: "obs-group-accordion-header",
+          children: group
+        }), /*#__PURE__*/_jsx(Accordion.Body, {
+          className: "obs-group-accordion-body",
+          children: groupItems
+        })]
+      }, key);
     }
   });
-  const obsList = enableGroups ? /*#__PURE__*/React.createElement(React.Fragment, null, groupList) : _.map(_.sortBy(obsCols, o => _.lowerCase(o.name)), item => obsItem(item));
+  const obsList = enableGroups ? /*#__PURE__*/_jsx(_Fragment, {
+    children: groupList
+  }) : _.map(_.sortBy(obsCols, o => _.lowerCase(o.name)), item => obsItem(item));
   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"
-    }, isPending ? /*#__PURE__*/React.createElement(LoadingSpinner, null) : !!obsCols && !_.size(obsCols) ? /*#__PURE__*/React.createElement(Alert, {
-      variant: "danger"
-    }, "No observations found.") : /*#__PURE__*/React.createElement(Accordion, {
-      flush: true,
-      defaultActiveKey: [...active, ...[defaultActiveGroup]],
-      alwaysOpen: true,
-      className: "obs-accordion"
-    }, obsList));
+    return /*#__PURE__*/_jsx("div", {
+      className: "position-relative h-100",
+      children: isPending ? /*#__PURE__*/_jsx(LoadingSpinner, {}) : !!obsCols && !_.size(obsCols) ? /*#__PURE__*/_jsx(Alert, {
+        variant: "danger",
+        children: "No observations found."
+      }) : /*#__PURE__*/_jsx(Accordion, {
+        flush: true,
+        defaultActiveKey: [...active, ...[defaultActiveGroup]],
+        alwaysOpen: true,
+        className: "obs-accordion",
+        children: obsList
+      })
+    });
   } else {
-    return /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(Alert, {
-      variant: "danger"
-    }, serverError.message));
+    return /*#__PURE__*/_jsx("div", {
+      children: /*#__PURE__*/_jsx(Alert, {
+        variant: "danger",
+        children: serverError.message
+      })
+    });
   }
 }

package/dist/esm/components/obs-list/ObsToolbar.js

@@ -1,5 +1,5 @@
-import React from "react";
 import { Form } from "react-bootstrap";
+import { jsx as _jsx } from "react/jsx-runtime";
 export function ObsToolbar(_ref) {
   let {
     item,
@@ -7,7 +7,7 @@ export function ObsToolbar(_ref) {
     onToggleAllObs
   } = _ref;
   const allToggledOn = !item.omit.length;
-  return showToggleAllObs && /*#__PURE__*/React.createElement(Form.Check, {
+  return showToggleAllObs && /*#__PURE__*/_jsx(Form.Check, {
     type: "switch",
     id: "custom-switch",
     label: "Toggle all",

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

@@ -3,7 +3,7 @@ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t =
 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 { useEffect, useState } from "react";
 import _ from "lodash";
 import { Button, ButtonGroup, Dropdown, DropdownButton, OverlayTrigger, Tooltip } from "react-bootstrap";
 import { DEFAULT_OBSM_KEYS } from "../../constants/constants";
@@ -11,7 +11,11 @@ import { useDataset } from "../../context/DatasetContext";
 import { useSettings, useSettingsDispatch } from "../../context/SettingsContext";
 import { useFetch } from "../../utils/requests";
 import { ObsmKeysListBtn } from "../../utils/Skeleton";
-export function ObsmKeysList() {
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+export function ObsmKeysList(_ref) {
+  let {
+    setHasObsm
+  } = _ref;
   const ENDPOINT = "obsm/keys";
   const dataset = useDataset();
   const settings = useSettings();
@@ -36,26 +40,31 @@ export function ObsmKeysList() {
     refetchOnMount: false
   });
   useEffect(() => {
-    if (!isPending && !serverError && fetchedData) {
-      setObsmKeysList(fetchedData);
+    if (!isPending && !serverError) {
+      if (!fetchedData || !fetchedData.length) {
+        setHasObsm(false);
+      } else {
+        setHasObsm(true);
+        setObsmKeysList(fetchedData);
 
-      // Set default obsm if in keys list and not selected
-      if (!settings.selectedObsm && !!fetchedData.length) {
-        // Follow DEFAULT_OBSM_KEYS order
-        _.each(DEFAULT_OBSM_KEYS, k => {
-          const defaultObsm = _.find(fetchedData, item => item.toLowerCase() === k);
-          if (defaultObsm) {
-            dispatch({
-              type: "select.obsm",
-              obsm: defaultObsm
-            });
-            return false; // break
-          }
-        });
+        // Set default obsm if in keys list and not selected
+        if (!settings.selectedObsm) {
+          // Follow DEFAULT_OBSM_KEYS order
+          _.each(DEFAULT_OBSM_KEYS, k => {
+            const defaultObsm = _.find(fetchedData, item => item.toLowerCase() === k);
+            if (defaultObsm) {
+              dispatch({
+                type: "select.obsm",
+                obsm: defaultObsm
+              });
+              return false; // break
+            }
+          });
+        }
       }
       if (settings.selectedObsm) {
         // If selected obsm is not in keys list, reset to null
-        if (!_.includes(fetchedData, settings.selectedObsm)) {
+        if (!_.includes(fetchedData || [], settings.selectedObsm)) {
           dispatch({
             type: "select.obsm",
             obsm: null
@@ -65,40 +74,47 @@ export function ObsmKeysList() {
         }
       }
     }
-  }, [dispatch, fetchedData, isPending, serverError, settings.selectedObsm]);
+  }, [dispatch, fetchedData, isPending, serverError, setHasObsm, settings.selectedObsm]);
   const obsmList = obsmKeysList.map(item => {
-    return /*#__PURE__*/React.createElement(Dropdown.Item, {
-      key: item,
+    return /*#__PURE__*/_jsx(Dropdown.Item, {
       className: "custom ".concat(active === item && "active"),
       onClick: () => {
         dispatch({
           type: "select.obsm",
           obsm: item
         });
-      }
+      },
+      children: item
     }, item);
   });
   if (!serverError) {
     if (isPending) {
-      return /*#__PURE__*/React.createElement(ObsmKeysListBtn, null);
+      return /*#__PURE__*/_jsx(ObsmKeysListBtn, {});
     }
-    return /*#__PURE__*/React.createElement(DropdownButton, {
+    return /*#__PURE__*/_jsxs(DropdownButton, {
       as: ButtonGroup,
       title: settings.selectedObsm || "Select an embedding",
       variant: settings.selectedObsm ? "primary" : "warning",
       id: "bg-nested-dropdown",
-      size: "sm"
-    }, /*#__PURE__*/React.createElement(Dropdown.Header, null, "Embeddings"), obsmList);
+      size: "sm",
+      children: [/*#__PURE__*/_jsx(Dropdown.Header, {
+        children: "Embeddings"
+      }), obsmList]
+    });
   } else {
-    return /*#__PURE__*/React.createElement(OverlayTrigger, {
+    return /*#__PURE__*/_jsx(OverlayTrigger, {
       placement: "top",
       delay: {
         show: 100,
         hide: 200
       },
-      overlay: /*#__PURE__*/React.createElement(Tooltip, null, serverError.message)
-    }, /*#__PURE__*/React.createElement(Button, {
-      variant: "danger"
-    }, "Error"));
+      overlay: /*#__PURE__*/_jsx(Tooltip, {
+        children: serverError.message
+      }),
+      children: /*#__PURE__*/_jsx(Button, {
+        variant: "danger",
+        children: "Error"
+      })
+    });
   }
 }

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

@@ -1,41 +1,57 @@
 const _excluded = ["show", "handleClose"],
   _excluded2 = ["show", "handleClose", "Controls"];
+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 _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";
 import { ObsColsList } from "../obs-list/ObsList";
 import { ObsmKeysList } from "../obsm-list/ObsmList";
 import { SearchBar } from "../search-bar/SearchBar";
 import { VarNamesList } from "../var-list/VarList";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 export function OffcanvasObs(_ref) {
   let {
       show,
       handleClose
     } = _ref,
     props = _objectWithoutProperties(_ref, _excluded);
-  return /*#__PURE__*/React.createElement(Offcanvas, {
+  return /*#__PURE__*/_jsxs(Offcanvas, {
     show: show,
     onHide: handleClose,
-    scroll: true
-  }, /*#__PURE__*/React.createElement(Offcanvas.Header, {
-    closeButton: true
-  }, /*#__PURE__*/React.createElement(Offcanvas.Title, null, "Categories")), /*#__PURE__*/React.createElement(Offcanvas.Body, {
-    className: "p-0"
-  }, /*#__PURE__*/React.createElement(ObsColsList, props)));
+    scroll: true,
+    children: [/*#__PURE__*/_jsx(Offcanvas.Header, {
+      closeButton: true,
+      children: /*#__PURE__*/_jsx(Offcanvas.Title, {
+        children: "Categories"
+      })
+    }), /*#__PURE__*/_jsx(Offcanvas.Body, {
+      className: "p-0",
+      children: /*#__PURE__*/_jsx(ObsColsList, _objectSpread({}, props))
+    })]
+  });
 }
 export function OffcanvasObsm(_ref2) {
   let {
     show,
     handleClose
   } = _ref2;
-  return /*#__PURE__*/React.createElement(Offcanvas, {
+  return /*#__PURE__*/_jsxs(Offcanvas, {
     show: show,
-    onHide: handleClose
-  }, /*#__PURE__*/React.createElement(Offcanvas.Header, {
-    closeButton: true
-  }, /*#__PURE__*/React.createElement(Offcanvas.Title, null, "Embedding space")), /*#__PURE__*/React.createElement(Offcanvas.Body, null, /*#__PURE__*/React.createElement(ObsmKeysList, null)));
+    onHide: handleClose,
+    children: [/*#__PURE__*/_jsx(Offcanvas.Header, {
+      closeButton: true,
+      children: /*#__PURE__*/_jsx(Offcanvas.Title, {
+        children: "Embedding space"
+      })
+    }), /*#__PURE__*/_jsx(Offcanvas.Body, {
+      children: /*#__PURE__*/_jsx(ObsmKeysList, {})
+    })]
+  });
 }
 export function OffcanvasVars(_ref3) {
   let {
@@ -43,21 +59,29 @@ export function OffcanvasVars(_ref3) {
     handleClose,
     mode = SELECTION_MODES.MULTIPLE
   } = _ref3;
-  return /*#__PURE__*/React.createElement(Offcanvas, {
+  return /*#__PURE__*/_jsxs(Offcanvas, {
     show: show,
     onHide: handleClose,
-    className: "offcanvas-vars"
-  }, /*#__PURE__*/React.createElement(Offcanvas.Header, {
-    closeButton: true
-  }, /*#__PURE__*/React.createElement(Offcanvas.Title, null, "Features")), /*#__PURE__*/React.createElement(Offcanvas.Body, null, /*#__PURE__*/React.createElement("div", {
-    className: "sidebar-features"
-  }, /*#__PURE__*/React.createElement(SearchBar, {
-    searchDiseases: true
-  }), /*#__PURE__*/React.createElement("div", {
-    className: "sidebar-features-list"
-  }, /*#__PURE__*/React.createElement(VarNamesList, {
-    mode: mode
-  })))));
+    className: "offcanvas-vars",
+    children: [/*#__PURE__*/_jsx(Offcanvas.Header, {
+      closeButton: true,
+      children: /*#__PURE__*/_jsx(Offcanvas.Title, {
+        children: "Features"
+      })
+    }), /*#__PURE__*/_jsx(Offcanvas.Body, {
+      children: /*#__PURE__*/_jsxs("div", {
+        className: "sidebar-features",
+        children: [/*#__PURE__*/_jsx(SearchBar, {
+          searchDiseases: true
+        }), /*#__PURE__*/_jsx("div", {
+          className: "sidebar-features-list",
+          children: /*#__PURE__*/_jsx(VarNamesList, {
+            mode: mode
+          })
+        })]
+      })
+    })]
+  });
 }
 export function OffcanvasControls(_ref4) {
   let {
@@ -66,10 +90,16 @@ export function OffcanvasControls(_ref4) {
       Controls
     } = _ref4,
     props = _objectWithoutProperties(_ref4, _excluded2);
-  return /*#__PURE__*/React.createElement(Offcanvas, {
+  return /*#__PURE__*/_jsxs(Offcanvas, {
     show: show,
-    onHide: handleClose
-  }, /*#__PURE__*/React.createElement(Offcanvas.Header, {
-    closeButton: true
-  }, /*#__PURE__*/React.createElement(Offcanvas.Title, null, "Controls")), /*#__PURE__*/React.createElement(Offcanvas.Body, null, /*#__PURE__*/React.createElement(Controls, props)));
+    onHide: handleClose,
+    children: [/*#__PURE__*/_jsx(Offcanvas.Header, {
+      closeButton: true,
+      children: /*#__PURE__*/_jsx(Offcanvas.Title, {
+        children: "Controls"
+      })
+    }), /*#__PURE__*/_jsx(Offcanvas.Body, {
+      children: /*#__PURE__*/_jsx(Controls, _objectSpread({}, props))
+    })]
+  });
 }

package/dist/esm/components/pseudospatial/Pseudospatial.js

@@ -18,6 +18,7 @@ import { Legend } from "../../utils/Legend";
 import { LoadingSpinner } from "../../utils/LoadingIndicators";
 import { useDebouncedFetch } from "../../utils/requests";
 import { useSelectedObs, useSelectedVar } from "../../utils/Resolver";
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
 function usePseudospatialData(plotType) {
   const ENDPOINT = "pseudospatial";
   const dataset = useDataset();
@@ -232,43 +233,52 @@ export function Pseudospatial(_ref) {
     }] : [])];
   }, [dispatch, imageUrl, setShowControls, (_settings$pseudospati2 = settings.pseudospatial) === null || _settings$pseudospati2 === void 0 || (_settings$pseudospati2 = _settings$pseudospati2.refImg) === null || _settings$pseudospati2 === void 0 ? void 0 : _settings$pseudospati2.visible]);
   if (!_.keys(settings.data.pseudospatial).length) {
-    return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Alert, {
-      variant: "warning"
-    }, "No pseudospatial data"));
+    return /*#__PURE__*/_jsx(_Fragment, {
+      children: /*#__PURE__*/_jsx(Alert, {
+        variant: "warning",
+        children: "No pseudospatial data"
+      })
+    });
   } else 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: _objectSpread(_objectSpread({}, layout), {}, {
-        autosize: true,
-        height: height,
-        margin: {
-          l: 0,
-          r: 0,
-          t: 0,
-          b: 0,
-          pad: 0
-        },
-        images: images
-      }),
-      useResizeHandler: true,
-      className: "cherita-pseudospatial-plot",
-      config: {
-        displaylogo: false,
-        displayModeBar: true,
-        modeBarButtonsToAdd: modeBarButtons
-      }
-    }), hasSelections && showLegend && /*#__PURE__*/React.createElement(Legend, {
-      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" : ""
-    })));
+    return /*#__PURE__*/_jsx("div", {
+      className: "cherita-pseudospatial",
+      children: /*#__PURE__*/_jsxs(_Fragment, {
+        children: [hasSelections && isPending && /*#__PURE__*/_jsx(LoadingSpinner, {}), hasSelections && /*#__PURE__*/_jsx(Plot, {
+          data: data,
+          layout: _objectSpread(_objectSpread({}, layout), {}, {
+            autosize: true,
+            height: height,
+            margin: {
+              l: 0,
+              r: 0,
+              t: 0,
+              b: 0,
+              pad: 0
+            },
+            images: images
+          }),
+          useResizeHandler: true,
+          className: "cherita-pseudospatial-plot",
+          config: {
+            displaylogo: false,
+            displayModeBar: true,
+            modeBarButtonsToAdd: modeBarButtons
+          }
+        }), hasSelections && showLegend && /*#__PURE__*/_jsx(Legend, {
+          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 {
-    return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Alert, {
-      variant: "danger"
-    }, serverError.message));
+    return /*#__PURE__*/_jsx(_Fragment, {
+      children: /*#__PURE__*/_jsx(Alert, {
+        variant: "danger",
+        children: serverError.message
+      })
+    });
   }
 }
 
@@ -276,11 +286,11 @@ export function Pseudospatial(_ref) {
 export function PseudospatialImage() {
   const dataset = useDataset();
   if (dataset.imageUrl) {
-    return /*#__PURE__*/React.createElement(ImageViewer, {
+    return /*#__PURE__*/_jsx(ImageViewer, {
       src: dataset.imageUrl,
       alt: "Pseudospatial reference image"
     });
   } else {
-    return /*#__PURE__*/React.createElement(React.Fragment, null);
+    return /*#__PURE__*/_jsx(_Fragment, {});
   }
 }