Skip to content

jasurhaydarovcode/react-mower

Repository files navigation

React Mower

A powerful React package for protecting your web applications from unwanted developer tools access and cursor-based interactions.


Features

  1. 🛡️ Block Developer Tools access
  2. 🖱️ Cursor protection
  3. 📸 Block screenshot
  4. ⚡ Lightweight and easy to use
  5. 🔳 Github Star Button Count
  6. 🔒 Multiple protection layers

Installation

npm install react-mower
This package requires react-toastify as a peer dependency, and you only need to install react-mower

Usage

Basic Setup

Loading in the main.tsx component

DevTools Blocker Only using main.tsx
import 'react-toastify/dist/ReactToastify.css';
import { DevToolsBlocker } from 'react-mower';

    <DevToolsBlocker>
      <App />
    </DevToolsBlocker>
);

Using Individual Components

Cursor Protection Only

import { CursorProtect } from 'react-mower';

function App() {
  return (
    <CursorProtect message='❌ Screen Blocked'>
      <YourApp />
    </CursorProtect>
  );
}

message With the message attribute, you can give your own arbitrary name when the screen block is on


Using for Code Example

Tablets Import Props
Cursor Protect <CursorProtect /> {message}
Github Star Button Count <GitHubStarCount /> {githubStar}, username/repo
Dev Tools Blocker <DevToolsBlocker /> soon

Components

DevToolsBlocker

Prevents access to browser developer tools through:

F12 key blocking Ctrl+Shift+I blocking Right-click context menu blocking DevTools window size detection

Security Features

DevTools Protection:

Blocks common DevTools shortcuts Prevents right-click context menu Detects DevTools through window size changes Shows warning toast messages

Cursor Protection:

Monitors mouse position Blocks specific keyboard shortcuts Shows full-screen protection overlay Prevents unauthorized interactions

Browser Compatibility

Chrome (latest) Firefox (latest) Safari (latest) Edge (latest) Opera (latest)


Contributing

Contributions are welcome! Please feel free to submit a Pull Request.
Fork the repository
Create your feature branch (git checkout -b feature/AmazingFeature)
Commit your changes (git commit -m 'Add some AmazingFeature')
Push to the branch (git push origin feature/AmazingFeature)
Open a Pull Request


Support

If you have any questions or need help integrating the package, please open an issue in the GitHub repository.