@aics/vole-app 3.3.0 → 3.4.0

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

@@ -48,3 +48,219 @@ export type ChannelState = {
      */
     keepIntensityRange: boolean;
 };
+/**
+ * Enum keys for serialized viewer settings. These are stored as enums for
+ * better readability, and are mapped to types in `ViewerStateParams`.
+ */
+export declare enum ViewerStateKeys {
+    View = "view",
+    Mode = "mode",
+    Mask = "mask",
+    Image = "image",
+    Axes = "axes",
+    BoundingBox = "bb",
+    BoundingBoxColor = "bbcol",
+    BackgroundColor = "bgcol",
+    Autorotate = "rot",
+    Brightness = "bright",
+    Density = "dens",
+    Levels = "lvl",
+    Interpolation = "interp",
+    Region = "reg",
+    Slice = "slice",
+    Time = "t",
+    Scene = "scene",
+    CameraState = "cam",
+    SingleChannelMode = "scm",
+    SingleChannelIndex = "sci",
+    UseExactScaleLevel = "esl",
+    ScaleLevelIndex = "scl"
+}
+export declare enum CameraTransformKeys {
+    /** Camera position in 3D coordinates. */
+    Position = "pos",
+    /** Target position of the trackball controls in 3D coordinates. */
+    Target = "tar",
+    /** The up vector of the camera. Will be normalized to magnitude of 1. */
+    Up = "up",
+    /** Scale factor for orthographic cameras. */
+    OrthoScale = "ort",
+    /** Vertical FOV of the camera view frustum, from top to bottom, in degrees. */
+    Fov = "fov"
+}
+/** Serialized version of `ViewerState`. */
+export declare class ViewerStateParams {
+    /** Axis to view. Valid values are "3D", "X", "Y", and "Z". Defaults to "3D". */
+    [ViewerStateKeys.View]?: string;
+    /**
+     * Render mode. Valid values are "volumetric", "maxproject", and "pathtrace".
+     * Defaults to "volumetric".
+     */
+    [ViewerStateKeys.Mode]?: string;
+    /** The opacity of the mask channel, an integer in the range [0, 100]. Defaults to 50. */
+    [ViewerStateKeys.Mask]?: string;
+    /** The type of image to display. Valid values are "cell" and "fov". Defaults to "cell". */
+    [ViewerStateKeys.Image]?: string;
+    /** Whether to show the axes helper. "1" is enabled. Disabled by default. */
+    [ViewerStateKeys.Axes]?: string;
+    /** Whether to show the bounding box. "1" is enabled. Disabled by default. */
+    [ViewerStateKeys.BoundingBox]?: string;
+    /** Whether single-channel mode is active. "1" is active. Inactive by default. */
+    [ViewerStateKeys.SingleChannelMode]?: string;
+    /** If single-channel mode is active, which channel index is shown. Defaults to 0. */
+    [ViewerStateKeys.SingleChannelIndex]?: string;
+    /** The color of the bounding box, as a 6-digit hex color. */
+    [ViewerStateKeys.BoundingBoxColor]?: string;
+    /** The background color, as a 6-digit hex color. */
+    [ViewerStateKeys.BackgroundColor]?: string;
+    /** Whether to autorotate the view. "1" is enabled. Disabled by default. */
+    [ViewerStateKeys.Autorotate]?: string;
+    /** The brightness of the image, an float in the range [0, 100]. Defaults to 70. */
+    [ViewerStateKeys.Brightness]?: string;
+    /** Density, a float in the range [0, 100]. Defaults to 50. */
+    [ViewerStateKeys.Density]?: string;
+    /**
+     * 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.
+     */
+    [ViewerStateKeys.Levels]?: string;
+    /** Whether to enable interpolation. "1" is enabled. Enabled by default. */
+    [ViewerStateKeys.Interpolation]?: string;
+    /** Subregions per axis, as min:max pairs separated by commas.
+     * Defaults to full range (`0:1`) for each axis.
+     */
+    [ViewerStateKeys.Region]?: string;
+    /** 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`)
+     */
+    [ViewerStateKeys.Slice]?: string;
+    /** Frame number, for time-series volumes. 0 by default. */
+    [ViewerStateKeys.Time]?: string;
+    /** Scene number, for multiscene images. 0 by default. */
+    [ViewerStateKeys.Scene]?: string;
+    /** Whether to use an exact scale level index. 0 by default. */
+    [ViewerStateKeys.UseExactScaleLevel]?: string;
+    /** The exact scale level index to use, if `UseExactScaleLevel` is 1. 0 by default. */
+    [ViewerStateKeys.ScaleLevelIndex]?: string;
+    /**
+     * 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`.
+     */
+    [ViewerStateKeys.CameraState]?: string;
+}
+/**
+ * Mapped to types in `ViewerChannelStateParams`.
+ */
+export declare enum ViewerChannelSettingKeys {
+    Color = "col",
+    Colorize = "clz",
+    ColorizeAlpha = "cza",
+    IsosurfaceAlpha = "isa",
+    Lut = "lut",
+    ControlPoints = "cpt",
+    ControlPointsLegacy = "cps",
+    Ramp = "ram",
+    RampLegacy = "rmp",
+    ControlPointsEnabled = "cpe",
+    VolumeEnabled = "ven",
+    SurfaceEnabled = "sen",
+    IsosurfaceValue = "isv",
+    KeepRange = "pin"
+}
+/**
+ * The serialized form of a ViewerChannelSetting, as a dictionary object.
+ */
+export declare class ViewerChannelStateParams {
+    /** Color, as a 6-digit hex color.  */
+    [ViewerChannelSettingKeys.Color]?: string;
+    /** Colorize. "1" is enabled. Disabled by default. */
+    [ViewerChannelSettingKeys.Colorize]?: "1" | "0";
+    /** Colorize alpha, in the [0, 1] range. Set to `1.0` by default. */
+    [ViewerChannelSettingKeys.ColorizeAlpha]?: string;
+    /** Isosurface alpha, in the [0, 1 range]. Set to `1.0` by default.*/
+    [ViewerChannelSettingKeys.IsosurfaceAlpha]?: string;
+    /**
+     * 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.
+     * ```
+     */
+    [ViewerChannelSettingKeys.Lut]?: string;
+    /**
+     * 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.
+     */
+    [ViewerChannelSettingKeys.ControlPointsLegacy]?: string;
+    /**
+     * 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.
+     */
+    [ViewerChannelSettingKeys.ControlPoints]?: string;
+    /**
+     * Whether to show advanced mode, which will show control points instead of
+     * ramp values defined by the LUT. "1" is enabled, disabled by default.
+     */
+    [ViewerChannelSettingKeys.ControlPointsEnabled]?: "1" | "0";
+    /**
+     * 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.
+     */
+    [ViewerChannelSettingKeys.RampLegacy]?: string;
+    /**
+     * Ramp min and max intensity values (`min:max`). If provided, overrides the
+     * `lut` field when calculating the ramp.
+     */
+    [ViewerChannelSettingKeys.Ramp]?: string;
+    /** Volume enabled. "1" is enabled. Disabled by default. */
+    [ViewerChannelSettingKeys.VolumeEnabled]?: "1" | "0";
+    /** Isosurface enabled. "1" is enabled. Disabled by default. */
+    [ViewerChannelSettingKeys.SurfaceEnabled]?: "1" | "0";
+    /** Isosurface value, in the [0, 255] range. Set to `128` by default. */
+    [ViewerChannelSettingKeys.IsosurfaceValue]?: string;
+    /**
+     * Whether to keep the current contrast settings when loading a new volume.
+     * "1" is enabled. Disabled by default.
+     */
+    [ViewerChannelSettingKeys.KeepRange]?: "1" | "0";
+}

package/LICENSE.txt

@@ -1,26 +0,0 @@
-Allen Institute Software License – This software license is the 2-clause BSD license 
-plus clause a third clause that prohibits redistribution for commercial purposes without further permission.
-
-Copyright © 2017. Allen Institute. All rights reserved.
-
-Redistribution and use in source and binary forms, with or without modification, are permitted provided that the
-following conditions are met:
-
-1. Redistributions of source code must retain the above copyright notice, this list of conditions and the 
-following disclaimer.
-
-2. Redistributions in binary form must reproduce the above copyright notice, this list of conditions and the 
-following disclaimer in the documentation and/or other materials provided with the distribution.
-
-3. Redistributions for commercial purposes are not permitted without the Allen Institute’s written permission.
-For purposes of this license, commercial purposes is the incorporation of the Allen Institute's software into
-anything for which you will charge fees or other compensation. Contact terms@alleninstitute.org for commercial
-licensing opportunities.
-
-THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES,
-INCLUDING, BUT NOT LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE
-DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT HOLDER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL,
-SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR 
-SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY,
-WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE
-USE OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.

package/es/aics-image-viewer/components/AxisClipSliders/index.js

@@ -1,295 +0,0 @@
-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); }
-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 _slicedToArray(r, e) { return _arrayWithHoles(r) || _iterableToArrayLimit(r, e) || _unsupportedIterableToArray(r, e) || _nonIterableRest(); }
-function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure 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 _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 _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t["return"] && (u = t["return"](), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
-function _arrayWithHoles(r) { if (Array.isArray(r)) return r; }
-import { CaretRightOutlined, PauseOutlined } from "@ant-design/icons";
-import { Button, Tooltip } from "antd";
-import React, { useCallback, useEffect, useState } from "react";
-import { activeAxisMap } from "../../shared/types";
-import NumericInput from "../shared/NumericInput";
-import SmarterSlider from "../shared/SmarterSlider";
-import "./styles.css";
-var AXES = ["x", "y", "z"];
-/** A single slider row, with a slider, one or two spinbox inputs, and a max value */
-var SliderRow = function SliderRow(_ref) {
-  var label = _ref.label,
-    vals = _ref.vals,
-    _ref$valsReadout = _ref.valsReadout,
-    valsReadout = _ref$valsReadout === void 0 ? vals : _ref$valsReadout,
-    max = _ref.max,
-    onSlide = _ref.onSlide,
-    _ref$onChange = _ref.onChange,
-    _onChange = _ref$onChange === void 0 ? onSlide : _ref$onChange,
-    onStart = _ref.onStart,
-    onEnd = _ref.onEnd;
-  var isRange = vals.length > 1;
-  // If slider is a range, handles represent slice *edges*: the range around only the 1st slice is [0, 1]; the range
-  // around only the last is [max-1, max].
-  // If slider is not a range, just work with slices, but don't 0-index: 1st slice is 1, last is max
-  var min = isRange ? 0 : 1;
-  var wrappedOnSlide = isRange ? onSlide : function (values) {
-    return onSlide === null || onSlide === void 0 ? void 0 : onSlide([values[0] - 1]);
-  };
-  var wrappedOnChange = isRange ? _onChange : function (values) {
-    return _onChange === null || _onChange === void 0 ? void 0 : _onChange([values[0] - 1]);
-  };
-  return /*#__PURE__*/React.createElement("span", {
-    className: "axis-slider-container"
-  }, /*#__PURE__*/React.createElement("span", {
-    className: "slider-name"
-  }, label), max <= min ? /*#__PURE__*/React.createElement("i", null, "No values to adjust") : /*#__PURE__*/React.createElement("span", {
-    className: "axis-slider"
-  }, /*#__PURE__*/React.createElement(SmarterSlider, {
-    className: isRange ? "" : "slider-single-handle",
-    connect: true,
-    range: {
-      min: min,
-      max: max
-    },
-    start: isRange ? vals : [vals[0] + 1],
-    step: 1,
-    margin: 1,
-    behaviour: "drag",
-    pips: {
-      mode: "positions",
-      values: [25, 50, 75],
-      density: 25,
-      format: {
-        // remove labels from pips
-        to: function to() {
-          return "";
-        }
-      }
-    }
-    // round slider output to nearest slice; assume any string inputs represent ints
-    ,
-    format: {
-      to: Math.round,
-      from: parseInt
-    },
-    onSlide: wrappedOnSlide,
-    onChange: wrappedOnChange,
-    onStart: onStart,
-    onEnd: onEnd
-  })), max > min && /*#__PURE__*/React.createElement("span", {
-    className: "slider-values"
-  }, /*#__PURE__*/React.createElement(NumericInput, {
-    min: min,
-    max: max,
-    value: valsReadout[0] + (isRange ? 0 : 1),
-    onChange: function onChange(value) {
-      return _onChange === null || _onChange === void 0 ? void 0 : _onChange(isRange ? [value, vals[1]] : [value - 1]);
-    }
-  }), isRange && /*#__PURE__*/React.createElement(React.Fragment, null, " , ", /*#__PURE__*/React.createElement(NumericInput, {
-    min: min,
-    max: max,
-    value: valsReadout[1],
-    onChange: function onChange(value) {
-      return _onChange === null || _onChange === void 0 ? void 0 : _onChange([vals[0], value]);
-    }
-  })), " / ", max));
-};
-/** Wrapper around `SliderRow` that adds a play button and accounts for the case where not all of an axis is loaded */
-var PlaySliderRow = function PlaySliderRow(props) {
-  var onChange = props.onChange,
-    onStart = props.onStart,
-    onEnd = props.onEnd;
-  // In partially-loaded axes, stores the displayed value of the slider while the user is sliding it
-  var _useState = useState(props.val),
-    _useState2 = _slicedToArray(_useState, 2),
-    valReadout = _useState2[0],
-    setValReadout = _useState2[1];
-  // Tracks when the user is sliding the slider and `valReadout` may have to sub in for props
-  var _useState3 = useState(false),
-    _useState4 = _slicedToArray(_useState3, 2),
-    sliderHeld = _useState4[0],
-    setSliderHeld = _useState4[1];
-  var wrappedOnChange = useCallback(function (_ref2) {
-    var _ref3 = _slicedToArray(_ref2, 1),
-      val = _ref3[0];
-    return onChange === null || onChange === void 0 ? void 0 : onChange(val);
-  }, [onChange]);
-  var wrappedSetValReadout = useCallback(function (_ref4) {
-    var _ref5 = _slicedToArray(_ref4, 1),
-      val = _ref5[0];
-    return setValReadout(val);
-  }, []);
-  var wrappedOnStart = useCallback(function () {
-    setValReadout(props.val);
-    setSliderHeld(true);
-    onStart === null || onStart === void 0 || onStart();
-  }, [onStart, props.val]);
-  var wrappedOnEnd = useCallback(function () {
-    setSliderHeld(false);
-    onEnd === null || onEnd === void 0 || onEnd();
-  }, [onEnd]);
-  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(SliderRow, {
-    label: props.label,
-    vals: [props.val],
-    valsReadout: props.updateWhileSliding || !sliderHeld ? undefined : [valReadout],
-    max: props.max,
-    onSlide: props.updateWhileSliding ? wrappedOnChange : wrappedSetValReadout,
-    onChange: props.updateWhileSliding ? undefined : wrappedOnChange,
-    onStart: wrappedOnStart,
-    onEnd: wrappedOnEnd
-  }), props.max > 1 && /*#__PURE__*/React.createElement(Tooltip, {
-    placement: "top",
-    title: "Play through sequence",
-    trigger: ["hover", "focus"]
-  }, /*#__PURE__*/React.createElement(Button, {
-    className: "slider-play-button",
-    onClick: function onClick() {
-      return props.onTogglePlayback(!props.playing);
-    },
-    icon: props.playing ? /*#__PURE__*/React.createElement(PauseOutlined, null) : /*#__PURE__*/React.createElement(CaretRightOutlined, null),
-    "aria-label": (props.playing ? "Pause " : "Play ") + props.label
-  })));
-};
-var AxisClipSliders = function AxisClipSliders(props) {
-  var activeAxis = activeAxisMap[props.mode];
-  var pauseOnInput = function pauseOnInput(axis) {
-    // Pause on slider input unless user is scrubbing along the playing axis (playback is held while this is happening)
-    if (!props.playControls.playHolding || props.playingAxis !== axis) {
-      props.playControls.pause();
-    }
-  };
-  var updateRegion = function updateRegion(axis, minval, maxval) {
-    pauseOnInput(axis);
-    var changeViewerSetting = props.changeViewerSetting,
-      numSlices = props.numSlices;
-    // get a value from 0-1
-    var max = numSlices[axis];
-    var start = minval / max;
-    var end = maxval / max;
-    changeViewerSetting("region", _defineProperty({}, axis, [start, end]));
-  };
-  var updateSlice = function updateSlice(axis, slice) {
-    pauseOnInput(axis);
-    props.changeViewerSetting("slice", _defineProperty({}, axis, slice / props.numSlices[axis]));
-  };
-  var updateTime = function updateTime(time) {
-    pauseOnInput("t");
-    props.changeViewerSetting("time", time);
-  };
-
-  // Pause when view mode or volume size has changed
-  useEffect(function () {
-    return props.playControls.pause();
-  }, [props.mode, props.image, props.playControls]);
-  var handlePlayPause = function handlePlayPause(axis, willPlay) {
-    if (willPlay) {
-      props.playControls.play(axis);
-    } else {
-      props.playControls.pause();
-    }
-  };
-  var create2dAxisSlider = function create2dAxisSlider(axis) {
-    var numSlices = props.numSlices[axis];
-    var numSlicesLoaded = props.numSlicesLoaded[axis];
-    return /*#__PURE__*/React.createElement("div", {
-      key: axis + numSlices + numSlicesLoaded,
-      className: "slider-row slider-".concat(axis)
-    }, /*#__PURE__*/React.createElement(PlaySliderRow, {
-      label: axis.toUpperCase(),
-      val: Math.round(props.slices[axis] * numSlices),
-      max: numSlices,
-      onChange: function onChange(val) {
-        return updateSlice(axis, val);
-      },
-      onStart: function onStart() {
-        return props.playControls.startHold(axis);
-      },
-      onEnd: function onEnd() {
-        return props.playControls.endHold();
-      },
-      playing: props.playingAxis === axis,
-      onTogglePlayback: function onTogglePlayback(willPlay) {
-        return handlePlayPause(axis, willPlay);
-      },
-      updateWhileSliding: numSlices === numSlicesLoaded
-    }));
-  };
-  var create3dAxisSlider = function create3dAxisSlider(axis) {
-    var numSlices = props.numSlices[axis];
-    if (numSlices === 1) {
-      return null;
-    }
-    var region = props.region[axis];
-    return /*#__PURE__*/React.createElement("div", {
-      key: axis + numSlices + "3d",
-      className: "slider-row slider-".concat(axis)
-    }, /*#__PURE__*/React.createElement(SliderRow, {
-      label: axis.toUpperCase(),
-      vals: [Math.round(region[0] * numSlices), Math.round(region[1] * numSlices)],
-      max: numSlices,
-      onSlide: function onSlide(values) {
-        return updateRegion(axis, values[0], values[1]);
-      },
-      onStart: function onStart() {
-        return props.playControls.startHold(axis);
-      },
-      onEnd: function onEnd() {
-        return props.playControls.endHold();
-      }
-    }));
-  };
-  return /*#__PURE__*/React.createElement("div", {
-    className: activeAxis ? "clip-sliders clip-sliders-2d" : "clip-sliders"
-  }, /*#__PURE__*/React.createElement("span", {
-    className: "slider-group"
-  }, /*#__PURE__*/React.createElement("h4", {
-    className: "slider-group-title"
-  }, "ROI"), /*#__PURE__*/React.createElement("span", {
-    className: "slider-group-rows"
-  }, activeAxis ? create2dAxisSlider(activeAxis) : AXES.map(create3dAxisSlider))), props.numTimesteps > 1 && /*#__PURE__*/React.createElement("span", {
-    className: "slider-group"
-  }, /*#__PURE__*/React.createElement("h4", {
-    className: "slider-group-title"
-  }, "Time"), /*#__PURE__*/React.createElement("span", {
-    className: "slider-group-rows"
-  }, /*#__PURE__*/React.createElement("div", {
-    className: "slider-row slider-t"
-  }, /*#__PURE__*/React.createElement(PlaySliderRow, {
-    label: "",
-    val: props.time,
-    max: props.numTimesteps,
-    playing: props.playingAxis === "t",
-    onTogglePlayback: function onTogglePlayback(willPlay) {
-      return handlePlayPause("t", willPlay);
-    },
-    onChange: function onChange(time) {
-      return updateTime(time);
-    },
-    onStart: function onStart() {
-      return props.playControls.startHold("t");
-    },
-    onEnd: function onEnd() {
-      return props.playControls.endHold();
-    }
-  })))), props.numScenes > 1 && /*#__PURE__*/React.createElement("span", {
-    className: "slider-group"
-  }, /*#__PURE__*/React.createElement("h4", {
-    className: "slider-group-title"
-  }, "Scene"), /*#__PURE__*/React.createElement("span", {
-    className: "slider-group-rows"
-  }, /*#__PURE__*/React.createElement("div", {
-    className: "slider-row slider-scene"
-  }, /*#__PURE__*/React.createElement(SliderRow, {
-    label: "",
-    vals: [props.scene],
-    max: props.numScenes,
-    onChange: function onChange(_ref6) {
-      var _ref7 = _slicedToArray(_ref6, 1),
-        scene = _ref7[0];
-      props.changeViewerSetting("scene", scene);
-      props.changeViewerSetting("useExactScaleLevel", false);
-    }
-  })))));
-};
-export default AxisClipSliders;