react-pretty-drawer v0.2.7

⚛️ react-pretty-drawer

Simple and pretty React drawer component. View demo

📦 Install

The easiest way to use react-pretty-drawer is to install it from npm and include it in your React build process

$ npm install --save react-pretty-drawer

$ yarn add react-pretty-drawer

Features

• Open-close animation
• Closable dialog
• Available for customization

Usage

import React, {useState} from 'react';
import * as ReactDOM from "react-dom";
import {Drawer} from 'react-pretty-drawer';

const Example = () => {
    let [visible, setIsVisible] = useState(false);

    const closeDrawer = () => setIsVisible(false);
    const openDrawer = () => setIsVisible(true);

    return (
        <>
            <Drawer
                visible={visible}
                onClose={closeDrawer}
            >
                <div>Drawer body</div>
            </Drawer>
            <button onClick={openDrawer}>Open</button>
        </>
    );
};

ReactDOM.render(<Example />, document.getElementById("root"));

API

License

MIT