# @jacobjonsson/react-burger-menu

> [![Package size](https://badgen.net/bundlephobia/minzip/@jacobjonsson/react-burger-menu)](https://bundlephobia.com/result?p=@jacobjonsson/react-burger-menu)

Latest version **0.0.4** (published 2019-09-29) · MIT license · 0 weekly downloads

## Install

```sh
npm install @jacobjonsson/react-burger-menu
pnpm add @jacobjonsson/react-burger-menu
yarn add @jacobjonsson/react-burger-menu
bun add @jacobjonsson/react-burger-menu
```

## Health

**Score 30/100 (F)** — status: abandoned.

Positive: has types; esm support; no vulnerabilities; high quality score.

Warnings: low downloads; pre 1.0.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 0.0.4 |
| Published | 2019-09-29 |
| First published | 2019-09-29 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | bundled |
| Module format | ESM + CommonJS |
| Dependencies | 0 |
| Unpacked size | 16.2 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Maintainers | jacobjonsson |

## Links

- npm: https://www.npmjs.com/package/@jacobjonsson/react-burger-menu
- npm.io page: https://npm.io/package/@jacobjonsson/react-burger-menu

## Recent versions

- 0.0.4 (latest) — 2019-09-29
- 0.0.3 — 2019-09-29
- 0.0.2 — 2019-09-29
- 0.0.1 — 2019-09-29

## README

# React burger menu

[![Package size](https://badgen.net/bundlephobia/minzip/@jacobjonsson/react-burger-menu)](https://bundlephobia.com/result?p=@jacobjonsson/react-burger-menu)

`react-burger-menu` provides a zero dependency left sliding burger menu.

## Usage

Install from npm

```sh
yarn add @jacobjonsson
```

```jsx
import { ReactBurgerMenu } from '@jacobjonsson/react-burger-menu';
// Include the base styles
import '@jacobjonsson/react-burger-menu/ReactBurgerMenu.css';

function App() {
  const [open, setOpen] = useState(false);

  return (
    <ReactBurgerMenu show={open} onOverlayClick={() => setOpen(false)}>
      <ul>
        <li>
          <a href="https://www.facebook.com">Facebook</a>
        </li>

        <li>
          <a href="https://www.instagram.com">Instagram</a>
        </li>

        <li>
          <a href="https://www.twitter.com">Twitter</a>
        </li>
      </ul>
    </ReactBurgerMenu>
  );
}
```

## Props

| Name           | Description                                        | Type       |
| -------------- | -------------------------------------------------- | ---------- |
| show           | Indicates if the menu should be shown or not       | boolean    |
| onOverlayClick | Will be called when the user clicks on the overlay | () => void |

---
_Source: https://npm.io/package/@jacobjonsson/react-burger-menu · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._