@vitessce/statistical-plots 3.6.10 → 3.6.11

package/dist/{deflate-DFg7j2aM.js → deflate-Dm0PZc2F.js}

@@ -1,5 +1,5 @@
 import { i as inflate_1 } from "./pako.esm-SxljTded.js";
-import { B as BaseDecoder } from "./index-Dhdy8_KV.js";
+import { B as BaseDecoder } from "./index-CIqXsmFh.js";
 class DeflateDecoder extends BaseDecoder {
   decodeBlock(buffer) {
     return inflate_1(new Uint8Array(buffer)).buffer;

package/dist/{index-Dhdy8_KV.js → index-CIqXsmFh.js}

@@ -177630,7 +177630,8 @@ const PIXELATED_TEXTURE_PARAMETERS = {
 const GLSL_COLORMAPS = [
   "plasma",
   "viridis",
-  "jet"
+  "jet",
+  "greys"
 ];
 const GLSL_COLORMAP_DEFAULT = "plasma";
 const COLORMAP_SHADER_PLACEHOLDER = "COLORMAP_FUNC";
@@ -178719,22 +178720,22 @@ function addDecoder(cases2, importFn) {
   }
   cases2.forEach((c2) => registry$1.set(c2, importFn));
 }
-addDecoder([void 0, 1], () => import("./raw-TJbs5T8I.js").then((m2) => m2.default));
-addDecoder(5, () => import("./lzw--6K-CH9V.js").then((m2) => m2.default));
+addDecoder([void 0, 1], () => import("./raw-BMmSKVDS.js").then((m2) => m2.default));
+addDecoder(5, () => import("./lzw-DdkwQP4Y.js").then((m2) => m2.default));
 addDecoder(6, () => {
   throw new Error("old style JPEG compression is not supported.");
 });
-addDecoder(7, () => import("./jpeg-BAsU3Uj1.js").then((m2) => m2.default));
-addDecoder([8, 32946], () => import("./deflate-DFg7j2aM.js").then((m2) => m2.default));
-addDecoder(32773, () => import("./packbits-DIcMoiDr.js").then((m2) => m2.default));
+addDecoder(7, () => import("./jpeg-B_rzx3DO.js").then((m2) => m2.default));
+addDecoder([8, 32946], () => import("./deflate-Dm0PZc2F.js").then((m2) => m2.default));
+addDecoder(32773, () => import("./packbits-kigCEjo4.js").then((m2) => m2.default));
 addDecoder(
   34887,
-  () => import("./lerc-Bs40GmLw.js").then(async (m2) => {
+  () => import("./lerc-DtYkE7gf.js").then(async (m2) => {
     await m2.zstd.init();
     return m2;
   }).then((m2) => m2.default)
 );
-addDecoder(50001, () => import("./webimage-DcmYEYr-.js").then((m2) => m2.default));
+addDecoder(50001, () => import("./webimage-Ba4jGxpB.js").then((m2) => m2.default));
 function decodeRowAcc(row, stride) {
   let length2 = row.length - stride;
   let offset2 = 0;
@@ -250177,10 +250178,10 @@ function DotPlot(props) {
     featureType,
     featureValueType,
     featureValueTransformName,
-    // TODO: re-enable featureValueColormap coordination
-    // featureValueColormap,
+    featureValueColormap,
     obsSetSelection,
-    obsSetColor
+    obsSetColor,
+    onDotSelect
   } = props;
   const vegaContainerRef = useRef();
   const data2 = rawData.map((d) => ({
@@ -250219,6 +250220,26 @@ function DotPlot(props) {
       // Reference: https://vega.github.io/vega-lite/docs/mark.html
       opacity: 1
     },
+    params: [
+      {
+        name: "dot_select",
+        select: {
+          type: "point",
+          on: "click[event.shiftKey === false]",
+          fields: ["feature"],
+          empty: "none"
+        }
+      },
+      {
+        name: "shift_dot_select",
+        select: {
+          type: "point",
+          on: "click[event.shiftKey]",
+          fields: ["feature"],
+          empty: "none"
+        }
+      }
+    ],
     encoding: {
       [transpose2 ? "y" : "x"]: {
         field: "keyFeature",
@@ -250240,8 +250261,7 @@ function DotPlot(props) {
         type: "quantitative",
         title: meanTransform,
         scale: {
-          // scheme: featureValueColormap,
-          scheme: "greys"
+          scheme: featureValueColormap
         },
         legend: {
           direction: "horizontal",
@@ -250283,6 +250303,14 @@ function DotPlot(props) {
       } : {}
     }
   };
+  const handleSignal = (name2, value2) => {
+    if (name2 === "dot_select") {
+      onDotSelect(value2.feature);
+    } else if (name2 === "shift_dot_select") {
+      onDotSelect(value2.feature, true);
+    }
+  };
+  const signalListeners = { dot_select: handleSignal, shift_dot_select: handleSignal };
   const getTooltipText = useCallback((item) => ({
     [`${capitalize$3(featureType)}`]: item.datum.feature,
     [`${capitalize$3(obsType)} Set`]: item.datum.group,
@@ -250317,6 +250345,7 @@ function DotPlot(props) {
       data: data2,
       spec,
       onNewView,
+      signalListeners,
       getTooltipText,
       renderer: "svg"
     }
@@ -250421,12 +250450,15 @@ function DotPlotSubscriber(props) {
     obsSetColor: cellSetColor,
     additionalObsSets: additionalCellSets,
     sampleType,
-    sampleSetSelection
+    sampleSetSelection,
+    // eslint-disable-next-line no-unused-vars
+    featureAggregationStrategy
   }, {
     setFeatureValueTransform,
     setFeatureValueTransformCoefficient,
     setFeatureValuePositivityThreshold: setPosThreshold,
-    setFeatureValueColormap
+    setFeatureValueColormap,
+    setFeatureAggregationStrategy
   }] = useCoordination(
     COMPONENT_COORDINATION_TYPES[ViewType$1.DOT_PLOT],
     coordinationScopes
@@ -250552,6 +250584,12 @@ function DotPlotSubscriber(props) {
   const selectedTransformName = (_a3 = transformOptions.find(
     (o2) => o2.value === featureValueTransform
   )) == null ? void 0 : _a3.name;
+  const onDotSelect = useCallback((featureName, isShiftDown = false) => {
+    const featureI = geneSelection.indexOf(featureName == null ? void 0 : featureName[0]);
+    if (featureI >= 0) {
+      setFeatureAggregationStrategy(featureI);
+    }
+  }, [setFeatureAggregationStrategy, geneSelection]);
   return /* @__PURE__ */ React__default.createElement(
     TitleInfo,
     {
@@ -250594,7 +250632,8 @@ function DotPlotSubscriber(props) {
         featureValueTransformName: selectedTransformName,
         featureValueColormap,
         obsSetSelection: cellSetSelection,
-        obsSetColor: cellSetColor
+        obsSetColor: cellSetColor,
+        onDotSelect
       }
     ) : /* @__PURE__ */ React__default.createElement("span", null, "Select at least one ", featureType, "."))
   );

package/dist/index.js

@@ -1,4 +1,4 @@
-import { b, f, C, e, a, i, D, h, E, F, c, d, T, V } from "./index-Dhdy8_KV.js";
+import { b, f, C, e, a, i, D, h, E, F, c, d, T, V } from "./index-CIqXsmFh.js";
 export {
   b as CellSetCompositionBarPlotSubscriber,
   f as CellSetExpressionPlot,

package/dist/{jpeg-BAsU3Uj1.js → jpeg-B_rzx3DO.js}

@@ -1,4 +1,4 @@
-import { B as BaseDecoder } from "./index-Dhdy8_KV.js";
+import { B as BaseDecoder } from "./index-CIqXsmFh.js";
 const dctZigZag = new Int32Array([
   0,
   1,

package/dist/{lerc-Bs40GmLw.js → lerc-DtYkE7gf.js}

@@ -1,5 +1,5 @@
 import { i as inflate_1 } from "./pako.esm-SxljTded.js";
-import { g as getDefaultExportFromCjs, B as BaseDecoder } from "./index-Dhdy8_KV.js";
+import { g as getDefaultExportFromCjs, B as BaseDecoder } from "./index-CIqXsmFh.js";
 const LercParameters = {
   AddCompression: 1
 };

package/dist/{lzw--6K-CH9V.js → lzw-DdkwQP4Y.js}

@@ -1,4 +1,4 @@
-import { B as BaseDecoder } from "./index-Dhdy8_KV.js";
+import { B as BaseDecoder } from "./index-CIqXsmFh.js";
 const MIN_BITS = 9;
 const CLEAR_CODE = 256;
 const EOI_CODE = 257;

package/dist/{packbits-DIcMoiDr.js → packbits-kigCEjo4.js}

@@ -1,4 +1,4 @@
-import { B as BaseDecoder } from "./index-Dhdy8_KV.js";
+import { B as BaseDecoder } from "./index-CIqXsmFh.js";
 class PackbitsDecoder extends BaseDecoder {
   decodeBlock(buffer) {
     const dataView = new DataView(buffer);

package/dist/{raw-TJbs5T8I.js → raw-BMmSKVDS.js}

@@ -1,4 +1,4 @@
-import { B as BaseDecoder } from "./index-Dhdy8_KV.js";
+import { B as BaseDecoder } from "./index-CIqXsmFh.js";
 class RawDecoder extends BaseDecoder {
   decodeBlock(buffer) {
     return buffer;

package/dist/{webimage-DcmYEYr-.js → webimage-Ba4jGxpB.js}

@@ -1,4 +1,4 @@
-import { B as BaseDecoder } from "./index-Dhdy8_KV.js";
+import { B as BaseDecoder } from "./index-CIqXsmFh.js";
 class WebImageDecoder extends BaseDecoder {
   constructor() {
     super();

package/dist-tsc/DotPlot.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"DotPlot.d.ts","sourceRoot":"","sources":["../src/DotPlot.js"],"names":[],"mappings":"AAOA;;;;;;;;;;;;;;;;;GAiBG;AACH,uCAdG;IAAwB,IAAI,EAApB,MAAM,EAAE;IAEM,KAAK,EAAnB,MAAM;IACQ,KAAK,EAAnB,MAAM;IACQ,MAAM,EAApB,MAAM;IACQ,WAAW,EAAzB,MAAM;IAGQ,YAAY,EAA1B,MAAM;IAGa,yBAAyB,EAA5C,MAAM,GAAC,IAAI;CAErB,eA4NA"}
+{"version":3,"file":"DotPlot.d.ts","sourceRoot":"","sources":["../src/DotPlot.js"],"names":[],"mappings":"AAOA;;;;;;;;;;;;;;;;;GAiBG;AACH,uCAdG;IAAwB,IAAI,EAApB,MAAM,EAAE;IAEM,KAAK,EAAnB,MAAM;IACQ,KAAK,EAAnB,MAAM;IACQ,MAAM,EAApB,MAAM;IACQ,WAAW,EAAzB,MAAM;IAGQ,YAAY,EAA1B,MAAM;IAGa,yBAAyB,EAA5C,MAAM,GAAC,IAAI;CAErB,eAyPA"}

package/dist-tsc/DotPlot.js

@@ -24,10 +24,7 @@ import { getColorScale } from './utils.js';
  * for the feature value transformation function.
  */
 export default function DotPlot(props) {
-    const { isStratified, transpose, data: rawData, theme, width, height, marginRight, marginBottom, obsType, sampleType, keyLength = 36, featureType, featureValueType, featureValueTransformName, 
-    // TODO: re-enable featureValueColormap coordination
-    // featureValueColormap,
-    obsSetSelection, obsSetColor, } = props;
+    const { isStratified, transpose, data: rawData, theme, width, height, marginRight, marginBottom, obsType, sampleType, keyLength = 36, featureType, featureValueType, featureValueTransformName, featureValueColormap, obsSetSelection, obsSetColor, onDotSelect, } = props;
     const vegaContainerRef = useRef();
     // Add a property `keyGroup` and `keyFeature` which concatenates the key and the name,
     // which is both unique and can easily be converted
@@ -87,6 +84,26 @@ export default function DotPlot(props) {
             // Reference: https://vega.github.io/vega-lite/docs/mark.html
             opacity: 1.0,
         },
+        params: [
+            {
+                name: 'dot_select',
+                select: {
+                    type: 'point',
+                    on: 'click[event.shiftKey === false]',
+                    fields: ['feature'],
+                    empty: 'none',
+                },
+            },
+            {
+                name: 'shift_dot_select',
+                select: {
+                    type: 'point',
+                    on: 'click[event.shiftKey]',
+                    fields: ['feature'],
+                    empty: 'none',
+                },
+            },
+        ],
         encoding: {
             [(transpose ? 'y' : 'x')]: {
                 field: 'keyFeature',
@@ -110,8 +127,7 @@ export default function DotPlot(props) {
                 type: 'quantitative',
                 title: meanTransform,
                 scale: {
-                    // scheme: featureValueColormap,
-                    scheme: 'greys',
+                    scheme: featureValueColormap,
                 },
                 legend: {
                     direction: 'horizontal',
@@ -152,6 +168,15 @@ export default function DotPlot(props) {
             } : {}),
         },
     };
+    const handleSignal = (name, value) => {
+        if (name === 'dot_select') {
+            onDotSelect(value.feature);
+        }
+        else if (name === 'shift_dot_select') {
+            onDotSelect(value.feature, true);
+        }
+    };
+    const signalListeners = { dot_select: handleSignal, shift_dot_select: handleSignal };
     const getTooltipText = useCallback(item => ({
         [`${capitalize(featureType)}`]: item.datum.feature,
         [`${capitalize(obsType)} Set`]: item.datum.group,
@@ -193,5 +218,5 @@ export default function DotPlot(props) {
     useEffect(() => {
         setVegaRenderIncrement(prev => prev + 1);
     }, [rawData]);
-    return (_jsx("div", { ref: vegaContainerRef, children: _jsx(VegaPlot, { data: data, spec: spec, onNewView: onNewView, getTooltipText: getTooltipText, renderer: "svg" }) }));
+    return (_jsx("div", { ref: vegaContainerRef, children: _jsx(VegaPlot, { data: data, spec: spec, onNewView: onNewView, signalListeners: signalListeners, getTooltipText: getTooltipText, renderer: "svg" }) }));
 }

package/dist-tsc/DotPlotSubscriber.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"DotPlotSubscriber.d.ts","sourceRoot":"","sources":["../src/DotPlotSubscriber.js"],"names":[],"mappings":"AAmBA;;;;;;;GAOG;AACH,yCALG;IAAwB,mBAAmB;IACrB,kBAAkB,EAAhC,MAAM;IAEQ,KAAK,EAAnB,MAAM;CAChB,eA6KA"}
+{"version":3,"file":"DotPlotSubscriber.d.ts","sourceRoot":"","sources":["../src/DotPlotSubscriber.js"],"names":[],"mappings":"AAmBA;;;;;;;GAOG;AACH,yCALG;IAAwB,mBAAmB;IACrB,kBAAkB,EAAhC,MAAM;IAEQ,KAAK,EAAnB,MAAM;CAChB,eA2LA"}

package/dist-tsc/DotPlotSubscriber.js

@@ -1,5 +1,5 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import React from 'react';
+import React, { useCallback } from 'react';
 import { TitleInfo, useCoordination, useLoaders, useUrls, useReady, useGridItemSize, useFeatureSelection, useObsSetsData, useObsFeatureMatrixIndices, useFeatureLabelsData, useSampleSetsData, useSampleEdgesData, } from '@vitessce/vit-s';
 import { ViewType, COMPONENT_COORDINATION_TYPES, ViewHelpMapping } from '@vitessce/constants-internal';
 import { VALUE_TRANSFORM_OPTIONS } from '@vitessce/utils';
@@ -20,7 +20,9 @@ export function DotPlotSubscriber(props) {
     const { classes } = useStyles();
     const loaders = useLoaders();
     // Get "props" from the coordination space.
-    const [{ dataset, obsType, featureType, featureValueType, featureSelection: geneSelection, featureValueTransform, featureValueTransformCoefficient, featureValuePositivityThreshold: posThreshold, featureValueColormap, obsSetSelection: cellSetSelection, obsSetColor: cellSetColor, additionalObsSets: additionalCellSets, sampleType, sampleSetSelection, }, { setFeatureValueTransform, setFeatureValueTransformCoefficient, setFeatureValuePositivityThreshold: setPosThreshold, setFeatureValueColormap, }] = useCoordination(COMPONENT_COORDINATION_TYPES[ViewType.DOT_PLOT], coordinationScopes);
+    const [{ dataset, obsType, featureType, featureValueType, featureSelection: geneSelection, featureValueTransform, featureValueTransformCoefficient, featureValuePositivityThreshold: posThreshold, featureValueColormap, obsSetSelection: cellSetSelection, obsSetColor: cellSetColor, additionalObsSets: additionalCellSets, sampleType, sampleSetSelection, 
+    // eslint-disable-next-line no-unused-vars
+    featureAggregationStrategy, }, { setFeatureValueTransform, setFeatureValueTransformCoefficient, setFeatureValuePositivityThreshold: setPosThreshold, setFeatureValueColormap, setFeatureAggregationStrategy, }] = useCoordination(COMPONENT_COORDINATION_TYPES[ViewType.DOT_PLOT], coordinationScopes);
     const [width, height, containerRef] = useGridItemSize();
     const transformOptions = VALUE_TRANSFORM_OPTIONS;
     const isStratified = Array.isArray(sampleSetSelection) && sampleSetSelection.length > 1;
@@ -60,5 +62,14 @@ export function DotPlotSubscriber(props) {
     ]);
     const [resultArr, meanExpressionMax] = useExpressionSummaries(sampleEdges, sampleSets, sampleSetSelection, expressionData, obsIndex, cellSets, additionalCellSets, geneSelection, cellSetSelection, cellSetColor, featureValueTransform, featureValueTransformCoefficient, posThreshold, featureLabelsMap);
     const selectedTransformName = transformOptions.find(o => o.value === featureValueTransform)?.name;
-    return (_jsx(TitleInfo, { title: title, removeGridComponent: removeGridComponent, urls: urls, theme: theme, isReady: isReady, helpText: helpText, errors: errors, options: (_jsx(CellSetExpressionPlotOptions, { featureValueTransform: featureValueTransform, setFeatureValueTransform: setFeatureValueTransform, featureValueTransformCoefficient: featureValueTransformCoefficient, setFeatureValueTransformCoefficient: setFeatureValueTransformCoefficient, transformOptions: transformOptions, featureValuePositivityThreshold: posThreshold, setFeatureValuePositivityThreshold: setPosThreshold, featureValueColormap: featureValueColormap, setFeatureValueColormap: setFeatureValueColormap })), children: _jsx("div", { ref: containerRef, className: classes.vegaContainer, children: resultArr ? (_jsx(DotPlot, { isStratified: isStratified, transpose: transpose, domainMax: meanExpressionMax, data: resultArr, theme: theme, width: width, height: height, obsType: obsType, sampleType: sampleType, featureType: featureType, featureValueType: featureValueType, featureValueTransformName: selectedTransformName, featureValueColormap: featureValueColormap, obsSetSelection: cellSetSelection, obsSetColor: cellSetColor })) : (_jsxs("span", { children: ["Select at least one ", featureType, "."] })) }) }));
+    // eslint-disable-next-line no-unused-vars
+    const onDotSelect = useCallback((featureName, isShiftDown = false) => {
+        // TODO: Implement different behavior when isShiftDown
+        // / (featureName array will need to be aggregated)
+        const featureI = geneSelection.indexOf(featureName?.[0]);
+        if (featureI >= 0) {
+            setFeatureAggregationStrategy(featureI);
+        }
+    }, [setFeatureAggregationStrategy, geneSelection]);
+    return (_jsx(TitleInfo, { title: title, removeGridComponent: removeGridComponent, urls: urls, theme: theme, isReady: isReady, helpText: helpText, errors: errors, options: (_jsx(CellSetExpressionPlotOptions, { featureValueTransform: featureValueTransform, setFeatureValueTransform: setFeatureValueTransform, featureValueTransformCoefficient: featureValueTransformCoefficient, setFeatureValueTransformCoefficient: setFeatureValueTransformCoefficient, transformOptions: transformOptions, featureValuePositivityThreshold: posThreshold, setFeatureValuePositivityThreshold: setPosThreshold, featureValueColormap: featureValueColormap, setFeatureValueColormap: setFeatureValueColormap })), children: _jsx("div", { ref: containerRef, className: classes.vegaContainer, children: resultArr ? (_jsx(DotPlot, { isStratified: isStratified, transpose: transpose, domainMax: meanExpressionMax, data: resultArr, theme: theme, width: width, height: height, obsType: obsType, sampleType: sampleType, featureType: featureType, featureValueType: featureValueType, featureValueTransformName: selectedTransformName, featureValueColormap: featureValueColormap, obsSetSelection: cellSetSelection, obsSetColor: cellSetColor, onDotSelect: onDotSelect })) : (_jsxs("span", { children: ["Select at least one ", featureType, "."] })) }) }));
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vitessce/statistical-plots",
-  "version": "3.6.10",
+  "version": "3.6.11",
   "author": "HIDIVE Lab at HMS",
   "homepage": "http://vitessce.io",
   "repository": {
@@ -28,13 +28,13 @@
     "react-aria": "^3.28.0",
     "internmap": "^2.0.3",
     "uuid": "^9.0.0",
-    "@vitessce/styles": "3.6.10",
-    "@vitessce/constants-internal": "3.6.10",
-    "@vitessce/sets-utils": "3.6.10",
-    "@vitessce/utils": "3.6.10",
-    "@vitessce/vega": "3.6.10",
-    "@vitessce/vit-s": "3.6.10",
-    "@vitessce/gl": "3.6.10"
+    "@vitessce/styles": "3.6.11",
+    "@vitessce/constants-internal": "3.6.11",
+    "@vitessce/sets-utils": "3.6.11",
+    "@vitessce/utils": "3.6.11",
+    "@vitessce/vega": "3.6.11",
+    "@vitessce/vit-s": "3.6.11",
+    "@vitessce/gl": "3.6.11"
   },
   "devDependencies": {
     "react": "^18.0.0",

package/src/DotPlot.js

@@ -39,10 +39,10 @@ export default function DotPlot(props) {
     featureType,
     featureValueType,
     featureValueTransformName,
-    // TODO: re-enable featureValueColormap coordination
-    // featureValueColormap,
+    featureValueColormap,
     obsSetSelection,
     obsSetColor,
+    onDotSelect,
   } = props;
 
   const vegaContainerRef = useRef();
@@ -112,6 +112,26 @@ export default function DotPlot(props) {
       // Reference: https://vega.github.io/vega-lite/docs/mark.html
       opacity: 1.0,
     },
+    params: [
+      {
+        name: 'dot_select',
+        select: {
+          type: 'point',
+          on: 'click[event.shiftKey === false]',
+          fields: ['feature'],
+          empty: 'none',
+        },
+      },
+      {
+        name: 'shift_dot_select',
+        select: {
+          type: 'point',
+          on: 'click[event.shiftKey]',
+          fields: ['feature'],
+          empty: 'none',
+        },
+      },
+    ],
     encoding: {
       [(transpose ? 'y' : 'x')]: {
         field: 'keyFeature',
@@ -135,8 +155,7 @@ export default function DotPlot(props) {
         type: 'quantitative',
         title: meanTransform,
         scale: {
-          // scheme: featureValueColormap,
-          scheme: 'greys',
+          scheme: featureValueColormap,
         },
         legend: {
           direction: 'horizontal',
@@ -178,6 +197,15 @@ export default function DotPlot(props) {
     },
   };
 
+  const handleSignal = (name, value) => {
+    if (name === 'dot_select') {
+      onDotSelect(value.feature);
+    } else if (name === 'shift_dot_select') {
+      onDotSelect(value.feature, true);
+    }
+  };
+
+  const signalListeners = { dot_select: handleSignal, shift_dot_select: handleSignal };
   const getTooltipText = useCallback(item => ({
     [`${capitalize(featureType)}`]: item.datum.feature,
     [`${capitalize(obsType)} Set`]: item.datum.group,
@@ -237,6 +265,7 @@ export default function DotPlot(props) {
         data={data}
         spec={spec}
         onNewView={onNewView}
+        signalListeners={signalListeners}
         getTooltipText={getTooltipText}
         renderer="svg"
       />

package/src/DotPlotSubscriber.js

@@ -1,4 +1,4 @@
-import React from 'react';
+import React, { useCallback } from 'react';
 import {
   TitleInfo,
   useCoordination, useLoaders,
@@ -54,11 +54,14 @@ export function DotPlotSubscriber(props) {
     additionalObsSets: additionalCellSets,
     sampleType,
     sampleSetSelection,
+    // eslint-disable-next-line no-unused-vars
+    featureAggregationStrategy,
   }, {
     setFeatureValueTransform,
     setFeatureValueTransformCoefficient,
     setFeatureValuePositivityThreshold: setPosThreshold,
     setFeatureValueColormap,
+    setFeatureAggregationStrategy,
   }] = useCoordination(
     COMPONENT_COORDINATION_TYPES[ViewType.DOT_PLOT],
     coordinationScopes,
@@ -149,6 +152,16 @@ export function DotPlotSubscriber(props) {
     o => o.value === featureValueTransform,
   )?.name;
 
+  // eslint-disable-next-line no-unused-vars
+  const onDotSelect = useCallback((featureName, isShiftDown = false) => {
+    // TODO: Implement different behavior when isShiftDown
+    // / (featureName array will need to be aggregated)
+    const featureI = geneSelection.indexOf(featureName?.[0]);
+    if (featureI >= 0) {
+      setFeatureAggregationStrategy(featureI);
+    }
+  }, [setFeatureAggregationStrategy, geneSelection]);
+
   return (
     <TitleInfo
       title={title}
@@ -190,6 +203,7 @@ export function DotPlotSubscriber(props) {
             featureValueColormap={featureValueColormap}
             obsSetSelection={cellSetSelection}
             obsSetColor={cellSetColor}
+            onDotSelect={onDotSelect}
           />
         ) : (
           <span>Select at least one {featureType}.</span>