@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.
- package/CHANGELOG.md +407 -0
- package/CODE_OF_CONDUCT.md +21 -0
- package/CONTRIBUTING.md +224 -0
- package/LICENSE +202 -0
- package/NOTICE +9 -0
- package/README.md +798 -0
- package/SECURITY.md +72 -0
- package/assets/clio-coder-logo-128.webp +0 -0
- package/damage-control-rules.yaml +419 -0
- package/dist/acp-UMLFVA3F.js +92 -0
- package/dist/agents-Q4MYPMUW.js +91 -0
- package/dist/auth-O6HYIJ6J.js +521 -0
- package/dist/chunk-262G75JS.js +35 -0
- package/dist/chunk-26BZQOAD.js +1281 -0
- package/dist/chunk-2J63S4SF.js +508 -0
- package/dist/chunk-3DANZDGR.js +717 -0
- package/dist/chunk-4UQA7NCT.js +29 -0
- package/dist/chunk-527KG6XR.js +497 -0
- package/dist/chunk-5LDRNKX2.js +1063 -0
- package/dist/chunk-5N2FG33Q.js +25 -0
- package/dist/chunk-67MTHP2E.js +135 -0
- package/dist/chunk-6CWDTGUC.js +20 -0
- package/dist/chunk-7BHLZB3A.js +2115 -0
- package/dist/chunk-7RBKDI66.js +348 -0
- package/dist/chunk-AMFR5YA3.js +541 -0
- package/dist/chunk-BBUH4VAA.js +1224 -0
- package/dist/chunk-BYEU76JP.js +899 -0
- package/dist/chunk-CLJ5HLUD.js +458 -0
- package/dist/chunk-D5YD55AR.js +116 -0
- package/dist/chunk-DXQNI4PC.js +61 -0
- package/dist/chunk-E3NYWENM.js +1004 -0
- package/dist/chunk-GNGDQYDU.js +34688 -0
- package/dist/chunk-GOTUR54M.js +9 -0
- package/dist/chunk-HBU5MTAM.js +41 -0
- package/dist/chunk-HMYNFFY4.js +28 -0
- package/dist/chunk-JPOWPFCU.js +1010 -0
- package/dist/chunk-JWHCJDCI.js +1215 -0
- package/dist/chunk-KBR4MZZR.js +41 -0
- package/dist/chunk-KKKPTZLM.js +93 -0
- package/dist/chunk-ME6DNWIU.js +66 -0
- package/dist/chunk-NI4DEJMC.js +88 -0
- package/dist/chunk-O4EJEDHO.js +659 -0
- package/dist/chunk-PIDUD6M2.js +31 -0
- package/dist/chunk-PS4PFJQP.js +29459 -0
- package/dist/chunk-QV47YRF4.js +48 -0
- package/dist/chunk-RQDWMVRB.js +279 -0
- package/dist/chunk-TFSSEXL6.js +136 -0
- package/dist/chunk-TKHQ4DGZ.js +8290 -0
- package/dist/chunk-TPOCL34A.js +2876 -0
- package/dist/chunk-UGYAX5YI.js +565 -0
- package/dist/chunk-UHTSULZS.js +461 -0
- package/dist/chunk-UU3R62TT.js +128 -0
- package/dist/chunk-UWIJNAOB.js +3906 -0
- package/dist/chunk-VOO7NYPP.js +914 -0
- package/dist/chunk-VPAWTYLY.js +117 -0
- package/dist/chunk-WD6AJM35.js +1216 -0
- package/dist/chunk-X3BR7HWV.js +115 -0
- package/dist/chunk-X3NE4WVW.js +120 -0
- package/dist/chunk-XNISANGE.js +1395 -0
- package/dist/chunk-XV4ZJ6ZM.js +3177 -0
- package/dist/cli/index.js +236 -0
- package/dist/clio-KIQ5SNDS.js +53 -0
- package/dist/components-JVHMUBEB.js +653 -0
- package/dist/config-ZFCDBMDC.js +372 -0
- package/dist/configure-G4E3A2PG.js +27 -0
- package/dist/context-CDXTP2MP.js +293 -0
- package/dist/context-E3KIFVXI.js +185 -0
- package/dist/context-clear-3F4PLXOS.js +102 -0
- package/dist/context-index-Q7YSYTR3.js +106 -0
- package/dist/docs-YIETIWZI.js +280 -0
- package/dist/doctor-M5HJJZOL.js +61 -0
- package/dist/domains/agents/builtins/architect.md +33 -0
- package/dist/domains/agents/builtins/coder.md +31 -0
- package/dist/domains/agents/builtins/context-bootstrap.md +38 -0
- package/dist/domains/agents/builtins/debugger.md +30 -0
- package/dist/domains/agents/builtins/documenter.md +31 -0
- package/dist/domains/agents/builtins/git-master.md +30 -0
- package/dist/domains/agents/builtins/provenance.md +30 -0
- package/dist/domains/agents/builtins/researcher.md +71 -0
- package/dist/domains/agents/builtins/scout.md +42 -0
- package/dist/domains/agents/builtins/tester.md +31 -0
- package/dist/domains/agents/builtins/verifier.md +30 -0
- package/dist/domains/agents/builtins/wiki-writer.md +41 -0
- package/dist/eval-B3KZZESM.js +2674 -0
- package/dist/evidence-V67CHM35.js +233 -0
- package/dist/evolve-YDZSUQYA.js +518 -0
- package/dist/extensions-SRG7XCAH.js +207 -0
- package/dist/fleet-CA2CRTVG.js +760 -0
- package/dist/fleet-preflight-CLIAX7YR.js +21 -0
- package/dist/init-2OZDJE2D.js +227 -0
- package/dist/memory-3PIQQAKX.js +207 -0
- package/dist/models-DY35XI7Y.js +237 -0
- package/dist/paths-5OMXW7Z4.js +57 -0
- package/dist/preload-KZVHET2B.js +11 -0
- package/dist/reset-PIFYNOS3.js +216 -0
- package/dist/run-3VSPP24F.js +735 -0
- package/dist/share-D36RQCXM.js +241 -0
- package/dist/skills-F2MRLELY.js +445 -0
- package/dist/skills-eval-E2ZTW4PL.js +932 -0
- package/dist/targets-DZMEZAH4.js +977 -0
- package/dist/trace-7NYCUI2J.js +250 -0
- package/dist/uninstall-AD3JWHBB.js +322 -0
- package/dist/upgrade-WYYBKGDY.js +301 -0
- package/dist/usage-ULIDAGFF.js +755 -0
- package/dist/version-ROZ6CZKH.js +16 -0
- package/dist/wiki-generate-PKFIX6OB.js +377 -0
- package/dist/worker/entry.js +1739 -0
- package/docs/README.md +93 -0
- package/docs/acp.md +120 -0
- package/docs/alcf-provider.md +72 -0
- package/docs/architecture.md +172 -0
- package/docs/artifact-versions.md +54 -0
- package/docs/built-in-agents.md +265 -0
- package/docs/capacity-and-scheduling.md +97 -0
- package/docs/commands-and-modes.md +554 -0
- package/docs/config-knobs-audit.md +115 -0
- package/docs/configuration-and-targets.md +812 -0
- package/docs/context-engine.md +236 -0
- package/docs/dispatch-architecture-rationale.md +126 -0
- package/docs/documentation-coverage.md +46 -0
- package/docs/documentation-guide.md +166 -0
- package/docs/environment-variables.md +105 -0
- package/docs/eval-runner.md +205 -0
- package/docs/evals-internal.md +298 -0
- package/docs/evidence-and-memory.md +243 -0
- package/docs/evolution.md +143 -0
- package/docs/exit-codes-and-output.md +74 -0
- package/docs/extensions-and-sharing.md +306 -0
- package/docs/fleet-demo-runbook.md +179 -0
- package/docs/fleet-dispatch.md +591 -0
- package/docs/glossary.md +75 -0
- package/docs/html/agents_blueprint.html +936 -0
- package/docs/html/alcf_blueprint.html +324 -0
- package/docs/html/architecture_blueprint.html +850 -0
- package/docs/html/commands_blueprint.html +794 -0
- package/docs/html/config_knobs_audit_blueprint.html +178 -0
- package/docs/html/configuration_blueprint.html +1080 -0
- package/docs/html/context_blueprint.html +603 -0
- package/docs/html/documentation_blueprint.html +832 -0
- package/docs/html/environment_blueprint.html +404 -0
- package/docs/html/eval_blueprint.html +743 -0
- package/docs/html/evals_internal_blueprint.html +190 -0
- package/docs/html/evolution_blueprint.html +674 -0
- package/docs/html/extensions_blueprint.html +2065 -0
- package/docs/html/fleet_dispatch_blueprint.html +286 -0
- package/docs/html/index.html +919 -0
- package/docs/html/lifecycle_blueprint.html +723 -0
- package/docs/html/memory_blueprint.html +699 -0
- package/docs/html/middleware_blueprint.html +664 -0
- package/docs/html/models_blueprint.html +2366 -0
- package/docs/html/observability_blueprint.html +683 -0
- package/docs/html/provider_adapter_blueprint.html +245 -0
- package/docs/html/safety_blueprint.html +1386 -0
- package/docs/html/shared.css +571 -0
- package/docs/html/shared.js +143 -0
- package/docs/html/skills_blueprint.html +671 -0
- package/docs/html/soak_blueprint.html +182 -0
- package/docs/html/tool_usage_blueprint.html +350 -0
- package/docs/html/tools_blueprint.html +2249 -0
- package/docs/html/trace_blueprint.html +235 -0
- package/docs/html/tui_design_blueprint.html +314 -0
- package/docs/html/validation_blueprint.html +961 -0
- package/docs/html/worker_dispatch_blueprint.html +231 -0
- package/docs/installation-and-lifecycle.md +308 -0
- package/docs/middleware-and-components.md +148 -0
- package/docs/model-catalog.md +189 -0
- package/docs/observability.md +233 -0
- package/docs/proactive-memory.md +452 -0
- package/docs/prompt-envelope-and-tools.md +142 -0
- package/docs/provider-adapter-cookbook.md +148 -0
- package/docs/release-cut-checklist.md +138 -0
- package/docs/safety-model.md +357 -0
- package/docs/scientific-validation.md +105 -0
- package/docs/session-lifecycle.md +156 -0
- package/docs/skills-marketplace.md +46 -0
- package/docs/tool-usage.md +527 -0
- package/docs/trace-store.md +132 -0
- package/docs/troubleshooting.md +33 -0
- package/docs/tui-design.md +239 -0
- package/docs/worker-dispatch-mechanics.md +242 -0
- package/package.json +132 -0
- package/skills/README.md +408 -0
- package/skills/git/commit-crafting/SKILL.md +79 -0
- package/skills/git/commit-crafting/evals.md +92 -0
- package/skills/git/create-pr/SKILL.md +116 -0
- package/skills/git/create-pr/evals.md +114 -0
- package/skills/git/investigate-issue/SKILL.md +139 -0
- package/skills/git/investigate-issue/evals.md +94 -0
- package/skills/git/resolve-merge-conflicts/SKILL.md +96 -0
- package/skills/git/resolve-merge-conflicts/evals.md +58 -0
- package/skills/git/review-changes/SKILL.md +103 -0
- package/skills/git/review-changes/evals.md +85 -0
- package/skills/git/worktree-create/SKILL.md +92 -0
- package/skills/git/worktree-create/evals.md +97 -0
- package/skills/git/worktree-create/references/worktree-setup.md +66 -0
- package/skills/git/worktree-merge/SKILL.md +95 -0
- package/skills/git/worktree-merge/evals.md +114 -0
- package/skills/skill-marketplace.json +261 -0
- package/skills/workflow/cut-it/SKILL.md +86 -0
- package/skills/workflow/cut-it/evals.md +42 -0
- package/src/domains/agents/builtins/architect.md +33 -0
- package/src/domains/agents/builtins/coder.md +31 -0
- package/src/domains/agents/builtins/context-bootstrap.md +38 -0
- package/src/domains/agents/builtins/debugger.md +30 -0
- package/src/domains/agents/builtins/documenter.md +31 -0
- package/src/domains/agents/builtins/git-master.md +30 -0
- package/src/domains/agents/builtins/provenance.md +30 -0
- package/src/domains/agents/builtins/researcher.md +71 -0
- package/src/domains/agents/builtins/scout.md +42 -0
- package/src/domains/agents/builtins/tester.md +31 -0
- package/src/domains/agents/builtins/verifier.md +30 -0
- package/src/domains/agents/builtins/wiki-writer.md +41 -0
- package/src/domains/agents/fleets/build-review.md +34 -0
- package/src/domains/agents/fleets/build-test.md +35 -0
- package/src/domains/agents/fleets/sdlc.md +86 -0
- package/src/domains/prompts/fragments/identity/clio-worker.md +11 -0
- package/src/domains/prompts/fragments/identity/clio.md +26 -0
- package/src/domains/prompts/fragments/operating/contract.md +64 -0
- package/src/domains/prompts/fragments/safety/auto-edit.md +14 -0
- package/src/domains/prompts/fragments/safety/full-auto.md +14 -0
- package/src/domains/prompts/fragments/safety/read-only.md +13 -0
- package/src/domains/prompts/fragments/safety/suggest.md +13 -0
- package/src/domains/prompts/fragments/wiki/page.md +75 -0
- package/src/domains/prompts/fragments/wiki/plan.md +48 -0
- package/src/domains/providers/models/cloud-models/alcf.yaml +40 -0
- package/src/domains/providers/models/local-models/clio-local-coding-targets.yaml +993 -0
|
@@ -0,0 +1,832 @@
|
|
|
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 Documentation Alignment Portal</title>
|
|
7
|
+
|
|
8
|
+
<style>
|
|
9
|
+
:root {
|
|
10
|
+
--bg-dark: #090d16;
|
|
11
|
+
--bg-card: rgba(17, 24, 39, 0.7);
|
|
12
|
+
--border-card: rgba(255, 255, 255, 0.08);
|
|
13
|
+
--text-main: #f3f4f6;
|
|
14
|
+
--text-muted: #9ca3af;
|
|
15
|
+
--text-dark: #6b7280;
|
|
16
|
+
|
|
17
|
+
--color-cyan: #00f0ff;
|
|
18
|
+
--color-cyan-rgb: 0, 240, 255;
|
|
19
|
+
--color-purple: #bd00ff;
|
|
20
|
+
--color-purple-rgb: 189, 0, 255;
|
|
21
|
+
--color-emerald: #10b981;
|
|
22
|
+
--color-emerald-rgb: 16, 185, 129;
|
|
23
|
+
--color-amber: #f59e0b;
|
|
24
|
+
--color-amber-rgb: 245, 158, 11;
|
|
25
|
+
--color-rose: #ef4444;
|
|
26
|
+
--color-rose-rgb: 239, 68, 68;
|
|
27
|
+
|
|
28
|
+
--gradient-main: linear-gradient(135deg, var(--color-cyan), var(--color-purple));
|
|
29
|
+
--shadow-glow: 0 0 20px rgba(var(--color-cyan-rgb), 0.15);
|
|
30
|
+
--font-sans: "Segoe UI", -apple-system, BlinkMacSystemFont, Roboto, "Helvetica Neue", Arial, sans-serif;
|
|
31
|
+
--font-mono: "SFMono-Regular", Consolas, "Liberation Mono", Menlo, monospace;
|
|
32
|
+
}
|
|
33
|
+
|
|
34
|
+
* {
|
|
35
|
+
box-sizing: border-box;
|
|
36
|
+
margin: 0;
|
|
37
|
+
padding: 0;
|
|
38
|
+
}
|
|
39
|
+
|
|
40
|
+
body {
|
|
41
|
+
background-color: var(--bg-dark);
|
|
42
|
+
background-image:
|
|
43
|
+
radial-gradient(circle at 10% 20%, rgba(var(--color-cyan-rgb), 0.05) 0%, transparent 40%),
|
|
44
|
+
radial-gradient(circle at 90% 80%, rgba(var(--color-purple-rgb), 0.05) 0%, transparent 40%),
|
|
45
|
+
radial-gradient(circle at 50% 50%, #0d1527 0%, var(--bg-dark) 100%);
|
|
46
|
+
color: var(--text-main);
|
|
47
|
+
font-family: var(--font-sans);
|
|
48
|
+
min-height: 100vh;
|
|
49
|
+
line-height: 1.6;
|
|
50
|
+
overflow-x: hidden;
|
|
51
|
+
}
|
|
52
|
+
|
|
53
|
+
::-webkit-scrollbar {
|
|
54
|
+
width: 8px;
|
|
55
|
+
height: 8px;
|
|
56
|
+
}
|
|
57
|
+
::-webkit-scrollbar-track {
|
|
58
|
+
background: rgba(255, 255, 255, 0.02);
|
|
59
|
+
}
|
|
60
|
+
::-webkit-scrollbar-thumb {
|
|
61
|
+
background: rgba(255, 255, 255, 0.1);
|
|
62
|
+
border-radius: 4px;
|
|
63
|
+
}
|
|
64
|
+
::-webkit-scrollbar-thumb:hover {
|
|
65
|
+
background: rgba(var(--color-cyan-rgb), 0.3);
|
|
66
|
+
}
|
|
67
|
+
|
|
68
|
+
.container {
|
|
69
|
+
max-width: 1400px;
|
|
70
|
+
margin: 0 auto;
|
|
71
|
+
padding: 2rem;
|
|
72
|
+
}
|
|
73
|
+
|
|
74
|
+
header {
|
|
75
|
+
text-align: center;
|
|
76
|
+
margin-bottom: 2.5rem;
|
|
77
|
+
position: relative;
|
|
78
|
+
}
|
|
79
|
+
|
|
80
|
+
.header-logo {
|
|
81
|
+
display: inline-flex;
|
|
82
|
+
align-items: center;
|
|
83
|
+
justify-content: center;
|
|
84
|
+
width: 72px;
|
|
85
|
+
height: 72px;
|
|
86
|
+
background: rgba(255, 255, 255, 0.03);
|
|
87
|
+
border: 1px solid var(--border-card);
|
|
88
|
+
border-radius: 18px;
|
|
89
|
+
margin-bottom: 1rem;
|
|
90
|
+
box-shadow: var(--shadow-glow);
|
|
91
|
+
position: relative;
|
|
92
|
+
}
|
|
93
|
+
|
|
94
|
+
.header-logo::after {
|
|
95
|
+
content: '';
|
|
96
|
+
position: absolute;
|
|
97
|
+
inset: -2px;
|
|
98
|
+
border-radius: 20px;
|
|
99
|
+
background: var(--gradient-main);
|
|
100
|
+
z-index: -1;
|
|
101
|
+
opacity: 0.3;
|
|
102
|
+
filter: blur(4px);
|
|
103
|
+
}
|
|
104
|
+
|
|
105
|
+
.header-logo img {
|
|
106
|
+
width: 78%;
|
|
107
|
+
height: 78%;
|
|
108
|
+
object-fit: contain;
|
|
109
|
+
filter: drop-shadow(0 0 8px rgba(0, 240, 255, 0.35));
|
|
110
|
+
}
|
|
111
|
+
|
|
112
|
+
h1 {
|
|
113
|
+
font-size: 2.5rem;
|
|
114
|
+
font-weight: 800;
|
|
115
|
+
letter-spacing: -0.05em;
|
|
116
|
+
margin-bottom: 0.5rem;
|
|
117
|
+
background: linear-gradient(to right, #ffffff, #c7d2fe, var(--color-cyan));
|
|
118
|
+
-webkit-background-clip: text;
|
|
119
|
+
-webkit-text-fill-color: transparent;
|
|
120
|
+
}
|
|
121
|
+
|
|
122
|
+
.subtitle {
|
|
123
|
+
font-size: 1.1rem;
|
|
124
|
+
color: var(--text-muted);
|
|
125
|
+
max-width: 600px;
|
|
126
|
+
margin: 0 auto 1.5rem auto;
|
|
127
|
+
font-weight: 400;
|
|
128
|
+
}
|
|
129
|
+
|
|
130
|
+
.meta-grid {
|
|
131
|
+
display: flex;
|
|
132
|
+
justify-content: center;
|
|
133
|
+
gap: 1rem;
|
|
134
|
+
margin-bottom: 2rem;
|
|
135
|
+
flex-wrap: wrap;
|
|
136
|
+
}
|
|
137
|
+
|
|
138
|
+
.meta-badge {
|
|
139
|
+
background: rgba(255, 255, 255, 0.04);
|
|
140
|
+
border: 1px solid var(--border-card);
|
|
141
|
+
padding: 0.5rem 1rem;
|
|
142
|
+
border-radius: 8px;
|
|
143
|
+
font-size: 0.85rem;
|
|
144
|
+
display: flex;
|
|
145
|
+
align-items: center;
|
|
146
|
+
gap: 0.5rem;
|
|
147
|
+
}
|
|
148
|
+
|
|
149
|
+
.meta-badge .label {
|
|
150
|
+
color: var(--text-muted);
|
|
151
|
+
}
|
|
152
|
+
|
|
153
|
+
.meta-badge .value {
|
|
154
|
+
font-family: var(--font-mono);
|
|
155
|
+
font-weight: 600;
|
|
156
|
+
color: var(--color-cyan);
|
|
157
|
+
}
|
|
158
|
+
|
|
159
|
+
.tabs-nav {
|
|
160
|
+
display: flex;
|
|
161
|
+
justify-content: center;
|
|
162
|
+
gap: 0.75rem;
|
|
163
|
+
margin-bottom: 2rem;
|
|
164
|
+
flex-wrap: wrap;
|
|
165
|
+
}
|
|
166
|
+
|
|
167
|
+
.tab-btn {
|
|
168
|
+
background: rgba(255, 255, 255, 0.03);
|
|
169
|
+
border: 1px solid var(--border-card);
|
|
170
|
+
color: var(--text-muted);
|
|
171
|
+
padding: 0.75rem 1.5rem;
|
|
172
|
+
border-radius: 9999px;
|
|
173
|
+
font-weight: 600;
|
|
174
|
+
cursor: pointer;
|
|
175
|
+
display: flex;
|
|
176
|
+
align-items: center;
|
|
177
|
+
gap: 0.5rem;
|
|
178
|
+
transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
|
|
179
|
+
}
|
|
180
|
+
|
|
181
|
+
.tab-btn:hover {
|
|
182
|
+
background: rgba(255, 255, 255, 0.08);
|
|
183
|
+
color: var(--text-main);
|
|
184
|
+
border-color: rgba(var(--color-cyan-rgb), 0.3);
|
|
185
|
+
}
|
|
186
|
+
|
|
187
|
+
.tab-btn.active {
|
|
188
|
+
background: var(--gradient-main);
|
|
189
|
+
color: #090d16;
|
|
190
|
+
font-weight: 700;
|
|
191
|
+
border-color: transparent;
|
|
192
|
+
box-shadow: 0 4px 15px rgba(var(--color-cyan-rgb), 0.3);
|
|
193
|
+
}
|
|
194
|
+
|
|
195
|
+
.tab-btn svg {
|
|
196
|
+
width: 18px;
|
|
197
|
+
height: 18px;
|
|
198
|
+
fill: none;
|
|
199
|
+
stroke: currentColor;
|
|
200
|
+
stroke-width: 2;
|
|
201
|
+
}
|
|
202
|
+
|
|
203
|
+
.tab-pane {
|
|
204
|
+
display: none;
|
|
205
|
+
animation: fadeIn 0.4s ease-out forwards;
|
|
206
|
+
}
|
|
207
|
+
|
|
208
|
+
.tab-pane.active {
|
|
209
|
+
display: block;
|
|
210
|
+
}
|
|
211
|
+
|
|
212
|
+
@keyframes fadeIn {
|
|
213
|
+
from {
|
|
214
|
+
opacity: 0;
|
|
215
|
+
transform: translateY(10px);
|
|
216
|
+
}
|
|
217
|
+
to {
|
|
218
|
+
opacity: 1;
|
|
219
|
+
transform: translateY(0);
|
|
220
|
+
}
|
|
221
|
+
}
|
|
222
|
+
|
|
223
|
+
.glass-card {
|
|
224
|
+
background: var(--bg-card);
|
|
225
|
+
border: 1px solid var(--border-card);
|
|
226
|
+
backdrop-filter: blur(16px);
|
|
227
|
+
-webkit-backdrop-filter: blur(16px);
|
|
228
|
+
border-radius: 16px;
|
|
229
|
+
padding: 2rem;
|
|
230
|
+
box-shadow: 0 10px 30px rgba(0, 0, 0, 0.2);
|
|
231
|
+
margin-bottom: 2rem;
|
|
232
|
+
}
|
|
233
|
+
|
|
234
|
+
.card-title {
|
|
235
|
+
font-size: 1.3rem;
|
|
236
|
+
font-weight: 700;
|
|
237
|
+
margin-bottom: 1.25rem;
|
|
238
|
+
color: #ffffff;
|
|
239
|
+
display: flex;
|
|
240
|
+
align-items: center;
|
|
241
|
+
gap: 0.75rem;
|
|
242
|
+
border-bottom: 1px solid rgba(255, 255, 255, 0.05);
|
|
243
|
+
padding-bottom: 0.75rem;
|
|
244
|
+
}
|
|
245
|
+
|
|
246
|
+
.card-title svg {
|
|
247
|
+
width: 20px;
|
|
248
|
+
height: 20px;
|
|
249
|
+
stroke: var(--color-cyan);
|
|
250
|
+
stroke-width: 2;
|
|
251
|
+
fill: none;
|
|
252
|
+
}
|
|
253
|
+
|
|
254
|
+
.grid-2 {
|
|
255
|
+
display: grid;
|
|
256
|
+
grid-template-columns: 1fr 1fr;
|
|
257
|
+
gap: 1.5rem;
|
|
258
|
+
}
|
|
259
|
+
|
|
260
|
+
@media (max-width: 900px) {
|
|
261
|
+
.grid-2 {
|
|
262
|
+
grid-template-columns: 1fr;
|
|
263
|
+
}
|
|
264
|
+
}
|
|
265
|
+
|
|
266
|
+
.form-group {
|
|
267
|
+
margin-bottom: 1.25rem;
|
|
268
|
+
}
|
|
269
|
+
|
|
270
|
+
label {
|
|
271
|
+
display: block;
|
|
272
|
+
font-size: 0.85rem;
|
|
273
|
+
color: var(--text-muted);
|
|
274
|
+
margin-bottom: 0.5rem;
|
|
275
|
+
font-weight: 500;
|
|
276
|
+
text-transform: uppercase;
|
|
277
|
+
letter-spacing: 0.05em;
|
|
278
|
+
}
|
|
279
|
+
|
|
280
|
+
input[type="text"], input[type="number"], select, textarea {
|
|
281
|
+
width: 100%;
|
|
282
|
+
background: rgba(255, 255, 255, 0.03);
|
|
283
|
+
border: 1px solid var(--border-card);
|
|
284
|
+
border-radius: 8px;
|
|
285
|
+
padding: 0.75rem 1rem;
|
|
286
|
+
color: var(--text-main);
|
|
287
|
+
font-family: var(--font-sans);
|
|
288
|
+
font-size: 0.95rem;
|
|
289
|
+
transition: all 0.2s ease;
|
|
290
|
+
}
|
|
291
|
+
|
|
292
|
+
input:focus, select:focus, textarea:focus {
|
|
293
|
+
outline: none;
|
|
294
|
+
border-color: var(--color-cyan);
|
|
295
|
+
box-shadow: 0 0 10px rgba(var(--color-cyan-rgb), 0.15);
|
|
296
|
+
background: rgba(255, 255, 255, 0.06);
|
|
297
|
+
}
|
|
298
|
+
|
|
299
|
+
textarea.code-area {
|
|
300
|
+
font-family: var(--font-mono);
|
|
301
|
+
font-size: 0.85rem;
|
|
302
|
+
background: #05080e;
|
|
303
|
+
resize: vertical;
|
|
304
|
+
min-height: 250px;
|
|
305
|
+
line-height: 1.5;
|
|
306
|
+
}
|
|
307
|
+
|
|
308
|
+
.btn {
|
|
309
|
+
background: rgba(255, 255, 255, 0.05);
|
|
310
|
+
border: 1px solid var(--border-card);
|
|
311
|
+
color: var(--text-main);
|
|
312
|
+
padding: 0.75rem 1.5rem;
|
|
313
|
+
border-radius: 8px;
|
|
314
|
+
font-weight: 600;
|
|
315
|
+
cursor: pointer;
|
|
316
|
+
display: inline-flex;
|
|
317
|
+
align-items: center;
|
|
318
|
+
gap: 0.5rem;
|
|
319
|
+
transition: all 0.2s ease;
|
|
320
|
+
}
|
|
321
|
+
|
|
322
|
+
.btn:hover {
|
|
323
|
+
background: rgba(255, 255, 255, 0.1);
|
|
324
|
+
border-color: rgba(var(--color-cyan-rgb), 0.3);
|
|
325
|
+
}
|
|
326
|
+
|
|
327
|
+
.btn-primary {
|
|
328
|
+
background: var(--gradient-main);
|
|
329
|
+
color: #090d16;
|
|
330
|
+
border-color: transparent;
|
|
331
|
+
font-weight: 700;
|
|
332
|
+
}
|
|
333
|
+
|
|
334
|
+
.btn-primary:hover {
|
|
335
|
+
background: linear-gradient(135deg, #2bf1ff, #d64eff);
|
|
336
|
+
box-shadow: 0 0 15px rgba(var(--color-cyan-rgb), 0.3);
|
|
337
|
+
}
|
|
338
|
+
|
|
339
|
+
.status-panel {
|
|
340
|
+
padding: 1rem;
|
|
341
|
+
border-radius: 8px;
|
|
342
|
+
margin-top: 1rem;
|
|
343
|
+
font-size: 0.9rem;
|
|
344
|
+
display: flex;
|
|
345
|
+
align-items: flex-start;
|
|
346
|
+
gap: 0.75rem;
|
|
347
|
+
}
|
|
348
|
+
|
|
349
|
+
.status-panel.success {
|
|
350
|
+
background: rgba(16, 185, 129, 0.1);
|
|
351
|
+
border: 1px solid rgba(16, 185, 129, 0.2);
|
|
352
|
+
color: #34d399;
|
|
353
|
+
}
|
|
354
|
+
|
|
355
|
+
.status-panel.error {
|
|
356
|
+
background: rgba(239, 68, 68, 0.1);
|
|
357
|
+
border: 1px solid rgba(239, 68, 68, 0.2);
|
|
358
|
+
color: #fca5a5;
|
|
359
|
+
}
|
|
360
|
+
|
|
361
|
+
.status-panel.warning {
|
|
362
|
+
background: rgba(245, 158, 11, 0.1);
|
|
363
|
+
border: 1px solid rgba(245, 158, 11, 0.2);
|
|
364
|
+
color: #fcd34d;
|
|
365
|
+
}
|
|
366
|
+
|
|
367
|
+
.flowchart-container {
|
|
368
|
+
background: #05080e;
|
|
369
|
+
border: 1px solid var(--border-card);
|
|
370
|
+
border-radius: 12px;
|
|
371
|
+
padding: 1.5rem;
|
|
372
|
+
overflow: auto;
|
|
373
|
+
display: flex;
|
|
374
|
+
justify-content: center;
|
|
375
|
+
}
|
|
376
|
+
|
|
377
|
+
.console-box {
|
|
378
|
+
background: #020408;
|
|
379
|
+
border: 1px solid var(--border-card);
|
|
380
|
+
border-radius: 8px;
|
|
381
|
+
padding: 1rem;
|
|
382
|
+
font-family: var(--font-mono);
|
|
383
|
+
font-size: 0.85rem;
|
|
384
|
+
color: #a7f3d0;
|
|
385
|
+
white-space: pre-wrap;
|
|
386
|
+
max-height: 300px;
|
|
387
|
+
overflow-y: auto;
|
|
388
|
+
}
|
|
389
|
+
|
|
390
|
+
/* Checklist */
|
|
391
|
+
.checklist {
|
|
392
|
+
display: flex;
|
|
393
|
+
flex-direction: column;
|
|
394
|
+
gap: 0.75rem;
|
|
395
|
+
}
|
|
396
|
+
|
|
397
|
+
.checklist-item {
|
|
398
|
+
display: flex;
|
|
399
|
+
align-items: flex-start;
|
|
400
|
+
gap: 0.75rem;
|
|
401
|
+
padding: 0.5rem;
|
|
402
|
+
border-radius: 6px;
|
|
403
|
+
background: rgba(255,255,255,0.01);
|
|
404
|
+
border: 1px solid transparent;
|
|
405
|
+
transition: all 0.2s ease;
|
|
406
|
+
}
|
|
407
|
+
|
|
408
|
+
.checklist-item.done {
|
|
409
|
+
background: rgba(16, 185, 129, 0.03);
|
|
410
|
+
border-color: rgba(16, 185, 129, 0.1);
|
|
411
|
+
}
|
|
412
|
+
|
|
413
|
+
.checklist-item input[type="checkbox"] {
|
|
414
|
+
margin-top: 0.3rem;
|
|
415
|
+
cursor: pointer;
|
|
416
|
+
}
|
|
417
|
+
|
|
418
|
+
.checklist-item-text {
|
|
419
|
+
flex-grow: 1;
|
|
420
|
+
}
|
|
421
|
+
|
|
422
|
+
.checklist-title {
|
|
423
|
+
font-weight: 600;
|
|
424
|
+
color: #fff;
|
|
425
|
+
font-size: 0.95rem;
|
|
426
|
+
}
|
|
427
|
+
|
|
428
|
+
.checklist-desc {
|
|
429
|
+
font-size: 0.85rem;
|
|
430
|
+
color: var(--text-muted);
|
|
431
|
+
}
|
|
432
|
+
</style>
|
|
433
|
+
</head>
|
|
434
|
+
<body>
|
|
435
|
+
<div class="container">
|
|
436
|
+
<header>
|
|
437
|
+
<div class="header-left">
|
|
438
|
+
<div class="header-logo">
|
|
439
|
+
<svg viewBox="0 0 64 64" width="48" height="48" role="img" aria-label="Clio Coder logo"><title>Clio Coder logo</title><rect x="8" y="8" width="48" height="48" rx="12" fill="rgba(0,240,255,0.12)" stroke="rgba(0,240,255,0.65)"/><path d="M32 14 16 23l16 9 16-9-16-9Z" fill="none" stroke="#00f0ff" stroke-width="3" stroke-linejoin="round"/><path d="M16 32l16 9 16-9M16 41l16 9 16-9" fill="none" stroke="#bd00ff" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"/></svg>
|
|
440
|
+
</div>
|
|
441
|
+
<div class="header-title-wrapper">
|
|
442
|
+
<h1>Documentation Alignment Portal</h1>
|
|
443
|
+
<p>Interactive Visual Specification for Source-First Guidelines and Claim Linting</p>
|
|
444
|
+
<div class="meta-chips-row">
|
|
445
|
+
<span class="chip">Source: docs/documentation-guide.md</span>
|
|
446
|
+
<span class="chip chip-orange">clio-coder docs documentation</span>
|
|
447
|
+
</div>
|
|
448
|
+
</div>
|
|
449
|
+
</div>
|
|
450
|
+
<div class="header-right">
|
|
451
|
+
<span class="version-badge">Clio Coder v0.3.0</span>
|
|
452
|
+
<a href="index.html" class="back-btn">
|
|
453
|
+
<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>
|
|
454
|
+
Dashboard Hub
|
|
455
|
+
</a>
|
|
456
|
+
</div>
|
|
457
|
+
</header>
|
|
458
|
+
|
|
459
|
+
<div class="tabs-nav" style="justify-content: center; margin-bottom: 2rem;">
|
|
460
|
+
<button type="button" class="tab-btn active" onclick="_switchTab('linter')">
|
|
461
|
+
Markdown Link Linter
|
|
462
|
+
</button>
|
|
463
|
+
<button type="button" class="tab-btn" onclick="_switchTab('phrasing')">
|
|
464
|
+
Claim Class Checker
|
|
465
|
+
</button>
|
|
466
|
+
<button type="button" class="tab-btn" onclick="_switchTab('tracker')">
|
|
467
|
+
Update Checklist
|
|
468
|
+
</button>
|
|
469
|
+
<button type="button" class="tab-btn" onclick="_switchTab('flowchart')">
|
|
470
|
+
Doc Lifecycle Flow
|
|
471
|
+
</button>
|
|
472
|
+
</div>
|
|
473
|
+
|
|
474
|
+
|
|
475
|
+
<!-- Tab 1: Markdown Link Linter -->
|
|
476
|
+
<div id="linter" class="tab-pane active">
|
|
477
|
+
<div class="grid-2">
|
|
478
|
+
<div class="glass-card">
|
|
479
|
+
<div class="card-title">
|
|
480
|
+
<svg aria-hidden="true" viewBox="0 0 24 24"><title>Icon</title><path d="M11 5H6a2 2 0 00-2 2v11a2 2 0 002 2h11a2 2 0 002-2v-5m-1.414-9.414a2 2 0 112.828 2.828L11.828 15H9v-2.828l8.586-8.586z"/></svg>
|
|
481
|
+
Markdown Block Editor
|
|
482
|
+
</div>
|
|
483
|
+
<div class="form-group">
|
|
484
|
+
<label>Raw Markdown Content</label>
|
|
485
|
+
<textarea id="raw-markdown" class="code-area" oninput="lintMarkdown()"></textarea>
|
|
486
|
+
</div>
|
|
487
|
+
<div style="display: flex; gap: 0.5rem;">
|
|
488
|
+
<button type="button" class="btn btn-primary" onclick="loadSampleMd('valid')">Load Compliant Sample</button>
|
|
489
|
+
<button type="button" class="btn" onclick="loadSampleMd('invalid')">Load Broken Links Sample</button>
|
|
490
|
+
</div>
|
|
491
|
+
</div>
|
|
492
|
+
|
|
493
|
+
<div class="glass-card">
|
|
494
|
+
<div class="card-title">
|
|
495
|
+
<svg aria-hidden="true" viewBox="0 0 24 24"><title>Icon</title><path d="M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-6 9l2 2 4-4"/></svg>
|
|
496
|
+
Documentation Linter Receipt
|
|
497
|
+
</div>
|
|
498
|
+
<div id="linter-status" class="status-panel success">
|
|
499
|
+
No lint errors. Ready to audit.
|
|
500
|
+
</div>
|
|
501
|
+
<div style="margin-top: 1.5rem;">
|
|
502
|
+
<h4 style="margin-bottom: 0.5rem; font-size: 0.95rem; color: #ffffff;">Detected Documentation metrics:</h4>
|
|
503
|
+
<div id="linter-metrics" style="display: flex; flex-direction: column; gap: 0.5rem;">
|
|
504
|
+
<!-- Dynamic metrics badges -->
|
|
505
|
+
</div>
|
|
506
|
+
</div>
|
|
507
|
+
</div>
|
|
508
|
+
</div>
|
|
509
|
+
</div>
|
|
510
|
+
|
|
511
|
+
<!-- Tab 2: Claim Class Checker -->
|
|
512
|
+
<div id="phrasing" class="tab-pane">
|
|
513
|
+
<div class="grid-2">
|
|
514
|
+
<div class="glass-card">
|
|
515
|
+
<div class="card-title">
|
|
516
|
+
<svg aria-hidden="true" viewBox="0 0 24 24"><title>Icon</title><path d="M12 6V4m0 2a2 2 0 100 4m0-4a2 2 0 110 4m-6 8a2 2 0 100-4m0 4a2 2 0 110-4m0 4v2m0-6V4m6 6v10m6-2a2 2 0 100-4m0 4a2 2 0 110-4m0 4v2m0-6V4"/></svg>
|
|
517
|
+
Assert codebase features & capabilities
|
|
518
|
+
</div>
|
|
519
|
+
|
|
520
|
+
<div class="form-group">
|
|
521
|
+
<label>Feature/Claim Class</label>
|
|
522
|
+
<select id="claim-class" onchange="checkPhrasing()">
|
|
523
|
+
<option value="experimental">Implemented but experimental (Alpha)</option>
|
|
524
|
+
<option value="shipped">Shipped and fully tested (Stable)</option>
|
|
525
|
+
<option value="inert">Typed contract exists but inert (In-progress)</option>
|
|
526
|
+
<option value="planned">Planned / future roadmap</option>
|
|
527
|
+
</select>
|
|
528
|
+
</div>
|
|
529
|
+
|
|
530
|
+
<div class="form-group">
|
|
531
|
+
<label>Draft claim paragraph</label>
|
|
532
|
+
<textarea id="claim-text" style="min-height: 120px;" oninput="checkPhrasing()">Clio automatically validates all local cluster runs, providing stable npm package execution and universal local-model compatibility.</textarea>
|
|
533
|
+
</div>
|
|
534
|
+
</div>
|
|
535
|
+
|
|
536
|
+
<div class="glass-card">
|
|
537
|
+
<div class="card-title">
|
|
538
|
+
<svg aria-hidden="true" viewBox="0 0 24 24"><title>Icon</title><path d="M9 19v-6a2 2 0 00-2-2H5a2 2 0 00-2 2v6a2 2 0 002 2h2a2 2 0 002-2zm0 0V9a2 2 0 012-2h2a2 2 0 012 2v10m-6 0a2 2 0 002 2h2a2 2 0 002-2m0 0V5a2 2 0 012-2h2a2 2 0 012 2v14a2 2 0 002 2h2a2 2 0 002-2"/></svg>
|
|
539
|
+
Alignment Check Verdict
|
|
540
|
+
</div>
|
|
541
|
+
|
|
542
|
+
<div id="phrasing-banner" class="status-panel success">
|
|
543
|
+
Phrasing passes rules!
|
|
544
|
+
</div>
|
|
545
|
+
|
|
546
|
+
<div style="margin-top: 1.5rem;">
|
|
547
|
+
<h4 style="margin-bottom:0.5rem; font-size:0.95rem; color:#fff;">Analysis details:</h4>
|
|
548
|
+
<div class="console-box" id="phrasing-log">
|
|
549
|
+
<!-- Logs -->
|
|
550
|
+
</div>
|
|
551
|
+
</div>
|
|
552
|
+
</div>
|
|
553
|
+
</div>
|
|
554
|
+
</div>
|
|
555
|
+
|
|
556
|
+
<!-- Tab 3: Update Checklist -->
|
|
557
|
+
<div id="tracker" class="tab-pane">
|
|
558
|
+
<div class="glass-card">
|
|
559
|
+
<div class="card-title">
|
|
560
|
+
<svg aria-hidden="true" viewBox="0 0 24 24"><title>Icon</title><path d="M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-6 9l2 2 4-4"/></svg>
|
|
561
|
+
PR Documentation Update Checklist
|
|
562
|
+
</div>
|
|
563
|
+
|
|
564
|
+
<div class="checklist">
|
|
565
|
+
<div class="checklist-item" id="item-1">
|
|
566
|
+
<input type="checkbox" onchange="_toggleCheckItem(1)">
|
|
567
|
+
<div class="checklist-item-text">
|
|
568
|
+
<p class="checklist-title">1. Identify Source Owner</p>
|
|
569
|
+
<p class="checklist-desc">Trace the TS files backing the behavior under <code style="font-family:var(--font-mono)">src/cli/</code>, <code style="font-family:var(--font-mono)">src/interactive/</code>, or specific domain scopes.</p>
|
|
570
|
+
</div>
|
|
571
|
+
</div>
|
|
572
|
+
|
|
573
|
+
<div class="checklist-item" id="item-2">
|
|
574
|
+
<input type="checkbox" onchange="_toggleCheckItem(2)">
|
|
575
|
+
<div class="checklist-item-text">
|
|
576
|
+
<p class="checklist-title">2. Check Public CLI Help Changes</p>
|
|
577
|
+
<p class="checklist-desc">Verify that all command lines and args mentioned in docs match output from <code style="font-family:var(--font-mono)">node dist/cli/index.js --help</code>.</p>
|
|
578
|
+
</div>
|
|
579
|
+
</div>
|
|
580
|
+
|
|
581
|
+
<div class="checklist-item" id="item-3">
|
|
582
|
+
<input type="checkbox" onchange="_toggleCheckItem(3)">
|
|
583
|
+
<div class="checklist-item-text">
|
|
584
|
+
<p class="checklist-title">3. Update the Mapped Guide</p>
|
|
585
|
+
<p class="checklist-desc">Edit the corresponding <code style="font-family:var(--font-mono)">docs/*.md</code> file in the same PR containing code improvements.</p>
|
|
586
|
+
</div>
|
|
587
|
+
</div>
|
|
588
|
+
|
|
589
|
+
<div class="checklist-item" id="item-4">
|
|
590
|
+
<input type="checkbox" onchange="_toggleCheckItem(4)">
|
|
591
|
+
<div class="checklist-item-text">
|
|
592
|
+
<p class="checklist-title">4. Propagate Core System Changes to README</p>
|
|
593
|
+
<p class="checklist-desc">If modifications affect safety bounds, session ceilings, credentials, or dispatch worker routing, keep user-facing README.md in sync.</p>
|
|
594
|
+
</div>
|
|
595
|
+
</div>
|
|
596
|
+
|
|
597
|
+
<div class="checklist-item" id="item-5">
|
|
598
|
+
<input type="checkbox" onchange="_toggleCheckItem(5)">
|
|
599
|
+
<div class="checklist-item-text">
|
|
600
|
+
<p class="checklist-title">5. Execute Python Link Check Script</p>
|
|
601
|
+
<p class="checklist-desc">Execute the local Python script to verify relative links across all files prior to pushing commits: <code style="font-family:var(--font-mono)">python3 tools/check_links.py</code>.</p>
|
|
602
|
+
</div>
|
|
603
|
+
</div>
|
|
604
|
+
</div>
|
|
605
|
+
</div>
|
|
606
|
+
</div>
|
|
607
|
+
|
|
608
|
+
<!-- Tab 4: Doc Lifecycle Flow -->
|
|
609
|
+
<div id="flowchart" class="tab-pane">
|
|
610
|
+
<div class="glass-card">
|
|
611
|
+
<div class="card-title">
|
|
612
|
+
<svg aria-hidden="true" viewBox="0 0 24 24"><title>Icon</title><path d="M13 10V3L4 14h7v7l9-11h-7z"/></svg>
|
|
613
|
+
Source-First Documentation Alignment Flow
|
|
614
|
+
</div>
|
|
615
|
+
<div class="flowchart-container">
|
|
616
|
+
<svg aria-hidden="true" width="850" height="420" viewBox="0 0 850 420" style="background:#020408; border-radius:10px;"><title>Icon</title>
|
|
617
|
+
<defs>
|
|
618
|
+
<marker id="arrow" viewBox="0 0 10 10" refX="5" refY="5" markerWidth="6" markerHeight="6" orient="auto-start-reverse">
|
|
619
|
+
<path d="M 0 0 L 10 5 L 0 10 z" fill="#00f0ff" />
|
|
620
|
+
</marker>
|
|
621
|
+
<filter id="glow-cyan" x="-20%" y="-20%" width="140%" height="140%">
|
|
622
|
+
<feGaussianBlur stdDeviation="4" result="blur" />
|
|
623
|
+
<feComposite in="SourceGraphic" in2="blur" operator="over" />
|
|
624
|
+
</filter>
|
|
625
|
+
</defs>
|
|
626
|
+
|
|
627
|
+
<!-- Grid background -->
|
|
628
|
+
<path d="M 0 0 L 850 0 M 0 40 L 850 40 M 0 80 L 850 80 M 0 120 L 850 120 M 0 160 L 850 160 M 0 200 L 850 200 M 0 240 L 850 240 M 0 280 L 850 280 M 0 320 L 850 320 M 0 360 L 850 360 M 0 400 L 850 400" stroke="rgba(255,255,255,0.02)" stroke-width="1" />
|
|
629
|
+
<path d="M 0 0 L 0 420 M 50 0 L 50 420 M 100 0 L 100 420 M 150 0 L 150 420 M 200 0 L 200 420 M 250 0 L 250 420 M 300 0 L 300 420 M 350 0 L 350 420 M 400 0 L 400 420 M 450 0 L 450 420 M 500 0 L 500 420 M 550 0 L 550 420 M 600 0 L 600 420 M 650 0 L 650 420 M 700 0 L 700 420 M 750 0 L 750 420 M 800 0 L 800 420" stroke="rgba(255,255,255,0.02)" stroke-width="1" />
|
|
630
|
+
|
|
631
|
+
<!-- STEP 1: AUDIT -->
|
|
632
|
+
<g transform="translate(10, 40)">
|
|
633
|
+
<rect x="10" y="20" width="160" height="280" rx="8" fill="rgba(255,255,255,0.01)" stroke="rgba(255,255,255,0.05)" />
|
|
634
|
+
<text x="90" y="45" fill="var(--text-dark)" font-size="11" font-weight="700" text-anchor="middle" letter-spacing="1">1. SOURCE AUDIT</text>
|
|
635
|
+
|
|
636
|
+
<rect x="25" y="80" width="130" height="60" rx="6" fill="#111827" stroke="rgba(255,255,255,0.1)" />
|
|
637
|
+
<text x="90" y="105" fill="#fff" font-size="11" font-weight="600" text-anchor="middle">Code & tests</text>
|
|
638
|
+
<text x="90" y="123" fill="var(--text-muted)" font-size="9" text-anchor="middle">Audits actual behavior</text>
|
|
639
|
+
|
|
640
|
+
<rect x="25" y="180" width="130" height="60" rx="6" fill="#111827" stroke="rgba(255,255,255,0.1)" />
|
|
641
|
+
<text x="90" y="205" fill="#fff" font-size="11" font-weight="600" text-anchor="middle">Git Logs</text>
|
|
642
|
+
<text x="90" y="223" fill="var(--text-muted)" font-size="9" text-anchor="middle">Verify release history</text>
|
|
643
|
+
</g>
|
|
644
|
+
|
|
645
|
+
<!-- STEP 2: ALIGN & LINT -->
|
|
646
|
+
<g transform="translate(200, 40)">
|
|
647
|
+
<rect x="10" y="20" width="200" height="280" rx="8" fill="rgba(0, 240, 255, 0.03)" stroke="var(--color-cyan)" stroke-width="1.5" filter="url(#glow-cyan)" />
|
|
648
|
+
<text x="110" y="45" fill="var(--color-cyan)" font-size="12" font-weight="700" text-anchor="middle" letter-spacing="1">2. CLAIM LINTING</text>
|
|
649
|
+
|
|
650
|
+
<!-- Phrasing -->
|
|
651
|
+
<rect x="25" y="80" width="170" height="50" rx="6" fill="#111827" stroke="rgba(255,255,255,0.1)" />
|
|
652
|
+
<text x="110" y="105" fill="#fff" font-size="11" text-anchor="middle">Verify Vocabulary</text>
|
|
653
|
+
<text x="110" y="120" fill="var(--text-muted)" font-size="9" text-anchor="middle">Alpha phrasing guidelines</text>
|
|
654
|
+
|
|
655
|
+
<!-- Links -->
|
|
656
|
+
<rect x="25" y="170" width="170" height="60" rx="6" fill="#111827" stroke="rgba(255,255,255,0.1)" />
|
|
657
|
+
<text x="110" y="195" fill="#fff" font-size="11" text-anchor="middle">Link integrity</text>
|
|
658
|
+
<text x="110" y="213" fill="var(--text-muted)" font-size="9" text-anchor="middle">Relative paths checker</text>
|
|
659
|
+
</g>
|
|
660
|
+
|
|
661
|
+
<!-- STEP 3: RENDER -->
|
|
662
|
+
<g transform="translate(430, 40)">
|
|
663
|
+
<rect x="10" y="20" width="180" height="280" rx="8" fill="rgba(255,255,255,0.01)" stroke="rgba(255,255,255,0.05)" />
|
|
664
|
+
<text x="100" y="45" fill="var(--text-dark)" font-size="11" font-weight="700" text-anchor="middle" letter-spacing="1">3. DISTRIBUTION</text>
|
|
665
|
+
|
|
666
|
+
<rect x="25" y="80" width="150" height="50" rx="6" fill="rgba(16, 185, 129, 0.05)" stroke="var(--color-emerald)" stroke-width="1" />
|
|
667
|
+
<text x="100" y="105" fill="var(--color-emerald)" font-size="11" font-weight="700" text-anchor="middle">Markdown Guides</text>
|
|
668
|
+
<text x="100" y="120" fill="var(--text-muted)" font-size="9" text-anchor="middle">Linked specs in Tip Boxes</text>
|
|
669
|
+
|
|
670
|
+
<rect x="25" y="170" width="150" height="50" rx="6" fill="rgba(189, 0, 255, 0.05)" stroke="var(--color-purple)" stroke-width="1" />
|
|
671
|
+
<text x="100" y="195" fill="var(--color-purple)" font-size="11" font-weight="700" text-anchor="middle">Interactive Blueprints</text>
|
|
672
|
+
<text x="100" y="210" fill="var(--text-muted)" font-size="9" text-anchor="middle">HTML playground versions</text>
|
|
673
|
+
</g>
|
|
674
|
+
|
|
675
|
+
<!-- Connections -->
|
|
676
|
+
<path d="M 180 140 L 210 140" stroke="#00f0ff" stroke-width="1.5" marker-end="url(#arrow)" fill="none" />
|
|
677
|
+
<path d="M 410 140 L 440 140" stroke="#00f0ff" stroke-width="1.5" marker-end="url(#arrow)" fill="none" />
|
|
678
|
+
</svg>
|
|
679
|
+
</div>
|
|
680
|
+
</div>
|
|
681
|
+
</div>
|
|
682
|
+
</div>
|
|
683
|
+
|
|
684
|
+
<script>
|
|
685
|
+
function _switchTab(tabId) {
|
|
686
|
+
document.querySelectorAll('.tab-pane').forEach(el => { el.classList.remove('active'); });
|
|
687
|
+
document.querySelectorAll('.tab-btn').forEach(el => { el.classList.remove('active'); });
|
|
688
|
+
|
|
689
|
+
document.getElementById(tabId).classList.add('active');
|
|
690
|
+
event.currentTarget.classList.add('active');
|
|
691
|
+
}
|
|
692
|
+
|
|
693
|
+
const validSample = `## Setup validation
|
|
694
|
+
|
|
695
|
+
To begin, verify targets are loaded properly. Refer to [commands-and-modes.md](commands-and-modes.md#L10) for instructions.
|
|
696
|
+
|
|
697
|
+
> [!NOTE]
|
|
698
|
+
> Clio Coder is an experimental community alpha. Some local model behaviors can vary.`;
|
|
699
|
+
|
|
700
|
+
const invalidSample = `## Core setup
|
|
701
|
+
|
|
702
|
+
For active setups, inspect [\`registry.ts\`](file:///workspace/clio-coder/src/tools/registry.ts). # Error: absolute file URI, backticks inside link text
|
|
703
|
+
|
|
704
|
+
> [!TIP]
|
|
705
|
+
> This is a fully automatic production-grade stable upgrade engine. # Error: overstating alpha maturity`;
|
|
706
|
+
|
|
707
|
+
function loadSampleMd(type) {
|
|
708
|
+
if (type === 'valid') {
|
|
709
|
+
document.getElementById('raw-markdown').value = validSample;
|
|
710
|
+
} else {
|
|
711
|
+
document.getElementById('raw-markdown').value = invalidSample;
|
|
712
|
+
}
|
|
713
|
+
lintMarkdown();
|
|
714
|
+
}
|
|
715
|
+
|
|
716
|
+
function lintMarkdown() {
|
|
717
|
+
const text = document.getElementById('raw-markdown').value;
|
|
718
|
+
const statusPanel = document.getElementById('linter-status');
|
|
719
|
+
const metricsList = document.getElementById('linter-metrics');
|
|
720
|
+
metricsList.innerHTML = '';
|
|
721
|
+
|
|
722
|
+
if (!text.trim()) {
|
|
723
|
+
statusPanel.className = 'status-panel warning';
|
|
724
|
+
statusPanel.textContent = 'Markdown is empty. Write or load a sample.';
|
|
725
|
+
return;
|
|
726
|
+
}
|
|
727
|
+
|
|
728
|
+
const errors = [];
|
|
729
|
+
let absoluteLinksCount = 0;
|
|
730
|
+
let backtickLinksCount = 0;
|
|
731
|
+
let alertsCount = 0;
|
|
732
|
+
|
|
733
|
+
// Simple link parser
|
|
734
|
+
const linkRegex = /\[([^\]]+)\]\(([^)]+)\)/g;
|
|
735
|
+
let match = linkRegex.exec(text);
|
|
736
|
+
while (match !== null) {
|
|
737
|
+
const linkText = match[1];
|
|
738
|
+
const linkTarget = match[2];
|
|
739
|
+
|
|
740
|
+
if (linkTarget.startsWith("file://")) {
|
|
741
|
+
errors.push(`Absolute link path detected: "${linkTarget}". Use repository-relative paths.`);
|
|
742
|
+
absoluteLinksCount++;
|
|
743
|
+
}
|
|
744
|
+
if (linkText.startsWith("`") && linkText.endsWith("`")) {
|
|
745
|
+
errors.push(`Do not wrap link text in backticks: "[\`${linkText.slice(1, -1)}\`]...". Place backticks outside the link: \`[text](link)\`.`);
|
|
746
|
+
backtickLinksCount++;
|
|
747
|
+
}
|
|
748
|
+
match = linkRegex.exec(text);
|
|
749
|
+
}
|
|
750
|
+
|
|
751
|
+
// Alert matches
|
|
752
|
+
if (text.includes('> [!NOTE]') || text.includes('> [!WARNING]') || text.includes('> [!CAUTION]') || text.includes('> [!TIP]')) {
|
|
753
|
+
alertsCount++;
|
|
754
|
+
}
|
|
755
|
+
|
|
756
|
+
if (errors.length > 0) {
|
|
757
|
+
statusPanel.className = 'status-panel error';
|
|
758
|
+
statusPanel.innerHTML = `<strong>Markdown Alignment Failures:</strong><ul style="margin-left: 1.5rem; margin-top:0.5rem;">${errors.map(e => `<li>${e}</li>`).join('')}</ul>`;
|
|
759
|
+
} else {
|
|
760
|
+
statusPanel.className = 'status-panel success';
|
|
761
|
+
statusPanel.innerHTML = `<strong>Success:</strong> Markdown alignment conforms to all codebase guidelines and checks out.`;
|
|
762
|
+
|
|
763
|
+
addMetricBadge('Absolute Links', absoluteLinksCount, 'purple');
|
|
764
|
+
addMetricBadge('Format Errors', backtickLinksCount, 'rose');
|
|
765
|
+
addMetricBadge('GitHub Alerts', alertsCount ? 'Yes' : 'None', 'emerald');
|
|
766
|
+
}
|
|
767
|
+
}
|
|
768
|
+
|
|
769
|
+
function addMetricBadge(label, val, color) {
|
|
770
|
+
const container = document.getElementById('linter-metrics');
|
|
771
|
+
const item = document.createElement('div');
|
|
772
|
+
item.className = 'meta-badge';
|
|
773
|
+
item.style.borderLeft = `3px solid var(--color-${color})`;
|
|
774
|
+
item.innerHTML = `<span class="label">${label}:</span> <span class="value" style="color:var(--color-${color})">${val}</span>`;
|
|
775
|
+
container.appendChild(item);
|
|
776
|
+
}
|
|
777
|
+
|
|
778
|
+
// Phrasing checker
|
|
779
|
+
function checkPhrasing() {
|
|
780
|
+
const text = document.getElementById('claim-text').value;
|
|
781
|
+
const claimClass = document.getElementById('claim-class').value;
|
|
782
|
+
|
|
783
|
+
const logs = [];
|
|
784
|
+
let hasError = false;
|
|
785
|
+
|
|
786
|
+
logs.push(`[info] Analyzing claim class alignment for: "${claimClass}"`);
|
|
787
|
+
|
|
788
|
+
const forbiddenMaturity = ['stable', 'production-grade', 'guaranteed', 'fully automatic', 'npm registry', 'universal'];
|
|
789
|
+
|
|
790
|
+
forbiddenMaturity.forEach(word => {
|
|
791
|
+
if (text.toLowerCase().includes(word)) {
|
|
792
|
+
if (claimClass === 'experimental' || claimClass === 'inert' || claimClass === 'planned') {
|
|
793
|
+
logs.push(`[warning] Overstating maturity: found forbidden word "${word}" in draft claim.`);
|
|
794
|
+
hasError = true;
|
|
795
|
+
}
|
|
796
|
+
}
|
|
797
|
+
});
|
|
798
|
+
|
|
799
|
+
if (hasError) {
|
|
800
|
+
document.getElementById('phrasing-banner').className = 'status-panel error';
|
|
801
|
+
document.getElementById('phrasing-banner').innerHTML = `<strong>Status: PHRASING MISALIGNMENT</strong>. Vocabulary overstates code maturity.`;
|
|
802
|
+
logs.push(`\n[suggestion] Refactor text to use conservative wording:`);
|
|
803
|
+
logs.push(`- "experimental community alpha"`);
|
|
804
|
+
logs.push(`- "source-build execution path"`);
|
|
805
|
+
logs.push(`- "advisory scientific validation contracts"`);
|
|
806
|
+
} else {
|
|
807
|
+
document.getElementById('phrasing-banner').className = 'status-panel success';
|
|
808
|
+
document.getElementById('phrasing-banner').innerHTML = `<strong>Status: ALIGNED</strong>. Wording is conservative and source-aligned.`;
|
|
809
|
+
logs.push(`\n[success] Verification passed. Claim matches source maturity level.`);
|
|
810
|
+
}
|
|
811
|
+
|
|
812
|
+
document.getElementById('phrasing-log').textContent = logs.join('\n');
|
|
813
|
+
}
|
|
814
|
+
|
|
815
|
+
// Checklist
|
|
816
|
+
function _toggleCheckItem(id) {
|
|
817
|
+
const item = document.getElementById(`item-${id}`);
|
|
818
|
+
const checkbox = item.querySelector('input[type="checkbox"]');
|
|
819
|
+
if (checkbox.checked) {
|
|
820
|
+
item.classList.add('done');
|
|
821
|
+
} else {
|
|
822
|
+
item.classList.remove('done');
|
|
823
|
+
}
|
|
824
|
+
}
|
|
825
|
+
|
|
826
|
+
window.onload = () => {
|
|
827
|
+
loadSampleMd('valid');
|
|
828
|
+
checkPhrasing();
|
|
829
|
+
}
|
|
830
|
+
</script>
|
|
831
|
+
</body>
|
|
832
|
+
</html>
|