Revert the UI kit and AI design guidance work (#1414)

[vivek7405]

Problem

#1414 added two design exemplars to the gallery, app/examples/dashboard and app/examples/settings, and listed them under Example Apps on the gallery home beside the optimistic todo app.

They do not belong there. An Example App in this gallery means a composed feature with real persistence, which is what the todo app is: a database, actions, queries, and a hydrating component. The dashboard and settings screens are single static screens with derived in-memory data, written to demonstrate hierarchy and grouping rather than any framework capability. Listing them as peers of the todo app misrepresents both.

Remove them entirely rather than recategorising. The design guidance they were written to reinforce ships independently in .agents/skills/webjs/references/design.md and design-depth.md, and the six primitives ship in @webjsdev/ui, so nothing else depends on these two screens existing.

Design / approach

Delete the routes and their modules, then unwind the four surfaces that reference them. The surfaces are coupled by a repo-health test, so a partial removal fails rather than silently drifting, which is the behaviour to rely on here.

test/repo-health/skill-gallery-intent-parity.test.mjs asserts a three-way equality between the demo directories on disk, the entries in gallery/modules/gallery/nav.ts, and the rows in the SKILL.md cheat sheet. Removing the directories without the other two fails that test immediately, so run it early rather than at the end.

Also drop the five now-unused component copies under gallery/components/ui/. The gallery copies a kit component in only when a demo uses it, and after this deletion stat.ts, page-header.ts, field-group.ts, description-list.ts and timeline.ts are referenced by nothing. empty-state.ts STAYS: app/page.ts and app/features/frames/page.ts both use it, both added in #1414.

Keep the gallery's semantic role and elevation tokens in app/layout.ts and public/input.css. They mirror the registry theme vocabulary rather than serving these two screens, and an app whose theme block diverges from the kit it copies from is the drift that motivated them.

Implementation notes (for the implementing agent)

Where to edit.

• Delete gallery/app/examples/dashboard/ (page.ts) and gallery/app/examples/settings/ (page.ts).
• Delete gallery/modules/dashboard/ (queries/get-dashboard.server.ts, types.ts) and gallery/modules/settings/ (actions/save-settings.server.ts, types.ts).
• Delete gallery/components/ui/{stat,page-header,field-group,description-list,timeline}.ts. Do NOT delete empty-state.ts.
• gallery/modules/gallery/nav.ts L85-86: remove the two EXAMPLES entries. Leave the todo entry.
• .agents/skills/webjs/SKILL.md L70-71: remove the two cheat-sheet rows in the "Reach For The Right Primitive" table whose Demo column is app/examples/dashboard / app/examples/settings.
• packages/cli/templates/scripts/clear-gallery.mjs L83-88: remove 'dashboard' and 'settings' from galleryModules.
• test/scaffolds/scaffold-gallery.test.js L34-39 and L43: restore EXAMPLE_APPS to ['todo'], drop dashboard / settings from MODULE_ROUTES, and remove the comment added above EXAMPLE_APPS explaining why the exemplars were covered.

Landmines.

• The intent-parity test (test/repo-health/skill-gallery-intent-parity.test.mjs) enforces disk == nav == cheat sheet. Miss any one of the three and it fails; that is the guard working, not a new bug.
• gallery/app/page.ts and gallery/app/features/frames/page.ts import from #components/ui/empty-state.ts. Deleting that file breaks both routes at module load. It is the one of the six to keep.
• webjs check must be run from INSIDE the app, never the repo root (webjs check at the monorepo root reports 61 false violations #1301): ( cd gallery && npx webjs check ).
• The gallery dev server needs a migrated db/dev.db; a fresh worktree has none, so npm run worktree:link seeds it. Unrelated to this change but it is how /examples/todo 500s if skipped.
• Do not touch the design references, the six registry primitives in packages/ui, the theme tokens, or anything under website/. The deletion is scoped to the gallery demos and the four surfaces that index them.

Invariants to respect.

• AGENTS.md invariant 9: no backtick inside an html template body. This bit feat: make the UI kit and AI design guidance first class #1414 twice while editing these files.
• The scaffold gallery is payload an app owns after gallery:clear, so the clear list and the demo set must stay in step (AGENTS.md, scaffold sync).

Tests and docs.

• test/repo-health/skill-gallery-intent-parity.test.mjs and test/scaffolds/scaffold-gallery.test.js are the two that must pass.
• node scripts/eval-design.mjs gallery must still score 0 on all nine lines; the empty branches that earned that are in app/page.ts and features/frames/page.ts, neither of which is being deleted.
• No docs-site or README change: neither screen is referenced outside the four surfaces above.

Acceptance criteria

• gallery/app/examples/ contains only todo and layout.ts
• gallery/modules/ contains no dashboard or settings directory
• The gallery home lists only the todo app under Example Apps
• gallery/components/ui/empty-state.ts survives; the other five copies are gone
• test/repo-health/skill-gallery-intent-parity.test.mjs passes
• test/scaffolds/scaffold-gallery.test.js passes, with EXAMPLE_APPS back to ['todo']
• ( cd gallery && npx webjs check ) and npx webjs typecheck are clean
• node scripts/eval-design.mjs gallery still reports 0 across all nine rubric lines
• The gallery boots and /, /examples/todo and /features/frames return 200

[vivek7405]

Scope widened: the six primitives come out too, not just the gallery screens

The original scope was the two gallery example screens. On review the six primitives added alongside them are also going, because each composes from what the kit already has rather than earning a registry entry.

field-group was the one genuine question, so here is the assessment. Seven helpers, five of which are one-line class strings already covered: fieldGroupClass() returns grid gap-4, which is stackClass({ gap: 4 }); inputGroupTextClass() is byte-identical to hintClass(); fieldSetClass(), fieldLegendClass() and fieldErrorClass() are plain class lists. Only inputGroupClass() and inputGroupAddonClass() carry anything, and it is one technique: moving the focus ring off the inner input onto the wrapper with focus-within:, plus [&>input]:focus-visible:ring-0 and a has-[[aria-invalid=true]]: error state. That is ten classes, not a component, and the duplication with hintClass() is exactly the drift a thin component causes.

So it goes with the rest. The focus-ring technique is worth keeping as prose in references/design.md rather than as a component.

One coupling this forces, worth stating because it is not obvious: the design scorer's empty-state rule keys on emptyStateClass( to decide whether a list has an empty branch. With the component gone that rule has to detect the branch structurally instead, which is a better rule anyway, since it stops the check depending on one component's name.