arggon-harness 0.1.2 → 0.2.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/README.md +45 -39
- package/dist/init.d.ts +26 -1
- package/dist/init.d.ts.map +1 -1
- package/dist/init.js +98 -4
- package/dist/init.js.map +1 -1
- package/dist/plugin/engine/types.d.ts +1 -0
- package/dist/plugin/engine/types.d.ts.map +1 -1
- package/dist/plugin/tools/spec-artifact-instr.d.ts +10 -0
- package/dist/plugin/tools/spec-artifact-instr.d.ts.map +1 -1
- package/dist/plugin/tools/spec-artifact-instr.js +40 -1
- package/dist/plugin/tools/spec-artifact-instr.js.map +1 -1
- package/dist/plugin/tools/util.d.ts.map +1 -1
- package/dist/plugin/tools/util.js +2 -0
- package/dist/plugin/tools/util.js.map +1 -1
- package/package.json +1 -1
- package/src/schemas/ui-driven.yaml +1 -0
- package/src/templates/hybrid/schema.yaml +32 -0
- package/src/templates/hybrid/tasks.yaml +103 -0
- package/src/templates/spec-driven/design-tech.yaml +42 -0
- package/src/templates/spec-driven/proposal.yaml +43 -0
- package/src/templates/spec-driven/schema.yaml +32 -0
- package/src/templates/spec-driven/spec.yaml +56 -0
- package/src/templates/tdd/design-tech.yaml +42 -0
- package/src/templates/tdd/proposal.yaml +43 -0
- package/src/templates/tdd/schema.yaml +32 -0
- package/src/templates/tdd/spec.yaml +56 -0
- package/src/templates/tdd/tasks.yaml +77 -0
- package/src/templates/ui-driven/design-html.html +224 -0
- package/src/templates/ui-driven/schema.yaml +33 -0
- /package/src/templates/{design-tech.yaml → hybrid/design-tech.yaml} +0 -0
- /package/src/templates/{proposal.yaml → hybrid/proposal.yaml} +0 -0
- /package/src/templates/{spec.yaml → hybrid/spec.yaml} +0 -0
- /package/src/templates/{tasks.yaml → spec-driven/tasks.yaml} +0 -0
- /package/src/templates/{design-hifi.yaml → ui-driven/design-hifi.yaml} +0 -0
- /package/src/templates/{design-wireframe.yaml → ui-driven/design-wireframe.yaml} +0 -0
|
@@ -0,0 +1,224 @@
|
|
|
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><!-- DESIGN: page-title --></title>
|
|
7
|
+
|
|
8
|
+
<!--
|
|
9
|
+
============================================================
|
|
10
|
+
DESIGN: palette
|
|
11
|
+
Inject design-specific CSS variables here.
|
|
12
|
+
Expected variables:
|
|
13
|
+
--color-primary, --color-secondary, --color-accent,
|
|
14
|
+
--color-background, --color-foreground, --color-surface,
|
|
15
|
+
--color-border, --color-muted, --color-success,
|
|
16
|
+
--color-warning, --color-error, --color-info
|
|
17
|
+
============================================================
|
|
18
|
+
-->
|
|
19
|
+
<style>
|
|
20
|
+
:root {
|
|
21
|
+
/* ── Override with design-palette values ── */
|
|
22
|
+
--color-primary: #3B82F6;
|
|
23
|
+
--color-primary-hover: #2563EB;
|
|
24
|
+
--color-secondary: #8B5CF6;
|
|
25
|
+
--color-accent: #F59E0B;
|
|
26
|
+
--color-background: #F9FAFB;
|
|
27
|
+
--color-foreground: #111827;
|
|
28
|
+
--color-surface: #FFFFFF;
|
|
29
|
+
--color-border: #E5E7EB;
|
|
30
|
+
--color-muted: #F3F4F6;
|
|
31
|
+
--color-success: #10B981;
|
|
32
|
+
--color-warning: #F59E0B;
|
|
33
|
+
--color-error: #EF4444;
|
|
34
|
+
--color-info: #3B82F6;
|
|
35
|
+
}
|
|
36
|
+
|
|
37
|
+
/* ── Base reset ── */
|
|
38
|
+
*, *::before, *::after {
|
|
39
|
+
box-sizing: border-box;
|
|
40
|
+
margin: 0;
|
|
41
|
+
padding: 0;
|
|
42
|
+
}
|
|
43
|
+
|
|
44
|
+
body {
|
|
45
|
+
font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
|
|
46
|
+
font-size: 16px;
|
|
47
|
+
line-height: 1.6;
|
|
48
|
+
color: var(--color-foreground);
|
|
49
|
+
background: var(--color-background);
|
|
50
|
+
-webkit-font-smoothing: antialiased;
|
|
51
|
+
}
|
|
52
|
+
</style>
|
|
53
|
+
|
|
54
|
+
<!--
|
|
55
|
+
============================================================
|
|
56
|
+
DESIGN: typography
|
|
57
|
+
Inject font-face imports, custom font families, and type
|
|
58
|
+
scale overrides here.
|
|
59
|
+
============================================================
|
|
60
|
+
-->
|
|
61
|
+
<style>
|
|
62
|
+
/* ── Type scale (replace with design-typography values) ── */
|
|
63
|
+
h1 { font-size: 2.5rem; font-weight: 700; line-height: 1.2; letter-spacing: -0.025em; }
|
|
64
|
+
h2 { font-size: 2rem; font-weight: 700; line-height: 1.25; letter-spacing: -0.02em; }
|
|
65
|
+
h3 { font-size: 1.5rem; font-weight: 600; line-height: 1.3; letter-spacing: -0.015em; }
|
|
66
|
+
h4 { font-size: 1.25rem;font-weight: 600; line-height: 1.35; letter-spacing: -0.01em; }
|
|
67
|
+
h5 { font-size: 1.125rem;font-weight: 600;line-height: 1.4; letter-spacing: 0em; }
|
|
68
|
+
h6 { font-size: 1rem; font-weight: 600; line-height: 1.45; letter-spacing: 0em; }
|
|
69
|
+
p { font-size: 1rem; font-weight: 400; line-height: 1.6; }
|
|
70
|
+
small { font-size: 0.875rem; font-weight: 400; line-height: 1.5; }
|
|
71
|
+
</style>
|
|
72
|
+
|
|
73
|
+
<!--
|
|
74
|
+
============================================================
|
|
75
|
+
DESIGN: layout
|
|
76
|
+
Inject grid, flex, and responsive layout rules here.
|
|
77
|
+
============================================================
|
|
78
|
+
-->
|
|
79
|
+
<style>
|
|
80
|
+
/* ── Layout containers (replace with design-layout values) ── */
|
|
81
|
+
.container {
|
|
82
|
+
width: 100%;
|
|
83
|
+
max-width: 1200px;
|
|
84
|
+
margin: 0 auto;
|
|
85
|
+
padding: 0 1.5rem;
|
|
86
|
+
}
|
|
87
|
+
|
|
88
|
+
.grid {
|
|
89
|
+
display: grid;
|
|
90
|
+
gap: 1.5rem;
|
|
91
|
+
}
|
|
92
|
+
|
|
93
|
+
.flex-row {
|
|
94
|
+
display: flex;
|
|
95
|
+
flex-wrap: wrap;
|
|
96
|
+
gap: 1rem;
|
|
97
|
+
}
|
|
98
|
+
|
|
99
|
+
.flex-col {
|
|
100
|
+
display: flex;
|
|
101
|
+
flex-direction: column;
|
|
102
|
+
gap: 1rem;
|
|
103
|
+
}
|
|
104
|
+
</style>
|
|
105
|
+
|
|
106
|
+
<!--
|
|
107
|
+
============================================================
|
|
108
|
+
DESIGN: components
|
|
109
|
+
Inject component-specific CSS (buttons, cards, inputs,
|
|
110
|
+
navigation, etc.) here.
|
|
111
|
+
============================================================
|
|
112
|
+
-->
|
|
113
|
+
<style>
|
|
114
|
+
/* ── Component styles (replace with design-component values) ── */
|
|
115
|
+
|
|
116
|
+
/* Buttons */
|
|
117
|
+
.btn {
|
|
118
|
+
display: inline-flex;
|
|
119
|
+
align-items: center;
|
|
120
|
+
justify-content: center;
|
|
121
|
+
padding: 0.5rem 1rem;
|
|
122
|
+
font-size: 0.875rem;
|
|
123
|
+
font-weight: 500;
|
|
124
|
+
border: none;
|
|
125
|
+
border-radius: 0.375rem;
|
|
126
|
+
cursor: pointer;
|
|
127
|
+
transition: all 150ms ease;
|
|
128
|
+
text-decoration: none;
|
|
129
|
+
}
|
|
130
|
+
.btn-primary {
|
|
131
|
+
background: var(--color-primary);
|
|
132
|
+
color: #fff;
|
|
133
|
+
}
|
|
134
|
+
.btn-primary:hover {
|
|
135
|
+
background: var(--color-primary-hover);
|
|
136
|
+
}
|
|
137
|
+
.btn-secondary {
|
|
138
|
+
background: var(--color-secondary);
|
|
139
|
+
color: #fff;
|
|
140
|
+
}
|
|
141
|
+
.btn-ghost {
|
|
142
|
+
background: transparent;
|
|
143
|
+
color: var(--color-foreground);
|
|
144
|
+
}
|
|
145
|
+
.btn-ghost:hover {
|
|
146
|
+
background: var(--color-muted);
|
|
147
|
+
}
|
|
148
|
+
|
|
149
|
+
/* Cards */
|
|
150
|
+
.card {
|
|
151
|
+
background: var(--color-surface);
|
|
152
|
+
border: 1px solid var(--color-border);
|
|
153
|
+
border-radius: 0.5rem;
|
|
154
|
+
padding: 1.5rem;
|
|
155
|
+
box-shadow: 0 1px 3px rgba(0,0,0,0.08);
|
|
156
|
+
}
|
|
157
|
+
|
|
158
|
+
/* Inputs */
|
|
159
|
+
.input {
|
|
160
|
+
width: 100%;
|
|
161
|
+
padding: 0.5rem 0.75rem;
|
|
162
|
+
font-size: 0.875rem;
|
|
163
|
+
border: 1px solid var(--color-border);
|
|
164
|
+
border-radius: 0.375rem;
|
|
165
|
+
background: var(--color-surface);
|
|
166
|
+
color: var(--color-foreground);
|
|
167
|
+
transition: border-color 150ms ease;
|
|
168
|
+
}
|
|
169
|
+
.input:focus {
|
|
170
|
+
border-color: var(--color-primary);
|
|
171
|
+
outline: none;
|
|
172
|
+
box-shadow: 0 0 0 3px color-mix(in srgb, var(--color-primary) 20%, transparent);
|
|
173
|
+
}
|
|
174
|
+
</style>
|
|
175
|
+
</head>
|
|
176
|
+
<body>
|
|
177
|
+
|
|
178
|
+
<!-- ════════════════════════════════════════════════════════════
|
|
179
|
+
HEADER
|
|
180
|
+
════════════════════════════════════════════════════════════ -->
|
|
181
|
+
<header class="container" style="padding-top: 1rem; padding-bottom: 1rem;">
|
|
182
|
+
<nav class="flex-row" style="align-items: center; justify-content: space-between;">
|
|
183
|
+
<!-- Logo / Brand -->
|
|
184
|
+
<div><!-- DESIGN: logo --></div>
|
|
185
|
+
<!-- Navigation links -->
|
|
186
|
+
<div><!-- DESIGN: nav-links --></div>
|
|
187
|
+
</nav>
|
|
188
|
+
</header>
|
|
189
|
+
|
|
190
|
+
<!-- ════════════════════════════════════════════════════════════
|
|
191
|
+
MAIN CONTENT
|
|
192
|
+
════════════════════════════════════════════════════════════ -->
|
|
193
|
+
<main>
|
|
194
|
+
<!-- ── Hero Section ── -->
|
|
195
|
+
<section id="hero" class="container" style="padding-top: 4rem; padding-bottom: 4rem;">
|
|
196
|
+
<!-- DESIGN: hero-content -->
|
|
197
|
+
</section>
|
|
198
|
+
|
|
199
|
+
<!-- ── Features / Grid Section ── -->
|
|
200
|
+
<section id="features" class="container" style="padding-top: 4rem; padding-bottom: 4rem;">
|
|
201
|
+
<div class="grid" style="grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));">
|
|
202
|
+
<!-- DESIGN: feature-card-1 -->
|
|
203
|
+
<!-- DESIGN: feature-card-2 -->
|
|
204
|
+
<!-- DESIGN: feature-card-3 -->
|
|
205
|
+
</div>
|
|
206
|
+
</section>
|
|
207
|
+
|
|
208
|
+
<!-- ── Content Section ── -->
|
|
209
|
+
<section id="content" class="container" style="padding-top: 4rem; padding-bottom: 4rem;">
|
|
210
|
+
<!-- DESIGN: section-content -->
|
|
211
|
+
</section>
|
|
212
|
+
</main>
|
|
213
|
+
|
|
214
|
+
<!-- ════════════════════════════════════════════════════════════
|
|
215
|
+
FOOTER
|
|
216
|
+
════════════════════════════════════════════════════════════ -->
|
|
217
|
+
<footer class="container" style="padding-top: 2rem; padding-bottom: 2rem; border-top: 1px solid var(--color-border);">
|
|
218
|
+
<div class="flex-row" style="justify-content: space-between;">
|
|
219
|
+
<!-- DESIGN: footer-content -->
|
|
220
|
+
</div>
|
|
221
|
+
</footer>
|
|
222
|
+
|
|
223
|
+
</body>
|
|
224
|
+
</html>
|
|
@@ -0,0 +1,33 @@
|
|
|
1
|
+
name: ui-driven
|
|
2
|
+
version: 1
|
|
3
|
+
description: Spec-driven workflow for frontend/UI work with required design artifacts
|
|
4
|
+
extends: spec-driven
|
|
5
|
+
|
|
6
|
+
artifacts:
|
|
7
|
+
- id: design-html
|
|
8
|
+
generates: design.html
|
|
9
|
+
description: Visual design mockup as a standalone HTML file for human review
|
|
10
|
+
template: design-html.html
|
|
11
|
+
requires: [design-tech]
|
|
12
|
+
|
|
13
|
+
- id: design-wireframe
|
|
14
|
+
generates: design-wireframe.yaml
|
|
15
|
+
description: Page wireframes with layout regions, component placements, and user flows
|
|
16
|
+
template: design-wireframe.yaml
|
|
17
|
+
requires: [design-html]
|
|
18
|
+
|
|
19
|
+
- id: design-hifi
|
|
20
|
+
generates: design-hifi.yaml
|
|
21
|
+
description: High-fidelity design system with color palette, typography, and component library
|
|
22
|
+
template: design-hifi.yaml
|
|
23
|
+
requires: [design-wireframe]
|
|
24
|
+
|
|
25
|
+
- id: tasks
|
|
26
|
+
generates: tasks.yaml
|
|
27
|
+
description: Implementation task list with dependencies
|
|
28
|
+
template: tasks.yaml
|
|
29
|
+
requires: [specs, design-tech, design-hifi]
|
|
30
|
+
|
|
31
|
+
apply:
|
|
32
|
+
requires: [tasks]
|
|
33
|
+
tracks: tasks.yaml
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|