tsquare 0.3.0 → 0.3.1

package/dist/catalog.d.ts

@@ -1035,21 +1035,3 @@ export declare function listItemEnds(p: {
     leading: string | undefined;
     trailing: string | undefined;
 };
-/**
- * Props renamed in 0.3.0, still accepted under their old names so existing
- * wireframes and render URLs keep working. The prompt, docs and autocomplete
- * only teach the new names, and `tsquare fmt` rewrites the old ones.
- */
-export declare const RENAMED_PROPS: Record<string, Record<string, string>>;
-/** Rewrites renamed props to their current names, in place. Safe to call more than once. */
-export declare function upgradeRenamedProps(spec: {
-    elements: Record<string, {
-        type: string;
-        props?: Record<string, unknown>;
-    }>;
-}): {
-    elements: Record<string, {
-        type: string;
-        props?: Record<string, unknown>;
-    }>;
-};

package/dist/chunks/{chunk-46MGJLGB.js → chunk-YCIRLKKD.js}

@@ -139,8 +139,25 @@ function iconNode(name) {
   return table[pascal(name)];
 }
 var isIcon = (name) => iconNode(name) !== void 0;
-function suggestIcons(name, limit = 3) {
+var GUESSES = {
+  call: ["phone"],
+  compose: ["square-pen", "pencil"],
+  person: ["user"],
+  bag: ["shopping-bag"],
+  notification: ["bell"],
+  notifications: ["bell"],
+  profile: ["user", "circle-user"],
+  envelope: ["mail"],
+  close: ["x"]
+};
+var DIRECTIONS = ["right", "left", "down", "up"];
+var directionRank = (n) => {
+  const i = DIRECTIONS.indexOf(n.split("-").pop());
+  return i < 0 ? DIRECTIONS.length : i;
+};
+function suggestIcons(name, limit = 4) {
   const q = name.toLowerCase().replace(/[_ ]/g, "-");
+  const guessed = GUESSES[q] ?? [];
   const words = q.split("-").filter((w) => w.length > 2);
   const maxEdits = Math.max(1, Math.floor(q.length / 3));
   const scored = [];
@@ -152,7 +169,8 @@ function suggestIcons(name, limit = 3) {
     const score = Math.min(wordScore, d <= maxEdits ? 3 * d / q.length : Infinity);
     if (score < Infinity) scored.push([n, score]);
   }
-  return scored.sort((a, b) => a[1] - b[1] || a[0].localeCompare(b[0])).slice(0, limit).map(([n]) => n);
+  const close = scored.sort((a, b) => a[1] - b[1] || directionRank(a[0]) - directionRank(b[0]) || a[0].localeCompare(b[0])).map(([n]) => n);
+  return [.../* @__PURE__ */ new Set([...guessed, ...close])].slice(0, limit);
 }
 function unknownIconMessage(name) {
   const close = suggestIcons(name);
@@ -514,23 +532,6 @@ function listItemEnds(p) {
     trailing: p.trailing ?? (p.trailingIcon ? "icon" : p.trailingText ? "text" : void 0)
   };
 }
-var RENAMED_PROPS = {
-  Button: { icon: "leadingIcon" },
-  ListItem: { icon: "leadingIcon" }
-};
-function upgradeRenamedProps(spec) {
-  for (const el of Object.values(spec.elements)) {
-    const renames = RENAMED_PROPS[el.type];
-    if (!renames || !el.props) continue;
-    for (const [from, to] of Object.entries(renames)) {
-      if (from in el.props) {
-        if (!(to in el.props)) el.props[to] = el.props[from];
-        delete el.props[from];
-      }
-    }
-  }
-  return spec;
-}
 
 // src/components.tsx
 import React, { Children, cloneElement, isValidElement } from "react";
@@ -1629,7 +1630,7 @@ function parseWireframeText(source) {
         if (t.kind !== "sym" && (c.isSym("=", 1) || c.isSym(":", 1))) {
           c.next();
           c.next();
-          const key = RENAMED_PROPS[info.name]?.[t.value] ?? t.value;
+          const key = t.value;
           if (!(key in info.props)) {
             const elsewhere = belongsElsewhere(info.name, key, true);
             issues.push({ line: lineNo, message: `${info.name} has no prop "${key}"` + (elsewhere ? `: ${elsewhere}` : "") + ` (its props: ${Object.keys(info.props).join(", ")})` });
@@ -1687,6 +1688,122 @@ function parseWireframeText(source) {
   return { spec: root ? { root, elements } : null, issues, lines };
 }
 
+// src/upgrade.ts
+var RENAMED_PROPS = {
+  Button: { icon: "leadingIcon" },
+  ListItem: { icon: "leadingIcon" }
+};
+var RENAMED_BY_WORD = new Map(Object.entries(RENAMED_PROPS).map(([type, renames]) => [type.toLowerCase(), renames]));
+function upgradeWireframe(text, options = {}) {
+  const lines = text.replace(/\r\n?/g, "\n").split("\n");
+  const out = [];
+  for (const line of lines) {
+    const trimmed = line.trim();
+    const component = trimmed.match(/^([A-Za-z][\w-]*)/)?.[1];
+    if (!component || trimmed.startsWith("```")) {
+      out.push(line);
+      continue;
+    }
+    const tokens = scanLine(line, component.length + (line.length - line.trimStart().length));
+    let upgraded = line;
+    let comment = "";
+    if (options.fromLink) {
+      const hash = tokens.find((t) => t.kind === "word" && t.depth === 0 && upgraded[t.start] === "#" && !t.afterEquals);
+      if (hash && !fillsMainText(component, tokens, hash)) {
+        comment = upgraded.slice(hash.start).trimEnd();
+        upgraded = upgraded.slice(0, hash.start).trimEnd();
+      }
+    }
+    const renames = RENAMED_BY_WORD.get(component.toLowerCase().replace(/[-_]/g, ""));
+    if (renames) {
+      for (const t of [...tokens].reverse()) {
+        if (t.kind === "key" && t.depth === 0 && t.start < upgraded.length && renames[t.text]) {
+          upgraded = upgraded.slice(0, t.start) + renames[t.text] + upgraded.slice(t.start + t.text.length);
+        }
+      }
+    }
+    if (comment) out.push(line.slice(0, line.length - line.trimStart().length) + comment);
+    out.push(upgraded);
+  }
+  return out.join("\n");
+}
+function upgradeSpec(spec) {
+  for (const el of Object.values(spec.elements)) {
+    const renames = RENAMED_PROPS[el.type];
+    if (!renames || !el.props) continue;
+    for (const [from, to] of Object.entries(renames)) {
+      if (from in el.props) {
+        if (!(to in el.props)) el.props[to] = el.props[from];
+        delete el.props[from];
+      }
+    }
+  }
+  return spec;
+}
+var PLAIN_WORD_MAIN_TEXT = ["avatar", "icon"];
+function fillsMainText(component, tokens, hash) {
+  if (!PLAIN_WORD_MAIN_TEXT.includes(component.toLowerCase())) return false;
+  for (const t of tokens) {
+    if (t === hash) return true;
+    if (t.depth > 0 || t.afterEquals || t.kind === "key") continue;
+    return false;
+  }
+  return false;
+}
+function scanLine(line, from) {
+  const tokens = [];
+  let depth = 0;
+  let afterEquals = false;
+  let i = from;
+  while (i < line.length) {
+    const c = line[i];
+    if (c === " " || c === "	") {
+      i++;
+      continue;
+    }
+    if (c === '"' || c === "'") {
+      let j2 = i + 1;
+      while (j2 < line.length && line[j2] !== c) j2 += line[j2] === "\\" ? 2 : 1;
+      tokens.push({ kind: "string", text: line.slice(i, j2 + 1), start: i, depth, afterEquals });
+      afterEquals = false;
+      i = j2 + 1;
+      continue;
+    }
+    if (c === "[" || c === "{") {
+      depth++;
+      afterEquals = false;
+      i++;
+      continue;
+    }
+    if (c === "]" || c === "}") {
+      depth = Math.max(0, depth - 1);
+      afterEquals = false;
+      i++;
+      continue;
+    }
+    if (c === ",") {
+      afterEquals = false;
+      i++;
+      continue;
+    }
+    if (c === "=" || c === ":") {
+      afterEquals = true;
+      i++;
+      continue;
+    }
+    let j = i;
+    while (j < line.length && !` 	,=[]{}":`.includes(line[j])) j++;
+    const text = line.slice(i, j);
+    let k = j;
+    while (line[k] === " " || line[k] === "	") k++;
+    const isKey = !afterEquals && (line[k] === "=" || line[k] === ":");
+    tokens.push({ kind: isKey ? "key" : "word", text, start: i, depth, afterEquals });
+    afterEquals = false;
+    i = j;
+  }
+  return tokens;
+}
+
 // src/render.ts
 import { readFile } from "node:fs/promises";
 import { createRequire } from "node:module";
@@ -1711,8 +1828,19 @@ var SpecError = class extends Error {
   }
   issues;
 };
+function listItemKindHint(el, path) {
+  const prop = path[0];
+  if (el.type !== "ListItem" || path.length !== 1 || prop !== "leadingIcon" && prop !== "trailingIcon") return void 0;
+  const side = prop === "leadingIcon" ? "leading" : "trailing";
+  const value = String(el.props?.[prop]);
+  let schema = componentDefinitions.ListItem.props.shape[side];
+  while (schema && ["optional", "nullable", "default"].includes(schema.def?.type)) schema = schema.def.innerType;
+  const kinds = schema?.options ?? [];
+  if (value === "icon" || !kinds.includes(value)) return void 0;
+  return `${value} is a ${side} kind, not an icon name: write ${side}=${value} instead of ${prop}=${value}`;
+}
 function checkSpec(spec) {
-  upgradeRenamedProps(spec);
+  upgradeSpec(spec);
   const issues = [];
   const result = catalog.validate(spec);
   if (!result.success) {
@@ -1738,7 +1866,7 @@ function checkSpec(spec) {
       const parsed = def.props.safeParse(el.props ?? {});
       if (!parsed.success) {
         for (const i of parsed.error.issues) {
-          issues.push(`${id}.props${i.path.length ? "." + i.path.join(".") : ""}: ${i.message}`);
+          issues.push(`${id}.props${i.path.length ? "." + i.path.join(".") : ""}: ${listItemKindHint(el, i.path) ?? i.message}`);
         }
       }
       for (const key of Object.keys(el.props ?? {})) {
@@ -1826,7 +1954,7 @@ function boardSize(spec) {
   return { width, height };
 }
 async function renderWireframeSvg(spec, opts = {}) {
-  upgradeRenamedProps(spec);
+  upgradeSpec(spec);
   if (!opts.skipValidation) {
     const issues = checkSpec(spec);
     if (issues.length) throw new SpecError(issues);
@@ -1849,7 +1977,7 @@ async function renderWireframePng(spec, opts = {}) {
 
 // src/compile.ts
 function compileWireframe(source) {
-  const parsed = parseWireframeText(source);
+  const parsed = parseWireframeText(upgradeWireframe(source));
   const issues = [...parsed.issues];
   if (parsed.spec) {
     for (const msg of checkSpec(parsed.spec)) {
@@ -2110,6 +2238,9 @@ export {
   PRIMARY_PROP,
   bareWords,
   parseWireframeText,
+  RENAMED_PROPS,
+  upgradeWireframe,
+  upgradeSpec,
   checkSpec,
   boardLayout,
   boardSize,

package/dist/cli.js

@@ -6,7 +6,7 @@ import {
   printWireframeText,
   renderWireframe,
   wireframePrompt
-} from "./chunks/chunk-46MGJLGB.js";
+} from "./chunks/chunk-YCIRLKKD.js";
 
 // src/cli.ts
 import { readFile, writeFile } from "node:fs/promises";

package/dist/icons.d.ts

@@ -4,9 +4,8 @@ export declare const iconNames: string[];
 export declare function iconNode(name: string): any;
 export declare const isIcon: (name: string) => boolean;
 /**
- * Close matches for an unknown name: near spellings ("serach" → search) and names that
- * share a word with it ("cart" → shopping-cart, "call" → phone-call).
- * There are no synonyms: "notification" won't find bell.
+ * Close matches for an unknown name: known guesses ("compose" → square-pen), near spellings
+ * ("serach" → search) and names that share a word with it ("cart" → shopping-cart).
  */
 export declare function suggestIcons(name: string, limit?: number): string[];
 export declare function unknownIconMessage(name: string): string;

package/dist/index.d.ts

@@ -3,6 +3,7 @@ export { renderWireframe, compileWireframe, formatIssues, WireframeError, type C
 export { wireframePrompt, repairPrompt } from "./prompt.js";
 export { printWireframeText as formatWireframe } from "./print.js";
 export { encodeWireframe, decodeWireframe, MAX_SHARED_TEXT } from "./share.js";
+export { upgradeWireframe, upgradeSpec, RENAMED_PROPS, type UpgradeOptions } from "./upgrade.js";
 export { renderWireframeSvg, renderWireframePng, checkSpec, boardSize, boardLayout, type BoardItem, type RenderWireframeOptions } from "./render.js";
 export { parseWireframeText, type TextIssue, type ParseResult } from "./text.js";
 export { catalog, componentDefinitions } from "./catalog.js";

package/dist/index.js

@@ -1,5 +1,6 @@
 import {
   DEVICES,
+  RENAMED_PROPS,
   WireframeError,
   boardLayout,
   boardSize,
@@ -16,8 +17,10 @@ import {
   renderWireframeSvg,
   repairPrompt,
   theme,
+  upgradeSpec,
+  upgradeWireframe,
   wireframePrompt
-} from "./chunks/chunk-46MGJLGB.js";
+} from "./chunks/chunk-YCIRLKKD.js";
 
 // src/share.ts
 import { deflateRawSync, inflateRawSync } from "node:zlib";
@@ -27,11 +30,13 @@ function encodeWireframe(text) {
 }
 function decodeWireframe(data) {
   if (!data.startsWith("z")) throw new Error(`unknown encoding "${data.slice(0, 1)}" (expected a "z" prefix)`);
-  return inflateRawSync(Buffer.from(data.slice(1), "base64url"), { maxOutputLength: MAX_SHARED_TEXT }).toString("utf8");
+  const text = inflateRawSync(Buffer.from(data.slice(1), "base64url"), { maxOutputLength: MAX_SHARED_TEXT }).toString("utf8");
+  return upgradeWireframe(text, { fromLink: true });
 }
 export {
   DEVICES,
   MAX_SHARED_TEXT,
+  RENAMED_PROPS,
   WireframeError,
   boardLayout,
   boardSize,
@@ -50,5 +55,7 @@ export {
   renderWireframeSvg,
   repairPrompt,
   theme,
+  upgradeSpec,
+  upgradeWireframe,
   wireframePrompt
 };

package/dist/playground/index.js

@@ -11,7 +11,7 @@ import {
   renderWireframePng,
   renderWireframeSvg,
   wireframePrompt
-} from "../chunks/chunk-46MGJLGB.js";
+} from "../chunks/chunk-YCIRLKKD.js";
 
 // src/playground/index.ts
 import { createServer } from "node:http";