mirror of
https://github.com/vercel-labs/json-render.git
synced 2026-10-02 12:00:58 +08:00
Compare commits
6
Commits
| Author | SHA1 | Date | |
|---|---|---|---|
 Chris Tate
|
45c5d02179 | ||
|
Chris Tate
|
3cbd88f198 | ||
|
Chris Tate
|
e47967da5d | ||
|
Chris Tate
|
4dc8d2d5d2 | ||
|
Chris Tate
|
0e6f2afc6c | ||
|
Chris Tate
|
bccedc2459 |
+2
-9
@@ -6,11 +6,8 @@ node_modules
|
||||
.pnp.js
|
||||
|
||||
# Local env files
|
||||
.env
|
||||
.env.local
|
||||
.env.development.local
|
||||
.env.test.local
|
||||
.env.production.local
|
||||
.env*
|
||||
!.env.example
|
||||
|
||||
# Testing
|
||||
coverage
|
||||
@@ -44,10 +41,6 @@ yarn-error.log*
|
||||
# opensrc - source code for packages
|
||||
opensrc/
|
||||
|
||||
# json-studio (separate repo)
|
||||
json-studio/
|
||||
.env*.local
|
||||
|
||||
# Stripe apps (generated from template + build artifacts)
|
||||
examples/stripe-app/*/stripe-app.json
|
||||
examples/stripe-app/*/.build
|
||||
|
||||
@@ -1,4 +1,5 @@
|
||||
export const metadata = { title: "A2UI Integration" }
|
||||
import { pageMetadata } from "@/lib/page-metadata"
|
||||
export const metadata = pageMetadata("docs/a2ui")
|
||||
|
||||
# A2UI Integration
|
||||
|
||||
|
||||
@@ -1,4 +1,5 @@
|
||||
export const metadata = { title: "Adaptive Cards Integration" }
|
||||
import { pageMetadata } from "@/lib/page-metadata"
|
||||
export const metadata = pageMetadata("docs/adaptive-cards")
|
||||
|
||||
# Adaptive Cards Integration
|
||||
|
||||
|
||||
@@ -1,4 +1,5 @@
|
||||
export const metadata = { title: "AG-UI Integration" }
|
||||
import { pageMetadata } from "@/lib/page-metadata"
|
||||
export const metadata = pageMetadata("docs/ag-ui")
|
||||
|
||||
# AG-UI Integration
|
||||
|
||||
|
||||
@@ -1,4 +1,5 @@
|
||||
export const metadata = { title: "AI SDK Integration" }
|
||||
import { pageMetadata } from "@/lib/page-metadata"
|
||||
export const metadata = pageMetadata("docs/ai-sdk")
|
||||
|
||||
# AI SDK Integration
|
||||
|
||||
|
||||
@@ -1,4 +1,5 @@
|
||||
export const metadata = { title: "@json-render/codegen API" }
|
||||
import { pageMetadata } from "@/lib/page-metadata"
|
||||
export const metadata = pageMetadata("docs/api/codegen")
|
||||
|
||||
# @json-render/codegen
|
||||
|
||||
|
||||
@@ -1,4 +1,5 @@
|
||||
export const metadata = { title: "@json-render/core API" }
|
||||
import { pageMetadata } from "@/lib/page-metadata"
|
||||
export const metadata = pageMetadata("docs/api/core")
|
||||
|
||||
# @json-render/core
|
||||
|
||||
|
||||
@@ -1,4 +1,5 @@
|
||||
export const metadata = { title: "@json-render/react-native API" }
|
||||
import { pageMetadata } from "@/lib/page-metadata"
|
||||
export const metadata = pageMetadata("docs/api/react-native")
|
||||
|
||||
# @json-render/react-native
|
||||
|
||||
|
||||
@@ -0,0 +1,423 @@
|
||||
import { pageMetadata } from "@/lib/page-metadata"
|
||||
export const metadata = pageMetadata("docs/api/react-pdf")
|
||||
|
||||
# @json-render/react-pdf
|
||||
|
||||
PDF document renderer. Turn JSON specs into PDFs using `@react-pdf/renderer`.
|
||||
|
||||
## Install
|
||||
|
||||
```bash
|
||||
npm install @json-render/core @json-render/react-pdf
|
||||
```
|
||||
|
||||
See the [React PDF example](https://github.com/vercel-labs/json-render/tree/main/examples/react-pdf) for a full working example.
|
||||
|
||||
## schema
|
||||
|
||||
The PDF element schema for document specs. Use with `defineCatalog` from core.
|
||||
|
||||
```typescript
|
||||
import { defineCatalog } from '@json-render/core';
|
||||
import { schema, standardComponentDefinitions } from '@json-render/react-pdf';
|
||||
|
||||
const catalog = defineCatalog(schema, {
|
||||
components: standardComponentDefinitions,
|
||||
});
|
||||
```
|
||||
|
||||
## Render Functions
|
||||
|
||||
Server-side functions for producing PDF output. All accept a spec and optional `RenderOptions`.
|
||||
|
||||
```typescript
|
||||
import { renderToBuffer, renderToStream, renderToFile } from '@json-render/react-pdf';
|
||||
|
||||
const buffer = await renderToBuffer(spec);
|
||||
|
||||
const stream = await renderToStream(spec);
|
||||
stream.pipe(res);
|
||||
|
||||
await renderToFile(spec, './output.pdf');
|
||||
```
|
||||
|
||||
### RenderOptions
|
||||
|
||||
```typescript
|
||||
interface RenderOptions {
|
||||
registry?: ComponentRegistry;
|
||||
includeStandard?: boolean; // default: true
|
||||
state?: Record<string, unknown>;
|
||||
}
|
||||
```
|
||||
|
||||
<table>
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Option</th>
|
||||
<th>Description</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td><code>registry</code></td>
|
||||
<td>Custom component map (merged with standard components)</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><code>includeStandard</code></td>
|
||||
<td>Include built-in standard components (default: <code>true</code>)</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><code>state</code></td>
|
||||
<td>Initial state for <code>$state</code> / <code>$cond</code> dynamic prop resolution</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
## defineRegistry
|
||||
|
||||
Create a type-safe component registry from a catalog. Components receive `{ props, children, emit, bindings, loading }`.
|
||||
|
||||
```tsx
|
||||
import { defineRegistry } from '@json-render/react-pdf';
|
||||
import { View, Text } from '@react-pdf/renderer';
|
||||
|
||||
const { registry } = defineRegistry(catalog, {
|
||||
components: {
|
||||
Badge: ({ props }) => (
|
||||
<View style={{ backgroundColor: props.color ?? '#e5e7eb', padding: 4, borderRadius: 4 }}>
|
||||
<Text style={{ fontSize: 10 }}>{props.label}</Text>
|
||||
</View>
|
||||
),
|
||||
},
|
||||
});
|
||||
|
||||
const buffer = await renderToBuffer(spec, { registry });
|
||||
```
|
||||
|
||||
## createRenderer
|
||||
|
||||
Create a standalone renderer component wired to state, actions, and validation.
|
||||
|
||||
```typescript
|
||||
import { createRenderer } from '@json-render/react-pdf';
|
||||
|
||||
const PDFRenderer = createRenderer(catalog, components);
|
||||
```
|
||||
|
||||
```typescript
|
||||
interface CreateRendererProps {
|
||||
spec: Spec | null;
|
||||
state?: Record<string, unknown>;
|
||||
onAction?: (actionName: string, params?: Record<string, unknown>) => void;
|
||||
onStateChange?: (path: string, value: unknown) => void;
|
||||
loading?: boolean;
|
||||
fallback?: ComponentRenderer;
|
||||
}
|
||||
```
|
||||
|
||||
## Renderer
|
||||
|
||||
The main component that renders a spec to `@react-pdf/renderer` elements.
|
||||
|
||||
```typescript
|
||||
interface RendererProps {
|
||||
spec: Spec | null;
|
||||
registry?: ComponentRegistry;
|
||||
includeStandard?: boolean; // default: true
|
||||
loading?: boolean;
|
||||
fallback?: ComponentRenderer;
|
||||
}
|
||||
```
|
||||
|
||||
## Standard Components
|
||||
|
||||
### Document Structure
|
||||
|
||||
#### Document
|
||||
|
||||
Top-level PDF wrapper. Must be the root element. Children must be `Page` components.
|
||||
|
||||
```typescript
|
||||
{
|
||||
title: string | null;
|
||||
author: string | null;
|
||||
subject: string | null;
|
||||
}
|
||||
```
|
||||
|
||||
#### Page
|
||||
|
||||
A page in the document with configurable size, orientation, and margins.
|
||||
|
||||
```typescript
|
||||
{
|
||||
size: "A4" | "A3" | "A5" | "LETTER" | "LEGAL" | "TABLOID" | null;
|
||||
orientation: "portrait" | "landscape" | null;
|
||||
marginTop: number | null;
|
||||
marginBottom: number | null;
|
||||
marginLeft: number | null;
|
||||
marginRight: number | null;
|
||||
backgroundColor: string | null;
|
||||
}
|
||||
```
|
||||
|
||||
### Layout
|
||||
|
||||
#### View
|
||||
|
||||
Generic container with padding, margin, background, border, and flex alignment.
|
||||
|
||||
```typescript
|
||||
{
|
||||
padding: number | null;
|
||||
paddingTop: number | null;
|
||||
paddingBottom: number | null;
|
||||
paddingLeft: number | null;
|
||||
paddingRight: number | null;
|
||||
margin: number | null;
|
||||
backgroundColor: string | null;
|
||||
borderWidth: number | null;
|
||||
borderColor: string | null;
|
||||
borderRadius: number | null;
|
||||
flex: number | null;
|
||||
alignItems: "flex-start" | "center" | "flex-end" | "stretch" | null;
|
||||
justifyContent: "flex-start" | "center" | "flex-end" | "space-between" | "space-around" | null;
|
||||
}
|
||||
```
|
||||
|
||||
#### Row
|
||||
|
||||
Horizontal flex layout with optional wrapping.
|
||||
|
||||
```typescript
|
||||
{
|
||||
gap: number | null;
|
||||
alignItems: "flex-start" | "center" | "flex-end" | "stretch" | null;
|
||||
justifyContent: "flex-start" | "center" | "flex-end" | "space-between" | "space-around" | null;
|
||||
padding: number | null;
|
||||
flex: number | null;
|
||||
wrap: boolean | null;
|
||||
}
|
||||
```
|
||||
|
||||
#### Column
|
||||
|
||||
Vertical flex layout.
|
||||
|
||||
```typescript
|
||||
{
|
||||
gap: number | null;
|
||||
alignItems: "flex-start" | "center" | "flex-end" | "stretch" | null;
|
||||
justifyContent: "flex-start" | "center" | "flex-end" | "space-between" | "space-around" | null;
|
||||
padding: number | null;
|
||||
flex: number | null;
|
||||
}
|
||||
```
|
||||
|
||||
### Content
|
||||
|
||||
#### Heading
|
||||
|
||||
h1-h4 heading text with configurable color and alignment.
|
||||
|
||||
```typescript
|
||||
{
|
||||
text: string;
|
||||
level: "h1" | "h2" | "h3" | "h4" | null;
|
||||
color: string | null;
|
||||
align: "left" | "center" | "right" | null;
|
||||
}
|
||||
```
|
||||
|
||||
#### Text
|
||||
|
||||
Body text with full styling control.
|
||||
|
||||
```typescript
|
||||
{
|
||||
text: string;
|
||||
fontSize: number | null;
|
||||
color: string | null;
|
||||
align: "left" | "center" | "right" | null;
|
||||
fontWeight: "normal" | "bold" | null;
|
||||
fontStyle: "normal" | "italic" | null;
|
||||
lineHeight: number | null;
|
||||
}
|
||||
```
|
||||
|
||||
#### Image
|
||||
|
||||
Image from a URL with optional dimensions and fit.
|
||||
|
||||
```typescript
|
||||
{
|
||||
src: string;
|
||||
width: number | null;
|
||||
height: number | null;
|
||||
objectFit: "contain" | "cover" | "fill" | "none" | null;
|
||||
}
|
||||
```
|
||||
|
||||
#### Link
|
||||
|
||||
Hyperlink with visible text.
|
||||
|
||||
```typescript
|
||||
{
|
||||
text: string;
|
||||
href: string;
|
||||
fontSize: number | null;
|
||||
color: string | null;
|
||||
}
|
||||
```
|
||||
|
||||
### Data
|
||||
|
||||
#### Table
|
||||
|
||||
Data table with typed columns and string rows. Supports header styling and striped rows.
|
||||
|
||||
```typescript
|
||||
{
|
||||
columns: { header: string; width?: string; align?: "left" | "center" | "right" }[];
|
||||
rows: string[][];
|
||||
headerBackgroundColor: string | null;
|
||||
headerTextColor: string | null;
|
||||
borderColor: string | null;
|
||||
fontSize: number | null;
|
||||
striped: boolean | null;
|
||||
}
|
||||
```
|
||||
|
||||
#### List
|
||||
|
||||
Ordered or unordered list.
|
||||
|
||||
```typescript
|
||||
{
|
||||
items: string[];
|
||||
ordered: boolean | null;
|
||||
fontSize: number | null;
|
||||
color: string | null;
|
||||
spacing: number | null;
|
||||
}
|
||||
```
|
||||
|
||||
### Decorative
|
||||
|
||||
#### Divider
|
||||
|
||||
Horizontal line separator.
|
||||
|
||||
```typescript
|
||||
{
|
||||
color: string | null;
|
||||
thickness: number | null;
|
||||
marginTop: number | null;
|
||||
marginBottom: number | null;
|
||||
}
|
||||
```
|
||||
|
||||
#### Spacer
|
||||
|
||||
Empty vertical space.
|
||||
|
||||
```typescript
|
||||
{
|
||||
height: number | null;
|
||||
}
|
||||
```
|
||||
|
||||
### Page-Level
|
||||
|
||||
#### PageNumber
|
||||
|
||||
Renders current page number and total pages. Format uses `{pageNumber}` and `{totalPages}` placeholders.
|
||||
|
||||
```typescript
|
||||
{
|
||||
format: string | null; // default: "{pageNumber} / {totalPages}"
|
||||
fontSize: number | null;
|
||||
color: string | null;
|
||||
align: "left" | "center" | "right" | null;
|
||||
}
|
||||
```
|
||||
|
||||
## Server-Safe Import
|
||||
|
||||
Import schema and catalog definitions without pulling in React or `@react-pdf/renderer`:
|
||||
|
||||
```typescript
|
||||
import { schema, standardComponentDefinitions } from '@json-render/react-pdf/server';
|
||||
```
|
||||
|
||||
## Sub-path Exports
|
||||
|
||||
<table>
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Export</th>
|
||||
<th>Description</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td><code>@json-render/react-pdf</code></td>
|
||||
<td>Full package: schema, renderer, components, render functions</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><code>@json-render/react-pdf/server</code></td>
|
||||
<td>Schema and catalog definitions only (no React)</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><code>@json-render/react-pdf/catalog</code></td>
|
||||
<td>Standard component definitions and types</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><code>@json-render/react-pdf/render</code></td>
|
||||
<td>Server-side render functions only</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
## Types
|
||||
|
||||
<table>
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Export</th>
|
||||
<th>Description</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td><code>ReactPdfSchema</code></td>
|
||||
<td>Schema type for PDF specs</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><code>ReactPdfSpec</code></td>
|
||||
<td>Spec type for PDF documents</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><code>RenderOptions</code></td>
|
||||
<td>Options for render functions</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><code>ComponentContext</code></td>
|
||||
<td>Typed component render function context</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><code>ComponentFn</code></td>
|
||||
<td>Component render function type</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><code>StandardComponentDefinitions</code></td>
|
||||
<td>Type of the standard component definitions object</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><code>StandardComponentProps<K></code></td>
|
||||
<td>Inferred props type for a standard component by name</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
@@ -1,4 +1,5 @@
|
||||
export const metadata = { title: "@json-render/react API" }
|
||||
import { pageMetadata } from "@/lib/page-metadata"
|
||||
export const metadata = pageMetadata("docs/api/react")
|
||||
|
||||
# @json-render/react
|
||||
|
||||
|
||||
@@ -1,4 +1,5 @@
|
||||
export const metadata = { title: "@json-render/remotion API" }
|
||||
import { pageMetadata } from "@/lib/page-metadata"
|
||||
export const metadata = pageMetadata("docs/api/remotion")
|
||||
|
||||
# @json-render/remotion
|
||||
|
||||
|
||||
@@ -1,4 +1,5 @@
|
||||
export const metadata = { title: "@json-render/shadcn API" }
|
||||
import { pageMetadata } from "@/lib/page-metadata"
|
||||
export const metadata = pageMetadata("docs/api/shadcn")
|
||||
|
||||
# @json-render/shadcn
|
||||
|
||||
|
||||
@@ -1,4 +1,5 @@
|
||||
export const metadata = { title: "Catalog" }
|
||||
import { pageMetadata } from "@/lib/page-metadata"
|
||||
export const metadata = pageMetadata("docs/catalog")
|
||||
|
||||
# Catalog
|
||||
|
||||
|
||||
@@ -1,4 +1,5 @@
|
||||
export const metadata = { title: "Changelog" }
|
||||
import { pageMetadata } from "@/lib/page-metadata"
|
||||
export const metadata = pageMetadata("docs/changelog")
|
||||
|
||||
# Changelog
|
||||
|
||||
|
||||
@@ -1,4 +1,5 @@
|
||||
export const metadata = { title: "Code Export" }
|
||||
import { pageMetadata } from "@/lib/page-metadata"
|
||||
export const metadata = pageMetadata("docs/code-export")
|
||||
|
||||
# Code Export
|
||||
|
||||
|
||||
@@ -1,4 +1,5 @@
|
||||
export const metadata = { title: "Custom Schema & Renderer" }
|
||||
import { pageMetadata } from "@/lib/page-metadata"
|
||||
export const metadata = pageMetadata("docs/custom-schema")
|
||||
|
||||
# Custom Schema & Renderer
|
||||
|
||||
|
||||
@@ -1,4 +1,5 @@
|
||||
export const metadata = { title: "Data Binding" }
|
||||
import { pageMetadata } from "@/lib/page-metadata"
|
||||
export const metadata = pageMetadata("docs/data-binding")
|
||||
|
||||
# Data Binding
|
||||
|
||||
|
||||
@@ -1,4 +1,5 @@
|
||||
export const metadata = { title: "Generation Modes" }
|
||||
import { pageMetadata } from "@/lib/page-metadata"
|
||||
export const metadata = pageMetadata("docs/generation-modes")
|
||||
|
||||
# Generation Modes
|
||||
|
||||
|
||||
@@ -1,4 +1,5 @@
|
||||
export const metadata = { title: "Installation" }
|
||||
import { pageMetadata } from "@/lib/page-metadata"
|
||||
export const metadata = pageMetadata("docs/installation")
|
||||
|
||||
# Installation
|
||||
|
||||
|
||||
@@ -1,4 +1,5 @@
|
||||
export const metadata = { title: "Migration Guide" }
|
||||
import { pageMetadata } from "@/lib/page-metadata"
|
||||
export const metadata = pageMetadata("docs/migration")
|
||||
|
||||
# Migration Guide
|
||||
|
||||
|
||||
@@ -1,4 +1,5 @@
|
||||
export const metadata = { title: "OpenAPI Integration" }
|
||||
import { pageMetadata } from "@/lib/page-metadata"
|
||||
export const metadata = pageMetadata("docs/openapi")
|
||||
|
||||
# OpenAPI Integration
|
||||
|
||||
|
||||
@@ -1,4 +1,5 @@
|
||||
export const metadata = { title: "Introduction" }
|
||||
import { pageMetadata } from "@/lib/page-metadata"
|
||||
export const metadata = pageMetadata("docs")
|
||||
|
||||
# Introduction
|
||||
|
||||
|
||||
@@ -1,4 +1,5 @@
|
||||
export const metadata = { title: "Quick Start" }
|
||||
import { pageMetadata } from "@/lib/page-metadata"
|
||||
export const metadata = pageMetadata("docs/quick-start")
|
||||
|
||||
# Quick Start
|
||||
|
||||
|
||||
@@ -1,4 +1,5 @@
|
||||
export const metadata = { title: "Registry" }
|
||||
import { pageMetadata } from "@/lib/page-metadata"
|
||||
export const metadata = pageMetadata("docs/registry")
|
||||
|
||||
# Registry
|
||||
|
||||
|
||||
@@ -1,4 +1,5 @@
|
||||
export const metadata = { title: "Schemas" }
|
||||
import { pageMetadata } from "@/lib/page-metadata"
|
||||
export const metadata = pageMetadata("docs/schemas")
|
||||
|
||||
# Schemas
|
||||
|
||||
|
||||
@@ -1,4 +1,5 @@
|
||||
export const metadata = { title: "Specs" }
|
||||
import { pageMetadata } from "@/lib/page-metadata"
|
||||
export const metadata = pageMetadata("docs/specs")
|
||||
|
||||
# Specs
|
||||
|
||||
|
||||
@@ -1,4 +1,5 @@
|
||||
export const metadata = { title: "Streaming" }
|
||||
import { pageMetadata } from "@/lib/page-metadata"
|
||||
export const metadata = pageMetadata("docs/streaming")
|
||||
|
||||
# Streaming
|
||||
|
||||
|
||||
@@ -1,4 +1,5 @@
|
||||
export const metadata = { title: "Validation" }
|
||||
import { pageMetadata } from "@/lib/page-metadata"
|
||||
export const metadata = pageMetadata("docs/validation")
|
||||
|
||||
# Validation
|
||||
|
||||
|
||||
@@ -1,4 +1,5 @@
|
||||
export const metadata = { title: "Visibility" }
|
||||
import { pageMetadata } from "@/lib/page-metadata"
|
||||
export const metadata = pageMetadata("docs/visibility")
|
||||
|
||||
# Visibility
|
||||
|
||||
|
||||
@@ -154,23 +154,34 @@ button {
|
||||
margin-bottom: 0.5em;
|
||||
}
|
||||
|
||||
/* MDX table styles — fallback for GFM-generated tables */
|
||||
/* MDX table styles — applies to both GFM pipe tables and raw HTML tables */
|
||||
.mdx-table th,
|
||||
.mdx-table td {
|
||||
.mdx-table td,
|
||||
article table th,
|
||||
article table td {
|
||||
border: 1px solid var(--border);
|
||||
padding: 0.75rem 1rem;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.mdx-table th {
|
||||
.mdx-table th,
|
||||
article table th {
|
||||
font-weight: 600;
|
||||
background-color: var(--muted);
|
||||
}
|
||||
|
||||
.mdx-table td {
|
||||
.mdx-table td,
|
||||
article table td {
|
||||
color: var(--muted-foreground);
|
||||
}
|
||||
|
||||
article table {
|
||||
width: 100%;
|
||||
font-size: 0.875rem;
|
||||
border-collapse: collapse;
|
||||
margin: 1.5rem 0;
|
||||
}
|
||||
|
||||
/* Shiki dual theme support */
|
||||
.shiki,
|
||||
.shiki span {
|
||||
|
||||
@@ -61,7 +61,6 @@ export const metadata: Metadata = {
|
||||
description:
|
||||
"The Generative UI framework. Generate dashboards, widgets, and apps from prompts — safely constrained to components you define.",
|
||||
images: ["/og"],
|
||||
creator: "@verabornnot",
|
||||
},
|
||||
robots: {
|
||||
index: true,
|
||||
|
||||
@@ -16,14 +16,16 @@ import { CopyButton } from "./copy-button";
|
||||
import { Toaster } from "./ui/sonner";
|
||||
import { Header } from "./header";
|
||||
import { Sheet, SheetContent, SheetTitle } from "./ui/sheet";
|
||||
import { JsonEditor, type JsonValue } from "@visual-json/react";
|
||||
import { PlaygroundRenderer } from "@/lib/render/renderer";
|
||||
import { playgroundCatalog } from "@/lib/render/catalog";
|
||||
import { buildCatalogDisplayData } from "@/lib/render/catalog-display";
|
||||
|
||||
type Tab = "json" | "nested" | "stream" | "catalog";
|
||||
type Tab = "json" | "visual" | "nested" | "stream" | "catalog";
|
||||
type RenderView = "preview" | "code";
|
||||
type MobileView =
|
||||
| "json"
|
||||
| "visual"
|
||||
| "nested"
|
||||
| "stream"
|
||||
| "catalog"
|
||||
@@ -161,6 +163,19 @@ export function Playground() {
|
||||
? streamRawLines
|
||||
: (selectedVersion?.rawLines ?? []);
|
||||
|
||||
const handleVisualChange = useCallback(
|
||||
(value: JsonValue) => {
|
||||
const updatedSpec = value as unknown as Spec;
|
||||
if (!selectedVersionId) return;
|
||||
setVersions((prev) =>
|
||||
prev.map((v) =>
|
||||
v.id === selectedVersionId ? { ...v, tree: updatedSpec } : v,
|
||||
),
|
||||
);
|
||||
},
|
||||
[selectedVersionId],
|
||||
);
|
||||
|
||||
// Keep the ref updated with the current tree for use in handleSubmit
|
||||
if (
|
||||
currentTree &&
|
||||
@@ -484,21 +499,23 @@ ${jsx}
|
||||
const codePane = (
|
||||
<div className="h-full flex flex-col border-t border-border">
|
||||
<div className="border-b border-border px-3 h-9 flex items-center gap-3">
|
||||
{(["json", "nested", "stream", "catalog"] as const).map((tab) => (
|
||||
<button
|
||||
key={tab}
|
||||
onClick={() => setActiveTab(tab)}
|
||||
className={`text-xs font-mono transition-colors ${
|
||||
activeTab === tab
|
||||
? "text-foreground"
|
||||
: "text-muted-foreground hover:text-foreground"
|
||||
}`}
|
||||
>
|
||||
{tab}
|
||||
</button>
|
||||
))}
|
||||
{(["json", "visual", "nested", "stream", "catalog"] as const).map(
|
||||
(tab) => (
|
||||
<button
|
||||
key={tab}
|
||||
onClick={() => setActiveTab(tab)}
|
||||
className={`text-xs font-mono transition-colors ${
|
||||
activeTab === tab
|
||||
? "text-foreground"
|
||||
: "text-muted-foreground hover:text-foreground"
|
||||
}`}
|
||||
>
|
||||
{tab}
|
||||
</button>
|
||||
),
|
||||
)}
|
||||
<div className="flex-1" />
|
||||
{activeTab !== "catalog" && (
|
||||
{activeTab !== "catalog" && activeTab !== "visual" && (
|
||||
<CopyButton text={copyText} className="text-muted-foreground" />
|
||||
)}
|
||||
</div>
|
||||
@@ -633,6 +650,36 @@ ${jsx}
|
||||
{isStreaming ? "streaming..." : "// waiting for generation"}
|
||||
</div>
|
||||
)
|
||||
) : activeTab === "visual" ? (
|
||||
currentTree && currentTree.root ? (
|
||||
<JsonEditor
|
||||
key={selectedVersionId}
|
||||
defaultValue={
|
||||
JSON.parse(JSON.stringify(currentTree)) as JsonValue
|
||||
}
|
||||
onChange={handleVisualChange}
|
||||
sidebarOpen={false}
|
||||
height="100%"
|
||||
style={
|
||||
{
|
||||
"--vj-bg": "var(--background)",
|
||||
"--vj-text": "var(--foreground)",
|
||||
"--vj-border": "var(--border)",
|
||||
"--vj-accent": "var(--primary)",
|
||||
"--vj-bg-selected": "var(--primary)",
|
||||
"--vj-bg-selected-muted":
|
||||
"color-mix(in oklch, var(--primary) 50%, transparent)",
|
||||
"--vj-text-selected": "var(--primary-foreground)",
|
||||
} as React.CSSProperties
|
||||
}
|
||||
/>
|
||||
) : (
|
||||
<div className="h-full flex items-center justify-center text-muted-foreground/50 text-sm">
|
||||
{isStreaming
|
||||
? "generating..."
|
||||
: "// enter a prompt to generate UI"}
|
||||
</div>
|
||||
)
|
||||
) : activeTab === "nested" ? (
|
||||
<CodeBlock code={nestedCode} lang="json" fillHeight hideCopyButton />
|
||||
) : (
|
||||
@@ -735,19 +782,21 @@ ${jsx}
|
||||
: 0}
|
||||
</button>
|
||||
{/* Code tabs */}
|
||||
{(["json", "nested", "stream", "catalog"] as const).map((tab) => (
|
||||
<button
|
||||
key={tab}
|
||||
onClick={() => setMobileView(tab)}
|
||||
className={`text-xs font-mono transition-colors shrink-0 ${
|
||||
mobileView === tab
|
||||
? "text-foreground"
|
||||
: "text-muted-foreground hover:text-foreground"
|
||||
}`}
|
||||
>
|
||||
{tab}
|
||||
</button>
|
||||
))}
|
||||
{(["json", "visual", "nested", "stream", "catalog"] as const).map(
|
||||
(tab) => (
|
||||
<button
|
||||
key={tab}
|
||||
onClick={() => setMobileView(tab)}
|
||||
className={`text-xs font-mono transition-colors shrink-0 ${
|
||||
mobileView === tab
|
||||
? "text-foreground"
|
||||
: "text-muted-foreground hover:text-foreground"
|
||||
}`}
|
||||
>
|
||||
{tab}
|
||||
</button>
|
||||
),
|
||||
)}
|
||||
<div className="flex-1" />
|
||||
{/* Preview / code toggle */}
|
||||
{[
|
||||
@@ -909,6 +958,36 @@ ${jsx}
|
||||
/>
|
||||
) : mobileView === "json" ? (
|
||||
<CodeBlock code={jsonCode} lang="json" fillHeight hideCopyButton />
|
||||
) : mobileView === "visual" ? (
|
||||
currentTree && currentTree.root ? (
|
||||
<JsonEditor
|
||||
key={selectedVersionId}
|
||||
defaultValue={
|
||||
JSON.parse(JSON.stringify(currentTree)) as JsonValue
|
||||
}
|
||||
onChange={handleVisualChange}
|
||||
sidebarOpen={false}
|
||||
height="100%"
|
||||
style={
|
||||
{
|
||||
"--vj-bg": "var(--background)",
|
||||
"--vj-text": "var(--foreground)",
|
||||
"--vj-border": "var(--border)",
|
||||
"--vj-accent": "var(--primary)",
|
||||
"--vj-bg-selected": "var(--primary)",
|
||||
"--vj-bg-selected-muted":
|
||||
"color-mix(in oklch, var(--primary) 50%, transparent)",
|
||||
"--vj-text-selected": "var(--primary-foreground)",
|
||||
} as React.CSSProperties
|
||||
}
|
||||
/>
|
||||
) : (
|
||||
<div className="h-full flex items-center justify-center text-muted-foreground/50 text-sm">
|
||||
{isStreaming
|
||||
? "generating..."
|
||||
: "// enter a prompt to generate UI"}
|
||||
</div>
|
||||
)
|
||||
) : mobileView === "preview" ? (
|
||||
currentTree && currentTree.root ? (
|
||||
<div className="w-full min-h-full flex items-center justify-center p-6">
|
||||
|
||||
@@ -57,6 +57,11 @@ export const docsNavigation: NavSection[] = [
|
||||
href: "https://github.com/vercel-labs/json-render/tree/main/examples/react-native",
|
||||
external: true,
|
||||
},
|
||||
{
|
||||
title: "React PDF",
|
||||
href: "https://github.com/vercel-labs/json-render/tree/main/examples/react-pdf",
|
||||
external: true,
|
||||
},
|
||||
{
|
||||
title: "Remotion",
|
||||
href: "https://github.com/vercel-labs/json-render/tree/main/examples/remotion",
|
||||
@@ -86,6 +91,7 @@ export const docsNavigation: NavSection[] = [
|
||||
items: [
|
||||
{ title: "@json-render/core", href: "/docs/api/core" },
|
||||
{ title: "@json-render/react", href: "/docs/api/react" },
|
||||
{ title: "@json-render/react-pdf", href: "/docs/api/react-pdf" },
|
||||
{ title: "@json-render/shadcn", href: "/docs/api/shadcn" },
|
||||
{ title: "@json-render/react-native", href: "/docs/api/react-native" },
|
||||
{ title: "@json-render/remotion", href: "/docs/api/remotion" },
|
||||
|
||||
@@ -0,0 +1,39 @@
|
||||
import type { Metadata } from "next";
|
||||
import { PAGE_TITLES } from "./page-titles";
|
||||
|
||||
const DESCRIPTION =
|
||||
"The Generative UI framework. Generate dashboards, widgets, and apps from prompts — safely constrained to components you define.";
|
||||
|
||||
export function pageMetadata(slug: string): Metadata {
|
||||
const title = PAGE_TITLES[slug];
|
||||
if (!title) return {};
|
||||
|
||||
const displayTitle = title.replace(/\n/g, " ");
|
||||
const fullTitle = `${displayTitle} | json-render`;
|
||||
const ogImageUrl = slug ? `/og/${slug}` : "/og";
|
||||
|
||||
return {
|
||||
title: displayTitle,
|
||||
openGraph: {
|
||||
type: "website",
|
||||
locale: "en_US",
|
||||
siteName: "json-render",
|
||||
title: fullTitle,
|
||||
description: DESCRIPTION,
|
||||
images: [
|
||||
{
|
||||
url: ogImageUrl,
|
||||
width: 1200,
|
||||
height: 630,
|
||||
alt: `${displayTitle} - json-render`,
|
||||
},
|
||||
],
|
||||
},
|
||||
twitter: {
|
||||
card: "summary_large_image",
|
||||
title: fullTitle,
|
||||
description: DESCRIPTION,
|
||||
images: [ogImageUrl],
|
||||
},
|
||||
};
|
||||
}
|
||||
@@ -38,9 +38,11 @@ export const PAGE_TITLES: Record<string, string> = {
|
||||
// API references
|
||||
"docs/api/core": "@json-render/core API",
|
||||
"docs/api/react": "@json-render/react API",
|
||||
"docs/api/react-pdf": "@json-render/react-pdf API",
|
||||
"docs/api/react-native": "@json-render/react-native API",
|
||||
"docs/api/codegen": "@json-render/codegen API",
|
||||
"docs/api/remotion": "@json-render/remotion API",
|
||||
"docs/api/shadcn": "@json-render/shadcn API",
|
||||
};
|
||||
|
||||
/**
|
||||
|
||||
@@ -5,7 +5,7 @@
|
||||
"private": true,
|
||||
"license": "Apache-2.0",
|
||||
"scripts": {
|
||||
"dev": "next dev --turbopack",
|
||||
"dev": "portless json-render next dev --turbopack",
|
||||
"build": "next build",
|
||||
"start": "next start",
|
||||
"lint": "eslint --max-warnings 0",
|
||||
@@ -28,6 +28,8 @@
|
||||
"@upstash/redis": "^1.36.1",
|
||||
"@vercel/analytics": "^1.6.1",
|
||||
"@vercel/speed-insights": "^1.3.1",
|
||||
"@visual-json/core": "0.1.1",
|
||||
"@visual-json/react": "0.1.1",
|
||||
"ai": "^6.0.33",
|
||||
"bash-tool": "1.3.14",
|
||||
"class-variance-authority": "^0.7.1",
|
||||
|
||||
Vendored
+1
-1
@@ -1,6 +1,6 @@
|
||||
/// <reference types="next" />
|
||||
/// <reference types="next/image-types/global" />
|
||||
import "./.next/types/routes.d.ts";
|
||||
import "./.next/dev/types/routes.d.ts";
|
||||
|
||||
// NOTE: This file should not be edited
|
||||
// see https://nextjs.org/docs/app/api-reference/config/typescript for more information.
|
||||
|
||||
@@ -4,7 +4,7 @@
|
||||
"type": "module",
|
||||
"private": true,
|
||||
"scripts": {
|
||||
"dev": "next dev --turbopack",
|
||||
"dev": "portless chat-demo.json-render next dev --turbopack",
|
||||
"build": "next build",
|
||||
"start": "next start",
|
||||
"lint": "eslint --max-warnings 0",
|
||||
|
||||
Vendored
+1
-1
@@ -1,6 +1,6 @@
|
||||
/// <reference types="next" />
|
||||
/// <reference types="next/image-types/global" />
|
||||
import "./.next/types/routes.d.ts";
|
||||
import "./.next/dev/types/routes.d.ts";
|
||||
|
||||
// NOTE: This file should not be edited
|
||||
// see https://nextjs.org/docs/app/api-reference/config/typescript for more information.
|
||||
|
||||
@@ -4,7 +4,7 @@
|
||||
"type": "module",
|
||||
"private": true,
|
||||
"scripts": {
|
||||
"dev": "next dev --turbopack",
|
||||
"dev": "portless dashboard-demo.json-render next dev --turbopack",
|
||||
"build": "next build",
|
||||
"start": "next start",
|
||||
"lint": "eslint --max-warnings 0",
|
||||
|
||||
Vendored
+1
-1
@@ -1,6 +1,6 @@
|
||||
/// <reference types="next" />
|
||||
/// <reference types="next/image-types/global" />
|
||||
import "./.next/types/routes.d.ts";
|
||||
import "./.next/dev/types/routes.d.ts";
|
||||
|
||||
// NOTE: This file should not be edited
|
||||
// see https://nextjs.org/docs/app/api-reference/config/typescript for more information.
|
||||
|
||||
@@ -4,7 +4,7 @@
|
||||
"type": "module",
|
||||
"private": true,
|
||||
"scripts": {
|
||||
"dev": "next dev --turbopack --port 3003",
|
||||
"dev": "portless no-ai-demo.json-render next dev --turbopack",
|
||||
"build": "next build",
|
||||
"start": "next start",
|
||||
"lint": "eslint --max-warnings 0",
|
||||
|
||||
Vendored
+1
-1
@@ -1,6 +1,6 @@
|
||||
/// <reference types="next" />
|
||||
/// <reference types="next/image-types/global" />
|
||||
import "./.next/types/routes.d.ts";
|
||||
import "./.next/dev/types/routes.d.ts";
|
||||
|
||||
// NOTE: This file should not be edited
|
||||
// see https://nextjs.org/docs/app/api-reference/config/typescript for more information.
|
||||
|
||||
@@ -4,7 +4,7 @@
|
||||
"type": "module",
|
||||
"private": true,
|
||||
"scripts": {
|
||||
"dev": "next dev --turbopack --port 3005",
|
||||
"dev": "portless react-pdf-demo.json-render next dev --turbopack",
|
||||
"build": "next build",
|
||||
"start": "next start",
|
||||
"check-types": "tsc --noEmit"
|
||||
|
||||
Vendored
+1
-1
@@ -1,6 +1,6 @@
|
||||
/// <reference types="next" />
|
||||
/// <reference types="next/image-types/global" />
|
||||
import "./.next/types/routes.d.ts";
|
||||
import "./.next/dev/types/routes.d.ts";
|
||||
|
||||
// NOTE: This file should not be edited
|
||||
// see https://nextjs.org/docs/app/api-reference/config/typescript for more information.
|
||||
|
||||
@@ -4,7 +4,7 @@
|
||||
"type": "module",
|
||||
"private": true,
|
||||
"scripts": {
|
||||
"dev": "next dev --turbopack --port 3002",
|
||||
"dev": "portless remotion-demo.json-render next dev --turbopack",
|
||||
"build": "next build",
|
||||
"start": "next start",
|
||||
"check-types": "tsc --noEmit"
|
||||
|
||||
+1
-1
@@ -1,6 +1,6 @@
|
||||
/// <reference types="next" />
|
||||
/// <reference types="next/image-types/global" />
|
||||
import "./.next/types/routes.d.ts";
|
||||
import "./.next/dev/types/routes.d.ts";
|
||||
|
||||
// NOTE: This file should not be edited
|
||||
// see https://nextjs.org/docs/app/api-reference/config/typescript for more information.
|
||||
|
||||
Generated
+28
-50
@@ -98,6 +98,12 @@ importers:
|
||||
'@vercel/speed-insights':
|
||||
specifier: ^1.3.1
|
||||
version: 1.3.1(next@16.1.1(@opentelemetry/api@1.9.0)(babel-plugin-react-compiler@1.0.0)(react-dom@19.2.3(react@19.2.3))(react@19.2.3))(react@19.2.3)
|
||||
'@visual-json/core':
|
||||
specifier: 0.1.1
|
||||
version: 0.1.1
|
||||
'@visual-json/react':
|
||||
specifier: 0.1.1
|
||||
version: 0.1.1(react@19.2.3)
|
||||
ai:
|
||||
specifier: ^6.0.33
|
||||
version: 6.0.33(zod@4.3.5)
|
||||
@@ -442,7 +448,7 @@ importers:
|
||||
version: 0.563.0(react@19.2.4)
|
||||
next:
|
||||
specifier: 16.1.6
|
||||
version: 16.1.6(@opentelemetry/api@1.9.0)(babel-plugin-react-compiler@1.0.0)(react-dom@19.2.4(react@19.2.4))(react@19.2.4)
|
||||
version: 16.1.6(@babel/core@7.29.0)(@opentelemetry/api@1.9.0)(babel-plugin-react-compiler@1.0.0)(react-dom@19.2.4(react@19.2.4))(react@19.2.4)
|
||||
radix-ui:
|
||||
specifier: ^1.4.3
|
||||
version: 1.4.3(@types/react-dom@19.2.3(@types/react@19.2.3))(@types/react@19.2.3)(react-dom@19.2.4(react@19.2.4))(react@19.2.4)
|
||||
@@ -716,7 +722,7 @@ importers:
|
||||
version: 6.0.91(zod@4.3.5)
|
||||
next:
|
||||
specifier: ^16.1.6
|
||||
version: 16.1.6(@opentelemetry/api@1.9.0)(babel-plugin-react-compiler@1.0.0)(react-dom@19.2.4(react@19.2.4))(react@19.2.4)
|
||||
version: 16.1.6(@babel/core@7.29.0)(@opentelemetry/api@1.9.0)(babel-plugin-react-compiler@1.0.0)(react-dom@19.2.4(react@19.2.4))(react@19.2.4)
|
||||
react:
|
||||
specifier: ^19.1.0
|
||||
version: 19.2.4
|
||||
@@ -5009,6 +5015,14 @@ packages:
|
||||
vue-router:
|
||||
optional: true
|
||||
|
||||
'@visual-json/core@0.1.1':
|
||||
resolution: {integrity: sha512-VLARpQnjJU1SnnYk1NiXScGfp2FyAwyZS2kA8hIJV5OzkaH2oS1dTHsaB8vOiyi14/L7jsbpA4g/EwzRWbxQmg==}
|
||||
|
||||
'@visual-json/react@0.1.1':
|
||||
resolution: {integrity: sha512-KCpFYmBhH5F+xctfvxxVX7mVZK/iwvDwh/ITNkGPzEKXTIJQ16fau+hrG7m7QoTAOxvsdhHtHoCUiEjNHXboUQ==}
|
||||
peerDependencies:
|
||||
react: ^18.0.0 || ^19.0.0
|
||||
|
||||
'@vitest/expect@4.0.17':
|
||||
resolution: {integrity: sha512-mEoqP3RqhKlbmUmntNDDCJeTDavDR+fVYkSOw8qRwJFaW/0/5zA9zFeTrHqNtcmwh6j26yMmwx2PqUDPzt5ZAQ==}
|
||||
|
||||
@@ -12537,7 +12551,6 @@ snapshots:
|
||||
- graphql
|
||||
- supports-color
|
||||
- utf-8-validate
|
||||
optional: true
|
||||
|
||||
'@expo/code-signing-certificates@0.0.6':
|
||||
dependencies:
|
||||
@@ -12602,7 +12615,6 @@ snapshots:
|
||||
optionalDependencies:
|
||||
react: 19.2.4
|
||||
react-native: 0.83.1(@babel/core@7.29.0)(@types/react@19.2.3)(react@19.2.4)
|
||||
optional: true
|
||||
|
||||
'@expo/env@2.0.8':
|
||||
dependencies:
|
||||
@@ -12672,7 +12684,7 @@ snapshots:
|
||||
postcss: 8.4.49
|
||||
resolve-from: 5.0.0
|
||||
optionalDependencies:
|
||||
expo: 54.0.33(@babel/core@7.29.0)(@expo/metro-runtime@6.1.2)(expo-router@6.0.23)(graphql@16.12.0)(react-native@0.81.4(@babel/core@7.29.0)(@types/react@19.1.17)(react@19.1.0))(react@19.1.0)
|
||||
expo: 54.0.33(@babel/core@7.29.0)(@expo/metro-runtime@6.1.2)(expo-router@6.0.23)(graphql@16.12.0)(react-native@0.83.1(@babel/core@7.29.0)(@types/react@19.2.3)(react@19.2.4))(react@19.2.4)
|
||||
transitivePeerDependencies:
|
||||
- bufferutil
|
||||
- supports-color
|
||||
@@ -12753,7 +12765,7 @@ snapshots:
|
||||
'@expo/json-file': 10.0.8
|
||||
'@react-native/normalize-colors': 0.81.5
|
||||
debug: 4.4.3
|
||||
expo: 54.0.33(@babel/core@7.29.0)(@expo/metro-runtime@6.1.2)(expo-router@6.0.23)(graphql@16.12.0)(react-native@0.81.4(@babel/core@7.29.0)(@types/react@19.1.17)(react@19.1.0))(react@19.1.0)
|
||||
expo: 54.0.33(@babel/core@7.29.0)(@expo/metro-runtime@6.1.2)(expo-router@6.0.23)(graphql@16.12.0)(react-native@0.83.1(@babel/core@7.29.0)(@types/react@19.2.3)(react@19.2.4))(react@19.2.4)
|
||||
resolve-from: 5.0.0
|
||||
semver: 7.7.3
|
||||
xml2js: 0.6.0
|
||||
@@ -12781,7 +12793,6 @@ snapshots:
|
||||
expo-font: 14.0.11(expo@54.0.33)(react-native@0.83.1(@babel/core@7.29.0)(@types/react@19.2.3)(react@19.2.4))(react@19.2.4)
|
||||
react: 19.2.4
|
||||
react-native: 0.83.1(@babel/core@7.29.0)(@types/react@19.2.3)(react@19.2.4)
|
||||
optional: true
|
||||
|
||||
'@expo/ws-tunnel@1.0.6': {}
|
||||
|
||||
@@ -15372,7 +15383,6 @@ snapshots:
|
||||
react-native: 0.83.1(@babel/core@7.29.0)(@types/react@19.2.3)(react@19.2.4)
|
||||
optionalDependencies:
|
||||
'@types/react': 19.2.3
|
||||
optional: true
|
||||
|
||||
'@react-navigation/bottom-tabs@7.12.0(@react-navigation/native@7.1.28(react-native@0.81.4(@babel/core@7.29.0)(@types/react@19.1.17)(react@19.1.0))(react@19.1.0))(react-native-safe-area-context@5.4.0(react-native@0.81.4(@babel/core@7.29.0)(@types/react@19.1.17)(react@19.1.0))(react@19.1.0))(react-native-screens@4.11.1(react-native@0.81.4(@babel/core@7.29.0)(@types/react@19.1.17)(react@19.1.0))(react@19.1.0))(react-native@0.81.4(@babel/core@7.29.0)(@types/react@19.1.17)(react@19.1.0))(react@19.1.0)':
|
||||
dependencies:
|
||||
@@ -15993,7 +16003,7 @@ snapshots:
|
||||
'@stripe/ui-extension-tools@0.0.1(@babel/core@7.29.0)(babel-jest@27.5.1(@babel/core@7.29.0))':
|
||||
dependencies:
|
||||
'@types/jest': 28.1.8
|
||||
'@typescript-eslint/eslint-plugin': 5.62.0(@typescript-eslint/parser@5.62.0(eslint@9.39.2(jiti@2.6.1))(typescript@4.9.5))(eslint@8.57.1)(typescript@4.9.5)
|
||||
'@typescript-eslint/eslint-plugin': 5.62.0(@typescript-eslint/parser@5.62.0(eslint@8.57.1)(typescript@4.9.5))(eslint@8.57.1)(typescript@4.9.5)
|
||||
'@typescript-eslint/parser': 5.62.0(eslint@8.57.1)(typescript@4.9.5)
|
||||
eslint: 8.57.1
|
||||
eslint-plugin-react: 7.37.5(eslint@8.57.1)
|
||||
@@ -16330,7 +16340,7 @@ snapshots:
|
||||
'@types/node': 22.19.6
|
||||
optional: true
|
||||
|
||||
'@typescript-eslint/eslint-plugin@5.62.0(@typescript-eslint/parser@5.62.0(eslint@9.39.2(jiti@2.6.1))(typescript@4.9.5))(eslint@8.57.1)(typescript@4.9.5)':
|
||||
'@typescript-eslint/eslint-plugin@5.62.0(@typescript-eslint/parser@5.62.0(eslint@8.57.1)(typescript@4.9.5))(eslint@8.57.1)(typescript@4.9.5)':
|
||||
dependencies:
|
||||
'@eslint-community/regexpp': 4.12.2
|
||||
'@typescript-eslint/parser': 5.62.0(eslint@8.57.1)(typescript@4.9.5)
|
||||
@@ -16551,6 +16561,13 @@ snapshots:
|
||||
next: 16.1.1(@opentelemetry/api@1.9.0)(babel-plugin-react-compiler@1.0.0)(react-dom@19.2.3(react@19.2.3))(react@19.2.3)
|
||||
react: 19.2.3
|
||||
|
||||
'@visual-json/core@0.1.1': {}
|
||||
|
||||
'@visual-json/react@0.1.1(react@19.2.3)':
|
||||
dependencies:
|
||||
'@visual-json/core': 0.1.1
|
||||
react: 19.2.3
|
||||
|
||||
'@vitest/expect@4.0.17':
|
||||
dependencies:
|
||||
'@standard-schema/spec': 1.1.0
|
||||
@@ -17072,7 +17089,7 @@ snapshots:
|
||||
resolve-from: 5.0.0
|
||||
optionalDependencies:
|
||||
'@babel/runtime': 7.28.6
|
||||
expo: 54.0.33(@babel/core@7.29.0)(@expo/metro-runtime@6.1.2)(expo-router@6.0.23)(graphql@16.12.0)(react-native@0.81.4(@babel/core@7.29.0)(@types/react@19.1.17)(react@19.1.0))(react@19.1.0)
|
||||
expo: 54.0.33(@babel/core@7.29.0)(@expo/metro-runtime@6.1.2)(expo-router@6.0.23)(graphql@16.12.0)(react-native@0.83.1(@babel/core@7.29.0)(@types/react@19.2.3)(react@19.2.4))(react@19.2.4)
|
||||
transitivePeerDependencies:
|
||||
- '@babel/core'
|
||||
- supports-color
|
||||
@@ -18399,7 +18416,6 @@ snapshots:
|
||||
react-native: 0.83.1(@babel/core@7.29.0)(@types/react@19.2.3)(react@19.2.4)
|
||||
transitivePeerDependencies:
|
||||
- supports-color
|
||||
optional: true
|
||||
|
||||
expo-clipboard@8.0.8(expo@54.0.33)(react-native@0.81.4(@babel/core@7.29.0)(@types/react@19.1.17)(react@19.1.0))(react@19.1.0):
|
||||
dependencies:
|
||||
@@ -18424,7 +18440,6 @@ snapshots:
|
||||
react-native: 0.83.1(@babel/core@7.29.0)(@types/react@19.2.3)(react@19.2.4)
|
||||
transitivePeerDependencies:
|
||||
- supports-color
|
||||
optional: true
|
||||
|
||||
expo-file-system@19.0.21(expo@54.0.33)(react-native@0.81.4(@babel/core@7.29.0)(@types/react@19.1.17)(react@19.1.0)):
|
||||
dependencies:
|
||||
@@ -18435,7 +18450,6 @@ snapshots:
|
||||
dependencies:
|
||||
expo: 54.0.33(@babel/core@7.29.0)(@expo/metro-runtime@6.1.2)(expo-router@6.0.23)(graphql@16.12.0)(react-native@0.83.1(@babel/core@7.29.0)(@types/react@19.2.3)(react@19.2.4))(react@19.2.4)
|
||||
react-native: 0.83.1(@babel/core@7.29.0)(@types/react@19.2.3)(react@19.2.4)
|
||||
optional: true
|
||||
|
||||
expo-font@14.0.11(expo@54.0.33)(react-native@0.81.4(@babel/core@7.29.0)(@types/react@19.1.17)(react@19.1.0))(react@19.1.0):
|
||||
dependencies:
|
||||
@@ -18450,7 +18464,6 @@ snapshots:
|
||||
fontfaceobserver: 2.3.0
|
||||
react: 19.2.4
|
||||
react-native: 0.83.1(@babel/core@7.29.0)(@types/react@19.2.3)(react@19.2.4)
|
||||
optional: true
|
||||
|
||||
expo-keep-awake@15.0.8(expo@54.0.33)(react@19.1.0):
|
||||
dependencies:
|
||||
@@ -18461,7 +18474,6 @@ snapshots:
|
||||
dependencies:
|
||||
expo: 54.0.33(@babel/core@7.29.0)(@expo/metro-runtime@6.1.2)(expo-router@6.0.23)(graphql@16.12.0)(react-native@0.83.1(@babel/core@7.29.0)(@types/react@19.2.3)(react@19.2.4))(react@19.2.4)
|
||||
react: 19.2.4
|
||||
optional: true
|
||||
|
||||
expo-linking@8.0.11(expo@54.0.33)(react-native@0.81.4(@babel/core@7.29.0)(@types/react@19.1.17)(react@19.1.0))(react@19.1.0):
|
||||
dependencies:
|
||||
@@ -18503,7 +18515,6 @@ snapshots:
|
||||
invariant: 2.2.4
|
||||
react: 19.2.4
|
||||
react-native: 0.83.1(@babel/core@7.29.0)(@types/react@19.2.3)(react@19.2.4)
|
||||
optional: true
|
||||
|
||||
expo-router@6.0.23(@expo/metro-runtime@6.1.2)(@types/react-dom@19.2.3(@types/react@19.1.17))(@types/react@19.1.17)(expo-constants@18.0.13)(expo-linking@8.0.11)(expo@54.0.33)(react-dom@19.2.4(react@19.1.0))(react-native-reanimated@4.2.1(react-native-worklets@0.7.2(@babel/core@7.29.0)(react-native@0.81.4(@babel/core@7.29.0)(@types/react@19.1.17)(react@19.1.0))(react@19.1.0))(react-native@0.81.4(@babel/core@7.29.0)(@types/react@19.1.17)(react@19.1.0))(react@19.1.0))(react-native-safe-area-context@5.4.0(react-native@0.81.4(@babel/core@7.29.0)(@types/react@19.1.17)(react@19.1.0))(react@19.1.0))(react-native-screens@4.11.1(react-native@0.81.4(@babel/core@7.29.0)(@types/react@19.1.17)(react@19.1.0))(react@19.1.0))(react-native@0.81.4(@babel/core@7.29.0)(@types/react@19.1.17)(react@19.1.0))(react@19.1.0):
|
||||
dependencies:
|
||||
@@ -18666,7 +18677,6 @@ snapshots:
|
||||
- graphql
|
||||
- supports-color
|
||||
- utf-8-validate
|
||||
optional: true
|
||||
|
||||
exponential-backoff@3.1.3: {}
|
||||
|
||||
@@ -21278,32 +21288,6 @@ snapshots:
|
||||
- '@babel/core'
|
||||
- babel-plugin-macros
|
||||
|
||||
next@16.1.6(@opentelemetry/api@1.9.0)(babel-plugin-react-compiler@1.0.0)(react-dom@19.2.4(react@19.2.4))(react@19.2.4):
|
||||
dependencies:
|
||||
'@next/env': 16.1.6
|
||||
'@swc/helpers': 0.5.15
|
||||
baseline-browser-mapping: 2.9.14
|
||||
caniuse-lite: 1.0.30001764
|
||||
postcss: 8.4.31
|
||||
react: 19.2.4
|
||||
react-dom: 19.2.4(react@19.2.4)
|
||||
styled-jsx: 5.1.6(react@19.2.4)
|
||||
optionalDependencies:
|
||||
'@next/swc-darwin-arm64': 16.1.6
|
||||
'@next/swc-darwin-x64': 16.1.6
|
||||
'@next/swc-linux-arm64-gnu': 16.1.6
|
||||
'@next/swc-linux-arm64-musl': 16.1.6
|
||||
'@next/swc-linux-x64-gnu': 16.1.6
|
||||
'@next/swc-linux-x64-musl': 16.1.6
|
||||
'@next/swc-win32-arm64-msvc': 16.1.6
|
||||
'@next/swc-win32-x64-msvc': 16.1.6
|
||||
'@opentelemetry/api': 1.9.0
|
||||
babel-plugin-react-compiler: 1.0.0
|
||||
sharp: 0.34.5
|
||||
transitivePeerDependencies:
|
||||
- '@babel/core'
|
||||
- babel-plugin-macros
|
||||
|
||||
node-abi@3.87.0:
|
||||
dependencies:
|
||||
semver: 7.7.3
|
||||
@@ -22270,7 +22254,6 @@ snapshots:
|
||||
- bufferutil
|
||||
- supports-color
|
||||
- utf-8-validate
|
||||
optional: true
|
||||
|
||||
react-reconciler@0.29.0(react@18.3.1):
|
||||
dependencies:
|
||||
@@ -23344,11 +23327,6 @@ snapshots:
|
||||
client-only: 0.0.1
|
||||
react: 19.2.3
|
||||
|
||||
styled-jsx@5.1.6(react@19.2.4):
|
||||
dependencies:
|
||||
client-only: 0.0.1
|
||||
react: 19.2.4
|
||||
|
||||
sucrase@3.35.1:
|
||||
dependencies:
|
||||
'@jridgewell/gen-mapping': 0.3.13
|
||||
|
||||
Reference in New Issue
Block a user