@jax-data-science/sci-image-visualizer 0.9.0 → 0.11.0

package/lib/store/region-store.service.d.ts

@@ -3,9 +3,17 @@ import { IImageInfo } from '../contracts/image.contract';
 import { Region, Rectangle, Polygon, MultiPolygon } from '../models/region';
 import { VisualizerStore } from './visualizer-store.service';
 import { IRegionStore } from '../contracts/visualizer.contract';
-import { IRegionEditApi } from '../contracts/region-store.contract';
+import { IRegionEditApi, IRegionSourceApi } from '../contracts/region-store.contract';
+import type { Mesh } from 'napari-js/geometry';
+import { SliceOutlines } from '../geometry/reconstruct';
 import { StackSaveLayout } from './region-scope-cache';
+import { RegionSourceOpener, RegionSourceSlices } from './region-source-scope';
+import type { RegionSource, RegionSourceView } from '../region-source/region-source';
+import type { RegionIndexPage, RegionIndexQuery } from '../region-source/region-tiles';
+import { RegionStyle } from '../region-overlay/region-style';
 import * as i0 from "@angular/core";
+/** Selecting classes takes at most this many region-source features into the regions. */
+export declare const SELECT_CLASSES_LIMIT = 5000;
 /**
  * Backend-neutral region store — the single source of truth for region state.
  *
@@ -34,7 +42,7 @@ import * as i0 from "@angular/core";
  * backends); GeoJSON import/export is `models/region-geojson`. All coordinates
  * are image pixels.
  */
-export declare class RegionStore implements IRegionStore, IRegionEditApi {
+export declare class RegionStore implements IRegionStore, IRegionEditApi, IRegionSourceApi {
     private store;
     private static readonly UNDO_LIMIT;
     private static readonly UNDO_COALESCE_MS;
@@ -78,6 +86,35 @@ export declare class RegionStore implements IRegionStore, IRegionEditApi {
     /** Emit coalescing for live drags (see IRegionEditApi.beginBatch). */
     private batchDepth;
     private pendingEmit;
+    /**
+     * Large region sets held as tiled region sources rather than as regions (see
+     * {@link attachRegionSource}): per image and slice, with the ids taken out of each.
+     */
+    private readonly sources;
+    private readonly sourceView$;
+    /** The region look the user chose (overrides the source's hint), field by field. */
+    private userStyle;
+    /** The current source's style hint. */
+    private hintStyle;
+    private readonly regionStyle$;
+    /** Bumped on every change of the slice's source, so a late open is dropped. */
+    private sourceGeneration;
+    /** The source last published as the view: a source shown again does not turn the labels back on. */
+    private shownSource;
+    /** Bumped when a region source is attached or dropped: what is read from the sources is stale. */
+    private sourcesVersion;
+    /**
+     * The region sources' part of {@link classVolumes}, by class and what the sources hold (see
+     * {@link sourceStateKey}): an edit of the regions leaves it, so the volumes of a slice being drawn
+     * on cost no source reads.
+     */
+    private readonly sourceVolumeCache;
+    /** The region sources' outlines of the class sets reconstructed last (see {@link sourceOutlines}). */
+    private readonly sourceOutlineCache;
+    /** The classes hidden from view (names as given); every class is shown at first. */
+    private readonly hiddenClasses$;
+    /** {@link hiddenClasses$} by {@link presetKey}, as a region's label is matched. */
+    private hiddenKeys;
     constructor(store: VisualizerStore);
     /**
      * Replace (or, with `append`, add to) the current image's regions. Mints ids
@@ -236,6 +273,10 @@ export declare class RegionStore implements IRegionStore, IRegionEditApi {
      * region it edits) rather than changing them, so it never changes after this.
      */
     private recordUndoSnapshot;
+    /** The state an undo step restores. */
+    private snapshot;
+    /** Parse GeoJSON into regions, remembering the class colours the file carries so they are
+     *  kept for classes with no preset (see VisualizerStore.rememberImportedClassColors). */
     importRegions(geoJsonStr: string): Region[];
     /** Download `regions` as GeoJSON, named after `fileName` (extension
      *  replaced by `.geojson`) or `rois.geojson` without one. */
@@ -286,6 +327,179 @@ export declare class RegionStore implements IRegionStore, IRegionEditApi {
     beginGesture(): void;
     /** End the gesture opened by {@link beginGesture}; the next commit starts a new step. */
     endGesture(): void;
+    /**
+     * Hold a large region set as a tiled region source instead of as regions: the backends that
+     * draw sources (OpenSeadragon, napari) draw its features at the detail the zoom shows, from
+     * the tiles in view, and a feature joins the regions — exactly, as an ordinary editable
+     * {@link Region} with its {@link Region.sourceId} — only when it is selected or edited
+     * ({@link takeSourceFeatures}). Until then {@link getRegions} does not include it.
+     *
+     * `source` may be an opener, called the first time its slice is shown (and again if the
+     * source was closed to save memory). `slices` says which slice of the current image it
+     * serves: one (default: the slice shown; plane 0 of the source), or `'planes'`, every slice z
+     * from plane z of a z-indexed source. Replaces the source those slices had.
+     *
+     * `imported` marks a source brought in over the image (an imported volume, folder or served set)
+     * rather than the image's own regions: it is on no file yet, so a save writes its slices though
+     * nothing was taken from it — `true` for a source of one slice, the slices its planes cover for a
+     * `'planes'` source. The image's own sources are not marked: loading them changes nothing to save.
+     */
+    attachRegionSource(source: RegionSource | RegionSourceOpener, slices?: RegionSourceSlices, imported?: boolean | readonly number[]): void;
+    /** Drop the current image's region sources (closing them) and what was taken from them. */
+    detachRegionSources(): void;
+    /**
+     * Drop the slice's region source, for regions imported in place of the slice's (a small file
+     * replacing a large one): a source of the slice's own is detached; a z-indexed source over every
+     * slice has this slice's features taken out (as deleted). The other slices keep theirs.
+     */
+    dropSliceRegionSource(): Promise<void>;
+    /** Whether the slice shown has a region source. */
+    hasRegionSource(): boolean;
+    /** The slice's region source as a source layer draws it; null without one (or until it opens). */
+    getRegionSourceView(): RegionSourceView | null;
+    /** {@link getRegionSourceView} and every change of it (slice, taken ids, class colours). */
+    getRegionSourceView$(): Observable<RegionSourceView | null>;
+    /**
+     * Take source features into the working set for editing: their exact geometry becomes
+     * ordinary regions (minted, coloured and slice-tagged as any region entering the store) and
+     * the source stops drawing them. Not an undo step of its own — undoing past it puts the
+     * features back in the source. Resolves the region ids, in the order asked (a feature already
+     * taken resolves to its region); [] when the slice changed meanwhile.
+     */
+    takeSourceFeatures(ids: readonly string[]): Promise<number[]>;
+    /** {@link takeSourceFeatures}, then select them (added to the selection with `additive`). */
+    selectSourceFeatures(ids: readonly string[], additive?: boolean): Promise<number[]>;
+    /**
+     * Features per class still in the slice's region source (not taken); {} without one. With
+     * `stack`, a z-stack's over every slice: its source's planes, or each slice's source added up.
+     */
+    getRegionSourceClassCounts(stack?: boolean): Promise<Record<string, number>>;
+    /**
+     * Select every region of these classes on the slice — the regions', and the region source's,
+     * which are taken into the regions (at most {@link SELECT_CLASSES_LIMIT} of them). Added to the
+     * selection with `additive`. Resolves the selected region ids.
+     */
+    selectClasses(classes: readonly string[], additive?: boolean): Promise<number[]>;
+    /**
+     * The 3D reconstruction of each group of classes over every slice of the stack (an atlas
+     * structure with its substructures, say): the outlines of the regions of those classes on every
+     * slice — the region sources' and those drawn or taken — stacked and meshed in a worker. Meshes
+     * are in image px (x, y) and slice indices (z). `pixelStep` is the in-plane voxel size (image
+     * px); the outlines are read at the matching level of detail. A group with no outline gets an
+     * empty mesh.
+     */
+    reconstructClasses(groups: ReadonlyArray<{
+        key: string;
+        classes: readonly string[];
+    }>, pixelStep?: number): Promise<Array<{
+        key: string;
+        mesh: Mesh;
+    }>>;
+    /**
+     * Each class's volume over the whole stack, in px² × slices: its outlines' area on every slice
+     * (its features' union, see `outlinesArea`), one slice thick (Cavalieri's estimator), from the
+     * exact outlines. Where a feature is, a region source's or a drawn or taken region, does not
+     * change it: taking one leaves the volume as it was. The region sources' part is cached until
+     * what they hold changes (a feature taken or deleted, another source); only the slices with
+     * drawn or taken regions of the class are measured again.
+     */
+    classVolumes(classes: readonly string[]): Promise<Map<string, number>>;
+    /** The region sources' part of a class's volume, cached by what they hold (see classVolumes). */
+    private sourceVolume;
+    /**
+     * Every slice's outlines of these classes, the region sources' then the regions': closed shapes'
+     * rings, and open polylines as `lines`.
+     */
+    private classOutlines;
+    /**
+     * The region sources' outlines of these classes on every slice, without the features taken or
+     * deleted. The last few class sets are kept until what the sources hold changes: rebuilding a
+     * surface after an edit reads nothing again.
+     */
+    private sourceOutlines;
+    private readSourceOutlines;
+    /**
+     * Every class's outlines on every slice, by class: the region sources' (one read for all, kept
+     * like {@link sourceOutlines}) and the drawn and taken regions'. What a section through the
+     * stack cuts (see `geometry/section`).
+     */
+    outlinesByClass(level: number): Promise<Map<string, SliceOutlines[]>>;
+    /** The drawn and taken regions' outlines of these classes, by slice. */
+    private regionOutlines;
+    /** Each drawn or taken region's outlines (of the `wanted` classes; null: every class) with its class. */
+    private labelledRegionOutlines;
+    /** What the region sources of the image hold (see {@link sourceStateKey}): it changes when a
+     *  feature is taken or deleted, or that is undone. */
+    getSourceStateKey(): string;
+    /**
+     * What the region sources of the image hold: the image, its sources (one attached or dropped
+     * bumps the version) and the features taken from them. A key for what is read from them.
+     */
+    private sourceStateKey;
+    /** Delete source features without taking them (one undo step). */
+    deleteSourceFeatures(ids: readonly string[]): void;
+    /**
+     * A page of the slice source's features not taken from it (file order), e.g. for the Region
+     * Editor's list; an empty page without a source.
+     */
+    getRegionSourceIndex(query: Omit<RegionIndexQuery, 'exclude'>): Promise<RegionIndexPage>;
+    /**
+     * `regions` as a GeoJSON FeatureCollection string merged with the region sources behind them:
+     * the sources' features that were not taken (or deleted), then `regions`. Without a source,
+     * {@link getGeoJsonString}.
+     *
+     * `slice` names one slice-file of a folder stack (a per-slice-file save): its source's features,
+     * on the file's own plane — of a z-indexed source over every slice, only that slice's plane.
+     * Without it, the export is the image's: on a stack saved as one file, every slice's source
+     * (each feature on its slice's plane, `geometry.plane.z`) and a z-indexed source's every plane;
+     * otherwise the source of the slice shown.
+     */
+    getGeoJsonWithSource(regions: Region[], slice?: number): Promise<string>;
+    /**
+     * Whether a region of class `label` goes unlabelled because a subclass of it (by the region
+     * source's class hierarchy) is among the regions too — an atlas's "Isocortex" under its areas.
+     * False without a hierarchy.
+     */
+    isLabelCovered(label: string | undefined): boolean;
+    private coveredFor;
+    /** The classes hidden from view (see {@link setClassesHidden}). */
+    getHiddenClasses(): ReadonlySet<string>;
+    /** {@link getHiddenClasses} and every change of it. */
+    getHiddenClasses$(): Observable<ReadonlySet<string>>;
+    /**
+     * Hide (or show again) these classes' regions: the overlays and the region source's layer stop
+     * drawing them, and a hidden region can be neither picked nor kept selected. The regions stay in
+     * the set (the table lists them; a save keeps them).
+     */
+    setClassesHidden(classes: readonly string[], hidden: boolean): void;
+    /** Whether regions labelled `label` are hidden (an unlabelled region never is). */
+    isClassHidden(label: string | null | undefined): boolean;
+    /** The region look: outlines, or filled (an atlas's look); see `region-style`. */
+    getRegionStyle(): RegionStyle;
+    /** {@link getRegionStyle} and every change of it. */
+    getRegionStyle$(): Observable<RegionStyle>;
+    /**
+     * Choose the region look, field by field; it overrides a region source's hint for the session.
+     * The overlays redraw.
+     */
+    setRegionStyle(patch: Partial<RegionStyle>): void;
+    /** The look now: the user's choice, else the source's hint, else outlines. */
+    private effectiveStyle;
+    /** Publish the look when it changed: the overlays redraw the regions, the source layer its features. */
+    private restyle;
+    /** Re-emit the source view with the current look and label setting. */
+    private republishView;
+    /** The slice a region source is keyed by: the display slice in stack mode, else 0. */
+    private get sourceSlice();
+    private currentTaken;
+    /** Replace the slice's taken ids and tell the source layers. */
+    private setTaken;
+    /**
+     * Look up (opening it if needed) the slice's source and publish it as the source view. The view
+     * is withdrawn at once: until the incoming source opens, nothing reads, takes or deletes from the
+     * outgoing one into the slice now shown.
+     */
+    private refreshSourceView;
     /**
      * Switch the active image: snapshot the outgoing regions, restore the
      * incoming image's (or [] if none), clear selection, and notify. Idempotent

package/lib/store/visualizer-store.service.d.ts

@@ -36,6 +36,8 @@ export declare class VisualizerStore {
     private readonly grayscale$;
     private readonly invert$;
     private presetSet;
+    /** Session-only class colours from imported files (see PresetSet.importedColors). */
+    private importedColors;
     private readonly presetSet$;
     private readonly savePresets$;
     private presetsLoaded;
@@ -46,6 +48,8 @@ export declare class VisualizerStore {
     private readonly spatialView$;
     constructor(prefsPort?: PreferencesPort | null);
     private initPresetPersistence;
+    /** Publish the preset set with this session's imported class colours. */
+    private emitPresetSet;
     private normalizePresetSet;
     /** Queue a debounced save. No-ops until the initial load resolves (and when no port is bound). */
     private queuePresetSave;
@@ -114,6 +118,12 @@ export declare class VisualizerStore {
     /** Upsert a single class colour (used by the editor's per-class colour picker). */
     setClassificationColor(label: string, color: string): void;
     getPresetSet(): PresetSet;
+    /**
+     * Remember the class colours an imported file carried (label → colour), so its regions keep
+     * them: a class with a preset keeps the preset's colour, and the latest import wins for the
+     * rest. Not persisted.
+     */
+    rememberImportedClassColors(colors: ReadonlyMap<string, string>): void;
     getPresetSet$(): Observable<PresetSet>;
     setPresetSet(set: PresetSet): void;
     /** Add or update a class (keyed by exact stored `name`). */

package/lib/toolbar/region-tools/region-tools.component.d.ts

@@ -12,6 +12,8 @@ export declare class RegionToolsComponent {
     activeDragMode: string | null;
     /** The 3D cloud's screen-space lasso: no brush or polyline. */
     is3dRegions: boolean;
+    /** Only the selection tool (a volume view: it picks the regions' surfaces in 3D). */
+    selectOnly: boolean;
     /** The backend has a vertex-editing overlay (OSD + napari-js image). */
     vertexTools: boolean;
     /** Magic-wand sensitivity (the wand's slider value). */
@@ -56,5 +58,5 @@ export declare class RegionToolsComponent {
     /** A single slider's value (a range slider never feeds these). */
     protected asNumber(v: number | number[] | undefined): number | undefined;
     static ɵfac: i0.ɵɵFactoryDeclaration<RegionToolsComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<RegionToolsComponent, "toolbar-region-tools", never, { "activeDragMode": { "alias": "activeDragMode"; "required": false; }; "is3dRegions": { "alias": "is3dRegions"; "required": false; }; "vertexTools": { "alias": "vertexTools"; "required": false; }; "wandSensitivity": { "alias": "wandSensitivity"; "required": false; }; "brushSize": { "alias": "brushSize"; "required": false; }; "vertexEraserRadius": { "alias": "vertexEraserRadius"; "required": false; }; "canUndo": { "alias": "canUndo"; "required": false; }; "canRedo": { "alias": "canRedo"; "required": false; }; }, { "openRegionEditor": "openRegionEditor"; "toggleDragMode": "toggleDragMode"; "undoRegion": "undoRegion"; "redoRegion": "redoRegion"; "deleteRegion": "deleteRegion"; "wandSensitivityChange": "wandSensitivityChange"; "brushSizeChange": "brushSizeChange"; "vertexEraserRadiusChange": "vertexEraserRadiusChange"; }, never, never, true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<RegionToolsComponent, "toolbar-region-tools", never, { "activeDragMode": { "alias": "activeDragMode"; "required": false; }; "is3dRegions": { "alias": "is3dRegions"; "required": false; }; "selectOnly": { "alias": "selectOnly"; "required": false; }; "vertexTools": { "alias": "vertexTools"; "required": false; }; "wandSensitivity": { "alias": "wandSensitivity"; "required": false; }; "brushSize": { "alias": "brushSize"; "required": false; }; "vertexEraserRadius": { "alias": "vertexEraserRadius"; "required": false; }; "canUndo": { "alias": "canUndo"; "required": false; }; "canRedo": { "alias": "canRedo"; "required": false; }; }, { "openRegionEditor": "openRegionEditor"; "toggleDragMode": "toggleDragMode"; "undoRegion": "undoRegion"; "redoRegion": "redoRegion"; "deleteRegion": "deleteRegion"; "wandSensitivityChange": "wandSensitivityChange"; "brushSizeChange": "brushSizeChange"; "vertexEraserRadiusChange": "vertexEraserRadiusChange"; }, never, never, true, never>;
 }

package/lib/toolbar/stack-controls/stack-controls.component.d.ts

@@ -1,4 +1,4 @@
-import { EventEmitter } from '@angular/core';
+import { EventEmitter, OnDestroy } from '@angular/core';
 import * as i0 from "@angular/core";
 /** A stack-mode choice (`val` 'false' = single image, 'true' = stack). */
 export interface StackOption {
@@ -6,11 +6,11 @@ export interface StackOption {
     val: string;
 }
 /**
- * The toolbar's z-stack group: a live slice scrubber for the views that swap
- * slices in place, or (Plotly heatmap) the single-image / stack toggle with a
- * slice-number field. Presentational: the host owns `zIndex`.
+ * The toolbar's z-stack group: the slice bar, and (Plotly heatmap) the single-image / stack
+ * toggle. The views that swap slices in place follow the bar as it moves; the heatmap's single
+ * image is re-plotted at the slice it settles on. Presentational: the host owns `zIndex`.
  */
-export declare class StackControlsComponent {
+export declare class StackControlsComponent implements OnDestroy {
     /** Show the live slice scrubber. */
     liveScrubber: boolean;
     /** Show the single-image / stack toggle (Plotly heatmap). */
@@ -29,12 +29,23 @@ export declare class StackControlsComponent {
     zSlide: EventEmitter<number | undefined>;
     /** A stack-mode choice was picked. */
     selectStackOption: EventEmitter<StackOption>;
-    /** A slice number was typed (blank reports the current slice). */
+    /** The heatmap's slice bar moved to a slice (the host shows its number). */
     zIndexInput: EventEmitter<number>;
-    /** Enter in the slice field / the reload button: re-plot at the typed slice. */
+    /** The heatmap's slice bar settled: re-plot at that slice. */
     reloadAndPlot: EventEmitter<void>;
-    /** The slice field reports what was typed (blank keeps the current slice). */
-    protected onSliceInput(value: string | number | null): void;
+    /** How long key steps on the heatmap's bar pause before the slice is re-plotted. */
+    static readonly REPLOT_DELAY_MS = 400;
+    /** A drag of the bar is under way (its end re-plots the heatmap, not each step). */
+    protected dragging: boolean;
+    private replot;
+    /** The heatmap in single-image mode: its bar re-plots the slice it settles on. */
+    protected get singleImage(): boolean;
+    /** The bar moved: a live view follows it; the heatmap shows the number, and re-plots after key steps pause. */
+    protected onSliceChange(z: number | undefined): void;
+    /** The bar was let go (a drag's end, or a click on its track). */
+    protected onSliceEnd(z: number | undefined): void;
+    private cancelReplot;
+    ngOnDestroy(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<StackControlsComponent, never>;
     static ɵcmp: i0.ɵɵComponentDeclaration<StackControlsComponent, "toolbar-stack-controls", never, { "liveScrubber": { "alias": "liveScrubber"; "required": false; }; "stackToggle": { "alias": "stackToggle"; "required": false; }; "showStack": { "alias": "showStack"; "required": false; }; "stackOptions": { "alias": "stackOptions"; "required": false; }; "zIndex": { "alias": "zIndex"; "required": false; }; "maxIndex": { "alias": "maxIndex"; "required": false; }; }, { "zScrub": "zScrub"; "zSlide": "zSlide"; "selectStackOption": "selectStackOption"; "zIndexInput": "zIndexInput"; "reloadAndPlot": "reloadAndPlot"; }, never, never, true, never>;
 }

package/lib/toolbar/toolbar.component.d.ts

@@ -52,6 +52,10 @@ export declare class ToolbarComponent {
      * controls — flipping that would show 2D pan/zoom and hide the orbit controls.
      */
     is3dRegions: boolean;
+    /** A napari volume / isosurface view: the Region Editor (regions in 3D) without drawing tools. */
+    isVolumeView: boolean;
+    /** Whether the volume view is split with the slice editor (the slice, with every region tool). */
+    sliceEditor: boolean;
     /** The armed tool's mode (zoom, pan, a drawing tool, `samPoint`, …), or null. */
     activeDragMode: string | null;
     /** The 3D camera mode (`turntable` / `orbit` / …). */
@@ -118,6 +122,8 @@ export declare class ToolbarComponent {
     openSpatialControls: EventEmitter<void>;
     /** Open the Region Editor dialog. */
     openRegionEditor: EventEmitter<void>;
+    /** Split the volume view with the slice editor, or close it. */
+    toggleSliceEditor: EventEmitter<void>;
     /** A single-image / stack choice was picked. */
     selectStackOption: EventEmitter<{
         name: string;
@@ -202,7 +208,8 @@ export declare class ToolbarComponent {
      *  view, the napari-js WebGPU image, the napari-js surface — which rebuilds the height field
      *  from the picked slice (jit-ui#102) — and the 2D spatial-omics view, where a 3D dataset's
      *  registered volume is the image and the slider picks the section whose observations are
-     *  drawn. Drives the per-slice slider. */
+     *  drawn. Also a split volume view, whose slice editor shows the slice picked. Drives the
+     *  per-slice slider. */
     protected get showsLiveSliceScrubber(): boolean;
     /** Any napari-js WebGPU plot type. The single-image/stack toggle + slice-number field are
      *  Plotly-only stack controls, so they're hidden for napari (jit-ui#102). */
@@ -218,5 +225,5 @@ export declare class ToolbarComponent {
     protected get isIntensityCapable(): boolean;
     protected showHelp(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<ToolbarComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<ToolbarComponent, "plotting-toolbar", never, { "imageInfo": { "alias": "imageInfo"; "required": false; }; "hasSpatialDataset": { "alias": "hasSpatialDataset"; "required": false; }; "plotTypeOptions": { "alias": "plotTypeOptions"; "required": false; }; "selectedPlotType": { "alias": "selectedPlotType"; "required": false; }; "basePlotType": { "alias": "basePlotType"; "required": false; }; "isoRange": { "alias": "isoRange"; "required": false; }; "maxIndex": { "alias": "maxIndex"; "required": false; }; "zIndex": { "alias": "zIndex"; "required": false; }; "isHeatmap": { "alias": "isHeatmap"; "required": false; }; "is3dRegions": { "alias": "is3dRegions"; "required": false; }; "activeDragMode": { "alias": "activeDragMode"; "required": false; }; "activeSurface3dMode": { "alias": "activeSurface3dMode"; "required": false; }; "axesVisible": { "alias": "axesVisible"; "required": false; }; "wireframeActive": { "alias": "wireframeActive"; "required": false; }; "resolutionScale": { "alias": "resolutionScale"; "required": false; }; "wandSensitivity": { "alias": "wandSensitivity"; "required": false; }; "brushSize": { "alias": "brushSize"; "required": false; }; "vertexEraserRadius": { "alias": "vertexEraserRadius"; "required": false; }; "canUndo": { "alias": "canUndo"; "required": false; }; "canRedo": { "alias": "canRedo"; "required": false; }; "stackOptions": { "alias": "stackOptions"; "required": false; }; "tools": { "alias": "tools"; "required": false; }; "imageSmoothingEnabled": { "alias": "imageSmoothingEnabled"; "required": false; }; "samModels": { "alias": "samModels"; "required": false; }; "samModelId": { "alias": "samModelId"; "required": false; }; "contributedTools": { "alias": "contributedTools"; "required": false; }; "dialogTools": { "alias": "dialogTools"; "required": false; }; "openDialogToolId": { "alias": "openDialogToolId"; "required": false; }; "toolModelIds": { "alias": "toolModelIds"; "required": false; }; }, { "selectPlotType": "selectPlotType"; "addProfileLine": "addProfileLine"; "toggleImageSmoothing": "toggleImageSmoothing"; "isoRangeChange": "isoRangeChange"; "openChannelHistogram": "openChannelHistogram"; "openSpatialControls": "openSpatialControls"; "openRegionEditor": "openRegionEditor"; "selectStackOption": "selectStackOption"; "zScrub": "zScrub"; "zSlide": "zSlide"; "zIndexInput": "zIndexInput"; "reloadAndPlot": "reloadAndPlot"; "downloadImage": "downloadImage"; "autoscaleImage": "autoscaleImage"; "toggleDragMode": "toggleDragMode"; "zoomIn": "zoomIn"; "zoomOut": "zoomOut"; "toggleSurface3dMode": "toggleSurface3dMode"; "resetSurfaceCamera": "resetSurfaceCamera"; "toggleAxes": "toggleAxes"; "toggleWireframe": "toggleWireframe"; "selectResolution": "selectResolution"; "deleteRegion": "deleteRegion"; "undoRegion": "undoRegion"; "redoRegion": "redoRegion"; "segmentRegions": "segmentRegions"; "segmentCellpose": "segmentCellpose"; "runTool": "runTool"; "toggleDialogTool": "toggleDialogTool"; "toolModelChange": "toolModelChange"; "openToolParams": "openToolParams"; "samModelChange": "samModelChange"; "wandSensitivityChange": "wandSensitivityChange"; "brushSizeChange": "brushSizeChange"; "vertexEraserRadiusChange": "vertexEraserRadiusChange"; }, never, ["*"], true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<ToolbarComponent, "plotting-toolbar", never, { "imageInfo": { "alias": "imageInfo"; "required": false; }; "hasSpatialDataset": { "alias": "hasSpatialDataset"; "required": false; }; "plotTypeOptions": { "alias": "plotTypeOptions"; "required": false; }; "selectedPlotType": { "alias": "selectedPlotType"; "required": false; }; "basePlotType": { "alias": "basePlotType"; "required": false; }; "isoRange": { "alias": "isoRange"; "required": false; }; "maxIndex": { "alias": "maxIndex"; "required": false; }; "zIndex": { "alias": "zIndex"; "required": false; }; "isHeatmap": { "alias": "isHeatmap"; "required": false; }; "is3dRegions": { "alias": "is3dRegions"; "required": false; }; "isVolumeView": { "alias": "isVolumeView"; "required": false; }; "sliceEditor": { "alias": "sliceEditor"; "required": false; }; "activeDragMode": { "alias": "activeDragMode"; "required": false; }; "activeSurface3dMode": { "alias": "activeSurface3dMode"; "required": false; }; "axesVisible": { "alias": "axesVisible"; "required": false; }; "wireframeActive": { "alias": "wireframeActive"; "required": false; }; "resolutionScale": { "alias": "resolutionScale"; "required": false; }; "wandSensitivity": { "alias": "wandSensitivity"; "required": false; }; "brushSize": { "alias": "brushSize"; "required": false; }; "vertexEraserRadius": { "alias": "vertexEraserRadius"; "required": false; }; "canUndo": { "alias": "canUndo"; "required": false; }; "canRedo": { "alias": "canRedo"; "required": false; }; "stackOptions": { "alias": "stackOptions"; "required": false; }; "tools": { "alias": "tools"; "required": false; }; "imageSmoothingEnabled": { "alias": "imageSmoothingEnabled"; "required": false; }; "samModels": { "alias": "samModels"; "required": false; }; "samModelId": { "alias": "samModelId"; "required": false; }; "contributedTools": { "alias": "contributedTools"; "required": false; }; "dialogTools": { "alias": "dialogTools"; "required": false; }; "openDialogToolId": { "alias": "openDialogToolId"; "required": false; }; "toolModelIds": { "alias": "toolModelIds"; "required": false; }; }, { "selectPlotType": "selectPlotType"; "addProfileLine": "addProfileLine"; "toggleImageSmoothing": "toggleImageSmoothing"; "isoRangeChange": "isoRangeChange"; "openChannelHistogram": "openChannelHistogram"; "openSpatialControls": "openSpatialControls"; "openRegionEditor": "openRegionEditor"; "toggleSliceEditor": "toggleSliceEditor"; "selectStackOption": "selectStackOption"; "zScrub": "zScrub"; "zSlide": "zSlide"; "zIndexInput": "zIndexInput"; "reloadAndPlot": "reloadAndPlot"; "downloadImage": "downloadImage"; "autoscaleImage": "autoscaleImage"; "toggleDragMode": "toggleDragMode"; "zoomIn": "zoomIn"; "zoomOut": "zoomOut"; "toggleSurface3dMode": "toggleSurface3dMode"; "resetSurfaceCamera": "resetSurfaceCamera"; "toggleAxes": "toggleAxes"; "toggleWireframe": "toggleWireframe"; "selectResolution": "selectResolution"; "deleteRegion": "deleteRegion"; "undoRegion": "undoRegion"; "redoRegion": "redoRegion"; "segmentRegions": "segmentRegions"; "segmentCellpose": "segmentCellpose"; "runTool": "runTool"; "toggleDialogTool": "toggleDialogTool"; "toolModelChange": "toolModelChange"; "openToolParams": "openToolParams"; "samModelChange": "samModelChange"; "wandSensitivityChange": "wandSensitivityChange"; "brushSizeChange": "brushSizeChange"; "vertexEraserRadiusChange": "vertexEraserRadiusChange"; }, never, ["*"], true, never>;
 }

package/lib/visualizer/region-load.d.ts

@@ -1,7 +1,18 @@
+import type { HttpClient } from '@angular/common/http';
 import { IImageInfo } from '../contracts/image.contract';
 import { IRegionStore } from '../contracts/visualizer.contract';
-/** The region-store members {@link applyImageRois} writes through. */
-export type RegionLoadTarget = Pick<IRegionStore, 'importRegions' | 'enterStackMode' | 'setRegions' | 'resetUndoHistory'>;
+import { RegionSource } from '../region-source/region-source';
+import type { RegionSourceOpener, RegionSourceSlices } from '../store/region-source-scope';
+/** The region-store members {@link applyImageRois} writes through. A target without
+ *  `attachRegionSource` loads every ROI file as regions. */
+export type RegionLoadTarget = Pick<IRegionStore, 'importRegions' | 'enterStackMode' | 'setRegions' | 'resetUndoHistory'> & {
+    attachRegionSource?(source: RegionSource | RegionSourceOpener, slices?: RegionSourceSlices): void;
+    /** The slice shown now (what a stack's source, laid out once it opens, makes live). */
+    getDisplaySlice?(): number;
+    /** Record the slice shown (outside stack mode it only records it): see {@link applyImageRois}. */
+    setDisplaySlice?(z: number): void;
+    isStackMode?(): boolean;
+};
 /**
  * Apply an image's saved ROIs once its render has landed, choosing the region
  * layout from the image's shape:
@@ -22,6 +33,14 @@ export type RegionLoadTarget = Pick<IRegionStore, 'importRegions' | 'enterStackM
  *    Loading saved ROIs is not a user edit, so the undo history starts fresh and the
  *    first undo cannot wipe them (jit-ui#85).
  *
- * `z` is the slice shown now; entering stack mode makes it live and resets undo.
+ * Large ROI files (`minSourceChars` and up) and a server-side source (`regionSourceUrl`)
+ * become tiled region sources instead of regions; a z-indexed one serves each slice its own
+ * plane. On a single-file stack the source is opened first, to tell which: one on the default
+ * plane only stays global, as its regions would. A folder stack's sources open lazily, the first
+ * time their slice is shown.
+ *
+ * `z` is the slice shown now; entering stack mode makes it live and resets undo. `http`, the
+ * host's `HttpClient`, carries a server-side source's requests, so the host's interceptors (its
+ * auth) apply to them as to the image tiles.
  */
-export declare function applyImageRois(info: IImageInfo, target: RegionLoadTarget, z: number): void;
+export declare function applyImageRois(info: IImageInfo, target: RegionLoadTarget, z: number, minSourceChars?: number, http?: HttpClient): void;

package/lib/visualizer/volume-sections.d.ts

@@ -0,0 +1,64 @@
+import { Observable } from 'rxjs';
+import type { IChannelState } from '../contracts/channel-histogram-api.contract';
+import type { Colormap } from 'napari-js';
+import type { SectionAxis, SectionViews } from '../contracts/section-view.contract';
+import type { SliceOutlines } from '../geometry/reconstruct';
+import type { VolumeVoxelsOnScreen } from '../implementations/napari-js/napari-scene';
+import type { SlicePlanes } from '../implementations/napari-js/napari-volume-slice-planes';
+/** What the sections are cut from and shown with. */
+export interface VolumeSectionsDeps {
+    /** The volume on screen as assembled, or null (not a volume view, or not assembled yet). */
+    volume(): VolumeVoxelsOnScreen | null;
+    /** The image the volume is of: another one drops the outlines read and puts the planes back. */
+    image(): string | undefined;
+    /** Show the planes in the volume (null: hide one). */
+    showPlanes(planes: SlicePlanes): void;
+    /** Every class's outlines on every slice (see RegionStore.outlinesByClass). */
+    outlinesByClass(level: number): Promise<Map<string, SliceOutlines[]>>;
+    isClassHidden(label: string): boolean;
+    colorOf(label: string): string;
+    channelStates(): IChannelState[];
+    /** The colormap the 3D view draws a channel with: its tint in a multichannel volume, else the volume's. */
+    colormap(channel: IChannelState | undefined, multichannel: boolean): Colormap;
+    invert(): boolean;
+    /** The slice shown and edited. */
+    slice(): number;
+}
+/**
+ * The sections beside a split volume view: the planes x = const and y = const (image px), each cut
+ * from the assembled volume as an image, displayed like the 2D view displays a slice (the channel
+ * windows, tints and invert), with every class's outlines cut by the same plane and the other two
+ * planes as a crosshair. Recut when a plane moves, the slice changes, the regions or their
+ * visibility change, the display changes or the volume is assembled again — once per frame at most.
+ */
+export declare class VolumeSections {
+    private readonly deps;
+    private readonly views$;
+    private open;
+    private planes;
+    /** The image the planes and outlines are of. */
+    private image;
+    /** Every class's outlines at a level, read and indexed once until the regions change. */
+    private outlines;
+    private scheduled;
+    /** Bumped per cut, so a cut that waited on the outlines is dropped when a newer one starts. */
+    private request;
+    constructor(deps: VolumeSectionsDeps);
+    /** Both sections as they are cut; nulls while closed. */
+    getViews$(): Observable<SectionViews>;
+    /** Show the sections (their planes through the middle of the image at first). */
+    start(): void;
+    stop(): void;
+    /** Move a section's plane to `at` (image px; clamped into the image). */
+    setPlane(axis: SectionAxis, at: number): void;
+    /** The planes as they are (image px), the z plane being the slice. */
+    getPlanes(): SlicePlanes;
+    /** The regions changed (an edit): their outlines are read again, once the edits pause. */
+    regionsChanged(): void;
+    /** Something the sections show changed (the slice, the display, the visible classes, the volume). */
+    schedule(): void;
+    private cut;
+    private view;
+    /** The volume's channels as displayed now. */
+    private voxels;
+}

package/lib/visualizer.component.d.ts

@@ -26,6 +26,7 @@ import { RegionActions } from './visualizer/region-actions';
 import { ToolModes } from './visualizer/tool-modes';
 import { FloatingPos } from './visualizer/floating-drag.directive';
 import { IntensityInsetComponent } from './intensity-inset/intensity-inset.component';
+import type { SectionAxis, SectionViews } from './contracts/section-view.contract';
 import { SpatialDatasetBinder } from './visualizer/spatial-dataset-binder';
 import * as i0 from "@angular/core";
 /**
@@ -245,6 +246,36 @@ export declare class VisualizerComponent implements OnInit, OnChanges, AfterView
      *  selection there: region tools are screen-space, and against an orbiting
      *  camera a drawn rectangle has no fixed meaning in the data. */
     protected get isSpatial3dMode(): boolean;
+    /** True in a napari volume or isosurface view, where the Region Editor shows regions in 3D. */
+    protected get isVolumeView(): boolean;
+    /** Whether the user split the volume view with the slice editor (off by default; kept while
+     *  the view shows other plot types, so a volume view opens split again). */
+    protected sliceEditor: boolean;
+    /** The slice editor's pane: the displayed slice, with every region tool, top right. */
+    protected readonly sliceDivName: string;
+    /** The left column's and the top row's shares of the slice editor (%). */
+    protected splitX: number;
+    protected splitY: number;
+    /** The sections through x and y shown below (nulls until the volume is cut). */
+    protected sections: SectionViews;
+    protected get sliceEditorShown(): boolean;
+    /**
+     * Split the volume view with the slice editor, or close it. The editor opens on the displayed
+     * slice and takes the drawing tools; closing it leaves the selection tool armed (it picks the
+     * surfaces in 3D) and disarms any other.
+     */
+    protected toggleSliceEditor(): Promise<void>;
+    /** A point picked in a section: the slice and the other section's plane move there. */
+    protected onSectionPick(axis: SectionAxis, at: {
+        u: number;
+        v: number;
+    }): void;
+    /** Drag a divider of the slice editor: the vertical one sets the columns, the horizontal one the rows. */
+    protected startPaneResize(event: PointerEvent, axis: 'x' | 'y'): void;
+    /** A divider's keyboard: ← → move the vertical one, ↑ ↓ the horizontal one, by 5%. */
+    protected nudgePaneSize(event: KeyboardEvent, axis: 'x' | 'y'): void;
+    private setSplit;
+    private relayoutFrame;
     /** True for the Image plot type, which renders as a natively pan/zoom-able
      *  raster — so the backend-agnostic zoom/pan toolbar tools are hidden. The
      *  component drives this off the plot type, not the active backend. */
@@ -259,6 +290,8 @@ export declare class VisualizerComponent implements OnInit, OnChanges, AfterView
     protected get hasSpatialDataset(): boolean;
     /** Keyboard, wheel and context-menu handling; created once the view exists. */
     private shortcuts?;
+    /** Waits for a viewer created outside the document to be attached (see {@link whenInDocument}). */
+    private attachObserver;
     /** Debounced z-slice scrubbing (see SliceScrubber — refactoring plan Step 7). */
     private readonly scrubber;
     constructor(state: ImageStatePort, plotService: IVisualizer, messageService: MessageService, ngZone: NgZone, cdr: ChangeDetectorRef, session: VisualizerStore, samTool: SamToolService, cellSegmentTool: CellSegmentToolService, samPointTool: SamPointToolService, regionOps: RegionOpsService, vizConfig?: VizConfig | undefined, toolContributions?: readonly ToolbarContribution[], spatialData?: SpatialDataPort | undefined, plotTypeContributions?: readonly PlotTypeContribution[], injector?: Injector | undefined, hostRef?: ElementRef<HTMLElement> | undefined, destroyRef?: DestroyRef);
@@ -307,6 +340,13 @@ export declare class VisualizerComponent implements OnInit, OnChanges, AfterView
     ngAfterViewInit(): void;
     /** The plot div exists now: run an image-less draw that arrived before it did. */
     private onViewReady;
+    /**
+     * Run `ready` once this viewer is in the document. A host may create it detached — a closed
+     * dialog's projected content, such as jit-ui's pipeline preview — and the backends find the
+     * plot div by id, so a draw then found no target and alerted "the renderer could not start"
+     * over another viewer. Until then its view is not ready, and an image-less draw waits.
+     */
+    private whenInDocument;
     /** What the keyboard, wheel and context-menu shortcuts act on. Their listeners live
      *  outside this view, so every action that changes what it shows marks it for check. */
     private shortcutHost;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@jax-data-science/sci-image-visualizer",
-  "version": "0.9.0",
+  "version": "0.11.0",
   "engines": {
     "node": ">=20.9.0"
   },
@@ -39,7 +39,7 @@
   "dependencies": {
     "cellpose-js": "^0.6.0",
     "fast-png": "^6.4.0",
-    "napari-js": "^0.15.0",
+    "napari-js": "^0.18.0",
     "openseadragon": "^6.0.2",
     "plotly.js-dist-min": "^3.0.1",
     "tslib": "^2.3.0"

package/src/lib/assets/slice.svg

@@ -0,0 +1,23 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="64" height="64" viewBox="0 0 64 64">
+  <!-- A volume (a cube) with a slab sliced off it by a scalpel: the slice editor. -->
+  <defs>
+    <mask id="slice-cut" maskUnits="userSpaceOnUse" x="-64" y="-64" width="192" height="192">
+      <rect x="-64" y="-64" width="192" height="192" fill="#fff"/>
+      <!-- The cube's lines stop short of the scalpel, so it reads at toolbar size. -->
+      <path d="M27.4 19.4 Q20.5 29.3 24.9 42.6 L34.1 21.4 Z" fill="#000" stroke="#000" stroke-width="5" stroke-linejoin="round"/>
+      <path d="M31.8 19.1 L34.2 11.0 M31.4 20.6 L31.8 19.1" stroke="#000" stroke-width="12" stroke-linecap="round"/>
+    </mask>
+  </defs>
+  <g transform="translate(4.89 -8.48) scale(1.1566)">
+  <g fill="none" stroke="#000" stroke-width="4.6" stroke-linejoin="round" stroke-linecap="round" mask="url(#slice-cut)">
+    <path d="M22.0 59.0 L30.3 54.2 L30.3 35.7 L14.3 26.4 L6.0 31.2 L6.0 49.8 Z M22.0 40.5 L22.0 59.0 M22.0 40.5 L30.3 35.7 M22.0 40.5 L6.0 31.2"/>
+    <path d="M35.5 51.2 L40.9 48.1 L40.9 29.6 L24.9 20.3 L19.4 23.5 L19.4 42.0 Z M35.5 32.7 L35.5 51.2 M35.5 32.7 L40.9 29.6 M35.5 32.7 L19.4 23.5"/>
+    <!-- The slab's cut face: the section the slice shows. -->
+    <path d="M35.5 51.2 L35.5 32.7 L19.4 23.5 L19.4 42.0 Z" fill="#000"/>
+  </g>
+  <path d="M27.4 19.4 Q20.5 29.3 24.9 42.6 L34.1 21.4 Z" fill="#000"/>
+  <path d="M31.8 19.1 L34.2 11.0" stroke="#000" stroke-width="7.5" stroke-linecap="round"/>
+  <path d="M31.4 20.6 L31.8 19.1" stroke="#000" stroke-width="3.5" stroke-linecap="round"/>
+  </g>
+</svg>
+