@bridge-ds/visual 0.3.5 → 0.3.6

package/dist/index.js

@@ -21,8 +21,8 @@ function parseOwnerEntry(raw) {
 }
 function ownerEntryProblems(raw) {
   if (raw === void 0) return [];
-  const isObj2 = (x) => Boolean(x) && typeof x === "object" && !Array.isArray(x);
-  if (!isObj2(raw)) return ['"governance.owners" must be { "design": [people or teams], "tech": [people or teams] }'];
+  const isObj3 = (x) => Boolean(x) && typeof x === "object" && !Array.isArray(x);
+  if (!isObj3(raw)) return ['"governance.owners" must be { "design": [people or teams], "tech": [people or teams] }'];
   const out = [];
   for (const [k, v] of Object.entries(raw)) {
     if (k !== "design" && k !== "tech") {
@@ -989,6 +989,81 @@ function planReferences(file) {
   );
 }
 
+// ../core/src/storybook.ts
+var StorybookIndexError = class extends Error {
+  constructor(code, message, status) {
+    super(message);
+    this.code = code;
+    this.status = status;
+    this.name = "StorybookIndexError";
+  }
+  code;
+  status;
+};
+var isObj2 = (v) => typeof v === "object" && v !== null && !Array.isArray(v);
+var str = (v) => typeof v === "string" && v.trim() ? v : void 0;
+function entryFrom(key, raw, v3) {
+  if (!isObj2(raw)) return null;
+  const id = str(raw.id) ?? key;
+  const title = str(raw.title) ?? str(raw.kind);
+  const name = str(raw.name) ?? str(raw.story);
+  if (!id || !title || !name) return null;
+  const params = isObj2(raw.parameters) ? raw.parameters : {};
+  const type = raw.type === "docs" || raw.type === "story" ? raw.type : v3 && params.docsOnly === true ? "docs" : "story";
+  const e = {
+    id,
+    title,
+    name,
+    type,
+    importPath: str(raw.importPath) ?? str(params.fileName) ?? "",
+    tags: Array.isArray(raw.tags) ? raw.tags.filter((t) => typeof t === "string") : []
+  };
+  const subtype = str(raw.subtype);
+  if (subtype) e.subtype = subtype;
+  const exportName2 = str(raw.exportName);
+  if (exportName2) e.exportName = exportName2;
+  const componentPath = str(raw.componentPath);
+  if (componentPath) e.componentPath = componentPath;
+  return e;
+}
+function groupStorybookComponents(entries) {
+  const byTitle = /* @__PURE__ */ new Map();
+  for (const e of entries) {
+    let c = byTitle.get(e.title);
+    if (!c) {
+      const parts = e.title.split("/").map((p) => p.trim()).filter(Boolean);
+      c = { title: e.title, name: parts[parts.length - 1] ?? e.title, group: parts.slice(0, -1), stories: [], docs: [], tags: [] };
+      byTitle.set(e.title, c);
+    }
+    if (e.type === "docs") c.docs.push(e);
+    else if (e.subtype !== "test") c.stories.push(e);
+    for (const t of e.tags) if (!c.tags.includes(t)) c.tags.push(t);
+  }
+  const out = [...byTitle.values()].filter((c) => c.stories.length || c.docs.length);
+  for (const c of out) c.tags.sort();
+  return out.sort((a, b) => a.title.localeCompare(b.title));
+}
+function parseStorybookIndex(json, source) {
+  if (!isObj2(json)) throw new StorybookIndexError("not-json", "The Storybook index is not a JSON object.");
+  if (typeof json.loginUrl === "string" && !("entries" in json) && !("stories" in json)) {
+    throw new StorybookIndexError("private", "This Storybook is private: it asks for a sign-in before showing its index.");
+  }
+  const map = isObj2(json.entries) ? json.entries : isObj2(json.stories) ? json.stories : null;
+  if (!map) throw new StorybookIndexError("empty", "This file has no Storybook entries.");
+  const v3 = !isObj2(json.entries);
+  const entries = Object.entries(map).map(([k, raw]) => entryFrom(k, raw, v3)).filter((e) => e !== null);
+  if (!entries.length) throw new StorybookIndexError("empty", "This Storybook index lists no stories or docs.");
+  const version = typeof json.v === "number" ? json.v : v3 ? 3 : 4;
+  return { version, source: source ?? (v3 ? "stories.json" : "index.json"), entries, components: groupStorybookComponents(entries) };
+}
+var pairs = (o) => Object.entries(o).map(([k, v]) => `${encodeURIComponent(k)}:${encodeURIComponent(v)}`).join(";");
+function storybookIframeUrl(base, id, o = {}) {
+  let url = `${base.replace(/\/+$/, "")}/iframe.html?id=${encodeURIComponent(id)}&viewMode=${o.viewMode ?? "story"}`;
+  if (o.globals && Object.keys(o.globals).length) url += `&globals=${pairs(o.globals)}`;
+  if (o.args && Object.keys(o.args).length) url += `&args=${pairs(o.args)}`;
+  return url;
+}
+
 // ../core/src/node/git-local.ts
 import { execFile } from "node:child_process";
 function git(root, args, opts = {}) {
@@ -1405,7 +1480,7 @@ function routeUrl(base, route, tenant, theme) {
   return `${base.replace(/\/$/, "")}/?tenant=${encodeURIComponent(tenant)}&theme=${encodeURIComponent(theme)}&density=comfortable&lang=en#${route.pathByTenant?.[tenant] ?? route.path}`;
 }
 function storyUrl(base, id, brand, theme) {
-  return `${base.replace(/\/$/, "")}/iframe.html?id=${encodeURIComponent(id)}&viewMode=story&globals=brand:${brand};theme:${theme};density:comfortable`;
+  return storybookIframeUrl(base, id, { globals: { brand, theme, density: "comfortable" } });
 }
 var shotKey = (...parts) => parts.map((p) => p.toLowerCase().replace(/[^a-z0-9-]+/g, "-").replace(/^-|-$/g, "")).join("__");
 
@@ -1696,8 +1771,8 @@ function changedTokens(before, after) {
   return [...modes.entries()].map(([path, m]) => ({ path, kind: direct.has(path) ? "direct" : "alias", modes: m })).sort((a, b) => Number(a.kind === "alias") - Number(b.kind === "alias") || a.path.localeCompare(b.path));
 }
 async function readIndexJson(dir) {
-  const raw = JSON.parse(await readFile3(join3(dir, "index.json"), "utf8"));
-  return Object.values(raw.entries).filter((e) => e.type === "story").map(({ id, title, name, importPath }) => ({ id, title, name, importPath }));
+  const index = parseStorybookIndex(JSON.parse(await readFile3(join3(dir, "index.json"), "utf8")), "index.json");
+  return index.entries.filter((e) => e.type === "story").map(({ id, title, name, importPath }) => ({ id, title, name, importPath }));
 }
 async function planImpact(o) {
   const root = resolve(o.root);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@bridge-ds/visual",
-  "version": "0.3.5",
+  "version": "0.3.6",
   "type": "module",
   "description": "Bridge visual impact analysis: screenshots the stories and app screens a design system change touches, at the base and head refs, and pixel-diffs them into before/after/diff images and a JSON manifest.",
   "license": "MIT",
@@ -47,7 +47,7 @@
     "build:package": "node ../../scripts/build-packages.mjs visual"
   },
   "dependencies": {
-    "@bridge-ds/core": "^0.11.0",
+    "@bridge-ds/core": "^0.12.0",
     "pixelmatch": "7.1.0",
     "playwright-core": "1.63.0",
     "pngjs": "7.0.0"