@haniffalab/cherita-react 0.2.0-dev.2025-01-22.f523ac5e → 0.2.0-dev.2025-01-28.4d5ab0a4

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 (43) hide show
  1. package/README.md +5 -0
  2. package/dist/components/dotplot/Dotplot.js +19 -26
  3. package/dist/components/dotplot/DotplotControls.js +106 -147
  4. package/dist/components/full-page/FullPage.js +99 -148
  5. package/dist/components/heatmap/Heatmap.js +19 -26
  6. package/dist/components/heatmap/HeatmapControls.js +7 -13
  7. package/dist/components/matrixplot/Matrixplot.js +19 -26
  8. package/dist/components/matrixplot/MatrixplotControls.js +14 -35
  9. package/dist/components/obs-list/ObsItem.js +182 -239
  10. package/dist/components/obs-list/ObsList.js +40 -49
  11. package/dist/components/obs-list/ObsToolbar.js +44 -55
  12. package/dist/components/obsm-list/ObsmList.js +15 -23
  13. package/dist/components/offcanvas/index.js +45 -75
  14. package/dist/components/pseudospatial/Pseudospatial.js +26 -34
  15. package/dist/components/pseudospatial/PseudospatialControls.js +1 -2
  16. package/dist/components/pseudospatial/PseudospatialToolbar.js +37 -65
  17. package/dist/components/scatterplot/Scatterplot.js +74 -89
  18. package/dist/components/scatterplot/ScatterplotControls.js +28 -39
  19. package/dist/components/scatterplot/SpatialControls.js +94 -117
  20. package/dist/components/scatterplot/Toolbox.js +16 -24
  21. package/dist/components/search-bar/SearchBar.js +45 -54
  22. package/dist/components/search-bar/SearchResults.js +36 -49
  23. package/dist/components/var-list/VarItem.js +112 -160
  24. package/dist/components/var-list/VarList.js +81 -124
  25. package/dist/components/var-list/VarListToolbar.js +48 -59
  26. package/dist/components/var-list/VarSet.js +95 -120
  27. package/dist/components/violin/Violin.js +31 -46
  28. package/dist/components/violin/ViolinControls.js +8 -22
  29. package/dist/context/DatasetContext.js +17 -27
  30. package/dist/context/FilterContext.js +8 -12
  31. package/dist/context/ZarrDataContext.js +6 -9
  32. package/dist/helpers/color-helper.js +11 -12
  33. package/dist/helpers/map-helper.js +7 -8
  34. package/dist/helpers/zarr-helper.js +9 -15
  35. package/dist/utils/Histogram.js +34 -41
  36. package/dist/utils/ImageViewer.js +9 -14
  37. package/dist/utils/Legend.js +30 -40
  38. package/dist/utils/LoadingIndicators.js +16 -19
  39. package/dist/utils/VirtualizedList.js +32 -39
  40. package/dist/utils/requests.js +15 -25
  41. package/dist/utils/string.js +4 -9
  42. package/dist/utils/zarrData.js +2 -8
  43. package/package.json +40 -34
package/README.md CHANGED
@@ -1,3 +1,8 @@
1
+ [![build](https://github.com/haniffalab/cherita-react/actions/workflows/npm-publish.yml/badge.svg)](https://github.com/haniffalab/cherita-react/actions/workflows/npm-publish.yml)
2
+ [![build-dev](https://github.com/haniffalab/cherita-react/actions/workflows/npm-publish-dev.yml/badge.svg)](https://github.com/haniffalab/cherita-react/actions/workflows/npm-publish-dev.yml)
3
+ [![npm](https://img.shields.io/npm/v/@haniffalab/cherita-react)](https://www.npmjs.com/package/@haniffalab/cherita-react)
4
+ [![codecov](https://codecov.io/gh/haniffalab/cherita-react/graph/badge.svg?token=8RLSQP1FFB)](https://codecov.io/gh/haniffalab/cherita-react)
5
+
1
6
  # Cherita
2
7
 
3
8
  ## Development
package/dist/components/dotplot/Dotplot.js CHANGED
@@ -12,7 +12,6 @@ var _DatasetContext = require("../../context/DatasetContext");
12
12
  var _FilterContext = require("../../context/FilterContext");
13
13
  var _LoadingIndicators = require("../../utils/LoadingIndicators");
14
14
  var _requests = require("../../utils/requests");
15
- var _jsxRuntime = require("react/jsx-runtime");
16
15
  function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
17
16
  function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
18
17
  function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
@@ -120,32 +119,26 @@ function Dotplot() {
120
119
  }, [dataset.controls.colorAxis.cmin, dataset.controls.colorAxis.cmax]);
121
120
  if (!serverError) {
122
121
  if (hasSelections) {
123
- return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
124
- className: "cherita-dotplot position-relative",
125
- children: [isPending && /*#__PURE__*/(0, _jsxRuntime.jsx)(_LoadingIndicators.LoadingSpinner, {}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactPlotly.default, {
126
- data: data,
127
- layout: layout,
128
- useResizeHandler: true,
129
- style: {
130
- maxWidth: "100%",
131
- maxHeight: "100%"
132
- }
133
- })]
134
- });
122
+ return /*#__PURE__*/_react.default.createElement("div", {
123
+ className: "cherita-dotplot position-relative"
124
+ }, isPending && /*#__PURE__*/_react.default.createElement(_LoadingIndicators.LoadingSpinner, null), /*#__PURE__*/_react.default.createElement(_reactPlotly.default, {
125
+ data: data,
126
+ layout: layout,
127
+ useResizeHandler: true,
128
+ style: {
129
+ maxWidth: "100%",
130
+ maxHeight: "100%"
131
+ }
132
+ }));
135
133
  }
136
- return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
137
- className: "cherita-dotplot",
138
- children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactBootstrap.Alert, {
139
- variant: "light",
140
- children: "Select features and a category"
141
- })
142
- });
134
+ return /*#__PURE__*/_react.default.createElement("div", {
135
+ className: "cherita-dotplot"
136
+ }, /*#__PURE__*/_react.default.createElement(_reactBootstrap.Alert, {
137
+ variant: "light"
138
+ }, "Select features and a category"));
143
139
  } else {
144
- return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
145
- children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactBootstrap.Alert, {
146
- variant: "danger",
147
- children: serverError.message
148
- })
149
- });
140
+ return /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement(_reactBootstrap.Alert, {
141
+ variant: "danger"
142
+ }, serverError.message));
150
143
  }
151
144
  }
package/dist/components/dotplot/DotplotControls.js CHANGED
@@ -11,7 +11,6 @@ var _Dropdown = _interopRequireDefault(require("react-bootstrap/Dropdown"));
11
11
  var _colorscales = require("../../constants/colorscales");
12
12
  var _constants = require("../../constants/constants");
13
13
  var _DatasetContext = require("../../context/DatasetContext");
14
- var _jsxRuntime = require("react/jsx-runtime");
15
14
  function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
16
15
  function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
17
16
  function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
@@ -35,17 +34,18 @@ function DotplotControls() {
35
34
  expressionCutoff: dataset.controls.expressionCutoff
36
35
  }));
37
36
  }, [dataset.controls.colorAxis.cmin, dataset.controls.colorAxis.cmax, dataset.controls.expressionCutoff]);
38
- const colorScaleList = _lodash.default.keys(_colorscales.COLORSCALES).map(key => /*#__PURE__*/(0, _jsxRuntime.jsx)(_Dropdown.default.Item, {
37
+ const colorScaleList = _lodash.default.keys(_colorscales.COLORSCALES).map(key => /*#__PURE__*/_react.default.createElement(_Dropdown.default.Item, {
38
+ key: key,
39
39
  active: dataset.controls.colorScale === key,
40
40
  onClick: () => {
41
41
  dispatch({
42
42
  type: "set.controls.colorScale",
43
43
  colorScale: key
44
44
  });
45
- },
46
- children: key
45
+ }
47
46
  }, key));
48
- const standardScaleList = _lodash.default.values(_constants.DOTPLOT_SCALES).map(scale => /*#__PURE__*/(0, _jsxRuntime.jsx)(_Dropdown.default.Item, {
47
+ const standardScaleList = _lodash.default.values(_constants.DOTPLOT_SCALES).map(scale => /*#__PURE__*/_react.default.createElement(_Dropdown.default.Item, {
48
+ key: scale.value,
49
49
  active: dataset.controls.scale.dotplot === scale,
50
50
  onClick: () => {
51
51
  dispatch({
@@ -53,146 +53,105 @@ function DotplotControls() {
53
53
  plot: "dotplot",
54
54
  scale: scale
55
55
  });
56
- },
57
- children: scale.name
58
- }, scale.value));
59
- return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactBootstrap.ButtonToolbar, {
60
- children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactBootstrap.ButtonGroup, {
61
- children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_Dropdown.default, {
62
- children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_Dropdown.default.Toggle, {
63
- id: "dropdownColorscale",
64
- variant: "light",
65
- children: dataset.controls.colorScale
66
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Dropdown.default.Menu, {
67
- children: colorScaleList
68
- })]
69
- })
70
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactBootstrap.ButtonGroup, {
71
- children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactBootstrap.InputGroup, {
72
- children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactBootstrap.InputGroup.Text, {
73
- children: "Standard scale"
74
- }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_Dropdown.default, {
75
- children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_Dropdown.default.Toggle, {
76
- id: "dropdownStandardScale",
77
- variant: "light",
78
- children: dataset.controls.scale.dotplot.name
79
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Dropdown.default.Menu, {
80
- children: standardScaleList
81
- })]
82
- })]
83
- })
84
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactBootstrap.ButtonGroup, {
85
- children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactBootstrap.ToggleButton, {
86
- id: "toggleMeanOnlyExpressed",
87
- type: "checkbox",
88
- variant: "outline-primary",
89
- checked: dataset.controls.meanOnlyExpressed,
90
- onChange: () => {
91
- dispatch({
92
- type: "set.controls.meanOnlyExpressed",
93
- meanOnlyExpressed: !dataset.controls.meanOnlyExpressed
94
- });
95
- },
96
- children: "Average only above cutoff"
97
- })
98
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactBootstrap.Form, {
99
- onSubmit: e => {
100
- e.preventDefault();
101
- dispatch({
102
- type: "set.controls.expressionCutoff",
103
- expressionCutoff: parseFloat(controls.expressionCutoff)
104
- });
105
- },
106
- children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactBootstrap.InputGroup, {
107
- children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactBootstrap.InputGroup.Text, {
108
- children: "Expression Cutoff"
109
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactBootstrap.Form.Control, {
110
- size: "sm",
111
- type: "number",
112
- step: "0.1",
113
- min: 0.0,
114
- value: controls.expressionCutoff,
115
- onChange: e => {
116
- setControls({
117
- ...controls,
118
- expressionCutoff: e.target.value
119
- });
120
- }
121
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactBootstrap.Button, {
122
- type: "submit",
123
- variant: "outline-primary",
124
- children: "Apply"
125
- })]
126
- })
127
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactBootstrap.Form, {
128
- onSubmit: e => {
129
- e.preventDefault();
130
- dispatch({
131
- type: "set.controls.colorAxis.crange",
132
- cmin: controls.colorAxis.cmin,
133
- cmax: controls.colorAxis.cmax
134
- });
135
- },
136
- children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactBootstrap.InputGroup, {
137
- children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactBootstrap.InputGroup.Text, {
138
- children: "Colorscale"
139
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactBootstrap.InputGroup.Text, {
140
- children: "min"
141
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactBootstrap.Form.Control, {
142
- name: "scaleMin",
143
- size: "sm",
144
- type: "number",
145
- value: controls.colorAxis.cmin,
146
- step: 0.1,
147
- min: Math.min(dataset.controls.colorAxis.dmin, 0.0),
148
- max: dataset.controls.colorAxis.dmax,
149
- onChange: e => {
150
- setControls({
151
- ...controls,
152
- colorAxis: {
153
- ...controls.colorAxis,
154
- cmin: e.target.value
155
- }
156
- });
157
- }
158
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactBootstrap.InputGroup.Text, {
159
- children: "max"
160
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactBootstrap.Form.Control, {
161
- name: "scaleMax",
162
- size: "sm",
163
- type: "number",
164
- value: controls.colorAxis.cmax,
165
- step: 0.1,
166
- min: controls.colorAxis.cmin,
167
- max: dataset.controls.colorAxis.dmax,
168
- onChange: e => {
169
- if (parseFloat(e.target.value) > dataset.controls.colorAxis.dmax) {
170
- e.target.value = dataset.controls.colorAxis.dmax.toFixed(1);
171
- }
172
- setControls({
173
- ...controls,
174
- colorAxis: {
175
- ...controls.colorAxis,
176
- cmax: e.target.value
177
- }
178
- });
179
- }
180
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactBootstrap.Button, {
181
- type: "submit",
182
- variant: "outline-primary",
183
- children: "Apply"
184
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactBootstrap.Button, {
185
- variant: "outline-primary",
186
- onClick: () => {
187
- dispatch({
188
- type: "set.controls.colorAxis.crange",
189
- cmin: dataset.controls.colorAxis.dmin,
190
- cmax: dataset.controls.colorAxis.dmax
191
- });
192
- },
193
- children: "Autoscale"
194
- })]
195
- })
196
- })]
197
- });
56
+ }
57
+ }, scale.name));
58
+ return /*#__PURE__*/_react.default.createElement(_reactBootstrap.ButtonToolbar, null, /*#__PURE__*/_react.default.createElement(_reactBootstrap.ButtonGroup, null, /*#__PURE__*/_react.default.createElement(_Dropdown.default, null, /*#__PURE__*/_react.default.createElement(_Dropdown.default.Toggle, {
59
+ id: "dropdownColorscale",
60
+ variant: "light"
61
+ }, dataset.controls.colorScale), /*#__PURE__*/_react.default.createElement(_Dropdown.default.Menu, null, colorScaleList))), /*#__PURE__*/_react.default.createElement(_reactBootstrap.ButtonGroup, null, /*#__PURE__*/_react.default.createElement(_reactBootstrap.InputGroup, null, /*#__PURE__*/_react.default.createElement(_reactBootstrap.InputGroup.Text, null, "Standard scale"), /*#__PURE__*/_react.default.createElement(_Dropdown.default, null, /*#__PURE__*/_react.default.createElement(_Dropdown.default.Toggle, {
62
+ id: "dropdownStandardScale",
63
+ variant: "light"
64
+ }, dataset.controls.scale.dotplot.name), /*#__PURE__*/_react.default.createElement(_Dropdown.default.Menu, null, standardScaleList)))), /*#__PURE__*/_react.default.createElement(_reactBootstrap.ButtonGroup, null, /*#__PURE__*/_react.default.createElement(_reactBootstrap.ToggleButton, {
65
+ id: "toggleMeanOnlyExpressed",
66
+ type: "checkbox",
67
+ variant: "outline-primary",
68
+ checked: dataset.controls.meanOnlyExpressed,
69
+ onChange: () => {
70
+ dispatch({
71
+ type: "set.controls.meanOnlyExpressed",
72
+ meanOnlyExpressed: !dataset.controls.meanOnlyExpressed
73
+ });
74
+ }
75
+ }, "Average only above cutoff")), /*#__PURE__*/_react.default.createElement(_reactBootstrap.Form, {
76
+ onSubmit: e => {
77
+ e.preventDefault();
78
+ dispatch({
79
+ type: "set.controls.expressionCutoff",
80
+ expressionCutoff: parseFloat(controls.expressionCutoff)
81
+ });
82
+ }
83
+ }, /*#__PURE__*/_react.default.createElement(_reactBootstrap.InputGroup, null, /*#__PURE__*/_react.default.createElement(_reactBootstrap.InputGroup.Text, null, "Expression Cutoff"), /*#__PURE__*/_react.default.createElement(_reactBootstrap.Form.Control, {
84
+ size: "sm",
85
+ type: "number",
86
+ step: "0.1",
87
+ min: 0.0,
88
+ value: controls.expressionCutoff,
89
+ onChange: e => {
90
+ setControls({
91
+ ...controls,
92
+ expressionCutoff: e.target.value
93
+ });
94
+ }
95
+ }), /*#__PURE__*/_react.default.createElement(_reactBootstrap.Button, {
96
+ type: "submit",
97
+ variant: "outline-primary"
98
+ }, "Apply"))), /*#__PURE__*/_react.default.createElement(_reactBootstrap.Form, {
99
+ onSubmit: e => {
100
+ e.preventDefault();
101
+ dispatch({
102
+ type: "set.controls.colorAxis.crange",
103
+ cmin: controls.colorAxis.cmin,
104
+ cmax: controls.colorAxis.cmax
105
+ });
106
+ }
107
+ }, /*#__PURE__*/_react.default.createElement(_reactBootstrap.InputGroup, null, /*#__PURE__*/_react.default.createElement(_reactBootstrap.InputGroup.Text, null, "Colorscale"), /*#__PURE__*/_react.default.createElement(_reactBootstrap.InputGroup.Text, null, "min"), /*#__PURE__*/_react.default.createElement(_reactBootstrap.Form.Control, {
108
+ name: "scaleMin",
109
+ size: "sm",
110
+ type: "number",
111
+ value: controls.colorAxis.cmin,
112
+ step: 0.1,
113
+ min: Math.min(dataset.controls.colorAxis.dmin, 0.0),
114
+ max: dataset.controls.colorAxis.dmax,
115
+ onChange: e => {
116
+ setControls({
117
+ ...controls,
118
+ colorAxis: {
119
+ ...controls.colorAxis,
120
+ cmin: e.target.value
121
+ }
122
+ });
123
+ }
124
+ }), /*#__PURE__*/_react.default.createElement(_reactBootstrap.InputGroup.Text, null, "max"), /*#__PURE__*/_react.default.createElement(_reactBootstrap.Form.Control, {
125
+ name: "scaleMax",
126
+ size: "sm",
127
+ type: "number",
128
+ value: controls.colorAxis.cmax,
129
+ step: 0.1,
130
+ min: controls.colorAxis.cmin,
131
+ max: dataset.controls.colorAxis.dmax,
132
+ onChange: e => {
133
+ if (parseFloat(e.target.value) > dataset.controls.colorAxis.dmax) {
134
+ e.target.value = dataset.controls.colorAxis.dmax.toFixed(1);
135
+ }
136
+ setControls({
137
+ ...controls,
138
+ colorAxis: {
139
+ ...controls.colorAxis,
140
+ cmax: e.target.value
141
+ }
142
+ });
143
+ }
144
+ }), /*#__PURE__*/_react.default.createElement(_reactBootstrap.Button, {
145
+ type: "submit",
146
+ variant: "outline-primary"
147
+ }, "Apply"), /*#__PURE__*/_react.default.createElement(_reactBootstrap.Button, {
148
+ variant: "outline-primary",
149
+ onClick: () => {
150
+ dispatch({
151
+ type: "set.controls.colorAxis.crange",
152
+ cmin: dataset.controls.colorAxis.dmin,
153
+ cmax: dataset.controls.colorAxis.dmax
154
+ });
155
+ }
156
+ }, "Autoscale"))));
198
157
  }
package/dist/components/full-page/FullPage.js CHANGED
@@ -22,15 +22,14 @@ var _ScatterplotControls = require("../scatterplot/ScatterplotControls");
22
22
  var _SearchBar = require("../search-bar/SearchBar");
23
23
  var _VarList = require("../var-list/VarList");
24
24
  var _Violin = require("../violin/Violin");
25
- var _jsxRuntime = require("react/jsx-runtime");
26
25
  function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
27
26
  function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
28
- function FullPage(_ref) {
29
- let {
30
- children,
31
- varMode = _constants.SELECTION_MODES.SINGLE,
32
- ...props
33
- } = _ref;
27
+ function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
28
+ function FullPage({
29
+ children,
30
+ varMode = _constants.SELECTION_MODES.SINGLE,
31
+ ...props
32
+ }) {
34
33
  const targetRef = (0, _react.useRef)();
35
34
  const [showObs, setShowObs] = (0, _react.useState)(false);
36
35
  const [showObsm, setShowObsm] = (0, _react.useState)(false);
@@ -61,155 +60,107 @@ function FullPage(_ref) {
61
60
  updateDimensions(); // Initial update
62
61
  return () => window.removeEventListener("resize", updateDimensions);
63
62
  }, []);
64
- return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
63
+ return /*#__PURE__*/_react.default.createElement("div", {
65
64
  ref: targetRef,
66
65
  className: "cherita-app",
67
66
  style: {
68
67
  height: dimensions.height
69
- },
70
- children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_DatasetContext.DatasetProvider, {
71
- ...props,
72
- children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
73
- className: "row g-0",
74
- children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
75
- className: "cherita-app-obs",
76
- children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_ObsList.ObsColsList, {})
77
- }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
78
- className: "cherita-app-plot",
79
- children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
80
- className: "position-relative",
81
- children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactBootstrap.Navbar, {
82
- expand: "sm",
83
- bg: "primary",
84
- className: "cherita-navbar",
85
- children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
86
- className: "container-fluid",
87
- children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactBootstrap.Navbar.Toggle, {
88
- "aria-controls": "navbarScroll"
89
- }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactBootstrap.Navbar.Collapse, {
90
- id: "navbarScroll",
91
- children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactBootstrap.Nav, {
92
- className: "me-auto my-0",
93
- navbarScroll: true,
94
- children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactBootstrap.Nav.Item, {
95
- className: "d-block d-lg-none",
96
- children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactBootstrap.Nav.Link, {
97
- onClick: () => setShowObs(true),
98
- children: "Observations"
99
- })
100
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactBootstrap.Nav.Item, {
101
- children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactBootstrap.Nav.Link, {
102
- onClick: () => setShowVars(true),
103
- children: "Features"
104
- })
105
- })]
106
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactBootstrap.Nav, {
107
- className: "d-flex",
108
- children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactBootstrap.Nav.Item, {
109
- children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactBootstrap.Nav.Link, {
110
- onClick: () => setShowControls(true),
111
- children: "Controls"
112
- })
113
- })
114
- })]
115
- })]
116
- })
117
- })
118
- }), children]
119
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
120
- className: "cherita-app-var",
121
- children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactBootstrap.Card, {
122
- className: "cherita-app-features",
123
- children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactBootstrap.Card.Body, {
124
- children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_SearchBar.SearchBar, {
125
- searchDiseases: true,
126
- searchVar: true
127
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_VarList.VarNamesList, {
128
- mode: varMode
129
- })]
130
- })
131
- })
132
- }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
133
- className: "col",
134
- children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_offcanvas.OffcanvasObs, {
135
- show: showObs,
136
- handleClose: () => setShowObs(false)
137
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_offcanvas.OffcanvasVars, {
138
- show: showVars,
139
- handleClose: () => setShowVars(false)
140
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_offcanvas.OffcanvasControls, {
141
- show: showControls,
142
- handleClose: () => setShowControls(false),
143
- Controls: _ScatterplotControls.ScatterplotControls
144
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_offcanvas.OffcanvasObsm, {
145
- show: showObsm,
146
- handleClose: () => setShowObsm(false)
147
- })]
148
- })]
149
- })
150
- })
151
- });
68
+ }
69
+ }, /*#__PURE__*/_react.default.createElement(_DatasetContext.DatasetProvider, props, /*#__PURE__*/_react.default.createElement("div", {
70
+ className: "row g-0"
71
+ }, /*#__PURE__*/_react.default.createElement("div", {
72
+ className: "cherita-app-obs"
73
+ }, /*#__PURE__*/_react.default.createElement(_ObsList.ObsColsList, null)), /*#__PURE__*/_react.default.createElement("div", {
74
+ className: "cherita-app-plot"
75
+ }, /*#__PURE__*/_react.default.createElement("div", {
76
+ className: "position-relative"
77
+ }, /*#__PURE__*/_react.default.createElement(_reactBootstrap.Navbar, {
78
+ expand: "sm",
79
+ bg: "primary",
80
+ className: "cherita-navbar"
81
+ }, /*#__PURE__*/_react.default.createElement("div", {
82
+ className: "container-fluid"
83
+ }, /*#__PURE__*/_react.default.createElement(_reactBootstrap.Navbar.Toggle, {
84
+ "aria-controls": "navbarScroll"
85
+ }), /*#__PURE__*/_react.default.createElement(_reactBootstrap.Navbar.Collapse, {
86
+ id: "navbarScroll"
87
+ }, /*#__PURE__*/_react.default.createElement(_reactBootstrap.Nav, {
88
+ className: "me-auto my-0",
89
+ navbarScroll: true
90
+ }, /*#__PURE__*/_react.default.createElement(_reactBootstrap.Nav.Item, {
91
+ className: "d-block d-lg-none"
92
+ }, /*#__PURE__*/_react.default.createElement(_reactBootstrap.Nav.Link, {
93
+ onClick: () => setShowObs(true)
94
+ }, "Observations")), /*#__PURE__*/_react.default.createElement(_reactBootstrap.Nav.Item, null, /*#__PURE__*/_react.default.createElement(_reactBootstrap.Nav.Link, {
95
+ onClick: () => setShowVars(true)
96
+ }, "Features"))), /*#__PURE__*/_react.default.createElement(_reactBootstrap.Nav, {
97
+ className: "d-flex"
98
+ }, /*#__PURE__*/_react.default.createElement(_reactBootstrap.Nav.Item, null, /*#__PURE__*/_react.default.createElement(_reactBootstrap.Nav.Link, {
99
+ onClick: () => setShowControls(true)
100
+ }, "Controls"))))))), children), /*#__PURE__*/_react.default.createElement("div", {
101
+ className: "cherita-app-var"
102
+ }, /*#__PURE__*/_react.default.createElement(_reactBootstrap.Card, {
103
+ className: "cherita-app-features"
104
+ }, /*#__PURE__*/_react.default.createElement(_reactBootstrap.Card.Body, null, /*#__PURE__*/_react.default.createElement(_SearchBar.SearchBar, {
105
+ searchDiseases: true,
106
+ searchVar: true
107
+ }), /*#__PURE__*/_react.default.createElement(_VarList.VarNamesList, {
108
+ mode: varMode
109
+ })))), /*#__PURE__*/_react.default.createElement("div", {
110
+ className: "col"
111
+ }, /*#__PURE__*/_react.default.createElement(_offcanvas.OffcanvasObs, {
112
+ show: showObs,
113
+ handleClose: () => setShowObs(false)
114
+ }), /*#__PURE__*/_react.default.createElement(_offcanvas.OffcanvasVars, {
115
+ show: showVars,
116
+ handleClose: () => setShowVars(false)
117
+ }), /*#__PURE__*/_react.default.createElement(_offcanvas.OffcanvasControls, {
118
+ show: showControls,
119
+ handleClose: () => setShowControls(false),
120
+ Controls: _ScatterplotControls.ScatterplotControls
121
+ }), /*#__PURE__*/_react.default.createElement(_offcanvas.OffcanvasObsm, {
122
+ show: showObsm,
123
+ handleClose: () => setShowObsm(false)
124
+ })))));
152
125
  }
153
126
  function FullPageScatterplot(props) {
154
- return /*#__PURE__*/(0, _jsxRuntime.jsx)(FullPage, {
155
- ...props,
156
- children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Scatterplot.Scatterplot, {})
157
- });
127
+ return /*#__PURE__*/_react.default.createElement(FullPage, props, /*#__PURE__*/_react.default.createElement(_Scatterplot.Scatterplot, null));
158
128
  }
159
129
  function FullPagePseudospatial(props) {
160
- return /*#__PURE__*/(0, _jsxRuntime.jsx)(FullPage, {
161
- ...props,
162
- children: /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
163
- className: "container-fluid h-100",
164
- children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
165
- className: "row",
166
- children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
167
- className: "col-12 col-lg-7",
168
- children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Scatterplot.Scatterplot, {})
169
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
170
- className: "col-12 col-lg-5",
171
- children: /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
172
- className: "container-fluid h-100 d-flex align-itemms-center justify-content-center",
173
- children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
174
- className: "row w-100 py-3",
175
- children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
176
- className: "col-12",
177
- children: /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
178
- className: "p-2",
179
- children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Pseudospatial.Pseudospatial, {})
180
- })
181
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
182
- className: "col-12",
183
- children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Pseudospatial.PseudospatialImage, {})
184
- })]
185
- })
186
- })
187
- })]
188
- })
189
- })
190
- });
130
+ return /*#__PURE__*/_react.default.createElement(FullPage, props, /*#__PURE__*/_react.default.createElement("div", {
131
+ className: "container-fluid h-100"
132
+ }, /*#__PURE__*/_react.default.createElement("div", {
133
+ className: "row"
134
+ }, /*#__PURE__*/_react.default.createElement("div", {
135
+ className: "col-12 col-lg-7"
136
+ }, /*#__PURE__*/_react.default.createElement(_Scatterplot.Scatterplot, null)), /*#__PURE__*/_react.default.createElement("div", {
137
+ className: "col-12 col-lg-5"
138
+ }, /*#__PURE__*/_react.default.createElement("div", {
139
+ className: "container-fluid h-100 d-flex align-itemms-center justify-content-center"
140
+ }, /*#__PURE__*/_react.default.createElement("div", {
141
+ className: "row w-100 py-3"
142
+ }, /*#__PURE__*/_react.default.createElement("div", {
143
+ className: "col-12"
144
+ }, /*#__PURE__*/_react.default.createElement("div", {
145
+ className: "p-2"
146
+ }, /*#__PURE__*/_react.default.createElement(_Pseudospatial.Pseudospatial, null))), /*#__PURE__*/_react.default.createElement("div", {
147
+ className: "col-12"
148
+ }, /*#__PURE__*/_react.default.createElement(_Pseudospatial.PseudospatialImage, null))))))));
191
149
  }
192
150
  function FullPagePlots(props) {
193
- return /*#__PURE__*/(0, _jsxRuntime.jsx)(FullPage, {
194
- ...props,
195
- varMode: _constants.SELECTION_MODES.MULTIPLE,
196
- children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
197
- className: "container-fluid w-100 h-100 d-flex flex-column overflow-y-auto",
198
- children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
199
- className: "row flex-grow-1",
200
- children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Heatmap.Heatmap, {})
201
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
202
- className: "row flex-grow-1",
203
- children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Matrixplot.Matrixplot, {})
204
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
205
- className: "row flex-grow-1",
206
- children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Dotplot.Dotplot, {})
207
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
208
- className: "row flex-grow-1",
209
- children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Violin.Violin, {
210
- mode: _constants.VIOLIN_MODES.GROUPBY
211
- })
212
- })]
213
- })
214
- });
151
+ return /*#__PURE__*/_react.default.createElement(FullPage, _extends({}, props, {
152
+ varMode: _constants.SELECTION_MODES.MULTIPLE
153
+ }), /*#__PURE__*/_react.default.createElement("div", {
154
+ className: "container-fluid w-100 h-100 d-flex flex-column overflow-y-auto"
155
+ }, /*#__PURE__*/_react.default.createElement("div", {
156
+ className: "row flex-grow-1"
157
+ }, /*#__PURE__*/_react.default.createElement(_Heatmap.Heatmap, null)), /*#__PURE__*/_react.default.createElement("div", {
158
+ className: "row flex-grow-1"
159
+ }, /*#__PURE__*/_react.default.createElement(_Matrixplot.Matrixplot, null)), /*#__PURE__*/_react.default.createElement("div", {
160
+ className: "row flex-grow-1"
161
+ }, /*#__PURE__*/_react.default.createElement(_Dotplot.Dotplot, null)), /*#__PURE__*/_react.default.createElement("div", {
162
+ className: "row flex-grow-1"
163
+ }, /*#__PURE__*/_react.default.createElement(_Violin.Violin, {
164
+ mode: _constants.VIOLIN_MODES.GROUPBY
165
+ }))));
215
166
  }