nocta-ui

KO | EN

gitlite — search

#react #ai #typescript #golang #rust #docker #macos #nodejs #cli #awesome-list #pytorch #mcp #ios #open-source

(★ 124)

Modern, accessible React components built with TypeScript and Tailwind CSS.

파일 탐색기

최종 버전 다운로드 (.zip)

- - bug_report.md
  - config.yml
  - feature_request.md
- - vercel-merge.yml
  - vercel-pull-request.yml
- pre-commit
- - .gitignore
  - cli.json
  - env.d.ts
  - mdx-components.tsx
  - next.config.mjs
  - package.json
  - postcss.config.mjs
  - source.config.ts
  - tsconfig.json
- - .gitignore
  - package.json
  - tsconfig.json
- build-components.sh
- sync-css-tokens.sh
- sync-icons.sh
.gitignore
biome.json
CONTRIBUTING.md
LICENSE
nocta-ui.jpeg
package.json
pnpm-lock.yaml
pnpm-workspace.yaml
README.md
vercel.json

// repository documentation

Was this content helpful?

★ 0 (0 ratings)

<p align="center">
  <a href="https://nocta-ui.com">Documentation</a> ·
  <a href="https://github.com/nocta-ui/nocta-ui/issues">Issues</a> ·
  MIT License
</p>

# Nocta UI
Nocta UI is a React component library delivered as source files you control. The CLI keeps installs lightweight and version-free while interactive components build on `@ariakit/react` for accessible behavior out of the box.

## Supported Stacks
- Next.js (App and Pages Router)
- Vite + React
- React Router 7
- TanStack Start
- Custom React workspaces (library or shared UI packages)

## Requirements
- Node.js 18+
- React 18+
- Tailwind CSS v4 present in the workspace
- TypeScript

## Quick Start
**Discover components**
```bash
npx @nocta-ui/cli list
```

**Single workspace (Next.js, Vite, and other supported frameworks)**
```bash
npx @nocta-ui/cli init
npx @nocta-ui/cli add button card badge
```
`init` analyses the current project, writes `nocta.config.json`, updates `nocta.workspace.json`, and drops helpers (`lib/utils.ts`, `lib/icons.ts`) when the workspace owns them. `add` copies registry components into the configured `aliases.components` path and installs any missing dependencies.

**Monorepo linking (shared UI + application)**
```bash
cd packages/ui
npx @nocta-ui/cli init                # choose Shared UI (writes config + helpers)

cd ../apps/web
npx @nocta-ui/cli init                # choose Application, link "ui"
npx @nocta-ui/cli add button card     # component source flows into packages/ui
```
- `init` registers both workspaces inside `nocta.workspace.json`. The shared package keeps the helpers and Tailwind tokens; the application records the link.
- `add` runs from the application but writes React source into `packages/ui/src/...`, updates export barrels, and installs dependencies in the owning workspace. Application-side stubs are generated only when required.
- Apps import from the shared package output (`import { Button } from "ui"`). Rebuild the shared package after each add (`bun run --filter ui build` or `bun run --filter ui dev`) so consumers read fresh artefacts.

## `init` Command Reference
- Detects the repo root, framework, package manager, and Tailwind v4.
- Builds a tailored `nocta.config.json` with component and utility aliases.
- Writes shared helpers (`lib/utils.ts`, `components/lib/icons.ts`) when needed.
- Injects Nocta design tokens into your Tailwind entry file for managed workspaces.
- Updates or creates `nocta.workspace.json` so other workspaces can discover this setup.

### Flags
| Flag | Description |
| --- | --- |
| `--dry-run` | Preview every action without touching the filesystem. |
| `--help` | Show command-specific help. |
| `--registry-url` | Point to a custom component registry (or use `NOCTA_REGISTRY_URL`). |

## After `init`
- Add components with `npx @nocta-ui/cli add <component...>`.
- Browse the component registry at `https://nocta-ui.com` or via the CLI prompts.
- Keep your working tree clean; the CLI rolls back if something fails after file writes.

## Contributing
- We welcome contributions! Whether it's bug reports, feature requests, or code contributions, please feel free to open an issue or submit a pull request.
- Read `CONTRIBUTING.md` for detailed guidelines.

## License
- MIT License - see [LICENSE](LICENSE) for details.

nocta-ui

파일 탐색기

오늘의 추천 프로젝트

Was this content helpful?

Recent Feedback

nocta-ui

파일 탐색기

오늘의 추천 프로젝트

Was this content helpful?

Recent Feedback

Download README