Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
16 changes: 9 additions & 7 deletions .coderocket/source-manifest.json
Original file line number Diff line number Diff line change
Expand Up @@ -186,8 +186,10 @@
"packages/shared/src/registry-client.ts": "7df530f7e387cae02e65507f988f2a160c022718b1de14216e3f9cd3287c5567",
"packages/cli/src/files.test.ts": "ef55cd1907caef21617c3038f7595172ad93401d890008949e2ab8eb02e2fb27",
"packages/cli/src/files.ts": "985404aecfd7403888dec08e6f6ec898a69e488cd9f6ad2f4cbd6da8ea551806",
"packages/cli/src/index.ts": "76fcf339068da0e60347dce5f99292b88071c2764d12554afe067ad80a69f156",
"packages/mcp/src/index.ts": "4a0e87c85e7ac474e71e0120c2cdbac0c25e245b17161c66cff5ff1b40fbab7f",
"packages/cli/src/index.test.ts": "15987d857544a0654f12c18467c7c07c012ac8e0e7e603aa2aed44f98c85bf91",
"packages/cli/src/index.ts": "823f11f2ce5db9b89d7a56fe6e378440834d219c5a1c428aada07a2b79e08eb0",
"packages/mcp/src/index.test.ts": "80ab79875a2579115e3df6aeb6447831cd9ff2d065b7e58073cc2e21108a5c46",
"packages/mcp/src/index.ts": "bda52fa0962ff739426257fd831c2d648bfac8c3af72ef712b06c042d3d4dcc0",
"packages/vue/preview/block-showcase.vue": "71bd423249576933dc04c3b88d7d7ab683c3b7b45dd5923ccf4a1a4e4c736ba4",
"packages/vue/preview/entry.ts": "1b74ad013b28aa28d56a523edc8858af0085e76ad19c9ffa59a06b1543fbe0c6",
"packages/vue/preview/examples.json": "9e5c96ceb122644ea94d34f818cdbf918d61e274c93cf25e6db3a18d70bccf79",
Expand All @@ -197,8 +199,8 @@
"packages/vue/preview/showcase.test.ts": "65f5e46ebe8a6ca5508708c56ff16007f59cb31079a77f6f9e63df000b4e19f9",
"packages/vue/preview/showcase.vue": "ab827ab0bd679b20d471d7064f743a00ebc8b0653e6defbbc82a442472b1f701",
"docs/content/accessibility.mdx": "eb103c3bf4d03d3228d92defd5c71ea3d9ffb9fe91650fe27c14eca1e9efbbc5",
"docs/content/agents.mdx": "787d99787b6c6661dfe0c610c6da35957ee6a8dd4fdd5cca2ea80ce15f7fc5ee",
"docs/content/ai.mdx": "4ff4571a20ef220f19e125079853bb662337ae1c2dc9bd3589abd442ad654432",
"docs/content/agents.mdx": "75e96e3072695bb77060585f3dc90eae2b27b2e2d02cf60e9e34e10412f1a169",
"docs/content/ai.mdx": "6bbd0e7c211cb1f936b2f841d757806a550959a4e42f210097af627c9be0491c",
"docs/content/blocks/api-keys.mdx": "1ccd554b28e71c818ad944226481628fa91b36ca2123aedc12a0a75b2e068306",
"docs/content/blocks/app-header.mdx": "3ecb688f9b9b1ae0439e618f7cb3b76cb06862431c10c1fd401077702224546f",
"docs/content/blocks/app-sidebar.mdx": "0263d60a4bb97e5b94b0c7dccf06d38134d2bb43fedf7944d2fcecff7abfbd59",
Expand Down Expand Up @@ -279,8 +281,8 @@
"docs/content/components/toggle.mdx": "84fa1c518a88ff9e1276683d0073732686de3271885166033213da6fde1710f1",
"docs/content/components/tooltip.mdx": "60693d1382c7f60021540f7ae989c5c84908777d61a357c3fe12dce96c412d9d",
"docs/content/design-system.mdx": "08f98c614b81a9af0ebee612c7b011595804c13e7dd384470f9f144d9b24d7a6",
"docs/content/export.mdx": "765c2cb32bdca829913e6ef2c73decacce65744dcea661fc2bfc80e81612a1a0",
"docs/content/getting-started.mdx": "6506ddcecdfeb0dbad1c6c1454e6ff12950f07f09389ba1263bbf5c487db5ab0",
"docs/content/export.mdx": "812cc600e0b8f3ebd86dc93804130aa86fde0a6f3af9fb423ac39c6b1c98aff5",
"docs/content/getting-started.mdx": "b87890737c224ce7d317e931482134046b36b6aa179084fd60be06e03aaff38a",
"docs/content/index.mdx": "ae34072fe5ead79b535bf786b2b389cb19bb9527402859d5182eeda4167d583d",
"docs/content/meta.json": "251ece32eefc965e5a7b5aa64d4ac4e8903faa34eba63a9fef6facb4260daa57",
"docs/content/pilot.mdx": "f3dc4791ae9a65ec640675871fe145422e6cc43cbd55c001d4e72b3e72341b9b",
Expand Down Expand Up @@ -362,7 +364,7 @@
"docs/content/vue/components/toggle-group.mdx": "ef2059f704eac0a8f9a2e7a52a4f893b98e934897e2fd63cef21bdf1bd78e304",
"docs/content/vue/components/toggle.mdx": "35df5e29a740a08d4fbc73a77e378c8708bfe3f0b5825c16a1decc22895ed49c",
"docs/content/vue/components/tooltip.mdx": "894c79463d30026a04d50ac0c14adacd3161c5f7a2b8aaa5d17fc63d79691a8e",
"docs/content/vue/index.mdx": "3c4a1f898aff460de1d328448d8b648dec3d5b718997a6bef3e1ac58e6d05ff3",
"docs/content/vue/index.mdx": "f5e2b4fcc0a2831e3dacbb90e2f5443fe1993bb86a287dfa4e55976b3780a7aa",
"docs/content/vue/meta.json": "71d940394ad01e98fc20342dfb2b439b5b43346a6f01a83186280e60dac8060c"
}
}
9 changes: 7 additions & 2 deletions .github/workflows/check.yml
Original file line number Diff line number Diff line change
Expand Up @@ -9,9 +9,14 @@ on:
permissions:
contents: read

concurrency:
group: public-core-${{ github.ref }}
cancel-in-progress: true

jobs:
check:
runs-on: ubuntu-latest
timeout-minutes: 20
steps:
- uses: actions/checkout@v7
- uses: pnpm/action-setup@v6
Expand All @@ -22,5 +27,5 @@ jobs:
- run: pnpm install --frozen-lockfile
- run: pnpm check

# Publication is intentionally not automated. The historical datepicker release
# workflows are archived under legacy/, outside GitHub's active workflow directory.
# npm clients are released independently through publish-clients.yml.
# Legacy datepicker workflows remain archived under legacy/.
38 changes: 38 additions & 0 deletions .github/workflows/publish-clients.yml
Original file line number Diff line number Diff line change
@@ -0,0 +1,38 @@
name: Publish npm clients

on:
push:
tags: ["clients-v*"]

permissions:
contents: read

concurrency:
group: npm-clients
cancel-in-progress: false

jobs:
publish:
runs-on: ubuntu-latest
timeout-minutes: 20
permissions:
contents: read
id-token: write
steps:
- uses: actions/checkout@v7
with:
fetch-depth: 0
- uses: pnpm/action-setup@v6
- uses: actions/setup-node@v7
with:
node-version: "24"
registry-url: "https://registry.npmjs.org"
package-manager-cache: false
- name: Verify release tag and main ancestry
run: |
git merge-base --is-ancestor HEAD origin/main
node --input-type=module -e 'import {readFileSync} from "node:fs"; const version=process.env.GITHUB_REF_NAME.replace(/^clients-v/, ""); if (!/^\d+\.\d+\.\d+$/.test(version)) throw new Error("Use a stable clients-vX.Y.Z tag"); for (const name of ["cli", "mcp"]) if (JSON.parse(readFileSync(`packages/${name}/package.json`)).version !== version) throw new Error("Tag must match both client versions");'
- run: pnpm install --frozen-lockfile
- run: pnpm check
- name: Publish with npm trusted publishing
run: node tooling/publish-clients.mjs
2 changes: 2 additions & 0 deletions .gitignore
Original file line number Diff line number Diff line change
Expand Up @@ -13,3 +13,5 @@ coverage/
**/.vitepress/cache/
**/.vitepress/dist/
*.tsbuildinfo

.release/
87 changes: 65 additions & 22 deletions README.md
Original file line number Diff line number Diff line change
@@ -1,39 +1,88 @@
# CodeRocket UI — React and Vue component libraries
<p align="center">
<a href="https://ui.coderocket.app">
<img src="docs/assets/brand/coderocket-mark.svg" alt="CodeRocket UI" width="88" height="88" />
</a>
</p>

<h1 align="center">CodeRocket UI</h1>

<p align="center">React and Vue components. Your design system. Source you own.</p>

<p align="center">
<a href="https://www.npmjs.com/package/@coderocketapp/cli"><img src="https://img.shields.io/npm/v/%40coderocketapp%2Fcli?label=CLI" alt="CLI on npm" /></a>
<a href="https://www.npmjs.com/package/@coderocketapp/mcp"><img src="https://img.shields.io/npm/v/%40coderocketapp%2Fmcp?label=MCP" alt="MCP on npm" /></a>
<a href="https://github.com/elreco/coderocket-ui/actions/workflows/check.yml"><img src="https://img.shields.io/github/actions/workflow/status/elreco/coderocket-ui/check.yml?branch=main&amp;label=checks" alt="Public core checks" /></a>
<a href="LICENSE"><img src="https://img.shields.io/github/license/elreco/coderocket-ui" alt="MIT license" /></a>
</p>

<p align="center">
<a href="https://ui.coderocket.app/studio">Open Studio</a> ·
<a href="https://ui.coderocket.app/docs/components">React docs</a> ·
<a href="https://ui.coderocket.app/docs/vue/components">Vue docs</a> ·
<a href="https://ui.coderocket.app/docs/agents">Coding agents</a>
</p>

**Build a component library that looks like your product, with design rules your coding agents can use.**

CodeRocket UI combines **48 components and 26 interface blocks for both React and Vue**, a typed design-system model, and CLI/MCP integrations. Start from accessible primitives, customize shared tokens, and keep editable source in your application. The core is **MIT licensed**, written in **TypeScript**, and works **with or without Tailwind**.

[Try the visual builder](https://ui.coderocket.app) · [React documentation](https://ui.coderocket.app/docs/components) · [Vue documentation](https://ui.coderocket.app/docs/vue/components) · [Request Pro access](https://ui.coderocket.app/contact?intent=pro)
CodeRocket UI combines React and Vue components, interface blocks, a typed design-system model, and CLI/MCP integrations. Start from accessible primitives, customize shared tokens, and keep editable source in your application. The open-source core is **MIT licensed**, written in **TypeScript**, and works **with or without Tailwind**.

## Two frameworks, one design system

React uses Base UI. Vue uses native Vue single-file components and Reka UI. Both catalogues share tokens, layouts and core behavior, including date and range selection, forms, overlays and application blocks. Vue APIs use `v-model`, events and slots; framework-specific APIs are not interchangeable.

Use the components directly from this source workspace, or use the [hosted Studio](https://ui.coderocket.app/studio) to customize a library visually, review AI proposals and export its source. An account or AI provider is **not required** to use the open-source components locally. Svelte and SolidJS are planned, without announced release dates.

## Start with your own library

1. Open [Studio](https://ui.coderocket.app/studio) and create a React or Vue library.
2. Customize its tokens, components and blocks. AI assistance is optional.
3. Save, then **Export** a ZIP or use **Connect** to install the source through the CLI.

Exported components run locally without a CodeRocket connection. Follow the [React installation guide](https://ui.coderocket.app/docs/export) or [Vue and Nuxt guide](https://ui.coderocket.app/docs/vue) for dependencies and styles.

### Install and update source with the CLI

The CLI is available on npm as [`@coderocketapp/cli`](https://www.npmjs.com/package/@coderocketapp/cli). In Studio, open your saved library's **Connect** dialog and create a scoped connection token. Set `CODEROCKET_LIBRARY` and `CODEROCKET_TOKEN` in your environment, then run these commands from your application directory:

```sh
npx @coderocketapp/cli@latest init
npx @coderocketapp/cli@latest list
npx @coderocketapp/cli@latest add button
npx @coderocketapp/cli@latest sync
```

The library selects React or Vue source automatically. `sync` preserves local changes and puts conflicting updates aside for review. Keep connection tokens out of version control. See the [CLI guide](packages/cli/README.md) for blocks, complete-library installation and local import analysis.

### Give coding agents the same design rules

[`@coderocketapp/mcp`](https://www.npmjs.com/package/@coderocketapp/mcp) exposes a saved library's design rules, components and blocks through a read-only MCP server. Follow the [MCP setup guide](packages/mcp/README.md) to connect a compatible coding agent.

The CLI and MCP need no AI provider key. Agents can also use the [public Markdown documentation](docs/content), typed specifications and exported `AGENTS.md`. Review generated source before applying it to your application.

## What is open source?

| Package | What it provides |
| --------------------------------------- | -------------------------------------------------------------------------------------------- |
| [`@coderocket/react`](packages/react) | 48 React components, Base UI primitives, compiled CSS and a composition renderer. |
| [`@coderocket/blocks`](packages/blocks) | 26 React interface blocks with typed application callbacks. |
| [`@coderocket/vue`](packages/vue) | 48 Vue components and 26 Vue blocks, Reka UI primitives, CSS and a composition renderer. |
| [`@coderocket/react`](packages/react) | React components, Base UI primitives, compiled CSS and a composition renderer. |
| [`@coderocket/blocks`](packages/blocks) | React interface blocks with typed application callbacks. |
| [`@coderocket/vue`](packages/vue) | Vue components and blocks, Reka UI primitives, CSS and a composition renderer. |
| [`@coderocket/engine`](packages/engine) | Versioned design-system model, token validation, theme generation and reviewed token import. |
| [`@coderocket/specs`](packages/specs) | Shared catalogue specifications and validated composition schemas. |
| [`@coderocket/shared`](packages/shared) | Types and a read-only registry client for the integration tools. |
| [`@coderocket/cli`](packages/cli) | Local import analysis and installation/sync from a saved library, preserving local changes. |
| [`@coderocket/mcp`](packages/mcp) | A read-only MCP server exposing a saved library's rules and component sources. |
| [`@coderocketapp/cli`](packages/cli) | Local import analysis and installation/sync from a saved library, preserving local changes. |
| [`@coderocketapp/mcp`](packages/mcp) | A read-only MCP server exposing a saved library's rules and component sources. |

**CLI and MCP are distributed on npm.** The component and model packages remain source workspaces: build them locally, or use Studio exports and the CLI to install editable component source. The `@coderocket/react` and `@coderocket/vue` workspace names do not imply npm availability.

The [documentation source](docs/content) is public too. It is rendered at [ui.coderocket.app/docs](https://ui.coderocket.app/docs) by the separately maintained website.

The hosted Studio, accounts, database, AI-provider integration and commercial operations remain private. Authentication, payments, email delivery and uploads are not bundled component backends: blocks expose callbacks for your own application. The CLI's registry commands and MCP need a saved library and scoped connection token, or a compatible registry server.

The catalogue is experimental. Review accessibility, behavior and framework integration in your application's context before release.
The catalogue is experimental during early access. Review accessibility, behavior and framework integration in your application's context before release.

## Build from source

Use Node.js 24+ and pnpm 12.4.2. **This is a source distribution**: workspace package names do not imply a public npm release.
Use the Node.js and pnpm versions declared in [`package.json`](package.json):

```sh
git clone https://github.com/elreco/coderocket-ui.git
Expand All @@ -44,7 +93,7 @@ pnpm check

The checks validate and build the workspace and run its tests without contacting the Studio or an AI provider. The legacy datepicker is outside this pnpm workspace.

### React
### React workspace consumer

Add `@coderocket/react` as a `workspace:*` dependency in a pnpm workspace consumer. Import its compiled styles once:

Expand All @@ -61,7 +110,7 @@ export function App() {
}
```

### Vue
### Vue workspace consumer

Add `@coderocket/vue` as a `workspace:*` dependency in a Vue workspace consumer:

Expand All @@ -76,25 +125,19 @@ import "@coderocket/vue/styles.css";
</template>
```

See [development and integration](docs/DEVELOPMENT.md) for consumer dependencies, styles and framework differences. React 19.3 / Base UI 1.8 and Vue 3.5 / Reka UI 2.10 are the versions used by this source release.

### Coding agents, CLI and MCP

After building, run `node packages/cli/dist/index.mjs --help`. Follow the [CLI guide](packages/cli/README.md) for installation and sync, or the [MCP guide](packages/mcp/README.md) to expose a saved library to a compatible coding agent. The library's framework determines the returned source. No Gemini or other AI provider key is required by these clients.

[Markdown documentation](docs/content), typed specifications and a read-only MCP interface help agents use the same components and design rules as developers. Generated source still needs review before application.
See [development and integration](docs/DEVELOPMENT.md) for consumer dependencies, styles and framework differences.

## From Vue Tailwind Datepicker

This is the same repository, with its stars, issues and Git history. CodeRocket UI is its active successor; it is **not a drop-in replacement** for the old datepicker API.

**Vue Tailwind Datepicker is frozen and no longer maintained.** Its npm package, `@coderocketapp/vue-tailwind-datepicker`, remains available. Its source, original MIT attribution, changelog and documentation are preserved in [`legacy/vue-tailwind-datepicker`](legacy/vue-tailwind-datepicker). Existing applications can continue using their installed version; no automatic migration is required. No further legacy fixes or releases are planned.
**Vue Tailwind Datepicker is frozen and no longer maintained.** Its npm package, [`@coderocketapp/vue-tailwind-datepicker`](https://www.npmjs.com/package/@coderocketapp/vue-tailwind-datepicker), remains available. Its source, original MIT attribution, changelog and documentation are preserved in [`legacy/vue-tailwind-datepicker`](legacy/vue-tailwind-datepicker). Existing applications can continue using their installed version; no automatic migration is required. No further legacy fixes or releases are planned.

For new work, explore the [Vue DatePicker](https://ui.coderocket.app/docs/vue/components/date-picker) or [React DatePicker](https://ui.coderocket.app/docs/components/date-picker). Read the [transition announcement](ANNOUNCEMENT.md) and [legacy documentation](https://vue-tailwind-datepicker.com) before migrating.

## Hosted access and Pro

The hosted editor, component catalogue and source export are free. Signed-in accounts receive **5 trial AI generations in total**. Pro adds **100 AI generations per UTC calendar month** during an agreed paid period, subject to the shared service limit. Price, payment and activation are arranged personally; there is no automatic billing or renewal. Manual editing and export remain usable without AI allowance.
The hosted editor, component catalogue and source export are free. AI assistance has usage limits; see [current access and allowances](https://ui.coderocket.app/docs/pilot). Pro price, payment and activation are arranged personally, with no automatic billing or renewal. Manual editing and export remain usable without AI allowance.

[Request Pro or integration help](https://ui.coderocket.app/contact?intent=pro), or read [how access works](https://ui.coderocket.app/docs/pilot). Submitting a request does not charge you or activate paid access. GitHub stars and historical datepicker use are not permission for sales outreach.

Expand Down
2 changes: 1 addition & 1 deletion THIRD_PARTY_NOTICES.md
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,6 @@ The active CodeRocket UI packages and public documentation are licensed under th

The historical Vue Tailwind Datepicker source keeps its original [MIT license and Kenhyuwa attribution](legacy/vue-tailwind-datepicker/LICENSE). Moving that source does not remove or replace its license. Its original dependency manifests and lockfiles are preserved alongside it.

Third-party dependencies retain their own licenses. The active source uses React, React DOM, Base UI, Vue, Reka UI, Lucide, Zod and the Model Context Protocol SDK, among others. Dependency implementations are obtained through the package manager and are not relicensed by this repository. The public library build keeps runtime dependencies external.
Third-party dependencies retain their own licenses. The active source uses React, React DOM, Base UI, Vue, Reka UI, Lucide, Zod and the Model Context Protocol SDK, among others. Dependency implementations are obtained through the package manager and are not relicensed by this repository. The public library build keeps runtime dependencies external. The npm CLI and MCP clients bundle their runtime dependencies; each archive includes their full license texts in `THIRD_PARTY_NOTICES.md`.

Documentation examples and interface blocks do not provide hosted authentication, billing or storage services. The hosted CodeRocket UI application is maintained separately and is not licensed by this repository's MIT license.
Loading
Loading