archik 0.5.0 → 0.6.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/.claude/skills/archik/SKILL.md +139 -27
- package/README.md +10 -3
- package/bin/postinstall.js +58 -0
- package/dist/cli/archik.mjs +276 -277
- package/dist/ui/assets/index-B-QfxZju.css +1 -0
- package/dist/ui/assets/index-JB4HoiIw.js +217 -0
- package/dist/ui/index.html +2 -2
- package/package.json +2 -1
- package/dist/ui/assets/index-CLojQhdH.css +0 -1
- package/dist/ui/assets/index-DYo4PMJU.js +0 -217
|
@@ -1,30 +1,41 @@
|
|
|
1
1
|
---
|
|
2
2
|
name: archik
|
|
3
|
-
description: Use whenever architecture.archik.yaml exists in the project, or the user asks about the system's architecture, services, dependencies, or data flow. The YAML is the shared map of the project between the user and Claude — read it before answering structural questions, and propose updates when work introduces or changes nodes/edges. Also covers the archik CLI for validation and rendering.
|
|
3
|
+
description: Use whenever .archik/main.archik.yaml or architecture.archik.yaml exists in the project, or the user asks about the system's architecture, services, dependencies, or data flow. The YAML is the shared map of the project between the user and Claude — read it before answering structural questions, and propose updates when work introduces or changes nodes/edges. Also covers the archik CLI for validation and rendering.
|
|
4
4
|
---
|
|
5
5
|
|
|
6
6
|
# Archik — the project's shared map
|
|
7
7
|
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
8
|
+
The archik file is **the user's source of truth for what the system
|
|
9
|
+
looks like**. It lists every meaningful node (services, databases,
|
|
10
|
+
queues, frontends, external APIs, …) and the edges between them.
|
|
11
|
+
The canvas in the browser is a stateless projection of this file —
|
|
12
|
+
when the user says "the orders service" or "the events queue", they
|
|
13
|
+
mean the entity with that `id` in the YAML.
|
|
14
14
|
|
|
15
|
-
|
|
16
|
-
|
|
15
|
+
The file lives in one of two places, in this order of preference:
|
|
16
|
+
|
|
17
|
+
1. `.archik/main.archik.yaml` — the new convention. Keeps the
|
|
18
|
+
project root tidy and leaves room for sub-architectures (other
|
|
19
|
+
`.archik/*.archik.yaml` files for individual components).
|
|
20
|
+
2. `architecture.archik.yaml` — the legacy root location, still
|
|
21
|
+
fully supported.
|
|
22
|
+
|
|
23
|
+
Run `archik validate` (or check both paths) to find which one the
|
|
24
|
+
project uses. Don't assume — small differences here matter.
|
|
25
|
+
|
|
26
|
+
Treat the file as a shared vocabulary. It exists so the user and
|
|
27
|
+
you can talk about the system without re-explaining it every time.
|
|
17
28
|
|
|
18
29
|
## Protocol
|
|
19
30
|
|
|
20
31
|
1. **Before** answering structural questions — *"what does X do?",
|
|
21
32
|
"what depends on Y?", "where does data flow when …?"* — read
|
|
22
|
-
|
|
33
|
+
the archik file. Don't guess from filenames or memory.
|
|
23
34
|
2. **When** work introduces, removes, or rewires components, write
|
|
24
|
-
the proposed end-state to
|
|
25
|
-
(same schema, plus a `metadata.suggestion` block —
|
|
26
|
-
changes" below). Don't edit
|
|
27
|
-
the user reviews and accepts in the canvas or via
|
|
35
|
+
the proposed end-state to a sibling `*.suggested.yaml` next to
|
|
36
|
+
the main file (same schema, plus a `metadata.suggestion` block —
|
|
37
|
+
see "Suggesting changes" below). Don't edit the main file
|
|
38
|
+
directly; the user reviews and accepts in the canvas or via
|
|
28
39
|
`archik suggest accept`.
|
|
29
40
|
3. **After** every edit to a YAML, run `archik validate`. Fix any
|
|
30
41
|
reported errors before declaring the change done.
|
|
@@ -33,15 +44,56 @@ The sections below are the detailed reference behind these three
|
|
|
33
44
|
rules — *when* to consult, *when* to propose, schema, taxonomy,
|
|
34
45
|
relationship vocabulary, and CLI.
|
|
35
46
|
|
|
47
|
+
## Grounding (do this once per session, before structural work)
|
|
48
|
+
|
|
49
|
+
The archik file tells you *what* exists. The source tree tells you
|
|
50
|
+
*where* it lives. The mapping between the two is the whole reason
|
|
51
|
+
the file is valuable — without it you just know there's "an Orders
|
|
52
|
+
service" but not where to go to read or edit it. So:
|
|
53
|
+
|
|
54
|
+
1. **Read the archik file in full.** Use `archik validate` first to
|
|
55
|
+
find the canonical path (it prefers `.archik/main.archik.yaml`,
|
|
56
|
+
falls back to `architecture.archik.yaml`). Then `cat` it —
|
|
57
|
+
don't grep, you want the whole shape in your head.
|
|
58
|
+
2. **List the source tree.** A single `ls` of the top-level project
|
|
59
|
+
directory plus the most likely source roots is usually enough:
|
|
60
|
+
`ls -F . src/ services/ packages/ apps/ 2>/dev/null`. If the
|
|
61
|
+
project has sub-architectures under `.archik/`, list those too
|
|
62
|
+
(`ls .archik/`) — they're how the user breaks the diagram up by
|
|
63
|
+
component.
|
|
64
|
+
3. **Build the mapping in your head.** Most projects follow one of
|
|
65
|
+
two patterns: each top-level archik node id matches a folder
|
|
66
|
+
under `src/` (or `services/` / `packages/`), or the `stack` /
|
|
67
|
+
`description` field hints at the location. Note the mismatches
|
|
68
|
+
— those are the places where moving a folder will outgrow the
|
|
69
|
+
diagram, and where new code is most likely to need a YAML
|
|
70
|
+
update too.
|
|
71
|
+
4. **Run `archik check`** if it's available — it walks `src/`,
|
|
72
|
+
`services/`, `packages/`, and `apps/` and flags nodes that
|
|
73
|
+
don't have a matching folder (and folders that look like
|
|
74
|
+
services but aren't in the diagram). Cheap drift detector;
|
|
75
|
+
worth running before any non-trivial edit.
|
|
76
|
+
|
|
77
|
+
When the user asks "where would I add X?" or "what's the right
|
|
78
|
+
place for Y?", you should already have the answer because step 3
|
|
79
|
+
gave it to you. When they ask "what would `archik render` show?",
|
|
80
|
+
the answer is in step 1.
|
|
81
|
+
|
|
36
82
|
## Suggesting changes (the sidecar workflow)
|
|
37
83
|
|
|
38
|
-
The
|
|
84
|
+
The archik file is the user's source of truth. You don't get to
|
|
39
85
|
mutate it directly. Instead, write your proposed end-state to a
|
|
40
|
-
sidecar file
|
|
86
|
+
sidecar file in the same directory, with the same stem plus
|
|
87
|
+
`.suggested`:
|
|
41
88
|
|
|
42
89
|
```
|
|
43
|
-
|
|
44
|
-
|
|
90
|
+
# new convention
|
|
91
|
+
.archik/main.archik.yaml ← truth — user owns it
|
|
92
|
+
.archik/main.archik.suggested.yaml ← your draft proposal
|
|
93
|
+
|
|
94
|
+
# legacy layout — same naming rule, just at the root
|
|
95
|
+
architecture.archik.yaml
|
|
96
|
+
architecture.archik.suggested.yaml
|
|
45
97
|
```
|
|
46
98
|
|
|
47
99
|
The sidecar is a complete, valid Archik document — same schema as the
|
|
@@ -53,7 +105,7 @@ version: "1.0"
|
|
|
53
105
|
name: My Architecture
|
|
54
106
|
metadata:
|
|
55
107
|
suggestion:
|
|
56
|
-
from:
|
|
108
|
+
from: .archik/main.archik.yaml
|
|
57
109
|
at: 2026-04-26T17:00:00Z
|
|
58
110
|
note: add Stripe payment flow # optional one-liner
|
|
59
111
|
nodes:
|
|
@@ -65,9 +117,14 @@ edges:
|
|
|
65
117
|
Once you've written the sidecar:
|
|
66
118
|
|
|
67
119
|
* The canvas shows a **📝 Suggestion pending** banner with `Review`,
|
|
68
|
-
`Accept`, `Reject` buttons. Review
|
|
69
|
-
|
|
70
|
-
|
|
120
|
+
`Accept`, `Reject` buttons. Review **toggles an in-canvas overlay
|
|
121
|
+
on the same page** — added nodes/edges get green frames, removed
|
|
122
|
+
ones get red dashed frames and dim out, changed ones get amber
|
|
123
|
+
frames, and each gets a `+` / `−` / `~` badge. The button label
|
|
124
|
+
flips to "Hide diff" while the overlay is on; click again to drop
|
|
125
|
+
back to the regular view. Accept renames the sidecar over the main
|
|
126
|
+
file; Reject deletes the sidecar. Both also clear review mode so
|
|
127
|
+
the canvas snaps back to the new truth.
|
|
71
128
|
* From the terminal: `archik suggest show | accept | reject`.
|
|
72
129
|
|
|
73
130
|
If the user has no canvas open and asks "apply it", run
|
|
@@ -112,7 +169,7 @@ this file) when the work you're doing changes the structure:
|
|
|
112
169
|
|
|
113
170
|
Frame it as: *"This adds a `payments-worker` that reads from the
|
|
114
171
|
`order-events` queue and writes to `payments-db`. Want me to update
|
|
115
|
-
|
|
172
|
+
the archik file to capture that?"*
|
|
116
173
|
|
|
117
174
|
## When to defer
|
|
118
175
|
|
|
@@ -181,10 +238,63 @@ metadata: # optional
|
|
|
181
238
|
notes: # optional, list of free-text notes
|
|
182
239
|
- "Migrated from monolith in 2024."
|
|
183
240
|
parentId: platform # optional, must reference a real node
|
|
241
|
+
archikFile: .archik/orders.archik.yaml # optional drill-down
|
|
184
242
|
metadata: # optional, free record
|
|
185
243
|
team: fulfillment
|
|
186
244
|
```
|
|
187
245
|
|
|
246
|
+
### Cross-file edges (`fromFile` / `toFile`)
|
|
247
|
+
|
|
248
|
+
Edges can also point at a node that lives in a peer file. Set
|
|
249
|
+
`toFile` (or `fromFile`) to that file's relative path; the canvas
|
|
250
|
+
won't draw the edge itself but will hang an "↗" badge on the local
|
|
251
|
+
endpoint, with the target file in the tooltip. Click → navigate.
|
|
252
|
+
|
|
253
|
+
```yaml
|
|
254
|
+
edges:
|
|
255
|
+
- id: api-pays
|
|
256
|
+
from: api # local node
|
|
257
|
+
to: charge-handler
|
|
258
|
+
toFile: .archik/payments.archik.yaml # peer file
|
|
259
|
+
relationship: http_call
|
|
260
|
+
label: charge
|
|
261
|
+
```
|
|
262
|
+
|
|
263
|
+
Constraints (the schema enforces them):
|
|
264
|
+
|
|
265
|
+
- The cross-file path follows the same rules as `archikFile` (relative,
|
|
266
|
+
forward slashes, no `..`, ends in `.archik.yaml`).
|
|
267
|
+
- The *local* endpoint id must still match a node in this file.
|
|
268
|
+
- An edge with **both** `fromFile` and `toFile` is rejected — author
|
|
269
|
+
it inside one of the two referenced files instead.
|
|
270
|
+
|
|
271
|
+
### Drilling into a sub-architecture (`archikFile`)
|
|
272
|
+
|
|
273
|
+
A node can point at *its own* archik file via `archikFile`. The
|
|
274
|
+
canvas shows a small "↓ open" badge on those nodes; clicking it
|
|
275
|
+
loads the linked file and adds a breadcrumb so the user can come
|
|
276
|
+
back. Use it when a component is meaty enough to deserve its own
|
|
277
|
+
diagram (a service with internal modules, a frontend with several
|
|
278
|
+
panes, etc.).
|
|
279
|
+
|
|
280
|
+
Constraints (the schema enforces them):
|
|
281
|
+
- Relative path only — no leading `/`, no Windows drive letter.
|
|
282
|
+
- Must use forward slashes; `..` segments are rejected.
|
|
283
|
+
- Must end in `.archik.yaml` (the suggestion sidecar is derived
|
|
284
|
+
automatically as `<stem>.suggested.yaml` next to it).
|
|
285
|
+
- Cycles aren't checked at parse time (each file validates on its
|
|
286
|
+
own); if you wire a loop the canvas just lets the user navigate
|
|
287
|
+
in and out.
|
|
288
|
+
|
|
289
|
+
Conventional layout: keep sub-files under `.archik/` next to
|
|
290
|
+
`main.archik.yaml`. Example:
|
|
291
|
+
|
|
292
|
+
```
|
|
293
|
+
.archik/main.archik.yaml # entry point
|
|
294
|
+
.archik/orders.archik.yaml # Orders service internals
|
|
295
|
+
.archik/payments.archik.yaml # Payments service internals
|
|
296
|
+
```
|
|
297
|
+
|
|
188
298
|
## Node kinds (27 total, grouped by purpose)
|
|
189
299
|
|
|
190
300
|
| Group | Kinds |
|
|
@@ -464,8 +574,10 @@ edges:
|
|
|
464
574
|
## CLI
|
|
465
575
|
|
|
466
576
|
These commands are available globally if archik was installed via
|
|
467
|
-
`npm link`.
|
|
468
|
-
|
|
577
|
+
`npm link`. Without a positional path, each command resolves the
|
|
578
|
+
archik file in this order: `.archik/main.archik.yaml` (preferred),
|
|
579
|
+
then `architecture.archik.yaml` (legacy). If both exist the
|
|
580
|
+
command errors and asks the user to pick one.
|
|
469
581
|
|
|
470
582
|
```
|
|
471
583
|
archik validate # schema check (run after every edit)
|
|
@@ -483,7 +595,7 @@ archik dev # open the live editor in the browser (foregr
|
|
|
483
595
|
archik start # same as dev, detached — returns the prompt
|
|
484
596
|
archik stop # stop the background server
|
|
485
597
|
archik status # list running archik instances
|
|
486
|
-
archik init # scaffold a starter file
|
|
598
|
+
archik init # scaffold a starter file (also installs this skill into ./.claude/skills/archik/ unless --no-skill)
|
|
487
599
|
archik skill # install/refresh this skill in cwd
|
|
488
600
|
```
|
|
489
601
|
|
|
@@ -493,7 +605,7 @@ archik checkout.
|
|
|
493
605
|
|
|
494
606
|
## Verification workflow
|
|
495
607
|
|
|
496
|
-
After **every** edit you make to
|
|
608
|
+
After **every** edit you make to the archik file:
|
|
497
609
|
|
|
498
610
|
1. Run `archik validate` — fix any reported errors before declaring
|
|
499
611
|
the change done. Schema errors include the path of the offending
|
package/README.md
CHANGED
|
@@ -11,7 +11,7 @@ You write a small YAML file describing your nodes (services, databases, queues,
|
|
|
11
11
|
## Quickstart
|
|
12
12
|
|
|
13
13
|
```bash
|
|
14
|
-
npx archik init # scaffold
|
|
14
|
+
npx archik init # scaffold .archik/main.archik.yaml in cwd
|
|
15
15
|
npx archik start # canvas at http://localhost:5173 (background)
|
|
16
16
|
npx archik stop # done
|
|
17
17
|
```
|
|
@@ -77,7 +77,7 @@ So conversations like *"add a payments worker that subscribes to the orders queu
|
|
|
77
77
|
## Commands
|
|
78
78
|
|
|
79
79
|
```
|
|
80
|
-
archik init [path] Scaffold a starter
|
|
80
|
+
archik init [path] Scaffold a starter .archik/main.archik.yaml
|
|
81
81
|
(also installs the Claude skill by default)
|
|
82
82
|
--no-skill skip installing the Claude skill
|
|
83
83
|
|
|
@@ -102,7 +102,14 @@ archik skill Install the Claude skill for AI editing
|
|
|
102
102
|
--force overwrite an existing skill
|
|
103
103
|
```
|
|
104
104
|
|
|
105
|
-
|
|
105
|
+
Without a `[path]` argument, archik resolves the file in this order:
|
|
106
|
+
|
|
107
|
+
1. `.archik/main.archik.yaml` (preferred new convention — keeps the project root tidy)
|
|
108
|
+
2. `architecture.archik.yaml` (legacy root location — still fully supported)
|
|
109
|
+
|
|
110
|
+
If both exist the command errors out and asks you to pick one. New projects get the `.archik/` layout from `archik init`; existing projects keep working without any migration.
|
|
111
|
+
|
|
112
|
+
Single instance per file is enforced via a lock file in `$TMPDIR/archik-cli/`, so parallel `dev` and `start` against the same YAML are rejected with a friendly error.
|
|
106
113
|
|
|
107
114
|
## Use it in CI
|
|
108
115
|
|
|
@@ -0,0 +1,58 @@
|
|
|
1
|
+
#!/usr/bin/env node
|
|
2
|
+
/**
|
|
3
|
+
* Friendly post-install banner. npm 10+ stopped echoing the package
|
|
4
|
+
* version ("added 1 package in 3s" is all the user sees), so this
|
|
5
|
+
* gives them a confirmation, the version they got, and where to go
|
|
6
|
+
* next. Stays quiet under CI / non-TTY / inside a parent npm install
|
|
7
|
+
* so it doesn't pollute logs.
|
|
8
|
+
*/
|
|
9
|
+
import { readFileSync } from "node:fs";
|
|
10
|
+
import { dirname, resolve } from "node:path";
|
|
11
|
+
import { fileURLToPath } from "node:url";
|
|
12
|
+
|
|
13
|
+
// Skip when noise would hurt more than help.
|
|
14
|
+
if (
|
|
15
|
+
process.env["CI"] !== undefined ||
|
|
16
|
+
process.env["ARCHIK_NO_BANNER"] !== undefined ||
|
|
17
|
+
!process.stdout.isTTY ||
|
|
18
|
+
// Inside `npm install` / yarn / pnpm of a host project — only
|
|
19
|
+
// show the banner for global installs and direct local installs.
|
|
20
|
+
process.env["npm_config_global"] !== "true" &&
|
|
21
|
+
process.env["npm_command"] === "install" &&
|
|
22
|
+
process.env["npm_config_save"] !== undefined
|
|
23
|
+
) {
|
|
24
|
+
process.exit(0);
|
|
25
|
+
}
|
|
26
|
+
|
|
27
|
+
const here = dirname(fileURLToPath(import.meta.url));
|
|
28
|
+
const pkg = JSON.parse(
|
|
29
|
+
readFileSync(resolve(here, "..", "package.json"), "utf8"),
|
|
30
|
+
);
|
|
31
|
+
|
|
32
|
+
const enabled = process.env["NO_COLOR"] === undefined;
|
|
33
|
+
const c = (open, close) => (s) =>
|
|
34
|
+
enabled ? `\x1b[${open}m${s}\x1b[${close}m` : s;
|
|
35
|
+
const bold = c("1", "22");
|
|
36
|
+
const dim = c("2", "22");
|
|
37
|
+
const cyan = c("36", "39");
|
|
38
|
+
const green = c("32", "39");
|
|
39
|
+
const magenta = c("35", "39");
|
|
40
|
+
|
|
41
|
+
const line = dim("─".repeat(56));
|
|
42
|
+
const tick = bold(green("✓"));
|
|
43
|
+
const arrow = cyan("▸");
|
|
44
|
+
|
|
45
|
+
process.stdout.write(
|
|
46
|
+
[
|
|
47
|
+
"",
|
|
48
|
+
line,
|
|
49
|
+
` ${tick} ${bold(magenta("archik"))} ${dim("v" + pkg.version)} ${dim("installed")}`,
|
|
50
|
+
line,
|
|
51
|
+
` ${arrow} ${bold("archik init")} ${dim("scaffold .archik/main.archik.yaml")}`,
|
|
52
|
+
` ${arrow} ${bold("archik dev")} ${dim("open the live canvas in your browser")}`,
|
|
53
|
+
` ${arrow} ${bold("archik --help")} ${dim("full command list")}`,
|
|
54
|
+
"",
|
|
55
|
+
` ${dim("Docs: https://npmjs.com/package/archik")}`,
|
|
56
|
+
"",
|
|
57
|
+
].join("\n"),
|
|
58
|
+
);
|