paseo-plugin-genui 0.0.0-stage → 0.1.0

package/shared/logic/icons.ts

@@ -0,0 +1,322 @@
+// BB's built-in icon names, vendored from BB's shared-ui (`CORE_ICON_MAP` keys
+// in components/ui/icon.tsx and `EXTENDED_ICON_NAMES` in icon-registry.ts).
+// BB draws any other name as its Zap fallback, so names a spec writes are
+// resolved here first: models write lucide/heroicons names in any case.
+
+const BB_ICON_NAMES = [
+  // CORE_ICON_MAP
+  "AlertCircle",
+  "AlertTriangle",
+  "Archive",
+  "Bot",
+  "Bug",
+  "Check",
+  "ChevronDown",
+  "ChevronLeft",
+  "ChevronRight",
+  "Circle",
+  "CircleCheck",
+  "CircleQuestion",
+  "CircleX",
+  "ClosePluginPane",
+  "CloseThreadPane",
+  "Code",
+  "ComputerTerminal01",
+  "Copy",
+  "Download",
+  "Edit",
+  "Filter",
+  "FilterHorizontal",
+  "Folder",
+  "FolderExport",
+  "FolderGit",
+  "FolderPlus",
+  "FolderSync",
+  "FolderUnknown",
+  "Folder02",
+  "Home",
+  "Info",
+  "ListTodo",
+  "Loading",
+  "MessageQuestion",
+  "MessageCirclePlus",
+  "MessageSquarePlus",
+  "MessageSquare",
+  "MoreHorizontal",
+  "PanelLeft",
+  "Search",
+  "SectionAdd",
+  "SectionMove",
+  "Settings",
+  "SlidersHorizontal",
+  "Spinner",
+  "Target",
+  "Terminal",
+  "Toolbox",
+  "ToolCase",
+  "Trash2",
+  "Unavailable",
+  "UserRoundPlus",
+  "Workflow",
+  "X",
+  "Zap",
+  // EXTENDED_ICON_NAMES
+  "AiBrain01",
+  "AiBrowser",
+  "AiContentGenerator01",
+  "AlignLeft",
+  "AppWindow",
+  "ArchiveRestore",
+  "ArrowDown",
+  "ArrowLeft",
+  "ArrowRight",
+  "ArrowReloadHorizontal",
+  "ArrowUp",
+  "ArrowUpDown",
+  "ArrowTurnBackward",
+  "ArrowTurnForward",
+  "ArrowUpRight",
+  "Beaker",
+  "BellDot",
+  "Browser",
+  "Brain",
+  "Calendar",
+  "CalendarCheckOut02",
+  "ChartColumn",
+  "ChevronUp",
+  "ChevronsDown",
+  "ChevronsUp",
+  "CircleArrowShrink",
+  "Clean",
+  "Clock",
+  "ClockArrowUp",
+  "ClockArrowDown",
+  "Cloud",
+  "CloudOff",
+  "ComputerCloud",
+  "Coffee",
+  "Columns2",
+  "CornerDownLeft",
+  "CornerDownRight",
+  "DiffAdded",
+  "DiffConflict",
+  "DiffModified",
+  "DiffRemoved",
+  "DiffRenamed",
+  "Discord",
+  "DiscordLogo",
+  "DateTime",
+  "Github",
+  "GithubLogo",
+  "DragDropHorizontal",
+  "DragDropVertical",
+  "EditFile",
+  "ElectricPlugs",
+  "Eye",
+  "EyeOff",
+  "Explore",
+  "ExternalLink",
+  "FileDiff",
+  "File",
+  "FileAttachment",
+  "FileQuestion",
+  "FileText",
+  "FolderOpen",
+  "FolderEdit",
+  "FolderMinus",
+  "Fork",
+  "GitBranch",
+  "GitMerge",
+  "GitPullRequest",
+  "GitPullRequestArrow",
+  "GitPullRequestClosed",
+  "GitPullRequestDraft",
+  "Globe",
+  "GridView",
+  "Keyboard",
+  "Laptop",
+  "Layers",
+  "Limitation",
+  "Link",
+  "ListEnd",
+  "ListView",
+  "Lock",
+  "Mail",
+  "MailOpen",
+  "Maximize2",
+  "Mic",
+  "Minus",
+  "Minimize2",
+  "MoveTo",
+  "NewTab",
+  "News01",
+  "PackageReceive",
+  "Palette",
+  "PanelBottom",
+  "PanelRight",
+  "Paperclip",
+  "Pause",
+  "Pin",
+  "PinOff",
+  "Play",
+  "Plug02",
+  "Plus",
+  "Puzzle",
+  "Repeat",
+  "RotateCcw",
+  "Rows2",
+  "SecurityCheck",
+  "Sent",
+  "SideChat",
+  "Smartphone",
+  "Sort",
+  "SortingAZ02",
+  "SortingZA01",
+  "SortingOneNine",
+  "SortingNineOne",
+  "Square",
+  "SquareUnlock02",
+  "Star",
+  "TextWrap",
+  "TimeSchedule",
+  "UserRound",
+  "ZoomIn",
+  "ZoomOut",
+] as const;
+
+export type BbIconName = (typeof BB_ICON_NAMES)[number];
+
+/** Every BB name keyed with case and separators dropped: "git-branch", "git_branch" and "gitBranch" all key as "gitbranch". */
+const BY_KEY: ReadonlyMap<string, BbIconName> = new Map(
+  BB_ICON_NAMES.map((name) => [name.toLowerCase(), name]),
+);
+
+/**
+ * Common lucide and heroicons names that BB spells differently, keyed the
+ * same way. Real BB names win over these (`x` is BB's X).
+ */
+const ALIASES: Record<string, BbIconName> = {
+  trash: "Trash2",
+  trashcan: "Trash2",
+  delete: "Trash2",
+  bin: "Trash2",
+  close: "CircleX",
+  cancel: "CircleX",
+  xcircle: "CircleX",
+  xmark: "X",
+  xmarkcircle: "CircleX",
+  checkmark: "Check",
+  tick: "Check",
+  checkcircle: "CircleCheck",
+  checkcircle2: "CircleCheck",
+  circlecheckbig: "CircleCheck",
+  warning: "AlertTriangle",
+  alert: "AlertTriangle",
+  trianglealert: "AlertTriangle",
+  exclamationtriangle: "AlertTriangle",
+  circlealert: "AlertCircle",
+  exclamationcircle: "AlertCircle",
+  information: "Info",
+  informationcircle: "Info",
+  circleinfo: "Info",
+  help: "CircleQuestion",
+  helpcircle: "CircleQuestion",
+  circlehelp: "CircleQuestion",
+  question: "CircleQuestion",
+  questionmarkcircle: "CircleQuestion",
+  external: "ExternalLink",
+  squarearrowoutupright: "ExternalLink",
+  arrowtoprightonsquare: "ExternalLink",
+  refresh: "ArrowReloadHorizontal",
+  reload: "ArrowReloadHorizontal",
+  refreshcw: "ArrowReloadHorizontal",
+  refreshccw: "ArrowReloadHorizontal",
+  rotatecw: "ArrowReloadHorizontal",
+  arrowpath: "ArrowReloadHorizontal",
+  undo: "ArrowTurnBackward",
+  undo2: "ArrowTurnBackward",
+  redo: "ArrowTurnForward",
+  redo2: "ArrowTurnForward",
+  pencil: "Edit",
+  pen: "Edit",
+  pencilline: "Edit",
+  squarepen: "Edit",
+  pencilsquare: "Edit",
+  cog: "Settings",
+  gear: "Settings",
+  cog6tooth: "Settings",
+  clipboard: "Copy",
+  documentduplicate: "Copy",
+  arrowdowntray: "Download",
+  send: "Sent",
+  sendhorizontal: "Sent",
+  paperairplane: "Sent",
+  add: "Plus",
+  pluscircle: "Plus",
+  circleplus: "Plus",
+  magnifyingglass: "Search",
+  branch: "GitBranch",
+  merge: "GitMerge",
+  pullrequest: "GitPullRequest",
+  console: "Terminal",
+  commandline: "Terminal",
+  squareterminal: "Terminal",
+  stop: "Square",
+  view: "Eye",
+  unlock: "SquareUnlock02",
+  lockopen: "SquareUnlock02",
+  chain: "Link",
+  date: "Calendar",
+  time: "Clock",
+  email: "Mail",
+  envelope: "Mail",
+  document: "FileText",
+  house: "Home",
+  favorite: "Star",
+  world: "Globe",
+  restore: "ArchiveRestore",
+  more: "MoreHorizontal",
+  ellipsis: "MoreHorizontal",
+  chat: "MessageSquare",
+  message: "MessageSquare",
+  comment: "MessageSquare",
+  user: "UserRound",
+  person: "UserRound",
+  robot: "Bot",
+  loader: "Loading",
+  loader2: "Loading",
+  phone: "Smartphone",
+  mobile: "Smartphone",
+  microphone: "Mic",
+  grid: "GridView",
+  list: "ListView",
+  columns: "Columns2",
+  rows: "Rows2",
+  plug: "Plug02",
+  flask: "Beaker",
+  bell: "BellDot",
+  chart: "ChartColumn",
+  barchart: "ChartColumn",
+  chartbar: "ChartColumn",
+  maximize: "Maximize2",
+  expand: "Maximize2",
+  minimize: "Minimize2",
+  collapse: "Minimize2",
+  attachment: "Paperclip",
+  bolt: "Zap",
+  lightning: "Zap",
+};
+
+/**
+ * The BB icon a spec's icon name means, or null when BB has no such icon
+ * (callers then draw nothing rather than BB's Zap fallback). Accepts any
+ * case and separator, lucide/heroicons spellings, and a trailing "Icon".
+ */
+export function resolveIconName(name: string): string | null {
+  const key = name.replace(/[-_\s.]+/g, "").toLowerCase();
+  if (key === "") return null;
+  const found = BY_KEY.get(key) ?? (Object.hasOwn(ALIASES, key) ? ALIASES[key] : undefined);
+  if (found !== undefined) return found;
+  // `TrashIcon`, `trash-icon`: the component name some icon libraries export.
+  return key.endsWith("icon") && key.length > 4 ? resolveIconName(key.slice(0, -4)) : null;
+}

package/shared/logic/json-logic.ts

@@ -0,0 +1,153 @@
+// The rows `Json` shows: only open containers contribute children, and a
+// container shows its first `shown` children followed by a "N more" row, so a
+// thousand-item array costs a hundred rows until the user asks for more.
+// Each row's id is its JSONPath (`$.items[3].name`), which is also what
+// "copy path" copies. Pure: no React, no DOM.
+import type { Value } from "../core/types";
+
+export type JsonKind = "object" | "array" | "string" | "number" | "boolean" | "null";
+
+/** Children a container shows before its "N more" row, and how many each click adds. */
+export const CHILD_PAGE = 100;
+/** Characters of a string shown before it is cut with an expand control. */
+export const STRING_PREVIEW = 160;
+
+export function jsonKind(value: Value): JsonKind {
+  if (value === null) return "null";
+  if (Array.isArray(value)) return "array";
+  switch (typeof value) {
+    case "string":
+      return "string";
+    case "number":
+      return "number";
+    case "boolean":
+      return "boolean";
+    default:
+      return "object";
+  }
+}
+
+const IDENTIFIER = /^[A-Za-z_$][\w$]*$/;
+
+/** The JSONPath of `key` under `parent`: `$.name`, `$[3]`, `$["two words"]`. */
+export function childPath(parent: string, key: string | number): string {
+  if (typeof key === "number") return `${parent}[${key}]`;
+  return IDENTIFIER.test(key) ? `${parent}.${key}` : `${parent}[${JSON.stringify(key)}]`;
+}
+
+/** A container's entries in order: indexes for arrays, own keys for objects; none for scalars. */
+export function entries(value: Value): readonly (readonly [string | number, Value])[] {
+  if (Array.isArray(value)) return value.map((item: Value, index) => [index, item] as const);
+  if (typeof value === "object" && value !== null) return Object.entries(value as Record<string, Value>);
+  return [];
+}
+
+/** `3 keys`, `1 item`, `0 items`; empty for scalars. */
+export function sizeText(value: Value): string {
+  if (typeof value !== "object" || value === null) return "";
+  const array = Array.isArray(value);
+  const count = array ? value.length : Object.keys(value).length;
+  return `${count} ${array ? "item" : "key"}${count === 1 ? "" : "s"}`;
+}
+
+/** What copying a value puts on the clipboard: strings bare, other scalars as written, containers as indented JSON. */
+export function copyText(value: Value): string {
+  if (typeof value === "string") return value;
+  if (value === null || typeof value !== "object") return String(value);
+  return JSON.stringify(value, null, 2);
+}
+
+export interface ValueRow {
+  readonly type: "value";
+  /** The JSONPath. */
+  readonly id: string;
+  readonly depth: number;
+  /** Null for the root of a scalar. */
+  readonly key: string | number | null;
+  readonly value: Value;
+  readonly kind: JsonKind;
+  readonly parent: string | null;
+  readonly position: number;
+  readonly siblings: number;
+  /** Entries of an object or array; 0 for scalars and empty containers, which do not expand. */
+  readonly children: number;
+}
+
+export interface MoreRow {
+  readonly type: "more";
+  readonly id: string;
+  readonly depth: number;
+  /** The container this row pages. */
+  readonly parent: string;
+  /** The children of `parent` already shown, which is where the next page starts. */
+  readonly shown: number;
+  readonly remaining: number;
+}
+
+export type JsonRow = ValueRow | MoreRow;
+
+/**
+ * The rows on screen. A container root is not a row of its own (its size is
+ * the caption): its entries are the top level. `isOpen(id)` says whether a
+ * container is expanded; `shown(id)` how many of its children are on screen.
+ */
+export function visibleRows(root: Value, isOpen: (id: string) => boolean, shown: (id: string) => number): JsonRow[] {
+  const rows: JsonRow[] = [];
+  const rootKind = jsonKind(root);
+  if (rootKind !== "array" && rootKind !== "object") {
+    rows.push({ type: "value", id: "$", depth: 0, key: null, value: root, kind: rootKind, parent: null, position: 1, siblings: 1, children: 0 });
+    return rows;
+  }
+  // Depth-first with an explicit stack of open containers: deep values never recurse.
+  interface Open {
+    readonly id: string;
+    readonly all: readonly (readonly [string | number, Value])[];
+    readonly limit: number;
+    readonly depth: number;
+    next: number;
+  }
+  const open = (id: string, value: Value, depth: number): Open => {
+    const all = entries(value);
+    return { id, all, limit: Math.min(all.length, Math.max(0, shown(id))), depth, next: 0 };
+  };
+  const stack: Open[] = [open("$", root, 0)];
+  while (stack.length > 0) {
+    const frame = stack[stack.length - 1];
+    if (frame.next >= frame.limit) {
+      stack.pop();
+      if (frame.limit < frame.all.length) {
+        rows.push({ type: "more", id: `${frame.id}…`, depth: frame.depth, parent: frame.id, shown: frame.limit, remaining: frame.all.length - frame.limit });
+      }
+      continue;
+    }
+    const index = frame.next++;
+    const [key, child] = frame.all[index];
+    const id = childPath(frame.id, key);
+    const kind = jsonKind(child);
+    const parent = frame.depth === 0 ? null : frame.id;
+    const children = Array.isArray(child) ? child.length : typeof child === "object" && child !== null ? Object.keys(child).length : 0;
+    rows.push({ type: "value", id, depth: frame.depth, key, value: child, kind, parent, position: index + 1, siblings: frame.all.length, children });
+    if (children > 0 && isOpen(id)) stack.push(open(id, child, frame.depth + 1));
+  }
+  return rows;
+}
+
+/**
+ * Containers open before the user touches anything. The top level always
+ * shows; below it a lone container entry opens, and so on down, so an
+ * envelope like `{data: {...}}` shows its content instead of one closed row.
+ */
+export function defaultOpen(root: Value): ReadonlySet<string> {
+  const ids = new Set<string>();
+  let id = "$";
+  let current = entries(root);
+  while (current.length === 1) {
+    const [key, child] = current[0];
+    const kind = jsonKind(child);
+    if (kind !== "array" && kind !== "object") break;
+    id = childPath(id, key);
+    ids.add(id);
+    current = entries(child);
+  }
+  return ids;
+}

package/shared/logic/mapMath.ts

@@ -0,0 +1,133 @@
+// Web Mercator math for Map: places to world coordinates, the view that fits
+// them, panning and zooming about a point, and the OpenStreetMap tiles a view
+// needs. World coordinates run 0..1 across and down; a view is the world
+// point at the viewport's centre and a fractional zoom.
+
+export const TILE_SIZE = 256;
+export const MIN_ZOOM = 1;
+/** OSM serves z19, but z18 is already street level and keeps tile counts sane. */
+export const MAX_ZOOM = 18;
+/** Mercator's square world ends here. */
+const MAX_LATITUDE = 85.05112878;
+
+export interface Point {
+  readonly x: number;
+  readonly y: number;
+}
+
+export interface View extends Point {
+  readonly zoom: number;
+}
+
+export interface Size {
+  readonly width: number;
+  readonly height: number;
+}
+
+export interface Tile {
+  /** Tile coordinates to fetch (x wrapped around the world). */
+  readonly z: number;
+  readonly x: number;
+  readonly y: number;
+  /** Unique per drawn copy, since a wide view can show the same tile twice. */
+  readonly key: string;
+  readonly left: number;
+  readonly top: number;
+  readonly size: number;
+}
+
+function clamp(value: number, min: number, max: number): number {
+  return Math.min(max, Math.max(min, value));
+}
+
+/** The world's width in pixels at `zoom`. */
+function worldSize(zoom: number): number {
+  return TILE_SIZE * 2 ** zoom;
+}
+
+/** Latitude and longitude in degrees to world coordinates. */
+export function project(lat: number, lng: number): Point {
+  const sin = Math.sin((clamp(lat, -MAX_LATITUDE, MAX_LATITUDE) * Math.PI) / 180);
+  return { x: (lng + 180) / 360, y: 0.5 - Math.log((1 + sin) / (1 - sin)) / (4 * Math.PI) };
+}
+
+/** Keeps zoom in range and, where the world is taller than the viewport, the view inside it vertically. */
+export function clampView(view: View, size: Size): View {
+  const zoom = clamp(view.zoom, MIN_ZOOM, MAX_ZOOM);
+  const half = size.height / 2 / worldSize(zoom);
+  const y = half >= 0.5 ? 0.5 : clamp(view.y, half, 1 - half);
+  // Longitude wraps; keep x in 0..1 so numbers stay small.
+  return { x: view.x - Math.floor(view.x), y, zoom };
+}
+
+/** The view showing every point with `padding` pixels to spare, zoomed in no further than `maxZoom`. */
+export function fitView(points: readonly Point[], size: Size, padding: number, maxZoom: number): View {
+  if (points.length === 0) return clampView({ x: 0.5, y: 0.5, zoom: MIN_ZOOM }, size);
+  const xs = points.map((point) => point.x);
+  const ys = points.map((point) => point.y);
+  const [minX, maxX, minY, maxY] = [Math.min(...xs), Math.max(...xs), Math.min(...ys), Math.max(...ys)];
+  const width = Math.max(1, size.width - 2 * padding);
+  const height = Math.max(1, size.height - 2 * padding);
+  const zoomFor = (span: number, pixels: number) => (span === 0 ? maxZoom : Math.log2(pixels / (span * TILE_SIZE)));
+  const zoom = Math.min(maxZoom, zoomFor(maxX - minX, width), zoomFor(maxY - minY, height));
+  return clampView({ x: (minX + maxX) / 2, y: (minY + maxY) / 2, zoom }, size);
+}
+
+/** Where `point` sits in the viewport, using its copy of the world nearest the view's centre. */
+export function toScreen(point: Point, view: View, size: Size): { readonly left: number; readonly top: number } {
+  const scale = worldSize(view.zoom);
+  const dx = point.x - view.x;
+  return {
+    left: (dx - Math.round(dx)) * scale + size.width / 2,
+    top: (point.y - view.y) * scale + size.height / 2,
+  };
+}
+
+/** The view moved by a drag of `dx`, `dy` pixels. */
+export function pan(view: View, dx: number, dy: number, size: Size): View {
+  const scale = worldSize(view.zoom);
+  return clampView({ x: view.x - dx / scale, y: view.y - dy / scale, zoom: view.zoom }, size);
+}
+
+/** The view at `zoom`, with the world point under `anchor` (viewport pixels) still under it. */
+export function zoomAround(view: View, zoom: number, anchor: { left: number; top: number }, size: Size): View {
+  const target = clamp(zoom, MIN_ZOOM, MAX_ZOOM);
+  const offsetX = anchor.left - size.width / 2;
+  const offsetY = anchor.top - size.height / 2;
+  const before = worldSize(view.zoom);
+  const after = worldSize(target);
+  const x = view.x + offsetX / before - offsetX / after;
+  const y = view.y + offsetY / before - offsetY / after;
+  return clampView({ x, y, zoom: target }, size);
+}
+
+/** The tile zoom level drawn for a view: the nearest whole level. */
+export function tileZoom(view: View): number {
+  return clamp(Math.round(view.zoom), 0, MAX_ZOOM);
+}
+
+/** The tiles at level `z` (default: the view's) covering the viewport, each with its place and drawn size. */
+export function visibleTiles(view: View, size: Size, z = tileZoom(view)): Tile[] {
+  const count = 2 ** z;
+  const scale = worldSize(view.zoom);
+  const tileSize = scale / count;
+  const left = view.x - size.width / 2 / scale;
+  const right = view.x + size.width / 2 / scale;
+  const top = view.y - size.height / 2 / scale;
+  const bottom = view.y + size.height / 2 / scale;
+  const tiles: Tile[] = [];
+  for (let ty = Math.max(0, Math.floor(top * count)); ty <= Math.min(count - 1, Math.floor(bottom * count)); ty += 1) {
+    for (let tx = Math.floor(left * count); tx <= Math.floor(right * count); tx += 1) {
+      tiles.push({
+        z,
+        x: ((tx % count) + count) % count,
+        y: ty,
+        key: `${z}/${tx}/${ty}`,
+        left: (tx / count - view.x) * scale + size.width / 2,
+        top: (ty / count - view.y) * scale + size.height / 2,
+        size: tileSize,
+      });
+    }
+  }
+  return tiles;
+}

package/shared/logic/project-logic.ts

@@ -0,0 +1,39 @@
+// Pure pieces of the Project components (projectKit.tsx and friends): the
+// polling schedule and the +/− proportion blocks.
+
+/** First wait before a live component asks BB again. */
+export const POLL_START_MS = 4_000;
+
+/** Longest wait between polls. */
+export const POLL_MAX_MS = 60_000;
+
+/**
+ * The wait before the next poll: doubles from POLL_START_MS with every answer
+ * that changed nothing, up to POLL_MAX_MS; a change starts over.
+ */
+export function pollDelay(unchangedAnswers: number): number {
+  return Math.min(POLL_MAX_MS, POLL_START_MS * 2 ** Math.max(0, unchangedAnswers));
+}
+
+/** Blocks in the proportion bar beside a file's counts (GitHub's five). */
+export const RATIO_BLOCKS = 5;
+
+/**
+ * How many blocks are green, red and grey for a file's counts: as many
+ * colored blocks as changed lines up to RATIO_BLOCKS, split by share, each
+ * side that changed keeping at least one.
+ */
+export function ratioBlocks(additions: number, deletions: number): { added: number; removed: number; neutral: number } {
+  const total = additions + deletions;
+  if (!(total > 0)) return { added: 0, removed: 0, neutral: RATIO_BLOCKS };
+  const colored = Math.min(RATIO_BLOCKS, total);
+  let added = Math.round((colored * additions) / total);
+  if (additions > 0 && added === 0) added = 1;
+  if (deletions > 0 && added === colored) added = colored - 1;
+  return { added, removed: colored - added, neutral: RATIO_BLOCKS - colored };
+}
+
+/** The answer's content without when it was read, so two reads compare equal when BB's state didn't change. */
+export function answerSignature(answer: unknown): string {
+  return JSON.stringify(answer, (key, value: unknown) => (key === "fetchedAt" || key === "takenAt" ? undefined : value));
+}