Installation

Syncblocks components are distributed via the shadcn registry. Each component is added to your project as editable source code — no package to maintain.

Prerequisites

  • React 18 or 19
  • Tailwind CSS v4
  • shadcn/ui initialised in your project
  • TypeScript (recommended)

Quick start

Initialise shadcn/ui

pnpm dlx shadcn@latest init

Register the @syncblocks namespace

Syncblocks is a private registry, so the CLI needs both its URL and an access token. Add the namespace to your components.json:

components.json
{
  "registries": {
    "@syncblocks": {
      "url": "https://registry.websiteprojectupdates.com/r/{name}.json",
      "headers": {
        "Authorization": "Bearer ${SYNCBLOCKS_REGISTRY_TOKEN}"
      }
    }
  }
}

Then put the token your team gave you in .env.local — never commit it:

.env.local
SYNCBLOCKS_REGISTRY_TOKEN=your_token_here

components.json is committed; .env.local is not. The ${...} syntax is expanded by the CLI at install time, so the literal token never lands in git.

Add the component you need

pnpm dlx shadcn@latest add @syncblocks/workspace

The CLI automatically installs peer dependencies and resolves registry dependencies — workspace will pull in workspace-tabs automatically.

Manual installation

Each component page has a Manual tab in the installation section with the full source and dependency list.