{"_id":"@ascodelife/react-context-provider-composer","_rev":"5-aff0196a0fa05a56eb3ca9be372eb309","name":"@ascodelife/react-context-provider-composer","dist-tags":{"latest":"1.3.0"},"versions":{"1.0.0":{"name":"@ascodelife/react-context-provider-composer","version":"1.0.0","description":"Compose your react context provider to solve callbcak hell","main":"src/index.tsx","scripts":{"test":"echo \"Error: no test specified\" && exit 1"},"author":{"name":"ascodelife"},"license":"ISC","keywords":["npm","react","typescript","context"],"dependencies":{"react":"^17.0.2","react-dom":"^17.0.2","react-scripts":"^4.0.3"},"devDependencies":{"@types/react":"^17.0.18","@types/react-dom":"^17.0.9","typescript":"^4.3.5"},"_id":"@ascodelife/react-context-provider-composer@1.0.0","_nodeVersion":"14.17.4","_npmVersion":"6.14.14","dist":{"integrity":"sha512-ug+gR69ADos0f/4CwXubHLcI7QDysw1djI1d+gTBkc9rM61FcfkoMOrj+o4K9Yk+OoHhsXal+9C837k1XCxPlw==","shasum":"052fb61e3a926c935b7fde613674763c7fe5ccb3","tarball":"https://registry.npmjs.org/@ascodelife/react-context-provider-composer/-/react-context-provider-composer-1.0.0.tgz","fileCount":3,"unpackedSize":1173,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJhHLavCRA9TVsSAnZWagAA5MYQAIyQV/qRAakQ9okWCO6D\nawXnthW0GIC/gqIaCk3S/98bAM228ovk+pRy7pCIkzNjJpzGD2iV6ugQ6R1W\n9RAqVPs+bKAj4SQmX98ZH+JQagT7/hKQs+szRTnrqmFpr6wBj81tkz/mcsul\nHMw6F7yOUIf4JPfQ/vWBZkqxfMOXmAgW68C12YFtJpYExYD5+Kj/qom1WTAM\nWw5VLMxPxGLLjuvbkNMUQU2Am2vh1id/3PRtQbBbuNUijzJ1xCjYIfQddH93\n2xXaTknFOdWjULE9H0ZJ1E/7Zuzmzcrw2sy0hgIfjcRObVLK6TbLdpdzLotf\nO/c3V9urpUr2UYDZxi/F/jh8TpTyj+vSC88znJrA002a3hmaEm1LmR1Vqxam\ngxKCoz69/vH5StBh2CAxZm04O6XT530LgmZKXxFzlfe0qcBG3oGjlJ55qX/u\nG2bfmts8gLUXdkO/jh58H4iWRCLbXN6+kQDuHVtt4artOJAwh1mSex0EEiVi\ntqJiFKp9kSZXhTU6JAm5z7EqUHNwfbAWVn3byqVnGhuOqUKMBA5p5kbvZiUM\n/HfPoE/FRSpd0lWWvSMTUzib3yWOmDeGliSZO/+jzsKsaLrlvjphjm2129+x\ni0CAVoFbhh2Zk7jyiZyVdepLIm8Rk/6aal0c3Fk3zJfVLX9KltyGeI74g9Sr\nq6gh\r\n=IjKu\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQD25dVQBK9bJ26pUz6yxT1kEv5VFnBtvAShG8UKdJipXwIgeL2KJZg8CcoE0kRNP9NWBUzl2RtN/2o/KqONj2P74Jc="}]},"_npmUser":{"name":"ascodelife","email":"394922886@qq.com"},"directories":{},"maintainers":[{"name":"ascodelife","email":"394922886@qq.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-context-provider-composer_1.0.0_1629271727507_0.6219223453159863"},"_hasShrinkwrap":false},"1.1.0":{"name":"@ascodelife/react-context-provider-composer","version":"1.1.0","description":"Compose your react context provider to solve callbcak hell","main":"dist/index.js","scripts":{"build":"tsc"},"author":{"name":"ascodelife"},"private":false,"license":"MIT","keywords":["npm","react","typescript","context"],"dependencies":{"react":"^17.0.2","react-dom":"^17.0.2"},"devDependencies":{"@types/react":"^17.0.18","@types/react-dom":"^17.0.9","typescript":"^4.3.5"},"gitHead":"1b2ad0ae6b9b1be1c523417dce717eccc7b11127","_id":"@ascodelife/react-context-provider-composer@1.1.0","_nodeVersion":"14.17.4","_npmVersion":"6.14.14","dist":{"integrity":"sha512-GY07PP1hZv4V1jJhTJPZbwcZ5SdKyC68nJqayCVrcZQOShaTh7i2AI2B3i/F5wc7yJh6rPSQQgGE4LQz1qOKyg==","shasum":"81722e379653cd0cd5a56f598607c9e69f4f23f7","tarball":"https://registry.npmjs.org/@ascodelife/react-context-provider-composer/-/react-context-provider-composer-1.1.0.tgz","fileCount":9,"unpackedSize":4575,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJhHOIdCRA9TVsSAnZWagAAZXMP/0Pp0j/7rGRux8nYaeoP\nBRBMjiveMxC2sDEt1CXiVi5opPUtpyyRFddsi4tpCc6Lui0XmM9BLyMha5hB\nGjrlQkMgfYryUDbM54e9MGeK2xH5oM2xrj5utp3K2KUKmD0AZbUFdSGPMHmE\nYpDbKSl6/+dmOBZQ1jovo7ZfZTBzMhBob3ERdSc1GSaspUB25RBEyTtW5D15\ngvWErm4pQV95O2BXHON2yqSZJM1xgqQouGt8WRLmsNf8lYjzVCXVgQOXrm78\nwTmdoYz0tmwvrIDBaB4BpYH5b5ZRV2S1wmawhHNgVr0TTjQOogYge55/oT4r\n/XM6fLqZ/WscNVrifFB7STwXltYymiSxUocgnUMg7Gck5hw3BcuSsIs4I+RT\nWVE7veEPZUkgJtOaVLOuPIwr4YrddD3s6XyR+C1YMhdq2F+fOVEKY7eyH1Cm\nr5ySRUnBA2PeWFbNQMyNZNVqsf2drVMUBDhKSpNOX6Gp1H3lHH8OizOyvgLn\n99tv0/mZWp5oqYwuyiuLY+vETQ31M5FJcfQhuUpYEW42Y28qDuC/GSv2bwAf\nQCg/DqILAVAFvXrCEdd21AWSHfUP5KrWvidgm1MM2SmvlEdu1Pdcdtw0x32q\nVpBTCLFyzAaRzdyN3nimROokgWFuZ/JnaKPNwjSNyfx/o2uAN8W2Wex3YtgU\nxvTc\r\n=Lvtx\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIGNy24n8HTZs0004OQeH23oJi+elhDj+MNMD1Mspu5KTAiAYtvhWj5qCOWFR5qZ37jthxuO44Pi5i3aDiv6mGKELaw=="}]},"_npmUser":{"name":"ascodelife","email":"394922886@qq.com"},"directories":{},"maintainers":[{"name":"ascodelife","email":"394922886@qq.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-context-provider-composer_1.1.0_1629282845288_0.8546411208333669"},"_hasShrinkwrap":false},"1.1.1":{"name":"@ascodelife/react-context-provider-composer","version":"1.1.1","description":"Compose your react context provider to solve nested hell","main":"dist/index.js","scripts":{"build":"tsc"},"author":{"name":"ascodelife"},"private":false,"license":"MIT","keywords":["npm","react","typescript","context"],"dependencies":{"react":"^17.0.2","react-dom":"^17.0.2"},"devDependencies":{"@types/react":"^17.0.18","@types/react-dom":"^17.0.9","typescript":"^4.3.5"},"gitHead":"dc7cf8d26ef0c62bcf58842e55a81f5558f09cd1","_id":"@ascodelife/react-context-provider-composer@1.1.1","_nodeVersion":"14.17.4","_npmVersion":"6.14.14","dist":{"integrity":"sha512-xUIRBJPPzIg+b/s50MCJhcKGdzgqhPSY7nrXGyhpbKF6uoqfG295X+lJ1Jx2rSdeuEJkJpAzOV/WjVKnnmhnNg==","shasum":"c33ed30c9ae42f70bfcabf25743f02d0aacce2a4","tarball":"https://registry.npmjs.org/@ascodelife/react-context-provider-composer/-/react-context-provider-composer-1.1.1.tgz","fileCount":9,"unpackedSize":4607,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJhHOt0CRA9TVsSAnZWagAADNgP/itz6pxzERIKg+FrvEFG\n8haArTd17VVsLfWsgo9ZLOc9B1vNCT7iztwx3GRR42a6PareDdN1t9DwHuuv\n3DsuKP7RPHzoWfW3ksMdy5Mc8N4MdTLzdIehr5i8WZUJ3ukwtX+c03F4Lb2E\nj0aYFou/tif3T148pTM2vRjS+skq0PfsmN2gsWMneNW1albzp7SKAwBnPyPT\nXFfgXOG1sQHPaJCTf7MaiVRIYb8nsIwTq7cvGIKy7m8vnlPCA/yjQLNXZ3bE\nARVDP7l7GqKGuVbWuLejJHg/DMwRF4+el5BYX8lwX5zu+PaPX43V9ZSxAWJN\nCBubeXRn2CJE17vzi3arWjV9eBrOtKnqHOLtuuD9ATSuC28BY2e2P4bi8SNe\n8rJdhTU0YGXu7WpoQfCA/1YdY+mGrUrqv/alxg+IumqLFy2CrmHl7SiUBFra\nYoTXY1NxWS/RUdr/wmhR/0txXqt19GPLZeMSIfKMjYUw9UXDXtCdOUiUTO1U\nN5CopLJmH2HfKcKfenTuPmYGrLA8EfgZ5166KDICRelT92hAD+OUFqbvYzJH\nUG8n81AbtVrGowYFYiCAVi6am2NBxx5DrzpAzhCc1b0iTJHvl5arxizWVM1w\nKBkigaCuS0zUMx0shvC++QEpb502rpF8TqcNUdFcskJKpGx61WZNktaJtrBh\nFy8Z\r\n=yD9r\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCrd/t+5ifZ0ouuJHvqumWJQn/04dlkR66CmvcvF54/HgIgENfSz1NVvdexk15h8ESsbbNzHTusgbb3DJnDLIMhSe4="}]},"_npmUser":{"name":"ascodelife","email":"394922886@qq.com"},"directories":{},"maintainers":[{"name":"ascodelife","email":"394922886@qq.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-context-provider-composer_1.1.1_1629285236470_0.5914010109407548"},"_hasShrinkwrap":false},"1.2.0":{"name":"@ascodelife/react-context-provider-composer","version":"1.2.0","description":"Compose your react context provider to solve nested hell","main":"dist/index.js","scripts":{"build":"tsc"},"author":{"name":"ascodelife"},"private":false,"license":"MIT","keywords":["npm","react","typescript","context"],"dependencies":{"react":"^17.0.2","react-dom":"^17.0.2"},"devDependencies":{"@types/react":"^17.0.18","@types/react-dom":"^17.0.9","typescript":"^4.3.5"},"gitHead":"59dcc7f371f29846928cc3a128d36b068f818735","_id":"@ascodelife/react-context-provider-composer@1.2.0","_nodeVersion":"14.17.4","_npmVersion":"6.14.14","dist":{"integrity":"sha512-Q/iXgTe3DeVzJ4Lto5evgroO5VI35aOwuQKLzn37PJpzwvKC9MRvmfHR1CFsfFHRvFRaeP/u84dC6uQyozMvMw==","shasum":"36ede37d159c9ff4ace575e25aa6b4af8eaa7d77","tarball":"https://registry.npmjs.org/@ascodelife/react-context-provider-composer/-/react-context-provider-composer-1.2.0.tgz","fileCount":9,"unpackedSize":8168,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJhHR7nCRA9TVsSAnZWagAAvqEP/RALjeAjmfDZivjWlRNA\nY57vpezktv9E5w1WytWH51TjCl76sGCIFonzPJ6I9zYEmvGEQz2LKbBZU0rw\nwwR9nJmTG9bxbBNGjwLiY0/t33yIQw+RvPbZenrcdszJEAyCVUFQkAZXyV3P\n+twnoSGgP2GZdTFY70rF6tINI3OT8prMW3VeInpG9dseE5RcRgTRJMIPcNBX\nBDplCGtmrJK3N5fJNpGWCn7Sa1IICutCNAMexKxjL7GE8KehMPGUUp5IO0Pi\nNl1BDmrLA6wolnejkw7PgN9earmL3WmFAWYlQhLimcYD2FVM5fOCYlPvs55q\n62Gc44BlCmuAaFPTFoSAgpb4XJjRW6Ssa915HecaWlOmeA8w62iKOFISNwL6\nAHvKrhRZKXPsPoAitRANlgtaa6CaZ6QWEHJ1eeCbMppgfJX++10KWVj2zV/q\nJ8zqx0iVmYDqrmtSr7pe+FSSygpM+MY3iur6G9gBFPX+yyFvzZA9zL+YdgoB\nTp4sWdQVOMbcBJd7jINYPqrVpb6Iyq/m5RRuPqO73p+e6w/dN2B66DaX3K50\n5amTzDl4jihfkl6denixMQY/vX7k+iqW0JJ/cFODd6ogLuxqkZfuqT7floxU\nW/Z5cqZJ1MdRvNFD5muQUV+HUhGwesgaEXRi6Kg/qAne4YiP0FNaBSPqzcDT\n0CJf\r\n=cJel\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIDgRARqgP8CRSMijrh16RJdB/RYRGzA3IQRB6F+Ti+boAiEAt5z/MH1rSL/tkDf9N7ZVmkPiryM3SrwNJLXpk1J+yQM="}]},"_npmUser":{"name":"ascodelife","email":"394922886@qq.com"},"directories":{},"maintainers":[{"name":"ascodelife","email":"394922886@qq.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-context-provider-composer_1.2.0_1629298407345_0.11740431119181305"},"_hasShrinkwrap":false},"1.3.0":{"name":"@ascodelife/react-context-provider-composer","version":"1.3.0","description":"Compose your react context provider to solve nested hell","main":"dist/index.js","scripts":{"build":"tsc"},"author":{"name":"ascodelife"},"private":false,"license":"MIT","keywords":["npm","react","typescript","context"],"dependencies":{"react":"^17.0.2","react-dom":"^17.0.2"},"devDependencies":{"@types/react":"^17.0.18","@types/react-dom":"^17.0.9","typescript":"^4.3.5"},"gitHead":"a73b3d7653f2c6c7cfd55158e038da550b929fab","_id":"@ascodelife/react-context-provider-composer@1.3.0","_nodeVersion":"14.17.4","_npmVersion":"6.14.14","dist":{"integrity":"sha512-DKNMOwKvZmGsLtiSvj+RwxsD8P/xku94c2IFdbxMJYt4r9DNAT5QQ8czw9vOKFf4X3VuM6lJlNh4haQqZaruZQ==","shasum":"519d90bd726b5eeb0c7eba272933078a6f1df3ac","tarball":"https://registry.npmjs.org/@ascodelife/react-context-provider-composer/-/react-context-provider-composer-1.3.0.tgz","fileCount":9,"unpackedSize":8218,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJhKa8cCRA9TVsSAnZWagAALvEP/2Cu/NwK7Q2RsV1UpD3E\nhEYsDZurcpfqfTEskUlf5qm9yTGr0EGT2Ni72yr+Vc8J+8cH0Uh4phkWCCud\noskvFK53kXsXwZt0qu664dFODUCLo62L4rJx1Ht9hXy2X/q3svcPcqDyTNho\nSK/y874Bt/3KiIP+v9sO3OQ6lQAXPbFWSaDJuPHfMp+lDa3V/WyUpYFwVbad\natZUEAoNgr0XhLKExZJKMrWnkGhI6wuXkqrRPJI9JqT1kNQS3U2fU5wGwqVd\njmzkw8iG2XTiOIetrsU0LqHF7qnoySjKfXiEmGfOvD9ugBeNTfAz0VrP55Mc\nKLp4TPN96mWxlDbn2xpHIdYNS7elR55qLLeL4LqGHRctlOW7E7i0P8dPCWWS\n55pJFuYIGz6BkviqQpZkKgad47B/qeBla+3Zt25fXgrC8xTd6mmRGjUZwsdq\nvsyGW75tVdDxwP5xKc9EaNOCW3n4tCxc6Pda9gvXSZvX4qZ/B6PSNHlJUopp\notkb2hA5T2ZcroN5/oe8saRRoIylTyRKdkAnE7KUNNyVK03eaHdnqRcCphW7\ns73JFwqbsolVqKvZ4dEEneDuVDdW6yc0CLLhDjJbe9BClzJ0014yFXe2WDPY\niLUDJBrFn8u4aJDJO+EjGJBHawhm6weUn4/X+N9+tYcXiT1vosOdWwnI87dh\nTMg5\r\n=14i3\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQD/nbUtc0prw3RZonDklUGDdLvyvb/1CUXQXf07tBMQEwIgWL06B7lwQn6rT+CVCrwMNXJ+m+nkHb+jlg8FgvyDIBs="}]},"_npmUser":{"name":"ascodelife","email":"394922886@qq.com"},"directories":{},"maintainers":[{"name":"ascodelife","email":"394922886@qq.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-context-provider-composer_1.3.0_1630121756826_0.44812005928304366"},"_hasShrinkwrap":false}},"time":{"created":"2021-08-18T07:28:47.446Z","1.0.0":"2021-08-18T07:28:47.624Z","modified":"2022-04-04T15:43:10.680Z","1.1.0":"2021-08-18T10:34:05.426Z","1.1.1":"2021-08-18T11:13:56.596Z","1.2.0":"2021-08-18T14:53:27.523Z","1.3.0":"2021-08-28T03:35:56.975Z"},"maintainers":[{"name":"ascodelife","email":"394922886@qq.com"}],"description":"Compose your react context provider to solve nested hell","keywords":["npm","react","typescript","context"],"author":{"name":"ascodelife"},"license":"MIT","readme":"English | [简体中文](https://github.com/ascodelife/react-context-provider-composer/blob/master/README.zh-CN.md)\r\n\r\n# react-context-provider-composer\r\n![GitHub top language](https://img.shields.io/github/languages/top/ascodelife/react-context-provider-composer) ![GitHub](https://img.shields.io/github/license/ascodelife/react-context-provider-composer)  \r\nCompose your react context provider to solve nested hell.  \r\n[github](https://github.com/ascodelife/react-context-provider-composer)  \r\n[npm package](https://www.npmjs.com/package/@ascodelife/react-context-provider-composer)\r\n## 🤔Why We Need It \r\nWhen we have multiple context providers, we nest them at multiple levels, which will make the code structure more and more ugly and difficult to maintain. Therefore, I convert this multi-layer nesting into a one-dimensional array to call.  \r\nThe following is a bad case.\r\n\r\n\r\n```tsx\r\n<LoadingContext.Provider value={{ loading, setLoading }}>\r\n  <UserDataContext.Provider value={{ name: \"ascodelife\", age: 25 }}>\r\n    <ThemeContext.Provider value={\"light\"}>\r\n    {/* ....more Providers as long as you want */}\r\n    </ThemeContext.Provider>\r\n  </UserDataContext.Provider>\r\n</LoadingContext.Provider>\r\n```\r\n\r\n## 📦 Install\r\n\r\n```bash\r\nyarn add @ascodelife/react-context-provider-composer\r\n```\r\n\r\n## 🔨 Usage\r\n\r\n```tsx\r\nimport ContextComposer from \"@ascodelife/react-context-provider-composer\";\r\n```\r\n\r\n## 🌰 Usage Examples\r\n\r\nThis example will show how to use it simply.\r\n```tsx\r\nconst App = () => {\r\n  return (\r\n    <ContextComposer\r\n      contexts={[\r\n        <LoadingContext.Provider value={{ loading, setLoading }} />,\r\n        <UserDataContext.Provider value={{ name: \"ascodelife\", age: 25 }} />,\r\n        <ThemeContext.Provider value={\"light\"} />,\r\n      ]}\r\n    >\r\n      { children }\r\n    </ContextComposer>\r\n  );\r\n};\r\n\r\n```\r\nOr you can try the the following demo.\r\n\r\n```bash\r\ncd demo\r\nyarn\r\nyarn start\r\n```\r\n\r\n## 📚 Related article\r\nI'm sorry it's written in Chinese.  \r\n[我是如何一步步封装一个React Context Composer ](https://juejin.cn/post/6997780311488593951/)\r\n\r\n## 📃 LICENSE\r\n[MIT](https://github.com/ascodelife/react-context-provider-composer/blob/master/LICENSE)","readmeFilename":"README.md"}