dsh-image-gen 0.9.0 → 0.9.2

package/lib/client.js

@@ -337,7 +337,7 @@ window.__ModuleLoader__.load({
 			}
 			if (!isRecord(value) || Object.keys(value).length === 0) throw new Error("ComfyUI workflow must be a non-empty API-format JSON object");
 			if (!Object.values(value).some((node) => {
-				const inputs = record$1(node)?.inputs;
+				const inputs = record$2(node)?.inputs;
 				return inputs !== void 0 && containsPromptPlaceholder(inputs);
 			})) throw new Error(`ComfyUI workflow must contain ${COMFYUI_PROMPT_PLACEHOLDER} (or ${LEGACY_PROMPT_PLACEHOLDER}) in a text input`);
 			return value;
@@ -346,7 +346,7 @@ window.__ModuleLoader__.load({
 		function countImagePlaceholders(workflow) {
 			let count = 0;
 			for (const node of Object.values(workflow)) {
-				const inputs = record$1(record$1(node)?.inputs);
+				const inputs = record$2(record$2(node)?.inputs);
 				if (inputs !== void 0 && isImagePlaceholder(inputs[IMAGE_INPUT_KEY])) count += 1;
 			}
 			return count;
@@ -362,7 +362,7 @@ window.__ModuleLoader__.load({
 		function isRecord(value) {
 			return typeof value === "object" && value !== null && !Array.isArray(value);
 		}
-		function record$1(value) {
+		function record$2(value) {
 			return isRecord(value) ? value : void 0;
 		}
 		//#endregion
@@ -116729,8 +116729,27 @@ img.ProseMirror-separator {
 		//#region lib/types/client/tl/tl-canvas-bridge.js
 		const pending$1 = /* @__PURE__ */ new Map();
 		const consumers = /* @__PURE__ */ new Set();
+		const availabilityListeners = /* @__PURE__ */ new Set();
 		let delivering = false;
 		let generation = 0;
+		/** History actions must not silently queue into a canvas that is not open. */
+		function hasTlLandingConsumer() {
+			return consumers.size > 0;
+		}
+		function subscribeTlLandingAvailability(listener) {
+			availabilityListeners.add(listener);
+			return () => {
+				availabilityListeners.delete(listener);
+			};
+		}
+		function sendTlLandingToOpenCanvas(item) {
+			if (!hasTlLandingConsumer()) return false;
+			pushTlLandings([{
+				...item,
+				onlyWhileCanvasOpen: true
+			}]);
+			return true;
+		}
 		/** Invalidates async landings that started before the user cleared the canvas. */
 		function getTlLandingGeneration() {
 			return generation;
@@ -116750,12 +116769,18 @@ img.ProseMirror-separator {
 		}
 		/** Register a ready editor. False means it unmounted before committing. */
 		function registerTlLandingConsumer(consumer) {
+			const wasAvailable = hasTlLandingConsumer();
 			consumers.add(consumer);
+			if (!wasAvailable) for (const listener of availabilityListeners) listener();
 			deliver();
+			let registered = true;
 			return () => {
+				if (!registered) return;
+				registered = false;
 				consumers.delete(consumer);
 				if (consumers.size === 0) {
-					for (const [id, item] of pending$1) if (item.fromConversation) pending$1.delete(id);
+					for (const [id, item] of pending$1) if (item.fromConversation || item.onlyWhileCanvasOpen) pending$1.delete(id);
+					for (const listener of availabilityListeners) listener();
 				}
 			};
 		}
@@ -116782,6 +116807,84 @@ img.ProseMirror-separator {
 			}
 		}
 		//#endregion
+		//#region lib/types/client/tl/gallery-image-transfer.js
+		const GALLERY_IMAGE_MIME = "application/x-dsh-image-gen-gallery-image";
+		const EXTENSIONS = /* @__PURE__ */ new Map([
+			["image/png", "png"],
+			["image/jpeg", "jpg"],
+			["image/webp", "webp"],
+			["image/gif", "gif"]
+		]);
+		function galleryLanding(item) {
+			return {
+				galleryId: item.id,
+				attachment: item.attachment,
+				prompt: item.prompt.slice(0, 120),
+				provider: item.provider,
+				model: item.model
+			};
+		}
+		/** A real file also works when the host drops custom MIME data between containers. */
+		function startGalleryImageDrag(event, item, blob) {
+			const transfer = event.dataTransfer;
+			const mediaType = blob?.type || item.attachment.mediaType;
+			const extension = EXTENSIONS.get(mediaType);
+			if (!transfer || !blob?.size || !extension) {
+				event.preventDefault();
+				return false;
+			}
+			try {
+				const name = item.id.replace(/[^A-Za-z0-9_-]/g, "_").slice(0, 100) || "image";
+				const file = new File([blob], `${name}.${extension}`, { type: mediaType });
+				transfer.items.clear();
+				if (transfer.items.add(file) === null) throw new Error("Drag file unavailable");
+				transfer.effectAllowed = "copy";
+				try {
+					transfer.setData(GALLERY_IMAGE_MIME, JSON.stringify(galleryLanding(item)));
+				} catch {}
+				return true;
+			} catch {
+				event.preventDefault();
+				return false;
+			}
+		}
+		function readGalleryImageDrop(transfer) {
+			try {
+				const raw = transfer.getData(GALLERY_IMAGE_MIME);
+				if (!raw || raw.length > 64e3) return void 0;
+				const value = JSON.parse(raw);
+				if (!record$1(value) || !text(value.galleryId) || !record$1(value.attachment)) return void 0;
+				const a = value.attachment;
+				if (!text(a.attachmentId) || typeof a.mediaType !== "string" || !EXTENSIONS.has(a.mediaType) || !dimension(a.bytes) || !dimension(a.width) || !dimension(a.height) || a.name !== void 0 && (typeof a.name !== "string" || a.name.length > 1024)) return void 0;
+				if (typeof value.prompt !== "string" || value.prompt.length > 120 || typeof value.provider !== "string" || !text(value.provider) || typeof value.model !== "string" || value.model.length > 1024) return void 0;
+				return {
+					galleryId: value.galleryId,
+					attachment: {
+						attachmentId: a.attachmentId,
+						mediaType: a.mediaType,
+						bytes: a.bytes,
+						width: a.width,
+						height: a.height,
+						...typeof a.name === "string" ? { name: a.name } : {}
+					},
+					prompt: value.prompt,
+					provider: value.provider,
+					model: value.model
+				};
+			} catch {
+				return;
+			}
+		}
+		function record$1(value) {
+			return typeof value === "object" && value !== null && !Array.isArray(value);
+		}
+		function text(value) {
+			return typeof value === "string" && value.length > 0 && value.length <= 1024;
+		}
+		function dimension(value) {
+			return typeof value === "number" && Number.isSafeInteger(value) && value >= 0;
+		}
+		//#endregion
 		//#region lib/types/client/tl/studio-tl-canvas.js
 		/**
 		* Infinite canvas surface for the Studio workbench, backed by tldraw.
@@ -116850,7 +116953,7 @@ img.ProseMirror-separator {
 			const collapsed = prompt.replace(/\s+/g, " ").trim();
 			return collapsed.length === 0 ? void 0 : collapsed.slice(0, 120);
 		}
-		async function landTlItems(editor, items, isActive) {
+		async function landTlItems(editor, items, isActive, onUnreadable) {
 			const landedIds = landedIdsOf(editor);
 			const pending = items.filter((item) => !landedIds.has(item.galleryId));
 			if (pending.length === 0) return true;
@@ -116879,6 +116982,7 @@ img.ProseMirror-separator {
 					});
 				} catch (error) {
 					console.warn("[dsh-image-gen] canvas landing skipped (attachment unreadable):", item.galleryId, error);
+					if (isActive()) onUnreadable?.();
 					continue;
 				}
 				const size = displaySizeOf(item.attachment);
@@ -116985,9 +117089,12 @@ img.ProseMirror-separator {
 				phase: "idle",
 				count: 0
 			});
+			const [landingError, setLandingError] = (0, react.useState)(false);
 			const retrySync = (0, react.useRef)(() => {});
+			const editorRef = (0, react.useRef)(null);
 			const onMount = (0, react.useCallback)((editor) => {
 				let active = true;
+				editorRef.current = editor;
 				editor.run(() => editor.selectNone());
 				mountedEditors.add(editor);
 				applyBrandTheme(editor);
@@ -116996,11 +117103,13 @@ img.ProseMirror-separator {
 				console.info(`[dsh-image-gen] tldraw mounted (instance ${editor.id})`);
 				const stopLanding = registerTlLandingConsumer((items) => {
 					const generation = getTlLandingGeneration();
-					return landTlItems(editor, items, () => active && generation === getTlLandingGeneration());
+					setLandingError(false);
+					return landTlItems(editor, items, () => active && generation === getTlLandingGeneration(), () => setLandingError(true));
 				});
 				let stopSync = startCanvasSync(editor, setSyncStatus);
 				retrySync.current = () => stopSync.retry();
 				const clear = () => {
+					setLandingError(false);
 					stopSync();
 					editor.complete();
 					editor.run(() => {
@@ -117024,6 +117133,7 @@ img.ProseMirror-separator {
 				mountedCanvases.add(clear);
 				return () => {
 					active = false;
+					if (editorRef.current === editor) editorRef.current = null;
 					mountedEditors.delete(editor);
 					mountedCanvases.delete(clear);
 					stopLanding();
@@ -117035,17 +117145,30 @@ img.ProseMirror-separator {
 			const statusText = lang === "en" ? syncStatus.phase === "ready" ? `Selection ready · ${syncStatus.count} shapes` : syncStatus.phase === "preparing" ? `Preparing selection · ${syncStatus.count} shapes…` : "Selection sync failed" : syncStatus.phase === "ready" ? `选区已就绪 · ${syncStatus.count} 个元素` : syncStatus.phase === "preparing" ? `正在准备选区 · ${syncStatus.count} 个元素…` : "选区同步失败";
 			return (0, react_jsx_runtime.jsxs)("div", {
 				className: "dsh-ig-tl-canvas",
+				onDropCapture: (event) => {
+					const item = readGalleryImageDrop(event.dataTransfer);
+					const editor = editorRef.current;
+					if (!item || !editor) return;
+					event.preventDefault();
+					event.stopPropagation();
+					setLandingError(false);
+					const generation = getTlLandingGeneration();
+					landTlItems(editor, [item], () => editorRef.current === editor && generation === getTlLandingGeneration(), () => setLandingError(true)).catch((error) => {
+						if (editorRef.current === editor) setLandingError(true);
+						console.warn("[dsh-image-gen] history image drop failed:", error);
+					});
+				},
 				children: [(0, react_jsx_runtime.jsx)(Tldraw, {
 					persistenceKey: "dsh-image-gen-workbench-v1",
 					sessionId,
 					components: TL_COMPONENTS,
 					onMount
-				}), syncStatus.phase !== "idle" && (0, react_jsx_runtime.jsxs)("div", {
+				}), (landingError || syncStatus.phase !== "idle") && (0, react_jsx_runtime.jsxs)("div", {
 					className: "dsh-ig-canvas-sync-status",
-					"data-phase": syncStatus.phase,
+					"data-phase": landingError ? "error" : syncStatus.phase,
 					role: "status",
 					"aria-live": "polite",
-					children: [(0, react_jsx_runtime.jsxs)("span", { children: [statusText, syncStatus.phase === "error" ? `：${canvasSyncError(syncStatus.error, lang)}` : ""] }), syncStatus.phase === "error" && (0, react_jsx_runtime.jsx)("button", {
+					children: [(0, react_jsx_runtime.jsx)("span", { children: landingError ? lang === "en" ? "Could not read the original image. Reload it and try again." : "无法读取原图，请重新加载图片后重试。" : (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [statusText, syncStatus.phase === "error" ? `：${canvasSyncError(syncStatus.error, lang)}` : ""] }) }), !landingError && syncStatus.phase === "error" && (0, react_jsx_runtime.jsx)("button", {
 						type: "button",
 						onClick: () => retrySync.current(),
 						children: lang === "en" ? "Retry" : "重试"
@@ -117062,6 +117185,26 @@ img.ProseMirror-separator {
 			return en ? "Check the connection or re-import an unavailable image, then retry." : "请检查连接；若原图已失效，请重新导入后重试。";
 		}
 		//#endregion
+		//#region lib/types/client/tl/gallery-canvas-button.js
+		/** An explicit alternative to native dragging, including a visible unavailable state. */
+		const GalleryCanvasButton = ({ item, lang, disabled, className, onToast }) => {
+			const available = (0, react.useSyncExternalStore)(subscribeTlLandingAvailability, hasTlLandingConsumer, () => false);
+			const open = lang === "en" ? "Open the infinite canvas first" : "请先打开无限画布";
+			const title = !available ? open : disabled ? lang === "en" ? "Wait for the image to load" : "请等待图片加载完成" : lang === "en" ? "Send to canvas" : "发送到画布";
+			return (0, react_jsx_runtime.jsx)("button", {
+				type: "button",
+				className,
+				title,
+				"aria-label": title,
+				disabled: !available || disabled,
+				onClick: (event) => {
+					event.stopPropagation();
+					onToast(sendTlLandingToOpenCanvas(galleryLanding(item)) ? lang === "en" ? "Sent to canvas" : "已发送到画布" : open);
+				},
+				children: (0, react_jsx_runtime.jsx)(Frame, { size: 14 })
+			});
+		};
+		//#endregion
 		//#region lib/types/client/studio-view.js
 		/** Below this workbench width the recent-generations rail folds automatically. */
 		const WORKBENCH_NARROW_WIDTH = 560;
@@ -118351,6 +118494,8 @@ img.ProseMirror-separator {
 										}) : displayItems.map((item) => (0, react_jsx_runtime.jsx)(RecentItem, {
 											item,
 											active: selected?.id === item.id,
+											lang,
+											onToast: flash,
 											onClick: () => selectItem(item)
 										}, item.id)), items.length > visibleLimit && (0, react_jsx_runtime.jsx)("button", {
 											type: "button",
@@ -118376,6 +118521,8 @@ img.ProseMirror-separator {
 													children: list.map((item) => (0, react_jsx_runtime.jsx)(RecentItem, {
 														item,
 														active: false,
+														lang,
+														onToast: flash,
 														onClick: () => void applyFavoriteImage(item)
 													}, item.id))
 												});
@@ -119602,23 +119749,37 @@ img.ProseMirror-separator {
 				label: opt.value === "__default__" ? lang === "en" ? "Provider default (omit)" : "渠道默认（不发送）" : LOCALIZED_QUALITIES[opt.value]?.[lang] ?? opt.label
 			}));
 		}
-		const RecentItem = ({ item, active, onClick }) => {
+		const RecentItem = ({ item, active, lang, onToast, onClick }) => {
 			const [setRef, inView] = useInView();
 			const image = useAttachmentImage(item.attachment, inView);
-			return (0, react_jsx_runtime.jsx)("button", {
-				ref: setRef,
-				type: "button",
+			return (0, react_jsx_runtime.jsxs)("div", {
 				className: `dsh-ig-recent-item ${active ? "is-active" : ""}`,
-				onClick,
-				title: item.prompt,
-				children: (0, react_jsx_runtime.jsx)("div", {
-					className: "dsh-ig-recent-thumb",
-					children: image.url !== null ? (0, react_jsx_runtime.jsx)("img", {
-						src: image.url,
-						alt: "",
-						loading: "lazy"
-					}) : (0, react_jsx_runtime.jsx)(ImagePlus, { size: 18 })
-				})
+				children: [(0, react_jsx_runtime.jsx)("button", {
+					ref: setRef,
+					type: "button",
+					className: "dsh-ig-recent-select",
+					onClick,
+					title: item.prompt,
+					draggable: Boolean(image.blob?.size),
+					onDragStart: (event) => {
+						startGalleryImageDrag(event, item, image.blob);
+					},
+					children: (0, react_jsx_runtime.jsx)("div", {
+						className: "dsh-ig-recent-thumb",
+						children: image.url !== null ? (0, react_jsx_runtime.jsx)("img", {
+							src: image.url,
+							alt: "",
+							loading: "lazy",
+							draggable: false
+						}) : (0, react_jsx_runtime.jsx)(ImagePlus, { size: 18 })
+					})
+				}), (0, react_jsx_runtime.jsx)(GalleryCanvasButton, {
+					item,
+					lang,
+					disabled: !image.blob?.size,
+					className: "dsh-ig-recent-send",
+					onToast
+				})]
 			});
 		};
 		const FavoriteFolderBar = ({ folders, active, onSelect, onDelete, deleteLabel }) => {
@@ -123457,6 +123618,7 @@ img.ProseMirror-separator {
 						}) : (0, react_jsx_runtime.jsx)("div", {
 							className: "dsh-ig-gallery-grid",
 							children: filteredItems.map((item, idx) => (0, react_jsx_runtime.jsx)(GalleryCard, {
+								lang,
 								item,
 								index: idx,
 								isManageMode,
@@ -123841,7 +124003,7 @@ img.ProseMirror-separator {
 				]
 			});
 		};
-		const GalleryCard = ({ item, index: _index, isManageMode, isSelected, t, onClick, onToggleSelect, onRequestDelete, onPreview: _onPreview, onBlobLoaded, onToast }) => {
+		const GalleryCard = ({ lang, item, index: _index, isManageMode, isSelected, t, onClick, onToggleSelect, onRequestDelete, onPreview: _onPreview, onBlobLoaded, onToast }) => {
 			const [url, setUrl] = (0, react.useState)();
 			const [blob, setBlob] = (0, react.useState)();
 			const [loading, setLoading] = (0, react.useState)(true);
@@ -123931,11 +124093,23 @@ img.ProseMirror-separator {
 							className: "dsh-ig-gallery-card-img",
 							src: url,
 							alt: item.prompt,
-							loading: "lazy"
+							loading: "lazy",
+							draggable: !isManageMode && Boolean(blob?.size),
+							onDragStart: (event) => {
+								if (isManageMode) event.preventDefault();
+								else startGalleryImageDrag(event, item, blob);
+							}
 						}),
 						(0, react_jsx_runtime.jsxs)("div", {
 							className: "dsh-ig-card-toolbar",
 							children: [
+								!isManageMode && (0, react_jsx_runtime.jsx)(GalleryCanvasButton, {
+									item,
+									lang,
+									disabled: !blob?.size,
+									className: "dsh-ig-tool-btn",
+									onToast
+								}),
 								(0, react_jsx_runtime.jsx)("button", {
 									type: "button",
 									className: "dsh-ig-tool-btn",
@@ -124229,12 +124403,48 @@ img.ProseMirror-separator {
 		}
 		//#endregion
 		//#region lib/types/client/tl/conversation-landings.js
+		/** Keep one landing subscription while the optional UI service loads or unloads. */
+		function createCanvasSessionSelection() {
+			let current;
+			const listeners = /* @__PURE__ */ new Set();
+			const notify = () => {
+				for (const listener of listeners) listener();
+			};
+			return {
+				getSnapshot: () => current?.getSnapshot(),
+				subscribe: (listener) => {
+					listeners.add(listener);
+					return () => {
+						listeners.delete(listener);
+					};
+				},
+				bind(source) {
+					current = source;
+					const stop = source.subscribe(notify);
+					notify();
+					return () => {
+						stop();
+						if (current !== source) return;
+						current = void 0;
+						notify();
+					};
+				}
+			};
+		}
+		function currentSessionId(sessions, selection) {
+			const selected = selection?.getSnapshot();
+			if (selected !== void 0) return selected.key || void 0;
+			const snapshot = sessions.list.getSnapshot();
+			if (snapshot.current) return snapshot.current;
+			const mainViews = Object.values(snapshot.byId ?? {}).filter((row) => (row.retainedBy?.mainView ?? 0) > 0);
+			return mainViews.length === 1 ? mainViews[0].id : void 0;
+		}
 		/** Subscribe to live additions, never to card rendering or history replay. */
-		function startConversationLandings(sessions) {
+		function startConversationLandings(sessions, selection) {
 			let source;
 			let stopEvents;
 			const followCurrent = () => {
-				const id = sessions.list.getSnapshot().current;
+				const id = currentSessionId(sessions, selection);
 				const next = id === void 0 ? void 0 : sessions.binding(id)?.eventSource;
 				if (next === source) return;
 				stopEvents?.();
@@ -124263,15 +124473,20 @@ img.ProseMirror-separator {
 				});
 			};
 			const stopList = sessions.list.subscribe(followCurrent);
+			const stopSelection = selection?.subscribe(followCurrent);
 			followCurrent();
 			return () => {
 				stopList();
+				stopSelection?.();
 				stopEvents?.();
 			};
 		}
 		//#endregion
 		//#region lib/types/client/studio-style.js
 		const STUDIO_STYLE = `
+.dsh-ig-recent-select{display:block;width:100%;height:100%;padding:0;border:0;border-radius:inherit;background:transparent;cursor:pointer}
+.dsh-ig-recent-send{position:absolute;right:3px;bottom:3px;display:flex;align-items:center;justify-content:center;width:25px;height:25px;padding:0;border:1px solid var(--ig-line);border-radius:5px;background:var(--ig-bg-panel);cursor:pointer}
+.dsh-ig-recent-send:disabled{opacity:.45;cursor:not-allowed}
 .dsh-ig-gallery-page-body.is-workbench{flex:1 1 0;height:100%;min-height:0;padding:0;overflow:hidden;display:flex;flex-direction:column}
 .dsh-ig-workbench{--ig-blue:var(--dsw-alias-brand-primary-new-colorprimary-new-color,#2f64f5);--ig-blue-line:color-mix(in srgb,var(--ig-blue) 45%,transparent);--ig-line:var(--dsw-alias-border-l2,color-mix(in srgb,currentColor 11%,transparent));--ig-soft:color-mix(in srgb,currentColor 4%,transparent);--ig-fg:var(--dsw-alias-label-primary,var(--foreground,#182033));--ig-fg-2:var(--dsw-alias-label-secondary,#5a6478);--ig-fg-3:var(--dsw-alias-label-tertiary,#717b90);--ig-fg-cap:var(--dsw-alias-label-caption,#929bad);--ig-bg:var(--dsw-alias-bg-layer-1,var(--background,#fff));--ig-bg-panel:var(--dsw-alias-bg-layer-2,color-mix(in srgb,var(--background,#fff) 96%,#f5f7fb));--ig-bg-thumb:var(--dsw-alias-bg-skeleton,#eef1f7);--ig-danger:#b63737;--ig-warn:#8b671c;position:relative;display:flex;flex-direction:column;min-height:0;height:100%;overflow:hidden;padding:10px 12px 12px;color:var(--ig-fg);box-sizing:border-box;background:radial-gradient(circle at 60% -20%,rgba(63,104,246,.07),transparent 30%)}
 body[data-ds-dark-theme] .dsh-ig-workbench{--ig-danger:#f08c8c;--ig-warn:#e5b76a}
@@ -125221,7 +125436,7 @@ body[data-ds-dark-theme] .dsh-ig-workbench{--ig-danger:#f08c8c;--ig-warn:#e5b76a
 `;
 		//#endregion
 		//#region lib/types/client/index.js
-		console.info(`[dsh-image-gen] canvas bundle 2026-10-13T08:42:18.331Z`);
+		console.info(`[dsh-image-gen] canvas bundle 2026-10-19T16:02:35.438Z`);
 		/** Right-sidebar tab-type registration id (DSH 0.1.5 `sidebarRightTabs`). */
 		const SIDEBAR_STUDIO_TAB_ID = "dsh-image-gen/studio";
 		/** The tab kind: a page type opened by kind, recognizing no resource address. */
@@ -125296,6 +125511,11 @@ body[data-ds-dark-theme] .dsh-ig-workbench{--ig-danger:#f08c8c;--ig-warn:#e5b76a
 				reset: "重置",
 				resetTitle: "重置为默认官方地址",
 				endpointHintGoogle: "Google 官方地址或反代端点（全路径）。",
+				googleProtocol: "请求协议",
+				googleInteractions: "Interactions（默认）",
+				googleNative: "原生 generateContent",
+				saveGoogleProtocolFirst: "请求协议尚未保存，请先点击保存，再拉取模型或测试连接。",
+				endpointHintGoogleNative: "填写 API 基础地址（如 https://example.com/v1beta）；也兼容 Interactions 或 generateContent 完整地址。",
 				endpointHintOpenAI: "官方 api.openai.com 的 /v1 地址；中转站请使用下方「OpenAI 兼容」行。",
 				endpointHintOpenAICompat: "中转站/自建服务的 OpenAI 兼容 /v1 地址（必填），例如 https://your-relay.example.com/v1。",
 				editFormat: "图生图请求形态",
@@ -125461,6 +125681,11 @@ body[data-ds-dark-theme] .dsh-ig-workbench{--ig-danger:#f08c8c;--ig-warn:#e5b76a
 				reset: "Reset",
 				resetTitle: "Reset to official default URL",
 				endpointHintGoogle: "Official Google endpoint or reverse proxy (full path).",
+				googleProtocol: "Request protocol",
+				googleInteractions: "Interactions (default)",
+				googleNative: "Native generateContent",
+				saveGoogleProtocolFirst: "Save the request protocol before fetching models or testing the connection.",
+				endpointHintGoogleNative: "API base URL (e.g. https://example.com/v1beta). Full Interactions or generateContent URLs also work.",
 				endpointHintOpenAI: "Official api.openai.com /v1 base URL; for relays use the \"OpenAI-compatible\" row below.",
 				endpointHintOpenAICompat: "OpenAI-compatible /v1 base URL of your relay or self-hosted service (required), e.g. https://your-relay.example.com/v1.",
 				editFormat: "Edit request format",
@@ -125881,7 +126106,13 @@ body[data-ds-dark-theme] .dsh-ig-workbench{--ig-danger:#f08c8c;--ig-warn:#e5b76a
 			ctx.inject(["sessions"], (owner) => {
 				const sessions = owner.get("sessions");
 				if (typeof sessions?.binding !== "function" || typeof sessions.list?.subscribe !== "function") return;
-				owner.effect(() => startConversationLandings(sessions), "dsh-image-gen: live canvas images");
+				const selection = createCanvasSessionSelection();
+				owner.effect(() => startConversationLandings(sessions, selection), "dsh-image-gen: live canvas images");
+				owner.inject(["uiSession"], (uiOwner) => {
+					const current = uiOwner.get("uiSession")?.adapter?.current;
+					if (typeof current?.getSnapshot !== "function" || typeof current.subscribe !== "function") return;
+					uiOwner.effect(() => selection.bind(current), "dsh-image-gen: current canvas session");
+				});
 			});
 			ctx.effect(() => {
 				const style = document.createElement("style");
@@ -126098,6 +126329,7 @@ body[data-ds-dark-theme] .dsh-ig-workbench{--ig-danger:#f08c8c;--ig-warn:#e5b76a
 				expanded: false,
 				model: "",
 				baseURL: "",
+				googleNative: false,
 				keyInput: "",
 				keyStatus: "checking",
 				keyInfo: void 0,
@@ -126187,6 +126419,7 @@ body[data-ds-dark-theme] .dsh-ig-workbench{--ig-danger:#f08c8c;--ig-warn:#e5b76a
 				...emptyProviderRow(),
 				model: modelOf(provider, value),
 				baseURL: baseURLOf(provider, value),
+				...provider === "google" ? { googleNative: value?.googleNative === true } : {},
 				...provider === "openai" ? { sizeTableText: editExtraTextOf(value?.openaiSizes) } : {},
 				...provider === "comfyui" ? {
 					workflows: resolveComfyUIWorkflows(value ?? {}),
@@ -126573,6 +126806,7 @@ body[data-ds-dark-theme] .dsh-ig-workbench{--ig-danger:#f08c8c;--ig-warn:#e5b76a
 						if (provider === "openai") for (const tiers of Object.values(sizeTable)) for (const size of Object.values(tiers)) validateOfficialSize(row.model, size);
 						await saveSetting(modelFieldOf(provider), row.model);
 						await saveSetting(baseURLFieldOf(provider), row.baseURL);
+						if (provider === "google") await saveSetting("googleNative", row.googleNative);
 						if (provider === "openai") await saveSetting("openaiSizes", sizeTable);
 						if (provider === "openai-compat") {
 							await saveSetting("openaiCompatEditFormat", row.editFormat);
@@ -126624,6 +126858,7 @@ body[data-ds-dark-theme] .dsh-ig-workbench{--ig-danger:#f08c8c;--ig-warn:#e5b76a
 				const address = row.baseURL.trim();
 				if (address.length === 0) return t("endpointRequired");
 				if (address !== baseURLOf(provider, props.scope.getSnapshot().value).trim()) return t("saveEndpointFirst");
+				if (provider === "google" && row.googleNative !== (props.scope.getSnapshot().value?.googleNative === true)) return t("saveGoogleProtocolFirst");
 			};
 			/** Localize the host's missing-address error while preserving upstream details. */
 			const providerErrorMessage = (message) => message === "Base URL is not configured" ? t("savedEndpointMissing") : message ?? t("testFailed");
@@ -126995,10 +127230,31 @@ body[data-ds-dark-theme] .dsh-ig-workbench{--ig-danger:#f08c8c;--ig-warn:#e5b76a
 									}),
 									(0, react_jsx_runtime.jsx)("span", {
 										className: "dsh-ig-hint",
-										children: t(CLOUD_HINT_KEYS[provider])
+										children: t(provider === "google" && row.googleNative ? "endpointHintGoogleNative" : CLOUD_HINT_KEYS[provider])
 									})
 								]
 							}),
+							provider === "google" ? (0, react_jsx_runtime.jsxs)("label", {
+								className: "dsh-ig-field",
+								children: [(0, react_jsx_runtime.jsx)("span", {
+									className: "dsh-ig-label",
+									children: t("googleProtocol")
+								}), (0, react_jsx_runtime.jsxs)("select", {
+									className: "dsh-ig-input",
+									value: row.googleNative ? "native" : "interactions",
+									onChange: (event) => {
+										updateRow(provider, { googleNative: event.target.value === "native" });
+									},
+									disabled: !settingsWritable,
+									children: [(0, react_jsx_runtime.jsx)("option", {
+										value: "interactions",
+										children: t("googleInteractions")
+									}), (0, react_jsx_runtime.jsx)("option", {
+										value: "native",
+										children: t("googleNative")
+									})]
+								})]
+							}) : null,
 							(0, react_jsx_runtime.jsxs)("label", {
 								className: "dsh-ig-field",
 								children: [