Contributing

We welcome contributions of all kinds — bug fixes, new templates, UI components, documentation improvements, and CLI enhancements. This guide walks you through everything you need to get started.

Getting the Repository

# Clone the repo
git clone https://github.com/CSEdgeOfficial/ui.git
cd ui

# Install dependencies
npm install

# Start the docs app dev server
cd docs-app && npm run dev

Project Layout

The monorepo is organized as follows:

templates/TypeScript template generator functions. Each file exports one named template function.
bin/csedge.mjsThe full CLI tool. Add new commands, UI components, or template aliases here.
docs-app/Next.js documentation site. Add new doc pages under app/docs/<slug>/page.tsx.
docs-app/components/Reusable UI primitives and documentation components used across the docs site.

Adding a New Template

Templates are TypeScript functions in the templates/ directory. Follow these steps:

  1. Create templates/my-template.ts exporting a function with the standard signature
  2. Register it in bin/csedge.mjs inside the TEMPLATES object
  3. Add its metadata to docs-app/app/templates/data.ts
  4. Test with node bin/csedge.mjs add template my-template
// templates/my-template.ts
export const myTemplate = (
  name: string,
  about: string,
  projects: Project[],
  theme: ThemeConfig
): string => {
  return `<!DOCTYPE html>
<html lang="en">
<head>
  <title>${name}</title>
  <style>/* your CSS here */</style>
</head>
<body>
  <!-- your HTML here -->
</body>
</html>`;
};

Adding a UI Component

UI components are registered in two places:

  1. Add the component name to the UI_COMPONENT_NAMES array in bin/csedge.mjs
  2. Add its React source string to the components object in addUi()
  3. Add a ComponentPreview block in docs-app/app/docs/components/page.tsx
  4. Add it to the componentsCategories in docs-app/components/docs/sidebar.tsx

Commit Conventions

We use conventional commits for automated changelog generation:

feat: add holographic glitch template
fix: correct sidebar scroll reset on navigation
docs: update architecture page with CSS token examples
chore: bump Next.js to 15.2.0

Pull Request Checklist

✓New templates export the standard function signature
✓UI components are registered in the CLI and the docs page
✓No new external npm dependencies introduced
✓TypeScript compiles without errors (npm run build)
✓Doc page added or updated for any new feature

Community

Questions or ideas? Open a GitHub Issue or reach us at contact@csedge.co. We review PRs weekly and aim to merge clean contributions within 5 business days.