@nadicodeai/design-system 4.0.0 → 4.0.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.
Files changed (2) hide show
  1. package/AGENTS.md +24 -39
  2. package/package.json +1 -1
package/AGENTS.md CHANGED
@@ -1,50 +1,35 @@
1
1
  # @nadicodeai/design-system
2
2
 
3
- The `@nadicodeai/design-system` npm workspace. `DESIGN.md` is the normative contract for reusable design tokens and package output. The package ships tokens, the CSS kit (structural geometry plus framework-agnostic brand display components), and assets. Repo-only `examples/` specimens prove that public surface. Standard, interactive, and section UI ships as React components from `@nadicodeai/ui`, not from here. Paths here are relative to `packages/design-system/`. Run commands from this directory, or with `-w @nadicodeai/design-system` from the repo root.
3
+ The `@nadicodeai/design-system` npm workspace: `DESIGN.md` is the contract, the package ships tokens, CSS and assets, and `examples/` specimens prove them. React components ship from `@nadicodeai/ui`.
4
4
 
5
5
  ## Commands
6
6
 
7
- Proof follows [the repository pipeline](../../docs/agents/develop.md#the-pipeline):
8
- `npm run check -w @nadicodeai/design-system` and
9
- `npm run test -w @nadicodeai/design-system` before pushing. `check` carries the
10
- `DESIGN.md` contract lint, so a contract edit needs no separate command. This
11
- workspace has no app to boot: it ships a package, and `examples/` specimens are
12
- static HTML pages served from the repo root by
13
- `../../scripts/lib/static-design-server.ts`, which `npm run test:visual` starts.
14
-
15
7
  | Command | When |
16
8
  | --- | --- |
17
- | `npm run build -w @nadicodeai/design-system` | After any `DESIGN.md` edit. Regenerates every `dist/` artifact except `dist/favicon/` (tokens, Tailwind data, icons, complete CSS bundle) |
18
- | `npm run generate:icons -w @nadicodeai/design-system` | After bumping `lucide-static`. Rebakes `dist/icons/` (also runs inside `build`) |
19
- | `npm run generate:favicons -w @nadicodeai/design-system` | After a favicon source change. The output is git-tracked and the build does not regenerate it |
20
- | `npm run test:visual -w @nadicodeai/design-system` | Rendered CSS checks (`playwright.visual.config.ts`, `tests/visual/`), outside the browser-free default suite |
9
+ | `npm run check -w @nadicodeai/design-system` then `npm run test -w @nadicodeai/design-system` | Before pushing; `check` includes the `DESIGN.md` lint |
10
+ | `npm run build -w @nadicodeai/design-system` | After a `DESIGN.md` edit; regenerates `dist/` except `dist/favicon/` |
11
+ | `npm run generate:icons -w @nadicodeai/design-system` | After bumping `lucide-static` |
12
+ | `npm run generate:favicons -w @nadicodeai/design-system` | After a favicon source change |
13
+ | `npm run test:visual -w @nadicodeai/design-system` | Rendered CSS checks |
21
14
 
22
15
  ## Routing
23
16
 
24
- | Task | Go to |
17
+ | Topic | Path |
25
18
  | --- | --- |
26
- | Shared design-language terms | `CONTEXT.md` |
27
- | Colors, tokens, typography, layout doctrine, seam ownership, component semantics | `DESIGN.md` (read it before stating any of these) |
28
- | CSS layers, token pipeline, dark remaps, generated outputs, their guards | `DESIGN.md` "CSS Architecture & Token Pipeline". Decision history in `../../docs/adr/` |
29
- | Where a token is authored, and what the build publishes | The YAML front matter for the four schema groups, the one `json design-tokens` fence for everything the schema has no group for (`DESIGN.md` "Authored token extension"). `scripts/sd/design-tokens-fence.ts` reads the fence and `scripts/sd/compose-token-graph.ts` merges it with the CLI export into `dist/tokens/nadicode.dtcg.json` (aliases preserved) and `dist/tokens/nadicode.dtcg-resolved.json` (aliases replaced by values) |
30
- | Motion direction and runtime | `DESIGN.md` "Motion" for the direction and `core.motion` of the fence for the durations and easings, `src/css/motion.css` for the keyframes, the classes, and reduced motion, then the `product-design` skill for agent procedure |
31
- | Package exports | `package.json` (guard: `../../scripts/check-export-targets.mjs`, run by the root `build` script, so root `npm run check` and the post-merge suite, never the workspace `check` or the required gate) |
32
- | Static or non-React consumption | `README.md` |
33
- | React consumption | `../ui/docs/consuming-cross-repo.md` |
34
- | Logo hierarchy, usage, geometry, and asset delivery | `DESIGN.md` "Brand media authority". Static package routes in `README.md`. Implementation routes through `src/assets/`. `dist/` is generated, never hand-edited |
35
- | `examples/` specimen work | `examples/` plus the `write-clearly` skill for specimen copy (guard: `tests/guards/examples-package-coherence.test.ts`) |
36
- | Releasing a change to package-consumed output | `../../docs/agents/publish.md` |
37
- | Visual test implementation | `playwright.visual.config.ts` and `tests/visual/` |
38
-
39
- ## Boundaries
40
-
41
- - Never edit `dist/**` or `src/css/*.generated.css` by hand. The build-covered files regenerate from `DESIGN.md` via `npm run build`. No test guard catches a hand-edit. The fence is the cleanliness step in `.github/workflows/ci.yml`'s `design-system` job (why the guards cannot hold it, and the `dist/favicon/**` carve-out: `DESIGN.md` "Enforcement").
42
- - Token-only CSS: no raw color or radius literal in hand-authored `src/css/` or `examples/`, fallback-encoded or not. A new value enters `DESIGN.md` first (colors and the examples scan: `tests/guards/consumer-css-discipline.test.ts`; kit radius: `tests/guards/kernel-css-architecture.test.ts`).
43
- - Emitted-but-unreferenced contract tokens are intentional. Runtime aliases and compatibility variables are different: each must have a live caller or be removed (`DESIGN.md` "CSS Architecture & Token Pipeline").
44
- - `DESIGN.md` `## Components` is the semantic component catalog. CSS is its implementation, and `tests/guards/component-contract-matches-css.test.ts` derives the two-way fence without a copied inventory.
45
- - `DESIGN.md` stays contract-only and spec-shaped: check `npm exec --package=@google/design.md -- design.md spec` before changing YAML fields. Exact reusable values go in the YAML front matter where the schema has a group for them and in the one `json design-tokens` fence where it does not, application guidance in prose. Add a non-spec YAML field only when repo code or a test reads it (spec-shape don'ts: `DESIGN.md` "Do's and Don'ts").
46
- - Seams and grids are computed, single-owner, never eyeballed (doctrine home: `DESIGN.md` "## Layout" and "Seam Ownership").
47
- - Authoring is contract-first: a visual behavior comes from `DESIGN.md`, from our own shipped surfaces, or from an explicit user approval, never from another product's rendered output. Screenshots verify, they never author. Ask when the contract leaves a decision open, and stop and re-read `DESIGN.md` before a second visual patch to the same component.
48
- - Name everything as NadicodeAI-owned primitives. A source brand never appears in a name, a comment, a contract, or any living design document.
49
- - Any change to package-consumed output ends with an explicit release decision, a version bump or a `[no-publish]` commit marker (enforced by the pre-push release gate, procedure: `../../docs/agents/publish.md`).
50
- - The deleted `design-canvas/` prototypes and static chat/autoplay surface live only in git history. `src/css/motion.css` owns shared runtime motion primitives. Never reconstruct the prototypes or add a runtime JS surface.
19
+ | Design-language terms | `CONTEXT.md` |
20
+ | Colors, tokens, typography, layout, seams, components | `DESIGN.md` |
21
+ | CSS layers, token pipeline, dark remaps, generated outputs | [CSS Architecture & Token Pipeline](DESIGN.md#css-architecture--token-pipeline); decisions in `../../docs/adr/` |
22
+ | Where a token is authored | the `DESIGN.md` front matter and its `json design-tokens` fence, built by `scripts/sd/design-tokens-fence.ts` and `scripts/sd/compose-token-graph.ts` |
23
+ | Motion | [Motion](DESIGN.md#motion), `src/css/motion.css`, then `product-design` |
24
+ | Package exports | `package.json`; guard `../../scripts/check-export-targets.mjs` |
25
+ | Static consumption | `README.md`. React: `../ui/docs/consuming-cross-repo.md` |
26
+ | Logo forms and asset delivery | [Brand media authority](DESIGN.md#brand-media-authority); sources in `src/assets/` |
27
+ | `examples/` specimens | `examples/`; copy through `write-clearly` |
28
+ | Visual tests | `playwright.visual.config.ts`, `tests/visual/` |
29
+ | Releasing | `../../docs/agents/publish.md` |
30
+
31
+ ## Rules
32
+
33
+ - Never edit `dist/**` or `src/css/*.generated.css` by hand; `npm run build` regenerates them from `DESIGN.md`.
34
+ - Authoring is contract-first: a visual behavior comes from `DESIGN.md`, a shipped surface, or an explicit approval; screenshots verify, never author.
35
+ - Name everything as a NadicodeAI-owned primitive; no source brand in a name, comment, or contract.
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@nadicodeai/design-system",
3
- "version": "4.0.0",
3
+ "version": "4.0.1",
4
4
  "type": "module",
5
5
  "publishConfig": {
6
6
  "access": "public"