The Generative UI framework
This report summarizes scanner evidence for vercel-labs/json-render, a TypeScript project with 18,866 GitHub stars. SynthScan examined 202,911 lines of code across 1546 source files, recording 115 pattern matches distributed across 11 syntactic categories. The legacy adjusted pattern signal is 1.2 (Low pattern signal); it is not an authorship estimate.
Use the findings to ask whether maintainers can explain intent, verify dependencies, simplify unnecessary scaffolding, and focus review effort. Risk Payload v1 adds ownership, supply-chain, over-engineering, and review-effort vectors when available. These are prompts for human verification, not probabilities, security findings, or measured maintenance costs.
Use each vector to guide manual verification of the underlying findings.
Payload schema: 1.0.0 · Engine: 2.0.0 · Scoring: heuristic-density-v1 · Scan date: 2026-10-31.
Can maintainers explain intent, assumptions, and trade-offs? 55 finding(s).
Are imports declared and package/API names verified? 26 finding(s).
Are wrappers, guards, and repeated structures necessary? 59 finding(s).
Which changes need focused human review? 115 finding(s).
This chart tracks the legacy adjusted pattern score across scan runs. Changes can reflect source changes, scan coverage, or detector/scoring versions; they do not measure AI adoption or prove that a team refactored code. Compare runs only when their scoring versions are compatible. The dashed line tracks the raw pattern-hit count.
Groups findings by configured severity weight. Severity is not a confidence estimate, security rating, or proof that a package is missing. Verify imports against the project's manifests and inspect each finding in its local design context.
This horizontal bar chart shows where configured pattern scores accumulate across directories. Treat the bars as locations to inspect, not as evidence of authorship or code quality. Use the file-level findings to decide whether a directory needs a focused ownership, dependency, complexity, or review check.
The scanner identified 115 distinct pattern matches across 11 syntactic categories. Each entry below represents a discrete location in the source code where the engine recorded a detector match to inspect in context. Expand any category row to inspect the individual file paths, line numbers, code snippets, and the lexical context (CODE, COMMENT, or STRING) in which each match was detected.
Reading the findings table: The Severity column indicates the configured finding weight (CRITICAL / HIGH / MEDIUM / LOW). The Context column identifies whether the match occurred inside executable code, an inline comment, or a string literal — legacy comment-context matches receive a ×1.5 score weight. The ⚡ bolt icon marks clustered matches: three or more patterns within a 10-line window, each receiving an additional ×1.5 density multiplier under the legacy scoring model.
| Severity | File | Line | Snippet | Context |
|---|---|---|---|---|
| MEDIUM | packages/shadcn/src/components.tsx | 174 | // ── Layout ──────────────────────────────────────────────────────────── | COMMENT |
| MEDIUM | packages/shadcn/src/components.tsx | 437 | // ── Data Display ────────────────────────────────────────────────────── | COMMENT |
| MEDIUM | packages/shadcn/src/components.tsx | 665 | // ── Form Inputs ─────────────────────────────────────────────────────── | COMMENT |
| MEDIUM | packages/shadcn/src/components.tsx | 1002 | // ── Actions ─────────────────────────────────────────────────────────── | COMMENT |
| MEDIUM | packages/yaml/src/prompt.ts | 31 | // ── Zod introspection (local, minimal) ────────────────────────────────────── | COMMENT |
| MEDIUM | packages/react-three-fiber/src/components.tsx | 98 | // ── Primitives ───────────────────────────────────────────────────────── | COMMENT |
| MEDIUM | packages/react-three-fiber/src/components.tsx | 229 | // ── Lights ───────────────────────────────────────────────────────────── | COMMENT |
| MEDIUM | packages/react-three-fiber/src/components.tsx | 274 | // ── Container ────────────────────────────────────────────────────────── | COMMENT |
| MEDIUM | packages/react-three-fiber/src/components.tsx | 289 | // ── Model ────────────────────────────────────────────────────────────── | COMMENT |
| MEDIUM | packages/react-three-fiber/src/components.tsx | 304 | // ── Environment ──────────────────────────────────────────────────────── | COMMENT |
| MEDIUM | packages/react-three-fiber/src/components.tsx | 339 | // ── Text ─────────────────────────────────────────────────────────────── | COMMENT |
| MEDIUM | packages/react-three-fiber/src/components.tsx | 391 | // ── Effects / Atmosphere ────────────────────────────────────────────── | COMMENT |
| MEDIUM | packages/react-three-fiber/src/components.tsx | 449 | // ── Special Materials ─────────────────────────────────────────────── | COMMENT |
| MEDIUM | packages/react-three-fiber/src/components.tsx | 538 | // ── Extended Geometry ─────────────────────────────────────────────── | COMMENT |
| MEDIUM | packages/react-three-fiber/src/components.tsx | 577 | // ── Shadows / Staging ─────────────────────────────────────────────── | COMMENT |
| MEDIUM | packages/react-three-fiber/src/components.tsx | 654 | // ── Crazy / Magic ───────────────────────────────────────────────────── | COMMENT |
| MEDIUM | packages/react-three-fiber/src/components.tsx | 689 | // ── Post-Processing ──────────────────────────────────────────────────── | COMMENT |
| MEDIUM | packages/react-three-fiber/src/components.tsx | 740 | // ── Animation Wrappers ────────────────────────────────────────────── | COMMENT |
| MEDIUM | packages/react-three-fiber/src/components.tsx | 914 | // ── Camera / Controls ────────────────────────────────────────────── | COMMENT |
| MEDIUM | packages/react-three-fiber/src/components.tsx | 948 | // ── Gaussian Splatting ────────────────────────────────────────────── | COMMENT |
| MEDIUM | apps/web/lib/render/registry.tsx | 116 | // ── Layout ──────────────────────────────────────────────────────── | COMMENT |
| MEDIUM | apps/web/lib/render/registry.tsx | 395 | // ── Data Display ────────────────────────────────────────────────── | COMMENT |
| MEDIUM | apps/web/lib/render/registry.tsx | 820 | // ── Charts ──────────────────────────────────────────────────────── | COMMENT |
| MEDIUM | apps/web/lib/render/registry.tsx | 1000 | // ── Form Inputs ─────────────────────────────────────────────────── | COMMENT |
| MEDIUM | apps/web/lib/render/registry.tsx | 1267 | // ── Actions ─────────────────────────────────────────────────────── | COMMENT |
| MEDIUM | apps/web/lib/render/catalog.ts | 16 | // ── Layout ────────────────────────────────────────────────────────── | COMMENT |
| MEDIUM | apps/web/lib/render/catalog.ts | 134 | // ── Data Display ──────────────────────────────────────────────────── | COMMENT |
| MEDIUM | apps/web/lib/render/catalog.ts | 303 | // ── Charts ────────────────────────────────────────────────────────── | COMMENT |
| MEDIUM | apps/web/lib/render/catalog.ts | 330 | // ── Form Inputs ───────────────────────────────────────────────────── | COMMENT |
| MEDIUM | apps/web/lib/render/catalog.ts | 447 | // ── Actions ───────────────────────────────────────────────────────── | COMMENT |
| Severity | File | Line | Snippet | Context |
|---|---|---|---|---|
| HIGH | …lls/technical-writer/references/editorial-standards.md | 3 | Apply these standards to the passage and its surrounding section. They are editing criteria, not proof of authorship. A | CODE |
| HIGH | examples/stripe-app/README.md | 3 | [Stripe Apps](https://stripe.com/docs/stripe-apps) examples demonstrating how to use json-render to build dynamic, AI-ge | CODE |
| HIGH | examples/stripe-app/drawer-app/README.md | 3 | A [Stripe App](https://stripe.com/docs/stripe-apps) example demonstrating how to use json-render to build dynamic, AI-ge | CODE |
| HIGH | packages/ink/src/schema.ts | 11 | // What the AI-generated SPEC looks like | COMMENT |
| HIGH | packages/ink/src/components/standard.tsx | 18 | // Props that must never be forwarded from AI-generated specs to React/Ink elements. | COMMENT |
| HIGH | packages/ink/src/components/standard.tsx | 39 | // and block dangerous or web-only props from AI-generated specs. | COMMENT |
| HIGH | packages/svelte/src/schema.ts | 12 | // What the AI-generated SPEC looks like | COMMENT |
| HIGH | packages/react-native/src/schema.ts | 12 | // What the AI-generated SPEC looks like | COMMENT |
| HIGH | packages/vue/src/schema.ts | 12 | // What the AI-generated SPEC looks like | COMMENT |
| HIGH | packages/solid/src/schema.ts | 12 | // What the AI-generated SPEC looks like | COMMENT |
| HIGH | packages/react/src/schema.ts | 12 | // What the AI-generated SPEC looks like | COMMENT |
| HIGH | packages/remotion/src/schema.ts | 146 | // What the AI-generated SPEC looks like (timeline-based) | COMMENT |
| Severity | File | Line | Snippet | Context |
|---|---|---|---|---|
| LOW | examples/next-website-builder/lib/website-catalog.ts | 23 | brand: "Acme Inc", | CODE |
| LOW | examples/next-website-builder/lib/website-catalog.ts | 162 | brand: "Acme Inc", | CODE |
| LOW | examples/next-website-builder/lib/default-spec.ts | 6 | default: "Acme Inc", | CODE |
| LOW | examples/next-website-builder/lib/default-spec.ts | 32 | brand: "Acme Inc", | CODE |
| LOW | examples/next-website-builder/lib/default-spec.ts | 48 | brand: "Acme Inc", | CODE |
| LOW | examples/react-pdf/lib/examples.ts | 24 | props: { title: "Invoice #1042", author: "Acme Corp", subject: null }, | CODE |
| LOW | examples/react-pdf/lib/examples.ts | 68 | text: "Acme Corp", | CODE |
| LOW | examples/react-pdf/lib/examples.ts | 163 | text: "Acme Corp", | CODE |
| LOW | examples/react-pdf/lib/examples.ts | 1089 | author: "Acme Corp", | CODE |
| LOW | examples/react-pdf/lib/examples.ts | 1144 | text: "Acme Corp", | CODE |
| LOW | examples/no-ai/lib/examples.ts | 587 | placeholder: "Jane Doe", | CODE |
| LOW | packages/directives/src/directives.test.ts | 227 | ).toBe("John Doe"); | CODE |
| LOW | packages/shadcn-svelte/src/catalog.ts | 209 | example: { name: "Jane Doe", size: "md" }, | CODE |
| LOW | packages/core/README.md | 400 | "placeholder": "Email" | CODE |
| LOW | packages/core/src/props.test.ts | 526 | ).toBe("Jane Doe"); | CODE |
| LOW | packages/vue/README.md | 157 | "placeholder": "Enter name" | CODE |
| LOW | packages/vue/src/dynamic-forms.test.ts | 218 | expect(wrapper.find("[data-testid='text']").text()).toBe("Jane Doe"); | CODE |
| LOW | packages/react-pdf/src/catalog.ts | 23 | example: { title: "Invoice #1234", author: "Acme Corp" }, | CODE |
| LOW | packages/shadcn/src/catalog.ts | 212 | example: { name: "Jane Doe", size: "md" }, | CODE |
| LOW | packages/solid/src/dynamic-forms.test.tsx | 363 | expect(screen.getByTestId("text").textContent).toBe("Jane Doe"); | CODE |
| LOW | packages/react/README.md | 148 | "placeholder": "Enter name" | CODE |
| LOW | packages/react/src/dynamic-forms.test.tsx | 217 | expect(screen.getByTestId("text").textContent).toBe("Jane Doe"); | CODE |
| LOW | skills/react-native/SKILL.md | 128 | "placeholder": "Email" | CODE |
| LOW | skills/react/SKILL.md | 161 | "placeholder": "Email" | CODE |
| LOW | apps/web/lib/render/catalog.ts | 201 | example: { name: "Jane Doe", size: "md" }, | CODE |
| Severity | File | Line | Snippet | Context |
|---|---|---|---|---|
| LOW | examples/chat/components/ui/chart.tsx | 312 | function getPayloadConfigFromPayload( | CODE |
| LOW | examples/game-engine/components/game/player.tsx | 271 | function AnimatedCharacterModelInner({ | CODE |
| LOW | examples/game-engine/lib/defaults.ts | 37 | export function createDefaultAmbientLight(): SceneObject { | CODE |
| LOW | examples/game-engine/lib/defaults.ts | 66 | export function createDefaultDirectionalLight(): SceneObject { | CODE |
| LOW | examples/game-engine/lib/defaults.ts | 123 | export function createDefaultSceneSettings(): SceneSettings { | CODE |
| LOW | examples/game-engine/lib/defaults.ts | 143 | export function createDefaultEnvironmentSettings(): EnvironmentSettings { | CODE |
| LOW | examples/dashboard/components/ui/chart.tsx | 312 | function getPayloadConfigFromPayload( | CODE |
| LOW | packages/ink/src/renderer.tsx | 496 | function ConfirmationDialogManager() { | CODE |
| LOW | packages/svelte/src/contexts/ValidationProvider.svelte | 56 | export function getOptionalValidationContext(): ValidationContext | null { | CODE |
| LOW | packages/core/src/schema.ts | 484 | function buildZodSchemaFromDefinition( | CODE |
| LOW | packages/core/src/schema.ts | 1188 | function generateExamplePropsFromZod( | CODE |
| LOW | packages/core/src/schema.test.ts | 706 | function allObjectsHaveAdditionalPropertiesFalse(obj: unknown): boolean { | CODE |
| LOW | packages/core/src/schema.test.ts | 717 | function allObjectPropertiesRequired(obj: unknown): boolean { | CODE |
| LOW | packages/core/src/schema.test.ts | 799 | function noAdditionalPropertiesSchema(obj: unknown): boolean { | CODE |
| LOW | packages/core/src/devtools-flag.ts | 59 | function notifyDevtoolsActiveChange() { | CODE |
| LOW | packages/core/src/types.ts | 332 | export function resolveRepeatItemStatePath( | CODE |
| LOW | packages/core/src/types.ts | 1104 | export function createJsonRenderTransform(): TransformStream< | CODE |
| LOW | packages/react-native/src/renderer.tsx | 493 | function ConfirmationDialogManager() { | CODE |
| LOW | packages/react-native/src/components/standard.tsx | 969 | export function createStandardActionHandlers(options?: { | CODE |
| LOW | packages/vue/src/renderer.ts | 196 | async function resolveAndExecuteBindings( | CODE |
| LOW | packages/solid/src/renderer.tsx | 597 | function ConfirmationDialogManager() { | CODE |
| LOW | packages/mcp/src/server.ts | 73 | export async function registerJsonRenderResource( | CODE |
| LOW | packages/codegen/src/traverse.ts | 127 | function collectPathsFromCondition( | CODE |
| LOW | packages/react/src/renderer.tsx | 1010 | function ConfirmationDialogManager() { | CODE |
| LOW | apps/web/lib/jev/response.ts | 24 | export function createCompositionResponse( | CODE |
| Severity | File | Line | Snippet | Context |
|---|---|---|---|---|
| LOW | examples/chat/lib/tools/weather.ts | 18 | // Step 1: Geocode the city name to coordinates | COMMENT |
| LOW | examples/chat/lib/tools/weather.ts | 42 | // Step 2: Get weather data | COMMENT |
| LOW | examples/svelte-chat/src/lib/tools/weather.ts | 18 | // Step 1: Geocode the city name to coordinates | COMMENT |
| LOW | examples/svelte-chat/src/lib/tools/weather.ts | 42 | // Step 2: Get weather data | COMMENT |
| LOW | skills/skill-creator/SKILL.md | 215 | ### Step 1: Understanding the Skill with Concrete Examples | COMMENT |
| LOW | skills/skill-creator/SKILL.md | 232 | ### Step 2: Planning the Reusable Skill Contents | COMMENT |
| LOW | skills/skill-creator/SKILL.md | 256 | ### Step 3: Initializing the Skill | COMMENT |
| LOW | skills/skill-creator/SKILL.md | 279 | ### Step 4: Edit the Skill | COMMENT |
| LOW | skills/skill-creator/SKILL.md | 320 | ### Step 5: Packaging a Skill | COMMENT |
| LOW | skills/skill-creator/SKILL.md | 347 | ### Step 6: Iterate | COMMENT |
| Severity | File | Line | Snippet | Context |
|---|---|---|---|---|
| LOW | examples/chat/lib/tools/weather.ts | 18 | // Step 1: Geocode the city name to coordinates | COMMENT |
| LOW | examples/chat/lib/tools/weather.ts | 42 | // Step 2: Get weather data | COMMENT |
| LOW | examples/svelte-chat/src/lib/tools/weather.ts | 18 | // Step 1: Geocode the city name to coordinates | COMMENT |
| LOW | examples/svelte-chat/src/lib/tools/weather.ts | 42 | // Step 2: Get weather data | COMMENT |
| Severity | File | Line | Snippet | Context |
|---|---|---|---|---|
| LOW | skills/skill-creator/scripts/init_skill.py | 217 | except Exception as e: | CODE |
| LOW | skills/skill-creator/scripts/init_skill.py | 232 | except Exception as e: | CODE |
| LOW | skills/skill-creator/scripts/init_skill.py | 259 | except Exception as e: | CODE |
| LOW | skills/skill-creator/scripts/package_skill.py | 80 | except Exception as e: | CODE |
| Severity | File | Line | Snippet | Context |
|---|---|---|---|---|
| LOW | packages/core/src/devtools-flag.ts | 1 | // ============================================================================= | COMMENT |
| LOW | packages/core/src/action-observer.ts | 1 | // ============================================================================= | COMMENT |
| Severity | File | Line | Snippet | Context |
|---|---|---|---|---|
| LOW | skills/skill-creator/scripts/init_skill.py | 208 | # Check if directory already exists | COMMENT |
| Severity | File | Line | Snippet | Context |
|---|---|---|---|---|
| LOW | skills/skill-creator/scripts/package_skill.py | 19 | CODE |
| Severity | File | Line | Snippet | Context |
|---|---|---|---|---|
| LOW | skills/skill-creator/scripts/quick_validate.py | 7 | CODE |