npm package: @linktr.ee/registry
Description: Component registry for LinkApps
Latest version: 0.0.9

# LinkApp Component Registry

Component registry for LinkApps using the shadcn/ui registry system.

## Components

- **Button** - Versatile button component with multiple variants
- **Switch** - Toggle switch component for on/off states

## Development

```bash
# Install dependencies
npm install

# Build the registry
npm run registry:build

# Start dev server
npm run dev
```

## Building the Registry

The registry uses the `shadcn` CLI to build component JSON files:

```bash
npm run registry:build
```

This will generate JSON files in `public/r/` directory:
- `public/r/button.json`
- `public/r/switch.json`
- `public/r/utils.json`

## Deploying to Vercel

The registry is configured to deploy to Vercel as a static site.

### Prerequisites

1. Install Vercel CLI globally:

```bash
npm install -g vercel
```

2. Login to Vercel:

```bash
vercel login
```

### Deployment Steps

1. Navigate to the registry directory:

```bash
cd packages/registry
```

2. Build the registry:

```bash
npm run registry:build
```

3. Deploy to Vercel:

```bash
npm run deploy
```

Or use Vercel CLI directly:

```bash
# Deploy to preview
vercel

# Deploy to production
vercel --prod
```

### First-Time Setup

When deploying for the first time, Vercel will ask:

- **Set up and deploy**: Yes
- **Which scope**: Select your account/team
- **Link to existing project**: No (for first deployment)
- **Project name**: Accept default or choose a custom name
- **Directory**: `./` (current directory)
- **Override settings**: No

### Custom Domain (Optional)

After deployment, you can configure a custom domain:

1. Go to your project in Vercel Dashboard
2. Navigate to Settings > Domains
3. Add your custom domain (e.g., `registry.linktr.ee`)
4. Follow the DNS configuration instructions

### Environment Configuration

By default, the `linkapp add` command uses `http://localhost:3001/r` for local development.

To use your deployed registry:

1. **Option 1: Environment Variable**

Set the registry URL in your LinkApp project:

```bash
# In your LinkApp project .env file
LINKAPP_REGISTRY_URL=https://your-registry.vercel.app/r
```

2. **Option 2: Command Line Flag**

```bash
linkapp add button --registry https://your-registry.vercel.app/r
```

3. **Option 3: Update Default in Code**

Modify `packages/linkapp/src/commands/add.ts` to change the `DEFAULT_REGISTRY` constant.

## Using Components in LinkApps

Once the registry is deployed, developers can install components using:

```bash
# Using the linkapp CLI
linkapp add button
linkapp add switch

# Or using a custom registry URL
npx shadcn@latest add https://registry.linktr.ee/r/button.json
```

## Adding New Components

1. Create your component in `registry/default/ui/[component-name].tsx`
2. Add the component definition to `registry.json`
3. Run `npm run registry:build`
4. Test the component installation

## Registry Structure

```
packages/registry/
├── lib/
│   └── utils.ts              # Utility functions
├── registry/
│   └── default/
│       └── ui/
│           ├── button.tsx    # Button component
│           └── switch.tsx    # Switch component
├── public/
│   └── r/                    # Generated registry JSON files
├── components.json           # shadcn configuration
├── registry.json            # Registry definition
└── package.json
```

## License

UNLICENSED - © Linktree