@treasuryspatial/prompt-ui-kit 0.1.14 → 0.1.21

package/dist/useRenderImageFlow.d.ts

@@ -1,6 +1,6 @@
 import { type Dispatch, type SetStateAction } from 'react';
-import type { RenderHistoryEntry } from './RenderHistoryPanel';
-import { type RenderLightboxState, type UseRenderLightboxOptions } from './useRenderLightbox';
+import type { RenderHistoryEntry } from './RenderHistoryPanel.js';
+import { type RenderLightboxState, type UseRenderLightboxOptions } from './useRenderLightbox.js';
 export type RenderImageFlowEntry = Omit<RenderHistoryEntry, 'id'> & {
     id?: string;
 };

package/dist/useRenderImageFlow.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useRenderImageFlow.d.ts","sourceRoot":"","sources":["../src/useRenderImageFlow.ts"],"names":[],"mappings":"AAEA,OAAO,EAAyB,KAAK,QAAQ,EAAE,KAAK,cAAc,EAAE,MAAM,OAAO,CAAC;AAElF,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;AAC/D,OAAO,EAAqB,KAAK,mBAAmB,EAAE,KAAK,wBAAwB,EAAE,MAAM,qBAAqB,CAAC;AAIjH,MAAM,MAAM,oBAAoB,GAAG,IAAI,CAAC,kBAAkB,EAAE,IAAI,CAAC,GAAG;IAClE,EAAE,CAAC,EAAE,MAAM,CAAC;CACb,CAAC;AAEF,MAAM,MAAM,yBAAyB,GAAG,wBAAwB,GAAG;IACjE,iBAAiB,CAAC,EAAE,MAAM,IAAI,CAAC;CAChC,CAAC;AAEF,MAAM,MAAM,oBAAoB,GAAG;IACjC,iBAAiB,EAAE,MAAM,CAAC;IAC1B,oBAAoB,EAAE,QAAQ,CAAC,cAAc,CAAC,MAAM,CAAC,CAAC,CAAC;IACvD,eAAe,EAAE,MAAM,CAAC;IACxB,kBAAkB,EAAE,QAAQ,CAAC,cAAc,CAAC,MAAM,CAAC,CAAC,CAAC;IACrD,aAAa,EAAE,kBAAkB,EAAE,CAAC;IACpC,gBAAgB,EAAE,QAAQ,CAAC,cAAc,CAAC,kBAAkB,EAAE,CAAC,CAAC,CAAC;IACjE,kBAAkB,EAAE,MAAM,IAAI,CAAC;IAC/B,mBAAmB,EAAE,CAAC,KAAK,EAAE,oBAAoB,KAAK,kBAAkB,CAAC;IACzE,QAAQ,EAAE,mBAAmB,CAAC;CAC/B,CAAC;AAEF,eAAO,MAAM,kBAAkB,GAC7B,UAAS,yBAA8B,KACtC,oBAyCF,CAAC"}
+{"version":3,"file":"useRenderImageFlow.d.ts","sourceRoot":"","sources":["../src/useRenderImageFlow.ts"],"names":[],"mappings":"AAEA,OAAO,EAAyB,KAAK,QAAQ,EAAE,KAAK,cAAc,EAAE,MAAM,OAAO,CAAC;AAElF,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,yBAAyB,CAAC;AAClE,OAAO,EAAqB,KAAK,mBAAmB,EAAE,KAAK,wBAAwB,EAAE,MAAM,wBAAwB,CAAC;AAIpH,MAAM,MAAM,oBAAoB,GAAG,IAAI,CAAC,kBAAkB,EAAE,IAAI,CAAC,GAAG;IAClE,EAAE,CAAC,EAAE,MAAM,CAAC;CACb,CAAC;AAEF,MAAM,MAAM,yBAAyB,GAAG,wBAAwB,GAAG;IACjE,iBAAiB,CAAC,EAAE,MAAM,IAAI,CAAC;CAChC,CAAC;AAEF,MAAM,MAAM,oBAAoB,GAAG;IACjC,iBAAiB,EAAE,MAAM,CAAC;IAC1B,oBAAoB,EAAE,QAAQ,CAAC,cAAc,CAAC,MAAM,CAAC,CAAC,CAAC;IACvD,eAAe,EAAE,MAAM,CAAC;IACxB,kBAAkB,EAAE,QAAQ,CAAC,cAAc,CAAC,MAAM,CAAC,CAAC,CAAC;IACrD,aAAa,EAAE,kBAAkB,EAAE,CAAC;IACpC,gBAAgB,EAAE,QAAQ,CAAC,cAAc,CAAC,kBAAkB,EAAE,CAAC,CAAC,CAAC;IACjE,kBAAkB,EAAE,MAAM,IAAI,CAAC;IAC/B,mBAAmB,EAAE,CAAC,KAAK,EAAE,oBAAoB,KAAK,kBAAkB,CAAC;IACzE,QAAQ,EAAE,mBAAmB,CAAC;CAC/B,CAAC;AAEF,eAAO,MAAM,kBAAkB,GAC7B,UAAS,yBAA8B,KACtC,oBAyCF,CAAC"}

package/dist/useRenderImageFlow.js

@@ -1,6 +1,6 @@
 'use client';
 import { useCallback, useState } from 'react';
-import { useRenderLightbox } from './useRenderLightbox';
+import { useRenderLightbox } from './useRenderLightbox.js';
 const createHistoryId = () => `${Date.now().toString(36)}-${Math.random().toString(36).slice(2, 8)}`;
 export const useRenderImageFlow = (options = {}) => {
     const { onImageRegistered, ...lightboxOptions } = options;

package/dist/useRenderLightbox.d.ts

@@ -1,4 +1,5 @@
-import type { RenderHistoryEntry } from './RenderHistoryPanel';
+import { type ComposerGallerySnapshot } from '@treasuryspatial/render-kit';
+import type { RenderHistoryEntry } from './RenderHistoryPanel.js';
 export type RenderLightboxStatus = 'idle' | 'sending' | 'sent' | 'error';
 export type UseRenderLightboxOptions = {
     shareEndpoint?: string;
@@ -10,17 +11,28 @@ export type UseRenderLightboxOptions = {
     isAdminUser?: boolean;
     user?: string | null;
     name?: string | null;
+    surfaceId?: string | null;
+    mode?: string | null;
+    promptPackId?: string | null;
+    onRestartFromSnapshot?: (entry: RenderHistoryEntry, snapshot: ComposerGallerySnapshot) => void;
 };
 export type RenderLightboxState = {
     entry: RenderHistoryEntry | null;
     src: string;
     alt: string;
     status: RenderLightboxStatus;
+    statusText: string;
     shortId: string | null;
     publicUrl: string;
     open: (entry: RenderHistoryEntry | null, src: string, alt: string) => void;
     close: () => void;
-    submitToGallery: () => Promise<void>;
+    shareImage: (entry?: RenderHistoryEntry | null, src?: string) => Promise<void>;
+    copyPrompt: (entry?: RenderHistoryEntry | null) => Promise<void>;
+    copyPublicLink: (entry?: RenderHistoryEntry | null, src?: string) => Promise<void>;
+    copyImageLink: (entry?: RenderHistoryEntry | null, src?: string) => Promise<void>;
+    downloadImage: (entry?: RenderHistoryEntry | null, src?: string) => void;
+    restartFromSnapshot: (entry?: RenderHistoryEntry | null) => Promise<void>;
+    submitToGallery: (entry?: RenderHistoryEntry | null, src?: string) => Promise<void>;
 };
 export declare const useRenderLightbox: (options?: UseRenderLightboxOptions) => RenderLightboxState;
 //# sourceMappingURL=useRenderLightbox.d.ts.map

package/dist/useRenderLightbox.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useRenderLightbox.d.ts","sourceRoot":"","sources":["../src/useRenderLightbox.ts"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;AAE/D,MAAM,MAAM,oBAAoB,GAAG,MAAM,GAAG,SAAS,GAAG,MAAM,GAAG,OAAO,CAAC;AAEzE,MAAM,MAAM,wBAAwB,GAAG;IACrC,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,gBAAgB,CAAC,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,MAAM,CAAC;IAC3C,YAAY,CAAC,EAAE,CAAC,KAAK,EAAE,kBAAkB,KAAK,MAAM,CAAC;IACrD,aAAa,CAAC,EAAE,CAAC,UAAU,EAAE,MAAM,EAAE,OAAO,CAAC,EAAE,MAAM,GAAG,IAAI,KAAK,MAAM,CAAC;IACxE,cAAc,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,OAAO,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,KAAK,IAAI,CAAC;IAC3E,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,IAAI,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACrB,IAAI,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;CACtB,CAAC;AAEF,MAAM,MAAM,mBAAmB,GAAG;IAChC,KAAK,EAAE,kBAAkB,GAAG,IAAI,CAAC;IACjC,GAAG,EAAE,MAAM,CAAC;IACZ,GAAG,EAAE,MAAM,CAAC;IACZ,MAAM,EAAE,oBAAoB,CAAC;IAC7B,OAAO,EAAE,MAAM,GAAG,IAAI,CAAC;IACvB,SAAS,EAAE,MAAM,CAAC;IAClB,IAAI,EAAE,CAAC,KAAK,EAAE,kBAAkB,GAAG,IAAI,EAAE,GAAG,EAAE,MAAM,EAAE,GAAG,EAAE,MAAM,KAAK,IAAI,CAAC;IAC3E,KAAK,EAAE,MAAM,IAAI,CAAC;IAClB,eAAe,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,CAAC;CACtC,CAAC;AAEF,eAAO,MAAM,iBAAiB,GAAI,UAAS,wBAA6B,KAAG,mBAwI1E,CAAC"}
+{"version":3,"file":"useRenderLightbox.d.ts","sourceRoot":"","sources":["../src/useRenderLightbox.ts"],"names":[],"mappings":"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"}

package/dist/useRenderLightbox.js

@@ -1,40 +1,196 @@
 'use client';
 import { useCallback, useEffect, useMemo, useState } from 'react';
+import { buildImageActionRecord, buildComposerImageApiUrl, isRestartableGallerySnapshot, resolveComposerEffectivePrompt, resolveComposerImageLinks, } from '@treasuryspatial/render-kit';
 export const useRenderLightbox = (options = {}) => {
-    const { shareEndpoint = '/api/share/shortlink', galleryEndpoint = '/api/gallery/submit', encodeShareToken, resolveTitle, buildShareUrl, trackTelemetry, isAdminUser, user, name, } = options;
+    const { shareEndpoint = '/api/share/shortlink', galleryEndpoint = '/api/gallery/submit', encodeShareToken, resolveTitle, buildShareUrl, trackTelemetry, isAdminUser, user, name, surfaceId, mode, promptPackId, onRestartFromSnapshot, } = options;
     const [entry, setEntry] = useState(null);
     const [src, setSrc] = useState('');
     const [alt, setAlt] = useState('');
     const [shortId, setShortId] = useState(null);
     const [status, setStatus] = useState('idle');
+    const [statusText, setStatusText] = useState('');
+    const toAbsoluteUrl = useCallback((value) => {
+        if (!value)
+            return '';
+        if (/^(https?:|data:|blob:)/i.test(value))
+            return value;
+        if (value.startsWith('/') && typeof window !== 'undefined') {
+            return `${window.location.origin}${value}`;
+        }
+        return value;
+    }, []);
+    const getOrigin = useCallback(() => (typeof window !== 'undefined' ? window.location.origin : ''), []);
+    const isShareLikeUrl = useCallback((value) => {
+        if (!value)
+            return false;
+        if (/^(data:|blob:)/i.test(value))
+            return false;
+        try {
+            const parsed = new URL(value, typeof window !== 'undefined' ? window.location.origin : 'https://treasury.space');
+            return (parsed.pathname.startsWith('/i/') ||
+                parsed.pathname.startsWith('/g/') ||
+                parsed.pathname.startsWith('/gallery/') ||
+                parsed.pathname.startsWith('/composer/gallery/'));
+        }
+        catch {
+            return false;
+        }
+    }, []);
+    const resolvePublicUrl = useCallback((targetEntry, targetSrc = src) => {
+        const targetShortId = (targetEntry?.id === entry?.id ? shortId : null) ||
+            targetEntry?.shortId ||
+            targetEntry?.snapshot?.shortId ||
+            null;
+        const links = resolveComposerImageLinks({
+            storage: targetEntry?.storage ?? targetEntry?.snapshot?.storage ?? null,
+            shortId: targetShortId,
+            origin: getOrigin(),
+            fallbackImageUrl: targetSrc,
+        });
+        if (links.pageUrl)
+            return links.pageUrl;
+        if (!targetEntry?.storage?.key) {
+            return targetSrc && /^https?:/i.test(targetSrc) ? targetSrc : '';
+        }
+        if (buildShareUrl)
+            return buildShareUrl(targetEntry.storage.key, targetShortId);
+        if (encodeShareToken) {
+            return `${getOrigin()}/i/${encodeShareToken(targetEntry.storage.key)}`;
+        }
+        return targetSrc && /^https?:/i.test(targetSrc) ? targetSrc : '';
+    }, [buildShareUrl, encodeShareToken, entry?.id, getOrigin, shortId, src]);
+    const resolveAssetUrl = useCallback((targetEntry, targetSrc = src) => {
+        const links = resolveComposerImageLinks({
+            storage: targetEntry?.storage ?? targetEntry?.snapshot?.storage ?? null,
+            shortId: targetEntry?.shortId || targetEntry?.snapshot?.shortId || (targetEntry?.id === entry?.id ? shortId : null),
+            origin: getOrigin(),
+            fallbackImageUrl: targetSrc,
+        });
+        if (links.directImageUrl)
+            return links.directImageUrl;
+        const canonicalStorageUrl = buildComposerImageApiUrl(targetEntry?.storage);
+        if (canonicalStorageUrl) {
+            return toAbsoluteUrl(canonicalStorageUrl);
+        }
+        const storageUrl = String(targetEntry?.storage?.url || '').trim();
+        if (storageUrl && !isShareLikeUrl(storageUrl)) {
+            if (/^https?:/i.test(storageUrl) || /^data:/i.test(storageUrl) || /^blob:/i.test(storageUrl)) {
+                return storageUrl;
+            }
+            if (storageUrl.startsWith('/')) {
+                return toAbsoluteUrl(storageUrl);
+            }
+        }
+        if (targetEntry?.storage?.key && typeof window !== 'undefined') {
+            return `${window.location.origin}/api/images/image?key=${encodeURIComponent(targetEntry.storage.key)}`;
+        }
+        if (targetSrc && (/^https?:/i.test(targetSrc) || /^data:/i.test(targetSrc) || /^blob:/i.test(targetSrc))) {
+            return targetSrc;
+        }
+        return '';
+    }, [entry?.id, getOrigin, isShareLikeUrl, shortId, src, toAbsoluteUrl]);
+    const publicUrl = useMemo(() => resolvePublicUrl(entry, src), [entry, resolvePublicUrl, src]);
+    const buildEntrySnapshot = useCallback((targetEntry) => {
+        if (targetEntry.snapshot)
+            return targetEntry.snapshot;
+        return {
+            id: targetEntry.snapshotId || targetEntry.id,
+            operationId: targetEntry.operationId || null,
+            interactionId: targetEntry.interactionId || null,
+            requestKind: targetEntry.requestKind || (targetEntry.kind === 'capture' ? 'render' : 'adapt'),
+            modeId: targetEntry.modeId || mode || null,
+            promptPackId: targetEntry.promptPackId || promptPackId || null,
+            title: targetEntry.title || null,
+            prompt: targetEntry.prompt || null,
+            fullPrompt: targetEntry.fullPrompt || null,
+            manifest: targetEntry.manifest ?? null,
+            galleryStatus: targetEntry.galleryStatus || null,
+            referenceImages: targetEntry.referenceImages ?? null,
+            baseImage: targetEntry.baseImage ?? null,
+            storage: targetEntry.storage
+                ? {
+                    bucket: targetEntry.storage.bucket,
+                    key: targetEntry.storage.key,
+                    metaKey: targetEntry.storage.metaKey ?? null,
+                    url: targetEntry.storage.url ?? null,
+                }
+                : null,
+        };
+    }, [mode, promptPackId]);
+    const ensureShortlink = useCallback(async (targetEntry) => {
+        if (!targetEntry?.storage?.key || !shareEndpoint)
+            return targetEntry?.shortId || targetEntry?.snapshot?.shortId || '';
+        const existing = targetEntry.shortId || targetEntry.snapshot?.shortId || (targetEntry.id === entry?.id ? shortId : null);
+        if (existing)
+            return existing;
+        const response = await fetch(shareEndpoint, {
+            method: 'POST',
+            headers: { 'Content-Type': 'application/json' },
+            body: JSON.stringify({
+                key: targetEntry.storage.key,
+                metaKey: targetEntry.storage.metaKey ?? null,
+                title: resolveTitle?.(targetEntry) ?? targetEntry.title ?? '',
+                user: user ?? '',
+                name: name ?? '',
+            }),
+        });
+        const data = await response.json().catch(() => null);
+        const nextShortId = typeof data?.shortId === 'string' ? data.shortId : '';
+        if (nextShortId && targetEntry.id === entry?.id)
+            setShortId(nextShortId);
+        return nextShortId;
+    }, [entry?.id, name, resolveTitle, shareEndpoint, shortId, user]);
+    const buildTelemetryPayload = useCallback((payload = {}, targetEntry = entry, targetPublicUrl = publicUrl, imageActionKind, imageActionStatus) => ({
+        surfaceId: surfaceId ?? undefined,
+        mode: mode ?? undefined,
+        promptPackId: promptPackId ?? undefined,
+        entryId: targetEntry?.id,
+        snapshotId: targetEntry?.snapshotId || targetEntry?.snapshot?.id,
+        operationId: targetEntry?.operationId || targetEntry?.snapshot?.operationId,
+        requestKind: targetEntry?.requestKind || targetEntry?.snapshot?.requestKind,
+        galleryStatus: targetEntry?.galleryStatus || targetEntry?.snapshot?.galleryStatus,
+        title: targetEntry?.title,
+        storageKey: targetEntry?.storage?.key,
+        storageUrl: targetEntry?.storage?.url,
+        publicUrl: targetPublicUrl || undefined,
+        imageAction: targetEntry
+            ? buildImageActionRecord({
+                snapshot: targetEntry.snapshot ?? null,
+                imageRecord: targetEntry,
+                kind: imageActionKind,
+                status: imageActionStatus,
+                publicUrl: targetPublicUrl || undefined,
+            })
+            : undefined,
+        ...payload,
+    }), [entry, mode, promptPackId, publicUrl, surfaceId]);
+    const copyText = useCallback(async (value, eventName, targetEntry = entry, targetPublicUrl) => {
+        if (!value)
+            return;
+        try {
+            await navigator.clipboard.writeText(value);
+            trackTelemetry?.(eventName, buildTelemetryPayload(targetPublicUrl ? { publicUrl: targetPublicUrl } : {}, targetEntry, targetPublicUrl, eventName === 'snapshot_copy_prompt' ? 'prompt.copied' : 'image.shared', 'success'));
+        }
+        catch {
+            trackTelemetry?.(`${eventName}_error`, buildTelemetryPayload(targetPublicUrl ? { publicUrl: targetPublicUrl } : {}, targetEntry, targetPublicUrl, eventName === 'snapshot_copy_prompt' ? 'prompt.copied' : 'image.shared', 'error'));
+        }
+    }, [buildTelemetryPayload, entry, trackTelemetry]);
     const open = useCallback((next, nextSrc, nextAlt) => {
         setEntry(next);
         setSrc(nextSrc);
         setAlt(nextAlt);
         setStatus('idle');
-    }, []);
+        setStatusText('');
+        trackTelemetry?.('gallery_open', buildTelemetryPayload({}, next, resolvePublicUrl(next, nextSrc), 'image.opened', 'success'));
+    }, [buildTelemetryPayload, resolvePublicUrl, trackTelemetry]);
     const close = useCallback(() => {
+        trackTelemetry?.('image_lightbox_close', buildTelemetryPayload({}, entry, publicUrl, 'image.closed', 'success'));
         setEntry(null);
         setSrc('');
         setAlt('');
         setStatus('idle');
-    }, []);
-    const publicUrl = useMemo(() => {
-        if (!entry?.storage?.key) {
-            return src && /^https?:/i.test(src) ? src : '';
-        }
-        if (buildShareUrl)
-            return buildShareUrl(entry.storage.key, shortId);
-        if (typeof window === 'undefined')
-            return '';
-        if (shortId) {
-            return `${window.location.origin}/i/${shortId}`;
-        }
-        if (encodeShareToken) {
-            return `${window.location.origin}/i/${encodeShareToken(entry.storage.key)}`;
-        }
-        return src && /^https?:/i.test(src) ? src : '';
-    }, [buildShareUrl, encodeShareToken, entry?.storage?.key, shortId, src]);
+        setStatusText('');
+    }, [buildTelemetryPayload, entry, publicUrl, trackTelemetry]);
     useEffect(() => {
         if (!entry?.storage?.key) {
             setShortId(null);
@@ -72,57 +228,200 @@ export const useRenderLightbox = (options = {}) => {
             cancelled = true;
         };
     }, [entry?.storage?.key, entry?.storage?.metaKey, entry?.title, name, resolveTitle, shareEndpoint, user]);
-    const submitToGallery = useCallback(async () => {
-        if (!entry?.storage?.bucket || !entry?.storage?.key) {
+    const submitToGallery = useCallback(async (targetEntry = entry, targetSrc = src) => {
+        if (!targetEntry?.storage?.bucket || !targetEntry?.storage?.key) {
             setStatus('error');
+            setStatusText('Image storage is missing. Gallery submission is blocked until this render has a real stored asset.');
             return;
         }
         setStatus('sending');
-        const title = resolveTitle?.(entry) ?? entry.title ?? '';
-        const s3Url = entry.storage.url || `s3://${entry.storage.bucket}/${entry.storage.key}`;
-        const fullPrompt = entry.fullPrompt ?? entry.prompt ?? '';
+        setStatusText(Boolean(isAdminUser) ? 'Publishing to gallery…' : 'Proposing to gallery…');
+        const title = resolveTitle?.(targetEntry) ?? targetEntry.title ?? '';
+        const s3Url = `s3://${targetEntry.storage.bucket}/${targetEntry.storage.key}`;
+        const fullPrompt = resolveComposerEffectivePrompt({
+            promptCompilation: targetEntry.promptCompilation ?? targetEntry.snapshot?.promptCompilation ?? null,
+            fullPrompt: targetEntry.fullPrompt ?? targetEntry.snapshot?.fullPrompt ?? null,
+            prompt: targetEntry.prompt ?? targetEntry.snapshot?.prompt ?? null,
+        });
+        const targetPublicUrl = resolvePublicUrl(targetEntry, targetSrc);
         try {
             const response = await fetch(galleryEndpoint, {
                 method: 'POST',
                 headers: { 'Content-Type': 'application/json' },
                 body: JSON.stringify({
                     s3Url,
-                    bucket: entry.storage.bucket,
-                    key: entry.storage.key,
-                    metaKey: entry.storage.metaKey,
+                    bucket: targetEntry.storage.bucket,
+                    key: targetEntry.storage.key,
+                    metaKey: targetEntry.storage.metaKey,
+                    snapshotId: targetEntry.snapshotId || targetEntry.snapshot?.id || null,
                     prompt: fullPrompt,
                     title,
+                    promptPackId: targetEntry.promptPackId || promptPackId || null,
+                    mode: targetEntry.modeId || mode || null,
+                    toolId: targetEntry.snapshot?.toolId || null,
+                    operationId: targetEntry.operationId || targetEntry.snapshot?.operationId || null,
                     direct: Boolean(isAdminUser),
                 }),
             });
-            if (!response.ok) {
-                throw new Error('gallery submission failed');
+            const data = await response.json().catch(() => null);
+            if (!response.ok || !data?.success) {
+                throw new Error(data?.error || 'gallery submission failed');
+            }
+            if (isAdminUser && data?.published !== true) {
+                throw new Error(`gallery submission was not published (${String(data?.status || 'unknown')})`);
             }
             trackTelemetry?.('gallery_submission', {
                 s3Url,
-                bucket: entry.storage.bucket,
-                key: entry.storage.key,
-                metaKey: entry.storage.metaKey,
+                bucket: targetEntry.storage.bucket,
+                key: targetEntry.storage.key,
+                metaKey: targetEntry.storage.metaKey,
                 prompt: fullPrompt,
                 title,
                 direct: Boolean(isAdminUser),
-                publicUrl,
+                publicUrl: targetPublicUrl,
+                imageAction: buildImageActionRecord({
+                    snapshot: targetEntry.snapshot ?? null,
+                    imageRecord: targetEntry,
+                    kind: isAdminUser ? 'gallery.published' : 'gallery.submitted',
+                    status: 'success',
+                    publicUrl: targetPublicUrl,
+                }),
             });
+            trackTelemetry?.(isAdminUser ? 'gallery_publish' : 'gallery_submit', buildTelemetryPayload({ direct: Boolean(isAdminUser) }, targetEntry, targetPublicUrl, isAdminUser ? 'gallery.published' : 'gallery.submitted', 'success'));
             setStatus('sent');
+            setStatusText(data?.status === 'published' || isAdminUser
+                ? 'Image published to gallery.'
+                : 'Image proposed to gallery for review.');
+            setEntry((prev) => {
+                if (!prev || prev.id !== targetEntry.id)
+                    return prev;
+                const nextStatus = data?.status || (isAdminUser ? 'published' : 'pending');
+                return {
+                    ...prev,
+                    galleryStatus: nextStatus,
+                    snapshot: prev.snapshot
+                        ? {
+                            ...prev.snapshot,
+                            galleryStatus: nextStatus,
+                        }
+                        : prev.snapshot,
+                };
+            });
+        }
+        catch (error) {
+            trackTelemetry?.(isAdminUser ? 'gallery_publish_error' : 'gallery_submit_error', buildTelemetryPayload({}, targetEntry, targetPublicUrl, isAdminUser ? 'gallery.published' : 'gallery.submitted', 'error'));
+            setStatus('error');
+            setStatusText(error?.message || 'Gallery submission failed.');
+        }
+    }, [buildTelemetryPayload, entry, galleryEndpoint, isAdminUser, mode, promptPackId, resolvePublicUrl, resolveTitle, src, trackTelemetry]);
+    const shareImage = useCallback(async (targetEntry = entry, targetSrc = src) => {
+        const targetPublicUrl = resolvePublicUrl(targetEntry, targetSrc);
+        if (!targetPublicUrl)
+            return;
+        try {
+            if (typeof navigator !== 'undefined' && typeof navigator.share === 'function') {
+                await navigator.share({
+                    title: targetEntry?.title || 'render image',
+                    text: mode || 'Composer render',
+                    url: targetPublicUrl,
+                });
+            }
+            else {
+                await navigator.clipboard.writeText(targetPublicUrl);
+            }
+            trackTelemetry?.('snapshot_share', buildTelemetryPayload({}, targetEntry, targetPublicUrl, 'image.shared', 'success'));
         }
         catch {
+            trackTelemetry?.('snapshot_share_error', buildTelemetryPayload({}, targetEntry, targetPublicUrl, 'image.shared', 'error'));
+        }
+    }, [buildTelemetryPayload, entry, mode, resolvePublicUrl, src, trackTelemetry]);
+    const copyPrompt = useCallback(async (targetEntry = entry) => {
+        const targetPublicUrl = resolvePublicUrl(targetEntry);
+        await copyText(resolveComposerEffectivePrompt({
+            promptCompilation: targetEntry?.promptCompilation ?? targetEntry?.snapshot?.promptCompilation ?? null,
+            fullPrompt: targetEntry?.fullPrompt ?? targetEntry?.snapshot?.fullPrompt ?? null,
+            prompt: targetEntry?.prompt ?? targetEntry?.snapshot?.prompt ?? null,
+        }), 'snapshot_copy_prompt', targetEntry, targetPublicUrl);
+    }, [copyText, entry, resolvePublicUrl]);
+    const copyPublicLink = useCallback(async (targetEntry = entry, targetSrc = src) => {
+        const ensuredShortId = await ensureShortlink(targetEntry);
+        const targetPublicUrl = ensuredShortId
+            ? resolveComposerImageLinks({
+                storage: targetEntry?.storage ?? targetEntry?.snapshot?.storage ?? null,
+                shortId: ensuredShortId,
+                origin: getOrigin(),
+                fallbackImageUrl: targetSrc,
+            }).pageUrl
+            : resolvePublicUrl(targetEntry, targetSrc);
+        await copyText(targetPublicUrl, 'snapshot_copy_public_link', targetEntry, targetPublicUrl);
+    }, [copyText, ensureShortlink, entry, getOrigin, resolvePublicUrl, src]);
+    const copyImageLink = useCallback(async (targetEntry = entry, targetSrc = src) => {
+        const ensuredShortId = await ensureShortlink(targetEntry);
+        const imageUrl = ensuredShortId
+            ? resolveComposerImageLinks({
+                storage: targetEntry?.storage ?? targetEntry?.snapshot?.storage ?? null,
+                shortId: ensuredShortId,
+                origin: getOrigin(),
+                fallbackImageUrl: targetSrc,
+            }).directImageUrl
+            : resolveAssetUrl(targetEntry, targetSrc);
+        await copyText(imageUrl, 'snapshot_copy_image_link', targetEntry);
+    }, [copyText, ensureShortlink, entry, getOrigin, resolveAssetUrl, src]);
+    const downloadImage = useCallback((targetEntry = entry, targetSrc = src) => {
+        const targetPublicUrl = resolvePublicUrl(targetEntry, targetSrc);
+        const href = resolveAssetUrl(targetEntry, targetSrc);
+        if (!href || typeof document === 'undefined')
+            return;
+        const link = document.createElement('a');
+        link.href = href;
+        link.download = `${(targetEntry?.title || 'render-image').replace(/\s+/g, '-').toLowerCase()}.png`;
+        document.body.appendChild(link);
+        link.click();
+        link.remove();
+        trackTelemetry?.('snapshot_download', buildTelemetryPayload({}, targetEntry, targetPublicUrl, 'image.downloaded', 'success'));
+    }, [buildTelemetryPayload, entry, resolveAssetUrl, resolvePublicUrl, src, trackTelemetry]);
+    const restartFromSnapshot = useCallback(async (targetEntry = entry) => {
+        if (!targetEntry)
+            return;
+        const targetPublicUrl = resolvePublicUrl(targetEntry);
+        let snapshot = buildEntrySnapshot(targetEntry);
+        if (!isRestartableGallerySnapshot(snapshot) && targetEntry.storage?.metaKey) {
+            try {
+                const response = await fetch(`/api/images/meta?key=${encodeURIComponent(targetEntry.storage.metaKey)}`);
+                const data = await response.json().catch(() => null);
+                if (response.ok && data?.success && data?.meta?.snapshot) {
+                    snapshot = data.meta.snapshot;
+                }
+            }
+            catch {
+                // Restart failure is reported below through status and telemetry.
+            }
+        }
+        if (!isRestartableGallerySnapshot(snapshot)) {
             setStatus('error');
+            setStatusText('Saved snapshot is incomplete. Restart is blocked until this image has full durable snapshot metadata.');
+            trackTelemetry?.('snapshot_restart_error', buildTelemetryPayload({}, targetEntry, targetPublicUrl, 'snapshot.restarted', 'error'));
+            return;
         }
-    }, [entry, galleryEndpoint, isAdminUser, publicUrl, resolveTitle, trackTelemetry]);
+        onRestartFromSnapshot?.(targetEntry, snapshot);
+        trackTelemetry?.('snapshot_restart', buildTelemetryPayload({}, targetEntry, targetPublicUrl, 'snapshot.restarted', 'success'));
+    }, [buildEntrySnapshot, buildTelemetryPayload, entry, onRestartFromSnapshot, resolvePublicUrl, trackTelemetry]);
     return {
         entry,
         src,
         alt,
         status,
+        statusText,
         shortId,
         publicUrl,
         open,
         close,
+        shareImage,
+        copyPrompt,
+        copyPublicLink,
+        copyImageLink,
+        downloadImage,
+        restartFromSnapshot,
         submitToGallery,
     };
 };

package/package.json

@@ -1,8 +1,8 @@
 {
   "name": "@treasuryspatial/prompt-ui-kit",
-  "version": "0.1.14",
+  "version": "0.1.21",
   "type": "module",
-  "license": "UNLICENSED",
+  "license": "MIT",
   "main": "./dist/index.js",
   "types": "./dist/index.d.ts",
   "exports": {
@@ -18,15 +18,17 @@
     "access": "public"
   },
   "dependencies": {
-    "@treasuryspatial/render-kit": "^0.1.17"
+    "@treasuryspatial/render-kit": "^0.1.23",
+    "styled-components": "^6.1.19"
   },
   "peerDependencies": {
     "react": ">=18"
   },
   "devDependencies": {
-    "react": "19.1.0",
     "@types/react": "^19",
-    "@types/react-dom": "^19"
+    "@types/react-dom": "^19",
+    "@types/styled-components": "^5.1.34",
+    "react": "19.1.0"
   },
   "scripts": {
     "build": "tsc -b",