Introduction

React-Shadcn Extended is a collection of reusable components that you can use in your React and shadcn-ui based projects. This collection has been developed to create and use certain missing and complex components in shadcn-ui in a simpler way.

Simplifying Complex Components

The complex components in the shadcn-ui collection typically look like this:

<Select>
  <SelectTrigger className="w-[180px]">
    <SelectValue placeholder="Theme" />
  </SelectTrigger>
  <SelectContent>
    <SelectItem value="light">Light</SelectItem>
    <SelectItem value="dark">Dark</SelectItem>
    <SelectItem value="system">System</SelectItem>
  </SelectContent>
</Select>

These components are complex and cause a lot of code repetition. Therefore, I tried to simplify them to make the code more suitable for daily use and more readable.

While creating the components, I used shadcn-ui and React without any other libraries. This way, you can directly integrate these components into your code using shadcn-ui components.

Creating Missing Components

I have also tried to create some of the components that you might need in your project but are not available in the shadcn-ui collection. These components have also been created using shadcn-ui components.