One folder per item
Add yours in one folder
Each item describes itself in its own metadata next to its source. Nothing shared is edited by hand, so many people can add items at once without merge conflicts.
Flow
Five steps
- 01
Fork and branch
Fork the repository, clone it, install with pnpm (Node 22).
- 02
Write the source
Put the component in registry/tealmac/ and a demo in registry/example/.
- 03
Describe it
Add registry/items/<name>/item.ts, plus a docs page in content/docs/components/.
- 04
Generate and check
Run the build and check commands below. Commit what they generate.
- 05
Open a pull request
Merged pull requests show which files an item touches.
Example
The metadata file
// apps/www/registry/items/my-card/item.ts
import { defineItem } from "@/lib/items/meta"
export default defineItem({
name: "my-card", // must equal the folder name
kind: "component",
category: "Cards and borders",
tier: "free",
title: "My Card",
description: "One sentence on what it does.",
tags: ["card", "surface"],
licence: "MIT",
registryType: "registry:ui",
files: [{ path: "tealmac/my-card.tsx", type: "registry:ui" }],
sidebar: {},
})pnpm build:registry # generates the registry arrays, sidebar, tiers and notices
pnpm build:site-data # site data
pnpm build:index # search and docs index
pnpm check # lint, types, format, registry-deps, items:check, licences:check
pnpm testRules
Naming and licence rules
- Names. The item name must equal its folder name: lowercase words joined with hyphens, such as
my-card. Demos use a-demosuffix. - Licences. Your item is MIT unless the metadata says otherwise. Allowed upstreams: MIT, Apache-2.0, BSD, ISC. Denied: GPL, AGPL, SSPL, BUSL, Commons Clause, fair-use and field-of-use terms.
- Credit. Adapted code needs a
built_onentry and an upstream notice, which feedTHIRD_PARTY_NOTICES.md. - Quality. Items follow the quality rules: keyboard access, theming, reduced motion and safe server rendering.
FAQ