@bridge-ds/cli 0.15.0 → 0.16.0

package/dist/index.js

@@ -373,6 +373,7 @@ function productProblems(raw) {
       if (bad) problems.push(`${at}.path" must be a folder relative to the repository root, without a leading "/" or "..", such as "apps/admin"`);
     }
     if (o.preview !== void 0 && (typeof o.preview !== "string" || !/^https?:\/\//.test(o.preview))) problems.push(`${at}.preview" must be an http(s) URL template, such as "https://app-git-{branch}.vercel.app"`);
+    if (o.production !== void 0 && (typeof o.production !== "string" || !/^https?:\/\/[^{}\s]+$/.test(o.production))) problems.push(`${at}.production" must be the product's production URL, without placeholders, such as "https://shop.example.com"`);
     if (o.framework !== void 0 && (typeof o.framework !== "string" || !o.framework.trim())) problems.push(`${at}.framework" must be a name such as "react", "vue" or "other"`);
     if (o.default !== void 0 && typeof o.default !== "boolean") problems.push(`${at}.default" must be true or false`);
     if (o.default === true) defaults++;
@@ -390,7 +391,7 @@ var init_products = __esm({
     ];
     KEY = /^[a-z0-9][a-z0-9-]*$/;
     REPO = /^[\w.-]+\/[\w.-]+$/;
-    FIELDS = ["key", "name", "repo", "path", "preview", "framework", "default"];
+    FIELDS = ["key", "name", "repo", "path", "preview", "production", "framework", "default"];
   }
 });
 
@@ -15396,6 +15397,8 @@ Usage:
                      neither exists). --product: the key in the design system's bridge.config.json
                      "products"; by default the product whose "repo" is this repository's origin.
                      Run it again any time: only what differs changes, your own content is kept.
+                     In a React product it also prints the one line that mounts the Bridge toolbar
+                     (@bridge-ds/toolbar: Before and After of a change, from Studio's Try it in the product).
 
 Then, from this repository: bridge explore list | continue <#n> | start <name> | done <#n>, bridge pieces <#n>,
 and Claude Code with the Bridge tools (restart it here once).`;
@@ -15465,6 +15468,22 @@ function instructionsFile(root) {
   if (existsSync7(join8(root, "AGENTS.md"))) return "AGENTS.md";
   return "CLAUDE.md";
 }
+var TOOLBAR_PACKAGE = "@bridge-ds/toolbar";
+var toolbarMount = (designSystem, product) => `<BridgeToolbar ds="${designSystem}" product="${product}" />`;
+function toolbarSetup(pkgText, x) {
+  let deps = {};
+  try {
+    const pkg = pkgText ? JSON.parse(pkgText) : {};
+    deps = { ...pkg.devDependencies ?? {}, ...pkg.dependencies ?? {} };
+  } catch {
+    deps = {};
+  }
+  const react = (x.framework ?? "").toLowerCase() === "react" || "react" in deps;
+  if (!react) return { state: "none", lines: [] };
+  const mount = [`import { BridgeToolbar } from '${TOOLBAR_PACKAGE}';`, toolbarMount(x.designSystem, x.product)];
+  if (TOOLBAR_PACKAGE in deps) return { state: "installed", lines: mount };
+  return { state: "suggested", lines: [`npm i ${TOOLBAR_PACKAGE}`, ...mount] };
+}
 async function connect(root, a) {
   const warnings = [];
   const pointerPath = join8(root, PRODUCT_POINTER);
@@ -15477,10 +15496,11 @@ async function connect(root, a) {
   }
   const wanted = a.product ?? (previous && previous.designSystem.toLowerCase() === a.designSystem.toLowerCase() ? previous.product : void 0);
   let product;
+  let found;
   if (a.products) {
     const byKey = wanted ? a.products.find((p) => p.key === wanted || p.name.toLowerCase() === wanted.toLowerCase()) : void 0;
     const byRepo = a.origin ? a.products.find((p) => productRepoOf(p, a.designSystem)?.toLowerCase() === a.origin.toLowerCase()) : void 0;
-    const found = wanted ? byKey : byRepo;
+    found = wanted ? byKey : byRepo;
     if (!found) {
       const list3 = a.products.map((p) => `${p.key} (${p.name})`).join(", ");
       throw new RequestUsageError(
@@ -15523,11 +15543,16 @@ async function connect(root, a) {
     }
   }
   const changed = files2.filter((f) => f.change === "created" || f.change === "updated").map((f) => f.path);
+  const toolbar = toolbarSetup(await readOrNull(join8(root, "package.json")), { designSystem: a.designSystem, product: product.key, framework: found?.framework });
+  if (toolbar.state !== "none" && found && !found.production && !found.path) {
+    warnings.push(`${found.name} has no "production" URL in the design system's bridge.config.json, so the Bridge toolbar cannot show Live product for a change made here. An admin can add "production": "https://..." to that product.`);
+  }
   return {
     status: a.dryRun ? "dry-run" : "connected",
     designSystem: a.designSystem,
     product,
     files: files2.map(({ path, change }) => ({ path, change })),
+    toolbar,
     warnings,
     next: changed.length ? `Commit ${changed.join(", ")} so everyone working here gets it. Restart Claude Code in this folder to load the Bridge tools. Then: bridge explore list, or "Continue Bridge exploration #<n>" in Claude.` : "Already connected, nothing changed. bridge explore list shows this product's explorations."
   };
@@ -15555,6 +15580,15 @@ ${CONNECT_HELP}`);
   if (has8(a, "json")) return io.print(JSON.stringify(r, null, 2)), 0;
   io.print(`${r.status === "dry-run" ? "Dry run, nothing written. " : ""}${r.status === "dry-run" ? "Would connect" : "Connected"} ${r.product.name} (${r.product.key}) to the design system ${r.designSystem}.`);
   for (const f of r.files) io.print(`  ${VERB[f.change]} ${f.path}${f.change === "unchanged" || f.change === "kept" ? "" : `: ${WHAT[f.path] ?? "a short Bridge section for Claude"}`}`);
+  if (r.toolbar.state === "suggested") {
+    io.print(`
+Before and after in ${r.product.name} (Studio's Try it in the product): add the Bridge toolbar, then mount it once at the root of the app, inside ThemeProvider. Bridge does not edit your code.`);
+    for (const l of r.toolbar.lines) io.print(`  ${l}`);
+  } else if (r.toolbar.state === "installed") {
+    io.print(`
+The Bridge toolbar is installed: mount it once at the root of the app, if it is not yet.`);
+    for (const l of r.toolbar.lines) io.print(`  ${l}`);
+  }
   for (const w of r.warnings) io.error(`Warning: ${w}`);
   io.print(`
 ${r.next}`);
@@ -16894,7 +16928,7 @@ async function rolesReport(opts) {
 
 // src/index.ts
 import { brand, BridgeContext as BridgeContext5, CONFIG_FILE as CONFIG_FILE2, core, detectConfig, GitRefSource, history as hist, LocalSource, ops, optionsFromArgv, serveStdio, toConfigJson } from "@bridge-ds/mcp";
-var VERSION = true ? "0.15.0" : "dev";
+var VERSION = true ? "0.16.0" : "dev";
 var MCP_PACKAGE2 = "@bridge-ds/mcp";
 var HELP = `bridge ${VERSION}: design system as code, for you and your Claude
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@bridge-ds/cli",
-  "version": "0.15.0",
+  "version": "0.16.0",
   "type": "module",
   "description": "bridge CLI: set up Bridge in a design system repo, check tokens in CI, search and diff tokens, propose changes, start the MCP server.",
   "license": "FSL-1.1-MIT",
@@ -43,8 +43,8 @@
     "build:package": "node ../../scripts/build-packages.mjs cli"
   },
   "dependencies": {
-    "@bridge-ds/mcp": "^0.11.0",
-    "@bridge-ds/visual": "^0.3.15",
+    "@bridge-ds/mcp": "^0.11.1",
+    "@bridge-ds/visual": "^0.3.16",
     "typescript": "5.9.3"
   },
   "devDependencies": {