An open API service indexing awesome lists of open source software.

https://github.com/idea2app/shadcnx

A command line helper for Shadcn UI CLI, Git commit modified component codes only.
https://github.com/idea2app/shadcnx

command-line component-library git shadcn-ui

Last synced: 5 months ago
JSON representation

A command line helper for Shadcn UI CLI, Git commit modified component codes only.

Awesome Lists containing this project

README

          

# ShadcnX CLI

A command line helper for [Shadcn UI CLI][1], `git commit` modified component codes only.

[![NPM Dependency](https://img.shields.io/librariesio/github/idea2app/ShadcnX.svg)][2]
[![CI & CD](https://github.com/idea2app/ShadcnX/actions/workflows/main.yml/badge.svg)][3]

[![NPM](https://nodei.co/npm/shadcn-helper.png?downloads=true&downloadRank=true&stars=true)][4]

## Features

- 🚀 Automatic framework detection (React, Vue, Svelte)
- 📦 Smart CLI selection based on `components.json#$schema` or `package.json`
- 🔧 Git-friendly: only commits modified component codes

## Installation

```bash
npm i shadcn-helper -g
```

## Framework Detection

ShadcnX automatically detects your project's framework and uses the appropriate CLI:

- **React** uses `shadcn` CLI with schema `https://ui.shadcn.com/schema.json`
- **Vue** uses `shadcn-vue` CLI with schema `https://www.shadcn-vue.com/schema.json`
- **Svelte** uses `shadcn-svelte` CLI with schema `https://www.shadcn-svelte.com/schema.json`

Detection priority:

1. If `components.json` exists, uses the `$schema` field to determine the framework
2. Otherwise, detects framework from `package.json` dependencies (`react`, `vue` or `svelte`)
3. Defaults to React if no framework is detected

## Usage

### add components

```bash
shadcn-helper add official-component-name https://third-party.org/path/to/component
```

### edit a component

```bash
shadcn-helper edit component-name
```

### install added components

```json
{
"name": "my-web-app",
"private": true,
"scripts": {
"install": "npx shadcn-helper install"
}
}
```

## User cases

1. https://github.com/idea2app/Next-shadcn-ts

[1]: https://ui.shadcn.com/docs/cli
[2]: https://libraries.io/npm/shadcn-helper
[3]: https://github.com/idea2app/ShadcnX/actions/workflows/main.yml
[4]: https://www.npmjs.com/package/shadcn-helper