@aics/vole-app 3.4.4 → 3.6.0

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

@@ -1,41 +1,69 @@
-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); }
+export var ViewMode = /*#__PURE__*/function (ViewMode) {
+  ViewMode["threeD"] = "3D";
+  ViewMode["xy"] = "XY";
+  ViewMode["xz"] = "XZ";
+  ViewMode["yz"] = "YZ";
+  return ViewMode;
+}({});
+export var RenderMode = /*#__PURE__*/function (RenderMode) {
+  RenderMode["volumetric"] = "volumetric";
+  RenderMode["maxProject"] = "maxproject";
+  RenderMode["pathTrace"] = "pathtrace";
+  return RenderMode;
+}({});
+export var ImageType = /*#__PURE__*/function (ImageType) {
+  ImageType["segmentedCell"] = "cell";
+  ImageType["fullField"] = "fov";
+  return ImageType;
+}({});
+
 /** Global (not per-channel) viewer state which may be changed in the UI */
 
+/** Settings for a single channel 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`.
+ * The variants of `ViewMode` that appear in serialized representations of state
+ * (`ViewerStateSnapshot`, `ViewerStateStringified`).
+ *
+ * **IMPORTANT:** Changing the values of this enum will BREAK existing image sharing links and exported app state.
+ * It should not be done without introducing code to handle the previous values. This enum must not have values that
+ * collide when `toLowerCase` is applied to them.
  */
-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 ViewModeSnapshot = /*#__PURE__*/function (ViewModeSnapshot) {
+  ViewModeSnapshot["threeD"] = "3D";
+  ViewModeSnapshot["xy"] = "Z";
+  ViewModeSnapshot["xz"] = "Y";
+  ViewModeSnapshot["yz"] = "X";
+  return ViewModeSnapshot;
+}({});
+
+/**
+ * The variants of `RenderMode` that appear in serialized representations of state
+ * (`ViewerStateSnapshot`, `ViewerStateStringified`).
+ *
+ * **IMPORTANT:** Changing the values of this enum will BREAK existing image sharing links and exported app state.
+ * It should not be done without introducing code to handle the previous values. This enum must not have values that
+ * collide when `toLowerCase` is applied to them.
+ */
+export var RenderModeSnapshot = /*#__PURE__*/function (RenderModeSnapshot) {
+  RenderModeSnapshot["volumetric"] = "volumetric";
+  RenderModeSnapshot["maxProject"] = "maxproject";
+  RenderModeSnapshot["pathTrace"] = "pathtrace";
+  return RenderModeSnapshot;
+}({});
+
+/**
+ * The variants of `ImageType` that appear in serialized representations of state
+ * (`ViewerStateSnapshot`, `ViewerStateStringified`).
+ *
+ * **IMPORTANT:** Changing the values of this enum will BREAK existing image sharing links and exported app state.
+ * It should not be done without introducing code to handle the previous values. This enum must not have values that
+ * collide when `toLowerCase` is applied to them.
+ */
+export var ImageTypeSnapshot = /*#__PURE__*/function (ImageTypeSnapshot) {
+  ImageTypeSnapshot["segmentedCell"] = "cell";
+  ImageTypeSnapshot["fullField"] = "fov";
+  return ImageTypeSnapshot;
 }({});
 export var CameraTransformKeys = /*#__PURE__*/function (CameraTransformKeys) {
   CameraTransformKeys["Position"] = "pos";
@@ -45,221 +73,105 @@ export var CameraTransformKeys = /*#__PURE__*/function (CameraTransformKeys) {
   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);
-});
+/**
+ * Property keys for the "snapshot" variants of `ViewerState`. These keys are shorter, for contexts that need brevity
+ * (like URLs), and have a stronger guarantee of stability than the keys of `ViewerState`.
+ *
+ * **IMPORTANT:** Changing the values of this enum will BREAK existing image sharing links and exported app state.
+ * Ideally, you should never do it. If you must, you must also add code to version-check and handle previous values.
+ */
+export var ViewerStateSnapshotKeys = /*#__PURE__*/function (ViewerStateSnapshotKeys) {
+  ViewerStateSnapshotKeys["View"] = "view";
+  ViewerStateSnapshotKeys["Mode"] = "mode";
+  ViewerStateSnapshotKeys["MaskOpacity"] = "mask";
+  ViewerStateSnapshotKeys["ImageType"] = "image";
+  ViewerStateSnapshotKeys["ShowAxes"] = "axes";
+  ViewerStateSnapshotKeys["ShowBoundingBox"] = "bb";
+  ViewerStateSnapshotKeys["BoundingBoxColor"] = "bbcol";
+  ViewerStateSnapshotKeys["BackgroundColor"] = "bgcol";
+  ViewerStateSnapshotKeys["Autorotate"] = "rot";
+  ViewerStateSnapshotKeys["Brightness"] = "bright";
+  ViewerStateSnapshotKeys["Density"] = "dens";
+  ViewerStateSnapshotKeys["Levels"] = "lvl";
+  ViewerStateSnapshotKeys["Interpolation"] = "interp";
+  ViewerStateSnapshotKeys["Region"] = "reg";
+  ViewerStateSnapshotKeys["Slice"] = "slice";
+  ViewerStateSnapshotKeys["Time"] = "t";
+  ViewerStateSnapshotKeys["Scene"] = "scene";
+  ViewerStateSnapshotKeys["CameraState"] = "cam";
+  ViewerStateSnapshotKeys["SingleChannelMode"] = "scm";
+  ViewerStateSnapshotKeys["SingleChannelIndex"] = "sci";
+  ViewerStateSnapshotKeys["UseExactScaleLevel"] = "esl";
+  ViewerStateSnapshotKeys["ScaleLevelIndex"] = "scl";
+  return ViewerStateSnapshotKeys;
+}({});
 
 /**
- * Mapped to types in `ViewerChannelStateParams`.
+ * Property keys for the "snapshot" variants of `ChannelState`/`ViewerChannelSettings`. These keys are shorter, for
+ * contexts that need brevity (like URLs), and have a stronger guarantee of stability than the keys of `ChannelState`.
+ *
+ * **IMPORTANT:** Changing the values of this enum will BREAK existing image sharing links and exported app state.
+ * Ideally, you should never do it. If you must, you must also add code to version-check and handle previous values.
  */
-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;
+export var ChannelStateSnapshotKeys = /*#__PURE__*/function (ChannelStateSnapshotKeys) {
+  ChannelStateSnapshotKeys["Color"] = "col";
+  ChannelStateSnapshotKeys["Colorize"] = "clz";
+  ChannelStateSnapshotKeys["ColorizeAlpha"] = "cza";
+  ChannelStateSnapshotKeys["IsosurfaceAlpha"] = "isa";
+  ChannelStateSnapshotKeys["Lut"] = "lut";
+  ChannelStateSnapshotKeys["ControlPoints"] = "cpt";
+  ChannelStateSnapshotKeys["ControlPointsLegacy"] = "cps";
+  ChannelStateSnapshotKeys["Ramp"] = "ram";
+  ChannelStateSnapshotKeys["RampLegacy"] = "rmp";
+  ChannelStateSnapshotKeys["ControlPointsEnabled"] = "cpe";
+  ChannelStateSnapshotKeys["VolumeEnabled"] = "ven";
+  ChannelStateSnapshotKeys["SurfaceEnabled"] = "sen";
+  ChannelStateSnapshotKeys["IsosurfaceValue"] = "isv";
+  ChannelStateSnapshotKeys["KeepRange"] = "pin";
+  return ChannelStateSnapshotKeys;
 }({});
 
+// Maps `ViewerStateKeys` to the type of each key in `ViewerStateSnapshot`.
+// This is not the exported "snapshot" type: that's `ViewerStateSnapshot`, below. Defining `ViewerStateSnapshot` as
+// a mapped type ensures that if a variant is added to `ViewerStateKeys`, `ViewerStateSnapshot` will type error until
+// that key's value is added to this type.
+
+/**
+ * A "snapshot" of a `ViewerState`.
+ *
+ * This type is a variant representation of `ViewerState`, specialized for saving/restoring state to/from some
+ * serialized representation. It has the following desirable properties for this purpose:
+ * - Its keys are *shorter*, for formats where that's desirable (mostly URL parameters)
+ * - Its keys are reasonably *stable*, so that settings exported from older app versions can be imported by newer ones
+ * - Some values, notably colors, are converted to alternate representations for compactness and/or clarity
+ */
+
 /**
- * The serialized form of a ViewerChannelSetting, as a dictionary object.
+ * A `ViewerStateSnapshot` with all its keys converted to compact string representations. Useful for (de)serializing
+ * viewer state to/from URL parameters.
  */
-_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);
-});
+
+/**
+ * A `ControlPoint` where `color` is a six-digit hex string, or gets shortened to `"1"` in the overwhelming majority of
+ * cases where the control point is white to save space in sharing URLs. Used by `ChannelStateSnapshot`.
+ */
+
+// Maps `ChannelStateKeys` to the type of each key in `ChannelStateSnapshot`.
+// This is not the exported "snapshot" type: that's `ChannelStateSnapshot`, below. Defining `ChannelStateSnapshot` as
+// a mapped type ensures that if a variant is added to `ChannelStateKeys`, `ChannelStateSnapshot` will type error until
+// that key's value is added to this type.
+
+/**
+ * A "snapshot" of a `ChannelState` or `ViewerChannelSetting`.
+ *
+ * This type is a variant representation of `ChannelState`/`ViewerChannelSetting`, specialized for saving/restoring
+ * channel state to/from some serialized representation. It has the following desirable properties for this purpose:
+ * - Its keys are *shorter*, for formats where that's desirable (mostly URL parameters)
+ * - Its keys are reasonably *stable*, so that settings exported from older app versions can be imported by newer ones
+ * - Some values, notably colors, are converted to alternate representations for compactness and/or clarity
+ */
+
+/**
+ * A `ChannelStateSnapshot` with all its keys converted to compact string representations. Useful for (de)serializing
+ * channel state to/from URL parameters.
+ */

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

@@ -1,10 +1,16 @@
+function _toConsumableArray(r) { return _arrayWithoutHoles(r) || _iterableToArray(r) || _unsupportedIterableToArray(r) || _nonIterableSpread(); }
+function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
+function _iterableToArray(r) { if ("undefined" != typeof Symbol && null != r[Symbol.iterator] || null != r["@@iterator"]) return Array.from(r); }
+function _arrayWithoutHoles(r) { if (Array.isArray(r)) return _arrayLikeToArray(r); }
+function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 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); }
 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); }
-import { RenderMode, ViewMode } from "../shared/enums";
+import { RenderMode, ViewMode } from "./types";
 
 // TODO move back to a new `types` module (?)
 
@@ -68,4 +74,36 @@ export var validateState = function validateState(currentState, newState) {
     Object.assign(validated, validateStateValue(currentState, key, newState[key]));
   }
   return validated;
+};
+
+/** Creates a deep copy of a `ChannelState` */
+// Fills in every property individually so that new properties force a modification to this function
+export var cloneChannelState = function cloneChannelState(setting) {
+  return {
+    ramp: _toConsumableArray(setting.ramp),
+    controlPoints: setting.controlPoints.map(function (_ref5) {
+      var x = _ref5.x,
+        opacity = _ref5.opacity,
+        color = _ref5.color;
+      return {
+        x: x,
+        opacity: opacity,
+        color: _toConsumableArray(color)
+      };
+    }),
+    // Safe shallow copies
+    name: setting.name,
+    displayName: setting.displayName,
+    volumeEnabled: setting.volumeEnabled,
+    isosurfaceEnabled: setting.isosurfaceEnabled,
+    isovalue: setting.isovalue,
+    colorizeEnabled: setting.colorizeEnabled,
+    colorizeAlpha: setting.colorizeAlpha,
+    opacity: setting.opacity,
+    color: setting.color,
+    useControlPoints: setting.useControlPoints,
+    plotMin: setting.plotMin,
+    plotMax: setting.plotMax,
+    keepIntensityRange: setting.keepIntensityRange
+  };
 };

package/es/index.js

@@ -1,5 +1,7 @@
 import ImageViewerApp from "./aics-image-viewer/components/App";
-export { addViewerParamsFromMessage, parseViewerUrlParams } from "./aics-image-viewer/shared/utils/urlParsing";
+export { parseViewerUrlParams } from "./aics-image-viewer/shared/utils/parseUrl";
 export { writeMetadata, writeScenes } from "./aics-image-viewer/shared/utils/storage";
-export { ViewMode, RenderMode, ImageType } from "./aics-image-viewer/shared/enums";
+export { viewerMessageToParams, isStoreSnapshot, snapshotToViewerChannelSettings } from "./aics-image-viewer/shared/utils/parseSnapshot";
+export { snapshotToViewerState } from "./aics-image-viewer/state/deserialize";
+export { ViewMode, RenderMode, ImageType } from "./aics-image-viewer/state/types";
 export { ImageViewerApp };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@aics/vole-app",
-  "version": "3.4.4",
+  "version": "3.6.0",
   "description": "web view of cell volume images",
   "main": "es/index.js",
   "module": "es/index.js",
@@ -21,32 +21,30 @@
     "url": "git+https://github.com/allen-cell-animated/vole-app.git"
   },
   "scripts": {
-    "start": "webpack serve --config webpack.dev.js  --env env=dev",
-    "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",
+    "start": "vite dev",
+    "gh-build-nightly": "vite build --base=/vole-app/",
+    "s3-build": "vite build",
+    "release-build": "vite build",
+    "docker-build": "vite build",
+    "dev": "vite dev",
     "lint": "eslint --config ./.eslintrc --ignore-path ./.eslintignore --ext .jsx --ext .js --ext .ts --ext .tsx ./",
-    "test": "jest --coverage --passWithNoTests",
-    "test:github-action": "jest --silent --passWithNoTests --ci --coverage --coverageReporters=\"text\" --coverageReporters=\"text-summary\" --outputFile=\"report.json\"",
+    "test": "vitest run --passWithNoTests",
     "typeCheck": "tsc -p tsconfig.json --noEmit",
     "generateTypes": "tsc -p tsconfig.base.json --emitDeclarationOnly",
-    "transpileES": "cross-env TS_NODE_PROJECT=tsconfig.es.json BABEL_ENV=es babel src --out-dir es --extensions \".js,.jsx,.ts,.tsx,.svg\" --ignore src/**/*.test.*",
+    "transpileES": "cross-env TS_NODE_PROJECT=tsconfig.es.json BABEL_ENV=es VOLEAPP_VERSION=$npm_package_version babel src --out-dir es --extensions \".js,.jsx,.ts,.tsx,.svg\" --ignore src/**/*.test.*",
     "build": "npm-run-all generateTypes postcss transpileES",
     "postcss": "postcss src/**/*.css --base src --dir es",
     "publish-patch": "npm version patch | xargs -I {} sh -c 'git push origin {}'",
     "postpublish-patch": "git push origin main",
     "prepare": "cross-env DEPLOYMENT_ENV=production npm run build",
-    "predeploy": "cross-env DEPLOYMENT_ENV=production npm run dev",
+    "predeploy": "cross-env DEPLOYMENT_ENV=production npm run release-build",
     "deploy": "gh-pages -d imageviewer -t true",
     "checks": "npm run lint && npm run typeCheck && npm run test"
   },
   "author": "Allen Institute, Cell Science",
   "license": "BSD-3-Clause",
   "dependencies": {
-    "@aics/vole-core": "^4.9.2",
+    "@aics/vole-core": "^4.10.1",
     "@ant-design/icons": "^5.2.5",
     "@fortawesome/fontawesome-svg-core": "^6.5.2",
     "@fortawesome/free-solid-svg-icons": "^6.5.2",
@@ -81,60 +79,44 @@
     "@trivago/prettier-plugin-sort-imports": "^4.3.0",
     "@types/color-string": "^1.5.2",
     "@types/d3": "^7.4.3",
-    "@types/jest": "^29.5.14",
     "@types/lodash": "^4.14.185",
+    "@types/node": "^26.5.0",
     "@types/react": "^18.x",
     "@types/react-color": "^3.0.12",
     "@types/react-dom": "^18.x",
     "@types/three": "0.184.0",
-    "@typescript-eslint/eslint-plugin": "^8.46.2",
-    "@typescript-eslint/parser": "^8.46.2",
+    "@typescript-eslint/eslint-plugin": "^8.70.0",
+    "@typescript-eslint/parser": "^8.70.0",
+    "@vitejs/plugin-react": "^6.1.1",
     "antd": "^5.16.2",
-    "axios": "^0.21.1",
-    "babel-loader": "^8.2.2",
     "babel-plugin-replace-import-extension": "^1.1.3",
-    "clean-webpack-plugin": "^4.0.0-alpha.0",
-    "command-line-args": "^5.1.1",
-    "copy-webpack-plugin": "^11.0.0",
+    "babel-plugin-transform-inline-environment-variables": "^0.4.4",
     "cross-env": "^7.0.3",
-    "css-loader": "^6.2.0",
-    "esbuild": "^0.14.50",
-    "esbuild-jest": "^0.5.0",
+    "esbuild": "^0.28.2",
     "eslint": "^8.20.0",
+    "eslint-import-resolver-typescript": "^4.4.5",
+    "eslint-plugin-import": "^2.32.0",
     "eslint-plugin-react": "^7.37.5",
     "eslint-plugin-react-hooks": "^5.2.0",
-    "file-loader": "^6.2.0",
-    "firebase": "^7.x",
     "gh-pages": "^4.0.0",
-    "html-webpack-plugin": "^5.3.2",
-    "jest": "^29.7.0",
-    "jest-environment-jsdom": "^30.2.0",
-    "mini-css-extract-plugin": "^2.9.1",
-    "morgan": "^1.9.1",
+    "jsdom": "^30.0.1",
     "npm-run-all": "^4.1.5",
-    "postcss": "^8.4.47",
+    "postcss": "^8.5.26",
     "postcss-cli": "^11.0.0",
     "postcss-discard-comments": "^7.0.3",
     "postcss-extend-rule": "^4.0.0",
     "postcss-import": "^16.1.0",
-    "postcss-loader": "^8.1.1",
-    "postcss-mixins": "^11.0.3",
+    "postcss-mixins": "^12.1.2",
     "postcss-nested": "^6.2.0",
     "postcss-simple-vars": "^7.0.1",
     "postcss-url": "^10.1.3",
     "prettier": "^3.3.3",
-    "prop-types": "^15.5.10",
     "react": "^18.3.1",
     "react-dom": "^18.3.1",
-    "resolve-url-loader": "^5.0.0",
-    "style-loader": "^4.0.0",
-    "ts-jest": "^29.4.6",
     "typescript": "^5.9.3",
-    "url-loader": "^4.1.1",
-    "webpack": "^5.89.0",
-    "webpack-cli": "^4.7.2",
-    "webpack-dev-server": "^4.9.3",
-    "webpack-merge": "^5.8.0",
-    "webpack-shell-plugin": "^0.5.0"
+    "vite": "^8.2.2",
+    "vite-plugin-glsl": "^1.6.1",
+    "vite-plugin-svgr": "^5.2.0",
+    "vitest": "^4.1.11"
   }
 }