https://github.com/amirho1/react-right-click-context-menu
React right-click context menu helps you to prevent users from having default right click also gives u a custom able menu by the way helps u to have different menu on different elements
https://github.com/amirho1/react-right-click-context-menu
browser-context-menu browser-right-click-menu context-menu contextmenu javascript react-context-menu react-right-click-menu right-click-menu typescript
Last synced: 4 months ago
JSON representation
React right-click context menu helps you to prevent users from having default right click also gives u a custom able menu by the way helps u to have different menu on different elements
- Host: GitHub
- URL: https://github.com/amirho1/react-right-click-context-menu
- Owner: amirho1
- License: mit
- Created: 2021-11-19T19:28:44.000Z (over 3 years ago)
- Default Branch: main
- Last Pushed: 2021-11-22T15:47:35.000Z (over 3 years ago)
- Last Synced: 2024-03-23T12:11:14.132Z (about 1 year ago)
- Topics: browser-context-menu, browser-right-click-menu, context-menu, contextmenu, javascript, react-context-menu, react-right-click-menu, right-click-menu, typescript
- Language: TypeScript
- Homepage: https://amirho1.github.io/react-right-click-context-menu/
- Size: 1.56 MB
- Stars: 6
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# React-right-click-menu
A custom context menu with a default styles but u can modify it and set ur style
## Installation
```
npm i react-right-click-context-menu
```
also You can clone it
```
git clone https://github.com/amirho1/react-right-click-context-menu
```
then
## Installing Dependencies
```
npm i
```
## test
```
npm run test
```
## Demo
```
npm run serve
```
## Build
after getting build you need to copy the scss files in to their files in dist for example MapLI.scss and RightClickMenu.scss
```
npm run build
```
## Example
```javascript
github
,
Copy
,
checkbox
,
],
},
{
className: "demo-left",
menuList: [
linkedin
,
Paste
,
{" "}
delete
,
],
},
]}
/>
```
## Demo Example
```javascript
export default function Demo() {
return (
github
,
Copy
,
checkbox
,
],
},
{
className: "demo-left",
menuList: [
linkedin
,
Paste
,
{" "}
delete
,
],
},
]}
/>
React-right-click-menu
React right click menu is a library to help developer focus on the
main concept it supports{" "}
Typescript also
Javascript
click on sides to see the default style and behavior of menu for
further reading go to repository
Repository
Author :{" "}
{" "}
AmirHossein Salighedar
);
}
```
## Properties
| Name | Type | Description |
| ---------------------- | -------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------ |
| rightClickTargets | {className: string, menuList: element or string}[] | targets that we want to have contextMenu it's required and className is name of targets that library should follow them, menuList is context menu list Items |
| menuClassName | string | className of UL the (wrapper) |
| liClassName | string | className of each LI inside UL |
| preventDefaultOnWindow | boolean | by default true preventsFrom right click on window |
## License
[MIT](./LICENSE)
## Author
[Xerxes (AmirHossein Salighedar)](https://github.com/amirho1)