Contribution

Configuration

Clone the repository

git clone https://github.com/plvo/shuip.git 
cd shuip

Install dependencies

bun install

Create a branch for your changes

git checkout -b feat/my-component

Start the development server

bun run dev

Add a component

File structure

Each shuip component follows this structure:

├── registry/
│   ├── ui/
│   │   └── my-component.tsx          	# Implementation of the component
│   └── examples/
│       └── my-component.tsx          	# Base example
│       └── my-component.with-state.tsx # Example with the title "With state"
│       └── my-component.disabled.tsx 	# Example with the title "Disabled"
├── docs/components/
│       └── my-component.mdx          	# Documentation of the component
└── registry.json                  		# Registry configuration

Detailed steps

Create your component in registry/ui/

Create at least one example in registry/examples/ (with the same name as the component file)

Generate and build the registry files

bun run registry:generate # Generates the registry/__index__.tsx file
bun run registry:build # Generates the JSONs in public/r/*

Create the component documentation in content/components/

bun run registry:generate # Generates the registry/__index__.tsx file
bun run registry:build # Generates the JSONs in public/r/*`}

Create the component documentation in content/components/

---
title: My Component
description: Description of the component
---

# Title

import { TypeTable } from 'fumadocs-ui/components/type-table';

## Examples

<ItemExamples registryName={'my-component'} /> 

## Props

<TypeTable
  type={{
    label: {
      description: 'The label of the component',
      type: 'string',
    },
  }}
/>

Submit your contribution

Create a Pull Request

git add .
git commit -m "feat: new component my-component"
git push origin feat/my-component

Thank you for your contribution to shuip! 🚀