@vinena/vectoys-cli 0.2.1 → 0.3.0

package/SKILL.md

@@ -11,10 +11,10 @@ vectoys draws 3D objects as plain SVG paths. An item is a small React component
 
 1. `npx @vinena/vectoys-cli create <name>` writes `./<name>/` (or under `--dir <dir>`): `item.json`, `src/geometry.ts`, `src/<name>.tsx`, `src/index.ts`, a test, `package.json` and `tsconfig.json`. It renders a shaded, tilted slab. Under `registry/` of a vectoys checkout it uses the workspace's packages, which `bun install` links. Anywhere else it asks for `@vinena/vectoys` and `@vinena/vectoys-react` from npm by version: install them with `npm install` (or your package manager) in the item folder before you check it.
 2. Edit `src/geometry.ts` (parts, camera, poses) and `src/<name>.tsx` (looks, motion, interaction). Write a real `title` and `description` in `item.json`. List every source file in `files`.
-3. `npx @vinena/vectoys-cli check <dir>` runs 8 checks: item.json is valid, the files are under 96 KB together, item.json names no brand, the component renders on the server with no props, the markup has no `NaN` or `Infinity`, two renders give the same markup, the rendered text names no brand, and the root has an accessible name. It needs bun. Fix every FAIL line.
+3. `npx @vinena/vectoys-cli check <dir>` runs 10 checks: item.json is valid, the files are under 96 KB together, item.json names no brand, the code has none of the unsafe patterns check knows, the component renders on the server with no props, the markup has no `NaN` or `Infinity`, two renders give the same markup, the markup has no scripts or outside links, the rendered text names no brand, and the root has an accessible name. `check` catches common unsafe patterns, and a maintainer reviews every submission before it is listed. It fails any code file in the folder, tests included, that uses `Bun`, `process`, `require`, `globalThis`, `window`, `self`, `opener` or `defaultView`, `<script>`, frames, objects, embeds or forms, `innerHTML` or `dangerouslySetInnerHTML`, `eval` or `Function`, string timers, network calls, workers, `postMessage`, the clipboard, `window.open` or `location`, dynamic `import()`, browser storage or cookies, or outside or `javascript:` URLs. The files item.json lists import only each other, `react`, `@vinena/vectoys` and `@vinena/vectoys-react`, which are also the only dependencies item.json may list; tests may also import `bun:test` and `react-dom/server`. Inside a vectoys checkout, tests under `registry/<item>/test/` also use the helpers in `packages/react/test/dom.tsx` (`installGlobal`, `htmlOf`, `fireOnWindow`, and `readSibling`, which reads only files under `registry/`). An item made outside the repository has no such helpers, so keep its tests to rendering with `react-dom/server`. Keep `package.json` and `tsconfig.json` as `create` writes them, and add no dot files but `.gitignore`. It needs bun. Fix every FAIL line.
 4. `npx @vinena/vectoys-cli preview <dir>` writes `<dir>/preview.html` (`--open` opens it): the item rendered on the server in light and dark, and at a row of yaws when the component takes a `yaw` prop. Look at it. Faces drawn in the wrong order, gaps, and parts that float show here, not in the checks.
 5. Iterate on 2 to 4 until it looks right in both themes and at every yaw.
-6. `npx @vinena/vectoys-cli submit <dir>` runs the checks, then opens a pull request (it needs the GitHub CLI, `gh`) that adds the item to vinenastudio/vectoys. If you host your own registry, `npx @vinena/vectoys-cli submit --registry <url>` opens a pull request that lists it. Until submissions open at launch, submit prints what it would send and sends nothing. `--dry-run` does the same at any time.
+6. `npx @vinena/vectoys-cli submit <dir>` runs the checks, then opens a pull request (it needs the GitHub CLI, `gh`, and bun 1.3.2 or newer) that adds the item to vinenastudio/vectoys: the files `item.json` lists, its `package.json`, `tsconfig.json`, `src/index.ts` and `test/`, and the item's package in `bun.lock`. If you host your own registry, `npx @vinena/vectoys-cli submit --registry <url>` opens a pull request that lists it. Until submissions open at launch, submit prints what it would send and sends nothing. `--dry-run` does the same at any time.
 
 ## The model
 
@@ -89,7 +89,7 @@ The same props must give the same markup on the server and the client, every tim
 
 ## Example
 
-A badge that lifts toward the mouse and shows live HTML on its face. It passes all 8 checks.
+A badge that lifts toward the mouse and shows live HTML on its face. It passes all 10 checks.
 
 `src/geometry.ts`:
 
@@ -165,7 +165,7 @@ export function Badge({ children, label = "Badge" }: { children?: ReactNode; lab
 
 ## Before you submit
 
-- `npx @vinena/vectoys-cli check <dir>` passes all 8 checks.
+- `npx @vinena/vectoys-cli check <dir>` passes all 10 checks.
 - The preview looks right in light and dark and at every yaw.
 - Pointer, touch and keyboard all work, and reduced motion keeps the state changes.
 - `item.json` has a plain title and a description that says what the item is and what it does.

package/dist/index.js

@@ -3,7 +3,7 @@
 // src/index.ts
 import { resolve as resolve7 } from "node:path";
 // package.json
-var version = "0.2.1";
+var version = "0.3.0";
 
 // src/args.ts
 var VALUES = new Map([
@@ -58,10 +58,15 @@ function parseArgs(argv) {
 
 // src/check.ts
 import { spawnSync as spawnSync3 } from "node:child_process";
-import { existsSync as existsSync6, lstatSync, mkdtempSync, readFileSync as readFileSync6, rmSync, writeFileSync as writeFileSync4 } from "node:fs";
+import { existsSync as existsSync6, lstatSync, mkdtempSync, readdirSync, readFileSync as readFileSync6, realpathSync, rmSync, writeFileSync as writeFileSync4 } from "node:fs";
 import { tmpdir } from "node:os";
-import { basename, extname, join as join6, relative as relative3, resolve as resolve4, sep as sep3 } from "node:path";
+import { basename, extname, join as join6, posix as posix3, relative as relative3, resolve as resolve4, sep as sep3 } from "node:path";
 
+// ../registry-build/src/names.ts
+function componentName(name) {
+  const joined = name.split(/[^a-zA-Z0-9]+/).map((word) => word.charAt(0).toUpperCase() + word.slice(1)).join("");
+  return /^[A-Za-z]/.test(joined) ? joined : `Item${joined}`;
+}
 // ../registry-build/src/index.ts
 function checkItem(value, file) {
   const item = value;
@@ -71,8 +76,13 @@ function checkItem(value, file) {
   }
   if (!Array.isArray(item.files) || item.files.length === 0)
     throw new Error(`${file} needs "files"`);
+  if (item.author !== undefined && !isOneLine(item.author))
+    throw new Error(`${file} "author" must be one line of text like "Name (https://site)"`);
+  if (item.credit !== undefined && !isOneLine(item.credit))
+    throw new Error(`${file} "credit" must be one line of text`);
   return item;
 }
+var isOneLine = (value) => typeof value === "string" && value.trim() !== "" && !/[\r\n\u2028\u2029]/.test(value) && !value.includes("*/");
 
 // src/commands.ts
 import { spawnSync } from "node:child_process";
@@ -307,8 +317,48 @@ function missing(cwd, wanted) {
   if (!existsSync3(path))
     return wanted;
   const pkg = JSON.parse(readFileSync3(path, "utf8"));
-  const have = new Set(["dependencies", "devDependencies", "peerDependencies"].flatMap((field) => Object.keys(pkg[field] ?? {})));
-  return wanted.filter((spec) => !have.has(packageName(spec)));
+  const listed = Object.assign({}, ...["peerDependencies", "devDependencies", "dependencies"].map((field) => pkg[field] ?? {}));
+  return wanted.filter((spec) => {
+    const name = packageName(spec);
+    if (!Object.hasOwn(listed, name))
+      return true;
+    const want = base(spec.slice(name.length + 1));
+    const range = listed[name];
+    if (!want || typeof range === "string" && range.startsWith("workspace:"))
+      return false;
+    const installed = readPackage(join3(cwd, "node_modules", name, "package.json"))?.version;
+    const have = [installed, range].flatMap((version2) => typeof version2 === "string" ? base(version2) ?? [] : []);
+    return !have.some((version2) => compare(version2, want) >= 0);
+  });
+}
+var base = (range) => {
+  const found = /^[\^~]?=?v?(\d+)(?:\.(\d+)(?:\.(\d+)(?:-([\w.-]+))?)?)?(?:\+[\w.-]*)?$/.exec(range.trim());
+  return found ? { parts: [found[1], found[2], found[3]].map((part) => Number(part ?? 0)), pre: found[4]?.split(".") ?? [] } : undefined;
+};
+function compare(a, b) {
+  for (const [at, part] of a.parts.entries()) {
+    const other = b.parts[at];
+    if (other === undefined)
+      return 1;
+    if (part !== other)
+      return part - other;
+  }
+  if (a.pre.length === 0 || b.pre.length === 0)
+    return b.pre.length - a.pre.length;
+  for (const [at, id] of a.pre.entries()) {
+    const other = b.pre[at];
+    if (other === undefined)
+      return 1;
+    if (id === other)
+      continue;
+    const [x, y] = [/^\d+$/.test(id), /^\d+$/.test(other)];
+    if (x && y)
+      return Number(id) - Number(other);
+    if (x !== y)
+      return x ? -1 : 1;
+    return id < other ? -1 : 1;
+  }
+  return a.pre.length - b.pre.length;
 }
 function packageName(spec) {
   const at = spec.indexOf("@", 1);
@@ -463,6 +513,7 @@ import { dirname as dirname4, join as join5, relative as relative2, resolve as r
 // ../../package.json
 var devDependencies = {
   "@happy-dom/global-registrator": "20.14.5",
+  "@playwright/test": "1.63.0",
   "@types/bun": "1.3.14",
   typescript: "7.0.2"
 };
@@ -510,10 +561,6 @@ function inVectoysRepo(folder) {
       return false;
   }
 }
-function componentName(name) {
-  const joined = name.split(/[^a-zA-Z0-9]+/).map((word) => word.charAt(0).toUpperCase() + word.slice(1)).join("");
-  return /^[A-Za-z]/.test(joined) ? joined : `Item${joined}`;
-}
 function titleOf(name) {
   const words = name.replace(/[-_.]+/g, " ").trim() || "item";
   return words.charAt(0).toUpperCase() + words.slice(1);
@@ -522,24 +569,13 @@ function gitAuthor(cwd) {
   const result = spawnSync2("git", ["config", "user.name"], { cwd, encoding: "utf8" });
   return result.status === 0 ? result.stdout.trim() || undefined : undefined;
 }
-function scaffold(name, author, inRepo = false) {
-  const component = componentName(name);
-  const title = titleOf(name);
-  const item = {
-    name,
-    title,
-    description: `${title}: a tilted slab drawn as SVG paths. Say what it is and what it does.`,
-    files: ["src/geometry.ts", `src/${name}.tsx`],
-    dependencies: ["@vinena/vectoys", "@vinena/vectoys-react"],
-    license: "MIT",
-    ...author ? { author } : {}
-  };
+function itemPackage(name, description, inRepo) {
   const vectoys = inRepo ? "workspace:*" : `^${version}`;
-  const pkg = {
+  return {
     name: `@vectoys/${name}`,
     version: "0.0.0",
     private: true,
-    description: `${title} drawn with the vectoys engine.`,
+    description,
     type: "module",
     sideEffects: false,
     exports: { ".": "./src/index.ts" },
@@ -554,6 +590,20 @@ function scaffold(name, author, inRepo = false) {
       "react-dom": "19.0.0"
     }
   };
+}
+function scaffold(name, author, inRepo = false) {
+  const component = componentName(name);
+  const title = titleOf(name);
+  const item = {
+    name,
+    title,
+    description: `${title}: a tilted slab drawn as SVG paths. Say what it is and what it does.`,
+    files: ["src/geometry.ts", `src/${name}.tsx`],
+    dependencies: ["@vinena/vectoys", "@vinena/vectoys-react"],
+    license: "MIT",
+    ...author ? { author } : {}
+  };
+  const pkg = itemPackage(name, `${title} drawn with the vectoys engine.`, inRepo);
   const tsconfig = itemTsconfig(inRepo);
   const json = (value) => `${JSON.stringify(value, null, 2)}
 `;
@@ -652,9 +702,12 @@ export function ${component}({ label = ${JSON.stringify(title)}, finish, yaw = T
     </div>
   );
 }
+
+/** How the vectoys.com gallery shows the item on its card, with no props. Change it to show the item at its best. */
+export const Demo = () => <${component} />;
 `,
     "src/index.ts": `export { HEIGHT, THICKNESS, TILT, WIDTH, seen, type View } from "./geometry";
-export { ${component}, type ${component}Props } from "./${name}";
+export { Demo, ${component}, type ${component}Props } from "./${name}";
 `,
     [`test/${name}.test.tsx`]: `import { expect, test } from "bun:test";
 import { renderToStaticMarkup } from "react-dom/server";
@@ -743,7 +796,7 @@ function runInBun(script, entry, dir, wanted) {
   try {
     const runner = join6(work, "render.mjs");
     writeFileSync4(runner, script);
-    const result = spawnSync3("bun", [runner, entry, dir, wanted], { cwd: dir, encoding: "utf8", timeout: 60000, maxBuffer: 64 * 1024 * 1024 });
+    const result = spawnSync3("bun", [runner, entry, dir, wanted], { cwd: work, env: { PATH: process.env.PATH ?? "" }, encoding: "utf8", timeout: 60000, maxBuffer: 64 * 1024 * 1024 });
     if (result.error) {
       const missing2 = "code" in result.error && result.error.code === "ENOENT";
       return { error: missing2 ? "it needs bun to load the item's TSX: https://bun.sh" : result.error.message };
@@ -804,11 +857,242 @@ function itemProblem(item, dir) {
     const kind = stat.isSymbolicLink() ? "a symlink, " : stat.isDirectory() ? "a folder, " : "";
     return `files lists ${JSON.stringify(other)}, which is ${kind}not a regular file`;
   }
+  const outside = item.files.find((path) => !realpathSync(resolve4(dir, path)).startsWith(realpathSync(dir) + sep3));
+  if (outside !== undefined)
+    return `files lists ${JSON.stringify(outside)}, which is outside the folder`;
   if (item.dependencies !== undefined && !(Array.isArray(item.dependencies) && item.dependencies.every(isPackageSpec))) {
     return "dependencies are not all plain npm package names";
   }
   return;
 }
+var ALLOWED_DEPENDENCIES = ["@vinena/vectoys", "@vinena/vectoys-react"];
+var ALLOWED_IMPORTS = [...ALLOWED_DEPENDENCIES, "react"];
+var ALLOWED_TEST_IMPORTS = ["bun:test", "react-dom/server"];
+var TEST_HELPERS = [/^\.\.\/\.\.\/\.\.\/packages\/react\/test\/dom$/, /^\.\.\/\.\.\/[a-z0-9][a-z0-9._-]*\/src$/];
+var SCANNER = `
+const [, dir, list] = process.argv.slice(2);
+const { join } = await import("node:path");
+const code = (path) => /\\.[cm]?[jt]sx?$/.test(path);
+const sources = [];
+for (const path of JSON.parse(list)) {
+  const text = await Bun.file(join(dir, path)).text();
+  if (!code(path)) { sources.push({ path, text, code: text, imports: [] }); continue; }
+  try {
+    const transpiler = new Bun.Transpiler({ loader: path.endsWith("x") ? "tsx" : "ts", deadCodeElimination: false });
+    sources.push({ path, text, code: transpiler.transformSync(text), imports: transpiler.scan(text).imports });
+  } catch (error) {
+    sources.push({ path, error: error instanceof Error ? error.message : String(error) });
+  }
+}
+process.stdout.write("\\n${MARK}" + JSON.stringify(sources));
+`;
+function isSource(value) {
+  if (typeof value !== "object" || value === null || !("path" in value) || typeof value.path !== "string")
+    return false;
+  if ("error" in value)
+    return typeof value.error === "string";
+  return "text" in value && typeof value.text === "string" && "code" in value && typeof value.code === "string" && "imports" in value && Array.isArray(value.imports) && value.imports.every((entry) => typeof entry === "object" && entry !== null && ("path" in entry) && typeof entry.path === "string" && ("kind" in entry) && typeof entry.kind === "string");
+}
+function sources(dir, files) {
+  const ran = runInBun(SCANNER, dir, dir, JSON.stringify(files));
+  if ("error" in ran)
+    return ran.error;
+  return Array.isArray(ran.value) && ran.value.every(isSource) ? ran.value : "bun gave back something other than the files";
+}
+var entries = (dir, under) => readdirSync(join6(dir, under), { withFileTypes: true }).sort((a, b) => a.name < b.name ? -1 : a.name > b.name ? 1 : 0);
+function walk(dir, under = "") {
+  return entries(dir, under).flatMap((entry) => {
+    const path = under ? `${under}/${entry.name}` : entry.name;
+    if (entry.isDirectory())
+      return entry.name === "node_modules" ? [] : walk(dir, path);
+    return entry.isFile() ? [path] : [];
+  });
+}
+var CODE = /\.[cm]?[jt]sx?$/;
+function codeFiles(dir) {
+  return walk(dir).filter((path) => CODE.test(path));
+}
+var STRING = "[\"'`]";
+var GLOBALS = ["opener", "defaultView", "fetch", "eval", "Function", "XMLHttpRequest", "WebSocket", "EventSource", "sendBeacon", "importScripts", "localStorage", "sessionStorage", "indexedDB", "cookie", "constructor", "open", "location", "postMessage", "clipboard"];
+var ELEMENTS = "script|iframe|frame|object|embed|form";
+var UNSAFE = [
+  [/\b(Bun|process|Deno|module|exports|require|__dirname|__filename|globalThis)\b/, "uses the server runtime"],
+  [/\bdefaultView\b|(?<![.\w$])(window|self|opener)(?=\s*[?.[(=;,)\]}])/, "reaches the window object"],
+  [/<script\b/i, "has a <script> tag"],
+  [/<(iframe|frame|object|embed|form)\b/i, "has a frame, object, embed or form tag"],
+  [new RegExp(`\\b(jsx\\w*|createElement)\\s*\\(\\s*${STRING}(${ELEMENTS})${STRING}`, "i"), "makes a script, frame, object, embed or form element"],
+  [new RegExp(`${STRING}(script|iframe|frame|embed|form)${STRING}`, "i"), "names a script, frame, embed or form element in a string"],
+  [/\bsrcdoc\b/i, "sets srcdoc"],
+  [/\b(dangerouslySetInnerHTML|innerHTML|outerHTML|insertAdjacentHTML)\b/, "sets HTML from a string"],
+  [/\bdocument\s*\.\s*write/, "writes into the document"],
+  [/\beval\b/, "uses eval"],
+  [/\bFunction\b|\.\s*constructor\b|\bconstructor\s*[:,}]/, "reaches the Function constructor"],
+  [new RegExp(`\\bset(Timeout|Interval)\\s*\\(\\s*${STRING}`), "passes a string to setTimeout or setInterval"],
+  [/\bfetch\b/, "uses fetch"],
+  [/\b(XMLHttpRequest|WebSocket|EventSource|sendBeacon|importScripts)\b/, "makes a network call"],
+  [/\b(Worker|SharedWorker|serviceWorker|postMessage)\b/, "talks to a worker or another window"],
+  [/\bclipboard\b/, "uses the clipboard"],
+  [/(?<![\w$])open\s*\(/, "opens a window"],
+  [/\breadSibling\s*\((?!\s*import\.meta\.url\s*,)/, "reads a file from somewhere other than its own test"],
+  [/\blocation\s*(\.\s*(href|assign|replace|reload)\b|=(?!=))|\b(window|document)\s*\.\s*location\b/, "moves the page"],
+  [/\bimport\s*\(/, "has a dynamic import"],
+  [/\b(localStorage|sessionStorage|indexedDB)\b|\bdocument\s*\.\s*cookie\b/, "uses browser storage or cookies"],
+  [new RegExp(`${STRING}(${GLOBALS.join("|")})${STRING}`), "names a blocked browser feature in a string"],
+  [/javascript\s*:/i, "has a javascript: URL"],
+  [new RegExp(`\\bhttps?://(?!www\\.w3\\.org/)|[${"\"'`"}}]\\s*//[a-z0-9]|${STRING}\\s*data:\\s*text/html`, "i"), "has an outside URL"],
+  [/["'`}]\s*(?:\/\\\\|\\\\[\/\\])/, "has an outside URL"],
+  [/url\(\s*["']?\s*(https?:|\/\/)|@import\b/i, "loads a style from outside"]
+];
+var UNSAFE_MARKUP = [
+  [/<script\b/i, "has a <script> tag"],
+  [/<(iframe|frame|object|embed|form)\b/i, "has a frame, object, embed or form tag"],
+  [/\ssrcdoc=/i, "sets srcdoc"],
+  [/javascript\s*:/i, "has a javascript: URL"],
+  [/\s(href|xlink:href|src|srcset|action|formaction)="\s*(https?:|[\/\\]{2}|data:\s*text\/html)/i, "links outside"],
+  [/url\(\s*(&quot;|&#x27;|["'])?\s*(https?:|\/\/)/i, "loads a style from outside"]
+];
+var allowed = (name, list2) => list2.some((pkg) => name === pkg || name.startsWith(`${pkg}/`));
+function names(specifier, from, files) {
+  const path = posix3.join(posix3.dirname(from), specifier);
+  const base2 = path.replace(CODE, "");
+  return files.some((file) => file === path || CODE.test(file) && [base2, `${base2}/index`].includes(file.replace(CODE, "")));
+}
+function lineOf(text, found) {
+  const lines = text.split(`
+`);
+  for (const word of [found, ...(found.match(/[@A-Za-z_$][\w$]*|\/\/|<\w+/g) ?? []).sort((a, b) => b.length - a.length)]) {
+    const at = lines.findIndex((line) => line.includes(word));
+    if (at !== -1)
+      return `:${at + 1}`;
+  }
+  return "";
+}
+function safety(files, item) {
+  const problems = (item.dependencies ?? []).filter((name) => !ALLOWED_DEPENDENCIES.includes(name)).map((name) => `item.json depends on ${name}, which is not ${ALLOWED_DEPENDENCIES.join(" or ")}`);
+  const all = files.map((file) => file.path);
+  for (const file of files) {
+    if ("error" in file) {
+      problems.push(`${file.path} does not parse: ${file.error}`);
+      continue;
+    }
+    const shipped = item.files.includes(file.path);
+    const test = !shipped && file.path.startsWith("test/");
+    const reachable = shipped ? item.files : test ? all : all.filter((path) => !path.startsWith("test/"));
+    const packages = shipped ? ALLOWED_IMPORTS : [...ALLOWED_IMPORTS, ...ALLOWED_TEST_IMPORTS];
+    for (const entry of file.imports) {
+      if (entry.kind !== "import-statement")
+        continue;
+      const needed = ALLOWED_DEPENDENCIES.find((pkg) => entry.path === pkg || entry.path.startsWith(`${pkg}/`));
+      if (shipped && needed && !(item.dependencies ?? []).includes(needed))
+        problems.push(`${file.path}${lineOf(file.text, JSON.stringify(entry.path))} imports ${entry.path}, but item.json's dependencies do not list ${needed}`);
+      const fine = entry.path.startsWith(".") ? names(entry.path, file.path, reachable) || test && TEST_HELPERS.some((helper) => helper.test(entry.path)) : allowed(entry.path, packages);
+      const where = shipped ? "one of its files" : test ? "a file in its folder" : "a file in its folder outside test/";
+      if (!fine)
+        problems.push(`${file.path}${lineOf(file.text, JSON.stringify(entry.path))} imports ${entry.path}, which is not ${where} or ${packages.join(", ")}`);
+    }
+    const pragma = /@jsx\w*/.exec(file.text);
+    if (pragma)
+      problems.push(`${file.path}${lineOf(file.text, pragma[0])} sets the JSX runtime in a comment: ${pragma[0]}`);
+    for (const [pattern, what] of UNSAFE) {
+      const found = pattern.exec(file.code);
+      if (found)
+        problems.push(`${file.path}${lineOf(file.text, found[0])} ${what}: ${found[0].trim()}`);
+    }
+  }
+  return problems;
+}
+function markupSafety(html) {
+  return UNSAFE_MARKUP.flatMap(([pattern, what]) => {
+    const found = pattern.exec(html);
+    return found ? [`the markup ${what}: ${found[0].trim()}`] : [];
+  });
+}
+function configFiles(dir, under = "") {
+  return entries(dir, under).flatMap((entry) => {
+    const path = under ? `${under}/${entry.name}` : entry.name;
+    if (entry.name === "node_modules")
+      return [];
+    if (entry.name === "bunfig.toml" || entry.isSymbolicLink() || entry.name.startsWith(".") && entry.name !== ".gitignore")
+      return [path];
+    return entry.isDirectory() ? configFiles(dir, path) : [];
+  });
+}
+var isRecord = (value) => typeof value === "object" && value !== null && !Array.isArray(value);
+var TSCONFIG = /^[tj]sconfig.*\.json$/;
+var TSCONFIG_KEYS = ["extends", "compilerOptions", "include", "exclude"];
+var TSCONFIG_OPTIONS = Object.keys(itemTsconfig(false).compilerOptions);
+function tsconfigProblems(dir) {
+  return walk(dir).filter((path) => TSCONFIG.test(basename(path))).flatMap((file) => {
+    let config;
+    try {
+      config = JSON.parse(readFileSync6(join6(dir, file), "utf8"));
+    } catch {
+      return [`${file} is not plain JSON, so check cannot tell what it sets`];
+    }
+    if (typeof config !== "object" || config === null || Array.isArray(config))
+      return [`${file} is not an object`];
+    const problems = [];
+    if ("extends" in config && (file !== "tsconfig.json" || config.extends !== BASE_TSCONFIG))
+      problems.push(`${file} extends ${JSON.stringify(config.extends)}, which is not ${BASE_TSCONFIG} from the folder's tsconfig.json`);
+    for (const key of Object.keys(config))
+      if (!TSCONFIG_KEYS.includes(key))
+        problems.push(`${file} has ${key}, which items may not have`);
+    const options = "compilerOptions" in config && isRecord(config.compilerOptions) ? config.compilerOptions : {};
+    for (const [option, value] of Object.entries(options)) {
+      if (["paths", "baseUrl", "rootDirs"].includes(option))
+        problems.push(`${file} sets compilerOptions.${option}, which moves imports`);
+      else if (!TSCONFIG_OPTIONS.includes(option))
+        problems.push(`${file} sets compilerOptions.${option}, which items may not set`);
+      else if (option === "jsx" && value !== "react-jsx")
+        problems.push(`${file} sets compilerOptions.jsx to ${JSON.stringify(value)}, not "react-jsx"`);
+    }
+    return problems;
+  });
+}
+function canonical(value) {
+  if (Array.isArray(value))
+    return `[${value.map(canonical).join(",")}]`;
+  if (isRecord(value))
+    return `{${Object.keys(value).sort().map((key) => `${JSON.stringify(key)}:${canonical(value[key])}`).join(",")}}`;
+  return JSON.stringify(value) ?? "undefined";
+}
+var PLAIN_VERSION = /^\^?\d+\.\d+\.\d+(-[0-9A-Za-z.]+)?$/;
+function versionsFit(value, inRepo, outside) {
+  if (canonical(value) === canonical(inRepo))
+    return true;
+  if (!isRecord(value) || !isRecord(outside))
+    return false;
+  const keys = Object.keys(value).sort();
+  if (canonical(keys) !== canonical(Object.keys(outside).sort()))
+    return false;
+  return keys.every((key) => {
+    const version2 = value[key];
+    const want = outside[key];
+    return version2 === want || typeof version2 === "string" && typeof want === "string" && PLAIN_VERSION.test(version2) && PLAIN_VERSION.test(want);
+  });
+}
+function packageProblems(dir, item) {
+  const path = join6(dir, "package.json");
+  if (!existsSync6(path))
+    return ["there is no package.json; vectoys create writes one"];
+  let pkg;
+  try {
+    pkg = JSON.parse(readFileSync6(path, "utf8"));
+  } catch {
+    return ["package.json is not valid JSON"];
+  }
+  if (!isRecord(pkg))
+    return ["package.json is not an object"];
+  const description = typeof pkg.description === "string" ? pkg.description : "";
+  const inRepo = { ...itemPackage(item.name, description, true) };
+  const outside = { ...itemPackage(item.name, description, false) };
+  return [...new Set([...Object.keys(inRepo), ...Object.keys(pkg)])].flatMap((key) => {
+    if (!(key in inRepo))
+      return [`package.json has ${key}, which items may not have`];
+    const fits = key === "dependencies" || key === "devDependencies" ? versionsFit(pkg[key], inRepo[key], outside[key]) : canonical(pkg[key]) === canonical(inRepo[key]);
+    return fits ? [] : [`package.json's ${key} is not what vectoys create writes`];
+  });
+}
 function readItem(dir) {
   const path = join6(dir, "item.json");
   if (!existsSync6(path))
@@ -836,22 +1120,39 @@ function checks(dir) {
   if (typeof item === "string")
     return [{ pass: false, line: item }];
   const results = [{ pass: true, line: "item.json has what the registry needs" }];
+  const config = [...configFiles(dir).map((file) => `the folder has ${file}, which items may not have`), ...tsconfigProblems(dir), ...packageProblems(dir, item)];
+  if (config.length)
+    return [...results, ...config.map((line) => ({ pass: false, line }))];
   const size = item.files.reduce((sum, file) => sum + lstatSync(resolve4(dir, file)).size, 0);
   const kb = (bytes) => `${(bytes / 1024).toFixed(1)} KB`;
   results.push({ pass: size < MAX_SOURCE, line: `the files are ${kb(size)}, ${size < MAX_SOURCE ? "under" : "over"} ${kb(MAX_SOURCE)}` });
   const named = brands([item.name, item.title, item.description].join(" "));
   results.push({ pass: named.length === 0, line: named.length ? `item.json names brands: ${named.join(", ")}` : "item.json names no brands" });
-  const component = componentFile(item);
-  if (!component)
-    return [...results, { pass: false, line: "files lists no .tsx component to render" }];
-  const rendered = render(resolve4(dir, component), dir, componentName(item.name));
+  const read = sources(dir, [...new Set([...item.files, ...codeFiles(dir)])]);
+  const unsafe = typeof read === "string" ? [`bun could not read the files: ${read}`] : safety(read, item);
+  if (unsafe.length)
+    return [...results, ...unsafe.map((line) => ({ pass: false, line }))];
+  results.push({ pass: true, line: "the code uses no scripts, eval, network calls or outside imports that check can see" });
+  const component = `src/${item.name}.tsx`;
+  const wanted = componentName(item.name);
+  const shape = { pass: false, line: `the component must be ${component} exporting ${wanted}` };
+  if (!item.files.includes(component))
+    return [...results, shape];
+  const rendered = render(resolve4(dir, component), dir, wanted);
   if ("error" in rendered)
     return [...results, { pass: false, line: `${component} does not render on the server: ${rendered.error}` }];
+  if (rendered.name !== wanted)
+    return [...results, shape];
   const [html, again] = rendered.html;
   results.push({ pass: true, line: `${rendered.name} renders on the server` });
   const broken = ["NaN", "Infinity"].filter((word) => html.includes(word));
   results.push({ pass: broken.length === 0, line: broken.length ? `the markup has ${broken.join(" and ")} in it` : "the markup has no NaN or Infinity" });
   results.push({ pass: html === again, line: html === again ? "two renders give the same markup" : "two renders give different markup" });
+  const outside = markupSafety(html);
+  if (outside.length)
+    results.push(...outside.map((line) => ({ pass: false, line })));
+  else
+    results.push({ pass: true, line: "the markup has no scripts or outside links" });
   const shown = brands(textOf(html));
   results.push({ pass: shown.length === 0, line: shown.length ? `the rendered text names brands: ${shown.join(", ")}` : "the rendered text names no brands" });
   const name = accessibleName(html);
@@ -1010,7 +1311,7 @@ function openPullRequest(change, runner, cwd) {
     const clone = join8(work, "vectoys");
     must(runner, "gh", ["repo", "clone", `${login}/vectoys`, clone, "--", "--depth", "1"], work);
     must(runner, "git", ["checkout", "-b", change.branch], clone);
-    change.write(clone);
+    change.write(clone, runner);
     must(runner, "git", ["add", "--all"], clone);
     must(runner, "git", ["commit", "-m", change.title], clone);
     const ref = `refs/heads/${change.branch}`;
@@ -1035,20 +1336,38 @@ function steps(change, own) {
     `Open a pull request to ${UPSTREAM} main, or update the one already open from the branch`
   ];
 }
+var CI_BUN = "1.3.14";
+var MIN_BUN = "1.3.2";
+var OLD_BUN = `Update bun to ${CI_BUN}, the version CI uses, and submit again.`;
+function atLeast(have, want) {
+  const parts = (version2) => (/^(\d+)\.(\d+)\.(\d+)/.exec(version2) ?? []).slice(1).map(Number);
+  const [a, b] = [parts(have), parts(want)];
+  if (a.length !== 3)
+    return false;
+  for (let at = 0;at < 3; at++)
+    if ((a[at] ?? 0) !== (b[at] ?? 0))
+      return (a[at] ?? 0) > (b[at] ?? 0);
+  return true;
+}
+function needBun(runner, cwd) {
+  const version2 = must(runner, "bun", ["--version"], cwd);
+  if (!atLeast(version2, MIN_BUN))
+    throw new Error(`bun ${version2} is older than ${MIN_BUN} and rewrites bun.lock beyond the item's lines. ${OLD_BUN}`);
+}
 function itemFiles(dir, listed) {
-  const extra = ["package.json", "tsconfig.json", "test"].filter((path) => existsSync8(join8(dir, path)));
+  const extra = ["package.json", "tsconfig.json", "src/index.ts", "test"].filter((path) => existsSync8(join8(dir, path)));
   return [...new Set(["item.json", ...listed, ...extra])];
 }
-var isRecord = (value) => typeof value === "object" && value !== null && !Array.isArray(value);
+var isRecord2 = (value) => typeof value === "object" && value !== null && !Array.isArray(value);
 function inRepoForm(folder) {
   const pkgPath = join8(folder, "package.json");
   if (existsSync8(pkgPath)) {
     const pkg = JSON.parse(readFileSync8(pkgPath, "utf8"));
-    if (!isRecord(pkg))
+    if (!isRecord2(pkg))
       throw new Error("The item's package.json is not an object.");
     for (const field of ["dependencies", "devDependencies", "peerDependencies"]) {
       const deps = pkg[field];
-      if (!isRecord(deps))
+      if (!isRecord2(deps))
         continue;
       for (const name of Object.keys(deps))
         if (name.startsWith("@vectoys/") || name === "@vinena/vectoys" || name.startsWith("@vinena/vectoys-"))
@@ -1062,9 +1381,9 @@ function inRepoForm(folder) {
   const tsPath = join8(folder, "tsconfig.json");
   if (existsSync8(tsPath)) {
     const tsconfig = JSON.parse(readFileSync8(tsPath, "utf8"));
-    if (!isRecord(tsconfig))
+    if (!isRecord2(tsconfig))
       throw new Error("The item's tsconfig.json is not an object.");
-    const own = isRecord(tsconfig.compilerOptions) ? tsconfig.compilerOptions : {};
+    const own = isRecord2(tsconfig.compilerOptions) ? tsconfig.compilerOptions : {};
     const kept = Object.fromEntries(Object.entries(own).filter(([key]) => !(key in compilerOptions2)));
     writeFileSync6(tsPath, `${JSON.stringify({ extends: BASE_TSCONFIG, ...tsconfig, compilerOptions: kept }, null, 2)}
 `);
@@ -1102,14 +1421,19 @@ function itemChange(context, dir) {
     branch,
     title,
     body,
-    steps: steps({ branch, title }, [`Copy ${files.join(", ")} into registry/${item.name}/`]),
-    write: (clone) => {
+    steps: steps({ branch, title }, [`Copy ${files.join(", ")} into registry/${item.name}/`, "Add the item's package to bun.lock with bun install --lockfile-only"]),
+    write: (clone, runner) => {
       for (const file of files) {
         const to = join8(clone, "registry", item.name, file);
         mkdirSync3(dirname5(to), { recursive: true });
         cpSync(join8(dir, file), to, { recursive: true });
       }
       inRepoForm(join8(clone, "registry", item.name));
+      must(runner, "bun", ["install", "--lockfile-only", "--ignore-scripts"], clone);
+      const deleted = must(runner, "git", ["diff", "--numstat", "bun.lock"], clone).split(`
+`).some((line) => Number(line.split("\t")[1]) > 0);
+      if (deleted)
+        throw new Error(`bun ${must(runner, "bun", ["--version"], clone)} rewrote bun.lock beyond the item's lines. ${OLD_BUN}`);
     }
   };
 }
@@ -1139,22 +1463,22 @@ function isListings(value) {
   return Array.isArray(value) && value.every((entry) => typeof entry === "object" && entry !== null && ("name" in entry) && typeof entry.name === "string");
 }
 async function listingChange(context, given, runner) {
-  const { index, base } = registryUrls(given);
+  const { index, base: base2 } = registryUrls(given);
   context.log(`Reading ${index}`);
   const read = readIndex(await fetchJson(index));
   if (typeof read === "string")
     throw new Error(`${index} is not a vectoys registry index: ${read}.`);
   const { items } = read;
-  const name = read.name ?? new URL(base).hostname;
+  const name = read.name ?? new URL(base2).hostname;
   context.log(`  pass  it lists ${items} item${items === 1 ? "" : "s"}`);
   const author = runner("git", ["config", "user.name"], context.cwd).stdout.trim();
   if (!author)
     throw new Error('Set your name for git first, as git config --global user.name "Your Name".');
-  const listing = { name, url: base, author };
+  const listing = { name, url: base2, author };
   const branch = `registry/${name}`;
   const title = `List the ${name} registry`;
   const body = [
-    `Lists the ${name} registry, at ${base}, by ${author}. Its index lists ${items} item${items === 1 ? "" : "s"}.`,
+    `Lists the ${name} registry, at ${base2}, by ${author}. Its index lists ${items} item${items === 1 ? "" : "s"}.`,
     "",
     "- [ ] I run this registry, and its items draw no maker's product."
   ].join(`
@@ -1191,6 +1515,8 @@ async function submit(context, given, options) {
     context.log(CLOSED);
     return;
   }
+  if (!options.registry)
+    needBun(runner, context.cwd);
   const { url, opened } = openPullRequest(change, runner, context.cwd);
   context.log(`${opened ? "Opened" : "Updated"} ${url}`);
   return url;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vinena/vectoys-cli",
-  "version": "0.2.1",
+  "version": "0.3.0",
   "description": "Copy vectoys devices and toys into your project.",
   "license": "MIT",
   "homepage": "https://github.com/vinenastudio/vectoys#readme",