@aceshooting/lyra-ui 4.2.0 → 5.1.0

package/dist/components/media/image-viewer/image-viewer.class.d.ts

@@ -0,0 +1,143 @@
+import { type PropertyValues, type TemplateResult } from 'lit';
+import { LyraElement } from '../../../internal/lyra-element.js';
+import type { LyraAnchor, LyraAnchorKind, HighlightActivateDetail, AnchorResultDetail } from '../../viewers/document-viewer/anchors.js';
+import '../zoomable-frame/zoomable-frame.js';
+import '../../utility/live-region/live-region.js';
+export type ImageFit = 'contain' | 'width' | 'actual';
+export type ImageRotation = 0 | 90 | 180 | 270;
+export interface ImageRegionRect {
+    x: number;
+    y: number;
+    width: number;
+    height: number;
+}
+export interface LyraImageViewerEventMap {
+    'lr-load': CustomEvent<{
+        naturalWidth: number;
+        naturalHeight: number;
+    }>;
+    'lr-zoom-change': CustomEvent<{
+        zoom: number;
+    }>;
+    'lr-rotation-change': CustomEvent<{
+        rotation: ImageRotation;
+    }>;
+    'lr-fit-change': CustomEvent<{
+        fit: ImageFit;
+    }>;
+    'lr-highlight-activate': CustomEvent<HighlightActivateDetail>;
+    'lr-annotation-create': CustomEvent<{
+        anchor: LyraAnchor;
+    }>;
+    'lr-anchor-result': CustomEvent<AnchorResultDetail>;
+    'lr-render-error': CustomEvent<{
+        error: unknown;
+    }>;
+}
+declare class LyraImageViewerBase extends LyraElement<LyraImageViewerEventMap> {
+}
+declare const LyraImageViewer_base: typeof LyraImageViewerBase & (new (...args: any[]) => import("../../../internal/anchor-target.js").LyraAnchorTarget & {
+    renderAnchorLiveRegion(): unknown;
+});
+/**
+ * `<lr-image-viewer>` — full pan/zoom raster-image viewer with labeled region highlights and
+ * opt-in region annotation, the landing surface for `region`-anchored citations. Distinct from
+ * `<lr-svg-viewer>` (rendered SVG documents) and `<lr-image-comparer>` (before/after slotted
+ * surfaces) — this component owns raster grounding/citation display, not comparison or vector
+ * rendering.
+ *
+ * Adopts `DocumentAnchorTarget` with `anchorKinds: ['region']` only — no text selection is bound
+ * (a raster image has no selectable text), so `lr-text-select` is never emitted by this viewer.
+ *
+ * @customElement lr-image-viewer
+ * @slot - None.
+ * @event lr-load - Image finished loading. `detail: { naturalWidth, naturalHeight }`.
+ * @event lr-zoom-change - `detail: { zoom }`, bubbles from the embedded zoomable-frame.
+ * @event lr-rotation-change - `detail: { rotation }`.
+ * @event lr-fit-change - `detail: { fit }`.
+ * @event lr-highlight-activate - A highlight box was clicked/keyboard-activated. `detail: { id }`.
+ * @event lr-annotation-create - A drawn/keyed region was committed. `detail: { anchor }` (kind
+ *   `'region'`). Never stored by the component — the host appends a `LyraHighlight`.
+ * @event lr-anchor-result - Fired after `anchor` (or a `scrollToAnchor()` call) is applied.
+ *   `detail: { found }`.
+ * @event lr-render-error - The image failed to load. `detail: { error }`.
+ * @csspart base - The root wrapper.
+ * @csspart toolbar - The fit/rotate/annotate controls row.
+ * @csspart fit-control - The fit-mode select.
+ * @csspart rotate-button - The rotate-90-clockwise button.
+ * @csspart annotate-toggle - The annotation-mode toggle button.
+ * @csspart frame - The embedded `lr-zoomable-frame`.
+ * @csspart image-wrapper - The rotated wrapper around the image and its overlays.
+ * @csspart image - The `<img>` element.
+ * @csspart highlight-layer - The overlay hosting highlight boxes.
+ * @csspart highlight - One highlight box (`data-tone`, `data-active`).
+ * @csspart highlight-label - A highlight's visible label.
+ * @csspart annotation-box - The in-progress draft rectangle.
+ * @csspart error - The error region.
+ */
+export declare class LyraImageViewer extends LyraImageViewer_base {
+    static styles: import("lit").CSSResultGroup[];
+    /** Image URL; validated with `safeMediaSrc` before it ever reaches the `<img>`. */
+    src: string;
+    /** Accessible name of `[part="base"]`; a host `aria-label` wins, then the localized
+     *  `imageViewerLabel` fallback. */
+    name: string;
+    /** Image alt text. Unset falls back to `name`; explicitly `""` marks the image decorative. */
+    alt?: string;
+    /** Base scale at `zoom = 1`: `contain` fits the whole image in the frame, `width` fills the
+     *  frame's inline size, `actual` shows the image at its natural pixel dimensions. */
+    fit: ImageFit;
+    /** Multiplier over the fit-derived base scale, delegated to the embedded zoomable-frame. */
+    zoom: number;
+    /** Clockwise rotation in 90-degree steps. */
+    rotation: ImageRotation;
+    /** Enables region drawing via pointer or keyboard. */
+    annotatable: boolean;
+    /** From `DocumentAnchorTarget` — only `region` anchors resolve here. */
+    readonly anchorKinds: readonly LyraAnchorKind[];
+    private loadState;
+    private draft;
+    private frameEl?;
+    private liveRegion?;
+    private wrapperEl?;
+    /** `rotation` normalized to one of the four right-angle steps this component actually supports
+     *  (`0`/`90`/`180`/`270`) -- `rotate()`'s own `% 360` step only ever produces one of these four
+     *  values from an already-valid `rotation`, but a directly-assigned `rotation` (attribute or
+     *  property) isn't guaranteed to be: a non-finite/negative/non-multiple-of-90 value would
+     *  otherwise reach the CSS `rotate(${rotation}deg)` transform and
+     *  `screenPercentToImagePercent()`'s right-angle-only coordinate math unnormalized. Rounds to
+     *  the nearest right angle, then wraps into `[0, 360)`. */
+    private get safeRotation();
+    protected willUpdate(changed: PropertyValues): void;
+    protected updated(changed: PropertyValues): void;
+    zoomIn: () => void;
+    zoomOut: () => void;
+    resetZoom: () => void;
+    rotate(): void;
+    protected applyAnchor(anchor: LyraAnchor): Promise<boolean>;
+    private onImgLoad;
+    private onImgError;
+    private onFrameZoomChange;
+    private onHighlightActivate;
+    private toggleAnnotatable;
+    private onFitChange;
+    private announceDraftPosition;
+    private onWrapperKeyDown;
+    private commitDraft;
+    private pointerDraftId;
+    private pointerOrigin;
+    private onWrapperPointerDown;
+    private onWrapperPointerMove;
+    private onWrapperPointerUp;
+    private renderHighlights;
+    private renderDraft;
+    private renderBody;
+    render(): TemplateResult;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'lr-image-viewer': LyraImageViewer;
+    }
+}
+export {};
+//# sourceMappingURL=image-viewer.class.d.ts.map

package/dist/components/media/image-viewer/image-viewer.class.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"image-viewer.class.d.ts","sourceRoot":"","sources":["../../../../src/components/media/image-viewer/image-viewer.class.ts"],"names":[],"mappings":"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"}

package/dist/components/media/image-viewer/image-viewer.class.js

@@ -0,0 +1,389 @@
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+import { html, nothing } from 'lit';
+import { property, query, state } from 'lit/decorators.js';
+import { LyraElement } from '../../../internal/lyra-element.js';
+import { DocumentAnchorTarget } from '../../../internal/anchor-target.js';
+import { safeMediaSrc } from '../../../internal/safe-url.js';
+import { srOnly } from '../../../internal/a11y.js';
+import { finiteNumber } from '../../../internal/numbers.js';
+import '../zoomable-frame/zoomable-frame.js';
+import '../../utility/live-region/live-region.js';
+import { styles } from './image-viewer.styles.js';
+const MIN_REGION_PERCENT = 2;
+const ARROW_STEP_PERCENT = 2;
+function clamp(value, min, max) {
+    return Math.min(max, Math.max(min, value));
+}
+/** Maps a percent-of-on-screen-box pointer position back to the image's natural (unrotated)
+ *  coordinate space. Exact (not an approximation) because `rotation` is constrained to right
+ *  angles: a 90/270 rotation of a rectangle is exactly an axis swap with a sign flip, and 180 is
+ *  exactly a double sign flip. */
+function screenPercentToImagePercent(px, py, rotation) {
+    switch (rotation) {
+        case 90:
+            return { x: py, y: 100 - px };
+        case 180:
+            return { x: 100 - px, y: 100 - py };
+        case 270:
+            return { x: 100 - py, y: px };
+        default:
+            return { x: px, y: py };
+    }
+}
+class LyraImageViewerBase extends LyraElement {
+}
+/**
+ * `<lr-image-viewer>` — full pan/zoom raster-image viewer with labeled region highlights and
+ * opt-in region annotation, the landing surface for `region`-anchored citations. Distinct from
+ * `<lr-svg-viewer>` (rendered SVG documents) and `<lr-image-comparer>` (before/after slotted
+ * surfaces) — this component owns raster grounding/citation display, not comparison or vector
+ * rendering.
+ *
+ * Adopts `DocumentAnchorTarget` with `anchorKinds: ['region']` only — no text selection is bound
+ * (a raster image has no selectable text), so `lr-text-select` is never emitted by this viewer.
+ *
+ * @customElement lr-image-viewer
+ * @slot - None.
+ * @event lr-load - Image finished loading. `detail: { naturalWidth, naturalHeight }`.
+ * @event lr-zoom-change - `detail: { zoom }`, bubbles from the embedded zoomable-frame.
+ * @event lr-rotation-change - `detail: { rotation }`.
+ * @event lr-fit-change - `detail: { fit }`.
+ * @event lr-highlight-activate - A highlight box was clicked/keyboard-activated. `detail: { id }`.
+ * @event lr-annotation-create - A drawn/keyed region was committed. `detail: { anchor }` (kind
+ *   `'region'`). Never stored by the component — the host appends a `LyraHighlight`.
+ * @event lr-anchor-result - Fired after `anchor` (or a `scrollToAnchor()` call) is applied.
+ *   `detail: { found }`.
+ * @event lr-render-error - The image failed to load. `detail: { error }`.
+ * @csspart base - The root wrapper.
+ * @csspart toolbar - The fit/rotate/annotate controls row.
+ * @csspart fit-control - The fit-mode select.
+ * @csspart rotate-button - The rotate-90-clockwise button.
+ * @csspart annotate-toggle - The annotation-mode toggle button.
+ * @csspart frame - The embedded `lr-zoomable-frame`.
+ * @csspart image-wrapper - The rotated wrapper around the image and its overlays.
+ * @csspart image - The `<img>` element.
+ * @csspart highlight-layer - The overlay hosting highlight boxes.
+ * @csspart highlight - One highlight box (`data-tone`, `data-active`).
+ * @csspart highlight-label - A highlight's visible label.
+ * @csspart annotation-box - The in-progress draft rectangle.
+ * @csspart error - The error region.
+ */
+export class LyraImageViewer extends DocumentAnchorTarget(LyraImageViewerBase) {
+    constructor() {
+        super(...arguments);
+        /** Image URL; validated with `safeMediaSrc` before it ever reaches the `<img>`. */
+        this.src = '';
+        /** Accessible name of `[part="base"]`; a host `aria-label` wins, then the localized
+         *  `imageViewerLabel` fallback. */
+        this.name = '';
+        /** Base scale at `zoom = 1`: `contain` fits the whole image in the frame, `width` fills the
+         *  frame's inline size, `actual` shows the image at its natural pixel dimensions. */
+        this.fit = 'contain';
+        /** Multiplier over the fit-derived base scale, delegated to the embedded zoomable-frame. */
+        // numeric-guard-exempt: pure pass-through to <lr-zoomable-frame>, which already normalizes it via its own safeZoom
+        this.zoom = 1;
+        /** Clockwise rotation in 90-degree steps. */
+        this.rotation = 0;
+        /** Enables region drawing via pointer or keyboard. */
+        this.annotatable = false;
+        /** From `DocumentAnchorTarget` — only `region` anchors resolve here. */
+        this.anchorKinds = ['region'];
+        this.loadState = { kind: 'idle' };
+        this.draft = null;
+        this.zoomIn = () => this.frameEl?.zoomIn();
+        this.zoomOut = () => this.frameEl?.zoomOut();
+        this.resetZoom = () => this.frameEl?.resetZoom();
+        this.onImgLoad = (event) => {
+            const img = event.target;
+            this.loadState = { kind: 'loaded' };
+            this.emit('lr-load', { naturalWidth: img.naturalWidth, naturalHeight: img.naturalHeight });
+        };
+        this.onImgError = () => {
+            this.loadState = { kind: 'error' };
+            this.emit('lr-render-error', { error: new Error('The image failed to load.') });
+        };
+        this.onFrameZoomChange = (event) => {
+            this.zoom = event.detail.zoom;
+        };
+        this.toggleAnnotatable = () => {
+            this.annotatable = !this.annotatable;
+        };
+        this.onFitChange = (event) => {
+            this.fit = event.target.value;
+        };
+        this.onWrapperKeyDown = (event) => {
+            if (!this.annotatable)
+                return;
+            if (!this.draft) {
+                if (event.key === 'Enter') {
+                    event.preventDefault();
+                    this.draft = { x: 37.5, y: 37.5, width: 25, height: 25 };
+                    this.announceDraftPosition();
+                }
+                return;
+            }
+            // Arrow movement here is deliberately physical (x/y), not reading-order: the annotation is a
+            // 2-D spatial box over image content, and "left" always means toward smaller x regardless of
+            // text direction.
+            switch (event.key) {
+                // policy-allow(rtl-arrow-keys): moves a 2-D spatial annotation box over image pixels; see above.
+                case 'ArrowLeft':
+                    event.preventDefault();
+                    if (event.shiftKey)
+                        this.draft = { ...this.draft, width: clamp(this.draft.width - ARROW_STEP_PERCENT, MIN_REGION_PERCENT, 100 - this.draft.x) };
+                    else
+                        this.draft = { ...this.draft, x: clamp(this.draft.x - ARROW_STEP_PERCENT, 0, 100 - this.draft.width) };
+                    break;
+                case 'ArrowRight':
+                    event.preventDefault();
+                    if (event.shiftKey)
+                        this.draft = { ...this.draft, width: clamp(this.draft.width + ARROW_STEP_PERCENT, MIN_REGION_PERCENT, 100 - this.draft.x) };
+                    else
+                        this.draft = { ...this.draft, x: clamp(this.draft.x + ARROW_STEP_PERCENT, 0, 100 - this.draft.width) };
+                    break;
+                case 'ArrowUp':
+                    event.preventDefault();
+                    if (event.shiftKey)
+                        this.draft = { ...this.draft, height: clamp(this.draft.height - ARROW_STEP_PERCENT, MIN_REGION_PERCENT, 100 - this.draft.y) };
+                    else
+                        this.draft = { ...this.draft, y: clamp(this.draft.y - ARROW_STEP_PERCENT, 0, 100 - this.draft.height) };
+                    break;
+                case 'ArrowDown':
+                    event.preventDefault();
+                    if (event.shiftKey)
+                        this.draft = { ...this.draft, height: clamp(this.draft.height + ARROW_STEP_PERCENT, MIN_REGION_PERCENT, 100 - this.draft.y) };
+                    else
+                        this.draft = { ...this.draft, y: clamp(this.draft.y + ARROW_STEP_PERCENT, 0, 100 - this.draft.height) };
+                    break;
+                case 'Enter':
+                    event.preventDefault();
+                    this.commitDraft();
+                    return;
+                case 'Escape':
+                    event.preventDefault();
+                    this.draft = null;
+                    this.liveRegion?.announce(this.localize('imageViewerAnnotationCancelled'), { force: true });
+                    return;
+                default:
+                    return;
+            }
+            this.announceDraftPosition();
+        };
+        this.pointerDraftId = null;
+        this.pointerOrigin = null;
+        this.onWrapperPointerDown = (event) => {
+            if (!this.annotatable || !this.wrapperEl)
+                return;
+            const rect = this.wrapperEl.getBoundingClientRect();
+            const px = clamp(((event.clientX - rect.left) / rect.width) * 100, 0, 100);
+            const py = clamp(((event.clientY - rect.top) / rect.height) * 100, 0, 100);
+            const origin = screenPercentToImagePercent(px, py, this.safeRotation);
+            this.pointerOrigin = origin;
+            this.pointerDraftId = event.pointerId;
+            this.wrapperEl.setPointerCapture(event.pointerId);
+            this.draft = { x: origin.x, y: origin.y, width: 0, height: 0 };
+            event.preventDefault();
+        };
+        this.onWrapperPointerMove = (event) => {
+            if (this.pointerDraftId !== event.pointerId || !this.pointerOrigin || !this.wrapperEl)
+                return;
+            const rect = this.wrapperEl.getBoundingClientRect();
+            const px = clamp(((event.clientX - rect.left) / rect.width) * 100, 0, 100);
+            const py = clamp(((event.clientY - rect.top) / rect.height) * 100, 0, 100);
+            const point = screenPercentToImagePercent(px, py, this.safeRotation);
+            const x = Math.min(this.pointerOrigin.x, point.x);
+            const y = Math.min(this.pointerOrigin.y, point.y);
+            const width = Math.abs(point.x - this.pointerOrigin.x);
+            const height = Math.abs(point.y - this.pointerOrigin.y);
+            this.draft = { x, y, width, height };
+        };
+        this.onWrapperPointerUp = (event) => {
+            if (this.pointerDraftId !== event.pointerId)
+                return;
+            this.pointerDraftId = null;
+            this.pointerOrigin = null;
+            if (this.draft && this.draft.width >= MIN_REGION_PERCENT && this.draft.height >= MIN_REGION_PERCENT) {
+                this.commitDraft();
+            }
+            else {
+                this.draft = null;
+            }
+        };
+    }
+    static { this.styles = [LyraElement.styles, styles, srOnly]; }
+    /** `rotation` normalized to one of the four right-angle steps this component actually supports
+     *  (`0`/`90`/`180`/`270`) -- `rotate()`'s own `% 360` step only ever produces one of these four
+     *  values from an already-valid `rotation`, but a directly-assigned `rotation` (attribute or
+     *  property) isn't guaranteed to be: a non-finite/negative/non-multiple-of-90 value would
+     *  otherwise reach the CSS `rotate(${rotation}deg)` transform and
+     *  `screenPercentToImagePercent()`'s right-angle-only coordinate math unnormalized. Rounds to
+     *  the nearest right angle, then wraps into `[0, 360)`. */
+    get safeRotation() {
+        const degrees = finiteNumber(this.rotation, 0);
+        const steps = Math.round(degrees / 90);
+        return ((((steps % 4) + 4) % 4) * 90);
+    }
+    willUpdate(changed) {
+        super.willUpdate(changed); // reaches DocumentAnchorTarget's own willUpdate (declarative `anchor`)
+        if (changed.has('src')) {
+            this.loadState = this.src && safeMediaSrc(this.src) ? { kind: 'loading' } : this.src ? { kind: 'error' } : { kind: 'idle' };
+            this.draft = null;
+        }
+    }
+    updated(changed) {
+        super.updated(changed);
+        if (changed.has('rotation') && changed.get('rotation') !== undefined)
+            this.emit('lr-rotation-change', { rotation: this.safeRotation });
+        if (changed.has('fit') && changed.get('fit') !== undefined)
+            this.emit('lr-fit-change', { fit: this.fit });
+        if (changed.has('annotatable') && this.annotatable && changed.get('annotatable') !== undefined) {
+            this.liveRegion?.announce(this.localize('imageViewerAnnotationHint'), { force: true });
+        }
+    }
+    rotate() {
+        this.rotation = ((this.safeRotation + 90) % 360);
+    }
+    async applyAnchor(anchor) {
+        // Percent-rect geometry needs no scroll math -- the whole image is already laid out inside
+        // the embedded zoomable-frame's viewport. `scrollToAnchor()` (in the mixin) sets
+        // `activeHighlightId` for an id-form anchor once this resolves `true`, and `renderHighlights()`
+        // reflects that through the `[data-active]` highlight styling.
+        return anchor.kind === 'region' && this.loadState.kind === 'loaded';
+    }
+    onHighlightActivate(id) {
+        this.activeHighlightId = id;
+        this.emit('lr-highlight-activate', { id });
+    }
+    announceDraftPosition() {
+        if (!this.draft)
+            return;
+        this.liveRegion?.announce(this.localize('imageViewerAnnotationBoxPosition', undefined, {
+            x: Math.round(this.draft.x),
+            y: Math.round(this.draft.y),
+            width: Math.round(this.draft.width),
+            height: Math.round(this.draft.height),
+        }));
+    }
+    commitDraft() {
+        if (!this.draft)
+            return;
+        const rect = { x: this.draft.x, y: this.draft.y, width: this.draft.width, height: this.draft.height };
+        this.draft = null;
+        this.emit('lr-annotation-create', { anchor: { kind: 'region', rect } });
+        this.liveRegion?.announce(this.localize('imageViewerAnnotationAdded'), { force: true });
+    }
+    renderHighlights() {
+        const regionHighlights = this.highlights.filter((h) => h.anchor.kind === 'region');
+        if (!regionHighlights.length)
+            return nothing;
+        // Region rects are physical percent-of-image coordinates and the raster underneath never
+        // mirrors, so position with physical left/top -- logical inset-inline-start would flip the
+        // overlay under RTL while the image stays put. This also keeps the boxes consistent with the
+        // pointer math (clientX - rect.left) and the physical-arrow keyboard model above.
+        return html `<div part="highlight-layer" role="group" aria-label=${this.localize('imageViewerHighlightsLabel')}>
+      ${regionHighlights.map((h, index) => html `
+        <button
+          part="highlight"
+          type="button"
+          data-tone=${h.tone ?? 'accent'}
+          ?data-active=${this.activeHighlightId === h.id}
+          style="left:${h.anchor.rect.x}%;top:${h.anchor.rect.y}%;width:${h.anchor.rect.width}%;height:${h.anchor.rect.height}%"
+          aria-label=${h.label || this.localize('imageViewerUnlabeledHighlight', undefined, { index: index + 1 })}
+          @click=${() => this.onHighlightActivate(h.id)}
+        >${h.label ? html `<span part="highlight-label">${h.label}</span>` : nothing}</button>
+      `)}
+    </div>`;
+    }
+    renderDraft() {
+        if (!this.draft)
+            return nothing;
+        // Physical left/top for the same reason as renderHighlights(): the draft's x/y come from
+        // physical pointer/arrow-key math over a non-mirroring raster.
+        return html `<div part="annotation-box" style="left:${this.draft.x}%;top:${this.draft.y}%;width:${this.draft.width}%;height:${this.draft.height}%"></div>`;
+    }
+    renderBody() {
+        if (this.loadState.kind === 'error') {
+            return html `<div part="error" role="alert">${this.localize('imageViewerFailedToLoad')}</div>`;
+        }
+        if (this.loadState.kind === 'idle') {
+            return html `<p class="empty-note">${this.localize('documentPreviewEmpty', undefined, { type: this.localize('documentPreviewTypeImage') })}</p>`;
+        }
+        const safeSrc = safeMediaSrc(this.src);
+        return html `<lr-zoomable-frame part="frame" exportparts="viewport,content,controls" .zoom=${this.zoom} @lr-zoom-change=${this.onFrameZoomChange}>
+      <div
+        part="image-wrapper"
+        tabindex=${this.annotatable ? '0' : '-1'}
+        style="transform:rotate(${this.safeRotation}deg)"
+        @keydown=${this.onWrapperKeyDown}
+        @pointerdown=${this.onWrapperPointerDown}
+        @pointermove=${this.onWrapperPointerMove}
+        @pointerup=${this.onWrapperPointerUp}
+      >
+        ${safeSrc
+            ? html `<img part="image" data-fit=${this.fit} src=${safeSrc} alt=${this.alt ?? this.name} @load=${this.onImgLoad} @error=${this.onImgError} />`
+            : nothing}
+        ${this.renderHighlights()}
+        ${this.renderDraft()}
+      </div>
+    </lr-zoomable-frame>`;
+    }
+    render() {
+        const label = this.getAttribute('aria-label') || this.name || this.localize('imageViewerLabel');
+        return html `<div part="base" aria-label=${label}>
+      <div part="toolbar">
+        <select part="fit-control" aria-label=${this.localize('imageViewerFitLabel')} @change=${this.onFitChange}>
+          <option value="contain" ?selected=${this.fit === 'contain'}>${this.localize('imageViewerFitContain')}</option>
+          <option value="width" ?selected=${this.fit === 'width'}>${this.localize('imageViewerFitWidth')}</option>
+          <option value="actual" ?selected=${this.fit === 'actual'}>${this.localize('imageViewerFitActual')}</option>
+        </select>
+        <button part="rotate-button" type="button" aria-label=${this.localize('imageViewerRotate')} @click=${() => this.rotate()}>&#8635;</button>
+        <button part="annotate-toggle" type="button" aria-pressed=${this.annotatable ? 'true' : 'false'} aria-label=${this.localize('imageViewerAnnotate')} @click=${this.toggleAnnotatable}>&#9633;</button>
+      </div>
+      ${this.renderBody()}
+      <lr-live-region></lr-live-region>
+      ${this.renderAnchorLiveRegion()}
+    </div>`;
+    }
+}
+__decorate([
+    property()
+], LyraImageViewer.prototype, "src", void 0);
+__decorate([
+    property()
+], LyraImageViewer.prototype, "name", void 0);
+__decorate([
+    property()
+], LyraImageViewer.prototype, "alt", void 0);
+__decorate([
+    property({ reflect: true })
+], LyraImageViewer.prototype, "fit", void 0);
+__decorate([
+    property({ type: Number, reflect: true })
+], LyraImageViewer.prototype, "zoom", void 0);
+__decorate([
+    property({ type: Number, reflect: true })
+], LyraImageViewer.prototype, "rotation", void 0);
+__decorate([
+    property({ type: Boolean, reflect: true })
+], LyraImageViewer.prototype, "annotatable", void 0);
+__decorate([
+    state()
+], LyraImageViewer.prototype, "loadState", void 0);
+__decorate([
+    state()
+], LyraImageViewer.prototype, "draft", void 0);
+__decorate([
+    query('lr-zoomable-frame')
+], LyraImageViewer.prototype, "frameEl", void 0);
+__decorate([
+    query('lr-live-region')
+], LyraImageViewer.prototype, "liveRegion", void 0);
+__decorate([
+    query('[part="image-wrapper"]')
+], LyraImageViewer.prototype, "wrapperEl", void 0);
+//# sourceMappingURL=image-viewer.class.js.map

package/dist/components/media/image-viewer/image-viewer.class.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"image-viewer.class.js","sourceRoot":"","sources":["../../../../src/components/media/image-viewer/image-viewer.class.ts"],"names":[],"mappings":"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"}

package/dist/components/media/image-viewer/image-viewer.d.ts

@@ -0,0 +1,4 @@
+export * from './image-viewer.class.js';
+import '../zoomable-frame/zoomable-frame.js';
+import '../../utility/live-region/live-region.js';
+//# sourceMappingURL=image-viewer.d.ts.map

package/dist/components/media/image-viewer/image-viewer.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"image-viewer.d.ts","sourceRoot":"","sources":["../../../../src/components/media/image-viewer/image-viewer.ts"],"names":[],"mappings":"AAAA,cAAc,yBAAyB,CAAC;AAKxC,OAAO,qCAAqC,CAAC;AAC7C,OAAO,0CAA0C,CAAC"}

package/dist/components/media/image-viewer/image-viewer.js

@@ -0,0 +1,25 @@
+export * from './image-viewer.class.js';
+import { html } from 'lit';
+import { LyraImageViewer } from './image-viewer.class.js';
+import { defineElement } from '../../../internal/prefix.js';
+import { registerDocumentRenderer } from '../../viewers/document-viewer/registry.js';
+import '../zoomable-frame/zoomable-frame.js';
+import '../../utility/live-region/live-region.js';
+defineElement('image-viewer', LyraImageViewer);
+const IMAGE_MIME_TYPES = ['image/png', 'image/jpeg', 'image/webp', 'image/gif', 'image/avif', 'image/bmp'];
+const IMAGE_EXTENSIONS = ['.png', '.jpg', '.jpeg', '.webp', '.gif', '.avif', '.bmp'];
+const imageRendererDef = {
+    matches: (file) => (file.mimeType.startsWith('image/') && file.mimeType !== 'image/svg+xml') ||
+        IMAGE_EXTENSIONS.some((ext) => file.name.toLowerCase().endsWith(ext)),
+    capabilities: { anchors: ['region'] },
+    render: (file) => html `<lr-image-viewer
+    src=${file.src}
+    name=${file.name}
+    alt=${file.alt ?? file.name}
+    .anchor=${file.anchor ?? null}
+    .highlights=${file.highlights ?? []}
+  ></lr-image-viewer>`,
+};
+for (const mime of IMAGE_MIME_TYPES)
+    registerDocumentRenderer(mime, imageRendererDef);
+//# sourceMappingURL=image-viewer.js.map

package/dist/components/media/image-viewer/image-viewer.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"image-viewer.js","sourceRoot":"","sources":["../../../../src/components/media/image-viewer/image-viewer.ts"],"names":[],"mappings":"AAAA,cAAc,yBAAyB,CAAC;AACxC,OAAO,EAAE,IAAI,EAAE,MAAM,KAAK,CAAC;AAC3B,OAAO,EAAE,eAAe,EAAE,MAAM,yBAAyB,CAAC;AAC1D,OAAO,EAAE,aAAa,EAAE,MAAM,6BAA6B,CAAC;AAC5D,OAAO,EAAE,wBAAwB,EAAsD,MAAM,2CAA2C,CAAC;AACzI,OAAO,qCAAqC,CAAC;AAC7C,OAAO,0CAA0C,CAAC;AAElD,aAAa,CAAC,cAAc,EAAE,eAAe,CAAC,CAAC;AAE/C,MAAM,gBAAgB,GAAG,CAAC,WAAW,EAAE,YAAY,EAAE,YAAY,EAAE,WAAW,EAAE,YAAY,EAAE,WAAW,CAAC,CAAC;AAC3G,MAAM,gBAAgB,GAAG,CAAC,MAAM,EAAE,MAAM,EAAE,OAAO,EAAE,OAAO,EAAE,MAAM,EAAE,OAAO,EAAE,MAAM,CAAC,CAAC;AAErF,MAAM,gBAAgB,GAA+B;IACnD,OAAO,EAAE,CAAC,IAAkB,EAAE,EAAE,CAC9B,CAAC,IAAI,CAAC,QAAQ,CAAC,UAAU,CAAC,QAAQ,CAAC,IAAI,IAAI,CAAC,QAAQ,KAAK,eAAe,CAAC;QACzE,gBAAgB,CAAC,IAAI,CAAC,CAAC,GAAG,EAAE,EAAE,CAAC,IAAI,CAAC,IAAI,CAAC,WAAW,EAAE,CAAC,QAAQ,CAAC,GAAG,CAAC,CAAC;IACvE,YAAY,EAAE,EAAE,OAAO,EAAE,CAAC,QAAQ,CAAC,EAAE;IACrC,MAAM,EAAE,CAAC,IAAkB,EAAE,EAAE,CAAC,IAAI,CAAA;UAC5B,IAAI,CAAC,GAAG;WACP,IAAI,CAAC,IAAI;UACV,IAAI,CAAC,GAAG,IAAI,IAAI,CAAC,IAAI;cACjB,IAAI,CAAC,MAAM,IAAI,IAAI;kBACf,IAAI,CAAC,UAAU,IAAI,EAAE;sBACjB;CACrB,CAAC;AAEF,KAAK,MAAM,IAAI,IAAI,gBAAgB;IAAE,wBAAwB,CAAC,IAAI,EAAE,gBAAgB,CAAC,CAAC"}

package/dist/components/media/image-viewer/image-viewer.styles.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"image-viewer.styles.d.ts","sourceRoot":"","sources":["../../../../src/components/media/image-viewer/image-viewer.styles.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,MAAM,yBA2HlB,CAAC"}

package/dist/components/media/image-viewer/image-viewer.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"image-viewer.styles.js","sourceRoot":"","sources":["../../../../src/components/media/image-viewer/image-viewer.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA2HxB,CAAC"}