npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

@shadx/cli

v1.0.6

Published

A CLI tool to generate UI components for your project

Downloads

484

Readme

Shadcn-Extension

A CLI (inspired by shadcn-ui) for adding components to your project, making it easier to integrate and manage UI components within your codebase.

Installation

To get started with the shadcn-Extension CLI, ensure you have npx installed. This tool allows you to run packages directly from npm without globally installing them.

NOTE

ALL TYPES PACKAGES FOR NOW NEEDS TO BE INSTALLED MANUALLY

Usage

Initializing a New Project

Use the init command to initialize dependencies for a new project. This command sets up everything you need, including installing necessary dependencies, adding the cn utility, configuring tailwind.config.js, and setting up CSS variables.

  1. Initialize Dependencies

    Run the following command to initialize the project:

    npx shadcn-ui init
  2. Initialize Shadcn-Extension CLI

    Next, set up your project with the shadcn-extension CLI:

    npx @shadx/cli init

Adding Components

Use the add command to add components to your project. This command installs the required dependencies and integrates the specified component into your project.

  1. Add a Specific Component

    To add a specific component, specify the component name:

    npx @shadx/cli add [component]

    Example:

    Adding a tree-view component:

    npx @shadx/cli add tree-view
  2. View Available Components

    If you want to see a list of all available components, run the add command without any arguments:

    npx @shadx/cli add

    This will display a list of components that you can add to your project.

Full Documentation

For detailed documentation, including installation guides, component usage, and more, visit the shadcn-Extension Documentation.

License

This project is licensed under the MIT license.

Contributing

Contributions are welcome! If you have suggestions for improvements, please open an issue or submit a pull request on the GitHub repository.