@aics/vole-app 3.3.0 → 3.4.0

package/es/aics-image-viewer/state/test/test_data.js

@@ -0,0 +1,168 @@
+import { ImageType, RenderMode, ViewMode } from "../../shared/enums";
+export var DEFAULT_TEST_VIEWER_STATE = {
+  viewMode: ViewMode.threeD,
+  // "XY", "XZ", "YZ"
+  renderMode: RenderMode.volumetric,
+  // "pathtrace", "maxproject"
+  imageType: ImageType.segmentedCell,
+  showAxes: false,
+  showBoundingBox: false,
+  backgroundColor: [0, 0, 0],
+  boundingBoxColor: [255, 255, 255],
+  autorotate: false,
+  maskAlpha: 0,
+  brightness: 70,
+  density: 50,
+  levels: [35, 140, 255],
+  interpolationEnabled: true,
+  region: {
+    x: [0, 1],
+    y: [0, 1],
+    z: [0, 1]
+  },
+  slice: {
+    x: 0.5,
+    y: 0.5,
+    z: 0.5
+  },
+  time: 0,
+  scene: 0,
+  cameraState: undefined,
+  singleChannelMode: false,
+  singleChannelIndex: 0,
+  useExactScaleLevel: false,
+  scaleLevelIndex: 0
+};
+export var SERIALIZED_DEFAULT_TEST_VIEWER_STATE = {
+  mode: "volumetric",
+  view: "3D",
+  image: "cell",
+  axes: "0",
+  bb: "0",
+  bgcol: "000000",
+  bbcol: "ffffff",
+  rot: "0",
+  mask: "0",
+  bright: "70",
+  dens: "50",
+  lvl: "35,140,255",
+  interp: "1",
+  reg: "0:1,0:1,0:1",
+  slice: "0.5,0.5,0.5",
+  t: "0",
+  scene: "0",
+  scm: "0",
+  sci: "0",
+  esl: "0",
+  scl: "0"
+};
+export var CUSTOM_TEST_VIEWER_STATE = {
+  renderMode: RenderMode.pathTrace,
+  viewMode: ViewMode.xy,
+  imageType: ImageType.fullField,
+  showAxes: true,
+  showBoundingBox: true,
+  backgroundColor: [255, 0, 0],
+  boundingBoxColor: [0, 255, 0],
+  autorotate: true,
+  maskAlpha: 55,
+  brightness: 100,
+  density: 75,
+  levels: [0, 250, 251],
+  interpolationEnabled: false,
+  region: {
+    x: [0, 0.5],
+    y: [0, 1],
+    z: [0, 1]
+  },
+  slice: {
+    x: 0.25,
+    y: 0.75,
+    z: 0.5
+  },
+  time: 100,
+  scene: 3,
+  singleChannelMode: true,
+  singleChannelIndex: 3,
+  useExactScaleLevel: true,
+  scaleLevelIndex: 3,
+  cameraState: {
+    position: [-1.05, -4, 45],
+    target: [0, 0, 0],
+    up: [0, 1, 0],
+    orthoScale: 3.534,
+    fov: 43.5
+  }
+};
+export var SERIALIZED_CUSTOM_TEST_VIEWER_STATE = {
+  mode: "pathtrace",
+  view: "Z",
+  image: "fov",
+  axes: "1",
+  bb: "1",
+  bgcol: "ff0000",
+  bbcol: "00ff00",
+  rot: "1",
+  mask: "55",
+  bright: "100",
+  dens: "75",
+  lvl: "0,250,251",
+  interp: "0",
+  reg: "0:0.5,0:1,0:1",
+  slice: "0.25,0.75,0.5",
+  t: "100",
+  scene: "3",
+  scm: "1",
+  sci: "3",
+  esl: "1",
+  scl: "3",
+  cam: "pos:-1.05:-4:45,tar:0:0:0,up:0:1:0,ort:3.534,fov:43.5"
+};
+export var DEFAULT_TEST_CHANNEL_STATE = {
+  name: "",
+  displayName: "",
+  color: [255, 0, 0],
+  volumeEnabled: true,
+  isosurfaceEnabled: true,
+  isovalue: 128,
+  opacity: 0.75,
+  colorizeEnabled: true,
+  colorizeAlpha: 0.5,
+  useControlPoints: false,
+  controlPoints: [{
+    x: 0,
+    opacity: 0.5,
+    color: [255, 255, 255]
+  }, {
+    x: 255,
+    opacity: 1.0,
+    color: [50, 100, 150]
+  }],
+  ramp: [0, 255],
+  plotMin: 0,
+  plotMax: 255,
+  keepIntensityRange: false
+};
+export var SERIALIZED_DEFAULT_TEST_CHANNEL_STATE = {
+  col: "ff0000",
+  ven: "1",
+  sen: "1",
+  isv: "128",
+  isa: "0.75",
+  clz: "1",
+  cza: "0.5",
+  cpe: "0",
+  cpt: "0:0.5:1:255:1:326496",
+  ram: "0:255",
+  pin: "0"
+};
+export var DEFAULT_TEST_VIEWER_CHANNEL_SETTING = {
+  match: 0,
+  color: undefined,
+  enabled: undefined,
+  surfaceEnabled: undefined,
+  isovalue: undefined,
+  surfaceOpacity: undefined,
+  colorizeEnabled: undefined,
+  colorizeAlpha: undefined
+};

package/es/aics-image-viewer/state/types.js

@@ -1 +1,265 @@
-export {};
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+var _ViewerStateKeys$View, _ViewerStateKeys$Mode, _ViewerStateKeys$Mask, _ViewerStateKeys$Imag, _ViewerStateKeys$Axes, _ViewerStateKeys$Boun, _ViewerStateKeys$Sing, _ViewerStateKeys$Sing2, _ViewerStateKeys$Boun2, _ViewerStateKeys$Back, _ViewerStateKeys$Auto, _ViewerStateKeys$Brig, _ViewerStateKeys$Dens, _ViewerStateKeys$Leve, _ViewerStateKeys$Inte, _ViewerStateKeys$Regi, _ViewerStateKeys$Slic, _ViewerStateKeys$Time, _ViewerStateKeys$Scen, _ViewerStateKeys$UseE, _ViewerStateKeys$Scal, _ViewerStateKeys$Came, _ViewerChannelSetting, _ViewerChannelSetting2, _ViewerChannelSetting3, _ViewerChannelSetting4, _ViewerChannelSetting5, _ViewerChannelSetting6, _ViewerChannelSetting7, _ViewerChannelSetting8, _ViewerChannelSetting9, _ViewerChannelSetting10, _ViewerChannelSetting11, _ViewerChannelSetting12, _ViewerChannelSetting13, _ViewerChannelSetting14;
+function _defineProperties(e, r) { for (var t = 0; t < r.length; t++) { var o = r[t]; o.enumerable = o.enumerable || !1, o.configurable = !0, "value" in o && (o.writable = !0), Object.defineProperty(e, _toPropertyKey(o.key), o); } }
+function _createClass(e, r, t) { return r && _defineProperties(e.prototype, r), t && _defineProperties(e, t), Object.defineProperty(e, "prototype", { writable: !1 }), e; }
+function _classCallCheck(a, n) { if (!(a instanceof n)) throw new TypeError("Cannot call a class as a function"); }
+function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
+function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+/** Global (not per-channel) viewer state which may be changed in the UI */
+
+/**
+ * Enum keys for serialized viewer settings. These are stored as enums for
+ * better readability, and are mapped to types in `ViewerStateParams`.
+ */
+export var ViewerStateKeys = /*#__PURE__*/function (ViewerStateKeys) {
+  ViewerStateKeys["View"] = "view";
+  ViewerStateKeys["Mode"] = "mode";
+  ViewerStateKeys["Mask"] = "mask";
+  ViewerStateKeys["Image"] = "image";
+  ViewerStateKeys["Axes"] = "axes";
+  ViewerStateKeys["BoundingBox"] = "bb";
+  ViewerStateKeys["BoundingBoxColor"] = "bbcol";
+  ViewerStateKeys["BackgroundColor"] = "bgcol";
+  ViewerStateKeys["Autorotate"] = "rot";
+  ViewerStateKeys["Brightness"] = "bright";
+  ViewerStateKeys["Density"] = "dens";
+  ViewerStateKeys["Levels"] = "lvl";
+  ViewerStateKeys["Interpolation"] = "interp";
+  ViewerStateKeys["Region"] = "reg";
+  ViewerStateKeys["Slice"] = "slice";
+  ViewerStateKeys["Time"] = "t";
+  ViewerStateKeys["Scene"] = "scene";
+  ViewerStateKeys["CameraState"] = "cam";
+  ViewerStateKeys["SingleChannelMode"] = "scm";
+  ViewerStateKeys["SingleChannelIndex"] = "sci";
+  ViewerStateKeys["UseExactScaleLevel"] = "esl";
+  ViewerStateKeys["ScaleLevelIndex"] = "scl";
+  return ViewerStateKeys;
+}({});
+export var CameraTransformKeys = /*#__PURE__*/function (CameraTransformKeys) {
+  CameraTransformKeys["Position"] = "pos";
+  CameraTransformKeys["Target"] = "tar";
+  CameraTransformKeys["Up"] = "up";
+  CameraTransformKeys["OrthoScale"] = "ort";
+  CameraTransformKeys["Fov"] = "fov";
+  return CameraTransformKeys;
+}({});
+
+/** Serialized version of `ViewerState`. */
+_ViewerStateKeys$View = ViewerStateKeys.View;
+_ViewerStateKeys$Mode = ViewerStateKeys.Mode;
+_ViewerStateKeys$Mask = ViewerStateKeys.Mask;
+_ViewerStateKeys$Imag = ViewerStateKeys.Image;
+_ViewerStateKeys$Axes = ViewerStateKeys.Axes;
+_ViewerStateKeys$Boun = ViewerStateKeys.BoundingBox;
+_ViewerStateKeys$Sing = ViewerStateKeys.SingleChannelMode;
+_ViewerStateKeys$Sing2 = ViewerStateKeys.SingleChannelIndex;
+_ViewerStateKeys$Boun2 = ViewerStateKeys.BoundingBoxColor;
+_ViewerStateKeys$Back = ViewerStateKeys.BackgroundColor;
+_ViewerStateKeys$Auto = ViewerStateKeys.Autorotate;
+_ViewerStateKeys$Brig = ViewerStateKeys.Brightness;
+_ViewerStateKeys$Dens = ViewerStateKeys.Density;
+_ViewerStateKeys$Leve = ViewerStateKeys.Levels;
+_ViewerStateKeys$Inte = ViewerStateKeys.Interpolation;
+_ViewerStateKeys$Regi = ViewerStateKeys.Region;
+_ViewerStateKeys$Slic = ViewerStateKeys.Slice;
+_ViewerStateKeys$Time = ViewerStateKeys.Time;
+_ViewerStateKeys$Scen = ViewerStateKeys.Scene;
+_ViewerStateKeys$UseE = ViewerStateKeys.UseExactScaleLevel;
+_ViewerStateKeys$Scal = ViewerStateKeys.ScaleLevelIndex;
+_ViewerStateKeys$Came = ViewerStateKeys.CameraState;
+export var ViewerStateParams = /*#__PURE__*/_createClass(function ViewerStateParams() {
+  _classCallCheck(this, ViewerStateParams);
+  /** Axis to view. Valid values are "3D", "X", "Y", and "Z". Defaults to "3D". */
+  _defineProperty(this, _ViewerStateKeys$View, undefined);
+  /**
+   * Render mode. Valid values are "volumetric", "maxproject", and "pathtrace".
+   * Defaults to "volumetric".
+   */
+  _defineProperty(this, _ViewerStateKeys$Mode, undefined);
+  /** The opacity of the mask channel, an integer in the range [0, 100]. Defaults to 50. */
+  _defineProperty(this, _ViewerStateKeys$Mask, undefined);
+  /** The type of image to display. Valid values are "cell" and "fov". Defaults to "cell". */
+  _defineProperty(this, _ViewerStateKeys$Imag, undefined);
+  /** Whether to show the axes helper. "1" is enabled. Disabled by default. */
+  _defineProperty(this, _ViewerStateKeys$Axes, undefined);
+  /** Whether to show the bounding box. "1" is enabled. Disabled by default. */
+  _defineProperty(this, _ViewerStateKeys$Boun, undefined);
+  /** Whether single-channel mode is active. "1" is active. Inactive by default. */
+  _defineProperty(this, _ViewerStateKeys$Sing, undefined);
+  /** If single-channel mode is active, which channel index is shown. Defaults to 0. */
+  _defineProperty(this, _ViewerStateKeys$Sing2, undefined);
+  /** The color of the bounding box, as a 6-digit hex color. */
+  _defineProperty(this, _ViewerStateKeys$Boun2, undefined);
+  /** The background color, as a 6-digit hex color. */
+  _defineProperty(this, _ViewerStateKeys$Back, undefined);
+  /** Whether to autorotate the view. "1" is enabled. Disabled by default. */
+  _defineProperty(this, _ViewerStateKeys$Auto, undefined);
+  /** The brightness of the image, an float in the range [0, 100]. Defaults to 70. */
+  _defineProperty(this, _ViewerStateKeys$Brig, undefined);
+  /** Density, a float in the range [0, 100]. Defaults to 50. */
+  _defineProperty(this, _ViewerStateKeys$Dens, undefined);
+  /**
+   * Levels for image intensity adjustment. Should be three numeric values separated
+   * by commas, representing the low, middle, and high values in a [0, 255] range.
+   * Values will be sorted in ascending order; empty values will be parsed as 0.
+   */
+  _defineProperty(this, _ViewerStateKeys$Leve, undefined);
+  /** Whether to enable interpolation. "1" is enabled. Enabled by default. */
+  _defineProperty(this, _ViewerStateKeys$Inte, undefined);
+  /** Subregions per axis, as min:max pairs separated by commas.
+   * Defaults to full range (`0:1`) for each axis.
+   */
+  _defineProperty(this, _ViewerStateKeys$Regi, undefined);
+  /** Slice position per X, Y, and Z axes, as a list of comma-separated floats.
+   * 0.5 for all axes by default (e.g. `0.5,0.5,0.5`)
+   */
+  _defineProperty(this, _ViewerStateKeys$Slic, undefined);
+  /** Frame number, for time-series volumes. 0 by default. */
+  _defineProperty(this, _ViewerStateKeys$Time, undefined);
+  /** Scene number, for multiscene images. 0 by default. */
+  _defineProperty(this, _ViewerStateKeys$Scen, undefined);
+  /** Whether to use an exact scale level index. 0 by default. */
+  _defineProperty(this, _ViewerStateKeys$UseE, undefined);
+  /** The exact scale level index to use, if `UseExactScaleLevel` is 1. 0 by default. */
+  _defineProperty(this, _ViewerStateKeys$Scal, undefined);
+  /**
+   * Camera transform settings, as a list of `key:value` pairs separated by commas.
+   * Valid keys are defined in `CameraTransformKeys`:
+   * - `pos`: position
+   * - `tar`: target
+   * - `up`: up
+   * - `ort`: orthographic scale
+   * - `fov`: field of view
+   *
+   * Vector values are encoded as three floats separated by colons (e.g. `1:2:3`) and
+   * encoded using `encodeURIComponent`.
+   */
+  _defineProperty(this, _ViewerStateKeys$Came, undefined);
+});
+
+/**
+ * Mapped to types in `ViewerChannelStateParams`.
+ */
+export var ViewerChannelSettingKeys = /*#__PURE__*/function (ViewerChannelSettingKeys) {
+  ViewerChannelSettingKeys["Color"] = "col";
+  ViewerChannelSettingKeys["Colorize"] = "clz";
+  ViewerChannelSettingKeys["ColorizeAlpha"] = "cza";
+  ViewerChannelSettingKeys["IsosurfaceAlpha"] = "isa";
+  ViewerChannelSettingKeys["Lut"] = "lut";
+  ViewerChannelSettingKeys["ControlPoints"] = "cpt";
+  ViewerChannelSettingKeys["ControlPointsLegacy"] = "cps";
+  ViewerChannelSettingKeys["Ramp"] = "ram";
+  ViewerChannelSettingKeys["RampLegacy"] = "rmp";
+  ViewerChannelSettingKeys["ControlPointsEnabled"] = "cpe";
+  ViewerChannelSettingKeys["VolumeEnabled"] = "ven";
+  ViewerChannelSettingKeys["SurfaceEnabled"] = "sen";
+  ViewerChannelSettingKeys["IsosurfaceValue"] = "isv";
+  ViewerChannelSettingKeys["KeepRange"] = "pin";
+  return ViewerChannelSettingKeys;
+}({});
+
+/**
+ * The serialized form of a ViewerChannelSetting, as a dictionary object.
+ */
+_ViewerChannelSetting = ViewerChannelSettingKeys.Color;
+_ViewerChannelSetting2 = ViewerChannelSettingKeys.Colorize;
+_ViewerChannelSetting3 = ViewerChannelSettingKeys.ColorizeAlpha;
+_ViewerChannelSetting4 = ViewerChannelSettingKeys.IsosurfaceAlpha;
+_ViewerChannelSetting5 = ViewerChannelSettingKeys.Lut;
+_ViewerChannelSetting6 = ViewerChannelSettingKeys.ControlPointsLegacy;
+_ViewerChannelSetting7 = ViewerChannelSettingKeys.ControlPoints;
+_ViewerChannelSetting8 = ViewerChannelSettingKeys.ControlPointsEnabled;
+_ViewerChannelSetting9 = ViewerChannelSettingKeys.RampLegacy;
+_ViewerChannelSetting10 = ViewerChannelSettingKeys.Ramp;
+_ViewerChannelSetting11 = ViewerChannelSettingKeys.VolumeEnabled;
+_ViewerChannelSetting12 = ViewerChannelSettingKeys.SurfaceEnabled;
+_ViewerChannelSetting13 = ViewerChannelSettingKeys.IsosurfaceValue;
+_ViewerChannelSetting14 = ViewerChannelSettingKeys.KeepRange;
+export var ViewerChannelStateParams = /*#__PURE__*/_createClass(function ViewerChannelStateParams() {
+  _classCallCheck(this, ViewerChannelStateParams);
+  /** Color, as a 6-digit hex color.  */
+  _defineProperty(this, _ViewerChannelSetting, undefined);
+  /** Colorize. "1" is enabled. Disabled by default. */
+  _defineProperty(this, _ViewerChannelSetting2, undefined);
+  /** Colorize alpha, in the [0, 1] range. Set to `1.0` by default. */
+  _defineProperty(this, _ViewerChannelSetting3, undefined);
+  /** Isosurface alpha, in the [0, 1 range]. Set to `1.0` by default.*/
+  _defineProperty(this, _ViewerChannelSetting4, undefined);
+  /**
+   * Lookup table (LUT) to map from volume intensity to opacity. Should be two
+   * alphanumeric values separated by a colon, where the first value is the
+   * minimum and the second is the maximum. Defaults to [0, 255].
+   *
+   * Min and max values are determined as following:
+   * - Plain numbers are indices of histogram bins, typically in the range [0,
+   *   255].
+   * - `v{n}` represents a raw intensity value, where `n` is a number.
+   * - `p{n}` represents a percentile, where `n` is a percentile in the [0, 100]
+   *   range.
+   * - `m{n}` represents the median multiplied by `n / 100`.
+   * - `autoij` in either the min or max fields will use the "auto" algorithm
+   *   from ImageJ to select the min AND max.
+   *
+   * Values will be used to determine the initial control points and ramp if
+   * those fields are not provided.
+   *
+   * @example
+   * ```
+   * "0:255"    // min: intensity 0, max: intensity 255.
+   * "p50:p90"  // min: 50th percentile, max: 90th percentile.
+   * "m1:p75"   // min: median, max: 75th percentile.
+   * "autoij:0" // use Auto-IJ to calculate min and max.
+   * ```
+   */
+  _defineProperty(this, _ViewerChannelSetting5, undefined);
+  /**
+   * Legacy specifier for control points for the transfer function as a list of
+   * `x:opacity:color` triplets, separated by colon. Uses histogram bin indices
+   * instead of intensity values.
+   * - `x` is a histogram bin index in the [0, 255] range.
+   * - `opacity` is a float in the [0, 1] range.
+   * - `color` is a 6-digit hex color, e.g. `ff0000`.
+   *
+   * Will be overridden by the ControlPoints field (`cpt`) if provided.
+   */
+  _defineProperty(this, _ViewerChannelSetting6, undefined);
+  /**
+   * Control points for the transfer function, formatted as a list of
+   * `x:opacity:color` triplets, separated by colons.
+   * - `x` is a numeric intensity value.
+   * - `opacity` is a float in the [0, 1] range.
+   * - `color` is a 6-digit hex color, e.g. `ff0000`.
+   *
+   * If provided, overrides the `lut` field when calculating the control points.
+   */
+  _defineProperty(this, _ViewerChannelSetting7, undefined);
+  /**
+   * Whether to show advanced mode, which will show control points instead of
+   * ramp values defined by the LUT. "1" is enabled, disabled by default.
+   */
+  _defineProperty(this, _ViewerChannelSetting8, undefined);
+  /**
+   * Legacy specifier for the transfer function ramp which uses histogram bin
+   * indices instead of intensity values, formatted as `min:max`. Will be
+   * overridden by the Ramp field (`ram`) if provided.
+   */
+  _defineProperty(this, _ViewerChannelSetting9, undefined);
+  /**
+   * Ramp min and max intensity values (`min:max`). If provided, overrides the
+   * `lut` field when calculating the ramp.
+   */
+  _defineProperty(this, _ViewerChannelSetting10, undefined);
+  /** Volume enabled. "1" is enabled. Disabled by default. */
+  _defineProperty(this, _ViewerChannelSetting11, undefined);
+  /** Isosurface enabled. "1" is enabled. Disabled by default. */
+  _defineProperty(this, _ViewerChannelSetting12, undefined);
+  /** Isosurface value, in the [0, 255] range. Set to `128` by default. */
+  _defineProperty(this, _ViewerChannelSetting13, undefined);
+  /**
+   * Whether to keep the current contrast settings when loading a new volume.
+   * "1" is enabled. Disabled by default.
+   */
+  _defineProperty(this, _ViewerChannelSetting14, undefined);
+});

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@aics/vole-app",
-  "version": "3.3.0",
+  "version": "3.4.0",
   "description": "web view of cell volume images",
   "main": "es/index.js",
   "module": "es/index.js",
@@ -25,6 +25,7 @@
     "gh-build-nightly": "webpack --config webpack.dev.js --env env=production basename=/vole-app/",
     "gh-build-release": "webpack --config webpack.dev.js --env env=production basename=/website-3d-cell-viewer-release/",
     "s3-build": "webpack --config webpack.dev.js --env env=production",
+    "release-build": "webpack --config webpack.dev.js --env env=production",
     "docker-build": "webpack --config webpack.common.js --env env=production",
     "dev": "webpack --config webpack.dev.js --env env=dev",
     "lint": "eslint --config ./.eslintrc --ignore-path ./.eslintignore --ext .jsx --ext .js --ext .ts --ext .tsx ./",
@@ -43,9 +44,9 @@
     "checks": "npm run lint && npm run typeCheck && npm run test"
   },
   "author": "Megan Riel-Mehan",
-  "license": "ISC",
+  "license": "BSD-3-Clause",
   "dependencies": {
-    "@aics/vole-core": "^4.8.2",
+    "@aics/vole-core": "^4.9.1",
     "@ant-design/icons": "^5.2.5",
     "@fortawesome/fontawesome-svg-core": "^6.5.2",
     "@fortawesome/free-solid-svg-icons": "^6.5.2",
@@ -53,6 +54,7 @@
     "color-string": "^1.5.3",
     "d3": "^7.9.0",
     "fuse.js": "^7.0.0",
+    "gl-matrix": "^3.4.4",
     "lodash": "^4.17.20",
     "nouislider-react": "^3.4.2",
     "react-color": "^2.19.3",
@@ -65,8 +67,7 @@
   "peerDependencies": {
     "antd": "^5.16.2",
     "react": "18.x",
-    "react-dom": "18.x",
-    "three": "^0.171.0"
+    "react-dom": "18.x"
   },
   "devDependencies": {
     "@babel/cli": "^7.14.5",

package/type-declarations/aics-image-viewer/components/App/types.d.ts

@@ -5,7 +5,7 @@ import type { ViewerChannelSettings } from "../../shared/utils/viewerChannelSett
 import type { ViewerState } from "../../state/types";
 /** `typeof useEffect`, but the effect handler takes a `Volume` as an argument */
 export type UseImageEffectType = (effect: (image: Volume) => void | (() => void), deps: React.DependencyList) => void;
-type ControlNames = "alphaMaskSlider" | "autoRotateButton" | "axisClipSliders" | "brightnessSlider" | "backgroundColorPicker" | "boundingBoxColorPicker" | "colorPresetsDropdown" | "densitySlider" | "levelsSliders" | "interpolationControl" | "saveSurfaceButtons" | "fovCellSwitchControls" | "viewModeRadioButtons" | "resetCameraButton" | "showAxesButton" | "showBoundingBoxButton" | "metadataViewer";
+type ControlNames = "alphaMaskSlider" | "autoRotateButton" | "axisClipSliders" | "rotationSliders" | "brightnessSlider" | "backgroundColorPicker" | "boundingBoxColorPicker" | "colorPresetsDropdown" | "densitySlider" | "levelsSliders" | "interpolationControl" | "saveSurfaceButtons" | "fovCellSwitchControls" | "viewModeRadioButtons" | "resetCameraButton" | "showAxesButton" | "showBoundingBoxButton" | "metadataViewer" | "scaleLevelControls";
 /** Show/hide different elements of the UI */
 export type ControlVisibilityFlags = {
     [K in ControlNames]: boolean;
@@ -41,7 +41,7 @@ export interface AppProps {
     view3dRef?: MutableRefObject<View3d | null>;
     metadataFormatter?: (metadata: MetadataRecord) => MetadataRecord;
     onControlPanelToggle?: (collapsed: boolean) => void;
-    showError?: (error: any) => void;
+    showError?: (error: unknown, image?: Volume) => void;
     onImageTitleChange?: (title: string | undefined) => void;
 }
 export {};

package/type-declarations/aics-image-viewer/components/BottomPanel/index.d.ts

@@ -1,10 +1,13 @@
 import React from "react";
 import "./styles.css";
 type BottomPanelProps = {
-    title?: string;
+    contents: {
+        title: string;
+        children: React.ReactNode;
+    }[];
     open?: boolean;
-    onOpenChange?: (visible: boolean) => void;
-    children?: React.ReactNode;
+    pageIndex?: number;
+    onPageChange?: (page: number | null) => void;
     height?: number;
 };
 declare const BottomPanel: React.FC<BottomPanelProps>;

package/type-declarations/aics-image-viewer/components/CellViewerCanvasWrapper/index.d.ts

@@ -16,6 +16,7 @@ type ViewerWrapperProps = {
     numScenes: number;
     visibleControls: {
         axisClipSliders: boolean;
+        rotationSliders: boolean;
     };
     clippingPanelOpen?: boolean;
     onClippingPanelOpenChange?: (visible: boolean) => void;

package/type-declarations/aics-image-viewer/components/ControlPanel/index.d.ts

@@ -1,11 +1,10 @@
 import React from "react";
 import type { MetadataRecord } from "../../shared/types";
-import ChannelsWidget from "../ChannelsWidget";
-import CustomizeWidget, { type CustomizeWidgetProps } from "../CustomizeWidget";
-import GlobalVolumeControls, { type GlobalVolumeControlsProps } from "../GlobalVolumeControls";
+import { type ChannelsWidgetProps } from "../ChannelsWidget";
+import { type CustomizeWidgetProps } from "../CustomizeWidget";
+import { type GlobalVolumeControlsProps } from "../GlobalVolumeControls";
 import "./styles.css";
-type PropsOf<T> = T extends React.ComponentType<infer P> ? P : never;
-interface ControlPanelProps extends PropsOf<typeof ChannelsWidget>, PropsOf<typeof GlobalVolumeControls>, PropsOf<typeof CustomizeWidget> {
+interface ControlPanelProps extends ChannelsWidgetProps, GlobalVolumeControlsProps, CustomizeWidgetProps {
     hasImage: boolean;
     visibleControls: GlobalVolumeControlsProps["visibleControls"] & CustomizeWidgetProps["visibleControls"] & {
         colorPresetsDropdown: boolean;

package/type-declarations/aics-image-viewer/components/ErrorAlert/index.d.ts

@@ -1,16 +1,19 @@
+import { type Volume } from "@aics/vole-core";
 import React from "react";
 import "./styles.css";
 export type ErrorAlertDescription = {
     title: string;
     description: React.ReactNode;
 };
+type ErrorInfo = {
+    error: unknown;
+    count: number;
+    dims?: [number, number, number, number, number];
+};
 export type ErrorAlertProps = {
-    errors: unknown;
-    /** The number of times we've seen an error of the type that is currently being displayed before */
-    firstErrorCount?: number;
+    errors: ErrorInfo[];
     afterClose?: () => void;
-    onSkipError?: () => void;
 };
 declare const ErrorAlert: React.FC<ErrorAlertProps>;
-export declare const useErrorAlert: () => [React.ReactNode, (error: unknown) => void];
+export declare const useErrorAlert: () => [React.ReactNode, (error: unknown, image?: Volume) => void];
 export default ErrorAlert;

package/type-declarations/aics-image-viewer/components/Toolbar/index.d.ts

@@ -1,4 +1,4 @@
-import type { VolumeDims } from "@aics/vole-core/es/types/VolumeDims";
+import type { VolumeDims } from "@aics/vole-core";
 import React from "react";
 import "./styles.css";
 type ToolbarProps = {
@@ -19,6 +19,7 @@ type ToolbarProps = {
         resetCameraButton: boolean;
         showAxesButton: boolean;
         showBoundingBoxButton: boolean;
+        scaleLevelControls: boolean;
     };
 };
 declare const Toolbar: React.FC<ToolbarProps>;

package/type-declarations/aics-image-viewer/components/{AxisClipSliders/index.d.ts → dimension_sliders/AxisClipSliders.d.ts}

@@ -4,7 +4,6 @@ import type { ViewMode } from "../../shared/enums";
 import { type AxisName, type PerAxis } from "../../shared/types";
 import type PlayControls from "../../shared/utils/playControls";
 import type { ViewerStateActions } from "../../state/store";
-import "./styles.css";
 type AxisClipSlidersProps = {
     mode: ViewMode;
     image: Volume | null;
@@ -20,5 +19,5 @@ type AxisClipSlidersProps = {
     playingAxis: AxisName | "t" | null;
     playControls: PlayControls;
 };
-declare const AxisClipSliders: React.FC<AxisClipSlidersProps>;
-export default AxisClipSliders;
+export declare const AxisClipSliders: React.FC<AxisClipSlidersProps>;
+export {};

package/type-declarations/aics-image-viewer/components/dimension_sliders/RotationSliders.d.ts

@@ -0,0 +1,6 @@
+import type { View3d } from "@aics/vole-core";
+import React from "react";
+export declare const RotationSliders: React.FC<{
+    view3d: View3d;
+    disable: boolean;
+}>;

package/type-declarations/aics-image-viewer/components/dimension_sliders/SliderRows.d.ts

@@ -0,0 +1,31 @@
+import React from "react";
+import "./styles.css";
+type SharedSliderRowProps<Value = number> = {
+    label: string;
+    val: Value;
+    valReadout?: Value;
+    min: number;
+    max: number;
+    onSlide?: (value: Value) => void;
+    /** `onChange` is called on the corresponding noUiSlider event AND on interaction with a spinbox. */
+    onChange?: (value: Value) => void;
+    onStart?: () => void;
+    onEnd?: () => void;
+};
+type DimensionSliderRowProps = SharedSliderRowProps<number[]> & {
+    hideMax?: boolean;
+    unitSymbol?: string;
+};
+type IndexSliderRowProps = Omit<SharedSliderRowProps, "min">;
+type PlaySliderRowProps = Omit<SharedSliderRowProps, "valReadout" | "min" | "onSlide"> & {
+    playing: boolean;
+    updateWhileSliding?: boolean;
+    onTogglePlayback: (play: boolean) => void;
+};
+/** A single slider row, with a slider, one or two spinbox inputs, and a max value. */
+export declare const DimensionSliderRow: React.FC<DimensionSliderRowProps>;
+/** Extremely thin wrapper around `SliderRow` for adjusting 0-indexed values that the user should see as 1-indexed. */
+export declare const IndexSliderRow: React.FC<IndexSliderRowProps>;
+/** Wrapper around `SliderRow` that adds a play button and accounts for the case where not all of an axis is loaded. */
+export declare const PlaySliderRow: React.FC<PlaySliderRowProps>;
+export {};

package/type-declarations/aics-image-viewer/components/shared/NumericInput/index.d.ts

@@ -8,6 +8,7 @@ interface NumericInputProps {
     max?: number;
     disabled?: boolean;
     className?: string;
+    unitSymbol?: string;
     onChange: (value: number) => void;
 }
 /**

package/type-declarations/aics-image-viewer/components/shared/SliderRow/index.d.ts

@@ -8,9 +8,11 @@ type SliderRowProps = {
     formatInteger?: boolean;
     min?: number;
     max?: number;
+    hideSlider?: boolean;
+    disabled?: boolean;
+    onSlide?: NouisliderProps["onSlide"];
     onUpdate?: NouisliderProps["onUpdate"];
     onChange?: NouisliderProps["onChange"];
-    hideSlider?: boolean;
     children?: React.ReactNode;
 };
 /** A component to ensure a single unified style across the many labeled slider rows in the control panel */