Hasodi-lib NPM

Hasodi Lib

A lightweight and customizable React component library designed to accelerate your development process. With `hasodi-lib`, you can seamlessly integrate reusable UI components into your projects while maintaining flexibility and simplicity.

Features

🚀 Reusable Components: Simplify your UI development with pre-built components.
🎨 Customizable: Tailor components to match your design system or branding.
🌟 Modern Tooling: Built using Vite for fast builds and optimized performance.
🧩 Extendable: Exported hooks and utilities to enhance your component workflows.
🔌 React-Friendly: Works with React 18+ and supports both CommonJS and ES Modules.

Installation

Install the library using your package manager:

# Using npm
npm install hasodi-lib

# Using yarn
yarn add hasodi-lib

# Using pnpm
pnpm add hasodi-lib

Usage

Import the components you need into your React project:

import { Button } from "hasodi-lib";

export default function App() {
  return <Button label="Click Me!" onClick={() => alert("Button Clicked")} />;
}

Available Components

Button: A customizable button with different styles and states.
Input: A responsive input field for forms.
Card: A container for displaying grouped content.

For detailed examples and props for each component, refer to the documentation.

Exported Hooks

Leverage hooks to add advanced functionality to your components:

import { useToggle } from "hasodi-lib";

export default function ToggleExample() {
  const [isToggled, toggle] = useToggle(false);

  return (
    <div>
      <p>The toggle is {isToggled ? "ON" : "OFF"}</p>
      <button onClick={toggle}>Toggle</button>
    </div>
  );
}