My Component Library

A React component library built with TypeScript, Tailwind CSS, and Framer Motion.

Installation

npm install @divisionx/component-library

Peer Dependencies

Make sure to install the required peer dependencies:

npm install react react-dom framer-motion lucide-react clsx tailwind-merge date-fns react-router-dom

Also, ensure Tailwind CSS is configured in your project.

Usage

import { AlertV1, CheckBoxV1 } from '@divisionx/component-library';

function App() {
  return (
    <div>
      <AlertV1 title="Hello" message="This is an alert component" />
    </div>
  );
}

Components

• AlertV1
• BreadCrumbV1, BreadCrumbV2
• CalenderV1, CalenderV2, CalenderV3
• CheckBoxV1
• ConfirmationDialogDark, ConfirmationDialogGlassLight, ConfirmationDialogLight
• DropDownV1
• FileUploadV1, FileUploadV2
• LoaderV1
• PaginationV1, PaginationV2
• ProgressBarV1
• SearchBarV1
• SideBarV1, SideBarV2, SideBarV3
• ToastV1
• ToggleV1
• TooltipComp, TooltipV1, TooltipV2, TooltipV3

License

MIT

Build for production

bun run build

Preview production build

bun run preview

## Project Structure

src/ ├── App.tsx # Root component ├── main.tsx # Entry point └── index.css # Global styles (Tailwind import)

## Notes

- Tailwind v4 uses `@import "tailwindcss"` — no `tailwind.config.js` needed
- `@tailwindcss/vite` handles the Vite integration automatically