@vitessce/scatterplot-gating 2.0.3 → 3.0.0

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.
@@ -0,0 +1,206 @@
1
+ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
+ import React, { useState, useEffect, useCallback, useMemo, } from 'react';
3
+ import plur from 'plur';
4
+ import { extent } from 'd3-array';
5
+ import { isEqual } from 'lodash-es';
6
+ import { capitalize, commaNumber, getCellColors, getValueTransformFunction, VALUE_TRANSFORM_OPTIONS, } from '@vitessce/utils';
7
+ import { TitleInfo, useDeckCanvasSize, useReady, useUrls, useUint8FeatureSelection, useExpressionValueGetter, useObsSetsData, useFeatureSelection, useObsFeatureMatrixIndices, useCoordination, useLoaders, useSetComponentHover, useSetComponentViewInfo, } from '@vitessce/vit-s';
8
+ import { getCellSetPolygons, mergeObsSets, setObsSelection } from '@vitessce/sets-utils';
9
+ import { Scatterplot, ScatterplotTooltipSubscriber, ScatterplotOptions, getPointSizeDevicePixels, getPointOpacity, EmptyMessage, } from '@vitessce/scatterplot';
10
+ import { ViewType, COMPONENT_COORDINATION_TYPES } from '@vitessce/constants-internal';
11
+ import GatingScatterplotOptions from './GatingScatterplotOptions.js';
12
+ /**
13
+ * A subscriber component for the gating scatterplot.
14
+ * @param {object} props
15
+ * @param {number} props.uuid The unique identifier for this component.
16
+ * @param {string} props.theme The current theme name.
17
+ * @param {object} props.coordinationScopes The mapping from coordination types to coordination
18
+ * scopes.
19
+ * @param {boolean} props.disableTooltip Should the tooltip be disabled?
20
+ * @param {function} props.removeGridComponent The callback function to pass to TitleInfo,
21
+ * to call when the component has been removed from the grid.
22
+ * @param {number} props.averageFillDensity Override the average fill density calculation
23
+ * when using dynamic opacity mode.
24
+ */
25
+ export function GatingSubscriber(props) {
26
+ const { uuid, coordinationScopes, removeGridComponent, theme, disableTooltip = false, title: titleOverride,
27
+ // Average fill density for dynamic opacity calculation.
28
+ averageFillDensity, } = props;
29
+ const loaders = useLoaders();
30
+ const setComponentHover = useSetComponentHover();
31
+ const setComponentViewInfo = useSetComponentViewInfo(uuid);
32
+ // Get "props" from the coordination space.
33
+ const [{ dataset, obsType, featureType, featureValueType, embeddingZoom: zoom, embeddingTargetX: targetX, embeddingTargetY: targetY, embeddingTargetZ: targetZ, obsFilter: cellFilter, obsHighlight: cellHighlight, obsSetSelection: cellSetSelection, obsSetColor: cellSetColor, obsColorEncoding: cellColorEncoding, additionalObsSets: additionalCellSets, embeddingObsSetPolygonsVisible: cellSetPolygonsVisible, embeddingObsSetLabelsVisible: cellSetLabelsVisible, embeddingObsSetLabelSize: cellSetLabelSize, embeddingObsRadius: cellRadiusFixed, embeddingObsRadiusMode: cellRadiusMode, embeddingObsOpacity: cellOpacityFixed, embeddingObsOpacityMode: cellOpacityMode, featureValueColormap: geneExpressionColormap, featureValueColormapRange: geneExpressionColormapRange, featureSelection: gatingFeatureSelectionColor, featureValueTransform, featureValueTransformCoefficient, gatingFeatureSelectionX, gatingFeatureSelectionY, }, { setEmbeddingZoom: setZoom, setEmbeddingTargetX: setTargetX, setEmbeddingTargetY: setTargetY, setEmbeddingTargetZ: setTargetZ, setObsFilter: setCellFilter, setObsSetSelection: setCellSetSelection, setObsHighlight: setCellHighlight, setObsSetColor: setCellSetColor, setObsColorEncoding: setCellColorEncoding, setAdditionalObsSets: setAdditionalCellSets, setEmbeddingObsSetPolygonsVisible: setCellSetPolygonsVisible, setEmbeddingObsSetLabelsVisible: setCellSetLabelsVisible, setEmbeddingObsSetLabelSize: setCellSetLabelSize, setEmbeddingObsRadius: setCellRadiusFixed, setEmbeddingObsRadiusMode: setCellRadiusMode, setEmbeddingObsOpacity: setCellOpacityFixed, setEmbeddingObsOpacityMode: setCellOpacityMode, setFeatureValueColormap: setGeneExpressionColormap, setFeatureValueColormapRange: setGeneExpressionColormapRange, setFeatureValueTransform, setFeatureValueTransformCoefficient, setGatingFeatureSelectionX, setGatingFeatureSelectionY, }] = useCoordination(COMPONENT_COORDINATION_TYPES[ViewType.GATING], coordinationScopes);
34
+ const [urls, addUrl] = useUrls(loaders, dataset);
35
+ const [width, height, deckRef] = useDeckCanvasSize();
36
+ const title = useMemo(() => {
37
+ if (titleOverride) {
38
+ return titleOverride;
39
+ }
40
+ if (!(gatingFeatureSelectionX && gatingFeatureSelectionY)) {
41
+ return 'Gating';
42
+ }
43
+ return `Gating (${gatingFeatureSelectionX} vs ${gatingFeatureSelectionY})`;
44
+ }, [titleOverride, gatingFeatureSelectionX, gatingFeatureSelectionY]);
45
+ const featureSelectionX = useMemo(() => (gatingFeatureSelectionX ? [gatingFeatureSelectionX] : null), [gatingFeatureSelectionX]);
46
+ const featureSelectionY = useMemo(() => (gatingFeatureSelectionY ? [gatingFeatureSelectionY] : null), [gatingFeatureSelectionY]);
47
+ // Get data from loaders using the data hooks.
48
+ const [{ obsSets: cellSets }, obsSetsStatus] = useObsSetsData(loaders, dataset, addUrl, false, { setObsSetSelection: setCellSetSelection, setObsSetColor: setCellSetColor }, { obsSetSelection: cellSetSelection, obsSetColor: cellSetColor }, { obsType });
49
+ // eslint-disable-next-line no-unused-vars
50
+ const [expressionDataColor, loadedColor, featureSelectionColorStatus] = useFeatureSelection(loaders, dataset, false, gatingFeatureSelectionColor, { obsType, featureType, featureValueType });
51
+ // eslint-disable-next-line no-unused-vars
52
+ const [expressionDataX, loadedX, featureSelectionXStatus] = useFeatureSelection(loaders, dataset, false, featureSelectionX, { obsType, featureType, featureValueType });
53
+ // eslint-disable-next-line no-unused-vars
54
+ const [expressionDataY, loadedY, featureSelectionYStatus] = useFeatureSelection(loaders, dataset, false, featureSelectionY, { obsType, featureType, featureValueType });
55
+ const [{ obsIndex, featureIndex }, matrixIndicesStatus] = useObsFeatureMatrixIndices(loaders, dataset, addUrl, false, { obsType, featureType, featureValueType });
56
+ const cellsCount = obsIndex?.length || 0;
57
+ const isReady = useReady([
58
+ obsSetsStatus,
59
+ featureSelectionColorStatus,
60
+ featureSelectionXStatus,
61
+ featureSelectionYStatus,
62
+ matrixIndicesStatus,
63
+ ]);
64
+ // Generate a new cells object with a mapping added for the user selected genes.
65
+ const obsXY = useMemo(() => {
66
+ if (!(cellsCount && expressionDataX?.[0] && expressionDataY?.[0]
67
+ && featureSelectionX && featureSelectionY)) {
68
+ return null;
69
+ }
70
+ // Get transform coefficient for log and arcsinh
71
+ let coefficient = 1;
72
+ const parsedTransformCoefficient = Number(featureValueTransformCoefficient);
73
+ if (!Number.isNaN(parsedTransformCoefficient) && parsedTransformCoefficient > 0) {
74
+ coefficient = parsedTransformCoefficient;
75
+ }
76
+ // Set transform function
77
+ const transformFunction = getValueTransformFunction(featureValueTransform, coefficient);
78
+ const obsX = new Float32Array(cellsCount);
79
+ const obsY = new Float32Array(cellsCount);
80
+ for (let i = 0; i < cellsCount; i += 1) {
81
+ obsX[i] = transformFunction(expressionDataX[0][i]);
82
+ obsY[i] = transformFunction(expressionDataY[0][i]);
83
+ }
84
+ return {
85
+ data: [obsX, obsY],
86
+ shape: [2, cellsCount],
87
+ };
88
+ }, [cellsCount, expressionDataX, expressionDataY,
89
+ featureValueTransform, featureValueTransformCoefficient,
90
+ featureSelectionX, featureSelectionY,
91
+ ]);
92
+ const [dynamicCellRadius, setDynamicCellRadius] = useState(cellRadiusFixed);
93
+ const [dynamicCellOpacity, setDynamicCellOpacity] = useState(cellOpacityFixed);
94
+ const mergedCellSets = useMemo(() => mergeObsSets(cellSets, additionalCellSets), [cellSets, additionalCellSets]);
95
+ const setCellSelectionProp = useCallback((v) => {
96
+ setObsSelection(v, additionalCellSets, cellSetColor, setCellSetSelection, setAdditionalCellSets, setCellSetColor, setCellColorEncoding);
97
+ }, [additionalCellSets, cellSetColor, setCellColorEncoding,
98
+ setAdditionalCellSets, setCellSetColor, setCellSetSelection]);
99
+ const cellColors = useMemo(() => getCellColors({
100
+ cellSets: mergedCellSets,
101
+ cellSetSelection,
102
+ cellSetColor,
103
+ obsIndex,
104
+ theme,
105
+ }), [mergedCellSets, theme,
106
+ cellSetSelection, cellSetColor, obsIndex]);
107
+ // cellSetPolygonCache is an array of tuples like [(key0, val0), (key1, val1), ...],
108
+ // where the keys are cellSetSelection arrays.
109
+ const [cellSetPolygonCache, setCellSetPolygonCache] = useState([]);
110
+ const cacheHas = (cache, key) => cache.findIndex(el => isEqual(el[0], key)) !== -1;
111
+ const cacheGet = (cache, key) => cache.find(el => isEqual(el[0], key))?.[1];
112
+ const cellSetPolygons = useMemo(() => {
113
+ if ((cellSetLabelsVisible || cellSetPolygonsVisible)
114
+ && !cacheHas(cellSetPolygonCache, cellSetSelection)
115
+ && mergedCellSets?.tree?.length
116
+ && obsXY
117
+ && obsIndex
118
+ && cellSetColor?.length) {
119
+ const newCellSetPolygons = getCellSetPolygons({
120
+ obsIndex,
121
+ obsEmbedding: obsXY,
122
+ cellSets: mergedCellSets,
123
+ cellSetSelection,
124
+ cellSetColor,
125
+ theme,
126
+ });
127
+ setCellSetPolygonCache(cache => [...cache, [cellSetSelection, newCellSetPolygons]]);
128
+ return newCellSetPolygons;
129
+ }
130
+ return cacheGet(cellSetPolygonCache, cellSetSelection) || [];
131
+ }, [cellSetPolygonsVisible, cellSetPolygonCache, cellSetLabelsVisible, theme,
132
+ obsIndex, obsXY, mergedCellSets, cellSetSelection, cellSetColor]);
133
+ const cellSelection = useMemo(() => Array.from(cellColors.keys()), [cellColors]);
134
+ const [xRange, yRange, xExtent, yExtent, numCells] = useMemo(() => {
135
+ if (obsXY && obsXY.data && obsXY.shape) {
136
+ const cellCount = obsXY.shape[1];
137
+ const xE = extent(obsXY.data[0]);
138
+ const yE = extent(obsXY.data[1]);
139
+ const xR = xE[1] - xE[0];
140
+ const yR = yE[1] - yE[0];
141
+ return [xR, yR, xE, yE, cellCount];
142
+ }
143
+ return [null, null, null, null, null];
144
+ }, [obsXY]);
145
+ // After cells have loaded or changed,
146
+ // compute the cell radius scale based on the
147
+ // extents of the cell coordinates on the x/y axes.
148
+ useEffect(() => {
149
+ if (xRange && yRange) {
150
+ const pointSizeDevicePixels = getPointSizeDevicePixels(window.devicePixelRatio, zoom, xRange, yRange, width, height);
151
+ setDynamicCellRadius(pointSizeDevicePixels);
152
+ const nextCellOpacityScale = getPointOpacity(zoom, xRange, yRange, width, height, numCells, averageFillDensity);
153
+ setDynamicCellOpacity(nextCellOpacityScale);
154
+ if (typeof targetX !== 'number' || typeof targetY !== 'number') {
155
+ const newTargetX = xExtent[0] + xRange / 2;
156
+ const newTargetY = yExtent[0] + yRange / 2;
157
+ const newZoom = Math.log2(Math.min(width / xRange, height / yRange));
158
+ setTargetX(newTargetX);
159
+ // Graphics rendering has the y-axis going south so we need to multiply by negative one.
160
+ setTargetY(-newTargetY);
161
+ setZoom(newZoom);
162
+ }
163
+ }
164
+ // eslint-disable-next-line react-hooks/exhaustive-deps
165
+ }, [xRange, yRange, xExtent, yExtent, numCells,
166
+ width, height, zoom, averageFillDensity]);
167
+ const cellSelectionSet = useMemo(() => new Set(cellSelection), [cellSelection]);
168
+ const getCellIsSelected = useCallback((object, { index }) => ((cellSelectionSet || new Set([])).has(obsIndex[index]) ? 1.0 : 0.0), [cellSelectionSet, obsIndex]);
169
+ const cellRadius = (cellRadiusMode === 'manual' ? cellRadiusFixed : dynamicCellRadius);
170
+ const cellOpacity = (cellOpacityMode === 'manual' ? cellOpacityFixed : dynamicCellOpacity);
171
+ const [uint8ExpressionData] = useUint8FeatureSelection(expressionDataColor);
172
+ // Set up a getter function for gene expression values, to be used
173
+ // by the DeckGL layer to obtain values for instanced attributes.
174
+ const getExpressionValue = useExpressionValueGetter({
175
+ instanceObsIndex: obsIndex,
176
+ matrixObsIndex: obsIndex,
177
+ expressionData: uint8ExpressionData,
178
+ });
179
+ // Puts the mapping values in the cell info tooltip.
180
+ const getObsInfo = useCallback((obsId) => {
181
+ const selectedTransformName = VALUE_TRANSFORM_OPTIONS.find(o => o.value === featureValueTransform)?.name;
182
+ const genePrefix = featureValueTransform ? `${selectedTransformName} ` : '';
183
+ const obsIdx = obsIndex?.indexOf(obsId);
184
+ const obsInfo = { [`${capitalize(obsType)} ID`]: obsId };
185
+ if (gatingFeatureSelectionX && gatingFeatureSelectionY) {
186
+ obsInfo[genePrefix + gatingFeatureSelectionX] = obsXY.data[0][obsIdx];
187
+ obsInfo[genePrefix + gatingFeatureSelectionY] = obsXY.data[1][obsIdx];
188
+ }
189
+ return obsInfo;
190
+ }, [obsXY, obsIndex, featureValueTransform,
191
+ gatingFeatureSelectionX, gatingFeatureSelectionY, obsType,
192
+ ]);
193
+ return (_jsxs(TitleInfo, { title: title, info: `${commaNumber(cellsCount)} ${plur(obsType, cellsCount)}`, removeGridComponent: removeGridComponent, urls: urls, theme: theme, isReady: isReady, options: (_jsx(ScatterplotOptions, { observationsLabel: obsType, cellRadius: cellRadiusFixed, setCellRadius: setCellRadiusFixed, cellRadiusMode: cellRadiusMode, setCellRadiusMode: setCellRadiusMode, cellOpacity: cellOpacityFixed, setCellOpacity: setCellOpacityFixed, cellOpacityMode: cellOpacityMode, setCellOpacityMode: setCellOpacityMode, cellSetLabelsVisible: cellSetLabelsVisible, setCellSetLabelsVisible: setCellSetLabelsVisible, cellSetLabelSize: cellSetLabelSize, setCellSetLabelSize: setCellSetLabelSize, cellSetPolygonsVisible: cellSetPolygonsVisible, setCellSetPolygonsVisible: setCellSetPolygonsVisible, cellColorEncoding: cellColorEncoding, setCellColorEncoding: setCellColorEncoding, geneExpressionColormap: geneExpressionColormap, setGeneExpressionColormap: setGeneExpressionColormap, geneExpressionColormapRange: geneExpressionColormapRange, setGeneExpressionColormapRange: setGeneExpressionColormapRange, children: _jsx(GatingScatterplotOptions, { featureType: featureType, gatingFeatureSelectionX: gatingFeatureSelectionX, setGatingFeatureSelectionX: setGatingFeatureSelectionX, gatingFeatureSelectionY: gatingFeatureSelectionY, setGatingFeatureSelectionY: setGatingFeatureSelectionY, gatingFeatureValueTransform: featureValueTransform, setGatingFeatureValueTransform: (newValue) => {
194
+ setFeatureValueTransform(newValue);
195
+ setTargetX(null);
196
+ setTargetY(null);
197
+ setZoom(null);
198
+ }, gatingFeatureValueTransformCoefficient: featureValueTransformCoefficient, setGatingFeatureValueTransformCoefficient: setFeatureValueTransformCoefficient, geneSelectOptions: featureIndex, transformOptions: VALUE_TRANSFORM_OPTIONS }) })), children: [_jsx(EmptyMessage, { visible: !(gatingFeatureSelectionX && gatingFeatureSelectionY), message: `Select two ${plur(featureType, 2)} in the plot settings.` }), _jsx(Scatterplot, { ref: deckRef, uuid: uuid, theme: theme, hideTools: !(gatingFeatureSelectionX && gatingFeatureSelectionY), viewState: { zoom, target: [targetX, targetY, targetZ] }, setViewState: ({ zoom: newZoom, target }) => {
199
+ setZoom(newZoom);
200
+ setTargetX(target[0]);
201
+ setTargetY(target[1]);
202
+ setTargetZ(target[2] || 0);
203
+ }, obsEmbeddingIndex: obsIndex, obsEmbedding: obsXY, cellFilter: cellFilter, cellSelection: cellSelection, cellHighlight: cellHighlight, cellColors: cellColors, cellSetPolygons: cellSetPolygons, cellSetLabelSize: cellSetLabelSize, cellSetLabelsVisible: cellSetLabelsVisible, cellSetPolygonsVisible: cellSetPolygonsVisible, setCellFilter: setCellFilter, setCellSelection: setCellSelectionProp, setCellHighlight: setCellHighlight, cellRadius: cellRadius, cellOpacity: cellOpacity, cellColorEncoding: cellColorEncoding, geneExpressionColormap: geneExpressionColormap, geneExpressionColormapRange: geneExpressionColormapRange, setComponentHover: () => {
204
+ setComponentHover(uuid);
205
+ }, updateViewInfo: setComponentViewInfo, getExpressionValue: getExpressionValue, getCellIsSelected: getCellIsSelected }), !disableTooltip && (_jsx(ScatterplotTooltipSubscriber, { parentUuid: uuid, obsHighlight: cellHighlight, width: width, height: height, getObsInfo: getObsInfo }))] }));
206
+ }
@@ -0,0 +1,2 @@
1
+ export { GatingSubscriber } from "./GatingSubscriber.js";
2
+ //# sourceMappingURL=index.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.js"],"names":[],"mappings":""}
package/dist-tsc/index.js CHANGED
@@ -1 +1 @@
1
- export { GatingSubscriber, register } from './GatingSubscriber';
1
+ export { GatingSubscriber } from './GatingSubscriber.js';
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@vitessce/scatterplot-gating",
3
- "version": "2.0.3",
3
+ "version": "3.0.0",
4
4
  "author": "Gehlenborg Lab",
5
5
  "homepage": "http://vitessce.io",
6
6
  "repository": {
@@ -8,25 +8,27 @@
8
8
  "url": "git+https://github.com/vitessce/vitessce.git"
9
9
  },
10
10
  "license": "MIT",
11
- "main": "dist/index.mjs",
11
+ "type": "module",
12
+ "main": "dist/index.js",
12
13
  "files": [
14
+ "src",
13
15
  "dist",
14
- "src"
16
+ "dist-tsc"
15
17
  ],
16
18
  "dependencies": {
17
19
  "@material-ui/core": "~4.12.3",
18
20
  "d3-array": "^2.4.0",
19
- "lodash": "^4.17.21",
21
+ "lodash-es": "^4.17.21",
20
22
  "plur": "^5.1.0",
21
- "@vitessce/constants-internal": "2.0.3",
22
- "@vitessce/scatterplot": "2.0.3",
23
- "@vitessce/sets-utils": "2.0.3",
24
- "@vitessce/utils": "2.0.3",
25
- "@vitessce/vit-s": "2.0.3"
23
+ "@vitessce/constants-internal": "3.0.0",
24
+ "@vitessce/sets-utils": "3.0.0",
25
+ "@vitessce/scatterplot": "3.0.0",
26
+ "@vitessce/vit-s": "3.0.0",
27
+ "@vitessce/utils": "3.0.0"
26
28
  },
27
29
  "devDependencies": {
28
30
  "react": "^18.0.0",
29
- "vite": "^3.0.0",
31
+ "vite": "^4.3.0",
30
32
  "vitest": "^0.23.4"
31
33
  },
32
34
  "peerDependencies": {
@@ -35,5 +37,12 @@
35
37
  "scripts": {
36
38
  "bundle": "pnpm exec vite build -c ../../../scripts/vite.config.js",
37
39
  "test": "pnpm exec vitest --run -r ../../../ --dir ."
40
+ },
41
+ "module": "dist/index.js",
42
+ "exports": {
43
+ ".": {
44
+ "types": "./dist-tsc/index.d.ts",
45
+ "import": "./dist/index.js"
46
+ }
38
47
  }
39
48
  }
@@ -1,8 +1,6 @@
1
1
  import React from 'react';
2
2
  import plur from 'plur';
3
- import TableCell from '@material-ui/core/TableCell';
4
- import TableRow from '@material-ui/core/TableRow';
5
- import TextField from '@material-ui/core/TextField';
3
+ import { TableCell, TableRow, TextField } from '@material-ui/core';
6
4
  import { usePlotOptionsStyles, OptionSelect } from '@vitessce/vit-s';
7
5
  import { capitalize } from '@vitessce/utils';
8
6
 
@@ -3,7 +3,7 @@ import React, {
3
3
  } from 'react';
4
4
  import plur from 'plur';
5
5
  import { extent } from 'd3-array';
6
- import isEqual from 'lodash/isEqual';
6
+ import { isEqual } from 'lodash-es';
7
7
  import {
8
8
  capitalize, commaNumber,
9
9
  getCellColors,
@@ -11,7 +11,9 @@ import {
11
11
  } from '@vitessce/utils';
12
12
  import {
13
13
  TitleInfo,
14
- useDeckCanvasSize, useReady, useUrls, useExpressionValueGetter,
14
+ useDeckCanvasSize, useReady, useUrls,
15
+ useUint8FeatureSelection,
16
+ useExpressionValueGetter,
15
17
  useObsSetsData,
16
18
  useFeatureSelection,
17
19
  useObsFeatureMatrixIndices,
@@ -19,7 +21,6 @@ import {
19
21
  useLoaders,
20
22
  useSetComponentHover,
21
23
  useSetComponentViewInfo,
22
- registerPluginViewType,
23
24
  } from '@vitessce/vit-s';
24
25
  import { getCellSetPolygons, mergeObsSets, setObsSelection } from '@vitessce/sets-utils';
25
26
  import {
@@ -29,7 +30,7 @@ import {
29
30
  EmptyMessage,
30
31
  } from '@vitessce/scatterplot';
31
32
  import { ViewType, COMPONENT_COORDINATION_TYPES } from '@vitessce/constants-internal';
32
- import GatingScatterplotOptions from './GatingScatterplotOptions';
33
+ import GatingScatterplotOptions from './GatingScatterplotOptions.js';
33
34
 
34
35
  /**
35
36
  * A subscriber component for the gating scatterplot.
@@ -228,16 +229,13 @@ export function GatingSubscriber(props) {
228
229
  setAdditionalCellSets, setCellSetColor, setCellSetSelection]);
229
230
 
230
231
  const cellColors = useMemo(() => getCellColors({
231
- cellColorEncoding,
232
- expressionData: expressionDataColor && expressionDataColor[0],
233
- geneSelection: gatingFeatureSelectionColor,
234
232
  cellSets: mergedCellSets,
235
233
  cellSetSelection,
236
234
  cellSetColor,
237
235
  obsIndex,
238
236
  theme,
239
- }), [cellColorEncoding, gatingFeatureSelectionColor, mergedCellSets, theme,
240
- cellSetSelection, cellSetColor, expressionDataColor, obsIndex]);
237
+ }), [mergedCellSets, theme,
238
+ cellSetSelection, cellSetColor, obsIndex]);
241
239
 
242
240
  // cellSetPolygonCache is an array of tuples like [(key0, val0), (key1, val1), ...],
243
241
  // where the keys are cellSetSelection arrays.
@@ -318,12 +316,14 @@ export function GatingSubscriber(props) {
318
316
  const cellRadius = (cellRadiusMode === 'manual' ? cellRadiusFixed : dynamicCellRadius);
319
317
  const cellOpacity = (cellOpacityMode === 'manual' ? cellOpacityFixed : dynamicCellOpacity);
320
318
 
319
+ const [uint8ExpressionData] = useUint8FeatureSelection(expressionDataColor);
320
+
321
321
  // Set up a getter function for gene expression values, to be used
322
322
  // by the DeckGL layer to obtain values for instanced attributes.
323
323
  const getExpressionValue = useExpressionValueGetter({
324
324
  instanceObsIndex: obsIndex,
325
325
  matrixObsIndex: obsIndex,
326
- expressionData: expressionDataColor,
326
+ expressionData: uint8ExpressionData,
327
327
  });
328
328
 
329
329
  // Puts the mapping values in the cell info tooltip.
@@ -450,11 +450,3 @@ export function GatingSubscriber(props) {
450
450
  </TitleInfo>
451
451
  );
452
452
  }
453
-
454
- export function register() {
455
- registerPluginViewType(
456
- ViewType.GATING,
457
- GatingSubscriber,
458
- COMPONENT_COORDINATION_TYPES[ViewType.GATING],
459
- );
460
- }
package/src/index.js CHANGED
@@ -1 +1 @@
1
- export { GatingSubscriber, register } from './GatingSubscriber';
1
+ export { GatingSubscriber } from './GatingSubscriber.js';
package/dist/index.mjs DELETED
@@ -1,8 +0,0 @@
1
- import { G, r } from "./index.2b98eb03.mjs";
2
- import "react";
3
- import "@vitessce/vit-s";
4
- import "react-dom";
5
- export {
6
- G as GatingSubscriber,
7
- r as register
8
- };