Compare commits

..
Author SHA1 Message Date
Chris Tate c2414abbb0 fix: remove GITHUB_TOKEN usage from star count fetch 2026-04-09 02:01:05 -05:00
Chris Tate e003701f6e fix: add GITHUB_TOKEN to turbo.json globalEnv 2026-04-09 02:00:36 -05:00
Chris Tate 1ed3d540b8 feat(web): fetch GitHub star count dynamically
Replace the hardcoded "12k" star count in the header with a live value
from the GitHub API, revalidated every 24 hours. Gracefully hides the
count if the fetch fails.
2026-04-09 01:54:07 -05:00
Chris Tateandctate a9858918f8 Update official links to use json-render.dev domain (#265)
* Update official links to use json-render.dev domain

- Change dashboard example Docs link from json-render.vercel.app to json-render.dev
- Change Svelte Chat demo URL from json-render-svelte-chat-demo.labs.vercel.dev to svelte-chat-demo.json-render.dev

Fixes #264

* Revert svelte-chat demo URL change

Keep the original labs.vercel.dev URL for the Svelte Chat demo.

---------

Co-authored-by: ctate <366502+ctate@users.noreply.github.com>
2026-04-08 17:08:10 -05:00
Chris Tate eebc6e4f4f better ignore (#263) 2026-04-08 10:08:51 -05:00
vzt7 a123f56fe3 fix: resolve image demo /api/image 500 on Vercel (#253)
Add outputFileTracingIncludes so the Geist font TTF is bundled at the
symlink path the code reads from. In a pnpm monorepo the file was only
traced at the .pnpm store path, which Vercel does not map back to the
node_modules/geist/ symlink.
2026-04-07 01:43:04 -05:00
Rayan Salhab 753c1d1109 fix(remotion): include props in generatePrompt output (#249)
The Remotion schema defines props on composition entries, but generatePrompt
did not include those props in its output. As a result, the model had no
knowledge of the expected prop shape when generating JSON, causing runtime
failures when prop names didn't match the component's expected interface.

Changes:
- Import zod type for TypeScript support
- Extract formatZodType from PromptContext
- Add props field to component type definition
- Include formatted props string in component description

Fixes #224
2026-04-07 01:39:32 -05:00
22 changed files with 59 additions and 81 deletions
+2
View File
@@ -29,6 +29,8 @@ build
dist
*.tsbuildinfo
.svelte-kit/
tsup.config.bundled_*.mjs
next-env.d.ts
# Debug
+5 -2
View File
@@ -1,13 +1,16 @@
import { Header } from "@/components/header";
import { getStarCount } from "@/lib/github";
export default function MainLayout({
export default async function MainLayout({
children,
}: {
children: React.ReactNode;
}) {
const stars = await getStarCount();
return (
<div className="min-h-screen flex flex-col">
<Header />
<Header stars={stars} />
<main className="flex-1">{children}</main>
</div>
);
+11 -5
View File
@@ -19,7 +19,13 @@ const navLinks = [
{ href: "/docs", label: "Docs" },
];
function GitHubLink({ className }: { className?: string }) {
function GitHubLink({
className,
stars,
}: {
className?: string;
stars?: string;
}) {
return (
<a
href="https://github.com/vercel-labs/json-render"
@@ -38,12 +44,12 @@ function GitHubLink({ className }: { className?: string }) {
>
<path d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.013 8.013 0 0016 8c0-4.42-3.58-8-8-8z" />
</svg>
<span>12k</span>
{stars && <span>{stars}</span>}
</a>
);
}
export function Header() {
export function Header({ stars }: { stars?: string }) {
const pathname = usePathname();
const [mobileOpen, setMobileOpen] = useState(false);
@@ -122,14 +128,14 @@ export function Header() {
</Link>
))}
<Search />
<GitHubLink />
<GitHubLink stars={stars} />
<ThemeToggle />
</nav>
{/* Mobile nav */}
<div className="flex sm:hidden items-center gap-3">
<Search />
<GitHubLink />
<GitHubLink stars={stars} />
<Sheet open={mobileOpen} onOpenChange={setMobileOpen}>
<SheetTrigger
className="flex items-center justify-center"
+20
View File
@@ -0,0 +1,20 @@
const REPO = "vercel-labs/json-render";
const REVALIDATE = 86400;
export async function getStarCount(): Promise<string> {
try {
const res = await fetch(`https://api.github.com/repos/${REPO}`, {
headers: { Accept: "application/vnd.github.v3+json" },
next: { revalidate: REVALIDATE },
});
if (!res.ok) return "";
const data = await res.json();
const count = data.stargazers_count;
if (typeof count !== "number") return "";
if (count >= 1000)
return `${(count / 1000).toFixed(count >= 10000 ? 0 : 1)}k`;
return String(count);
} catch {
return "";
}
}
-6
View File
@@ -1,6 +0,0 @@
/// <reference types="next" />
/// <reference types="next/image-types/global" />
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.
+1 -1
View File
@@ -47,7 +47,7 @@ export function Header() {
</div>
<nav className="flex items-center gap-4">
<a
href="https://json-render.vercel.app"
href="https://json-render.dev"
target="_blank"
rel="noopener noreferrer"
className="text-sm text-muted-foreground hover:text-foreground transition-colors"
-6
View File
@@ -1,6 +0,0 @@
/// <reference types="next" />
/// <reference types="next/image-types/global" />
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.
-6
View File
@@ -1,6 +0,0 @@
/// <reference types="next" />
/// <reference types="next/image-types/global" />
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.
-6
View File
@@ -1,6 +0,0 @@
/// <reference types="next" />
/// <reference types="next/image-types/global" />
import "./.next/types/routes.d.ts";
// NOTE: This file should not be edited
// see https://nextjs.org/docs/app/api-reference/config/typescript for more information.
+5
View File
@@ -2,6 +2,11 @@ import type { NextConfig } from "next";
const nextConfig: NextConfig = {
serverExternalPackages: ["@resvg/resvg-js", "satori"],
outputFileTracingIncludes: {
"/api/image": [
"./node_modules/geist/dist/fonts/geist-sans/Geist-Regular.ttf",
],
},
};
export default nextConfig;
-6
View File
@@ -1,6 +0,0 @@
/// <reference types="next" />
/// <reference types="next/image-types/global" />
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.
-6
View File
@@ -1,6 +0,0 @@
/// <reference types="next" />
/// <reference types="next/image-types/global" />
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.
-6
View File
@@ -1,6 +0,0 @@
/// <reference types="next" />
/// <reference types="next/image-types/global" />
import "./.next/types/routes.d.ts";
// NOTE: This file should not be edited
// see https://nextjs.org/docs/app/api-reference/config/typescript for more information.
-6
View File
@@ -1,6 +0,0 @@
/// <reference types="next" />
/// <reference types="next/image-types/global" />
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.
-6
View File
@@ -1,6 +0,0 @@
/// <reference types="next" />
/// <reference types="next/image-types/global" />
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.
-6
View File
@@ -1,6 +0,0 @@
/// <reference types="next" />
/// <reference types="next/image-types/global" />
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.
-6
View File
@@ -1,6 +0,0 @@
/// <reference types="next" />
/// <reference types="next/image-types/global" />
import "./.next/types/routes.d.ts";
// NOTE: This file should not be edited
// see https://nextjs.org/docs/app/api-reference/config/typescript for more information.
+1 -1
View File
@@ -13,7 +13,7 @@
"scripts": {
"build": "turbo run build",
"predev": "command -v portless >/dev/null 2>&1 || (echo '\\nportless is required but not installed. Run: npm i -g portless\\nSee: https://github.com/vercel-labs/portless\\n' && exit 1)",
"dev": "turbo run dev --concurrency 20",
"dev": "turbo run dev --concurrency 50",
"lint": "turbo run lint",
"format": "prettier --write \"**/*.{ts,tsx}\"",
"type-check": "turbo run check-types",
+1 -1
View File
@@ -48,7 +48,7 @@
"dist"
],
"scripts": {
"build": "tsup",
"build": "rm -rf dist && tsup",
"dev": "tsup --watch",
"check-types": "tsc --noEmit",
"typecheck": "tsc --noEmit"
-1
View File
@@ -20,7 +20,6 @@ export default defineConfig([
dts: true,
sourcemap: true,
splitting: true,
clean: true,
banner: { js: '"use client";' },
external: sharedExternal,
},
+5 -3
View File
@@ -1,4 +1,5 @@
import { defineSchema, type PromptContext } from "@json-render/core";
import type { z } from "zod";
/**
* Prompt template for Remotion timeline generation
@@ -6,7 +7,7 @@ import { defineSchema, type PromptContext } from "@json-render/core";
* Uses JSONL patch format (same as React) but builds up a timeline spec structure.
*/
function remotionPromptTemplate(context: PromptContext): string {
const { catalog, options } = context;
const { catalog, options, formatZodType } = context;
const { system = "You are a video timeline generator.", customRules = [] } =
options;
@@ -37,7 +38,7 @@ function remotionPromptTemplate(context: PromptContext): string {
const catalogData = catalog as {
components?: Record<
string,
{ description?: string; defaultDuration?: number }
{ description?: string; defaultDuration?: number; props?: z.ZodType }
>;
transitions?: Record<string, { description?: string }>;
effects?: Record<string, { description?: string }>;
@@ -52,8 +53,9 @@ function remotionPromptTemplate(context: PromptContext): string {
const duration = def.defaultDuration
? ` [default: ${def.defaultDuration} frames]`
: "";
const propsStr = def.props ? ` ${formatZodType(def.props)}` : "";
lines.push(
`- ${name}: ${def.description || "No description"}${duration}`,
`- ${name}:${propsStr} ${def.description || "No description"}${duration}`,
);
}
lines.push("");
+8 -1
View File
@@ -6,7 +6,13 @@
"build": {
"dependsOn": ["^build"],
"inputs": ["$TURBO_DEFAULT$", ".env*"],
"outputs": [".next/**", "!.next/cache/**", "dist/**"]
"outputs": [".next/**", "!.next/cache/**", "dist/**", ".svelte-kit/**"]
},
"svelte-chat#build": {
"dependsOn": ["^build"],
"inputs": ["$TURBO_DEFAULT$", ".env*"],
"outputs": [".svelte-kit/**"],
"cache": false
},
"lint": {
"dependsOn": ["^lint"]
@@ -15,6 +21,7 @@
"dependsOn": ["^build"]
},
"dev": {
"dependsOn": ["^build"],
"cache": false,
"persistent": true
}