CLI

Use the SickUI CLI to add components to your project.

Installation

npm install -g @sickui/cli

Usage

Use the sickui command to add components to your project.

npx @sickui/cli init

You will be asked a few questions to configure components.json:

Which style would you like to use? › Default
Which color would you like to use as base color? › Slate
Would you like to use CSS variables for colors? › no / yes

Commands

init

npx @sickui/cli init

Initialize your project and install dependencies.

Options

Usage: sickui init [options]

initialize your project and install dependencies

Options:
  -y, --yes        skip confirmation prompt. (default: false)
  -d, --defaults,  use default configuration. (default: false)
  -c, --cwd <cwd>  the working directory. defaults to the current directory.
  -h, --help       display help for command

add

npx @sickui/cli add [component]

Add a component to your project.

npx @sickui/cli add button

You can also run the command without any arguments to view a list of all available components:

npx @sickui/cli add

Options

Usage: sickui add [options] [components...]

add a component to your project

Arguments:
  components         the components to add

Options:
  -y, --yes          skip confirmation prompt. (default: false)
  -o, --overwrite    overwrite existing files. (default: false)
  -c, --cwd <cwd>    the working directory. defaults to the current directory.
  -a, --all          add all available components (default: false)
  -p, --path <path>  the path to add the component to.
  -h, --help         display help for command

list

npx @sickui/cli list

List all available components.

diff (experimental)

npx @sickui/cli diff [component]

Check for updates against the registry.

Running the following command will check if there's an update available for the button component:

npx @sickui/cli diff button

FAQ

Why use a CLI instead of an npm package?

The CLI approach gives you full control over the components. You can modify them as needed, and you don't have to worry about version conflicts or breaking changes.

Can I use this in my existing project?

Yes! The CLI is designed to work with existing projects. Just run npx @sickui/cli init to get started.

What happens when I run init?

Running init will:

  1. Create a components.json file in your project root
  2. Create a lib/utils.ts file with the cn helper function
  3. Install the required dependencies
  4. Set up your tailwind.config.js file

Can I customize the components after adding them?

Absolutely! That's the whole point. The components are copied to your project, so you can modify them however you like.