dsh-codex-subscription 2.1.0-beta.5 → 2.1.0

package/README.en.md

@@ -180,11 +180,11 @@ The screenshot above illustrates image viewing and on-image notes; available but
 
 ![Sketch canvas in the Chinese UI: aspect ratio, brushes, shapes, layers and zoom](https://raw.githubusercontent.com/WSL043/dsh-codex-subscription/main/docs/assets/sketch-canvas.png)
 
-Use the composer pen button for manual drawing. In Beta.3, selecting `@sketch` only inserts the Agent entry into the composer; the Agent opens the board after you send your drawing request. You can also choose Open in sketch from an enhanced image preview. Attachment intake and removal use the native DSH component.
+Use the composer pen button for manual drawing. Selecting `@sketch` only inserts the Agent entry into the composer; the Agent opens the board after you send your drawing request. You can also choose Open in sketch from an enhanced image preview. Attachment intake and removal use the native DSH component.
 
-Sketch supports local drafts, image layers, aspect ratios, brushes, lines and shapes, two erasers, undo/redo, pan/zoom and configurable shortcuts. Smoothing processes a completed stroke only after release. Up to 20 drafts stay in the current browser; attaching a sketch never sends it automatically. Its image panel manages only the current sketch, not the conversation library.
+Sketch supports local drafts, image layers, aspect ratios, three brushes (solid ink, grainy pencil and translucent highlighter), lines and shapes, two erasers, undo/redo, pan/zoom and configurable shortcuts. Smoothing processes a completed stroke only after release. Up to 20 drafts stay in the current browser; attaching a sketch never sends it automatically. Its image panel manages only the current sketch, not the conversation library.
 
-Beta.3 adds editable shapes and text, native curves, and a side control for size/opacity. During Agent drawing, you can view, zoom, close the panel or stop drawing; manual edits unlock when it finishes. Automatic completion previews are off by default and can be enabled in Advanced settings. The board requires the current session page; drawing does not continue after closing the page or switching sessions.
+The board supports editable shapes and text, native curves, and a side control for size/opacity. During Agent drawing, you can view, zoom, close the panel or stop drawing; manual edits unlock when it finishes. Automatic completion previews are off by default and can be enabled in Advanced settings. The document, history and run state are retained when switching away and back. Background drawing while viewing another session is not guaranteed. Save before a full-page reload or exit; unsaved recovery is not guaranteed.
 
 **Sketch-to-image example**: draw, click Attach, describe the desired result in the composer, then send.
 
@@ -195,7 +195,9 @@ Beta.3 adds editable shapes and text, native curves, and a side control for size
 The request preserves the mountain and cabin composition while creating a warm watercolor travel illustration with green peaks, an orange roof, a meadow stream and morning light, without the blue outlines. GPT-5.6-Luna made one image-tool call requesting low quality. Luna is the conversation model; the subscription backend determines the actual image model.
 
 <details>
-<summary>Advanced example · 2.1.0-beta.2</summary>
+<summary>Advanced examples</summary>
+
+**Someone Behind the Canvas**
 
 **Astra draws the sketch; GPT Image 2 generates the illustration.** Astra draws 427 strokes across six layers through the native `codex_sketch` interface; Luna then calls the subscription image tool. The request uses `gpt-image-2` at low quality; the server does not report the executing model. This Beta adds PNG export, layered PSD import/export and editable draft files. PSD retains pixel layers; native drafts retain strokes. Sketch canvas and Agent drawing are separate Beta options, both off by default in Advanced settings. Drawing tools are exposed only when Agent drawing is enabled; the agent then automatically opens the current session’s board.
 
@@ -203,7 +205,35 @@ The request preserves the mountain and cabin composition while creating a warm w
 | --- | --- |
 | ![Sketch](https://raw.githubusercontent.com/WSL043/dsh-codex-subscription/main/docs/assets/sketch-advanced-source.png) | ![Result](https://raw.githubusercontent.com/WSL043/dsh-codex-subscription/main/docs/assets/sketch-advanced-result.png) |
 
-[Beta v2.1.0-beta.2](https://github.com/WSL043/dsh-codex-subscription/releases/tag/v2.1.0-beta.2)
+**Sketch reproduction prompt (reconstructed from the artwork, not the original conversation)**
+
+Astra drew the original in stages. This Chinese prompt provides a starting point for the same concept, not a guarantee of an identical result.
+
+```text
+@sketch 用 4:3 横版画板绘制《画布背面有人》：中央偏上是一处撕开的纸洞，洞内是深蓝星空和一位拿颜料桶的小画师；蓝色颜料从桶中流出，形成 S 形河流，流向下方城市。左侧城市保持未上色线稿，右侧城市被暖色点亮，加入纸船与飞鸟。按纸面、洞内世界、颜料河流、城市、画师和细节分层绘制，保留原生可编辑笔画。
+```
+
+**Actual image-generation prompt (original Chinese)**
+
+```text
+请基于本条附加草图实际调用订阅图片工具一次，生成成品插画。quality=low，模型使用当前默认，不切换型号，不额外生成。主题《画布背面有人》：保留4:3横构图、中央偏上的撕纸洞口、洞内拿颜料桶的小画师、流出成为S形河流的蓝色颜料、下方左侧未上色城市与右侧被点亮城市、纸船飞鸟。精修为惊艳的立体纸艺与精细手绘结合的编辑插画，纸张纤维、真实撕边及柔和投影，深靛蓝洞内星月，丰富青蓝颜料层次和流动质感，赭橙画师与暖色建筑，微小清晰的叙事细节。不重构为风景，不添加文字水印。必须使用本条参考图片编辑，不能仅凭文字生成。生成后简短说明完成即可。
+```
+
+Original example released in: [Beta v2.1.0-beta.2](https://github.com/WSL043/dsh-codex-subscription/releases/tag/v2.1.0-beta.2)
+
+**Mona Lisa: Astra sketch → GPT image generation**
+
+Example version: [2.1.0-beta.5](https://github.com/WSL043/dsh-codex-subscription/releases/tag/v2.1.0-beta.5)
+
+Actual results supplied by the user from another computer: Astra draws on a portrait canvas, then GPT image generation turns the sketch into an oil painting.
+
+| Native Astra sketch | GPT-generated oil painting |
+| --- | --- |
+| ![Mona Lisa sketch drawn by Astra](https://raw.githubusercontent.com/WSL043/dsh-codex-subscription/main/docs/assets/sketch-mona-lisa-source.png) | ![Mona Lisa oil painting generated from the sketch](https://raw.githubusercontent.com/WSL043/dsh-codex-subscription/main/docs/assets/sketch-mona-lisa-result.png) |
+
+Original sketch prompt: `@sketch 用竖版画板画一幅《蒙娜丽莎》` (Draw the Mona Lisa on a portrait canvas.)
+
+Original image prompt: `帮我变成油画` (Turn it into an oil painting.)
 
 </details>
 

package/README.md

@@ -179,11 +179,11 @@ ChatGPT 返回可用重置卡时，设置页会把每张卡分别显示为紧凑
 
 ![草图画板实机界面：画布比例、笔刷、形状、图层与缩放](https://raw.githubusercontent.com/WSL043/dsh-codex-subscription/main/docs/assets/sketch-canvas.png)
 
-点击输入框的草图按钮手动画图。Beta.3 中，`@sketch` 是 Agent 绘图入口：选择时只填入输入框，发送绘图请求后才由 Agent 打开画板。图片预览中可选择“进入草图”；上传、粘贴和移除附件仍由 DSH 原生组件处理。
+点击输入框的草图按钮手动画图。`@sketch` 是 Agent 绘图入口：选择时只填入输入框，发送绘图请求后才由 Agent 打开画板。图片预览中可选择“进入草图”；上传、粘贴和移除附件仍由 DSH 原生组件处理。
 
-草图支持多份本地草稿、图片图层、画布比例、三种笔刷、直线和形状、两种橡皮、撤销重做、拖动缩放与可配置快捷键。平滑仅在抬笔后处理整笔路径，不拖慢绘画光标。草稿最多 20 份，仅保存在当前浏览器；附加草图不会自动发送。左侧图片面板只管理当前草图的图片，不是会话图片库。
+草图支持多份本地草稿、图片图层、画布比例、三种笔刷（实色钢笔、颗粒铅笔、半透明荧光笔）、直线和形状、两种橡皮、撤销重做、拖动缩放与可配置快捷键。平滑仅在抬笔后处理整笔路径，不拖慢绘画光标。草稿最多 20 份，仅保存在当前浏览器；附加草图不会自动发送。左侧图片面板只管理当前草图的图片，不是会话图片库。
 
-Beta.3 增加可选中修改的形状与文字、原生曲线，以及侧边粗细/浓度控件。Agent 绘制时可查看、缩放和关闭面板，编辑暂时锁定；顶部可停止绘制，完成后恢复编辑。自动完成预览默认关闭，可在高级设置开启。画板依赖当前会话页面，关闭页面或切换会话不支持继续后台绘制。
+支持可选中修改的形状与文字、原生曲线，以及侧边粗细/浓度控件。Agent 绘制时可查看、缩放和关闭面板，编辑暂时锁定；顶部可停止绘制，完成后恢复编辑。自动完成预览默认关闭，可在高级设置开启。切换会话后再返回会保留画板、历史和运行状态。切到其他会话期间不保证后台绘制；整页刷新或退出前请保存草稿，未保存内容不保证恢复。
 
 **草图生成图片实测**：画好后点击“附加”，在输入框说明想要的效果，再发送。
 
@@ -194,7 +194,9 @@ Beta.3 增加可选中修改的形状与文字、原生曲线，以及侧边粗
 示例要求：保留山峰与小屋的构图，生成温暖的水彩旅行插画，青绿山峰、橙色屋顶、草地小溪与柔和晨光，不保留蓝色线条。此例通过 GPT-5.6-Luna 发起一次图片工具调用，请求低质量；Luna 是对话模型，实际出图型号由订阅后端决定。
 
 <details>
-<summary>进阶展示 · 2.1.0-beta.2</summary>
+<summary>进阶展示</summary>
+
+**《画布背面有人》**
 
 **Astra 绘制草图，GPT Image 2 生成成图。** Astra 通过原生 `codex_sketch` 接口完成 6 层、427 笔绘制，再由 Luna 调用订阅生图工具精修。生图请求使用 `gpt-image-2`、低质量档；服务端未报告实际执行型号。Beta 新增 PNG 导出、分层 PSD 导入导出和可编辑草稿文件；PSD 保留像素图层，原生草稿保留笔画。草图画板与 Agent 绘图均默认关闭，可在高级设置中分别开启。仅开启 Agent 绘图后才向模型提供绘图工具。
 
@@ -202,7 +204,35 @@ Beta.3 增加可选中修改的形状与文字、原生曲线，以及侧边粗
 | --- | --- |
 | ![Sketch](https://raw.githubusercontent.com/WSL043/dsh-codex-subscription/main/docs/assets/sketch-advanced-source.png) | ![Result](https://raw.githubusercontent.com/WSL043/dsh-codex-subscription/main/docs/assets/sketch-advanced-result.png) |
 
-[Beta v2.1.0-beta.2](https://github.com/WSL043/dsh-codex-subscription/releases/tag/v2.1.0-beta.2)
+**草图复现提示词（按原画面整理，非完整原始对话）**
+
+原案例由 Astra 分阶段绘制，下面提供同主题的复现起点，不保证得到完全相同的画面。
+
+```text
+@sketch 用 4:3 横版画板绘制《画布背面有人》：中央偏上是一处撕开的纸洞，洞内是深蓝星空和一位拿颜料桶的小画师；蓝色颜料从桶中流出，形成 S 形河流，流向下方城市。左侧城市保持未上色线稿，右侧城市被暖色点亮，加入纸船与飞鸟。按纸面、洞内世界、颜料河流、城市、画师和细节分层绘制，保留原生可编辑笔画。
+```
+
+**实际生图提示词**
+
+```text
+请基于本条附加草图实际调用订阅图片工具一次，生成成品插画。quality=low，模型使用当前默认，不切换型号，不额外生成。主题《画布背面有人》：保留4:3横构图、中央偏上的撕纸洞口、洞内拿颜料桶的小画师、流出成为S形河流的蓝色颜料、下方左侧未上色城市与右侧被点亮城市、纸船飞鸟。精修为惊艳的立体纸艺与精细手绘结合的编辑插画，纸张纤维、真实撕边及柔和投影，深靛蓝洞内星月，丰富青蓝颜料层次和流动质感，赭橙画师与暖色建筑，微小清晰的叙事细节。不重构为风景，不添加文字水印。必须使用本条参考图片编辑，不能仅凭文字生成。生成后简短说明完成即可。
+```
+
+原案例首发：[Beta v2.1.0-beta.2](https://github.com/WSL043/dsh-codex-subscription/releases/tag/v2.1.0-beta.2)
+
+**《蒙娜丽莎》：Astra 草图 → GPT 生图**
+
+案例版本：[2.1.0-beta.5](https://github.com/WSL043/dsh-codex-subscription/releases/tag/v2.1.0-beta.5)
+
+用户在另一台电脑上的实际效果：先让 Astra 在竖版画板上绘制，再通过 GPT 生图转成油画。
+
+| Astra 原生草图 | GPT 生图：油画效果 |
+| --- | --- |
+| ![Astra 绘制的蒙娜丽莎草图](https://raw.githubusercontent.com/WSL043/dsh-codex-subscription/main/docs/assets/sketch-mona-lisa-source.png) | ![草图转换后的蒙娜丽莎油画](https://raw.githubusercontent.com/WSL043/dsh-codex-subscription/main/docs/assets/sketch-mona-lisa-result.png) |
+
+草图提示词：`@sketch 用竖版画板画一幅《蒙娜丽莎》`
+
+生图提示词：`帮我变成油画`
 
 </details>
 

package/lib/client.js

@@ -71,6 +71,40 @@ window.__ModuleLoader__.load({
 			return normalized;
 		}
 		//#endregion
+		//#region src/sketch-brushes.js
+		const grains = /* @__PURE__ */ new Map();
+		function pencilGrain(context, color) {
+			if (!context.createPattern || typeof document === "undefined") return color;
+			if (!grains.has(color)) {
+				const canvas = document.createElement("canvas");
+				canvas.width = 64;
+				canvas.height = 64;
+				const ctx = canvas.getContext("2d");
+				ctx.fillStyle = color;
+				let seed = 173;
+				for (let y = 0; y < 64; y++) for (let x = 0; x < 64; x++) {
+					seed = Math.imul(seed, 1664525) + 1013904223 >>> 0;
+					const value = seed / 4294967296;
+					if (value < .28) continue;
+					ctx.globalAlpha = .2 + value * .8;
+					ctx.fillRect(x, y, 1, 1);
+				}
+				if (grains.size >= 16) grains.delete(grains.keys().next().value);
+				grains.set(color, canvas);
+			}
+			return context.createPattern(grains.get(color), "repeat") ?? color;
+		}
+		function configureSketchBrush(context, stroke) {
+			const modern = stroke.brushVersion === 2 && stroke.shape === "pen";
+			const brush = stroke.brush ?? "pen";
+			context.lineCap = modern && brush === "marker" ? "butt" : "round";
+			context.lineJoin = "round";
+			context.globalAlpha = (stroke.opacity ?? 1) * (brush === "marker" ? .28 : brush === "pencil" ? modern ? .85 : .65 : 1);
+			context.lineWidth = stroke.width * (brush === "pencil" && !modern ? .55 : 1) * (stroke.pressure ?? 1);
+			context.strokeStyle = modern && brush === "pencil" ? pencilGrain(context, stroke.color) : stroke.color;
+			context.fillStyle = context.strokeStyle;
+		}
+		//#endregion
 		//#region src/sketch-document.js
 		const SKETCH_SIZE = 1024;
 		const MAX_SKETCH_STROKES = 2e3;
@@ -96,10 +130,7 @@ window.__ModuleLoader__.load({
 				const first = stroke.points[0];
 				if (!first) continue;
 				context.globalCompositeOperation = stroke.shape === "eraser" ? "destination-out" : "source-over";
-				context.globalAlpha = (stroke.opacity ?? 1) * (stroke.brush === "marker" ? .28 : stroke.brush === "pencil" ? .65 : 1);
-				context.strokeStyle = stroke.color;
-				context.fillStyle = stroke.color;
-				context.lineWidth = stroke.width * (stroke.brush === "pencil" ? .55 : 1) * (stroke.pressure ?? 1);
+				configureSketchBrush(context, stroke);
 				context.beginPath();
 				const last = stroke.points.at(-1);
 				if (stroke.shape === "text") {
@@ -148,7 +179,8 @@ window.__ModuleLoader__.load({
 					if (stroke.fill) context.fill();
 					else context.stroke();
 				} else if (stroke.points.length === 1) {
-					context.arc(first.x * size, first.y * height, context.lineWidth / 2, 0, Math.PI * 2);
+					if (stroke.brushVersion === 2 && stroke.brush === "marker") context.rect(first.x * size - context.lineWidth / 2, first.y * height - context.lineWidth / 4, context.lineWidth, context.lineWidth / 2);
+					else context.arc(first.x * size, first.y * height, context.lineWidth / 2, 0, Math.PI * 2);
 					context.fill();
 				} else {
 					context.moveTo(first.x * size, first.y * height);
@@ -995,6 +1027,92 @@ window.__ModuleLoader__.load({
 			});
 		}
 		//#endregion
+		//#region src/workspace-icons.jsx
+		function WorkspaceIcon({ name, size = 24 }) {
+			const paths = {
+				select: "M5 3l14 9-7 2-3 7-4-18z",
+				text: "M4 5h16M12 5v15M8 20h8M4 5v3M20 5v3",
+				arrow: "M4 20L20 4M10 4h10v10",
+				line: "M4 20L20 4",
+				layers: "M12 3L2 8l10 5 10-5-10-5zM2 12l10 5 10-5M2 16l10 5 10-5",
+				eye: "M2 12s4-7 10-7 10 7 10 7-4 7-10 7S2 12 2 12zM15 12a3 3 0 11-6 0 3 3 0 016 0",
+				eyeOff: "M3 3l18 18M9 5a10 10 0 013 0c6 0 10 7 10 7l-3 4M6 6C3 8 2 12 2 12s4 7 10 7c2 0 4-1 5-2",
+				duplicate: "M8 8h13v13H8zM16 8V3H3v13h5",
+				up: "M12 20V4M5 11l7-7 7 7",
+				down: "M12 4v16M5 13l7 7 7-7",
+				pencil: "M4 20l2-6L17 3l4 4L10 18l-6 2zM14 6l4 4",
+				marker: "M5 16l9-12 7 5-9 12-7-5zM5 16l-3 4 6 1M12 7l7 5",
+				image: "M4 4h16v16H4zM4 16l5-5 4 4 3-3 4 4M15 8h.01",
+				close: "M6 6l12 12M18 6L6 18",
+				stop: "M6 6h12v12H6z",
+				pen: "M4 17c3-7 12-15 12-11S4 19 8 19s10-10 10-6-6 8-2 7l4-3",
+				eraser: "M4 14l9-10 7 7-9 10H9l-5-5zM8 10l7 7M11 21h10",
+				undo: "M9 5L4 10l5 5M5 10h9a6 6 0 010 12",
+				redo: "M15 5l5 5-5 5M19 10h-9a6 6 0 000 12",
+				check: "M5 12l5 5 9-11",
+				clear: "M4 7h16M9 7V4h6v3M7 7l1 13h8l1-13",
+				rectangle: "M5 5h14v14H5z",
+				circle: "M20 12a8 8 0 11-16 0 8 8 0 0116 0"
+			};
+			return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("svg", {
+				width: size,
+				height: size,
+				viewBox: "0 0 24 24",
+				fill: "none",
+				stroke: "currentColor",
+				strokeWidth: "1.8",
+				strokeLinecap: "round",
+				strokeLinejoin: "round",
+				"aria-hidden": "true",
+				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", { d: paths[name] ?? paths.pen })
+			});
+		}
+		//#endregion
+		//#region src/sketch-run-status.jsx
+		function SketchRunStatus({ state, t, floating = false, onOpen, onStop, onResume, onDismiss }) {
+			if (state === "idle") return null;
+			const drawing = state === "drawing", recover = state === "stopped" || state === "failed";
+			return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+				className: floating ? "codexSketchBackgroundStatus" : "codexSketchAgentStatus",
+				role: "status",
+				"aria-live": "polite",
+				children: [
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)(WorkspaceIcon, {
+						name: drawing ? "pen" : state === "finished" ? "check" : "rectangle",
+						size: 15
+					}),
+					floating ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+						type: "button",
+						onClick: onOpen,
+						children: t(`sketchRun_${state}`)
+					}) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", { children: t(`sketchRun_${state}`) }),
+					drawing ? /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("button", {
+						type: "button",
+						className: "codexSketchStop",
+						onClick: onStop,
+						children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(WorkspaceIcon, {
+							name: "stop",
+							size: 12
+						}), t("sketchRunStop")]
+					}) : /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [recover ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+						type: "button",
+						title: t("sketchRunResumeHint"),
+						onClick: onResume,
+						children: t("sketchRunResume")
+					}) : null, !recover ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+						type: "button",
+						"aria-label": t("sketchDismissStatus"),
+						title: t("sketchDismissStatus"),
+						onClick: onDismiss,
+						children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(WorkspaceIcon, {
+							name: "close",
+							size: 14
+						})
+					}) : null] })
+				]
+			});
+		}
+		//#endregion
 		//#region src/sketch-layer-renderer.js
 		const NO_IMAGES = /* @__PURE__ */ new Map();
 		const surface = (width, height) => {
@@ -1200,8 +1318,7 @@ window.__ModuleLoader__.load({
 					cursor.hidden = true;
 					return;
 				}
-				const pressure = node.hasPointerCapture(pointer.pointerId) && pointer.pointerType === "pen" ? heldPressure.current : 1;
-				const diameter = width * (brush === "pencil" ? .55 : 1) * pressure * rect.width / node.width;
+				const diameter = width * (node.hasPointerCapture(pointer.pointerId) && pointer.pointerType === "pen" ? heldPressure.current : 1) * rect.width / node.width;
 				cursor.hidden = false;
 				cursor.style.width = `${diameter}px`;
 				cursor.style.height = `${diameter}px`;
@@ -1642,7 +1759,8 @@ window.__ModuleLoader__.load({
 								layer: layer.id
 							}]).layers[0].strokes[0],
 							brush: original.brush ?? "pen",
-							...original.pressure !== void 0 ? { pressure: original.pressure } : {}
+							...original.pressure !== void 0 ? { pressure: original.pressure } : {},
+							...original.brushVersion === 2 ? { brushVersion: 2 } : {}
 						};
 					} else throw Error("Unknown object action");
 					doc = {
@@ -1880,9 +1998,11 @@ window.__ModuleLoader__.load({
 							"marker"
 						].includes(s.brush)) throw Error("Invalid brush");
 						if (s.pressure !== void 0 && (!Number.isFinite(s.pressure) || s.pressure < .2 || s.pressure > 1)) throw Error("Invalid pressure");
+						if (s.brushVersion !== void 0 && s.brushVersion !== 2) throw Error("Unsupported brush version");
 						Object.assign(added[added.length - strokes.length + k], {
 							brush: s.brush ?? "pen",
-							pressure: s.pressure ?? 1
+							pressure: s.pressure ?? 1,
+							...s.brushVersion === 2 ? { brushVersion: 2 } : {}
 						});
 					}
 				}
@@ -2154,46 +2274,6 @@ window.__ModuleLoader__.load({
 			});
 		}
 		//#endregion
-		//#region src/workspace-icons.jsx
-		function WorkspaceIcon({ name, size = 24 }) {
-			const paths = {
-				select: "M5 3l14 9-7 2-3 7-4-18z",
-				text: "M4 5h16M12 5v15M8 20h8M4 5v3M20 5v3",
-				arrow: "M4 20L20 4M10 4h10v10",
-				line: "M4 20L20 4",
-				layers: "M12 3L2 8l10 5 10-5-10-5zM2 12l10 5 10-5M2 16l10 5 10-5",
-				eye: "M2 12s4-7 10-7 10 7 10 7-4 7-10 7S2 12 2 12zM15 12a3 3 0 11-6 0 3 3 0 016 0",
-				eyeOff: "M3 3l18 18M9 5a10 10 0 013 0c6 0 10 7 10 7l-3 4M6 6C3 8 2 12 2 12s4 7 10 7c2 0 4-1 5-2",
-				duplicate: "M8 8h13v13H8zM16 8V3H3v13h5",
-				up: "M12 20V4M5 11l7-7 7 7",
-				down: "M12 4v16M5 13l7 7 7-7",
-				pencil: "M4 20l2-6L17 3l4 4L10 18l-6 2zM14 6l4 4",
-				marker: "M5 16l9-12 7 5-9 12-7-5zM5 16l-3 4 6 1M12 7l7 5",
-				image: "M4 4h16v16H4zM4 16l5-5 4 4 3-3 4 4M15 8h.01",
-				close: "M6 6l12 12M18 6L6 18",
-				pen: "M4 17c3-7 12-15 12-11S4 19 8 19s10-10 10-6-6 8-2 7l4-3",
-				eraser: "M4 14l9-10 7 7-9 10H9l-5-5zM8 10l7 7M11 21h10",
-				undo: "M9 5L4 10l5 5M5 10h9a6 6 0 010 12",
-				redo: "M15 5l5 5-5 5M19 10h-9a6 6 0 000 12",
-				check: "M5 12l5 5 9-11",
-				clear: "M4 7h16M9 7V4h6v3M7 7l1 13h8l1-13",
-				rectangle: "M5 5h14v14H5z",
-				circle: "M20 12a8 8 0 11-16 0 8 8 0 0116 0"
-			};
-			return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("svg", {
-				width: size,
-				height: size,
-				viewBox: "0 0 24 24",
-				fill: "none",
-				stroke: "currentColor",
-				strokeWidth: "1.8",
-				strokeLinecap: "round",
-				strokeLinejoin: "round",
-				"aria-hidden": "true",
-				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", { d: paths[name] ?? paths.pen })
-			});
-		}
-		//#endregion
 		//#region src/sketch-size-control.jsx
 		function SketchSizeControl({ value, onChange, onStart, onEnd, label, disabled, min = 2, max = 128, mode, modes, onModeChange, suffix = "" }) {
 			const active = (0, react.useRef)(false);
@@ -2435,6 +2515,11 @@ window.__ModuleLoader__.load({
 			const [stability, setStability] = (0, react.useState)(0), [flow, setFlow] = (0, react.useState)(100), [picturesOpen, setPicturesOpen] = (0, react.useState)(false);
 			const pictureInput = (0, react.useRef)(null), received = (0, react.useRef)(null);
 			const navigation = useSketchView(canvas, open);
+			const brushWidths = (0, react.useRef)({
+				pen: 12,
+				pencil: 6,
+				marker: 28
+			});
 			const [revision, redraw] = (0, react.useState)(0), [tool, setTool] = (0, react.useState)("pen"), [brush, setBrush] = (0, react.useState)("pen");
 			const [eraser, setEraser] = (0, react.useState)("pixel"), [color, setColor] = (0, react.useState)("#0088ff"), [width, setWidth] = (0, react.useState)(12);
 			const [selection, setSelection] = (0, react.useState)(null), [textEdit, setTextEdit] = (0, react.useState)(null), [shapesOpen, setShapesOpen] = (0, react.useState)(false);
@@ -2464,6 +2549,13 @@ window.__ModuleLoader__.load({
 				setColor(value);
 				if (selected) editObject({ color: value });
 			};
+			const chooseBrush = (name) => {
+				brushWidths.current[brush] = width;
+				setWidth(brushWidths.current[name]);
+				setBrush(name);
+				setTool("pen");
+				setSelection(null);
+			};
 			const [fillShape, setFillShape] = (0, react.useState)(false);
 			const [layersOpen, setLayersOpen] = (0, react.useState)(false), [busy, setBusy] = (0, react.useState)(false), [error, setError] = (0, react.useState)("");
 			const cursorRing = (0, react.useRef)(null);
@@ -2652,11 +2744,11 @@ window.__ModuleLoader__.load({
 					editObject({}, "delete");
 					return;
 				}
-				if (event.key.toLowerCase() === "v") {
+				if (!event.ctrlKey && !event.metaKey && !event.altKey && event.key.toLowerCase() === "v") {
 					setTool("select");
 					return;
 				}
-				if (event.key.toLowerCase() === "t") {
+				if (!event.ctrlKey && !event.metaKey && !event.altKey && event.key.toLowerCase() === "t") {
 					setTool("text");
 					return;
 				}
@@ -2683,7 +2775,6 @@ window.__ModuleLoader__.load({
 				if (tools[key]) {
 					event.preventDefault();
 					setTool(tools[key]);
-					if (tools[key] === "pen") setBrush("pen");
 				}
 				if (key === "[" || key === "]") {
 					event.preventDefault();
@@ -2962,24 +3053,17 @@ window.__ModuleLoader__.load({
 				link.remove();
 				setTimeout(() => URL.revokeObjectURL(url), 1e4);
 			};
-			return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [enabled && agentEnabled && !open && !noticeHidden && agentState !== "idle" ? /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-				className: "codexSketchBackgroundStatus",
-				role: "status",
-				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
-					type: "button",
-					onClick: onOpen,
-					children: t(`sketchRun_${agentState}`)
-				}), agentLocked ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
-					type: "button",
-					"aria-label": t("sketchRunStop"),
-					onClick: () => agentRun.current.stop(),
-					children: "×"
-				}) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
-					type: "button",
-					"aria-label": t("sketchCancel"),
-					onClick: () => setNoticeHidden(true),
-					children: "×"
-				})]
+			return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [enabled && agentEnabled && !open && !noticeHidden ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(SketchRunStatus, {
+				state: agentState,
+				floating: true,
+				t,
+				onOpen,
+				onStop: () => agentRun.current.stop(),
+				onResume: () => {
+					setError("");
+					agentRun.current.resume();
+				},
+				onDismiss: () => setNoticeHidden(true)
 			}) : null, /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("dialog", {
 				ref: dialog,
 				className: "codexSketchDialog codexSketchStudio codexLayerStudio",
@@ -3121,24 +3205,15 @@ window.__ModuleLoader__.load({
 							})
 						]
 					}),
-					enabled && agentEnabled && agentState !== "idle" ? /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-						className: "codexSketchAgentStatus",
-						role: "status",
-						"aria-live": "polite",
-						children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", { children: t(`sketchRun_${agentState}`) }), agentLocked ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
-							type: "button",
-							"aria-label": t("sketchRunStop"),
-							title: t("sketchRunStop"),
-							onClick: () => agentRun.current.stop(),
-							children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(WorkspaceIcon, {
-								name: "close",
-								size: 16
-							})
-						}) : agentState === "stopped" ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
-							type: "button",
-							onClick: () => agentRun.current.resume(),
-							children: t("sketchRunResume")
-						}) : null]
+					enabled && agentEnabled && !noticeHidden ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(SketchRunStatus, {
+						state: agentState,
+						t,
+						onStop: () => agentRun.current.stop(),
+						onResume: () => {
+							setError("");
+							agentRun.current.resume();
+						},
+						onDismiss: () => setNoticeHidden(true)
 					}) : null,
 					/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
 						className: `codexLayerBody ${layersOpen ? "withLayers" : ""}`,
@@ -3254,6 +3329,7 @@ window.__ModuleLoader__.load({
 										width,
 										fill: fillShape && ["rectangle", "circle"].includes(tool),
 										brush: tool === "pen" ? brush : "pen",
+										...tool === "pen" ? { brushVersion: 2 } : {},
 										pressure: event.pointerType === "pen" ? Math.max(.2, event.pressure) : 1,
 										points: [start]
 									});
@@ -3549,6 +3625,8 @@ window.__ModuleLoader__.load({
 									[
 										"select",
 										"pen",
+										"pencil",
+										"marker",
 										"text",
 										"eraser"
 									].map((name) => {
@@ -3561,13 +3639,15 @@ window.__ModuleLoader__.load({
 										return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("button", {
 											type: "button",
 											"aria-label": label,
-											title: label,
+											title: drawing ? `${label} · ${t(`sketchBrushHint_${name}`)}` : label,
 											"aria-pressed": drawing ? tool === "pen" && brush === name : tool === name,
 											disabled: agentLocked || busy,
 											onClick: () => {
-												setTool(drawing ? "pen" : name);
-												if (name !== "select") setSelection(null);
-												if (drawing) setBrush(name);
+												if (drawing) chooseBrush(name);
+												else {
+													setTool(name);
+													if (name !== "select") setSelection(null);
+												}
 											},
 											children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(WorkspaceIcon, {
 												name,
@@ -3578,13 +3658,30 @@ window.__ModuleLoader__.load({
 									/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("button", {
 										className: "codexSketchShapeToggle",
 										type: "button",
+										"aria-label": t("sketchShapes"),
 										"aria-expanded": shapesOpen,
+										"aria-pressed": [
+											"line",
+											"arrow",
+											"rectangle",
+											"circle"
+										].includes(tool),
 										disabled: agentLocked || busy,
 										onClick: () => setShapesOpen((v) => !v),
 										children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(WorkspaceIcon, {
-											name: "rectangle",
+											name: [
+												"line",
+												"arrow",
+												"rectangle",
+												"circle"
+											].includes(tool) ? tool : "rectangle",
 											size: 23
-										}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", { children: t("sketchShapes") })]
+										}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", { children: t([
+											"line",
+											"arrow",
+											"rectangle",
+											"circle"
+										].includes(tool) ? `sketchTool_${tool}` : "sketchShapes") })]
 									}),
 									shapesOpen ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
 										className: "codexSketchShapeMenu",
@@ -3595,6 +3692,7 @@ window.__ModuleLoader__.load({
 											"circle"
 										].map((name) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
 											type: "button",
+											"aria-pressed": tool === name,
 											onClick: () => {
 												setTool(name);
 												setSelection(null);
@@ -3614,20 +3712,6 @@ window.__ModuleLoader__.load({
 										checked: fillShape,
 										onChange: (e) => setFillShape(e.target.checked)
 									}), t("sketchFill")] }) : null,
-									tool === "pen" ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("select", {
-										"aria-label": t("sketchBrush"),
-										value: brush,
-										onChange: (e) => setBrush(e.target.value),
-										disabled: agentLocked || busy,
-										children: [
-											"pen",
-											"pencil",
-											"marker"
-										].map((b) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("option", {
-											value: b,
-											children: t(`sketchBrush_${b}`)
-										}, b))
-									}) : null,
 									selected ? /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
 										className: "codexSketchObjectActions",
 										children: [
@@ -3734,7 +3818,7 @@ window.__ModuleLoader__.load({
 .codexLayerBrush>select{background:var(--sketch-bg);color:inherit;border:1px solid var(--sketch-line);border-radius:8px;padding:6px}
 
 .codexSketchBackgroundStatus{position:fixed;top:16px;left:50%;transform:translateX(-50%);z-index:1000;display:flex;gap:8px;align-items:center;padding:6px 10px;border-radius:12px;background:var(--dsw-alias-bg-layer-1,#f5f5f7);color:var(--dsw-alias-label-primary,#202124);border:1px solid #8883;box-shadow:0 4px 16px #0002;font:12px system-ui}.codexSketchBackgroundStatus button{color:inherit;background:none;border:0;cursor:pointer}
-.codexSketchAgentStatus{display:flex;align-items:center;justify-content:center;gap:8px;min-height:24px;color:var(--sketch-muted);font-size:12px}.codexSketchAgentStatus button{padding:3px 6px;border-radius:6px;background:var(--sketch-line)}
+.codexSketchAgentStatus{display:flex;align-items:center;justify-content:center;gap:8px;min-height:24px;color:var(--sketch-muted);font-size:12px}.codexSketchAgentStatus button{min-height:30px;padding:4px 10px;border-radius:16px;background:var(--sketch-line)}.codexSketchAgentStatus{align-self:center;max-width:100%;min-height:34px;padding:0 6px;flex-wrap:wrap}.codexSketchBackgroundStatus button{min-height:30px;display:inline-flex;align-items:center;gap:5px}.codexSketchAgentStatus .codexSketchStop,.codexSketchBackgroundStatus .codexSketchStop{font-weight:500;background:var(--sketch-line,#8882);border-radius:16px;padding:4px 10px}
 .codexSketchDialog{--sketch-bg:var(--dsw-alias-bg-layer-1,#f5f5f7);--sketch-fg:var(--dsw-alias-label-primary,#202124);--sketch-muted:var(--dsw-alias-label-secondary,#727279);--sketch-line:var(--dsw-alias-border-l2,#8883);--sketch-glass:color-mix(in srgb,var(--sketch-bg) 90%,transparent);box-sizing:border-box;width:min(1280px,calc(100vw - 24px));height:94dvh;max-height:94dvh;margin:auto;padding:10px;border:1px solid var(--sketch-line);border-radius:18px;background:var(--sketch-bg);color:var(--sketch-fg);box-shadow:0 24px 90px #0004;overflow:hidden;font:13px/1.4 system-ui}
 .codexSketchDialog[open]{display:flex;flex-direction:column;gap:8px}
 .codexSketchDialog::backdrop{background:#0005;backdrop-filter:blur(12px)}
@@ -3918,6 +4002,11 @@ window.__ModuleLoader__.load({
 			sketchSizeShort: "粗细",
 			sketchObjectDuplicate: "复制对象",
 			sketchObjectDelete: "删除对象",
+			sketchBrushHint_pen: "实色圆头墨线",
+			sketchBrushHint_pencil: "细腻颗粒，叠画加深",
+			sketchBrushHint_marker: "半透明平头，适合高亮",
+			sketchDismissStatus: "收起提示",
+			sketchRunResumeHint: "允许 Agent 接收后续绘图请求，不会自动重发消息",
 			sketchTool_select: "选择",
 			sketchTool_text: "文字",
 			sketchTool_arrow: "箭头",
@@ -4324,6 +4413,11 @@ window.__ModuleLoader__.load({
 			sketchSizeShort: "Size",
 			sketchObjectDuplicate: "Duplicate object",
 			sketchObjectDelete: "Delete object",
+			sketchBrushHint_pen: "Solid round ink",
+			sketchBrushHint_pencil: "Grain builds with repeated strokes",
+			sketchBrushHint_marker: "Translucent flat tip for highlights",
+			sketchDismissStatus: "Dismiss status",
+			sketchRunResumeHint: "Allow subsequent drawing requests; does not resend a message",
 			sketchTool_select: "Select",
 			sketchTool_text: "Text",
 			sketchTool_arrow: "Arrow",
@@ -6547,7 +6641,7 @@ window.__ModuleLoader__.load({
 		}
 		//#endregion
 		//#region src/version.js
-		const PACKAGE_VERSION = "2.1.0-beta.5";
+		const PACKAGE_VERSION = "2.1.0";
 		//#endregion
 		//#region src/client-recovery.js
 		async function recoveryCall(rpc, endpoint, payload = {}, timeoutMs = 1e4) {

package/lib/index.js

@@ -2004,7 +2004,7 @@ function openaiCodexSubscriptionProvider({ resolveSpeedMode = () => void 0, reso
 Object.freeze(["0.82.1", "0.85.1"]);
 //#endregion
 //#region src/version.js
-const PACKAGE_VERSION = "2.1.0-beta.5";
+const PACKAGE_VERSION = "2.1.0";
 const USER_AGENT = `dsh-codex-subscription/${PACKAGE_VERSION}`;
 //#endregion
 //#region src/model-catalog.js

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "dsh-codex-subscription",
-  "version": "2.1.0-beta.5",
+  "version": "2.1.0",
   "description": "Use ChatGPT and Codex subscriptions in DeepSeek Harness with OAuth, quota, safe resets, web search, images, and Fast mode",
   "type": "module",
   "main": "./lib/index.js",