zkit-ui 2.0.4 → 2.0.6

package/dist/ui/NativeImagePreview/web/geometry.js

@@ -0,0 +1,121 @@
+"use strict";
+/// <reference lib="dom" />
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.rectFromDOMRect = rectFromDOMRect;
+exports.rectFromElement = rectFromElement;
+exports.viewportRect = viewportRect;
+exports.normalizeRect = normalizeRect;
+exports.isUsableRect = isUsableRect;
+exports.clamp = clamp;
+exports.fitRect = fitRect;
+exports.sharedGeometryFor = sharedGeometryFor;
+exports.targetGeometryFor = targetGeometryFor;
+exports.intersectRects = intersectRects;
+exports.lerp = lerp;
+exports.lerpRect = lerpRect;
+exports.easeOutCubic = easeOutCubic;
+exports.easeOutQuart = easeOutQuart;
+function rectFromDOMRect(rect) {
+    return normalizeRect({
+        left: rect.left,
+        top: rect.top,
+        width: rect.width,
+        height: rect.height,
+    });
+}
+function rectFromElement(element) {
+    return rectFromDOMRect(element.getBoundingClientRect());
+}
+function viewportRect() {
+    return normalizeRect({
+        left: 0,
+        top: 0,
+        width: window.innerWidth,
+        height: window.innerHeight,
+    });
+}
+function normalizeRect(input) {
+    return {
+        left: input.left,
+        top: input.top,
+        width: input.width,
+        height: input.height,
+        right: input.left + input.width,
+        bottom: input.top + input.height,
+    };
+}
+function isUsableRect(rect) {
+    return !!rect && rect.width > 1 && rect.height > 1;
+}
+function clamp(value, min, max) {
+    return Math.max(min, Math.min(max, value));
+}
+function fitRect(mediaSize, container, objectFit) {
+    if (objectFit === 'fill') {
+        return normalizeRect(container);
+    }
+    const widthScale = container.width / Math.max(1, mediaSize.width);
+    const heightScale = container.height / Math.max(1, mediaSize.height);
+    const scale = objectFit === 'cover'
+        ? Math.max(widthScale, heightScale)
+        : Math.min(widthScale, heightScale);
+    const width = mediaSize.width * scale;
+    const height = mediaSize.height * scale;
+    return normalizeRect({
+        left: container.left + (container.width - width) / 2,
+        top: container.top + (container.height - height) / 2,
+        width,
+        height,
+    });
+}
+function sharedGeometryFor(container, mediaSize, objectFit) {
+    var _a;
+    const contentFrameInWindow = fitRect(mediaSize, container, objectFit);
+    const visibleFrame = (_a = intersectRects(container, contentFrameInWindow)) !== null && _a !== void 0 ? _a : normalizeRect(container);
+    const contentFrame = normalizeRect({
+        left: contentFrameInWindow.left - visibleFrame.left,
+        top: contentFrameInWindow.top - visibleFrame.top,
+        width: contentFrameInWindow.width,
+        height: contentFrameInWindow.height,
+    });
+    return { visibleFrame, contentFrame };
+}
+function targetGeometryFor(mediaSize, container) {
+    const visibleFrame = fitRect(mediaSize, container, 'contain');
+    return {
+        visibleFrame,
+        contentFrame: normalizeRect({
+            left: 0,
+            top: 0,
+            width: visibleFrame.width,
+            height: visibleFrame.height,
+        }),
+    };
+}
+function intersectRects(first, second) {
+    const left = Math.max(first.left, second.left);
+    const top = Math.max(first.top, second.top);
+    const right = Math.min(first.right, second.right);
+    const bottom = Math.min(first.bottom, second.bottom);
+    if (right <= left || bottom <= top) {
+        return null;
+    }
+    return normalizeRect({ left, top, width: right - left, height: bottom - top });
+}
+function lerp(start, end, progress) {
+    return start + (end - start) * progress;
+}
+function lerpRect(start, end, progress) {
+    return normalizeRect({
+        left: lerp(start.left, end.left, progress),
+        top: lerp(start.top, end.top, progress),
+        width: lerp(start.width, end.width, progress),
+        height: lerp(start.height, end.height, progress),
+    });
+}
+function easeOutCubic(t) {
+    return 1 - Math.pow(1 - t, 3);
+}
+function easeOutQuart(t) {
+    return 1 - Math.pow(1 - t, 4);
+}

package/dist/ui/NativeImagePreview/web/media.d.ts

@@ -0,0 +1,6 @@
+import type { NativeImagePreviewWebImageSize, NativeImagePreviewWebMediaItem, NativeImagePreviewWebResolvedItem } from './types';
+export declare function normalizeItems(items: readonly NativeImagePreviewWebMediaItem[]): NativeImagePreviewWebResolvedItem[];
+export declare function previewSourceFor(item: NativeImagePreviewWebResolvedItem): string;
+export declare function resolveMediaSize(item: NativeImagePreviewWebResolvedItem, fallback?: NativeImagePreviewWebImageSize | null): Promise<NativeImagePreviewWebImageSize>;
+export declare function waitForElementImage(element: Element | null | undefined): Promise<void>;
+//# sourceMappingURL=media.d.ts.map

package/dist/ui/NativeImagePreview/web/media.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"media.d.ts","sourceRoot":"","sources":["../../../../src/ui/NativeImagePreview/web/media.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,8BAA8B,EAAE,8BAA8B,EAAkC,iCAAiC,EAAE,MAAM,SAAS,CAAC;AAEjK,wBAAgB,cAAc,CAAC,KAAK,EAAE,SAAS,8BAA8B,EAAE,GAAG,iCAAiC,EAAE,CAoBpH;AAED,wBAAgB,gBAAgB,CAAC,IAAI,EAAE,iCAAiC,GAAG,MAAM,CAEhF;AAED,wBAAsB,gBAAgB,CACpC,IAAI,EAAE,iCAAiC,EACvC,QAAQ,CAAC,EAAE,8BAA8B,GAAG,IAAI,GAC/C,OAAO,CAAC,8BAA8B,CAAC,CAgBzC;AAED,wBAAgB,mBAAmB,CAAC,OAAO,EAAE,OAAO,GAAG,IAAI,GAAG,SAAS,GAAG,OAAO,CAAC,IAAI,CAAC,CAgBtF"}

package/dist/ui/NativeImagePreview/web/media.js

@@ -0,0 +1,90 @@
+"use strict";
+/// <reference lib="dom" />
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.normalizeItems = normalizeItems;
+exports.previewSourceFor = previewSourceFor;
+exports.resolveMediaSize = resolveMediaSize;
+exports.waitForElementImage = waitForElementImage;
+function normalizeItems(items) {
+    return items
+        .map((item, index) => {
+        var _a, _b, _c, _d;
+        const src = (_b = (_a = item.src) !== null && _a !== void 0 ? _a : item.url) !== null && _b !== void 0 ? _b : '';
+        if (!src.trim()) {
+            return null;
+        }
+        const type = resolveType(item);
+        return {
+            id: (_c = item.id) !== null && _c !== void 0 ? _c : String(index),
+            type,
+            src,
+            poster: item.poster,
+            width: item.width,
+            height: item.height,
+            alt: (_d = item.alt) !== null && _d !== void 0 ? _d : `Image ${index + 1}`,
+            raw: item,
+        };
+    })
+        .filter((item) => item !== null);
+}
+function previewSourceFor(item) {
+    var _a;
+    return item.type === 'video' ? (_a = item.poster) !== null && _a !== void 0 ? _a : item.src : item.src;
+}
+async function resolveMediaSize(item, fallback) {
+    if (fallback && fallback.width > 0 && fallback.height > 0) {
+        return fallback;
+    }
+    if (item.width && item.height) {
+        return { width: item.width, height: item.height };
+    }
+    const previewSource = previewSourceFor(item);
+    if (!previewSource) {
+        return { width: 1, height: 1 };
+    }
+    try {
+        return await loadImageSize(previewSource);
+    }
+    catch {
+        return { width: 1, height: 1 };
+    }
+}
+function waitForElementImage(element) {
+    if (!(element instanceof HTMLImageElement)) {
+        return Promise.resolve();
+    }
+    if (element.complete && element.naturalWidth > 0) {
+        return Promise.resolve();
+    }
+    return new Promise((resolve) => {
+        const done = () => {
+            element.removeEventListener('load', done);
+            element.removeEventListener('error', done);
+            resolve();
+        };
+        element.addEventListener('load', done, { once: true });
+        element.addEventListener('error', done, { once: true });
+    });
+}
+function resolveType(item) {
+    var _a, _b;
+    if (item.type === 'video') {
+        return 'video';
+    }
+    const src = (_b = (_a = item.src) !== null && _a !== void 0 ? _a : item.url) !== null && _b !== void 0 ? _b : '';
+    return /\.(mp4|webm|ogg)(\?.*)?$/i.test(src) ? 'video' : 'image';
+}
+function loadImageSize(src) {
+    return new Promise((resolve, reject) => {
+        const image = new Image();
+        image.decoding = 'async';
+        image.onload = () => {
+            resolve({
+                width: image.naturalWidth || image.width || 1,
+                height: image.naturalHeight || image.height || 1,
+            });
+        };
+        image.onerror = () => reject(new Error(`Unable to load image: ${src}`));
+        image.src = src;
+    });
+}

package/dist/ui/NativeImagePreview/web/styles.css

@@ -0,0 +1,137 @@
+.native-image-preview-root {
+  position: fixed;
+  top: 0;
+  left: 0;
+  z-index: 2147483000;
+  width: var(--native-image-preview-vw, 100vw);
+  height: var(--native-image-preview-vh, 100vh);
+  overflow: hidden;
+  color: #fff;
+  contain: layout size paint;
+  overscroll-behavior: none;
+  touch-action: none;
+  user-select: none;
+}
+
+.native-image-preview-backdrop {
+  position: absolute;
+  inset: 0;
+  background: #000;
+  will-change: opacity;
+}
+
+.native-image-preview-theme-light .native-image-preview-backdrop {
+  background: #fff;
+}
+
+.native-image-preview-viewport {
+  position: absolute;
+  inset: 0;
+  z-index: 1;
+  overflow: hidden;
+}
+
+.native-image-preview-track {
+  position: absolute;
+  top: 0;
+  left: 0;
+  display: flex;
+  width: var(--native-image-preview-vw, 100vw);
+  height: var(--native-image-preview-vh, 100vh);
+  will-change: transform, opacity;
+}
+
+.native-image-preview-slide {
+  position: relative;
+  display: grid;
+  flex: 0 0 var(--native-image-preview-vw, 100vw);
+  width: var(--native-image-preview-vw, 100vw);
+  height: var(--native-image-preview-vh, 100vh);
+  place-items: center;
+  overflow: hidden;
+}
+
+.native-image-preview-media {
+  display: block;
+  max-width: var(--native-image-preview-vw, 100vw);
+  max-height: var(--native-image-preview-vh, 100vh);
+  object-fit: contain;
+  transform-origin: center center;
+  will-change: transform;
+}
+
+.native-image-preview-image {
+  width: auto;
+  height: auto;
+}
+
+.native-image-preview-video {
+  width: auto;
+  height: auto;
+  background: #000;
+}
+
+.native-image-preview-close {
+  position: fixed;
+  top: max(12px, env(safe-area-inset-top));
+  left: max(12px, env(safe-area-inset-left));
+  z-index: 3;
+  display: grid;
+  width: 42px;
+  height: 42px;
+  padding: 0;
+  border: 0;
+  border-radius: 999px;
+  place-items: center;
+  background: rgba(255, 255, 255, 0.12);
+  color: #fff;
+  cursor: pointer;
+  font-size: 30px;
+  line-height: 1;
+  backdrop-filter: blur(18px);
+}
+
+.native-image-preview-counter {
+  position: fixed;
+  right: max(14px, env(safe-area-inset-right));
+  bottom: max(18px, env(safe-area-inset-bottom));
+  z-index: 3;
+  min-width: 58px;
+  padding: 8px 11px;
+  border-radius: 999px;
+  background: rgba(255, 255, 255, 0.12);
+  color: #fff;
+  font-size: 13px;
+  font-weight: 720;
+  text-align: center;
+  backdrop-filter: blur(18px);
+}
+
+.native-image-preview-fly-shell {
+  position: fixed;
+  top: 0;
+  left: 0;
+  z-index: 2;
+  overflow: hidden;
+  border-radius: 0;
+  pointer-events: none;
+  transform-origin: top left;
+  will-change: transform, width, height;
+}
+
+.native-image-preview-fly-media {
+  position: absolute;
+  top: 0;
+  left: 0;
+  display: block;
+  max-width: none;
+  max-height: none;
+  object-fit: fill;
+  transform-origin: top left;
+  will-change: transform, width, height;
+}
+
+.native-image-preview-fading-out {
+  opacity: 0;
+  transition: opacity 180ms cubic-bezier(0.22, 1, 0.36, 1);
+}

package/dist/ui/NativeImagePreview/web/transition.d.ts

@@ -0,0 +1,15 @@
+import type { NativeImagePreviewWebResolvedItem } from './types';
+import { type SharedElementGeometry } from './geometry';
+type SharedTransitionOptions = {
+    item: NativeImagePreviewWebResolvedItem;
+    from: SharedElementGeometry;
+    to: SharedElementGeometry;
+    duration?: number;
+    parent?: HTMLElement;
+    beforeStart?: () => void | Promise<void>;
+    onProgress?: (progress: number) => void;
+    beforeRemove?: () => void | Promise<void>;
+};
+export declare function animateSharedElement({ item, from, to, duration, parent, beforeStart, onProgress, beforeRemove, }: SharedTransitionOptions): Promise<void>;
+export {};
+//# sourceMappingURL=transition.d.ts.map

package/dist/ui/NativeImagePreview/web/transition.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"transition.d.ts","sourceRoot":"","sources":["../../../../src/ui/NativeImagePreview/web/transition.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,iCAAiC,EAAE,MAAM,SAAS,CAAC;AACjE,OAAO,EAA0B,KAAK,qBAAqB,EAAE,MAAM,YAAY,CAAC;AAGhF,KAAK,uBAAuB,GAAG;IAC7B,IAAI,EAAE,iCAAiC,CAAC;IACxC,IAAI,EAAE,qBAAqB,CAAC;IAC5B,EAAE,EAAE,qBAAqB,CAAC;IAC1B,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,MAAM,CAAC,EAAE,WAAW,CAAC;IACrB,WAAW,CAAC,EAAE,MAAM,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;IACzC,UAAU,CAAC,EAAE,CAAC,QAAQ,EAAE,MAAM,KAAK,IAAI,CAAC;IACxC,YAAY,CAAC,EAAE,MAAM,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;CAC3C,CAAC;AAEF,wBAAsB,oBAAoB,CAAC,EACzC,IAAI,EACJ,IAAI,EACJ,EAAE,EACF,QAAc,EACd,MAAsB,EACtB,WAAW,EACX,UAAU,EACV,YAAY,GACb,EAAE,uBAAuB,GAAG,OAAO,CAAC,IAAI,CAAC,CA6CzC"}

package/dist/ui/NativeImagePreview/web/transition.js

@@ -0,0 +1,77 @@
+"use strict";
+/// <reference lib="dom" />
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.animateSharedElement = animateSharedElement;
+const geometry_1 = require("./geometry");
+const media_1 = require("./media");
+async function animateSharedElement({ item, from, to, duration = 320, parent = document.body, beforeStart, onProgress, beforeRemove, }) {
+    const shell = document.createElement('div');
+    shell.className = 'native-image-preview-fly-shell';
+    shell.style.opacity = '0';
+    const media = document.createElement('img');
+    media.className = 'native-image-preview-fly-media';
+    media.alt = item.alt;
+    media.draggable = false;
+    media.src = (0, media_1.previewSourceFor)(item);
+    shell.append(media);
+    applyGeometry(shell, media, from);
+    parent.append(shell);
+    await waitForFlyMedia(media);
+    shell.style.opacity = '1';
+    await waitFrames(1);
+    await (beforeStart === null || beforeStart === void 0 ? void 0 : beforeStart());
+    const startedAt = performance.now();
+    return new Promise((resolve) => {
+        const render = async (now) => {
+            const raw = Math.min(1, (now - startedAt) / duration);
+            const progress = (0, geometry_1.easeOutCubic)(raw);
+            applyGeometry(shell, media, {
+                visibleFrame: (0, geometry_1.lerpRect)(from.visibleFrame, to.visibleFrame, progress),
+                contentFrame: (0, geometry_1.lerpRect)(from.contentFrame, to.contentFrame, progress),
+            });
+            onProgress === null || onProgress === void 0 ? void 0 : onProgress(progress);
+            if (raw < 1) {
+                requestAnimationFrame(render);
+                return;
+            }
+            await (beforeRemove === null || beforeRemove === void 0 ? void 0 : beforeRemove());
+            await waitFrames(1);
+            requestAnimationFrame(() => {
+                shell.remove();
+                resolve();
+            });
+        };
+        requestAnimationFrame(render);
+    });
+}
+function applyGeometry(shell, media, geometry) {
+    const shellRect = geometry.visibleFrame;
+    const mediaRect = geometry.contentFrame;
+    shell.style.transform = `translate3d(${shellRect.left}px, ${shellRect.top}px, 0)`;
+    shell.style.width = `${shellRect.width}px`;
+    shell.style.height = `${shellRect.height}px`;
+    media.style.transform = `translate3d(${mediaRect.left}px, ${mediaRect.top}px, 0)`;
+    media.style.width = `${mediaRect.width}px`;
+    media.style.height = `${mediaRect.height}px`;
+}
+function waitFrames(count) {
+    return new Promise((resolve) => {
+        const step = (remaining) => {
+            if (remaining <= 0) {
+                resolve();
+                return;
+            }
+            requestAnimationFrame(() => step(remaining - 1));
+        };
+        step(count);
+    });
+}
+function waitForFlyMedia(image) {
+    if (image.complete && image.naturalWidth > 0) {
+        return Promise.resolve();
+    }
+    return Promise.race([
+        image.decode().catch(() => undefined),
+        new Promise((resolve) => window.setTimeout(resolve, 180)),
+    ]);
+}

package/dist/ui/NativeImagePreview/web/types.d.ts

@@ -0,0 +1,74 @@
+export type NativeImagePreviewWebTheme = 'dark' | 'light';
+export type NativeImagePreviewWebMediaType = 'image' | 'video';
+export type NativeImagePreviewWebObjectFit = 'cover' | 'contain' | 'fill';
+export type NativeImagePreviewWebSourceVisibility = 'hidden' | 'visible';
+export type NativeImagePreviewWebCloseReason = 'api' | 'backdrop' | 'button' | 'drag' | 'escape' | 'replace';
+export type NativeImagePreviewWebChangeReason = 'api' | 'swipe';
+export type NativeImagePreviewWebRect = {
+    left: number;
+    top: number;
+    width: number;
+    height: number;
+    right: number;
+    bottom: number;
+};
+export type NativeImagePreviewWebImageSize = {
+    width: number;
+    height: number;
+};
+export type NativeImagePreviewWebMediaItem = {
+    id?: string;
+    type?: NativeImagePreviewWebMediaType;
+    url?: string;
+    src?: string;
+    poster?: string;
+    width?: number;
+    height?: number;
+    alt?: string;
+};
+export type NativeImagePreviewWebResolvedItem = {
+    id: string;
+    type: NativeImagePreviewWebMediaType;
+    src: string;
+    poster?: string;
+    width?: number;
+    height?: number;
+    alt: string;
+    raw: NativeImagePreviewWebMediaItem;
+};
+export type NativeImagePreviewWebChangeMeta = {
+    reason: NativeImagePreviewWebChangeReason;
+    previousIndex: number;
+    index: number;
+    item: NativeImagePreviewWebResolvedItem;
+};
+export type NativeImagePreviewWebCloseMeta = {
+    reason: NativeImagePreviewWebCloseReason;
+    index: number;
+    item: NativeImagePreviewWebResolvedItem | null;
+};
+export type NativeImagePreviewWebOpenOptions = {
+    items: readonly NativeImagePreviewWebMediaItem[];
+    index?: number;
+    sourceElement?: HTMLElement | null;
+    sourceElements?: readonly (HTMLElement | null | undefined)[];
+    getSourceElement?: (index: number, item: NativeImagePreviewWebResolvedItem) => HTMLElement | null | undefined;
+    sourceRect?: NativeImagePreviewWebRect | DOMRectReadOnly | null;
+    sourceImageSize?: NativeImagePreviewWebImageSize | null;
+    objectFit?: NativeImagePreviewWebObjectFit;
+    sourceObjectFit?: NativeImagePreviewWebObjectFit;
+    sourceVisibility?: NativeImagePreviewWebSourceVisibility;
+    theme?: NativeImagePreviewWebTheme;
+    closeButton?: boolean;
+    counter?: boolean;
+    onChange?: (index: number, meta: NativeImagePreviewWebChangeMeta) => void;
+    onClose?: (meta: NativeImagePreviewWebCloseMeta) => void;
+};
+export type NativeImagePreviewWebController = {
+    open: (options: NativeImagePreviewWebOpenOptions) => Promise<void>;
+    close: (reason?: NativeImagePreviewWebCloseReason) => Promise<void>;
+    destroy: () => void;
+    getIndex: () => number;
+    isOpen: () => boolean;
+};
+//# sourceMappingURL=types.d.ts.map

package/dist/ui/NativeImagePreview/web/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/ui/NativeImagePreview/web/types.ts"],"names":[],"mappings":"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"}

package/dist/ui/NativeImagePreview/web/types.js

@@ -0,0 +1,3 @@
+"use strict";
+/// <reference lib="dom" />
+Object.defineProperty(exports, "__esModule", { value: true });

package/dist/ui/NativeImagePreview/web/viewer.d.ts

@@ -0,0 +1,104 @@
+import type { NativeImagePreviewWebCloseReason, NativeImagePreviewWebController, NativeImagePreviewWebOpenOptions, NativeImagePreviewWebRect } from './types';
+export declare class NativeImagePreviewWebViewer implements NativeImagePreviewWebController {
+    private root;
+    private backdrop;
+    private viewport;
+    private track;
+    private closeButton;
+    private counter;
+    private mediaElements;
+    private slideStates;
+    private items;
+    private options;
+    private index;
+    private openState;
+    private closing;
+    private sourceVisibility;
+    private sourceElement;
+    private sourcePreviousVisibility;
+    private pointers;
+    private mode;
+    private downX;
+    private downY;
+    private lastX;
+    private lastY;
+    private downAt;
+    private dragX;
+    private dragY;
+    private pinchStartDistance;
+    private pinchStartScale;
+    private pinchStartTranslateX;
+    private pinchStartTranslateY;
+    private pinchStartCenterX;
+    private pinchStartCenterY;
+    private previousBodyOverflow;
+    private previousHtmlOverflow;
+    private viewportWidth;
+    private viewportHeight;
+    open(options: NativeImagePreviewWebOpenOptions): Promise<void>;
+    close(reason?: NativeImagePreviewWebCloseReason): Promise<void>;
+    destroy(): void;
+    getIndex(): number;
+    isOpen(): boolean;
+    private mount;
+    private createMediaElement;
+    private performOpenTransition;
+    private performCloseTransition;
+    private resolveBackdropCloseStartOpacity;
+    private showContent;
+    private showControls;
+    private hideControls;
+    private finishClose;
+    private unmount;
+    private captureViewportSize;
+    private applyViewportStyle;
+    private viewportRect;
+    private resolveSourceGeometry;
+    private resolveReturnGeometry;
+    private resolveTargetGeometry;
+    private resolveCurrentMediaGeometry;
+    private resolveSharedMediaSize;
+    private resolveSourceObjectFit;
+    private resolveSourceElement;
+    private hideSourceElement;
+    private restoreSourceElement;
+    private syncHiddenSourceElement;
+    private handlePointerDown;
+    private shouldIgnorePointerStart;
+    private isPointerInVideoControls;
+    private handlePointerMove;
+    private handlePointerUp;
+    private handleWheel;
+    private handleRootClick;
+    private handleCloseClick;
+    private handleKeyDown;
+    private handleResize;
+    private handleWindowBlur;
+    private handleVisibilityChange;
+    private handleLostPointerCapture;
+    private handleTap;
+    private preparePinchIfNeeded;
+    private applyPinch;
+    private finishSwipe;
+    private goTo;
+    private resetDismissDrag;
+    private applyDismissDrag;
+    private cancelActiveGesture;
+    private releasePointerCaptures;
+    private updateTrack;
+    private applyActiveMediaTransform;
+    private clampActiveState;
+    private activeState;
+    private resetSlideState;
+    private createSlideState;
+    private updateCounter;
+    private pauseInactiveVideos;
+    private layoutMediaElements;
+    private lockDocumentScroll;
+    private unlockDocumentScroll;
+    private nextFrame;
+    private delay;
+}
+export declare function createNativeImagePreviewWeb(): NativeImagePreviewWebController;
+export declare function sourceRectFromElement(element: HTMLElement): NativeImagePreviewWebRect;
+//# sourceMappingURL=viewer.d.ts.map

package/dist/ui/NativeImagePreview/web/viewer.d.ts.map

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