@imfusion/web-ui 0.5.1-dev.18.g81350f83 → 0.5.1-dev.2.g0a349a2a

package/src/llms/skills/imf-web-ui-frontend-conventions/references/docs-structure.md

@@ -1,44 +0,0 @@
-# Documentation structure
-
-What a repo documents, where, and how it's written. `imf-web-ui-frontend-setup` scaffolds this shape from its `templates/`
-and audits it.
-
-## The shape
-
-```
-<app>/
-  README.md            # humans: what the app is, setup, scripts
-  AGENTS.md            # agents: stack, pointers into docs/ — restates nothing
-  docs/
-    index.md           # registers every doc with a one-line "covers" summary
-    <topic>.md         # repo-unique content only
-```
-
-## Repo docs hold only what is unique to the repo
-
-The litmus, applied sentence by sentence: **would this be true in every ImFusion frontend? Then it's baseline — it lives in
-the installed skill references, don't restate it.** The baseline is already in the repo, vendored under
-`.agents/skills/imf-web-ui-frontend-conventions/`, human-readable and versioned.
-
-Where the repo deviates from the baseline, the doc says so as a **named deviation** — what the baseline prescribes, what this
-repo does instead, and why. A deviation written as freestanding convention gets copied into the next repo as if it were house
-style.
-
-## How docs are written
-
-- **Docs explain concepts; code is the source of truth for facts.** A doc captures the why — invariants, rationale,
-  decisions. It never restates a fact that lives in code (a script definition, a type shape, a config value): point at the
-  file instead. A copied fact rots the moment the code changes.
-- **State what is — no decision residue.** Positive, present-tense statements about the current state. Never narrate the
-  delta from a past decision or refute alternatives nobody raised ("there is no X mode", "Y was dropped") — that history
-  belongs in commits and tickets. A negation earns its place only as a guardrail or to preempt a wrong assumption a present
-  reader would actually arrive at.
-- **Boy Scout rule.** Discovered rot — a stale pointer, a doc contradicting the code — is always your responsibility: fix it
-  in place if trivial, otherwise report it. The two failure modes are equal: stepping over rot, and cramming unrelated
-  cleanup into an unrelated change.
-
-## Staleness at commit time
-
-Docs are checked when they can go stale: at the commit. A staged change that invalidates a doc — a renamed script, a moved
-folder, a changed flow — updates that doc **in the same commit**, not in a follow-up. Pre-commit carries the advisory
-staleness checks (vendored baseline, docs) — the mechanics are in [git.md](git.md).

package/src/llms/skills/imf-web-ui-frontend-conventions/references/git.md

@@ -1,33 +0,0 @@
-# Git
-
-## git:config
-
-One script holds the repo's git configuration, run by hand once per clone (the README names it):
-
-```
-git config core.hooksPath .githooks && git config pull.rebase true && git config merge.ff only
-```
-
-Hooks live in a tracked directory; history strategy doesn't depend on personal git config. Two silent failure modes to check
-for: `git:config` never run (hooks exist only on the machine that configured by hand), and `core.hooksPath` pointing at a
-directory that doesn't exist. Config **and** directory.
-
-## Verify scopes
-
-Two blocking, one advisory:
-
-- **staged** — `verify:staged`, called by the pre-commit hook: lint, format, restage. Fast; a passing commit is not CI green.
-- **full** — `verify:full`: the build plus every `verify:*` check. What CI runs.
-- **files** — post-edit agent hook. Advisory, never exits non-zero, so a mid-flight refactor can't trap the agent.
-
-One script owns each scope's step list; npm scripts and hooks only launch them. Name by depth, not by occasion — a
-`preflight` needs explaining and invites a near-identical sibling, and two of those drift into "passes locally, fails in CI".
-
-## Staleness at commit time
-
-Pre-commit also runs the advisory staleness checks — warn, never block:
-
-- **Vendored baseline** — `.agents/hooks/imf-web-ui/baseline-staleness.sh` compares the installed `imf-web-ui-*` skill
-  markers against the installed package version; the fix it names is `npx web-ui-install`.
-- **Docs** — a staged change that invalidates a doc updates that doc in the same commit
-  ([docs-structure.md](docs-structure.md)). Where the repo has an agent commit workflow, a staged docs audit belongs in it.

package/src/llms/skills/imf-web-ui-frontend-conventions/references/library-boundary.md

@@ -1,37 +0,0 @@
-# Library boundary
-
-The contract between an app and `@imfusion/web-ui`.
-
-## Stay behind the library
-
-Never import Base UI (or any other upstream the library wraps) directly — no upstream stylesheets, no upstream components,
-even when upstream docs show it that way. Everything a component needs ships in `@imfusion/web-ui`. If the library is missing
-something upstream has, report the gap (see `imf-web-ui-components`); don't reach around it.
-
-## Wrap primitives when the app has a reason to
-
-When the app keeps repeating something around a primitive — default props, a styling override, a composition, an
-accessibility refinement, a restriction of the API — wrap it once in an app-level dumb component and use that. The wrapper
-derives its props from the primitive (`React.ComponentProps<typeof Button>`, narrowed or extended), lives in `components/`
-like any other dumb component ([components.md](components.md)), and styles itself through the sanctioned seams — it never
-reaches into the library's internals.
-
-Two rules keep wrappers honest:
-
-- Wrap for a reason — any repeated adaptation counts. A wrapper that only renames a primitive is indirection with no payoff.
-- Components marked `experimental` in the identity index get wrapped **always**, even with nothing added yet — a breaking
-  upstream change then lands in one file instead of every call site.
-
-## Derive types, don't import them
-
-Prop types come from the components themselves: `React.ComponentProps<typeof Button>`. The library deliberately exports no
-`Props` types — don't look for them, and don't re-declare prop shapes by hand.
-
-## Integrations own their peers
-
-Components under `@imfusion/web-ui/integrations/*` depend on optional peers (e.g. `@tanstack/highlight` for `CodeHighlight`).
-Add the peer explicitly to the consumer's `package.json` — never rely on hoisting.
-
-## Styling crosses the boundary through seams
-
-Tokens in, sanctioned selectors at the edge, never the library's internals — the full contract is [styling.md](styling.md).

package/src/llms/skills/imf-web-ui-frontend-conventions/references/npm-project.md

@@ -1,57 +0,0 @@
-# npm project
-
-How the npm side of an ImFusion frontend is structured: `package.json`, scripts, dependencies. `imf-web-ui-frontend-setup`
-audits against this file.
-
-## package.json
-
-The exemplary shape:
-
-```jsonc
-{
-  "name": "@imfusion/scan-review",
-  "type": "module",
-  "private": true, // only when the package is not meant to be published
-  "engines": { "node": ">=22" },
-  "imports": { "#/*": "./src/*" }
-}
-```
-
-- `"type": "module"` always.
-- `"private": true` for apps that never publish; a publishable package drops it.
-- Node pinned via `engines.node` or `.nvmrc` — not a personal version manager's config.
-- The `#/` alias wired through `imports` ([project-structure.md](project-structure.md)).
-
-## Scripts
-
-Same name, same meaning, every repo — "what can I run to check this?" is answered by tab-completing `verify:`.
-
-| Script             | Runs                                                                  |
-| ------------------ | --------------------------------------------------------------------- |
-| `dev`              | dev server                                                            |
-| `build`            | production build                                                      |
-| `verify:deps`      | exact-pin check over `dependencies` and `devDependencies`             |
-| `verify:format`    | `prettier --check .`                                                  |
-| `verify:lint`      | `eslint . --cache --max-warnings=0`                                   |
-| `verify:typecheck` | `tsc --noEmit` (or `tsc -b --noEmit` in a project-references setup)   |
-| `verify:tests`     | `vitest run`                                                          |
-| `verify:staged`    | staged-file subset, called by the pre-commit hook                     |
-| `verify:full`      | every `verify:*` check plus the build; what CI runs                   |
-| `format`           | `prettier --write .`                                                  |
-| `lint`             | `eslint . --cache --fix`                                              |
-| `git:config`       | see [git.md](git.md); run by hand once per clone, named in the README |
-
-Two rules generate the names:
-
-- **Every check is `verify:*`.** One namespace for everything that reads and reports.
-- **Write-mode scripts keep the tool name.** `format` and `lint` change files, which isn't verifying — no prefix, no `:fix`
-  suffix.
-
-`verify:staged` is fast and partial; a passing commit is not CI green. `verify:full` is the CI gate.
-
-## Dependencies
-
-- **Pinned exactly.** No `^`, `~`, or `latest`, in `dependencies` and `devDependencies` alike. `verify:deps` catches drift;
-  `save-exact=true` in `.npmrc` prevents it.
-- **`ignore-scripts=true` in `.npmrc`.** Blocks lifecycle scripts on install (the supply-chain vector). Setup that matters is
-  a command someone runs, not a hook that fires on install.

package/src/llms/skills/imf-web-ui-frontend-conventions/references/project-structure.md

@@ -1,21 +0,0 @@
-# Project structure
-
-Kebab-case throughout, folders and files alike. Exported symbols stay PascalCase — only the filename is kebab.
-
-```
-src/
-  routes/          # TanStack Router file-based routes; routing only — they compose, they don't fetch inline
-  api/             # one folder per API topic — layout and behaviour in data.md
-  components/      # grouped by kind — anatomy in components.md
-  http/            # transport: client, error normalisation — the only transport-aware place (data.md)
-  lib/             # framework-free helpers
-```
-
-Each subtree's own rules live with its topic: [data.md](data.md) for `api/` and `http/`, [components.md](components.md) for
-`components/`.
-
-## Imports
-
-The `#/` alias for anything outside the current folder, plain `./` for siblings. The alias is always `#/` → `src/` — `#` is
-Node's own subpath-import prefix, so it can't collide with an npm scope. Wire it once, through `package.json`'s `imports`
-field where the toolchain resolves it natively, with a matching tsconfig `paths` entry.

package/src/llms/skills/imf-web-ui-frontend-conventions/references/stack.md

@@ -1,39 +0,0 @@
-# Stack
-
-The topic→tool map for an ImFusion frontend. Check this before adding a dependency; check the TanStack suite before adding a
-non-TanStack one.
-
-| Topic                 | Tool                                                                                                  |
-| --------------------- | ----------------------------------------------------------------------------------------------------- |
-| Build                 | [Vite](https://vite.dev)                                                                              |
-| Routing, URL state    | [TanStack Router](https://tanstack.com/router) — file-based, type-safe search params                  |
-| Server state          | [TanStack Query](https://tanstack.com/query) — the pattern around it is [data.md](data.md)            |
-| Forms                 | [TanStack Form](https://tanstack.com/form)                                                            |
-| Data grids            | [TanStack Table](https://tanstack.com/table) + web-ui's styled `Table` parts                          |
-| App-wide client state | [TanStack Store](https://tanstack.com/store) — last resort in the state ladder ([react.md](react.md)) |
-| Schema validation     | [Zod](https://zod.dev) — at the network boundary ([data.md](data.md))                                 |
-| Styling               | CSS Modules ([styling.md](styling.md))                                                                |
-| Test                  | [Vitest](https://vitest.dev)                                                                          |
-| Format                | [Prettier](https://prettier.io) — values in [tooling.md](tooling.md)                                  |
-| Lint                  | [ESLint](https://eslint.org) flat config ([tooling.md](tooling.md))                                   |
-| Types                 | `tsc --noEmit` — own script, own CI step                                                              |
-| Staged files          | [lint-staged](https://github.com/lint-staged/lint-staged) (or nano-staged, drop-in)                   |
-| Dead code             | [knip](https://knipjs.dev) — needs per-repo config                                                    |
-
-## Devtools come with the library
-
-Every TanStack library that ships a devtools package gets it as a dev dependency, mounted in development only. Router is a
-given, so `@tanstack/react-router-devtools` is a given too; Query's goes in when Query does. Look for a `-devtools` sibling
-whenever you add a TanStack dependency — the set grows, and not every library has one yet. Once a project has several,
-`@tanstack/devtools` hosts them in one panel.
-
-## When a library owns a layer
-
-A library owns the layer once you find yourself rebuilding what it does: validation timing and cross-field rules (Form),
-caching and refetching (Query), URL as the source of truth (Router), sorting and pagination over rows (Table). Adding the
-library mid-project is normal and cheap; unpicking a hand-rolled version later is not.
-
-## Docs over memory
-
-`npx @tanstack/cli` for TanStack docs — never work from memory. Where a project has wired up `@tanstack/intent`, use it to
-reach the Agent Skills its TanStack dependencies ship, and read those too.

package/src/llms/skills/imf-web-ui-frontend-conventions/references/styling.md

@@ -1,91 +0,0 @@
-# Styling
-
-**CSS Modules with native CSS by default** — nesting and custom properties are the DRY mechanism; no Sass, no CSS-in-JS, no
-utility-class framework. Where the stylesheet lives and who owns one is [components.md](components.md).
-
-- **Nest pseudo-elements, states, and child selectors under the root** so a selector prefix is written once:
-
-  ```css
-  .root {
-    transition: clip-path var(--ease);
-    &:focus-visible {
-      outline: var(--imf-ui-border-size-2) solid var(--imf-ui-color-fg-support);
-    }
-    &[data-disabled] {
-      opacity: 0.5;
-    }
-  }
-  ```
-
-- **Lift a repeated literal into a custom property** (an easing, a colour-math result) and reference it. Custom properties
-  also carry per-state/per-variant values down the tree — the parameterisation a mixin would provide, done natively.
-- Don't "merge" rules that only look similar. Structurally different output (three distinct `clip-path` polygons) isn't
-  repetition a mixin can remove. Keep it explicit.
-
-## Build custom UI from tokens
-
-Anything you build that the library doesn't cover — a stat widget, a custom panel — uses `--imf-ui-*` variables for color,
-spacing, radius, and type instead of hardcoded values. That's what makes custom UI look native next to library components,
-and what keeps it correct when the theme changes. A hex code or a magic `px` next to a concept the tokens already name is a
-defect.
-
-Geometry that can't be a token (a clip-path percentage, a hairline `1px`) lives in a named custom property at the top of the
-stylesheet, with the invariant written next to it. Don't silently approximate to the nearest token.
-
-## Override through the sanctioned seams
-
-All library styles live in the `imf-ui.components` CSS layer, so **any plain selector you write wins** — that's the whole
-override contract:
-
-- Target the stable hooks: `data-imf-ui-component` attributes and your own classes/wrappers.
-- Never target the library's internal class names — they are generated and change without notice.
-- Never `!important` — if you think you need it, you're targeting the wrong thing.
-- **Style against state via data attributes** (`[data-checked]`, `[data-disabled]`, `[data-popup-open]`) — components expose
-  their state there, so you never maintain your own state classes. `className` is purely a styling surface:
-
-  ```css
-  [data-imf-ui-component="Switch"][data-checked] {
-    outline: 2px solid var(--imf-ui-color-bg-positive);
-  }
-  ```
-
-## The color system
-
-The color roles you can name: **surfaces** (`main` the canvas, `support` panels, `minor` popovers), **brand** (identity, full
-saturation) vs **primary** (contrast-tuned, CTAs — distinct roles on purpose), **status** (`negative`, `warning`, `positive`,
-`info`), and three **accent** slots.
-
-Two layers:
-
-- **Controls** are the 80/20 customization surface — override one and every derived token shifts:
-
-  ```css
-  :root {
-    --imf-ui-color-primary-hue: 30; /* every primary semantic token follows */
-  }
-  ```
-
-- **Semantic tokens** are what you consume in your own CSS: `--imf-ui-color-bg-{name}` per role, a flat
-  `--imf-ui-color-fg-{main|support|minor|oncolor|…}` ladder for text. Borders and rings draw from the `fg-*` space.
-
-Rules of thumb: if you push a hue control into a pale corner, you own overriding the matching `fg-*` token; the color scheme
-is `<html data-imf-ui-color-scheme="light|dark">` (the provider sets it) — scheme-specific styling selects via that
-attribute.
-
-## Responsive styling
-
-- **Tune components per breakpoint by overriding their `--imf-ui-*` variables inside your own media queries** — custom
-  properties cross the `@media` boundary, props don't. That's why components expose sizing as variables instead of a `width`
-  prop:
-
-  ```css
-  @media (min-width: 768px) {
-    .my-shell {
-      --imf-ui-appshell-navbar-width: 22rem;
-    }
-  }
-  ```
-
-- **Write literal breakpoint values.** The library's `@custom-media` aliases are build-internal and don't ship.
-- **JS only for behaviour** (render a burger menu on mobile): `useMediaQuery(minWidth("md"))`. Never for styling CSS can do.
-- **No responsive props.** `size={{ sm: … }}` objects are deliberately not offered — write the media query.

package/src/llms/skills/imf-web-ui-frontend-conventions/references/testing.md

@@ -1,16 +0,0 @@
-# Testing
-
-Test the **decisions**, not the rendering.
-
-- **Pure logic gets unit tests** — pricing, permissions, date math, parsing, reducers. These are cheap, fast, and the place
-  bugs actually hide.
-- **Presentational components generally don't.** A component that maps props onto web-ui primitives has no logic of its own;
-  asserting that it rendered a `<Button>` tests React, not your code.
-- **Behaviour a user performs gets an interaction test** — a form that validates, a flow with steps. Test it through the
-  interface the user has (roles, labels, visible text), not through internals.
-- **Extract the decision out of a hook and test that.** A hook whose interesting part is a plain function is easier to test
-  as a plain function than through a render harness. A hook that only wraps a browser API has no decision to extract.
-
-The data layer has its own recipe — stub `fetch`, run the real query client — in [data.md](data.md).
-
-The measure isn't coverage percentage. It's whether a test failing tells you something you didn't already know.

package/src/llms/skills/imf-web-ui-frontend-conventions/references/tooling.md

@@ -1,76 +0,0 @@
-# Tooling config
-
-The config baselines for the tools in [stack.md](stack.md). Prefer typed config (`.ts` over `.json`) where the tool supports
-it.
-
-## Prettier
-
-Config file shape is free (`.prettierrc`, `prettier.config.ts`); the values are not:
-
-```ts
-import type { Config } from "prettier";
-
-const config: Config = {
-  printWidth: 125,
-  tabWidth: 2,
-  useTabs: false,
-  trailingComma: "none",
-  arrowParens: "avoid",
-  semi: true,
-  singleQuote: false,
-  proseWrap: "always"
-};
-```
-
-No config file means Prettier runs on defaults — the values silently differ.
-
-## ESLint
-
-Flat config (`eslint.config.ts`):
-
-- `strictTypeChecked` + `stylisticTypeChecked`, `projectService: true`
-- `as` and `!` banned outside tests (`consistent-type-assertions`)
-- `.gitignore` as the ignore source (`includeIgnoreFile` from `@eslint/compat`) — ignores aren't maintained twice
-- The `#/` alias enforced via `no-restricted-imports` banning the `../*` pattern — parent-relative paths error, siblings
-  (`./`) stay relative ([project-structure.md](project-structure.md))
-
-## tsconfig
-
-```jsonc
-{
-  "compilerOptions": {
-    "strict": true,
-    "moduleResolution": "bundler",
-    "verbatimModuleSyntax": true, // import type stays import type
-    "noUnusedLocals": true,
-    "noUnusedParameters": true,
-    "noFallthroughCasesInSwitch": true,
-    "noUncheckedSideEffectImports": true,
-    "skipLibCheck": true,
-    "paths": { "#/*": ["./src/*"] }
-  }
-}
-```
-
-The `#/` → `src/` alias and its rationale: [project-structure.md](project-structure.md).
-
-## Staged files
-
-Runner config (lint-staged or nano-staged) applying eslint `--fix` and prettier `--write` to staged files only.
-
-## CSS class names
-
-Generated CSS Module class names are readable in the DOM, `{prefix}-{file}-{local}`, never the default hash. A legible DOM is
-what makes devtools and browser automation usable. The library ships the plugin that produces them; pass your own short,
-app-scoped prefix:
-
-```ts
-import { readableCssModuleNames } from "@imfusion/web-ui/build/vite-css-module-names";
-
-export default defineConfig({
-  plugins: [react(), readableCssModuleNames({ prefix: "acme" })]
-});
-```
-
-One pattern for dev, Storybook, and production. Register the plugin in **every** tool that compiles the CSS — a compiler left
-out generates different names for the same source file, and its styles silently don't apply.

package/src/llms/skills/imf-web-ui-frontend-conventions/references/typescript.md

@@ -1,45 +0,0 @@
-# TypeScript & code style
-
-Functional by default: pure functions over stateful classes, immutable data over in-place mutation, expressions over
-statements, side effects at the edges (network, DOM, store).
-
-## Types
-
-- No `any`. `unknown` at a boundary you can't type, narrowed before use.
-- Infer locals; annotate contracts. Exported functions get an explicit return type.
-- No temporal coupling — model the states instead of initialising `null` and filling in later.
-- Avoid `as`. Fix the type. The honest exception: an untyped third-party boundary, kept at the boundary.
-- Derive, don't duplicate:
-
-```ts
-const sizes = ["sm", "md", "lg"] as const;
-type Size = (typeof sizes)[number];
-
-const labels: Record<Size, string> = { sm: "S", md: "M", lg: "L" }; // compiler breaks if `sizes` changes
-```
-
-Across boundaries the same rule: library props via `React.ComponentProps<typeof Button>`
-([library-boundary.md](library-boundary.md)), API types via `z.infer` ([data.md](data.md)).
-
-- Function signatures: 1–2 positional arguments; at 3+, one destructured object.
-
-## Immutability & expressions
-
-- Array methods before loops — `map`, `filter`, `find`, `some`, `flatMap` name what they do:
-
-```ts
-const activeNames = users.filter(u => u.isActive).map(u => u.name);
-```
-
-- Produce new values: spreads and `structuredClone` over in-place edits, `toSorted`/`toReversed` over `sort`/`reverse` (which
-  mutate their receiver).
-- Allowed exceptions: a genuine early exit (`for` + `break`), a measured hot loop.
-- Keep chains flat: 3–4 steps read well; longer wants named intermediates, and a `reduce` doing four things wants to be a
-  loop.
-
-## Naming
-
-- Say what it is, not what it's made of: `useUserQuery`, not `useUserHook`; `retryDelay`, not `num`.
-- Booleans read as assertions: `isOpen`, `hasAccess`, `canSubmit`.
-- Handlers: `onX` as props, `handleX` as implementations.
-- Match the vocabulary the product and the API already use — no synonyms for terms the backend named.

package/src/llms/skills/imf-web-ui-frontend-setup/SKILL.md

@@ -1,89 +0,0 @@
----
-name: imf-web-ui-frontend-setup
-description:
-  "Set up or audit an ImFusion frontend's project tooling: the stack, package.json scripts, formatting, linting, typecheck,
-  staged-file and pre-commit hooks, verification scopes, dependency pinning, tsconfig, docs structure, agent wiring. House
-  conventions, not industry standards. Load when starting a new ImFusion frontend, when asked what an existing one's setup is
-  missing, when asked to align a repo with the baseline, or when asked to check or set up one named topic from it (e.g. CSS
-  class names, Prettier). Not for a bare 'add this config file' request — that's just the edit. Not for wiring the library
-  itself (imf-web-ui-library-setup)."
-argument-hint: "[new|audit|align|<topic>]"
----
-
-# imf-web-ui-frontend-setup
-
-First-time setup and audit against the ImFusion frontend baseline. The conventions live in `imf-web-ui-frontend-conventions`
-— this skill is the process that checks a repo against them and wires up what they assume. In-house conventions, not industry
-standards: report findings as "missing against the ImFusion baseline", never "against best practice". Built for ImFusion
-frontends; anyone else who likes the baseline can run it too.
-
-Four modes, same checklist:
-
-- **New project** — work down the checklist and set each piece up.
-- **Audit** — read the repo (don't ask what it has), report present / missing / broken, change nothing until the human picks.
-  An established repo is where a forgotten piece hides. **The project wins:** where the repo already decided, that stands —
-  report what's _absent_; a working convention you'd have chosen differently is not a finding.
-- **Align** — when the user asks to _align_ the repo with the baseline ("align"/"alignment" is the flag), the project-wins
-  guard lifts: deviations become migration findings, proposed as a plan, still nothing changed until approved.
-- **One topic** — any other argument names a topic instead of a mode (`class names`, `prettier`, `tooling`). Resolve it to
-  the checklist rows it touches and run the audit process against those only, reading their references as usual. Say which
-  rows you resolved it to before reporting, and if nothing matches, say so and list the rows rather than guessing or sweeping
-  everything. Same output as an audit: findings, nothing changed until the human picks.
-
-**Producer scope.** The web-ui repo itself produces this baseline; it is not a consumer frontend. Consumer-only rows — the
-AGENTS.md fence, vendored-skill staleness, the app stack and app `src/` tree — don't apply there. Audit it against the shared
-rows only: scripts, tooling, git, docs.
-
-## The checklist
-
-Each row is a reference in `../imf-web-ui-frontend-conventions/references/` — read it, then check the repo against it. A
-topic argument narrows this table to the rows it names; every other mode works down all of it.
-
-| Reference              | Set up / audit                                                                              |
-| ---------------------- | ------------------------------------------------------------------------------------------- |
-| `stack.md`             | the dependencies match the topic→tool map; devtools siblings present                        |
-| `npm-project.md`       | script names table, `type`/`private`, exact pins, `.npmrc`, Node pinning                    |
-| `tooling.md`           | Prettier values, ESLint flat config, tsconfig, staged-file runner, readable CSS class names |
-| `git.md`               | `git:config` run and hooks directory present, verify scopes, staleness hooks                |
-| `project-structure.md` | the `src/` tree, file naming, `#/` alias wiring                                             |
-| `components.md`        | component folders and colocation                                                            |
-| `styling.md`           | CSS Modules, tokens, no CSS-in-JS or utility framework                                      |
-| `docs-structure.md`    | docs shape and content rules (see Docs below)                                               |
-| — agent tooling        | delegated to `imf-web-ui-agent-setup` (see Agent tooling below)                             |
-
-## Docs
-
-`README.md`, `AGENTS.md`, and `docs/` with a `docs/index.md` that registers every doc. Scaffold from
-[`templates/README.md`](templates/README.md) and [`templates/AGENTS.md`](templates/AGENTS.md); missing structure is a
-finding.
-
-Keep `AGENTS.md` lean. The decision test for every line: would the agent make a costly mistake without it? If it would just
-need to read a file first, cut it — dev commands, path aliases, and tool config are discoverable from the files themselves.
-
-`AGENTS.md` contains one installer-owned section: the `<!-- imf-web-ui:begin -->` … `<!-- imf-web-ui:end -->` fence.
-`npx web-ui-install` refreshes what's inside on every skills install; everything outside the fence is the repo's own. A
-missing fence in an existing `AGENTS.md` is a finding — without it the baseline note can't be kept current.
-
-Judge existing docs only against `docs-structure.md`: repo-unique content stays, restated baseline becomes a pointer,
-deviations get named as deviations. Don't rewrite a repo's docs uninvited — report, and let the human pick.
-
-## Agent tooling
-
-The agent side — vendored skills and their freshness, the lifecycle hooks, the settings registrations — is
-`imf-web-ui-agent-setup`. Delegate to it: in a new project after the docs step, in an audit as one checklist row (skills
-present and current, hooks wired or consciously adapted). Findings it produces report here like any other.
-
-## Optional
-
-Recommend when the shape calls for it; absence is not a finding.
-
-- **knip** — once several people delete things independently.
-- **`eslint-plugin-jsx-a11y`** — anything user-facing.
-
-Out of scope, project-specific: CI, env and secrets, error tracking, deploy, dependency updates.
-
-## Not this skill
-
-- Library wiring (styles import, provider) → `imf-web-ui-library-setup`
-- The conventions themselves → `imf-web-ui-frontend-conventions` and its references — this skill checks the structure exists,
-  that skill owns what goes inside it

package/src/llms/skills/imf-web-ui-frontend-setup/templates/AGENTS.md

@@ -1,34 +0,0 @@
-# AGENTS.md
-
-<Keep this file lean — target ~50 lines. Decision test for every line: would the agent make a costly mistake without it? If
-it would just need to read a file first, cut it. Dev commands, path aliases, and tool config are discoverable from the files
-themselves.>
-
-<One paragraph: what the app is and the stack in one line.>
-
-Scripts, deps, and setup: [`README.md`](./README.md) and [`package.json`](./package.json) are the source of truth. Check the
-`package.json` scripts before running or suggesting a command — don't infer one exists by pattern-matching a sibling.
-
-## Read before you write
-
-<One bullet per doc in docs/, each with when to read it, e.g.:>
-
-- [`docs/<topic>.md`](./docs/<topic>.md) — <what it covers>. Read before <the change it governs>.
-
-[`docs/index.md`](./docs/index.md) registers all of them.
-
-## Working here
-
-<The fenced block below is the only part of this file `npx web-ui-install` touches: its content comes from this template and
-is refreshed on every skills install. Everything else in the file is scaffolded once by the setup skill and then owned by the
-repo.>
-
-<!-- imf-web-ui:begin — managed by `npx web-ui-install`; edits inside the fence are overwritten -->
-
-`.agents/skills/imf-web-ui-*` is vendored from `@imfusion/web-ui` and resynced with `npx web-ui-install`. Don't edit it and
-don't put repo conventions there. Load the matching `imf-web-ui-*` skill before writing code, styles, data fetching, or docs;
-repo docs hold only what is unique to this repo.
-
-<!-- imf-web-ui:end -->
-
-<Repo-specific agent guidance: generated files that are committed, tools to verify APIs against, things never to touch.>

package/src/llms/skills/imf-web-ui-frontend-setup/templates/README.md

@@ -1,27 +0,0 @@
-# <App name>
-
-<One paragraph: what the app is, the stack in one line — e.g. "Vite + React 19 + TanStack Router (file-based, CSR) + TanStack
-Query + @imfusion/web-ui".>
-
-## Install
-
-```bash
-npm install
-npm run git:config   # once per clone: hooks path, pull.rebase, merge.ff
-```
-
-<Registry tokens, required services, or other one-time setup. Delete if none.>
-
-## Usage
-
-```bash
-npm run dev
-```
-
-<Environment specifics: proxies, .env files, ports. Delete if none.>
-
-`npm run` lists every script; `package.json` is the source of truth. `verify:full` is the CI gate.
-
-## Docs
-
-[`docs/index.md`](./docs/index.md) registers them.