📦 Flexible SideMenu

A lightweight and customizable collapsible sidebar menu component for React and Next.js 🚀. Easily plug it into your project and build responsive side menus in seconds.

🚀 Installation

npm install flexible_sidemenu

or

yarn add flexible_sidemenu

📖 Usage

import React from "react";
import { SideMenu } from "flexible_sidemenu";

function App() {
  return (
    <div>
      <SideMenu />
      <h1>My App Content</h1>
    </div>
  );
}

export default App;

🎨 Customization

The component includes default styles via SideMenu.css. You can override or extend them with your own styles:

/* Example custom style */
.side-menu {
  background: #1e1e1e;
}

.menu-items li:hover {
  color: #00bcd4;
}

🛠️ Props

| Prop | Type | Default | Description | | ----------- | --------- | --------------------------------------- | -------------------------------- | | className | string | "" | Add custom CSS classes | | items | string[] | ["🏠 Home", "📄 About", "📞 Contact"] | Menu items to render dynamically |

📂 Project Structure

src/
 ├─ components/
 │   ├─ SideMenu.jsx   # React component
 │   ├─ SideMenu.css   # Styles
 ├─ index.js           # Export entry

📝 Development

1. Clone the repo:

   git clone https://github.com/your-username/flexible_sidemenu.git

2. Install dependencies:

   npm install

3. Run dev server:

   npm start