@aics/vole-app 2.14.0 → 3.1.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (81) hide show
  1. package/es/Globals.d.js +0 -0
  2. package/es/aics-image-viewer/components/App/ChannelUpdater.js +21 -3
  3. package/es/aics-image-viewer/components/App/index.js +184 -198
  4. package/es/aics-image-viewer/components/CellViewerCanvasWrapper/index.js +10 -9
  5. package/es/aics-image-viewer/components/ChannelsWidget.js +35 -22
  6. package/es/aics-image-viewer/components/ChannelsWidgetRow/index.js +26 -52
  7. package/es/aics-image-viewer/components/ChannelsWidgetRow/styles.css +0 -6
  8. package/es/aics-image-viewer/components/ColorPicker.js +1 -1
  9. package/es/aics-image-viewer/components/ControlPanel/index.js +5 -4
  10. package/es/aics-image-viewer/components/CustomizeWidget.js +12 -8
  11. package/es/aics-image-viewer/components/ErrorAlert/index.js +4 -4
  12. package/es/aics-image-viewer/components/GlobalVolumeControls.js +15 -12
  13. package/es/aics-image-viewer/components/StyleProvider/index.js +4 -2
  14. package/es/aics-image-viewer/components/TfEditor/index.js +304 -154
  15. package/es/aics-image-viewer/components/TfEditor/styles.css +53 -31
  16. package/es/aics-image-viewer/components/Toolbar/DownloadButton.js +1 -1
  17. package/es/aics-image-viewer/components/Toolbar/index.js +18 -16
  18. package/es/aics-image-viewer/components/shared/SharedCheckBox.js +1 -1
  19. package/es/aics-image-viewer/components/shared/SliderRow/index.js +8 -3
  20. package/es/aics-image-viewer/components/shared/SliderRow/styles.css +7 -0
  21. package/es/aics-image-viewer/components/shared/SmarterSlider.js +1 -1
  22. package/es/aics-image-viewer/components/shared/ViewerIcon.js +1 -1
  23. package/es/aics-image-viewer/components/useVolume.js +59 -58
  24. package/es/aics-image-viewer/shared/constants.js +2 -2
  25. package/es/aics-image-viewer/shared/utils/controlPointsToLut.js +57 -24
  26. package/es/aics-image-viewer/shared/utils/sceneStore.js +5 -3
  27. package/es/aics-image-viewer/shared/utils/storage.js +238 -0
  28. package/es/aics-image-viewer/shared/utils/test/storage.test.js +264 -0
  29. package/es/aics-image-viewer/shared/utils/test/urlParsing.test.js +240 -108
  30. package/es/aics-image-viewer/shared/utils/test/viewerChannelSettings.test.js +1 -1
  31. package/es/aics-image-viewer/shared/utils/urlParsing.js +278 -153
  32. package/es/aics-image-viewer/shared/utils/viewerState.js +4 -24
  33. package/es/aics-image-viewer/state/reset.js +111 -0
  34. package/es/aics-image-viewer/state/store.js +90 -0
  35. package/es/aics-image-viewer/state/subscribers.js +153 -0
  36. package/es/aics-image-viewer/state/test/reset.test.js +247 -0
  37. package/es/aics-image-viewer/state/util.js +71 -0
  38. package/es/index.js +3 -3
  39. package/package.json +18 -11
  40. package/type-declarations/aics-image-viewer/components/App/ChannelUpdater.d.ts +2 -4
  41. package/type-declarations/aics-image-viewer/components/App/types.d.ts +3 -3
  42. package/type-declarations/aics-image-viewer/components/AxisClipSliders/index.d.ts +6 -6
  43. package/type-declarations/aics-image-viewer/components/CellViewerCanvasWrapper/index.d.ts +5 -14
  44. package/type-declarations/aics-image-viewer/components/ChannelsWidget.d.ts +3 -6
  45. package/type-declarations/aics-image-viewer/components/ChannelsWidgetRow/index.d.ts +3 -6
  46. package/type-declarations/aics-image-viewer/components/ColorPicker.d.ts +1 -1
  47. package/type-declarations/aics-image-viewer/components/ControlPanel/index.d.ts +6 -7
  48. package/type-declarations/aics-image-viewer/components/CustomizeWidget.d.ts +2 -8
  49. package/type-declarations/aics-image-viewer/components/ErrorAlert/index.d.ts +4 -0
  50. package/type-declarations/aics-image-viewer/components/GlobalVolumeControls.d.ts +2 -9
  51. package/type-declarations/aics-image-viewer/components/MetadataViewer/index.d.ts +1 -1
  52. package/type-declarations/aics-image-viewer/components/StyleProvider/index.d.ts +1 -1
  53. package/type-declarations/aics-image-viewer/components/TfEditor/index.d.ts +10 -3
  54. package/type-declarations/aics-image-viewer/components/Toolbar/index.d.ts +3 -12
  55. package/type-declarations/aics-image-viewer/components/shared/SliderRow/index.d.ts +2 -1
  56. package/type-declarations/aics-image-viewer/components/shared/SmarterSlider.d.ts +1 -1
  57. package/type-declarations/aics-image-viewer/components/shared/ViewerIcon.d.ts +1 -1
  58. package/type-declarations/aics-image-viewer/components/useVolume.d.ts +7 -4
  59. package/type-declarations/aics-image-viewer/shared/constants.d.ts +5 -5
  60. package/type-declarations/aics-image-viewer/shared/types.d.ts +1 -1
  61. package/type-declarations/aics-image-viewer/shared/utils/controlPointsToLut.d.ts +9 -5
  62. package/type-declarations/aics-image-viewer/shared/utils/firebase/index.d.ts +1 -1
  63. package/type-declarations/aics-image-viewer/shared/utils/hooks.d.ts +1 -1
  64. package/type-declarations/aics-image-viewer/shared/utils/playControls.d.ts +1 -1
  65. package/type-declarations/aics-image-viewer/shared/utils/sceneStore.d.ts +8 -4
  66. package/type-declarations/aics-image-viewer/shared/utils/storage.d.ts +15 -0
  67. package/type-declarations/aics-image-viewer/shared/utils/urlParsing.d.ts +94 -31
  68. package/type-declarations/aics-image-viewer/shared/utils/viewerChannelSettings.d.ts +39 -1
  69. package/type-declarations/aics-image-viewer/shared/utils/viewerState.d.ts +3 -6
  70. package/type-declarations/aics-image-viewer/state/reset.d.ts +29 -0
  71. package/type-declarations/aics-image-viewer/state/store.d.ts +30 -0
  72. package/type-declarations/aics-image-viewer/state/subscribers.d.ts +4 -0
  73. package/type-declarations/aics-image-viewer/state/types.d.ts +46 -0
  74. package/type-declarations/aics-image-viewer/state/util.d.ts +8 -0
  75. package/type-declarations/index.d.ts +4 -4
  76. package/es/aics-image-viewer/components/ViewerStateProvider/ResetStateProvider.js +0 -163
  77. package/es/aics-image-viewer/components/ViewerStateProvider/index.js +0 -259
  78. package/type-declarations/aics-image-viewer/components/ViewerStateProvider/ResetStateProvider.d.ts +0 -34
  79. package/type-declarations/aics-image-viewer/components/ViewerStateProvider/index.d.ts +0 -33
  80. package/type-declarations/aics-image-viewer/components/ViewerStateProvider/types.d.ts +0 -107
  81. /package/es/aics-image-viewer/{components/ViewerStateProvider → state}/types.js +0 -0
@@ -1,259 +0,0 @@
1
- function _createForOfIteratorHelper(r, e) { var t = "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (!t) { if (Array.isArray(r) || (t = _unsupportedIterableToArray(r)) || e && r && "number" == typeof r.length) { t && (r = t); var _n = 0, F = function F() {}; return { s: F, n: function n() { return _n >= r.length ? { done: !0 } : { done: !1, value: r[_n++] }; }, e: function e(r) { throw r; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var o, a = !0, u = !1; return { s: function s() { t = t.call(r); }, n: function n() { var r = t.next(); return a = r.done, r; }, e: function e(r) { u = !0, o = r; }, f: function f() { try { a || null == t["return"] || t["return"](); } finally { if (u) throw o; } } }; }
2
- function _slicedToArray(r, e) { return _arrayWithHoles(r) || _iterableToArrayLimit(r, e) || _unsupportedIterableToArray(r, e) || _nonIterableRest(); }
3
- 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."); }
4
- 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; } }
5
- 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; }
6
- 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; } }
7
- function _arrayWithHoles(r) { if (Array.isArray(r)) return r; }
8
- 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; }
9
- 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; }
10
- 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; }
11
- function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
12
- 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); }
13
- 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); }
14
- import { isEqual } from "lodash";
15
- import React, { useCallback, useContext, useEffect, useMemo, useReducer, useRef } from "react";
16
- import { getDefaultViewerChannelSettings, getDefaultViewerState } from "../../shared/constants";
17
- import { RenderMode, ViewMode } from "../../shared/enums";
18
- import { useConstructor } from "../../shared/utils/hooks";
19
- import ResetStateProvider from "./ResetStateProvider";
20
- var isObject = function isObject(val) {
21
- return _typeof(val) === "object" && val !== null && !Array.isArray(val);
22
- };
23
-
24
- // Some viewer settings require custom change behaviors to change related settings simultaneously or guard against
25
- // entering an illegal state (e.g. autorotate must not be on in pathtrace mode). Those behaviors are defined here.
26
- var VIEWER_SETTINGS_CHANGE_HANDLERS = {
27
- // View mode: if we're switching to 2d, switch to volumetric rendering
28
- viewMode: function viewMode(prevSettings, _viewMode) {
29
- var switchToVolumetric = _viewMode !== ViewMode.threeD && prevSettings.renderMode === RenderMode.pathTrace;
30
- return _objectSpread(_objectSpread({}, prevSettings), {}, {
31
- viewMode: _viewMode,
32
- renderMode: switchToVolumetric ? RenderMode.volumetric : prevSettings.renderMode
33
- });
34
- },
35
- // Render mode: if we're switching to pathtrace, turn off autorotate
36
- // Also, do not allow pathtrace mode in any mode other than 3D.
37
- renderMode: function renderMode(prevSettings, _renderMode) {
38
- if (_renderMode === RenderMode.pathTrace && prevSettings.viewMode !== ViewMode.threeD) {
39
- return _objectSpread({}, prevSettings);
40
- }
41
- return _objectSpread(_objectSpread({}, prevSettings), {}, {
42
- renderMode: _renderMode,
43
- autorotate: _renderMode === RenderMode.pathTrace ? false : prevSettings.autorotate
44
- });
45
- },
46
- // Autorotate: do not enable autorotate while in pathtrace mode
47
- autorotate: function autorotate(prevSettings, _autorotate) {
48
- return _objectSpread(_objectSpread({}, prevSettings), {}, {
49
- // The button should theoretically be unclickable while in pathtrace mode, but this provides extra security
50
- autorotate: prevSettings.renderMode === RenderMode.pathTrace ? false : _autorotate
51
- });
52
- }
53
- };
54
- var viewerSettingsReducer = function viewerSettingsReducer(viewerSettings, _ref) {
55
- var key = _ref.key,
56
- value = _ref.value;
57
- var changeHandler = VIEWER_SETTINGS_CHANGE_HANDLERS[key];
58
- if (changeHandler) {
59
- // This setting has a custom change handler. Let it handle creating a new state object.
60
- return changeHandler(viewerSettings, value);
61
- } else {
62
- var setting = viewerSettings[key];
63
- if (isObject(setting) && isObject(value)) {
64
- // This setting is an object, and we may be updating it with a partial object.
65
- return _objectSpread(_objectSpread({}, viewerSettings), {}, _defineProperty({}, key, _objectSpread(_objectSpread({}, setting), value)));
66
- } else {
67
- // This setting is regular. Update it the regular way.
68
- return _objectSpread(_objectSpread({}, viewerSettings), {}, _defineProperty({}, key, value));
69
- }
70
- }
71
- };
72
- var ChannelSettingActionType = /*#__PURE__*/function (ChannelSettingActionType) {
73
- ChannelSettingActionType["UniformUpdate"] = "UniformUpdate";
74
- ChannelSettingActionType["ArrayUpdate"] = "ArrayUpdate";
75
- ChannelSettingActionType["Init"] = "Init";
76
- return ChannelSettingActionType;
77
- }(ChannelSettingActionType || {});
78
- /** Set channel setting `key` on one or more channels specified by `index` to value `value`. */
79
- /** Set the values of channel setting `key` for all channels from an array of values ordered by channel index */
80
- /** Initialize list of channel states */
81
- var channelSettingsReducer = function channelSettingsReducer(channelSettings, action) {
82
- if (action.type === ChannelSettingActionType.Init) {
83
- // ChannelSettingInitAction
84
- return action.value;
85
- } else if (action.type === ChannelSettingActionType.ArrayUpdate) {
86
- // ChannelSettingArrayUpdateAction
87
- return channelSettings.map(function (channel, idx) {
88
- return action.value[idx] ? _objectSpread(_objectSpread({}, channel), {}, _defineProperty({}, action.key, action.value[idx])) : channel;
89
- });
90
- } else {
91
- // type is ChannelSettingActionType.UniformUpdate
92
- if (Array.isArray(action.index)) {
93
- // ChannelSettingUniformUpdateAction on potentially multiple channels
94
- return channelSettings.map(function (channel, idx) {
95
- return action.index.includes(idx) ? _objectSpread(_objectSpread({}, channel), action.value) : channel;
96
- });
97
- } else {
98
- // ChannelSettingUniformUpdateAction on a single channel
99
- var newSettings = channelSettings.slice();
100
- if (action.index >= 0 && action.index < channelSettings.length) {
101
- newSettings[action.index] = _objectSpread(_objectSpread({}, newSettings[action.index]), action.value);
102
- }
103
- return newSettings;
104
- }
105
- }
106
- };
107
- var nullfn = function nullfn() {};
108
- var DEFAULT_VIEWER_CONTEXT = _objectSpread(_objectSpread({}, getDefaultViewerState()), {}, {
109
- channelSettings: [],
110
- changeViewerSetting: nullfn,
111
- setChannelSettings: nullfn,
112
- changeChannelSetting: nullfn,
113
- applyColorPresets: nullfn,
114
- resetToSavedViewerState: nullfn,
115
- resetToDefaultViewerState: nullfn,
116
- setSavedViewerChannelSettings: nullfn,
117
- getCurrentViewerChannelSettings: function getCurrentViewerChannelSettings() {
118
- return getDefaultViewerChannelSettings();
119
- },
120
- getChannelsAwaitingReset: function getChannelsAwaitingReset() {
121
- return new Set();
122
- },
123
- getChannelsAwaitingResetOnLoad: function getChannelsAwaitingResetOnLoad() {
124
- return new Set();
125
- },
126
- onResetChannel: nullfn
127
- });
128
- export var ALL_VIEWER_STATE_KEYS = Object.keys(DEFAULT_VIEWER_CONTEXT);
129
- var DEFAULT_VIEWER_CONTEXT_OUTER = {
130
- ref: {
131
- current: DEFAULT_VIEWER_CONTEXT
132
- }
133
- };
134
- export var ViewerStateContext = /*#__PURE__*/React.createContext(DEFAULT_VIEWER_CONTEXT_OUTER);
135
-
136
- /** Provides a central store for the state of the viewer, and the methods to update it. */
137
- var ViewerStateProvider = function ViewerStateProvider(props) {
138
- var _useReducer = useReducer(viewerSettingsReducer, _objectSpread({}, getDefaultViewerState())),
139
- _useReducer2 = _slicedToArray(_useReducer, 2),
140
- viewerSettings = _useReducer2[0],
141
- viewerDispatch = _useReducer2[1];
142
- var _useReducer3 = useReducer(channelSettingsReducer, []),
143
- _useReducer4 = _slicedToArray(_useReducer3, 2),
144
- channelSettings = _useReducer4[0],
145
- channelDispatch = _useReducer4[1];
146
- // Provide viewer state via a ref, so that closures that run asynchronously can capture the ref instead of the
147
- // specific values they need and always have the most up-to-date state.
148
- var ref = useRef(DEFAULT_VIEWER_CONTEXT);
149
- var resetProvider = useConstructor(function () {
150
- return new ResetStateProvider(ref);
151
- });
152
- useEffect(function () {
153
- resetProvider.setSavedViewerState(props.viewerSettings || {});
154
- }, [props.viewerSettings, resetProvider]);
155
- var changeViewerSetting = useCallback(function (key, value) {
156
- return viewerDispatch({
157
- key: key,
158
- value: value
159
- });
160
- }, []);
161
- var changeChannelSetting = useCallback(function (index, value) {
162
- channelDispatch({
163
- type: ChannelSettingActionType.UniformUpdate,
164
- index: index,
165
- value: value
166
- });
167
- }, []);
168
- var applyColorPresets = useCallback(function (value) {
169
- return channelDispatch({
170
- type: ChannelSettingActionType.ArrayUpdate,
171
- key: "color",
172
- value: value
173
- });
174
- }, []);
175
- var setChannelSettings = useCallback(function (channels) {
176
- return channelDispatch({
177
- type: ChannelSettingActionType.Init,
178
- value: channels
179
- });
180
- }, []);
181
-
182
- // https://react.dev/learn/you-might-not-need-an-effect#adjusting-some-state-when-a-prop-changes
183
- var prevViewerSettingsPropsRef = useRef(undefined);
184
- if (props.viewerSettings && !isEqual(props.viewerSettings, prevViewerSettingsPropsRef.current)) {
185
- for (var _i = 0, _arr = Object.keys(props.viewerSettings); _i < _arr.length; _i++) {
186
- var key = _arr[_i];
187
- if (viewerSettings[key] !== props.viewerSettings[key]) {
188
- changeViewerSetting(key, props.viewerSettings[key]);
189
- }
190
- }
191
- prevViewerSettingsPropsRef.current = props.viewerSettings;
192
- }
193
- var context = useMemo(function () {
194
- ref.current = _objectSpread(_objectSpread({}, viewerSettings), {}, {
195
- channelSettings: channelSettings,
196
- changeViewerSetting: changeViewerSetting,
197
- setChannelSettings: setChannelSettings,
198
- changeChannelSetting: changeChannelSetting,
199
- applyColorPresets: applyColorPresets,
200
- // Reset-related callbacks
201
- setSavedViewerChannelSettings: resetProvider.setSavedViewerChannelSettings,
202
- getCurrentViewerChannelSettings: resetProvider.getCurrentViewerChannelSettings,
203
- getChannelsAwaitingReset: resetProvider.getChannelsAwaitingReset,
204
- getChannelsAwaitingResetOnLoad: resetProvider.getChannelsAwaitingResetOnLoad,
205
- onResetChannel: resetProvider.onResetChannel,
206
- resetToSavedViewerState: resetProvider.resetToSavedViewerState,
207
- resetToDefaultViewerState: resetProvider.resetToDefaultViewerState
208
- });
209
-
210
- // `ref` is wrapped in another object to ensure that the context updates when state does.
211
- // (`ref` on its own would always compare equal to itself and the context would never update.)
212
- return {
213
- ref: ref
214
- };
215
- }, [viewerSettings, channelSettings, applyColorPresets, changeViewerSetting, changeChannelSetting, setChannelSettings, resetProvider]);
216
- return /*#__PURE__*/React.createElement(ViewerStateContext.Provider, {
217
- value: context
218
- }, props.children);
219
- };
220
-
221
- /**
222
- * Higher-order component that connects a component to the viewer state context.
223
- *
224
- * Accepts a `component` and an array of `keys` from the viewer state context, and returns a new memoized component
225
- * which "subscribes" to only those fields of state, and will not re-render if other fields change. This works by
226
- * creating a component which is "split in two" as described
227
- * [here](https://react.dev/reference/react/memo#updating-a-memoized-component-using-a-context).
228
- *
229
- * NOTE that while higher-order components don't seem to be explicitly considered an anti-pattern, they don't appear in
230
- * modern documentation because they are "[not commonly used in modern React
231
- * code](https://legacy.reactjs.org/docs/higher-order-components.html)." React-redux, which inspired this "connect"
232
- * pattern, has also generally moved away from this pattern [in favor of a hooks-based
233
- * approach](https://react-redux.js.org/api/hooks). I too would love to use hooks to connect to viewer state, but there
234
- * is currently no way to hook into context without agreeing to re-render on every change. I feel okay using a higher-
235
- * order component in this case because, analogous to a custom hook, it extends a provided primitive HOC (`memo`).
236
- */
237
- export function connectToViewerState(component, keys) {
238
- var MemoedComponent = /*#__PURE__*/React.memo(component);
239
- var ConnectedComponent = function ConnectedComponent(props) {
240
- var viewerState = useContext(ViewerStateContext);
241
- var mergedProps = _objectSpread({}, props);
242
- var _iterator = _createForOfIteratorHelper(keys),
243
- _step;
244
- try {
245
- for (_iterator.s(); !(_step = _iterator.n()).done;) {
246
- var key = _step.value;
247
- mergedProps[key] = viewerState.ref.current[key];
248
- }
249
- } catch (err) {
250
- _iterator.e(err);
251
- } finally {
252
- _iterator.f();
253
- }
254
- return /*#__PURE__*/React.createElement(MemoedComponent, mergedProps);
255
- };
256
- ConnectedComponent.displayName = "Connected(".concat(component.displayName || component.name, ")");
257
- return ConnectedComponent;
258
- }
259
- export default ViewerStateProvider;
@@ -1,34 +0,0 @@
1
- /// <reference types="react" />
2
- import { ViewerState, ViewerStateContextType, ResetState } from "./types";
3
- import { ViewerChannelSettings } from "../../shared/utils/viewerChannelSettings";
4
- /**
5
- * Provides reset functionality for the viewer and channel states.
6
- */
7
- export default class ResetStateProvider implements ResetState {
8
- savedViewerState: Partial<ViewerState>;
9
- savedViewerChannelSettings: ViewerChannelSettings | undefined;
10
- useDefaultViewerChannelSettings: boolean;
11
- channelsToReset: Set<number>;
12
- channelsToResetOnLoad: Set<number>;
13
- ref: React.MutableRefObject<ViewerStateContextType>;
14
- constructor(viewerStateRef: React.MutableRefObject<ViewerStateContextType>);
15
- setSavedViewerState(state: Partial<ViewerState>): void;
16
- setSavedViewerChannelSettings(settings: ViewerChannelSettings | undefined): void;
17
- getChannelsAwaitingReset(): Set<number>;
18
- getChannelsAwaitingResetOnLoad(): Set<number>;
19
- onResetChannel(channelIndex: number): void;
20
- /**
21
- * Returns the current viewer channel settings that the viewer should use when
22
- * resetting channels to an initial state.
23
- */
24
- getCurrentViewerChannelSettings(): ViewerChannelSettings | undefined;
25
- /**
26
- * Helper method. Resets the viewer and all channels to the provided state. If new data needs to
27
- * be loaded, handles setup so the reset will be applied to each channel as it loads in.
28
- */
29
- private resetToState;
30
- /** Resets to the initial saved state of the viewer, as shown to the user on load. */
31
- resetToSavedViewerState(): void;
32
- /** Reset to global default viewer state, as if loading the volume with no parameters. */
33
- resetToDefaultViewerState(): void;
34
- }
@@ -1,33 +0,0 @@
1
- import React from "react";
2
- import type { ViewerState, ViewerStateContextType } from "./types";
3
- export declare const ALL_VIEWER_STATE_KEYS: (keyof ViewerState | keyof import("./types").ResetState | "channelSettings" | "changeViewerSetting" | "changeChannelSetting" | "setChannelSettings" | "applyColorPresets")[];
4
- type NoNull<T> = {
5
- [K in keyof T]: NonNullable<T[K]>;
6
- };
7
- type ContextRefType = NoNull<React.MutableRefObject<ViewerStateContextType>>;
8
- export declare const ViewerStateContext: React.Context<{
9
- ref: ContextRefType;
10
- }>;
11
- /** Provides a central store for the state of the viewer, and the methods to update it. */
12
- declare const ViewerStateProvider: React.FC<{
13
- viewerSettings?: Partial<ViewerState>;
14
- children?: React.ReactNode;
15
- }>;
16
- /**
17
- * Higher-order component that connects a component to the viewer state context.
18
- *
19
- * Accepts a `component` and an array of `keys` from the viewer state context, and returns a new memoized component
20
- * which "subscribes" to only those fields of state, and will not re-render if other fields change. This works by
21
- * creating a component which is "split in two" as described
22
- * [here](https://react.dev/reference/react/memo#updating-a-memoized-component-using-a-context).
23
- *
24
- * NOTE that while higher-order components don't seem to be explicitly considered an anti-pattern, they don't appear in
25
- * modern documentation because they are "[not commonly used in modern React
26
- * code](https://legacy.reactjs.org/docs/higher-order-components.html)." React-redux, which inspired this "connect"
27
- * pattern, has also generally moved away from this pattern [in favor of a hooks-based
28
- * approach](https://react-redux.js.org/api/hooks). I too would love to use hooks to connect to viewer state, but there
29
- * is currently no way to hook into context without agreeing to re-render on every change. I feel okay using a higher-
30
- * order component in this case because, analogous to a custom hook, it extends a provided primitive HOC (`memo`).
31
- */
32
- export declare function connectToViewerState<Keys extends keyof ViewerStateContextType, Props extends Pick<ViewerStateContextType, Keys>>(component: React.FC<Props>, keys: Keys[]): React.FC<Omit<Props, Keys>>;
33
- export default ViewerStateProvider;
@@ -1,107 +0,0 @@
1
- import { CameraState, ControlPoint } from "@aics/vole-core";
2
- import type { ImageType, RenderMode, ViewMode } from "../../shared/enums";
3
- import type { PerAxis } from "../../shared/types";
4
- import type { ColorArray } from "../../shared/utils/colorRepresentations";
5
- import { ViewerChannelSettings } from "../../shared/utils/viewerChannelSettings";
6
- /** Global (not per-channel) viewer state which may be changed in the UI */
7
- export interface ViewerState {
8
- viewMode: ViewMode;
9
- renderMode: RenderMode;
10
- imageType: ImageType;
11
- showAxes: boolean;
12
- showBoundingBox: boolean;
13
- boundingBoxColor: ColorArray;
14
- backgroundColor: ColorArray;
15
- autorotate: boolean;
16
- maskAlpha: number;
17
- brightness: number;
18
- density: number;
19
- levels: [number, number, number];
20
- interpolationEnabled: boolean;
21
- region: PerAxis<[number, number]>;
22
- slice: PerAxis<number>;
23
- time: number;
24
- scene: number;
25
- cameraState: Partial<CameraState> | undefined;
26
- }
27
- export type ViewerStateKey = keyof ViewerState;
28
- /**
29
- * If a value in `ViewerState` is an object, we want to allow updates with a partial object. Otherwise, components that
30
- * update some but not all of the object's properties have to know the object's current value in order to clone it with
31
- * only the key they care about updated, which exposes us to stale closure issues.
32
- */
33
- export type PartialIfObject<T> = T extends Record<string, unknown> ? Partial<T> : T;
34
- /**
35
- * A type which lets us provide a map of optional check functions for certain settings updates, to avoid entering
36
- * illegal states. E.g., whenever `renderMode` is changed to pathtrace, make sure `autorotate` is set to false.
37
- */
38
- export type ViewerSettingChangeHandlers = {
39
- [K in ViewerStateKey]?: (settings: ViewerState, value: PartialIfObject<ViewerState[K]>) => ViewerState;
40
- };
41
- /**
42
- * The type of the global settings updater provided by `ViewerStateProvider` and passed down to most UI components.
43
- * Looks kind of like redux's `dispatch` if you squint. `key` names the setting to update; `value` is the new
44
- * (potentially partial) value.
45
- */
46
- export type ViewerSettingUpdater = <K extends ViewerStateKey>(key: K, value: PartialIfObject<ViewerState[K]>) => void;
47
- /** Settings for a single channel, as stored internally by the app */
48
- export interface ChannelState {
49
- name: string;
50
- displayName: string;
51
- volumeEnabled: boolean;
52
- isosurfaceEnabled: boolean;
53
- isovalue: number;
54
- colorizeEnabled: boolean;
55
- colorizeAlpha: number;
56
- opacity: number;
57
- color: ColorArray;
58
- ramp: [number, number];
59
- useControlPoints: boolean;
60
- controlPoints: ControlPoint[];
61
- plotMin: number;
62
- plotMax: number;
63
- }
64
- export type ChannelStateKey = keyof ChannelState;
65
- export type ChannelSettingUpdater = <K extends ChannelStateKey>(index: number | number[], value: Partial<Record<K, ChannelState[K]>>) => void;
66
- export type SingleChannelSettingUpdater = <K extends ChannelStateKey>(value: Partial<Record<K, ChannelState[K]>>) => void;
67
- export type ResetState = {
68
- /**
69
- * Sets the initial viewer channel settings that will be applied when calling
70
- * `resetToSavedViewerState()`. Initial settings should be set from the viewer props (when embedded)
71
- * or the URL parameters.
72
- */
73
- setSavedViewerChannelSettings: (settings: ViewerChannelSettings | undefined) => void;
74
- /**
75
- * Returns the current viewer channel settings that should be used when resetting
76
- * the channel transfer functions (control points and ramp).
77
- */
78
- getCurrentViewerChannelSettings: () => ViewerChannelSettings | undefined;
79
- /** Channels that should be immediately reset on next render. */
80
- getChannelsAwaitingReset: () => Set<number>;
81
- /** Channels that should be reset once new data is loaded. */
82
- getChannelsAwaitingResetOnLoad: () => Set<number>;
83
- /**
84
- * Removes the channel from the list of channels to be reset (as given by
85
- * `getChannelsAwaitingReset()` or `getChannelsAwaitingResetOnLoad()`).
86
- */
87
- onResetChannel: (channelIndex: number) => void;
88
- /**
89
- * Resets the viewer and all channels to a saved initial state, determined
90
- * by viewer props.
91
- * The initial settings for channels can be set with `setSavedViewerChannelSettings()`.
92
- */
93
- resetToSavedViewerState: () => void;
94
- /**
95
- * Resets the viewer and all channels to the default state, as though
96
- * loaded from scratch with no initial parameters set.
97
- * Uses the default channel settings as given by `getDefaultViewerChannelSettings()`.
98
- */
99
- resetToDefaultViewerState: () => void;
100
- };
101
- export type ViewerStateContextType = ViewerState & ResetState & {
102
- channelSettings: ChannelState[];
103
- changeViewerSetting: ViewerSettingUpdater;
104
- changeChannelSetting: ChannelSettingUpdater;
105
- setChannelSettings: (settings: ChannelState[]) => void;
106
- applyColorPresets: (presets: ColorArray[]) => void;
107
- };