		{
		"name": "contextmenu",
		"version": "0.1.2",
		"description": "A simple context menu for JavaScript",
		"main": "index.js",
		"types": "lib/src/index.d.ts",
		"scripts": {
		"test": "echo \"Error: no test specified\" && exit 1",
		"build": "rm -rf lib && webpack",
		"build-publish": "sh build/publish.sh"
		"version": "1.0.0",
		"license": "MIT",
		"dependencies": {
		"react": "^16.8.4",
		"react-dom": "^16.8.4"
		},
		"eslintConfig": {
		"extends": "react-app"
		},
		"main": "ContextMenu.js",
		"repository": {
		"type": "git",
		"url": "git+https://github.com/inker/contextmenu.git"
		"url": "https://github.com/tetranoir/contextmenu.git"
		},
		"keywords": [
		"context",
		"menu"
		],
		"author": "Anton Veselyev",
		"license": "ISC",
		"bugs": {
		"url": "https://github.com/inker/contextmenu/issues"
		},
		"homepage": "https://github.com/inker/contextmenu#readme",
		"dependencies": {
		"lodash": "^4.17.4"
		},
		"keywords": ["react", "js", "context", "menu", "hooks"],
		"devDependencies": {
		"awesome-typescript-loader": "^3.0.4-rc.2",
		"css-loader": "^0.26.1",
		"postcss-loader": "^1.3.0",
		"source-map-loader": "^0.1.6",
		"style-loader": "^0.13.1",
		"typescript": "^2.1.6",
		"url-loader": "^0.5.7",
		"webpack": "^2.2.1"
		"babel-eslint": "^9.0.0",
		"eslint": "^5.15.3",
		"eslint-config-react-app": "^3.0.8",
		"eslint-plugin-flowtype": "^2.50.3",
		"eslint-plugin-import": "^2.16.0",
		"eslint-plugin-jsx-a11y": "^6.2.1",
		"eslint-plugin-react": "^7.12.4"
		}
		}
		}

README.md

		@@ -1,26 +0,79 @@
		# contextmenu
		# ContextMenu
		ContextMenu is a context menu build on React (16.8+) hooks. ContextMenu provides a quick and easy way to create instant context menus without having to build jsx. This component supports submenus, custom component menu items, and edge detection.

		[![NPM version][npm-image]][npm-url] [![Downloads][downloads-image]][npm-url] [![Dependency status][david-dm-image]][david-dm-url] [![Dev Dependency status][david-dm-dev-image]][david-dm-dev-url]
		## Installation
		Using npm:
		```shell
		$ npm i contextmenu
		```

		A simple context menu for JavaScript
		## How To Use
		Import:
		```jsx
		import useContextMenu from 'contextmenu';
		import 'contextmenu/ContextMenu.css';
		```

		## Installation
		Build out your menu:
		```jsx
		const menuConfig = {
		'Say open': () => console.log('open'),
		'Disabled': null,
		'JSX line': <hr></hr>,
		'JSX': <div style={{height: 40, border: '1px solid green'}}>yes</div>,
		'Line': '---',
		'Submenu': {
		'Say wololol': () => console.log('wololol'),
		'Go deeper': {
		'Onceptioniningiong': () => console.log('inceptioniningiong'),
		},
		'Submenu 2': {
		'electric': console.log,
		'boogaloo': () => console.log('boogaloo'),
		},
		},
		};
		```
		npm install --save contextmenu

		Render your menu in your component:
		```jsx
		const [contextMenu, useCM] = useContextMenu({ submenuSymbol: 'O' });
		return <div onContextMenu={useCM(menuConfig)}>{...}{contextMenu}</div>
		```

		## Usage
		Same as normal `Map` & `WeakMap`, plus the `getKey`, `hasValue` & `deleteValue` methods.
		```javascript
		import ContextMenu from 'contextmenu'
		## API
		ContextMenu is built off hooks, which means you must render it within React functional components.

		// TODO
		### useContextMenu(props)
		- `props` is optional
		- `props` shape:
		```
		{
		submenuSymbol: jsx; // which means jsx component or string or null
		depth: number;
		// more to be added later
		}
		```

		[npm-url]: https://npmjs.org/package/contextmenu
		[downloads-image]: http://img.shields.io/npm/dm/contextmenu.svg
		[npm-image]: http://img.shields.io/npm/v/contextmenu.svg
		[david-dm-url]:https://david-dm.org/inker/contextmenu
		[david-dm-image]:https://david-dm.org/inker/contextmenu.svg
		[david-dm-dev-url]:https://david-dm.org/inker/contextmenu#info=devDependencies
		[david-dm-dev-image]:https://david-dm.org/inker/contextmenu/dev-status.svg
		### contextMenu
		- Returned from `useContextmenu()` which contains the `React.portal` to be rendered (onto `document.body`)
		- Must be in your render function, anywhere.

		### useCM(menuConfig)
		- `menuConfig` is a JSON that determines what the rendered context menu looks like.
		- menuConfig shape:
		```
		{
		[menu option name] :
		\| [option callback]
		\| [menuConfig]
		\| [jsx]
		\| "-----"
		\| null
		}
		```
		- [menu option name] is used in conjection with [option callback] to create an option that does something
		- [menu option name] is used in conjection with another `menuConfig` to create a submenu
		- [menu option name] is used with `null` when the item is disabled
		- [jsx] shows custom renderings inside menu options ([menu option name] is unused here)
		- "---" is a shortcut to display a separation line between menu items ([menu option name] is unused)

.npmignore

build/increment-version.js

build/publish.sh

index.js

lib/index.js

lib/index.js.map

lib/src/index.d.ts

postcss.config.js

src/index.ts

src/style.css

test/test.ts

tsconfig.json

webpack.config.js

contextmenu - npm Package Compare versions

New alerts

Fixed alerts

Improved metrics

Worsened metrics

Dependency changes