Adding Components from shadcn

When you're building your project, leveraging the shadcn registry through shadxn allows for an efficient way to integrate high-quality UI components. This guide walks you through the process of adding shadcn components to your project, with a focus on utilizing the type option for component filtering.

Using the add Command with Type Filtering

The shadxn add command not only lets you choose components from the shadcn registry but also offers the ability to filter components based on their type. By default, shadcn components are of the ui type, which includes a wide array of user interface elements.

Specifying Component Type

If you wish to narrow down your component selection to a specific type, such as ui, you can use the -t option. This option filters the available components to match your specified type, making it easier to find and add the components relevant to your project's needs.

To add UI components from the shadcn registry, specify the ui type as follows:

shadxn add -t ui

Upon running this command with the -t ui option, shadxn will present you with a list of UI components available in the shadcn registry:

? Which components would you like to add? › Space to select. A to toggle all. Enter to submit. 
◯   accordion
◯   alert
◯   alert-dialog
◯   aspect-ratio
◯   avatar
◯   badge
◯   button
◯   calendar
◯   card
◯ ↓ carousel

Selecting Components

Use the Space key to select the components you want to add to your project. After making your selections, press Enter to confirm. The selected components will then be added to your project, tailored to the ui type you specified.

Filtering components by type with the shadxn add command streamlines the process of integrating shadcn registry components into your project. By utilizing the -t option, you can efficiently add components that match your project's specific design and functionality requirements, enhancing the development experience with precisely selected UI elements.