@itk-viewer/viewer - npm Package Compare versions

Comparing version 0.6.0 to 0.6.1

CHANGELOG.md

 # @itk-viewer/viewer
 
+## 0.6.1
+
+### Patch Changes
+
+- e96dbc0: Add color transfer function selection.
+- Updated dependencies [e96dbc0]
+  - @itk-viewer/utils@0.1.4
+  - @itk-viewer/io@0.4.3
+
 ## 0.6.0
@@ -4,0 +13,0 @@

dist/camera.d.ts

@@ -1,2 +0,1 @@
-/// <reference types="gl-matrix/index.js" />
 import { Bounds } from '@itk-viewer/utils/bounding-box.js';
@@ -30,15 +29,11 @@ import { ReadonlyVec3, mat4, vec3, quat, ReadonlyQuat } from 'gl-matrix';
 export declare const cameraMachine: import("xstate").StateMachine<Context, SetPoseEvent | {
-    type: 'watchPose';
+    type: "watchPose";
     watcher: AnyActorRef;
 } | {
-    type: 'watchPoseStop';
+    type: "watchPoseStop";
     watcher: AnyActorRef;
 } | {
-    type: 'setEnableRotation';
+    type: "setEnableRotation";
     enable: boolean;
-}, Record<string, AnyActorRef>, {
-    src: string;
-    logic: import("xstate").UnknownActorLogic;
-    id: string | undefined;
-}, {
+}, {}, never, {
     type: "emitNewPose";
@@ -49,42 +44,111 @@ params: {
     };
-}, {
-    type: string;
-    params: import("xstate").NonReducibleUnknown;
-}, string, "active", string, unknown, import("xstate").NonReducibleUnknown, import("xstate").ResolveTypegenMeta<import("xstate").TypegenDisabled, SetPoseEvent | {
-    type: 'watchPose';
-    watcher: AnyActorRef;
-} | {
-    type: 'watchPoseStop';
-    watcher: AnyActorRef;
-} | {
-    type: 'setEnableRotation';
-    enable: boolean;
-}, {
-    src: string;
-    logic: import("xstate").UnknownActorLogic;
-    id: string | undefined;
-}, {
-    type: "emitNewPose";
-    params: {
-        pose: Pose;
+}, never, never, "active", string, import("xstate").NonReducibleUnknown, import("xstate").NonReducibleUnknown, import("xstate").EventObject, import("xstate").MetaObject, {
+    readonly id: "camera";
+    readonly initial: "active";
+    readonly context: () => {
+        pose: {
+            center: vec3;
+            rotation: quat;
+            distance: number;
+        };
+        enableRotation: true;
         parallelScaleRatio: number;
+        verticalFieldOfView: number;
+        poseWatchers: never[];
     };
-}, {
-    type: string;
-    params: import("xstate").NonReducibleUnknown;
-}, string, string>>;
+    readonly states: {
+        readonly active: {
+            readonly on: {
+                readonly setPose: {
+                    readonly actions: readonly [import("xstate").ActionFunction<Context, SetPoseEvent, SetPoseEvent | {
+                        type: "watchPose";
+                        watcher: AnyActorRef;
+                    } | {
+                        type: "watchPoseStop";
+                        watcher: AnyActorRef;
+                    } | {
+                        type: "setEnableRotation";
+                        enable: boolean;
+                    }, undefined, never, never, never, never, never>, {
+                        readonly type: "emitNewPose";
+                        readonly params: ({ context: { pose, parallelScaleRatio } }: {
+                            context: Context;
+                            event: SetPoseEvent;
+                        }) => {
+                            pose: Pose;
+                            parallelScaleRatio: number;
+                        };
+                    }];
+                };
+                readonly watchPose: {
+                    readonly actions: readonly [import("xstate").ActionFunction<Context, {
+                        type: "watchPose";
+                        watcher: AnyActorRef;
+                    }, SetPoseEvent | {
+                        type: "watchPose";
+                        watcher: AnyActorRef;
+                    } | {
+                        type: "watchPoseStop";
+                        watcher: AnyActorRef;
+                    } | {
+                        type: "setEnableRotation";
+                        enable: boolean;
+                    }, undefined, never, never, never, never, never>, ({ context: { pose, parallelScaleRatio }, event: { watcher } }: import("xstate").ActionArgs<Context, {
+                        type: "watchPose";
+                        watcher: AnyActorRef;
+                    }, SetPoseEvent | {
+                        type: "watchPose";
+                        watcher: AnyActorRef;
+                    } | {
+                        type: "watchPoseStop";
+                        watcher: AnyActorRef;
+                    } | {
+                        type: "setEnableRotation";
+                        enable: boolean;
+                    }>) => void];
+                };
+                readonly watchPoseStop: {
+                    readonly actions: readonly [import("xstate").ActionFunction<Context, {
+                        type: "watchPoseStop";
+                        watcher: AnyActorRef;
+                    }, SetPoseEvent | {
+                        type: "watchPose";
+                        watcher: AnyActorRef;
+                    } | {
+                        type: "watchPoseStop";
+                        watcher: AnyActorRef;
+                    } | {
+                        type: "setEnableRotation";
+                        enable: boolean;
+                    }, undefined, never, never, never, never, never>];
+                };
+                readonly setEnableRotation: {
+                    readonly actions: import("xstate").ActionFunction<Context, {
+                        type: "setEnableRotation";
+                        enable: boolean;
+                    }, SetPoseEvent | {
+                        type: "watchPose";
+                        watcher: AnyActorRef;
+                    } | {
+                        type: "watchPoseStop";
+                        watcher: AnyActorRef;
+                    } | {
+                        type: "setEnableRotation";
+                        enable: boolean;
+                    }, undefined, never, never, never, never, never>;
+                };
+            };
+        };
+    };
+}>;
 export declare const createCamera: () => import("xstate").Actor<import("xstate").StateMachine<Context, SetPoseEvent | {
-    type: 'watchPose';
+    type: "watchPose";
     watcher: AnyActorRef;
 } | {
-    type: 'watchPoseStop';
+    type: "watchPoseStop";
     watcher: AnyActorRef;
 } | {
-    type: 'setEnableRotation';
+    type: "setEnableRotation";
     enable: boolean;
-}, Record<string, AnyActorRef>, {
-    src: string;
-    logic: import("xstate").UnknownActorLogic;
-    id: string | undefined;
-}, {
+}, {}, never, {
     type: "emitNewPose";
@@ -95,28 +159,101 @@ params: {
     };
-}, {
-    type: string;
-    params: import("xstate").NonReducibleUnknown;
-}, string, "active", string, unknown, import("xstate").NonReducibleUnknown, import("xstate").ResolveTypegenMeta<import("xstate").TypegenDisabled, SetPoseEvent | {
-    type: 'watchPose';
-    watcher: AnyActorRef;
-} | {
-    type: 'watchPoseStop';
-    watcher: AnyActorRef;
-} | {
-    type: 'setEnableRotation';
-    enable: boolean;
-}, {
-    src: string;
-    logic: import("xstate").UnknownActorLogic;
-    id: string | undefined;
-}, {
-    type: "emitNewPose";
-    params: {
-        pose: Pose;
+}, never, never, "active", string, import("xstate").NonReducibleUnknown, import("xstate").NonReducibleUnknown, import("xstate").EventObject, import("xstate").MetaObject, {
+    readonly id: "camera";
+    readonly initial: "active";
+    readonly context: () => {
+        pose: {
+            center: vec3;
+            rotation: quat;
+            distance: number;
+        };
+        enableRotation: true;
         parallelScaleRatio: number;
+        verticalFieldOfView: number;
+        poseWatchers: never[];
     };
-}, {
-    type: string;
-    params: import("xstate").NonReducibleUnknown;
-}, string, string>>>;
+    readonly states: {
+        readonly active: {
+            readonly on: {
+                readonly setPose: {
+                    readonly actions: readonly [import("xstate").ActionFunction<Context, SetPoseEvent, SetPoseEvent | {
+                        type: "watchPose";
+                        watcher: AnyActorRef;
+                    } | {
+                        type: "watchPoseStop";
+                        watcher: AnyActorRef;
+                    } | {
+                        type: "setEnableRotation";
+                        enable: boolean;
+                    }, undefined, never, never, never, never, never>, {
+                        readonly type: "emitNewPose";
+                        readonly params: ({ context: { pose, parallelScaleRatio } }: {
+                            context: Context;
+                            event: SetPoseEvent;
+                        }) => {
+                            pose: Pose;
+                            parallelScaleRatio: number;
+                        };
+                    }];
+                };
+                readonly watchPose: {
+                    readonly actions: readonly [import("xstate").ActionFunction<Context, {
+                        type: "watchPose";
+                        watcher: AnyActorRef;
+                    }, SetPoseEvent | {
+                        type: "watchPose";
+                        watcher: AnyActorRef;
+                    } | {
+                        type: "watchPoseStop";
+                        watcher: AnyActorRef;
+                    } | {
+                        type: "setEnableRotation";
+                        enable: boolean;
+                    }, undefined, never, never, never, never, never>, ({ context: { pose, parallelScaleRatio }, event: { watcher } }: import("xstate").ActionArgs<Context, {
+                        type: "watchPose";
+                        watcher: AnyActorRef;
+                    }, SetPoseEvent | {
+                        type: "watchPose";
+                        watcher: AnyActorRef;
+                    } | {
+                        type: "watchPoseStop";
+                        watcher: AnyActorRef;
+                    } | {
+                        type: "setEnableRotation";
+                        enable: boolean;
+                    }>) => void];
+                };
+                readonly watchPoseStop: {
+                    readonly actions: readonly [import("xstate").ActionFunction<Context, {
+                        type: "watchPoseStop";
+                        watcher: AnyActorRef;
+                    }, SetPoseEvent | {
+                        type: "watchPose";
+                        watcher: AnyActorRef;
+                    } | {
+                        type: "watchPoseStop";
+                        watcher: AnyActorRef;
+                    } | {
+                        type: "setEnableRotation";
+                        enable: boolean;
+                    }, undefined, never, never, never, never, never>];
+                };
+                readonly setEnableRotation: {
+                    readonly actions: import("xstate").ActionFunction<Context, {
+                        type: "setEnableRotation";
+                        enable: boolean;
+                    }, SetPoseEvent | {
+                        type: "watchPose";
+                        watcher: AnyActorRef;
+                    } | {
+                        type: "watchPoseStop";
+                        watcher: AnyActorRef;
+                    } | {
+                        type: "setEnableRotation";
+                        enable: boolean;
+                    }, undefined, never, never, never, never, never>;
+                };
+            };
+        };
+    };
+}>>;
 export type Camera = ActorRefFrom<typeof cameraMachine>;
@@ -123,0 +260,0 @@ export declare const reset3d: (pose: Pose, verticalFieldOfView: number, bounds: Bounds, aspect: number) => {

dist/fps-watcher.d.ts

 export declare const fpsWatcher: import("xstate").StateMachine<{
-    samples: number[];
+    samples: Array<number>;
     average: number;
 }, {
-    type: 'newSample';
+    type: "newSample";
     renderTime: number;
-}, Record<string, import("xstate").AnyActorRef>, import("xstate").ProvidedActor, import("xstate").ParameterizedObject, import("xstate").ParameterizedObject, string, import("xstate").StateValue, string, unknown, import("xstate").NonReducibleUnknown, import("xstate").ResolveTypegenMeta<import("xstate").TypegenDisabled, {
-    type: 'newSample';
-    renderTime: number;
-}, import("xstate").ProvidedActor, import("xstate").ParameterizedObject, import("xstate").ParameterizedObject, string, string>>;
+}, Record<string, import("xstate").AnyActorRef>, import("xstate").ProvidedActor, import("xstate").ParameterizedObject, import("xstate").ParameterizedObject, string, import("xstate").StateValue, string, unknown, import("xstate").NonReducibleUnknown, import("xstate").EventObject, import("xstate").MetaObject, any>;
 //# sourceMappingURL=fps-watcher.d.ts.map

dist/image-builder.js

@@ -64,2 +64,5 @@ import { assign, enqueueActions, fromPromise, sendParent, setup, } from 'xstate';
         findSliceIndex: fromPromise(async ({ input: { image, builtImage, scale, slice, axis }, }) => {
+            if (builtImage.imageType.dimension === 2) {
+                return { builtImage, sliceIndex: 0 };
+            }
             // builtImage could be larger than slice if cached so
@@ -66,0 +69,0 @@ // find index of slice in builtImage

dist/image.d.ts

@@ -10,2 +10,3 @@ import { ActorRefFrom, AnyActorRef } from 'xstate';
     normalizedColorRanges: Ranges;
+    colorMaps: string[];
     opacityPoints: Point[][];
@@ -15,56 +16,219 @@ normalizedOpacityPoints: Point[][];
 export declare const image: import("xstate").StateMachine<Context, {
-    type: 'getWorker';
+    type: "getWorker";
     receiver: AnyActorRef;
 } | {
-    type: 'builtImage';
+    type: "builtImage";
     builtImage: BuiltImage;
 } | {
-    type: 'normalizedColorRange';
+    type: "normalizedColorRange";
     range: readonly [number, number];
     component: number;
 } | {
-    type: 'normalizedOpacityPoints';
+    type: "normalizedOpacityPoints";
     points: [number, number][];
     component: number;
-}, Record<string, AnyActorRef>, {
-    src: string;
-    logic: import("xstate").UnknownActorLogic;
-    id: string | undefined;
-}, {
-    type: "updateColorRanges";
-    params: import("xstate").NonReducibleUnknown;
 } | {
-    type: "updateOpacityPoints";
-    params: import("xstate").NonReducibleUnknown;
-}, {
-    type: string;
-    params: import("xstate").NonReducibleUnknown;
-}, string, "active", string, MultiscaleSpatialImage, import("xstate").NonReducibleUnknown, import("xstate").ResolveTypegenMeta<import("xstate").TypegenDisabled, {
-    type: 'getWorker';
-    receiver: AnyActorRef;
-} | {
-    type: 'builtImage';
-    builtImage: BuiltImage;
-} | {
-    type: 'normalizedColorRange';
-    range: readonly [number, number];
+    type: "colorMap";
+    colorMap: string;
     component: number;
-} | {
-    type: 'normalizedOpacityPoints';
-    points: [number, number][];
-    component: number;
-}, {
-    src: string;
-    logic: import("xstate").UnknownActorLogic;
-    id: string | undefined;
-}, {
-    type: "updateColorRanges";
-    params: import("xstate").NonReducibleUnknown;
-} | {
-    type: "updateOpacityPoints";
-    params: import("xstate").NonReducibleUnknown;
-}, {
-    type: string;
-    params: import("xstate").NonReducibleUnknown;
-}, string, string>>;
+}, {}, never, import("xstate").Values<{
+    updateColorRanges: {
+        type: "updateColorRanges";
+        params: import("xstate").NonReducibleUnknown;
+    };
+    updateOpacityPoints: {
+        type: "updateOpacityPoints";
+        params: import("xstate").NonReducibleUnknown;
+    };
+    ensureComponentDefaults: {
+        type: "ensureComponentDefaults";
+        params: import("xstate").NonReducibleUnknown;
+    };
+}>, never, never, "active", string, MultiscaleSpatialImage, import("xstate").NonReducibleUnknown, import("xstate").EventObject, import("xstate").MetaObject, {
+    readonly id: "image";
+    readonly initial: "active";
+    readonly context: ({ input: image }: {
+        spawn: {
+            <TSrc extends never>(logic: TSrc, ...[options]: never): never;
+            <TLogic extends import("xstate").AnyActorLogic>(src: TLogic, options?: {
+                id?: never;
+                systemId?: string;
+                input?: import("xstate").InputFrom<TLogic> | undefined;
+                syncSnapshot?: boolean;
+            } | undefined): ActorRefFrom<TLogic>;
+        };
+        input: MultiscaleSpatialImage;
+        self: import("xstate").ActorRef<import("xstate").MachineSnapshot<Context, {
+            type: "getWorker";
+            receiver: AnyActorRef;
+        } | {
+            type: "builtImage";
+            builtImage: BuiltImage;
+        } | {
+            type: "normalizedColorRange";
+            range: readonly [number, number];
+            component: number;
+        } | {
+            type: "normalizedOpacityPoints";
+            points: [number, number][];
+            component: number;
+        } | {
+            type: "colorMap";
+            colorMap: string;
+            component: number;
+        }, Record<string, AnyActorRef | undefined>, import("xstate").StateValue, string, unknown, any, any>, {
+            type: "getWorker";
+            receiver: AnyActorRef;
+        } | {
+            type: "builtImage";
+            builtImage: BuiltImage;
+        } | {
+            type: "normalizedColorRange";
+            range: readonly [number, number];
+            component: number;
+        } | {
+            type: "normalizedOpacityPoints";
+            points: [number, number][];
+            component: number;
+        } | {
+            type: "colorMap";
+            colorMap: string;
+            component: number;
+        }, import("xstate").AnyEventObject>;
+    }) => {
+        image: MultiscaleSpatialImage;
+        dataRanges: never[];
+        colorRanges: never[];
+        normalizedColorRanges: never[];
+        colorMaps: never[];
+        opacityPoints: never[];
+        normalizedOpacityPoints: never[];
+    };
+    readonly states: {
+        readonly active: {
+            readonly on: {
+                readonly builtImage: {
+                    readonly actions: readonly [import("xstate").ActionFunction<Context, {
+                        type: "builtImage";
+                        builtImage: BuiltImage;
+                    }, {
+                        type: "getWorker";
+                        receiver: AnyActorRef;
+                    } | {
+                        type: "builtImage";
+                        builtImage: BuiltImage;
+                    } | {
+                        type: "normalizedColorRange";
+                        range: readonly [number, number];
+                        component: number;
+                    } | {
+                        type: "normalizedOpacityPoints";
+                        points: [number, number][];
+                        component: number;
+                    } | {
+                        type: "colorMap";
+                        colorMap: string;
+                        component: number;
+                    }, undefined, never, never, never, never, never>, import("xstate").ActionFunction<Context, {
+                        type: "builtImage";
+                        builtImage: BuiltImage;
+                    }, {
+                        type: "getWorker";
+                        receiver: AnyActorRef;
+                    } | {
+                        type: "builtImage";
+                        builtImage: BuiltImage;
+                    } | {
+                        type: "normalizedColorRange";
+                        range: readonly [number, number];
+                        component: number;
+                    } | {
+                        type: "normalizedOpacityPoints";
+                        points: [number, number][];
+                        component: number;
+                    } | {
+                        type: "colorMap";
+                        colorMap: string;
+                        component: number;
+                    }, undefined, never, never, never, never, never>, "updateColorRanges", "updateOpacityPoints", "ensureComponentDefaults"];
+                };
+                readonly normalizedColorRange: {
+                    readonly actions: readonly [import("xstate").ActionFunction<Context, {
+                        type: "normalizedColorRange";
+                        range: readonly [number, number];
+                        component: number;
+                    }, {
+                        type: "getWorker";
+                        receiver: AnyActorRef;
+                    } | {
+                        type: "builtImage";
+                        builtImage: BuiltImage;
+                    } | {
+                        type: "normalizedColorRange";
+                        range: readonly [number, number];
+                        component: number;
+                    } | {
+                        type: "normalizedOpacityPoints";
+                        points: [number, number][];
+                        component: number;
+                    } | {
+                        type: "colorMap";
+                        colorMap: string;
+                        component: number;
+                    }, undefined, never, never, never, never, never>, "updateColorRanges"];
+                };
+                readonly normalizedOpacityPoints: {
+                    readonly actions: readonly [import("xstate").ActionFunction<Context, {
+                        type: "normalizedOpacityPoints";
+                        points: [number, number][];
+                        component: number;
+                    }, {
+                        type: "getWorker";
+                        receiver: AnyActorRef;
+                    } | {
+                        type: "builtImage";
+                        builtImage: BuiltImage;
+                    } | {
+                        type: "normalizedColorRange";
+                        range: readonly [number, number];
+                        component: number;
+                    } | {
+                        type: "normalizedOpacityPoints";
+                        points: [number, number][];
+                        component: number;
+                    } | {
+                        type: "colorMap";
+                        colorMap: string;
+                        component: number;
+                    }, undefined, never, never, never, never, never>, "updateOpacityPoints"];
+                };
+                readonly colorMap: {
+                    readonly actions: readonly [import("xstate").ActionFunction<Context, {
+                        type: "colorMap";
+                        colorMap: string;
+                        component: number;
+                    }, {
+                        type: "getWorker";
+                        receiver: AnyActorRef;
+                    } | {
+                        type: "builtImage";
+                        builtImage: BuiltImage;
+                    } | {
+                        type: "normalizedColorRange";
+                        range: readonly [number, number];
+                        component: number;
+                    } | {
+                        type: "normalizedOpacityPoints";
+                        points: [number, number][];
+                        component: number;
+                    } | {
+                        type: "colorMap";
+                        colorMap: string;
+                        component: number;
+                    }, undefined, never, never, never, never, never>];
+                };
+            };
+        };
+    };
+}>;
 export type Image = ActorRefFrom<typeof image>;
@@ -71,0 +235,0 @@ export type ImageSnapshot = ReturnType<Image['getSnapshot']>;

dist/image.js

@@ -48,2 +48,13 @@ import { assign, setup } from 'xstate';
         }),
+        ensureComponentDefaults: assign({
+            colorMaps: ({ context: { dataRanges, colorMaps } }) => {
+                const components = Array.from({ length: dataRanges.length }, (_, index) => index);
+                return components.map((component) => {
+                    const colorMap = colorMaps[component];
+                    if (colorMap)
+                        return colorMap;
+                    return 'Viridis (matplotlib)';
+                });
+            },
+        }),
     },
@@ -55,5 +66,6 @@ }).createMachine({
         image,
-        dataRanges: [],
+        dataRanges: [], // by component
         colorRanges: [],
         normalizedColorRanges: [],
+        colorMaps: [],
         opacityPoints: [],
@@ -110,2 +122,3 @@ normalizedOpacityPoints: [],
                         'updateOpacityPoints',
+                        'ensureComponentDefaults',
                     ],
@@ -135,2 +148,15 @@ },
                 },
+                colorMap: {
+                    actions: [
+                        assign({
+                            colorMaps: ({ context, event }) => {
+                                return [
+                                    ...context.colorMaps.slice(0, event.component),
+                                    event.colorMap,
+                                    ...context.colorMaps.slice(event.component + 1),
+                                ];
+                            },
+                        }),
+                    ],
+                },
             },
@@ -137,0 +163,0 @@ },

dist/view-2d.js

@@ -64,3 +64,3 @@ import { assign, enqueueActions, fromPromise, setup, stateIn, } from 'xstate';
         forwardToSpawned: ({ context, event }) => {
-            Object.values(context.spawned).forEach((actor) => {
+            context.spawned.forEach((actor) => {
                 actor.send(event);
@@ -110,3 +110,3 @@ });
             scale: 0,
-            spawned: {},
+            spawned: [],
             imageBuilders: [],
@@ -124,3 +124,2 @@ };
                                 // view-2d-vtkjs could be a child actor
-                                // @ts-expect-error cannot spawn actor of type that is not in setup()
                                 const child = spawn(logic, {
@@ -132,8 +131,4 @@ input: { parent: self },
                                 child.send({ type: 'axis', axis });
-                                const id = Object.keys(spawned).length.toString();
                                 onActor(child);
-                                return {
-                                    ...spawned,
-                                    [id]: child,
-                                };
+                                return [...spawned, child];
                             },
@@ -152,3 +147,3 @@ }),
                         enqueueActions(({ context, enqueue }) => {
-                            Object.values(context.spawned).forEach((actor) => {
+                            context.spawned.forEach((actor) => {
                                 enqueue.sendTo(actor, {
@@ -170,2 +165,3 @@ type: 'setImage',
                     {
+                        // @ts-expect-error something about not stateIn having 2 unrelated types
                         guard: stateIn('view2d.buildingImage'),
@@ -183,2 +179,3 @@ target: '.buildingImage',
                     {
+                        // @ts-expect-error something about not stateIn having 2 unrelated types
                         guard: stateIn('view2d.buildingImage'),
@@ -260,3 +257,3 @@ target: '.buildingImage',
                                 enqueueActions(({ context, enqueue }) => {
-                                    Object.values(context.spawned).forEach((actor) => {
+                                    context.spawned.forEach((actor) => {
                                         enqueue.sendTo(actor, {
@@ -315,3 +312,3 @@ type: 'setAxis',
                                         return;
-                                    Object.values(spawned).forEach((actor) => {
+                                    spawned.forEach((actor) => {
                                         enqueue.sendTo(actor, {
@@ -318,0 +315,0 @@ type: 'imageBuilt',

dist/view-3d.js

 import { assign, enqueueActions, fromPromise, setup, } from 'xstate';
 import { image } from './image.js';
 import { reset3d } from './camera.js';
-const viewContext = {
-    scale: 0,
-    image: undefined,
-    spawned: {},
-    viewport: undefined,
-    camera: undefined,
-    autoCameraReset: true,
-};
 export const view3d = setup({
@@ -23,3 +15,3 @@ types: {},
         forwardToSpawned: ({ context, event }) => {
-            Object.values(context.spawned).forEach((actor) => {
+            context.spawned.forEach((actor) => {
                 actor.send(event);
@@ -47,5 +39,7 @@ });
 }).createMachine({
-    context: () => {
-        return JSON.parse(JSON.stringify(viewContext));
-    },
+    context: () => ({
+        scale: 0,
+        spawned: [],
+        autoCameraReset: true,
+    }),
     id: 'view3d',
@@ -60,3 +54,2 @@ initial: 'active',
                             spawned: ({ spawn, context: { spawned, camera, viewport }, event: { logic, onActor }, }) => {
-                                // @ts-expect-error cannot spawn actor of type that is not in setup()
                                 const child = spawn(logic, {
@@ -67,8 +60,4 @@ input: { viewport },
                                     child.send({ type: 'setCamera', camera });
-                                const id = Object.keys(spawned).length.toString();
                                 onActor(child);
-                                return {
-                                    ...spawned,
-                                    [id]: child,
-                                };
+                                return [...spawned, child];
                             },
@@ -87,3 +76,3 @@ }),
                         enqueueActions(({ context, enqueue }) => {
-                            Object.values(context.spawned).forEach((actor) => {
+                            context.spawned.forEach((actor) => {
                                 enqueue.sendTo(actor, {
@@ -157,3 +146,3 @@ type: 'setImage',
                                 enqueueActions(({ context, enqueue, event: { output } }) => {
-                                    Object.values(context.spawned).forEach((actor) => {
+                                    context.spawned.forEach((actor) => {
                                         enqueue.sendTo(actor, {
@@ -160,0 +149,0 @@ type: 'imageBuilt',

dist/viewer.d.ts

@@ -1,4 +0,5 @@
-import { ActorRefFrom, AnyActorRef } from 'xstate';
+import { ActorRefFrom } from 'xstate';
 import MultiscaleSpatialImage from '@itk-viewer/io/MultiscaleSpatialImage.js';
 import { CreateChild } from './children.js';
+import { ViewportActor } from './viewport.js';
 type SetImageEvent = {
@@ -14,49 +15,53 @@ type: 'setImage';
 type Context = {
-    spawned: Record<string, AnyActorRef>;
+    viewports: ViewportActor[];
     images: Record<string, MultiscaleSpatialImage>;
 };
-export declare const viewerMachine: import("xstate").StateMachine<Context, CreateChild | SetImageEvent | SendImageToViewports, Record<string, AnyActorRef>, {
-    src: string;
-    logic: import("xstate").UnknownActorLogic;
-    id: string | undefined;
-}, {
-    type: string;
-    params: import("xstate").NonReducibleUnknown;
-}, {
-    type: string;
-    params: import("xstate").NonReducibleUnknown;
-}, string, "active", string, unknown, import("xstate").NonReducibleUnknown, import("xstate").ResolveTypegenMeta<import("xstate").TypegenDisabled, CreateChild | SetImageEvent | SendImageToViewports, {
-    src: string;
-    logic: import("xstate").UnknownActorLogic;
-    id: string | undefined;
-}, {
-    type: string;
-    params: import("xstate").NonReducibleUnknown;
-}, {
-    type: string;
-    params: import("xstate").NonReducibleUnknown;
-}, string, string>>;
-export declare const createViewer: () => import("xstate").Actor<import("xstate").StateMachine<Context, CreateChild | SetImageEvent | SendImageToViewports, Record<string, AnyActorRef>, {
-    src: string;
-    logic: import("xstate").UnknownActorLogic;
-    id: string | undefined;
-}, {
-    type: string;
-    params: import("xstate").NonReducibleUnknown;
-}, {
-    type: string;
-    params: import("xstate").NonReducibleUnknown;
-}, string, "active", string, unknown, import("xstate").NonReducibleUnknown, import("xstate").ResolveTypegenMeta<import("xstate").TypegenDisabled, CreateChild | SetImageEvent | SendImageToViewports, {
-    src: string;
-    logic: import("xstate").UnknownActorLogic;
-    id: string | undefined;
-}, {
-    type: string;
-    params: import("xstate").NonReducibleUnknown;
-}, {
-    type: string;
-    params: import("xstate").NonReducibleUnknown;
-}, string, string>>>;
+export declare const viewerMachine: import("xstate").StateMachine<Context, CreateChild | SetImageEvent | SendImageToViewports, {}, never, never, never, never, "active", string, import("xstate").NonReducibleUnknown, import("xstate").NonReducibleUnknown, import("xstate").EventObject, import("xstate").MetaObject, {
+    readonly id: "viewer";
+    readonly initial: "active";
+    readonly context: {
+        readonly viewports: [];
+        readonly images: {};
+    };
+    readonly states: {
+        readonly active: {
+            readonly on: {
+                readonly createChild: {
+                    readonly actions: readonly [import("xstate").ActionFunction<Context, CreateChild, CreateChild | SetImageEvent | SendImageToViewports, undefined, never, never, never, never, never>];
+                };
+                readonly setImage: {
+                    readonly actions: readonly [import("xstate").ActionFunction<Context, SetImageEvent, CreateChild | SetImageEvent | SendImageToViewports, undefined, never, never, never, never, never>, import("xstate").ActionFunction<Context, SetImageEvent, CreateChild | SetImageEvent | SendImageToViewports, undefined, never, never, never, never, never>];
+                };
+                readonly sendImageToViewports: {
+                    readonly actions: readonly [({ context, event: { image } }: import("xstate").ActionArgs<Context, SendImageToViewports, CreateChild | SetImageEvent | SendImageToViewports>) => void];
+                };
+            };
+        };
+    };
+}>;
+export declare const createViewer: () => import("xstate").Actor<import("xstate").StateMachine<Context, CreateChild | SetImageEvent | SendImageToViewports, {}, never, never, never, never, "active", string, import("xstate").NonReducibleUnknown, import("xstate").NonReducibleUnknown, import("xstate").EventObject, import("xstate").MetaObject, {
+    readonly id: "viewer";
+    readonly initial: "active";
+    readonly context: {
+        readonly viewports: [];
+        readonly images: {};
+    };
+    readonly states: {
+        readonly active: {
+            readonly on: {
+                readonly createChild: {
+                    readonly actions: readonly [import("xstate").ActionFunction<Context, CreateChild, CreateChild | SetImageEvent | SendImageToViewports, undefined, never, never, never, never, never>];
+                };
+                readonly setImage: {
+                    readonly actions: readonly [import("xstate").ActionFunction<Context, SetImageEvent, CreateChild | SetImageEvent | SendImageToViewports, undefined, never, never, never, never, never>, import("xstate").ActionFunction<Context, SetImageEvent, CreateChild | SetImageEvent | SendImageToViewports, undefined, never, never, never, never, never>];
+                };
+                readonly sendImageToViewports: {
+                    readonly actions: readonly [({ context, event: { image } }: import("xstate").ActionArgs<Context, SendImageToViewports, CreateChild | SetImageEvent | SendImageToViewports>) => void];
+                };
+            };
+        };
+    };
+}>>;
 export type Viewer = ActorRefFrom<typeof viewerMachine>;
 export {};
 //# sourceMappingURL=viewer.d.ts.map

dist/viewer.js

@@ -1,2 +0,2 @@
-import { assign, createActor, raise, setup, } from 'xstate';
+import { assign, createActor, raise, setup } from 'xstate';
 export const viewerMachine = setup({
@@ -8,3 +8,3 @@ types: {},
     context: {
-        spawned: {},
+        viewports: [],
         images: {},
@@ -18,10 +18,6 @@ },
                         assign({
-                            spawned: ({ spawn, context: { spawned }, event: { logic, onActor }, }) => {
+                            viewports: ({ spawn, context: { viewports }, event: { logic, onActor }, }) => {
                                 const child = spawn(logic);
-                                const id = Object.keys(spawned).length.toString();
                                 onActor(child);
-                                return {
-                                    ...spawned,
-                                    [id]: child,
-                                };
+                                return [...viewports, child];
                             },
@@ -48,3 +44,3 @@ }),
                         ({ context, event: { image } }) => {
-                            Object.values(context.spawned).forEach((viewport) => {
+                            Object.values(context.viewports).forEach((viewport) => {
                                 viewport.send({
@@ -51,0 +47,0 @@ type: 'setImage',

dist/viewport.js

@@ -9,4 +9,4 @@ import { assign, sendParent, setup } from 'xstate';
         }),
-        forwardToSpawned: ({ context, event }) => {
-            Object.values(context.spawned).forEach((actor) => {
+        forwardToViews: ({ context, event }) => {
+            context.views.forEach((actor) => {
                 actor.send(event);
@@ -16,2 +16,5 @@ });
     },
+    actors: {
+        camera: cameraMachine,
+    },
 }).createMachine({
@@ -21,4 +24,4 @@ id: 'viewport',
         resolution: [0, 0],
-        spawned: {},
-        camera: spawn(cameraMachine, { id: 'camera' }),
+        views: [],
+        camera: spawn('camera', { id: 'camera' }),
     }),
@@ -32,3 +35,3 @@ initial: 'active',
                         assign({
-                            spawned: ({ spawn, context: { spawned }, event: { logic, onActor }, self, }) => {
+                            views: ({ spawn, context: { views }, event: { logic, onActor }, self, }) => {
                                 const child = spawn(logic);
@@ -38,8 +41,4 @@ child.send({ type: 'setViewport', viewport: self });
                                 child.send({ type: 'setCamera', camera });
-                                const id = Object.keys(spawned).length.toString();
                                 onActor(child);
-                                return {
-                                    ...spawned,
-                                    [id]: child,
-                                };
+                                return [...views, child];
                             },
@@ -54,3 +53,3 @@ }),
                         }),
-                        'forwardToSpawned',
+                        'forwardToViews',
                     ],
@@ -63,3 +62,3 @@ },
                         }),
-                        'forwardToSpawned',
+                        'forwardToViews',
                     ],
@@ -66,0 +65,0 @@ },

package.json

 {
   "name": "@itk-viewer/viewer",
-  "version": "0.6.0",
+  "version": "0.6.1",
   "description": "Multi-dimensional web-based image, mesh, and point set viewer",
@@ -40,3 +40,3 @@ "type": "module",
   "devDependencies": {
-    "typescript": "^5.3.3",
+    "typescript": "^5.5.4",
     "vite": "^5.0.10"
@@ -46,5 +46,5 @@ },
     "gl-matrix": "^3.4.3",
-    "xstate": "5.5.2",
-    "@itk-viewer/utils": "^0.1.3",
-    "@itk-viewer/io": "^0.4.2"
+    "xstate": "5.17.1",
+    "@itk-viewer/io": "^0.4.3",
+    "@itk-viewer/utils": "^0.1.4"
   },
@@ -51,0 +51,0 @@ "scripts": {

src/image-builder.ts

@@ -133,2 +133,5 @@ import {
       }) => {
+        if (builtImage.imageType.dimension === 2) {
+          return { builtImage, sliceIndex: 0 };
+        }
         // builtImage could be larger than slice if cached so
@@ -135,0 +138,0 @@ // find index of slice in builtImage

src/image.ts

@@ -61,2 +61,3 @@ import { ActorRefFrom, AnyActorRef, assign, setup } from 'xstate';
   normalizedColorRanges: Ranges;
+  colorMaps: string[];
   opacityPoints: Point[][];
@@ -82,3 +83,4 @@ normalizedOpacityPoints: Point[][];
           component: number;
-        };
+        }
+      | { type: 'colorMap'; colorMap: string; component: number };
   },
@@ -103,2 +105,15 @@ actions: {
     }),
+    ensureComponentDefaults: assign({
+      colorMaps: ({ context: { dataRanges, colorMaps } }) => {
+        const components = Array.from(
+          { length: dataRanges.length },
+          (_, index) => index,
+        );
+        return components.map((component) => {
+          const colorMap = colorMaps[component];
+          if (colorMap) return colorMap;
+          return 'Viridis (matplotlib)';
+        });
+      },
+    }),
   },
@@ -110,5 +125,6 @@ }).createMachine({
     image,
-    dataRanges: [],
+    dataRanges: [], // by component
     colorRanges: [],
     normalizedColorRanges: [],
+    colorMaps: [],
     opacityPoints: [],
@@ -169,2 +185,3 @@ normalizedOpacityPoints: [],
             'updateOpacityPoints',
+            'ensureComponentDefaults',
           ],
@@ -194,2 +211,15 @@ },
         },
+        colorMap: {
+          actions: [
+            assign({
+              colorMaps: ({ context, event }) => {
+                return [
+                  ...context.colorMaps.slice(0, event.component),
+                  event.colorMap,
+                  ...context.colorMaps.slice(event.component + 1),
+                ];
+              },
+            }),
+          ],
+        },
       },
@@ -196,0 +226,0 @@ },

src/view-2d.cy.ts

@@ -7,3 +7,5 @@ import { createActor, createMachine } from 'xstate';
   it('constructs', () => {
-    expect(createActor(view2d).start()).to.be.ok;
+    const actor = createActor(view2d);
+    actor.start();
+    expect(actor.getSnapshot()).to.be.ok;
   });
@@ -10,0 +12,0 @@

src/view-2d.ts

 import {
-  Actor,
+  ActorRefFrom,
   AnyActorRef,
@@ -72,3 +72,3 @@ assign,
       image?: MultiscaleSpatialImage;
-      spawned: Record<string, AnyActorRef>;
+      spawned: AnyActorRef[]; // renderers
       viewport?: ViewportActor;
@@ -120,3 +120,3 @@ camera?: Camera;
     forwardToSpawned: ({ context, event }) => {
-      Object.values(context.spawned).forEach((actor) => {
+      context.spawned.forEach((actor) => {
         actor.send(event);
@@ -172,3 +172,3 @@ });
       scale: 0,
-      spawned: {},
+      spawned: [],
       imageBuilders: [],
@@ -191,14 +191,9 @@ };
                 // view-2d-vtkjs could be a child actor
-                // @ts-expect-error cannot spawn actor of type that is not in setup()
                 const child = spawn(logic, {
                   input: { parent: self },
-                }) as AnyActorRef;
+                });
                 if (camera) child.send({ type: 'setCamera', camera });
                 child.send({ type: 'axis', axis });
-                const id = Object.keys(spawned).length.toString();
                 onActor(child);
-                return {
-                  ...spawned,
-                  [id]: child,
-                };
+                return [...spawned, child];
               },
@@ -218,3 +213,3 @@ }),
             enqueueActions(({ context, enqueue }) => {
-              Object.values(context.spawned).forEach((actor) => {
+              context.spawned.forEach((actor) => {
                 enqueue.sendTo(actor, {
@@ -236,2 +231,3 @@ type: 'setImage',
           {
+            // @ts-expect-error something about not stateIn having 2 unrelated types
             guard: stateIn('view2d.buildingImage'),
@@ -249,2 +245,3 @@ target: '.buildingImage',
           {
+            // @ts-expect-error something about not stateIn having 2 unrelated types
             guard: stateIn('view2d.buildingImage'),
@@ -324,3 +321,3 @@ target: '.buildingImage',
                 enqueueActions(({ context, enqueue }) => {
-                  Object.values(context.spawned).forEach((actor) => {
+                  context.spawned.forEach((actor) => {
                     enqueue.sendTo(actor, {
@@ -395,3 +392,3 @@ type: 'setAxis',
 
-                    Object.values(spawned).forEach((actor) => {
+                    spawned.forEach((actor) => {
                       enqueue.sendTo(actor, {
@@ -437,2 +434,2 @@ type: 'imageBuilt',
 
-export type View2dActor = Actor<typeof view2d>;
+export type View2dActor = ActorRefFrom<typeof view2d>;

src/view-3d.ts

 import {
-  Actor,
+  ActorRefFrom,
   AnyActorLogic,
@@ -19,9 +19,10 @@ AnyActorRef,
 
-const viewContext = {
-  scale: 0,
-  image: undefined as MultiscaleSpatialImage | undefined,
-  spawned: {} as Record<string, AnyActorRef>,
-  viewport: undefined as ViewportActor | undefined,
-  camera: undefined as Camera | undefined,
-  autoCameraReset: true,
+type Context = {
+  spawned: AnyActorRef[];
+  scale: number;
+  image?: MultiscaleSpatialImage;
+  imageActor?: Image;
+  viewport?: ViewportActor;
+  camera?: Camera;
+  autoCameraReset: boolean;
 };
@@ -31,5 +32,3 @@
   types: {} as {
-    context: typeof viewContext & {
-      imageActor?: Image;
-    };
+    context: Context;
     events:
@@ -63,3 +62,3 @@ | { type: 'setImage'; image: MultiscaleSpatialImage }
     forwardToSpawned: ({ context, event }) => {
-      Object.values(context.spawned).forEach((actor) => {
+      context.spawned.forEach((actor) => {
         actor.send(event);
@@ -89,5 +88,7 @@ });
 }).createMachine({
-  context: () => {
-    return JSON.parse(JSON.stringify(viewContext));
-  },
+  context: () => ({
+    scale: 0,
+    spawned: [],
+    autoCameraReset: true,
+  }),
   id: 'view3d',
@@ -106,3 +107,2 @@ initial: 'active',
               }) => {
-                // @ts-expect-error cannot spawn actor of type that is not in setup()
                 const child = spawn(logic, {
@@ -112,8 +112,4 @@ input: { viewport },
                 if (camera) child.send({ type: 'setCamera', camera });
-                const id = Object.keys(spawned).length.toString();
                 onActor(child);
-                return {
-                  ...spawned,
-                  [id]: child,
-                };
+                return [...spawned, child];
               },
@@ -133,3 +129,3 @@ }),
             enqueueActions(({ context, enqueue }) => {
-              Object.values(context.spawned).forEach((actor) => {
+              context.spawned.forEach((actor) => {
                 enqueue.sendTo(actor, {
@@ -201,3 +197,3 @@ type: 'setImage',
                 enqueueActions(({ context, enqueue, event: { output } }) => {
-                  Object.values(context.spawned).forEach((actor) => {
+                  context.spawned.forEach((actor) => {
                     enqueue.sendTo(actor, {
@@ -222,2 +218,2 @@ type: 'imageBuilt',
 
-export type View3dActor = Actor<typeof view3d>;
+export type View3dActor = ActorRefFrom<typeof view3d>;

src/viewer.cy.ts

@@ -12,3 +12,3 @@ import { createActor, createMachine } from 'xstate';
   it('constructs', () => {
-    expect(createViewer()).to.be.ok;
+    expect(createViewer().getSnapshot()).to.be.ok;
   });
@@ -15,0 +15,0 @@

src/viewer.ts

@@ -1,11 +0,5 @@
-import {
-  ActorRefFrom,
-  AnyActorRef,
-  assign,
-  createActor,
-  raise,
-  setup,
-} from 'xstate';
+import { ActorRefFrom, assign, createActor, raise, setup } from 'xstate';
 import MultiscaleSpatialImage from '@itk-viewer/io/MultiscaleSpatialImage.js';
 import { CreateChild } from './children.js';
+import { ViewportActor } from './viewport.js';
 
@@ -24,3 +18,3 @@ type SetImageEvent = {
 type Context = {
-  spawned: Record<string, AnyActorRef>;
+  viewports: ViewportActor[];
   images: Record<string, MultiscaleSpatialImage>;
@@ -38,3 +32,3 @@ };
   context: {
-    spawned: {},
+    viewports: [],
     images: {},
@@ -48,14 +42,10 @@ },
             assign({
-              spawned: ({
+              viewports: ({
                 spawn,
-                context: { spawned },
+                context: { viewports },
                 event: { logic, onActor },
               }) => {
-                const child = spawn(logic);
-                const id = Object.keys(spawned).length.toString();
+                const child = spawn(logic) as ViewportActor;
                 onActor(child);
-                return {
-                  ...spawned,
-                  [id]: child,
-                };
+                return [...viewports, child];
               },
@@ -82,3 +72,3 @@ }),
             ({ context, event: { image } }) => {
-              Object.values(context.spawned).forEach((viewport) => {
+              Object.values(context.viewports).forEach((viewport) => {
                 viewport.send({
@@ -85,0 +75,0 @@ type: 'setImage',

src/viewport.cy.ts

@@ -20,3 +20,3 @@ import { createActor, createMachine } from 'xstate';
   it('constructs', () => {
-    expect(createViewport()).to.be.ok;
+    createViewport();
   });
@@ -23,0 +23,0 @@

src/viewport.ts

@@ -1,2 +0,2 @@
-import { Actor, AnyActorRef, assign, sendParent, setup } from 'xstate';
+import { ActorRefFrom, AnyActorRef, assign, sendParent, setup } from 'xstate';
 import { ReadonlyMat4 } from 'gl-matrix';
@@ -12,3 +12,3 @@
   resolution: [number, number];
-  spawned: Record<string, AnyActorRef>;
+  views: AnyActorRef[];
 };
@@ -47,4 +47,4 @@
     }),
-    forwardToSpawned: ({ context, event }) => {
-      Object.values(context.spawned).forEach((actor) => {
+    forwardToViews: ({ context, event }) => {
+      context.views.forEach((actor) => {
         actor.send(event);
@@ -54,2 +54,5 @@ });
   },
+  actors: {
+    camera: cameraMachine,
+  },
 }).createMachine({
@@ -59,4 +62,4 @@ id: 'viewport',
     resolution: [0, 0],
-    spawned: {},
-    camera: spawn(cameraMachine, { id: 'camera' }),
+    views: [],
+    camera: spawn('camera', { id: 'camera' }),
   }),
@@ -70,5 +73,5 @@ initial: 'active',
             assign({
-              spawned: ({
+              views: ({
                 spawn,
-                context: { spawned },
+                context: { views },
                 event: { logic, onActor },
@@ -81,8 +84,4 @@ self,
                 child.send({ type: 'setCamera', camera });
-                const id = Object.keys(spawned).length.toString();
                 onActor(child);
-                return {
-                  ...spawned,
-                  [id]: child,
-                };
+                return [...views, child];
               },
@@ -97,3 +96,3 @@ }),
             }),
-            'forwardToSpawned',
+            'forwardToViews',
           ],
@@ -107,3 +106,3 @@ },
             }),
-            'forwardToSpawned',
+            'forwardToViews',
           ],
@@ -124,2 +123,2 @@ },
 
-export type ViewportActor = Actor<typeof viewportMachine>;
+export type ViewportActor = ActorRefFrom<typeof viewportMachine>;

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

1075481

increased by268.03%

Lines of code

17119

increased by203.91%

Worsened metrics

Number of medium supply chain risk alerts

1

increased byInfinity%

Dependency changes

• + Addedxstate@5.17.1(transitive)

• - Removedxstate@5.5.2(transitive)

• Updated@itk-viewer/io@^0.4.3

• Updated@itk-viewer/utils@^0.1.4

• Updatedxstate@5.17.1