{"_id":"@7shohan/react-hooks","name":"@7shohan/react-hooks","dist-tags":{"latest":"1.0.0"},"versions":{"1.0.0":{"name":"@7shohan/react-hooks","version":"1.0.0","description":"A comprehensive collection of React hooks for building modern web applications","author":{"name":"7shohan"},"license":"MIT","type":"module","main":"./dist/index.js","module":"./dist/index.js","types":"./dist/index.d.ts","exports":{".":{"import":"./dist/index.js","types":"./dist/index.d.ts"},"./auth":{"import":"./dist/features/auth/index.js","types":"./dist/features/auth/index.d.ts"},"./storage":{"import":"./dist/storage/index.js","types":"./dist/storage/index.d.ts"},"./ui":{"import":"./dist/ui/index.js","types":"./dist/ui/index.d.ts"},"./async":{"import":"./dist/async/index.js","types":"./dist/async/index.d.ts"},"./timing":{"import":"./dist/timing/index.js","types":"./dist/timing/index.d.ts"},"./state":{"import":"./dist/state/index.js","types":"./dist/state/index.d.ts"},"./lifecycle":{"import":"./dist/lifecycle/index.js","types":"./dist/lifecycle/index.d.ts"},"./utilities":{"import":"./dist/utilities/index.js","types":"./dist/utilities/index.d.ts"},"./features":{"import":"./dist/features/index.js","types":"./dist/features/index.d.ts"}},"scripts":{"build":"tsup","dev":"tsup --watch","typecheck":"tsc --noEmit","prepublishOnly":"pnpm build"},"peerDependencies":{"react":">=18.0.0","react-dom":">=18.0.0"},"devDependencies":{"@types/react":"^18.2.0","@types/react-dom":"^18.2.0","react":"^18.2.0","react-dom":"^18.2.0","tsup":"^8.0.0","typescript":"^5.3.0"},"keywords":["react","hooks","typescript","auth","form","storage","debounce","throttle","media-query"],"repository":{"type":"git","url":"git+https://github.com/shohan/react-hooks.git"},"homepage":"https://github.com/shohan/react-hooks#readme","bugs":{"url":"https://github.com/shohan/react-hooks/issues"},"gitHead":"6f2798fae44f966b030a38ef4f2dcda90c5cdde3","_id":"@7shohan/react-hooks@1.0.0","_nodeVersion":"22.19.0","_npmVersion":"11.6.2","dist":{"integrity":"sha512-m6SWk6LukOnHVusaRod24CdrSkO3HHY0H2g/XmY4OT9Pe1che2a990YSZIjN0FCkFZ+asw6w0X8/RLS6/bxliA==","shasum":"c69fda57e7f58f9edfb575b65a805852e40309a3","tarball":"https://registry.npmjs.org/@7shohan/react-hooks/-/react-hooks-1.0.0.tgz","fileCount":32,"unpackedSize":734303,"signatures":[{"keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U","sig":"MEQCIEERa4uCfuPBUeLcgRqiqpKbXR5eDxOBTGxjNDDU96R8AiBHOaC6+TWYWV8awUEB/WzgViQ6+1vKIzl2vyK0FO7X2g=="}]},"_npmUser":{"name":"7shohan","email":"x9zq8pl7t4rv3nwy5fk2g1jhmcd6@gmail.com"},"directories":{},"maintainers":[{"name":"7shohan","email":"x9zq8pl7t4rv3nwy5fk2g1jhmcd6@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages-npm-production","tmp":"tmp/react-hooks_1.0.0_1765202271955_0.3993677205176518"},"_hasShrinkwrap":false}},"time":{"created":"2025-12-08T13:57:51.868Z","1.0.0":"2025-12-08T13:57:52.117Z","modified":"2025-12-08T13:57:52.396Z"},"maintainers":[{"name":"7shohan","email":"x9zq8pl7t4rv3nwy5fk2g1jhmcd6@gmail.com"}],"description":"A comprehensive collection of React hooks for building modern web applications","homepage":"https://github.com/shohan/react-hooks#readme","keywords":["react","hooks","typescript","auth","form","storage","debounce","throttle","media-query"],"repository":{"type":"git","url":"git+https://github.com/shohan/react-hooks.git"},"author":{"name":"7shohan"},"bugs":{"url":"https://github.com/shohan/react-hooks/issues"},"license":"MIT","readme":"# @shohan/react-hooks\n\nA comprehensive collection of React hooks for building modern web applications.\n\n## Installation\n\n```bash\nnpm install @shohan/react-hooks\n# or\npnpm add @shohan/react-hooks\n# or\nyarn add @shohan/react-hooks\n```\n\n## Features\n\n- 🔐 **Auth** - Complete authentication with context, provider, and config factory\n- 🛒 **Cart** - Shopping cart management with persistence\n- 📝 **Form** - Form state, validation, and submission handling\n- 🔍 **Filter** - Filtering and sorting utilities\n- 📄 **Pagination** - Pagination state management\n- 💾 **Storage** - localStorage & sessionStorage hooks\n- ⏱️ **Timing** - Debounce, throttle, interval, timeout\n- 🖥️ **UI** - Media queries, window size, scroll position, hover, focus\n- ⚡ **Async** - Async operations, copy to clipboard, social share\n- 🔄 **State** - Toggle, counter, list, map, previous value\n- 🎯 **Lifecycle** - Mount/unmount callbacks\n\n## Quick Start\n\n### Auth Setup\n\n```tsx\n// config/auth.ts\nimport { createAuthConfig } from '@shohan/react-hooks/auth'\nimport axios from 'axios'\n\nconst api = axios.create({ baseURL: 'https://api.example.com' })\n\nexport const authConfig = createAuthConfig({\n  loginFn: async (credentials) => {\n    const { data } = await api.post('/auth/login', credentials)\n    return data // { user, tokens }\n  },\n  logoutFn: async () => {\n    await api.post('/auth/logout')\n  },\n  onLogin: (user) => console.log(`Welcome ${user.name}!`),\n  onError: (error) => console.error(error.message),\n})\n\n// App.tsx\nimport { AuthProvider } from '@shohan/react-hooks/auth'\nimport { authConfig } from './config/auth'\n\nfunction App() {\n  return (\n    <AuthProvider config={authConfig}>\n      <YourApp />\n    </AuthProvider>\n  )\n}\n\n// Any component\nimport { useContext } from 'react'\nimport { AuthContext } from '@shohan/react-hooks/auth'\n\nfunction Profile() {\n  const { user, isAuthenticated, logout } = useContext(AuthContext)\n\n  if (!isAuthenticated) return <div>Please log in</div>\n\n  return (\n    <div>\n      <h1>Welcome {user.name}</h1>\n      <button onClick={logout}>Logout</button>\n    </div>\n  )\n}\n```\n\n### Storage Hooks\n\n```tsx\nimport { useLocalStorage, useSessionStorage } from '@shohan/react-hooks/storage'\n\nfunction Settings() {\n  const [theme, setTheme] = useLocalStorage('theme', 'light')\n  const [sessionData, setSessionData] = useSessionStorage('session', {})\n\n  return <button onClick={() => setTheme(theme === 'light' ? 'dark' : 'light')}>Toggle Theme: {theme}</button>\n}\n```\n\n### Form Hook\n\n```tsx\nimport { useForm, validators } from '@shohan/react-hooks/features'\n\nfunction LoginForm() {\n  const { values, errors, handleChange, handleSubmit, isSubmitting } = useForm({\n    initialValues: { email: '', password: '' },\n    validationRules: {\n      email: [validators.required(), validators.email()],\n      password: [validators.required(), validators.minLength(8)],\n    },\n    onSubmit: async (values) => {\n      await api.login(values)\n    },\n  })\n\n  return (\n    <form onSubmit={handleSubmit}>\n      <input name=\"email\" value={values.email} onChange={handleChange} />\n      {errors.email && <span>{errors.email}</span>}\n\n      <input name=\"password\" type=\"password\" value={values.password} onChange={handleChange} />\n      {errors.password && <span>{errors.password}</span>}\n\n      <button type=\"submit\" disabled={isSubmitting}>\n        Login\n      </button>\n    </form>\n  )\n}\n```\n\n### UI Hooks\n\n```tsx\nimport { useMediaQuery, useWindowSize, useScrollPosition } from '@shohan/react-hooks/ui'\n\nfunction ResponsiveComponent() {\n  const isMobile = useMediaQuery('(max-width: 768px)')\n  const { width, height } = useWindowSize()\n  const { x, y } = useScrollPosition()\n\n  return (\n    <div>\n      <p>\n        Screen: {width}x{height}\n      </p>\n      <p>\n        Scroll: {x}, {y}\n      </p>\n      <p>Device: {isMobile ? 'Mobile' : 'Desktop'}</p>\n    </div>\n  )\n}\n```\n\n### Timing Hooks\n\n```tsx\nimport { useDebounce, useThrottle, useInterval } from '@shohan/react-hooks/timing'\n\nfunction SearchComponent() {\n  const [query, setQuery] = useState('')\n  const debouncedQuery = useDebounce(query, 300)\n\n  useEffect(() => {\n    if (debouncedQuery) {\n      fetchResults(debouncedQuery)\n    }\n  }, [debouncedQuery])\n\n  return <input value={query} onChange={(e) => setQuery(e.target.value)} />\n}\n```\n\n## API Reference\n\n### Auth Module\n\n| Export             | Description                       |\n| ------------------ | --------------------------------- |\n| `AuthContext`      | React context for auth state      |\n| `AuthProvider`     | Provider component                |\n| `createAuthConfig` | Factory function to create config |\n\n### Storage Module\n\n| Hook                | Description                     |\n| ------------------- | ------------------------------- |\n| `useLocalStorage`   | Persist state in localStorage   |\n| `useSessionStorage` | Persist state in sessionStorage |\n\n### UI Module\n\n| Hook                | Description             |\n| ------------------- | ----------------------- |\n| `useMediaQuery`     | CSS media query hook    |\n| `useWindowSize`     | Window dimensions       |\n| `useScrollPosition` | Scroll position         |\n| `useHover`          | Element hover state     |\n| `useFocus`          | Element focus state     |\n| `useClickOutside`   | Click outside detection |\n| `useKeyPress`       | Keyboard key detection  |\n| `useEventListener`  | Generic event listener  |\n\n### Timing Module\n\n| Hook          | Description           |\n| ------------- | --------------------- |\n| `useDebounce` | Debounced value       |\n| `useThrottle` | Throttled value       |\n| `useInterval` | Interval with cleanup |\n| `useTimeout`  | Timeout with cleanup  |\n\n### State Module\n\n| Hook          | Description            |\n| ------------- | ---------------------- |\n| `useToggle`   | Boolean toggle         |\n| `useCounter`  | Counter with min/max   |\n| `useList`     | Array state management |\n| `useMap`      | Map/object state       |\n| `usePrevious` | Previous value         |\n\n### Async Module\n\n| Hook                 | Description           |\n| -------------------- | --------------------- |\n| `useAsync`           | Async operation state |\n| `useCopyToClipboard` | Clipboard operations  |\n| `useSocialShare`     | Social media sharing  |\n\n### Features Module\n\n| Hook            | Description             |\n| --------------- | ----------------------- |\n| `useForm`       | Form state & validation |\n| `useCart`       | Shopping cart           |\n| `useProduct`    | Product state           |\n| `useFilter`     | Filtering & sorting     |\n| `usePagination` | Pagination              |\n| `useWishlist`   | Wishlist management     |\n| `useCheckout`   | Checkout flow           |\n\n## License\n\nMIT\n","readmeFilename":"README.md","_rev":"1-a6cc5f51b32c387e21a0c3f40694f6b4"}