triiiceratops 0.9.1 → 0.9.3

package/dist/state/viewer.svelte.js

@@ -1,153 +1,60 @@
-var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
-    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
-    return new (P || (P = Promise))(function (resolve, reject) {
-        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
-        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
-        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
-        step((generator = generator.apply(thisArg, _arguments || [])).next());
-    });
-};
-var __generator = (this && this.__generator) || function (thisArg, body) {
-    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g = Object.create((typeof Iterator === "function" ? Iterator : Object).prototype);
-    return g.next = verb(0), g["throw"] = verb(1), g["return"] = verb(2), typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
-    function verb(n) { return function (v) { return step([n, v]); }; }
-    function step(op) {
-        if (f) throw new TypeError("Generator is already executing.");
-        while (g && (g = 0, op[0] && (_ = 0)), _) try {
-            if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
-            if (y = 0, t) op = [op[0] & 2, t.value];
-            switch (op[0]) {
-                case 0: case 1: t = op; break;
-                case 4: _.label++; return { value: op[1], done: false };
-                case 5: _.label++; y = op[1]; op = [0]; continue;
-                case 7: op = _.ops.pop(); _.trys.pop(); continue;
-                default:
-                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
-                    if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
-                    if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
-                    if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
-                    if (t[2]) _.ops.pop();
-                    _.trys.pop(); continue;
-            }
-            op = body.call(thisArg, _);
-        } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
-        if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
+import { manifestsState } from './manifests.svelte.js';
+export class ViewerState {
+    manifestId = $state(null);
+    canvasId = $state(null);
+    showAnnotations = $state(false);
+    showThumbnailGallery = $state(false);
+    isGalleryDockedBottom = $state(false);
+    isGalleryDockedRight = $state(false);
+    isFullScreen = $state(false);
+    showMetadataDialog = $state(false);
+    dockSide = $state('bottom');
+    visibleAnnotationIds = $state(new Set());
+    // UI Configuration
+    config = $state({});
+    // Derived configuration specific getters
+    get showRightMenu() {
+        return this.config.showRightMenu ?? true;
     }
-};
-var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
-    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
-        if (ar || !(i in from)) {
-            if (!ar) ar = Array.prototype.slice.call(from, 0, i);
-            ar[i] = from[i];
-        }
+    get showLeftMenu() {
+        return this.config.showLeftMenu ?? true;
     }
-    return to.concat(ar || Array.prototype.slice.call(from));
-};
-import { manifestsState } from './manifests.svelte.js';
-var ViewerState = /** @class */ (function () {
-    function ViewerState(initialManifestId, initialCanvasId, initialPlugins) {
-        if (initialManifestId === void 0) { initialManifestId = null; }
-        if (initialCanvasId === void 0) { initialCanvasId = null; }
-        if (initialPlugins === void 0) { initialPlugins = []; }
-        this.manifestId = $state(null);
-        this.canvasId = $state(null);
-        this.showAnnotations = $state(false);
-        this.showThumbnailGallery = $state(false);
-        this.isGalleryDockedBottom = $state(false);
-        this.isGalleryDockedRight = $state(false);
-        this.isFullScreen = $state(false);
-        this.showMetadataDialog = $state(false);
-        this.dockSide = $state('bottom');
-        this.visibleAnnotationIds = $state(new Set());
-        // UI Configuration
-        this.config = $state({});
-        // Gallery State (Lifted for persistence during re-docking)
-        this.galleryPosition = $state({ x: 20, y: 100 });
-        this.gallerySize = $state({ width: 300, height: 400 });
-        this.isGalleryDragging = $state(false);
-        this.galleryDragOffset = $state({ x: 0, y: 0 });
-        this.dragOverSide = $state(null);
-        this.galleryCenterPanelRect = $state(null);
-        // ==================== EVENT DISPATCH (Web Component Only) ====================
-        /**
-         * Event target for dispatching CustomEvents.
-         * Only set by TriiiceratopsViewerElement (web component build).
-         * Remains null for Svelte component usage → no events dispatched.
-         */
-        this.eventTarget = null;
-        this.searchQuery = $state('');
-        this.searchResults = $state([]);
-        this.isSearching = $state(false);
-        this.showSearchPanel = $state(false);
-        this.searchAnnotations = $state([]);
-        // ==================== PLUGIN STATE ====================
-        /** Registered plugins */
-        this.plugins = $state([]);
-        /** Plugin-registered menu buttons */
-        this.pluginMenuButtons = $state([]);
-        /** Plugin-registered panels */
-        this.pluginPanels = $state([]);
-        /** OpenSeadragon viewer instance (set by OSDViewer) */
-        this.osdViewer = $state(null);
-        /** Event handlers for inter-plugin communication */
-        this.pluginEventHandlers = new Map();
-        this.manifestId = initialManifestId || null;
-        this.canvasId = initialCanvasId || null;
-        // Fetch manifest immediately
-        if (this.manifestId) {
-            manifestsState.fetchManifest(this.manifestId);
-        }
-        // Register initial plugins
-        for (var _i = 0, initialPlugins_1 = initialPlugins; _i < initialPlugins_1.length; _i++) {
-            var initialPlugin = initialPlugins_1[_i];
-            this.registerPlugin(initialPlugin);
-        }
+    get showCanvasNav() {
+        return this.config.showCanvasNav ?? true;
     }
-    Object.defineProperty(ViewerState.prototype, "showRightMenu", {
-        // Derived configuration specific getters
-        get: function () {
-            var _a;
-            return (_a = this.config.showRightMenu) !== null && _a !== void 0 ? _a : true;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(ViewerState.prototype, "showLeftMenu", {
-        get: function () {
-            var _a;
-            return (_a = this.config.showLeftMenu) !== null && _a !== void 0 ? _a : true;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(ViewerState.prototype, "showCanvasNav", {
-        get: function () {
-            var _a;
-            return (_a = this.config.showCanvasNav) !== null && _a !== void 0 ? _a : true;
-        },
-        enumerable: false,
-        configurable: true
-    });
+    // Gallery State (Lifted for persistence during re-docking)
+    galleryPosition = $state({ x: 20, y: 100 });
+    gallerySize = $state({ width: 300, height: 400 });
+    isGalleryDragging = $state(false);
+    galleryDragOffset = $state({ x: 0, y: 0 });
+    dragOverSide = $state(null);
+    galleryCenterPanelRect = $state(null);
+    // ==================== EVENT DISPATCH (Web Component Only) ====================
+    /**
+     * Event target for dispatching CustomEvents.
+     * Only set by TriiiceratopsViewerElement (web component build).
+     * Remains null for Svelte component usage → no events dispatched.
+     */
+    eventTarget = null;
     /**
      * Set the event target for dispatching state change events.
      * Called by TriiiceratopsViewerElement to enable event-driven API.
      */
-    ViewerState.prototype.setEventTarget = function (target) {
+    setEventTarget(target) {
         this.eventTarget = target;
-    };
+    }
     /**
      * Get current state as a plain object snapshot.
      * Safe to use outside Svelte's reactive system.
      * NOTE: We calculate currentCanvasIndex inline to avoid triggering the canvases getter
      * which can cause infinite loops when it auto-sets canvasId.
      */
-    ViewerState.prototype.getSnapshot = function () {
-        var _this = this;
+    getSnapshot() {
         // Calculate canvas index without triggering reactive side effects
-        var canvasIndex = -1;
+        let canvasIndex = -1;
         if (this.manifestId && this.canvasId) {
-            var canvases = manifestsState.getCanvases(this.manifestId);
-            canvasIndex = canvases.findIndex(function (c) { return c.id === _this.canvasId; });
+            const canvases = manifestsState.getCanvases(this.manifestId);
+            canvasIndex = canvases.findIndex((c) => c.id === this.canvasId);
         }
         return {
             manifestId: this.manifestId,
@@ -160,7 +67,7 @@ var ViewerState = /** @class */ (function () {
             isFullScreen: this.isFullScreen,
             dockSide: this.dockSide,
         };
-    };
+    }
     /**
      * Dispatch a state change event to the web component.
      * No-op if eventTarget is null (Svelte component usage).
@@ -168,106 +75,92 @@ var ViewerState = /** @class */ (function () {
      * Uses queueMicrotask to dispatch asynchronously AFTER the current
      * reactive cycle completes, preventing infinite update loops.
      */
-    ViewerState.prototype.dispatchStateChange = function (eventName) {
-        var _this = this;
-        if (eventName === void 0) { eventName = 'statechange'; }
-        console.log("[ViewerState] Dispatching ".concat(eventName), JSON.stringify(this.getSnapshot()));
+    dispatchStateChange(eventName = 'statechange') {
+        console.log(`[ViewerState] Dispatching ${eventName}`, JSON.stringify(this.getSnapshot()));
         if (!this.eventTarget)
             return;
         // Dispatch asynchronously to break reactive loops
-        queueMicrotask(function () {
-            var _a;
-            (_a = _this.eventTarget) === null || _a === void 0 ? void 0 : _a.dispatchEvent(new CustomEvent(eventName, {
-                detail: _this.getSnapshot(),
+        queueMicrotask(() => {
+            this.eventTarget?.dispatchEvent(new CustomEvent(eventName, {
+                detail: this.getSnapshot(),
                 bubbles: true,
                 composed: true,
             }));
         });
-    };
-    Object.defineProperty(ViewerState.prototype, "manifest", {
-        get: function () {
-            if (!this.manifestId)
-                return null;
-            return manifestsState.getManifest(this.manifestId);
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(ViewerState.prototype, "canvases", {
-        get: function () {
-            var _this = this;
-            if (!this.manifestId)
-                return [];
-            var canvases = manifestsState.getCanvases(this.manifestId);
-            // Auto-initialize canvasId to first canvas if not set
-            if (canvases.length > 0 && !this.canvasId) {
-                // Use setTimeout to avoid updating state during a derived computation
-                setTimeout(function () {
-                    if (!_this.canvasId && canvases.length > 0) {
-                        _this.canvasId = canvases[0].id;
-                    }
-                }, 0);
-            }
-            return canvases;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(ViewerState.prototype, "currentCanvasIndex", {
-        get: function () {
-            var _this = this;
-            if (!this.canvasId) {
-                if (this.canvases.length > 0)
-                    return 0;
-                return -1;
-            }
-            // Manifesto canvases have an id property
-            return this.canvases.findIndex(function (c) { return c.id === _this.canvasId; });
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(ViewerState.prototype, "hasNext", {
-        get: function () {
-            return this.currentCanvasIndex < this.canvases.length - 1;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(ViewerState.prototype, "hasPrevious", {
-        get: function () {
-            return this.currentCanvasIndex > 0;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    ViewerState.prototype.nextCanvas = function () {
+    }
+    constructor(initialManifestId = null, initialCanvasId = null, initialPlugins = []) {
+        this.manifestId = initialManifestId || null;
+        this.canvasId = initialCanvasId || null;
+        // Fetch manifest immediately
+        if (this.manifestId) {
+            manifestsState.fetchManifest(this.manifestId);
+        }
+        // Register initial plugins
+        for (const initialPlugin of initialPlugins) {
+            this.registerPlugin(initialPlugin);
+        }
+    }
+    get manifest() {
+        if (!this.manifestId)
+            return null;
+        return manifestsState.getManifest(this.manifestId);
+    }
+    get canvases() {
+        if (!this.manifestId)
+            return [];
+        const canvases = manifestsState.getCanvases(this.manifestId);
+        // Auto-initialize canvasId to first canvas if not set
+        if (canvases.length > 0 && !this.canvasId) {
+            // Use setTimeout to avoid updating state during a derived computation
+            setTimeout(() => {
+                if (!this.canvasId && canvases.length > 0) {
+                    this.canvasId = canvases[0].id;
+                }
+            }, 0);
+        }
+        return canvases;
+    }
+    get currentCanvasIndex() {
+        if (!this.canvasId) {
+            if (this.canvases.length > 0)
+                return 0;
+            return -1;
+        }
+        // Manifesto canvases have an id property
+        return this.canvases.findIndex((c) => c.id === this.canvasId);
+    }
+    get hasNext() {
+        return this.currentCanvasIndex < this.canvases.length - 1;
+    }
+    get hasPrevious() {
+        return this.currentCanvasIndex > 0;
+    }
+    nextCanvas() {
         if (this.hasNext) {
-            var nextIndex = this.currentCanvasIndex + 1;
-            var canvas = this.canvases[nextIndex];
+            const nextIndex = this.currentCanvasIndex + 1;
+            const canvas = this.canvases[nextIndex];
             this.setCanvas(canvas.id);
         }
-    };
-    ViewerState.prototype.previousCanvas = function () {
+    }
+    previousCanvas() {
         if (this.hasPrevious) {
-            var prevIndex = this.currentCanvasIndex - 1;
-            var canvas = this.canvases[prevIndex];
+            const prevIndex = this.currentCanvasIndex - 1;
+            const canvas = this.canvases[prevIndex];
             this.setCanvas(canvas.id);
         }
-    };
-    ViewerState.prototype.setManifest = function (manifestId) {
+    }
+    setManifest(manifestId) {
         this.manifestId = manifestId;
         this.canvasId = null;
         manifestsState.fetchManifest(manifestId);
         this.dispatchStateChange('manifestchange');
-    };
-    ViewerState.prototype.setCanvas = function (canvasId) {
+    }
+    setCanvas(canvasId) {
         this.canvasId = canvasId;
         this.dispatchStateChange('canvaschange');
-    };
-    ViewerState.prototype.updateConfig = function (newConfig) {
-        var _a;
-        var oldConfig = this.config;
+    }
+    updateConfig(newConfig) {
+        const oldConfig = this.config;
         this.config = newConfig;
         // Sync state from config
         if (newConfig.gallery) {
@@ -285,8 +178,8 @@ var ViewerState = /** @class */ (function () {
             // Only search if the CONFIG has changed its query requirement.
             // This prevents stale config updates (e.g. from other property changes)
             // from overwriting a newer internal search state.
-            var newQuery = newConfig.search.query;
-            var oldQuery = (_a = oldConfig.search) === null || _a === void 0 ? void 0 : _a.query;
+            const newQuery = newConfig.search.query;
+            const oldQuery = oldConfig.search?.query;
             if (newQuery !== undefined &&
                 newQuery !== oldQuery &&
                 newQuery !== this.searchQuery) {
@@ -301,20 +194,20 @@ var ViewerState = /** @class */ (function () {
         // NOTE: We intentionally do NOT dispatch events here.
         // Config updates are external configuration, not user-initiated state changes.
         // Dispatching here would cause infinite loops when the consumer re-renders.
-    };
-    ViewerState.prototype.toggleAnnotations = function () {
+    }
+    toggleAnnotations() {
         this.showAnnotations = !this.showAnnotations;
         this.dispatchStateChange();
-    };
-    ViewerState.prototype.toggleThumbnailGallery = function () {
+    }
+    toggleThumbnailGallery() {
         this.showThumbnailGallery = !this.showThumbnailGallery;
         this.dispatchStateChange();
-    };
-    ViewerState.prototype.toggleFullScreen = function () {
+    }
+    toggleFullScreen() {
         if (!document.fullscreenElement) {
-            var el = document.getElementById('triiiceratops-viewer');
+            const el = document.getElementById('triiiceratops-viewer');
             if (el) {
-                el.requestFullscreen().catch(function (e) {
+                el.requestFullscreen().catch((e) => {
                     console.warn('Fullscreen request failed', e);
                 });
             }
@@ -322,199 +215,111 @@ var ViewerState = /** @class */ (function () {
         else {
             document.exitFullscreen();
         }
-    };
-    ViewerState.prototype.toggleMetadataDialog = function () {
+    }
+    toggleMetadataDialog() {
         this.showMetadataDialog = !this.showMetadataDialog;
-    };
-    ViewerState.prototype.toggleSearchPanel = function () {
+    }
+    searchQuery = $state('');
+    searchResults = $state([]);
+    isSearching = $state(false);
+    showSearchPanel = $state(false);
+    toggleSearchPanel() {
         this.showSearchPanel = !this.showSearchPanel;
         if (!this.showSearchPanel) {
             // Clear ephemeral annotations when closing search
             this.searchAnnotations = [];
         }
         this.dispatchStateChange();
-    };
-    Object.defineProperty(ViewerState.prototype, "currentCanvasSearchAnnotations", {
-        get: function () {
-            var _this = this;
-            if (!this.canvasId)
-                return [];
-            return this.searchAnnotations.filter(function (a) { return a.canvasId === _this.canvasId; });
-        },
-        enumerable: false,
-        configurable: true
-    });
-    ViewerState.prototype.search = function (query) {
-        return __awaiter(this, void 0, void 0, function () {
-            return __generator(this, function (_a) {
-                switch (_a.label) {
-                    case 0:
-                        this.dispatchStateChange();
-                        return [4 /*yield*/, this._performSearch(query)];
-                    case 1:
-                        _a.sent();
-                        this.dispatchStateChange();
-                        return [2 /*return*/];
+    }
+    searchAnnotations = $state([]);
+    get currentCanvasSearchAnnotations() {
+        if (!this.canvasId)
+            return [];
+        return this.searchAnnotations.filter((a) => a.canvasId === this.canvasId);
+    }
+    async search(query) {
+        this.dispatchStateChange();
+        await this._performSearch(query);
+        this.dispatchStateChange();
+    }
+    async _performSearch(query) {
+        if (!query.trim())
+            return;
+        this.isSearching = true;
+        this.searchQuery = query;
+        this.searchResults = [];
+        try {
+            const manifest = this.manifest;
+            if (!manifest)
+                throw new Error('No manifest loaded');
+            let service = manifest.getService('http://iiif.io/api/search/1/search') ||
+                manifest.getService('http://iiif.io/api/search/0/search');
+            if (!service) {
+                // Fallback: check json directly if manifesto fails me
+                if (manifest.__jsonld && manifest.__jsonld.service) {
+                    const services = Array.isArray(manifest.__jsonld.service)
+                        ? manifest.__jsonld.service
+                        : [manifest.__jsonld.service];
+                    service = services.find((s) => s.profile ===
+                        'http://iiif.io/api/search/1/search' ||
+                        s.profile === 'http://iiif.io/api/search/0/search');
                 }
-            });
-        });
-    };
-    ViewerState.prototype._performSearch = function (query) {
-        return __awaiter(this, void 0, void 0, function () {
-            var manifest, service, services, serviceId, searchUrl, response, data, resources, processedResults, parseSelector, _i, _a, hit, annotations, hitBoundsByCanvas, _loop_1, this_1, _b, annotations_1, annoId, _c, hitBoundsByCanvas_1, _d, canvasIndex, data_1, _loop_2, this_2, _e, resources_1, res, annotationIndex_1, e_1;
-            var _this = this;
-            var _f, _g;
-            return __generator(this, function (_h) {
-                switch (_h.label) {
-                    case 0:
-                        if (!query.trim())
-                            return [2 /*return*/];
-                        this.isSearching = true;
-                        this.searchQuery = query;
-                        this.searchResults = [];
-                        _h.label = 1;
-                    case 1:
-                        _h.trys.push([1, 4, 5, 6]);
-                        manifest = this.manifest;
-                        if (!manifest)
-                            throw new Error('No manifest loaded');
-                        service = manifest.getService('http://iiif.io/api/search/1/search') ||
-                            manifest.getService('http://iiif.io/api/search/0/search');
-                        if (!service) {
-                            // Fallback: check json directly if manifesto fails me
-                            if (manifest.__jsonld && manifest.__jsonld.service) {
-                                services = Array.isArray(manifest.__jsonld.service)
-                                    ? manifest.__jsonld.service
-                                    : [manifest.__jsonld.service];
-                                service = services.find(function (s) {
-                                    return s.profile ===
-                                        'http://iiif.io/api/search/1/search' ||
-                                        s.profile === 'http://iiif.io/api/search/0/search';
-                                });
-                            }
-                        }
-                        if (!service) {
-                            console.warn('No IIIF search service found in manifest');
-                            this.isSearching = false;
-                            return [2 /*return*/];
-                        }
-                        serviceId = service.id || service['@id'];
-                        searchUrl = "".concat(serviceId, "?q=").concat(encodeURIComponent(query));
-                        return [4 /*yield*/, fetch(searchUrl)];
-                    case 2:
-                        response = _h.sent();
-                        if (!response.ok)
-                            throw new Error('Search request failed');
-                        return [4 /*yield*/, response.json()];
-                    case 3:
-                        data = _h.sent();
-                        resources = data.resources || [];
-                        processedResults = [];
-                        parseSelector = function (onVal) {
-                            var val = typeof onVal === 'string'
-                                ? onVal
-                                : onVal['@id'] || onVal.id;
-                            if (!val)
-                                return null;
-                            var parts = val.split('#xywh=');
-                            if (parts.length < 2)
-                                return null;
-                            var coords = parts[1].split(',').map(Number);
-                            if (coords.length === 4)
-                                return coords; // [x, y, w, h]
-                            return null;
-                        };
-                        if (data.hits) {
-                            for (_i = 0, _a = data.hits; _i < _a.length; _i++) {
-                                hit = _a[_i];
-                                annotations = hit.annotations || [];
-                                hitBoundsByCanvas = new Map();
-                                _loop_1 = function (annoId) {
-                                    var annotation = resources.find(function (r) { return r['@id'] === annoId || r.id === annoId; });
-                                    if (annotation && annotation.on) {
-                                        // annotation.on can be "canvas-id" or "canvas-id#xywh=..."
-                                        var onVal = typeof annotation.on === 'string'
-                                            ? annotation.on
-                                            : annotation.on['@id'] || annotation.on.id;
-                                        var cleanOn_1 = onVal.split('#')[0];
-                                        var bounds = parseSelector(onVal);
-                                        var canvasIndex = this_1.canvases.findIndex(function (c) { return c.id === cleanOn_1; });
-                                        if (canvasIndex >= 0) {
-                                            if (!hitBoundsByCanvas.has(canvasIndex)) {
-                                                var canvas = this_1.canvases[canvasIndex];
-                                                // Try to get a label
-                                                var label = 'Canvas ' + (canvasIndex + 1);
-                                                try {
-                                                    if (canvas.getLabel) {
-                                                        var l = canvas.getLabel();
-                                                        if (Array.isArray(l) &&
-                                                            l.length > 0)
-                                                            label = l[0].value;
-                                                        else if (typeof l === 'string')
-                                                            label = l;
-                                                    }
-                                                    else if (canvas.label) {
-                                                        // Fallback if raw object
-                                                        if (typeof canvas.label === 'string')
-                                                            label = canvas.label;
-                                                        else if (Array.isArray(canvas.label))
-                                                            label = (_f = canvas.label[0]) === null || _f === void 0 ? void 0 : _f.value;
-                                                    }
-                                                }
-                                                catch (e) {
-                                                    /* ignore */
-                                                }
-                                                hitBoundsByCanvas.set(canvasIndex, {
-                                                    label: String(label),
-                                                    bounds: [],
-                                                });
-                                            }
-                                            if (bounds) {
-                                                hitBoundsByCanvas
-                                                    .get(canvasIndex)
-                                                    .bounds.push(bounds);
-                                            }
-                                        }
-                                    }
-                                };
-                                this_1 = this;
-                                for (_b = 0, annotations_1 = annotations; _b < annotations_1.length; _b++) {
-                                    annoId = annotations_1[_b];
-                                    _loop_1(annoId);
-                                }
-                                // Create one result per canvas for this hit
-                                for (_c = 0, hitBoundsByCanvas_1 = hitBoundsByCanvas; _c < hitBoundsByCanvas_1.length; _c++) {
-                                    _d = hitBoundsByCanvas_1[_c], canvasIndex = _d[0], data_1 = _d[1];
-                                    processedResults.push({
-                                        type: 'hit',
-                                        before: hit.before,
-                                        match: hit.match,
-                                        after: hit.after,
-                                        canvasIndex: canvasIndex,
-                                        canvasLabel: data_1.label,
-                                        // Store all bounds for this hit on this canvas
-                                        allBounds: data_1.bounds,
-                                        // Keep first bounds for backwards compatibility
-                                        bounds: data_1.bounds.length > 0 ? data_1.bounds[0] : null,
-                                    });
-                                }
-                            }
-                        }
-                        else if (resources.length > 0) {
-                            _loop_2 = function (res) {
-                                var onVal = typeof res.on === 'string'
-                                    ? res.on
-                                    : res.on['@id'] || res.on.id;
-                                var cleanOn = onVal.split('#')[0];
-                                var bounds = parseSelector(onVal);
-                                var canvasIndex = this_2.canvases.findIndex(function (c) { return c.id === cleanOn; });
-                                if (canvasIndex >= 0) {
-                                    var canvas = this_2.canvases[canvasIndex];
-                                    var label = 'Canvas ' + (canvasIndex + 1);
+            }
+            if (!service) {
+                console.warn('No IIIF search service found in manifest');
+                this.isSearching = false;
+                return;
+            }
+            // Handle service object which might be a manifesto object or raw json
+            const serviceId = service.id || service['@id'];
+            const searchUrl = `${serviceId}?q=${encodeURIComponent(query)}`;
+            const response = await fetch(searchUrl);
+            if (!response.ok)
+                throw new Error('Search request failed');
+            const data = await response.json();
+            const resources = data.resources || [];
+            const processedResults = [];
+            // Helper to parse xywh
+            const parseSelector = (onVal) => {
+                const val = typeof onVal === 'string'
+                    ? onVal
+                    : onVal['@id'] || onVal.id;
+                if (!val)
+                    return null;
+                const parts = val.split('#xywh=');
+                if (parts.length < 2)
+                    return null;
+                const coords = parts[1].split(',').map(Number);
+                if (coords.length === 4)
+                    return coords; // [x, y, w, h]
+                return null;
+            };
+            if (data.hits) {
+                for (const hit of data.hits) {
+                    // hits have property 'annotations' which is array of ids
+                    // Collapse all annotations for this hit into a single result per canvas
+                    const annotations = hit.annotations || [];
+                    const hitBoundsByCanvas = new Map();
+                    for (const annoId of annotations) {
+                        const annotation = resources.find((r) => r['@id'] === annoId || r.id === annoId);
+                        if (annotation && annotation.on) {
+                            // annotation.on can be "canvas-id" or "canvas-id#xywh=..."
+                            const onVal = typeof annotation.on === 'string'
+                                ? annotation.on
+                                : annotation.on['@id'] || annotation.on.id;
+                            const cleanOn = onVal.split('#')[0];
+                            const bounds = parseSelector(onVal);
+                            const canvasIndex = this.canvases.findIndex((c) => c.id === cleanOn);
+                            if (canvasIndex >= 0) {
+                                if (!hitBoundsByCanvas.has(canvasIndex)) {
+                                    const canvas = this.canvases[canvasIndex];
+                                    // Try to get a label
+                                    let label = 'Canvas ' + (canvasIndex + 1);
                                     try {
                                         if (canvas.getLabel) {
-                                            var l = canvas.getLabel();
-                                            if (Array.isArray(l) && l.length > 0)
+                                            const l = canvas.getLabel();
+                                            if (Array.isArray(l) &&
+                                                l.length > 0)
                                                 label = l[0].value;
                                             else if (typeof l === 'string')
                                                 label = l;
@@ -524,170 +329,226 @@ var ViewerState = /** @class */ (function () {
                                             if (typeof canvas.label === 'string')
                                                 label = canvas.label;
                                             else if (Array.isArray(canvas.label))
-                                                label = (_g = canvas.label[0]) === null || _g === void 0 ? void 0 : _g.value;
+                                                label = canvas.label[0]?.value;
                                         }
                                     }
                                     catch (e) {
                                         /* ignore */
                                     }
-                                    processedResults.push({
-                                        type: 'resource',
-                                        match: res.resource && res.resource.chars
-                                            ? res.resource.chars
-                                            : res.chars || '',
-                                        canvasIndex: canvasIndex,
-                                        canvasLabel: String(label),
-                                        bounds: bounds,
+                                    hitBoundsByCanvas.set(canvasIndex, {
+                                        label: String(label),
+                                        bounds: [],
                                     });
                                 }
-                            };
-                            this_2 = this;
-                            // No hits (Basic level?), just annotations
-                            for (_e = 0, resources_1 = resources; _e < resources_1.length; _e++) {
-                                res = resources_1[_e];
-                                _loop_2(res);
+                                if (bounds) {
+                                    hitBoundsByCanvas
+                                        .get(canvasIndex)
+                                        .bounds.push(bounds);
+                                }
+                            }
+                        }
+                    }
+                    // Create one result per canvas for this hit
+                    for (const [canvasIndex, data] of hitBoundsByCanvas) {
+                        processedResults.push({
+                            type: 'hit',
+                            before: hit.before,
+                            match: hit.match,
+                            after: hit.after,
+                            canvasIndex,
+                            canvasLabel: data.label,
+                            // Store all bounds for this hit on this canvas
+                            allBounds: data.bounds,
+                            // Keep first bounds for backwards compatibility
+                            bounds: data.bounds.length > 0 ? data.bounds[0] : null,
+                        });
+                    }
+                }
+            }
+            else if (resources.length > 0) {
+                // No hits (Basic level?), just annotations
+                for (const res of resources) {
+                    const onVal = typeof res.on === 'string'
+                        ? res.on
+                        : res.on['@id'] || res.on.id;
+                    const cleanOn = onVal.split('#')[0];
+                    const bounds = parseSelector(onVal);
+                    const canvasIndex = this.canvases.findIndex((c) => c.id === cleanOn);
+                    if (canvasIndex >= 0) {
+                        const canvas = this.canvases[canvasIndex];
+                        let label = 'Canvas ' + (canvasIndex + 1);
+                        try {
+                            if (canvas.getLabel) {
+                                const l = canvas.getLabel();
+                                if (Array.isArray(l) && l.length > 0)
+                                    label = l[0].value;
+                                else if (typeof l === 'string')
+                                    label = l;
+                            }
+                            else if (canvas.label) {
+                                // Fallback if raw object
+                                if (typeof canvas.label === 'string')
+                                    label = canvas.label;
+                                else if (Array.isArray(canvas.label))
+                                    label = canvas.label[0]?.value;
                             }
                         }
-                        this.searchResults = processedResults;
-                        annotationIndex_1 = 0;
-                        this.searchAnnotations = processedResults.flatMap(function (r) {
-                            var canvas = _this.canvases[r.canvasIndex];
-                            // Use allBounds if available, otherwise fall back to single bounds
-                            var boundsArray = r.allBounds && r.allBounds.length > 0
-                                ? r.allBounds
-                                : r.bounds
-                                    ? [r.bounds]
-                                    : [];
-                            return boundsArray.map(function (bounds) {
-                                var on = "".concat(canvas.id, "#xywh=").concat(bounds.join(','));
-                                return {
-                                    '@id': "urn:search-hit:".concat(annotationIndex_1++),
-                                    '@type': 'oa:Annotation',
-                                    motivation: 'sc:painting',
-                                    on: on,
-                                    canvasId: canvas.id,
-                                    resource: {
-                                        '@type': 'cnt:ContentAsText',
-                                        chars: r.match,
-                                    },
-                                    // Flag to identify styling in Overlay?
-                                    // Or just standard rendering.
-                                    isSearchHit: true,
-                                };
-                            });
+                        catch (e) {
+                            /* ignore */
+                        }
+                        processedResults.push({
+                            type: 'resource',
+                            match: res.resource && res.resource.chars
+                                ? res.resource.chars
+                                : res.chars || '',
+                            canvasIndex,
+                            canvasLabel: String(label),
+                            bounds,
                         });
-                        return [3 /*break*/, 6];
-                    case 4:
-                        e_1 = _h.sent();
-                        console.error('Search error:', e_1);
-                        return [3 /*break*/, 6];
-                    case 5:
-                        this.isSearching = false;
-                        return [7 /*endfinally*/];
-                    case 6: return [2 /*return*/];
+                    }
                 }
+            }
+            this.searchResults = processedResults;
+            // Generate ephemeral search annotations
+            // Create one annotation per bound location (flatten allBounds)
+            let annotationIndex = 0;
+            this.searchAnnotations = processedResults.flatMap((r) => {
+                const canvas = this.canvases[r.canvasIndex];
+                // Use allBounds if available, otherwise fall back to single bounds
+                const boundsArray = r.allBounds && r.allBounds.length > 0
+                    ? r.allBounds
+                    : r.bounds
+                        ? [r.bounds]
+                        : [];
+                return boundsArray.map((bounds) => {
+                    const on = `${canvas.id}#xywh=${bounds.join(',')}`;
+                    return {
+                        '@id': `urn:search-hit:${annotationIndex++}`,
+                        '@type': 'oa:Annotation',
+                        motivation: 'sc:painting',
+                        on: on,
+                        canvasId: canvas.id,
+                        resource: {
+                            '@type': 'cnt:ContentAsText',
+                            chars: r.match,
+                        },
+                        // Flag to identify styling in Overlay?
+                        // Or just standard rendering.
+                        isSearchHit: true,
+                    };
+                });
             });
-        });
-    };
+        }
+        catch (e) {
+            console.error('Search error:', e);
+        }
+        finally {
+            this.isSearching = false;
+        }
+    }
+    // ==================== PLUGIN STATE ====================
+    /** Registered plugins */
+    plugins = $state([]);
+    /** Plugin-registered menu buttons */
+    pluginMenuButtons = $state([]);
+    /** Plugin-registered panels */
+    pluginPanels = $state([]);
+    /** OpenSeadragon viewer instance (set by OSDViewer) */
+    osdViewer = $state(null);
+    /** Event handlers for inter-plugin communication */
+    pluginEventHandlers = new Map();
     // ==================== PLUGIN METHODS ====================
     /**
      * Create plugin context - the stable API surface for plugins.
      */
-    ViewerState.prototype.createPluginContext = function () {
-        var self = this;
+    createPluginContext() {
+        const self = this;
         return {
             viewerState: self,
-            getOSDViewer: function () { return self.osdViewer; },
-            registerMenuButton: function (button) {
-                if (!self.pluginMenuButtons.find(function (b) { return b.id === button.id; })) {
-                    self.pluginMenuButtons = __spreadArray(__spreadArray([], self.pluginMenuButtons, true), [
+            getOSDViewer: () => self.osdViewer,
+            registerMenuButton(button) {
+                if (!self.pluginMenuButtons.find((b) => b.id === button.id)) {
+                    self.pluginMenuButtons = [
+                        ...self.pluginMenuButtons,
                         button,
-                    ], false);
+                    ];
                 }
             },
-            unregisterMenuButton: function (buttonId) {
-                self.pluginMenuButtons = self.pluginMenuButtons.filter(function (b) { return b.id !== buttonId; });
+            unregisterMenuButton(buttonId) {
+                self.pluginMenuButtons = self.pluginMenuButtons.filter((b) => b.id !== buttonId);
             },
-            registerPanel: function (panel) {
-                if (!self.pluginPanels.find(function (p) { return p.id === panel.id; })) {
-                    self.pluginPanels = __spreadArray(__spreadArray([], self.pluginPanels, true), [panel], false);
+            registerPanel(panel) {
+                if (!self.pluginPanels.find((p) => p.id === panel.id)) {
+                    self.pluginPanels = [...self.pluginPanels, panel];
                 }
             },
-            unregisterPanel: function (panelId) {
-                self.pluginPanels = self.pluginPanels.filter(function (p) { return p.id !== panelId; });
+            unregisterPanel(panelId) {
+                self.pluginPanels = self.pluginPanels.filter((p) => p.id !== panelId);
             },
-            emit: function (eventName, data) {
-                var handlers = self.pluginEventHandlers.get(eventName);
-                handlers === null || handlers === void 0 ? void 0 : handlers.forEach(function (handler) { return handler(data); });
+            emit(eventName, data) {
+                const handlers = self.pluginEventHandlers.get(eventName);
+                handlers?.forEach((handler) => handler(data));
             },
-            on: function (eventName, handler) {
+            on(eventName, handler) {
                 if (!self.pluginEventHandlers.has(eventName)) {
                     self.pluginEventHandlers.set(eventName, new Set());
                 }
                 self.pluginEventHandlers.get(eventName).add(handler);
-                return function () {
-                    var _a;
-                    (_a = self.pluginEventHandlers.get(eventName)) === null || _a === void 0 ? void 0 : _a.delete(handler);
+                return () => {
+                    self.pluginEventHandlers.get(eventName)?.delete(handler);
                 };
             },
         };
-    };
+    }
     /**
      * Register a plugin with this viewer instance.
      */
-    ViewerState.prototype.registerPlugin = function (plugin) {
-        if (this.plugins.find(function (p) { return p.id === plugin.id; })) {
-            console.warn("[Triiiceratops] Plugin \"".concat(plugin.id, "\" already registered"));
+    registerPlugin(plugin) {
+        if (this.plugins.find((p) => p.id === plugin.id)) {
+            console.warn(`[Triiiceratops] Plugin "${plugin.id}" already registered`);
             return;
         }
-        this.plugins = __spreadArray(__spreadArray([], this.plugins, true), [plugin], false);
+        this.plugins = [...this.plugins, plugin];
         plugin.onRegister(this.createPluginContext());
         // If OSD already ready, notify immediately
         if (this.osdViewer && plugin.onViewerReady) {
             plugin.onViewerReady(this.osdViewer);
         }
-    };
+    }
     /**
      * Unregister a plugin by ID.
      */
-    ViewerState.prototype.unregisterPlugin = function (pluginId) {
-        var _a;
-        var plugin = this.plugins.find(function (p) { return p.id === pluginId; });
+    unregisterPlugin(pluginId) {
+        const plugin = this.plugins.find((p) => p.id === pluginId);
         if (plugin) {
-            (_a = plugin.onDestroy) === null || _a === void 0 ? void 0 : _a.call(plugin);
-            this.plugins = this.plugins.filter(function (p) { return p.id !== pluginId; });
+            plugin.onDestroy?.();
+            this.plugins = this.plugins.filter((p) => p.id !== pluginId);
             // Remove plugin's UI registrations
-            this.pluginMenuButtons = this.pluginMenuButtons.filter(function (b) { return !b.id.startsWith("".concat(pluginId, ":")); });
-            this.pluginPanels = this.pluginPanels.filter(function (p) { return !p.id.startsWith("".concat(pluginId, ":")); });
+            this.pluginMenuButtons = this.pluginMenuButtons.filter((b) => !b.id.startsWith(`${pluginId}:`));
+            this.pluginPanels = this.pluginPanels.filter((p) => !p.id.startsWith(`${pluginId}:`));
         }
-    };
+    }
     /**
      * Called by OSDViewer when OpenSeadragon is ready.
      */
-    ViewerState.prototype.notifyOSDReady = function (viewer) {
-        var _a;
+    notifyOSDReady(viewer) {
         this.osdViewer = viewer;
-        for (var _i = 0, _b = this.plugins; _i < _b.length; _i++) {
-            var plugin = _b[_i];
-            (_a = plugin.onViewerReady) === null || _a === void 0 ? void 0 : _a.call(plugin, viewer);
+        for (const plugin of this.plugins) {
+            plugin.onViewerReady?.(viewer);
         }
-    };
+    }
     /**
      * Destroy all plugins (called on viewer unmount).
      */
-    ViewerState.prototype.destroyAllPlugins = function () {
-        var _a;
-        for (var _i = 0, _b = this.plugins; _i < _b.length; _i++) {
-            var plugin = _b[_i];
-            (_a = plugin.onDestroy) === null || _a === void 0 ? void 0 : _a.call(plugin);
+    destroyAllPlugins() {
+        for (const plugin of this.plugins) {
+            plugin.onDestroy?.();
         }
         this.plugins = [];
         this.pluginMenuButtons = [];
         this.pluginPanels = [];
         this.pluginEventHandlers.clear();
-    };
-    return ViewerState;
-}());
-export { ViewerState };
+    }
+}
 // Context key for providing/injecting ViewerState in components
-export var VIEWER_STATE_KEY = 'triiiceratops:viewerState';
+export const VIEWER_STATE_KEY = 'triiiceratops:viewerState';