chore: release v1.104.0

.claude-plugin/marketplace.json

@@ -6,7 +6,7 @@
   },
   "metadata": {
     "description": "Skills shared by Baoyu for improving daily work efficiency",
-    "version": "1.103.1"
+    "version": "1.104.0"
   },
   "plugins": [
     {

CHANGELOG.md

@@ -2,6 +2,14 @@
 
 English | [中文](./CHANGELOG.zh.md)
 
+## 1.104.0 - 2026-04-13
+
+### Features
+- `baoyu-diagram`: add Mermaid sketch step (6d-0) before SVG generation — write a Mermaid code block as structural intent; add Mermaid–SVG consistency check in step 6f
+
+### Fixes
+- `baoyu-post-to-wechat`: verify editor focus before paste and type operations to prevent silent paste failures
+
 ## 1.103.1 - 2026-04-13
 
 ### Fixes

CHANGELOG.zh.md

@@ -2,6 +2,14 @@
 
 [English](./CHANGELOG.md) | 中文
 
+## 1.104.0 - 2026-04-13
+
+### 新功能
+- `baoyu-diagram`：新增 Mermaid 草图步骤（6d-0），在生成 SVG 前先写 Mermaid 代码块作为结构意图；在步骤 6f 新增 Mermaid–SVG 一致性检查
+
+### 修复
+- `baoyu-post-to-wechat`：在粘贴和输入操作前校验编辑器焦点，避免粘贴静默失败
+
 ## 1.103.1 - 2026-04-13
 
 ### 修复

CLAUDE.md

@@ -1,6 +1,6 @@
 # CLAUDE.md
 
-Claude Code marketplace plugin providing AI-powered content generation skills. Version: **1.103.0**.
+Claude Code marketplace plugin providing AI-powered content generation skills. Version: **1.104.0**.
 
 ## Architecture
 

skills/baoyu-diagram/SKILL.md

@@ -300,6 +300,17 @@ If nothing matches, skip and plan from scratch in Step 6d. Do not force a near-m
 
 Before writing any SVG, draft a short layout plan. Do the math once, correctly, so the SVG comes out right on the first pass.
 
+**6d-0. Draft the Mermaid sketch first** — write a Mermaid code block that captures the **structural intent** of the diagram: which nodes exist, how they connect, what direction they flow, and any grouping (subgraphs). This is the single source of truth for *what* to draw; everything after it (coordinates, widths, arrows) answers *how*.
+
+Rules for the Mermaid sketch:
+- Use the Mermaid dialect that best matches the diagram type: `flowchart TD/LR` for flowcharts, `sequenceDiagram` for sequence, `classDiagram` for class, `flowchart` with subgraphs for structural/illustrative.
+- Include every node, every edge, every label, and every subgraph/container. If a node won't appear in the Mermaid, it won't appear in the SVG.
+- Edge labels must match the final SVG labels — write them now, not later.
+- Keep it concise: the sketch is a structural contract, not a rendering. Mermaid can't express baoyu's visual design (colors, rounded rects, dark mode), so don't try — those come in 6d-ii and 6e.
+- For patterns that have a Mermaid reference in `references/patterns/`, start from that reference and adapt it to the specific topic.
+
+Save the Mermaid block in the plan file. When writing SVG in Step 6e, **cross-check every node and edge against this Mermaid sketch** — if the sketch has it, the SVG must have it; if the SVG adds something the sketch doesn't have, update the sketch first.
+
 **6d-i. Extract structure from the source** — don't just transcribe bullets into boxes. Read the source looking for these elements. Not every element will be present, but every present element should land in the diagram:
 
 - **Mechanism name** — does the topic have a short, nameable identity (Autoreason, AutoResearch, OAuth, JWT auth, Reflexion loop)? If yes, that's a candidate `.title`.
@@ -333,12 +344,14 @@ Write the answers to these in the plan file. If ≥3 of them land, you're buildi
 5. **Map arrows** and verify none cross an unrelated box. Use L-bends where a straight line would collide. (Sequence messages are always straight horizontal lines — no L-bends. Fan-out candidates converge to a common `ymid` channel just above the judge box.)
 6. **Compute viewBox height**: `H = max_y + 20` where `max_y` is the bottom of the lowest element. Poster flowcharts routinely reach H=800–950 — don't force them to be compact.
 
-Save this plan:
+Save this plan (including the Mermaid sketch from 6d-0):
 - **Single mode**: `diagram/{slug}/plan.md`
 - **Multi mode**: `diagram/{article-slug}/NN-{type}-{slug}/plan.md`
 
 #### 6e: Write the SVG
 
+**Start from the Mermaid sketch in the plan.** Walk the sketch node-by-node, edge-by-edge, and translate each element into SVG using the coordinates and widths computed in 6d-ii. The Mermaid sketch is the structural checklist — every node and edge in it must appear in the SVG. If you find yourself adding an element that isn't in the sketch, stop and update the sketch first so the plan stays authoritative.
+
 Emit a single `<svg width="100%" viewBox="0 0 680 H">` element. Copy the `<style>` + `<defs>` block from `svg-template.md` **verbatim** — don't abbreviate or edit the color ramp definitions. Then add visual elements in z-order:
 
 1. Background decorations (rare)
@@ -355,6 +368,8 @@ Typography rules:
 
 #### 6f: Run the pre-save checklist
 
+**Mermaid–SVG consistency check** (run before the pitfalls checklist): re-read the Mermaid sketch from the plan. For every node in the sketch, confirm the SVG has a corresponding `<rect>` + `<text>`. For every edge, confirm a `<path>` or `<line>` connects the correct pair. Missing elements are bugs — fix them before continuing.
+
 Walk through every item in `references/pitfalls.md`. The top failures to catch every time:
 
 1. viewBox height covers every element with a 20px buffer

skills/baoyu-post-to-wechat/scripts/wechat-article.ts

@@ -194,6 +194,54 @@ async function pasteFromClipboardInEditor(session: ChromeSession): Promise<void>
   await sleep(1000);
 }
 
+async function prepareEditorPasteTarget(
+  session: ChromeSession,
+  context: string,
+  options: { clickEditor?: boolean } = {},
+): Promise<void> {
+  await session.cdp.send('Target.activateTarget', { targetId: session.targetId }).catch(() => {});
+  await sleep(100);
+
+  if (options.clickEditor) {
+    await clickElement(session, '.ProseMirror');
+    await sleep(200);
+  }
+
+  const ready = await evaluate<boolean>(session, `
+    (function() {
+      const editor = document.querySelector('.ProseMirror');
+      if (!editor) return false;
+
+      const active = document.activeElement;
+      const selection = window.getSelection();
+      const selectionInEditor = !!selection && selection.rangeCount > 0 && !!selection.anchorNode && editor.contains(selection.anchorNode);
+      const focusInEditor = !!active && (active === editor || editor.contains(active));
+      if (selectionInEditor || focusInEditor) return true;
+
+      if (${JSON.stringify(Boolean(options.clickEditor))}) {
+        editor.focus();
+        const nextActive = document.activeElement;
+        return nextActive === editor || editor.contains(nextActive);
+      }
+
+      return false;
+    })()
+  `);
+
+  if (ready) return;
+
+  const activeElement = await evaluate<string>(session, `
+    (function() {
+      const el = document.activeElement;
+      if (!el) return '(none)';
+      const id = el.id ? '#' + el.id : '';
+      const className = typeof el.className === 'string' && el.className ? '.' + el.className.split(/\\s+/).join('.') : '';
+      return el.tagName.toLowerCase() + id + className;
+    })()
+  `);
+  throw new Error(`Body editor is not focused before ${context}; active element: ${activeElement}`);
+}
+
 async function parseMarkdownWithPlaceholders(
   markdownPath: string,
   theme?: string,
@@ -567,6 +615,7 @@ export async function postArticle(options: ArticleOptions): Promise<void> {
       console.log(`[wechat] Copying HTML content from: ${effectiveHtmlFile}`);
       await copyHtmlFromBrowser(cdp, effectiveHtmlFile, contentImages);
       await sleep(500);
+      await prepareEditorPasteTarget(session, 'body content paste', { clickEditor: true });
       console.log('[wechat] Pasting into editor...');
       await pasteFromClipboardInEditor(session);
       await sleep(3000);
@@ -608,6 +657,7 @@ export async function postArticle(options: ArticleOptions): Promise<void> {
           await sleep(200);
 
           console.log('[wechat] Pasting image...');
+          await prepareEditorPasteTarget(session, 'inline image paste');
           await pasteFromClipboardInEditor(session);
           await sleep(3000);
           await removeExtraEmptyLineAfterImage(session);
@@ -620,6 +670,7 @@ export async function postArticle(options: ArticleOptions): Promise<void> {
           console.log(`[wechat] Pasting image: ${img}`);
           await copyImageToClipboard(img);
           await sleep(500);
+          await prepareEditorPasteTarget(session, 'leading image paste');
           await pasteInEditor(session);
           await sleep(2000);
           await removeExtraEmptyLineAfterImage(session);
@@ -627,6 +678,7 @@ export async function postArticle(options: ArticleOptions): Promise<void> {
       }
 
       console.log('[wechat] Typing content...');
+      await prepareEditorPasteTarget(session, 'content typing');
       await typeText(session, content);
       await sleep(1000);