Development Setup

Development Setup

How to clone, build, test, and contribute to modern-cmdk.

---

Prerequisites

Tool	Version	Notes
Node.js	22+	Required for ES2026 support
pnpm	11.0.0-alpha.12+	Workspace management
Rust	1.82+	Only needed for WASM package
wasm-pack	0.13+	Only needed for WASM package

---

Clone and Install

git clone https://github.com/ABCrimson/modern-cmdk.git
cd modern-cmdk
pnpm install

---

Build

# Build all packages
pnpm build

# Build specific package
pnpm --filter modern-cmdk build
pnpm --filter modern-cmdk/react build
pnpm --filter modern-cmdk-search-wasm build
pnpm --filter modern-cmdk build

# Build docs
pnpm --filter docs build

# Build playground
pnpm --filter playground build

Build tool: tsdown 0.21.0 with isolatedDeclarations: true for fast .d.ts generation.

---

Test

# Run all unit tests
pnpm test

# Run with coverage
pnpm test:coverage

# Run specific test file
pnpm --filter modern-cmdk test -- search.test.ts

# Run benchmarks
pnpm bench

# Run E2E tests (requires build first)
pnpm test:e2e

# Run E2E with UI
pnpm test:e2e:ui

Test Stack

Tool	Version	Purpose
Vitest	4.1.0-beta.6	Unit + benchmark tests
happy-dom	20.8.3	DOM environment for React tests
Playwright	1.59.0-alpha	E2E browser tests

---

Lint and Format

# Lint all files
pnpm lint

# Format all files
pnpm format

# Check formatting without writing
pnpm format:check

# Type check
pnpm typecheck

Linter/formatter: Biome 2.4.6 (replaces ESLint + Prettier).

---

Development Workflow

# Start docs dev server
pnpm --filter docs dev

# Start playground dev server
pnpm --filter playground dev

# Watch mode for core package
pnpm --filter modern-cmdk dev

---

WASM Development

The WASM search crate lives in packages/command-search-wasm/crate/:

cd packages/command-search-wasm

# Build WASM
wasm-pack build crate --target web --out-dir ../wasm

# Run Rust tests
cargo test --manifest-path crate/Cargo.toml

# Bench Rust
cargo bench --manifest-path crate/Cargo.toml

---

Commit Conventions

Commits follow Conventional Commits:

feat(core): add keyboard shortcut registry
fix(react): prevent stale closure in useCommandState
perf(wasm): optimize trigram index lookup
docs: add virtualization guide
test(core): add stress tests for 100K items
chore: update dependencies

Scopes: core, react, wasm, codemod, docs, playground

---

Branch Strategy

Branch	Purpose
main	Stable, release-ready code
feat/*	New features
fix/*	Bug fixes
perf/*	Performance improvements
docs/*	Documentation updates

---

Release Process

Releases are versioned per-package using semver. Tags follow the format v{version} (e.g., v0.8.0).

# Update version
pnpm --filter modern-cmdk version patch

# Build and test
pnpm build && pnpm test

# Create git tag
git tag v0.x.x

# Publish
pnpm --filter modern-cmdk publish