@vitessce/vit-s 3.8.10 → 3.9.0

package/dist/index.js

@@ -8616,11 +8616,6 @@ const { tss } = createTss({
   "usePlugin": useMuiThemeStyleOverridesPlugin
 });
 const useStyles$5 = tss.create({});
-function chainPropTypes(propType1, propType2) {
-  return function validate(...args) {
-    return propType1(...args) || propType2(...args);
-  };
-}
 function GlobalStyles(props) {
   return /* @__PURE__ */ jsxRuntimeExports.jsx(GlobalStyles$1, {
     ...props,
@@ -8672,6 +8667,365 @@ const memoTheme = unstable_memoTheme;
 function useDefaultProps(params) {
   return useDefaultProps$1(params);
 }
+function getSvgIconUtilityClass(slot) {
+  return generateUtilityClass("MuiSvgIcon", slot);
+}
+generateUtilityClasses("MuiSvgIcon", ["root", "colorPrimary", "colorSecondary", "colorAction", "colorError", "colorDisabled", "fontSizeInherit", "fontSizeSmall", "fontSizeMedium", "fontSizeLarge"]);
+const useUtilityClasses$j = (ownerState) => {
+  const {
+    color: color2,
+    fontSize,
+    classes
+  } = ownerState;
+  const slots = {
+    root: ["root", color2 !== "inherit" && `color${capitalize$1(color2)}`, `fontSize${capitalize$1(fontSize)}`]
+  };
+  return composeClasses(slots, getSvgIconUtilityClass, classes);
+};
+const SvgIconRoot = styled("svg", {
+  name: "MuiSvgIcon",
+  slot: "Root",
+  overridesResolver: (props, styles2) => {
+    const {
+      ownerState
+    } = props;
+    return [styles2.root, ownerState.color !== "inherit" && styles2[`color${capitalize$1(ownerState.color)}`], styles2[`fontSize${capitalize$1(ownerState.fontSize)}`]];
+  }
+})(memoTheme(({
+  theme
+}) => {
+  var _a3, _b2, _c2, _d2, _e2, _f2, _g2, _h2, _i2, _j2, _k2, _l, _m, _n;
+  return {
+    userSelect: "none",
+    width: "1em",
+    height: "1em",
+    display: "inline-block",
+    flexShrink: 0,
+    transition: (_d2 = (_a3 = theme.transitions) == null ? void 0 : _a3.create) == null ? void 0 : _d2.call(_a3, "fill", {
+      duration: (_c2 = (_b2 = (theme.vars ?? theme).transitions) == null ? void 0 : _b2.duration) == null ? void 0 : _c2.shorter
+    }),
+    variants: [
+      {
+        props: (props) => !props.hasSvgAsChild,
+        style: {
+          // the <svg> will define the property that has `currentColor`
+          // for example heroicons uses fill="none" and stroke="currentColor"
+          fill: "currentColor"
+        }
+      },
+      {
+        props: {
+          fontSize: "inherit"
+        },
+        style: {
+          fontSize: "inherit"
+        }
+      },
+      {
+        props: {
+          fontSize: "small"
+        },
+        style: {
+          fontSize: ((_f2 = (_e2 = theme.typography) == null ? void 0 : _e2.pxToRem) == null ? void 0 : _f2.call(_e2, 20)) || "1.25rem"
+        }
+      },
+      {
+        props: {
+          fontSize: "medium"
+        },
+        style: {
+          fontSize: ((_h2 = (_g2 = theme.typography) == null ? void 0 : _g2.pxToRem) == null ? void 0 : _h2.call(_g2, 24)) || "1.5rem"
+        }
+      },
+      {
+        props: {
+          fontSize: "large"
+        },
+        style: {
+          fontSize: ((_j2 = (_i2 = theme.typography) == null ? void 0 : _i2.pxToRem) == null ? void 0 : _j2.call(_i2, 35)) || "2.1875rem"
+        }
+      },
+      // TODO v5 deprecate color prop, v6 remove for sx
+      ...Object.entries((theme.vars ?? theme).palette).filter(([, value]) => value && value.main).map(([color2]) => {
+        var _a4, _b3;
+        return {
+          props: {
+            color: color2
+          },
+          style: {
+            color: (_b3 = (_a4 = (theme.vars ?? theme).palette) == null ? void 0 : _a4[color2]) == null ? void 0 : _b3.main
+          }
+        };
+      }),
+      {
+        props: {
+          color: "action"
+        },
+        style: {
+          color: (_l = (_k2 = (theme.vars ?? theme).palette) == null ? void 0 : _k2.action) == null ? void 0 : _l.active
+        }
+      },
+      {
+        props: {
+          color: "disabled"
+        },
+        style: {
+          color: (_n = (_m = (theme.vars ?? theme).palette) == null ? void 0 : _m.action) == null ? void 0 : _n.disabled
+        }
+      },
+      {
+        props: {
+          color: "inherit"
+        },
+        style: {
+          color: void 0
+        }
+      }
+    ]
+  };
+}));
+const SvgIcon = /* @__PURE__ */ React$1.forwardRef(function SvgIcon2(inProps, ref) {
+  const props = useDefaultProps({
+    props: inProps,
+    name: "MuiSvgIcon"
+  });
+  const {
+    children,
+    className,
+    color: color2 = "inherit",
+    component = "svg",
+    fontSize = "medium",
+    htmlColor,
+    inheritViewBox = false,
+    titleAccess,
+    viewBox = "0 0 24 24",
+    ...other
+  } = props;
+  const hasSvgAsChild = /* @__PURE__ */ React$1.isValidElement(children) && children.type === "svg";
+  const ownerState = {
+    ...props,
+    color: color2,
+    component,
+    fontSize,
+    instanceFontSize: inProps.fontSize,
+    inheritViewBox,
+    viewBox,
+    hasSvgAsChild
+  };
+  const more = {};
+  if (!inheritViewBox) {
+    more.viewBox = viewBox;
+  }
+  const classes = useUtilityClasses$j(ownerState);
+  return /* @__PURE__ */ jsxRuntimeExports.jsxs(SvgIconRoot, {
+    as: component,
+    className: clsx$1(classes.root, className),
+    focusable: "false",
+    color: htmlColor,
+    "aria-hidden": titleAccess ? void 0 : true,
+    role: titleAccess ? "img" : void 0,
+    ref,
+    ...more,
+    ...other,
+    ...hasSvgAsChild && children.props,
+    ownerState,
+    children: [hasSvgAsChild ? children.props.children : children, titleAccess ? /* @__PURE__ */ jsxRuntimeExports.jsx("title", {
+      children: titleAccess
+    }) : null]
+  });
+});
+SvgIcon.propTypes = {
+  // ┌────────────────────────────── Warning ──────────────────────────────┐
+  // │ These PropTypes are generated from the TypeScript type definitions. │
+  // │    To update them, edit the d.ts file and run `pnpm proptypes`.     │
+  // └─────────────────────────────────────────────────────────────────────┘
+  /**
+   * Node passed into the SVG element.
+   */
+  children: PropTypes.node,
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes: PropTypes.object,
+  /**
+   * @ignore
+   */
+  className: PropTypes.string,
+  /**
+   * The color of the component.
+   * It supports both default and custom theme colors, which can be added as shown in the
+   * [palette customization guide](https://mui.com/material-ui/customization/palette/#custom-colors).
+   * You can use the `htmlColor` prop to apply a color attribute to the SVG element.
+   * @default 'inherit'
+   */
+  color: PropTypes.oneOfType([PropTypes.oneOf(["inherit", "action", "disabled", "primary", "secondary", "error", "info", "success", "warning"]), PropTypes.string]),
+  /**
+   * The component used for the root node.
+   * Either a string to use a HTML element or a component.
+   */
+  component: PropTypes.elementType,
+  /**
+   * The fontSize applied to the icon. Defaults to 24px, but can be configure to inherit font size.
+   * @default 'medium'
+   */
+  fontSize: PropTypes.oneOfType([PropTypes.oneOf(["inherit", "large", "medium", "small"]), PropTypes.string]),
+  /**
+   * Applies a color attribute to the SVG element.
+   */
+  htmlColor: PropTypes.string,
+  /**
+   * If `true`, the root node will inherit the custom `component`'s viewBox and the `viewBox`
+   * prop will be ignored.
+   * Useful when you want to reference a custom `component` and have `SvgIcon` pass that
+   * `component`'s viewBox to the root node.
+   * @default false
+   */
+  inheritViewBox: PropTypes.bool,
+  /**
+   * The shape-rendering attribute. The behavior of the different options is described on the
+   * [MDN Web Docs](https://developer.mozilla.org/en-US/docs/Web/SVG/Reference/Attribute/shape-rendering).
+   * If you are having issues with blurry icons you should investigate this prop.
+   */
+  shapeRendering: PropTypes.string,
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
+  sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object]),
+  /**
+   * Provides a human-readable title for the element that contains it.
+   * https://www.w3.org/TR/SVG-access/#Equivalent
+   */
+  titleAccess: PropTypes.string,
+  /**
+   * Allows you to redefine what the coordinates without units mean inside an SVG element.
+   * For example, if the SVG element is 500 (width) by 200 (height),
+   * and you pass viewBox="0 0 50 20",
+   * this means that the coordinates inside the SVG will go from the top left corner (0,0)
+   * to bottom right (50,20) and each unit will be worth 10px.
+   * @default '0 0 24 24'
+   */
+  viewBox: PropTypes.string
+};
+SvgIcon.muiName = "SvgIcon";
+function createSvgIcon(path, displayName) {
+  function Component2(props, ref) {
+    return /* @__PURE__ */ jsxRuntimeExports.jsx(SvgIcon, {
+      "data-testid": `${displayName}Icon`,
+      ref,
+      ...props,
+      children: path
+    });
+  }
+  {
+    Component2.displayName = `${displayName}Icon`;
+  }
+  Component2.muiName = SvgIcon.muiName;
+  return /* @__PURE__ */ React$1.memo(/* @__PURE__ */ React$1.forwardRef(Component2));
+}
+function debounce$3(func, wait = 166) {
+  let timeout2;
+  function debounced(...args) {
+    const later = () => {
+      func.apply(this, args);
+    };
+    clearTimeout(timeout2);
+    timeout2 = setTimeout(later, wait);
+  }
+  debounced.clear = () => {
+    clearTimeout(timeout2);
+  };
+  return debounced;
+}
+function ownerDocument(node2) {
+  return node2 && node2.ownerDocument || document;
+}
+function ownerWindow(node2) {
+  const doc = ownerDocument(node2);
+  return doc.defaultView || window;
+}
+function setRef$1(ref, value) {
+  if (typeof ref === "function") {
+    ref(value);
+  } else if (ref) {
+    ref.current = value;
+  }
+}
+let globalId = 0;
+function useGlobalId(idOverride) {
+  const [defaultId, setDefaultId] = React$1.useState(idOverride);
+  const id = idOverride || defaultId;
+  React$1.useEffect(() => {
+    if (defaultId == null) {
+      globalId += 1;
+      setDefaultId(`mui-${globalId}`);
+    }
+  }, [defaultId]);
+  return id;
+}
+const safeReact = {
+  ...React$1
+};
+const maybeReactUseId = safeReact.useId;
+function useId(idOverride) {
+  if (maybeReactUseId !== void 0) {
+    const reactId = maybeReactUseId();
+    return idOverride ?? reactId;
+  }
+  return useGlobalId(idOverride);
+}
+function useEventCallback(fn2) {
+  const ref = React$1.useRef(fn2);
+  useEnhancedEffect$1(() => {
+    ref.current = fn2;
+  });
+  return React$1.useRef((...args) => (
+    // @ts-expect-error hide `this`
+    (0, ref.current)(...args)
+  )).current;
+}
+function useForkRef$1(...refs) {
+  const cleanupRef = React$1.useRef(void 0);
+  const refEffect = React$1.useCallback((instance) => {
+    const cleanups = refs.map((ref) => {
+      if (ref == null) {
+        return null;
+      }
+      if (typeof ref === "function") {
+        const refCallback = ref;
+        const refCleanup = refCallback(instance);
+        return typeof refCleanup === "function" ? refCleanup : () => {
+          refCallback(null);
+        };
+      }
+      ref.current = instance;
+      return () => {
+        ref.current = null;
+      };
+    });
+    return () => {
+      cleanups.forEach((refCleanup) => refCleanup == null ? void 0 : refCleanup());
+    };
+  }, refs);
+  return React$1.useMemo(() => {
+    if (refs.every((ref) => ref == null)) {
+      return null;
+    }
+    return (value) => {
+      if (cleanupRef.current) {
+        cleanupRef.current();
+        cleanupRef.current = void 0;
+      }
+      if (value != null) {
+        cleanupRef.current = refEffect(value);
+      }
+    };
+  }, refs);
+}
+function chainPropTypes(propType1, propType2) {
+  return function validate(...args) {
+    return propType1(...args) || propType2(...args);
+  };
+}
 function _extends$1() {
   return _extends$1 = Object.assign ? Object.assign.bind() : function(n2) {
     for (var e2 = 1; e2 < arguments.length; e2++) {
@@ -9456,360 +9810,6 @@ function getTransitionProps(props, options) {
     delay: style2.transitionDelay
   };
 }
-function getSvgIconUtilityClass(slot) {
-  return generateUtilityClass("MuiSvgIcon", slot);
-}
-generateUtilityClasses("MuiSvgIcon", ["root", "colorPrimary", "colorSecondary", "colorAction", "colorError", "colorDisabled", "fontSizeInherit", "fontSizeSmall", "fontSizeMedium", "fontSizeLarge"]);
-const useUtilityClasses$j = (ownerState) => {
-  const {
-    color: color2,
-    fontSize,
-    classes
-  } = ownerState;
-  const slots = {
-    root: ["root", color2 !== "inherit" && `color${capitalize$1(color2)}`, `fontSize${capitalize$1(fontSize)}`]
-  };
-  return composeClasses(slots, getSvgIconUtilityClass, classes);
-};
-const SvgIconRoot = styled("svg", {
-  name: "MuiSvgIcon",
-  slot: "Root",
-  overridesResolver: (props, styles2) => {
-    const {
-      ownerState
-    } = props;
-    return [styles2.root, ownerState.color !== "inherit" && styles2[`color${capitalize$1(ownerState.color)}`], styles2[`fontSize${capitalize$1(ownerState.fontSize)}`]];
-  }
-})(memoTheme(({
-  theme
-}) => {
-  var _a3, _b2, _c2, _d2, _e2, _f2, _g2, _h2, _i2, _j2, _k2, _l, _m, _n;
-  return {
-    userSelect: "none",
-    width: "1em",
-    height: "1em",
-    display: "inline-block",
-    flexShrink: 0,
-    transition: (_d2 = (_a3 = theme.transitions) == null ? void 0 : _a3.create) == null ? void 0 : _d2.call(_a3, "fill", {
-      duration: (_c2 = (_b2 = (theme.vars ?? theme).transitions) == null ? void 0 : _b2.duration) == null ? void 0 : _c2.shorter
-    }),
-    variants: [
-      {
-        props: (props) => !props.hasSvgAsChild,
-        style: {
-          // the <svg> will define the property that has `currentColor`
-          // for example heroicons uses fill="none" and stroke="currentColor"
-          fill: "currentColor"
-        }
-      },
-      {
-        props: {
-          fontSize: "inherit"
-        },
-        style: {
-          fontSize: "inherit"
-        }
-      },
-      {
-        props: {
-          fontSize: "small"
-        },
-        style: {
-          fontSize: ((_f2 = (_e2 = theme.typography) == null ? void 0 : _e2.pxToRem) == null ? void 0 : _f2.call(_e2, 20)) || "1.25rem"
-        }
-      },
-      {
-        props: {
-          fontSize: "medium"
-        },
-        style: {
-          fontSize: ((_h2 = (_g2 = theme.typography) == null ? void 0 : _g2.pxToRem) == null ? void 0 : _h2.call(_g2, 24)) || "1.5rem"
-        }
-      },
-      {
-        props: {
-          fontSize: "large"
-        },
-        style: {
-          fontSize: ((_j2 = (_i2 = theme.typography) == null ? void 0 : _i2.pxToRem) == null ? void 0 : _j2.call(_i2, 35)) || "2.1875rem"
-        }
-      },
-      // TODO v5 deprecate color prop, v6 remove for sx
-      ...Object.entries((theme.vars ?? theme).palette).filter(([, value]) => value && value.main).map(([color2]) => {
-        var _a4, _b3;
-        return {
-          props: {
-            color: color2
-          },
-          style: {
-            color: (_b3 = (_a4 = (theme.vars ?? theme).palette) == null ? void 0 : _a4[color2]) == null ? void 0 : _b3.main
-          }
-        };
-      }),
-      {
-        props: {
-          color: "action"
-        },
-        style: {
-          color: (_l = (_k2 = (theme.vars ?? theme).palette) == null ? void 0 : _k2.action) == null ? void 0 : _l.active
-        }
-      },
-      {
-        props: {
-          color: "disabled"
-        },
-        style: {
-          color: (_n = (_m = (theme.vars ?? theme).palette) == null ? void 0 : _m.action) == null ? void 0 : _n.disabled
-        }
-      },
-      {
-        props: {
-          color: "inherit"
-        },
-        style: {
-          color: void 0
-        }
-      }
-    ]
-  };
-}));
-const SvgIcon = /* @__PURE__ */ React$1.forwardRef(function SvgIcon2(inProps, ref) {
-  const props = useDefaultProps({
-    props: inProps,
-    name: "MuiSvgIcon"
-  });
-  const {
-    children,
-    className,
-    color: color2 = "inherit",
-    component = "svg",
-    fontSize = "medium",
-    htmlColor,
-    inheritViewBox = false,
-    titleAccess,
-    viewBox = "0 0 24 24",
-    ...other
-  } = props;
-  const hasSvgAsChild = /* @__PURE__ */ React$1.isValidElement(children) && children.type === "svg";
-  const ownerState = {
-    ...props,
-    color: color2,
-    component,
-    fontSize,
-    instanceFontSize: inProps.fontSize,
-    inheritViewBox,
-    viewBox,
-    hasSvgAsChild
-  };
-  const more = {};
-  if (!inheritViewBox) {
-    more.viewBox = viewBox;
-  }
-  const classes = useUtilityClasses$j(ownerState);
-  return /* @__PURE__ */ jsxRuntimeExports.jsxs(SvgIconRoot, {
-    as: component,
-    className: clsx$1(classes.root, className),
-    focusable: "false",
-    color: htmlColor,
-    "aria-hidden": titleAccess ? void 0 : true,
-    role: titleAccess ? "img" : void 0,
-    ref,
-    ...more,
-    ...other,
-    ...hasSvgAsChild && children.props,
-    ownerState,
-    children: [hasSvgAsChild ? children.props.children : children, titleAccess ? /* @__PURE__ */ jsxRuntimeExports.jsx("title", {
-      children: titleAccess
-    }) : null]
-  });
-});
-SvgIcon.propTypes = {
-  // ┌────────────────────────────── Warning ──────────────────────────────┐
-  // │ These PropTypes are generated from the TypeScript type definitions. │
-  // │    To update them, edit the d.ts file and run `pnpm proptypes`.     │
-  // └─────────────────────────────────────────────────────────────────────┘
-  /**
-   * Node passed into the SVG element.
-   */
-  children: PropTypes.node,
-  /**
-   * Override or extend the styles applied to the component.
-   */
-  classes: PropTypes.object,
-  /**
-   * @ignore
-   */
-  className: PropTypes.string,
-  /**
-   * The color of the component.
-   * It supports both default and custom theme colors, which can be added as shown in the
-   * [palette customization guide](https://mui.com/material-ui/customization/palette/#custom-colors).
-   * You can use the `htmlColor` prop to apply a color attribute to the SVG element.
-   * @default 'inherit'
-   */
-  color: PropTypes.oneOfType([PropTypes.oneOf(["inherit", "action", "disabled", "primary", "secondary", "error", "info", "success", "warning"]), PropTypes.string]),
-  /**
-   * The component used for the root node.
-   * Either a string to use a HTML element or a component.
-   */
-  component: PropTypes.elementType,
-  /**
-   * The fontSize applied to the icon. Defaults to 24px, but can be configure to inherit font size.
-   * @default 'medium'
-   */
-  fontSize: PropTypes.oneOfType([PropTypes.oneOf(["inherit", "large", "medium", "small"]), PropTypes.string]),
-  /**
-   * Applies a color attribute to the SVG element.
-   */
-  htmlColor: PropTypes.string,
-  /**
-   * If `true`, the root node will inherit the custom `component`'s viewBox and the `viewBox`
-   * prop will be ignored.
-   * Useful when you want to reference a custom `component` and have `SvgIcon` pass that
-   * `component`'s viewBox to the root node.
-   * @default false
-   */
-  inheritViewBox: PropTypes.bool,
-  /**
-   * The shape-rendering attribute. The behavior of the different options is described on the
-   * [MDN Web Docs](https://developer.mozilla.org/en-US/docs/Web/SVG/Reference/Attribute/shape-rendering).
-   * If you are having issues with blurry icons you should investigate this prop.
-   */
-  shapeRendering: PropTypes.string,
-  /**
-   * The system prop that allows defining system overrides as well as additional CSS styles.
-   */
-  sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object]),
-  /**
-   * Provides a human-readable title for the element that contains it.
-   * https://www.w3.org/TR/SVG-access/#Equivalent
-   */
-  titleAccess: PropTypes.string,
-  /**
-   * Allows you to redefine what the coordinates without units mean inside an SVG element.
-   * For example, if the SVG element is 500 (width) by 200 (height),
-   * and you pass viewBox="0 0 50 20",
-   * this means that the coordinates inside the SVG will go from the top left corner (0,0)
-   * to bottom right (50,20) and each unit will be worth 10px.
-   * @default '0 0 24 24'
-   */
-  viewBox: PropTypes.string
-};
-SvgIcon.muiName = "SvgIcon";
-function createSvgIcon(path, displayName) {
-  function Component2(props, ref) {
-    return /* @__PURE__ */ jsxRuntimeExports.jsx(SvgIcon, {
-      "data-testid": `${displayName}Icon`,
-      ref,
-      ...props,
-      children: path
-    });
-  }
-  {
-    Component2.displayName = `${displayName}Icon`;
-  }
-  Component2.muiName = SvgIcon.muiName;
-  return /* @__PURE__ */ React$1.memo(/* @__PURE__ */ React$1.forwardRef(Component2));
-}
-function debounce$3(func, wait = 166) {
-  let timeout2;
-  function debounced(...args) {
-    const later = () => {
-      func.apply(this, args);
-    };
-    clearTimeout(timeout2);
-    timeout2 = setTimeout(later, wait);
-  }
-  debounced.clear = () => {
-    clearTimeout(timeout2);
-  };
-  return debounced;
-}
-function ownerDocument(node2) {
-  return node2 && node2.ownerDocument || document;
-}
-function ownerWindow(node2) {
-  const doc = ownerDocument(node2);
-  return doc.defaultView || window;
-}
-function setRef$1(ref, value) {
-  if (typeof ref === "function") {
-    ref(value);
-  } else if (ref) {
-    ref.current = value;
-  }
-}
-let globalId = 0;
-function useGlobalId(idOverride) {
-  const [defaultId, setDefaultId] = React$1.useState(idOverride);
-  const id = idOverride || defaultId;
-  React$1.useEffect(() => {
-    if (defaultId == null) {
-      globalId += 1;
-      setDefaultId(`mui-${globalId}`);
-    }
-  }, [defaultId]);
-  return id;
-}
-const safeReact = {
-  ...React$1
-};
-const maybeReactUseId = safeReact.useId;
-function useId(idOverride) {
-  if (maybeReactUseId !== void 0) {
-    const reactId = maybeReactUseId();
-    return idOverride ?? reactId;
-  }
-  return useGlobalId(idOverride);
-}
-function useEventCallback(fn2) {
-  const ref = React$1.useRef(fn2);
-  useEnhancedEffect$1(() => {
-    ref.current = fn2;
-  });
-  return React$1.useRef((...args) => (
-    // @ts-expect-error hide `this`
-    (0, ref.current)(...args)
-  )).current;
-}
-function useForkRef$1(...refs) {
-  const cleanupRef = React$1.useRef(void 0);
-  const refEffect = React$1.useCallback((instance) => {
-    const cleanups = refs.map((ref) => {
-      if (ref == null) {
-        return null;
-      }
-      if (typeof ref === "function") {
-        const refCallback = ref;
-        const refCleanup = refCallback(instance);
-        return typeof refCleanup === "function" ? refCleanup : () => {
-          refCallback(null);
-        };
-      }
-      ref.current = instance;
-      return () => {
-        ref.current = null;
-      };
-    });
-    return () => {
-      cleanups.forEach((refCleanup) => refCleanup == null ? void 0 : refCleanup());
-    };
-  }, refs);
-  return React$1.useMemo(() => {
-    if (refs.every((ref) => ref == null)) {
-      return null;
-    }
-    return (value) => {
-      if (cleanupRef.current) {
-        cleanupRef.current();
-        cleanupRef.current = void 0;
-      }
-      if (value != null) {
-        cleanupRef.current = refEffect(value);
-      }
-    };
-  }, refs);
-}
 function getTypeByValue(value) {
   const valueType = typeof value;
   switch (valueType) {
@@ -15989,6 +15989,7 @@ List.propTypes = {
   sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object])
 };
 const listItemTextClasses = generateUtilityClasses("MuiListItemText", ["root", "multiline", "dense", "inset", "primary", "secondary"]);
+const listItemIconClasses = generateUtilityClasses("MuiListItemIcon", ["root", "alignItemsFlexStart"]);
 function getScrollbarSize(win = window) {
   const documentWidth = win.document.documentElement.clientWidth;
   return win.innerWidth - documentWidth;
@@ -16237,7 +16238,6 @@ MenuList.propTypes = {
   variant: PropTypes.oneOf(["menu", "selectedMenu"])
 };
 const dividerClasses = generateUtilityClasses("MuiDivider", ["root", "absolute", "fullWidth", "inset", "middle", "flexItem", "light", "vertical", "withChildren", "withChildrenVertical", "textAlignRight", "textAlignLeft", "wrapper", "wrapperVertical"]);
-const listItemIconClasses = generateUtilityClasses("MuiListItemIcon", ["root", "alignItemsFlexStart"]);
 function getMenuItemUtilityClass(slot) {
   return generateUtilityClass("MuiMenuItem", slot);
 }
@@ -28516,6 +28516,23 @@ function atLeastLogLevel(someLevel) {
   const numericTarget = OrderedLogLevels.indexOf(someLevel);
   return currLevel <= numericTarget;
 }
+function extent(values2, valueof) {
+  let min2;
+  let max2;
+  {
+    for (const value of values2) {
+      if (value != null) {
+        if (min2 === void 0) {
+          if (value >= value) min2 = max2 = value;
+        } else {
+          if (min2 > value) min2 = value;
+          if (max2 < value) max2 = value;
+        }
+      }
+    }
+  }
+  return [min2, max2];
+}
 configSchema1_0_0.shape.coordinationSpace.unwrap();
 configSchema1_0_0.shape.layout.element.shape.coordinationScopes.unwrap();
 function upgradeReplaceViewProp(prefix2, view, coordinationSpace) {
@@ -31241,6 +31258,7 @@ const CoordinationType$1 = {
   OBS_SET_HIGHLIGHT: "obsSetHighlight",
   OBS_SET_EXPANSION: "obsSetExpansion",
   OBS_SET_COLOR: "obsSetColor",
+  FEATURE_COLOR: "featureColor",
   FEATURE_HIGHLIGHT: "featureHighlight",
   FEATURE_SELECTION: "featureSelection",
   FEATURE_SET_SELECTION: "featureSetSelection",
@@ -31296,6 +31314,8 @@ const CoordinationType$1 = {
   // Per-spatial-layer
   SPATIAL_MAX_RESOLUTION: "spatialMaxResolution",
   // Per-image-channel (for spatial-accelerated)
+  SPATIAL_LOD_FACTOR: "spatialLodFactor",
+  // LOD factor for 3D volume rendering
   // For clipping plane sliders
   SPATIAL_SLICE_X: "spatialSliceX",
   SPATIAL_SLICE_Y: "spatialSliceY",
@@ -31818,6 +31838,8 @@ const AUTO_INDEPENDENT_COORDINATION_TYPES = [
     CoordinationType$1.OBS_SET_FILTER,
     CoordinationType$1.OBS_SET_HIGHLIGHT,
     CoordinationType$1.OBS_SET_COLOR,
+    CoordinationType$1.FEATURE_COLOR,
+    CoordinationType$1.FEATURE_FILTER_MODE,
     CoordinationType$1.FEATURE_HIGHLIGHT,
     CoordinationType$1.FEATURE_SELECTION,
     CoordinationType$1.FEATURE_VALUE_COLORMAP,
@@ -32032,6 +32054,8 @@ const AUTO_INDEPENDENT_COORDINATION_TYPES = [
     CoordinationType$1.SPATIAL_SPOT_STROKE_WIDTH,
     CoordinationType$1.SPATIAL_LAYER_COLOR,
     CoordinationType$1.OBS_COLOR_ENCODING,
+    CoordinationType$1.FEATURE_COLOR,
+    CoordinationType$1.FEATURE_FILTER_MODE,
     CoordinationType$1.FEATURE_VALUE_COLORMAP,
     CoordinationType$1.FEATURE_VALUE_COLORMAP_RANGE,
     CoordinationType$1.FEATURE_SELECTION,
@@ -32251,7 +32275,7 @@ const AUTO_INDEPENDENT_COORDINATION_TYPES = [
     CoordinationType$1.HIERARCHY_LEVELS
   ]
 });
-const version = "3.8.10";
+const version = "3.9.0";
 const META_VERSION = {
   version
 };
@@ -37274,7 +37298,9 @@ function useMultiDatasetCoordination(parameters, coordinationScopes, coordinatio
 }
 const AUXILIARY_COORDINATION_TYPES_MAP = {
   spatialImageLayer: ["imageLayerCallbacks", "areLoadingImageChannels"],
-  spatialSegmentationLayer: ["segmentationLayerCallbacks", "areLoadingSegmentationChannels"]
+  spatialSegmentationLayer: ["segmentationLayerCallbacks", "areLoadingSegmentationChannels"],
+  spatialAcceleratedVolumeLoadingProgress: ["volumeLoadingProgress"],
+  spatialTiledPointsLoadingProgress: ["tiledPointsLoadingProgress"]
 };
 const mapCoordinationScopes = (coordinationScopes) => {
   const newCoordinationScopes = {};
@@ -44333,23 +44359,6 @@ function createLoaders(datasets, configDescription, fileTypes, coordinationTypes
   });
   return result;
 }
-function extent(values2, valueof) {
-  let min2;
-  let max2;
-  {
-    for (const value of values2) {
-      if (value != null) {
-        if (min2 === void 0) {
-          if (value >= value) min2 = max2 = value;
-        } else {
-          if (min2 > value) min2 = value;
-          if (max2 < value) max2 = value;
-        }
-      }
-    }
-  }
-  return [min2, max2];
-}
 function getWindowDimensions() {
   const { innerWidth: width2, innerHeight: height2 } = window;
   return {
@@ -45548,7 +45557,10 @@ function LoadingIndicator() {
 const useStyles$2 = makeStyles()(() => ({
   paper: {
     maxHeight: 200,
-    overflow: "auto"
+    overflowX: "hidden",
+    overflowY: "auto",
+    paddingLeft: "4px",
+    paddingRight: "4px"
   },
   container: {
     position: "relative",
@@ -47040,7 +47052,7 @@ function useSpotMultiFeatureSelection(coordinationScopes, coordinationScopesBy,
     [
       coordinationScopes,
       coordinationScopesBy,
-      ...Object.values(featureSelectionCoordination[0] || {}).flatMap((layerVal) => layerVal.featureSelection)
+      JSON.stringify(Object.values(featureSelectionCoordination[0] || {}).flatMap((layerVal) => layerVal.featureSelection))
     ]
   );
   const [
@@ -47141,6 +47153,34 @@ function usePointMultiObsLabels(coordinationScopes, coordinationScopesBy, loader
   );
   return [indicesData, indicesDataStatus, indicesDataErrors];
 }
+function usePointMultiObsFeatureMatrixIndices(coordinationScopes, coordinationScopesBy, loaders, dataset) {
+  const obsFeatureMatrixCoordination = useComplexCoordination(
+    [
+      // We currently do not specify obsType or featureValueType here,
+      // since for points we are only interested in the var table
+      // to get the info about each feature (gene).
+      CoordinationType$1.FEATURE_TYPE
+    ],
+    coordinationScopes,
+    coordinationScopesBy,
+    CoordinationType$1.POINT_LAYER
+  );
+  const matchOnObj = useMemo(
+    () => obsFeatureMatrixCoordination[0],
+    // imageCoordination reference changes each render,
+    // use coordinationScopes and coordinationScopesBy which are
+    // indirect dependencies here.
+    [coordinationScopes, coordinationScopesBy]
+  );
+  const [indicesData, indicesDataStatus, indicesDataErrors] = useObsFeatureMatrixIndicesMultiLevel(
+    loaders,
+    dataset,
+    false,
+    matchOnObj,
+    1
+  );
+  return [indicesData, indicesDataStatus, indicesDataErrors];
+}
 function useSegmentationMultiObsLocations(coordinationScopes, coordinationScopesBy, loaders, dataset) {
   const obsTypeCoordination = useComplexCoordinationSecondary(
     [
@@ -47759,6 +47799,7 @@ export {
   useObsSpotsData,
   usePageModeView,
   useStyles as usePlotOptionsStyles,
+  usePointMultiObsFeatureMatrixIndices,
   usePointMultiObsLabels,
   useReady,
   useRemoveImageChannelInMetaCoordinationScopes,

package/dist-tsc/data-hooks-multilevel.d.ts

@@ -43,6 +43,15 @@ export function useSpotMultiObsFeatureMatrixIndices(coordinationScopes: object,
  * @returns {array} [data, status, errors]
  */
 export function usePointMultiObsLabels(coordinationScopes: object, coordinationScopesBy: object, loaders: object, dataset: string): array;
+/**
+ * Wrapper around useObsFeatureMatrixIndicesMultiLevel.
+ * @param {object} coordinationScopes
+ * @param {object} coordinationScopesBy
+ * @param {object} loaders
+ * @param {string} dataset
+ * @returns {array} [indicesData, status, errors]
+ */
+export function usePointMultiObsFeatureMatrixIndices(coordinationScopes: object, coordinationScopesBy: object, loaders: object, dataset: string): array;
 /**
  * Wrapper around useObsLocationsMultiLevel.
  * @param {object} coordinationScopes

package/dist-tsc/data-hooks-multilevel.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"data-hooks-multilevel.d.ts","sourceRoot":"","sources":["../src/data-hooks-multilevel.js"],"names":[],"mappings":"AAeA;;;;;;;GAOG;AACH,yEANW,MAAM,wBACN,MAAM,WACN,MAAM,WACN,MAAM,GACJ,KAAK,CAsDjB;AAED;;;;;;;GAOG;AACH,iEANW,MAAM,wBACN,MAAM,WACN,MAAM,WACN,MAAM,GACJ,KAAK,CA8CjB;AAED;;;;;;;GAOG;AACH,gFANW,MAAM,wBACN,MAAM,WACN,MAAM,WACN,MAAM,GACJ,KAAK,CAyBjB;AAED;;;;;;;GAOG;AACH,wEANW,MAAM,wBACN,MAAM,WACN,MAAM,WACN,MAAM,GACJ,KAAK,CAwBjB;AAED;;;;;;;GAOG;AACH,2DANW,MAAM,wBACN,MAAM,WACN,MAAM,WACN,MAAM,GACJ,KAAK,CAuBjB;AAED;;;;;;;GAOG;AACH,qEANW,MAAM,wBACN,MAAM,WACN,MAAM,WACN,MAAM,GACJ,KAAK,CAuBjB;AAED;;;;;;;GAOG;AACH,gEANW,MAAM,wBACN,MAAM,WACN,MAAM,WACN,MAAM,GACJ,KAAK,CAuBjB"}
+{"version":3,"file":"data-hooks-multilevel.d.ts","sourceRoot":"","sources":["../src/data-hooks-multilevel.js"],"names":[],"mappings":"AAeA;;;;;;;GAOG;AACH,yEANW,MAAM,wBACN,MAAM,WACN,MAAM,WACN,MAAM,GACJ,KAAK,CAsDjB;AAED;;;;;;;GAOG;AACH,iEANW,MAAM,wBACN,MAAM,WACN,MAAM,WACN,MAAM,GACJ,KAAK,CA8CjB;AAED;;;;;;;GAOG;AACH,gFANW,MAAM,wBACN,MAAM,WACN,MAAM,WACN,MAAM,GACJ,KAAK,CAyBjB;AAED;;;;;;;GAOG;AACH,wEANW,MAAM,wBACN,MAAM,WACN,MAAM,WACN,MAAM,GACJ,KAAK,CAwBjB;AAED;;;;;;;GAOG;AACH,2DANW,MAAM,wBACN,MAAM,WACN,MAAM,WACN,MAAM,GACJ,KAAK,CAuBjB;AAED;;;;;;;GAOG;AACH,yEANW,MAAM,wBACN,MAAM,WACN,MAAM,WACN,MAAM,GACJ,KAAK,CAyBjB;AAED;;;;;;;GAOG;AACH,qEANW,MAAM,wBACN,MAAM,WACN,MAAM,WACN,MAAM,GACJ,KAAK,CAuBjB;AAED;;;;;;;GAOG;AACH,gEANW,MAAM,wBACN,MAAM,WACN,MAAM,WACN,MAAM,GACJ,KAAK,CAuBjB"}

package/dist-tsc/data-hooks-multilevel.js

@@ -70,8 +70,8 @@ export function useSpotMultiFeatureSelection(coordinationScopes, coordinationSco
     ]))), 
     // Need to execute this more frequently, whenever the featureSelections update.
     [coordinationScopes, coordinationScopesBy,
-        ...Object.values(featureSelectionCoordination[0] || {})
-            .flatMap(layerVal => layerVal.featureSelection),
+        JSON.stringify(Object.values(featureSelectionCoordination[0] || {})
+            .flatMap(layerVal => layerVal.featureSelection)),
     ]);
     const [featureData, loadedSelections, extents, normData, featureStatus, errors,] = useFeatureSelectionMultiLevel(loaders, dataset, false, matchOnObj, selections, 1);
     return [featureData, loadedSelections, extents, normData, featureStatus, errors];
@@ -141,6 +141,29 @@ export function usePointMultiObsLabels(coordinationScopes, coordinationScopesBy,
     const [indicesData, indicesDataStatus, indicesDataErrors] = useObsLabelsMultiLevel(loaders, dataset, false, matchOnObj, 1);
     return [indicesData, indicesDataStatus, indicesDataErrors];
 }
+/**
+ * Wrapper around useObsFeatureMatrixIndicesMultiLevel.
+ * @param {object} coordinationScopes
+ * @param {object} coordinationScopesBy
+ * @param {object} loaders
+ * @param {string} dataset
+ * @returns {array} [indicesData, status, errors]
+ */
+export function usePointMultiObsFeatureMatrixIndices(coordinationScopes, coordinationScopesBy, loaders, dataset) {
+    const obsFeatureMatrixCoordination = useComplexCoordination([
+        // We currently do not specify obsType or featureValueType here,
+        // since for points we are only interested in the var table
+        // to get the info about each feature (gene).
+        CoordinationType.FEATURE_TYPE,
+    ], coordinationScopes, coordinationScopesBy, CoordinationType.POINT_LAYER);
+    const matchOnObj = useMemo(() => obsFeatureMatrixCoordination[0], 
+    // imageCoordination reference changes each render,
+    // use coordinationScopes and coordinationScopesBy which are
+    // indirect dependencies here.
+    [coordinationScopes, coordinationScopesBy]);
+    const [indicesData, indicesDataStatus, indicesDataErrors] = useObsFeatureMatrixIndicesMultiLevel(loaders, dataset, false, matchOnObj, 1);
+    return [indicesData, indicesDataStatus, indicesDataErrors];
+}
 /**
  * Wrapper around useObsLocationsMultiLevel.
  * @param {object} coordinationScopes

package/dist-tsc/index.d.ts

@@ -9,7 +9,7 @@ export { createOnDrop } from "./on-drop.js";
 export { useReady, useUrls, useVitessceContainer, useDeckCanvasSize, useUint8ObsFeatureMatrix, useUint8FeatureSelection, useExpressionValueGetter, useGetObsMembership, useGetObsInfo, useClosestVitessceContainerSize, useWindowDimensions, useGridItemSize, useExpandedFeatureLabelsMap, useColumnNameMapping } from "./hooks.js";
 export { useCoordinationScopes, useCoordinationScopesBy, useInitialCoordination, useCoordination, useComplexCoordination, useComplexCoordinationSecondary, useMultiCoordinationScopes, useMultiCoordinationScopesNonNull, useMultiCoordinationScopesSecondary, useMultiCoordinationScopesSecondaryNonNull, useMultiCoordinationValues, useMultiDatasetCoordination, useDatasetUids, useLoaders, useMergeCoordination, useMatchingLoader, useViewConfigStore, useViewConfigStoreApi, useViewConfig, useSetViewConfig, useComponentHover, useSetComponentHover, useComponentViewInfo, useSetComponentViewInfo, useWarning, useSetWarning, useAuxiliaryCoordination, useComponentLayout, useRemoveImageChannelInMetaCoordinationScopes, useAddImageChannelInMetaCoordinationScopes } from "./state/hooks.js";
 export { useDescription, useImageData, useObsSetsData, useObsEmbeddingData, useFeatureSelection, useObsFeatureMatrixIndices, useSampleSetsData, useSampleEdgesData, useMultiObsLabels, useMultiObsSpots, useMultiObsPoints, useSpotMultiObsSets, useSpotMultiFeatureLabels, useMultiObsSegmentations, useMultiImages, useObsSpotsData, useObsPointsData, useObsLocationsData, useObsSegmentationsData, useNeighborhoodsData, useObsLabelsData, useObsFeatureMatrixData, useFeatureLabelsData, useGenomicProfilesData, useComparisonMetadata, useFeatureStatsData, useFeatureSetStatsData, useObsSetStatsData } from "./data-hooks.js";
-export { usePointMultiObsLabels, useSpotMultiFeatureSelection, useSpotMultiObsFeatureMatrixIndices, useSegmentationMultiFeatureSelection, useSegmentationMultiObsFeatureMatrixIndices, useSegmentationMultiObsLocations, useSegmentationMultiObsSets } from "./data-hooks-multilevel.js";
+export { usePointMultiObsLabels, usePointMultiObsFeatureMatrixIndices, useSpotMultiFeatureSelection, useSpotMultiObsFeatureMatrixIndices, useSegmentationMultiFeatureSelection, useSegmentationMultiObsFeatureMatrixIndices, useSegmentationMultiObsLocations, useSegmentationMultiObsSets } from "./data-hooks-multilevel.js";
 export { CellColorEncodingOption, OptionsContainer, OptionSelect, usePlotOptionsStyles } from "./shared-plot-options/index.js";
 export { useAsyncFunction, usePageModeView } from "./contexts.js";
 //# sourceMappingURL=index.d.ts.map

package/dist-tsc/index.js

@@ -6,7 +6,7 @@ export { PopperMenu } from './shared-mui/components.js';
 export { useReady, useUrls, useVitessceContainer, useDeckCanvasSize, useUint8ObsFeatureMatrix, useUint8FeatureSelection, useExpressionValueGetter, useGetObsMembership, useGetObsInfo, useClosestVitessceContainerSize, useWindowDimensions, useGridItemSize, useExpandedFeatureLabelsMap, useColumnNameMapping, } from './hooks.js';
 export { useCoordinationScopes, useCoordinationScopesBy, useInitialCoordination, useCoordination, useComplexCoordination, useComplexCoordinationSecondary, useMultiCoordinationScopes, useMultiCoordinationScopesNonNull, useMultiCoordinationScopesSecondary, useMultiCoordinationScopesSecondaryNonNull, useMultiCoordinationValues, useMultiDatasetCoordination, useDatasetUids, useLoaders, useMergeCoordination, useMatchingLoader, useViewConfigStore, useViewConfigStoreApi, useViewConfig, useSetViewConfig, useComponentHover, useSetComponentHover, useComponentViewInfo, useSetComponentViewInfo, useWarning, useSetWarning, useAuxiliaryCoordination, useComponentLayout, useRemoveImageChannelInMetaCoordinationScopes, useAddImageChannelInMetaCoordinationScopes, } from './state/hooks.js';
 export { useDescription, useImageData, useObsSetsData, useObsEmbeddingData, useFeatureSelection, useObsFeatureMatrixIndices, useSampleSetsData, useSampleEdgesData, useMultiObsLabels, useMultiObsSpots, useMultiObsPoints, useSpotMultiObsSets, useSpotMultiFeatureLabels, useMultiObsSegmentations, useMultiImages, useObsSpotsData, useObsPointsData, useObsLocationsData, useObsSegmentationsData, useNeighborhoodsData, useObsLabelsData, useObsFeatureMatrixData, useFeatureLabelsData, useGenomicProfilesData, useComparisonMetadata, useFeatureStatsData, useFeatureSetStatsData, useObsSetStatsData, } from './data-hooks.js';
-export { usePointMultiObsLabels, useSpotMultiFeatureSelection, useSpotMultiObsFeatureMatrixIndices, useSegmentationMultiFeatureSelection, useSegmentationMultiObsFeatureMatrixIndices, useSegmentationMultiObsLocations, useSegmentationMultiObsSets, } from './data-hooks-multilevel.js';
+export { usePointMultiObsLabels, usePointMultiObsFeatureMatrixIndices, useSpotMultiFeatureSelection, useSpotMultiObsFeatureMatrixIndices, useSegmentationMultiFeatureSelection, useSegmentationMultiObsFeatureMatrixIndices, useSegmentationMultiObsLocations, useSegmentationMultiObsSets, } from './data-hooks-multilevel.js';
 export { useHasLoader, } from './data-hook-utils.js';
 export { CellColorEncodingOption, OptionsContainer, OptionSelect, usePlotOptionsStyles, } from './shared-plot-options/index.js';
 export { logConfig } from './view-config-utils.js';

package/dist-tsc/shared-mui/components.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"components.d.ts","sourceRoot":"","sources":["../../src/shared-mui/components.js"],"names":[],"mappings":"AAyBA,oDAkEC"}
+{"version":3,"file":"components.d.ts","sourceRoot":"","sources":["../../src/shared-mui/components.js"],"names":[],"mappings":"AA4BA,oDAkEC"}

package/dist-tsc/shared-mui/components.js

@@ -6,7 +6,10 @@ import { useVitessceContainer } from '../hooks.js';
 const useStyles = makeStyles()(() => ({
     paper: {
         maxHeight: 200,
-        overflow: 'auto',
+        overflowX: 'hidden',
+        overflowY: 'auto',
+        paddingLeft: '4px',
+        paddingRight: '4px',
     },
     container: {
         position: 'relative',

package/dist-tsc/state/hooks.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"hooks.d.ts","sourceRoot":"","sources":["../../src/state/hooks.js"],"names":[],"mappings":"AA8BA,4DAiBC;AAED,6CAMC;AACD,uDAOC;AAED,8DAEC;AAGD,2DAiBC;AAED,4CAMC;AACD,sDAOC;AAED,6DAEC;AAID;;;;;;GAMG;AACH,8CAJW,GAAC,mBAEC,MAAM,GAAC,SAAS,CA4B5B;AAED;;;;;;;GAOG;AACH,gDALW,GAAC,wBACD,GAAC,qBAEC,MAAM,GAAC,SAAS,CA0C5B;AAED;;;;;GAKG;AACH,6CAJW,MAAM,sBACN,GAAC,GACC,MAAM,GAAC,SAAS,CAI5B;AAED;;;;;;GAMG;AACH,+CALW,MAAM,mDACN,GAAC,wBACD,GAAC,GACC,MAAM,GAAC,SAAS,CAc5B;AAySD;;;;;;;;;GASG;AACH,mDALW,MAAM,EAAE,sBACR,MAAM,GAEJ,MAAM,CAclB;AAED;;;;;;;;;;;;;;;GAeG;AACH,4CATW,MAAM,EAAE,sBACR,MAAM,GAEJ,KAAK,CAmCjB;AAED,yFAKC;AAED,gGAqBC;AAED,0IA4BC;AAED,iJAkEC;AAED,yFAmBC;AAED;;;;GAIG;AACH,mDAHW,MAAM,GACJ,MAAM,CAIlB;AAED;;;;;;;;;;;;;GAaG;AACH,mDAXW,MAAM,EAAE,sBACR,MAAM,wBACN,MAAM,UAEN,MAAM,GAEJ,KAAK,CA2EjB;AAED;;;;;GAKG;AACH,0DAHW,MAAM,GACJ,MAAM,CAiBlB;AAED;;;;;;GAMG;AACH,4DAJW,MAAM,wBACN,MAAM,GACJ,MAAM,CAgBlB;AAED;;;;;;;GAOG;AACH,4DANW,MAAM,EAAE,iDACR,MAAM,eACN,MAAM,iBACN,MAAM,SAuEhB;AAGD;;;;;;;;;;;GAWG;AACH,wDATW,MAAM,EAAE,sBACR,MAAM,wBACN,MAAM,GAEJ,KAAK,CAUjB;AA6BD;;;;;;;;;;;;;;;GAeG;AACH,qDATW,MAAM,EAAE,sBACR,MAAM,GAEJ,KAAK,CAgCjB;AAED;;;;;GAKG;AACH,8BAHa,MAAM,CAKlB;AAGD;;;;;;;;;;;;GAYG;AACH,2CARW,MAAM,WACN,MAAM,YACN,MAAM,0BACN,MAAM,OAoBhB;AAED;;;;;;;;;;;;GAYG;AACH,2CARW,MAAM,WACN,MAAM,YACN,MAAM,0BACN,MAAM,OAShB;AAED;;;;;GAKG;AACH,6BAHa,MAAM,EAAE,CAKpB;AAED;;;;;GAKG;AACH,+CAEC;AAED;;;;;GAKG;AACH,0EAEC;AAED;;;;;GAKG;AACH,uEAEC;AAED;;;;;GAKG;AACH,4CAEC;AAED;;;;;GAKG;AACH,0CAEC;AAED;;;;;GAKG;AACH,iDAEC;AAED;;;;;GAKG;AACH,iCAHa,MAAM,CAKlB;AAED;;;;;GAKG;AACH,oEAIC;AAGD;;;;;GAKG;AACH,qCAHa,MAAM,CAKlB;AAED;;;;;GAKG;AACH,iDAEC;AAED;;;;;GAKG;AACH,8BAHa,MAAM,CAKlB;AAED;;;;;GAKG;AACH,0CAEC;AAED;;;;;GAKG;AACH,iDAHa,MAAM,CAKlB;AAED;;;;;GAKG;AACH,6DAOC;AAED;;;;GAIG;AACH,iCAFa,MAAM,CAIlB;AAED;;;;;GAKG;AACH,8CAEC;AAzhCM,yFA4LH;AAOG,0FAFM,MAAM,CAOlB;AAcM,iDAUJ"}
+{"version":3,"file":"hooks.d.ts","sourceRoot":"","sources":["../../src/state/hooks.js"],"names":[],"mappings":"AA8BA,4DAiBC;AAED,6CAMC;AACD,uDAOC;AAED,8DAEC;AAGD,2DAiBC;AAED,4CAMC;AACD,sDAOC;AAED,6DAEC;AAID;;;;;;GAMG;AACH,8CAJW,GAAC,mBAEC,MAAM,GAAC,SAAS,CA4B5B;AAED;;;;;;;GAOG;AACH,gDALW,GAAC,wBACD,GAAC,qBAEC,MAAM,GAAC,SAAS,CA0C5B;AAED;;;;;GAKG;AACH,6CAJW,MAAM,sBACN,GAAC,GACC,MAAM,GAAC,SAAS,CAI5B;AAED;;;;;;GAMG;AACH,+CALW,MAAM,mDACN,GAAC,wBACD,GAAC,GACC,MAAM,GAAC,SAAS,CAc5B;AAySD;;;;;;;;;GASG;AACH,mDALW,MAAM,EAAE,sBACR,MAAM,GAEJ,MAAM,CAclB;AAED;;;;;;;;;;;;;;;GAeG;AACH,4CATW,MAAM,EAAE,sBACR,MAAM,GAEJ,KAAK,CAmCjB;AAED,yFAKC;AAED,gGAqBC;AAED,0IA4BC;AAED,iJAkEC;AAED,yFAmBC;AAED;;;;GAIG;AACH,mDAHW,MAAM,GACJ,MAAM,CAIlB;AAED;;;;;;;;;;;;;GAaG;AACH,mDAXW,MAAM,EAAE,sBACR,MAAM,wBACN,MAAM,UAEN,MAAM,GAEJ,KAAK,CA2EjB;AAED;;;;;GAKG;AACH,0DAHW,MAAM,GACJ,MAAM,CAiBlB;AAED;;;;;;GAMG;AACH,4DAJW,MAAM,wBACN,MAAM,GACJ,MAAM,CAgBlB;AAED;;;;;;;GAOG;AACH,4DANW,MAAM,EAAE,iDACR,MAAM,eACN,MAAM,iBACN,MAAM,SAuEhB;AAGD;;;;;;;;;;;GAWG;AACH,wDATW,MAAM,EAAE,sBACR,MAAM,wBACN,MAAM,GAEJ,KAAK,CAUjB;AA+BD;;;;;;;;;;;;;;;GAeG;AACH,qDATW,MAAM,EAAE,sBACR,MAAM,GAEJ,KAAK,CAiCjB;AAED;;;;;GAKG;AACH,8BAHa,MAAM,CAKlB;AAGD;;;;;;;;;;;;GAYG;AACH,2CARW,MAAM,WACN,MAAM,YACN,MAAM,0BACN,MAAM,OAoBhB;AAED;;;;;;;;;;;;GAYG;AACH,2CARW,MAAM,WACN,MAAM,YACN,MAAM,0BACN,MAAM,OAShB;AAED;;;;;GAKG;AACH,6BAHa,MAAM,EAAE,CAKpB;AAED;;;;;GAKG;AACH,+CAEC;AAED;;;;;GAKG;AACH,0EAEC;AAED;;;;;GAKG;AACH,uEAEC;AAED;;;;;GAKG;AACH,4CAEC;AAED;;;;;GAKG;AACH,0CAEC;AAED;;;;;GAKG;AACH,iDAEC;AAED;;;;;GAKG;AACH,iCAHa,MAAM,CAKlB;AAED;;;;;GAKG;AACH,oEAIC;AAGD;;;;;GAKG;AACH,qCAHa,MAAM,CAKlB;AAED;;;;;GAKG;AACH,iDAEC;AAED;;;;;GAKG;AACH,8BAHa,MAAM,CAKlB;AAED;;;;;GAKG;AACH,0CAEC;AAED;;;;;GAKG;AACH,iDAHa,MAAM,CAKlB;AAED;;;;;GAKG;AACH,6DAOC;AAED;;;;GAIG;AACH,iCAFa,MAAM,CAIlB;AAED;;;;;GAKG;AACH,8CAEC;AA5hCM,yFA4LH;AAOG,0FAFM,MAAM,CAOlB;AAcM,iDAUJ"}

package/dist-tsc/state/hooks.js

@@ -861,6 +861,8 @@ export function useMultiDatasetCoordination(parameters, coordinationScopes, coor
 const AUXILIARY_COORDINATION_TYPES_MAP = {
     spatialImageLayer: ['imageLayerCallbacks', 'areLoadingImageChannels'],
     spatialSegmentationLayer: ['segmentationLayerCallbacks', 'areLoadingSegmentationChannels'],
+    spatialAcceleratedVolumeLoadingProgress: ['volumeLoadingProgress'],
+    spatialTiledPointsLoadingProgress: ['tiledPointsLoadingProgress'],
 };
 /**
  * The maps the coordination types of incoming scopes to new types

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vitessce/vit-s",
-  "version": "3.8.10",
+  "version": "3.9.0",
   "author": "HIDIVE Lab at HMS",
   "homepage": "http://vitessce.io",
   "repository": {
@@ -30,16 +30,16 @@
     "react-error-boundary": "^5.0.0",
     "@placemarkio/flat-drop-files": "^1.0.2",
     "zarrita": "0.5.4",
-    "@vitessce/styles": "3.8.10",
-    "@vitessce/abstract": "3.8.10",
-    "@vitessce/error": "3.8.10",
-    "@vitessce/constants-internal": "3.8.10",
-    "@vitessce/plugins": "3.8.10",
-    "@vitessce/schemas": "3.8.10",
-    "@vitessce/utils": "3.8.10",
-    "@vitessce/sets-utils": "3.8.10",
-    "@vitessce/config": "3.8.10",
-    "@vitessce/globals": "3.8.10"
+    "@vitessce/styles": "3.9.0",
+    "@vitessce/error": "3.9.0",
+    "@vitessce/constants-internal": "3.9.0",
+    "@vitessce/abstract": "3.9.0",
+    "@vitessce/utils": "3.9.0",
+    "@vitessce/schemas": "3.9.0",
+    "@vitessce/sets-utils": "3.9.0",
+    "@vitessce/plugins": "3.9.0",
+    "@vitessce/config": "3.9.0",
+    "@vitessce/globals": "3.9.0"
   },
   "devDependencies": {
     "@testing-library/jest-dom": "^6.6.3",
@@ -48,7 +48,7 @@
     "react-dom": "18.3.1",
     "vite": "^7.0.0",
     "vitest": "^3.1.4",
-    "@vitessce/types": "3.8.10"
+    "@vitessce/types": "3.9.0"
   },
   "peerDependencies": {
     "react": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0"

package/src/data-hooks-multilevel.js

@@ -118,8 +118,8 @@ export function useSpotMultiFeatureSelection(
   ),
   // Need to execute this more frequently, whenever the featureSelections update.
   [coordinationScopes, coordinationScopesBy,
-    ...Object.values(featureSelectionCoordination[0] || {})
-      .flatMap(layerVal => layerVal.featureSelection),
+    JSON.stringify(Object.values(featureSelectionCoordination[0] || {})
+      .flatMap(layerVal => layerVal.featureSelection)),
   ]);
   const [
     featureData, loadedSelections, extents, normData, featureStatus, errors,
@@ -225,6 +225,39 @@ export function usePointMultiObsLabels(
   return [indicesData, indicesDataStatus, indicesDataErrors];
 }
 
+/**
+ * Wrapper around useObsFeatureMatrixIndicesMultiLevel.
+ * @param {object} coordinationScopes
+ * @param {object} coordinationScopesBy
+ * @param {object} loaders
+ * @param {string} dataset
+ * @returns {array} [indicesData, status, errors]
+ */
+export function usePointMultiObsFeatureMatrixIndices(
+  coordinationScopes, coordinationScopesBy, loaders, dataset,
+) {
+  const obsFeatureMatrixCoordination = useComplexCoordination(
+    [
+      // We currently do not specify obsType or featureValueType here,
+      // since for points we are only interested in the var table
+      // to get the info about each feature (gene).
+      CoordinationType.FEATURE_TYPE,
+    ],
+    coordinationScopes,
+    coordinationScopesBy,
+    CoordinationType.POINT_LAYER,
+  );
+  const matchOnObj = useMemo(() => obsFeatureMatrixCoordination[0],
+    // imageCoordination reference changes each render,
+    // use coordinationScopes and coordinationScopesBy which are
+    // indirect dependencies here.
+    [coordinationScopes, coordinationScopesBy]);
+  const [indicesData, indicesDataStatus, indicesDataErrors] = useObsFeatureMatrixIndicesMultiLevel(
+    loaders, dataset, false, matchOnObj, 1,
+  );
+  return [indicesData, indicesDataStatus, indicesDataErrors];
+}
+
 /**
  * Wrapper around useObsLocationsMultiLevel.
  * @param {object} coordinationScopes

package/src/index.js

@@ -86,6 +86,7 @@ export {
 } from './data-hooks.js';
 export {
   usePointMultiObsLabels,
+  usePointMultiObsFeatureMatrixIndices,
   useSpotMultiFeatureSelection,
   useSpotMultiObsFeatureMatrixIndices,
   useSegmentationMultiFeatureSelection,

package/src/shared-mui/components.js

@@ -14,7 +14,10 @@ import { useVitessceContainer } from '../hooks.js';
 const useStyles = makeStyles()(() => ({
   paper: {
     maxHeight: 200,
-    overflow: 'auto',
+    overflowX: 'hidden',
+    overflowY: 'auto',
+    paddingLeft: '4px',
+    paddingRight: '4px',
   },
   container: {
     position: 'relative',

package/src/state/hooks.js

@@ -982,6 +982,8 @@ export function useMultiDatasetCoordination(parameters, coordinationScopes, coor
 const AUXILIARY_COORDINATION_TYPES_MAP = {
   spatialImageLayer: ['imageLayerCallbacks', 'areLoadingImageChannels'],
   spatialSegmentationLayer: ['segmentationLayerCallbacks', 'areLoadingSegmentationChannels'],
+  spatialAcceleratedVolumeLoadingProgress: ['volumeLoadingProgress'],
+  spatialTiledPointsLoadingProgress: ['tiledPointsLoadingProgress'],
 };
 
 /**
@@ -1047,6 +1049,7 @@ export function useAuxiliaryCoordination(parameters, coordinationScopes) {
   // eslint-disable-next-line react-hooks/exhaustive-deps
   })), [parameters, coordinationScopes]);
 
+
   return [values, setters];
 }