{"_id":"react-use-set","name":"react-use-set","dist-tags":{"latest":"1.0.0"},"versions":{"1.0.0":{"name":"react-use-set","version":"1.0.0","description":"Use Set-like API with React hook","bugs":{"url":"https://github.com/SevenOutman/react-use-set/issues"},"repository":{"type":"git","url":"git+https://github.com/SevenOutman/react-use-set.git"},"license":"MIT","author":{"name":"Doma","email":"leishenghao@126.com"},"sideEffects":false,"exports":{"require":"./dist/index.js","import":"./dist/index.mjs"},"main":"./dist/index.js","module":"./dist/index.mjs","types":"./dist/index.d.ts","scripts":{"build":"pnpm run build-fast -- --dts-resolve","build-fast":"tsup src/index.ts --format cjs,esm","prepublishOnly":"pnpm run build","test":"vitest run","test:coverage":"vitest run --passWithNoTests --coverage"},"devDependencies":{"@egoist/prettier-config":"1.0.0","@testing-library/react":"^14.0.0","@types/react":"^18.0.37","@types/react-dom":"^18.0.11","@vitest/coverage-c8":"^0.30.1","happy-dom":"^9.8.1","prettier":"^2.8.4","prettier-plugin-packagejson":"^2.4.3","react":"^18.2.0","react-dom":"^18.2.0","tsup":"6.4.0","typescript":"^4.9.5","vitest":"0.30.1"},"peerDependencies":{"react":">=16.8.0"},"publishConfig":{"access":"public"},"gitHead":"764ef886b55e35872f3ece3819f63f79aedb06ed","homepage":"https://github.com/SevenOutman/react-use-set#readme","_id":"react-use-set@1.0.0","_nodeVersion":"18.15.0","_npmVersion":"9.5.0","dist":{"integrity":"sha512-6BBbOcWc/tOKuwd9gDtdunvOr/g40S0SkCBYvrSJvpI0upzNlHmLoeDvylnoP8PrjQXItClAFxseVGGhEkk7kw==","shasum":"2b8b442c6e8c77a907534dcc665d54c3f7b3c841","tarball":"https://registry.npmjs.org/react-use-set/-/react-use-set-1.0.0.tgz","fileCount":5,"unpackedSize":9076,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDMBL+1eO53uFhLjdVJzjEdN63DsGwZfdCaG7Kfsq9nBgIgEFC1FBXsY0i3Vw/m5jt0S8wTYy4ydMZE3tnBVUAHrWY="}],"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJkPi4xACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmrfpA/9GXpECnT0pu+3NdCOdeUHUT65zdwgdqTzM/EZmKOE0IoHlhgH\r\n1JYIrJ7A3nbiFchfRW8+st8L6v/UEllyWFmo3vs4wdDZQb+ahgiGdQZuwYK6\r\nyVHk1hCPEVGwLYsYD8IBxCslHmV69ZHyRfQPJd0xmDMJc5tFe2Vp4FcFzO5N\r\nX6GhO05CiGtAvd4A0VKwWL2p/pfiUB/t3Xz+lsIa8PvfHwyWsokv8VSF7Tc1\r\nSXqwuUDR41pyIeAJ0sV9ve9XM9IKPwLwprXWNIMuOGOc7qXnrFyBx/2vKSCM\r\nLI2FvKRNP7/PeX/Z4ocy5699DgPHusqhC9AiQFBaawaqIR/lloanF/56X5ij\r\nm6+824P5gwtetqzQjVX4LTSF2h09zwzaEAWgjus5MVZ51IVYf7jnRF1ELQVw\r\nkwWRGOqSGdxE3q7BxsI1eVD89t68U10+7HYDNaR0xUs0gSflzCqo+rrpjwuJ\r\nKEhaw19Z6SKrRL0DLF8JnLyuF/t4juYAmWhGfdM03A0jt9BM12o53u0uJmlE\r\nqaZIHzUDxyUcfE1EQTQg9MMr6NEBalqAMkYZYhaL9RzuEjD2mLLdURZ5rJGx\r\nYhLXbePOBKSQmFlBtODECFNDwhdLB14mDI+MSFuEsulmn2tBUrhvIDm+3rJJ\r\nfDu77hFTHOga8Fxa4/WZf5Buw3OmJb7Hqgw=\r\n=dFFE\r\n-----END PGP SIGNATURE-----\r\n"},"_npmUser":{"name":"sevenoutman","email":"leishenghao@126.com"},"directories":{},"maintainers":[{"name":"sevenoutman","email":"leishenghao@126.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-use-set_1.0.0_1681796657484_0.13513543383696414"},"_hasShrinkwrap":false}},"time":{"created":"2023-04-18T05:44:17.419Z","1.0.0":"2023-04-18T05:44:17.646Z","modified":"2023-04-18T05:44:17.807Z"},"maintainers":[{"name":"sevenoutman","email":"leishenghao@126.com"}],"description":"Use Set-like API with React hook","homepage":"https://github.com/SevenOutman/react-use-set#readme","repository":{"type":"git","url":"git+https://github.com/SevenOutman/react-use-set.git"},"author":{"name":"Doma","email":"leishenghao@126.com"},"bugs":{"url":"https://github.com/SevenOutman/react-use-set/issues"},"license":"MIT","readme":"# `react-use-set`\n\nUse [`Set`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Set)-like API with React hook.\n\n![npm](https://img.shields.io/npm/v/react-use-set)\n![CI Status](https://github.com/SevenOutman/react-use-set/actions/workflows/ci.yml/badge.svg)\n[![codecov](https://codecov.io/gh/SevenOutman/react-use-set/branch/main/graph/badge.svg?token=G6ymLbwxPj)](https://codecov.io/gh/SevenOutman/react-use-set)\n[![semantic-release: angular](https://img.shields.io/badge/semantic--release-angular-e10079?logo=semantic-release)](https://github.com/semantic-release/semantic-release)\n\n## Instsall\n\nInstall `react-use-set` npm package\n\n npm i react-use-set\n\n## Usage\n\nGet a Set-like object from `useSet()` hook.ß\n\n```js\nimport { useSet } from \"react-use-set\"\n\nconst set = useSet()\n```\n\nIt's got some Set methods and properties like\n\n- `add` (enhanced)\n- `delete` (enhanced)\n- `clear`\n- `size`\n\nAlong with additional utils like\n\n- `toggle`\n- `sync`\n- `toArray`\n\nLearn more in [API](#api) section.\n\n## API\n\n### `set.add(...values)`\n\n> Calling this method triggers a re-render.\n\nAdd values to the Set. Multiple values are supported.\n\n```js\nconst set = useSet([1, 2, 3])\n\nset.add(4) // Set [1, 2, 3, 4]\nset.add(5, 6) // Set [1, 2, 3, 4, 5, 6]\n```\n\n### `set.delete(...values)`\n\n> Calling this method triggers a re-render.\n\nRemove values from the Set. Multiple values are supported.\n\n```js\nconst set = useSet([1, 2, 3])\n\nset.delete(1, 2) // Set [3]\n```\n\n### `set.has(value)`\n\nCheck whether a value exists in Set.\n\n```js\nconst set = useSet([1, 2, 3])\n\nset.has(1) // true\nset.has(4) // false\n```\n\n### `set.toggle(value)`\n\n> Calling this method triggers a re-render.\n\nIf `value` exists in the Set, remove it, otherwise add it.\n\n```js\nconst set = useSet([1, 2, 3])\n\nset.toggle(2) // Set [1, 3]\nset.toggle(4) // Set [1, 3, 4]\n```\n\nThis is useful when you want to store selected options on a list.\n\n```jsx\nconst selectedValues = useSet()\n\noptions.map((option) => (\n selectedValues.toggle(option.value)} />\n))\n```\n\n### `set.clear()`\n\n> Calling this method triggers a re-render.\n\nRemove all values from the Set.\n\n```js\nconst set = useSet([1, 2, 3])\n\nset.clear() // Set []\n```\n\n#### `set.size`\n\nReturn the number of values in the Set.\n\n```js\nconst set = useSet([1, 2, 3])\n\nset.size // 3\n```\n\n### `set.toArray()`\n\nReturn the values in the Set as an array.\n\n```js\nconst set = useSet([1, 2, 3])\n\nset.toArray() // [1, 2, 3]\n```\n\nThis is useful when you want to display a list of selected options.\n\n```jsx\n
    \n Selected options ({selectedValues.size})}):\n {selectedValues.toArray().map((value) => (\n
  1. {value}
    2. \n ))}\n
\n```\n\n### `set.sync(values)`\n\n> Calling this method triggers a re-render.\n\nReset the Set with the given values.\n\n```js\nconst set = useSet([1, 2, 3])\n\nset.sync([4, 5, 6]) // Set [4, 5, 6]\n```\n\n## License\n\nMIT © [Doma](https://github.com/SevenOutman)\n","readmeFilename":"README.md"}