capacitor-camera-multicapture 0.12.2

package/dist/esm/ui/image-editor.js

@@ -0,0 +1,103 @@
+import { Activator, MarkerArea } from 'markerjs2';
+const EDITOR_STYLES_ID = 'cmmc-image-editor-styles';
+let editorOpen = false;
+function ensureEditorStyles() {
+    if (document.getElementById(EDITOR_STYLES_ID))
+        return;
+    const style = document.createElement('style');
+    style.id = EDITOR_STYLES_ID;
+    style.textContent = `
+    .cmmc-editor-backdrop {
+      position: fixed;
+      inset: 0;
+      z-index: 99999;
+      background: #000;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      padding-top: env(safe-area-inset-top);
+      padding-bottom: env(safe-area-inset-bottom);
+    box-sizing: border-box;
+    }
+    .cmmc-editor-backdrop img {
+      max-width: 100%;
+      max-height: 100%;
+      object-fit: contain;
+    }
+  `;
+    document.head.appendChild(style);
+}
+function loadImageElement(src) {
+    return new Promise((resolve, reject) => {
+        const img = new Image();
+        img.crossOrigin = 'anonymous';
+        img.onload = () => resolve(img);
+        img.onerror = () => reject(new Error(`Failed to load image: ${src}`));
+        img.src = src;
+    });
+}
+/**
+ * Opens the Marker.js 2 annotation editor on a given image source.
+ * Resolves with the annotated image data-URL and editor state, or null if cancelled.
+ */
+export function openImageEditor(src, previousState, licenseKey) {
+    if (editorOpen)
+        return Promise.resolve(null);
+    editorOpen = true;
+    ensureEditorStyles();
+    return new Promise((resolve) => {
+        let settled = false;
+        const finish = (value) => {
+            if (settled)
+                return;
+            settled = true;
+            editorOpen = false;
+            resolve(value);
+        };
+        void (async () => {
+            let backdrop = null;
+            try {
+                backdrop = document.createElement('div');
+                backdrop.className = 'cmmc-editor-backdrop';
+                document.body.appendChild(backdrop);
+                if (licenseKey && licenseKey.trim()) {
+                    Activator.addKey(licenseKey.trim());
+                }
+                const img = await loadImageElement(src);
+                backdrop.appendChild(img);
+                const markerArea = new MarkerArea(img);
+                markerArea.targetRoot = backdrop;
+                markerArea.renderAtNaturalSize = true;
+                markerArea.renderImageType = 'image/jpeg';
+                markerArea.renderImageQuality = 1;
+                markerArea.addEventListener('render', (event) => {
+                    backdrop === null || backdrop === void 0 ? void 0 : backdrop.remove();
+                    backdrop = null;
+                    finish({ dataUrl: event.dataUrl, state: event.state });
+                });
+                markerArea.addEventListener('close', () => {
+                    backdrop === null || backdrop === void 0 ? void 0 : backdrop.remove();
+                    backdrop = null;
+                    finish(null);
+                });
+                markerArea.show();
+                if (previousState) {
+                    try {
+                        markerArea.restoreState(previousState);
+                    }
+                    catch (_a) {
+                        /* e.g. state from an older editor version */
+                    }
+                }
+            }
+            catch (_err) {
+                backdrop === null || backdrop === void 0 ? void 0 : backdrop.remove();
+                finish(null);
+            }
+        })();
+    });
+}
+export function isEditorActive() {
+    return editorOpen;
+}
+//# sourceMappingURL=image-editor.js.map

package/dist/esm/ui/image-editor.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"image-editor.js","sourceRoot":"","sources":["../../../src/ui/image-editor.ts"],"names":[],"mappings":"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","sourcesContent":["import { Activator, MarkerArea } from 'markerjs2';\n\nconst EDITOR_STYLES_ID = 'cmmc-image-editor-styles';\n\nexport type ImageEditorResult = {\n  dataUrl: string;\n  state: unknown;\n};\n\nlet editorOpen = false;\n\nfunction ensureEditorStyles(): void {\n  if (document.getElementById(EDITOR_STYLES_ID)) return;\n\n  const style = document.createElement('style');\n  style.id = EDITOR_STYLES_ID;\n  style.textContent = `\n    .cmmc-editor-backdrop {\n      position: fixed;\n      inset: 0;\n      z-index: 99999;\n      background: #000;\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      padding-top: env(safe-area-inset-top);\n      padding-bottom: env(safe-area-inset-bottom);\n    box-sizing: border-box;\n    }\n    .cmmc-editor-backdrop img {\n      max-width: 100%;\n      max-height: 100%;\n      object-fit: contain;\n    }\n  `;\n  document.head.appendChild(style);\n}\n\nfunction loadImageElement(src: string): Promise<HTMLImageElement> {\n  return new Promise((resolve, reject) => {\n    const img = new Image();\n    img.crossOrigin = 'anonymous';\n    img.onload = () => resolve(img);\n    img.onerror = () => reject(new Error(`Failed to load image: ${src}`));\n    img.src = src;\n  });\n}\n\n/**\n * Opens the Marker.js 2 annotation editor on a given image source.\n * Resolves with the annotated image data-URL and editor state, or null if cancelled.\n */\nexport function openImageEditor(\n  src: string,\n  previousState?: unknown,\n  licenseKey?: string,\n): Promise<ImageEditorResult | null> {\n  if (editorOpen) return Promise.resolve(null);\n\n  editorOpen = true;\n  ensureEditorStyles();\n\n  return new Promise<ImageEditorResult | null>((resolve) => {\n    let settled = false;\n\n    const finish = (value: ImageEditorResult | null) => {\n      if (settled) return;\n      settled = true;\n      editorOpen = false;\n      resolve(value);\n    };\n\n    void (async () => {\n      let backdrop: HTMLElement | null = null;\n\n      try {\n        backdrop = document.createElement('div');\n        backdrop.className = 'cmmc-editor-backdrop';\n        document.body.appendChild(backdrop);\n\n        if (licenseKey && licenseKey.trim()) {\n          Activator.addKey(licenseKey.trim());\n        }\n\n        const img = await loadImageElement(src);\n        backdrop.appendChild(img);\n\n        const markerArea = new MarkerArea(img);\n        markerArea.targetRoot = backdrop;\n        markerArea.renderAtNaturalSize = true;\n        markerArea.renderImageType = 'image/jpeg';\n        markerArea.renderImageQuality = 1;\n\n        markerArea.addEventListener('render', (event: { dataUrl: string; state: unknown }) => {\n          backdrop?.remove();\n          backdrop = null;\n          finish({ dataUrl: event.dataUrl, state: event.state });\n        });\n\n        markerArea.addEventListener('close', () => {\n          backdrop?.remove();\n          backdrop = null;\n          finish(null);\n        });\n\n        markerArea.show();\n\n        if (previousState) {\n          try {\n            markerArea.restoreState(previousState as never);\n          } catch {\n            /* e.g. state from an older editor version */\n          }\n        }\n      } catch (_err) {\n        backdrop?.remove();\n        finish(null);\n      }\n    })();\n  });\n}\n\nexport function isEditorActive(): boolean {\n  return editorOpen;\n}\n"]}

package/dist/esm/ui/layout-manager.d.ts

@@ -0,0 +1,42 @@
+/**
+ * Layout manager for camera overlay UI
+ */
+import { UIPosition } from '../types/ui-types';
+/**
+ * Interface for position containers
+ */
+export interface PositionContainers {
+    topLeft: HTMLElement;
+    topRight: HTMLElement;
+    center: HTMLElement;
+    bottomGrid: HTMLElement;
+    zoomRow: HTMLElement;
+}
+/**
+ * Interface for bottom grid cells
+ */
+export interface BottomGridCells {
+    left: HTMLElement;
+    middle: HTMLElement;
+    right: HTMLElement;
+}
+/**
+ * Creates and styles the overlay container
+ */
+export declare function createOverlayContainer(containerId: string): HTMLElement;
+/**
+ * Creates the position containers for UI elements
+ */
+export declare function createPositionContainers(overlay: HTMLElement): PositionContainers;
+/**
+ * Creates the bottom grid cells
+ */
+export declare function createBottomGridCells(bottomGrid: HTMLElement): BottomGridCells;
+/**
+ * Creates the gallery container for thumbnails
+ */
+export declare function createGallery(overlay: HTMLElement): HTMLElement;
+/**
+ * Gets the position container based on the specified position
+ */
+export declare function getPositionContainer(positions: PositionContainers, position?: UIPosition): HTMLElement;

package/dist/esm/ui/layout-manager.js

@@ -0,0 +1,199 @@
+/**
+ * Creates and styles the overlay container
+ */
+export function createOverlayContainer(containerId) {
+    const container = document.getElementById(containerId);
+    if (!container) {
+        throw new Error(`Container element with ID '${containerId}' not found`);
+    }
+    // Make sure the container has position relative for proper positioning of child elements
+    if (getComputedStyle(container).position === 'static') {
+        container.style.position = 'relative';
+    }
+    const overlay = document.createElement('div');
+    overlay.id = 'camera-overlay';
+    Object.assign(overlay.style, {
+        position: 'absolute',
+        top: '0', left: '0', width: '100%', height: '100%',
+        background: 'transparent',
+        zIndex: '1',
+        display: 'flex',
+        flexDirection: 'column',
+        justifyContent: 'flex-end',
+        alignItems: 'center',
+        padding: '10px',
+        color: '#000',
+        boxSizing: 'border-box'
+    });
+    container.appendChild(overlay);
+    return overlay;
+}
+/**
+ * Creates the position containers for UI elements
+ */
+export function createPositionContainers(overlay) {
+    const positions = {
+        topLeft: document.createElement('div'),
+        topRight: document.createElement('div'),
+        center: document.createElement('div'),
+        bottomGrid: document.createElement('div'),
+        zoomRow: document.createElement('div')
+    };
+    Object.assign(positions.topLeft.style, {
+        position: 'absolute',
+        top: '10px',
+        left: '10px',
+        display: 'flex',
+        gap: '10px',
+        zIndex: '2'
+    });
+    Object.assign(positions.topRight.style, {
+        position: 'absolute',
+        top: '10px',
+        right: '10px',
+        display: 'flex',
+        flexDirection: 'column',
+        alignItems: 'flex-end',
+        gap: '10px',
+        zIndex: '2'
+    });
+    Object.assign(positions.center.style, {
+        position: 'absolute',
+        top: '50%',
+        left: '50%',
+        transform: 'translate(-50%, -50%)',
+        display: 'flex',
+        gap: '10px',
+        zIndex: '2'
+    });
+    Object.assign(positions.bottomGrid.style, {
+        position: 'absolute',
+        bottom: '20px',
+        left: '0',
+        width: '100%',
+        display: 'grid',
+        gridTemplateColumns: '1fr 1fr 1fr', // 3 equal columns
+        alignItems: 'center',
+        padding: '0 10px',
+        boxSizing: 'border-box',
+        zIndex: '2',
+        height: '70px' // Fixed height to prevent overlap
+    });
+    Object.assign(positions.zoomRow.style, {
+        position: 'absolute',
+        bottom: '110px', // Increased distance from bottom grid
+        left: '0',
+        width: '100%',
+        display: 'flex',
+        justifyContent: 'center',
+        alignItems: 'center',
+        gap: '10px',
+        padding: '10px',
+        boxSizing: 'border-box',
+        zIndex: '2',
+        height: '40px' // Fixed height for zoom row
+    });
+    Object.values(positions).forEach(posContainer => {
+        overlay.appendChild(posContainer);
+    });
+    return positions;
+}
+/**
+ * Creates the bottom grid cells
+ */
+export function createBottomGridCells(bottomGrid) {
+    const cells = {
+        left: document.createElement('div'),
+        middle: document.createElement('div'),
+        right: document.createElement('div')
+    };
+    Object.assign(cells.left.style, {
+        display: 'flex',
+        justifyContent: 'center',
+        alignItems: 'center'
+    });
+    Object.assign(cells.middle.style, {
+        display: 'flex',
+        justifyContent: 'center',
+        alignItems: 'center',
+        position: 'relative'
+    });
+    Object.assign(cells.right.style, {
+        display: 'flex',
+        justifyContent: 'center',
+        alignItems: 'center'
+    });
+    bottomGrid.appendChild(cells.left);
+    bottomGrid.appendChild(cells.middle);
+    bottomGrid.appendChild(cells.right);
+    return cells;
+}
+/**
+ * Creates the gallery container for thumbnails
+ */
+export function createGallery(overlay) {
+    const gallery = document.createElement('div');
+    Object.assign(gallery.style, {
+        position: 'absolute',
+        bottom: '160px',
+        left: '0',
+        width: '100%',
+        display: 'flex',
+        gap: '10px',
+        padding: '10px',
+        overflowX: 'auto',
+        overflowY: 'hidden',
+        whiteSpace: 'nowrap',
+        justifyContent: 'center',
+        zIndex: '2',
+        scrollbarWidth: 'none',
+        WebkitOverflowScrolling: 'touch',
+        flexWrap: 'nowrap'
+    });
+    gallery.style.setProperty('-ms-overflow-style', 'none');
+    // Function to update justify-content based on content overflow
+    const updateJustification = () => {
+        if (gallery.scrollWidth > gallery.clientWidth) {
+            gallery.style.justifyContent = 'flex-start';
+        }
+        else {
+            gallery.style.justifyContent = 'center';
+        }
+    };
+    // Create a MutationObserver to watch for content changes
+    const observer = new MutationObserver(updateJustification);
+    observer.observe(gallery, { childList: true, subtree: true });
+    // Also update on resize (with fallback for browsers without ResizeObserver)
+    if (typeof window.ResizeObserver !== 'undefined') {
+        const resizeObserver = new window.ResizeObserver(updateJustification);
+        resizeObserver.observe(gallery);
+    }
+    else {
+        // Fallback: use window resize event
+        window.addEventListener('resize', updateJustification);
+    }
+    gallery.addEventListener('mouseenter', () => {
+        gallery.style.overflow = 'auto';
+    });
+    gallery.addEventListener('mouseleave', () => {
+        gallery.style.overflow = 'hidden';
+    });
+    overlay.appendChild(gallery);
+    return gallery;
+}
+/**
+ * Gets the position container based on the specified position
+ */
+export function getPositionContainer(positions, position) {
+    switch (position) {
+        case 'topLeft':
+            return positions.topLeft;
+        case 'topRight':
+            return positions.topRight;
+        case 'center':
+            return positions.center;
+        default:
+            return positions.topRight; // Default fallback
+    }
+}
+//# sourceMappingURL=layout-manager.js.map

package/dist/esm/ui/layout-manager.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"layout-manager.js","sourceRoot":"","sources":["../../../src/ui/layout-manager.ts"],"names":[],"mappings":"AAyBA;;GAEG;AACH,MAAM,UAAU,sBAAsB,CAAC,WAAmB;IACxD,MAAM,SAAS,GAAG,QAAQ,CAAC,cAAc,CAAC,WAAW,CAAC,CAAC;IACvD,IAAI,CAAC,SAAS,EAAE,CAAC;QACf,MAAM,IAAI,KAAK,CAAC,8BAA8B,WAAW,aAAa,CAAC,CAAC;IAC1E,CAAC;IAED,yFAAyF;IACzF,IAAI,gBAAgB,CAAC,SAAS,CAAC,CAAC,QAAQ,KAAK,QAAQ,EAAE,CAAC;QACtD,SAAS,CAAC,KAAK,CAAC,QAAQ,GAAG,UAAU,CAAC;IACxC,CAAC;IAED,MAAM,OAAO,GAAG,QAAQ,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;IAC9C,OAAO,CAAC,EAAE,GAAG,gBAAgB,CAAC;IAC9B,MAAM,CAAC,MAAM,CAAC,OAAO,CAAC,KAAK,EAAE;QAC3B,QAAQ,EAAE,UAAU;QACpB,GAAG,EAAE,GAAG,EAAE,IAAI,EAAE,GAAG,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM;QAClD,UAAU,EAAE,aAAa;QACzB,MAAM,EAAE,GAAG;QACX,OAAO,EAAE,MAAM;QACf,aAAa,EAAE,QAAQ;QACvB,cAAc,EAAE,UAAU;QAC1B,UAAU,EAAE,QAAQ;QACpB,OAAO,EAAE,MAAM;QACf,KAAK,EAAE,MAAM;QACb,SAAS,EAAE,YAAY;KACxB,CAAC,CAAC;IAEH,SAAS,CAAC,WAAW,CAAC,OAAO,CAAC,CAAC;IAE/B,OAAO,OAAO,CAAC;AACjB,CAAC;AAED;;GAEG;AACH,MAAM,UAAU,wBAAwB,CAAC,OAAoB;IAC3D,MAAM,SAAS,GAAuB;QACpC,OAAO,EAAE,QAAQ,CAAC,aAAa,CAAC,KAAK,CAAC;QACtC,QAAQ,EAAE,QAAQ,CAAC,aAAa,CAAC,KAAK,CAAC;QACvC,MAAM,EAAE,QAAQ,CAAC,aAAa,CAAC,KAAK,CAAC;QACrC,UAAU,EAAE,QAAQ,CAAC,aAAa,CAAC,KAAK,CAAC;QACzC,OAAO,EAAE,QAAQ,CAAC,aAAa,CAAC,KAAK,CAAC;KACvC,CAAC;IAEF,MAAM,CAAC,MAAM,CAAC,SAAS,CAAC,OAAO,CAAC,KAAK,EAAE;QACrC,QAAQ,EAAE,UAAU;QACpB,GAAG,EAAE,MAAM;QACX,IAAI,EAAE,MAAM;QACZ,OAAO,EAAE,MAAM;QACf,GAAG,EAAE,MAAM;QACX,MAAM,EAAE,GAAG;KACZ,CAAC,CAAC;IAEH,MAAM,CAAC,MAAM,CAAC,SAAS,CAAC,QAAQ,CAAC,KAAK,EAAE;QACtC,QAAQ,EAAE,UAAU;QACpB,GAAG,EAAE,MAAM;QACX,KAAK,EAAE,MAAM;QACb,OAAO,EAAE,MAAM;QACf,aAAa,EAAE,QAAQ;QACvB,UAAU,EAAE,UAAU;QACtB,GAAG,EAAE,MAAM;QACX,MAAM,EAAE,GAAG;KACZ,CAAC,CAAC;IAEH,MAAM,CAAC,MAAM,CAAC,SAAS,CAAC,MAAM,CAAC,KAAK,EAAE;QACpC,QAAQ,EAAE,UAAU;QACpB,GAAG,EAAE,KAAK;QACV,IAAI,EAAE,KAAK;QACX,SAAS,EAAE,uBAAuB;QAClC,OAAO,EAAE,MAAM;QACf,GAAG,EAAE,MAAM;QACX,MAAM,EAAE,GAAG;KACZ,CAAC,CAAC;IAEH,MAAM,CAAC,MAAM,CAAC,SAAS,CAAC,UAAU,CAAC,KAAK,EAAE;QACxC,QAAQ,EAAE,UAAU;QACpB,MAAM,EAAE,MAAM;QACd,IAAI,EAAE,GAAG;QACT,KAAK,EAAE,MAAM;QACb,OAAO,EAAE,MAAM;QACf,mBAAmB,EAAE,aAAa,EAAG,kBAAkB;QACvD,UAAU,EAAE,QAAQ;QACpB,OAAO,EAAE,QAAQ;QACjB,SAAS,EAAE,YAAY;QACvB,MAAM,EAAE,GAAG;QACX,MAAM,EAAE,MAAM,CAAE,kCAAkC;KACnD,CAAC,CAAC;IAEH,MAAM,CAAC,MAAM,CAAC,SAAS,CAAC,OAAO,CAAC,KAAK,EAAE;QACrC,QAAQ,EAAE,UAAU;QACpB,MAAM,EAAE,OAAO,EAAG,sCAAsC;QACxD,IAAI,EAAE,GAAG;QACT,KAAK,EAAE,MAAM;QACb,OAAO,EAAE,MAAM;QACf,cAAc,EAAE,QAAQ;QACxB,UAAU,EAAE,QAAQ;QACpB,GAAG,EAAE,MAAM;QACX,OAAO,EAAE,MAAM;QACf,SAAS,EAAE,YAAY;QACvB,MAAM,EAAE,GAAG;QACX,MAAM,EAAE,MAAM,CAAE,4BAA4B;KAC7C,CAAC,CAAC;IAEH,MAAM,CAAC,MAAM,CAAC,SAAS,CAAC,CAAC,OAAO,CAAC,YAAY,CAAC,EAAE;QAC9C,OAAO,CAAC,WAAW,CAAC,YAAY,CAAC,CAAC;IACpC,CAAC,CAAC,CAAC;IAEH,OAAO,SAAS,CAAC;AACnB,CAAC;AAED;;GAEG;AACH,MAAM,UAAU,qBAAqB,CAAC,UAAuB;IAC3D,MAAM,KAAK,GAAoB;QAC7B,IAAI,EAAE,QAAQ,CAAC,aAAa,CAAC,KAAK,CAAC;QACnC,MAAM,EAAE,QAAQ,CAAC,aAAa,CAAC,KAAK,CAAC;QACrC,KAAK,EAAE,QAAQ,CAAC,aAAa,CAAC,KAAK,CAAC;KACrC,CAAC;IAEF,MAAM,CAAC,MAAM,CAAC,KAAK,CAAC,IAAI,CAAC,KAAK,EAAE;QAC9B,OAAO,EAAE,MAAM;QACf,cAAc,EAAE,QAAQ;QACxB,UAAU,EAAE,QAAQ;KACrB,CAAC,CAAC;IAEH,MAAM,CAAC,MAAM,CAAC,KAAK,CAAC,MAAM,CAAC,KAAK,EAAE;QAChC,OAAO,EAAE,MAAM;QACf,cAAc,EAAE,QAAQ;QACxB,UAAU,EAAE,QAAQ;QACpB,QAAQ,EAAE,UAAU;KACrB,CAAC,CAAC;IAEH,MAAM,CAAC,MAAM,CAAC,KAAK,CAAC,KAAK,CAAC,KAAK,EAAE;QAC/B,OAAO,EAAE,MAAM;QACf,cAAc,EAAE,QAAQ;QACxB,UAAU,EAAE,QAAQ;KACrB,CAAC,CAAC;IAEH,UAAU,CAAC,WAAW,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC;IACnC,UAAU,CAAC,WAAW,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC;IACrC,UAAU,CAAC,WAAW,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC;IAEpC,OAAO,KAAK,CAAC;AACf,CAAC;AAED;;GAEG;AACH,MAAM,UAAU,aAAa,CAAC,OAAoB;IAChD,MAAM,OAAO,GAAG,QAAQ,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;IAC9C,MAAM,CAAC,MAAM,CAAC,OAAO,CAAC,KAAK,EAAE;QAC3B,QAAQ,EAAE,UAAU;QACpB,MAAM,EAAE,OAAO;QACf,IAAI,EAAE,GAAG;QACT,KAAK,EAAE,MAAM;QACb,OAAO,EAAE,MAAM;QACf,GAAG,EAAE,MAAM;QACX,OAAO,EAAE,MAAM;QACf,SAAS,EAAE,MAAM;QACjB,SAAS,EAAE,QAAQ;QACnB,UAAU,EAAE,QAAQ;QACpB,cAAc,EAAE,QAAQ;QACxB,MAAM,EAAE,GAAG;QACX,cAAc,EAAE,MAAM;QACtB,uBAAuB,EAAE,OAAO;QAChC,QAAQ,EAAE,QAAQ;KACnB,CAAC,CAAC;IAEH,OAAO,CAAC,KAAK,CAAC,WAAW,CAAC,oBAAoB,EAAE,MAAM,CAAC,CAAC;IAExD,+DAA+D;IAC/D,MAAM,mBAAmB,GAAG,GAAG,EAAE;QAC/B,IAAI,OAAO,CAAC,WAAW,GAAG,OAAO,CAAC,WAAW,EAAE,CAAC;YAC9C,OAAO,CAAC,KAAK,CAAC,cAAc,GAAG,YAAY,CAAC;QAC9C,CAAC;aAAM,CAAC;YACN,OAAO,CAAC,KAAK,CAAC,cAAc,GAAG,QAAQ,CAAC;QAC1C,CAAC;IACH,CAAC,CAAC;IAEF,yDAAyD;IACzD,MAAM,QAAQ,GAAG,IAAI,gBAAgB,CAAC,mBAAmB,CAAC,CAAC;IAC3D,QAAQ,CAAC,OAAO,CAAC,OAAO,EAAE,EAAE,SAAS,EAAE,IAAI,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,CAAC;IAE9D,4EAA4E;IAC5E,IAAI,OAAQ,MAAc,CAAC,cAAc,KAAK,WAAW,EAAE,CAAC;QAC1D,MAAM,cAAc,GAAG,IAAK,MAAc,CAAC,cAAc,CAAC,mBAAmB,CAAC,CAAC;QAC/E,cAAc,CAAC,OAAO,CAAC,OAAO,CAAC,CAAC;IAClC,CAAC;SAAM,CAAC;QACN,oCAAoC;QACpC,MAAM,CAAC,gBAAgB,CAAC,QAAQ,EAAE,mBAAmB,CAAC,CAAC;IACzD,CAAC;IAED,OAAO,CAAC,gBAAgB,CAAC,YAAY,EAAE,GAAG,EAAE;QAC1C,OAAO,CAAC,KAAK,CAAC,QAAQ,GAAG,MAAM,CAAC;IAClC,CAAC,CAAC,CAAC;IACH,OAAO,CAAC,gBAAgB,CAAC,YAAY,EAAE,GAAG,EAAE;QAC1C,OAAO,CAAC,KAAK,CAAC,QAAQ,GAAG,QAAQ,CAAC;IACpC,CAAC,CAAC,CAAC;IAEH,OAAO,CAAC,WAAW,CAAC,OAAO,CAAC,CAAC;IAE7B,OAAO,OAAO,CAAC;AACjB,CAAC;AAED;;GAEG;AACH,MAAM,UAAU,oBAAoB,CAClC,SAA6B,EAC7B,QAAqB;IAErB,QAAQ,QAAQ,EAAE,CAAC;QACjB,KAAK,SAAS;YACZ,OAAO,SAAS,CAAC,OAAO,CAAC;QAC3B,KAAK,UAAU;YACb,OAAO,SAAS,CAAC,QAAQ,CAAC;QAC5B,KAAK,QAAQ;YACX,OAAO,SAAS,CAAC,MAAM,CAAC;QAC1B;YACE,OAAO,SAAS,CAAC,QAAQ,CAAC,CAAC,mBAAmB;IAClD,CAAC;AACH,CAAC","sourcesContent":["/**\n * Layout manager for camera overlay UI\n */\nimport { UIPosition } from '../types/ui-types';\n\n/**\n * Interface for position containers\n */\nexport interface PositionContainers {\n  topLeft: HTMLElement;\n  topRight: HTMLElement;\n  center: HTMLElement;\n  bottomGrid: HTMLElement;\n  zoomRow: HTMLElement;\n}\n\n/**\n * Interface for bottom grid cells\n */\nexport interface BottomGridCells {\n  left: HTMLElement;\n  middle: HTMLElement;\n  right: HTMLElement;\n}\n\n/**\n * Creates and styles the overlay container\n */\nexport function createOverlayContainer(containerId: string): HTMLElement {\n  const container = document.getElementById(containerId);\n  if (!container) {\n    throw new Error(`Container element with ID '${containerId}' not found`);\n  }\n  \n  // Make sure the container has position relative for proper positioning of child elements\n  if (getComputedStyle(container).position === 'static') {\n    container.style.position = 'relative';\n  }\n  \n  const overlay = document.createElement('div');\n  overlay.id = 'camera-overlay';\n  Object.assign(overlay.style, {\n    position: 'absolute',\n    top: '0', left: '0', width: '100%', height: '100%',\n    background: 'transparent', \n    zIndex: '1',\n    display: 'flex', \n    flexDirection: 'column', \n    justifyContent: 'flex-end', \n    alignItems: 'center', \n    padding: '10px',\n    color: '#000',\n    boxSizing: 'border-box'\n  });\n  \n  container.appendChild(overlay);\n  \n  return overlay;\n}\n\n/**\n * Creates the position containers for UI elements\n */\nexport function createPositionContainers(overlay: HTMLElement): PositionContainers {\n  const positions: PositionContainers = {\n    topLeft: document.createElement('div'),\n    topRight: document.createElement('div'),\n    center: document.createElement('div'),\n    bottomGrid: document.createElement('div'),\n    zoomRow: document.createElement('div')\n  };\n  \n  Object.assign(positions.topLeft.style, {\n    position: 'absolute',\n    top: '10px',\n    left: '10px',\n    display: 'flex',\n    gap: '10px',\n    zIndex: '2'\n  });\n  \n  Object.assign(positions.topRight.style, {\n    position: 'absolute',\n    top: '10px',\n    right: '10px',\n    display: 'flex',\n    flexDirection: 'column',\n    alignItems: 'flex-end',\n    gap: '10px',\n    zIndex: '2'\n  });\n  \n  Object.assign(positions.center.style, {\n    position: 'absolute',\n    top: '50%',\n    left: '50%',\n    transform: 'translate(-50%, -50%)',\n    display: 'flex',\n    gap: '10px',\n    zIndex: '2'\n  });\n  \n  Object.assign(positions.bottomGrid.style, {\n    position: 'absolute',\n    bottom: '20px',\n    left: '0',\n    width: '100%',\n    display: 'grid',\n    gridTemplateColumns: '1fr 1fr 1fr',  // 3 equal columns\n    alignItems: 'center',\n    padding: '0 10px',\n    boxSizing: 'border-box',\n    zIndex: '2',\n    height: '70px'  // Fixed height to prevent overlap\n  });\n  \n  Object.assign(positions.zoomRow.style, {\n    position: 'absolute',\n    bottom: '110px',  // Increased distance from bottom grid\n    left: '0',\n    width: '100%',\n    display: 'flex',\n    justifyContent: 'center',\n    alignItems: 'center',\n    gap: '10px',\n    padding: '10px',\n    boxSizing: 'border-box',\n    zIndex: '2',\n    height: '40px'  // Fixed height for zoom row\n  });\n  \n  Object.values(positions).forEach(posContainer => {\n    overlay.appendChild(posContainer);\n  });\n  \n  return positions;\n}\n\n/**\n * Creates the bottom grid cells\n */\nexport function createBottomGridCells(bottomGrid: HTMLElement): BottomGridCells {\n  const cells: BottomGridCells = {\n    left: document.createElement('div'),\n    middle: document.createElement('div'),\n    right: document.createElement('div')\n  };\n  \n  Object.assign(cells.left.style, {\n    display: 'flex',\n    justifyContent: 'center',\n    alignItems: 'center'\n  });\n  \n  Object.assign(cells.middle.style, {\n    display: 'flex',\n    justifyContent: 'center',\n    alignItems: 'center',\n    position: 'relative'\n  });\n  \n  Object.assign(cells.right.style, {\n    display: 'flex',\n    justifyContent: 'center',\n    alignItems: 'center'\n  });\n  \n  bottomGrid.appendChild(cells.left);\n  bottomGrid.appendChild(cells.middle);\n  bottomGrid.appendChild(cells.right);\n  \n  return cells;\n}\n\n/**\n * Creates the gallery container for thumbnails\n */\nexport function createGallery(overlay: HTMLElement): HTMLElement {\n  const gallery = document.createElement('div');\n  Object.assign(gallery.style, {\n    position: 'absolute',\n    bottom: '160px',\n    left: '0',\n    width: '100%',\n    display: 'flex', \n    gap: '10px', \n    padding: '10px',\n    overflowX: 'auto',\n    overflowY: 'hidden',\n    whiteSpace: 'nowrap',\n    justifyContent: 'center',\n    zIndex: '2',\n    scrollbarWidth: 'none',\n    WebkitOverflowScrolling: 'touch',\n    flexWrap: 'nowrap'\n  });\n  \n  gallery.style.setProperty('-ms-overflow-style', 'none');\n  \n  // Function to update justify-content based on content overflow\n  const updateJustification = () => {\n    if (gallery.scrollWidth > gallery.clientWidth) {\n      gallery.style.justifyContent = 'flex-start';\n    } else {\n      gallery.style.justifyContent = 'center';\n    }\n  };\n  \n  // Create a MutationObserver to watch for content changes\n  const observer = new MutationObserver(updateJustification);\n  observer.observe(gallery, { childList: true, subtree: true });\n  \n  // Also update on resize (with fallback for browsers without ResizeObserver)\n  if (typeof (window as any).ResizeObserver !== 'undefined') {\n    const resizeObserver = new (window as any).ResizeObserver(updateJustification);\n    resizeObserver.observe(gallery);\n  } else {\n    // Fallback: use window resize event\n    window.addEventListener('resize', updateJustification);\n  }\n  \n  gallery.addEventListener('mouseenter', () => {\n    gallery.style.overflow = 'auto';\n  });\n  gallery.addEventListener('mouseleave', () => {\n    gallery.style.overflow = 'hidden';\n  });\n  \n  overlay.appendChild(gallery);\n  \n  return gallery;\n}\n\n/**\n * Gets the position container based on the specified position\n */\nexport function getPositionContainer(\n  positions: PositionContainers,\n  position?: UIPosition\n): HTMLElement {\n  switch (position) {\n    case 'topLeft':\n      return positions.topLeft;\n    case 'topRight':\n      return positions.topRight;\n    case 'center':\n      return positions.center;\n    default:\n      return positions.topRight; // Default fallback\n  }\n}\n"]}

package/dist/esm/ui/media-viewer.d.ts

@@ -0,0 +1,2 @@
+export declare function openImagePreview(src: string, thumb?: string, onEdit?: () => void): void;
+export declare function openVideoPreview(src: string, thumb?: string): void;

package/dist/esm/ui/media-viewer.js

@@ -0,0 +1,267 @@
+import BiggerPicture from 'bigger-picture';
+import bpCss from 'bigger-picture/css-text';
+const BP_STYLES_ID = 'cmmc-bigger-picture-styles';
+let bpInstance = null;
+let activeBackHandler = null;
+const DEFAULT_MEDIA_WIDTH = 1920;
+const DEFAULT_MEDIA_HEIGHT = 1080;
+function ensureStyles() {
+    const existing = document.getElementById(BP_STYLES_ID);
+    if (existing && existing.tagName.toLowerCase() !== 'style') {
+        existing.remove();
+    }
+    const style = document.getElementById(BP_STYLES_ID);
+    if (style) {
+        return;
+    }
+    const styleEl = document.createElement('style');
+    styleEl.id = BP_STYLES_ID;
+    styleEl.textContent = `${bpCss}
+    .bp-wrap,
+    .bp-wrap * {
+      animation-duration: 0ms !important;
+      transition-duration: 0ms !important;
+      transition-delay: 0ms !important;
+    }
+    .bp-wrap {
+      --cmmc-safe-top-extra: 0px;
+      --cmmc-safe-bottom-extra: 0px;
+    }
+    .bp-wrap > div:first-child {
+      background: #000 !important;
+    }
+    .bp-x {
+      top: env(safe-area-inset-top) !important;
+    }
+    .bp-img-wrap {
+      top: calc(env(safe-area-inset-top) + var(--cmmc-safe-top-extra)) !important;
+      bottom: calc(env(safe-area-inset-bottom) + var(--cmmc-safe-bottom-extra)) !important;
+      height: auto !important;
+    }
+    .bp-vid,
+    .bp-if {
+      max-height: calc(100% - env(safe-area-inset-top) - env(safe-area-inset-bottom) - var(--cmmc-safe-top-extra) - var(--cmmc-safe-bottom-extra)) !important;
+      margin-top: calc(env(safe-area-inset-top) + var(--cmmc-safe-top-extra)) !important;
+      margin-bottom: calc(env(safe-area-inset-bottom) + var(--cmmc-safe-bottom-extra)) !important;
+    }
+    .bp-controls .cmmc-bp-edit {
+      position: absolute;
+      top: env(safe-area-inset-top);
+      left: 0;
+      z-index: 10;
+      width: 48px;
+      height: 48px;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      background: none;
+      border: none;
+      cursor: pointer;
+      color: #fff;
+      padding: 0;
+      -webkit-tap-highlight-color: transparent;
+    }
+    .bp-controls .cmmc-bp-edit:hover {
+      background: none;
+    }
+    .bp-controls .cmmc-bp-edit svg {
+      filter: drop-shadow(0 1px 3px rgba(0,0,0,0.6));
+    }
+  `;
+    document.head.appendChild(styleEl);
+}
+function getInstance() {
+    if (bpInstance) {
+        return bpInstance;
+    }
+    bpInstance = BiggerPicture({
+        target: document.body,
+    });
+    return bpInstance;
+}
+function getMimeType(src) {
+    const normalized = src.toLowerCase();
+    if (normalized.endsWith('.webm'))
+        return 'video/webm';
+    if (normalized.endsWith('.mov'))
+        return 'video/quicktime';
+    return 'video/mp4';
+}
+function readSafeAreaInset(property) {
+    const probe = document.createElement('div');
+    probe.style.position = 'fixed';
+    probe.style.visibility = 'hidden';
+    probe.style.pointerEvents = 'none';
+    probe.style.zIndex = '-1';
+    if (property === 'top') {
+        probe.style.top = '0';
+        probe.style.paddingTop = 'env(safe-area-inset-top)';
+    }
+    else {
+        probe.style.bottom = '0';
+        probe.style.paddingBottom = 'env(safe-area-inset-bottom)';
+    }
+    document.body.appendChild(probe);
+    const computed = window.getComputedStyle(probe);
+    const raw = property === 'top' ? computed.paddingTop : computed.paddingBottom;
+    probe.remove();
+    const parsed = Number.parseFloat(raw);
+    return Number.isFinite(parsed) ? parsed : 0;
+}
+function applyDynamicSafeArea(container) {
+    const closeButton = container.querySelector('.bp-x');
+    const media = container.querySelector('.bp-vid, .bp-if, .bp-img');
+    if (!closeButton || !media) {
+        container.style.setProperty('--cmmc-safe-top-extra', '0px');
+        container.style.setProperty('--cmmc-safe-bottom-extra', '0px');
+        return;
+    }
+    const closeRect = closeButton.getBoundingClientRect();
+    const mediaRect = media.getBoundingClientRect();
+    const safeBottom = readSafeAreaInset('bottom');
+    const topOverlap = Math.max(0, closeRect.bottom - mediaRect.top);
+    const bottomLimit = window.innerHeight - safeBottom;
+    const bottomOverlap = Math.max(0, mediaRect.bottom - bottomLimit);
+    container.style.setProperty('--cmmc-safe-top-extra', `${topOverlap}px`);
+    container.style.setProperty('--cmmc-safe-bottom-extra', `${bottomOverlap}px`);
+}
+function getImageDimensions(src) {
+    return new Promise((resolve) => {
+        const img = new Image();
+        img.onload = () => {
+            if (img.naturalWidth > 0 && img.naturalHeight > 0) {
+                resolve({ width: img.naturalWidth, height: img.naturalHeight });
+            }
+            else {
+                resolve(null);
+            }
+        };
+        img.onerror = () => resolve(null);
+        img.src = src;
+    });
+}
+function getVideoDimensions(src) {
+    return new Promise((resolve) => {
+        const video = document.createElement('video');
+        video.preload = 'metadata';
+        video.playsInline = true;
+        const cleanup = () => {
+            video.removeAttribute('src');
+            video.load();
+        };
+        video.onloadedmetadata = () => {
+            const width = video.videoWidth;
+            const height = video.videoHeight;
+            cleanup();
+            if (width > 0 && height > 0) {
+                resolve({ width, height });
+            }
+            else {
+                resolve(null);
+            }
+        };
+        video.onerror = () => {
+            cleanup();
+            resolve(null);
+        };
+        video.src = src;
+    });
+}
+function injectEditButton(container, onEdit) {
+    const controls = container.querySelector('.bp-controls');
+    if (!controls || controls.querySelector('.cmmc-bp-edit'))
+        return;
+    const btn = document.createElement('button');
+    btn.className = 'cmmc-bp-edit';
+    btn.innerHTML = `<svg xmlns="http://www.w3.org/2000/svg" width="22" height="22" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M17 3a2.828 2.828 0 1 1 4 4L7.5 20.5 2 22l1.5-5.5L17 3z"/></svg>`;
+    btn.onclick = (e) => {
+        e.stopPropagation();
+        getInstance().close();
+        onEdit();
+    };
+    controls.appendChild(btn);
+}
+function registerBackHandler() {
+    removeBackHandler();
+    const handler = () => {
+        getInstance().close();
+    };
+    activeBackHandler = handler;
+    document.addEventListener('backbutton', handler);
+}
+function removeBackHandler() {
+    if (activeBackHandler) {
+        document.removeEventListener('backbutton', activeBackHandler);
+        activeBackHandler = null;
+    }
+}
+export function openImagePreview(src, thumb, onEdit) {
+    void (async () => {
+        var _a, _b;
+        ensureStyles();
+        const dimensions = await getImageDimensions(src);
+        const items = [
+            {
+                img: src,
+                thumb: thumb || src,
+                width: (_a = dimensions === null || dimensions === void 0 ? void 0 : dimensions.width) !== null && _a !== void 0 ? _a : DEFAULT_MEDIA_WIDTH,
+                height: (_b = dimensions === null || dimensions === void 0 ? void 0 : dimensions.height) !== null && _b !== void 0 ? _b : DEFAULT_MEDIA_HEIGHT,
+            },
+        ];
+        getInstance().open({
+            items,
+            el: document.body,
+            scale: 1,
+            intro: 'fadeup',
+            onOpen: (container) => {
+                applyDynamicSafeArea(container);
+                registerBackHandler();
+                if (onEdit) {
+                    injectEditButton(container, onEdit);
+                }
+            },
+            onClose: () => {
+                removeBackHandler();
+            },
+            onResize: (container) => {
+                if (!container)
+                    return;
+                applyDynamicSafeArea(container);
+            },
+        });
+    })();
+}
+export function openVideoPreview(src, thumb) {
+    void (async () => {
+        var _a, _b;
+        ensureStyles();
+        const dimensions = await getVideoDimensions(src);
+        const items = [
+            {
+                thumb: thumb || src,
+                sources: [{ src, type: getMimeType(src) }],
+                width: (_a = dimensions === null || dimensions === void 0 ? void 0 : dimensions.width) !== null && _a !== void 0 ? _a : DEFAULT_MEDIA_WIDTH,
+                height: (_b = dimensions === null || dimensions === void 0 ? void 0 : dimensions.height) !== null && _b !== void 0 ? _b : DEFAULT_MEDIA_HEIGHT,
+            },
+        ];
+        getInstance().open({
+            items,
+            el: document.body,
+            scale: 1,
+            intro: 'fadeup',
+            onOpen: (container) => {
+                applyDynamicSafeArea(container);
+                registerBackHandler();
+            },
+            onClose: () => {
+                removeBackHandler();
+            },
+            onResize: (container) => {
+                if (!container)
+                    return;
+                applyDynamicSafeArea(container);
+            },
+        });
+    })();
+}
+//# sourceMappingURL=media-viewer.js.map