{"_id":"@1hive/use-inside","_rev":"2-0c81a155f8ef4b33e2c990b50540d6af","name":"@1hive/use-inside","dist-tags":{"latest":"0.3.0"},"versions":{"0.3.0":{"name":"@1hive/use-inside","version":"0.3.0","author":{"name":"Aragon Association","email":"legal@aragon.org"},"license":"MIT","main":"dist/index.js","module":"dist/use-inside.esm.js","sideEffects":false,"typings":"dist/index.d.ts","engines":{"node":">=10"},"scripts":{"start":"tsdx watch --transpileOnly","build":"tsdx build","test":"tsdx test --passWithNoTests","lint":"tsdx lint src --max-warnings 0 && tsc","prepare":"tsdx build","prepublishOnly":"git push && git push --tags","size":"size-limit","analyze":"size-limit --why"},"husky":{"hooks":{"pre-commit":"yarn lint"}},"size-limit":[{"path":"dist/use-inside.cjs.production.min.js","limit":"10 KB"},{"path":"dist/use-inside.esm.js","limit":"10 KB"}],"devDependencies":{"@size-limit/preset-small-lib":"^4.6.0","@types/react":"^16.9.49","@types/react-dom":"^16.9.8","@typescript-eslint/eslint-plugin":"^4.3.0","@typescript-eslint/parser":"^4.3.0","eslint-config-react-app":"^5.2.1","eslint-plugin-prettier":"^3.1.4","husky":"^4.3.0","prettier":"^2.1.2","size-limit":"^4.6.0","tsdx":"^0.14.0","tslib":"^2.0.1","typescript":"^4.0.3"},"peerDependencies":{"react":"^16.13.1"},"gitHead":"a61a811052d2d9e25d64dff6660653375259223a","description":"[<img src=\"https://img.shields.io/npm/v/use-inside\" alt=\"\" />](https://www.npmjs.com/package/use-inside) [<img src=\"https://img.shields.io/bundlephobia/minzip/use-inside\" alt=\"\" />](https://bundlephobia.com/result?p=use-inside)","_id":"@1hive/use-inside@0.3.0","_nodeVersion":"16.16.0","_npmVersion":"8.16.0","dist":{"integrity":"sha512-kDJ0DQNcW8cb/8WtREKh6ATj+iXntxK3bXiVeiUnOHs/vGVBF5cJt5h/r0oA5etiApvKCuGNrOgvGSWbOqOLoA==","shasum":"f016e5f0b83910aba39faa7308b9271810fc25ce","tarball":"https://registry.npmjs.org/@1hive/use-inside/-/use-inside-0.3.0.tgz","fileCount":11,"unpackedSize":14615,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDwomdyGHQ5AIYuMZ9J/ofJcySoG+uEe0teGzZ6QV1gngIhALqVvimnt1MDZqlYdJcPcrLT4dYxcChDejNNEM7Bk5fv"}],"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJjTzFEACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmodzQ/+IKGvOXwOA9Ba0YhXed6/qjX3QVRk9BXxr5j+OZ07albkbWy0\r\nF7QYNWA6Wb4q/exjpbA5OU9Y80iBxfxw7rDSpvJRQeOHQj7kmgTyas05jCFi\r\nfGQb6owtuJb4uTLQ0e4tMvU4Fvbadqdl5ULkCrOP2bPPMR4uQ6bY55A/b8Ar\r\nFC55KPRF1vgXLmWhbyNl+FS5wc9X6M137OGk4Z186x5MjP/ck35TmlNOrxzV\r\nEiw+ae9ye3JweXQ4dqL9sruCSyz/0cAel4qpj5noiNGFog0XDmDxIgw9jdvQ\r\nEmj5Lbxxx8SkDIMJBQ2wovPclti1k1inhyUpvXyI5bLbAcSP8Qa5MmZR2vud\r\nR0gVGzu1HmH0cYjWeEd06la80KWVIv4SCNcjCub2AzCusfe/IDOp5GSTimaS\r\nf/MHUG9BlC/nxvWJ1AliKcop52J8awhS8P+styy6jZViOdpIyYXktZApBq8L\r\nFWsD9tq6BEdi1zVex45QE6jntAmNx6f/gJIQTY6dKLXy/jRz8TYXDyl96Dlr\r\nk9ovQ7LFcGIUbg38leV3uw3W1zHFNsp5qWCFrRejfTgqpy9Jw/gy+feAiEwi\r\n6kOcsQOD/kZWiVOuh4/z7SAQQvwJ5xIfHm2rGlY2BlHHnDu0WmlzknHSbZij\r\nsyogmgVi9NLR+SI5OqoQj6uhhKPo8OICCCs=\r\n=4+ZZ\r\n-----END PGP SIGNATURE-----\r\n"},"_npmUser":{"name":"gabrielg","email":"gabrielpk.18@gmail.com"},"directories":{},"maintainers":[{"name":"pcolombo","email":"paulo.colombo@pm.me"},{"name":"gabrielg","email":"gabrielpk.18@gmail.com"},{"name":"fabriv","email":"fabriziovigevani@gmail.com"},{"name":"starsower","email":"sembrestels@gmail.com"},{"name":"willjgriff","email":"willjgriff@gmail.com"},{"name":"rperez89","email":"rodrigopi1989@gmail.com"},{"name":"crisog","email":"ortega.cpp@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/use-inside_0.3.0_1666134340695_0.5141228497335355"},"_hasShrinkwrap":false}},"time":{"created":"2022-10-18T23:05:40.640Z","0.3.0":"2022-10-18T23:05:40.842Z","modified":"2024-05-01T23:03:50.719Z"},"maintainers":[{"email":"windholyghost@gmail.com","name":"kamikazebr"},{"email":"gabrielpk.18@gmail.com","name":"gabrielg"},{"email":"fabriziovigevani@gmail.com","name":"fabriv"},{"email":"sembrestels@gmail.com","name":"starsower"},{"email":"willjgriff@gmail.com","name":"willjgriff"},{"email":"rodrigopi1989@gmail.com","name":"rperez89"}],"description":"[<img src=\"https://img.shields.io/npm/v/use-inside\" alt=\"\" />](https://www.npmjs.com/package/use-inside) [<img src=\"https://img.shields.io/bundlephobia/minzip/use-inside\" alt=\"\" />](https://bundlephobia.com/result?p=use-inside)","author":{"name":"Aragon Association","email":"legal@aragon.org"},"license":"MIT","readme":"# 🔬 useInside()\n\n[<img src=\"https://img.shields.io/npm/v/use-inside\" alt=\"\" />](https://www.npmjs.com/package/use-inside) [<img src=\"https://img.shields.io/bundlephobia/minzip/use-inside\" alt=\"\" />](https://bundlephobia.com/result?p=use-inside)\n\nuseInside() allows a component to be aware if its \"inside\" the subtree of another component and receive data from it, in the most straightforward, simple way possible.\n\n## Usage\n\nAdd it to your project:\n\n```console\nyarn add use-inside\n```\n\nUse it in your React app:\n\n```jsx\n// App.js\n\nimport React from 'react'\nimport { Inside, useInside } from 'use-inside'\n\nfunction App() {\n\n  return (\n    <>\n      <h1>useInside</h1>\n      <Inside name=\"papaya\" data={{backgroundColor: 'papayawhip'}}>\n        <Greeting />\n      </Inside>\n    </>\n  )\n}\n\nfunction Greeting() {\n  const [inside, data] = useInside('papaya')\n\n  return <h2 style={{...data}}>{inside && 'papaya'}</h2>\n}\n\nexport default App\n```\n\n## API\n\n### &lt;Inside />\n\nThis is the provider component. It should be placed above any component using `useInside()`. Apart from `children`, it accepts two other props:\n\n#### name (required)\n\nThe name of the inside context. Required for storing the context into a map for later retrieval.\n\n#### data\n\nThe data passed to the component using `useInside()`. Accepts any type.\n\n### useInside()\n\nThis is the hook to be used throughout the app.\n\nIt takes a string as a single required param, and returns an array containing the following:\n\n- `inside`: A `boolean` that will be `true` if the component is in the subtree of the provider\n  `Inside` component.\n- `data`: The data passed through the `Inside` component.\n","readmeFilename":"README.md"}