@haniffalab/cherita-react 1.3.0 → 1.3.1-dev.2025-10-29.6de4119f

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (137) hide show
  1. package/README.md +1 -1
  2. package/dist/cjs/components/controls/Controls.js +38 -30
  3. package/dist/cjs/components/dotplot/Dotplot.js +85 -57
  4. package/dist/cjs/components/dotplot/DotplotControls.js +103 -83
  5. package/dist/cjs/components/full-page/FullPage.js +167 -114
  6. package/dist/cjs/components/full-page/PlotAlert.js +45 -0
  7. package/dist/cjs/components/full-page/PlotTypeSelector.js +102 -0
  8. package/dist/cjs/components/heatmap/Heatmap.js +83 -53
  9. package/dist/cjs/components/heatmap/HeatmapControls.js +6 -3
  10. package/dist/cjs/components/icons/DotPlotIcon.js +64 -0
  11. package/dist/cjs/components/icons/HeatmapIcon.js +45 -0
  12. package/dist/cjs/components/icons/MatrixPlotIcon.1.js +57 -0
  13. package/dist/cjs/components/icons/MatrixPlotIcon.js +59 -0
  14. package/dist/cjs/components/icons/ScatterplotIcon.1.js +164 -0
  15. package/dist/cjs/components/icons/ScatterplotIcon.js +144 -0
  16. package/dist/cjs/components/icons/ViolinPlotIcon.js +42 -0
  17. package/dist/cjs/components/matrixplot/Matrixplot.js +83 -54
  18. package/dist/cjs/components/matrixplot/MatrixplotControls.js +8 -5
  19. package/dist/cjs/components/obs-list/ObsItem.js +305 -216
  20. package/dist/cjs/components/obs-list/ObsList.js +164 -128
  21. package/dist/cjs/components/obs-list/ObsToolbar.js +2 -3
  22. package/dist/cjs/components/obsm-list/ObsmList.js +67 -28
  23. package/dist/cjs/components/offcanvas/index.js +62 -27
  24. package/dist/cjs/components/pseudospatial/Pseudospatial.js +132 -76
  25. package/dist/cjs/components/pseudospatial/PseudospatialToolbar.js +122 -74
  26. package/dist/cjs/components/scatterplot/Scatterplot.js +223 -175
  27. package/dist/cjs/components/scatterplot/ScatterplotControls.js +45 -31
  28. package/dist/cjs/components/scatterplot/SpatialControls.js +143 -116
  29. package/dist/cjs/components/scatterplot/Toolbox.js +41 -30
  30. package/dist/cjs/components/search-bar/SearchBar.js +176 -120
  31. package/dist/cjs/components/search-bar/SearchInfo.js +79 -85
  32. package/dist/cjs/components/search-bar/SearchResults.js +93 -71
  33. package/dist/cjs/components/toolbar/Toolbar.js +111 -0
  34. package/dist/cjs/components/var-list/VarItem.js +131 -103
  35. package/dist/cjs/components/var-list/VarList.js +96 -74
  36. package/dist/cjs/components/var-list/VarListToolbar.js +59 -54
  37. package/dist/cjs/components/var-list/VarSet.js +126 -108
  38. package/dist/cjs/components/violin/Violin.js +124 -81
  39. package/dist/cjs/components/violin/ViolinControls.js +8 -5
  40. package/dist/cjs/constants/colorscales.js +19 -19
  41. package/dist/cjs/constants/constants.js +54 -39
  42. package/dist/cjs/context/DatasetContext.js +27 -17
  43. package/dist/cjs/context/FilterContext.js +11 -9
  44. package/dist/cjs/context/SettingsContext.js +339 -125
  45. package/dist/cjs/context/ZarrDataContext.js +6 -5
  46. package/dist/cjs/helpers/color-helper.js +2 -2
  47. package/dist/cjs/helpers/map-helper.js +2 -1
  48. package/dist/cjs/helpers/zarr-helper.js +3 -3
  49. package/dist/cjs/index.js +15 -21
  50. package/dist/cjs/utils/Filter.js +16 -11
  51. package/dist/cjs/utils/Histogram.js +35 -33
  52. package/dist/cjs/utils/ImageViewer.js +11 -8
  53. package/dist/cjs/utils/Legend.js +37 -30
  54. package/dist/cjs/utils/LoadingIndicators.js +15 -13
  55. package/dist/cjs/utils/Resolver.js +213 -0
  56. package/dist/cjs/utils/Skeleton.js +10 -10
  57. package/dist/cjs/utils/StyledTooltip.js +44 -0
  58. package/dist/cjs/utils/VirtualizedList.js +36 -29
  59. package/dist/cjs/utils/errors.js +15 -15
  60. package/dist/cjs/utils/requests.js +21 -9
  61. package/dist/cjs/utils/search.js +4 -4
  62. package/dist/cjs/utils/string.js +6 -6
  63. package/dist/cjs/utils/zarrData.js +20 -21
  64. package/dist/css/cherita.css +188 -65
  65. package/dist/css/cherita.css.map +1 -1
  66. package/dist/esm/components/controls/Controls.js +43 -35
  67. package/dist/esm/components/dotplot/Dotplot.js +93 -64
  68. package/dist/esm/components/dotplot/DotplotControls.js +106 -85
  69. package/dist/esm/components/full-page/FullPage.js +180 -124
  70. package/dist/esm/components/full-page/PlotAlert.js +39 -0
  71. package/dist/esm/components/full-page/PlotTypeSelector.js +95 -0
  72. package/dist/esm/components/heatmap/Heatmap.js +91 -60
  73. package/dist/esm/components/heatmap/HeatmapControls.js +8 -4
  74. package/dist/esm/components/icons/DotPlotIcon.js +58 -0
  75. package/dist/esm/components/icons/HeatmapIcon.js +39 -0
  76. package/dist/esm/components/icons/MatrixPlotIcon.1.js +51 -0
  77. package/dist/esm/components/icons/MatrixPlotIcon.js +53 -0
  78. package/dist/esm/components/icons/ScatterplotIcon.1.js +158 -0
  79. package/dist/esm/components/icons/ScatterplotIcon.js +138 -0
  80. package/dist/esm/components/icons/ViolinPlotIcon.js +36 -0
  81. package/dist/esm/components/matrixplot/Matrixplot.js +91 -61
  82. package/dist/esm/components/matrixplot/MatrixplotControls.js +10 -6
  83. package/dist/esm/components/obs-list/ObsItem.js +320 -228
  84. package/dist/esm/components/obs-list/ObsList.js +179 -142
  85. package/dist/esm/components/obs-list/ObsToolbar.js +3 -3
  86. package/dist/esm/components/obsm-list/ObsmList.js +71 -32
  87. package/dist/esm/components/offcanvas/index.js +68 -33
  88. package/dist/esm/components/pseudospatial/Pseudospatial.js +145 -88
  89. package/dist/esm/components/pseudospatial/PseudospatialToolbar.js +127 -78
  90. package/dist/esm/components/scatterplot/Scatterplot.js +243 -194
  91. package/dist/esm/components/scatterplot/ScatterplotControls.js +50 -35
  92. package/dist/esm/components/scatterplot/SpatialControls.js +155 -127
  93. package/dist/esm/components/scatterplot/Toolbox.js +44 -32
  94. package/dist/esm/components/search-bar/SearchBar.js +187 -130
  95. package/dist/esm/components/search-bar/SearchInfo.js +86 -91
  96. package/dist/esm/components/search-bar/SearchResults.js +100 -77
  97. package/dist/esm/components/toolbar/Toolbar.js +101 -0
  98. package/dist/esm/components/var-list/VarItem.js +142 -113
  99. package/dist/esm/components/var-list/VarList.js +108 -88
  100. package/dist/esm/components/var-list/VarListToolbar.js +64 -58
  101. package/dist/esm/components/var-list/VarSet.js +134 -115
  102. package/dist/esm/components/violin/Violin.js +135 -91
  103. package/dist/esm/components/violin/ViolinControls.js +10 -6
  104. package/dist/esm/constants/colorscales.js +19 -19
  105. package/dist/esm/constants/constants.js +53 -38
  106. package/dist/esm/context/DatasetContext.js +34 -23
  107. package/dist/esm/context/FilterContext.js +11 -8
  108. package/dist/esm/context/SettingsContext.js +341 -126
  109. package/dist/esm/context/ZarrDataContext.js +8 -6
  110. package/dist/esm/helpers/color-helper.js +5 -5
  111. package/dist/esm/helpers/map-helper.js +4 -3
  112. package/dist/esm/helpers/zarr-helper.js +6 -6
  113. package/dist/esm/index.js +22 -22
  114. package/dist/esm/utils/Filter.js +22 -17
  115. package/dist/esm/utils/Histogram.js +39 -37
  116. package/dist/esm/utils/ImageViewer.js +12 -8
  117. package/dist/esm/utils/Legend.js +44 -36
  118. package/dist/esm/utils/LoadingIndicators.js +16 -13
  119. package/dist/esm/utils/Resolver.js +201 -0
  120. package/dist/esm/utils/Skeleton.js +11 -10
  121. package/dist/esm/utils/StyledTooltip.js +38 -0
  122. package/dist/esm/utils/VirtualizedList.js +37 -29
  123. package/dist/esm/utils/errors.js +15 -15
  124. package/dist/esm/utils/requests.js +24 -12
  125. package/dist/esm/utils/search.js +7 -7
  126. package/dist/esm/utils/string.js +7 -7
  127. package/dist/esm/utils/zarrData.js +27 -28
  128. package/package.json +24 -10
  129. package/scss/cherita-bootstrap.scss +2 -2
  130. package/scss/cherita.scss +65 -17
  131. package/scss/components/accordions.scss +15 -2
  132. package/scss/components/layouts.scss +116 -30
  133. package/scss/components/lists.scss +16 -5
  134. package/scss/components/plotly.scss +40 -23
  135. package/scss/components/plots.scss +14 -1
  136. package/dist/cjs/components/full-page/FullPagePseudospatial.js +0 -157
  137. package/dist/esm/components/full-page/FullPagePseudospatial.js +0 -149
@@ -4,7 +4,7 @@ Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
6
  exports.ObsColsList = ObsColsList;
7
- var _react = _interopRequireWildcard(require("react"));
7
+ var _react = require("react");
8
8
  var _freeSolidSvgIcons = require("@fortawesome/free-solid-svg-icons");
9
9
  var _reactFontawesome = require("@fortawesome/react-fontawesome");
10
10
  var _Comment = _interopRequireDefault(require("@mui/icons-material/Comment"));
@@ -15,14 +15,14 @@ var _reactBootstrap = require("react-bootstrap");
15
15
  var _Accordion = _interopRequireDefault(require("react-bootstrap/Accordion"));
16
16
  var _AccordionButton = require("react-bootstrap/AccordionButton");
17
17
  var _AccordionContext = _interopRequireDefault(require("react-bootstrap/AccordionContext"));
18
- var _ObsItem = require("./ObsItem");
19
18
  var _constants = require("../../constants/constants");
20
19
  var _DatasetContext = require("../../context/DatasetContext");
21
20
  var _SettingsContext = require("../../context/SettingsContext");
22
21
  var _LoadingIndicators = require("../../utils/LoadingIndicators");
23
22
  var _requests = require("../../utils/requests");
23
+ var _ObsItem = require("./ObsItem");
24
+ var _jsxRuntime = require("react/jsx-runtime");
24
25
  function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
25
- 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); }
26
26
  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; }
27
27
  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; }
28
28
  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; }
@@ -41,46 +41,55 @@ const ObsAccordionToggle = _ref => {
41
41
  const decoratedOnClick = (0, _AccordionButton.useAccordionButton)(eventKey, () => {
42
42
  handleAccordionToggle(eventKey, isCurrentEventKey);
43
43
  });
44
- return /*#__PURE__*/_react.default.createElement("div", {
45
- className: "obs-accordion-header ".concat(isCurrentEventKey ? "active" : ""),
46
- onClick: decoratedOnClick
47
- }, /*#__PURE__*/_react.default.createElement("span", {
48
- className: "obs-accordion-header-chevron"
49
- }, /*#__PURE__*/_react.default.createElement(_reactFontawesome.FontAwesomeIcon, {
50
- icon: isCurrentEventKey ? _freeSolidSvgIcons.faChevronDown : _freeSolidSvgIcons.faChevronRight
51
- })), /*#__PURE__*/_react.default.createElement("span", {
52
- className: "obs-accordion-header-title"
53
- }, children));
44
+ return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
45
+ className: "obs-accordion-header ".concat(isCurrentEventKey ? 'active' : ''),
46
+ onClick: decoratedOnClick,
47
+ children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
48
+ className: "obs-accordion-header-chevron",
49
+ children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactFontawesome.FontAwesomeIcon, {
50
+ icon: isCurrentEventKey ? _freeSolidSvgIcons.faChevronDown : _freeSolidSvgIcons.faChevronRight
51
+ })
52
+ }), /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
53
+ className: "obs-accordion-header-span",
54
+ children: children
55
+ })]
56
+ });
54
57
  };
55
58
  function ObsColsList(_ref2) {
56
- var _settings$selectedObs;
59
+ var _settings$selectedObs, _settings$selectedObs3, _settings$selectedObs4;
57
60
  let {
58
61
  showColor = true,
59
- enableObsGroups = true
62
+ enableObsGroups = true,
63
+ showSelectedAsActive = false,
64
+ showHistograms = true
60
65
  } = _ref2;
61
- const ENDPOINT = "obs/cols";
66
+ const ENDPOINT = 'obs/cols';
62
67
  const dataset = (0, _DatasetContext.useDataset)();
63
68
  const settings = (0, _SettingsContext.useSettings)();
64
69
  const dispatch = (0, _SettingsContext.useSettingsDispatch)();
65
70
  const [enableGroups, setEnableGroups] = (0, _react.useState)(enableObsGroups);
66
71
  const [obsCols, setObsCols] = (0, _react.useState)(null);
67
- const [active, setActive] = (0, _react.useState)([...[(_settings$selectedObs = settings.selectedObs) === null || _settings$selectedObs === void 0 ? void 0 : _settings$selectedObs.name]]);
68
- const [params, setParams] = (0, _react.useState)({
69
- url: dataset.url
70
- });
72
+ const [active, setActive] = (0, _react.useState)([...(settings.selectedObs ? [(_settings$selectedObs = settings.selectedObs) === null || _settings$selectedObs === void 0 ? void 0 : _settings$selectedObs.name] : [])]);
71
73
  const obsGroups = (0, _react.useMemo)(() => {
72
74
  var _dataset$obsGroups;
73
75
  return _objectSpread({
74
76
  default: _lodash.default.union(_constants.DEFAULT_OBS_GROUP, (_dataset$obsGroups = dataset.obsGroups) === null || _dataset$obsGroups === void 0 ? void 0 : _dataset$obsGroups.default)
75
- }, _lodash.default.omit(dataset.obsGroups, "default"));
77
+ }, _lodash.default.omit(dataset.obsGroups, 'default'));
76
78
  }, [dataset.obsGroups]);
79
+ const [params, setParams] = (0, _react.useState)(_objectSpread({
80
+ url: dataset.url
81
+ }, enableGroups ? {
82
+ cols: _lodash.default.flatten(_lodash.default.values(obsGroups))
83
+ } : {}));
77
84
  (0, _react.useEffect)(() => {
78
85
  setParams(p => {
79
86
  return _objectSpread(_objectSpread({}, p), {}, {
80
87
  url: dataset.url
81
- });
88
+ }, enableGroups ? {
89
+ cols: _lodash.default.flatten(_lodash.default.values(obsGroups))
90
+ } : {});
82
91
  });
83
- }, [dataset.url]);
92
+ }, [dataset.url, enableGroups, obsGroups]);
84
93
  const {
85
94
  fetchedData,
86
95
  isPending,
@@ -110,25 +119,34 @@ function ObsColsList(_ref2) {
110
119
  return d.type !== _constants.OBS_TYPES.DISCRETE;
111
120
  });
112
121
  setObsCols(_lodash.default.keyBy(_lodash.default.map(filteredData, d => {
122
+ var _settings$selectedObs2;
123
+ if (((_settings$selectedObs2 = settings.selectedObs) === null || _settings$selectedObs2 === void 0 ? void 0 : _settings$selectedObs2.name) === d.name) {
124
+ return _objectSpread(_objectSpread({}, d), {}, {
125
+ omit: settings.selectedObs.omit || []
126
+ });
127
+ }
113
128
  return _objectSpread(_objectSpread({}, d), {}, {
114
- codesMap: _lodash.default.invert(d.codes),
115
129
  omit: []
116
130
  });
117
- }), "name"));
131
+ }), 'name'));
118
132
  }
119
- }, [fetchedData, isPending, obsGroups, serverError, enableGroups]);
133
+ }, [fetchedData, isPending, obsGroups, serverError, enableGroups, (_settings$selectedObs3 = settings.selectedObs) === null || _settings$selectedObs3 === void 0 ? void 0 : _settings$selectedObs3.name, (_settings$selectedObs4 = settings.selectedObs) === null || _settings$selectedObs4 === void 0 ? void 0 : _settings$selectedObs4.omit]);
120
134
  (0, _react.useEffect)(() => {
121
- if (obsCols) {
122
- var _settings$selectedObs2;
123
- if (!obsCols[(_settings$selectedObs2 = settings.selectedObs) === null || _settings$selectedObs2 === void 0 ? void 0 : _settings$selectedObs2.name]) {
124
- setActive([]);
135
+ if (obsCols && settings.selectedObs) {
136
+ const {
137
+ name
138
+ } = settings.selectedObs;
139
+ if (!obsCols[name]) {
125
140
  dispatch({
126
- type: "select.obs",
141
+ type: 'select.obs',
127
142
  obs: null
128
143
  });
144
+ if (active.includes(name)) {
145
+ setActive(prev => _lodash.default.without(prev, name));
146
+ }
129
147
  }
130
148
  }
131
- }, [settings.selectedObs, dispatch, obsCols]);
149
+ }, [settings.selectedObs, dispatch, obsCols, active]);
132
150
  const handleAccordionToggle = (itemName, isCurrentEventKey) => {
133
151
  if (isCurrentEventKey) {
134
152
  _lodash.default.delay(() => setActive(prev => _lodash.default.without(prev, itemName)), 250);
@@ -137,8 +155,8 @@ function ObsColsList(_ref2) {
137
155
  }
138
156
  };
139
157
  const toggleAll = item => {
140
- var _settings$selectedObs3;
141
- const omit = item.omit.length ? [] : _lodash.default.map(item.values, v => item.codes[v]);
158
+ var _settings$selectedObs5;
159
+ const omit = item.omit.length ? [] : item.values;
142
160
  setObsCols(o => {
143
161
  return _objectSpread(_objectSpread({}, o), {}, {
144
162
  [item.name]: _objectSpread(_objectSpread({}, item), {}, {
@@ -146,9 +164,9 @@ function ObsColsList(_ref2) {
146
164
  })
147
165
  });
148
166
  });
149
- if (((_settings$selectedObs3 = settings.selectedObs) === null || _settings$selectedObs3 === void 0 ? void 0 : _settings$selectedObs3.name) === item.name) {
167
+ if (((_settings$selectedObs5 = settings.selectedObs) === null || _settings$selectedObs5 === void 0 ? void 0 : _settings$selectedObs5.name) === item.name) {
150
168
  dispatch({
151
- type: "select.obs",
169
+ type: 'select.obs',
152
170
  obs: _objectSpread(_objectSpread({}, item), {}, {
153
171
  omit: omit
154
172
  })
@@ -156,46 +174,42 @@ function ObsColsList(_ref2) {
156
174
  }
157
175
  };
158
176
  const toggleLabel = item => {
159
- const inLabelObs = _lodash.default.some(settings.labelObs, i => i.name === item.name);
177
+ const inLabelObs = _lodash.default.includes(settings.labelObs, item.name);
160
178
  if (inLabelObs) {
161
179
  dispatch({
162
- type: "remove.label.obs",
180
+ type: 'remove.label.obs',
163
181
  obsName: item.name
164
182
  });
165
183
  } else {
166
184
  dispatch({
167
- type: "add.label.obs",
168
- obs: {
169
- name: item.name,
170
- type: item.type,
171
- codesMap: item.codesMap
172
- }
185
+ type: 'add.label.obs',
186
+ obs: item
173
187
  });
174
188
  }
175
189
  };
176
190
  const toggleSlice = item => {
177
191
  dispatch({
178
- type: "toggle.slice.obs",
192
+ type: 'toggle.slice.obs',
179
193
  obs: item
180
194
  });
181
195
  };
182
196
  const toggleColor = item => {
183
197
  dispatch({
184
- type: "select.obs",
198
+ type: 'select.obs',
185
199
  obs: item
186
200
  });
187
201
  dispatch({
188
- type: "set.colorEncoding",
202
+ type: 'set.colorEncoding',
189
203
  value: _constants.COLOR_ENCODINGS.OBS
190
204
  });
191
205
  };
192
206
  const toggleObs = (item, value) => {
193
- var _settings$selectedObs4;
207
+ var _settings$selectedObs6;
194
208
  let omit;
195
- if (_lodash.default.includes(item.omit, item.codes[value])) {
196
- omit = item.omit.filter(i => i !== item.codes[value]);
209
+ if (_lodash.default.includes(item.omit, value)) {
210
+ omit = item.omit.filter(i => i !== value);
197
211
  } else {
198
- omit = [...item.omit, item.codes[value]];
212
+ omit = [...item.omit, value];
199
213
  }
200
214
  setObsCols(o => {
201
215
  return _objectSpread(_objectSpread({}, o), {}, {
@@ -204,9 +218,9 @@ function ObsColsList(_ref2) {
204
218
  })
205
219
  });
206
220
  });
207
- if (((_settings$selectedObs4 = settings.selectedObs) === null || _settings$selectedObs4 === void 0 ? void 0 : _settings$selectedObs4.name) === item.name) {
221
+ if (((_settings$selectedObs6 = settings.selectedObs) === null || _settings$selectedObs6 === void 0 ? void 0 : _settings$selectedObs6.name) === item.name) {
208
222
  dispatch({
209
- type: "select.obs",
223
+ type: 'select.obs',
210
224
  obs: _objectSpread(_objectSpread({}, item), {}, {
211
225
  omit: omit
212
226
  })
@@ -214,101 +228,123 @@ function ObsColsList(_ref2) {
214
228
  }
215
229
  };
216
230
  const obsItem = item => {
217
- var _settings$selectedObs5, _settings$selectedObs6;
231
+ var _settings$selectedObs7, _settings$selectedObs8;
218
232
  if (!item) {
219
233
  return null;
220
234
  }
221
235
  if (item.type === _constants.OBS_TYPES.DISCRETE) {
222
236
  return null;
223
237
  }
224
- const inLabelObs = _lodash.default.some(settings.labelObs, i => i.name === item.name);
225
- const inSliceObs = settings.sliceBy.obs && ((_settings$selectedObs5 = settings.selectedObs) === null || _settings$selectedObs5 === void 0 ? void 0 : _settings$selectedObs5.name) === item.name;
226
- const isColorEncoding = settings.colorEncoding === _constants.COLOR_ENCODINGS.OBS && ((_settings$selectedObs6 = settings.selectedObs) === null || _settings$selectedObs6 === void 0 ? void 0 : _settings$selectedObs6.name) === item.name;
227
- return /*#__PURE__*/_react.default.createElement("div", {
238
+ const inLabelObs = _lodash.default.includes(settings.labelObs, item.name);
239
+ const inSliceObs = settings.sliceBy.obs && ((_settings$selectedObs7 = settings.selectedObs) === null || _settings$selectedObs7 === void 0 ? void 0 : _settings$selectedObs7.name) === item.name;
240
+ const isColorEncoding = (showSelectedAsActive || settings.colorEncoding === _constants.COLOR_ENCODINGS.OBS) && ((_settings$selectedObs8 = settings.selectedObs) === null || _settings$selectedObs8 === void 0 ? void 0 : _settings$selectedObs8.name) === item.name;
241
+ return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
228
242
  className: "accordion-item",
229
- key: item.name
230
- }, /*#__PURE__*/_react.default.createElement(ObsAccordionToggle, {
231
- eventKey: item.name,
232
- handleAccordionToggle: handleAccordionToggle
233
- }, /*#__PURE__*/_react.default.createElement("div", null, item.name), /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement("span", {
234
- className: "mx-1 cursor-pointer ".concat(inLabelObs ? "active-icon" : "text-muted opacity-50"),
235
- onClick: event => {
236
- event.stopPropagation();
237
- toggleLabel(item);
238
- },
239
- title: "Add to tooltip"
240
- }, /*#__PURE__*/_react.default.createElement(_Comment.default, null)), /*#__PURE__*/_react.default.createElement("span", {
241
- className: "mx-1 cursor-pointer ".concat(inSliceObs ? "active-icon" : "text-muted opacity-50"),
242
- onClick: event => {
243
- event.stopPropagation();
244
- toggleSlice(item);
245
- },
246
- title: "Filter applied"
247
- }, /*#__PURE__*/_react.default.createElement(_JoinInner.default, null)), /*#__PURE__*/_react.default.createElement("span", {
248
- className: "mx-1 cursor-pointer ".concat(isColorEncoding ? "active-icon" : "text-muted opacity-50"),
249
- onClick: event => {
250
- event.stopPropagation();
251
- toggleColor(item);
252
- },
253
- title: "Is color encoding"
254
- }, /*#__PURE__*/_react.default.createElement(_WaterDrop.default, null)))), /*#__PURE__*/_react.default.createElement(_Accordion.default.Collapse, {
255
- eventKey: item.name
256
- }, /*#__PURE__*/_react.default.createElement("div", {
257
- className: "obs-accordion-body"
258
- }, active.includes(item.name) && (item.type === _constants.OBS_TYPES.CATEGORICAL || item.type === _constants.OBS_TYPES.BOOLEAN ? /*#__PURE__*/_react.default.createElement(_ObsItem.CategoricalObs, {
259
- key: item.name,
260
- obs: item,
261
- toggleAll: () => toggleAll(item),
262
- toggleObs: value => toggleObs(item, value),
263
- toggleLabel: () => toggleLabel(item),
264
- toggleSlice: () => toggleSlice(item),
265
- toggleColor: () => toggleColor(item),
266
- showColor: showColor && isColorEncoding
267
- }) : /*#__PURE__*/_react.default.createElement(_ObsItem.ContinuousObs, {
268
- key: item.name,
269
- obs: item,
270
- toggleAll: () => toggleAll(item),
271
- toggleObs: value => toggleObs(item, value),
272
- toggleLabel: () => toggleLabel(item),
273
- toggleSlice: () => toggleSlice(item),
274
- toggleColor: () => toggleColor(item)
275
- })))));
243
+ children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(ObsAccordionToggle, {
244
+ eventKey: item.name,
245
+ handleAccordionToggle: handleAccordionToggle,
246
+ children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
247
+ className: "accordion-header-title",
248
+ children: item.name
249
+ }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
250
+ className: "accordion-header-toolbar",
251
+ children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
252
+ className: "mx-1 cursor-pointer ".concat(inLabelObs ? 'active-icon' : 'text-muted opacity-50'),
253
+ onClick: event => {
254
+ event.stopPropagation();
255
+ toggleLabel(item);
256
+ },
257
+ title: "Add to tooltip",
258
+ children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Comment.default, {})
259
+ }), /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
260
+ className: "mx-1 cursor-pointer ".concat(inSliceObs ? 'active-icon' : 'text-muted opacity-50'),
261
+ onClick: event => {
262
+ event.stopPropagation();
263
+ toggleSlice(item);
264
+ },
265
+ title: "Filter applied",
266
+ children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_JoinInner.default, {})
267
+ }), /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
268
+ className: "mx-1 cursor-pointer ".concat(isColorEncoding ? 'active-icon' : 'text-muted opacity-50'),
269
+ onClick: event => {
270
+ event.stopPropagation();
271
+ toggleColor(item);
272
+ },
273
+ title: showSelectedAsActive ? 'Is selected' : 'Is color encoding',
274
+ children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_WaterDrop.default, {})
275
+ })]
276
+ })]
277
+ }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Accordion.default.Collapse, {
278
+ eventKey: item.name,
279
+ children: /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
280
+ className: "obs-accordion-body",
281
+ children: active.includes(item.name) && (item.type === _constants.OBS_TYPES.CATEGORICAL || item.type === _constants.OBS_TYPES.BOOLEAN ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_ObsItem.CategoricalObs, {
282
+ obs: item,
283
+ toggleAll: () => toggleAll(item),
284
+ toggleObs: value => toggleObs(item, value),
285
+ toggleLabel: () => toggleLabel(item),
286
+ toggleSlice: () => toggleSlice(item),
287
+ toggleColor: () => toggleColor(item),
288
+ showColor: showColor && isColorEncoding,
289
+ showHistograms: showHistograms
290
+ }, item.name) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_ObsItem.ContinuousObs, {
291
+ obs: item,
292
+ toggleAll: () => toggleAll(item),
293
+ toggleObs: value => toggleObs(item, value),
294
+ toggleLabel: () => toggleLabel(item),
295
+ toggleSlice: () => toggleSlice(item),
296
+ toggleColor: () => toggleColor(item),
297
+ showHistograms: showHistograms
298
+ }, item.name))
299
+ })
300
+ })]
301
+ }, item.name);
276
302
  };
277
303
  const groupList = _lodash.default.map(_lodash.default.keys(obsGroups), group => {
278
304
  const key = "group-".concat(group);
279
305
  const groupItems = _lodash.default.compact(_lodash.default.map(_lodash.default.sortBy(obsGroups[group], o => _lodash.default.lowerCase(o.name)), item => {
280
306
  return obsItem(obsCols === null || obsCols === void 0 ? void 0 : obsCols[item]);
281
307
  }));
282
- if (group === "default") {
308
+ if (group === 'default') {
283
309
  return groupItems;
284
310
  } else {
285
- return /*#__PURE__*/_react.default.createElement(_Accordion.default.Item, {
286
- key: key,
311
+ return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_Accordion.default.Item, {
287
312
  eventKey: key,
288
- className: "obs-group-accordion-item"
289
- }, /*#__PURE__*/_react.default.createElement(_Accordion.default.Header, {
290
- className: "obs-group-accordion-header"
291
- }, group), /*#__PURE__*/_react.default.createElement(_Accordion.default.Body, {
292
- className: "obs-group-accordion-body"
293
- }, groupItems));
313
+ className: "obs-group-accordion-item",
314
+ children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_Accordion.default.Header, {
315
+ className: "obs-group-accordion-header",
316
+ children: group
317
+ }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Accordion.default.Body, {
318
+ className: "obs-group-accordion-body",
319
+ children: groupItems
320
+ })]
321
+ }, key);
294
322
  }
295
323
  });
296
- const obsList = enableGroups ? /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, groupList) : _lodash.default.map(_lodash.default.sortBy(obsCols, o => _lodash.default.lowerCase(o.name)), item => obsItem(item));
324
+ const obsList = enableGroups ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {
325
+ children: groupList
326
+ }) : _lodash.default.map(_lodash.default.sortBy(obsCols, o => _lodash.default.lowerCase(o.name)), item => obsItem(item));
297
327
  const defaultActiveGroup = enableGroups ? "group-".concat(_lodash.default.findKey(obsGroups, g => g.includes(active === null || active === void 0 ? void 0 : active[0]))) : null;
298
328
  if (!serverError) {
299
- return /*#__PURE__*/_react.default.createElement("div", {
300
- className: "position-relative h-100"
301
- }, isPending ? /*#__PURE__*/_react.default.createElement(_LoadingIndicators.LoadingSpinner, null) : !!obsCols && !_lodash.default.size(obsCols) ? /*#__PURE__*/_react.default.createElement(_reactBootstrap.Alert, {
302
- variant: "danger"
303
- }, "No observations found.") : /*#__PURE__*/_react.default.createElement(_Accordion.default, {
304
- flush: true,
305
- defaultActiveKey: [...active, ...[defaultActiveGroup]],
306
- alwaysOpen: true,
307
- className: "obs-accordion"
308
- }, obsList));
329
+ return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
330
+ className: "position-relative h-100",
331
+ children: isPending ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_LoadingIndicators.LoadingSpinner, {}) : !!obsCols && !_lodash.default.size(obsCols) ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactBootstrap.Alert, {
332
+ variant: "danger",
333
+ children: "No observations found."
334
+ }) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_Accordion.default, {
335
+ flush: true,
336
+ defaultActiveKey: [...active, ...[defaultActiveGroup]],
337
+ alwaysOpen: true,
338
+ className: "obs-accordion",
339
+ children: obsList
340
+ })
341
+ });
309
342
  } else {
310
- return /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement(_reactBootstrap.Alert, {
311
- variant: "danger"
312
- }, serverError.message));
343
+ return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
344
+ children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactBootstrap.Alert, {
345
+ variant: "danger",
346
+ children: serverError.message
347
+ })
348
+ });
313
349
  }
314
350
  }
@@ -4,9 +4,8 @@ Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
6
  exports.ObsToolbar = ObsToolbar;
7
- var _react = _interopRequireDefault(require("react"));
8
7
  var _reactBootstrap = require("react-bootstrap");
9
- function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
8
+ var _jsxRuntime = require("react/jsx-runtime");
10
9
  function ObsToolbar(_ref) {
11
10
  let {
12
11
  item,
@@ -14,7 +13,7 @@ function ObsToolbar(_ref) {
14
13
  onToggleAllObs
15
14
  } = _ref;
16
15
  const allToggledOn = !item.omit.length;
17
- return showToggleAllObs && /*#__PURE__*/_react.default.createElement(_reactBootstrap.Form.Check, {
16
+ return showToggleAllObs && /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactBootstrap.Form.Check, {
18
17
  type: "switch",
19
18
  id: "custom-switch",
20
19
  label: "Toggle all",
@@ -4,20 +4,26 @@ Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
6
  exports.ObsmKeysList = ObsmKeysList;
7
- var _react = _interopRequireWildcard(require("react"));
7
+ var _react = require("react");
8
+ var _lodash = _interopRequireDefault(require("lodash"));
8
9
  var _reactBootstrap = require("react-bootstrap");
10
+ var _constants = require("../../constants/constants");
9
11
  var _DatasetContext = require("../../context/DatasetContext");
10
12
  var _SettingsContext = require("../../context/SettingsContext");
11
13
  var _requests = require("../../utils/requests");
12
14
  var _Skeleton = require("../../utils/Skeleton");
13
- 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); }
15
+ var _jsxRuntime = require("react/jsx-runtime");
16
+ function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
14
17
  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; }
15
18
  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; }
16
19
  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; }
17
20
  function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == typeof i ? i : i + ""; }
18
21
  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); }
19
- function ObsmKeysList() {
20
- const ENDPOINT = "obsm/keys";
22
+ function ObsmKeysList(_ref) {
23
+ let {
24
+ setHasObsm
25
+ } = _ref;
26
+ const ENDPOINT = 'obsm/keys';
21
27
  const dataset = (0, _DatasetContext.useDataset)();
22
28
  const settings = (0, _SettingsContext.useSettings)();
23
29
  const dispatch = (0, _SettingsContext.useSettingsDispatch)();
@@ -41,48 +47,81 @@ function ObsmKeysList() {
41
47
  refetchOnMount: false
42
48
  });
43
49
  (0, _react.useEffect)(() => {
44
- if (!isPending && !serverError && fetchedData) {
45
- setObsmKeysList(fetchedData);
46
- }
47
- }, [fetchedData, isPending, serverError]);
48
- (0, _react.useEffect)(() => {
49
- if (settings.selectedObsm) {
50
- setActive(settings.selectedObsm);
50
+ if (!isPending && !serverError) {
51
+ if (!fetchedData || !fetchedData.length) {
52
+ setHasObsm(false);
53
+ } else {
54
+ setHasObsm(true);
55
+ setObsmKeysList(fetchedData);
56
+
57
+ // Set default obsm if in keys list and not selected
58
+ if (!settings.selectedObsm) {
59
+ // Follow DEFAULT_OBSM_KEYS order
60
+ _lodash.default.each(_constants.DEFAULT_OBSM_KEYS, k => {
61
+ const defaultObsm = _lodash.default.find(fetchedData, item => item.toLowerCase() === k);
62
+ if (defaultObsm) {
63
+ dispatch({
64
+ type: 'select.obsm',
65
+ obsm: defaultObsm
66
+ });
67
+ return false; // break
68
+ }
69
+ });
70
+ }
71
+ }
72
+ if (settings.selectedObsm) {
73
+ // If selected obsm is not in keys list, reset to null
74
+ if (!_lodash.default.includes(fetchedData || [], settings.selectedObsm)) {
75
+ dispatch({
76
+ type: 'select.obsm',
77
+ obsm: null
78
+ });
79
+ } else {
80
+ setActive(settings.selectedObsm);
81
+ }
82
+ }
51
83
  }
52
- }, [settings.selectedObsm]);
84
+ }, [dispatch, fetchedData, isPending, serverError, setHasObsm, settings.selectedObsm]);
53
85
  const obsmList = obsmKeysList.map(item => {
54
- return /*#__PURE__*/_react.default.createElement(_reactBootstrap.Dropdown.Item, {
55
- key: item,
56
- className: "custom ".concat(active === item && "active"),
86
+ return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactBootstrap.Dropdown.Item, {
87
+ className: "custom ".concat(active === item && 'active'),
57
88
  onClick: () => {
58
89
  dispatch({
59
- type: "select.obsm",
90
+ type: 'select.obsm',
60
91
  obsm: item
61
92
  });
62
- }
93
+ },
94
+ children: item
63
95
  }, item);
64
96
  });
65
97
  if (!serverError) {
66
98
  if (isPending) {
67
- return /*#__PURE__*/_react.default.createElement(_Skeleton.ObsmKeysListBtn, null);
99
+ return /*#__PURE__*/(0, _jsxRuntime.jsx)(_Skeleton.ObsmKeysListBtn, {});
68
100
  }
69
- return /*#__PURE__*/_react.default.createElement(_reactBootstrap.DropdownButton, {
101
+ return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactBootstrap.DropdownButton, {
70
102
  as: _reactBootstrap.ButtonGroup,
71
- title: settings.selectedObsm || "Select an embedding",
72
- variant: settings.selectedObsm ? "primary" : "warning",
103
+ title: settings.selectedObsm || 'Select an embedding',
104
+ variant: settings.selectedObsm ? 'primary' : 'warning',
73
105
  id: "bg-nested-dropdown",
74
- size: "sm"
75
- }, /*#__PURE__*/_react.default.createElement(_reactBootstrap.Dropdown.Header, null, "Embeddings"), obsmList);
106
+ size: "sm",
107
+ children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactBootstrap.Dropdown.Header, {
108
+ children: "Embeddings"
109
+ }), obsmList]
110
+ });
76
111
  } else {
77
- return /*#__PURE__*/_react.default.createElement(_reactBootstrap.OverlayTrigger, {
112
+ return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactBootstrap.OverlayTrigger, {
78
113
  placement: "top",
79
114
  delay: {
80
115
  show: 100,
81
116
  hide: 200
82
117
  },
83
- overlay: /*#__PURE__*/_react.default.createElement(_reactBootstrap.Tooltip, null, serverError.message)
84
- }, /*#__PURE__*/_react.default.createElement(_reactBootstrap.Button, {
85
- variant: "danger"
86
- }, "Error"));
118
+ overlay: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactBootstrap.Tooltip, {
119
+ children: serverError.message
120
+ }),
121
+ children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactBootstrap.Button, {
122
+ variant: "danger",
123
+ children: "Error"
124
+ })
125
+ });
87
126
  }
88
127
  }