@funda-ai/blocks

shadcn-compatible registry of Funda UI blocks: chart, metric, table, and the OpenUI DSL renderer that ties them together.

This package ships as a shadcn registry — consumers copy source into their project rather than taking a runtime dependency. Aligns with shadcn's distribution model.

Install a single block

npx shadcn@latest add https://unpkg.com/@funda-ai/[email protected]/registry/funda-chart.json

funda-chart pulls in its prerequisite funda-types automatically via registryDependencies. Same for the others:

• funda-types — TypeScript types shared by every block
• funda-openui-parser — YAML/JSON DSL parser (zero-dep, runs in Node or browser)
• funda-chart — line/bar/area chart on @visx/*
• funda-metric — metric-card grid
• funda-table — data-table with column alignment
• funda-block-renderer — parses a DSL string and renders the matching block (depends on all of the above)

Install the full set

Point shadcn at registry.json to list all available items:

npx shadcn@latest add https://unpkg.com/@funda-ai/[email protected]/registry/funda-block-renderer.json

That one item's registryDependencies cascade — shadcn CLI installs types, parser, and all three visual blocks in one command.

What the CLI writes into your project

Files end up at shadcn's conventional paths:

src/
├── lib/funda/
│   ├── types.ts
│   └── openui-parser.ts
└── components/funda/
    ├── funda-chart.tsx
    ├── funda-metric.tsx
    ├── funda-table.tsx
    └── funda-block-renderer.tsx

Imports of @funda/ui/utils in the source are rewritten to @/lib/utils so the copied source resolves against your shadcn project's own cn helper. You need Tailwind CSS configured (components ship Tailwind class names).

Dependencies added to your project

funda-chart declares the @visx/* packages it needs (axis, curve, event, gradient, grid, group, responsive, scale, shape). shadcn CLI installs them. No other runtime deps.

jsdelivr alternative

npx shadcn@latest add https://cdn.jsdelivr.net/npm/@funda-ai/[email protected]/registry/funda-chart.json

Build the registry locally

pnpm --filter @funda-ai/blocks build

Reads src/*.{ts,tsx}, rewrites imports to shadcn-standard aliases, emits registry/*.json. registry/ is gitignored — it's regenerated by prepublishOnly before every npm publish. The package ships only the JSON (see files in package.json) so npm install @funda-ai/blocks gives you the registry index alone, not a JS library — use npx shadcn@latest add for the components.