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

package/fesm2022/{jax-data-science-sci-image-visualizer-jax-data-science-sci-image-visualizer-BKQhpbHv.mjs → jax-data-science-sci-image-visualizer-jax-data-science-sci-image-visualizer-BELcx0jv.mjs}

@@ -6,7 +6,7 @@ import { LruCache, Colormap, buildLut, parseColor as parseColor$1, worldViewport
 import { BehaviorSubject, firstValueFrom, Subject, Subscription, of, Observable, combineLatest, defer, from, EMPTY, merge } from 'rxjs';
 import { timeout, debounceTime, takeUntil, switchMap, catchError, startWith, map } from 'rxjs/operators';
 import * as ort from 'onnxruntime-web';
-import { smoothMesh, surfaceNets, pointInRing as pointInRing$2, ringArea as ringArea$1, rasterizePolygon as rasterizePolygon$1, traceContours, floodFill } from 'napari-js/geometry';
+import { smoothMesh, surfaceNets, pointInRing as pointInRing$2, ringArea as ringArea$1, traceContours, rasterizePolygon as rasterizePolygon$1, floodFill } from 'napari-js/geometry';
 import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
 import * as i1$1 from '@angular/common';
 import { CommonModule } from '@angular/common';
@@ -5814,6 +5814,418 @@ function fromWire(f) {
     };
 }
 
+/**
+ * A label volume (a NIfTI-1 `.nii` / `.nii.gz` or a NRRD `.nrrd` of integer structure ids, an
+ * atlas annotation say) read in the browser, sliced as the server opens the matching image:
+ *
+ * - **NRRD**: a 3D volume is cut along its FIRST axis, each section its third axis wide and its
+ *   second axis high, as jit-service opens a NRRD volume (`AtlasNrrdReader`: the Allen CCF's 528
+ *   coronal sections of 456 × 320, anterior first). A 2D NRRD is one slice.
+ * - **NIfTI**: along its third axis, each slice its first axis wide and its second axis high, as
+ *   Bio-Formats reads one (no row flip).
+ *
+ * Only what label volumes use: a single file (NRRD with attached data, NIfTI-1 `n+1`), integer
+ * or integer-valued float samples, either byte order, raw or gzip. Anything else throws rather
+ * than be read approximately. Pure: usable from workers.
+ */
+/** Whether a file name is a label volume this reads. */
+function isLabelVolumeName(name) {
+    return /\.(nrrd|nii|nii\.gz)$/i.test(name);
+}
+/** Read the label volume in `bytes`, named `name` (`.nrrd`, `.nii`, `.nii.gz`). */
+async function readLabelVolume(name, bytes, gunzip = platformGunzip) {
+    if (/\.nrrd$/i.test(name))
+        return readNrrd(bytes, gunzip);
+    if (/\.nii(\.gz)?$/i.test(name))
+        return readNifti(isGzip(bytes) ? await gunzip(bytes) : bytes);
+    throw new Error(`${name}: not a NIfTI (.nii, .nii.gz) or NRRD (.nrrd) label volume`);
+}
+const SAMPLES = {
+    u8: { bytes: 1, read: (v, at) => v.getUint8(at) },
+    i8: { bytes: 1, read: (v, at) => v.getInt8(at) },
+    u16: { bytes: 2, read: (v, at, le) => v.getUint16(at, le) },
+    i16: { bytes: 2, read: (v, at, le) => v.getInt16(at, le) },
+    u32: { bytes: 4, read: (v, at, le) => v.getUint32(at, le) },
+    i32: { bytes: 4, read: (v, at, le) => v.getInt32(at, le) },
+    f32: { bytes: 4, read: (v, at, le) => Math.round(v.getFloat32(at, le)) },
+    f64: { bytes: 8, read: (v, at, le) => Math.round(v.getFloat64(at, le)) },
+};
+/** NRRD type names (every spelling the format allows) → sample type. */
+const NRRD_TYPES = {
+    'signed char': 'i8',
+    int8: 'i8',
+    int8_t: 'i8',
+    uchar: 'u8',
+    'unsigned char': 'u8',
+    uint8: 'u8',
+    uint8_t: 'u8',
+    short: 'i16',
+    'short int': 'i16',
+    'signed short': 'i16',
+    'signed short int': 'i16',
+    int16: 'i16',
+    int16_t: 'i16',
+    ushort: 'u16',
+    'unsigned short': 'u16',
+    'unsigned short int': 'u16',
+    uint16: 'u16',
+    uint16_t: 'u16',
+    int: 'i32',
+    'signed int': 'i32',
+    int32: 'i32',
+    int32_t: 'i32',
+    uint: 'u32',
+    'unsigned int': 'u32',
+    uint32: 'u32',
+    uint32_t: 'u32',
+    float: 'f32',
+    double: 'f64',
+};
+/** NIfTI datatype codes → sample type. */
+const NIFTI_TYPES = {
+    2: 'u8',
+    4: 'i16',
+    8: 'i32',
+    16: 'f32',
+    64: 'f64',
+    256: 'i8',
+    512: 'u16',
+    768: 'u32',
+};
+async function readNrrd(bytes, gunzip) {
+    const end = headerEnd(bytes);
+    if (end < 0)
+        throw new Error('NRRD: no blank line ends the header');
+    const lines = new TextDecoder('latin1').decode(bytes.subarray(0, end)).split(/\r?\n/);
+    if (!/^NRRD\d{4}/.test(lines[0] ?? ''))
+        throw new Error('NRRD: not a NRRD file');
+    const field = {};
+    for (const line of lines.slice(1)) {
+        if (line.startsWith('#'))
+            continue;
+        const at = line.indexOf(': ');
+        if (at > 0)
+            field[line.slice(0, at).trim().toLowerCase()] = line.slice(at + 2).trim();
+    }
+    if (field['data file'] || field['datafile'])
+        throw new Error('NRRD: detached data (a .nhdr) is not supported');
+    const type = NRRD_TYPES[(field['type'] ?? '').toLowerCase()];
+    if (!type)
+        throw new Error(`NRRD: unsupported type "${field['type']}"`);
+    const sizes = (field['sizes'] ?? '').split(/\s+/).filter(Boolean).map(Number);
+    if (sizes.length !== 2 && sizes.length !== 3)
+        throw new Error(`NRRD: need 2 or 3 dimensions, got ${sizes.length}`);
+    const encoding = (field['encoding'] ?? 'raw').toLowerCase();
+    let data = bytes.subarray(end);
+    if (encoding === 'gzip' || encoding === 'gz')
+        data = await gunzip(data);
+    else if (encoding !== 'raw')
+        throw new Error(`NRRD: unsupported encoding "${encoding}"`);
+    const little = (field['endian'] ?? 'little').toLowerCase() !== 'big';
+    // A 3D volume: sections along axis 0, each axis 2 wide and axis 1 high (jit-service's cut).
+    const [n0, n1, n2] = sizes.length === 3 ? sizes : [sizes[0], sizes[1], 1];
+    const axes = sizes.length === 3 ? { z: 0, x: 2, y: 1 } : { z: 2, x: 0, y: 1 };
+    return volume('nrrd', [n0, n1, n2], axes, data, SAMPLES[type], little);
+}
+function readNifti(bytes) {
+    if (bytes.length < 352)
+        throw new Error('NIfTI: shorter than a header');
+    const view = new DataView(bytes.buffer, bytes.byteOffset, bytes.byteLength);
+    let little = true;
+    if (view.getInt32(0, true) !== 348) {
+        if (view.getInt32(0, false) !== 348)
+            throw new Error('NIfTI: not a NIfTI-1 file');
+        little = false;
+    }
+    const magic = new TextDecoder('latin1').decode(bytes.subarray(344, 347));
+    if (magic !== 'n+1')
+        throw new Error('NIfTI: a separate .hdr/.img pair is not supported');
+    const ndim = view.getInt16(40, little);
+    const dims = [1, 2, 3, 4].map((i) => view.getInt16(40 + 2 * i, little));
+    if (ndim < 2)
+        throw new Error(`NIfTI: need at least 2 dimensions, got ${ndim}`);
+    if (ndim >= 4 && dims[3] > 1)
+        throw new Error('NIfTI: a 4D file is not a label volume');
+    const type = NIFTI_TYPES[view.getInt16(70, little)];
+    if (!type)
+        throw new Error(`NIfTI: unsupported datatype ${view.getInt16(70, little)}`);
+    const offset = Math.max(352, Math.round(view.getFloat32(108, little)));
+    const [n0, n1, n2] = [dims[0], dims[1], ndim >= 3 ? dims[2] : 1];
+    // Slices along axis 2, each axis 0 wide and axis 1 high (Bio-Formats' planes).
+    return volume('nifti', [n0, n1, n2], { z: 2, x: 0, y: 1 }, bytes.subarray(offset), SAMPLES[type], little);
+}
+function volume(format, n, axes, data, sample, little) {
+    const count = n[0] * n[1] * n[2];
+    if (!(count > 0))
+        throw new Error(`${format}: empty volume`);
+    if (data.length < count * sample.bytes) {
+        throw new Error(`${format}: ${data.length} bytes of data, ${count * sample.bytes} needed`);
+    }
+    const view = new DataView(data.buffer, data.byteOffset, data.byteLength);
+    const stride = [1, n[0], n[0] * n[1]];
+    const width = n[axes.x];
+    const height = n[axes.y];
+    return {
+        format,
+        width,
+        height,
+        slices: n[axes.z],
+        sliceLabels(z) {
+            const out = new Uint32Array(width * height);
+            const base = z * stride[axes.z];
+            const sx = stride[axes.x];
+            const sy = stride[axes.y];
+            for (let y = 0; y < height; y++) {
+                for (let x = 0; x < width; x++) {
+                    const v = sample.read(view, (base + x * sx + y * sy) * sample.bytes, little);
+                    out[y * width + x] = v > 0 ? v : 0;
+                }
+            }
+            return out;
+        },
+    };
+}
+/** The offset just past the header's blank line (`\n\n` or `\r\n\r\n`); -1 without one. */
+function headerEnd(bytes) {
+    const limit = Math.min(bytes.length - 1, 1 << 20);
+    for (let i = 0; i < limit; i++) {
+        if (bytes[i] !== 10)
+            continue;
+        if (bytes[i + 1] === 10)
+            return i + 2;
+        if (bytes[i + 1] === 13 && bytes[i + 2] === 10)
+            return i + 3;
+    }
+    return -1;
+}
+function isGzip(bytes) {
+    return bytes.length > 2 && bytes[0] === 0x1f && bytes[1] === 0x8b;
+}
+async function platformGunzip(bytes) {
+    if (typeof DecompressionStream === 'undefined')
+        throw new Error('gzip data needs DecompressionStream');
+    const stream = new Blob([bytes]).stream().pipeThrough(new DecompressionStream('gzip'));
+    return new Uint8Array(await new Response(stream).arrayBuffer());
+}
+
+/** The look the Allen atlas region sets carry (see the brain-atlas example's GeoJSON). */
+const ATLAS_STYLE = {
+    fillOpacity: 0.6,
+    stroke: '#3c3c3c',
+    strokeWidth: 1,
+    labels: true,
+    highlight: '#a020f0',
+};
+/**
+ * The classes of a label volume from `ontology`, a parsed JSON document:
+ *
+ * - an **Allen structure graph** (`structure_graph_1.json`: `{ msg: [root] }`, or a node or a
+ *   list of nodes with `id`, `acronym`, `name`, `color_hex_triplet`, `graph_order` and
+ *   `children`): label = structure id, class = acronym, its tree the ontology's, drawn as the
+ *   atlas region sets are;
+ * - a **region set description** (a `regionset.json`: `classHierarchy`, optional `style`), whose
+ *   classes name their label as `value` (or `id`), or with a `labels` map of value → class name.
+ *
+ * Without one (or with another document), each label is its own class `label <value>`.
+ */
+function labelClasses(ontology) {
+    const allen = allenRoots(ontology);
+    if (allen)
+        return allenClasses(allen);
+    if (ontology &&
+        typeof ontology === 'object' &&
+        Array.isArray(ontology.classHierarchy)) {
+        return regionSetClasses(ontology);
+    }
+    return { classOf: unnamed };
+}
+function unnamed(value) {
+    return { name: `label ${value}`, color: paletteColor(value) };
+}
+function allenRoots(doc) {
+    const isNode = (n) => !!n &&
+        typeof n === 'object' &&
+        typeof n.id === 'number' &&
+        typeof n.acronym === 'string';
+    const msg = doc?.msg;
+    const roots = Array.isArray(msg) ? msg : Array.isArray(doc) ? doc : doc ? [doc] : [];
+    return roots.length && roots.every(isNode) ? roots : null;
+}
+function allenClasses(roots) {
+    const byId = new Map();
+    const hierarchy = [];
+    const walk = (n, parent) => {
+        const color = `#${(n.color_hex_triplet || '808080').toUpperCase()}`;
+        byId.set(n.id, { name: n.acronym, color, title: n.name });
+        hierarchy.push({
+            name: n.acronym,
+            ...(n.name ? { title: n.name } : {}),
+            ...(parent ? { parent } : {}),
+            color,
+            ...(n.graph_order != null ? { order: n.graph_order } : {}),
+        });
+        for (const c of n.children ?? [])
+            walk(c, n.acronym);
+    };
+    for (const r of roots)
+        walk(r, null);
+    hierarchy.sort((a, b) => (a.order ?? 0) - (b.order ?? 0));
+    return { classOf: (v) => byId.get(v) ?? unnamed(v), hierarchy, style: ATLAS_STYLE };
+}
+function regionSetClasses(doc) {
+    const nodes = new Map(doc.classHierarchy.map((n) => [n.name, n]));
+    const byValue = new Map();
+    for (const n of doc.classHierarchy) {
+        const v = typeof n.value === 'number' ? n.value : typeof n.id === 'number' ? n.id : undefined;
+        if (v != null)
+            byValue.set(v, n.name);
+    }
+    for (const [v, name] of Object.entries(doc.labels ?? {}))
+        byValue.set(Number(v), name);
+    const hierarchy = doc.classHierarchy.map(({ name, title, parent, color, order }) => ({
+        name,
+        ...(title ? { title } : {}),
+        ...(parent ? { parent } : {}),
+        ...(color ? { color } : {}),
+        ...(order != null ? { order } : {}),
+    }));
+    return {
+        classOf: (v) => {
+            const name = byValue.get(v);
+            const node = name ? nodes.get(name) : undefined;
+            return node ? { name: node.name, color: node.color ?? paletteColor(v), title: node.title } : unnamed(v);
+        },
+        hierarchy,
+        ...(doc.style ? { style: doc.style } : {}),
+    };
+}
+/** A colour per label value, spread around the hue circle. */
+function paletteColor(value) {
+    const hue = (value * 137.508) % 360;
+    const [r, g, b] = hsl(hue, 0.65, 0.55);
+    return `#${[r, g, b].map((c) => c.toString(16).padStart(2, '0')).join('')}`.toUpperCase();
+}
+function hsl(h, s, l) {
+    const k = (n) => (n + h / 30) % 12;
+    const a = s * Math.min(l, 1 - l);
+    const f = (n) => l - a * Math.max(-1, Math.min(k(n) - 3, Math.min(9 - k(n), 1)));
+    return [f(0), f(8), f(4)].map((c) => Math.round(c * 255));
+}
+const rgb$1 = (hex) => [1, 3, 5].map((o) => parseInt(hex.slice(o, o + 2), 16));
+/**
+ * Slice `z` of `volume` as a GeoJSON FeatureCollection string: one feature per label on the
+ * slice, its every piece (with holes) traced along pixel edges, in image pixels with y down;
+ * classified by `classes`, which also give the collection its class tree and style.
+ */
+function labelSliceGeoJson(volume, z, classes) {
+    const labels = volume.sliceLabels(z);
+    const byLabel = new Map();
+    for (const c of traceContours({ data: labels, width: volume.width, height: volume.height })) {
+        const polygons = byLabel.get(c.value) ?? [];
+        polygons.push([ring(c.outer), ...c.holes.map(ring)]);
+        byLabel.set(c.value, polygons);
+    }
+    const features = [...byLabel].map(([value, polygons]) => {
+        const cls = classes.classOf(value);
+        return {
+            type: 'Feature',
+            id: String(value),
+            geometry: { type: 'MultiPolygon', coordinates: polygons },
+            properties: {
+                objectType: 'annotation',
+                name: cls.title ?? cls.name,
+                classification: { name: cls.name, color: rgb$1(cls.color) },
+                labelValue: value,
+            },
+        };
+    });
+    return JSON.stringify({
+        type: 'FeatureCollection',
+        ...(classes.hierarchy ? { classHierarchy: classes.hierarchy } : {}),
+        ...(classes.style ? { style: classes.style } : {}),
+        features,
+    });
+}
+/** A closed GeoJSON ring from a flat `[x0, y0, …]` one. */
+function ring(flat) {
+    const pts = [];
+    for (let i = 0; i < flat.length; i += 2)
+        pts.push([flat[i], flat[i + 1]]);
+    if (pts.length)
+        pts.push([...pts[0]]);
+    return pts;
+}
+
+/** `data`, named `name`, as an import file. A `File`'s own name is used when `name` is omitted. */
+function importFile(data, name = data.name ?? '') {
+    const encoder = new TextEncoder();
+    return {
+        name,
+        text: async () => typeof data === 'string'
+            ? data
+            : data instanceof Blob
+                ? data.text()
+                : new TextDecoder().decode(data instanceof Uint8Array ? data : new Uint8Array(data)),
+        bytes: async () => typeof data === 'string'
+            ? encoder.encode(data)
+            : data instanceof Blob
+                ? new Uint8Array(await data.arrayBuffer())
+                : data instanceof Uint8Array
+                    ? data
+                    : new Uint8Array(data),
+    };
+}
+const leaf = (name) => name.split(/[\\/]/).pop() ?? name;
+const isRegionSet = (f) => leaf(f.name).toLowerCase() === 'regionset.json';
+const isGeoJson = (f) => /\.geojson$/i.test(f.name);
+const isJson = (f) => /\.json$/i.test(f.name);
+/**
+ * What `files` import as: a label volume (`.nii`, `.nii.gz`, `.nrrd`) with the ontology JSON chosen
+ * with it (a `regionset.json`, else an Allen `structure_graph*.json`, else any `.json`); several
+ * region files (a folder of per-slice `.geojson`, in natural name order, its `regionset.json`
+ * apart); or one region file (`.geojson` or `.json`). Null when none of them is one.
+ */
+function planRegionImport(files) {
+    const volume = files.find((f) => isLabelVolumeName(f.name));
+    if (volume) {
+        const jsons = files.filter((f) => f !== volume && isJson(f));
+        const ontology = jsons.find(isRegionSet) ??
+            jsons.find((f) => /structure_graph.*\.json$/i.test(leaf(f.name))) ??
+            jsons[0] ??
+            null;
+        return { kind: 'volume', volume, ontology };
+    }
+    const regionSet = files.find(isRegionSet) ?? null;
+    const geojsons = files.filter((f) => isGeoJson(f));
+    const regionFiles = geojsons.length ? geojsons : files.filter((f) => isJson(f) && !isRegionSet(f));
+    if (regionFiles.length > 1 || (regionFiles.length === 1 && regionSet)) {
+        const slices = [...regionFiles].sort((a, b) => naturalCompare(leaf(a.name), leaf(b.name)));
+        return { kind: 'folder', slices, regionSet };
+    }
+    return regionFiles.length === 1 ? { kind: 'single', file: regionFiles[0] } : null;
+}
+/** "slice_2" before "slice_10": runs of digits compared as numbers. */
+function naturalCompare(a, b) {
+    return a.localeCompare(b, undefined, { numeric: true, sensitivity: 'base' });
+}
+/**
+ * A folder slice's GeoJSON with the set's class tree and style (its `regionset.json`) as the
+ * collection's own members, unless the file has its own: what a served folder's slice carries.
+ */
+async function folderSliceGeoJson(file, regionSet) {
+    const text = await file.text();
+    if (!regionSet || (!regionSet.classHierarchy && !regionSet.style))
+        return text;
+    const doc = JSON.parse(text);
+    if (doc['type'] !== 'FeatureCollection')
+        return text;
+    if (regionSet.classHierarchy && !doc['classHierarchy'])
+        doc['classHierarchy'] = regionSet.classHierarchy;
+    if (regionSet.style && !doc['style'])
+        doc['style'] = regionSet.style;
+    return JSON.stringify(doc);
+}
+
 /**
  * The largest bbox (in pixels) {@link rasterizePolygon} allocates before it
  * falls back to clipping at the window. Also the cap the wand/brush use to
@@ -9098,7 +9510,7 @@ function frameToRgba(cached, frameIndex) {
 /** Lazy-import so onnxruntime-web is never pulled into unit tests or the
  *  initial bundle — only when segmentation actually runs. */
 const onnxSessionFactory = async () => {
-    const { OnnxSamSession } = await import('./jax-data-science-sci-image-visualizer-onnx-sam-session-z1IN-F7w.mjs');
+    const { OnnxSamSession } = await import('./jax-data-science-sci-image-visualizer-onnx-sam-session-DEDSm_NL.mjs');
     return new OnnxSamSession();
 };
 /** Thrown inside a load that a model switch superseded. */
@@ -12838,6 +13250,14 @@ class RegionPersistenceService {
         }
         return out;
     }
+    /** Whether the host can pick regions on its server (see RegionIoPort.pickServerRegions). */
+    canPickServerRegions() {
+        return typeof this.io.pickServerRegions === 'function';
+    }
+    /** Let the user pick regions on the host's server; null when cancelled or unsupported. */
+    pickServerRegions() {
+        return this.io.pickServerRegions?.() ?? of(null);
+    }
     /** Write per-slice geojsons through the host port. */
     saveSlices(slices) {
         return this.io.saveSliceGeoJsons(slices);
@@ -14392,6 +14812,8 @@ class RegionEditorComponent {
         this.persistence = persistence;
         this.maskExport = maskExport;
         this.isActive = true;
+        /** The host's HttpClient: a served region set's requests go through it (its auth). */
+        this.http = inject(HttpClient, { optional: true });
         this.regions = [];
         this.selectedRegions = [];
         this.displayHelpDialog = false;
@@ -14517,6 +14939,8 @@ class RegionEditorComponent {
         this.volumeRequest = 0;
         this._pageKey = {};
         this._page = [];
+        /** An import from the server is in flight. */
+        this.importing = false;
     }
     ngOnInit() {
         this.showShapeLabel = this.regionApi.getShowShapeLabel();
@@ -15451,8 +15875,141 @@ class RegionEditorComponent {
         }
         this.changed();
     }
+    /** The files chosen in the import inputs: one GeoJSON, a label volume with its ontology, or a
+     *  folder of per-slice GeoJSON files. */
     importRois(event) {
-        this.persistence.readChosenFile(event, (text) => void this.applyImportedRois(text));
+        const files = Array.from(event.target.files ?? []);
+        if (files.length)
+            void this.importRegionFiles(files.map((f) => importFile(f, f.webkitRelativePath || f.name)));
+    }
+    /** Whether the host can pick regions on its server ("Import regions from server"). */
+    get canImportFromServer() {
+        return this.persistence.canPickServerRegions();
+    }
+    /** "Import regions from server": the host picks files or a served region set; they import as chosen files do. */
+    importFromServer() {
+        this.importing = true;
+        this.changed();
+        this.persistence.pickServerRegions().subscribe({
+            next: (pick) => {
+                if (!pick)
+                    return;
+                if (pick.kind === 'files') {
+                    void this.importRegionFiles(pick.files.map((f) => importFile(f.data, f.name)));
+                    return;
+                }
+                void this.importServedRegionSet(pick.url, pick.name);
+            },
+            error: (err) => this.importFailed(err),
+            complete: () => {
+                this.importing = false;
+                this.changed();
+            },
+        });
+    }
+    /**
+     * Import `files` (see planRegionImport): one GeoJSON file as before; a label volume as one
+     * region source per slice, traced from it the first time the slice is shown, its classes named
+     * (and treed) by the ontology chosen with it; a folder as one source per slice file. Either
+     * replaces the regions and sources of every slice.
+     */
+    async importRegionFiles(files) {
+        const plan = planRegionImport(files);
+        if (!plan) {
+            this.importFailed(new Error('Choose a GeoJSON file, a folder of GeoJSON files, or a .nii, .nii.gz or .nrrd label volume.'));
+            return;
+        }
+        if (plan.kind === 'single') {
+            await this.applyImportedRois(await plan.file.text());
+            return;
+        }
+        const attach = this.regionApi.importSliceRegionSources?.bind(this.regionApi);
+        if (!attach) {
+            this.importFailed(new Error('This viewer cannot hold region sources.'));
+            return;
+        }
+        // Taken before the files are read: decoding a volume takes a while, and the import must land
+        // on the image it was started for, not on one shown meanwhile.
+        const ticket = this.regionApi.regionImportTicket?.();
+        try {
+            const openers = new Map();
+            let summary;
+            if (plan.kind === 'volume') {
+                const volume = await readLabelVolume(plan.volume.name, await plan.volume.bytes());
+                const classes = labelClasses(plan.ontology ? JSON.parse(await plan.ontology.text()) : undefined);
+                for (let z = 0; z < volume.slices; z++) {
+                    openers.set(z, () => openGeoJsonRegionSource(labelSliceGeoJson(volume, z, classes)));
+                }
+                summary = `${volume.slices} slices of ${volume.width} × ${volume.height}`;
+                this.warnIfSizeDiffers(volume.width, volume.height);
+            }
+            else {
+                const regionSet = plan.regionSet ? JSON.parse(await plan.regionSet.text()) : null;
+                plan.slices.forEach((file, z) => openers.set(z, async () => openGeoJsonRegionSource(await folderSliceGeoJson(file, regionSet))));
+                summary = `${plan.slices.length} slice files`;
+            }
+            const attached = attach(openers, ticket);
+            if (attached === null) {
+                this.importStale();
+                return;
+            }
+            this.afterSourceImport();
+            this.toast('success', 'Regions imported', `${summary}; ${attached} slice${attached === 1 ? '' : 's'} annotated.`);
+        }
+        catch (err) {
+            this.importFailed(err);
+        }
+    }
+    /** A region set the host's server serves (jit-service's /regions/{id}/), read through its HttpClient. */
+    async importServedRegionSet(url, name) {
+        const importSource = this.regionApi.importRegionSourceOpener?.bind(this.regionApi);
+        if (!importSource) {
+            this.importFailed(new Error('This viewer cannot hold region sources.'));
+            return;
+        }
+        const ticket = this.regionApi.regionImportTicket?.();
+        try {
+            const applied = await importSource(() => openHttpRegionSource(url, { http: this.http ?? undefined }), ticket);
+            if (applied === false) {
+                this.importStale();
+                return;
+            }
+            this.afterSourceImport();
+            this.toast('success', 'Regions imported', name ?? url);
+        }
+        catch (err) {
+            this.importFailed(err);
+        }
+    }
+    /** An import that finished after another image was shown (or another import began): dropped. */
+    importStale() {
+        this.toast('info', 'Import discarded', 'The image changed while the regions were being read.');
+        this.changed();
+    }
+    /** The table and selection after the regions were replaced by imported sources. */
+    afterSourceImport() {
+        this.selectedRegions = [];
+        this.paginatorFirst = 0;
+        this.commit([]);
+        this.onSelectionChanged();
+    }
+    /** Warn when an imported volume's slices are not the image's size: its outlines would not fit. */
+    warnIfSizeDiffers(width, height) {
+        const meta = this.regionApi.getMaskImageSize();
+        if (meta && (meta.width !== width || meta.height !== height)) {
+            this.toast('info', 'Different size', `The volume's slices are ${width} × ${height}; the image is ${meta.width} × ${meta.height}.`);
+        }
+    }
+    importFailed(err) {
+        this.importing = false;
+        this.messageService.add({
+            key: VIZ_TOAST_KEY,
+            severity: 'error',
+            summary: 'Error importing regions',
+            detail: `${err?.message ?? err}`,
+        });
+        console.error('Error importing regions:', err);
+        this.changed();
     }
     /**
      * Replace the regions with an imported GeoJSON file's, and the slice's region source with them.
@@ -15699,7 +16256,7 @@ class RegionEditorComponent {
         this.messageService.add({ key: VIZ_TOAST_KEY, severity, summary, detail });
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.9", ngImport: i0, type: RegionEditorComponent, deps: [{ token: REGION_EDITOR_API }, { token: i1$2.MessageService }, { token: i1$2.ConfirmationService }, { token: RegionPersistenceService }, { token: MaskExportService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.9", type: RegionEditorComponent, isStandalone: true, selector: "region-editor", inputs: { active: "active" }, providers: [RegionPersistenceService], viewQueries: [{ propertyName: "overlayPanel", first: true, predicate: ["op"], descendants: true }], ngImport: i0, template: "<p-toolbar styleClass=\"region-toolbar\">\n  <div class=\"p-toolbar-group-start align-items-center flex-wrap gap-1\">\n    <p-button\n      icon=\"pi pi-tag\"\n      size=\"small\"\n      [text]=\"!showShapeLabel\"\n      pTooltip=\"Show region labels.\"\n      tooltipPosition=\"bottom\"\n      (onClick)=\"showShapeLabel = !showShapeLabel; changeShowShapeLabel(showShapeLabel)\"\n    >\n    </p-button>\n    <p-button\n      icon=\"pi pi-stop-circle\"\n      size=\"small\"\n      [text]=\"!regionsFilled\"\n      pTooltip=\"Fill regions in their colour (an atlas's look); labels sit inside.\"\n      tooltipPosition=\"bottom\"\n      ariaLabel=\"Fill regions\"\n      (onClick)=\"toggleFill()\"\n    >\n    </p-button>\n    <p-button\n      *ngIf=\"volumeView\"\n      icon=\"pi pi-eye\"\n      size=\"small\"\n      [text]=\"!regionsThroughVolume\"\n      [attr.aria-pressed]=\"regionsThroughVolume\"\n      pTooltip=\"See the regions through the volume. Off, the volume hides the parts of them behind what it shows; on, none (layers traced inside bright structures, such as an OCT's).\"\n      tooltipPosition=\"bottom\"\n      ariaLabel=\"Regions through volume\"\n      (onClick)=\"toggleThroughVolume()\"\n    >\n    </p-button>\n    <span class=\"toolbar-separator\"></span>\n    <!-- New regions are now created from the diagram toolbar\n         (rectangle, polyline, freeform, wand). -->\n    <p-button\n      icon=\"pi pi-upload\"\n      size=\"small\"\n      [text]=\"true\"\n      styleClass=\"mr-2\"\n      pTooltip=\"Upload and display regions from geojson file.\"\n      tooltipPosition=\"bottom\"\n      (click)=\"roiFileInput.click()\"\n    >\n    </p-button>\n    <input\n      #roiFileInput\n      type=\"file\"\n      accept=\".geojson,.json\"\n      hidden\n      (change)=\"importRois($event); roiFileInput.value = ''\"\n    />\n    <p-button\n      size=\"small\"\n      [text]=\"true\"\n      styleClass=\"mr-2\"\n      pTooltip=\"Download regions as geojson file.\"\n      tooltipPosition=\"bottom\"\n      icon=\"pi pi-download\"\n      (click)=\"exportRois()\"\n    >\n    </p-button>\n    <p-button\n      icon=\"pi pi-save\"\n      size=\"small\"\n      [text]=\"true\"\n      styleClass=\"mr-2\"\n      pTooltip=\"Save regions to server.\"\n      tooltipPosition=\"bottom\"\n      (click)=\"persistRegions()\"\n      [disabled]=\"(!regions || !regions.length) && !hasRegionSource\"\n    >\n    </p-button>\n    <p-button\n      size=\"small\"\n      [text]=\"true\"\n      styleClass=\"mr-2\"\n      pTooltip=\"Download mask of the regions as PNG\"\n      tooltipPosition=\"bottom\"\n      (click)=\"openSaveMaskDialog()\"\n      [disabled]=\"!regions || !regions.length\"\n    >\n      <!-- References the file so Inkscape edits to mask.svg show up directly\n           (the lib's assets/** are served at assets/plotting/). The\n           toolbar-icon-dark filter recolours the black SVG to the theme blue,\n           same as region-editor.svg and the other SVG toolbar icons. -->\n      <img\n        src=\"assets/plotting/mask.svg\"\n        class=\"toolbar-icon-dark\"\n        style=\"width: 1rem; height: 1rem; vertical-align: middle\"\n        alt=\"Download mask\"\n      />\n    </p-button>\n    <p-button\n      label=\"x512\"\n      size=\"small\"\n      [text]=\"true\"\n      styleClass=\"mr-2\"\n      pTooltip=\"Round all rectangle regions\n                    to width and height that are multiple of 512\"\n      tooltipPosition=\"bottom\"\n      (click)=\"roundRectangleLengths()\"\n    >\n    </p-button>\n    <p-button\n      icon=\"pi pi-check-square\"\n      size=\"small\"\n      [text]=\"true\"\n      styleClass=\"mr-2\"\n      pTooltip=\"Select all regions\"\n      tooltipPosition=\"bottom\"\n      (click)=\"selectAllRegions()\"\n      [disabled]=\"!regions || !regions.length\"\n    >\n    </p-button>\n    <p-button\n      icon=\"pi pi-tags\"\n      size=\"small\"\n      [text]=\"true\"\n      styleClass=\"mr-2\"\n      pTooltip=\"Edit class on selected rows\"\n      tooltipPosition=\"bottom\"\n      (click)=\"!selectedRegions || !selectedRegions.length ? op.hide() : op.toggle($event)\"\n      [disabled]=\"!selectedRegions || !selectedRegions.length\"\n    >\n    </p-button>\n    <p-button\n      icon=\"pi pi-palette\"\n      size=\"small\"\n      [text]=\"true\"\n      styleClass=\"mr-2\"\n      pTooltip=\"Edit colour of selected regions\"\n      tooltipPosition=\"bottom\"\n      (click)=\"openColorDialog()\"\n      [disabled]=\"!selectedRegions || !selectedRegions.length\"\n    >\n    </p-button>\n    <p-overlayPanel #op (onHide)=\"bulkClass = ''; newBulkClass = ''\">\n      <div class=\"flex flex-column gap-2\" style=\"width: 18rem\">\n        <span class=\"font-medium text-900\"\n          >Set class on {{ selectedRegions?.length || 0 }} selected region(s)</span\n        >\n        <!-- Selecting a class applies it immediately (choosing an option closes the\n             overlay, so there's no separate Apply button). -->\n        <p-dropdown\n          styleClass=\"w-full\"\n          appendTo=\"body\"\n          [options]=\"presetSet.classes\"\n          optionLabel=\"name\"\n          optionValue=\"name\"\n          [(ngModel)]=\"bulkClass\"\n          placeholder=\"Choose a class\u2026\"\n          [filter]=\"presetSet.classes.length > 8\"\n          filterBy=\"name\"\n          (onChange)=\"applyBulkClass()\"\n        >\n          <ng-template let-c pTemplate=\"item\">\n            <span class=\"dd-value\"\n              ><span class=\"chip-swatch\" [style.background]=\"c.color\"></span>{{ c.name }}</span\n            >\n          </ng-template>\n        </p-dropdown>\n        <div class=\"p-inputgroup\">\n          <input\n            type=\"text\"\n            pInputText\n            placeholder=\"\u2026or a new class\"\n            [(ngModel)]=\"newBulkClass\"\n            (keydown.enter)=\"addAndApplyBulkClass()\"\n          />\n          <button\n            pButton\n            type=\"button\"\n            icon=\"pi pi-plus\"\n            pTooltip=\"Add class &amp; set it\"\n            tooltipPosition=\"bottom\"\n            [disabled]=\"!newBulkClass.trim()\"\n            (click)=\"addAndApplyBulkClass()\"\n          ></button>\n        </div>\n      </div>\n    </p-overlayPanel>\n    <p-button\n      icon=\"pi pi-trash\"\n      size=\"small\"\n      [text]=\"true\"\n      styleClass=\"mr-2\"\n      (click)=\"deleteSelectedRegions()\"\n      pTooltip=\"Delete selected regions\"\n      tooltipPosition=\"bottom\"\n      [disabled]=\"!selectedRegions || !selectedRegions.length\"\n    ></p-button>\n    <p-button\n      icon=\"pi pi-times-circle\"\n      size=\"small\"\n      [text]=\"true\"\n      styleClass=\"mr-2\"\n      (click)=\"clearAllRegions()\"\n      pTooltip=\"Delete all regions\"\n      tooltipPosition=\"bottom\"\n      [disabled]=\"(!regions || !regions.length) && !hasRegionSource\"\n    ></p-button>\n    <p-button\n      icon=\"pi pi-question\"\n      size=\"small\"\n      [text]=\"true\"\n      (click)=\"showHelp()\"\n      pTooltip=\"Help\"\n      tooltipPosition=\"bottom\"\n    ></p-button>\n  </div>\n</p-toolbar>\n\n<region-classes-panel\n  [classes]=\"displayClasses\"\n  [counts]=\"classCounts\"\n  [matchMode]=\"presetSet.matchMode\"\n  [activeClass]=\"activeClass\"\n  [picked]=\"pickedClass\"\n  [marked]=\"markedClasses\"\n  [selectedCount]=\"selectedRegions?.length || 0\"\n  [defaultClassName]=\"defaultClassName\"\n  (pick)=\"selectActiveClass($event)\"\n  (recolor)=\"setClassColor($event.name, $event.color)\"\n  (remove)=\"deleteClass($event)\"\n  (manage)=\"openManageDialog()\"\n  [volume]=\"volumeView\"\n  [shown3d]=\"shown3dNames\"\n  (toggle3d)=\"toggleClass3d($event)\"\n  [hidden]=\"hiddenClasses\"\n  (toggleHidden)=\"setClassesHidden([$event], !hiddenClasses.has($event))\"\n  [treeView]=\"classHierarchy ? classTreeView : null\"\n  (treeViewChange)=\"classTreeView = $event\"\n>\n  <!-- A region set with a class hierarchy (an atlas ontology) can show its classes as a tree. -->\n  <region-class-tree\n    *ngIf=\"classHierarchy as hierarchy\"\n    [nodes]=\"hierarchy\"\n    [counts]=\"treeCounts\"\n    [colorOf]=\"treeColor\"\n    [picked]=\"pickedClass\"\n    [marked]=\"markedClasses\"\n    [volume]=\"volumeView\"\n    [shown3d]=\"shown3dNames\"\n    (pick)=\"pickClasses($event)\"\n    (recolor)=\"setClassColor($event.name, $event.color)\"\n    (toggle3d)=\"toggleClass3d($event.name, $event.classes)\"\n    [hidden]=\"hiddenClasses\"\n    (toggleHidden)=\"setClassesHidden($event.classes, $event.hidden)\"\n  >\n  </region-class-tree>\n</region-classes-panel>\n\n<region-table\n  [page]=\"pagedRegions\"\n  [total]=\"tableTotal\"\n  [first]=\"paginatorFirst\"\n  [rows]=\"paginatorRows\"\n  [rowsPerPageOptions]=\"rowsPerPageOptions\"\n  [metaKey]=\"metaKey\"\n  [selection]=\"selectedRegions\"\n  (selectionChange)=\"selectedRegions = $event\"\n  (rowSelect)=\"onSelectionChanged()\"\n  [presetSet]=\"tablePresetSet\"\n  [defaultColor]=\"shapeColor\"\n  [mpp]=\"mpp\"\n  [volumes]=\"tableVolumes\"\n  [labelDrafts]=\"editingLabelRegions\"\n  (labelEditStart)=\"startEditLabel($event)\"\n  (labelDraftChange)=\"setLabelDraft($event.region, $event.value)\"\n  (labelEditStop)=\"stopEditLabel($event.region, $event.commit)\"\n  (classPick)=\"applyPresetToRegion($event.region, $event.name)\"\n  (deleteRow)=\"deleteRegion($event)\"\n  (pageChange)=\"onPageChange($event)\"\n>\n</region-table>\n\n<!-- Live-edit mode: no Save/Cancel \u2014 every edit commits immediately to the\n     active image's region cache. -->\n\n<p-confirmDialog\n  #cd\n  [style]=\"{ width: '24rem', height: '14rem' }\"\n  key=\"positionDialog\"\n  [baseZIndex]=\"10000\"\n  rejectButtonStyleClass=\"p-button-outlined\"\n>\n  <ng-template pTemplate=\"footer\">\n    <button type=\"button\" pButton icon=\"pi pi-check\" label=\"Yes\" (click)=\"cd.accept()\"></button>\n    <button\n      type=\"button\"\n      class=\"p-button-outlined\"\n      pButton\n      icon=\"pi pi-times\"\n      label=\"No\"\n      (click)=\"cd.reject()\"\n    ></button>\n  </ng-template>\n</p-confirmDialog>\n\n<region-save-regions-dialog\n  [(visible)]=\"showSaveAsDialog\"\n  [filename]=\"saveAsFilename\"\n  (filenameChange)=\"saveAsFilename = $event; checkSaveAsFileExists()\"\n  [fileExists]=\"saveAsFileExists\"\n  [busy]=\"saveAsBusy\"\n  (confirm)=\"confirmSaveAs()\"\n  (cancelSave)=\"cancelSaveAs()\"\n>\n</region-save-regions-dialog>\n\n<region-save-regions-dialog\n  header=\"Export Regions\"\n  confirmLabel=\"Export\"\n  confirmIcon=\"pi pi-download\"\n  inputId=\"export-filename\"\n  [(visible)]=\"showExportDialog\"\n  [(filename)]=\"exportFilename\"\n  (confirm)=\"confirmExport()\"\n>\n</region-save-regions-dialog>\n\n<region-save-mask-dialog\n  [(visible)]=\"showSaveMaskDialog\"\n  [(filename)]=\"saveMaskFilename\"\n  [(mode)]=\"maskMode\"\n  [busy]=\"maskBusy\"\n  [progress]=\"maskProgress\"\n  [encoding]=\"maskEncoding\"\n  (confirm)=\"confirmSaveMask()\"\n  (cancelExport)=\"cancelSaveMask()\"\n>\n</region-save-mask-dialog>\n\n<region-color-dialog\n  [(visible)]=\"showColorDialog\"\n  [edits]=\"classColorEdits\"\n  [selectedCount]=\"selectedRegions?.length || 0\"\n  (apply)=\"applyColorToSelected($event)\"\n>\n</region-color-dialog>\n\n<!-- Manage annotation classes (jit-ui#70): edits a working copy, committed on Apply. -->\n<region-manage-classes-dialog\n  [(visible)]=\"showManageDialog\"\n  [(draft)]=\"presetDraft\"\n  (apply)=\"applyManageDialog(true)\"\n  (resetDefaults)=\"resetPresetsToDefaults()\"\n  (importFile)=\"importPresets($event)\"\n  (export)=\"exportPresets()\"\n>\n</region-manage-classes-dialog>\n\n<region-editor-help [(visible)]=\"displayHelpDialog\"></region-editor-help>\n", styles: ["@charset \"UTF-8\";.chip-swatch{display:inline-block;width:.75rem;height:.75rem;border-radius:50%;border:1px solid rgba(0,0,0,.2);flex:0 0 auto}.dd-value{display:inline-flex;align-items:center;gap:.4rem;min-width:0}.dd-value .class-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}:host{display:flex;flex-direction:column;height:100%;min-height:0;overflow:hidden}::ng-deep region-editor .p-toolbar.region-toolbar{padding:.25rem .5rem;border-radius:0;border-left:none;border-right:none;border-top:none}::ng-deep region-editor .p-toolbar.region-toolbar .p-button.p-button-icon-only{width:auto;padding:.25rem .5rem}::ng-deep region-editor .p-toolbar.region-toolbar .p-button{padding:.25rem .5rem}.toolbar-icon-dark{filter:brightness(0) invert(47%) sepia(98%) saturate(567%) hue-rotate(181deg) brightness(103%) contrast(98%)}.toolbar-separator{border-left:1px solid var(--surface-border);height:1.5rem;margin:0 .25rem;align-self:center}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: SharedModule }, { kind: "directive", type: i1$2.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "directive", type: i3.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "label", "icon", "loading", "severity", "raised", "rounded", "text", "outlined", "size", "plain"] }, { kind: "component", type: i3.Button, selector: "p-button", inputs: ["type", "iconPos", "icon", "badge", "label", "disabled", "loading", "loadingIcon", "raised", "rounded", "text", "plain", "severity", "outlined", "link", "tabindex", "size", "style", "styleClass", "badgeClass", "ariaLabel", "autofocus"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "ngmodule", type: ConfirmDialogModule }, { kind: "component", type: i7$2.ConfirmDialog, selector: "p-confirmDialog", inputs: ["header", "icon", "message", "style", "styleClass", "maskStyleClass", "acceptIcon", "acceptLabel", "closeAriaLabel", "acceptAriaLabel", "acceptVisible", "rejectIcon", "rejectLabel", "rejectAriaLabel", "rejectVisible", "acceptButtonStyleClass", "rejectButtonStyleClass", "closeOnEscape", "dismissableMask", "blockScroll", "rtl", "closable", "appendTo", "key", "autoZIndex", "baseZIndex", "transitionOptions", "focusTrap", "defaultFocus", "breakpoints", "visible", "position"], outputs: ["onHide"] }, { kind: "ngmodule", type: DropdownModule }, { kind: "component", type: i4.Dropdown, selector: "p-dropdown", inputs: ["id", "scrollHeight", "filter", "name", "style", "panelStyle", "styleClass", "panelStyleClass", "readonly", "required", "editable", "appendTo", "tabindex", "placeholder", "loadingIcon", "filterPlaceholder", "filterLocale", "variant", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "checkmark", "dropdownIcon", "loading", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "autoDisplayFirst", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "maxlength", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "autoShowPanelOnPrintableCharacterKeyDown", "disabled", "itemSize", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "filterValue", "options"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "ngmodule", type: InputTextModule }, { kind: "directive", type: i6.InputText, selector: "[pInputText]", inputs: ["variant"] }, { kind: "ngmodule", type: OverlayPanelModule }, { kind: "component", type: i10.OverlayPanel, selector: "p-overlayPanel", inputs: ["ariaLabel", "ariaLabelledBy", "dismissable", "showCloseIcon", "style", "styleClass", "appendTo", "autoZIndex", "ariaCloseLabel", "baseZIndex", "focusOnShow", "showTransitionOptions", "hideTransitionOptions"], outputs: ["onShow", "onHide"] }, { kind: "ngmodule", type: ToolbarModule }, { kind: "component", type: i4$2.Toolbar, selector: "p-toolbar", inputs: ["style", "styleClass", "ariaLabelledBy"] }, { kind: "ngmodule", type: TooltipModule }, { kind: "directive", type: i5$1.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "appendTo", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "pTooltip", "tooltipDisabled", "tooltipOptions"] }, { kind: "component", type: ClassesPanelComponent, selector: "region-classes-panel", inputs: ["classes", "counts", "matchMode", "activeClass", "picked", "marked", "selectedCount", "defaultClassName", "volume", "shown3d", "hidden", "treeView"], outputs: ["toggleHidden", "toggle3d", "treeViewChange", "pick", "recolor", "remove", "manage"] }, { kind: "component", type: RegionTableComponent, selector: "region-table", inputs: ["page", "total", "first", "rows", "rowsPerPageOptions", "metaKey", "selection", "presetSet", "defaultColor", "mpp", "volumes", "labelDrafts"], outputs: ["selectionChange", "rowSelect", "labelEditStart", "labelDraftChange", "labelEditStop", "classPick", "deleteRow", "pageChange"] }, { kind: "component", type: ClassTreeComponent, selector: "region-class-tree", inputs: ["nodes", "counts", "colorOf", "picked", "marked", "volume", "shown3d", "hidden"], outputs: ["pick", "recolor", "toggle3d", "toggleHidden"] }, { kind: "component", type: SaveRegionsDialogComponent, selector: "region-save-regions-dialog", inputs: ["header", "confirmLabel", "confirmIcon", "inputId", "visible", "filename", "fileExists", "busy"], outputs: ["visibleChange", "filenameChange", "confirm", "cancelSave"] }, { kind: "component", type: SaveMaskDialogComponent, selector: "region-save-mask-dialog", inputs: ["visible", "filename", "mode", "busy", "progress", "encoding"], outputs: ["visibleChange", "filenameChange", "modeChange", "confirm", "cancelExport"] }, { kind: "component", type: RegionColorDialogComponent, selector: "region-color-dialog", inputs: ["visible", "selectedCount", "edits"], outputs: ["visibleChange", "apply"] }, { kind: "component", type: ManageClassesDialogComponent, selector: "region-manage-classes-dialog", inputs: ["visible", "draft"], outputs: ["visibleChange", "draftChange", "apply", "resetDefaults", "importFile", "export"] }, { kind: "component", type: RegionEditorHelpComponent, selector: "region-editor-help", inputs: ["visible"], outputs: ["visibleChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.9", type: RegionEditorComponent, isStandalone: true, selector: "region-editor", inputs: { active: "active" }, providers: [RegionPersistenceService], viewQueries: [{ propertyName: "overlayPanel", first: true, predicate: ["op"], descendants: true }], ngImport: i0, template: "<p-toolbar styleClass=\"region-toolbar\">\n  <div class=\"p-toolbar-group-start align-items-center flex-wrap gap-1\">\n    <p-button\n      icon=\"pi pi-tag\"\n      size=\"small\"\n      [text]=\"!showShapeLabel\"\n      pTooltip=\"Show region labels.\"\n      tooltipPosition=\"bottom\"\n      (onClick)=\"showShapeLabel = !showShapeLabel; changeShowShapeLabel(showShapeLabel)\"\n    >\n    </p-button>\n    <p-button\n      icon=\"pi pi-stop-circle\"\n      size=\"small\"\n      [text]=\"!regionsFilled\"\n      pTooltip=\"Fill regions in their colour (an atlas's look); labels sit inside.\"\n      tooltipPosition=\"bottom\"\n      ariaLabel=\"Fill regions\"\n      (onClick)=\"toggleFill()\"\n    >\n    </p-button>\n    <p-button\n      *ngIf=\"volumeView\"\n      icon=\"pi pi-eye\"\n      size=\"small\"\n      [text]=\"!regionsThroughVolume\"\n      [attr.aria-pressed]=\"regionsThroughVolume\"\n      pTooltip=\"See the regions through the volume. Off, the volume hides the parts of them behind what it shows; on, none (layers traced inside bright structures, such as an OCT's).\"\n      tooltipPosition=\"bottom\"\n      ariaLabel=\"Regions through volume\"\n      (onClick)=\"toggleThroughVolume()\"\n    >\n    </p-button>\n    <span class=\"toolbar-separator\"></span>\n    <!-- New regions are now created from the diagram toolbar\n         (rectangle, polyline, freeform, wand). -->\n    <p-button\n      icon=\"pi pi-upload\"\n      size=\"small\"\n      [text]=\"true\"\n      styleClass=\"mr-2\"\n      pTooltip=\"Import regions: a GeoJSON file, or a label volume (.nii, .nii.gz, .nrrd) chosen with its ontology JSON for the class tree.\"\n      tooltipPosition=\"bottom\"\n      (click)=\"roiFileInput.click()\"\n    >\n    </p-button>\n    <input\n      #roiFileInput\n      type=\"file\"\n      accept=\".geojson,.json,.nii,.gz,.nrrd\"\n      multiple\n      hidden\n      (change)=\"importRois($event); roiFileInput.value = ''\"\n    />\n    <p-button\n      icon=\"pi pi-folder-open\"\n      size=\"small\"\n      [text]=\"true\"\n      styleClass=\"mr-2\"\n      pTooltip=\"Import a folder of per-slice GeoJSON files (one per slice, in name order, with its regionset.json class tree).\"\n      tooltipPosition=\"bottom\"\n      ariaLabel=\"Import a folder of regions\"\n      (click)=\"roiFolderInput.click()\"\n    >\n    </p-button>\n    <input\n      #roiFolderInput\n      type=\"file\"\n      webkitdirectory\n      multiple\n      hidden\n      (change)=\"importRois($event); roiFolderInput.value = ''\"\n    />\n    <p-button\n      size=\"small\"\n      [text]=\"true\"\n      styleClass=\"mr-2\"\n      pTooltip=\"Download regions as geojson file.\"\n      tooltipPosition=\"bottom\"\n      icon=\"pi pi-download\"\n      (click)=\"exportRois()\"\n    >\n    </p-button>\n    <p-button\n      icon=\"pi pi-save\"\n      size=\"small\"\n      [text]=\"true\"\n      styleClass=\"mr-2\"\n      pTooltip=\"Save regions to server.\"\n      tooltipPosition=\"bottom\"\n      (click)=\"persistRegions()\"\n      [disabled]=\"(!regions || !regions.length) && !hasRegionSource\"\n    >\n    </p-button>\n    <p-button\n      *ngIf=\"canImportFromServer\"\n      icon=\"pi pi-cloud-download\"\n      size=\"small\"\n      [text]=\"true\"\n      styleClass=\"mr-2\"\n      pTooltip=\"Import regions from server: a GeoJSON file, a folder of per-slice GeoJSON files or a label volume (.nii, .nii.gz, .nrrd).\"\n      tooltipPosition=\"bottom\"\n      ariaLabel=\"Import regions from server\"\n      [loading]=\"importing\"\n      (click)=\"importFromServer()\"\n    >\n    </p-button>\n    <p-button\n      size=\"small\"\n      [text]=\"true\"\n      styleClass=\"mr-2\"\n      pTooltip=\"Download mask of the regions as PNG\"\n      tooltipPosition=\"bottom\"\n      (click)=\"openSaveMaskDialog()\"\n      [disabled]=\"!regions || !regions.length\"\n    >\n      <!-- References the file so Inkscape edits to mask.svg show up directly\n           (the lib's assets/** are served at assets/plotting/). The\n           toolbar-icon-dark filter recolours the black SVG to the theme blue,\n           same as region-editor.svg and the other SVG toolbar icons. -->\n      <img\n        src=\"assets/plotting/mask.svg\"\n        class=\"toolbar-icon-dark\"\n        style=\"width: 1rem; height: 1rem; vertical-align: middle\"\n        alt=\"Download mask\"\n      />\n    </p-button>\n    <p-button\n      label=\"x512\"\n      size=\"small\"\n      [text]=\"true\"\n      styleClass=\"mr-2\"\n      pTooltip=\"Round all rectangle regions\n                    to width and height that are multiple of 512\"\n      tooltipPosition=\"bottom\"\n      (click)=\"roundRectangleLengths()\"\n    >\n    </p-button>\n    <p-button\n      icon=\"pi pi-check-square\"\n      size=\"small\"\n      [text]=\"true\"\n      styleClass=\"mr-2\"\n      pTooltip=\"Select all regions\"\n      tooltipPosition=\"bottom\"\n      (click)=\"selectAllRegions()\"\n      [disabled]=\"!regions || !regions.length\"\n    >\n    </p-button>\n    <p-button\n      icon=\"pi pi-tags\"\n      size=\"small\"\n      [text]=\"true\"\n      styleClass=\"mr-2\"\n      pTooltip=\"Edit class on selected rows\"\n      tooltipPosition=\"bottom\"\n      (click)=\"!selectedRegions || !selectedRegions.length ? op.hide() : op.toggle($event)\"\n      [disabled]=\"!selectedRegions || !selectedRegions.length\"\n    >\n    </p-button>\n    <p-button\n      icon=\"pi pi-palette\"\n      size=\"small\"\n      [text]=\"true\"\n      styleClass=\"mr-2\"\n      pTooltip=\"Edit colour of selected regions\"\n      tooltipPosition=\"bottom\"\n      (click)=\"openColorDialog()\"\n      [disabled]=\"!selectedRegions || !selectedRegions.length\"\n    >\n    </p-button>\n    <p-overlayPanel #op (onHide)=\"bulkClass = ''; newBulkClass = ''\">\n      <div class=\"flex flex-column gap-2\" style=\"width: 18rem\">\n        <span class=\"font-medium text-900\"\n          >Set class on {{ selectedRegions?.length || 0 }} selected region(s)</span\n        >\n        <!-- Selecting a class applies it immediately (choosing an option closes the\n             overlay, so there's no separate Apply button). -->\n        <p-dropdown\n          styleClass=\"w-full\"\n          appendTo=\"body\"\n          [options]=\"presetSet.classes\"\n          optionLabel=\"name\"\n          optionValue=\"name\"\n          [(ngModel)]=\"bulkClass\"\n          placeholder=\"Choose a class\u2026\"\n          [filter]=\"presetSet.classes.length > 8\"\n          filterBy=\"name\"\n          (onChange)=\"applyBulkClass()\"\n        >\n          <ng-template let-c pTemplate=\"item\">\n            <span class=\"dd-value\"\n              ><span class=\"chip-swatch\" [style.background]=\"c.color\"></span>{{ c.name }}</span\n            >\n          </ng-template>\n        </p-dropdown>\n        <div class=\"p-inputgroup\">\n          <input\n            type=\"text\"\n            pInputText\n            placeholder=\"\u2026or a new class\"\n            [(ngModel)]=\"newBulkClass\"\n            (keydown.enter)=\"addAndApplyBulkClass()\"\n          />\n          <button\n            pButton\n            type=\"button\"\n            icon=\"pi pi-plus\"\n            pTooltip=\"Add class &amp; set it\"\n            tooltipPosition=\"bottom\"\n            [disabled]=\"!newBulkClass.trim()\"\n            (click)=\"addAndApplyBulkClass()\"\n          ></button>\n        </div>\n      </div>\n    </p-overlayPanel>\n    <p-button\n      icon=\"pi pi-trash\"\n      size=\"small\"\n      [text]=\"true\"\n      styleClass=\"mr-2\"\n      (click)=\"deleteSelectedRegions()\"\n      pTooltip=\"Delete selected regions\"\n      tooltipPosition=\"bottom\"\n      [disabled]=\"!selectedRegions || !selectedRegions.length\"\n    ></p-button>\n    <p-button\n      icon=\"pi pi-times-circle\"\n      size=\"small\"\n      [text]=\"true\"\n      styleClass=\"mr-2\"\n      (click)=\"clearAllRegions()\"\n      pTooltip=\"Delete all regions\"\n      tooltipPosition=\"bottom\"\n      [disabled]=\"(!regions || !regions.length) && !hasRegionSource\"\n    ></p-button>\n    <p-button\n      icon=\"pi pi-question\"\n      size=\"small\"\n      [text]=\"true\"\n      (click)=\"showHelp()\"\n      pTooltip=\"Help\"\n      tooltipPosition=\"bottom\"\n    ></p-button>\n  </div>\n</p-toolbar>\n\n<region-classes-panel\n  [classes]=\"displayClasses\"\n  [counts]=\"classCounts\"\n  [matchMode]=\"presetSet.matchMode\"\n  [activeClass]=\"activeClass\"\n  [picked]=\"pickedClass\"\n  [marked]=\"markedClasses\"\n  [selectedCount]=\"selectedRegions?.length || 0\"\n  [defaultClassName]=\"defaultClassName\"\n  (pick)=\"selectActiveClass($event)\"\n  (recolor)=\"setClassColor($event.name, $event.color)\"\n  (remove)=\"deleteClass($event)\"\n  (manage)=\"openManageDialog()\"\n  [volume]=\"volumeView\"\n  [shown3d]=\"shown3dNames\"\n  (toggle3d)=\"toggleClass3d($event)\"\n  [hidden]=\"hiddenClasses\"\n  (toggleHidden)=\"setClassesHidden([$event], !hiddenClasses.has($event))\"\n  [treeView]=\"classHierarchy ? classTreeView : null\"\n  (treeViewChange)=\"classTreeView = $event\"\n>\n  <!-- A region set with a class hierarchy (an atlas ontology) can show its classes as a tree. -->\n  <region-class-tree\n    *ngIf=\"classHierarchy as hierarchy\"\n    [nodes]=\"hierarchy\"\n    [counts]=\"treeCounts\"\n    [colorOf]=\"treeColor\"\n    [picked]=\"pickedClass\"\n    [marked]=\"markedClasses\"\n    [volume]=\"volumeView\"\n    [shown3d]=\"shown3dNames\"\n    (pick)=\"pickClasses($event)\"\n    (recolor)=\"setClassColor($event.name, $event.color)\"\n    (toggle3d)=\"toggleClass3d($event.name, $event.classes)\"\n    [hidden]=\"hiddenClasses\"\n    (toggleHidden)=\"setClassesHidden($event.classes, $event.hidden)\"\n  >\n  </region-class-tree>\n</region-classes-panel>\n\n<region-table\n  [page]=\"pagedRegions\"\n  [total]=\"tableTotal\"\n  [first]=\"paginatorFirst\"\n  [rows]=\"paginatorRows\"\n  [rowsPerPageOptions]=\"rowsPerPageOptions\"\n  [metaKey]=\"metaKey\"\n  [selection]=\"selectedRegions\"\n  (selectionChange)=\"selectedRegions = $event\"\n  (rowSelect)=\"onSelectionChanged()\"\n  [presetSet]=\"tablePresetSet\"\n  [defaultColor]=\"shapeColor\"\n  [mpp]=\"mpp\"\n  [volumes]=\"tableVolumes\"\n  [labelDrafts]=\"editingLabelRegions\"\n  (labelEditStart)=\"startEditLabel($event)\"\n  (labelDraftChange)=\"setLabelDraft($event.region, $event.value)\"\n  (labelEditStop)=\"stopEditLabel($event.region, $event.commit)\"\n  (classPick)=\"applyPresetToRegion($event.region, $event.name)\"\n  (deleteRow)=\"deleteRegion($event)\"\n  (pageChange)=\"onPageChange($event)\"\n>\n</region-table>\n\n<!-- Live-edit mode: no Save/Cancel \u2014 every edit commits immediately to the\n     active image's region cache. -->\n\n<p-confirmDialog\n  #cd\n  [style]=\"{ width: '24rem', height: '14rem' }\"\n  key=\"positionDialog\"\n  [baseZIndex]=\"10000\"\n  rejectButtonStyleClass=\"p-button-outlined\"\n>\n  <ng-template pTemplate=\"footer\">\n    <button type=\"button\" pButton icon=\"pi pi-check\" label=\"Yes\" (click)=\"cd.accept()\"></button>\n    <button\n      type=\"button\"\n      class=\"p-button-outlined\"\n      pButton\n      icon=\"pi pi-times\"\n      label=\"No\"\n      (click)=\"cd.reject()\"\n    ></button>\n  </ng-template>\n</p-confirmDialog>\n\n<region-save-regions-dialog\n  [(visible)]=\"showSaveAsDialog\"\n  [filename]=\"saveAsFilename\"\n  (filenameChange)=\"saveAsFilename = $event; checkSaveAsFileExists()\"\n  [fileExists]=\"saveAsFileExists\"\n  [busy]=\"saveAsBusy\"\n  (confirm)=\"confirmSaveAs()\"\n  (cancelSave)=\"cancelSaveAs()\"\n>\n</region-save-regions-dialog>\n\n<region-save-regions-dialog\n  header=\"Export Regions\"\n  confirmLabel=\"Export\"\n  confirmIcon=\"pi pi-download\"\n  inputId=\"export-filename\"\n  [(visible)]=\"showExportDialog\"\n  [(filename)]=\"exportFilename\"\n  (confirm)=\"confirmExport()\"\n>\n</region-save-regions-dialog>\n\n<region-save-mask-dialog\n  [(visible)]=\"showSaveMaskDialog\"\n  [(filename)]=\"saveMaskFilename\"\n  [(mode)]=\"maskMode\"\n  [busy]=\"maskBusy\"\n  [progress]=\"maskProgress\"\n  [encoding]=\"maskEncoding\"\n  (confirm)=\"confirmSaveMask()\"\n  (cancelExport)=\"cancelSaveMask()\"\n>\n</region-save-mask-dialog>\n\n<region-color-dialog\n  [(visible)]=\"showColorDialog\"\n  [edits]=\"classColorEdits\"\n  [selectedCount]=\"selectedRegions?.length || 0\"\n  (apply)=\"applyColorToSelected($event)\"\n>\n</region-color-dialog>\n\n<!-- Manage annotation classes (jit-ui#70): edits a working copy, committed on Apply. -->\n<region-manage-classes-dialog\n  [(visible)]=\"showManageDialog\"\n  [(draft)]=\"presetDraft\"\n  (apply)=\"applyManageDialog(true)\"\n  (resetDefaults)=\"resetPresetsToDefaults()\"\n  (importFile)=\"importPresets($event)\"\n  (export)=\"exportPresets()\"\n>\n</region-manage-classes-dialog>\n\n<region-editor-help [(visible)]=\"displayHelpDialog\"></region-editor-help>\n", styles: ["@charset \"UTF-8\";.chip-swatch{display:inline-block;width:.75rem;height:.75rem;border-radius:50%;border:1px solid rgba(0,0,0,.2);flex:0 0 auto}.dd-value{display:inline-flex;align-items:center;gap:.4rem;min-width:0}.dd-value .class-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}:host{display:flex;flex-direction:column;height:100%;min-height:0;overflow:hidden}::ng-deep region-editor .p-toolbar.region-toolbar{padding:.25rem .5rem;border-radius:0;border-left:none;border-right:none;border-top:none}::ng-deep region-editor .p-toolbar.region-toolbar .p-button.p-button-icon-only{width:auto;padding:.25rem .5rem}::ng-deep region-editor .p-toolbar.region-toolbar .p-button{padding:.25rem .5rem}.toolbar-icon-dark{filter:brightness(0) invert(47%) sepia(98%) saturate(567%) hue-rotate(181deg) brightness(103%) contrast(98%)}.toolbar-separator{border-left:1px solid var(--surface-border);height:1.5rem;margin:0 .25rem;align-self:center}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: SharedModule }, { kind: "directive", type: i1$2.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "directive", type: i3.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "label", "icon", "loading", "severity", "raised", "rounded", "text", "outlined", "size", "plain"] }, { kind: "component", type: i3.Button, selector: "p-button", inputs: ["type", "iconPos", "icon", "badge", "label", "disabled", "loading", "loadingIcon", "raised", "rounded", "text", "plain", "severity", "outlined", "link", "tabindex", "size", "style", "styleClass", "badgeClass", "ariaLabel", "autofocus"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "ngmodule", type: ConfirmDialogModule }, { kind: "component", type: i7$2.ConfirmDialog, selector: "p-confirmDialog", inputs: ["header", "icon", "message", "style", "styleClass", "maskStyleClass", "acceptIcon", "acceptLabel", "closeAriaLabel", "acceptAriaLabel", "acceptVisible", "rejectIcon", "rejectLabel", "rejectAriaLabel", "rejectVisible", "acceptButtonStyleClass", "rejectButtonStyleClass", "closeOnEscape", "dismissableMask", "blockScroll", "rtl", "closable", "appendTo", "key", "autoZIndex", "baseZIndex", "transitionOptions", "focusTrap", "defaultFocus", "breakpoints", "visible", "position"], outputs: ["onHide"] }, { kind: "ngmodule", type: DropdownModule }, { kind: "component", type: i4.Dropdown, selector: "p-dropdown", inputs: ["id", "scrollHeight", "filter", "name", "style", "panelStyle", "styleClass", "panelStyleClass", "readonly", "required", "editable", "appendTo", "tabindex", "placeholder", "loadingIcon", "filterPlaceholder", "filterLocale", "variant", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "checkmark", "dropdownIcon", "loading", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "autoDisplayFirst", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "maxlength", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "autoShowPanelOnPrintableCharacterKeyDown", "disabled", "itemSize", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "filterValue", "options"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "ngmodule", type: InputTextModule }, { kind: "directive", type: i6.InputText, selector: "[pInputText]", inputs: ["variant"] }, { kind: "ngmodule", type: OverlayPanelModule }, { kind: "component", type: i10.OverlayPanel, selector: "p-overlayPanel", inputs: ["ariaLabel", "ariaLabelledBy", "dismissable", "showCloseIcon", "style", "styleClass", "appendTo", "autoZIndex", "ariaCloseLabel", "baseZIndex", "focusOnShow", "showTransitionOptions", "hideTransitionOptions"], outputs: ["onShow", "onHide"] }, { kind: "ngmodule", type: ToolbarModule }, { kind: "component", type: i4$2.Toolbar, selector: "p-toolbar", inputs: ["style", "styleClass", "ariaLabelledBy"] }, { kind: "ngmodule", type: TooltipModule }, { kind: "directive", type: i5$1.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "appendTo", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "pTooltip", "tooltipDisabled", "tooltipOptions"] }, { kind: "component", type: ClassesPanelComponent, selector: "region-classes-panel", inputs: ["classes", "counts", "matchMode", "activeClass", "picked", "marked", "selectedCount", "defaultClassName", "volume", "shown3d", "hidden", "treeView"], outputs: ["toggleHidden", "toggle3d", "treeViewChange", "pick", "recolor", "remove", "manage"] }, { kind: "component", type: RegionTableComponent, selector: "region-table", inputs: ["page", "total", "first", "rows", "rowsPerPageOptions", "metaKey", "selection", "presetSet", "defaultColor", "mpp", "volumes", "labelDrafts"], outputs: ["selectionChange", "rowSelect", "labelEditStart", "labelDraftChange", "labelEditStop", "classPick", "deleteRow", "pageChange"] }, { kind: "component", type: ClassTreeComponent, selector: "region-class-tree", inputs: ["nodes", "counts", "colorOf", "picked", "marked", "volume", "shown3d", "hidden"], outputs: ["pick", "recolor", "toggle3d", "toggleHidden"] }, { kind: "component", type: SaveRegionsDialogComponent, selector: "region-save-regions-dialog", inputs: ["header", "confirmLabel", "confirmIcon", "inputId", "visible", "filename", "fileExists", "busy"], outputs: ["visibleChange", "filenameChange", "confirm", "cancelSave"] }, { kind: "component", type: SaveMaskDialogComponent, selector: "region-save-mask-dialog", inputs: ["visible", "filename", "mode", "busy", "progress", "encoding"], outputs: ["visibleChange", "filenameChange", "modeChange", "confirm", "cancelExport"] }, { kind: "component", type: RegionColorDialogComponent, selector: "region-color-dialog", inputs: ["visible", "selectedCount", "edits"], outputs: ["visibleChange", "apply"] }, { kind: "component", type: ManageClassesDialogComponent, selector: "region-manage-classes-dialog", inputs: ["visible", "draft"], outputs: ["visibleChange", "draftChange", "apply", "resetDefaults", "importFile", "export"] }, { kind: "component", type: RegionEditorHelpComponent, selector: "region-editor-help", inputs: ["visible"], outputs: ["visibleChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.9", ngImport: i0, type: RegionEditorComponent, decorators: [{
             type: Component,
@@ -15722,7 +16279,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.9", ngImpor
                         RegionColorDialogComponent,
                         ManageClassesDialogComponent,
                         RegionEditorHelpComponent,
-                    ], changeDetection: ChangeDetectionStrategy.OnPush, providers: [RegionPersistenceService], template: "<p-toolbar styleClass=\"region-toolbar\">\n  <div class=\"p-toolbar-group-start align-items-center flex-wrap gap-1\">\n    <p-button\n      icon=\"pi pi-tag\"\n      size=\"small\"\n      [text]=\"!showShapeLabel\"\n      pTooltip=\"Show region labels.\"\n      tooltipPosition=\"bottom\"\n      (onClick)=\"showShapeLabel = !showShapeLabel; changeShowShapeLabel(showShapeLabel)\"\n    >\n    </p-button>\n    <p-button\n      icon=\"pi pi-stop-circle\"\n      size=\"small\"\n      [text]=\"!regionsFilled\"\n      pTooltip=\"Fill regions in their colour (an atlas's look); labels sit inside.\"\n      tooltipPosition=\"bottom\"\n      ariaLabel=\"Fill regions\"\n      (onClick)=\"toggleFill()\"\n    >\n    </p-button>\n    <p-button\n      *ngIf=\"volumeView\"\n      icon=\"pi pi-eye\"\n      size=\"small\"\n      [text]=\"!regionsThroughVolume\"\n      [attr.aria-pressed]=\"regionsThroughVolume\"\n      pTooltip=\"See the regions through the volume. Off, the volume hides the parts of them behind what it shows; on, none (layers traced inside bright structures, such as an OCT's).\"\n      tooltipPosition=\"bottom\"\n      ariaLabel=\"Regions through volume\"\n      (onClick)=\"toggleThroughVolume()\"\n    >\n    </p-button>\n    <span class=\"toolbar-separator\"></span>\n    <!-- New regions are now created from the diagram toolbar\n         (rectangle, polyline, freeform, wand). -->\n    <p-button\n      icon=\"pi pi-upload\"\n      size=\"small\"\n      [text]=\"true\"\n      styleClass=\"mr-2\"\n      pTooltip=\"Upload and display regions from geojson file.\"\n      tooltipPosition=\"bottom\"\n      (click)=\"roiFileInput.click()\"\n    >\n    </p-button>\n    <input\n      #roiFileInput\n      type=\"file\"\n      accept=\".geojson,.json\"\n      hidden\n      (change)=\"importRois($event); roiFileInput.value = ''\"\n    />\n    <p-button\n      size=\"small\"\n      [text]=\"true\"\n      styleClass=\"mr-2\"\n      pTooltip=\"Download regions as geojson file.\"\n      tooltipPosition=\"bottom\"\n      icon=\"pi pi-download\"\n      (click)=\"exportRois()\"\n    >\n    </p-button>\n    <p-button\n      icon=\"pi pi-save\"\n      size=\"small\"\n      [text]=\"true\"\n      styleClass=\"mr-2\"\n      pTooltip=\"Save regions to server.\"\n      tooltipPosition=\"bottom\"\n      (click)=\"persistRegions()\"\n      [disabled]=\"(!regions || !regions.length) && !hasRegionSource\"\n    >\n    </p-button>\n    <p-button\n      size=\"small\"\n      [text]=\"true\"\n      styleClass=\"mr-2\"\n      pTooltip=\"Download mask of the regions as PNG\"\n      tooltipPosition=\"bottom\"\n      (click)=\"openSaveMaskDialog()\"\n      [disabled]=\"!regions || !regions.length\"\n    >\n      <!-- References the file so Inkscape edits to mask.svg show up directly\n           (the lib's assets/** are served at assets/plotting/). The\n           toolbar-icon-dark filter recolours the black SVG to the theme blue,\n           same as region-editor.svg and the other SVG toolbar icons. -->\n      <img\n        src=\"assets/plotting/mask.svg\"\n        class=\"toolbar-icon-dark\"\n        style=\"width: 1rem; height: 1rem; vertical-align: middle\"\n        alt=\"Download mask\"\n      />\n    </p-button>\n    <p-button\n      label=\"x512\"\n      size=\"small\"\n      [text]=\"true\"\n      styleClass=\"mr-2\"\n      pTooltip=\"Round all rectangle regions\n                    to width and height that are multiple of 512\"\n      tooltipPosition=\"bottom\"\n      (click)=\"roundRectangleLengths()\"\n    >\n    </p-button>\n    <p-button\n      icon=\"pi pi-check-square\"\n      size=\"small\"\n      [text]=\"true\"\n      styleClass=\"mr-2\"\n      pTooltip=\"Select all regions\"\n      tooltipPosition=\"bottom\"\n      (click)=\"selectAllRegions()\"\n      [disabled]=\"!regions || !regions.length\"\n    >\n    </p-button>\n    <p-button\n      icon=\"pi pi-tags\"\n      size=\"small\"\n      [text]=\"true\"\n      styleClass=\"mr-2\"\n      pTooltip=\"Edit class on selected rows\"\n      tooltipPosition=\"bottom\"\n      (click)=\"!selectedRegions || !selectedRegions.length ? op.hide() : op.toggle($event)\"\n      [disabled]=\"!selectedRegions || !selectedRegions.length\"\n    >\n    </p-button>\n    <p-button\n      icon=\"pi pi-palette\"\n      size=\"small\"\n      [text]=\"true\"\n      styleClass=\"mr-2\"\n      pTooltip=\"Edit colour of selected regions\"\n      tooltipPosition=\"bottom\"\n      (click)=\"openColorDialog()\"\n      [disabled]=\"!selectedRegions || !selectedRegions.length\"\n    >\n    </p-button>\n    <p-overlayPanel #op (onHide)=\"bulkClass = ''; newBulkClass = ''\">\n      <div class=\"flex flex-column gap-2\" style=\"width: 18rem\">\n        <span class=\"font-medium text-900\"\n          >Set class on {{ selectedRegions?.length || 0 }} selected region(s)</span\n        >\n        <!-- Selecting a class applies it immediately (choosing an option closes the\n             overlay, so there's no separate Apply button). -->\n        <p-dropdown\n          styleClass=\"w-full\"\n          appendTo=\"body\"\n          [options]=\"presetSet.classes\"\n          optionLabel=\"name\"\n          optionValue=\"name\"\n          [(ngModel)]=\"bulkClass\"\n          placeholder=\"Choose a class\u2026\"\n          [filter]=\"presetSet.classes.length > 8\"\n          filterBy=\"name\"\n          (onChange)=\"applyBulkClass()\"\n        >\n          <ng-template let-c pTemplate=\"item\">\n            <span class=\"dd-value\"\n              ><span class=\"chip-swatch\" [style.background]=\"c.color\"></span>{{ c.name }}</span\n            >\n          </ng-template>\n        </p-dropdown>\n        <div class=\"p-inputgroup\">\n          <input\n            type=\"text\"\n            pInputText\n            placeholder=\"\u2026or a new class\"\n            [(ngModel)]=\"newBulkClass\"\n            (keydown.enter)=\"addAndApplyBulkClass()\"\n          />\n          <button\n            pButton\n            type=\"button\"\n            icon=\"pi pi-plus\"\n            pTooltip=\"Add class &amp; set it\"\n            tooltipPosition=\"bottom\"\n            [disabled]=\"!newBulkClass.trim()\"\n            (click)=\"addAndApplyBulkClass()\"\n          ></button>\n        </div>\n      </div>\n    </p-overlayPanel>\n    <p-button\n      icon=\"pi pi-trash\"\n      size=\"small\"\n      [text]=\"true\"\n      styleClass=\"mr-2\"\n      (click)=\"deleteSelectedRegions()\"\n      pTooltip=\"Delete selected regions\"\n      tooltipPosition=\"bottom\"\n      [disabled]=\"!selectedRegions || !selectedRegions.length\"\n    ></p-button>\n    <p-button\n      icon=\"pi pi-times-circle\"\n      size=\"small\"\n      [text]=\"true\"\n      styleClass=\"mr-2\"\n      (click)=\"clearAllRegions()\"\n      pTooltip=\"Delete all regions\"\n      tooltipPosition=\"bottom\"\n      [disabled]=\"(!regions || !regions.length) && !hasRegionSource\"\n    ></p-button>\n    <p-button\n      icon=\"pi pi-question\"\n      size=\"small\"\n      [text]=\"true\"\n      (click)=\"showHelp()\"\n      pTooltip=\"Help\"\n      tooltipPosition=\"bottom\"\n    ></p-button>\n  </div>\n</p-toolbar>\n\n<region-classes-panel\n  [classes]=\"displayClasses\"\n  [counts]=\"classCounts\"\n  [matchMode]=\"presetSet.matchMode\"\n  [activeClass]=\"activeClass\"\n  [picked]=\"pickedClass\"\n  [marked]=\"markedClasses\"\n  [selectedCount]=\"selectedRegions?.length || 0\"\n  [defaultClassName]=\"defaultClassName\"\n  (pick)=\"selectActiveClass($event)\"\n  (recolor)=\"setClassColor($event.name, $event.color)\"\n  (remove)=\"deleteClass($event)\"\n  (manage)=\"openManageDialog()\"\n  [volume]=\"volumeView\"\n  [shown3d]=\"shown3dNames\"\n  (toggle3d)=\"toggleClass3d($event)\"\n  [hidden]=\"hiddenClasses\"\n  (toggleHidden)=\"setClassesHidden([$event], !hiddenClasses.has($event))\"\n  [treeView]=\"classHierarchy ? classTreeView : null\"\n  (treeViewChange)=\"classTreeView = $event\"\n>\n  <!-- A region set with a class hierarchy (an atlas ontology) can show its classes as a tree. -->\n  <region-class-tree\n    *ngIf=\"classHierarchy as hierarchy\"\n    [nodes]=\"hierarchy\"\n    [counts]=\"treeCounts\"\n    [colorOf]=\"treeColor\"\n    [picked]=\"pickedClass\"\n    [marked]=\"markedClasses\"\n    [volume]=\"volumeView\"\n    [shown3d]=\"shown3dNames\"\n    (pick)=\"pickClasses($event)\"\n    (recolor)=\"setClassColor($event.name, $event.color)\"\n    (toggle3d)=\"toggleClass3d($event.name, $event.classes)\"\n    [hidden]=\"hiddenClasses\"\n    (toggleHidden)=\"setClassesHidden($event.classes, $event.hidden)\"\n  >\n  </region-class-tree>\n</region-classes-panel>\n\n<region-table\n  [page]=\"pagedRegions\"\n  [total]=\"tableTotal\"\n  [first]=\"paginatorFirst\"\n  [rows]=\"paginatorRows\"\n  [rowsPerPageOptions]=\"rowsPerPageOptions\"\n  [metaKey]=\"metaKey\"\n  [selection]=\"selectedRegions\"\n  (selectionChange)=\"selectedRegions = $event\"\n  (rowSelect)=\"onSelectionChanged()\"\n  [presetSet]=\"tablePresetSet\"\n  [defaultColor]=\"shapeColor\"\n  [mpp]=\"mpp\"\n  [volumes]=\"tableVolumes\"\n  [labelDrafts]=\"editingLabelRegions\"\n  (labelEditStart)=\"startEditLabel($event)\"\n  (labelDraftChange)=\"setLabelDraft($event.region, $event.value)\"\n  (labelEditStop)=\"stopEditLabel($event.region, $event.commit)\"\n  (classPick)=\"applyPresetToRegion($event.region, $event.name)\"\n  (deleteRow)=\"deleteRegion($event)\"\n  (pageChange)=\"onPageChange($event)\"\n>\n</region-table>\n\n<!-- Live-edit mode: no Save/Cancel \u2014 every edit commits immediately to the\n     active image's region cache. -->\n\n<p-confirmDialog\n  #cd\n  [style]=\"{ width: '24rem', height: '14rem' }\"\n  key=\"positionDialog\"\n  [baseZIndex]=\"10000\"\n  rejectButtonStyleClass=\"p-button-outlined\"\n>\n  <ng-template pTemplate=\"footer\">\n    <button type=\"button\" pButton icon=\"pi pi-check\" label=\"Yes\" (click)=\"cd.accept()\"></button>\n    <button\n      type=\"button\"\n      class=\"p-button-outlined\"\n      pButton\n      icon=\"pi pi-times\"\n      label=\"No\"\n      (click)=\"cd.reject()\"\n    ></button>\n  </ng-template>\n</p-confirmDialog>\n\n<region-save-regions-dialog\n  [(visible)]=\"showSaveAsDialog\"\n  [filename]=\"saveAsFilename\"\n  (filenameChange)=\"saveAsFilename = $event; checkSaveAsFileExists()\"\n  [fileExists]=\"saveAsFileExists\"\n  [busy]=\"saveAsBusy\"\n  (confirm)=\"confirmSaveAs()\"\n  (cancelSave)=\"cancelSaveAs()\"\n>\n</region-save-regions-dialog>\n\n<region-save-regions-dialog\n  header=\"Export Regions\"\n  confirmLabel=\"Export\"\n  confirmIcon=\"pi pi-download\"\n  inputId=\"export-filename\"\n  [(visible)]=\"showExportDialog\"\n  [(filename)]=\"exportFilename\"\n  (confirm)=\"confirmExport()\"\n>\n</region-save-regions-dialog>\n\n<region-save-mask-dialog\n  [(visible)]=\"showSaveMaskDialog\"\n  [(filename)]=\"saveMaskFilename\"\n  [(mode)]=\"maskMode\"\n  [busy]=\"maskBusy\"\n  [progress]=\"maskProgress\"\n  [encoding]=\"maskEncoding\"\n  (confirm)=\"confirmSaveMask()\"\n  (cancelExport)=\"cancelSaveMask()\"\n>\n</region-save-mask-dialog>\n\n<region-color-dialog\n  [(visible)]=\"showColorDialog\"\n  [edits]=\"classColorEdits\"\n  [selectedCount]=\"selectedRegions?.length || 0\"\n  (apply)=\"applyColorToSelected($event)\"\n>\n</region-color-dialog>\n\n<!-- Manage annotation classes (jit-ui#70): edits a working copy, committed on Apply. -->\n<region-manage-classes-dialog\n  [(visible)]=\"showManageDialog\"\n  [(draft)]=\"presetDraft\"\n  (apply)=\"applyManageDialog(true)\"\n  (resetDefaults)=\"resetPresetsToDefaults()\"\n  (importFile)=\"importPresets($event)\"\n  (export)=\"exportPresets()\"\n>\n</region-manage-classes-dialog>\n\n<region-editor-help [(visible)]=\"displayHelpDialog\"></region-editor-help>\n", styles: ["@charset \"UTF-8\";.chip-swatch{display:inline-block;width:.75rem;height:.75rem;border-radius:50%;border:1px solid rgba(0,0,0,.2);flex:0 0 auto}.dd-value{display:inline-flex;align-items:center;gap:.4rem;min-width:0}.dd-value .class-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}:host{display:flex;flex-direction:column;height:100%;min-height:0;overflow:hidden}::ng-deep region-editor .p-toolbar.region-toolbar{padding:.25rem .5rem;border-radius:0;border-left:none;border-right:none;border-top:none}::ng-deep region-editor .p-toolbar.region-toolbar .p-button.p-button-icon-only{width:auto;padding:.25rem .5rem}::ng-deep region-editor .p-toolbar.region-toolbar .p-button{padding:.25rem .5rem}.toolbar-icon-dark{filter:brightness(0) invert(47%) sepia(98%) saturate(567%) hue-rotate(181deg) brightness(103%) contrast(98%)}.toolbar-separator{border-left:1px solid var(--surface-border);height:1.5rem;margin:0 .25rem;align-self:center}\n"] }]
+                    ], changeDetection: ChangeDetectionStrategy.OnPush, providers: [RegionPersistenceService], template: "<p-toolbar styleClass=\"region-toolbar\">\n  <div class=\"p-toolbar-group-start align-items-center flex-wrap gap-1\">\n    <p-button\n      icon=\"pi pi-tag\"\n      size=\"small\"\n      [text]=\"!showShapeLabel\"\n      pTooltip=\"Show region labels.\"\n      tooltipPosition=\"bottom\"\n      (onClick)=\"showShapeLabel = !showShapeLabel; changeShowShapeLabel(showShapeLabel)\"\n    >\n    </p-button>\n    <p-button\n      icon=\"pi pi-stop-circle\"\n      size=\"small\"\n      [text]=\"!regionsFilled\"\n      pTooltip=\"Fill regions in their colour (an atlas's look); labels sit inside.\"\n      tooltipPosition=\"bottom\"\n      ariaLabel=\"Fill regions\"\n      (onClick)=\"toggleFill()\"\n    >\n    </p-button>\n    <p-button\n      *ngIf=\"volumeView\"\n      icon=\"pi pi-eye\"\n      size=\"small\"\n      [text]=\"!regionsThroughVolume\"\n      [attr.aria-pressed]=\"regionsThroughVolume\"\n      pTooltip=\"See the regions through the volume. Off, the volume hides the parts of them behind what it shows; on, none (layers traced inside bright structures, such as an OCT's).\"\n      tooltipPosition=\"bottom\"\n      ariaLabel=\"Regions through volume\"\n      (onClick)=\"toggleThroughVolume()\"\n    >\n    </p-button>\n    <span class=\"toolbar-separator\"></span>\n    <!-- New regions are now created from the diagram toolbar\n         (rectangle, polyline, freeform, wand). -->\n    <p-button\n      icon=\"pi pi-upload\"\n      size=\"small\"\n      [text]=\"true\"\n      styleClass=\"mr-2\"\n      pTooltip=\"Import regions: a GeoJSON file, or a label volume (.nii, .nii.gz, .nrrd) chosen with its ontology JSON for the class tree.\"\n      tooltipPosition=\"bottom\"\n      (click)=\"roiFileInput.click()\"\n    >\n    </p-button>\n    <input\n      #roiFileInput\n      type=\"file\"\n      accept=\".geojson,.json,.nii,.gz,.nrrd\"\n      multiple\n      hidden\n      (change)=\"importRois($event); roiFileInput.value = ''\"\n    />\n    <p-button\n      icon=\"pi pi-folder-open\"\n      size=\"small\"\n      [text]=\"true\"\n      styleClass=\"mr-2\"\n      pTooltip=\"Import a folder of per-slice GeoJSON files (one per slice, in name order, with its regionset.json class tree).\"\n      tooltipPosition=\"bottom\"\n      ariaLabel=\"Import a folder of regions\"\n      (click)=\"roiFolderInput.click()\"\n    >\n    </p-button>\n    <input\n      #roiFolderInput\n      type=\"file\"\n      webkitdirectory\n      multiple\n      hidden\n      (change)=\"importRois($event); roiFolderInput.value = ''\"\n    />\n    <p-button\n      size=\"small\"\n      [text]=\"true\"\n      styleClass=\"mr-2\"\n      pTooltip=\"Download regions as geojson file.\"\n      tooltipPosition=\"bottom\"\n      icon=\"pi pi-download\"\n      (click)=\"exportRois()\"\n    >\n    </p-button>\n    <p-button\n      icon=\"pi pi-save\"\n      size=\"small\"\n      [text]=\"true\"\n      styleClass=\"mr-2\"\n      pTooltip=\"Save regions to server.\"\n      tooltipPosition=\"bottom\"\n      (click)=\"persistRegions()\"\n      [disabled]=\"(!regions || !regions.length) && !hasRegionSource\"\n    >\n    </p-button>\n    <p-button\n      *ngIf=\"canImportFromServer\"\n      icon=\"pi pi-cloud-download\"\n      size=\"small\"\n      [text]=\"true\"\n      styleClass=\"mr-2\"\n      pTooltip=\"Import regions from server: a GeoJSON file, a folder of per-slice GeoJSON files or a label volume (.nii, .nii.gz, .nrrd).\"\n      tooltipPosition=\"bottom\"\n      ariaLabel=\"Import regions from server\"\n      [loading]=\"importing\"\n      (click)=\"importFromServer()\"\n    >\n    </p-button>\n    <p-button\n      size=\"small\"\n      [text]=\"true\"\n      styleClass=\"mr-2\"\n      pTooltip=\"Download mask of the regions as PNG\"\n      tooltipPosition=\"bottom\"\n      (click)=\"openSaveMaskDialog()\"\n      [disabled]=\"!regions || !regions.length\"\n    >\n      <!-- References the file so Inkscape edits to mask.svg show up directly\n           (the lib's assets/** are served at assets/plotting/). The\n           toolbar-icon-dark filter recolours the black SVG to the theme blue,\n           same as region-editor.svg and the other SVG toolbar icons. -->\n      <img\n        src=\"assets/plotting/mask.svg\"\n        class=\"toolbar-icon-dark\"\n        style=\"width: 1rem; height: 1rem; vertical-align: middle\"\n        alt=\"Download mask\"\n      />\n    </p-button>\n    <p-button\n      label=\"x512\"\n      size=\"small\"\n      [text]=\"true\"\n      styleClass=\"mr-2\"\n      pTooltip=\"Round all rectangle regions\n                    to width and height that are multiple of 512\"\n      tooltipPosition=\"bottom\"\n      (click)=\"roundRectangleLengths()\"\n    >\n    </p-button>\n    <p-button\n      icon=\"pi pi-check-square\"\n      size=\"small\"\n      [text]=\"true\"\n      styleClass=\"mr-2\"\n      pTooltip=\"Select all regions\"\n      tooltipPosition=\"bottom\"\n      (click)=\"selectAllRegions()\"\n      [disabled]=\"!regions || !regions.length\"\n    >\n    </p-button>\n    <p-button\n      icon=\"pi pi-tags\"\n      size=\"small\"\n      [text]=\"true\"\n      styleClass=\"mr-2\"\n      pTooltip=\"Edit class on selected rows\"\n      tooltipPosition=\"bottom\"\n      (click)=\"!selectedRegions || !selectedRegions.length ? op.hide() : op.toggle($event)\"\n      [disabled]=\"!selectedRegions || !selectedRegions.length\"\n    >\n    </p-button>\n    <p-button\n      icon=\"pi pi-palette\"\n      size=\"small\"\n      [text]=\"true\"\n      styleClass=\"mr-2\"\n      pTooltip=\"Edit colour of selected regions\"\n      tooltipPosition=\"bottom\"\n      (click)=\"openColorDialog()\"\n      [disabled]=\"!selectedRegions || !selectedRegions.length\"\n    >\n    </p-button>\n    <p-overlayPanel #op (onHide)=\"bulkClass = ''; newBulkClass = ''\">\n      <div class=\"flex flex-column gap-2\" style=\"width: 18rem\">\n        <span class=\"font-medium text-900\"\n          >Set class on {{ selectedRegions?.length || 0 }} selected region(s)</span\n        >\n        <!-- Selecting a class applies it immediately (choosing an option closes the\n             overlay, so there's no separate Apply button). -->\n        <p-dropdown\n          styleClass=\"w-full\"\n          appendTo=\"body\"\n          [options]=\"presetSet.classes\"\n          optionLabel=\"name\"\n          optionValue=\"name\"\n          [(ngModel)]=\"bulkClass\"\n          placeholder=\"Choose a class\u2026\"\n          [filter]=\"presetSet.classes.length > 8\"\n          filterBy=\"name\"\n          (onChange)=\"applyBulkClass()\"\n        >\n          <ng-template let-c pTemplate=\"item\">\n            <span class=\"dd-value\"\n              ><span class=\"chip-swatch\" [style.background]=\"c.color\"></span>{{ c.name }}</span\n            >\n          </ng-template>\n        </p-dropdown>\n        <div class=\"p-inputgroup\">\n          <input\n            type=\"text\"\n            pInputText\n            placeholder=\"\u2026or a new class\"\n            [(ngModel)]=\"newBulkClass\"\n            (keydown.enter)=\"addAndApplyBulkClass()\"\n          />\n          <button\n            pButton\n            type=\"button\"\n            icon=\"pi pi-plus\"\n            pTooltip=\"Add class &amp; set it\"\n            tooltipPosition=\"bottom\"\n            [disabled]=\"!newBulkClass.trim()\"\n            (click)=\"addAndApplyBulkClass()\"\n          ></button>\n        </div>\n      </div>\n    </p-overlayPanel>\n    <p-button\n      icon=\"pi pi-trash\"\n      size=\"small\"\n      [text]=\"true\"\n      styleClass=\"mr-2\"\n      (click)=\"deleteSelectedRegions()\"\n      pTooltip=\"Delete selected regions\"\n      tooltipPosition=\"bottom\"\n      [disabled]=\"!selectedRegions || !selectedRegions.length\"\n    ></p-button>\n    <p-button\n      icon=\"pi pi-times-circle\"\n      size=\"small\"\n      [text]=\"true\"\n      styleClass=\"mr-2\"\n      (click)=\"clearAllRegions()\"\n      pTooltip=\"Delete all regions\"\n      tooltipPosition=\"bottom\"\n      [disabled]=\"(!regions || !regions.length) && !hasRegionSource\"\n    ></p-button>\n    <p-button\n      icon=\"pi pi-question\"\n      size=\"small\"\n      [text]=\"true\"\n      (click)=\"showHelp()\"\n      pTooltip=\"Help\"\n      tooltipPosition=\"bottom\"\n    ></p-button>\n  </div>\n</p-toolbar>\n\n<region-classes-panel\n  [classes]=\"displayClasses\"\n  [counts]=\"classCounts\"\n  [matchMode]=\"presetSet.matchMode\"\n  [activeClass]=\"activeClass\"\n  [picked]=\"pickedClass\"\n  [marked]=\"markedClasses\"\n  [selectedCount]=\"selectedRegions?.length || 0\"\n  [defaultClassName]=\"defaultClassName\"\n  (pick)=\"selectActiveClass($event)\"\n  (recolor)=\"setClassColor($event.name, $event.color)\"\n  (remove)=\"deleteClass($event)\"\n  (manage)=\"openManageDialog()\"\n  [volume]=\"volumeView\"\n  [shown3d]=\"shown3dNames\"\n  (toggle3d)=\"toggleClass3d($event)\"\n  [hidden]=\"hiddenClasses\"\n  (toggleHidden)=\"setClassesHidden([$event], !hiddenClasses.has($event))\"\n  [treeView]=\"classHierarchy ? classTreeView : null\"\n  (treeViewChange)=\"classTreeView = $event\"\n>\n  <!-- A region set with a class hierarchy (an atlas ontology) can show its classes as a tree. -->\n  <region-class-tree\n    *ngIf=\"classHierarchy as hierarchy\"\n    [nodes]=\"hierarchy\"\n    [counts]=\"treeCounts\"\n    [colorOf]=\"treeColor\"\n    [picked]=\"pickedClass\"\n    [marked]=\"markedClasses\"\n    [volume]=\"volumeView\"\n    [shown3d]=\"shown3dNames\"\n    (pick)=\"pickClasses($event)\"\n    (recolor)=\"setClassColor($event.name, $event.color)\"\n    (toggle3d)=\"toggleClass3d($event.name, $event.classes)\"\n    [hidden]=\"hiddenClasses\"\n    (toggleHidden)=\"setClassesHidden($event.classes, $event.hidden)\"\n  >\n  </region-class-tree>\n</region-classes-panel>\n\n<region-table\n  [page]=\"pagedRegions\"\n  [total]=\"tableTotal\"\n  [first]=\"paginatorFirst\"\n  [rows]=\"paginatorRows\"\n  [rowsPerPageOptions]=\"rowsPerPageOptions\"\n  [metaKey]=\"metaKey\"\n  [selection]=\"selectedRegions\"\n  (selectionChange)=\"selectedRegions = $event\"\n  (rowSelect)=\"onSelectionChanged()\"\n  [presetSet]=\"tablePresetSet\"\n  [defaultColor]=\"shapeColor\"\n  [mpp]=\"mpp\"\n  [volumes]=\"tableVolumes\"\n  [labelDrafts]=\"editingLabelRegions\"\n  (labelEditStart)=\"startEditLabel($event)\"\n  (labelDraftChange)=\"setLabelDraft($event.region, $event.value)\"\n  (labelEditStop)=\"stopEditLabel($event.region, $event.commit)\"\n  (classPick)=\"applyPresetToRegion($event.region, $event.name)\"\n  (deleteRow)=\"deleteRegion($event)\"\n  (pageChange)=\"onPageChange($event)\"\n>\n</region-table>\n\n<!-- Live-edit mode: no Save/Cancel \u2014 every edit commits immediately to the\n     active image's region cache. -->\n\n<p-confirmDialog\n  #cd\n  [style]=\"{ width: '24rem', height: '14rem' }\"\n  key=\"positionDialog\"\n  [baseZIndex]=\"10000\"\n  rejectButtonStyleClass=\"p-button-outlined\"\n>\n  <ng-template pTemplate=\"footer\">\n    <button type=\"button\" pButton icon=\"pi pi-check\" label=\"Yes\" (click)=\"cd.accept()\"></button>\n    <button\n      type=\"button\"\n      class=\"p-button-outlined\"\n      pButton\n      icon=\"pi pi-times\"\n      label=\"No\"\n      (click)=\"cd.reject()\"\n    ></button>\n  </ng-template>\n</p-confirmDialog>\n\n<region-save-regions-dialog\n  [(visible)]=\"showSaveAsDialog\"\n  [filename]=\"saveAsFilename\"\n  (filenameChange)=\"saveAsFilename = $event; checkSaveAsFileExists()\"\n  [fileExists]=\"saveAsFileExists\"\n  [busy]=\"saveAsBusy\"\n  (confirm)=\"confirmSaveAs()\"\n  (cancelSave)=\"cancelSaveAs()\"\n>\n</region-save-regions-dialog>\n\n<region-save-regions-dialog\n  header=\"Export Regions\"\n  confirmLabel=\"Export\"\n  confirmIcon=\"pi pi-download\"\n  inputId=\"export-filename\"\n  [(visible)]=\"showExportDialog\"\n  [(filename)]=\"exportFilename\"\n  (confirm)=\"confirmExport()\"\n>\n</region-save-regions-dialog>\n\n<region-save-mask-dialog\n  [(visible)]=\"showSaveMaskDialog\"\n  [(filename)]=\"saveMaskFilename\"\n  [(mode)]=\"maskMode\"\n  [busy]=\"maskBusy\"\n  [progress]=\"maskProgress\"\n  [encoding]=\"maskEncoding\"\n  (confirm)=\"confirmSaveMask()\"\n  (cancelExport)=\"cancelSaveMask()\"\n>\n</region-save-mask-dialog>\n\n<region-color-dialog\n  [(visible)]=\"showColorDialog\"\n  [edits]=\"classColorEdits\"\n  [selectedCount]=\"selectedRegions?.length || 0\"\n  (apply)=\"applyColorToSelected($event)\"\n>\n</region-color-dialog>\n\n<!-- Manage annotation classes (jit-ui#70): edits a working copy, committed on Apply. -->\n<region-manage-classes-dialog\n  [(visible)]=\"showManageDialog\"\n  [(draft)]=\"presetDraft\"\n  (apply)=\"applyManageDialog(true)\"\n  (resetDefaults)=\"resetPresetsToDefaults()\"\n  (importFile)=\"importPresets($event)\"\n  (export)=\"exportPresets()\"\n>\n</region-manage-classes-dialog>\n\n<region-editor-help [(visible)]=\"displayHelpDialog\"></region-editor-help>\n", styles: ["@charset \"UTF-8\";.chip-swatch{display:inline-block;width:.75rem;height:.75rem;border-radius:50%;border:1px solid rgba(0,0,0,.2);flex:0 0 auto}.dd-value{display:inline-flex;align-items:center;gap:.4rem;min-width:0}.dd-value .class-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}:host{display:flex;flex-direction:column;height:100%;min-height:0;overflow:hidden}::ng-deep region-editor .p-toolbar.region-toolbar{padding:.25rem .5rem;border-radius:0;border-left:none;border-right:none;border-top:none}::ng-deep region-editor .p-toolbar.region-toolbar .p-button.p-button-icon-only{width:auto;padding:.25rem .5rem}::ng-deep region-editor .p-toolbar.region-toolbar .p-button{padding:.25rem .5rem}.toolbar-icon-dark{filter:brightness(0) invert(47%) sepia(98%) saturate(567%) hue-rotate(181deg) brightness(103%) contrast(98%)}.toolbar-separator{border-left:1px solid var(--surface-border);height:1.5rem;margin:0 .25rem;align-self:center}\n"] }]
         }], ctorParameters: () => [{ type: undefined, decorators: [{
                     type: Inject,
                     args: [REGION_EDITOR_API]
@@ -22971,6 +23528,8 @@ class VisualizerComponent {
         /** Isosurface band as a 0–255 slider position, mapped onto the volume's real
          *  intensity range by the renderer. Defaults to the full range. */
         this.isoRange = [0, 255];
+        /** Waits for a viewer created outside the document to be attached (see {@link whenInDocument}). */
+        this.attachObserver = null;
         /** Debounced z-slice scrubbing (see SliceScrubber — refactoring plan Step 7). */
         this.scrubber = new SliceScrubber((z) => {
             this.plotService.setZIndex(z);
@@ -23250,12 +23809,35 @@ class VisualizerComponent {
         // re-enters the zone (ngZone.run) only when it actually changes view state.
         this.shortcuts = new ViewerShortcuts(this.shortcutHost(), this.ngZone);
         this.shortcuts.attach();
-        this.onViewReady();
+        this.whenInDocument(() => this.onViewReady());
     }
     /** The plot div exists now: run an image-less draw that arrived before it did. */
     onViewReady() {
         this.render.viewIsReady(this.spatial.dataset, !!this.imageInfo);
     }
+    /**
+     * 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.
+     */
+    whenInDocument(ready) {
+        const el = this.hostRef?.nativeElement;
+        if (!el || el.isConnected || typeof ResizeObserver === 'undefined') {
+            ready();
+            return;
+        }
+        // Attached and laid out, its size changes from nothing: that is when it can be drawn into.
+        const observer = new ResizeObserver(() => {
+            if (!el.isConnected)
+                return;
+            observer.disconnect();
+            this.attachObserver = null;
+            this.ngZone.run(ready);
+        });
+        this.attachObserver = observer;
+        observer.observe(el);
+    }
     /** 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. */
     shortcutHost() {
@@ -23304,6 +23886,7 @@ class VisualizerComponent {
             this.toggleDragMode('select');
     }
     ngOnDestroy() {
+        this.attachObserver?.disconnect();
         // A contributed mode's session ends first, while the viewer it drew over
         // still exists. The panel goes with this view, so no change detection.
         this.contributions.destroy();
@@ -27699,8 +28282,12 @@ class RegionSourceScope {
         /** The entry of the slice on screen: kept open. */
         this.shown = null;
     }
-    /** Attach `open` to `image` for `slices`, replacing (and closing) what was there. */
-    attach(image, open, slices) {
+    /**
+     * Attach `open` to `image` for `slices`, replacing (and closing) what was there. `imported` names
+     * the slices it brings that a save must write (see {@link importedSlices}): for a source of one
+     * slice, that slice when non-empty; for a `'planes'` source, the slices its planes cover.
+     */
+    attach(image, open, slices, imported = []) {
         const sources = this.imageSources(image);
         const entry = { open, source: null, ready: null };
         if (slices === 'planes') {
@@ -27710,6 +28297,7 @@ class RegionSourceScope {
             sources.perSlice.forEach((e) => this.close(e));
             sources.perSlice.clear();
             sources.taken.clear();
+            sources.imported = new Set(imported);
         }
         else {
             const old = sources.perSlice.get(slices.slice);
@@ -27718,6 +28306,10 @@ class RegionSourceScope {
             entry.plane = slices.plane ?? 0;
             sources.perSlice.set(slices.slice, entry);
             sources.taken.delete(slices.slice);
+            if (imported.length)
+                sources.imported.add(slices.slice);
+            else
+                sources.imported.delete(slices.slice);
         }
     }
     /** Drop every source of `image` (closing the open ones) and what was taken from them. */
@@ -27739,6 +28331,7 @@ class RegionSourceScope {
         this.close(entry);
         sources.perSlice.delete(slice);
         sources.taken.delete(slice);
+        sources.imported.delete(slice);
     }
     /** The slice on screen (null: none): its source stays open while others are read. */
     show(image, slice) {
@@ -27782,6 +28375,11 @@ class RegionSourceScope {
         const taken = image ? this.images.get(image)?.taken : undefined;
         return taken ? Array.from(taken.values()).flatMap((ids) => Array.from(ids)) : [];
     }
+    /** The slices of `image` whose source was imported (see {@link attach}), in order. */
+    importedSlices(image) {
+        const imported = image ? this.images.get(image)?.imported : undefined;
+        return imported ? Array.from(imported).sort((a, b) => a - b) : [];
+    }
     /** The slices of `image` with anything taken from their source. */
     slicesWithTaken(image) {
         const taken = image ? this.images.get(image)?.taken : undefined;
@@ -27806,7 +28404,7 @@ class RegionSourceScope {
     imageSources(image) {
         let sources = this.images.get(image);
         if (!sources) {
-            sources = { planes: null, perSlice: new Map(), taken: new Map() };
+            sources = { planes: null, perSlice: new Map(), taken: new Map(), imported: new Set() };
             this.images.set(image, sources);
         }
         return sources;
@@ -28824,8 +29422,12 @@ class RegionStore {
      */
     getStackSaveSlices() {
         const slices = this.scope.stackSaveSlices(this.regions);
-        // A slice whose region source lost features (taken, deleted) is re-written too.
-        const changed = this.sources.slicesWithTaken(this.scope.activeImage).filter((z) => !slices.has(z));
+        // A slice whose region source lost features (taken, deleted) is re-written too, and so is one
+        // whose source was imported: it is on no file yet.
+        const image = this.scope.activeImage;
+        const changed = [
+            ...new Set([...this.sources.slicesWithTaken(image), ...this.sources.importedSlices(image)]),
+        ].filter((z) => !slices.has(z));
         if (!changed.length)
             return slices;
         for (const z of changed)
@@ -29218,13 +29820,19 @@ class RegionStore {
      * 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, slices = { slice: this.sourceSlice }) {
+    attachRegionSource(source, slices = { slice: this.sourceSlice }, imported = false) {
         const image = this.scope.activeImage;
         if (!image)
             return;
         const open = typeof source === 'function' ? source : () => Promise.resolve(source);
-        this.sources.attach(image, open, slices);
+        const importedSlices = imported === false ? [] : imported === true ? (slices === 'planes' ? [] : [slices.slice]) : imported;
+        this.sources.attach(image, open, slices, importedSlices);
         this.sourcesVersion++;
         this.refreshSourceView();
     }
@@ -29602,22 +30210,50 @@ class RegionStore {
         return view.source.getIndex(view.plane, { ...query, exclude: Array.from(view.taken) });
     }
     /**
-     * `regions` as a GeoJSON FeatureCollection string merged with the region source behind them:
-     * the source's features that were not taken (or deleted), then `regions`. Without a source,
-     * {@link getGeoJsonString}. `slice` names a folder stack's slice (default the one shown);
-     * on a z-indexed stack's source (`'planes'`) the export spans every slice.
+     * `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.
      */
-    async getGeoJsonWithSource(regions, slice = this.sourceSlice) {
+    async getGeoJsonWithSource(regions, slice) {
         const image = this.scope.activeImage;
         const planes = this.scope.stackMode && this.sources.hasPlanesSource(image);
-        const binding = await this.sources.binding(image, slice);
-        if (!binding)
-            return regionsToGeoJson(regions);
         const features = regions
             .filter((r) => !r.isProfile?.())
             .map((r) => featureFromRegion(r))
             .filter((f) => !!f);
-        const exclude = planes ? this.sources.allTaken(image) : Array.from(this.sources.taken(image, slice));
+        if (slice === undefined && this.scope.stackMode && this.scope.saveLayout === 'combined' && !planes) {
+            const sliced = this.sources.slicesWithSource(image);
+            if (sliced.length) {
+                const sourceFeatures = [];
+                for (const z of sliced) {
+                    const binding = await this.sources.binding(image, z);
+                    if (!binding)
+                        continue;
+                    const exported = await binding.source.exportGeoJson(Array.from(this.sources.taken(image, z)), []);
+                    sourceFeatures.push(...onPlane(planeFeatures(exported, binding.plane), z));
+                }
+                return JSON.stringify({ type: 'FeatureCollection', features: [...sourceFeatures, ...features] });
+            }
+        }
+        const at = slice ?? this.sourceSlice;
+        const binding = await this.sources.binding(image, at);
+        if (!binding)
+            return regionsToGeoJson(regions);
+        if (planes && slice !== undefined) {
+            // One slice-file of a z-indexed source: that slice's plane, written on the file's plane 0.
+            const exported = await binding.source.exportGeoJson(this.sources.allTaken(image), []);
+            return JSON.stringify({
+                type: 'FeatureCollection',
+                features: [...onPlane(planeFeatures(exported, binding.plane), 0), ...features],
+            });
+        }
+        const exclude = planes ? this.sources.allTaken(image) : Array.from(this.sources.taken(image, at));
         return binding.source.exportGeoJson(exclude, features);
     }
     // ── Region look ────────────────────────────────────────────────────────
@@ -29858,6 +30494,18 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.9", ngImpor
             type: Injectable,
             args: [{ providedIn: 'root' }]
         }], ctorParameters: () => [{ type: VisualizerStore }] });
+/** The features of an exported FeatureCollection on `plane` (a missing plane is plane 0). */
+function planeFeatures(geoJson, plane) {
+    const features = (JSON.parse(geoJson)?.features ?? []);
+    return features.filter((f) => (f?.geometry?.plane?.z ?? 0) === plane);
+}
+/** `features` moved onto plane `z`, as QuPath writes it: `geometry.plane`, left out for plane 0. */
+function onPlane(features, z) {
+    return features.map((f) => {
+        const { plane: _plane, ...geometry } = f.geometry ?? {};
+        return { ...f, geometry: z === 0 ? geometry : { ...geometry, plane: { c: -1, z, t: 0 } } };
+    });
+}
 
 /**
  * Pure intensity-profile math: sampling a line through a pixel frame, placing a
@@ -31396,6 +32044,12 @@ function silenceOsdMultiImageAdvisory() {
     });
     osd.__multiImageFilterInstalled = true;
 }
+/** Tile cache entries a single image keeps per tiled image (one per channel when drawn per channel). */
+const TILES_PER_IMAGE = 150;
+/** The most tiles a single per-channel image keeps (each a decoded 512² tile, ~1 MB). */
+const MAX_CHANNEL_TILES = 1200;
+/** Tile requests in flight at once for an image drawn per channel. */
+const CHANNEL_REQUEST_LIMIT = 12;
 /**
  * The options object handed to the OpenSeadragon factory. Pure: every value
  * that depends on the service comes in through `input`.
@@ -31481,7 +32135,17 @@ function buildViewerOptions(input) {
         // so they get a much larger tile budget — otherwise switching slices evicts
         // each other's tiles and scrubbing back re-fetches. Scaled to the resident
         // slice count; single images keep the lean default.
-        maxImageCacheCount: input.sliceCount > 1 ? Math.min(2400, Math.max(600, input.maxSlices * 40)) : 150,
+        // A single image drawn per channel needs room for every visible channel's tiles in view: at
+        // 150 a 22-channel plate evicted tiles while they were still being converted.
+        maxImageCacheCount: input.sliceCount > 1
+            ? Math.min(2400, Math.max(600, input.maxSlices * 40))
+            : Math.min(MAX_CHANNEL_TILES, TILES_PER_IMAGE * Math.max(1, Math.ceil((input.channelImages ?? 1) / 2))),
+        // OSD sends every tile request at once by default (imageLoaderLimit 0) and times each out
+        // after 30 s from when it is sent. A view of a 22-channel image asks for hundreds of tiles;
+        // the browser holds all but a few connections' worth back, so those timed out while still
+        // waiting their turn. Limited, they wait in OSD's queue (not timed), where a channel being
+        // hidden drops its own (SliceCache.revealChannelSlice). Single images keep OSD's default.
+        ...((input.channelImages ?? 1) > 1 ? { imageLoaderLimit: CHANNEL_REQUEST_LIMIT } : {}),
     };
 }
 
@@ -32935,6 +33599,234 @@ class OsdRegionOverlay {
     }
 }
 
+/**
+ * "Transcripts reloading…" at the bottom of the canvas while a layer's data is in flight: one
+ * line naming every layer still loading, on a semi-opaque backing so it reads over any tissue.
+ * Longer work names itself ("Building HPF in 3D…") and joins the line.
+ *
+ * Shown only once something has been loading for {@link SHOW_AFTER_MS}, so a redraw served from
+ * cache does not flash it.
+ */
+const SHOW_AFTER_MS = 150;
+class NapariLoadingBadge {
+    constructor(host) {
+        this.names = [];
+        this.tasks = [];
+        this.timer = null;
+        if (getComputedStyle(host).position === 'static')
+            host.style.position = 'relative';
+        this.el = document.createElement('div');
+        this.el.className = 'napari-loading-badge';
+        this.el.setAttribute('role', 'status');
+        this.el.setAttribute('aria-live', 'polite');
+        Object.assign(this.el.style, {
+            position: 'absolute',
+            left: '50%',
+            bottom: '12px',
+            transform: 'translateX(-50%)',
+            padding: '4px 12px',
+            borderRadius: '12px',
+            background: 'rgba(0, 0, 0, 0.6)',
+            color: '#fff',
+            font: '12px/1.4 system-ui, sans-serif',
+            whiteSpace: 'nowrap',
+            pointerEvents: 'none',
+            zIndex: '5',
+            display: 'none',
+        });
+        host.appendChild(this.el);
+    }
+    /** The layers loading now, and the tasks running (their messages); both empty hides the badge. */
+    set(names, tasks = []) {
+        this.names = [...new Set(names)];
+        this.tasks = [...new Set(tasks)];
+        if (!this.names.length && !this.tasks.length) {
+            if (this.timer)
+                clearTimeout(this.timer);
+            this.timer = null;
+            this.el.style.display = 'none';
+            return;
+        }
+        const parts = this.names.length ? [`${listOf(this.names)} reloading…`, ...this.tasks] : this.tasks;
+        this.el.textContent = parts.join(' · ');
+        if (this.el.style.display === 'block' || this.timer)
+            return;
+        this.timer = setTimeout(() => {
+            this.timer = null;
+            if (this.names.length || this.tasks.length)
+                this.el.style.display = 'block';
+        }, SHOW_AFTER_MS);
+    }
+    /** The text currently set (shown or about to be). */
+    get text() {
+        return this.names.length || this.tasks.length ? (this.el.textContent ?? '') : '';
+    }
+    destroy() {
+        if (this.timer)
+            clearTimeout(this.timer);
+        this.el.remove();
+    }
+}
+/** "A", "A and b", "A, b and c": the first as given, the rest with a lower-cased initial. */
+function listOf(names) {
+    const [first, ...rest] = names;
+    const lower = rest.map((n) => n.charAt(0).toLowerCase() + n.slice(1));
+    const all = [first, ...lower];
+    return all.length === 1 ? all[0] : `${all.slice(0, -1).join(', ')} and ${all[all.length - 1]}`;
+}
+
+/**
+ * "x reloading…" at the bottom of the canvas, aggregated over everything that loads into one
+ * scene: image tiles (the tile client), observation colourings (the spatial scenes) and the
+ * spatial tile layers' own loads (which report a list of layer names).
+ *
+ * Each load is a {@link begin} that hands back its own `end`. {@link reset} starts a new scene:
+ * the counts are dropped, and an `end` from a load that began before it is a no-op, so a load
+ * that settles after a re-plot can neither un-count the new scene's work nor drive a count below
+ * zero (which hid the next scene's "Observations reloading…" until a second load overlapped it).
+ *
+ * A {@link beginTask} is work that outlives a scene (a region's 3D reconstruction, built for
+ * whichever volume is on screen when it is done): its message stays across a reset.
+ */
+class LoadingBadgeState {
+    constructor() {
+        this.host = null;
+        this.badge = null;
+        this.counts = new Map();
+        this.tileLayers = [];
+        this.generation = 0;
+        this.tasks = new Map();
+    }
+    /** The element the badge is drawn into (the plot host); set per plot. */
+    attach(host) {
+        this.host = host;
+        if (this.tasks.size)
+            this.show();
+    }
+    /** One load of `source` started; call the returned function once it settles. */
+    begin(source) {
+        const generation = this.generation;
+        this.counts.set(source, (this.counts.get(source) ?? 0) + 1);
+        this.show();
+        let ended = false;
+        return () => {
+            if (ended || generation !== this.generation)
+                return;
+            ended = true;
+            this.counts.set(source, (this.counts.get(source) ?? 0) - 1);
+            this.show();
+        };
+    }
+    /** A task started, shown by its `message` ("Building HPF in 3D…"); call the returned function
+     *  once it settles. */
+    beginTask(message) {
+        const id = Symbol(message);
+        this.tasks.set(id, message);
+        this.show();
+        return () => {
+            if (this.tasks.delete(id))
+                this.show();
+        };
+    }
+    /** The spatial tile layers still loading (their own names, in their order). */
+    setTileLayers(layers) {
+        this.tileLayers = layers;
+        this.show();
+    }
+    /** The text the badge has set (shown, or about to be once the show delay passes). */
+    get text() {
+        return this.badge?.text ?? '';
+    }
+    /** A new scene: forget every count and remove the badge (tasks show again on the next attach). */
+    reset() {
+        this.generation++;
+        this.counts.clear();
+        this.tileLayers = [];
+        this.badge?.destroy();
+        this.badge = null;
+    }
+    show() {
+        if (!this.host)
+            return;
+        this.badge ??= new NapariLoadingBadge(this.host);
+        this.badge.set([
+            ...((this.counts.get('Image') ?? 0) > 0 ? ['Image'] : []),
+            ...((this.counts.get('Observations') ?? 0) > 0 ? ['Observations'] : []),
+            ...this.tileLayers,
+        ], [...this.tasks.values()]);
+    }
+}
+
+/**
+ * "Image reloading…" over the OpenSeadragon view while it fetches the tiles of what it shows, as
+ * napari's views show it for their image, cells and transcripts (the same badge). Driven by each
+ * world item's own `fully-loaded-change` (an image, a stack slice, a channel), so it covers every
+ * tile source alike, and shown only after a short delay, so tiles served from cache never flash it.
+ *
+ * Only items on screen count (opacity above 0): a hidden channel loads nothing by design (it is
+ * not preloaded), so it never becomes fully loaded, and a slice cached or loading in the
+ * background is not what the view shows. An item is weighed again when its opacity changes.
+ */
+class OsdTileLoading {
+    constructor(viewer) {
+        this.viewer = viewer;
+        this.state = new LoadingBadgeState();
+        /** Each item still loading, with the function that un-counts it. */
+        this.loading = new Map();
+        this.watched = new Map();
+        this.onAdd = (e) => this.watch(e.item);
+        this.onRemove = (e) => this.unwatch(e.item);
+        this.state.attach(viewer.element);
+        viewer.world.addHandler('add-item', this.onAdd);
+        viewer.world.addHandler('remove-item', this.onRemove);
+        for (let i = 0; i < viewer.world.getItemCount(); i++)
+            this.watch(viewer.world.getItemAt(i));
+    }
+    /** The badge's text (shown, or about to be). */
+    get text() {
+        return this.state.text;
+    }
+    destroy() {
+        this.viewer.world.removeHandler('add-item', this.onAdd);
+        this.viewer.world.removeHandler('remove-item', this.onRemove);
+        for (const item of [...this.watched.keys()])
+            this.unwatch(item);
+        this.state.reset();
+    }
+    watch(item) {
+        if (!item || this.watched.has(item))
+            return;
+        const handler = () => this.set(item, this.isLoading(item));
+        this.watched.set(item, handler);
+        item.addHandler('fully-loaded-change', handler);
+        item.addHandler('opacity-change', handler);
+        handler();
+    }
+    unwatch(item) {
+        const handler = this.watched.get(item);
+        if (handler) {
+            item.removeHandler('fully-loaded-change', handler);
+            item.removeHandler('opacity-change', handler);
+        }
+        this.watched.delete(item);
+        this.set(item, false);
+    }
+    /** Whether the item is on screen and still fetching its tiles. */
+    isLoading(item) {
+        const opacity = typeof item.getOpacity === 'function' ? item.getOpacity() : 1;
+        return opacity > 0 && !item.getFullyLoaded();
+    }
+    set(item, loading) {
+        const end = this.loading.get(item);
+        if (loading && !end)
+            this.loading.set(item, this.state.begin('Image'));
+        else if (!loading && end) {
+            end();
+            this.loading.delete(item);
+        }
+    }
+}
+
 /**
  * A physical scale bar drawn over an OpenSeadragon viewer. The length maths (the nice 1/2/5 × 10ⁿ
  * length nearest the target, and its unit) are napari-js's `scaleBarFor` / `formatLength`, which
@@ -33790,7 +34682,10 @@ class SliceCache {
     /**
      * Add slice z's channel group: one additively-composited ('lighter' = Fiji
      * "Composite") TiledImage per channel, hidden (opacity 0) until revealed.
-     * Each is preloaded so the background loader can pre-fill every slice.
+     * The visible channels' are preloaded, so the background loader can pre-fill
+     * every slice; a hidden channel's loads nothing until it is shown (a 22-channel
+     * plate fetched and decoded every channel's tiles, overflowing the tile cache:
+     * tiles evicted mid-conversion failed to decode).
      * Cached so a revisit is an instant opacity toggle — no re-fetch, no
      * white-flicker. Mirrors addSlice for the composite path.
      */
@@ -33831,7 +34726,7 @@ class SliceCache {
                     width: 1,
                     opacity: 0, // revealed by revealChannelSlice once the group is in
                     compositeOperation: 'lighter',
-                    preload: true,
+                    preload: this.host.channelVisible(c),
                     success: (e) => {
                         const item = e?.item;
                         if (token !== this.sliceLoadToken) {
@@ -33854,17 +34749,37 @@ class SliceCache {
         }
     }
     /** Reveal slice z's channel group (each visible channel → opacity 1) and
-     *  hide every other cached slice's group. Instant; no fetch/decode. */
+     *  hide every other cached slice's group. Instant; no fetch/decode. Only the
+     *  visible channels keep loading (preload): a hidden channel's tiles are not
+     *  fetched or decoded until it is shown. */
     revealChannelSlice(z) {
+        const hidden = new Set();
         for (const [zz, group] of this.channelSliceItems) {
             const active = zz === z;
             group.forEach((it, c) => {
                 if (!it)
                     return;
                 const visible = this.host.channelVisible(c);
+                if (!visible)
+                    hidden.add(it);
+                quiet(() => it.setPreload?.(visible));
                 quiet(() => it.setOpacity(active && visible ? 1 : 0));
             });
         }
+        this.dropQueuedTiles(hidden);
+    }
+    /** Drop the tile requests still waiting in OSD's queue for `items` (channels just hidden), so
+     *  the visible channels' tiles are not stuck behind them. A request already sent completes. */
+    dropQueuedTiles(items) {
+        const loader = this.host.viewer()?.imageLoader;
+        if (!items.size || !Array.isArray(loader?.jobQueue))
+            return;
+        loader.jobQueue = loader.jobQueue.filter((job) => {
+            if (!items.has(job?.tile?.tiledImage))
+                return true;
+            quiet(() => job.abort?.());
+            return false;
+        });
     }
     /** Show the given composite slice (opacity 1) and hide all other cached slices. */
     showOnlySlice(z) {
@@ -34028,12 +34943,18 @@ class SliceCache {
         const it = this.sliceItems.get(z);
         return it ? [it] : [];
     }
-    /** Whether slice z's tiles are still streaming (any cached image not fully loaded). */
+    /** Whether slice z's tiles are still streaming (any cached image not fully loaded). A hidden
+     *  channel loads nothing, so it never becomes fully loaded: only the visible channels count, or
+     *  the background loader would wait on it forever. */
     sliceTilesLoading(z) {
         const g = this.sliceGroup(z);
         if (!g.length)
             return false;
-        return g.some((it) => it && typeof it.getFullyLoaded === 'function' && !it.getFullyLoaded());
+        const multi = this.host.isMultiChannel();
+        return g.some((it, c) => it &&
+            (!multi || this.host.channelVisible(c)) &&
+            typeof it.getFullyLoaded === 'function' &&
+            !it.getFullyLoaded());
     }
     /** Remove slice z's cached image(s) from the world and the active cache. */
     removeCachedSlice(z) {
@@ -35526,6 +36447,8 @@ class OpenSeadragonVisualizerService extends BaseStoreVisualizer {
         this.viewer = null;
         this.overlay = null;
         this.scaleBar = null;
+        /** "Image reloading…" while the view fetches its tiles. */
+        this.tileLoading = null;
         this.descriptor = null;
         /** Base64 RawFileInfo + current z-slice, kept so setZIndex can rebuild the
          *  tile source and swap slices live (stack navigation). */
@@ -35812,6 +36735,7 @@ class OpenSeadragonVisualizerService extends BaseStoreVisualizer {
             authHeaders: this.authHeaders,
             sliceCount: d.z ?? 1,
             maxSlices: this.cache.maxSlices(),
+            channelImages: this.isMultiChannel ? (d.channels ?? 1) : 1,
         });
         this.viewer = createViewer(options);
         return openViewer(this.viewer, tileSource, (v) => this.onViewerOpened(v, d, simple, plotDiv));
@@ -35827,6 +36751,8 @@ class OpenSeadragonVisualizerService extends BaseStoreVisualizer {
         this.overlay = new OsdRegionOverlay(viewer, this.regionStore);
         this.coordTransform = new OsdCoordinateTransform(viewer);
         this.scaleBar = new OsdScaleBar(viewer, d.mppX ?? 0);
+        this.tileLoading?.destroy();
+        this.tileLoading = new OsdTileLoading(viewer);
         if (simple) {
             // A single, self-contained image — no slice cache to seed. Its z-scrub and
             // recomposite re-open the viewer; one persistent handler reports a failed
@@ -35886,6 +36812,8 @@ class OpenSeadragonVisualizerService extends BaseStoreVisualizer {
             this.scaleBar.destroy();
             this.scaleBar = null;
         }
+        this.tileLoading?.destroy();
+        this.tileLoading = null;
         if (this.viewer) {
             this.viewer.destroy();
             this.viewer = null;
@@ -37387,164 +38315,6 @@ class NapariDisplayState {
     }
 }
 
-/**
- * "Transcripts reloading…" at the bottom of the canvas while a layer's data is in flight: one
- * line naming every layer still loading, on a semi-opaque backing so it reads over any tissue.
- * Longer work names itself ("Building HPF in 3D…") and joins the line.
- *
- * Shown only once something has been loading for {@link SHOW_AFTER_MS}, so a redraw served from
- * cache does not flash it.
- */
-const SHOW_AFTER_MS = 150;
-class NapariLoadingBadge {
-    constructor(host) {
-        this.names = [];
-        this.tasks = [];
-        this.timer = null;
-        if (getComputedStyle(host).position === 'static')
-            host.style.position = 'relative';
-        this.el = document.createElement('div');
-        this.el.className = 'napari-loading-badge';
-        this.el.setAttribute('role', 'status');
-        this.el.setAttribute('aria-live', 'polite');
-        Object.assign(this.el.style, {
-            position: 'absolute',
-            left: '50%',
-            bottom: '12px',
-            transform: 'translateX(-50%)',
-            padding: '4px 12px',
-            borderRadius: '12px',
-            background: 'rgba(0, 0, 0, 0.6)',
-            color: '#fff',
-            font: '12px/1.4 system-ui, sans-serif',
-            whiteSpace: 'nowrap',
-            pointerEvents: 'none',
-            zIndex: '5',
-            display: 'none',
-        });
-        host.appendChild(this.el);
-    }
-    /** The layers loading now, and the tasks running (their messages); both empty hides the badge. */
-    set(names, tasks = []) {
-        this.names = [...new Set(names)];
-        this.tasks = [...new Set(tasks)];
-        if (!this.names.length && !this.tasks.length) {
-            if (this.timer)
-                clearTimeout(this.timer);
-            this.timer = null;
-            this.el.style.display = 'none';
-            return;
-        }
-        const parts = this.names.length ? [`${listOf(this.names)} reloading…`, ...this.tasks] : this.tasks;
-        this.el.textContent = parts.join(' · ');
-        if (this.el.style.display === 'block' || this.timer)
-            return;
-        this.timer = setTimeout(() => {
-            this.timer = null;
-            if (this.names.length || this.tasks.length)
-                this.el.style.display = 'block';
-        }, SHOW_AFTER_MS);
-    }
-    /** The text currently set (shown or about to be). */
-    get text() {
-        return this.names.length || this.tasks.length ? (this.el.textContent ?? '') : '';
-    }
-    destroy() {
-        if (this.timer)
-            clearTimeout(this.timer);
-        this.el.remove();
-    }
-}
-/** "A", "A and b", "A, b and c": the first as given, the rest with a lower-cased initial. */
-function listOf(names) {
-    const [first, ...rest] = names;
-    const lower = rest.map((n) => n.charAt(0).toLowerCase() + n.slice(1));
-    const all = [first, ...lower];
-    return all.length === 1 ? all[0] : `${all.slice(0, -1).join(', ')} and ${all[all.length - 1]}`;
-}
-
-/**
- * "x reloading…" at the bottom of the canvas, aggregated over everything that loads into one
- * scene: image tiles (the tile client), observation colourings (the spatial scenes) and the
- * spatial tile layers' own loads (which report a list of layer names).
- *
- * Each load is a {@link begin} that hands back its own `end`. {@link reset} starts a new scene:
- * the counts are dropped, and an `end` from a load that began before it is a no-op, so a load
- * that settles after a re-plot can neither un-count the new scene's work nor drive a count below
- * zero (which hid the next scene's "Observations reloading…" until a second load overlapped it).
- *
- * A {@link beginTask} is work that outlives a scene (a region's 3D reconstruction, built for
- * whichever volume is on screen when it is done): its message stays across a reset.
- */
-class LoadingBadgeState {
-    constructor() {
-        this.host = null;
-        this.badge = null;
-        this.counts = new Map();
-        this.tileLayers = [];
-        this.generation = 0;
-        this.tasks = new Map();
-    }
-    /** The element the badge is drawn into (the plot host); set per plot. */
-    attach(host) {
-        this.host = host;
-        if (this.tasks.size)
-            this.show();
-    }
-    /** One load of `source` started; call the returned function once it settles. */
-    begin(source) {
-        const generation = this.generation;
-        this.counts.set(source, (this.counts.get(source) ?? 0) + 1);
-        this.show();
-        let ended = false;
-        return () => {
-            if (ended || generation !== this.generation)
-                return;
-            ended = true;
-            this.counts.set(source, (this.counts.get(source) ?? 0) - 1);
-            this.show();
-        };
-    }
-    /** A task started, shown by its `message` ("Building HPF in 3D…"); call the returned function
-     *  once it settles. */
-    beginTask(message) {
-        const id = Symbol(message);
-        this.tasks.set(id, message);
-        this.show();
-        return () => {
-            if (this.tasks.delete(id))
-                this.show();
-        };
-    }
-    /** The spatial tile layers still loading (their own names, in their order). */
-    setTileLayers(layers) {
-        this.tileLayers = layers;
-        this.show();
-    }
-    /** The text the badge has set (shown, or about to be once the show delay passes). */
-    get text() {
-        return this.badge?.text ?? '';
-    }
-    /** A new scene: forget every count and remove the badge (tasks show again on the next attach). */
-    reset() {
-        this.generation++;
-        this.counts.clear();
-        this.tileLayers = [];
-        this.badge?.destroy();
-        this.badge = null;
-    }
-    show() {
-        if (!this.host)
-            return;
-        this.badge ??= new NapariLoadingBadge(this.host);
-        this.badge.set([
-            ...((this.counts.get('Image') ?? 0) > 0 ? ['Image'] : []),
-            ...((this.counts.get('Observations') ?? 0) > 0 ? ['Observations'] : []),
-            ...this.tileLayers,
-        ], [...this.tasks.values()]);
-    }
-}
-
 const SVG_NS$1 = 'http://www.w3.org/2000/svg';
 /** Rendered handle size (screen px). */
 const HANDLE_SIZE = 7;
@@ -45918,6 +46688,8 @@ class RoutingVisualizerService {
         this.sectionSubs = new Subscription();
         /** The image info and screen height of the last plot (what the slice pane mounts). */
         this.plottedInfo = null;
+        /** The current region import (see regionImportTicket): its id and the image it was taken for. */
+        this.importTicket = { id: 0, image: undefined };
         this.plottedHeight = 0;
         this.viewOptions = {
             setNavigatorVisible: (visible) => {
@@ -46488,6 +47260,94 @@ class RoutingVisualizerService {
     dropRegionSource() {
         return this.regionStore.dropSliceRegionSource();
     }
+    /**
+     * A ticket for a region import that is about to read or decode its files: the import methods
+     * given it change nothing once it is stale — another import took a ticket since, another image
+     * was plotted, or the service was destroyed — so an import that finishes late never lands on an
+     * image it was not started for.
+     */
+    regionImportTicket() {
+        this.importTicket = { id: this.importTicket.id + 1, image: this.importImageKey() };
+        return this.importTicket.id;
+    }
+    /** Whether `ticket` is still the current import's, on the image it was taken for. */
+    importTicketValid(ticket) {
+        return ticket === this.importTicket.id && this.importTicket.image === this.importImageKey();
+    }
+    importImageKey() {
+        return RegionScopeCache.imageKey(this.plottedInfo ?? undefined);
+    }
+    /**
+     * Replace the image's regions and region sources with one source per slice, as an imported label
+     * volume or folder of per-slice region files gives them: `openers` by slice index, each opened
+     * the first time its slice is shown. A single image takes slice 0's. Returns how many slices
+     * have a source, or null (changing nothing) when `ticket` is stale (see
+     * {@link regionImportTicket}). The sources are marked imported, so a save writes every slice.
+     */
+    importSliceRegionSources(openers, ticket) {
+        if (ticket !== undefined && !this.importTicketValid(ticket))
+            return null;
+        this.regionImportTicket(); // supersedes any import still in flight
+        const info = this.plottedInfo;
+        this.regionStore.detachRegionSources();
+        if (!info?.isStack) {
+            const first = openers.get(0) ?? openers.values().next().value;
+            this.regionStore.setRegions([]);
+            this.regionStore.resetUndoHistory();
+            if (!first)
+                return 0;
+            this.regionStore.attachRegionSource(first, { slice: 0 }, true);
+            return 1;
+        }
+        this.enterImportedStack(info);
+        for (const [z, open] of openers)
+            this.regionStore.attachRegionSource(open, { slice: z }, true);
+        return openers.size;
+    }
+    /**
+     * Replace the image's regions and region sources with one imported source (a region set the
+     * host's server serves): over every slice of a stack when it is z-indexed, else on the slice
+     * shown, as {@link applyImageRois} lays out an image's own. Resolves false, changing nothing
+     * (and disposing the source), when the import went stale while it opened: another import, or
+     * another image (see {@link regionImportTicket}; one is taken here when `ticket` is not given).
+     */
+    async importRegionSourceOpener(open, ticket) {
+        const mine = ticket ?? this.regionImportTicket();
+        if (!this.importTicketValid(mine))
+            return false;
+        let first = await open();
+        if (!this.importTicketValid(mine)) {
+            first.dispose();
+            return false;
+        }
+        const reuse = () => {
+            const source = first;
+            first = null;
+            return source ? Promise.resolve(source) : open();
+        };
+        const info = this.plottedInfo;
+        const planes = first.info.planes;
+        const zIndexed = !!info?.isStack && planes.some((p) => p !== 0);
+        this.regionStore.detachRegionSources();
+        if (zIndexed) {
+            this.enterImportedStack(info);
+            this.regionStore.attachRegionSource(reuse, 'planes', [...planes]);
+            return true;
+        }
+        this.regionStore.setRegions([]);
+        this.regionStore.resetUndoHistory();
+        this.regionStore.attachRegionSource(reuse, { slice: this.regionStore.getDisplaySlice() }, true);
+        return true;
+    }
+    /** Empty every slice of a stack (its regions and undo history) for regions imported over it. */
+    enterImportedStack(info) {
+        const layout = this.regionStore.isStackMode()
+            ? this.regionStore.getStackSaveLayout()
+            : info.tiled === false
+                ? 'per-slice-file'
+                : 'combined';
+        this.regionStore.enterStackMode(new Map(), this.regionStore.getDisplaySlice(), layout);
+    }
     getRegionSourceView$() {
         return this.regionStore.getRegionSourceView$();
     }
@@ -46938,6 +47798,7 @@ class RoutingVisualizerService {
      *  component for a `provideVisualization()` chain. The dataset subscription would
      *  otherwise keep the whole isolated chain reachable from the root data port. */
     ngOnDestroy() {
+        this.importTicket = { id: this.importTicket.id + 1, image: undefined }; // a late import changes nothing
         this.spatialFacade?.dispose();
         this.spatialFacade = null;
         this.regionUpdates.unsubscribe();
@@ -47165,5 +48026,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.9", ngImpor
  * Generated bundle index. Do not edit.
  */
 
-export { TOOLBAR_TOOLS as $, ALL_GENES as A, REGION_IO_PORT as B, CANVAS_TOOL_IDS as C, DEFAULT_CATEGORICAL_PALETTE as D, REGION_SOURCE_MIN_CHARS as E, Rectangle as F, Region as G, HexColorPickerComponent as H, IMAGE_STATE_PORT as I, RegionEditorComponent as J, RoutingVisualizerService as K, LUT_COLORS as L, MISSING_COLOR as M, NAPARI_DECIMATE_OPTIONS as N, SEMANTIC_SEGMENTER as O, PLOT_MODE_CONTEXT as P, SPATIAL_DATA_PORT as Q, REGION_EDITOR_API as R, SAM_MODELS as S, SPATIAL_WIRE_VERSION as T, ShapeSelection as U, SpatialChartsComponent as V, SpatialControlsComponent as W, SpatialDataHttpService as X, SpatialSelectionStore as Y, SupersededError as Z, TILE_ACCESS_PORT as _, runDecoder as a, setDefaultSamModel as a$, VISUALIZER as a0, VIZ_ALERT_TOAST_KEY as a1, VIZ_CONFIG as a2, VIZ_TOAST_KEY as a3, ViewerFeature as a4, VisualizationModule as a5, VisualizerComponent as a6, assertManifestVersion as a7, benefitsFromGrouping as a8, buildOmicsTraces as a9, isDialogToolContribution as aA, isEmptyPresetSet as aB, isLittleEndian as aC, isNapari3d as aD, isNapariIsosurface as aE, isNapariScatter as aF, isNapariScatter3d as aG, isNapariSurface as aH, isNapariVolume as aI, isSamModelReady as aJ, isSpatialOmics as aK, isSpatialOmics3d as aL, isThreeDimensional as aM, lutFor as aN, markerDiameters as aO, maskToIndices as aP, mutedFromSelection as aQ, omicsLayout as aR, openGeoJsonRegionSource as aS, openHttpRegionSource as aT, parsePresetSet as aU, pointInRing as aV, provideVisualization as aW, rendererOwnsWheel as aX, resolveCategoryColors as aY, selectByCategory as aZ, selectInRegions as a_, capabilitiesOf as aa, clearSamModelCache as ab, contrastWindow as ac, contributedPlotTypeOption as ad, countMask as ae, cropImage as af, datasetFromManifest as ag, decodeColumn as ah, decodeCoords as ai, decodeFeatureVector as aj, decodePolygons as ak, decodeRadius as al, defaultPresetSet as am, dialogToolContributions as an, emptySelection as ao, encodeCategorical as ap, encodeContinuous as aq, findColumnMeta as ar, getDefaultSamModelId as as, getPlotTypeDescriptor as at, getSamModel as au, hydrateBounds as av, isBuiltinPlotType as aw, isCanvasToolId as ax, isCategoricalColumn as ay, isContinuousColumn as az, ALL_TOOLBAR_TOOLS as b, setOrtWasmBase as b0, setSamModelUrls as b1, sortToolContributions as b2, visibleToolContributions as b3, CELL_SEGMENTER as c, CHANNEL_HISTOGRAM_API as d, CellposeSegmenterService as e, fetchModel as f, getOrtWasmBase as g, ChannelHistogramComponent as h, DEFAULT_FALLBACK_PALETTE as i, DEFAULT_MUTED_OPACITY as j, DEFAULT_SAM_MODEL_ID as k, DEFAULT_SPATIAL_VIEW as l, INSTANCE_SEGMENTER as m, ImageConverterService as n, MultiPolygon as o, NAPARI_DEFAULT_DECIMATE as p, NO_CATEGORY as q, runEncoder as r, NO_OBSERVATION as s, PLOT_MODE_SESSION as t, PLOT_TYPE_CONTRIBUTIONS as u, PLOT_TYPE_DESCRIPTORS as v, PREFERENCES_PORT as w, PlotType as x, Polygon as y, ProcessingImage as z };
-//# sourceMappingURL=jax-data-science-sci-image-visualizer-jax-data-science-sci-image-visualizer-BKQhpbHv.mjs.map
+export { TOOLBAR_TOOLS as $, ALL_GENES as A, REGION_IO_PORT as B, CANVAS_TOOL_IDS as C, DEFAULT_CATEGORICAL_PALETTE as D, REGION_SOURCE_MIN_CHARS as E, Rectangle as F, Region as G, HexColorPickerComponent as H, IMAGE_STATE_PORT as I, RegionEditorComponent as J, RoutingVisualizerService as K, LUT_COLORS as L, MISSING_COLOR as M, NAPARI_DECIMATE_OPTIONS as N, SEMANTIC_SEGMENTER as O, PLOT_MODE_CONTEXT as P, SPATIAL_DATA_PORT as Q, REGION_EDITOR_API as R, SAM_MODELS as S, SPATIAL_WIRE_VERSION as T, ShapeSelection as U, SpatialChartsComponent as V, SpatialControlsComponent as W, SpatialDataHttpService as X, SpatialSelectionStore as Y, SupersededError as Z, TILE_ACCESS_PORT as _, runDecoder as a, provideVisualization as a$, VISUALIZER as a0, VIZ_ALERT_TOAST_KEY as a1, VIZ_CONFIG as a2, VIZ_TOAST_KEY as a3, ViewerFeature as a4, VisualizationModule as a5, VisualizerComponent as a6, assertManifestVersion as a7, benefitsFromGrouping as a8, buildOmicsTraces as a9, isContinuousColumn as aA, isDialogToolContribution as aB, isEmptyPresetSet as aC, isLabelVolumeName as aD, isLittleEndian as aE, isNapari3d as aF, isNapariIsosurface as aG, isNapariScatter as aH, isNapariScatter3d as aI, isNapariSurface as aJ, isNapariVolume as aK, isSamModelReady as aL, isSpatialOmics as aM, isSpatialOmics3d as aN, isThreeDimensional as aO, labelClasses as aP, labelSliceGeoJson as aQ, lutFor as aR, markerDiameters as aS, maskToIndices as aT, mutedFromSelection as aU, omicsLayout as aV, openGeoJsonRegionSource as aW, openHttpRegionSource as aX, parsePresetSet as aY, planRegionImport as aZ, pointInRing as a_, capabilitiesOf as aa, clearSamModelCache as ab, contrastWindow as ac, contributedPlotTypeOption as ad, countMask as ae, cropImage as af, datasetFromManifest as ag, decodeColumn as ah, decodeCoords as ai, decodeFeatureVector as aj, decodePolygons as ak, decodeRadius as al, defaultPresetSet as am, dialogToolContributions as an, emptySelection as ao, encodeCategorical as ap, encodeContinuous as aq, findColumnMeta as ar, getDefaultSamModelId as as, getPlotTypeDescriptor as at, getSamModel as au, hydrateBounds as av, importFile as aw, isBuiltinPlotType as ax, isCanvasToolId as ay, isCategoricalColumn as az, ALL_TOOLBAR_TOOLS as b, readLabelVolume as b0, rendererOwnsWheel as b1, resolveCategoryColors as b2, selectByCategory as b3, selectInRegions as b4, setDefaultSamModel as b5, setOrtWasmBase as b6, setSamModelUrls as b7, sortToolContributions as b8, visibleToolContributions as b9, CELL_SEGMENTER as c, CHANNEL_HISTOGRAM_API as d, CellposeSegmenterService as e, fetchModel as f, getOrtWasmBase as g, ChannelHistogramComponent as h, DEFAULT_FALLBACK_PALETTE as i, DEFAULT_MUTED_OPACITY as j, DEFAULT_SAM_MODEL_ID as k, DEFAULT_SPATIAL_VIEW as l, INSTANCE_SEGMENTER as m, ImageConverterService as n, MultiPolygon as o, NAPARI_DEFAULT_DECIMATE as p, NO_CATEGORY as q, runEncoder as r, NO_OBSERVATION as s, PLOT_MODE_SESSION as t, PLOT_TYPE_CONTRIBUTIONS as u, PLOT_TYPE_DESCRIPTORS as v, PREFERENCES_PORT as w, PlotType as x, Polygon as y, ProcessingImage as z };
+//# sourceMappingURL=jax-data-science-sci-image-visualizer-jax-data-science-sci-image-visualizer-BELcx0jv.mjs.map