react-jsx-context-menu

A context menu implementation for React

Usage no npm install needed!

<script type="module">
  import reactJsxContextMenu from 'https://cdn.skypack.dev/react-jsx-context-menu';
</script>

README

NPM

react-jsx-context-menu

Installation

Using npm:

npm install --save react-jsx-context-menu

Using yarn:

yarn add react-jsx-context-menu

Usage

Here is a simple example of how to use:

import React from 'react';
import { render } from 'react-dom';
import ContextMenu from 'react-jsx-context-menu';

function App() {
  return (
    <div>
      <ContextMenu
        menu={
          <div
            style={{
              display: 'flex',
              flexDirection: 'column',
            }}
          >
            <button>Button 1</button>
            <button>Button 2</button>
          </div>
        }
      >
        <div>
          Right click me to see the context menu
        </div>
      </ContextMenu>
    </div>
  );
}
render(<App />, document.getElementById('root'));

You can play around with it here: https://codesandbox.io/s/5mxow9wkon

License

MIT