{"_id":"@alexrah/react-use-id-hook","_rev":"1-eb81a414fd65d46af93fcd8413f377a7","name":"@alexrah/react-use-id-hook","dist-tags":{"latest":"1.1.1"},"versions":{"1.1.0":{"name":"@alexrah/react-use-id-hook","version":"1.1.0","author":{"name":"Wout Mertens"},"license":"MIT","_id":"@alexrah/react-use-id-hook@1.1.0","maintainers":[{"name":"alexrah","email":"alexrah@gmail.com"}],"homepage":"https://github.com/alexrah/react-use-id-hook#readme","bugs":{"url":"https://github.com/alexrah/react-use-id-hook/issues"},"dist":{"shasum":"e72297ad8caa3bdee8c7459a4fe792fe92f29ca0","tarball":"https://registry.npmjs.org/@alexrah/react-use-id-hook/-/react-use-id-hook-1.1.0.tgz","fileCount":11,"integrity":"sha512-k+1gQMmZg6vaj7aoUvakHTSpamZh8ovtLVXmfhCj60yVH6rkEIP823wuGx8xtaLWKTHlYe4FNIkMM/KEPAo8gA==","signatures":[{"sig":"MEQCIDauULxzE+/93Q3Bm9TSwi9LGZfCnjNCiN4zAd6gtjluAiB687cA/jmHyljISlxIEPKIu1g8R0/u6+qcbHRtZ1hMHw==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":14843},"main":"dist/index.js","husky":{"hooks":{"pre-commit":"tsdx lint"}},"module":"dist/react-use-id-hook.esm.js","engines":{"node":">=10"},"gitHead":"64b590d3637f166aa67243e280651975ef818326","scripts":{"lint":"tsdx lint","size":"size-limit","test":"tsdx test --passWithNoTests","build":"tsdx build","start":"tsdx watch","analyze":"size-limit --why","prepare":"tsdx build"},"typings":"dist/index.d.ts","_npmUser":{"name":"alexrah","email":"alexrah@gmail.com"},"repository":{"url":"git+https://github.com/alexrah/react-use-id-hook.git","type":"git"},"size-limit":[{"path":"dist/react-use-id-hook.cjs.production.min.js","limit":"10 KB"},{"path":"dist/react-use-id-hook.esm.js","limit":"10 KB"}],"_npmVersion":"10.2.4","description":"This is a tiny hook to create consisent id strings while rendering React, both when doing SSR and normally.","directories":{},"_nodeVersion":"20.11.1","_hasShrinkwrap":false,"devDependencies":{"tsdx":"^0.14.1","husky":"^4.3.6","react":"^17.0.1","tslib":"^2.0.3","react-dom":"^17.0.1","size-limit":"^4.9.1","typescript":"^4.1.3","@types/react":"^17.0.0","@types/react-dom":"^17.0.0","@size-limit/preset-small-lib":"^4.9.1"},"peerDependencies":{"react":">=16"},"_npmOperationalInternal":{"tmp":"tmp/react-use-id-hook_1.1.0_1725373858284_0.18421037755072156","host":"s3://npm-registry-packages"}},"1.1.1":{"name":"@alexrah/react-use-id-hook","version":"1.1.1","main":"dist/index.js","module":"dist/react-use-id-hook.esm.js","license":"MIT","repository":{"type":"git","url":"git+https://github.com/alexrah/react-use-id-hook.git"},"typings":"dist/index.d.ts","engines":{"node":">=10"},"scripts":{"start":"tsdx watch","build":"tsdx build","test":"tsdx test --passWithNoTests","lint":"tsdx lint","prepare":"tsdx build","size":"size-limit","analyze":"size-limit --why"},"peerDependencies":{"react":">=16"},"husky":{"hooks":{"pre-commit":"tsdx lint"}},"author":{"name":"Wout Mertens"},"size-limit":[{"path":"dist/react-use-id-hook.cjs.production.min.js","limit":"10 KB"},{"path":"dist/react-use-id-hook.esm.js","limit":"10 KB"}],"devDependencies":{"@size-limit/preset-small-lib":"^4.9.1","@types/react":"^17.0.0","@types/react-dom":"^17.0.0","husky":"^4.3.6","react":"^17.0.1","react-dom":"^17.0.1","size-limit":"^4.9.1","tsdx":"^0.14.1","tslib":"^2.0.3","typescript":"^4.1.3"},"_id":"@alexrah/react-use-id-hook@1.1.1","gitHead":"5d781628b0a0bbce310f05566eb31be9640b8afe","description":"## Disclaimer This is a fork of https://www.npmjs.com/package/react-use-id-hook which adds the ability to set a custom prefix to the generated ids","bugs":{"url":"https://github.com/alexrah/react-use-id-hook/issues"},"homepage":"https://github.com/alexrah/react-use-id-hook#readme","_nodeVersion":"20.11.1","_npmVersion":"10.2.4","dist":{"integrity":"sha512-TCxyjKzqfRGhVgsV3KJCz4OpX1ts27k5YHpoEXM5dZFE1+ph64GztvROGEO5ieY5Ay5qOorxQTcWx45sfAjH9g==","shasum":"a9baabdf03ffcea1ff436da2ac138267d7fcba2b","tarball":"https://registry.npmjs.org/@alexrah/react-use-id-hook/-/react-use-id-hook-1.1.1.tgz","fileCount":11,"unpackedSize":15006,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDY2Uqx3LHZvYMBKhq1I8Ub+ZbY8kJyL40cp1pxbs6GVQIgULxtFd1hgE6MEvpbzraUMTnzXdch6DywZqxSnodRe5g="}]},"_npmUser":{"name":"alexrah","email":"alexrah@gmail.com"},"directories":{},"maintainers":[{"name":"alexrah","email":"alexrah@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-use-id-hook_1.1.1_1725374061820_0.8249290503922688"},"_hasShrinkwrap":false}},"time":{"created":"2024-09-03T14:30:58.159Z","modified":"2024-09-03T14:34:22.133Z","1.1.0":"2024-09-03T14:30:58.466Z","1.1.1":"2024-09-03T14:34:21.981Z"},"bugs":{"url":"https://github.com/alexrah/react-use-id-hook/issues"},"author":{"name":"Wout Mertens"},"license":"MIT","homepage":"https://github.com/alexrah/react-use-id-hook#readme","repository":{"type":"git","url":"git+https://github.com/alexrah/react-use-id-hook.git"},"description":"## Disclaimer This is a fork of https://www.npmjs.com/package/react-use-id-hook which adds the ability to set a custom prefix to the generated ids","maintainers":[{"name":"alexrah","email":"alexrah@gmail.com"}],"readme":"# react-use-id-hook\n\n## Disclaimer\nThis is a fork of https://www.npmjs.com/package/react-use-id-hook which adds the ability to set a custom prefix to the generated ids\n\n## Description\nThis is a tiny hook to create consisent id strings while rendering React, both when doing SSR and normally.\n\nThis is useful for creating unique `id` attributes for DOM elements.\n\n## API\n\n### `<IdProvider [prefix=\"id-\"] />`\n\nThis provider provides the id state. Your app needs to be wrapped with it.\n\n### `useId()`\n\nThis hook returns a unique id that remains consistent on re-render\n\n### `useGetId()`\n\nThis hook returns a function that returns unique ids. To use it, the same rule applies as for hooks:\n\n> always call it in the same order, without control flow\n\n## Installation\n\n1. Install the `react-use-id-hook` NPM package with your favorite package manager.\n2. Wrap your top-level component with `<IdProvider>`\n3. In your components, use `useId()` or `useGetId()` as appropriate.\n\n## Example\n\n[See the full example](https://github.com/Yaska/react-use-id-hook/blob/master/example/index.tsx).\n\n```js\nconst CheckBox = ({value, onChange}) => {\n\tconst id = useId()\n\n\treturn (\n\t\t<>\n\t\t\t<input\n\t\t\t\tid={id}\n\t\t\t\ttype=\"checkbox\"\n\t\t\t\tchecked={value}\n\t\t\t\tonChange={(ev) => onChange(ev.target.checked)}\n\t\t\t/>\n\t\t\t<label htmlFor={id}>Click me</label>\n\t\t</>\n\t)\n}\n```\n","readmeFilename":"README.md"}