React Dynamic Side Navbar

React Dynamic Side Navbar provides components for creating dynamic multi level dropdown and search facility with many more features.

Installation

yarn

yarn add dynamic-sidenavbar

npm

npm install dynamic-sidenavbar

Live Preview

• Demo

Usage

Import

import DynamicSidebar from "dynamic-sidenavbar";
import logo from "./logo.png"; //  mendatory if header="logo"

const childCompRef = React.useRef(null);
const saveNewData = () => {
  const newNavData = childCompRef?.current?.newNavData();
  const styleData = childCompRef?.current?.styleData();
  console.log(newNavData);
  console.log(styleData);
};

Component

<DynamicSidebar
  ref={childCompRef}
  activeCreateButton={true} //after complete data making, pass the prop as false 
  saveNewData={() => saveNewData()}
  logo={logo} // mendatory if header="logo"
/>

Shortcut keys

ctrl + alt + o --- to open
ctrl + alt + c --- to minimize