@imfusion/web-ui 0.5.1-dev.6.gece7a7b5 → 0.5.1-dev.7.ga571658e

package/README.md

@@ -2,6 +2,11 @@
 
 `@imfusion/web-ui` — the official shared Web UI library for ImFusion web apps, built on Base UI.
 
+- [Usage](#usage) — install, wire up, and keep the version current
+- [Documentation](#documentation) — Storybook and the developer docs
+- [Development](#development) — working on the library itself, including the Agent Skills
+- [Releasing](#releasing) — how versions are derived and how to cut one
+
 ## Usage
 
 The packages are private on npmjs.com.
@@ -33,8 +38,31 @@ import "@imfusion/web-ui/styles.css";
 import { WebUIProvider } from "@imfusion/web-ui";
 ```
 
-**There is also an AI skill to help you set up the Web UI library in your project:
-[`/imf-web-ui-setup`](./src/llms/skills/imf-web-ui-setup/SKILL.md). **
+### LLM integration
+
+The `web-ui` package does offer first-class support for LLMs, but it's not wired up by default.
+
+To install the skills, run this command after the package is installed:
+
+```bash
+npx web-ui-install-skills
+```
+
+The binary asks which LLM client you use and installs everything it needs. Run it again after a version bump and it refreshes
+the directories it already installed into, without asking again — `--reconfigure` re-opens that choice.
+
+**Available consumer skills - `/imf-web-ui-*`**
+
+| Skill                                 | What it does                                                                         |
+| ------------------------------------- | ------------------------------------------------------------------------------------ |
+| `/imf-web-ui`                         | The router: decides whether guidance is needed, then which companion to open.        |
+| `/imf-web-ui-setup`                   | One-time wiring in a consumer project — the styles import and the provider.          |
+| `/imf-web-ui-components`              | Component reference — what exists and how it's meant to be used.                     |
+| `/imf-web-ui-ux`                      | UX guidance for building interfaces with the library.                                |
+| `/imf-web-ui-frontend-patterns`       | Frontend patterns, including the sanctioned styling seams (tokens, data attributes). |
+| `/imf-web-ui-imfusion-frontend-setup` | Set up or audit an ImFusion frontend's tooling against the house baseline.           |
+
+Start at `/imf-web-ui` — it routes to the rest. Storybook's **User Guide → AI Agents** page covers the whole family.
 
 ### Versions and updates
 
@@ -58,20 +86,6 @@ Every merge to master publishes a new build under the `dev` dist-tag. Which spec
 - **A `file:` tarball never updates.** npm copies the archive into `node_modules` and re-copies the same one on every
   install. Switch to `dev` or a version range to get updates.
 
-### Consumer skills — `imf-web-ui-*`
-
-These skills are shipped with a `imf-web-ui` prefix, so to make their names identifiable and not pollute the skill namespace
-of the user.
-
-| Skill                                 | What it does                                                                         |
-| ------------------------------------- | ------------------------------------------------------------------------------------ |
-| `/imf-web-ui`                         | The router: decides whether guidance is needed, then which companion to open.        |
-| `/imf-web-ui-setup`                   | One-time wiring in a consumer project — the styles import and the provider.          |
-| `/imf-web-ui-components`              | Component reference — what exists and how it's meant to be used.                     |
-| `/imf-web-ui-ux`                      | UX guidance for building interfaces with the library.                                |
-| `/imf-web-ui-frontend-patterns`       | Frontend patterns, including the sanctioned styling seams (tokens, data attributes). |
-| `/imf-web-ui-imfusion-frontend-setup` | Set up or audit an ImFusion frontend's tooling against the house baseline.           |
-
 ## Documentation
 
 **[Storybook](https://storybook.js.org/)** is the documentation platform — the component catalog, every prop, and the setup
@@ -94,9 +108,10 @@ npm run git:config   # hooks path + rebase-only pull/merge
 
 **Try out **`/web-ui-dev-getting-started`** for an ai assisted start.**
 
-### Development skills — `web-ui-dev-*`
+### LLM integration
 
-These skills are shipped with a `web-ui-dev` prefix, so to make their names identifiable and not pollute the skill namespace.
+These skills are shipped with a `/web-ui-dev-*` prefix, so to make their names identifiable and not pollute the skill
+namespace.
 
 | Skill                                     | What it does                                                                          |
 | ----------------------------------------- | ------------------------------------------------------------------------------------- |
@@ -131,8 +146,18 @@ Given the tag `web-ui/v0.5.0`:
 | Exactly on `web-ui/v0.5.0` | `0.5.0`                 | `latest` |
 | 5 commits after that tag   | `0.5.1-dev.5.gb4de52d7` | `dev`    |
 
-where `5` is the number of commits since the tag and `b4de52d7` the abbreviated hash. Off-tag builds bump the patch, so a dev
-build always sorts above the release it follows and below the next one.
+The off-tag string breaks down as:
+
+```
+0.5.1-dev.5.gb4de52d7
+└─┬─┘ └┬┘ │ └───┬────┘
+  │    │  │     └── commit hash, abbreviated; the leading g means "git"
+  │    │  └──────── commits since the tag
+  │    └─────────── pre-release marker, which is what puts it on the dev tag
+  └──────────────── the tag's version, patch bumped
+```
+
+Bumping the patch is what makes a dev build sort above the release it follows and below the next one.
 
 Every build of `master` publishes a `dev` version automatically. To check what the current checkout would publish:
 

package/bin/install-skill.js

@@ -11,6 +11,9 @@
 // When both targets are selected, .agents/skills/ holds the real copy and
 // .claude/skills/ symlinks it (this repo's own convention) so the two
 // can't drift apart.
+//
+// Flags: --target claude|agents (repeatable) for scripted installs,
+// --reconfigure to re-open the target prompt on an existing install.
 
 import {
   cpSync,
@@ -86,6 +89,16 @@ function writeSymlink(linkPath, targetPath) {
   symlinkSync(relative(dirname(linkPath), targetPath), linkPath);
 }
 
+// A prior install is recoverable from the filesystem, so a re-run doesn't
+// re-ask: a target counts as chosen when any bundled skill is present under
+// it. Symlinks count — they're how the both-targets layout represents
+// .claude/, and lstat avoids following them into the real copy.
+function detectInstalledTargets(skills) {
+  return Object.keys(TARGETS).filter(key =>
+    skills.some(name => lstatSync(resolve(TARGETS[key].root, name), { throwIfNoEntry: false }))
+  );
+}
+
 // --target claude|agents (repeatable) selects targets without the
 // interactive prompt — for CI and scripted installs.
 function parseTargetFlags(argv) {
@@ -105,7 +118,9 @@ function parseTargetFlags(argv) {
 
 async function main() {
   const skills = discoverSkills();
-  const flagTargets = parseTargetFlags(process.argv.slice(2));
+  const argv = process.argv.slice(2);
+  const flagTargets = parseTargetFlags(argv);
+  const reconfigure = argv.includes("--reconfigure");
 
   p.intro(`@imfusion/web-ui — install the ${SKILL_PREFIX} skills (${skills.length})`);
 
@@ -116,6 +131,8 @@ async function main() {
     return;
   }
 
+  const installedTargets = detectInstalledTargets(skills);
+
   const existingVersions = Object.values(TARGETS)
     .flatMap(({ root }) => skills.map(name => readInstalledVersion(resolve(root, name))))
     .filter(Boolean);
@@ -132,6 +149,12 @@ async function main() {
   if (flagTargets.length > 0) {
     selected = flagTargets;
     p.log.info(`Targets from --target flags: ${selected.join(", ")}`);
+  } else if (installedTargets.length > 0 && !reconfigure) {
+    selected = installedTargets;
+    p.log.info(
+      `Refreshing the existing install: ${selected.map(key => displayPath(TARGETS[key].root)).join(", ")}` +
+        ` — pass --reconfigure to choose different targets.`
+    );
   } else {
     selected = await p.multiselect({
       message: "Install into which skill directory (or directories)?",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@imfusion/web-ui",
-  "version": "0.5.1-dev.6.gece7a7b5",
+  "version": "0.5.1-dev.7.ga571658e",
   "description": "The official Web UI component library for ImFusion web apps",
   "author": "ImFusion GmbH",
   "license": "UNLICENSED",