CmouseG / react-sidebar-layout

Easy way to add side box

Layout see an example

Usage

import Layout from 'react-layout-drawer';

<Layout>
    <Layout.Drawer>
        ...
    </Layout.Drawer>
    <Layout.Page>
        ...
    </Layout.Page>
</Layout>

Example View

Component features

If you need to open the box, you can use the context api. Context for the box is available inside on any nesting.

import Layout from 'react-layout-drawer';

<Layout.Consumer>
    {({ openDrawer, closeDrawer }) => (
        <div>
            <button onClick={openDrawer}>Open</button>
            <button onClick={closeDrawer}>Close</button>
        </div>
    )}
</Layout.Consumer>

Properties