@iowarp/clio-coder 0.3.0

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 (226) hide show
  1. package/CHANGELOG.md +407 -0
  2. package/CODE_OF_CONDUCT.md +21 -0
  3. package/CONTRIBUTING.md +224 -0
  4. package/LICENSE +202 -0
  5. package/NOTICE +9 -0
  6. package/README.md +798 -0
  7. package/SECURITY.md +72 -0
  8. package/assets/clio-coder-logo-128.webp +0 -0
  9. package/damage-control-rules.yaml +419 -0
  10. package/dist/acp-UMLFVA3F.js +92 -0
  11. package/dist/agents-Q4MYPMUW.js +91 -0
  12. package/dist/auth-O6HYIJ6J.js +521 -0
  13. package/dist/chunk-262G75JS.js +35 -0
  14. package/dist/chunk-26BZQOAD.js +1281 -0
  15. package/dist/chunk-2J63S4SF.js +508 -0
  16. package/dist/chunk-3DANZDGR.js +717 -0
  17. package/dist/chunk-4UQA7NCT.js +29 -0
  18. package/dist/chunk-527KG6XR.js +497 -0
  19. package/dist/chunk-5LDRNKX2.js +1063 -0
  20. package/dist/chunk-5N2FG33Q.js +25 -0
  21. package/dist/chunk-67MTHP2E.js +135 -0
  22. package/dist/chunk-6CWDTGUC.js +20 -0
  23. package/dist/chunk-7BHLZB3A.js +2115 -0
  24. package/dist/chunk-7RBKDI66.js +348 -0
  25. package/dist/chunk-AMFR5YA3.js +541 -0
  26. package/dist/chunk-BBUH4VAA.js +1224 -0
  27. package/dist/chunk-BYEU76JP.js +899 -0
  28. package/dist/chunk-CLJ5HLUD.js +458 -0
  29. package/dist/chunk-D5YD55AR.js +116 -0
  30. package/dist/chunk-DXQNI4PC.js +61 -0
  31. package/dist/chunk-E3NYWENM.js +1004 -0
  32. package/dist/chunk-GNGDQYDU.js +34688 -0
  33. package/dist/chunk-GOTUR54M.js +9 -0
  34. package/dist/chunk-HBU5MTAM.js +41 -0
  35. package/dist/chunk-HMYNFFY4.js +28 -0
  36. package/dist/chunk-JPOWPFCU.js +1010 -0
  37. package/dist/chunk-JWHCJDCI.js +1215 -0
  38. package/dist/chunk-KBR4MZZR.js +41 -0
  39. package/dist/chunk-KKKPTZLM.js +93 -0
  40. package/dist/chunk-ME6DNWIU.js +66 -0
  41. package/dist/chunk-NI4DEJMC.js +88 -0
  42. package/dist/chunk-O4EJEDHO.js +659 -0
  43. package/dist/chunk-PIDUD6M2.js +31 -0
  44. package/dist/chunk-PS4PFJQP.js +29459 -0
  45. package/dist/chunk-QV47YRF4.js +48 -0
  46. package/dist/chunk-RQDWMVRB.js +279 -0
  47. package/dist/chunk-TFSSEXL6.js +136 -0
  48. package/dist/chunk-TKHQ4DGZ.js +8290 -0
  49. package/dist/chunk-TPOCL34A.js +2876 -0
  50. package/dist/chunk-UGYAX5YI.js +565 -0
  51. package/dist/chunk-UHTSULZS.js +461 -0
  52. package/dist/chunk-UU3R62TT.js +128 -0
  53. package/dist/chunk-UWIJNAOB.js +3906 -0
  54. package/dist/chunk-VOO7NYPP.js +914 -0
  55. package/dist/chunk-VPAWTYLY.js +117 -0
  56. package/dist/chunk-WD6AJM35.js +1216 -0
  57. package/dist/chunk-X3BR7HWV.js +115 -0
  58. package/dist/chunk-X3NE4WVW.js +120 -0
  59. package/dist/chunk-XNISANGE.js +1395 -0
  60. package/dist/chunk-XV4ZJ6ZM.js +3177 -0
  61. package/dist/cli/index.js +236 -0
  62. package/dist/clio-KIQ5SNDS.js +53 -0
  63. package/dist/components-JVHMUBEB.js +653 -0
  64. package/dist/config-ZFCDBMDC.js +372 -0
  65. package/dist/configure-G4E3A2PG.js +27 -0
  66. package/dist/context-CDXTP2MP.js +293 -0
  67. package/dist/context-E3KIFVXI.js +185 -0
  68. package/dist/context-clear-3F4PLXOS.js +102 -0
  69. package/dist/context-index-Q7YSYTR3.js +106 -0
  70. package/dist/docs-YIETIWZI.js +280 -0
  71. package/dist/doctor-M5HJJZOL.js +61 -0
  72. package/dist/domains/agents/builtins/architect.md +33 -0
  73. package/dist/domains/agents/builtins/coder.md +31 -0
  74. package/dist/domains/agents/builtins/context-bootstrap.md +38 -0
  75. package/dist/domains/agents/builtins/debugger.md +30 -0
  76. package/dist/domains/agents/builtins/documenter.md +31 -0
  77. package/dist/domains/agents/builtins/git-master.md +30 -0
  78. package/dist/domains/agents/builtins/provenance.md +30 -0
  79. package/dist/domains/agents/builtins/researcher.md +71 -0
  80. package/dist/domains/agents/builtins/scout.md +42 -0
  81. package/dist/domains/agents/builtins/tester.md +31 -0
  82. package/dist/domains/agents/builtins/verifier.md +30 -0
  83. package/dist/domains/agents/builtins/wiki-writer.md +41 -0
  84. package/dist/eval-B3KZZESM.js +2674 -0
  85. package/dist/evidence-V67CHM35.js +233 -0
  86. package/dist/evolve-YDZSUQYA.js +518 -0
  87. package/dist/extensions-SRG7XCAH.js +207 -0
  88. package/dist/fleet-CA2CRTVG.js +760 -0
  89. package/dist/fleet-preflight-CLIAX7YR.js +21 -0
  90. package/dist/init-2OZDJE2D.js +227 -0
  91. package/dist/memory-3PIQQAKX.js +207 -0
  92. package/dist/models-DY35XI7Y.js +237 -0
  93. package/dist/paths-5OMXW7Z4.js +57 -0
  94. package/dist/preload-KZVHET2B.js +11 -0
  95. package/dist/reset-PIFYNOS3.js +216 -0
  96. package/dist/run-3VSPP24F.js +735 -0
  97. package/dist/share-D36RQCXM.js +241 -0
  98. package/dist/skills-F2MRLELY.js +445 -0
  99. package/dist/skills-eval-E2ZTW4PL.js +932 -0
  100. package/dist/targets-DZMEZAH4.js +977 -0
  101. package/dist/trace-7NYCUI2J.js +250 -0
  102. package/dist/uninstall-AD3JWHBB.js +322 -0
  103. package/dist/upgrade-WYYBKGDY.js +301 -0
  104. package/dist/usage-ULIDAGFF.js +755 -0
  105. package/dist/version-ROZ6CZKH.js +16 -0
  106. package/dist/wiki-generate-PKFIX6OB.js +377 -0
  107. package/dist/worker/entry.js +1739 -0
  108. package/docs/README.md +93 -0
  109. package/docs/acp.md +120 -0
  110. package/docs/alcf-provider.md +72 -0
  111. package/docs/architecture.md +172 -0
  112. package/docs/artifact-versions.md +54 -0
  113. package/docs/built-in-agents.md +265 -0
  114. package/docs/capacity-and-scheduling.md +97 -0
  115. package/docs/commands-and-modes.md +554 -0
  116. package/docs/config-knobs-audit.md +115 -0
  117. package/docs/configuration-and-targets.md +812 -0
  118. package/docs/context-engine.md +236 -0
  119. package/docs/dispatch-architecture-rationale.md +126 -0
  120. package/docs/documentation-coverage.md +46 -0
  121. package/docs/documentation-guide.md +166 -0
  122. package/docs/environment-variables.md +105 -0
  123. package/docs/eval-runner.md +205 -0
  124. package/docs/evals-internal.md +298 -0
  125. package/docs/evidence-and-memory.md +243 -0
  126. package/docs/evolution.md +143 -0
  127. package/docs/exit-codes-and-output.md +74 -0
  128. package/docs/extensions-and-sharing.md +306 -0
  129. package/docs/fleet-demo-runbook.md +179 -0
  130. package/docs/fleet-dispatch.md +591 -0
  131. package/docs/glossary.md +75 -0
  132. package/docs/html/agents_blueprint.html +936 -0
  133. package/docs/html/alcf_blueprint.html +324 -0
  134. package/docs/html/architecture_blueprint.html +850 -0
  135. package/docs/html/commands_blueprint.html +794 -0
  136. package/docs/html/config_knobs_audit_blueprint.html +178 -0
  137. package/docs/html/configuration_blueprint.html +1080 -0
  138. package/docs/html/context_blueprint.html +603 -0
  139. package/docs/html/documentation_blueprint.html +832 -0
  140. package/docs/html/environment_blueprint.html +404 -0
  141. package/docs/html/eval_blueprint.html +743 -0
  142. package/docs/html/evals_internal_blueprint.html +190 -0
  143. package/docs/html/evolution_blueprint.html +674 -0
  144. package/docs/html/extensions_blueprint.html +2065 -0
  145. package/docs/html/fleet_dispatch_blueprint.html +286 -0
  146. package/docs/html/index.html +919 -0
  147. package/docs/html/lifecycle_blueprint.html +723 -0
  148. package/docs/html/memory_blueprint.html +699 -0
  149. package/docs/html/middleware_blueprint.html +664 -0
  150. package/docs/html/models_blueprint.html +2366 -0
  151. package/docs/html/observability_blueprint.html +683 -0
  152. package/docs/html/provider_adapter_blueprint.html +245 -0
  153. package/docs/html/safety_blueprint.html +1386 -0
  154. package/docs/html/shared.css +571 -0
  155. package/docs/html/shared.js +143 -0
  156. package/docs/html/skills_blueprint.html +671 -0
  157. package/docs/html/soak_blueprint.html +182 -0
  158. package/docs/html/tool_usage_blueprint.html +350 -0
  159. package/docs/html/tools_blueprint.html +2249 -0
  160. package/docs/html/trace_blueprint.html +235 -0
  161. package/docs/html/tui_design_blueprint.html +314 -0
  162. package/docs/html/validation_blueprint.html +961 -0
  163. package/docs/html/worker_dispatch_blueprint.html +231 -0
  164. package/docs/installation-and-lifecycle.md +308 -0
  165. package/docs/middleware-and-components.md +148 -0
  166. package/docs/model-catalog.md +189 -0
  167. package/docs/observability.md +233 -0
  168. package/docs/proactive-memory.md +452 -0
  169. package/docs/prompt-envelope-and-tools.md +142 -0
  170. package/docs/provider-adapter-cookbook.md +148 -0
  171. package/docs/release-cut-checklist.md +138 -0
  172. package/docs/safety-model.md +357 -0
  173. package/docs/scientific-validation.md +105 -0
  174. package/docs/session-lifecycle.md +156 -0
  175. package/docs/skills-marketplace.md +46 -0
  176. package/docs/tool-usage.md +527 -0
  177. package/docs/trace-store.md +132 -0
  178. package/docs/troubleshooting.md +33 -0
  179. package/docs/tui-design.md +239 -0
  180. package/docs/worker-dispatch-mechanics.md +242 -0
  181. package/package.json +132 -0
  182. package/skills/README.md +408 -0
  183. package/skills/git/commit-crafting/SKILL.md +79 -0
  184. package/skills/git/commit-crafting/evals.md +92 -0
  185. package/skills/git/create-pr/SKILL.md +116 -0
  186. package/skills/git/create-pr/evals.md +114 -0
  187. package/skills/git/investigate-issue/SKILL.md +139 -0
  188. package/skills/git/investigate-issue/evals.md +94 -0
  189. package/skills/git/resolve-merge-conflicts/SKILL.md +96 -0
  190. package/skills/git/resolve-merge-conflicts/evals.md +58 -0
  191. package/skills/git/review-changes/SKILL.md +103 -0
  192. package/skills/git/review-changes/evals.md +85 -0
  193. package/skills/git/worktree-create/SKILL.md +92 -0
  194. package/skills/git/worktree-create/evals.md +97 -0
  195. package/skills/git/worktree-create/references/worktree-setup.md +66 -0
  196. package/skills/git/worktree-merge/SKILL.md +95 -0
  197. package/skills/git/worktree-merge/evals.md +114 -0
  198. package/skills/skill-marketplace.json +261 -0
  199. package/skills/workflow/cut-it/SKILL.md +86 -0
  200. package/skills/workflow/cut-it/evals.md +42 -0
  201. package/src/domains/agents/builtins/architect.md +33 -0
  202. package/src/domains/agents/builtins/coder.md +31 -0
  203. package/src/domains/agents/builtins/context-bootstrap.md +38 -0
  204. package/src/domains/agents/builtins/debugger.md +30 -0
  205. package/src/domains/agents/builtins/documenter.md +31 -0
  206. package/src/domains/agents/builtins/git-master.md +30 -0
  207. package/src/domains/agents/builtins/provenance.md +30 -0
  208. package/src/domains/agents/builtins/researcher.md +71 -0
  209. package/src/domains/agents/builtins/scout.md +42 -0
  210. package/src/domains/agents/builtins/tester.md +31 -0
  211. package/src/domains/agents/builtins/verifier.md +30 -0
  212. package/src/domains/agents/builtins/wiki-writer.md +41 -0
  213. package/src/domains/agents/fleets/build-review.md +34 -0
  214. package/src/domains/agents/fleets/build-test.md +35 -0
  215. package/src/domains/agents/fleets/sdlc.md +86 -0
  216. package/src/domains/prompts/fragments/identity/clio-worker.md +11 -0
  217. package/src/domains/prompts/fragments/identity/clio.md +26 -0
  218. package/src/domains/prompts/fragments/operating/contract.md +64 -0
  219. package/src/domains/prompts/fragments/safety/auto-edit.md +14 -0
  220. package/src/domains/prompts/fragments/safety/full-auto.md +14 -0
  221. package/src/domains/prompts/fragments/safety/read-only.md +13 -0
  222. package/src/domains/prompts/fragments/safety/suggest.md +13 -0
  223. package/src/domains/prompts/fragments/wiki/page.md +75 -0
  224. package/src/domains/prompts/fragments/wiki/plan.md +48 -0
  225. package/src/domains/providers/models/cloud-models/alcf.yaml +40 -0
  226. package/src/domains/providers/models/local-models/clio-local-coding-targets.yaml +993 -0
package/docs/html/middleware_blueprint.html ADDED
@@ -0,0 +1,664 @@
1
+ <!DOCTYPE html>
2
+ <html lang="en">
3
+ <head>
4
+ <meta charset="UTF-8">
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+ <title>Clio Coder Middleware &amp; Components Blueprint (v0.3.0)</title>
7
+
8
+ <style>
9
+ :root {
10
+ --bg-dark: #090d16;
11
+ --bg-grid: rgba(255, 255, 255, 0.02);
12
+ --bg-card: rgba(13, 20, 38, 0.45);
13
+ --bg-card-hover: rgba(20, 30, 58, 0.6);
14
+ --border-card: rgba(255, 255, 255, 0.08);
15
+ --border-card-hover: rgba(0, 240, 255, 0.3);
16
+ --text-main: #f3f4f6;
17
+ --text-muted: #9ca3af;
18
+ --text-dim: #6b7280;
19
+
20
+ --color-cyan: #00f0ff;
21
+ --color-cyan-rgb: 0, 240, 255;
22
+ --color-purple: #bd00ff;
23
+ --color-purple-rgb: 189, 0, 255;
24
+ --color-emerald: #10b981;
25
+ --color-emerald-rgb: 16, 185, 129;
26
+ --color-amber: #f59e0b;
27
+ --color-amber-rgb: 245, 158, 11;
28
+ --color-rose: #ef4444;
29
+ --color-rose-rgb: 239, 68, 68;
30
+
31
+ --gradient-main: linear-gradient(135deg, var(--color-cyan), var(--color-purple));
32
+ --shadow-glow: 0 0 25px rgba(0, 240, 255, 0.15);
33
+ --font-sans: "Segoe UI", -apple-system, BlinkMacSystemFont, Roboto, "Helvetica Neue", Arial, sans-serif;
34
+ --font-mono: "SFMono-Regular", Consolas, "Liberation Mono", Menlo, monospace;
35
+
36
+ --glass-blur: blur(12px);
37
+ }
38
+
39
+ * {
40
+ box-sizing: border-box;
41
+ margin: 0;
42
+ padding: 0;
43
+ }
44
+
45
+ body {
46
+ background-color: var(--bg-dark);
47
+ background-image:
48
+ radial-gradient(circle at 10% 20%, rgba(var(--color-cyan-rgb), 0.05) 0%, transparent 40%),
49
+ radial-gradient(circle at 90% 80%, rgba(var(--color-purple-rgb), 0.05) 0%, transparent 40%),
50
+ radial-gradient(circle at 50% 50%, #0d1527 0%, var(--bg-dark) 100%);
51
+ color: var(--text-main);
52
+ font-family: var(--font-sans);
53
+ min-height: 100vh;
54
+ line-height: 1.6;
55
+ overflow-x: hidden;
56
+ position: relative;
57
+ }
58
+
59
+ body::before {
60
+ content: '';
61
+ position: absolute;
62
+ inset: 0;
63
+ background-image: linear-gradient(var(--bg-grid) 1px, transparent 1px),
64
+ linear-gradient(90deg, var(--bg-grid) 1px, transparent 1px);
65
+ background-size: 40px 40px;
66
+ background-position: center top;
67
+ pointer-events: none;
68
+ z-index: 0;
69
+ opacity: 0.8;
70
+ }
71
+
72
+ .container {
73
+ max-width: 1400px;
74
+ margin: 0 auto;
75
+ padding: 2rem;
76
+ position: relative;
77
+ z-index: 1;
78
+ }
79
+
80
+ /* Header Styling */
81
+ header {
82
+ display: flex;
83
+ justify-content: space-between;
84
+ align-items: center;
85
+ margin-bottom: 2.5rem;
86
+ padding-bottom: 1.5rem;
87
+ border-bottom: 1px solid rgba(255, 255, 255, 0.05);
88
+ }
89
+
90
+ .header-left {
91
+ display: flex;
92
+ align-items: center;
93
+ gap: 1rem;
94
+ }
95
+
96
+ .header-logo {
97
+ display: inline-flex;
98
+ align-items: center;
99
+ justify-content: center;
100
+ width: 48px;
101
+ height: 48px;
102
+ background: rgba(255, 255, 255, 0.02);
103
+ border: 1px solid var(--border-card);
104
+ border-radius: 12px;
105
+ }
106
+
107
+ .header-logo svg {
108
+ width: 28px;
109
+ height: 28px;
110
+ }
111
+
112
+ .header-title-wrapper h1 {
113
+ font-size: 1.5rem;
114
+ font-weight: 800;
115
+ letter-spacing: -0.03em;
116
+ background: linear-gradient(to right, #ffffff, #c7d2fe, var(--color-cyan));
117
+ -webkit-background-clip: text;
118
+ -webkit-text-fill-color: transparent;
119
+ }
120
+
121
+ .header-title-wrapper p {
122
+ font-size: 0.825rem;
123
+ color: var(--text-muted);
124
+ }
125
+
126
+ .header-right {
127
+ display: flex;
128
+ align-items: center;
129
+ gap: 1rem;
130
+ }
131
+
132
+ .back-btn {
133
+ background: rgba(255, 255, 255, 0.03);
134
+ border: 1px solid var(--border-card);
135
+ color: var(--text-muted);
136
+ padding: 0.5rem 1rem;
137
+ border-radius: 8px;
138
+ font-size: 0.875rem;
139
+ font-weight: 600;
140
+ text-decoration: none;
141
+ display: inline-flex;
142
+ align-items: center;
143
+ gap: 0.5rem;
144
+ transition: all 0.2s;
145
+ }
146
+
147
+ .back-btn:hover {
148
+ background: rgba(255, 255, 255, 0.08);
149
+ color: var(--text-main);
150
+ border-color: rgba(var(--color-cyan-rgb), 0.3);
151
+ }
152
+
153
+ .version-badge {
154
+ background: rgba(0, 240, 255, 0.08);
155
+ border: 1px solid rgba(0, 240, 255, 0.25);
156
+ color: var(--color-cyan);
157
+ padding: 0.35rem 0.75rem;
158
+ border-radius: 50px;
159
+ font-size: 0.75rem;
160
+ font-weight: 600;
161
+ font-family: var(--font-mono);
162
+ }
163
+
164
+ /* Tabs Navigation */
165
+ .tabs-nav {
166
+ display: flex;
167
+ gap: 0.75rem;
168
+ margin-bottom: 2rem;
169
+ }
170
+
171
+ .tab-btn {
172
+ background: rgba(255, 255, 255, 0.03);
173
+ border: 1px solid var(--border-card);
174
+ color: var(--text-muted);
175
+ padding: 0.6rem 1.25rem;
176
+ border-radius: 8px;
177
+ font-size: 0.875rem;
178
+ font-weight: 600;
179
+ cursor: pointer;
180
+ display: flex;
181
+ align-items: center;
182
+ gap: 0.5rem;
183
+ transition: all 0.2s;
184
+ }
185
+
186
+ .tab-btn:hover {
187
+ background: rgba(255, 255, 255, 0.06);
188
+ color: var(--text-main);
189
+ }
190
+
191
+ .tab-btn.active {
192
+ background: var(--gradient-main);
193
+ color: #090d16;
194
+ border-color: transparent;
195
+ box-shadow: 0 4px 15px rgba(var(--color-cyan-rgb), 0.25);
196
+ }
197
+
198
+ /* Content Layout */
199
+ .tab-pane {
200
+ display: none;
201
+ animation: fadeIn 0.3s ease-out forwards;
202
+ }
203
+
204
+ .tab-pane.active {
205
+ display: block;
206
+ }
207
+
208
+ @keyframes fadeIn {
209
+ from { opacity: 0; transform: translateY(8px); }
210
+ to { opacity: 1; transform: translateY(0); }
211
+ }
212
+
213
+ /* Split layout */
214
+ .blueprint-layout {
215
+ display: grid;
216
+ grid-template-columns: 1fr 1fr;
217
+ gap: 2rem;
218
+ align-items: start;
219
+ }
220
+
221
+ @media (max-width: 1100px) {
222
+ .blueprint-layout {
223
+ grid-template-columns: 1fr;
224
+ }
225
+ }
226
+
227
+ .glass-card {
228
+ background: var(--bg-card);
229
+ border: 1px solid var(--border-card);
230
+ border-radius: 16px;
231
+ padding: 1.75rem;
232
+ margin-bottom: 2rem;
233
+ backdrop-filter: var(--glass-blur);
234
+ box-shadow: 0 8px 32px 0 rgba(0, 0, 0, 0.3);
235
+ }
236
+
237
+ .glass-card h2 {
238
+ font-size: 1.25rem;
239
+ font-weight: 700;
240
+ color: #ffffff;
241
+ margin-bottom: 1.25rem;
242
+ display: flex;
243
+ align-items: center;
244
+ gap: 0.5rem;
245
+ border-bottom: 1px solid rgba(255, 255, 255, 0.05);
246
+ padding-bottom: 0.75rem;
247
+ }
248
+
249
+ .glass-card h2 svg {
250
+ width: 18px;
251
+ height: 18px;
252
+ color: var(--color-cyan);
253
+ }
254
+
255
+ .glass-card p {
256
+ font-size: 0.925rem;
257
+ color: var(--text-muted);
258
+ margin-bottom: 1rem;
259
+ }
260
+
261
+ /* Form Elements */
262
+ .form-group {
263
+ margin-bottom: 1.25rem;
264
+ }
265
+
266
+ .form-group label {
267
+ display: block;
268
+ font-size: 0.8rem;
269
+ font-weight: 600;
270
+ color: var(--text-muted);
271
+ margin-bottom: 0.5rem;
272
+ text-transform: uppercase;
273
+ letter-spacing: 0.05em;
274
+ }
275
+
276
+ select, input, textarea {
277
+ width: 100%;
278
+ background: rgba(9, 13, 22, 0.7);
279
+ border: 1px solid var(--border-card);
280
+ border-radius: 8px;
281
+ padding: 0.65rem 0.85rem;
282
+ color: #fff;
283
+ font-family: var(--font-sans);
284
+ font-size: 0.9rem;
285
+ outline: none;
286
+ }
287
+
288
+ /* Scanner Presets list */
289
+ .presets-list {
290
+ display: flex;
291
+ flex-wrap: wrap;
292
+ gap: 0.4rem;
293
+ margin-bottom: 1.25rem;
294
+ }
295
+
296
+ .preset-btn {
297
+ background: rgba(255, 255, 255, 0.03);
298
+ border: 1px solid var(--border-card);
299
+ color: var(--text-muted);
300
+ padding: 0.3rem 0.6rem;
301
+ border-radius: 4px;
302
+ font-size: 0.725rem;
303
+ cursor: pointer;
304
+ transition: all 0.2s;
305
+ }
306
+
307
+ .preset-btn:hover {
308
+ background: rgba(0, 240, 255, 0.08);
309
+ border-color: var(--color-cyan);
310
+ color: #fff;
311
+ }
312
+
313
+ /* Scanner Output block */
314
+ .scanner-out {
315
+ background: #020408;
316
+ border: 1px solid var(--border-card);
317
+ border-radius: 8px;
318
+ padding: 1rem;
319
+ font-family: var(--font-mono);
320
+ font-size: 0.825rem;
321
+ }
322
+
323
+ .scanner-line {
324
+ margin-bottom: 0.5rem;
325
+ }
326
+
327
+ .scanner-line strong {
328
+ color: var(--color-cyan);
329
+ }
330
+
331
+ /* Reload Badge */
332
+ .reload-badge {
333
+ display: inline-block;
334
+ font-size: 0.725rem;
335
+ padding: 0.15rem 0.4rem;
336
+ border-radius: 4px;
337
+ font-weight: 700;
338
+ text-transform: uppercase;
339
+ }
340
+
341
+ .reload-badge.hot { background: rgba(16, 185, 129, 0.1); border: 1px solid rgba(16, 185, 129, 0.3); color: var(--color-emerald); }
342
+ .reload-badge.dispatch { background: rgba(0, 240, 255, 0.1); border: 1px solid rgba(0, 240, 255, 0.3); color: var(--color-cyan); }
343
+ .reload-badge.restart { background: rgba(239, 68, 68, 0.1); border: 1px solid rgba(239, 68, 68, 0.3); color: var(--color-rose); }
344
+
345
+ /* Pipeline execution list */
346
+ .pipeline-step {
347
+ background: rgba(0,0,0,0.2);
348
+ border: 1px solid rgba(255,255,255,0.05);
349
+ padding: 0.75rem 1rem;
350
+ border-radius: 8px;
351
+ margin-bottom: 0.75rem;
352
+ font-size: 0.875rem;
353
+ }
354
+
355
+ .pipeline-step strong {
356
+ display: block;
357
+ color: #fff;
358
+ }
359
+
360
+ .pipeline-step span {
361
+ font-size: 0.75rem;
362
+ color: var(--text-muted);
363
+ }
364
+
365
+ /* Tables */
366
+ .ref-table {
367
+ width: 100%;
368
+ border-collapse: collapse;
369
+ margin: 1.5rem 0;
370
+ font-size: 0.9rem;
371
+ }
372
+
373
+ .ref-table th, .ref-table td {
374
+ padding: 0.65rem 0.85rem;
375
+ border: 1px solid var(--border-card);
376
+ text-align: left;
377
+ }
378
+
379
+ .ref-table th {
380
+ background: rgba(255,255,255,0.03);
381
+ }
382
+
383
+ pre {
384
+ background: rgba(0,0,0,0.3);
385
+ border: 1px solid var(--border-card);
386
+ border-radius: 8px;
387
+ padding: 1rem;
388
+ overflow-x: auto;
389
+ margin: 1rem 0;
390
+ }
391
+
392
+ code {
393
+ font-family: var(--font-mono);
394
+ font-size: 0.85rem;
395
+ }
396
+
397
+ /* Footer */
398
+ footer {
399
+ text-align: center;
400
+ margin-top: 4rem;
401
+ padding-top: 2rem;
402
+ border-top: 1px solid rgba(255, 255, 255, 0.05);
403
+ color: var(--text-dim);
404
+ font-size: 0.875rem;
405
+ }
406
+ </style>
407
+ </head>
408
+ <body>
409
+ <div class="container">
410
+ <header>
411
+ <div class="header-left">
412
+ <div class="header-logo">
413
+ <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" style="color: var(--color-cyan);"><title>Icon</title>
414
+ <rect x="4" y="4" width="16" height="16" rx="2" ry="2"></rect>
415
+ <rect x="9" y="9" width="6" height="6"></rect>
416
+ <line x1="9" y1="1" x2="9" y2="4"></line>
417
+ <line x1="15" y1="1" x2="15" y2="4"></line>
418
+ <line x1="9" y1="20" x2="9" y2="23"></line>
419
+ <line x1="15" y1="20" x2="15" y2="23"></line>
420
+ <line x1="20" y1="9" x2="23" y2="9"></line>
421
+ <line x1="20" y1="15" x2="23" y2="15"></line>
422
+ <line x1="1" y1="9" x2="4" y2="9"></line>
423
+ <line x1="1" y1="15" x2="4" y2="15"></line>
424
+ </svg>
425
+ </div>
426
+ <div class="header-title-wrapper">
427
+ <h1>Clio Coder Middleware &amp; Component Registry</h1>
428
+ <p>Durable component hash scanner, hook actions, and experimental effect rules</p>
429
+ </div>
430
+ </div>
431
+ <div class="header-right">
432
+ <span class="version-badge">Clio Coder v0.3.0</span>
433
+ <a href="index.html" class="back-btn">
434
+ <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><title>Icon</title><line x1="19" y1="12" x2="5" y2="12"></line><polyline points="12 19 5 12 12 5"></polyline></svg>
435
+ Dashboard Hub
436
+ </a>
437
+ </div>
438
+ </header>
439
+
440
+ <div class="tabs-nav">
441
+ <button type="button" class="tab-btn active" onclick="switchTab('interactive')">
442
+ <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><title>Icon</title><polyline points="22 12 18 12 15 21 9 3 6 12 2 12"></polyline></svg>
443
+ Interactive Scanner &amp; Pipeline
444
+ </button>
445
+ <button type="button" class="tab-btn" onclick="switchTab('reference')">
446
+ <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><title>Icon</title><path d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z"></path><polyline points="14 2 14 8 20 8"></polyline><line x1="16" y1="13" x2="8" y2="13"></line><line x1="16" y1="17" x2="8" y2="17"></line><polyline points="10 9 9 9 8 9"></polyline></svg>
447
+ Full Technical Reference
448
+ </button>
449
+ </div>
450
+
451
+ <!-- TAB 1: INTERACTIVE -->
452
+ <main class="tab-pane active" id="pane-interactive">
453
+ <div class="blueprint-layout">
454
+
455
+ <!-- Left: Scanner -->
456
+ <div class="specs-col">
457
+ <div class="glass-card">
458
+ <h2>
459
+ <svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><title>Icon</title><rect x="2" y="2" width="20" height="20" rx="2.18" ry="2.18"></rect><line x1="7" y1="2" x2="7" y2="22"></line><line x1="17" y1="2" x2="17" y2="22"></line><line x1="2" y1="12" x2="22" y2="12"></line><line x1="2" y1="7" x2="22" y2="7"></line><line x1="2" y1="17" x2="22" y2="17"></line></svg>
460
+ Interactive Component Scanner
461
+ </h2>
462
+ <p>Modify simulated files and monitor hash tracking alongside reload lifecycle bounds.</p>
463
+
464
+ <div class="presets-list">
465
+ <span class="preset-btn" onclick="modifyComponent('recipe')">Modify Coder Agent Recipe</span>
466
+ <span class="preset-btn" onclick="modifyComponent('rules')">Modify Safety Rule Pack</span>
467
+ <span class="preset-btn" onclick="modifyComponent('schema')">Modify Config Schema</span>
468
+ </div>
469
+
470
+ <div class="scanner-out">
471
+ <div class="scanner-line">
472
+ <strong>Component ID:</strong> <span id="scanId">agent-recipe:coder</span>
473
+ </div>
474
+ <div class="scanner-line">
475
+ <strong>File Path:</strong> <span id="scanPath">src/domains/agents/builtins/coder.md</span>
476
+ </div>
477
+ <div class="scanner-line">
478
+ <strong>SHA-256 Hash:</strong> <span id="scanHash" style="font-family:var(--font-mono); color:var(--color-purple)">7c8f9024a...</span>
479
+ </div>
480
+ <div class="scanner-line">
481
+ <strong>Reload Bound:</strong> <span class="reload-badge hot" id="scanReload">hot</span>
482
+ </div>
483
+ </div>
484
+ </div>
485
+ </div>
486
+
487
+ <!-- Right: Pipeline -->
488
+ <div class="specs-col">
489
+ <div class="glass-card">
490
+ <h2>
491
+ <svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><title>Icon</title><polyline points="22 12 18 12 15 21 9 3 6 12 2 12"></polyline></svg>
492
+ Dynamic Hook &amp; Effect Pipeline
493
+ </h2>
494
+ <p>Pick a hook trigger to simulate evaluation rules and trace generated effects.</p>
495
+
496
+ <div class="form-group">
497
+ <label for="hookSelect">Hook Trigger Event</label>
498
+ <select id="hookSelect" onchange="runPipelineSim()">
499
+ <option value="before_tool">before_tool (Registry call admission)</option>
500
+ <option value="after_tool">after_tool (Post tool execution)</option>
501
+ <option value="turn_end">turn_end (Turn completion reminder)</option>
502
+ <option value="on_compaction">on_compaction (Sliding window overflows)</option>
503
+ </select>
504
+ </div>
505
+
506
+ <div class="verdict-header">Pipeline Trace log</div>
507
+ <div class="pipeline-out" id="pipelineBox">
508
+ <!-- filled dynamically -->
509
+ </div>
510
+ </div>
511
+ </div>
512
+
513
+ </div>
514
+ </main>
515
+
516
+ <!-- TAB 2: TECHNICAL REFERENCE -->
517
+ <main class="tab-pane" id="pane-reference">
518
+ <div class="glass-card">
519
+ <h2>Clio Coder Middleware &amp; Component Specifications</h2>
520
+
521
+ <h3 style="margin: 1.5rem 0 0.5rem 0; color:#fff;">Component scanner</h3>
522
+ <p>The scanner computes SHA-256 signatures of codebase blocks and compiles component records used in reviews to flag runtime behavior alterations.</p>
523
+
524
+ <h3 style="margin: 1.5rem 0 0.5rem 0; color:#fff;">Reload Classes</h3>
525
+ <table class="ref-table">
526
+ <thead>
527
+ <tr>
528
+ <th>Reload Class</th>
529
+ <th>Meaning</th>
530
+ </tr>
531
+ </thead>
532
+ <tbody>
533
+ <tr>
534
+ <td><code>hot</code></td>
535
+ <td>Can be hot-reloaded during active session runtime.</td>
536
+ </tr>
537
+ <tr>
538
+ <td><code>next-dispatch</code></td>
539
+ <td>Applies to subsequent worker dispatches.</td>
540
+ </tr>
541
+ <tr>
542
+ <td><code>restart-required</code></td>
543
+ <td>Requires full Clio restart to load schema updates safely.</td>
544
+ </tr>
545
+ </tbody>
546
+ </table>
547
+
548
+ <h3 style="margin: 1.5rem 0 0.5rem 0; color:#fff;">Middleware Hooks and Effects</h3>
549
+ <p>Middleware filters evaluate tool calls, turn lifecycle reminders, and compaction observation:</p>
550
+ <ul style="margin-left: 2rem; margin-bottom: 1.5rem; color:var(--text-muted)">
551
+ <li style="margin-bottom:0.4rem;"><strong>Hook IDs</strong>: <code>before_tool</code>, <code>after_tool</code>, <code>turn_start</code>, <code>turn_end</code>, <code>on_compaction</code>.</li>
552
+ <li style="margin-bottom:0.4rem;"><strong>Effect Kinds</strong>: <code>inject_reminder</code>, <code>annotate_tool_result</code>, <code>block_tool</code>, <code>protect_path</code>, <code>request_continuation</code>.</li>
553
+ <li style="margin-bottom:0.4rem;"><strong>Phase-Aware Budgets</strong> (<code>DEFAULT_MIDDLEWARE_HOOK_BUDGETS_MS</code>): <code>before_tool</code>: 25ms, <code>after_tool</code>: 25ms, <code>turn_start</code>: 50ms, <code>turn_end</code>: 75ms, <code>on_compaction</code>: 150ms.</li>
554
+ </ul>
555
+ </div>
556
+ </main>
557
+
558
+ <footer>
559
+ <p>Clio Coder Middleware spec &bull; Version 0.3.0</p>
560
+ </footer>
561
+ </div>
562
+
563
+ <script>
564
+ // Tab switching
565
+ function switchTab(tabId) {
566
+ document.querySelectorAll('.tab-btn').forEach(btn => { btn.classList.remove('active'); });
567
+ document.querySelectorAll('.tab-pane').forEach(pane => { pane.classList.remove('active'); });
568
+
569
+ if (tabId === 'interactive') {
570
+ document.querySelector('.tab-btn:nth-child(1)').classList.add('active');
571
+ document.getElementById('pane-interactive').classList.add('active');
572
+ } else {
573
+ document.querySelector('.tab-btn:nth-child(2)').classList.add('active');
574
+ document.getElementById('pane-reference').classList.add('active');
575
+ }
576
+ }
577
+
578
+ // Component details
579
+ const components = {
580
+ recipe: {
581
+ id: "agent-recipe:coder",
582
+ path: "src/domains/agents/builtins/coder.md",
583
+ reload: "hot",
584
+ hashes: ["e3b0c44298fc1c149afbf4c8996fb92427ae41e4649b934ca495991b7852b855", "8f3a9e048fc28bd2987116298ae8cf5527ae41e4649b934ca495991b7852b822"]
585
+ },
586
+ rules: {
587
+ id: "safety-rule-pack:damage-control",
588
+ path: "damage-control-rules.yaml",
589
+ reload: "next-dispatch",
590
+ hashes: ["c4298fc1c149afbf4c8996fb92427ae41e4649b934ca495991b7852b8222", "a048fc28bd2987116298ae8cf5527ae41e4649b934ca495991b7852b8222fa1b0"]
591
+ },
592
+ schema: {
593
+ id: "config-schema:settings",
594
+ path: "src/domains/config/schema.ts",
595
+ reload: "restart-required",
596
+ hashes: ["d3a98ea0c44298fc1c149afbf4c8996fbd67ae41e4649b934ca495991b7852b", "f98216298ae8cf5527ae41e4649b934ca495991b7852b8220f18835d03829ad"]
597
+ }
598
+ };
599
+
600
+ let activeComp = 'recipe';
601
+ let hashToggle = false;
602
+
603
+ function modifyComponent(type) {
604
+ activeComp = type;
605
+ hashToggle = !hashToggle;
606
+
607
+ const comp = components[type];
608
+ document.getElementById('scanId').innerText = comp.id;
609
+ document.getElementById('scanPath').innerText = comp.path;
610
+ document.getElementById('scanHash').innerText = hashToggle ? comp.hashes[0] : comp.hashes[1];
611
+
612
+ const badge = document.getElementById('scanReload');
613
+ badge.innerText = comp.reload;
614
+ badge.className = `reload-badge ${comp.reload === 'hot' ? 'hot' : (comp.reload === 'next-dispatch' ? 'dispatch' : 'restart')}`;
615
+ }
616
+
617
+ // Pipeline simulator logic
618
+ function runPipelineSim() {
619
+ const hook = document.getElementById('hookSelect').value;
620
+ const box = document.getElementById('pipelineBox');
621
+ box.innerHTML = '';
622
+
623
+ if (hook === 'before_tool') {
624
+ addStep("Trigger: before_tool", "Tool Registry intercepts write invocation on 'src/core/init.ts'.", "info");
625
+ addStep("Rules scan: safety.protect-path", "Checking path exclusions list...", "info");
626
+ addStep("Effect generated: block_tool", "Rule triggered: target path matches read-only boundary vendor/.", "warn");
627
+ addStep("Consuming effect", "Registry blocks tool execution and throws safety exception.", "error");
628
+ } else if (hook === 'after_tool') {
629
+ addStep("Trigger: after_tool", "Tool Coder finishes execution of 'write src/index.ts'.", "info");
630
+ addStep("Observer notification", "File mutation and skill activation observers receive a best-effort event.", "info");
631
+ addStep("Effect generated: annotate_tool_result", "Tool result can receive deterministic metadata without changing the underlying file write.", "success");
632
+ } else if (hook === 'turn_end') {
633
+ addStep("Trigger: turn_end", "Assistant stops after announcing work without tool calls.", "info");
634
+ addStep("Rules scan: stalled-turn", "Checking whether one bounded continuation should be requested.", "info");
635
+ addStep("Effect generated: request_continuation", "Chat loop schedules one automatic continuation for the same user prompt.", "success");
636
+ } else {
637
+ addStep("Trigger: on_compaction", "Messages ledger pressure exceeds threshold (0.83 > 0.80).", "info");
638
+ addStep("Observer notification", "Compaction event is available to middleware telemetry.", "info");
639
+ addStep("Effects discarded", "This hook observes state only; emitted effects are ignored by design.", "success");
640
+ }
641
+ }
642
+
643
+ function addStep(title, desc, type) {
644
+ const box = document.getElementById('pipelineBox');
645
+ const step = document.createElement('div');
646
+ step.className = 'pipeline-step';
647
+
648
+ let color = '#fff';
649
+ if (type === 'warn') color = 'var(--color-amber)';
650
+ if (type === 'error') color = 'var(--color-rose)';
651
+ if (type === 'success') color = 'var(--color-emerald)';
652
+
653
+ step.innerHTML = `<strong style="color:${color}">${title}</strong><span>${desc}</span>`;
654
+ box.appendChild(step);
655
+ }
656
+
657
+ // Init
658
+ window.onload = () => {
659
+ modifyComponent('recipe');
660
+ runPipelineSim();
661
+ };
662
+ </script>
663
+ </body>
664
+ </html>