React SidebarJS

Create mobile sidebar/sidenav experiance in react.

npm install react-sidebarjs --save

Demo

Open the demo on your device and try the touch gestures!

• RawGit

Import

import {SidebarJS, sidebarService} from 'react-sidebarjs';

Implementation

import {SidebarJS, sidebarService} from 'react-sidebarjs';
import {NavLink} from 'react-router-dom';

<SidebarJS sidebarjsName="MainSidebar">
  <h3>React SidebarJS</h3>
  <nav>
    <NavLink
      to="/home"
      onClick={() => sidebarService.close('MainSidebar')}>
      Home 
    </NavLink>
  </nav>
</SidebarJS>

API

<SidebarJS
  sidebarjsName={/* string */}
  sidebarjsConfig={/* SidebarConfig | See: https://github.com/SidebarJS/sidebarjs#options */}
  onOpen={() => void}
  onClose={() => void}
  onChangeVisibility={(changes: {isVisible: boolean}) => void}>
</SidebarJS>