@azure-id/orc 1.2.1 → 1.4.1
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 +2907 -2663
- package/README-id.md +44 -0
- package/README.md +631 -665
- package/bin/cli.js +36866 -34355
- package/bin/verify-contracts.js +35 -1
- package/bin/verify-package.js +15 -0
- package/bin/webui/api.js +1283 -1201
- package/bin/webui/app.html +213 -210
- package/bin/webui/css/04-motion.css +43 -0
- package/bin/webui/css/06-responsive.css +42 -0
- package/bin/webui/css/panels/hookui.css +595 -0
- package/bin/webui/fixtures/hookui.js +431 -0
- package/bin/webui/fixtures/index.js +17 -0
- package/bin/webui/i18n/en/hookui.json +180 -0
- package/bin/webui/i18n/en/nav.json +22 -21
- package/bin/webui/i18n/en/overview.json +4 -1
- package/bin/webui/i18n/en/tour.json +3 -1
- package/bin/webui/i18n/id/hookui.json +180 -0
- package/bin/webui/i18n/id/nav.json +22 -21
- package/bin/webui/i18n/id/overview.json +4 -1
- package/bin/webui/i18n/id/tour.json +3 -1
- package/bin/webui/js/01-i18n.js +152 -151
- package/bin/webui/js/90-tour.js +6 -0
- package/bin/webui/js/panels/hookui.js +1313 -0
- package/bin/webui/js/panels/overview.js +7 -0
- package/package.json +1 -1
- package/templates/hooks/README.md +80 -2
- package/templates/hooks/orc-statusline-render.js +921 -0
- package/templates/hooks/orc-statusline.js +715 -68
- package/templates/hooks/orc-subagent-line.js +219 -0
package/bin/webui/app.html
CHANGED
|
@@ -1,210 +1,213 @@
|
|
|
1
|
-
<!doctype html>
|
|
2
|
-
<html lang="en" data-theme="dark">
|
|
3
|
-
<head>
|
|
4
|
-
<meta charset="utf-8">
|
|
5
|
-
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
6
|
-
<meta name="referrer" content="no-referrer">
|
|
7
|
-
<title>orc ui</title>
|
|
8
|
-
<!--
|
|
9
|
-
THE ASSET MANIFEST. This list is the load order, and for CSS the load order is
|
|
10
|
-
the cascade order — which is why the files carry numeric prefixes and why
|
|
11
|
-
06-responsive and 04-motion are last (both override rules from the shell AND
|
|
12
|
-
from panels, and several of their declarations are deliberately not
|
|
13
|
-
!important). One <link> per file, never @import: an @import request carries no
|
|
14
|
-
session token of its own and would 401.
|
|
15
|
-
|
|
16
|
-
A file that is not listed here does not run, and the test suite reads THIS
|
|
17
|
-
list — appJs()/appCss() in test/_helpers.js concatenate exactly what the
|
|
18
|
-
browser loads, so a forgotten entry cannot hide behind a passing suite.
|
|
19
|
-
-->
|
|
20
|
-
<link rel="stylesheet" href="css/00-tokens.css">
|
|
21
|
-
<link rel="stylesheet" href="css/01-base.css">
|
|
22
|
-
<link rel="stylesheet" href="css/02-shell.css">
|
|
23
|
-
<link rel="stylesheet" href="css/03-components.css">
|
|
24
|
-
<link rel="stylesheet" href="css/panels/overview.css">
|
|
25
|
-
<link rel="stylesheet" href="css/05-tour.css">
|
|
26
|
-
<link rel="stylesheet" href="css/panels/settings.css">
|
|
27
|
-
<link rel="stylesheet" href="css/panels/lanes.css">
|
|
28
|
-
<link rel="stylesheet" href="css/panels/runs.css">
|
|
29
|
-
<link rel="stylesheet" href="css/panels/knowledge.css">
|
|
30
|
-
<link rel="stylesheet" href="css/panels/stats.css">
|
|
31
|
-
<link rel="stylesheet" href="css/panels/flow.css">
|
|
32
|
-
<link rel="stylesheet" href="css/panels/crosslink.css">
|
|
33
|
-
<link rel="stylesheet" href="css/panels/learn.css">
|
|
34
|
-
<link rel="stylesheet" href="css/panels/mockrun.css">
|
|
35
|
-
<link rel="stylesheet" href="css/panels/experiment.css">
|
|
36
|
-
<link rel="stylesheet" href="css/panels/maintenance.css">
|
|
37
|
-
<link rel="stylesheet" href="css/panels/pact.css">
|
|
38
|
-
<link rel="stylesheet" href="css/panels/boundary.css">
|
|
39
|
-
<link rel="stylesheet" href="css/panels/wait.css">
|
|
40
|
-
<link rel="stylesheet" href="css/panels/
|
|
41
|
-
<link rel="stylesheet" href="css/panels/
|
|
42
|
-
<link rel="stylesheet" href="css/panels/
|
|
43
|
-
<link rel="stylesheet" href="css/panels/
|
|
44
|
-
<link rel="stylesheet" href="css/
|
|
45
|
-
<link rel="stylesheet" href="css/
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
<span class="brand-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
<li><a href="#/
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
which
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
<li><a href="#/
|
|
82
|
-
<li><a href="#/
|
|
83
|
-
<li><a href="#/
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
<li><a href="#/
|
|
99
|
-
<li><a href="#/
|
|
100
|
-
<li><a href="#/
|
|
101
|
-
<li><a href="#/
|
|
102
|
-
<li><a href="#/
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
<li><a href="#/
|
|
112
|
-
<li><a href="#/
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
<li><a href="#/
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
<div class="rail-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
|
|
145
|
-
|
|
146
|
-
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
<div id="
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
</
|
|
156
|
-
|
|
157
|
-
|
|
158
|
-
|
|
159
|
-
|
|
160
|
-
|
|
161
|
-
|
|
162
|
-
|
|
163
|
-
<
|
|
164
|
-
|
|
165
|
-
|
|
166
|
-
|
|
167
|
-
|
|
168
|
-
|
|
169
|
-
|
|
170
|
-
|
|
171
|
-
|
|
172
|
-
|
|
173
|
-
|
|
174
|
-
|
|
175
|
-
|
|
176
|
-
|
|
177
|
-
|
|
178
|
-
|
|
179
|
-
|
|
180
|
-
|
|
181
|
-
|
|
182
|
-
<script src="js/
|
|
183
|
-
<script src="js/
|
|
184
|
-
<script src="js/
|
|
185
|
-
<script src="js/
|
|
186
|
-
<script src="js/
|
|
187
|
-
<script src="js/
|
|
188
|
-
<script src="js/
|
|
189
|
-
<script src="js/panels/
|
|
190
|
-
<script src="js/panels/
|
|
191
|
-
<script src="js/panels/
|
|
192
|
-
<script src="js/panels/
|
|
193
|
-
<script src="js/panels/
|
|
194
|
-
<script src="js/panels/
|
|
195
|
-
<script src="js/panels/
|
|
196
|
-
<script src="js/panels/
|
|
197
|
-
<script src="js/panels/
|
|
198
|
-
<script src="js/panels/
|
|
199
|
-
<script src="js/panels/
|
|
200
|
-
<script src="js/panels/
|
|
201
|
-
<script src="js/panels/
|
|
202
|
-
<script src="js/panels/
|
|
203
|
-
<script src="js/panels/
|
|
204
|
-
<script src="js/panels/
|
|
205
|
-
<script src="js/panels/
|
|
206
|
-
<script src="js/
|
|
207
|
-
<script src="js/
|
|
208
|
-
<script src="js/
|
|
209
|
-
|
|
210
|
-
|
|
1
|
+
<!doctype html>
|
|
2
|
+
<html lang="en" data-theme="dark">
|
|
3
|
+
<head>
|
|
4
|
+
<meta charset="utf-8">
|
|
5
|
+
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
6
|
+
<meta name="referrer" content="no-referrer">
|
|
7
|
+
<title>orc ui</title>
|
|
8
|
+
<!--
|
|
9
|
+
THE ASSET MANIFEST. This list is the load order, and for CSS the load order is
|
|
10
|
+
the cascade order — which is why the files carry numeric prefixes and why
|
|
11
|
+
06-responsive and 04-motion are last (both override rules from the shell AND
|
|
12
|
+
from panels, and several of their declarations are deliberately not
|
|
13
|
+
!important). One <link> per file, never @import: an @import request carries no
|
|
14
|
+
session token of its own and would 401.
|
|
15
|
+
|
|
16
|
+
A file that is not listed here does not run, and the test suite reads THIS
|
|
17
|
+
list — appJs()/appCss() in test/_helpers.js concatenate exactly what the
|
|
18
|
+
browser loads, so a forgotten entry cannot hide behind a passing suite.
|
|
19
|
+
-->
|
|
20
|
+
<link rel="stylesheet" href="css/00-tokens.css">
|
|
21
|
+
<link rel="stylesheet" href="css/01-base.css">
|
|
22
|
+
<link rel="stylesheet" href="css/02-shell.css">
|
|
23
|
+
<link rel="stylesheet" href="css/03-components.css">
|
|
24
|
+
<link rel="stylesheet" href="css/panels/overview.css">
|
|
25
|
+
<link rel="stylesheet" href="css/05-tour.css">
|
|
26
|
+
<link rel="stylesheet" href="css/panels/settings.css">
|
|
27
|
+
<link rel="stylesheet" href="css/panels/lanes.css">
|
|
28
|
+
<link rel="stylesheet" href="css/panels/runs.css">
|
|
29
|
+
<link rel="stylesheet" href="css/panels/knowledge.css">
|
|
30
|
+
<link rel="stylesheet" href="css/panels/stats.css">
|
|
31
|
+
<link rel="stylesheet" href="css/panels/flow.css">
|
|
32
|
+
<link rel="stylesheet" href="css/panels/crosslink.css">
|
|
33
|
+
<link rel="stylesheet" href="css/panels/learn.css">
|
|
34
|
+
<link rel="stylesheet" href="css/panels/mockrun.css">
|
|
35
|
+
<link rel="stylesheet" href="css/panels/experiment.css">
|
|
36
|
+
<link rel="stylesheet" href="css/panels/maintenance.css">
|
|
37
|
+
<link rel="stylesheet" href="css/panels/pact.css">
|
|
38
|
+
<link rel="stylesheet" href="css/panels/boundary.css">
|
|
39
|
+
<link rel="stylesheet" href="css/panels/wait.css">
|
|
40
|
+
<link rel="stylesheet" href="css/panels/hookui.css">
|
|
41
|
+
<link rel="stylesheet" href="css/panels/handoff.css">
|
|
42
|
+
<link rel="stylesheet" href="css/panels/challenge.css">
|
|
43
|
+
<link rel="stylesheet" href="css/panels/docs.css">
|
|
44
|
+
<link rel="stylesheet" href="css/panels/extra.css">
|
|
45
|
+
<link rel="stylesheet" href="css/06-responsive.css">
|
|
46
|
+
<link rel="stylesheet" href="css/04-motion.css">
|
|
47
|
+
</head>
|
|
48
|
+
<body>
|
|
49
|
+
|
|
50
|
+
<!--
|
|
51
|
+
The shell is deliberately static and small: every panel is rendered by its own
|
|
52
|
+
function in app.js against its own endpoint, with no shared mutable state, so
|
|
53
|
+
rewriting one panel cannot break another. See the plan, §9.
|
|
54
|
+
No inline <script> or style="" anywhere — the server sends a strict CSP.
|
|
55
|
+
-->
|
|
56
|
+
|
|
57
|
+
<div class="shell">
|
|
58
|
+
|
|
59
|
+
<nav class="rail" aria-label="Panels">
|
|
60
|
+
<div class="brand">
|
|
61
|
+
<span class="brand-mark" aria-hidden="true">◆</span>
|
|
62
|
+
<span class="brand-text">orc<span class="brand-dim"> ui</span></span>
|
|
63
|
+
</div>
|
|
64
|
+
|
|
65
|
+
<!--
|
|
66
|
+
data-idx is the keyboard shortcut for that panel; the rail reveals the
|
|
67
|
+
numbers on hover so they are discoverable without a legend.
|
|
68
|
+
data-i18n names the string table entry: the text between the tags is the
|
|
69
|
+
English fallback that ships in the markup, so a failed i18n fetch renders
|
|
70
|
+
a readable English rail rather than a column of empty links.
|
|
71
|
+
-->
|
|
72
|
+
<ul class="nav" id="nav">
|
|
73
|
+
<li><a href="#/overview" data-panel="overview" data-idx="1" data-i18n="nav.overview">Overview</a></li>
|
|
74
|
+
<li><a href="#/settings" data-panel="settings" data-idx="2" data-i18n="nav.settings">Settings</a></li>
|
|
75
|
+
<!--
|
|
76
|
+
v1.0.0 W16. Lanes sits directly under Settings because it answers the
|
|
77
|
+
other half of the same question. Settings says what a key resolves to
|
|
78
|
+
and which lanes read it; this says what those lanes then DO with it —
|
|
79
|
+
which shared phases they run, in order, and which CLI calls they make.
|
|
80
|
+
-->
|
|
81
|
+
<li><a href="#/lanes" data-panel="lanes" data-idx="l" data-i18n="nav.lanes">Lanes</a></li>
|
|
82
|
+
<li><a href="#/runs" data-panel="runs" data-idx="3" data-i18n="nav.runs">Runs</a></li>
|
|
83
|
+
<li><a href="#/knowledge" data-panel="knowledge" data-idx="4" data-i18n="nav.knowledge">Knowledge</a></li>
|
|
84
|
+
<li><a href="#/stats" data-panel="stats" data-idx="5" data-i18n="nav.stats">Stats</a></li>
|
|
85
|
+
<!--
|
|
86
|
+
v0.46.0. Promises and Boundary sit next to Knowledge because they ARE
|
|
87
|
+
knowledge — derived, coverage-anchored, and stale the same way a wiki doc
|
|
88
|
+
is. Self-serve sits last of the three: it is the only panel here aimed at
|
|
89
|
+
somebody who does not read code, and it is the one a developer opens
|
|
90
|
+
least often.
|
|
91
|
+
-->
|
|
92
|
+
<!--
|
|
93
|
+
v0.48.0. Docs sits directly above Challenge because that is the order
|
|
94
|
+
the two are used in: you write a document, then you grade it — and the
|
|
95
|
+
grading has to happen in a different session, which is the one thing
|
|
96
|
+
both panels say out loud.
|
|
97
|
+
-->
|
|
98
|
+
<li><a href="#/docs" data-panel="docs" data-idx="d" data-i18n="nav.docs">Docs</a></li>
|
|
99
|
+
<li><a href="#/challenge" data-panel="challenge" data-idx="c" data-i18n="nav.challenge">Challenge</a></li>
|
|
100
|
+
<li><a href="#/pact" data-panel="pact" data-idx="p" data-i18n="nav.pact">Promises</a></li>
|
|
101
|
+
<li><a href="#/boundary" data-panel="boundary" data-idx="b" data-i18n="nav.boundary">Boundary</a></li>
|
|
102
|
+
<li><a href="#/wait" data-panel="wait" data-idx="w" data-i18n="nav.wait">Wait</a></li>
|
|
103
|
+
<li><a href="#/hookui" data-panel="hookui" data-idx="s" data-i18n="nav.hookui">CLI Hook Interface</a></li>
|
|
104
|
+
<li><a href="#/handoff" data-panel="handoff" data-idx="h" data-i18n="nav.handoff">Self-serve</a></li>
|
|
105
|
+
<!--
|
|
106
|
+
v0.50.0. Extra sits directly above Flow because both answer the same
|
|
107
|
+
question — WHERE does a task run — and this is the one that can send it
|
|
108
|
+
off this machine. It is the last thing above the composer for that
|
|
109
|
+
reason, never buried under the reading panels.
|
|
110
|
+
-->
|
|
111
|
+
<li><a href="#/extra" data-panel="extra" data-idx="e" data-i18n="nav.extra">Extra</a></li>
|
|
112
|
+
<li><a href="#/flow" data-panel="flow" data-idx="6" data-i18n="nav.flow">Flow</a></li>
|
|
113
|
+
<li><a href="#/crosslink" data-panel="crosslink" data-idx="7" data-i18n="nav.crosslink">Crosslink</a></li>
|
|
114
|
+
<li><a href="#/learn" data-panel="learn" data-idx="8" data-i18n="nav.learn">Learn</a></li>
|
|
115
|
+
<!--
|
|
116
|
+
Next to Learn because it is the same kind of thing: reading, not doing.
|
|
117
|
+
The walkthroughs ship with the package, so this panel works on a machine
|
|
118
|
+
with no project at all — the same as Learn and unlike every other panel.
|
|
119
|
+
-->
|
|
120
|
+
<li><a href="#/mockrun" data-panel="mockrun" data-idx="m" data-i18n="nav.mockrun">Mocked Skill Use</a></li>
|
|
121
|
+
<li><a href="#/experiment" data-panel="experiment" data-idx="9" data-i18n="nav.experiment">Experiment</a></li>
|
|
122
|
+
<li><a href="#/maintenance" data-panel="maintenance" data-idx="0" data-i18n="nav.maintenance">Maintenance</a></li>
|
|
123
|
+
</ul>
|
|
124
|
+
|
|
125
|
+
<div class="rail-foot">
|
|
126
|
+
<div class="rail-project" id="rail-project" title="">—</div>
|
|
127
|
+
<div class="rail-version" id="rail-version"></div>
|
|
128
|
+
<div class="rail-buttons">
|
|
129
|
+
<button class="btn btn-ghost btn-sm" id="theme-toggle" type="button">Light</button>
|
|
130
|
+
<button class="btn btn-ghost btn-sm" id="shortcut-hint" type="button" title="Keyboard shortcuts">?</button>
|
|
131
|
+
</div>
|
|
132
|
+
<!--
|
|
133
|
+
Language sits BELOW the theme row on purpose: it is the same class of
|
|
134
|
+
control (a per-browser display preference, never a project setting) and
|
|
135
|
+
it is switched far less often, so it gets the calmer position.
|
|
136
|
+
-->
|
|
137
|
+
<div class="rail-buttons">
|
|
138
|
+
<button class="btn btn-ghost btn-sm lang-btn" id="lang-toggle" type="button">
|
|
139
|
+
<span class="lang-globe" aria-hidden="true">🌐</span><span id="lang-label">English</span>
|
|
140
|
+
</button>
|
|
141
|
+
</div>
|
|
142
|
+
</div>
|
|
143
|
+
</nav>
|
|
144
|
+
|
|
145
|
+
<main class="main">
|
|
146
|
+
<!--
|
|
147
|
+
Global banner slot. The one thing that must be visible on EVERY panel is
|
|
148
|
+
the global-install warning: if ORC is installed globally, the skills that
|
|
149
|
+
actually run may be the global copy reading the global config, while this
|
|
150
|
+
panel edits the project one that nothing reads.
|
|
151
|
+
-->
|
|
152
|
+
<div id="banners" class="banners"></div>
|
|
153
|
+
|
|
154
|
+
<div id="panel" class="panel" aria-live="polite"></div>
|
|
155
|
+
</main>
|
|
156
|
+
|
|
157
|
+
</div>
|
|
158
|
+
|
|
159
|
+
<!-- Single modal host. Every confirmation and preview renders into it. -->
|
|
160
|
+
<div class="modal-host" id="modal-host" hidden>
|
|
161
|
+
<div class="modal-backdrop" id="modal-backdrop"></div>
|
|
162
|
+
<div class="modal" role="dialog" aria-modal="true" aria-labelledby="modal-title">
|
|
163
|
+
<h2 class="modal-title" id="modal-title"></h2>
|
|
164
|
+
<div class="modal-body" id="modal-body"></div>
|
|
165
|
+
<div class="modal-foot" id="modal-foot"></div>
|
|
166
|
+
</div>
|
|
167
|
+
</div>
|
|
168
|
+
|
|
169
|
+
<!-- Transient confirmations (a committed setting, a failed write). -->
|
|
170
|
+
<div class="toasts" id="toasts" aria-live="polite"></div>
|
|
171
|
+
|
|
172
|
+
<!--
|
|
173
|
+
Classic scripts in an explicit load order — no type="module" anywhere. An ES
|
|
174
|
+
module `import` carries no query string, so every import would 401 against the
|
|
175
|
+
per-launch token unless static auth were weakened, and weakening it is not on
|
|
176
|
+
the table. Classic scripts also mean every top-level function and const lands
|
|
177
|
+
in ONE shared global scope, so the split needed no import/export and changed
|
|
178
|
+
no call site.
|
|
179
|
+
|
|
180
|
+
99-boot.js is last because boot() is the one call that runs at load time.
|
|
181
|
+
-->
|
|
182
|
+
<script src="js/00-core.js"></script>
|
|
183
|
+
<script src="js/01-i18n.js"></script>
|
|
184
|
+
<script src="js/02-ui.js"></script>
|
|
185
|
+
<script src="js/03-md.js"></script>
|
|
186
|
+
<script src="js/04-router.js"></script>
|
|
187
|
+
<script src="js/05-banners.js"></script>
|
|
188
|
+
<script src="js/06-edit.js"></script>
|
|
189
|
+
<script src="js/panels/overview.js"></script>
|
|
190
|
+
<script src="js/panels/settings.js"></script>
|
|
191
|
+
<script src="js/panels/lanes.js"></script>
|
|
192
|
+
<script src="js/panels/runs.js"></script>
|
|
193
|
+
<script src="js/panels/knowledge.js"></script>
|
|
194
|
+
<script src="js/panels/stats.js"></script>
|
|
195
|
+
<script src="js/panels/flow.js"></script>
|
|
196
|
+
<script src="js/panels/crosslink.js"></script>
|
|
197
|
+
<script src="js/panels/learn.js"></script>
|
|
198
|
+
<script src="js/panels/mockrun.js"></script>
|
|
199
|
+
<script src="js/panels/experiment.js"></script>
|
|
200
|
+
<script src="js/panels/maintenance.js"></script>
|
|
201
|
+
<script src="js/panels/pact.js"></script>
|
|
202
|
+
<script src="js/panels/boundary.js"></script>
|
|
203
|
+
<script src="js/panels/handoff.js"></script>
|
|
204
|
+
<script src="js/panels/challenge.js"></script>
|
|
205
|
+
<script src="js/panels/docs.js"></script>
|
|
206
|
+
<script src="js/panels/extra.js"></script>
|
|
207
|
+
<script src="js/panels/wait.js"></script>
|
|
208
|
+
<script src="js/panels/hookui.js"></script>
|
|
209
|
+
<script src="js/90-tour.js"></script>
|
|
210
|
+
<script src="js/91-shortcuts.js"></script>
|
|
211
|
+
<script src="js/99-boot.js"></script>
|
|
212
|
+
</body>
|
|
213
|
+
</html>
|
|
@@ -37,6 +37,43 @@
|
|
|
37
37
|
from { opacity: 0; transform: translateY(8px); }
|
|
38
38
|
to { opacity: 1; transform: none; }
|
|
39
39
|
}
|
|
40
|
+
/* ── the CLI Hook Interface (v1.4.1) ─────────────────────────────────────── */
|
|
41
|
+
/* The board is a thing you BUILD, so it moves the way a thing you build moves:
|
|
42
|
+
a chip arrives, a chip you just staged breathes once so you can find it, and
|
|
43
|
+
a row in the part picker slides in as the list narrows under your typing.
|
|
44
|
+
Every one of them is a FINITE animation with a real end state, so the cap in
|
|
45
|
+
the reduced-motion block below leaves each one at rest rather than frozen
|
|
46
|
+
part-way. */
|
|
47
|
+
.hk-chip { animation: hk-chip-in 200ms var(--ease) backwards; }
|
|
48
|
+
@keyframes hk-chip-in {
|
|
49
|
+
from { opacity: 0; transform: translateY(6px) scale(0.97); }
|
|
50
|
+
to { opacity: 1; transform: none; }
|
|
51
|
+
}
|
|
52
|
+
/* Staged, not written — and the one thing on the board that has to be findable
|
|
53
|
+
the instant it appears. Three pulses and it stops: an infinite one would have
|
|
54
|
+
to be REMOVED below rather than capped, and this one reads correctly at rest.
|
|
55
|
+
*/
|
|
56
|
+
.hk-chip-new { animation: hk-chip-in 200ms var(--ease) backwards, hk-chip-mark 900ms var(--ease) 3; }
|
|
57
|
+
@keyframes hk-chip-mark {
|
|
58
|
+
0%, 100% { box-shadow: inset 0 0 0 0 var(--accent); }
|
|
59
|
+
50% { box-shadow: inset 0 0 0 2px var(--accent); }
|
|
60
|
+
}
|
|
61
|
+
/* Position, drop marker, and the zone's own border: transitions rather than
|
|
62
|
+
animations, so an interrupted drag never leaves a chip mid-flight. */
|
|
63
|
+
.hk-chip, .hk-zone, .hk-add, .hk-act, .hk-pick-row, .hk-theme, .hk-sample {
|
|
64
|
+
transition: border-color var(--dur) var(--ease), background var(--dur) var(--ease),
|
|
65
|
+
box-shadow var(--dur) var(--ease), opacity var(--dur) var(--ease),
|
|
66
|
+
transform var(--dur) var(--ease);
|
|
67
|
+
}
|
|
68
|
+
.hk-chip:hover:not(.hk-chip-dragging) { transform: translateY(-2px); }
|
|
69
|
+
.hk-add:hover:not(:disabled) { transform: translateY(-2px); }
|
|
70
|
+
.hk-pick-row { animation: hk-row-in 160ms var(--ease) backwards; }
|
|
71
|
+
@keyframes hk-row-in {
|
|
72
|
+
from { opacity: 0; transform: translateX(-6px); }
|
|
73
|
+
to { opacity: 1; transform: none; }
|
|
74
|
+
}
|
|
75
|
+
button.hk-pick-row:hover { transform: translateX(3px); }
|
|
76
|
+
|
|
40
77
|
/* ---------------------------------------------------------- REDUCED MOTION */
|
|
41
78
|
/* Non-negotiable: every animation and transition above is off. */
|
|
42
79
|
|
|
@@ -55,6 +92,12 @@
|
|
|
55
92
|
nudges are removed outright rather than sped up. */
|
|
56
93
|
.nav a:hover, .btn:active:not(:disabled), .action:hover,
|
|
57
94
|
.todo:hover, .stat-link:hover, button.step:hover { transform: none !important; }
|
|
95
|
+
/* The board's own nudges, removed rather than shortened — a chip that lifts
|
|
96
|
+
under the pointer is an affordance, and a fast lift is still a lift. The
|
|
97
|
+
border and box-shadow changes stay: THEY are what says where a drop lands,
|
|
98
|
+
and a drop marker carried by motion alone would not exist here at all. */
|
|
99
|
+
.hk-chip:hover:not(.hk-chip-dragging), .hk-add:hover:not(:disabled),
|
|
100
|
+
button.hk-pick-row:hover { transform: none !important; }
|
|
58
101
|
/* The vault pulse is one of two INFINITE animations on the page. Capping it to
|
|
59
102
|
a single 1ms run would still leave a dash frozen mid-edge, so it is removed
|
|
60
103
|
outright and the edge reads as a plain line. */
|
|
@@ -117,4 +117,46 @@
|
|
|
117
117
|
/* A per-file position line cannot hold a path, a state word and a line delta
|
|
118
118
|
on one row below this — and the path is the half that must stay readable. */
|
|
119
119
|
.ex-rec-file { flex-direction: column; align-items: flex-start; }
|
|
120
|
+
|
|
121
|
+
/* v1.3.0 — the CLI Hook Interface. Every variant that DECLARES columns
|
|
122
|
+
collapses explicitly; the ones that do not (the chip, the palette row) are
|
|
123
|
+
flex and wrap on their own, which is exactly why they were written that
|
|
124
|
+
way. The PREVIEW never collapses: it is a monospaced grid and squeezing it
|
|
125
|
+
would misreport the width the user is deciding. It scrolls instead. */
|
|
126
|
+
.hk-degrade-row,
|
|
127
|
+
.hk-field,
|
|
128
|
+
.hk-check {
|
|
129
|
+
grid-template-columns: 1fr;
|
|
130
|
+
gap: 4px;
|
|
131
|
+
}
|
|
132
|
+
.hk-degrade-label {
|
|
133
|
+
text-align: left;
|
|
134
|
+
}
|
|
135
|
+
.hk-gallery {
|
|
136
|
+
grid-template-columns: 1fr 1fr;
|
|
137
|
+
}
|
|
138
|
+
.hk-prow-id {
|
|
139
|
+
min-width: 0;
|
|
140
|
+
}
|
|
141
|
+
/* v1.4.1 — the editor's two-column field (a name plus the sentence that
|
|
142
|
+
explains it, then the control) stacks; and DRAG IS OFF below this width. A
|
|
143
|
+
40-pixel drop gap on a phone is not a target, so the three buttons on every
|
|
144
|
+
chip are the path — which is why they are buttons on the chip and not a
|
|
145
|
+
menu behind one. */
|
|
146
|
+
.hk-chip {
|
|
147
|
+
max-width: none;
|
|
148
|
+
flex-basis: 100%;
|
|
149
|
+
cursor: default;
|
|
150
|
+
}
|
|
151
|
+
.hk-grip { display: none; }
|
|
152
|
+
.hk-add { flex-basis: 100%; }
|
|
153
|
+
.hk-picker, .hk-editor { min-width: 0; }
|
|
154
|
+
.hk-theme { flex-basis: 100%; max-width: none; }
|
|
155
|
+
/* The caution KEEPS its two columns. The mark and the sentence belong to each
|
|
156
|
+
other, and stacking them puts a lone ✕ on a line of its own above the text
|
|
157
|
+
it is about. The mark column narrows instead. */
|
|
158
|
+
.hk-caution {
|
|
159
|
+
grid-template-columns: 14px 1fr;
|
|
160
|
+
gap: 6px;
|
|
161
|
+
}
|
|
120
162
|
}
|