Skip to main content

Introduction

Welcome to the React Component Library! This library provides a set of reusable and customizable components for building modern React applications. It aims to offer a consistent and flexible user interface for your web applications, with fully customizable components that can easily integrate with Tailwind CSS and can be customized to meet your specific project needs.

Whether you're building a dashboard, admin panel, or any other type of application, this library offers a collection of components like buttons, cards, modals, forms, icons, and more to streamline your development process.

🚀 Key Features​

  • Reusable Components: Easy-to-use components for common UI elements such as buttons, modals, cards, etc.
  • Tailwind CSS Integration: Pre-configured to work seamlessly with Tailwind CSS for styling.
  • Customizable: Extensive props and configuration options allow you to modify components according to your project requirements.
  • Mobile-First: Components are responsive and work well across different screen sizes.
  • Accessible: Focused on building accessible components for improved user experience.

Installation​

To get started with the library in your project, you can easily install it from npm.

Step 1: Install the Library​

Run the following command to install the component library into your React project:

npm install @sahilphondekar/react-component-library

If you're using Yarn, you can install it using:

yarn add @sahilphondekar/react-component-library

Step 2: Import and Use Components​

Once the package is installed, you can start using the components in your project. Here’s an example of how to import and use the Button component:

import { Button } from "@sahilphondekar/react-component-library";

const MyComponent = () => (
  <Button color="blue" size="lg">
    Click Me
  </Button>
);

Step 3: Styling with Tailwind CSS (Optional)​

If you haven’t already set up Tailwind CSS in your project, you can follow the official Tailwind CSS installation guide to configure it. The component library works seamlessly with Tailwind, so you can benefit from the utility-first styling out of the box.