@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.
- package/README.md +5 -0
- package/dist/components/dotplot/Dotplot.js +19 -26
- package/dist/components/dotplot/DotplotControls.js +106 -147
- package/dist/components/full-page/FullPage.js +99 -148
- package/dist/components/heatmap/Heatmap.js +19 -26
- package/dist/components/heatmap/HeatmapControls.js +7 -13
- package/dist/components/matrixplot/Matrixplot.js +19 -26
- package/dist/components/matrixplot/MatrixplotControls.js +14 -35
- package/dist/components/obs-list/ObsItem.js +182 -239
- package/dist/components/obs-list/ObsList.js +40 -49
- package/dist/components/obs-list/ObsToolbar.js +44 -55
- package/dist/components/obsm-list/ObsmList.js +15 -23
- package/dist/components/offcanvas/index.js +45 -75
- package/dist/components/pseudospatial/Pseudospatial.js +26 -34
- package/dist/components/pseudospatial/PseudospatialControls.js +1 -2
- package/dist/components/pseudospatial/PseudospatialToolbar.js +37 -65
- package/dist/components/scatterplot/Scatterplot.js +74 -89
- package/dist/components/scatterplot/ScatterplotControls.js +28 -39
- package/dist/components/scatterplot/SpatialControls.js +94 -117
- package/dist/components/scatterplot/Toolbox.js +16 -24
- package/dist/components/search-bar/SearchBar.js +45 -54
- package/dist/components/search-bar/SearchResults.js +36 -49
- package/dist/components/var-list/VarItem.js +112 -160
- package/dist/components/var-list/VarList.js +81 -124
- package/dist/components/var-list/VarListToolbar.js +48 -59
- package/dist/components/var-list/VarSet.js +95 -120
- package/dist/components/violin/Violin.js +31 -46
- package/dist/components/violin/ViolinControls.js +8 -22
- package/dist/context/DatasetContext.js +17 -27
- package/dist/context/FilterContext.js +8 -12
- package/dist/context/ZarrDataContext.js +6 -9
- package/dist/helpers/color-helper.js +11 -12
- package/dist/helpers/map-helper.js +7 -8
- package/dist/helpers/zarr-helper.js +9 -15
- package/dist/utils/Histogram.js +34 -41
- package/dist/utils/ImageViewer.js +9 -14
- package/dist/utils/Legend.js +30 -40
- package/dist/utils/LoadingIndicators.js +16 -19
- package/dist/utils/VirtualizedList.js +32 -39
- package/dist/utils/requests.js +15 -25
- package/dist/utils/string.js +4 -9
- package/dist/utils/zarrData.js +2 -8
- package/package.json +40 -34
|
@@ -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; }
|
|
@@ -90,32 +89,26 @@ function Heatmap() {
|
|
|
90
89
|
}, [dataset.controls.colorScale, updateColorscale]);
|
|
91
90
|
if (!serverError) {
|
|
92
91
|
if (hasSelections) {
|
|
93
|
-
return /*#__PURE__*/
|
|
94
|
-
className: "cherita-heatmap position-relative"
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
});
|
|
92
|
+
return /*#__PURE__*/_react.default.createElement("div", {
|
|
93
|
+
className: "cherita-heatmap position-relative"
|
|
94
|
+
}, isPending && /*#__PURE__*/_react.default.createElement(_LoadingIndicators.LoadingSpinner, null), /*#__PURE__*/_react.default.createElement(_reactPlotly.default, {
|
|
95
|
+
data: data,
|
|
96
|
+
layout: layout,
|
|
97
|
+
useResizeHandler: true,
|
|
98
|
+
style: {
|
|
99
|
+
maxWidth: "100%",
|
|
100
|
+
maxHeight: "100%"
|
|
101
|
+
}
|
|
102
|
+
}));
|
|
105
103
|
}
|
|
106
|
-
return /*#__PURE__*/
|
|
107
|
-
className: "cherita-heatmap"
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
})
|
|
112
|
-
});
|
|
104
|
+
return /*#__PURE__*/_react.default.createElement("div", {
|
|
105
|
+
className: "cherita-heatmap"
|
|
106
|
+
}, /*#__PURE__*/_react.default.createElement(_reactBootstrap.Alert, {
|
|
107
|
+
variant: "light"
|
|
108
|
+
}, "Select features and a category"));
|
|
113
109
|
} else {
|
|
114
|
-
return /*#__PURE__*/
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
children: serverError.message
|
|
118
|
-
})
|
|
119
|
-
});
|
|
110
|
+
return /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement(_reactBootstrap.Alert, {
|
|
111
|
+
variant: "danger"
|
|
112
|
+
}, serverError.message));
|
|
120
113
|
}
|
|
121
114
|
}
|
|
@@ -9,28 +9,22 @@ var _lodash = _interopRequireDefault(require("lodash"));
|
|
|
9
9
|
var _reactBootstrap = require("react-bootstrap");
|
|
10
10
|
var _colorscales = require("../../constants/colorscales");
|
|
11
11
|
var _DatasetContext = require("../../context/DatasetContext");
|
|
12
|
-
var _jsxRuntime = require("react/jsx-runtime");
|
|
13
12
|
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
|
|
14
13
|
function HeatmapControls() {
|
|
15
14
|
const dataset = (0, _DatasetContext.useDataset)();
|
|
16
15
|
const dispatch = (0, _DatasetContext.useDatasetDispatch)();
|
|
17
|
-
const colormapList = _lodash.default.keys(_colorscales.COLORSCALES).map(key => /*#__PURE__*/
|
|
16
|
+
const colormapList = _lodash.default.keys(_colorscales.COLORSCALES).map(key => /*#__PURE__*/_react.default.createElement(_reactBootstrap.Dropdown.Item, {
|
|
17
|
+
key: key,
|
|
18
18
|
active: dataset.controls.colorScale === key,
|
|
19
19
|
onClick: () => {
|
|
20
20
|
dispatch({
|
|
21
21
|
type: "set.controls.colorScale",
|
|
22
22
|
colorScale: key
|
|
23
23
|
});
|
|
24
|
-
}
|
|
25
|
-
children: key
|
|
24
|
+
}
|
|
26
25
|
}, key));
|
|
27
|
-
return /*#__PURE__*/(
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
children: dataset.controls.colorScale
|
|
32
|
-
}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactBootstrap.Dropdown.Menu, {
|
|
33
|
-
children: colormapList
|
|
34
|
-
})]
|
|
35
|
-
});
|
|
26
|
+
return /*#__PURE__*/_react.default.createElement(_reactBootstrap.Dropdown, null, /*#__PURE__*/_react.default.createElement(_reactBootstrap.Dropdown.Toggle, {
|
|
27
|
+
id: "dropdownColorscale",
|
|
28
|
+
variant: "light"
|
|
29
|
+
}, dataset.controls.colorScale), /*#__PURE__*/_react.default.createElement(_reactBootstrap.Dropdown.Menu, null, colormapList));
|
|
36
30
|
}
|
|
@@ -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; }
|
|
@@ -92,32 +91,26 @@ function Matrixplot() {
|
|
|
92
91
|
}, [dataset.controls.colorScale, updateColorscale]);
|
|
93
92
|
if (!serverError) {
|
|
94
93
|
if (hasSelections) {
|
|
95
|
-
return /*#__PURE__*/
|
|
96
|
-
className: "cherita-matrixplot position-relative"
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
});
|
|
94
|
+
return /*#__PURE__*/_react.default.createElement("div", {
|
|
95
|
+
className: "cherita-matrixplot position-relative"
|
|
96
|
+
}, isPending && /*#__PURE__*/_react.default.createElement(_LoadingIndicators.LoadingSpinner, null), /*#__PURE__*/_react.default.createElement(_reactPlotly.default, {
|
|
97
|
+
data: data,
|
|
98
|
+
layout: layout,
|
|
99
|
+
useResizeHandler: true,
|
|
100
|
+
style: {
|
|
101
|
+
maxWidth: "100%",
|
|
102
|
+
maxHeight: "100%"
|
|
103
|
+
}
|
|
104
|
+
}));
|
|
107
105
|
}
|
|
108
|
-
return /*#__PURE__*/
|
|
109
|
-
className: "cherita-matrixplot"
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
})
|
|
114
|
-
});
|
|
106
|
+
return /*#__PURE__*/_react.default.createElement("div", {
|
|
107
|
+
className: "cherita-matrixplot"
|
|
108
|
+
}, /*#__PURE__*/_react.default.createElement(_reactBootstrap.Alert, {
|
|
109
|
+
variant: "light"
|
|
110
|
+
}, "Select features and a category"));
|
|
115
111
|
} else {
|
|
116
|
-
return /*#__PURE__*/
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
children: serverError.message
|
|
120
|
-
})
|
|
121
|
-
});
|
|
112
|
+
return /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement(_reactBootstrap.Alert, {
|
|
113
|
+
variant: "danger"
|
|
114
|
+
}, serverError.message));
|
|
122
115
|
}
|
|
123
116
|
}
|
|
@@ -10,22 +10,22 @@ var _reactBootstrap = require("react-bootstrap");
|
|
|
10
10
|
var _colorscales = require("../../constants/colorscales");
|
|
11
11
|
var _constants = require("../../constants/constants");
|
|
12
12
|
var _DatasetContext = require("../../context/DatasetContext");
|
|
13
|
-
var _jsxRuntime = require("react/jsx-runtime");
|
|
14
13
|
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
|
|
15
14
|
function MatrixplotControls() {
|
|
16
15
|
const dataset = (0, _DatasetContext.useDataset)();
|
|
17
16
|
const dispatch = (0, _DatasetContext.useDatasetDispatch)();
|
|
18
|
-
const colorScaleList = _lodash.default.keys(_colorscales.COLORSCALES).map(key => /*#__PURE__*/
|
|
17
|
+
const colorScaleList = _lodash.default.keys(_colorscales.COLORSCALES).map(key => /*#__PURE__*/_react.default.createElement(_reactBootstrap.Dropdown.Item, {
|
|
18
|
+
key: key,
|
|
19
19
|
active: dataset.controls.colorScale === key,
|
|
20
20
|
onClick: () => {
|
|
21
21
|
dispatch({
|
|
22
22
|
type: "set.controls.colorScale",
|
|
23
23
|
colorScale: key
|
|
24
24
|
});
|
|
25
|
-
}
|
|
26
|
-
children: key
|
|
25
|
+
}
|
|
27
26
|
}, key));
|
|
28
|
-
const standardScaleList = _lodash.default.values(_constants.MATRIXPLOT_SCALES).map(scale => /*#__PURE__*/
|
|
27
|
+
const standardScaleList = _lodash.default.values(_constants.MATRIXPLOT_SCALES).map(scale => /*#__PURE__*/_react.default.createElement(_reactBootstrap.Dropdown.Item, {
|
|
28
|
+
key: scale.value,
|
|
29
29
|
active: dataset.controls.scale.matrixplot.name === scale.name,
|
|
30
30
|
onClick: () => {
|
|
31
31
|
dispatch({
|
|
@@ -33,34 +33,13 @@ function MatrixplotControls() {
|
|
|
33
33
|
plot: "matrixplot",
|
|
34
34
|
scale: scale
|
|
35
35
|
});
|
|
36
|
-
}
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
children: dataset.controls.colorScale
|
|
46
|
-
}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactBootstrap.Dropdown.Menu, {
|
|
47
|
-
children: colorScaleList
|
|
48
|
-
})]
|
|
49
|
-
})
|
|
50
|
-
}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactBootstrap.ButtonGroup, {
|
|
51
|
-
children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactBootstrap.InputGroup, {
|
|
52
|
-
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactBootstrap.InputGroup.Text, {
|
|
53
|
-
children: "Standard scale"
|
|
54
|
-
}), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactBootstrap.Dropdown, {
|
|
55
|
-
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactBootstrap.Dropdown.Toggle, {
|
|
56
|
-
id: "dropdownStandardScale",
|
|
57
|
-
variant: "light",
|
|
58
|
-
children: dataset.controls.scale.matrixplot.name
|
|
59
|
-
}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactBootstrap.Dropdown.Menu, {
|
|
60
|
-
children: standardScaleList
|
|
61
|
-
})]
|
|
62
|
-
})]
|
|
63
|
-
})
|
|
64
|
-
})]
|
|
65
|
-
});
|
|
36
|
+
}
|
|
37
|
+
}, scale.name));
|
|
38
|
+
return /*#__PURE__*/_react.default.createElement(_reactBootstrap.ButtonToolbar, null, /*#__PURE__*/_react.default.createElement(_reactBootstrap.ButtonGroup, null, /*#__PURE__*/_react.default.createElement(_reactBootstrap.Dropdown, null, /*#__PURE__*/_react.default.createElement(_reactBootstrap.Dropdown.Toggle, {
|
|
39
|
+
id: "dropdownColorscale",
|
|
40
|
+
variant: "light"
|
|
41
|
+
}, dataset.controls.colorScale), /*#__PURE__*/_react.default.createElement(_reactBootstrap.Dropdown.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(_reactBootstrap.Dropdown, null, /*#__PURE__*/_react.default.createElement(_reactBootstrap.Dropdown.Toggle, {
|
|
42
|
+
id: "dropdownStandardScale",
|
|
43
|
+
variant: "light"
|
|
44
|
+
}, dataset.controls.scale.matrixplot.name), /*#__PURE__*/_react.default.createElement(_reactBootstrap.Dropdown.Menu, null, standardScaleList)))));
|
|
66
45
|
}
|