yycode 0.3.2__py3-none-any.whl

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (131) hide show
  1. agent/__init__.py +33 -0
  2. agent/acp/__init__.py +2 -0
  3. agent/acp/approval_adapter.py +134 -0
  4. agent/acp/content_adapter.py +45 -0
  5. agent/acp/jsonrpc.py +92 -0
  6. agent/acp/server.py +197 -0
  7. agent/acp/session_manager.py +193 -0
  8. agent/acp/update_adapter.py +192 -0
  9. agent/app_paths.py +25 -0
  10. agent/approval.py +169 -0
  11. agent/cancellation.py +52 -0
  12. agent/change_snapshot.py +186 -0
  13. agent/context_compressor.py +116 -0
  14. agent/graph.py +137 -0
  15. agent/llm_retry.py +434 -0
  16. agent/logger.py +97 -0
  17. agent/lsp/__init__.py +13 -0
  18. agent/lsp/client.py +151 -0
  19. agent/lsp/manager.py +234 -0
  20. agent/lsp/types.py +119 -0
  21. agent/message_context_manager.py +322 -0
  22. agent/message_format.py +105 -0
  23. agent/nodes/llm_node.py +58 -0
  24. agent/nodes/state.py +12 -0
  25. agent/nodes/task_guard_node.py +50 -0
  26. agent/nodes/tools_node.py +70 -0
  27. agent/plan_snapshot.py +70 -0
  28. agent/providers/__init__.py +13 -0
  29. agent/providers/anthropic_provider.py +268 -0
  30. agent/providers/base.py +52 -0
  31. agent/providers/openai_provider.py +279 -0
  32. agent/providers/text_tool_calls.py +118 -0
  33. agent/runtime/approval_service.py +184 -0
  34. agent/runtime/context.py +43 -0
  35. agent/runtime/tool_events.py +368 -0
  36. agent/runtime/tool_executor.py +208 -0
  37. agent/runtime/tool_output.py +261 -0
  38. agent/runtime/tool_registry.py +91 -0
  39. agent/runtime/tool_scheduler.py +35 -0
  40. agent/runtime/workflow_guard.py +217 -0
  41. agent/runtime/workspace.py +5 -0
  42. agent/runtime/workspace_tools.py +22 -0
  43. agent/session.py +787 -0
  44. agent/session_replay.py +95 -0
  45. agent/session_store.py +186 -0
  46. agent/skills.py +254 -0
  47. agent/streaming.py +248 -0
  48. agent/subagent.py +634 -0
  49. agent/task_memory.py +340 -0
  50. agent/todo_manager.py +304 -0
  51. agent/tool_retry.py +106 -0
  52. agent/tui/__init__.py +14 -0
  53. agent/tui/app.py +1325 -0
  54. agent/tui/approval.py +53 -0
  55. agent/tui/commands/__init__.py +6 -0
  56. agent/tui/commands/base.py +48 -0
  57. agent/tui/commands/clear.py +37 -0
  58. agent/tui/commands/help.py +27 -0
  59. agent/tui/commands/registry.py +94 -0
  60. agent/tui/help_content.py +108 -0
  61. agent/tui/renderers.py +1961 -0
  62. agent/tui/runner.py +439 -0
  63. agent/tui/state.py +653 -0
  64. main.py +465 -0
  65. tools/__init__.py +50 -0
  66. tools/apply_patch.py +305 -0
  67. tools/bash.py +76 -0
  68. tools/diff_utils.py +139 -0
  69. tools/edit_file.py +40 -0
  70. tools/git_diff.py +72 -0
  71. tools/git_show.py +65 -0
  72. tools/grep.py +149 -0
  73. tools/list_files.py +90 -0
  74. tools/list_skills.py +24 -0
  75. tools/load_skill.py +30 -0
  76. tools/lsp_definition.py +27 -0
  77. tools/lsp_diagnostics.py +32 -0
  78. tools/lsp_document_symbols.py +23 -0
  79. tools/lsp_hover.py +29 -0
  80. tools/lsp_references.py +37 -0
  81. tools/lsp_utils.py +38 -0
  82. tools/lsp_workspace_symbols.py +23 -0
  83. tools/read_file.py +61 -0
  84. tools/read_many_files.py +50 -0
  85. tools/safety.py +50 -0
  86. tools/subagent.py +57 -0
  87. tools/todo.py +89 -0
  88. tools/verify.py +107 -0
  89. tools/web_search.py +250 -0
  90. tools/workspace.py +36 -0
  91. tools/workspace_state.py +60 -0
  92. tools/write_file.py +88 -0
  93. utils/__init__.py +5 -0
  94. utils/retry.py +13 -0
  95. yycode-0.3.2.data/data/skills/code_review.md +61 -0
  96. yycode-0.3.2.data/data/skills/code_workflow.md +404 -0
  97. yycode-0.3.2.data/data/skills/drawio/SKILL.md +636 -0
  98. yycode-0.3.2.data/data/skills/drawio/agents/openai.yaml +19 -0
  99. yycode-0.3.2.data/data/skills/drawio/assets/demo-erd.drawio +84 -0
  100. yycode-0.3.2.data/data/skills/drawio/assets/demo-layered-cn.drawio +91 -0
  101. yycode-0.3.2.data/data/skills/drawio/assets/demo-layered-cn.png +0 -0
  102. yycode-0.3.2.data/data/skills/drawio/assets/demo-layered.drawio +112 -0
  103. yycode-0.3.2.data/data/skills/drawio/assets/demo-layered.png +0 -0
  104. yycode-0.3.2.data/data/skills/drawio/assets/demo-ml.drawio +90 -0
  105. yycode-0.3.2.data/data/skills/drawio/assets/demo-ring-cn.drawio +68 -0
  106. yycode-0.3.2.data/data/skills/drawio/assets/demo-ring-cn.png +0 -0
  107. yycode-0.3.2.data/data/skills/drawio/assets/demo-ring.drawio +86 -0
  108. yycode-0.3.2.data/data/skills/drawio/assets/demo-ring.png +0 -0
  109. yycode-0.3.2.data/data/skills/drawio/assets/demo-sequence.drawio +116 -0
  110. yycode-0.3.2.data/data/skills/drawio/assets/demo-star-cn.drawio +66 -0
  111. yycode-0.3.2.data/data/skills/drawio/assets/demo-star-cn.png +0 -0
  112. yycode-0.3.2.data/data/skills/drawio/assets/demo-star.drawio +79 -0
  113. yycode-0.3.2.data/data/skills/drawio/assets/demo-star.png +0 -0
  114. yycode-0.3.2.data/data/skills/drawio/assets/demo-uml-class.drawio +64 -0
  115. yycode-0.3.2.data/data/skills/drawio/assets/microservices-example.drawio +173 -0
  116. yycode-0.3.2.data/data/skills/drawio/assets/microservices-example.png +0 -0
  117. yycode-0.3.2.data/data/skills/drawio/assets/workflow-cn.drawio +120 -0
  118. yycode-0.3.2.data/data/skills/drawio/assets/workflow-cn.png +0 -0
  119. yycode-0.3.2.data/data/skills/drawio/assets/workflow.drawio +120 -0
  120. yycode-0.3.2.data/data/skills/drawio/assets/workflow.png +0 -0
  121. yycode-0.3.2.data/data/skills/drawio/docs/index.html +469 -0
  122. yycode-0.3.2.data/data/skills/drawio/docs/zh.html +456 -0
  123. yycode-0.3.2.data/data/skills/drawio/references/style-extraction.md +254 -0
  124. yycode-0.3.2.data/data/skills/drawio/styles/schema.json +112 -0
  125. yycode-0.3.2.data/data/skills/plan.md +115 -0
  126. yycode-0.3.2.data/data/skills/ppt/SKILL.md +254 -0
  127. yycode-0.3.2.dist-info/METADATA +12 -0
  128. yycode-0.3.2.dist-info/RECORD +131 -0
  129. yycode-0.3.2.dist-info/WHEEL +5 -0
  130. yycode-0.3.2.dist-info/entry_points.txt +2 -0
  131. yycode-0.3.2.dist-info/top_level.txt +4 -0
@@ -0,0 +1,456 @@
1
+ <!DOCTYPE html>
2
+ <html lang="zh-CN" data-theme="dark">
3
+ <head>
4
+ <meta charset="UTF-8">
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+ <title>drawio-skill — 从文本到专业图表</title>
7
+ <meta name="description" content="Claude Code skill,通过自然语言生成专业 draw.io 图表。6 种图表预设、ML/DL 支持、自检循环、动画连接线。">
8
+ <meta name="theme-color" content="#0d1117">
9
+ <link rel="canonical" href="https://agents365-ai.github.io/drawio-skill/zh.html">
10
+ <link rel="alternate" hreflang="zh" href="https://agents365-ai.github.io/drawio-skill/zh.html">
11
+ <link rel="alternate" hreflang="en" href="https://agents365-ai.github.io/drawio-skill/">
12
+ <meta property="og:title" content="drawio-skill — 从文本到专业图表">
13
+ <meta property="og:description" content="Claude Code skill,通过自然语言生成专业 draw.io 图表。6 种图表预设、ML/DL 支持、自检循环。">
14
+ <meta property="og:type" content="website">
15
+ <meta property="og:url" content="https://agents365-ai.github.io/drawio-skill/zh.html">
16
+ <meta property="og:image" content="https://raw.githubusercontent.com/Agents365-ai/drawio-skill/main/assets/demo-star-cn.png">
17
+ <meta name="twitter:card" content="summary_large_image">
18
+ <style>
19
+ *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
20
+
21
+ [data-theme="dark"] {
22
+ --bg: #0d1117; --bg-card: #161b22; --bg-code: #1c2128;
23
+ --border: #30363d; --text: #e6edf3; --text-muted: #8b949e;
24
+ --accent: #58a6ff; --accent-hover: #79c0ff;
25
+ --green: #3fb950; --red: #f85149;
26
+ }
27
+ [data-theme="light"] {
28
+ --bg: #ffffff; --bg-card: #f6f8fa; --bg-code: #f0f3f6;
29
+ --border: #d0d7de; --text: #1f2328; --text-muted: #656d76;
30
+ --accent: #0969da; --accent-hover: #0550ae;
31
+ --green: #1a7f37; --red: #cf222e;
32
+ }
33
+
34
+ body {
35
+ font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'PingFang SC', 'Microsoft YaHei', sans-serif;
36
+ background: var(--bg); color: var(--text); line-height: 1.6; overflow-x: hidden;
37
+ transition: background 0.3s, color 0.3s;
38
+ }
39
+ a { color: var(--accent); text-decoration: none; }
40
+ a:hover { color: var(--accent-hover); text-decoration: underline; }
41
+
42
+ nav {
43
+ position: sticky; top: 0; z-index: 100;
44
+ background: var(--bg); border-bottom: 1px solid var(--border);
45
+ padding: 12px 24px; display: flex; justify-content: space-between; align-items: center;
46
+ transition: background 0.3s;
47
+ }
48
+ nav .logo { font-weight: 700; font-size: 16px; color: var(--text); }
49
+ nav .logo span { color: var(--accent); }
50
+ nav .nav-right { display: flex; align-items: center; gap: 16px; }
51
+ .lang-switch {
52
+ font-size: 14px; font-weight: 500; color: var(--text-muted);
53
+ padding: 4px 12px; border: 1px solid var(--border); border-radius: 6px;
54
+ transition: all 0.2s;
55
+ }
56
+ .lang-switch:hover { color: var(--text); border-color: var(--text-muted); text-decoration: none; }
57
+ .theme-btn {
58
+ background: none; border: 1px solid var(--border); color: var(--text-muted);
59
+ border-radius: 6px; padding: 4px 10px; cursor: pointer; font-size: 16px;
60
+ transition: all 0.2s; line-height: 1;
61
+ }
62
+ .theme-btn:hover { color: var(--text); border-color: var(--text-muted); }
63
+
64
+ .container { max-width: 1080px; margin: 0 auto; padding: 0 24px; }
65
+ section { padding: 72px 0; }
66
+ section + section { border-top: 1px solid var(--border); }
67
+
68
+ .hero { text-align: center; padding: 96px 0 72px; border-bottom: 1px solid var(--border); }
69
+ .hero-badge {
70
+ display: inline-block; font-size: 13px; color: var(--accent);
71
+ border: 1px solid var(--accent); border-radius: 20px;
72
+ padding: 4px 14px; margin-bottom: 20px; letter-spacing: 0.5px;
73
+ }
74
+ .hero h1 { font-size: 48px; font-weight: 800; margin-bottom: 16px; letter-spacing: -1px; }
75
+ .hero h1 span { color: var(--accent); }
76
+ .hero p { font-size: 20px; color: var(--text-muted); max-width: 600px; margin: 0 auto 32px; }
77
+ .hero-install {
78
+ display: inline-flex; align-items: center; gap: 12px;
79
+ background: var(--bg-code); border: 1px solid var(--border); border-radius: 8px;
80
+ padding: 12px 20px; font-family: 'SF Mono', 'Fira Code', monospace; font-size: 15px;
81
+ margin-bottom: 24px;
82
+ }
83
+ .hero-install code { color: var(--green); }
84
+ .copy-btn {
85
+ background: none; border: 1px solid var(--border); color: var(--text-muted);
86
+ border-radius: 6px; padding: 4px 10px; cursor: pointer; font-size: 13px; transition: all 0.2s;
87
+ }
88
+ .copy-btn:hover { color: var(--text); border-color: var(--text-muted); }
89
+ .hero-links { display: flex; justify-content: center; gap: 16px; flex-wrap: wrap; }
90
+ .btn {
91
+ display: inline-flex; align-items: center; gap: 8px; padding: 10px 24px;
92
+ border-radius: 8px; font-size: 15px; font-weight: 600; transition: all 0.2s;
93
+ }
94
+ .btn-primary { background: var(--accent); color: #fff; }
95
+ [data-theme="light"] .btn-primary { color: #fff; }
96
+ .btn-primary:hover { background: var(--accent-hover); text-decoration: none; }
97
+ .btn-outline { border: 1px solid var(--border); color: var(--text); }
98
+ .btn-outline:hover { border-color: var(--text-muted); text-decoration: none; }
99
+
100
+ .section-title { font-size: 32px; font-weight: 700; margin-bottom: 8px; text-align: center; }
101
+ .section-sub { color: var(--text-muted); font-size: 17px; text-align: center; margin-bottom: 48px; }
102
+
103
+ .features-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 20px; }
104
+ .feature-card {
105
+ background: var(--bg-card); border: 1px solid var(--border);
106
+ border-radius: 12px; padding: 28px; transition: background 0.3s;
107
+ }
108
+ .feature-icon { font-size: 28px; margin-bottom: 12px; }
109
+ .feature-card h3 { font-size: 18px; margin-bottom: 8px; }
110
+ .feature-card p { color: var(--text-muted); font-size: 14px; }
111
+
112
+ .demos { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 24px; }
113
+ .demo-item { text-align: center; }
114
+ .demo-item img { width: 100%; border-radius: 10px; border: 1px solid var(--border); margin-bottom: 12px; }
115
+ .demo-item h4 { font-size: 16px; margin-bottom: 4px; }
116
+ .demo-item p { color: var(--text-muted); font-size: 13px; }
117
+
118
+ .compare-table { width: 100%; border-collapse: collapse; font-size: 15px; }
119
+ .compare-table th, .compare-table td { padding: 12px 16px; text-align: left; border-bottom: 1px solid var(--border); }
120
+ .compare-table th { color: var(--text-muted); font-weight: 600; font-size: 13px; text-transform: uppercase; letter-spacing: 0.5px; }
121
+ .compare-table tr:hover { background: var(--bg-card); }
122
+ .check { color: var(--green); font-weight: 700; }
123
+ .cross { color: var(--red); }
124
+
125
+ .tabs { display: flex; gap: 0; margin-bottom: 0; flex-wrap: wrap; }
126
+ .tab {
127
+ padding: 10px 20px; background: var(--bg-card); border: 1px solid var(--border);
128
+ border-bottom: none; color: var(--text-muted); cursor: pointer;
129
+ font-size: 14px; font-weight: 500; transition: all 0.2s;
130
+ }
131
+ .tab:first-child { border-radius: 8px 0 0 0; }
132
+ .tab:last-child { border-radius: 0 8px 0 0; }
133
+ button.tab { font-family: inherit; }
134
+ .tab.active { background: var(--bg-code); color: var(--text); border-bottom-color: var(--bg-code); }
135
+ .tab-content {
136
+ display: none; background: var(--bg-code); border: 1px solid var(--border);
137
+ border-radius: 0 8px 8px 8px; padding: 20px;
138
+ }
139
+ .tab-content.active { display: block; }
140
+ .tab-content pre {
141
+ font-family: 'SF Mono', 'Fira Code', monospace; font-size: 14px;
142
+ line-height: 1.5; white-space: pre-wrap; color: var(--green);
143
+ }
144
+
145
+ .support-grid {
146
+ display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
147
+ gap: 20px; max-width: 820px; margin: 0 auto 40px;
148
+ }
149
+ .support-card {
150
+ background: var(--bg-card); border: 1px solid var(--border);
151
+ border-radius: 12px; padding: 20px;
152
+ display: flex; flex-direction: column; align-items: center; text-align: center;
153
+ transition: background 0.3s;
154
+ }
155
+ .support-card img {
156
+ width: 160px; height: 160px; object-fit: contain;
157
+ border-radius: 8px; margin-bottom: 12px; background: #fff;
158
+ }
159
+ .support-card b { font-size: 14px; color: var(--text); }
160
+ .author-block {
161
+ text-align: center; padding-top: 32px; margin-top: 16px;
162
+ border-top: 1px solid var(--border);
163
+ }
164
+ .author-block h3 { font-size: 18px; margin-bottom: 8px; font-weight: 700; }
165
+ .author-block p { color: var(--text-muted); margin-bottom: 12px; }
166
+ .author-links { display: inline-flex; gap: 24px; font-size: 14px; }
167
+
168
+ footer {
169
+ border-top: 1px solid var(--border); padding: 32px 0;
170
+ text-align: center; color: var(--text-muted); font-size: 14px;
171
+ }
172
+ footer a { color: var(--text-muted); }
173
+ footer a:hover { color: var(--text); }
174
+
175
+ @media (max-width: 640px) {
176
+ .hero h1 { font-size: 32px; }
177
+ .hero p { font-size: 17px; }
178
+ section { padding: 48px 0; }
179
+ .features-grid { grid-template-columns: 1fr; }
180
+ .hero-install { flex-direction: column; font-size: 13px; }
181
+ }
182
+ .skip-link {
183
+ position: absolute; top: -40px; left: 0; background: var(--accent); color: #fff;
184
+ padding: 8px 16px; z-index: 200; font-size: 14px; transition: top 0.2s;
185
+ }
186
+ .skip-link:focus { top: 0; }
187
+ .table-wrapper { overflow-x: auto; -webkit-overflow-scrolling: touch; }
188
+ </style>
189
+ </head>
190
+ <body>
191
+ <a href="#main-content" class="skip-link">跳转到主要内容</a>
192
+
193
+ <nav role="navigation" aria-label="主导航">
194
+ <div class="logo">drawio-<span>skill</span></div>
195
+ <div class="nav-right">
196
+ <a href="index.html" class="lang-switch">English</a>
197
+ <button class="theme-btn" onclick="toggleTheme()" title="切换主题" aria-label="切换深色/浅色主题">&#x1F319;</button>
198
+ </div>
199
+ </nav>
200
+
201
+ <main id="main-content">
202
+ <!-- Hero -->
203
+ <div class="hero">
204
+ <div class="container">
205
+ <div class="hero-badge">v1.4.0 &mdash; 自定义输出目录</div>
206
+ <h1>drawio-<span>skill</span></h1>
207
+ <p>从文本到专业图表。通过自然语言生成 draw.io 文件,支持自检、迭代优化和 ML 模型图。</p>
208
+ <div class="hero-install">
209
+ <code id="install-cmd">git clone https://github.com/Agents365-ai/drawio-skill.git ~/.claude/skills/drawio-skill</code>
210
+ <button class="copy-btn" onclick="copyInstall()">复制</button>
211
+ </div>
212
+ <div class="hero-links">
213
+ <a href="https://github.com/Agents365-ai/drawio-skill" class="btn btn-primary">GitHub</a>
214
+ <a href="https://clawhub.ai/agents365-ai/drawio-pro-skill" class="btn btn-outline">ClawHub</a>
215
+ <a href="https://skillsmp.com/skills/agents365-ai-drawio-skill-skill-md" class="btn btn-outline">SkillsMP</a>
216
+ </div>
217
+ </div>
218
+ </div>
219
+
220
+ <!-- Features -->
221
+ <section>
222
+ <div class="container">
223
+ <h2 class="section-title">为什么选择这个 Skill</h2>
224
+ <p class="section-sub">唯一能自动读取输出并在展示前自动修复的纯 SKILL.md 方案。</p>
225
+ <div class="features-grid">
226
+ <div class="feature-card">
227
+ <div class="feature-icon">&#x1F4CB;</div>
228
+ <h3>6 种图表预设</h3>
229
+ <p>ERD、UML 类图、序列图、架构图、ML/深度学习、流程图 &mdash; 每种都有预设形状、样式和布局规范。</p>
230
+ </div>
231
+ <div class="feature-card">
232
+ <div class="feature-icon">&#x1F9E0;</div>
233
+ <h3>ML / 深度学习</h3>
234
+ <p>Transformer、CNN、LSTM 架构,带张量形状标注 (B, C, H, W)。专为 NeurIPS、ICML、ICLR 论文打造。</p>
235
+ </div>
236
+ <div class="feature-card">
237
+ <div class="feature-icon">&#x1F50D;</div>
238
+ <h3>自检循环</h3>
239
+ <p>读取导出的 PNG,检测 6 类问题(重叠、标签裁切、连线堆叠),在展示给你之前自动修复。</p>
240
+ </div>
241
+ <div class="feature-card">
242
+ <div class="feature-icon">&#x2728;</div>
243
+ <h3>动画连接线</h3>
244
+ <p>添加 <code>flowAnimation=1</code> 即可在箭头上显示移动动画。适合数据流和管道图的 SVG 导出。</p>
245
+ </div>
246
+ <div class="feature-card">
247
+ <div class="feature-icon">&#x1F3A8;</div>
248
+ <h3>样式预设</h3>
249
+ <p>用一个 <code>.drawio</code> 文件或图片"教会" Skill 你的风格,命名保存后可在后续图表中复用。内置 3 种预设:<code>default</code>、<code>corporate</code>、<code>handdrawn</code>。</p>
250
+ </div>
251
+ <div class="feature-card">
252
+ <div class="feature-icon">&#x1F310;</div>
253
+ <h3>6 大平台、零配置</h3>
254
+ <p>Claude Code、Opencode、OpenClaw、Hermes、Codex、SkillsMP &mdash; 仅需一个 SKILL.md + draw.io 桌面版,无需 MCP、Node.js。</p>
255
+ </div>
256
+ <div class="feature-card">
257
+ <div class="feature-icon">&#x1F4BB;</div>
258
+ <h3>浏览器降级</h3>
259
+ <p>没有桌面 CLI?自动生成 diagrams.net URL,在浏览器中查看和编辑图表。</p>
260
+ </div>
261
+ </div>
262
+ </div>
263
+ </section>
264
+
265
+ <!-- Demo Gallery -->
266
+ <section>
267
+ <div class="container">
268
+ <h2 class="section-title">示例展示</h2>
269
+ <p class="section-sub">不同拓扑的清晰连线路由 &mdash; 线条不会穿越无关形状。</p>
270
+ <div class="demos">
271
+ <div class="demo-item">
272
+ <img src="https://raw.githubusercontent.com/Agents365-ai/drawio-skill/main/assets/demo-star-cn.png" alt="星形拓扑图">
273
+ <h4>星形拓扑</h4>
274
+ <p>7 个节点 &mdash; 中央消息代理 + 6 个微服务辐射排列</p>
275
+ </div>
276
+ <div class="demo-item">
277
+ <img src="https://raw.githubusercontent.com/Agents365-ai/drawio-skill/main/assets/demo-layered-cn.png" alt="分层流程图">
278
+ <h4>分层流程</h4>
279
+ <p>10 个节点、4 层 &mdash; 交叉连线清晰路由</p>
280
+ </div>
281
+ <div class="demo-item">
282
+ <img src="https://raw.githubusercontent.com/Agents365-ai/drawio-skill/main/assets/demo-ring-cn.png" alt="环形循环图">
283
+ <h4>环形 / 循环</h4>
284
+ <p>8 个节点 &mdash; CI/CD 流水线,含闭合回路和分支</p>
285
+ </div>
286
+ </div>
287
+ </div>
288
+ </section>
289
+
290
+ <!-- Comparison -->
291
+ <section>
292
+ <div class="container">
293
+ <h2 class="section-title">对比原生智能体</h2>
294
+ <p class="section-sub">使用本 skill 与直接提示 LLM 的区别。</p>
295
+ <div class="table-wrapper">
296
+ <table class="compare-table">
297
+ <thead>
298
+ <tr><th>功能</th><th>原生智能体</th><th>本 Skill</th></tr>
299
+ </thead>
300
+ <tbody>
301
+ <tr><td>导出后自检</td><td class="cross">&#x2717;</td><td class="check">&#x2713; 2 轮自动修复</td></tr>
302
+ <tr><td>迭代反馈循环</td><td class="cross">&#x2717;</td><td class="check">&#x2713; 5 轮定向编辑</td></tr>
303
+ <tr><td>图表类型预设</td><td class="cross">&#x2717;</td><td class="check">&#x2713; 6 种预设(ERD、UML、序列、架构、ML、流程)</td></tr>
304
+ <tr><td>ML 模型图</td><td class="cross">&#x2717;</td><td class="check">&#x2713; 张量标注、层配色</td></tr>
305
+ <tr><td>动画连接线</td><td class="cross">&#x2717;</td><td class="check">&#x2713; flowAnimation=1</td></tr>
306
+ <tr><td>网格对齐布局</td><td class="cross">&#x2717;</td><td class="check">&#x2713; 10px 对齐</td></tr>
307
+ <tr><td>按复杂度分级间距</td><td class="cross">&#x2717;</td><td class="check">&#x2713; 200&ndash;350px</td></tr>
308
+ <tr><td>配色方案</td><td class="cross">随机</td><td class="check">&#x2713; 7 色语义系统</td></tr>
309
+ <tr><td>连线路由规则</td><td class="cross">基础</td><td class="check">&#x2713; 走廊 + waypoints + 分布</td></tr>
310
+ <tr><td>容器/分组</td><td class="cross">&#x2717;</td><td class="check">&#x2713; Swimlane + group + 自定义</td></tr>
311
+ <tr><td>嵌入式导出</td><td class="cross">&#x2717;</td><td class="check">&#x2713; --embed-diagram</td></tr>
312
+ <tr><td>浏览器降级</td><td class="cross">&#x2717;</td><td class="check">&#x2713; diagrams.net URL</td></tr>
313
+ <tr><td>自动启动桌面版</td><td class="cross">&#x2717;</td><td class="check">&#x2713; 导出后打开 .drawio</td></tr>
314
+ <tr><td>样式预设</td><td class="cross">&#x2717;</td><td class="check">&#x2713; 学习、保存并应用命名样式</td></tr>
315
+ </tbody>
316
+ </table>
317
+ </div>
318
+ </div>
319
+ </section>
320
+
321
+ <!-- Install -->
322
+ <section>
323
+ <div class="container">
324
+ <h2 class="section-title">安装</h2>
325
+ <p class="section-sub">选择你的平台,10 秒搞定。</p>
326
+ <div class="tabs" role="tablist" aria-label="安装平台">
327
+ <button class="tab active" role="tab" aria-selected="true" aria-controls="tab-claude" onclick="switchTab(event, 'tab-claude')">Claude Code</button>
328
+ <button class="tab" role="tab" aria-selected="false" aria-controls="tab-opencode" onclick="switchTab(event, 'tab-opencode')">Opencode</button>
329
+ <button class="tab" role="tab" aria-selected="false" aria-controls="tab-openclaw" onclick="switchTab(event, 'tab-openclaw')">OpenClaw</button>
330
+ <button class="tab" role="tab" aria-selected="false" aria-controls="tab-skillsmp" onclick="switchTab(event, 'tab-skillsmp')">SkillsMP</button>
331
+ <button class="tab" role="tab" aria-selected="false" aria-controls="tab-clawhub" onclick="switchTab(event, 'tab-clawhub')">ClawHub</button>
332
+ <button class="tab" role="tab" aria-selected="false" aria-controls="tab-codex" onclick="switchTab(event, 'tab-codex')">Codex</button>
333
+ </div>
334
+ <div id="tab-claude" class="tab-content active" role="tabpanel">
335
+ <pre># 全局安装(所有项目可用)
336
+ git clone https://github.com/Agents365-ai/drawio-skill.git ~/.claude/skills/drawio-skill
337
+
338
+ # 项目级安装
339
+ git clone https://github.com/Agents365-ai/drawio-skill.git .claude/skills/drawio-skill</pre>
340
+ </div>
341
+ <div id="tab-opencode" class="tab-content" role="tabpanel">
342
+ <pre># 全局安装(Opencode 原生路径)
343
+ git clone https://github.com/Agents365-ai/drawio-skill.git ~/.config/opencode/skills/drawio-skill
344
+
345
+ # 项目级安装
346
+ git clone https://github.com/Agents365-ai/drawio-skill.git .opencode/skills/drawio-skill
347
+
348
+ # 也可自动识别已有的 Claude Code 安装
349
+ # (~/.claude/skills/ 和 .claude/skills/ 会被自动读取)</pre>
350
+ </div>
351
+ <div id="tab-openclaw" class="tab-content" role="tabpanel">
352
+ <pre># 通过 ClawHub 安装
353
+ clawhub install drawio-pro-skill
354
+
355
+ # 手动安装
356
+ git clone https://github.com/Agents365-ai/drawio-skill.git ~/.openclaw/skills/drawio-skill</pre>
357
+ </div>
358
+ <div id="tab-skillsmp" class="tab-content" role="tabpanel">
359
+ <pre># 通过 SkillsMP CLI
360
+ skills install drawio-skill</pre>
361
+ </div>
362
+ <div id="tab-clawhub" class="tab-content" role="tabpanel">
363
+ <pre># 通过 ClawHub CLI
364
+ clawhub install drawio-pro-skill</pre>
365
+ </div>
366
+ <div id="tab-codex" class="tab-content" role="tabpanel">
367
+ <pre># 用户级安装
368
+ git clone https://github.com/Agents365-ai/drawio-skill.git ~/.agents/skills/drawio-skill
369
+
370
+ # 项目级安装
371
+ git clone https://github.com/Agents365-ai/drawio-skill.git .agents/skills/drawio-skill</pre>
372
+ </div>
373
+ </div>
374
+ </section>
375
+
376
+ <!-- 支持作者 -->
377
+ <section id="support">
378
+ <div class="container">
379
+ <h2 class="section-title">支持作者</h2>
380
+ <p class="section-sub">如果这个 skill 对你有帮助,欢迎支持作者。</p>
381
+ <div class="support-grid">
382
+ <div class="support-card">
383
+ <img src="https://raw.githubusercontent.com/Agents365-ai/images_payment/main/qrcode/wechat-pay.png" alt="微信支付" loading="lazy">
384
+ <b>微信支付</b>
385
+ </div>
386
+ <div class="support-card">
387
+ <img src="https://raw.githubusercontent.com/Agents365-ai/images_payment/main/qrcode/alipay.png" alt="支付宝" loading="lazy">
388
+ <b>支付宝</b>
389
+ </div>
390
+ <div class="support-card">
391
+ <img src="https://raw.githubusercontent.com/Agents365-ai/images_payment/main/qrcode/buymeacoffee.png" alt="Buy Me a Coffee" loading="lazy">
392
+ <b>Buy Me a Coffee</b>
393
+ </div>
394
+ <div class="support-card">
395
+ <img src="https://raw.githubusercontent.com/Agents365-ai/images_payment/main/awarding/award.gif" alt="打赏" loading="lazy">
396
+ <b>打赏</b>
397
+ </div>
398
+ </div>
399
+ <div class="author-block">
400
+ <h3>作者</h3>
401
+ <p><strong>Agents365-ai</strong></p>
402
+ <div class="author-links">
403
+ <a href="https://github.com/Agents365-ai">GitHub</a>
404
+ <a href="https://space.bilibili.com/441831884">Bilibili</a>
405
+ </div>
406
+ </div>
407
+ </div>
408
+ </section>
409
+
410
+ </main>
411
+
412
+ <!-- Footer -->
413
+ <footer>
414
+ <div class="container">
415
+ <p>
416
+ MIT 许可证 &middot;
417
+ <a href="https://github.com/Agents365-ai/drawio-skill">GitHub</a> &middot;
418
+ <a href="https://github.com/Agents365-ai">Agents365-ai</a>
419
+ </p>
420
+ </div>
421
+ </footer>
422
+
423
+ <script>
424
+ function copyInstall() {
425
+ const cmd = document.getElementById('install-cmd').textContent;
426
+ navigator.clipboard.writeText(cmd).then(() => {
427
+ const btn = document.querySelector('.copy-btn');
428
+ btn.textContent = '已复制!';
429
+ setTimeout(() => btn.textContent = '复制', 2000);
430
+ });
431
+ }
432
+ function switchTab(e, id) {
433
+ document.querySelectorAll('.tab').forEach(t => { t.classList.remove('active'); t.setAttribute('aria-selected', 'false'); });
434
+ document.querySelectorAll('.tab-content').forEach(t => t.classList.remove('active'));
435
+ e.target.classList.add('active');
436
+ e.target.setAttribute('aria-selected', 'true');
437
+ document.getElementById(id).classList.add('active');
438
+ }
439
+ function toggleTheme() {
440
+ const html = document.documentElement;
441
+ const current = html.getAttribute('data-theme');
442
+ const next = current === 'dark' ? 'light' : 'dark';
443
+ html.setAttribute('data-theme', next);
444
+ localStorage.setItem('theme', next);
445
+ document.querySelector('.theme-btn').innerHTML = next === 'dark' ? '&#x1F319;' : '&#x2600;&#xFE0F;';
446
+ }
447
+ (function() {
448
+ const saved = localStorage.getItem('theme');
449
+ if (saved) {
450
+ document.documentElement.setAttribute('data-theme', saved);
451
+ document.querySelector('.theme-btn').innerHTML = saved === 'dark' ? '&#x1F319;' : '&#x2600;&#xFE0F;';
452
+ }
453
+ })();
454
+ </script>
455
+ </body>
456
+ </html>