--- ## ✨ Features - 🎯 **30+ Production-Ready Hooks** - Carefully crafted and battle-tested - 🚀 **Zero Configuration** - Works out of the box with any React project - 📦 **CLI Tool** - Add hooks to your project with a single command - 🔍 **Smart Search** - Find hooks by name, description, or category - 🛡️ **Type Safe** - Full TypeScript support with comprehensive type definitions - 📱 **Modern APIs** - Leverages latest browser APIs and React patterns - 🎨 **Customizable** - Flexible configuration options for every use case - 📋 **Well Documented** - Comprehensive docs with examples and best practices ## 🚀 Quick Start ### Using the CLI (Recommended) ```bash # Initialize usehooks in your project npx usehooks-cli@latest init # Add a specific hook npx usehooks-cli@latest add use-counter # List all available hooks npx usehooks-cli@latest list # Get detailed information about a hook npx usehooks-cli@latest info use-geolocation ``` ## 📚 Available Hooks Our collection includes 30+ hooks organized by category: ### 🏪 State Management - useArray - Helper methods for array state manipulation - useCounter - Counter state with increment, decrement, and reset - useLocalStorage - Sync state with localStorage - useSet - Comprehensive Set data structure management - useToggle - Boolean toggle state with convenient methods ### 📡 Sensors & Device APIs - **useAudioRecorder** - Audio recording with real-time analysis - **useBarcodeDetector** - Barcode and QR code detection - **useDeviceOrientation** - Device orientation data access - **useGeolocation** - User location with GPS tracking - **useHover** - Element hover detection with callbacks - **useIsMobile** - Mobile device detection using media queries and user agent - **useIsTablet** - Tablet device detection with comprehensive device identification - **useMediaSession** - Media notifications and control actions - **useNetworkInformation** - Network connection monitoring - **useUserMedia** - Camera and microphone access - **useVibration** - Device vibration control ### 🌐 Browser APIs - useBluetooth - Bluetooth Low Energy device interaction - useClipboard - Clipboard operations with state management - useContactPicker - Contact selection with user permission - useFullscreen - Fullscreen mode management - useStorage - Browser storage quotas and persistence - useWebShare - Native sharing mechanisms - useWindowSize - Window dimensions tracking ### 🔧 Utilities - useDebounce - Value debouncing for performance - useThrottle - Value throttling for rate limiting - usePrevious - Access to previous state/prop values - useIsMounted - Component mount status checking - useTimeout - Timeout management with controls ### 🔄 Lifecycle - useDeepCompareEffect - useEffect with deep equality check - useUpdateEffect - useEffect that skips initial render ### 🌍 Network - useFetch - HTTP requests with loading states and error handling ### 🔐 Authentication - useRoleGuard - Role-based access control 💡 Tip : Run npx usehooks-cli@latest list to see the complete list with descriptions and categories. ## 🛠️ CLI Tool Our powerful CLI tool makes it easy to discover, install, and manage hooks in your projects. ### Key Features - 🚀 Quick Installation - Add hooks with a single command - 🔍 Smart Search - Find hooks by name, description, or category - 📋 Detailed Information - Get comprehensive details about any hook - 🔄 Update Management - Keep hooks up-to-date - 🗑️ Clean Removal - Remove hooks and dependencies safely - 📱 Interactive Mode - User-friendly prompts and confirmations ### Commands ```bash # Initialize project npx usehooks-cli@latest init # Add hooks npx usehooks-cli@latest add use-counter use-toggle # List all hooks npx usehooks-cli@latest list # Get hook information npx usehooks-cli@latest info use-geolocation # Update hooks npx usehooks-cli@latest update --all # Remove hooks npx usehooks-cli@latest remove use-counter ``` ## 🏗️ Project Structure This monorepo contains several packages: ``` usehooks.io/ ├── packages/ │   ├── hooks/              # 🪝 Core hooks library │   ├── usehooks-cli/       # 🛠️ CLI tool for hook management │   ├── ui/                 # 🎨 Shared UI components │   ├── eslint-config/      # 📏 ESLint configuration │   └── typescript-config/  # 📝 TypeScript configuration ├── apps/    └── www/               # 🌐 Documentation website ``` ## 🤝 Contributing We welcome contributions! Here's how you can help: ### Adding a New Hook 1. Fork and clone the repository 2. Create a new hook directory in packages/hooks/src/ 3. Follow the hook template : ``` use-your-hook/ ├── index.ts      # Hook implementation ├── meta.json     # Hook metadata └── doc.json      # Documentation ``` 4. Add comprehensive tests 5. Update the index.json file 6. Submit a pull request ### Guidelines - ✅ TypeScript first - All hooks must be written in TypeScript - ✅ Comprehensive tests - Include unit tests and edge cases - ✅ Clear documentation - Provide examples and use cases - ✅ Performance focused - Optimize for minimal re-renders - ✅ Browser compatibility - Support modern browsers - ✅ Accessibility - Consider a11y implications ## 📖 Documentation - 🌐 Website : usehooks.io - 📚 Hook Documentation : Each hook includes comprehensive docs with examples - 🛠️ CLI Documentation : Run npx usehooks-cli@latest --help - 🎯 Examples : Check the /examples directory in each hook ## 🔧 Requirements - Node.js : 20 or higher - React : 18 or higher - TypeScript : 5.8 or higher (recommended) ## License This project is licensed under the MIT License - see the [LICENSE.md](LICENSE.md) file for details.