Openfront UIKit
A storefront and registry for one studio's shadcn-compatible components and kits, with releases, review, checkout, entitlements, and registry keys.
Openfront UIKit is a storefront and registry for one studio's shadcn-compatible component source. Visitors browse components and kits. Signed-in customers unlock free items or buy paid ones, then pull source files with a registry API key. Operators author drafts, validate them, review and publish releases, and manage orders, payments, refunds, entitlements, and keys.
- Source: github.com/openshiporg/openfront-uikit
- Live site: uikit.openship.org
- Setup: Getting started
What a studio sells
A product (KitProduct) is one installable item. Its registryType is one of ui, block, component, hook, lib, page, file, theme, style, base, or item. Its accessType is free or paid. Each product has a stable code (the registry name used in URLs and the CLI), a slug (the storefront path), and a kitKey (the entitlement identity).
Source files live on a release (ComponentRelease) with a semantic version. Only the latest stable release is delivered to customers. Each file records path, optional target (for example @ui/, @components/, @lib/, @hooks/ placeholders), fileType, language, content, sourceHash, and sizeBytes.
Products can belong to a design system with named tokens, so a kit's colors, spacing, and radii ship with it.
Stack
Next.js 16 (App Router, React 19), Keystone 6 with a GraphQL API at /api/graphql, PostgreSQL through Prisma 6, Tailwind CSS 4. Sessions are Keystone stateless cookie sessions that last 30 days.
One studio per deployment
There is no organization, team, or store tenant model. Catalog, release, and design-system records are global. Customer records are scoped to the signed-in user through Order, Payment, KitAccess, and RegistryApiKey.
Main workflows
Release lifecycle. An operator creates a draft for a product, edits files, and runs validation. Validation executes the draft in an isolated environment and stores a ComponentValidation record. The operator submits for review, a reviewer approves or requests changes, and the release is published as stable. Stable releases can later be deprecated. See Studio and Releases.
Checkout. A signed-in customer starts a checkout for one product. Free products unlock at once. Paid products go through Stripe or PayPal, and the provider webhook settles the order and grants access. See Storefront and Payment providers.
Registry delivery. A customer creates a registry key at /account/token, then installs with the shadcn CLI or the Openfront CLI. See Registry and CLI.
Refunds and revocation. Operators refund captured payments, reconcile pending refunds, and revoke access. These write AuditEvent and OutboxEvent records. See Payments and refunds.
Where to go next
| Need | Page |
|---|---|
| Install and first run | Getting started, Deployment |
| Operator screens | Dashboard overview |
| Task walkthroughs | How-to guides |
| Lists and statuses | Data model |
| Permissions | Roles and permissions |
| GraphQL | API reference |
| Error messages | Troubleshooting |
Integrations
- Payments: Stripe Checkout Sessions, PayPal Orders v2, and a manual provider for operator-recorded payments. See Payment providers.
- Email: password reset email through SMTP.
- AI assistant: the dashboard chat at
/api/completionuses OpenRouter (OPENROUTER_API_KEY,OPENROUTER_MODEL, optionalOPENROUTER_MAX_TOKENS) and requires dashboard access. It talks to an MCP endpoint at/api/mcp-transport/<transport>that exposes generic tools (listModels,queryData,searchModels,getFieldsForType,lookupInputType,createData,updateData,deleteData,modelSpecificSearch) over the signed-in user's GraphQL session. - CLI:
/openfront-ui.jsserves the registry CLI. See Registry and CLI.